2548 files changed, 212520 insertions, 209967 deletions

diff --git a/files/es/_redirects.txt b/files/es/_redirects.txt
index 5a3341f7de..4d20053064 100644
--- a/files/es/_redirects.txt
+++ b/files/es/_redirects.txt
@@ -1,15 +1,25 @@
 # FROM-URL	TO-URL
 /es/docs/AJAX	/es/docs/Web/Guide/AJAX
-/es/docs/AJAX/Comunidad	/es/docs/Web/Guide/AJAX/Comunidad
-/es/docs/AJAX/Primeros_Pasos	/es/docs/Web/Guide/AJAX/Primeros_Pasos
-/es/docs/AJAX:Comunidad	/es/docs/Web/Guide/AJAX/Comunidad
-/es/docs/AJAX:Primeros_Pasos	/es/docs/Web/Guide/AJAX/Primeros_Pasos
-/es/docs/Accesibilidad	/es/docs/Web/Accesibilidad
-/es/docs/Accesibilidad/Comunidad	/es/docs/Web/Accesibilidad/Comunidad
-/es/docs/Accesibilidad:Comunidad	/es/docs/Web/Accesibilidad/Comunidad
-/es/docs/Accessibility	/es/docs/Web/Accesibilidad
+/es/docs/AJAX/Comunidad	/es/docs/Web/Guide/AJAX/Community
+/es/docs/AJAX/Primeros_Pasos	/es/docs/Web/Guide/AJAX/Getting_Started
+/es/docs/AJAX:Comunidad	/es/docs/Web/Guide/AJAX/Community
+/es/docs/AJAX:Primeros_Pasos	/es/docs/Web/Guide/AJAX/Getting_Started
+/es/docs/Accesibilidad	/es/docs/Web/Accessibility
+/es/docs/Accesibilidad/Comunidad	/es/docs/Web/Accessibility/Community
+/es/docs/Accesibilidad:Comunidad	/es/docs/Web/Accessibility/Community
+/es/docs/Accessibility	/es/docs/Web/Accessibility
+/es/docs/Acerca_del_Modelo_de_Objetos_del_Documento	/es/docs/conflicting/Web/API/Document_Object_Model
+/es/docs/Actualizar_aplicaciones_web_para_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/Updating_web_applications
+/es/docs/Actualizar_extensiones_para_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/Updating_extensions
+/es/docs/Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3	/es/docs/orphaned/Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3
+/es/docs/Actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_Mozilla	/es/docs/orphaned/Actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_Mozilla
+/es/docs/Applying_SVG_effects_to_HTML_content	/es/docs/Web/SVG/Applying_SVG_effects_to_HTML_content
 /es/docs/ArrastrarSoltar	/en-US/docs/Web/API/HTML_Drag_and_Drop_API
-/es/docs/ArrastrarSoltar/Arrastrar_y_soltar	/es/docs/DragDrop/Drag_and_Drop
+/es/docs/ArrastrarSoltar/Arrastrar_y_soltar	/es/docs/Web/API/HTML_Drag_and_Drop_API
+/es/docs/Añadir_lectores_de_canales_a_Firefox	/es/docs/Mozilla/Firefox/Releases/2/Adding_feed_readers_to_Firefox
+/es/docs/Añadir_motores_de_búsqueda_desde_páginas_web	/es/docs/conflicting/Web/OpenSearch
+/es/docs/Bugs_importantes_solucionados_en_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/Notable_bugs_fixed
+/es/docs/Building_an_Extension	/es/docs/conflicting/Mozilla/Add-ons
 /es/docs/CSS	/es/docs/Web/CSS
 /es/docs/CSS/-moz-force-broken-image-icon	/es/docs/Web/CSS/-moz-force-broken-image-icon
 /es/docs/CSS/::selection	/es/docs/Web/CSS/::selection
@@ -26,30 +36,32 @@
 /es/docs/CSS/@import	/es/docs/Web/CSS/@import
 /es/docs/CSS/@keyframes	/es/docs/Web/CSS/@keyframes
 /es/docs/CSS/@media	/es/docs/Web/CSS/@media
-/es/docs/CSS/Comenzando_(tutorial_CSS)	/es/docs/Web/CSS/Comenzando_(tutorial_CSS)
-/es/docs/CSS/Como_iniciar	/es/docs/Web/CSS/Como_iniciar
-/es/docs/CSS/Como_iniciar/Por_que_usar_CSS	/es/docs/Web/CSS/Como_iniciar/Por_que_usar_CSS
-/es/docs/CSS/Como_iniciar/Porqué_usar_CSS	/es/docs/Web/CSS/Como_iniciar/Por_que_usar_CSS
-/es/docs/CSS/Como_iniciar/Que_es_CSS	/es/docs/Web/CSS/Como_iniciar/Que_es_CSS
-/es/docs/CSS/Consultas_multimedia	/es/docs/CSS/Media_queries
-/es/docs/CSS/Getting_Started	/es/docs/Web/CSS/Comenzando_(tutorial_CSS)
-/es/docs/CSS/Introducción	/es/docs/Web/CSS/Introducción
-/es/docs/CSS/Primeros_pasos	/es/docs/Web/CSS/Primeros_pasos
-/es/docs/CSS/Pseudoelementos	/es/docs/Web/CSS/Pseudoelementos
-/es/docs/CSS/Selectores_atributo	/es/docs/Web/CSS/Selectores_atributo
-/es/docs/CSS/Transiciones_de_CSS	/es/docs/Web/CSS/Transiciones_de_CSS
-/es/docs/CSS/Usando_animaciones_CSS	/es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS
-/es/docs/CSS/Usando_gradientes_con_CSS	/es/docs/CSS/Using_CSS_gradients
+/es/docs/CSS/Comenzando_(tutorial_CSS)	/es/docs/orphaned/Web/CSS/Comenzando_(tutorial_CSS)
+/es/docs/CSS/Como_iniciar	/es/docs/orphaned/Web/CSS/Como_iniciar
+/es/docs/CSS/Como_iniciar/Por_que_usar_CSS	/es/docs/conflicting/Learn/CSS/First_steps/How_CSS_works
+/es/docs/CSS/Como_iniciar/Porqué_usar_CSS	/es/docs/conflicting/Learn/CSS/First_steps/How_CSS_works
+/es/docs/CSS/Como_iniciar/Que_es_CSS	/es/docs/conflicting/Learn/CSS/First_steps/How_CSS_works_a460b5a76c3c2e7fc9b8da464dfd0c22
+/es/docs/CSS/Consultas_multimedia	/es/docs/Web/CSS/Media_Queries/Using_media_queries
+/es/docs/CSS/Getting_Started	/es/docs/orphaned/Web/CSS/Comenzando_(tutorial_CSS)
+/es/docs/CSS/Introducción	/es/docs/conflicting/Learn/CSS/First_steps
+/es/docs/CSS/Media_queries	/es/docs/Web/CSS/Media_Queries/Using_media_queries
+/es/docs/CSS/Primeros_pasos	/es/docs/orphaned/Web/CSS/Primeros_pasos
+/es/docs/CSS/Pseudoelementos	/es/docs/Web/CSS/Pseudo-elements
+/es/docs/CSS/Selectores_atributo	/es/docs/Web/CSS/Attribute_selectors
+/es/docs/CSS/Transiciones_de_CSS	/es/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions
+/es/docs/CSS/Usando_animaciones_CSS	/es/docs/Web/CSS/CSS_Animations/Using_CSS_animations
+/es/docs/CSS/Usando_gradientes_con_CSS	/es/docs/Web/CSS/CSS_Images/Using_CSS_gradients
+/es/docs/CSS/Using_CSS_gradients	/es/docs/Web/CSS/CSS_Images/Using_CSS_gradients
 /es/docs/CSS/Using_CSS_transforms	/es/docs/Web/CSS/CSS_Transforms/Using_CSS_transforms
 /es/docs/CSS/Uso_de_CSS_transforms	/es/docs/Web/CSS/CSS_Transforms/Using_CSS_transforms
-/es/docs/CSS/Valor_calculado	/es/docs/Web/CSS/Valor_calculado
-/es/docs/CSS/Valor_inicial	/es/docs/Web/CSS/Valor_inicial
+/es/docs/CSS/Valor_calculado	/es/docs/Web/CSS/computed_value
+/es/docs/CSS/Valor_inicial	/es/docs/Web/CSS/initial_value
 /es/docs/CSS/after	/es/docs/Web/CSS/::after
 /es/docs/CSS/animation	/es/docs/Web/CSS/animation
 /es/docs/CSS/animation-delay	/es/docs/Web/CSS/animation-delay
 /es/docs/CSS/animation-direction	/es/docs/Web/CSS/animation-direction
 /es/docs/CSS/animation-duration	/es/docs/Web/CSS/animation-duration
-/es/docs/CSS/auto	/es/docs/Web/CSS/auto
+/es/docs/CSS/auto	/es/docs/conflicting/Web/CSS/width
 /es/docs/CSS/azimuth	/es/docs/Web/CSS/azimuth
 /es/docs/CSS/background	/es/docs/Web/CSS/background
 /es/docs/CSS/background-attachment	/es/docs/Web/CSS/background-attachment
@@ -80,7 +92,7 @@
 /es/docs/CSS/capacidad_de_animacion_de_propiedades_CSS	/es/docs/Web/CSS
 /es/docs/CSS/clip	/es/docs/Web/CSS/clip
 /es/docs/CSS/color	/es/docs/Web/CSS/color
-/es/docs/CSS/computed_value	/es/docs/Web/CSS/Valor_calculado
+/es/docs/CSS/computed_value	/es/docs/Web/CSS/computed_value
 /es/docs/CSS/content	/es/docs/Web/CSS/content
 /es/docs/CSS/cursor	/es/docs/Web/CSS/cursor
 /es/docs/CSS/direction	/es/docs/Web/CSS/direction
@@ -112,15 +124,15 @@
 /es/docs/CSS/min-height	/es/docs/Web/CSS/min-height
 /es/docs/CSS/min-width	/es/docs/Web/CSS/min-width
 /es/docs/CSS/none	/es/docs/Web/CSS/float
-/es/docs/CSS/normal	/es/docs/Web/CSS/normal
+/es/docs/CSS/normal	/es/docs/conflicting/Web/CSS/font-variant
 /es/docs/CSS/number	/es/docs/Web/CSS/number
 /es/docs/CSS/opacity	/es/docs/Web/CSS/opacity
 /es/docs/CSS/overflow	/es/docs/Web/CSS/overflow
 /es/docs/CSS/perspective	/es/docs/Web/CSS/perspective
-/es/docs/CSS/porcentaje	/es/docs/Web/CSS/porcentaje
+/es/docs/CSS/porcentaje	/es/docs/Web/CSS/percentage
 /es/docs/CSS/position	/es/docs/Web/CSS/position
 /es/docs/CSS/right	/es/docs/Web/CSS/right
-/es/docs/CSS/rtl	/es/docs/Web/CSS/rtl
+/es/docs/CSS/rtl	/es/docs/orphaned/Web/CSS/rtl
 /es/docs/CSS/top	/es/docs/Web/CSS/top
 /es/docs/CSS/transform	/es/docs/Web/CSS/transform
 /es/docs/CSS/transform-origin	/es/docs/Web/CSS/transform-origin
@@ -131,10 +143,10 @@
 /es/docs/CSS/width	/es/docs/Web/CSS/width
 /es/docs/CSS/z-index	/es/docs/Web/CSS/z-index
 /es/docs/CSS::default	/es/docs/Web/CSS/:default
-/es/docs/CSS:Valor_calculado	/es/docs/Web/CSS/Valor_calculado
-/es/docs/CSS:Valor_inicial	/es/docs/Web/CSS/Valor_inicial
+/es/docs/CSS:Valor_calculado	/es/docs/Web/CSS/computed_value
+/es/docs/CSS:Valor_inicial	/es/docs/Web/CSS/initial_value
 /es/docs/CSS:after	/es/docs/Web/CSS/::after
-/es/docs/CSS:auto	/es/docs/Web/CSS/auto
+/es/docs/CSS:auto	/es/docs/conflicting/Web/CSS/width
 /es/docs/CSS:azimuth	/es/docs/Web/CSS/azimuth
 /es/docs/CSS:background	/es/docs/Web/CSS/background
 /es/docs/CSS:background-attachment	/es/docs/Web/CSS/background-attachment
@@ -157,7 +169,7 @@
 /es/docs/CSS:border-width	/es/docs/Web/CSS/border-width
 /es/docs/CSS:bottom	/es/docs/Web/CSS/bottom
 /es/docs/CSS:color	/es/docs/Web/CSS/color
-/es/docs/CSS:computed_value	/es/docs/Web/CSS/Valor_calculado
+/es/docs/CSS:computed_value	/es/docs/Web/CSS/computed_value
 /es/docs/CSS:content	/es/docs/Web/CSS/content
 /es/docs/CSS:cursor	/es/docs/Web/CSS/cursor
 /es/docs/CSS:direction	/es/docs/Web/CSS/direction
@@ -189,42 +201,59 @@
 /es/docs/CSS:min-height	/es/docs/Web/CSS/min-height
 /es/docs/CSS:min-width	/es/docs/Web/CSS/min-width
 /es/docs/CSS:none	/es/docs/Web/CSS/float
-/es/docs/CSS:normal	/es/docs/Web/CSS/normal
+/es/docs/CSS:normal	/es/docs/conflicting/Web/CSS/font-variant
 /es/docs/CSS:number	/es/docs/Web/CSS/number
 /es/docs/CSS:position	/es/docs/Web/CSS/position
 /es/docs/CSS:right	/es/docs/Web/CSS/right
-/es/docs/CSS:rtl	/es/docs/Web/CSS/rtl
+/es/docs/CSS:rtl	/es/docs/orphaned/Web/CSS/rtl
 /es/docs/CSS:top	/es/docs/Web/CSS/top
 /es/docs/CSS:vacío	/es/docs/Web/CSS/:empty
 /es/docs/CSS:visibility	/es/docs/Web/CSS/visibility
 /es/docs/CSS:width	/es/docs/Web/CSS/width
-/es/docs/Complementos_de_Firefox._Guia_del_desarrollador	/es/docs/Guía_para_el_desarrollador_de_agregados_para_Firefox
+/es/docs/CSS_dinámico	/es/docs/orphaned/CSS_dinámico
+/es/docs/Cadenas_del_User_Agent_de_Gecko	/es/docs/Web/HTTP/Headers/User-Agent/Firefox
+/es/docs/Code_snippets	/es/docs/orphaned/Code_snippets
+/es/docs/Code_snippets/Pestañas_del_navegador	/es/docs/orphaned/Code_snippets/Pestañas_del_navegador
+/es/docs/Columnas_con_CSS-3	/es/docs/Web/CSS/CSS_Columns/Using_multi-column_layouts
+/es/docs/Compilar_e_instalar	/es/docs/Mozilla/Developer_guide/Build_Instructions
+/es/docs/Complementos_de_Firefox._Guia_del_desarrollador	/es/docs/orphaned/Guía_para_el_desarrollador_de_agregados_para_Firefox
+/es/docs/Configurar_correctamente_los_tipos_MIME_del_servidor	/es/docs/Learn/Server-side/Configuring_server_MIME_types
+/es/docs/Control_de_la_corrección_ortográfica_en_formularios_HTML	/es/docs/conflicting/Web/HTML/Global_attributes/spellcheck
 /es/docs/Core_JavaScript_1.5_Guide	/es/docs/Web/JavaScript/Guide
 /es/docs/Core_JavaScript_1.5_Guide/Calling_Functions	/es/docs/Web/JavaScript/Guide/Funciones#Llamando_funciones
-/es/docs/Core_JavaScript_1.5_Guide/Defining_Functions	/es/docs/Web/JavaScript/Guide/Funciones
-/es/docs/Core_JavaScript_1.5_Guide/Operators	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Core_JavaScript_1.5_Guide/Operators/Special_Operators	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Core_JavaScript_1.5_Guide/Predefined_Core_Objects	/es/docs/Web/JavaScript/Referencia
-/es/docs/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Objeto_Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
+/es/docs/Core_JavaScript_1.5_Guide/Defining_Functions	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/Core_JavaScript_1.5_Guide/Operators	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Core_JavaScript_1.5_Guide/Operators/Special_Operators	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Core_JavaScript_1.5_Guide/Predefined_Core_Objects	/es/docs/Web/JavaScript/Reference
+/es/docs/Core_JavaScript_1.5_Guide/Predefined_Core_Objects/Objeto_Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
 /es/docs/Core_JavaScript_1.5_Guide:Calling_Functions	/es/docs/Web/JavaScript/Guide/Funciones#Llamando_funciones
-/es/docs/Core_JavaScript_1.5_Guide:Defining_Functions	/es/docs/Web/JavaScript/Guide/Funciones
-/es/docs/Core_JavaScript_1.5_Guide:Operators:Special_Operators	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Core_JavaScript_1.5_Guide:Predefined_Core_Objects:Objeto_Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/Core_JavaScript_1.5_Reference	/es/docs/Web/JavaScript/Referencia
-/es/docs/Core_JavaScript_1.5_Reference/Objects	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Core_JavaScript_1.5_Reference/Objects/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Core_JavaScript_1.5_Reference/Objects/String/small	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/small
-/es/docs/Core_JavaScript_1.5_Reference:Objects:String:small	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/small
-/es/docs/Creación_de_Componentes_XPCOM:Interior_del_Componente	/es/docs/Creación_de_Componentes_XPCOM/Interior_del_Componente
-/es/docs/Creación_de_Componentes_XPCOM:Prefacio	/es/docs/Creación_de_Componentes_XPCOM/Prefacio
+/es/docs/Core_JavaScript_1.5_Guide:Defining_Functions	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/Core_JavaScript_1.5_Guide:Operators:Special_Operators	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Core_JavaScript_1.5_Guide:Predefined_Core_Objects:Objeto_Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/Core_JavaScript_1.5_Reference	/es/docs/Web/JavaScript/Reference
+/es/docs/Core_JavaScript_1.5_Reference/Objects	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Core_JavaScript_1.5_Reference/Objects/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Core_JavaScript_1.5_Reference/Objects/String/small	/es/docs/Web/JavaScript/Reference/Global_Objects/String/small
+/es/docs/Core_JavaScript_1.5_Reference:Objects:String:small	/es/docs/Web/JavaScript/Reference/Global_Objects/String/small
+/es/docs/Creacion_de_plugins_OpenSearch_para_Firefox	/es/docs/Web/OpenSearch
+/es/docs/Creación_de_Componentes_XPCOM/Interior_del_Componente	/es/docs/orphaned/Creación_de_Componentes_XPCOM/Interior_del_Componente
+/es/docs/Creación_de_Componentes_XPCOM/Prefacio	/es/docs/orphaned/Creación_de_Componentes_XPCOM/Prefacio
+/es/docs/Creación_de_Componentes_XPCOM:Interior_del_Componente	/es/docs/orphaned/Creación_de_Componentes_XPCOM/Interior_del_Componente
+/es/docs/Creación_de_Componentes_XPCOM:Prefacio	/es/docs/orphaned/Creación_de_Componentes_XPCOM/Prefacio
 /es/docs/Creación_de_Componentes_XPCOM:Un_vistazo_de_XPCOM	/es/docs/Creación_de_Componentes_XPCOM/Un_vistazo_de_XPCOM
 /es/docs/Creación_de_Componentes_XPCOM:Uso_de_Componentes_XPCOM	/es/docs/Creación_de_Componentes_XPCOM/Uso_de_Componentes_XPCOM
 /es/docs/Creando_Componentes_XPCOM	/es/docs/Creación_de_Componentes_XPCOM
 /es/docs/Creando_un_skin_para_Firefox	/es/docs/Creando_un_tema_para_Firefox
 /es/docs/Creando_un_skin_para_Firefox:UUID	/es/docs/Creando_un_skin_para_Firefox/UUID
 /es/docs/Creando_un_skin_para_Firefox:_Como_empezar	/es/docs/Creando_un_skin_para_Firefox/Como_empezar
+/es/docs/Creando_una_extensión	/es/docs/orphaned/Creando_una_extensión
 /es/docs/Crear_una_barra_lateral_en_Firefox	/es/docs/Crear_un_panel_lateral_en_Firefox
-/es/docs/Código_fuente_de_Mozilla_(CVS)	/es/docs/Mozilla/Developer_guide/Source_Code/Código_fuente_de_Mozilla_(CVS)
+/es/docs/Crear_una_extensión_personalizada_de_Firefox_con_el_Mozilla_Build_System	/es/docs/orphaned/Crear_una_extensión_personalizada_de_Firefox_con_el_Mozilla_Build_System
+/es/docs/Código_fuente_de_Mozilla_(CVS)	/es/docs/Mozilla/Developer_guide/Source_Code/CVS
+/es/docs/DHTML	/es/docs/Glossary/DHTML
+/es/docs/DHTML_Demostraciones_del_uso_de_DOM_Style	/es/docs/orphaned/DHTML_Demostraciones_del_uso_de_DOM_Style
+/es/docs/DOM	/es/docs/conflicting/Web/API/Document_Object_Model_7d961b8030c6099ee907f4f4b5fe6b3d
+/es/docs/DOM/Almacenamiento	/es/docs/conflicting/Web/API/Web_Storage_API
 /es/docs/DOM/CSS	/es/docs/Web/CSS
 /es/docs/DOM/CameraCapabilities	/es/docs/Web/API/CameraCapabilities
 /es/docs/DOM/CameraCapabilities.effects	/es/docs/Web/API/CameraCapabilities/effects
@@ -234,12 +263,14 @@
 /es/docs/DOM/CssRule.cssText	/es/docs/Web/API/CSSRule/cssText
 /es/docs/DOM/CssRule.parentStyleSheet	/es/docs/Web/API/CSSRule/parentStyleSheet
 /es/docs/DOM/CssRule.selectorText	/es/docs/Web/API/CSSStyleRule/selectorText
-/es/docs/DOM/Document.styleSheets	/es/docs/Web/API/Document/styleSheets
+/es/docs/DOM/Document.styleSheets	/es/docs/Web/API/DocumentOrShadowRoot/styleSheets
 /es/docs/DOM/Element.setAttribute	/es/docs/Web/API/Element/setAttribute
-/es/docs/DOM/Element.style	/es/docs/Web/API/HTMLElement/style
+/es/docs/DOM/Element.style	/es/docs/Web/API/ElementCSSInlineStyle/style
 /es/docs/DOM/HTMLAudioElement	/es/docs/Web/API/HTMLAudioElement
 /es/docs/DOM/HTMLTableElement	/es/docs/Web/API/HTMLTableElement
-/es/docs/DOM/Manipulating_the_browser_history	/es/docs/DOM/Manipulando_el_historial_del_navegador
+/es/docs/DOM/Manipulando_el_historial_del_navegador	/es/docs/Web/API/History_API
+/es/docs/DOM/Manipulando_el_historial_del_navegador/Ejemplo	/es/docs/Web/API/History_API/Example
+/es/docs/DOM/Manipulating_the_browser_history	/es/docs/Web/API/History_API
 /es/docs/DOM/MozSocial.closePanel	/es/docs/Web/API/MozSocial/closePanel
 /es/docs/DOM/MozSocial.getAttention	/es/docs/Web/API/MozSocial/getAttention
 /es/docs/DOM/MozSocial.getWorker	/es/docs/Web/API/MozSocial/getWorker
@@ -282,6 +313,7 @@
 /es/docs/DOM/Stylesheet.title	/es/docs/Web/API/StyleSheet/title
 /es/docs/DOM/Stylesheet.type	/es/docs/Web/API/StyleSheet/type
 /es/docs/DOM/Stylesheet_object	/es/docs/Web/API/CSSStyleSheet
+/es/docs/DOM/Touch_events	/es/docs/Web/API/Touch_events
 /es/docs/DOM/Window.getComputedStyle	/es/docs/Web/API/Window/getComputedStyle
 /es/docs/DOM/document	/es/docs/Web/API/Document
 /es/docs/DOM/document.URL	/es/docs/Web/API/Document/URL
@@ -291,6 +323,7 @@
 /es/docs/DOM/document.bgColor	/es/docs/Web/API/Document/bgColor
 /es/docs/DOM/document.body	/es/docs/Web/API/Document/body
 /es/docs/DOM/document.characterSet	/es/docs/Web/API/Document/characterSet
+/es/docs/DOM/document.cookie	/es/docs/Web/API/Document/cookie
 /es/docs/DOM/document.createRange	/es/docs/Web/API/Document/createRange
 /es/docs/DOM/document.documentElement	/es/docs/Web/API/Document/documentElement
 /es/docs/DOM/document.documentURIObject	/es/docs/Web/API/Document/documentURIObject
@@ -332,13 +365,13 @@
 /es/docs/DOM/window.applicationCache	/es/docs/Web/API/Window/applicationCache
 /es/docs/DOM/window.fullScreen	/es/docs/Web/API/Window/fullScreen
 /es/docs/DOM/window.getSelection	/es/docs/Web/API/Window/getSelection
-/es/docs/DOM/window.navigator.geolocation	/es/docs/Web/API/NavigatorGeolocation/geolocation
+/es/docs/DOM/window.navigator.geolocation	/es/docs/Web/API/Navigator/geolocation
 /es/docs/DOM/window.navigator.registerProtocolHandler	/es/docs/Web/API/Navigator/registerProtocolHandler
 /es/docs/DOM/window.navigator.vibrate	/es/docs/Web/API/Navigator/vibrate
 /es/docs/DOM/window.onload	/es/docs/Web/API/GlobalEventHandlers/onload
-/es/docs/DOM/window.onunload	/es/docs/Web/API/GlobalEventHandlers/onunload
+/es/docs/DOM/window.onunload	/es/docs/Web/API/WindowEventHandlers/onunload
 /es/docs/DOM/window.requestAnimationFrame	/es/docs/Web/API/Window/requestAnimationFrame
-/es/docs/DOM:Almacenamiento	/es/docs/DOM/Almacenamiento
+/es/docs/DOM:Almacenamiento	/es/docs/conflicting/Web/API/Web_Storage_API
 /es/docs/DOM:Selection:addRange	/es/docs/Web/API/Selection/addRange
 /es/docs/DOM:Selection:anchorNode	/es/docs/Web/API/Selection/anchorNode
 /es/docs/DOM:Selection:anchorOffset	/es/docs/Web/API/Selection/anchorOffset
@@ -365,7 +398,7 @@
 /es/docs/DOM:document.bgColor	/es/docs/Web/API/Document/bgColor
 /es/docs/DOM:document.body	/es/docs/Web/API/Document/body
 /es/docs/DOM:document.characterSet	/es/docs/Web/API/Document/characterSet
-/es/docs/DOM:document.cookie	/es/docs/DOM/document.cookie
+/es/docs/DOM:document.cookie	/es/docs/Web/API/Document/cookie
 /es/docs/DOM:document.createRange	/es/docs/Web/API/Document/createRange
 /es/docs/DOM:document.documentElement	/es/docs/Web/API/Document/documentElement
 /es/docs/DOM:document.documentURIObject	/es/docs/Web/API/Document/documentURIObject
@@ -403,10 +436,20 @@
 /es/docs/DOM:window.fullScreen	/es/docs/Web/API/Window/fullScreen
 /es/docs/DOM:window.getSelection	/es/docs/Web/API/Window/getSelection
 /es/docs/DOM:window.navigator.registerProtocolHandler	/es/docs/Web/API/Navigator/registerProtocolHandler
+/es/docs/DOM_Inspector	/es/docs/orphaned/Tools/Add-ons/DOM_Inspector
+/es/docs/Desarrollando_Mozilla	/es/docs/orphaned/Desarrollando_Mozilla
+/es/docs/Desarrollo_Web	/es/docs/conflicting/Web/Guide
 /es/docs/Detección_del_navegador_y_soporte_entre_ellos	/es/docs/Detección_del_navegador_y_cobertura_a_múltiples_navegadores
+/es/docs/Detectar_la_orientación_del_dispositivo	/es/docs/orphaned/Detectar_la_orientación_del_dispositivo
 /es/docs/Developer_Guide	/es/docs/Mozilla/Developer_guide
 /es/docs/Developer_Guide/Source_Code	/es/docs/Mozilla/Developer_guide/Source_Code
-/es/docs/Drawing_text_using_a_canvas	/es/docs/Dibujar_texto_usando_canvas
+/es/docs/Dibujando_Gráficos_con_Canvas	/es/docs/orphaned/Dibujando_Gráficos_con_Canvas
+/es/docs/Dibujar_texto_usando_canvas	/es/docs/Web/API/Canvas_API/Tutorial/Drawing_text
+/es/docs/DragDrop	/es/docs/conflicting/Web/API/HTML_Drag_and_Drop_API
+/es/docs/DragDrop/Drag_and_Drop	/es/docs/Web/API/HTML_Drag_and_Drop_API
+/es/docs/DragDrop/Drag_and_Drop/drag_and_drop_archivo	/es/docs/Web/API/HTML_Drag_and_Drop_API/File_drag_and_drop
+/es/docs/DragDrop/Recommended_Drag_Types	/es/docs/Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types
+/es/docs/Drawing_text_using_a_canvas	/es/docs/Web/API/Canvas_API/Tutorial/Drawing_text
 /es/docs/EXSLT	/es/docs/Web/EXSLT
 /es/docs/EXSLT/exsl	/es/docs/Web/EXSLT/exsl
 /es/docs/EXSLT/exsl/node-set	/es/docs/Web/EXSLT/exsl/node-set
@@ -449,9 +492,13 @@
 /es/docs/EXSLT:str:concat	/es/docs/Web/EXSLT/str/concat
 /es/docs/EXSLT:str:split	/es/docs/Web/EXSLT/str/split
 /es/docs/EXSLT:str:tokenize	/es/docs/Web/EXSLT/str/tokenize
-/es/docs/Errores_notables_corregidos_en_Firefox_3	/es/docs/Bugs_importantes_solucionados_en_Firefox_3
-/es/docs/Eventos_online_y_offline	/es/docs/Web/API/NavigatorOnLine/Eventos_online_y_offline
+/es/docs/Errores_notables_corregidos_en_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/Notable_bugs_fixed
+/es/docs/Estructura_de_directorios_de_código_fuente_de_Mozilla	/es/docs/orphaned/Estructura_de_directorios_de_código_fuente_de_Mozilla
+/es/docs/Etiquetas_audio_y_video_en_Firefox	/es/docs/orphaned/Etiquetas_audio_y_video_en_Firefox
+/es/docs/Eventos_online_y_offline	/es/docs/Web/API/NavigatorOnLine/Online_and_offline_events
+/es/docs/Extensiones/Actualización_de_extensiones_para_Firefox_4	/es/docs/orphaned/Extensiones/Actualización_de_extensiones_para_Firefox_4
 /es/docs/Extensión_Firebug_(externo)	https://addons.mozilla.org/extensions/moreinfo.php?id=1843&application=firefox
+/es/docs/FAQ_Incrustando_Mozilla	/es/docs/orphaned/FAQ_Incrustando_Mozilla
 /es/docs/FUEL:Annotations	/es/docs/FUEL/Annotations
 /es/docs/FUEL:Application	/es/docs/FUEL/Application
 /es/docs/FUEL:Bookmark	/es/docs/FUEL/Bookmark
@@ -467,21 +514,114 @@
 /es/docs/FUEL:PreferenceBranch	/es/docs/FUEL/PreferenceBranch
 /es/docs/FUEL:SessionStorage	/es/docs/FUEL/SessionStorage
 /es/docs/FUEL:Window	/es/docs/FUEL/Window
-/es/docs/Firefox_1.5	/es/docs/Firefox_1.5_para_Desarrolladores
-/es/docs/Firefox_2	/es/docs/Firefox_2_para_desarrolladores
-/es/docs/Firefox_3.1_para_desarrolladores	/es/docs/Firefox_3.5_para_desarrolladores
-/es/docs/Firefox_3.5_para_desarrolladores/Firefox_3.1_para_desarrolladores	/es/docs/Firefox_3.5_para_desarrolladores
-/es/docs/Firefox_3.5_para_desarrolladores/Firefox_3.5_para_desarrolladores	/es/docs/Firefox_3.5_para_desarrolladores
-/es/docs/Firefox_addons_developer_guide/Introduction_to_Extensions-redirect-1	/es/docs/Firefox_addons_developer_guide/Introduction_to_Extensions
+/es/docs/Firefox_1.5	/es/docs/Mozilla/Firefox/Releases/1.5
+/es/docs/Firefox_1.5_para_Desarrolladores	/es/docs/Mozilla/Firefox/Releases/1.5
+/es/docs/Firefox_19_para_desarrolladores	/es/docs/Mozilla/Firefox/Releases/19
+/es/docs/Firefox_2	/es/docs/Mozilla/Firefox/Releases/2
+/es/docs/Firefox_2_para_desarrolladores	/es/docs/Mozilla/Firefox/Releases/2
+/es/docs/Firefox_3.1_para_desarrolladores	/es/docs/Mozilla/Firefox/Releases/3.5
+/es/docs/Firefox_3.5_para_desarrolladores	/es/docs/Mozilla/Firefox/Releases/3.5
+/es/docs/Firefox_3.5_para_desarrolladores/Firefox_3.1_para_desarrolladores	/es/docs/Mozilla/Firefox/Releases/3.5
+/es/docs/Firefox_3.5_para_desarrolladores/Firefox_3.5_para_desarrolladores	/es/docs/Mozilla/Firefox/Releases/3.5
+/es/docs/Firefox_3_para_desarrolladores	/es/docs/Mozilla/Firefox/Releases/3
+/es/docs/Firefox_addons_developer_guide/Introduction_to_Extensions	/es/docs/orphaned/Firefox_addons_developer_guide/Introduction_to_Extensions
+/es/docs/Firefox_addons_developer_guide/Introduction_to_Extensions-redirect-1	/es/docs/orphaned/Firefox_addons_developer_guide/Introduction_to_Extensions
+/es/docs/Firefox_addons_developer_guide/Technologies_used_in_developing_extensions	/es/docs/orphaned/Firefox_addons_developer_guide/Technologies_used_in_developing_extensions
 /es/docs/Firefox_en_Android	/es/docs/Mozilla/Firefox_para_Android
+/es/docs/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio	/es/docs/orphaned/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio
+/es/docs/Fragmentos_de_código	/es/docs/orphaned/Fragmentos_de_código
+/es/docs/Funciones	/es/docs/orphaned/Funciones
+/es/docs/Games/Herramients	/es/docs/Games/Tools
+/es/docs/Games/Herramients/asm.js	/es/docs/Games/Tools/asm.js
+/es/docs/Games/Introduccion	/es/docs/Games/Introduction
+/es/docs/Games/Introducción_al_desarrollo_de_juegos_HTML5_(resumen)	/es/docs/Games/Introduction_to_HTML5_Game_Development
+/es/docs/Games/Publishing_games/Monetización_de_los_juegos	/es/docs/Games/Publishing_games/Game_monetization
+/es/docs/Games/Tutorials/2D_breakout_game_Phaser/Botones	/es/docs/Games/Tutorials/2D_breakout_game_Phaser/Buttons
+/es/docs/Games/Tutorials/2D_breakout_game_Phaser/Rebotar_en_las_paredes	/es/docs/Games/Tutorials/2D_breakout_game_Phaser/Bounce_off_the_walls
+/es/docs/Games/Workflows	/es/docs/Games/Tutorials
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Mouse_controls
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Collision_detection
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Game_over
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Move_the_ball
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Finishing_up
+/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win	/es/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win
+/es/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation	/es/docs/Games/Tutorials/HTML5_Gamedev_Phaser_Device_Orientation
 /es/docs/Garantía_de_Calidad	/es/docs/QA
+/es/docs/Generación_de_GUIDs	/es/docs/orphaned/Generación_de_GUIDs
 /es/docs/Gestión_del_foco_en_HTML	/es/docs/Web/API/Document/hasFocus
 /es/docs/Glossary/AOM	/es/docs/Glossary/Accessibility_tree
+/es/docs/Glossary/Algoritmo	/es/docs/Glossary/Algorithm
+/es/docs/Glossary/Argumento	/es/docs/Glossary/Argument
+/es/docs/Glossary/Arquitectura_de_la_información	/es/docs/Glossary/Information_architecture
+/es/docs/Glossary/Arreglos	/es/docs/Glossary/array
+/es/docs/Glossary/Asíncrono	/es/docs/Glossary/Asynchronous
+/es/docs/Glossary/Atributo	/es/docs/Glossary/Attribute
+/es/docs/Glossary/Atributo_global	/es/docs/conflicting/Web/HTML/Global_attributes
+/es/docs/Glossary/CID	/es/docs/Glossary/CIA
+/es/docs/Glossary/Cabecera_general	/es/docs/Glossary/General_header
+/es/docs/Glossary/Caché	/es/docs/Glossary/Cache
+/es/docs/Glossary/Caracter	/es/docs/Glossary/Character
+/es/docs/Glossary/Cifrado	/es/docs/Glossary/Cipher
+/es/docs/Glossary/Clasificación_por_tarjetas_(card_sorting)	/es/docs/Glossary/Card_sorting
+/es/docs/Glossary/Clausura	/es/docs/Glossary/Closure
+/es/docs/Glossary/Clave	/es/docs/Glossary/Key
+/es/docs/Glossary/Constante	/es/docs/Glossary/Constant
+/es/docs/Glossary/Criptoanálisis	/es/docs/Glossary/Cryptanalysis
+/es/docs/Glossary/Criptografía	/es/docs/Glossary/Cryptography
+/es/docs/Glossary/DTD	/es/docs/conflicting/Glossary/Doctype
+/es/docs/Glossary/Descifrado	/es/docs/Glossary/Decryption
+/es/docs/Glossary/Encriptación	/es/docs/Glossary/Encryption
+/es/docs/Glossary/Entidad	/es/docs/Glossary/Entity
+/es/docs/Glossary/Espacio_en_blanco	/es/docs/Glossary/Whitespace
+/es/docs/Glossary/Estructura_de_datos	/es/docs/Glossary/Data_structure
+/es/docs/Glossary/Funcion_de_primera_clase	/es/docs/Glossary/First-class_Function
+/es/docs/Glossary/Función	/es/docs/Glossary/Function
+/es/docs/Glossary/Hilo_principal	/es/docs/Glossary/Main_thread
+/es/docs/Glossary/IU	/es/docs/Glossary/UI
+/es/docs/Glossary/Identificador	/es/docs/Glossary/Identifier
+/es/docs/Glossary/Inmutable	/es/docs/Glossary/Immutable
+/es/docs/Glossary/Metadato	/es/docs/Glossary/Metadata
+/es/docs/Glossary/Método	/es/docs/Glossary/Method
+/es/docs/Glossary/Nombre_de_dominio	/es/docs/Glossary/Domain_name
+/es/docs/Glossary/Nombre_de_encabezado_prohibido	/es/docs/Glossary/Forbidden_header_name
+/es/docs/Glossary/Numero	/es/docs/Glossary/Number
+/es/docs/Glossary/Objecto	/es/docs/Glossary/Object
+/es/docs/Glossary/Operador	/es/docs/Glossary/Operator
+/es/docs/Glossary/Operando	/es/docs/Glossary/Operand
+/es/docs/Glossary/Pila_llamadas	/es/docs/Glossary/Call_stack
+/es/docs/Glossary/Preflight_peticion	/es/docs/Glossary/Preflight_request
+/es/docs/Glossary/Preprocesador_CSS	/es/docs/Glossary/CSS_preprocessor
+/es/docs/Glossary/Primitivo	/es/docs/Glossary/Primitive
+/es/docs/Glossary/Pseudo-clase	/es/docs/Glossary/Pseudo-class
+/es/docs/Glossary/Pseudocódigo	/es/docs/Glossary/Pseudocode
+/es/docs/Glossary/Recursión	/es/docs/Glossary/Recursion
+/es/docs/Glossary/SCV	/es/docs/Glossary/SCM
+/es/docs/Glossary/Sentencias	/es/docs/Glossary/Statement
+/es/docs/Glossary/Sincronico	/es/docs/Glossary/Synchronous
+/es/docs/Glossary/Sistema_gestion_contenidos	/es/docs/Glossary/CMS
+/es/docs/Glossary/TextoCifrado	/es/docs/Glossary/Ciphertext
+/es/docs/Glossary/TextoSimple	/es/docs/Glossary/Plaintext
+/es/docs/Glossary/Tipado_dinámico	/es/docs/Glossary/Dynamic_typing
+/es/docs/Glossary/Tipificación_estática	/es/docs/Glossary/Static_typing
+/es/docs/Glossary/Validador	/es/docs/Glossary/Validator
+/es/docs/Glossary/Valor	/es/docs/Glossary/Value
+/es/docs/Glossary/XForm	/es/docs/Glossary/XForms
+/es/docs/Glossary/coercion	/es/docs/Glossary/Type_coercion
+/es/docs/Glossary/conjunto_de_caracteres	/es/docs/Glossary/character_set
+/es/docs/Glossary/elemento	/es/docs/orphaned/Glossary/elemento
+/es/docs/Glossary/miga-de-pan	/es/docs/Glossary/Breadcrumb
+/es/docs/Glossary/propiedad	/es/docs/Glossary/property
+/es/docs/Glossary/seguro	/es/docs/Glossary/safe
 /es/docs/Glossary/undefined_es	/es/docs/Glossary/undefined
 /es/docs/Guía_JavaScript_1.5	/es/docs/Web/JavaScript/Guide
-/es/docs/Guía_JavaScript_1.5/Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/Guía_JavaScript_1.5/Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/Guía_JavaScript_1.5/Constantes	/es/docs/Web/JavaScript/Referencia/Sentencias/const
+/es/docs/Guía_JavaScript_1.5/Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Guía_JavaScript_1.5/Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Guía_JavaScript_1.5/Constantes	/es/docs/Web/JavaScript/Reference/Statements/const
 /es/docs/Guía_JavaScript_1.5/Crear_nuevos_objetos	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Creando_nuevos_objetos
 /es/docs/Guía_JavaScript_1.5/Crear_nuevos_objetos/Borrando_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Eliminando_propiedades
 /es/docs/Guía_JavaScript_1.5/Crear_nuevos_objetos/Definiendo_las_funciones_get_y_set	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Definiendo_getters_y_setters
@@ -493,7 +633,7 @@
 /es/docs/Guía_JavaScript_1.5/Crear_nuevos_objetos/Using_Object_Initializers	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/Guía_JavaScript_1.5/Crear_nuevos_objetos/Utilizando_Objetos_Iniciadores	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/Guía_JavaScript_1.5/Crear_una_expresión_regular	/es/docs/Web/JavaScript/Guide/Regular_Expressions
-/es/docs/Guía_JavaScript_1.5/Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/Guía_JavaScript_1.5/Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/Guía_JavaScript_1.5/El_ejemplo_Empleado	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/Guía_JavaScript_1.5/El_ejemplo_Employee	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/Guía_JavaScript_1.5/El_ejemplo_Employee/Constructores_más_flexibles	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Constructores_mas_flexibles
@@ -520,15 +660,15 @@
 /es/docs/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Herencia_no_múltiple	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#No_existe_herencia_multiple
 /es/docs/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Información_global_en_los_constructores	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Informacion_global_en_los_constructores
 /es/docs/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Valores_locales_frente_a_los_heredados	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Valores_locales_frente_a_valores_heredados
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos	/es/docs/Web/JavaScript/Referencia
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Math	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Number	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos	/es/docs/Web/JavaScript/Reference
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
 /es/docs/Guía_JavaScript_1.5/Objetos_y_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Objetos_y_propiedades
 /es/docs/Guía_JavaScript_1.5/Operadores	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores
 /es/docs/Guía_JavaScript_1.5/Operadores/Operadores_aritméticos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_aritm.C3.A9ticos
@@ -538,10 +678,10 @@
 /es/docs/Guía_JavaScript_1.5/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Special_operators
 /es/docs/Guía_JavaScript_1.5/Operadores/Operadores_lógicos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_l.C3.B3gicos
 /es/docs/Guía_JavaScript_1.5/Operadores/Operadores_sobre_bits	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_Bit-a-bit
-/es/docs/Guía_JavaScript_1.5/Predefined_Functions	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Guía_JavaScript_1.5/Predefined_Functions/eval_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
+/es/docs/Guía_JavaScript_1.5/Predefined_Functions	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Guía_JavaScript_1.5/Predefined_Functions/eval_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
 /es/docs/Guía_JavaScript_1.5/Sentencia_condicional	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Condicionales
-/es/docs/Guía_JavaScript_1.5/Sentencia_de_bloque	/es/docs/Web/JavaScript/Referencia/Sentencias/block
+/es/docs/Guía_JavaScript_1.5/Sentencia_de_bloque	/es/docs/Web/JavaScript/Reference/Statements/block
 /es/docs/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Utilizing_Error_objects
 /es/docs/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones/throw	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#throw_statement
 /es/docs/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones/try...catch	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#try...catch_statement
@@ -552,13 +692,13 @@
 /es/docs/Guía_JavaScript_1.5/Trabajar_con_expresiones_regulares/Ejemplos_de_expresiones_regulares	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/Guía_JavaScript_1.5/Trabajar_con_expresiones_regulares/Usar_coincidencias_de_subcadenas_parentizadas	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/Guía_JavaScript_1.5/Unicode	/en-US/docs/Web/JavaScript/Reference/Lexical_grammar
-/es/docs/Guía_JavaScript_1.5/Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Funciones
-/es/docs/Guía_JavaScript_1.5/Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/Guía_JavaScript_1.5/Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/Guía_JavaScript_1.5/Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/Guía_JavaScript_1.5/Valores	/es/docs/Web/JavaScript/Guide/Grammar_and_types
 /es/docs/Guía_JavaScript_1.5/Variables	/es/docs/Web/JavaScript/Guide/Grammar_and_types
-/es/docs/Guía_JavaScript_1.5:Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/Guía_JavaScript_1.5:Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/Guía_JavaScript_1.5:Constantes	/es/docs/Web/JavaScript/Referencia/Sentencias/const
+/es/docs/Guía_JavaScript_1.5:Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Guía_JavaScript_1.5:Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Guía_JavaScript_1.5:Constantes	/es/docs/Web/JavaScript/Reference/Statements/const
 /es/docs/Guía_JavaScript_1.5:Crear_nuevos_objetos	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Creando_nuevos_objetos
 /es/docs/Guía_JavaScript_1.5:Crear_nuevos_objetos:Borrando_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Eliminando_propiedades
 /es/docs/Guía_JavaScript_1.5:Crear_nuevos_objetos:Definiendo_las_funciones_get_y_set	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Definiendo_getters_y_setters
@@ -570,7 +710,7 @@
 /es/docs/Guía_JavaScript_1.5:Crear_nuevos_objetos:Using_Object_Initializers	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/Guía_JavaScript_1.5:Crear_nuevos_objetos:Utilizando_Objetos_Iniciadores	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/Guía_JavaScript_1.5:Crear_una_expresión_regular	/es/docs/Web/JavaScript/Guide/Regular_Expressions
-/es/docs/Guía_JavaScript_1.5:Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/Guía_JavaScript_1.5:Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/Guía_JavaScript_1.5:El_ejemplo_Empleado	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/Guía_JavaScript_1.5:El_ejemplo_Employee	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/Guía_JavaScript_1.5:El_ejemplo_Employee:Constructores_más_flexibles	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Constructores_mas_flexibles
@@ -597,15 +737,15 @@
 /es/docs/Guía_JavaScript_1.5:Más_sobre_la_herencia_de_propiedades:Herencia_no_múltiple	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#No_existe_herencia_multiple
 /es/docs/Guía_JavaScript_1.5:Más_sobre_la_herencia_de_propiedades:Información_global_en_los_constructores	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Informacion_global_en_los_constructores
 /es/docs/Guía_JavaScript_1.5:Más_sobre_la_herencia_de_propiedades:Valores_locales_frente_a_los_heredados	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Valores_locales_frente_a_valores_heredados
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos	/es/docs/Web/JavaScript/Referencia
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Math	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Number	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos	/es/docs/Web/JavaScript/Reference
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/Guía_JavaScript_1.5:Objetos_base_predefinidos:Objeto_String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
 /es/docs/Guía_JavaScript_1.5:Objetos_y_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Objetos_y_propiedades
 /es/docs/Guía_JavaScript_1.5:Operadores	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores
 /es/docs/Guía_JavaScript_1.5:Operadores:Operadores_aritméticos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_aritm.C3.A9ticos
@@ -615,9 +755,9 @@
 /es/docs/Guía_JavaScript_1.5:Operadores:Operadores_especiales	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Special_operators
 /es/docs/Guía_JavaScript_1.5:Operadores:Operadores_lógicos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_l.C3.B3gicos
 /es/docs/Guía_JavaScript_1.5:Operadores:Operadores_sobre_bits	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_Bit-a-bit
-/es/docs/Guía_JavaScript_1.5:Predefined_Functions:eval_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
+/es/docs/Guía_JavaScript_1.5:Predefined_Functions:eval_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
 /es/docs/Guía_JavaScript_1.5:Sentencia_condicional	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Condicionales
-/es/docs/Guía_JavaScript_1.5:Sentencia_de_bloque	/es/docs/Web/JavaScript/Referencia/Sentencias/block
+/es/docs/Guía_JavaScript_1.5:Sentencia_de_bloque	/es/docs/Web/JavaScript/Reference/Statements/block
 /es/docs/Guía_JavaScript_1.5:Sentencias_de_manejo_de_excepciones	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Utilizing_Error_objects
 /es/docs/Guía_JavaScript_1.5:Sentencias_de_manejo_de_excepciones:throw	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#throw_statement
 /es/docs/Guía_JavaScript_1.5:Sentencias_de_manejo_de_excepciones:try...catch	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#try...catch_statement
@@ -628,227 +768,245 @@
 /es/docs/Guía_JavaScript_1.5:Trabajar_con_expresiones_regulares:Ejemplos_de_expresiones_regulares	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/Guía_JavaScript_1.5:Trabajar_con_expresiones_regulares:Usar_coincidencias_de_subcadenas_parentizadas	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/Guía_JavaScript_1.5:Unicode	/en-US/docs/Web/JavaScript/Reference/Lexical_grammar
-/es/docs/Guía_JavaScript_1.5:Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Funciones
-/es/docs/Guía_JavaScript_1.5:Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/Guía_JavaScript_1.5:Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/Guía_JavaScript_1.5:Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/Guía_JavaScript_1.5:Valores	/es/docs/Web/JavaScript/Guide/Grammar_and_types
 /es/docs/Guía_JavaScript_1.5:Variables	/es/docs/Web/JavaScript/Guide/Grammar_and_types
-/es/docs/Guía_de_referencia_de_CSS	/es/docs/Web/CSS/Referencia_CSS
+/es/docs/Guía_de_referencia_de_CSS	/es/docs/Web/CSS/Reference
+/es/docs/Guía_para_el_desarrollador_de_agregados_para_Firefox	/es/docs/orphaned/Guía_para_el_desarrollador_de_agregados_para_Firefox
+/es/docs/Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones	/es/docs/orphaned/Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones
+/es/docs/Guía_para_la_migración_a_catálogo	/es/docs/orphaned/Guía_para_la_migración_a_catálogo
 /es/docs/HTML	/es/docs/Web/HTML
 /es/docs/HTML/Block-level_elements	/es/docs/Web/HTML/Block-level_elements
-/es/docs/HTML/Canvas	/es/docs/Web/HTML/Canvas
-/es/docs/HTML/Canvas/Drawing_graphics_with_canvas	/es/docs/Web/HTML/Canvas/Drawing_graphics_with_canvas
-/es/docs/HTML/Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida	/es/docs/Web/HTML/Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida
-/es/docs/HTML/Element	/es/docs/Web/HTML/Elemento
-/es/docs/HTML/Element/a	/es/docs/Web/HTML/Elemento/a
-/es/docs/HTML/Element/form	/es/docs/Web/HTML/Elemento/form
-/es/docs/HTML/Element/hgroup	/es/docs/Web/HTML/Elemento/hgroup
-/es/docs/HTML/Element/iframe	/es/docs/Web/HTML/Elemento/iframe
-/es/docs/HTML/Element/section	/es/docs/Web/HTML/Elemento/section
-/es/docs/HTML/Element/tabla	/es/docs/Web/HTML/Elemento/table
-/es/docs/HTML/Element/table	/es/docs/Web/HTML/Elemento/table
-/es/docs/HTML/Element/video	/es/docs/Web/HTML/Elemento/video
-/es/docs/HTML/Elemento	/es/docs/Web/HTML/Elemento
+/es/docs/HTML/Canvas	/es/docs/Web/API/Canvas_API
+/es/docs/HTML/Canvas/Drawing_graphics_with_canvas	/es/docs/conflicting/Web/API/Canvas_API/Tutorial
+/es/docs/HTML/Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida	/es/docs/Learn/HTML/Howto/Author_fast-loading_HTML_pages
+/es/docs/HTML/Element	/es/docs/Web/HTML/Element
+/es/docs/HTML/Element/a	/es/docs/Web/HTML/Element/a
+/es/docs/HTML/Element/form	/es/docs/Web/HTML/Element/form
+/es/docs/HTML/Element/hgroup	/es/docs/Web/HTML/Element/hgroup
+/es/docs/HTML/Element/iframe	/es/docs/Web/HTML/Element/iframe
+/es/docs/HTML/Element/section	/es/docs/Web/HTML/Element/section
+/es/docs/HTML/Element/tabla	/es/docs/Web/HTML/Element/table
+/es/docs/HTML/Element/table	/es/docs/Web/HTML/Element/table
+/es/docs/HTML/Element/video	/es/docs/Web/HTML/Element/video
+/es/docs/HTML/Elemento	/es/docs/Web/HTML/Element
 /es/docs/HTML/Elemento/<html>	/es/docs/Web/HTML/Elemento/<html>
-/es/docs/HTML/Elemento/Audio	/es/docs/Web/HTML/Elemento/audio
-/es/docs/HTML/Elemento/Elementos_títulos	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML/Elemento/Progreso	/es/docs/Web/HTML/Elemento/progress
-/es/docs/HTML/Elemento/Tipos_de_elementos	/es/docs/Web/HTML/Elemento/Tipos_de_elementos
-/es/docs/HTML/Elemento/a	/es/docs/Web/HTML/Elemento/a
-/es/docs/HTML/Elemento/abbr	/es/docs/Web/HTML/Elemento/abbr
-/es/docs/HTML/Elemento/acronym	/es/docs/Web/HTML/Elemento/acronym
-/es/docs/HTML/Elemento/address	/es/docs/Web/HTML/Elemento/address
-/es/docs/HTML/Elemento/applet	/es/docs/Web/HTML/Elemento/applet
-/es/docs/HTML/Elemento/area	/es/docs/Web/HTML/Elemento/area
-/es/docs/HTML/Elemento/article	/es/docs/Web/HTML/Elemento/article
-/es/docs/HTML/Elemento/aside	/es/docs/Web/HTML/Elemento/aside
-/es/docs/HTML/Elemento/b	/es/docs/Web/HTML/Elemento/b
-/es/docs/HTML/Elemento/base	/es/docs/Web/HTML/Elemento/base
-/es/docs/HTML/Elemento/basefont	/es/docs/Web/HTML/Elemento/basefont
-/es/docs/HTML/Elemento/bdo	/es/docs/Web/HTML/Elemento/bdo
-/es/docs/HTML/Elemento/big	/es/docs/Web/HTML/Elemento/big
-/es/docs/HTML/Elemento/blockquote	/es/docs/Web/HTML/Elemento/blockquote
-/es/docs/HTML/Elemento/body	/es/docs/Web/HTML/Elemento/body
-/es/docs/HTML/Elemento/br	/es/docs/Web/HTML/Elemento/br
-/es/docs/HTML/Elemento/button	/es/docs/Web/HTML/Elemento/button
-/es/docs/HTML/Elemento/canvas	/es/docs/Web/HTML/Elemento/canvas
-/es/docs/HTML/Elemento/caption	/es/docs/Web/HTML/Elemento/caption
-/es/docs/HTML/Elemento/center	/es/docs/Web/HTML/Elemento/center
-/es/docs/HTML/Elemento/cite	/es/docs/Web/HTML/Elemento/cite
-/es/docs/HTML/Elemento/code	/es/docs/Web/HTML/Elemento/code
-/es/docs/HTML/Elemento/col	/es/docs/Web/HTML/Elemento/col
-/es/docs/HTML/Elemento/colgroup	/es/docs/Web/HTML/Elemento/colgroup
-/es/docs/HTML/Elemento/dd	/es/docs/Web/HTML/Elemento/dd
-/es/docs/HTML/Elemento/del	/es/docs/Web/HTML/Elemento/del
-/es/docs/HTML/Elemento/dfn	/es/docs/Web/HTML/Elemento/dfn
-/es/docs/HTML/Elemento/dir	/es/docs/Web/HTML/Elemento/dir
-/es/docs/HTML/Elemento/div	/es/docs/Web/HTML/Elemento/div
-/es/docs/HTML/Elemento/dl	/es/docs/Web/HTML/Elemento/dl
-/es/docs/HTML/Elemento/dt	/es/docs/Web/HTML/Elemento/dt
-/es/docs/HTML/Elemento/em	/es/docs/Web/HTML/Elemento/em
-/es/docs/HTML/Elemento/embed	/es/docs/Web/HTML/Elemento/embed
-/es/docs/HTML/Elemento/etiqueta	/es/docs/Web/HTML/Elemento/label
-/es/docs/HTML/Elemento/fieldset	/es/docs/Web/HTML/Elemento/fieldset
-/es/docs/HTML/Elemento/figure	/es/docs/Web/HTML/Elemento/figure
-/es/docs/HTML/Elemento/font	/es/docs/Web/HTML/Elemento/font
-/es/docs/HTML/Elemento/footer	/es/docs/Web/HTML/Elemento/footer
-/es/docs/HTML/Elemento/frame	/es/docs/Web/HTML/Elemento/frame
-/es/docs/HTML/Elemento/frameset	/es/docs/Web/HTML/Elemento/frameset
-/es/docs/HTML/Elemento/h1	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML/Elemento/h2	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML/Elemento/h3	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML/Elemento/h4	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML/Elemento/h5	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML/Elemento/h6	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML/Elemento/head	/es/docs/Web/HTML/Elemento/head
-/es/docs/HTML/Elemento/header	/es/docs/Web/HTML/Elemento/header
-/es/docs/HTML/Elemento/hr	/es/docs/Web/HTML/Elemento/hr
-/es/docs/HTML/Elemento/html	/es/docs/Web/HTML/Elemento/html
-/es/docs/HTML/Elemento/i	/es/docs/Web/HTML/Elemento/i
-/es/docs/HTML/Elemento/img	/es/docs/Web/HTML/Elemento/img
-/es/docs/HTML/Elemento/input	/es/docs/Web/HTML/Elemento/input
-/es/docs/HTML/Elemento/ins	/es/docs/Web/HTML/Elemento/ins
-/es/docs/HTML/Elemento/kbd	/es/docs/Web/HTML/Elemento/kbd
-/es/docs/HTML/Elemento/keygen	/es/docs/Web/HTML/Elemento/keygen
-/es/docs/HTML/Elemento/label	/es/docs/Web/HTML/Elemento/label
-/es/docs/HTML/Elemento/legend	/es/docs/Web/HTML/Elemento/legend
-/es/docs/HTML/Elemento/li	/es/docs/Web/HTML/Elemento/li
-/es/docs/HTML/Elemento/link	/es/docs/Web/HTML/Elemento/link
-/es/docs/HTML/Elemento/main	/es/docs/Web/HTML/Elemento/main
-/es/docs/HTML/Elemento/map	/es/docs/Web/HTML/Elemento/map
-/es/docs/HTML/Elemento/mark	/es/docs/Web/HTML/Elemento/mark
-/es/docs/HTML/Elemento/menu	/es/docs/Web/HTML/Elemento/menu
-/es/docs/HTML/Elemento/meta	/es/docs/Web/HTML/Elemento/meta
-/es/docs/HTML/Elemento/nav	/es/docs/Web/HTML/Elemento/nav
-/es/docs/HTML/Elemento/noframes	/es/docs/Web/HTML/Elemento/noframes
-/es/docs/HTML/Elemento/noscript	/es/docs/Web/HTML/Elemento/noscript
-/es/docs/HTML/Elemento/ol	/es/docs/Web/HTML/Elemento/ol
-/es/docs/HTML/Elemento/p	/es/docs/Web/HTML/Elemento/p
-/es/docs/HTML/Elemento/param	/es/docs/Web/HTML/Elemento/param
-/es/docs/HTML/Elemento/pre	/es/docs/Web/HTML/Elemento/pre
-/es/docs/HTML/Elemento/preformato	/es/docs/Web/HTML/Elemento/pre
-/es/docs/HTML/Elemento/q	/es/docs/Web/HTML/Elemento/q
-/es/docs/HTML/Elemento/s	/es/docs/Web/HTML/Elemento/s
-/es/docs/HTML/Elemento/samp	/es/docs/Web/HTML/Elemento/samp
-/es/docs/HTML/Elemento/small	/es/docs/Web/HTML/Elemento/small
-/es/docs/HTML/Elemento/source	/es/docs/Web/HTML/Elemento/source
-/es/docs/HTML/Elemento/span	/es/docs/Web/HTML/Elemento/span
-/es/docs/HTML/Elemento/strike	/es/docs/Web/HTML/Elemento/strike
-/es/docs/HTML/Elemento/strong	/es/docs/Web/HTML/Elemento/strong
-/es/docs/HTML/Elemento/style	/es/docs/Web/HTML/Elemento/style
-/es/docs/HTML/Elemento/sub	/es/docs/Web/HTML/Elemento/sub
-/es/docs/HTML/Elemento/sup	/es/docs/Web/HTML/Elemento/sup
-/es/docs/HTML/Elemento/time	/es/docs/Web/HTML/Elemento/time
-/es/docs/HTML/Elemento/title	/es/docs/Web/HTML/Elemento/title
-/es/docs/HTML/Elemento/tt	/es/docs/Web/HTML/Elemento/tt
-/es/docs/HTML/Elemento/u	/es/docs/Web/HTML/Elemento/u
-/es/docs/HTML/Elemento/ul	/es/docs/Web/HTML/Elemento/ul
-/es/docs/HTML/Elemento/var	/es/docs/Web/HTML/Elemento/var
-/es/docs/HTML/Elemento/video	/es/docs/Web/HTML/Elemento/video
-/es/docs/HTML/Formatos_admitidos_de_audio_y_video_en_html5	/es/docs/Web/HTML/Formatos_admitidos_de_audio_y_video_en_html5
-/es/docs/HTML/HTML5/Introduction_to_HTML5	/es/docs/HTML/HTML5/Introducción_a_HTML5
-/es/docs/HTML/La_importancia_de_comentar_correctamente	/es/docs/Web/HTML/La_importancia_de_comentar_correctamente
-/es/docs/HTML:Canvas	/es/docs/Web/HTML/Canvas
-/es/docs/HTML:Element	/es/docs/Web/HTML/Elemento
-/es/docs/HTML:Element:a	/es/docs/Web/HTML/Elemento/a
-/es/docs/HTML:Elemento	/es/docs/Web/HTML/Elemento
-/es/docs/HTML:Elemento:Tipos_de_elementos	/es/docs/Web/HTML/Elemento/Tipos_de_elementos
-/es/docs/HTML:Elemento:a	/es/docs/Web/HTML/Elemento/a
-/es/docs/HTML:Elemento:abbr	/es/docs/Web/HTML/Elemento/abbr
-/es/docs/HTML:Elemento:acronym	/es/docs/Web/HTML/Elemento/acronym
-/es/docs/HTML:Elemento:address	/es/docs/Web/HTML/Elemento/address
-/es/docs/HTML:Elemento:applet	/es/docs/Web/HTML/Elemento/applet
-/es/docs/HTML:Elemento:area	/es/docs/Web/HTML/Elemento/area
-/es/docs/HTML:Elemento:b	/es/docs/Web/HTML/Elemento/b
-/es/docs/HTML:Elemento:base	/es/docs/Web/HTML/Elemento/base
-/es/docs/HTML:Elemento:basefont	/es/docs/Web/HTML/Elemento/basefont
-/es/docs/HTML:Elemento:bdo	/es/docs/Web/HTML/Elemento/bdo
-/es/docs/HTML:Elemento:big	/es/docs/Web/HTML/Elemento/big
-/es/docs/HTML:Elemento:blockquote	/es/docs/Web/HTML/Elemento/blockquote
-/es/docs/HTML:Elemento:body	/es/docs/Web/HTML/Elemento/body
-/es/docs/HTML:Elemento:br	/es/docs/Web/HTML/Elemento/br
-/es/docs/HTML:Elemento:button	/es/docs/Web/HTML/Elemento/button
-/es/docs/HTML:Elemento:caption	/es/docs/Web/HTML/Elemento/caption
-/es/docs/HTML:Elemento:center	/es/docs/Web/HTML/Elemento/center
-/es/docs/HTML:Elemento:cite	/es/docs/Web/HTML/Elemento/cite
-/es/docs/HTML:Elemento:code	/es/docs/Web/HTML/Elemento/code
-/es/docs/HTML:Elemento:col	/es/docs/Web/HTML/Elemento/col
-/es/docs/HTML:Elemento:colgroup	/es/docs/Web/HTML/Elemento/colgroup
-/es/docs/HTML:Elemento:dd	/es/docs/Web/HTML/Elemento/dd
-/es/docs/HTML:Elemento:del	/es/docs/Web/HTML/Elemento/del
-/es/docs/HTML:Elemento:dfn	/es/docs/Web/HTML/Elemento/dfn
-/es/docs/HTML:Elemento:dir	/es/docs/Web/HTML/Elemento/dir
-/es/docs/HTML:Elemento:div	/es/docs/Web/HTML/Elemento/div
-/es/docs/HTML:Elemento:dl	/es/docs/Web/HTML/Elemento/dl
-/es/docs/HTML:Elemento:dt	/es/docs/Web/HTML/Elemento/dt
-/es/docs/HTML:Elemento:em	/es/docs/Web/HTML/Elemento/em
-/es/docs/HTML:Elemento:fieldset	/es/docs/Web/HTML/Elemento/fieldset
-/es/docs/HTML:Elemento:font	/es/docs/Web/HTML/Elemento/font
-/es/docs/HTML:Elemento:frame	/es/docs/Web/HTML/Elemento/frame
-/es/docs/HTML:Elemento:frameset	/es/docs/Web/HTML/Elemento/frameset
-/es/docs/HTML:Elemento:h1	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML:Elemento:h2	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML:Elemento:h3	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML:Elemento:h4	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML:Elemento:h5	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML:Elemento:h6	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/HTML:Elemento:head	/es/docs/Web/HTML/Elemento/head
-/es/docs/HTML:Elemento:hr	/es/docs/Web/HTML/Elemento/hr
-/es/docs/HTML:Elemento:html	/es/docs/Web/HTML/Elemento/html
-/es/docs/HTML:Elemento:i	/es/docs/Web/HTML/Elemento/i
-/es/docs/HTML:Elemento:ins	/es/docs/Web/HTML/Elemento/ins
-/es/docs/HTML:Elemento:kbd	/es/docs/Web/HTML/Elemento/kbd
-/es/docs/HTML:Elemento:label	/es/docs/Web/HTML/Elemento/label
-/es/docs/HTML:Elemento:legend	/es/docs/Web/HTML/Elemento/legend
-/es/docs/HTML:Elemento:li	/es/docs/Web/HTML/Elemento/li
-/es/docs/HTML:Elemento:link	/es/docs/Web/HTML/Elemento/link
-/es/docs/HTML:Elemento:map	/es/docs/Web/HTML/Elemento/map
-/es/docs/HTML:Elemento:menu	/es/docs/Web/HTML/Elemento/menu
-/es/docs/HTML:Elemento:meta	/es/docs/Web/HTML/Elemento/meta
-/es/docs/HTML:Elemento:noframes	/es/docs/Web/HTML/Elemento/noframes
-/es/docs/HTML:Elemento:noscript	/es/docs/Web/HTML/Elemento/noscript
-/es/docs/HTML:Elemento:ol	/es/docs/Web/HTML/Elemento/ol
-/es/docs/HTML:Elemento:p	/es/docs/Web/HTML/Elemento/p
-/es/docs/HTML:Elemento:param	/es/docs/Web/HTML/Elemento/param
-/es/docs/HTML:Elemento:pre	/es/docs/Web/HTML/Elemento/pre
-/es/docs/HTML:Elemento:q	/es/docs/Web/HTML/Elemento/q
-/es/docs/HTML:Elemento:s	/es/docs/Web/HTML/Elemento/s
-/es/docs/HTML:Elemento:samp	/es/docs/Web/HTML/Elemento/samp
-/es/docs/HTML:Elemento:small	/es/docs/Web/HTML/Elemento/small
-/es/docs/HTML:Elemento:span	/es/docs/Web/HTML/Elemento/span
-/es/docs/HTML:Elemento:strike	/es/docs/Web/HTML/Elemento/strike
-/es/docs/HTML:Elemento:strong	/es/docs/Web/HTML/Elemento/strong
-/es/docs/HTML:Elemento:style	/es/docs/Web/HTML/Elemento/style
-/es/docs/HTML:Elemento:sub	/es/docs/Web/HTML/Elemento/sub
-/es/docs/HTML:Elemento:sup	/es/docs/Web/HTML/Elemento/sup
-/es/docs/HTML:Elemento:title	/es/docs/Web/HTML/Elemento/title
-/es/docs/HTML:Elemento:tt	/es/docs/Web/HTML/Elemento/tt
-/es/docs/HTML:Elemento:u	/es/docs/Web/HTML/Elemento/u
-/es/docs/HTML:Elemento:ul	/es/docs/Web/HTML/Elemento/ul
-/es/docs/HTML:Elemento:var	/es/docs/Web/HTML/Elemento/var
-/es/docs/HTML:La_importancia_de_comentar_correctamente	/es/docs/Web/HTML/La_importancia_de_comentar_correctamente
+/es/docs/HTML/Elemento/Audio	/es/docs/Web/HTML/Element/audio
+/es/docs/HTML/Elemento/Elementos_títulos	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML/Elemento/Progreso	/es/docs/Web/HTML/Element/progress
+/es/docs/HTML/Elemento/Tipos_de_elementos	/es/docs/orphaned/Web/HTML/Elemento/Tipos_de_elementos
+/es/docs/HTML/Elemento/a	/es/docs/Web/HTML/Element/a
+/es/docs/HTML/Elemento/abbr	/es/docs/Web/HTML/Element/abbr
+/es/docs/HTML/Elemento/acronym	/es/docs/Web/HTML/Element/acronym
+/es/docs/HTML/Elemento/address	/es/docs/Web/HTML/Element/address
+/es/docs/HTML/Elemento/applet	/es/docs/Web/HTML/Element/applet
+/es/docs/HTML/Elemento/area	/es/docs/Web/HTML/Element/area
+/es/docs/HTML/Elemento/article	/es/docs/Web/HTML/Element/article
+/es/docs/HTML/Elemento/aside	/es/docs/Web/HTML/Element/aside
+/es/docs/HTML/Elemento/b	/es/docs/Web/HTML/Element/b
+/es/docs/HTML/Elemento/base	/es/docs/Web/HTML/Element/base
+/es/docs/HTML/Elemento/basefont	/es/docs/Web/HTML/Element/basefont
+/es/docs/HTML/Elemento/bdo	/es/docs/Web/HTML/Element/bdo
+/es/docs/HTML/Elemento/big	/es/docs/Web/HTML/Element/big
+/es/docs/HTML/Elemento/blockquote	/es/docs/Web/HTML/Element/blockquote
+/es/docs/HTML/Elemento/body	/es/docs/Web/HTML/Element/body
+/es/docs/HTML/Elemento/br	/es/docs/Web/HTML/Element/br
+/es/docs/HTML/Elemento/button	/es/docs/Web/HTML/Element/button
+/es/docs/HTML/Elemento/canvas	/es/docs/Web/HTML/Element/canvas
+/es/docs/HTML/Elemento/caption	/es/docs/Web/HTML/Element/caption
+/es/docs/HTML/Elemento/center	/es/docs/Web/HTML/Element/center
+/es/docs/HTML/Elemento/cite	/es/docs/Web/HTML/Element/cite
+/es/docs/HTML/Elemento/code	/es/docs/Web/HTML/Element/code
+/es/docs/HTML/Elemento/col	/es/docs/Web/HTML/Element/col
+/es/docs/HTML/Elemento/colgroup	/es/docs/Web/HTML/Element/colgroup
+/es/docs/HTML/Elemento/datalist	/es/docs/orphaned/HTML/Elemento/datalist
+/es/docs/HTML/Elemento/dd	/es/docs/Web/HTML/Element/dd
+/es/docs/HTML/Elemento/del	/es/docs/Web/HTML/Element/del
+/es/docs/HTML/Elemento/dfn	/es/docs/Web/HTML/Element/dfn
+/es/docs/HTML/Elemento/dir	/es/docs/Web/HTML/Element/dir
+/es/docs/HTML/Elemento/div	/es/docs/Web/HTML/Element/div
+/es/docs/HTML/Elemento/dl	/es/docs/Web/HTML/Element/dl
+/es/docs/HTML/Elemento/dt	/es/docs/Web/HTML/Element/dt
+/es/docs/HTML/Elemento/em	/es/docs/Web/HTML/Element/em
+/es/docs/HTML/Elemento/embed	/es/docs/Web/HTML/Element/embed
+/es/docs/HTML/Elemento/etiqueta	/es/docs/Web/HTML/Element/label
+/es/docs/HTML/Elemento/fieldset	/es/docs/Web/HTML/Element/fieldset
+/es/docs/HTML/Elemento/figure	/es/docs/Web/HTML/Element/figure
+/es/docs/HTML/Elemento/font	/es/docs/Web/HTML/Element/font
+/es/docs/HTML/Elemento/footer	/es/docs/Web/HTML/Element/footer
+/es/docs/HTML/Elemento/form	/es/docs/orphaned/HTML/Elemento/form
+/es/docs/HTML/Elemento/frame	/es/docs/Web/HTML/Element/frame
+/es/docs/HTML/Elemento/frameset	/es/docs/Web/HTML/Element/frameset
+/es/docs/HTML/Elemento/h1	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML/Elemento/h2	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML/Elemento/h3	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML/Elemento/h4	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML/Elemento/h5	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML/Elemento/h6	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML/Elemento/head	/es/docs/Web/HTML/Element/head
+/es/docs/HTML/Elemento/header	/es/docs/Web/HTML/Element/header
+/es/docs/HTML/Elemento/hr	/es/docs/Web/HTML/Element/hr
+/es/docs/HTML/Elemento/html	/es/docs/Web/HTML/Element/html
+/es/docs/HTML/Elemento/i	/es/docs/Web/HTML/Element/i
+/es/docs/HTML/Elemento/img	/es/docs/Web/HTML/Element/img
+/es/docs/HTML/Elemento/input	/es/docs/Web/HTML/Element/input
+/es/docs/HTML/Elemento/ins	/es/docs/Web/HTML/Element/ins
+/es/docs/HTML/Elemento/kbd	/es/docs/Web/HTML/Element/kbd
+/es/docs/HTML/Elemento/keygen	/es/docs/Web/HTML/Element/keygen
+/es/docs/HTML/Elemento/label	/es/docs/Web/HTML/Element/label
+/es/docs/HTML/Elemento/legend	/es/docs/Web/HTML/Element/legend
+/es/docs/HTML/Elemento/li	/es/docs/Web/HTML/Element/li
+/es/docs/HTML/Elemento/link	/es/docs/Web/HTML/Element/link
+/es/docs/HTML/Elemento/main	/es/docs/Web/HTML/Element/main
+/es/docs/HTML/Elemento/map	/es/docs/Web/HTML/Element/map
+/es/docs/HTML/Elemento/mark	/es/docs/Web/HTML/Element/mark
+/es/docs/HTML/Elemento/menu	/es/docs/Web/HTML/Element/menu
+/es/docs/HTML/Elemento/meta	/es/docs/Web/HTML/Element/meta
+/es/docs/HTML/Elemento/nav	/es/docs/Web/HTML/Element/nav
+/es/docs/HTML/Elemento/noframes	/es/docs/Web/HTML/Element/noframes
+/es/docs/HTML/Elemento/noscript	/es/docs/Web/HTML/Element/noscript
+/es/docs/HTML/Elemento/ol	/es/docs/Web/HTML/Element/ol
+/es/docs/HTML/Elemento/p	/es/docs/Web/HTML/Element/p
+/es/docs/HTML/Elemento/param	/es/docs/Web/HTML/Element/param
+/es/docs/HTML/Elemento/pre	/es/docs/Web/HTML/Element/pre
+/es/docs/HTML/Elemento/preformato	/es/docs/Web/HTML/Element/pre
+/es/docs/HTML/Elemento/q	/es/docs/Web/HTML/Element/q
+/es/docs/HTML/Elemento/s	/es/docs/Web/HTML/Element/s
+/es/docs/HTML/Elemento/samp	/es/docs/Web/HTML/Element/samp
+/es/docs/HTML/Elemento/section	/es/docs/orphaned/HTML/Elemento/section
+/es/docs/HTML/Elemento/small	/es/docs/Web/HTML/Element/small
+/es/docs/HTML/Elemento/source	/es/docs/Web/HTML/Element/source
+/es/docs/HTML/Elemento/span	/es/docs/Web/HTML/Element/span
+/es/docs/HTML/Elemento/strike	/es/docs/Web/HTML/Element/strike
+/es/docs/HTML/Elemento/strong	/es/docs/Web/HTML/Element/strong
+/es/docs/HTML/Elemento/style	/es/docs/Web/HTML/Element/style
+/es/docs/HTML/Elemento/sub	/es/docs/Web/HTML/Element/sub
+/es/docs/HTML/Elemento/sup	/es/docs/Web/HTML/Element/sup
+/es/docs/HTML/Elemento/time	/es/docs/Web/HTML/Element/time
+/es/docs/HTML/Elemento/title	/es/docs/Web/HTML/Element/title
+/es/docs/HTML/Elemento/tt	/es/docs/Web/HTML/Element/tt
+/es/docs/HTML/Elemento/u	/es/docs/Web/HTML/Element/u
+/es/docs/HTML/Elemento/ul	/es/docs/Web/HTML/Element/ul
+/es/docs/HTML/Elemento/var	/es/docs/Web/HTML/Element/var
+/es/docs/HTML/Elemento/video	/es/docs/Web/HTML/Element/video
+/es/docs/HTML/Formatos_admitidos_de_audio_y_video_en_html5	/es/docs/conflicting/Web/Media/Formats
+/es/docs/HTML/HTML5	/es/docs/Web/Guide/HTML/HTML5
+/es/docs/HTML/HTML5/Forms_in_HTML5	/es/docs/Learn/Forms
+/es/docs/HTML/HTML5/Formularios_en_HTML5	/es/docs/orphaned/Learn/HTML/Forms/HTML5_updates
+/es/docs/HTML/HTML5/HTML5_Parser	/es/docs/Web/Guide/HTML/HTML5/HTML5_Parser
+/es/docs/HTML/HTML5/HTML5_lista_elementos	/es/docs/conflicting/Web/HTML/Element
+/es/docs/HTML/HTML5/Introducción_a_HTML5	/es/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5
+/es/docs/HTML/HTML5/Introduction_to_HTML5	/es/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5
+/es/docs/HTML/HTML5/Validacion_de_restricciones	/es/docs/Web/Guide/HTML/HTML5/Constraint_validation
+/es/docs/HTML/La_importancia_de_comentar_correctamente	/es/docs/conflicting/Learn/HTML/Introduction_to_HTML/Getting_started
+/es/docs/HTML:Canvas	/es/docs/Web/API/Canvas_API
+/es/docs/HTML:Element	/es/docs/Web/HTML/Element
+/es/docs/HTML:Element:a	/es/docs/Web/HTML/Element/a
+/es/docs/HTML:Elemento	/es/docs/Web/HTML/Element
+/es/docs/HTML:Elemento:Tipos_de_elementos	/es/docs/orphaned/Web/HTML/Elemento/Tipos_de_elementos
+/es/docs/HTML:Elemento:a	/es/docs/Web/HTML/Element/a
+/es/docs/HTML:Elemento:abbr	/es/docs/Web/HTML/Element/abbr
+/es/docs/HTML:Elemento:acronym	/es/docs/Web/HTML/Element/acronym
+/es/docs/HTML:Elemento:address	/es/docs/Web/HTML/Element/address
+/es/docs/HTML:Elemento:applet	/es/docs/Web/HTML/Element/applet
+/es/docs/HTML:Elemento:area	/es/docs/Web/HTML/Element/area
+/es/docs/HTML:Elemento:b	/es/docs/Web/HTML/Element/b
+/es/docs/HTML:Elemento:base	/es/docs/Web/HTML/Element/base
+/es/docs/HTML:Elemento:basefont	/es/docs/Web/HTML/Element/basefont
+/es/docs/HTML:Elemento:bdo	/es/docs/Web/HTML/Element/bdo
+/es/docs/HTML:Elemento:big	/es/docs/Web/HTML/Element/big
+/es/docs/HTML:Elemento:blockquote	/es/docs/Web/HTML/Element/blockquote
+/es/docs/HTML:Elemento:body	/es/docs/Web/HTML/Element/body
+/es/docs/HTML:Elemento:br	/es/docs/Web/HTML/Element/br
+/es/docs/HTML:Elemento:button	/es/docs/Web/HTML/Element/button
+/es/docs/HTML:Elemento:caption	/es/docs/Web/HTML/Element/caption
+/es/docs/HTML:Elemento:center	/es/docs/Web/HTML/Element/center
+/es/docs/HTML:Elemento:cite	/es/docs/Web/HTML/Element/cite
+/es/docs/HTML:Elemento:code	/es/docs/Web/HTML/Element/code
+/es/docs/HTML:Elemento:col	/es/docs/Web/HTML/Element/col
+/es/docs/HTML:Elemento:colgroup	/es/docs/Web/HTML/Element/colgroup
+/es/docs/HTML:Elemento:dd	/es/docs/Web/HTML/Element/dd
+/es/docs/HTML:Elemento:del	/es/docs/Web/HTML/Element/del
+/es/docs/HTML:Elemento:dfn	/es/docs/Web/HTML/Element/dfn
+/es/docs/HTML:Elemento:dir	/es/docs/Web/HTML/Element/dir
+/es/docs/HTML:Elemento:div	/es/docs/Web/HTML/Element/div
+/es/docs/HTML:Elemento:dl	/es/docs/Web/HTML/Element/dl
+/es/docs/HTML:Elemento:dt	/es/docs/Web/HTML/Element/dt
+/es/docs/HTML:Elemento:em	/es/docs/Web/HTML/Element/em
+/es/docs/HTML:Elemento:fieldset	/es/docs/Web/HTML/Element/fieldset
+/es/docs/HTML:Elemento:font	/es/docs/Web/HTML/Element/font
+/es/docs/HTML:Elemento:frame	/es/docs/Web/HTML/Element/frame
+/es/docs/HTML:Elemento:frameset	/es/docs/Web/HTML/Element/frameset
+/es/docs/HTML:Elemento:h1	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML:Elemento:h2	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML:Elemento:h3	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML:Elemento:h4	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML:Elemento:h5	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML:Elemento:h6	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/HTML:Elemento:head	/es/docs/Web/HTML/Element/head
+/es/docs/HTML:Elemento:hr	/es/docs/Web/HTML/Element/hr
+/es/docs/HTML:Elemento:html	/es/docs/Web/HTML/Element/html
+/es/docs/HTML:Elemento:i	/es/docs/Web/HTML/Element/i
+/es/docs/HTML:Elemento:ins	/es/docs/Web/HTML/Element/ins
+/es/docs/HTML:Elemento:kbd	/es/docs/Web/HTML/Element/kbd
+/es/docs/HTML:Elemento:label	/es/docs/Web/HTML/Element/label
+/es/docs/HTML:Elemento:legend	/es/docs/Web/HTML/Element/legend
+/es/docs/HTML:Elemento:li	/es/docs/Web/HTML/Element/li
+/es/docs/HTML:Elemento:link	/es/docs/Web/HTML/Element/link
+/es/docs/HTML:Elemento:map	/es/docs/Web/HTML/Element/map
+/es/docs/HTML:Elemento:menu	/es/docs/Web/HTML/Element/menu
+/es/docs/HTML:Elemento:meta	/es/docs/Web/HTML/Element/meta
+/es/docs/HTML:Elemento:noframes	/es/docs/Web/HTML/Element/noframes
+/es/docs/HTML:Elemento:noscript	/es/docs/Web/HTML/Element/noscript
+/es/docs/HTML:Elemento:ol	/es/docs/Web/HTML/Element/ol
+/es/docs/HTML:Elemento:p	/es/docs/Web/HTML/Element/p
+/es/docs/HTML:Elemento:param	/es/docs/Web/HTML/Element/param
+/es/docs/HTML:Elemento:pre	/es/docs/Web/HTML/Element/pre
+/es/docs/HTML:Elemento:q	/es/docs/Web/HTML/Element/q
+/es/docs/HTML:Elemento:s	/es/docs/Web/HTML/Element/s
+/es/docs/HTML:Elemento:samp	/es/docs/Web/HTML/Element/samp
+/es/docs/HTML:Elemento:small	/es/docs/Web/HTML/Element/small
+/es/docs/HTML:Elemento:span	/es/docs/Web/HTML/Element/span
+/es/docs/HTML:Elemento:strike	/es/docs/Web/HTML/Element/strike
+/es/docs/HTML:Elemento:strong	/es/docs/Web/HTML/Element/strong
+/es/docs/HTML:Elemento:style	/es/docs/Web/HTML/Element/style
+/es/docs/HTML:Elemento:sub	/es/docs/Web/HTML/Element/sub
+/es/docs/HTML:Elemento:sup	/es/docs/Web/HTML/Element/sup
+/es/docs/HTML:Elemento:title	/es/docs/Web/HTML/Element/title
+/es/docs/HTML:Elemento:tt	/es/docs/Web/HTML/Element/tt
+/es/docs/HTML:Elemento:u	/es/docs/Web/HTML/Element/u
+/es/docs/HTML:Elemento:ul	/es/docs/Web/HTML/Element/ul
+/es/docs/HTML:Elemento:var	/es/docs/Web/HTML/Element/var
+/es/docs/HTML:La_importancia_de_comentar_correctamente	/es/docs/conflicting/Learn/HTML/Introduction_to_HTML/Getting_started
+/es/docs/Herramientas	/es/docs/orphaned/Herramientas
 /es/docs/Herramientas_API	/es/docs/API_del_Toolkit
+/es/docs/How_to_create_a_DOM_tree	/es/docs/Web/API/Document_object_model/How_to_create_a_DOM_tree
 /es/docs/Html_Validator_(externo)	https://addons.mozilla.org/firefox/249/
+/es/docs/Incrustando_Mozilla/Comunidad	/es/docs/orphaned/Incrustando_Mozilla/Comunidad
+/es/docs/IndexedDB	/es/docs/conflicting/Web/API/IndexedDB_API
 /es/docs/IndexedDB-840092-dup	/es/docs/Web/API/IndexedDB_API
-/es/docs/IndexedDB-840092-dup/Conceptos_Basicos_Detras_De_IndexedDB	/es/docs/Web/API/IndexedDB_API/Conceptos_Basicos_Detras_De_IndexedDB
-/es/docs/IndexedDB-840092-dup/Usando_IndexedDB	/es/docs/Web/API/IndexedDB_API/Usando_IndexedDB
+/es/docs/IndexedDB-840092-dup/Conceptos_Basicos_Detras_De_IndexedDB	/es/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB
+/es/docs/IndexedDB-840092-dup/Usando_IndexedDB	/es/docs/Web/API/IndexedDB_API/Using_IndexedDB
+/es/docs/Instalación_de_motores_de_búsqueda_desde_páginas_web	/es/docs/orphaned/Instalación_de_motores_de_búsqueda_desde_páginas_web
 /es/docs/Instalar_el_manifest	/es/docs/Manifiesto_de_instalación
 /es/docs/Install_Manifests	/es/docs/Manifiesto_de_instalación
-/es/docs/Introducción_a_JavaScript_orientado_a_objetos	/es/docs/Web/JavaScript/Introducción_a_JavaScript_orientado_a_objetos
-/es/docs/Introducción_a_XML	/es/docs/Web/XML/Introducción_a_XML
-/es/docs/Introduction_to_using_XPath_in_JavaScript	/es/docs/Web/JavaScript/Introduction_to_using_XPath_in_JavaScript
+/es/docs/Introducción_a_JavaScript_orientado_a_objetos	/es/docs/conflicting/Learn/JavaScript/Objects
+/es/docs/Introducción_a_XML	/es/docs/Web/XML/XML_introduction
+/es/docs/Introduction_to_using_XPath_in_JavaScript	/es/docs/Web/XPath/Introduction_to_using_XPath_in_JavaScript
 /es/docs/JavaScript	/es/docs/Web/JavaScript
-/es/docs/JavaScript/Acerca_de_JavaScript	/es/docs/Web/JavaScript/Acerca_de_JavaScript
+/es/docs/JavaScript/Acerca_de_JavaScript	/es/docs/Web/JavaScript/About_JavaScript
 /es/docs/JavaScript/Guide	/es/docs/Web/JavaScript/Guide
-/es/docs/JavaScript/Guide/AcercaDe	/es/docs/Web/JavaScript/Guide/Introducción
+/es/docs/JavaScript/Guide/AcercaDe	/es/docs/Web/JavaScript/Guide/Introduction
 /es/docs/JavaScript/Guide/Closures	/es/docs/Web/JavaScript/Closures
 /es/docs/JavaScript/Guide/Details_of_the_Object_Model	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model
-/es/docs/JavaScript/Guide/Funciones	/es/docs/Web/JavaScript/Guide/Funciones
-/es/docs/JavaScript/Guide/JavaScript_Overview	/es/docs/Web/JavaScript/Guide/Introducción
+/es/docs/JavaScript/Guide/Funciones	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/JavaScript/Guide/JavaScript_Overview	/es/docs/Web/JavaScript/Guide/Introduction
 /es/docs/JavaScript/Guide/Obsolete_Pages	/es/docs/Web/JavaScript/Guide
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5	/es/docs/Web/JavaScript/Guide
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Constantes	/es/docs/Web/JavaScript/Referencia/Sentencias/const
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Constantes	/es/docs/Web/JavaScript/Reference/Statements/const
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Constructores_más_flexibles	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Constructores_mas_flexibles
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Creando_nuevos_objetos
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos/Borrando_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Eliminando_propiedades
@@ -861,7 +1019,7 @@
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos/Using_Object_Initializers	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos/Utilizando_Objetos_Iniciadores	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_una_expresión_regular	/es/docs/Web/JavaScript/Guide/Regular_Expressions
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/El_ejemplo_Empleado	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/El_ejemplo_Employee	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/El_ejemplo_Employee/Creando_la_jerarquía	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Creacion_de_la_jerarquia
@@ -887,15 +1045,15 @@
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Herencia_no_múltiple	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#No_existe_herencia_multiple
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Información_global_en_los_constructores	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Informacion_global_en_los_constructores
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Valores_locales_frente_a_los_heredados	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Valores_locales_frente_a_valores_heredados
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos	/es/docs/Web/JavaScript/Referencia
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Math	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Number	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos	/es/docs/Web/JavaScript/Reference
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_y_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Objetos_y_propiedades
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_aritméticos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_aritm.C3.A9ticos
@@ -905,10 +1063,10 @@
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Special_operators
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_lógicos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_l.C3.B3gicos
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_sobre_bits	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_Bit-a-bit
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions/eval_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions/eval_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencia_condicional	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Condicionales
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencia_de_bloque	/es/docs/Web/JavaScript/Referencia/Sentencias/block
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencia_de_bloque	/es/docs/Web/JavaScript/Reference/Statements/block
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Utilizing_Error_objects
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones/throw	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#throw_statement
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones/try...catch	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#try...catch_statement
@@ -919,13 +1077,13 @@
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Trabajar_con_expresiones_regulares/Ejemplos_de_expresiones_regulares	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Trabajar_con_expresiones_regulares/Usar_coincidencias_de_subcadenas_parentizadas	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Unicode	/en-US/docs/Web/JavaScript/Reference/Lexical_grammar
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Funciones
-/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Valores	/es/docs/Web/JavaScript/Guide/Grammar_and_types
 /es/docs/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Variables	/es/docs/Web/JavaScript/Guide/Grammar_and_types
-/es/docs/JavaScript/Guide/Trabajando_con_objectos	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos
+/es/docs/JavaScript/Guide/Trabajando_con_objectos	/es/docs/Web/JavaScript/Guide/Working_with_Objects
 /es/docs/JavaScript/Guide/Valores,_variables_y_literales	/es/docs/Web/JavaScript/Guide/Grammar_and_types
-/es/docs/JavaScript/Introducción_a_JavaScript_orientado_a_objetos	/es/docs/Web/JavaScript/Introducción_a_JavaScript_orientado_a_objetos
+/es/docs/JavaScript/Introducción_a_JavaScript_orientado_a_objetos	/es/docs/conflicting/Learn/JavaScript/Objects
 /es/docs/JavaScript/Novedades_en_JavaScript	/es/docs/Web/JavaScript/Novedades_en_JavaScript
 /es/docs/JavaScript/Novedades_en_JavaScript/1.5	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.5
 /es/docs/JavaScript/Novedades_en_JavaScript/1.6	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.6
@@ -934,160 +1092,186 @@
 /es/docs/JavaScript/Novedades_en_JavaScript/1.8.5	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.8.5
 /es/docs/JavaScript/Novedades_en_JavaScript/Novedades_en_JavaScript_1.8.5	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.8.5
 /es/docs/JavaScript/Primeros_Pasos	/es/docs/Learn/Getting_started_with_the_web/JavaScript_basics
-/es/docs/JavaScript/Reference/Global_Objects/Array/push	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/push
-/es/docs/JavaScript/Reference/Global_Objects/RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/JavaScript/Reference/Operators/function	/es/docs/Web/JavaScript/Referencia/Operadores/function
-/es/docs/JavaScript/Reference/Operators/get	/es/docs/Web/JavaScript/Referencia/Funciones/get
-/es/docs/JavaScript/Reference/Operators/in	/es/docs/Web/JavaScript/Referencia/Operadores/in
-/es/docs/JavaScript/Reference/Operators/this	/es/docs/Web/JavaScript/Referencia/Operadores/this
-/es/docs/JavaScript/Referencia	/es/docs/Web/JavaScript/Referencia
-/es/docs/JavaScript/Referencia/Acerca_de	/es/docs/Web/JavaScript/Referencia/Acerca_de
-/es/docs/JavaScript/Referencia/Características_Desaprobadas	/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas
-/es/docs/JavaScript/Referencia/Características_Despreciadas	/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas
-/es/docs/JavaScript/Referencia/Funciones	/es/docs/Web/JavaScript/Referencia/Funciones
-/es/docs/JavaScript/Referencia/Funciones/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/JavaScript/Referencia/Funciones/arguments	/es/docs/Web/JavaScript/Referencia/Funciones/arguments
-/es/docs/JavaScript/Referencia/Funciones/arguments/callee	/es/docs/Web/JavaScript/Referencia/Funciones/arguments/callee
-/es/docs/JavaScript/Referencia/Funciones_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/JavaScript/Referencia/Funciones_globales/Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/JavaScript/Referencia/Funciones_globales/Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/JavaScript/Referencia/Funciones_globales/Object	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object
-/es/docs/JavaScript/Referencia/Funciones_globales/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/JavaScript/Referencia/Funciones_globales/decodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURI
-/es/docs/JavaScript/Referencia/Funciones_globales/decodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent
-/es/docs/JavaScript/Referencia/Funciones_globales/encodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURI
-/es/docs/JavaScript/Referencia/Funciones_globales/encodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent
-/es/docs/JavaScript/Referencia/Funciones_globales/eval	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
-/es/docs/JavaScript/Referencia/Funciones_globales/isFinite	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite
-/es/docs/JavaScript/Referencia/Funciones_globales/isNaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isNaN
-/es/docs/JavaScript/Referencia/Funciones_globales/parseInt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseInt
-/es/docs/JavaScript/Referencia/Objetos_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/JavaScript/Referencia/Objetos_globales/Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/JavaScript/Referencia/Objetos_globales/Array/forEach	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/forEach
-/es/docs/JavaScript/Referencia/Objetos_globales/Array/indexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/indexOf
-/es/docs/JavaScript/Referencia/Objetos_globales/Array/push	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/push
-/es/docs/JavaScript/Referencia/Objetos_globales/Array/reduce	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduce
-/es/docs/JavaScript/Referencia/Objetos_globales/Array/reduceRight	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight
-/es/docs/JavaScript/Referencia/Objetos_globales/Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/JavaScript/Referencia/Objetos_globales/Boolean/toSource	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean/toSource
-/es/docs/JavaScript/Referencia/Objetos_globales/Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/JavaScript/Referencia/Objetos_globales/Date/UTC	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/UTC
-/es/docs/JavaScript/Referencia/Objetos_globales/Date/now	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/now
-/es/docs/JavaScript/Referencia/Objetos_globales/Date/parse	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/parse
-/es/docs/JavaScript/Referencia/Objetos_globales/Error	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error
-/es/docs/JavaScript/Referencia/Objetos_globales/Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function
-/es/docs/JavaScript/Referencia/Objetos_globales/Function/apply	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/apply
-/es/docs/JavaScript/Referencia/Objetos_globales/Function/arguments	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/arguments
-/es/docs/JavaScript/Referencia/Objetos_globales/Function/call	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/call
-/es/docs/JavaScript/Referencia/Objetos_globales/Function/prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/prototype
-/es/docs/JavaScript/Referencia/Objetos_globales/JSON	/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON
-/es/docs/JavaScript/Referencia/Objetos_globales/JSON/stringify	/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON/stringify
-/es/docs/JavaScript/Referencia/Objetos_globales/Math	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math
-/es/docs/JavaScript/Referencia/Objetos_globales/Math/E	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/E
-/es/docs/JavaScript/Referencia/Objetos_globales/Math/LN10	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LN10
-/es/docs/JavaScript/Referencia/Objetos_globales/Math/LN2	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LN2
-/es/docs/JavaScript/Referencia/Objetos_globales/Math/LOG2E	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LOG2E
-/es/docs/JavaScript/Referencia/Objetos_globales/Math/floor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/floor
-/es/docs/JavaScript/Referencia/Objetos_globales/Number	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number
-/es/docs/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY
-/es/docs/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY
-/es/docs/JavaScript/Referencia/Objetos_globales/Number/prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/prototype
-/es/docs/JavaScript/Referencia/Objetos_globales/Number/toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/toString
-/es/docs/JavaScript/Referencia/Objetos_globales/Object	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object
-/es/docs/JavaScript/Referencia/Objetos_globales/Object/constructor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/constructor
-/es/docs/JavaScript/Referencia/Objetos_globales/Object/create	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/create
-/es/docs/JavaScript/Referencia/Objetos_globales/Object/defineProperties	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/defineProperties
-/es/docs/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty
-/es/docs/JavaScript/Referencia/Objetos_globales/Object/toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toString
+/es/docs/JavaScript/Reference/Global_Objects/Array/push	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/push
+/es/docs/JavaScript/Reference/Global_Objects/RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/JavaScript/Reference/Operators/function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/JavaScript/Reference/Operators/get	/es/docs/Web/JavaScript/Reference/Functions/get
+/es/docs/JavaScript/Reference/Operators/in	/es/docs/Web/JavaScript/Reference/Operators/in
+/es/docs/JavaScript/Reference/Operators/this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/JavaScript/Referencia	/es/docs/Web/JavaScript/Reference
+/es/docs/JavaScript/Referencia/Acerca_de	/es/docs/Web/JavaScript/Reference/About
+/es/docs/JavaScript/Referencia/Características_Desaprobadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/JavaScript/Referencia/Características_Despreciadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/JavaScript/Referencia/Funciones	/es/docs/Web/JavaScript/Reference/Functions
+/es/docs/JavaScript/Referencia/Funciones/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/JavaScript/Referencia/Funciones/arguments	/es/docs/Web/JavaScript/Reference/Functions/arguments
+/es/docs/JavaScript/Referencia/Funciones/arguments/callee	/es/docs/Web/JavaScript/Reference/Functions/arguments/callee
+/es/docs/JavaScript/Referencia/Funciones_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/JavaScript/Referencia/Funciones_globales/Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/JavaScript/Referencia/Funciones_globales/Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/JavaScript/Referencia/Funciones_globales/Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/JavaScript/Referencia/Funciones_globales/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/JavaScript/Referencia/Funciones_globales/decodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURI
+/es/docs/JavaScript/Referencia/Funciones_globales/decodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent
+/es/docs/JavaScript/Referencia/Funciones_globales/encodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURI
+/es/docs/JavaScript/Referencia/Funciones_globales/encodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
+/es/docs/JavaScript/Referencia/Funciones_globales/eval	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
+/es/docs/JavaScript/Referencia/Funciones_globales/isFinite	/es/docs/Web/JavaScript/Reference/Global_Objects/isFinite
+/es/docs/JavaScript/Referencia/Funciones_globales/isNaN	/es/docs/Web/JavaScript/Reference/Global_Objects/isNaN
+/es/docs/JavaScript/Referencia/Funciones_globales/parseInt	/es/docs/Web/JavaScript/Reference/Global_Objects/parseInt
+/es/docs/JavaScript/Referencia/Objetos_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/JavaScript/Referencia/Objetos_globales/Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/JavaScript/Referencia/Objetos_globales/Array/forEach	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
+/es/docs/JavaScript/Referencia/Objetos_globales/Array/indexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf
+/es/docs/JavaScript/Referencia/Objetos_globales/Array/push	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/push
+/es/docs/JavaScript/Referencia/Objetos_globales/Array/reduce	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
+/es/docs/JavaScript/Referencia/Objetos_globales/Array/reduceRight	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/ReduceRight
+/es/docs/JavaScript/Referencia/Objetos_globales/Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/JavaScript/Referencia/Objetos_globales/Boolean/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean/toSource
+/es/docs/JavaScript/Referencia/Objetos_globales/Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/JavaScript/Referencia/Objetos_globales/Date/UTC	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC
+/es/docs/JavaScript/Referencia/Objetos_globales/Date/now	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/now
+/es/docs/JavaScript/Referencia/Objetos_globales/Date/parse	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/parse
+/es/docs/JavaScript/Referencia/Objetos_globales/Error	/es/docs/Web/JavaScript/Reference/Global_Objects/Error
+/es/docs/JavaScript/Referencia/Objetos_globales/Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/JavaScript/Referencia/Objetos_globales/Function/apply	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
+/es/docs/JavaScript/Referencia/Objetos_globales/Function/arguments	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/arguments
+/es/docs/JavaScript/Referencia/Objetos_globales/Function/call	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/call
+/es/docs/JavaScript/Referencia/Objetos_globales/Function/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/JavaScript/Referencia/Objetos_globales/JSON	/es/docs/Web/JavaScript/Reference/Global_Objects/JSON
+/es/docs/JavaScript/Referencia/Objetos_globales/JSON/stringify	/es/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
+/es/docs/JavaScript/Referencia/Objetos_globales/Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/JavaScript/Referencia/Objetos_globales/Math/E	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/E
+/es/docs/JavaScript/Referencia/Objetos_globales/Math/LN10	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LN10
+/es/docs/JavaScript/Referencia/Objetos_globales/Math/LN2	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LN2
+/es/docs/JavaScript/Referencia/Objetos_globales/Math/LOG2E	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LOG2E
+/es/docs/JavaScript/Referencia/Objetos_globales/Math/floor	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/floor
+/es/docs/JavaScript/Referencia/Objetos_globales/Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY
+/es/docs/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY
+/es/docs/JavaScript/Referencia/Objetos_globales/Number/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/JavaScript/Referencia/Objetos_globales/Number/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/toString
+/es/docs/JavaScript/Referencia/Objetos_globales/Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/JavaScript/Referencia/Objetos_globales/Object/constructor	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor
+/es/docs/JavaScript/Referencia/Objetos_globales/Object/create	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/create
+/es/docs/JavaScript/Referencia/Objetos_globales/Object/defineProperties	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties
+/es/docs/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
+/es/docs/JavaScript/Referencia/Objetos_globales/Object/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/toString
 /es/docs/JavaScript/Referencia/Objetos_globales/Object/unwatch	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/unwatch
 /es/docs/JavaScript/Referencia/Objetos_globales/Object/watch	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/watch
-/es/docs/JavaScript/Referencia/Objetos_globales/RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/JavaScript/Referencia/Objetos_globales/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/JavaScript/Referencia/Objetos_globales/String/anchor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/anchor
-/es/docs/JavaScript/Referencia/Objetos_globales/String/big	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/big
-/es/docs/JavaScript/Referencia/Objetos_globales/String/blink	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/blink
-/es/docs/JavaScript/Referencia/Objetos_globales/String/bold	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/bold
-/es/docs/JavaScript/Referencia/Objetos_globales/String/charAt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charAt
-/es/docs/JavaScript/Referencia/Objetos_globales/String/charCodeAt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charCodeAt
-/es/docs/JavaScript/Referencia/Objetos_globales/String/concat	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/concat
-/es/docs/JavaScript/Referencia/Objetos_globales/String/constructor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/JavaScript/Referencia/Objetos_globales/String/fixed	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fixed
-/es/docs/JavaScript/Referencia/Objetos_globales/String/fromCharCode	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fromCharCode
-/es/docs/JavaScript/Referencia/Objetos_globales/String/indexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/indexOf
-/es/docs/JavaScript/Referencia/Objetos_globales/String/italics	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/italics
-/es/docs/JavaScript/Referencia/Objetos_globales/String/lastIndexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/lastIndexOf
-/es/docs/JavaScript/Referencia/Objetos_globales/String/length	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/length
-/es/docs/JavaScript/Referencia/Objetos_globales/String/link	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/link
-/es/docs/JavaScript/Referencia/Objetos_globales/String/match	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/match
-/es/docs/JavaScript/Referencia/Objetos_globales/String/prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/prototype
-/es/docs/JavaScript/Referencia/Objetos_globales/String/replace	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/replace
-/es/docs/JavaScript/Referencia/Objetos_globales/String/search	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/search
-/es/docs/JavaScript/Referencia/Objetos_globales/String/slice	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/slice
-/es/docs/JavaScript/Referencia/Objetos_globales/String/small	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/small
-/es/docs/JavaScript/Referencia/Objetos_globales/String/split	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/split
-/es/docs/JavaScript/Referencia/Objetos_globales/String/strike	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/strike
-/es/docs/JavaScript/Referencia/Objetos_globales/String/sub	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sub
-/es/docs/JavaScript/Referencia/Objetos_globales/String/substr	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substr
-/es/docs/JavaScript/Referencia/Objetos_globales/String/substring	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substring
-/es/docs/JavaScript/Referencia/Objetos_globales/String/sup	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sup
-/es/docs/JavaScript/Referencia/Objetos_globales/String/toLowerCase	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toLowerCase
-/es/docs/JavaScript/Referencia/Objetos_globales/String/toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toString
-/es/docs/JavaScript/Referencia/Objetos_globales/String/toUpperCase	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toUpperCase
-/es/docs/JavaScript/Referencia/Objetos_globales/String/valueOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/valueOf
-/es/docs/JavaScript/Referencia/Objetos_globales/eval	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
-/es/docs/JavaScript/Referencia/Objetos_globales/parseFloat	/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseFloat
-/es/docs/JavaScript/Referencia/Objetos_globlales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/JavaScript/Referencia/Objetos_globlales/Function/arguments	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/arguments
-/es/docs/JavaScript/Referencia/Operadores	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/JavaScript/Referencia/Operadores/Aritméticos	/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos
-/es/docs/JavaScript/Referencia/Operadores/Especiales	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/JavaScript/Referencia/Operadores/Especiales/function	/es/docs/Web/JavaScript/Referencia/Operadores/function
-/es/docs/JavaScript/Referencia/Operadores/Especiales/instanceof	/es/docs/Web/JavaScript/Referencia/Operadores/instanceof
-/es/docs/JavaScript/Referencia/Operadores/Especiales/typeof	/es/docs/Web/JavaScript/Referencia/Operadores/typeof
-/es/docs/JavaScript/Referencia/Operadores/Especiales/void	/es/docs/Web/JavaScript/Referencia/Operadores/void
-/es/docs/JavaScript/Referencia/Operadores/Miembros	/es/docs/Web/JavaScript/Referencia/Operadores/Miembros
-/es/docs/JavaScript/Referencia/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/JavaScript/Referencia/Operadores/Operadores_especiales/Operador_this	/es/docs/Web/JavaScript/Referencia/Operadores/this
-/es/docs/JavaScript/Referencia/Operadores/Operator_Precedence	/es/docs/Web/JavaScript/Referencia/Operadores/Operator_Precedence
-/es/docs/JavaScript/Referencia/Operadores/String	/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos
-/es/docs/JavaScript/Referencia/Operadores/function	/es/docs/Web/JavaScript/Referencia/Operadores/function
-/es/docs/JavaScript/Referencia/Operadores/get	/es/docs/Web/JavaScript/Referencia/Funciones/get
-/es/docs/JavaScript/Referencia/Operadores/in	/es/docs/Web/JavaScript/Referencia/Operadores/in
-/es/docs/JavaScript/Referencia/Operadores/instanceof	/es/docs/Web/JavaScript/Referencia/Operadores/instanceof
-/es/docs/JavaScript/Referencia/Operadores/new	/es/docs/Web/JavaScript/Referencia/Operadores/new
-/es/docs/JavaScript/Referencia/Operadores/this	/es/docs/Web/JavaScript/Referencia/Operadores/this
-/es/docs/JavaScript/Referencia/Operadores/typeof	/es/docs/Web/JavaScript/Referencia/Operadores/typeof
-/es/docs/JavaScript/Referencia/Operadores/void	/es/docs/Web/JavaScript/Referencia/Operadores/void
-/es/docs/JavaScript/Referencia/Operadores/void_	/es/docs/Web/JavaScript/Referencia/Operadores/void
-/es/docs/JavaScript/Referencia/Palabras_Reservadas	/es/docs/Web/JavaScript/Referencia/Palabras_Reservadas
-/es/docs/JavaScript/Referencia/Propiedades_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/JavaScript/Referencia/Propiedades_globales/Infinity	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Infinity
-/es/docs/JavaScript/Referencia/Propiedades_globales/NaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/NaN
-/es/docs/JavaScript/Referencia/Propiedades_globales/undefined	/es/docs/Web/JavaScript/Referencia/Objetos_globales/undefined
-/es/docs/JavaScript/Referencia/Sentencias	/es/docs/Web/JavaScript/Referencia/Sentencias
-/es/docs/JavaScript/Referencia/Sentencias/block	/es/docs/Web/JavaScript/Referencia/Sentencias/block
-/es/docs/JavaScript/Referencia/Sentencias/break	/es/docs/Web/JavaScript/Referencia/Sentencias/break
-/es/docs/JavaScript/Referencia/Sentencias/const	/es/docs/Web/JavaScript/Referencia/Sentencias/const
-/es/docs/JavaScript/Referencia/Sentencias/continue	/es/docs/Web/JavaScript/Referencia/Sentencias/continue
-/es/docs/JavaScript/Referencia/Sentencias/do...while	/es/docs/Web/JavaScript/Referencia/Sentencias/do...while
-/es/docs/JavaScript/Referencia/Sentencias/export	/es/docs/Web/JavaScript/Referencia/Sentencias/export
-/es/docs/JavaScript/Referencia/Sentencias/for	/es/docs/Web/JavaScript/Referencia/Sentencias/for
-/es/docs/JavaScript/Referencia/Sentencias/for...in	/es/docs/Web/JavaScript/Referencia/Sentencias/for...in
+/es/docs/JavaScript/Referencia/Objetos_globales/RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/JavaScript/Referencia/Objetos_globales/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/JavaScript/Referencia/Objetos_globales/String/anchor	/es/docs/Web/JavaScript/Reference/Global_Objects/String/anchor
+/es/docs/JavaScript/Referencia/Objetos_globales/String/big	/es/docs/Web/JavaScript/Reference/Global_Objects/String/big
+/es/docs/JavaScript/Referencia/Objetos_globales/String/blink	/es/docs/Web/JavaScript/Reference/Global_Objects/String/blink
+/es/docs/JavaScript/Referencia/Objetos_globales/String/bold	/es/docs/Web/JavaScript/Reference/Global_Objects/String/bold
+/es/docs/JavaScript/Referencia/Objetos_globales/String/charAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charAt
+/es/docs/JavaScript/Referencia/Objetos_globales/String/charCodeAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt
+/es/docs/JavaScript/Referencia/Objetos_globales/String/concat	/es/docs/Web/JavaScript/Reference/Global_Objects/String/concat
+/es/docs/JavaScript/Referencia/Objetos_globales/String/constructor	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/JavaScript/Referencia/Objetos_globales/String/fixed	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fixed
+/es/docs/JavaScript/Referencia/Objetos_globales/String/fromCharCode	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode
+/es/docs/JavaScript/Referencia/Objetos_globales/String/indexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf
+/es/docs/JavaScript/Referencia/Objetos_globales/String/italics	/es/docs/Web/JavaScript/Reference/Global_Objects/String/italics
+/es/docs/JavaScript/Referencia/Objetos_globales/String/lastIndexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
+/es/docs/JavaScript/Referencia/Objetos_globales/String/length	/es/docs/Web/JavaScript/Reference/Global_Objects/String/length
+/es/docs/JavaScript/Referencia/Objetos_globales/String/link	/es/docs/Web/JavaScript/Reference/Global_Objects/String/link
+/es/docs/JavaScript/Referencia/Objetos_globales/String/match	/es/docs/Web/JavaScript/Reference/Global_Objects/String/match
+/es/docs/JavaScript/Referencia/Objetos_globales/String/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/JavaScript/Referencia/Objetos_globales/String/replace	/es/docs/Web/JavaScript/Reference/Global_Objects/String/replace
+/es/docs/JavaScript/Referencia/Objetos_globales/String/search	/es/docs/Web/JavaScript/Reference/Global_Objects/String/search
+/es/docs/JavaScript/Referencia/Objetos_globales/String/slice	/es/docs/Web/JavaScript/Reference/Global_Objects/String/slice
+/es/docs/JavaScript/Referencia/Objetos_globales/String/small	/es/docs/Web/JavaScript/Reference/Global_Objects/String/small
+/es/docs/JavaScript/Referencia/Objetos_globales/String/split	/es/docs/Web/JavaScript/Reference/Global_Objects/String/split
+/es/docs/JavaScript/Referencia/Objetos_globales/String/strike	/es/docs/Web/JavaScript/Reference/Global_Objects/String/strike
+/es/docs/JavaScript/Referencia/Objetos_globales/String/sub	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sub
+/es/docs/JavaScript/Referencia/Objetos_globales/String/substr	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substr
+/es/docs/JavaScript/Referencia/Objetos_globales/String/substring	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substring
+/es/docs/JavaScript/Referencia/Objetos_globales/String/sup	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sup
+/es/docs/JavaScript/Referencia/Objetos_globales/String/toLowerCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase
+/es/docs/JavaScript/Referencia/Objetos_globales/String/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toString
+/es/docs/JavaScript/Referencia/Objetos_globales/String/toUpperCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase
+/es/docs/JavaScript/Referencia/Objetos_globales/String/valueOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/valueOf
+/es/docs/JavaScript/Referencia/Objetos_globales/eval	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
+/es/docs/JavaScript/Referencia/Objetos_globales/parseFloat	/es/docs/Web/JavaScript/Reference/Global_Objects/parseFloat
+/es/docs/JavaScript/Referencia/Objetos_globlales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/JavaScript/Referencia/Objetos_globlales/Function/arguments	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/arguments
+/es/docs/JavaScript/Referencia/Operadores	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/JavaScript/Referencia/Operadores/Aritméticos	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/JavaScript/Referencia/Operadores/Especiales	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/JavaScript/Referencia/Operadores/Especiales/function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/JavaScript/Referencia/Operadores/Especiales/instanceof	/es/docs/Web/JavaScript/Reference/Operators/instanceof
+/es/docs/JavaScript/Referencia/Operadores/Especiales/typeof	/es/docs/Web/JavaScript/Reference/Operators/typeof
+/es/docs/JavaScript/Referencia/Operadores/Especiales/void	/es/docs/Web/JavaScript/Reference/Operators/void
+/es/docs/JavaScript/Referencia/Operadores/Miembros	/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors
+/es/docs/JavaScript/Referencia/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/JavaScript/Referencia/Operadores/Operadores_especiales/Operador_this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/JavaScript/Referencia/Operadores/Operator_Precedence	/es/docs/Web/JavaScript/Reference/Operators/Operator_Precedence
+/es/docs/JavaScript/Referencia/Operadores/String	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/JavaScript/Referencia/Operadores/function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/JavaScript/Referencia/Operadores/get	/es/docs/Web/JavaScript/Reference/Functions/get
+/es/docs/JavaScript/Referencia/Operadores/in	/es/docs/Web/JavaScript/Reference/Operators/in
+/es/docs/JavaScript/Referencia/Operadores/instanceof	/es/docs/Web/JavaScript/Reference/Operators/instanceof
+/es/docs/JavaScript/Referencia/Operadores/new	/es/docs/Web/JavaScript/Reference/Operators/new
+/es/docs/JavaScript/Referencia/Operadores/this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/JavaScript/Referencia/Operadores/typeof	/es/docs/Web/JavaScript/Reference/Operators/typeof
+/es/docs/JavaScript/Referencia/Operadores/void	/es/docs/Web/JavaScript/Reference/Operators/void
+/es/docs/JavaScript/Referencia/Operadores/void_	/es/docs/Web/JavaScript/Reference/Operators/void
+/es/docs/JavaScript/Referencia/Palabras_Reservadas	/es/docs/conflicting/Web/JavaScript/Reference/Lexical_grammar
+/es/docs/JavaScript/Referencia/Propiedades_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/JavaScript/Referencia/Propiedades_globales/Infinity	/es/docs/Web/JavaScript/Reference/Global_Objects/Infinity
+/es/docs/JavaScript/Referencia/Propiedades_globales/NaN	/es/docs/Web/JavaScript/Reference/Global_Objects/NaN
+/es/docs/JavaScript/Referencia/Propiedades_globales/undefined	/es/docs/Web/JavaScript/Reference/Global_Objects/undefined
+/es/docs/JavaScript/Referencia/Sentencias	/es/docs/Web/JavaScript/Reference/Statements
+/es/docs/JavaScript/Referencia/Sentencias/block	/es/docs/Web/JavaScript/Reference/Statements/block
+/es/docs/JavaScript/Referencia/Sentencias/break	/es/docs/Web/JavaScript/Reference/Statements/break
+/es/docs/JavaScript/Referencia/Sentencias/const	/es/docs/Web/JavaScript/Reference/Statements/const
+/es/docs/JavaScript/Referencia/Sentencias/continue	/es/docs/Web/JavaScript/Reference/Statements/continue
+/es/docs/JavaScript/Referencia/Sentencias/do...while	/es/docs/Web/JavaScript/Reference/Statements/do...while
+/es/docs/JavaScript/Referencia/Sentencias/export	/es/docs/Web/JavaScript/Reference/Statements/export
+/es/docs/JavaScript/Referencia/Sentencias/for	/es/docs/Web/JavaScript/Reference/Statements/for
+/es/docs/JavaScript/Referencia/Sentencias/for...in	/es/docs/Web/JavaScript/Reference/Statements/for...in
 /es/docs/JavaScript/Referencia/Sentencias/for_each...in	/es/docs/Web/JavaScript/Referencia/Sentencias/for_each...in
-/es/docs/JavaScript/Referencia/Sentencias/function	/es/docs/Web/JavaScript/Referencia/Sentencias/function
-/es/docs/JavaScript/Referencia/Sentencias/if...else	/es/docs/Web/JavaScript/Referencia/Sentencias/if...else
-/es/docs/JavaScript/Referencia/Sentencias/label	/es/docs/Web/JavaScript/Referencia/Sentencias/label
-/es/docs/JavaScript/Referencia/Sentencias/return	/es/docs/Web/JavaScript/Referencia/Sentencias/return
-/es/docs/JavaScript/Referencia/Sentencias/throw	/es/docs/Web/JavaScript/Referencia/Sentencias/throw
-/es/docs/JavaScript/Referencia/Sentencias/try...catch	/es/docs/Web/JavaScript/Referencia/Sentencias/try...catch
-/es/docs/JavaScript/Referencia/Sentencias/var	/es/docs/Web/JavaScript/Referencia/Sentencias/var
-/es/docs/JavaScript/Referencia/Sentencias/while	/es/docs/Web/JavaScript/Referencia/Sentencias/while
-/es/docs/JavaScript/Una_nueva_introducción_a_JavaScript	/es/docs/Web/JavaScript/Una_re-introducción_a_JavaScript
+/es/docs/JavaScript/Referencia/Sentencias/function	/es/docs/Web/JavaScript/Reference/Statements/function
+/es/docs/JavaScript/Referencia/Sentencias/if...else	/es/docs/Web/JavaScript/Reference/Statements/if...else
+/es/docs/JavaScript/Referencia/Sentencias/label	/es/docs/Web/JavaScript/Reference/Statements/label
+/es/docs/JavaScript/Referencia/Sentencias/return	/es/docs/Web/JavaScript/Reference/Statements/return
+/es/docs/JavaScript/Referencia/Sentencias/throw	/es/docs/Web/JavaScript/Reference/Statements/throw
+/es/docs/JavaScript/Referencia/Sentencias/try...catch	/es/docs/Web/JavaScript/Reference/Statements/try...catch
+/es/docs/JavaScript/Referencia/Sentencias/var	/es/docs/Web/JavaScript/Reference/Statements/var
+/es/docs/JavaScript/Referencia/Sentencias/while	/es/docs/Web/JavaScript/Reference/Statements/while
+/es/docs/JavaScript/Una_nueva_introducción_a_JavaScript	/es/docs/Web/JavaScript/A_re-introduction_to_JavaScript
+/es/docs/Learn/Accessibility/Qué_es_la_accesibilidad	/es/docs/Learn/Accessibility/What_is_accessibility
+/es/docs/Learn/Aprender_y_obtener_ayuda	/es/docs/Learn/Learning_and_getting_help
+/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia	/es/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance
+/es/docs/Learn/CSS/Building_blocks/Contenido_desbordado	/es/docs/Learn/CSS/Building_blocks/Overflowing_content
+/es/docs/Learn/CSS/Building_blocks/Depurar_el_CSS	/es/docs/Learn/CSS/Building_blocks/Debugging_CSS
+/es/docs/Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS	/es/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS
+/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja	/es/docs/Learn/CSS/Building_blocks/The_box_model
+/es/docs/Learn/CSS/Building_blocks/Fondos_y_bordes	/es/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders
+/es/docs/Learn/CSS/Building_blocks/Imágenes_medios_y_elementos_de_formulario	/es/docs/Learn/CSS/Building_blocks/Images_media_form_elements
+/es/docs/Learn/CSS/Building_blocks/Manejando_diferentes_direcciones_de_texto	/es/docs/Learn/CSS/Building_blocks/Handling_different_text_directions
+/es/docs/Learn/CSS/Building_blocks/Selectores_CSS	/es/docs/Learn/CSS/Building_blocks/Selectors
+/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores	/es/docs/Learn/CSS/Building_blocks/Selectors/Combinators
+/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos	/es/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements
+/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos	/es/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors
+/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID	/es/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors
+/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS	/es/docs/Learn/CSS/Building_blocks/Values_and_units
+/es/docs/Learn/CSS/CSS_layout/Diseño_receptivo	/es/docs/Learn/CSS/CSS_layout/Responsive_Design
+/es/docs/Learn/CSS/CSS_layout/Flujo_normal	/es/docs/Learn/CSS/CSS_layout/Normal_Flow
+/es/docs/Learn/CSS/CSS_layout/Introducción	/es/docs/Learn/CSS/CSS_layout/Introduction
+/es/docs/Learn/CSS/CSS_layout/Soporte_a_navegadores_antiguos	/es/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers
+/es/docs/Learn/CSS/First_steps/Comenzando_CSS	/es/docs/Learn/CSS/First_steps/Getting_started
+/es/docs/Learn/CSS/First_steps/Como_funciona_CSS	/es/docs/Learn/CSS/First_steps/How_CSS_works
+/es/docs/Learn/CSS/First_steps/Como_se_estructura_CSS	/es/docs/Learn/CSS/First_steps/How_CSS_is_structured
+/es/docs/Learn/CSS/First_steps/Qué_es_CSS	/es/docs/Learn/CSS/First_steps/What_is_CSS
+/es/docs/Learn/CSS/First_steps/Usa_tu_nuevo_conocimiento	/es/docs/Learn/CSS/First_steps/Using_your_new_knowledge
 /es/docs/Learn/CSS/Introduction_to_CSS	/en-US/docs/Learn/CSS/First_steps
 /es/docs/Learn/CSS/Introduction_to_CSS/Cascada_y_herencia	/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance
 /es/docs/Learn/CSS/Introduction_to_CSS/Combinaciones_y_selectores_multiples	/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators
 /es/docs/Learn/CSS/Introduction_to_CSS/Como_funciona_CSS	/en-US/docs/Learn/CSS/First_steps/How_CSS_works
 /es/docs/Learn/CSS/Introduction_to_CSS/Depuración_CSS	/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS
+/es/docs/Learn/CSS/Introduction_to_CSS/Fundamental_CSS_comprehension	/es/docs/Learn/CSS/Building_blocks/Fundamental_CSS_comprehension
 /es/docs/Learn/CSS/Introduction_to_CSS/Modelo_cajas	/en-US/docs/Learn/CSS/Building_blocks/The_box_model
 /es/docs/Learn/CSS/Introduction_to_CSS/Pseudo-clases_y_pseudo-elementos	/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements
 /es/docs/Learn/CSS/Introduction_to_CSS/Selectores	/en-US/docs/Learn/CSS/Building_blocks/Selectors
@@ -1097,317 +1281,493 @@
 /es/docs/Learn/CSS/Introduction_to_CSS/Valores_y_unidades	/en-US/docs/Learn/CSS/Building_blocks/Values_and_units
 /es/docs/Learn/CSS/Styling_boxes	/en-US/docs/Learn/CSS/Building_blocks
 /es/docs/Learn/CSS/Styling_boxes/estilizando_tablas	/es/docs/Learn/CSS/Building_blocks/Styling_tables
-/es/docs/Learn/HTML/Forms/My_first_HTML_form	/es/docs/Learn/HTML/Forms/Your_first_HTML_form
+/es/docs/Learn/CSS/Styling_text/Fuentes_web	/es/docs/Learn/CSS/Styling_text/Web_fonts
+/es/docs/Learn/CSS/Sábercomo	/es/docs/Learn/CSS/Howto
+/es/docs/Learn/CSS/Sábercomo/Generated_content	/es/docs/Learn/CSS/Howto/Generated_content
+/es/docs/Learn/Common_questions/Cuanto_cuesta	/es/docs/Learn/Common_questions/How_much_does_it_cost
+/es/docs/Learn/Common_questions/Que_es_un_servidor_WEB	/es/docs/Learn/Common_questions/What_is_a_web_server
+/es/docs/Learn/Common_questions/Que_software_necesito	/es/docs/Learn/Common_questions/What_software_do_I_need
+/es/docs/Learn/Common_questions/Qué_es_una_URL	/es/docs/Learn/Common_questions/What_is_a_URL
+/es/docs/Learn/Common_questions/diseños_web_comunes	/es/docs/Learn/Common_questions/Common_web_layouts
+/es/docs/Learn/Como_Contribuir	/es/docs/orphaned/Learn/How_to_contribute
+/es/docs/Learn/Desarrollo_web_Front-end	/es/docs/Learn/Front-end_web_developer
+/es/docs/Learn/Getting_started_with_the_web/Cómo_funciona_la_Web	/es/docs/Learn/Getting_started_with_the_web/How_the_Web_works
+/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico	/es/docs/Learn/Getting_started_with_the_web/Installing_basic_software
+/es/docs/Learn/Getting_started_with_the_web/La_web_y_los_estandares_web	/es/docs/Learn/Getting_started_with_the_web/The_web_and_web_standards
+/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos	/es/docs/Learn/Getting_started_with_the_web/Dealing_with_files
+/es/docs/Learn/HTML/Forms	/es/docs/conflicting/Learn/Forms
+/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form	/es/docs/Learn/Forms/How_to_structure_a_web_form
+/es/docs/Learn/HTML/Forms/My_first_HTML_form	/es/docs/Learn/Forms/Your_first_form
+/es/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_controls	/es/docs/Learn/Forms/Property_compatibility_table_for_form_controls
+/es/docs/Learn/HTML/Forms/Prueba_tus_habilidades:_Otros_controles	/es/docs/Learn/Forms/Test_your_skills:_Other_controls
+/es/docs/Learn/HTML/Forms/Prueba_tus_habilidades:_controles_HTML5	/es/docs/Learn/Forms/Test_your_skills:_HTML5_controls
+/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data	/es/docs/Learn/Forms/Sending_and_retrieving_form_data
+/es/docs/Learn/HTML/Forms/Styling_HTML_forms	/es/docs/Learn/Forms/Styling_web_forms
+/es/docs/Learn/HTML/Forms/The_native_form_widgets	/es/docs/Learn/Forms/Basic_native_form_controls
+/es/docs/Learn/HTML/Forms/Tipos_input_HTML5	/es/docs/Learn/Forms/HTML5_input_types
+/es/docs/Learn/HTML/Forms/Validacion_formulario_datos	/es/docs/Learn/Forms/Form_validation
+/es/docs/Learn/HTML/Forms/Your_first_HTML_form	/es/docs/Learn/Forms/Your_first_form
+/es/docs/Learn/HTML/Forms/como_crear_widgets_de_formularios_personalizados	/es/docs/Learn/Forms/How_to_build_custom_form_controls
+/es/docs/Learn/HTML/Introduccion_a_HTML	/es/docs/Learn/HTML/Introduction_to_HTML
+/es/docs/Learn/HTML/Introduccion_a_HTML/Advanced_text_formatting	/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting
+/es/docs/Learn/HTML/Introduccion_a_HTML/Creating_hyperlinks	/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks
+/es/docs/Learn/HTML/Introduccion_a_HTML/Debugging_HTML	/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML
+/es/docs/Learn/HTML/Introduccion_a_HTML/Estructuración_de_una_página_de_contenido	/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content
+/es/docs/Learn/HTML/Introduccion_a_HTML/Marking_up_a_letter	/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter
+/es/docs/Learn/HTML/Introduccion_a_HTML/Metados_en	/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML
+/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces	/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_Links
+/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Texto_básico_HTML	/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_HTML_text_basics
+/es/docs/Learn/HTML/Introduccion_a_HTML/Test_your_skills:_Advanced_HTML_text	/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_Advanced_HTML_text
+/es/docs/Learn/HTML/Introduccion_a_HTML/estructura	/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure
+/es/docs/Learn/HTML/Introduccion_a_HTML/iniciar	/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started
+/es/docs/Learn/HTML/Introduccion_a_HTML/texto	/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals
+/es/docs/Learn/HTML/Tablas	/es/docs/Learn/HTML/Tables
+/es/docs/Learn/HTML/Tablas/Conceptos_básicos_de_las_tablas_HTML	/es/docs/Learn/HTML/Tables/Basics
+/es/docs/Learn/HTML/Tablas/Funciones_avanzadas_de_las_tablas_HTML_y_accesibilidad	/es/docs/Learn/HTML/Tables/Advanced
+/es/docs/Learn/HTML/Tablas/Structuring_planet_data	/es/docs/Learn/HTML/Tables/Structuring_planet_data
+/es/docs/Learn/HTML/como	/es/docs/Learn/HTML/Howto
+/es/docs/Learn/HTML/como/Usando_atributos_de_datos	/es/docs/Learn/HTML/Howto/Use_data_attributes
+/es/docs/Learn/Herramientas_y_pruebas	/es/docs/Learn/Tools_and_testing
+/es/docs/Learn/Herramientas_y_pruebas/Cross_browser_testing	/es/docs/Learn/Tools_and_testing/Cross_browser_testing
+/es/docs/Learn/Herramientas_y_pruebas/GitHub	/es/docs/Learn/Tools_and_testing/GitHub
+/es/docs/Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks	/es/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks
+/es/docs/Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started	/es/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started
+/es/docs/Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/Vue_primeros_pasos	/es/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started
+/es/docs/Learn/Herramientas_y_pruebas/Understanding_client-side_tools	/es/docs/Learn/Tools_and_testing/Understanding_client-side_tools
+/es/docs/Learn/JavaScript/Building_blocks/Bucle_codigo	/es/docs/Learn/JavaScript/Building_blocks/Looping_code
+/es/docs/Learn/JavaScript/Building_blocks/Construyendo_tu_propia_funcion	/es/docs/Learn/JavaScript/Building_blocks/Build_your_own_function
+/es/docs/Learn/JavaScript/Building_blocks/Eventos	/es/docs/Learn/JavaScript/Building_blocks/Events
+/es/docs/Learn/JavaScript/Building_blocks/Galeria_de_imagenes	/es/docs/Learn/JavaScript/Building_blocks/Image_gallery
+/es/docs/Learn/JavaScript/Client-side_web_APIs/Introducción	/es/docs/Learn/JavaScript/Client-side_web_APIs/Introduction
+/es/docs/Learn/JavaScript/First_steps/Generador_de_historias_absurdas	/es/docs/Learn/JavaScript/First_steps/Silly_story_generator
+/es/docs/Learn/JavaScript/First_steps/Matemáticas	/es/docs/Learn/JavaScript/First_steps/Math
+/es/docs/Learn/JavaScript/First_steps/Prueba_tus_habilidades:_Strings	/es/docs/Learn/JavaScript/First_steps/Test_your_skills:_Strings
+/es/docs/Learn/JavaScript/First_steps/Qué_es_JavaScript	/es/docs/Learn/JavaScript/First_steps/What_is_JavaScript
+/es/docs/Learn/JavaScript/Objects/Ejercicio_práctico_de_construcción_de_objetos	/es/docs/Learn/JavaScript/Objects/Object_building_practice
+/es/docs/Learn/Server-side/Django/Introducción	/es/docs/Learn/Server-side/Django/Introduction
+/es/docs/Learn/Server-side/Primeros_pasos	/es/docs/Learn/Server-side/First_steps
+/es/docs/Learn/Server-side/Primeros_pasos/Introducción	/es/docs/Learn/Server-side/First_steps/Introduction
+/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor	/es/docs/Learn/Server-side/First_steps/Client-Server_overview
+/es/docs/Learn/Server-side/Primeros_pasos/Web_frameworks	/es/docs/Learn/Server-side/First_steps/Web_frameworks
+/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web	/es/docs/Learn/Server-side/First_steps/Website_security
+/es/docs/Learn/Using_Github_pages	/es/docs/Learn/Common_questions/Using_Github_pages
+/es/docs/Learn/codificacion-scripting	/es/docs/conflicting/Learn
+/es/docs/Localización	/es/docs/Glossary/Localization
+/es/docs/Localizar_con_Narro	/es/docs/orphaned/Localizar_con_Narro
 /es/docs/Lugares:Guía_para_migración_con_lugares	/es/docs/Lugares/Guía_para_migración_con_lugares
 /es/docs/MDN/Comenzando	/es/docs/MDN/Contribute/Getting_started
+/es/docs/MDN/Comunidad	/es/docs/orphaned/MDN/Community
+/es/docs/MDN/Contribute/Community	/es/docs/orphaned/MDN/Community/Working_in_community
 /es/docs/MDN/Contribute/Content	/es/docs/MDN/Guidelines
-/es/docs/MDN/Contribute/Content/Content_blocks	/es/docs/MDN/Guidelines/Content_blocks
+/es/docs/MDN/Contribute/Content/Content_blocks	/es/docs/MDN/Guidelines/CSS_style_guide
 /es/docs/MDN/Contribute/Guidelines	/es/docs/MDN/Guidelines
-/es/docs/MDN/Contribute/Guidelines/Content_blocks	/es/docs/MDN/Guidelines/Content_blocks
-/es/docs/MDN/Contribute/Guidelines/Convenciones_y_definiciones	/es/docs/MDN/Guidelines/Convenciones_y_definiciones
-/es/docs/MDN/Contribute/Guidelines/Project:Guía_de_estilo	/es/docs/MDN/Guidelines/Project:Guía_de_estilo
+/es/docs/MDN/Contribute/Guidelines/Content_blocks	/es/docs/MDN/Guidelines/CSS_style_guide
+/es/docs/MDN/Contribute/Guidelines/Convenciones_y_definiciones	/es/docs/MDN/Guidelines/Conventions_definitions
+/es/docs/MDN/Contribute/Guidelines/Project:Guía_de_estilo	/es/docs/MDN/Guidelines/Writing_style_guide
 /es/docs/MDN/Contribute/Herramientas	/es/docs/MDN/Tools
-/es/docs/MDN/Contribute/Herramientas/Page_regeneration	/es/docs/MDN/Tools/Page_regeneration
-/es/docs/MDN/Contribute/Herramientas/Template_editing	/es/docs/MDN/Tools/Template_editing
+/es/docs/MDN/Contribute/Herramientas/Page_regeneration	/es/docs/orphaned/MDN/Tools/Page_regeneration
+/es/docs/MDN/Contribute/Herramientas/Template_editing	/es/docs/orphaned/MDN/Tools/Template_editing
+/es/docs/MDN/Contribute/Howto/Crear_cuenta_MDN	/es/docs/orphaned/MDN/Contribute/Howto/Create_an_MDN_account
+/es/docs/MDN/Contribute/Howto/Document_a_CSS_property/Plantilla_propiedad	/es/docs/orphaned/MDN/Contribute/Howto/Document_a_CSS_property/Property_template
+/es/docs/MDN/Contribute/Howto/Etiquetas_paginas_javascript	/es/docs/orphaned/MDN/Contribute/Howto/Tag_JavaScript_pages
+/es/docs/MDN/Contribute/Howto/Remover_Macros_Experimentales	/es/docs/orphaned/MDN/Contribute/Howto/Remove_Experimental_Macros
+/es/docs/MDN/Contribute/Howto/Set_the_summary_for_a_page	/es/docs/orphaned/MDN/Contribute/Howto/Set_the_summary_for_a_page
+/es/docs/MDN/Contribute/Howto/Usar_barras_laterales_de_navegación	/es/docs/orphaned/MDN/Contribute/Howto/Use_navigation_sidebars
+/es/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web	/es/docs/orphaned/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web
+/es/docs/MDN/Contribute/Howto/revision_editorial	/es/docs/orphaned/MDN/Contribute/Howto/Do_an_editorial_review
+/es/docs/MDN/Contribute/Howto/revision_tecnica	/es/docs/orphaned/MDN/Contribute/Howto/Do_a_technical_review
+/es/docs/MDN/Contribute/Procesos	/es/docs/MDN/Contribute/Processes
 /es/docs/MDN/Contribute/Structures	/es/docs/MDN/Structures
-/es/docs/MDN/Contribute/Structures/Ejemplos_ejecutables	/es/docs/MDN/Structures/Ejemplos_ejecutables
+/es/docs/MDN/Contribute/Structures/Ejemplos_ejecutables	/es/docs/MDN/Structures/Live_samples
 /es/docs/MDN/Contribute/Structures/Macros	/es/docs/MDN/Structures/Macros
 /es/docs/MDN/Contribute/Structures/Macros/Commonly-used_macros	/es/docs/MDN/Structures/Macros/Commonly-used_macros
-/es/docs/MDN/Contribute/Structures/Macros/Otras	/es/docs/MDN/Structures/Macros/Otras
-/es/docs/MDN/Contribute/Structures/Tablas_de_compatibilidad	/es/docs/MDN/Structures/Tablas_de_compatibilidad
+/es/docs/MDN/Contribute/Structures/Macros/Otras	/es/docs/MDN/Structures/Macros/Other
+/es/docs/MDN/Contribute/Structures/Tablas_de_compatibilidad	/es/docs/MDN/Structures/Compatibility_tables
+/es/docs/MDN/Contribute/Tareas	/es/docs/conflicting/MDN/Contribute/Getting_started
 /es/docs/MDN/Enviar_feedback_sobre_MDN	/es/docs/MDN/Contribute/Feedback
-/es/docs/MDN/Kuma/Introduction_to_KumaScript	/es/docs/MDN/Tools/Introduction_to_KumaScript
-/es/docs/Manipular_video_por_medio_de_canvas	/es/docs/Web/HTML/anipular_video_por_medio_de_canvas
+/es/docs/MDN/Guidelines/Content_blocks	/es/docs/MDN/Guidelines/CSS_style_guide
+/es/docs/MDN/Guidelines/Convenciones_y_definiciones	/es/docs/MDN/Guidelines/Conventions_definitions
+/es/docs/MDN/Guidelines/Project:Guía_de_estilo	/es/docs/MDN/Guidelines/Writing_style_guide
+/es/docs/MDN/Kuma	/es/docs/MDN/Yari
+/es/docs/MDN/Kuma/Contributing	/es/docs/conflicting/MDN/Yari_13d770b50d5ab9ce747962b2552e0eef
+/es/docs/MDN/Kuma/Contributing/Getting_started	/es/docs/conflicting/MDN/Yari
+/es/docs/MDN/Kuma/Introduction_to_KumaScript	/es/docs/MDN/Tools/KumaScript
+/es/docs/MDN/Structures/Ejemplos_ejecutables	/es/docs/MDN/Structures/Live_samples
+/es/docs/MDN/Structures/Macros/Otras	/es/docs/MDN/Structures/Macros/Other
+/es/docs/MDN/Structures/Tablas_de_compatibilidad	/es/docs/MDN/Structures/Compatibility_tables
+/es/docs/MDN/Tools/Introduction_to_KumaScript	/es/docs/MDN/Tools/KumaScript
+/es/docs/MDN/Tools/Page_regeneration	/es/docs/orphaned/MDN/Tools/Page_regeneration
+/es/docs/MDN/Tools/Template_editing	/es/docs/orphaned/MDN/Tools/Template_editing
+/es/docs/MDN/User_guide	/es/docs/conflicting/MDN/Tools
+/es/docs/MDN_en_diez	/es/docs/MDN/At_ten
+/es/docs/Manipular_video_por_medio_de_canvas	/es/docs/Web/API/Canvas_API/Manipulating_video_using_canvas
 /es/docs/MathML	/es/docs/Web/MathML
-/es/docs/MathML/Elemento	/es/docs/Web/MathML/Elemento
+/es/docs/MathML/Elemento	/es/docs/Web/MathML/Element
+/es/docs/Mejoras_DOM_en_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/DOM_improvements
+/es/docs/Mejoras_SVG_en_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/SVG_improvements
+/es/docs/Mejoras_XUL_en_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/XUL_improvements_in_Firefox_3
+/es/docs/Migrar_aplicaciones_desde_Internet_Explorer_a_Mozilla	/es/docs/orphaned/Migrar_aplicaciones_desde_Internet_Explorer_a_Mozilla
+/es/docs/Modo_casi_estándar_de_Gecko	/es/docs/orphaned/Modo_casi_estándar_de_Gecko
 /es/docs/Monitoring_downloads	/es/docs/Vigilar_descargas
+/es/docs/Mozilla/Add-ons/WebExtensions/Anatomia_de_una_WebExtension	/es/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension
+/es/docs/Mozilla/Add-ons/WebExtensions/Depuración	/es/docs/orphaned/Mozilla/Add-ons/WebExtensions/Debugging
+/es/docs/Mozilla/Add-ons/WebExtensions/Packaging_and_installation	/es/docs/orphaned/Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox
+/es/docs/Mozilla/Add-ons/WebExtensions/Porting_from_Google_Chrome	/es/docs/orphaned/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension
+/es/docs/Mozilla/Add-ons/WebExtensions/Prerequisitos	/es/docs/Mozilla/Add-ons/WebExtensions/Prerequisites
+/es/docs/Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension	/es/docs/orphaned/Mozilla/Add-ons/WebExtensions/Package_your_extension_
+/es/docs/Mozilla/Add-ons/WebExtensions/Que_son_las_WebExtensions	/es/docs/Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
+/es/docs/Mozilla/Add-ons/WebExtensions/Tu_primera_WebExtension	/es/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension
+/es/docs/Mozilla/Add-ons/WebExtensions/Tutorial	/es/docs/Mozilla/Add-ons/WebExtensions/Your_second_WebExtension
+/es/docs/Mozilla/Add-ons/WebExtensions/user_interface/Accion_navegador	/es/docs/Mozilla/Add-ons/WebExtensions/user_interface/Browser_action
+/es/docs/Mozilla/Developer_guide/Preguntas_frecuentes_sobre_la_compilación_de_Mozilla	/es/docs/Mozilla/Developer_guide/Mozilla_build_FAQ
+/es/docs/Mozilla/Developer_guide/Source_Code/Código_fuente_de_Mozilla_(CVS)	/es/docs/Mozilla/Developer_guide/Source_Code/CVS
+/es/docs/Módulos_JavaScript	/es/docs/orphaned/Módulos_JavaScript
 /es/docs/Novedades_en_JavaScript_1.6	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.6
 /es/docs/Novedades_en_JavaScript_1.7	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.7
 /es/docs/Novedades_en_JavaScript_1.8	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.8
 /es/docs/Novedades_en_Javascript_1.5	/es/docs/Web/JavaScript/Novedades_en_JavaScript/1.5
-/es/docs/Participando_en_el_proyecto_Mozilla	/es/docs/Participar_en_el_proyecto_Mozilla
-/es/docs/Poniendo_al_día_extensiones_para_Firefox_3	/es/docs/Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3
+/es/docs/Participando_en_el_proyecto_Mozilla	/es/docs/orphaned/Participar_en_el_proyecto_Mozilla
+/es/docs/Participar_en_el_proyecto_Mozilla	/es/docs/orphaned/Participar_en_el_proyecto_Mozilla
+/es/docs/Plantillas_en_Firefox_3	/es/docs/Mozilla/Firefox/Releases/3/Templates
+/es/docs/Poniendo_al_día_extensiones_para_Firefox_3	/es/docs/orphaned/Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3
 /es/docs/Portada	/es/docs/Web
-/es/docs/Preguntas_frecuentes_sobre_CSS	/es/docs/Web/CSS/Preguntas_frecuentes_sobre_CSS
-/es/docs/Preguntas_frecuentes_sobre_incrustación_en_Mozilla:Introducción_a_Gecko_e_inscrustación	/es/docs/Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación
-/es/docs/Preguntas_frecuentes_sobre_la_compilación_de_Mozilla	/es/docs/Mozilla/Developer_guide/Preguntas_frecuentes_sobre_la_compilación_de_Mozilla
+/es/docs/Preguntas_frecuentes_sobre_CSS	/es/docs/Learn/CSS/Howto/CSS_FAQ
+/es/docs/Preguntas_frecuentes_sobre_incrustación_en_Mozilla	/es/docs/orphaned/Preguntas_frecuentes_sobre_incrustación_en_Mozilla
+/es/docs/Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación	/es/docs/orphaned/Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación
+/es/docs/Preguntas_frecuentes_sobre_incrustación_en_Mozilla:Introducción_a_Gecko_e_inscrustación	/es/docs/orphaned/Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación
+/es/docs/Preguntas_frecuentes_sobre_la_compilación_de_Mozilla	/es/docs/Mozilla/Developer_guide/Mozilla_build_FAQ
+/es/docs/Principios_básicos_de_los_servicios_Web	/es/docs/orphaned/Principios_básicos_de_los_servicios_Web
 /es/docs/Quirks_Mode_and_Standards_Mode	/es/docs/Web/HTML/Quirks_Mode_and_Standards_Mode
-/es/docs/Recursos_offline_en_firefox	/es/docs/Web/HTML/Recursos_offline_en_firefox
-/es/docs/Referencia_CSS	/es/docs/Web/CSS/Referencia_CSS
+/es/docs/Recursos_en_modo_desconectado_en_Firefox	/es/docs/orphaned/Recursos_en_modo_desconectado_en_Firefox
+/es/docs/Recursos_offline_en_firefox	/es/docs/Web/HTML/Using_the_application_cache
+/es/docs/Referencia_CSS	/es/docs/Web/CSS/Reference
 /es/docs/Referencia_CSS/Extensiones_CSS_Mozilla	/es/docs/Web/CSS/Mozilla_Extensions
 /es/docs/Referencia_CSS/Extensiones_Mozilla	/es/docs/Web/CSS/Mozilla_Extensions
 /es/docs/Referencia_CSS:Extensiones_Mozilla	/es/docs/Web/CSS/Mozilla_Extensions
-/es/docs/Referencia_DOM_de_Gecko:Ejemplos	/es/docs/Referencia_DOM_de_Gecko/Ejemplos
-/es/docs/Referencia_DOM_de_Gecko:Introducción	/es/docs/Referencia_DOM_de_Gecko/Introducción
-/es/docs/Referencia_DOM_de_Gecko:Prefacio	/es/docs/Referencia_DOM_de_Gecko/Prefacio
-/es/docs/Referencia_de_JavaScript_1.5	/es/docs/Web/JavaScript/Referencia
-/es/docs/Referencia_de_JavaScript_1.5/Acerca_de	/es/docs/Web/JavaScript/Referencia/Acerca_de
-/es/docs/Referencia_de_JavaScript_1.5/Características_Desaprobadas	/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas
-/es/docs/Referencia_de_JavaScript_1.5/Características_Despreciadas	/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas
-/es/docs/Referencia_de_JavaScript_1.5/Funciones	/es/docs/Web/JavaScript/Referencia/Funciones
-/es/docs/Referencia_de_JavaScript_1.5/Funciones/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5/Funciones/arguments	/es/docs/Web/JavaScript/Referencia/Funciones/arguments
-/es/docs/Referencia_de_JavaScript_1.5/Funciones/arguments/callee	/es/docs/Web/JavaScript/Referencia/Funciones/arguments/callee
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/Object	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/decodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURI
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/decodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/encodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURI
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/encodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/eval	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isFinite	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isNaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isNaN
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/parseFloat	/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseFloat
-/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/parseInt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseInt
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/forEach	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/forEach
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/indexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/indexOf
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/push	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/push
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/reduce	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduce
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/reduceRight	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Boolean/toSource	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean/toSource
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date/UTC	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/UTC
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date/now	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/now
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date/parse	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/parse
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Error	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function/apply	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/apply
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function/call	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/call
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function/prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/prototype
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/JSON	/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/JSON/stringify	/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON/stringify
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/E	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/E
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/LN10	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LN10
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/LN2	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LN2
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/LOG2E	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LOG2E
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/floor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/floor
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/NEGATIVE_INFINITY	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/POSITIVE_INFINITY	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/prototype
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/toString
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/constructor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/constructor
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/create	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/create
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/defineProperties	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/defineProperties
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/hasOwnProperty	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toString
+/es/docs/Referencia_DOM_de_Gecko	/es/docs/Web/API/Document_Object_Model
+/es/docs/Referencia_DOM_de_Gecko/Cómo_espacioenblanco	/es/docs/Web/API/Document_Object_Model/Whitespace
+/es/docs/Referencia_DOM_de_Gecko/Ejemplos	/es/docs/Web/API/Document_Object_Model/Examples
+/es/docs/Referencia_DOM_de_Gecko/Eventos	/es/docs/Web/API/Document_Object_Model/Events
+/es/docs/Referencia_DOM_de_Gecko/Introducción	/es/docs/Web/API/Document_Object_Model/Introduction
+/es/docs/Referencia_DOM_de_Gecko/Localizando_elementos_DOM_usando_selectores	/es/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors
+/es/docs/Referencia_DOM_de_Gecko/Prefacio	/es/docs/conflicting/Web/API/Document_Object_Model_9f3a59543838705de7e9b080fde3cc14
+/es/docs/Referencia_DOM_de_Gecko:Ejemplos	/es/docs/Web/API/Document_Object_Model/Examples
+/es/docs/Referencia_DOM_de_Gecko:Introducción	/es/docs/Web/API/Document_Object_Model/Introduction
+/es/docs/Referencia_DOM_de_Gecko:Prefacio	/es/docs/conflicting/Web/API/Document_Object_Model_9f3a59543838705de7e9b080fde3cc14
+/es/docs/Referencia_de_JavaScript_1.5	/es/docs/Web/JavaScript/Reference
+/es/docs/Referencia_de_JavaScript_1.5/Acerca_de	/es/docs/Web/JavaScript/Reference/About
+/es/docs/Referencia_de_JavaScript_1.5/Características_Desaprobadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/Referencia_de_JavaScript_1.5/Características_Despreciadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/Referencia_de_JavaScript_1.5/Funciones	/es/docs/Web/JavaScript/Reference/Functions
+/es/docs/Referencia_de_JavaScript_1.5/Funciones/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5/Funciones/arguments	/es/docs/Web/JavaScript/Reference/Functions/arguments
+/es/docs/Referencia_de_JavaScript_1.5/Funciones/arguments/callee	/es/docs/Web/JavaScript/Reference/Functions/arguments/callee
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/decodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURI
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/decodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/encodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURI
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/encodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/eval	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isFinite	/es/docs/Web/JavaScript/Reference/Global_Objects/isFinite
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isNaN	/es/docs/Web/JavaScript/Reference/Global_Objects/isNaN
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/parseFloat	/es/docs/Web/JavaScript/Reference/Global_Objects/parseFloat
+/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/parseInt	/es/docs/Web/JavaScript/Reference/Global_Objects/parseInt
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/forEach	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/indexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/push	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/push
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/reduce	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array/reduceRight	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/ReduceRight
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Boolean/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean/toSource
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date/UTC	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date/now	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/now
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date/parse	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/parse
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Error	/es/docs/Web/JavaScript/Reference/Global_Objects/Error
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function/apply	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function/call	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/call
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Function/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/JSON	/es/docs/Web/JavaScript/Reference/Global_Objects/JSON
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/JSON/stringify	/es/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/E	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/E
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/LN10	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LN10
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/LN2	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LN2
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/LOG2E	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LOG2E
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Math/floor	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/floor
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/NEGATIVE_INFINITY	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/POSITIVE_INFINITY	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/toString
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/constructor	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/create	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/create
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/defineProperties	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/hasOwnProperty	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/toString
 /es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/unwatch	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/unwatch
 /es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object/watch	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/watch
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/anchor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/anchor
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/big	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/big
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/blink	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/blink
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/bold	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/bold
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/charAt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charAt
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/charCodeAt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charCodeAt
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/concat	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/concat
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/constructor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/fixed	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fixed
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/fromCharCode	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fromCharCode
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/indexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/indexOf
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/italics	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/italics
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/lastIndexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/lastIndexOf
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/length	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/length
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/link	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/link
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/match	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/match
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/prototype
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/replace	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/replace
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/search	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/search
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/slice	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/slice
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/small	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/small
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/split	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/split
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/strike	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/strike
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/sub	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sub
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/substr	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substr
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/substring	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substring
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/sup	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sup
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/toLowerCase	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toLowerCase
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toString
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/toUpperCase	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toUpperCase
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/valueOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/valueOf
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globlales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Referencia_de_JavaScript_1.5/Objetos_globlales/Function/arguments	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/arguments
-/es/docs/Referencia_de_JavaScript_1.5/Operadores	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Aritméticos	/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/function	/es/docs/Web/JavaScript/Referencia/Operadores/function
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/instanceof	/es/docs/Web/JavaScript/Referencia/Operadores/instanceof
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/typeof	/es/docs/Web/JavaScript/Referencia/Operadores/typeof
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/void	/es/docs/Web/JavaScript/Referencia/Operadores/void
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Miembros	/es/docs/Web/JavaScript/Referencia/Operadores/Miembros
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Operadores_especiales/Operador_this	/es/docs/Web/JavaScript/Referencia/Operadores/this
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/Operator_Precedence	/es/docs/Web/JavaScript/Referencia/Operadores/Operator_Precedence
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/String	/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/function	/es/docs/Web/JavaScript/Referencia/Operadores/function
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/get	/es/docs/Web/JavaScript/Referencia/Funciones/get
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/in	/es/docs/Web/JavaScript/Referencia/Operadores/in
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/new	/es/docs/Web/JavaScript/Referencia/Operadores/new
-/es/docs/Referencia_de_JavaScript_1.5/Operadores/this	/es/docs/Web/JavaScript/Referencia/Operadores/this
-/es/docs/Referencia_de_JavaScript_1.5/Palabras_Reservadas	/es/docs/Web/JavaScript/Referencia/Palabras_Reservadas
-/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales/Infinity	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Infinity
-/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales/NaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/NaN
-/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales/undefined	/es/docs/Web/JavaScript/Referencia/Objetos_globales/undefined
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias	/es/docs/Web/JavaScript/Referencia/Sentencias
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/block	/es/docs/Web/JavaScript/Referencia/Sentencias/block
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/break	/es/docs/Web/JavaScript/Referencia/Sentencias/break
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/const	/es/docs/Web/JavaScript/Referencia/Sentencias/const
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/continue	/es/docs/Web/JavaScript/Referencia/Sentencias/continue
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/do...while	/es/docs/Web/JavaScript/Referencia/Sentencias/do...while
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/export	/es/docs/Web/JavaScript/Referencia/Sentencias/export
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/for	/es/docs/Web/JavaScript/Referencia/Sentencias/for
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/for...in	/es/docs/Web/JavaScript/Referencia/Sentencias/for...in
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/anchor	/es/docs/Web/JavaScript/Reference/Global_Objects/String/anchor
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/big	/es/docs/Web/JavaScript/Reference/Global_Objects/String/big
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/blink	/es/docs/Web/JavaScript/Reference/Global_Objects/String/blink
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/bold	/es/docs/Web/JavaScript/Reference/Global_Objects/String/bold
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/charAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charAt
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/charCodeAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/concat	/es/docs/Web/JavaScript/Reference/Global_Objects/String/concat
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/constructor	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/fixed	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fixed
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/fromCharCode	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/indexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/italics	/es/docs/Web/JavaScript/Reference/Global_Objects/String/italics
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/lastIndexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/length	/es/docs/Web/JavaScript/Reference/Global_Objects/String/length
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/link	/es/docs/Web/JavaScript/Reference/Global_Objects/String/link
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/match	/es/docs/Web/JavaScript/Reference/Global_Objects/String/match
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/replace	/es/docs/Web/JavaScript/Reference/Global_Objects/String/replace
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/search	/es/docs/Web/JavaScript/Reference/Global_Objects/String/search
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/slice	/es/docs/Web/JavaScript/Reference/Global_Objects/String/slice
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/small	/es/docs/Web/JavaScript/Reference/Global_Objects/String/small
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/split	/es/docs/Web/JavaScript/Reference/Global_Objects/String/split
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/strike	/es/docs/Web/JavaScript/Reference/Global_Objects/String/strike
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/sub	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sub
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/substr	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substr
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/substring	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substring
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/sup	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sup
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/toLowerCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toString
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/toUpperCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String/valueOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/valueOf
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globlales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Referencia_de_JavaScript_1.5/Objetos_globlales/Function/arguments	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/arguments
+/es/docs/Referencia_de_JavaScript_1.5/Operadores	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Aritméticos	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/instanceof	/es/docs/Web/JavaScript/Reference/Operators/instanceof
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/typeof	/es/docs/Web/JavaScript/Reference/Operators/typeof
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Especiales/void	/es/docs/Web/JavaScript/Reference/Operators/void
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Miembros	/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Operadores_especiales/Operador_this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/Operator_Precedence	/es/docs/Web/JavaScript/Reference/Operators/Operator_Precedence
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/String	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/get	/es/docs/Web/JavaScript/Reference/Functions/get
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/in	/es/docs/Web/JavaScript/Reference/Operators/in
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/new	/es/docs/Web/JavaScript/Reference/Operators/new
+/es/docs/Referencia_de_JavaScript_1.5/Operadores/this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/Referencia_de_JavaScript_1.5/Palabras_Reservadas	/es/docs/conflicting/Web/JavaScript/Reference/Lexical_grammar
+/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales/Infinity	/es/docs/Web/JavaScript/Reference/Global_Objects/Infinity
+/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales/NaN	/es/docs/Web/JavaScript/Reference/Global_Objects/NaN
+/es/docs/Referencia_de_JavaScript_1.5/Propiedades_globales/undefined	/es/docs/Web/JavaScript/Reference/Global_Objects/undefined
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias	/es/docs/Web/JavaScript/Reference/Statements
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/block	/es/docs/Web/JavaScript/Reference/Statements/block
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/break	/es/docs/Web/JavaScript/Reference/Statements/break
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/const	/es/docs/Web/JavaScript/Reference/Statements/const
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/continue	/es/docs/Web/JavaScript/Reference/Statements/continue
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/do...while	/es/docs/Web/JavaScript/Reference/Statements/do...while
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/export	/es/docs/Web/JavaScript/Reference/Statements/export
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/for	/es/docs/Web/JavaScript/Reference/Statements/for
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/for...in	/es/docs/Web/JavaScript/Reference/Statements/for...in
 /es/docs/Referencia_de_JavaScript_1.5/Sentencias/for_each...in	/es/docs/Web/JavaScript/Referencia/Sentencias/for_each...in
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/function	/es/docs/Web/JavaScript/Referencia/Sentencias/function
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/if...else	/es/docs/Web/JavaScript/Referencia/Sentencias/if...else
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/label	/es/docs/Web/JavaScript/Referencia/Sentencias/label
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/return	/es/docs/Web/JavaScript/Referencia/Sentencias/return
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/throw	/es/docs/Web/JavaScript/Referencia/Sentencias/throw
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/try...catch	/es/docs/Web/JavaScript/Referencia/Sentencias/try...catch
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/var	/es/docs/Web/JavaScript/Referencia/Sentencias/var
-/es/docs/Referencia_de_JavaScript_1.5/Sentencias/while	/es/docs/Web/JavaScript/Referencia/Sentencias/while
-/es/docs/Referencia_de_JavaScript_1.5:Acerca_de	/es/docs/Web/JavaScript/Referencia/Acerca_de
-/es/docs/Referencia_de_JavaScript_1.5:Características_Desaprobadas	/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas
-/es/docs/Referencia_de_JavaScript_1.5:Características_Despreciadas	/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas
-/es/docs/Referencia_de_JavaScript_1.5:Funciones	/es/docs/Web/JavaScript/Referencia/Funciones
-/es/docs/Referencia_de_JavaScript_1.5:Funciones:String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5:Funciones:arguments	/es/docs/Web/JavaScript/Referencia/Funciones/arguments
-/es/docs/Referencia_de_JavaScript_1.5:Funciones:arguments:callee	/es/docs/Web/JavaScript/Referencia/Funciones/arguments/callee
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:Object	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:decodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURI
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:decodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:encodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURI
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:encodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:eval	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:isFinite	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:isNaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isNaN
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:parseFloat	/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseFloat
-/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:parseInt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseInt
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Array:reduce	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduce
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Array:reduceRight	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Boolean:toSource	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean/toSource
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date:UTC	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/UTC
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date:now	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/now
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date:parse	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/parse
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Error	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Function:prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/prototype
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Math	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Number	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Number:prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/prototype
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Number:toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/toString
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Object	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Object:toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toString
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/function	/es/docs/Web/JavaScript/Reference/Statements/function
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/if...else	/es/docs/Web/JavaScript/Reference/Statements/if...else
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/label	/es/docs/Web/JavaScript/Reference/Statements/label
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/return	/es/docs/Web/JavaScript/Reference/Statements/return
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/throw	/es/docs/Web/JavaScript/Reference/Statements/throw
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/try...catch	/es/docs/Web/JavaScript/Reference/Statements/try...catch
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/var	/es/docs/Web/JavaScript/Reference/Statements/var
+/es/docs/Referencia_de_JavaScript_1.5/Sentencias/while	/es/docs/Web/JavaScript/Reference/Statements/while
+/es/docs/Referencia_de_JavaScript_1.5:Acerca_de	/es/docs/Web/JavaScript/Reference/About
+/es/docs/Referencia_de_JavaScript_1.5:Características_Desaprobadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/Referencia_de_JavaScript_1.5:Características_Despreciadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/Referencia_de_JavaScript_1.5:Funciones	/es/docs/Web/JavaScript/Reference/Functions
+/es/docs/Referencia_de_JavaScript_1.5:Funciones:String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5:Funciones:arguments	/es/docs/Web/JavaScript/Reference/Functions/arguments
+/es/docs/Referencia_de_JavaScript_1.5:Funciones:arguments:callee	/es/docs/Web/JavaScript/Reference/Functions/arguments/callee
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:decodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURI
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:decodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:encodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURI
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:encodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:eval	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:isFinite	/es/docs/Web/JavaScript/Reference/Global_Objects/isFinite
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:isNaN	/es/docs/Web/JavaScript/Reference/Global_Objects/isNaN
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:parseFloat	/es/docs/Web/JavaScript/Reference/Global_Objects/parseFloat
+/es/docs/Referencia_de_JavaScript_1.5:Funciones_globales:parseInt	/es/docs/Web/JavaScript/Reference/Global_Objects/parseInt
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Array:reduce	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Array:reduceRight	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/ReduceRight
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Boolean:toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean/toSource
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date:UTC	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date:now	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/now
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Date:parse	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/parse
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Error	/es/docs/Web/JavaScript/Reference/Global_Objects/Error
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Function:prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Number:prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Number:toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/toString
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Object:toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/toString
 /es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Object:unwatch	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/unwatch
 /es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:Object:watch	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/watch
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:anchor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/anchor
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:big	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/big
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:blink	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/blink
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:bold	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/bold
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:charAt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charAt
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:charCodeAt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charCodeAt
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:concat	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/concat
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:constructor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:fixed	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fixed
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:fromCharCode	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fromCharCode
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:indexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/indexOf
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:italics	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/italics
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:lastIndexOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/lastIndexOf
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:length	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/length
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:link	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/link
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:match	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/match
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:prototype	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/prototype
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:replace	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/replace
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:search	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/search
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:slice	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/slice
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:small	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/small
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:split	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/split
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:strike	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/strike
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:sub	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sub
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:substr	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substr
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:substring	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substring
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:sup	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sup
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:toLowerCase	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toLowerCase
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:toString	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toString
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:toUpperCase	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toUpperCase
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:valueOf	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/valueOf
-/es/docs/Referencia_de_JavaScript_1.5:Objetos_globlales:Function:arguments	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/arguments
-/es/docs/Referencia_de_JavaScript_1.5:Operadores	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:Aritméticos	/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:function	/es/docs/Web/JavaScript/Referencia/Operadores/function
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:instanceof	/es/docs/Web/JavaScript/Referencia/Operadores/instanceof
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:typeof	/es/docs/Web/JavaScript/Referencia/Operadores/typeof
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:void	/es/docs/Web/JavaScript/Referencia/Operadores/void
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:Miembros	/es/docs/Web/JavaScript/Referencia/Operadores/Miembros
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:Operadores_especiales:Operador_this	/es/docs/Web/JavaScript/Referencia/Operadores/this
-/es/docs/Referencia_de_JavaScript_1.5:Operadores:String	/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos
-/es/docs/Referencia_de_JavaScript_1.5:Palabras_Reservadas	/es/docs/Web/JavaScript/Referencia/Palabras_Reservadas
-/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales:Infinity	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Infinity
-/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales:NaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/NaN
-/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales:undefined	/es/docs/Web/JavaScript/Referencia/Objetos_globales/undefined
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias	/es/docs/Web/JavaScript/Referencia/Sentencias
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:block	/es/docs/Web/JavaScript/Referencia/Sentencias/block
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:break	/es/docs/Web/JavaScript/Referencia/Sentencias/break
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:continue	/es/docs/Web/JavaScript/Referencia/Sentencias/continue
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:do...while	/es/docs/Web/JavaScript/Referencia/Sentencias/do...while
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:for	/es/docs/Web/JavaScript/Referencia/Sentencias/for
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:for...in	/es/docs/Web/JavaScript/Referencia/Sentencias/for...in
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:function	/es/docs/Web/JavaScript/Referencia/Sentencias/function
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:if...else	/es/docs/Web/JavaScript/Referencia/Sentencias/if...else
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:label	/es/docs/Web/JavaScript/Referencia/Sentencias/label
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:return	/es/docs/Web/JavaScript/Referencia/Sentencias/return
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:throw	/es/docs/Web/JavaScript/Referencia/Sentencias/throw
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:try...catch	/es/docs/Web/JavaScript/Referencia/Sentencias/try...catch
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:var	/es/docs/Web/JavaScript/Referencia/Sentencias/var
-/es/docs/Referencia_de_JavaScript_1.5:Sentencias:while	/es/docs/Web/JavaScript/Referencia/Sentencias/while
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:anchor	/es/docs/Web/JavaScript/Reference/Global_Objects/String/anchor
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:big	/es/docs/Web/JavaScript/Reference/Global_Objects/String/big
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:blink	/es/docs/Web/JavaScript/Reference/Global_Objects/String/blink
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:bold	/es/docs/Web/JavaScript/Reference/Global_Objects/String/bold
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:charAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charAt
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:charCodeAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:concat	/es/docs/Web/JavaScript/Reference/Global_Objects/String/concat
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:constructor	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:fixed	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fixed
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:fromCharCode	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:indexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:italics	/es/docs/Web/JavaScript/Reference/Global_Objects/String/italics
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:lastIndexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:length	/es/docs/Web/JavaScript/Reference/Global_Objects/String/length
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:link	/es/docs/Web/JavaScript/Reference/Global_Objects/String/link
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:match	/es/docs/Web/JavaScript/Reference/Global_Objects/String/match
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:replace	/es/docs/Web/JavaScript/Reference/Global_Objects/String/replace
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:search	/es/docs/Web/JavaScript/Reference/Global_Objects/String/search
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:slice	/es/docs/Web/JavaScript/Reference/Global_Objects/String/slice
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:small	/es/docs/Web/JavaScript/Reference/Global_Objects/String/small
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:split	/es/docs/Web/JavaScript/Reference/Global_Objects/String/split
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:strike	/es/docs/Web/JavaScript/Reference/Global_Objects/String/strike
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:sub	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sub
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:substr	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substr
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:substring	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substring
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:sup	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sup
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:toLowerCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:toString	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toString
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:toUpperCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globales:String:valueOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/valueOf
+/es/docs/Referencia_de_JavaScript_1.5:Objetos_globlales:Function:arguments	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/arguments
+/es/docs/Referencia_de_JavaScript_1.5:Operadores	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:Aritméticos	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:instanceof	/es/docs/Web/JavaScript/Reference/Operators/instanceof
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:typeof	/es/docs/Web/JavaScript/Reference/Operators/typeof
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:Especiales:void	/es/docs/Web/JavaScript/Reference/Operators/void
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:Miembros	/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:Operadores_especiales:Operador_this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/Referencia_de_JavaScript_1.5:Operadores:String	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/Referencia_de_JavaScript_1.5:Palabras_Reservadas	/es/docs/conflicting/Web/JavaScript/Reference/Lexical_grammar
+/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales:Infinity	/es/docs/Web/JavaScript/Reference/Global_Objects/Infinity
+/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales:NaN	/es/docs/Web/JavaScript/Reference/Global_Objects/NaN
+/es/docs/Referencia_de_JavaScript_1.5:Propiedades_globales:undefined	/es/docs/Web/JavaScript/Reference/Global_Objects/undefined
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias	/es/docs/Web/JavaScript/Reference/Statements
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:block	/es/docs/Web/JavaScript/Reference/Statements/block
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:break	/es/docs/Web/JavaScript/Reference/Statements/break
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:continue	/es/docs/Web/JavaScript/Reference/Statements/continue
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:do...while	/es/docs/Web/JavaScript/Reference/Statements/do...while
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:for	/es/docs/Web/JavaScript/Reference/Statements/for
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:for...in	/es/docs/Web/JavaScript/Reference/Statements/for...in
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:function	/es/docs/Web/JavaScript/Reference/Statements/function
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:if...else	/es/docs/Web/JavaScript/Reference/Statements/if...else
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:label	/es/docs/Web/JavaScript/Reference/Statements/label
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:return	/es/docs/Web/JavaScript/Reference/Statements/return
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:throw	/es/docs/Web/JavaScript/Reference/Statements/throw
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:try...catch	/es/docs/Web/JavaScript/Reference/Statements/try...catch
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:var	/es/docs/Web/JavaScript/Reference/Statements/var
+/es/docs/Referencia_de_JavaScript_1.5:Sentencias:while	/es/docs/Web/JavaScript/Reference/Statements/while
+/es/docs/Referencia_de_XUL	/es/docs/orphaned/Referencia_de_XUL
 /es/docs/SVG	/es/docs/Web/SVG
-/es/docs/SVG/SVG_en_Firefox_1.5	/es/docs/Web/SVG/SVG_en_Firefox_1.5
+/es/docs/SVG/SVG_en_Firefox_1.5	/es/docs/orphaned/Web/SVG/SVG_en_Firefox_1.5
 /es/docs/SVG/Tutorial	/es/docs/Web/SVG/Tutorial
 /es/docs/SVG/Tutorial/Getting_Started	/es/docs/Web/SVG/Tutorial/Getting_Started
-/es/docs/SVG:SVG_en_Firefox_1.5	/es/docs/Web/SVG/SVG_en_Firefox_1.5
+/es/docs/SVG:SVG_en_Firefox_1.5	/es/docs/orphaned/Web/SVG/SVG_en_Firefox_1.5
 /es/docs/SVG_In_HTML_Introduction	/es/docs/Web/SVG/Tutorial/SVG_In_HTML_Introduction
+/es/docs/SVG_en_Firefox	/es/docs/Web/SVG/SVG_1.1_Support_in_Firefox
 /es/docs/Screening_duplicate_bugs	/es/docs/QA/Screening_duplicate_bugs
-/es/docs/Secciones_y_contornos_de_un_documento_HTML5	/es/docs/Sections_and_Outlines_of_an_HTML5_document
-/es/docs/Secciones_y_esquema_de_un_documento_HTML_5	/es/docs/Sections_and_Outlines_of_an_HTML5_document
+/es/docs/Secciones_y_contornos_de_un_documento_HTML5	/es/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines
+/es/docs/Secciones_y_esquema_de_un_documento_HTML_5	/es/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines
+/es/docs/Sections_and_Outlines_of_an_HTML5_document	/es/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines
+/es/docs/Seguridad_en_Firefox_2	/es/docs/Mozilla/Firefox/Releases/2/Security_changes
+/es/docs/Selección_de_modo_en_Mozilla	/es/docs/orphaned/Selección_de_modo_en_Mozilla
+/es/docs/Server-sent_events	/es/docs/Web/API/Server-sent_events
+/es/docs/Server-sent_events/utilizando_server_sent_events_sse	/es/docs/Web/API/Server-sent_events/Using_server-sent_events
 /es/docs/Social_API-redirect-1	/es/docs/Social_API
 /es/docs/Social_API-redirect-2	/es/docs/Social_API
 /es/docs/Social_API/Glossary-redirect-1	/es/docs/Social_API/Glossary
 /es/docs/Social_API/Glossary-redirect-2	/es/docs/Social_API/Glossary
 /es/docs/Social_API/Guide-redirect-1	/es/docs/Social_API/Guide
-/es/docs/Transformando_XML_con_XSLT	/es/docs/Web/XSLT/Transformando_XML_con_XSLT
-/es/docs/Usando_audio_y_video_con_HTML5	/es/docs/Web/HTML/Usando_audio_y_video_con_HTML5
-/es/docs/Usando_audio_y_video_en_Firefox	/es/docs/Web/HTML/Usando_audio_y_video_con_HTML5
+/es/docs/Storage	/es/docs/orphaned/Storage
+/es/docs/Tipo_MIME_incorrecto_en_archivos_CSS	/es/docs/conflicting/Web/HTTP/Basics_of_HTTP/MIME_types
+/es/docs/Tools/Accesos_directos	/es/docs/Tools/Keyboard_shortcuts
+/es/docs/Tools/Add-ons	/es/docs/orphaned/Tools/Add-ons
+/es/docs/Tools/Debugger/How_to/Uso_de_un_mapa_fuente	/es/docs/Tools/Debugger/How_to/Use_a_source_map
+/es/docs/Tools/Desempeño	/es/docs/Tools/Performance
+/es/docs/Tools/Desempeño/UI_Tour	/es/docs/Tools/Performance/UI_Tour
+/es/docs/Tools/Editor_Audio_Web	/es/docs/Tools/Web_Audio_Editor
+/es/docs/Tools/Editor_Estilo	/es/docs/Tools/Style_Editor
+/es/docs/Tools/Monitor_de_Red	/es/docs/Tools/Network_Monitor
+/es/docs/Tools/Page_Inspector/3er-panel_modo	/es/docs/Tools/Page_Inspector/3-pane_mode
+/es/docs/Tools/Page_Inspector/How_to/Abrir_el_Inspector	/es/docs/Tools/Page_Inspector/How_to/Open_the_Inspector
+/es/docs/Tools/Page_Inspector/How_to/Examinar_y_editar_HTML	/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML
+/es/docs/Tools/Page_Inspector/How_to/Examinar_y_editar_el_modelo_de_cajasmodel	/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_the_box_model
+/es/docs/Tools/Page_Inspector/How_to/Inspeccionar_y_seleccionar_colores	/es/docs/Tools/Page_Inspector/How_to/Inspect_and_select_colors
+/es/docs/Tools/Page_Inspector/How_to/Reposicionando_elementos_en_la_pagina	/es/docs/Tools/Page_Inspector/How_to/Reposition_elements_in_the_page
+/es/docs/Tools/Profiler	/es/docs/conflicting/Tools/Performance
+/es/docs/Tools/Remote_Debugging/Debugging_over_a_network	/es/docs/conflicting/Tools/about:debugging
+/es/docs/Tools/Remote_Debugging/Firefox_para_Android	/es/docs/Tools/Remote_Debugging/Firefox_for_Android
+/es/docs/Tools/Responsive_Design_View	/es/docs/Tools/Responsive_Design_Mode
+/es/docs/Tools/Tomar_capturas_de_pantalla	/es/docs/Tools/Taking_screenshots
+/es/docs/Tools/Web_Console/Iniciando_la_Consola_Web	/es/docs/Tools/Web_Console/UI_Tour
+/es/docs/Tools/Web_Console/La_línea_de_comandos_del_intérprete	/es/docs/Tools/Web_Console/The_command_line_interpreter
+/es/docs/Traducir_las_descripciones_de_las_extensiones	/es/docs/orphaned/Traducir_las_descripciones_de_las_extensiones
+/es/docs/Traducir_una_extensión	/es/docs/orphaned/Traducir_una_extensión
+/es/docs/Transformando_XML_con_XSLT	/es/docs/Web/XSLT/Transforming_XML_with_XSLT
+/es/docs/Trazado_de_una_tabla_HTML_mediante_JavaScript_y_la_Interface_DOM	/es/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
+/es/docs/Usando_archivos_desde_aplicaciones_web	/es/docs/orphaned/Usando_archivos_desde_aplicaciones_web
+/es/docs/Usando_audio_y_video_con_HTML5	/es/docs/conflicting/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
+/es/docs/Usando_audio_y_video_en_Firefox	/es/docs/conflicting/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
 /es/docs/Usando_módulos_de_código_JavaScript	/es/docs/JavaScript_code_modules/Using
-/es/docs/Usar_audio_y_vídeo_en_Firefox	/es/docs/Web/HTML/Usando_audio_y_video_con_HTML5
-/es/docs/Usar_gradientes	/es/docs/CSS/Using_CSS_gradients
-/es/docs/Usar_la_Geolocalización	/es/docs/WebAPI/Using_geolocation
+/es/docs/Usar_XPInstall_para_instalar_plugins	/es/docs/orphaned/Usar_XPInstall_para_instalar_plugins
+/es/docs/Usar_audio_y_vídeo_en_Firefox	/es/docs/conflicting/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
+/es/docs/Usar_código_de_Mozilla_en_otros_proyectos	/es/docs/orphaned/Usar_código_de_Mozilla_en_otros_proyectos
+/es/docs/Usar_gradientes	/es/docs/Web/CSS/CSS_Images/Using_CSS_gradients
+/es/docs/Usar_la_Geolocalización	/es/docs/Web/API/Geolocation_API
+/es/docs/Usar_web_workers	/es/docs/orphaned/Usar_web_workers
 /es/docs/Using_files_from_web_applications	/es/docs/Web/API/File/Using_files_from_web_applications
-/es/docs/Using_geolocation	/es/docs/WebAPI/Using_geolocation
-/es/docs/Uso_de_URL_como_valor_de_la_propiedad_cursor	/es/docs/Web/CSS/cursor/Uso_de_URL_como_valor_de_la_propiedad_cursor
-/es/docs/Vigilando_complementos	/es/docs/Vigilar_plugins
+/es/docs/Using_geolocation	/es/docs/Web/API/Geolocation_API
+/es/docs/Using_the_W3C_DOM_Level_1_Core	/es/docs/Web/API/Document_object_model/Using_the_W3C_DOM_Level_1_Core
+/es/docs/Uso_de_URL_como_valor_de_la_propiedad_cursor	/es/docs/Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property
+/es/docs/Uso_del_núcleo_del_nivel_1_del_DOM	/es/docs/orphaned/Uso_del_núcleo_del_nivel_1_del_DOM
+/es/docs/Vigilando_complementos	/es/docs/orphaned/Vigilar_plugins
 /es/docs/Vigilando_descargas	/es/docs/Vigilar_descargas
-/es/docs/Vigilando_plugins	/es/docs/Vigilar_plugins
+/es/docs/Vigilando_plugins	/es/docs/orphaned/Vigilar_plugins
+/es/docs/Vigilar_plugins	/es/docs/orphaned/Vigilar_plugins
+/es/docs/Web/API/API_de_almacenamiento_web	/es/docs/Web/API/Web_Storage_API
+/es/docs/Web/API/API_de_almacenamiento_web/Usando_la_API_de_almacenamiento_web	/es/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API
+/es/docs/Web/API/API_del_portapapeles	/es/docs/Web/API/Clipboard_API
+/es/docs/Web/API/Animation/Animación	/es/docs/Web/API/Animation/Animation
+/es/docs/Web/API/Animation/terminado	/es/docs/Web/API/Animation/finished
+/es/docs/Web/API/Animation/tiempoActual	/es/docs/Web/API/Animation/currentTime
 /es/docs/Web/API/Apps.checkInstalled	/es/docs/Web/API/DOMApplicationsRegistry/checkInstalled
 /es/docs/Web/API/Apps.getInstalled	/es/docs/Web/API/DOMApplicationsRegistry/getInstalled
 /es/docs/Web/API/Apps.install	/es/docs/Web/API/DOMApplicationsRegistry/install
@@ -1422,62 +1782,220 @@
 /es/docs/Web/API/CSSStyleSheet.insertRule	/es/docs/Web/API/CSSStyleSheet/insertRule
 /es/docs/Web/API/CameraCapabilities.maxExposureCompensation	/es/docs/Web/API/CameraCapabilities/maxExposureCompensation
 /es/docs/Web/API/CameraCapabilities.maxFocusAreas	/es/docs/Web/API/CameraCapabilities/maxFocusAreas
+/es/docs/Web/API/Canvas_API/Tutorial/Compositing/Ejemplo	/es/docs/Web/API/Canvas_API/Tutorial/Compositing/Example
+/es/docs/Web/API/Console/tabla	/es/docs/Web/API/Console/table
 /es/docs/Web/API/Constraint_validation/invalid_event	/es/docs/Web/API/HTMLInputElement/invalid_event
 /es/docs/Web/API/Coordinates	/es/docs/Web/API/GeolocationCoordinates
 /es/docs/Web/API/Coordinates/latitude	/es/docs/Web/API/GeolocationCoordinates/latitude
+/es/docs/Web/API/DOMString/Cadenas_binarias	/es/docs/Web/API/DOMString/Binary
+/es/docs/Web/API/Document/abrir	/es/docs/Web/API/Document/open
+/es/docs/Web/API/Document/async	/es/docs/Web/API/XMLDocument/async
+/es/docs/Web/API/Document/crearAtributo	/es/docs/Web/API/Document/createAttribute
+/es/docs/Web/API/Document/getSelection	/es/docs/Web/API/DocumentOrShadowRoot/getSelection
+/es/docs/Web/API/Document/pointerLockElement	/es/docs/Web/API/DocumentOrShadowRoot/pointerLockElement
+/es/docs/Web/API/Document/styleSheets	/es/docs/Web/API/DocumentOrShadowRoot/styleSheets
+/es/docs/Web/API/Element/accessKey	/es/docs/Web/API/HTMLElement/accessKey
+/es/docs/Web/API/Element/name	/es/docs/conflicting/Web/API
+/es/docs/Web/API/Element/ongotpointercapture	/es/docs/Web/API/GlobalEventHandlers/ongotpointercapture
+/es/docs/Web/API/Element/onlostpointercapture	/es/docs/Web/API/GlobalEventHandlers/onlostpointercapture
+/es/docs/Web/API/Element/onwheel	/es/docs/Web/API/GlobalEventHandlers/onwheel
+/es/docs/Web/API/ElementosHTMLparaVideo	/es/docs/Web/API/HTMLVideoElement
+/es/docs/Web/API/Event/createEvent	/es/docs/Web/API/Document/createEvent
+/es/docs/Web/API/Fetch_API/Conceptos_basicos	/es/docs/Web/API/Fetch_API/Basic_concepts
+/es/docs/Web/API/Fetch_API/Utilizando_Fetch	/es/docs/Web/API/Fetch_API/Using_Fetch
 /es/docs/Web/API/Geolocalización	/es/docs/Web/API/Geolocation
 /es/docs/Web/API/Geolocation.clearWatch	/es/docs/Web/API/Geolocation/clearWatch
 /es/docs/Web/API/Geolocation.getCurrentPosition	/es/docs/Web/API/Geolocation/getCurrentPosition
 /es/docs/Web/API/Geolocation.watchPosition	/es/docs/Web/API/Geolocation/watchPosition
+/es/docs/Web/API/GlobalEventHandlers/onunload	/es/docs/Web/API/WindowEventHandlers/onunload
+/es/docs/Web/API/HTMLElement/dataset	/es/docs/Web/API/HTMLOrForeignElement/dataset
+/es/docs/Web/API/HTMLElement/focus	/es/docs/Web/API/HTMLOrForeignElement/focus
 /es/docs/Web/API/HTMLElement/invalid_event	/es/docs/Web/API/HTMLInputElement/invalid_event
+/es/docs/Web/API/HTMLElement/style	/es/docs/Web/API/ElementCSSInlineStyle/style
 /es/docs/Web/API/IDBObjectStore.add	/es/docs/Web/API/IDBObjectStore/add
+/es/docs/Web/API/IndexedDB_API/Conceptos_Basicos_Detras_De_IndexedDB	/es/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB
+/es/docs/Web/API/IndexedDB_API/Usando_IndexedDB	/es/docs/Web/API/IndexedDB_API/Using_IndexedDB
 /es/docs/Web/API/Navigator.getUserMedia	/es/docs/Web/API/Navigator/getUserMedia
+/es/docs/Web/API/NavigatorGeolocation	/es/docs/conflicting/Web/API/Geolocation
+/es/docs/Web/API/NavigatorGeolocation/geolocation	/es/docs/Web/API/Navigator/geolocation
+/es/docs/Web/API/NavigatorOnLine/Eventos_online_y_offline	/es/docs/Web/API/NavigatorOnLine/Online_and_offline_events
 /es/docs/Web/API/Node.nextSibling	/es/docs/Web/API/Node/nextSibling
+/es/docs/Web/API/Node/elementoPadre	/es/docs/Web/API/Node/parentElement
+/es/docs/Web/API/Node/insertarAntes	/es/docs/Web/API/Node/insertBefore
+/es/docs/Web/API/Node/nodoPrincipal	/es/docs/conflicting/Web/API/Node
+/es/docs/Web/API/Notifications_API/Usando_la_API_de_Notificaciones	/es/docs/Web/API/Notifications_API/Using_the_Notifications_API
 /es/docs/Web/API/Position	/es/docs/Web/API/GeolocationPosition
+/es/docs/Web/API/Push_API/Using_the_Push_API	/es/docs/conflicting/Web/API/Push_API
+/es/docs/Web/API/RandomSource	/es/docs/conflicting/Web/API/Crypto/getRandomValues
+/es/docs/Web/API/RandomSource/Obtenervaloresaleatorios	/es/docs/Web/API/Crypto/getRandomValues
+/es/docs/Web/API/Storage/LocalStorage	/es/docs/conflicting/Web/API/Window/localStorage
+/es/docs/Web/API/SubtleCrypto/encrypt	/es/docs/Web/HTTP/Headers/Digest
 /es/docs/Web/API/WebGL_API/Animating_objects_with_WebGL	/es/docs/Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL
 /es/docs/Web/API/WebGL_API/Getting_started_with_WebGL	/es/docs/Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL
-/es/docs/Web/API/Window.clearTimeout	/es/docs/Web/API/WindowTimers/clearTimeout
+/es/docs/Web/API/WebGL_API/Tutorial/Objetos_3D_utilizando_WebGL	/es/docs/Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL
+/es/docs/Web/API/WebGL_API/Tutorial/Wtilizando_texturas_en_WebGL	/es/docs/Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL
+/es/docs/Web/API/WebSockets_API/Escribiendo_servidor_WebSocket	/es/docs/Web/API/WebSockets_API/Writing_WebSocket_server
+/es/docs/Web/API/WebSockets_API/Escribiendo_servidores_con_WebSocket	/es/docs/Web/API/WebSockets_API/Writing_WebSocket_servers
+/es/docs/Web/API/Web_Crypto_API/Checking_authenticity_with_password	/es/docs/orphaned/Web/API/Web_Crypto_API/Checking_authenticity_with_password
+/es/docs/Web/API/Web_Speech_API/Uso_de_la_Web_Speech_API	/es/docs/Web/API/Web_Speech_API/Using_the_Web_Speech_API
+/es/docs/Web/API/Window.clearTimeout	/es/docs/Web/API/WindowOrWorkerGlobalScope/clearTimeout
 /es/docs/Web/API/Window.navigator	/es/docs/Web/API/Window/navigator
 /es/docs/Web/API/Window.onbeforeunload	/es/docs/Web/API/WindowEventHandlers/onbeforeunload
-/es/docs/Web/API/Window.setTimeout	/es/docs/Web/API/WindowTimers/setTimeout
-/es/docs/Web/API/WindowBase64.atob	/es/docs/Web/API/WindowBase64/atob
+/es/docs/Web/API/Window.setTimeout	/es/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout
+/es/docs/Web/API/Window/URL	/es/docs/conflicting/Web/API/URL
+/es/docs/Web/API/WindowBase64	/es/docs/conflicting/Web/API/WindowOrWorkerGlobalScope
+/es/docs/Web/API/WindowBase64.atob	/es/docs/Web/API/WindowOrWorkerGlobalScope/atob
+/es/docs/Web/API/WindowBase64/Base64_codificando_y_decodificando	/es/docs/Glossary/Base64
+/es/docs/Web/API/WindowBase64/atob	/es/docs/Web/API/WindowOrWorkerGlobalScope/atob
+/es/docs/Web/API/WindowTimers	/es/docs/conflicting/Web/API/WindowOrWorkerGlobalScope_e2691f7ad05781a30c5fc5bb3b3f633a
+/es/docs/Web/API/WindowTimers/clearInterval	/es/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval
+/es/docs/Web/API/WindowTimers/clearTimeout	/es/docs/Web/API/WindowOrWorkerGlobalScope/clearTimeout
+/es/docs/Web/API/WindowTimers/setInterval	/es/docs/Web/API/WindowOrWorkerGlobalScope/setInterval
+/es/docs/Web/API/WindowTimers/setTimeout	/es/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout
+/es/docs/Web/API/XMLHttpRequest/FormData	/es/docs/Web/API/FormData
 /es/docs/Web/API/event.defaultPrevented	/es/docs/Web/API/Event/defaultPrevented
 /es/docs/Web/API/event.which	/es/docs/Web/API/KeyboardEvent/which
+/es/docs/Web/Accesibilidad	/es/docs/Web/Accessibility
+/es/docs/Web/Accesibilidad/Comunidad	/es/docs/Web/Accessibility/Community
+/es/docs/Web/Accesibilidad/Understanding_WCAG	/es/docs/Web/Accessibility/Understanding_WCAG
+/es/docs/Web/Accesibilidad/Understanding_WCAG/Etiquetas_de_texto_y_nombres	/es/docs/Web/Accessibility/Understanding_WCAG/Text_labels_and_names
+/es/docs/Web/Accesibilidad/Understanding_WCAG/Perceivable	/es/docs/Web/Accessibility/Understanding_WCAG/Perceivable
+/es/docs/Web/Accesibilidad/Understanding_WCAG/Perceivable/Color_contraste	/es/docs/Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast
+/es/docs/Web/Accesibilidad/Understanding_WCAG/Teclado	/es/docs/Web/Accessibility/Understanding_WCAG/Keyboard
+/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_atributo_aria-required	/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-required_attribute
+/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_rol_alertdialog	/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role
+/es/docs/Web/Accessibility/ARIA/forms/Etiquetas_complejas	/es/docs/Web/Accessibility/ARIA/forms/Multipart_labels
+/es/docs/Web/Accessibility/ARIA/forms/alertas	/es/docs/Web/Accessibility/ARIA/forms/alerts
+/es/docs/Web/Accessibility/ARIA/forms/consejos_basicos_para_formularios	/es/docs/Web/Accessibility/ARIA/forms/Basic_form_hints
 /es/docs/Web/Aplicaciones/Progressive	/es/docs/Web/Progressive_web_apps
 /es/docs/Web/Aplicaciones/Progressive/Introduction	/es/docs/Web/Progressive_web_apps/Introduction
 /es/docs/Web/CSS/-moz-appearance	/es/docs/Web/CSS/appearance
+/es/docs/Web/CSS/-moz-box-flex	/es/docs/Web/CSS/box-flex
+/es/docs/Web/CSS/-moz-box-ordinal-group	/es/docs/Web/CSS/box-ordinal-group
+/es/docs/Web/CSS/-moz-box-pack	/es/docs/Web/CSS/box-pack
+/es/docs/Web/CSS/-moz-cell	/es/docs/conflicting/Web/CSS/cursor
+/es/docs/Web/CSS/-moz-font-language-override	/es/docs/Web/CSS/font-language-override
+/es/docs/Web/CSS/-moz-user-modify	/es/docs/Web/CSS/user-modify
+/es/docs/Web/CSS/-webkit-mask	/es/docs/Web/CSS/mask
+/es/docs/Web/CSS/-webkit-mask-clip	/es/docs/Web/CSS/mask-clip
+/es/docs/Web/CSS/-webkit-mask-image	/es/docs/Web/CSS/mask-image
+/es/docs/Web/CSS/-webkit-mask-origin	/es/docs/Web/CSS/mask-origin
+/es/docs/Web/CSS/-webkit-mask-position	/es/docs/Web/CSS/mask-position
+/es/docs/Web/CSS/-webkit-mask-repeat	/es/docs/Web/CSS/mask-repeat
+/es/docs/Web/CSS/:-moz-placeholder	/es/docs/conflicting/Web/CSS/:placeholder-shown
+/es/docs/Web/CSS/:-moz-ui-invalid	/es/docs/Web/CSS/:user-invalid
+/es/docs/Web/CSS/:-ms-input-placeholder	/es/docs/conflicting/Web/CSS/:placeholder-shown_f20b6cc785f9fd133a0f9fb582f36891
+/es/docs/Web/CSS/:-webkit-autofill	/es/docs/Web/CSS/:autofill
+/es/docs/Web/CSS/::-moz-placeholder	/es/docs/conflicting/Web/CSS/::placeholder
+/es/docs/Web/CSS/::-webkit-file-upload-button	/es/docs/Web/CSS/::file-selector-button
+/es/docs/Web/CSS/::-webkit-input-placeholder	/es/docs/conflicting/Web/CSS/::placeholder_70bda352bb504ebdd6cd3362879e2479
+/es/docs/Web/CSS/:any	/es/docs/Web/CSS/:is
+/es/docs/Web/CSS/:not()	/es/docs/Web/CSS/:not
+/es/docs/Web/CSS/@media/altura	/es/docs/Web/CSS/@media/height
+/es/docs/Web/CSS/@media/resolución	/es/docs/Web/CSS/@media/resolution
+/es/docs/Web/CSS/@viewport/height	/es/docs/conflicting/Web/CSS/@viewport
+/es/docs/Web/CSS/@viewport/width	/es/docs/conflicting/Web/CSS/@viewport_c925ec0506b352ea1185248b874f7848
+/es/docs/Web/CSS/CSS_Animations/Detectar_soporte_de_animación_CSS	/es/docs/Web/CSS/CSS_Animations/Detecting_CSS_animation_support
+/es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS	/es/docs/Web/CSS/CSS_Animations/Using_CSS_animations
+/es/docs/Web/CSS/CSS_Background_and_Borders	/es/docs/Web/CSS/CSS_Backgrounds_and_Borders
+/es/docs/Web/CSS/CSS_Background_and_Borders/Border-image_generador	/es/docs/Web/CSS/CSS_Background_and_Borders/Border-image_generator
+/es/docs/Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds	/es/docs/Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds
+/es/docs/Web/CSS/CSS_Colors	/es/docs/Web/CSS/CSS_Color
+/es/docs/Web/CSS/CSS_Colors/Herramienta_para_seleccionar_color	/es/docs/Web/CSS/CSS_Colors/Color_picker_tool
+/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Casos_de_uso_tipicos_de_Flexbox.	/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
+/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Conceptos_Basicos_de_Flexbox	/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
+/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_flexbox_para_componer_aplicaciones_web	/es/docs/conflicting/Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
+/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS	/es/docs/conflicting/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
+/es/docs/Web/CSS/CSS_Grid_Layout/Conceptos_Básicos_del_Posicionamiento_con_Rejillas	/es/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
+/es/docs/Web/CSS/CSS_Grid_Layout/Relacion_de_Grid_Layout	/es/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout
+/es/docs/Web/CSS/CSS_Logical_Properties/Dimensionamiento	/es/docs/Web/CSS/CSS_Logical_Properties/Sizing
+/es/docs/Web/CSS/CSS_Modelo_Caja	/es/docs/Web/CSS/CSS_Box_Model
+/es/docs/Web/CSS/CSS_Modelo_Caja/Introducción_al_modelo_de_caja_de_CSS	/es/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model
+/es/docs/Web/CSS/CSS_Modelo_Caja/Mastering_margin_collapsing	/es/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Adding_z-index
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_and_float
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_2
+/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento	/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_3
+/es/docs/Web/CSS/CSS_Reglas_Condicionales	/es/docs/Web/CSS/CSS_Conditional_Rules
 /es/docs/Web/CSS/Child_selectors	/es/docs/Web/CSS/Child_combinator
-/es/docs/Web/CSS/Como_iniciar/Porqué_usar_CSS	/es/docs/Web/CSS/Como_iniciar/Por_que_usar_CSS
-/es/docs/Web/CSS/Consultas_multimedia	/es/docs/CSS/Media_queries
+/es/docs/Web/CSS/Columnas_CSS	/es/docs/Web/CSS/CSS_Columns
+/es/docs/Web/CSS/Comentarios	/es/docs/Web/CSS/Comments
+/es/docs/Web/CSS/Comenzando_(tutorial_CSS)	/es/docs/orphaned/Web/CSS/Comenzando_(tutorial_CSS)
+/es/docs/Web/CSS/Como_iniciar	/es/docs/orphaned/Web/CSS/Como_iniciar
+/es/docs/Web/CSS/Como_iniciar/Por_que_usar_CSS	/es/docs/conflicting/Learn/CSS/First_steps/How_CSS_works
+/es/docs/Web/CSS/Como_iniciar/Porqué_usar_CSS	/es/docs/conflicting/Learn/CSS/First_steps/How_CSS_works
+/es/docs/Web/CSS/Como_iniciar/Que_es_CSS	/es/docs/conflicting/Learn/CSS/First_steps/How_CSS_works_a460b5a76c3c2e7fc9b8da464dfd0c22
+/es/docs/Web/CSS/Consultas_multimedia	/es/docs/Web/CSS/Media_Queries/Using_media_queries
 /es/docs/Web/CSS/Descendant_selectors	/es/docs/Web/CSS/Descendant_combinator
-/es/docs/Web/CSS/Getting_Started	/es/docs/Web/CSS/Comenzando_(tutorial_CSS)
-/es/docs/Web/CSS/Introducción/Content	/es/docs/Learn/CSS/Sábercomo/Generated_content
+/es/docs/Web/CSS/Elemento_reemplazo	/es/docs/Web/CSS/Replaced_element
+/es/docs/Web/CSS/Especificidad	/es/docs/Web/CSS/Specificity
+/es/docs/Web/CSS/Getting_Started	/es/docs/orphaned/Web/CSS/Comenzando_(tutorial_CSS)
+/es/docs/Web/CSS/Gradiente	/es/docs/Web/CSS/gradient
+/es/docs/Web/CSS/Herramientas	/es/docs/Web/CSS/Tools
+/es/docs/Web/CSS/Herramientas/Cubic_Bezier_Generator	/es/docs/Web/CSS/Tools/Cubic_Bezier_Generator
+/es/docs/Web/CSS/Introducción	/es/docs/conflicting/Learn/CSS/First_steps
+/es/docs/Web/CSS/Introducción/Boxes	/es/docs/conflicting/Learn/CSS/Building_blocks
+/es/docs/Web/CSS/Introducción/Cascading_and_inheritance	/es/docs/conflicting/Learn/CSS/Building_blocks/Cascade_and_inheritance
+/es/docs/Web/CSS/Introducción/Color	/es/docs/conflicting/Learn/CSS/Building_blocks/Values_and_units
+/es/docs/Web/CSS/Introducción/Content	/es/docs/Learn/CSS/Howto/Generated_content
+/es/docs/Web/CSS/Introducción/How_CSS_works	/es/docs/conflicting/Learn/CSS/First_steps/How_CSS_works_194e34e451d4ace023d98021c00b3cfd
+/es/docs/Web/CSS/Introducción/Layout	/es/docs/conflicting/Learn/CSS/CSS_layout
+/es/docs/Web/CSS/Introducción/Los:estilos_de_texto	/es/docs/conflicting/Learn/CSS/Styling_text/Fundamentals
+/es/docs/Web/CSS/Introducción/Media	/es/docs/Web/Progressive_web_apps/Responsive/Media_types
+/es/docs/Web/CSS/Introducción/Selectors	/es/docs/conflicting/Learn/CSS/Building_blocks/Selectors
+/es/docs/Web/CSS/Preguntas_frecuentes_sobre_CSS	/es/docs/Learn/CSS/Howto/CSS_FAQ
+/es/docs/Web/CSS/Primeros_pasos	/es/docs/orphaned/Web/CSS/Primeros_pasos
+/es/docs/Web/CSS/Pseudoelementos	/es/docs/Web/CSS/Pseudo-elements
+/es/docs/Web/CSS/Referencia_CSS	/es/docs/Web/CSS/Reference
 /es/docs/Web/CSS/Referencia_CSS/Extensiones_CSS_Mozilla	/es/docs/Web/CSS/Mozilla_Extensions
 /es/docs/Web/CSS/Referencia_CSS/Extensiones_Mozilla	/es/docs/Web/CSS/Mozilla_Extensions
 /es/docs/Web/CSS/Referencia_CSS/background-blend-mode	/es/docs/Web/CSS/background-blend-mode
-/es/docs/Web/CSS/Usando_animaciones_CSS	/es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS
+/es/docs/Web/CSS/Referencia_CSS/mix-blend-mode	/es/docs/Web/CSS/mix-blend-mode
+/es/docs/Web/CSS/Selectores_CSS	/es/docs/Web/CSS/CSS_Selectors
+/es/docs/Web/CSS/Selectores_CSS/Usando_la_pseudo-clase_:target_en_selectores	/es/docs/Web/CSS/CSS_Selectors/Using_the_:target_pseudo-class_in_selectors
+/es/docs/Web/CSS/Selectores_atributo	/es/docs/Web/CSS/Attribute_selectors
+/es/docs/Web/CSS/Selectores_hermanos_adyacentes	/es/docs/Web/CSS/Adjacent_sibling_combinator
+/es/docs/Web/CSS/Selectores_hermanos_generales	/es/docs/Web/CSS/General_sibling_combinator
+/es/docs/Web/CSS/Sintaxis_definición_de_valor	/es/docs/Web/CSS/Value_definition_syntax
+/es/docs/Web/CSS/Texto_CSS	/es/docs/Web/CSS/CSS_Text
+/es/docs/Web/CSS/Transiciones_de_CSS	/es/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions
+/es/docs/Web/CSS/Usando_animaciones_CSS	/es/docs/Web/CSS/CSS_Animations/Using_CSS_animations
 /es/docs/Web/CSS/Using_CSS_transforms	/es/docs/Web/CSS/CSS_Transforms/Using_CSS_transforms
 /es/docs/Web/CSS/Using_CSS_variables	/es/docs/Web/CSS/Using_CSS_custom_properties
+/es/docs/Web/CSS/Valor_calculado	/es/docs/Web/CSS/computed_value
+/es/docs/Web/CSS/Valor_inicial	/es/docs/Web/CSS/initial_value
 /es/docs/Web/CSS/after	/es/docs/Web/CSS/::after
 /es/docs/Web/CSS/animacion-iteracion-cuenta	/es/docs/Web/CSS/animation-iteration-count
 /es/docs/Web/CSS/animacion-nombre	/es/docs/Web/CSS/animation-name
 /es/docs/Web/CSS/attr	/es/docs/Web/CSS/attr()
+/es/docs/Web/CSS/auto	/es/docs/conflicting/Web/CSS/width
 /es/docs/Web/CSS/before	/es/docs/Web/CSS/::before
 /es/docs/Web/CSS/calc	/es/docs/Web/CSS/calc()
 /es/docs/Web/CSS/capacidad_de_animacion_de_propiedades_CSS	/es/docs/Web/CSS
-/es/docs/Web/CSS/computed_value	/es/docs/Web/CSS/Valor_calculado
+/es/docs/Web/CSS/cursor/Uso_de_URL_como_valor_de_la_propiedad_cursor	/es/docs/Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property
 /es/docs/Web/CSS/env	/es/docs/Web/CSS/env()
 /es/docs/Web/CSS/filter-function/blur	/es/docs/Web/CSS/filter-function/blur()
 /es/docs/Web/CSS/filter-function/brightness	/es/docs/Web/CSS/filter-function/brightness()
+/es/docs/Web/CSS/filter-function/url	/es/docs/Web/CSS/url()
 /es/docs/Web/CSS/filtro	/es/docs/Web/CSS/filter
+/es/docs/Web/CSS/grid-column-gap	/es/docs/Web/CSS/column-gap
+/es/docs/Web/CSS/grid-gap	/es/docs/Web/CSS/gap
 /es/docs/Web/CSS/kerning	/en-US/docs/Web/CSS/font-kerning
 /es/docs/Web/CSS/linear-gradient	/es/docs/Web/CSS/linear-gradient()
 /es/docs/Web/CSS/min	/es/docs/Web/CSS/min()
 /es/docs/Web/CSS/minmax	/es/docs/Web/CSS/minmax()
 /es/docs/Web/CSS/none	/es/docs/Web/CSS/float
+/es/docs/Web/CSS/normal	/es/docs/conflicting/Web/CSS/font-variant
 /es/docs/Web/CSS/padding_paspartu	/es/docs/Web/CSS/padding
+/es/docs/Web/CSS/porcentaje	/es/docs/Web/CSS/percentage
 /es/docs/Web/CSS/radial-gradient	/es/docs/Web/CSS/radial-gradient()
 /es/docs/Web/CSS/repeat	/es/docs/Web/CSS/repeat()
+/es/docs/Web/CSS/resolución	/es/docs/Web/CSS/resolution
+/es/docs/Web/CSS/rtl	/es/docs/orphaned/Web/CSS/rtl
 /es/docs/Web/CSS/transform-function/rotate	/es/docs/Web/CSS/transform-function/rotate()
 /es/docs/Web/CSS/transform-function/rotate3d	/es/docs/Web/CSS/transform-function/rotate3d()
 /es/docs/Web/CSS/transform-function/scale	/es/docs/Web/CSS/transform-function/scale()
@@ -1485,49 +2003,285 @@
 /es/docs/Web/CSS/transform-function/translateY	/es/docs/Web/CSS/transform-function/translateY()
 /es/docs/Web/CSS/transform-function/translateZ	/es/docs/Web/CSS/transform-function/translateZ()
 /es/docs/Web/CSS/var	/es/docs/Web/CSS/var()
+/es/docs/Web/Events/DOMContentLoaded	/es/docs/Web/API/Window/DOMContentLoaded_event
+/es/docs/Web/Events/abort	/es/docs/Web/API/HTMLMediaElement/abort_event
+/es/docs/Web/Events/animationend	/es/docs/Web/API/HTMLElement/animationend_event
+/es/docs/Web/Events/beforeunload	/es/docs/Web/API/Window/beforeunload_event
+/es/docs/Web/Events/blur	/es/docs/Web/API/Element/blur_event
 /es/docs/Web/Events/canplay	/es/docs/Web/API/HTMLMediaElement/canplay_event
 /es/docs/Web/Events/click	/es/docs/Web/API/Element/click_event
 /es/docs/Web/Events/close_websocket	/es/docs/Web/API/WebSocket/close_event
 /es/docs/Web/Events/dragover	/es/docs/Web/API/Document/dragover_event
 /es/docs/Web/Events/hashchange	/es/docs/Web/API/Window/hashchange_event
 /es/docs/Web/Events/keydown	/es/docs/Web/API/Document/keydown_event
+/es/docs/Web/Events/load	/es/docs/Web/API/Window/load_event
+/es/docs/Web/Events/loadend	/es/docs/Web/API/XMLHttpRequest/loadend_event
 /es/docs/Web/Events/mousedown	/es/docs/Web/API/Element/mousedown_event
 /es/docs/Web/Events/offline	/es/docs/Web/API/Window/offline_event
+/es/docs/Web/Events/pointerlockchange	/es/docs/Web/API/Document/pointerlockchange_event
 /es/docs/Web/Events/scroll	/es/docs/Web/API/Document/scroll_event
 /es/docs/Web/Events/tecla	/es/docs/Web/API/Document/keyup_event
 /es/docs/Web/Events/timeupdate	/es/docs/Web/API/HTMLMediaElement/timeupdate_event
+/es/docs/Web/Events/transitioncancel	/es/docs/Web/API/HTMLElement/transitioncancel_event
+/es/docs/Web/Events/transitionend	/es/docs/Web/API/HTMLElement/transitionend_event
 /es/docs/Web/Events/wheel	/es/docs/Web/API/Element/wheel_event
+/es/docs/Web/Guide/AJAX/Comunidad	/es/docs/Web/Guide/AJAX/Community
+/es/docs/Web/Guide/AJAX/Primeros_Pasos	/es/docs/Web/Guide/AJAX/Getting_Started
+/es/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained/Orientation_and_motion_data_explained	/es/docs/Web/Guide/Events/Orientation_and_motion_data_explained
+/es/docs/Web/Guide/API/Vibration	/es/docs/Web/API/Vibration_API
 /es/docs/Web/Guide/CSS	/es/docs/Learn/CSS
-/es/docs/Web/Guide/CSS/Cajas_flexibles	/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS
-/es/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained	/es/docs/Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained/Orientation_and_motion_data_explained
+/es/docs/Web/Guide/CSS/Cajas_flexibles	/es/docs/conflicting/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
+/es/docs/Web/Guide/CSS/probando_media_queries	/es/docs/Web/CSS/Media_Queries/Testing_media_queries
+/es/docs/Web/Guide/DOM	/es/docs/conflicting/Web/API/Document_Object_Model_656f0e51418b39c498011268be9b3a10
+/es/docs/Web/Guide/DOM/Events	/es/docs/Web/Guide/Events
+/es/docs/Web/Guide/DOM/Events/Creacion_y_Activación_Eventos	/es/docs/Web/Guide/Events/Creating_and_triggering_events
+/es/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained	/es/docs/Web/Guide/Events/Orientation_and_motion_data_explained
+/es/docs/Web/Guide/DOM/Events/eventos_controlador	/es/docs/Web/Guide/Events/Event_handlers
 /es/docs/Web/Guide/HTML	/es/docs/Learn/HTML
-/es/docs/Web/Guide/HTML/Forms	/es/docs/Learn/HTML/Forms
-/es/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form	/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form
-/es/docs/Web/Guide/HTML/Forms/My_first_HTML_form	/es/docs/Learn/HTML/Forms/Your_first_HTML_form
-/es/docs/Web/Guide/HTML/Forms/Sending_and_retrieving_form_data	/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data
-/es/docs/Web/Guide/HTML/Forms/Styling_HTML_forms	/es/docs/Learn/HTML/Forms/Styling_HTML_forms
-/es/docs/Web/Guide/HTML/Introduction_alhtml	/es/docs/Learn/HTML/Introduccion_a_HTML
-/es/docs/Web/HTML/Elemento/Audio2	/es/docs/Web/HTML/Elemento/audio
-/es/docs/Web/HTML/Elemento/Progreso	/es/docs/Web/HTML/Elemento/progress
-/es/docs/Web/HTML/Elemento/etiqueta	/es/docs/Web/HTML/Elemento/label
-/es/docs/Web/HTML/Elemento/h2	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/Web/HTML/Elemento/h3	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/Web/HTML/Elemento/h4	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/Web/HTML/Elemento/h5	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/Web/HTML/Elemento/h6	/es/docs/Web/HTML/Elemento/Elementos_títulos
-/es/docs/Web/HTML/Elemento/preformato	/es/docs/Web/HTML/Elemento/pre
+/es/docs/Web/Guide/HTML/Canvas_tutorial	/es/docs/Web/API/Canvas_API/Tutorial
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Advanced_animations	/es/docs/Web/API/Canvas_API/Tutorial/Advanced_animations
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors	/es/docs/Web/API/Canvas_API/Tutorial/Applying_styles_and_colors
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Basic_animations	/es/docs/Web/API/Canvas_API/Tutorial/Basic_animations
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Basic_usage	/es/docs/Web/API/Canvas_API/Tutorial/Basic_usage
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Dibujando_formas	/es/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Hit_regions_and_accessibility	/es/docs/Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas	/es/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas
+/es/docs/Web/Guide/HTML/Canvas_tutorial/Pixel_manipulation_with_canvas	/es/docs/Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas
+/es/docs/Web/Guide/HTML/Forms	/es/docs/conflicting/Learn/Forms
+/es/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form	/es/docs/Learn/Forms/How_to_structure_a_web_form
+/es/docs/Web/Guide/HTML/Forms/My_first_HTML_form	/es/docs/Learn/Forms/Your_first_form
+/es/docs/Web/Guide/HTML/Forms/Sending_and_retrieving_form_data	/es/docs/Learn/Forms/Sending_and_retrieving_form_data
+/es/docs/Web/Guide/HTML/Forms/Styling_HTML_forms	/es/docs/Learn/Forms/Styling_web_forms
+/es/docs/Web/Guide/HTML/Introduction_alhtml	/es/docs/Learn/HTML/Introduction_to_HTML
+/es/docs/Web/Guide/HTML/Introduction_alhtml_clone	/es/docs/orphaned/Web/Guide/HTML/Introduction_alhtml_clone
+/es/docs/Web/Guide/HTML/categorias_de_contenido	/es/docs/Web/Guide/HTML/Content_categories
+/es/docs/Web/Guide/Movil	/es/docs/Web/Guide/Mobile
+/es/docs/Web/Guide/Performance/Usando_web_workers	/es/docs/Web/API/Web_Workers_API/Using_web_workers
+/es/docs/Web/Guide/Usando_Objetos_FormData	/es/docs/Web/API/FormData/Using_FormData_Objects
+/es/docs/Web/HTML/Atributos	/es/docs/Web/HTML/Attributes
+/es/docs/Web/HTML/Atributos/accept	/es/docs/Web/HTML/Attributes/accept
+/es/docs/Web/HTML/Atributos/autocomplete	/es/docs/Web/HTML/Attributes/autocomplete
+/es/docs/Web/HTML/Atributos/min	/es/docs/Web/HTML/Attributes/min
+/es/docs/Web/HTML/Atributos/minlength	/es/docs/Web/HTML/Attributes/minlength
+/es/docs/Web/HTML/Atributos/multiple	/es/docs/Web/HTML/Attributes/multiple
+/es/docs/Web/HTML/Atributos_Globales	/es/docs/Web/HTML/Global_attributes
+/es/docs/Web/HTML/Atributos_Globales/accesskey	/es/docs/Web/HTML/Global_attributes/accesskey
+/es/docs/Web/HTML/Atributos_Globales/autocapitalize	/es/docs/Web/HTML/Global_attributes/autocapitalize
+/es/docs/Web/HTML/Atributos_Globales/class	/es/docs/Web/HTML/Global_attributes/class
+/es/docs/Web/HTML/Atributos_Globales/contenteditable	/es/docs/Web/HTML/Global_attributes/contenteditable
+/es/docs/Web/HTML/Atributos_Globales/contextmenu	/es/docs/Web/HTML/Global_attributes/contextmenu
+/es/docs/Web/HTML/Atributos_Globales/data-*	/es/docs/Web/HTML/Global_attributes/data-*
+/es/docs/Web/HTML/Atributos_Globales/dir	/es/docs/Web/HTML/Global_attributes/dir
+/es/docs/Web/HTML/Atributos_Globales/draggable	/es/docs/Web/HTML/Global_attributes/draggable
+/es/docs/Web/HTML/Atributos_Globales/dropzone	/es/docs/orphaned/Web/HTML/Global_attributes/dropzone
+/es/docs/Web/HTML/Atributos_Globales/hidden	/es/docs/Web/HTML/Global_attributes/hidden
+/es/docs/Web/HTML/Atributos_Globales/id	/es/docs/Web/HTML/Global_attributes/id
+/es/docs/Web/HTML/Atributos_Globales/is	/es/docs/Web/HTML/Global_attributes/is
+/es/docs/Web/HTML/Atributos_Globales/itemid	/es/docs/Web/HTML/Global_attributes/itemid
+/es/docs/Web/HTML/Atributos_Globales/itemprop	/es/docs/Web/HTML/Global_attributes/itemprop
+/es/docs/Web/HTML/Atributos_Globales/itemref	/es/docs/Web/HTML/Global_attributes/itemref
+/es/docs/Web/HTML/Atributos_Globales/itemscope	/es/docs/Web/HTML/Global_attributes/itemscope
+/es/docs/Web/HTML/Atributos_Globales/lang	/es/docs/Web/HTML/Global_attributes/lang
+/es/docs/Web/HTML/Atributos_Globales/slot	/es/docs/Web/HTML/Global_attributes/slot
+/es/docs/Web/HTML/Atributos_Globales/spellcheck	/es/docs/Web/HTML/Global_attributes/spellcheck
+/es/docs/Web/HTML/Atributos_Globales/style	/es/docs/Web/HTML/Global_attributes/style
+/es/docs/Web/HTML/Atributos_Globales/tabindex	/es/docs/Web/HTML/Global_attributes/tabindex
+/es/docs/Web/HTML/Atributos_Globales/title	/es/docs/Web/HTML/Global_attributes/title
+/es/docs/Web/HTML/Atributos_Globales/translate	/es/docs/Web/HTML/Global_attributes/translate
+/es/docs/Web/HTML/Atributos_Globales/x-ms-acceleratorkey	/es/docs/Web/HTML/Global_attributes/x-ms-acceleratorkey
+/es/docs/Web/HTML/Atributos_de_configuracion_CORS	/es/docs/Web/HTML/Attributes/crossorigin
+/es/docs/Web/HTML/Canvas	/es/docs/Web/API/Canvas_API
+/es/docs/Web/HTML/Canvas/A_basic_ray-caster	/es/docs/Web/API/Canvas_API/A_basic_ray-caster
+/es/docs/Web/HTML/Canvas/Drawing_graphics_with_canvas	/es/docs/conflicting/Web/API/Canvas_API/Tutorial
+/es/docs/Web/HTML/Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida	/es/docs/Learn/HTML/Howto/Author_fast-loading_HTML_pages
+/es/docs/Web/HTML/Elemento	/es/docs/Web/HTML/Element
+/es/docs/Web/HTML/Elemento/Audio2	/es/docs/Web/HTML/Element/audio
+/es/docs/Web/HTML/Elemento/Elementos_títulos	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/Web/HTML/Elemento/Etiqueta_Personalizada_HTML5	/es/docs/orphaned/Web/HTML/Elemento/Etiqueta_Personalizada_HTML5
+/es/docs/Web/HTML/Elemento/Progreso	/es/docs/Web/HTML/Element/progress
+/es/docs/Web/HTML/Elemento/Shadow	/es/docs/Web/HTML/Element/shadow
+/es/docs/Web/HTML/Elemento/Tipos_de_elementos	/es/docs/orphaned/Web/HTML/Elemento/Tipos_de_elementos
+/es/docs/Web/HTML/Elemento/a	/es/docs/Web/HTML/Element/a
+/es/docs/Web/HTML/Elemento/abbr	/es/docs/Web/HTML/Element/abbr
+/es/docs/Web/HTML/Elemento/acronym	/es/docs/Web/HTML/Element/acronym
+/es/docs/Web/HTML/Elemento/address	/es/docs/Web/HTML/Element/address
+/es/docs/Web/HTML/Elemento/applet	/es/docs/Web/HTML/Element/applet
+/es/docs/Web/HTML/Elemento/area	/es/docs/Web/HTML/Element/area
+/es/docs/Web/HTML/Elemento/article	/es/docs/Web/HTML/Element/article
+/es/docs/Web/HTML/Elemento/aside	/es/docs/Web/HTML/Element/aside
+/es/docs/Web/HTML/Elemento/audio	/es/docs/Web/HTML/Element/audio
+/es/docs/Web/HTML/Elemento/b	/es/docs/Web/HTML/Element/b
+/es/docs/Web/HTML/Elemento/base	/es/docs/Web/HTML/Element/base
+/es/docs/Web/HTML/Elemento/basefont	/es/docs/Web/HTML/Element/basefont
+/es/docs/Web/HTML/Elemento/bdi	/es/docs/Web/HTML/Element/bdi
+/es/docs/Web/HTML/Elemento/bdo	/es/docs/Web/HTML/Element/bdo
+/es/docs/Web/HTML/Elemento/bgsound	/es/docs/Web/HTML/Element/bgsound
+/es/docs/Web/HTML/Elemento/big	/es/docs/Web/HTML/Element/big
+/es/docs/Web/HTML/Elemento/blink	/es/docs/Web/HTML/Element/blink
+/es/docs/Web/HTML/Elemento/blockquote	/es/docs/Web/HTML/Element/blockquote
+/es/docs/Web/HTML/Elemento/body	/es/docs/Web/HTML/Element/body
+/es/docs/Web/HTML/Elemento/br	/es/docs/Web/HTML/Element/br
+/es/docs/Web/HTML/Elemento/button	/es/docs/Web/HTML/Element/button
+/es/docs/Web/HTML/Elemento/canvas	/es/docs/Web/HTML/Element/canvas
+/es/docs/Web/HTML/Elemento/caption	/es/docs/Web/HTML/Element/caption
+/es/docs/Web/HTML/Elemento/center	/es/docs/Web/HTML/Element/center
+/es/docs/Web/HTML/Elemento/cite	/es/docs/Web/HTML/Element/cite
+/es/docs/Web/HTML/Elemento/code	/es/docs/Web/HTML/Element/code
+/es/docs/Web/HTML/Elemento/col	/es/docs/Web/HTML/Element/col
+/es/docs/Web/HTML/Elemento/colgroup	/es/docs/Web/HTML/Element/colgroup
+/es/docs/Web/HTML/Elemento/command	/es/docs/orphaned/Web/HTML/Element/command
+/es/docs/Web/HTML/Elemento/content	/es/docs/Web/HTML/Element/content
+/es/docs/Web/HTML/Elemento/data	/es/docs/Web/HTML/Element/data
+/es/docs/Web/HTML/Elemento/datalist	/es/docs/Web/HTML/Element/datalist
+/es/docs/Web/HTML/Elemento/dd	/es/docs/Web/HTML/Element/dd
+/es/docs/Web/HTML/Elemento/del	/es/docs/Web/HTML/Element/del
+/es/docs/Web/HTML/Elemento/details	/es/docs/Web/HTML/Element/details
+/es/docs/Web/HTML/Elemento/dfn	/es/docs/Web/HTML/Element/dfn
+/es/docs/Web/HTML/Elemento/dialog	/es/docs/Web/HTML/Element/dialog
+/es/docs/Web/HTML/Elemento/dir	/es/docs/Web/HTML/Element/dir
+/es/docs/Web/HTML/Elemento/div	/es/docs/Web/HTML/Element/div
+/es/docs/Web/HTML/Elemento/dl	/es/docs/Web/HTML/Element/dl
+/es/docs/Web/HTML/Elemento/dt	/es/docs/Web/HTML/Element/dt
+/es/docs/Web/HTML/Elemento/element	/es/docs/orphaned/Web/HTML/Element/element
+/es/docs/Web/HTML/Elemento/em	/es/docs/Web/HTML/Element/em
+/es/docs/Web/HTML/Elemento/embed	/es/docs/Web/HTML/Element/embed
+/es/docs/Web/HTML/Elemento/etiqueta	/es/docs/Web/HTML/Element/label
+/es/docs/Web/HTML/Elemento/fieldset	/es/docs/Web/HTML/Element/fieldset
+/es/docs/Web/HTML/Elemento/figcaption	/es/docs/Web/HTML/Element/figcaption
+/es/docs/Web/HTML/Elemento/figure	/es/docs/Web/HTML/Element/figure
+/es/docs/Web/HTML/Elemento/font	/es/docs/Web/HTML/Element/font
+/es/docs/Web/HTML/Elemento/footer	/es/docs/Web/HTML/Element/footer
+/es/docs/Web/HTML/Elemento/form	/es/docs/Web/HTML/Element/form
+/es/docs/Web/HTML/Elemento/frame	/es/docs/Web/HTML/Element/frame
+/es/docs/Web/HTML/Elemento/frameset	/es/docs/Web/HTML/Element/frameset
+/es/docs/Web/HTML/Elemento/h2	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/Web/HTML/Elemento/h3	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/Web/HTML/Elemento/h4	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/Web/HTML/Elemento/h5	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/Web/HTML/Elemento/h6	/es/docs/Web/HTML/Element/Heading_Elements
+/es/docs/Web/HTML/Elemento/head	/es/docs/Web/HTML/Element/head
+/es/docs/Web/HTML/Elemento/header	/es/docs/Web/HTML/Element/header
+/es/docs/Web/HTML/Elemento/hgroup	/es/docs/Web/HTML/Element/hgroup
+/es/docs/Web/HTML/Elemento/hr	/es/docs/Web/HTML/Element/hr
+/es/docs/Web/HTML/Elemento/html	/es/docs/Web/HTML/Element/html
+/es/docs/Web/HTML/Elemento/i	/es/docs/Web/HTML/Element/i
+/es/docs/Web/HTML/Elemento/iframe	/es/docs/Web/HTML/Element/iframe
+/es/docs/Web/HTML/Elemento/image	/es/docs/Web/HTML/Element/image
+/es/docs/Web/HTML/Elemento/img	/es/docs/Web/HTML/Element/img
+/es/docs/Web/HTML/Elemento/input	/es/docs/Web/HTML/Element/input
+/es/docs/Web/HTML/Elemento/input/Botón	/es/docs/Web/HTML/Element/input/button
+/es/docs/Web/HTML/Elemento/input/checkbox	/es/docs/Web/HTML/Element/input/checkbox
+/es/docs/Web/HTML/Elemento/input/color	/es/docs/Web/HTML/Element/input/color
+/es/docs/Web/HTML/Elemento/input/date	/es/docs/Web/HTML/Element/input/date
+/es/docs/Web/HTML/Elemento/input/datetime	/es/docs/Web/HTML/Element/input/datetime
+/es/docs/Web/HTML/Elemento/input/email	/es/docs/Web/HTML/Element/input/email
+/es/docs/Web/HTML/Elemento/input/hidden	/es/docs/Web/HTML/Element/input/hidden
+/es/docs/Web/HTML/Elemento/input/number	/es/docs/Web/HTML/Element/input/number
+/es/docs/Web/HTML/Elemento/input/password	/es/docs/Web/HTML/Element/input/password
+/es/docs/Web/HTML/Elemento/input/range	/es/docs/Web/HTML/Element/input/range
+/es/docs/Web/HTML/Elemento/input/text	/es/docs/Web/HTML/Element/input/text
+/es/docs/Web/HTML/Elemento/ins	/es/docs/Web/HTML/Element/ins
+/es/docs/Web/HTML/Elemento/isindex	/es/docs/Web/HTML/Element/isindex
+/es/docs/Web/HTML/Elemento/kbd	/es/docs/Web/HTML/Element/kbd
+/es/docs/Web/HTML/Elemento/keygen	/es/docs/Web/HTML/Element/keygen
+/es/docs/Web/HTML/Elemento/label	/es/docs/Web/HTML/Element/label
+/es/docs/Web/HTML/Elemento/legend	/es/docs/Web/HTML/Element/legend
+/es/docs/Web/HTML/Elemento/li	/es/docs/Web/HTML/Element/li
+/es/docs/Web/HTML/Elemento/link	/es/docs/Web/HTML/Element/link
+/es/docs/Web/HTML/Elemento/main	/es/docs/Web/HTML/Element/main
+/es/docs/Web/HTML/Elemento/map	/es/docs/Web/HTML/Element/map
+/es/docs/Web/HTML/Elemento/mark	/es/docs/Web/HTML/Element/mark
+/es/docs/Web/HTML/Elemento/marquee	/es/docs/Web/HTML/Element/marquee
+/es/docs/Web/HTML/Elemento/menu	/es/docs/Web/HTML/Element/menu
+/es/docs/Web/HTML/Elemento/meta	/es/docs/Web/HTML/Element/meta
+/es/docs/Web/HTML/Elemento/multicol	/es/docs/Web/HTML/Element/multicol
+/es/docs/Web/HTML/Elemento/nav	/es/docs/Web/HTML/Element/nav
+/es/docs/Web/HTML/Elemento/nobr	/es/docs/Web/HTML/Element/nobr
+/es/docs/Web/HTML/Elemento/noframes	/es/docs/Web/HTML/Element/noframes
+/es/docs/Web/HTML/Elemento/noscript	/es/docs/Web/HTML/Element/noscript
+/es/docs/Web/HTML/Elemento/object	/es/docs/Web/HTML/Element/object
+/es/docs/Web/HTML/Elemento/ol	/es/docs/Web/HTML/Element/ol
+/es/docs/Web/HTML/Elemento/option	/es/docs/Web/HTML/Element/option
+/es/docs/Web/HTML/Elemento/p	/es/docs/Web/HTML/Element/p
+/es/docs/Web/HTML/Elemento/param	/es/docs/Web/HTML/Element/param
+/es/docs/Web/HTML/Elemento/picture	/es/docs/Web/HTML/Element/picture
+/es/docs/Web/HTML/Elemento/pre	/es/docs/Web/HTML/Element/pre
+/es/docs/Web/HTML/Elemento/preformato	/es/docs/Web/HTML/Element/pre
+/es/docs/Web/HTML/Elemento/progress	/es/docs/Web/HTML/Element/progress
+/es/docs/Web/HTML/Elemento/q	/es/docs/Web/HTML/Element/q
+/es/docs/Web/HTML/Elemento/s	/es/docs/Web/HTML/Element/s
+/es/docs/Web/HTML/Elemento/samp	/es/docs/Web/HTML/Element/samp
+/es/docs/Web/HTML/Elemento/script	/es/docs/Web/SVG/Element/script
+/es/docs/Web/HTML/Elemento/section	/es/docs/Web/HTML/Element/section
+/es/docs/Web/HTML/Elemento/select	/es/docs/Web/HTML/Element/select
+/es/docs/Web/HTML/Elemento/slot	/es/docs/Web/HTML/Element/slot
+/es/docs/Web/HTML/Elemento/small	/es/docs/Web/HTML/Element/small
+/es/docs/Web/HTML/Elemento/source	/es/docs/Web/HTML/Element/source
+/es/docs/Web/HTML/Elemento/span	/es/docs/Web/HTML/Element/span
+/es/docs/Web/HTML/Elemento/strike	/es/docs/Web/HTML/Element/strike
+/es/docs/Web/HTML/Elemento/strong	/es/docs/Web/HTML/Element/strong
+/es/docs/Web/HTML/Elemento/style	/es/docs/Web/HTML/Element/style
+/es/docs/Web/HTML/Elemento/sub	/es/docs/Web/HTML/Element/sub
+/es/docs/Web/HTML/Elemento/sup	/es/docs/Web/HTML/Element/sup
+/es/docs/Web/HTML/Elemento/table	/es/docs/Web/HTML/Element/table
+/es/docs/Web/HTML/Elemento/td	/es/docs/Web/HTML/Element/td
+/es/docs/Web/HTML/Elemento/template	/es/docs/Web/HTML/Element/template
+/es/docs/Web/HTML/Elemento/textarea	/es/docs/Web/HTML/Element/textarea
+/es/docs/Web/HTML/Elemento/th	/es/docs/Web/HTML/Element/th
+/es/docs/Web/HTML/Elemento/time	/es/docs/Web/HTML/Element/time
+/es/docs/Web/HTML/Elemento/title	/es/docs/Web/HTML/Element/title
+/es/docs/Web/HTML/Elemento/tr	/es/docs/Web/HTML/Element/tr
+/es/docs/Web/HTML/Elemento/track	/es/docs/Web/HTML/Element/track
+/es/docs/Web/HTML/Elemento/tt	/es/docs/Web/HTML/Element/tt
+/es/docs/Web/HTML/Elemento/u	/es/docs/Web/HTML/Element/u
+/es/docs/Web/HTML/Elemento/ul	/es/docs/Web/HTML/Element/ul
+/es/docs/Web/HTML/Elemento/var	/es/docs/Web/HTML/Element/var
+/es/docs/Web/HTML/Elemento/video	/es/docs/Web/HTML/Element/video
 /es/docs/Web/HTML/Elemento/video/canplay_event	/es/docs/Web/API/HTMLMediaElement/canplay_event
 /es/docs/Web/HTML/Elemento/video/timeupdate_event	/es/docs/Web/API/HTMLMediaElement/timeupdate_event
+/es/docs/Web/HTML/Elemento/wbr	/es/docs/Web/HTML/Element/wbr
+/es/docs/Web/HTML/Elemento/xmp	/es/docs/Web/HTML/Element/xmp
+/es/docs/Web/HTML/Elementos_en_línea	/es/docs/Web/HTML/Inline_elements
+/es/docs/Web/HTML/Formatos_admitidos_de_audio_y_video_en_html5	/es/docs/conflicting/Web/Media/Formats
 /es/docs/Web/HTML/Gestión_del_foco_en_HTML	/es/docs/Web/API/Document/hasFocus
+/es/docs/Web/HTML/Imagen_con_CORS_habilitado	/es/docs/Web/HTML/CORS_enabled_image
+/es/docs/Web/HTML/La_importancia_de_comentar_correctamente	/es/docs/conflicting/Learn/HTML/Introduction_to_HTML/Getting_started
+/es/docs/Web/HTML/Microdatos	/es/docs/Web/HTML/Microdata
+/es/docs/Web/HTML/Optimizing_your_pages_for_speculative_parsing	/es/docs/Glossary/speculative_parsing
+/es/docs/Web/HTML/Recursos_offline_en_firefox	/es/docs/Web/HTML/Using_the_application_cache
+/es/docs/Web/HTML/Referencia	/es/docs/Web/HTML/Reference
+/es/docs/Web/HTML/Tipos_de_enlaces	/es/docs/Web/HTML/Link_types
+/es/docs/Web/HTML/Transision_adaptativa_DASH	/es/docs/Web/Media/DASH_Adaptive_Streaming_for_HTML_5_Video
+/es/docs/Web/HTML/Usando_audio_y_video_con_HTML5	/es/docs/conflicting/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
+/es/docs/Web/HTML/anipular_video_por_medio_de_canvas	/es/docs/Web/API/Canvas_API/Manipulating_video_using_canvas
+/es/docs/Web/HTML/microformatos	/es/docs/Web/HTML/microformats
+/es/docs/Web/HTML/Índice	/es/docs/Web/HTML/Index
+/es/docs/Web/HTTP/Access_control_CORS	/es/docs/Web/HTTP/CORS
+/es/docs/Web/HTTP/Basics_of_HTTP/Datos_URIs	/es/docs/Web/HTTP/Basics_of_HTTP/Data_URIs
+/es/docs/Web/HTTP/Basics_of_HTTP/Identificación_recursos_en_la_Web	/es/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web
 /es/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Lista_completa_de_tipos_MIME	/es/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
-/es/docs/Web/JavaScript/Guide/AcercaDe	/es/docs/Web/JavaScript/Guide/Introducción
+/es/docs/Web/HTTP/Gestion_de_la_conexion_en_HTTP_1.x	/es/docs/Web/HTTP/Connection_management_in_HTTP_1.x
+/es/docs/Web/HTTP/Peticiones_condicionales	/es/docs/Web/HTTP/Conditional_requests
+/es/docs/Web/HTTP/Sesión	/es/docs/Web/HTTP/Session
+/es/docs/Web/HTTP/Status/8080	/es/docs/Web/HTTP/Status/413
+/es/docs/Web/HTTP/mecanismo_actualizacion_protocolo	/es/docs/Web/HTTP/Protocol_upgrade_mechanism
+/es/docs/Web/HTTP/recursos_y_especificaciones	/es/docs/Web/HTTP/Resources_and_specifications
+/es/docs/Web/JavaScript/Acerca_de_JavaScript	/es/docs/Web/JavaScript/About_JavaScript
+/es/docs/Web/JavaScript/Descripción_de_las_tecnologías_JavaScript	/es/docs/Web/JavaScript/JavaScript_technologies_overview
+/es/docs/Web/JavaScript/Gestion_de_Memoria	/es/docs/Web/JavaScript/Memory_Management
+/es/docs/Web/JavaScript/Guide/AcercaDe	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Web/JavaScript/Guide/Bucles_e_iteración	/es/docs/Web/JavaScript/Guide/Loops_and_iteration
 /es/docs/Web/JavaScript/Guide/Closures	/es/docs/Web/JavaScript/Closures
-/es/docs/Web/JavaScript/Guide/JavaScript_Overview	/es/docs/Web/JavaScript/Guide/Introducción
+/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores	/es/docs/Web/JavaScript/Guide/Control_flow_and_error_handling
+/es/docs/Web/JavaScript/Guide/Funciones	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/Web/JavaScript/Guide/Introducción	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Web/JavaScript/Guide/JavaScript_Overview	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Web/JavaScript/Guide/Módulos	/es/docs/Web/JavaScript/Guide/Modules
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages	/es/docs/Web/JavaScript/Guide
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5	/es/docs/Web/JavaScript/Guide
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introducción
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Constantes	/es/docs/Web/JavaScript/Referencia/Sentencias/const
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Acerca_de_esta_guía	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Concepto_de_JavaScript	/es/docs/Web/JavaScript/Guide/Introduction
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Constantes	/es/docs/Web/JavaScript/Reference/Statements/const
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Constructores_más_flexibles	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Constructores_mas_flexibles
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Creando_nuevos_objetos
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos/Borrando_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Eliminando_propiedades
@@ -1540,7 +2294,7 @@
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos/Using_Object_Initializers	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_nuevos_objetos/Utilizando_Objetos_Iniciadores	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#El_uso_de_inicializadores_de_objeto
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Crear_una_expresión_regular	/es/docs/Web/JavaScript/Guide/Regular_Expressions
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Definiendo_Funciones	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/El_ejemplo_Empleado	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/El_ejemplo_Employee	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Ejemplo.3A_employee
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/El_ejemplo_Employee/Creando_la_jerarquía	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Creacion_de_la_jerarquia
@@ -1566,15 +2320,15 @@
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Herencia_no_múltiple	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#No_existe_herencia_multiple
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Información_global_en_los_constructores	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Informacion_global_en_los_constructores
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Más_sobre_la_herencia_de_propiedades/Valores_locales_frente_a_los_heredados	/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model#Valores_locales_frente_a_valores_heredados
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos	/es/docs/Web/JavaScript/Referencia
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Array	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Math	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Number	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_RegExp	/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos	/es/docs/Web/JavaScript/Reference
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_base_predefinidos/Objeto_String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Objetos_y_propiedades	/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos#Objetos_y_propiedades
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_aritméticos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_aritm.C3.A9ticos
@@ -1584,10 +2338,10 @@
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Special_operators
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_lógicos	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_l.C3.B3gicos
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Operadores/Operadores_sobre_bits	/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operadores_Bit-a-bit
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions/eval_Function	/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Predefined_Functions/eval_Function	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencia_condicional	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Condicionales
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencia_de_bloque	/es/docs/Web/JavaScript/Referencia/Sentencias/block
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencia_de_bloque	/es/docs/Web/JavaScript/Reference/Statements/block
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#Utilizing_Error_objects
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones/throw	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#throw_statement
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones/try...catch	/es/docs/Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores#try...catch_statement
@@ -1598,193 +2352,703 @@
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Trabajar_con_expresiones_regulares/Ejemplos_de_expresiones_regulares	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Trabajar_con_expresiones_regulares/Usar_coincidencias_de_subcadenas_parentizadas	/es/docs/Web/JavaScript/Guide/Regular_Expressions
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Unicode	/en-US/docs/Web/JavaScript/Reference/Lexical_grammar
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Funciones
-/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Funciones
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Usando_el_objeto_arguments	/es/docs/Web/JavaScript/Guide/Functions
+/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Using_the_arguments_object	/es/docs/Web/JavaScript/Guide/Functions
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Valores	/es/docs/Web/JavaScript/Guide/Grammar_and_types
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Guía_JavaScript_1.5/Variables	/es/docs/Web/JavaScript/Guide/Grammar_and_types
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/Predefined_Functions	/en-US/docs/Web/JavaScript/Guide/Functions
 /es/docs/Web/JavaScript/Guide/Obsolete_Pages/The_Employee_Example	/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model
+/es/docs/Web/JavaScript/Guide/Regular_Expressions/Aserciones	/es/docs/Web/JavaScript/Guide/Regular_Expressions/Assertions
+/es/docs/Web/JavaScript/Guide/Regular_Expressions/Clases_de_caracteres	/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes
+/es/docs/Web/JavaScript/Guide/Regular_Expressions/Cuantificadores	/es/docs/Web/JavaScript/Guide/Regular_Expressions/Quantifiers
+/es/docs/Web/JavaScript/Guide/Regular_Expressions/Escapes_de_propiedades_Unicode	/es/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes
+/es/docs/Web/JavaScript/Guide/Regular_Expressions/Grupos_y_rangos	/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges
+/es/docs/Web/JavaScript/Guide/Regular_Expressions/Hoja_de_referencia	/es/docs/Web/JavaScript/Guide/Regular_Expressions/Cheatsheet
+/es/docs/Web/JavaScript/Guide/Trabajando_con_objectos	/es/docs/Web/JavaScript/Guide/Working_with_Objects
+/es/docs/Web/JavaScript/Guide/Usar_promesas	/es/docs/Web/JavaScript/Guide/Using_promises
 /es/docs/Web/JavaScript/Guide/Valores,_variables_y_literales	/es/docs/Web/JavaScript/Guide/Grammar_and_types
+/es/docs/Web/JavaScript/Guide/colecciones_indexadas	/es/docs/Web/JavaScript/Guide/Indexed_collections
+/es/docs/Web/JavaScript/Herencia_y_la_cadena_de_protipos	/es/docs/Web/JavaScript/Inheritance_and_the_prototype_chain
+/es/docs/Web/JavaScript/Introducción_a_JavaScript_orientado_a_objetos	/es/docs/conflicting/Learn/JavaScript/Objects
+/es/docs/Web/JavaScript/Introduction_to_using_XPath_in_JavaScript	/es/docs/Web/XPath/Introduction_to_using_XPath_in_JavaScript
 /es/docs/Web/JavaScript/New_in_JavaScript	/es/docs/Web/JavaScript/Novedades_en_JavaScript
 /es/docs/Web/JavaScript/Primeros_Pasos	/es/docs/Learn/Getting_started_with_the_web/JavaScript_basics
-/es/docs/Web/JavaScript/Reference/Classes	/es/docs/Web/JavaScript/Referencia/Classes
-/es/docs/Web/JavaScript/Reference/Classes/static	/es/docs/Web/JavaScript/Referencia/Classes/static
-/es/docs/Web/JavaScript/Reference/Global_Objects/JSON	/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON
-/es/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify	/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON/stringify
-/es/docs/Web/JavaScript/Reference/Global_Objects/TypedArray	/es/docs/Web/JavaScript/Referencia/Objetos_globales/TypedArray
-/es/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/buffer	/es/docs/Web/JavaScript/Referencia/Objetos_globales/TypedArray/buffer
-/es/docs/Web/JavaScript/Reference/Statements	/es/docs/Web/JavaScript/Referencia/Sentencias
-/es/docs/Web/JavaScript/Reference/Statements/const	/es/docs/Web/JavaScript/Referencia/Sentencias/const
-/es/docs/Web/JavaScript/Referencia/Características_Despreciadas	/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas
-/es/docs/Web/JavaScript/Referencia/Funciones/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Web/JavaScript/Referencia/Funciones_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/Boolean	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/Date	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/Object	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/String	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/decodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURI
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/decodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/encodeURI	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURI
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/encodeURIComponent	/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/isFinite	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/isNaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isNaN
-/es/docs/Web/JavaScript/Referencia/Funciones_globales/parseInt	/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseInt
-/es/docs/Web/JavaScript/Referencia/Methods_Index	/es/docs/Web/JavaScript/Referencia
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/flatten	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/flat
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/NumberFormat	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/NumberFormat/format	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat/format
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promesa	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promesa/all	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/all
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promesa/race	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/race
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/constructor	/es/docs/Web/JavaScript/Referencia/Objetos_globales/String
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeUR	/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURI
-/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite_	/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite
-/es/docs/Web/JavaScript/Referencia/Objetos_globlales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Web/JavaScript/Referencia/Operadores/Especiales	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Web/JavaScript/Referencia/Operadores/Especiales/function	/es/docs/Web/JavaScript/Referencia/Operadores/function
-/es/docs/Web/JavaScript/Referencia/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Referencia/Operadores
-/es/docs/Web/JavaScript/Referencia/Operadores/Operadores_especiales/Operador_this	/es/docs/Web/JavaScript/Referencia/Operadores/this
-/es/docs/Web/JavaScript/Referencia/Operadores/String	/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos
-/es/docs/Web/JavaScript/Referencia/Operadores/get	/es/docs/Web/JavaScript/Referencia/Funciones/get
-/es/docs/Web/JavaScript/Referencia/Properties_Index	/es/docs/Web/JavaScript/Referencia
-/es/docs/Web/JavaScript/Referencia/Propiedades_globales	/es/docs/Web/JavaScript/Referencia/Objetos_globales
-/es/docs/Web/JavaScript/Referencia/Propiedades_globales/Infinity	/es/docs/Web/JavaScript/Referencia/Objetos_globales/Infinity
-/es/docs/Web/JavaScript/Referencia/Propiedades_globales/NaN	/es/docs/Web/JavaScript/Referencia/Objetos_globales/NaN
-/es/docs/Web/JavaScript/Referencia/Propiedades_globales/undefined	/es/docs/Web/JavaScript/Referencia/Objetos_globales/undefined
-/es/docs/Web/JavaScript/Una_nueva_introducción_a_JavaScript	/es/docs/Web/JavaScript/Una_re-introducción_a_JavaScript
+/es/docs/Web/JavaScript/Reference/Errors/Falta_puntoycoma_antes_de_declaracion	/es/docs/Web/JavaScript/Reference/Errors/Missing_semicolon_before_statement
+/es/docs/Web/JavaScript/Reference/Errors/Indicador_regexp_no-val	/es/docs/Web/JavaScript/Reference/Errors/Bad_regexp_flag
+/es/docs/Web/JavaScript/Reference/Errors/Strict_y_parámetros_complejos	/es/docs/Web/JavaScript/Reference/Errors/Strict_Non_Simple_Params
+/es/docs/Web/JavaScript/Reference/Errors/caracter_ilegal	/es/docs/Web/JavaScript/Reference/Errors/Illegal_character
+/es/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler	/es/docs/Web/JavaScript/Reference/Global_Objects/Proxy/Proxy
+/es/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/getOwnPropertyDescriptor	/es/docs/Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/getOwnPropertyDescriptor
+/es/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/set	/es/docs/Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/set
+/es/docs/Web/JavaScript/Reference/Global_Objects/RangeError/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/RangeError
+/es/docs/Web/JavaScript/Referencia	/es/docs/Web/JavaScript/Reference
+/es/docs/Web/JavaScript/Referencia/Acerca_de	/es/docs/Web/JavaScript/Reference/About
+/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/Web/JavaScript/Referencia/Características_Desaprobadas/The_legacy_Iterator_protocol	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol
+/es/docs/Web/JavaScript/Referencia/Características_Despreciadas	/es/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features
+/es/docs/Web/JavaScript/Referencia/Classes	/es/docs/Web/JavaScript/Reference/Classes
+/es/docs/Web/JavaScript/Referencia/Classes/Class_fields	/es/docs/Web/JavaScript/Reference/Classes/Public_class_fields
+/es/docs/Web/JavaScript/Referencia/Classes/Private_class_fields	/es/docs/Web/JavaScript/Reference/Classes/Private_class_fields
+/es/docs/Web/JavaScript/Referencia/Classes/constructor	/es/docs/Web/JavaScript/Reference/Classes/constructor
+/es/docs/Web/JavaScript/Referencia/Classes/extends	/es/docs/Web/JavaScript/Reference/Classes/extends
+/es/docs/Web/JavaScript/Referencia/Classes/static	/es/docs/Web/JavaScript/Reference/Classes/static
+/es/docs/Web/JavaScript/Referencia/Funciones	/es/docs/Web/JavaScript/Reference/Functions
+/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions	/es/docs/Web/JavaScript/Reference/Functions/Arrow_functions
+/es/docs/Web/JavaScript/Referencia/Funciones/Method_definitions	/es/docs/Web/JavaScript/Reference/Functions/Method_definitions
+/es/docs/Web/JavaScript/Referencia/Funciones/Parametros_por_defecto	/es/docs/Web/JavaScript/Reference/Functions/Default_parameters
+/es/docs/Web/JavaScript/Referencia/Funciones/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Web/JavaScript/Referencia/Funciones/arguments	/es/docs/Web/JavaScript/Reference/Functions/arguments
+/es/docs/Web/JavaScript/Referencia/Funciones/arguments/callee	/es/docs/Web/JavaScript/Reference/Functions/arguments/callee
+/es/docs/Web/JavaScript/Referencia/Funciones/arguments/length	/es/docs/Web/JavaScript/Reference/Functions/arguments/length
+/es/docs/Web/JavaScript/Referencia/Funciones/get	/es/docs/Web/JavaScript/Reference/Functions/get
+/es/docs/Web/JavaScript/Referencia/Funciones/parametros_rest	/es/docs/Web/JavaScript/Reference/Functions/rest_parameters
+/es/docs/Web/JavaScript/Referencia/Funciones/set	/es/docs/Web/JavaScript/Reference/Functions/set
+/es/docs/Web/JavaScript/Referencia/Funciones_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/decodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURI
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/decodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/encodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURI
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/encodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/isFinite	/es/docs/Web/JavaScript/Reference/Global_Objects/isFinite
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/isNaN	/es/docs/Web/JavaScript/Reference/Global_Objects/isNaN
+/es/docs/Web/JavaScript/Referencia/Funciones_globales/parseInt	/es/docs/Web/JavaScript/Reference/Global_Objects/parseInt
+/es/docs/Web/JavaScript/Referencia/Gramatica_lexica	/es/docs/Web/JavaScript/Reference/Lexical_grammar
+/es/docs/Web/JavaScript/Referencia/Iteration_protocols	/es/docs/Web/JavaScript/Reference/Iteration_protocols
+/es/docs/Web/JavaScript/Referencia/Methods_Index	/es/docs/Web/JavaScript/Reference
+/es/docs/Web/JavaScript/Referencia/Modo_estricto	/es/docs/Web/JavaScript/Reference/Strict_mode
+/es/docs/Web/JavaScript/Referencia/Objetos_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/AggregateError	/es/docs/Web/JavaScript/Reference/Global_Objects/AggregateError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Array
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@iterator	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/@@iterator
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@species	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/@@species
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@unscopables	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/@@unscopables
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/concat	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/concat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/copyWithin	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/copyWithin
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/entries	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/entries
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/every	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/every
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/fill	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/fill
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/filter	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/find	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/find
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/findIndex	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/findIndex
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/flat	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/flat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/flatMap	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/flatMap
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/flatten	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/flat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/forEach	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/from	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/from
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/includes	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/includes
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/indexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/isArray	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/isArray
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/join	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/join
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/keys	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/keys
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/lastIndexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/length	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/length
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/map	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/map
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/of	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/of
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/pop	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/pop
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/prototype	/es/docs/orphaned/Web/JavaScript/Reference/Global_Objects/Array/prototype
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/push	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/push
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduce	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/ReduceRight
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reverse	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/reverse
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/shift	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/shift
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/slice	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/slice
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/some	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/some
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/sort	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/splice	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/splice
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/toLocaleString	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/toLocaleString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/toSource
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/toString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/unshift	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/values	/es/docs/Web/JavaScript/Reference/Global_Objects/Array/values
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer	/es/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/@@species	/es/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/byteLength	/es/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean/Boolean	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean/Boolean
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Boolean/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Boolean/toSource
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date	/es/docs/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/UTC	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getDate	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getDate
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getDay	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getDay
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getFullYear	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getFullYear
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getHours	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getHours
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getMilliseconds	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getMinutes	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getMinutes
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getMonth	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getMonth
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getSeconds	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getSeconds
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getTime	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getTime
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getUTCFullYear	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/getUTCHours	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/getUTCHours
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/now	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/now
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/parse	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/parse
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Date
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/setFullYear	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/setFullYear
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/setMonth	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/setMonth
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/toDateString	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/toDateString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/toISOString	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/toISOString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/toJSON	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/toJSON
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleDateString	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleString	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleTimeString	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/toUTCString	/es/docs/Web/JavaScript/Reference/Global_Objects/Date/toUTCString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error	/es/docs/Web/JavaScript/Reference/Global_Objects/Error
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/constructor_Error	/es/docs/Web/JavaScript/Reference/Global_Objects/Error/Error
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/fileName	/es/docs/Web/JavaScript/Reference/Global_Objects/Error/fileName
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/lineNumber	/es/docs/Web/JavaScript/Reference/Global_Objects/Error/lineNumber
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/message	/es/docs/Web/JavaScript/Reference/Global_Objects/Error/message
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/name	/es/docs/Web/JavaScript/Reference/Global_Objects/Error/name
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Error
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Error/toSource
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Error/toString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/EvalError	/es/docs/Web/JavaScript/Reference/Global_Objects/EvalError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Funcionesasíncronas	/es/docs/Web/JavaScript/Reference/Global_Objects/AsyncFunction
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function	/es/docs/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/Función	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/Function
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/apply	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/arguments	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/arguments
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/bind	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/bind
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/call	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/call
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/caller	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/caller
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/displayName	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/displayName
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/length	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/length
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/name	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/name
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Function
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/toSource
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Function/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Function/toString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Generador	/es/docs/Web/JavaScript/Reference/Global_Objects/Generator
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Generador/next	/es/docs/Web/JavaScript/Reference/Global_Objects/Generator/next
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Generador/return	/es/docs/Web/JavaScript/Reference/Global_Objects/Generator/return
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Generador/throw	/es/docs/Web/JavaScript/Reference/Global_Objects/Generator/throw
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Infinity	/es/docs/Web/JavaScript/Reference/Global_Objects/Infinity
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/InternalError	/es/docs/Web/JavaScript/Reference/Global_Objects/InternalError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/InternalError/Constructor_InternalError	/es/docs/Web/JavaScript/Reference/Global_Objects/InternalError/InternalError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Intl	/es/docs/Web/JavaScript/Reference/Global_Objects/Intl
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat	/es/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat/format	/es/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Intl/RelativeTimeFormat	/es/docs/Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON	/es/docs/Web/JavaScript/Reference/Global_Objects/JSON
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON/parse	/es/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON/stringify	/es/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map	/es/docs/Web/JavaScript/Reference/Global_Objects/Map
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/clear	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/clear
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/delete	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/delete
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/entries	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/entries
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/forEach	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/forEach
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/get	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/get
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/has	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/has
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/keys	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/keys
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Map
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/set	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/set
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/size	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/size
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/values	/es/docs/Web/JavaScript/Reference/Global_Objects/Map/values
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math	/es/docs/Web/JavaScript/Reference/Global_Objects/Math
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/E	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/E
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LN10	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LN10
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LN2	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LN2
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LOG10E	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LOG10E
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/LOG2E	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/LOG2E
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/PI	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/PI
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/SQRT1_2	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/SQRT2	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/SQRT2
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/abs	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/abs
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/acos	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/acos
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/acosh	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/acosh
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/asin	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/asin
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/asinh	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/asinh
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/atan	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/atan
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/atan2	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/atan2
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/atanh	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/atanh
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/cbrt	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/cbrt
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/ceil	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/ceil
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/cos	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/cos
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/exp	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/exp
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/expm1	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/expm1
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/floor	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/floor
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/fround	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/fround
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/hypot	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/hypot
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/log	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/log
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/log10	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/log10
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/log2	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/log2
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/max	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/max
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/min	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/min
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/pow	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/pow
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/random	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/random
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/round	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/round
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/seno	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/sin
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/sign	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/sign
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/sqrt	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/tan	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/tan
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/tanh	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/tanh
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Math/trunc	/es/docs/Web/JavaScript/Reference/Global_Objects/Math/trunc
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/NaN	/es/docs/Web/JavaScript/Reference/Global_Objects/NaN
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number	/es/docs/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/MAX_SAFE_INTEGER	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/MAX_VALUE	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/MIN_VALUE	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/NaN	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/NaN
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/isFinite	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/isFinite
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/isInteger	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/isInteger
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/isNaN	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/isNaN
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/isSafeInteger	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/parseFloat	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/parseFloat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/parseInt	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/parseInt
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Number
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/toFixed	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/toLocaleString	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/toPrecision	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/toPrecision
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/toString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/valueOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Number/valueOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/NumberFormat	/es/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/NumberFormat/format	/es/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object	/es/docs/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/__defineGetter__	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/__lookupGetter__	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/__lookupGetter__
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/assign	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/constructor	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/create	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/create
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/defineProperties	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/defineProperty	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/entries	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/entries
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/freeze	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/freeze
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/fromEntries	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/fromEntries
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptor	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptors	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptors
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyNames	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertySymbols	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertySymbols
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/getPrototypeOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/is	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/is
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/isExtensible	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/isExtensible
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/isFrozen	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/isFrozen
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/isPrototypeOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/isSealed	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/isSealed
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/keys	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/preventExtensions	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/preventExtensions
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/propertyIsEnumerable	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/proto	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/proto
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Object
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/seal	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/seal
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/setPrototypeOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toLocaleString	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/toLocaleString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/toSource
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/toString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/valueOf	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/valueOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/values	/es/docs/Web/JavaScript/Reference/Global_Objects/Object/values
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promesa	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promesa/all	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promesa/race	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/race
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/all	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/catch	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/catch
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/finally	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/finally
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/Promise
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/race	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/race
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/reject	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/reject
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/resolve	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/resolve
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise/then	/es/docs/Web/JavaScript/Reference/Global_Objects/Promise/then
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Proxy	/es/docs/Web/JavaScript/Reference/Global_Objects/Proxy
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/ReferenceError	/es/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp/RegExp	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp/RegExp
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp/compile	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp/compile
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp/exec	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp/ignoreCase	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp/ignoreCase
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp/rightContext	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp/rightContext
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp/test	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/RegExp/toString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set	/es/docs/Web/JavaScript/Reference/Global_Objects/Set
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/@@iterator	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/@@iterator
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/add	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/add
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/clear	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/clear
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/delete	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/delete
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/entries	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/entries
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/has	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/has
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/size	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/size
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Set/values	/es/docs/Web/JavaScript/Reference/Global_Objects/Set/values
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/Trim	/es/docs/Web/JavaScript/Reference/Global_Objects/String/Trim
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/anchor	/es/docs/Web/JavaScript/Reference/Global_Objects/String/anchor
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/big	/es/docs/Web/JavaScript/Reference/Global_Objects/String/big
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/blink	/es/docs/Web/JavaScript/Reference/Global_Objects/String/blink
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/bold	/es/docs/Web/JavaScript/Reference/Global_Objects/String/bold
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charAt
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/charCodeAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/codePointAt	/es/docs/Web/JavaScript/Reference/Global_Objects/String/codePointAt
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/concat	/es/docs/Web/JavaScript/Reference/Global_Objects/String/concat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/constructor	/es/docs/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/endsWith	/es/docs/Web/JavaScript/Reference/Global_Objects/String/endsWith
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fixed	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fixed
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fontcolor	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fontcolor
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fontsize	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fontsize
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fromCharCode	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/fromCodePoint	/es/docs/Web/JavaScript/Reference/Global_Objects/String/fromCodePoint
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/includes	/es/docs/Web/JavaScript/Reference/Global_Objects/String/includes
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/indexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/italics	/es/docs/Web/JavaScript/Reference/Global_Objects/String/italics
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/lastIndexOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/length	/es/docs/Web/JavaScript/Reference/Global_Objects/String/length
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/link	/es/docs/Web/JavaScript/Reference/Global_Objects/String/link
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/localeCompare	/es/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/match	/es/docs/Web/JavaScript/Reference/Global_Objects/String/match
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/matchAll	/es/docs/Web/JavaScript/Reference/Global_Objects/String/matchAll
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/normalize	/es/docs/Web/JavaScript/Reference/Global_Objects/String/normalize
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/padStart	/es/docs/Web/JavaScript/Reference/Global_Objects/String/padStart
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/String
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/raw	/es/docs/Web/JavaScript/Reference/Global_Objects/String/raw
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/repeat	/es/docs/Web/JavaScript/Reference/Global_Objects/String/repeat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/replace	/es/docs/Web/JavaScript/Reference/Global_Objects/String/replace
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/search	/es/docs/Web/JavaScript/Reference/Global_Objects/String/search
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/slice	/es/docs/Web/JavaScript/Reference/Global_Objects/String/slice
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/small	/es/docs/Web/JavaScript/Reference/Global_Objects/String/small
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/split	/es/docs/Web/JavaScript/Reference/Global_Objects/String/split
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/startsWith	/es/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/strike	/es/docs/Web/JavaScript/Reference/Global_Objects/String/strike
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sub	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sub
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substr	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substr
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/substring	/es/docs/Web/JavaScript/Reference/Global_Objects/String/substring
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/sup	/es/docs/Web/JavaScript/Reference/Global_Objects/String/sup
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toLocaleLowerCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toLocaleUpperCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toLowerCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toLowerCase
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toSource	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toSource
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toString	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toString
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/toUpperCase	/es/docs/Web/JavaScript/Reference/Global_Objects/String/toUpperCase
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/trimEnd	/es/docs/Web/JavaScript/Reference/Global_Objects/String/trimEnd
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/valueOf	/es/docs/Web/JavaScript/Reference/Global_Objects/String/valueOf
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Symbol	/es/docs/Web/JavaScript/Reference/Global_Objects/Symbol
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Symbol/for	/es/docs/Web/JavaScript/Reference/Global_Objects/Symbol/for
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Symbol/hasInstance	/es/docs/Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Symbol/iterator	/es/docs/Web/JavaScript/Reference/Global_Objects/Symbol/iterator
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError	/es/docs/Web/JavaScript/Reference/Global_Objects/SyntaxError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/SyntaxError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/TypedArray	/es/docs/Web/JavaScript/Reference/Global_Objects/TypedArray
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/TypedArray/buffer	/es/docs/Web/JavaScript/Reference/Global_Objects/TypedArray/buffer
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/URIError	/es/docs/Web/JavaScript/Reference/Global_Objects/URIError
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/Uint8Array	/es/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakMap	/es/docs/Web/JavaScript/Reference/Global_Objects/WeakMap
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakMap/clear	/es/docs/Web/JavaScript/Reference/Global_Objects/WeakMap/clear
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakMap/delete	/es/docs/Web/JavaScript/Reference/Global_Objects/WeakMap/delete
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakMap/get	/es/docs/Web/JavaScript/Reference/Global_Objects/WeakMap/get
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakMap/has	/es/docs/Web/JavaScript/Reference/Global_Objects/WeakMap/has
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakMap/prototype	/es/docs/conflicting/Web/JavaScript/Reference/Global_Objects/WeakMap
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakMap/set	/es/docs/Web/JavaScript/Reference/Global_Objects/WeakMap/set
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WeakSet	/es/docs/Web/JavaScript/Reference/Global_Objects/WeakSet
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/WebAssembly	/es/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeUR	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURI
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURI
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURI	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURI
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent	/es/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/escape	/es/docs/Web/JavaScript/Reference/Global_Objects/escape
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/eval	/es/docs/Web/JavaScript/Reference/Global_Objects/eval
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite	/es/docs/Web/JavaScript/Reference/Global_Objects/isFinite
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/isFinite_	/es/docs/Web/JavaScript/Reference/Global_Objects/isFinite
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/isNaN	/es/docs/Web/JavaScript/Reference/Global_Objects/isNaN
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/null	/es/docs/Web/JavaScript/Reference/Global_Objects/null
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseFloat	/es/docs/Web/JavaScript/Reference/Global_Objects/parseFloat
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/parseInt	/es/docs/Web/JavaScript/Reference/Global_Objects/parseInt
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/undefined	/es/docs/Web/JavaScript/Reference/Global_Objects/undefined
+/es/docs/Web/JavaScript/Referencia/Objetos_globales/unescape	/es/docs/Web/JavaScript/Reference/Global_Objects/unescape
+/es/docs/Web/JavaScript/Referencia/Objetos_globlales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Web/JavaScript/Referencia/Operadores	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Web/JavaScript/Referencia/Operadores/Adición	/es/docs/Web/JavaScript/Reference/Operators/Addition
+/es/docs/Web/JavaScript/Referencia/Operadores/Aritméticos	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/Web/JavaScript/Referencia/Operadores/Asignacion	/es/docs/Web/JavaScript/Reference/Operators/Assignment
+/es/docs/Web/JavaScript/Referencia/Operadores/Assignment_Operators	/es/docs/conflicting/Web/JavaScript/Reference/Operators_d3958587a3d3dd644852ad397eb5951b
+/es/docs/Web/JavaScript/Referencia/Operadores/Bitwise_Operators	/es/docs/conflicting/Web/JavaScript/Reference/Operators_5c44e7d07c463ff1a5a63654f4bda87b
+/es/docs/Web/JavaScript/Referencia/Operadores/Comparacion	/es/docs/Web/JavaScript/Reference/Operators/Equality
+/es/docs/Web/JavaScript/Referencia/Operadores/Comparison_Operators	/es/docs/conflicting/Web/JavaScript/Reference/Operators_5a0acbbb60ea37d0fdc52e3bd4c3fae8
+/es/docs/Web/JavaScript/Referencia/Operadores/Conditional_Operator	/es/docs/Web/JavaScript/Reference/Operators/Conditional_Operator
+/es/docs/Web/JavaScript/Referencia/Operadores/Decremento	/es/docs/Web/JavaScript/Reference/Operators/Decrement
+/es/docs/Web/JavaScript/Referencia/Operadores/Destructuring_assignment	/es/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
+/es/docs/Web/JavaScript/Referencia/Operadores/Division	/es/docs/Web/JavaScript/Reference/Operators/Division
+/es/docs/Web/JavaScript/Referencia/Operadores/Encadenamiento_opcional	/es/docs/Web/JavaScript/Reference/Operators/Optional_chaining
+/es/docs/Web/JavaScript/Referencia/Operadores/Especiales	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Web/JavaScript/Referencia/Operadores/Especiales/function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/Web/JavaScript/Referencia/Operadores/Grouping	/es/docs/Web/JavaScript/Reference/Operators/Grouping
+/es/docs/Web/JavaScript/Referencia/Operadores/Miembros	/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors
+/es/docs/Web/JavaScript/Referencia/Operadores/Operadores_especiales	/es/docs/Web/JavaScript/Reference/Operators
+/es/docs/Web/JavaScript/Referencia/Operadores/Operadores_especiales/Operador_this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/Web/JavaScript/Referencia/Operadores/Operadores_lógicos	/es/docs/conflicting/Web/JavaScript/Reference/Operators_e72d8790e25513408a18a5826660f704
+/es/docs/Web/JavaScript/Referencia/Operadores/Operator_Precedence	/es/docs/Web/JavaScript/Reference/Operators/Operator_Precedence
+/es/docs/Web/JavaScript/Referencia/Operadores/Pipeline_operator	/es/docs/Web/JavaScript/Reference/Operators/Pipeline_operator
+/es/docs/Web/JavaScript/Referencia/Operadores/Resto	/es/docs/Web/JavaScript/Reference/Operators/Remainder
+/es/docs/Web/JavaScript/Referencia/Operadores/Sintaxis_Spread	/es/docs/Web/JavaScript/Reference/Operators/Spread_syntax
+/es/docs/Web/JavaScript/Referencia/Operadores/Spread_operator	/es/docs/conflicting/Web/JavaScript/Reference/Operators/Spread_syntax
+/es/docs/Web/JavaScript/Referencia/Operadores/Strict_equality	/es/docs/Web/JavaScript/Reference/Operators/Strict_equality
+/es/docs/Web/JavaScript/Referencia/Operadores/String	/es/docs/conflicting/Web/JavaScript/Reference/Operators
+/es/docs/Web/JavaScript/Referencia/Operadores/Sustracción	/es/docs/Web/JavaScript/Reference/Operators/Subtraction
+/es/docs/Web/JavaScript/Referencia/Operadores/async_function	/es/docs/Web/JavaScript/Reference/Operators/async_function
+/es/docs/Web/JavaScript/Referencia/Operadores/await	/es/docs/Web/JavaScript/Reference/Operators/await
+/es/docs/Web/JavaScript/Referencia/Operadores/class	/es/docs/Web/JavaScript/Reference/Operators/class
+/es/docs/Web/JavaScript/Referencia/Operadores/delete	/es/docs/Web/JavaScript/Reference/Operators/delete
+/es/docs/Web/JavaScript/Referencia/Operadores/function	/es/docs/Web/JavaScript/Reference/Operators/function
+/es/docs/Web/JavaScript/Referencia/Operadores/function*	/es/docs/Web/JavaScript/Reference/Operators/function*
+/es/docs/Web/JavaScript/Referencia/Operadores/get	/es/docs/Web/JavaScript/Reference/Functions/get
+/es/docs/Web/JavaScript/Referencia/Operadores/in	/es/docs/Web/JavaScript/Reference/Operators/in
+/es/docs/Web/JavaScript/Referencia/Operadores/instanceof	/es/docs/Web/JavaScript/Reference/Operators/instanceof
+/es/docs/Web/JavaScript/Referencia/Operadores/new	/es/docs/Web/JavaScript/Reference/Operators/new
+/es/docs/Web/JavaScript/Referencia/Operadores/new.target	/es/docs/Web/JavaScript/Reference/Operators/new.target
+/es/docs/Web/JavaScript/Referencia/Operadores/operador_coma	/es/docs/Web/JavaScript/Reference/Operators/Comma_Operator
+/es/docs/Web/JavaScript/Referencia/Operadores/super	/es/docs/Web/JavaScript/Reference/Operators/super
+/es/docs/Web/JavaScript/Referencia/Operadores/this	/es/docs/Web/JavaScript/Reference/Operators/this
+/es/docs/Web/JavaScript/Referencia/Operadores/typeof	/es/docs/Web/JavaScript/Reference/Operators/typeof
+/es/docs/Web/JavaScript/Referencia/Operadores/void	/es/docs/Web/JavaScript/Reference/Operators/void
+/es/docs/Web/JavaScript/Referencia/Operadores/yield	/es/docs/Web/JavaScript/Reference/Operators/yield
+/es/docs/Web/JavaScript/Referencia/Operadores/yield*	/es/docs/Web/JavaScript/Reference/Operators/yield*
+/es/docs/Web/JavaScript/Referencia/Palabras_Reservadas	/es/docs/conflicting/Web/JavaScript/Reference/Lexical_grammar
+/es/docs/Web/JavaScript/Referencia/Properties_Index	/es/docs/Web/JavaScript/Reference
+/es/docs/Web/JavaScript/Referencia/Propiedades_globales	/es/docs/Web/JavaScript/Reference/Global_Objects
+/es/docs/Web/JavaScript/Referencia/Propiedades_globales/Infinity	/es/docs/Web/JavaScript/Reference/Global_Objects/Infinity
+/es/docs/Web/JavaScript/Referencia/Propiedades_globales/NaN	/es/docs/Web/JavaScript/Reference/Global_Objects/NaN
+/es/docs/Web/JavaScript/Referencia/Propiedades_globales/undefined	/es/docs/Web/JavaScript/Reference/Global_Objects/undefined
+/es/docs/Web/JavaScript/Referencia/Sentencias	/es/docs/Web/JavaScript/Reference/Statements
+/es/docs/Web/JavaScript/Referencia/Sentencias/Empty	/es/docs/Web/JavaScript/Reference/Statements/Empty
+/es/docs/Web/JavaScript/Referencia/Sentencias/block	/es/docs/Web/JavaScript/Reference/Statements/block
+/es/docs/Web/JavaScript/Referencia/Sentencias/break	/es/docs/Web/JavaScript/Reference/Statements/break
+/es/docs/Web/JavaScript/Referencia/Sentencias/class	/es/docs/Web/JavaScript/Reference/Statements/class
+/es/docs/Web/JavaScript/Referencia/Sentencias/const	/es/docs/Web/JavaScript/Reference/Statements/const
+/es/docs/Web/JavaScript/Referencia/Sentencias/continue	/es/docs/Web/JavaScript/Reference/Statements/continue
+/es/docs/Web/JavaScript/Referencia/Sentencias/debugger	/es/docs/Web/JavaScript/Reference/Statements/debugger
+/es/docs/Web/JavaScript/Referencia/Sentencias/default	/es/docs/conflicting/Web/JavaScript/Reference/Statements/switch
+/es/docs/Web/JavaScript/Referencia/Sentencias/do...while	/es/docs/Web/JavaScript/Reference/Statements/do...while
+/es/docs/Web/JavaScript/Referencia/Sentencias/export	/es/docs/Web/JavaScript/Reference/Statements/export
+/es/docs/Web/JavaScript/Referencia/Sentencias/for	/es/docs/Web/JavaScript/Reference/Statements/for
+/es/docs/Web/JavaScript/Referencia/Sentencias/for-await...of	/es/docs/Web/JavaScript/Reference/Statements/for-await...of
+/es/docs/Web/JavaScript/Referencia/Sentencias/for...in	/es/docs/Web/JavaScript/Reference/Statements/for...in
+/es/docs/Web/JavaScript/Referencia/Sentencias/for...of	/es/docs/Web/JavaScript/Reference/Statements/for...of
+/es/docs/Web/JavaScript/Referencia/Sentencias/funcion_asincrona	/es/docs/Web/JavaScript/Reference/Statements/async_function
+/es/docs/Web/JavaScript/Referencia/Sentencias/function	/es/docs/Web/JavaScript/Reference/Statements/function
+/es/docs/Web/JavaScript/Referencia/Sentencias/function*	/es/docs/Web/JavaScript/Reference/Statements/function*
+/es/docs/Web/JavaScript/Referencia/Sentencias/if...else	/es/docs/Web/JavaScript/Reference/Statements/if...else
+/es/docs/Web/JavaScript/Referencia/Sentencias/import	/es/docs/Web/JavaScript/Reference/Statements/import
+/es/docs/Web/JavaScript/Referencia/Sentencias/import.meta	/es/docs/Web/JavaScript/Reference/Statements/import.meta
+/es/docs/Web/JavaScript/Referencia/Sentencias/label	/es/docs/Web/JavaScript/Reference/Statements/label
+/es/docs/Web/JavaScript/Referencia/Sentencias/let	/es/docs/Web/JavaScript/Reference/Statements/let
+/es/docs/Web/JavaScript/Referencia/Sentencias/return	/es/docs/Web/JavaScript/Reference/Statements/return
+/es/docs/Web/JavaScript/Referencia/Sentencias/switch	/es/docs/Web/JavaScript/Reference/Statements/switch
+/es/docs/Web/JavaScript/Referencia/Sentencias/throw	/es/docs/Web/JavaScript/Reference/Statements/throw
+/es/docs/Web/JavaScript/Referencia/Sentencias/try...catch	/es/docs/Web/JavaScript/Reference/Statements/try...catch
+/es/docs/Web/JavaScript/Referencia/Sentencias/var	/es/docs/Web/JavaScript/Reference/Statements/var
+/es/docs/Web/JavaScript/Referencia/Sentencias/while	/es/docs/Web/JavaScript/Reference/Statements/while
+/es/docs/Web/JavaScript/Referencia/Sentencias/with	/es/docs/Web/JavaScript/Reference/Statements/with
+/es/docs/Web/JavaScript/Referencia/template_strings	/es/docs/Web/JavaScript/Reference/Template_literals
+/es/docs/Web/JavaScript/Una_nueva_introducción_a_JavaScript	/es/docs/Web/JavaScript/A_re-introduction_to_JavaScript
+/es/docs/Web/JavaScript/Una_re-introducción_a_JavaScript	/es/docs/Web/JavaScript/A_re-introduction_to_JavaScript
+/es/docs/Web/JavaScript/Vectores_tipados	/es/docs/Web/JavaScript/Typed_arrays
+/es/docs/Web/JavaScript/enumeracion_y_propietario_de_propiedades	/es/docs/Web/JavaScript/Enumerability_and_ownership_of_properties
+/es/docs/Web/MathML/Elemento	/es/docs/Web/MathML/Element
+/es/docs/Web/MathML/Elemento/math	/es/docs/Web/MathML/Element/math
+/es/docs/Web/Performance/mejorando_rendimienot_inicial	/es/docs/Web/Performance/Optimizing_startup_performance
+/es/docs/Web/Progressive_web_apps/Developer_guide/Instalar	/es/docs/Web/Progressive_web_apps/Developer_guide/Installing
+/es/docs/Web/Progressive_web_apps/Ventajas	/es/docs/conflicting/Web/Progressive_web_apps/Introduction
 /es/docs/Web/Reference/Events	/es/docs/Web/Events
-/es/docs/Web/Reference/Events/DOMContentLoaded	/es/docs/Web/Events/DOMContentLoaded
+/es/docs/Web/Reference/Events/DOMContentLoaded	/es/docs/Web/API/Window/DOMContentLoaded_event
 /es/docs/Web/Reference/Events/DOMSubtreeModified	/es/docs/Web/Events/DOMSubtreeModified
-/es/docs/Web/Reference/Events/abort	/es/docs/Web/Events/abort
-/es/docs/Web/Reference/Events/animationend	/es/docs/Web/Events/animationend
-/es/docs/Web/Reference/Events/beforeunload	/es/docs/Web/Events/beforeunload
-/es/docs/Web/Reference/Events/blur	/es/docs/Web/Events/blur
+/es/docs/Web/Reference/Events/abort	/es/docs/Web/API/HTMLMediaElement/abort_event
+/es/docs/Web/Reference/Events/animationend	/es/docs/Web/API/HTMLElement/animationend_event
+/es/docs/Web/Reference/Events/beforeunload	/es/docs/Web/API/Window/beforeunload_event
+/es/docs/Web/Reference/Events/blur	/es/docs/Web/API/Element/blur_event
 /es/docs/Web/Reference/Events/canplay	/es/docs/Web/API/HTMLMediaElement/canplay_event
 /es/docs/Web/Reference/Events/click	/es/docs/Web/API/Element/click_event
 /es/docs/Web/Reference/Events/close_websocket	/es/docs/Web/API/WebSocket/close_event
 /es/docs/Web/Reference/Events/dragover	/es/docs/Web/API/Document/dragover_event
 /es/docs/Web/Reference/Events/hashchange	/es/docs/Web/API/Window/hashchange_event
 /es/docs/Web/Reference/Events/keydown	/es/docs/Web/API/Document/keydown_event
-/es/docs/Web/Reference/Events/load	/es/docs/Web/Events/load
-/es/docs/Web/Reference/Events/loadend	/es/docs/Web/Events/loadend
+/es/docs/Web/Reference/Events/load	/es/docs/Web/API/Window/load_event
+/es/docs/Web/Reference/Events/loadend	/es/docs/Web/API/XMLHttpRequest/loadend_event
 /es/docs/Web/Reference/Events/mousedown	/es/docs/Web/API/Element/mousedown_event
-/es/docs/Web/Reference/Events/pointerlockchange	/es/docs/Web/Events/pointerlockchange
+/es/docs/Web/Reference/Events/pointerlockchange	/es/docs/Web/API/Document/pointerlockchange_event
 /es/docs/Web/Reference/Events/scroll	/es/docs/Web/API/Document/scroll_event
 /es/docs/Web/Reference/Events/tecla	/es/docs/Web/API/Document/keyup_event
 /es/docs/Web/Reference/Events/timeupdate	/es/docs/Web/API/HTMLMediaElement/timeupdate_event
-/es/docs/Web/Reference/Events/transitioncancel	/es/docs/Web/Events/transitioncancel
-/es/docs/Web/Reference/Events/transitionend	/es/docs/Web/Events/transitionend
+/es/docs/Web/Reference/Events/transitioncancel	/es/docs/Web/API/HTMLElement/transitioncancel_event
+/es/docs/Web/Reference/Events/transitionend	/es/docs/Web/API/HTMLElement/transitionend_event
 /es/docs/Web/Reference/Events/wheel	/es/docs/Web/API/Element/wheel_event
+/es/docs/Web/SVG/Element/glifo	/es/docs/Web/SVG/Element/glyph
+/es/docs/Web/SVG/SVG_en_Firefox_1.5	/es/docs/orphaned/Web/SVG/SVG_en_Firefox_1.5
+/es/docs/Web/SVG/Tutorial/Introducción	/es/docs/Web/SVG/Tutorial/Introduction
+/es/docs/Web/Security/CSP	/es/docs/conflicting/Web/HTTP/CSP
+/es/docs/Web/Security/CSP/CSP_policy_directives	/es/docs/conflicting/Web/HTTP/Headers/Content-Security-Policy
+/es/docs/Web/Security/CSP/Introducing_Content_Security_Policy	/es/docs/conflicting/Web/HTTP/CSP_aeae68a149c6fbe64e541cbdcd6ed5c5
+/es/docs/Web/Security/Same-origin_politica	/es/docs/Web/Security/Same-origin_policy
+/es/docs/Web/Security/Securing_your_site/desactivar_autocompletado_formulario	/es/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
+/es/docs/Web/Tutoriales	/es/docs/Web/Tutorials
 /es/docs/Web/WebGL	/es/docs/Web/API/WebGL_API
 /es/docs/Web/WebGL/Animating_objects_with_WebGL	/es/docs/Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL
 /es/docs/Web/WebGL/Getting_started_with_WebGL	/es/docs/Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL
+/es/docs/Web/Web_Components/Custom_Elements	/es/docs/conflicting/Web/Web_Components/Using_custom_elements
+/es/docs/Web/XML/Introducción_a_XML	/es/docs/Web/XML/XML_introduction
+/es/docs/Web/XPath/Ejes	/es/docs/Web/XPath/Axes
+/es/docs/Web/XPath/Ejes/ancestor	/es/docs/Web/XPath/Axes/ancestor
+/es/docs/Web/XPath/Ejes/ancestor-or-self	/es/docs/Web/XPath/Axes/ancestor-or-self
+/es/docs/Web/XPath/Ejes/attribute	/es/docs/Web/XPath/Axes/attribute
+/es/docs/Web/XPath/Ejes/child	/es/docs/Web/XPath/Axes/child
+/es/docs/Web/XPath/Ejes/descendant	/es/docs/Web/XPath/Axes/descendant
+/es/docs/Web/XPath/Ejes/descendant-or-self	/es/docs/Web/XPath/Axes/descendant-or-self
+/es/docs/Web/XPath/Ejes/following	/es/docs/Web/XPath/Axes/following
+/es/docs/Web/XPath/Ejes/following-sibling	/es/docs/Web/XPath/Axes/following-sibling
+/es/docs/Web/XPath/Ejes/namespace	/es/docs/Web/XPath/Axes/namespace
+/es/docs/Web/XPath/Ejes/parent	/es/docs/Web/XPath/Axes/parent
+/es/docs/Web/XPath/Ejes/preceding	/es/docs/Web/XPath/Axes/preceding
+/es/docs/Web/XPath/Ejes/preceding-sibling	/es/docs/Web/XPath/Axes/preceding-sibling
+/es/docs/Web/XPath/Funciones	/es/docs/Web/XPath/Functions
+/es/docs/Web/XPath/Funciones/contains	/es/docs/Web/XPath/Functions/contains
+/es/docs/Web/XPath/Funciones/substring	/es/docs/Web/XPath/Functions/substring
+/es/docs/Web/XPath/Funciones/true	/es/docs/Web/XPath/Functions/true
 /es/docs/Web/XSLT/Elementos	/es/docs/Web/XSLT/Element
 /es/docs/Web/XSLT/Elementos/element	/es/docs/Web/XSLT/Element/element
+/es/docs/Web/XSLT/Transformando_XML_con_XSLT	/es/docs/Web/XSLT/Transforming_XML_with_XSLT
+/es/docs/Web/XSLT/apply-imports	/es/docs/Web/XSLT/Element/apply-imports
+/es/docs/Web/XSLT/apply-templates	/es/docs/Web/XSLT/Element/apply-templates
+/es/docs/Web/XSLT/attribute	/es/docs/Web/XSLT/Element/attribute
+/es/docs/Web/XSLT/attribute-set	/es/docs/Web/XSLT/Element/attribute-set
+/es/docs/Web/XSLT/call-template	/es/docs/Web/XSLT/Element/call-template
+/es/docs/Web/XSLT/choose	/es/docs/Web/XSLT/Element/choose
+/es/docs/Web/XSLT/comment	/es/docs/Web/XSLT/Element/comment
+/es/docs/Web/XSLT/copy	/es/docs/Web/XSLT/Element/copy
+/es/docs/Web/XSLT/copy-of	/es/docs/Web/XSLT/Element/copy-of
+/es/docs/Web/XSLT/decimal-format	/es/docs/Web/XSLT/Element/decimal-format
+/es/docs/Web/XSLT/fallback	/es/docs/Web/XSLT/Element/fallback
+/es/docs/Web/XSLT/for-each	/es/docs/Web/XSLT/Element/for-each
+/es/docs/Web/XSLT/if	/es/docs/Web/XSLT/Element/if
+/es/docs/Web/XSLT/import	/es/docs/Web/XSLT/Element/import
+/es/docs/Web/XSLT/include	/es/docs/Web/XSLT/Element/include
+/es/docs/Web/XSLT/key	/es/docs/Web/XSLT/Element/key
+/es/docs/Web/XSLT/message	/es/docs/Web/XSLT/Element/message
+/es/docs/Web/XSLT/namespace-alias	/es/docs/Web/XSLT/Element/namespace-alias
+/es/docs/Web/XSLT/number	/es/docs/Web/XSLT/Element/number
+/es/docs/Web/XSLT/otherwise	/es/docs/Web/XSLT/Element/otherwise
+/es/docs/Web/XSLT/when	/es/docs/Web/XSLT/Element/when
+/es/docs/Web/XSLT/with-param	/es/docs/Web/XSLT/Element/with-param
+/es/docs/WebAPI	/es/docs/conflicting/Web/API_dd04ca1265cb79b990b8120e5f5070d3
+/es/docs/WebAPI/Estado_de_Bateria	/es/docs/Web/API/Battery_Status_API
+/es/docs/WebAPI/Pointer_Lock	/es/docs/Web/API/Pointer_Lock_API
+/es/docs/WebAPI/Using_geolocation	/es/docs/Web/API/Geolocation_API
 /es/docs/WebGL	/es/docs/Web/API/WebGL_API
 /es/docs/WebGL/Animating_objects_with_WebGL	/es/docs/Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL
+/es/docs/WebRTC	/es/docs/conflicting/Web/API/WebRTC_API
+/es/docs/WebRTC/Introduction	/es/docs/Web/API/WebRTC_API/Session_lifetime
+/es/docs/WebRTC/MediaStream_API	/es/docs/Web/API/Media_Streams_API
+/es/docs/WebRTC/Peer-to-peer_communications_with_WebRTC	/es/docs/Web/Guide/API/WebRTC/Peer-to-peer_communications_with_WebRTC
+/es/docs/WebRTC/Taking_webcam_photos	/es/docs/Web/API/WebRTC_API/Taking_still_photos
+/es/docs/WebSockets	/es/docs/conflicting/Web/API/WebSockets_API
 /es/docs/WebSockets-840092-dup	/es/docs/Web/API/WebSockets_API
-/es/docs/WebSockets-840092-dup/Escribiendo_servidor_WebSocket	/es/docs/Web/API/WebSockets_API/Escribiendo_servidor_WebSocket
-/es/docs/WebSockets-840092-dup/Escribiendo_servidores_con_WebSocket	/es/docs/Web/API/WebSockets_API/Escribiendo_servidores_con_WebSocket
+/es/docs/WebSockets-840092-dup/Escribiendo_servidor_WebSocket	/es/docs/Web/API/WebSockets_API/Writing_WebSocket_server
+/es/docs/WebSockets-840092-dup/Escribiendo_servidores_con_WebSocket	/es/docs/Web/API/WebSockets_API/Writing_WebSocket_servers
 /es/docs/WebSockets-840092-dup/Writing_WebSocket_client_applications	/es/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications
+/es/docs/Web_Audio_API	/es/docs/Web/API/Web_Audio_API
+/es/docs/Web_Development/Mobile	/es/docs/conflicting/Web/Guide/Mobile
+/es/docs/Web_Development/Mobile/Diseño_responsivo	/es/docs/conflicting/Web/Progressive_web_apps
 /es/docs/XForms:Soporte_en_Mozilla	/es/docs/XForms/Soporte_en_Mozilla
+/es/docs/XHTML	/es/docs/Glossary/XHTML
 /es/docs/XMLHttpRequest	/es/docs/Web/API/XMLHttpRequest
-/es/docs/XMLHttpRequest/FormData	/es/docs/Web/API/XMLHttpRequest/FormData
+/es/docs/XMLHttpRequest/FormData	/es/docs/Web/API/FormData
 /es/docs/XMLHttpRequest/Using_XMLHttpRequest	/es/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest
 /es/docs/XMLHttpRequest/abort	/es/docs/Web/API/XMLHttpRequest/abort
 /es/docs/XMLHttpRequest/onreadystatechange	/es/docs/Web/API/XMLHttpRequest/onreadystatechange
+/es/docs/XPInstall_API_Reference	/es/docs/orphaned/XPInstall_API_Reference
 /es/docs/XPath	/es/docs/Web/XPath
-/es/docs/XPath/Ejes	/es/docs/Web/XPath/Ejes
-/es/docs/XPath/Ejes/ancestor	/es/docs/Web/XPath/Ejes/ancestor
-/es/docs/XPath/Ejes/ancestor-or-self	/es/docs/Web/XPath/Ejes/ancestor-or-self
-/es/docs/XPath/Ejes/attribute	/es/docs/Web/XPath/Ejes/attribute
-/es/docs/XPath/Ejes/child	/es/docs/Web/XPath/Ejes/child
-/es/docs/XPath/Ejes/descendant	/es/docs/Web/XPath/Ejes/descendant
-/es/docs/XPath/Ejes/descendant-or-self	/es/docs/Web/XPath/Ejes/descendant-or-self
-/es/docs/XPath/Ejes/following	/es/docs/Web/XPath/Ejes/following
-/es/docs/XPath/Ejes/following-sibling	/es/docs/Web/XPath/Ejes/following-sibling
-/es/docs/XPath/Ejes/namespace	/es/docs/Web/XPath/Ejes/namespace
-/es/docs/XPath/Ejes/parent	/es/docs/Web/XPath/Ejes/parent
-/es/docs/XPath/Ejes/preceding	/es/docs/Web/XPath/Ejes/preceding
-/es/docs/XPath/Ejes/preceding-sibling	/es/docs/Web/XPath/Ejes/preceding-sibling
-/es/docs/XPath/Funciones	/es/docs/Web/XPath/Funciones
-/es/docs/XPath/Funciones-XPath/true	/es/docs/Web/XPath/Funciones/true
-/es/docs/XPath/Funciones/contains	/es/docs/Web/XPath/Funciones/contains
-/es/docs/XPath/Funciones/substring	/es/docs/Web/XPath/Funciones/substring
-/es/docs/XPath/Funciones/true	/es/docs/Web/XPath/Funciones/true
-/es/docs/XPath/funciones-xpath	/es/docs/Web/XPath/Funciones
-/es/docs/XPath/funciones-xpath/contains	/es/docs/Web/XPath/Funciones/contains
-/es/docs/XPath/funciones-xpath/substring	/es/docs/Web/XPath/Funciones/substring
-/es/docs/XPath:Ejes	/es/docs/Web/XPath/Ejes
-/es/docs/XPath:Ejes:ancestor	/es/docs/Web/XPath/Ejes/ancestor
-/es/docs/XPath:Ejes:ancestor-or-self	/es/docs/Web/XPath/Ejes/ancestor-or-self
-/es/docs/XPath:Ejes:attribute	/es/docs/Web/XPath/Ejes/attribute
-/es/docs/XPath:Ejes:child	/es/docs/Web/XPath/Ejes/child
-/es/docs/XPath:Ejes:descendant	/es/docs/Web/XPath/Ejes/descendant
-/es/docs/XPath:Ejes:descendant-or-self	/es/docs/Web/XPath/Ejes/descendant-or-self
-/es/docs/XPath:Ejes:following	/es/docs/Web/XPath/Ejes/following
-/es/docs/XPath:Ejes:following-sibling	/es/docs/Web/XPath/Ejes/following-sibling
-/es/docs/XPath:Ejes:namespace	/es/docs/Web/XPath/Ejes/namespace
-/es/docs/XPath:Ejes:parent	/es/docs/Web/XPath/Ejes/parent
-/es/docs/XPath:Ejes:preceding	/es/docs/Web/XPath/Ejes/preceding
-/es/docs/XPath:Ejes:preceding-sibling	/es/docs/Web/XPath/Ejes/preceding-sibling
-/es/docs/XPath:Funciones:contains	/es/docs/Web/XPath/Funciones/contains
-/es/docs/XPath:Funciones:substring	/es/docs/Web/XPath/Funciones/substring
-/es/docs/XPath:Funciones:true	/es/docs/Web/XPath/Funciones/true
+/es/docs/XPath/Ejes	/es/docs/Web/XPath/Axes
+/es/docs/XPath/Ejes/ancestor	/es/docs/Web/XPath/Axes/ancestor
+/es/docs/XPath/Ejes/ancestor-or-self	/es/docs/Web/XPath/Axes/ancestor-or-self
+/es/docs/XPath/Ejes/attribute	/es/docs/Web/XPath/Axes/attribute
+/es/docs/XPath/Ejes/child	/es/docs/Web/XPath/Axes/child
+/es/docs/XPath/Ejes/descendant	/es/docs/Web/XPath/Axes/descendant
+/es/docs/XPath/Ejes/descendant-or-self	/es/docs/Web/XPath/Axes/descendant-or-self
+/es/docs/XPath/Ejes/following	/es/docs/Web/XPath/Axes/following
+/es/docs/XPath/Ejes/following-sibling	/es/docs/Web/XPath/Axes/following-sibling
+/es/docs/XPath/Ejes/namespace	/es/docs/Web/XPath/Axes/namespace
+/es/docs/XPath/Ejes/parent	/es/docs/Web/XPath/Axes/parent
+/es/docs/XPath/Ejes/preceding	/es/docs/Web/XPath/Axes/preceding
+/es/docs/XPath/Ejes/preceding-sibling	/es/docs/Web/XPath/Axes/preceding-sibling
+/es/docs/XPath/Funciones	/es/docs/Web/XPath/Functions
+/es/docs/XPath/Funciones-XPath/true	/es/docs/Web/XPath/Functions/true
+/es/docs/XPath/Funciones/contains	/es/docs/Web/XPath/Functions/contains
+/es/docs/XPath/Funciones/substring	/es/docs/Web/XPath/Functions/substring
+/es/docs/XPath/Funciones/true	/es/docs/Web/XPath/Functions/true
+/es/docs/XPath/funciones-xpath	/es/docs/Web/XPath/Functions
+/es/docs/XPath/funciones-xpath/contains	/es/docs/Web/XPath/Functions/contains
+/es/docs/XPath/funciones-xpath/substring	/es/docs/Web/XPath/Functions/substring
+/es/docs/XPath:Ejes	/es/docs/Web/XPath/Axes
+/es/docs/XPath:Ejes:ancestor	/es/docs/Web/XPath/Axes/ancestor
+/es/docs/XPath:Ejes:ancestor-or-self	/es/docs/Web/XPath/Axes/ancestor-or-self
+/es/docs/XPath:Ejes:attribute	/es/docs/Web/XPath/Axes/attribute
+/es/docs/XPath:Ejes:child	/es/docs/Web/XPath/Axes/child
+/es/docs/XPath:Ejes:descendant	/es/docs/Web/XPath/Axes/descendant
+/es/docs/XPath:Ejes:descendant-or-self	/es/docs/Web/XPath/Axes/descendant-or-self
+/es/docs/XPath:Ejes:following	/es/docs/Web/XPath/Axes/following
+/es/docs/XPath:Ejes:following-sibling	/es/docs/Web/XPath/Axes/following-sibling
+/es/docs/XPath:Ejes:namespace	/es/docs/Web/XPath/Axes/namespace
+/es/docs/XPath:Ejes:parent	/es/docs/Web/XPath/Axes/parent
+/es/docs/XPath:Ejes:preceding	/es/docs/Web/XPath/Axes/preceding
+/es/docs/XPath:Ejes:preceding-sibling	/es/docs/Web/XPath/Axes/preceding-sibling
+/es/docs/XPath:Funciones:contains	/es/docs/Web/XPath/Functions/contains
+/es/docs/XPath:Funciones:substring	/es/docs/Web/XPath/Functions/substring
+/es/docs/XPath:Funciones:true	/es/docs/Web/XPath/Functions/true
 /es/docs/XSLT	/es/docs/Web/XSLT
 /es/docs/XSLT/Elementos	/es/docs/Web/XSLT/Element
-/es/docs/XSLT/apply-imports	/es/docs/Web/XSLT/apply-imports
-/es/docs/XSLT/apply-templates	/es/docs/Web/XSLT/apply-templates
-/es/docs/XSLT/attribute	/es/docs/Web/XSLT/attribute
-/es/docs/XSLT/attribute-set	/es/docs/Web/XSLT/attribute-set
-/es/docs/XSLT/call-template	/es/docs/Web/XSLT/call-template
-/es/docs/XSLT/choose	/es/docs/Web/XSLT/choose
-/es/docs/XSLT/comment	/es/docs/Web/XSLT/comment
-/es/docs/XSLT/copy	/es/docs/Web/XSLT/copy
-/es/docs/XSLT/copy-of	/es/docs/Web/XSLT/copy-of
-/es/docs/XSLT/decimal-format	/es/docs/Web/XSLT/decimal-format
+/es/docs/XSLT/apply-imports	/es/docs/Web/XSLT/Element/apply-imports
+/es/docs/XSLT/apply-templates	/es/docs/Web/XSLT/Element/apply-templates
+/es/docs/XSLT/attribute	/es/docs/Web/XSLT/Element/attribute
+/es/docs/XSLT/attribute-set	/es/docs/Web/XSLT/Element/attribute-set
+/es/docs/XSLT/call-template	/es/docs/Web/XSLT/Element/call-template
+/es/docs/XSLT/choose	/es/docs/Web/XSLT/Element/choose
+/es/docs/XSLT/comment	/es/docs/Web/XSLT/Element/comment
+/es/docs/XSLT/copy	/es/docs/Web/XSLT/Element/copy
+/es/docs/XSLT/copy-of	/es/docs/Web/XSLT/Element/copy-of
+/es/docs/XSLT/decimal-format	/es/docs/Web/XSLT/Element/decimal-format
 /es/docs/XSLT/element	/es/docs/Web/XSLT/Element/element
-/es/docs/XSLT/fallback	/es/docs/Web/XSLT/fallback
-/es/docs/XSLT/for-each	/es/docs/Web/XSLT/for-each
-/es/docs/XSLT/if	/es/docs/Web/XSLT/if
-/es/docs/XSLT/import	/es/docs/Web/XSLT/import
-/es/docs/XSLT/include	/es/docs/Web/XSLT/include
-/es/docs/XSLT/key	/es/docs/Web/XSLT/key
-/es/docs/XSLT/message	/es/docs/Web/XSLT/message
-/es/docs/XSLT/namespace-alias	/es/docs/Web/XSLT/namespace-alias
-/es/docs/XSLT/number	/es/docs/Web/XSLT/number
-/es/docs/XSLT/otherwise	/es/docs/Web/XSLT/otherwise
-/es/docs/XSLT/when	/es/docs/Web/XSLT/when
-/es/docs/XSLT/with-param	/es/docs/Web/XSLT/with-param
+/es/docs/XSLT/fallback	/es/docs/Web/XSLT/Element/fallback
+/es/docs/XSLT/for-each	/es/docs/Web/XSLT/Element/for-each
+/es/docs/XSLT/if	/es/docs/Web/XSLT/Element/if
+/es/docs/XSLT/import	/es/docs/Web/XSLT/Element/import
+/es/docs/XSLT/include	/es/docs/Web/XSLT/Element/include
+/es/docs/XSLT/key	/es/docs/Web/XSLT/Element/key
+/es/docs/XSLT/message	/es/docs/Web/XSLT/Element/message
+/es/docs/XSLT/namespace-alias	/es/docs/Web/XSLT/Element/namespace-alias
+/es/docs/XSLT/number	/es/docs/Web/XSLT/Element/number
+/es/docs/XSLT/otherwise	/es/docs/Web/XSLT/Element/otherwise
+/es/docs/XSLT/when	/es/docs/Web/XSLT/Element/when
+/es/docs/XSLT/with-param	/es/docs/Web/XSLT/Element/with-param
 /es/docs/XSLT:Elementos	/es/docs/Web/XSLT/Element
-/es/docs/XSLT:apply-imports	/es/docs/Web/XSLT/apply-imports
-/es/docs/XSLT:apply-templates	/es/docs/Web/XSLT/apply-templates
-/es/docs/XSLT:attribute	/es/docs/Web/XSLT/attribute
-/es/docs/XSLT:attribute-set	/es/docs/Web/XSLT/attribute-set
-/es/docs/XSLT:call-template	/es/docs/Web/XSLT/call-template
-/es/docs/XSLT:choose	/es/docs/Web/XSLT/choose
-/es/docs/XSLT:comment	/es/docs/Web/XSLT/comment
-/es/docs/XSLT:copy	/es/docs/Web/XSLT/copy
-/es/docs/XSLT:copy-of	/es/docs/Web/XSLT/copy-of
-/es/docs/XSLT:decimal-format	/es/docs/Web/XSLT/decimal-format
+/es/docs/XSLT:apply-imports	/es/docs/Web/XSLT/Element/apply-imports
+/es/docs/XSLT:apply-templates	/es/docs/Web/XSLT/Element/apply-templates
+/es/docs/XSLT:attribute	/es/docs/Web/XSLT/Element/attribute
+/es/docs/XSLT:attribute-set	/es/docs/Web/XSLT/Element/attribute-set
+/es/docs/XSLT:call-template	/es/docs/Web/XSLT/Element/call-template
+/es/docs/XSLT:choose	/es/docs/Web/XSLT/Element/choose
+/es/docs/XSLT:comment	/es/docs/Web/XSLT/Element/comment
+/es/docs/XSLT:copy	/es/docs/Web/XSLT/Element/copy
+/es/docs/XSLT:copy-of	/es/docs/Web/XSLT/Element/copy-of
+/es/docs/XSLT:decimal-format	/es/docs/Web/XSLT/Element/decimal-format
 /es/docs/XSLT:element	/es/docs/Web/XSLT/Element/element
-/es/docs/XSLT:fallback	/es/docs/Web/XSLT/fallback
-/es/docs/XSLT:for-each	/es/docs/Web/XSLT/for-each
-/es/docs/XSLT:if	/es/docs/Web/XSLT/if
-/es/docs/XSLT:import	/es/docs/Web/XSLT/import
-/es/docs/XSLT:include	/es/docs/Web/XSLT/include
-/es/docs/XSLT:key	/es/docs/Web/XSLT/key
-/es/docs/XSLT:message	/es/docs/Web/XSLT/message
-/es/docs/XSLT:namespace-alias	/es/docs/Web/XSLT/namespace-alias
-/es/docs/XSLT:number	/es/docs/Web/XSLT/number
-/es/docs/XSLT:otherwise	/es/docs/Web/XSLT/otherwise
-/es/docs/XSLT:when	/es/docs/Web/XSLT/when
-/es/docs/XSLT:with-param	/es/docs/Web/XSLT/with-param
+/es/docs/XSLT:fallback	/es/docs/Web/XSLT/Element/fallback
+/es/docs/XSLT:for-each	/es/docs/Web/XSLT/Element/for-each
+/es/docs/XSLT:if	/es/docs/Web/XSLT/Element/if
+/es/docs/XSLT:import	/es/docs/Web/XSLT/Element/import
+/es/docs/XSLT:include	/es/docs/Web/XSLT/Element/include
+/es/docs/XSLT:key	/es/docs/Web/XSLT/Element/key
+/es/docs/XSLT:message	/es/docs/Web/XSLT/Element/message
+/es/docs/XSLT:namespace-alias	/es/docs/Web/XSLT/Element/namespace-alias
+/es/docs/XSLT:number	/es/docs/Web/XSLT/Element/number
+/es/docs/XSLT:otherwise	/es/docs/Web/XSLT/Element/otherwise
+/es/docs/XSLT:when	/es/docs/Web/XSLT/Element/when
+/es/docs/XSLT:with-param	/es/docs/Web/XSLT/Element/with-param
+/es/docs/Zoom_a_página_completa	/es/docs/Mozilla/Firefox/Releases/3/Full_page_zoom
 /es/docs/controladores_protocolos_web	/es/docs/Web/API/Navigator/registerProtocolHandler/Web-based_protocol_handlers
 /es/docs/en	/en-US/
 /es/docs/firefox_Web_Developer_(externo)	https://addons.mozilla.org/firefox/60/
 /es/docs/lugares	/es/docs/Catálogo
 /es/docs/mozilla-central	/es/docs/Mozilla/Developer_guide/mozilla-central
+/es/docs/nsDirectoryService	/es/docs/orphaned/nsDirectoryService
 /es/docs/nsISupports:AddRef	/es/docs/nsISupports/AddRef
 /es/docs/nsISupports:QueryInterface	/es/docs/nsISupports/QueryInterface
 /es/docs/nsISupports:Release	/es/docs/nsISupports/Release
-/es/docs/video	/es/docs/Web/HTML/Elemento/video
+/es/docs/video	/es/docs/Web/HTML/Element/video
diff --git a/files/es/_wikihistory.json b/files/es/_wikihistory.json
index ed848eb960..c388d8a6cd 100644
--- a/files/es/_wikihistory.json
+++ b/files/es/_wikihistory.json
@@ -1,599 +1,4 @@
 {
-  "Acerca_del_Modelo_de_Objetos_del_Documento": {
-    "modified": "2019-03-24T00:02:47.149Z",
-    "contributors": [
-      "fscholz",
-      "Mgjbot",
-      "Nathymig",
-      "Jorolo"
-    ]
-  },
-  "Actualizar_aplicaciones_web_para_Firefox_3": {
-    "modified": "2019-03-23T23:58:06.668Z",
-    "contributors": [
-      "wbamberg",
-      "SphinxKnight",
-      "Sheppy",
-      "trada",
-      "manueljrs",
-      "flaviog",
-      "Rafavs",
-      "Marcomavil",
-      "Mgjbot"
-    ]
-  },
-  "Actualizar_extensiones_para_Firefox_3": {
-    "modified": "2019-03-23T23:58:10.215Z",
-    "contributors": [
-      "wbamberg",
-      "SphinxKnight",
-      "Pgulijczuk",
-      "deimidis",
-      "flaviog",
-      "Nukeador",
-      "Giovanisf13",
-      "Firewordy",
-      "Dfier",
-      "Rumont",
-      "Wrongloop",
-      "Mgjbot"
-    ]
-  },
-  "Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3": {
-    "modified": "2019-12-13T20:34:57.052Z",
-    "contributors": [
-      "wbamberg",
-      "lajaso",
-      "teoli",
-      "Sheppy",
-      "Pgulijczuk",
-      "deimidis",
-      "Nukeador",
-      "Ffranz",
-      "HenryGR"
-    ]
-  },
-  "Actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_Mozilla": {
-    "modified": "2019-01-16T14:53:56.551Z",
-    "contributors": [
-      "DoctorRomi",
-      "Superruzafa"
-    ]
-  },
-  "Applying_SVG_effects_to_HTML_content": {
-    "modified": "2019-03-24T00:09:04.196Z",
-    "contributors": [
-      "elPatox"
-    ]
-  },
-  "Añadir_lectores_de_canales_a_Firefox": {
-    "modified": "2019-03-23T23:54:31.423Z",
-    "contributors": [
-      "wbamberg",
-      "Mgjbot",
-      "RickieesES",
-      "Nukeador",
-      "Anyulled"
-    ]
-  },
-  "Añadir_motores_de_búsqueda_desde_páginas_web": {
-    "modified": "2019-01-16T15:27:59.157Z",
-    "contributors": [
-      "Mgjbot",
-      "Superruzafa",
-      "Lesmo sft",
-      "Nukeador"
-    ]
-  },
-  "Bugs_importantes_solucionados_en_Firefox_3": {
-    "modified": "2019-03-23T23:53:21.447Z",
-    "contributors": [
-      "wbamberg",
-      "Mgjbot",
-      "Nathymig",
-      "Nukeador",
-      "HenryGR",
-      "RickieesES",
-      "Ciberman osman"
-    ]
-  },
-  "Building_an_Extension": {
-    "modified": "2019-03-23T23:19:24.053Z",
-    "contributors": [
-      "martin.weingart",
-      "Josele89"
-    ]
-  },
-  "CSS/Media_queries": {
-    "modified": "2019-10-03T11:52:26.928Z",
-    "contributors": [
-      "danielblazquez",
-      "brunonra-dev",
-      "kitab15",
-      "Sebastianz",
-      "jsx",
-      "carlossuarez",
-      "mrstork",
-      "malayaleecoder",
-      "seeker8",
-      "Xaviju",
-      "sinfallas",
-      "maedca"
-    ]
-  },
-  "CSS/Using_CSS_gradients": {
-    "modified": "2019-06-03T20:30:31.836Z",
-    "contributors": [
-      "GasGen",
-      "undest",
-      "Sebastianz",
-      "Eneagrama"
-    ]
-  },
-  "CSS_dinámico": {
-    "modified": "2019-01-16T14:14:46.881Z",
-    "contributors": [
-      "RickieesES",
-      "Jorolo",
-      "Peperoni",
-      "Hande",
-      "Nukeador"
-    ]
-  },
-  "Cadenas_del_User_Agent_de_Gecko": {
-    "modified": "2019-03-23T23:45:27.069Z",
-    "contributors": [
-      "teoli",
-      "Orestesleal13022"
-    ]
-  },
-  "Code_snippets": {
-    "modified": "2019-01-16T13:52:37.564Z",
-    "contributors": [
-      "ffox"
-    ]
-  },
-  "Code_snippets/Pestañas_del_navegador": {
-    "modified": "2019-01-16T13:52:57.159Z",
-    "contributors": [
-      "ffox"
-    ]
-  },
-  "Columnas_con_CSS-3": {
-    "modified": "2019-03-23T23:43:23.940Z",
-    "contributors": [
-      "Mgjbot",
-      "Jorolo",
-      "Nukeador"
-    ]
-  },
-  "Compilar_e_instalar": {
-    "modified": "2019-03-23T23:58:55.256Z",
-    "contributors": [
-      "teoli",
-      "DoctorRomi",
-      "Mgjbot",
-      "Blank zero"
-    ]
-  },
-  "Configurar_correctamente_los_tipos_MIME_del_servidor": {
-    "modified": "2020-07-16T22:36:04.341Z",
-    "contributors": [
-      "Nukeador",
-      "Kroatan",
-      "Mtiscordio",
-      "Hostar",
-      "Iwa1",
-      "Markens",
-      "Brayan Habid"
-    ]
-  },
-  "Control_de_la_corrección_ortográfica_en_formularios_HTML": {
-    "modified": "2019-03-23T23:54:20.583Z",
-    "contributors": [
-      "raecillacastellana",
-      "vltamara",
-      "MxJ3susDi4z",
-      "teoli",
-      "Mgjbot",
-      "Jorolo",
-      "Omnisilver",
-      "Nukeador"
-    ]
-  },
-  "Creacion_de_plugins_OpenSearch_para_Firefox": {
-    "modified": "2019-03-24T00:00:08.096Z",
-    "contributors": [
-      "teoli",
-      "Etrigan",
-      "tbusca",
-      "Nukeador",
-      "Rodrigoknascimento",
-      "Citora",
-      "Mgjbot",
-      "Fenomeno"
-    ]
-  },
-  "Creación_de_Componentes_XPCOM/Interior_del_Componente": {
-    "modified": "2019-04-20T03:45:43.371Z",
-    "contributors": [
-      "wbamberg",
-      "Maharba"
-    ]
-  },
-  "Creación_de_Componentes_XPCOM/Prefacio": {
-    "modified": "2019-04-20T03:45:45.365Z",
-    "contributors": [
-      "wbamberg",
-      "Maharba"
-    ]
-  },
-  "Creando_una_extensión": {
-    "modified": "2019-03-24T00:13:16.401Z",
-    "contributors": [
-      "teoli",
-      "ethertank",
-      "Sheppy",
-      "athesto",
-      "StripTM",
-      "myfcr",
-      "DoctorRomi",
-      "Mgjbot",
-      "M4ur170",
-      "Nukeador",
-      "Wayner",
-      "El Hacker",
-      "Arcangelhak",
-      "Psanz",
-      "Victor-27-",
-      "Arteadonis",
-      "Gadolinio",
-      "Opevelyn",
-      "Verruckt",
-      "Spg2006",
-      "Gbulfon",
-      "Damien",
-      "Peperoni",
-      "CD77",
-      "Ordep",
-      "Indigo",
-      "Jp1",
-      "GMG",
-      "Ateneo",
-      "Doctormanfer",
-      "A Morenazo",
-      "Trace2x",
-      "Odo",
-      "Hatch",
-      "Jorolo",
-      "Lastjuan",
-      "Ulntux"
-    ]
-  },
-  "Crear_una_extensión_personalizada_de_Firefox_con_el_Mozilla_Build_System": {
-    "modified": "2019-04-26T15:53:18.603Z",
-    "contributors": [
-      "cantineoqueteveo",
-      "2stapps",
-      "teoli",
-      "DoctorRomi",
-      "Carok",
-      "Gustavo Ruiz",
-      "Nukeador",
-      "JuninhoBoy95",
-      "Kuriboh",
-      "Mgjbot",
-      "RickieesES",
-      "Geomorillo",
-      "Blank zero",
-      "Haelmx",
-      "Superruzafa"
-    ]
-  },
-  "DHTML": {
-    "modified": "2019-03-23T23:44:54.880Z",
-    "contributors": [
-      "Mgjbot",
-      "Jorolo",
-      "Jos"
-    ]
-  },
-  "DHTML_Demostraciones_del_uso_de_DOM_Style": {
-    "modified": "2019-01-16T16:07:51.712Z",
-    "contributors": [
-      "Mgjbot",
-      "Superruzafa",
-      "Trace2x",
-      "Fedora-core",
-      "Nukeador"
-    ]
-  },
-  "DOM": {
-    "modified": "2019-03-24T00:03:50.113Z",
-    "contributors": [
-      "ethertank",
-      "fscholz",
-      "Mgjbot",
-      "Nukeador",
-      "Jorolo",
-      "Takenbot",
-      "julionc",
-      "Versae"
-    ]
-  },
-  "DOM/Almacenamiento": {
-    "modified": "2019-03-24T00:11:21.014Z",
-    "contributors": [
-      "AshfaqHossain",
-      "StripTM",
-      "RickieesES",
-      "inma_610",
-      "Mgjbot",
-      "Superruzafa",
-      "Nukeador"
-    ]
-  },
-  "DOM/Manipulando_el_historial_del_navegador": {
-    "modified": "2019-09-07T17:44:48.428Z",
-    "contributors": [
-      "seaug",
-      "HerniHdez",
-      "AlePerez92",
-      "SphinxKnight",
-      "talo242",
-      "mauroc8",
-      "javiernunez",
-      "dongerardor",
-      "StripTM",
-      "Galsas",
-      "teoli",
-      "Izel",
-      "Sheppy",
-      "translatoon"
-    ]
-  },
-  "DOM/Manipulando_el_historial_del_navegador/Ejemplo": {
-    "modified": "2019-03-23T22:29:32.414Z",
-    "contributors": [
-      "maitret"
-    ]
-  },
-  "DOM/Touch_events": {
-    "modified": "2019-03-23T23:35:01.361Z",
-    "contributors": [
-      "wbamberg",
-      "wffranco",
-      "fscholz",
-      "teoli",
-      "Fjaguero",
-      "jvmjunior",
-      "maedca"
-    ]
-  },
-  "DOM/document.cookie": {
-    "modified": "2020-04-15T13:31:17.928Z",
-    "contributors": [
-      "atiliopereira",
-      "Skattspa",
-      "aralvarez",
-      "SphinxKnight",
-      "khalid32",
-      "Ogquir",
-      "strongville",
-      "Ciencia Al Poder",
-      "Markens",
-      "DR"
-    ]
-  },
-  "DOM_Inspector": {
-    "modified": "2020-07-16T22:36:24.191Z",
-    "contributors": [
-      "Mgjbot",
-      "Jorolo",
-      "Tatan",
-      "TETSUO"
-    ]
-  },
-  "Desarrollando_Mozilla": {
-    "modified": "2019-01-16T14:32:31.515Z",
-    "contributors": [
-      "another_sam",
-      "Mgjbot",
-      "Jorolo",
-      "Nukeador",
-      "Turin"
-    ]
-  },
-  "Desarrollo_Web": {
-    "modified": "2019-03-23T23:43:57.691Z",
-    "contributors": [
-      "Mgjbot",
-      "Jorolo"
-    ]
-  },
-  "Detectar_la_orientación_del_dispositivo": {
-    "modified": "2019-03-24T00:07:57.131Z",
-    "contributors": [
-      "inma_610"
-    ]
-  },
-  "Dibujando_Gráficos_con_Canvas": {
-    "modified": "2019-01-16T20:01:59.575Z",
-    "contributors": [
-      "Firegooploer"
-    ]
-  },
-  "Dibujar_texto_usando_canvas": {
-    "modified": "2019-01-16T15:31:41.845Z",
-    "contributors": [
-      "Mgjbot",
-      "HenryGR",
-      "Nukeador",
-      "RickieesES",
-      "Debianpc"
-    ]
-  },
-  "DragDrop": {
-    "modified": "2019-03-23T23:18:26.504Z",
-    "contributors": [
-      "drewp"
-    ]
-  },
-  "DragDrop/Drag_and_Drop": {
-    "modified": "2019-03-24T00:07:57.845Z",
-    "contributors": [
-      "ethertank",
-      "inma_610"
-    ]
-  },
-  "DragDrop/Drag_and_Drop/drag_and_drop_archivo": {
-    "modified": "2020-11-01T11:34:07.543Z",
-    "contributors": [
-      "juanrueda",
-      "davidpala.dev",
-      "brahAraya",
-      "ajuni880",
-      "israteneda",
-      "RVidalki",
-      "clarii",
-      "rgomez"
-    ]
-  },
-  "DragDrop/Recommended_Drag_Types": {
-    "modified": "2019-03-23T23:18:24.597Z",
-    "contributors": [
-      "Evinton"
-    ]
-  },
-  "Estructura_de_directorios_de_código_fuente_de_Mozilla": {
-    "modified": "2019-03-24T00:17:11.569Z",
-    "contributors": [
-      "ethertank",
-      "MiguelFRomeroR",
-      "Sheppy"
-    ]
-  },
-  "Etiquetas_audio_y_video_en_Firefox": {
-    "modified": "2019-03-23T23:59:36.294Z",
-    "contributors": [
-      "Nukeador",
-      "deimidis"
-    ]
-  },
-  "Extensiones/Actualización_de_extensiones_para_Firefox_4": {
-    "modified": "2019-03-24T00:05:58.390Z",
-    "contributors": [
-      "inma_610"
-    ]
-  },
-  "FAQ_Incrustando_Mozilla": {
-    "modified": "2019-01-16T16:20:13.874Z",
-    "contributors": [
-      "Lastjuan"
-    ]
-  },
-  "Firefox_1.5_para_Desarrolladores": {
-    "modified": "2019-03-23T23:47:34.365Z",
-    "contributors": [
-      "wbamberg",
-      "SphinxKnight",
-      "Rubenbae",
-      "Pachtonio",
-      "Sheppy",
-      "Mgjbot",
-      "Jorolo",
-      "Fedora-core",
-      "Nukeador",
-      "Takenbot",
-      "Willyaranda",
-      "Pasky",
-      "Angelr04",
-      "Epaclon"
-    ]
-  },
-  "Firefox_19_para_desarrolladores": {
-    "modified": "2019-03-18T20:54:04.568Z",
-    "contributors": [
-      "ulisestrujillo",
-      "wbamberg",
-      "Sebastianz",
-      "mannyatico"
-    ]
-  },
-  "Firefox_2_para_desarrolladores": {
-    "modified": "2019-03-23T23:58:56.168Z",
-    "contributors": [
-      "wbamberg",
-      "DoctorRomi",
-      "Markens",
-      "Mgjbot",
-      "Nukeador",
-      "Superruzafa",
-      "Guis",
-      "StripTM",
-      "Jorolo"
-    ]
-  },
-  "Firefox_3.5_para_desarrolladores": {
-    "modified": "2019-03-24T00:03:16.036Z",
-    "contributors": [
-      "wbamberg",
-      "ethertank",
-      "another_sam",
-      "deimidis",
-      "Nukeador"
-    ]
-  },
-  "Firefox_3_para_desarrolladores": {
-    "modified": "2019-03-24T00:04:08.312Z",
-    "contributors": [
-      "wbamberg",
-      "teoli",
-      "fscholz",
-      "Mgjbot",
-      "Nukeador",
-      "Surferosx",
-      "Nathymig",
-      "Dfier",
-      "Wrongloop",
-      "Garlock",
-      "Brahiam",
-      "Mariano",
-      "HenryGR",
-      "Jseldon"
-    ]
-  },
-  "Firefox_addons_developer_guide/Introduction_to_Extensions": {
-    "modified": "2019-03-23T23:37:41.632Z",
-    "contributors": [
-      "pacommozilla",
-      "AgustinAlvia"
-    ]
-  },
-  "Firefox_addons_developer_guide/Technologies_used_in_developing_extensions": {
-    "modified": "2019-03-18T21:16:06.336Z",
-    "contributors": [
-      "AgustinAlvia"
-    ]
-  },
-  "Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio": {
-    "modified": "2019-01-16T14:22:48.165Z",
-    "contributors": [
-      "inma_610"
-    ]
-  },
-  "Fragmentos_de_código": {
-    "modified": "2019-01-16T13:52:44.049Z",
-    "contributors": [
-      "ffox"
-    ]
-  },
-  "Funciones": {
-    "modified": "2019-01-16T16:18:04.260Z",
-    "contributors": [
-      "Jorolo"
-    ]
-  },
   "Games": {
     "modified": "2019-09-09T15:31:15.455Z",
     "contributors": [
@@ -614,38 +19,6 @@
       "cnaucler"
     ]
   },
-  "Games/Herramients": {
-    "modified": "2019-01-16T19:29:51.696Z",
-    "contributors": [
-      "wbamberg",
-      "atlas7jean"
-    ]
-  },
-  "Games/Herramients/asm.js": {
-    "modified": "2019-03-18T21:21:31.919Z",
-    "contributors": [
-      "WilsonIsAliveClone",
-      "serarroy"
-    ]
-  },
-  "Games/Introduccion": {
-    "modified": "2020-11-28T21:23:49.961Z",
-    "contributors": [
-      "rayrojas",
-      "titox",
-      "gauchoscript",
-      "wbamberg",
-      "Mancux2",
-      "Albizures",
-      "atlas7jean"
-    ]
-  },
-  "Games/Introducción_al_desarrollo_de_juegos_HTML5_(resumen)": {
-    "modified": "2019-08-05T12:49:59.324Z",
-    "contributors": [
-      "WilsonIsAliveClone"
-    ]
-  },
   "Games/Publishing_games": {
     "modified": "2019-03-18T21:22:03.542Z",
     "contributors": [
@@ -663,14 +36,6 @@
       "carlosgocereceda"
     ]
   },
-  "Games/Publishing_games/Monetización_de_los_juegos": {
-    "modified": "2019-03-18T21:22:04.540Z",
-    "contributors": [
-      "mikelmg",
-      "carlosgocereceda",
-      "WilsonIsAliveClone"
-    ]
-  },
   "Games/Techniques": {
     "modified": "2019-01-17T02:01:32.309Z",
     "contributors": [
@@ -712,14 +77,6 @@
       "serarroy"
     ]
   },
-  "Games/Tutorials/2D_breakout_game_Phaser/Botones": {
-    "modified": "2019-11-03T00:22:01.318Z",
-    "contributors": [
-      "AdryDev92",
-      "carlosgocereceda",
-      "serarroy"
-    ]
-  },
   "Games/Tutorials/2D_breakout_game_Phaser/Collision_detection": {
     "modified": "2019-03-18T21:21:35.455Z",
     "contributors": [
@@ -757,12 +114,6 @@
       "serarroy"
     ]
   },
-  "Games/Tutorials/2D_breakout_game_Phaser/Rebotar_en_las_paredes": {
-    "modified": "2019-03-18T21:18:55.239Z",
-    "contributors": [
-      "WilsonIsAliveClone"
-    ]
-  },
   "Games/Tutorials/2D_breakout_game_Phaser/Scaling": {
     "modified": "2019-01-17T02:28:53.459Z",
     "contributors": [
@@ -786,118 +137,6 @@
       "serarroy"
     ]
   },
-  "Games/Workflows": {
-    "modified": "2019-01-16T19:25:39.809Z",
-    "contributors": [
-      "wbamberg",
-      "groovecoder"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro": {
-    "modified": "2019-03-23T22:19:39.385Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor",
-      "emolinerom",
-      "jolosan"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls": {
-    "modified": "2019-03-23T22:19:43.884Z",
-    "contributors": [
-      "wbamberg",
-      "regisdark",
-      "profesooooor",
-      "emolinerom"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques": {
-    "modified": "2019-01-17T00:34:48.662Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor",
-      "emolinerom"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado": {
-    "modified": "2019-01-17T00:34:24.542Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor",
-      "emolinerom"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton": {
-    "modified": "2019-01-17T00:34:40.600Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor",
-      "emolinerom"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it": {
-    "modified": "2019-01-17T00:33:08.752Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor",
-      "jolosan"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones": {
-    "modified": "2019-03-18T20:48:38.662Z",
-    "contributors": [
-      "juanedsa",
-      "wbamberg",
-      "profesooooor",
-      "emolinerom"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego": {
-    "modified": "2019-03-23T22:17:05.460Z",
-    "contributors": [
-      "wbamberg",
-      "regisdark",
-      "profesooooor",
-      "jolosan"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola": {
-    "modified": "2019-03-23T22:19:10.641Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor",
-      "jolosan",
-      "emolinerom"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando": {
-    "modified": "2019-01-17T01:08:54.537Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor"
-    ]
-  },
-  "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win": {
-    "modified": "2019-01-17T01:08:23.453Z",
-    "contributors": [
-      "wbamberg",
-      "profesooooor"
-    ]
-  },
-  "Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation": {
-    "modified": "2019-03-23T23:11:29.148Z",
-    "contributors": [
-      "wbamberg",
-      "lauttttaro",
-      "chebit"
-    ]
-  },
-  "Generación_de_GUIDs": {
-    "modified": "2019-03-24T00:06:07.388Z",
-    "contributors": [
-      "ibnkhaldun"
-    ]
-  },
   "Glossary": {
     "modified": "2020-10-07T11:08:11.871Z",
     "contributors": [
@@ -992,12 +231,6 @@
       "ekros"
     ]
   },
-  "Glossary/Algoritmo": {
-    "modified": "2019-01-17T00:09:54.063Z",
-    "contributors": [
-      "ekros"
-    ]
-  },
   "Glossary/Apple_Safari": {
     "modified": "2020-08-30T09:41:20.026Z",
     "contributors": [
@@ -1005,12 +238,6 @@
       "ekros"
     ]
   },
-  "Glossary/Argumento": {
-    "modified": "2019-03-23T22:15:34.303Z",
-    "contributors": [
-      "gparra989"
-    ]
-  },
   "Glossary/Arpanet": {
     "modified": "2020-03-15T22:50:09.715Z",
     "contributors": [
@@ -1018,42 +245,6 @@
       "gparra989"
     ]
   },
-  "Glossary/Arquitectura_de_la_información": {
-    "modified": "2020-09-06T16:32:32.362Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Glossary/Arreglos": {
-    "modified": "2020-05-28T13:51:10.546Z",
-    "contributors": [
-      "fedoroffs",
-      "BubuAnabelas",
-      "Davids-Devel",
-      "Daniel_Martin",
-      "gparra989"
-    ]
-  },
-  "Glossary/Asíncrono": {
-    "modified": "2020-05-04T10:40:03.360Z",
-    "contributors": [
-      "jorgeCaster",
-      "fjluengo",
-      "gparra989"
-    ]
-  },
-  "Glossary/Atributo": {
-    "modified": "2019-03-23T22:15:46.319Z",
-    "contributors": [
-      "gparra989"
-    ]
-  },
-  "Glossary/Atributo_global": {
-    "modified": "2019-03-18T21:19:21.658Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
   "Glossary/Bandwidth": {
     "modified": "2019-03-23T22:15:45.908Z",
     "contributors": [
@@ -1118,13 +309,6 @@
       "quirinolemanches"
     ]
   },
-  "Glossary/CID": {
-    "modified": "2019-03-18T21:19:22.724Z",
-    "contributors": [
-      "PabloDeTorre",
-      "sergiomgm"
-    ]
-  },
   "Glossary/CRUD": {
     "modified": "2019-03-23T22:03:05.724Z",
     "contributors": [
@@ -1149,18 +333,6 @@
       "memotronix"
     ]
   },
-  "Glossary/Cabecera_general": {
-    "modified": "2019-03-18T21:34:28.155Z",
-    "contributors": [
-      "Watermelonnable"
-    ]
-  },
-  "Glossary/Caché": {
-    "modified": "2019-03-18T21:19:00.217Z",
-    "contributors": [
-      "diegorhs"
-    ]
-  },
   "Glossary/Callback_function": {
     "modified": "2019-04-22T16:14:36.669Z",
     "contributors": [
@@ -1176,31 +348,12 @@
       "jorgeluispedro16"
     ]
   },
-  "Glossary/Caracter": {
-    "modified": "2020-08-23T05:27:25.056Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
   "Glossary/Chrome": {
     "modified": "2019-03-18T21:42:29.056Z",
     "contributors": [
       "amirtorrez"
     ]
   },
-  "Glossary/Cifrado": {
-    "modified": "2019-03-18T21:19:02.237Z",
-    "contributors": [
-      "PabloDeTorre",
-      "sergiomgm"
-    ]
-  },
-  "Glossary/Clasificación_por_tarjetas_(card_sorting)": {
-    "modified": "2019-03-18T21:19:20.709Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
   "Glossary/Class": {
     "modified": "2019-03-18T21:18:45.753Z",
     "contributors": [
@@ -1208,20 +361,6 @@
       "carlosCharlie"
     ]
   },
-  "Glossary/Clausura": {
-    "modified": "2020-08-12T18:07:27.330Z",
-    "contributors": [
-      "l1oret"
-    ]
-  },
-  "Glossary/Clave": {
-    "modified": "2020-02-18T06:49:22.148Z",
-    "contributors": [
-      "joseluisq",
-      "sergiomgm",
-      "GCF7"
-    ]
-  },
   "Glossary/Codec": {
     "modified": "2019-03-18T21:19:01.793Z",
     "contributors": [
@@ -1241,12 +380,6 @@
       "israel-munoz"
     ]
   },
-  "Glossary/Constante": {
-    "modified": "2019-03-18T21:19:15.794Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
   "Glossary/Constructor": {
     "modified": "2019-03-23T22:15:36.356Z",
     "contributors": [
@@ -1266,19 +399,6 @@
       "ferlopezcarr"
     ]
   },
-  "Glossary/Criptoanálisis": {
-    "modified": "2019-03-18T21:18:36.783Z",
-    "contributors": [
-      "sergiomgm",
-      "GCF7"
-    ]
-  },
-  "Glossary/Criptografía": {
-    "modified": "2019-03-23T22:02:58.447Z",
-    "contributors": [
-      "velizluisma"
-    ]
-  },
   "Glossary/Cross-site_scripting": {
     "modified": "2020-04-13T08:31:08.536Z",
     "contributors": [
@@ -1296,19 +416,6 @@
       "HerberWest"
     ]
   },
-  "Glossary/DTD": {
-    "modified": "2019-01-17T00:20:06.485Z",
-    "contributors": [
-      "wilfridoSantos"
-    ]
-  },
-  "Glossary/Descifrado": {
-    "modified": "2019-03-18T21:19:11.476Z",
-    "contributors": [
-      "sergiomgm",
-      "GCF7"
-    ]
-  },
   "Glossary/Doctype": {
     "modified": "2019-03-23T22:07:28.155Z",
     "contributors": [
@@ -1356,32 +463,6 @@
       "PabloDeTorre"
     ]
   },
-  "Glossary/Encriptación": {
-    "modified": "2019-03-18T21:19:07.209Z",
-    "contributors": [
-      "PabloDeTorre",
-      "carlosCharlie",
-      "sergiomgm"
-    ]
-  },
-  "Glossary/Entidad": {
-    "modified": "2020-07-08T14:34:06.256Z",
-    "contributors": [
-      "lucasreta"
-    ]
-  },
-  "Glossary/Espacio_en_blanco": {
-    "modified": "2020-08-24T04:59:10.953Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Glossary/Estructura_de_datos": {
-    "modified": "2019-03-18T21:24:31.453Z",
-    "contributors": [
-      "edsonv"
-    ]
-  },
   "Glossary/FPS": {
     "modified": "2020-08-19T14:42:01.823Z",
     "contributors": [
@@ -1414,20 +495,6 @@
       "ericksonespejo"
     ]
   },
-  "Glossary/Funcion_de_primera_clase": {
-    "modified": "2020-05-14T19:36:29.513Z",
-    "contributors": [
-      "l1oret",
-      "hmorv",
-      "LaloHao"
-    ]
-  },
-  "Glossary/Función": {
-    "modified": "2019-03-18T21:19:19.995Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
   "Glossary/GPL": {
     "modified": "2019-03-18T21:43:50.897Z",
     "contributors": [
@@ -1511,12 +578,6 @@
       "Maose"
     ]
   },
-  "Glossary/Hilo_principal": {
-    "modified": "2020-03-12T06:05:36.693Z",
-    "contributors": [
-      "elimperiodelaweb"
-    ]
-  },
   "Glossary/Hoisting": {
     "modified": "2019-05-15T21:40:52.256Z",
     "contributors": [
@@ -1583,30 +644,12 @@
       "Maose"
     ]
   },
-  "Glossary/IU": {
-    "modified": "2019-03-18T21:18:49.573Z",
-    "contributors": [
-      "diegorhs"
-    ]
-  },
-  "Glossary/Identificador": {
-    "modified": "2020-08-28T17:30:13.071Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
   "Glossary/IndexedDB": {
     "modified": "2019-03-23T22:36:07.366Z",
     "contributors": [
       "Loque"
     ]
   },
-  "Glossary/Inmutable": {
-    "modified": "2019-03-18T21:19:12.385Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
   "Glossary/Internet": {
     "modified": "2020-04-27T00:09:14.977Z",
     "contributors": [
@@ -1667,12 +710,6 @@
       "IsaacAlvrt"
     ]
   },
-  "Glossary/Metadato": {
-    "modified": "2019-03-18T21:19:04.572Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
   "Glossary/MitM": {
     "modified": "2019-03-18T21:25:35.556Z",
     "contributors": [
@@ -1699,13 +736,6 @@
       "BrodaNoel"
     ]
   },
-  "Glossary/Método": {
-    "modified": "2020-07-21T21:37:11.109Z",
-    "contributors": [
-      "Assael02",
-      "Davids-Devel"
-    ]
-  },
   "Glossary/Node": {
     "modified": "2019-05-17T13:24:16.608Z",
     "contributors": [
@@ -1729,31 +759,12 @@
       "malonson"
     ]
   },
-  "Glossary/Nombre_de_dominio": {
-    "modified": "2019-03-18T21:19:21.120Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
-  "Glossary/Nombre_de_encabezado_prohibido": {
-    "modified": "2019-03-23T22:02:11.147Z",
-    "contributors": [
-      "Luiggy",
-      "tonialfaro"
-    ]
-  },
   "Glossary/Null": {
     "modified": "2019-03-23T22:58:02.167Z",
     "contributors": [
       "Cleon"
     ]
   },
-  "Glossary/Numero": {
-    "modified": "2019-03-23T22:58:03.851Z",
-    "contributors": [
-      "Cleon"
-    ]
-  },
   "Glossary/OOP": {
     "modified": "2019-03-18T21:19:20.278Z",
     "contributors": [
@@ -1761,24 +772,6 @@
       "carlosCharlie"
     ]
   },
-  "Glossary/Objecto": {
-    "modified": "2019-03-23T22:58:05.221Z",
-    "contributors": [
-      "Cleon"
-    ]
-  },
-  "Glossary/Operador": {
-    "modified": "2019-03-23T22:53:20.989Z",
-    "contributors": [
-      "germanfr"
-    ]
-  },
-  "Glossary/Operando": {
-    "modified": "2020-09-05T17:33:42.415Z",
-    "contributors": [
-      "brayan-orellanos"
-    ]
-  },
   "Glossary/PHP": {
     "modified": "2020-05-07T14:37:16.100Z",
     "contributors": [
@@ -1797,12 +790,6 @@
       "StripTM"
     ]
   },
-  "Glossary/Pila_llamadas": {
-    "modified": "2020-04-26T12:00:35.332Z",
-    "contributors": [
-      "l1oret"
-    ]
-  },
   "Glossary/Polyfill": {
     "modified": "2019-03-18T21:24:24.118Z",
     "contributors": [
@@ -1816,28 +803,6 @@
       "malonson"
     ]
   },
-  "Glossary/Preflight_peticion": {
-    "modified": "2019-03-18T21:29:47.773Z",
-    "contributors": [
-      "daviddelamo"
-    ]
-  },
-  "Glossary/Preprocesador_CSS": {
-    "modified": "2019-03-23T22:02:54.782Z",
-    "contributors": [
-      "ealch",
-      "velizluisma"
-    ]
-  },
-  "Glossary/Primitivo": {
-    "modified": "2020-09-17T22:06:17.504Z",
-    "contributors": [
-      "Nachec",
-      "cocososo",
-      "abaracedo",
-      "Cleon"
-    ]
-  },
   "Glossary/Progressive_Enhancement": {
     "modified": "2019-07-07T08:35:50.920Z",
     "contributors": [
@@ -1874,18 +839,6 @@
       "paolazaratem"
     ]
   },
-  "Glossary/Pseudo-clase": {
-    "modified": "2019-03-23T22:38:49.143Z",
-    "contributors": [
-      "VictorAbdon"
-    ]
-  },
-  "Glossary/Pseudocódigo": {
-    "modified": "2019-03-18T21:19:15.497Z",
-    "contributors": [
-      "PabloDeTorre"
-    ]
-  },
   "Glossary/Public-key_cryptography": {
     "modified": "2019-03-18T21:18:41.396Z",
     "contributors": [
@@ -1918,13 +871,6 @@
       "ferlopezcarr"
     ]
   },
-  "Glossary/Recursión": {
-    "modified": "2019-03-18T21:19:02.064Z",
-    "contributors": [
-      "PabloDeTorre",
-      "sergiomgm"
-    ]
-  },
   "Glossary/Reflow": {
     "modified": "2020-11-16T21:27:00.470Z",
     "contributors": [
@@ -1950,13 +896,6 @@
       "diegorhs"
     ]
   },
-  "Glossary/SCV": {
-    "modified": "2019-03-18T21:19:21.440Z",
-    "contributors": [
-      "carlosCharlie",
-      "sergiomgm"
-    ]
-  },
   "Glossary/SEO": {
     "modified": "2019-03-23T22:38:01.994Z",
     "contributors": [
@@ -2019,25 +958,6 @@
       "Angel10050"
     ]
   },
-  "Glossary/Sentencias": {
-    "modified": "2019-03-23T22:57:58.260Z",
-    "contributors": [
-      "abaracedo",
-      "Cleon"
-    ]
-  },
-  "Glossary/Sincronico": {
-    "modified": "2020-11-14T06:15:42.366Z",
-    "contributors": [
-      "Yuunichi"
-    ]
-  },
-  "Glossary/Sistema_gestion_contenidos": {
-    "modified": "2020-05-23T07:15:12.062Z",
-    "contributors": [
-      "l1oret"
-    ]
-  },
   "Glossary/Sloppy_mode": {
     "modified": "2020-08-31T05:32:49.321Z",
     "contributors": [
@@ -2085,38 +1005,12 @@
       "DaniNz"
     ]
   },
-  "Glossary/TextoCifrado": {
-    "modified": "2019-03-18T21:19:21.003Z",
-    "contributors": [
-      "sergiomgm",
-      "GCF7"
-    ]
-  },
-  "Glossary/TextoSimple": {
-    "modified": "2019-03-18T21:19:20.138Z",
-    "contributors": [
-      "sergiomgm",
-      "GCF7"
-    ]
-  },
   "Glossary/Three_js": {
     "modified": "2020-11-09T17:44:33.436Z",
     "contributors": [
       "Plumas"
     ]
   },
-  "Glossary/Tipado_dinámico": {
-    "modified": "2020-05-04T14:10:14.107Z",
-    "contributors": [
-      "Caav98"
-    ]
-  },
-  "Glossary/Tipificación_estática": {
-    "modified": "2019-11-22T03:17:09.186Z",
-    "contributors": [
-      "HugolJumex"
-    ]
-  },
   "Glossary/Truthy": {
     "modified": "2019-03-18T21:45:50.903Z",
     "contributors": [
@@ -2165,20 +1059,6 @@
       "Nachec"
     ]
   },
-  "Glossary/Validador": {
-    "modified": "2019-03-18T21:19:01.934Z",
-    "contributors": [
-      "PabloDeTorre",
-      "carlosCharlie",
-      "sergiomgm"
-    ]
-  },
-  "Glossary/Valor": {
-    "modified": "2020-09-01T08:20:32.500Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
   "Glossary/Variable": {
     "modified": "2020-09-01T08:00:19.523Z",
     "contributors": [
@@ -2246,12 +1126,6 @@
       "carlosCharlie"
     ]
   },
-  "Glossary/XForm": {
-    "modified": "2019-03-23T22:15:44.959Z",
-    "contributors": [
-      "gparra989"
-    ]
-  },
   "Glossary/XML": {
     "modified": "2019-03-18T21:43:43.021Z",
     "contributors": [
@@ -2283,31 +1157,12 @@
       "carlosCharlie"
     ]
   },
-  "Glossary/coercion": {
-    "modified": "2020-02-29T16:57:08.213Z",
-    "contributors": [
-      "frankynztein"
-    ]
-  },
   "Glossary/compile_time": {
     "modified": "2020-12-05T08:34:39.507Z",
     "contributors": [
       "StripTM"
     ]
   },
-  "Glossary/conjunto_de_caracteres": {
-    "modified": "2020-08-28T18:09:05.836Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Glossary/elemento": {
-    "modified": "2019-01-16T19:38:18.287Z",
-    "contributors": [
-      "BubuAnabelas",
-      "HerberWest"
-    ]
-  },
   "Glossary/event": {
     "modified": "2019-03-18T21:19:03.177Z",
     "contributors": [
@@ -2341,24 +1196,6 @@
       "gparra989"
     ]
   },
-  "Glossary/miga-de-pan": {
-    "modified": "2020-02-02T10:51:21.098Z",
-    "contributors": [
-      "blanchart"
-    ]
-  },
-  "Glossary/propiedad": {
-    "modified": "2020-08-28T18:32:40.804Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Glossary/seguro": {
-    "modified": "2019-03-18T21:18:23.904Z",
-    "contributors": [
-      "SackmannDV"
-    ]
-  },
   "Glossary/undefined": {
     "modified": "2019-03-23T22:58:03.590Z",
     "contributors": [
@@ -2366,176 +1203,6 @@
       "Cleon"
     ]
   },
-  "Guía_para_el_desarrollador_de_agregados_para_Firefox": {
-    "modified": "2019-01-16T14:29:03.747Z",
-    "contributors": [
-      "teoli",
-      "Sheppy",
-      "Eloy"
-    ]
-  },
-  "Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones": {
-    "modified": "2019-03-24T00:04:44.724Z",
-    "contributors": [
-      "christopherccg",
-      "Sheppy",
-      "Eloy"
-    ]
-  },
-  "Guía_para_la_migración_a_catálogo": {
-    "modified": "2019-01-16T15:34:19.890Z",
-    "contributors": [
-      "HenryGR",
-      "Mgjbot"
-    ]
-  },
-  "HTML/Elemento/datalist": {
-    "modified": "2019-01-16T19:13:20.868Z",
-    "contributors": [
-      "Darkgyro",
-      "teoli"
-    ]
-  },
-  "HTML/Elemento/form": {
-    "modified": "2019-01-16T21:24:44.882Z",
-    "contributors": [
-      "eincioch"
-    ]
-  },
-  "HTML/Elemento/section": {
-    "modified": "2019-03-23T23:08:59.333Z",
-    "contributors": [
-      "Raulpascual2",
-      "carllewisc",
-      "GeorgeAviateur"
-    ]
-  },
-  "HTML/HTML5": {
-    "modified": "2020-05-16T09:08:08.720Z",
-    "contributors": [
-      "jonasdamher",
-      "SphinxKnight",
-      "anibalymariacantantes60",
-      "AzulMartin",
-      "264531666",
-      "fracp",
-      "damianed",
-      "alfredotemiquel",
-      "rossettistone",
-      "carlossuarez",
-      "teoli",
-      "JosueMolina",
-      "Pablo_Ivan",
-      "welm",
-      "bicentenario",
-      "jesusruiz",
-      "pierre_alfonso",
-      "pitufo_cabron",
-      "cesar_ortiz_elPatox",
-      "inma_610",
-      "vigia122",
-      "StripTM",
-      "deimidis",
-      "Izel"
-    ]
-  },
-  "HTML/HTML5/Forms_in_HTML5": {
-    "modified": "2019-03-24T00:17:58.788Z",
-    "contributors": [
-      "DGarCam",
-      "teoli",
-      "prieto.any",
-      "deibyod",
-      "Ces",
-      "hugohabel",
-      "deimidis"
-    ]
-  },
-  "HTML/HTML5/Formularios_en_HTML5": {
-    "modified": "2019-03-24T00:07:51.068Z",
-    "contributors": [
-      "inma_610",
-      "Izel",
-      "StripTM",
-      "deimidis"
-    ]
-  },
-  "HTML/HTML5/HTML5_Parser": {
-    "modified": "2019-03-24T00:07:09.448Z",
-    "contributors": [
-      "teoli",
-      "RickieesES",
-      "inma_610",
-      "StripTM",
-      "juanb",
-      "Izel"
-    ]
-  },
-  "HTML/HTML5/HTML5_lista_elementos": {
-    "modified": "2020-01-21T22:36:54.135Z",
-    "contributors": [
-      "losfroger",
-      "cocoletzimata",
-      "Duque61",
-      "raecillacastellana",
-      "maymaury",
-      "squidjam",
-      "on3_g"
-    ]
-  },
-  "HTML/HTML5/Introducción_a_HTML5": {
-    "modified": "2019-03-24T00:05:36.058Z",
-    "contributors": [
-      "teoli",
-      "inma_610"
-    ]
-  },
-  "HTML/HTML5/Validacion_de_restricciones": {
-    "modified": "2020-08-11T08:06:04.309Z",
-    "contributors": [
-      "gerardo750711",
-      "israel-munoz"
-    ]
-  },
-  "Herramientas": {
-    "modified": "2019-01-16T13:52:37.109Z",
-    "contributors": [
-      "teoli",
-      "StripTM",
-      "inma_610",
-      "camilourd"
-    ]
-  },
-  "How_to_create_a_DOM_tree": {
-    "modified": "2019-03-23T23:22:26.711Z",
-    "contributors": [
-      "carrillog.luis"
-    ]
-  },
-  "Incrustando_Mozilla/Comunidad": {
-    "modified": "2019-03-23T22:39:14.279Z",
-    "contributors": [
-      "vamm1981"
-    ]
-  },
-  "IndexedDB": {
-    "modified": "2019-03-18T21:11:08.379Z",
-    "contributors": [
-      "duduindo",
-      "teoli",
-      "semptrion",
-      "CHORVAT",
-      "inma_610"
-    ]
-  },
-  "Instalación_de_motores_de_búsqueda_desde_páginas_web": {
-    "modified": "2019-01-16T16:13:53.798Z",
-    "contributors": [
-      "teoli",
-      "Nukeador",
-      "Jorolo"
-    ]
-  },
   "Learn": {
     "modified": "2020-10-06T09:14:51.258Z",
     "contributors": [
@@ -2604,18 +1271,6 @@
       "mikelmg"
     ]
   },
-  "Learn/Accessibility/Qué_es_la_accesibilidad": {
-    "modified": "2020-07-16T22:40:03.734Z",
-    "contributors": [
-      "editorUOC"
-    ]
-  },
-  "Learn/Aprender_y_obtener_ayuda": {
-    "modified": "2020-09-02T21:15:54.167Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
   "Learn/CSS": {
     "modified": "2020-07-16T22:25:33.047Z",
     "contributors": [
@@ -2640,101 +1295,6 @@
       "chrisdavidmills"
     ]
   },
-  "Learn/CSS/Building_blocks/Cascada_y_herencia": {
-    "modified": "2020-09-10T08:32:11.848Z",
-    "contributors": [
-      "renatico",
-      "UOCccorcoles",
-      "Enesimus",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Contenido_desbordado": {
-    "modified": "2020-09-07T07:36:40.422Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Depurar_el_CSS": {
-    "modified": "2020-10-15T22:26:23.448Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS": {
-    "modified": "2020-07-16T22:29:20.704Z",
-    "contributors": [
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/El_modelo_de_caja": {
-    "modified": "2020-09-06T15:07:38.107Z",
-    "contributors": [
-      "UOCccorcoles",
-      "capitanzealot",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Fondos_y_bordes": {
-    "modified": "2020-09-06T17:26:53.330Z",
-    "contributors": [
-      "UOCccorcoles",
-      "psotresc",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Imágenes_medios_y_elementos_de_formulario": {
-    "modified": "2020-07-16T22:29:24.707Z",
-    "contributors": [
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Manejando_diferentes_direcciones_de_texto": {
-    "modified": "2020-07-31T14:48:40.359Z",
-    "contributors": [
-      "AndrewSKV",
-      "Enesimus"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Selectores_CSS": {
-    "modified": "2020-09-06T12:41:53.412Z",
-    "contributors": [
-      "UOCccorcoles",
-      "VichoReyes",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Selectores_CSS/Combinadores": {
-    "modified": "2020-09-06T14:09:26.839Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos": {
-    "modified": "2020-09-06T13:58:30.411Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos": {
-    "modified": "2020-09-06T13:34:27.599Z",
-    "contributors": [
-      "UOCccorcoles",
-      "psotresc",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID": {
-    "modified": "2020-09-06T13:13:47.580Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
   "Learn/CSS/Building_blocks/Styling_tables": {
     "modified": "2020-09-14T09:45:44.143Z",
     "contributors": [
@@ -2746,13 +1306,6 @@
       "IXTRUnai"
     ]
   },
-  "Learn/CSS/Building_blocks/Valores_y_unidades_CSS": {
-    "modified": "2020-09-07T09:35:00.652Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
   "Learn/CSS/CSS_layout": {
     "modified": "2020-07-31T15:01:33.453Z",
     "contributors": [
@@ -2762,12 +1315,6 @@
       "chrisdavidmills"
     ]
   },
-  "Learn/CSS/CSS_layout/Diseño_receptivo": {
-    "modified": "2020-07-16T22:27:27.257Z",
-    "contributors": [
-      "editorUOC"
-    ]
-  },
   "Learn/CSS/CSS_layout/Flexbox": {
     "modified": "2020-09-15T16:36:01.723Z",
     "contributors": [
@@ -2789,12 +1336,6 @@
       "chrisdavidmills"
     ]
   },
-  "Learn/CSS/CSS_layout/Flujo_normal": {
-    "modified": "2020-07-16T22:27:20.728Z",
-    "contributors": [
-      "editorUOC"
-    ]
-  },
   "Learn/CSS/CSS_layout/Grids": {
     "modified": "2020-07-16T22:26:58.625Z",
     "contributors": [
@@ -2803,27 +1344,12 @@
       "Luis_Calvo"
     ]
   },
-  "Learn/CSS/CSS_layout/Introducción": {
-    "modified": "2020-09-15T13:39:37.384Z",
-    "contributors": [
-      "UOCccorcoles",
-      "AndrewSKV",
-      "editorUOC",
-      "Jhonaz"
-    ]
-  },
   "Learn/CSS/CSS_layout/Positioning": {
     "modified": "2020-07-16T22:26:42.380Z",
     "contributors": [
       "fr3dth"
     ]
   },
-  "Learn/CSS/CSS_layout/Soporte_a_navegadores_antiguos": {
-    "modified": "2020-07-16T22:27:17.501Z",
-    "contributors": [
-      "editorUOC"
-    ]
-  },
   "Learn/CSS/First_steps": {
     "modified": "2020-07-16T22:27:38.921Z",
     "contributors": [
@@ -2834,54 +1360,6 @@
       "jesquintero"
     ]
   },
-  "Learn/CSS/First_steps/Comenzando_CSS": {
-    "modified": "2020-08-31T14:16:45.193Z",
-    "contributors": [
-      "UOCccorcoles",
-      "AndrewSKV",
-      "tito-ramirez",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/First_steps/Como_funciona_CSS": {
-    "modified": "2020-09-18T07:47:46.630Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/First_steps/Como_se_estructura_CSS": {
-    "modified": "2020-08-31T16:55:37.346Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/First_steps/Qué_es_CSS": {
-    "modified": "2020-10-15T22:25:30.119Z",
-    "contributors": [
-      "UOCccorcoles",
-      "Enesimus",
-      "editorUOC"
-    ]
-  },
-  "Learn/CSS/First_steps/Usa_tu_nuevo_conocimiento": {
-    "modified": "2020-08-23T19:45:30.596Z",
-    "contributors": [
-      "capitanzealot",
-      "AndrewSKV",
-      "Enesimus"
-    ]
-  },
-  "Learn/CSS/Introduction_to_CSS/Fundamental_CSS_comprehension": {
-    "modified": "2020-07-16T22:28:11.693Z",
-    "contributors": [
-      "Creasick",
-      "Enesimus",
-      "javierpolit",
-      "DennisM"
-    ]
-  },
   "Learn/CSS/Styling_text": {
     "modified": "2020-07-16T22:25:57.799Z",
     "contributors": [
@@ -2889,13 +1367,6 @@
       "wilton-cruz"
     ]
   },
-  "Learn/CSS/Styling_text/Fuentes_web": {
-    "modified": "2020-09-01T07:26:18.054Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
   "Learn/CSS/Styling_text/Fundamentals": {
     "modified": "2020-09-18T08:01:18.738Z",
     "contributors": [
@@ -2924,21 +1395,6 @@
       "jmcavanzo"
     ]
   },
-  "Learn/CSS/Sábercomo": {
-    "modified": "2020-07-16T22:25:42.139Z",
-    "contributors": [
-      "alebarbaja",
-      "abestrad1"
-    ]
-  },
-  "Learn/CSS/Sábercomo/Generated_content": {
-    "modified": "2020-07-16T22:25:47.515Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Juansereina",
-      "lavilofam1"
-    ]
-  },
   "Learn/Common_questions": {
     "modified": "2020-07-16T22:35:23.102Z",
     "contributors": [
@@ -2950,12 +1406,6 @@
       "chrisdavidmills"
     ]
   },
-  "Learn/Common_questions/Cuanto_cuesta": {
-    "modified": "2020-07-16T22:35:45.385Z",
-    "contributors": [
-      "Beatriz_Ortega_Valdes"
-    ]
-  },
   "Learn/Common_questions/How_does_the_Internet_work": {
     "modified": "2020-09-07T00:56:10.834Z",
     "contributors": [
@@ -2977,31 +1427,6 @@
       "DaniNz"
     ]
   },
-  "Learn/Common_questions/Que_es_un_servidor_WEB": {
-    "modified": "2020-10-27T18:34:43.608Z",
-    "contributors": [
-      "noksenberg",
-      "Yel-Martinez-Consultor-Seo",
-      "Spectrum369",
-      "Luisk955",
-      "Sebaspaco",
-      "flaki53",
-      "welm"
-    ]
-  },
-  "Learn/Common_questions/Que_software_necesito": {
-    "modified": "2020-07-16T22:35:32.855Z",
-    "contributors": [
-      "Beatriz_Ortega_Valdes"
-    ]
-  },
-  "Learn/Common_questions/Qué_es_una_URL": {
-    "modified": "2020-07-16T22:35:29.126Z",
-    "contributors": [
-      "ezzep66",
-      "BubuAnabelas"
-    ]
-  },
   "Learn/Common_questions/Thinking_before_coding": {
     "modified": "2020-07-16T22:35:34.085Z",
     "contributors": [
@@ -3033,12 +1458,6 @@
       "hmendezm90"
     ]
   },
-  "Learn/Common_questions/diseños_web_comunes": {
-    "modified": "2020-07-16T22:35:42.298Z",
-    "contributors": [
-      "Beatriz_Ortega_Valdes"
-    ]
-  },
   "Learn/Common_questions/set_up_a_local_testing_server": {
     "modified": "2020-07-16T22:35:52.759Z",
     "contributors": [
@@ -3047,27 +1466,6 @@
       "DaniNz"
     ]
   },
-  "Learn/Como_Contribuir": {
-    "modified": "2020-07-16T22:33:43.206Z",
-    "contributors": [
-      "SphinxKnight",
-      "Code118",
-      "dervys19",
-      "javierdelpino",
-      "axgeon",
-      "Leonardo_Valdez",
-      "cgsramirez"
-    ]
-  },
-  "Learn/Desarrollo_web_Front-end": {
-    "modified": "2020-11-18T03:33:37.370Z",
-    "contributors": [
-      "SphinxKnight",
-      "marquezpedro151",
-      "andresf.duran",
-      "Nachec"
-    ]
-  },
   "Learn/Getting_started_with_the_web": {
     "modified": "2020-09-22T16:37:42.904Z",
     "contributors": [
@@ -3103,15 +1501,6 @@
       "welm"
     ]
   },
-  "Learn/Getting_started_with_the_web/Cómo_funciona_la_Web": {
-    "modified": "2020-07-16T22:33:59.672Z",
-    "contributors": [
-      "Enesimus",
-      "Maose",
-      "rulo_diaz",
-      "SphinxKnight"
-    ]
-  },
   "Learn/Getting_started_with_the_web/HTML_basics": {
     "modified": "2020-12-10T12:30:46.714Z",
     "contributors": [
@@ -3134,24 +1523,6 @@
       "Huarseral"
     ]
   },
-  "Learn/Getting_started_with_the_web/Instalacion_de_software_basico": {
-    "modified": "2020-11-10T01:28:22.294Z",
-    "contributors": [
-      "rockoldo",
-      "Nachec",
-      "Maose",
-      "Anyito",
-      "ingridc",
-      "Enesimus",
-      "israel-munoz",
-      "Neto2412",
-      "AngelFQC",
-      "mads0306",
-      "Da_igual",
-      "Chrixos",
-      "darbalma"
-    ]
-  },
   "Learn/Getting_started_with_the_web/JavaScript_basics": {
     "modified": "2020-08-17T06:23:11.691Z",
     "contributors": [
@@ -3184,31 +1555,6 @@
       "nekludov"
     ]
   },
-  "Learn/Getting_started_with_the_web/La_web_y_los_estandares_web": {
-    "modified": "2020-09-03T04:02:22.375Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Learn/Getting_started_with_the_web/Manejando_los_archivos": {
-    "modified": "2020-09-23T03:12:43.364Z",
-    "contributors": [
-      "Nachec",
-      "chrisdavidmills",
-      "NavetsArev",
-      "Maose",
-      "airmind97",
-      "hamfree",
-      "israel-munoz",
-      "GuilleMiranda",
-      "merol-dad",
-      "samshara1",
-      "mads0306",
-      "mamptecnocrata",
-      "Huarseral",
-      "diazwatson"
-    ]
-  },
   "Learn/Getting_started_with_the_web/Publishing_your_website": {
     "modified": "2020-11-11T14:35:28.910Z",
     "contributors": [
@@ -3268,281 +1614,6 @@
       "jpazos"
     ]
   },
-  "Learn/HTML/Forms": {
-    "modified": "2020-07-16T22:20:56.050Z",
-    "contributors": [
-      "xyvs",
-      "mikiangel10",
-      "chrisdavidmills",
-      "eljonims",
-      "sjmiles"
-    ]
-  },
-  "Learn/HTML/Forms/How_to_structure_an_HTML_form": {
-    "modified": "2020-09-18T11:13:13.645Z",
-    "contributors": [
-      "UOCccorcoles",
-      "UOCjcanovasi",
-      "editorUOC",
-      "chrisdavidmills",
-      "eljonims"
-    ]
-  },
-  "Learn/HTML/Forms/Property_compatibility_table_for_form_controls": {
-    "modified": "2020-08-30T01:12:52.090Z",
-    "contributors": [
-      "edchasw"
-    ]
-  },
-  "Learn/HTML/Forms/Prueba_tus_habilidades:_Otros_controles": {
-    "modified": "2020-07-16T22:22:12.140Z",
-    "contributors": [
-      "Enesimus"
-    ]
-  },
-  "Learn/HTML/Forms/Prueba_tus_habilidades:_controles_HTML5": {
-    "modified": "2020-07-16T22:22:11.445Z",
-    "contributors": [
-      "Enesimus"
-    ]
-  },
-  "Learn/HTML/Forms/Sending_and_retrieving_form_data": {
-    "modified": "2020-07-16T22:21:26.056Z",
-    "contributors": [
-      "Rafasu",
-      "rocioDEV",
-      "MrGreen",
-      "OseChez",
-      "DaniNz",
-      "peternerd",
-      "SphinxKnight",
-      "chrisdavidmills",
-      "Ricky_Lomax"
-    ]
-  },
-  "Learn/HTML/Forms/Styling_HTML_forms": {
-    "modified": "2020-07-16T22:21:30.546Z",
-    "contributors": [
-      "OMEGAYALFA",
-      "chrisdavidmills",
-      "cizquierdof"
-    ]
-  },
-  "Learn/HTML/Forms/The_native_form_widgets": {
-    "modified": "2020-09-15T08:02:23.197Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC",
-      "rayrojas"
-    ]
-  },
-  "Learn/HTML/Forms/Tipos_input_HTML5": {
-    "modified": "2020-10-30T10:06:35.877Z",
-    "contributors": [
-      "alejandro0619",
-      "panpy-web"
-    ]
-  },
-  "Learn/HTML/Forms/Validacion_formulario_datos": {
-    "modified": "2020-11-19T13:12:47.854Z",
-    "contributors": [
-      "tcebrian",
-      "UOCccorcoles",
-      "UOCjcanovasi",
-      "editorUOC",
-      "blanchart",
-      "israel-munoz"
-    ]
-  },
-  "Learn/HTML/Forms/Your_first_HTML_form": {
-    "modified": "2020-09-15T05:57:07.460Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC",
-      "BraisOliveira",
-      "OMEGAYALFA",
-      "OrlandoDeJesusCuxinYama",
-      "Giikah",
-      "chrisdavidmills",
-      "HGARZON"
-    ]
-  },
-  "Learn/HTML/Forms/como_crear_widgets_de_formularios_personalizados": {
-    "modified": "2020-07-16T22:21:55.231Z",
-    "contributors": [
-      "laatcode"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML": {
-    "modified": "2020-09-03T05:18:15.831Z",
-    "contributors": [
-      "Nachec",
-      "Enesimus",
-      "ivanagui2",
-      "Sergio_Gonzalez_Collado",
-      "cizquierdof",
-      "AngelFQC"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Advanced_text_formatting": {
-    "modified": "2020-09-05T21:21:55.228Z",
-    "contributors": [
-      "Nachec",
-      "UOCccorcoles",
-      "Enesimus",
-      "jmalsar",
-      "editorUOC",
-      "RG52",
-      "luchiano199",
-      "AlieYin"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Creating_hyperlinks": {
-    "modified": "2020-09-05T04:27:29.218Z",
-    "contributors": [
-      "Nachec",
-      "UOCccorcoles",
-      "juan.grred",
-      "Enesimus",
-      "jmalsar",
-      "blanchart",
-      "editorUOC",
-      "Myuel",
-      "MichaelMejiaMora",
-      "ferlopezcarr",
-      "javierpolit"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Debugging_HTML": {
-    "modified": "2020-08-31T12:17:08.843Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC",
-      "javierpolit"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Estructuración_de_una_página_de_contenido": {
-    "modified": "2020-07-16T22:24:18.388Z",
-    "contributors": [
-      "SoftwareRVG"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Marking_up_a_letter": {
-    "modified": "2020-07-16T22:23:11.881Z",
-    "contributors": [
-      "jmalsar",
-      "luchiano199",
-      "javierpolit"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Metados_en": {
-    "modified": "2020-11-07T18:07:55.376Z",
-    "contributors": [
-      "nilo15",
-      "Nachec",
-      "UOCccorcoles",
-      "ccorcoles",
-      "editorUOC",
-      "hector080",
-      "clarii",
-      "Myuel",
-      "dmipaguirre",
-      "Armando-Cruz",
-      "MichaelMejiaMora",
-      "soedrego",
-      "absaucedo",
-      "venomdj2011",
-      "CarlosJose"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces": {
-    "modified": "2020-07-16T22:24:22.922Z",
-    "contributors": [
-      "Enesimus"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Texto_básico_HTML": {
-    "modified": "2020-07-16T22:24:21.949Z",
-    "contributors": [
-      "Enesimus"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/Test_your_skills:_Advanced_HTML_text": {
-    "modified": "2020-09-05T23:06:12.474Z",
-    "contributors": [
-      "walter.boba79"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/estructura": {
-    "modified": "2020-09-06T16:55:31.460Z",
-    "contributors": [
-      "Nachec",
-      "UOCccorcoles",
-      "editorUOC",
-      "chaerf",
-      "AlidaContreras",
-      "javierpolit",
-      "SoftwareRVG",
-      "welm"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/iniciar": {
-    "modified": "2020-11-24T21:57:47.560Z",
-    "contributors": [
-      "nilo15",
-      "Nachec",
-      "UOCccorcoles",
-      "maodecolombia",
-      "Enesimus",
-      "editorUOC",
-      "narvmtz",
-      "dmipaguirre",
-      "BubuAnabelas",
-      "marlabarbz",
-      "erllanosr",
-      "r2fv",
-      "jonasmreza",
-      "Cjpertuz",
-      "yan-vega",
-      "Armando-Cruz",
-      "felixgomez",
-      "olvap",
-      "emermao",
-      "soedrego",
-      "Abihu",
-      "mitocondriaco",
-      "nahuelsotelo",
-      "dayamll",
-      "JimP99",
-      "EdwinTorres",
-      "salvarez1988",
-      "cizquierdof",
-      "juanluis",
-      "welm"
-    ]
-  },
-  "Learn/HTML/Introduccion_a_HTML/texto": {
-    "modified": "2020-09-04T15:00:09.675Z",
-    "contributors": [
-      "Nachec",
-      "UOCccorcoles",
-      "Enesimus",
-      "Maose",
-      "ccorcoles",
-      "editorUOC",
-      "hector080",
-      "JulianMahecha",
-      "BubuAnabelas",
-      "RafaelVentura",
-      "jadiosc",
-      "dcarmal-dayvo",
-      "Owildfox",
-      "Myuel",
-      "dmipaguirre",
-      "Dany07",
-      "welm"
-    ]
-  },
   "Learn/HTML/Multimedia_and_embedding": {
     "modified": "2020-08-08T01:15:36.731Z",
     "contributors": [
@@ -3638,95 +1709,6 @@
       "rayrojas"
     ]
   },
-  "Learn/HTML/Tablas": {
-    "modified": "2020-07-16T22:25:11.000Z",
-    "contributors": [
-      "Drathveloper",
-      "IXTRUnai"
-    ]
-  },
-  "Learn/HTML/Tablas/Conceptos_básicos_de_las_tablas_HTML": {
-    "modified": "2020-09-09T11:52:38.720Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/HTML/Tablas/Funciones_avanzadas_de_las_tablas_HTML_y_accesibilidad": {
-    "modified": "2020-09-14T06:33:13.790Z",
-    "contributors": [
-      "UOCccorcoles",
-      "editorUOC"
-    ]
-  },
-  "Learn/HTML/Tablas/Structuring_planet_data": {
-    "modified": "2020-07-16T22:25:29.339Z",
-    "contributors": [
-      "IXTRUnai"
-    ]
-  },
-  "Learn/HTML/como": {
-    "modified": "2020-07-16T22:22:28.075Z",
-    "contributors": [
-      "Loba25",
-      "blanchart",
-      "welm"
-    ]
-  },
-  "Learn/HTML/como/Usando_atributos_de_datos": {
-    "modified": "2020-10-29T15:52:03.444Z",
-    "contributors": [
-      "angeljpa95",
-      "camsa",
-      "laatcode"
-    ]
-  },
-  "Learn/Herramientas_y_pruebas": {
-    "modified": "2020-07-16T22:38:54.378Z",
-    "contributors": [
-      "WilsonIsAliveClone",
-      "carlosgocereceda",
-      "mikelmg"
-    ]
-  },
-  "Learn/Herramientas_y_pruebas/Cross_browser_testing": {
-    "modified": "2020-07-16T22:38:59.665Z",
-    "contributors": [
-      "arnoldobr"
-    ]
-  },
-  "Learn/Herramientas_y_pruebas/GitHub": {
-    "modified": "2020-10-01T17:01:32.394Z",
-    "contributors": [
-      "IsraFloores",
-      "Nachec"
-    ]
-  },
-  "Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks": {
-    "modified": "2020-08-22T19:34:32.519Z",
-    "contributors": [
-      "spaceinvadev",
-      "jhonarielgj"
-    ]
-  },
-  "Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started": {
-    "modified": "2020-08-22T19:52:35.580Z",
-    "contributors": [
-      "spaceinvadev"
-    ]
-  },
-  "Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/Vue_primeros_pasos": {
-    "modified": "2020-09-17T18:53:24.146Z",
-    "contributors": [
-      "Faem0220"
-    ]
-  },
-  "Learn/Herramientas_y_pruebas/Understanding_client-side_tools": {
-    "modified": "2020-07-28T15:51:57.413Z",
-    "contributors": [
-      "b3m3bi"
-    ]
-  },
   "Learn/JavaScript": {
     "modified": "2020-08-08T12:13:32.547Z",
     "contributors": [
@@ -3781,35 +1763,6 @@
       "chrisdavidmills"
     ]
   },
-  "Learn/JavaScript/Building_blocks/Bucle_codigo": {
-    "modified": "2020-10-10T18:54:10.014Z",
-    "contributors": [
-      "GianGuerra",
-      "Enesimus",
-      "josecampo",
-      "jesusvillalta",
-      "yohanolmedo",
-      "Zenchy",
-      "SebastianMaciel"
-    ]
-  },
-  "Learn/JavaScript/Building_blocks/Construyendo_tu_propia_funcion": {
-    "modified": "2020-07-16T22:31:28.751Z",
-    "contributors": [
-      "InmobAli",
-      "serarroy",
-      "carlosgocereceda"
-    ]
-  },
-  "Learn/JavaScript/Building_blocks/Eventos": {
-    "modified": "2020-07-16T22:31:37.027Z",
-    "contributors": [
-      "jhonarielgj",
-      "sebastiananea",
-      "maximilianotulian",
-      "ismamz"
-    ]
-  },
   "Learn/JavaScript/Building_blocks/Functions": {
     "modified": "2020-10-10T22:09:39.322Z",
     "contributors": [
@@ -3821,12 +1774,6 @@
       "DanielAgustinTradito"
     ]
   },
-  "Learn/JavaScript/Building_blocks/Galeria_de_imagenes": {
-    "modified": "2020-07-16T22:31:42.753Z",
-    "contributors": [
-      "amIsmael"
-    ]
-  },
   "Learn/JavaScript/Building_blocks/Return_values": {
     "modified": "2020-07-17T01:43:24.262Z",
     "contributors": [
@@ -3867,17 +1814,6 @@
       "Dsabillon"
     ]
   },
-  "Learn/JavaScript/Client-side_web_APIs/Introducción": {
-    "modified": "2020-07-16T22:32:44.249Z",
-    "contributors": [
-      "robertsallent",
-      "gonzaa96",
-      "Usuario001",
-      "kevtinoco",
-      "Anonymous",
-      "OrlandoDeJesusCuxinYama"
-    ]
-  },
   "Learn/JavaScript/First_steps": {
     "modified": "2020-09-22T14:49:32.194Z",
     "contributors": [
@@ -3930,52 +1866,6 @@
       "DaniNz"
     ]
   },
-  "Learn/JavaScript/First_steps/Generador_de_historias_absurdas": {
-    "modified": "2020-11-28T18:15:56.503Z",
-    "contributors": [
-      "willian593",
-      "Enesimus",
-      "fj1261",
-      "keskyle17",
-      "antqted"
-    ]
-  },
-  "Learn/JavaScript/First_steps/Matemáticas": {
-    "modified": "2020-08-11T20:21:00.937Z",
-    "contributors": [
-      "Nachec",
-      "Enesimus",
-      "keskyle17",
-      "Creasick",
-      "Aussith_9NT",
-      "JaviMartain",
-      "guibetancur",
-      "domingoacd",
-      "jjpc"
-    ]
-  },
-  "Learn/JavaScript/First_steps/Prueba_tus_habilidades:_Strings": {
-    "modified": "2020-08-11T12:16:57.685Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Learn/JavaScript/First_steps/Qué_es_JavaScript": {
-    "modified": "2020-08-08T22:05:17.982Z",
-    "contributors": [
-      "Nachec",
-      "zgreco2000",
-      "jacobo.delgado",
-      "console",
-      "c9009",
-      "Creasick",
-      "bosspetta",
-      "alejoWeb",
-      "JorgeAML",
-      "eliud-c-delgado",
-      "roberbnd"
-    ]
-  },
   "Learn/JavaScript/First_steps/Strings": {
     "modified": "2020-09-06T21:18:25.448Z",
     "contributors": [
@@ -4095,16 +1985,6 @@
       "kevin-loal98"
     ]
   },
-  "Learn/JavaScript/Objects/Ejercicio_práctico_de_construcción_de_objetos": {
-    "modified": "2020-07-16T22:32:30.877Z",
-    "contributors": [
-      "r-vasquez",
-      "rayrojas",
-      "luchiano199",
-      "Sergio_Gonzalez_Collado",
-      "pomarbar"
-    ]
-  },
   "Learn/JavaScript/Objects/Inheritance": {
     "modified": "2020-07-28T01:53:21.821Z",
     "contributors": [
@@ -4254,16 +2134,6 @@
       "javierdelpino"
     ]
   },
-  "Learn/Server-side/Django/Introducción": {
-    "modified": "2020-07-16T22:36:38.315Z",
-    "contributors": [
-      "dr2d4",
-      "jlpb97",
-      "oalberto96",
-      "javierdelpino",
-      "oscvic"
-    ]
-  },
   "Learn/Server-side/Django/Models": {
     "modified": "2020-08-27T11:46:51.559Z",
     "contributors": [
@@ -4417,77 +2287,6 @@
       "javierdelpino"
     ]
   },
-  "Learn/Server-side/Primeros_pasos": {
-    "modified": "2020-07-16T22:36:08.254Z",
-    "contributors": [
-      "javierdelpino"
-    ]
-  },
-  "Learn/Server-side/Primeros_pasos/Introducción": {
-    "modified": "2020-07-16T22:36:13.094Z",
-    "contributors": [
-      "AnaHertaj",
-      "SphinxKnight",
-      "mortyBL",
-      "javierdelpino"
-    ]
-  },
-  "Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor": {
-    "modified": "2020-07-16T22:36:18.740Z",
-    "contributors": [
-      "Slb-Sbsz",
-      "javierdelpino"
-    ]
-  },
-  "Learn/Server-side/Primeros_pasos/Web_frameworks": {
-    "modified": "2020-07-16T22:36:23.784Z",
-    "contributors": [
-      "Slb-Sbsz",
-      "javierdelpino"
-    ]
-  },
-  "Learn/Server-side/Primeros_pasos/seguridad_sitios_web": {
-    "modified": "2020-07-16T22:36:27.856Z",
-    "contributors": [
-      "isaine",
-      "Slb-Sbsz",
-      "javierdelpino"
-    ]
-  },
-  "Learn/Using_Github_pages": {
-    "modified": "2020-07-16T22:35:51.571Z",
-    "contributors": [
-      "DaniNz",
-      "LuyisiMiger",
-      "TAXIS"
-    ]
-  },
-  "Learn/codificacion-scripting": {
-    "modified": "2020-07-16T22:22:13.785Z",
-    "contributors": [
-      "hamfree"
-    ]
-  },
-  "Localización": {
-    "modified": "2019-01-16T13:31:36.167Z",
-    "contributors": [
-      "DirkS",
-      "RickieesES",
-      "Mgjbot",
-      "Verruckt",
-      "Jorolo",
-      "Takenbot",
-      "Nukeador",
-      "Radigar"
-    ]
-  },
-  "Localizar_con_Narro": {
-    "modified": "2019-03-24T00:12:25.538Z",
-    "contributors": [
-      "jvmjunior",
-      "deimidis"
-    ]
-  },
   "MDN": {
     "modified": "2020-07-08T14:43:57.058Z",
     "contributors": [
@@ -4526,19 +2325,6 @@
       "maedca"
     ]
   },
-  "MDN/Comunidad": {
-    "modified": "2020-04-24T19:14:03.228Z",
-    "contributors": [
-      "inwm",
-      "SphinxKnight",
-      "wbamberg",
-      "jenyvera",
-      "0zxo",
-      "Jeremie",
-      "LeoHirsch",
-      "luisgm76"
-    ]
-  },
   "MDN/Contribute": {
     "modified": "2019-03-22T01:52:35.495Z",
     "contributors": [
@@ -4551,16 +2337,6 @@
       "Mars"
     ]
   },
-  "MDN/Contribute/Community": {
-    "modified": "2020-09-03T13:14:53.733Z",
-    "contributors": [
-      "FoulMangoPY",
-      "jswisher",
-      "wbamberg",
-      "welm",
-      "Sebastian.Nagles"
-    ]
-  },
   "MDN/Contribute/Feedback": {
     "modified": "2020-12-02T14:04:57.487Z",
     "contributors": [
@@ -4624,17 +2400,6 @@
       "LeoHirsch"
     ]
   },
-  "MDN/Contribute/Howto/Crear_cuenta_MDN": {
-    "modified": "2020-08-21T18:14:17.930Z",
-    "contributors": [
-      "Tomillo",
-      "JADE-2006",
-      "wbamberg",
-      "JuniorBO",
-      "Arudb79",
-      "LeoHirsch"
-    ]
-  },
   "MDN/Contribute/Howto/Document_a_CSS_property": {
     "modified": "2020-02-19T19:43:18.253Z",
     "contributors": [
@@ -4646,36 +2411,6 @@
       "MauricioGil"
     ]
   },
-  "MDN/Contribute/Howto/Document_a_CSS_property/Plantilla_propiedad": {
-    "modified": "2019-03-18T21:31:21.033Z",
-    "contributors": [
-      "wbamberg",
-      "B1tF8er"
-    ]
-  },
-  "MDN/Contribute/Howto/Etiquetas_paginas_javascript": {
-    "modified": "2019-01-16T19:47:18.318Z",
-    "contributors": [
-      "wbamberg",
-      "LeoHirsch"
-    ]
-  },
-  "MDN/Contribute/Howto/Remover_Macros_Experimentales": {
-    "modified": "2020-07-05T17:06:56.383Z",
-    "contributors": [
-      "Anibalismo"
-    ]
-  },
-  "MDN/Contribute/Howto/Set_the_summary_for_a_page": {
-    "modified": "2020-07-05T16:17:53.925Z",
-    "contributors": [
-      "Anibalismo",
-      "Maose",
-      "wbamberg",
-      "gerard.am",
-      "LeoHirsch"
-    ]
-  },
   "MDN/Contribute/Howto/Tag": {
     "modified": "2019-03-23T23:15:01.953Z",
     "contributors": [
@@ -4691,12 +2426,6 @@
       "LeoHirsch"
     ]
   },
-  "MDN/Contribute/Howto/Usar_barras_laterales_de_navegación": {
-    "modified": "2019-05-08T17:34:30.854Z",
-    "contributors": [
-      "ivanagui2"
-    ]
-  },
   "MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary": {
     "modified": "2019-03-23T23:09:23.417Z",
     "contributors": [
@@ -4706,51 +2435,6 @@
       "L_e_o"
     ]
   },
-  "MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web": {
-    "modified": "2020-06-26T02:13:25.044Z",
-    "contributors": [
-      "Enesimus",
-      "pablorebora",
-      "blanchart",
-      "BubuAnabelas",
-      "SphinxKnight",
-      "FranciscoImanolSuarez"
-    ]
-  },
-  "MDN/Contribute/Howto/revision_editorial": {
-    "modified": "2019-03-18T20:54:27.132Z",
-    "contributors": [
-      "LauraJaime8",
-      "wbamberg",
-      "ElNobDeTfm",
-      "Arudb79",
-      "LeoHirsch"
-    ]
-  },
-  "MDN/Contribute/Howto/revision_tecnica": {
-    "modified": "2019-01-16T18:56:48.857Z",
-    "contributors": [
-      "wbamberg",
-      "MarkelCuesta",
-      "rowasc",
-      "LeoHirsch"
-    ]
-  },
-  "MDN/Contribute/Procesos": {
-    "modified": "2019-01-17T02:12:44.469Z",
-    "contributors": [
-      "wbamberg",
-      "astrapotro"
-    ]
-  },
-  "MDN/Contribute/Tareas": {
-    "modified": "2019-01-16T18:56:38.941Z",
-    "contributors": [
-      "wbamberg",
-      "MauricioGil",
-      "LeoHirsch"
-    ]
-  },
   "MDN/Guidelines": {
     "modified": "2020-09-30T15:28:55.816Z",
     "contributors": [
@@ -4760,70 +2444,6 @@
       "LeoHirsch"
     ]
   },
-  "MDN/Guidelines/Content_blocks": {
-    "modified": "2020-09-30T15:28:56.171Z",
-    "contributors": [
-      "chrisdavidmills",
-      "wbamberg",
-      "Jeremie",
-      "LeoHirsch"
-    ]
-  },
-  "MDN/Guidelines/Convenciones_y_definiciones": {
-    "modified": "2020-09-30T15:28:56.412Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Nachec"
-    ]
-  },
-  "MDN/Guidelines/Project:Guía_de_estilo": {
-    "modified": "2020-09-30T15:28:56.038Z",
-    "contributors": [
-      "chrisdavidmills",
-      "blanchart",
-      "clarii",
-      "wbamberg",
-      "Jeremie",
-      "Salamandra101",
-      "Dgeek",
-      "fscholz",
-      "LeoHirsch",
-      "teoli",
-      "Pgulijczuk",
-      "DoctorRomi",
-      "Nukeador",
-      "Nanomo",
-      "Eqx",
-      "Jorolo"
-    ]
-  },
-  "MDN/Kuma": {
-    "modified": "2019-09-09T15:52:33.535Z",
-    "contributors": [
-      "SphinxKnight",
-      "clarii",
-      "wbamberg",
-      "Jeremie",
-      "Diio",
-      "atlas7jean"
-    ]
-  },
-  "MDN/Kuma/Contributing": {
-    "modified": "2019-03-23T23:15:25.956Z",
-    "contributors": [
-      "wbamberg",
-      "Jeremie",
-      "MauricioGil"
-    ]
-  },
-  "MDN/Kuma/Contributing/Getting_started": {
-    "modified": "2019-01-16T19:06:06.895Z",
-    "contributors": [
-      "wbamberg",
-      "Jeremie",
-      "MauricioGil"
-    ]
-  },
   "MDN/Structures": {
     "modified": "2020-09-30T09:06:15.403Z",
     "contributors": [
@@ -4832,16 +2452,6 @@
       "jswisher"
     ]
   },
-  "MDN/Structures/Ejemplos_ejecutables": {
-    "modified": "2020-09-30T09:06:15.983Z",
-    "contributors": [
-      "chrisdavidmills",
-      "wbamberg",
-      "emanuelvega",
-      "LUISTGMDN",
-      "elihro"
-    ]
-  },
   "MDN/Structures/Macros": {
     "modified": "2020-09-30T09:06:16.658Z",
     "contributors": [
@@ -4857,20 +2467,6 @@
       "Nachec"
     ]
   },
-  "MDN/Structures/Macros/Otras": {
-    "modified": "2020-09-30T09:06:17.522Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Nachec"
-    ]
-  },
-  "MDN/Structures/Tablas_de_compatibilidad": {
-    "modified": "2020-10-15T22:33:39.399Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Nachec"
-    ]
-  },
   "MDN/Tools": {
     "modified": "2020-09-30T16:48:18.728Z",
     "contributors": [
@@ -4881,98 +2477,6 @@
       "atlas7jean"
     ]
   },
-  "MDN/Tools/Introduction_to_KumaScript": {
-    "modified": "2020-09-30T16:48:19.117Z",
-    "contributors": [
-      "chrisdavidmills",
-      "wbamberg",
-      "velizluisma",
-      "Jeremie",
-      "LeoHirsch"
-    ]
-  },
-  "MDN/Tools/Page_regeneration": {
-    "modified": "2020-09-30T16:48:19.365Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Anibalismo"
-    ]
-  },
-  "MDN/Tools/Template_editing": {
-    "modified": "2020-09-30T16:48:19.234Z",
-    "contributors": [
-      "chrisdavidmills",
-      "wbamberg",
-      "juan-ferrer-toribio"
-    ]
-  },
-  "MDN/User_guide": {
-    "modified": "2020-12-14T09:30:27.029Z",
-    "contributors": [
-      "wbamberg",
-      "Sheppy"
-    ]
-  },
-  "MDN_en_diez": {
-    "modified": "2019-03-23T22:49:57.954Z",
-    "contributors": [
-      "pabloveintimilla",
-      "diego.mauricio.meneses.rios"
-    ]
-  },
-  "Mejoras_DOM_en_Firefox_3": {
-    "modified": "2019-03-23T23:50:52.840Z",
-    "contributors": [
-      "wbamberg",
-      "Mgjbot",
-      "RickieesES",
-      "Nukeador",
-      "HenryGR",
-      "Talisker"
-    ]
-  },
-  "Mejoras_SVG_en_Firefox_3": {
-    "modified": "2019-03-23T23:50:55.206Z",
-    "contributors": [
-      "wbamberg",
-      "Mgjbot",
-      "RickieesES",
-      "Nukeador",
-      "Talisker"
-    ]
-  },
-  "Mejoras_XUL_en_Firefox_3": {
-    "modified": "2019-03-24T00:02:34.038Z",
-    "contributors": [
-      "wbamberg",
-      "fscholz",
-      "Nukeador",
-      "Mgjbot",
-      "Nathymig",
-      "Dukebody"
-    ]
-  },
-  "Migrar_aplicaciones_desde_Internet_Explorer_a_Mozilla": {
-    "modified": "2019-03-23T23:59:56.566Z",
-    "contributors": [
-      "teoli",
-      "Siyivan",
-      "krusch",
-      "Mgjbot",
-      "Mrgonzalez",
-      "Superruzafa",
-      "Ttataje",
-      "Nukeador"
-    ]
-  },
-  "Modo_casi_estándar_de_Gecko": {
-    "modified": "2019-03-23T23:43:50.956Z",
-    "contributors": [
-      "teoli",
-      "Mgjbot",
-      "Jorolo"
-    ]
-  },
   "Mozilla": {
     "modified": "2019-01-16T13:16:23.082Z",
     "contributors": [
@@ -5059,16 +2563,6 @@
       "roberbnd"
     ]
   },
-  "Mozilla/Add-ons/WebExtensions/Anatomia_de_una_WebExtension": {
-    "modified": "2019-03-18T21:08:05.873Z",
-    "contributors": [
-      "hecaxmmx",
-      "rgo",
-      "jde-gr",
-      "doztrock",
-      "yuniers"
-    ]
-  },
   "Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs": {
     "modified": "2020-10-15T20:55:02.467Z",
     "contributors": [
@@ -5082,12 +2576,6 @@
       "yuniers"
     ]
   },
-  "Mozilla/Add-ons/WebExtensions/Depuración": {
-    "modified": "2019-03-18T21:05:20.525Z",
-    "contributors": [
-      "Pau"
-    ]
-  },
   "Mozilla/Add-ons/WebExtensions/Examples": {
     "modified": "2019-03-18T21:06:01.388Z",
     "contributors": [
@@ -5126,61 +2614,6 @@
       "alexgilsoncampi"
     ]
   },
-  "Mozilla/Add-ons/WebExtensions/Packaging_and_installation": {
-    "modified": "2019-03-23T22:45:27.399Z",
-    "contributors": [
-      "yuniers"
-    ]
-  },
-  "Mozilla/Add-ons/WebExtensions/Porting_from_Google_Chrome": {
-    "modified": "2019-03-18T21:08:10.456Z",
-    "contributors": [
-      "fitojb",
-      "yuniers"
-    ]
-  },
-  "Mozilla/Add-ons/WebExtensions/Prerequisitos": {
-    "modified": "2019-03-23T22:45:28.352Z",
-    "contributors": [
-      "yuniers"
-    ]
-  },
-  "Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension": {
-    "modified": "2019-03-18T21:05:24.379Z",
-    "contributors": [
-      "FacundoCerezo",
-      "IXTRUnai"
-    ]
-  },
-  "Mozilla/Add-ons/WebExtensions/Que_son_las_WebExtensions": {
-    "modified": "2020-11-23T00:59:33.889Z",
-    "contributors": [
-      "kenliten",
-      "hecaxmmx",
-      "13539"
-    ]
-  },
-  "Mozilla/Add-ons/WebExtensions/Tu_primera_WebExtension": {
-    "modified": "2020-11-23T01:34:20.681Z",
-    "contributors": [
-      "kenliten",
-      "IgnacioMilia",
-      "mppfiles",
-      "adderou",
-      "hecaxmmx",
-      "Maller_Lagoon"
-    ]
-  },
-  "Mozilla/Add-ons/WebExtensions/Tutorial": {
-    "modified": "2019-04-25T06:15:12.057Z",
-    "contributors": [
-      "Klius",
-      "IgnacioMilia",
-      "chicocoulomb",
-      "hecaxmmx",
-      "yuniers"
-    ]
-  },
   "Mozilla/Add-ons/WebExtensions/What_next_": {
     "modified": "2019-03-18T20:43:00.251Z",
     "contributors": [
@@ -5207,12 +2640,6 @@
       "rebloor"
     ]
   },
-  "Mozilla/Add-ons/WebExtensions/user_interface/Accion_navegador": {
-    "modified": "2019-03-18T21:03:34.447Z",
-    "contributors": [
-      "adderou"
-    ]
-  },
   "Mozilla/Add-ons/WebExtensions/user_interface/Page_actions": {
     "modified": "2019-08-12T17:02:44.540Z",
     "contributors": [
@@ -5226,18 +2653,6 @@
       "Etruscco"
     ]
   },
-  "Mozilla/Developer_guide/Preguntas_frecuentes_sobre_la_compilación_de_Mozilla": {
-    "modified": "2019-03-23T23:58:56.616Z",
-    "contributors": [
-      "chrisdavidmills",
-      "fscholz",
-      "teoli",
-      "DoctorRomi",
-      "Nukeador",
-      "Mgjbot",
-      "Blank zero"
-    ]
-  },
   "Mozilla/Developer_guide/Source_Code": {
     "modified": "2020-03-01T17:19:51.307Z",
     "contributors": [
@@ -5247,16 +2662,6 @@
       "jntesteves"
     ]
   },
-  "Mozilla/Developer_guide/Source_Code/Código_fuente_de_Mozilla_(CVS)": {
-    "modified": "2019-03-23T23:46:33.805Z",
-    "contributors": [
-      "chrisdavidmills",
-      "teoli",
-      "Nukeador",
-      "Mgjbot",
-      "Blank zero"
-    ]
-  },
   "Mozilla/Developer_guide/mozilla-central": {
     "modified": "2019-03-18T21:11:07.718Z",
     "contributors": [
@@ -5376,200 +2781,6 @@
       "Rickatomato"
     ]
   },
-  "Módulos_JavaScript": {
-    "modified": "2019-03-23T23:53:21.168Z",
-    "contributors": [
-      "SphinxKnight",
-      "teoli",
-      "Mgjbot",
-      "Ffranz",
-      "Mariano"
-    ]
-  },
-  "Participar_en_el_proyecto_Mozilla": {
-    "modified": "2019-03-24T00:07:54.638Z",
-    "contributors": [
-      "teoli",
-      "inma_610"
-    ]
-  },
-  "Plantillas_en_Firefox_3": {
-    "modified": "2019-03-24T00:02:45.436Z",
-    "contributors": [
-      "wbamberg",
-      "fscholz",
-      "Nukeador",
-      "Kaltya",
-      "Mgjbot"
-    ]
-  },
-  "Preguntas_frecuentes_sobre_incrustación_en_Mozilla": {
-    "modified": "2019-01-16T15:02:38.544Z",
-    "contributors": [
-      "Anonymous"
-    ]
-  },
-  "Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación": {
-    "modified": "2019-01-16T16:13:02.334Z",
-    "contributors": [
-      "Jorolo",
-      "Lastjuan"
-    ]
-  },
-  "Principios_básicos_de_los_servicios_Web": {
-    "modified": "2019-01-16T16:13:03.069Z",
-    "contributors": [
-      "Jorolo",
-      "Xoan",
-      "Breaking Pitt"
-    ]
-  },
-  "Recursos_en_modo_desconectado_en_Firefox": {
-    "modified": "2019-03-18T21:11:07.042Z",
-    "contributors": [
-      "duduindo",
-      "Mgjbot",
-      "Nukeador",
-      "Nathymig",
-      "HenryGR"
-    ]
-  },
-  "Referencia_DOM_de_Gecko": {
-    "modified": "2019-01-16T16:01:11.054Z",
-    "contributors": [
-      "DR",
-      "Nathymig"
-    ]
-  },
-  "Referencia_DOM_de_Gecko/Cómo_espacioenblanco": {
-    "modified": "2020-08-24T04:42:05.596Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Referencia_DOM_de_Gecko/Ejemplos": {
-    "modified": "2019-03-23T23:51:24.173Z",
-    "contributors": [
-      "SphinxKnight",
-      "khalid32",
-      "Mgjbot",
-      "Manu",
-      "Markens",
-      "Nathymig"
-    ]
-  },
-  "Referencia_DOM_de_Gecko/Eventos": {
-    "modified": "2019-03-18T21:45:13.362Z",
-    "contributors": [
-      "recortes"
-    ]
-  },
-  "Referencia_DOM_de_Gecko/Introducción": {
-    "modified": "2019-03-23T23:48:16.078Z",
-    "contributors": [
-      "LuisSevillano",
-      "IsaacAaron",
-      "Sheppy",
-      "Uri",
-      "Nathymig"
-    ]
-  },
-  "Referencia_DOM_de_Gecko/Localizando_elementos_DOM_usando_selectores": {
-    "modified": "2020-06-14T19:56:35.416Z",
-    "contributors": [
-      "snickArg"
-    ]
-  },
-  "Referencia_DOM_de_Gecko/Prefacio": {
-    "modified": "2019-06-16T19:12:21.185Z",
-    "contributors": [
-      "jesusvillalta",
-      "Sheppy",
-      "Nathymig"
-    ]
-  },
-  "Referencia_de_XUL": {
-    "modified": "2019-04-19T23:18:32.719Z",
-    "contributors": [
-      "wbamberg",
-      "teoli",
-      "chukito"
-    ]
-  },
-  "SVG_en_Firefox": {
-    "modified": "2019-03-23T23:43:25.545Z",
-    "contributors": [
-      "teoli",
-      "Superruzafa",
-      "Jorolo"
-    ]
-  },
-  "Sections_and_Outlines_of_an_HTML5_document": {
-    "modified": "2019-03-23T23:38:22.567Z",
-    "contributors": [
-      "blanchart",
-      "eljonims",
-      "welm",
-      "javigaar",
-      "learnercys",
-      "pierre_alfonso",
-      "jesanchez"
-    ]
-  },
-  "Seguridad_en_Firefox_2": {
-    "modified": "2019-03-23T23:42:29.185Z",
-    "contributors": [
-      "wbamberg",
-      "teoli",
-      "Nukeador"
-    ]
-  },
-  "Selección_de_modo_en_Mozilla": {
-    "modified": "2019-11-21T20:40:48.950Z",
-    "contributors": [
-      "wbamberg",
-      "teoli",
-      "fscholz",
-      "Jorolo"
-    ]
-  },
-  "Server-sent_events": {
-    "modified": "2019-03-23T23:24:42.323Z",
-    "contributors": [
-      "ethertank"
-    ]
-  },
-  "Server-sent_events/utilizando_server_sent_events_sse": {
-    "modified": "2019-04-16T06:11:09.003Z",
-    "contributors": [
-      "albertoclarbrines",
-      "adlr",
-      "iamwao",
-      "jgutix",
-      "aztrock"
-    ]
-  },
-  "Storage": {
-    "modified": "2019-03-24T00:09:02.141Z",
-    "contributors": [
-      "teoli",
-      "elPatox",
-      "Francoyote",
-      "HenryGR",
-      "Mgjbot"
-    ]
-  },
-  "Tipo_MIME_incorrecto_en_archivos_CSS": {
-    "modified": "2019-01-16T15:43:53.805Z",
-    "contributors": [
-      "Dailosmm",
-      "Mgjbot",
-      "Jorolo",
-      "Nukeador",
-      "Epaclon",
-      "Pasky"
-    ]
-  },
   "Tools": {
     "modified": "2020-07-16T22:44:14.436Z",
     "contributors": [
@@ -5611,21 +2822,6 @@
       "rmilano"
     ]
   },
-  "Tools/Accesos_directos": {
-    "modified": "2020-07-28T10:35:37.425Z",
-    "contributors": [
-      "Anibalismo",
-      "ssm",
-      "hugojavierduran9",
-      "marcorichetta"
-    ]
-  },
-  "Tools/Add-ons": {
-    "modified": "2020-07-16T22:36:23.274Z",
-    "contributors": [
-      "mfluehr"
-    ]
-  },
   "Tools/Browser_Console": {
     "modified": "2020-07-16T22:35:42.205Z",
     "contributors": [
@@ -5674,62 +2870,12 @@
       "erickton"
     ]
   },
-  "Tools/Debugger/How_to/Uso_de_un_mapa_fuente": {
-    "modified": "2020-07-16T22:35:12.325Z",
-    "contributors": [
-      "Makinita"
-    ]
-  },
   "Tools/Debugger/Source_map_errors": {
     "modified": "2020-07-16T22:35:19.165Z",
     "contributors": [
       "Makinita"
     ]
   },
-  "Tools/Desempeño": {
-    "modified": "2020-07-16T22:36:12.530Z",
-    "contributors": [
-      "LesterGuerra",
-      "juanmapiquero",
-      "PorcoMaledette"
-    ]
-  },
-  "Tools/Desempeño/UI_Tour": {
-    "modified": "2020-07-16T22:36:14.726Z",
-    "contributors": [
-      "kynu",
-      "calcerrada",
-      "ramferposadas"
-    ]
-  },
-  "Tools/Editor_Audio_Web": {
-    "modified": "2020-07-16T22:36:08.308Z",
-    "contributors": [
-      "MPoli"
-    ]
-  },
-  "Tools/Editor_Estilo": {
-    "modified": "2020-07-16T22:35:00.009Z",
-    "contributors": [
-      "jwhitlock",
-      "cheline",
-      "SoftwareRVG",
-      "JosshuaCalixto1",
-      "maybe",
-      "padre629",
-      "CagsaBit"
-    ]
-  },
-  "Tools/Monitor_de_Red": {
-    "modified": "2020-07-16T22:35:29.709Z",
-    "contributors": [
-      "sevillacode",
-      "Makinita",
-      "_cuco_",
-      "Ivan-Perez",
-      "Dieg"
-    ]
-  },
   "Tools/Page_Inspector": {
     "modified": "2020-07-16T22:34:27.363Z",
     "contributors": [
@@ -5741,36 +2887,12 @@
       "MauricioGil"
     ]
   },
-  "Tools/Page_Inspector/3er-panel_modo": {
-    "modified": "2020-07-16T22:34:53.611Z",
-    "contributors": [
-      "welm"
-    ]
-  },
   "Tools/Page_Inspector/How_to": {
     "modified": "2020-07-16T22:34:30.977Z",
     "contributors": [
       "sidgan"
     ]
   },
-  "Tools/Page_Inspector/How_to/Abrir_el_Inspector": {
-    "modified": "2020-07-16T22:34:32.611Z",
-    "contributors": [
-      "amaiafilo"
-    ]
-  },
-  "Tools/Page_Inspector/How_to/Examinar_y_editar_HTML": {
-    "modified": "2020-07-16T22:34:40.440Z",
-    "contributors": [
-      "amaiafilo"
-    ]
-  },
-  "Tools/Page_Inspector/How_to/Examinar_y_editar_el_modelo_de_cajasmodel": {
-    "modified": "2020-07-16T22:34:34.150Z",
-    "contributors": [
-      "amaiafilo"
-    ]
-  },
   "Tools/Page_Inspector/How_to/Examine_and_edit_CSS": {
     "modified": "2020-07-16T22:34:42.117Z",
     "contributors": [
@@ -5783,18 +2905,6 @@
       "welm"
     ]
   },
-  "Tools/Page_Inspector/How_to/Inspeccionar_y_seleccionar_colores": {
-    "modified": "2020-07-16T22:34:34.877Z",
-    "contributors": [
-      "amaiafilo"
-    ]
-  },
-  "Tools/Page_Inspector/How_to/Reposicionando_elementos_en_la_pagina": {
-    "modified": "2020-07-16T22:34:45.756Z",
-    "contributors": [
-      "alebarbaja"
-    ]
-  },
   "Tools/Page_Inspector/How_to/Select_an_element": {
     "modified": "2020-07-16T22:34:33.474Z",
     "contributors": [
@@ -5816,12 +2926,6 @@
       "amaiafilo"
     ]
   },
-  "Tools/Profiler": {
-    "modified": "2020-07-16T22:35:28.621Z",
-    "contributors": [
-      "MrDaza"
-    ]
-  },
   "Tools/Remote_Debugging": {
     "modified": "2020-07-16T22:35:37.186Z",
     "contributors": [
@@ -5835,31 +2939,6 @@
       "aguntinito"
     ]
   },
-  "Tools/Remote_Debugging/Debugging_over_a_network": {
-    "modified": "2020-07-16T22:35:41.552Z",
-    "contributors": [
-      "stephiemtz"
-    ]
-  },
-  "Tools/Remote_Debugging/Firefox_para_Android": {
-    "modified": "2020-07-16T22:35:38.980Z",
-    "contributors": [
-      "odelrio",
-      "pawer13",
-      "pacommozilla",
-      "StripTM"
-    ]
-  },
-  "Tools/Responsive_Design_View": {
-    "modified": "2020-07-16T22:35:21.169Z",
-    "contributors": [
-      "adolfotc",
-      "HugoM1682",
-      "amaiafilo",
-      "walter.atg",
-      "maedca"
-    ]
-  },
   "Tools/Settings": {
     "modified": "2020-07-16T22:36:34.818Z",
     "contributors": [
@@ -5878,12 +2957,6 @@
       "Enesimus"
     ]
   },
-  "Tools/Tomar_capturas_de_pantalla": {
-    "modified": "2020-07-16T22:36:38.280Z",
-    "contributors": [
-      "picandocodigo"
-    ]
-  },
   "Tools/Tools_Toolbox": {
     "modified": "2020-07-16T22:35:26.877Z",
     "contributors": [
@@ -5915,18 +2988,6 @@
       "JeidyVega"
     ]
   },
-  "Tools/Web_Console/Iniciando_la_Consola_Web": {
-    "modified": "2020-07-16T22:34:17.075Z",
-    "contributors": [
-      "JonoyeMasuso"
-    ]
-  },
-  "Tools/Web_Console/La_línea_de_comandos_del_intérprete": {
-    "modified": "2020-08-27T20:06:30.290Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
   "Tools/Working_with_iframes": {
     "modified": "2020-07-16T22:36:11.768Z",
     "contributors": [
@@ -5939,91 +3000,6 @@
       "Anibalismo"
     ]
   },
-  "Traducir_las_descripciones_de_las_extensiones": {
-    "modified": "2019-03-23T23:53:33.332Z",
-    "contributors": [
-      "teoli",
-      "Nukeador",
-      "Sebastianzartner@gmx.de",
-      "D20v02d",
-      "Mgjbot"
-    ]
-  },
-  "Traducir_una_extensión": {
-    "modified": "2019-03-23T23:57:54.041Z",
-    "contributors": [
-      "Sebastianz",
-      "teoli",
-      "Sheppy",
-      "gironlievanos",
-      "Mgjbot",
-      "Superruzafa"
-    ]
-  },
-  "Trazado_de_una_tabla_HTML_mediante_JavaScript_y_la_Interface_DOM": {
-    "modified": "2019-03-23T23:20:26.633Z",
-    "contributors": [
-      "lajaso",
-      "jucazam",
-      "pablo.turati"
-    ]
-  },
-  "Usando_archivos_desde_aplicaciones_web": {
-    "modified": "2019-03-24T00:07:10.927Z",
-    "contributors": [
-      "SphinxKnight",
-      "AngelFQC",
-      "StripTM",
-      "Izel",
-      "deimidis",
-      "maedca"
-    ]
-  },
-  "Usar_XPInstall_para_instalar_plugins": {
-    "modified": "2019-01-16T16:11:23.781Z",
-    "contributors": [
-      "Superruzafa",
-      "Fedora-core",
-      "Floot"
-    ]
-  },
-  "Usar_código_de_Mozilla_en_otros_proyectos": {
-    "modified": "2019-03-24T00:09:00.370Z",
-    "contributors": [
-      "maedca",
-      "inma_610"
-    ]
-  },
-  "Usar_web_workers": {
-    "modified": "2019-03-24T00:07:32.918Z",
-    "contributors": [
-      "teoli",
-      "ajimix",
-      "inma_610"
-    ]
-  },
-  "Using_the_W3C_DOM_Level_1_Core": {
-    "modified": "2019-12-13T21:06:41.403Z",
-    "contributors": [
-      "wbamberg",
-      "jswisher"
-    ]
-  },
-  "Uso_del_núcleo_del_nivel_1_del_DOM": {
-    "modified": "2019-12-13T21:10:23.918Z",
-    "contributors": [
-      "wbamberg",
-      "broxmgs",
-      "Superruzafa",
-      "Jorolo"
-    ]
-  },
-  "Vigilar_plugins": {
-    "modified": "2019-01-16T15:35:57.481Z",
-    "contributors": [
-      "HenryGR"
-    ]
-  },
   "Web": {
     "modified": "2020-11-28T21:26:15.631Z",
     "contributors": [
@@ -6057,27 +3033,6 @@
       "Sheppy"
     ]
   },
-  "Web/API/API_de_almacenamiento_web": {
-    "modified": "2019-03-23T22:46:51.819Z",
-    "contributors": [
-      "fherce",
-      "AlePerez92",
-      "VictorAbdon"
-    ]
-  },
-  "Web/API/API_de_almacenamiento_web/Usando_la_API_de_almacenamiento_web": {
-    "modified": "2020-08-14T20:09:18.391Z",
-    "contributors": [
-      "Enesimus",
-      "fherce"
-    ]
-  },
-  "Web/API/API_del_portapapeles": {
-    "modified": "2020-10-15T22:31:40.101Z",
-    "contributors": [
-      "gato"
-    ]
-  },
   "Web/API/AbstractWorker": {
     "modified": "2019-12-20T01:50:52.328Z",
     "contributors": [
@@ -6109,12 +3064,6 @@
       "IngoBongo"
     ]
   },
-  "Web/API/Animation/Animación": {
-    "modified": "2019-03-23T22:05:09.399Z",
-    "contributors": [
-      "IngoBongo"
-    ]
-  },
   "Web/API/Animation/cancel": {
     "modified": "2019-03-23T22:04:37.170Z",
     "contributors": [
@@ -6194,18 +3143,6 @@
       "IngoBongo"
     ]
   },
-  "Web/API/Animation/terminado": {
-    "modified": "2019-03-23T22:05:06.573Z",
-    "contributors": [
-      "IngoBongo"
-    ]
-  },
-  "Web/API/Animation/tiempoActual": {
-    "modified": "2019-03-23T22:05:12.506Z",
-    "contributors": [
-      "IngoBongo"
-    ]
-  },
   "Web/API/Animation/timeline": {
     "modified": "2019-03-23T22:04:30.790Z",
     "contributors": [
@@ -6556,12 +3493,6 @@
       "stephaniehobson"
     ]
   },
-  "Web/API/Canvas_API/Tutorial/Compositing/Ejemplo": {
-    "modified": "2019-03-18T21:36:04.043Z",
-    "contributors": [
-      "lajaso"
-    ]
-  },
   "Web/API/ChildNode": {
     "modified": "2019-03-29T14:12:39.589Z",
     "contributors": [
@@ -6669,12 +3600,6 @@
       "fcanellas"
     ]
   },
-  "Web/API/Console/tabla": {
-    "modified": "2019-03-23T22:20:30.589Z",
-    "contributors": [
-      "AlePerez92"
-    ]
-  },
   "Web/API/Console/time": {
     "modified": "2019-03-18T21:42:22.745Z",
     "contributors": [
@@ -6754,12 +3679,6 @@
       "jagomf"
     ]
   },
-  "Web/API/DOMString/Cadenas_binarias": {
-    "modified": "2020-08-29T03:33:22.030Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
   "Web/API/DataTransfer": {
     "modified": "2019-03-23T23:17:03.398Z",
     "contributors": [
@@ -6806,12 +3725,6 @@
       "DR"
     ]
   },
-  "Web/API/Document/abrir": {
-    "modified": "2020-10-15T22:31:23.051Z",
-    "contributors": [
-      "WillieMensa"
-    ]
-  },
   "Web/API/Document/adoptNode": {
     "modified": "2020-10-15T22:06:16.900Z",
     "contributors": [
@@ -6842,12 +3755,6 @@
       "DR"
     ]
   },
-  "Web/API/Document/async": {
-    "modified": "2019-03-23T22:57:43.989Z",
-    "contributors": [
-      "MauroEldritch"
-    ]
-  },
   "Web/API/Document/bgColor": {
     "modified": "2019-03-23T23:46:48.550Z",
     "contributors": [
@@ -6890,14 +3797,6 @@
       "MauroEldritch"
     ]
   },
-  "Web/API/Document/crearAtributo": {
-    "modified": "2020-10-15T21:55:08.825Z",
-    "contributors": [
-      "rodririobo",
-      "juanseromo12",
-      "FenixAlive"
-    ]
-  },
   "Web/API/Document/createDocumentFragment": {
     "modified": "2020-08-12T01:13:43.917Z",
     "contributors": [
@@ -7077,12 +3976,6 @@
       "Mgjbot"
     ]
   },
-  "Web/API/Document/getSelection": {
-    "modified": "2019-03-23T22:54:50.239Z",
-    "contributors": [
-      "Diferno"
-    ]
-  },
   "Web/API/Document/hasFocus": {
     "modified": "2019-03-23T23:53:13.498Z",
     "contributors": [
@@ -7139,12 +4032,6 @@
       "gabojkz"
     ]
   },
-  "Web/API/Document/pointerLockElement": {
-    "modified": "2019-03-23T22:05:31.350Z",
-    "contributors": [
-      "arquigames"
-    ]
-  },
   "Web/API/Document/querySelector": {
     "modified": "2019-03-23T22:58:51.923Z",
     "contributors": [
@@ -7196,15 +4083,6 @@
       "Thargelion"
     ]
   },
-  "Web/API/Document/styleSheets": {
-    "modified": "2019-03-23T23:58:05.224Z",
-    "contributors": [
-      "fscholz",
-      "jsx",
-      "teoli",
-      "HenryGR"
-    ]
-  },
   "Web/API/Document/write": {
     "modified": "2019-03-23T22:26:37.503Z",
     "contributors": [
@@ -7252,12 +4130,6 @@
       "Nathymig"
     ]
   },
-  "Web/API/Element/accessKey": {
-    "modified": "2019-03-23T22:26:12.172Z",
-    "contributors": [
-      "SoftwareRVG"
-    ]
-  },
   "Web/API/Element/animate": {
     "modified": "2019-03-23T22:26:03.841Z",
     "contributors": [
@@ -7477,37 +4349,12 @@
       "marydn"
     ]
   },
-  "Web/API/Element/name": {
-    "modified": "2019-03-23T22:26:11.317Z",
-    "contributors": [
-      "SoftwareRVG"
-    ]
-  },
   "Web/API/Element/namespaceURI": {
     "modified": "2019-03-23T22:25:51.573Z",
     "contributors": [
       "SoftwareRVG"
     ]
   },
-  "Web/API/Element/ongotpointercapture": {
-    "modified": "2019-03-23T22:25:49.346Z",
-    "contributors": [
-      "SoftwareRVG"
-    ]
-  },
-  "Web/API/Element/onlostpointercapture": {
-    "modified": "2019-03-23T22:25:49.190Z",
-    "contributors": [
-      "SoftwareRVG"
-    ]
-  },
-  "Web/API/Element/onwheel": {
-    "modified": "2019-03-18T21:09:09.483Z",
-    "contributors": [
-      "fscholz",
-      "SoftwareRVG"
-    ]
-  },
   "Web/API/Element/outerHTML": {
     "modified": "2019-03-23T22:32:38.203Z",
     "contributors": [
@@ -7640,13 +4487,6 @@
       "PRDeving"
     ]
   },
-  "Web/API/ElementosHTMLparaVideo": {
-    "modified": "2019-06-22T13:44:40.927Z",
-    "contributors": [
-      "Santi72Alc",
-      "myrnafig"
-    ]
-  },
   "Web/API/Event": {
     "modified": "2019-03-24T00:00:03.889Z",
     "contributors": [
@@ -7688,12 +4528,6 @@
       "HenryGR"
     ]
   },
-  "Web/API/Event/createEvent": {
-    "modified": "2019-03-23T22:01:26.841Z",
-    "contributors": [
-      "AlePerez92"
-    ]
-  },
   "Web/API/Event/currentTarget": {
     "modified": "2020-10-15T21:56:21.779Z",
     "contributors": [
@@ -7841,32 +4675,6 @@
       "enlinea777"
     ]
   },
-  "Web/API/Fetch_API/Conceptos_basicos": {
-    "modified": "2019-03-18T21:24:00.327Z",
-    "contributors": [
-      "IsraelFloresDGA"
-    ]
-  },
-  "Web/API/Fetch_API/Utilizando_Fetch": {
-    "modified": "2020-12-08T11:29:15.934Z",
-    "contributors": [
-      "mondeja",
-      "arturojimenezmedia",
-      "camsa",
-      "jccuevas",
-      "MateoVelilla",
-      "crimoniv",
-      "danielM9521",
-      "SphinxKnight",
-      "Ruluk",
-      "jpuerto",
-      "baumannzone",
-      "anjerago",
-      "icedrek",
-      "royexr",
-      "AlePerez92"
-    ]
-  },
   "Web/API/File": {
     "modified": "2020-10-15T21:37:53.420Z",
     "contributors": [
@@ -8163,14 +4971,6 @@
       "AlePerez92"
     ]
   },
-  "Web/API/GlobalEventHandlers/onunload": {
-    "modified": "2019-03-23T23:39:28.498Z",
-    "contributors": [
-      "fscholz",
-      "khalid32",
-      "Sheppy"
-    ]
-  },
   "Web/API/HTMLAnchorElement": {
     "modified": "2019-03-18T21:42:27.257Z",
     "contributors": [
@@ -8287,24 +5087,6 @@
       "lauramacdaleno"
     ]
   },
-  "Web/API/HTMLElement/dataset": {
-    "modified": "2020-10-15T22:06:35.887Z",
-    "contributors": [
-      "OneLoneFox",
-      "PacoVela",
-      "ultraklon",
-      "pipepico",
-      "AlePerez92"
-    ]
-  },
-  "Web/API/HTMLElement/focus": {
-    "modified": "2020-10-15T21:51:27.517Z",
-    "contributors": [
-      "IsraelFloresDGA",
-      "AlePerez92",
-      "jesumv"
-    ]
-  },
   "Web/API/HTMLElement/innerText": {
     "modified": "2020-10-15T22:31:46.481Z",
     "contributors": [
@@ -8355,16 +5137,6 @@
       "jvas28"
     ]
   },
-  "Web/API/HTMLElement/style": {
-    "modified": "2019-03-23T23:58:09.934Z",
-    "contributors": [
-      "SphinxKnight",
-      "fscholz",
-      "khalid32",
-      "teoli",
-      "HenryGR"
-    ]
-  },
   "Web/API/HTMLFormElement": {
     "modified": "2019-03-23T23:46:38.218Z",
     "contributors": [
@@ -8645,32 +5417,6 @@
       "MPoli"
     ]
   },
-  "Web/API/IndexedDB_API/Conceptos_Basicos_Detras_De_IndexedDB": {
-    "modified": "2020-01-13T04:48:11.759Z",
-    "contributors": [
-      "chrisdavidmills",
-      "fscholz",
-      "elin3t",
-      "sebasmagri"
-    ]
-  },
-  "Web/API/IndexedDB_API/Usando_IndexedDB": {
-    "modified": "2020-01-13T04:48:12.209Z",
-    "contributors": [
-      "chrisdavidmills",
-      "gama",
-      "Pcost8300",
-      "franvalmo",
-      "frank-orellana",
-      "otif11",
-      "urbanogb",
-      "AlePerez92",
-      "beatriz-merino",
-      "matajm",
-      "elin3t",
-      "maparrar"
-    ]
-  },
   "Web/API/Intersection_Observer_API": {
     "modified": "2020-11-03T00:26:14.370Z",
     "contributors": [
@@ -8927,22 +5673,6 @@
       "Gnuxdar"
     ]
   },
-  "Web/API/NavigatorGeolocation": {
-    "modified": "2019-03-23T23:01:31.642Z",
-    "contributors": [
-      "fscholz"
-    ]
-  },
-  "Web/API/NavigatorGeolocation/geolocation": {
-    "modified": "2019-03-23T23:31:55.176Z",
-    "contributors": [
-      "jabarrioss",
-      "AlePerez92",
-      "fscholz",
-      "jsx",
-      "lfentanes"
-    ]
-  },
   "Web/API/NavigatorLanguage": {
     "modified": "2019-03-23T22:46:20.556Z",
     "contributors": [
@@ -8962,16 +5692,6 @@
       "abbycar"
     ]
   },
-  "Web/API/NavigatorOnLine/Eventos_online_y_offline": {
-    "modified": "2019-01-16T15:46:38.836Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Mgjbot",
-      "Nukeador",
-      "RickieesES",
-      "Unixcoder"
-    ]
-  },
   "Web/API/NavigatorOnLine/onLine": {
     "modified": "2019-03-23T22:07:34.200Z",
     "contributors": [
@@ -9022,29 +5742,12 @@
       "AlePerez92"
     ]
   },
-  "Web/API/Node/elementoPadre": {
-    "modified": "2020-10-15T21:55:42.512Z",
-    "contributors": [
-      "AlePerez92",
-      "LRojas",
-      "tureey"
-    ]
-  },
   "Web/API/Node/hasChildNodes": {
     "modified": "2020-10-15T22:08:41.278Z",
     "contributors": [
       "AlePerez92"
     ]
   },
-  "Web/API/Node/insertarAntes": {
-    "modified": "2020-10-15T21:36:49.326Z",
-    "contributors": [
-      "AlePerez92",
-      "danvao",
-      "Sedoy",
-      "carpasse"
-    ]
-  },
   "Web/API/Node/isSameNode": {
     "modified": "2019-03-23T22:49:05.364Z",
     "contributors": [
@@ -9097,12 +5800,6 @@
       "tureey"
     ]
   },
-  "Web/API/Node/nodoPrincipal": {
-    "modified": "2019-03-23T22:08:57.260Z",
-    "contributors": [
-      "tureey"
-    ]
-  },
   "Web/API/Node/ownerDocument": {
     "modified": "2019-10-09T11:24:36.349Z",
     "contributors": [
@@ -9187,13 +5884,6 @@
       "david_ross"
     ]
   },
-  "Web/API/Notifications_API/Usando_la_API_de_Notificaciones": {
-    "modified": "2020-04-11T06:35:05.696Z",
-    "contributors": [
-      "davidelx",
-      "IXTRUnai"
-    ]
-  },
   "Web/API/ParentNode": {
     "modified": "2019-03-23T22:43:20.773Z",
     "contributors": [
@@ -9332,12 +6022,6 @@
       "mautematico"
     ]
   },
-  "Web/API/Push_API/Using_the_Push_API": {
-    "modified": "2019-03-23T22:19:10.252Z",
-    "contributors": [
-      "YulianD"
-    ]
-  },
   "Web/API/RTCPeerConnection": {
     "modified": "2019-03-18T21:43:02.717Z",
     "contributors": [
@@ -9357,20 +6041,6 @@
       "qwerty726"
     ]
   },
-  "Web/API/RandomSource": {
-    "modified": "2019-03-23T22:25:15.548Z",
-    "contributors": [
-      "Jeremie"
-    ]
-  },
-  "Web/API/RandomSource/Obtenervaloresaleatorios": {
-    "modified": "2020-10-15T21:49:57.084Z",
-    "contributors": [
-      "hecmonter",
-      "joseluisq",
-      "julianmoji"
-    ]
-  },
   "Web/API/Range": {
     "modified": "2019-03-23T23:47:18.258Z",
     "contributors": [
@@ -9670,15 +6340,6 @@
       "Sebastianz"
     ]
   },
-  "Web/API/Storage/LocalStorage": {
-    "modified": "2020-07-20T09:10:56.525Z",
-    "contributors": [
-      "LucasMaciasAtala",
-      "moniqaveiga",
-      "Andresrodart",
-      "lsphantom"
-    ]
-  },
   "Web/API/Storage/clear": {
     "modified": "2019-03-23T22:26:00.358Z",
     "contributors": [
@@ -9820,12 +6481,6 @@
       "joseluisq"
     ]
   },
-  "Web/API/SubtleCrypto/encrypt": {
-    "modified": "2020-10-15T22:27:29.781Z",
-    "contributors": [
-      "joseluisq"
-    ]
-  },
   "Web/API/TextTrack": {
     "modified": "2020-10-15T22:33:08.345Z",
     "contributors": [
@@ -9957,13 +6612,6 @@
       "Jorge0309"
     ]
   },
-  "Web/API/WebGL_API/Tutorial/Objetos_3D_utilizando_WebGL": {
-    "modified": "2019-03-23T22:37:32.127Z",
-    "contributors": [
-      "asarch",
-      "Giovan"
-    ]
-  },
   "Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL": {
     "modified": "2020-05-29T05:02:06.384Z",
     "contributors": [
@@ -9971,13 +6619,6 @@
       "Giovan"
     ]
   },
-  "Web/API/WebGL_API/Tutorial/Wtilizando_texturas_en_WebGL": {
-    "modified": "2019-03-23T22:15:44.225Z",
-    "contributors": [
-      "BubuAnabelas",
-      "marce_1994"
-    ]
-  },
   "Web/API/WebRTC_API": {
     "modified": "2020-05-01T03:28:58.714Z",
     "contributors": [
@@ -10025,27 +6666,6 @@
       "mserracaldentey"
     ]
   },
-  "Web/API/WebSockets_API/Escribiendo_servidor_WebSocket": {
-    "modified": "2019-05-21T02:54:42.354Z",
-    "contributors": [
-      "SphinxKnight",
-      "manueljrs",
-      "Yantup",
-      "jjmontes"
-    ]
-  },
-  "Web/API/WebSockets_API/Escribiendo_servidores_con_WebSocket": {
-    "modified": "2019-06-21T20:55:28.443Z",
-    "contributors": [
-      "alesalva",
-      "SphinxKnight",
-      "juanmanuelramallo",
-      "8manuel",
-      "llekn",
-      "jjmontes",
-      "augus1990"
-    ]
-  },
   "Web/API/WebSockets_API/Writing_WebSocket_client_applications": {
     "modified": "2019-05-21T02:54:42.026Z",
     "contributors": [
@@ -10090,24 +6710,12 @@
       "haxdai"
     ]
   },
-  "Web/API/Web_Crypto_API/Checking_authenticity_with_password": {
-    "modified": "2019-03-23T22:10:43.026Z",
-    "contributors": [
-      "haxdai"
-    ]
-  },
   "Web/API/Web_Speech_API": {
     "modified": "2020-10-15T22:29:46.339Z",
     "contributors": [
       "dianarryanti707"
     ]
   },
-  "Web/API/Web_Speech_API/Uso_de_la_Web_Speech_API": {
-    "modified": "2020-05-10T18:32:28.954Z",
-    "contributors": [
-      "mcarou"
-    ]
-  },
   "Web/API/Web_Workers_API": {
     "modified": "2020-04-14T23:36:47.242Z",
     "contributors": [
@@ -10145,12 +6753,6 @@
       "Mgjbot"
     ]
   },
-  "Web/API/Window/URL": {
-    "modified": "2019-03-23T22:38:17.598Z",
-    "contributors": [
-      "israelfl"
-    ]
-  },
   "Web/API/Window/alert": {
     "modified": "2019-03-23T22:27:29.008Z",
     "contributors": [
@@ -10461,28 +7063,6 @@
       "UshioSan"
     ]
   },
-  "Web/API/WindowBase64": {
-    "modified": "2019-03-23T23:03:15.466Z",
-    "contributors": [
-      "teoli"
-    ]
-  },
-  "Web/API/WindowBase64/Base64_codificando_y_decodificando": {
-    "modified": "2020-10-08T22:36:13.676Z",
-    "contributors": [
-      "kevinandresviedmanlopez",
-      "carloscasalar",
-      "Arukantara",
-      "sathyasanles"
-    ]
-  },
-  "Web/API/WindowBase64/atob": {
-    "modified": "2019-03-23T23:03:12.715Z",
-    "contributors": [
-      "fscholz",
-      "sathyasanles"
-    ]
-  },
   "Web/API/WindowEventHandlers": {
     "modified": "2019-03-23T23:01:29.892Z",
     "contributors": [
@@ -10549,47 +7129,6 @@
       "ivannieto"
     ]
   },
-  "Web/API/WindowTimers": {
-    "modified": "2019-03-23T23:01:30.065Z",
-    "contributors": [
-      "fscholz"
-    ]
-  },
-  "Web/API/WindowTimers/clearInterval": {
-    "modified": "2019-03-23T22:56:16.485Z",
-    "contributors": [
-      "Guitxo"
-    ]
-  },
-  "Web/API/WindowTimers/clearTimeout": {
-    "modified": "2019-06-18T10:20:27.972Z",
-    "contributors": [
-      "AlePerez92",
-      "fscholz",
-      "basemnassar11",
-      "VictorArias"
-    ]
-  },
-  "Web/API/WindowTimers/setInterval": {
-    "modified": "2020-08-24T18:02:23.092Z",
-    "contributors": [
-      "mastertrooper",
-      "Makinita",
-      "Klius",
-      "claudionebbia"
-    ]
-  },
-  "Web/API/WindowTimers/setTimeout": {
-    "modified": "2019-03-23T23:17:29.378Z",
-    "contributors": [
-      "BubuAnabelas",
-      "vltamara",
-      "nauj27",
-      "fscholz",
-      "AshfaqHossain",
-      "VictorArias"
-    ]
-  },
   "Web/API/Worker": {
     "modified": "2019-03-23T22:48:01.797Z",
     "contributors": [
@@ -10626,19 +7165,6 @@
       "Jorolo"
     ]
   },
-  "Web/API/XMLHttpRequest/FormData": {
-    "modified": "2020-10-15T21:22:58.694Z",
-    "contributors": [
-      "AlePerez92",
-      "vladimirbat",
-      "alvaromorenomorales",
-      "ojgarciab",
-      "Sheppy",
-      "AngelFQC",
-      "wilo",
-      "marco_mucino"
-    ]
-  },
   "Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests": {
     "modified": "2019-03-23T22:05:30.902Z",
     "contributors": [
@@ -10757,65 +7283,6 @@
       "Davdriver"
     ]
   },
-  "Web/Accesibilidad": {
-    "modified": "2020-09-22T14:24:03.363Z",
-    "contributors": [
-      "FranciscoImanolSuarez",
-      "Gummox",
-      "Mediavilladiezj",
-      "cisval",
-      "monserratcallejaalmazan",
-      "chmutoff",
-      "teoli",
-      "DoctorRomi",
-      "Mgjbot",
-      "Jorolo",
-      "Lowprofile",
-      "Wikier",
-      "Nukeador",
-      "Gonzobonzoo"
-    ]
-  },
-  "Web/Accesibilidad/Comunidad": {
-    "modified": "2019-03-23T23:41:25.430Z",
-    "contributors": [
-      "teoli",
-      "Jorolo"
-    ]
-  },
-  "Web/Accesibilidad/Understanding_WCAG": {
-    "modified": "2019-03-18T21:25:29.001Z",
-    "contributors": [
-      "evaferreira"
-    ]
-  },
-  "Web/Accesibilidad/Understanding_WCAG/Etiquetas_de_texto_y_nombres": {
-    "modified": "2020-05-21T19:43:48.950Z",
-    "contributors": [
-      "giioaj",
-      "IsraelFloresDGA"
-    ]
-  },
-  "Web/Accesibilidad/Understanding_WCAG/Perceivable": {
-    "modified": "2019-03-18T21:25:19.991Z",
-    "contributors": [
-      "evaferreira"
-    ]
-  },
-  "Web/Accesibilidad/Understanding_WCAG/Perceivable/Color_contraste": {
-    "modified": "2020-06-09T06:15:36.471Z",
-    "contributors": [
-      "11bits",
-      "apenab"
-    ]
-  },
-  "Web/Accesibilidad/Understanding_WCAG/Teclado": {
-    "modified": "2020-09-28T17:32:58.697Z",
-    "contributors": [
-      "megatux",
-      "IsraelFloresDGA"
-    ]
-  },
   "Web/Accessibility/ARIA": {
     "modified": "2019-03-23T22:32:50.943Z",
     "contributors": [
@@ -10833,19 +7300,6 @@
       "chrisdavidmills"
     ]
   },
-  "Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_atributo_aria-required": {
-    "modified": "2019-08-28T11:54:04.515Z",
-    "contributors": [
-      "IsraelFloresDGA",
-      "Karla_Glez"
-    ]
-  },
-  "Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_rol_alertdialog": {
-    "modified": "2019-08-28T12:48:39.532Z",
-    "contributors": [
-      "IsraelFloresDGA"
-    ]
-  },
   "Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role": {
     "modified": "2019-03-18T21:31:32.978Z",
     "contributors": [
@@ -10872,25 +7326,6 @@
       "malonson"
     ]
   },
-  "Web/Accessibility/ARIA/forms/Etiquetas_complejas": {
-    "modified": "2019-11-27T15:16:55.571Z",
-    "contributors": [
-      "IsaacAaron",
-      "IsraelFloresDGA"
-    ]
-  },
-  "Web/Accessibility/ARIA/forms/alertas": {
-    "modified": "2020-08-13T01:22:34.331Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/Accessibility/ARIA/forms/consejos_basicos_para_formularios": {
-    "modified": "2019-03-18T21:22:07.007Z",
-    "contributors": [
-      "IsraelFloresDGA"
-    ]
-  },
   "Web/CSS": {
     "modified": "2020-10-25T05:19:47.416Z",
     "contributors": [
@@ -10932,32 +7367,6 @@
       "jemilionautoch"
     ]
   },
-  "Web/CSS/-moz-box-flex": {
-    "modified": "2019-03-23T22:36:18.128Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
-  "Web/CSS/-moz-box-ordinal-group": {
-    "modified": "2019-03-23T22:36:12.257Z",
-    "contributors": [
-      "pekechis"
-    ]
-  },
-  "Web/CSS/-moz-box-pack": {
-    "modified": "2019-03-23T22:36:13.348Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
-  "Web/CSS/-moz-cell": {
-    "modified": "2019-03-23T22:35:57.612Z",
-    "contributors": [
-      "pekechis"
-    ]
-  },
   "Web/CSS/-moz-context-properties": {
     "modified": "2020-10-15T22:13:14.061Z",
     "contributors": [
@@ -10970,12 +7379,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/-moz-font-language-override": {
-    "modified": "2019-03-23T23:13:49.521Z",
-    "contributors": [
-      "martinezdario55"
-    ]
-  },
   "Web/CSS/-moz-force-broken-image-icon": {
     "modified": "2019-03-23T23:21:21.736Z",
     "contributors": [
@@ -11050,13 +7453,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/-moz-user-modify": {
-    "modified": "2019-03-23T22:35:48.381Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
   "Web/CSS/-webkit-border-before": {
     "modified": "2019-03-23T22:35:46.245Z",
     "contributors": [
@@ -11071,12 +7467,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/-webkit-mask": {
-    "modified": "2019-03-23T22:35:50.079Z",
-    "contributors": [
-      "pekechis"
-    ]
-  },
   "Web/CSS/-webkit-mask-attachment": {
     "modified": "2019-03-23T22:35:53.127Z",
     "contributors": [
@@ -11091,41 +7481,12 @@
       "pekechis"
     ]
   },
-  "Web/CSS/-webkit-mask-clip": {
-    "modified": "2019-03-23T22:35:47.057Z",
-    "contributors": [
-      "pekechis"
-    ]
-  },
   "Web/CSS/-webkit-mask-composite": {
     "modified": "2019-03-23T22:35:49.602Z",
     "contributors": [
       "pekechis"
     ]
   },
-  "Web/CSS/-webkit-mask-image": {
-    "modified": "2019-03-23T22:35:45.973Z",
-    "contributors": [
-      "hectorcano",
-      "pekechis"
-    ]
-  },
-  "Web/CSS/-webkit-mask-origin": {
-    "modified": "2019-03-23T22:35:46.533Z",
-    "contributors": [
-      "pekechis"
-    ]
-  },
-  "Web/CSS/-webkit-mask-position": {
-    "modified": "2019-03-23T22:38:37.922Z",
-    "contributors": [
-      "teoli",
-      "Simplexible",
-      "Prinz_Rana",
-      "pekechis",
-      "Kuiki"
-    ]
-  },
   "Web/CSS/-webkit-mask-position-x": {
     "modified": "2019-03-23T22:34:17.919Z",
     "contributors": [
@@ -11140,12 +7501,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/-webkit-mask-repeat": {
-    "modified": "2019-03-23T22:35:46.401Z",
-    "contributors": [
-      "pekechis"
-    ]
-  },
   "Web/CSS/-webkit-mask-repeat-x": {
     "modified": "2019-03-23T22:34:04.348Z",
     "contributors": [
@@ -11301,13 +7656,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/:-moz-placeholder": {
-    "modified": "2019-03-23T22:33:30.015Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
   "Web/CSS/:-moz-submit-invalid": {
     "modified": "2019-03-23T22:33:36.639Z",
     "contributors": [
@@ -11320,13 +7668,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/:-moz-ui-invalid": {
-    "modified": "2019-03-23T22:30:48.940Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
   "Web/CSS/:-moz-ui-valid": {
     "modified": "2019-03-23T22:29:23.305Z",
     "contributors": [
@@ -11347,20 +7688,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/:-ms-input-placeholder": {
-    "modified": "2019-03-23T22:29:24.542Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
-  "Web/CSS/:-webkit-autofill": {
-    "modified": "2019-03-23T22:29:31.809Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
   "Web/CSS/::-moz-color-swatch": {
     "modified": "2020-10-15T22:13:15.247Z",
     "contributors": [
@@ -11381,13 +7708,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/::-moz-placeholder": {
-    "modified": "2019-03-23T22:29:22.118Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
   "Web/CSS/::-moz-progress-bar": {
     "modified": "2019-03-23T22:29:21.640Z",
     "contributors": [
@@ -11423,13 +7743,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/::-webkit-file-upload-button": {
-    "modified": "2019-03-18T21:21:36.190Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
   "Web/CSS/::-webkit-inner-spin-button": {
     "modified": "2019-03-18T21:17:13.569Z",
     "contributors": [
@@ -11437,13 +7750,6 @@
       "pekechis"
     ]
   },
-  "Web/CSS/::-webkit-input-placeholder": {
-    "modified": "2019-03-18T21:16:20.006Z",
-    "contributors": [
-      "teoli",
-      "pekechis"
-    ]
-  },
   "Web/CSS/::-webkit-meter-bar": {
     "modified": "2019-03-23T22:27:21.551Z",
     "contributors": [
@@ -11614,12 +7920,6 @@
       "MrBlogger"
     ]
   },
-  "Web/CSS/:any": {
-    "modified": "2019-03-23T22:17:18.601Z",
-    "contributors": [
-      "israel-munoz"
-    ]
-  },
   "Web/CSS/:any-link": {
     "modified": "2020-10-15T21:52:30.387Z",
     "contributors": [
@@ -11827,16 +8127,6 @@
       "Jhonatangiraldo"
     ]
   },
-  "Web/CSS/:not()": {
-    "modified": "2020-11-30T09:54:17.195Z",
-    "contributors": [
-      "blanchart",
-      "lajaso",
-      "teoli",
-      "jotadeaa",
-      "luisgagocasas"
-    ]
-  },
   "Web/CSS/:nth-child": {
     "modified": "2020-10-15T21:20:38.559Z",
     "contributors": [
@@ -12068,12 +8358,6 @@
       "sanathy"
     ]
   },
-  "Web/CSS/@media/altura": {
-    "modified": "2020-10-15T22:23:38.815Z",
-    "contributors": [
-      "IsraelFloresDGA"
-    ]
-  },
   "Web/CSS/@media/color": {
     "modified": "2019-03-18T21:15:44.481Z",
     "contributors": [
@@ -12098,12 +8382,6 @@
       "qwerty726"
     ]
   },
-  "Web/CSS/@media/resolución": {
-    "modified": "2019-03-23T22:38:40.675Z",
-    "contributors": [
-      "Conradin88"
-    ]
-  },
   "Web/CSS/@media/width": {
     "modified": "2019-03-23T22:04:44.569Z",
     "contributors": [
@@ -12137,18 +8415,6 @@
       "cvrebert"
     ]
   },
-  "Web/CSS/@viewport/height": {
-    "modified": "2019-03-18T21:38:59.253Z",
-    "contributors": [
-      "israel-munoz"
-    ]
-  },
-  "Web/CSS/@viewport/width": {
-    "modified": "2019-03-18T21:16:26.082Z",
-    "contributors": [
-      "israel-munoz"
-    ]
-  },
   "Web/CSS/At-rule": {
     "modified": "2019-03-23T22:29:55.371Z",
     "contributors": [
@@ -12162,14 +8428,6 @@
       "teoli"
     ]
   },
-  "Web/CSS/CSS_Animations/Detectar_soporte_de_animación_CSS": {
-    "modified": "2019-03-23T22:41:48.122Z",
-    "contributors": [
-      "wbamberg",
-      "CristhianLora1",
-      "DracotMolver"
-    ]
-  },
   "Web/CSS/CSS_Animations/Tips": {
     "modified": "2020-08-16T13:05:40.057Z",
     "contributors": [
@@ -12178,61 +8436,12 @@
       "AlbertoVargasMoreno"
     ]
   },
-  "Web/CSS/CSS_Animations/Usando_animaciones_CSS": {
-    "modified": "2020-07-06T16:16:21.887Z",
-    "contributors": [
-      "Jazperist",
-      "miguelgilmartinez",
-      "fermelli",
-      "GasGen",
-      "KattyaCuevas",
-      "rod232",
-      "Jvalenz1982",
-      "SphinxKnight",
-      "teoli",
-      "onerbs",
-      "Luis_Calvo",
-      "ulisescab"
-    ]
-  },
-  "Web/CSS/CSS_Background_and_Borders": {
-    "modified": "2019-03-23T22:41:48.399Z",
-    "contributors": [
-      "teoli"
-    ]
-  },
-  "Web/CSS/CSS_Background_and_Borders/Border-image_generador": {
-    "modified": "2019-03-23T22:41:48.777Z",
-    "contributors": [
-      "teoli",
-      "mcclone2001"
-    ]
-  },
   "Web/CSS/CSS_Background_and_Borders/Border-radius_generator": {
     "modified": "2019-03-18T21:15:42.476Z",
     "contributors": [
       "israel-munoz"
     ]
   },
-  "Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds": {
-    "modified": "2019-03-23T22:17:03.740Z",
-    "contributors": [
-      "israel-munoz"
-    ]
-  },
-  "Web/CSS/CSS_Colors": {
-    "modified": "2019-03-23T22:23:30.277Z",
-    "contributors": [
-      "betelleclerc",
-      "Krenair"
-    ]
-  },
-  "Web/CSS/CSS_Colors/Herramienta_para_seleccionar_color": {
-    "modified": "2019-03-23T22:23:27.596Z",
-    "contributors": [
-      "elihro"
-    ]
-  },
   "Web/CSS/CSS_Containment": {
     "modified": "2020-10-21T02:39:25.867Z",
     "contributors": [
@@ -12266,45 +8475,6 @@
       "tonyrodz"
     ]
   },
-  "Web/CSS/CSS_Flexible_Box_Layout/Casos_de_uso_tipicos_de_Flexbox.": {
-    "modified": "2019-03-18T21:18:33.523Z",
-    "contributors": [
-      "danpaltor"
-    ]
-  },
-  "Web/CSS/CSS_Flexible_Box_Layout/Conceptos_Basicos_de_Flexbox": {
-    "modified": "2020-03-25T21:15:58.856Z",
-    "contributors": [
-      "amazing79",
-      "otello1971",
-      "cwalternicolas"
-    ]
-  },
-  "Web/CSS/CSS_Flexible_Box_Layout/Usando_flexbox_para_componer_aplicaciones_web": {
-    "modified": "2019-03-23T22:31:07.427Z",
-    "contributors": [
-      "miguelsp"
-    ]
-  },
-  "Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS": {
-    "modified": "2019-05-15T19:01:41.614Z",
-    "contributors": [
-      "luzbelmex",
-      "VictorSan45",
-      "NeXuZZ-SCM",
-      "Tonylu11",
-      "javier_junin",
-      "AlePerez92",
-      "MMariscal",
-      "fscholz",
-      "ArcangelZith",
-      "FNK",
-      "rippe2hl",
-      "StripTM",
-      "joan.leon",
-      "arturo_sanz"
-    ]
-  },
   "Web/CSS/CSS_Flow_Layout": {
     "modified": "2019-03-18T21:21:28.417Z",
     "contributors": [
@@ -12347,32 +8517,12 @@
       "blanchart"
     ]
   },
-  "Web/CSS/CSS_Grid_Layout/Conceptos_Básicos_del_Posicionamiento_con_Rejillas": {
-    "modified": "2019-10-01T23:38:23.285Z",
-    "contributors": [
-      "jcastillaingeniero",
-      "amaiafilo",
-      "IsraelFloresDGA",
-      "jorgemontoyab"
-    ]
-  },
   "Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout": {
     "modified": "2019-03-18T21:34:10.349Z",
     "contributors": [
       "amaiafilo"
     ]
   },
-  "Web/CSS/CSS_Grid_Layout/Relacion_de_Grid_Layout": {
-    "modified": "2019-12-18T12:24:17.824Z",
-    "contributors": [
-      "amazing79",
-      "natalygiraldo",
-      "amaiafilo",
-      "TavoTrash",
-      "aribet",
-      "jorgemontoyab"
-    ]
-  },
   "Web/CSS/CSS_Logical_Properties": {
     "modified": "2019-03-18T21:11:22.321Z",
     "contributors": [
@@ -12386,12 +8536,6 @@
       "teffcode"
     ]
   },
-  "Web/CSS/CSS_Logical_Properties/Dimensionamiento": {
-    "modified": "2019-03-19T19:17:23.927Z",
-    "contributors": [
-      "teffcode"
-    ]
-  },
   "Web/CSS/CSS_Logical_Properties/Floating_and_positioning": {
     "modified": "2019-03-18T20:35:38.553Z",
     "contributors": [
@@ -12404,27 +8548,6 @@
       "teffcode"
     ]
   },
-  "Web/CSS/CSS_Modelo_Caja": {
-    "modified": "2019-03-23T22:37:33.458Z",
-    "contributors": [
-      "tipoqueno",
-      "pekechis"
-    ]
-  },
-  "Web/CSS/CSS_Modelo_Caja/Introducción_al_modelo_de_caja_de_CSS": {
-    "modified": "2019-08-28T10:35:24.055Z",
-    "contributors": [
-      "tipoqueno"
-    ]
-  },
-  "Web/CSS/CSS_Modelo_Caja/Mastering_margin_collapsing": {
-    "modified": "2019-03-23T22:32:15.462Z",
-    "contributors": [
-      "amaiafilo",
-      "Ralexhx",
-      "javichito"
-    ]
-  },
   "Web/CSS/CSS_Motion_Path": {
     "modified": "2020-10-15T22:26:49.512Z",
     "contributors": [
@@ -12438,69 +8561,12 @@
       "davidhbrown"
     ]
   },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index": {
-    "modified": "2019-03-18T20:42:17.583Z",
-    "contributors": [
-      "ChipTime",
-      "javichito"
-    ]
-  },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index": {
-    "modified": "2019-03-23T22:32:38.884Z",
-    "contributors": [
-      "javichito"
-    ]
-  },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float": {
-    "modified": "2019-04-26T07:22:46.044Z",
-    "contributors": [
-      "SphinxKnight",
-      "LaGallinaTuruleta",
-      "javichito"
-    ]
-  },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento": {
-    "modified": "2019-03-23T22:32:44.958Z",
-    "contributors": [
-      "javichito"
-    ]
-  },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index": {
-    "modified": "2019-03-23T22:32:47.571Z",
-    "contributors": [
-      "javichito"
-    ]
-  },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento": {
-    "modified": "2019-03-23T22:32:36.821Z",
-    "contributors": [
-      "javichito"
-    ]
-  },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento": {
-    "modified": "2019-03-23T22:32:34.821Z",
-    "contributors": [
-      "javichito"
-    ]
-  },
-  "Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento": {
-    "modified": "2019-03-23T22:32:30.208Z",
-    "contributors": [
-      "javichito"
-    ]
-  },
   "Web/CSS/CSS_Properties_Reference": {
     "modified": "2019-03-18T21:24:27.305Z",
     "contributors": [
       "pekechis"
     ]
   },
-  "Web/CSS/CSS_Reglas_Condicionales": {
-    "modified": "2019-03-23T22:05:34.864Z",
-    "contributors": [
-      "arnulfolg"
-    ]
-  },
   "Web/CSS/CSS_Transforms": {
     "modified": "2019-03-23T22:43:47.978Z",
     "contributors": [
@@ -12561,52 +8627,6 @@
       "israel-munoz"
     ]
   },
-  "Web/CSS/Columnas_CSS": {
-    "modified": "2019-03-23T22:28:10.699Z",
-    "contributors": [
-      "Anonymous"
-    ]
-  },
-  "Web/CSS/Comentarios": {
-    "modified": "2019-03-23T22:16:58.806Z",
-    "contributors": [
-      "israel-munoz"
-    ]
-  },
-  "Web/CSS/Comenzando_(tutorial_CSS)": {
-    "modified": "2019-03-23T23:39:37.048Z",
-    "contributors": [
-      "teoli",
-      "jsalinas"
-    ]
-  },
-  "Web/CSS/Como_iniciar": {
-    "modified": "2019-01-16T13:59:37.327Z",
-    "contributors": [
-      "teoli",
-      "Izel"
-    ]
-  },
-  "Web/CSS/Como_iniciar/Por_que_usar_CSS": {
-    "modified": "2019-03-23T23:39:38.906Z",
-    "contributors": [
-      "teoli",
-      "jsalinas"
-    ]
-  },
-  "Web/CSS/Como_iniciar/Que_es_CSS": {
-    "modified": "2019-03-24T00:11:28.788Z",
-    "contributors": [
-      "fernandomoreno605",
-      "DavidWebcreate",
-      "aguilarcarlos",
-      "teoli",
-      "LeoHirsch",
-      "dusvilopez",
-      "turekon",
-      "Izel"
-    ]
-  },
   "Web/CSS/Descendant_combinator": {
     "modified": "2019-03-23T23:13:24.480Z",
     "contributors": [
@@ -12614,52 +8634,6 @@
       "Makiber"
     ]
   },
-  "Web/CSS/Elemento_reemplazo": {
-    "modified": "2019-03-23T23:08:30.961Z",
-    "contributors": [
-      "jdbazagaruiz"
-    ]
-  },
-  "Web/CSS/Especificidad": {
-    "modified": "2020-11-14T17:11:45.294Z",
-    "contributors": [
-      "0neomar",
-      "fer",
-      "glrodasz",
-      "mariupereyra",
-      "arjusgit",
-      "DavidGalvis",
-      "gcjuan",
-      "LuisSevillano",
-      "deimidis2",
-      "aeroxmotion",
-      "padrecedano",
-      "Remohir"
-    ]
-  },
-  "Web/CSS/Gradiente": {
-    "modified": "2019-03-23T22:37:34.623Z",
-    "contributors": [
-      "devilkillermc",
-      "mym2013",
-      "Sebastianz",
-      "wizAmit",
-      "slayslot",
-      "Conradin88"
-    ]
-  },
-  "Web/CSS/Herramientas": {
-    "modified": "2019-03-23T22:28:04.142Z",
-    "contributors": [
-      "arturoblack"
-    ]
-  },
-  "Web/CSS/Herramientas/Cubic_Bezier_Generator": {
-    "modified": "2019-03-18T21:20:03.429Z",
-    "contributors": [
-      "gsalinase"
-    ]
-  },
   "Web/CSS/ID_selectors": {
     "modified": "2020-10-15T21:52:30.474Z",
     "contributors": [
@@ -12667,67 +8641,6 @@
       "israel-munoz"
     ]
   },
-  "Web/CSS/Introducción": {
-    "modified": "2019-03-24T00:09:12.368Z",
-    "contributors": [
-      "luismj",
-      "javierdp",
-      "teoli",
-      "inma_610"
-    ]
-  },
-  "Web/CSS/Introducción/Boxes": {
-    "modified": "2019-03-23T23:02:20.733Z",
-    "contributors": [
-      "albaluna"
-    ]
-  },
-  "Web/CSS/Introducción/Cascading_and_inheritance": {
-    "modified": "2019-03-23T23:02:26.342Z",
-    "contributors": [
-      "carlos.millan3",
-      "eljonims",
-      "mamptecnocrata",
-      "albaluna"
-    ]
-  },
-  "Web/CSS/Introducción/Color": {
-    "modified": "2019-03-23T22:59:44.751Z",
-    "contributors": [
-      "albaluna"
-    ]
-  },
-  "Web/CSS/Introducción/How_CSS_works": {
-    "modified": "2019-03-23T23:02:23.335Z",
-    "contributors": [
-      "mamptecnocrata",
-      "albaluna"
-    ]
-  },
-  "Web/CSS/Introducción/Layout": {
-    "modified": "2019-03-23T22:20:39.961Z",
-    "contributors": [
-      "lavilofam1"
-    ]
-  },
-  "Web/CSS/Introducción/Los:estilos_de_texto": {
-    "modified": "2019-03-23T23:02:09.062Z",
-    "contributors": [
-      "albaluna"
-    ]
-  },
-  "Web/CSS/Introducción/Media": {
-    "modified": "2019-03-18T21:15:11.297Z",
-    "contributors": [
-      "luismj"
-    ]
-  },
-  "Web/CSS/Introducción/Selectors": {
-    "modified": "2019-03-23T23:02:22.202Z",
-    "contributors": [
-      "albaluna"
-    ]
-  },
   "Web/CSS/Layout_cookbook": {
     "modified": "2019-03-18T21:22:35.394Z",
     "contributors": [
@@ -12755,20 +8668,6 @@
       "jota1410"
     ]
   },
-  "Web/CSS/Preguntas_frecuentes_sobre_CSS": {
-    "modified": "2020-07-16T22:25:44.798Z",
-    "contributors": [
-      "teoli",
-      "inma_610"
-    ]
-  },
-  "Web/CSS/Primeros_pasos": {
-    "modified": "2019-03-24T00:05:34.862Z",
-    "contributors": [
-      "teoli",
-      "deimidis"
-    ]
-  },
   "Web/CSS/Pseudo-classes": {
     "modified": "2020-02-22T08:04:35.419Z",
     "contributors": [
@@ -12779,80 +8678,6 @@
       "viro"
     ]
   },
-  "Web/CSS/Pseudoelementos": {
-    "modified": "2019-03-23T23:21:50.048Z",
-    "contributors": [
-      "BubuAnabelas",
-      "VictorAbdon",
-      "teoli",
-      "jota1410"
-    ]
-  },
-  "Web/CSS/Referencia_CSS": {
-    "modified": "2019-03-24T00:14:13.384Z",
-    "contributors": [
-      "lajaso",
-      "israel-munoz",
-      "joshitobuba",
-      "mrstork",
-      "prayash",
-      "malayaleecoder",
-      "teoli",
-      "tregagnon",
-      "inma_610",
-      "fscholz",
-      "Nukeador"
-    ]
-  },
-  "Web/CSS/Referencia_CSS/mix-blend-mode": {
-    "modified": "2020-10-15T21:37:53.265Z",
-    "contributors": [
-      "Undigon",
-      "mrstork",
-      "teoli",
-      "Sebastianz",
-      "msanz"
-    ]
-  },
-  "Web/CSS/Selectores_CSS": {
-    "modified": "2019-07-09T01:16:13.123Z",
-    "contributors": [
-      "missmakita",
-      "blanchart",
-      "Benji1337",
-      "metal-gogo",
-      "kikolevante"
-    ]
-  },
-  "Web/CSS/Selectores_CSS/Usando_la_pseudo-clase_:target_en_selectores": {
-    "modified": "2020-07-31T07:57:08.167Z",
-    "contributors": [
-      "blanchart",
-      "israel-munoz"
-    ]
-  },
-  "Web/CSS/Selectores_atributo": {
-    "modified": "2020-10-15T21:26:03.862Z",
-    "contributors": [
-      "blanchart",
-      "MoisesGuevara",
-      "lajaso",
-      "teoli",
-      "jota1410"
-    ]
-  },
-  "Web/CSS/Selectores_hermanos_adyacentes": {
-    "modified": "2019-03-23T22:39:30.908Z",
-    "contributors": [
-      "alkaithil"
-    ]
-  },
-  "Web/CSS/Selectores_hermanos_generales": {
-    "modified": "2019-03-23T22:39:33.429Z",
-    "contributors": [
-      "alkaithil"
-    ]
-  },
   "Web/CSS/Shorthand_properties": {
     "modified": "2019-08-11T12:52:52.844Z",
     "contributors": [
@@ -12862,15 +8687,6 @@
       "huichops"
     ]
   },
-  "Web/CSS/Sintaxis_definición_de_valor": {
-    "modified": "2019-03-23T22:38:52.899Z",
-    "contributors": [
-      "apazacoder",
-      "Sebastianz",
-      "Guillaume-Heras",
-      "VictorAbdon"
-    ]
-  },
   "Web/CSS/Syntax": {
     "modified": "2020-09-29T20:54:10.526Z",
     "contributors": [
@@ -12880,23 +8696,6 @@
       "Derhks"
     ]
   },
-  "Web/CSS/Texto_CSS": {
-    "modified": "2019-03-23T22:36:23.444Z",
-    "contributors": [
-      "pekechis"
-    ]
-  },
-  "Web/CSS/Transiciones_de_CSS": {
-    "modified": "2019-08-01T05:58:17.579Z",
-    "contributors": [
-      "chrisdavidmills",
-      "mrstork",
-      "alberdigital",
-      "teoli",
-      "inma_610",
-      "deimidis"
-    ]
-  },
   "Web/CSS/Tutorials": {
     "modified": "2019-03-23T22:52:34.225Z",
     "contributors": [
@@ -12930,24 +8729,6 @@
       "FlorTello"
     ]
   },
-  "Web/CSS/Valor_calculado": {
-    "modified": "2019-03-23T23:53:20.456Z",
-    "contributors": [
-      "teoli",
-      "Mgjbot",
-      "Firewordy",
-      "HenryGR"
-    ]
-  },
-  "Web/CSS/Valor_inicial": {
-    "modified": "2019-01-16T15:32:31.295Z",
-    "contributors": [
-      "teoli",
-      "Mgjbot",
-      "Nathymig",
-      "HenryGR"
-    ]
-  },
   "Web/CSS/actual_value": {
     "modified": "2019-03-23T22:16:54.955Z",
     "contributors": [
@@ -13083,15 +8864,6 @@
       "ismachine"
     ]
   },
-  "Web/CSS/auto": {
-    "modified": "2019-01-16T15:41:51.944Z",
-    "contributors": [
-      "teoli",
-      "Nathymig",
-      "HenryGR",
-      "Mgjbot"
-    ]
-  },
   "Web/CSS/backdrop-filter": {
     "modified": "2020-10-15T22:05:06.351Z",
     "contributors": [
@@ -13738,15 +9510,6 @@
       "Wrongloop"
     ]
   },
-  "Web/CSS/cursor/Uso_de_URL_como_valor_de_la_propiedad_cursor": {
-    "modified": "2019-03-24T00:04:04.275Z",
-    "contributors": [
-      "teoli",
-      "fscholz",
-      "Mgjbot",
-      "Jorolo"
-    ]
-  },
   "Web/CSS/direction": {
     "modified": "2019-01-16T15:40:27.790Z",
     "contributors": [
@@ -13806,12 +9569,6 @@
       "mjsorribas"
     ]
   },
-  "Web/CSS/filter-function/url": {
-    "modified": "2020-01-10T13:46:46.404Z",
-    "contributors": [
-      "roocce"
-    ]
-  },
   "Web/CSS/fit-content": {
     "modified": "2020-10-15T22:06:18.387Z",
     "contributors": [
@@ -14012,19 +9769,6 @@
       "deimidis2"
     ]
   },
-  "Web/CSS/grid-column-gap": {
-    "modified": "2020-10-15T22:01:06.788Z",
-    "contributors": [
-      "agarcilazo",
-      "klaufel"
-    ]
-  },
-  "Web/CSS/grid-gap": {
-    "modified": "2019-03-23T22:13:30.250Z",
-    "contributors": [
-      "ireneml.fr"
-    ]
-  },
   "Web/CSS/grid-template-areas": {
     "modified": "2019-03-23T22:11:49.454Z",
     "contributors": [
@@ -14406,14 +10150,6 @@
       "jorgemontoyab"
     ]
   },
-  "Web/CSS/normal": {
-    "modified": "2019-03-23T23:50:19.746Z",
-    "contributors": [
-      "teoli",
-      "FredB",
-      "HenryGR"
-    ]
-  },
   "Web/CSS/number": {
     "modified": "2019-03-23T23:53:45.345Z",
     "contributors": [
@@ -14581,14 +10317,6 @@
       "AngelFQC"
     ]
   },
-  "Web/CSS/porcentaje": {
-    "modified": "2019-03-23T23:25:05.075Z",
-    "contributors": [
-      "fscholz",
-      "teoli",
-      "aerotrink"
-    ]
-  },
   "Web/CSS/position": {
     "modified": "2020-10-15T21:15:59.180Z",
     "contributors": [
@@ -14641,14 +10369,6 @@
       "gonzalec"
     ]
   },
-  "Web/CSS/resolución": {
-    "modified": "2019-03-23T22:38:44.850Z",
-    "contributors": [
-      "Sebastianz",
-      "Prinz_Rana",
-      "Conradin88"
-    ]
-  },
   "Web/CSS/resolved_value": {
     "modified": "2019-03-23T22:16:57.498Z",
     "contributors": [
@@ -14667,13 +10387,6 @@
       "Mgjbot"
     ]
   },
-  "Web/CSS/rtl": {
-    "modified": "2019-01-16T15:48:03.556Z",
-    "contributors": [
-      "teoli",
-      "HenryGR"
-    ]
-  },
   "Web/CSS/scroll-behavior": {
     "modified": "2019-03-23T22:07:41.439Z",
     "contributors": [
@@ -15195,35 +10908,5541 @@
       "gabo8611"
     ]
   },
-  "Web/Events/DOMContentLoaded": {
-    "modified": "2019-09-06T00:37:43.389Z",
+  "Web/Guide": {
+    "modified": "2019-07-18T20:35:32.528Z",
     "contributors": [
+      "clarii",
+      "D3Portillo",
+      "Breaking Pitt",
+      "VictorAbdon",
+      "n2nand",
+      "Puchoti",
+      "DrTrucho",
+      "DanielCarron",
+      "daroswing",
+      "osodi",
+      "LeoHirsch",
+      "hjaguen",
+      "ethertank",
+      "Sheppy"
+    ]
+  },
+  "Web/Guide/AJAX": {
+    "modified": "2019-03-18T21:14:54.246Z",
+    "contributors": [
+      "AlePerez92",
+      "chrisdavidmills",
+      "ccarruitero",
+      "chukito",
+      "Mgjbot",
+      "Nukeador",
+      "Summit677",
+      "Pascalc",
+      "Jorolo",
+      "Marianov",
+      "Takenbot",
+      "Baluart",
+      "Breaking Pitt",
+      "Seres"
+    ]
+  },
+  "Web/Guide/API": {
+    "modified": "2019-09-11T09:31:45.916Z",
+    "contributors": [
+      "SphinxKnight",
+      "VictorAbdon",
+      "Sheppy"
+    ]
+  },
+  "Web/Guide/CSS/Block_formatting_context": {
+    "modified": "2019-03-23T22:32:27.340Z",
+    "contributors": [
+      "Enesimus",
+      "javichito"
+    ]
+  },
+  "Web/Guide/Graphics": {
+    "modified": "2020-05-19T14:31:25.384Z",
+    "contributors": [
+      ".bkjop0",
+      "lassergraf",
+      "CarlosEduardoEncinas",
+      "pescadito.2007",
+      "rogeliomtx",
+      "CarlosQuijano",
+      "lalo2013"
+    ]
+  },
+  "Web/Guide/HTML/Editable_content": {
+    "modified": "2019-03-23T22:09:49.599Z",
+    "contributors": [
+      "vinyetcg",
+      "JoaquinGiordano",
+      "V.Morantes"
+    ]
+  },
+  "Web/Guide/Parsing_and_serializing_XML": {
+    "modified": "2019-03-23T22:10:22.365Z",
+    "contributors": [
+      "FenixAlive"
+    ]
+  },
+  "Web/Guide/Performance": {
+    "modified": "2019-03-23T23:21:17.984Z",
+    "contributors": [
+      "DeiberChacon",
+      "Sheppy"
+    ]
+  },
+  "Web/HTML": {
+    "modified": "2020-12-10T12:38:08.697Z",
+    "contributors": [
+      "ojgarciab",
+      "SphinxKnight",
+      "cesarmerino.ec71",
+      "barriosines07",
+      "Nachec",
+      "Enesimus",
+      "Neto503",
+      "hackertj",
+      "chrisdavidmills",
+      "blanchart",
+      "roocce",
+      "titox",
+      "donpaginasweboficial",
+      "Kenikser",
+      "RayPL",
+      "YeseniaMariela",
+      "gabriel-ar",
+      "PabloLajarin",
+      "JoseBarakat",
+      "raecillacastellana",
+      "israel-munoz",
+      "jsx",
+      "Hteemo",
+      "eduMXM",
+      "enesimo",
+      "MARVINFLORENTINO",
+      "pekechis",
+      "monserratcallejaalmazan",
+      "thzunder",
+      "roheru",
+      "vltamara",
+      "ArcangelZith",
+      "ronyworld",
+      "LeoHirsch",
+      "CarlosQuijano",
+      "AngelFQC"
+    ]
+  },
+  "Web/HTML/Block-level_elements": {
+    "modified": "2019-03-18T20:44:10.775Z",
+    "contributors": [
+      "ManuelPalominochirote",
+      "raecillacastellana",
+      "dinael",
+      "pekechis",
+      "erdavo",
+      "vltamara",
+      "teoli",
+      "MILTON.AGUILAR"
+    ]
+  },
+  "Web/HTML/Quirks_Mode_and_Standards_Mode": {
+    "modified": "2019-03-23T22:00:35.023Z",
+    "contributors": [
+      "chrisdavidmills",
+      "alvaromontoro",
+      "mamptecnocrata",
+      "ungatoquecomesushi"
+    ]
+  },
+  "Web/HTTP": {
+    "modified": "2019-03-18T20:34:58.542Z",
+    "contributors": [
+      "IsraelFloresDGA",
+      "MarioECU",
+      "locolauty97",
+      "Sergio_Gonzalez_Collado",
+      "Ferrmolina",
+      "raecillacastellana",
+      "migdonio1",
+      "Erto",
+      "teoli"
+    ]
+  },
+  "Web/HTTP/Authentication": {
+    "modified": "2019-10-24T13:52:25.126Z",
+    "contributors": [
+      "bood-dev",
+      "Gochip",
+      "fcanellas",
+      "diegorec",
+      "kraneok",
+      "JuanMacias",
+      "_deiberchacon",
+      "DavidPeniafiel"
+    ]
+  },
+  "Web/HTTP/Basics_of_HTTP": {
+    "modified": "2020-04-20T02:59:31.392Z",
+    "contributors": [
+      "obed3113",
+      "sanxofon",
+      "Sergio_Gonzalez_Collado",
+      "cissoid"
+    ]
+  },
+  "Web/HTTP/Basics_of_HTTP/Choosing_between_www_and_non-www_URLs": {
+    "modified": "2019-03-18T21:22:07.450Z",
+    "contributors": [
+      "Adorta4",
+      "carlosgocereceda"
+    ]
+  },
+  "Web/HTTP/Basics_of_HTTP/Evolution_of_HTTP": {
+    "modified": "2019-03-23T22:10:11.567Z",
+    "contributors": [
+      "Sergio_Gonzalez_Collado",
+      "ChrisMHM"
+    ]
+  },
+  "Web/HTTP/Basics_of_HTTP/MIME_types": {
+    "modified": "2019-11-18T08:03:54.325Z",
+    "contributors": [
+      "IsaacAaron",
+      "sanxofon",
+      "Sergio_Gonzalez_Collado",
+      "kevinmont",
+      "juanrarodriguez18",
+      "strattadb"
+    ]
+  },
+  "Web/HTTP/Basics_of_HTTP/MIME_types/Common_types": {
+    "modified": "2020-02-28T13:10:45.613Z",
+    "contributors": [
+      "chrisdavidmills",
+      "sanxofon",
+      "franklevel",
+      "gabrielnoe"
+    ]
+  },
+  "Web/HTTP/CORS/Errors": {
+    "modified": "2019-03-18T21:26:43.815Z",
+    "contributors": [
+      "nchevobbe"
+    ]
+  },
+  "Web/HTTP/CORS/Errors/CORSDidNotSucceed": {
+    "modified": "2020-03-20T09:22:59.137Z",
+    "contributors": [
+      "javier.camus",
+      "rotcl",
+      "MarianoRDZ"
+    ]
+  },
+  "Web/HTTP/CORS/Errors/CORSMissingAllowOrigin": {
+    "modified": "2020-03-10T05:27:13.697Z",
+    "contributors": [
+      "HermosinNunez",
+      "danhiel98",
+      "pyumbillo",
+      "rewin23"
+    ]
+  },
+  "Web/HTTP/CORS/Errors/CORSNotSupportingCredentials": {
+    "modified": "2020-03-25T19:41:08.379Z",
+    "contributors": [
+      "pablogalvezfotografiadeportiva"
+    ]
+  },
+  "Web/HTTP/CORS/Errors/CORSPreflightDidNotSucceed": {
+    "modified": "2019-10-08T04:58:57.176Z",
+    "contributors": [
+      "Concatenacion"
+    ]
+  },
+  "Web/HTTP/CORS/Errors/CORSRequestNotHttp": {
+    "modified": "2020-07-09T00:32:19.159Z",
+    "contributors": [
+      "agf0710",
+      "advica2016",
+      "BubuAnabelas",
+      "Juan_Pablo"
+    ]
+  },
+  "Web/HTTP/CSP": {
+    "modified": "2020-10-15T22:03:58.031Z",
+    "contributors": [
+      "lautaropaske",
+      "herleym",
+      "BubuAnabelas",
+      "vk496",
+      "CarlosRomeroVera"
+    ]
+  },
+  "Web/HTTP/Caching": {
+    "modified": "2019-03-18T21:21:15.259Z",
+    "contributors": [
+      "WilsonIsAliveClone",
+      "serarroy",
+      "ulisestrujillo"
+    ]
+  },
+  "Web/HTTP/Cookies": {
+    "modified": "2020-06-27T19:11:54.360Z",
+    "contributors": [
+      "vinjatovix",
+      "SphinxKnight",
+      "g.baldemar.77",
+      "alexlndn",
+      "rayrojas",
+      "jesuscampos",
+      "nachoperassi",
+      "cguimaraenz",
+      "eortizromero",
+      "omertafox"
+    ]
+  },
+  "Web/HTTP/Headers": {
+    "modified": "2019-12-10T13:29:15.931Z",
+    "contributors": [
+      "OneLoneFox",
+      "hamethassaf",
+      "darianbenito",
+      "MrcRjs",
+      "Watermelonnable",
+      "JurgenBlitz",
+      "ampersand89",
+      "fjuarez",
+      "fscholz"
+    ]
+  },
+  "Web/HTTP/Headers/Accept": {
+    "modified": "2020-10-15T21:55:42.853Z",
+    "contributors": [
+      "gabriel-ar"
+    ]
+  },
+  "Web/HTTP/Headers/Accept-Charset": {
+    "modified": "2020-10-15T22:13:56.858Z",
+    "contributors": [
+      "ArnoldFZ"
+    ]
+  },
+  "Web/HTTP/Headers/Accept-Ranges": {
+    "modified": "2020-10-15T21:52:24.088Z",
+    "contributors": [
+      "gerardo1sanchez"
+    ]
+  },
+  "Web/HTTP/Headers/Access-Control-Allow-Credentials": {
+    "modified": "2020-10-15T22:29:00.518Z",
+    "contributors": [
+      "BubuAnabelas",
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/HTTP/Headers/Access-Control-Allow-Headers": {
+    "modified": "2020-10-15T22:07:25.027Z",
+    "contributors": [
+      "_deiberchacon"
+    ]
+  },
+  "Web/HTTP/Headers/Access-Control-Allow-Methods": {
+    "modified": "2020-10-15T21:54:50.843Z",
+    "contributors": [
+      "irsequisious"
+    ]
+  },
+  "Web/HTTP/Headers/Access-Control-Allow-Origin": {
+    "modified": "2020-10-15T21:56:44.483Z",
+    "contributors": [
+      "estrelow",
+      "IsraelFloresDGA",
+      "aranzuze35",
+      "_deiberchacon",
+      "anxobotana",
+      "JhonAguiar"
+    ]
+  },
+  "Web/HTTP/Headers/Access-Control-Expose-Headers": {
+    "modified": "2020-10-15T22:06:29.086Z",
+    "contributors": [
+      "jorgeCaster",
+      "kraneok"
+    ]
+  },
+  "Web/HTTP/Headers/Age": {
+    "modified": "2020-10-15T22:10:53.345Z",
+    "contributors": [
+      "0xCGonzalo"
+    ]
+  },
+  "Web/HTTP/Headers/Allow": {
+    "modified": "2019-03-18T21:23:10.971Z",
+    "contributors": [
+      "ogaston"
+    ]
+  },
+  "Web/HTTP/Headers/Authorization": {
+    "modified": "2019-03-18T21:34:28.554Z",
+    "contributors": [
+      "kraneok",
+      "Watermelonnable"
+    ]
+  },
+  "Web/HTTP/Headers/Cache-Control": {
+    "modified": "2020-10-28T14:39:35.644Z",
+    "contributors": [
+      "noksenberg",
+      "IsraelFloresDGA",
+      "ervin_santos"
+    ]
+  },
+  "Web/HTTP/Headers/Content-Disposition": {
+    "modified": "2020-10-15T21:58:39.489Z",
+    "contributors": [
+      "kbono",
+      "lagwy"
+    ]
+  },
+  "Web/HTTP/Headers/Content-Encoding": {
+    "modified": "2020-10-15T21:53:14.848Z",
+    "contributors": [
+      "IT-Rafa",
+      "sevillacode"
+    ]
+  },
+  "Web/HTTP/Headers/Content-Length": {
+    "modified": "2020-10-15T22:07:26.889Z",
+    "contributors": [
+      "aliciava00",
+      "efrencruz"
+    ]
+  },
+  "Web/HTTP/Headers/Content-Location": {
+    "modified": "2020-10-15T22:29:48.071Z",
+    "contributors": [
+      "hecmonter"
+    ]
+  },
+  "Web/HTTP/Headers/Content-Security-Policy": {
+    "modified": "2020-10-15T22:18:45.176Z",
+    "contributors": [
+      "rayrojas",
+      "mauril26",
+      "27z"
+    ]
+  },
+  "Web/HTTP/Headers/Content-Type": {
+    "modified": "2020-10-15T21:58:35.257Z",
+    "contributors": [
+      "ivanfretes",
+      "omertafox",
+      "ValeriaRamos"
+    ]
+  },
+  "Web/HTTP/Headers/Cookie": {
+    "modified": "2020-10-15T21:55:41.792Z",
+    "contributors": [
+      "SSantiago90"
+    ]
+  },
+  "Web/HTTP/Headers/Cross-Origin-Resource-Policy": {
+    "modified": "2020-10-15T22:29:00.325Z",
+    "contributors": [
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/HTTP/Headers/ETag": {
+    "modified": "2020-10-15T21:57:09.273Z",
+    "contributors": [
+      "zechworld",
+      "evalenzuela",
+      "stwilberth",
+      "edgarrod71"
+    ]
+  },
+  "Web/HTTP/Headers/Expires": {
+    "modified": "2020-10-15T21:56:44.738Z",
+    "contributors": [
+      "ernesto.palafox"
+    ]
+  },
+  "Web/HTTP/Headers/Host": {
+    "modified": "2020-10-15T22:24:56.306Z",
+    "contributors": [
+      "escatel.bernal10",
+      "Alvarito-056"
+    ]
+  },
+  "Web/HTTP/Headers/Keep-Alive": {
+    "modified": "2020-10-15T22:02:52.123Z",
+    "contributors": [
+      "fernomenoide"
+    ]
+  },
+  "Web/HTTP/Headers/Link": {
+    "modified": "2020-10-15T22:28:59.441Z",
+    "contributors": [
+      "threevanny"
+    ]
+  },
+  "Web/HTTP/Headers/Origin": {
+    "modified": "2020-10-15T22:00:47.248Z",
+    "contributors": [
+      "IsraelFloresDGA",
+      "Abelhg"
+    ]
+  },
+  "Web/HTTP/Headers/Pragma": {
+    "modified": "2020-10-15T22:09:54.700Z",
+    "contributors": [
+      "ervin_santos"
+    ]
+  },
+  "Web/HTTP/Headers/Referer": {
+    "modified": "2020-10-15T21:53:10.093Z",
+    "contributors": [
+      "LastCyborg",
+      "fitojb",
+      "UltimoOrejonDelTarro"
+    ]
+  },
+  "Web/HTTP/Headers/Referrer-Policy": {
+    "modified": "2020-10-15T22:01:34.403Z",
+    "contributors": [
+      "fitojb"
+    ]
+  },
+  "Web/HTTP/Headers/Server": {
+    "modified": "2020-10-15T21:55:40.335Z",
+    "contributors": [
+      "sevillacode",
+      "TheSgtPepper23",
+      "irsequisious"
+    ]
+  },
+  "Web/HTTP/Headers/Set-Cookie": {
+    "modified": "2020-10-26T12:24:29.884Z",
+    "contributors": [
+      "ignacio-ifm",
+      "IsraelFloresDGA",
+      "rayrojas",
+      "ramonserrano",
+      "garolard"
+    ]
+  },
+  "Web/HTTP/Headers/Strict-Transport-Security": {
+    "modified": "2020-10-15T21:54:14.546Z",
+    "contributors": [
+      "AmadPS",
+      "pipe01",
+      "heilop",
+      "JulianSoto",
+      "pablolopezmera",
+      "Oxicode"
+    ]
+  },
+  "Web/HTTP/Headers/Transfer-Encoding": {
+    "modified": "2020-10-15T22:24:54.193Z",
+    "contributors": [
+      "0xCGonzalo"
+    ]
+  },
+  "Web/HTTP/Headers/User-Agent": {
+    "modified": "2020-10-15T22:00:44.883Z",
+    "contributors": [
+      "LeoOliva",
+      "Imvi10"
+    ]
+  },
+  "Web/HTTP/Headers/Vary": {
+    "modified": "2020-10-15T21:56:44.020Z",
+    "contributors": [
+      "JhonAguiar"
+    ]
+  },
+  "Web/HTTP/Headers/WWW-Authenticate": {
+    "modified": "2020-10-15T22:19:30.337Z",
+    "contributors": [
+      "malonso",
+      "Gytree"
+    ]
+  },
+  "Web/HTTP/Headers/X-Content-Type-Options": {
+    "modified": "2020-10-15T21:59:06.832Z",
+    "contributors": [
+      "clbustos",
+      "tonialfaro"
+    ]
+  },
+  "Web/HTTP/Headers/X-Forwarded-For": {
+    "modified": "2020-10-15T22:16:47.635Z",
+    "contributors": [
+      "choadev",
+      "martinfrad",
+      "camsa"
+    ]
+  },
+  "Web/HTTP/Headers/X-Frame-Options": {
+    "modified": "2020-10-15T21:57:01.709Z",
+    "contributors": [
+      "ervin_santos",
+      "Luiggy",
+      "setlord"
+    ]
+  },
+  "Web/HTTP/Headers/X-XSS-Protection": {
+    "modified": "2020-10-15T21:59:06.897Z",
+    "contributors": [
+      "JulioMoreyra",
+      "francinysalles",
+      "tonialfaro"
+    ]
+  },
+  "Web/HTTP/Messages": {
+    "modified": "2019-11-12T11:40:26.816Z",
+    "contributors": [
+      "emiedes",
+      "jose89gp",
+      "anibalortegap",
+      "Sergio_Gonzalez_Collado"
+    ]
+  },
+  "Web/HTTP/Methods": {
+    "modified": "2020-10-15T21:51:09.574Z",
+    "contributors": [
+      "andrpueb",
+      "eddydeath",
+      "JRaiden",
+      "JulianSoto",
+      "RamsesMartinez"
+    ]
+  },
+  "Web/HTTP/Methods/CONNECT": {
+    "modified": "2020-10-15T22:09:12.273Z",
+    "contributors": [
+      "jadiosc"
+    ]
+  },
+  "Web/HTTP/Methods/GET": {
+    "modified": "2020-12-13T00:32:42.441Z",
+    "contributors": [
+      "victorgabardini",
+      "SphinxKnight",
+      "sercorc.12",
+      "oespino",
+      "RetelboP"
+    ]
+  },
+  "Web/HTTP/Methods/PATCH": {
+    "modified": "2020-10-04T20:15:30.024Z",
+    "contributors": [
+      "hamishwillee",
+      "cnietoc",
+      "SackmannDV",
+      "noecende"
+    ]
+  },
+  "Web/HTTP/Methods/POST": {
+    "modified": "2020-11-06T16:08:25.707Z",
+    "contributors": [
+      "Max_Gremory",
+      "JGarnica",
+      "qmarquez",
+      "DavidGalvis",
+      "sammye70",
+      "Sheppy",
+      "mtnalonso",
+      "Juenesis"
+    ]
+  },
+  "Web/HTTP/Methods/PUT": {
+    "modified": "2020-10-15T21:58:39.134Z",
+    "contributors": [
+      "mtnalonso"
+    ]
+  },
+  "Web/HTTP/Methods/TRACE": {
+    "modified": "2020-10-15T22:12:36.763Z",
+    "contributors": [
+      "pablobiedma"
+    ]
+  },
+  "Web/HTTP/Overview": {
+    "modified": "2020-08-07T11:46:49.430Z",
+    "contributors": [
+      "marcusdesantis",
+      "Enesimus",
+      "Rafasu",
+      "ChrisMHM",
+      "LuisGalicia",
+      "jose89gp",
+      "DaniNz",
+      "cabaag",
+      "Sergio_Gonzalez_Collado"
+    ]
+  },
+  "Web/HTTP/Status": {
+    "modified": "2020-10-01T02:41:07.109Z",
+    "contributors": [
+      "SphinxKnight",
+      "gonzalestino924",
+      "manuelguido",
+      "juliocesardeveloper",
+      "ismanapa",
+      "santiago.lator",
+      "leticia-acib",
+      "josecarbajalbolbot",
+      "StarViruZ",
+      "amircp",
+      "SebastianBar",
+      "serivt",
+      "Jens.B"
+    ]
+  },
+  "Web/HTTP/Status/100": {
+    "modified": "2020-10-15T21:56:53.445Z",
+    "contributors": [
+      "serivt"
+    ]
+  },
+  "Web/HTTP/Status/101": {
+    "modified": "2019-03-18T21:22:02.098Z",
+    "contributors": [
+      "jlamasfripp"
+    ]
+  },
+  "Web/HTTP/Status/200": {
+    "modified": "2020-10-15T22:05:24.611Z",
+    "contributors": [
+      "SphinxKnight",
+      "alexibarra55",
+      "jlamasfripp",
+      "gbarriosf",
+      "snaven10",
+      "Adriel_from_Nav"
+    ]
+  },
+  "Web/HTTP/Status/201": {
+    "modified": "2020-10-15T22:08:02.661Z",
+    "contributors": [
+      "WriestTavo"
+    ]
+  },
+  "Web/HTTP/Status/202": {
+    "modified": "2019-04-19T16:13:12.876Z",
+    "contributors": [
+      "Hibot12"
+    ]
+  },
+  "Web/HTTP/Status/203": {
+    "modified": "2020-06-14T20:53:26.311Z",
+    "contributors": [
+      "rayrojas"
+    ]
+  },
+  "Web/HTTP/Status/206": {
+    "modified": "2020-10-15T22:02:08.111Z",
+    "contributors": [
+      "qpdian"
+    ]
+  },
+  "Web/HTTP/Status/301": {
+    "modified": "2020-10-15T22:24:06.781Z",
+    "contributors": [
+      "nullxx"
+    ]
+  },
+  "Web/HTTP/Status/302": {
+    "modified": "2020-10-15T21:59:00.277Z",
+    "contributors": [
+      "B1tF8er",
+      "kraptor",
+      "astrapotro"
+    ]
+  },
+  "Web/HTTP/Status/304": {
+    "modified": "2020-10-15T22:12:46.751Z",
+    "contributors": [
+      "jairoFg12"
+    ]
+  },
+  "Web/HTTP/Status/400": {
+    "modified": "2019-08-03T10:06:53.857Z",
+    "contributors": [
+      "molavec",
+      "Hibot12"
+    ]
+  },
+  "Web/HTTP/Status/401": {
+    "modified": "2020-10-15T21:55:15.004Z",
+    "contributors": [
+      "Clipi",
+      "JuanMacias",
+      "mjaque",
+      "andreximo"
+    ]
+  },
+  "Web/HTTP/Status/403": {
+    "modified": "2020-10-15T21:58:50.466Z",
+    "contributors": [
+      "JuanMacias"
+    ]
+  },
+  "Web/HTTP/Status/404": {
+    "modified": "2020-10-15T21:56:47.503Z",
+    "contributors": [
+      "BrodaNoel"
+    ]
+  },
+  "Web/HTTP/Status/408": {
+    "modified": "2019-03-18T21:30:00.279Z",
+    "contributors": [
+      "juusechec"
+    ]
+  },
+  "Web/HTTP/Status/418": {
+    "modified": "2020-10-15T22:21:28.070Z",
+    "contributors": [
+      "joseluisq",
+      "paolo667"
+    ]
+  },
+  "Web/HTTP/Status/500": {
+    "modified": "2020-12-07T12:32:25.820Z",
+    "contributors": [
+      "dayanhernandez353",
+      "karenonaly",
+      "duduindo",
+      "marcelokruk",
+      "Viejofon"
+    ]
+  },
+  "Web/HTTP/Status/502": {
+    "modified": "2020-10-15T21:56:55.208Z",
+    "contributors": [
+      "josecarbajalbolbot",
+      "AlePerez92",
+      "josmelnoel"
+    ]
+  },
+  "Web/HTTP/Status/503": {
+    "modified": "2020-10-15T22:10:17.555Z",
+    "contributors": [
+      "Parodper",
+      "ajuni880",
+      "diego-bustamante"
+    ]
+  },
+  "Web/HTTP/Status/504": {
+    "modified": "2020-10-15T22:08:08.336Z",
+    "contributors": [
+      "ojeanicolas"
+    ]
+  },
+  "Web/HTTP/Status/505": {
+    "modified": "2020-04-03T20:59:26.896Z",
+    "contributors": [
+      "lp4749791"
+    ]
+  },
+  "Web/JavaScript": {
+    "modified": "2020-11-23T12:49:37.646Z",
+    "contributors": [
+      "SphinxKnight",
+      "kramosr68",
+      "ivanfernandez5209",
+      "Tonatew",
+      "alejogomes944",
+      "Nachec",
+      "victitor800",
+      "Enesimus",
+      "franchesco182001",
+      "pauli.rodriguez.c",
+      "jhonarielgj",
+      "Fegaan",
+      "OOJuanferOO",
+      "nicolas25ramirez",
+      "andreamv2807",
+      "tomasvillarragaperez",
+      "Yel-Martinez-Consultor-Seo",
+      "rodririobo",
+      "isabelsvelasquezv",
+      "fedegianni04",
+      "jaomix1",
+      "TheJarX",
+      "clarii",
+      "NataliaCba",
+      "NicoleCleto1998",
+      "JavScars",
+      "untilbit",
+      "AlePerez92",
+      "aluxito",
+      "luisNavasArg",
+      "jsx",
+      "carlossuarez",
+      "Pablo_Ivan",
+      "teoli",
+      "LeoHirsch",
+      "smarchioni",
+      "ricardo777",
+      "CarlosQuijano",
+      "Scipion",
+      "alquimista",
+      "Nukeador",
+      "ethertank",
+      "Jorge.villalobos",
+      "arleytriana",
+      "arpunk",
+      "inma_610",
+      "StripTM",
+      "Mgjbot",
+      "Superruzafa",
+      "Verruckt",
+      "Jorolo",
+      "Vyk",
+      "Takenbot",
+      "RJacinto"
+    ]
+  },
+  "Web/JavaScript/Closures": {
+    "modified": "2020-04-08T19:26:44.700Z",
+    "contributors": [
+      "camsa",
       "wbamberg",
-      "jramcast",
-      "ExE-Boss",
+      "AzazelN28",
+      "JonasBrandel",
       "fscholz",
-      "AlexOfSoCal",
-      "jdmgarcia",
-      "daniville"
+      "guty",
+      "Siro_Diaz",
+      "luigli",
+      "teoli",
+      "FNK",
+      "juanc.jara",
+      "Josias",
+      "neosergio",
+      "hjoaco"
     ]
   },
-  "Web/Events/abort": {
-    "modified": "2019-04-30T13:47:43.431Z",
+  "Web/JavaScript/Data_structures": {
+    "modified": "2020-08-30T02:21:59.996Z",
+    "contributors": [
+      "Nachec",
+      "edwinmunguia",
+      "arzr",
+      "rayrojas",
+      "melgard",
+      "mmngreco",
+      "AngryDev",
+      "Gorzas",
+      "alejandrochung",
+      "IXTRUnai",
+      "damnyorch",
+      "devconcept",
+      "sancospi"
+    ]
+  },
+  "Web/JavaScript/Equality_comparisons_and_sameness": {
+    "modified": "2020-03-24T18:47:23.011Z",
+    "contributors": [
+      "camsa",
+      "abestrad1",
+      "EduardoCasanova",
+      "pekechis"
+    ]
+  },
+  "Web/JavaScript/EventLoop": {
+    "modified": "2020-03-12T19:43:05.672Z",
+    "contributors": [
+      "AzazelN28",
+      "omonteon",
+      "guillermojmc",
+      "eljonims",
+      "MrCoffey",
+      "Anonymous"
+    ]
+  },
+  "Web/JavaScript/Guide": {
+    "modified": "2020-09-12T21:03:22.983Z",
+    "contributors": [
+      "Nachec",
+      "AmazonianCodeGuy",
+      "tezece",
+      "MarcyG1",
+      "nhuamani",
+      "manuhdez",
+      "e.g.m.g.",
+      "Pablo_Ivan",
+      "nelson6e65",
+      "walterpaoli",
+      "joanvasa",
+      "fscholz",
+      "Benjalorc",
+      "teoli",
+      "mitogh",
+      "xavo7"
+    ]
+  },
+  "Web/JavaScript/Guide/Details_of_the_Object_Model": {
+    "modified": "2020-08-17T15:38:30.288Z",
+    "contributors": [
+      "Nachec",
+      "MariaBarros",
+      "AmazonianCodeGuy",
+      "wbamberg",
+      "fherce",
+      "SphinxKnight",
+      "ObsoleteHuman",
+      "ValentinTapiaTorti",
+      "brodriguezs",
+      "DiegoA1114",
+      "montogeek",
+      "fscholz",
+      "teoli",
+      "pheras"
+    ]
+  },
+  "Web/JavaScript/Guide/Expressions_and_Operators": {
+    "modified": "2020-09-13T21:58:37.783Z",
+    "contributors": [
+      "Nachec",
+      "gcjuan",
+      "Orlando-Flores-Huanca",
+      "wajari",
+      "anglozm",
+      "recortes",
+      "Ernesto385291",
+      "Jkierem",
+      "gsalinase",
+      "abestrad1",
+      "milouri23",
+      "Odol",
+      "victorsanchezm",
+      "ElChiniNet",
+      "UshioSan",
+      "siluvana",
+      "juanbrujo",
+      "01luisrene",
+      "gustavgil",
+      "Jaston",
+      "Alexis88",
+      "smarquez1",
+      "ricardochavarri",
+      "fscholz",
+      "spachecojimenez"
+    ]
+  },
+  "Web/JavaScript/Guide/Grammar_and_types": {
+    "modified": "2020-09-12T23:09:43.446Z",
+    "contributors": [
+      "Nachec",
+      "luis-al-merino",
+      "AmazonianCodeGuy",
+      "teknotica",
+      "feliperomero3",
+      "nullx5",
+      "abelosky",
+      "jlopezfdez",
+      "enriqueabsurdum",
+      "Ayman",
+      "AnthonyGareca",
+      "chuyinEF",
+      "estebancito",
+      "bytx",
+      "Pablo_Ivan",
+      "cgsramirez",
+      "eugenioNovas",
+      "marioalvazquez",
+      "joanvasa",
+      "fscholz",
+      "Cleon",
+      "angelnajera",
+      "vinixio",
+      "diegogaysaez",
+      "teoli",
+      "Amatos"
+    ]
+  },
+  "Web/JavaScript/Guide/Iterators_and_Generators": {
+    "modified": "2020-03-12T19:42:41.976Z",
+    "contributors": [
+      "camsa",
+      "DJphilomath",
+      "mjaque",
+      "lassmann",
+      "eycopia",
+      "nefter",
+      "dieguezz",
+      "Breaking_Pitt"
+    ]
+  },
+  "Web/JavaScript/Guide/Keyed_collections": {
+    "modified": "2020-09-02T02:09:58.803Z",
+    "contributors": [
+      "Nachec",
+      "MariaBarros",
+      "jesus92gz",
+      "eljonims"
+    ]
+  },
+  "Web/JavaScript/Guide/Meta_programming": {
+    "modified": "2020-08-18T02:34:39.284Z",
+    "contributors": [
+      "Nachec",
+      "asamajamasa",
+      "jaomix1",
+      "jzatarain"
+    ]
+  },
+  "Web/JavaScript/Guide/Numbers_and_dates": {
+    "modified": "2020-09-14T23:27:03.154Z",
+    "contributors": [
+      "Nachec",
+      "ds-developer1",
+      "la-syl",
+      "IsraelFloresDGA",
+      "ingcarlosperez",
+      "georgenevets",
+      "yakashiro"
+    ]
+  },
+  "Web/JavaScript/Guide/Regular_Expressions": {
+    "modified": "2020-10-15T21:29:34.015Z",
+    "contributors": [
+      "Nachec",
+      "wilmer2000",
+      "Ricardo_F.",
+      "lebubic",
+      "franklevel",
+      "recortes",
+      "LuisSevillano",
+      "pangeasi",
+      "Jabi",
+      "bartolocarrasco",
+      "fortil",
+      "BoyFerruco",
+      "Lehmer",
+      "wffranco",
+      "eljonims",
+      "jpmontoya182",
+      "guillermomartinmarco",
+      "fscholz",
+      "eespitia.rea",
+      "jcvergar"
+    ]
+  },
+  "Web/JavaScript/Guide/Text_formatting": {
+    "modified": "2020-09-15T10:00:50.941Z",
+    "contributors": [
+      "Nachec",
+      "surielmx",
+      "IsraelFloresDGA",
+      "diegarta",
+      "Enesimus",
+      "jalmeida"
+    ]
+  },
+  "Web/JavaScript/Language_Resources": {
+    "modified": "2020-03-12T19:47:17.832Z",
+    "contributors": [
+      "lajaso",
+      "jpmontoya182"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors": {
+    "modified": "2020-03-12T19:45:01.208Z",
+    "contributors": [
+      "JavScars",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Bad_octal": {
+    "modified": "2020-03-12T19:45:41.442Z",
+    "contributors": [
+      "HaroldV"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Deprecated_source_map_pragma": {
+    "modified": "2020-03-12T19:45:51.961Z",
+    "contributors": [
+      "BubuAnabelas",
+      "Andres62",
+      "ingjosegarrido",
+      "JaimeNorato"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Invalid_array_length": {
+    "modified": "2020-03-12T19:46:48.651Z",
+    "contributors": [
+      "Tlauipil"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Invalid_date": {
+    "modified": "2020-03-12T19:47:15.708Z",
+    "contributors": [
+      "untilbit"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Malformed_formal_parameter": {
+    "modified": "2019-10-12T12:26:22.919Z",
+    "contributors": [
+      "JGmr5"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Missing_curly_after_property_list": {
+    "modified": "2020-03-12T19:46:53.938Z",
+    "contributors": [
+      "DGun17"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Missing_formal_parameter": {
+    "modified": "2020-03-12T19:47:16.712Z",
+    "contributors": [
+      "TheEpicSimple"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Missing_parenthesis_after_argument_list": {
+    "modified": "2020-03-12T19:46:54.683Z",
+    "contributors": [
+      "hiuxmaycry",
+      "ivandevp"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/More_arguments_needed": {
+    "modified": "2020-03-12T19:49:21.407Z",
+    "contributors": [
+      "dragonmenorka"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/No_variable_name": {
+    "modified": "2020-03-12T19:48:33.901Z",
+    "contributors": [
+      "CatalinaCampos"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Not_a_codepoint": {
+    "modified": "2020-03-12T19:46:46.603Z",
+    "contributors": [
+      "DGun17"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Not_a_function": {
+    "modified": "2020-03-12T19:45:06.322Z",
+    "contributors": [
+      "PatoDeTuring",
+      "untilbit",
+      "josegarciaclm95"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Not_defined": {
+    "modified": "2020-10-08T09:22:13.757Z",
+    "contributors": [
+      "ludoescribano.2016",
+      "FacuBustamaante",
+      "ozavala",
+      "ccorcoles",
+      "Heranibus",
+      "jsgaonac",
+      "Luis_Armando"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Precision_range": {
+    "modified": "2020-08-10T12:14:52.122Z",
+    "contributors": [
+      "Sgewux"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Property_access_denied": {
+    "modified": "2020-03-12T19:46:35.795Z",
+    "contributors": [
+      "untilbit",
+      "Tlauipil"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Stmt_after_return": {
+    "modified": "2020-03-12T19:46:14.065Z",
+    "contributors": [
+      "WCHARRIERE",
+      "NanoSpicer",
+      "marco_Lozano"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Too_much_recursion": {
+    "modified": "2020-03-12T19:45:04.878Z",
+    "contributors": [
+      "josegarciaclm95"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Undefined_prop": {
+    "modified": "2020-03-12T19:47:46.684Z",
+    "contributors": [
+      "antixsuperstar"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Unexpected_token": {
+    "modified": "2020-03-12T19:46:40.968Z",
+    "contributors": [
+      "dariomaim"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/Unexpected_type": {
+    "modified": "2020-03-12T19:45:53.118Z",
+    "contributors": [
+      "BubuAnabelas",
+      "JaimeNorato"
+    ]
+  },
+  "Web/JavaScript/Reference/Errors/in_operator_no_object": {
+    "modified": "2020-03-12T19:47:18.421Z",
+    "contributors": [
+      "presercomp"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/RangeError": {
+    "modified": "2019-03-23T22:47:01.907Z",
+    "contributors": [
+      "gfernandez",
+      "fscholz"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Reflect": {
+    "modified": "2019-03-18T21:14:43.908Z",
+    "contributors": [
+      "javierlopm",
+      "trofrigo",
+      "lecruz01",
+      "roberbnd",
+      "jameshkramer"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Reflect/set": {
+    "modified": "2019-03-23T22:08:25.189Z",
+    "contributors": [
+      "pedro-otero"
+    ]
+  },
+  "Web/JavaScript/Shells": {
+    "modified": "2020-03-12T19:44:40.392Z",
+    "contributors": [
+      "davidenriq11",
+      "mamptecnocrata"
+    ]
+  },
+  "Web/Manifest": {
+    "modified": "2020-07-18T01:40:57.131Z",
+    "contributors": [
+      "angelmlucero",
+      "ardillan",
+      "Zellius",
+      "Pablo_Bangueses",
+      "luisabarca",
+      "malonson",
+      "AlePerez92"
+    ]
+  },
+  "Web/MathML": {
+    "modified": "2020-10-15T21:24:26.572Z",
+    "contributors": [
+      "Undigon",
+      "teoli",
+      "fred.wang",
+      "ChaitanyaGSNR"
+    ]
+  },
+  "Web/MathML/Attribute": {
+    "modified": "2019-03-23T23:26:57.621Z",
+    "contributors": [
+      "LuifeR",
+      "ccarruitero",
+      "maedca"
+    ]
+  },
+  "Web/MathML/Authoring": {
+    "modified": "2019-03-23T23:27:02.180Z",
+    "contributors": [
+      "rafaqtro",
+      "fred.wang",
+      "voylinux",
+      "robertoasq",
+      "maedca"
+    ]
+  },
+  "Web/MathML/Examples": {
+    "modified": "2019-03-23T23:25:26.042Z",
+    "contributors": [
+      "nielsdg"
+    ]
+  },
+  "Web/MathML/Examples/MathML_Pythagorean_Theorem": {
+    "modified": "2019-03-23T23:25:28.102Z",
+    "contributors": [
+      "osvaldobaeza"
+    ]
+  },
+  "Web/Media": {
+    "modified": "2020-07-15T09:47:41.711Z",
+    "contributors": [
+      "Sheppy"
+    ]
+  },
+  "Web/Media/Formats": {
+    "modified": "2020-07-15T09:47:42.018Z",
+    "contributors": [
+      "Sheppy"
+    ]
+  },
+  "Web/Media/Formats/Containers": {
+    "modified": "2020-07-15T09:47:51.166Z",
+    "contributors": [
+      "hugojavierduran9"
+    ]
+  },
+  "Web/Performance": {
+    "modified": "2019-04-04T19:28:41.844Z",
+    "contributors": [
+      "arekucr",
+      "chrisdavidmills"
+    ]
+  },
+  "Web/Performance/Fundamentals": {
+    "modified": "2019-05-05T06:54:02.458Z",
+    "contributors": [
+      "c-torres"
+    ]
+  },
+  "Web/Performance/How_browsers_work": {
+    "modified": "2020-09-10T10:11:23.592Z",
+    "contributors": [
+      "sancarbar"
+    ]
+  },
+  "Web/Progressive_web_apps": {
+    "modified": "2020-09-20T04:18:55.064Z",
+    "contributors": [
+      "Nachec",
+      "Enesimus",
+      "chrisdavidmills",
+      "hypnotic-frog",
+      "javichito"
+    ]
+  },
+  "Web/Progressive_web_apps/App_structure": {
+    "modified": "2020-09-20T03:39:21.273Z",
+    "contributors": [
+      "Nachec",
+      "NicolasKuhn"
+    ]
+  },
+  "Web/Progressive_web_apps/Developer_guide": {
+    "modified": "2020-09-20T03:25:40.381Z",
+    "contributors": [
+      "Deng_C1"
+    ]
+  },
+  "Web/Progressive_web_apps/Installable_PWAs": {
+    "modified": "2020-09-20T03:54:28.154Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/Progressive_web_apps/Introduction": {
+    "modified": "2020-09-20T03:34:06.424Z",
+    "contributors": [
+      "Nachec",
+      "gastono.442",
+      "tw1ttt3r",
+      "santi324",
+      "chrisdavidmills"
+    ]
+  },
+  "Web/Progressive_web_apps/Loading": {
+    "modified": "2020-09-20T04:08:37.661Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/Progressive_web_apps/Offline_Service_workers": {
+    "modified": "2020-09-20T03:45:55.671Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/Progressive_web_apps/Re-engageable_Notifications_Push": {
+    "modified": "2020-09-20T04:04:04.639Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/Reference": {
+    "modified": "2019-03-23T23:21:27.898Z",
+    "contributors": [
+      "raecillacastellana",
+      "vltamara",
+      "asero82",
+      "atlas7jean",
+      "Nickolay"
+    ]
+  },
+  "Web/Reference/API": {
+    "modified": "2019-03-23T23:20:25.941Z",
+    "contributors": [
+      "AlePerez92",
+      "jhia",
+      "welm",
+      "vggallego",
+      "DeiberChacon",
+      "angmauricio",
+      "vitoco",
+      "CristianMar25",
+      "gesifred",
+      "cmeraz",
+      "davy.martinez"
+    ]
+  },
+  "Web/SVG": {
+    "modified": "2019-03-23T23:44:20.243Z",
+    "contributors": [
+      "Undigon",
+      "Noradrex",
+      "teoli",
+      "Verruckt",
+      "Jorolo",
+      "Mgjbot",
+      "Josebagar"
+    ]
+  },
+  "Web/SVG/Attribute": {
+    "modified": "2019-08-04T03:46:23.452Z",
+    "contributors": [
+      "jcortesa",
+      "chrisdavidmills"
+    ]
+  },
+  "Web/SVG/Attribute/stop-color": {
+    "modified": "2020-10-15T22:06:34.292Z",
+    "contributors": [
+      "andcal"
+    ]
+  },
+  "Web/SVG/Attribute/transform": {
+    "modified": "2019-03-23T22:07:32.328Z",
+    "contributors": [
+      "dimuziop"
+    ]
+  },
+  "Web/SVG/Element": {
+    "modified": "2019-03-19T13:42:20.553Z",
+    "contributors": [
+      "borja",
+      "jmanquez",
+      "kscarfone"
+    ]
+  },
+  "Web/SVG/Element/a": {
+    "modified": "2020-10-15T22:16:15.979Z",
+    "contributors": [
+      "borja"
+    ]
+  },
+  "Web/SVG/Element/animate": {
+    "modified": "2020-10-15T22:09:39.514Z",
+    "contributors": [
+      "evaferreira"
+    ]
+  },
+  "Web/SVG/Element/circle": {
+    "modified": "2019-03-23T22:57:12.727Z",
+    "contributors": [
+      "wbamberg",
+      "Sebastianz",
+      "humbertaco"
+    ]
+  },
+  "Web/SVG/Element/foreignObject": {
+    "modified": "2019-03-23T23:05:21.297Z",
+    "contributors": [
+      "Sebastianz",
+      "THernandez03"
+    ]
+  },
+  "Web/SVG/Element/g": {
+    "modified": "2019-03-23T22:54:18.875Z",
+    "contributors": [
+      "Sebastianz",
+      "teoli",
+      "FrankzWolf"
+    ]
+  },
+  "Web/SVG/Element/rect": {
+    "modified": "2019-03-23T23:02:06.920Z",
     "contributors": [
       "wbamberg",
+      "roadev",
+      "Sebastianz",
+      "jdgarrido"
+    ]
+  },
+  "Web/SVG/Element/style": {
+    "modified": "2019-03-23T22:54:27.955Z",
+    "contributors": [
+      "Sebastianz",
+      "teoli",
+      "rippe2hl"
+    ]
+  },
+  "Web/SVG/Element/svg": {
+    "modified": "2020-11-04T10:23:00.659Z",
+    "contributors": [
+      "hardy.rafael17",
+      "Mcch",
+      "diegovinie",
+      "BubuAnabelas",
+      "mbenitez01"
+    ]
+  },
+  "Web/SVG/Element/text": {
+    "modified": "2020-05-14T06:42:53.448Z",
+    "contributors": [
+      "danielhiguerasgoold",
+      "Sebastianz",
+      "emorc"
+    ]
+  },
+  "Web/SVG/Element/use": {
+    "modified": "2019-03-23T22:58:09.476Z",
+    "contributors": [
+      "andysierra",
+      "Sebastianz",
+      "jorge_castro"
+    ]
+  },
+  "Web/SVG/Index": {
+    "modified": "2019-01-16T22:36:49.773Z",
+    "contributors": [
+      "jwhitlock",
+      "ComplementosMozilla"
+    ]
+  },
+  "Web/SVG/Tutorial": {
+    "modified": "2020-01-15T20:06:40.249Z",
+    "contributors": [
+      "dago.d.havana",
+      "jpriet0",
+      "d-go",
+      "Npmada",
+      "teoli",
+      "Jeremie"
+    ]
+  },
+  "Web/SVG/Tutorial/Getting_Started": {
+    "modified": "2019-03-23T23:19:26.348Z",
+    "contributors": [
+      "kevinricardojs",
+      "teoli",
+      "Alberpat"
+    ]
+  },
+  "Web/SVG/Tutorial/SVG_In_HTML_Introduction": {
+    "modified": "2019-03-23T23:21:05.945Z",
+    "contributors": [
+      "chrisdavidmills",
+      "matrimonio",
+      "verma21",
+      "marelin"
+    ]
+  },
+  "Web/SVG/Tutorial/Tools_for_SVG": {
+    "modified": "2019-03-20T13:46:46.393Z",
+    "contributors": [
+      "James-Yaakov"
+    ]
+  },
+  "Web/Security": {
+    "modified": "2019-09-10T16:32:01.356Z",
+    "contributors": [
+      "SphinxKnight",
+      "npcsayfail",
+      "lejovaar7",
+      "fgcalderon",
+      "pablodonoso",
+      "marumari"
+    ]
+  },
+  "Web/Security/Securing_your_site": {
+    "modified": "2019-03-23T22:04:13.465Z",
+    "contributors": [
+      "fgcalderon",
+      "mbm"
+    ]
+  },
+  "Web/Web_Components": {
+    "modified": "2020-05-21T13:06:07.299Z",
+    "contributors": [
+      "aguilerajl",
+      "Ktoxcon",
+      "IsraelFloresDGA",
+      "mboo",
+      "Rodmore",
+      "maybe"
+    ]
+  },
+  "Web/Web_Components/Using_custom_elements": {
+    "modified": "2020-06-28T18:39:06.239Z",
+    "contributors": [
+      "lupomontero",
+      "aguilerajl"
+    ]
+  },
+  "Web/Web_Components/Using_shadow_DOM": {
+    "modified": "2020-10-24T17:36:39.409Z",
+    "contributors": [
+      "jephsanchez",
+      "Charlemagnes",
+      "quintero_japon",
+      "DavidGalvis"
+    ]
+  },
+  "Web/Web_Components/Using_templates_and_slots": {
+    "modified": "2020-03-26T15:38:45.869Z",
+    "contributors": [
+      "olalinv",
+      "quintero_japon",
+      "BrunoUY",
+      "ulisestrujillo"
+    ]
+  },
+  "Web/XML": {
+    "modified": "2019-03-18T21:18:03.528Z",
+    "contributors": [
+      "ExE-Boss"
+    ]
+  },
+  "Web/XPath": {
+    "modified": "2019-01-16T14:32:30.886Z",
+    "contributors": [
       "ExE-Boss",
       "fscholz",
-      "balboag"
+      "Mgjbot",
+      "Jorolo"
+    ]
+  },
+  "Web/XSLT": {
+    "modified": "2019-03-23T23:44:23.657Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Verruckt",
+      "Mgjbot",
+      "Jorolo",
+      "Nukeador",
+      "Piltrafeta"
+    ]
+  },
+  "Web/XSLT/Element": {
+    "modified": "2019-03-18T20:59:16.316Z",
+    "contributors": [
+      "SphinxKnight",
+      "ExE-Boss",
+      "chrisdavidmills",
+      "fscholz",
+      "Jorolo",
+      "ErickCastellanos"
+    ]
+  },
+  "Web/XSLT/Element/element": {
+    "modified": "2019-03-18T20:59:21.788Z",
+    "contributors": [
+      "SphinxKnight",
+      "ExE-Boss",
+      "chrisdavidmills",
+      "Mgjbot",
+      "ErickCastellanos"
+    ]
+  },
+  "WebAssembly": {
+    "modified": "2020-10-15T22:25:36.765Z",
+    "contributors": [
+      "jonathan.reyes33"
+    ]
+  },
+  "WebAssembly/Concepts": {
+    "modified": "2020-12-06T14:14:45.486Z",
+    "contributors": [
+      "Sergio_Gonzalez_Collado",
+      "mastertrooper"
+    ]
+  },
+  "WebAssembly/Loading_and_running": {
+    "modified": "2020-09-15T19:19:35.117Z",
+    "contributors": [
+      "mastertrooper"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/Updating_web_applications": {
+    "modified": "2019-03-23T23:58:06.668Z",
+    "contributors": [
+      "wbamberg",
+      "SphinxKnight",
+      "Sheppy",
+      "trada",
+      "manueljrs",
+      "flaviog",
+      "Rafavs",
+      "Marcomavil",
+      "Mgjbot"
+    ]
+  },
+  "orphaned/Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3": {
+    "modified": "2019-12-13T20:34:57.052Z",
+    "contributors": [
+      "wbamberg",
+      "lajaso",
+      "teoli",
+      "Sheppy",
+      "Pgulijczuk",
+      "deimidis",
+      "Nukeador",
+      "Ffranz",
+      "HenryGR"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/Updating_extensions": {
+    "modified": "2019-03-23T23:58:10.215Z",
+    "contributors": [
+      "wbamberg",
+      "SphinxKnight",
+      "Pgulijczuk",
+      "deimidis",
+      "flaviog",
+      "Nukeador",
+      "Giovanisf13",
+      "Firewordy",
+      "Dfier",
+      "Rumont",
+      "Wrongloop",
+      "Mgjbot"
+    ]
+  },
+  "orphaned/Actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_Mozilla": {
+    "modified": "2019-01-16T14:53:56.551Z",
+    "contributors": [
+      "DoctorRomi",
+      "Superruzafa"
+    ]
+  },
+  "Mozilla/Firefox/Releases/2/Adding_feed_readers_to_Firefox": {
+    "modified": "2019-03-23T23:54:31.423Z",
+    "contributors": [
+      "wbamberg",
+      "Mgjbot",
+      "RickieesES",
+      "Nukeador",
+      "Anyulled"
+    ]
+  },
+  "Web/SVG/Applying_SVG_effects_to_HTML_content": {
+    "modified": "2019-03-24T00:09:04.196Z",
+    "contributors": [
+      "elPatox"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/Notable_bugs_fixed": {
+    "modified": "2019-03-23T23:53:21.447Z",
+    "contributors": [
+      "wbamberg",
+      "Mgjbot",
+      "Nathymig",
+      "Nukeador",
+      "HenryGR",
+      "RickieesES",
+      "Ciberman osman"
+    ]
+  },
+  "Web/HTTP/Headers/User-Agent/Firefox": {
+    "modified": "2019-03-23T23:45:27.069Z",
+    "contributors": [
+      "teoli",
+      "Orestesleal13022"
+    ]
+  },
+  "orphaned/Code_snippets": {
+    "modified": "2019-01-16T13:52:37.564Z",
+    "contributors": [
+      "ffox"
+    ]
+  },
+  "orphaned/Code_snippets/Pestañas_del_navegador": {
+    "modified": "2019-01-16T13:52:57.159Z",
+    "contributors": [
+      "ffox"
+    ]
+  },
+  "Web/CSS/CSS_Columns/Using_multi-column_layouts": {
+    "modified": "2019-03-23T23:43:23.940Z",
+    "contributors": [
+      "Mgjbot",
+      "Jorolo",
+      "Nukeador"
+    ]
+  },
+  "Learn/Server-side/Configuring_server_MIME_types": {
+    "modified": "2020-07-16T22:36:04.341Z",
+    "contributors": [
+      "Nukeador",
+      "Kroatan",
+      "Mtiscordio",
+      "Hostar",
+      "Iwa1",
+      "Markens",
+      "Brayan Habid"
+    ]
+  },
+  "orphaned/Creación_de_Componentes_XPCOM/Interior_del_Componente": {
+    "modified": "2019-04-20T03:45:43.371Z",
+    "contributors": [
+      "wbamberg",
+      "Maharba"
+    ]
+  },
+  "orphaned/Creación_de_Componentes_XPCOM/Prefacio": {
+    "modified": "2019-04-20T03:45:45.365Z",
+    "contributors": [
+      "wbamberg",
+      "Maharba"
+    ]
+  },
+  "Web/OpenSearch": {
+    "modified": "2019-03-24T00:00:08.096Z",
+    "contributors": [
+      "teoli",
+      "Etrigan",
+      "tbusca",
+      "Nukeador",
+      "Rodrigoknascimento",
+      "Citora",
+      "Mgjbot",
+      "Fenomeno"
+    ]
+  },
+  "orphaned/Creando_una_extensión": {
+    "modified": "2019-03-24T00:13:16.401Z",
+    "contributors": [
+      "teoli",
+      "ethertank",
+      "Sheppy",
+      "athesto",
+      "StripTM",
+      "myfcr",
+      "DoctorRomi",
+      "Mgjbot",
+      "M4ur170",
+      "Nukeador",
+      "Wayner",
+      "El Hacker",
+      "Arcangelhak",
+      "Psanz",
+      "Victor-27-",
+      "Arteadonis",
+      "Gadolinio",
+      "Opevelyn",
+      "Verruckt",
+      "Spg2006",
+      "Gbulfon",
+      "Damien",
+      "Peperoni",
+      "CD77",
+      "Ordep",
+      "Indigo",
+      "Jp1",
+      "GMG",
+      "Ateneo",
+      "Doctormanfer",
+      "A Morenazo",
+      "Trace2x",
+      "Odo",
+      "Hatch",
+      "Jorolo",
+      "Lastjuan",
+      "Ulntux"
+    ]
+  },
+  "orphaned/Crear_una_extensión_personalizada_de_Firefox_con_el_Mozilla_Build_System": {
+    "modified": "2019-04-26T15:53:18.603Z",
+    "contributors": [
+      "cantineoqueteveo",
+      "2stapps",
+      "teoli",
+      "DoctorRomi",
+      "Carok",
+      "Gustavo Ruiz",
+      "Nukeador",
+      "JuninhoBoy95",
+      "Kuriboh",
+      "Mgjbot",
+      "RickieesES",
+      "Geomorillo",
+      "Blank zero",
+      "Haelmx",
+      "Superruzafa"
+    ]
+  },
+  "orphaned/CSS_dinámico": {
+    "modified": "2019-01-16T14:14:46.881Z",
+    "contributors": [
+      "RickieesES",
+      "Jorolo",
+      "Peperoni",
+      "Hande",
+      "Nukeador"
+    ]
+  },
+  "Web/CSS/Media_Queries/Using_media_queries": {
+    "modified": "2019-10-03T11:52:26.928Z",
+    "contributors": [
+      "danielblazquez",
+      "brunonra-dev",
+      "kitab15",
+      "Sebastianz",
+      "jsx",
+      "carlossuarez",
+      "mrstork",
+      "malayaleecoder",
+      "seeker8",
+      "Xaviju",
+      "sinfallas",
+      "maedca"
+    ]
+  },
+  "Web/CSS/CSS_Images/Using_CSS_gradients": {
+    "modified": "2019-06-03T20:30:31.836Z",
+    "contributors": [
+      "GasGen",
+      "undest",
+      "Sebastianz",
+      "Eneagrama"
+    ]
+  },
+  "orphaned/Desarrollando_Mozilla": {
+    "modified": "2019-01-16T14:32:31.515Z",
+    "contributors": [
+      "another_sam",
+      "Mgjbot",
+      "Jorolo",
+      "Nukeador",
+      "Turin"
+    ]
+  },
+  "orphaned/Detectar_la_orientación_del_dispositivo": {
+    "modified": "2019-03-24T00:07:57.131Z",
+    "contributors": [
+      "inma_610"
+    ]
+  },
+  "orphaned/DHTML_Demostraciones_del_uso_de_DOM_Style": {
+    "modified": "2019-01-16T16:07:51.712Z",
+    "contributors": [
+      "Mgjbot",
+      "Superruzafa",
+      "Trace2x",
+      "Fedora-core",
+      "Nukeador"
+    ]
+  },
+  "Glossary/DHTML": {
+    "modified": "2019-03-23T23:44:54.880Z",
+    "contributors": [
+      "Mgjbot",
+      "Jorolo",
+      "Jos"
+    ]
+  },
+  "orphaned/Dibujando_Gráficos_con_Canvas": {
+    "modified": "2019-01-16T20:01:59.575Z",
+    "contributors": [
+      "Firegooploer"
+    ]
+  },
+  "Web/API/Canvas_API/Tutorial/Drawing_text": {
+    "modified": "2019-01-16T15:31:41.845Z",
+    "contributors": [
+      "Mgjbot",
+      "HenryGR",
+      "Nukeador",
+      "RickieesES",
+      "Debianpc"
+    ]
+  },
+  "orphaned/Tools/Add-ons/DOM_Inspector": {
+    "modified": "2020-07-16T22:36:24.191Z",
+    "contributors": [
+      "Mgjbot",
+      "Jorolo",
+      "Tatan",
+      "TETSUO"
+    ]
+  },
+  "Web/API/Document/cookie": {
+    "modified": "2020-04-15T13:31:17.928Z",
+    "contributors": [
+      "atiliopereira",
+      "Skattspa",
+      "aralvarez",
+      "SphinxKnight",
+      "khalid32",
+      "Ogquir",
+      "strongville",
+      "Ciencia Al Poder",
+      "Markens",
+      "DR"
+    ]
+  },
+  "Web/API/History_API/Example": {
+    "modified": "2019-03-23T22:29:32.414Z",
+    "contributors": [
+      "maitret"
+    ]
+  },
+  "Web/API/History_API": {
+    "modified": "2019-09-07T17:44:48.428Z",
+    "contributors": [
+      "seaug",
+      "HerniHdez",
+      "AlePerez92",
+      "SphinxKnight",
+      "talo242",
+      "mauroc8",
+      "javiernunez",
+      "dongerardor",
+      "StripTM",
+      "Galsas",
+      "teoli",
+      "Izel",
+      "Sheppy",
+      "translatoon"
+    ]
+  },
+  "Web/API/Touch_events": {
+    "modified": "2019-03-23T23:35:01.361Z",
+    "contributors": [
+      "wbamberg",
+      "wffranco",
+      "fscholz",
+      "teoli",
+      "Fjaguero",
+      "jvmjunior",
+      "maedca"
+    ]
+  },
+  "Web/API/HTML_Drag_and_Drop_API/File_drag_and_drop": {
+    "modified": "2020-11-01T11:34:07.543Z",
+    "contributors": [
+      "juanrueda",
+      "davidpala.dev",
+      "brahAraya",
+      "ajuni880",
+      "israteneda",
+      "RVidalki",
+      "clarii",
+      "rgomez"
+    ]
+  },
+  "Web/API/HTML_Drag_and_Drop_API": {
+    "modified": "2019-03-24T00:07:57.845Z",
+    "contributors": [
+      "ethertank",
+      "inma_610"
+    ]
+  },
+  "Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types": {
+    "modified": "2019-03-23T23:18:24.597Z",
+    "contributors": [
+      "Evinton"
+    ]
+  },
+  "orphaned/Estructura_de_directorios_de_código_fuente_de_Mozilla": {
+    "modified": "2019-03-24T00:17:11.569Z",
+    "contributors": [
+      "ethertank",
+      "MiguelFRomeroR",
+      "Sheppy"
+    ]
+  },
+  "orphaned/Etiquetas_audio_y_video_en_Firefox": {
+    "modified": "2019-03-23T23:59:36.294Z",
+    "contributors": [
+      "Nukeador",
+      "deimidis"
+    ]
+  },
+  "orphaned/Extensiones/Actualización_de_extensiones_para_Firefox_4": {
+    "modified": "2019-03-24T00:05:58.390Z",
+    "contributors": [
+      "inma_610"
+    ]
+  },
+  "orphaned/FAQ_Incrustando_Mozilla": {
+    "modified": "2019-01-16T16:20:13.874Z",
+    "contributors": [
+      "Lastjuan"
+    ]
+  },
+  "Mozilla/Firefox/Releases/1.5": {
+    "modified": "2019-03-23T23:47:34.365Z",
+    "contributors": [
+      "wbamberg",
+      "SphinxKnight",
+      "Rubenbae",
+      "Pachtonio",
+      "Sheppy",
+      "Mgjbot",
+      "Jorolo",
+      "Fedora-core",
+      "Nukeador",
+      "Takenbot",
+      "Willyaranda",
+      "Pasky",
+      "Angelr04",
+      "Epaclon"
+    ]
+  },
+  "Mozilla/Firefox/Releases/19": {
+    "modified": "2019-03-18T20:54:04.568Z",
+    "contributors": [
+      "ulisestrujillo",
+      "wbamberg",
+      "Sebastianz",
+      "mannyatico"
+    ]
+  },
+  "Mozilla/Firefox/Releases/2": {
+    "modified": "2019-03-23T23:58:56.168Z",
+    "contributors": [
+      "wbamberg",
+      "DoctorRomi",
+      "Markens",
+      "Mgjbot",
+      "Nukeador",
+      "Superruzafa",
+      "Guis",
+      "StripTM",
+      "Jorolo"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3": {
+    "modified": "2019-03-24T00:04:08.312Z",
+    "contributors": [
+      "wbamberg",
+      "teoli",
+      "fscholz",
+      "Mgjbot",
+      "Nukeador",
+      "Surferosx",
+      "Nathymig",
+      "Dfier",
+      "Wrongloop",
+      "Garlock",
+      "Brahiam",
+      "Mariano",
+      "HenryGR",
+      "Jseldon"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3.5": {
+    "modified": "2019-03-24T00:03:16.036Z",
+    "contributors": [
+      "wbamberg",
+      "ethertank",
+      "another_sam",
+      "deimidis",
+      "Nukeador"
+    ]
+  },
+  "orphaned/Firefox_addons_developer_guide/Introduction_to_Extensions": {
+    "modified": "2019-03-23T23:37:41.632Z",
+    "contributors": [
+      "pacommozilla",
+      "AgustinAlvia"
+    ]
+  },
+  "orphaned/Firefox_addons_developer_guide/Technologies_used_in_developing_extensions": {
+    "modified": "2019-03-18T21:16:06.336Z",
+    "contributors": [
+      "AgustinAlvia"
+    ]
+  },
+  "orphaned/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio": {
+    "modified": "2019-01-16T14:22:48.165Z",
+    "contributors": [
+      "inma_610"
+    ]
+  },
+  "orphaned/Fragmentos_de_código": {
+    "modified": "2019-01-16T13:52:44.049Z",
+    "contributors": [
+      "ffox"
+    ]
+  },
+  "orphaned/Funciones": {
+    "modified": "2019-01-16T16:18:04.260Z",
+    "contributors": [
+      "Jorolo"
+    ]
+  },
+  "Games/Tools/asm.js": {
+    "modified": "2019-03-18T21:21:31.919Z",
+    "contributors": [
+      "WilsonIsAliveClone",
+      "serarroy"
+    ]
+  },
+  "Games/Tools": {
+    "modified": "2019-01-16T19:29:51.696Z",
+    "contributors": [
+      "wbamberg",
+      "atlas7jean"
+    ]
+  },
+  "Games/Introduction_to_HTML5_Game_Development": {
+    "modified": "2019-08-05T12:49:59.324Z",
+    "contributors": [
+      "WilsonIsAliveClone"
+    ]
+  },
+  "Games/Introduction": {
+    "modified": "2020-11-28T21:23:49.961Z",
+    "contributors": [
+      "rayrojas",
+      "titox",
+      "gauchoscript",
+      "wbamberg",
+      "Mancux2",
+      "Albizures",
+      "atlas7jean"
+    ]
+  },
+  "Games/Publishing_games/Game_monetization": {
+    "modified": "2019-03-18T21:22:04.540Z",
+    "contributors": [
+      "mikelmg",
+      "carlosgocereceda",
+      "WilsonIsAliveClone"
+    ]
+  },
+  "Games/Tutorials/2D_breakout_game_Phaser/Buttons": {
+    "modified": "2019-11-03T00:22:01.318Z",
+    "contributors": [
+      "AdryDev92",
+      "carlosgocereceda",
+      "serarroy"
+    ]
+  },
+  "Games/Tutorials/2D_breakout_game_Phaser/Bounce_off_the_walls": {
+    "modified": "2019-03-18T21:18:55.239Z",
+    "contributors": [
+      "WilsonIsAliveClone"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls": {
+    "modified": "2019-03-23T22:19:43.884Z",
+    "contributors": [
+      "wbamberg",
+      "regisdark",
+      "profesooooor",
+      "emolinerom"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field": {
+    "modified": "2019-01-17T00:34:48.662Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor",
+      "emolinerom"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls": {
+    "modified": "2019-01-17T00:34:24.542Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor",
+      "emolinerom"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Mouse_controls": {
+    "modified": "2019-01-17T00:34:40.600Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor",
+      "emolinerom"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it": {
+    "modified": "2019-01-17T00:33:08.752Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor",
+      "jolosan"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Collision_detection": {
+    "modified": "2019-03-18T20:48:38.662Z",
+    "contributors": [
+      "juanedsa",
+      "wbamberg",
+      "profesooooor",
+      "emolinerom"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Game_over": {
+    "modified": "2019-03-23T22:17:05.460Z",
+    "contributors": [
+      "wbamberg",
+      "regisdark",
+      "profesooooor",
+      "jolosan"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript": {
+    "modified": "2019-03-23T22:19:39.385Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor",
+      "emolinerom",
+      "jolosan"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Move_the_ball": {
+    "modified": "2019-03-23T22:19:10.641Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor",
+      "jolosan",
+      "emolinerom"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Finishing_up": {
+    "modified": "2019-01-17T01:08:54.537Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor"
+    ]
+  },
+  "Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win": {
+    "modified": "2019-01-17T01:08:23.453Z",
+    "contributors": [
+      "wbamberg",
+      "profesooooor"
+    ]
+  },
+  "Games/Tutorials/HTML5_Gamedev_Phaser_Device_Orientation": {
+    "modified": "2019-03-23T23:11:29.148Z",
+    "contributors": [
+      "wbamberg",
+      "lauttttaro",
+      "chebit"
+    ]
+  },
+  "Games/Tutorials": {
+    "modified": "2019-01-16T19:25:39.809Z",
+    "contributors": [
+      "wbamberg",
+      "groovecoder"
+    ]
+  },
+  "orphaned/Generación_de_GUIDs": {
+    "modified": "2019-03-24T00:06:07.388Z",
+    "contributors": [
+      "ibnkhaldun"
+    ]
+  },
+  "Glossary/Algorithm": {
+    "modified": "2019-01-17T00:09:54.063Z",
+    "contributors": [
+      "ekros"
+    ]
+  },
+  "Glossary/Argument": {
+    "modified": "2019-03-23T22:15:34.303Z",
+    "contributors": [
+      "gparra989"
+    ]
+  },
+  "Glossary/Information_architecture": {
+    "modified": "2020-09-06T16:32:32.362Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Glossary/array": {
+    "modified": "2020-05-28T13:51:10.546Z",
+    "contributors": [
+      "fedoroffs",
+      "BubuAnabelas",
+      "Davids-Devel",
+      "Daniel_Martin",
+      "gparra989"
+    ]
+  },
+  "Glossary/Asynchronous": {
+    "modified": "2020-05-04T10:40:03.360Z",
+    "contributors": [
+      "jorgeCaster",
+      "fjluengo",
+      "gparra989"
+    ]
+  },
+  "Glossary/Attribute": {
+    "modified": "2019-03-23T22:15:46.319Z",
+    "contributors": [
+      "gparra989"
+    ]
+  },
+  "Glossary/General_header": {
+    "modified": "2019-03-18T21:34:28.155Z",
+    "contributors": [
+      "Watermelonnable"
+    ]
+  },
+  "Glossary/Cache": {
+    "modified": "2019-03-18T21:19:00.217Z",
+    "contributors": [
+      "diegorhs"
+    ]
+  },
+  "Glossary/Character": {
+    "modified": "2020-08-23T05:27:25.056Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Glossary/CIA": {
+    "modified": "2019-03-18T21:19:22.724Z",
+    "contributors": [
+      "PabloDeTorre",
+      "sergiomgm"
+    ]
+  },
+  "Glossary/Cipher": {
+    "modified": "2019-03-18T21:19:02.237Z",
+    "contributors": [
+      "PabloDeTorre",
+      "sergiomgm"
+    ]
+  },
+  "Glossary/Card_sorting": {
+    "modified": "2019-03-18T21:19:20.709Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "Glossary/Closure": {
+    "modified": "2020-08-12T18:07:27.330Z",
+    "contributors": [
+      "l1oret"
+    ]
+  },
+  "Glossary/Key": {
+    "modified": "2020-02-18T06:49:22.148Z",
+    "contributors": [
+      "joseluisq",
+      "sergiomgm",
+      "GCF7"
+    ]
+  },
+  "Glossary/Type_coercion": {
+    "modified": "2020-02-29T16:57:08.213Z",
+    "contributors": [
+      "frankynztein"
+    ]
+  },
+  "Glossary/character_set": {
+    "modified": "2020-08-28T18:09:05.836Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Glossary/Constant": {
+    "modified": "2019-03-18T21:19:15.794Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "Glossary/Cryptanalysis": {
+    "modified": "2019-03-18T21:18:36.783Z",
+    "contributors": [
+      "sergiomgm",
+      "GCF7"
+    ]
+  },
+  "Glossary/Cryptography": {
+    "modified": "2019-03-23T22:02:58.447Z",
+    "contributors": [
+      "velizluisma"
+    ]
+  },
+  "Glossary/Decryption": {
+    "modified": "2019-03-18T21:19:11.476Z",
+    "contributors": [
+      "sergiomgm",
+      "GCF7"
+    ]
+  },
+  "orphaned/Glossary/elemento": {
+    "modified": "2019-01-16T19:38:18.287Z",
+    "contributors": [
+      "BubuAnabelas",
+      "HerberWest"
+    ]
+  },
+  "Glossary/Encryption": {
+    "modified": "2019-03-18T21:19:07.209Z",
+    "contributors": [
+      "PabloDeTorre",
+      "carlosCharlie",
+      "sergiomgm"
+    ]
+  },
+  "Glossary/Entity": {
+    "modified": "2020-07-08T14:34:06.256Z",
+    "contributors": [
+      "lucasreta"
+    ]
+  },
+  "Glossary/Whitespace": {
+    "modified": "2020-08-24T04:59:10.953Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Glossary/Data_structure": {
+    "modified": "2019-03-18T21:24:31.453Z",
+    "contributors": [
+      "edsonv"
+    ]
+  },
+  "Glossary/First-class_Function": {
+    "modified": "2020-05-14T19:36:29.513Z",
+    "contributors": [
+      "l1oret",
+      "hmorv",
+      "LaloHao"
+    ]
+  },
+  "Glossary/Function": {
+    "modified": "2019-03-18T21:19:19.995Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "Glossary/Main_thread": {
+    "modified": "2020-03-12T06:05:36.693Z",
+    "contributors": [
+      "elimperiodelaweb"
+    ]
+  },
+  "Glossary/Identifier": {
+    "modified": "2020-08-28T17:30:13.071Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Glossary/Immutable": {
+    "modified": "2019-03-18T21:19:12.385Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "Glossary/UI": {
+    "modified": "2019-03-18T21:18:49.573Z",
+    "contributors": [
+      "diegorhs"
+    ]
+  },
+  "Glossary/Metadata": {
+    "modified": "2019-03-18T21:19:04.572Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "Glossary/Method": {
+    "modified": "2020-07-21T21:37:11.109Z",
+    "contributors": [
+      "Assael02",
+      "Davids-Devel"
+    ]
+  },
+  "Glossary/Breadcrumb": {
+    "modified": "2020-02-02T10:51:21.098Z",
+    "contributors": [
+      "blanchart"
+    ]
+  },
+  "Glossary/Domain_name": {
+    "modified": "2019-03-18T21:19:21.120Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "Glossary/Forbidden_header_name": {
+    "modified": "2019-03-23T22:02:11.147Z",
+    "contributors": [
+      "Luiggy",
+      "tonialfaro"
+    ]
+  },
+  "Glossary/Number": {
+    "modified": "2019-03-23T22:58:03.851Z",
+    "contributors": [
+      "Cleon"
+    ]
+  },
+  "Glossary/Object": {
+    "modified": "2019-03-23T22:58:05.221Z",
+    "contributors": [
+      "Cleon"
+    ]
+  },
+  "Glossary/Operator": {
+    "modified": "2019-03-23T22:53:20.989Z",
+    "contributors": [
+      "germanfr"
+    ]
+  },
+  "Glossary/Operand": {
+    "modified": "2020-09-05T17:33:42.415Z",
+    "contributors": [
+      "brayan-orellanos"
+    ]
+  },
+  "Glossary/Call_stack": {
+    "modified": "2020-04-26T12:00:35.332Z",
+    "contributors": [
+      "l1oret"
+    ]
+  },
+  "Glossary/Preflight_request": {
+    "modified": "2019-03-18T21:29:47.773Z",
+    "contributors": [
+      "daviddelamo"
+    ]
+  },
+  "Glossary/CSS_preprocessor": {
+    "modified": "2019-03-23T22:02:54.782Z",
+    "contributors": [
+      "ealch",
+      "velizluisma"
+    ]
+  },
+  "Glossary/Primitive": {
+    "modified": "2020-09-17T22:06:17.504Z",
+    "contributors": [
+      "Nachec",
+      "cocososo",
+      "abaracedo",
+      "Cleon"
+    ]
+  },
+  "Glossary/property": {
+    "modified": "2020-08-28T18:32:40.804Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Glossary/Pseudo-class": {
+    "modified": "2019-03-23T22:38:49.143Z",
+    "contributors": [
+      "VictorAbdon"
+    ]
+  },
+  "Glossary/Pseudocode": {
+    "modified": "2019-03-18T21:19:15.497Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "Glossary/Recursion": {
+    "modified": "2019-03-18T21:19:02.064Z",
+    "contributors": [
+      "PabloDeTorre",
+      "sergiomgm"
+    ]
+  },
+  "Glossary/SCM": {
+    "modified": "2019-03-18T21:19:21.440Z",
+    "contributors": [
+      "carlosCharlie",
+      "sergiomgm"
+    ]
+  },
+  "Glossary/safe": {
+    "modified": "2019-03-18T21:18:23.904Z",
+    "contributors": [
+      "SackmannDV"
+    ]
+  },
+  "Glossary/Statement": {
+    "modified": "2019-03-23T22:57:58.260Z",
+    "contributors": [
+      "abaracedo",
+      "Cleon"
+    ]
+  },
+  "Glossary/Synchronous": {
+    "modified": "2020-11-14T06:15:42.366Z",
+    "contributors": [
+      "Yuunichi"
+    ]
+  },
+  "Glossary/CMS": {
+    "modified": "2020-05-23T07:15:12.062Z",
+    "contributors": [
+      "l1oret"
+    ]
+  },
+  "Glossary/Ciphertext": {
+    "modified": "2019-03-18T21:19:21.003Z",
+    "contributors": [
+      "sergiomgm",
+      "GCF7"
+    ]
+  },
+  "Glossary/Plaintext": {
+    "modified": "2019-03-18T21:19:20.138Z",
+    "contributors": [
+      "sergiomgm",
+      "GCF7"
+    ]
+  },
+  "Glossary/Dynamic_typing": {
+    "modified": "2020-05-04T14:10:14.107Z",
+    "contributors": [
+      "Caav98"
+    ]
+  },
+  "Glossary/Static_typing": {
+    "modified": "2019-11-22T03:17:09.186Z",
+    "contributors": [
+      "HugolJumex"
+    ]
+  },
+  "Glossary/Validator": {
+    "modified": "2019-03-18T21:19:01.934Z",
+    "contributors": [
+      "PabloDeTorre",
+      "carlosCharlie",
+      "sergiomgm"
+    ]
+  },
+  "Glossary/Value": {
+    "modified": "2020-09-01T08:20:32.500Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Glossary/XForms": {
+    "modified": "2019-03-23T22:15:44.959Z",
+    "contributors": [
+      "gparra989"
+    ]
+  },
+  "orphaned/Guía_para_el_desarrollador_de_agregados_para_Firefox": {
+    "modified": "2019-01-16T14:29:03.747Z",
+    "contributors": [
+      "teoli",
+      "Sheppy",
+      "Eloy"
+    ]
+  },
+  "orphaned/Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones": {
+    "modified": "2019-03-24T00:04:44.724Z",
+    "contributors": [
+      "christopherccg",
+      "Sheppy",
+      "Eloy"
+    ]
+  },
+  "orphaned/Guía_para_la_migración_a_catálogo": {
+    "modified": "2019-01-16T15:34:19.890Z",
+    "contributors": [
+      "HenryGR",
+      "Mgjbot"
+    ]
+  },
+  "orphaned/Herramientas": {
+    "modified": "2019-01-16T13:52:37.109Z",
+    "contributors": [
+      "teoli",
+      "StripTM",
+      "inma_610",
+      "camilourd"
+    ]
+  },
+  "Web/API/Document_object_model/How_to_create_a_DOM_tree": {
+    "modified": "2019-03-23T23:22:26.711Z",
+    "contributors": [
+      "carrillog.luis"
+    ]
+  },
+  "orphaned/HTML/Elemento/datalist": {
+    "modified": "2019-01-16T19:13:20.868Z",
+    "contributors": [
+      "Darkgyro",
+      "teoli"
+    ]
+  },
+  "orphaned/HTML/Elemento/form": {
+    "modified": "2019-01-16T21:24:44.882Z",
+    "contributors": [
+      "eincioch"
+    ]
+  },
+  "orphaned/HTML/Elemento/section": {
+    "modified": "2019-03-23T23:08:59.333Z",
+    "contributors": [
+      "Raulpascual2",
+      "carllewisc",
+      "GeorgeAviateur"
+    ]
+  },
+  "Learn/Forms": {
+    "modified": "2019-03-24T00:17:58.788Z",
+    "contributors": [
+      "DGarCam",
+      "teoli",
+      "prieto.any",
+      "deibyod",
+      "Ces",
+      "hugohabel",
+      "deimidis"
+    ]
+  },
+  "orphaned/Learn/HTML/Forms/HTML5_updates": {
+    "modified": "2019-03-24T00:07:51.068Z",
+    "contributors": [
+      "inma_610",
+      "Izel",
+      "StripTM",
+      "deimidis"
+    ]
+  },
+  "Web/Guide/HTML/HTML5/HTML5_Parser": {
+    "modified": "2019-03-24T00:07:09.448Z",
+    "contributors": [
+      "teoli",
+      "RickieesES",
+      "inma_610",
+      "StripTM",
+      "juanb",
+      "Izel"
+    ]
+  },
+  "Web/Guide/HTML/HTML5": {
+    "modified": "2020-05-16T09:08:08.720Z",
+    "contributors": [
+      "jonasdamher",
+      "SphinxKnight",
+      "anibalymariacantantes60",
+      "AzulMartin",
+      "264531666",
+      "fracp",
+      "damianed",
+      "alfredotemiquel",
+      "rossettistone",
+      "carlossuarez",
+      "teoli",
+      "JosueMolina",
+      "Pablo_Ivan",
+      "welm",
+      "bicentenario",
+      "jesusruiz",
+      "pierre_alfonso",
+      "pitufo_cabron",
+      "cesar_ortiz_elPatox",
+      "inma_610",
+      "vigia122",
+      "StripTM",
+      "deimidis",
+      "Izel"
+    ]
+  },
+  "Web/Guide/HTML/HTML5/Introduction_to_HTML5": {
+    "modified": "2019-03-24T00:05:36.058Z",
+    "contributors": [
+      "teoli",
+      "inma_610"
+    ]
+  },
+  "Web/Guide/HTML/HTML5/Constraint_validation": {
+    "modified": "2020-08-11T08:06:04.309Z",
+    "contributors": [
+      "gerardo750711",
+      "israel-munoz"
+    ]
+  },
+  "orphaned/Incrustando_Mozilla/Comunidad": {
+    "modified": "2019-03-23T22:39:14.279Z",
+    "contributors": [
+      "vamm1981"
+    ]
+  },
+  "conflicting/Web/API/IndexedDB_API": {
+    "modified": "2019-03-18T21:11:08.379Z",
+    "contributors": [
+      "duduindo",
+      "teoli",
+      "semptrion",
+      "CHORVAT",
+      "inma_610"
+    ]
+  },
+  "orphaned/Instalación_de_motores_de_búsqueda_desde_páginas_web": {
+    "modified": "2019-01-16T16:13:53.798Z",
+    "contributors": [
+      "teoli",
+      "Nukeador",
+      "Jorolo"
+    ]
+  },
+  "Learn/Accessibility/What_is_accessibility": {
+    "modified": "2020-07-16T22:40:03.734Z",
+    "contributors": [
+      "editorUOC"
+    ]
+  },
+  "Learn/Learning_and_getting_help": {
+    "modified": "2020-09-02T21:15:54.167Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Learn/Common_questions/How_much_does_it_cost": {
+    "modified": "2020-07-16T22:35:45.385Z",
+    "contributors": [
+      "Beatriz_Ortega_Valdes"
+    ]
+  },
+  "Learn/Common_questions/Common_web_layouts": {
+    "modified": "2020-07-16T22:35:42.298Z",
+    "contributors": [
+      "Beatriz_Ortega_Valdes"
+    ]
+  },
+  "Learn/Common_questions/What_is_a_web_server": {
+    "modified": "2020-10-27T18:34:43.608Z",
+    "contributors": [
+      "noksenberg",
+      "Yel-Martinez-Consultor-Seo",
+      "Spectrum369",
+      "Luisk955",
+      "Sebaspaco",
+      "flaki53",
+      "welm"
+    ]
+  },
+  "Learn/Common_questions/What_is_a_URL": {
+    "modified": "2020-07-16T22:35:29.126Z",
+    "contributors": [
+      "ezzep66",
+      "BubuAnabelas"
+    ]
+  },
+  "Learn/Common_questions/What_software_do_I_need": {
+    "modified": "2020-07-16T22:35:32.855Z",
+    "contributors": [
+      "Beatriz_Ortega_Valdes"
+    ]
+  },
+  "orphaned/Learn/How_to_contribute": {
+    "modified": "2020-07-16T22:33:43.206Z",
+    "contributors": [
+      "SphinxKnight",
+      "Code118",
+      "dervys19",
+      "javierdelpino",
+      "axgeon",
+      "Leonardo_Valdez",
+      "cgsramirez"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Cascade_and_inheritance": {
+    "modified": "2020-09-10T08:32:11.848Z",
+    "contributors": [
+      "renatico",
+      "UOCccorcoles",
+      "Enesimus",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Overflowing_content": {
+    "modified": "2020-09-07T07:36:40.422Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Debugging_CSS": {
+    "modified": "2020-10-15T22:26:23.448Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Sizing_items_in_CSS": {
+    "modified": "2020-07-16T22:29:20.704Z",
+    "contributors": [
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/The_box_model": {
+    "modified": "2020-09-06T15:07:38.107Z",
+    "contributors": [
+      "UOCccorcoles",
+      "capitanzealot",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Backgrounds_and_borders": {
+    "modified": "2020-09-06T17:26:53.330Z",
+    "contributors": [
+      "UOCccorcoles",
+      "psotresc",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Images_media_form_elements": {
+    "modified": "2020-07-16T22:29:24.707Z",
+    "contributors": [
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Handling_different_text_directions": {
+    "modified": "2020-07-31T14:48:40.359Z",
+    "contributors": [
+      "AndrewSKV",
+      "Enesimus"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Selectors/Combinators": {
+    "modified": "2020-09-06T14:09:26.839Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Selectors": {
+    "modified": "2020-09-06T12:41:53.412Z",
+    "contributors": [
+      "UOCccorcoles",
+      "VichoReyes",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements": {
+    "modified": "2020-09-06T13:58:30.411Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Selectors/Attribute_selectors": {
+    "modified": "2020-09-06T13:34:27.599Z",
+    "contributors": [
+      "UOCccorcoles",
+      "psotresc",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors": {
+    "modified": "2020-09-06T13:13:47.580Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Values_and_units": {
+    "modified": "2020-09-07T09:35:00.652Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/CSS_layout/Responsive_Design": {
+    "modified": "2020-07-16T22:27:27.257Z",
+    "contributors": [
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/CSS_layout/Normal_Flow": {
+    "modified": "2020-07-16T22:27:20.728Z",
+    "contributors": [
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/CSS_layout/Introduction": {
+    "modified": "2020-09-15T13:39:37.384Z",
+    "contributors": [
+      "UOCccorcoles",
+      "AndrewSKV",
+      "editorUOC",
+      "Jhonaz"
+    ]
+  },
+  "Learn/CSS/CSS_layout/Supporting_Older_Browsers": {
+    "modified": "2020-07-16T22:27:17.501Z",
+    "contributors": [
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/First_steps/Getting_started": {
+    "modified": "2020-08-31T14:16:45.193Z",
+    "contributors": [
+      "UOCccorcoles",
+      "AndrewSKV",
+      "tito-ramirez",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/First_steps/How_CSS_works": {
+    "modified": "2020-09-18T07:47:46.630Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/First_steps/How_CSS_is_structured": {
+    "modified": "2020-08-31T16:55:37.346Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/First_steps/What_is_CSS": {
+    "modified": "2020-10-15T22:25:30.119Z",
+    "contributors": [
+      "UOCccorcoles",
+      "Enesimus",
+      "editorUOC"
+    ]
+  },
+  "Learn/CSS/First_steps/Using_your_new_knowledge": {
+    "modified": "2020-08-23T19:45:30.596Z",
+    "contributors": [
+      "capitanzealot",
+      "AndrewSKV",
+      "Enesimus"
+    ]
+  },
+  "Learn/CSS/Building_blocks/Fundamental_CSS_comprehension": {
+    "modified": "2020-07-16T22:28:11.693Z",
+    "contributors": [
+      "Creasick",
+      "Enesimus",
+      "javierpolit",
+      "DennisM"
+    ]
+  },
+  "Learn/CSS/Howto/Generated_content": {
+    "modified": "2020-07-16T22:25:47.515Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Juansereina",
+      "lavilofam1"
+    ]
+  },
+  "Learn/CSS/Howto": {
+    "modified": "2020-07-16T22:25:42.139Z",
+    "contributors": [
+      "alebarbaja",
+      "abestrad1"
+    ]
+  },
+  "Learn/CSS/Styling_text/Web_fonts": {
+    "modified": "2020-09-01T07:26:18.054Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/Front-end_web_developer": {
+    "modified": "2020-11-18T03:33:37.370Z",
+    "contributors": [
+      "SphinxKnight",
+      "marquezpedro151",
+      "andresf.duran",
+      "Nachec"
+    ]
+  },
+  "Learn/Getting_started_with_the_web/How_the_Web_works": {
+    "modified": "2020-07-16T22:33:59.672Z",
+    "contributors": [
+      "Enesimus",
+      "Maose",
+      "rulo_diaz",
+      "SphinxKnight"
+    ]
+  },
+  "Learn/Getting_started_with_the_web/Installing_basic_software": {
+    "modified": "2020-11-10T01:28:22.294Z",
+    "contributors": [
+      "rockoldo",
+      "Nachec",
+      "Maose",
+      "Anyito",
+      "ingridc",
+      "Enesimus",
+      "israel-munoz",
+      "Neto2412",
+      "AngelFQC",
+      "mads0306",
+      "Da_igual",
+      "Chrixos",
+      "darbalma"
+    ]
+  },
+  "Learn/Getting_started_with_the_web/The_web_and_web_standards": {
+    "modified": "2020-09-03T04:02:22.375Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Learn/Getting_started_with_the_web/Dealing_with_files": {
+    "modified": "2020-09-23T03:12:43.364Z",
+    "contributors": [
+      "Nachec",
+      "chrisdavidmills",
+      "NavetsArev",
+      "Maose",
+      "airmind97",
+      "hamfree",
+      "israel-munoz",
+      "GuilleMiranda",
+      "merol-dad",
+      "samshara1",
+      "mads0306",
+      "mamptecnocrata",
+      "Huarseral",
+      "diazwatson"
+    ]
+  },
+  "Learn/Tools_and_testing/Cross_browser_testing": {
+    "modified": "2020-07-16T22:38:59.665Z",
+    "contributors": [
+      "arnoldobr"
+    ]
+  },
+  "Learn/Tools_and_testing/GitHub": {
+    "modified": "2020-10-01T17:01:32.394Z",
+    "contributors": [
+      "IsraFloores",
+      "Nachec"
+    ]
+  },
+  "Learn/Tools_and_testing": {
+    "modified": "2020-07-16T22:38:54.378Z",
+    "contributors": [
+      "WilsonIsAliveClone",
+      "carlosgocereceda",
+      "mikelmg"
+    ]
+  },
+  "Learn/Tools_and_testing/Client-side_JavaScript_frameworks": {
+    "modified": "2020-08-22T19:34:32.519Z",
+    "contributors": [
+      "spaceinvadev",
+      "jhonarielgj"
+    ]
+  },
+  "Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started": {
+    "modified": "2020-08-22T19:52:35.580Z",
+    "contributors": [
+      "spaceinvadev"
+    ]
+  },
+  "Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started": {
+    "modified": "2020-09-17T18:53:24.146Z",
+    "contributors": [
+      "Faem0220"
+    ]
+  },
+  "Learn/Tools_and_testing/Understanding_client-side_tools": {
+    "modified": "2020-07-28T15:51:57.413Z",
+    "contributors": [
+      "b3m3bi"
+    ]
+  },
+  "Learn/HTML/Howto": {
+    "modified": "2020-07-16T22:22:28.075Z",
+    "contributors": [
+      "Loba25",
+      "blanchart",
+      "welm"
+    ]
+  },
+  "Learn/HTML/Howto/Use_data_attributes": {
+    "modified": "2020-10-29T15:52:03.444Z",
+    "contributors": [
+      "angeljpa95",
+      "camsa",
+      "laatcode"
+    ]
+  },
+  "Learn/Forms/How_to_build_custom_form_controls": {
+    "modified": "2020-07-16T22:21:55.231Z",
+    "contributors": [
+      "laatcode"
+    ]
+  },
+  "Learn/Forms/How_to_structure_a_web_form": {
+    "modified": "2020-09-18T11:13:13.645Z",
+    "contributors": [
+      "UOCccorcoles",
+      "UOCjcanovasi",
+      "editorUOC",
+      "chrisdavidmills",
+      "eljonims"
+    ]
+  },
+  "conflicting/Learn/Forms": {
+    "modified": "2020-07-16T22:20:56.050Z",
+    "contributors": [
+      "xyvs",
+      "mikiangel10",
+      "chrisdavidmills",
+      "eljonims",
+      "sjmiles"
+    ]
+  },
+  "Learn/Forms/Property_compatibility_table_for_form_controls": {
+    "modified": "2020-08-30T01:12:52.090Z",
+    "contributors": [
+      "edchasw"
+    ]
+  },
+  "Learn/Forms/Test_your_skills:_HTML5_controls": {
+    "modified": "2020-07-16T22:22:11.445Z",
+    "contributors": [
+      "Enesimus"
+    ]
+  },
+  "Learn/Forms/Test_your_skills:_Other_controls": {
+    "modified": "2020-07-16T22:22:12.140Z",
+    "contributors": [
+      "Enesimus"
+    ]
+  },
+  "Learn/Forms/Sending_and_retrieving_form_data": {
+    "modified": "2020-07-16T22:21:26.056Z",
+    "contributors": [
+      "Rafasu",
+      "rocioDEV",
+      "MrGreen",
+      "OseChez",
+      "DaniNz",
+      "peternerd",
+      "SphinxKnight",
+      "chrisdavidmills",
+      "Ricky_Lomax"
+    ]
+  },
+  "Learn/Forms/Styling_web_forms": {
+    "modified": "2020-07-16T22:21:30.546Z",
+    "contributors": [
+      "OMEGAYALFA",
+      "chrisdavidmills",
+      "cizquierdof"
+    ]
+  },
+  "Learn/Forms/Basic_native_form_controls": {
+    "modified": "2020-09-15T08:02:23.197Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC",
+      "rayrojas"
+    ]
+  },
+  "Learn/Forms/HTML5_input_types": {
+    "modified": "2020-10-30T10:06:35.877Z",
+    "contributors": [
+      "alejandro0619",
+      "panpy-web"
+    ]
+  },
+  "Learn/Forms/Form_validation": {
+    "modified": "2020-11-19T13:12:47.854Z",
+    "contributors": [
+      "tcebrian",
+      "UOCccorcoles",
+      "UOCjcanovasi",
+      "editorUOC",
+      "blanchart",
+      "israel-munoz"
+    ]
+  },
+  "Learn/Forms/Your_first_form": {
+    "modified": "2020-09-15T05:57:07.460Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC",
+      "BraisOliveira",
+      "OMEGAYALFA",
+      "OrlandoDeJesusCuxinYama",
+      "Giikah",
+      "chrisdavidmills",
+      "HGARZON"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Advanced_text_formatting": {
+    "modified": "2020-09-05T21:21:55.228Z",
+    "contributors": [
+      "Nachec",
+      "UOCccorcoles",
+      "Enesimus",
+      "jmalsar",
+      "editorUOC",
+      "RG52",
+      "luchiano199",
+      "AlieYin"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Creating_hyperlinks": {
+    "modified": "2020-09-05T04:27:29.218Z",
+    "contributors": [
+      "Nachec",
+      "UOCccorcoles",
+      "juan.grred",
+      "Enesimus",
+      "jmalsar",
+      "blanchart",
+      "editorUOC",
+      "Myuel",
+      "MichaelMejiaMora",
+      "ferlopezcarr",
+      "javierpolit"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Debugging_HTML": {
+    "modified": "2020-08-31T12:17:08.843Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC",
+      "javierpolit"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Document_and_website_structure": {
+    "modified": "2020-09-06T16:55:31.460Z",
+    "contributors": [
+      "Nachec",
+      "UOCccorcoles",
+      "editorUOC",
+      "chaerf",
+      "AlidaContreras",
+      "javierpolit",
+      "SoftwareRVG",
+      "welm"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content": {
+    "modified": "2020-07-16T22:24:18.388Z",
+    "contributors": [
+      "SoftwareRVG"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML": {
+    "modified": "2020-09-03T05:18:15.831Z",
+    "contributors": [
+      "Nachec",
+      "Enesimus",
+      "ivanagui2",
+      "Sergio_Gonzalez_Collado",
+      "cizquierdof",
+      "AngelFQC"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Getting_started": {
+    "modified": "2020-11-24T21:57:47.560Z",
+    "contributors": [
+      "nilo15",
+      "Nachec",
+      "UOCccorcoles",
+      "maodecolombia",
+      "Enesimus",
+      "editorUOC",
+      "narvmtz",
+      "dmipaguirre",
+      "BubuAnabelas",
+      "marlabarbz",
+      "erllanosr",
+      "r2fv",
+      "jonasmreza",
+      "Cjpertuz",
+      "yan-vega",
+      "Armando-Cruz",
+      "felixgomez",
+      "olvap",
+      "emermao",
+      "soedrego",
+      "Abihu",
+      "mitocondriaco",
+      "nahuelsotelo",
+      "dayamll",
+      "JimP99",
+      "EdwinTorres",
+      "salvarez1988",
+      "cizquierdof",
+      "juanluis",
+      "welm"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Marking_up_a_letter": {
+    "modified": "2020-07-16T22:23:11.881Z",
+    "contributors": [
+      "jmalsar",
+      "luchiano199",
+      "javierpolit"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML": {
+    "modified": "2020-11-07T18:07:55.376Z",
+    "contributors": [
+      "nilo15",
+      "Nachec",
+      "UOCccorcoles",
+      "ccorcoles",
+      "editorUOC",
+      "hector080",
+      "clarii",
+      "Myuel",
+      "dmipaguirre",
+      "Armando-Cruz",
+      "MichaelMejiaMora",
+      "soedrego",
+      "absaucedo",
+      "venomdj2011",
+      "CarlosJose"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Test_your_skills:_Links": {
+    "modified": "2020-07-16T22:24:22.922Z",
+    "contributors": [
+      "Enesimus"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Test_your_skills:_HTML_text_basics": {
+    "modified": "2020-07-16T22:24:21.949Z",
+    "contributors": [
+      "Enesimus"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/Test_your_skills:_Advanced_HTML_text": {
+    "modified": "2020-09-05T23:06:12.474Z",
+    "contributors": [
+      "walter.boba79"
+    ]
+  },
+  "Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals": {
+    "modified": "2020-09-04T15:00:09.675Z",
+    "contributors": [
+      "Nachec",
+      "UOCccorcoles",
+      "Enesimus",
+      "Maose",
+      "ccorcoles",
+      "editorUOC",
+      "hector080",
+      "JulianMahecha",
+      "BubuAnabelas",
+      "RafaelVentura",
+      "jadiosc",
+      "dcarmal-dayvo",
+      "Owildfox",
+      "Myuel",
+      "dmipaguirre",
+      "Dany07",
+      "welm"
+    ]
+  },
+  "Learn/HTML/Tables/Basics": {
+    "modified": "2020-09-09T11:52:38.720Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/HTML/Tables/Advanced": {
+    "modified": "2020-09-14T06:33:13.790Z",
+    "contributors": [
+      "UOCccorcoles",
+      "editorUOC"
+    ]
+  },
+  "Learn/HTML/Tables": {
+    "modified": "2020-07-16T22:25:11.000Z",
+    "contributors": [
+      "Drathveloper",
+      "IXTRUnai"
+    ]
+  },
+  "Learn/HTML/Tables/Structuring_planet_data": {
+    "modified": "2020-07-16T22:25:29.339Z",
+    "contributors": [
+      "IXTRUnai"
+    ]
+  },
+  "Learn/JavaScript/Building_blocks/Looping_code": {
+    "modified": "2020-10-10T18:54:10.014Z",
+    "contributors": [
+      "GianGuerra",
+      "Enesimus",
+      "josecampo",
+      "jesusvillalta",
+      "yohanolmedo",
+      "Zenchy",
+      "SebastianMaciel"
+    ]
+  },
+  "Learn/JavaScript/Building_blocks/Build_your_own_function": {
+    "modified": "2020-07-16T22:31:28.751Z",
+    "contributors": [
+      "InmobAli",
+      "serarroy",
+      "carlosgocereceda"
+    ]
+  },
+  "Learn/JavaScript/Building_blocks/Events": {
+    "modified": "2020-07-16T22:31:37.027Z",
+    "contributors": [
+      "jhonarielgj",
+      "sebastiananea",
+      "maximilianotulian",
+      "ismamz"
+    ]
+  },
+  "Learn/JavaScript/Building_blocks/Image_gallery": {
+    "modified": "2020-07-16T22:31:42.753Z",
+    "contributors": [
+      "amIsmael"
+    ]
+  },
+  "Learn/JavaScript/Client-side_web_APIs/Introduction": {
+    "modified": "2020-07-16T22:32:44.249Z",
+    "contributors": [
+      "robertsallent",
+      "gonzaa96",
+      "Usuario001",
+      "kevtinoco",
+      "Anonymous",
+      "OrlandoDeJesusCuxinYama"
+    ]
+  },
+  "Learn/JavaScript/First_steps/Silly_story_generator": {
+    "modified": "2020-11-28T18:15:56.503Z",
+    "contributors": [
+      "willian593",
+      "Enesimus",
+      "fj1261",
+      "keskyle17",
+      "antqted"
+    ]
+  },
+  "Learn/JavaScript/First_steps/Math": {
+    "modified": "2020-08-11T20:21:00.937Z",
+    "contributors": [
+      "Nachec",
+      "Enesimus",
+      "keskyle17",
+      "Creasick",
+      "Aussith_9NT",
+      "JaviMartain",
+      "guibetancur",
+      "domingoacd",
+      "jjpc"
+    ]
+  },
+  "Learn/JavaScript/First_steps/Test_your_skills:_Strings": {
+    "modified": "2020-08-11T12:16:57.685Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Learn/JavaScript/First_steps/What_is_JavaScript": {
+    "modified": "2020-08-08T22:05:17.982Z",
+    "contributors": [
+      "Nachec",
+      "zgreco2000",
+      "jacobo.delgado",
+      "console",
+      "c9009",
+      "Creasick",
+      "bosspetta",
+      "alejoWeb",
+      "JorgeAML",
+      "eliud-c-delgado",
+      "roberbnd"
+    ]
+  },
+  "Learn/JavaScript/Objects/Object_building_practice": {
+    "modified": "2020-07-16T22:32:30.877Z",
+    "contributors": [
+      "r-vasquez",
+      "rayrojas",
+      "luchiano199",
+      "Sergio_Gonzalez_Collado",
+      "pomarbar"
+    ]
+  },
+  "Learn/Server-side/Django/Introduction": {
+    "modified": "2020-07-16T22:36:38.315Z",
+    "contributors": [
+      "dr2d4",
+      "jlpb97",
+      "oalberto96",
+      "javierdelpino",
+      "oscvic"
+    ]
+  },
+  "Learn/Server-side/First_steps": {
+    "modified": "2020-07-16T22:36:08.254Z",
+    "contributors": [
+      "javierdelpino"
+    ]
+  },
+  "Learn/Server-side/First_steps/Introduction": {
+    "modified": "2020-07-16T22:36:13.094Z",
+    "contributors": [
+      "AnaHertaj",
+      "SphinxKnight",
+      "mortyBL",
+      "javierdelpino"
+    ]
+  },
+  "Learn/Server-side/First_steps/Website_security": {
+    "modified": "2020-07-16T22:36:27.856Z",
+    "contributors": [
+      "isaine",
+      "Slb-Sbsz",
+      "javierdelpino"
+    ]
+  },
+  "Learn/Server-side/First_steps/Client-Server_overview": {
+    "modified": "2020-07-16T22:36:18.740Z",
+    "contributors": [
+      "Slb-Sbsz",
+      "javierdelpino"
+    ]
+  },
+  "Learn/Server-side/First_steps/Web_frameworks": {
+    "modified": "2020-07-16T22:36:23.784Z",
+    "contributors": [
+      "Slb-Sbsz",
+      "javierdelpino"
+    ]
+  },
+  "Learn/Common_questions/Using_Github_pages": {
+    "modified": "2020-07-16T22:35:51.571Z",
+    "contributors": [
+      "DaniNz",
+      "LuyisiMiger",
+      "TAXIS"
+    ]
+  },
+  "Glossary/Localization": {
+    "modified": "2019-01-16T13:31:36.167Z",
+    "contributors": [
+      "DirkS",
+      "RickieesES",
+      "Mgjbot",
+      "Verruckt",
+      "Jorolo",
+      "Takenbot",
+      "Nukeador",
+      "Radigar"
+    ]
+  },
+  "orphaned/Localizar_con_Narro": {
+    "modified": "2019-03-24T00:12:25.538Z",
+    "contributors": [
+      "jvmjunior",
+      "deimidis"
+    ]
+  },
+  "MDN/At_ten": {
+    "modified": "2019-03-23T22:49:57.954Z",
+    "contributors": [
+      "pabloveintimilla",
+      "diego.mauricio.meneses.rios"
+    ]
+  },
+  "orphaned/MDN/Community": {
+    "modified": "2020-04-24T19:14:03.228Z",
+    "contributors": [
+      "inwm",
+      "SphinxKnight",
+      "wbamberg",
+      "jenyvera",
+      "0zxo",
+      "Jeremie",
+      "LeoHirsch",
+      "luisgm76"
+    ]
+  },
+  "orphaned/MDN/Community/Working_in_community": {
+    "modified": "2020-09-03T13:14:53.733Z",
+    "contributors": [
+      "FoulMangoPY",
+      "jswisher",
+      "wbamberg",
+      "welm",
+      "Sebastian.Nagles"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Create_an_MDN_account": {
+    "modified": "2020-08-21T18:14:17.930Z",
+    "contributors": [
+      "Tomillo",
+      "JADE-2006",
+      "wbamberg",
+      "JuniorBO",
+      "Arudb79",
+      "LeoHirsch"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Document_a_CSS_property/Property_template": {
+    "modified": "2019-03-18T21:31:21.033Z",
+    "contributors": [
+      "wbamberg",
+      "B1tF8er"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Tag_JavaScript_pages": {
+    "modified": "2019-01-16T19:47:18.318Z",
+    "contributors": [
+      "wbamberg",
+      "LeoHirsch"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Remove_Experimental_Macros": {
+    "modified": "2020-07-05T17:06:56.383Z",
+    "contributors": [
+      "Anibalismo"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Do_an_editorial_review": {
+    "modified": "2019-03-18T20:54:27.132Z",
+    "contributors": [
+      "LauraJaime8",
+      "wbamberg",
+      "ElNobDeTfm",
+      "Arudb79",
+      "LeoHirsch"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Do_a_technical_review": {
+    "modified": "2019-01-16T18:56:48.857Z",
+    "contributors": [
+      "wbamberg",
+      "MarkelCuesta",
+      "rowasc",
+      "LeoHirsch"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Set_the_summary_for_a_page": {
+    "modified": "2020-07-05T16:17:53.925Z",
+    "contributors": [
+      "Anibalismo",
+      "Maose",
+      "wbamberg",
+      "gerard.am",
+      "LeoHirsch"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Use_navigation_sidebars": {
+    "modified": "2019-05-08T17:34:30.854Z",
+    "contributors": [
+      "ivanagui2"
+    ]
+  },
+  "orphaned/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web": {
+    "modified": "2020-06-26T02:13:25.044Z",
+    "contributors": [
+      "Enesimus",
+      "pablorebora",
+      "blanchart",
+      "BubuAnabelas",
+      "SphinxKnight",
+      "FranciscoImanolSuarez"
+    ]
+  },
+  "MDN/Contribute/Processes": {
+    "modified": "2019-01-17T02:12:44.469Z",
+    "contributors": [
+      "wbamberg",
+      "astrapotro"
+    ]
+  },
+  "MDN/Guidelines/Conventions_definitions": {
+    "modified": "2020-09-30T15:28:56.412Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Nachec"
+    ]
+  },
+  "MDN/Guidelines/Writing_style_guide": {
+    "modified": "2020-09-30T15:28:56.038Z",
+    "contributors": [
+      "chrisdavidmills",
+      "blanchart",
+      "clarii",
+      "wbamberg",
+      "Jeremie",
+      "Salamandra101",
+      "Dgeek",
+      "fscholz",
+      "LeoHirsch",
+      "teoli",
+      "Pgulijczuk",
+      "DoctorRomi",
+      "Nukeador",
+      "Nanomo",
+      "Eqx",
+      "Jorolo"
+    ]
+  },
+  "MDN/Yari": {
+    "modified": "2019-09-09T15:52:33.535Z",
+    "contributors": [
+      "SphinxKnight",
+      "clarii",
+      "wbamberg",
+      "Jeremie",
+      "Diio",
+      "atlas7jean"
+    ]
+  },
+  "MDN/Structures/Live_samples": {
+    "modified": "2020-09-30T09:06:15.983Z",
+    "contributors": [
+      "chrisdavidmills",
+      "wbamberg",
+      "emanuelvega",
+      "LUISTGMDN",
+      "elihro"
+    ]
+  },
+  "MDN/Structures/Macros/Other": {
+    "modified": "2020-09-30T09:06:17.522Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Nachec"
+    ]
+  },
+  "MDN/Structures/Compatibility_tables": {
+    "modified": "2020-10-15T22:33:39.399Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Nachec"
+    ]
+  },
+  "MDN/Tools/KumaScript": {
+    "modified": "2020-09-30T16:48:19.117Z",
+    "contributors": [
+      "chrisdavidmills",
+      "wbamberg",
+      "velizluisma",
+      "Jeremie",
+      "LeoHirsch"
+    ]
+  },
+  "orphaned/MDN/Tools/Page_regeneration": {
+    "modified": "2020-09-30T16:48:19.365Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Anibalismo"
+    ]
+  },
+  "orphaned/MDN/Tools/Template_editing": {
+    "modified": "2020-09-30T16:48:19.234Z",
+    "contributors": [
+      "chrisdavidmills",
+      "wbamberg",
+      "juan-ferrer-toribio"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/DOM_improvements": {
+    "modified": "2019-03-23T23:50:52.840Z",
+    "contributors": [
+      "wbamberg",
+      "Mgjbot",
+      "RickieesES",
+      "Nukeador",
+      "HenryGR",
+      "Talisker"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/SVG_improvements": {
+    "modified": "2019-03-23T23:50:55.206Z",
+    "contributors": [
+      "wbamberg",
+      "Mgjbot",
+      "RickieesES",
+      "Nukeador",
+      "Talisker"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/XUL_improvements_in_Firefox_3": {
+    "modified": "2019-03-24T00:02:34.038Z",
+    "contributors": [
+      "wbamberg",
+      "fscholz",
+      "Nukeador",
+      "Mgjbot",
+      "Nathymig",
+      "Dukebody"
+    ]
+  },
+  "orphaned/Migrar_aplicaciones_desde_Internet_Explorer_a_Mozilla": {
+    "modified": "2019-03-23T23:59:56.566Z",
+    "contributors": [
+      "teoli",
+      "Siyivan",
+      "krusch",
+      "Mgjbot",
+      "Mrgonzalez",
+      "Superruzafa",
+      "Ttataje",
+      "Nukeador"
+    ]
+  },
+  "orphaned/Modo_casi_estándar_de_Gecko": {
+    "modified": "2019-03-23T23:43:50.956Z",
+    "contributors": [
+      "teoli",
+      "Mgjbot",
+      "Jorolo"
+    ]
+  },
+  "orphaned/Módulos_JavaScript": {
+    "modified": "2019-03-23T23:53:21.168Z",
+    "contributors": [
+      "SphinxKnight",
+      "teoli",
+      "Mgjbot",
+      "Ffranz",
+      "Mariano"
+    ]
+  },
+  "Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension": {
+    "modified": "2019-03-18T21:08:05.873Z",
+    "contributors": [
+      "hecaxmmx",
+      "rgo",
+      "jde-gr",
+      "doztrock",
+      "yuniers"
+    ]
+  },
+  "orphaned/Mozilla/Add-ons/WebExtensions/Debugging": {
+    "modified": "2019-03-18T21:05:20.525Z",
+    "contributors": [
+      "Pau"
+    ]
+  },
+  "orphaned/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension": {
+    "modified": "2019-03-18T21:08:10.456Z",
+    "contributors": [
+      "fitojb",
+      "yuniers"
+    ]
+  },
+  "Mozilla/Add-ons/WebExtensions/Prerequisites": {
+    "modified": "2019-03-23T22:45:28.352Z",
+    "contributors": [
+      "yuniers"
+    ]
+  },
+  "orphaned/Mozilla/Add-ons/WebExtensions/Package_your_extension_": {
+    "modified": "2019-03-18T21:05:24.379Z",
+    "contributors": [
+      "FacundoCerezo",
+      "IXTRUnai"
+    ]
+  },
+  "Mozilla/Add-ons/WebExtensions/What_are_WebExtensions": {
+    "modified": "2020-11-23T00:59:33.889Z",
+    "contributors": [
+      "kenliten",
+      "hecaxmmx",
+      "13539"
+    ]
+  },
+  "Mozilla/Add-ons/WebExtensions/Your_first_WebExtension": {
+    "modified": "2020-11-23T01:34:20.681Z",
+    "contributors": [
+      "kenliten",
+      "IgnacioMilia",
+      "mppfiles",
+      "adderou",
+      "hecaxmmx",
+      "Maller_Lagoon"
+    ]
+  },
+  "Mozilla/Add-ons/WebExtensions/Your_second_WebExtension": {
+    "modified": "2019-04-25T06:15:12.057Z",
+    "contributors": [
+      "Klius",
+      "IgnacioMilia",
+      "chicocoulomb",
+      "hecaxmmx",
+      "yuniers"
+    ]
+  },
+  "Mozilla/Add-ons/WebExtensions/user_interface/Browser_action": {
+    "modified": "2019-03-18T21:03:34.447Z",
+    "contributors": [
+      "adderou"
+    ]
+  },
+  "Mozilla/Developer_guide/Mozilla_build_FAQ": {
+    "modified": "2019-03-23T23:58:56.616Z",
+    "contributors": [
+      "chrisdavidmills",
+      "fscholz",
+      "teoli",
+      "DoctorRomi",
+      "Nukeador",
+      "Mgjbot",
+      "Blank zero"
+    ]
+  },
+  "Mozilla/Developer_guide/Source_Code/CVS": {
+    "modified": "2019-03-23T23:46:33.805Z",
+    "contributors": [
+      "chrisdavidmills",
+      "teoli",
+      "Nukeador",
+      "Mgjbot",
+      "Blank zero"
+    ]
+  },
+  "orphaned/nsDirectoryService": {
+    "modified": "2019-03-23T23:40:31.943Z",
+    "contributors": [
+      "teoli",
+      "Breaking Pitt"
+    ]
+  },
+  "orphaned/Participar_en_el_proyecto_Mozilla": {
+    "modified": "2019-03-24T00:07:54.638Z",
+    "contributors": [
+      "teoli",
+      "inma_610"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/Templates": {
+    "modified": "2019-03-24T00:02:45.436Z",
+    "contributors": [
+      "wbamberg",
+      "fscholz",
+      "Nukeador",
+      "Kaltya",
+      "Mgjbot"
+    ]
+  },
+  "orphaned/Preguntas_frecuentes_sobre_incrustación_en_Mozilla": {
+    "modified": "2019-01-16T15:02:38.544Z",
+    "contributors": [
+      "Anonymous"
+    ]
+  },
+  "orphaned/Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación": {
+    "modified": "2019-01-16T16:13:02.334Z",
+    "contributors": [
+      "Jorolo",
+      "Lastjuan"
+    ]
+  },
+  "orphaned/Principios_básicos_de_los_servicios_Web": {
+    "modified": "2019-01-16T16:13:03.069Z",
+    "contributors": [
+      "Jorolo",
+      "Xoan",
+      "Breaking Pitt"
+    ]
+  },
+  "orphaned/Recursos_en_modo_desconectado_en_Firefox": {
+    "modified": "2019-03-18T21:11:07.042Z",
+    "contributors": [
+      "duduindo",
+      "Mgjbot",
+      "Nukeador",
+      "Nathymig",
+      "HenryGR"
+    ]
+  },
+  "orphaned/Referencia_de_XUL": {
+    "modified": "2019-04-19T23:18:32.719Z",
+    "contributors": [
+      "wbamberg",
+      "teoli",
+      "chukito"
+    ]
+  },
+  "Web/API/Document_Object_Model/Whitespace": {
+    "modified": "2020-08-24T04:42:05.596Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/API/Document_Object_Model/Examples": {
+    "modified": "2019-03-23T23:51:24.173Z",
+    "contributors": [
+      "SphinxKnight",
+      "khalid32",
+      "Mgjbot",
+      "Manu",
+      "Markens",
+      "Nathymig"
+    ]
+  },
+  "Web/API/Document_Object_Model/Events": {
+    "modified": "2019-03-18T21:45:13.362Z",
+    "contributors": [
+      "recortes"
+    ]
+  },
+  "Web/API/Document_Object_Model": {
+    "modified": "2019-01-16T16:01:11.054Z",
+    "contributors": [
+      "DR",
+      "Nathymig"
+    ]
+  },
+  "Web/API/Document_Object_Model/Introduction": {
+    "modified": "2019-03-23T23:48:16.078Z",
+    "contributors": [
+      "LuisSevillano",
+      "IsaacAaron",
+      "Sheppy",
+      "Uri",
+      "Nathymig"
+    ]
+  },
+  "Web/API/Document_object_model/Locating_DOM_elements_using_selectors": {
+    "modified": "2020-06-14T19:56:35.416Z",
+    "contributors": [
+      "snickArg"
+    ]
+  },
+  "Web/Guide/HTML/Using_HTML_sections_and_outlines": {
+    "modified": "2019-03-23T23:38:22.567Z",
+    "contributors": [
+      "blanchart",
+      "eljonims",
+      "welm",
+      "javigaar",
+      "learnercys",
+      "pierre_alfonso",
+      "jesanchez"
+    ]
+  },
+  "Mozilla/Firefox/Releases/2/Security_changes": {
+    "modified": "2019-03-23T23:42:29.185Z",
+    "contributors": [
+      "wbamberg",
+      "teoli",
+      "Nukeador"
+    ]
+  },
+  "orphaned/Selección_de_modo_en_Mozilla": {
+    "modified": "2019-11-21T20:40:48.950Z",
+    "contributors": [
+      "wbamberg",
+      "teoli",
+      "fscholz",
+      "Jorolo"
+    ]
+  },
+  "Web/API/Server-sent_events": {
+    "modified": "2019-03-23T23:24:42.323Z",
+    "contributors": [
+      "ethertank"
+    ]
+  },
+  "Web/API/Server-sent_events/Using_server-sent_events": {
+    "modified": "2019-04-16T06:11:09.003Z",
+    "contributors": [
+      "albertoclarbrines",
+      "adlr",
+      "iamwao",
+      "jgutix",
+      "aztrock"
+    ]
+  },
+  "orphaned/Storage": {
+    "modified": "2019-03-24T00:09:02.141Z",
+    "contributors": [
+      "teoli",
+      "elPatox",
+      "Francoyote",
+      "HenryGR",
+      "Mgjbot"
+    ]
+  },
+  "Web/SVG/SVG_1.1_Support_in_Firefox": {
+    "modified": "2019-03-23T23:43:25.545Z",
+    "contributors": [
+      "teoli",
+      "Superruzafa",
+      "Jorolo"
+    ]
+  },
+  "Tools/Keyboard_shortcuts": {
+    "modified": "2020-07-28T10:35:37.425Z",
+    "contributors": [
+      "Anibalismo",
+      "ssm",
+      "hugojavierduran9",
+      "marcorichetta"
+    ]
+  },
+  "orphaned/Tools/Add-ons": {
+    "modified": "2020-07-16T22:36:23.274Z",
+    "contributors": [
+      "mfluehr"
+    ]
+  },
+  "Tools/Debugger/How_to/Use_a_source_map": {
+    "modified": "2020-07-16T22:35:12.325Z",
+    "contributors": [
+      "Makinita"
+    ]
+  },
+  "Tools/Performance": {
+    "modified": "2020-07-16T22:36:12.530Z",
+    "contributors": [
+      "LesterGuerra",
+      "juanmapiquero",
+      "PorcoMaledette"
+    ]
+  },
+  "Tools/Performance/UI_Tour": {
+    "modified": "2020-07-16T22:36:14.726Z",
+    "contributors": [
+      "kynu",
+      "calcerrada",
+      "ramferposadas"
+    ]
+  },
+  "Tools/Web_Audio_Editor": {
+    "modified": "2020-07-16T22:36:08.308Z",
+    "contributors": [
+      "MPoli"
+    ]
+  },
+  "Tools/Style_Editor": {
+    "modified": "2020-07-16T22:35:00.009Z",
+    "contributors": [
+      "jwhitlock",
+      "cheline",
+      "SoftwareRVG",
+      "JosshuaCalixto1",
+      "maybe",
+      "padre629",
+      "CagsaBit"
+    ]
+  },
+  "Tools/Network_Monitor": {
+    "modified": "2020-07-16T22:35:29.709Z",
+    "contributors": [
+      "sevillacode",
+      "Makinita",
+      "_cuco_",
+      "Ivan-Perez",
+      "Dieg"
+    ]
+  },
+  "Tools/Page_Inspector/3-pane_mode": {
+    "modified": "2020-07-16T22:34:53.611Z",
+    "contributors": [
+      "welm"
+    ]
+  },
+  "Tools/Page_Inspector/How_to/Open_the_Inspector": {
+    "modified": "2020-07-16T22:34:32.611Z",
+    "contributors": [
+      "amaiafilo"
+    ]
+  },
+  "Tools/Page_Inspector/How_to/Examine_and_edit_the_box_model": {
+    "modified": "2020-07-16T22:34:34.150Z",
+    "contributors": [
+      "amaiafilo"
+    ]
+  },
+  "Tools/Page_Inspector/How_to/Examine_and_edit_HTML": {
+    "modified": "2020-07-16T22:34:40.440Z",
+    "contributors": [
+      "amaiafilo"
+    ]
+  },
+  "Tools/Page_Inspector/How_to/Inspect_and_select_colors": {
+    "modified": "2020-07-16T22:34:34.877Z",
+    "contributors": [
+      "amaiafilo"
+    ]
+  },
+  "Tools/Page_Inspector/How_to/Reposition_elements_in_the_page": {
+    "modified": "2020-07-16T22:34:45.756Z",
+    "contributors": [
+      "alebarbaja"
+    ]
+  },
+  "Tools/Remote_Debugging/Firefox_for_Android": {
+    "modified": "2020-07-16T22:35:38.980Z",
+    "contributors": [
+      "odelrio",
+      "pawer13",
+      "pacommozilla",
+      "StripTM"
+    ]
+  },
+  "Tools/Responsive_Design_Mode": {
+    "modified": "2020-07-16T22:35:21.169Z",
+    "contributors": [
+      "adolfotc",
+      "HugoM1682",
+      "amaiafilo",
+      "walter.atg",
+      "maedca"
+    ]
+  },
+  "Tools/Taking_screenshots": {
+    "modified": "2020-07-16T22:36:38.280Z",
+    "contributors": [
+      "picandocodigo"
+    ]
+  },
+  "Tools/Web_Console/UI_Tour": {
+    "modified": "2020-07-16T22:34:17.075Z",
+    "contributors": [
+      "JonoyeMasuso"
+    ]
+  },
+  "Tools/Web_Console/The_command_line_interpreter": {
+    "modified": "2020-08-27T20:06:30.290Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "orphaned/Traducir_las_descripciones_de_las_extensiones": {
+    "modified": "2019-03-23T23:53:33.332Z",
+    "contributors": [
+      "teoli",
+      "Nukeador",
+      "Sebastianzartner@gmx.de",
+      "D20v02d",
+      "Mgjbot"
+    ]
+  },
+  "orphaned/Traducir_una_extensión": {
+    "modified": "2019-03-23T23:57:54.041Z",
+    "contributors": [
+      "Sebastianz",
+      "teoli",
+      "Sheppy",
+      "gironlievanos",
+      "Mgjbot",
+      "Superruzafa"
+    ]
+  },
+  "Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces": {
+    "modified": "2019-03-23T23:20:26.633Z",
+    "contributors": [
+      "lajaso",
+      "jucazam",
+      "pablo.turati"
+    ]
+  },
+  "orphaned/Usando_archivos_desde_aplicaciones_web": {
+    "modified": "2019-03-24T00:07:10.927Z",
+    "contributors": [
+      "SphinxKnight",
+      "AngelFQC",
+      "StripTM",
+      "Izel",
+      "deimidis",
+      "maedca"
+    ]
+  },
+  "orphaned/Usar_código_de_Mozilla_en_otros_proyectos": {
+    "modified": "2019-03-24T00:09:00.370Z",
+    "contributors": [
+      "maedca",
+      "inma_610"
+    ]
+  },
+  "orphaned/Usar_web_workers": {
+    "modified": "2019-03-24T00:07:32.918Z",
+    "contributors": [
+      "teoli",
+      "ajimix",
+      "inma_610"
+    ]
+  },
+  "orphaned/Usar_XPInstall_para_instalar_plugins": {
+    "modified": "2019-01-16T16:11:23.781Z",
+    "contributors": [
+      "Superruzafa",
+      "Fedora-core",
+      "Floot"
+    ]
+  },
+  "Web/API/Document_object_model/Using_the_W3C_DOM_Level_1_Core": {
+    "modified": "2019-12-13T21:06:41.403Z",
+    "contributors": [
+      "wbamberg",
+      "jswisher"
+    ]
+  },
+  "orphaned/Uso_del_núcleo_del_nivel_1_del_DOM": {
+    "modified": "2019-12-13T21:10:23.918Z",
+    "contributors": [
+      "wbamberg",
+      "broxmgs",
+      "Superruzafa",
+      "Jorolo"
+    ]
+  },
+  "orphaned/Vigilar_plugins": {
+    "modified": "2019-01-16T15:35:57.481Z",
+    "contributors": [
+      "HenryGR"
+    ]
+  },
+  "Web/API/Web_Audio_API": {
+    "modified": "2019-03-23T23:31:19.634Z",
+    "contributors": [
+      "estebanborai",
+      "AngelFQC",
+      "Pau_Ilargia",
+      "maedca"
+    ]
+  },
+  "Web/Accessibility/Community": {
+    "modified": "2019-03-23T23:41:25.430Z",
+    "contributors": [
+      "teoli",
+      "Jorolo"
+    ]
+  },
+  "Web/Accessibility": {
+    "modified": "2020-09-22T14:24:03.363Z",
+    "contributors": [
+      "FranciscoImanolSuarez",
+      "Gummox",
+      "Mediavilladiezj",
+      "cisval",
+      "monserratcallejaalmazan",
+      "chmutoff",
+      "teoli",
+      "DoctorRomi",
+      "Mgjbot",
+      "Jorolo",
+      "Lowprofile",
+      "Wikier",
+      "Nukeador",
+      "Gonzobonzoo"
+    ]
+  },
+  "Web/Accessibility/Understanding_WCAG/Text_labels_and_names": {
+    "modified": "2020-05-21T19:43:48.950Z",
+    "contributors": [
+      "giioaj",
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/Accessibility/Understanding_WCAG": {
+    "modified": "2019-03-18T21:25:29.001Z",
+    "contributors": [
+      "evaferreira"
+    ]
+  },
+  "Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast": {
+    "modified": "2020-06-09T06:15:36.471Z",
+    "contributors": [
+      "11bits",
+      "apenab"
+    ]
+  },
+  "Web/Accessibility/Understanding_WCAG/Perceivable": {
+    "modified": "2019-03-18T21:25:19.991Z",
+    "contributors": [
+      "evaferreira"
+    ]
+  },
+  "Web/Accessibility/Understanding_WCAG/Keyboard": {
+    "modified": "2020-09-28T17:32:58.697Z",
+    "contributors": [
+      "megatux",
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-required_attribute": {
+    "modified": "2019-08-28T11:54:04.515Z",
+    "contributors": [
+      "IsraelFloresDGA",
+      "Karla_Glez"
+    ]
+  },
+  "Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role": {
+    "modified": "2019-08-28T12:48:39.532Z",
+    "contributors": [
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/Accessibility/ARIA/forms/alerts": {
+    "modified": "2020-08-13T01:22:34.331Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/Accessibility/ARIA/forms/Basic_form_hints": {
+    "modified": "2019-03-18T21:22:07.007Z",
+    "contributors": [
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/Accessibility/ARIA/forms/Multipart_labels": {
+    "modified": "2019-11-27T15:16:55.571Z",
+    "contributors": [
+      "IsaacAaron",
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/API/Animation/Animation": {
+    "modified": "2019-03-23T22:05:09.399Z",
+    "contributors": [
+      "IngoBongo"
+    ]
+  },
+  "Web/API/Animation/finished": {
+    "modified": "2019-03-23T22:05:06.573Z",
+    "contributors": [
+      "IngoBongo"
+    ]
+  },
+  "Web/API/Animation/currentTime": {
+    "modified": "2019-03-23T22:05:12.506Z",
+    "contributors": [
+      "IngoBongo"
+    ]
+  },
+  "Web/API/Web_Storage_API": {
+    "modified": "2019-03-23T22:46:51.819Z",
+    "contributors": [
+      "fherce",
+      "AlePerez92",
+      "VictorAbdon"
+    ]
+  },
+  "Web/API/Web_Storage_API/Using_the_Web_Storage_API": {
+    "modified": "2020-08-14T20:09:18.391Z",
+    "contributors": [
+      "Enesimus",
+      "fherce"
+    ]
+  },
+  "Web/API/Clipboard_API": {
+    "modified": "2020-10-15T22:31:40.101Z",
+    "contributors": [
+      "gato"
+    ]
+  },
+  "Web/API/Canvas_API/Tutorial/Compositing/Example": {
+    "modified": "2019-03-18T21:36:04.043Z",
+    "contributors": [
+      "lajaso"
+    ]
+  },
+  "Web/API/Console/table": {
+    "modified": "2019-03-23T22:20:30.589Z",
+    "contributors": [
+      "AlePerez92"
+    ]
+  },
+  "Web/API/Document/open": {
+    "modified": "2020-10-15T22:31:23.051Z",
+    "contributors": [
+      "WillieMensa"
+    ]
+  },
+  "Web/API/XMLDocument/async": {
+    "modified": "2019-03-23T22:57:43.989Z",
+    "contributors": [
+      "MauroEldritch"
+    ]
+  },
+  "Web/API/Document/createAttribute": {
+    "modified": "2020-10-15T21:55:08.825Z",
+    "contributors": [
+      "rodririobo",
+      "juanseromo12",
+      "FenixAlive"
+    ]
+  },
+  "Web/API/DocumentOrShadowRoot/pointerLockElement": {
+    "modified": "2019-03-23T22:05:31.350Z",
+    "contributors": [
+      "arquigames"
+    ]
+  },
+  "Web/API/DOMString/Binary": {
+    "modified": "2020-08-29T03:33:22.030Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/API/GlobalEventHandlers/onwheel": {
+    "modified": "2019-03-18T21:09:09.483Z",
+    "contributors": [
+      "fscholz",
+      "SoftwareRVG"
+    ]
+  },
+  "Web/API/HTMLVideoElement": {
+    "modified": "2019-06-22T13:44:40.927Z",
+    "contributors": [
+      "Santi72Alc",
+      "myrnafig"
+    ]
+  },
+  "Web/API/Fetch_API/Basic_concepts": {
+    "modified": "2019-03-18T21:24:00.327Z",
+    "contributors": [
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/API/Fetch_API/Using_Fetch": {
+    "modified": "2020-12-08T11:29:15.934Z",
+    "contributors": [
+      "mondeja",
+      "arturojimenezmedia",
+      "camsa",
+      "jccuevas",
+      "MateoVelilla",
+      "crimoniv",
+      "danielM9521",
+      "SphinxKnight",
+      "Ruluk",
+      "jpuerto",
+      "baumannzone",
+      "anjerago",
+      "icedrek",
+      "royexr",
+      "AlePerez92"
+    ]
+  },
+  "Web/API/WindowEventHandlers/onunload": {
+    "modified": "2019-03-23T23:39:28.498Z",
+    "contributors": [
+      "fscholz",
+      "khalid32",
+      "Sheppy"
+    ]
+  },
+  "Web/API/HTMLOrForeignElement/dataset": {
+    "modified": "2020-10-15T22:06:35.887Z",
+    "contributors": [
+      "OneLoneFox",
+      "PacoVela",
+      "ultraklon",
+      "pipepico",
+      "AlePerez92"
+    ]
+  },
+  "Web/API/HTMLOrForeignElement/focus": {
+    "modified": "2020-10-15T21:51:27.517Z",
+    "contributors": [
+      "IsraelFloresDGA",
+      "AlePerez92",
+      "jesumv"
+    ]
+  },
+  "Web/API/ElementCSSInlineStyle/style": {
+    "modified": "2019-03-23T23:58:09.934Z",
+    "contributors": [
+      "SphinxKnight",
+      "fscholz",
+      "khalid32",
+      "teoli",
+      "HenryGR"
+    ]
+  },
+  "Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB": {
+    "modified": "2020-01-13T04:48:11.759Z",
+    "contributors": [
+      "chrisdavidmills",
+      "fscholz",
+      "elin3t",
+      "sebasmagri"
+    ]
+  },
+  "Web/API/IndexedDB_API/Using_IndexedDB": {
+    "modified": "2020-01-13T04:48:12.209Z",
+    "contributors": [
+      "chrisdavidmills",
+      "gama",
+      "Pcost8300",
+      "franvalmo",
+      "frank-orellana",
+      "otif11",
+      "urbanogb",
+      "AlePerez92",
+      "beatriz-merino",
+      "matajm",
+      "elin3t",
+      "maparrar"
+    ]
+  },
+  "Web/API/Navigator/geolocation": {
+    "modified": "2019-03-23T23:31:55.176Z",
+    "contributors": [
+      "jabarrioss",
+      "AlePerez92",
+      "fscholz",
+      "jsx",
+      "lfentanes"
+    ]
+  },
+  "Web/API/NavigatorOnLine/Online_and_offline_events": {
+    "modified": "2019-01-16T15:46:38.836Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Mgjbot",
+      "Nukeador",
+      "RickieesES",
+      "Unixcoder"
+    ]
+  },
+  "Web/API/Node/parentElement": {
+    "modified": "2020-10-15T21:55:42.512Z",
+    "contributors": [
+      "AlePerez92",
+      "LRojas",
+      "tureey"
+    ]
+  },
+  "Web/API/Node/insertBefore": {
+    "modified": "2020-10-15T21:36:49.326Z",
+    "contributors": [
+      "AlePerez92",
+      "danvao",
+      "Sedoy",
+      "carpasse"
+    ]
+  },
+  "Web/API/Notifications_API/Using_the_Notifications_API": {
+    "modified": "2020-04-11T06:35:05.696Z",
+    "contributors": [
+      "davidelx",
+      "IXTRUnai"
+    ]
+  },
+  "Web/API/Crypto/getRandomValues": {
+    "modified": "2020-10-15T21:49:57.084Z",
+    "contributors": [
+      "hecmonter",
+      "joseluisq",
+      "julianmoji"
+    ]
+  },
+  "Web/HTTP/Headers/Digest": {
+    "modified": "2020-10-15T22:27:29.781Z",
+    "contributors": [
+      "joseluisq"
+    ]
+  },
+  "orphaned/Web/API/Web_Crypto_API/Checking_authenticity_with_password": {
+    "modified": "2019-03-23T22:10:43.026Z",
+    "contributors": [
+      "haxdai"
+    ]
+  },
+  "Web/API/Web_Speech_API/Using_the_Web_Speech_API": {
+    "modified": "2020-05-10T18:32:28.954Z",
+    "contributors": [
+      "mcarou"
+    ]
+  },
+  "Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL": {
+    "modified": "2019-03-23T22:37:32.127Z",
+    "contributors": [
+      "asarch",
+      "Giovan"
+    ]
+  },
+  "Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL": {
+    "modified": "2019-03-23T22:15:44.225Z",
+    "contributors": [
+      "BubuAnabelas",
+      "marce_1994"
+    ]
+  },
+  "Web/API/WebSockets_API/Writing_WebSocket_server": {
+    "modified": "2019-05-21T02:54:42.354Z",
+    "contributors": [
+      "SphinxKnight",
+      "manueljrs",
+      "Yantup",
+      "jjmontes"
+    ]
+  },
+  "Web/API/WebSockets_API/Writing_WebSocket_servers": {
+    "modified": "2019-06-21T20:55:28.443Z",
+    "contributors": [
+      "alesalva",
+      "SphinxKnight",
+      "juanmanuelramallo",
+      "8manuel",
+      "llekn",
+      "jjmontes",
+      "augus1990"
     ]
   },
-  "Web/Events/animationend": {
+  "Web/API/WindowOrWorkerGlobalScope/atob": {
+    "modified": "2019-03-23T23:03:12.715Z",
+    "contributors": [
+      "fscholz",
+      "sathyasanles"
+    ]
+  },
+  "Glossary/Base64": {
+    "modified": "2020-10-08T22:36:13.676Z",
+    "contributors": [
+      "kevinandresviedmanlopez",
+      "carloscasalar",
+      "Arukantara",
+      "sathyasanles"
+    ]
+  },
+  "Web/API/WindowOrWorkerGlobalScope/clearInterval": {
+    "modified": "2019-03-23T22:56:16.485Z",
+    "contributors": [
+      "Guitxo"
+    ]
+  },
+  "Web/API/WindowOrWorkerGlobalScope/clearTimeout": {
+    "modified": "2019-06-18T10:20:27.972Z",
+    "contributors": [
+      "AlePerez92",
+      "fscholz",
+      "basemnassar11",
+      "VictorArias"
+    ]
+  },
+  "Web/API/WindowOrWorkerGlobalScope/setInterval": {
+    "modified": "2020-08-24T18:02:23.092Z",
+    "contributors": [
+      "mastertrooper",
+      "Makinita",
+      "Klius",
+      "claudionebbia"
+    ]
+  },
+  "Web/API/WindowOrWorkerGlobalScope/setTimeout": {
+    "modified": "2019-03-23T23:17:29.378Z",
+    "contributors": [
+      "BubuAnabelas",
+      "vltamara",
+      "nauj27",
+      "fscholz",
+      "AshfaqHossain",
+      "VictorArias"
+    ]
+  },
+  "Web/API/FormData": {
+    "modified": "2020-10-15T21:22:58.694Z",
+    "contributors": [
+      "AlePerez92",
+      "vladimirbat",
+      "alvaromorenomorales",
+      "ojgarciab",
+      "Sheppy",
+      "AngelFQC",
+      "wilo",
+      "marco_mucino"
+    ]
+  },
+  "Web/CSS/:user-invalid": {
+    "modified": "2019-03-23T22:30:48.940Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/:autofill": {
+    "modified": "2019-03-23T22:29:31.809Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/:not": {
+    "modified": "2020-11-30T09:54:17.195Z",
+    "contributors": [
+      "blanchart",
+      "lajaso",
+      "teoli",
+      "jotadeaa",
+      "luisgagocasas"
+    ]
+  },
+  "Web/CSS/::file-selector-button": {
+    "modified": "2019-03-18T21:21:36.190Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/box-flex": {
+    "modified": "2019-03-23T22:36:18.128Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/box-pack": {
+    "modified": "2019-03-23T22:36:13.348Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/user-modify": {
+    "modified": "2019-03-23T22:35:48.381Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/@media/height": {
+    "modified": "2020-10-15T22:23:38.815Z",
+    "contributors": [
+      "IsraelFloresDGA"
+    ]
+  },
+  "Web/CSS/@media/resolution": {
+    "modified": "2019-03-23T22:38:40.675Z",
+    "contributors": [
+      "Conradin88"
+    ]
+  },
+  "Web/CSS/CSS_Columns": {
+    "modified": "2019-03-23T22:28:10.699Z",
+    "contributors": [
+      "Anonymous"
+    ]
+  },
+  "Web/CSS/Comments": {
+    "modified": "2019-03-23T22:16:58.806Z",
+    "contributors": [
+      "israel-munoz"
+    ]
+  },
+  "orphaned/Web/CSS/Comenzando_(tutorial_CSS)": {
+    "modified": "2019-03-23T23:39:37.048Z",
+    "contributors": [
+      "teoli",
+      "jsalinas"
+    ]
+  },
+  "orphaned/Web/CSS/Como_iniciar": {
+    "modified": "2019-01-16T13:59:37.327Z",
+    "contributors": [
+      "teoli",
+      "Izel"
+    ]
+  },
+  "Web/CSS/CSS_Animations/Detecting_CSS_animation_support": {
+    "modified": "2019-03-23T22:41:48.122Z",
+    "contributors": [
+      "wbamberg",
+      "CristhianLora1",
+      "DracotMolver"
+    ]
+  },
+  "Web/CSS/CSS_Animations/Using_CSS_animations": {
+    "modified": "2020-07-06T16:16:21.887Z",
+    "contributors": [
+      "Jazperist",
+      "miguelgilmartinez",
+      "fermelli",
+      "GasGen",
+      "KattyaCuevas",
+      "rod232",
+      "Jvalenz1982",
+      "SphinxKnight",
+      "teoli",
+      "onerbs",
+      "Luis_Calvo",
+      "ulisescab"
+    ]
+  },
+  "Web/CSS/CSS_Background_and_Borders/Border-image_generator": {
+    "modified": "2019-03-23T22:41:48.777Z",
+    "contributors": [
+      "teoli",
+      "mcclone2001"
+    ]
+  },
+  "Web/CSS/CSS_Colors/Color_picker_tool": {
+    "modified": "2019-03-23T22:23:27.596Z",
+    "contributors": [
+      "elihro"
+    ]
+  },
+  "Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox": {
+    "modified": "2019-03-18T21:18:33.523Z",
+    "contributors": [
+      "danpaltor"
+    ]
+  },
+  "Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox": {
+    "modified": "2020-03-25T21:15:58.856Z",
+    "contributors": [
+      "amazing79",
+      "otello1971",
+      "cwalternicolas"
+    ]
+  },
+  "Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout": {
+    "modified": "2019-10-01T23:38:23.285Z",
+    "contributors": [
+      "jcastillaingeniero",
+      "amaiafilo",
+      "IsraelFloresDGA",
+      "jorgemontoyab"
+    ]
+  },
+  "Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout": {
+    "modified": "2019-12-18T12:24:17.824Z",
+    "contributors": [
+      "amazing79",
+      "natalygiraldo",
+      "amaiafilo",
+      "TavoTrash",
+      "aribet",
+      "jorgemontoyab"
+    ]
+  },
+  "Web/CSS/CSS_Logical_Properties/Sizing": {
+    "modified": "2019-03-19T19:17:23.927Z",
+    "contributors": [
+      "teffcode"
+    ]
+  },
+  "Web/CSS/CSS_Box_Model": {
+    "modified": "2019-03-23T22:37:33.458Z",
+    "contributors": [
+      "tipoqueno",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model": {
+    "modified": "2019-08-28T10:35:24.055Z",
+    "contributors": [
+      "tipoqueno"
+    ]
+  },
+  "Web/CSS/CSS_Box_Model/Mastering_margin_collapsing": {
+    "modified": "2019-03-23T22:32:15.462Z",
+    "contributors": [
+      "amaiafilo",
+      "Ralexhx",
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index/Adding_z-index": {
+    "modified": "2019-03-23T22:32:38.884Z",
+    "contributors": [
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_and_float": {
+    "modified": "2019-04-26T07:22:46.044Z",
+    "contributors": [
+      "SphinxKnight",
+      "LaGallinaTuruleta",
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1": {
+    "modified": "2019-03-23T22:32:36.821Z",
+    "contributors": [
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_2": {
+    "modified": "2019-03-23T22:32:34.821Z",
+    "contributors": [
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_3": {
+    "modified": "2019-03-23T22:32:30.208Z",
+    "contributors": [
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context": {
+    "modified": "2019-03-23T22:32:44.958Z",
+    "contributors": [
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index": {
+    "modified": "2019-03-18T20:42:17.583Z",
+    "contributors": [
+      "ChipTime",
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index": {
+    "modified": "2019-03-23T22:32:47.571Z",
+    "contributors": [
+      "javichito"
+    ]
+  },
+  "Web/CSS/CSS_Conditional_Rules": {
+    "modified": "2019-03-23T22:05:34.864Z",
+    "contributors": [
+      "arnulfolg"
+    ]
+  },
+  "Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property": {
+    "modified": "2019-03-24T00:04:04.275Z",
+    "contributors": [
+      "teoli",
+      "fscholz",
+      "Mgjbot",
+      "Jorolo"
+    ]
+  },
+  "Web/CSS/Replaced_element": {
+    "modified": "2019-03-23T23:08:30.961Z",
+    "contributors": [
+      "jdbazagaruiz"
+    ]
+  },
+  "Web/CSS/Specificity": {
+    "modified": "2020-11-14T17:11:45.294Z",
+    "contributors": [
+      "0neomar",
+      "fer",
+      "glrodasz",
+      "mariupereyra",
+      "arjusgit",
+      "DavidGalvis",
+      "gcjuan",
+      "LuisSevillano",
+      "deimidis2",
+      "aeroxmotion",
+      "padrecedano",
+      "Remohir"
+    ]
+  },
+  "Web/CSS/gradient": {
+    "modified": "2019-03-23T22:37:34.623Z",
+    "contributors": [
+      "devilkillermc",
+      "mym2013",
+      "Sebastianz",
+      "wizAmit",
+      "slayslot",
+      "Conradin88"
+    ]
+  },
+  "Web/CSS/Tools/Cubic_Bezier_Generator": {
+    "modified": "2019-03-18T21:20:03.429Z",
+    "contributors": [
+      "gsalinase"
+    ]
+  },
+  "Web/CSS/Tools": {
+    "modified": "2019-03-23T22:28:04.142Z",
+    "contributors": [
+      "arturoblack"
+    ]
+  },
+  "Web/Progressive_web_apps/Responsive/Media_types": {
+    "modified": "2019-03-18T21:15:11.297Z",
+    "contributors": [
+      "luismj"
+    ]
+  },
+  "Web/CSS/percentage": {
+    "modified": "2019-03-23T23:25:05.075Z",
+    "contributors": [
+      "fscholz",
+      "teoli",
+      "aerotrink"
+    ]
+  },
+  "Learn/CSS/Howto/CSS_FAQ": {
+    "modified": "2020-07-16T22:25:44.798Z",
+    "contributors": [
+      "teoli",
+      "inma_610"
+    ]
+  },
+  "orphaned/Web/CSS/Primeros_pasos": {
+    "modified": "2019-03-24T00:05:34.862Z",
+    "contributors": [
+      "teoli",
+      "deimidis"
+    ]
+  },
+  "Web/CSS/Pseudo-elements": {
+    "modified": "2019-03-23T23:21:50.048Z",
+    "contributors": [
+      "BubuAnabelas",
+      "VictorAbdon",
+      "teoli",
+      "jota1410"
+    ]
+  },
+  "Web/CSS/Reference": {
+    "modified": "2019-03-24T00:14:13.384Z",
+    "contributors": [
+      "lajaso",
+      "israel-munoz",
+      "joshitobuba",
+      "mrstork",
+      "prayash",
+      "malayaleecoder",
+      "teoli",
+      "tregagnon",
+      "inma_610",
+      "fscholz",
+      "Nukeador"
+    ]
+  },
+  "Web/CSS/mix-blend-mode": {
+    "modified": "2020-10-15T21:37:53.265Z",
+    "contributors": [
+      "Undigon",
+      "mrstork",
+      "teoli",
+      "Sebastianz",
+      "msanz"
+    ]
+  },
+  "Web/CSS/resolution": {
+    "modified": "2019-03-23T22:38:44.850Z",
+    "contributors": [
+      "Sebastianz",
+      "Prinz_Rana",
+      "Conradin88"
+    ]
+  },
+  "orphaned/Web/CSS/rtl": {
+    "modified": "2019-01-16T15:48:03.556Z",
+    "contributors": [
+      "teoli",
+      "HenryGR"
+    ]
+  },
+  "Web/CSS/Attribute_selectors": {
+    "modified": "2020-10-15T21:26:03.862Z",
+    "contributors": [
+      "blanchart",
+      "MoisesGuevara",
+      "lajaso",
+      "teoli",
+      "jota1410"
+    ]
+  },
+  "Web/CSS/CSS_Selectors": {
+    "modified": "2019-07-09T01:16:13.123Z",
+    "contributors": [
+      "missmakita",
+      "blanchart",
+      "Benji1337",
+      "metal-gogo",
+      "kikolevante"
+    ]
+  },
+  "Web/CSS/CSS_Selectors/Using_the_:target_pseudo-class_in_selectors": {
+    "modified": "2020-07-31T07:57:08.167Z",
+    "contributors": [
+      "blanchart",
+      "israel-munoz"
+    ]
+  },
+  "Web/CSS/Adjacent_sibling_combinator": {
+    "modified": "2019-03-23T22:39:30.908Z",
+    "contributors": [
+      "alkaithil"
+    ]
+  },
+  "Web/CSS/General_sibling_combinator": {
+    "modified": "2019-03-23T22:39:33.429Z",
+    "contributors": [
+      "alkaithil"
+    ]
+  },
+  "Web/CSS/Value_definition_syntax": {
+    "modified": "2019-03-23T22:38:52.899Z",
+    "contributors": [
+      "apazacoder",
+      "Sebastianz",
+      "Guillaume-Heras",
+      "VictorAbdon"
+    ]
+  },
+  "Web/CSS/CSS_Text": {
+    "modified": "2019-03-23T22:36:23.444Z",
+    "contributors": [
+      "pekechis"
+    ]
+  },
+  "Web/CSS/CSS_Transitions/Using_CSS_transitions": {
+    "modified": "2019-08-01T05:58:17.579Z",
+    "contributors": [
+      "chrisdavidmills",
+      "mrstork",
+      "alberdigital",
+      "teoli",
+      "inma_610",
+      "deimidis"
+    ]
+  },
+  "Web/CSS/computed_value": {
+    "modified": "2019-03-23T23:53:20.456Z",
+    "contributors": [
+      "teoli",
+      "Mgjbot",
+      "Firewordy",
+      "HenryGR"
+    ]
+  },
+  "Web/CSS/initial_value": {
+    "modified": "2019-01-16T15:32:31.295Z",
+    "contributors": [
+      "teoli",
+      "Mgjbot",
+      "Nathymig",
+      "HenryGR"
+    ]
+  },
+  "Web/API/HTMLElement/animationend_event": {
     "modified": "2019-03-23T22:31:35.580Z",
     "contributors": [
       "ExE-Boss",
       "soncco"
     ]
   },
-  "Web/Events/beforeunload": {
+  "Web/API/Window/beforeunload_event": {
     "modified": "2019-04-30T14:05:00.135Z",
     "contributors": [
       "wbamberg",
@@ -15232,7 +16451,7 @@
       "Bant89"
     ]
   },
-  "Web/Events/blur": {
+  "Web/API/Element/blur_event": {
     "modified": "2019-03-23T22:40:57.440Z",
     "contributors": [
       "ExE-Boss",
@@ -15242,7 +16461,19 @@
       "javier-alba"
     ]
   },
-  "Web/Events/load": {
+  "Web/API/Window/DOMContentLoaded_event": {
+    "modified": "2019-09-06T00:37:43.389Z",
+    "contributors": [
+      "wbamberg",
+      "jramcast",
+      "ExE-Boss",
+      "fscholz",
+      "AlexOfSoCal",
+      "jdmgarcia",
+      "daniville"
+    ]
+  },
+  "Web/API/Window/load_event": {
     "modified": "2019-04-30T13:43:52.776Z",
     "contributors": [
       "wbamberg",
@@ -15250,7 +16481,7 @@
       "AlePerez92"
     ]
   },
-  "Web/Events/loadend": {
+  "Web/API/XMLHttpRequest/loadend_event": {
     "modified": "2019-03-23T22:09:49.071Z",
     "contributors": [
       "ExE-Boss",
@@ -15258,7 +16489,7 @@
       "darioperez"
     ]
   },
-  "Web/Events/pointerlockchange": {
+  "Web/API/Document/pointerlockchange_event": {
     "modified": "2019-03-18T21:16:43.654Z",
     "contributors": [
       "ExE-Boss",
@@ -15266,7 +16497,7 @@
       "arquigames"
     ]
   },
-  "Web/Events/transitioncancel": {
+  "Web/API/HTMLElement/transitioncancel_event": {
     "modified": "2019-04-30T14:14:15.478Z",
     "contributors": [
       "wbamberg",
@@ -15274,7 +16505,7 @@
       "juan-ferrer-toribio"
     ]
   },
-  "Web/Events/transitionend": {
+  "Web/API/HTMLElement/transitionend_event": {
     "modified": "2019-03-23T22:04:18.976Z",
     "contributors": [
       "ExE-Boss",
@@ -15282,45 +16513,7 @@
       "juan-ferrer-toribio"
     ]
   },
-  "Web/Guide": {
-    "modified": "2019-07-18T20:35:32.528Z",
-    "contributors": [
-      "clarii",
-      "D3Portillo",
-      "Breaking Pitt",
-      "VictorAbdon",
-      "n2nand",
-      "Puchoti",
-      "DrTrucho",
-      "DanielCarron",
-      "daroswing",
-      "osodi",
-      "LeoHirsch",
-      "hjaguen",
-      "ethertank",
-      "Sheppy"
-    ]
-  },
-  "Web/Guide/AJAX": {
-    "modified": "2019-03-18T21:14:54.246Z",
-    "contributors": [
-      "AlePerez92",
-      "chrisdavidmills",
-      "ccarruitero",
-      "chukito",
-      "Mgjbot",
-      "Nukeador",
-      "Summit677",
-      "Pascalc",
-      "Jorolo",
-      "Marianov",
-      "Takenbot",
-      "Baluart",
-      "Breaking Pitt",
-      "Seres"
-    ]
-  },
-  "Web/Guide/AJAX/Comunidad": {
+  "Web/Guide/AJAX/Community": {
     "modified": "2019-03-23T23:41:30.919Z",
     "contributors": [
       "chrisdavidmills",
@@ -15328,7 +16521,7 @@
       "Jorolo"
     ]
   },
-  "Web/Guide/AJAX/Primeros_Pasos": {
+  "Web/Guide/AJAX/Getting_Started": {
     "modified": "2019-03-23T23:54:11.584Z",
     "contributors": [
       "padrecedano",
@@ -15346,53 +16539,26 @@
       "Seres"
     ]
   },
-  "Web/Guide/API": {
-    "modified": "2019-09-11T09:31:45.916Z",
-    "contributors": [
-      "SphinxKnight",
-      "VictorAbdon",
-      "Sheppy"
-    ]
-  },
-  "Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained/Orientation_and_motion_data_explained": {
+  "Web/Guide/Events/Orientation_and_motion_data_explained": {
     "modified": "2019-03-23T23:27:10.499Z",
     "contributors": [
       "Sheppy",
       "rubencidlara"
     ]
   },
-  "Web/Guide/API/Vibration": {
+  "Web/API/Vibration_API": {
     "modified": "2019-03-23T23:03:32.169Z",
     "contributors": [
       "juancjara"
     ]
   },
-  "Web/Guide/CSS/Block_formatting_context": {
-    "modified": "2019-03-23T22:32:27.340Z",
-    "contributors": [
-      "Enesimus",
-      "javichito"
-    ]
-  },
-  "Web/Guide/CSS/probando_media_queries": {
+  "Web/CSS/Media_Queries/Testing_media_queries": {
     "modified": "2019-03-23T23:07:40.812Z",
     "contributors": [
       "TibicenasDesign"
     ]
   },
-  "Web/Guide/DOM": {
-    "modified": "2019-03-23T23:27:17.444Z",
-    "contributors": [
-      "Sheppy"
-    ]
-  },
-  "Web/Guide/DOM/Events": {
-    "modified": "2019-03-23T23:27:18.635Z",
-    "contributors": [
-      "Sheppy"
-    ]
-  },
-  "Web/Guide/DOM/Events/Creacion_y_Activación_Eventos": {
+  "Web/Guide/Events/Creating_and_triggering_events": {
     "modified": "2019-03-23T22:58:27.867Z",
     "contributors": [
       "gAval997",
@@ -15402,46 +16568,32 @@
       "Soid"
     ]
   },
-  "Web/Guide/DOM/Events/eventos_controlador": {
+  "Web/Guide/Events/Event_handlers": {
     "modified": "2020-08-01T23:47:25.815Z",
     "contributors": [
       "Enesimus",
       "alesalva"
     ]
   },
-  "Web/Guide/Graphics": {
-    "modified": "2020-05-19T14:31:25.384Z",
-    "contributors": [
-      ".bkjop0",
-      "lassergraf",
-      "CarlosEduardoEncinas",
-      "pescadito.2007",
-      "rogeliomtx",
-      "CarlosQuijano",
-      "lalo2013"
-    ]
-  },
-  "Web/Guide/HTML/Canvas_tutorial": {
-    "modified": "2019-03-23T23:18:23.090Z",
+  "Web/Guide/Events": {
+    "modified": "2019-03-23T23:27:18.635Z",
     "contributors": [
-      "fniwes",
-      "DeiberChacon",
-      "jeancgarciaq"
+      "Sheppy"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Advanced_animations": {
+  "Web/API/Canvas_API/Tutorial/Advanced_animations": {
     "modified": "2019-03-23T22:11:01.831Z",
     "contributors": [
       "elagat"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors": {
+  "Web/API/Canvas_API/Tutorial/Applying_styles_and_colors": {
     "modified": "2020-05-15T18:35:37.655Z",
     "contributors": [
       "dimaio77"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Basic_animations": {
+  "Web/API/Canvas_API/Tutorial/Basic_animations": {
     "modified": "2019-10-10T16:52:52.102Z",
     "contributors": [
       "Sergio_Gonzalez_Collado",
@@ -15449,7 +16601,7 @@
       "Huarseral"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Basic_usage": {
+  "Web/API/Canvas_API/Tutorial/Basic_usage": {
     "modified": "2020-04-24T15:40:04.067Z",
     "contributors": [
       "Davidaz",
@@ -15460,7 +16612,7 @@
       "mamigove"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Dibujando_formas": {
+  "Web/API/Canvas_API/Tutorial/Drawing_shapes": {
     "modified": "2019-03-23T23:15:03.361Z",
     "contributors": [
       "cepeami01",
@@ -15475,19 +16627,27 @@
       "Marezelej"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Hit_regions_and_accessibility": {
+  "Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility": {
     "modified": "2019-03-18T21:31:01.983Z",
     "contributors": [
       "cepeami01"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas": {
+  "Web/API/Canvas_API/Tutorial": {
+    "modified": "2019-03-23T23:18:23.090Z",
+    "contributors": [
+      "fniwes",
+      "DeiberChacon",
+      "jeancgarciaq"
+    ]
+  },
+  "Web/API/Canvas_API/Tutorial/Optimizing_canvas": {
     "modified": "2019-03-23T23:18:04.030Z",
     "contributors": [
       "Cax"
     ]
   },
-  "Web/Guide/HTML/Canvas_tutorial/Pixel_manipulation_with_canvas": {
+  "Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas": {
     "modified": "2019-03-18T21:42:58.094Z",
     "contributors": [
       "Luis_Gentil",
@@ -15495,22 +16655,7 @@
       "anfuca"
     ]
   },
-  "Web/Guide/HTML/Editable_content": {
-    "modified": "2019-03-23T22:09:49.599Z",
-    "contributors": [
-      "vinyetcg",
-      "JoaquinGiordano",
-      "V.Morantes"
-    ]
-  },
-  "Web/Guide/HTML/Introduction_alhtml_clone": {
-    "modified": "2019-03-23T23:11:36.473Z",
-    "contributors": [
-      "emanuelvega",
-      "Cristhoper"
-    ]
-  },
-  "Web/Guide/HTML/categorias_de_contenido": {
+  "Web/Guide/HTML/Content_categories": {
     "modified": "2020-09-06T09:32:45.431Z",
     "contributors": [
       "Nachec",
@@ -15520,26 +16665,20 @@
       "eliasrodeloso"
     ]
   },
-  "Web/Guide/Movil": {
-    "modified": "2019-03-23T22:48:50.706Z",
-    "contributors": [
-      "miguelsp"
-    ]
-  },
-  "Web/Guide/Parsing_and_serializing_XML": {
-    "modified": "2019-03-23T22:10:22.365Z",
+  "orphaned/Web/Guide/HTML/Introduction_alhtml_clone": {
+    "modified": "2019-03-23T23:11:36.473Z",
     "contributors": [
-      "FenixAlive"
+      "emanuelvega",
+      "Cristhoper"
     ]
   },
-  "Web/Guide/Performance": {
-    "modified": "2019-03-23T23:21:17.984Z",
+  "Web/Guide/Mobile": {
+    "modified": "2019-03-23T22:48:50.706Z",
     "contributors": [
-      "DeiberChacon",
-      "Sheppy"
+      "miguelsp"
     ]
   },
-  "Web/Guide/Performance/Usando_web_workers": {
+  "Web/API/Web_Workers_API/Using_web_workers": {
     "modified": "2020-09-27T14:14:17.948Z",
     "contributors": [
       "hendaniel",
@@ -15554,116 +16693,28 @@
       "mvargasmoran"
     ]
   },
-  "Web/Guide/Usando_Objetos_FormData": {
-    "modified": "2019-03-23T23:19:26.530Z",
-    "contributors": [
-      "ramingar",
-      "Siro_Diaz",
-      "wilo"
-    ]
-  },
-  "Web/HTML": {
-    "modified": "2020-12-10T12:38:08.697Z",
-    "contributors": [
-      "ojgarciab",
-      "SphinxKnight",
-      "cesarmerino.ec71",
-      "barriosines07",
-      "Nachec",
-      "Enesimus",
-      "Neto503",
-      "hackertj",
-      "chrisdavidmills",
-      "blanchart",
-      "roocce",
-      "titox",
-      "donpaginasweboficial",
-      "Kenikser",
-      "RayPL",
-      "YeseniaMariela",
-      "gabriel-ar",
-      "PabloLajarin",
-      "JoseBarakat",
-      "raecillacastellana",
-      "israel-munoz",
-      "jsx",
-      "Hteemo",
-      "eduMXM",
-      "enesimo",
-      "MARVINFLORENTINO",
-      "pekechis",
-      "monserratcallejaalmazan",
-      "thzunder",
-      "roheru",
-      "vltamara",
-      "ArcangelZith",
-      "ronyworld",
-      "LeoHirsch",
-      "CarlosQuijano",
-      "AngelFQC"
-    ]
-  },
-  "Web/HTML/Atributos": {
-    "modified": "2019-03-23T23:21:50.772Z",
-    "contributors": [
-      "raecillacastellana",
-      "Cdam",
-      "vltamara",
-      "Shinigami-sama",
-      "welm",
-      "noografo",
-      "Benito",
-      "LeoHirsch",
-      "sha"
-    ]
-  },
-  "Web/HTML/Atributos/accept": {
-    "modified": "2020-10-15T22:34:00.656Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/HTML/Atributos/autocomplete": {
-    "modified": "2019-04-06T00:39:59.162Z",
-    "contributors": [
-      "qmarquez",
-      "Raulpascual2"
-    ]
-  },
-  "Web/HTML/Atributos/min": {
-    "modified": "2020-10-15T22:33:58.169Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/HTML/Atributos/minlength": {
-    "modified": "2020-10-15T22:33:56.870Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/HTML/Atributos/multiple": {
-    "modified": "2020-09-08T01:48:55.405Z",
+  "Web/API/Canvas_API/Manipulating_video_using_canvas": {
+    "modified": "2019-03-24T00:07:00.528Z",
     "contributors": [
-      "Nachec"
+      "teoli",
+      "inma_610"
     ]
   },
-  "Web/HTML/Atributos_Globales": {
-    "modified": "2020-10-15T21:39:25.776Z",
+  "Web/HTML/Attributes/crossorigin": {
+    "modified": "2019-03-23T22:46:11.986Z",
     "contributors": [
-      "Nachec",
-      "PacoVela",
-      "imangas",
+      "eporta88",
+      "virlliNia",
       "vltamara"
     ]
   },
-  "Web/HTML/Atributos_Globales/accesskey": {
+  "Web/HTML/Global_attributes/accesskey": {
     "modified": "2019-03-23T22:41:37.238Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/autocapitalize": {
+  "Web/HTML/Global_attributes/autocapitalize": {
     "modified": "2020-10-15T22:12:15.178Z",
     "contributors": [
       "Nachec",
@@ -15672,60 +16723,60 @@
       "Raulpascual2"
     ]
   },
-  "Web/HTML/Atributos_Globales/class": {
+  "Web/HTML/Global_attributes/class": {
     "modified": "2019-03-23T22:41:38.505Z",
     "contributors": [
       "imangas",
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/contenteditable": {
+  "Web/HTML/Global_attributes/contenteditable": {
     "modified": "2019-03-23T22:41:31.507Z",
     "contributors": [
       "ManuAlvarado22",
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/contextmenu": {
+  "Web/HTML/Global_attributes/contextmenu": {
     "modified": "2019-03-23T22:41:33.594Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/data-*": {
+  "Web/HTML/Global_attributes/data-*": {
     "modified": "2019-06-27T12:32:36.980Z",
     "contributors": [
       "deyvirosado",
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/dir": {
+  "Web/HTML/Global_attributes/dir": {
     "modified": "2019-03-23T22:41:19.442Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/draggable": {
+  "Web/HTML/Global_attributes/draggable": {
     "modified": "2019-03-23T22:41:17.791Z",
     "contributors": [
       "JuanSerrano02",
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/dropzone": {
+  "orphaned/Web/HTML/Global_attributes/dropzone": {
     "modified": "2019-03-23T22:41:19.266Z",
     "contributors": [
       "JuanSerrano02",
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/hidden": {
+  "Web/HTML/Global_attributes/hidden": {
     "modified": "2019-03-23T22:41:18.690Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/id": {
+  "Web/HTML/Global_attributes/id": {
     "modified": "2019-03-23T22:45:39.709Z",
     "contributors": [
       "vanesa",
@@ -15733,32 +16784,41 @@
       "eoasakura"
     ]
   },
-  "Web/HTML/Atributos_Globales/is": {
+  "Web/HTML/Global_attributes": {
+    "modified": "2020-10-15T21:39:25.776Z",
+    "contributors": [
+      "Nachec",
+      "PacoVela",
+      "imangas",
+      "vltamara"
+    ]
+  },
+  "Web/HTML/Global_attributes/is": {
     "modified": "2020-10-15T22:04:27.264Z",
     "contributors": [
       "daniel.duarte"
     ]
   },
-  "Web/HTML/Atributos_Globales/itemid": {
+  "Web/HTML/Global_attributes/itemid": {
     "modified": "2019-03-23T22:37:36.858Z",
     "contributors": [
       "pekechis"
     ]
   },
-  "Web/HTML/Atributos_Globales/itemprop": {
+  "Web/HTML/Global_attributes/itemprop": {
     "modified": "2019-03-23T22:41:15.543Z",
     "contributors": [
       "rhssr",
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/itemref": {
+  "Web/HTML/Global_attributes/itemref": {
     "modified": "2019-03-23T22:36:41.055Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/itemscope": {
+  "Web/HTML/Global_attributes/itemscope": {
     "modified": "2020-10-15T21:41:28.202Z",
     "contributors": [
       "JuanSerrano02",
@@ -15766,32 +16826,32 @@
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/lang": {
+  "Web/HTML/Global_attributes/lang": {
     "modified": "2019-03-23T22:41:11.276Z",
     "contributors": [
       "agonzalezml",
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/slot": {
+  "Web/HTML/Global_attributes/slot": {
     "modified": "2020-10-15T22:04:16.315Z",
     "contributors": [
       "daniel.duarte"
     ]
   },
-  "Web/HTML/Atributos_Globales/spellcheck": {
+  "Web/HTML/Global_attributes/spellcheck": {
     "modified": "2019-03-23T22:41:06.455Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/style": {
+  "Web/HTML/Global_attributes/style": {
     "modified": "2019-03-23T22:41:09.210Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/tabindex": {
+  "Web/HTML/Global_attributes/tabindex": {
     "modified": "2019-07-12T03:22:15.997Z",
     "contributors": [
       "ChrisMHM",
@@ -15801,46 +16861,79 @@
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/title": {
+  "Web/HTML/Global_attributes/title": {
     "modified": "2019-03-23T22:40:44.282Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/translate": {
+  "Web/HTML/Global_attributes/translate": {
     "modified": "2019-03-23T22:40:27.406Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Atributos_Globales/x-ms-acceleratorkey": {
+  "Web/HTML/Global_attributes/x-ms-acceleratorkey": {
     "modified": "2019-03-18T21:20:44.665Z",
     "contributors": [
       "WriestTavo"
     ]
   },
-  "Web/HTML/Atributos_de_configuracion_CORS": {
-    "modified": "2019-03-23T22:46:11.986Z",
+  "Web/HTML/Attributes/accept": {
+    "modified": "2020-10-15T22:34:00.656Z",
     "contributors": [
-      "eporta88",
-      "virlliNia",
-      "vltamara"
+      "Nachec"
     ]
   },
-  "Web/HTML/Block-level_elements": {
-    "modified": "2019-03-18T20:44:10.775Z",
+  "Web/HTML/Attributes/autocomplete": {
+    "modified": "2019-04-06T00:39:59.162Z",
+    "contributors": [
+      "qmarquez",
+      "Raulpascual2"
+    ]
+  },
+  "Web/HTML/Attributes": {
+    "modified": "2019-03-23T23:21:50.772Z",
     "contributors": [
-      "ManuelPalominochirote",
       "raecillacastellana",
-      "dinael",
-      "pekechis",
-      "erdavo",
+      "Cdam",
       "vltamara",
-      "teoli",
-      "MILTON.AGUILAR"
+      "Shinigami-sama",
+      "welm",
+      "noografo",
+      "Benito",
+      "LeoHirsch",
+      "sha"
+    ]
+  },
+  "Web/HTML/Attributes/min": {
+    "modified": "2020-10-15T22:33:58.169Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/HTML/Attributes/minlength": {
+    "modified": "2020-10-15T22:33:56.870Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/HTML/Attributes/multiple": {
+    "modified": "2020-09-08T01:48:55.405Z",
+    "contributors": [
+      "Nachec"
     ]
   },
-  "Web/HTML/Canvas": {
+  "Web/API/Canvas_API/A_basic_ray-caster": {
+    "modified": "2019-03-19T08:57:21.057Z",
+    "contributors": [
+      "AzazelN28",
+      "Fandres91",
+      "dkocho4",
+      "preteric"
+    ]
+  },
+  "Web/API/Canvas_API": {
     "modified": "2019-10-10T16:45:32.554Z",
     "contributors": [
       "lajaso",
@@ -15858,23 +16951,7 @@
       "Mgjbot"
     ]
   },
-  "Web/HTML/Canvas/A_basic_ray-caster": {
-    "modified": "2019-03-19T08:57:21.057Z",
-    "contributors": [
-      "AzazelN28",
-      "Fandres91",
-      "dkocho4",
-      "preteric"
-    ]
-  },
-  "Web/HTML/Canvas/Drawing_graphics_with_canvas": {
-    "modified": "2019-03-23T23:19:53.719Z",
-    "contributors": [
-      "teoli",
-      "rubencidlara"
-    ]
-  },
-  "Web/HTML/Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida": {
+  "Learn/HTML/Howto/Author_fast-loading_HTML_pages": {
     "modified": "2020-07-16T22:22:32.156Z",
     "contributors": [
       "ZKoaLa",
@@ -15882,63 +16959,7 @@
       "JuanC_01"
     ]
   },
-  "Web/HTML/Elemento": {
-    "modified": "2020-07-13T03:12:39.708Z",
-    "contributors": [
-      "Enesimus",
-      "IsraelFloresDGA",
-      "ivanhelo",
-      "gabriel-ar",
-      "raecillacastellana",
-      "imangas",
-      "jccancelo",
-      "vltamara",
-      "teoli",
-      "LinoJaime",
-      "Rkovac",
-      "betoscopio",
-      "semptrion",
-      "StripTM",
-      "deimidis",
-      "Mgjbot",
-      "Klosma",
-      "Jorolo"
-    ]
-  },
-  "Web/HTML/Elemento/Elementos_títulos": {
-    "modified": "2019-03-23T23:41:24.635Z",
-    "contributors": [
-      "evaferreira",
-      "chrisdavidmills",
-      "israel-munoz",
-      "teoli",
-      "Jorolo"
-    ]
-  },
-  "Web/HTML/Elemento/Etiqueta_Personalizada_HTML5": {
-    "modified": "2019-03-23T22:40:57.260Z",
-    "contributors": [
-      "Lazaro"
-    ]
-  },
-  "Web/HTML/Elemento/Shadow": {
-    "modified": "2019-03-23T22:06:38.273Z",
-    "contributors": [
-      "H4isan"
-    ]
-  },
-  "Web/HTML/Elemento/Tipos_de_elementos": {
-    "modified": "2019-03-23T23:46:22.404Z",
-    "contributors": [
-      "Sebastianz",
-      "jigs12",
-      "teoli",
-      "ethertank",
-      "Klosma",
-      "Jorolo"
-    ]
-  },
-  "Web/HTML/Elemento/a": {
+  "Web/HTML/Element/a": {
     "modified": "2020-12-02T02:55:47.706Z",
     "contributors": [
       "SphinxKnight",
@@ -15955,7 +16976,7 @@
       "Mgjbot"
     ]
   },
-  "Web/HTML/Elemento/abbr": {
+  "Web/HTML/Element/abbr": {
     "modified": "2019-03-23T23:41:48.686Z",
     "contributors": [
       "vanesa",
@@ -15966,7 +16987,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/acronym": {
+  "Web/HTML/Element/acronym": {
     "modified": "2019-03-23T23:41:54.391Z",
     "contributors": [
       "Sebastianz",
@@ -15975,7 +16996,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/address": {
+  "Web/HTML/Element/address": {
     "modified": "2019-03-23T23:41:48.972Z",
     "contributors": [
       "abaracedo",
@@ -15984,7 +17005,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/applet": {
+  "Web/HTML/Element/applet": {
     "modified": "2019-03-23T23:42:26.076Z",
     "contributors": [
       "Sebastianz",
@@ -15992,7 +17013,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/area": {
+  "Web/HTML/Element/area": {
     "modified": "2019-03-23T23:41:50.345Z",
     "contributors": [
       "Sebastianz",
@@ -16001,7 +17022,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/article": {
+  "Web/HTML/Element/article": {
     "modified": "2020-04-14T03:59:04.779Z",
     "contributors": [
       "Jx1ls",
@@ -16010,7 +17031,7 @@
       "deimidis"
     ]
   },
-  "Web/HTML/Elemento/aside": {
+  "Web/HTML/Element/aside": {
     "modified": "2019-05-13T08:38:38.128Z",
     "contributors": [
       "blanchart",
@@ -16021,7 +17042,7 @@
       "inma_610"
     ]
   },
-  "Web/HTML/Elemento/audio": {
+  "Web/HTML/Element/audio": {
     "modified": "2019-03-24T00:17:32.335Z",
     "contributors": [
       "wbamberg",
@@ -16031,7 +17052,7 @@
       "inma_610"
     ]
   },
-  "Web/HTML/Elemento/b": {
+  "Web/HTML/Element/b": {
     "modified": "2019-03-23T23:41:59.385Z",
     "contributors": [
       "gabrielvol",
@@ -16041,7 +17062,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/base": {
+  "Web/HTML/Element/base": {
     "modified": "2019-03-23T23:41:55.648Z",
     "contributors": [
       "raecillacastellana",
@@ -16051,7 +17072,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/basefont": {
+  "Web/HTML/Element/basefont": {
     "modified": "2019-03-23T23:42:33.059Z",
     "contributors": [
       "Sebastianz",
@@ -16060,14 +17081,14 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/bdi": {
+  "Web/HTML/Element/bdi": {
     "modified": "2019-03-23T22:37:44.087Z",
     "contributors": [
       "pekechis",
       "teoli"
     ]
   },
-  "Web/HTML/Elemento/bdo": {
+  "Web/HTML/Element/bdo": {
     "modified": "2019-03-23T23:41:59.174Z",
     "contributors": [
       "Sebastianz",
@@ -16076,13 +17097,13 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/bgsound": {
+  "Web/HTML/Element/bgsound": {
     "modified": "2019-10-10T16:35:21.119Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/big": {
+  "Web/HTML/Element/big": {
     "modified": "2019-03-23T23:42:00.157Z",
     "contributors": [
       "Sebastianz",
@@ -16092,14 +17113,14 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/blink": {
+  "Web/HTML/Element/blink": {
     "modified": "2019-10-10T16:37:40.291Z",
     "contributors": [
       "teoli",
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/blockquote": {
+  "Web/HTML/Element/blockquote": {
     "modified": "2019-03-23T23:42:29.095Z",
     "contributors": [
       "Sebastianz",
@@ -16108,13 +17129,13 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/body": {
+  "Web/HTML/Element/body": {
     "modified": "2020-10-15T22:34:39.725Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/HTML/Elemento/br": {
+  "Web/HTML/Element/br": {
     "modified": "2019-03-23T23:42:25.427Z",
     "contributors": [
       "vanesa",
@@ -16124,7 +17145,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/button": {
+  "Web/HTML/Element/button": {
     "modified": "2020-10-15T21:13:54.408Z",
     "contributors": [
       "MarielaBR",
@@ -16137,7 +17158,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/canvas": {
+  "Web/HTML/Element/canvas": {
     "modified": "2019-03-24T00:07:43.236Z",
     "contributors": [
       "wbamberg",
@@ -16147,7 +17168,7 @@
       "xaky"
     ]
   },
-  "Web/HTML/Elemento/caption": {
+  "Web/HTML/Element/caption": {
     "modified": "2019-03-23T23:42:13.711Z",
     "contributors": [
       "camilai",
@@ -16157,7 +17178,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/center": {
+  "Web/HTML/Element/center": {
     "modified": "2020-04-23T17:50:49.499Z",
     "contributors": [
       "JAMC",
@@ -16167,7 +17188,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/cite": {
+  "Web/HTML/Element/cite": {
     "modified": "2019-03-23T23:42:34.535Z",
     "contributors": [
       "Sebastianz",
@@ -16176,7 +17197,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/code": {
+  "Web/HTML/Element/code": {
     "modified": "2019-03-23T23:41:28.451Z",
     "contributors": [
       "BubuAnabelas",
@@ -16184,7 +17205,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/col": {
+  "Web/HTML/Element/col": {
     "modified": "2019-03-23T23:42:14.518Z",
     "contributors": [
       "Sebastianz",
@@ -16193,7 +17214,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/colgroup": {
+  "Web/HTML/Element/colgroup": {
     "modified": "2019-03-23T23:42:18.079Z",
     "contributors": [
       "Sebastianz",
@@ -16202,20 +17223,20 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/command": {
+  "orphaned/Web/HTML/Element/command": {
     "modified": "2019-10-05T04:48:52.506Z",
     "contributors": [
       "titox",
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/content": {
+  "Web/HTML/Element/content": {
     "modified": "2019-03-23T22:36:12.624Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/data": {
+  "Web/HTML/Element/data": {
     "modified": "2019-07-24T08:09:10.849Z",
     "contributors": [
       "SphinxKnight",
@@ -16223,7 +17244,7 @@
       "raecillacastellana"
     ]
   },
-  "Web/HTML/Elemento/datalist": {
+  "Web/HTML/Element/datalist": {
     "modified": "2020-10-15T21:13:43.994Z",
     "contributors": [
       "mfranzke",
@@ -16236,7 +17257,7 @@
       "Izel"
     ]
   },
-  "Web/HTML/Elemento/dd": {
+  "Web/HTML/Element/dd": {
     "modified": "2020-10-15T21:18:43.107Z",
     "contributors": [
       "IsraelFloresDGA",
@@ -16246,7 +17267,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/del": {
+  "Web/HTML/Element/del": {
     "modified": "2019-03-18T21:11:06.542Z",
     "contributors": [
       "duduindo",
@@ -16255,14 +17276,14 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/details": {
+  "Web/HTML/Element/details": {
     "modified": "2019-07-23T13:52:13.415Z",
     "contributors": [
       "Krnan",
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/dfn": {
+  "Web/HTML/Element/dfn": {
     "modified": "2019-03-18T21:11:06.323Z",
     "contributors": [
       "duduindo",
@@ -16270,14 +17291,14 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/dialog": {
+  "Web/HTML/Element/dialog": {
     "modified": "2020-10-15T21:43:09.315Z",
     "contributors": [
       "danielblazquez",
       "abaracedo"
     ]
   },
-  "Web/HTML/Elemento/dir": {
+  "Web/HTML/Element/dir": {
     "modified": "2019-03-18T21:11:06.122Z",
     "contributors": [
       "duduindo",
@@ -16285,7 +17306,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/div": {
+  "Web/HTML/Element/div": {
     "modified": "2019-03-23T23:42:24.990Z",
     "contributors": [
       "Neto2412",
@@ -16295,7 +17316,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/dl": {
+  "Web/HTML/Element/dl": {
     "modified": "2020-10-15T21:18:47.033Z",
     "contributors": [
       "iign",
@@ -16306,7 +17327,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/dt": {
+  "Web/HTML/Element/dt": {
     "modified": "2020-10-15T21:18:46.570Z",
     "contributors": [
       "IsraelFloresDGA",
@@ -16316,14 +17337,24 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/element": {
+  "orphaned/Web/HTML/Element/element": {
     "modified": "2019-03-23T22:38:36.820Z",
     "contributors": [
       "raecillacastellana",
       "kramery"
     ]
   },
-  "Web/HTML/Elemento/em": {
+  "Web/HTML/Element/Heading_Elements": {
+    "modified": "2019-03-23T23:41:24.635Z",
+    "contributors": [
+      "evaferreira",
+      "chrisdavidmills",
+      "israel-munoz",
+      "teoli",
+      "Jorolo"
+    ]
+  },
+  "Web/HTML/Element/em": {
     "modified": "2019-03-23T23:41:24.943Z",
     "contributors": [
       "BubuAnabelas",
@@ -16331,7 +17362,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/embed": {
+  "Web/HTML/Element/embed": {
     "modified": "2019-03-24T00:07:02.501Z",
     "contributors": [
       "wbamberg",
@@ -16339,7 +17370,13 @@
       "inma_610"
     ]
   },
-  "Web/HTML/Elemento/fieldset": {
+  "orphaned/Web/HTML/Elemento/Etiqueta_Personalizada_HTML5": {
+    "modified": "2019-03-23T22:40:57.260Z",
+    "contributors": [
+      "Lazaro"
+    ]
+  },
+  "Web/HTML/Element/fieldset": {
     "modified": "2019-03-24T00:04:28.839Z",
     "contributors": [
       "dmarchena",
@@ -16351,7 +17388,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/figcaption": {
+  "Web/HTML/Element/figcaption": {
     "modified": "2020-10-15T21:43:37.764Z",
     "contributors": [
       "danieltacho",
@@ -16360,7 +17397,7 @@
       "pekechis"
     ]
   },
-  "Web/HTML/Elemento/figure": {
+  "Web/HTML/Element/figure": {
     "modified": "2019-03-24T00:07:44.105Z",
     "contributors": [
       "wbamberg",
@@ -16369,7 +17406,7 @@
       "translatoon"
     ]
   },
-  "Web/HTML/Elemento/font": {
+  "Web/HTML/Element/font": {
     "modified": "2019-03-23T23:42:25.753Z",
     "contributors": [
       "Sebastianz",
@@ -16378,14 +17415,14 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/footer": {
+  "Web/HTML/Element/footer": {
     "modified": "2019-03-24T00:06:10.667Z",
     "contributors": [
       "teoli",
       "translatoon"
     ]
   },
-  "Web/HTML/Elemento/form": {
+  "Web/HTML/Element/form": {
     "modified": "2019-03-23T23:38:31.636Z",
     "contributors": [
       "teoli",
@@ -16393,7 +17430,7 @@
       "jsalinas"
     ]
   },
-  "Web/HTML/Elemento/frame": {
+  "Web/HTML/Element/frame": {
     "modified": "2019-03-23T23:42:33.478Z",
     "contributors": [
       "Sebastianz",
@@ -16402,7 +17439,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/frameset": {
+  "Web/HTML/Element/frameset": {
     "modified": "2019-03-23T23:42:33.678Z",
     "contributors": [
       "Sebastianz",
@@ -16411,7 +17448,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/head": {
+  "Web/HTML/Element/head": {
     "modified": "2019-03-23T23:41:19.487Z",
     "contributors": [
       "israel-munoz",
@@ -16419,7 +17456,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/header": {
+  "Web/HTML/Element/header": {
     "modified": "2019-09-22T13:38:40.530Z",
     "contributors": [
       "duduindo",
@@ -16431,7 +17468,7 @@
       "translatoon"
     ]
   },
-  "Web/HTML/Elemento/hgroup": {
+  "Web/HTML/Element/hgroup": {
     "modified": "2020-04-16T18:54:49.840Z",
     "contributors": [
       "camsa",
@@ -16443,7 +17480,7 @@
       "percy@mozilla.pe"
     ]
   },
-  "Web/HTML/Elemento/hr": {
+  "Web/HTML/Element/hr": {
     "modified": "2019-03-23T23:41:46.133Z",
     "contributors": [
       "wissol",
@@ -16454,7 +17491,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/html": {
+  "Web/HTML/Element/html": {
     "modified": "2019-03-23T23:41:20.478Z",
     "contributors": [
       "raecillacastellana",
@@ -16463,7 +17500,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/i": {
+  "Web/HTML/Element/i": {
     "modified": "2019-03-18T21:11:05.917Z",
     "contributors": [
       "duduindo",
@@ -16471,7 +17508,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/iframe": {
+  "Web/HTML/Element/iframe": {
     "modified": "2020-10-15T21:20:22.917Z",
     "contributors": [
       "mirinnes",
@@ -16485,13 +17522,13 @@
       "aguztinrs"
     ]
   },
-  "Web/HTML/Elemento/image": {
+  "Web/HTML/Element/image": {
     "modified": "2019-03-23T22:38:59.070Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/img": {
+  "Web/HTML/Element/img": {
     "modified": "2020-07-12T20:16:35.983Z",
     "contributors": [
       "maodecolombia",
@@ -16500,27 +17537,30 @@
       "makoescalzo"
     ]
   },
-  "Web/HTML/Elemento/input": {
-    "modified": "2020-07-14T01:15:57.719Z",
+  "Web/HTML/Element": {
+    "modified": "2020-07-13T03:12:39.708Z",
     "contributors": [
-      "maodecolombia",
-      "KacosPro",
-      "moisesalmonte",
-      "israel-munoz",
-      "Alejandra.B",
-      "garciaFullana",
-      "j-light",
-      "chech",
-      "dennistobar",
-      "welm",
-      "Johsua",
-      "byverdu",
-      "chipsweb",
+      "Enesimus",
+      "IsraelFloresDGA",
+      "ivanhelo",
+      "gabriel-ar",
+      "raecillacastellana",
+      "imangas",
+      "jccancelo",
+      "vltamara",
       "teoli",
-      "ovnicraft"
+      "LinoJaime",
+      "Rkovac",
+      "betoscopio",
+      "semptrion",
+      "StripTM",
+      "deimidis",
+      "Mgjbot",
+      "Klosma",
+      "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/input/Botón": {
+  "Web/HTML/Element/input/button": {
     "modified": "2019-04-18T16:11:40.984Z",
     "contributors": [
       "IsaacAaron",
@@ -16528,7 +17568,7 @@
       "LexAenima"
     ]
   },
-  "Web/HTML/Elemento/input/checkbox": {
+  "Web/HTML/Element/input/checkbox": {
     "modified": "2019-05-13T05:40:59.628Z",
     "contributors": [
       "AlePerez92",
@@ -16538,28 +17578,28 @@
       "JoseEnrique"
     ]
   },
-  "Web/HTML/Elemento/input/color": {
+  "Web/HTML/Element/input/color": {
     "modified": "2019-03-23T22:37:43.300Z",
     "contributors": [
       "fitojb",
       "Alesan7"
     ]
   },
-  "Web/HTML/Elemento/input/date": {
+  "Web/HTML/Element/input/date": {
     "modified": "2019-10-10T16:45:44.142Z",
     "contributors": [
       "ANAIDJM1",
       "fitojb"
     ]
   },
-  "Web/HTML/Elemento/input/datetime": {
+  "Web/HTML/Element/input/datetime": {
     "modified": "2019-03-23T22:36:20.508Z",
     "contributors": [
       "AngelMunoz",
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/input/email": {
+  "Web/HTML/Element/input/email": {
     "modified": "2020-10-15T22:11:48.198Z",
     "contributors": [
       "Nachec",
@@ -16567,19 +17607,39 @@
       "MarielaBR"
     ]
   },
-  "Web/HTML/Elemento/input/hidden": {
+  "Web/HTML/Element/input/hidden": {
     "modified": "2020-10-15T22:10:33.714Z",
     "contributors": [
       "IsraelFloresDGA"
     ]
   },
-  "Web/HTML/Elemento/input/number": {
+  "Web/HTML/Element/input": {
+    "modified": "2020-07-14T01:15:57.719Z",
+    "contributors": [
+      "maodecolombia",
+      "KacosPro",
+      "moisesalmonte",
+      "israel-munoz",
+      "Alejandra.B",
+      "garciaFullana",
+      "j-light",
+      "chech",
+      "dennistobar",
+      "welm",
+      "Johsua",
+      "byverdu",
+      "chipsweb",
+      "teoli",
+      "ovnicraft"
+    ]
+  },
+  "Web/HTML/Element/input/number": {
     "modified": "2020-10-15T22:26:16.273Z",
     "contributors": [
       "roocce"
     ]
   },
-  "Web/HTML/Elemento/input/password": {
+  "Web/HTML/Element/input/password": {
     "modified": "2019-03-23T22:38:38.107Z",
     "contributors": [
       "MarielaBR",
@@ -16587,7 +17647,7 @@
       "AlvaroNieto"
     ]
   },
-  "Web/HTML/Elemento/input/range": {
+  "Web/HTML/Element/input/range": {
     "modified": "2019-03-18T20:57:13.760Z",
     "contributors": [
       "SphinxKnight",
@@ -16595,13 +17655,13 @@
       "Luis_Calvo"
     ]
   },
-  "Web/HTML/Elemento/input/text": {
+  "Web/HTML/Element/input/text": {
     "modified": "2020-10-15T22:34:26.828Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/HTML/Elemento/ins": {
+  "Web/HTML/Element/ins": {
     "modified": "2019-07-06T05:38:19.222Z",
     "contributors": [
       "baumannzone",
@@ -16612,13 +17672,13 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/isindex": {
+  "Web/HTML/Element/isindex": {
     "modified": "2019-03-23T22:36:13.994Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/kbd": {
+  "Web/HTML/Element/kbd": {
     "modified": "2019-03-18T21:11:05.093Z",
     "contributors": [
       "duduindo",
@@ -16627,7 +17687,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/keygen": {
+  "Web/HTML/Element/keygen": {
     "modified": "2019-03-24T00:06:20.618Z",
     "contributors": [
       "wbamberg",
@@ -16635,7 +17695,7 @@
       "deimidis"
     ]
   },
-  "Web/HTML/Elemento/label": {
+  "Web/HTML/Element/label": {
     "modified": "2019-03-23T23:22:26.460Z",
     "contributors": [
       "ardillan",
@@ -16644,7 +17704,7 @@
       "WillyMaikowski"
     ]
   },
-  "Web/HTML/Elemento/legend": {
+  "Web/HTML/Element/legend": {
     "modified": "2019-06-05T17:18:09.680Z",
     "contributors": [
       "Ivnosing",
@@ -16655,7 +17715,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/li": {
+  "Web/HTML/Element/li": {
     "modified": "2019-03-18T21:11:04.870Z",
     "contributors": [
       "duduindo",
@@ -16664,7 +17724,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/link": {
+  "Web/HTML/Element/link": {
     "modified": "2019-03-23T23:41:37.686Z",
     "contributors": [
       "pawer13",
@@ -16675,7 +17735,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/main": {
+  "Web/HTML/Element/main": {
     "modified": "2019-03-23T23:25:22.761Z",
     "contributors": [
       "evaferreira",
@@ -16684,7 +17744,7 @@
       "jsalinas"
     ]
   },
-  "Web/HTML/Elemento/map": {
+  "Web/HTML/Element/map": {
     "modified": "2019-03-23T23:41:43.985Z",
     "contributors": [
       "Sebastianz",
@@ -16693,7 +17753,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/mark": {
+  "Web/HTML/Element/mark": {
     "modified": "2020-10-15T21:04:57.447Z",
     "contributors": [
       "danielblazquez",
@@ -16706,7 +17766,7 @@
       "translatoon"
     ]
   },
-  "Web/HTML/Elemento/marquee": {
+  "Web/HTML/Element/marquee": {
     "modified": "2019-03-18T20:57:46.110Z",
     "contributors": [
       "gabriell24",
@@ -16714,7 +17774,7 @@
       "alexander171294"
     ]
   },
-  "Web/HTML/Elemento/menu": {
+  "Web/HTML/Element/menu": {
     "modified": "2019-03-18T21:11:04.661Z",
     "contributors": [
       "duduindo",
@@ -16722,7 +17782,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/meta": {
+  "Web/HTML/Element/meta": {
     "modified": "2019-03-23T23:42:35.250Z",
     "contributors": [
       "Sebastianz",
@@ -16732,13 +17792,13 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/multicol": {
+  "Web/HTML/Element/multicol": {
     "modified": "2019-03-23T22:36:14.458Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/nav": {
+  "Web/HTML/Element/nav": {
     "modified": "2020-12-08T21:27:47.077Z",
     "contributors": [
       "benito-san",
@@ -16749,14 +17809,14 @@
       "makoescalzo"
     ]
   },
-  "Web/HTML/Elemento/nobr": {
+  "Web/HTML/Element/nobr": {
     "modified": "2019-03-18T21:35:49.711Z",
     "contributors": [
       "rhssr",
       "Mexicotec"
     ]
   },
-  "Web/HTML/Elemento/noframes": {
+  "Web/HTML/Element/noframes": {
     "modified": "2019-03-23T23:42:28.640Z",
     "contributors": [
       "Sebastianz",
@@ -16765,7 +17825,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/noscript": {
+  "Web/HTML/Element/noscript": {
     "modified": "2019-03-23T23:42:26.569Z",
     "contributors": [
       "Sebastianz",
@@ -16774,14 +17834,14 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/object": {
+  "Web/HTML/Element/object": {
     "modified": "2020-10-15T22:22:23.263Z",
     "contributors": [
       "siregalado",
       "iarah"
     ]
   },
-  "Web/HTML/Elemento/ol": {
+  "Web/HTML/Element/ol": {
     "modified": "2020-02-03T21:28:29.355Z",
     "contributors": [
       "kevinar53",
@@ -16790,13 +17850,13 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/option": {
+  "Web/HTML/Element/option": {
     "modified": "2019-03-23T22:38:56.017Z",
     "contributors": [
       "pekechis"
     ]
   },
-  "Web/HTML/Elemento/p": {
+  "Web/HTML/Element/p": {
     "modified": "2019-03-23T23:41:31.103Z",
     "contributors": [
       "Sebastianz",
@@ -16805,7 +17865,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/param": {
+  "Web/HTML/Element/param": {
     "modified": "2019-03-23T23:42:31.653Z",
     "contributors": [
       "Sebastianz",
@@ -16814,7 +17874,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/picture": {
+  "Web/HTML/Element/picture": {
     "modified": "2019-07-20T20:15:37.196Z",
     "contributors": [
       "DagoGuevara",
@@ -16825,7 +17885,7 @@
       "diegos2"
     ]
   },
-  "Web/HTML/Elemento/pre": {
+  "Web/HTML/Element/pre": {
     "modified": "2019-03-18T21:11:04.209Z",
     "contributors": [
       "duduindo",
@@ -16833,7 +17893,7 @@
       "_0x"
     ]
   },
-  "Web/HTML/Elemento/progress": {
+  "Web/HTML/Element/progress": {
     "modified": "2020-10-15T21:22:45.390Z",
     "contributors": [
       "SphinxKnight",
@@ -16843,13 +17903,13 @@
       "rubencidlara"
     ]
   },
-  "Web/HTML/Elemento/q": {
+  "Web/HTML/Element/q": {
     "modified": "2020-10-15T22:34:03.995Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/HTML/Elemento/s": {
+  "Web/HTML/Element/s": {
     "modified": "2019-03-18T21:11:03.985Z",
     "contributors": [
       "duduindo",
@@ -16857,7 +17917,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/samp": {
+  "Web/HTML/Element/samp": {
     "modified": "2019-10-11T12:30:51.315Z",
     "contributors": [
       "danielblazquez",
@@ -16867,7 +17927,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/script": {
+  "Web/SVG/Element/script": {
     "modified": "2019-03-23T22:38:36.106Z",
     "contributors": [
       "ignasivs",
@@ -16876,7 +17936,7 @@
       "alexander171294"
     ]
   },
-  "Web/HTML/Elemento/section": {
+  "Web/HTML/Element/section": {
     "modified": "2020-07-15T11:06:51.948Z",
     "contributors": [
       "timetrvlr",
@@ -16888,14 +17948,20 @@
       "artopal"
     ]
   },
-  "Web/HTML/Elemento/select": {
+  "Web/HTML/Element/select": {
     "modified": "2019-03-23T22:38:39.246Z",
     "contributors": [
       "Fx-Enlcxx",
       "AleV"
     ]
   },
-  "Web/HTML/Elemento/slot": {
+  "Web/HTML/Element/shadow": {
+    "modified": "2019-03-23T22:06:38.273Z",
+    "contributors": [
+      "H4isan"
+    ]
+  },
+  "Web/HTML/Element/slot": {
     "modified": "2020-10-15T22:05:53.326Z",
     "contributors": [
       "aguilerajl",
@@ -16903,7 +17969,7 @@
       "rhssr"
     ]
   },
-  "Web/HTML/Elemento/small": {
+  "Web/HTML/Element/small": {
     "modified": "2019-04-04T15:23:46.402Z",
     "contributors": [
       "danieltacho",
@@ -16914,7 +17980,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/source": {
+  "Web/HTML/Element/source": {
     "modified": "2020-10-15T21:13:44.488Z",
     "contributors": [
       "guillermomartinmarco",
@@ -16922,7 +17988,7 @@
       "inma_610"
     ]
   },
-  "Web/HTML/Elemento/span": {
+  "Web/HTML/Element/span": {
     "modified": "2019-03-24T00:17:34.814Z",
     "contributors": [
       "Sebastianz",
@@ -16932,7 +17998,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/strike": {
+  "Web/HTML/Element/strike": {
     "modified": "2019-03-18T21:11:03.623Z",
     "contributors": [
       "duduindo",
@@ -16940,7 +18006,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/strong": {
+  "Web/HTML/Element/strong": {
     "modified": "2019-03-18T21:11:02.931Z",
     "contributors": [
       "duduindo",
@@ -16948,7 +18014,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/style": {
+  "Web/HTML/Element/style": {
     "modified": "2019-03-23T23:42:38.349Z",
     "contributors": [
       "Sebastianz",
@@ -16957,7 +18023,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/sub": {
+  "Web/HTML/Element/sub": {
     "modified": "2020-10-15T21:18:49.449Z",
     "contributors": [
       "IsaacAaron",
@@ -16966,7 +18032,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/sup": {
+  "Web/HTML/Element/sup": {
     "modified": "2020-10-15T21:18:45.044Z",
     "contributors": [
       "IsaacAaron",
@@ -16975,7 +18041,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/table": {
+  "Web/HTML/Element/table": {
     "modified": "2019-09-03T15:32:58.837Z",
     "contributors": [
       "teoli",
@@ -16984,7 +18050,7 @@
       "tany"
     ]
   },
-  "Web/HTML/Elemento/td": {
+  "Web/HTML/Element/td": {
     "modified": "2019-03-23T22:38:37.555Z",
     "contributors": [
       "Kerinoxio",
@@ -16993,7 +18059,7 @@
       "tolano97"
     ]
   },
-  "Web/HTML/Elemento/template": {
+  "Web/HTML/Element/template": {
     "modified": "2020-10-15T21:52:05.945Z",
     "contributors": [
       "aguilerajl",
@@ -17002,7 +18068,7 @@
       "AlePerez92"
     ]
   },
-  "Web/HTML/Elemento/textarea": {
+  "Web/HTML/Element/textarea": {
     "modified": "2020-10-15T21:43:13.029Z",
     "contributors": [
       "camsa",
@@ -17010,7 +18076,7 @@
       "pekechis"
     ]
   },
-  "Web/HTML/Elemento/th": {
+  "Web/HTML/Element/th": {
     "modified": "2020-04-22T05:00:45.306Z",
     "contributors": [
       "blanchart",
@@ -17019,7 +18085,7 @@
       "sapales"
     ]
   },
-  "Web/HTML/Elemento/time": {
+  "Web/HTML/Element/time": {
     "modified": "2020-10-15T21:18:39.499Z",
     "contributors": [
       "pardo-bsso",
@@ -17032,7 +18098,18 @@
       "makoescalzo"
     ]
   },
-  "Web/HTML/Elemento/title": {
+  "orphaned/Web/HTML/Elemento/Tipos_de_elementos": {
+    "modified": "2019-03-23T23:46:22.404Z",
+    "contributors": [
+      "Sebastianz",
+      "jigs12",
+      "teoli",
+      "ethertank",
+      "Klosma",
+      "Jorolo"
+    ]
+  },
+  "Web/HTML/Element/title": {
     "modified": "2019-10-10T16:32:45.843Z",
     "contributors": [
       "duduindo",
@@ -17040,20 +18117,20 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/tr": {
+  "Web/HTML/Element/tr": {
     "modified": "2019-03-23T22:38:35.421Z",
     "contributors": [
       "raecillacastellana",
       "FelipeGL"
     ]
   },
-  "Web/HTML/Elemento/track": {
+  "Web/HTML/Element/track": {
     "modified": "2020-10-15T22:33:21.321Z",
     "contributors": [
       "Pablo-No"
     ]
   },
-  "Web/HTML/Elemento/tt": {
+  "Web/HTML/Element/tt": {
     "modified": "2019-03-18T21:11:03.301Z",
     "contributors": [
       "duduindo",
@@ -17061,7 +18138,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/u": {
+  "Web/HTML/Element/u": {
     "modified": "2019-03-18T21:11:03.114Z",
     "contributors": [
       "duduindo",
@@ -17069,7 +18146,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/ul": {
+  "Web/HTML/Element/ul": {
     "modified": "2019-03-23T23:42:39.154Z",
     "contributors": [
       "Sebastianz",
@@ -17078,7 +18155,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/var": {
+  "Web/HTML/Element/var": {
     "modified": "2019-03-23T23:41:16.113Z",
     "contributors": [
       "BubuAnabelas",
@@ -17086,7 +18163,7 @@
       "Jorolo"
     ]
   },
-  "Web/HTML/Elemento/video": {
+  "Web/HTML/Element/video": {
     "modified": "2019-03-24T00:06:49.642Z",
     "contributors": [
       "wbamberg",
@@ -17097,20 +18174,20 @@
       "Izel"
     ]
   },
-  "Web/HTML/Elemento/wbr": {
+  "Web/HTML/Element/wbr": {
     "modified": "2019-04-26T19:10:14.131Z",
     "contributors": [
       "reymundus2",
       "jcr4"
     ]
   },
-  "Web/HTML/Elemento/xmp": {
+  "Web/HTML/Element/xmp": {
     "modified": "2019-03-23T22:38:49.554Z",
     "contributors": [
       "jcr4"
     ]
   },
-  "Web/HTML/Elementos_en_línea": {
+  "Web/HTML/Inline_elements": {
     "modified": "2019-03-23T22:46:15.359Z",
     "contributors": [
       "juanbrujo",
@@ -17118,16 +18195,7 @@
       "vltamara"
     ]
   },
-  "Web/HTML/Formatos_admitidos_de_audio_y_video_en_html5": {
-    "modified": "2019-03-23T23:26:59.594Z",
-    "contributors": [
-      "wbamberg",
-      "vltamara",
-      "teoli",
-      "nekside"
-    ]
-  },
-  "Web/HTML/Imagen_con_CORS_habilitado": {
+  "Web/HTML/CORS_enabled_image": {
     "modified": "2019-03-23T22:46:06.691Z",
     "contributors": [
       "MrCesar107",
@@ -17135,21 +18203,26 @@
       "vltamara"
     ]
   },
-  "Web/HTML/La_importancia_de_comentar_correctamente": {
-    "modified": "2019-03-23T23:53:31.079Z",
+  "Web/HTML/Index": {
+    "modified": "2019-01-16T22:12:02.767Z",
     "contributors": [
-      "teoli",
-      "Mgjbot",
-      "Jorolo"
+      "raecillacastellana",
+      "pekechis"
     ]
   },
-  "Web/HTML/Microdatos": {
+  "Web/HTML/Microdata": {
     "modified": "2019-03-23T22:12:50.480Z",
     "contributors": [
       "fitojb"
     ]
   },
-  "Web/HTML/Optimizing_your_pages_for_speculative_parsing": {
+  "Web/HTML/microformats": {
+    "modified": "2019-03-23T22:46:15.016Z",
+    "contributors": [
+      "vltamara"
+    ]
+  },
+  "Glossary/speculative_parsing": {
     "modified": "2019-03-23T23:15:52.979Z",
     "contributors": [
       "jsapiains",
@@ -17159,16 +18232,7 @@
       "Montherdez"
     ]
   },
-  "Web/HTML/Quirks_Mode_and_Standards_Mode": {
-    "modified": "2019-03-23T22:00:35.023Z",
-    "contributors": [
-      "chrisdavidmills",
-      "alvaromontoro",
-      "mamptecnocrata",
-      "ungatoquecomesushi"
-    ]
-  },
-  "Web/HTML/Recursos_offline_en_firefox": {
+  "Web/HTML/Using_the_application_cache": {
     "modified": "2019-03-19T07:43:37.221Z",
     "contributors": [
       "pixelmin",
@@ -17185,7 +18249,7 @@
       "Izel"
     ]
   },
-  "Web/HTML/Referencia": {
+  "Web/HTML/Reference": {
     "modified": "2019-09-09T07:16:42.154Z",
     "contributors": [
       "SphinxKnight",
@@ -17196,7 +18260,7 @@
       "MegaChrono"
     ]
   },
-  "Web/HTML/Tipos_de_enlaces": {
+  "Web/HTML/Link_types": {
     "modified": "2019-03-23T22:46:17.969Z",
     "contributors": [
       "cmmp0112",
@@ -17207,62 +18271,14 @@
       "vltamara"
     ]
   },
-  "Web/HTML/Transision_adaptativa_DASH": {
+  "Web/Media/DASH_Adaptive_Streaming_for_HTML_5_Video": {
     "modified": "2019-03-23T22:46:14.015Z",
     "contributors": [
       "AzazelN28",
       "vltamara"
     ]
   },
-  "Web/HTML/Usando_audio_y_video_con_HTML5": {
-    "modified": "2019-10-10T16:52:54.661Z",
-    "contributors": [
-      "ElNobDeTfm",
-      "estebanz01",
-      "hedmon",
-      "blanchart",
-      "teoli",
-      "ciroid",
-      "cesar_ortiz_elPatox",
-      "StripTM",
-      "AngelFQC"
-    ]
-  },
-  "Web/HTML/anipular_video_por_medio_de_canvas": {
-    "modified": "2019-03-24T00:07:00.528Z",
-    "contributors": [
-      "teoli",
-      "inma_610"
-    ]
-  },
-  "Web/HTML/microformatos": {
-    "modified": "2019-03-23T22:46:15.016Z",
-    "contributors": [
-      "vltamara"
-    ]
-  },
-  "Web/HTML/Índice": {
-    "modified": "2019-01-16T22:12:02.767Z",
-    "contributors": [
-      "raecillacastellana",
-      "pekechis"
-    ]
-  },
-  "Web/HTTP": {
-    "modified": "2019-03-18T20:34:58.542Z",
-    "contributors": [
-      "IsraelFloresDGA",
-      "MarioECU",
-      "locolauty97",
-      "Sergio_Gonzalez_Collado",
-      "Ferrmolina",
-      "raecillacastellana",
-      "migdonio1",
-      "Erto",
-      "teoli"
-    ]
-  },
-  "Web/HTTP/Access_control_CORS": {
+  "Web/HTTP/CORS": {
     "modified": "2020-08-10T16:23:20.546Z",
     "contributors": [
       "wbamberg",
@@ -17283,36 +18299,7 @@
       "maedca"
     ]
   },
-  "Web/HTTP/Authentication": {
-    "modified": "2019-10-24T13:52:25.126Z",
-    "contributors": [
-      "bood-dev",
-      "Gochip",
-      "fcanellas",
-      "diegorec",
-      "kraneok",
-      "JuanMacias",
-      "_deiberchacon",
-      "DavidPeniafiel"
-    ]
-  },
-  "Web/HTTP/Basics_of_HTTP": {
-    "modified": "2020-04-20T02:59:31.392Z",
-    "contributors": [
-      "obed3113",
-      "sanxofon",
-      "Sergio_Gonzalez_Collado",
-      "cissoid"
-    ]
-  },
-  "Web/HTTP/Basics_of_HTTP/Choosing_between_www_and_non-www_URLs": {
-    "modified": "2019-03-18T21:22:07.450Z",
-    "contributors": [
-      "Adorta4",
-      "carlosgocereceda"
-    ]
-  },
-  "Web/HTTP/Basics_of_HTTP/Datos_URIs": {
+  "Web/HTTP/Basics_of_HTTP/Data_URIs": {
     "modified": "2019-03-23T22:24:54.977Z",
     "contributors": [
       "Sergio_Gonzalez_Collado",
@@ -17320,14 +18307,7 @@
       "uclides"
     ]
   },
-  "Web/HTTP/Basics_of_HTTP/Evolution_of_HTTP": {
-    "modified": "2019-03-23T22:10:11.567Z",
-    "contributors": [
-      "Sergio_Gonzalez_Collado",
-      "ChrisMHM"
-    ]
-  },
-  "Web/HTTP/Basics_of_HTTP/Identificación_recursos_en_la_Web": {
+  "Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web": {
     "modified": "2019-03-23T22:24:51.387Z",
     "contributors": [
       "DaniNz",
@@ -17336,746 +18316,45 @@
       "uclides"
     ]
   },
-  "Web/HTTP/Basics_of_HTTP/MIME_types": {
-    "modified": "2019-11-18T08:03:54.325Z",
-    "contributors": [
-      "IsaacAaron",
-      "sanxofon",
-      "Sergio_Gonzalez_Collado",
-      "kevinmont",
-      "juanrarodriguez18",
-      "strattadb"
-    ]
-  },
-  "Web/HTTP/Basics_of_HTTP/MIME_types/Common_types": {
-    "modified": "2020-02-28T13:10:45.613Z",
-    "contributors": [
-      "chrisdavidmills",
-      "sanxofon",
-      "franklevel",
-      "gabrielnoe"
-    ]
-  },
-  "Web/HTTP/CORS/Errors": {
-    "modified": "2019-03-18T21:26:43.815Z",
-    "contributors": [
-      "nchevobbe"
-    ]
-  },
-  "Web/HTTP/CORS/Errors/CORSDidNotSucceed": {
-    "modified": "2020-03-20T09:22:59.137Z",
-    "contributors": [
-      "javier.camus",
-      "rotcl",
-      "MarianoRDZ"
-    ]
-  },
-  "Web/HTTP/CORS/Errors/CORSMissingAllowOrigin": {
-    "modified": "2020-03-10T05:27:13.697Z",
-    "contributors": [
-      "HermosinNunez",
-      "danhiel98",
-      "pyumbillo",
-      "rewin23"
-    ]
-  },
-  "Web/HTTP/CORS/Errors/CORSNotSupportingCredentials": {
-    "modified": "2020-03-25T19:41:08.379Z",
-    "contributors": [
-      "pablogalvezfotografiadeportiva"
-    ]
-  },
-  "Web/HTTP/CORS/Errors/CORSPreflightDidNotSucceed": {
-    "modified": "2019-10-08T04:58:57.176Z",
-    "contributors": [
-      "Concatenacion"
-    ]
-  },
-  "Web/HTTP/CORS/Errors/CORSRequestNotHttp": {
-    "modified": "2020-07-09T00:32:19.159Z",
-    "contributors": [
-      "agf0710",
-      "advica2016",
-      "BubuAnabelas",
-      "Juan_Pablo"
-    ]
-  },
-  "Web/HTTP/CSP": {
-    "modified": "2020-10-15T22:03:58.031Z",
-    "contributors": [
-      "lautaropaske",
-      "herleym",
-      "BubuAnabelas",
-      "vk496",
-      "CarlosRomeroVera"
-    ]
-  },
-  "Web/HTTP/Caching": {
-    "modified": "2019-03-18T21:21:15.259Z",
-    "contributors": [
-      "WilsonIsAliveClone",
-      "serarroy",
-      "ulisestrujillo"
-    ]
-  },
-  "Web/HTTP/Cookies": {
-    "modified": "2020-06-27T19:11:54.360Z",
-    "contributors": [
-      "vinjatovix",
-      "SphinxKnight",
-      "g.baldemar.77",
-      "alexlndn",
-      "rayrojas",
-      "jesuscampos",
-      "nachoperassi",
-      "cguimaraenz",
-      "eortizromero",
-      "omertafox"
-    ]
-  },
-  "Web/HTTP/Gestion_de_la_conexion_en_HTTP_1.x": {
+  "Web/HTTP/Connection_management_in_HTTP_1.x": {
     "modified": "2019-03-23T22:03:37.565Z",
     "contributors": [
       "jose89gp",
       "Sergio_Gonzalez_Collado"
     ]
   },
-  "Web/HTTP/Headers": {
-    "modified": "2019-12-10T13:29:15.931Z",
-    "contributors": [
-      "OneLoneFox",
-      "hamethassaf",
-      "darianbenito",
-      "MrcRjs",
-      "Watermelonnable",
-      "JurgenBlitz",
-      "ampersand89",
-      "fjuarez",
-      "fscholz"
-    ]
-  },
-  "Web/HTTP/Headers/Accept": {
-    "modified": "2020-10-15T21:55:42.853Z",
-    "contributors": [
-      "gabriel-ar"
-    ]
-  },
-  "Web/HTTP/Headers/Accept-Charset": {
-    "modified": "2020-10-15T22:13:56.858Z",
-    "contributors": [
-      "ArnoldFZ"
-    ]
-  },
-  "Web/HTTP/Headers/Accept-Ranges": {
-    "modified": "2020-10-15T21:52:24.088Z",
-    "contributors": [
-      "gerardo1sanchez"
-    ]
-  },
-  "Web/HTTP/Headers/Access-Control-Allow-Credentials": {
-    "modified": "2020-10-15T22:29:00.518Z",
-    "contributors": [
-      "BubuAnabelas",
-      "IsraelFloresDGA"
-    ]
-  },
-  "Web/HTTP/Headers/Access-Control-Allow-Headers": {
-    "modified": "2020-10-15T22:07:25.027Z",
-    "contributors": [
-      "_deiberchacon"
-    ]
-  },
-  "Web/HTTP/Headers/Access-Control-Allow-Methods": {
-    "modified": "2020-10-15T21:54:50.843Z",
-    "contributors": [
-      "irsequisious"
-    ]
-  },
-  "Web/HTTP/Headers/Access-Control-Allow-Origin": {
-    "modified": "2020-10-15T21:56:44.483Z",
-    "contributors": [
-      "estrelow",
-      "IsraelFloresDGA",
-      "aranzuze35",
-      "_deiberchacon",
-      "anxobotana",
-      "JhonAguiar"
-    ]
-  },
-  "Web/HTTP/Headers/Access-Control-Expose-Headers": {
-    "modified": "2020-10-15T22:06:29.086Z",
-    "contributors": [
-      "jorgeCaster",
-      "kraneok"
-    ]
-  },
-  "Web/HTTP/Headers/Age": {
-    "modified": "2020-10-15T22:10:53.345Z",
-    "contributors": [
-      "0xCGonzalo"
-    ]
-  },
-  "Web/HTTP/Headers/Allow": {
-    "modified": "2019-03-18T21:23:10.971Z",
-    "contributors": [
-      "ogaston"
-    ]
-  },
-  "Web/HTTP/Headers/Authorization": {
-    "modified": "2019-03-18T21:34:28.554Z",
-    "contributors": [
-      "kraneok",
-      "Watermelonnable"
-    ]
-  },
-  "Web/HTTP/Headers/Cache-Control": {
-    "modified": "2020-10-28T14:39:35.644Z",
-    "contributors": [
-      "noksenberg",
-      "IsraelFloresDGA",
-      "ervin_santos"
-    ]
-  },
-  "Web/HTTP/Headers/Content-Disposition": {
-    "modified": "2020-10-15T21:58:39.489Z",
-    "contributors": [
-      "kbono",
-      "lagwy"
-    ]
-  },
-  "Web/HTTP/Headers/Content-Encoding": {
-    "modified": "2020-10-15T21:53:14.848Z",
-    "contributors": [
-      "IT-Rafa",
-      "sevillacode"
-    ]
-  },
-  "Web/HTTP/Headers/Content-Length": {
-    "modified": "2020-10-15T22:07:26.889Z",
-    "contributors": [
-      "aliciava00",
-      "efrencruz"
-    ]
-  },
-  "Web/HTTP/Headers/Content-Location": {
-    "modified": "2020-10-15T22:29:48.071Z",
-    "contributors": [
-      "hecmonter"
-    ]
-  },
-  "Web/HTTP/Headers/Content-Security-Policy": {
-    "modified": "2020-10-15T22:18:45.176Z",
-    "contributors": [
-      "rayrojas",
-      "mauril26",
-      "27z"
-    ]
-  },
-  "Web/HTTP/Headers/Content-Type": {
-    "modified": "2020-10-15T21:58:35.257Z",
-    "contributors": [
-      "ivanfretes",
-      "omertafox",
-      "ValeriaRamos"
-    ]
-  },
-  "Web/HTTP/Headers/Cookie": {
-    "modified": "2020-10-15T21:55:41.792Z",
-    "contributors": [
-      "SSantiago90"
-    ]
-  },
-  "Web/HTTP/Headers/Cross-Origin-Resource-Policy": {
-    "modified": "2020-10-15T22:29:00.325Z",
-    "contributors": [
-      "IsraelFloresDGA"
-    ]
-  },
-  "Web/HTTP/Headers/ETag": {
-    "modified": "2020-10-15T21:57:09.273Z",
-    "contributors": [
-      "zechworld",
-      "evalenzuela",
-      "stwilberth",
-      "edgarrod71"
-    ]
-  },
-  "Web/HTTP/Headers/Expires": {
-    "modified": "2020-10-15T21:56:44.738Z",
-    "contributors": [
-      "ernesto.palafox"
-    ]
-  },
-  "Web/HTTP/Headers/Host": {
-    "modified": "2020-10-15T22:24:56.306Z",
-    "contributors": [
-      "escatel.bernal10",
-      "Alvarito-056"
-    ]
-  },
-  "Web/HTTP/Headers/Keep-Alive": {
-    "modified": "2020-10-15T22:02:52.123Z",
-    "contributors": [
-      "fernomenoide"
-    ]
-  },
-  "Web/HTTP/Headers/Link": {
-    "modified": "2020-10-15T22:28:59.441Z",
-    "contributors": [
-      "threevanny"
-    ]
-  },
-  "Web/HTTP/Headers/Origin": {
-    "modified": "2020-10-15T22:00:47.248Z",
-    "contributors": [
-      "IsraelFloresDGA",
-      "Abelhg"
-    ]
-  },
-  "Web/HTTP/Headers/Pragma": {
-    "modified": "2020-10-15T22:09:54.700Z",
-    "contributors": [
-      "ervin_santos"
-    ]
-  },
-  "Web/HTTP/Headers/Referer": {
-    "modified": "2020-10-15T21:53:10.093Z",
-    "contributors": [
-      "LastCyborg",
-      "fitojb",
-      "UltimoOrejonDelTarro"
-    ]
-  },
-  "Web/HTTP/Headers/Referrer-Policy": {
-    "modified": "2020-10-15T22:01:34.403Z",
-    "contributors": [
-      "fitojb"
-    ]
-  },
-  "Web/HTTP/Headers/Server": {
-    "modified": "2020-10-15T21:55:40.335Z",
-    "contributors": [
-      "sevillacode",
-      "TheSgtPepper23",
-      "irsequisious"
-    ]
-  },
-  "Web/HTTP/Headers/Set-Cookie": {
-    "modified": "2020-10-26T12:24:29.884Z",
-    "contributors": [
-      "ignacio-ifm",
-      "IsraelFloresDGA",
-      "rayrojas",
-      "ramonserrano",
-      "garolard"
-    ]
-  },
-  "Web/HTTP/Headers/Strict-Transport-Security": {
-    "modified": "2020-10-15T21:54:14.546Z",
-    "contributors": [
-      "AmadPS",
-      "pipe01",
-      "heilop",
-      "JulianSoto",
-      "pablolopezmera",
-      "Oxicode"
-    ]
-  },
-  "Web/HTTP/Headers/Transfer-Encoding": {
-    "modified": "2020-10-15T22:24:54.193Z",
-    "contributors": [
-      "0xCGonzalo"
-    ]
-  },
-  "Web/HTTP/Headers/User-Agent": {
-    "modified": "2020-10-15T22:00:44.883Z",
-    "contributors": [
-      "LeoOliva",
-      "Imvi10"
-    ]
-  },
-  "Web/HTTP/Headers/Vary": {
-    "modified": "2020-10-15T21:56:44.020Z",
-    "contributors": [
-      "JhonAguiar"
-    ]
-  },
-  "Web/HTTP/Headers/WWW-Authenticate": {
-    "modified": "2020-10-15T22:19:30.337Z",
-    "contributors": [
-      "malonso",
-      "Gytree"
-    ]
-  },
-  "Web/HTTP/Headers/X-Content-Type-Options": {
-    "modified": "2020-10-15T21:59:06.832Z",
-    "contributors": [
-      "clbustos",
-      "tonialfaro"
-    ]
-  },
-  "Web/HTTP/Headers/X-Forwarded-For": {
-    "modified": "2020-10-15T22:16:47.635Z",
-    "contributors": [
-      "choadev",
-      "martinfrad",
-      "camsa"
-    ]
-  },
-  "Web/HTTP/Headers/X-Frame-Options": {
-    "modified": "2020-10-15T21:57:01.709Z",
-    "contributors": [
-      "ervin_santos",
-      "Luiggy",
-      "setlord"
-    ]
-  },
-  "Web/HTTP/Headers/X-XSS-Protection": {
-    "modified": "2020-10-15T21:59:06.897Z",
-    "contributors": [
-      "JulioMoreyra",
-      "francinysalles",
-      "tonialfaro"
-    ]
-  },
-  "Web/HTTP/Messages": {
-    "modified": "2019-11-12T11:40:26.816Z",
-    "contributors": [
-      "emiedes",
-      "jose89gp",
-      "anibalortegap",
-      "Sergio_Gonzalez_Collado"
-    ]
-  },
-  "Web/HTTP/Methods": {
-    "modified": "2020-10-15T21:51:09.574Z",
-    "contributors": [
-      "andrpueb",
-      "eddydeath",
-      "JRaiden",
-      "JulianSoto",
-      "RamsesMartinez"
-    ]
-  },
-  "Web/HTTP/Methods/CONNECT": {
-    "modified": "2020-10-15T22:09:12.273Z",
-    "contributors": [
-      "jadiosc"
-    ]
-  },
-  "Web/HTTP/Methods/GET": {
-    "modified": "2020-12-13T00:32:42.441Z",
-    "contributors": [
-      "victorgabardini",
-      "SphinxKnight",
-      "sercorc.12",
-      "oespino",
-      "RetelboP"
-    ]
-  },
-  "Web/HTTP/Methods/PATCH": {
-    "modified": "2020-10-04T20:15:30.024Z",
-    "contributors": [
-      "hamishwillee",
-      "cnietoc",
-      "SackmannDV",
-      "noecende"
-    ]
-  },
-  "Web/HTTP/Methods/POST": {
-    "modified": "2020-11-06T16:08:25.707Z",
-    "contributors": [
-      "Max_Gremory",
-      "JGarnica",
-      "qmarquez",
-      "DavidGalvis",
-      "sammye70",
-      "Sheppy",
-      "mtnalonso",
-      "Juenesis"
-    ]
-  },
-  "Web/HTTP/Methods/PUT": {
-    "modified": "2020-10-15T21:58:39.134Z",
-    "contributors": [
-      "mtnalonso"
-    ]
-  },
-  "Web/HTTP/Methods/TRACE": {
-    "modified": "2020-10-15T22:12:36.763Z",
-    "contributors": [
-      "pablobiedma"
-    ]
-  },
-  "Web/HTTP/Overview": {
-    "modified": "2020-08-07T11:46:49.430Z",
+  "Web/HTTP/Protocol_upgrade_mechanism": {
+    "modified": "2019-03-18T21:45:03.291Z",
     "contributors": [
-      "marcusdesantis",
-      "Enesimus",
-      "Rafasu",
-      "ChrisMHM",
-      "LuisGalicia",
-      "jose89gp",
-      "DaniNz",
-      "cabaag",
+      "patoezequiel",
       "Sergio_Gonzalez_Collado"
     ]
   },
-  "Web/HTTP/Peticiones_condicionales": {
+  "Web/HTTP/Conditional_requests": {
     "modified": "2019-03-18T21:19:37.220Z",
     "contributors": [
       "christianmg99"
     ]
   },
-  "Web/HTTP/Sesión": {
-    "modified": "2019-03-23T22:05:36.352Z",
-    "contributors": [
-      "Sergio_Gonzalez_Collado"
-    ]
-  },
-  "Web/HTTP/Status": {
-    "modified": "2020-10-01T02:41:07.109Z",
-    "contributors": [
-      "SphinxKnight",
-      "gonzalestino924",
-      "manuelguido",
-      "juliocesardeveloper",
-      "ismanapa",
-      "santiago.lator",
-      "leticia-acib",
-      "josecarbajalbolbot",
-      "StarViruZ",
-      "amircp",
-      "SebastianBar",
-      "serivt",
-      "Jens.B"
-    ]
-  },
-  "Web/HTTP/Status/100": {
-    "modified": "2020-10-15T21:56:53.445Z",
-    "contributors": [
-      "serivt"
-    ]
-  },
-  "Web/HTTP/Status/101": {
-    "modified": "2019-03-18T21:22:02.098Z",
-    "contributors": [
-      "jlamasfripp"
-    ]
-  },
-  "Web/HTTP/Status/200": {
-    "modified": "2020-10-15T22:05:24.611Z",
-    "contributors": [
-      "SphinxKnight",
-      "alexibarra55",
-      "jlamasfripp",
-      "gbarriosf",
-      "snaven10",
-      "Adriel_from_Nav"
-    ]
-  },
-  "Web/HTTP/Status/201": {
-    "modified": "2020-10-15T22:08:02.661Z",
-    "contributors": [
-      "WriestTavo"
-    ]
-  },
-  "Web/HTTP/Status/202": {
-    "modified": "2019-04-19T16:13:12.876Z",
-    "contributors": [
-      "Hibot12"
-    ]
-  },
-  "Web/HTTP/Status/203": {
-    "modified": "2020-06-14T20:53:26.311Z",
-    "contributors": [
-      "rayrojas"
-    ]
-  },
-  "Web/HTTP/Status/206": {
-    "modified": "2020-10-15T22:02:08.111Z",
-    "contributors": [
-      "qpdian"
-    ]
-  },
-  "Web/HTTP/Status/301": {
-    "modified": "2020-10-15T22:24:06.781Z",
-    "contributors": [
-      "nullxx"
-    ]
-  },
-  "Web/HTTP/Status/302": {
-    "modified": "2020-10-15T21:59:00.277Z",
-    "contributors": [
-      "B1tF8er",
-      "kraptor",
-      "astrapotro"
-    ]
-  },
-  "Web/HTTP/Status/304": {
-    "modified": "2020-10-15T22:12:46.751Z",
-    "contributors": [
-      "jairoFg12"
-    ]
-  },
-  "Web/HTTP/Status/400": {
-    "modified": "2019-08-03T10:06:53.857Z",
-    "contributors": [
-      "molavec",
-      "Hibot12"
-    ]
-  },
-  "Web/HTTP/Status/401": {
-    "modified": "2020-10-15T21:55:15.004Z",
-    "contributors": [
-      "Clipi",
-      "JuanMacias",
-      "mjaque",
-      "andreximo"
-    ]
-  },
-  "Web/HTTP/Status/403": {
-    "modified": "2020-10-15T21:58:50.466Z",
-    "contributors": [
-      "JuanMacias"
-    ]
-  },
-  "Web/HTTP/Status/404": {
-    "modified": "2020-10-15T21:56:47.503Z",
-    "contributors": [
-      "BrodaNoel"
-    ]
-  },
-  "Web/HTTP/Status/408": {
-    "modified": "2019-03-18T21:30:00.279Z",
-    "contributors": [
-      "juusechec"
-    ]
-  },
-  "Web/HTTP/Status/418": {
-    "modified": "2020-10-15T22:21:28.070Z",
-    "contributors": [
-      "joseluisq",
-      "paolo667"
-    ]
-  },
-  "Web/HTTP/Status/500": {
-    "modified": "2020-12-07T12:32:25.820Z",
-    "contributors": [
-      "dayanhernandez353",
-      "karenonaly",
-      "duduindo",
-      "marcelokruk",
-      "Viejofon"
-    ]
-  },
-  "Web/HTTP/Status/502": {
-    "modified": "2020-10-15T21:56:55.208Z",
-    "contributors": [
-      "josecarbajalbolbot",
-      "AlePerez92",
-      "josmelnoel"
-    ]
-  },
-  "Web/HTTP/Status/503": {
-    "modified": "2020-10-15T22:10:17.555Z",
-    "contributors": [
-      "Parodper",
-      "ajuni880",
-      "diego-bustamante"
-    ]
-  },
-  "Web/HTTP/Status/504": {
-    "modified": "2020-10-15T22:08:08.336Z",
+  "Web/HTTP/Resources_and_specifications": {
+    "modified": "2019-03-23T22:03:46.656Z",
     "contributors": [
-      "ojeanicolas"
+      "_deiberchacon"
     ]
   },
-  "Web/HTTP/Status/505": {
-    "modified": "2020-04-03T20:59:26.896Z",
+  "Web/HTTP/Session": {
+    "modified": "2019-03-23T22:05:36.352Z",
     "contributors": [
-      "lp4749791"
+      "Sergio_Gonzalez_Collado"
     ]
   },
-  "Web/HTTP/Status/8080": {
+  "Web/HTTP/Status/413": {
     "modified": "2020-03-18T21:09:54.600Z",
     "contributors": [
       "guzmanoscaralexis"
     ]
   },
-  "Web/HTTP/mecanismo_actualizacion_protocolo": {
-    "modified": "2019-03-18T21:45:03.291Z",
-    "contributors": [
-      "patoezequiel",
-      "Sergio_Gonzalez_Collado"
-    ]
-  },
-  "Web/HTTP/recursos_y_especificaciones": {
-    "modified": "2019-03-23T22:03:46.656Z",
-    "contributors": [
-      "_deiberchacon"
-    ]
-  },
-  "Web/JavaScript": {
-    "modified": "2020-11-23T12:49:37.646Z",
-    "contributors": [
-      "SphinxKnight",
-      "kramosr68",
-      "ivanfernandez5209",
-      "Tonatew",
-      "alejogomes944",
-      "Nachec",
-      "victitor800",
-      "Enesimus",
-      "franchesco182001",
-      "pauli.rodriguez.c",
-      "jhonarielgj",
-      "Fegaan",
-      "OOJuanferOO",
-      "nicolas25ramirez",
-      "andreamv2807",
-      "tomasvillarragaperez",
-      "Yel-Martinez-Consultor-Seo",
-      "rodririobo",
-      "isabelsvelasquezv",
-      "fedegianni04",
-      "jaomix1",
-      "TheJarX",
-      "clarii",
-      "NataliaCba",
-      "NicoleCleto1998",
-      "JavScars",
-      "untilbit",
-      "AlePerez92",
-      "aluxito",
-      "luisNavasArg",
-      "jsx",
-      "carlossuarez",
-      "Pablo_Ivan",
-      "teoli",
-      "LeoHirsch",
-      "smarchioni",
-      "ricardo777",
-      "CarlosQuijano",
-      "Scipion",
-      "alquimista",
-      "Nukeador",
-      "ethertank",
-      "Jorge.villalobos",
-      "arleytriana",
-      "arpunk",
-      "inma_610",
-      "StripTM",
-      "Mgjbot",
-      "Superruzafa",
-      "Verruckt",
-      "Jorolo",
-      "Vyk",
-      "Takenbot",
-      "RJacinto"
-    ]
-  },
-  "Web/JavaScript/Acerca_de_JavaScript": {
+  "Web/JavaScript/About_JavaScript": {
     "modified": "2020-09-12T13:33:01.910Z",
     "contributors": [
       "Nachec",
@@ -18087,44 +18366,7 @@
       "StripTM"
     ]
   },
-  "Web/JavaScript/Closures": {
-    "modified": "2020-04-08T19:26:44.700Z",
-    "contributors": [
-      "camsa",
-      "wbamberg",
-      "AzazelN28",
-      "JonasBrandel",
-      "fscholz",
-      "guty",
-      "Siro_Diaz",
-      "luigli",
-      "teoli",
-      "FNK",
-      "juanc.jara",
-      "Josias",
-      "neosergio",
-      "hjoaco"
-    ]
-  },
-  "Web/JavaScript/Data_structures": {
-    "modified": "2020-08-30T02:21:59.996Z",
-    "contributors": [
-      "Nachec",
-      "edwinmunguia",
-      "arzr",
-      "rayrojas",
-      "melgard",
-      "mmngreco",
-      "AngryDev",
-      "Gorzas",
-      "alejandrochung",
-      "IXTRUnai",
-      "damnyorch",
-      "devconcept",
-      "sancospi"
-    ]
-  },
-  "Web/JavaScript/Descripción_de_las_tecnologías_JavaScript": {
+  "Web/JavaScript/JavaScript_technologies_overview": {
     "modified": "2020-09-02T05:54:39.004Z",
     "contributors": [
       "Nachec",
@@ -18135,27 +18377,15 @@
       "geinerjv"
     ]
   },
-  "Web/JavaScript/Equality_comparisons_and_sameness": {
-    "modified": "2020-03-24T18:47:23.011Z",
-    "contributors": [
-      "camsa",
-      "abestrad1",
-      "EduardoCasanova",
-      "pekechis"
-    ]
-  },
-  "Web/JavaScript/EventLoop": {
-    "modified": "2020-03-12T19:43:05.672Z",
+  "Web/JavaScript/Enumerability_and_ownership_of_properties": {
+    "modified": "2020-08-30T03:56:15.697Z",
     "contributors": [
-      "AzazelN28",
-      "omonteon",
-      "guillermojmc",
-      "eljonims",
-      "MrCoffey",
-      "Anonymous"
+      "Nachec",
+      "teoli",
+      "LeoHirsch"
     ]
   },
-  "Web/JavaScript/Gestion_de_Memoria": {
+  "Web/JavaScript/Memory_Management": {
     "modified": "2020-03-12T19:40:38.018Z",
     "contributors": [
       "Jairgc",
@@ -18166,28 +18396,7 @@
       "cesaralvarado9"
     ]
   },
-  "Web/JavaScript/Guide": {
-    "modified": "2020-09-12T21:03:22.983Z",
-    "contributors": [
-      "Nachec",
-      "AmazonianCodeGuy",
-      "tezece",
-      "MarcyG1",
-      "nhuamani",
-      "manuhdez",
-      "e.g.m.g.",
-      "Pablo_Ivan",
-      "nelson6e65",
-      "walterpaoli",
-      "joanvasa",
-      "fscholz",
-      "Benjalorc",
-      "teoli",
-      "mitogh",
-      "xavo7"
-    ]
-  },
-  "Web/JavaScript/Guide/Bucles_e_iteración": {
+  "Web/JavaScript/Guide/Loops_and_iteration": {
     "modified": "2020-10-21T16:48:14.421Z",
     "contributors": [
       "sofi8825",
@@ -18205,7 +18414,21 @@
       "joanvasa"
     ]
   },
-  "Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores": {
+  "Web/JavaScript/Guide/Indexed_collections": {
+    "modified": "2020-08-20T18:50:37.500Z",
+    "contributors": [
+      "Nachec",
+      "EstebanRK",
+      "ccasadom",
+      "jreyesgs",
+      "recortes",
+      "Cxistian",
+      "douwiD",
+      "frantcisko",
+      "joanvasa"
+    ]
+  },
+  "Web/JavaScript/Guide/Control_flow_and_error_handling": {
     "modified": "2020-09-14T09:17:05.043Z",
     "contributors": [
       "Nachec",
@@ -18232,56 +18455,7 @@
       "isnardi"
     ]
   },
-  "Web/JavaScript/Guide/Details_of_the_Object_Model": {
-    "modified": "2020-08-17T15:38:30.288Z",
-    "contributors": [
-      "Nachec",
-      "MariaBarros",
-      "AmazonianCodeGuy",
-      "wbamberg",
-      "fherce",
-      "SphinxKnight",
-      "ObsoleteHuman",
-      "ValentinTapiaTorti",
-      "brodriguezs",
-      "DiegoA1114",
-      "montogeek",
-      "fscholz",
-      "teoli",
-      "pheras"
-    ]
-  },
-  "Web/JavaScript/Guide/Expressions_and_Operators": {
-    "modified": "2020-09-13T21:58:37.783Z",
-    "contributors": [
-      "Nachec",
-      "gcjuan",
-      "Orlando-Flores-Huanca",
-      "wajari",
-      "anglozm",
-      "recortes",
-      "Ernesto385291",
-      "Jkierem",
-      "gsalinase",
-      "abestrad1",
-      "milouri23",
-      "Odol",
-      "victorsanchezm",
-      "ElChiniNet",
-      "UshioSan",
-      "siluvana",
-      "juanbrujo",
-      "01luisrene",
-      "gustavgil",
-      "Jaston",
-      "Alexis88",
-      "smarquez1",
-      "ricardochavarri",
-      "fscholz",
-      "spachecojimenez"
-    ]
-  },
-  "Web/JavaScript/Guide/Funciones": {
+  "Web/JavaScript/Guide/Functions": {
     "modified": "2020-10-02T18:21:48.240Z",
     "contributors": [
       "alejandro.fca",
@@ -18307,38 +18481,7 @@
       "epcode"
     ]
   },
-  "Web/JavaScript/Guide/Grammar_and_types": {
-    "modified": "2020-09-12T23:09:43.446Z",
-    "contributors": [
-      "Nachec",
-      "luis-al-merino",
-      "AmazonianCodeGuy",
-      "teknotica",
-      "feliperomero3",
-      "nullx5",
-      "abelosky",
-      "jlopezfdez",
-      "enriqueabsurdum",
-      "Ayman",
-      "AnthonyGareca",
-      "chuyinEF",
-      "estebancito",
-      "bytx",
-      "Pablo_Ivan",
-      "cgsramirez",
-      "eugenioNovas",
-      "marioalvazquez",
-      "joanvasa",
-      "fscholz",
-      "Cleon",
-      "angelnajera",
-      "vinixio",
-      "diegogaysaez",
-      "teoli",
-      "Amatos"
-    ]
-  },
-  "Web/JavaScript/Guide/Introducción": {
+  "Web/JavaScript/Guide/Introduction": {
     "modified": "2020-09-14T00:29:05.489Z",
     "contributors": [
       "Nachec",
@@ -18356,38 +18499,7 @@
       "rianby64"
     ]
   },
-  "Web/JavaScript/Guide/Iterators_and_Generators": {
-    "modified": "2020-03-12T19:42:41.976Z",
-    "contributors": [
-      "camsa",
-      "DJphilomath",
-      "mjaque",
-      "lassmann",
-      "eycopia",
-      "nefter",
-      "dieguezz",
-      "Breaking_Pitt"
-    ]
-  },
-  "Web/JavaScript/Guide/Keyed_collections": {
-    "modified": "2020-09-02T02:09:58.803Z",
-    "contributors": [
-      "Nachec",
-      "MariaBarros",
-      "jesus92gz",
-      "eljonims"
-    ]
-  },
-  "Web/JavaScript/Guide/Meta_programming": {
-    "modified": "2020-08-18T02:34:39.284Z",
-    "contributors": [
-      "Nachec",
-      "asamajamasa",
-      "jaomix1",
-      "jzatarain"
-    ]
-  },
-  "Web/JavaScript/Guide/Módulos": {
+  "Web/JavaScript/Guide/Modules": {
     "modified": "2020-10-15T22:27:31.770Z",
     "contributors": [
       "Nachec",
@@ -18397,91 +18509,43 @@
       "FDSoil"
     ]
   },
-  "Web/JavaScript/Guide/Numbers_and_dates": {
-    "modified": "2020-09-14T23:27:03.154Z",
-    "contributors": [
-      "Nachec",
-      "ds-developer1",
-      "la-syl",
-      "IsraelFloresDGA",
-      "ingcarlosperez",
-      "georgenevets",
-      "yakashiro"
-    ]
-  },
-  "Web/JavaScript/Guide/Regular_Expressions": {
-    "modified": "2020-10-15T21:29:34.015Z",
-    "contributors": [
-      "Nachec",
-      "wilmer2000",
-      "Ricardo_F.",
-      "lebubic",
-      "franklevel",
-      "recortes",
-      "LuisSevillano",
-      "pangeasi",
-      "Jabi",
-      "bartolocarrasco",
-      "fortil",
-      "BoyFerruco",
-      "Lehmer",
-      "wffranco",
-      "eljonims",
-      "jpmontoya182",
-      "guillermomartinmarco",
-      "fscholz",
-      "eespitia.rea",
-      "jcvergar"
-    ]
-  },
-  "Web/JavaScript/Guide/Regular_Expressions/Aserciones": {
+  "Web/JavaScript/Guide/Regular_Expressions/Assertions": {
     "modified": "2020-09-16T20:45:25.257Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Guide/Regular_Expressions/Clases_de_caracteres": {
+  "Web/JavaScript/Guide/Regular_Expressions/Character_Classes": {
     "modified": "2020-09-17T03:20:44.595Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Guide/Regular_Expressions/Cuantificadores": {
+  "Web/JavaScript/Guide/Regular_Expressions/Quantifiers": {
     "modified": "2020-09-15T21:48:26.513Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Guide/Regular_Expressions/Escapes_de_propiedades_Unicode": {
+  "Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes": {
     "modified": "2020-09-17T10:02:16.387Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Guide/Regular_Expressions/Grupos_y_rangos": {
+  "Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges": {
     "modified": "2020-09-17T10:14:04.470Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Guide/Regular_Expressions/Hoja_de_referencia": {
+  "Web/JavaScript/Guide/Regular_Expressions/Cheatsheet": {
     "modified": "2020-08-16T23:08:15.173Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Guide/Text_formatting": {
-    "modified": "2020-09-15T10:00:50.941Z",
-    "contributors": [
-      "Nachec",
-      "surielmx",
-      "IsraelFloresDGA",
-      "diegarta",
-      "Enesimus",
-      "jalmeida"
-    ]
-  },
-  "Web/JavaScript/Guide/Trabajando_con_objectos": {
+  "Web/JavaScript/Guide/Working_with_Objects": {
     "modified": "2020-08-18T17:28:58.690Z",
     "contributors": [
       "Nachec",
@@ -18515,7 +18579,7 @@
       "bluesky777"
     ]
   },
-  "Web/JavaScript/Guide/Usar_promesas": {
+  "Web/JavaScript/Guide/Using_promises": {
     "modified": "2020-05-16T20:15:48.240Z",
     "contributors": [
       "angelmartinez",
@@ -18526,21 +18590,7 @@
       "hamfree"
     ]
   },
-  "Web/JavaScript/Guide/colecciones_indexadas": {
-    "modified": "2020-08-20T18:50:37.500Z",
-    "contributors": [
-      "Nachec",
-      "EstebanRK",
-      "ccasadom",
-      "jreyesgs",
-      "recortes",
-      "Cxistian",
-      "douwiD",
-      "frantcisko",
-      "joanvasa"
-    ]
-  },
-  "Web/JavaScript/Herencia_y_la_cadena_de_protipos": {
+  "Web/JavaScript/Inheritance_and_the_prototype_chain": {
     "modified": "2020-03-12T19:41:32.707Z",
     "contributors": [
       "LeChonch",
@@ -18562,28 +18612,7 @@
       "blacknack"
     ]
   },
-  "Web/JavaScript/Introducción_a_JavaScript_orientado_a_objetos": {
-    "modified": "2020-03-12T19:36:14.050Z",
-    "contributors": [
-      "ivanagui2",
-      "libre8bit",
-      "alejandrochung",
-      "victorsanchezm",
-      "gchifflet",
-      "hmorv",
-      "Lorenzoygata",
-      "xxxtonixxx",
-      "joan.leon",
-      "fscholz",
-      "DeiberChacon",
-      "chebit",
-      "teoli",
-      "arpunk",
-      "inma_610",
-      "StripTM"
-    ]
-  },
-  "Web/JavaScript/Introduction_to_using_XPath_in_JavaScript": {
+  "Web/XPath/Introduction_to_using_XPath_in_JavaScript": {
     "modified": "2019-05-08T19:05:57.937Z",
     "contributors": [
       "AlbertoPrado70",
@@ -18593,250 +18622,44 @@
       "joakku"
     ]
   },
-  "Web/JavaScript/Language_Resources": {
-    "modified": "2020-03-12T19:47:17.832Z",
-    "contributors": [
-      "lajaso",
-      "jpmontoya182"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors": {
-    "modified": "2020-03-12T19:45:01.208Z",
-    "contributors": [
-      "JavScars",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Bad_octal": {
-    "modified": "2020-03-12T19:45:41.442Z",
-    "contributors": [
-      "HaroldV"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Deprecated_source_map_pragma": {
-    "modified": "2020-03-12T19:45:51.961Z",
+  "Web/JavaScript/Reference/Errors/Illegal_character": {
+    "modified": "2020-03-12T19:47:34.313Z",
     "contributors": [
-      "BubuAnabelas",
-      "Andres62",
-      "ingjosegarrido",
-      "JaimeNorato"
+      "kaycdc"
     ]
   },
-  "Web/JavaScript/Reference/Errors/Falta_puntoycoma_antes_de_declaracion": {
+  "Web/JavaScript/Reference/Errors/Missing_semicolon_before_statement": {
     "modified": "2020-03-12T19:46:13.102Z",
     "contributors": [
       "jonatanroot",
       "Lunacye"
     ]
   },
-  "Web/JavaScript/Reference/Errors/Indicador_regexp_no-val": {
+  "Web/JavaScript/Reference/Errors/Bad_regexp_flag": {
     "modified": "2020-09-01T13:12:41.234Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Reference/Errors/Invalid_array_length": {
-    "modified": "2020-03-12T19:46:48.651Z",
-    "contributors": [
-      "Tlauipil"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Invalid_date": {
-    "modified": "2020-03-12T19:47:15.708Z",
-    "contributors": [
-      "untilbit"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Malformed_formal_parameter": {
-    "modified": "2019-10-12T12:26:22.919Z",
-    "contributors": [
-      "JGmr5"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Missing_curly_after_property_list": {
-    "modified": "2020-03-12T19:46:53.938Z",
-    "contributors": [
-      "DGun17"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Missing_formal_parameter": {
-    "modified": "2020-03-12T19:47:16.712Z",
-    "contributors": [
-      "TheEpicSimple"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Missing_parenthesis_after_argument_list": {
-    "modified": "2020-03-12T19:46:54.683Z",
-    "contributors": [
-      "hiuxmaycry",
-      "ivandevp"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/More_arguments_needed": {
-    "modified": "2020-03-12T19:49:21.407Z",
-    "contributors": [
-      "dragonmenorka"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/No_variable_name": {
-    "modified": "2020-03-12T19:48:33.901Z",
-    "contributors": [
-      "CatalinaCampos"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Not_a_codepoint": {
-    "modified": "2020-03-12T19:46:46.603Z",
-    "contributors": [
-      "DGun17"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Not_a_function": {
-    "modified": "2020-03-12T19:45:06.322Z",
-    "contributors": [
-      "PatoDeTuring",
-      "untilbit",
-      "josegarciaclm95"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Not_defined": {
-    "modified": "2020-10-08T09:22:13.757Z",
-    "contributors": [
-      "ludoescribano.2016",
-      "FacuBustamaante",
-      "ozavala",
-      "ccorcoles",
-      "Heranibus",
-      "jsgaonac",
-      "Luis_Armando"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Precision_range": {
-    "modified": "2020-08-10T12:14:52.122Z",
-    "contributors": [
-      "Sgewux"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Property_access_denied": {
-    "modified": "2020-03-12T19:46:35.795Z",
-    "contributors": [
-      "untilbit",
-      "Tlauipil"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Stmt_after_return": {
-    "modified": "2020-03-12T19:46:14.065Z",
-    "contributors": [
-      "WCHARRIERE",
-      "NanoSpicer",
-      "marco_Lozano"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Strict_y_parámetros_complejos": {
+  "Web/JavaScript/Reference/Errors/Strict_Non_Simple_Params": {
     "modified": "2020-08-31T05:09:49.990Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Reference/Errors/Too_much_recursion": {
-    "modified": "2020-03-12T19:45:04.878Z",
-    "contributors": [
-      "josegarciaclm95"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Undefined_prop": {
-    "modified": "2020-03-12T19:47:46.684Z",
-    "contributors": [
-      "antixsuperstar"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Unexpected_token": {
-    "modified": "2020-03-12T19:46:40.968Z",
-    "contributors": [
-      "dariomaim"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/Unexpected_type": {
-    "modified": "2020-03-12T19:45:53.118Z",
-    "contributors": [
-      "BubuAnabelas",
-      "JaimeNorato"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/caracter_ilegal": {
-    "modified": "2020-03-12T19:47:34.313Z",
-    "contributors": [
-      "kaycdc"
-    ]
-  },
-  "Web/JavaScript/Reference/Errors/in_operator_no_object": {
-    "modified": "2020-03-12T19:47:18.421Z",
-    "contributors": [
-      "presercomp"
-    ]
-  },
-  "Web/JavaScript/Reference/Global_Objects/Proxy/handler": {
-    "modified": "2020-10-15T21:58:11.434Z",
-    "contributors": [
-      "fscholz"
-    ]
-  },
-  "Web/JavaScript/Reference/Global_Objects/Proxy/handler/getOwnPropertyDescriptor": {
+  "Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/getOwnPropertyDescriptor": {
     "modified": "2020-10-15T21:58:10.848Z",
     "contributors": [
       "tutugordillo"
     ]
   },
-  "Web/JavaScript/Reference/Global_Objects/Proxy/handler/set": {
+  "Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/set": {
     "modified": "2020-10-15T21:58:32.473Z",
     "contributors": [
       "tutugordillo"
     ]
   },
-  "Web/JavaScript/Reference/Global_Objects/RangeError": {
-    "modified": "2019-03-23T22:47:01.907Z",
-    "contributors": [
-      "gfernandez",
-      "fscholz"
-    ]
-  },
-  "Web/JavaScript/Reference/Global_Objects/RangeError/prototype": {
-    "modified": "2019-01-16T21:30:19.248Z",
-    "contributors": [
-      "gfernandez"
-    ]
-  },
-  "Web/JavaScript/Reference/Global_Objects/Reflect": {
-    "modified": "2019-03-18T21:14:43.908Z",
-    "contributors": [
-      "javierlopm",
-      "trofrigo",
-      "lecruz01",
-      "roberbnd",
-      "jameshkramer"
-    ]
-  },
-  "Web/JavaScript/Reference/Global_Objects/Reflect/set": {
-    "modified": "2019-03-23T22:08:25.189Z",
-    "contributors": [
-      "pedro-otero"
-    ]
-  },
-  "Web/JavaScript/Referencia": {
-    "modified": "2020-03-12T19:36:20.902Z",
-    "contributors": [
-      "fscholz",
-      "teoli",
-      "zerospalencia",
-      "Scipion",
-      "ADP13",
-      "DSN_XP",
-      "Talisker",
-      "Sheppy",
-      "Nathymig",
-      "Mgjbot"
-    ]
-  },
-  "Web/JavaScript/Referencia/Acerca_de": {
+  "Web/JavaScript/Reference/About": {
     "modified": "2020-03-12T19:36:12.769Z",
     "contributors": [
       "fscholz",
@@ -18845,7 +18668,7 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Características_Desaprobadas": {
+  "Web/JavaScript/Reference/Deprecated_and_obsolete_features": {
     "modified": "2020-08-12T05:30:59.632Z",
     "contributors": [
       "Nachec",
@@ -18855,13 +18678,40 @@
       "DSN XP"
     ]
   },
-  "Web/JavaScript/Referencia/Características_Desaprobadas/The_legacy_Iterator_protocol": {
+  "Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol": {
     "modified": "2020-03-12T19:42:42.667Z",
     "contributors": [
       "clystian"
     ]
   },
-  "Web/JavaScript/Referencia/Classes": {
+  "Web/JavaScript/Reference/Classes/Public_class_fields": {
+    "modified": "2020-10-15T22:24:11.873Z",
+    "contributors": [
+      "mgg.isco",
+      "carlos.valicenti",
+      "juanarbol"
+    ]
+  },
+  "Web/JavaScript/Reference/Classes/constructor": {
+    "modified": "2020-12-08T22:06:53.151Z",
+    "contributors": [
+      "gonzalopr.94",
+      "Mar.vin.26",
+      "kant",
+      "fscholz",
+      "SphinxKnight",
+      "balboag",
+      "bryanvargas"
+    ]
+  },
+  "Web/JavaScript/Reference/Classes/extends": {
+    "modified": "2020-03-12T19:43:14.828Z",
+    "contributors": [
+      "miguelusque",
+      "PauPeinado"
+    ]
+  },
+  "Web/JavaScript/Reference/Classes": {
     "modified": "2020-08-20T12:39:55.631Z",
     "contributors": [
       "jorendorff-moz",
@@ -18891,40 +18741,13 @@
       "GoToLoop"
     ]
   },
-  "Web/JavaScript/Referencia/Classes/Class_fields": {
-    "modified": "2020-10-15T22:24:11.873Z",
-    "contributors": [
-      "mgg.isco",
-      "carlos.valicenti",
-      "juanarbol"
-    ]
-  },
-  "Web/JavaScript/Referencia/Classes/Private_class_fields": {
+  "Web/JavaScript/Reference/Classes/Private_class_fields": {
     "modified": "2020-10-15T22:33:54.045Z",
     "contributors": [
       "aronvx"
     ]
   },
-  "Web/JavaScript/Referencia/Classes/constructor": {
-    "modified": "2020-12-08T22:06:53.151Z",
-    "contributors": [
-      "gonzalopr.94",
-      "Mar.vin.26",
-      "kant",
-      "fscholz",
-      "SphinxKnight",
-      "balboag",
-      "bryanvargas"
-    ]
-  },
-  "Web/JavaScript/Referencia/Classes/extends": {
-    "modified": "2020-03-12T19:43:14.828Z",
-    "contributors": [
-      "miguelusque",
-      "PauPeinado"
-    ]
-  },
-  "Web/JavaScript/Referencia/Classes/static": {
+  "Web/JavaScript/Reference/Classes/static": {
     "modified": "2020-03-12T19:41:02.475Z",
     "contributors": [
       "mizhac",
@@ -18934,27 +18757,37 @@
       "MauroEldritch"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones": {
-    "modified": "2020-03-12T19:37:38.529Z",
+  "Web/JavaScript/Reference/Functions/arguments/callee": {
+    "modified": "2020-03-12T19:37:01.881Z",
     "contributors": [
-      "ricardosikic",
-      "JoseHernan",
-      "sergioqa123",
-      "DavidGalvis",
-      "miguelitolaparra",
-      "FranciscoCastle",
-      "SantiagoHdez",
-      "arai",
-      "estebancito",
-      "hugoatenco",
-      "mishelashala",
+      "fscholz",
       "teoli",
-      "javiertarrio",
-      "Nathymig",
-      "Sheppy"
+      "Mgjbot",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Functions/arguments": {
+    "modified": "2020-10-15T21:08:39.471Z",
+    "contributors": [
+      "Nachec",
+      "gorydev",
+      "AlePerez92",
+      "oblomobka",
+      "teoli",
+      "DeiberChacon",
+      "leopic",
+      "Mgjbot",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Functions/arguments/length": {
+    "modified": "2020-03-12T19:44:25.066Z",
+    "contributors": [
+      "hmorv",
+      "NestorAlbelo"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones/Arrow_functions": {
+  "Web/JavaScript/Reference/Functions/Arrow_functions": {
     "modified": "2020-10-15T21:39:05.489Z",
     "contributors": [
       "Nachec",
@@ -18975,65 +18808,55 @@
       "davecarter"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones/Method_definitions": {
-    "modified": "2020-03-12T19:44:13.294Z",
-    "contributors": [
-      "Grijander81"
-    ]
-  },
-  "Web/JavaScript/Referencia/Funciones/Parametros_por_defecto": {
-    "modified": "2020-10-15T21:39:27.233Z",
-    "contributors": [
-      "Nachec",
-      "SphinxKnight",
-      "danielsalgadop",
-      "pancheps"
-    ]
-  },
-  "Web/JavaScript/Referencia/Funciones/arguments": {
-    "modified": "2020-10-15T21:08:39.471Z",
+  "Web/JavaScript/Reference/Functions/get": {
+    "modified": "2020-03-12T19:37:59.268Z",
     "contributors": [
-      "Nachec",
-      "gorydev",
-      "AlePerez92",
-      "oblomobka",
+      "ramadis",
+      "DarkScarbo",
+      "MarkelCuesta",
+      "fscholz",
       "teoli",
-      "DeiberChacon",
-      "leopic",
-      "Mgjbot",
-      "Talisker"
+      "carloshs92",
+      "jesanchez",
+      "ccarruitero"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones/arguments/callee": {
-    "modified": "2020-03-12T19:37:01.881Z",
+  "Web/JavaScript/Reference/Functions": {
+    "modified": "2020-03-12T19:37:38.529Z",
     "contributors": [
-      "fscholz",
+      "ricardosikic",
+      "JoseHernan",
+      "sergioqa123",
+      "DavidGalvis",
+      "miguelitolaparra",
+      "FranciscoCastle",
+      "SantiagoHdez",
+      "arai",
+      "estebancito",
+      "hugoatenco",
+      "mishelashala",
       "teoli",
-      "Mgjbot",
-      "Talisker"
+      "javiertarrio",
+      "Nathymig",
+      "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones/arguments/length": {
-    "modified": "2020-03-12T19:44:25.066Z",
+  "Web/JavaScript/Reference/Functions/Method_definitions": {
+    "modified": "2020-03-12T19:44:13.294Z",
     "contributors": [
-      "hmorv",
-      "NestorAlbelo"
+      "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones/get": {
-    "modified": "2020-03-12T19:37:59.268Z",
+  "Web/JavaScript/Reference/Functions/Default_parameters": {
+    "modified": "2020-10-15T21:39:27.233Z",
     "contributors": [
-      "ramadis",
-      "DarkScarbo",
-      "MarkelCuesta",
-      "fscholz",
-      "teoli",
-      "carloshs92",
-      "jesanchez",
-      "ccarruitero"
+      "Nachec",
+      "SphinxKnight",
+      "danielsalgadop",
+      "pancheps"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones/parametros_rest": {
+  "Web/JavaScript/Reference/Functions/rest_parameters": {
     "modified": "2020-08-05T19:22:32.660Z",
     "contributors": [
       "paching12",
@@ -19046,7 +18869,7 @@
       "mikicegal14"
     ]
   },
-  "Web/JavaScript/Referencia/Funciones/set": {
+  "Web/JavaScript/Reference/Functions/set": {
     "modified": "2020-10-20T12:54:09.106Z",
     "contributors": [
       "alejandro.fca",
@@ -19054,21 +18877,36 @@
       "DavidBernal"
     ]
   },
-  "Web/JavaScript/Referencia/Gramatica_lexica": {
+  "Web/JavaScript/Reference/Lexical_grammar": {
     "modified": "2020-10-15T22:24:10.289Z",
     "contributors": [
       "Nachec",
       "fitojb"
     ]
   },
-  "Web/JavaScript/Referencia/Iteration_protocols": {
+  "Web/JavaScript/Reference": {
+    "modified": "2020-03-12T19:36:20.902Z",
+    "contributors": [
+      "fscholz",
+      "teoli",
+      "zerospalencia",
+      "Scipion",
+      "ADP13",
+      "DSN_XP",
+      "Talisker",
+      "Sheppy",
+      "Nathymig",
+      "Mgjbot"
+    ]
+  },
+  "Web/JavaScript/Reference/Iteration_protocols": {
     "modified": "2020-03-12T19:41:22.496Z",
     "contributors": [
       "SphinxKnight",
       "oagarcia"
     ]
   },
-  "Web/JavaScript/Referencia/Modo_estricto": {
+  "Web/JavaScript/Reference/Strict_mode": {
     "modified": "2020-08-30T21:51:49.146Z",
     "contributors": [
       "Nachec",
@@ -19090,89 +18928,32 @@
       "seeker8"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales": {
-    "modified": "2020-03-12T19:36:16.167Z",
-    "contributors": [
-      "Jethrotul",
-      "yohanolmedo",
-      "JoseGB",
-      "lajaso",
-      "Imvi10",
-      "chavesrdj",
-      "SphinxKnight",
-      "teoli",
-      "KENARKI",
-      "chebit",
-      "ethertank",
-      "Garf",
-      "tiangolo",
-      "Sheppy",
-      "Nathymig",
-      "Mgjbot"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/AggregateError": {
+  "Web/JavaScript/Reference/Global_Objects/AggregateError": {
     "modified": "2020-10-15T22:31:08.318Z",
     "contributors": [
       "Nachec",
       "Gardeky"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array": {
-    "modified": "2020-12-13T21:16:28.670Z",
-    "contributors": [
-      "SamuelOuteda",
-      "JotaCé",
-      "Daniel1404",
-      "MartinCJ08",
-      "lorenzo-sc",
-      "Pagua",
-      "Marito10",
-      "lajaso",
-      "AlePerez92",
-      "patoezequiel",
-      "FranciscoCastle",
-      "Pulits",
-      "Th3Cod3",
-      "rec",
-      "BubuAnabelas",
-      "abaracedo",
-      "Pablo_Bangueses",
-      "gfernandez",
-      "davegomez",
-      "viartola",
-      "Albizures",
-      "germanio",
-      "a0viedo",
-      "teoli",
-      "LuisArt",
-      "Nukeador",
-      "ADP13",
-      "Errepunto",
-      "Sheppy",
-      "Nathymig",
-      "Mgjbot"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/@@iterator": {
+  "Web/JavaScript/Reference/Global_Objects/Array/@@iterator": {
     "modified": "2020-10-15T22:06:23.853Z",
     "contributors": [
       "lajaso"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/@@species": {
+  "Web/JavaScript/Reference/Global_Objects/Array/@@species": {
     "modified": "2020-10-15T22:07:11.429Z",
     "contributors": [
       "lajaso"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/@@unscopables": {
+  "Web/JavaScript/Reference/Global_Objects/Array/@@unscopables": {
     "modified": "2020-10-15T22:04:47.805Z",
     "contributors": [
       "lajaso"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/concat": {
+  "Web/JavaScript/Reference/Global_Objects/Array/concat": {
     "modified": "2020-10-15T21:38:20.137Z",
     "contributors": [
       "AlePerez92",
@@ -19184,7 +18965,7 @@
       "gonzalog"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/copyWithin": {
+  "Web/JavaScript/Reference/Global_Objects/Array/copyWithin": {
     "modified": "2020-10-15T21:46:52.733Z",
     "contributors": [
       "lajaso",
@@ -19193,7 +18974,7 @@
       "eljonims"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/entries": {
+  "Web/JavaScript/Reference/Global_Objects/Array/entries": {
     "modified": "2020-10-15T21:45:28.326Z",
     "contributors": [
       "lajaso",
@@ -19201,7 +18982,7 @@
       "imNicoSuarez"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/every": {
+  "Web/JavaScript/Reference/Global_Objects/Array/every": {
     "modified": "2020-10-15T21:38:36.565Z",
     "contributors": [
       "camsa",
@@ -19212,7 +18993,7 @@
       "vltamara"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/fill": {
+  "Web/JavaScript/Reference/Global_Objects/Array/fill": {
     "modified": "2020-10-15T21:37:55.734Z",
     "contributors": [
       "camsa",
@@ -19223,7 +19004,7 @@
       "cesarve77"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/filter": {
+  "Web/JavaScript/Reference/Global_Objects/Array/filter": {
     "modified": "2020-12-14T06:55:37.970Z",
     "contributors": [
       "Adil_Casamayor_Silvar",
@@ -19245,7 +19026,7 @@
       "matajm"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/find": {
+  "Web/JavaScript/Reference/Global_Objects/Array/find": {
     "modified": "2020-10-15T21:37:55.410Z",
     "contributors": [
       "AlePerez92",
@@ -19256,7 +19037,7 @@
       "alo5"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/findIndex": {
+  "Web/JavaScript/Reference/Global_Objects/Array/findIndex": {
     "modified": "2020-10-15T21:46:40.264Z",
     "contributors": [
       "AlePerez92",
@@ -19266,7 +19047,7 @@
       "andrpueb"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/flat": {
+  "Web/JavaScript/Reference/Global_Objects/Array/flat": {
     "modified": "2020-10-15T22:04:41.717Z",
     "contributors": [
       "amarin95",
@@ -19276,7 +19057,7 @@
       "lajaso"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/flatMap": {
+  "Web/JavaScript/Reference/Global_Objects/Array/flatMap": {
     "modified": "2020-10-15T22:04:40.380Z",
     "contributors": [
       "alejandro.figuera",
@@ -19284,7 +19065,7 @@
       "lajaso"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/forEach": {
+  "Web/JavaScript/Reference/Global_Objects/Array/forEach": {
     "modified": "2020-10-15T21:25:13.328Z",
     "contributors": [
       "maximocapital",
@@ -19304,7 +19085,7 @@
       "elfoxero"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/from": {
+  "Web/JavaScript/Reference/Global_Objects/Array/from": {
     "modified": "2020-10-15T21:41:11.903Z",
     "contributors": [
       "AlePerez92",
@@ -19315,7 +19096,7 @@
       "thzunder"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/includes": {
+  "Web/JavaScript/Reference/Global_Objects/Array/includes": {
     "modified": "2020-10-15T21:41:08.738Z",
     "contributors": [
       "emilianot",
@@ -19329,7 +19110,43 @@
       "DRayX"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/indexOf": {
+  "Web/JavaScript/Reference/Global_Objects/Array": {
+    "modified": "2020-12-13T21:16:28.670Z",
+    "contributors": [
+      "SamuelOuteda",
+      "JotaCé",
+      "Daniel1404",
+      "MartinCJ08",
+      "lorenzo-sc",
+      "Pagua",
+      "Marito10",
+      "lajaso",
+      "AlePerez92",
+      "patoezequiel",
+      "FranciscoCastle",
+      "Pulits",
+      "Th3Cod3",
+      "rec",
+      "BubuAnabelas",
+      "abaracedo",
+      "Pablo_Bangueses",
+      "gfernandez",
+      "davegomez",
+      "viartola",
+      "Albizures",
+      "germanio",
+      "a0viedo",
+      "teoli",
+      "LuisArt",
+      "Nukeador",
+      "ADP13",
+      "Errepunto",
+      "Sheppy",
+      "Nathymig",
+      "Mgjbot"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Array/indexOf": {
     "modified": "2020-10-15T21:21:34.369Z",
     "contributors": [
       "ChristianMarca",
@@ -19341,7 +19158,7 @@
       "AntonioNavajas"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/isArray": {
+  "Web/JavaScript/Reference/Global_Objects/Array/isArray": {
     "modified": "2020-10-15T21:36:49.146Z",
     "contributors": [
       "lajaso",
@@ -19351,7 +19168,7 @@
       "EddieV1"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/join": {
+  "Web/JavaScript/Reference/Global_Objects/Array/join": {
     "modified": "2020-10-15T21:37:05.645Z",
     "contributors": [
       "lajaso",
@@ -19359,14 +19176,14 @@
       "davegomez"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/keys": {
+  "Web/JavaScript/Reference/Global_Objects/Array/keys": {
     "modified": "2020-10-15T21:46:47.383Z",
     "contributors": [
       "lajaso",
       "eljonims"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/lastIndexOf": {
+  "Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf": {
     "modified": "2020-10-15T21:44:42.909Z",
     "contributors": [
       "luchosr",
@@ -19375,7 +19192,7 @@
       "cesiztel"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/length": {
+  "Web/JavaScript/Reference/Global_Objects/Array/length": {
     "modified": "2020-10-15T21:36:04.137Z",
     "contributors": [
       "lajaso",
@@ -19384,7 +19201,7 @@
       "martinweingart"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/map": {
+  "Web/JavaScript/Reference/Global_Objects/Array/map": {
     "modified": "2019-07-29T10:38:41.705Z",
     "contributors": [
       "AndCotOli",
@@ -19398,7 +19215,7 @@
       "fcomabella"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/of": {
+  "Web/JavaScript/Reference/Global_Objects/Array/of": {
     "modified": "2020-10-15T21:39:43.805Z",
     "contributors": [
       "lajaso",
@@ -19408,7 +19225,7 @@
       "adelamata"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/pop": {
+  "Web/JavaScript/Reference/Global_Objects/Array/pop": {
     "modified": "2020-10-15T21:34:39.833Z",
     "contributors": [
       "AlePerez92",
@@ -19420,14 +19237,14 @@
       "Guitxo"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/prototype": {
+  "orphaned/Web/JavaScript/Reference/Global_Objects/Array/prototype": {
     "modified": "2020-10-15T21:35:31.913Z",
     "contributors": [
       "lajaso",
       "humbertaco"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/push": {
+  "Web/JavaScript/Reference/Global_Objects/Array/push": {
     "modified": "2020-10-15T21:20:34.074Z",
     "contributors": [
       "AlePerez92",
@@ -19439,7 +19256,7 @@
       "mhauptma73"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/reduce": {
+  "Web/JavaScript/Reference/Global_Objects/Array/Reduce": {
     "modified": "2020-10-15T21:16:20.520Z",
     "contributors": [
       "AlePerez92",
@@ -19455,7 +19272,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight": {
+  "Web/JavaScript/Reference/Global_Objects/Array/ReduceRight": {
     "modified": "2019-03-23T23:50:45.331Z",
     "contributors": [
       "fuzzyalej",
@@ -19463,7 +19280,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/reverse": {
+  "Web/JavaScript/Reference/Global_Objects/Array/reverse": {
     "modified": "2020-10-15T21:34:38.313Z",
     "contributors": [
       "AlePerez92",
@@ -19475,7 +19292,7 @@
       "arthusu"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/shift": {
+  "Web/JavaScript/Reference/Global_Objects/Array/shift": {
     "modified": "2020-08-27T12:47:35.128Z",
     "contributors": [
       "AlePerez92",
@@ -19484,7 +19301,7 @@
       "gfernandez"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/slice": {
+  "Web/JavaScript/Reference/Global_Objects/Array/slice": {
     "modified": "2019-03-23T22:52:20.266Z",
     "contributors": [
       "olijyat",
@@ -19499,7 +19316,7 @@
       "oillescas"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/some": {
+  "Web/JavaScript/Reference/Global_Objects/Array/some": {
     "modified": "2020-10-15T21:36:10.705Z",
     "contributors": [
       "AlePerez92",
@@ -19510,7 +19327,7 @@
       "martinweingart"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/sort": {
+  "Web/JavaScript/Reference/Global_Objects/Array/sort": {
     "modified": "2020-10-10T21:23:15.977Z",
     "contributors": [
       "Gardeky",
@@ -19532,7 +19349,7 @@
       "lombareload"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/splice": {
+  "Web/JavaScript/Reference/Global_Objects/Array/splice": {
     "modified": "2020-10-15T21:33:06.435Z",
     "contributors": [
       "AlePerez92",
@@ -19545,20 +19362,20 @@
       "alvarouribe"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/toLocaleString": {
+  "Web/JavaScript/Reference/Global_Objects/Array/toLocaleString": {
     "modified": "2020-10-15T22:10:13.626Z",
     "contributors": [
       "estebanpanelli"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/toSource": {
+  "Web/JavaScript/Reference/Global_Objects/Array/toSource": {
     "modified": "2019-03-23T22:08:25.338Z",
     "contributors": [
       "teoli",
       "pedro-otero"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/toString": {
+  "Web/JavaScript/Reference/Global_Objects/Array/toString": {
     "modified": "2020-10-15T21:37:53.754Z",
     "contributors": [
       "AlePerez92",
@@ -19567,14 +19384,14 @@
       "dgrizzla"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/unshift": {
+  "Web/JavaScript/Reference/Global_Objects/Array/unshift": {
     "modified": "2020-10-15T21:36:39.291Z",
     "contributors": [
       "AlePerez92",
       "elhesuu"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Array/values": {
+  "Web/JavaScript/Reference/Global_Objects/Array/values": {
     "modified": "2020-10-15T21:47:36.548Z",
     "contributors": [
       "AlePerez92",
@@ -19582,36 +19399,35 @@
       "clystian"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer": {
-    "modified": "2020-10-15T21:40:07.554Z",
-    "contributors": [
-      "lajaso",
-      "joseluisq",
-      "mlealvillarreal",
-      "AzazelN28",
-      "tamat"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/@@species": {
+  "Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species": {
     "modified": "2020-10-15T22:05:03.686Z",
     "contributors": [
       "lajaso"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/byteLength": {
+  "Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength": {
     "modified": "2020-10-15T22:05:03.452Z",
     "contributors": [
       "lajaso"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/prototype": {
-    "modified": "2020-10-15T21:51:49.315Z",
+  "Web/JavaScript/Reference/Global_Objects/ArrayBuffer": {
+    "modified": "2020-10-15T21:40:07.554Z",
     "contributors": [
       "lajaso",
-      "AzazelN28"
+      "joseluisq",
+      "mlealvillarreal",
+      "AzazelN28",
+      "tamat"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Boolean/Boolean": {
+    "modified": "2020-10-15T22:33:47.964Z",
+    "contributors": [
+      "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Boolean": {
+  "Web/JavaScript/Reference/Global_Objects/Boolean": {
     "modified": "2020-10-15T21:16:58.681Z",
     "contributors": [
       "Nachec",
@@ -19625,38 +19441,14 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Boolean/Boolean": {
-    "modified": "2020-10-15T22:33:47.964Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Boolean/toSource": {
+  "Web/JavaScript/Reference/Global_Objects/Boolean/toSource": {
     "modified": "2019-09-14T17:25:31.875Z",
     "contributors": [
       "teoli",
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date": {
-    "modified": "2019-10-10T16:53:04.977Z",
-    "contributors": [
-      "wbamberg",
-      "Eduardo_66",
-      "teoli",
-      "Talisker",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/UTC": {
-    "modified": "2019-03-23T23:48:17.886Z",
-    "contributors": [
-      "teoli",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getDate": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getDate": {
     "modified": "2019-03-23T22:47:58.851Z",
     "contributors": [
       "DanielFRB",
@@ -19664,7 +19456,7 @@
       "ycanales"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getDay": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getDay": {
     "modified": "2019-03-23T22:41:58.390Z",
     "contributors": [
       "odelrio",
@@ -19672,7 +19464,7 @@
       "thzunder"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getFullYear": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getFullYear": {
     "modified": "2020-12-12T18:35:30.034Z",
     "contributors": [
       "AlePerez92",
@@ -19680,38 +19472,38 @@
       "Guitxo"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getHours": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getHours": {
     "modified": "2019-03-23T22:25:54.207Z",
     "contributors": [
       "davElsanto"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getMilliseconds": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds": {
     "modified": "2019-03-23T22:19:54.449Z",
     "contributors": [
       "Undre4m"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getMinutes": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getMinutes": {
     "modified": "2019-03-23T22:50:56.451Z",
     "contributors": [
       "jezdez",
       "jorgeLightwave"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getMonth": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getMonth": {
     "modified": "2019-03-23T22:51:30.861Z",
     "contributors": [
       "cristobalramos"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getSeconds": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getSeconds": {
     "modified": "2020-10-15T22:04:39.573Z",
     "contributors": [
       "AlePerez92"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getTime": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getTime": {
     "modified": "2020-10-18T16:10:45.747Z",
     "contributors": [
       "feliperomero3",
@@ -19719,19 +19511,30 @@
       "Marttharomero"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getUTCFullYear": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear": {
     "modified": "2019-03-23T22:20:31.228Z",
     "contributors": [
       "e.g.m.g."
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/getUTCHours": {
+  "Web/JavaScript/Reference/Global_Objects/Date/getUTCHours": {
     "modified": "2019-03-23T22:23:56.170Z",
     "contributors": [
       "eltrikiman"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/now": {
+  "Web/JavaScript/Reference/Global_Objects/Date": {
+    "modified": "2019-10-10T16:53:04.977Z",
+    "contributors": [
+      "wbamberg",
+      "Eduardo_66",
+      "teoli",
+      "Talisker",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Date/now": {
     "modified": "2019-03-23T23:48:17.746Z",
     "contributors": [
       "teoli",
@@ -19739,38 +19542,32 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/parse": {
+  "Web/JavaScript/Reference/Global_Objects/Date/parse": {
     "modified": "2019-03-23T23:48:18.384Z",
     "contributors": [
       "teoli",
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/prototype": {
-    "modified": "2019-03-23T23:11:22.072Z",
-    "contributors": [
-      "teoli"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/setFullYear": {
+  "Web/JavaScript/Reference/Global_Objects/Date/setFullYear": {
     "modified": "2019-03-23T22:20:28.916Z",
     "contributors": [
       "e.g.m.g."
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/setMonth": {
+  "Web/JavaScript/Reference/Global_Objects/Date/setMonth": {
     "modified": "2020-10-15T22:26:32.061Z",
     "contributors": [
       "mavega998"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/toDateString": {
+  "Web/JavaScript/Reference/Global_Objects/Date/toDateString": {
     "modified": "2020-10-15T22:00:03.156Z",
     "contributors": [
       "thisisalexis"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/toISOString": {
+  "Web/JavaScript/Reference/Global_Objects/Date/toISOString": {
     "modified": "2020-10-18T16:02:20.913Z",
     "contributors": [
       "feliperomero3",
@@ -19781,106 +19578,171 @@
       "developingo"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/toJSON": {
+  "Web/JavaScript/Reference/Global_Objects/Date/toJSON": {
     "modified": "2020-10-15T22:34:58.674Z",
     "contributors": [
       "w3pdsoft"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleDateString": {
+  "Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString": {
     "modified": "2020-10-15T22:26:52.505Z",
     "contributors": [
       "AntonioM."
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleString": {
+  "Web/JavaScript/Reference/Global_Objects/Date/toLocaleString": {
     "modified": "2020-10-15T22:28:03.714Z",
     "contributors": [
       "jestebans",
       "Juanpredev"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleTimeString": {
+  "Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString": {
     "modified": "2020-10-15T22:28:25.409Z",
     "contributors": [
       "antixsuperstar"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Date/toUTCString": {
+  "Web/JavaScript/Reference/Global_Objects/Date/toUTCString": {
     "modified": "2020-10-15T22:26:46.954Z",
     "contributors": [
       "batik"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error": {
-    "modified": "2020-10-15T21:17:01.621Z",
+  "Web/JavaScript/Reference/Global_Objects/Date/UTC": {
+    "modified": "2019-03-23T23:48:17.886Z",
     "contributors": [
-      "Nachec",
-      "akadoshin",
-      "gfernandez",
       "teoli",
-      "Talisker",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/decodeURI": {
+    "modified": "2020-03-12T19:36:57.753Z",
+    "contributors": [
+      "teoli",
+      "SphinxKnight",
+      "ADP13",
       "Mgjbot",
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/constructor_Error": {
+  "Web/JavaScript/Reference/Global_Objects/decodeURIComponent": {
+    "modified": "2020-03-12T19:37:00.546Z",
+    "contributors": [
+      "jabarrioss",
+      "SphinxKnight",
+      "teoli",
+      "ADP13",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/encodeURI": {
+    "modified": "2020-03-12T19:36:55.391Z",
+    "contributors": [
+      "espipj",
+      "SphinxKnight",
+      "teoli",
+      "ADP13",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/encodeURIComponent": {
+    "modified": "2020-03-12T19:37:33.179Z",
+    "contributors": [
+      "jazjay",
+      "SphinxKnight",
+      "teoli",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Error/Error": {
     "modified": "2020-10-15T22:33:54.309Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/fileName": {
+  "Web/JavaScript/Reference/Global_Objects/Error/fileName": {
     "modified": "2020-10-15T22:33:52.450Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/lineNumber": {
+  "Web/JavaScript/Reference/Global_Objects/Error": {
+    "modified": "2020-10-15T21:17:01.621Z",
+    "contributors": [
+      "Nachec",
+      "akadoshin",
+      "gfernandez",
+      "teoli",
+      "Talisker",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Error/lineNumber": {
     "modified": "2019-03-23T22:44:34.178Z",
     "contributors": [
       "KikinRdz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/message": {
+  "Web/JavaScript/Reference/Global_Objects/Error/message": {
     "modified": "2019-03-23T22:31:48.655Z",
     "contributors": [
       "RiazaValverde"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/name": {
+  "Web/JavaScript/Reference/Global_Objects/Error/name": {
     "modified": "2020-10-15T21:51:31.702Z",
     "contributors": [
       "Nachec",
       "Bumxu"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/prototype": {
-    "modified": "2019-03-23T22:31:40.887Z",
-    "contributors": [
-      "RiazaValverde"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/toSource": {
+  "Web/JavaScript/Reference/Global_Objects/Error/toSource": {
     "modified": "2020-10-15T22:33:54.410Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Error/toString": {
+  "Web/JavaScript/Reference/Global_Objects/Error/toString": {
     "modified": "2020-10-15T22:33:57.174Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/EvalError": {
+  "Web/JavaScript/Reference/Global_Objects/escape": {
+    "modified": "2020-10-15T21:56:14.356Z",
+    "contributors": [
+      "SphinxKnight",
+      "RozyP",
+      "IXTRUnai"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/eval": {
+    "modified": "2020-03-12T19:37:01.878Z",
+    "contributors": [
+      "driera",
+      "sergio_p_d",
+      "_cuco_",
+      "ericmartinezr",
+      "SphinxKnight",
+      "teoli",
+      "Mgjbot",
+      "Talisker",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/EvalError": {
     "modified": "2020-08-30T20:35:42.248Z",
     "contributors": [
       "YHWHSGP88",
       "Undre4m"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Funcionesasíncronas": {
+  "Web/JavaScript/Reference/Global_Objects/AsyncFunction": {
     "modified": "2020-10-15T22:06:23.441Z",
     "contributors": [
       "akacoronel",
@@ -19888,26 +19750,7 @@
       "miguelrijo"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function": {
-    "modified": "2020-10-15T21:14:31.534Z",
-    "contributors": [
-      "Nachec",
-      "Tzikin100",
-      "teoli",
-      "ethertank",
-      "Skorney",
-      "ADP13",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/Función": {
-    "modified": "2020-10-15T22:33:51.294Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/apply": {
+  "Web/JavaScript/Reference/Global_Objects/Function/apply": {
     "modified": "2019-03-23T23:31:02.682Z",
     "contributors": [
       "AdrianSkar",
@@ -19924,7 +19767,7 @@
       "gtoroap"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/arguments": {
+  "Web/JavaScript/Reference/Global_Objects/Function/arguments": {
     "modified": "2019-03-23T23:48:35.727Z",
     "contributors": [
       "teoli",
@@ -19932,7 +19775,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/bind": {
+  "Web/JavaScript/Reference/Global_Objects/Function/bind": {
     "modified": "2019-03-23T23:02:28.323Z",
     "contributors": [
       "Imvi10",
@@ -19944,7 +19787,7 @@
       "cobogt"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/call": {
+  "Web/JavaScript/Reference/Global_Objects/Function/call": {
     "modified": "2020-11-13T21:36:49.496Z",
     "contributors": [
       "alejandro.fca",
@@ -19954,20 +19797,39 @@
       "bluesky777"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/caller": {
+  "Web/JavaScript/Reference/Global_Objects/Function/caller": {
     "modified": "2019-03-23T22:52:58.734Z",
     "contributors": [
       "DavidBernal",
       "fabianlucena"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/displayName": {
+  "Web/JavaScript/Reference/Global_Objects/Function/displayName": {
     "modified": "2020-10-15T21:59:29.332Z",
     "contributors": [
       "juliandavidmr"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/length": {
+  "Web/JavaScript/Reference/Global_Objects/Function/Function": {
+    "modified": "2020-10-15T22:33:51.294Z",
+    "contributors": [
+      "Nachec"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Function": {
+    "modified": "2020-10-15T21:14:31.534Z",
+    "contributors": [
+      "Nachec",
+      "Tzikin100",
+      "teoli",
+      "ethertank",
+      "Skorney",
+      "ADP13",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Function/length": {
     "modified": "2020-02-10T13:03:52.789Z",
     "contributors": [
       "kant",
@@ -19975,7 +19837,7 @@
       "HyMaN"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/name": {
+  "Web/JavaScript/Reference/Global_Objects/Function/name": {
     "modified": "2019-03-18T20:38:56.122Z",
     "contributors": [
       "SunWithIssues",
@@ -19984,31 +19846,20 @@
       "jorgecasar"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/prototype": {
-    "modified": "2019-03-23T23:53:55.022Z",
-    "contributors": [
-      "mcardozo",
-      "teoli",
-      "shaggyrd",
-      "Mgjbot",
-      "Wrongloop",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/toSource": {
+  "Web/JavaScript/Reference/Global_Objects/Function/toSource": {
     "modified": "2019-03-23T22:42:12.644Z",
     "contributors": [
       "teoli",
       "gpdiaz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Function/toString": {
+  "Web/JavaScript/Reference/Global_Objects/Function/toString": {
     "modified": "2019-03-23T22:31:32.582Z",
     "contributors": [
       "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Generador": {
+  "Web/JavaScript/Reference/Global_Objects/Generator": {
     "modified": "2020-09-30T15:33:08.419Z",
     "contributors": [
       "alejandro.fca",
@@ -20017,25 +19868,46 @@
       "nicolasolmos"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Generador/next": {
+  "Web/JavaScript/Reference/Global_Objects/Generator/next": {
     "modified": "2020-10-15T22:03:24.006Z",
     "contributors": [
       "DJphilomath"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Generador/return": {
+  "Web/JavaScript/Reference/Global_Objects/Generator/return": {
     "modified": "2020-10-15T22:03:25.741Z",
     "contributors": [
       "DJphilomath"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Generador/throw": {
+  "Web/JavaScript/Reference/Global_Objects/Generator/throw": {
     "modified": "2020-10-15T22:03:23.876Z",
     "contributors": [
       "DJphilomath"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Infinity": {
+  "Web/JavaScript/Reference/Global_Objects": {
+    "modified": "2020-03-12T19:36:16.167Z",
+    "contributors": [
+      "Jethrotul",
+      "yohanolmedo",
+      "JoseGB",
+      "lajaso",
+      "Imvi10",
+      "chavesrdj",
+      "SphinxKnight",
+      "teoli",
+      "KENARKI",
+      "chebit",
+      "ethertank",
+      "Garf",
+      "tiangolo",
+      "Sheppy",
+      "Nathymig",
+      "Mgjbot"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Infinity": {
     "modified": "2020-03-12T19:36:58.042Z",
     "contributors": [
       "SphinxKnight",
@@ -20046,19 +19918,19 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/InternalError": {
-    "modified": "2020-10-15T22:33:54.342Z",
+  "Web/JavaScript/Reference/Global_Objects/InternalError/InternalError": {
+    "modified": "2020-10-15T22:33:52.933Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/InternalError/Constructor_InternalError": {
-    "modified": "2020-10-15T22:33:52.933Z",
+  "Web/JavaScript/Reference/Global_Objects/InternalError": {
+    "modified": "2020-10-15T22:33:54.342Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Intl": {
+  "Web/JavaScript/Reference/Global_Objects/Intl": {
     "modified": "2020-10-15T21:58:20.138Z",
     "contributors": [
       "LucasDeFarias",
@@ -20066,28 +19938,49 @@
       "puentesdiaz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat": {
-    "modified": "2020-10-15T21:29:49.289Z",
+  "Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format": {
+    "modified": "2020-10-15T22:26:32.434Z",
     "contributors": [
       "fscholz",
-      "IsraelFloresDGA",
-      "eespitia.rea"
+      "Daniel7Byte"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat/format": {
-    "modified": "2020-10-15T22:26:32.434Z",
+  "Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat": {
+    "modified": "2020-10-15T21:29:49.289Z",
     "contributors": [
       "fscholz",
-      "Daniel7Byte"
+      "IsraelFloresDGA",
+      "eespitia.rea"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Intl/RelativeTimeFormat": {
+  "Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat": {
     "modified": "2020-10-15T22:33:27.123Z",
     "contributors": [
       "midudev"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/JSON": {
+  "Web/JavaScript/Reference/Global_Objects/isFinite": {
+    "modified": "2020-03-12T19:37:31.231Z",
+    "contributors": [
+      "SphinxKnight",
+      "teoli",
+      "jarneygm",
+      "Mgjbot",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/isNaN": {
+    "modified": "2020-10-15T21:17:00.242Z",
+    "contributors": [
+      "jmmarco",
+      "juanarbol",
+      "SphinxKnight",
+      "teoli",
+      "Mgjbot",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/JSON": {
     "modified": "2020-09-19T17:44:12.200Z",
     "contributors": [
       "cristian.valdivieso",
@@ -20100,7 +19993,7 @@
       "fscholz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/JSON/parse": {
+  "Web/JavaScript/Reference/Global_Objects/JSON/parse": {
     "modified": "2019-03-23T23:09:22.011Z",
     "contributors": [
       "bufalo1973",
@@ -20110,7 +20003,7 @@
       "PepeBeat"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/JSON/stringify": {
+  "Web/JavaScript/Reference/Global_Objects/JSON/stringify": {
     "modified": "2020-10-15T21:26:39.053Z",
     "contributors": [
       "AlePerez92",
@@ -20128,46 +20021,26 @@
       "carlosgctes"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map": {
-    "modified": "2020-10-15T21:30:28.950Z",
-    "contributors": [
-      "Almiqui",
-      "AntonioSalazar",
-      "SphinxKnight",
-      "Sebastiancbvz",
-      "vaavJSdev",
-      "timgivois",
-      "aeroxmotion",
-      "PepeAleu",
-      "xavier.gallofre",
-      "rn3w",
-      "Grijander81",
-      "GustavoFernandez",
-      "rec",
-      "Kouen",
-      "facundoj"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/clear": {
+  "Web/JavaScript/Reference/Global_Objects/Map/clear": {
     "modified": "2019-03-23T22:33:57.332Z",
     "contributors": [
       "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/delete": {
+  "Web/JavaScript/Reference/Global_Objects/Map/delete": {
     "modified": "2019-06-22T21:43:58.894Z",
     "contributors": [
       "gerardonavart",
       "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/entries": {
+  "Web/JavaScript/Reference/Global_Objects/Map/entries": {
     "modified": "2019-03-23T22:33:46.712Z",
     "contributors": [
       "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/forEach": {
+  "Web/JavaScript/Reference/Global_Objects/Map/forEach": {
     "modified": "2020-10-15T21:59:58.539Z",
     "contributors": [
       "gerardonavart",
@@ -20175,125 +20048,64 @@
       "katuno1981"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/get": {
+  "Web/JavaScript/Reference/Global_Objects/Map/get": {
     "modified": "2020-10-15T22:01:57.424Z",
     "contributors": [
       "Marte",
       "Sebastiancbvz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/has": {
+  "Web/JavaScript/Reference/Global_Objects/Map/has": {
     "modified": "2020-10-15T22:32:18.735Z",
     "contributors": [
       "fredydeltoro"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/keys": {
-    "modified": "2019-03-23T22:31:40.425Z",
+  "Web/JavaScript/Reference/Global_Objects/Map": {
+    "modified": "2020-10-15T21:30:28.950Z",
     "contributors": [
-      "jesusfchavarro"
+      "Almiqui",
+      "AntonioSalazar",
+      "SphinxKnight",
+      "Sebastiancbvz",
+      "vaavJSdev",
+      "timgivois",
+      "aeroxmotion",
+      "PepeAleu",
+      "xavier.gallofre",
+      "rn3w",
+      "Grijander81",
+      "GustavoFernandez",
+      "rec",
+      "Kouen",
+      "facundoj"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/prototype": {
-    "modified": "2019-03-23T22:06:29.334Z",
+  "Web/JavaScript/Reference/Global_Objects/Map/keys": {
+    "modified": "2019-03-23T22:31:40.425Z",
     "contributors": [
-      "JuanMacias"
+      "jesusfchavarro"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/set": {
+  "Web/JavaScript/Reference/Global_Objects/Map/set": {
     "modified": "2019-03-23T22:28:28.999Z",
     "contributors": [
       "guillermojmc"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/size": {
+  "Web/JavaScript/Reference/Global_Objects/Map/size": {
     "modified": "2019-03-23T22:34:02.057Z",
     "contributors": [
       "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Map/values": {
+  "Web/JavaScript/Reference/Global_Objects/Map/values": {
     "modified": "2020-10-15T22:12:33.830Z",
     "contributors": [
       "AlePerez92"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math": {
-    "modified": "2020-10-15T21:17:08.782Z",
-    "contributors": [
-      "RomnSD",
-      "Pedro-vk",
-      "lajaso",
-      "Enesimus",
-      "maxbalter",
-      "raecillacastellana",
-      "mrajente47",
-      "enesimo",
-      "Jaston",
-      "AugustoEsquen",
-      "teoli",
-      "ethertank",
-      "Talisker",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/E": {
-    "modified": "2020-10-15T21:21:06.485Z",
-    "contributors": [
-      "lajaso",
-      "teoli",
-      "jessest"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/LN10": {
-    "modified": "2020-10-15T21:21:04.066Z",
-    "contributors": [
-      "lajaso",
-      "teoli",
-      "jessest"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/LN2": {
-    "modified": "2020-10-15T21:21:06.933Z",
-    "contributors": [
-      "lajaso",
-      "teoli",
-      "jessest"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/LOG10E": {
-    "modified": "2019-03-23T22:21:51.531Z",
-    "contributors": [
-      "aocodermx"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/LOG2E": {
-    "modified": "2019-03-23T23:35:28.496Z",
-    "contributors": [
-      "teoli",
-      "jessest"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/PI": {
-    "modified": "2019-03-23T22:21:48.729Z",
-    "contributors": [
-      "aocodermx"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/SQRT1_2": {
-    "modified": "2019-03-23T22:22:44.049Z",
-    "contributors": [
-      "aocodermx"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/SQRT2": {
-    "modified": "2019-03-23T22:18:15.216Z",
-    "contributors": [
-      "geradrum"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/abs": {
+  "Web/JavaScript/Reference/Global_Objects/Math/abs": {
     "modified": "2019-10-29T19:51:46.768Z",
     "contributors": [
       "jaomix1",
@@ -20301,56 +20113,56 @@
       "Sotelio"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/acos": {
+  "Web/JavaScript/Reference/Global_Objects/Math/acos": {
     "modified": "2020-10-15T21:58:17.630Z",
     "contributors": [
       "Enesimus"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/acosh": {
+  "Web/JavaScript/Reference/Global_Objects/Math/acosh": {
     "modified": "2020-10-15T21:59:09.931Z",
     "contributors": [
       "nickobre",
       "Enesimus"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/asin": {
+  "Web/JavaScript/Reference/Global_Objects/Math/asin": {
     "modified": "2019-03-23T22:11:21.124Z",
     "contributors": [
       "hckt"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/asinh": {
+  "Web/JavaScript/Reference/Global_Objects/Math/asinh": {
     "modified": "2020-10-15T22:00:15.403Z",
     "contributors": [
       "josegarciamanez"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/atan": {
+  "Web/JavaScript/Reference/Global_Objects/Math/atan": {
     "modified": "2020-10-15T22:02:19.566Z",
     "contributors": [
       "alejocas"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/atan2": {
+  "Web/JavaScript/Reference/Global_Objects/Math/atan2": {
     "modified": "2019-03-23T22:52:46.887Z",
     "contributors": [
       "maik10s"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/atanh": {
+  "Web/JavaScript/Reference/Global_Objects/Math/atanh": {
     "modified": "2020-11-01T00:27:58.552Z",
     "contributors": [
       "carlitosnu41"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/cbrt": {
+  "Web/JavaScript/Reference/Global_Objects/Math/cbrt": {
     "modified": "2020-11-01T15:23:46.179Z",
     "contributors": [
       "carlitosnu41"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/ceil": {
+  "Web/JavaScript/Reference/Global_Objects/Math/ceil": {
     "modified": "2020-10-15T21:49:24.207Z",
     "contributors": [
       "RubiVG",
@@ -20362,25 +20174,33 @@
       "Roberto2883"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/cos": {
+  "Web/JavaScript/Reference/Global_Objects/Math/cos": {
     "modified": "2020-10-15T22:32:41.209Z",
     "contributors": [
       "JGalazan"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/exp": {
+  "Web/JavaScript/Reference/Global_Objects/Math/E": {
+    "modified": "2020-10-15T21:21:06.485Z",
+    "contributors": [
+      "lajaso",
+      "teoli",
+      "jessest"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/exp": {
     "modified": "2019-03-23T22:13:13.656Z",
     "contributors": [
       "maramal"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/expm1": {
+  "Web/JavaScript/Reference/Global_Objects/Math/expm1": {
     "modified": "2020-11-19T20:10:09.526Z",
     "contributors": [
       "lpg7793"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/floor": {
+  "Web/JavaScript/Reference/Global_Objects/Math/floor": {
     "modified": "2020-11-03T13:27:31.226Z",
     "contributors": [
       "LuisGalicia",
@@ -20391,38 +20211,87 @@
       "harleshinn"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/fround": {
+  "Web/JavaScript/Reference/Global_Objects/Math/fround": {
     "modified": "2020-10-15T22:21:30.568Z",
     "contributors": [
       "Itaiu"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/hypot": {
+  "Web/JavaScript/Reference/Global_Objects/Math/hypot": {
     "modified": "2020-10-15T22:01:35.023Z",
     "contributors": [
       "AzazelN28",
       "MarioECU"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/log": {
+  "Web/JavaScript/Reference/Global_Objects/Math": {
+    "modified": "2020-10-15T21:17:08.782Z",
+    "contributors": [
+      "RomnSD",
+      "Pedro-vk",
+      "lajaso",
+      "Enesimus",
+      "maxbalter",
+      "raecillacastellana",
+      "mrajente47",
+      "enesimo",
+      "Jaston",
+      "AugustoEsquen",
+      "teoli",
+      "ethertank",
+      "Talisker",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/LN10": {
+    "modified": "2020-10-15T21:21:04.066Z",
+    "contributors": [
+      "lajaso",
+      "teoli",
+      "jessest"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/LN2": {
+    "modified": "2020-10-15T21:21:06.933Z",
+    "contributors": [
+      "lajaso",
+      "teoli",
+      "jessest"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/log": {
     "modified": "2020-10-15T22:16:12.754Z",
     "contributors": [
       "reymundus2"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/log10": {
+  "Web/JavaScript/Reference/Global_Objects/Math/log10": {
     "modified": "2019-03-23T22:26:16.691Z",
     "contributors": [
       "amcrsanchez"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/log2": {
+  "Web/JavaScript/Reference/Global_Objects/Math/LOG10E": {
+    "modified": "2019-03-23T22:21:51.531Z",
+    "contributors": [
+      "aocodermx"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/log2": {
     "modified": "2020-10-15T22:02:09.980Z",
     "contributors": [
       "asdrubalivan"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/max": {
+  "Web/JavaScript/Reference/Global_Objects/Math/LOG2E": {
+    "modified": "2019-03-23T23:35:28.496Z",
+    "contributors": [
+      "teoli",
+      "jessest"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/max": {
     "modified": "2019-03-23T22:58:23.136Z",
     "contributors": [
       "roberbnd",
@@ -20432,21 +20301,27 @@
       "allangonzalezmiceli"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/min": {
+  "Web/JavaScript/Reference/Global_Objects/Math/min": {
     "modified": "2019-03-23T22:39:26.032Z",
     "contributors": [
       "kutyel",
       "alonso.vazquez"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/pow": {
+  "Web/JavaScript/Reference/Global_Objects/Math/PI": {
+    "modified": "2019-03-23T22:21:48.729Z",
+    "contributors": [
+      "aocodermx"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/pow": {
     "modified": "2020-05-11T01:41:03.777Z",
     "contributors": [
       "paguilar",
       "carral"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/random": {
+  "Web/JavaScript/Reference/Global_Objects/Math/random": {
     "modified": "2019-03-23T23:00:21.676Z",
     "contributors": [
       "hdesoto",
@@ -20455,7 +20330,7 @@
       "daiant"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/round": {
+  "Web/JavaScript/Reference/Global_Objects/Math/round": {
     "modified": "2020-07-28T16:21:17.637Z",
     "contributors": [
       "FacundoF1",
@@ -20465,21 +20340,21 @@
       "YerkoPalma"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/seno": {
+  "Web/JavaScript/Reference/Global_Objects/Math/sin": {
     "modified": "2019-03-23T22:51:39.313Z",
     "contributors": [
       "jezdez",
       "germanfr"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/sign": {
+  "Web/JavaScript/Reference/Global_Objects/Math/sign": {
     "modified": "2019-03-23T22:16:42.806Z",
     "contributors": [
       "Vickysolo",
       "frankman123"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/sqrt": {
+  "Web/JavaScript/Reference/Global_Objects/Math/sqrt": {
     "modified": "2019-03-23T22:28:35.014Z",
     "contributors": [
       "MarioECU",
@@ -20488,19 +20363,31 @@
       "LotarMC"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/tan": {
+  "Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2": {
+    "modified": "2019-03-23T22:22:44.049Z",
+    "contributors": [
+      "aocodermx"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/SQRT2": {
+    "modified": "2019-03-23T22:18:15.216Z",
+    "contributors": [
+      "geradrum"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Math/tan": {
     "modified": "2020-10-15T22:30:22.119Z",
     "contributors": [
       "spaceinvadev"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/tanh": {
+  "Web/JavaScript/Reference/Global_Objects/Math/tanh": {
     "modified": "2020-10-15T22:08:08.543Z",
     "contributors": [
       "smuurf"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Math/trunc": {
+  "Web/JavaScript/Reference/Global_Objects/Math/trunc": {
     "modified": "2020-06-23T08:00:29.509Z",
     "contributors": [
       "GioSJ47",
@@ -20509,7 +20396,7 @@
       "kenin4"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/NaN": {
+  "Web/JavaScript/Reference/Global_Objects/NaN": {
     "modified": "2020-03-12T19:36:10.137Z",
     "contributors": [
       "jaomix1",
@@ -20521,7 +20408,19 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number": {
+  "Web/JavaScript/Reference/Global_Objects/null": {
+    "modified": "2020-03-12T19:42:06.401Z",
+    "contributors": [
+      "mkiramu",
+      "ivanagui2",
+      "diegoazh",
+      "BubuAnabelas",
+      "hmorv",
+      "AugustoEsquen",
+      "AsLogd"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Number": {
     "modified": "2020-11-24T10:13:32.926Z",
     "contributors": [
       "gise-s",
@@ -20537,72 +20436,65 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/MAX_SAFE_INTEGER": {
-    "modified": "2020-10-15T22:00:45.784Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/isFinite": {
+    "modified": "2020-10-15T22:02:19.829Z",
     "contributors": [
-      "urielmx"
+      "dahsser"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/MAX_VALUE": {
-    "modified": "2019-03-23T22:40:03.550Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/isInteger": {
+    "modified": "2020-10-15T21:44:12.806Z",
     "contributors": [
-      "abaracedo",
-      "UlisesGascon"
+      "AlePerez92",
+      "Rafaelox"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/MIN_VALUE": {
-    "modified": "2019-03-23T22:39:33.277Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/isNaN": {
+    "modified": "2020-10-14T19:49:07.774Z",
     "contributors": [
+      "alejandro.fca",
       "abaracedo"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY": {
-    "modified": "2019-03-23T23:20:29.197Z",
-    "contributors": [
-      "teoli",
-      "jarneygm"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/NaN": {
-    "modified": "2020-10-15T22:30:30.437Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger": {
+    "modified": "2020-10-15T22:02:33.932Z",
     "contributors": [
-      "oldanirenzo"
+      "chrishenx"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY": {
-    "modified": "2019-03-23T23:20:30.481Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER": {
+    "modified": "2020-10-15T22:00:45.784Z",
     "contributors": [
-      "teoli",
-      "jarneygm"
+      "urielmx"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/isFinite": {
-    "modified": "2020-10-15T22:02:19.829Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE": {
+    "modified": "2019-03-23T22:40:03.550Z",
     "contributors": [
-      "dahsser"
+      "abaracedo",
+      "UlisesGascon"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/isInteger": {
-    "modified": "2020-10-15T21:44:12.806Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE": {
+    "modified": "2019-03-23T22:39:33.277Z",
     "contributors": [
-      "AlePerez92",
-      "Rafaelox"
+      "abaracedo"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/isNaN": {
-    "modified": "2020-10-14T19:49:07.774Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/NaN": {
+    "modified": "2020-10-15T22:30:30.437Z",
     "contributors": [
-      "alejandro.fca",
-      "abaracedo"
+      "oldanirenzo"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/isSafeInteger": {
-    "modified": "2020-10-15T22:02:33.932Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY": {
+    "modified": "2019-03-23T23:20:29.197Z",
     "contributors": [
-      "chrishenx"
+      "teoli",
+      "jarneygm"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/parseFloat": {
+  "Web/JavaScript/Reference/Global_Objects/Number/parseFloat": {
     "modified": "2020-10-15T22:11:38.614Z",
     "contributors": [
       "pilichanampe",
@@ -20610,20 +20502,20 @@
       "IsraelFloresDGA"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/parseInt": {
+  "Web/JavaScript/Reference/Global_Objects/Number/parseInt": {
     "modified": "2020-10-15T22:29:44.854Z",
     "contributors": [
       "HarryzMoba_10"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/prototype": {
-    "modified": "2019-03-23T23:46:16.155Z",
+  "Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY": {
+    "modified": "2019-03-23T23:20:30.481Z",
     "contributors": [
       "teoli",
-      "Sheppy"
+      "jarneygm"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/toFixed": {
+  "Web/JavaScript/Reference/Global_Objects/Number/toFixed": {
     "modified": "2020-05-26T21:48:51.844Z",
     "contributors": [
       "EtelS",
@@ -20634,19 +20526,19 @@
       "isabido"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/toLocaleString": {
+  "Web/JavaScript/Reference/Global_Objects/Number/toLocaleString": {
     "modified": "2020-11-04T23:22:26.363Z",
     "contributors": [
       "ccarruitero-mdn"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/toPrecision": {
+  "Web/JavaScript/Reference/Global_Objects/Number/toPrecision": {
     "modified": "2020-10-15T22:05:51.600Z",
     "contributors": [
       "jtorresheredia"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/toString": {
+  "Web/JavaScript/Reference/Global_Objects/Number/toString": {
     "modified": "2019-06-15T08:43:31.612Z",
     "contributors": [
       "IbraBach",
@@ -20655,50 +20547,26 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Number/valueOf": {
+  "Web/JavaScript/Reference/Global_Objects/Number/valueOf": {
     "modified": "2020-10-15T21:58:23.022Z",
     "contributors": [
       "Enesimus"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object": {
-    "modified": "2020-10-15T21:17:02.144Z",
-    "contributors": [
-      "luisjorquera",
-      "fedoroffs",
-      "ramirobg94",
-      "marcelorodcla",
-      "hecsoto1",
-      "gabrielrincon",
-      "fscholz",
-      "DanielAmaro",
-      "taniaReyesM",
-      "pedro-otero",
-      "ragutimar",
-      "hmorv",
-      "mishelashala",
-      "teoli",
-      "diegogaysaez",
-      "neosergio",
-      "Talisker",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/__defineGetter__": {
+  "Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__": {
     "modified": "2019-03-23T22:39:13.909Z",
     "contributors": [
       "p1errot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/__lookupGetter__": {
+  "Web/JavaScript/Reference/Global_Objects/Object/__lookupGetter__": {
     "modified": "2020-10-15T21:59:55.328Z",
     "contributors": [
       "al-shmlan",
       "jerssonjgar"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/assign": {
+  "Web/JavaScript/Reference/Global_Objects/Object/assign": {
     "modified": "2020-10-15T21:34:18.548Z",
     "contributors": [
       "camsa",
@@ -20716,7 +20584,7 @@
       "fscholz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/constructor": {
+  "Web/JavaScript/Reference/Global_Objects/Object/constructor": {
     "modified": "2019-03-23T23:16:25.847Z",
     "contributors": [
       "alejandrochung",
@@ -20726,7 +20594,7 @@
       "carlosmantilla"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/create": {
+  "Web/JavaScript/Reference/Global_Objects/Object/create": {
     "modified": "2020-11-08T21:02:55.557Z",
     "contributors": [
       "Hunter3195",
@@ -20738,7 +20606,7 @@
       "carlosmantilla"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/defineProperties": {
+  "Web/JavaScript/Reference/Global_Objects/Object/defineProperties": {
     "modified": "2019-03-23T23:15:47.453Z",
     "contributors": [
       "Thargelion",
@@ -20747,7 +20615,7 @@
       "guillermojmc"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/defineProperty": {
+  "Web/JavaScript/Reference/Global_Objects/Object/defineProperty": {
     "modified": "2019-03-23T23:08:49.016Z",
     "contributors": [
       "JoanSerna",
@@ -20758,7 +20626,7 @@
       "Siro_Diaz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/entries": {
+  "Web/JavaScript/Reference/Global_Objects/Object/entries": {
     "modified": "2019-07-12T06:16:58.372Z",
     "contributors": [
       "ajuanjojjj",
@@ -20766,7 +20634,7 @@
       "JooseNavarro"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/freeze": {
+  "Web/JavaScript/Reference/Global_Objects/Object/freeze": {
     "modified": "2020-10-15T21:40:07.065Z",
     "contributors": [
       "D3Portillo",
@@ -20776,14 +20644,14 @@
       "mishelashala"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/fromEntries": {
+  "Web/JavaScript/Reference/Global_Objects/Object/fromEntries": {
     "modified": "2020-10-15T22:16:55.358Z",
     "contributors": [
       "emileond",
       "Belquira"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptor": {
+  "Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor": {
     "modified": "2020-04-01T17:55:45.485Z",
     "contributors": [
       "SoyZatarain",
@@ -20792,33 +20660,33 @@
       "mishelashala"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptors": {
+  "Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptors": {
     "modified": "2020-10-15T22:04:17.154Z",
     "contributors": [
       "cbalderasc"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyNames": {
+  "Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames": {
     "modified": "2019-03-23T23:11:13.666Z",
     "contributors": [
       "teland"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertySymbols": {
+  "Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertySymbols": {
     "modified": "2019-03-23T22:44:20.977Z",
     "contributors": [
       "SphinxKnight",
       "mishelashala"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/getPrototypeOf": {
+  "Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf": {
     "modified": "2019-03-23T23:08:23.955Z",
     "contributors": [
       "tutugordillo",
       "Siro_Diaz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty": {
+  "Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty": {
     "modified": "2019-03-23T23:16:40.759Z",
     "contributors": [
       "mlealvillarreal",
@@ -20826,7 +20694,31 @@
       "Siro_Diaz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/is": {
+  "Web/JavaScript/Reference/Global_Objects/Object": {
+    "modified": "2020-10-15T21:17:02.144Z",
+    "contributors": [
+      "luisjorquera",
+      "fedoroffs",
+      "ramirobg94",
+      "marcelorodcla",
+      "hecsoto1",
+      "gabrielrincon",
+      "fscholz",
+      "DanielAmaro",
+      "taniaReyesM",
+      "pedro-otero",
+      "ragutimar",
+      "hmorv",
+      "mishelashala",
+      "teoli",
+      "diegogaysaez",
+      "neosergio",
+      "Talisker",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Object/is": {
     "modified": "2020-10-25T20:02:03.267Z",
     "contributors": [
       "Cesaraugp",
@@ -20835,31 +20727,31 @@
       "adelamata"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/isExtensible": {
+  "Web/JavaScript/Reference/Global_Objects/Object/isExtensible": {
     "modified": "2019-03-23T22:44:00.950Z",
     "contributors": [
       "mishelashala"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/isFrozen": {
+  "Web/JavaScript/Reference/Global_Objects/Object/isFrozen": {
     "modified": "2019-03-23T22:44:03.171Z",
     "contributors": [
       "mishelashala"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/isPrototypeOf": {
+  "Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf": {
     "modified": "2019-03-23T22:31:29.220Z",
     "contributors": [
       "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/isSealed": {
+  "Web/JavaScript/Reference/Global_Objects/Object/isSealed": {
     "modified": "2020-10-15T22:04:16.292Z",
     "contributors": [
       "cbalderasc"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/keys": {
+  "Web/JavaScript/Reference/Global_Objects/Object/keys": {
     "modified": "2020-10-15T21:31:27.965Z",
     "contributors": [
       "jose-setaworkshop",
@@ -20876,19 +20768,19 @@
       "rcchristiane"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/preventExtensions": {
+  "Web/JavaScript/Reference/Global_Objects/Object/preventExtensions": {
     "modified": "2019-04-27T00:07:22.331Z",
     "contributors": [
       "mishelashala"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/propertyIsEnumerable": {
+  "Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable": {
     "modified": "2019-03-23T22:50:44.591Z",
     "contributors": [
       "aldoromo88"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/proto": {
+  "Web/JavaScript/Reference/Global_Objects/Object/proto": {
     "modified": "2019-03-23T22:45:52.056Z",
     "contributors": [
       "swsoftware",
@@ -20896,27 +20788,14 @@
       "adelamata"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/prototype": {
-    "modified": "2020-10-15T21:28:24.470Z",
-    "contributors": [
-      "lajaso",
-      "Sergio_Gonzalez_Collado",
-      "educalleja",
-      "AlexanderEstebanZapata1994",
-      "emilianodiaz",
-      "mishelashala",
-      "teoli",
-      "diegogaysaez"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/seal": {
+  "Web/JavaScript/Reference/Global_Objects/Object/seal": {
     "modified": "2019-04-27T00:05:41.633Z",
     "contributors": [
       "JoniJnm",
       "Grijander81"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/setPrototypeOf": {
+  "Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf": {
     "modified": "2019-03-23T22:43:30.332Z",
     "contributors": [
       "SphinxKnight",
@@ -20924,19 +20803,19 @@
       "mishelashala"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/toLocaleString": {
+  "Web/JavaScript/Reference/Global_Objects/Object/toLocaleString": {
     "modified": "2020-10-15T22:31:29.977Z",
     "contributors": [
       "JotaCé"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/toSource": {
+  "Web/JavaScript/Reference/Global_Objects/Object/toSource": {
     "modified": "2020-10-15T21:59:52.415Z",
     "contributors": [
       "taniaReyesM"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/toString": {
+  "Web/JavaScript/Reference/Global_Objects/Object/toString": {
     "modified": "2019-03-23T23:48:33.504Z",
     "contributors": [
       "gutyfas",
@@ -20947,7 +20826,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/valueOf": {
+  "Web/JavaScript/Reference/Global_Objects/Object/valueOf": {
     "modified": "2019-03-23T23:07:28.561Z",
     "contributors": [
       "JuanMacias",
@@ -20955,7 +20834,7 @@
       "emiliot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Object/values": {
+  "Web/JavaScript/Reference/Global_Objects/Object/values": {
     "modified": "2020-10-15T21:51:49.001Z",
     "contributors": [
       "camsa",
@@ -20964,27 +20843,28 @@
       "ramses512"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise": {
-    "modified": "2020-10-15T21:34:31.961Z",
+  "Web/JavaScript/Reference/Global_Objects/parseFloat": {
+    "modified": "2020-07-04T20:00:21.182Z",
     "contributors": [
-      "chrisdavidmills",
-      "javigaralva",
-      "ManuelEsp",
-      "atpollmann",
-      "jwhitlock",
-      "zgluis",
-      "joseconstela",
-      "luisrodriguezchaves",
-      "LazaroOnline",
-      "leopic",
+      "pilichanampe",
+      "SphinxKnight",
       "teoli",
-      "JhonAlx",
-      "dennistobar",
-      "alagos",
-      "jorgecasar"
+      "Mgjbot",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/parseInt": {
+    "modified": "2020-03-12T19:37:31.195Z",
+    "contributors": [
+      "mitsurugi",
+      "teoli",
+      "daiant",
+      "SphinxKnight",
+      "Mgjbot",
+      "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/all": {
+  "Web/JavaScript/Reference/Global_Objects/Promise/all": {
     "modified": "2020-10-15T21:50:20.796Z",
     "contributors": [
       "baumannzone",
@@ -20994,7 +20874,7 @@
       "FranBacoSoft"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/catch": {
+  "Web/JavaScript/Reference/Global_Objects/Promise/catch": {
     "modified": "2020-10-15T21:54:38.286Z",
     "contributors": [
       "JuanMacias",
@@ -21002,20 +20882,34 @@
       "walbuc"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/finally": {
+  "Web/JavaScript/Reference/Global_Objects/Promise/finally": {
     "modified": "2020-10-15T22:16:46.629Z",
     "contributors": [
       "javigallego",
       "smvilar"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/prototype": {
-    "modified": "2020-10-15T21:52:03.650Z",
+  "Web/JavaScript/Reference/Global_Objects/Promise": {
+    "modified": "2020-10-15T21:34:31.961Z",
     "contributors": [
-      "atpollmann"
+      "chrisdavidmills",
+      "javigaralva",
+      "ManuelEsp",
+      "atpollmann",
+      "jwhitlock",
+      "zgluis",
+      "joseconstela",
+      "luisrodriguezchaves",
+      "LazaroOnline",
+      "leopic",
+      "teoli",
+      "JhonAlx",
+      "dennistobar",
+      "alagos",
+      "jorgecasar"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/race": {
+  "Web/JavaScript/Reference/Global_Objects/Promise/race": {
     "modified": "2020-10-15T21:50:20.173Z",
     "contributors": [
       "JuanMacias",
@@ -21023,7 +20917,7 @@
       "FranBacoSoft"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/reject": {
+  "Web/JavaScript/Reference/Global_Objects/Promise/reject": {
     "modified": "2020-10-15T22:00:43.489Z",
     "contributors": [
       "edeyglez95",
@@ -21031,14 +20925,14 @@
       "giturra"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/resolve": {
+  "Web/JavaScript/Reference/Global_Objects/Promise/resolve": {
     "modified": "2020-10-15T22:06:37.624Z",
     "contributors": [
       "HappyEduardoMilk",
       "ChristianMarca"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Promise/then": {
+  "Web/JavaScript/Reference/Global_Objects/Promise/then": {
     "modified": "2020-11-30T12:11:41.749Z",
     "contributors": [
       "StripTM",
@@ -21055,7 +20949,7 @@
       "manumora"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Proxy": {
+  "Web/JavaScript/Reference/Global_Objects/Proxy": {
     "modified": "2020-10-30T19:48:13.357Z",
     "contributors": [
       "Ramdhei-codes",
@@ -21067,13 +20961,31 @@
       "pedropablomt95"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/ReferenceError": {
+  "Web/JavaScript/Reference/Global_Objects/ReferenceError": {
     "modified": "2020-10-15T22:33:51.476Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp": {
+  "Web/JavaScript/Reference/Global_Objects/RegExp/compile": {
+    "modified": "2020-10-15T22:23:39.381Z",
+    "contributors": [
+      "raiman264"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/RegExp/exec": {
+    "modified": "2019-03-23T22:08:57.043Z",
+    "contributors": [
+      "Sebastiancbvz"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/RegExp/ignoreCase": {
+    "modified": "2019-03-23T22:10:00.611Z",
+    "contributors": [
+      "Cuadraman"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/RegExp": {
     "modified": "2020-10-15T21:12:12.221Z",
     "contributors": [
       "Nachec",
@@ -21091,144 +21003,94 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp/RegExp": {
+  "Web/JavaScript/Reference/Global_Objects/RegExp/RegExp": {
     "modified": "2020-10-15T22:34:22.734Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp/compile": {
-    "modified": "2020-10-15T22:23:39.381Z",
-    "contributors": [
-      "raiman264"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp/exec": {
-    "modified": "2019-03-23T22:08:57.043Z",
-    "contributors": [
-      "Sebastiancbvz"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp/ignoreCase": {
-    "modified": "2019-03-23T22:10:00.611Z",
-    "contributors": [
-      "Cuadraman"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp/rightContext": {
+  "Web/JavaScript/Reference/Global_Objects/RegExp/rightContext": {
     "modified": "2020-10-15T22:22:06.547Z",
     "contributors": [
       "higuitadiaz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp/test": {
+  "Web/JavaScript/Reference/Global_Objects/RegExp/test": {
     "modified": "2019-03-23T22:20:42.368Z",
     "contributors": [
       "Undre4m"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/RegExp/toString": {
+  "Web/JavaScript/Reference/Global_Objects/RegExp/toString": {
     "modified": "2019-03-23T22:20:44.971Z",
     "contributors": [
       "Undre4m"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set": {
-    "modified": "2020-10-15T21:43:41.104Z",
-    "contributors": [
-      "camsa",
-      "IsraelFloresDGA",
-      "albertor21",
-      "robe007",
-      "taniaReyesM",
-      "mjlescano",
-      "germanio",
-      "frank-orellana",
-      "Chofoteddy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/@@iterator": {
+  "Web/JavaScript/Reference/Global_Objects/Set/@@iterator": {
     "modified": "2020-10-15T22:23:37.310Z",
     "contributors": [
       "devtoni"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/add": {
+  "Web/JavaScript/Reference/Global_Objects/Set/add": {
     "modified": "2019-03-23T22:37:23.989Z",
     "contributors": [
       "Chofoteddy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/clear": {
+  "Web/JavaScript/Reference/Global_Objects/Set/clear": {
     "modified": "2019-03-23T22:25:09.145Z",
     "contributors": [
       "frank-orellana"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/delete": {
+  "Web/JavaScript/Reference/Global_Objects/Set/delete": {
     "modified": "2019-03-23T22:25:14.047Z",
     "contributors": [
       "frank-orellana"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/entries": {
+  "Web/JavaScript/Reference/Global_Objects/Set/entries": {
     "modified": "2020-10-15T22:06:44.315Z",
     "contributors": [
       "AMongeMoreno"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/has": {
+  "Web/JavaScript/Reference/Global_Objects/Set/has": {
     "modified": "2019-03-23T22:25:15.879Z",
     "contributors": [
       "frank-orellana"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/size": {
-    "modified": "2019-03-23T22:37:32.002Z",
+  "Web/JavaScript/Reference/Global_Objects/Set": {
+    "modified": "2020-10-15T21:43:41.104Z",
     "contributors": [
+      "camsa",
+      "IsraelFloresDGA",
       "albertor21",
+      "robe007",
+      "taniaReyesM",
+      "mjlescano",
+      "germanio",
+      "frank-orellana",
       "Chofoteddy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Set/values": {
-    "modified": "2020-10-15T22:23:08.370Z",
-    "contributors": [
-      "jvelasquez-cl"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/String": {
-    "modified": "2020-10-15T21:15:27.929Z",
+  "Web/JavaScript/Reference/Global_Objects/Set/size": {
+    "modified": "2019-03-23T22:37:32.002Z",
     "contributors": [
-      "Nachec",
-      "robertsallent",
-      "sujumayas",
-      "AriManto",
-      "BubuAnabelas",
-      "wbamberg",
-      "SphinxKnight",
-      "Gilbertrdz",
-      "vik231982",
-      "alejandrochung",
-      "DevManny",
-      "teoli",
-      "ADP13",
-      "Talisker",
-      "Mgjbot",
-      "Sheppy"
+      "albertor21",
+      "Chofoteddy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/Trim": {
-    "modified": "2019-08-18T16:00:14.454Z",
+  "Web/JavaScript/Reference/Global_Objects/Set/values": {
+    "modified": "2020-10-15T22:23:08.370Z",
     "contributors": [
-      "valen2004vega",
-      "raulgg",
-      "baumannzone",
-      "andrpueb",
-      "thzunder",
-      "AnuarMB"
+      "jvelasquez-cl"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/anchor": {
+  "Web/JavaScript/Reference/Global_Objects/String/anchor": {
     "modified": "2019-03-23T23:48:20.117Z",
     "contributors": [
       "paradoja",
@@ -21237,7 +21099,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/big": {
+  "Web/JavaScript/Reference/Global_Objects/String/big": {
     "modified": "2019-03-23T23:48:12.468Z",
     "contributors": [
       "Feder1997Clinton",
@@ -21246,7 +21108,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/blink": {
+  "Web/JavaScript/Reference/Global_Objects/String/blink": {
     "modified": "2019-03-23T23:48:14.789Z",
     "contributors": [
       "teoli",
@@ -21254,7 +21116,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/bold": {
+  "Web/JavaScript/Reference/Global_Objects/String/bold": {
     "modified": "2019-03-23T23:48:17.641Z",
     "contributors": [
       "teoli",
@@ -21262,7 +21124,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/charAt": {
+  "Web/JavaScript/Reference/Global_Objects/String/charAt": {
     "modified": "2019-03-23T23:48:14.397Z",
     "contributors": [
       "manatico4",
@@ -21274,7 +21136,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/charCodeAt": {
+  "Web/JavaScript/Reference/Global_Objects/String/charCodeAt": {
     "modified": "2019-03-23T23:48:12.586Z",
     "contributors": [
       "GermanRodrickson",
@@ -21284,13 +21146,13 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/codePointAt": {
+  "Web/JavaScript/Reference/Global_Objects/String/codePointAt": {
     "modified": "2020-10-15T21:56:01.225Z",
     "contributors": [
       "thepianist2"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/concat": {
+  "Web/JavaScript/Reference/Global_Objects/String/concat": {
     "modified": "2020-11-17T12:46:24.732Z",
     "contributors": [
       "AlePerez92",
@@ -21300,7 +21162,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/endsWith": {
+  "Web/JavaScript/Reference/Global_Objects/String/endsWith": {
     "modified": "2020-11-17T13:03:14.946Z",
     "contributors": [
       "AlePerez92",
@@ -21309,7 +21171,7 @@
       "thzunder"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/fixed": {
+  "Web/JavaScript/Reference/Global_Objects/String/fixed": {
     "modified": "2019-03-23T23:48:13.182Z",
     "contributors": [
       "teoli",
@@ -21317,19 +21179,19 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/fontcolor": {
+  "Web/JavaScript/Reference/Global_Objects/String/fontcolor": {
     "modified": "2019-03-23T22:43:01.091Z",
     "contributors": [
       "thzunder"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/fontsize": {
+  "Web/JavaScript/Reference/Global_Objects/String/fontsize": {
     "modified": "2019-03-23T22:42:58.033Z",
     "contributors": [
       "thzunder"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/fromCharCode": {
+  "Web/JavaScript/Reference/Global_Objects/String/fromCharCode": {
     "modified": "2019-03-23T23:48:18.539Z",
     "contributors": [
       "pierina27",
@@ -21338,14 +21200,14 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/fromCodePoint": {
+  "Web/JavaScript/Reference/Global_Objects/String/fromCodePoint": {
     "modified": "2019-03-23T22:54:48.266Z",
     "contributors": [
       "SphinxKnight",
       "iKenshu"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/includes": {
+  "Web/JavaScript/Reference/Global_Objects/String/includes": {
     "modified": "2020-11-17T13:18:02.027Z",
     "contributors": [
       "AlePerez92",
@@ -21355,7 +21217,28 @@
       "jairoFg12"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/indexOf": {
+  "Web/JavaScript/Reference/Global_Objects/String": {
+    "modified": "2020-10-15T21:15:27.929Z",
+    "contributors": [
+      "Nachec",
+      "robertsallent",
+      "sujumayas",
+      "AriManto",
+      "BubuAnabelas",
+      "wbamberg",
+      "SphinxKnight",
+      "Gilbertrdz",
+      "vik231982",
+      "alejandrochung",
+      "DevManny",
+      "teoli",
+      "ADP13",
+      "Talisker",
+      "Mgjbot",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/String/indexOf": {
     "modified": "2019-03-18T21:12:49.473Z",
     "contributors": [
       "aalmadar",
@@ -21367,7 +21250,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/italics": {
+  "Web/JavaScript/Reference/Global_Objects/String/italics": {
     "modified": "2019-03-23T23:48:19.418Z",
     "contributors": [
       "teoli",
@@ -21375,7 +21258,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/lastIndexOf": {
+  "Web/JavaScript/Reference/Global_Objects/String/lastIndexOf": {
     "modified": "2019-03-23T23:48:26.628Z",
     "contributors": [
       "chepegeek",
@@ -21385,7 +21268,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/length": {
+  "Web/JavaScript/Reference/Global_Objects/String/length": {
     "modified": "2020-11-17T13:10:35.617Z",
     "contributors": [
       "AlePerez92",
@@ -21397,7 +21280,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/link": {
+  "Web/JavaScript/Reference/Global_Objects/String/link": {
     "modified": "2019-03-23T23:48:12.131Z",
     "contributors": [
       "germun",
@@ -21405,13 +21288,13 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/localeCompare": {
+  "Web/JavaScript/Reference/Global_Objects/String/localeCompare": {
     "modified": "2020-10-15T22:04:12.741Z",
     "contributors": [
       "DesarrolloJon"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/match": {
+  "Web/JavaScript/Reference/Global_Objects/String/match": {
     "modified": "2019-03-23T23:48:25.734Z",
     "contributors": [
       "germun",
@@ -21421,19 +21304,19 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/matchAll": {
+  "Web/JavaScript/Reference/Global_Objects/String/matchAll": {
     "modified": "2020-10-15T22:22:31.534Z",
     "contributors": [
       "juanarbol"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/normalize": {
+  "Web/JavaScript/Reference/Global_Objects/String/normalize": {
     "modified": "2020-10-15T22:04:13.627Z",
     "contributors": [
       "daniel.duarte"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/padStart": {
+  "Web/JavaScript/Reference/Global_Objects/String/padStart": {
     "modified": "2019-03-23T22:19:55.544Z",
     "contributors": [
       "teoli",
@@ -21441,23 +21324,14 @@
       "EdgarOrtegaRamirez"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/prototype": {
-    "modified": "2019-03-23T23:53:48.515Z",
-    "contributors": [
-      "DevManny",
-      "teoli",
-      "Mgjbot",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/String/raw": {
+  "Web/JavaScript/Reference/Global_Objects/String/raw": {
     "modified": "2020-10-15T21:58:34.921Z",
     "contributors": [
       "leomicheloni",
       "RaulRueda"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/repeat": {
+  "Web/JavaScript/Reference/Global_Objects/String/repeat": {
     "modified": "2020-10-15T21:38:22.279Z",
     "contributors": [
       "SphinxKnight",
@@ -21466,7 +21340,7 @@
       "GabrielNicolasAvellaneda"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/replace": {
+  "Web/JavaScript/Reference/Global_Objects/String/replace": {
     "modified": "2020-01-29T20:30:57.565Z",
     "contributors": [
       "camsa",
@@ -21480,7 +21354,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/search": {
+  "Web/JavaScript/Reference/Global_Objects/String/search": {
     "modified": "2019-03-23T23:48:25.507Z",
     "contributors": [
       "AlePerez92",
@@ -21490,7 +21364,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/slice": {
+  "Web/JavaScript/Reference/Global_Objects/String/slice": {
     "modified": "2019-03-23T23:48:27.527Z",
     "contributors": [
       "ibejarano",
@@ -21501,14 +21375,14 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/small": {
+  "Web/JavaScript/Reference/Global_Objects/String/small": {
     "modified": "2019-03-23T23:48:20.862Z",
     "contributors": [
       "teoli",
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/split": {
+  "Web/JavaScript/Reference/Global_Objects/String/split": {
     "modified": "2019-03-23T23:52:25.005Z",
     "contributors": [
       "germun",
@@ -21520,7 +21394,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/startsWith": {
+  "Web/JavaScript/Reference/Global_Objects/String/startsWith": {
     "modified": "2020-11-17T06:29:46.581Z",
     "contributors": [
       "AlePerez92",
@@ -21529,7 +21403,7 @@
       "mautematico"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/strike": {
+  "Web/JavaScript/Reference/Global_Objects/String/strike": {
     "modified": "2019-03-23T23:48:19.929Z",
     "contributors": [
       "teoli",
@@ -21537,7 +21411,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/sub": {
+  "Web/JavaScript/Reference/Global_Objects/String/sub": {
     "modified": "2019-03-23T23:48:12.360Z",
     "contributors": [
       "teoli",
@@ -21545,7 +21419,7 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/substr": {
+  "Web/JavaScript/Reference/Global_Objects/String/substr": {
     "modified": "2019-03-23T23:59:51.386Z",
     "contributors": [
       "olijyat",
@@ -21557,7 +21431,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/substring": {
+  "Web/JavaScript/Reference/Global_Objects/String/substring": {
     "modified": "2019-03-24T00:03:43.568Z",
     "contributors": [
       "alejandrochung",
@@ -21567,7 +21441,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/sup": {
+  "Web/JavaScript/Reference/Global_Objects/String/sup": {
     "modified": "2019-03-23T23:48:12.249Z",
     "contributors": [
       "teoli",
@@ -21575,19 +21449,19 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/toLocaleLowerCase": {
+  "Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase": {
     "modified": "2020-10-15T22:11:36.514Z",
     "contributors": [
       "MarkCBB"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/toLocaleUpperCase": {
+  "Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase": {
     "modified": "2020-10-15T21:55:35.801Z",
     "contributors": [
       "padrecedano"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/toLowerCase": {
+  "Web/JavaScript/Reference/Global_Objects/String/toLowerCase": {
     "modified": "2019-03-23T23:48:13.663Z",
     "contributors": [
       "Daniel_Martin",
@@ -21598,13 +21472,13 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/toSource": {
+  "Web/JavaScript/Reference/Global_Objects/String/toSource": {
     "modified": "2020-10-15T22:22:52.809Z",
     "contributors": [
       "SoyZatarain"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/toString": {
+  "Web/JavaScript/Reference/Global_Objects/String/toString": {
     "modified": "2019-03-23T23:48:26.799Z",
     "contributors": [
       "teoli",
@@ -21612,7 +21486,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/toUpperCase": {
+  "Web/JavaScript/Reference/Global_Objects/String/toUpperCase": {
     "modified": "2019-03-23T23:48:19.033Z",
     "contributors": [
       "hgutierrez",
@@ -21621,13 +21495,24 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/trimEnd": {
+  "Web/JavaScript/Reference/Global_Objects/String/Trim": {
+    "modified": "2019-08-18T16:00:14.454Z",
+    "contributors": [
+      "valen2004vega",
+      "raulgg",
+      "baumannzone",
+      "andrpueb",
+      "thzunder",
+      "AnuarMB"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/String/trimEnd": {
     "modified": "2020-10-15T22:32:40.984Z",
     "contributors": [
       "cardotrejos"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/String/valueOf": {
+  "Web/JavaScript/Reference/Global_Objects/String/valueOf": {
     "modified": "2019-03-23T23:48:30.713Z",
     "contributors": [
       "teoli",
@@ -21635,7 +21520,19 @@
       "Mgjbot"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Symbol": {
+  "Web/JavaScript/Reference/Global_Objects/Symbol/for": {
+    "modified": "2019-03-23T22:06:38.566Z",
+    "contributors": [
+      "dariomaim"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance": {
+    "modified": "2019-03-23T22:06:44.647Z",
+    "contributors": [
+      "aeroxmotion"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Symbol": {
     "modified": "2019-06-24T09:01:16.062Z",
     "contributors": [
       "PCASME",
@@ -21649,19 +21546,7 @@
       "joseanpg"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Symbol/for": {
-    "modified": "2019-03-23T22:06:38.566Z",
-    "contributors": [
-      "dariomaim"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Symbol/hasInstance": {
-    "modified": "2019-03-23T22:06:44.647Z",
-    "contributors": [
-      "aeroxmotion"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/Symbol/iterator": {
+  "Web/JavaScript/Reference/Global_Objects/Symbol/iterator": {
     "modified": "2020-10-15T22:03:24.581Z",
     "contributors": [
       "leovenezia",
@@ -21669,19 +21554,20 @@
       "DJphilomath"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/SyntaxError": {
+  "Web/JavaScript/Reference/Global_Objects/SyntaxError": {
     "modified": "2019-03-23T22:31:22.099Z",
     "contributors": [
       "BubuAnabelas"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype": {
-    "modified": "2019-03-23T22:31:16.833Z",
+  "Web/JavaScript/Reference/Global_Objects/TypedArray/buffer": {
+    "modified": "2019-03-23T22:12:04.645Z",
     "contributors": [
-      "BubuAnabelas"
+      "SphinxKnight",
+      "joseluisq"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/TypedArray": {
+  "Web/JavaScript/Reference/Global_Objects/TypedArray": {
     "modified": "2020-10-15T21:54:18.777Z",
     "contributors": [
       "Nachec",
@@ -21690,305 +21576,135 @@
       "fscholz"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/TypedArray/buffer": {
-    "modified": "2019-03-23T22:12:04.645Z",
+  "Web/JavaScript/Reference/Global_Objects/Uint8Array": {
+    "modified": "2019-03-23T22:26:47.572Z",
     "contributors": [
-      "SphinxKnight",
-      "joseluisq"
+      "joseluisq",
+      "misan",
+      "pelu"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/URIError": {
-    "modified": "2020-10-15T22:14:48.739Z",
+  "Web/JavaScript/Reference/Global_Objects/undefined": {
+    "modified": "2020-03-12T19:36:57.621Z",
     "contributors": [
-      "omoldes"
+      "IsaacAaron",
+      "Undre4m",
+      "BubuAnabelas",
+      "SphinxKnight",
+      "teoli",
+      "ADP13",
+      "Talisker",
+      "Mgjbot",
+      "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/Uint8Array": {
-    "modified": "2019-03-23T22:26:47.572Z",
+  "Web/JavaScript/Reference/Global_Objects/unescape": {
+    "modified": "2020-03-12T19:43:34.960Z",
     "contributors": [
-      "joseluisq",
-      "misan",
-      "pelu"
+      "DracotMolver"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakMap": {
-    "modified": "2020-10-06T14:36:19.625Z",
+  "Web/JavaScript/Reference/Global_Objects/URIError": {
+    "modified": "2020-10-15T22:14:48.739Z",
     "contributors": [
-      "oleksandrstarov",
-      "SphinxKnight",
-      "kdex",
-      "frank-orellana",
-      "oagarcia",
-      "willemsh"
+      "omoldes"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakMap/clear": {
+  "Web/JavaScript/Reference/Global_Objects/WeakMap/clear": {
     "modified": "2020-10-15T22:13:14.699Z",
     "contributors": [
       "xochilpili"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakMap/delete": {
+  "Web/JavaScript/Reference/Global_Objects/WeakMap/delete": {
     "modified": "2019-03-23T22:25:14.754Z",
     "contributors": [
       "xochilpili",
       "frank-orellana"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakMap/get": {
+  "Web/JavaScript/Reference/Global_Objects/WeakMap/get": {
     "modified": "2020-10-15T22:13:26.011Z",
     "contributors": [
       "xochilpili"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakMap/has": {
+  "Web/JavaScript/Reference/Global_Objects/WeakMap/has": {
     "modified": "2020-10-15T22:13:17.587Z",
     "contributors": [
       "xochilpili"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakMap/prototype": {
-    "modified": "2019-03-23T22:25:12.395Z",
+  "Web/JavaScript/Reference/Global_Objects/WeakMap": {
+    "modified": "2020-10-06T14:36:19.625Z",
     "contributors": [
-      "frank-orellana"
+      "oleksandrstarov",
+      "SphinxKnight",
+      "kdex",
+      "frank-orellana",
+      "oagarcia",
+      "willemsh"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakMap/set": {
+  "Web/JavaScript/Reference/Global_Objects/WeakMap/set": {
     "modified": "2020-10-15T22:13:19.744Z",
     "contributors": [
       "xochilpili"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WeakSet": {
+  "Web/JavaScript/Reference/Global_Objects/WeakSet": {
     "modified": "2019-03-23T22:06:27.270Z",
     "contributors": [
       "OliverAcosta",
       "roberbnd"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/WebAssembly": {
+  "Web/JavaScript/Reference/Global_Objects/WebAssembly": {
     "modified": "2020-10-15T22:00:20.969Z",
     "contributors": [
       "jvalencia"
     ]
   },
-  "Web/JavaScript/Referencia/Objetos_globales/decodeURI": {
-    "modified": "2020-03-12T19:36:57.753Z",
-    "contributors": [
-      "teoli",
-      "SphinxKnight",
-      "ADP13",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent": {
-    "modified": "2020-03-12T19:37:00.546Z",
-    "contributors": [
-      "jabarrioss",
-      "SphinxKnight",
-      "teoli",
-      "ADP13",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/encodeURI": {
-    "modified": "2020-03-12T19:36:55.391Z",
-    "contributors": [
-      "espipj",
-      "SphinxKnight",
-      "teoli",
-      "ADP13",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent": {
-    "modified": "2020-03-12T19:37:33.179Z",
-    "contributors": [
-      "jazjay",
-      "SphinxKnight",
-      "teoli",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/escape": {
-    "modified": "2020-10-15T21:56:14.356Z",
-    "contributors": [
-      "SphinxKnight",
-      "RozyP",
-      "IXTRUnai"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/eval": {
-    "modified": "2020-03-12T19:37:01.878Z",
-    "contributors": [
-      "driera",
-      "sergio_p_d",
-      "_cuco_",
-      "ericmartinezr",
-      "SphinxKnight",
-      "teoli",
-      "Mgjbot",
-      "Talisker",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/isFinite": {
-    "modified": "2020-03-12T19:37:31.231Z",
-    "contributors": [
-      "SphinxKnight",
-      "teoli",
-      "jarneygm",
-      "Mgjbot",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/isNaN": {
-    "modified": "2020-10-15T21:17:00.242Z",
-    "contributors": [
-      "jmmarco",
-      "juanarbol",
-      "SphinxKnight",
-      "teoli",
-      "Mgjbot",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/null": {
-    "modified": "2020-03-12T19:42:06.401Z",
-    "contributors": [
-      "mkiramu",
-      "ivanagui2",
-      "diegoazh",
-      "BubuAnabelas",
-      "hmorv",
-      "AugustoEsquen",
-      "AsLogd"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/parseFloat": {
-    "modified": "2020-07-04T20:00:21.182Z",
-    "contributors": [
-      "pilichanampe",
-      "SphinxKnight",
-      "teoli",
-      "Mgjbot",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/parseInt": {
-    "modified": "2020-03-12T19:37:31.195Z",
-    "contributors": [
-      "mitsurugi",
-      "teoli",
-      "daiant",
-      "SphinxKnight",
-      "Mgjbot",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/undefined": {
-    "modified": "2020-03-12T19:36:57.621Z",
-    "contributors": [
-      "IsaacAaron",
-      "Undre4m",
-      "BubuAnabelas",
-      "SphinxKnight",
-      "teoli",
-      "ADP13",
-      "Talisker",
-      "Mgjbot",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Objetos_globales/unescape": {
-    "modified": "2020-03-12T19:43:34.960Z",
-    "contributors": [
-      "DracotMolver"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores": {
-    "modified": "2020-10-15T21:16:41.341Z",
-    "contributors": [
-      "Nachec",
-      "BubuAnabelas",
-      "oagarcia",
-      "Alaon",
-      "SphinxKnight",
-      "Siro_Diaz",
-      "teoli",
-      "Mgjbot",
-      "Nathymig",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Adición": {
+  "Web/JavaScript/Reference/Operators/Addition": {
     "modified": "2020-10-15T22:31:13.303Z",
     "contributors": [
       "lord-reptilia"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Aritméticos": {
-    "modified": "2020-10-15T21:17:29.666Z",
-    "contributors": [
-      "lajaso",
-      "nelruk",
-      "enesimo",
-      "SphinxKnight",
-      "teoli",
-      "Mgjbot",
-      "Nathymig"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Asignacion": {
+  "Web/JavaScript/Reference/Operators/Assignment": {
     "modified": "2020-10-15T22:33:15.275Z",
     "contributors": [
       "FranciscoImanolSuarez"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Assignment_Operators": {
-    "modified": "2020-07-23T18:11:35.190Z",
+  "Web/JavaScript/Reference/Operators/async_function": {
+    "modified": "2020-10-15T22:26:51.970Z",
     "contributors": [
-      "n306r4ph",
-      "esreal12",
-      "BrodaNoel",
-      "maxbfmv55",
-      "maxbfmv"
+      "IsraelFloresDGA"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Bitwise_Operators": {
-    "modified": "2020-03-12T19:42:13.818Z",
+  "Web/JavaScript/Reference/Operators/await": {
+    "modified": "2020-10-15T21:58:10.309Z",
     "contributors": [
-      "Binariado",
-      "hugomosh",
-      "EduardoSebastian",
-      "jnreynoso",
-      "mizhac",
-      "lizzie136",
-      "josewhitetower",
-      "miparnisari",
-      "elenatorro",
-      "CarlosRuizAscacibar"
+      "esjuanma",
+      "jpinto7",
+      "JavierHspn",
+      "rcchristiane"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Comparacion": {
-    "modified": "2020-10-15T22:33:16.730Z",
+  "Web/JavaScript/Reference/Operators/class": {
+    "modified": "2020-03-12T19:45:04.654Z",
     "contributors": [
-      "FranciscoImanolSuarez"
+      "AlePerez92"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Comparison_Operators": {
-    "modified": "2020-10-15T21:37:54.340Z",
+  "Web/JavaScript/Reference/Operators/Equality": {
+    "modified": "2020-10-15T22:33:16.730Z",
     "contributors": [
-      "FranciscoImanolSuarez",
-      "lajaso",
-      "mfuentesg"
+      "FranciscoImanolSuarez"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Conditional_Operator": {
+  "Web/JavaScript/Reference/Operators/Conditional_Operator": {
     "modified": "2020-03-12T19:42:08.865Z",
     "contributors": [
       "mauroflamig",
@@ -22000,13 +21716,22 @@
       "joeljose"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Decremento": {
+  "Web/JavaScript/Reference/Operators/Decrement": {
     "modified": "2020-11-17T13:27:35.616Z",
     "contributors": [
       "FranciscoImanolSuarez"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Destructuring_assignment": {
+  "Web/JavaScript/Reference/Operators/delete": {
+    "modified": "2020-03-12T19:40:27.821Z",
+    "contributors": [
+      "abaracedo",
+      "elenatorro",
+      "oagarcia",
+      "rippe2hl"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/Destructuring_assignment": {
     "modified": "2020-10-15T21:38:20.062Z",
     "contributors": [
       "Nachec",
@@ -22023,125 +21748,25 @@
       "rvazquezglez"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Division": {
+  "Web/JavaScript/Reference/Operators/Division": {
     "modified": "2020-10-15T22:33:13.828Z",
     "contributors": [
       "FranciscoImanolSuarez"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Encadenamiento_opcional": {
+  "Web/JavaScript/Reference/Operators/Optional_chaining": {
     "modified": "2020-10-15T22:30:07.517Z",
     "contributors": [
       "glrodasz"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/Grouping": {
-    "modified": "2020-03-12T19:41:24.847Z",
-    "contributors": [
-      "oagarcia"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Miembros": {
-    "modified": "2020-03-12T19:37:28.144Z",
-    "contributors": [
-      "fpoumian",
-      "MarkelCuesta",
-      "SphinxKnight",
-      "teoli",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Operadores_lógicos": {
-    "modified": "2020-03-12T19:42:52.811Z",
-    "contributors": [
-      "albertor21",
-      "JuanMacias",
-      "lifescripter"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Operator_Precedence": {
-    "modified": "2020-03-12T19:39:15.282Z",
-    "contributors": [
-      "lopezz",
-      "fscholz",
-      "teoli",
-      "aerotrink"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Pipeline_operator": {
-    "modified": "2020-10-15T22:24:00.271Z",
-    "contributors": [
-      "nachofelpete"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Resto": {
-    "modified": "2020-12-04T18:18:23.327Z",
-    "contributors": [
-      "lucasmmaidana"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Sintaxis_Spread": {
-    "modified": "2020-10-15T22:05:27.684Z",
-    "contributors": [
-      "jeissonh",
-      "samm0023",
-      "jelduran",
-      "Aerz",
-      "duttyapps",
-      "alegnaaived"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Spread_operator": {
-    "modified": "2020-03-12T19:41:27.743Z",
-    "contributors": [
-      "SphinxKnight",
-      "Scipion",
-      "oagarcia"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Strict_equality": {
-    "modified": "2020-10-15T22:31:14.496Z",
-    "contributors": [
-      "lord-reptilia"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/Sustracción": {
-    "modified": "2020-10-15T22:31:11.477Z",
-    "contributors": [
-      "lord-reptilia"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/async_function": {
-    "modified": "2020-10-15T22:26:51.970Z",
-    "contributors": [
-      "IsraelFloresDGA"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/await": {
-    "modified": "2020-10-15T21:58:10.309Z",
-    "contributors": [
-      "esjuanma",
-      "jpinto7",
-      "JavierHspn",
-      "rcchristiane"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/class": {
-    "modified": "2020-03-12T19:45:04.654Z",
-    "contributors": [
-      "AlePerez92"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/delete": {
-    "modified": "2020-03-12T19:40:27.821Z",
+  "Web/JavaScript/Reference/Operators/function*": {
+    "modified": "2020-10-15T22:04:00.800Z",
     "contributors": [
-      "abaracedo",
-      "elenatorro",
-      "oagarcia",
-      "rippe2hl"
+      "daniel.duarte"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/function": {
+  "Web/JavaScript/Reference/Operators/function": {
     "modified": "2020-03-12T19:37:57.703Z",
     "contributors": [
       "germanf",
@@ -22151,13 +21776,13 @@
       "artopal"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/function*": {
-    "modified": "2020-10-15T22:04:00.800Z",
+  "Web/JavaScript/Reference/Operators/Grouping": {
+    "modified": "2020-03-12T19:41:24.847Z",
     "contributors": [
-      "daniel.duarte"
+      "oagarcia"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/in": {
+  "Web/JavaScript/Reference/Operators/in": {
     "modified": "2020-10-15T21:19:59.064Z",
     "contributors": [
       "AlePerez92",
@@ -22167,7 +21792,22 @@
       "carloshs92"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/instanceof": {
+  "Web/JavaScript/Reference/Operators": {
+    "modified": "2020-10-15T21:16:41.341Z",
+    "contributors": [
+      "Nachec",
+      "BubuAnabelas",
+      "oagarcia",
+      "Alaon",
+      "SphinxKnight",
+      "Siro_Diaz",
+      "teoli",
+      "Mgjbot",
+      "Nathymig",
+      "Sheppy"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/instanceof": {
     "modified": "2020-03-12T19:37:27.128Z",
     "contributors": [
       "KikeSan",
@@ -22178,7 +21818,23 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/new": {
+  "Web/JavaScript/Reference/Operators/Property_Accessors": {
+    "modified": "2020-03-12T19:37:28.144Z",
+    "contributors": [
+      "fpoumian",
+      "MarkelCuesta",
+      "SphinxKnight",
+      "teoli",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/new.target": {
+    "modified": "2020-03-12T19:45:24.263Z",
+    "contributors": [
+      "jorgecas"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/new": {
     "modified": "2020-10-15T21:27:34.155Z",
     "contributors": [
       "Nachec",
@@ -22191,20 +21847,52 @@
       "jansanchez"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/new.target": {
-    "modified": "2020-03-12T19:45:24.263Z",
-    "contributors": [
-      "jorgecas"
-    ]
-  },
-  "Web/JavaScript/Referencia/Operadores/operador_coma": {
+  "Web/JavaScript/Reference/Operators/Comma_Operator": {
     "modified": "2020-03-12T19:43:05.807Z",
     "contributors": [
       "aeroxmotion",
       "eduardogm"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/super": {
+  "Web/JavaScript/Reference/Operators/Operator_Precedence": {
+    "modified": "2020-03-12T19:39:15.282Z",
+    "contributors": [
+      "lopezz",
+      "fscholz",
+      "teoli",
+      "aerotrink"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/Pipeline_operator": {
+    "modified": "2020-10-15T22:24:00.271Z",
+    "contributors": [
+      "nachofelpete"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/Remainder": {
+    "modified": "2020-12-04T18:18:23.327Z",
+    "contributors": [
+      "lucasmmaidana"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/Spread_syntax": {
+    "modified": "2020-10-15T22:05:27.684Z",
+    "contributors": [
+      "jeissonh",
+      "samm0023",
+      "jelduran",
+      "Aerz",
+      "duttyapps",
+      "alegnaaived"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/Strict_equality": {
+    "modified": "2020-10-15T22:31:14.496Z",
+    "contributors": [
+      "lord-reptilia"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/super": {
     "modified": "2020-10-15T21:36:09.783Z",
     "contributors": [
       "caepalomo",
@@ -22213,7 +21901,13 @@
       "oagarcia"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/this": {
+  "Web/JavaScript/Reference/Operators/Subtraction": {
+    "modified": "2020-10-15T22:31:11.477Z",
+    "contributors": [
+      "lord-reptilia"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/this": {
     "modified": "2020-04-05T17:39:51.929Z",
     "contributors": [
       "ridry",
@@ -22230,7 +21924,7 @@
       "carloshs92"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/typeof": {
+  "Web/JavaScript/Reference/Operators/typeof": {
     "modified": "2020-03-12T19:37:27.888Z",
     "contributors": [
       "dashaus",
@@ -22245,7 +21939,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/void": {
+  "Web/JavaScript/Reference/Operators/void": {
     "modified": "2020-03-12T19:37:37.188Z",
     "contributors": [
       "JuanMaRuiz",
@@ -22256,7 +21950,13 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/yield": {
+  "Web/JavaScript/Reference/Operators/yield*": {
+    "modified": "2020-03-12T19:43:03.721Z",
+    "contributors": [
+      "germanf"
+    ]
+  },
+  "Web/JavaScript/Reference/Operators/yield": {
     "modified": "2020-10-15T21:59:31.243Z",
     "contributors": [
       "Nachec",
@@ -22266,44 +21966,7 @@
       "juliandavidmr"
     ]
   },
-  "Web/JavaScript/Referencia/Operadores/yield*": {
-    "modified": "2020-03-12T19:43:03.721Z",
-    "contributors": [
-      "germanf"
-    ]
-  },
-  "Web/JavaScript/Referencia/Palabras_Reservadas": {
-    "modified": "2019-03-23T23:46:34.387Z",
-    "contributors": [
-      "gsalinase",
-      "Gabrielth2206",
-      "Heramalva",
-      "teoli",
-      "Sheppy",
-      "Nathymig"
-    ]
-  },
-  "Web/JavaScript/Referencia/Sentencias": {
-    "modified": "2020-05-11T14:52:51.956Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Daniel_Martin",
-      "ffulgencio",
-      "BubuAnabelas",
-      "katrina.warsaw",
-      "SphinxKnight",
-      "teoli",
-      "Nathymig",
-      "Sheppy"
-    ]
-  },
-  "Web/JavaScript/Referencia/Sentencias/Empty": {
-    "modified": "2020-03-12T19:45:08.866Z",
-    "contributors": [
-      "Undre4m"
-    ]
-  },
-  "Web/JavaScript/Referencia/Sentencias/block": {
+  "Web/JavaScript/Reference/Statements/block": {
     "modified": "2020-03-12T19:37:26.144Z",
     "contributors": [
       "IsaacAaron",
@@ -22312,7 +21975,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/break": {
+  "Web/JavaScript/Reference/Statements/break": {
     "modified": "2020-03-12T19:37:25.893Z",
     "contributors": [
       "SphinxKnight",
@@ -22320,14 +21983,14 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/class": {
+  "Web/JavaScript/Reference/Statements/class": {
     "modified": "2020-03-12T19:43:15.247Z",
     "contributors": [
       "AlePerez92",
       "PauPeinado"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/const": {
+  "Web/JavaScript/Reference/Statements/const": {
     "modified": "2020-05-18T16:35:39.912Z",
     "contributors": [
       "jorgetoloza",
@@ -22341,7 +22004,7 @@
       "Scipion"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/continue": {
+  "Web/JavaScript/Reference/Statements/continue": {
     "modified": "2020-03-12T19:37:24.424Z",
     "contributors": [
       "SphinxKnight",
@@ -22349,20 +22012,14 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/debugger": {
+  "Web/JavaScript/Reference/Statements/debugger": {
     "modified": "2020-03-12T19:43:07.073Z",
     "contributors": [
       "VictorAbdon",
       "ericpennachini"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/default": {
-    "modified": "2020-10-15T22:11:48.475Z",
-    "contributors": [
-      "Davids-Devel"
-    ]
-  },
-  "Web/JavaScript/Referencia/Sentencias/do...while": {
+  "Web/JavaScript/Reference/Statements/do...while": {
     "modified": "2020-03-19T20:41:26.735Z",
     "contributors": [
       "danielclavijo19380",
@@ -22372,7 +22029,13 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/export": {
+  "Web/JavaScript/Reference/Statements/Empty": {
+    "modified": "2020-03-12T19:45:08.866Z",
+    "contributors": [
+      "Undre4m"
+    ]
+  },
+  "Web/JavaScript/Reference/Statements/export": {
     "modified": "2020-10-15T21:13:05.178Z",
     "contributors": [
       "AlePerez92",
@@ -22386,21 +22049,13 @@
       "Scipion"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/for": {
-    "modified": "2020-03-12T19:37:24.852Z",
-    "contributors": [
-      "SphinxKnight",
-      "teoli",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Sentencias/for-await...of": {
+  "Web/JavaScript/Reference/Statements/for-await...of": {
     "modified": "2020-10-15T22:22:58.735Z",
     "contributors": [
       "daniel.duarte"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/for...in": {
+  "Web/JavaScript/Reference/Statements/for...in": {
     "modified": "2020-10-15T21:14:45.435Z",
     "contributors": [
       "Nachec",
@@ -22419,7 +22074,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/for...of": {
+  "Web/JavaScript/Reference/Statements/for...of": {
     "modified": "2020-03-12T19:43:09.602Z",
     "contributors": [
       "camsa",
@@ -22430,7 +22085,15 @@
       "Angarsk8"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/funcion_asincrona": {
+  "Web/JavaScript/Reference/Statements/for": {
+    "modified": "2020-03-12T19:37:24.852Z",
+    "contributors": [
+      "SphinxKnight",
+      "teoli",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Statements/async_function": {
     "modified": "2020-10-15T21:53:45.353Z",
     "contributors": [
       "docxml",
@@ -22441,15 +22104,7 @@
       "feserafim"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/function": {
-    "modified": "2020-03-12T19:37:28.203Z",
-    "contributors": [
-      "SphinxKnight",
-      "teoli",
-      "Talisker"
-    ]
-  },
-  "Web/JavaScript/Referencia/Sentencias/function*": {
+  "Web/JavaScript/Reference/Statements/function*": {
     "modified": "2020-03-12T19:41:28.405Z",
     "contributors": [
       "SphinxKnight",
@@ -22462,7 +22117,15 @@
       "germanfr"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/if...else": {
+  "Web/JavaScript/Reference/Statements/function": {
+    "modified": "2020-03-12T19:37:28.203Z",
+    "contributors": [
+      "SphinxKnight",
+      "teoli",
+      "Talisker"
+    ]
+  },
+  "Web/JavaScript/Reference/Statements/if...else": {
     "modified": "2020-03-12T19:35:35.125Z",
     "contributors": [
       "IsaacAaron",
@@ -22473,7 +22136,13 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/import": {
+  "Web/JavaScript/Reference/Statements/import.meta": {
+    "modified": "2020-10-15T22:29:50.934Z",
+    "contributors": [
+      "cinthylli"
+    ]
+  },
+  "Web/JavaScript/Reference/Statements/import": {
     "modified": "2020-10-15T21:37:35.456Z",
     "contributors": [
       "AlePerez92",
@@ -22485,13 +22154,21 @@
       "jepumares"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/import.meta": {
-    "modified": "2020-10-15T22:29:50.934Z",
+  "Web/JavaScript/Reference/Statements": {
+    "modified": "2020-05-11T14:52:51.956Z",
     "contributors": [
-      "cinthylli"
+      "chrisdavidmills",
+      "Daniel_Martin",
+      "ffulgencio",
+      "BubuAnabelas",
+      "katrina.warsaw",
+      "SphinxKnight",
+      "teoli",
+      "Nathymig",
+      "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/label": {
+  "Web/JavaScript/Reference/Statements/label": {
     "modified": "2020-03-12T19:37:26.348Z",
     "contributors": [
       "SphinxKnight",
@@ -22499,7 +22176,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/let": {
+  "Web/JavaScript/Reference/Statements/let": {
     "modified": "2020-12-07T12:54:41.333Z",
     "contributors": [
       "FacuBustamaante",
@@ -22519,7 +22196,7 @@
       "jtanori"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/return": {
+  "Web/JavaScript/Reference/Statements/return": {
     "modified": "2020-03-12T19:37:28.480Z",
     "contributors": [
       "devconcept",
@@ -22530,7 +22207,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/switch": {
+  "Web/JavaScript/Reference/Statements/switch": {
     "modified": "2020-12-10T14:59:55.680Z",
     "contributors": [
       "Celiamf",
@@ -22549,7 +22226,7 @@
       "christpher_c"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/throw": {
+  "Web/JavaScript/Reference/Statements/throw": {
     "modified": "2020-03-12T19:37:27.469Z",
     "contributors": [
       "imNicoSuarez",
@@ -22558,7 +22235,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/try...catch": {
+  "Web/JavaScript/Reference/Statements/try...catch": {
     "modified": "2020-05-28T10:16:13.325Z",
     "contributors": [
       "dkmstr",
@@ -22575,7 +22252,7 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/var": {
+  "Web/JavaScript/Reference/Statements/var": {
     "modified": "2020-03-12T19:36:22.778Z",
     "contributors": [
       "IsaacAaron",
@@ -22587,7 +22264,7 @@
       "Sheppy"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/while": {
+  "Web/JavaScript/Reference/Statements/while": {
     "modified": "2020-03-12T19:35:40.292Z",
     "contributors": [
       "MaurooRen",
@@ -22598,14 +22275,14 @@
       "Talisker"
     ]
   },
-  "Web/JavaScript/Referencia/Sentencias/with": {
+  "Web/JavaScript/Reference/Statements/with": {
     "modified": "2020-03-12T19:42:08.065Z",
     "contributors": [
       "MarkelCuesta",
       "lokcito"
     ]
   },
-  "Web/JavaScript/Referencia/template_strings": {
+  "Web/JavaScript/Reference/Template_literals": {
     "modified": "2020-10-14T18:58:58.164Z",
     "contributors": [
       "Magdiel",
@@ -22620,14 +22297,7 @@
       "orasio"
     ]
   },
-  "Web/JavaScript/Shells": {
-    "modified": "2020-03-12T19:44:40.392Z",
-    "contributors": [
-      "davidenriq11",
-      "mamptecnocrata"
-    ]
-  },
-  "Web/JavaScript/Una_re-introducción_a_JavaScript": {
+  "Web/JavaScript/A_re-introduction_to_JavaScript": {
     "modified": "2020-09-01T08:31:36.135Z",
     "contributors": [
       "Nachec",
@@ -22654,355 +22324,61 @@
       "Jarkaos"
     ]
   },
-  "Web/JavaScript/Vectores_tipados": {
+  "Web/JavaScript/Typed_arrays": {
     "modified": "2020-10-15T21:37:33.978Z",
     "contributors": [
       "Nachec",
       "LeoE"
     ]
   },
-  "Web/JavaScript/enumeracion_y_propietario_de_propiedades": {
-    "modified": "2020-08-30T03:56:15.697Z",
-    "contributors": [
-      "Nachec",
-      "teoli",
-      "LeoHirsch"
-    ]
-  },
-  "Web/Manifest": {
-    "modified": "2020-07-18T01:40:57.131Z",
-    "contributors": [
-      "angelmlucero",
-      "ardillan",
-      "Zellius",
-      "Pablo_Bangueses",
-      "luisabarca",
-      "malonson",
-      "AlePerez92"
-    ]
-  },
-  "Web/MathML": {
-    "modified": "2020-10-15T21:24:26.572Z",
-    "contributors": [
-      "Undigon",
-      "teoli",
-      "fred.wang",
-      "ChaitanyaGSNR"
-    ]
-  },
-  "Web/MathML/Attribute": {
-    "modified": "2019-03-23T23:26:57.621Z",
-    "contributors": [
-      "LuifeR",
-      "ccarruitero",
-      "maedca"
-    ]
-  },
-  "Web/MathML/Authoring": {
-    "modified": "2019-03-23T23:27:02.180Z",
-    "contributors": [
-      "rafaqtro",
-      "fred.wang",
-      "voylinux",
-      "robertoasq",
-      "maedca"
-    ]
-  },
-  "Web/MathML/Elemento": {
+  "Web/MathML/Element": {
     "modified": "2019-03-23T23:37:26.121Z",
     "contributors": [
       "teoli",
       "emejotados"
     ]
   },
-  "Web/MathML/Elemento/math": {
+  "Web/MathML/Element/math": {
     "modified": "2020-10-15T22:06:20.810Z",
     "contributors": [
       "Undigon"
     ]
   },
-  "Web/MathML/Examples": {
-    "modified": "2019-03-23T23:25:26.042Z",
-    "contributors": [
-      "nielsdg"
-    ]
-  },
-  "Web/MathML/Examples/MathML_Pythagorean_Theorem": {
-    "modified": "2019-03-23T23:25:28.102Z",
-    "contributors": [
-      "osvaldobaeza"
-    ]
-  },
-  "Web/Media": {
-    "modified": "2020-07-15T09:47:41.711Z",
-    "contributors": [
-      "Sheppy"
-    ]
-  },
-  "Web/Media/Formats": {
-    "modified": "2020-07-15T09:47:42.018Z",
-    "contributors": [
-      "Sheppy"
-    ]
-  },
-  "Web/Media/Formats/Containers": {
-    "modified": "2020-07-15T09:47:51.166Z",
-    "contributors": [
-      "hugojavierduran9"
-    ]
-  },
-  "Web/Performance": {
-    "modified": "2019-04-04T19:28:41.844Z",
-    "contributors": [
-      "arekucr",
-      "chrisdavidmills"
-    ]
-  },
-  "Web/Performance/Fundamentals": {
-    "modified": "2019-05-05T06:54:02.458Z",
-    "contributors": [
-      "c-torres"
-    ]
-  },
-  "Web/Performance/How_browsers_work": {
-    "modified": "2020-09-10T10:11:23.592Z",
-    "contributors": [
-      "sancarbar"
-    ]
-  },
-  "Web/Performance/mejorando_rendimienot_inicial": {
+  "Web/Performance/Optimizing_startup_performance": {
     "modified": "2019-04-04T17:42:18.542Z",
     "contributors": [
       "c-torres"
     ]
   },
-  "Web/Progressive_web_apps": {
-    "modified": "2020-09-20T04:18:55.064Z",
-    "contributors": [
-      "Nachec",
-      "Enesimus",
-      "chrisdavidmills",
-      "hypnotic-frog",
-      "javichito"
-    ]
-  },
-  "Web/Progressive_web_apps/App_structure": {
-    "modified": "2020-09-20T03:39:21.273Z",
-    "contributors": [
-      "Nachec",
-      "NicolasKuhn"
-    ]
-  },
-  "Web/Progressive_web_apps/Developer_guide": {
-    "modified": "2020-09-20T03:25:40.381Z",
-    "contributors": [
-      "Deng_C1"
-    ]
-  },
-  "Web/Progressive_web_apps/Developer_guide/Instalar": {
+  "Web/Progressive_web_apps/Developer_guide/Installing": {
     "modified": "2020-09-20T03:25:41.762Z",
     "contributors": [
       "Nachec"
     ]
   },
-  "Web/Progressive_web_apps/Installable_PWAs": {
-    "modified": "2020-09-20T03:54:28.154Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/Progressive_web_apps/Introduction": {
-    "modified": "2020-09-20T03:34:06.424Z",
-    "contributors": [
-      "Nachec",
-      "gastono.442",
-      "tw1ttt3r",
-      "santi324",
-      "chrisdavidmills"
-    ]
-  },
-  "Web/Progressive_web_apps/Loading": {
-    "modified": "2020-09-20T04:08:37.661Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/Progressive_web_apps/Offline_Service_workers": {
-    "modified": "2020-09-20T03:45:55.671Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/Progressive_web_apps/Re-engageable_Notifications_Push": {
-    "modified": "2020-09-20T04:04:04.639Z",
-    "contributors": [
-      "Nachec"
-    ]
-  },
-  "Web/Progressive_web_apps/Ventajas": {
-    "modified": "2019-11-03T14:52:14.998Z",
-    "contributors": [
-      "totopizzahn"
-    ]
-  },
-  "Web/Reference": {
-    "modified": "2019-03-23T23:21:27.898Z",
-    "contributors": [
-      "raecillacastellana",
-      "vltamara",
-      "asero82",
-      "atlas7jean",
-      "Nickolay"
-    ]
-  },
-  "Web/Reference/API": {
-    "modified": "2019-03-23T23:20:25.941Z",
-    "contributors": [
-      "AlePerez92",
-      "jhia",
-      "welm",
-      "vggallego",
-      "DeiberChacon",
-      "angmauricio",
-      "vitoco",
-      "CristianMar25",
-      "gesifred",
-      "cmeraz",
-      "davy.martinez"
-    ]
-  },
-  "Web/SVG": {
-    "modified": "2019-03-23T23:44:20.243Z",
-    "contributors": [
-      "Undigon",
-      "Noradrex",
-      "teoli",
-      "Verruckt",
-      "Jorolo",
-      "Mgjbot",
-      "Josebagar"
-    ]
-  },
-  "Web/SVG/Attribute": {
-    "modified": "2019-08-04T03:46:23.452Z",
-    "contributors": [
-      "jcortesa",
-      "chrisdavidmills"
-    ]
-  },
-  "Web/SVG/Attribute/stop-color": {
-    "modified": "2020-10-15T22:06:34.292Z",
-    "contributors": [
-      "andcal"
-    ]
-  },
-  "Web/SVG/Attribute/transform": {
-    "modified": "2019-03-23T22:07:32.328Z",
-    "contributors": [
-      "dimuziop"
-    ]
-  },
-  "Web/SVG/Element": {
-    "modified": "2019-03-19T13:42:20.553Z",
-    "contributors": [
-      "borja",
-      "jmanquez",
-      "kscarfone"
-    ]
-  },
-  "Web/SVG/Element/a": {
-    "modified": "2020-10-15T22:16:15.979Z",
-    "contributors": [
-      "borja"
-    ]
-  },
-  "Web/SVG/Element/animate": {
-    "modified": "2020-10-15T22:09:39.514Z",
-    "contributors": [
-      "evaferreira"
-    ]
-  },
-  "Web/SVG/Element/circle": {
-    "modified": "2019-03-23T22:57:12.727Z",
-    "contributors": [
-      "wbamberg",
-      "Sebastianz",
-      "humbertaco"
-    ]
-  },
-  "Web/SVG/Element/foreignObject": {
-    "modified": "2019-03-23T23:05:21.297Z",
+  "Web/Security/Same-origin_policy": {
+    "modified": "2020-12-10T07:41:38.226Z",
     "contributors": [
-      "Sebastianz",
-      "THernandez03"
+      "ojgarciab",
+      "robertsallent",
+      "Abelhg"
     ]
   },
-  "Web/SVG/Element/g": {
-    "modified": "2019-03-23T22:54:18.875Z",
+  "Web/Security/Securing_your_site/Turning_off_form_autocompletion": {
+    "modified": "2019-03-23T22:04:06.546Z",
     "contributors": [
-      "Sebastianz",
-      "teoli",
-      "FrankzWolf"
+      "samus128",
+      "Hoosep"
     ]
   },
-  "Web/SVG/Element/glifo": {
+  "Web/SVG/Element/glyph": {
     "modified": "2019-03-23T22:53:24.929Z",
     "contributors": [
       "Sebastianz",
       "saeioul"
     ]
   },
-  "Web/SVG/Element/rect": {
-    "modified": "2019-03-23T23:02:06.920Z",
-    "contributors": [
-      "wbamberg",
-      "roadev",
-      "Sebastianz",
-      "jdgarrido"
-    ]
-  },
-  "Web/SVG/Element/style": {
-    "modified": "2019-03-23T22:54:27.955Z",
-    "contributors": [
-      "Sebastianz",
-      "teoli",
-      "rippe2hl"
-    ]
-  },
-  "Web/SVG/Element/svg": {
-    "modified": "2020-11-04T10:23:00.659Z",
-    "contributors": [
-      "hardy.rafael17",
-      "Mcch",
-      "diegovinie",
-      "BubuAnabelas",
-      "mbenitez01"
-    ]
-  },
-  "Web/SVG/Element/text": {
-    "modified": "2020-05-14T06:42:53.448Z",
-    "contributors": [
-      "danielhiguerasgoold",
-      "Sebastianz",
-      "emorc"
-    ]
-  },
-  "Web/SVG/Element/use": {
-    "modified": "2019-03-23T22:58:09.476Z",
-    "contributors": [
-      "andysierra",
-      "Sebastianz",
-      "jorge_castro"
-    ]
-  },
-  "Web/SVG/Index": {
-    "modified": "2019-01-16T22:36:49.773Z",
-    "contributors": [
-      "jwhitlock",
-      "ComplementosMozilla"
-    ]
-  },
-  "Web/SVG/SVG_en_Firefox_1.5": {
+  "orphaned/Web/SVG/SVG_en_Firefox_1.5": {
     "modified": "2019-03-23T23:42:07.791Z",
     "contributors": [
       "teoli",
@@ -23011,102 +22387,14 @@
       "Arcnor"
     ]
   },
-  "Web/SVG/Tutorial": {
-    "modified": "2020-01-15T20:06:40.249Z",
-    "contributors": [
-      "dago.d.havana",
-      "jpriet0",
-      "d-go",
-      "Npmada",
-      "teoli",
-      "Jeremie"
-    ]
-  },
-  "Web/SVG/Tutorial/Getting_Started": {
-    "modified": "2019-03-23T23:19:26.348Z",
-    "contributors": [
-      "kevinricardojs",
-      "teoli",
-      "Alberpat"
-    ]
-  },
-  "Web/SVG/Tutorial/Introducción": {
+  "Web/SVG/Tutorial/Introduction": {
     "modified": "2019-03-18T21:32:37.330Z",
     "contributors": [
       "Undigon",
       "d-go"
     ]
   },
-  "Web/SVG/Tutorial/SVG_In_HTML_Introduction": {
-    "modified": "2019-03-23T23:21:05.945Z",
-    "contributors": [
-      "chrisdavidmills",
-      "matrimonio",
-      "verma21",
-      "marelin"
-    ]
-  },
-  "Web/SVG/Tutorial/Tools_for_SVG": {
-    "modified": "2019-03-20T13:46:46.393Z",
-    "contributors": [
-      "James-Yaakov"
-    ]
-  },
-  "Web/Security": {
-    "modified": "2019-09-10T16:32:01.356Z",
-    "contributors": [
-      "SphinxKnight",
-      "npcsayfail",
-      "lejovaar7",
-      "fgcalderon",
-      "pablodonoso",
-      "marumari"
-    ]
-  },
-  "Web/Security/CSP": {
-    "modified": "2019-03-23T22:48:09.013Z",
-    "contributors": [
-      "Anteojudo",
-      "Nydv"
-    ]
-  },
-  "Web/Security/CSP/CSP_policy_directives": {
-    "modified": "2019-03-23T22:46:40.903Z",
-    "contributors": [
-      "rafamagno",
-      "maedca"
-    ]
-  },
-  "Web/Security/CSP/Introducing_Content_Security_Policy": {
-    "modified": "2019-01-16T21:25:25.758Z",
-    "contributors": [
-      "Anteojudo",
-      "Nydv"
-    ]
-  },
-  "Web/Security/Same-origin_politica": {
-    "modified": "2020-12-10T07:41:38.226Z",
-    "contributors": [
-      "ojgarciab",
-      "robertsallent",
-      "Abelhg"
-    ]
-  },
-  "Web/Security/Securing_your_site": {
-    "modified": "2019-03-23T22:04:13.465Z",
-    "contributors": [
-      "fgcalderon",
-      "mbm"
-    ]
-  },
-  "Web/Security/Securing_your_site/desactivar_autocompletado_formulario": {
-    "modified": "2019-03-23T22:04:06.546Z",
-    "contributors": [
-      "samus128",
-      "Hoosep"
-    ]
-  },
-  "Web/Tutoriales": {
+  "Web/Tutorials": {
     "modified": "2020-11-30T04:19:10.869Z",
     "contributors": [
       "blanchart",
@@ -23130,58 +22418,7 @@
       "diegogaysaez"
     ]
   },
-  "Web/Web_Components": {
-    "modified": "2020-05-21T13:06:07.299Z",
-    "contributors": [
-      "aguilerajl",
-      "Ktoxcon",
-      "IsraelFloresDGA",
-      "mboo",
-      "Rodmore",
-      "maybe"
-    ]
-  },
-  "Web/Web_Components/Custom_Elements": {
-    "modified": "2019-03-23T22:21:51.809Z",
-    "contributors": [
-      "cawilff",
-      "AlePerez92",
-      "fipadron",
-      "V.Morantes"
-    ]
-  },
-  "Web/Web_Components/Using_custom_elements": {
-    "modified": "2020-06-28T18:39:06.239Z",
-    "contributors": [
-      "lupomontero",
-      "aguilerajl"
-    ]
-  },
-  "Web/Web_Components/Using_shadow_DOM": {
-    "modified": "2020-10-24T17:36:39.409Z",
-    "contributors": [
-      "jephsanchez",
-      "Charlemagnes",
-      "quintero_japon",
-      "DavidGalvis"
-    ]
-  },
-  "Web/Web_Components/Using_templates_and_slots": {
-    "modified": "2020-03-26T15:38:45.869Z",
-    "contributors": [
-      "olalinv",
-      "quintero_japon",
-      "BrunoUY",
-      "ulisestrujillo"
-    ]
-  },
-  "Web/XML": {
-    "modified": "2019-03-18T21:18:03.528Z",
-    "contributors": [
-      "ExE-Boss"
-    ]
-  },
-  "Web/XML/Introducción_a_XML": {
+  "Web/XML/XML_introduction": {
     "modified": "2019-07-25T12:38:17.842Z",
     "contributors": [
       "jugonzalez40",
@@ -23194,26 +22431,15 @@
       "Jorolo"
     ]
   },
-  "Web/XPath": {
-    "modified": "2019-01-16T14:32:30.886Z",
-    "contributors": [
-      "ExE-Boss",
-      "fscholz",
-      "Mgjbot",
-      "Jorolo"
-    ]
-  },
-  "Web/XPath/Ejes": {
-    "modified": "2019-03-18T20:59:19.791Z",
+  "Web/XPath/Axes/ancestor-or-self": {
+    "modified": "2019-01-16T16:11:00.606Z",
     "contributors": [
-      "SphinxKnight",
       "ExE-Boss",
       "Mgjbot",
-      "Jorolo",
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/ancestor": {
+  "Web/XPath/Axes/ancestor": {
     "modified": "2019-01-16T16:11:09.049Z",
     "contributors": [
       "ExE-Boss",
@@ -23221,31 +22447,31 @@
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/ancestor-or-self": {
-    "modified": "2019-01-16T16:11:00.606Z",
+  "Web/XPath/Axes/attribute": {
+    "modified": "2019-01-16T16:11:03.106Z",
     "contributors": [
       "ExE-Boss",
       "Mgjbot",
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/attribute": {
-    "modified": "2019-01-16T16:11:03.106Z",
+  "Web/XPath/Axes/child": {
+    "modified": "2019-01-16T16:11:02.142Z",
     "contributors": [
       "ExE-Boss",
       "Mgjbot",
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/child": {
-    "modified": "2019-01-16T16:11:02.142Z",
+  "Web/XPath/Axes/descendant-or-self": {
+    "modified": "2019-01-16T16:11:00.088Z",
     "contributors": [
       "ExE-Boss",
       "Mgjbot",
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/descendant": {
+  "Web/XPath/Axes/descendant": {
     "modified": "2019-01-16T16:11:00.301Z",
     "contributors": [
       "ExE-Boss",
@@ -23253,15 +22479,15 @@
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/descendant-or-self": {
-    "modified": "2019-01-16T16:11:00.088Z",
+  "Web/XPath/Axes/following-sibling": {
+    "modified": "2019-01-16T16:11:02.465Z",
     "contributors": [
       "ExE-Boss",
       "Mgjbot",
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/following": {
+  "Web/XPath/Axes/following": {
     "modified": "2019-01-16T16:10:55.079Z",
     "contributors": [
       "ExE-Boss",
@@ -23269,15 +22495,17 @@
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/following-sibling": {
-    "modified": "2019-01-16T16:11:02.465Z",
+  "Web/XPath/Axes": {
+    "modified": "2019-03-18T20:59:19.791Z",
     "contributors": [
+      "SphinxKnight",
       "ExE-Boss",
       "Mgjbot",
+      "Jorolo",
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/namespace": {
+  "Web/XPath/Axes/namespace": {
     "modified": "2019-01-16T16:10:55.086Z",
     "contributors": [
       "ExE-Boss",
@@ -23285,7 +22513,7 @@
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/parent": {
+  "Web/XPath/Axes/parent": {
     "modified": "2019-01-16T16:10:56.130Z",
     "contributors": [
       "ExE-Boss",
@@ -23293,30 +22521,23 @@
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/preceding": {
-    "modified": "2019-01-16T16:11:08.778Z",
+  "Web/XPath/Axes/preceding-sibling": {
+    "modified": "2019-01-16T16:10:57.298Z",
     "contributors": [
       "ExE-Boss",
       "Mgjbot",
       "Cmayo"
     ]
   },
-  "Web/XPath/Ejes/preceding-sibling": {
-    "modified": "2019-01-16T16:10:57.298Z",
+  "Web/XPath/Axes/preceding": {
+    "modified": "2019-01-16T16:11:08.778Z",
     "contributors": [
       "ExE-Boss",
       "Mgjbot",
       "Cmayo"
     ]
   },
-  "Web/XPath/Funciones": {
-    "modified": "2019-03-23T22:09:03.742Z",
-    "contributors": [
-      "ExE-Boss",
-      "Zoditu"
-    ]
-  },
-  "Web/XPath/Funciones/contains": {
+  "Web/XPath/Functions/contains": {
     "modified": "2019-01-16T15:50:22.864Z",
     "contributors": [
       "ExE-Boss",
@@ -23324,68 +22545,31 @@
       "Cmayo"
     ]
   },
-  "Web/XPath/Funciones/substring": {
-    "modified": "2019-01-16T15:50:01.578Z",
+  "Web/XPath/Functions": {
+    "modified": "2019-03-23T22:09:03.742Z",
     "contributors": [
       "ExE-Boss",
-      "Mgjbot",
-      "Cmayo"
+      "Zoditu"
     ]
   },
-  "Web/XPath/Funciones/true": {
-    "modified": "2019-03-18T20:59:19.925Z",
+  "Web/XPath/Functions/substring": {
+    "modified": "2019-01-16T15:50:01.578Z",
     "contributors": [
-      "SphinxKnight",
       "ExE-Boss",
       "Mgjbot",
       "Cmayo"
     ]
   },
-  "Web/XSLT": {
-    "modified": "2019-03-23T23:44:23.657Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Verruckt",
-      "Mgjbot",
-      "Jorolo",
-      "Nukeador",
-      "Piltrafeta"
-    ]
-  },
-  "Web/XSLT/Element": {
-    "modified": "2019-03-18T20:59:16.316Z",
-    "contributors": [
-      "SphinxKnight",
-      "ExE-Boss",
-      "chrisdavidmills",
-      "fscholz",
-      "Jorolo",
-      "ErickCastellanos"
-    ]
-  },
-  "Web/XSLT/Element/element": {
-    "modified": "2019-03-18T20:59:21.788Z",
+  "Web/XPath/Functions/true": {
+    "modified": "2019-03-18T20:59:19.925Z",
     "contributors": [
       "SphinxKnight",
       "ExE-Boss",
-      "chrisdavidmills",
-      "Mgjbot",
-      "ErickCastellanos"
-    ]
-  },
-  "Web/XSLT/Transformando_XML_con_XSLT": {
-    "modified": "2019-01-16T16:11:59.562Z",
-    "contributors": [
-      "chrisdavidmills",
-      "Superruzafa",
       "Mgjbot",
-      "Jorolo",
-      "Ivanfrade",
-      "Piltrafeta",
-      "Nukeador"
+      "Cmayo"
     ]
   },
-  "Web/XSLT/apply-imports": {
+  "Web/XSLT/Element/apply-imports": {
     "modified": "2019-03-18T20:59:15.544Z",
     "contributors": [
       "SphinxKnight",
@@ -23394,7 +22578,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/apply-templates": {
+  "Web/XSLT/Element/apply-templates": {
     "modified": "2019-03-18T20:59:18.352Z",
     "contributors": [
       "SphinxKnight",
@@ -23403,8 +22587,8 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/attribute": {
-    "modified": "2019-03-18T20:59:20.857Z",
+  "Web/XSLT/Element/attribute-set": {
+    "modified": "2019-03-18T20:59:20.997Z",
     "contributors": [
       "SphinxKnight",
       "chrisdavidmills",
@@ -23412,8 +22596,8 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/attribute-set": {
-    "modified": "2019-03-18T20:59:20.997Z",
+  "Web/XSLT/Element/attribute": {
+    "modified": "2019-03-18T20:59:20.857Z",
     "contributors": [
       "SphinxKnight",
       "chrisdavidmills",
@@ -23421,7 +22605,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/call-template": {
+  "Web/XSLT/Element/call-template": {
     "modified": "2019-03-18T20:59:16.448Z",
     "contributors": [
       "SphinxKnight",
@@ -23430,7 +22614,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/choose": {
+  "Web/XSLT/Element/choose": {
     "modified": "2019-03-18T20:59:21.136Z",
     "contributors": [
       "SphinxKnight",
@@ -23440,7 +22624,7 @@
       "Cmayo"
     ]
   },
-  "Web/XSLT/comment": {
+  "Web/XSLT/Element/comment": {
     "modified": "2019-03-18T20:59:15.680Z",
     "contributors": [
       "SphinxKnight",
@@ -23450,8 +22634,8 @@
       "Cmayo"
     ]
   },
-  "Web/XSLT/copy": {
-    "modified": "2019-03-18T20:59:16.879Z",
+  "Web/XSLT/Element/copy-of": {
+    "modified": "2019-03-18T20:59:18.212Z",
     "contributors": [
       "SphinxKnight",
       "chrisdavidmills",
@@ -23459,8 +22643,8 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/copy-of": {
-    "modified": "2019-03-18T20:59:18.212Z",
+  "Web/XSLT/Element/copy": {
+    "modified": "2019-03-18T20:59:16.879Z",
     "contributors": [
       "SphinxKnight",
       "chrisdavidmills",
@@ -23468,7 +22652,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/decimal-format": {
+  "Web/XSLT/Element/decimal-format": {
     "modified": "2019-03-18T20:59:17.054Z",
     "contributors": [
       "SphinxKnight",
@@ -23477,7 +22661,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/fallback": {
+  "Web/XSLT/Element/fallback": {
     "modified": "2019-03-18T20:59:15.971Z",
     "contributors": [
       "SphinxKnight",
@@ -23486,7 +22670,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/for-each": {
+  "Web/XSLT/Element/for-each": {
     "modified": "2019-03-18T20:59:16.114Z",
     "contributors": [
       "SphinxKnight",
@@ -23495,7 +22679,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/if": {
+  "Web/XSLT/Element/if": {
     "modified": "2019-03-18T20:59:17.200Z",
     "contributors": [
       "SphinxKnight",
@@ -23505,7 +22689,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/import": {
+  "Web/XSLT/Element/import": {
     "modified": "2019-03-18T20:59:15.818Z",
     "contributors": [
       "SphinxKnight",
@@ -23514,7 +22698,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/include": {
+  "Web/XSLT/Element/include": {
     "modified": "2019-03-18T20:59:17.940Z",
     "contributors": [
       "SphinxKnight",
@@ -23523,7 +22707,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/key": {
+  "Web/XSLT/Element/key": {
     "modified": "2019-03-18T20:59:21.931Z",
     "contributors": [
       "SphinxKnight",
@@ -23532,7 +22716,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/message": {
+  "Web/XSLT/Element/message": {
     "modified": "2019-03-18T20:59:16.585Z",
     "contributors": [
       "SphinxKnight",
@@ -23542,7 +22726,7 @@
       "Cmayo"
     ]
   },
-  "Web/XSLT/namespace-alias": {
+  "Web/XSLT/Element/namespace-alias": {
     "modified": "2019-03-18T20:59:19.621Z",
     "contributors": [
       "SphinxKnight",
@@ -23551,7 +22735,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/number": {
+  "Web/XSLT/Element/number": {
     "modified": "2019-03-18T20:59:21.341Z",
     "contributors": [
       "SphinxKnight",
@@ -23560,7 +22744,7 @@
       "ErickCastellanos"
     ]
   },
-  "Web/XSLT/otherwise": {
+  "Web/XSLT/Element/otherwise": {
     "modified": "2019-03-18T20:59:16.726Z",
     "contributors": [
       "SphinxKnight",
@@ -23570,7 +22754,19 @@
       "Cmayo"
     ]
   },
-  "Web/XSLT/when": {
+  "Web/XSLT/Transforming_XML_with_XSLT": {
+    "modified": "2019-01-16T16:11:59.562Z",
+    "contributors": [
+      "chrisdavidmills",
+      "Superruzafa",
+      "Mgjbot",
+      "Jorolo",
+      "Ivanfrade",
+      "Piltrafeta",
+      "Nukeador"
+    ]
+  },
+  "Web/XSLT/Element/when": {
     "modified": "2019-03-18T20:59:18.078Z",
     "contributors": [
       "SphinxKnight",
@@ -23580,7 +22776,7 @@
       "Cmayo"
     ]
   },
-  "Web/XSLT/with-param": {
+  "Web/XSLT/Element/with-param": {
     "modified": "2019-03-18T20:59:17.348Z",
     "contributors": [
       "SphinxKnight",
@@ -23590,24 +22786,13 @@
       "Cmayo"
     ]
   },
-  "WebAPI": {
-    "modified": "2019-03-23T23:32:09.157Z",
-    "contributors": [
-      "wbamberg",
-      "fscholz",
-      "ccarruitero",
-      "maedca",
-      "ethertank",
-      "Jeremie"
-    ]
-  },
-  "WebAPI/Estado_de_Bateria": {
+  "Web/API/Battery_Status_API": {
     "modified": "2019-03-23T23:25:28.703Z",
     "contributors": [
       "sinfallas"
     ]
   },
-  "WebAPI/Pointer_Lock": {
+  "Web/API/Pointer_Lock_API": {
     "modified": "2019-03-23T23:28:21.712Z",
     "contributors": [
       "fscholz",
@@ -23615,7 +22800,7 @@
       "joredjs"
     ]
   },
-  "WebAPI/Using_geolocation": {
+  "Web/API/Geolocation_API": {
     "modified": "2019-05-04T15:09:02.013Z",
     "contributors": [
       "mauroarcet",
@@ -23630,81 +22815,256 @@
       "diegogarcia"
     ]
   },
-  "WebAssembly": {
-    "modified": "2020-10-15T22:25:36.765Z",
-    "contributors": [
-      "jonathan.reyes33"
-    ]
-  },
-  "WebAssembly/Concepts": {
-    "modified": "2020-12-06T14:14:45.486Z",
-    "contributors": [
-      "Sergio_Gonzalez_Collado",
-      "mastertrooper"
-    ]
-  },
-  "WebAssembly/Loading_and_running": {
-    "modified": "2020-09-15T19:19:35.117Z",
-    "contributors": [
-      "mastertrooper"
-    ]
-  },
-  "WebRTC": {
-    "modified": "2019-03-23T23:26:58.291Z",
-    "contributors": [
-      "sebasmagri"
-    ]
-  },
-  "WebRTC/Introduction": {
+  "Web/API/WebRTC_API/Session_lifetime": {
     "modified": "2019-03-23T23:26:58.387Z",
     "contributors": [
       "maedca",
       "voylinux"
     ]
   },
-  "WebRTC/MediaStream_API": {
+  "Web/API/Media_Streams_API": {
     "modified": "2019-03-23T23:26:56.897Z",
     "contributors": [
       "palfrei",
       "maedca"
     ]
   },
-  "WebRTC/Peer-to-peer_communications_with_WebRTC": {
+  "Web/Guide/API/WebRTC/Peer-to-peer_communications_with_WebRTC": {
     "modified": "2019-03-23T23:27:02.999Z",
     "contributors": [
       "pablocubico",
       "maedca"
     ]
   },
-  "WebRTC/Taking_webcam_photos": {
+  "Web/API/WebRTC_API/Taking_still_photos": {
     "modified": "2019-03-23T23:26:57.758Z",
     "contributors": [
       "robertoasq",
       "maedca"
     ]
   },
-  "WebSockets": {
+  "conflicting/Web/API/WebSockets_API": {
     "modified": "2019-01-16T13:56:47.847Z",
     "contributors": [
       "inma_610"
     ]
   },
-  "Web_Audio_API": {
-    "modified": "2019-03-23T23:31:19.634Z",
+  "Glossary/XHTML": {
+    "modified": "2019-03-23T23:46:04.272Z",
     "contributors": [
-      "estebanborai",
-      "AngelFQC",
-      "Pau_Ilargia",
-      "maedca"
+      "Mgjbot",
+      "Jorolo",
+      "Nukeador"
     ]
   },
-  "Web_Development/Mobile": {
-    "modified": "2019-03-23T23:32:51.331Z",
+  "orphaned/XPInstall_API_Reference": {
+    "modified": "2019-01-16T15:37:54.457Z",
     "contributors": [
-      "wbamberg"
+      "Eddomita"
+    ]
+  },
+  "Mozilla/Firefox/Releases/3/Full_page_zoom": {
+    "modified": "2019-03-23T23:50:26.114Z",
+    "contributors": [
+      "wbamberg",
+      "Nukeador",
+      "Mariano",
+      "Mgjbot"
+    ]
+  },
+  "conflicting/Web/API/Document_Object_Model": {
+    "modified": "2019-03-24T00:02:47.149Z",
+    "contributors": [
+      "fscholz",
+      "Mgjbot",
+      "Nathymig",
+      "Jorolo"
+    ]
+  },
+  "conflicting/Web/OpenSearch": {
+    "modified": "2019-01-16T15:27:59.157Z",
+    "contributors": [
+      "Mgjbot",
+      "Superruzafa",
+      "Lesmo sft",
+      "Nukeador"
     ]
   },
-  "Web_Development/Mobile/Diseño_responsivo": {
+  "conflicting/Mozilla/Add-ons": {
+    "modified": "2019-03-23T23:19:24.053Z",
+    "contributors": [
+      "martin.weingart",
+      "Josele89"
+    ]
+  },
+  "Mozilla/Developer_guide/Build_Instructions": {
+    "modified": "2019-03-23T23:58:55.256Z",
+    "contributors": [
+      "teoli",
+      "DoctorRomi",
+      "Mgjbot",
+      "Blank zero"
+    ]
+  },
+  "conflicting/Web/HTML/Global_attributes/spellcheck": {
+    "modified": "2019-03-23T23:54:20.583Z",
+    "contributors": [
+      "raecillacastellana",
+      "vltamara",
+      "MxJ3susDi4z",
+      "teoli",
+      "Mgjbot",
+      "Jorolo",
+      "Omnisilver",
+      "Nukeador"
+    ]
+  },
+  "conflicting/Web/Guide": {
+    "modified": "2019-03-23T23:43:57.691Z",
+    "contributors": [
+      "Mgjbot",
+      "Jorolo"
+    ]
+  },
+  "conflicting/Web/API/Web_Storage_API": {
+    "modified": "2019-03-24T00:11:21.014Z",
+    "contributors": [
+      "AshfaqHossain",
+      "StripTM",
+      "RickieesES",
+      "inma_610",
+      "Mgjbot",
+      "Superruzafa",
+      "Nukeador"
+    ]
+  },
+  "conflicting/Web/API/Document_Object_Model_7d961b8030c6099ee907f4f4b5fe6b3d": {
+    "modified": "2019-03-24T00:03:50.113Z",
+    "contributors": [
+      "ethertank",
+      "fscholz",
+      "Mgjbot",
+      "Nukeador",
+      "Jorolo",
+      "Takenbot",
+      "julionc",
+      "Versae"
+    ]
+  },
+  "conflicting/Web/API/HTML_Drag_and_Drop_API": {
+    "modified": "2019-03-23T23:18:26.504Z",
+    "contributors": [
+      "drewp"
+    ]
+  },
+  "conflicting/Web/HTML/Global_attributes": {
+    "modified": "2019-03-18T21:19:21.658Z",
+    "contributors": [
+      "PabloDeTorre"
+    ]
+  },
+  "conflicting/Glossary/Doctype": {
+    "modified": "2019-01-17T00:20:06.485Z",
+    "contributors": [
+      "wilfridoSantos"
+    ]
+  },
+  "conflicting/Web/HTML/Element": {
+    "modified": "2020-01-21T22:36:54.135Z",
+    "contributors": [
+      "losfroger",
+      "cocoletzimata",
+      "Duque61",
+      "raecillacastellana",
+      "maymaury",
+      "squidjam",
+      "on3_g"
+    ]
+  },
+  "conflicting/Learn": {
+    "modified": "2020-07-16T22:22:13.785Z",
+    "contributors": [
+      "hamfree"
+    ]
+  },
+  "conflicting/MDN/Contribute/Getting_started": {
+    "modified": "2019-01-16T18:56:38.941Z",
+    "contributors": [
+      "wbamberg",
+      "MauricioGil",
+      "LeoHirsch"
+    ]
+  },
+  "MDN/Guidelines/CSS_style_guide": {
+    "modified": "2020-09-30T15:28:56.171Z",
+    "contributors": [
+      "chrisdavidmills",
+      "wbamberg",
+      "Jeremie",
+      "LeoHirsch"
+    ]
+  },
+  "conflicting/MDN/Yari": {
+    "modified": "2019-01-16T19:06:06.895Z",
+    "contributors": [
+      "wbamberg",
+      "Jeremie",
+      "MauricioGil"
+    ]
+  },
+  "conflicting/MDN/Yari_13d770b50d5ab9ce747962b2552e0eef": {
+    "modified": "2019-03-23T23:15:25.956Z",
+    "contributors": [
+      "wbamberg",
+      "Jeremie",
+      "MauricioGil"
+    ]
+  },
+  "conflicting/MDN/Tools": {
+    "modified": "2020-12-14T09:30:27.029Z",
+    "contributors": [
+      "wbamberg",
+      "Sheppy"
+    ]
+  },
+  "orphaned/Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox": {
+    "modified": "2019-03-23T22:45:27.399Z",
+    "contributors": [
+      "yuniers"
+    ]
+  },
+  "conflicting/Web/API/Document_Object_Model_9f3a59543838705de7e9b080fde3cc14": {
+    "modified": "2019-06-16T19:12:21.185Z",
+    "contributors": [
+      "jesusvillalta",
+      "Sheppy",
+      "Nathymig"
+    ]
+  },
+  "conflicting/Web/HTTP/Basics_of_HTTP/MIME_types": {
+    "modified": "2019-01-16T15:43:53.805Z",
+    "contributors": [
+      "Dailosmm",
+      "Mgjbot",
+      "Jorolo",
+      "Nukeador",
+      "Epaclon",
+      "Pasky"
+    ]
+  },
+  "conflicting/Tools/Performance": {
+    "modified": "2020-07-16T22:35:28.621Z",
+    "contributors": [
+      "MrDaza"
+    ]
+  },
+  "conflicting/Tools/about:debugging": {
+    "modified": "2020-07-16T22:35:41.552Z",
+    "contributors": [
+      "stephiemtz"
+    ]
+  },
+  "conflicting/Web/Progressive_web_apps": {
     "modified": "2019-03-23T23:32:50.922Z",
     "contributors": [
       "fitojb",
@@ -23714,34 +23074,674 @@
       "htrellez"
     ]
   },
-  "XHTML": {
-    "modified": "2019-03-23T23:46:04.272Z",
+  "conflicting/Web/Guide/Mobile": {
+    "modified": "2019-03-23T23:32:51.331Z",
     "contributors": [
-      "Mgjbot",
-      "Jorolo",
-      "Nukeador"
+      "wbamberg"
     ]
   },
-  "XPInstall_API_Reference": {
-    "modified": "2019-01-16T15:37:54.457Z",
+  "Web/API/DocumentOrShadowRoot/getSelection": {
+    "modified": "2019-03-23T22:54:50.239Z",
     "contributors": [
-      "Eddomita"
+      "Diferno"
     ]
   },
-  "Zoom_a_página_completa": {
-    "modified": "2019-03-23T23:50:26.114Z",
+  "Web/API/DocumentOrShadowRoot/styleSheets": {
+    "modified": "2019-03-23T23:58:05.224Z",
     "contributors": [
-      "wbamberg",
-      "Nukeador",
-      "Mariano",
+      "fscholz",
+      "jsx",
+      "teoli",
+      "HenryGR"
+    ]
+  },
+  "Web/API/HTMLElement/accessKey": {
+    "modified": "2019-03-23T22:26:12.172Z",
+    "contributors": [
+      "SoftwareRVG"
+    ]
+  },
+  "conflicting/Web/API": {
+    "modified": "2019-03-23T22:26:11.317Z",
+    "contributors": [
+      "SoftwareRVG"
+    ]
+  },
+  "Web/API/GlobalEventHandlers/ongotpointercapture": {
+    "modified": "2019-03-23T22:25:49.346Z",
+    "contributors": [
+      "SoftwareRVG"
+    ]
+  },
+  "Web/API/GlobalEventHandlers/onlostpointercapture": {
+    "modified": "2019-03-23T22:25:49.190Z",
+    "contributors": [
+      "SoftwareRVG"
+    ]
+  },
+  "Web/API/Document/createEvent": {
+    "modified": "2019-03-23T22:01:26.841Z",
+    "contributors": [
+      "AlePerez92"
+    ]
+  },
+  "conflicting/Web/API/Geolocation": {
+    "modified": "2019-03-23T23:01:31.642Z",
+    "contributors": [
+      "fscholz"
+    ]
+  },
+  "conflicting/Web/API/Node": {
+    "modified": "2019-03-23T22:08:57.260Z",
+    "contributors": [
+      "tureey"
+    ]
+  },
+  "conflicting/Web/API/Push_API": {
+    "modified": "2019-03-23T22:19:10.252Z",
+    "contributors": [
+      "YulianD"
+    ]
+  },
+  "conflicting/Web/API/Crypto/getRandomValues": {
+    "modified": "2019-03-23T22:25:15.548Z",
+    "contributors": [
+      "Jeremie"
+    ]
+  },
+  "conflicting/Web/API/Window/localStorage": {
+    "modified": "2020-07-20T09:10:56.525Z",
+    "contributors": [
+      "LucasMaciasAtala",
+      "moniqaveiga",
+      "Andresrodart",
+      "lsphantom"
+    ]
+  },
+  "conflicting/Web/API/URL": {
+    "modified": "2019-03-23T22:38:17.598Z",
+    "contributors": [
+      "israelfl"
+    ]
+  },
+  "conflicting/Web/API/WindowOrWorkerGlobalScope": {
+    "modified": "2019-03-23T23:03:15.466Z",
+    "contributors": [
+      "teoli"
+    ]
+  },
+  "conflicting/Web/API/WindowOrWorkerGlobalScope_e2691f7ad05781a30c5fc5bb3b3f633a": {
+    "modified": "2019-03-23T23:01:30.065Z",
+    "contributors": [
+      "fscholz"
+    ]
+  },
+  "conflicting/Web/CSS/:placeholder-shown": {
+    "modified": "2019-03-23T22:33:30.015Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "conflicting/Web/CSS/:placeholder-shown_f20b6cc785f9fd133a0f9fb582f36891": {
+    "modified": "2019-03-23T22:29:24.542Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/:is": {
+    "modified": "2019-03-23T22:17:18.601Z",
+    "contributors": [
+      "israel-munoz"
+    ]
+  },
+  "conflicting/Web/CSS/::placeholder": {
+    "modified": "2019-03-23T22:29:22.118Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "conflicting/Web/CSS/::placeholder_70bda352bb504ebdd6cd3362879e2479": {
+    "modified": "2019-03-18T21:16:20.006Z",
+    "contributors": [
+      "teoli",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/box-ordinal-group": {
+    "modified": "2019-03-23T22:36:12.257Z",
+    "contributors": [
+      "pekechis"
+    ]
+  },
+  "conflicting/Web/CSS/cursor": {
+    "modified": "2019-03-23T22:35:57.612Z",
+    "contributors": [
+      "pekechis"
+    ]
+  },
+  "Web/CSS/font-language-override": {
+    "modified": "2019-03-23T23:13:49.521Z",
+    "contributors": [
+      "martinezdario55"
+    ]
+  },
+  "Web/CSS/mask-clip": {
+    "modified": "2019-03-23T22:35:47.057Z",
+    "contributors": [
+      "pekechis"
+    ]
+  },
+  "Web/CSS/mask-image": {
+    "modified": "2019-03-23T22:35:45.973Z",
+    "contributors": [
+      "hectorcano",
+      "pekechis"
+    ]
+  },
+  "Web/CSS/mask-origin": {
+    "modified": "2019-03-23T22:35:46.533Z",
+    "contributors": [
+      "pekechis"
+    ]
+  },
+  "Web/CSS/mask-position": {
+    "modified": "2019-03-23T22:38:37.922Z",
+    "contributors": [
+      "teoli",
+      "Simplexible",
+      "Prinz_Rana",
+      "pekechis",
+      "Kuiki"
+    ]
+  },
+  "Web/CSS/mask-repeat": {
+    "modified": "2019-03-23T22:35:46.401Z",
+    "contributors": [
+      "pekechis"
+    ]
+  },
+  "Web/CSS/mask": {
+    "modified": "2019-03-23T22:35:50.079Z",
+    "contributors": [
+      "pekechis"
+    ]
+  },
+  "conflicting/Web/CSS/@viewport": {
+    "modified": "2019-03-18T21:38:59.253Z",
+    "contributors": [
+      "israel-munoz"
+    ]
+  },
+  "conflicting/Web/CSS/@viewport_c925ec0506b352ea1185248b874f7848": {
+    "modified": "2019-03-18T21:16:26.082Z",
+    "contributors": [
+      "israel-munoz"
+    ]
+  },
+  "conflicting/Web/CSS/width": {
+    "modified": "2019-01-16T15:41:51.944Z",
+    "contributors": [
+      "teoli",
+      "Nathymig",
+      "HenryGR",
       "Mgjbot"
     ]
   },
-  "nsDirectoryService": {
-    "modified": "2019-03-23T23:40:31.943Z",
+  "conflicting/Learn/CSS/First_steps/How_CSS_works": {
+    "modified": "2019-03-23T23:39:38.906Z",
     "contributors": [
       "teoli",
-      "Breaking Pitt"
+      "jsalinas"
+    ]
+  },
+  "conflicting/Learn/CSS/First_steps/How_CSS_works_a460b5a76c3c2e7fc9b8da464dfd0c22": {
+    "modified": "2019-03-24T00:11:28.788Z",
+    "contributors": [
+      "fernandomoreno605",
+      "DavidWebcreate",
+      "aguilarcarlos",
+      "teoli",
+      "LeoHirsch",
+      "dusvilopez",
+      "turekon",
+      "Izel"
+    ]
+  },
+  "Web/CSS/CSS_Backgrounds_and_Borders": {
+    "modified": "2019-03-23T22:41:48.399Z",
+    "contributors": [
+      "teoli"
+    ]
+  },
+  "Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds": {
+    "modified": "2019-03-23T22:17:03.740Z",
+    "contributors": [
+      "israel-munoz"
+    ]
+  },
+  "Web/CSS/CSS_Color": {
+    "modified": "2019-03-23T22:23:30.277Z",
+    "contributors": [
+      "betelleclerc",
+      "Krenair"
+    ]
+  },
+  "conflicting/Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox": {
+    "modified": "2019-03-23T22:31:07.427Z",
+    "contributors": [
+      "miguelsp"
+    ]
+  },
+  "conflicting/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox": {
+    "modified": "2019-05-15T19:01:41.614Z",
+    "contributors": [
+      "luzbelmex",
+      "VictorSan45",
+      "NeXuZZ-SCM",
+      "Tonylu11",
+      "javier_junin",
+      "AlePerez92",
+      "MMariscal",
+      "fscholz",
+      "ArcangelZith",
+      "FNK",
+      "rippe2hl",
+      "StripTM",
+      "joan.leon",
+      "arturo_sanz"
+    ]
+  },
+  "Web/CSS/url()": {
+    "modified": "2020-01-10T13:46:46.404Z",
+    "contributors": [
+      "roocce"
+    ]
+  },
+  "Web/CSS/column-gap": {
+    "modified": "2020-10-15T22:01:06.788Z",
+    "contributors": [
+      "agarcilazo",
+      "klaufel"
+    ]
+  },
+  "Web/CSS/gap": {
+    "modified": "2019-03-23T22:13:30.250Z",
+    "contributors": [
+      "ireneml.fr"
+    ]
+  },
+  "conflicting/Learn/CSS/Building_blocks": {
+    "modified": "2019-03-23T23:02:20.733Z",
+    "contributors": [
+      "albaluna"
+    ]
+  },
+  "conflicting/Learn/CSS/Building_blocks/Cascade_and_inheritance": {
+    "modified": "2019-03-23T23:02:26.342Z",
+    "contributors": [
+      "carlos.millan3",
+      "eljonims",
+      "mamptecnocrata",
+      "albaluna"
+    ]
+  },
+  "conflicting/Learn/CSS/Building_blocks/Values_and_units": {
+    "modified": "2019-03-23T22:59:44.751Z",
+    "contributors": [
+      "albaluna"
+    ]
+  },
+  "conflicting/Learn/CSS/First_steps/How_CSS_works_194e34e451d4ace023d98021c00b3cfd": {
+    "modified": "2019-03-23T23:02:23.335Z",
+    "contributors": [
+      "mamptecnocrata",
+      "albaluna"
+    ]
+  },
+  "conflicting/Learn/CSS/First_steps": {
+    "modified": "2019-03-24T00:09:12.368Z",
+    "contributors": [
+      "luismj",
+      "javierdp",
+      "teoli",
+      "inma_610"
+    ]
+  },
+  "conflicting/Learn/CSS/CSS_layout": {
+    "modified": "2019-03-23T22:20:39.961Z",
+    "contributors": [
+      "lavilofam1"
+    ]
+  },
+  "conflicting/Learn/CSS/Styling_text/Fundamentals": {
+    "modified": "2019-03-23T23:02:09.062Z",
+    "contributors": [
+      "albaluna"
+    ]
+  },
+  "conflicting/Learn/CSS/Building_blocks/Selectors": {
+    "modified": "2019-03-23T23:02:22.202Z",
+    "contributors": [
+      "albaluna"
+    ]
+  },
+  "conflicting/Web/CSS/font-variant": {
+    "modified": "2019-03-23T23:50:19.746Z",
+    "contributors": [
+      "teoli",
+      "FredB",
+      "HenryGR"
+    ]
+  },
+  "Web/API/HTMLMediaElement/abort_event": {
+    "modified": "2019-04-30T13:47:43.431Z",
+    "contributors": [
+      "wbamberg",
+      "ExE-Boss",
+      "fscholz",
+      "balboag"
+    ]
+  },
+  "conflicting/Web/API/Document_Object_Model_656f0e51418b39c498011268be9b3a10": {
+    "modified": "2019-03-23T23:27:17.444Z",
+    "contributors": [
+      "Sheppy"
+    ]
+  },
+  "Web/API/FormData/Using_FormData_Objects": {
+    "modified": "2019-03-23T23:19:26.530Z",
+    "contributors": [
+      "ramingar",
+      "Siro_Diaz",
+      "wilo"
+    ]
+  },
+  "conflicting/Web/API/Canvas_API/Tutorial": {
+    "modified": "2019-03-23T23:19:53.719Z",
+    "contributors": [
+      "teoli",
+      "rubencidlara"
+    ]
+  },
+  "conflicting/Web/Media/Formats": {
+    "modified": "2019-03-23T23:26:59.594Z",
+    "contributors": [
+      "wbamberg",
+      "vltamara",
+      "teoli",
+      "nekside"
+    ]
+  },
+  "conflicting/Learn/HTML/Introduction_to_HTML/Getting_started": {
+    "modified": "2019-03-23T23:53:31.079Z",
+    "contributors": [
+      "teoli",
+      "Mgjbot",
+      "Jorolo"
+    ]
+  },
+  "conflicting/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content": {
+    "modified": "2019-10-10T16:52:54.661Z",
+    "contributors": [
+      "ElNobDeTfm",
+      "estebanz01",
+      "hedmon",
+      "blanchart",
+      "teoli",
+      "ciroid",
+      "cesar_ortiz_elPatox",
+      "StripTM",
+      "AngelFQC"
+    ]
+  },
+  "conflicting/Learn/JavaScript/Objects": {
+    "modified": "2020-03-12T19:36:14.050Z",
+    "contributors": [
+      "ivanagui2",
+      "libre8bit",
+      "alejandrochung",
+      "victorsanchezm",
+      "gchifflet",
+      "hmorv",
+      "Lorenzoygata",
+      "xxxtonixxx",
+      "joan.leon",
+      "fscholz",
+      "DeiberChacon",
+      "chebit",
+      "teoli",
+      "arpunk",
+      "inma_610",
+      "StripTM"
+    ]
+  },
+  "Web/JavaScript/Reference/Global_Objects/Proxy/Proxy": {
+    "modified": "2020-10-15T21:58:11.434Z",
+    "contributors": [
+      "fscholz"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/RangeError": {
+    "modified": "2019-01-16T21:30:19.248Z",
+    "contributors": [
+      "gfernandez"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer": {
+    "modified": "2020-10-15T21:51:49.315Z",
+    "contributors": [
+      "lajaso",
+      "AzazelN28"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/Date": {
+    "modified": "2019-03-23T23:11:22.072Z",
+    "contributors": [
+      "teoli"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/Error": {
+    "modified": "2019-03-23T22:31:40.887Z",
+    "contributors": [
+      "RiazaValverde"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/Function": {
+    "modified": "2019-03-23T23:53:55.022Z",
+    "contributors": [
+      "mcardozo",
+      "teoli",
+      "shaggyrd",
+      "Mgjbot",
+      "Wrongloop",
+      "Sheppy"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/Map": {
+    "modified": "2019-03-23T22:06:29.334Z",
+    "contributors": [
+      "JuanMacias"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/Number": {
+    "modified": "2019-03-23T23:46:16.155Z",
+    "contributors": [
+      "teoli",
+      "Sheppy"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/Object": {
+    "modified": "2020-10-15T21:28:24.470Z",
+    "contributors": [
+      "lajaso",
+      "Sergio_Gonzalez_Collado",
+      "educalleja",
+      "AlexanderEstebanZapata1994",
+      "emilianodiaz",
+      "mishelashala",
+      "teoli",
+      "diegogaysaez"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/Promise": {
+    "modified": "2020-10-15T21:52:03.650Z",
+    "contributors": [
+      "atpollmann"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/String": {
+    "modified": "2019-03-23T23:53:48.515Z",
+    "contributors": [
+      "DevManny",
+      "teoli",
+      "Mgjbot",
+      "Talisker"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/SyntaxError": {
+    "modified": "2019-03-23T22:31:16.833Z",
+    "contributors": [
+      "BubuAnabelas"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Global_Objects/WeakMap": {
+    "modified": "2019-03-23T22:25:12.395Z",
+    "contributors": [
+      "frank-orellana"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Operators": {
+    "modified": "2020-10-15T21:17:29.666Z",
+    "contributors": [
+      "lajaso",
+      "nelruk",
+      "enesimo",
+      "SphinxKnight",
+      "teoli",
+      "Mgjbot",
+      "Nathymig"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Operators_d3958587a3d3dd644852ad397eb5951b": {
+    "modified": "2020-07-23T18:11:35.190Z",
+    "contributors": [
+      "n306r4ph",
+      "esreal12",
+      "BrodaNoel",
+      "maxbfmv55",
+      "maxbfmv"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Operators_5c44e7d07c463ff1a5a63654f4bda87b": {
+    "modified": "2020-03-12T19:42:13.818Z",
+    "contributors": [
+      "Binariado",
+      "hugomosh",
+      "EduardoSebastian",
+      "jnreynoso",
+      "mizhac",
+      "lizzie136",
+      "josewhitetower",
+      "miparnisari",
+      "elenatorro",
+      "CarlosRuizAscacibar"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Operators_5a0acbbb60ea37d0fdc52e3bd4c3fae8": {
+    "modified": "2020-10-15T21:37:54.340Z",
+    "contributors": [
+      "FranciscoImanolSuarez",
+      "lajaso",
+      "mfuentesg"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Operators_e72d8790e25513408a18a5826660f704": {
+    "modified": "2020-03-12T19:42:52.811Z",
+    "contributors": [
+      "albertor21",
+      "JuanMacias",
+      "lifescripter"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Operators/Spread_syntax": {
+    "modified": "2020-03-12T19:41:27.743Z",
+    "contributors": [
+      "SphinxKnight",
+      "Scipion",
+      "oagarcia"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Lexical_grammar": {
+    "modified": "2019-03-23T23:46:34.387Z",
+    "contributors": [
+      "gsalinase",
+      "Gabrielth2206",
+      "Heramalva",
+      "teoli",
+      "Sheppy",
+      "Nathymig"
+    ]
+  },
+  "conflicting/Web/JavaScript/Reference/Statements/switch": {
+    "modified": "2020-10-15T22:11:48.475Z",
+    "contributors": [
+      "Davids-Devel"
+    ]
+  },
+  "conflicting/Web/Progressive_web_apps/Introduction": {
+    "modified": "2019-11-03T14:52:14.998Z",
+    "contributors": [
+      "totopizzahn"
+    ]
+  },
+  "conflicting/Web/HTTP/Headers/Content-Security-Policy": {
+    "modified": "2019-03-23T22:46:40.903Z",
+    "contributors": [
+      "rafamagno",
+      "maedca"
+    ]
+  },
+  "conflicting/Web/HTTP/CSP": {
+    "modified": "2019-03-23T22:48:09.013Z",
+    "contributors": [
+      "Anteojudo",
+      "Nydv"
+    ]
+  },
+  "conflicting/Web/HTTP/CSP_aeae68a149c6fbe64e541cbdcd6ed5c5": {
+    "modified": "2019-01-16T21:25:25.758Z",
+    "contributors": [
+      "Anteojudo",
+      "Nydv"
+    ]
+  },
+  "conflicting/Web/Web_Components/Using_custom_elements": {
+    "modified": "2019-03-23T22:21:51.809Z",
+    "contributors": [
+      "cawilff",
+      "AlePerez92",
+      "fipadron",
+      "V.Morantes"
+    ]
+  },
+  "conflicting/Web/API_dd04ca1265cb79b990b8120e5f5070d3": {
+    "modified": "2019-03-23T23:32:09.157Z",
+    "contributors": [
+      "wbamberg",
+      "fscholz",
+      "ccarruitero",
+      "maedca",
+      "ethertank",
+      "Jeremie"
+    ]
+  },
+  "conflicting/Web/API/WebRTC_API": {
+    "modified": "2019-03-23T23:26:58.291Z",
+    "contributors": [
+      "sebasmagri"
     ]
   }
 }
\ No newline at end of file
diff --git a/files/es/acerca_del_modelo_de_objetos_del_documento/index.html b/files/es/acerca_del_modelo_de_objetos_del_documento/index.html
deleted file mode 100644
index 8123441661..0000000000
--- a/files/es/acerca_del_modelo_de_objetos_del_documento/index.html
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: Acerca del Modelo de Objetos del Documento
-slug: Acerca_del_Modelo_de_Objetos_del_Documento
-tags:
-  - DOM
-  - Todas_las_Categorías
-translation_of: Web/API/Document_Object_Model
-translation_of_original: DOM/About_the_Document_Object_Model
----
-<h3 id=".C2.BFQu.C3.A9_es_DOM.3F" name=".C2.BFQu.C3.A9_es_DOM.3F">¿Qué es DOM?</h3>
-
-<p>El <strong>Modelo de Objetos del Documento</strong> (DOM) es un <a class="external" href="http://es.wikipedia.org/wiki/API">API</a> para documentos <a href="/es/HTML" title="es/HTML">HTML</a> y <a href="/es/XML" title="es/XML">XML</a>. Proporciona una representación estructural del documento, permitiendo la modificación de su contenido y visualización. Esencialmente, comunica las páginas web con los scripts o los lenguajes de programación.</p>
-
-<p>Todas las propiedades, métodos, y eventos disponibles por el desarrollador web para manipular y crear páginas web están organizados en objetos (por ejemplo: el objeto 'document' representa al documento en sí mismo, el objeto 'table' representa los elementos HTML para tablas, etcétera). En los navegadores modernos estos objetos son manejables con lenguajes de scripts.</p>
-
-<p>Es muy común usar DOM conjuntamente con <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a>. Así es, el código es escrito en JavaScript, pero éste usa DOM para tener acceso a la página Web y sus elementos. Sin embargo, DOM fue diseñado para ser independiente de cualquier lenguaje de programación concreto, poniendo la representación estructural del documento disponible en un solo API consistente. Aunque en este sitio nos centremos en JavaScript, las implementaciones de DOM pueden hacerse para <a class="external" href="http://www.w3.org/DOM/Bindings">cualquier lenguaje</a>.</p>
-
-<p>El <a class="external" href="http://www.w3c.es/">Consorcio de World Wide Web</a> establece un <a class="external" href="http://www.w3.org/DOM/">estándar para el DOM</a>, llamado W3C DOM. Actualmente los navegadores más importantes lo soportan correctamente, ésto permite crear poderosas aplicaciones multi-navegador.</p>
-
-<h3 id=".C2.BFPor_qu.C3.A9_es_importante_el_soporte_que_Mozilla_da_al_DOM.3F" name=".C2.BFPor_qu.C3.A9_es_importante_el_soporte_que_Mozilla_da_al_DOM.3F">¿Por qué es importante el soporte que Mozilla da al DOM?</h3>
-
-<p><em>HTML dinámico</em> (<a href="/es/DHTML" title="es/DHTML">DHTML</a>) es un término usado por muchos para describir la combinación de HTML, hojas de estilo y scripts que permite que los documentos sean dinámicos. El grupo de trabajo W3C DOM trabaja duro para asegurarse de que sus soluciones son interoperables e independientes del lenguaje (ver también la <a class="external" href="http://www.w3.org/DOM/faq.html">DOM FAQ</a>). Cuando Mozilla reclama el título de "Plataforma para aplicaciones web", el soporte a DOM es uno de los rasgos más solicitados, y es necesario si Mozilla quiere ser una alternativa real a otros navegadores.</p>
-
-<p>El hecho incluso más importante es que la interfaz de usuario de Firefox (también la de Mozilla Suite y Thunderbird) está construida usando XUL - un lenguaje XML para interfaces de usuario. Así Mozilla usa el DOM para manipular sus propias interfaces de usuario. <small>(<a href="/en/Dynamically_modifying_XUL-based_user_interface">en inglés</a>)</small></p>
diff --git a/files/es/actualizar_aplicaciones_web_para_firefox_3/index.html b/files/es/actualizar_aplicaciones_web_para_firefox_3/index.html
deleted file mode 100644
index e81f21fa49..0000000000
--- a/files/es/actualizar_aplicaciones_web_para_firefox_3/index.html
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: Actualizar aplicaciones web para Firefox 3
-slug: Actualizar_aplicaciones_web_para_Firefox_3
-tags:
-  - Firefox 3
-translation_of: Mozilla/Firefox/Releases/3/Updating_web_applications
----
-<div>{{FirefoxSidebar}}</div>
-
-<p>{{ Fx_minversion_header(3) }} Existen varios cambios en el próximo Firefox 3 que pueden afectar tu sitio web o aplicación web, así como nuevas características que se pueden aprovechar. Este artículo servirá como punto de partida para actualizar el contenido web de modo que se pueda aprovechar Firefox 3 al máximo.</p>
-
-<h3 id="DOM_changes" name="DOM_changes">Cambios DOM</h3>
-
-
-<p></p><p>Nodes from external documents should be cloned using <a href="/es/docs/Web/API/Document/importNode" title="Crea una copia de un nodo desde un documento externo para ser insertado en el documento actual."><code>document.importNode()</code></a> (or adopted using <a href="/es/docs/Web/API/Document/adoptNode" title="Adopta un nodo extreno. El nodo y sub subnodos son quitados del documento en que se encuentra  y su nuevo  ownerDocument se cambia por el actual. El nodo puede entoces ser insertado en el documento actual."><code>document.adoptNode()</code></a>) before they
-    can be inserted into the current document. For more on the <a href="/es/docs/Web/API/Node/ownerDocument" title="La propiedad de lectura Nodo.ownerDocument devuelve el objecto Document de más alto nivel/jerarquia para ese nodo."><code>Node.ownerDocument</code></a> issues, see the
-    <a class="external" href="http://www.w3.org/DOM/faq.html#ownerdoc" rel="noopener">W3C DOM FAQ</a>.</p>
-
-    <p>Firefox doesn't currently enforce this rule (it did for a while during the development of Firefox 3, but too many
-    sites break when this rule is enforced). We encourage Web developers to fix their code to follow this rule for
-    improved future compatibility.</p><p></p>
-
-<h3 id="HTML_changes" name="HTML_changes">Cambios HTML</h3>
-
-<h4 id="Changes_to_character_set_inheritance" name="Changes_to_character_set_inheritance">Cambios en el conjunto de caracteres de herencia</h4>
-
-<p>Firefox 3 cierra un fallo en la seguridad en frames e iframes que les permitía heredar el conjunto de caracteres de donde eran derivadas. Esto podría causar problemas en ciertos casos. Ahora, las frames están solamente permitidas a heredar el conjunto de caracteres si ambos frames y el conjunto de caracteres fue cargado del mismo servidor. Si tienes páginas que asumen que las frames fueron cargadas de otro servidor heredará el mismo conjunto de caracteres, deberías actualizar los HTML de las frames para indicar el conjunto de caracteres específicamente.</p>
-
-<h4 id="Cambios_en_el_elemento_SCRIPT">Cambios en el elemento SCRIPT</h4>
-
-<p>Ahora hay que cerrar el elemento <span style="font-family: Courier New;"><span class="nowiki">&lt;script&gt;</span></span> en <span style="font-family: Courier New;"><code>text/html</code></span> con <span style="font-family: Courier New;"><span class="nowiki">&lt;/script&gt;</span></span> en los documentos de HTML 4, incluso si no hay contenido dentro. En las versiones previas de Firefox, bastaba con hacer:</p>
-
-<pre class="eval">&lt;script ...   /&gt;
-</pre>
-
-<p>Ahora se deben cumplir las especificaciones de HTML (si se trata de un HTML), y por lo tanto se deben cerrar, así:</p>
-
-<pre class="eval">&lt;script ...&gt;&lt;/script&gt;
-</pre>
-
-<p>Esto mejora tanto la compatibilidad como la seguridad.</p>
-
-<h3 id="Cambios_en_CSS" name="Cambios_en_CSS">Cambios en CSS</h3>
-
-<h4 id="Cambio_al_tama.C3.B1o_de_fuente_basado_en_unidades_em.2C_ex" name="Cambio_al_tama.C3.B1o_de_fuente_basado_en_unidades_em.2C_ex">Cambio al tamaño de fuente basado en unidades em, ex</h4>
-
-<p>Los valores de fuente en unidades em y ex solían ser afectadas por el tamaño mínimo de fuente utilizado por el usuario: si una fuente se desplegaba más grande debido al tamaño mínimo, el ajuste de las unidades em y ex para el tamaño de fuente basados en esta se incrementarían de forma acorde. Esto era inconsistente con la forma en que las fuentes basadas en porcentaje se comportaban.</p>
-
-<p>Los valores del tamaño de fuente en unidades em y ex ahora están basadas en un "tamaño de fuente intencionado" que no se ve afectado por el tamaño mínimo de fuente del usuario. En otras palabras, los tamaños de la fuente se calculan de acuerdo a las intenciones del diseñador y se ajustan al tamaño mínimo de fuente después de ello.</p>
-
-<p>Ver {{ Bug(322943) }} para una demostración (se debe ver con un tamaño mínimo de fuente 6 para detectar la diferencia: las dos cajas en cascada se comportan diferente en Firefox 2, porque el tamaño de fuente basado en em "retorna" el tamaño mínimo de fuente.</p>
-
-<h3 id="Cambios_de_seguridad" name="Cambios_de_seguridad">Cambios de seguridad</h3>
-
-<h4 id="Acceso_Chrome" name="Acceso_Chrome">Acceso Chrome</h4>
-
-<p>En versiones anteriores de Firefox, cualquier página web podía cargar scripts o imágenes <span style="font-family: Courier New;"><code><a class="external" rel="freelink">chrome://</a></code></span> usando el protocolo chrome. Entre otras cosas, esto hizo posible que algunos sitios no detectaran la presencia de complementos,  lo cual podía ser usado para traspasar la seguridad del usuario saltando los complementos que agregaban medidas de seguridad al buscador.</p>
-
-<p>Firefox 3 solo permite contenido web para acceder a los elementos en los espacios del <span style="font-family: Courier New;"><code><a class="external" rel="freelink">chrome://browser/</a></code> </span>y en espacio <span style="font-family: Courier New;"><a class="external" rel="freelink">chrome://toolkit/</a></span>. Estos archivos pretenden ser accesibles por el contenido web. Ahora cualquier otro contenido chrome es bloqueado para el sitio web.</p>
-
-<p>Hay, sin embargo, métodos para ciertas extensiones que puden ser accedidos por la web. Se puede especificar una bandera en su archivo<span style="font-family: Courier New;"> chrome.manifest </span>de esta manera:</p>
-
-<pre class="eval">content mypackage location/ contentaccessible=yes
-</pre>
-
-<p>Esto no debería ser algo que se haga muy seguido, pero está disponible para aquellos casos raros en los que es necesario. Debe tomarse en cuenta que es posible que Firefox alerte al usuario que su extensión utiliza una bandera en el <span style="font-family: Courier New;">contentaccessible </span>de alguna manera, ya que consituye un riesgo potencial en la seguridad.</p>
-
-<div class="note"><strong>Nota:</strong> Ya que Firefox 2 no entiende la bandera <code>contentaccessible</code> (ignorará la instrucción completa de que contiene la bandera), si se desea que el complemento sea compatible con Firefox 2 y Firefox 3, hay que hacer algo como esto:
-
-<pre class="eval">content mypackage location/
-content mypackage location/ contentaccessible=yes
-</pre>
-</div>
-
-<h4 id="Campos_para_subir_archivos">Campos para subir archivos</h4>
-
-<p>En versiones anteriores de Firefox, había casos en los que cuando el usuario seleccionaba un archivo para subir, la aplicación web podía ver la ruta completa del archivo. Esta pertinencia de privacidad ha sido resuelta en Firefox 3; ahora la aplicación web solo mostrará el nombre del archivo.</p>
-
-<h3 id="Cambios_en_JavaScript" name="Cambios_en_JavaScript">Cambios en JavaScript</h3>
-
-<p>Firefox 3 soporta <span style="color: #008080;"><a href="../../../../../en/New_in_JavaScript_1.8" rel="internal">JavaScript 1.8</a></span>. Un cambio importante que quizás requiera actualizaciones en los sitios web o en las aplicaciones, es que los <span style="font-family: Courier New;">Script </span>obsoletos y no-estandar no son soportados. Esto no es la etiqueta <span style="font-family: Courier New;"><code><span class="nowiki">&lt;script&gt;</span></code></span>, pero un objeto de JavaScript que nunca fue estandarizado. De cualquier manera es muy improbable que se use, así que probablemente no surgan problemas.</p>
-
-<h3 id="Vea_tambien" name="Vea_tambien">Vea también</h3>
-
-<ul>
- <li><a href="/es/Firefox_3_for_developers" title="es/Firefox_3_for_developers">Firefox 3 para desarrolladores</a> <a href="/es/New_in_JavaScript_1.8" title="es/New_in_JavaScript_1.8">Nuevo en  JavaScript 1.8</a> <a href="/es/Updating_extensions_for_Firefox_3" title="es/Updating_extensions_for_Firefox_3">Actualizando extensiones para Firefox 3</a></li>
-</ul>
diff --git a/files/es/actualizar_extensiones_para_firefox_3/actualizar_extensiones_para_firefox_3/index.html b/files/es/actualizar_extensiones_para_firefox_3/actualizar_extensiones_para_firefox_3/index.html
deleted file mode 100644
index e4c788c5bb..0000000000
--- a/files/es/actualizar_extensiones_para_firefox_3/actualizar_extensiones_para_firefox_3/index.html
+++ /dev/null
@@ -1,229 +0,0 @@
----
-title: Actualizar extensiones para Firefox 3
-slug: Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3
-tags:
-  - Firefox 3
----
-<div><section class="Quick_links" id="Quick_Links">
-  <ol>
-    <li class="toggle">
-        <details>
-            <summary>Notas de la Versión para Desarrolladores de Firefox</summary>
-            <ol>
-              <li><a href="/es/docs/Mozilla/Firefox/Releases">Notas de la Versión para Desarrolladores de Firefox</a></li>
-            </ol>
-        </details>
-    </li>
-    <li class="toggle">
-        <details>
-            <summary>Complementos</summary>
-            <ol>
-              <li><a href="/es/Add-ons/WebExtensions">Extensiones del navegador</a></li>
-              <li><a href="/es/Add-ons/Themes">Temas</a></li>
-            </ol>
-        </details>
-    </li>
-    <li class="toggle">
-        <details>
-            <summary>Firefox por dentro</summary>
-            <ol>
-              <li><a href="/es/docs/Mozilla/">Proyecto Mozilla (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/Gecko">Gecko</a></li>
-              <li><a href="/es/docs/Mozilla/Firefox/Headless_mode">Headless mode</a></li>
-              <li><a href="/es/docs/Mozilla/JavaScript_code_modules">Modulos de código JavaScript (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/js-ctypes">JS-ctypes (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/MathML_Project">Proyecto MathML</a></li>
-              <li><a href="/es/docs/Mozilla/MFBT">MFBT (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/Projects">Proyectos Mozilla (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/Preferences">Sistema de Preferencias (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/WebIDL_bindings">Ataduras WebIDL (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/Tech/XPCOM">XPCOM</a></li>
-              <li><a href="/es/docs/Mozilla/Tech/XUL">XUL</a></li>
-            </ol>
-        </details>
-    </li>
-    <li class="toggle">
-        <details>
-            <summary>Crear y contribuir</summary>
-            <ol>
-              <li><a href="/es/docs/Mozilla/Developer_guide/Build_Instructions">Instrucciones para la compilación</a></li>
-              <li><a href="/es/docs/Mozilla/Developer_guide/Build_Instructions/Configuring_Build_Options">Configurar las opciones de compilación</a></li>
-              <li><a href="/es/docs/Mozilla/Developer_guide/Build_Instructions/How_Mozilla_s_build_system_works">Cómo funciona el sistema de compilación (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/Developer_guide/Source_Code/Mercurial">Código fuente de Mozilla</a></li>
-              <li><a href="/es/docs/Mozilla/Localization">Localización</a></li>
-              <li><a href="/es/docs/Mozilla/Mercurial">Mercurial (Inglés)</a></li>
-              <li><a href="/es/docs/Mozilla/QA">Garantía de Calidad</a></li>
-              <li><a href="/es/docs/Mozilla/Using_Mozilla_code_in_other_projects">Usar Mozilla en otros proyectos (Inglés)</a></li>
-            </ol>
-        </details>
-    </li>
-  </ol>
-</section></div>
-
-<p> Este artículo ofrece información que será de utilidad para desarrolladores que deseen actualizar sus extensiones, con el propósito de que éstas funcionen correctamente con Firefox 3.</p>
-
-<p>Antes de continuar, queremos sugerirte algo: si el único cambio que requiere tu extensión es un empuje al campo <code>maxVersion</code> en el manifiesto de instalación, y la extensión está disponible en el servidor <a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a>, ¡no necesitas actualizar tu extensión a una nueva versión! Simplemente usa el Panel de Control para desarrolladores en AMO para ajustar <code>maxVersion</code>. De esta manera, puedes evitar el trabajo de tener que volver a revisar tu extensión.</p>
-
-<h3 id="Paso_1_Actualiza_el_manifiesto_de_instalaci.C3.B3n" name="Paso_1:_Actualiza_el_manifiesto_de_instalaci.C3.B3n">Paso 1: Actualiza el manifiesto de instalación</h3>
-
-<p>El primer paso <span style='font-family: "Times New Roman"; font-size: 12pt;'>—</span>y para muchas extensiones, el único que será necesario<span style='font-family: "Times New Roman"; font-size: 12pt;'>—</span> es actualizar el archivo <code>install.rdf</code> dentro del manifiesto <a href="/es/Manifiesto_de_instalaci%C3%B3n" title="es/Manifiesto_de_instalación">install manifest</a> para indicar la compatibilidad con Firefox 3.</p>
-
-<p>Simplemente encuentra la línea que indica el número de la versión máxima compatible de Firefox, lo que para Firefox 2 es algo como:</p>
-
-<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;2.0.*&lt;/em:maxVersion&gt;</span>
-</pre>
-
-<p>Cámbiala para indicar compatibilidad con Firefox 3:</p>
-
-<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;3.0.*&lt;/em:maxVersion&gt;</span>
-</pre>
-
-<p>A continuación, reinstala la extensión.</p>
-
-<p>Recuerda que en Firefox 3 no necesitas incluir el ".0" extra en el número de versión, con lo que, en lugar de usar "3.0.0.*", sólo necesitas usar "3.0.*".</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Ten en cuenta que actualmente, se esperan muchos cambios en Firefox 3. Estos cambios podrían romper algunas extensiones, por lo que no deberías ofrecer una nueva versión con <code>maxVersion</code> <code>3.0.*</code> a los usuarios, hasta que salgan las versiones RC (release candidate). Durante el periodo Beta, deberías usar <code>maxVersion</code> <code>3.0b5</code>.</p>
-</div>
-
-<p>Ha habido (y continuará habiendo) una serie de cambios en la API que muy probablemente romperá algunas extensiones. Aún estamos trabajando para hacer una lista de todos estos cambios.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Si tu extensión aún usa un script <code><a href='\"es/Install.js\"'>Install.js</a></code> en lugar de un <a href='\"es/Install_Manifests\"'>install manifest</a>, necesitas hacer la transición a un manifiesto de instalación ahora. Firefox 3 ya no implementa scripts <code>install.js</code> en archivos XPI.</p>
-</div>
-
-<h4 id="Agregar_localizaciones_al_manifiesto_de_instalaci.C3.B3n" name="Agregar_localizaciones_al_manifiesto_de_instalaci.C3.B3n">Agregar localizaciones al manifiesto de instalación</h4>
-
-<p>Firefox 3 tiene tres nuevas propiedades en el manifiesto de instalación para especificar descripciones de localización. Los métodos antiguos aún funcionan. Sin embargo, los nuevos permiten que Firefox escoja la localización aún cuando la extensión esté deshabilitada o pendiente de instalación. Visita <a href="/es/Localizing_extension_descriptions" title="es/Localizing_extension_descriptions">Localizing extension descriptions</a> para más detalles.</p>
-
-<h3 id="Paso_2_Aseg.C3.BArate_de_suministrar_actualizaciones_seguras" name="Paso_2:_Aseg.C3.BArate_de_suministrar_actualizaciones_seguras">Paso 2: Asegúrate de suministrar actualizaciones seguras</h3>
-
-<p>Si tienes la extensión en tu propio servidor y no en un servidor seguro como <a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a>, debes suministrar un método para la descarga segura de la extensión. Esto puede hacerse manteniendo un servidor SSl, o usando claves criptográficas para firmar la información de la extensión. Lee <a href="/es/Extension_Versioning,_Update_and_Compatibility#Securing_Updates" title="es/Extension_Versioning,_Update_and_Compatibility#Securing_Updates">Securing Updates</a> para más información.</p>
-
-<h3 id="Paso_3_Manejate_con_los_cambios_en_los_API" name="Paso_3:_Manejate_con_los_cambios_en_los_API">Paso 3: Debes estar al tanto de los cambios en las API</h3>
-
-<p>Muchas API han sido modificadas de forma significativa. Los cambios más importantes, que seguramente afectarán a muchas extensiones son:</p>
-
-<h4 id="DOM" name="DOM">DOM</h4>
-
-
-<p>Nodes from external documents should be cloned using <a href="/es/docs/Web/API/Document/importNode" title="Crea una copia de un nodo desde un documento externo para ser insertado en el documento actual."><code>document.importNode()</code></a> (or adopted using <a href="/es/docs/Web/API/Document/adoptNode" title="Adopta un nodo extreno. El nodo y sub subnodos son quitados del documento en que se encuentra  y su nuevo  ownerDocument se cambia por el actual. El nodo puede entoces ser insertado en el documento actual."><code>document.adoptNode()</code></a>) before they
-    can be inserted into the current document. For more on the <a href="/es/docs/Web/API/Node/ownerDocument" title="La propiedad de lectura Nodo.ownerDocument devuelve el objecto Document de más alto nivel/jerarquia para ese nodo."><code>Node.ownerDocument</code></a> issues, see the
-    <a class="external" href="http://www.w3.org/DOM/faq.html#ownerdoc" rel="noopener">W3C DOM FAQ</a>.</p>
-
-    <p>Firefox doesn't currently enforce this rule (it did for a while during the development of Firefox 3, but too many
-    sites break when this rule is enforced). We encourage Web developers to fix their code to follow this rule for
-    improved future compatibility.</p>
-
-<h4 id="Marcadores__Historial" name="Marcadores_&amp;_Historial">Marcadores e Historial</h4>
-
-<p>Si tu extensión accede a los marcadores o al historial de alguna forma, necesitarás un gran esfuerzo para hacerla compatible con Firefox 3. Los API antiguos que accedian a esta información, han sido reemplazados por la nueva arquitectura <a href="/es/Cat%C3%A1logo" title="es/Catálogo">Catálogo</a>. Ver <a href="/es/Gu%C3%ADa_para_la_migraci%C3%B3n_a_cat%C3%A1logo" title="es/Guía_para_la_migración_a_catálogo">Guía para la migración a catálogo</a> para más detalles de cómo actualizar tus extensiones en el uso de las API de catálogo.</p>
-
-<h4 id="Administrador_de_descargas" name="Administrador_de_descargas">Administrador de descargas</h4>
-
-<p>El API del administrador de descargas ha cambiado ligeramente debido a la transición desde el uso del almacén de datos RDF al uso del API <a href="/es/Storage" title="es/Storage">Storage</a>. Esto debería ser una transición pequeña y fácil. Adicionalmente, el API para vigilar los procesos de descarga ha cambiado para que maneje varias escuchas de descarga. Ver <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadManager" title="">nsIDownloadManager</a></code>, <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadProgressListener" title="">nsIDownloadProgressListener</a></code>, y <a href="/es/Vigilar_descargas" title="es/Vigilar_descargas">Monitoring downloads</a> para más información.</p>
-
-<h4 id="Administrador_de_contrase.C3.B1as" name="Administrador_de_contrase.C3.B1as">Administrador de contraseñas</h4>
-
-<p>Si tu extensión accede a información de identidad de usuario del Administrador de Contraseñas, necesitará ser actualizada para usar el nuevo API Administrador de Contraseñas.</p>
-
-<ul>
- <li>El artículo <a href="/es/Using_nsILoginManager" title="es/Using_nsILoginManager">Using nsILoginManager</a> incluye ejemplos, que incluyen una demostración de cómo debes escribir extensiones que trabajen tanto con el Administrador de Contraseñas (Password Manager) como con el Administrador de Registro (Login Manager) para que ambos trabajen con Firefox 3 y versiones anteriores.</li>
- <li><code><a href="/es/NsILoginInfo" title="es/NsILoginInfo">nsILoginInfo</a></code></li>
- <li><code><a href="/es/NsILoginManager" title="es/NsILoginManager">nsILoginManager</a></code></li>
-</ul>
-
-<p>También puedes sobre-escribir el almacén del administrador de contraseñas interno si quieres ofrecer tu propio almacén en tu extensión. Ver <a href="/es/Creating_a_Login_Manager_storage_module" title="es/Creating_a_Login_Manager_storage_module">Creating a Login Manager storage module</a> para más detalles.</p>
-
-<h4 id="Ventanas_emergentes_.28Men.C3.BAs.2C_Men.C3.BAs_contextuales.2C_Tooltips_y_Paneles.29" name="Ventanas_emergentes_.28Men.C3.BAs.2C_Men.C3.BAs_contextuales.2C_Tooltips_y_Paneles.29">Ventanas emergentes (Menús, Menús contextuales, Tooltips y Paneles)</h4>
-
-<p>En Firefox 3, se ha modificado sustancialmente el sistema XUL de ventanas emergentes. El sistema de ventanas emergentes, contempla ahora, menús, menús contextuales y paneles. Se ha creado una guía a <a href="/es/XUL/PopupGuide" title="es/XUL/PopupGuide">using Popups</a>, detallando cómo funciona este sistema. Una cosa a tener en cuenta, es que se desaconseja el uso de <code>popup.<span id="m-showPopup"><code><a href="https://developer.mozilla.org/es/docs/Mozilla/Tech/XUL/Method/showPopup">showPopup</a></code></span></code> en favor de los nuevos <code>popup.<span id="m-openPopup"><code><a href="https://developer.mozilla.org/es/docs/Mozilla/Tech/XUL/Method/openPopup">openPopup</a></code></span></code> y <code>popup.<span id="m-openPopupAtScreen"><code><a href="https://developer.mozilla.org/es/docs/Mozilla/Tech/XUL/Method/openPopupAtScreen">openPopupAtScreen</a></code></span></code>.</p>
-
-<h4 id="Autocompletado" name="Autocompletado">Autocompletado</h4>
-
-<p>El método <code><a href="/es/NsIAutoCompleteController#handleEnter.28.29" title="es/NsIAutoCompleteController#handleEnter.28.29">handleEnter()</a></code> del interfaz <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAutoCompleteController" title="">nsIAutoCompleteController</a></code> ha cambiado para aceptar un argumento que indique si el texto ha sido seleccionado en una ventana de Autocompletado o por que el usuario ha pulsado Intro después de teclear algún texto.</p>
-
-<h4 id="Analizador_del_DOM_.28DOMParser.29" name="Analizador_del_DOM_.28DOMParser.29">Analizador del DOM (DOMParser)</h4>
-
-<ul>
- <li>Cuando se inicia una instancia del <code>DOMParser</code>, se hereda el código de la llamada principal y los códigos <code>documentURI</code> y <code>baseURI</code> de la ventana del constructor de donde viene.</li>
- <li>Si elllamante tiene privilegios UniversalXPConnect, puede pasar parámetros a <code>new DOMParser()</code>. Si se pasan menos de tres parámetros, los parámetros restantes se pasarán con el valor <code>null</code>.
-  <ul>
-   <li>El primer parámetro es el principal a usar; esto sobre-escribe el valor heredado del principal.</li>
-   <li>El segundo parámetro es la <code>documentURI</code> a usar.</li>
-   <li>El tercer parámetro es la <code>baseURI</code> a usar.</li>
-  </ul>
- </li>
- <li>Si inicias un <code>DOMParser</code> usando un contrato como <code>createInstance()</code>, y no llamas al método <code>init()</code> de <code>DOMParser</code>, al intentar iniciar la operación de análisis, se creará automáticamente una <code>DOMParser</code> con un principal nulo y un puntero <code>null</code> a <code>documentURI</code> y <code>baseURI</code>.</li>
-</ul>
-
-<h4 id="Interfaces_eliminados" name="Interfaces_eliminados">Interfaces eliminados</h4>
-
-<p>Los siguientes interfaces han sido eliminados en Gecko 1.9, que es el motor de Firefox 3. Si tu extensión hace uso de cualquiera de estos interfaces, necesitas actualizar tu código:</p>
-
-<ul>
- <li><code>nsIDOMPaintListener</code></li>
- <li><code>nsIDOMScrollListener</code></li>
- <li><code>nsIDOMMutationListener</code></li>
- <li><code>nsIDOMPageTransitionListener</code></li>
- <li><code>nsICloseAllWindows</code> (see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=386200" title='FIXED: SeaMonkey only: no "view cert button" in untrusted cert error dialog'>error 386200</a>)</li>
-</ul>
-
-<h3 id="Paso_4_Comprueba_los_cambios_importantes_en_el_chrome" name="Paso_4:_Comprueba_los_cambios_importantes_en_el_chrome">Paso 4: Comprueba los cambios importantes en el chrome</h3>
-
-<p>Ha habido un cambio pequeño en el chrome que puede requerir cambis en tu código. Se ha añadido un nuevo <code>vbox</code> llamado "browser-bottombox", que integra la barra de búsqueda y la barra de estado en la parte baja de la ventana del navegador. Aunque esto no afecta a la apariencia de la pantalla, puede que afecte a tu extensión si está hace uso de los elementos descritos.</p>
-
-<p>Por ejemplo, si has recubierto algún elemento del chrome antes de la barra de estado de esta manera:</p>
-
-<pre>&lt;window id="main-window"&gt;
-  &lt;something insertbefore="status-bar" /&gt;
-&lt;/window&gt;
-</pre>
-
-<p>Debes cambiar tu código a algo como:</p>
-
-<pre>&lt;vbox id="browser-bottombox"&gt;
-  &lt;something insertbefore="status-bar" /&gt;
-&lt;/vbox&gt;
-</pre>
-
-<p>O usar la siguiente técnica para hacer que el recubrimiento funciones tanto en Firefox 2 como Firefox 3:</p>
-
-<pre>&lt;window id="main-window"&gt;
-  &lt;vbox id="browser-bottombox" insertbefore="status-bar"&gt;
-    &lt;something insertbefore="status-bar" /&gt;
-  &lt;vbox&gt;
-&lt;/window&gt;
-</pre>
-
-<div class="note">
-<p><strong>Nota:</strong> Este cambio es efectivo a partir de Firefox 3 beta 4.</p>
-</div>
-
-<h3 id="Otros_cambios" name="Otros_cambios">Otros cambios</h3>
-
-<p><em>Añade los cambios sencillos que tengas que realizar al actualizar tu extensión para que funciones con Firefox 3.</em></p>
-
-<ul>
- <li><code><a class="external" rel="freelink">chrome://browser/base/utilityOverlay.js</a></code> ya no está implementado por razones de seguridad. Si estabas usando esto, debes cambiarlo a <code><a class="external" rel="freelink">chrome://browser/content/utilityOverlay.js</a></code>.</li>
- <li>Las implementaciones de <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAboutModule" title="">nsIAboutModule</a></code> ahora requieren implementar el método <code>getURIFlags</code>. Ver <a href="https://dxr.mozilla.org/mozilla-central/source/netwerk/protocol/about/public/nsIAboutModule.idl" rel="custom">nsIAboutModule.idl</a> para más información. Esto afecta a las extensiones que ofezcan nuevas URI del tipo <code>about:</code>. (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=337746" title='FIXED: [FIX]Move "safe about" hardcoding out of security manager'>error 337746</a>)</li>
- <li>El elemento <code><a href="/es/docs/Mozilla/Tech/XUL/tabbrowser" title="tabbrowser">tabbrowser</a></code> ya no forma parte de "toolkit" (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=339964" title="FIXED: move tabbrowser.xml out of mozilla/toolkit and into mozilla/browser">error 339964</a>). Esto significa que este elemento ya no está visible en las aplicaciones o extensiones XUL. Este elmento sigue siendo parte de la ventana principal de Firefox (browser.xul).</li>
- <li>Cambios en <a href="/es/NsISupports_proxies" title="es/NsISupports_proxies">nsISupports proxies</a></li>
-</ul>
-
-<p>Es necesario documentar los interfaces a y los relacionados con sus hilos.</p>
-
-<ul>
- <li>Si usas instrucciones de proceso XML, tales como <code>&lt;?xml-stylesheet ?&gt;</code> en tus archivos XUL, ten en cuenta los cambios expuestos en <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=319654" title="FIXED: Processing instructions in XUL are not added to the content model">error 319654</a>:
-
-  <ol>
-   <li>Se añade al DOM del documento XUL, los XML PIs. Esto significa que <a href="/es/docs/Web/API/Document/firstChild" title="La documentación acerca de este tema no ha sido escrita todavía . ¡Por favor  considera contribuir !"><code>document.firstChild</code></a> no tiene garantía de ser el elemento raiz. Si necesitas referenciar el documento raiz en tu script, usa <a href="/es/docs/Web/API/Document/documentElement" title="Solo-lectura"><code>document.documentElement</code></a> en su lugar.</li>
-   <li>Las instrucciones de proceso <code>&lt;?xml-stylesheet ?&gt;</code> y <code>&lt;?xul-overlay ?&gt;</code> no tienen ahora efecto fuera del prologo del documento.</li>
-  </ol>
- </li>
- <li>Cuando se carga contenido web (se carga la página en el navegador) no se inicia <code>window.addEventListener("load", myFunc, true)</code>. Esto ocurre por que <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=296639" title="FIXED: Split windows into an inner and outer object">error 296639</a> cambia la forma de comunicación entre las ventanas internas y externas. La forma fácil de corregir esto, es usar <code>gBrowser.addEventListener("load", myFunc, true)</code>, según se describe <a href="/es/Code_snippets/Tabbed_browser#Detecting_page_load" title="es/Code_snippets/Tabbed_browser#Detecting_page_load">aquí</a> y que funciona también en Firefox 2.</li>
- <li><code>content.window.getSelection()</code> ofrece un objeto (que puede ser convertido en cadena con <code>toString()</code>), mientras que se desaconseja el uso de <code>content.document.getSelection()</code> que devuelve una cadena</li>
- <li>Se desaconseja, a partir de Firefox 2, el uso de <code>event.preventBubble()</code> y por tanto ha desaparecido en Firefox 3. En su lugar, usa <a href="/es/DOM/event.stopPropagation" title="es/DOM/event.stopPropagation"><code>event.stopPropagation()</code></a>, que también funciona en Firefox 2.</li>
- <li>Los contadores de tiempo que se inician usando <code>setTimeout()</code>, ahora están bloqueados por las ventanas en modo 'modal' por el ajuste hecho por <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=52209" title="FIXED: JS timers can fire while a modal dialog is open">error 52209</a>. En su lugar, deberías usar <code>nsITimer</code>.</li>
- <li>Si tu extensión necesita permitir una fuente no fiable (por ejemplo un sitio web) para acceder al chrome de la extensión, debes usar el nuevo flag <a href="/es/Chrome_Registration#contentaccessible" title="es/Chrome_Registration#contentaccessible"><code>contentaccessible</code> flag</a>.</li>
-</ul>
diff --git a/files/es/actualizar_extensiones_para_firefox_3/index.html b/files/es/actualizar_extensiones_para_firefox_3/index.html
deleted file mode 100644
index fc3f91addd..0000000000
--- a/files/es/actualizar_extensiones_para_firefox_3/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Actualizar extensiones para Firefox 3
-slug: Actualizar_extensiones_para_Firefox_3
-tags:
-  - Firefox 3
-translation_of: Mozilla/Firefox/Releases/3/Updating_extensions
----
-<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Este artículo ofrece información que será de utilidad para desarrolladores que deseen actualizar sus extensiones, para que éstas funcionen correctamente con Firefox 3.<br>
- <br>
- Antes de continuar, queremos sugerirte algo: si el único cambio que requiere tu extensión es modificar el campo maxVersion en el manifiesto de instalación, la extensión está disponible en el servidor <a class="link-https" href="https://addons.mozilla.org/es-ES/firefox/" title="https://addons.mozilla.org/es-ES/firefox/">addons.mozilla.org</a> y ¡no necesitarás actualizar tu extensión a una nueva versión! Simplemente usa el Panel de Control para desarrolladores en AMO para modificar <code>maxVersion</code>. De esta manera, puedes evitar el trabajo de tener que volver a revisar tu extensión.</p>
-
-<p> </p>
-
-<h3 id="1er_paso:_Actualiza_el_manifiesto_de_instalaci.C3.B3n" name="1er_paso:_Actualiza_el_manifiesto_de_instalaci.C3.B3n">Paso 1: Actualiza el manifiesto de instalación</h3>
-
-<p>El primer paso —y para la mayoría de las extensiones, el único que será necesario— es actualizar el archivo <code>install.rdf</code> dentro del <a href="/es/Manifiesto_de_instalaci%C3%B3n" title="es/Manifiesto_de_instalación">manifiesto de instalación</a> para indicar la compatibilidad con Firefox 3.</p>
-
-<p>Sólo debes buscar la línea que indica la máxima versión compatible de Firefox, lo que para Firefox 2, probablemente sea:</p>
-
-<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;2.0.*&lt;/em:maxVersion&gt;</span>
-</pre>
-
-<p>Cámbiala para indicar compatibilidad con Firefox 3:</p>
-
-<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;3.0.*&lt;/em:maxVersion&gt;</span>
-</pre>
-
-<p>A continuación, reinstala la extensión.</p>
-
-<p>Recuerda que en Firefox 3 no necesitas incluir el ".0" extra en el número de la versión. Por lo tanto, en lugar de escribir "3.0.0.*", sólo necesitas usar "3.0.*".</p>
-
-<p>Ha habido (y continuará habiendo) una serie de cambios en las APIs, lo que muy probablemente averiará algunas extensiones. Aún estamos trabajando para confeccionar una lista completa de estos cambios.</p>
-
-<p>Si tu extensión todavía usa un script <code><a href='\"es/Install.js\"'>Install.js</a></code> en vez de un <a href='\"es/Manifiesto_de_instalaci%c3%b3n\"'>manifiesto de instalación</a>, necesitas hacer la transición a un manifiesto de instalación lo más pronto posible. Firefox 3 no implementará el script <code>install.js</code> en documentos XPI.</p>
-
-<h4 id="A.C3.B1ade_descripciones_al_manifiesto_de_instalaci.C3.B3n" name="A.C3.B1ade_descripciones_al_manifiesto_de_instalaci.C3.B3n">Agregar localizaciones al manifiesto de instalación</h4>
-
-<p>Firefox 3 cuenta con tres nuevas propiedades en el manifiesto de instalación para especificar descripciones de localización. Los métodos antiguos todavía funcionan. Sin embargo, los nuevos permiten que Firefox escoja la localización, aún cuando la extensión esté deshabilitada o pendiente de instalación. Visita <a href="/es/Traducir_las_descripciones_de_las_extensiones" title="es/Traducir_las_descripciones_de_las_extensiones">Localizar las_descripciones_de_las_extensiones</a> para más detalles.</p>
-
-<h3 id="2do_paso:_Aseg.C3.BArese_de_proveer_actualizaciones_seguras" name="2do_paso:_Aseg.C3.BArese_de_proveer_actualizaciones_seguras">Paso 2: Asegúrate de suministrar actualizaciones seguras</h3>
-
-<p>Si suministras extensiones por tu propia cuenta y no usas un proveedor de hosting seguro como <a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a>, debes asegurarte de suministrar algún método seguro para la actualización de tus extensiones. Esto puede hacerse de dos formas: puedes usar un hosting con servicio de SSL o bien, puedes usar claves criptográficas para firmar la información de actualización. Lee <a href="/es/Versionado,_actualizaci%C3%B3n_y_compatibilidad_de_extensiones" title="es/Versionado,_actualización_y_compatibilidad_de_extensiones">Cómo hacer actualizaciones seguras</a> para más información.</p>
-
-<h3 id="3er_paso:_Resolviendo_problemas_con_APIs_cambiados" name="3er_paso:_Resolviendo_problemas_con_APIs_cambiados">Paso 3: Debes estar al tanto de los cambios en las APIs</h3>
-
-<p>Muchas APIs han sido modificadas de forma significativa. Los cambios más importantes, que seguramente afectarán a muchas extensiones son:</p>
-
-<h4 id="DOM" name="DOM">DOM</h4>
-
-<p>Los nodos de documentos externos deberán copiarse idénticamente usando <code><a href="../../../../en/DOM/document.importNode" rel="internal">importNode()</a></code> (o adoptarlos usando <code><a href="../../../../en/DOM/document.adoptNode" rel="internal">adoptNode()</a></code>) antes de poder insertarlos en el documento actual. Para más información acerca de cuestiones relacionadas con <code><a href="../../../../en/DOM/element.ownerDocument" rel="internal">ownerDocument</a></code>, visita <a class="external" href="http://www.w3.org/DOM/faq.html#ownerdoc" rel="external nofollow" title="http://www.w3.org/DOM/faq.html#ownerdoc">W3C DOM FAQ</a>.</p>
-
-<p>Actualmente, Firefox no exige hacerlo aunque sí lo hizo durante algún tiempo, durante el desarrollo de Firefox 3. Lo que ocurrió fue que muchos sitios sufrían averías cuando esta política era obligatoria. Nuestra recomendación para los desarrolladores web es que corrijan su código para cumplir con esta regla y así lograr una mejor compatibilidad a futuro.</p>
-
-<h4 id="Enlaces_e_Historia" name="Enlaces_e_Historia">Marcadores e Historial</h4>
-
-<p>Si de alguna forma tu extensión tiene acceso a Marcadores o Historial, necesitarás un gran esfuerzo para hacer que sea compatible con Firefox 3. Las APIs antiguas que daban acceso a esta información han sido reemplazadas por la nueva arquitectura <a href="/es/Cat%C3%A1logo" title="es/Catálogo">Catálogo (Biblioteca)</a>. Visita la <a href="/es/Lugares/Gu%C3%ADa_para_migraci%C3%B3n_con_lugares" title="es/Lugares/Guía_para_migración_con_lugares">Guía para la migración a Catálogo (Biblioteca)</a> para más detalles acerca de cómo actualizar tus extensiones para el uso de las APIs de Catálogo (Biblioteca).</p>
-
-<h4 id="Control_de_descargas" name="Control_de_descargas"><span><span>Administrador de descargas</span></span></h4>
-
-<p>La API del Administrador de descargas ha cambiado ligeramente debido a la transición del almacén de datos RDF al uso de la API <a href="/es/Almacenamiento" title="es/Almacenamiento">Almacenamiento</a>. Esto debería ser una transición sencilla y fácil. Además , se ha modificado la API que controla los procesos de descarga para permitir varios receptores del administrador de descargas. Visita {{ Interface("nsIDownloadManager") }}, {{ Interface("nsIDownloadProgressListener") }} y <a href="../../../../en/Monitoring_downloads" rel="internal">Controlar descargas</a> para más información.</p>
-
-<h4 id="Control_de_contrase.C3.B1a" name="Control_de_contrase.C3.B1a">Administrador de contraseñas</h4>
-
-<p>Si tu extensión tiene acceso a información de inicio de sesión de usuario en el Administrador de contraseñas, deberás actualizarla para poder utilizar la nueva API para el Administrador de inicio de sesión.</p>
-
-<ul>
- <li>El artículo <a class="new" href="../../../../es/Using_nsILoginManager" rel="internal">Utilizar nsILoginManager</a> incluye ejemplos y hasta una demostración de cómo debes escribir extensiones que funcionen tanto con el Administrador de contraseñas como con el Administrador de inicio de sesión, de manera que ambos funcionen con Firefox 3 y versiones anteriores.</li>
- <li><code><a href="/en/nsILoginInfo" title="en/nsILoginInfo">nsILoginInfo</a></code></li>
- <li><code><a href="/en/nsILoginManager" title="en/nsILoginManager">nsILoginManager</a></code></li>
-</ul>
-
-<p style="text-align: left;">También puedes sobrescribir el almacén del administrador de contraseñas interno si quieres ofrecer tu propia implementación del almacén de contraseñas en la extensión. Visita <a class="new" href="../../../../es/Creating_a_Login_Manager_storage_module" rel="internal">Crear un módulo de almacenamiento para el Administrador de inicio de sesión</a> para más detalles</p>
-
-<h4 id="Ventanas_emergentes_(Menús_Menús_contextuales_Tooltips_y_Paneles)"><span><span>Ventanas emergentes (Menús, Menús contextuales, Tooltips y Paneles)</span></span></h4>
-
-<p>En Firefox 3, se ha modificado sustancialmente el sistema XUL de ventanas emergentes. El sistema de ventanas emergentes ahora contempla menús principales, menús contextuales y paneles. Se ha creado una guía para <a class="new" href="../../../../es/XUL/PopupGuide" rel="internal">Utilizar Ventanas emergentes</a> que detalla cómo funciona este sistema. Algo que debes tener en cuenta, es que se desaconseja el uso de <code>popup.<span class="lang lang-en"><a href="../../../../en/XUL/Method/showPopup" rel="internal">showPopup</a></span></code> en favor de los nuevos <code>popup.<span class="lang lang-en"><a href="../../../../en/XUL/Method/openPopup" rel="internal">openPopup</a></span></code> y <code>popup.<span class="lang lang-en"><a href="../../../../en/XUL/Method/openPopupAtScreen" rel="internal">openPopupAtScreen</a></span></code>.</p>
-
-<div id="section_10">
-<h4 class="editable" id="Autocompletar"><span><span>Autocompletar</span> </span></h4>
-</div>
-
-<p>El método <code><a class="new" href="../../../../es/NsIAutoCompleteController#handleEnter.28.29" rel="internal">handleEnter()</a></code> de la interfaz <span class="lang lang-es"><code><a class="new" href="../../../../es/nsIAutoCompleteController" rel="internal">nsIAutoCompleteController</a></code></span> ha cambiado para aceptar un argumento que indique si el texto ha sido seleccionado desde una ventana emergente para Autocompletar o bien, por el usuario que ha pulsado la tecla Entrar (Enter) después de ingresar texto.</p>
-
-<h4 id="DOMParser" name="DOMParser">DOMParser</h4>
-
-<ul>
- <li>Cuando se inicia una instancia de <code>DOMParser</code>, ésta hereda el código de la llamada principal, además de los códigos <code>documentURI</code> y <code>baseURI</code> de la ventana del constructor de donde proviene.</li>
- <li>Si el llamante tiene privilegios UniversalXPConnect, puede pasar parámetros a <code>new DOMParser()</code>. Si se pasan menos de tres parámetros, los parámetros restantes se pasarán con el valor <code>null</code> de forma predeterminada.
-  <ul>
-   <li>El primer parámetro es el principal que se debe utilizar y por esto, se sobrescribe el valor principal predeterminado generalmente heredado.</li>
-   <li>El segundo parámetro es el <code>documentURI</code> que se debe utilizar.</li>
-   <li>El tercer parámetro es el <code>baseURI</code> que se debe utilizar.</li>
-  </ul>
- </li>
- <li>Si inicias un <code>DOMParser</code> usando una instrucción como <code>createInstance()</code> y no llamas al método <code>init()</code> de <code>DOMParser</code>, al intentar iniciar la operación de análisis, se creará e iniciará automáticamente un <code>DOMParser</code> con un principal nulo y punteros <code>null</code> para <code>documentURI</code> y <code>baseURI</code>.</li>
-</ul>
-
-<h4 id="Interfaces_removidas" name="Interfaces_removidas">Interfaces eliminadas</h4>
-
-<p>Las siguientes interfaces han sido eliminadas en Gecko 1.9, el motor de renderizado de Firefox 3. Si tu extensión utiliza cualquiera de estas interfaces, deberás actualizar tu código:</p>
-
-<ul>
- <li><code>nsIDOMPaintListener</code></li>
- <li><code>nsIDOMScrollListener</code></li>
- <li><code>nsIDOMMutationListener</code></li>
- <li><code>nsIDOMPageTransitionListener</code></li>
- <li><code>nsICloseAllWindows</code> (Lee el {{ Bug(386200) }})</li>
-</ul>
-
-<h3 id="4to_paso:_Buscar_cambios_importantes_a_chrome" name="4to_paso:_Buscar_cambios_importantes_a_chrome">Paso 4: Comprueba los cambios importantes en el chrome</h3>
-
-<p>Se ha producido un cambio menor en el chrome que puede requerir cambios en tu código. Se ha añadido un nuevo <code>vbox</code> llamado "browser-bottombox", que integra la barra de búsqueda y la barra de estado en la parte inferior de la ventana del navegador. Aunque esto no afecta la apariencia de la pantalla, puede que afecte tu extensión si el chrome se superpone, en relación a los elementos descriptos.</p>
-
-<p>Por ejemplo, si has superpuesto algún elemento del chrome antes de la barra de estado de la siguiente manera:</p>
-
-<pre>&lt;window id="main-window"&gt;
-  &lt;something insertbefore="status-bar" /&gt;
-&lt;/window&gt;
-</pre>
-
-<p>Debes cambiar tu código a algo que se parezca a:</p>
-
-<pre>&lt;vbox id="browser-bottombox"&gt;
-  &lt;something insertbefore="status-bar" /&gt;
-&lt;/vbox&gt;
-</pre>
-
-<p>O bien, emplear la siguiente técnica para hacer que la superposición funcione en Firefox 2 y Firefox 3 por igual:</p>
-
-<pre>&lt;window id="main-window"&gt;
-  &lt;vbox id="browser-bottombox" insertbefore="status-bar"&gt;
-    &lt;something insertbefore="status-bar" /&gt;
-  &lt;vbox&gt;
-&lt;/window&gt;
-</pre>
-
-<p>{{ Note("Este cambio es efectivo para Firefox 3 beta 4 y la prebeta 4.") }}</p>
-
-<h4 id="Otros_cambios" name="Otros_cambios">Otros cambios</h4>
-
-<p><em>Añade aquí cambios sencillos que debas realizar cuando actualizas tu extensión para que funcione con Firefox 3</em><em>.</em></p>
-
-<ul>
- <li>Por razones de seguridad, se ha dejado de implementar <code><a class="external" rel="freelink">chrome://browser/base/utilityOverlay.js</a></code>. Si lo estabas usando, deberás cambiarlo por <code><a class="external" rel="freelink">chrome://browser/content/utilityOverlay.js</a></code>.</li>
- <li>Para implementar <span class="lang lang-es"><code><a class="new" href="../../../../es/nsIAboutModule" rel="internal">nsIAboutModule</a></code></span> ahora debes incluir el método <code>getURIFlags</code>. Visita <span class="lang lang-en"><a class="external" href="http://mxr.mozilla.org/mozilla-central/source/netwerk/protocol/about/public/nsIAboutModule.idl" rel="external nofollow" title="http://mxr.mozilla.org/mozilla-central/source/netwerk/protocol/about/public/nsIAboutModule.idl">nsIAboutModule.idl</a></span> para consultar la documentación. Esto afecta a las extensiones que brinden nuevas URIs del tipo <code>about:</code>. ( <span class="lang lang-*"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=337746" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=337746">bug 337746</a> </span>)</li>
- <li>El elemento <span class="lang lang-*"><a href="../../../../en/XUL/tabbrowser" rel="internal">tabbrowser</a></span> ya no forma parte del "conjunto de herramientas" ( <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=339964" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=339964">bug 339964</a> </span>). Esto significa que este elemento ya no está disponible en aplicaciones y extensiones XUL. Este elemento sigue siendo parte de la ventana principal de Firefox (browser.xul).</li>
- <li>Es necesario documentar los cambios en <a class="new" href="../../../../es/NsISupports_proxies" rel="internal">nsISupports proxies</a> <a class="external" href="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/78236a4b312a2de4/939240fc3f5123a8?lnk=st&amp;rnum=1#939240fc3f5123a8" rel="external nofollow" title="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/78236a4b312a2de4/939240fc3f5123a8?lnk=st&amp;rnum=1#939240fc3f5123a8">[1]</a> y posiblemente, también aquellos relacionados con el procesamiento de interfaces.</li>
- <li>Si utilizas instrucciones de proceso XML, como por ejemplo <code>&lt;?xml-stylesheet ?&gt;</code> en tus archivos XUL, ten en cuenta los cambios descriptos en el <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=319654" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=319654">bug 319654</a> </span>:
-  <ol>
-   <li>Se han añadido los XML PIs al DOM del documento XUL. Esto significa que no se garantiza que <span class="lang lang-*"><code><a href="../../../../en/DOM/document.firstChild" rel="internal">document.firstChild</a></code></span> sea el elemento raíz. Si necesitas hacer referencia al documento raíz en tu script, usa <span class="lang lang-*"><code><a href="../../../../en/DOM/document.documentElement" rel="internal">document.documentElement</a></code></span> en su lugar.</li>
-   <li>Las instrucciones de procesamiento <code>&lt;?xml-stylesheet ?&gt;</code> y <code>&lt;?xul-overlay ?&gt;</code> ahora no tienen efecto fuera del prólogo del documento.</li>
-  </ol>
- </li>
- <li>Cuando se carga contenido web (es decir, se carga la página en el navegador) no se inicia <code>window.addEventListener("load", myFunc, true)</code>. Esto ocurre debido a que el <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=296639" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=296639">bug 296639</a> </span>cambia la forma de comunicación entre las ventanas internas y externas. Para corregir esto en forma sencilla, emplea <code>gBrowser.addEventListener("load", myFunc, true)</code>, según se describe <a class="new" href="../../../../es/Code_snippets/Tabbed_browser#Detecting_page_load" rel="internal">aquí</a>. Además, funciona también para Firefox 2.</li>
- <li><code>content.window.getSelection()</code> ofrece un objeto (que puede ser convertido en cadena con <code>toString()</code>). Se desaconseja el uso de <code>content.document.getSelection()</code> que devuelve una cadena.</li>
- <li>A partir de Firefox 2, se desaconsejó el uso de <code>event.preventBubble()</code> y actualmente, ha desaparecido en Firefox 3. En su lugar, usa <a class="new" href="../../../../es/DOM/event.stopPropagation" rel="internal"><code>event.stopPropagation()</code></a>, que también funciona en Firefox 2.</li>
- <li>Los contadores de tiempo que se inician usando <code>setTimeout()</code> ahora están bloqueados por las ventanas en modo 'modal' gracias a la corrección hecha en el <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=52209" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=52209">bug 52209</a> </span>. En su lugar, podrías usar <code>nsITimer</code>.</li>
- <li>Si en tu extensión necesitas permitir una fuente no fiable (un sitio web, por ejemplo) para acceder al chrome de la extensión, debes usar el nuevo flag <a class="new" href="../../../../es/Chrome_Registration#contentaccessible" rel="internal"><code>contentaccessible</code> flag</a>.</li>
-</ul>
diff --git a/files/es/actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_mozilla/index.html b/files/es/actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_mozilla/index.html
deleted file mode 100644
index b29ef38baf..0000000000
--- a/files/es/actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_mozilla/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: Actualizar una extensión para que soporte múltiples aplicaciones de Mozilla
-slug: Actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_Mozilla
-tags:
-  - Complementos
-  - Todas_las_Categorías
-  - extensiones
----
-<p> </p>
-<p>Este artículo muestra cómo coger una extensión existente y actualizarla para que pueda ser utilizada en otras aplicaciones de Mozilla. Utilizaremos como base la extensión de visualización de stocks creada en los artículos anteriores de esta serie, actualizándola para que pueda ser utilizada en Thunderbird y Sunbird (las anteriores versiones sólo funcionaban en Firefox).</p>
-<p>Si aún no has creado una extensión o te gustaría refrescar la memoria, echa una ojeada a los anteriores artículos de la serie:</p>
-<ul> <li><a href="/es/Crear_una_extensi%C3%B3n_en_la_barra_de_estado" title="es/Crear_una_extensión_en_la_barra_de_estado">Crear una extensión en la barra de estado</a></li> <li><a href="/es/Crear_una_extensi%C3%B3n_din%C3%A1mica_en_la_barra_de_estado" title="es/Crear_una_extensión_dinámica_en_la_barra_de_estado">Crear una extensión dinámica en la barra de estado</a></li> <li><a href="/es/A%C3%B1adir_preferencias_a_una_extensi%C3%B3n" title="es/Añadir_preferencias_a_una_extensión">Añadir preferencias a una extensión</a></li> <li><a href="/es/Traducir_una_extensi%C3%B3n" title="es/Traducir_una_extensión">Traducir una extensión</a></li>
-</ul>
-<h2 id="Descargar_el_ejemplo">Descargar el ejemplo</h2>
-<p>Puedes descargar el código de ejemplo de este artículo para que puedas compararlo con el artículo o para utilizarlo como base para tu propia extensión.</p>
-<ul> <li><a class="external" href="http://developer.mozilla.org/samples/extension-samples/stockwatcher-multiapp.zip">Descargar el ejemplo</a></li>
-</ul>
-<h2 id="Actualizar_el_manifiesto_de_instalaci.C3.B3n">Actualizar el manifiesto de instalación</h2>
-<p>El primer paso es revisar el <a href="/es/Manifiesto_de_instalaci%C3%B3n" title="es/Manifiesto_de_instalación">manifiesto de instalación</a> para indicar que puede ser instalado en Thunderbird y Sunbird. Esto se hace añadiendo nuevas etiquetas <code>&lt;targetApplication&gt;</code> al fichero <code>install.rdf</code>, como esta:</p>
-<pre>    &lt;!-- Describe las versiones de Thunderbird soportadas --&gt;
-
-    &lt;em:targetApplication&gt;
-      &lt;Description&gt;
-        &lt;em:id&gt;{3550f703-e582-4d05-9a08-453d09bdfdc6}&lt;/em:id&gt;
-        &lt;em:minVersion&gt;1.5&lt;/em:minVersion&gt;
-        &lt;em:maxVersion&gt;2.0.0.*&lt;/em:maxVersion&gt;
-      &lt;/Description&gt;
-    &lt;/em:targetApplication&gt;
-
-    &lt;!-- Describe las versiones de Sunbird soportadas --&gt;
-
-    &lt;em:targetApplication&gt;
-      &lt;Description&gt;
-        &lt;em:id&gt;	{718e30fb-e89b-41dd-9da7-e25a45638b28}&lt;/em:id&gt;
-        &lt;em:minVersion&gt;0.2&lt;/em:minVersion&gt;
-        &lt;em:maxVersion&gt;0.4.*&lt;/em:maxVersion&gt;
-      &lt;/Description&gt;
-    &lt;/em:targetApplication&gt;
-</pre>
-<p>Estos dos bloques indican que la extensión soporta las versiones de la 1.5 a la 2.0.0.x de Thunderbird y las de la 0.2 a la 0.4.x de Sunbird.</p>
-<p>Después de introducir este código, puedes instalar la extensión en Firefox, Thunderbird o Sundbird, aunque no obtendrás ningún efecto ni en Thunderbird ni en Sunbird.</p>
-<p>Esto pasa porque no hay nada que le diga a esas dos aplicaciones qué hacer con el chrome proporcionado por la extensión. Ahí es donde el <a href="/es/Manifiesto_chrome" title="es/Manifiesto_chrome">manifiesto chrome</a> entra en acción.</p>
-<h2 id="Actualizar_el_manifiesto_chrome">Actualizar el manifiesto chrome</h2>
-<p>¿Recuerdas el <a href="/es/Crear_una_extensi%C3%B3n_en_la_barra_de_estado" title="es/Crear_una_extensión_en_la_barra_de_estado">primer artículo de la serie</a> cuando creamos nuestro manifiesto chrome, el cual no hemos tocado desde entonces? Es hora de tocarlo. Como podrás (o no) recordar, dicho fichero le dice a la aplicación sobre qué código XUL necesita la interfaz de tu extensión ser mezclada.</p>
-<p>Para Firefox, sobrecargamos el <code>browser.xul</code>, que describe la ventana del navegador de Firefox. Necesitamos añadir líneas al manifiesto para Thunderbird y Sunbird, así:</p>
-<pre># Thunderbird
-overlay chrome://messenger/content/messenger.xul chrome://stockwatcher2/content/stockwatcher2.xul
-
-# Sunbird
-
-overlay chrome://calendar/content/calendar.xul chrome://stockwatcher2/content/stockwatcher2.xul
-</pre>
-<p>Estas líneas provocan que la ventana principal con la lista de mensajes de Thunderbird y la ventana principal en Sundbird sean el objetivo de la sobrecarga que aplicaremos en el fichero <code>stockwatcher2.xul</code>.</p>
-<p>Con estos dos simples giros, esta extensión funcionará en las tres aplicaciones y lo harà exactamente de la misma forma en todas ellas.</p>
diff --git a/files/es/applying_svg_effects_to_html_content/index.html b/files/es/applying_svg_effects_to_html_content/index.html
deleted file mode 100644
index b5c8f17b51..0000000000
--- a/files/es/applying_svg_effects_to_html_content/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: Aplicación de efectos de SVG para el contenido HTML
-slug: Applying_SVG_effects_to_HTML_content
-tags:
-  - CSS
-  - Firefox 3.5
-  - Firefox 4.0
-  - HTML
-  - HTML 5
-  - SVG
-  - XHTML
----
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Aplicación de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efectos de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML.</span></span></p>
-<p>{{ gecko_minversion_header("1.9.1") }}</p>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Firefox</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">3.5</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">introduce</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">soporte para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">usar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">como un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">componente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efectos de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
-<br>
-<span class="hps" title="Haz clic para obtener otras posibles traducciones">Puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">especificar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los estilos</span><span title="Haz clic para obtener otras posibles traducciones">, ya sea dentro</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mismo documento</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">o dentro de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">hoja de estilos externa</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<div class="note"><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Nota</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Las referencias</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en archivos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">externos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">deben</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ser</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de el mismo origen</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de origen</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></div>
-<h2 id="Uso_integrado_SVG"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Uso</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">integrado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span></span></h2>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Para aplicar un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efecto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">usando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">primero tiene</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">crear el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que hace referencia al</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<pre class="brush: html">&lt;style&gt;.stylename { mask: url(#localstyle); }&lt;/style&gt;
-</pre>
-<p> <span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">En el ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">anterior</span><span title="Haz clic para obtener otras posibles traducciones">, el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">nuevo estilo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">por "</span><span title="Haz clic para obtener otras posibles traducciones">stylename</span><span title="Haz clic para obtener otras posibles traducciones">,</span><span title="Haz clic para obtener otras posibles traducciones">"</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">es</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que hace referencia</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a el identificador</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">localstyle</span><span title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Una vez que se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estableció</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la máscara</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplica</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">todos los elementos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
-<br>
-<span class="hps" title="Haz clic para obtener otras posibles traducciones">Esto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">suena</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">más</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">complicado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">lo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que realmente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">es</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">echar un vistazo a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los ejemplos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tener una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">buena idea de cómo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">funciona esto</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
-<br>
-<span class="hps" title="Haz clic para obtener otras posibles traducciones">Hay</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tres</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos que se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">pueden aplicar</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">usar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la máscara</span><span title="Haz clic para obtener otras posibles traducciones">, el recorrido de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">clip</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">o un filtro</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<p> </p>
-<h3 id="Ejemplo_Enmascaramiento_(Máscara)"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Enmascaramiento (M</span></span><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">áscara)</span></span></h3>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Por</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">establecer un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">proporciona</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de degradado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">código</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">similar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">lo siguiente en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">su</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
-<p><strong><span style="color: rgb(255, 0, 0);">NOTA:</span> </strong><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">El espaciamiento de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">nombre no</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">es válida</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML 5</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">dejar fuera</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de la</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">svg</span><span title="Haz clic para obtener otras posibles traducciones">:</span><span title="Haz clic para obtener otras posibles traducciones">"</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">las etiquetas</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los documentos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en formato HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<pre class="brush: xml">  &lt;style&gt;.target { mask: url(#m1); }&lt;/style&gt;
-  &lt;svg:svg height="0"&gt;
-    &lt;svg:mask id="m1" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox"&gt;
-      &lt;svg:linearGradient id="g" gradientUnits="objectBoundingBox" x2="0" y2="1"&gt;
-        &lt;svg:stop stop-color="white" offset="0"/&gt;
-        &lt;svg:stop stop-color="white" stop-opacity="0" offset="1"/&gt;
-      &lt;/svg:linearGradient&gt;
-      &lt;svg:circle cx="0.25" cy="0.25" r="0.25" id="circle" fill="white"/&gt;
-      &lt;svg:rect x="0.5" y="0.2" width="0.5" height="0.8" fill="url(#g)"/&gt;
-    &lt;/svg:mask&gt;
-  &lt;/svg:svg&gt;
-</pre>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Tenga en cuenta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en la línea</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">1</span><span title="Haz clic para obtener otras posibles traducciones">, la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se especifica</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mediante</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una dirección URL para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ID</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">#</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">M1</span><span title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que es</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el identificador</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se especifican a continuación</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Todo lo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">demás</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se especifican otros detalles</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">sobre</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">misma</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de degradado</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">En realidad,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de aplicar el efecto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">XHTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">o</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se hace</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">simplemente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">asignar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de destino</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">definido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">anteriormente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el elemento</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">así</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
-<pre class="brush: xml">&lt;iframe class="target" src="http://mozilla.org"/&gt;</pre>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">En este ejemplo se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">incrusta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">iframe</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que contiene</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">sitio</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">web de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Mozilla.org</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">representa</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que se le aplica</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<p><a class="internal" href="/@api/deki/files/3213/=maskdemo.xhtml" title="/@api/deki/files/3213/=maskdemo.xhtml">View this example live</a>.</p><h3 id="Ejemplo_Recorte"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Recorte</span></span></h3>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">muestra cómo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para recortar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Cuando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">nos fijamos en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la demostración</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en vivo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cuenta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">incluso en las zonas</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">calientes</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los enlaces</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">recortan</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<pre class="brush: xml">  &lt;style&gt;.target { clip-path: url(#c1); }&lt;/style&gt;
-  &lt;svg:svg height="0"&gt;
-    &lt;svg:clipPath id="c1" clipPathUnits="objectBoundingBox"&gt;
-      &lt;svg:circle cx="0.25" cy="0.25" r="0.25" id="circle"/&gt;
-      &lt;svg:rect x="0.5" y="0.2" width="0.5" height="0.8"/&gt;
-    &lt;/svg:clipPath&gt;
-  &lt;/svg:svg&gt;
-</pre>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Esto establece</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">área de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">recorte</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">compuesto por</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">círculo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">rectángulo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y le asigna</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ID</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">#</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">c1</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Esto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">entonces se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">hace referencia</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Una vez que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de destino</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">establece</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de esta manera</span><span title="Haz clic para obtener otras posibles traducciones">, la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ruta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">asignar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a cualquier</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">elemento</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Tenga en cuenta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">también</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">realizar cambios en el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en tiempo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">real</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ver</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambios</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">afectan inmediatamente a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la prestación</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Por</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambiar el tamaño del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">círculo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">camino</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">establecido:</span></span></p>
-<pre class="brush: xml">    var circle = document.getElementById("circle");
-    circle.r.baseVal.value = 0.40 - circle.r.baseVal.value;
-</pre>
-<p><a class="internal" href="/@api/deki/files/3214/=clipdemo.xhtml" title="/@api/deki/files/3214/=clipdemo.xhtml">View this example live</a>.  <span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">El ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">incluye</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">botón</span>, <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">hacer clic</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambiar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ruta de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ver que el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambio surta efecto.</span></span></p><h3 id="Ejemplo_Filtrar"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Filtrar</span></span></h3>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">muestra cómo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtro</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Establece</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">varios filtros</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que se aplican</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cada uno</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tres</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">elementos</span><span title="Haz clic para obtener otras posibles traducciones">, tanto en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los Estados</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">suspender</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">normal y</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el ratón</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
-<br>
-<span class="hps" title="Haz clic para obtener otras posibles traducciones">Cualquier</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtro se puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de esta manera</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Por ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efecto de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">desenfoque gaussiano</span><span title="Haz clic para obtener otras posibles traducciones">, puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizar</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
-<pre class="brush: xml">&lt;svg:filter id="f1"&gt;
-  &lt;svg:feGaussianBlur stdDeviation="3"/&gt;
-&lt;/svg:filter&gt;
-</pre>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">También puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">matriz de color</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de esta manera:</span></span></p>
-<pre class="brush: xml">    &lt;svg:filter id="f2"&gt;
-      &lt;svg:feColorMatrix values="0.3333 0.3333 0.3333 0 0
-                                 0.3333 0.3333 0.3333 0 0
-                                 0.3333 0.3333 0.3333 0 0
-                                 0      0      0      1 0"/&gt;
-
-    &lt;/svg:filter&gt;
-</pre>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Estos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">son</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">sólo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">dos de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los cinco</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtros de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">muestra en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Asegúrese</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">echar un vistazo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">al</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">código</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">completo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">si</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">le gustaría</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ver</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">más</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
-<br>
-<span class="hps" title="Haz clic para obtener otras posibles traducciones">Los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cinco</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtros se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplican</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mediante el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">siguiente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">código CSS:</span></span></p>
-<pre class="brush: xml">  &lt;style&gt;
-    p.target { filter:url(#f3); }
-    p.target:hover { filter:url(#f5); }
-    b.target { filter:url(#f1); }
-    b.target:hover { filter:url(#f4); }
-    iframe.target { filter:url(#f2); }
-    iframe.target:hover { filter:url(#f3); }
-  &lt;/style&gt;
-</pre>
-<p><a class="internal" href="/@api/deki/files/3217/=filterdemo.xhtml" title="/@api/deki/files/3217/=filterdemo.xhtml">View this example live</a>.</p><h2 id="Uso_de_referencias_externas"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Uso de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">referencias</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">externas</span></span></h2>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">elementos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utiliza</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para cortar</span><span title="Haz clic para obtener otras posibles traducciones">, el enmascaramiento</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y así sucesivamente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se pueden cargar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">desde</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">externo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mientras</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">proviene</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mismo origen</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML al que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplica.</span><br>
-<br>
-<span class="hps" title="Haz clic para obtener otras posibles traducciones">Por ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">si</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tu</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un archivo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">llamado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">default.css</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tener el siguiente aspecto</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
-<pre class="brush: xml">.target { clip-path: url(resources.svg#c1); }</pre>
-<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">El</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se importa</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">desde</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">archivo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">llamado</span></span> <code>resources.svg</code>, <span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ruta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ID</span></span> <code>c1</code>.</p><h2 id="Véa_también"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Véa</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">también</span></span></h2>
-<ul> <li><a class="internal" href="/en/SVG" title="En/SVG">SVG</a></li> <li><a class="external" href="/web-tech/2008/09/15/svg-effects-for-html-content" title="https://developer.mozilla.org/editor/fckeditor/core/editor/web-tech/2008/09/15/svg-effects-for-html-content/">SVG Effects for HTML Content</a> (blog post)</li> <li><a class="external" href="/web-tech/2008/10/10/svg-external-document-references" title="https://developer.mozilla.org/editor/fckeditor/core/editor/web-tech/2008/10/10/svg-external-document-references/">SVG External Document References</a> (blog post)</li>
-</ul>
-<p> </p>
-<p> </p>
-<p style="margin-left: 680px;">                      CESAR ORTIZ GUTIERREZ - ELPATOX - wWw.Patito.Tk</p>
diff --git a/files/es/añadir_lectores_de_canales_a_firefox/index.html b/files/es/añadir_lectores_de_canales_a_firefox/index.html
deleted file mode 100644
index 5b8c50bc83..0000000000
--- a/files/es/añadir_lectores_de_canales_a_firefox/index.html
+++ /dev/null
@@ -1,51 +0,0 @@
----
-title: Añadir lectores de canales a Firefox
-slug: Añadir_lectores_de_canales_a_Firefox
-tags:
-  - RSS
-  - Todas_las_Categorías
-translation_of: Mozilla/Firefox/Releases/2/Adding_feed_readers_to_Firefox
----
-<div>{{FirefoxSidebar}}</div><p>A partir de Firefox 2, Firefox permite seleccionar diferentes lectores de canales RSS o Atom para usarlos cuando se trata de leer un canal. Este artículo proporciona información sobre cómo añadir lectores adicionales no admitidos por defecto.</p>
-
-<h2 id="A.C3.B1adir_un_nuevo_lector_de_canales_basado_en_la_web" name="A.C3.B1adir_un_nuevo_lector_de_canales_basado_en_la_web">Añadir un nuevo lector de canales basado en la web</h2>
-
-<p>Para añadir un nuevo lector de canales basado en la web, todo lo que tiene que hacer es añadir tres nuevas preferencias:</p>
-
-<dl>
- <dt><code>browser.contentHandlers.types.<em>número</em>.title</code></dt>
- <dd>El nombre del lector de canales.</dd>
- <dt><code>browser.contentHandlers.types.<em>número</em>.type</code></dt>
- <dd>Para un lector de canales, en este caso sería "application/vnd.mozilla.maybe.feed".</dd>
- <dt><code>browser.contentHandlers.types.<em>número</em>.uri</code></dt>
- <dd>La URI del lector de canales. Utilice "%s" donde se deba insertar la URL del canal.</dd>
-</dl>
-
-<p><code><em>número</em></code> debe ser reemplazado con el siguiente número único más alto que no haya sido usado aún. Por ejemplo, si desea añadir un nuevo lector de canales llamado "Lector Sencillo", y ya están definidos manejadores de contenido con los números 0 al 4, debe sustituir <code><em>número</em></code> por 5, como sigue:</p>
-
-<ul>
- <li><code>browser.contentHandlers.types.5.title</code>: Lector Sencillo</li>
- <li><code>browser.contentHandlers.types.5.type</code>: application/vnd.mozilla.maybe.feed</li>
- <li><code>browser.contentHandlers.types.5.uri</code>: <span class="nowiki">http://www.urllectorsencillo.com?feed=%s</span></li>
-</ul>
-
-<p>Puede añadir estas preferencias manualmente, visitando about:config, o puede programarlo, si una extensión desea instalar un nuevo lector de canales.</p>
-
-<h3 id="A.C3.B1adir_un_lector_de_canales_desde_una_aplicaci.C3.B3n_web" name="A.C3.B1adir_un_lector_de_canales_desde_una_aplicaci.C3.B3n_web">Añadir un lector de canales desde una aplicación web</h3>
-
-<p>El código JavaScript en la web puede añadir un lector de canales fácilmente, usando la función <code>navigator.registerContentHandler()</code>, de esta manera:</p>
-
-<pre>navigator.registerContentHandler("application/vnd.mozilla.maybe.feed",
-                                 "http://www.urllectorsencillo.com?feed=%s",
-                                 "Lector Sencillo");
-</pre>
-
-<h2 id="A.C3.B1adir_una_nueva_aplicaci.C3.B3n_lectora_de_canales" name="A.C3.B1adir_una_nueva_aplicaci.C3.B3n_lectora_de_canales">Añadir una nueva aplicación lectora de canales</h2>
-
-<p>La manera más sencilla de hacer esto es simplemente usar la interfaz de usuario disponible, usando el panel Canales en la ventana de preferencias (u opciones, dependiendo de su plataforma).</p>
-
-<p>También se puede hacer programáticamente mediante una extensión, lo cual se hace estableciendo el valor de la opción <code>browser.feeds.handlers.application</code> a la ruta de la aplicación a usar para leer los canales.</p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "en": "en/Adding_feed_readers_to_Firefox", "ja": "ja/Adding_feed_readers_to_Firefox", "zh-tw": "zh_tw/\u65b0\u589e\u6d88\u606f\u4f86\u6e90\u95b1\u8b80\u5de5\u5177" } ) }}</p>
diff --git a/files/es/añadir_motores_de_búsqueda_desde_páginas_web/index.html b/files/es/añadir_motores_de_búsqueda_desde_páginas_web/index.html
deleted file mode 100644
index 638147ee38..0000000000
--- a/files/es/añadir_motores_de_búsqueda_desde_páginas_web/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: Añadir motores de búsqueda desde páginas web
-slug: Añadir_motores_de_búsqueda_desde_páginas_web
-tags:
-  - Plugins_de_búsqueda
-translation_of: Web/OpenSearch
-translation_of_original: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages
----
-<p>Firefox permite que código JavaScript instale plugins de motores de búsqueda, y soporta dos formatos de plugin de motores de búsqueda: <a href="es/Creando_plugins_de_OpenSearch_para_Firefox">OpenSearch</a>, y Sherlock.
-</p>
-<div class="note"><b>Nota:</b> a partir de Firefox 2, OpenSearch es el formato preferido de búsqueda para Firefox.</div>
-<p>Cuando código JavaScript intenta instalar un plugin de búsqueda, Firefox presenta una alerta pidiendo permiso al usuario para instalar el plugin.
-</p>
-<h2 id="Instalando_plugins_de_OpenSearch">Instalando plugins de OpenSearch</h2>
-<p>Para instalar un plugin de OpenSearch, necesita utlilizar el método<code>window.external.AddSearchProvider()</code> DOM . El síntaxis de éste método es:
-</p>
-<pre class="eval">window.external.AddSearchProvider(<i>engineURL</i>);
-</pre>
-<p>Donde <i>engineURL</i> es la URL absoluta del archivo XML para el plugin del motor de búsqueda.
-</p>
-<div class="note"><b>Nota:</b> El soporte de OpenSearch esta sólo disponible en Firefox 2 y posterior.</div>
-<h2 id="Instalando_plugins_de_Sherlock">Instalando plugins de Sherlock</h2>
-<p>Para instalar un plugin de Sherlock, necesitará llamar <code>window.sidebar.addSearchEngine()</code>, el síntaxis para el mismo es:
-</p>
-<pre class="eval">window.sidebar.addSearchEngine(<i>engineURL</i>, <i>iconURL</i>, <i>suggestedName</i>, <i>suggestedCategory</i>);
-</pre>
-<ul><li> El parámetro <code>engineURL</code> es la URL del plugin de Sherlock (un archivo ".src") a instalar.
-</li><li> <code>iconURL</code> es la URL a un icono para asociar al plugin.
-</li><li> El parámetro <code>suggestedName</code> sólo se usa al pedir permiso al usuario para instalar el plugin, así que un mensaje cómo "Desea instalar <i>suggestedName</i> de <i>engineURL</i>?" podrá mostrarse.
-</li><li> El parámetro <code>suggestedCategory</code> no se usa. Debería especificar un valor vacío tipo string (<code>""</code>) o <code>null</code> (nulo).
-</li></ul>
-<p>Para detalles de Sherlock, visite <a class=" external" href="http://developer.apple.com/macosx/sherlock/">http://developer.apple.com/macosx/sherlock/</a>
-</p>
-<h2 id="Detecci.C3.B3n_de_la_capacidad_del_motor_de_b.C3.BAsqueda_del_navegador">Detección de la capacidad del motor de búsqueda del navegador</h2>
-<p>Debido a que las APIs para añadir motores de búsqueda ha cambiado en el paso de la versión 1.5 a la 2 de firefox y ya que Firefox 1.5 no soporta los ficheros de descripción OpenSearch, los desarrolladores web que quieran añadir motores de búsqueda manteniendo la compatibilidad hacia atrás (p.e. que funcione en Firefox 1.5, Firefox 2.0 o IE 7) deben soportar tanto el formato Sherlock como el OpenSearch y deben detectar las capacidades del navegador de acuerdo a ello. El siguiente fragmento de código es un ejemplo de cómo puede hacerse esto:
-</p>
-<pre class="eval">function installSearchEngine() {
- if (window.external &amp;&amp; ("AddSearchProvider" in window.external)) {
-   // Firefox 2 and IE 7, OpenSearch
-   window.external.AddSearchProvider("<span class="nowiki">http://example.com/search-plugin.xml</span>");
- } else if (window.sidebar &amp;&amp; ("addSearchEngine" in window.sidebar)) {
-   // Firefox &lt;= 1.5, Sherlock
-   window.sidebar.addSearchEngine("<span class="nowiki">http://example.com/search-plugin.src</span>",
-                                  "<span class="nowiki">http://example.com/search-icon.png</span>",
-                                  "Search Plugin", "");
- } else {
-   // Sin soporte para motores de búsqueda (IE 6, Opera, etc...).
-   alert("Sin soporte para motores de búsqueda");
- }
-}
-</pre>
-<div class="noinclude">
-</div>
-{{ languages( { "ca": "ca/Addici\u00f3_de_motors_de_cerca_a_les_p\u00e0gines_web", "en": "en/Adding_search_engines_from_web_pages", "fr": "fr/Ajout_de_moteurs_de_recherche_depuis_des_pages_Web", "it": "it/Installare_plugin_di_ricerca_dalle_pagine_web", "ja": "ja/Adding_search_engines_from_web_pages", "pl": "pl/Dodawanie_wyszukiwarek_z_poziomu_stron_WWW", "zh-tw": "zh_tw/\u81ea\u7db2\u9801\u6dfb\u52a0\u641c\u5c0b\u5f15\u64ce" } ) }}
diff --git a/files/es/bugs_importantes_solucionados_en_firefox_3/index.html b/files/es/bugs_importantes_solucionados_en_firefox_3/index.html
deleted file mode 100644
index 5dbc833d4a..0000000000
--- a/files/es/bugs_importantes_solucionados_en_firefox_3/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: Bugs importantes solucionados en Firefox 3
-slug: Bugs_importantes_solucionados_en_Firefox_3
-tags:
-  - Firefox 3
-translation_of: Mozilla/Firefox/Releases/3/Notable_bugs_fixed
----
-<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Este artículo es una lista de correcciones importantes de errores en Firefox 3 que no resultan obvios en la documentación.</p>
-
-<ul>
- <li>Si ocurre un error mientras se analiza un overlay, el overlay no se aplica. Los errores del análisis se registran en la consola de errores. ({{ Bug(335755) }})</li>
- <li>Error corregido en el que los elementos '<code>&lt;menupopup&gt;</code>' pueden colocarse dentro de un contenedor cuando se adjuntan en un elemento menú o de tipo menú. ({{ Bug(345896) }})</li>
- <li>La propiedad '<code>dlgType</code>' de botones funciona correctamente. ({{ Bug(308591) }})</li>
- <li>El argumento '<code>canBubble</code>' de <a href="es/DOM/event.initEvent">event.initEvent</a> funciona correctamente de manera que los eventos pueden ser llamados sin que se hagan recurrentes. ({{ Bug(330190) }})</li>
- <li>El evento '<code>DOMAttrModified</code>' maneja correctamente atributos con nombres con espacio. ({{ Bug(362391) }})</li>
- <li>Las instrucciones de procesamiento XML, tal como '<code>&lt;?xml-stylesheet ?&gt;</code>', se han agregado al DOM de documentos XUL. Lo que significa que no está garantizado que <a href="es/DOM/document.firstChild">document.firstChild</a> sea el elemento raíz, en su lugar utiliza <a href="es/DOM/document.documentElement">document.documentElement</a>. Por otro lado las instrucciones de procesamiento '<code>&lt;?xml-stylesheet ?&gt;</code>' y '<code>&lt;?xul-overlay ?&gt;</code>' ya no tienen efecto fuera del prólogo del documento. ({{ Bug(319654) }})</li>
- <li>Las funciones '<code>getElementsByAttributeNS()</code>' se han añadido a los elementos y documentos XUL. ({{ Bug(239976) }})</li>
- <li>Los escuchadores de eventos se mantienen cuando se mueve o se quita un elemento de un documento XUL. ({{ Bug(286619) }})</li>
- <li>Los eventos de mutación se disparan para documentos no mostrados. ({{ Bug(201236) }})</li>
- <li>Corregidos varios problemas con elementos de dibujo en orden equivocado. ({{ Bug(317375) }})</li>
- <li>Se ha corregido <code><a href="es/DOM/element.getElementsByTagName">getElementsByTagName()</a></code> para que funcione correctamente en sub-árboles que tienen elementos con prefijos en los nombres de las etiquetas. ({{ Bug(206053) }}).</li>
- <li>Los eventos '<code>DOMNodeInserted</code>' y '<code>DOMNodeRemoved</code>' se aplican correctamente a los nodos apropiados ({{ Bug(367164) }}).</li>
- <li>La expresión '<code>\d</code>', uno de los caracteres especiales usados en expresiones regulares, ha sido corregida para que concuerde sólo con dígitos del alfabeto latino (equivalente a <code>{{ mediawiki.external('0-9') }}</code>). ({{ Bug(378738) }})</li>
- <li>La categoría 'image-sniffing-services' permite que un descodificador de imágenes implementado como una extensión, descodifique correctamente imágenes enviadas con un tipo MIME incorrecto. ({{ Bug(391667) }})</li>
-</ul>
-
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
-
-<ul>
- <li><a href="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
-</ul>
-
-<p> </p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "en": "en/Notable_bugs_fixed_in_Firefox_3", "fr": "fr/Bugs_importants_corrig\u00e9s_dans_Firefox_3", "ja": "ja/Notable_bugs_fixed_in_Firefox_3", "pl": "pl/Istotne_b\u0142\u0119dy_poprawione_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/building_an_extension/index.html b/files/es/building_an_extension/index.html
deleted file mode 100644
index 615116edaf..0000000000
--- a/files/es/building_an_extension/index.html
+++ /dev/null
@@ -1,380 +0,0 @@
----
-title: Construyendo una extensión
-slug: Building_an_Extension
-translation_of: Mozilla/Add-ons
-translation_of_original: Building_an_Extension
----
-<h2 id="Introducción">Introducción</h2>
-
-<p>Este tutorial te guiará a través de los pasos requeridos para desarrollar una <a href="/en-US/docs/Extensions" title="/en-US/docs/Extensions">extensión</a> muy básica - una que agrega un panel con una barra de estado con el texto "Hola, Mundo!" al navegador de Firefox.</p>
-
-<div class="note"><strong>Nota:</strong> La extensión creada por este tutorial no funcionará en versiones de Firefox que no contengan una barra de estado estática (esto es, Firefox 4 en adelante). Puedes encontrar un tutorial más actualizado en <a href="/en-US/docs/XUL_School/The_Essentials_of_an_Extension" title="The Essentials of an Extension">The Essentials of an Extension</a> de la <a href="/en-US/docs/XUL_School" title="XUL School Tutorial">XUL School</a>.</div>
-
-<p>Desde Firefox 4 (y otras aplicaciones basadas en Mozilla 2) existen dos tipos de extensiones:</p>
-
-<ul>
- <li>Las extensiones tradicionales, clásicas o XUL son más poderosas, pero más complicadas de construir y requieren un reinicio para su instalación.</li>
- <li>Extensiones sin reinicio, o <a href="/en-US/docs/Extensions/Bootstrapped_extensions" title="/en-US/docs/Extensions/Bootstrapped_extensions">bootstrapped extensions</a> que no requieren un reinicio para instalarse pero son más limitadas que las extensiones tradicionales. El <a class="link-https" href="https://addons.mozilla.org/en-US/developers/tools/builder">Add-on SDK y el Add-on Builder</a> pueden ser usados para construir fácilmente extensiones sin reinicio.</li>
-</ul>
-
-<p>Este artículo explica como construir una extensión tradicional para Firefox. Para información sobre bootstrapped extensions o sin reinicio, mira <a href="/en-US/docs/Extensions/Bootstrapped_extensions" title="/en-US/docs/Extensions/Bootstrapped_extensions">Bootstrapped extensions</a>.</p>
-
-<p>Para un tutorial sobre construcción de extensiones para Thunderbird, mira <a href="/en-US/docs/Extensions/Thunderbird/Building_a_Thunderbird_extension" title="/en-US/docs/Building_a_Thunderbird_extension">Construyendo una extensión para Thunderbird.</a></p>
-
-<h2 id="Inicio_Rápido">Inicio Rápido</h2>
-
-<p>Una extensión <a class="external" href="http://mozilla.doslash.org/stuff/helloworld.zip">Hola Mundo</a> similar que puedes generar con el Extension Wizard es explicado línea por línea en <a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">otro tutorial desde la MozillaZine Knowledge Base (Base de Conocimiento MozillaZine)</a>.</p>
-
-<h2 id="Configurando_un_Ambiente_de_Desarrollo">Configurando un Ambiente de Desarrollo</h2>
-
-<p>Las extensiones son empaquetadas y distribuidas en archivos ZIP o <a href="/en-US/docs/Bundles" title="/en-US/docs/Bundles">Bundles</a>, con la extensión de archivos <code>XPI</code>.</p>
-
-<p><code>Un ejemplo del contenido dentro de un archivo XPI típico </code>:</p>
-
-<pre class="eval">my_extension.xpi:                         //<code>Igual a una carpeta llamada</code> <strong style="font-weight: bold;">my_extension</strong><strong>/</strong>
-          <a href="/en-US/docs/Install_Manifests" title="/en-US/docs/Install Manifests">/install.rdf </a>                   //<code>Información general sobre tu extensión</code>
-          /<a href="/en-US/docs/Chrome_Registration" title="/en-US/docs/Chrome_Registration">chrome.manifest</a>                //Registra tu contenido con el motor <a href="/en-US/docs/Chrome_Registration" title="https://developer.mozilla.org/en-US/docs/chrome_registration">Chrome</a>
-          /chrome/
-          /chrome/content/                //Contenido de tu extensión, por ejemplo, archivos XUL and JavaScript
-          /<a href="/en-US/docs/Window_icons" title="/en-US/docs/Window_icons">chrome/icons/default/*</a>         //Iconos por defecto de tu extensión
-          /chrome/locale/*                //Construyendo una Extensión# <a href="/en-US/docs/Building_an_Extension#Localization" title="https://developer.mozilla.org/en-US/docs/Building_an_Extension#Localization">Localización</a>
-          <a href="#Defaults_Files">/defaults/preferences/*.js</a>      //Construyendo una Extensión# <a href="/en-US/docs/Building_an_Extension#Defaults_Files" title="https://developer.mozilla.org/en-US/docs/Building_an_Extension#Defaults_Files">Archivos por defecto</a>
-          /plugins/*
-<a href="#XPCOM_Components">          /components/*</a>
-          <a href="#Application_Command_Line">/components/cmdline.js</a></pre>
-
-<p>Desearemos construir una estructura de archivos similar a la anterior para nuestro tutorial, así que comencemos creando una carpeta para tu extensión en algún lugar de tu disco duro (por ejemplo, <code>C:\extensions\my_extension\</code> or <code>~/extensions/my_extension/</code>). Dentro de la nueva carpeta para la extensión, crea otra carpeta llamada <code>chrome</code>, y dentro de la carpeta <code>chrome</code>, crea una carpeta llamada <code>content</code>.</p>
-
-<p>Dentro del directorio <strong>raíz</strong> de la carpeta de tu extensión, crea dos archivos de texto nuevos, llamados <code>chrome.manifest<span style="font-family: verdana,tahoma,sans-serif;"> </span></code>e <code>install.rdf</code>. En el directorio <strong>chrome/content</strong>, crea un nuevo archivo de texto vacío llamado <code>sample.xul</code>.</p>
-
-<p>Deberías concluir con esta estructura de directorio:</p>
-
-<ul>
- <li>install.rdf</li>
- <li>chrome.manifest</li>
- <li>chrome\
-  <ul>
-   <li>content\
-    <ul>
-     <li>sample.xul</li>
-    </ul>
-   </li>
-  </ul>
- </li>
-</ul>
-
-<p><span class="comment">&lt;pre&gt; #!/bin/sh h=$HOME/moExt mkdir -p $h/my_extension/chrome/content touch $h/my_extension/chrome.manifest $h/my_extension/install.rdf &lt;/pre&gt;</span> Por favor lee la información adicional sobre configuración de un ambiente de desarrollo en el artículo <a href="/en-US/docs/Setting_up_extension_development_environment" title="/en-US/docs/Setting_up_extension_development_environment">Configurando un ambiente de desarrollo</a>.</p>
-
-<p>{{ gecko_minversion_note("1.9.2", "Starting in Gecko 1.9.2 (Firefox 3.6), you can also simply include an icon, named <code>icon.png</code>, in the base directory of the add-on. This allows your add-on's icon to be displayed even when the add-on is disabled, or if the manifest is missing an <code>iconURL</code> entry.") }}</p>
-
-<h2 id="Crear_el_Manifiesto_de_Instalación">Crear el Manifiesto de Instalación</h2>
-
-<p>Abre el archivo llamado <code><a href="/en-US/docs/Install_Manifests" title="/en-US/docs/Install_Manifests">install.rdf</a></code> que creaste en el tope de la jerarquía de carpetas de tu extensión y agrega dentro lo siguiente:</p>
-
-<pre class="brush: xml  language-xml"><code class="language-xml"><span class="prolog token">&lt;?xml version="1.0"?&gt;</span>
-
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>RDF</span> <span class="attr-name token">xmlns</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.w3.org/1999/02/22-rdf-syntax-ns#<span class="punctuation token">"</span></span>
-     <span class="attr-name token"><span class="namespace token">xmlns:</span>em</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.mozilla.org/2004/em-rdf#<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>Description</span> <span class="attr-name token">about</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>urn:mozilla:install-manifest<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>sample@example.net<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>version</span><span class="punctuation token">&gt;</span></span>1.0<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>version</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>type</span><span class="punctuation token">&gt;</span></span>2<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>type</span><span class="punctuation token">&gt;</span></span>
-
-    <span class="comment token">&lt;!-- Target Application this extension can install into,
-         with minimum and maximum supported versions. --&gt;</span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>targetApplication</span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>Description</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>minVersion</span><span class="punctuation token">&gt;</span></span>1.5<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>minVersion</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>maxVersion</span><span class="punctuation token">&gt;</span></span>4.0.*<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>maxVersion</span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>Description</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>targetApplication</span><span class="punctuation token">&gt;</span></span>
-
-    <span class="comment token">&lt;!-- Front End MetaData --&gt;</span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>name</span><span class="punctuation token">&gt;</span></span>sample<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>name</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>description</span><span class="punctuation token">&gt;</span></span>A test extension<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>description</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>creator</span><span class="punctuation token">&gt;</span></span>Your Name Here<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>creator</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>homepageURL</span><span class="punctuation token">&gt;</span></span>http://www.example.com/<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>homepageURL</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>Description</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>RDF</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<ul>
- <li><code><strong><span class="link-mailto linkification-ext">sample@example.net</span></strong></code> – el ID de la extensión. Este es un valor con el que identificas tu extensión en formato de direccón de correo electrónico (nota que no debería ser <em>tu</em> email). Hazlo único. También podrías usar un GUID. NOTA: Este parámetro DEBE estar en formato de dirección de correo electrónico, aunque NO tiene que ser una dirección válida. (<code><span class="link-mailto">example@example.example</span></code>)</li>
- <li>Especifica <code>&lt;em:type&gt;2&lt;/em:type&gt;</code> – el 2 declara que está instalando una extensión. Si fueras a instalar un tema (theme) sería 4 (mira <a href="/en-US/docs/Install_Manifests#type" title="/en-US/docs/Install_Manifests#type">Install Manifests#type</a> para otros tipos de códigos).</li>
- <li><code><strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong></code> – ID de la aplicación Firefox.</li>
- <li><code><strong>1.5</strong></code> – el número exacto de la versión más antigua de Firefox para la cual estableces que esta extensión funcionará. Nunca uses un * en minVersion; es muy seguro que no hagas lo que esperas.</li>
- <li><code><strong>4.0.*</strong></code> – la versión máxima de Firefox para la cual dices que esta extensión funcionará. En este caso, "4.0.*" indica que la extensión funciona con Firefox 4.0 y cualquier entrega 4.0.x subsecuente. Este número necesita ser menor o igual a la <a class="external" href="http://wiki.mozilla.org/Releases" title="http://wiki.mozilla.org/Releases">versión anunciada de Firefox</a>. Por defecto, Firefox 10 y posteriores no fuerzan una restricción contra <code>maxVersion</code> (aunque comenzando en Firefox 11, valores muy antiguos de <code>maxVersion</code> son todavía forzados). Puedes forzan a la aplicación a hacerlo usando <code>&lt;em:strictCompatibility&gt;</code>.</li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> si obtienes un mensajes que <code>install.rdf</code> está mal formado, es útil cargarlo en Firefox usando el comando Archivo-&gt;Abrir Archivo que reportará los errores XML para ti.</div>
-
-<p>Las extensiones diseñadas para funcionar con Firefox 2.0.0.x como la última deben configurar la máxima versión a "2.0.0.*". Las extensiones diseñadas para funcionar con Firefox 1.5.0.x como la última deben configurar la máxima versión a "1.5.0.*"</p>
-
-<p>Mira <a href="/en-US/docs/Install_Manifests" title="/en-US/docs/Install_Manifests">Manifiestos de Instalación</a> para una lista completa de las propiedades requeridas y opcionales.</p>
-
-<p>Guarda el archivo.</p>
-
-<h2 id="Extendiendo_el_Navegador_con_XUL">Extendiendo el Navegador con XUL</h2>
-
-<p>La interfaz de usuario de Firefox está escrita en XUL y JavaScript. <a href="/en-US/docs/XUL" title="/en-US/docs/XUL">XUL</a> es una grática XML que provee widgets de interfaz como botones, menús, barras de herramientas, árboles, etc. Las acciones de los usuarios están ligadas a funcionalidad usando JavaScript.</p>
-
-<p>Para extender el navegador, modificamos partes de la interfaz de usuario del navegador, agregando o modificando widgets. Agreramos widgets insertando nuevos elementos XUL DOM en la ventana del navegador y los modificamos usando script y vinchulando manejadores de eventos.</p>
-
-<p>El navegador es implementado en un archivo XUL llamado <code>browser.xul</code> (<code>$FIREFOX_INSTALL_DIR/chrome/browser.jar</code> contiene <code>content/browser/browser.xul</code>). En browser.xul podemos encontrar la barra de estado, que se parece a algo como esto:</p>
-
-<pre class="eval  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarpalette</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>BrowserToolbarPalette<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
- ... <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarbutton</span><span class="punctuation token">&gt;</span></span>s ...
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>toolbarpalette</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<p><code>&lt;statusbar id="status-bar"&gt;</code> es un  "punto de fusión" para un XUL Overlay.</p>
-
-<h3 id="XUL_Overlays">XUL Overlays</h3>
-
-<p><a href="/en-US/docs/XUL_Overlays" title="/en-US/docs/XUL_Overlays">Los XUL Overlays</a> son una forma de enlazar en tiempo de ejecución otros widgets de la interfaz de usuario a un documento XUL. Un XUL Overlay es un archivo .xul  que especifíca fragmentos XUL a insertar en puntos de fusión específicos dentro de un documento "maestro". Estos fragmentos pueden especificar la inserción, eliminación o modificación de widgets.</p>
-
-<p><strong>Ejemplo de un Documento XUL Overlay</strong></p>
-
-<pre class="eval  language-html"><code class="language-html"><span class="prolog token">&lt;?xml version="1.0"?&gt;</span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>overlay</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>sample<span class="punctuation token">"</span></span>
-         <span class="attr-name token">xmlns</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
- <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarpalette</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>BrowserToolbarPalette<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarbutton</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>my-button<span class="punctuation token">"</span></span> <span class="attr-name token">label</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>Hello, World<span class="punctuation token">"</span></span>  <span class="punctuation token">/&gt;</span></span>
- <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>toolbarpalette</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>overlay</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<p>La <code>&lt;</code>toolbarpalette<code>&gt;</code> llamada<code><strong> </strong></code><strong>BrowserToolbarPalette </strong> especifica el "punto de fusión" que queremos enlazar dentro de la ventana del navegador.</p>
-
-<p>El hijo <code>&lt;</code>toolbarbutton<code>&gt;</code> es un nuevo widget que queremos insertar dentro de un punto de fusión.</p>
-
-<p>Copia el código de ejemplo anterior y guardalo en tu archivo llamado <code><strong>sample.xul</strong></code> dentro de la carpeta <code>chrome/content</code> que has creado.</p>
-
-<p>Para más información sobre fusionar widgets y modificar la interfaz de usuario usando Overlays, mira debajo.</p>
-
-<h2 id="Chrome_URIs">Chrome URIs</h2>
-
-<p>Los archivos XUL son parte de "<a href="/en-US/docs/Chrome_Registration" title="/en-US/docs/Chrome_Registration">Paquetes Chrome</a>" - envoltorios de componentes de interfaz de usuario que son cargados a través de <code>URIs chrome://</code>. En lugar de cargar el navegador desde el disco usando una URI <code>file://</code>  (ya que la ubicación de Firefox en el sistema puede cambiar de plataforma a plataforma y de sistema a sistema), los desarrolladores de Mozilla encontraron una solución para crear URIs para contenido XUL que la aplicación instalada conoce.</p>
-
-<p>La ventana del navegador es: <code><a class="external" rel="freelink">chrome://browser/content/browser.xul</a></code>. Prueba tipiando esta URL en la barra de navegación de Firefox!</p>
-
-<p>Las Chrome URIs constan de varios componentes:</p>
-
-<ul>
- <li>Primero, el <strong>esquema URI</strong> (<code>chrome</code>) que le comunica a la librería de red de Firefox que es una Chrome URI. Indica que el contenido de la URI debería ser tratada como un (<code>chrome</code>). A diferencia de (<code>chrome</code>), (<code>http</code>) le comunica a Firefox que debe tratar la URI como una página web.</li>
- <li>Segundo, un nombre de paquete (en el anterior ejemplo, <code><strong>browser</strong></code>) que identifica el envoltorio de componentes de interfaz de usuario. Este debería ser lo más único posible para tu aplicación, para evitar colisiones entre extensiones.</li>
- <li>Tercero, el tipo de dato que es requerido. Existen tres tipos: <code>content</code> (XUL, JavaScript, XBL bindings, etc. que forman la estructura y el comportamiento de una aplicación de interfaz de usuario), <code>locale</code> (DTD, archivos .properties, etc que contienen strings para la <a href="/en-US/docs/Localization" title="/en-US/docs/Localization">localización</a> de la interfaz de usuario) , y <code>skin</code> (CSS e imágenes que forman el <a href="/en-US/docs/Themes" title="/en-US/docs/Themes">tema</a> de la interfaz de usuario).</li>
- <li>Finalmente, la dirección del archivo a cargar.</li>
-</ul>
-
-<p>Así que, <code><a class="external" rel="freelink">chrome://foo/skin/bar.png</a></code> carga el archivo <code>bar.png</code> desde la sección <code>skin</code> del tema <code>foo</code>.</p>
-
-<p>Cuando cargas contenido usando una Chrome URI, Firefox usa el Chrome Registry (Registro de Chrome) para traducir estas URIs en los archivos fuente actuales dentro del disco (o en paquetes JAR).</p>
-
-<h2 id="Crea_un_Manifiesto_Chrome">Crea un Manifiesto Chrome</h2>
-
-<p>Para más información de Manifiestos Chrome y las propiedades que soportan, mira Referencia <a href="/en-US/docs/Chrome_Registration" title="/en-US/docs/Chrome_Registration">de Manifiestos Chrome</a>.</p>
-
-<p>Abre el archivo denominado <strong>chrome.manifest</strong> que has creado junto al directorio <code>chrome</code> en la raíz de la jerarquía de carpetas de tu extensión.</p>
-
-<p>Agrega este código:</p>
-
-<pre class="eval">content     sample    chrome/content/
-</pre>
-
-<p>(<strong>No te olvides de la barra, "<code>/</code>"!</strong> Sin ella, el paquete no será registrado.)</p>
-
-<p>Esto especifica:</p>
-
-<ol>
- <li>tipo de material dentro del paquete chrome.</li>
- <li>nombre del paquete chrome (asegúrate de usar todos caracteres en minúscula para ele nombre del paquete ("sample") ya que Firefox/Thunderbird no soporta doesn't support caracteres mixtos en la versión 2 y anteriores - {{ Bug("132183") }})</li>
- <li>ubicación de los archivos de paquetes chrome.</li>
-</ol>
-
-<p><br>
- Entonces, esta línea establece que para un paquete chrome <strong>sample</strong>, podremos encontrar sus archivos de contenido (<strong>content)</strong> en la ubicación <code>chrome/content</code> que es una dirección relativa a la ubicación del manifiesto <code>chrome.manifest</code>.</p>
-
-<p>Tenga en cuenta que los archivos de contenido (content), localización (locale), y apariencia (skin) deben mantenerse dentro de carpetas llamadas content, locale, and skin dentro del subdirectorio <code>chrome</code>.</p>
-
-<p>Guarda el archivo. Cuando ejecutes Firefox con tu extensión (más adelante en este tutorial), esto va a registrar el paquete chrome.</p>
-
-<h2 id="Registrar_un_Overlay">Registrar un Overlay</h2>
-
-<p>Necesitas que Firefox fusione tu overlay (capa) con la ventana del navegador siempre que se despliegue una. Así que agrega esta linea al archivo <code>chrome.manifest</code>:</p>
-
-<pre class="eval">overlay <a class="external" rel="freelink">chrome://browser/content/browser.xul</a> <a class="external" rel="freelink">chrome://sample/content/sample.xul</a>
-</pre>
-
-<p>Esto le dice a Firefox que fusione <code>sample.xul</code> en <code>browser.xul</code> cuando se cargue <code>browser.xul</code>.</p>
-
-<h2 id="Prueba">Prueba</h2>
-
-<p>Primero, necesitamos comunicarle a Firefox sobre nuestra extensión. Durante la fase de desarrollo para versiones de Firefox 2.0 y posteriores, puedes señalar a Firefox hacia la carpeta donde estés desarrollando la extensión, y la cargará cada vez que reinicies Firefox.</p>
-
-<ol>
- <li>Ubica tu <a class="external" href="http://kb.mozillazine.org/Profile_folder" title="http://kb.mozillazine.org/Profile_folder">carpeta de perfil</a> y dentro el perfil con el que quieres trabajar (ej., <code>Firefox/Profiles/&lt;profile_id&gt;.default/</code>).</li>
- <li>Abra la carpeta <code>extensions/</code>, creandola de ser necesario.</li>
- <li>Crea un nuevo archivo de texto y coloca dentro la dirección completa de tu carpeta de desarrollo (ej., <code>C:\extensions\my_extension\</code> or <code>~/extensions/my_extension/)</code>. Los usuarios de Windows deberían conservar la dirección de la barra, y <em>todos</em> deberían acordarse de <strong>incluir</strong> una barar de cierre y <strong>eliminar</strong> cualquier espacio.</li>
- <li>Guarda el archivo con la id de tu extensión como su nombre (ej., <code><a class="linkification-ext link-mailto" href="mailto:sample@example.net" title="Linkification: mailto:sample@example.net">sample@example.net</a></code>). Sin extensión de archivo.</li>
-</ol>
-
-<p>Ahora deberías estar listo opara probar tu extensión!</p>
-
-<p>Ejecuta Firefox. Firefox detectará el texto de enlace hacia el directorio de tu extensión e instalará la Extensión. Cuando aparezca la ventana del navegador deberías ver el texto "Hello, World!" en la parte derecha del panel con la barra de estado.</p>
-
-<p>Ahora puedes volver y hacer cambios al archivo .xul, cierra y reinicia Firefox, y deberían aparecer.</p>
-
-<h2 id="Empaquetamiento">Empaquetamiento</h2>
-
-<p>Ahora que tu extensión funciona, puedes <a href="/en-US/docs/Extension_Packaging" title="/en-US/docs/Extension_Packaging">empaquetarla</a> para su despliegue e instalación.</p>
-
-<p>Comprime (zip) los <strong>contenidos (contents)</strong> de la carpeta de tu extensión (no la carpeta de extensión misma), y renombra el archivo zip para que tenga la extensión .xpi. En Windows XP, puedes hacer esto fácilmente seleccionando todos los archivos y subcarpetas en la carpeta de tu extensión, haciendo click derecho y seleccionando "Enviar a -&gt; Carpeta comprimida (zip)". Se creará un archivo .zip para ti. Sólo renombralo y ya terminaste!</p>
-
-<p>En Mac OS X, puedes hacer click derecho en los <strong>contenidos (contents)</strong> de la carpeta de la extensión y elegir "Crear archivo de..." para hacer un archivo zip. Sin embargo, ya que Mac OS X agrega archivos ocultos a las carpetas para rastrear los metadatos de los archivos, deberías usar la Terminal, eliminar los archivos ocultos (cuyos nombre comienzan con un punto), y luego usar el comando zip en la linea de comandos para crear el archivo zip.</p>
-
-<p>En Linux, podrías también usar la herramienta zip de linea de comandos.</p>
-
-<p>Si tienes el 'Extension Builder' (Constructor de Extensiones) instalado, puede compliar el archivo .xpi para ti (Tools -&gt; Extension Developer -&gt; Extension Builder). Simplemente navega al directorio donde está tu extensión (install.rdf, etc.), y presiona el botón Build Extension. Esta extensión tiene una gran cantidad de herramientas para facilitar el desarrollo.</p>
-
-<p>Ahora carga el archivo .xpi en tu servidor, asegúrate de que es servido como una <code>application/x-xpinstall</code>. Puedes obtener un enlace al mismo y permitir que las personas lo descarguen e instalen. Con el propósito de simplemente testearnuestro archivo .xpi, podemos sólo arrastrarlo en la ventana de extensiones, en Herramientas -&gt; Extensiones para Firefox 1.5.0.x, o  Herramientas -&gt; Complementos para versiones posteriores.</p>
-
-<h3 id="Instalando_desde_una_página_web">Instalando desde una página web</h3>
-
-<p>Existen muchas formas de instalar extensiones desde páginas web, incluyendo enlace directo hacia archivos XPI y usando el objeto InstallTrigger. Los autores web y de extensiones son alentados a usar el  <a href="/en-US/docs/Installing_Extensions_and_Themes_From_Web_Pages" title="/en-US/docs/Installing_Extensions_and_Themes_From_Web_Pages">método InstallTrigger</a> para instalar XPIs, ya que provee la mejor experiencia a los usuarios.</p>
-
-<h3 id="Usando_addons.mozilla.org">Usando addons.mozilla.org</h3>
-
-<p>Los Complementos para Firefox es un sitio de distribución donde puedes alojar tu extensión gratuitamente. tu extensión será alojada en un espejo (mirror) de la red de Mozilla para garantizar tu descarga a pesar de que pueda ser muy popular. El sitio de Mozilla también provee una sencilla instalación para los usuarios, y automáticamente hará que tus versiones más nuevas estén disponibles cuando las cargues. Además, los Complementos para Firefox permiten a los usuarios comentar y proveer una retroalimentación en tu extensión. Es altamente recomendado que uses los Complementos de Firefox para distribuir tus extensiones!</p>
-
-<p>Visita <a class="linkification-ext external" href="http://addons.mozilla.org/developers/" title="Linkification: http://addons.mozilla.org/developers/">http://addons.mozilla.org/developers/</a> para crearte una cuenta y comenzar a distribuir tus extensiones!</p>
-
-<p><em>Nota:</em> Tu Extensión será enviada más rápidamente y descargada más veces si tienes una buena descripción y algunas capturas de pantalla de la extensión en acción.</p>
-
-<h3 id="Instalando_Extensiones_Usando_una_Instalador_Separado">Instalando Extensiones Usando una Instalador Separado</h3>
-
-<p>Es posible instalar extensiones en un directorio especial y será instalado la próxima vez que la aplicación comience. La extensión estará disponible para cualquier perfil. Mira  <a class="internal" href="/en-US/docs/Installing_extensions" title="/en-US/docs/Installing extensions">lnstalando extensiones</a> para más información.</p>
-
-<p>En Windows, la información sobre extensiones puede ser agregada al registro, y las extensiones serán recogidas automáticamente la proxima vez que la aplicación comience. Esto permite a los instaladores de aplicaciones agregar fácilmente ganchos de integración como extensiones. Mira <a href="/en-US/docs/Adding_Extensions_using_the_Windows_Registry" title="/en-US/docs/Adding_Extensions_using_the_Windows_Registry">Agregando Extensiones usando el Registro de Windows</a> para más información.</p>
-
-<h2 id="Más_sobre_XUL_Overlays">Más sobre XUL Overlays</h2>
-
-<p>Además de agregar widgets de interfaz de usuario al punto de fusión, puedes usar los fragmentos XUL dentro de los Overlays para controlar la posición de los widgets insertados:</p>
-
-<pre class="eval  language-html"><code class="language-html">&lt;toolbarbutton position="1" ...  /&gt;
-
-&lt;toolbarbutton insertbefore="other-id" ...  /&gt;
-
-&lt;toolbarbutton insertafter="other-id" ...  /&gt;</code></pre>
-
-<h2 id="Creando_Nuevos_Componentes_de_Interfaz_de_Usuario">Creando Nuevos Componentes de Interfaz de Usuario</h2>
-
-<p>Puedes crear tus propias ventanas y cuadros de diálogo como archivos .xul separados, brindando funcionalidad a través de la implementación de acciones de usuarios en archivos .js, usando métodos DOM  para manipular widgets de interfaz de usuario. Puedes usar reglas de estilos en archivos .css para enlazar imágenes, establecer colores, etc.</p>
-
-<p>Mira la documentación <a href="/en-US/docs/XUL" title="/en-US/docs/XUL">XUL</a> con más recursos para los desarrolladores XUL.</p>
-
-<h2 id="Archivos_por_Defecto">Archivos por Defecto</h2>
-
-<p>Los archivos por defecto que usas para sembrar un perfil de usuario deberían ser ubicados en <code>defaults/</code> debajo de la raíz de la jerarquía de carpetas de tu extensión. Los archivos .js de preferencias por defecto deberían ser almacenados en <code>defaults/preferences/</code> - si los ubicas aquí serán cargados automáticamente por el sistema de preferencias de Firefox cuando arranque, y así podrás accederlos usando la <a href="/en-US/docs/Preferences_API" title="/en-US/docs/Preferences_API">API de Preferencias</a>.</p>
-
-<p>Un archivo de preferencia por defecto de ejemplo:</p>
-
-<pre class="eval">pref("extensions.sample.username", "Joe"); //a string pref
-pref("extensions.sample.sort", 2); //an int pref
-pref("extensions.sample.showAdvanced", true); //a boolean pref
-</pre>
-
-<h2 id="Componentes_XPCOM">Componentes XPCOM</h2>
-
-<p>Firefox soporta componentes <a href="/en-US/docs/XPCOM" title="/en-US/docs/XPCOM">XPCOM</a> en las extensiones. Puedes crear tus propios componentes fácilmente en JavaScript o en C++ (usando <a href="/en-US/docs/Gecko_SDK" title="/en-US/docs/Gecko_SDK">Gecko SDK</a>).</p>
-
-<p>Ubica todos tus archivos .js o .dll en <code>el directorio components/</code> - son registrados automáticamente la primera vez que se ejecute Firefox luego de que tu extensión es instalada.</p>
-
-<p>Para más información mira <a href="/en-US/docs/How_to_Build_an_XPCOM_Component_in_Javascript" title="/en-US/docs/How_to_Build_an_XPCOM_Component_in_Javascript">Cómo Construir un Componente XPCOM en Javascript</a>, <a href="/en-US/docs/How_to_build_a_binary_XPCOM_component_using_Visual_Studio" title="/en-US/docs/How_to_build_a_binary_XPCOM_component_using_Visual_Studio">Cómo construir un componente XPCOM binario usando Visual Studio,</a> y el libro <a href="/en-US/docs/Creating_XPCOM_Components" title="/en-US/docs/Creating_XPCOM_Components">Creando Componentes XPCOM</a>.</p>
-
-<h3 id="Línea_de_Comandos_de_la_Aplicación">Línea de Comandos de la Aplicación</h3>
-
-<p>Uno de los posibles usos de los componentes XPCOM personalizados, es agregar un manejador de líneas de ocmandos para Firefox o Thunderbird. Puedes usar esta técnica para ejecutar tu extensión como una aplicación:</p>
-
-<pre class="eval"> firefox.exe -myapp
-</pre>
-
-<p><span class="comment">I should move the useful parts of this to the Command Line page. -Nickolay This is done by adding a component containing the function... function NSGetModule(comMgr, fileSpec) { return myAppHandlerModule; } This function is run by firefox each time firefox is started. Firefox registers the myAppHandlerModule's by calling its 'registerSelf()'. Then it obtains the myAppHandlerModule's handler factory via 'getClassObject()'. The handler factory is then used to create the handle using its 'createInstance(). Finally, the handle's 'handle(cmdline)' processes the command line cmdline's handleFlagWithParam() and handleFlag().</span> Mira <a href="/en-US/docs/Chrome/Command_Line" title="/en-US/docs/Chrome/Command_Line">Chrome: Línea de Comandos</a> y un <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=365297">foro de discusión</a> para más detalles.</p>
-
-<h2 id="Localización">Localización</h2>
-
-<p>Para soportar más de un lenguaje, deberías separar los strings (cadenas de caracteres) de tu contenido usando <a href="/en-US/docs/XUL_Tutorial/Localization" title="/en-US/docs/XUL_Tutorial/Localization">entidades</a> y <a href="/en-US/docs/XUL_Tutorial/Property_Files" title="/en-US/docs/XUL_Tutorial/Property_Files">envoltorios de strings</a>. Es mucho más fácil hacer esto mientras estás desarrollando tu extensión, en lugar de volver y hacerlo después!</p>
-
-<p>La información de localización es almacenada en el directorio locale para tu extensión. Por ejemplo, para agregar un locale a tu extensión de ejemplo, crea dos directorios anidados "locale/en-US" en chrome (donde está ubicado el directorio "content") y agrega la siguiente línea al archivo chrome.manifest:</p>
-
-<pre class="eval">locale sample en-US chrome/locale/en-US/
-</pre>
-
-<p>Para crear valores de atributo localizables en XUL, puedes ubicar los valores en un archivo<code> .dtd</code> (sample.dtd para tu extensión de prueba). Este archivo debería ser ubicado en el directorio locale y se parece a esto:</p>
-
-<pre class="eval">&lt;!ENTITY  my-panel.label  "Hello, World"&gt;
-</pre>
-
-<p>Luego incluyélo el comienzo de tu documento XUL (pero debajo de"&lt;?xml version"1.0"?&gt;"), como se ve a continuación:</p>
-
-<pre class="eval  language-html"><code class="language-html"><span class="prolog token">&lt;?xml version="1.0"?&gt;</span>
-<span class="doctype token">&lt;!DOCTYPE window SYSTEM "chrome://packagename/locale/filename.dtd"&gt;</span>
-...</code></pre>
-
-<p>donde <code><strong>window</strong></code> es el valor <code><a href="/en-US/docs/DOM/Node.localName" title="/en-US/docs/DOM/element.localName">localName (nombre local)</a></code> del elemento raíz del documento XUL, y el valor de la propiedad <code>SYSTEM</code> es la URI chrome hacia el archivo de entidad.</p>
-
-<p>Para nuestra extensión de ejemplo, reemplaza <code><strong>window</strong></code> con <code><strong>overlay</strong></code> (elemento raíz), <code><strong>packagename</strong></code> con <code><strong>sample</strong></code>, y <code><strong>filename.dtd</strong></code> con <code><strong>sample.dtd</strong></code>.</p>
-
-<p>Para usar las entidades, modifica tu XUL para que se vea así:</p>
-
-<pre class="eval">&lt;statusbarpanel id="my-panel" label="&amp;my-panel.label;"  /&gt;
-</pre>
-
-<p>El Registro de Chrome se asegurará que el archivo de entidad es cargado desde el envoltorio de localización que se corresponda con la configuración regional seleccionada.</p>
-
-<p>Para los strings que usas en script, crea un archivo .propertie, un archivo de texto que tiene un string en cada lína en este formato:</p>
-
-<pre class="eval">clave=valor
-</pre>
-
-<p>y luego usa {{ interface("nsIStringBundleService") }}/{{ interface("nsIStringBundle") }} o el tag {{ XULElem("stringbundle") }} para cargar valores en el script.</p>
-
-<h2 id="Entendiendo_el_Navegador">Entendiendo el Navegador</h2>
-
-<p>Usa el <a href="/en-US/docs/DOM_Inspector" title="/en-US/docs/DOM_Inspector">Inspector DOM</a> para inspeccionar la ventana del navegador o cualquier otra ventana XUL que quieras extender.</p>
-
-<p><strong>Nota:</strong> <strong>El Inspector DOM </strong>no es parte de la instalación <strong>Estándar</strong> de Firefox. Desde Firefox 3 Beta 4, el Inspector DOM está disponible desde <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622">Los Complementos de Firefox</a> como una extensión por separado. Para versiones anteriores, debes reinstalar con la dirección de instalación Personalizada y seleccionar <strong>Inspector DOM</strong> (o <strong>Developer Tools</strong> en Firefox 1.5) si no hay un ítem "Inspector DOM" en el menú de herramientas de tu navegador.</p>
-
-<p>Usa el botón apunta-y-clickea sobre un nodo en el tope izquierdo de la barra de herramientas del Inspector DOM para clickear sobre un nodo en la ventana XUL, para seleccionar visualmente. Cuando haces esto, el inspector salta en el árbol de jerarquía DOM hacia el nodo que ha sido clickeado.</p>
-
-<p>Usa el panel lateral derecho del Inspector DOM para descubrir puntos de fusión con ids que puedas usar para insertar tus elementos desde overlays. Si no puedes encontrar un elemento con un id que puedas fusionar, podrías necesitar enlazar un script en tu overlay e insertar tus elementos cuando se dispare el evento <code>load</code> en la ventana XUL maestra.</p>
-
-<h2 id="Depurando_Extensiones">Depurando Extensiones</h2>
-
-<p><strong>Herramientas Analíticas para Depuración</strong></p>
-
-<ul>
- <li>El <a href="/en-US/docs/DOM_Inspector" title="/en-US/docs/DOM_Inspector">inspector DOM</a> - inspecciona atributos, estructura DOM, reglas de estilo CSS que están activas (ej., averigua porqué tus reglas de estilo no parecen estar funcionando para un elemento - una herramienta invaluable!)</li>
- <li><a href="/en-US/docs/Venkman" title="/en-US/docs/Venkman">Venkman</a> - configura puntos de quiebre (breakpoints) en JavaScript e inspecciona pilas de llamadas.</li>
- <li><code>Components.stack.caller&gt;</code> en JavaScript - accede a la pila de llamada de una función</li>
-</ul>
-
-<p><strong>Depuración con printf </strong></p>
-
-<ul>
- <li>Usa <code><a href="/en-US/docs/DOM/window.dump" title="/en-US/docs/DOM/window.dump">dump</a>("string")</code> (mira el enlace para más detalles; esto requiere alguna configuración para trabajar correctamente)</li>
- <li>Usa <code><a href="/en-US/docs/Components.utils.reportError" title="/en-US/docs/Components.utils.reportError">Components.utils.reportError()</a></code> o {{ interface("nsIConsoleService") }} para hacer log en la consola de JavaScript</li>
-</ul>
-
-<p><strong>Depuración avanzada</strong></p>
-
-<ul>
- <li>Ejectua un build de Firefox para depuración y configura puntos de quiebre en Firefox mismo, o tus componentes en C++. Para el desarollador experimentado, esta es frecuentemente la forma más rápida de diagnosticar un problema. Mira <a href="/en-US/docs/Developer_Guide/Build_Instructions" title="/en-US/docs/Build_Documentation">Build Documentation</a> y <a href="/en-US/docs/Developer_Guide" title="/en-US/docs/Developing_Mozilla">Developing Mozilla</a> para más información.</li>
- <li>Mira <a href="/en-US/docs/Debugging_a_XULRunner_Application" title="/en-US/docs/Debugging_a_XULRunner_Application">Depurando una Aplicación XULRunner</a> para más consejos útiles.</li>
-</ul>
-
-<h2 id="Más_Información">Más Información</h2>
-
-<ul>
- <li><a href="/en-US/docs/Extension_Frequently_Asked_Questions" title="/en-US/docs/Extension_Frequently_Asked_Questions">FAQ (Preguntas Frecuentes) sobre Extensiones</a></li>
- <li><a href="/en-US/docs/Extensions" title="/en-US/docs/Extensions">Extensiones</a></li>
-</ul>
diff --git a/files/es/cadenas_del_user_agent_de_gecko/index.html b/files/es/cadenas_del_user_agent_de_gecko/index.html
deleted file mode 100644
index 4dbd1908cf..0000000000
--- a/files/es/cadenas_del_user_agent_de_gecko/index.html
+++ /dev/null
@@ -1,55 +0,0 @@
----
-title: Cadenas del User Agent de Gecko
-slug: Cadenas_del_User_Agent_de_Gecko
-tags:
-  - Desarrollo_Web
-  - Todas_las_Categorías
-translation_of: Web/HTTP/Headers/User-Agent/Firefox
----
-<h3 id="Uso_Apropiado" name="Uso_Apropiado">Uso Apropiado</h3>
-<p>No se recomienda el uso de las cadenas del User Agent como su principal opción para la detección del navegador. Vea <a href="es/Deteccion_Cross_browser_y_Soporte_Cross_Browser"> Deteccion Cross browser y Soporte Cross Browser</a> para una ojeada mas en profundo a varias técnicas sobre detección de navegadores con recomendaciones.</p>
-<p>En particular, recomendamos usar la detección de la cadena del User Agent para detección del navegador del lado del servidor. Si su actual código del lado cliente usa detección de la cadena del User Agent, simplemente puede hacer una búsqueda por la cadena "Gecko" en el User Agent para detectar cualquier navegador basado en Gecko.</p>
-<p>Para todos los detalles que lidian con detecciones con Gecko los cuales lidian con bugs especificos o los cuales requieran conocimiento de strings especificos o fechas de la compilación, use el objeto <a href="es/DOM_Client_Object_Cross-Reference/navigator">navigator</a>.</p>
-<h3 id="Lista_de_user_agents_liberados_por_Netscape_y_AOL_basados_en_Gecko" name="Lista_de_user_agents_liberados_por_Netscape_y_AOL_basados_en_Gecko">Lista de user agents liberados por Netscape y AOL basados en Gecko</h3>
-<p>Vea <a class="external" href="http://www.mozilla.org/build/revised-user-agent-strings.html">mozilla.org's user-agent strings reference</a> para Plataforma específico,
- <i>
-  Seguridad</i>
- ,
- <i>
-  Sistema Operativo</i>
- o
- <i>
-  CPU</i>
- y valores de
- <i>
-  localización</i>
- .</p>
-<ul>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.4) Gecko/20030624 Netscape/7.1 (ax)&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0.2) Gecko/20030208 Netscape/7.02&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0.2) Gecko/20021120 Netscape/7.01&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0.1) Gecko/20020823 Netscape/7.0&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Macintosh; U; PPC Mac OS X; en-US; rv:1.0.1) Gecko/20020730 AOL/7.0&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0rc2) Gecko/20020512 Netscape/7.0b1&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4.2) Gecko/20020220 CS 2000 7.0/7.0&lt;/tt&gt;
-  <ul>
-   <li>&lt;tt&gt;Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.4.2) Gecko/20020502 CS 2000 7.0/7.0&lt;/tt&gt;</li>
-  </ul>
- </li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4.1) Gecko/20020508 Netscape6/6.2.3&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4.1) Gecko/20020314 Netscape6/6.2.2&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4) Gecko/20011128 Netscape6/6.2.1&lt;/tt&gt;</li>
- <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.2) Gecko/20010726 Netscape6/6.1&lt;/tt&gt;</li>
-</ul>
-<p><br>
- Para una información más detallada sobre liberaciones de Netscape y Mozilla, por favor vea el <a class="external" href="http://www.mozilla.org/releases/cvstags.html">mozilla.org cvstags reference</a>.</p>
-<p> </p>
-<div class="originaldocinfo">
- <h3 id="Informacion_Del_documento_Original" name="Informacion_Del_documento_Original">Informacion Del documento Original</h3>
- <ul>
-  <li>Autor: Bob Clary</li>
-  <li>Última Actualización: Junio 30, 2003</li>
-  <li>Copyright © 2001-2003 Netscape. Todos los derechos reservados.</li>
- </ul>
-</div>
-<p> </p>
diff --git a/files/es/code_snippets/index.html b/files/es/code_snippets/index.html
deleted file mode 100644
index 24233e92ba..0000000000
--- a/files/es/code_snippets/index.html
+++ /dev/null
@@ -1,5 +0,0 @@
----
-title: Code snippets
-slug: Code_snippets
----
-This page was auto-generated because a user created a sub-page to this page.
diff --git a/files/es/code_snippets/pestañas_del_navegador/index.html b/files/es/code_snippets/pestañas_del_navegador/index.html
deleted file mode 100644
index 12e2f8c676..0000000000
--- a/files/es/code_snippets/pestañas_del_navegador/index.html
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Pestañas del navegador
-slug: Code_snippets/Pestañas_del_navegador
-tags:
-  - Add-ons
-  - extensiones
-  - fragmentos de código
-  - pestañas
----
-<p>Aquí encontrará un conjunto de fragmentos de código útiles que lo ayudarán a trabajar con las pestañas del navegador Firefox. Los comentarios generalmente indican dónde debe insertar su propio código.</p>
-<p>Cada fragmento normalmente incluye algún código para ejecutarse al inicio, esto se implementa mejor usando un <a href="/en/Extension_Frequently_Asked_Questions#Why_doesn.27t_my_script_run_properly.3F" title="en/Extension_Frequently_Asked_Questions#Why_doesn.27t_my_script_run_properly.3F">"listener" al cargar la página</a>. Estos fragmentos asumen que son ejecutados en un contexto de una ventana de navegador. Si quiere trabajar con pestañas de una ventana que no es un navegador, necesita tener referencia a una primero, mire <a href="/en/Working_with_windows_in_chrome_code" title="en/Working_with_windows_in_chrome_code">Trabajando con ventanas en código chrome</a> para más detalles.</p>
-<h3 id="Getting_access_to_the_browser">Múltiples significados para la palabra "browser"</h3>
-<p>La palabra 'browser' es usada de varias maneras. Of course the entire application Firefox is called "a browser". Within the Firefox browser are tabs and inside each tab is a browser, both in the common sense of a web page browser and the XUL sense of a {{ XULElem("browser") }} element. Furthermore another meaning of 'browser' in this document and in some Firefox source is "the tabbrowser element" in a Firefox XUL window.</p>
diff --git a/files/es/columnas_con_css-3/index.html b/files/es/columnas_con_css-3/index.html
deleted file mode 100644
index 8eed415ee2..0000000000
--- a/files/es/columnas_con_css-3/index.html
+++ /dev/null
@@ -1,68 +0,0 @@
----
-title: Columnas con CSS-3
-slug: Columnas_con_CSS-3
-tags:
-  - CSS
-  - Todas_las_Categorías
-translation_of: Web/CSS/CSS_Columns/Using_multi-column_layouts
----
-<p>
-</p>
-<h3 id="Introducci.C3.B3n" name="Introducci.C3.B3n"> Introducción </h3>
-<p>Cuando leemos un texto, las líneas muy largas resultan incómodas. Si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas (al ir de un extremo al otro de la página). Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos. Por desgracia esto no es posible con HTML y CSS-2, a no ser que fuerces la ruptura de las columnas en puntos fijos, limites en gran medida el código a utilizar, o uses scripts complejos.
-</p><p><a class="external" href="http://www.w3.org/TR/css3-multicol/">El borrador de CSS-3</a> propone algunas nuevas propiedades para dar respuesta a esta necesidad. En Firefox 1.5 y superior hemos implementado algunas de estas propiedades para comportarnos según lo descrito en el borrador de CSS-3 (con una excepción explicada abajo) </p><p><a class="external" href="http://weblogs.mozillazine.org/roc/">El blog de Robert O'Callahan </a>  usa columnas CSS, pruébalo con Firefox 1.5
-</p>
-<h3 id="Usar_Columnas" name="Usar_Columnas"> Usar Columnas </h3>
-<h4 id="Columnas.2C_Count_y_Width" name="Columnas.2C_Count_y_Width"> Columnas, Count y Width </h4>
-<p>Dos propiedades CSS Controlan el número (Count) y el ancho (Width) de las columnas: <code>-moz-column-count</code> y <code>-moz-column-width</code>.
-</p><p><code>-moz-column-count</code> indica el número concreto de columnas a crear. Por ejemplo:
-</p>
-<pre>&lt;div style="-moz-column-count:2; -moz-column-gap: 1em;"&gt;
-Cuando leemos un texto las líneas muy largas resultan incómodas, si son
-demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista
-de la línea en la que estabas. Por ello, pensando en los usuarios con
-monitores grandes, los autores deben limitar la anchura del texto dividiéndolo
-en columnas, más o menos, como hacen los periódicos.&lt;/div&gt;
-</pre>
-<p>Mostrará el contenido en dos columnas (si usas Firefox 1.5 o superior):
-</p>
-<div style="border: 1px solid silver; padding: 1em;">Cuando leemos un texto las líneas muy largas resultan incómodas, si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas. Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos.</div>
-<p><code>-moz-column-width</code> fija la anchura mínima de las columnas. Si no se indica un <code>-moz-column-count</code>, entonces el navegador creará automáticamente tantas columnas (con la anchura indicada) como sea posible en el espacio disponible. </p>
-<pre>&lt;div style="-moz-column-width:20em; -moz-column-gap: 1em;"&gt;
-Cuando leemos un texto las líneas muy largas resultan incómodas, si son
-demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista
-de la línea en la que estabas. Por ello, pensando en los usuarios con
-monitores grandes, los autores deben limitar la anchura del texto dividiéndolo
-en columnas, más o menos, como hacen los periódicos.&lt;/div&gt;
-</pre>
-<p>Se visualizará así:
-</p>
-<div style="-moz-column-width: 20em; border: 1px solid silver; padding: 1em;">Cuando leemos un texto las líneas muy largas resultan incómodas, si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas. Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos.</div>
-<p>Los detalles exactos son descritos en <a class="external" href="http://www.w3.org/TR/css3-multicol/">El borrador de CSS3</a>.
-</p><p>En un bloque multicolumna, el contenido fluye automáticamente de una columna a otra según sea necesario. Todas las funcionalidades de HTML, CSS, y DOM están soportadas dentro de las columnas, tanto al editar como al imprimir.
-</p>
-<h4 id="Equilibrado_de_altura" name="Equilibrado_de_altura"> Equilibrado de altura </h4>
-<p>El borrador de CSS3 especifica que la altura de las columnas debe estar equilibrada, es decir, el navegador debe definir automáticamente la altura máxima de las columnas de modo que la altura del contenido en cada columna sea más o menos igual. Firefox lo hace. </p><p>Sin embargo, en algunas situaciones puede ser útil fijar explícitamente la altura máxima de las columnas, y entonces se empiezan a meter los contenidos en la primera columna y se van creando tantas columnas como sea necesario, posiblemente desbordando por la derecha. Por ejemplo, en <a class=" external" href="http://iht.com/" rel="freelink">http://iht.com/</a> los artículos hacen esto (usando scripts). Por lo tanto extendemos el borrador de modo que si se indica la propiedad CSS <code>height</code> en un bloque multicolumnas, se permite que cada columna tenga esa altura -y no más- antes de agregar la siguiente columna. Esto permite una composición mucho más eficiente. </p>
-<h4 id="Espacio_entre_Columnas" name="Espacio_entre_Columnas"> Espacio entre Columnas </h4>
-<p>Por defecto, cada columna está tocando la columna de al lado. Normalmente esto no es lo más apropiado. Se puede utilizar el <code>padding</code> de las columnas para corregirlo, pero normalmente lo más fácil será aplicar la propiedad <code>-moz-column-gap</code> al bloque con multicolumna: </p>
-<pre>&lt;div style="-moz-column-width:20em; -moz-column-gap:2em;"&gt;
-Cuando leemos un texto las líneas muy largas resultan incómodas, si son
-demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista
-de la línea en la que estabas. Por ello, pensando en los usuarios con
-monitores grandes, los autores deben limitar la anchura del texto dividiéndolo
-en columnas, más o menos, como hacen los periódicos.&lt;/div&gt;
-</pre>
-<p>Se visualizará así:
-</p>
-<div style="-moz-column-width: 20em; border: 1px solid silver; padding: 1em;">Cuando leemos un texto las líneas muy largas resultan incómodas, si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas. Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos.</div>
-<h4 id="Degradado_elegante" name="Degradado_elegante"> Degradado elegante </h4>
-<p>La propiedad <code>-moz-column</code> será ignorada por los navegadores que no la soporten, por lo tanto, es relativamente fácil crear un diseño que en esos navegadores muestre una sola columna, y al mismo tiempo utilice multi-columnas en Firefox 1.5.
-</p>
-<h3 id="Conclusi.C3.B3n" name="Conclusi.C3.B3n"> Conclusión </h3>
-<p>Las columnas CSS3 son un nuevo método básico de disposición que ayudará a los desarrolladores Web a aprovechar mejor las condiciones reales de la pantalla. Los desarrolladores imaginativos podrán encontrarle muchas aplicaciones, especialmente a la característica de equilibrado automático y dinámico de la altura. </p>
-<h3 id="Referencias_adicionales" name="Referencias_adicionales"> Referencias adicionales </h3>
-<ul><li> <a class=" external" href="http://weblogs.mozillazine.org/roc/archives/2005/03/gecko_18_for_we.html" rel="freelink">http://weblogs.mozillazine.org/roc/a...18_for_we.html</a>
-</li></ul>
-<p><span class="comment">Categorías</span>
-</p><p><span class="comment">interwiki links</span>
-</p>{{ languages( { "en": "en/CSS3_Columns", "fr": "fr/Colonnes_CSS3", "it": "it/Le_Colonne_nei_CSS3", "ja": "ja/CSS3_Columns", "ko": "ko/CSS3_Columns", "pl": "pl/Kolumny_CSS3" } ) }}
diff --git a/files/es/compilar_e_instalar/index.html b/files/es/compilar_e_instalar/index.html
deleted file mode 100644
index 8322104d8e..0000000000
--- a/files/es/compilar_e_instalar/index.html
+++ /dev/null
@@ -1,73 +0,0 @@
----
-title: Compilar e instalar
-slug: Compilar_e_instalar
-tags:
-  - Documentación_de_compilado
-translation_of: Mozilla/Developer_guide/Build_Instructions
-translation_of_original: Build_and_Install
----
-<p><span class="comment">NOTE: Do not make substantive changes to this document without consulting Benjamin Smedberg &lt;<a class="link-mailto" href="mailto:benjamin@smedbergs.us" rel="freelink">benjamin@smedbergs.us</a>&gt; or one of the build-config peers.</span></p>
-<div class="note">
- <strong>NOTA</strong>: No comience a compilar sin antes <a href="/es/Configurar_las_opciones_de_compilaci%C3%B3n" title="es/Configurar_las_opciones_de_compilación">configurar las opciones de compilación</a>!</div>
-<h3 id="Compilando" name="Compilando">Compilando</h3>
-<p>Debes usar GNU make para verificar y compilar Mozilla, no se acepta otro programa "make". En Windows, Mac OS X, y GNU/Linux usa "make" para ejecutar GNU make; en la mayoría de los unix-no GNU debes usar "gmake".</p>
-<p>Una vez que verificaste el código, asegúrate de configurar la aplicación como se describe en las opciones de configuración.</p>
-<p>Para Windows, Mac OS X, y GNU/Linux, asegúrate de estar en el nivel superior del directorio fuente ("mozilla") cuando llames el comando <code>make</code>:</p>
-<pre class="eval">$ make -f client.mk build
-</pre>
-<p>Para la mayoría de los unix no-GNU:</p>
-<pre class="eval">$ gmake -f client.mk build
-</pre>
-<p>Si quieres configurar y compilar de forma manual, cd a tu objdir, ejecuta el programa de configuración, y luego ejecuta make/gmake. El programa de configuración tomará las opciones de tu archivo .mozconfig.</p>
-<h3 id="Ejecutando_tu_compilaci.C3.B3n_nueva" name="Ejecutando_tu_compilaci.C3.B3n_nueva">Ejecutando tu compilación nueva</h3>
-<p>Es posible ejecutar la compilación nueva directamente desde el directorio en donde fue creada. De todas formas, el directorio de compilación tal vez contenga symlinks dentro del árbol; debes ejecutar la instalación/packaging para generar una compilación que puede ser movida o compartida.</p>
-<h4 id="Windows_y_Linux" name="Windows_y_Linux">Windows y Linux</h4>
-<p>En sistemas no-macintosh, el producto final se puede hallar en <em>objdir</em>/dist/bin. En plataformas POSIX (BDS, GNU/LINUX, Solaris), debes ejecutar el archivo "mozilla" o "firefox", no el binario "mozilla-bin" o "firefox-bin".</p>
-<h4 id="Mac_OS_X" name="Mac_OS_X">Mac OS X</h4>
-<p>En Macintosh, el sistema de compilado genera una aplicación en <em>objdir</em>/dist/<em>AppName</em>.app por ejemplo, <em>objdir</em>/dist/Minefield.app.</p>
-<p>Fijate que cuando compilas con <code>--enable-debug</code>, la aplicación se ubica en <em>objdir</em>/dist/<em>AppName</em>Debug.app, por ejemplo <em>objdir</em>/dist/MinefieldDebug.app.</p>
-<p>Puedes ejecutar la aplicación, ya sea abriendo la aplicación via Finder o con la línea de comando:</p>
-<pre class="eval">$ objdir/dist/AppName[Debug].app/Contents/MacOS/appname
-</pre>
-<p>Para el ejemplo:</p>
-<pre class="eval">$ objdir/dist/MinefieldDebug.app/Contents/MacOS/firefox
-</pre>
-<h3 id="Instalando_tu_compilaci.C3.B3n" name="Instalando_tu_compilaci.C3.B3n">Instalando tu compilación</h3>
-<p>En plataformas POSIX, puedes instalar ejecutando <em>gmake install</em>. Pero es mejor que sigas los pasos siguientes para crear un tar, luego descomprime el tar.</p>
-<p>Para la mayoria de las aplicaciones, crea el tar dentro del directorio específico de la aplicación:</p>
-<ul>
- <li>Firefox: <code>$ make -C objdir/browser/installer</code></li>
- <li>Thunderbird: <code>$ make -C objdir/mail/installer</code></li>
- <li>SeaMonkey: <code>$ make -C objdir/xpinstall/packager</code></li>
-</ul>
-<p><em>Ejemplo real:</em> Si usas un .mozconfig <a href="/es/Configurar_las_opciones_de_compilaci%C3%B3n#Firefox_est.C3.A1tico_optimizado" title="es/Configurar_las_opciones_de_compilación#Firefox_est.C3.A1tico_optimizado"> Firefox estático optimizado</a></p>
-<ul>
- <li>Firefox: <code>$ make -C ff-opt-static/browser/installer</code></li>
-</ul>
-<p>Esto generará un archivo <code>firefox-2.0.0.3.en-US.linux-i686.tar.gz</code> dentro del directorio <code>ff-opt-static/dist</code>, el cual puedes descomprimir donde desees.</p>
-<p>Para hacer un instalador para Windows, crea el destino del instalador en el directorio superior</p>
-<ul>
- <li>Firefox: <code>$ make -C objdir/browser/installer installer</code></li>
- <li>Thunderbird: <code>$ make -C objdir/mail/installer installer</code></li>
- <li>SeaMonkey: <code>$ make -C objdir/xpinstall/packager installer</code></li>
-</ul>
-<p><em>NOTA:</em> Para crear el instalador lo más comprimido posible, para Firefox y Thunderbird con el sistema basado en Cygwin, debes instalar algunos programas adicionales.</p>
-<ul>
- <li><a class="external" href="http://www.7-zip.org/">7-zip</a></li>
- <li><a class="external" href="http://upx.sourceforge.net/">UPX</a> (para usuarios de Windows el paquete está disponible en <a class="external" href="http://cygwin.com/">Cygwin</a> (Categoría utilitarios). No usen la versión DOS, no funcionará)</li>
-</ul>
-<p>Ambos programas se deben encontrar en el PATH. También MOZ_INSTALLER_USE_7ZIP debe ser exportado a tu entorno. Si usas el sistema MozillaBuild, ambos se instalarán automaticamente.</p>
-<p> </p>
-<div class="originaldocinfo">
- <h2 id="Informaci.C3.B3n_del_documento" name="Informaci.C3.B3n_del_documento">Información del documento</h2>
- <ul>
-  <li>Traductor: <a class="external" href="http://developer.mozilla.org/es/docs/Usuario_Discusi%C3%B3n:Blank_zero">Blank zero</a></li>
-  <li>Ultima modificación: 10-may-2007</li>
-  <li>Fuente: <a class="external" href="http://developer.mozilla.org/en/docs/index.php?title=Build_and_Install">Build and Install</a></li>
- </ul>
- <h3 id="Informaci.C3.B3n_sobre_el_documento_original" name="Informaci.C3.B3n_sobre_el_documento_original">Información sobre el documento original</h3>
- <ul>
-  <li>Autor: Benjamin Smedberg</li>
- </ul>
-</div>
-<p>{{ languages( { "en": "en/Build_and_Install", "fr": "fr/Compilation_et_installation", "ja": "ja/Build_and_Install", "zh-cn": "cn/\u7f16\u8bd1\u4e0e\u5b89\u88c5" } ) }}</p>
diff --git a/files/es/configurar_correctamente_los_tipos_mime_del_servidor/index.html b/files/es/configurar_correctamente_los_tipos_mime_del_servidor/index.html
deleted file mode 100644
index 782c328151..0000000000
--- a/files/es/configurar_correctamente_los_tipos_mime_del_servidor/index.html
+++ /dev/null
@@ -1,81 +0,0 @@
----
-title: Configurar correctamente los tipos MIME del servidor
-slug: Configurar_correctamente_los_tipos_MIME_del_servidor
-tags:
-  - Desarrollo_Web
-  - Estándares_Web
-  - Seguridad
-  - Todas_las_Categorías
-translation_of: Learn/Server-side/Configuring_server_MIME_types
----
-<p>
-</p>
-<h3 id="Introduccion" name="Introduccion"> Introduccion </h3>
-<p>Por omisión, muchos servidores web estan configurados para reportar un tipo MIME de <code>texto/plano</code> ó <code>aplicacion/de fuente de octeto</code> para tipos de contenidos desconocidos. A medida son desarrollados nuevos tipos de contenidos, los administradores de red pueden equivocarse al añadirlos a la configuración del servidor web, y esta es la principal causa de problemas para usuarios de navegadores basados en Gecko, el cual respeta los tipos MIME tal y como son reportados por los servidores y las aplicaciones web.
-</p>
-<h3 id=".C2.BFQue_son_los_tipos_de_MIME.3F" name=".C2.BFQue_son_los_tipos_de_MIME.3F"> ¿Que son los tipos de MIME? </h3>
-<p>Los tipos de <abbr>MIME</abbr> describen el tipo de medio del contenido, sea del correo electrónico o el utilizado en los servidores o aplicaciones web, y tiene como proposito ayudar a guiar al navegador web acerca de como ha de ser procesado y mostrado el contenido. Ejemplos de tipos de MIME son:
-</p>
-<ul><li> <code>texto/html</code> para páginas web normales
-</li><li> <code>texto/plano</code> para texto común
-</li><li> <code>Aplicacion/de fuente octeto</code> que significa "descarga este archivo"
-</li><li> <code>Aplicacion/x-java-applet</code> para uso de applets de Java
-</li><li> <code>Aplicacion/pdf</code> para documentos de Adobe<sup>®</sup> PDF.
-</li></ul>
-<h3 id="Informaci.C3.B3n_T.C3.A9cnica" name="Informaci.C3.B3n_T.C3.A9cnica"> Información Técnica </h3>
-<p>MIME está actualmente definida en RFCs <a class="external" href="http://www.isi.edu/in-notes/rfc2045.txt">2045</a>, <a class="external" href="http://www.isi.edu/in-notes/rfc2046.txt">2046</a>, <a class="external" href="http://www.isi.edu/in-notes/rfc2047.txt">2047</a>, <a class="external" href="http://www.isi.edu/in-notes/rfc2048.txt">2048</a>, y <a class="external" href="http://www.isi.edu/in-notes/rfc2049.txt">2049</a> y los valores registrados para los tipos MIME estan disponibles en <a class="external" href="http://www.iana.org/assignments/media-types/index.html">IANA | MIME Media Types</a>. La <a class="external" href="http://www.w3.org/Protocols/HTTP/1.1/spec.html">HTTP specification</a> define un superconjunto de MIME el cual es utilizado para describir los tipos de medios usados en la red.
-</p>
-<h3 id=".C2.BFPor_qu.C3.A9_son_importantes_los_tipos_correctos_de_MIME.3F" name=".C2.BFPor_qu.C3.A9_son_importantes_los_tipos_correctos_de_MIME.3F"> ¿Por qué son importantes los tipos correctos de MIME? </h3>
-<p><img align="right" alt="Example of an incorrect MIME type result">
-Si el servidor de red o la aplicación informan un tipo incorrecto de MIME para el contenido, un navegador de red no tiene forma de saberlo, <i>de acuerdo a la especificación HTTP</i>, más si tenemos en cuenta que el autor especificó el contenido para ser procesado y mostrado en una forma diferente que la impuesta por el tipo MIME informado.
-</p><p>Otros navegadores de red, tal como el Microsoft<sup>®</sup> Internet Explorer, intentan determinar el tipo adecuado de MIME en servidores mal configurados, <i><a class="external" href="http://support.microsoft.com/default.aspx?sd=msdn&amp;scid=kb;en-us;293336">suponiendo</a></i> el tipo adecuado de MIME que debería ser. Esto protege a muchos administradores de red de sus propios errores, pues el Internet Explorer continúa procesando el contenido aunque, por ejemplo, una imagen haya sido informada como texto plano.
-</p>
-<h3 id=".C2.BFPor_qu.C3.A9_los_navegadores_no_deber.C3.ADan_suponer_tipos_MIME.3F" name=".C2.BFPor_qu.C3.A9_los_navegadores_no_deber.C3.ADan_suponer_tipos_MIME.3F"> ¿Por qué los navegadores no deberían suponer tipos MIME? </h3>
-<p>A parte de la violación de la especificación HTTP, es una mala estrategia para los navegadores suponer tipos MIME por las siguientes razones:
-</p>
-<h4 id="P.C3.A9rdida_del_control" name="P.C3.A9rdida_del_control"> Pérdida del control </h4>
-<p>Si el navegador ignora el tipo MIME reportado, los administradores de red y los autores dejarán de tener el control sobre cómo sus contenidos serán procesados.
-</p><p>Por ejemplo, un sitio de red orientado para desarrolladores de red puede enviar determinados ejemplos de documentos HTML como enteros <code>text/html</code> ó como <code>text/plain</code> para lograr documentos con enteros procesados y motrados como HTML ó como código fuente. Si el navegador supone el tipo MIME, esta posibilidad dejará de estar disponible para el autor.
-</p>
-<h4 id="Seguridad" name="Seguridad"> Seguridad </h4>
-<p>Algunos tipos de contenidos, tales como programas ejecutables, son inherentemente inseguros. Por este motivo, esos tipos MIME son generalmente restringidos en términos de qué acciones tomará el navegador de red al recibirlos. Por ejemplo, un programa ejecutable no debería ser ejecutado en la computadora de un usuario, y en su lugar debería aparecer un cuadro de diálogo <b>para preguntar al usuario</b> si desea descargar el archivo.
-</p><p>La suposición de tipos MIME ha llevado a fallas de seguridad en Internet Explorer, debido a autores maliciosos que reportaban el tipo MIME de un archivo peligroso como si fuera uno seguro, evitando así el cuadro de diálogo de descarga normal. El Internet Explorer suponía entonces que se trataba de un programa ejecutable y los corría en la computadora del usuario.
-</p>
-<h3 id="C.C3.B3mo_determinar_el_tipo_MIME_enviado_a_un_servidor" name="C.C3.B3mo_determinar_el_tipo_MIME_enviado_a_un_servidor"> Cómo determinar el tipo MIME enviado a un servidor </h3>
-<p>En Firefox, cargar el archivo y usar Herramientas | Información de página. Puede también usar <a class="external" href="http://www.rexswain.com/httpview.html">Rex Swain's HTTP Viewer</a> ó <a class="external" href="http://livehttpheaders.mozdev.org/">Live HTTP Headers</a> para ver los encabezados completos y contenido de cualquier archivo enviado desde un servidor de red.
-</p><p>De acuerdo a los estándares, una <code>meta</code> etiqueta que brinda el tipo MIME tal como <code><span class="nowiki">&lt;meta http-equiv="Content-Type" content="text/html"&gt;</span></code> debería ser ignorado si hay una <code>Content-Type</code> línea en el encabezado. En vez de buscar esta línea en la fuente HTML, use las técnicas anteriores para determinar el tipo MIME enviado por un servidor.
-</p>
-<h3 id="C.C3.B3mo_determinar_el_tipo_correcto_de_MIME_para_su_contenido" name="C.C3.B3mo_determinar_el_tipo_correcto_de_MIME_para_su_contenido"> Cómo determinar el tipo correcto de MIME para su contenido </h3>
-<p>Hay ciertos pasos los cuales pueden llevar a derminar el correcto tipo de valor MIME a ser usado para su contenido.
-</p>
-<ol><li> Si su contenido fue creado usando la aplicación de software del vendedor, lea la documentación del vendedor para ver qué tipos MIME debería n ser informados para los diferentes tipos de medios.
-</li><li> Mire en el <a class="external" href="http://www.iana.org/assignments/media-types/index.html">IANA | Registro de Tipos de medios MIME</a> que contiene todos los tipos MIME registrados.
-</li><li> Si el tipo de medio es mostrado usando un plug-in en Netscape Gecko, instale el plug-in y luego mire en Ayuda-&gt;Acerca en le Menú Plug-in para ver qué tipos MIME están asociados con el tipo de medio.
-</li><li> Buscar la extensión del archivo en <a class="external" href="http://filext.com/">FILExt</a> para ver qué tipos MIME están asociados con esa expresión.
-</li></ol>
-<h3 id="C.C3.B3mo_configurar_su_servidor_para_enviar_los_tipos_MIME_correctos" name="C.C3.B3mo_configurar_su_servidor_para_enviar_los_tipos_MIME_correctos"> Cómo configurar su servidor para enviar los tipos MIME correctos </h3>
-<ul><li> Si está usando un servidor de red Apache, simplemente copie esto <a href="es/Sample_.htaccess_file">sample .htaccess file</a> en el directorio que contiene los archivos que quiere enviar con los tipos correctos MIME. Si tiene un subdirectorio entero de archivos, sólo ubique el archivo en el directorio principal; No necesita ubicarlo en cada subdirectorio.
-</li><li> Si usa Microsoft IIS, vea <a class="external" href="http://www.microsoft.com/technet/prodtechnol/windows2000serv/technologies/iis/maintain/featusability/mimeiis.mspx">este artículo</a> en Microsoft TechNet.
-</li><li> Si utiliza un servidor script para generar contenido, puede generalmente agregar una línea cerca del principio de su script. Puede servir contenido otro que HTML desde Perl, PHP, ASP, ó Java — sólo cambie el tipo MIME adecuado.
-<ul><li> Para Perl CGI, debería tener la línea <code>print "Content-Type: text/html\n\n";</code> antes que cualquier otras líneas de salida. Si utiliza el módulo CGI, puede utilizar la línea <code>print $cgi-&gt;header('text/html');</code> en lugar de, donde <code>$cgi</code> es su referencia para la instancia CGI.
-</li><li> Para PHP, debería tener la línea <code>header('Content-Type: text/html');</code> antes que cualquier otras líneas de salida.
-</li><li> Para ASP, debería tener la línea <code>response.ContentType = "text/html";</code> antes que cualquier otras líneas de salida.
-</li><li> Para un servlet Java, debería tener la línea <code>response.setContentType("text/html");</code> al principio de su <code>doGet</code> ó <code>doPost</code> método, donde <code>response</code> es una referencia a <code>HttpServletResponse</code>.
-</li></ul>
-</li></ul>
-<h3 id="Enlaces_Relacionados" name="Enlaces_Relacionados"> Enlaces Relacionados </h3>
-<ul><li><a href="es/Tipo_MIME_incorrecto_en_archivos_CSS">Tipo MIME incorrecto en archivos CSS</a>
-</li><li><a class="external" href="http://www.iana.org/assignments/media-types/index.html">IANA | MIME Media Types</a>
-</li><li><a class="external" href="http://www.w3.org/Protocols/HTTP/1.1/spec.html">Hypertext Transfer Protocol — HTTP/1.0</a>
-</li><li><a class="external" href="http://support.microsoft.com/default.aspx?sd=msdn&amp;scid=kb;en-us;293336">Microsoft - 293336 - INFO: WebCast: MIME Type Handling in Microsoft Internet Explorer</a>
-</li><li><a class="external" href="http://msdn.microsoft.com/workshop/networking/moniker/overview/appendix_a.asp">Microsoft - Appendix A: MIME Type Detection in Internet Explorer</a>
-</li><li><a class="external" href="http://www.microsoft.com/windows/ie/downloads/critical/q290108/">Microsoft - Security Update, March 29, 2001</a>
-</li><li><a class="external" href="http://www.microsoft.com/windows/ie/downloads/critical/Q313675/">Microsoft - Security Update, December 13, 2001</a>
-</li></ul>
-<div class="originaldocinfo">
-<h3 id="Informaci.C3.B3n_del_Documento_Original" name="Informaci.C3.B3n_del_Documento_Original"> Información del Documento Original </h3>
-<ul><li> Autor: Bob Clary
-</li><li> Fecha de la última modificación: 20 Feb 2003
-</li></ul>
-</div>
-{{ languages( { "en": "en/Properly_Configuring_Server_MIME_Types" } ) }}
diff --git a/files/es/conflicting/glossary/doctype/index.html b/files/es/conflicting/glossary/doctype/index.html
new file mode 100644
index 0000000000..f0f6e18715
--- /dev/null
+++ b/files/es/conflicting/glossary/doctype/index.html
@@ -0,0 +1,8 @@
+---
+title: DTD
+slug: conflicting/Glossary/Doctype
+translation_of: Glossary/Doctype
+translation_of_original: Glossary/DTD
+original_slug: Glossary/DTD
+---
+<p>{{page("/en-US/docs/Glossary/Doctype")}}</p>
diff --git a/files/es/conflicting/learn/css/building_blocks/cascade_and_inheritance/index.html b/files/es/conflicting/learn/css/building_blocks/cascade_and_inheritance/index.html
new file mode 100644
index 0000000000..d927df50e1
--- /dev/null
+++ b/files/es/conflicting/learn/css/building_blocks/cascade_and_inheritance/index.html
@@ -0,0 +1,126 @@
+---
+title: Cascada y herencia
+slug: conflicting/Learn/CSS/Building_blocks/Cascade_and_inheritance
+translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance
+translation_of_original: Web/Guide/CSS/Getting_started/Cascading_and_inheritance
+original_slug: Web/CSS/Introducción/Cascading_and_inheritance
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p>{{ previousPage("/es/docs/Web/CSS/Introduction/How_CSS_works", "Cómo funciona el CSS.")}}<span id="result_box" lang="es"><span class="hps">Esta</span> <span class="hps">es</span> <span class="hps">la cuarta sección </span> <span class="alt-edited hps">del</span> <span class="hps">tutorial</span><span> <span class="hps">CSS</span> <span class="hps">Primeros pasos</span>;</span> <span class="hps">que</span> <span class="hps">describe cómo</span> <span class="hps">interactúan</span> <span class="hps">las hojas de estilo</span> <span class="hps">en cascada,</span> <span class="hps">y</span> <span class="hps">cómo los elementos</span> <span class="hps">heredan</span> <span class="hps">el estilo</span> <span class="hps">de sus padres.</span> <span class="alt-edited hps">Usted agrega</span> <span class="hps">a</span> <span class="hps">la hoja de estilos</span> <span class="alt-edited hps">de ejemplo,</span> <span class="hps">utilizando la herencia</span> <span class="alt-edited hps">para alterar</span> <span class="hps">el estilo de</span> <span class="alt-edited hps">muchas partes del</span> <span class="hps">documento</span> <span class="hps">en un solo paso</span><span>.</span></span></p>
+
+<h2 class="clearLeft" id="Información_Cascada_y_herencia"><span class="short_text" id="result_box" lang="es"><span class="hps">Información</span><span>:</span> <span class="hps">Cascada</span> <span class="hps">y</span> <span class="hps">herencia</span></span></h2>
+
+<p><span id="result_box" lang="es"><span class="hps">El estilo</span> <span class="hps">final para</span> <span class="hps">un elemento</span> <span class="hps">se puede especificar en</span> <span class="hps">muchos lugares</span> <span class="hps">diferentes</span><span>, que pueden interactuar</span> <span class="hps">de una manera compleja</span><span>.</span> <span class="hps">Esta interacción</span> <span class="hps">compleja</span> <span class="hps">hace</span> <span class="alt-edited hps">el CSS</span> <span class="alt-edited hps">poderoso</span><span>,</span> <span class="alt-edited hps">pero puede también</span> <span class="hps">hacer que sea</span> <span class="hps">confuso y difícil</span> <span class="hps">de depurar.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="alt-edited hps">Tres</span> <span class="alt-edited hps">principales fuentes de</span> <span class="hps">información de estilo</span> <span class="alt-edited hps">forman</span> <span class="hps">una <em>cascada</em></span><span>.</span> <span class="alt-edited hps">Estas son:</span></span></p>
+
+<ul>
+ <li><span id="result_box" lang="es"><span class="hps">Estilos</span> <span class="hps">por defecto del navegador</span> <span class="hps">para</span> <span class="alt-edited hps">del lenguaje de marcado</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">Estilos</span> <span class="hps">especificados</span> <span class="hps">por un usuario</span> <span class="hps">que está leyendo</span> <span class="hps">el documento</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">Los</span> <span class="hps">estilos</span> <span class="hps">relacionados en </span><span class="hps">el documento</span> <span class="hps">por su autor</span><span>.</span> <span class="hps">Estos pueden</span> <span class="hps">ser especificados</span> <span class="hps">en tres lugares</span><span>:</span></span>
+  <ul>
+   <li><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">un archivo externo</span><span>:</span> <span class="hps">este tutorial</span> <span class="alt-edited hps">aborda</span> <span class="hps">principalmente</span> <span class="hps">este</span> <span class="hps">método para definir</span> <span class="hps">los estilos.</span></span></li>
+   <li><span id="result_box" lang="es"><span class="hps">En una definición</span> <span class="hps">al principio</span> <span class="hps">del documento</span><span>: utilice</span> <span class="alt-edited hps">este método únicamente</span> <span class="hps">para los estilos</span> <span class="hps">que se utilizan sólo</span> <span class="hps">en esa página</span> <span class="hps">.</span></span></li>
+   <li><span id="result_box" lang="es"><span class="hps">En un</span> <span class="hps">elemento específico</span> <span class="hps">en el cuerpo</span> <span class="hps">del documento</span><span>:</span> <span class="hps">este</span> <span class="hps">es el método menos</span> <span class="alt-edited hps">fácil de mantener</span><span>,</span> <span class="hps">pero puede ser utilizado</span> <span class="alt-edited hps">para la probar.</span></span></li>
+  </ul>
+ </li>
+</ul>
+
+<p><span id="result_box" lang="es"><span class="hps">El estilo del</span> <span class="hps">usuario modifica</span> <span class="hps">el estilo</span> <span class="hps">por defecto del navegador</span><span>.</span> <span class="alt-edited hps">El estilo</span> <span class="hps">del autor del documento</span> <span class="alt-edited hps">a continuación</span> <span class="hps">modifica</span> <span class="hps">el estilo</span> <span class="hps">un poco más.</span> <span class="hps">En este tutorial,</span> <span class="hps">usted es el autor</span> <span class="hps">del documento</span> <span class="alt-edited hps">de ejemplo,</span> <span class="hps">y</span> <span class="hps">solo trabaja</span> <span class="hps">con</span> <span class="hps">hojas de estilo</span> <span class="hps">del autor</span><span>.</span></span></p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Cuando lea este</span> <span class="hps">documento en un navegador</span><span>,</span> <span class="hps">parte del estilo</span> <span class="alt-edited hps">que ves</span> <span class="alt-edited hps">proviene</span> <span class="alt-edited hps">por defecto</span> <span class="hps">de su</span> <span class="alt-edited hps">navegador de</span> <span class="hps">HTML</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Parte del</span> <span class="hps">estilo</span> <span class="hps">podría venir de</span> <span class="alt-edited hps">los ajustes </span></span><span id="result_box" lang="es"><span class="hps">personalizados </span></span><span id="result_box" lang="es"><span class="alt-edited hps">del navegador</span> <span class="hps">o</span> <span class="alt-edited hps">de un archivo</span> <span class="alt-edited hps">de definición de estilo</span> <span class="hps">personalizado.</span> <span class="hps">En Firefox</span><span>, la configuración</span> <span class="hps">se puede personalizar en</span> <span class="alt-edited hps">cuadro de diálogo Preferencias</span><span>, o puede</span> <span class="hps">especificar</span> <span class="hps">estilos</span> <span class="hps">en un archivo</span> </span><span id="result_box" lang="es"><span class="alt-edited hps">denominado</span> </span><span id="result_box" lang="es"><em><code><span class="hps">user Content.css,</span></code></em> <span class="alt-edited hps">archivado </span><span class="hps">en su perfil de</span> <span class="hps">navegador.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Parte del</span> <span class="alt-edited hps">estilo</span> <span class="hps">proviene de</span> <span class="hps">las hojas de estilo</span> <span class="hps">vinculadas al</span> <span class="hps">documento</span> <span class="hps">por el servidor</span></span> wiki.</p>
+</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Al abrir su</span> <span class="hps">documento de muestra</span> <span class="hps">en el navegador,</span> <span class="atn hps">los elementos </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="alt-edited hps">son</span> <span class="alt-edited hps">más relevante que</span> <span class="hps">el</span> <span class="hps">resto del texto</span><span>.</span> <span class="alt-edited hps">Esto viene del</span> <span class="hps">estilo por defecto</span> <span class="hps">del navegador</span> <span class="hps">para HTML</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="atn hps">El elemento </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="hps">son rojos.</span> <span class="alt-edited hps">Esto viene</span> <span class="alt-edited hps">de la</span> <span class="hps">propia hoja de estilos</span> <span class="alt-edited hps">de ejemplo.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="atn hps">El elemento </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="hps">también</span> <span class="hps">heredan</span> <span class="hps">gran parte del estilo del elemento </span></span>{{ HTMLElement("p") }}<span lang="es"><span class="hps">,</span> <span class="alt-edited hps">porque ellos son</span> <span class="hps">sus</span> <span class="hps">hijos.</span> <span class="hps">De la misma manera</span><span>,</span> <span class="alt-edited hps">los</span> elementos </span>{{ HTMLElement("p") }}<span lang="es"> <span class="alt-edited hps">heredan</span> <span class="hps">gran parte del estilo</span> <span class="hps">del</span> <span class="hps">elemento</span></span>{{ HTMLElement("body") }}<span lang="es"><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Para los estilos</span> <span class="alt-edited hps">en cascada</span><span class="alt-edited">, las hojas de estilo</span> <span class="hps">del autor</span> <span class="hps">tienen</span> <span class="alt-edited hps">prioridad, </span> <span class="alt-edited hps">ante las hojas de estilo</span> <span class="hps">del lector</span><span>, </span> <span class="hps">por defecto</span> <span class="hps">de tu navegador</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Para los estilos</span> <span class="hps">heredados</span><span>,</span> <span class="hps">el estilo propio de</span> <span class="hps">un nodo</span> <span class="hps">hijo tiene</span> <span class="hps">prioridad sobre</span> <span class="alt-edited hps">estilo</span> <span class="hps">heredado de</span> <span class="hps">su</span> <span class="hps">padre</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Estas no son las</span> <span class="hps">únicas prioridades</span> <span class="hps">que se aplican</span><span>.</span> <span class="alt-edited hps">En una página posterior</span><span class="alt-edited hps"> de este</span> <span class="hps">tutorial se explica</span> <span class="alt-edited hps">mas detalladamente</span><span>.</span></span></p>
+
+<div class="tuto_details">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="alt-edited hps">Más</span> <span class="hps">detalles</span></span></div>
+
+<p><span id="result_box" lang="es"><span class="alt-edited hps">El CSS</span> <span class="hps">también proporciona</span> <span class="hps">una forma para que</span> <span class="hps">el lector</span> <span class="alt-edited hps">pueda anular</span> <span class="hps">el estilo</span> <span class="hps">del autor del documento</span><span>,</span> <span class="hps">mediante el uso de</span> <span class="hps">la palabra clave</span><span>! </span></span><code>!important</code>.</p>
+
+<p><span id="result_box" lang="es"><span class="hps">Esto significa</span> <span class="hps">que, como</span> <span class="hps">autor del documento</span><span>,</span> <span class="hps">no siempre se puede</span> <span class="hps">predecir con exactitud</span> <span class="hps">lo que sus lectores</span> <span class="hps">van a ver.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Si</span> <span class="hps">quieres conocer</span> <span class="hps">todos los detalles de</span></span> cascada y herencia mira <a class="external" href="http://www.w3.org/TR/CSS21/cascade.html">Asignando propiedad de valores, cascada, y herencia</a> <span id="result_box" lang="es"><span class="hps">en</span> <span class="alt-edited hps">las</span> <span class="hps">especificaciones</span> d<span class="alt-edited hps">el CSS</span><span>.</span></span></p>
+</div>
+
+<h2 id="Acción_El_uso_de_la_herencia"><span class="short_text" id="result_box" lang="es"><span class="hps">Acción</span><span>: El uso de</span> <span class="hps">la herencia</span></span> </h2>
+
+<ol>
+ <li><span id="result_box" lang="es"><span class="hps">Edite su archivo</span> <span class="alt-edited hps"> CSS</span> <span class="alt-edited hps">de ejemplo.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="alt-edited hps">Agrega</span> <span class="hps">esta línea</span> <span class="hps">copiando y</span> <span class="hps">pegando</span><span>.</span> <span class="hps">Realmente no</span> <span class="hps">importa si</span> <span class="hps">usted la agrega</span> <span class="hps">por encima o por</span> <span class="hps">debajo de la línea</span> <span class="hps">que está</span><span>.</span> <span class="alt-edited hps">Sin embargo, añadirla</span> <span class="hps">en la parte superior</span> <span class="hps">es más</span> <span class="hps">lógico, porque</span> <span class="hps">en el documento </span><span class="alt-edited hps">el</span> elemento </span>{{ HTMLElement("p") }}<span lang="es"> es el <span class="alt-edited hps">elemento</span> <span class="hps">padre</span> <span class="atn hps">del elemento  </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span>:</span></span>
+  <pre class="brush:css">p {color: blue; text-decoration: underline;}
+</pre>
+ </li>
+ <li>Ahora actualice el navegador para ver el efecto <span id="result_box" lang="es"><span class="hps">en su</span> <span class="hps">documento de muestra.</span></span> El subrayado afecta todo el texto en el párrafo, incluido las letras iniciales. Los elementos {{ HTMLElement("strong") }} <span id="result_box" lang="es"><span class="hps">han heredado</span> <span class="hps">el estilo</span> <span class="hps">subrayado</span> <span class="hps">de su elemento padre </span></span>{{ HTMLElement("p") }}.<br>
+
+  <p><span id="result_box" lang="es"><span class="hps">Pero</span> <span class="atn hps">los elementos </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="hps">siguen siendo</span> <span class="hps">rojo.</span> <span class="hps">El color rojo</span> <span class="hps">es</span> <span class="hps">su estilo</span><span> </span><span class="hps">propio</span><span>,</span> <span class="hps">por lo que tiene</span> <span class="hps">prioridad sobre</span> <span class="hps">el color azul</span> <span class="hps">de su elemento</span> <span class="hps">padre</span> </span>{{ HTMLElement("p") }}<span lang="es"> <span>.</span></span></p>
+ </li>
+</ol>
+
+<table style="background-color: #f4f4f4; border: 1px solid #3366bb; padding: 1em;">
+</table>
+
+<table style="border: 2px outset #3366bb; margin-right: 2em; padding: 1em;">
+ <caption>Antes</caption>
+ <tbody>
+  <tr>
+   <td><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
+  </tr>
+ </tbody>
+</table>
+
+<table style="border: 2px outset #3366bb; padding: 1em;">
+ <caption>Después</caption>
+ <tbody>
+  <tr>
+   <td style="color: blue; text-decoration: underline;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="tuto_example">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="alt-edited hps">Problema</span></span></div>
+<span id="result_box" lang="es"><span class="hps">Cambie su</span> hoja de <span class="hps">estilo</span> <span class="hps">de manera que</span> <span class="alt-edited hps">aparecen subrayados</span> <span class="hps">sólo las letras</span> <span class="hps">rojas</span><span>:</span></span>
+
+<table style="border: 2px outset #3366bb; padding: 1em;">
+ <tbody>
+  <tr>
+   <td style="color: blue;"><strong style="color: red; text-decoration: underline;">C</strong>ascading <strong style="color: red; text-decoration: underline;">S</strong>tyle <strong style="color: red; text-decoration: underline;">S</strong>heets</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="tuto_details" id="tutochallenge">
+<div class="tuto_type">Possible solution</div>
+
+<p>Move the declaration for underlining from the rule for {{ HTMLElement("p") }} to the one for {{ HTMLElement("strong") }}. The resulting file looks like this:</p>
+
+<pre class="brush: css">p {color: blue; }
+strong {color: red; text-decoration: underline;}
+</pre>
+
+<p> </p>
+<a class="hideAnswer" href="#challenge">Hide solution</a></div>
+<a href="#tutochallenge" title="Display a possible solution for the challenge">Ver una solución al desafío.</a></div>
+
+<h2 id="¿Y_ahora_qué"><span class="short_text" id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
+
+<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Selectors", "Selectores")}}<span id="result_box" lang="es"><span class="hps">Su</span> <span class="hps">hoja de estilo</span> <span class="hps">de ejemplo especifica</span> <span class="hps">estilos</span> <span class="hps">para las etiquetas</span> <span class="atn hps">&lt;</span><span>p</span><span>&gt;</span> <span class="hps">y</span> <span class="hps">&lt;strong</span><span>&gt;</span><span>, cambiando el</span> <span class="hps">estilo de</span> <span class="hps">los elementos correspondientes</span> <span class="hps">en todo el documento</span><span>.</span> <span class="hps">La</span> <span class="hps">siguiente sección</span> <span class="hps">describe cómo especificar</span> <span class="hps">el estilo</span> <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Selectors">de manera más selectiva</a></span>.</p>
diff --git a/files/es/conflicting/learn/css/building_blocks/index.html b/files/es/conflicting/learn/css/building_blocks/index.html
new file mode 100644
index 0000000000..6c07d85ec3
--- /dev/null
+++ b/files/es/conflicting/learn/css/building_blocks/index.html
@@ -0,0 +1,336 @@
+---
+title: Boxes
+slug: conflicting/Learn/CSS/Building_blocks
+translation_of: Learn/CSS/Building_blocks
+translation_of_original: Web/Guide/CSS/Getting_started/Boxes
+original_slug: Web/CSS/Introducción/Boxes
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Lists", "Lists") }}Esta es la sección 11 del Tutorial de  <a href="/en-US/docs/Web/Guide/CSS/Getting_Started" title="en-US/docs/Web/Guide/CSS/Getting Started">CSS Getting Started</a> ; <span id="result_box" lang="es"><span class="hps alt-edited">se describen</span> <span class="hps">cómo se puede</span> <span class="hps">usar CSS para</span> <span class="hps">controlar el espacio</span> <span class="hps">que un elemento</span> <span class="hps">ocupa</span> <span class="hps">cuando se muestra</span><span>.</span> <span class="hps">En</span> <span class="hps">su</span> <span class="hps">documento de ejemplo</span><span>, se cambia el</span> <span class="hps">espacio</span> <span class="hps alt-edited">y se agregan</span> <span class="hps">reglas</span> <span class="hps">decorativos.</span></span></p>
+
+<h2 class="clearLeft" id="Información_Cajas"><span id="result_box" lang="es"><span class="hps">Información:</span> <span class="hps">Cajas</span></span></h2>
+
+<p><span id="result_box" lang="es"><span class="hps">Cuando</span> <span class="hps">el navegador muestra</span> <span class="hps">un elemento</span><span>, el elemento</span> <span class="hps alt-edited">ocupa un espacio</span><span>.</span> <span class="hps">Hay</span> <span class="hps">cuatro partes en</span> <span class="hps">el espacio</span> <span class="hps">que ocupa</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">En el centro,</span> <span class="hps">existe</span> <span class="hps">el espacio que el</span> <span class="hps">elemento</span> <span class="hps">necesita para mostrar</span> <span class="hps">su contenido.</span> <span class="hps">Alrededor de</span> <span class="hps">eso, no hay</span> <span class="hps">relleno.</span> <span class="hps alt-edited">En torno</span> <span class="hps alt-edited">de est, hay</span> <span class="hps alt-edited">un borde</span><span>.</span> <span class="hps alt-edited">En torno</span> <span class="hps alt-edited">esto, hay</span> <span class="hps">un margen</span> <span class="hps">que separa</span> <span class="hps alt-edited">este elemento</span> <span class="hps">de otros elementos</span><span>.</span></span></p>
+
+<table>
+ <tbody>
+  <tr>
+   <td style="width: 22em;">
+    <div style="background-color: #eee; padding: 0px 2em 2em 2em; width: 16em;">
+    <p style="text-align: center; margin: 0px;">margin</p>
+
+    <p style="text-align: center; margin: 0px 0px -.75em 0px;">border</p>
+
+    <div style="background-color: #fff; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
+    <p style="text-align: center;">padding</p>
+
+    <div style="background-color: #eee;">
+    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #999;">element</p>
+    </div>
+    </div>
+    </div>
+
+    <p><span class="short_text" id="result_box" lang="es"><span class="hps">El</span> <span class="hps">gris pálido</span> <span class="hps">muestra</span> <span class="hps">partes del</span> <span class="hps">diseño.</span></span></p>
+   </td>
+   <td>
+    <div style="background-color: #fff; padding: 0px 2em 2em 2em; width: 16em;">
+    <p style="text-align: center; margin: 0px;"> </p>
+
+    <p style="text-align: center; margin: 0px 0px -.75em 0px;"> </p>
+
+    <div style="background-color: #fff; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
+    <p style="text-align: center;"> </p>
+
+    <div style="background-color: #fff;">
+    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #999;">element</p>
+    </div>
+    </div>
+    </div>
+
+    <p><span class="short_text" id="result_box" lang="es"><span class="hps">Esto es</span> <span class="hps">lo que se ve</span> <span class="hps">en su navegador</span><span>.</span></span></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps alt-edited">relleno, el borde</span> <span class="hps">y</span> <span class="hps alt-edited">el margen</span> <span class="hps">pueden tener diferentes tamaños</span> <span class="hps">en la parte superior</span><span class="alt-edited">, derecha, inferior</span> <span class="hps">e izquierda del</span> <span class="hps">elemento</span><span>.</span> <span class="hps alt-edited">Alguno o</span> <span class="hps">todos estos tamaños</span> <span class="hps">pueden</span> <span class="hps">ser cero</span><span>.</span></span></p>
+
+<h3 id="Coloreando">Coloreando</h3>
+
+<p><span id="result_box" lang="es"><span class="hps">El relleno es</span> <span class="hps">siempre</span> <span class="hps">el mismo color que</span> <span class="hps">el elemento del fondo</span><span>.</span> <span class="hps">Así que</span> <span class="hps">cuando se establece el</span> <span class="hps">color de fondo</span><span>, se ve el</span> <span class="hps">color aplicado</span> <span class="hps">al elemento</span> <span class="hps">en sí y su</span> <span class="hps">relleno.</span> <span class="hps">El margen es</span> <span class="hps">siempre</span> <span class="hps">transparente.</span></span></p>
+
+<table>
+ <tbody>
+  <tr>
+   <td style="width: 22em;">
+    <div style="background-color: #eee; padding: 0px 2em 2em 2em; width: 16em;">
+    <p style="text-align: center; margin: 0px;">margin</p>
+
+    <p style="text-align: center; margin: 0px 0px -.75em 0px;">border</p>
+
+    <div style="background-color: #efe; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
+    <p style="text-align: center;">padding</p>
+
+    <div style="background-color: #ded;">
+    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #898;">element</p>
+    </div>
+    </div>
+    </div>
+
+    <p><span class="short_text" id="result_box" lang="es"><span class="hps">El elemento tiene</span> <span class="hps">un fondo verde</span> <span class="hps">.</span></span></p>
+   </td>
+   <td>
+    <div style="background-color: #fff; padding: 0px 2em 2em 2em; width: 16em;">
+    <p style="text-align: center; margin: 0px;"> </p>
+
+    <p style="text-align: center; margin: 0px 0px -.75em 0px;"> </p>
+
+    <div style="background-color: #efe; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
+    <p style="text-align: center;"> </p>
+
+    <div style="background-color: #efe;">
+    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #898;">element</p>
+    </div>
+    </div>
+    </div>
+
+    <p><span class="short_text" id="result_box" lang="es"><span class="hps">Esto es</span> <span class="hps">lo que se ve</span> <span class="hps">en su navegador</span><span>.</span></span></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Borders">Borders</h3>
+
+<p><span id="result_box" lang="es"><span class="hps">Puede utilizar</span> <span class="hps alt-edited">los bordes</span> <span class="hps">para decorar</span> <span class="hps">elementos con</span> <span class="hps">líneas o cuadros</span><span>.</span><br>
+ <br>
+ <span class="hps">Para especificar</span> <span class="hps">la misma</span> <span class="hps">frontera</span> <span class="hps">todo</span> <span class="hps">alrededor de un elemento</span><span>, utilice la </span><span class="hps">propiedad</span></span><span lang="es"><span> </span><span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"border</span><span>")}</span><span>}</span> <span class="hps">.</span> <span class="hps">Especifique</span> <span class="hps">el ancho</span> <span class="hps">(por lo general</span> <span class="hps">en píxeles</span> <span class="hps">para la visualización</span> <span class="hps">en una pantalla</span><span>)</span><span>, el estilo</span><span>, y el color</span><span>.</span><br>
+ <br>
+ <span class="hps">Los estilos son</span><span>:</span></span></p>
+
+<table style="margin-left: 2em;">
+ <tbody>
+  <tr>
+   <td style="width: 6em;">
+    <div style="border: 2px solid #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>solid</code></div>
+   </td>
+   <td style="width: 6em;">
+    <div style="border: 2px dotted #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>dotted</code></div>
+   </td>
+   <td style="width: 6em;">
+    <div style="border: 2px dashed #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>dashed</code></div>
+   </td>
+   <td style="width: 6em;">
+    <div style="border: 4px double #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>double</code></div>
+   </td>
+  </tr>
+  <tr>
+   <td style="width: 6em;">
+    <div style="border: 2px inset #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>inset</code></div>
+   </td>
+   <td style="width: 6em;">
+    <div style="border: 2px outset #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>outset</code></div>
+   </td>
+   <td style="width: 6em;">
+    <div style="border: 4px ridge #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>ridge</code></div>
+   </td>
+   <td style="width: 6em;">
+    <div style="border: 4px groove #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>groove</code></div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p><span id="result_box" lang="es"><span class="hps">También puede establecer</span> <span class="hps">el estilo a </span></span><em><strong><code>none</code> </strong>(</em><span lang="es"><em> </em><span class="hps">ninguno) o</span> </span><strong><em><code>hidden</code> </em></strong><span lang="es"><span class="hps alt-edited">(oculto), </span> <span class="hps">para eliminar</span> <span class="hps">explícitamente</span> <span class="hps">la frontera <code>(</code></span></span><code><em><strong>border </strong></em>)</code><span lang="es"><span>,</span> <span class="hps">o</span> <span class="hps">establecer el color</span> como <span class="hps">transparente</span> <span class="hps">para hacer</span> <span class="hps">la frontera</span> <span class="hps">invisible</span> <span class="hps">sin cambiar</span> <span class="hps">el diseño.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Para especificar</span> <span class="hps alt-edited">los bordes</span> <span class="hps">de uno en uno</span> por separado<span>, utilice las propiedades</span><span>:</span> <span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-top</span><span>")}</span><span class="atn">}, {</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-right</span><span>")}</span><span class="atn">}, {</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-bottom</span><span>")}</span> <span class="hps atn">}, {</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-left</span><span>")}</span><span>}</span><span>.</span> <span class="hps">Usted</span> <span class="hps">puede utilizar estas para</span> <span class="hps">especificar</span> <span class="hps alt-edited">un borde</span> <span class="hps"> solo en un lado</span><span>,</span> <span class="hps">o</span> <span class="hps">diferentes</span> <span class="hps alt-edited">los bordes</span> <span class="hps">en diferentes lados</span><span>.</span></span></p>
+
+<div class="tuto_example">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="hps">Ejemplo</span></span></div>
+
+<p><br>
+ <span id="result_box" lang="es"><span class="hps">Esta norma</span> <span class="hps">establece el</span> <span class="hps">color de fondo y</span> <span class="hps">el borde superior</span> <span class="hps">de los elementos de</span> <span class="hps">la etiqueta <code><strong><em>h3</em></strong></code></span><span>:</span></span></p>
+
+<pre class="brush:css">h3 {
+  border-top: 4px solid #7c7; /* mid green */
+  background-color: #efe;     /* pale green */
+  color: #050;                /* dark green */
+  }
+</pre>
+
+<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
+
+<table>
+ <tbody>
+  <tr>
+   <td>
+    <p style="font-size: 133%; font-weight: bold; background-color: #efe; border-top: 4px solid #7c7; color: #050; padding-right: 6em;">Stylish heading</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p><span id="result_box" lang="es"><span class="hps">Esta regla</span> <span class="hps">hace que</span> <span class="hps">las imágenes</span> sean <span class="hps">fáciles de ver</span><span>, dándoles</span> <span class="hps">un borde</span> <span class="hps">gris medio</span> a <span class="hps">todo</span><span>:</span></span></p>
+
+<pre class="brush:css">img {border: 2px solid #ccc;}
+</pre>
+
+<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
+
+<table>
+ <tbody>
+  <tr>
+   <td>Image:</td>
+   <td style="border: 2px solid #ccc;"><img alt="Image:Blue-rule.png" class="internal" src="/@api/deki/files/47/=Blue-rule.png"></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Márgenes_y_relleno"><span id="result_box" lang="es"><span class="hps">Márgenes y</span> <span class="hps">relleno</span></span></h3>
+
+<p><br>
+ <span id="result_box" lang="es"><span class="hps">Use</span>  <span class="hps">márgenes y el relleno</span> <span class="hps">para ajustar</span> <span class="hps">las posiciones de</span> <span class="hps">los elementos</span> <span class="hps atn">'</span><span>y crear</span> <span class="hps">el espacio</span> <span class="hps">que les rodea.</span><br>
+ <br>
+ <span class="hps">Utilice la propiedad </span></span><span lang="es"><span class="hps"> </span><span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps">"</span></span>margin<span lang="es"><span>")}</span><span>}</span> <span class="hps">o</span> la <span class="hps">propiedad </span><span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps">"</span></span>padding<span lang="es"><span>")}</span><span>}</span> <span class="hps">para establecer</span> <span class="hps">los</span> <span class="hps">márgenes y el </span><span class="hps"> relleno</span> con sus <span class="hps">anchuras</span> <span class="hps">respectivamente.</span><br>
+ <br>
+ <span class="hps">Si especifica</span> <span class="hps">una</span> <span class="hps">anchura,</span> <span class="hps">que se aplica</span> <span class="hps">en todo el</span> <span class="hps">elemento</span> <span class="hps">(arriba</span><span>, derecha,</span> <span class="hps">abajo y de izquierda</span><span>)</span><span>.</span><br>
+ <br>
+ <span class="hps">Si especifica</span> <span class="hps">dos anchos</span><span>,</span> <span class="hps">la</span> <span class="hps">primera se aplica</span> <span class="hps">a la</span> <span class="hps">parte superior e inferior</span><span>,</span> <span class="hps">la segunda a la</span> <span class="hps">derecha y la izquierda</span><span>.</span><br>
+ <br>
+ <span class="hps">Puede especificar</span> <span class="hps">los cuatro</span> <span class="hps">anchos</span> <span class="hps">en el orden</span><span>:</span> <span class="hps">arriba, derecha</span><span>,</span> <span class="hps">abajo, de izquierda</span><span>.</span></span></p>
+
+<div class="tuto_example">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="hps">Ejemplo</span></span></div>
+
+<p><br>
+ <span id="result_box" lang="es"><span class="hps">Esta norma</span> <span class="hps">delimita</span> <span class="hps">párrafos con</span> <span class="hps">la  </span></span><code><em><strong> class</strong></em></code> <code>remark</code><span lang="es"><span>, dándoles</span> <span class="hps">un borde rojo</span> <span class="hps">a su alrededor.</span><br>
+ <br>
+ <span class="hps">El </span></span><code><strong><em>padding </em></strong></code>(relleno)<code><strong><em> </em></strong></code><span lang="es"><span class="hps">separa </span></span><span lang="es"><span class="hps">un poco </span></span><span lang="es"><span class="hps">todo</span> <span class="hps"> el borde</span> <span class="hps">del texto</span> <span class="hps">.</span></span><br>
+ <br>
+ <span id="result_box" lang="es"><span class="hps">A</span> <span class="hps">la izquierda una </span> <span class="hps alt-edited">sangría</span> <span class="hps alt-edited">desde el margen</span> <span class="hps">del</span> <span class="hps">párrafo con respecto al</span> <span class="hps">resto del texto <code><em><strong>(</strong></em></code></span></span><code><em><strong>margin-left</strong></em></code><span lang="es"><span><code><em><strong> )</strong></em></code>:</span></span></p>
+
+<pre class="brush:css">p.remark {
+  border: 2px solid red;
+  padding: 4px;
+  margin-left: 24px;
+  }
+</pre>
+
+<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
+
+<table>
+ <tbody>
+  <tr>
+   <td>
+    <p><span class="short_text" id="result_box" lang="es"><span class="hps alt-edited">A continuación</span> <span class="hps">es un párrafo</span> <span class="hps">normal.</span></span></p>
+
+    <p style="border: 2px solid red; padding: 4px 6em 4px 4px; margin: 0px 0px 0px 24px;">Aqui con la clase remark.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="hps">Más</span> <span class="hps">detalles</span></span></div>
+
+<p><span id="result_box" lang="es"><span class="hps">Cuando se utiliza</span> <span class="hps">márgenes y el relleno</span> <span class="hps">para ajustar</span> <span class="hps alt-edited">la manera en</span> <span class="hps alt-edited">que los elementos</span> <span class="hps">se disponen</span><span>,</span> <span class="hps">sus</span> <span class="hps">reglas de estilo</span> <span class="hps">interactúan</span> <span class="hps alt-edited">con los estilos</span> <span class="hps">de tu navegador</span> <span class="hps alt-edited">por defecto</span> <span class="hps alt-edited">y pueden ser</span> <span class="hps alt-edited">muy complejas.</span><br>
+ <br>
+ <span class="hps">Los distintos navegadores</span> <span class="hps">ponen</span> <span class="hps alt-edited">que los elementos</span> <span class="hps">de manera diferente</span><span>.</span> <span class="hps">Los</span> <span class="hps alt-edited">resultados pueden</span> <span class="hps">ser similar</span> <span class="hps alt-edited">,hasta que nuestro</span> <span class="hps alt-edited">hoja de estilos</span> <span class="hps">cambia las cosas</span><span>.</span> <span class="hps">A veces esto</span> <span class="hps">puede hacer que sus</span> <span class="hps">hojas de estilo</span> <span class="hps alt-edited">den</span> <span class="hps">resultados sorprendentes.</span><br>
+ <br>
+ <span class="hps">Para</span> <span class="hps">obtener</span> <span class="hps">el resultado deseado</span><span>, es posible que</span> <span class="hps">tenga que cambiar</span> <span class="hps alt-edited">el marcado</span> <span class="hps">de su</span> <span class="hps">documento.</span> <span class="hps">La</span> <span class="hps">página siguiente de</span> <span class="hps">este tutorial</span> <span class="hps">tiene más</span> <span class="hps">información al respecto.</span><br>
+ <br>
+ <span class="hps">Para obtener información</span> <span class="hps">detallada acerca</span> <span class="hps">de relleno</span><span>, márgenes</span> <span class="hps">y bordes</span><span>, consulte</span> <span class="hps">la página de referencia</span> <span class="hps">Modelo de caja</span><span>.</span></span></p>
+</div>
+
+<h2 id="Acción_Agregar_bordes"><span id="result_box" lang="es"><span class="hps">Acción</span><span>:</span> <span class="hps">Agregar bordes</span></span></h2>
+
+<p>Edite su archivo CSS , <strong><em>style2.css</em></strong>. <span id="result_box" lang="es"><span class="hps alt-edited">Agrega</span> <span class="hps">esta regla</span> <span class="hps">para dibujar una línea</span> <span class="hps">a través de la</span> <span class="hps">página</span> <span class="hps">sobre cada</span> <span class="hps alt-edited">encabezado</span><span>:</span></span></p>
+
+<pre class="brush:css">h3 {border-top: 1px solid gray;}
+</pre>
+
+<p><span id="result_box" lang="es"><span class="hps">Si usted tomó</span> <span class="hps alt-edited">el cambio </span><span class="hps alt-edited">en la última página</span><span>,</span> <span class="hps alt-edited">modificara la regla</span> <span class="hps">que ha creado,</span> <span class="hps">de lo contrario</span> <span class="hps alt-edited">agregar la</span> <span class="hps alt-edited">nueva regla</span> <span class="hps alt-edited">para añadir espacio</span> <span class="hps">debajo de cada</span> <span class="hps alt-edited">ítem de la lista</span><span>:</span></span></p>
+
+<pre class="brush:css">li {
+  list-style: lower-roman;
+  margin-bottom: 8px;
+  }
+</pre>
+
+<p><span class="short_text" id="result_box" lang="es"><span class="hps">Actualice el navegador</span> <span class="hps">para ver el resultado</span><span>:</span></span></p>
+
+<table style="border: 2px outset #36b; padding: 1em; background-color: white;">
+ <tbody>
+  <tr>
+   <td>
+    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
+
+    <ul style="">
+     <li style="margin-bottom: 8px;">Arctic</li>
+     <li style="margin-bottom: 8px;">Atlantic</li>
+     <li style="margin-bottom: 8px;">Pacific</li>
+     <li style="margin-bottom: 8px;">Indian</li>
+     <li style="margin-bottom: 8px;">Southern</li>
+    </ul>
+
+    <p style="font-weight: bold; font-size: 133%; margin-top: 1em; margin-bottom: .3em; padding: .4em 4em .16em 0; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
+
+    <p><strong>1: </strong>Lorem ipsum</p>
+
+    <p><strong>2: </strong>Dolor sit</p>
+
+    <p><strong>3: </strong>Amet consectetuer</p>
+
+    <p><strong>4: </strong>Magna aliquam</p>
+
+    <p><strong>5: </strong>Autem veleum</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="tuto_example">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">El reto</span></span></div>
+
+<p><br>
+ <span id="result_box" lang="es"><span class="hps alt-edited">Agrega</span> <span class="hps">una regla a</span> <span class="hps">la hoja de estilos</span><span>, para que</span> <span class="hps alt-edited">aparesca un amplio</span> <span class="hps alt-edited">borde</span> <span class="hps">alrededor de los</span> <span class="hps alt-edited">la lista de océanos, en</span> <span class="hps">un color</span> <span class="hps">que le recuerda</span> <span class="hps">al mar</span><span>, algo</span> <span class="hps">como esto:</span></span></p>
+
+<table style="border: 2px outset #36b; padding: 1em; background-color: white;">
+ <tbody>
+  <tr>
+   <td>
+    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
+
+    <div style="border: 12px solid #69b; padding-left: 1em;">
+    <ul style="">
+     <li style="margin-bottom: 8px;">Arctic</li>
+     <li style="margin-bottom: 8px;">Atlantic</li>
+     <li style="margin-bottom: 8px;">Pacific</li>
+     <li style="margin-bottom: 8px;">Indian</li>
+     <li style="margin-bottom: 8px;">Southern</li>
+    </ul>
+    </div>
+
+    <p style="font-weight: bold; font-size: 133%; margin-top: 1em; margin-bottom: .3em; padding: .4em 4em .16em 0; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
+
+    <p><strong>. . .</strong></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<p><span id="result_box" lang="es"><span class="hps atn">(</span><span>No es necesario</span> <span class="hps alt-edited">que coincida con</span> <span class="hps">el ancho</span> <span class="hps">y el color</span> <span class="hps">que se ve aquí</span> <span class="hps">exactamente</span><span>.</span><span>)</span></span></p>
+</div>
+
+<p><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Boxes">Ver una solución a este desafío.</a></p>
+
+<h2 id="What_next">What next?</h2>
+
+<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Layout", "Layout") }}<span id="result_box" lang="es"><span class="hps">Al especificar</span> <span class="hps">márgenes y el relleno</span><span>, se</span> <span class="hps">modificó el</span> <span class="hps">diseño del documento</span><span>.</span> <span class="hps">En la página siguiente</span> <span class="hps">se cambia</span> el </span><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Layout" title="/en-US/docs/Web/Guide/CSS/Getting_Started/Layout">layout</a><span id="result_box" lang="es"><span class="hps"> de su</span> <span class="hps">documento</span> <span class="hps">de otra manera.</span></span></p>
diff --git a/files/es/conflicting/learn/css/building_blocks/selectors/index.html b/files/es/conflicting/learn/css/building_blocks/selectors/index.html
new file mode 100644
index 0000000000..c15b94b415
--- /dev/null
+++ b/files/es/conflicting/learn/css/building_blocks/selectors/index.html
@@ -0,0 +1,417 @@
+---
+title: Selectores
+slug: conflicting/Learn/CSS/Building_blocks/Selectors
+translation_of: Learn/CSS/Building_blocks/Selectors
+translation_of_original: Web/Guide/CSS/Getting_started/Selectors
+original_slug: Web/CSS/Introducción/Selectors
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Cascading_and_inheritance", "Cascading &amp; inheritance")}}<span id="result_box" lang="es"><span class="hps">Esta</span> <span class="hps">es</span> <span class="hps">la sección</span> <span class="hps">quinta</span> <span class="hps">del</span> </span><span id="result_box" lang="es"><span class="hps">tutoria</span></span><span class="seoSummary"><a href="/en-US/docs/Web/Guide/CSS/Getting_Started" title="en-US/docs/Web/Guide/CSS/Getting Started">CSS Getting Started</a> ;</span><span id="result_box" lang="es"><span class="hps">En él se explica</span> <span class="hps">cómo se puede aplicar</span> <span class="hps">estilos</span> <span class="hps">de forma selectiva</span><span>,</span> <span class="hps">y cómo</span> <span class="hps">los diferentes tipos de</span> <span class="hps">selectores</span> <span class="hps">tener diferentes</span> <span class="hps">prioridades.</span> <span class="hps">Agregar algunos</span> <span class="hps">atributos a</span> <span class="hps">las</span> <span class="hps">etiquetas</span> <span class="hps">en su</span> <span class="hps">documento de muestra</span><span>,</span> <span class="hps">y</span> <span class="hps">utiliza estos</span> <span class="hps">atributos en</span> <span class="hps">su hoja de estilos</span> <span class="hps">de muestra.</span></span></p>
+
+<h2 class="clearLeft" id="Información_Selectores"><span id="result_box" lang="es"><span class="hps">Información:</span> <span class="hps">Selectores</span></span></h2>
+
+<p><br>
+ <span id="result_box" lang="es"><span class="hps">CSS</span> <span class="hps">tiene su propia terminología</span> <span class="hps">para describir el</span> <span class="hps">lenguaje CSS</span><span>.</span> <span class="hps">Anteriormente</span> <span class="hps">en este tutorial,</span> <span class="hps">que ha creado</span> <span class="hps">una línea en</span> <span class="hps">su hoja de estilos</span> <span class="hps alt-edited">como esta:</span></span></p>
+
+<pre class="brush: css">strong {
+  color: red;
+}
+</pre>
+
+<p><span id="result_box" lang="es"><span class="hps">En la terminología de</span> <span class="hps">CSS</span><span>,</span> <span class="hps">toda</span> <span class="hps">esta línea</span> <span class="hps">es una </span></span><em><code><strong>rule </strong></code>(</em><span id="result_box" lang="es"><span class="hps">regla).</span> <span class="hps">Esta regla</span> <span class="hps">comienza con</span> </span><strong><em><code>strong</code></em></strong><span lang="es"><span>, que es un</span> <span class="hps">selector.</span> <span class="hps alt-edited">Permite seleccionar</span> <span class="hps">qué elementos</span> <span class="hps">en el DOM</span> <span class="hps">se aplica la regla</span><span>.</span></span></p>
+
+<div class="tuto_details">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">Más</span> <span class="hps">detalles</span></span></div>
+
+<p><span id="result_box" lang="es"><span class="hps">La parte</span> <span class="hps">interior de las</span> <span class="hps">llaves</span> <span class="hps">es la declaración</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps"> L</span><span class="hps alt-edited">a palabra clave es </span></span><span id="result_box" lang="es"><code><em><span class="hps">color</span></em></code>, que </span><span id="result_box" lang="es"><span class="hps alt-edited">es</span> <span class="hps">una propiedad,</span> <span class="hps">y el <code><em>rojo </em></code>es</span> <span class="hps">el valor.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">El punto y coma</span> <span class="hps">después de el</span> <span class="hps">par</span> <span class="hps">propiedad</span><span class="atn">-</span><span>valor</span> <span class="hps">separa los posibles </span><span class="hps">otros pares de </span> <span class="hps">propiedad</span><span>-valor en</span> una <span class="hps">misma declaración.</span></span></p>
+
+<p> <span id="result_box" lang="es"><span class="hps">Este tutorial</span> <span class="hps">se refiere a</span> <span class="hps">un selector</span> <span class="hps">como</span> </span><em><strong><code>strong</code> </strong></em><span lang="es"><span class="hps">como un</span> <span class="hps">selector de etiquetas</span><span>.</span> <span class="hps">La</span> <span class="hps">especificación</span> <span class="hps">CSS</span> <span class="hps">se refiere a él como</span> <span class="hps">un selector de</span> <span class="hps">tipo <code><strong>(</strong></code></span></span><code><strong> type selector)</strong></code><span lang="es"><span>.</span></span></p>
+</div>
+
+<p><span id="result_box" lang="es"><span class="hps alt-edited">En esta página</span> <span class="hps">del tutorial</span> <span class="hps alt-edited">se explica</span> <span class="hps">más acerca de los</span> <span class="hps">selectores</span> <span class="hps">que se pueden utilizar</span> <span class="hps">en</span> <span class="hps">las reglas CSS</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Además de añadir </span></span><span id="result_box" lang="es"><span class="hps">nombres a las e</span></span><span id="result_box" lang="es"><span class="hps">tiquetas</span> <span>, puede usar </span><span class="hps alt-edited">valores en los atributos</span> de <span class="hps">los selectores</span><span>.</span> <span class="hps">Esto permite que sus</span> <span class="hps">reglas sean</span> <span class="hps">más específicas.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Dos</span> <span class="hps">atributos tienen</span> <span class="hps">un estatus especial</span> <span class="hps">para</span> <span class="hps">CSS</span><span>.</span> <span class="hps">Son</span></span> <a href="/en-US/docs/Web/HTML/Global_attributes#attr-class" title="en-US/docs/Web/HTML/Global_attributes#attr-class"><code>class</code></a> <code>e </code><a href="/en-US/docs/Web/HTML/Global_attributes#id" title="en-US/docs/Web/HTML/Global_attributes#id"><code>id</code></a>.</p>
+
+<h3 id="Class_Selectores_de_clase">Class: <span id="result_box" lang="es"><span class="hps">Selectores de clase</span></span></h3>
+
+<p><span id="result_box" lang="es"><span class="hps">Utilice el</span> <span class="hps">atributo</span></span> <a href="/en-US/docs/Web/HTML/Global_attributes#attr-class" title="en-US/docs/Web/HTML/Global_attributes#attr-class"><code>class</code></a> para <span id="result_box" lang="es"><span class="hps">asignarle  a </span></span><span id="result_box" lang="es"><span class="hps">un elemento</span> un nombre de clase<code><strong><em> (class)</em></strong></code></span>. <span id="result_box" lang="es"><span class="hps">Depende de</span><span class="hps">l</span><span class="hps"> nombre que elijas</span> como <span class="hps"><code><strong><em>class</em></strong></code>.</span></span> <span id="result_box" lang="es"><span class="hps">Múltiples</span> <span class="hps">elementos en un documento</span> <span class="hps">pueden tener el mismo</span> <span class="hps">valor de la clase</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">su hoja de estilo</span><span>, escriba</span> <span class="hps atn">un punto (.</span><span>)</span> <span class="hps">antes del </span><span class="hps">nombre de la clase</span>,<span class="hps"> cuando</span> <span class="hps">se utiliza como </span><span class="hps">un selector.</span></span></p>
+
+<h3 id="Selectores_ID"><span id="result_box" lang="es"><span class="hps alt-edited">Selectores ID</span></span></h3>
+
+<p><span id="result_box" lang="es"><span class="hps">Utilice el atributo</span> <span class="hps">id en</span> <span class="hps">un elemento</span> <span class="hps">para asignar un</span> <span class="hps alt-edited">identificación para</span> ese <span class="hps">elemento</span><span>.</span> <span class="hps">Depende de</span> usted el <span class="hps">nombre que elija</span> <span class="hps">para el ID</span><span>.</span> <span class="hps">El nombre de</span> <span class="hps">ID</span> <span class="hps">debe ser único</span> <span class="hps">en el documento.</span></span><br>
+  </p>
+
+<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">su hoja de estilo</span><span>, escriba un</span> <span class="hps alt-edited">símbolo de almohadilla</span> <span class="hps atn">(</span><span class="alt-edited">#)</span> <span class="hps alt-edited">ante el</span> <span class="hps alt-edited">ID cuando</span> <span class="hps alt-edited">se utiliza esto en</span> <span class="hps">un selector.</span></span></p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Esta etiqueta</span> <span class="hps">HTML</span> <span class="hps">tiene un</span> <span class="hps alt-edited">atributo <code>class</code></span><code> </code><span class="hps">y un atributo</span> <span class="hps"><code>id</code>:</span></span></p>
+
+<pre class="brush: html">&lt;p class="key" id="principal"&gt;
+</pre>
+
+<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps alt-edited">valor de <code><em><strong>id </strong></em></code>es</span><span class="alt-edited">, <strong>principal</strong>,</span> <span class="hps">debe ser único</span> <span class="hps">en el documento;</span> <span class="hps">pero</span> <span class="hps">otras</span> <span class="hps">etiquetas del documento</span> <span class="hps">puede tener el mismo</span> <span class="hps alt-edited">nombre de la <strong><em><code>class</code></em></strong></span><span>,</span> <span class="hps alt-edited">Key.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">una hoja de estilo</span> <span class="hps">CSS</span><span>,</span> <span class="hps">esta regla</span> <span class="hps">hace que todos</span> <span class="hps">los elementos con la <code><em>class</em></code></span><code><em> </em></code><span class="hps"><code><em><strong>key </strong></em></code>sean verdes</span> <span>.</span> <span class="hps atn">(</span><span>Puede ser que no</span> <span class="hps">todos los sean</span> <span class="hps atn">{</span><span class="atn">{</span><span>HTMLElement</span> <span class="hps">()</span><span>}</span> <span class="hps">"p"</span><span>}</span> <span class="hps">elementos.</span><span>)</span></span></p>
+
+<pre class="brush: css">.key {
+  color: green;
+}
+</pre>
+
+<p><span id="result_box" lang="es"><span class="hps">Esta regla</span> <span class="hps">hace que</span> <span class="hps">el </span></span><span id="result_box" lang="es"><span class="hps">único </span></span><span id="result_box" lang="es"><span class="hps"> </span></span><span id="result_box" lang="es"><span class="hps">elemento</span> </span><span id="result_box" lang="es"> <span class="hps alt-edited">de id </span></span><span id="result_box" lang="es"><code><strong><em><span class="hps alt-edited">principal</span></em></strong></code> este en <span class="hps">negrita:</span></span></p>
+
+<pre class="brush: css">#principal {
+  font-weight: bolder;
+}
+</pre>
+</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Si más de una</span> <span class="hps">regla se aplica a</span> <span class="hps">un elemento</span> <span class="hps">y especifica</span> <span class="hps">la misma propiedad,</span> <span class="hps alt-edited">entonces</span> <span class="hps alt-edited">el CSS</span> <span class="hps">da prioridad</span> <span class="hps">a la regla que</span> <span class="hps">tiene el</span> <span class="hps">selector más específico</span><span>.</span> <span class="hps">Un selector</span> <code><em><strong><span class="hps">ID</span> </strong></em></code><span class="hps">es más específico que</span> <span class="hps">un</span> <span class="hps alt-edited">selector de <em><strong><code>class</code></strong></em></span><span>,</span> <span class="hps">que a su vez</span> <span class="hps">es más específico que</span> <span class="hps">un</span> <span class="hps alt-edited">selector (<strong>tag</strong>) de etiquetas</span><span>.</span></span></p>
+
+<div class="tuto_details">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">Más</span> <span class="hps">detalles</span></span></div>
+
+<p><span id="result_box" lang="es"><span class="hps">También se pueden combinar</span> <span class="hps">selectores</span><span>, haciendo un</span> <span class="hps">selector más específico</span><span>.</span></span><br>
+ <br>
+ Por ejemplo, el selector <strong><em><code>.key</code></em></strong> selecciona <span id="result_box" lang="es"><span class="hps">todos los</span> <span class="hps">elementos que tienen</span> <code><em><strong><span class="hps">key</span> </strong></em></code>como <span class="hps alt-edited">nombre de clase (<strong><em><code>class</code></em></strong></span></span>). El selector <code><em><strong>p</strong></em>.key</code> <span id="result_box" lang="es"><span class="hps">selecciona</span> <span class="hps">sólo el elemento</span></span> {{ HTMLElement("p") }} que tiene de nombre <em><strong><code>key</code></strong></em>.</p>
+
+<p><span id="result_box" lang="es"><span class="hps">Usted no esta </span><span class="hps">limitado a los dos</span> <span class="hps">atributos especiales</span><span>, </span></span><em><strong><code>class</code> </strong></em><span lang="es"><span class="hps">e <em><code><strong>id</strong></code></em></span><span>.</span>  Se p<span class="hps">uede especificar</span> <span class="hps">otros atributos</span> <span class="hps">mediante corchetes</span><span>.</span> <span class="hps">Por ejemplo</span><span>, el selector</span> <span class="hps atn">[</span></span><strong><em><code>type='button'</code></em></strong><span lang="es"><span>] selecciona</span> <span class="hps">todos los</span> <span class="hps">elementos que tienen</span> <span class="hps">un atributo de tipo</span> <span class="hps">con el </span> <span class="hps">valor </span></span><strong><em><code>button</code></em></strong><span lang="es"><span>.</span></span></p>
+</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Si</span> <span class="hps">la hoja de estilo</span> <span class="hps">tiene reglas</span> <span class="hps">en conflicto</span> <span class="hps">y son</span> <span class="hps">igualmente específicas</span><span>, entonces</span> <span class="hps alt-edited">el CSS</span> <span class="hps">da</span> <span class="hps">prioridad a</span> <span class="hps alt-edited">la regla que</span> <span class="hps alt-edited">está</span> <span class="hps alt-edited">después en</span> <span class="hps">la hoja de estilos</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Cuando</span> <span class="hps">usted tiene un problema</span> <span class="hps alt-edited">con las reglas</span> <span class="hps">en conflicto,</span> <span class="hps alt-edited">trate de resolverlo</span> <span class="hps">haciendo</span> <span class="hps">una de las</span> <span class="hps">normas más específicas</span><span>, para que</span> <span class="hps alt-edited">tenga </span><span class="hps">prioridad.</span> <span class="hps">Si usted no puede</span> <span class="hps">hacer esto</span><span>, trate de mover</span> <span class="hps">una de las reglas</span> mas <span class="hps alt-edited">cerca del</span> <span class="hps">final de</span> <span class="hps">la hoja de estilos</span> <span class="hps">para que tenga</span> la <span class="hps">prioridad.</span></span></p>
+
+<h3 id="Las_pseudo-clases_de_los_selectores"><span class="short_text" id="result_box" lang="es"><span class="hps atn">Las pseudo-</span><span>clases de</span> los <span class="hps">selectores </span></span></h3>
+
+<p><span id="result_box" lang="es"><span class="hps">Una</span> <span class="hps">pseudo-clase </span></span> <a href="/en-US/docs/Web/CSS/Pseudo-classes" title="en-US/docs/Web/Guide/CSS/Pseudo-classes">pseudo-class</a><span lang="es"> <span class="hps alt-edited">es en  CSS</span> <span class="hps">una palabra clave</span> <span class="hps">añadida a</span> <span class="hps">los selectores,</span> <span class="hps">que especifica</span> <span class="hps">un estado especial</span> <span class="hps">del elemento</span> <span class="hps">a seleccionar.</span> <span class="hps">Por ejemplo</span> <span class="hps atn">{</span><span class="atn">{</span><span>Css</span> <span class="hps">Href</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>: hover</span><span>")}</span><span>}</span> <span class="hps">aplicará</span> <span class="hps">un estilo</span> <span class="hps">cuando el</span> <span class="hps">usuario se desplaza sobre</span> <span class="hps">el elemento especificado</span> <span class="hps alt-edited">mediante el selector</span></span>.</p>
+
+<p><span id="result_box" lang="es"><span class="hps">Las </span></span><code>Pseudo-classes</code><span lang="es"><span>,</span> <span class="hps">junto con</span> <span class="hps">los <code>pseudo-elements</code></span><span>,</span> <span class="hps">permiten aplicar</span> <span class="hps">un estilo</span> <span class="hps">a un elemento</span> <span class="hps">no sólo</span> <span class="hps">en relación con</span> <span class="hps">el contenido</span> <span class="hps">de</span> <span class="hps">la estructura del documento</span><span>,</span> <span class="hps">sino también en relación</span> <span class="hps">a los factores externos</span><span>, como</span> <span class="hps">la historia del</span> <span class="hps atn">navegador </span><span>por ejemplo:</span><span class="hps atn"> (</span><span class="atn">{</span><span class="atn">{</span><span>href</span> <span class="hps">css</span> <span class="hps atn">(</span><span class="hps atn">"</span><span class="hps">: visited</span> <span class="hps">")}</span><span>}</span><span>, )</span><span>,</span> <span class="hps">el estado de</span> <span class="hps">su contenido</span> <span class="hps">(como</span> <span class="hps atn">{</span><span class="atn">{</span><span>ref</span> <span class="hps">css</span> <span class="hps atn">(</span><span>"</span><span>: </span></span>:checked"<span lang="es"><span class="hps">)}</span><span>} en</span> <span class="hps">algunos</span> <span class="hps">elementos de formulario</span><span>)</span><span>,</span> <span class="hps">o</span> <span class="hps">la posición del</span> <span class="hps">ratón</span> <span class="hps">(como</span> <span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps">("</span></span>:hover<span lang="es"> <span class="hps">")}</span><span>}</span> <span class="hps">que le permite saber</span> <span class="hps">si</span> <span class="hps">el ratón está sobre</span> <span class="hps">un elemento o</span> <span class="hps">no).</span> <span class="hps">Para ver</span> <span class="hps">una lista completa de</span> <span class="hps">selectores</span><span>,</span> <span class="hps">visite</span> <span class="hps">especificación</span> <span class="hps">CSS3</span> <span class="hps">Selectores</span> <span class="hps">de trabajo </span></span> <a class="external" href="http://www.w3.org/TR/selectors/#selectors" rel="external nofollow" title="CSS3 Selectors working spec">CSS3 Selectors working spec</a>.</p>
+
+<div class="tuto_example">
+<div class="tuto_type"><span class="short_text" id="result_box" lang="es"><span class="hps">Sintaxis</span></span></div>
+
+<pre class="brush:css">selector:pseudo-class {
+  property: value;
+}
+</pre>
+</div>
+
+<h4 id="Listado_de_pseudo-classes">Listado de pseudo-classes:</h4>
+
+<ul>
+ <li>{{ Cssxref(":link") }}</li>
+ <li>{{ Cssxref(":visited") }}</li>
+ <li>{{ Cssxref(":active") }}</li>
+ <li>{{ Cssxref(":hover") }}</li>
+ <li>{{ Cssxref(":focus") }}</li>
+ <li>{{ Cssxref(":first-child") }}</li>
+ <li>{{ Cssxref(":last-child") }}</li>
+ <li>{{ Cssxref(":nth-child") }}</li>
+ <li>{{ Cssxref(":nth-last-child") }}</li>
+ <li>{{ Cssxref(":nth-of-type") }}</li>
+ <li>{{ Cssxref(":first-of-type") }}</li>
+ <li>{{ Cssxref(":last-of-type") }}</li>
+ <li>{{ Cssxref(":empty") }}</li>
+ <li>{{ Cssxref(":target") }}</li>
+ <li>{{ Cssxref(":checked") }}</li>
+ <li>{{ Cssxref(":enabled") }}</li>
+ <li>{{ Cssxref(":disabled") }}</li>
+</ul>
+
+<h2 id="Información_Los_selectores_basados_en_relaciones_(relationships)"><span id="result_box" lang="es"><span class="hps">Información:</span> <span class="hps">Los selectores</span> <span class="hps">basados en relaciones </span></span>(relationships)</h2>
+
+<p><span id="result_box" lang="es"><span class="hps alt-edited">El CSS</span> <span class="hps">tiene algunas</span> <span class="hps">formas de seleccionar</span> <span class="hps">elementos en función de</span> <span class="hps">las</span> <span class="hps">relaciones entre los elementos</span><span>.</span> <span class="hps">Usted</span> <span class="hps">puede utilizar estas para</span> <span class="hps">hacer</span> <span class="hps">selectores</span> <span class="hps alt-edited">que sean más específicos</span><span>.</span></span></p>
+
+<table id="relselectors">
+ <caption><span class="short_text" id="result_box" lang="es"><span class="hps">Selectores</span> <span class="hps">comunes</span> <span class="hps alt-edited">basados en relaciones</span></span></caption>
+ <tbody>
+  <tr>
+   <td style="width: 10em;"><strong>Selector</strong></td>
+   <td><strong>Selects</strong></td>
+  </tr>
+  <tr>
+   <td><code>A E</code></td>
+   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es un descendiente de</span> <span class="hps">un elemento</span> <span class="hps atn">A (</span><span>que</span> <span class="hps">es:</span> <span class="hps alt-edited">un hijo o</span> <span class="hps alt-edited">un hijo</span> <span class="hps alt-edited">de un hijo</span> <span class="hps">etc.</span><span>)</span></span></td>
+  </tr>
+  <tr>
+   <td><code>A &gt; E</code></td>
+   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es un hijo de</span> <span class="hps">un elemento A</span></span></td>
+  </tr>
+  <tr>
+   <td><code>E:first-child</code></td>
+   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es el primer</span> <span class="hps">hijo de su padre</span></span></td>
+  </tr>
+  <tr>
+   <td><code>B + E</code></td>
+   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es</span> <span class="hps">el siguiente hermano</span> <span class="hps">de un elemento</span> <span class="hps">B</span> <span class="hps">(es decir</span><span>:</span> <span class="hps">el</span> <span class="hps">próximo hijo</span> <span class="hps">del mismo</span> <span class="hps">padre)</span></span></td>
+  </tr>
+ </tbody>
+</table>
+
+<p><span id="result_box" lang="es"><span class="hps">Usted</span> <span class="hps">puede combinarlas para</span> <span class="hps">expresar relaciones</span> <span class="hps">complejas</span><span>.</span><br>
+ <br>
+ <span class="hps">También puede utilizar</span> <span class="hps">el símbolo</span> <span class="hps">asterisco </span></span><span lang="es"> <span class="hps">(*</span><span>)</span> <span class="hps alt-edited">para significar</span> <span class="hps atn">"</span><span>cualquier elemento</span><span>"</span><span>.</span></span></p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Una tabla HTML</span> <span class="hps">tiene</span> <span class="hps">un atributo <strong><em><code>id</code></em></strong></span><span>,</span> <span class="hps">pero sus</span> <span class="hps">filas y</span> <span class="hps alt-edited">las celdas</span> <span class="hps">no tienen</span> <span class="hps">identificadores individuales</span><span>:</span></span></p>
+
+<pre class="brush: html">&lt;table id="data-table-1"&gt;
+...
+&lt;tr&gt;
+&lt;td&gt;Prefix&lt;/td&gt;
+&lt;td&gt;0001&lt;/td&gt;
+&lt;td&gt;default&lt;/td&gt;
+&lt;/tr&gt;
+...
+</pre>
+
+<p><span id="result_box" lang="es"><span class="hps">Estas</span> <span class="hps">reglas hacen</span> <span class="hps">que la primera celda de</span> <span class="hps">cada fila</span> sea en <span class="hps">negrita,</span> <span class="hps">y</span> <span class="hps">la segunda celda</span> de <span class="hps">cada fila</span> en  la familia de fuente <span class="hps"> monoespaciado</span><span>.</span> <span class="hps alt-edited">Esto</span> <span class="hps alt-edited">sólo afecta a</span> <span class="hps">una</span> <span class="hps alt-edited">tabla concreta</span> <span class="hps alt-edited">del documento:</span></span></p>
+
+<pre class="brush:css">    #data-table-1 td:first-child {font-weight: bolder;}
+    #data-table-1 td:first-child + td {font-family: monospace;}
+</pre>
+
+<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
+
+<table style="border: 2px outset #36b; padding: 1em; background-color: white;">
+ <tbody>
+  <tr>
+   <td>
+    <table style="width: 18em; margin-right: 2em;">
+     <tbody>
+      <tr>
+       <td><strong>Prefix</strong></td>
+       <td><code>0001</code></td>
+       <td>default</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">Más</span> <span class="hps">detalles</span></span></div>
+
+<p><span id="result_box" lang="es"><span class="hps">La manera mas </span><span class="hps">habitual es hacer</span><span class="hps alt-edited"> que un</span> <span class="hps alt-edited">selector sea más específico</span><span>, entonces</span> aumentara <span class="hps">su prioridad.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Si utiliza</span> <span class="hps">estas técnicas</span><span>, se evita</span> <span class="hps">la necesidad de especificar</span> <span class="hps">la</span></span> <strong><em><code>class</code> </em></strong><span id="result_box" lang="es"><span class="hps">o</span> <span class="hps">atributos <strong><em><code>ID</code></em></strong></span></span><strong><em><code> </code></em></strong><span id="result_box" lang="es"><span class="hps alt-edited">en muchas</span> <span class="hps">etiquetas</span> <span class="hps alt-edited">del documento.</span> <span class="hps">En su lugar</span><span>, CSS</span> <span class="hps">hace este trabajo.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">En grandes</span> <span class="hps">diseños</span> <span class="hps">donde la velocidad es</span> <span class="hps">importante</span><span>,</span> <span class="hps">usted puede hacer sus</span> <span class="hps">hojas de estilo</span> <span class="hps">más eficiente</span> <span class="hps">evitando</span> <span class="hps">reglas complejas</span> <span class="hps">que dependen de</span> <span class="hps">relaciones entre los elementos</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Para más ejemplos</span> <span class="hps">sobre</span> <span class="hps">las tablas</span><span>,</span> <span class="hps">ver</span></span> <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Tables" title="en-US/docs/Web/Guide/CSS/Getting_Started/Tables">Tables</a> <span id="result_box" lang="es"><span class="hps">en</span> <span class="hps">la página</span> <span class="hps">CSS Reference</span><span>.</span></span></p>
+</div>
+
+<h2 id="Action_Using_class_and_ID_selectors">Action: Using class and ID selectors</h2>
+
+<ol>
+ <li><span id="result_box" lang="es"><span class="hps">Edite su archivo</span> <span class="hps">HTML</span><span>,</span> <span class="hps">y duplicar</span> <span class="hps">el</span> <span class="hps">párrafo</span> <span class="hps">copiando y</span> <span class="hps">pegando</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">A continuación, agregue los atibutos </span></span> <strong>id</strong> y <strong>class</strong> <span id="result_box" lang="es"><span class="hps">a</span> <span class="hps">la primera copia</span><span>,</span> <span class="hps">y</span> <span class="hps">un atributopara</span> <span class="hps">la segunda copia</span> <span class="hps">como se muestra</span> <span class="hps">a continuación.</span> <span class="hps">Alternativamente</span><span>, copie</span> <span class="hps">y pegue el</span> <span class="hps">archivo entero</span> <span class="hps">de nuevo</span><span>:</span></span>
+  <pre class="brush: html">&lt;!doctype html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+  &lt;meta charset="UTF-8"&gt;
+  &lt;title&gt;Sample document&lt;/title&gt;
+  &lt;link rel="stylesheet" href="style1.css"&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;p id="first"&gt;
+      &lt;strong class="carrot"&gt;C&lt;/strong&gt;ascading
+      &lt;strong class="spinach"&gt;S&lt;/strong&gt;tyle
+      &lt;strong class="spinach"&gt;S&lt;/strong&gt;heets
+    &lt;/p&gt;
+    &lt;p id="second"&gt;
+      &lt;strong&gt;C&lt;/strong&gt;ascading
+      &lt;strong&gt;S&lt;/strong&gt;tyle
+      &lt;strong&gt;S&lt;/strong&gt;heets
+    &lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+ </li>
+ <li><span id="result_box" lang="es"><span class="hps">Ahora edite</span> <span class="hps">su archivo</span> <span class="hps">CSS</span><span>.</span> <span class="hps alt-edited">Reemplazar todo el contenido</span> <span class="hps">con</span><span>:</span></span>
+  <pre class="brush:css">strong { color: red; }
+.carrot { color: orange; }
+.spinach { color: green; }
+#first { font-style: italic; }
+</pre>
+ </li>
+ <li><span id="result_box" lang="es"><span class="hps">Guarde los archivos</span> <span class="hps">y</span> <span class="hps">actualizar el navegador</span> <span class="hps">para ver el resultado</span><span>:</span></span>
+  <table style="border: 2px outset #36b; padding: 1em;">
+   <tbody>
+    <tr>
+     <td style="font-style: italic;"><strong style="color: orange;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
+    </tr>
+    <tr>
+     <td><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
+    </tr>
+   </tbody>
+  </table>
+
+  <p><span id="result_box" lang="es"><span class="hps alt-edited">Puede intentar</span> <span class="hps">reordenar las</span> <span class="hps">líneas</span> <span class="hps">en el archivo</span> <span class="hps">CSS</span> <span class="hps alt-edited">de mostrar</span> <span class="hps alt-edited">de que el orden</span> <span class="hps alt-edited">no efecta.</span></span></p>
+
+  <p><span id="result_box" lang="es"><span class="hps">Los</span> <span class="hps">selectores de <code>class</code></span></span><strong><em><code>.carrot</code></em></strong> and <em><strong><code>.spinach</code></strong></em> <span id="result_box" lang="es"><span class="hps">tienen prioridad sobre</span> <span class="hps">el selector de etiquetas</span></span> <em><strong><code>strong</code></strong></em>.</p>
+
+  <p>El <strong><code><em>ID </em></code></strong>selector<code> #<em>first</em></code><em> </em><span id="result_box" lang="es"><span class="hps">tiene prioridad sobre</span> <span class="hps">los</span> <span class="hps">selectores de clase</span> <span class="hps">y</span> <span class="hps">etiqueta</span><span>.</span></span></p>
+ </li>
+</ol>
+
+<div class="tuto_example">
+<div class="tuto_type"><span class="short_text" id="result_box" lang="es"><span class="hps">Desafíos</span></span></div>
+
+<ol>
+ <li><span id="result_box" lang="es"><span class="hps">Sin cambiar</span> <span class="hps">su archivo</span> <span class="hps">HTML</span><span>,</span> <span class="hps alt-edited">agregue una sola</span> <span class="hps">regla para</span> <span class="hps">su archivo</span> <span class="hps">CSS</span> <span class="hps alt-edited">que mantenga</span> <span class="hps">todas las letras</span> <span class="hps">iniciales que</span> <span class="hps">mismo color que</span> <span class="hps">están ahora,</span> <span class="hps">pero</span> <span class="hps alt-edited">hace que</span> <span class="hps">todo el</span> <span class="hps">otro texto</span> <span class="hps">en el segundo párrafo</span> <span class="hps alt-edited">sea azul</span><span>:</span></span>
+
+  <table style="border: 2px outset #36b; padding: 1em; background-color: white;">
+   <tbody>
+    <tr>
+     <td style="font-style: italic;"><strong style="color: orange;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
+    </tr>
+    <tr>
+     <td style="color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
+    </tr>
+   </tbody>
+  </table>
+ </li>
+ <li><span id="result_box" lang="es"><span class="hps alt-edited">Ahora cambie</span> <span class="hps">la regla</span> <span class="hps">que acaba de agregar</span> <span class="hps atn">(</span><span>sin cambiar nada más</span><span>)</span><span>,</span> <span class="hps">para hacer</span> <span class="hps alt-edited">que el primer párrafo</span> <span class="hps alt-edited">sea azul</span> <span class="hps">también</span><span>:</span></span>
+  <table style="border: 2px outset #36b; padding: 1em; background-color: white;">
+   <tbody>
+    <tr>
+     <td style="font-style: italic; color: blue;"><strong style="color: orange;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
+    </tr>
+    <tr>
+     <td style="color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
+    </tr>
+   </tbody>
+  </table>
+ </li>
+</ol>
+
+<div class="tuto_details" id="tutochallenge">
+<div class="tuto_type">Possible solution</div>
+
+<ol>
+ <li>Add a rule with an ID selector of <code>#second</code> and a declaration <code>color: blue;</code>, as shown below:
+
+  <pre class="brush: css">#second { color: blue; }
+</pre>
+  A more specific selector, <code>p#second</code> also works.</li>
+ <li>Change the selector of the new rule to be a tag selector using <code>p</code>:
+  <pre class="brush: css">p { color: blue; }
+</pre>
+ </li>
+</ol>
+<a class="hideAnswer" href="#challenge">Hide solution</a></div>
+<a href="#tutochallenge" title="Display a possible solution for the challenge">See a solution for the challenge.</a></div>
+
+<h2 id="Action_Using_pseudo-classes_selectors">Action: Using pseudo-classes selectors</h2>
+
+<ol>
+ <li><span class="short_text" id="result_box" lang="es"><span class="hps alt-edited">Cree un</span> <span class="hps alt-edited">HTML como el siguiente</span><span>:</span></span>
+
+  <pre class="brush: html">&lt;!doctype html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+  &lt;meta charset="UTF-8"&gt;
+  &lt;title&gt;Sample document&lt;/title&gt;
+  &lt;link rel="stylesheet" href="style1.css"&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;p&gt;Go to our &lt;a class="homepage" href="http://www.example.com/" title="Home page"&gt;Home page&lt;/a&gt;.&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+ </li>
+ <li><span id="result_box" lang="es"><span class="hps">Ahora edite</span> <span class="hps">su archivo</span> <span class="hps">CSS</span><span>.</span> <span class="hps alt-edited">Reemplace todo el contenido</span> <span class="hps">con</span><span>:</span></span>
+  <pre class="brush: css">a.homepage:link, a.homepage:visited {
+  padding: 1px 10px 1px 10px;
+  color: #fff;
+  background: #555;
+  border-radius: 3px;
+  border: 1px outset rgba(50,50,50,.5);
+  font-family: georgia, serif;
+  font-size: 14px;
+  font-style: italic;
+  text-decoration: none;
+}
+
+a.homepage:hover, a.homepage:focus, a.homepage:active {
+  background-color: #666;
+}
+</pre>
+ </li>
+ <li><span id="result_box" lang="es"><span class="hps">Guarde los archivos</span> <span class="hps">y</span> <span class="hps alt-edited">actualice el explorador</span> <span class="hps">para ver el resultado</span> <span class="hps atn">(</span><span>poner</span> <span class="hps">el ratón sobre el</span> <span class="hps">siguiente enlace para ver</span> <span class="hps">el efecto</span><span>)</span><span>:</span></span>
+  <table style="border: 2px outset #36b; padding: 1em;">
+   <tbody>
+    <tr>
+     <td>Go to our <a class="tutospecial" href="#" title="Home page">Home page</a><span style="display: none;"> </span><span style="display: none;"> </span></td>
+    </tr>
+   </tbody>
+  </table>
+ </li>
+</ol>
+
+<h2 id="Acción_Uso_de_selectores_basados_en_las_relaciones_y_pseudo-clases"><span id="result_box" lang="es"><span class="hps">Acción</span><span>: Uso de</span> <span class="hps">selectores</span> <span class="hps">basados</span> <span class="hps">en las relaciones y</span> <span class="hps">pseudo-clases</span></span></h2>
+
+<p><span id="result_box" lang="es"><span class="hps">Con</span> <span class="hps">selectores</span> <span class="hps">basados</span> <span class="hps">en las relaciones y</span> <span class="hps">pseudo-clases</span> <span class="hps">puede crear</span> <span class="hps">algoritmos </span></span><span id="result_box" lang="es"><span class="hps">complejos</span></span><span id="result_box" lang="es"> en <span class="hps alt-edited">cascada</span> <span class="hps">.</span> <span class="hps">Esto es una técnica</span> <span class="hps">común que se utiliza</span><span>, por ejemplo,</span> <span class="hps">con el fin de</span> <span class="hps">crear menús</span> <span class="hps">desplegables</span> <span class="hps">en </span></span><span id="result_box" lang="es"><span class="hps">puro</span> </span><span id="result_box" lang="es"><span class="hps">CSS</span> <span class="hps">(es decir</span> <span class="hps">sólo</span> <span class="hps">CSS,</span> <span class="hps">sin necesidad de utilizar</span></span> <a href="/en-US/docs/Web/JavaScript" title="en-US/docs/Web/JavaScript">JavaScript</a>). <span id="result_box" lang="es"><span class="hps">La esencia</span> <span class="hps">de esta técnica es</span> <span class="hps">la creación de</span> <span class="hps">una regla como</span> <span class="hps">la siguiente</span><span>:</span></span></p>
+
+<pre class="brush: css">div.menu-bar ul ul {
+  display: none;
+}
+
+div.menu-bar li:hover &gt; ul {
+  display: block;
+}</pre>
+
+<p><span id="result_box" lang="es"><span class="hps alt-edited">Aplicararemos a</span> <span class="hps">una estructura de</span> <span class="hps alt-edited">HTML como el siguiente</span><span>:</span></span></p>
+
+<pre class="brush: html">&lt;div class="menu-bar"&gt;
+  &lt;ul&gt;
+    &lt;li&gt;
+      &lt;a href="example.html"&gt;Menu&lt;/a&gt;
+      &lt;ul&gt;
+        &lt;li&gt;
+          &lt;a href="example.html"&gt;Link&lt;/a&gt;
+        &lt;/li&gt;
+        &lt;li&gt;
+          &lt;a class="menu-nav" href="example.html"&gt;Submenu&lt;/a&gt;
+          &lt;ul&gt;
+            &lt;li&gt;
+              &lt;a class="menu-nav" href="example.html"&gt;Submenu&lt;/a&gt;
+              &lt;ul&gt;
+                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
+                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
+                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
+                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
+              &lt;/ul&gt;
+            &lt;/li&gt;
+            &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
+          &lt;/ul&gt;
+        &lt;/li&gt;
+      &lt;/ul&gt;
+    &lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/div&gt;
+</pre>
+
+<p><span id="result_box" lang="es"><span class="hps">Vea nuestro</span> <span class="hps">ejemplo completo</span></span><a class="internal" href="https://mdn.mozillademos.org/files/3700/css_dropdown_menu.html" title="css_dropdown_menu.html">CSS-based dropdown menu example</a> <span id="result_box" lang="es"><span class="hps">para una posible</span> referencia<span>.</span></span></p>
+
+<h2 id="¿Y_ahora_qué"><span id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
+
+<p><span id="result_box" lang="es"><span class="hps">Su</span> <span class="hps alt-edited">hoja de estilos</span> <span class="hps alt-edited">de muestra</span> <span class="hps">está empezando a parecer</span> <span class="hps alt-edited">densa</span> <span class="hps alt-edited">y complicada.</span> <span class="hps">La</span> <span class="hps">siguiente sección</span> <span class="hps">describe</span> <span class="hps">maneras de hacer</span> <span class="hps">CSS</span> <span class="hps">más fácil de leer</span><span>.</span> </span> <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS" title="/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS">easier to read</a>.{{nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS", "Readable CSS")}}</p>
diff --git a/files/es/conflicting/learn/css/building_blocks/values_and_units/index.html b/files/es/conflicting/learn/css/building_blocks/values_and_units/index.html
new file mode 100644
index 0000000000..79b7ac23cb
--- /dev/null
+++ b/files/es/conflicting/learn/css/building_blocks/values_and_units/index.html
@@ -0,0 +1,365 @@
+---
+title: Color
+slug: conflicting/Learn/CSS/Building_blocks/Values_and_units
+translation_of: Learn/CSS/Introduction_to_CSS/Values_and_units#Colors
+translation_of_original: Web/Guide/CSS/Getting_started/Color
+original_slug: Web/CSS/Introducción/Color
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p><a class="button previousPage" href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Text_styles" rel="prev" style="margin: 0px 20px 20px 0px; padding: 5px 11px; border: 0px; color: rgb(77, 78, 83); text-decoration: none; cursor: pointer; display: inline-block; line-height: 1; font-weight: normal; letter-spacing: normal; text-transform: uppercase; border-radius: 4px; box-shadow: rgb(187, 191, 194) 0px -1px inset; float: left; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; white-space: normal; background-color: rgb(234, 239, 242);" title="Los estilos de texto"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">IR A LA SECCIÓN ANTERIOR: </span></font></font><br>
+ <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">LOS ESTILOS DE TEXTO</span></font></font></a></p>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Esta es la sección octava de la </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="es-es / docs / Web / guía / CSS / Primeros pasos"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS Introducción</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">tutorial; </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">se explica cómo puede especificar el color en CSS. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En su hoja de estilos de muestra, se introduce colores de fondo.</span></font></font></p>
+
+<h2 class="clearLeft" id="Información_Color" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 700; font-family: 'Open Sans', sans-serif; line-height: 30px; font-size: 2.14285714285714rem; letter-spacing: -1px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Información: Color</span></font></font></h2>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En este tutorial hasta ahora, se ha utilizado un número limitado de colores con nombre. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS 2 soporta 17 colores con nombre absoluto. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Algunos de los nombres puede que no sea el esperado:</span></font></font></p>
+
+<table style="border: 0px; margin-left: 2em; text-align: right;">
+ <tbody>
+  <tr>
+   <td> </td>
+   <td>black</td>
+   <td style="width: 2em; height: 2em; background-color: black;"> </td>
+   <td>gray</td>
+   <td style="width: 2em; height: 2em; background-color: gray;"> </td>
+   <td>silver</td>
+   <td style="width: 2em; height: 2em; background-color: silver;"> </td>
+   <td>white</td>
+   <td style="width: 2em; height: 2em; background-color: white; border: 1px dotted gray;"> </td>
+  </tr>
+  <tr>
+   <td>primaries</td>
+   <td>red</td>
+   <td style="width: 2em; height: 2em; background-color: red;"> </td>
+   <td>lime</td>
+   <td style="width: 2em; height: 2em; background-color: lime;"> </td>
+   <td>blue</td>
+   <td style="width: 2em; height: 2em; background-color: blue;"> </td>
+  </tr>
+  <tr>
+   <td>secondaries</td>
+   <td>yellow</td>
+   <td style="width: 2em; height: 2em; background-color: yellow;"> </td>
+   <td>aqua</td>
+   <td style="width: 2em; height: 2em; background-color: aqua;"> </td>
+   <td>fuchsia</td>
+   <td style="width: 2em; height: 2em; background-color: fuchsia;"> </td>
+  </tr>
+  <tr>
+   <td> </td>
+   <td>maroon</td>
+   <td style="width: 2em; height: 2em; background-color: maroon;"> </td>
+   <td>orange</td>
+   <td style="width: 2em; height: 2em; background-color: orange;"> </td>
+   <td>olive</td>
+   <td style="width: 2em; height: 2em; background-color: olive;"> </td>
+   <td>purple</td>
+   <td style="width: 2em; height: 2em; background-color: purple;"> </td>
+   <td>green</td>
+   <td style="width: 2em; height: 2em; background-color: green;"> </td>
+   <td>navy</td>
+   <td style="width: 2em; height: 2em; background-color: navy;"> </td>
+   <td>teal</td>
+   <td style="width: 2em; height: 2em; background-color: teal;"> </td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<div class="tuto_details">
+<div class="tuto_type">
+<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Detalles</span></font></font></div>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Su navegador puede soportar muchos más colores con nombre, como:</span></font></font></p>
+</div>
+
+<table style="border: 0px; margin: .5em 0px .5em 2em; text-align: right; background-color: inherit;">
+ <tbody>
+  <tr>
+   <td>dodgerblue</td>
+   <td style="width: 2em; height: 2em; background-color: dodgerblue;"> </td>
+   <td>peachpuff</td>
+   <td style="width: 2em; height: 2em; background-color: peachpuff;"> </td>
+   <td>tan</td>
+   <td style="width: 2em; height: 2em; background-color: tan;"> </td>
+   <td>firebrick</td>
+   <td style="width: 2em; height: 2em; background-color: firebrick;"> </td>
+   <td>aquamarine</td>
+   <td style="width: 2em; height: 2em; background-color: aquamarine;"> </td>
+  </tr>
+ </tbody>
+</table>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para detalles de esta lista ampliada, consulte: </span></font></font><a class="external external-icon" href="http://www.w3.org/TR/2003/CR-css3-color-20030514/#svg-color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; white-space: pre-line; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; background-color: rgb(244, 244, 244);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">SVG palabras clave de color</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> en el </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">módulo de colores </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS 3 . </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Tenga cuidado con el uso de nombres de colores;puede que algunos de sus lectores de navegación no lo soporte.</span></font></font></p>
+</div>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para una paleta más grande, especificar los componentes rojo, verde y azul del color que desee, utilizando el signo numerico (hash) y tres </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">dígitos  </span></font></font><em><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">hexadecimales</span></font></font></em><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> entre los rangos  0 - 9, a - f. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Las letras a - f representan los valores de 10 a 15:</span></font></font></p>
+
+<table style="border: 0px; margin-left: 2em;">
+ <tbody>
+  <tr>
+   <td>black</td>
+   <td style="width: 2em; height: 2em; background-color: #000;"> </td>
+   <td><code>#000</code></td>
+  </tr>
+  <tr>
+   <td>pure red</td>
+   <td style="width: 2em; height: 2em; background-color: #f00;"> </td>
+   <td><code>#f00</code></td>
+  </tr>
+  <tr>
+   <td>pure green</td>
+   <td style="width: 2em; height: 2em; background-color: #0f0;"> </td>
+   <td><code>#0f0</code></td>
+  </tr>
+  <tr>
+   <td>pure blue</td>
+   <td style="width: 2em; height: 2em; background-color: #00f;"> </td>
+   <td><code>#00f</code></td>
+  </tr>
+  <tr>
+   <td>white</td>
+   <td style="width: 2em; height: 2em; background-color: #fff; border: 1px dotted gray;"> </td>
+   <td><code>#fff</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p><br>
+ <span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">Para toda la paleta, especificar dos dígitos hexadecimales para cada componente:</span></p>
+
+<table style="border: 0px; margin-left: 2em;">
+ <tbody>
+  <tr>
+   <td>black</td>
+   <td style="width: 2em; height: 2em; background-color: #000;"> </td>
+   <td><code>#000000</code></td>
+  </tr>
+  <tr>
+   <td>pure red</td>
+   <td style="width: 2em; height: 2em; background-color: #f00;"> </td>
+   <td><code>#ff0000</code></td>
+  </tr>
+  <tr>
+   <td>pure green</td>
+   <td style="width: 2em; height: 2em; background-color: #0f0;"> </td>
+   <td><code>#00ff00</code></td>
+  </tr>
+  <tr>
+   <td>pure blue</td>
+   <td style="width: 2em; height: 2em; background-color: #00f;"> </td>
+   <td><code>#0000ff</code></td>
+  </tr>
+  <tr>
+   <td>white</td>
+   <td style="width: 2em; height: 2em; background-color: #fff; border: 1px dotted gray;"> </td>
+   <td><code>#ffffff</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">Generalmente, usted puede obtener estos códigos hexadecimales de seis dígitos de su programa de gráficos o alguna otra herramienta.</span></p>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ejemplo</span></font></font></div>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Con un poco de práctica, puede ajustar los colores de tres dígitos de forma manual para la mayoría de los propósitos:</span></font></font></p>
+</div>
+
+<table style="border: 0px; margin-left: 2em; background-color: #fffff4;">
+ <tbody>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Comience con el rojo puro:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #f00;"> </td>
+   <td><code>#f00</code></td>
+  </tr>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(201, 215, 241);">Para que sea más pálido, añadir un poco de verde y azul:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #f77;"> </td>
+   <td><code>#f77</code></td>
+  </tr>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para hacerlo más naranja, añadir un poco de verde adicional:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #fa7;"> </td>
+   <td><code>#fa7</code></td>
+  </tr>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para oscurecer, reducir todos sus componentes:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #c74;"> </td>
+   <td><code>#c74</code></td>
+  </tr>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para reducir su saturación, hacer que sus componentes más iguales:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #c98;"> </td>
+   <td><code>#c98</code></td>
+  </tr>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Si usted los pone exactamente iguales, se obtiene gris:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #ccc;"> </td>
+   <td><code>#ccc</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para un tono pastel como el azul pálido:</span></p>
+
+<table style="border: 0px; margin-left: 2em; background-color: #fffff4;">
+ <tbody>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Comience con blanco puro:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #fff; border: 1px dotted gray;"> </td>
+   <td><code>#fff</code></td>
+  </tr>
+  <tr>
+   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Reducir los otros componentes un poco:</span></td>
+   <td style="width: 2em; height: 2em; background-color: #eef; border: 1px dotted gray;"> </td>
+   <td><code>#eef</code></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type">
+<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Más detalles</span></font></font></div>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">También puede especificar un color mediante los valores RGB decimales en el rango de 0 - 255, o porcentajes.</span></font></font></p>
+
+<p><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(244, 244, 244);">Por ejemplo, este es de color granate (rojo oscuro)</span>dark red:</p>
+</div>
+
+<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token function" style="margin: 0px; padding: 0px; border: 0px; color: rgb(221, 74, 104);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">RGB</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> (128, 0, 0)</span></font></font></code></pre>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para más detalles sobre cómo especificar los colores, ver: </span></font></font><a class="external external-icon" href="http://www.w3.org/TR/CSS21/syndata.html#color-units" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; white-space: pre-line; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; background-color: rgb(244, 244, 244);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Colores</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> en la Especificación CSS.</span></font></font></p>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para obtener información sobre la adecuación de los colores del sistema como Menú y ThreeDFace, véase: </span></font></font><a class="external external-icon" href="http://www.w3.org/TR/CSS21/ui.html#system-colors" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; white-space: pre-line; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; background-color: rgb(244, 244, 244);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Sistema CSS2 Colores</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> en la Especificación CSS.</span></font></font></p>
+</div>
+
+<h3 id="Propiedades_de_Color" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 200; font-family: 'Open Sans', sans-serif; line-height: 24px; font-size: 1.71428571428571rem; letter-spacing: -0.5px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Propiedades de Color</span></font></font></h3>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ya ha utilizado </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">la propiedad</span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> color</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">  en el texto.</span></font></font></p>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">También puede utilizar <code>la</code></span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> propiedad </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"><code> </code></span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/background-color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">background-color</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> para cambiar fondos elementos.</span></font></font></p>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Los Fondos (</span></font></font><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">Backgrounds </span>) <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">se pueden establecer en </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">transparent</span></code><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"> (transparentes) </span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">para eliminar explícitamente cualquier color, revelando fondo del elemento padre.</span></font></font></p>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ejemplo</span></font></font></div>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Los </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">ejemplos de</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> cajas de este tutorial utilizan este fondo de color amarillo pálido:</span></font></font></p>
+
+<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token property" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 0, 85);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">background-color </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">:</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> # fffff4 </span></font></font><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">;</span></font></font></span></code></pre>
+
+<div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 0px; background: 0px 0px;"> </div>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Los </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Más detalles</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> cajas utilizan este gris pálido:</span></font></font></p>
+
+<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token property" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 0, 85);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">background-color </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">:</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> # F4F4F4 </span></font></font><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">;</span></font></font></span></code></pre>
+</div>
+</div>
+
+<p> </p>
+
+<h2 id="Acción_El_uso_de_códigos_de_color" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 700; font-family: 'Open Sans', sans-serif; line-height: 30px; font-size: 2.14285714285714rem; letter-spacing: -1px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Acción: El uso de códigos de color</span></font></font></h2>
+
+<ol style="margin: 0px 0px 24px; padding: 0px 0px 0px 40px; border: 0px; list-style-type: decimal; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);">
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Edite su archivo CSS.</span></font></font></li>
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Hacer el cambio se muestra aquí en negrita, para dar las letras iniciales un fondo azul claro. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">(La disposición y comentarios en el archivo probablemente difieren del archivo que se muestra aquí. Mantenga la disposición y los comentarios de la forma que prefiera.)</span></font></font>
+  <pre class="brush:css;highlight:[13]  language-css"><code class="language-css"><span class="token comment">/*** CSS Tutorial: Color page ***/</span>
+
+<span class="token comment">/* page font */</span>
+<span class="token selector">body </span><span class="token punctuation">{</span><span class="token property">font</span><span class="token punctuation">:</span> 16px <span class="token string">"Comic Sans MS"</span>, cursive<span class="token punctuation">;</span><span class="token punctuation">}</span>
+
+<span class="token comment">/* paragraphs */</span>
+<span class="token selector">p </span><span class="token punctuation">{</span><span class="token property">color</span><span class="token punctuation">:</span> blue<span class="token punctuation">;</span><span class="token punctuation">}</span>
+<span class="token selector">#first </span><span class="token punctuation">{</span><span class="token property">font-style</span><span class="token punctuation">:</span> italic<span class="token punctuation">;</span><span class="token punctuation">}</span>
+
+<span class="token comment">/* initial letters */</span>
+<span class="token selector">strong </span><span class="token punctuation">{</span>
+  <span class="token property">color</span><span class="token punctuation">:</span> red<span class="token punctuation">;</span>
+  <span class="token property">background-color</span><span class="token punctuation">:</span> #ddf<span class="token punctuation">;</span>
+  <span class="token property">font</span><span class="token punctuation">:</span> 200% serif<span class="token punctuation">;</span>
+  <span class="token punctuation">}</span>
+
+<span class="token selector">.carrot </span><span class="token punctuation">{</span><span class="token property">color</span><span class="token punctuation">:</span> red<span class="token punctuation">;</span><span class="token punctuation">}</span>
+<span class="token selector">.spinach </span><span class="token punctuation">{</span><span class="token property">color</span><span class="token punctuation">:</span> green<span class="token punctuation">;</span><span class="token punctuation">}</span></code></pre>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 0px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 19px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 38px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 57px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 76px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 95px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 114px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 133px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 152px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 171px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 190px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 209px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 228px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 247px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 266px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 285px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 304px; background: 0px 0px;"> </div>
+
+  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 323px; background: 0px 0px;"> </div>
+
+  <div class="line-highlight" style=""> </div>
+ </li>
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Guarde el archivo y actualizar el navegador para ver el resultado.</span></font></font></li>
+</ol>
+
+<table>
+ <tbody>
+  <tr>
+   <td style="font: 16px 'Comic Sans MS', cursive; color: blue;">
+    <table style="margin: 0px 0px 24px; padding: 0px; border-width: 1px 0px 0px 1px; border-style: solid; border-color: rgb(224, 224, 220); border-collapse: collapse; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);">
+     <tbody>
+      <tr style="margin: 0px; padding: 0px; border: 0px;">
+       <td style="margin: 0px; padding: 6px; border-width: 0px 1px 1px 0px; border-style: solid; border-color: rgb(224, 224, 220); text-align: left; font-style: italic; font-variant: normal; font-weight: normal; font-size: 16px; line-height: normal; font-family: 'Comic Sans MS', cursive; color: blue;"><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>C</font></font></strong><font><font> ascading </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: green; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> tyle </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: green; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> heets</font></font></td>
+      </tr>
+      <tr style="margin: 0px; padding: 0px; border: 0px;">
+       <td style="margin: 0px; padding: 6px; border-width: 0px 1px 1px 0px; border-style: solid; border-color: rgb(224, 224, 220); text-align: left; font-style: normal; font-variant: normal; font-weight: normal; font-size: 16px; line-height: normal; font-family: 'Comic Sans MS', cursive; color: blue;"><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>C</font></font></strong><font><font> ascading </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> tyle </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> heets</font></font></td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Desafío</span></font></font></div>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En el archivo CSS, cambiara todos los nombres de los colores a los códigos de color de 3 dígitos sin afectar el resultado.</span></font></font></p>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">(Esto no se puede hacer exactamente, pero usted puede conseguir cerca. Para hacerlo exactamente lo que necesita códigos de 6 dígitos, y hay que buscar la especificación CSS o utilizar una herramienta gráfica para que coincida con los colores.)</span></font></font></p>
+<a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Color#tutochallenge" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-size: 12px; text-align: right; display: block; font-family: 'Open Sans', sans-serif; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; white-space: normal;" title="Mostrar una posible solución para el desafío"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver una solución para el desafío.</span></font></font></a></div>
+</div>
+
+<h2 id="¿Y_ahora_qué" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 700; font-family: 'Open Sans', sans-serif; line-height: 30px; font-size: 2.14285714285714rem; letter-spacing: -1px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">¿Y ahora qué?</span></font></font></h2>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><a class="button nextPage" href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Content" rel="next" style="margin: 20px 0px 0px 20px; padding: 5px 11px; border: 0px; color: rgb(77, 78, 83); text-decoration: none; cursor: pointer; display: inline-block; line-height: 1; font-weight: 400; letter-spacing: normal; text-transform: uppercase; border-radius: 4px; box-shadow: rgb(187, 191, 194) 0px -1px inset; float: right; background-color: rgb(234, 239, 242);" title="Contenido"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">IR A LA SIGUIENTE SECCIÓN: </span></font></font><br>
+ <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CONTENT</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En su documento de muestra y el contenido de su hoja de estilo muestra estrictamente separados los estilo.</span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">La </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Content" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title="/ En-US / docs / Web / guía / CSS / Getting_Started / contenido"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">siguiente sección</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> explica cómo se puede hacer excepciones a esta estricta separación.</span></font></font></p>
diff --git a/files/es/conflicting/learn/css/css_layout/index.html b/files/es/conflicting/learn/css/css_layout/index.html
new file mode 100644
index 0000000000..86364b84fa
--- /dev/null
+++ b/files/es/conflicting/learn/css/css_layout/index.html
@@ -0,0 +1,385 @@
+---
+title: Layout
+slug: conflicting/Learn/CSS/CSS_layout
+translation_of: Learn/CSS/CSS_layout
+translation_of_original: Web/Guide/CSS/Getting_started/Layout
+original_slug: Web/CSS/Introducción/Layout
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Boxes", "Boxes")}}Esta es la 12ª sección del tutorial CSS Getting Started; Describe algunas maneras de ajustar el diseño de su documento. Cambia el diseño de su documento de ejemplo.</p>
+
+<h2 class="clearLeft" id="Informacion_Layout">Informacion: Layout</h2>
+
+<p>Puede utilizar CSS para especificar varios efectos visuales que cambian el diseño de su documento. Algunas de las técnicas para especificar el diseño son avanzadas, y más allá del alcance de este tutorial básico.</p>
+
+<p>Cuando diseña un diseño para que se vea similar en muchos navegadores, su hoja de estilo interactúa con la hoja de estilo y el motor de diseño predeterminados del navegador de formas que pueden ser complejas. Este es también un tema avanzado, más allá del alcance de este tutorial básico.</p>
+
+<p>Esta página describe algunas técnicas sencillas que puedes probar.</p>
+
+<h3 id="Estructura_del_documento">Estructura del documento</h3>
+
+<p>Si desea controlar el diseño de su documento, es posible que deba cambiar su estructura.</p>
+
+<p>El lenguaje de marcado del documento puede tener etiquetas de propósito general para crear la estructura. Por ejemplo, en HTML puede utilizar el elemento {{HTMLElement ('div')}} para crear una estructura.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<p>Ejemplo</p>
+
+<p>En su documento de ejemplo, los párrafos numerados en el segundo encabezado no tienen un contenedor propio.</p>
+
+<p>Su hoja de estilo no puede dibujar un borde alrededor de esos párrafos, porque no hay ningún elemento que especificar en el selector.</p>
+
+<p>Para solucionar este problema estructural, puede agregar una etiqueta {{HTMLElement ('div')}} alrededor de los párrafos. Esta etiqueta es única, por lo que puede identificarse con un atributo id:</p>
+</div>
+
+<pre class="brush:html;highlight:[2,8]">&lt;h3&gt;Numbered paragraphs&lt;/h3&gt;
+&lt;div id="numbered"&gt;
+  &lt;p&gt;Lorem ipsum&lt;/p&gt;
+  &lt;p&gt;Dolor sit&lt;/p&gt;
+  &lt;p&gt;Amet consectetuer&lt;/p&gt;
+  &lt;p&gt;Magna aliquam&lt;/p&gt;
+  &lt;p&gt;Autem veleum&lt;/p&gt;
+&lt;/div&gt;
+</pre>
+
+<p>Ahora su hoja de estilos puede utilizar una regla para especificar bordes alrededor de ambas listas:</p>
+
+<pre class="brush:css">ul, #numbered {
+  border: 1em solid #69b;
+  padding-right:1em;
+}
+</pre>
+
+<p>  El resultado se ve así: </p>
+
+<table style="background-color: white; border: 2px outset #3366bb; padding: 1em; width: 30em;">
+ <tbody>
+  <tr>
+   <td>
+    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
+
+    <div style="border: 12px solid #69b; margin-bottom: 16px; padding: 1em;">
+    <ul style="">
+     <li>Arctic</li>
+     <li>Atlantic</li>
+     <li>Pacific</li>
+     <li>Indian</li>
+     <li>Southern</li>
+    </ul>
+    </div>
+
+    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
+
+    <div style="border: 12px solid #69b; margin-bottom: 8px; padding: 0px 12em 0px .5em;">
+    <p><strong>1: </strong>Lorem ipsum</p>
+
+    <p><strong>2: </strong>Dolor sit</p>
+
+    <p><strong>3: </strong>Amet consectetuer</p>
+
+    <p><strong>4: </strong>Magna aliquam</p>
+
+    <p><strong>5: </strong>Autem veleum</p>
+    </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Unidades_de_tamaño">Unidades de tamaño</h3>
+
+<p>Hasta ahora en este tutorial, se han especificado tamaños en píxeles (px). Estos son apropiados para algunos propósitos en un dispositivo de visualización como una pantalla de computadora. Pero cuando el usuario cambia el tamaño de fuente, su diseño puede parecer incorrecto.</p>
+
+<p>Para muchos propósitos es mejor especificar tamaños como un porcentaje o en ems (em). Un em es nominalmente el tamaño de la fuente actual (el ancho de una letra m). Cuando el usuario cambia el tamaño de fuente, su diseño se ajusta automáticamente.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<p>Ejemplo</p>
+
+<p>El borde a la izquierda de este texto tiene su tamaño especificado en píxeles.</p>
+
+<p>El borde de la derecha tiene su tamaño especificado en ems.</p>
+
+<p>En su navegador, cambie el tamaño de la fuente para ver cómo se ajusta el borde de la derecha pero el borde de la izquierda no:</p>
+</div>
+
+<table style="background-color: white; border: 2px outset #3366bb; padding: 1em;">
+ <tbody>
+  <tr>
+   <td>
+    <div style="">RESIZE ME PLEASE</div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type">
+<p>Más detalles</p>
+
+<p>Para otros dispositivos, otras unidades de longitud son apropiadas.</p>
+
+<p>Hay más información sobre esto en una página posterior de este tutorial.</p>
+
+<p>Para obtener detalles completos de los valores y unidades que puede utilizar, consulte Valores en la especificación CSS.</p>
+</div>
+</div>
+
+<h3 id="Diseño_del_texto">Diseño del texto</h3>
+
+<p>Dos propiedades especifican cómo está alineado el contenido de un elemento. Puede usarlos para ajustes sencillos de diseño:</p>
+
+<p>{{Cssxref ('text-align')}}</p>
+
+<p><br>
+   Alinea el contenido. Utilice uno de estos valores: izquierda, derecha, centro, justificar<br>
+ {{Cssxref ('texto-sangría')}}<br>
+     Indente el contenido en una cantidad que especifique.</p>
+
+<p>Estas propiedades se aplican a cualquier contenido similar al texto del elemento, no sólo al texto real. Recuerde que son heredados por los hijos del elemento, por lo que es posible que tenga que desactivarlos explícitamente en los niños para evitar resultados sorprendentes.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<p>Ejemplo</p>
+
+<p>Para centrar los títulos:</p>
+</div>
+
+<pre class="brush:css">h3 {
+  border-top: 1px solid gray;
+  text-align: center;
+}
+</pre>
+
+<p>Resultado:</p>
+
+<table style="background-color: white; border: 2px outset #3366bb; padding: 1em; width: 30em;">
+ <tbody>
+  <tr>
+   <td>
+    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray; text-align: center;">(A) The oceans</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>En un documento HTML, el contenido que ve debajo de un encabezado no está estructuralmente contenido por el encabezado. Así que cuando alineas un encabezado como este, las etiquetas debajo del encabezado no heredan el estilo.</p>
+</div>
+
+<h3 id="Floats">Floats</h3>
+
+<p>La propiedad {{cssxref ('float')}} fuerza un elemento a la izquierda oa la derecha. Esta es una forma sencilla de controlar su posición y tamaño.</p>
+
+<p>El resto del contenido del documento fluye normalmente alrededor del elemento flotante. Puede controlar esto usando la propiedad {{cssxref ('clear')}} en otros elementos para hacerlos permanecer alejados de los flotadores.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<p>Ejemplo</p>
+
+<p>En el documento de ejemplo, las listas se extienden por la ventana. Puede evitarlo flotando hacia la izquierda.</p>
+
+<p>Para mantener los encabezados en su lugar, también debe especificar que se mantengan alejados de los flotadores a su izquierda:</p>
+</div>
+
+<pre class="brush:css">ul, #numbered {float: left;}
+h3 {clear: left;}
+</pre>
+</div>
+
+<p>El resultado sería:</p>
+
+<table style="background-color: white; border: 2px outset #3366bb; padding: 1em; width: 30em;">
+ <tbody>
+  <tr>
+   <td>
+    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
+
+    <div style="float: left; border: 12px solid #69b; margin-bottom: 16px; padding-left: 1em;">
+    <ul style="">
+     <li>Arctic</li>
+     <li>Atlantic</li>
+     <li>Pacific</li>
+     <li>Indian</li>
+     <li>Southern</li>
+    </ul>
+    </div>
+
+    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
+
+    <div style="float: left; border: 12px solid #69b; margin-bottom: 8px; padding-left: .5em;">
+    <p><strong>1: </strong>Lorem ipsum</p>
+
+    <p><strong>2: </strong>Dolor sit</p>
+
+    <p><strong>3: </strong>Amet consectetuer</p>
+
+    <p><strong>4: </strong>Magna aliquam</p>
+
+    <p><strong>5: </strong>Autem veleum</p>
+    </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>(Un poco de relleno es necesario a la derecha de las cajas, donde el borde es demasiado cerca del texto.)</p>
+
+<h3 id="Posicionamiento">Posicionamiento</h3>
+
+<p>Puede especificar la posición de un elemento de cuatro formas especificando la propiedad {{cssxref ('position')}} y uno de los siguientes valores.</p>
+
+<p>Estas son propiedades avanzadas. Es posible utilizarlos de manera sencilla, por eso se mencionan en este tutorial básico. Pero puede ser difícil usarlos para diseños complejos.</p>
+
+<p>relativo</p>
+
+<p><br>
+   La posición del elemento se desplaza en relación con su posición normal. Utilícelo para desplazar un elemento por una cantidad especificada. A veces se puede utilizar el margen del elemento para lograr el mismo efecto.<br>
+ fijo<br>
+     La posición del elemento es fija. Especifique la posición del elemento en relación con la ventana del documento. Incluso si el resto del documento se desplaza, el elemento permanece fijo.<br>
+ absoluto<br>
+     La posición del elemento es fija con relación a un elemento padre. Sólo un padre que está posicionado con relativo, fijo o absoluto hará. Puede hacer que cualquier elemento padre sea adecuado especificando position: relative; Para ello sin especificar ningún cambio.<br>
+ estático<br>
+     El valor por defecto. Utilice este valor si necesita desactivar la posición de forma explícita.</p>
+
+<p>Junto con estos valores de la propiedad de posición (a excepción de estática), especifique una o más de las propiedades: superior, derecha, inferior, izquierda, anchura, altura para identificar dónde desea que aparezca el elemento y tal vez también su tamaño.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<p>Ejemplo</p>
+
+<p>Para colocar dos elementos uno encima del otro, cree un contenedor principal en el documento con los dos elementos dentro de él:</p>
+</div>
+
+<pre class="brush:html">&lt;div id="parent-div"&gt;
+  &lt;p id="forward"&gt;/&lt;/p&gt;
+  &lt;p id="back"&gt;\&lt;/p&gt;
+&lt;/div&gt;
+</pre>
+
+<p>En su hoja de estilos, haga que la posición de los padres sea relativa. No hay necesidad de especificar ningún cambio real. Haga que la posición de los niños sea absoluta:</p>
+
+<pre class="brush:css">#parent-div {
+  position: relative;
+  font: bold 200% sans-serif;
+}
+
+#forward, #back {
+  position: absolute;
+  margin:0px; /* no hay margenes alrededor del elemento */
+  top: 0px; /* distancia desde la parte superior */
+  left: 0px; /* distancia desde la izquierda */
+}
+
+#forward {
+  color: blue;
+}
+
+#back {
+  color: red;
+}
+</pre>
+
+<p>El resultado se ve así, con la barra invertida en la parte superior de la barra inclinada:</p>
+
+<div style="position: relative; left: .33em; font: bold 300% sans-serif;">
+<p style="position: absolute; margin: 0px; top: 0px; left: 0px; color: blue;">/</p>
+
+<p style="position: absolute; margin: 0px; top: 0px; left: 0px; color: red;">\</p>
+</div>
+
+<table style="background-color: white; border: 2px outset #3366bb; height: 5em; padding: 1em; width: 30em;">
+ <tbody>
+  <tr>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type">
+<p>Más detalles</p>
+
+<p>La historia completa sobre posicionamiento toma dos capítulos complejos en la Especificación CSS: Modelo de formato visual y detalles del modelo de formato Visual.</p>
+
+<p>Si está diseñando hojas de estilo para trabajar en muchos navegadores, también debe tener en cuenta las diferencias en la forma en que los navegadores interpretan el estándar y quizás errores en versiones concretas de navegadores particulares.</p>
+</div>
+</div>
+
+<h2 id="Action_Specifying_layout">Action: Specifying layout</h2>
+
+<ol>
+ <li>Cambie el documento de ejemplo, doc2. Html y hoja de estilo, style2. Css, utilizando los ejemplos anteriores en las secciones Estructura de documento y flotantes.</li>
+ <li>En el ejemplo Flotantes, agregue relleno para separar el texto del borde derecho por 0. 5 em.</li>
+</ol>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<p>Cambios</p>
+
+<p>Cambie el documento de ejemplo, doc2. Html, agregando esta etiqueta a ella cerca del final, justo antes de &amp;lt;/ body&amp;gt;.</p>
+</div>
+
+<pre class="brush:html">&lt;img id="fixed-pin" src="Yellow-pin.png" alt="Yellow map pin"&gt;
+</pre>
+
+<p>Si no descargó el archivo de imagen anteriormente en este tutorial, descárguelo ahora y colóquelo en el mismo directorio que los demás archivos de ejemplo:</p>
+
+<table style="border: 2px solid #cccccc;">
+ <tbody>
+  <tr>
+   <td><img alt="Image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Predecir dónde aparecerá la imagen en el documento. A continuación, actualice su navegador para ver si estaba correcto.</p>
+
+<p>Agregue una regla a su hoja de estilos que coloque la imagen en la parte superior derecha de su documento.</p>
+
+<p>Actualiza tu navegador y haz que la ventana sea pequeña. Compruebe que la imagen permanece en la parte superior derecha incluso cuando se desplaza el documento:</p>
+
+<div style="position: relative; width: 29.5em; height: 18em;">
+<div style="overflow: auto; border: 2px outset #36b; padding: 1em; width: 29em; height: 16em; background-color: white;">
+<p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
+
+<div style="float: left; border: 12px solid #69b; margin-bottom: 16px; padding: 0px .5em 0px 1em;">
+<ul style="">
+ <li>Arctic</li>
+ <li>Atlantic</li>
+ <li>Pacific</li>
+ <li>Indian</li>
+ <li>Southern</li>
+</ul>
+</div>
+
+<p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
+
+<div style="float: left; border: 12px solid #69b; padding: 0 .5em 0 .5em;">
+<p><strong>1: </strong>Lorem ipsum</p>
+
+<p><strong>2: </strong>Dolor sit</p>
+
+<p><strong>3: </strong>Amet consectetuer</p>
+
+<p><strong>4: </strong>Magna aliquam</p>
+
+<p><strong>5: </strong>Autem veleum</p>
+</div>
+
+<p style=""> </p>
+
+<div style="position: absolute; top: 2px; right: 0px;"><img alt="Yellow map pin" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"></div>
+</div>
+</div>
+</div>
+
+<p><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Layout" title="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Layout"> See a solution to this challenge.</a></p>
+
+<h2 id="What_next">What next?</h2>
+
+<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Tables", "Tables") }}Usted acaba de cubrir todos los temas en este tutorial básico de CSS. La siguiente página describe selectores más avanzados para reglas CSS y algunas maneras específicas en las que puede diseñar tablas.</p>
diff --git a/files/es/conflicting/learn/css/first_steps/how_css_works/index.html b/files/es/conflicting/learn/css/first_steps/how_css_works/index.html
new file mode 100644
index 0000000000..831a835c72
--- /dev/null
+++ b/files/es/conflicting/learn/css/first_steps/how_css_works/index.html
@@ -0,0 +1,108 @@
+---
+title: Por que usar CSS
+slug: conflicting/Learn/CSS/First_steps/How_CSS_works
+translation_of: Learn/CSS/First_steps/How_CSS_works
+translation_of_original: Web/Guide/CSS/Getting_started/Why_use_CSS
+original_slug: Web/CSS/Como_iniciar/Por_que_usar_CSS
+---
+<p> </p>
+<p>Esta página explica por qué los documentos usan CSS. Usas CSS para añadir una hoja de estilos a tu documento de prueba.</p>
+<p>Esta es la segunda sección del <a href="/es/CSS/Introducción" title="../../../../es/CSS/Introducci%C3%B3n">tutorial</a>.</p>
+<p>Sección anterior: <a href="/es/CSS/Como_iniciar/Que_es_CSS" title="es/CSS/Como_iniciar/Que_es_CSS">Que es CSS</a><br>
+ Sección siguiente: <a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting Started/How CSS works">How CSS works</a></p>
+<h2 id="Información_¿Por_qué_usar_CSS">Información: ¿Por qué usar CSS?</h2>
+<p>CSS ayuda a mantener la información de contenido de un documento separado de los detalles de como mostrarlo. Los detalles de como se muestra el documento son conocidos como <em>estilos. </em>Si mantienes los estilos separados del contenido puedes:</p>
+<ul>
+ <li>Evitar duplicación</li>
+ <li>Hacer el mantenimiento más simple</li>
+ <li>Usar el mismo contenido con diferentes estilos para diferentes propositos.</li>
+</ul>
+<table>
+ <caption>
+  Ejemplo</caption>
+ <tbody>
+  <tr>
+   <td>
+    <p>Tu sitio web podría mostrar miles de páginas que se ven similar. Usando CSS, almacenas la información de estilos en archivos comunes que todas las páginas comparten.Cuando un usuario visualiza una página web, el navegador carga la información de estilos junto con el contenido de la página.</p>
+    <p>Cuando un usuario imprime una página web, podrías proveerle diferente información de estilos que hace que las páginas impresas sean fáciles de leer.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+<p>En general con HTML, usas el lenguaje de marcado para describir la información del contenido del documento, no sus estilos. Usas CSS para especificar sus estilos, no su contenido. (Más adelante en este tutorial, verás algunas excepciones a este acuerdo).</p>
+<table>
+ <caption>
+  Más detalles</caption>
+ <tbody>
+  <tr>
+   <td>
+    <p>Un lenguaje de marcado como HTML también provee algunas maneras de especificar estilos.</p>
+    <p>Por ejemplo en HTML puedes usar una etiqueta <code>&lt;b&gt; </code>para hacer acentuar el texto, y puedes especificar un color de fondo de la página en la etiqueta <code>&lt;body&gt;</code>.</p>
+    <p>Cuando usas CSS, normalmente evitas usar estas características del lenguaje de marcado así toda la información de estilos de tu documento está en un solo lugar.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Acción_Creando_una_hoja_de_estilos">Acción: Creando una hoja de estilos</h2>
+<ol>
+ <li>Crea un archivo de texto en el mismo directorio anterior.  Este archivo será tu hoja de estilos. Nombrala como: <code>style1.css</code></li>
+ <li>En tu archivo CSS, copia y pega esta única línea, luego graba el archivo:</li>
+ <li>
+  <div>
+   <pre class="eval">strong {color: red;}
+</pre>
+  </div>
+ </li>
+</ol>
+<h3 id="Enlazando_tu_documento_a_tu_hoja_de_estillos">Enlazando tu documento a tu hoja de estillos</h3>
+<ol>
+ <li>Para enlazar tu documento a tu hoja de estilos, edita tu archivo HTML. Añade la línea acentuada aquí:</li>
+ <li>
+  <div>
+   <pre class="eval">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"<span class="nowiki">http://www.w3.org/TR/html4/strict.dtd</span>"&gt;
+&lt;html&gt;
+  &lt;head&gt;
+  &lt;meta http-equiv="Content-Type" content="text/html;
+charset=iso-8859-1"&gt;
+  &lt;title&gt;Sample document&lt;/title&gt;
+  <strong>&lt;link rel="stylesheet" type="text/css" href="style1.css"&gt;</strong>
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;p&gt;
+      &lt;strong&gt;C&lt;/strong&gt;ascading
+      &lt;strong&gt;S&lt;/strong&gt;tyle
+      &lt;strong&gt;S&lt;/strong&gt;heets
+    &lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+  </div>
+ </li>
+ <li>Graba el archivo y refresca la pantalla del navegador. Esta hoja de estilos hace que las letras inicales sean rojas, como esto:
+  <table>
+   <tbody>
+    <tr>
+     <td><strong>C</strong>ascading <strong>S</strong>tyle <strong>S</strong>heets</td>
+    </tr>
+   </tbody>
+  </table>
+ </li>
+</ol>
+<table>
+ <caption>
+  Reto</caption>
+ <tbody>
+  <tr>
+   <td>En adición al rojo, CSS permite algunos otros nombres de colores.
+    <p>Sin mirar la referencia, encuentra cinco o más nombres de colores que funcionen en tu hoja de estilos.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+<p><a href="/en/CSS/Getting_Started/Challenge_solutions#Why_use_CSS_colors" title="en/CSS/Getting Started/Challenge solutions#Why use CSS colors">See a solution for the challenge.</a> Ver la solución al reto.</p>
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+<p>Si tienes alguna dificultad entendiendo esta página, o si tienes comentarios acerca de la misma, por favor contribuye en esta página de <a href="/Talk:en/CSS/Getting_Started/Why_use_CSS%3f" title="Talk:en/CSS/Getting_Started/Why_use_CSS%3f">Discusión</a>.</p>
+<p>Ahora que tienes un archivo de ejemplo enlazado a una hoja de estilos separada, estás listo para aprender más acerca de como tu navegador combina ellos cuando muestra el documento: <a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting_Started/How_CSS_works">Como funciona CSS</a>.</p>
+<p>{{ CSSTutorialTOC() }}</p>
+<p>{{ languages( { "fr": "fr/CSS/Premiers_pas/Pourquoi_utiliser_CSS", "it": "it/Conoscere_i_CSS/Perch\u00e9_usare_i_CSS", "ja": "ja/CSS/Getting_Started/Why_use_CSS", "pl": "pl/CSS/Na_pocz\u0105tek/Po_co_u\u017cywa\u0107_CSS", "pt": "pt/CSS/Como_come\u00e7ar/Porque_usar_CSS", "es": "es/CSS/Como_iniciar/Por_que_usar_CSS", "zh-cn": "cn/CSS/Getting_Started/Why_use_CSS" } ) }}</p>
diff --git a/files/es/conflicting/learn/css/first_steps/how_css_works_194e34e451d4ace023d98021c00b3cfd/index.html b/files/es/conflicting/learn/css/first_steps/how_css_works_194e34e451d4ace023d98021c00b3cfd/index.html
new file mode 100644
index 0000000000..6db03d40c8
--- /dev/null
+++ b/files/es/conflicting/learn/css/first_steps/how_css_works_194e34e451d4ace023d98021c00b3cfd/index.html
@@ -0,0 +1,130 @@
+---
+title: Cómo funciona el CSS
+slug: >-
+  conflicting/Learn/CSS/First_steps/How_CSS_works_194e34e451d4ace023d98021c00b3cfd
+tags:
+  - CSS
+  - 'CSS:'
+  - CSS:Empezando
+  - Diseño
+  - Guía
+  - Inicio
+  - Web
+translation_of: Learn/CSS/First_steps/How_CSS_works
+translation_of_original: Web/Guide/CSS/Getting_started/How_CSS_works
+original_slug: Web/CSS/Introducción/How_CSS_works
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Why_use_CSS", "¿Por qué usar CSS?") }}<span id="result_box" lang="es"><span class="hps">Esta</span> <span class="alt-edited hps">tercera parte del</span> </span><span class="seoSummary">tutorial <a href="/en-US/docs/Web/Guide/CSS/Getting_started" title="en-US/docs/Web/Guide/CSS/Getting_started">Empezando CSS</a> </span><span id="result_box" lang="es"><span class="hps">explica cómo funciona</span> <span class="hps">el CSS</span> <span class="hps">en el navegador y</span> la finalidad<span class="hps"> del</span> <span class="atn hps">Modelo de Objeto de Documento (</span><span>DOM</span><span>)</span><span>.</span> <span class="hps">Usted también aprenderá</span> <span class="hps">cómo analizar</span> <span class="hps">el documento de</span> <span class="hps">muestra.</span></span></p>
+
+<h2 class="clearLeft" id="Información_Cómo_funciona_CSS"><span class="short_text" id="result_box" lang="es"><span class="hps">Información</span><span>: Cómo funciona</span> <span class="hps">CSS</span></span></h2>
+
+<p><span id="result_box" lang="es"><span class="hps">Cuando un</span> <span class="hps">navegador muestra</span> <span class="hps">un documento, debe</span><span class="alt-edited hps"> combinar</span> <span class="hps">el contenido del documento</span> <span class="hps">con la </span><span class="hps">información </span></span><span id="result_box" lang="es"><span class="hps"> </span></span><span id="result_box" lang="es"><span class="hps">de </span></span><span id="result_box" lang="es"><span class="hps">su</span></span><span id="result_box" lang="es"><span class="hps"> estilo</span><span>.</span> Se <span class="hps">procesa</span> <span class="hps">el documento en</span> <span class="hps">dos</span> <span class="hps">etapas</span><span>:</span></span></p>
+
+<ol>
+ <li><span id="result_box" lang="es"><span class="hps">El navegador</span> <span class="hps">convierte el</span> <span class="hps">lenguaje de marcado (</span></span><code><strong><em>markup</em></strong></code>)<span lang="es"> <span class="hps">y</span> <span class="alt-edited hps">el</span> <span class="hps">CSS</span> <span class="hps">en el <em><span class="seoSummary"><a href="en-US/docs/DOM" title="en-US/docs/DOM">DOM</a></span></em></span><span class="seoSummary"><strong> </strong></span><span class="hps">(Document Object</span> <span class="hps">Model)</span><span>.</span> <span class="hps">El DOM</span> <span class="hps">representa el documento</span> <span class="hps">en la memoria del</span> <span class="hps">ordenador.</span></span> <span id="result_box" lang="es"><span class="hps">Combina</span> <span class="hps">el contenido del documento</span> <span class="hps">con su estilo</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">El navegador muestra</span> <span class="hps">el contenido de la</span> <span class="hps">DOM</span><span>.</span></span></li>
+</ol>
+
+<p><span id="result_box" lang="es"><span class="hps">Un</span> <span class="hps">lenguaje de marcado</span> <span class="hps">utiliza <em>elementos</em></span><em> </em><span class="hps">para definir</span> <span class="hps">la estructura del documento</span><span>.</span> <span class="hps">Usted marca</span> <span class="hps">un elemento</span> <span class="hps">utilizando</span> <span class="hps"><em>etiquetas</em>,</span> <span class="hps">que son cadenas</span> <span class="hps">que comienzan con</span> <span class="hps">'&lt;'</span> <span class="hps">y termina con</span> <span class="hps">'&gt;'</span><span>.</span> <span class="hps">La mayoría de los</span> <span class="hps">elementos</span> <span class="hps">tienen un par de</span> <span class="hps">etiquetas,</span> <span class="hps">una etiqueta de inicio</span> <span class="hps">y</span> <span class="hps">una etiqueta de cierre</span><span>.</span> <span class="hps">Para la</span> <span class="hps">etiqueta de inicio</span><span>, coloque</span> <span class="hps">el nombre del elemento</span> <span class="hps">entre</span> <span class="hps">'&lt;'</span> <span class="atn hps">y '</span><span>&gt;'</span><span>.</span> <span class="hps">Para la</span> <span class="hps">etiqueta final</span><span>, coloque un</span> <span class="hps">'/'</span> <span class="atn hps">después de '</span><span>&lt;' y</span> <span class="hps">antes del</span> <span class="hps">nombre del elemento.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Dependiendo del</span> <span class="hps">lenguaje de marcado</span><span>,</span> <span class="hps">algunos</span> <span class="hps">elementos tienen</span> <span class="hps">sólo</span> <span class="hps">una etiqueta de inicio</span><span>,</span> <span class="hps">o</span> <span class="hps">una sola etiqueta</span> <span class="hps">donde el</span> <span class="hps">'/'</span> viene <span class="hps">después del</span> <span class="hps">nombre del elemento.</span> <span class="hps">Un elemento</span> <span class="hps">también</span> <span class="hps">puede ser un contenedor </span><span class="hps">e incluir</span> <span class="hps">otros elementos</span> <span class="hps">entre</span> <span class="hps">su</span> <span class="hps">etiqueta de inicio</span> <span class="hps">y la etiqueta de cierre</span><span>.</span> <span class="alt-edited hps">Sólo recuerda</span> <span class="hps">cerrar</span> <span class="hps">siempre</span> <span class="hps">las</span> <span class="hps">etiquetas</span> <span class="hps">dentro del contenedor.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Un</span> <span class="hps">DOM</span> <span class="hps">tiene una estructura</span> <span class="hps">en forma de árbol</span><span>.</span> <span class="hps">Cada elemento</span><span>,</span> <span class="hps">atributo</span> <span class="hps">y</span> <span class="hps">extensión de texto</span> <span class="hps">en el</span> <span class="hps">lenguaje de marcado</span> <span class="hps">se convierte en un</span> <span class="hps"><em>nodo </em>de la</span> <span class="hps">estructura de árbol.</span> <span class="hps">Los nodos</span> <span class="hps">se definen por su</span> <span class="hps">relación con otros</span> <span class="hps">nodos DOM</span><span>.</span> <span class="hps">Algunos elementos</span> <span class="hps">son</span> <span class="hps">los padres de los</span> <span class="hps">nodos secundarios</span><span>,</span> <span class="hps">y</span> <span class="hps">los nodos secundarios</span> <span class="hps">tienen hermanos</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Comprender el</span> <span class="hps">DOM</span> <span class="hps">le ayuda a diseñar</span><span>, depurar</span> <span class="hps">y mantener su</span> <span class="hps">CSS</span><span>,</span> <span class="hps">porque el</span> <span class="hps">DOM</span> <span class="hps">es donde su</span> <span class="hps">CSS y</span> <span class="hps">el contenido del documento</span> <span class="hps">se reúnen</span><span>.</span></span></p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+<span id="result_box" lang="es"><span class="hps">En</span> <span class="alt-edited hps">el</span> <span class="hps">documento de ejemplo</span><span>,</span> <span class="alt-edited hps">las</span> <span class="hps">etiqueta &lt;p&gt;</span> <span class="hps">y su</span> <span class="hps">etiqueta de cierre</span> <span class="atn hps">&lt;</span><span>/</span> <span class="hps">p&gt;</span> <span class="hps">crean un contenedor</span><span>:</span></span>
+
+<pre class="brush:html">&lt;p&gt;
+  &lt;strong&gt;C&lt;/strong&gt;ascading
+  &lt;strong&gt;S&lt;/strong&gt;tyle
+  &lt;strong&gt;S&lt;/strong&gt;heets
+&lt;/p&gt;
+</pre>
+
+<h2 id="Ejemplo_en_vivo"><span class="short_text" id="result_box" lang="es"><span class="hps">Ejemplo</span> en <span class="hps">vivo</span></span></h2>
+
+<p><a href="http://jsfiddle.net/djaniketster/6jbpS/">http://jsfiddle.net/djaniketster/6jbpS/</a></p>
+
+<p><span id="result_box" lang="es"><span class="hps">En el</span> <span class="hps">DOM</span><span>, el nodo</span> <span class="hps">correspondiente P</span> <span class="hps">es</span> <span class="hps">uno de los padres</span><span>.</span> <span class="hps">Sus</span> <span class="hps">hijos</span> <span class="hps">son los nodos</span> <code><em><strong>STRONG </strong></em></code><span class="alt-edited hps">y</span> <span class="hps">los</span> <span class="hps">nodos de texto</span><span>.</span> <span class="hps">Los nodos</span> <code><em><strong>STRONG </strong></em></code></span><span lang="es"><span class="alt-edited hps">son en sí mismos</span> <span class="hps">padres</span><span>,</span> <span class="hps">con</span> <span class="hps">los nodos de texto</span> <span class="hps">como</span> <span class="hps">sus hijos</span><span>:</span></span></p>
+
+<pre><span style="color: black;">P</span>
+├─<span style="color: black;">STRONG</span>
+│ └─"<span style="color: black;">C</span>"
+├─"<span style="color: black;">ascading</span>"
+├─<span style="color: black;">STRONG</span>
+│ └─"<span style="color: black;">S</span>"
+├─"<span style="color: black;">tyle</span>"
+├─<span style="color: black;">STRONG</span>
+│ └─"<span style="color: black;">S</span>"
+└─"<span style="color: black;">heets</span>"</pre>
+</div>
+
+<h2 id="Acción_Analizando_un_DOM"><span class="short_text" id="result_box" lang="es"><span class="hps">Acción:</span> <span class="hps">Analizando un</span> <span class="hps">DOM</span></span></h2>
+
+<h3 id="El_uso_del_Inspector_DOM"><span class="short_text" id="result_box" lang="es"><span class="hps">El uso del Inspector</span> <span class="hps">DOM</span></span></h3>
+
+<p><span id="result_box" lang="es"><span class="hps">Para analizar un</span> <span class="hps">DOM</span><span>,</span> <span class="hps">se necesita un software</span> <span class="hps">especial.</span> <span class="hps">Usted puede usar</span> el </span><span id="result_box" lang="es"><span class="alt-edited hps">complemento de </span> </span><span id="result_box" lang="es"><span class="hps">Mozilla </span></span><a href="/en/DOM_Inspector" title="en/DOM_Inspector">DOM Inspector</a> (DOMi) <span id="result_box" lang="es"><span class="hps">para analizar un</span> <span class="hps">DOM</span><span>.</span> <span class="hps">Usted sólo tendrá que</span> <span class="hps">instalar el</span> <span class="atn hps">complemento (</span><span>ver</span> <span class="hps">más detalles abajo)</span><span>.</span></span></p>
+
+<ol>
+ <li><span id="result_box" lang="es"><span class="hps">Utilice</span> <span class="hps">el navegador</span> <span class="hps">Mozilla</span> <span class="hps">para abrir</span> <span class="hps">el documento</span> <span class="hps">en versión HTML</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">Desde la barra de</span> <span class="hps">menú de su </span><span class="hps">navegador</span><span>, selecciona</span> <strong><span class="hps">Herramientas&gt;</span> <span class="hps">Inspector DOM</span></strong><span>,</span> <span class="hps">o <strong>Herramientas</strong></span><strong><span>&gt;</span> <span class="hps">Desarrollo Web&gt;</span> <span class="hps">Inspector DOM</span></strong><span>.</span></span>
+  <div class="tuto_details">
+  <div class="tuto_type"><span id="result_box" lang="es"><span class="alt-edited hps">Más</span> <span class="hps">detalles</span></span></div>
+
+  <p><span id="result_box" lang="es"><span class="hps">Si el navegador</span> <span class="hps">Mozilla</span> <span class="hps">no tiene</span> <span class="hps">Domi</span><span>, puede</span><a href="https://addons.mozilla.org/en-US/firefox/addon/6622/"> instalarlo del sitio de complementos</a> <span class="hps">y reiniciar el</span> <span class="hps">navegador.</span> <span class="hps">Luego regrese</span> <span class="hps">a este</span> <span class="hps">tutorial.</span></span></p>
+
+  <p><span id="result_box" lang="es"><span class="hps">Si no</span> <span class="hps">desea instalar</span> <span class="hps">Domi</span> <span class="hps">(o</span> <span class="hps">estás usando</span> <span class="hps">un navegador que no</span> <span class="hps">Mozilla)</span><span>, puede utilizar</span> <span class="hps">Web</span> <span class="atn hps">X-</span><span>Ray</span> <span class="hps">Goggles,</span> <span class="hps">como se describe en</span> <span class="hps">la siguiente sección.</span> <span class="hps">O bien, puede</span> <span class="hps">omitir esta sección</span> <span class="hps">e ir directamente a</span> <span class="hps">la página siguiente.</span> <span class="hps">Saltarse</span> <span class="hps">esta sección</span> <span class="hps">no interfiere con</span> <span class="hps">el resto del</span> <span class="hps">tutorial.</span></span></p>
+  </div>
+ </li>
+ <li><span id="result_box" lang="es"><span class="alt-edited hps">En el</span> <span class="hps">Domi</span><span>, expanda</span> <span class="hps">los nodos</span> <span class="hps">de su</span> <span class="hps">documento</span> <span class="hps">haciendo clic en</span> <span class="hps">las flechas</span><span>.</span></span>
+  <p><span id="result_box" lang="es"><strong><span class="hps">Nota</span><span>:</span></strong> <span class="alt-edited hps">El espaciado</span> <span class="alt-edited hps">de su archivo</span> <span class="hps">HTML</span> <span class="alt-edited hps">puede ocasionar</span> <span class="alt-edited hps">que Domi</span> <span class="alt-edited hps">muestre</span> <span class="hps">algunos nodos</span> <span class="hps">de texto vacíos</span><span class="alt-edited">, que se pueden</span> <span class="hps">pasar por alto.</span></span></p>
+
+  <p><span id="result_box" lang="es"><span class="hps">Parte</span> <span class="hps">del resultado</span> <span class="hps">podría tener este aspecto</span><span>, según</span> <span class="alt-edited hps">qué nodos</span> <span class="alt-edited hps">has</span> <span class="alt-edited hps">expandido</span><span>:</span></span></p>
+
+  <pre>│ ▼╴<span style="color: black;">P</span>
+│ │ │ ▼╴<span style="color: black;">STRONG</span>
+│ │ └<span style="color: darkblue;">#text</span>
+│ ├╴<span style="color: darkblue;">#text</span>
+│ ►╴<span style="color: black;">STRONG</span>
+│ │</pre>
+
+  <p><span id="result_box" lang="es"><span class="alt-edited hps">Cuando selecciona</span> <span class="alt-edited hps">cualquiera de los nodos</span><span>, puede usar</span> <span class="hps">panel de la derecha</span> <span class="hps">de</span> <strong><span class="alt-edited hps"> DOMi </span></strong><span class="hps">para averiguar</span> <span class="hps">más cosas sobre él.</span> <span class="hps">Por ejemplo</span><span>, cuando se selecciona</span> <span class="hps">un nodo de texto</span><span>,</span> <strong><span class="alt-edited hps">DOMi </span></strong></span><span lang="es"><span class="hps">muestra</span> <span class="hps">el texto en el</span> <span class="hps">panel de la derecha</span><span>.</span></span></p>
+
+  <p><span id="result_box" lang="es"><span class="hps">Cuando se selecciona</span> <span class="alt-edited hps">un elemento nodo</span></span>, <span id="result_box" lang="es"><strong><span class="alt-edited hps">DOMi </span></strong><span class="hps">analiza y</span> <span class="hps">ofrece</span> <span class="hps">una enorme cantidad de</span> <span class="hps">información en su</span> <span class="hps">panel de la derecha</span><span>.</span></span> <span id="result_box" lang="es"><span class="alt-edited hps">La información de estilo</span> <span class="hps">es sólo</span> <span class="alt-edited hps">una parte de la información</span> <span class="hps">que proporciona.</span></span></p>
+ </li>
+</ol>
+
+<div class="tuto_example">
+<div class="tuto_type">Problema</div>
+
+<p><span id="result_box" lang="es"><span class="alt-edited hps">En el</span> <strong><span class="alt-edited hps">DOMi </span></strong></span><span lang="es"><span>, haga clic</span> <span class="hps">en un nodo</span> </span><code><small>STRONG</small></code>.</p>
+
+<p><span id="result_box" lang="es"><span class="hps">Utilice</span> el <span class="hps">panel de la derecha</span> <span class="hps">de</span> <span class="alt-edited hps">Domi</span> <span class="hps">para encontrar </span><span class="alt-edited hps">el </span></span><span id="result_box" lang="es"><span class="hps"> nodo de </span></span><span id="result_box" lang="es"><span class="alt-edited hps">color</span><span class="hps"> rojo</span><span>,</span> <span class="hps">y donde</span> <span class="hps">su apariencia </span><span class="hps">es</span> <span class="hps">más relevante que</span> <span class="hps">el texto normal</span><span>.</span></span></p>
+
+<div class="tuto_details" id="tutochallenge">
+<div class="tuto_type">Possible solution</div>
+
+<p>In the menu above the right-hand pane, choose <strong>CSS Rules</strong>. You see two items listed, one that references an internal resource and one that references your stylesheet file. The internal resource defines the <strong>font-weight</strong> property as <code>bolder</code>; your stylesheet defines the <strong>color</strong> property as <code>red</code>.</p>
+<a class="hideAnswer" href="#challenge">Ocultar solución</a></div>
+<a href="#tutochallenge" title="Ver la posible solución para el problema">Ver la solución para el problema.</a></div>
+
+<h3 id="Utilizando_Web_X-Ray_Goggles"><span class="short_text" id="result_box" lang="es"><span class="hps">Utilizando</span> <span class="hps">Web</span> <span class="hps">X</span><span class="atn">-</span><span>Ray</span> <span class="hps">Goggles</span></span></h3>
+
+<p><a class="link-https" href="https://goggles.webmaker.org/" title="https://secure.toolness.com/webxray/">Web X-Ray Goggles </a><span id="result_box" lang="es"><span class="hps">muestra</span> <span class="hps">menos información que</span> <strong><code><span class="hps">DOM</span> </code></strong><span class="hps">Inspector</span><span>, pero</span> <span class="hps">es</span> <span class="hps">más fácil de</span> <span class="hps">instalar y utilizar.</span></span></p>
+
+<ol>
+ <li><span id="result_box" lang="es"><span class="hps">Ir</span> <span class="hps">a la página principal</span> <span class="hps">de</span> <span class="hps">la </span></span> <a class="link-https" href="https://goggles.webmaker.org/" title="https://secure.toolness.com/webxray/">Web X-Ray Goggles</a>.</li>
+ <li><span id="result_box" lang="es"><span class="hps">Arrastre el</span> <span class="hps">enlace</span> <span class="hps">bookmarklet</span> <span class="hps">en esa</span> <span class="hps">página a</span> <span class="hps">tu barra de herramientas</span> <span class="hps">del navegador</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">Abra el documento</span> <span class="hps">en versión HTML</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="alt-edited hps">Active</span> <span class="hps">Web</span> <span class="atn hps">X-</span><span>Ray</span> <span class="hps">Goggles</span> <span class="hps">haciendo clic en el</span> <span class="hps">bookmarklet</span> <span class="hps">en</span> <span class="hps">la barra de herramientas</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">Mueva el</span> <span class="alt-edited hps">puntero del ratón</span> <span class="alt-edited hps">por encima de su</span> <span class="alt-edited hps">documento para comprobar</span> <span class="hps">los</span> <span class="hps">elementos en el documento</span><span>.</span></span></li>
+</ol>
+
+<h2 id="¿Y_ahora_qué"><span class="short_text" id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
+
+<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Cascading_and_inheritance", "Cascada y herencia") }}<span id="result_box" lang="es"><span class="alt-edited hps">Si tomaste</span> <span class="alt-edited hps">el reto</span><span class="alt-edited">, usted vera</span> <span class="hps">que</span> <span class="hps">la información de estilo</span>  <span class="hps">interactúa</span> en </span><span id="result_box" lang="es"><span class="hps">más de un lugar, </span></span><span id="result_box" lang="es"><span class="hps">para crear el estilo</span> <span class="hps">final de </span><span class="hps">un elemento.</span> <span class="hps">La <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Cascading_and_inheritance">siguiente página</a></span> <span class="hps">explica</span> <span class="hps">más acerca de estas</span> <span class="hps">interacciones.</span></span></p>
diff --git a/files/es/conflicting/learn/css/first_steps/how_css_works_a460b5a76c3c2e7fc9b8da464dfd0c22/index.html b/files/es/conflicting/learn/css/first_steps/how_css_works_a460b5a76c3c2e7fc9b8da464dfd0c22/index.html
new file mode 100644
index 0000000000..a46c22f85e
--- /dev/null
+++ b/files/es/conflicting/learn/css/first_steps/how_css_works_a460b5a76c3c2e7fc9b8da464dfd0c22/index.html
@@ -0,0 +1,148 @@
+---
+title: Que es CSS
+slug: >-
+  conflicting/Learn/CSS/First_steps/How_CSS_works_a460b5a76c3c2e7fc9b8da464dfd0c22
+tags:
+  - para_revisar
+translation_of: Learn/CSS/First_steps/How_CSS_works
+translation_of_original: Web/Guide/CSS/Getting_started/What_is_CSS
+original_slug: Web/CSS/Como_iniciar/Que_es_CSS
+---
+<p>En esta página se explica que es CSS. Usted creará un documento simple con el cual trabajará en las próximas páginas del tutorial.</p>
+
+<p>Esta es la primera sección del tutorial <a href="/es/CSS/Introducción" title="es/CSS/Introducción">Como iniciar</a>.<br>
+ Siguiente sección: <a href="/es/docs/CSS/Como_iniciar/Por_que_usar_CSS" title="en/CSS/Getting Started/Why use CSS">Por qué usar CSS</a></p>
+
+<h2 id="Información_¿Qué_es_CSS">Información: ¿Qué es CSS?</h2>
+
+<p>Cascading Style Sheets (<dfn><abbr title="Cascading Style Sheets">CSS</abbr></dfn>), traducido literalmente al español, como <em>Hojas de estilo en cascada</em>, es un lenguaje para especificar cómo los documentos se presentan a los usuarios.</p>
+
+<p>Un <em>documento (document)</em> es una colección de información que está estructurada utilizando un <em>lenguaje de formato (markup language)</em>.</p>
+
+<table style="background-color: #fffff4; border: 1px solid #3366bb; margin-bottom: 1em; padding: 1em;">
+ <caption>Ejemplos</caption>
+ <tbody>
+  <tr>
+   <td>
+    <ul>
+     <li>Una página web como la que estás leyendo, es un documento.<br>
+      La información que ves en una página web usualmente está estructurada utilizando el lenguaje de formato de documentos de HiperTexto, HTML (HyperText Markup Language).</li>
+    </ul>
+
+    <ul>
+     <li>Un cuadro de diálogo en una aplicación Mozilla es un documento.<br>
+      Los controles de interfaz de usuario que pude ver en los diálogos de control de aplicaciones Mozilla, están estructurados utilizando el lenguaje de formato XUL (XML User-interface Language - Lenguaje XML de interfaces de usuario).</li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>En este tutorial, los cuadros con titulo <strong>Más detalles</strong>, como el que está a continuación, contienen información adicional. Si se cuenta con poco tiempo para progresar con el tutorial, entonces pude omitir estos cuadros, quizás retorne a leerlos luego. De lo contrario léalos cuando llegue a ellos y tal vez siga los enlaces que contienen para aprender más.</p>
+
+<table style="background-color: #f4f4f4; border: 1px solid #3366bb; margin-bottom: 1em; padding: 1em;">
+ <caption>Más detalles</caption>
+ <tbody>
+  <tr>
+   <td>
+    <p>Un documento no es lo mismo que un archivo. Y este puede o no estar almacenado en un archivo.</p>
+
+    <p>Por ejemplo, el documento esta leyendo en este momento no está almacenado en un archivo. Cuando su navegador web solicita esta página, el servidor consulta a la base de datos y genera el documento, obteniendo las partes del mismo de diferentes archivos. Sin embargo, en este tutorial se trabajará con documentos que se almacenan en archivos.</p>
+
+    <p>Para más información acerca de documentos y lenguajes de formato, visite otras partes de este sitio web—por ejemplo:</p>
+
+    <table style="background-color: inherit; margin-left: 2em;">
+     <tbody>
+      <tr>
+       <td><a href="/en/HTML" title="en/HTML">HTML</a></td>
+       <td>para páginas web</td>
+      </tr>
+      <tr>
+       <td><a href="/en/XML" title="en/XML">XML</a></td>
+       <td>para documentos estrucurados, en general</td>
+      </tr>
+      <tr>
+       <td><a href="/en/SVG" title="en/SVG">SVG</a></td>
+       <td>para gráficas</td>
+      </tr>
+      <tr>
+       <td><a href="/en/XUL" title="en/XUL">XUL</a></td>
+       <td>para interfaces de usuario de Mozilla</td>
+      </tr>
+     </tbody>
+    </table>
+
+    <p>En la parte II de este tutorial podrá ver ejemplos de estos lenguajes de formato.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p><em>Presentar</em> un documento a un usuario significa convertirlo en una forma en que el humano pueda hacer uso de el. Mozilla está diseñado para presentar documentos de manera visual—por ejemplo, en la pantalla de una computadora, en un proyector o en una impresora.</p>
+
+<table style="background-color: #f4f4f4; border: 1px solid #3366bb; margin-bottom: 1em; padding: 1em;">
+ <caption>Más detalles</caption>
+ <tbody>
+  <tr>
+   <td>CSS no es sólo para los navegadores web, y no sólo para la presentación visual. En terminos formales CSS, el programa que presenta un documento a un usuario es llamado un <em>agente de usuarios</em> (UA - User Agent). Un navegador es sólo un tipo de UA. Sin embargo, en la parte I de este tutorial, se trabajará únicamente con CSS en un navegador.
+    <p>Para algunas de las definiciones formales de la terminología relacionda con CSS, consulte el enlace <a class="external" href="http://www.w3.org/TR/CSS21/conform.html#q1">Definiciones</a> (en ingles) en la especificación CSS.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Acción_Crear_un_documento">Acción: Crear un documento</h2>
+
+<ol>
+ <li>Utilice su computador para crear un nuevo directorio y un nuevo archivo de texto allí. El archivo contendrá el documento.
+  <ol>
+   <li>Copie y pegue el código HTML que se muestra a continuación. Guarde el archivo con el nombre <code>doc1.html</code>
+
+    <div style="width: 40em;">
+    <pre class="deki-transform">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd"&gt;
+&lt;html&gt;
+  &lt;head&gt;
+  &lt;meta http-equiv="Content-Type" content="text/html;
+  charset=iso-8859-1"&gt;
+  &lt;title&gt;Sample document&lt;/title&gt;
+  &lt;/head&gt;
+
+  &lt;body&gt;
+    &lt;p&gt;
+      &lt;strong&gt;C&lt;/strong&gt;ascading
+      &lt;strong&gt;S&lt;/strong&gt;tyle
+      &lt;strong&gt;S&lt;/strong&gt;heets
+      &lt;strong&gt;B&lt;/strong&gt;heets
+    &lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+    </div>
+   </li>
+  </ol>
+ </li>
+ <li>En el navegador web, abra una nueva pestaña o una nueva ventana, y abra el archivo allí.
+  <p>Debe observar un texto con las letras iniciales en negrita, así:</p>
+
+  <table style="border: 2px outset #3366bb; padding: 1em;">
+   <tbody>
+    <tr>
+     <td><strong>C</strong>ascading <strong>S</strong>tyle <strong>S</strong>heets</td>
+    </tr>
+   </tbody>
+  </table>
+
+  <p>Lo que ve en el navegador puede no lucir exactamente como en la imagen, debido a la configuración de su navegador web y esta wiki. Si existen algunas diferencias en el tipo de fuente, espaciado y los colores que ve, no son importantes.</p>
+ </li>
+</ol>
+
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+
+<p>Si ha tenido dificultad para entender esta página, o si tiene comentarios acerca de ella, por favor contribuya con esta en la página de <a href="/Talk:en/CSS/Getting_Started/What_is_CSS%3f" title="Talk:en/CSS/Getting_Started/What_is_CSS?">Discusiones</a>.</p>
+
+<p>El documento aún no utiliza CSS. En la siguiente página se utilizará CSS para especificar el estilo: <strong><a href="/es/docs/CSS/Como_iniciar/Por_que_usar_CSS" title="en/CSS/Getting_Started/Why_use_CSS?">¿Por qué utilizar CSS?</a></strong></p>
+
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p>{{ languages( { "fr": "fr/CSS/Premiers_pas/Pr\u00e9sentation_des_CSS", "it": "it/Conoscere_i_CSS/Che_cosa_sono_i_CSS", "ja": "ja/CSS/Getting_Started/What_is_CSS", "pl": "pl/CSS/Na_pocz\u0105tek/Czym_jest_CSS", "pt": "pt/CSS/Como_come\u00e7ar/O_que_\u00e9_CSS", "zh-cn": "cn/CSS/Getting_Started/What_is_CSS", "es": "es/CSS/Como_iniciar/Que_es_CSS" } ) }}</p>
diff --git a/files/es/conflicting/learn/css/first_steps/index.html b/files/es/conflicting/learn/css/first_steps/index.html
new file mode 100644
index 0000000000..ffcef61e68
--- /dev/null
+++ b/files/es/conflicting/learn/css/first_steps/index.html
@@ -0,0 +1,95 @@
+---
+title: Introducción
+slug: conflicting/Learn/CSS/First_steps
+tags:
+  - CSS
+  - CSS:Introducción
+  - para_revisar
+translation_of: Learn/CSS/First_steps
+translation_of_original: Web/Guide/CSS/Getting_started
+original_slug: Web/CSS/Introducción
+---
+<h2 id="Presentación"><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Presentación</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Este tutorial es una introducción a las hojas de estilo en cascada (Cascading Style Sheets o CSS).</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Además, te guía a través de las características básicas de CSS con ejemplos prácticos que puedes probar por ti mismo en tu propio equipo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Está dividido en dos partes.</span></span></p>
+
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La parte I ilustra las características estándar de CSS que funcionan en los navegadores Mozilla y también en la mayoría de los navegadores modernos.</span></span></li>
+</ul>
+
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La parte II contiene algunos ejemplos de características especiales que funcionan en Mozilla, pero no necesariamente en otros entornos.</span></span></li>
+</ul>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El tutorial se basa en la <a class="external" href="http://www.w3.org/TR/CSS21/" title="http://www.w3.org/TR/CSS21/">Especificación CSS 2.1</a> .</span></span></p>
+
+<h3 id="¿Quién_debe_usar_este_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">¿Quién debe usar este tutorial?</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Este tutorial es sobre todo para los principiantes en CSS, pero también lo puedes usar si tienes alguna experiencia en CSS.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si eres principiante en CSS, usa la parte I de este tutorial para entender CSS y aprender a usarlo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">A continuación, utiliza la parte II para comprender el ámbito de aplicación de CSS en Mozilla.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si sabes algo de CSS, puede omitir las partes de la guía de aprendizaje que ya conoces y sólo utilizar las partes que te interesen.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si tienes experiencia en CSS, pero no en Mozilla, puedes saltar a la parte II.</span></span></p>
+
+<h3 id="¿Qué_se_necesita_antes_de_empezar"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">¿Qué se necesita antes de empezar?</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para aprovechar al máximo este tutorial, necesitas un editor para archivos de texto y un navegador Mozilla (Firefox o Mozilla Suite).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">También debes saber cómo utilizarlos de forma básica.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no deseas editar los archivos, entonces puedes leer el tutorial y ver las fotos, pero es una forma menos eficaz de aprender.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Algunas partes del tutorial, que son opcionales, requieren otro software de Mozilla.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no quieres descargar otros software de Mozilla, entonces puedes saltártelas.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El otro software de Mozilla al que hace referencia este tutorial incluye:</span></span></p>
+
+<ul>
+ <li><a href="/en/DOM_Inspector" title="en/Dom inspector"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Inspector DOM</span></span></a></li>
+</ul>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota:</strong> CSS ofrece distintas maneras de trabajar con el color, por lo que las partes de este tutorial dependen de él.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Sólo puedes utilizar estas partes del tutorial fácilmente si dispones de una pantalla en color y de visión del color normal.</span></span></p>
+
+<h3 id="Cómo_utilizar_este_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Cómo utilizar este tutorial</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para utilizar este tutorial, lee las páginas con atención y en orden.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si se te pasa una página, tal vez te resulte difícil de entender las páginas siguientes.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En cada página, utiliza la sección de <em>Información</em> para entender cómo funciona CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Usa la sección <em>Acción</em> para tratar de usar CSS en tu propio equipo.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para controlar que has comprendido los contenidos, acepta el reto al final de cada página.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las soluciones a los retos están enlazadas debajo de los retos, por lo que no es necesario verlos si no quieres.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para entender CSS en mayor profundidad, lee la información que se encuentra en las cajas con el título <em>Más detalles.</em></span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Utiliza los enlaces que hay para encontrar información de referencia acerca de CSS.</span></span></p>
+
+<h2 id="Parte_I_del_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Parte I del tutorial </span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una guía paso a paso básica para CSS.</span></span></p>
+
+<ol>
+ <li><strong><a href="/es/docs/Web/CSS/Como_iniciar/Que_es_CSS" title="es/docs/Web/CSS/Como iniciar/Que es CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Qué es CSS</span></span></a></strong></li>
+ <li><strong><a href="/es/docs/Web/CSS/Como_iniciar/Por_que_usar_CSS" title="es/docs/Web/CSS/Como iniciar/Por que usar CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por qué usar CSS</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting Started/How CSS works"><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cómo funciona CSS</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Cascading_and_inheritance" title="en/CSS/Getting Started/Cascading and inheritance"><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Cascada y herencia</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Selectors" title="en/CSS/Getting Started/Selectors"><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Selectores</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Readable_CSS" title="en/CSS/Getting Started/Readable CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">CSS legibles </span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Text_styles" title="en/CSS/Getting Started/Text styles"><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Estilos de texto</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Color" title="en/CSS/Getting_Started/Color">Color</a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Content" title="en/CSS/Getting Started/Content"><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-99 goog-gtc-translatable" dir="ltr">Contenido</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Lists" title="en/CSS/Getting Started/Lists"><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Listas</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Boxes" title="en/CSS/Getting Started/Boxes"><span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Cajas</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Layout" title="en/CSS/Getting Started/Layout"><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Diseño</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/Tables" title="en/CSS/Getting Started/Tables"><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Tablas</span></span></a></strong></li>
+ <li><strong><a href="/es/docs/Web/CSS/Introducción/Media" title="es/docs/Web/CSS/Introducción/Media"><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Multimedia</span></span></a></strong></li>
+</ol>
+
+<h2 id="Parte_II_del_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Parte II del tutorial</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Ejemplos que muestran el ámbito de aplicación de CSS en Mozilla.</span></span></p>
+
+<ol>
+ <li><strong><a href="/en/CSS/Getting_Started/JavaScript" title="en/CSS/Getting Started/JavaScript"><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">JavaScript</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/XBL_bindings" title="en/CSS/Getting Started/XBL bindings"><span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Enlaces XBL</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/XUL_user_interfaces" title="en/CSS/Getting Started/XUL user interfaces"><span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Interfaces de usuario XUL</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/SVG_graphics" title="en/CSS/Getting Started/SVG graphics"><span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Gráficos SVG</span></span></a></strong></li>
+ <li><strong><a href="/en/CSS/Getting_Started/XML_data" title="en/CSS/Getting Started/XML data"><span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Datos XML</span></span></a></strong></li>
+</ol>
+
+<p>{{ languages( { "en": "en/CSS/Getting_Started", "de": "de/CSS/Einführung", "fr": "fr/CSS/Premiers_pas", "it": "it/Conoscere_i_CSS", "ja": "ja/CSS/Getting_Started", "nl": "nl/CSS/Voor_Beginners", "pl": "pl/CSS/Na_pocz\u0105tek", "pt": "pt/CSS/Como_come\u00e7ar", "zh-cn": "cn/CSS/\u5f00\u59cb" } ) }}</p>
diff --git a/files/es/conflicting/learn/css/styling_text/fundamentals/index.html b/files/es/conflicting/learn/css/styling_text/fundamentals/index.html
new file mode 100644
index 0000000000..19c967bb6c
--- /dev/null
+++ b/files/es/conflicting/learn/css/styling_text/fundamentals/index.html
@@ -0,0 +1,157 @@
+---
+title: Los estilos de texto
+slug: conflicting/Learn/CSS/Styling_text/Fundamentals
+translation_of: Learn/CSS/Styling_text/Fundamentals
+translation_of_original: Web/Guide/CSS/Getting_started/Text_styles
+original_slug: Web/CSS/Introducción/Los:estilos_de_texto
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Esta es la sección séptima del</span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> tutorial</span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="es-es / docs / Web / guía / CSS / Primeros pasos"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS Introducción</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> ; </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">da más ejemplos de estilos de texto.</span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Usted modificara su hoja de estilo de ejemplo para utilizar diferentes fuentes.</span></font></font></p>
+
+<h2 class="clearLeft" id="Los_estilos_de_texto_Información"><span id="result_box" lang="es"><span class="hps">Los estilos de texto</span><span>: Información</span></span></h2>
+
+<p><span id="result_box" lang="es"><span class="hps">CSS</span> <span class="hps">tiene varias propiedades</span> <span class="hps">de</span> </span><span id="result_box" lang="es"><span class="hps">estilo</span><span> de </span></span><span id="result_box" lang="es"><span class="hps">texto</span> <span>.</span></span></p>
+
+<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Hay una propiedad abreviada conveniente, </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">la fuente</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> , que se puede utilizar para especificar varios aspectos a la vez, por ejemplo:</span></font></font></p>
+
+<ul style="margin: 0px 0px 24px; padding: 0px 0px 0px 40px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);">
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Negrita, cursiva, y small-caps (versalita)</span></font></font></li>
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">El tamaño</span></font></font></li>
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">La altura de la línea</span></font></font></li>
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">El tipo de letra</span></font></font></li>
+</ul>
+
+<div class="tuto_example">
+<div class="tuto_type">
+<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ejemplo</span></font></font></div>
+
+<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token selector" style="margin: 0px; padding: 0px; border: 0px; color: rgb(102, 153, 0);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">p </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">{ </span></font></font></span><span class="token property" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 0, 85);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">fuente </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">:</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> cursiva 75% / 125% </span></font></font><span class="token string" style="margin: 0px; padding: 0px; border: 0px; color: rgb(166, 127, 89); background: rgba(255, 255, 255, 0.498039);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">"Comic Sans MS"</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> , cursive </span></font></font><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">; </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">}</span></font></font></span></code></pre>
+</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Esta regla</span> <span class="hps">establece</span> varias <span class="hps">propiedades de la fuente</span><span class="alt-edited">, poniendo</span> <span class="hps">todos los párrafos</span> <span class="hps">en</span></span> italic.</p>
+
+<p><span id="result_box" lang="es"><span class="hps">El tamaño de fuente</span> <span class="hps">se establece en</span> <span class="hps">tres cuartas partes del</span> <span class="hps">tamaño</span> </span><span id="result_box" lang="es"><span class="hps">en </span><span class="hps">cada</span></span><span id="result_box" lang="es"> </span><span id="result_box" lang="es"><span class="hps">párrafo</span><span> </span></span><span id="result_box" lang="es"><span class="hps alt-edited">del elemento padre</span><span>,</span>  <span class="hps">y</span> <span class="hps alt-edited">el</span> <span class="hps alt-edited">interlíneado</span> <span class="hps">se establece en</span> <span class="hps">125</span><span class="atn">% (</span><span>un poco más</span> <span class="hps">separados</span> <span class="hps">de lo normal)</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps">tipo de letra</span> <span class="hps">se establece en</span> <span class="hps">Comic</span> <span class="hps">Sans</span> <span class="hps">MS</span><span>,</span> <span class="hps">pero si</span> <span class="hps">este tipo de letra</span> <span class="hps">no está disponible,</span> <span class="hps">el navegador</span> <span class="hps">utilizará</span> <span class="hps alt-edited">por</span> <span class="hps">defecto</span> <span class="hps">tipografía</span> <span class="hps">cursiva</span> <span class="hps">(</span></span>hand-written<span lang="es"><span>)</span><span>.</span></span></p>
+
+<p><span lang="es"><span class="hps">La</span> <span class="hps">regla tiene</span> <span class="hps alt-edited">el efecto colateral</span> <span class="hps alt-edited">de desactivar</span> <span class="hps alt-edited">las</span> <span class="hps alt-edited">versalitas</span> <span class="hps">y</span> <span class="hps alt-edited">negritas</span> <span class="hps atn">(</span><span>estableciendo su valor </span><span class="hps alt-edited">en normal)</span><span>:</span></span></p>
+</div>
+
+<h3 id="Tipos_de_fuentes"><span id="result_box" lang="es"><span class="hps alt-edited">Tipos de fuentes</span></span></h3>
+
+<p><span id="result_box" lang="es"><span class="hps">No se puede predecir</span> <span class="hps">qué</span> tipografías </span><span id="result_box" lang="es"><span class="hps alt-edited">tienen</span><span> </span></span><span id="result_box" lang="es"><span class="hps alt-edited">los lectores de</span> nuestro <span class="hps">documento</span> <span>.</span> <span class="hps">Así que</span> <span class="hps alt-edited">cuando se especifica</span> <span class="hps alt-edited">llos tipos de fuentes </span><span class="hps alt-edited">de las </span><span class="hps alt-edited">letra</span><span>s</span><span>, es</span> <span class="hps">buena</span> <span class="hps alt-edited">idea darle</span> <span class="hps alt-edited">una lista alternativa</span> <span class="hps">en orden de preferencia</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps alt-edited">Finalice la</span> <span class="hps">lista</span> <span class="hps">con uno de los</span> <span class="hps alt-edited">las tipografías</span> por defecto<span class="hps alt-edited">:</span> </span><code>serif</code>, <code>sans-serif</code>, <code>cursive</code>, <code>fantasy</code> or <code>monospace</code>.</p>
+
+<p><span lang="es"><span class="hps">Si el</span> <span class="hps">tipo de letra</span> <span class="hps alt-edited">no es compatible con</span> <span class="hps alt-edited">alguna de los caracteres</span> <span class="hps alt-edited">del documento</span><span>, el navegador</span> <span class="hps alt-edited">puede sustituirlos por</span> <span class="hps alt-edited">una tipografía</span> <span class="hps">diferente.</span> <span class="hps">Por ejemplo, el</span> <span class="hps">documento puede contener</span> <span class="hps">caracteres especiales que</span> </span><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">el tipo de letra no admite.</span><span lang="es"> <span class="hps">Si</span> <span class="hps">el navegador puede</span> <span class="hps">encontrar otro</span> <span class="hps alt-edited">tipografía que</span> <span class="hps">tiene esos</span> <span class="hps">caracteres</span><span>,</span> <span class="hps alt-edited">entonces usará</span> <span class="hps">otro</span> <span class="hps alt-edited">tipo de fuente</span></span></p>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar un tipo de letra por sí misma, utilizar el </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-family" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-family</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> propiedad.</span></font></font></p>
+
+<h3 id="Los_tamaños_de_la_fuente"><span id="result_box" lang="es"><span title="Font sizes
+
+">Los tamaños de la fuente</span></span></h3>
+
+<p><span id="result_box" lang="es"><span title="Browser users can override the default font sizes or change the text size while they read a page, so it makes good sense for you to use relative sizes wherever you can.
+">Los usuarios de navegadores pueden anular los tamaños de fuente por defecto o cambiar el tamaño del texto mientras leen una página, así que tiene buen sentido utilizar tamaños relativos donde se pueda.</span></span></p>
+
+<p><span id="result_box" lang="es"><span title="You can use some built-in values for font sizes, like small, medium and large.">Puede utilizar algunos valores incorporados para tamaños de fuentes,  </span></span><code>like</code> <code>small</code>, <code>medium</code> and <code>large</code> (<span id="result_box" lang="es"><span title="You can use some built-in values for font sizes, like small, medium and large.">pequeñas, medianas y grandes)</span></span> . <span id="result_box" lang="es"><span title="You can also use values relative to the font size of the parent element, like: smaller, larger, 150% or 1.5em.">También puede utilizar valores relativos al tamaño de fuente del elemento padre, </span></span>l<code>ike</code><code>: smaller, larger, 150% or 1.5em</code>. ( <span id="result_box" lang="es"><span title="You can also use values relative to the font size of the parent element, like: smaller, larger, 150% or 1.5em.">más pequeño, más grande, 150% o 1.5em.)</span></span>. <span id="result_box" lang="es"><span title='An "em" is equivalent to the width of the letter "m" (for the font size of the parent element);'>Un "em" es equivalente a la anchura de la letra "m" (para el tamaño de fuente del elemento padre); </span><span title="thus 1.5em is one-and-a-half times the size of the font of the parent element.
+">así 1.5em es una vez y media el tamaño de la fuente del elemento padre.</span></span></p>
+
+<p><span id="result_box" lang="es"><span title="If necessary you can specify an actual size, like: 14px (14 pixels) for a display device or 14pt (14 points) for a printer.">Si es necesario, puede especificar como tamaño actual, : 14px (14 píxeles) para un dispositivo de visualización o 14pt (14 puntos) para una impresora.</span></span><span lang="es"><span title="If necessary you can specify an actual size, like: 14px (14 pixels) for a display device or 14pt (14 points) for a printer."> Esto no es accesible para los usuarios con discapacidad visual, ya que no les permite cambiar el tamaño. Una estrategia más accesible es establecer un valor incorporado como mediano en un elemento en la parte superior del documento, y luego fijar tamaños relativos a todos los elementos descendientes.</span></span></p>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar un tamaño de fuente por su cuenta, utilice el </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-size" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-size</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> propiedad.</span></font></font></p>
+
+<h3 id="Altura_de_línea">Altura de línea</h3>
+
+<p><span id="result_box" lang="es"><span class="hps alt-edited">El</span> <span class="hps alt-edited">interlíneado</span> <span class="hps">especifica el</span> <span class="hps">espacio entre líneas</span><span>.</span> <span class="hps">Si el documento tiene</span> <span class="hps">párrafos largos</span> <span class="hps">con</span> <span class="hps">muchas líneas</span><span>,</span> <span class="hps">una separación</span> <span class="hps">más grande de lo</span> <span class="hps">normal,</span> <span class="hps">hace que sea</span> <span class="hps">más fácil de leer</span><span>, especialmente si el</span> <span class="hps">tamaño de la letra</span> <span class="hps">es pequeña</span><span>.</span></span></p>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar una altura de línea por su cuenta, utilice <code>la </code></span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">propiedad </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/line-height" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">line-height</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> .</span></font></font></p>
+
+<h3 id="Decoración">Decoración</h3>
+
+<p><span id="result_box" lang="es"><span class="hps alt-edited">La</span> <span class="hps">propiedad independiente </span></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">text-decoration</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> </span></font></font><span lang="es"><span class="hps">puede</span> <span class="hps">especificar otros</span> <span class="hps">estilos,</span> <span class="hps">como el</span> <span class="hps">subrayado o</span> <span class="hps">tachado</span><span>.</span> <span class="hps">Usted</span> <span class="hps alt-edited">puede establecerlo en</span> <span class="hps">ninguno</span> ( </span><code>none</code> ) <span lang="es"> <span class="hps alt-edited">para eliminar</span> <span class="hps alt-edited">expresamente</span> <span class="hps">cualquier</span> <span class="hps">decoración.</span></span></p>
+
+<h3 id="Otras_propiedades">Otras propiedades</h3>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar cursiva por su cuenta, use </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-style" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-style</span></font></font></code></a><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> : italic;</span></font></font></code><br>
+ <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar audaz por su cuenta, use </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-weight</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> : bold;</span></font></font></code><br>
+ <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar los pequeños capitales en su propio, el uso </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-variant</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> : small-caps;</span></font></font></code></p>
+
+<p>Para desactivar o activar cualquiera de estos valores de forma individual, puede especificar su valor como <code>normal</code> <code>o inherit</code>.</p>
+
+<div class="tuto_details">
+<div class="tuto_type">Mas detalles</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Puede especificar</span> <span class="hps">estilos de texto</span> <span class="hps alt-edited">de diversas</span> <span class="hps alt-edited">maneras.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Por ejemplo</span><span>,</span> <span class="hps">algunas de las</span> <span class="hps">propiedades mencionadas</span> <span class="hps">aquí</span> <span class="hps">tienen</span> <span class="hps">otros valores</span> <span class="hps">que se pueden utilizar</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">una hoja de estilo</span> <span class="hps">compleja</span><span>,</span> <span class="hps alt-edited">evite utilizar</span> <span class="hps alt-edited">la propiedad </span></span><code>font</code> <code>shorthand</code><span lang="es"><span class="hps">,</span> <span class="hps">debido a sus</span> <span class="hps">efectos secundarios</span> <span class="hps">(resetean </span><span class="hps">otras propiedades</span> <span class="hps">individuales</span><span>)</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps alt-edited">Para obtener mas detalles de</span> <span class="hps">las propiedades</span> <span class="hps">que se relacionan con</span> <span class="hps">las fuentes, </span></span><span lang="es"><span class="hps">ver</span></span><span lang="es"><span class="hps"> las </span><span class="hps">especificación</span>es <span class="hps">CSS</span></span><span lang="es"> </span><span id="result_box" lang="es"><span class="hps">, </span></span><a class="external" href="http://www.w3.org/TR/CSS21/fonts.html">Fonts</a><span lang="es"><span class="hps">,</span><span>.</span> <span class="hps alt-edited">Si desea más detalles sobre</span> <span class="hps">la decoración de</span> <span class="hps">texto,</span> <span class="hps">ver</span> </span><a class="external" href="http://www.w3.org/TR/CSS21/text.html">Text </a><span lang="es"><span class="hps">.</span></span></p>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Si no quiere depender de los tipos de letra instalados en los sistemas de los usuarios, puede usar </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(244, 244, 244);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">@ font-face</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> para especificar una fuente en línea. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Sin embargo, esto requiere que los usuarios tengan un navegador que soporte esta regla.</span></font></font></p>
+</div>
+
+<h2 id="Acción_Especificaciónes_de_las_fuentes"><span id="result_box" lang="es"><span>Acción:</span> <span class="hps">Especificaciónes de</span> <span class="hps">las fuentes</span></span></h2>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para un simple documento, puede establecer la fuente del </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="El HTML &lt;body> representa el contenido de un documento HTML.  Sólo hay un elemento &lt;body> en un documento."><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">elemento  </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">&lt;body&gt;</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> y el resto del documento hereda la configuración.</span></font></font></p>
+
+<ol>
+ <li><span id="result_box" lang="es"><span class="hps">Edite su archivo</span> <span class="hps">CSS</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps alt-edited">Agregue</span> <span class="hps">la siguiente regla</span> <span class="hps">para cambiar</span> <span class="hps">el tipo de letra</span> <span class="hps">en todo el documento</span><span>.</span> <span class="hps">La</span> <span class="hps">parte superior del archivo</span> <span class="hps">CSS</span> <span class="hps">es</span> <span class="hps alt-edited">el lugar lógico</span> <span class="hps alt-edited">para esto</span><span>, pero no tiene</span> <span class="hps alt-edited">los mismos efectos</span> <span class="hps">donde</span> <span class="hps alt-edited">usted lo ponga</span><span>:</span></span>
+  <pre class="eval  language-html"><code class="language-html">body {font: 16px "Comic Sans MS", cursive;}</code></pre>
+
+  <div class="line-number" style="top: 0px;"> </div>
+ </li>
+ <li><span id="result_box" lang="es"><span class="hps alt-edited">Añada</span> <span class="hps">un comentario</span> <span class="hps alt-edited">que explique</span> <span class="hps">la regla, y</span> <span class="hps alt-edited">agregue un espacio en blanco</span> <span class="hps alt-edited">para que coincida con</span> <span class="hps">su diseño</span> <span class="hps">preferido</span><span>.</span></span></li>
+ <li><span id="result_box" lang="es"><span class="hps">Guarde el archivo y</span> <span class="hps alt-edited">actualice el explorador</span> <span class="hps">para ver el efecto</span><span>.</span> <span class="hps">Si su sistema tiene</span> <span class="hps">Comic</span> <span class="hps">Sans</span> <span class="hps">MS</span><span>,</span> <span class="hps">u otra</span> <span class="hps">fuente cursiva</span> <span class="hps">que no</span> <span class="hps">soporta </span></span>italic<span lang="es"><span class="hps">,</span> <span class="hps">su navegador</span> eligira <span class="hps">un</span> <span class="hps">tipo de letra</span> <span class="hps">diferente para </span></span><span lang="es"><span class="hps alt-edited">la</span> <span class="hps alt-edited">primera línea</span></span><span lang="es"><span class="hps"> del</span> <span class="hps">texto en </span></span>italic<span lang="es"><span class="hps alt-edited">:</span></span>
+  <table style="border: 2px outset #36b; padding: 1em;">
+   <tbody>
+    <tr>
+     <td style="font: italic 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
+    </tr>
+    <tr>
+     <td style="font: 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
+    </tr>
+   </tbody>
+  </table>
+ </li>
+ <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Desde la barra de menú de su navegador, elija </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver&gt; Tamaño del texto&gt; Aumentar</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> (o </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver&gt; Zoom&gt; Acercar</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> ). </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">A pesar de que ha especificado 16 píxeles en el estilo, un usuario leer el documento se puede cambiar este tamaño.</span></font></font></li>
+</ol>
+
+<div class="tuto_example">
+<div class="tuto_type">Desafío</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Sin modificar nada más</span><span>,</span> <span class="hps">hacer</span> <span class="hps">las seis</span> <span class="hps">letras iniciales</span> <span class="hps">dos veces el tamaño</span> <span class="hps">de</span> <span class="hps">letra serif</span> <span class="hps">por defecto del navegador</span><span>:</span></span></p>
+
+<table>
+ <tbody>
+  <tr>
+   <td style="font: italic 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red; font: 200% serif;">C</strong>ascading <strong style="color: green; font: 200% serif;">S</strong>tyle <strong style="color: green; font: 200% serif;">S</strong>heets</td>
+  </tr>
+  <tr>
+   <td style="font: 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red; font: 200% serif;">C</strong>ascading <strong style="color: red; font: 200% serif;">S</strong>tyle <strong style="color: red; font: 200% serif;">S</strong>heets</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="tuto_details" id="tutochallenge">
+<div class="tuto_type">Possible solution</div>
+
+<p>Add the following style declaration to the <code>strong</code> rule:</p>
+
+<pre class="brush: css">  font: 200% serif;
+</pre>
+If you use separate declarations for <code>font-size</code> and <code>font-family</code>, then the <code>font-style</code> setting on the first paragraph is <em>not</em> overridden.
+
+<p> </p>
+<a class="hideAnswer" href="#challenge">Hide solution</a></div>
+<a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Text_styles#tutochallenge" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-size: 12px; text-align: right; display: block; font-family: 'Open Sans', sans-serif; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; white-space: normal;" title="Mostrar una posible solución para el desafío"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver una solución para el desafío.</span></font></font></a></div>
+
+<h2 id="¿Y_ahora_qué"><span id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
+
+<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">El documento muestra ya utiliza varios colores con nombre. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">La </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="/ En-US / docs / Web / guía / CSS / Getting_Started / Color"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">siguiente sección</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> enumera los nombres de los colores estándar y se explica cómo se puede especificar otros </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">.</span></font></font></strong></p>
+
+<p> </p>
diff --git a/files/es/conflicting/learn/forms/index.html b/files/es/conflicting/learn/forms/index.html
new file mode 100644
index 0000000000..03824f9932
--- /dev/null
+++ b/files/es/conflicting/learn/forms/index.html
@@ -0,0 +1,367 @@
+---
+title: Formularios HTML
+slug: conflicting/Learn/Forms
+tags:
+  - Featured
+  - Forms
+  - Formulario(2)
+  - Guide
+  - Guía
+  - HTML
+  - NeedsTranslation
+  - TopicStub
+  - Web
+translation_of: Learn/Forms
+original_slug: Learn/HTML/Forms
+---
+<p><span class="seoSummary">Esta guía está constituida por una serie de artículos que te ayudarán a dominar los formularios en HTML.   </span>El formulario HTML  es una herramienta  cuya finalidad es interactuar con el usuario; sin embargo, debido a razones históricas y técnicas, no siempre resulta obvio como explotar su enorme potencial. En esta guía, cubriremos todos los aspectos de los formularios HTML, desde su estructura hasta su estilo, desde la manipulación de sus datos hasta los <em>widgets</em> personalizados. ¡Aprenderás a disfrutar de las grandes prestaciones que nos brindan!</p>
+
+<h2 id="Artículos">Artículos</h2>
+
+<ol>
+ <li><a href="/en-US/docs/HTML/Forms/My_first_HTML_form" title="/en-US/docs/HTML/Forms/My_first_HTML_form">Mi primer formulario HTML</a></li>
+ <li><a href="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form" title="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form"><span>Cómo estructurar un formulario HTML</span></a></li>
+ <li><a href="/en-US/docs/HTML/Forms/The_native_form_widgets" title="/en-US/docs/HTML/Forms/The_native_form_widgets"><span>Los <em>widgets</em> nativos de formulario</span></a></li>
+ <li>CSS para formularios HTML
+  <ol>
+   <li><a href="/en-US/docs/HTML/Forms/Styling_HTML_forms" title="/en-US/docs/HTML/Forms/Styling_HTML_forms"><span>Aplicando estilos a formularios HTML</span></a></li>
+   <li><a href="/en-US/docs/Web/Guide/HTML/Forms/Advanced_styling_for_HTML_forms" title="/en-US/docs/Advanced_styling_for_HTML_forms">Estilos avanzados para formularios HTML</a></li>
+   <li><a href="/en-US/docs/Property_compatibility_table_for_form_widgets" title="/en-US/docs/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de propiedades para <em>widgets</em> de formulario</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data"><span>Enviando y recibiendo datos</span></a></li>
+ <li><a href="/en-US/docs/HTML/Forms/Data_form_validation" title="/en-US/docs/HTML/Forms/Data_form_validation">Validación de los datos del formulario</a></li>
+ <li><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets">Cómo crear un <em>widget</em> de formulario personalizado</a></li>
+ <li><a href="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript" title="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript">Enviando formularios mediante JavaScript</a>
+  <ol>
+   <li><a href="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects" title="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects">Usando el objeto FormData</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers" title="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers">Formularios HTML en navegadores antiguos</a></li>
+</ol>
+
+<h2 id="Documentación_HTML">Documentación HTML</h2>
+
+<h3 id="HTML_Elements">HTML Elements</h3>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Interfaz DOM relacionada</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("button")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLButtonElement")}}</td>
+   <td style="vertical-align: top;">El elemento  <code>button</code> representa un boton clickeable.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("datalist")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLDataListElement")}}</td>
+   <td style="vertical-align: top;">El elemento <span style="font-family: courier new;">datalist</span> element contiene un conjunto de elementos{{ HTMLElement("option") }} que representan posibles opciones para el valor de otros elementos del formulario.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("fieldset")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLFieldSetElement")}}</td>
+   <td style="vertical-align: top;">El  <span style="font-family: courier new;">fieldset</span> se usa para agrupar distintos elementos dentro de un formulario.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("form")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLFormElement")}}</td>
+   <td style="vertical-align: top;">El elemento  <code>form </code>representa una seccion del documento html que contiene elementos interactivos a traves de los cuales se le permite al usuario enviar informacion hacia un servidor web.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("input")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLInputElement")}}</td>
+   <td style="vertical-align: top;">El elemento   <code>input</code> es usado para crear controles interactivos para los formularios.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("keygen")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLKeygenElement")}}</td>
+   <td style="vertical-align: top;">El elemento <code>keygen</code> existe para facilitar la generación de llaves u el envío de las llaves publicas como parte de un formulario HTML.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("label")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLLabelElement")}}</td>
+   <td style="vertical-align: top;">El  <code>label</code> determina un título para un item de la interfaz del usuario.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("legend")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLLegendElement")}}</td>
+   <td style="vertical-align: top;">El elemento <code>legend</code>  representa una etiqueta para el contenido del elemento {{ HTMLElement("fieldset") }} que lo contiene.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("meter")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLMeterElement")}}</td>
+   <td style="vertical-align: top;">EL elemento <code>meter</code>  representa un valor escalar dentro de un rango conocido, o un valor fraccional.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("optgroup")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLOptGroupElement")}}</td>
+   <td style="vertical-align: top;">
+    <p>El elemento <code>optgroup</code> crea un grupo de opciones dentro de un elemento {{ HTMLElement("select") }} .</p>
+   </td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("option")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLOptionElement")}}</td>
+   <td style="vertical-align: top;">El elemento<em> </em><code>option<em> </em></code>es usado para crear un control de opcion que representa un item dentro de alguno de los elementos {{ HTMLElement("select") }}, {{ HTMLElement("optgroup") }} o {{ HTMLElement("datalist") }} .</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("output")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLOutputElement")}}</td>
+   <td style="vertical-align: top;">El elemento <code>output</code> representa un resultado de un calculo.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("progress")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLProgressElement")}}</td>
+   <td style="vertical-align: top;">El elemento <code>progress</code> es usado para mostrar el progreso de la realización de una tarea.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("select")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLSelectElement")}}</td>
+   <td style="vertical-align: top;">El elemento <code>select</code> representa el control que presenta un menu de opciones.</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{HTMLElement("textarea")}}</td>
+   <td style="vertical-align: top;">{{domxref("HTMLTextAreaElement")}}</td>
+   <td style="vertical-align: top;">EL elemento <code>textarea</code> representa un campo multi-linea de edicion de text plano.</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota:</strong> Todos los elementos de formulario, al igual que el resto de elementos HTML, soportan la interfaz DOM {{domxref("HTMLElement")}}.</p>
+</div>
+
+<h3 id="HTML_Attributes">HTML Attributes</h3>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th>Nombre del atributo</th>
+   <th>Elementos</th>
+   <th>Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>accept</td>
+   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
+   <td>Lista de tipos que acepta el servidor, típicamente un tipo de fichero.</td>
+  </tr>
+  <tr>
+   <td style="white-space: nowrap;">accept-charset</td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>Lista de <em>charsets </em>(conjuntos de caracteres) aceptados.</td>
+  </tr>
+  <tr>
+   <td>action</td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>La URI del programa con el que procesar la información enviada a mediante el formulario.</td>
+  </tr>
+  <tr>
+   <td>autocomplete</td>
+   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
+   <td>Indica si los controles en este formulario serán o no autocompletados por el navegador</td>
+  </tr>
+  <tr>
+   <td>autofocus</td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>El elemento debería poseer el foco automáticamente tras cargar  la página.</td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <td>challenge</td>
+   <td>{{ HTMLElement("keygen") }}</td>
+   <td>Una cadena de comprobación que es enviada junto con la clave pública.</td>
+  </tr>
+  <tr>
+   <td>checked</td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Indica si el elemento debe estar seleccionado (checked) tras cargar la página.</td>
+  </tr>
+  <tr>
+   <td>cols</td>
+   <td>{{ HTMLElement("textarea") }}</td>
+   <td>Define el número de columnas en un elemento de tipo textarea.</td>
+  </tr>
+  <tr>
+   <td>data</td>
+   <td>{{ HTMLElement("object") }}</td>
+   <td>Especifica la URL del recurso.</td>
+  </tr>
+  <tr>
+   <td>dirname</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>disabled</td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica si el usuario puede o no interactuar con el elemento.</td>
+  </tr>
+  <tr>
+   <td>enctype</td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>Define el tipo de contenido del formulario cuando el método de envío es POST.</td>
+  </tr>
+  <tr>
+   <td>for</td>
+   <td>{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td>
+   <td>
+    <p>Establece una asociación con otros elementos</p>
+   </td>
+  </tr>
+  <tr>
+   <td>form</td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica el elemento <strong>form</strong> que contiene este elemento.</td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <td>high</td>
+   <td>{{ HTMLElement("meter") }}</td>
+   <td>Indicates the lower bound of the upper range.</td>
+  </tr>
+  <tr>
+   <td>keytype</td>
+   <td>{{ HTMLElement("keygen") }}</td>
+   <td>Especifica el tipo de clave generada.</td>
+  </tr>
+  <tr>
+   <td>list</td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Determina una lista de opciones predefinidas para sugerir al usuario.</td>
+  </tr>
+  <tr>
+   <td>low</td>
+   <td>{{ HTMLElement("meter") }}</td>
+   <td>Indicates the upper bound of the lower range.</td>
+  </tr>
+  <tr>
+   <td>max</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
+   <td>Indica el máximo valor permitido.</td>
+  </tr>
+  <tr>
+   <td>maxlength</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Define el máximo número de caracteres permitidos en el elemento.</td>
+  </tr>
+  <tr>
+   <td>method</td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>
+    <p>Define qué método HTTP se usará al enviar el formulario. puede ser <strong>GET</strong> (por defecto) o <strong>POST</strong></p>
+   </td>
+  </tr>
+  <tr>
+   <td>min</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td>
+   <td>Indica el mínimo valor permitido.</td>
+  </tr>
+  <tr>
+   <td>multiple</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
+   <td>Indica si mútiples valores pueden ser introducidos en un input de tipo email o file.</td>
+  </tr>
+  <tr>
+   <td>name</td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Especifica el nombre del elemento. Este nombre se usará asociado al dato que contiene al enviar al servidor el formulario.</td>
+  </tr>
+  <tr>
+   <td>novalidate</td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>Indica que el formulario no debería validarse al momento de ser enviado.</td>
+  </tr>
+  <tr>
+   <td>optimum</td>
+   <td>{{ HTMLElement("meter") }}</td>
+   <td>Indica el valor numérico óptimo.</td>
+  </tr>
+  <tr>
+   <td>pattern</td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Establece la expresión regular con la que validar el valor del elemento.</td>
+  </tr>
+  <tr>
+   <td>placeholder</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Proporciona una pista al usuario de lo que el campo debe contener. Se muestra cuando el campo está vacío.</td>
+  </tr>
+  <tr>
+   <td>readonly</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica si el elemento se puede o no editar.</td>
+  </tr>
+  <tr>
+   <td>required</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Cuando un campo del formulario es requerido, el usuario no puede dejarlo vacío.</td>
+  </tr>
+  <tr>
+   <td>rows</td>
+   <td>{{ HTMLElement("textarea") }}</td>
+   <td>Defines the number of rows in a textarea.</td>
+  </tr>
+  <tr>
+   <td>selected</td>
+   <td>{{ HTMLElement("option") }}</td>
+   <td>En una lista de selección, la opción con el atributo selected será la que está seleccionada por defecto</td>
+  </tr>
+  <tr>
+   <td>size</td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
+   <td>Defina la anchura del elemento (en píxeles). Si el elemento es de tipo <strong>text</strong> o <strong>password</strong> el ancho se referirá al número de caracteres.</td>
+  </tr>
+  <tr>
+   <td>src</td>
+   <td>{{ HTMLElement("img") }}</td>
+   <td>El URL del recurso</td>
+  </tr>
+  <tr>
+   <td>step</td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Determina el incremento de cada paso con el que se cubre un rango desde un valor mínimo hasta un valor máximo.</td>
+  </tr>
+  <tr>
+   <td>target</td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>type</td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}</td>
+   <td>Determina el tipo del elemento.</td>
+  </tr>
+  <tr>
+   <td>usemap</td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>value</td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
+   <td>Establece el valor actual del elemento.</td>
+  </tr>
+  <tr>
+   <td>wrap</td>
+   <td>{{ HTMLElement("textarea") }}</td>
+   <td>Cuando un texto tiene una longitud mayor que el ancho del elemento sobre el que se muestra, determina si el elemento debe simular saltos de línea para que todo el texto quede visible en el elemento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Referencia_a_la_normativa">Referencia a la normativa</h3>
+
+<ul>
+ <li><a href="http://www.w3.org/html/wg/drafts/html/master/forms.html#forms" lang="en" rel="external" title="http://www.w3.org/TR/html5/forms.html">W3C HTML 5.1 Specification (Forms)</a></li>
+ <li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms" rel="external" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms">WHATWG HTML Living Standard (Forms)</a></li>
+</ul>
diff --git a/files/es/conflicting/learn/html/introduction_to_html/getting_started/index.html b/files/es/conflicting/learn/html/introduction_to_html/getting_started/index.html
new file mode 100644
index 0000000000..e6cd3db57d
--- /dev/null
+++ b/files/es/conflicting/learn/html/introduction_to_html/getting_started/index.html
@@ -0,0 +1,67 @@
+---
+title: La importancia de comentar correctamente
+slug: conflicting/Learn/HTML/Introduction_to_HTML/Getting_started
+tags:
+  - HTML
+  - Todas_las_Categorías
+  - XHTML
+  - XML
+translation_of: Learn/HTML/Introduction_to_HTML/Getting_started#HTML_comments
+translation_of_original: Web/Guide/HTML/The_Importance_of_Correct_HTML_Commenting
+original_slug: Web/HTML/La_importancia_de_comentar_correctamente
+---
+<p> </p>
+<p><br>
+ Cuando escribimos HTML en <a class="external" href="http://www.mozilla.org/docs/web-developer/quirks/doctypes.html">modo estándar</a>, los comentarios mal formados pueden romper las páginas, causando que los contenidos del documento sean parcial o totalmente comentados. Al escribir XHTML o XML, los comentarios incorrectos darán lugar a que sus documentos no puedan ser mostrados.</p>
+<h3 id="HTML_4.01" name="HTML_4.01">HTML 4.01</h3>
+<p>
+ <i>
+  De la <a class="external" href="http://html.conclase.net/w3c/html401-es/intro/sgmltut.html#h-3.2.4">Recomendación del W3C HTML 4.01 Sección 3.2.4 - Comentarios</a>:</i>
+</p>
+<blockquote>
+ No se permite espacio en blanco entre el delimitador de apertura de declaración de etiqueta ("&lt;!") y el delimitador de apertura de comentario ("--"), pero sí se permite entre el delimitador de cierre de comentario ("--" y el delimitador de cierre de declaración de etiqueta ("&gt;"). Un error común es incluir una cadena de guiones ("---") dentro de un comentario. Los autores deberían evitar *poner dos o más guiones adyacentes dentro de un comentario.</blockquote>
+<h4 id="Ejemplos" name="Ejemplos">Ejemplos</h4>
+<p>Los siguientes son comentarios válidos en HTML.</p>
+<pre class="eval">&lt;!-- comentario html válido --&gt;
+&lt;!-- comentario html válido -- &gt;
+</pre>
+<p>El siguiente no es un comentario válido en HTML.</p>
+<pre class="eval">&lt;!-- comentario html -- no válido --&gt;
+</pre>
+<h3 id="XML" name="XML">XML</h3>
+<p>
+ <i>
+  De la <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xml/xml1/index.html#sec-comments">Recomendación del W3C XML 1.0 Sección 2.5 - Comentarios</a>:</i>
+</p>
+<blockquote>
+ {{ mediawiki.external('Definición: Los comentarios pueden aparecer en cualquier lugar de un documento fuera de otras marcas; Adicionalmente pueden aparecer en lugares permitidos por la gramática. No son parte de los datos de caracter de un documento; un procesador de XML puede, pero no tiene que, hacer posible que la aplicación recupere el texto de comentarios.') }} Por compatibilidad, la cadena "--" (doble guión) no debe ocurrir dentro de comentarios.
+ <pre>[15] Comment ::= '&lt;!--' ((Char - '-') | ('-' (Char - '-')))* '--&gt;'
+</pre>
+</blockquote>
+<p>Según lo descrito en la gramática de XML sobre comentarios, un comentario tiene la siguiente forma:</p>
+<pre class="eval">&lt;!-- cualquier letra o signo, menos guiones seguidos --&gt;
+</pre>
+<h4 id="Ejemplos_2" name="Ejemplos_2">Ejemplos</h4>
+<p>El siguiente es un comentario válido en XML y XHTML.</p>
+<pre class="eval">&lt;!-- comentario xml/xhtml válido --&gt;
+</pre>
+<p>Los siguientes son comentarios no válidos en XML y XHTML.</p>
+<pre class="eval">&lt;!-- comentario xml -- no válido --&gt;
+&lt;!-- comentario xml no válido ---&gt;
+&lt;!-- comentario xml no válido -- &gt;
+</pre>
+<h3 id="Otras_lecturas" name="Otras_lecturas">Otras lecturas</h3>
+<ul>
+ <li><a class="external" href="http://html.conclase.net/w3c/html401-es/intro/sgmltut.html#h-3.2.4">Recomendación HTML 4.01: 3.2.4 - Comentarios</a></li>
+ <li><a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xml/xml1/index.html#sec-comments">Recomendación XML: 2.5 - Comentarios</a></li>
+ <li><a class="external" href="http://bugzilla.mozilla.org/show_bug.cgi?id=144432">Bugzilla bug 144432</a></li>
+ <li><a class="external" href="http://bugzilla.mozilla.org/show_bug.cgi?id=102127">Bugzilla bug 102127</a></li>
+</ul>
+<div class="originaldocinfo">
+ <h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3>
+ <ul>
+  <li>Last Updated Date: May 19th, 2003</li>
+  <li>Copyright © 2001-2003 Netscape. All rights reserved.</li>
+ </ul>
+</div>
+<p> </p>
diff --git a/files/es/conflicting/learn/html/multimedia_and_embedding/video_and_audio_content/index.html b/files/es/conflicting/learn/html/multimedia_and_embedding/video_and_audio_content/index.html
new file mode 100644
index 0000000000..5598eb90bd
--- /dev/null
+++ b/files/es/conflicting/learn/html/multimedia_and_embedding/video_and_audio_content/index.html
@@ -0,0 +1,288 @@
+---
+title: Usando audio y video con HTML5
+slug: conflicting/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
+tags:
+  - Flash
+  - Ogg
+  - applet
+  - busqueda
+  - errores
+  - especificacion
+  - gestion
+  - opciones
+  - reproduccion
+  - reserva
+translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
+translation_of_original: Web/Guide/HTML/Using_HTML5_audio_and_video
+original_slug: Web/HTML/Usando_audio_y_video_con_HTML5
+---
+<p>HTML5 introduce soporte integrado para el contenido multimedia gracias a los elementos {{ HTMLElement("audio") }} y {{ HTMLElement("video") }}, ofreciendo la posibilidad de insertar contenido multimedia en documentos HTML.</p>
+
+<h2 id="Insertando_contenido_multimedia">Insertando contenido multimedia</h2>
+
+<p>Insertar contenido multimedia en tus documentos HTML es muy sencillo:</p>
+
+<div style="overflow: hidden;">
+<pre class="brush: html">&lt;video src="http://v2v.cc/~j/theora_testsuite/320x240.ogg" controls&gt;
+  Tu navegador no implementa el elemento &lt;code&gt;video&lt;/code&gt;.
+&lt;/video&gt;</pre>
+
+<p>Este ejemplo reproduce un vídeo de ejemplo, con los controles de reproducción, desde el sitio Web de Theora.</p>
+
+<p>Este es un ejemplo para insertar <em>audio</em> en tu documento HTML</p>
+
+<pre class="brush: html">&lt;audio src="/test/audio.ogg"&gt;
+&lt;p&gt;Tu navegador no implementa el elemento audio.&lt;/p&gt;
+&lt;/audio&gt;</pre>
+</div>
+
+<p>El atributo <code>src</code> puede ser una URL del archivo de audio o la ruta al archivo en el sistema local.</p>
+
+<div style="overflow: hidden;">
+<pre class="brush: html">&lt;audio src="audio.ogg" controls autoplay loop&gt;
+&lt;p&gt;Tu navegador no implementa el elemento audio&lt;/p&gt;
+&lt;/audio&gt;</pre>
+</div>
+
+<p>Este código de ejemplo usa los atributos del elemento {{ HTMLElement("audio") }}:</p>
+
+<ul>
+ <li><code>controls</code> : muestra los controles estándar de HTML5 para audio en una página web.</li>
+ <li><code>autoplay</code> : hace que el audio se reproduzca automáticamente.</li>
+ <li><code>loop</code> : hace que el audio se repita automáticamente.</li>
+</ul>
+
+<div style="overflow: hidden;">
+<pre class="brush: html">&lt;audio src="audio.mp3" preload="auto" controls&gt;&lt;/audio&gt;</pre>
+</div>
+
+<p>El atributo <code>preload</code> es usado en el elemento audio para almacenar temporalmente (buffering) archivos de gran tamaño. Este puede tomar uno de 3 valores:</p>
+
+<ul>
+ <li><code>"none"</code> no almacena temporalmente el archivo</li>
+ <li><code>"auto"</code> almacena temporalmente el archivo multimedia</li>
+ <li><code>"metadata"</code> almacena temporalmente sólo los metadatos del archivo</li>
+</ul>
+
+<p>Se pueden especificar múltiples fuentes de archivos usando el elemento {{ HTMLElement("source") }} <span id="result_box" lang="es"><span class="hps">con el fin de</span> <span class="hps">proporcionar vídeo</span> <span class="hps">o</span> <span class="hps">audio</span> <span class="hps">codificados en formatos</span> <span class="hps">diferentes</span> <span class="hps">para</span> <span class="hps">diferentes navegadores</span></span>. Por ejemplo:</p>
+
+<pre class="brush: html">&lt;video controls&gt;
+  &lt;source src="foo.ogg" type="video/ogg"&gt;
+  &lt;source src="foo.mp4" type="video/mp4"&gt;
+  Tu navegador no implementa el elemento &lt;code&gt;video&lt;/code&gt;.
+&lt;/video&gt;
+</pre>
+
+<p>Esto reproduce el archivo Ogg en navegadores que admiten el formato Ogg. Si el navegador no admite Ogg, el navegador usará el archivo MPEG-4. Mira también la lista de <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements" title="Media formats supported by the audio and video elements">los formatos multimedia admitidos por los elementos audio y video</a> en los diferentes navegadores.</p>
+
+<p>También puedes especificar qué codecs requiere el archivo multimedia; de esta forma el navegador tomará decisiones más inteligentes:</p>
+
+<pre class="brush: html">&lt;video controls&gt;
+  &lt;source src="foo.ogg" type="video/ogg; codecs=dirac, speex"&gt;
+  Tu navegador no implementa el elemento &lt;code&gt;video&lt;/code&gt;.
+&lt;/video&gt;</pre>
+
+<p>Aquí, especificamos que el vídeo usa los codecs Dirac y Speex. Si el navegador implementa Ogg, pero no los codecs especificados, el vídeo no será cargado.</p>
+
+<p>Si el atributo <code>type</code> no está especificado, el tipo de contenido multimedia se obtiene del servidor <span id="result_box" lang="es"><span class="hps">y</span> se <span class="hps">comprueba para</span> <span class="hps">ver</span> <span class="hps">si el navegador</span> <span class="hps">lo puede manejar</span></span>; si no puede ser mostrado, se comprueba el siguiente <code>source</code> , si ninguno de los elementos <code>source</code> especificados pueden ser usados, un evento de <code>error</code> es enviado al elemento <code>video</code>. Si el atributo <code>type</code> está especificado, es comparado con los tipos que el navegador puede reproducir, y si no es reconocido, no se hace la consulta al servidor; en su lugar, el siguiente <code>source</code> se comprueba una vez.</p>
+
+<p>Mira <a href="/en-US/docs/DOM/Media_events" title="https://developer.mozilla.org/en/DOM/Media_events">los eventos del contenido multimedia</a> para una lista completa de eventos asociados con la producción multimedia. Para detalles en los formatos multimedia soportados por los diferentes navegadores, mira <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements" title="Media formats supported by the audio and video elements">los formatos multimedia sportados por los elementos audio y video</a>.</p>
+
+<h2 id="Controlando_la_reproducción_multimedia">Controlando la reproducción multimedia</h2>
+
+<p>Una vez que has incrustado el contenido multimedia en tu documento HTML usando los nuevos elementos, puedes controlarlos mediante programación en JavaScript. Por ejemplo, para iniciar (o reiniciar) la reproducción, puedes hacer esto:</p>
+
+<pre class="brush: js">var v = document.getElementsByTagName("video")[0];
+v.play();
+</pre>
+
+<p>La primera línea obtiene el primer elemento video en el documento, y la segunda línea llama al método <a href="/en-US/docs/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement#play()" title="nsIDOMHTMLMediaElement#play()"><code>play()</code></a> del elemento, como está definido en la interfaz {{ interface("nsIDOMHTMLMediaElement") }} que es usada para implementar los elementos multimedia.</p>
+
+<p>Controlar un reproductor de audio en HTML5 para reproducir, pausar, aumentar y disminuir el volumen usando algo de Javascript es muy sencillo.</p>
+
+<pre class="brush: html">&lt;audio id="demo" src="audio.mp3"&gt;&lt;/audio&gt;
+&lt;div&gt;
+  &lt;button onclick="document.getElementById('demo').play()"&gt;Reproducir el Audio&lt;/button&gt;
+  &lt;button onclick="document.getElementById('demo').pause()"&gt;Pausar el Audio&lt;/button&gt;
+  &lt;button onclick="document.getElementById('demo').volume+=0.1"&gt;Aumentar el Volumen&lt;/button&gt;
+  &lt;button onclick="document.getElementById('demo').volume-=0.1"&gt;Disminuir el Volumen&lt;/button&gt;
+&lt;/div&gt;
+</pre>
+
+<h2 id="Deteniendo_la_descarga_de_contenido_multimedia">Deteniendo la descarga de contenido multimedia</h2>
+
+<p>Mientras que detener la reproducción multimedia es tan fácil como llamar al método pause() del elemento, el navegador sigue descargando el contenido multimedia hasta que el elemento multimedia es eliminado <span id="result_box" lang="es"><span class="hps">a través de</span> <span class="hps">la recolección de basura</span></span>.</p>
+
+<p>Aquí un truco para detener la descarga de una sola vez:</p>
+
+<pre class="brush: js">var mediaElement = document.getElementById("myMediaElementID");
+mediaElement.pause();
+mediaElement.src = "";
+</pre>
+
+<p>Estableciendo una cadena vacía al atributo <code>src</code> del elemento multimedia, tu destruyes el decodificador interno del elemento con lo que detienes la descarga.</p>
+
+<h2 id="Buscando_a_través_de_los_medios" style="margin: 0px 0px 0.8em; padding: 0px;">Buscando a través de los medios</h2>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><font>Los elementos de los medios proporcionan apoyo para mover la posición de reproducción actual a puntos específicos en el contenido de los medios. </font>Esto se hace estableciendo el valor de la propiedad <code style="font-size: 14px;">horaActual</code> en el elemento; ver <a class="new" href="https://developer.mozilla.org/es/docs/Web/API/HTMLMediaElement" title="/ Es / docs / Web / API / HTMLMediaElement"><code style="font-size: 14px;">HTMLMediaElement</code></a> para más detalles sobre las propiedades del elemento. Basta con establecer el valor en el tiempo, en segundos, con el que desea reproducir para continuar.</p>
+
+<p><span style="line-height: 1.5em;">Usted puede utilizar el elemento </span><code style="font-size: 14px;">seekable</code><span style="line-height: 1.5em;"> propiedad para determinar los rangos de los medios de comunicación que están disponibles para la búsqueda de la actualidad. Esto devuelve un objeto </span><a class="new" href="https://developer.mozilla.org/es/docs/Web/API/TimeRanges" style="line-height: 1.5em;" title="/ Es / docs / Web / API / TimeRanges"><code style="font-size: 14px;">TimeRanges</code></a><span style="line-height: 1.5em;"> que enumera los rangos de veces que se puede tratar de:</span></p>
+
+<pre class="brush: js">var mediaElement = document.getElementById('mediaElementID');
+mediaElement.seekable.start();  // Returns the starting time (in seconds)
+mediaElement.seekable.end();    // Returns the ending time (in seconds)
+mediaElement.currentTime = 122; // Seek to 122 seconds
+mediaElement.played.end();      // Returns the number of seconds the browser has played
+</pre>
+
+<h2 id="Especificación_del_rango_de_reproducción" style="margin: 0px 0px 0.8em; padding: 0px;"><font>Especificación del rango de reproducción</font></h2>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Al especificar el URI de los medios de comunicación para un elemento <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/audio"><code style="font-size: 14px;">&lt;audio&gt;</code></a> o <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/video"><code style="font-size: 14px;">&lt;video&gt;</code></a> , puede incluir opcionalmente información adicional para especificar la parte de los medios a reproducir. Para ello, añada una almohadilla ("#"), seguida de la descripción del fragmento de medios.</p>
+
+<p><span style="line-height: 1.5em;">Un intervalo de tiempo se especifica mediante la sintaxis:</span></p>
+
+<pre>#t=[starttime][,endtime]</pre>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><font>El tiempo se puede especificar como un número de segundos (como un valor de punto flotante) o como una hora / minuto / segundo tiempo separado con dos puntos (por ejemplo, 2:05:01 durante 2 horas, 5 minutos y 1 segundo).</font></p>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Algunos ejemplos:</p>
+
+<dl>
+</dl>
+
+<dl>
+ <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t = 10,20</span></dt>
+ <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo debe desempeñar el rango de 10 segundos a través de 20 segundos.</dd>
+ <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t =, 10.5</span></dt>
+ <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo se reproducirá desde el principio a través de 10,5 segundos.</dd>
+ <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t =, 02:00:00</span></dt>
+ <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo se reproducirá desde el principio a través de dos horas.</dd>
+ <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t = 60</span></dt>
+ <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo se debe reproducir desde los 60 segundos hasta el final.</dd>
+</dl>
+
+<div class="geckoVersionNote" style="">
+<p>{{ gecko_callout_heading("9.0") }}</p>
+<font><font>La porción rango de reproducción del elemento de la especificación URI media esta en Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6). </font><font>En este momento, esta es la única parte de la </font></font><a class="external" href="http://www.w3.org/TR/media-frags/" style="padding-right: 16px; line-height: 21px;" title="http://www.w3.org/TR/media-frags/"><font>especificación de los medios de comunicación Fragmentos URI</font></a><font><font>implementado por el Gecko, y sólo se puede utilizar cuando se especifica la fuente para los elementos de los medios de comunicación, y no en la barra de direcciones.</font></font>
+
+<p> </p>
+</div>
+
+<h2 id="Opciones_de_reserva" style="margin: 0px 0px 0.8em; padding: 0px;">Opciones de reserva</h2>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">HTML incluido entre, por ejemplo, las etiquetas de apertura y cierre de los elementos de los medios de comunicación son procesados ​​por los navegadores que no admitan medios de HTML5. Usted puede tomar ventaja de este hecho para proporcionar medios alternativos de reserva para esos navegadores.</p>
+
+<p><span style="line-height: 1.5em;">Esta sección proporciona dos opciones de reserva para video. </span><font>En cada caso, si el navegador soporta vídeo HTML5, que se utiliza, de lo contrario, se utiliza la opción de reserva.</font></p>
+
+<h3 id="Utilización_de_Flash" style="margin: 0px 0px 0.8em; padding: 0px;">Utilización de Flash</h3>
+
+<p><span style="line-height: 1.5em;">Puede usar Flash para reproducir una película formato Flash si el </span><a href="https://developer.mozilla.org/es/docs/HTML/Elemento/video" style="line-height: 1.5em;"><code style="font-size: 14px;">&lt;video&gt;</code></a><span style="line-height: 1.5em;"> no se admite elemento</span><span style="line-height: inherit;">:</span></p>
+
+<pre class="brush: html">&lt;video src="video.ogv" controls&gt;
+    &lt;object data="flvplayer.swf" type="application/x-shockwave-flash"&gt;
+      &lt;param value="flvplayer.swf" name="movie"/&gt;
+    &lt;/object&gt;
+&lt;/video&gt;</pre>
+
+<p><font>Tenga en cuenta que no se debe incluir </font><code style="font-size: 14px;">classid</code><font> en el </font><code style="font-size: 14px;">objeto</code><font> tag con el fin de ser compatible con los navegadores que no sean Internet Explorer.</font></p>
+
+<p> </p>
+
+<p> </p>
+
+<p> </p>
+
+<h3 id="Reproducción_de_vídeos_Ogg_utilizando_un_applet_de_Java" style="margin: 0px 0px 0.8em; padding: 0px;"><font>Reproducción de vídeos Ogg utilizando un applet de Java</font></h3>
+
+<p><span style="line-height: 1.5em;">Hay un applet de Java llamada </span><a class="external" href="http://maikmerten.livejournal.com/2256.html" style="line-height: 1.5em; padding-right: 16px; background-color: transparent;" title="http://maikmerten.livejournal.com/2256.html">Cortado</a><span style="line-height: 1.5em;"> que se puede utilizar como reserva para reproducir vídeos Ogg en los navegadores que no tienen soporte para Java, pero no es compatible con vídeo HTML5</span><span style="line-height: inherit;">:</span></p>
+
+<pre class="brush: html">&lt;video src="my_ogg_video.ogg" controls width="320" height="240"&gt;
+  &lt;object type="application/x-java-applet" width="320" height="240"&gt;
+     &lt;param name="archive" value="cortado.jar"&gt;
+     &lt;param name="code" value="com.fluendo.player.Cortado.class"&gt;
+     &lt;param name="url" value="my_ogg_video.ogg"&gt;
+     &lt;p&gt;You need to install Java to play this file.&lt;/p&gt;
+  &lt;/object&gt;
+&lt;/video&gt;</pre>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><font>Si no se crea un elemento secundario alternativa del elemento de objeto cortado, como el </font><a href="https://developer.mozilla.org/es/docs/HTML/Elemento/p"><code style="font-size: 14px;"><font>&lt;p&gt;</font></code></a><font> elemento superior, Firefox 3.5 instalaciones que manejan el video de forma nativa, pero no tienen Java instalado incorrectamente informarán al usuario de que es necesario instalar un plugin para ver el contenido en la página.</font></p>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"> </p>
+
+<div style="line-height: 22px;"><span class="geckoMinVerMethod indicatorInHeadline minVer">(Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)</span>
+
+<h1 id="Gestión_de_errores" style="margin: 0px 0px 0.8em; padding: 0px; font-size: 1.857em;">Gestión de errores</h1>
+</div>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"> </p>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">A partir de Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1), el tratamiento de errores se ha revisado para que coincida con la última versión de la especificación HTML5. En lugar de que el <code style="font-size: 14px;">error sea</code> enviado al elemento en sí, ahora se entrega a los elementos "hijos" <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> correspondientes a las fuentes que resultan en el error.</p>
+
+<p><span style="line-height: 1.5em;">Esto permite detectar las fuentes no pudieron cargar, que puede ser útil. Considere este HTML</span><span style="line-height: inherit;">:</span></p>
+
+<pre class="brush: html">&lt;video&gt;
+&lt;source id="mp4_src"
+  src="video.mp4"
+  type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'&gt;
+&lt;/source&gt;
+&lt;source id="3gp_src"
+  src="video.3gp"
+  type='video/3gpp; codecs="mp4v.20.8, samr"'&gt;
+&lt;/source&gt;
+&lt;source id="ogg_src"
+  src="video.ogv"
+  type='video/ogg; codecs="theora, vorbis"'&gt;
+&lt;/source&gt;
+&lt;/video&gt;</pre>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Dado que Firefox no es compatible con MP4 y 3GP, debido a su naturaleza de patente gravado, los <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> elementos con el ID "mp4_src" y "3gp_src" recibirán <code style="font-size: 14px;">error</code> eventos antes de cargar el recurso Ogg. Las fuentes son juzgados en el orden en el que aparecen, y una vez que uno carga con éxito, las fuentes restantes no se trataron en absoluto.</p>
+
+<h3 id="Detectar_si_las_fuentes_no_han_cargado" style="margin: 0px 0px 0.8em; padding: 0px;">Detectar si las fuentes no han cargado</h3>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><code>Para detectar qué todos los elementos </code><a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> no han podido cargarse, se debe comprobar el valor de la propiedad <code style="font-size: 14px;">NetworkState</code> qué poseen todos los elementos de tipo multimedia. Si el valor es <code style="font-size: 14px;">HTMLMediaElement.NETWORK_NO_SOURCE</code>, se sabrá que las fuentes no se cargaron correctamente.</p>
+
+<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Si en ese momento se agrega otra fuente mediante la inserción de un nuevo elemento <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> como hijo del elemento multimedia, Gecko intenta cargar el recurso especificado.</p>
+
+<h3 id="Mostrando_contenido_fallback_cuando_la_fuente_no_puede_ser_cargada">Mostrando contenido <em>fallback</em> cuando la fuente no puede ser cargada</h3>
+
+<p>Otra forma de mostrar el contenido <em>fallback</em> de un vídeo cuando ninguna de sus fuentes pudieron ser cargadas, es añadir un manejador de excepciones o errores en el último elemento {{ HTMLElement("source") }}. Así usted podrá reemplazar el vídeo con el contenido <em>fallback</em>:</p>
+
+<pre class="brush: html  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>video</span> <span class="attr-name token">controls</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>source</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>dynamicsearch.mp4<span class="punctuation token">"</span></span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>video/mp4<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>source</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>a</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>dynamicsearch.mp4<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>dynamicsearch.jpg<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>App de b&amp;uaacute;squeda din&amp;aacute;mica en Firefox OS<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>a</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Clic en la im&amp;aacute;gen para reproducir un v&amp;iacute;deo demo de la app de b&amp;uaacute;squeda din&amp;aacute;mica&lt;<span class="tag token"><span class="tag token"><span class="punctuation token">/</span>p</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>video</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">var</span> v <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelector<span class="punctuation token">(</span></span><span class="string token">'video'</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
+    sources <span class="operator token">=</span> v<span class="punctuation token">.</span><span class="function token">querySelectorAll<span class="punctuation token">(</span></span><span class="string token">'source'</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
+    lastsource <span class="operator token">=</span> sources<span class="punctuation token">[</span>sources<span class="punctuation token">.</span>length<span class="number token">-1</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
+lastsource<span class="punctuation token">.</span><span class="function token">addEventListener<span class="punctuation token">(</span></span><span class="string token">'error'</span><span class="punctuation token">,</span> <span class="keyword token">function</span><span class="punctuation token">(</span>ev<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">var</span> d <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement<span class="punctuation token">(</span></span><span class="string token">'div'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  d<span class="punctuation token">.</span>innerHTML <span class="operator token">=</span> v<span class="punctuation token">.</span>innerHTML<span class="punctuation token">;</span>
+  v<span class="punctuation token">.</span>parentNode<span class="punctuation token">.</span><span class="function token">replaceChild<span class="punctuation token">(</span></span>d<span class="punctuation token">,</span> v<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span><span class="punctuation token">,</span> <span class="keyword token">false</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<h2 id="sect1" style="margin: 0px 0px 0.8em; padding: 0px;"> </h2>
+
+<h2 id="Véase_también" style="margin: 0px 0px 0.8em; padding: 0px;">Véase también</h2>
+
+<ul style="margin: 0px 0px 1.286em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">
+ <li>Los elementos relacionados con los medios HTML: <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/audio"><code style="font-size: 14px;">&lt;audio&gt;</code></a> , <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/video"><code style="font-size: 14px;">&lt;video&gt;</code></a> , <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> ;</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Manipulating_video_using_canvas" title="Vídeo Manipular con tela">Vídeo Manipular con canvas</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Introducing_the_Audio_API_Extension" title="Presentación de la extensión de API Audio">Presentación de la extensión de API Audio</a></li>
+ <li><code style="font-size: 14px;"><a class="external" href="http://developer.mozilla.org/es/docs/XPCOM_Interface_Reference/nsIDOMHTMLMediaElement" style="padding-right: 16px; background-color: transparent;">nsIDOMHTMLMediaElement</a></code></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements" title="Formatos de los medios admitidos por los elementos de audio y vídeo">Formatos de los medios admitidos por los elementos de audio y vídeo</a></li>
+ <li><a class="external" href="http://en.flossmanuals.net/ogg-theora/" style="padding-right: 16px; background-color: transparent;" title="http://en.flossmanuals.net/ogg-theora/">Theora Cookbook</a></li>
+ <li><a class="external" href="http://popcornjs.org/" style="padding-right: 16px; background-color: transparent;" title="http://popcornjs.org/">Popcorn.js - Media Framework HTML5</a></li>
+ <li><a class="external" href="http://www.html5video.org/kaltura-html5/" style="padding-right: 16px; background-color: transparent;" title="http://www.html5video.org/kaltura-html5/">Kaltura Solución videoteca</a> , una biblioteca de JavaScript (mwEmbed) que soporta un retorno sin problemas con HTML5, VLC Player, Java Cortado y OMTK Vorbis reproductor de Flash. (Es utilizado por Wikimedia)</li>
+ <li><a class="external" href="http://omtk.org/flash/index.html" style="padding-right: 16px; background-color: transparent;" title="http://omtk.org/flash/index.html">OMTK - flash</a> , una biblioteca de Flash que implementa un decodificador Vorbis</li>
+ <li><a class="external" href="http://www.projekktor.com/" style="padding-right: 16px; background-color: transparent;" title="http://www.projekktor.com">Projekktor jugador</a> , un contenedor de JavaScript para audio vídeo-tags con fallback flash, de código abierto, GPL</li>
+ <li><a class="external" href="http://www.theora.org/cortado/" style="padding-right: 16px; background-color: transparent;" title="http://www.theora.org/cortado/">Applet Cortado</a> , una solución de reproducción de audio / vídeo en Java que mantiene Xiph.org</li>
+ <li><a class="external" href="http://videojs.com/" style="padding-right: 16px; background-color: transparent;" title="Video.js HTML5 Video Player">Video.JS</a> , un reproductor de vídeo HTML5 de código abierto y un marco.</li>
+ <li><a class="external" href="http://mediaelementjs.com/" style="padding-right: 16px; background-color: transparent;" title="http://mediaelementjs.com/">MediaElement.js</a> - marco audio / video HTML5 de código abierto con una cuña de Flash personalizada que imitan API multimedia HTML5 para exploradores más antiguos.</li>
+ <li><a class="external" href="http://www.hdwebplayer.com/" style="padding-right: 16px; background-color: transparent;" title="http://www.hdwebplayer.com">FLV Player</a> - HTML5 reserva soporte del reproductor de vídeo</li>
+</ul>
+
+<p><span style="line-height: inherit;">{{ HTML5ArticleTOC() }}</span></p>
diff --git a/files/es/conflicting/learn/index.html b/files/es/conflicting/learn/index.html
new file mode 100644
index 0000000000..066950ce62
--- /dev/null
+++ b/files/es/conflicting/learn/index.html
@@ -0,0 +1,12 @@
+---
+title: Codificación-Scripting
+slug: conflicting/Learn
+tags:
+  - Codificación
+  - Principiante
+  - Scripting
+translation_of: Learn
+translation_of_original: Learn/Coding-Scripting
+original_slug: Learn/codificacion-scripting
+---
+<p>REDIRIGE <a href="/es/docs/Learn">Aprende</a></p>
diff --git a/files/es/conflicting/learn/javascript/objects/index.html b/files/es/conflicting/learn/javascript/objects/index.html
new file mode 100644
index 0000000000..ae0f3827d1
--- /dev/null
+++ b/files/es/conflicting/learn/javascript/objects/index.html
@@ -0,0 +1,386 @@
+---
+title: Introducción a JavaScript orientado a objetos
+slug: conflicting/Learn/JavaScript/Objects
+tags:
+  - Constructor
+  - Herencia
+  - JavaScript
+  - Objetos
+  - Orientado a objetos
+  - POO
+  - espacio de nombres
+translation_of: Learn/JavaScript/Objects
+translation_of_original: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript
+original_slug: Web/JavaScript/Introducción_a_JavaScript_orientado_a_objetos
+---
+<p>{{jsSidebar("Introductory")}}</p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>JavaScript</strong> dispone de fuertes capacidades de programación orientada a objetos, a pesar de que han tenido lugar algunos debates respecto a las diferencias de sus capacidades en comparación con otros lenguajes.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Este artículo comienza con una Introducción a la programación orientada a objetos, luego examina el modelo de objetos de JavaScript, y finalmente, muestra los conceptos de programación orientada a objetos en JavaScript.</span></span></p>
+
+<h2 id="JavaScript_Review" name="JavaScript_Review"><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Revisión de JavaScript</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no te sientes seguro acerca de los conceptos de JavaScript tales como variables, tipos, funciones y el ámbito de aplicación, puedes leer sobre estos temas en: <a href="/en/JavaScript/A_re-introduction_to_JavaScript" title="en/JavaScript/A re-introduction to JavaScript">Una nueva introducción a JavaScript</a> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">También puedes consultar la <a href="/en/JavaScript/Guide" title="en/JavaScript/Guide">Guía de JavaScript 1.5</a>.</span></span></p>
+
+<h2 id="Object-oriented_programming" name="Object-oriented_programming"><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Programación orientada a objetos</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La programación orientada a objetos es un paradigma de programación que utiliza la abstracción para crear modelos basados ​​en el mundo real.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Utiliza diversas técnicas de paradigmas previamente establecidas, incluyendo la <strong>modularidad</strong>, <strong>polimorfismo</strong> y <strong>encapsulamiento</strong>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Hoy en día, muchos lenguajes de programación (como Java, JavaScript, C#, C++, Python, PHP, Ruby y Objective-C) soportan programación orientada a objetos (POO).</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La programación orientada a objetos puede considerarse como el diseño de software a través de un conjunto de objetos que cooperan, a diferencia de un punto de vista tradicional en el que un programa puede considerarse como un conjunto de funciones, o simplemente como una lista de instrucciones para la computadora.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En la programación orientada a objetos, cada objeto es capaz de recibir mensajes, procesar datos y enviar mensajes a otros objetos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cada objeto puede verse como una pequeña máquina independiente con un papel o responsabilidad definida.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">POO pretende promover una mayor flexibilidad y facilidad de mantenimiento en la programación y es muy popular en la ingeniería de software a gran escala.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Gracias a su fuerte énfasis en la modularidad, el código orientado a objetos está concebido para ser más fácil de desarrollar y más fácil de entender posteriormente, prestándose a un análisis más directo, a una mayor codificación y comprensión de situaciones y procedimientos complejos que otros métodos de programación menos modulares. <sup><a href="/#Referencia" title="#Referencia">2</a></sup></span></span></p>
+
+<h2 id="Terminology" name="Terminology"><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Terminología</span></span></h2>
+
+<dl>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Clase</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Define las características del Objeto.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Objeto</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una instancia de una Clase.</span></span></dd>
+ <dt><span style="line-height: 1.5;">Propiedad</span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una característica del Objeto, como el color.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Método</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una capacidad del Objeto, como caminar.</span></span></dd>
+</dl>
+
+<dl>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Constructor</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Es un método llamado en el momento de la creación de instancias.</span></span></dd>
+ <dt><span style="line-height: 1.5;">Herencia</span></dt>
+ <dd><span class="goog-gtc-unit"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Una Clase puede heredar características de otra Clase.</span></span></dd>
+</dl>
+
+<dl>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Encapsulamiento</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Una Clase sólo define las características del Objeto, un Método sólo define cómo se ejecuta el Método.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Abstracción</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La conjunción de herencia compleja, métodos y propiedades que un objeto debe ser capaz de simular en un modelo de la realidad.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Polimorfismo</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Diferentes Clases podrían definir el mismo método o propiedad.</span></span></dd>
+</dl>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para una descripción más extensa de programación orientada a objetos, consulta <a class="external" href="http://es.wikipedia.org/wiki/Programaci%C3%B3n_orientada_a_objetos" title="http://es.wikipedia.org/wiki/Programación_orientada_a_objetos">Programación orientada a objetos</a> en Wikipedia.</span></span></p>
+
+<h2 id="Programación_basada_​​en_prototipos"><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Programación basada ​​en prototipos</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La programación basada ​​en prototipos es un estilo de programación orientada a objetos en la que las clases no están presentes y la reutilización de comportamiento (conocido como herencia en lenguajes basados ​​en clases) se lleva a cabo a través de un proceso de decoración de objetos existentes que sirven de prototipos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Este modelo también se conoce como programación sin clases, orientada a prototipos o basada en ejemplos.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El ejemplo original (y más canónico) de un lenguaje basado en prototipos es el lenguaje de programación <a href="https://en.wikipedia.org/wiki/Self_%28programming_language%29">Self</a> desarrollado por David Ungar y Randall Smith.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Sin embargo, el estilo de programación sin clases se ha hecho cada vez más popular y ha sido adoptado para lenguajes de programación como JavaScript, Cecil, NewtonScript, Io, MOO, REBOL, Kevo, Squeak (cuando se utiliza el Viewer framework para manipular los componentes Morphic) y varios otros. <sup><a href="/#Referencia" title="#Referencia">2</a></sup></span></span></p>
+
+<h2 id="JavaScript_Object_Oriented_Programming" name="JavaScript_Object_Oriented_Programming"><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Programación orientada a objetos de JavaScript </span></span></h2>
+
+<h3 id="Core_Objects" name="Core_Objects"><span style="font-size: 1.714285714285714rem;">Namespace</span></h3>
+
+<p>Un <strong>espacio de nombres</strong> es un contenedor que permite asociar toda la funcionalidad de un determinado objeto con un nombre único. En JavaScript un espacio de nombres es un objeto que permite a métodos, propiedades y objetos asociarse. La idea de crear espacios de nombres en JavaScript es simple: Crear un único objeto global para las variables, métodos, funciones convirtiendolos en propiedades de ese objeto. El uso de los namespace permite minimizar el conflicto de nombres con otros objetos haciéndolos únicos dentro de nuestra aplicación.</p>
+
+<div>Un <strong>espacio de nombres</strong> es un objeto: </div>
+
+<div><br>
+<span style="line-height: 1.5;">Vamos a crear un objeto global llamado MIAPLICACION</span></div>
+
+<div> </div>
+
+<pre class="brush: js">// namespace global
+
+var MIAPLICACION = MIAPLICACION || {};</pre>
+
+<div> </div>
+
+<div class="note">
+<p><strong>Nota:</strong> Para continuar con las mejores prácticas vamos a utilizar mayúsculas para los namespace.</p>
+</div>
+
+<div>
+<div>En el código de ejemplo anterior comprobamos si MIAPLICACION ya se encuentra definida. Si es así utilizamos el objeto global MIAPLICACION que existe; si este no existe creamos un objeto vacío llamado MIAPLICACION que encapsulará métodos, funciones, variables y otros objetos que vayamos a crear.</div>
+
+<div> </div>
+
+<div>También podemos crear <strong>Sub-espacios de nombres</strong>:</div>
+
+<div> </div>
+
+<pre class="brush: js">// Sub-namespace
+
+MIAPLICACION.event = {} ;</pre>
+</div>
+
+<div>A continuación se muestra el código para la creación de un <strong>espacio de nombre</strong> y cómo agregar variables, funciones y métodos:</div>
+
+<div> </div>
+
+<pre class="brush: js">// Creación del contenedor llamado MIAPLICACION.metodoComun de método y propiedades comunes.
+MIAPLICACION.metodoComun = {
+  regExParaNombre: "", // define regex para la validación del nombre
+  regExParaTelefono: "", // define regex para validación del teléfono
+  validaNombre: function(nombre){
+    // Hace algo con el nombre que usted ingresa a la variable reExParaNombre
+    // usando "this.regExParaNombre"
+  },
+
+  validaNroTelefono: function (numTelefono){
+    // Hace algo con el número de teléfono
+  }
+}
+
+// Objeto junto a la declaración del método
+MIAPLICACION.event = {
+  addListener: function(el, type, fn){
+    // código de relleno
+  },
+  removeListener: function(el, type, fn){
+    // código de relleno
+  },
+  getEvent: function(e) {
+    // código de relleno
+  }
+
+  // Puedes agregar otras propiedades y métodos
+}
+
+// Sintaxis de utilización del método addListener:
+MIAPLICACION.event.addListener("turel", "tipo", callback);
+
+
+</pre>
+
+<div>
+<h3 id="Core_Objects" name="Core_Objects" style="line-height: 24px;"><span style="font-size: 1.714285714285714rem;">Objetos básicos</span></h3>
+</div>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">JavaScript tiene varios objetos incluidos en su núcleo, como Math, Object, Array y String.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El siguiente ejemplo muestra cómo utilizar el objeto Math para obtener un número al azar mediante el uso de su método <code>random()</code>.</span></span></p>
+
+<pre class="brush: js"><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="brush: js" dir="ltr">alert (Math.random ());</span></span>
+</pre>
+
+<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota:</strong> este y todos los demás ejemplos suponen que una función llamada <code>alert</code> (como el que se incluye en los navegadores web) se define de forma global.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La función <code>alert</code> no es realmente parte de JavaScript.</span></span></div>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Consulta <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects" title="En/Core JavaScript 1.5 Reference/Global Objects">Core JavaScript 1.5 Reference:Global Objects</a> para obtener una lista de los objetos básicos en JavaScript.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cada objeto en JavaScript es una instancia del objeto <code>Object</code>, por lo tanto, hereda todas sus propiedades y métodos.</span></span></p>
+
+<h3 id="Custom_Objects" name="Custom_Objects"><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Objetos personalizados</span></span></h3>
+
+<h4 id="The_Class" name="The_Class"><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La clase</span></span></h4>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">JavaScript es un lenguaje basado en prototipos que no contiene ninguna declaración de clase, como se encuentra, por ejemplo, en C + + o Java.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto es a veces confuso para los programadores acostumbrados a los lenguajes con una declaración de clase.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">En su lugar, JavaScript utiliza funciones como clases.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Definir una clase es tan fácil como definir una función.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el ejemplo siguiente se define una nueva clase llamada <strong>Persona</strong>.</span></span></p>
+
+<pre class="brush: js"><span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">function Persona() { }</span></span>
+</pre>
+
+<h4 id="The_Object_.28Class_Instance.29" name="The_Object_.28Class_Instance.29"><span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El objeto (ejemplo de clase)</span></span></h4>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para crear un nuevo ejemplo de un objeto <em><code>obj</code></em> utilizamos la declaración <code>new <em>obj</em></code> , asignando el resultado (que es de tipo <em><code>obj</code></em> ) a una variable para tener acceso más tarde.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo se define una clase llamada <code>Persona</code> y creamos dos instancias ( <code>persona1</code> y <code>persona2</code> ).</span></span></p>
+
+<pre class="brush: js">function Persona() {
+}
+
+var persona1 = new Persona();
+var persona2 = new Persona();</pre>
+
+<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por favor, consulta también <a href="/en/JavaScript/Reference/Global_Objects/Object/create" title="en/JavaScript/Reference/Global Objects/Object/create">Object.create</a> para ver un método nuevo y alternativo de creación de ejemplos.</span></span></div>
+
+<h4 id="The_Constructor" name="The_Constructor"><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El constructor</span></span></h4>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El constructor es llamado en el momento de la creación de la instancia (el momento en que se crea la instancia del objeto).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El constructor es un método de la clase.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">En JavaScript, la función sirve como el constructor del objeto, por lo tanto, no hay necesidad de definir explícitamente un método constructor.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cada acción declarada en la clase es ejecutada en el momento de la creación de la instancia.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El constructor se usa para establecer las propiedades del objeto o para llamar a los métodos para preparar el objeto para su uso. Más adelante describiremos como agregar </span></span><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">métodos a clase y sus definiciones ya que se realiza utilizando una sintaxis diferente.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo, el constructor de la clase <code>Persona</code> muestra un alerta que dice (<strong>Una instancia de persona)</strong> cuando se crea la instancia de la clase <code>Persona</code>.</span></span></p>
+
+<pre class="brush: js">function Persona() {
+  alert('Una instancia de Persona');
+}
+
+var persona1 = new Persona();
+var persona2 = new Persona();</pre>
+
+<h4 id="The_Property_.28object_attribute.29" name="The_Property_.28object_attribute.29"><span class="goog-gtc-unit" id="goog-gtc-unit-78"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La propiedad (atributo del objeto)</span></span></h4>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-79"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las propiedades son variables contenidas en la clase, cada instancia del objeto tiene dichas propiedades.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-80"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las propiedades deben establecerse a la propiedad prototipo de la clase (función), para que la herencia funcione correctamente.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-81"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Para trabajar con propiedades dentro de la clase se utiliza la palabra reservada <strong><code>this</code></strong> , que se refiere al objeto actual.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-82-goog-gtc-unit-83"><span class="goog-gtc-from-human goog-gtc-translatable">El acceso (lectura o escritura) a una propiedad desde fuera de la clase se hace con la sintaxis: <strong>NombreDeLaInstancia<code>.Propiedad</code></strong>. Es la misma sintaxis utilizada por C++, Java y algunos lenguajes más.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-84-goog-gtc-unit-85"><span class="goog-gtc-from-human goog-gtc-translatable">(Desde dentro de la clase la sintaxis es <strong><code>this.</code><code>Propiedad</code></strong> que se utiliza para obtener o establecer el valor de la propiedad).</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo definimos la propiedad <font face="Courier New, Andale Mono, monospace"><strong>primerNombre </strong></font>de la clase <code>Persona</code> y la definimos en la creación de la instancia.</span></span></p>
+
+<pre class="brush: js">function Persona(primerNombre) {
+  this.primerNombre = primerNombre;
+  alert('Una instancia de Persona');
+}
+
+var persona1 = new Persona("Alicia");
+var persona2 = new Persona("Sebastian");
+
+// Muestra el primer nombre de persona1
+alert ('persona1 es ' + persona1.primerNombre); // muestra "persona1 es Alicia"
+alert ('persona2 es ' + persona2.primerNombre); // muestra "persona2 es Sebastian"</pre>
+
+<h4 id="The_methods" name="The_methods"><span class="goog-gtc-unit" id="goog-gtc-unit-96"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Los métodos</span></span></h4>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-97"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Los métodos siguen la misma lógica que las propiedades, la diferencia es que son funciones y se definen como funciones.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-98"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Llamar a un método es similar a acceder a una propiedad, pero se agrega <code>()</code> al final del nombre del método, posiblemente con argumentos.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-99"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo se define y utiliza el método diHola<code>()</code> para la clase <code>Persona</code>.</span></span></p>
+
+<pre class="brush: js">function Persona(primerNombre) {
+  this.primerNombre = primerNombre;
+}
+
+Persona.prototype.diHola = function() {
+  alert ('Hola, Soy ' + this.primerNombre);
+};
+
+var persona1 = new Persona("Alicia");
+var persona2 = new Persona("Sebastian");
+
+// Llamadas al método diHola de la clase Persona.
+persona1.diHola(); // muestra "Hola, Soy Alicia"
+persona2.diHola(); // muestra "Hola, Soy Sebastian"</pre>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-113"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En JavaScript los métodos son objetos como lo es una función normal y se vinculan a un objeto como lo hace una propiedad, lo que significa que se pueden invocar desde "fuera de su contexto".</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-114"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Considera el siguiente código de ejemplo:</span></span></p>
+
+<pre class="brush: js">function Persona(primerNombre) {
+  this.primerNombre = primerNombre;
+}
+
+Persona.prototype.diHola = function() {
+  alert ("Hola, Soy " + this.primerNombre);
+};
+
+var persona1 = new Persona("Alicia");
+var persona2 = new Persona("Sebastian");
+var funcionSaludar = persona1.diHola;
+
+persona1.diHola();                            // muestra "Hola, Soy Alicia"
+persona2.diHola();                            // muestra "Hola, Soy Sebastian"
+funcionSaludar();                             // muestra "Hola, Soy undefined (ó da un error con el
+                                              // TypeError en modo estricto
+
+alert(funcionSaludar === persona1.diHola);            // muestra true (verdadero)
+alert(funcionSaludar === Persona.prototype.diHola);   // muestra true (verdadero)
+funcionSaludar.call(persona1);                        // muestra "Hola, Soy Alicia"</pre>
+
+<div>En el ejemplo se muestran todas las referencias que tenemos de la función <strong>diHola</strong> — una de ellas es <strong>persona1, </strong>otra en <strong>Persona.prototype</strong>, en la variable <strong>funcionSaludar</strong>, etc. — todas se refieren a la misma función. El valor durante una llamada a la función depende de como realizamos esa llamada. <span style="line-height: 1.5;">En el común de los casos cuando la llamamos desde una expresión donde tenemos a la función desde la propiedad del objeto — <strong>persona1.diHola()</strong>.</span><span style="line-height: 1.5;">— Se establece en el objeto que tenemos en la función (persona1), razón por la cual <strong>persona1.diHola()</strong> utiliza el nombre "Alicia" y <strong>persona2.diHola()</strong> utiliza el nombre "Sebastian". </span><span style="line-height: 1.5;">Pero si realizamos la llamada de otra manera, se establecerá de forma diferente: Llamándola desde una variable  —<strong>funcionSaludar()</strong> — Este </span><span style="line-height: 1.5;">establece </span><span style="line-height: 1.5;">al objeto global (windows, en los navegadores). </span><span style="line-height: 1.5;">Desde este objeto (probablemente) no tiene a la propiedad <strong>primerNombre</strong>, por lo que finalizará con "Hola, Soy indefinido". </span><span style="line-height: 1.5;">(El cual se incluye en modo </span>de código suelto, sino sería diferente [un error] en modo estricto, pero para evitar confusiones ahora no vamos a entra en detalles.) O podemos establecerla de forma explicita utilizando  Function.call (ó Function.apply), como se muestra al final del ejemplo <strong>funcionSaludar.call(persona1)</strong>.</div>
+
+<div> </div>
+
+<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-133"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Consulta más información al respecto en <a href="/en/JavaScript/Reference/Global_Objects/Function/call" title="en/JavaScript/Reference/Global Objects/Function/call">Function.call</a> y <a href="/en/JavaScript/Reference/Global_Objects/Function/apply" title="en/JavaScript/Reference/Global Objects/Function/apply">Function.apply</a></span></span></div>
+
+<h4 id="Inheritance" name="Inheritance"><span class="goog-gtc-unit" id="goog-gtc-unit-134"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Herencia</span></span></h4>
+
+<div>La herencia es una manera de crear una clase como una versión especializada de una o más clases (JavaScript sólo permite herencia simple). La clase especializada comúnmente se llama hija o secundaria, y la otra clase se le llama padre o primaria. En JavaScript la herencia se logra mediante la asignación de una instancia de la clase primaria a  la clase secundaria, y luego se hace la especialización. </div>
+
+<div> </div>
+
+<div class="note">
+<p>JavaScript no detecta la clase hija prototype.constructor (vea las propiedades del <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/prototype">Core JavaScript 1.5 Reference:Global Objects:Object:prototype</a>) así que debemos decírselo de forma manual.</p>
+</div>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-140" style="line-height: 1.5;"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo definimos la clase <strong><code>Estudiante</code></strong> como una clase secundaria de <strong><code>Persona</code></strong> .</span></span><span style="line-height: 1.5;"> </span><span class="goog-gtc-unit" id="goog-gtc-unit-141" style="line-height: 1.5;"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Luego redefinimos el método <strong>diHola<code>()</code></strong> y agregamos el método <strong>diAdios<code>()</code></strong>.</span></span></p>
+
+<pre class="brush: js">// Definimos el constructor Persona
+function Persona(primerNombre) {
+  this.primerNombre = primerNombre;
+}
+
+// Agregamos un par de métodos a Persona.prototype
+Persona.prototype.caminar = function() {
+  alert("Estoy caminando!");
+};
+Persona.prototype.diHola = function(){
+  alert("Hola, Soy" + this.primerNombre);
+};
+
+// Definimos el constructor Estudiante
+function Estudiante(primerNombre, asignatura) {
+  // Llamamos al constructor padre, nos aseguramos (utilizando Function#call) que "this" se
+  // ha establecido correctamente durante la llamada
+  Persona.call(this, primerNombre);
+
+  //Inicializamos las propiedades específicas de Estudiante
+  this.asignatura = asignatura;
+};
+
+// Creamos el objeto Estudiante.prototype que hereda desde Persona.prototype
+// Nota: Un error común es utilizar "new Persona()" para crear Estudiante.prototype
+// Esto es incorrecto por varias razones, y no menos importante que no le estamos pasando nada
+// a Persona desde el argumento "primerNombre". El lugar correcto para llamar a Persona
+// es arriba, donde llamamos a Estudiante.
+Estudiante.prototype = Object.create(Persona.prototype);    // Vea las siguientes notas
+
+// Establecer la propiedad "constructor" para referencias a Estudiante
+Estudiante.prototype.constructor = Estudiante;
+
+// Reemplazar el método "diHola"
+Estudiante.prototype.diHola = function(){
+  alert("Hola, Soy " + this.primerNombre + ". Estoy estudiando " + this.asignatura + ".");
+};
+
+// Agregamos el método "diAdios"
+Estudiante.prototype.diAdios = function() {
+  alert("¡ Adios !");
+};
+
+// Ejemplos de uso
+var estudiante1 = new Estudiante("Carolina", "Física Aplicada");
+estudiante1.diHola();    // muestra "Hola, Soy Carolina. Estoy estudianto Física Aplicada."
+estudiante1.caminar();   // muestra "Estoy caminando!"
+estudiante1.diAdios();   // muestra "¡ Adios !"
+
+// Comprobamos que las instancias funcionan correctamente
+alert(estudiante1 instanceof Persona);      // devuelve true
+alert(estudiante1 instanceof Estudiante);   // devuelve true
+</pre>
+
+<p>Con respecto a la línea <strong>Estudiante.prototype = Object.create(Persona.prototype); </strong>: Sobre los motores antiguos de JavaScript sin <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/create">Object.create</a>, se puede utilizar un "polyfill" (aka "shim", vea el enlace del artículo), o se puede utilizar una función que obtiene el mismo resultado, como por ejemplo:</p>
+
+<pre class="brush: js">function crearObjeto(proto) {
+  function ctor() { }
+  ctor.prototype = proto;
+  return new ctor();
+}
+
+// uso:
+Estudiante.prototype = crearObjeto(Persona.prototype); </pre>
+
+<div class="note">
+<p>Ver <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/create">Object.create</a> para conocer más sobre lo que hace, y complementar con los motores antiguos.</p>
+</div>
+
+<p><span style="font-family: open sans light,sans-serif; font-size: 1.285714285714286rem; letter-spacing: -0.25px; line-height: 18px;">Encapsulación</span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-172"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el ejemplo anterior, <code>Estudiante</code> no tiene que saber cómo se aplica el método <code>caminar()</code> de la clase <code>Persona</code>, pero, sin embargo, puede utilizar ese método. La clase <code>Estudiante</code> no tiene que definir explícitamente ese método, a menos que queramos cambiarlo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-173"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto se denomina <strong>la encapsulación</strong>, por medio de la cual cada clase hereda los métodos de su elemento primario y sólo tiene que definir las cosas que desea cambiar.</span></span></p>
+
+<h4 id="Abstraction" name="Abstraction"><span class="goog-gtc-unit" id="goog-gtc-unit-174"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Abstracción</span></span></h4>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-175"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Un mecanismo que permite modelar la parte actual del problema de trabajo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-176"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto se puede lograr por herencia (especialización) o por composición.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-177"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">JavaScript logra la especialización por herencia y por composición al permitir que las instancias de clases sean los valores de los atributos de otros objetos.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-178"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La clase Function de JavaScript hereda de la clase de Object (esto demuestra la especialización del modelo) y la propiedad Function.prototype es un ejemplo de Objeto (esto demuestra la composición)</span></span></p>
+
+<p> </p>
+
+<pre class="brush: js"><span class="goog-gtc-unit" id="goog-gtc-unit-179"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">v</span></span>ar foo = function() {};
+alert( 'foo es una Función: ' + (foo instanceof Function) );
+alert( 'foo.prototype es un Objeto: ' + (foo.prototype instanceof Object) );
+</pre>
+
+<p><span style="font-family: open sans light,sans-serif; font-size: 1.285714285714286rem; letter-spacing: -0.25px; line-height: 18px;">Polimorfismo</span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-183"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Al igual que todos los métodos y propiedades están definidas dentro de la propiedad prototipo, las diferentes clases pueden definir métodos con el mismo nombre. Los métodos están en el ámbito de la clase en que están definidos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-184"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto sólo es verdadero cuando las dos clases no tienen una relación primario-secundario (cuando uno no hereda del otro en una cadena de herencia).</span></span></p>
+
+<h2 id="Notes" name="Notes"><span class="goog-gtc-unit" id="goog-gtc-unit-185"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Notas</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-186"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las técnicas presentadas en este artículo para aplicar la programación orientada a objetos no son las únicas que se pueden utilizar en JavaScript, que es muy flexible en términos de cómo se puede realizar la programación orientada a objetos.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-187"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Del mismo modo, las técnicas presentadas aquí no utilizan ninguna modificación o hack de lenguaje ni imitan las implementaciones de teorías de objetos de otros lenguajes.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-188"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Hay otras técnicas que hacen incluso programación orientado a objetos más avanzada en JavaScript, pero que están fuera del alcance de este artículo introductorio.</span></span></p>
+
+<h2 id="References" name="References"><span class="goog-gtc-unit" id="goog-gtc-unit-189"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Referencias</span></span></h2>
+
+<ol>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-190-goog-gtc-unit-191-goog-gtc-unit-192"><span class="goog-gtc-from-human goog-gtc-translatable">Mozilla. "Core JavaScript 1.5 Guide", http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Guide.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-193-goog-gtc-unit-194-goog-gtc-unit-195"><span class="goog-gtc-from-human goog-gtc-translatable">Wikipedia. "Programación orientada a objetos", <a class="external" href="http://es.wikipedia.org/wiki/Programaci%C3%B3n_orientada_a_objetos" rel="freelink">http://es.wikipedia.org/wiki/Program...tada_a_objetos</a>.</span></span></li>
+ <li><a href="http://davidwalsh.name/javascript-objects">Descripción general de POO en JavaScript</a> por Kyle Simpson.</li>
+</ol>
diff --git a/files/es/conflicting/mdn/contribute/getting_started/index.html b/files/es/conflicting/mdn/contribute/getting_started/index.html
new file mode 100644
index 0000000000..71bd6b4624
--- /dev/null
+++ b/files/es/conflicting/mdn/contribute/getting_started/index.html
@@ -0,0 +1,19 @@
+---
+title: Cosas para hacer en MDN
+slug: conflicting/MDN/Contribute/Getting_started
+translation_of: MDN/Contribute/Getting_started
+translation_of_original: MDN/Contribute/Tasks
+original_slug: MDN/Contribute/Tareas
+---
+<div>{{MDNSidebar}}</div><p>¿Estás buscando formas de ayudar a mejorar MDN? Hay muchas formas de ayudar: desde corregir errores tipográficos hasta escribir nuevo contenido, o incluso ayudar a desarrollar la plataforma <a href="/en-US/docs/Project:MDN/Kuma">Kuma</a> en la que se construye el sitio web. La <a href="/en-US/docs/Project:MDN/Contributing">guía para el contribuyente de MDN</a> cubre todas las formas en las que puedes ayudar y cómo hacerlo. Más abajo, encontrarás listas de tareas más específicas que faltan hacer.</p>
+<p>Hay un montón de cosas que puedes hacer para ayudar en MDN. Tenemos una guía para las tareas que puedes llevar a cabo como parte de nuestro artículo <a href="/en-US/docs/MDN/Getting_started#Possible_task_types">Comenzando en MDN</a>. Entre las posibles formas de ayudar se encuentran:</p>
+<ul>
+ <li><a href="/es/docs/MDN/Contribute/revisi%C3%B3n_art%C3%ADtulos">Revisar el contenido para mayor precisión</a> (técnica o editorial)</li>
+ <li><a href="/en-US/docs/MDN/Contribute/Howto/Tag">Actualizar etiquetas en las páginas</a> para mejorar los resultados de búsqueda y generación de la lista de contenidos</li>
+ <li><a href="/en-US/docs/MDN/User_guide/Writing#Adding_a_new_page">Escribir nuevos artículos</a></li>
+ <li><a href="/en-US/docs/MDN/User_guide/Writing#Editing_an_existing_page">Actualizar articulos existentes</a> con nueva información, o corregir errores en la información existente</li>
+ <li><a href="/en-US/docs/MDN/Contribute/Howto/Convert_code_samples_to_be_live">Convertir los ejemplos existentes para usarlos en el sistema de muestra en vivo</a></li>
+ <li><a href="/en-US/docs/MDN/Contribute/Editor/Live_samples">Agregar nuevos códigos de muestra en vivo para que la gente pueda ver el código en acción</a></li>
+ <li><a href="/en-US/docs/Project:MDN/Kuma/Contributing">Ayudar a desarrollar la plataforma Kuma en la que se ejecuta MDN </a></li>
+</ul>
+<p>Para más ideas acerca de cosas en las que puedes colaborar con MDN, vé nuestras <a href="/en-US/docs/MDN/Contribute/Howto">Guías de cómo hacerlo</a>. Puedes encontrar listas de páginas categorizadasque necesitan de tu ayuda en nuestra sección de  <a href="/en-US/docs/MDN/Doc_status/Overview">Estado de la Documentación</a>.</p>
diff --git a/files/es/conflicting/mdn/tools/index.html b/files/es/conflicting/mdn/tools/index.html
new file mode 100644
index 0000000000..98db2920e8
--- /dev/null
+++ b/files/es/conflicting/mdn/tools/index.html
@@ -0,0 +1,15 @@
+---
+title: MDN user guide
+slug: conflicting/MDN/Tools
+tags:
+  - Documentation
+  - Landing
+  - MDN
+  - NeedsTranslation
+  - TopicStub
+translation_of: MDN/Tools
+translation_of_original: MDN/User_guide
+original_slug: MDN/User_guide
+---
+<div>{{MDNSidebar}}</div><p>The Mozilla Developer Network site is an advanced system for finding, reading, and contributing to documentation and sample code for Web developers (as well as for Firefox and Firefox OS developers). The MDN user guide provides articles detailing how to use MDN to find the documentation you need, and, if you wish, how to help make the material better, more expansive, and more complete.</p>
+<p>{{SubpagesWithSummaries}}</p>
diff --git a/files/es/conflicting/mdn/yari/index.html b/files/es/conflicting/mdn/yari/index.html
new file mode 100644
index 0000000000..9517a30f30
--- /dev/null
+++ b/files/es/conflicting/mdn/yari/index.html
@@ -0,0 +1,17 @@
+---
+title: Primeros pasos
+slug: conflicting/MDN/Yari
+translation_of: MDN/Kuma
+translation_of_original: MDN/Kuma/Contributing/Getting_started
+original_slug: MDN/Kuma/Contributing/Getting_started
+---
+<div>{{MDNSidebar}}</div><p>Por favor, consulte los <a href="https://github.com/mozilla/kuma/blob/master/docs/installation-vagrant.rst" title="https://github.com/mozilla/kuma/blob/master/docs/installation-vagrant.rst">Documentos de Instalacion de Kuma en GitHub</a> hasta que podamos redactar una mejor guía de "Primeros pasos".</p>
+<h2 id="Solución_de_problemas">Solución de problemas</h2>
+<p>A veces las cosas se ponen mal y la configuración de la prueba Kuma en el equipo deja de funcionar correctamente. Aquí ofrecemos algunas sugerencias sobre qué hacer para tratar de conseguir que funcione de nuevo.</p>
+<h3 id="Reprovision">Reprovision</h3>
+<p>La primera cosa a intentar es destruir y reconstruir su máquina virtual Kuma. Abra una terminal, pasar a la <code>kuma</code> directorio del proyecto y ejecute el siguiente comando:</p>
+<pre>vagrant destroy &amp;&amp; vagrant provision</pre>
+<p>Si desea mantener la base de datos que ya tiene, asegúrese de hacer una copia de seguridad y restaurar después de reaprovisionamiento.</p>
+<h3 id="Vuelva_a_descargar_la_imagen_de_la_VM">Vuelva a descargar la imagen de la VM</h3>
+<p>Si le preocupa que la imagen de VM es mala o no está actualizada, puede forzar el vagrant para descargar una nueva mediante el comando siguiente::</p>
+<pre>vagrant box remove kuma-ubuntu</pre>
diff --git a/files/es/conflicting/mdn/yari_13d770b50d5ab9ce747962b2552e0eef/index.html b/files/es/conflicting/mdn/yari_13d770b50d5ab9ce747962b2552e0eef/index.html
new file mode 100644
index 0000000000..bdedd4aff0
--- /dev/null
+++ b/files/es/conflicting/mdn/yari_13d770b50d5ab9ce747962b2552e0eef/index.html
@@ -0,0 +1,51 @@
+---
+title: Contribuir a Kuma
+slug: conflicting/MDN/Yari_13d770b50d5ab9ce747962b2552e0eef
+translation_of: MDN/Kuma
+translation_of_original: MDN/Kuma/Contributing
+original_slug: MDN/Kuma/Contributing
+---
+<div>{{MDNSidebar}}</div><p>Si desea contribuir al proyecto de Kuma para ayudarnos a construir una gran plataforma wiki y para hacer que el sitio de Mozilla Developer Network aun mejor, los documentos aquí deberían ayudarle a unirse en el esfuerzo.</p>
+<div class="row topicpage-table">
+ <div class="section">
+  <h2 class="Documentation" id="Documentation" name="Documentation">Contribuir a Kuma</h2>
+  <dl>
+   <dt>
+    <a href="/en-US/docs/Project:MDN/Kuma/Contributing/Getting_started" title="/en-US/docs/Project:About">Cómo empezar con Kuma</a></dt>
+   <dd>
+    Cómo bifurcar Kuma desde Github y configurar el entorno de desarrollo.</dd>
+   <dt>
+    <a href="/en-US/docs/Project:MDN/Kuma/Contributing/Help_wanted" title="/en-US/docs/Project:MDN/Kuma/Contributing/Help_wanted">Se busca ayuda</a></dt>
+   <dd>
+    Tenemos un montón de fallos registrados en Kuma. Este artículo se enumeran algunos, nos encantaría ver colaboradores que ayudan con.</dd>
+  </dl>
+  <h2 class="Tools" id="Tools" name="Tools">Herramientas y tareas</h2>
+  <dl>
+   <dt>
+    <a href="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936" title="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936">Errores</a></dt>
+   <dd>
+    Una lista de errores Kuma; siéntase libre de mirar a través de ellos y encontrar algo que te gustaría para arreglar. Este enlace le exige que inicie sesión en Bugzilla.</dd>
+   <dt>
+    <a href="https://bugzilla.mozilla.org/form.mdn" title="https://bugzilla.mozilla.org/enter_bug.cgi?product=Mozilla%20Developer%20Network">Notificar un error</a></dt>
+   <dd>
+    Si usted ha tenido un problema con Kuma, o tiene alguna idea para una manera de hacerlo mejor; usted puede presentar un error</dd>
+   <dt>
+    <a href="/en-US/docs/Project:MDN/Kuma/Changelog" title="/en-US/docs/Project:MDN/Kuma/Changelog">Cambio de registro</a></dt>
+   <dd>
+    Una lista de reciente de modificaciones impulsadas; este es un gran lugar para buscar, para ver lo que ha pasado recientemente.</dd>
+  </dl>
+  <p> </p>
+ </div>
+ <div class="section">
+  <h2 class="Community" id="Community" name="Community">MDN comunidad de desarrolladores</h2>
+  <p><span style="display: none;"> </span>Si desea hablar con nuestros desarrolladores, o incluso mejor, para ayudar a construir y mejorar la plataforma de Kuma, !únase a nuestra comunidad de desarrolladores!</p>
+  <ul>
+   <li>Únase a la conversación en el IRC: <a href="irc://irc.mozilla.org/mdndev" title="irc://irc.mozilla.org/mdndev">#mdndev</a></li>
+   <li>Lea el foro de desarrolladores MDN: {{DiscussionList("dev-mdn", "mozilla.dev.mdn")}}</li>
+  </ul>
+  <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p>
+ </div>
+</div>
+<p><span class="alllinks"><a href="/en-US/docs/tag/MDC_Project" title="MDN project pages">Ver todos ...</a></span></p>
+<div id="cke_pastebin" style="position: absolute; top: 672px; width: 1px; height: 1px; overflow: hidden; left: -1000px;">
+  </div>
diff --git a/files/es/conflicting/mozilla/add-ons/index.html b/files/es/conflicting/mozilla/add-ons/index.html
new file mode 100644
index 0000000000..43ecbe517c
--- /dev/null
+++ b/files/es/conflicting/mozilla/add-ons/index.html
@@ -0,0 +1,381 @@
+---
+title: Construyendo una extensión
+slug: conflicting/Mozilla/Add-ons
+translation_of: Mozilla/Add-ons
+translation_of_original: Building_an_Extension
+original_slug: Building_an_Extension
+---
+<h2 id="Introducción">Introducción</h2>
+
+<p>Este tutorial te guiará a través de los pasos requeridos para desarrollar una <a href="/en-US/docs/Extensions" title="/en-US/docs/Extensions">extensión</a> muy básica - una que agrega un panel con una barra de estado con el texto "Hola, Mundo!" al navegador de Firefox.</p>
+
+<div class="note"><strong>Nota:</strong> La extensión creada por este tutorial no funcionará en versiones de Firefox que no contengan una barra de estado estática (esto es, Firefox 4 en adelante). Puedes encontrar un tutorial más actualizado en <a href="/en-US/docs/XUL_School/The_Essentials_of_an_Extension" title="The Essentials of an Extension">The Essentials of an Extension</a> de la <a href="/en-US/docs/XUL_School" title="XUL School Tutorial">XUL School</a>.</div>
+
+<p>Desde Firefox 4 (y otras aplicaciones basadas en Mozilla 2) existen dos tipos de extensiones:</p>
+
+<ul>
+ <li>Las extensiones tradicionales, clásicas o XUL son más poderosas, pero más complicadas de construir y requieren un reinicio para su instalación.</li>
+ <li>Extensiones sin reinicio, o <a href="/en-US/docs/Extensions/Bootstrapped_extensions" title="/en-US/docs/Extensions/Bootstrapped_extensions">bootstrapped extensions</a> que no requieren un reinicio para instalarse pero son más limitadas que las extensiones tradicionales. El <a class="link-https" href="https://addons.mozilla.org/en-US/developers/tools/builder">Add-on SDK y el Add-on Builder</a> pueden ser usados para construir fácilmente extensiones sin reinicio.</li>
+</ul>
+
+<p>Este artículo explica como construir una extensión tradicional para Firefox. Para información sobre bootstrapped extensions o sin reinicio, mira <a href="/en-US/docs/Extensions/Bootstrapped_extensions" title="/en-US/docs/Extensions/Bootstrapped_extensions">Bootstrapped extensions</a>.</p>
+
+<p>Para un tutorial sobre construcción de extensiones para Thunderbird, mira <a href="/en-US/docs/Extensions/Thunderbird/Building_a_Thunderbird_extension" title="/en-US/docs/Building_a_Thunderbird_extension">Construyendo una extensión para Thunderbird.</a></p>
+
+<h2 id="Inicio_Rápido">Inicio Rápido</h2>
+
+<p>Una extensión <a class="external" href="http://mozilla.doslash.org/stuff/helloworld.zip">Hola Mundo</a> similar que puedes generar con el Extension Wizard es explicado línea por línea en <a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">otro tutorial desde la MozillaZine Knowledge Base (Base de Conocimiento MozillaZine)</a>.</p>
+
+<h2 id="Configurando_un_Ambiente_de_Desarrollo">Configurando un Ambiente de Desarrollo</h2>
+
+<p>Las extensiones son empaquetadas y distribuidas en archivos ZIP o <a href="/en-US/docs/Bundles" title="/en-US/docs/Bundles">Bundles</a>, con la extensión de archivos <code>XPI</code>.</p>
+
+<p><code>Un ejemplo del contenido dentro de un archivo XPI típico </code>:</p>
+
+<pre class="eval">my_extension.xpi:                         //<code>Igual a una carpeta llamada</code> <strong style="font-weight: bold;">my_extension</strong><strong>/</strong>
+          <a href="/en-US/docs/Install_Manifests" title="/en-US/docs/Install Manifests">/install.rdf </a>                   //<code>Información general sobre tu extensión</code>
+          /<a href="/en-US/docs/Chrome_Registration" title="/en-US/docs/Chrome_Registration">chrome.manifest</a>                //Registra tu contenido con el motor <a href="/en-US/docs/Chrome_Registration" title="https://developer.mozilla.org/en-US/docs/chrome_registration">Chrome</a>
+          /chrome/
+          /chrome/content/                //Contenido de tu extensión, por ejemplo, archivos XUL and JavaScript
+          /<a href="/en-US/docs/Window_icons" title="/en-US/docs/Window_icons">chrome/icons/default/*</a>         //Iconos por defecto de tu extensión
+          /chrome/locale/*                //Construyendo una Extensión# <a href="/en-US/docs/Building_an_Extension#Localization" title="https://developer.mozilla.org/en-US/docs/Building_an_Extension#Localization">Localización</a>
+          <a href="#Defaults_Files">/defaults/preferences/*.js</a>      //Construyendo una Extensión# <a href="/en-US/docs/Building_an_Extension#Defaults_Files" title="https://developer.mozilla.org/en-US/docs/Building_an_Extension#Defaults_Files">Archivos por defecto</a>
+          /plugins/*
+<a href="#XPCOM_Components">          /components/*</a>
+          <a href="#Application_Command_Line">/components/cmdline.js</a></pre>
+
+<p>Desearemos construir una estructura de archivos similar a la anterior para nuestro tutorial, así que comencemos creando una carpeta para tu extensión en algún lugar de tu disco duro (por ejemplo, <code>C:\extensions\my_extension\</code> or <code>~/extensions/my_extension/</code>). Dentro de la nueva carpeta para la extensión, crea otra carpeta llamada <code>chrome</code>, y dentro de la carpeta <code>chrome</code>, crea una carpeta llamada <code>content</code>.</p>
+
+<p>Dentro del directorio <strong>raíz</strong> de la carpeta de tu extensión, crea dos archivos de texto nuevos, llamados <code>chrome.manifest<span style="font-family: verdana,tahoma,sans-serif;"> </span></code>e <code>install.rdf</code>. En el directorio <strong>chrome/content</strong>, crea un nuevo archivo de texto vacío llamado <code>sample.xul</code>.</p>
+
+<p>Deberías concluir con esta estructura de directorio:</p>
+
+<ul>
+ <li>install.rdf</li>
+ <li>chrome.manifest</li>
+ <li>chrome\
+  <ul>
+   <li>content\
+    <ul>
+     <li>sample.xul</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<p><span class="comment">&lt;pre&gt; #!/bin/sh h=$HOME/moExt mkdir -p $h/my_extension/chrome/content touch $h/my_extension/chrome.manifest $h/my_extension/install.rdf &lt;/pre&gt;</span> Por favor lee la información adicional sobre configuración de un ambiente de desarrollo en el artículo <a href="/en-US/docs/Setting_up_extension_development_environment" title="/en-US/docs/Setting_up_extension_development_environment">Configurando un ambiente de desarrollo</a>.</p>
+
+<p>{{ gecko_minversion_note("1.9.2", "Starting in Gecko 1.9.2 (Firefox 3.6), you can also simply include an icon, named <code>icon.png</code>, in the base directory of the add-on. This allows your add-on's icon to be displayed even when the add-on is disabled, or if the manifest is missing an <code>iconURL</code> entry.") }}</p>
+
+<h2 id="Crear_el_Manifiesto_de_Instalación">Crear el Manifiesto de Instalación</h2>
+
+<p>Abre el archivo llamado <code><a href="/en-US/docs/Install_Manifests" title="/en-US/docs/Install_Manifests">install.rdf</a></code> que creaste en el tope de la jerarquía de carpetas de tu extensión y agrega dentro lo siguiente:</p>
+
+<pre class="brush: xml  language-xml"><code class="language-xml"><span class="prolog token">&lt;?xml version="1.0"?&gt;</span>
+
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>RDF</span> <span class="attr-name token">xmlns</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.w3.org/1999/02/22-rdf-syntax-ns#<span class="punctuation token">"</span></span>
+     <span class="attr-name token"><span class="namespace token">xmlns:</span>em</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.mozilla.org/2004/em-rdf#<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>Description</span> <span class="attr-name token">about</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>urn:mozilla:install-manifest<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>sample@example.net<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>version</span><span class="punctuation token">&gt;</span></span>1.0<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>version</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>type</span><span class="punctuation token">&gt;</span></span>2<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>type</span><span class="punctuation token">&gt;</span></span>
+
+    <span class="comment token">&lt;!-- Target Application this extension can install into,
+         with minimum and maximum supported versions. --&gt;</span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>targetApplication</span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>Description</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>id</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>minVersion</span><span class="punctuation token">&gt;</span></span>1.5<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>minVersion</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>maxVersion</span><span class="punctuation token">&gt;</span></span>4.0.*<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>maxVersion</span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>Description</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>targetApplication</span><span class="punctuation token">&gt;</span></span>
+
+    <span class="comment token">&lt;!-- Front End MetaData --&gt;</span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>name</span><span class="punctuation token">&gt;</span></span>sample<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>name</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>description</span><span class="punctuation token">&gt;</span></span>A test extension<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>description</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>creator</span><span class="punctuation token">&gt;</span></span>Your Name Here<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>creator</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span><span class="namespace token">em:</span>homepageURL</span><span class="punctuation token">&gt;</span></span>http://www.example.com/<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span><span class="namespace token">em:</span>homepageURL</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>Description</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>RDF</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<ul>
+ <li><code><strong><span class="link-mailto linkification-ext">sample@example.net</span></strong></code> – el ID de la extensión. Este es un valor con el que identificas tu extensión en formato de direccón de correo electrónico (nota que no debería ser <em>tu</em> email). Hazlo único. También podrías usar un GUID. NOTA: Este parámetro DEBE estar en formato de dirección de correo electrónico, aunque NO tiene que ser una dirección válida. (<code><span class="link-mailto">example@example.example</span></code>)</li>
+ <li>Especifica <code>&lt;em:type&gt;2&lt;/em:type&gt;</code> – el 2 declara que está instalando una extensión. Si fueras a instalar un tema (theme) sería 4 (mira <a href="/en-US/docs/Install_Manifests#type" title="/en-US/docs/Install_Manifests#type">Install Manifests#type</a> para otros tipos de códigos).</li>
+ <li><code><strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong></code> – ID de la aplicación Firefox.</li>
+ <li><code><strong>1.5</strong></code> – el número exacto de la versión más antigua de Firefox para la cual estableces que esta extensión funcionará. Nunca uses un * en minVersion; es muy seguro que no hagas lo que esperas.</li>
+ <li><code><strong>4.0.*</strong></code> – la versión máxima de Firefox para la cual dices que esta extensión funcionará. En este caso, "4.0.*" indica que la extensión funciona con Firefox 4.0 y cualquier entrega 4.0.x subsecuente. Este número necesita ser menor o igual a la <a class="external" href="http://wiki.mozilla.org/Releases" title="http://wiki.mozilla.org/Releases">versión anunciada de Firefox</a>. Por defecto, Firefox 10 y posteriores no fuerzan una restricción contra <code>maxVersion</code> (aunque comenzando en Firefox 11, valores muy antiguos de <code>maxVersion</code> son todavía forzados). Puedes forzan a la aplicación a hacerlo usando <code>&lt;em:strictCompatibility&gt;</code>.</li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> si obtienes un mensajes que <code>install.rdf</code> está mal formado, es útil cargarlo en Firefox usando el comando Archivo-&gt;Abrir Archivo que reportará los errores XML para ti.</div>
+
+<p>Las extensiones diseñadas para funcionar con Firefox 2.0.0.x como la última deben configurar la máxima versión a "2.0.0.*". Las extensiones diseñadas para funcionar con Firefox 1.5.0.x como la última deben configurar la máxima versión a "1.5.0.*"</p>
+
+<p>Mira <a href="/en-US/docs/Install_Manifests" title="/en-US/docs/Install_Manifests">Manifiestos de Instalación</a> para una lista completa de las propiedades requeridas y opcionales.</p>
+
+<p>Guarda el archivo.</p>
+
+<h2 id="Extendiendo_el_Navegador_con_XUL">Extendiendo el Navegador con XUL</h2>
+
+<p>La interfaz de usuario de Firefox está escrita en XUL y JavaScript. <a href="/en-US/docs/XUL" title="/en-US/docs/XUL">XUL</a> es una grática XML que provee widgets de interfaz como botones, menús, barras de herramientas, árboles, etc. Las acciones de los usuarios están ligadas a funcionalidad usando JavaScript.</p>
+
+<p>Para extender el navegador, modificamos partes de la interfaz de usuario del navegador, agregando o modificando widgets. Agreramos widgets insertando nuevos elementos XUL DOM en la ventana del navegador y los modificamos usando script y vinchulando manejadores de eventos.</p>
+
+<p>El navegador es implementado en un archivo XUL llamado <code>browser.xul</code> (<code>$FIREFOX_INSTALL_DIR/chrome/browser.jar</code> contiene <code>content/browser/browser.xul</code>). En browser.xul podemos encontrar la barra de estado, que se parece a algo como esto:</p>
+
+<pre class="eval  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarpalette</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>BrowserToolbarPalette<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+ ... <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarbutton</span><span class="punctuation token">&gt;</span></span>s ...
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>toolbarpalette</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p><code>&lt;statusbar id="status-bar"&gt;</code> es un  "punto de fusión" para un XUL Overlay.</p>
+
+<h3 id="XUL_Overlays">XUL Overlays</h3>
+
+<p><a href="/en-US/docs/XUL_Overlays" title="/en-US/docs/XUL_Overlays">Los XUL Overlays</a> son una forma de enlazar en tiempo de ejecución otros widgets de la interfaz de usuario a un documento XUL. Un XUL Overlay es un archivo .xul  que especifíca fragmentos XUL a insertar en puntos de fusión específicos dentro de un documento "maestro". Estos fragmentos pueden especificar la inserción, eliminación o modificación de widgets.</p>
+
+<p><strong>Ejemplo de un Documento XUL Overlay</strong></p>
+
+<pre class="eval  language-html"><code class="language-html"><span class="prolog token">&lt;?xml version="1.0"?&gt;</span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>overlay</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>sample<span class="punctuation token">"</span></span>
+         <span class="attr-name token">xmlns</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+ <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarpalette</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>BrowserToolbarPalette<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>toolbarbutton</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>my-button<span class="punctuation token">"</span></span> <span class="attr-name token">label</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>Hello, World<span class="punctuation token">"</span></span>  <span class="punctuation token">/&gt;</span></span>
+ <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>toolbarpalette</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>overlay</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p>La <code>&lt;</code>toolbarpalette<code>&gt;</code> llamada<code><strong> </strong></code><strong>BrowserToolbarPalette </strong> especifica el "punto de fusión" que queremos enlazar dentro de la ventana del navegador.</p>
+
+<p>El hijo <code>&lt;</code>toolbarbutton<code>&gt;</code> es un nuevo widget que queremos insertar dentro de un punto de fusión.</p>
+
+<p>Copia el código de ejemplo anterior y guardalo en tu archivo llamado <code><strong>sample.xul</strong></code> dentro de la carpeta <code>chrome/content</code> que has creado.</p>
+
+<p>Para más información sobre fusionar widgets y modificar la interfaz de usuario usando Overlays, mira debajo.</p>
+
+<h2 id="Chrome_URIs">Chrome URIs</h2>
+
+<p>Los archivos XUL son parte de "<a href="/en-US/docs/Chrome_Registration" title="/en-US/docs/Chrome_Registration">Paquetes Chrome</a>" - envoltorios de componentes de interfaz de usuario que son cargados a través de <code>URIs chrome://</code>. En lugar de cargar el navegador desde el disco usando una URI <code>file://</code>  (ya que la ubicación de Firefox en el sistema puede cambiar de plataforma a plataforma y de sistema a sistema), los desarrolladores de Mozilla encontraron una solución para crear URIs para contenido XUL que la aplicación instalada conoce.</p>
+
+<p>La ventana del navegador es: <code><a class="external" rel="freelink">chrome://browser/content/browser.xul</a></code>. Prueba tipiando esta URL en la barra de navegación de Firefox!</p>
+
+<p>Las Chrome URIs constan de varios componentes:</p>
+
+<ul>
+ <li>Primero, el <strong>esquema URI</strong> (<code>chrome</code>) que le comunica a la librería de red de Firefox que es una Chrome URI. Indica que el contenido de la URI debería ser tratada como un (<code>chrome</code>). A diferencia de (<code>chrome</code>), (<code>http</code>) le comunica a Firefox que debe tratar la URI como una página web.</li>
+ <li>Segundo, un nombre de paquete (en el anterior ejemplo, <code><strong>browser</strong></code>) que identifica el envoltorio de componentes de interfaz de usuario. Este debería ser lo más único posible para tu aplicación, para evitar colisiones entre extensiones.</li>
+ <li>Tercero, el tipo de dato que es requerido. Existen tres tipos: <code>content</code> (XUL, JavaScript, XBL bindings, etc. que forman la estructura y el comportamiento de una aplicación de interfaz de usuario), <code>locale</code> (DTD, archivos .properties, etc que contienen strings para la <a href="/en-US/docs/Localization" title="/en-US/docs/Localization">localización</a> de la interfaz de usuario) , y <code>skin</code> (CSS e imágenes que forman el <a href="/en-US/docs/Themes" title="/en-US/docs/Themes">tema</a> de la interfaz de usuario).</li>
+ <li>Finalmente, la dirección del archivo a cargar.</li>
+</ul>
+
+<p>Así que, <code><a class="external" rel="freelink">chrome://foo/skin/bar.png</a></code> carga el archivo <code>bar.png</code> desde la sección <code>skin</code> del tema <code>foo</code>.</p>
+
+<p>Cuando cargas contenido usando una Chrome URI, Firefox usa el Chrome Registry (Registro de Chrome) para traducir estas URIs en los archivos fuente actuales dentro del disco (o en paquetes JAR).</p>
+
+<h2 id="Crea_un_Manifiesto_Chrome">Crea un Manifiesto Chrome</h2>
+
+<p>Para más información de Manifiestos Chrome y las propiedades que soportan, mira Referencia <a href="/en-US/docs/Chrome_Registration" title="/en-US/docs/Chrome_Registration">de Manifiestos Chrome</a>.</p>
+
+<p>Abre el archivo denominado <strong>chrome.manifest</strong> que has creado junto al directorio <code>chrome</code> en la raíz de la jerarquía de carpetas de tu extensión.</p>
+
+<p>Agrega este código:</p>
+
+<pre class="eval">content     sample    chrome/content/
+</pre>
+
+<p>(<strong>No te olvides de la barra, "<code>/</code>"!</strong> Sin ella, el paquete no será registrado.)</p>
+
+<p>Esto especifica:</p>
+
+<ol>
+ <li>tipo de material dentro del paquete chrome.</li>
+ <li>nombre del paquete chrome (asegúrate de usar todos caracteres en minúscula para ele nombre del paquete ("sample") ya que Firefox/Thunderbird no soporta doesn't support caracteres mixtos en la versión 2 y anteriores - {{ Bug("132183") }})</li>
+ <li>ubicación de los archivos de paquetes chrome.</li>
+</ol>
+
+<p><br>
+ Entonces, esta línea establece que para un paquete chrome <strong>sample</strong>, podremos encontrar sus archivos de contenido (<strong>content)</strong> en la ubicación <code>chrome/content</code> que es una dirección relativa a la ubicación del manifiesto <code>chrome.manifest</code>.</p>
+
+<p>Tenga en cuenta que los archivos de contenido (content), localización (locale), y apariencia (skin) deben mantenerse dentro de carpetas llamadas content, locale, and skin dentro del subdirectorio <code>chrome</code>.</p>
+
+<p>Guarda el archivo. Cuando ejecutes Firefox con tu extensión (más adelante en este tutorial), esto va a registrar el paquete chrome.</p>
+
+<h2 id="Registrar_un_Overlay">Registrar un Overlay</h2>
+
+<p>Necesitas que Firefox fusione tu overlay (capa) con la ventana del navegador siempre que se despliegue una. Así que agrega esta linea al archivo <code>chrome.manifest</code>:</p>
+
+<pre class="eval">overlay <a class="external" rel="freelink">chrome://browser/content/browser.xul</a> <a class="external" rel="freelink">chrome://sample/content/sample.xul</a>
+</pre>
+
+<p>Esto le dice a Firefox que fusione <code>sample.xul</code> en <code>browser.xul</code> cuando se cargue <code>browser.xul</code>.</p>
+
+<h2 id="Prueba">Prueba</h2>
+
+<p>Primero, necesitamos comunicarle a Firefox sobre nuestra extensión. Durante la fase de desarrollo para versiones de Firefox 2.0 y posteriores, puedes señalar a Firefox hacia la carpeta donde estés desarrollando la extensión, y la cargará cada vez que reinicies Firefox.</p>
+
+<ol>
+ <li>Ubica tu <a class="external" href="http://kb.mozillazine.org/Profile_folder" title="http://kb.mozillazine.org/Profile_folder">carpeta de perfil</a> y dentro el perfil con el que quieres trabajar (ej., <code>Firefox/Profiles/&lt;profile_id&gt;.default/</code>).</li>
+ <li>Abra la carpeta <code>extensions/</code>, creandola de ser necesario.</li>
+ <li>Crea un nuevo archivo de texto y coloca dentro la dirección completa de tu carpeta de desarrollo (ej., <code>C:\extensions\my_extension\</code> or <code>~/extensions/my_extension/)</code>. Los usuarios de Windows deberían conservar la dirección de la barra, y <em>todos</em> deberían acordarse de <strong>incluir</strong> una barar de cierre y <strong>eliminar</strong> cualquier espacio.</li>
+ <li>Guarda el archivo con la id de tu extensión como su nombre (ej., <code><a class="linkification-ext link-mailto" href="mailto:sample@example.net" title="Linkification: mailto:sample@example.net">sample@example.net</a></code>). Sin extensión de archivo.</li>
+</ol>
+
+<p>Ahora deberías estar listo opara probar tu extensión!</p>
+
+<p>Ejecuta Firefox. Firefox detectará el texto de enlace hacia el directorio de tu extensión e instalará la Extensión. Cuando aparezca la ventana del navegador deberías ver el texto "Hello, World!" en la parte derecha del panel con la barra de estado.</p>
+
+<p>Ahora puedes volver y hacer cambios al archivo .xul, cierra y reinicia Firefox, y deberían aparecer.</p>
+
+<h2 id="Empaquetamiento">Empaquetamiento</h2>
+
+<p>Ahora que tu extensión funciona, puedes <a href="/en-US/docs/Extension_Packaging" title="/en-US/docs/Extension_Packaging">empaquetarla</a> para su despliegue e instalación.</p>
+
+<p>Comprime (zip) los <strong>contenidos (contents)</strong> de la carpeta de tu extensión (no la carpeta de extensión misma), y renombra el archivo zip para que tenga la extensión .xpi. En Windows XP, puedes hacer esto fácilmente seleccionando todos los archivos y subcarpetas en la carpeta de tu extensión, haciendo click derecho y seleccionando "Enviar a -&gt; Carpeta comprimida (zip)". Se creará un archivo .zip para ti. Sólo renombralo y ya terminaste!</p>
+
+<p>En Mac OS X, puedes hacer click derecho en los <strong>contenidos (contents)</strong> de la carpeta de la extensión y elegir "Crear archivo de..." para hacer un archivo zip. Sin embargo, ya que Mac OS X agrega archivos ocultos a las carpetas para rastrear los metadatos de los archivos, deberías usar la Terminal, eliminar los archivos ocultos (cuyos nombre comienzan con un punto), y luego usar el comando zip en la linea de comandos para crear el archivo zip.</p>
+
+<p>En Linux, podrías también usar la herramienta zip de linea de comandos.</p>
+
+<p>Si tienes el 'Extension Builder' (Constructor de Extensiones) instalado, puede compliar el archivo .xpi para ti (Tools -&gt; Extension Developer -&gt; Extension Builder). Simplemente navega al directorio donde está tu extensión (install.rdf, etc.), y presiona el botón Build Extension. Esta extensión tiene una gran cantidad de herramientas para facilitar el desarrollo.</p>
+
+<p>Ahora carga el archivo .xpi en tu servidor, asegúrate de que es servido como una <code>application/x-xpinstall</code>. Puedes obtener un enlace al mismo y permitir que las personas lo descarguen e instalen. Con el propósito de simplemente testearnuestro archivo .xpi, podemos sólo arrastrarlo en la ventana de extensiones, en Herramientas -&gt; Extensiones para Firefox 1.5.0.x, o  Herramientas -&gt; Complementos para versiones posteriores.</p>
+
+<h3 id="Instalando_desde_una_página_web">Instalando desde una página web</h3>
+
+<p>Existen muchas formas de instalar extensiones desde páginas web, incluyendo enlace directo hacia archivos XPI y usando el objeto InstallTrigger. Los autores web y de extensiones son alentados a usar el  <a href="/en-US/docs/Installing_Extensions_and_Themes_From_Web_Pages" title="/en-US/docs/Installing_Extensions_and_Themes_From_Web_Pages">método InstallTrigger</a> para instalar XPIs, ya que provee la mejor experiencia a los usuarios.</p>
+
+<h3 id="Usando_addons.mozilla.org">Usando addons.mozilla.org</h3>
+
+<p>Los Complementos para Firefox es un sitio de distribución donde puedes alojar tu extensión gratuitamente. tu extensión será alojada en un espejo (mirror) de la red de Mozilla para garantizar tu descarga a pesar de que pueda ser muy popular. El sitio de Mozilla también provee una sencilla instalación para los usuarios, y automáticamente hará que tus versiones más nuevas estén disponibles cuando las cargues. Además, los Complementos para Firefox permiten a los usuarios comentar y proveer una retroalimentación en tu extensión. Es altamente recomendado que uses los Complementos de Firefox para distribuir tus extensiones!</p>
+
+<p>Visita <a class="linkification-ext external" href="http://addons.mozilla.org/developers/" title="Linkification: http://addons.mozilla.org/developers/">http://addons.mozilla.org/developers/</a> para crearte una cuenta y comenzar a distribuir tus extensiones!</p>
+
+<p><em>Nota:</em> Tu Extensión será enviada más rápidamente y descargada más veces si tienes una buena descripción y algunas capturas de pantalla de la extensión en acción.</p>
+
+<h3 id="Instalando_Extensiones_Usando_una_Instalador_Separado">Instalando Extensiones Usando una Instalador Separado</h3>
+
+<p>Es posible instalar extensiones en un directorio especial y será instalado la próxima vez que la aplicación comience. La extensión estará disponible para cualquier perfil. Mira  <a class="internal" href="/en-US/docs/Installing_extensions" title="/en-US/docs/Installing extensions">lnstalando extensiones</a> para más información.</p>
+
+<p>En Windows, la información sobre extensiones puede ser agregada al registro, y las extensiones serán recogidas automáticamente la proxima vez que la aplicación comience. Esto permite a los instaladores de aplicaciones agregar fácilmente ganchos de integración como extensiones. Mira <a href="/en-US/docs/Adding_Extensions_using_the_Windows_Registry" title="/en-US/docs/Adding_Extensions_using_the_Windows_Registry">Agregando Extensiones usando el Registro de Windows</a> para más información.</p>
+
+<h2 id="Más_sobre_XUL_Overlays">Más sobre XUL Overlays</h2>
+
+<p>Además de agregar widgets de interfaz de usuario al punto de fusión, puedes usar los fragmentos XUL dentro de los Overlays para controlar la posición de los widgets insertados:</p>
+
+<pre class="eval  language-html"><code class="language-html">&lt;toolbarbutton position="1" ...  /&gt;
+
+&lt;toolbarbutton insertbefore="other-id" ...  /&gt;
+
+&lt;toolbarbutton insertafter="other-id" ...  /&gt;</code></pre>
+
+<h2 id="Creando_Nuevos_Componentes_de_Interfaz_de_Usuario">Creando Nuevos Componentes de Interfaz de Usuario</h2>
+
+<p>Puedes crear tus propias ventanas y cuadros de diálogo como archivos .xul separados, brindando funcionalidad a través de la implementación de acciones de usuarios en archivos .js, usando métodos DOM  para manipular widgets de interfaz de usuario. Puedes usar reglas de estilos en archivos .css para enlazar imágenes, establecer colores, etc.</p>
+
+<p>Mira la documentación <a href="/en-US/docs/XUL" title="/en-US/docs/XUL">XUL</a> con más recursos para los desarrolladores XUL.</p>
+
+<h2 id="Archivos_por_Defecto">Archivos por Defecto</h2>
+
+<p>Los archivos por defecto que usas para sembrar un perfil de usuario deberían ser ubicados en <code>defaults/</code> debajo de la raíz de la jerarquía de carpetas de tu extensión. Los archivos .js de preferencias por defecto deberían ser almacenados en <code>defaults/preferences/</code> - si los ubicas aquí serán cargados automáticamente por el sistema de preferencias de Firefox cuando arranque, y así podrás accederlos usando la <a href="/en-US/docs/Preferences_API" title="/en-US/docs/Preferences_API">API de Preferencias</a>.</p>
+
+<p>Un archivo de preferencia por defecto de ejemplo:</p>
+
+<pre class="eval">pref("extensions.sample.username", "Joe"); //a string pref
+pref("extensions.sample.sort", 2); //an int pref
+pref("extensions.sample.showAdvanced", true); //a boolean pref
+</pre>
+
+<h2 id="Componentes_XPCOM">Componentes XPCOM</h2>
+
+<p>Firefox soporta componentes <a href="/en-US/docs/XPCOM" title="/en-US/docs/XPCOM">XPCOM</a> en las extensiones. Puedes crear tus propios componentes fácilmente en JavaScript o en C++ (usando <a href="/en-US/docs/Gecko_SDK" title="/en-US/docs/Gecko_SDK">Gecko SDK</a>).</p>
+
+<p>Ubica todos tus archivos .js o .dll en <code>el directorio components/</code> - son registrados automáticamente la primera vez que se ejecute Firefox luego de que tu extensión es instalada.</p>
+
+<p>Para más información mira <a href="/en-US/docs/How_to_Build_an_XPCOM_Component_in_Javascript" title="/en-US/docs/How_to_Build_an_XPCOM_Component_in_Javascript">Cómo Construir un Componente XPCOM en Javascript</a>, <a href="/en-US/docs/How_to_build_a_binary_XPCOM_component_using_Visual_Studio" title="/en-US/docs/How_to_build_a_binary_XPCOM_component_using_Visual_Studio">Cómo construir un componente XPCOM binario usando Visual Studio,</a> y el libro <a href="/en-US/docs/Creating_XPCOM_Components" title="/en-US/docs/Creating_XPCOM_Components">Creando Componentes XPCOM</a>.</p>
+
+<h3 id="Línea_de_Comandos_de_la_Aplicación">Línea de Comandos de la Aplicación</h3>
+
+<p>Uno de los posibles usos de los componentes XPCOM personalizados, es agregar un manejador de líneas de ocmandos para Firefox o Thunderbird. Puedes usar esta técnica para ejecutar tu extensión como una aplicación:</p>
+
+<pre class="eval"> firefox.exe -myapp
+</pre>
+
+<p><span class="comment">I should move the useful parts of this to the Command Line page. -Nickolay This is done by adding a component containing the function... function NSGetModule(comMgr, fileSpec) { return myAppHandlerModule; } This function is run by firefox each time firefox is started. Firefox registers the myAppHandlerModule's by calling its 'registerSelf()'. Then it obtains the myAppHandlerModule's handler factory via 'getClassObject()'. The handler factory is then used to create the handle using its 'createInstance(). Finally, the handle's 'handle(cmdline)' processes the command line cmdline's handleFlagWithParam() and handleFlag().</span> Mira <a href="/en-US/docs/Chrome/Command_Line" title="/en-US/docs/Chrome/Command_Line">Chrome: Línea de Comandos</a> y un <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=365297">foro de discusión</a> para más detalles.</p>
+
+<h2 id="Localización">Localización</h2>
+
+<p>Para soportar más de un lenguaje, deberías separar los strings (cadenas de caracteres) de tu contenido usando <a href="/en-US/docs/XUL_Tutorial/Localization" title="/en-US/docs/XUL_Tutorial/Localization">entidades</a> y <a href="/en-US/docs/XUL_Tutorial/Property_Files" title="/en-US/docs/XUL_Tutorial/Property_Files">envoltorios de strings</a>. Es mucho más fácil hacer esto mientras estás desarrollando tu extensión, en lugar de volver y hacerlo después!</p>
+
+<p>La información de localización es almacenada en el directorio locale para tu extensión. Por ejemplo, para agregar un locale a tu extensión de ejemplo, crea dos directorios anidados "locale/en-US" en chrome (donde está ubicado el directorio "content") y agrega la siguiente línea al archivo chrome.manifest:</p>
+
+<pre class="eval">locale sample en-US chrome/locale/en-US/
+</pre>
+
+<p>Para crear valores de atributo localizables en XUL, puedes ubicar los valores en un archivo<code> .dtd</code> (sample.dtd para tu extensión de prueba). Este archivo debería ser ubicado en el directorio locale y se parece a esto:</p>
+
+<pre class="eval">&lt;!ENTITY  my-panel.label  "Hello, World"&gt;
+</pre>
+
+<p>Luego incluyélo el comienzo de tu documento XUL (pero debajo de"&lt;?xml version"1.0"?&gt;"), como se ve a continuación:</p>
+
+<pre class="eval  language-html"><code class="language-html"><span class="prolog token">&lt;?xml version="1.0"?&gt;</span>
+<span class="doctype token">&lt;!DOCTYPE window SYSTEM "chrome://packagename/locale/filename.dtd"&gt;</span>
+...</code></pre>
+
+<p>donde <code><strong>window</strong></code> es el valor <code><a href="/en-US/docs/DOM/Node.localName" title="/en-US/docs/DOM/element.localName">localName (nombre local)</a></code> del elemento raíz del documento XUL, y el valor de la propiedad <code>SYSTEM</code> es la URI chrome hacia el archivo de entidad.</p>
+
+<p>Para nuestra extensión de ejemplo, reemplaza <code><strong>window</strong></code> con <code><strong>overlay</strong></code> (elemento raíz), <code><strong>packagename</strong></code> con <code><strong>sample</strong></code>, y <code><strong>filename.dtd</strong></code> con <code><strong>sample.dtd</strong></code>.</p>
+
+<p>Para usar las entidades, modifica tu XUL para que se vea así:</p>
+
+<pre class="eval">&lt;statusbarpanel id="my-panel" label="&amp;my-panel.label;"  /&gt;
+</pre>
+
+<p>El Registro de Chrome se asegurará que el archivo de entidad es cargado desde el envoltorio de localización que se corresponda con la configuración regional seleccionada.</p>
+
+<p>Para los strings que usas en script, crea un archivo .propertie, un archivo de texto que tiene un string en cada lína en este formato:</p>
+
+<pre class="eval">clave=valor
+</pre>
+
+<p>y luego usa {{ interface("nsIStringBundleService") }}/{{ interface("nsIStringBundle") }} o el tag {{ XULElem("stringbundle") }} para cargar valores en el script.</p>
+
+<h2 id="Entendiendo_el_Navegador">Entendiendo el Navegador</h2>
+
+<p>Usa el <a href="/en-US/docs/DOM_Inspector" title="/en-US/docs/DOM_Inspector">Inspector DOM</a> para inspeccionar la ventana del navegador o cualquier otra ventana XUL que quieras extender.</p>
+
+<p><strong>Nota:</strong> <strong>El Inspector DOM </strong>no es parte de la instalación <strong>Estándar</strong> de Firefox. Desde Firefox 3 Beta 4, el Inspector DOM está disponible desde <a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/6622">Los Complementos de Firefox</a> como una extensión por separado. Para versiones anteriores, debes reinstalar con la dirección de instalación Personalizada y seleccionar <strong>Inspector DOM</strong> (o <strong>Developer Tools</strong> en Firefox 1.5) si no hay un ítem "Inspector DOM" en el menú de herramientas de tu navegador.</p>
+
+<p>Usa el botón apunta-y-clickea sobre un nodo en el tope izquierdo de la barra de herramientas del Inspector DOM para clickear sobre un nodo en la ventana XUL, para seleccionar visualmente. Cuando haces esto, el inspector salta en el árbol de jerarquía DOM hacia el nodo que ha sido clickeado.</p>
+
+<p>Usa el panel lateral derecho del Inspector DOM para descubrir puntos de fusión con ids que puedas usar para insertar tus elementos desde overlays. Si no puedes encontrar un elemento con un id que puedas fusionar, podrías necesitar enlazar un script en tu overlay e insertar tus elementos cuando se dispare el evento <code>load</code> en la ventana XUL maestra.</p>
+
+<h2 id="Depurando_Extensiones">Depurando Extensiones</h2>
+
+<p><strong>Herramientas Analíticas para Depuración</strong></p>
+
+<ul>
+ <li>El <a href="/en-US/docs/DOM_Inspector" title="/en-US/docs/DOM_Inspector">inspector DOM</a> - inspecciona atributos, estructura DOM, reglas de estilo CSS que están activas (ej., averigua porqué tus reglas de estilo no parecen estar funcionando para un elemento - una herramienta invaluable!)</li>
+ <li><a href="/en-US/docs/Venkman" title="/en-US/docs/Venkman">Venkman</a> - configura puntos de quiebre (breakpoints) en JavaScript e inspecciona pilas de llamadas.</li>
+ <li><code>Components.stack.caller&gt;</code> en JavaScript - accede a la pila de llamada de una función</li>
+</ul>
+
+<p><strong>Depuración con printf </strong></p>
+
+<ul>
+ <li>Usa <code><a href="/en-US/docs/DOM/window.dump" title="/en-US/docs/DOM/window.dump">dump</a>("string")</code> (mira el enlace para más detalles; esto requiere alguna configuración para trabajar correctamente)</li>
+ <li>Usa <code><a href="/en-US/docs/Components.utils.reportError" title="/en-US/docs/Components.utils.reportError">Components.utils.reportError()</a></code> o {{ interface("nsIConsoleService") }} para hacer log en la consola de JavaScript</li>
+</ul>
+
+<p><strong>Depuración avanzada</strong></p>
+
+<ul>
+ <li>Ejectua un build de Firefox para depuración y configura puntos de quiebre en Firefox mismo, o tus componentes en C++. Para el desarollador experimentado, esta es frecuentemente la forma más rápida de diagnosticar un problema. Mira <a href="/en-US/docs/Developer_Guide/Build_Instructions" title="/en-US/docs/Build_Documentation">Build Documentation</a> y <a href="/en-US/docs/Developer_Guide" title="/en-US/docs/Developing_Mozilla">Developing Mozilla</a> para más información.</li>
+ <li>Mira <a href="/en-US/docs/Debugging_a_XULRunner_Application" title="/en-US/docs/Debugging_a_XULRunner_Application">Depurando una Aplicación XULRunner</a> para más consejos útiles.</li>
+</ul>
+
+<h2 id="Más_Información">Más Información</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Extension_Frequently_Asked_Questions" title="/en-US/docs/Extension_Frequently_Asked_Questions">FAQ (Preguntas Frecuentes) sobre Extensiones</a></li>
+ <li><a href="/en-US/docs/Extensions" title="/en-US/docs/Extensions">Extensiones</a></li>
+</ul>
diff --git a/files/es/conflicting/tools/about_colon_debugging/index.html b/files/es/conflicting/tools/about_colon_debugging/index.html
new file mode 100644
index 0000000000..2fb0a75710
--- /dev/null
+++ b/files/es/conflicting/tools/about_colon_debugging/index.html
@@ -0,0 +1,12 @@
+---
+title: Debugging over a network
+slug: conflicting/Tools/about:debugging
+translation_of: Tools/about:debugging#Connecting_over_the_Network
+translation_of_original: Tools/Remote_Debugging/Debugging_over_a_network
+original_slug: Tools/Remote_Debugging/Debugging_over_a_network
+---
+<blockquote>
+<h3 id="draft">{{draft}}</h3>
+</blockquote>
+
+<p>Coming soon...</p>
diff --git a/files/es/conflicting/tools/performance/index.html b/files/es/conflicting/tools/performance/index.html
new file mode 100644
index 0000000000..66dc76c6a1
--- /dev/null
+++ b/files/es/conflicting/tools/performance/index.html
@@ -0,0 +1,106 @@
+---
+title: JavaScript Profiler
+slug: conflicting/Tools/Performance
+translation_of: Tools/Performance
+translation_of_original: Tools/Profiler
+original_slug: Tools/Profiler
+---
+<div>
+ Utilice la herramienta de perfiles para encontrar los cuellos de botella en el código JavaScript. El Profiler muestras periódicamente la pila actual de llamadas JavaScript y compila información sobre las muestras. </div>
+<div>
+  </div>
+<div>
+ Puede iniciar el Analizador seleccionando "Profiler" en el menú "Web Developer". Usted encontrará en el menú "Web Developer" en el menú "Herramientas" en Linux y OS X, y directamente bajo el menú "Firefox" en Windows. </div>
+<div>
+  </div>
+<div>
+ La <a href="/en-US/docs/Tools/DevTools_Window">Caja de herramientas</a> se abrirá, con el Profiler seleccionado.</div>
+<div>
+  </div>
+<h2 id="Los_perfiladores_de_muestreo"><a name="sampling-profilers">Los perfiladores de muestreo</a></h2>
+<p>El perfilador de JavaScript es un generador de perfiles de muestreo. Esto significa que las muestras periódicamente el estado del motor de JavaScript, y registra la pila para el código que se ejecuta en el momento de tomar la muestra. Estadísticamente, el número de muestras tomadas en la que estábamos ejecutando una función particular, corresponde a la cantidad de tiempo que el navegador está gastando ejecutarlo, para que pueda identificar los cuellos de botella en el código.<br>
+ <br>
+ <a name="profiling-example">Por ejemplo, considere un programa como este:</a></p>
+<pre class="brush: js">function doSomething() {
+  var x = getTheValue();
+  x = x + 1;                   // -&gt; sample A
+  logTheValue(x);
+}
+
+function getTheValue() {
+  return 5;
+}
+
+function logTheValue(x) {
+ console.log(x);               // -&gt; sample B, sample C
+}
+
+doSomething();</pre>
+<p>Supongamos que ejecutar este programa con el perfilador activo, y en el tiempo que se tarda en ejecutar, el perfilador toma de tres muestras, como se indica en los comentarios en línea de arriba. </p>
+<p>Todos están tomadas desde el interior <code>doSomething()</code>, pero los otros dos se encuentran dentro de la función <code>logTheValue()</code> llamado por <code>doSomething()</code>. Así que el perfil consistiría en tres seguimientos de pila, como este:</p>
+<pre>Sample A: doSomething()
+Sample B: doSomething() &gt; logTheValue()
+Sample C: doSomething() &gt; logTheValue()</pre>
+<p>Esto, obviamente, no hay suficientes datos para que nos digan nada, pero con mucho más muestras de que podría ser capaz de concluir que <code>logTheValue()</code> es el cuello de botella en nuestro código.</p>
+<h2 id="Creación_de_un_perfil">Creación de un perfil</h2>
+<p>Haga clic en el botón del cronómetro (<em>stopwatch</em><span style="font-size: 14px; line-height: 1.5;">) en el Profiler para iniciar muestras de grabación. Cuando Profiler está grabando, se resaltará el botón del cronómetro. Haga clic en él de nuevo para detener la grabación y guardar el nuevo perfil:</span></p>
+<p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/5977/Screen%20Shot%202013-08-26%20at%2010.35.47%20AM.png"></p>
+<p>Una vez que haya hecho clic en "Stop", el nuevo perfil se abrirá de forma automática:</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/5981/Screen%20Shot%202013-08-26%20at%2011.07.18%20AM.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+<p>Este panel está dividido en dos partes:</p>
+<ul>
+ <li>El lado izquierdo muestra todos los perfiles que ha capturado y le permite cargar cada uno. Justo por encima de esto hay dos botones: el botón del cronómetro (<em>stopwatch</em>) le permite grabar un nuevo perfil, mientras que el botón Importar (<em>Import</em>) ... permite importar los datos guardados anteriormente. Cuando se selecciona el perfil, puede guardar sus datos como un archivo JSON haciendo clic en el botón Guardar (Save). </li>
+ <li>El lado derecho muestra el perfil actualmente cargado.</li>
+</ul>
+<h2 id="Analyzing_a_profile">Analyzing a profile</h2>
+<p>The profile is split into two parts:</p>
+<ul>
+ <li>the <a href="#profile-timeline" title="#profile-timeline">profile timeline</a></li>
+ <li>the <a href="#profile-details" title="#profile-details">profile details</a></li>
+</ul>
+<h3 id="Profile_timeline"><a name="profile-timeline">Profile timeline</a></h3>
+<p>The profile timeline occupies the top part of the profile display:</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/5987/timeline" style="display: block; margin-left: auto; margin-right: auto;">The horizontal axis is time, and the vertical axis is call stack size at that sample. Call stack represents the amount of active functions at the time when the sample was taken.</p>
+<p>Red samples along the chart indicate the browser was unresponsive during that time, and a user would notice pauses in animations and responsiveness. If a profile has red samples, consider breaking this code up into several events, and look into using <a href="/en-US/docs/Web/API/window.requestAnimationFrame" title="/en-US/docs/Web/API/window.requestAnimationFrame">requestAnimationFrame</a> and <a href="/en-US/docs/Web/Guide/Performance/Using_web_workers" title="/en-US/docs/Web/Guide/Performance/Using_web_workers">Workers</a>.</p>
+<p>You can examine a specific range within the profile by clicking and dragging inside the timeline:</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/5989/Screen%20Shot%202013-08-26%20at%2011.17.59%20AM.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+<p>A new button then appears above the timeline labeled "Sample Range [AAA, BBB]". Clicking that button zooms the profile, and the details view underneath it, to that timeslice:</p>
+<p><br>
+ <img alt="" src="https://mdn.mozillademos.org/files/5991/Screen%20Shot%202013-08-26%20at%2011.18.03%20AM.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+<h3 id="Profile_details"><a name="profile-details">Profile details</a></h3>
+<p>The profile details occupy the bottom part of the profile display:</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/5993/profiler-details-highligted.png" style="display: block; margin-left: auto; margin-right: auto;">When you first open a new sample, the sample pane contains a single row labeled "(total)", as in the screenshot above. If you click the arrow next to "(total)", you'll see a list of all the top-level functions which appear in a sample.</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/5995/Screen%20Shot%202013-08-26%20at%2011.22.10%20AM.png"></p>
+<p><strong>Running time</strong> shows the total number of samples in which this function appeared<a href="#footnote-1"><sup>1</sup></a>, followed by the percentage of all samples in the profile in which this function appeared. The first row above shows that there were 2021 samples in the entire profile, and the second row shows that 1914, or 94.7%, of them were inside the <code>detectImage()</code> function.</p>
+<p><strong>Self</strong> shows the number of samples in which the sample was taken while executing this function itself, and not a function it was calling. In the <a href="#profiling-example" title="#profiling-example">simple example</a> above, <code>doSomething()</code> would have a <strong>Running time</strong> of 3 (samples A, B, and C), but a <strong>Self</strong> value of 1 (sample A).</p>
+<p>The third column gives the name of the function along with the filename and line number (for local functions) or basename and domain name (for remote functions). Functions in gray are built-in browser functions: functions in black represent JavaScript loaded by the page. If you hover the mouse over a row you'll see an arrow to the right of the function's identifier: click the arrow and you'll be taken to the function source.</p>
+<h3 id="Expanding_the_call_tree">Expanding the call tree</h3>
+<p>In a given row, if there are any samples taken while we were in a function called by this function (that is, if <strong>Running Time</strong> is greater than <strong>Self</strong> for a given row) then an arrow appears to the left of the function's name, enabling you to expand the call tree.</p>
+<p>In the <a href="#profiling-example" title="#profiling-example">simple example</a> above, the fully-expanded call tree would look like this:</p>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td style="text-align: center;"><strong>Running Time</strong></td>
+   <td style="text-align: center;"><strong>Self</strong></td>
+   <td style="text-align: center;"> </td>
+  </tr>
+  <tr>
+   <td style="text-align: center;">3            100%</td>
+   <td style="text-align: center;">1</td>
+   <td style="text-align: center;">doSomething()</td>
+  </tr>
+  <tr>
+   <td style="text-align: center;">2              67%</td>
+   <td style="text-align: center;">2</td>
+   <td style="text-align: center;">logTheValue()</td>
+  </tr>
+ </tbody>
+</table>
+<p>To take a more realistic example: in the screenshot below, looking at the second row we can see that 1914 samples were taken inside the <code>detectImage()</code> function. But all of them were taken in functions called by <code>detectImage()</code> (the <strong>Self</strong> cell is zero). We can expand the call tree to find out which functions were actually running when most of the samples were taken:</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/5999/bla.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+<p>This tells us that 6 samples were taken when we were actually executing <code>detectAtScale(), </code>12 when we were executing <code>getRect()</code> and so on.</p>
+<h2 id="Footnotes">Footnotes</h2>
+<ol>
+ <li><a name="footnote-1">If the function is called multiple times from different sources, it will be represented multiple times in the Profiler output. So generic functions like <code>forEach</code> will appear multiple times in the call tree.</a></li>
+</ol>
+<p> </p>
diff --git a/files/es/conflicting/web/api/canvas_api/tutorial/index.html b/files/es/conflicting/web/api/canvas_api/tutorial/index.html
new file mode 100644
index 0000000000..31bdbfc942
--- /dev/null
+++ b/files/es/conflicting/web/api/canvas_api/tutorial/index.html
@@ -0,0 +1,163 @@
+---
+title: Dibujando gráficos con canvas
+slug: conflicting/Web/API/Canvas_API/Tutorial
+translation_of: Web/API/Canvas_API/Tutorial
+translation_of_original: Web/API/Canvas_API/Drawing_graphics_with_canvas
+original_slug: Web/HTML/Canvas/Drawing_graphics_with_canvas
+---
+<div class="note">
+ <p>Most of this content (but not the documentation on drawWindow) has been rolled into the more expansive <a href="/en-US/docs/HTML/Canvas/Tutorial" title="HTML/Canvas/tutorial">Canvas tutorial</a>, this page should probably be redirected there as it's now redundant but some information may still be relevant.</p>
+</div>
+<h2 id="Introduction" name="Introduction">Introduction</h2>
+<p>Firefox 1.5, incluye un nuevo elemento HTML para gráficos programables.   &lt;canvas&gt; está basado en la especificación de canvas WHATWG, la que a su vez está basada en el &lt;canvas&gt; de Apple, implementado en Safari.   Puede ser usado para la renderización de gráficos, elementos de Interfaz de usuarios, y otros gráficos personalizados en el cliente.</p>
+<p>La etiqueta &lt;canvas&gt; crea una superficie de dibujo de tamaño fijo que expone uno o más contextos de renderizado.   Nos enfocaremos en la representación del contexto 2D   Para gráficos 3D, podrías usar la <a href="/es-ES/docs/WebGL">representación del contexto WebGL</a></p>
+<h2 id="The_2D_Rendering_Context" name="The_2D_Rendering_Context">El contexto de representación 2D</h2>
+<h3 id="A_Simple_Example" name="A_Simple_Example">Un ejemplo sencillo</h3>
+<p>Para comenzar, aquí un sencillo ejemplo que dibuja dos rectángulos interesándose, uno de los cuales tiene transparencia alfa.</p>
+<pre class="brush: js">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  ctx.fillStyle = "rgb(200,0,0)";
+  ctx.fillRect (10, 10, 55, 50);
+
+  ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
+  ctx.fillRect (30, 30, 55, 50);
+}
+</pre>
+<div class="hidden">
+ <pre class="brush: html">&lt;canvas id="canvas" width="120" height="120"&gt;&lt;/canvas&gt;</pre>
+ <pre class="brush: js">draw();</pre>
+</div>
+<p>{{EmbedLiveSample('A_Simple_Example','150','150','/@api/deki/files/602/=Canvas_ex1.png')}}</p>
+<p>La funcion draw obtiene el elemento canvas, entonces obtiene el contexto 2D.   El objeto ctx puede entonces actualmente ser renderizado para el canvas   El ejemplo simplemente llena dos rectangulos, configurando fillStyle a dos diferentes colores utilizando las especificaciones de color de CSS y llamando a fillRect   El segundo FillStyle usa rgba() para especificar un valor alpha junto con el color.</p>
+<p>El fillRect, strokeRect, y clearRect llama a render a ser llenado, bosquejado o limpiar rectangulo.   Para representar formas más complejas, se usan trayectorias.  </p>
+<h3 id="Using_Paths" name="Using_Paths">Usando trayectorias</h3>
+<p>La funcion Path inicia un nuevo trazo, y move to, line to, arc to, arc, y metodos similares son usados para agregar segmentos al trazo.   La trayectoria puede ser cerrada usando closePath   Una vez la trayectoria es creada, puedes usar fill o stroke para representar la trayectoria en el canvas.</p>
+<pre class="brush: js">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  ctx.fillStyle = "red";
+
+  ctx.beginPath();
+  ctx.moveTo(30, 30);
+  ctx.lineTo(150, 150);
+  // was: ctx.quadraticCurveTo(60, 70, 70, 150); which is wrong.
+  ctx.bezierCurveTo(60, 70, 60, 70, 70, 150); // &lt;- this is right formula for the image on the right -&gt;
+  ctx.lineTo(30, 30);
+  ctx.fill();
+}
+</pre>
+<div class="hidden">
+ <pre class="brush: html">&lt;canvas id="canvas" width="160" height="160"&gt;&lt;/canvas&gt;</pre>
+ <pre class="brush: js">draw();</pre>
+</div>
+<p>{{EmbedLiveSample('Using_Paths','190','190','/@api/deki/files/603/=Canvas_ex2.png')}}</p>
+<p>Llamando fill() o stroke() causa que el trazo sea usado.   Para ser llenado o juntado otra vez, el trazo debe ser recreado.</p>
+<h3 id="Graphics_State" name="Graphics_State">Estado de gráficos</h3>
+<p>Los atributos del contexto como fillStyle, strokeStyle, lineWidth, y lineJoin son parte de actual estado de graficos   El contexto provee dos metodos, save() y restore(), que pueden ser usados para mover el actual estado y desde estado stack.</p>
+<h3 id="A_More_Complicated_Example" name="A_More_Complicated_Example">Un ejemplo más complicado</h3>
+<p>Hay aquì un ejemplo más complicado, que usa rutas,estado y tambien introduce la actual matriz de transformación.   Los metodos de contexto translate(), scale(), y rotate() todos transforman la matriz actual.   Todos los puntos renderizados son primero transformados por esta matriz.</p>
+<pre class="brush: js">function drawBowtie(ctx, fillStyle) {
+
+  ctx.fillStyle = "rgba(200,200,200,0.3)";
+  ctx.fillRect(-30, -30, 60, 60);
+
+  ctx.fillStyle = fillStyle;
+  ctx.globalAlpha = 1.0;
+  ctx.beginPath();
+  ctx.moveTo(25, 25);
+  ctx.lineTo(-25, -25);
+  ctx.lineTo(25, -25);
+  ctx.lineTo(-25, 25);
+  ctx.closePath();
+  ctx.fill();
+}
+
+function dot(ctx) {
+  ctx.save();
+  ctx.fillStyle = "yellow";
+  ctx.fillRect(-2, -2, 4, 4);
+  ctx.restore();
+}
+
+function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // note that all other translates are relative to this one
+  ctx.translate(45, 45);
+
+  ctx.save();
+  //ctx.translate(0, 0); // unnecessary
+  drawBowtie(ctx, "red");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(85, 0);
+  ctx.rotate(45 * Math.PI / 180);
+  drawBowtie(ctx, "green");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(0, 85);
+  ctx.rotate(135 * Math.PI / 180);
+  drawBowtie(ctx, "blue");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(85, 85);
+  ctx.rotate(90 * Math.PI / 180);
+  drawBowtie(ctx, "yellow");
+  dot(ctx);
+  ctx.restore();
+}
+</pre>
+<div class="hidden">
+ <pre class="brush: html">&lt;canvas id="canvas" width="185" height="185"&gt;&lt;/canvas&gt;</pre>
+ <pre class="brush: js">draw();</pre>
+</div>
+<p>{{EmbedLiveSample('A_More_Complicated_Example','215','215','/@api/deki/files/604/=Canvas_ex3.png')}}</p>
+<p>Esto define dos métodos, lazo y punto, que son llamados 4 veces.   Antes de cada llamada, los metodos translate() y rotate() son utilizados para la matriz de transformación actual, que a su vez posicionara el punto y el lazo.   el punto presenta un pequeño cuadrado negro centrado a (0,0).   Ese punto se mueve alrededor de la matriz de transformación.   El lazo presenta un simple ruta de lazo usando el estillo de llenado pasado.</p>
+<p>Como las operaciones de la matriz son acumulativas, save() y restore() son utilizados para cada conjunto de llamadas para restaurar el estado de canvas original.   Una cosa a tener en cuenta es que la rotación siempre se produce en torno al origen actual, por lo que a traducir () rotate () translate () secuencia producirá resultados diferentes a traducir () translate () serie de llamadas rotate ().</p>
+<h2 id="Compatibility_With_Apple_.3Ccanvas.3E" name="Compatibility_With_Apple_.3Ccanvas.3E">Compatibilidad con Apple &lt;canvas&gt;</h2>
+<p>En su mayor parte, &lt;canvas&gt; es compatible con Apple y otras implementaciones.   Hay, sin embargo, algunas cuestiones a tener en cuenta, que se describen aquí.</p>
+<h3 id="Required_.3C.2Fcanvas.3E_tag" name="Required_.3C.2Fcanvas.3E_tag">Etiqueta &lt;/canvas&gt; requerida </h3>
+<p>En la aplicación de Apple Safari, &lt;canvas&gt; es un elemento ejecutado de la misma manera &lt;img&gt; es, sino que no tiene una etiqueta de cierre.   Sin embargo, para &lt;canvas&gt; tener uso generalizado en la web, se debe proporcionar alguna facilidad para contenido de reserva.   Por lo tanto, la implementación de Mozilla tiene una etiqueta de cierre requerida.</p>
+<p>Si no se necesita contenido de reserva, un simple &lt;canvas id="foo" ...&gt; &lt;/ canvas&gt; será totalmente compatible con Safari y Mozilla - Safari simplemente ignorar la etiqueta de cierre.</p>
+<p>Si se desea contenido de reserva, algunos trucos CSS se deben emplear para enmascarar el contenido de reserva desde Safari (las cuales deben emitir sólo la tela), y también para enmascarar los propios trucos CSS de IE (que debería hacer que el contenido de reserva).</p>
+<pre>canvas {
+  font-size: 0.00001px !ie;
+}</pre>
+<h2 id="Additional_Features" name="Additional_Features">Caracteristicas adicionales  </h2>
+<h3 id="Rendering_Web_Content_Into_A_Canvas" name="Rendering_Web_Content_Into_A_Canvas">Renderizando el contenido we dentro de un Canvas.</h3>
+<div class="note">
+ Esta caracteristica esta solo disponible para codigo ejecutado con privilegios de Chrome.   No esta permitido en paginas HTML normales. <a href="http://mxr.mozilla.org/mozilla/source/content/canvas/src/nsCanvasRenderingContext2D.cpp#2352" title="http://mxr.mozilla.org/mozilla/source/content/canvas/src/nsCanvasRenderingContext2D.cpp#2352">Porqué leer</a>.</div>
+<p>El canvas de Mozilla se extendio con el metodo drawWindow().   Este metodo dibuja una instantanea de los contenidos de una ventana DOM dentro del canvas. Por ejemplo:</p>
+<pre class="brush: js">ctx.drawWindow(window, 0, 0, 100, 200, "rgb(255,255,255)");
+</pre>
+<p>atraería el contenido de la ventana actual, en el rectángulo (0,0,100,200) en píxeles con respecto a la parte superior izquierda de la ventana, sobre un fondo blanco, en el lienzo.   Mediante la especificación de "rgba (255,255,255,0)" como el color, el contenido no se dibujan con un fondo transparente (lo que sería más lenta).</p>
+<p>Normalmente es una mala idea usar un fondo distinto de blanco "rgb(255, 255, 255)" o transparente, esto es lo que hacen todos los navegadores, y muchos sitios web esperan que esas partes transparentes de su interfaz serán puestas en fondo blanco.</p>
+<p>Con este metodo, es posible ocupar un IFRAME oculto con contenido arbitrario (por ejemplo, texto HTML con estilo CSS, o SVG) y dibujarlo dentro de un canvas.   sera escalado, rotado y sucesivamente de acuerdo a la transformación actual.</p>
+<p>Extensión de previsualización pestaña de Ted Mielczarek utiliza esta técnica en cromo para proporcionar imágenes en miniatura de las páginas web, y la fuente está disponible para su referencia.  </p>
+<div class="note">
+ Nota: usar canvas.drawWindow() mientras manejamos un evento de carga de documento, no trabaja   En Firefox 3.5 o superior, puedes hacer esto en un manejador para el evento MozAfterPaint para dibujr satisfactoriamente un contenido HTML dentro de un canvas al cargar la pagina  </div>
+<h2 id="See_also" name="See_also">See also</h2>
+<ul>
+ <li><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas">Canvas topic page</a></li>
+ <li><a href="/en-US/docs/Canvas_tutorial" title="Canvas_tutorial">Canvas tutorial</a></li>
+ <li><a href="http://www.whatwg.org/specs/web-apps/current-work/#the-canvas">WHATWG specification</a></li>
+ <li><a href="http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/Canvas.html" title="http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/Canvas.html">Apple Canvas Documentation</a></li>
+ <li><a href="http://weblogs.mozillazine.org/roc/archives/2005/05/rendering_web_p.html">Rendering Web Page Thumbnails</a></li>
+ <li>Some <a href="/en-US/docs/tag/canvas_examples">examples</a>:
+  <ul>
+   <li><a href="http://azarask.in/projects/algorithm-ink">Algorithm Ink</a></li>
+   <li><a href="http://www.tapper-ware.net/canvas3d/">OBJ format 3D Renderer</a></li>
+   <li><a href="/en-US/docs/A_Basic_RayCaster" title="A_Basic_RayCaster">A Basic RayCaster</a></li>
+   <li><a href="http://awordlike.textdriven.com/">The Lightweight Visual Thesaurus</a></li>
+   <li><a href="http://caimansys.com/painter/">Canvas Painter</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/tag/canvas">And more...</a></li>
+</ul>
diff --git a/files/es/conflicting/web/api/crypto/getrandomvalues/index.html b/files/es/conflicting/web/api/crypto/getrandomvalues/index.html
new file mode 100644
index 0000000000..7764d268c4
--- /dev/null
+++ b/files/es/conflicting/web/api/crypto/getrandomvalues/index.html
@@ -0,0 +1,112 @@
+---
+title: RandomSource
+slug: conflicting/Web/API/Crypto/getRandomValues
+tags:
+  - API
+  - Interface
+  - NeedsTranslation
+  - RandomSource
+  - Reference
+  - TopicStub
+  - Web Crypto API
+translation_of: Web/API/Crypto/getRandomValues
+translation_of_original: Web/API/RandomSource
+original_slug: Web/API/RandomSource
+---
+<p>{{APIRef("Web Crypto API")}}</p>
+
+<p><strong><code>RandomSource</code></strong> represents a source of cryptographically secure random numbers. It is available via the {{domxref("Crypto")}} object of the global object: {{domxref("Window.crypto")}} on Web pages, {{domxref("WorkerGlobalScope.crypto")}} in workers.</p>
+
+<p><code>RandomSource</code> is a not an interface and no object of this type can be created.</p>
+
+<h2 id="Properties">Properties</h2>
+
+<p><em><code>RandomSource</code> neither defines nor inherits any property.</em></p>
+
+<dl>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<dl>
+ <dt>{{ domxref("RandomSource.getRandomValues()") }}</dt>
+ <dd>Fills the passed {{ domxref("ArrayBufferView") }} with cryptographically sound random values.</dd>
+</dl>
+
+<h2 id="Specification" name="Specification">Specification</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Crypto API', '#dfn-RandomSource')}}</td>
+   <td>{{Spec2('Web Crypto API')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Compatibility">Browser Compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>11.0 {{ webkitbug("22049") }}</td>
+   <td>{{CompatGeckoDesktop(21)}} [1]</td>
+   <td>11.0</td>
+   <td>15.0</td>
+   <td>3.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatNo() }}</td>
+   <td>23</td>
+   <td>{{CompatGeckoMobile(21)}}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>6</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Although the transparent <code>RandomSource</code> is only available since Firefox 26, the feature was available in Firefox 21.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{ domxref("Window.crypto") }} to get a {{domxref("Crypto")}} object.</li>
+ <li>{{jsxref("Math.random")}}, a non-cryptographic source of random numbers.</li>
+</ul>
diff --git a/files/es/conflicting/web/api/document_object_model/index.html b/files/es/conflicting/web/api/document_object_model/index.html
new file mode 100644
index 0000000000..f318f65508
--- /dev/null
+++ b/files/es/conflicting/web/api/document_object_model/index.html
@@ -0,0 +1,25 @@
+---
+title: Acerca del Modelo de Objetos del Documento
+slug: conflicting/Web/API/Document_Object_Model
+tags:
+  - DOM
+  - Todas_las_Categorías
+translation_of: Web/API/Document_Object_Model
+translation_of_original: DOM/About_the_Document_Object_Model
+original_slug: Acerca_del_Modelo_de_Objetos_del_Documento
+---
+<h3 id=".C2.BFQu.C3.A9_es_DOM.3F" name=".C2.BFQu.C3.A9_es_DOM.3F">¿Qué es DOM?</h3>
+
+<p>El <strong>Modelo de Objetos del Documento</strong> (DOM) es un <a class="external" href="http://es.wikipedia.org/wiki/API">API</a> para documentos <a href="/es/HTML" title="es/HTML">HTML</a> y <a href="/es/XML" title="es/XML">XML</a>. Proporciona una representación estructural del documento, permitiendo la modificación de su contenido y visualización. Esencialmente, comunica las páginas web con los scripts o los lenguajes de programación.</p>
+
+<p>Todas las propiedades, métodos, y eventos disponibles por el desarrollador web para manipular y crear páginas web están organizados en objetos (por ejemplo: el objeto 'document' representa al documento en sí mismo, el objeto 'table' representa los elementos HTML para tablas, etcétera). En los navegadores modernos estos objetos son manejables con lenguajes de scripts.</p>
+
+<p>Es muy común usar DOM conjuntamente con <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a>. Así es, el código es escrito en JavaScript, pero éste usa DOM para tener acceso a la página Web y sus elementos. Sin embargo, DOM fue diseñado para ser independiente de cualquier lenguaje de programación concreto, poniendo la representación estructural del documento disponible en un solo API consistente. Aunque en este sitio nos centremos en JavaScript, las implementaciones de DOM pueden hacerse para <a class="external" href="http://www.w3.org/DOM/Bindings">cualquier lenguaje</a>.</p>
+
+<p>El <a class="external" href="http://www.w3c.es/">Consorcio de World Wide Web</a> establece un <a class="external" href="http://www.w3.org/DOM/">estándar para el DOM</a>, llamado W3C DOM. Actualmente los navegadores más importantes lo soportan correctamente, ésto permite crear poderosas aplicaciones multi-navegador.</p>
+
+<h3 id=".C2.BFPor_qu.C3.A9_es_importante_el_soporte_que_Mozilla_da_al_DOM.3F" name=".C2.BFPor_qu.C3.A9_es_importante_el_soporte_que_Mozilla_da_al_DOM.3F">¿Por qué es importante el soporte que Mozilla da al DOM?</h3>
+
+<p><em>HTML dinámico</em> (<a href="/es/DHTML" title="es/DHTML">DHTML</a>) es un término usado por muchos para describir la combinación de HTML, hojas de estilo y scripts que permite que los documentos sean dinámicos. El grupo de trabajo W3C DOM trabaja duro para asegurarse de que sus soluciones son interoperables e independientes del lenguaje (ver también la <a class="external" href="http://www.w3.org/DOM/faq.html">DOM FAQ</a>). Cuando Mozilla reclama el título de "Plataforma para aplicaciones web", el soporte a DOM es uno de los rasgos más solicitados, y es necesario si Mozilla quiere ser una alternativa real a otros navegadores.</p>
+
+<p>El hecho incluso más importante es que la interfaz de usuario de Firefox (también la de Mozilla Suite y Thunderbird) está construida usando XUL - un lenguaje XML para interfaces de usuario. Así Mozilla usa el DOM para manipular sus propias interfaces de usuario. <small>(<a href="/en/Dynamically_modifying_XUL-based_user_interface">en inglés</a>)</small></p>
diff --git a/files/es/conflicting/web/api/document_object_model_656f0e51418b39c498011268be9b3a10/index.html b/files/es/conflicting/web/api/document_object_model_656f0e51418b39c498011268be9b3a10/index.html
new file mode 100644
index 0000000000..9e3c7c7c46
--- /dev/null
+++ b/files/es/conflicting/web/api/document_object_model_656f0e51418b39c498011268be9b3a10/index.html
@@ -0,0 +1,23 @@
+---
+title: DOM developer guide
+slug: conflicting/Web/API/Document_Object_Model_656f0e51418b39c498011268be9b3a10
+tags:
+  - API
+  - DOM
+  - Guide
+  - NeedsTranslation
+  - TopicStub
+translation_of: Web/API/Document_Object_Model
+translation_of_original: Web/Guide/API/DOM
+original_slug: Web/Guide/DOM
+---
+<p>{{draft}}</p>
+<p>The <a href="/docs/DOM">Document Object Model</a> is an API for <a href="/en-US/docs/HTML">HTML</a> and <a href="/en-US/docs/XML">XML</a> documents. It provides a structural representation of the document, enabling the developer to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages.</p>
+<p>All of the properties, methods, and events available to the web developer for manipulating and creating web pages are organized into <a href="/en-US/docs/Gecko_DOM_Reference">objects</a> (e.g., the document object that represents the document itself, the table object that represents a HTML table element, and so forth). Those objects are accessible via scripting languages in most recent web browsers.</p>
+<p>The DOM is most often used in conjunction with <a href="/en-US/docs/JavaScript">JavaScript</a>. However, the DOM was designed to be independent of any particular programming language, making the structural representation of the document available from a single, consistent API. Though we focus on JavaScript throughout this site, implementations of the DOM can be built for <a href="http://www.w3.org/DOM/Bindings">any language</a>.</p>
+<p>The <a href="http://www.w3.org/">World Wide Web Consortium</a> establishes a <a href="http://www.w3.org/DOM/">standard for the DOM</a>, called the W3C DOM. It should, now that the most important browsers correctly implement it, enable powerful cross-browser applications.</p>
+<h2 id="Why_is_the_DOM_support_in_Mozilla_important.3F" name="Why_is_the_DOM_support_in_Mozilla_important.3F">Why is the DOM important?</h2>
+<p>"Dynamic HTML" (<a href="/en-US/docs/DHTML">DHTML</a>) is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated. The W3C DOM Working Group is working hard to make sure interoperable and language-neutral solutions are agreed upon (see also the <a href="http://www.w3.org/DOM/faq.html">W3C FAQ</a>). As Mozilla claims the title of "Web Application Platform", support for the DOM is one of the most requested features, and a necessary one if Mozilla wants to be a viable alternative to the other browsers.</p>
+<p>Even more important is the fact that the user interface of Mozilla (also Firefox and Thunderbird) is built using <a href="/en-US/docs/XUL" title="/en-US/docs/XUL">XUL</a>, using the DOM to <a href="/en-US/docs/Dynamically_modifying_XUL-based_user_interface">manipulate its own UI</a>.</p>
+<h2 id="More_about_the_DOM">More about the DOM</h2>
+<p>{{LandingPageListSubpages}}</p>
diff --git a/files/es/conflicting/web/api/document_object_model_7d961b8030c6099ee907f4f4b5fe6b3d/index.html b/files/es/conflicting/web/api/document_object_model_7d961b8030c6099ee907f4f4b5fe6b3d/index.html
new file mode 100644
index 0000000000..ae8c384e87
--- /dev/null
+++ b/files/es/conflicting/web/api/document_object_model_7d961b8030c6099ee907f4f4b5fe6b3d/index.html
@@ -0,0 +1,88 @@
+---
+title: DOM
+slug: conflicting/Web/API/Document_Object_Model_7d961b8030c6099ee907f4f4b5fe6b3d
+tags:
+  - DOM
+  - Todas_las_Categorías
+translation_of: Web/API/Document_Object_Model
+translation_of_original: DOM
+original_slug: DOM
+---
+<div class="callout-box">
+  <strong><a href="/es/Acerca_del_Modelo_de_Objetos_del_Documento" title="es/Acerca_del_Modelo_de_Objetos_del_Documento">Acerca del Modelo de Objetos del Documento</a></strong><br>
+  Un par de cosas básicas sobre DOM y Mozilla.</div>
+<div>
+  <p>El <strong>Modelo de Objetos del Documento (DOM)</strong> es un API para documentos <a href="/es/HTML" title="es/HTML">HTML</a> y <a href="/es/XML" title="es/XML">XML</a>. Proporciona una representación estructural del documento, permitiendo la modificación de su contenido o su presentación visual. Esencialmente, comunica las páginas web con los scripts o los lenguajes de programación.</p>
+</div>
+<p><strong>DOM</strong> es un estándar del <a class="external" href="http://www.w3.org/DOM/">W3C</a></p>
+<table class="topicpage-table">
+  <tbody>
+    <tr>
+      <td>
+        <h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"><a href="/Special:Tags?tag=DOM&amp;language=es" title="Special:Tags?tag=DOM&amp;language=es">Documentación</a></h4>
+        <dl>
+          <dt>
+            <a class="external" href="http://www.maestrosdelweb.com/editorial/dom/">Introducción a la manipulación DOM</a></dt>
+          <dd>
+            <small>Introducción a los métodos de manipulación DOM mediante Javascript</small></dd>
+        </dl>
+        <dl>
+          <dt>
+            <a class="external" href="http://html.conclase.net/w3c/dom1-es/cover.html">Especificación del DOM Nivel 1</a></dt>
+          <dd>
+            <small>El objetivo de la especificación DOM es definir una interfaz programable para HTML y XML.</small></dd>
+        </dl>
+        <dl>
+          <dt>
+            <a href="/es/Uso_del_núcleo_del_nivel_1_del_DOM" title="es/Uso_del_núcleo_del_nivel_1_del_DOM">Uso del núcleo del nivel 1 del DOM</a></dt>
+          <dd>
+            <small>Es un potente modelo de objetos para modificar el árbol de contenidos de los documentos.</small></dd>
+        </dl>
+        <dl>
+          <dt>
+            <a href="/es/Los_niveles_del_DOM" title="es/Los_niveles_del_DOM">Los niveles del DOM</a></dt>
+          <dd>
+            <small>Una descripción de los niveles del DOM y el soporte ofrecido por Mozilla a cada uno de ellos.</small></dd>
+        </dl>
+        <dl>
+          <dt>
+            <a href="/es/DHTML_Demostraciones_del_uso_de_DOM//Style" title="es/DHTML_Demostraciones_del_uso_de_DOM//Style">DHTML Demostraciones del uso de DOM/Style</a></dt>
+          <dd>
+            <small>Contiene una lista de ejemplos DOM basados en sus diversas características. La lista incluye demostraciones para Eventos DOM, DOM Core, DOM HTML y mucho mas.</small></dd>
+        </dl>
+        <dl>
+          <dt>
+            <a class="external" href="http://www.mozilla.org/docs/dom/">The Document Object Model in Mozilla.org <small>(en)</small></a></dt>
+          <dd>
+            <small>Una versión más antigua acerca de DOM se encuentra en mozilla.org.</small></dd>
+        </dl>
+        <p><span class="comment">enlaces a ninguna parte: ; <a href="/es/DOM_y_JavaScript">DOM y JavaScript</a>: &lt;small&gt;"¿Qué está haciendo que? ¿En un script embebido en mi página web, el cual usa DOM y Javascript?"&lt;/small&gt;  ; <a href="/es/Modificando_dinámicamente_las_interfaces_de_usuario_en_XUL">Modificando dinámicamente las interfaces de usuario en XUL</a>: &lt;small&gt;Fundamentos de manipulación con XUL UI y métodos DOM.&lt;/small&gt;  ; <a href="/es/Espacios_en_blanco_en_el_DOM">Espacios en blanco en el DOM</a>: &lt;small&gt;Una solución al problema de ignorar los espacios en blanco cuando se interactúa con el DOM.&lt;/small&gt;  ; <a href="/es/Tablas_HTML_con_JavaScript_e_interfaces_DOM">Tablas HTML con JavaScript e interfaces DOM</a>: &lt;small&gt;Una descripción de algunos métodos de gran alcance, fundamentales para el nivel 1 en el uso de DOM y de cómo utilizarlo con Javascript .&lt;/small&gt; fin de enlaces a ninguna parte</span> <span class="alllinks"><a href="/Special:Tags?tag=DOM&amp;language=es" title="Special:Tags?tag=DOM&amp;language=es">Ver todos</a></span></p>
+      </td>
+      <td>
+        <h4 id="Comunidad" name="Comunidad">Comunidad</h4>
+        <ul>
+          <li>En la comunidad Mozilla... en inglés</li>
+        </ul>
+        <p>{{ DiscussionList("dev-tech-dom", "mozilla.dev.tech.dom") }}</p>
+        <p><span class="alllinks"><a href="/es/DOM/Comunidad" title="es/DOM/Comunidad">Ver todos</a></span></p>
+        <h4 id="Herramientas" name="Herramientas">Herramientas</h4>
+        <ul>
+          <li><a href="/es/DOM_Inspector" title="es/DOM_Inspector">DOM Inspector</a></li>
+          <li><a class="external" href="http://slayeroffice.com/tools/modi/v2.0/modi_help.html">Mouse-over DOM Inspector</a></li>
+          <li><a class="external" href="http://www.karmatics.com/aardvark/">Aardvark, extension para Firefox</a></li>
+        </ul>
+        <p><span class="alllinks"><a href="/Special:Tags?tag=DOM:Herramientas&amp;language=es" title="Special:Tags?tag=DOM:Herramientas&amp;language=es">Ver todos</a></span></p>
+        <h4 id="Temas_relacionados" name="Temas_relacionados">Temas relacionados</h4>
+        <dl>
+          <dd>
+            • <a href="/es/AJAX" title="es/AJAX">AJAX</a> • <a href="/es/CSS" title="es/CSS">CSS</a> • <a href="/es/XML" title="es/XML">XML</a> • <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a> •</dd>
+        </dl>
+        <p> </p>
+      </td>
+    </tr>
+  </tbody>
+</table>
+<p><span class="comment">fin de tabla</span></p>
+<p><span class="comment">Categorías</span></p>
+<p><span class="comment">Interwiki Language Links</span></p>
+<p>{{ languages( { "de": "de/DOM", "en": "en/DOM", "fr": "fr/DOM", "hu": "hu/DOM", "ja": "ja/DOM", "ko": "ko/DOM", "nl": "nl/DOM", "pl": "pl/DOM", "pt": "pt/DOM", "ru": "ru/DOM", "zh-cn": "cn/DOM", "zh-tw": "zh_tw/DOM" } ) }} </p>
diff --git a/files/es/conflicting/web/api/document_object_model_9f3a59543838705de7e9b080fde3cc14/index.html b/files/es/conflicting/web/api/document_object_model_9f3a59543838705de7e9b080fde3cc14/index.html
new file mode 100644
index 0000000000..bd1c67c343
--- /dev/null
+++ b/files/es/conflicting/web/api/document_object_model_9f3a59543838705de7e9b080fde3cc14/index.html
@@ -0,0 +1,77 @@
+---
+title: Prefacio
+slug: conflicting/Web/API/Document_Object_Model_9f3a59543838705de7e9b080fde3cc14
+tags:
+  - DOM
+  - Todas_las_Categorías
+translation_of: Web/API/Document_Object_Model
+translation_of_original: Web/API/Document_Object_Model/Preface
+original_slug: Referencia_DOM_de_Gecko/Prefacio
+---
+<p>« <a href="es/Referencia_DOM_de_Gecko">Referencia DOM de Gecko</a></p>
+
+<h3 id="Sobre_Esta_referencia" name="Sobre_Esta_referencia">Sobre Esta referencia</h3>
+
+<p>Esta parte describe el manual en sí: para quién está hecho, cómo se presenta la información y cómo se pueden usar los ejemplos de la referencia en el desarrollo propio de DOM.</p>
+
+<p>Notará que este documento está en curso de desarrollo y aún no es un listado completo de todos los métodos y propiedades DOM que funcionan para GECKO. Sin embargo, cada parte individual de esta guía (por ejemplo, <a href="es/DOM/document">La referencia al documento de DOM</a>) sí está completa para el/los objeto/s que describe. Cuando nuevas informaciones de referencia para los numerosos miembros de esta enorme API estén disponibles, se irán integrando dentro de este documento.</p>
+
+<h3 id="A_qui.C3.A9n_va_dirigida_esta_gu.C3.ADa.3F" name="A_qui.C3.A9n_va_dirigida_esta_gu.C3.ADa.3F">A quién va dirigida esta guía?</h3>
+
+<p>El lector de <a href="es/Referencia_DOM_de_Gecko">Referencia DOM de Gecko</a> puede ser un desarrollador Web o un usuario sabio que tiene alguna idea de como se construyen las páginas Web. Esta referencia evita tener presunciones sobre el nivel de conocimiento del lector con el DOM, el <a href="es/XML">XML</a>, los servidores o estándares Web y también con <a href="es/JavaScript">JavaScript</a>, el lenguaje en el cual el DOM se hace accesible al lector. Al contrario, sí, supone de la familiaridad con <a href="es/HTML">HTML</a>, el marcado, la estructura básica de las páginas Web, los navegadores y con las hojas de estilo.</p>
+
+<p>El material introductorio presentado aquí, con sus varios ejemplos y sus explicaciones de alto nivel, debe ser valorado tanto para los desarrolladores inexpertos como para los experimentados, no es sólo una guía de desarrollo Web para <em>principiantes</em>. En general y sin embargo se le puede considerar como un manual evolutivo del API.</p>
+
+<h3 id="Qu.C3.A9_es_Gecko.3F" name="Qu.C3.A9_es_Gecko.3F">Qué es Gecko?</h3>
+
+<p>Mozilla, Firefox, Netscape 6+, y otros navegadores basados en Mozilla tienen la idéntica codificación DOM. Es así porque utilizan la misma tecnología. <span class="comment">naturalmente, es sólo aplicable a los productos basados en la misma versión de Gecko, pero es complicado explicarlo - (naturally, it applies only to products based on the same version of Gecko, but it's tricky to explain)</span></p>
+
+<p>Gecko, la parte del programa en estos navegadores que se ocupa del análisis del HTML, de la disposición de las páginas, del modelo de objeto del documento, e incluso de la representación de la interfaz de aplicación entera, es una rápida, máquina cumplidora de los estándares de presentación que ejecutar los estándares del modelo de objeto del navegador (por ejemplo, <a href="es/DOM/window">ventana - <code>window</code></a>) del W3C DOM y del parecido DOM (pero no estándar) en el contexto de las páginas Web y la interfaz de aplicación (o<em>chrome</em>) del navegador.</p>
+
+<p>Aunque la interfaz de aplicación y el contenido exhibido por el navegador son diferentes en muchos puntos, el DOM los expone uniformemente como una jerarquía de nodos. <span class="comment">(commenting this incomplete sentence out for now...) The tree structure of the DOM (which in its application to the user</span></p>
+
+<h3 id="Sintaxis_del_API" name="Sintaxis_del_API">Sintaxis del API</h3>
+
+<p>Cada descripción en la referencia API incluye la sintaxis, los parámetros de entrada y salida (donde el tipo de retorno es agarrado), un ejemplo, todas las notas adicionales y un enlace a la especificación apropiada.</p>
+
+<p>Típicamente, las propiedades de sólo lectura tienen una simple línea de sintaxis, porque es posible leerlas pero imposible modificarlas. Por ejemplo, la propiedad de sólo lectura <code>availHeight</code> del objeto <code>screen</code> incluye la información siguiente:</p>
+
+<div></div>
+
+<p>Eso significa que sólo se puede utilizar la propiedad a la derecha de la declaración. En el caso de propiedades de lectura/escritura (posibilidad de modificación) se puede asignar un valor a la propiedad, como se ilustra en el siguiente ejemplo de sintaxis:</p>
+
+<div></div>
+
+<p>En general, el objeto cuyo miembro se está describiendo se pone en la declaración con un sólo tipo de dato:</p>
+
+<ul>
+ <li><code>element</code> para todos los elementos.</li>
+ <li><code>document</code> para el documento entero.</li>
+ <li><code>table</code> para una tabla, etc.</li>
+ <li>Para más información sobre la: <a href="es/Referencia_Gecko_del_DOM/Introducci%c3%b3n#Importancia_de_los_tipos_de_datos">Importancia de los tipos de datos</a>, lea este artículo.</li>
+</ul>
+
+<h3 id="Utilizaci.C3.B3n_de_ejemplos" name="Utilizaci.C3.B3n_de_ejemplos">Utilización de ejemplos</h3>
+
+<p>Varios ejemplos en esta referencia son archivos completos que se pueden ejecutar copiándolos y pegándolos dentro de un nuevo archivo y abriéndolo en un navegador. Otros son trozos de código que se pueden ejecutar poniéndolos en las funciones repeticón de llamada (<code>callback</code>) de JavaScript. Por ejemplo, la propiedad de <a href="es/DOM/window.document">window.document</a> se puede probar dentro de la siguiente función, la cual es llamada por el botón acompañante:</p>
+
+<pre>&lt;html&gt;
+
+&lt;script&gt;
+function testWinDoc() {
+
+  doc= window.document;
+
+  alert(doc.title);
+
+}
+&lt;/script&gt;
+
+&lt;button onclick="testWinDoc();"&gt;Prueba la propiedad del documento&lt;/button&gt;
+
+&lt;/html&gt;
+</pre>
+
+<p>Funciones y páginas similares pueden ser creadas para todos los miembros de objeto que no hayan sido ya preparados para su uso directo. Ver la parte <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Probando_el_API_del_DOM">Probando el API del DOM</a> en la introducción para una "prueba pesada" que permite probar varios API a la vez.</p>
+
+<p>{{ languages( { "en": "en/Gecko_DOM_Reference/Preface", "fr": "fr/R\u00e9f\u00e9rence_du_DOM_Gecko/Pr\u00e9face", "ja": "ja/Gecko_DOM_Reference/Preface", "ko": "ko/Gecko_DOM_Reference/Preface", "pl": "pl/Dokumentacja_Gecko_DOM/Przedmowa", "zh-cn": "cn/Gecko_DOM_\u53c2\u8003/Preface" } ) }}</p>
diff --git a/files/es/conflicting/web/api/geolocation/index.html b/files/es/conflicting/web/api/geolocation/index.html
new file mode 100644
index 0000000000..bd9d8f78d6
--- /dev/null
+++ b/files/es/conflicting/web/api/geolocation/index.html
@@ -0,0 +1,108 @@
+---
+title: NavigatorGeolocation
+slug: conflicting/Web/API/Geolocation
+tags:
+  - API
+translation_of: Web/API/Geolocation
+translation_of_original: Web/API/NavigatorGeolocation
+original_slug: Web/API/NavigatorGeolocation
+---
+<p>{{APIRef("Geolocation API")}}</p>
+
+<p><code><strong>NavigatorGeolocation</strong></code>  contains a creation method allowing objects implementing it to obtain a {{domxref("Geolocation")}} instance.</p>
+
+<p>There is no object of type <code>NavigatorGeolocation</code>, but some interfaces, like {{domxref("Navigator")}} implements it.</p>
+
+<h2 id="Properties">Properties</h2>
+
+<p><em>The <code>NavigatorGeolocation</code></em><em> interface doesn't inherit any property.</em></p>
+
+<dl>
+ <dt>{{domxref("NavigatorGeolocation.geolocation")}} {{readonlyInline}}</dt>
+ <dd>Returns a {{domxref("Geolocation")}} object allowing accessing the location of the device.</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<p><em>The </em><em><code>NavigatorGeolocation</code></em><em> interface neither implements, nor inherit any method.</em></p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Geolocation', '#navi-geo', 'NavigatorGeolocation')}}</td>
+   <td>{{Spec2('Geolocation')}}</td>
+   <td>Initial specification.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>5</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
+   <td>9</td>
+   <td>10.60<br>
+    Removed in 15.0<br>
+    Reintroduced in 16.0</td>
+   <td>5</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown()}}</td>
+   <td>{{CompatUnknown()}}</td>
+   <td>{{CompatGeckoMobile("4")}}</td>
+   <td>{{CompatUnknown()}}</td>
+   <td>10.60</td>
+   <td>{{CompatUnknown()}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/WebAPI/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Using geolocation.</a></li>
+</ul>
+
+<p> </p>
diff --git a/files/es/conflicting/web/api/html_drag_and_drop_api/index.html b/files/es/conflicting/web/api/html_drag_and_drop_api/index.html
new file mode 100644
index 0000000000..e8dd96166b
--- /dev/null
+++ b/files/es/conflicting/web/api/html_drag_and_drop_api/index.html
@@ -0,0 +1,12 @@
+---
+title: DragDrop
+slug: conflicting/Web/API/HTML_Drag_and_Drop_API
+tags:
+  - NeedsTranslation
+  - TopicStub
+translation_of: Web/API/HTML_Drag_and_Drop_API
+translation_of_original: DragDrop
+original_slug: DragDrop
+---
+<p> </p>
+<p>See <a href="https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop">https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop</a></p>
diff --git a/files/es/conflicting/web/api/index.html b/files/es/conflicting/web/api/index.html
new file mode 100644
index 0000000000..66f2f46da6
--- /dev/null
+++ b/files/es/conflicting/web/api/index.html
@@ -0,0 +1,81 @@
+---
+title: Element.name
+slug: conflicting/Web/API
+tags:
+  - API
+  - Compatibilidad de los navegadores
+  - DOM
+  - Elemento
+  - Propiedad
+  - Referencia
+  - Web
+  - actualizacion
+translation_of: Web/API
+translation_of_original: Web/API/Element/name
+original_slug: Web/API/Element/name
+---
+<p>{{ APIRef("DOM") }}</p>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p><code><strong>name</strong></code> <span id="result_box" lang="es"><span>obtiene o establece</span> <span>la</span> <span>propiedad del nombre</span> <span>de un</span> <span>objeto DOM</span><span>;</span> <span>sólo se aplica a</span> <span>los</span> <span>siguientes elementos</span><span>:</span></span> {{ HTMLelement("a") }}, {{ HTMLelement("applet") }}, {{ HTMLelement("button") }}, {{ HTMLelement("form") }}, {{ HTMLelement("frame") }}, {{ HTMLelement("iframe") }}, {{ HTMLelement("img") }}, {{ HTMLelement("input") }}, {{ HTMLelement("map") }}, {{ HTMLelement("meta") }}, {{ HTMLelement("object") }}, {{ HTMLelement("param") }}, {{ HTMLelement("select") }}, and {{ HTMLelement("textarea") }}.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> <code>La propiedad name no esixte para otros elementos</code>; a diferencia de <a href="/en/DOM/Element.tagName" title="en/DOM/element.tagName"><code>tagName</code></a> y <a href="/en/DOM/Node.nodeName" title="en/DOM/Node.nodeName"><code>nodeName</code></a>, no es una propiedad de los modos de comunicación (interfaces) {{domxref("Node")}}, {{domxref("Element")}} or {{domxref("HTMLElement")}}.</p>
+</div>
+
+<p><code>name</code> puede ser utilizado en el método{{ domxref("document.getElementsByName()") }} , en una <a href="/en/DOM/HTMLFormElement" title="en/DOM/form">configuración</a> y con la colección de <a href="/en/DOM/form.elements" title="en/DOM/form.elements">elementos</a> de la configuración. cuando utilizamos una configuración o  elementos de una colección, puede devolver un solo elemento o una colección.</p>
+
+<h2 id="Syntax" name="Syntax">Síntasix</h2>
+
+<pre class="eval"><em>HTMLElement</em>.name = <em>string</em>;
+var elName = <em>HTMLElement</em>.name;
+
+var fControl = <em>HTMLFormElement</em>.<em>elementName</em>;
+var controlCollection = <em>HTMLFormElement</em>.elements.<em>elementName</em>;
+</pre>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<pre class="eval">&lt;form action="" name="formA"&gt;
+  &lt;input type="text" value="foo"&gt;
+&lt;/form&gt;
+
+&lt;script type="text/javascript"&gt;
+
+  // Get a reference to the first element in the form
+  var formElement = document.forms['formA'].elements[0];
+
+  // Give it a name
+  formElement.name = 'inputA';
+
+  // Show the value of the input
+  alert(document.forms['formA'].elements['inputA'].value);
+
+&lt;/script&gt;
+</pre>
+
+<h2 id="Notes" name="Notes">Notas</h2>
+
+<p>En Internet Explorer (IE), la propiedad <code>name</code> de los objetos DOM , creada utilizando{{ domxref("document.createElement()") }} no puede ser establecida o modificada</p>
+
+<h2 id="Specification" name="Specification">Especificaciones</h2>
+
+<p>W3C DOM 2 HTML Specification:</p>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-32783304">Anchor</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-39843695">Applet</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-34812697">Button</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-22051454">Form</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-91128709">Frame</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-96819659">iFrame</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-47534097">Image</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-89658498">Input</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-52696514">Map</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-31037081">Meta</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-20110362">Object</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-59871447">Param</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-41636323">Select</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-70715578">Textarea</a></li>
+</ul>
diff --git a/files/es/conflicting/web/api/indexeddb_api/index.html b/files/es/conflicting/web/api/indexeddb_api/index.html
new file mode 100644
index 0000000000..cdcd58724c
--- /dev/null
+++ b/files/es/conflicting/web/api/indexeddb_api/index.html
@@ -0,0 +1,146 @@
+---
+title: IndexedDB
+slug: conflicting/Web/API/IndexedDB_API
+tags:
+  - páginas_a_traducir
+original_slug: IndexedDB
+---
+<p>{{ SeeCompatTable() }}</p>
+
+<p>IndexedDB es una API del lado del cliente, para el almacenamiento de grandes cantidades de datos estructurados y para búsquedas de alto rendimiento en esos datos, usando índices. Mientras <a href="/en-US/docs/DOM/Storage" title="en-US/docs/DOM/Storage">DOM Storage</a> es útil para el almacenamiento de pequeñas cantidades de datos, no es útil para almacenar grandes cantidades de datos estructurados. IndexedDB proporciona una solución.</p>
+
+<p>Esta página es básicamente el punto de entrada para la descripción técnica de los objetos de la API. Si necesita algo elemental, debería consultar ;<a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB" title="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB">Conceptos básicos acerca de IndexedDB</a>. Para más detalles, vea <a href="https://developer.mozilla.org/en-US/docs/IndexedDB/Using_IndexedDB" title="https://developer.mozilla.org/en-US/docs/IndexedDB/Using_IndexedDB">Usando IndexedDB</a>.</p>
+
+<p>IndexedDB provee APIs separados para un acceso síncrono o asíncrono. El API síncrono está destinado a ser usado únicamente dentro de <a href="/en-US/docs/DOM/Worker" title="Worker">Web Workers</a>, pero no será implementado aún por cualquier navegador. El API asíncrono trabaja con o sin Web Workers.</p>
+
+<h2 id="API_Asíncrono">API Asíncrono</h2>
+
+<p>Los métodos del API Asíncrono, retornan sin bloquear el hilo de llamada. Para obtener un acceso asíncrono a la base de datos, use <code><a href="/en-US/docs/IndexedDB/IDBFactory#open" title="en-US/docs/IndexedDB/IDBFactory#open">open</a></code>() en el atributo <code><a href="/en-US/docs/IndexedDB/IDBEnvironment#attr_indexedDB" title="en-US/docs/IndexedDB/IDBEnvironment#attr indexedDB">indexedDB</a></code> de un objeto <a href="/en-US/docs/DOM/window" title="en-US/docs/DOM/window">window</a>. Este método retorna un objeto IDBRequest (IDBOpenDBRequest); operaciones asíncronas se comunicarán con la aplicación que llama, disparando eventos en los objetos IDBRequest.</p>
+
+<div class="note">
+<p>Nota: El objeto <code>indexedDB</code> se prefija en las versiones antiguas de los navegadores (propiedad <code>mozIndexedDB</code> para Gecko &lt; 16, <code>webkitIndexedDB</code> en Chrome, y <code>msIndexedDB</code> en IE 10).</p>
+</div>
+
+<ul>
+ <li><a href="/en-US/docs/IndexedDB/IDBFactory" title="en-US/docs/IndexedDB/IDBFactory"><code>IDBFactory</code></a> provee acceso a la base de datos. Esta es la interface implementada por el objeto global <code>indexedDB</code> y es el punto de entrada para la API.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBCursor" title="en-US/docs/IndexedDB/IDBCursor"><code>IDBCursor</code></a> itera sobre los objetos de almacenamiento y de índices.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBCursorWithValue"><code>IDBCursorWithValue</code></a> itera sobre los objetos de almacenamiento y de índices y retorna el valor actual del cursor.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBDatabase" title="en-US/docs/IndexedDB/IDBDatabase"><code>IDBDatabase</code></a> representa una conexión a la base de datos. Es la única manera de realizar una transacción en la base de datos.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBEnvironment" title="en-US/docs/IndexedDB/IDBEnvironment"><code>IDBEnvironment</code></a> provee acceso a la base de datos, desde el lado del cliente. Está implementada por el objeto <a href="/../en-US/docs/DOM/window" rel="internal" title="../en-US/docs/DOM/window">window</a>.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBIndex" title="en-US/docs/IndexedDB/IDBIndex"><code>IDBIndex</code></a> provee acceso a la metadata de un índice.</li>
+ <li><code><a href="/en-US/docs/IndexedDB/IDBKeyRange" title="en-US/docs/IndexedDB/KeyRange">IDBKeyRange</a></code> define un rango de claves.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBObjectStore" title="en-US/docs/IndexedDB/IDBObjectStore"><code>IDBObjectStore</code></a> representa un objeto de almacenamiento.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="en-US/docs/IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> representa un requerimiento para abrir una base de datos.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBRequest" title="en-US/docs/IndexedDB/IDBRequest"><code>IDBRequest</code></a> provee acceso a los resultados de los requerimientos asíncronos a la base de datos y a los objetos database. Es lo que se obtiene cuando se llama a un método asíncrono.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBTransaction" title="en-US/docs/IndexedDB/IDBTransaction"><code>IDBTransaction</code></a> representa una transacción. Cuando Ud. crea una transacción en la base de datos, especifica el alcance (como a que objetos store desea tener acceso), y determina la clase de acceso (sólo lectura o escritura) que desea tener.</li>
+ <li><a href="/en-US/docs/IndexedDB/IDBVersionChangeEvent" title="IDBVersionChangeEvent"><code>IDBVersionChangeEvent</code></a> indica que la versión de la base de datos ha cambiado.</li>
+</ul>
+
+<p>Una versión anterior de la especificación también define estas -ahora removidas- interfaces. Éstas son documentadas todavía, en caso de que necesite actualizar código escrito previamente:</p>
+
+<ul>
+ <li><code><a href="/en-US/docs/IndexedDB/IDBVersionChangeRequest" title="https://developer.mozilla.org/en-US/docs/IndexedDB/IDBVersionChangeRequest">IDBVersionChangeRequest</a></code> representa una solicitud para cambiar la versión de una base de datos. La manera de cambiar la versión de la base de datos ahora es diferente (llamando <a href="/en-US/docs/IndexedDB/IDBFactory#open" title="en-US/docs/IndexedDB/IDBFactory#open"><code>IDBFactory.open()</code></a> sin llamar también a <a href="/en-US/docs/IndexedDB/IDBDatabase#setVersion()" title="en-US/docs/IndexedDB/IDBDatabase#setVersion()"><code>IDBDatabase.setVersion()</code></a>), y la interfaz <a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="en-US/docs/IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> tiene ahora la funcionalidad de la eliminada <code>IDBVersionChangeRequest</code>.</li>
+ <li><code><a href="/en-US/docs/IndexedDB/IDBDatabaseException" title="en-US/docs/IndexedDB/DatabaseException">IDBDatabaseException </a></code> {{ obsolete_inline() }} representa las condiciones de excepción que se pueden encontrar mientras se ejecutan operaciones en la base de datos.</li>
+</ul>
+
+<p>Hay también una <a href="/en-US/docs/IndexedDB/Syncronous_API" title="/en-US/docs/IndexedDB/SyncronousAPI">versión sincrónica de la API</a>. La API síncrona no ha sido implementada en cualquier navegador. Está destinada a ser usada con <a href="/en-US/docs/DOM/Using_web_workers" title="https://developer.mozilla.org/en-US/docs/Using_web_workers">WebWorkers</a>.</p>
+
+<h2 id="Límites_de_almacenamiento">Límites de almacenamiento</h2>
+
+<p>No existe un límite de tamaño para un elemento simple de la base de datos. Sin embargo, puede haber un límite en el tamaño de cada base de datos IndexedDB. Este límite (y la forma en que la interfaz de usuario la hace valer) puede variar de una navegador a otro:</p>
+
+<ul>
+ <li>
+  <p>Firefox: no hay límite en el tamaño de una base de datos IndexedDB. La interfaz de usuario solicita permiso para almacenar blobs de más de 50MB. Este límite puede ser modificado mediante la preferencia dom.indexedDB.warningQuota (que está definida en <a href="http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js" title="http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js">http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js</a>).</p>
+ </li>
+ <li>Google Chrome: vea <a class="link-https" href="https://developers.google.com/chrome/whitepapers/storage#temporary" rel="freelink">https://developers.google.com/chrome...rage#temporary</a></li>
+</ul>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<p>Un claro ejemplo para lo que IndexedDB puede ser utilizado en la web, es el ejemplo de Marco Castelluccio, ganador del DevDerby IndexedDB Mozilla. La demostración ganadora fue <a href="/en-US/demos/detail/elibri" title="https://developer.mozilla.org/en-US/demos/detail/elibri">eLibri</a>, una biblioteca y una aplicación de lectura de libros electrónicos.</p>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de los navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>API asíncrono</td>
+   <td>
+    <p>24.0<br>
+     11.0 {{ property_prefix("webkit") }}</p>
+   </td>
+   <td>
+    <p>{{ CompatGeckoDesktop("16.0") }}<br>
+     {{ CompatGeckoDesktop("2.0") }} {{ property_prefix("moz") }}</p>
+   </td>
+   <td>10 {{ property_prefix("ms") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+  <tr>
+   <td>API síncrono<br>
+    (usado por <a href="/en-US/docs/DOM/Using_web_workers" title="https://developer.mozilla.org/en-US/docs/Using_web_workers">WebWorkers</a>)</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}<br>
+    Vea {{ bug(701634) }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>API síncrono</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatGeckoDesktop("6.0") }} {{ property_prefix("moz") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Para otra matriz de compatibilidad, vea también: <a href="http://caniuse.com/indexeddb" title="http://caniuse.com/indexeddb">Cuándo puedo usar IndexedDB</a></p>
+
+<p>También existe la posibilidad de usar IndexedDB en <a href="http://caniuse.com/sql-storage" title="http://caniuse.com/sql-storage"> navegadores que soportan WebSQL</a> por el uso de <a href="https://github.com/axemclion/IndexedDBShim" title="https://github.com/axemclion/IndexedDBShim">IndexedDB Polyfill</a>.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB" title="en-US/docs/IndexedDB/Basic Concepts Behind IndexedDB">Conceptos básicos acerca de IndexedDB</a></li>
+ <li><a href="/en-US/docs/IndexedDB/Using_IndexedDB" title="en-US/docs/IndexedDB/IndexedDB primer">Usando IndexedDB</a></li>
+ <li><a class="external" href="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/" title="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">Almacenando imágenes y archivos en IndexedDB</a></li>
+ <li><a class="external" href="http://www.html5rocks.com/tutorials/indexeddb/todo/" title="http://www.html5rocks.com/tutorials/indexeddb/todo/">Una lista simple de PENDIENTES usando HTML5 IndexedDB</a>. {{ Note("Este tutorial está basado en una antigua versión de la especificación y no funciona en los navegadores actualizados. por ejemplo, todavía usa el método actualmente eliminado <code>setVersion()</code>.") }}</li>
+ <li><a class="external" href="http://www.w3.org/TR/IndexedDB/" title="http://www.w3.org/TR/IndexedDB/">Especificación de la API para Indexed Database </a></li>
+ <li><a class="external" href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx" title="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — El alamcén en su navegador</a></li>
+ <li><a class="external" href="http://caniuse.com/indexeddb" title="http://caniuse.com/indexeddb">Soporte IndexedDB en navegadores</a></li>
+ <li><a class="external" href="http://nparashuram.com/IndexedDB/trialtool/index.html" title="http://nparashuram.com/IndexedDB/trialtool/index.html">Ejemplos IndexedDB</a></li>
+ <li><a href="https://github.com/axemclion/IndexedDBShim" title="https://github.com/axemclion/IndexedDBShim">IndexedDB Polyfill</a> para navegadores que sólo soportan WebSQL (p.e. mobile WebKit)</li>
+ <li><a href="http://nparashuram.com/IndexedDBShim/" title="http://nparashuram.com/IndexedDBShim/">JQuery IndexedDB plugin</a></li>
+</ul>
diff --git a/files/es/conflicting/web/api/node/index.html b/files/es/conflicting/web/api/node/index.html
new file mode 100644
index 0000000000..2204a75c59
--- /dev/null
+++ b/files/es/conflicting/web/api/node/index.html
@@ -0,0 +1,35 @@
+---
+title: Nodo.nodoPrincipal
+slug: conflicting/Web/API/Node
+tags:
+  - API
+  - DOM
+  - Gecko
+  - Propiedad
+translation_of: Web/API/Node
+translation_of_original: Web/API/Node/nodePrincipal
+original_slug: Web/API/Node/nodoPrincipal
+---
+<div>
+<div>{{APIRef("DOM")}}</div>
+{{Non-standard_header}}
+
+<p>La propiedad de solo loctura de <code><strong>Nodo.nodePrincipal</strong></code> devuelve el objeto {{Interface("nsIPrincipal")}} representando el contexto de seguridad del nodo actual.</p>
+
+<p>{{Note("This property exists on all nodes (HTML, XUL, SVG, MathML, etc.), but only if the script trying to use it has chrome privileges.")}}</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>principalObj</em> = element.nodePrincipal
+</pre>
+
+<h2 id="Notes" name="Notes">Notas</h2>
+
+<p>Esta propiedad es de solo lectura; Si intentamos editarla nos lanzará una excepción. Además, esta propiedad tan solo debería ser accesible desde código privilegiado</p>
+
+<h2 id="Specification" name="Specification">Especificación</h2>
+
+<p>No hay especificaciones.</p>
+</div>
+
+<p> </p>
diff --git a/files/es/conflicting/web/api/push_api/index.html b/files/es/conflicting/web/api/push_api/index.html
new file mode 100644
index 0000000000..016e0abcaa
--- /dev/null
+++ b/files/es/conflicting/web/api/push_api/index.html
@@ -0,0 +1,434 @@
+---
+title: Usando la API Push
+slug: conflicting/Web/API/Push_API
+translation_of: Web/API/Push_API
+translation_of_original: Web/API/Push_API/Using_the_Push_API
+original_slug: Web/API/Push_API/Using_the_Push_API
+---
+<p class="summary"><span class="seoSummary">La W3C <a href="/en-US/docs/Web/API/Push_API">Push API</a> offers some exciting new functionality for developers to use in web applications: this article provides an introduction to getting Push notifications setup and running, with a simple demo.</span></p>
+
+<p>La habilidad de enviar mensajes o notificaciones de un servidor a un cliente en cualquier momento —si la aplicación está activa en su sitema o no—es algo que ha sido disfrutado por las plataformas nativas durante algún tiempo, y esta finalmente llega a la web! el soporte para muchos push está ahora disponible en Firefox 43+ y Chrome 42+ en escritorio, esperamos seguir pronto con las plataformas moviles. {{domxref("PushMessageData")}} actualmente solo es soportada experimentalmente en Firefox (44+), y la implementación está sujeta a cambios.</p>
+
+<div class="note">
+<p><strong>Note</strong>: Early versions of Firefox OS used a proprietary version of this API called <a href="/en-US/docs/Web/API/Simple_Push_API">Simple Push</a>. This is being rendered obsolete by the Push API standard.</p>
+</div>
+
+<h2 id="Demo_las_bases_de_una_simple_app_de_servidor_de_chat">Demo: las bases de una simple app de servidor de chat</h2>
+
+<p>La demo que hemos creado proporciona los principios de una simple app de chat. Esta presenta un formulario para que ingreses un identificador de chat y un boton que al presionar se suscriba a los mensajes push.</p>
+
+<p>En este punto, el nombre de los nuevos suscriptores aparecerá en la lista de suscriptores, junto con un campo de texto y un botón de envío para permitir al suscriptor enviar mensajes.</p>
+
+<p>At this point, the new subscriber's name will appear in the subscriber's list, along with a text field and submit button to allow the subscriber to send messages.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11823/push-api-demo.png" style="border: 1px solid black; display: block; height: 406px; margin: 0px auto; width: 705px;"></p>
+
+<p>Para correr la demo, siga las instrucciones de <a href="https://github.com/chrisdavidmills/push-api-demo">push-api-demo README</a>. Tenga en cuenta que el componente server-side aún nesecita un poco de trabajo para que funcione en chrome y se ejecute de una manera más rezonable. Pero los aspectos de push pueden ser explicados a fondo; Nos sumergiremos en ella después de revisar las tecnologías en juego.</p>
+
+<h2 id="Visión_de_la_tecnología">Visión de la tecnología</h2>
+
+<p>Esta sección proporciona un esquema de qué tecnologías están involucradas en este ejemplo.</p>
+
+<p>Los mensajes web push hacen parte de la familia tecnológica <a href="/en-US/docs/Web/API/Service_Worker_API">service workers</a>; en particular, se requiere que un service worker esté activo en la página para recibir mensajes push. el service worker recibe el mensaje push, y acontinuación depende de usted cómo notificar a la página. Usted puede:</p>
+
+<p>Web Push messages are part of the <a href="/en-US/docs/Web/API/Service_Worker_API">service workers</a> technology family; in particular, a service worker is required to be active on the page for it to receive push messages. The service worker receives the push message, and then it is up to you how to then notify the page. You can:</p>
+
+<ul>
+ <li>Enviar una <a href="/en-US/docs/Web/API/Notifications_API">notificación web</a> emergente para alertar al usuario. Esto requiere que sean concedidos los permisos para enviar el mensaje push.</li>
+ <li>Envía un mensaje a la página principal a través de un  {{domxref("MessageChannel")}}.</li>
+</ul>
+
+<p>A menudo una combinación de los dos será necesario; La demo a continuación muestra un ejemplo de cada uno.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Usted necesita algún tipo de código que se ejecute en el servidor para manejar el cifrado de punto final/datos y enviar las solicitudes de notificaciones push. En nuestra demostración hemos creado un servidor  quick-and-dirty usando <a href="https://nodejs.org/">NodeJS</a>.</p>
+</div>
+
+<p>El service worker también tiene que suscribirse al servicio de mensajería psuh. Cada sesión recibe su propio punto final único cuando se suscribe al servicio de mensajería. Este punto final es obtenido desde la propiedad  ({{domxref("PushSubscription.endpoint")}}) en el objeto de suscripción. Este punto final se puede enviar a su servidor y se utiliza para enviar un mensaje al service worker asctivo en esta sesión. Cada navegador tiene su propio servidor de mensajería push para manejar el envío del mensaje push.</p>
+
+<h3 id="Encryption">Encryption</h3>
+
+<div class="note">
+<p><strong>Note</strong>: For an interactive walkthrough, try JR Conlin's <a href="https://jrconlin.github.io/WebPushDataTestPage/">Web Push Data Encryption Test Page</a>.</p>
+</div>
+
+<p>To send data via a push message, it needs to be encrypted. This requires a public key created using the {{domxref("PushSubscription.getKey()")}} method, which relies upon some complex encryption mechanisms that are run server-side; read <a href="https://tools.ietf.org/html/draft-ietf-webpush-encryption-01">Message Encryption for Web Push</a> for more details. As time goes on, libraries will appear to handle key generation and encryption/decryption of push messages; for this demo we used Marco Castelluccio's NodeJS <a href="https://github.com/marco-c/web-push">web-push library</a>.</p>
+
+<div class="note">
+<p><strong>Note</strong>: There is also another library to handle the encryption with a Node and Python version available, see <a href="https://github.com/martinthomson/encrypted-content-encoding">encrypted-content-encoding</a>.</p>
+</div>
+
+<h3 id="Push_workflow_summary">Push workflow summary</h3>
+
+<p>To summarize, here is what is needed to implement push messaging. You can find more details about specific parts of the demo code in subsequent sections.</p>
+
+<ol>
+ <li>Request permission for web notifications, or anything else you are using that requires permissions.</li>
+ <li>Register a service worker to control the page by calling {{domxref("ServiceWorkerContainer.register()")}}.</li>
+ <li>Subscribe to the push messaging service using {{domxref("PushManager.subscribe()")}}.</li>
+ <li>Retrieve the endpoint associated with the subscription and generate a client public key ({{domxref("PushSubscription.endpoint")}} and {{domxref("PushSubscription.getKey()")}}. Note that <code>getKey()</code> is currently experimental and Firefox only.)</li>
+ <li>Send these details to the server so it can send push message when required. This demo uses {{domxref("XMLHttpRequest")}}, but you could use <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a>.</li>
+ <li>If you are using the <a href="/en-US/docs/Web/API/Channel_Messaging_API">Channel Messaging API</a> to comunicate with the service worker, set up a new message channel ({{domxref("MessageChannel.MessageChannel()")}}) and send <code>port2</code> over to the service worker by calling {{domxref("Worker.postMessage()")}} on the service worker, in order to open up the communication channel. You should also set up a listener to respond to messages sent back from the service worker.</li>
+ <li>On the server side, store the endpoint and any other required details so they are available when a push message needs to be sent to a push subscriber (we are using a simple text file, but you could use a database or whatever you like). In a production app, make sure you keep these details hidden, so malicious parties can't steal endpoints and spam subscribers with push messages.</li>
+ <li>To send a push message, you need to send an HTTP <code>POST</code> to the endpoint URL. The request must include a <code>TTL</code> header that limits how long the message should be queued if the user is not online. To include payload data in your request, you must encrypt it (which involves the client public key). In our demo, we are using the <a href="https://github.com/marco-c/web-push">web-push</a> module, which handles all the hard work for you.</li>
+ <li>Over in your service worker, set up a <code>push</code> event handler to respond to push messages being received.
+  <ol>
+   <li>If you want to respond by sending a channel message back to the main context (see Step 6) you need to first get a reference to the <code>port2</code> we sent over to the service worker context ({{domxref("MessagePort")}}). This is available on the {{domxref("MessageEvent")}} object passed to the <code>onmessage</code> handler ({{domxref("ServiceWorkerGlobalScope.onmessage")}}). Specifically, this is found in the <code>ports</code> property, index 0. Once this is done, you can send a message back to <code>port1</code>, using {{domxref("MessagePort.postMessage()")}}.</li>
+   <li>If you want to respond by firing a system notification, you can do this by calling {{domxref("ServiceWorkerRegistration.showNotification()")}}. Note that in our code we have run this inside an {{domxref("ExtendableEvent.waitUntil()")}} method — this extends the lifetime of the event until after the notification has been fired, so we can make sure everything has happened that we want to happen.<span id="cke_bm_307E" style="display: none;"> </span></li>
+  </ol>
+ </li>
+</ol>
+
+<h2 id="Construyendo_la_demo">Construyendo la demo</h2>
+
+<p>Vamos a ensayar el código para esta demo, podemos empezar a entender como trabaja todo esto.</p>
+
+<ul>
+ <li>
+  <h3 id="HTML_y_CSS">HTML y CSS</h3>
+ </li>
+</ul>
+
+<p>No hay nada destacalbe sobre el HTML y el CSS para la demo; el HTML inicialmente contiene un simple formulario que permite introducir un udentificador para la sala de chat, un boton que al hacer click se suscribe a las notificaciones push, y dos listas con los suscriptores y los mensajes. Una vez suscrito, aparecerán controles adicionales para permitir al usuario actual escribir mensajes en el chat.</p>
+
+<p>El CSS ha sido muy minimo para no desvirtuar la explicación de la funcionalidad Push Api.</p>
+
+<ul>
+ <li>
+  <h3 id="El_archivo_JavaScript_principal">El archivo JavaScript principal</h3>
+ </li>
+</ul>
+
+<p>El JavaScript es obviamente más sustancial. Echemos un vistazo al archivo JavaScript principal.</p>
+
+<h4 id="Variables_y_configuración_inicial">Variables y configuración inicial</h4>
+
+<p>Para iniciar, nosotros declaramos algunas variables a usar en nuestra app:</p>
+
+<pre class="brush: js">var isPushEnabled = false;
+var useNotifications = false;
+
+var subBtn = document.querySelector('.subscribe');
+var sendBtn;
+var sendInput;
+
+var controlsBlock = document.querySelector('.controls');
+var subscribersList = document.querySelector('.subscribers ul');
+var messagesList = document.querySelector('.messages ul');
+
+var nameForm = document.querySelector('#form');
+var nameInput = document.querySelector('#name-input');
+nameForm.onsubmit = function(e) {
+  e.preventDefault()
+};
+nameInput.value = 'Bob';</pre>
+
+<p>Primero, tenemos dos boleanos para hacer un seguimiento si se a suscrito a push, y si ha permitido las notificaciones.</p>
+
+<p>A continuación, tomamos una referencia al suscrito/no-suscrito <code>{{htmlelement("button")}}</code>, y se declaran variables para almacenar referencias a nuestro mensaje enviado boton/entrada (sólo se crean cuando la suscripsión es correcta.)</p>
+
+<p>Las siguientes variables toman referencia a los trés elementos principales <code>{{htmlelement("div")}}</code> en el diseño, por lo que podemos insertar elementos en ellos (por ejemplo cuando aparezca el botón <em>envíar el mensaje de chat</em> o el mensaje de chat aparezca en la lista de <em>mensajes</em>.)</p>
+
+<p>Finalmente tomamos referencia a nuestro formulario de selección de nombre y el elemento <code>{{htmlelement("input")}},</code> damos a la entrada un valor por defecto, y usamos <code><a href="/en-US/docs/Web/API/Event/preventDefault">preventDefault()</a></code> para detener el envío del formulario cuando este es enviado pulsando return.</p>
+
+<p>A continuación, pedimos permiso para enviar las notificaciones web, usando <code>{{domxref("Notification.requestPermission","requestPermission()")}}</code>:</p>
+
+<pre class="brush: js">Notification.requestPermission();</pre>
+
+<p>Ahora ejecutamos una sección de código cuando se dispara el <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onload">onload</a></code>, para empezar el proceso de inicialización de la app cuando se carga pro primera vez. En primer lugar añadimos un detector de eventos de clik al botón  Sucribirse/unsubscribe que ejecuta nuestra funcion <code>unsubscribe()</code> si actualmente estamos suscritos (<code>isPushEnabled</code> is <code>true</code>), y <code>subscribe()</code> de la otra manera:</p>
+
+<pre class="brush: js">window.addEventListener('load', function() {
+  subBtn.addEventListener('click', function() {
+    if (isPushEnabled) {
+      unsubscribe();
+    } else {
+      subscribe();
+    }
+  });</pre>
+
+<p>A continuación verificamos el service worked es soportado. Si es así, registramos un service worker usando <code>{{domxref("ServiceWorkerContainer.register()")}}</code>, y ejecutando nuestra función <code>initialiseState()</code>. Si no es así, entregamos un mensaje de error a la consola.</p>
+
+<pre class="brush: js">  // Check that service workers are supported, if so, progressively
+  // enhance and add push messaging support, otherwise continue without it.
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.register('sw.js').then(function(reg) {
+      if(reg.installing) {
+        console.log('Service worker installing');
+      } else if(reg.waiting) {
+        console.log('Service worker installed');
+      } else if(reg.active) {
+        console.log('Service worker active');
+      }
+
+      initialiseState(reg);
+    });
+  } else {
+    console.log('Service workers aren\'t supported in this browser.');
+  }
+});
+</pre>
+
+<p>La siguiente cosa en el código es la función <code>initialiseState()</code> — para el codigo completo comentado, mira en <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js"><code>initialiseState()</code> source on Github</a> (no lo estamos repitiendo aquí por brevedad.)</p>
+
+<p><code>initialiseState()</code> primero comprueba si las notificaciones son soportadas en los service workers, entonces establece la variable  <code>useNotifications</code> a verdadero. A continuación comprueba si dichas notificaciones están permitidas por el usuario y si los mensajes push están soportados, y reacciona deacuerdo a cada uno.</p>
+
+<p>Finalmente, se usa <code>{{domxref("ServiceWorkerContainer.ready()")}}</code> para esperar a que el service worker esté activo y listo para hacer las cosas. Una vez se revuelva el promise, recuperamos nuestra suscripsión para enviar los mensajes push usando la propiedad <code>{{domxref("ServiceWorkerRegistration.pushManager")}}</code>, que devuelve un objeto <code>{{domxref("PushManager")}}</code> cuando llamamos a <code>{{domxref("PushManager.getSubscription()")}}</code>. Una vez la segunda promesa interna se resuelva, habilitamos el botón subscribe/unsubscribe (<code>subBtn.disabled = false;</code>), y verificamos que tenemos un objeto suscripsión para trabajar.</p>
+
+<p>Si lo hacemos, entonces ya estamos suscritos. Esto es posible cuando la app no está abierta en el navegador; el service worker aun puede ser activado en segundo plano. si estamos suscritos, actualizamos la UI para mostrar que estamos suscritos por la actualizacion del label en el botón, entonces establecemos <code>isPushEnabled</code> to <code>true</code>, toma el punto final de suscripsión desde <code>{{domxref("PushSubscription.endpoint")}}</code>, genera una public key usando <code>{{domxref("PushSubscription.getKey()")}}</code>, y ejecutando nuestra función <code>updateStatus()</code>, que como verá más adelante se comunica con el servidor.</p>
+
+<p>Como un bonus añadido, configuramos un nuevo <code>{{domxref("MessageChannel")}}</code> usando el constructor <code>{{domxref("MessageChannel.MessageChannel()")}}</code>, toma una referencia al service worker activo usando <code>{{domxref("ServiceworkerRegistration.active")}}</code>, luego configure un canal entre el contexto principal del navegador y el contexto del service worker usando <code>{{domxref("Worker.postMessage()")}}</code>. El contexto del navegador recive mensajes en <code>{{domxref("MessageChannel.port1")}}</code>; Cuando esto suceda, ejecutamos la función <code>handleChannelMessage()</code> para decidir que hacer con esos datos (mirar la sección <code>{{anch("Handling channel messages sent from the service worker")}}</code> ).</p>
+
+<h4 id="Subscribing_and_unsubscribing">Subscribing and unsubscribing</h4>
+
+<p>Ahora regresamos la atención a las funciones <code>subscribe()</code> y <code>unsubscribe()</code> usadas para subscribe/unsubscribe al servicion de notificaciones push.</p>
+
+<p>In the case of subscription, we again check that our service worker is active and ready by calling {{domxref("ServiceWorkerContainer.ready()")}}. When the promise resolves, we subscribe to the service using {{domxref("PushManager.subscribe()")}}. If the subscription is successful, we get a {{domxref("PushSubscription")}} object, extract the subscription endpoint from this and generate a public key (again, {{domxref("PushSubscription.endpoint")}} and {{domxref("PushSubscription.getKey()")}}), and pass them to our <code>updateStatus()</code> function along with the update type (<code>subscribe</code>) to send the necessary details to the server.</p>
+
+<p>We also make the necessary updates to the app state (set <code>isPushEnabled</code> to <code>true</code>) and UI (enable the subscribe/unsubscribe button and set its label text to show that the next time it is pressed it will unsubscribe.)</p>
+
+<p>The <code>unsubscribe()</code> function is pretty similar in structure, but it basically does the opposite; the most notable difference is that it gets the current subscription using {{domxref("PushManager.getSubscription()")}}, and when that promise resolves it unsubscribes using {{domxref("PushSubscription.unsubscribe()")}}.</p>
+
+<p>Appropriate error handling is also provided in both functions.  </p>
+
+<p>We only show the <code>subscribe()</code> code below, for brevity; see the full <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js">subscribe/unsubscribe code on Github</a>.</p>
+
+<pre class="brush: js">function subscribe() {
+  // Disable the button so it can't be changed while
+  // we process the permission request
+
+  subBtn.disabled = true;
+
+  navigator.serviceWorker.ready.then(function(reg) {
+    reg.pushManager.subscribe({userVisibleOnly: true})
+      .then(function(subscription) {
+        // The subscription was successful
+        isPushEnabled = true;
+        subBtn.textContent = 'Unsubscribe from Push Messaging';
+        subBtn.disabled = false;
+
+        // Update status to subscribe current user on server, and to let
+        // other users know this user has subscribed
+        var endpoint = subscription.endpoint;
+        var key = subscription.getKey('p256dh');
+        updateStatus(endpoint,key,'subscribe');
+      })
+      .catch(function(e) {
+        if (Notification.permission === 'denied') {
+          // The user denied the notification permission which
+          // means we failed to subscribe and the user will need
+          // to manually change the notification permission to
+          // subscribe to push messages
+          console.log('Permission for Notifications was denied');
+
+        } else {
+          // A problem occurred with the subscription, this can
+          // often be down to an issue or lack of the gcm_sender_id
+          // and / or gcm_user_visible_only
+          console.log('Unable to subscribe to push.', e);
+          subBtn.disabled = false;
+          subBtn.textContent = 'Subscribe to Push Messaging';
+        }
+      });
+  });
+}</pre>
+
+<h4 id="Updating_the_status_in_the_app_and_server">Updating the status in the app and server</h4>
+
+<p>The next function in our main JavaScript is <code>updateStatus()</code>, which updates the UI for sending chat messages when subscribing/unsubscribing and sends a request to update this information on the server.</p>
+
+<p>The function does one of three different things, depending on the value of the <code>statusType</code> parameter passed into it:</p>
+
+<ul>
+ <li><code>subscribe</code>: The button and text input for sending chat messages are created and inserted into the UI, and an object is sent to the server via XHR containing the status type (<code>subscribe</code>), username of the subscriber, subscription endpoint, and client public key.</li>
+ <li><code>unsubscribe</code>: This basically works in the opposite way to subscribe — the chat UI elements are removed, and an object is sent to the server to tell it that the user has unsubscribed.</li>
+ <li><code>init</code>: This is run when the app is first loaded/initialised — it creates the chat UI elements, and sends an object to the server to tell it that which user has reinitialised (reloaded.)</li>
+</ul>
+
+<p>Again, we have not included the entire function listing for brevity. Examine the <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js">full <code>updateStatus()</code> code on Github</a>.</p>
+
+<h4 id="Handling_channel_messages_sent_from_the_service_worker">Handling channel messages sent from the service worker</h4>
+
+<p>As mentioned earlier, when a <a href="/en-US/docs/Web/API/Channel_Messaging_API">channel message</a> is received from the service worker, our <code>handleChannelMessage()</code> function is called to handle it. This is done by our handler for the {{event("message")}} event, {{domxref("channel.port1.onmessage")}}:</p>
+
+<pre class="brush: js">channel.port1.onmessage = function(e) {
+  handleChannelMessage(e.data);
+}</pre>
+
+<p>This occurs when the <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/sw.js#L8">service worker sends a channel message over</a>.</p>
+
+<p>The <code>handleChannelMessage()</code> function looks like this:</p>
+
+<pre class="brush: js">function handleChannelMessage(data) {
+  if(data.action === 'subscribe' || data.action === 'init') {
+    var listItem = document.createElement('li');
+    listItem.textContent = data.name;
+    subscribersList.appendChild(listItem);
+  } else if(data.action === 'unsubscribe') {
+    for(i = 0; i &lt; subscribersList.children.length; i++) {
+      if(subscribersList.children[i].textContent === data.name) {
+        subscribersList.children[i].parentNode.removeChild(subscribersList.children[i]);
+      }
+    }
+    nameInput.disabled = false;
+  } else if(data.action === 'chatMsg') {
+    var listItem = document.createElement('li');
+    listItem.textContent = data.name + ": " + data.msg;
+    messagesList.appendChild(listItem);
+    sendInput.value = '';
+  }
+}</pre>
+
+<p>What happens here depends on what the <code>action</code> property on the <code>data</code> object is set to:</p>
+
+<ul>
+ <li><code>subscribe</code> or <code>init</code> (at both startup and restart, we need to do the same thing in this sample): An {{htmlelement("li")}} element is created, its text content is set to <code>data.name</code> (the name of the subscriber), and it is appended to the subscribers list (a simple {{htmlelement("ul")}} element) so there is visual feedback that a subscriber has (re)joined the chat.</li>
+ <li><code>unsubscribe</code>: We loop through the children of the subscribers list, find the one whose text content is equal to <code>data.name</code> (the name of the unsubscriber), and delete that node to provide visual feedback that someone has unsubscribed.</li>
+ <li><code>chatMsg</code>: In a similar manner to the first case, an {{htmlelement("li")}} element is created, its text content is set to <code>data.name + ": " + data.msg</code> (so for example "Chris: This is my message"), and it is appended to the chat messages list; this is how the chat messages appear on the UI for each user.</li>
+</ul>
+
+<div class="note">
+<p><strong>Note</strong>: We have to pass the data back to the main context before we do DOM updates because service workers don't have access to the DOM. You should be aware of the limitations of service workers before attemping to ue them. Read <a href="/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers">Using Service Workers</a> for more details.</p>
+</div>
+
+<h4 id="Sending_chat_messages">Sending chat messages</h4>
+
+<p>When the <em>Send Chat Message</em> button is clicked, the content of the associated text field is sent as a chat message. This is handled by the <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js"><code>sendChatMessage()</code> function</a> (again, not shown in full for brevity). This works in a similar way to the different parts of the <code>updateStatus()</code> function (see {{anch("Updating the status in the app and server")}}) — we retrieve an endpoint and public key via a {{domxref("PushSubscription")}} object, which is itself retrieved via {{domxref("ServiceWorkerContainer.ready()")}} and {{domxref("PushManager.subscribe()")}}. These are sent to the server via {{domxref("XMLHttpRequest")}} in a message object, along with the name of the subscribed user, the chat message to send, and a <code>statusType</code> of <code>chatMsg</code>.</p>
+
+<h3 id="The_server">The server</h3>
+
+<p>As mentioned above, we need a server-side component in our app, to handle storing subscription details, and send out push messages when updates occur. We've hacked together a quick-and-dirty server using <a href="http://nodejs.org/">NodeJS</a> (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/server.js">server.js</a></code>), which handles the XHR requests sent by our client-side JavaScript code.</p>
+
+<p>It uses a text file (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/endpoint.txt">endpoint.txt</a></code>) to store subscription details; this file starts out empty. There are four different types of request, marked by the <code>statusType</code> property of the object sent over in the request; these are the same as those understood client-side, and perform the required server actions for that same situation. Here's what each means in the context of the server:</p>
+
+<ul>
+ <li><code>subscribe</code>: The server adds the new subscriber's details into the subscription data store (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/endpoint.txt">endpoint.txt</a></code>), including the endpoint, and then sends a push message to all the endpoints it has stored to tell each subscriber that someone new has joined the chat.</li>
+ <li><code>unsubscribe</code>: The server finds the sending subscriber's details in the subscription store and removes it, then sends a push message to all remaining subscribers telling them the user has unsubscribed.</li>
+ <li><code>init</code>: The server reads all the current subscribers from the text file, and sends each one a push message to tell them a user has initialized (rejoined) the chat.</li>
+ <li><code>chatMsg</code>: Sent by a subscriber that wishes to deliver a message to all users; the server reads the list of all current subscribers from the subscription store file, then sends each one a push message containing the new chat message they should display.</li>
+</ul>
+
+<p>A couple more things to note:</p>
+
+<ul>
+ <li>We are using the Node.js <a href="https://nodejs.org/api/https.html">https module</a> to create the server, because for security purposes, service workers only work on a secure connection. This is why we need to include the <code>.pfx</code> security cert in the app, and reference it when creating the server in the Node code.</li>
+ <li>When you send a push message without data, you simply send it to the endpoint URL using an HTTP <code>POST</code> request. However, when the push message contains data, you need to encrypt it, which is quite a complex process. As time goes on, libraries will appear to do this kind of thing for you; for this demo we used Marco Castelluccio's NodeJS <a href="https://github.com/marco-c/web-push">web-push library</a>. Have a look at the source code to get more of an idea of how the encryption is done (and read <a href="https://tools.ietf.org/html/draft-ietf-webpush-encryption-01">Message Encryption for Web Push</a> for more details.) The library <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/server.js#L43-L46">makes sending a push message simple</a>.</li>
+ <li>If you wish to have messages that collapse (newer updates will replace older updates), you can use the Topic feature. A topic is a special class of subscription update that has a <code>Topic</code> header. A topic name can be any URL safe, base64 string. For example, a header like "<code>Topic: MyFavoriteTopic-For2016</code>" is fine, but "<code>Topic: OMG! Kitties :)</code>" is not. Topic messages are collapsed when the subscriber is offline or unavailable. When they come back, they will receive only the lastest message per topic, along with whatever other messages are pending. "<a href="https://hacks.mozilla.org/2016/11/mozilla-push-server-now-supports-topics/">Mozilla Push Server now supports Topics</a>" on the Mozilla Hacks blog gives more details and examples.</li>
+</ul>
+
+<h3 id="The_service_worker">The service worker</h3>
+
+<p>Now let's have a look at the service worker code (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/sw.js">sw.js</a></code>), which responds to the push messages, represented by {{Event("push")}} events. These are handled on the service worker's scope by the ({{domxref("ServiceWorkerGlobalScope.onpush")}}) event handler; its job is to work out what to do in response to each received message. We first convert the received message back into an object by calling {{domxref("PushMessageData.json()")}}. Next, we check what type of push message it is, by looking at the object's <code>action</code> property:</p>
+
+<ul>
+ <li><code>subscribe</code> or <code>unsubscribe</code>: We send a system notification via the <code>fireNotification()</code> function, but also send a message back to the main context on our {{domxref("MessageChannel")}} so we can update the subscriber list accordingly (see {{anch("Handling channel messages sent from the service worker")}} for more details).</li>
+ <li><code>init</code> or <code>chatMsg</code>: We just send a channel message back to the main context to handle the <code>init</code> and <code>chatMsg</code> cases (these don't need a system notification).</li>
+</ul>
+
+<pre class="brush: js">self.addEventListener('push', function(event) {
+  var obj = event.data.json();
+
+  if(obj.action === 'subscribe' || obj.action === 'unsubscribe') {
+    fireNotification(obj, event);
+    port.postMessage(obj);
+  } else if(obj.action === 'init' || obj.action === 'chatMsg') {
+    port.postMessage(obj);
+  }
+});</pre>
+
+<p>Next, let's look at the <code>fireNotification()</code> function (which is blissfully pretty simple).</p>
+
+<pre class="brush: js">function fireNotification(obj, event) {
+  var title = 'Subscription change';
+  var body = obj.name + ' has ' + obj.action + 'd.';
+  var icon = 'push-icon.png';
+  var tag = 'push';
+
+  event.waitUntil(self.registration.showNotification(title, {
+    body: body,
+    icon: icon,
+    tag: tag
+  }));
+}</pre>
+
+<p>Here we assemble the assets needed by the notification box: the title, body, and icon. Then we send a notification via the {{domxref("ServiceWorkerRegistration.showNotification()")}} method, providing that information as well as the tag "push", which we can use to identify this notification among any other notifications we might be using. When the notification is successfully sent, it manifests as a system notification dialog on the users computers/devices in whatever style system notifications look like on those systems (the following image shows a Mac OSX system notification.)</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11855/subscribe-notification.png" style="display: block; height: 65px; margin: 0px auto; width: 326px;"></p>
+
+<p>Note that we do this from inside an {{domxref("ExtendableEvent.waitUntil()")}} method; this is to make sure the service worker remains active until the notification has been sent. <code>waitUntil()</code> will extend the life cycle of the service worker until everything inside this method has completed.</p>
+
+<div class="note">
+<p><strong>Note</strong>: Web notifications from service workers were introduced around Firefox version 42, but are likely to be removed again while the surrounding functionality (such as <code>Clients.openWindow()</code>) is properly implemented (see {{bug(1203324)}} for more details.)</p>
+</div>
+
+<h2 id="Handling_premature_subscription_expiration">Handling premature subscription expiration</h2>
+
+<p>Sometimes push subscriptions expire prematurely, without {{domxref("PushSubscription.unsubscribe()")}} being called. This can happen when the server gets overloaded, or if you are offline for a long time, for example.  This is highly server-dependent, so the exact behavior is difficult to predict. In any case, you can handle this problem by watching for the {{Event("pushsubscriptionchange")}} event, which you can listen for by providing a {{domxref("ServiceWorkerGlobalScope.onpushsubscriptionchange")}} event handler; this event is fired only in this specific case.</p>
+
+<pre class="brush: js  language-js"><code class="language-js">self<span class="punctuation token">.</span><span class="function token">addEventListener<span class="punctuation token">(</span></span><span class="string token">'pushsubscriptionchange'</span><span class="punctuation token">,</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+ <span class="comment token"> // do something, usually resubscribe to push and
+</span> <span class="comment token"> // send the new subscription details back to the
+</span> <span class="comment token"> // server via XHR or Fetch
+</span><span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Note that we don't cover this case in our demo, as a subscription ending is not a big deal for a simple chat server. But for a more complex example you'd probably want to resubscribe the user.</p>
+
+<h2 id="Extra_steps_for_Chrome_support">Extra steps for Chrome support</h2>
+
+<p>To get the app working on Chrome, we need a few extra steps, as Chrome currently relies on Google's Cloud Messaging service to work.</p>
+
+<h3 id="Setting_up_Google_Cloud_Messaging">Setting up Google Cloud Messaging</h3>
+
+<p>To get this set up, follow these steps:</p>
+
+<ol>
+ <li>Navigate to the <a href="https://console.developers.google.com">Google Developers Console</a>  and set up a new project.</li>
+ <li>Go to your project's homepage (ours is at <code>https://console.developers.google.com/project/push-project-978</code>, for example), then
+  <ol>
+   <li>Select the <em>Enable Google APIs for use in your apps</em> option.</li>
+   <li>In the next screen, click <em>Cloud Messaging for Android</em> under the <em>Mobile APIs</em> section.</li>
+   <li>Click the <em>Enable API</em> button.</li>
+  </ol>
+ </li>
+ <li>Now you need to make a note of your project number and API key because you'll need them later. To find them:
+  <ol>
+   <li><strong>Project number</strong>: click <em>Home</em> on the left; the project number is clearly marked at the top of your project's home page.</li>
+   <li><strong>API key</strong>: click <em>Credentials</em> on the left hand menu; the API key can be found on that screen.</li>
+  </ol>
+ </li>
+</ol>
+
+<h3 id="manifest.json">manifest.json</h3>
+
+<p>You need to include a Google app-style <code>manifest.json</code> file in your app, which references the project number you made a note of earlier in the <code>gcm_sender_id</code> parameter. Here is our simple example <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/manifest.json">manifest.json</a>:</p>
+
+<pre class="brush: js">{
+  "name": "Push Demo",
+  "short_name": "Push Demo",
+  "icons": [{
+        "src": "push-icon.png",
+        "sizes": "111x111",
+        "type": "image/png"
+      }],
+  "start_url": "/index.html",
+  "display": "standalone",
+  "gcm_sender_id": "224273183921"
+}</pre>
+
+<p>You also need to reference your manifest using a {{HTMLElement("link")}} element in your HTML:</p>
+
+<pre class="brush: html">&lt;link rel="manifest" href="manifest.json"&gt;</pre>
+
+<h3 id="userVisibleOnly">userVisibleOnly</h3>
+
+<p>Chrome requires you to set the <a href="/en-US/docs/Web/API/PushManager/subscribe#Parameters"><code>userVisibleOnly</code> parameter</a> to <code>true</code> when subscribing to the push service, which indicates that we are promising to show a notification whenever a push is received. This can be <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js#L127">seen in action in our <code>subscribe()</code> function</a>.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Push_API">Push API</a></li>
+ <li><a href="/en-US/docs/Web/API/Service_Worker_API">Service Worker API</a></li>
+</ul>
+
+<div class="note">
+<p><strong>Note</strong>: Some of the client-side code in our Push demo is heavily influenced by Matt Gaunt's excellent examples in <a href="http://updates.html5rocks.com/2015/03/push-notificatons-on-the-open-web">Push Notifications on the Open Web</a>. Thanks for the awesome work, Matt!</p>
+</div>
diff --git a/files/es/conflicting/web/api/url/index.html b/files/es/conflicting/web/api/url/index.html
new file mode 100644
index 0000000000..61ab76466d
--- /dev/null
+++ b/files/es/conflicting/web/api/url/index.html
@@ -0,0 +1,103 @@
+---
+title: Window.URL
+slug: conflicting/Web/API/URL
+tags:
+  - API
+  - DOM
+  - Propiedad
+  - Referencia
+  - Referência DOM
+  - WebAPI
+translation_of: Web/API/URL
+translation_of_original: Web/API/Window/URL
+original_slug: Web/API/Window/URL
+---
+<p>{{ApiRef("Window")}}{{SeeCompatTable}}</p>
+
+<p>La propiedad <strong><code>Window.URL</code></strong> devuelve un objeto que proporciona métodos estáticos usados para crear y gestionar objetos de URLs. Además puede ser llamado como un constructor para construir objetos {{domxref("URL")}}.</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p>Llamando a un método estático:</p>
+
+<pre class="syntaxbox"><code><var>img</var>.src = URL.{{domxref("URL.createObjectURL", "createObjectURL")}}(<var>blob</var>);</code></pre>
+
+<p>Construyendo un nuevo objeto:</p>
+
+<pre class="syntaxbox"><code>var <var>url</var> = new {{domxref("URL.URL", "URL")}}("../cats/", "https://www.example.com/dogs/");</code></pre>
+
+<h2 id="Especificación">Especificación</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('URL', '#dom-url', 'URL')}}</td>
+   <td>{{Spec2('URL')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>8.0<sup>[2]</sup></td>
+   <td>{{CompatGeckoDesktop("2.0")}}<sup>[1]</sup><br>
+    {{CompatGeckoDesktop("19.0")}}</td>
+   <td>10.0</td>
+   <td>15.0<sup>[2]</sup></td>
+   <td>6.0<sup>[2]</sup><br>
+    7.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}<sup>[2]</sup></td>
+   <td>{{CompatGeckoMobile("14.0")}}<sup>[1]</sup><br>
+    {{CompatGeckoMobile("19.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>15.0<sup>[2]</sup></td>
+   <td>6.0<sup>[2]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Desde Gecko 2 (Firefox 4) hasta Gecko 18 incluidos, Gecko devuelve un objeto con el tipo interno no estandar <code>nsIDOMMozURLProperty</code>. En la práctica, esto no hace ninguna diferencia.</p>
+
+<p>[2] Implementado bajo el nombre no estandar <code>webkitURL</code>.</p>
diff --git a/files/es/conflicting/web/api/web_storage_api/index.html b/files/es/conflicting/web/api/web_storage_api/index.html
new file mode 100644
index 0000000000..551f98f92d
--- /dev/null
+++ b/files/es/conflicting/web/api/web_storage_api/index.html
@@ -0,0 +1,304 @@
+---
+title: Almacenamiento
+slug: conflicting/Web/API/Web_Storage_API
+tags:
+  - DOM
+  - JavaScript
+  - Referencia_DOM_de_Gecko
+  - Todas_las_Categorías
+  - para_revisar
+translation_of: Web/API/Web_Storage_API
+translation_of_original: Web/Guide/API/DOM/Storage
+original_slug: DOM/Almacenamiento
+---
+<p>{{ ApiRef() }}</p>
+<h3 id="Introducci.C3.B3n" name="Introducci.C3.B3n">Introducción</h3>
+<p>El almacenamiento DOM (DOM Storage) es el nombre dado al conjunto de <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#storage">características relacionadas con el almacenamiento</a> introducidas en la especificación de <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">aplicaciones web 1.0</a> y ahora detalladas por separado en su propia especificación <a class="external" href="http://dev.w3.org/html5/webstorage/" rel="external nofollow" title="http://dev.w3.org/html5/webstorage/">W3C Web Storage</a>. El almacenamiento DOM está diseñado para facilitar una forma amplia, segura y sencilla para almacenar información alternativa a las cookies. Fue introducido por primera vez en <a href="/es/Firefox_2_para_desarrolladores" title="es/Firefox_2_para_desarrolladores">Firefox 2</a> y <a class="external" href="http://developer.apple.com/safari/library/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Name-ValueStorage/Name-ValueStorage.html" rel="external nofollow" title="http://developer.apple.com/safari/library/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Name-ValueStorage/Name-ValueStorage.html">Safari 4</a> .</p>
+<div class="note">
+ <strong>Nota:</strong> el almacenamiento DOM no es lo mismo que <a href="/es/Almacenamiento" title="es/Almacenamiento">mozStorage</a> (las interfaces XPCOM de Mozilla para SQLite) o la <a href="/es/API_para_guardar_sesiones" title="es/API_para_guardar_sesiones">API para guardar sesiones</a> (una utilidad de almacenamiento <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> usada por extensiones).</div>
+<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
+<p>El mecanismo de almacenamiento DOM es el medio a través del cual pares de clave/valor pueden ser almacenadas de forma segura para ser recuperadas y utilizadas más adelante. La meta de este añadido es suministrar un método exhaustivo a través del cual puedan construirse aplicaciones interactivas (incluyendo características avanzadas tales como ser capaces de trabajar "sin conexión" durante largos períodos de tiempo).</p>
+<p>Actualmente los navegadores basados en Mozilla, Internet Explorer 8+ y Safari 4 y Chrome proporcionan una implementación funcional de la especificación del almacenamiento DOM. Sin embargo, las versiones anteriores a Internet Explorer 8 poseen una característica similar llamada "<a class="external" href="http://msdn.microsoft.com/workshop/author/behaviors/reference/behaviors/userdata.asp">userData behavior</a>" que permite conservar datos entre múltiples sesiones.</p>
+<p>El almacenamiento DOM es útil ya que ningún navegador dispone de buenos métodos para conservar cantidades razonables de datos durante un periodo de tiempo. Las <a class="external" href="http://en.wikipedia.org/wiki/HTTP_cookie">cookies de los navegadores</a> tienen una capacidad limitada y no implementan una forma de organizar datos persistentes y otros métodos (tales como <a class="external" href="http://www.macromedia.com/support/documentation/en/flashplayer/help/help02.html">almacenamiento local de Flash</a>) necesitan un plugin externo.</p>
+<p>Una de las primeras aplicaciones hechas públicas que hace uso de la nueva funcionalidad de almacenamiento DOM (además del userData Behavior de Internet Explorer) fue <a class="external" href="http://aaronboodman.com/halfnote/">halfnote</a> (una aplicación para tomar notas) escrita por <a class="external" href="http://aaronboodman.com/">Aaron Boodman</a>. En su aplicación, Aaron enviaba notas hacia el servidor (cuando la conexión a Internet estaba disponible) y simultáneamente las guardaba en local. Esto permitía al usuario escribir notas de modo seguro incluso cuando no disponía de conexión a Internet.</p>
+<p>Aunque el concepto e implementación presentada en halfnote era en comparación simple, su creación mostró las posibilidades de esta nueva generación de aplicaciones web utilizables tanto con conexión como sin ella.</p>
+<h3 id="Referencias" name="Referencias">Referencia</h3>
+<p>Los siguientes objetos globales existen como propiedades de cada <a href="/es/DOM/window" title="es/DOM/window">objeto <code>window</code></a>. Esto significa que se puede acceder a ellas como <code>sessionStorage</code> o <code>window.sessionStorage</code> (esto es importante ya que se puede usar IFrames para almacenar o acceder a datos adicionales, más allá de lo que está inmediatamente incluido en la página).</p>
+<h4 id="sessionStorage" name="sessionStorage"><code>Storage</code></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-1"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este es un constructor ( <code>Storage</code> ) para todos los objetos de almacenamiento ( <code>sessionStorage</code> y <code>globalStorage[location.hostname]).</code></span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al hacer <code>Storage.prototype.removeKey = function(key){ this.removeItem(this.key(key)) }</code> podrías usar luego como atajo a la función <code>removeItem("key")</code> la forma <code>localStorage.removeKey and sessionStorage.removeKey</code>.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los elementos <code>globalStorage</code> no son de tipo <code>Storage</code> , sino <code>StorageObsolete</code> .</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><code>Storage</code> se define por la <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fdev.w3.org%2Fhtml5%2Fwebstorage%2F%23storage-0&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNGvCDT1Wf0oh4zXJCIScYRZKlrPAA">interfaz de almacenamiento</a> WhatWG de la siguiente forma:</span></span></p>
+<pre class="eval"><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">interface Storage {</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">readonly attribute unsigned long <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-length" title="http://dev.w3.org/html5/webstorage/#dom-storage-length">length</a>;</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">[IndexGetter]<a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-key" title="http://dev.w3.org/html5/webstorage/#dom-storage-key">key</a> DOMString (in unsigned long index);</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">[NameGetter] DOMString <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-getitem" title="http://dev.w3.org/html5/webstorage/#dom-storage-getitem">GetItem</a> (in DOMString key);</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">[NameSetter] void <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-setitem" title="http://dev.w3.org/html5/webstorage/#dom-storage-setitem">setItem</a> (in DOMString key, in DOMString data);</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">[NameDeleter] void <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-removeitem" title="http://dev.w3.org/html5/webstorage/#dom-storage-removeitem">removeItem</a> (in DOMString key);</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">void <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-clear" title="http://dev.w3.org/html5/webstorage/#dom-storage-clear">clear</a>();</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">};
+</span></span></pre>
+<p> </p>
+<div class="note">
+ <strong>Nota: </strong>aunque los valores pueden establecerse y leerse a través del método de acceso de la propiedad de JavaScript estándar, se recomienda el uso de los métodos getItem y setItem.</div>
+<div class="note">
+ <strong>Nota:</strong> ten en cuenta que todo lo que guardes en cualquiera de los almacenamientos (<em>storages) </em>descritos en esta página se convierte en una cadena a través de su método <code>.toString </code>almacenado anteriormente, por lo que al intentar almacenar un objeto común, se almacenará una cadena <code>"[object Object]" </code>en lugar del objeto o su representación JSON. Usar los métodos de serialización y análisis de JSON nativos que proporciona el navegador es una buena forma bastante común de almacenar objetos en formato cadena.</div>
+<h4 id="sessionStorage" name="sessionStorage"><code>sessionStorage</code></h4>
+<p>Este es un objeto global (<code>sessionStorage</code>) que mantiene un área de almacenamiento que está disponible durante la sesión de página. Una sesión de página existe mientras el navegador esté abierto y sobrevive a recargas o restauraciones de páginas. Abrir una página en una nueva pestaña o en una ventana provoca que se cree una nueva sesión.</p>
+<pre class="brush: js">// Guardar datos en el almacén de la sesión actual
+sessionStorage.setItem("username", "John");
+
+// Acceder a algunos datos guardados
+alert( "username = " + sessionStorage.getItem("username"));
+</pre>
+<p>El objeto <code>sessionStorage</code> es más usado para manejar datos temporales que deberían ser guardados y recuperados si el navegador es recargado accidentalmente.</p>
+<p>{{ fx_minversion_note("3.5", "Antes de Firefox 3.5, los datos de sessionStorage no se restablecían automáticamente después de recuperarse de un fallo del navegador. A partir de Firefox 3.5, funciona según la especificación.") }}</p>
+<p><strong>Ejemplos:</strong></p>
+<p>Autoguardado de los contenidos de un campo de texto y, si el navegador se recarga accidentalmente, restauración del contenido del campo de texto para evitar la pérdida de datos.</p>
+<pre class="brush: js"> // Obtener el campo de texto al que vamos a seguir la pista
+ var field = document.getElementById("field");
+
+ // Ver si se tiene un valor de autoguardado
+ // (esto sólo sucede si la página es actualizada accidentalmente)
+ if ( sessionStorage.getItem("autosave")) {
+    // Restaurar los contenidos del campo de texto
+    field.value = sessionStorage.getItem("autosave");
+ }
+
+ // Comprobar los contenidos del campo de texto cada segundo
+ setInterval(function(){
+    // Y guardar los resultados en el objeto de almacenamiento de sesión
+    sessionStorage.setItem("autosave", field.value);
+ }, 1000);
+</pre>
+<p><strong>Más información:</strong></p>
+<ul>
+ <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#sessionstorage" title="http://www.whatwg.org/specs/web-apps/current-work/#sessionstorage">Especificación sessionStorage</a></li>
+</ul>
+<h4 id="globalStorage" name="globalStorage"><code>globalStorage</code></h4>
+<p> </p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ Non-standard_header() }} Este es un objeto global ( <code>globalStorage</code> ) que mantiene múltiples áreas de almacenamiento privado que se pueden utilizar para almacenar los datos durante un largo período de tiempo (por ejemplo, en varias páginas y las sesiones del navegador) .</span></span></p>
+<div class="warning">
+ <span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Nota: <code>globalStorage</code> no es de tipo <code>Storage</code>, sino un objeto de tipo <code>StorageList</code> que contiene a su vez elementos <code>StorageObsolete</code>.</span></span></div>
+<pre class="brush: js">// Guardar datos a los que sólo pueden acceder scripts del dominio mozilla.org
+globalStorage['mozilla.org'].setItem("snippet", "&lt;b&gt;Hola&lt;/b&gt;, ¿cómo estás?");
+</pre>
+<p>Específicamente, el objeto <code>globalStorage</code> proporciona acceso a un número de diferentes objetos de almacenamiento en los que los datos pueden ser guardados. Por ejemplo, si se construye una página web que usa <code>globalStorage</code> en este dominio (developer.mozilla.org) se dispondría de los siguientes objetos de almacenamiento:</p>
+<ul>
+ <li><code>globalStorage['developer.mozilla.org']</code>- Todas las páginas web dentro del subdominio developer.mozilla.org podrán leer de, y escribir datos en, este objeto de almacenamiento.</li>
+</ul>
+<p>{{ Fx_minversion_note(3, "Firefox 2 permitía el acceso a objetos de almacenamiento superiores en la jerarquía del dominio al documento actual, pero esto ya no se permite en Firefox 3 por razones de seguridad. Además, se ha eliminado esta adición propuesta a HTML 5 de la especificación en favor de <code>localStorage</code>, que se implementa a partir de Firefox 3.5.") }}</p>
+<p><strong>Ejemplos:</strong></p>
+<p>Todos estos ejemplos necesitan que haya un script insertado (con el siguiente código) en cada página en la que se quiera ver el resultado.</p>
+<p>Recordar el nombre un usuario para un subdominio en particular que está siendo visitado:</p>
+<pre class="brush: js"> globalStorage['developer.mozilla.org'].setItem("username", "John");
+</pre>
+<p>Seguir la pista al número de veces que un usuario visita todas las páginas de un dominio:</p>
+<pre class="brush: js"> // parseInt must be used since all data is stored as a string
+ globalStorage['mozilla.org'].setItem("visits", parseInt(globalStorage['mozilla.org'].getItem("visits") || 0 ) + 1);
+</pre>
+<p> </p>
+<h4 class="editable" id="localStorage"><span><code>localStorage</code></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"><code>localStorage</code> es lo mismo que <code>globalStorage[location.hostname]</code>, excepto que está dentro del ámbito de un origen HTML5 (esquema + nombre de servidor + puerto no estándar), y que <code>localStorage</code> es un elemento de tipo <code>Storage</code> a diferencia de <code>globalStorage[location.hostname]</code>, que es de tipo <code>StorageObsolete</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Por ejemplo, <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fexample.com%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHbmhS24rOBWpzaMcUapS5k_3_-JQ" rel="external nofollow">http://example.com</a> no es capaz de acceder al mismo objeto <code>localStorage</code> que <a class="link-https" href="http://www.google.com/url?q=https%3A%2F%2Fexample.com%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFdUqh3fgxBA_n6BEUpV3eYKVuHXA" rel="external nofollow">https://example.com</a> pero pueden acceder al mismo objeto <code>globalStorage</code>. <code>localStorage</code> es una interfaz estándar, mientras que <code>globalStorage</code> no es estándar. <code>localStorage</code> fue introducida en Firefox 3.5.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Ten en cuenta que establecer una propiedad en <code>globalStorage[location.hostname]</code> <strong>no</strong> la establece en <code>localStorage</code> y extender <code>Storage.prototype</code> no afecta a los elementos <code>globalStorage</code>. Esto sólo se hace extendiendo <code>StorageObsolete.prototype</code>.</span></span></p>
+<div class="note">
+ <span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"><strong>Nota:</strong> cuando el navegador entra en modo de navegación privada, se crea una nueva base de datos temporal para almacenar los datos locales de almacenamiento; </span></span><span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">esta base de datos se vacía cuando se sale del modo de navegación privada.</span></span></div>
+<div id="section_8">
+ <h5 id="Compatibilidad">Compatibilidad</h5>
+ <p>Los objetos <code>Storage</code> se han agregado recientemente al estándar, por lo que puede ocurrir que no estén presentes en todos los navegadores. Puedes solucionar esto insertando uno de los siguientes códigos al principio de tus scripts, lo que permitirá el uso del objeto <code>localStorage</code> object en aquellas implementaciones que de forma nativa no lo admitan.</p>
+ <p>Este algoritmo es una imitación exacta del objeto <code>localStorage</code>, pero haciendo uso de cookies.</p>
+ <pre class="brush: js">if (!window.localStorage) {
+  Object.defineProperty(window, "localStorage", new (function () {
+    var aKeys = [], oStorage = {};
+    Object.defineProperty(oStorage, "getItem", {
+      value: function (sKey) { return sKey ? this[sKey] : null; },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "key", {
+      value: function (nKeyId) { return aKeys[nKeyId]; },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "setItem", {
+      value: function (sKey, sValue) {
+        if(!sKey) { return; }
+        document.cookie = escape(sKey) + "=" + escape(sValue) + "; path=/";
+      },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "length", {
+      get: function () { return aKeys.length; },
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "removeItem", {
+      value: function (sKey) {
+        if(!sKey) { return; }
+        var sExpDate = new Date();
+        sExpDate.setDate(sExpDate.getDate() - 1);
+        document.cookie = escape(sKey) + "=; expires=" + sExpDate.toGMTString() + "; path=/";
+      },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    this.get = function () {
+      var iThisIndx;
+      for (var sKey in oStorage) {
+        iThisIndx = aKeys.indexOf(sKey);
+        if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); }
+        else { aKeys.splice(iThisIndx, 1); }
+        delete oStorage[sKey];
+      }
+      for (aKeys; aKeys.length &gt; 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); }
+      for (var iCouple, iKey, iCouplId = 0, aCouples = document.cookie.split(/\s*;\s*/); iCouplId &lt; aCouples.length; iCouplId++) {
+        iCouple = aCouples[iCouplId].split(/\s*=\s*/);
+        if (iCouple.length &gt; 1) {
+          oStorage[iKey = unescape(iCouple[0])] = unescape(iCouple[1]);
+          aKeys.push(iKey);
+        }
+      }
+      return oStorage;
+    };
+    this.configurable = false;
+    this.enumerable = true;
+  })());
+}
+</pre>
+ <div class="note">
+  <strong>Nota:</strong> el tamaño máximo de datos que pueden guardarse está bastante restringido por el uso de cookies. Con este algoritmo, usa las funciones <code>localStorage.setItem()</code> y <code>localStorage.removeItem()</code> para agregar, cambiar o eliminar una clave. Usar los métodos <code>localStorage.tuClave = tuValor;</code> y <code>delete localStorage.tuClave;</code> para establecer o eliminar una clave <strong>no es muy seguro con este código</strong>. También puedes cambiar su nombre y usarlo para administrar las cookies de un documento independientemente del objeto localStorage.</div>
+ <p>Aquí tienes otra imitación, menos exacta, del objeto <code>localStorage</code>. Es mucho más simple  que el anterior, pero es compatible con los navegadores antiguos como Internet Explorer &lt; 8. También usa cookies.</p>
+ <pre class="brush: js">if (!window.localStorage) {
+  window.localStorage = {
+    getItem: function (sKey) {
+      if (!sKey || !this.hasOwnProperty(sKey)) { return null; }
+      return unescape(document.cookie.replace(new RegExp("(?:^|.*;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=\\s*((?:[^;](?!;))*[^;]?).*"), "$1"));
+    },
+    key: function (nKeyId) { return unescape(document.cookie.replace(/\s*\=(?:.(?!;))*$/, "").split(/\s*\=(?:[^;](?!;))*[^;]?;\s*/)[nKeyId]); },
+    setItem: function (sKey, sValue) {
+      if(!sKey) { return; }
+      document.cookie = escape(sKey) + "=" + escape(sValue) + "; path=/";
+      this.length = document.cookie.match(/\=/g).length;
+    },
+    length: 0,
+    removeItem: function (sKey) {
+      if (!sKey || !this.hasOwnProperty(sKey)) { return; }
+      var sExpDate = new Date();
+      sExpDate.setDate(sExpDate.getDate() - 1);
+      document.cookie = escape(sKey) + "=; expires=" + sExpDate.toGMTString() + "; path=/";
+      this.length--;
+    },
+    hasOwnProperty: function (sKey) { return (new RegExp("(?:^|;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=")).test(document.cookie); }
+  };
+  window.localStorage.length = (document.cookie.match(/\=/g) || window.localStorage).length;
+}
+</pre>
+ <div class="note">
+  <strong>Nota:</strong> el tamaño máximo de datos que pueden guardarse está bastante restringido por el uso de cookies. Con este algoritmo, usa las funciones <code>localStorage.getItem()</code>, <code>localStorage.setItem()</code> y <code>localStorage.removeItem()</code> para agregar, cambiar o eliminar una clave. Usar los métodos <code>localStorage.tuClave</code> para obtener, establecer o eliminar una clave <strong>no es muy seguro con este código</strong>. También puedes cambiar su nombre y usarlo para administrar las cookies de un documento independientemente del objeto localStorage.</div>
+ <h3 class="editable" id="Lugar_de_almacenamiento_y_borrado_de_datos"><span><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Lugar de almacenamiento y borrado de datos</span></span></span></h3>
+ <p><span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Los datos de almacenamiento DOM se guardan en el <a class="external" href="http://kb.mozillazine.org/Webappsstore.sqlite" rel="external nofollow" title="http://kb.mozillazine.org/Webappsstore.sqlite">archivo webappsstore.sqlite</a> de la carpeta del perfil.</span></span></p>
+ <ul>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Almacenamiento DOM se puede borrar a través de "Herramientas -&gt; Borrar Historial reciente -&gt; Cookies" cuando el rango de tiempo es "Todo" (a través de nsICookieManager:: removeAll)</span></span>
+   <ul>
+    <li><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Pero no cuando se especifica otro intervalo de tiempo: ( <a class="link-https" href="http://www.google.com/url?q=https%3A%2F%2Fbugzilla.mozilla.org%2Fshow_bug.cgi%3Fid%3D527667&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNEMF8WI1pO7c8uQnfOUS0KITnlz5Q" rel="external nofollow">bug 527667</a> )</span></span></li>
+    <li><span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">No aparece en Herramientas -&gt; Opciones -&gt; Privacidad -&gt; Eliminar cookies individuales ( <a class="link-https" href="http://www.google.com/url?q=https%3A%2F%2Fbugzilla.mozilla.org%2Fshow_bug.cgi%3Fid%3D506692&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNH3d0Etkixvdpdvd_u6gywZoEmsMQ" rel="external nofollow">bug 506692</a> )</span></span></li>
+   </ul>
+  </li>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">El almacenamiento DOM <strong>no</strong> se elimina a través de Herramientas -&gt; Opciones -&gt; Avanzado -&gt; Red -&gt; Datos en modo sin conexión -&gt; Limpiar ahora.</span></span></li>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">No aparece en la lista "Herramientas -&gt; Opciones -&gt; Avanzado -&gt; Red -&gt; Datos en modo sin conexión", a menos que el sitio también utilice la caché sin conexión.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si el sitio aparece en esa lista, los datos de almacenamiento DOM se eliminan junto con la <a href="/en/Using_Application_Cache" rel="internal" title="https://developer.mozilla.org/en/Using_Application_Cache">memoria caché sin conexión</a> cuando se hace clic en el botón Eliminar.</span></span></li>
+ </ul>
+ <p><span class="goog-gtc-unit" id="goog-gtc-unit-73"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Consulta también <a href="/en/Using_Application_Cache#Storage_location_and_clearing_the_offline_cache" rel="internal" title="https://developer.mozilla.org/en/Using_Application_Cache#Storage_location_and_clearing_the_offline_cache">borrar la caché de recursos en modo sin conexión</a> .</span></span></p>
+</div>
+<h3 id="M.C3.A1s_informaci.C3.B3n" name="M.C3.A1s_informaci.C3.B3n"><span class="goog-gtc-unit" id="goog-gtc-unit-74"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Más información</span></span></h3>
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-75"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"><a class="external" href="http://www.w3.org/TR/webstorage/" rel="external nofollow" title="http://www.w3.org/TR/webstorage/">Almacenamiento web</a> (W3C Web Grupo de trabajo sobre aplicaciones web)</span></span></li>
+ <li><a class="external" href="http://kb.mozillazine.org/Dom.storage.enabled" rel="external nofollow" title="http://kb.mozillazine.org/Dom.storage.enabled"><span class="goog-gtc-unit" id="goog-gtc-unit-76"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Activar / Desactivar almacenamiento DOM en Firefox o SeaMonkey</span></span></a></li>
+</ul>
+<h3 id="Ejemplos" name="Ejemplos"><span class="goog-gtc-unit" id="goog-gtc-unit-77"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Ejemplos</span></span></h3>
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-78"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://www.diveintojavascript.com/tutorials/web-storage-tutorial-creating-an-address-book-application" rel="external nofollow" title="http://www.diveintojavascript.com/tutorials/web-storage-tutorial-creating-an-address-book-application">Tutorial de almacenamiento web JavaScript: cómo crear una aplicación de la libreta de direcciones</a>. Práctico tutorial que describe cómo utilizar la API de almacenamiento web mediante la creación de una aplicación sencilla de la libreta de direcciones.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-79"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://hacks.mozilla.org/2010/01/offline-web-applications/" rel="external nofollow" title="http://hacks.mozilla.org/2010/01/offline-web-applications/">Aplicaciones web en modo desconexión</a> en hacks.mozilla.org: muestra una demo de la aplicación en modo desconexión y explica cómo funciona.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-80"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://noteboard.eligrey.com/" rel="external nofollow" title="http://noteboard.eligrey.com/">Noteboard</a>: aplicación para escritura de notas que almacena todos los datos en local.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-81"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://github.com/eligrey/jData-host" rel="external nofollow" title="http://github.com/eligrey/jData-host">JData</a>: una interfaz de objetos compartidos localStorage a la que cualquier sitio web en Internet puede acceder y que funciona en Firefox 3 +, Webkit 3.1.2 + versiones estables ("nightlies) y IE8.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-82"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Piensa en ella como pseudo-globalStorage [""], pero el acceso de escritura necesita la confirmación del usuario.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-83"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://codebase.es/test/webstorage.html" rel="external nofollow" title="http://codebase.es/test/webstorage.html">Ejemplo de localStorage en HTML 5 </a>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-84"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Un ejemplo de localStorage muy sencillo y fácil de entender.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-85"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Guarda y recupera los textos y muestra una lista de elementos guardados.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Probado en Firefox 3 o superior.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-87"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://upload.jonathanwilsson.com/html5/sessionstorage.php" rel="external nofollow" title="http://upload.jonathanwilsson.com/html5/sessionstorage.php">Almacenamiento de sesión en HTML5</a>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-88"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Un ejemplo muy simple de almacenamiento de sesión.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-89"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">También incluye un ejemplo en almacenamiento local.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-90"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Probado en Firefox 3.6 o superior.</span></span></li>
+</ul>
+<h3 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h3>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Característica</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari (WebKit)</th>
+   </tr>
+   <tr>
+    <td>localStorage</td>
+    <td>4</td>
+    <td>3.5</td>
+    <td>8</td>
+    <td>10.50</td>
+    <td>4</td>
+   </tr>
+   <tr>
+    <td>sessionStorage</td>
+    <td>5</td>
+    <td>2</td>
+    <td>8</td>
+    <td>10.50</td>
+    <td>4</td>
+   </tr>
+   <tr>
+    <td>globalStorage</td>
+    <td>{{ CompatNo() }}</td>
+    <td>2</td>
+    <td>{{ CompatNo() }}</td>
+    <td>{{ CompatNo() }}</td>
+    <td>{{ CompatNo() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Característica</th>
+    <th>Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Phone</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Compatibilidad básica</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+    <td>{{ CompatUnknown() }}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<p>Todos los navegadores tienen diferentes niveles de capacidad tanto para local- como para sessionStorage. Aquí puedes ver un<a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/"> resumen detallado de todas las capacidades de almacenamiento de los distintos navegadores</a>.</p>
+<h3 id="Contenido_relacionado" name="Contenido_relacionado"><span class="goog-gtc-unit" id="goog-gtc-unit-91"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Contenido relacionado</span></span></h3>
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-92"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style=""><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fen.wikipedia.org%2Fwiki%2FHTTP_cookie&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFACogcWPyUjw22LvVhbEL5L07xEA">Cookies HTTP</a> ( <a><code>document.cookie</code></a> )</span></span></li>
+ <li><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.macromedia.com%2Fsupport%2Fdocumentation%2Fen%2Fflashplayer%2Fhelp%2Fhelp02.html&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFrtvzw9ttNpzuCXBX_Hlq3o20cYA"><span class="goog-gtc-unit" id="goog-gtc-unit-93"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Almacenamiento local de Flash</span></span></a></li>
+ <li><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fmsdn2.microsoft.com%2Fen-us%2Flibrary%2Fms531424.aspx&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFaRBrB2GGggww2L9dRDlUWDBm9IQ"><span class="goog-gtc-unit" id="goog-gtc-unit-94"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Comportamiento userData en Internet Explorer </span></span></a></li>
+ <li><a><span class="goog-gtc-unit" id="goog-gtc-unit-95"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">nsIDOMStorageEventObsolete</span></span></a></li>
+ <li><a><span class="goog-gtc-unit" id="goog-gtc-unit-96"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">StorageEvent</span></span></a></li>
+</ul>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-97"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">{{ HTML5ArticleTOC () }}</span></span></p>
+<p> </p>
+<p> </p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-98"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ languages( { "en": "en/DOM/Storage", "fr": "fr/DOM/Storage", "ja": "ja/DOM/Storage", "pl": "pl/DOM/Storage", "zh-cn": "cn/DOM/Storage" } ) }}</span></span></p>
diff --git a/files/es/conflicting/web/api/webrtc_api/index.html b/files/es/conflicting/web/api/webrtc_api/index.html
new file mode 100644
index 0000000000..41554256cd
--- /dev/null
+++ b/files/es/conflicting/web/api/webrtc_api/index.html
@@ -0,0 +1,79 @@
+---
+title: WebRTC
+slug: conflicting/Web/API/WebRTC_API
+translation_of: Web/API/WebRTC_API
+translation_of_original: WebRTC
+original_slug: WebRTC
+---
+<p>El RTC en WebRTC significa <em>Real-Time Communications</em>, o comunicaciones en tiempo real, en español. WebRTC es una tecnología que permite compartir en tiempo real datos de audio y video entre navegadores (pares). Como conjunto de estándares, WebRTC provee a cualquier navegador de la capacidad de compartir datos de aplicación y realizar teleconferencias de par a par, sin la necesidad de instalar complementos o Software de terceros.</p>
+<p>Los componentes de WebRTC son utilizados a través de interfaces avanzadaz de programación en JavaScript (APIs). Actualmente se están desarrollando la API de streaming a través de la red, que representa los flujos de datos de audio y vídeo, y la API PeerConnection, que permite a dos o más usuarios realizar conexiones navegador a navegador. Igualmente en desarrollo se encuentra la API DataChannel, que permite la transmisión de otros tipos de datos para juegos en tiempo real, mensajería instantánea, transferencia de archivos, y otros.</p>
+<div class="note">
+  <p><strong>Nota:</strong> Parte de este contenido está desactualizado, pero se estará actualizando pronto.</p>
+</div>
+<p>¿Quieres descubrir WebRTC? ¡Mira este <a href="https://mozillaignite.org/resources/labs/future-uses-of-webrtc-video" title="/en-US/docs/https://mozillaignite.org/resources/labs/future-uses-of-webrtc-video">vídeo introductorio!</a></p>
+<table class="topicpage-table">
+  <tbody>
+    <tr>
+      <td>
+        <h2 class="Documentation" id="Documentation" name="Documentation">Documentación sobre WebRTC</h2>
+        <dl>
+          <dt>
+            <a href="/es/docs/WebRTC/Introduction" title="/en-US/docs/WebRTC/Introduction">Introducción a WebRTC</a></dt>
+          <dd>
+            Una guía de introducción sobre qué es WebRTC y cómo funciona.</dd>
+          <dt>
+            <a href="/en-US/docs/WebRTC/Using_the_Network_Stream_API" title="/en-US/docs/WebRTC/Using_the_Network_Stream_API">Using the Network Stream API</a></dt>
+          <dd>
+            Una guía para usar la API Network Stream para transmitir flujos de audio y vídeo.</dd>
+          <dt>
+            <a href="/es/docs/WebRTC/Peer-to-peer_communications_with_WebRTC" title="/en-US/docs/WebRTC/Peer-to-peer_communications_with_WebRTC">Comunicaciones peer-to-peer (P2P) con WebRTC</a></dt>
+          <dd>
+            Como realizar conexiones par a par usando las APIs de WebRTC.</dd>
+          <dt>
+             </dt>
+          <dt>
+            <a href="/es/docs/WebRTC/Taking_webcam_photos" title="taking webcam photos">Capturar fotografías con la cámara web</a></dt>
+          <dd>
+            Como capturar imágenes desde un Webcam con WebRTC.</dd>
+          <dt>
+            <a href="/es/docs/WebRTC/MediaStream_API" title="/en-US/docs/WebRTC/MediaStream_API">API de MediaStream</a></dt>
+          <dd>
+            Descripción de la API que soporta la creación y manipulación de flujos de medios.</dd>
+          <dt>
+            <a href="/es/docs/Web/API/Navigator.getUserMedia" title="/en-US/docs/">getUserMedia()</a></dt>
+          <dd>
+            La función del navegador que permite el acceso a dispositivos de medios del sistema.</dd>
+          <dd>
+             </dd>
+        </dl>
+        <p><span class="alllinks"><a href="/en-US/docs/tag/WebRTC" title="/en-US/docs/tag/B2G">Ver todo...</a></span></p>
+        <h2 class="Tools" id="Ejemplos">Ejemplos</h2>
+        <ul>
+          <li><a href="http://idevelop.github.com/ascii-camera/" title="http://idevelop.github.com/ascii-camera/">ASCII camera</a></li>
+        </ul>
+      </td>
+      <td>
+        <h2 class="Community" id="Community" name="Community">Obteniendo ayuda de la comunidad</h2>
+        <p>Cuando desarrolles sitios y aplicaciones que tomen ventaja de las tecnologías de WebRTC, puede ser muy útil ponerse en contacto con otras personas haciendo lo mismo.</p>
+        <ul>
+          <li>Consulta el tópico <em>Media</em> en el foro: {{ DiscussionList("dev-media", "mozilla.dev.media") }}</li>
+        </ul>
+        <ul>
+          <li>Pregunta en el canal IRC de Media de Mozilla: <a class="link-irc" href="irc://irc.mozilla.org/media" title="irc://irc.mozilla.org/b2g">#media</a></li>
+        </ul>
+        <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">No olvides la <em>netiqueta</em>...</a></span></p>
+        <br>
+        <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Tópicos relacionados</h2>
+        <ul>
+          <li><a href="/es/docs/Usando_audio_y_video_con_HTML5" title="/es/docs/Usando_audio_y_video_con_HTML5">Usando audio y video con HTML5</a></li>
+        </ul>
+        <h2 class="Tools" id="Recursos">Recursos</h2>
+        <ul>
+          <li><a href="http://www.w3.org/TR/webrtc/" title="WebRTC specification">WebRTC Specification</a></li>
+          <li><a href="http://mozilla.github.io/webrtc-landing/" title="http://mozilla.github.io/webrtc-landing/">WebRTC Test Landing Page</a></li>
+        </ul>
+      </td>
+    </tr>
+  </tbody>
+</table>
+<p> </p>
diff --git a/files/es/conflicting/web/api/websockets_api/index.html b/files/es/conflicting/web/api/websockets_api/index.html
new file mode 100644
index 0000000000..6250ba53c0
--- /dev/null
+++ b/files/es/conflicting/web/api/websockets_api/index.html
@@ -0,0 +1,38 @@
+---
+title: WebSockets
+slug: conflicting/Web/API/WebSockets_API
+tags:
+  - WebSockets
+  - para_revisar
+original_slug: WebSockets
+---
+<p><span><span style="">{{ SeeCompatTable () }}</span></span></p>
+<p><span><span style="">WebSockets es una tecnología que hace posible abrir una sesión de comunicación interactiva entre el navegador del usuario y un servidor.</span></span> <span><span style="">Con esta API, puedes enviar mensajes a un servidor y recibir respuestas por eventos sin tener que consultar al servidor.</span></span></p>
+<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Documentation"><a><span><span style="">Documentación</span></span></a></h4> <dl> <dt><a href="/en/WebSockets/Writing_WebSocket_client_applications" title="https://developer.mozilla.org/en/WebSockets/Writing_WebSocket_client_applications"><span><span style="">Cómo escribir aplicaciones para cliente WebSocket</span></span></a></dt> <dd><span><span style="">Una guía tutorial sobre cómo escribir clientes WebSocket para ejecutarse en el navegador.</span></span></dd> <dt><a href="/en/WebSockets/WebSockets_reference" title="https://developer.mozilla.org/en/WebSockets/WebSockets_reference"><span><span style="">Referencia WebSockets</span></span></a></dt> <dd><span><span style="">Una referencia a la API del lado del cliente WebSocket.</span></span></dd> <dt><a href="/en/WebSockets/The_WebSocket_protocol" title="https://developer.mozilla.org/en/WebSockets/The_WebSocket_protocol"><span><span style="">El protocolo WebSocket</span></span></a></dt> <dd><span><span style="">Una referencia al protocolo de WebSocket.</span></span></dd> <dt><a href="/en/WebSockets/Writing_WebSocket_servers" title="https://developer.mozilla.org/en/WebSockets/Writing_WebSocket_servers"><span><span style="">Cómo escribir servidores WebSocket</span></span></a></dt> <dd><span><span style="">Una guía sobre cómo escribir el código del lado del servidor para manejar el protocolo WebSocket.</span></span></dd> </dl> <p><a href="/Special:Tags?tag=WebSockets&amp;language=en" title="https://developer.mozilla.org/Special:Tags?tag=WebSockets&amp;language=en"><span></span></a><a><span><span style="">Ver todas</span></span></a></p> </td> <td> <h4 id="Tools"><span><span style="">Herramientas</span></span></h4> <ul> <li><span><span style=""><a class=" external" href="http://socket.io/" title="http://socket.io/">Socket.</a><a class=" external" href="http://www.google.com/url?q=http%3A%2F%2Fsocket.io&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHh469AGdVlfIU6_sHUVrgvsaDIaQ">IO</a>:</span></span><span><span style="">una potente API multiplataforma de WebSocket para <a class=" external" href="http://nodejs.org/" title="http://nodejs.org/">Node.js</a>.</span></span></li> <li><span><span style=""><a class=" link-https" href="https://github.com/Worlize/WebSocket-Node" title="https://github.com/Worlize/WebSocket-Node">WebSocket-Node</a> : una implementación de la API del servidor WebSocket <a class=" external" href="http://nodejs.org/" title="http://nodejs.org/">Node.js</a> .</span></span></li> </ul> <p> </p> <h4 id="Related_Topics"><span><span style="">Temas relacionados</span></span></h4> <dl> <dd><span><span style=""><a href="/en/AJAX" title="https://developer.mozilla.org/en/AJAX">AJAX</a> , <a href="/en/JavaScript" title="https://developer.mozilla.org/en/JavaScript">JavaScript</a></span></span></dd> </dl> </td> </tr> </tbody>
+</table>
+<h2 id="Consulta_también"><span><span style="">Consulta también</span></span></h2>
+<ul> <li><a class=" external" href="http://dev.w3.org/html5/websockets/" title="http://dev.w3.org/html5/websockets/"><span><span style="">Especificación de la API de WebSocket</span></span></a></li> <li><a href="/en/Server-sent_events" title="https://developer.mozilla.org/en/Server-sent_events"><span><span style="">Eventos enviados por el servidor </span></span></a></li>
+</ul>
+<h2 id="Compatibilidad_de_los_navegadores"><span><span style="">Compatibilidad de los navegadores</span></span></h2>
+<p><span><span style="">{{ CompatibilityTable () }}</span></span></p>
+<div id="compat-desktop">
+<table class="compat-table"> <tbody> <tr> <th><span><span style="">Característica</span></span></th> <th><span><span style="">Chrome</span></span></th> <th><span><span style="">Firefox (Gecko)</span></span></th> <th><span><span style="">Internet Explorer</span></span></th> <th><span><span style="">Opera</span></span></th> <th><span><span style="">Safari</span></span></th> </tr> <tr> <td><span><span style="">Compatibilidad con la versión -76 {{ obsolete_inline () }}</span></span></td> <td><span><span style="">6</span></span></td> <td><span><span style="">{{ CompatGeckoDesktop ("2.0") }}</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td><span><span style="">11.00 (desactivado)</span></span></td> <td><span><span style="">5.0.1</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 7</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td> <p><span><span style="">{{ CompatGeckoDesktop ("6.0") }}</span></span></p> <div class="note"><span><span style="">usa <code>MozWebSocket</code> .</span></span></div> </td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 10</span></span></td> <td><span><span style="">14</span></span></td> <td> <p><span><span style="">{{ CompatGeckoDesktop ("7.0") }}</span></span></p> <div class="note"><span><span style="">usa MozWebSocket .</span></span></div> </td> <td><span><span style="">HTML5 Labs</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> </tr> </tbody>
+</table>
+</div>
+<div id="compat-mobile">
+<table class="compat-table"> <tbody> <tr> <th><span><span style="">Característica</span></span></th> <th><span><span style="">Android</span></span></th> <th><span><span style="">Firefox Mobile (Gecko)</span></span></th> <th><span><span style="">IE Mobile</span></span></th> <th><span><span style="">Opera Mobile</span></span></th> <th><span><span style="">Safari Mobile</span></span></th> </tr> <tr> <td><span><span style="">Compatibilidad con la versión -76 {{ obsolete_inline () }}</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 7</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 8 (borrador 10 de IETF)</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatGeckoMobile ("7.0") }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> </tr> </tbody>
+</table>
+</div>
+<h3 id="Notas_para_Gecko"><span><span style="">Notas para Gecko</span></span></h3>
+<p><span><span style="">El soporte de WebSockets en Firefox sigue de cerca el desarrollo de la especificación WebSocket.</span></span> <span><span style="">Firefox 6 implementa la versión 7 del protocolo subyacente, mientras que Firefox 7 implementa la versión 8 (según lo especificado por el borrador 10 de IETF).</span></span> <span><span style="">Firefox Mobile recibió el soporte de WebSocket en Firefox móvil 7.0.</span></span></p>
+<div class="geckoVersionNote">
+<p><span><span style="">{{ gecko_callout_heading("6.0") }}</span></span></p>
+<p><span><span style="">Antes de Gecko 6.0 {{ geckoRelease ("6,0 ") }}, hubo, incorrectamente, un objeto <code>WebSocket</code> que algunos sitios creyeron que implicaba que los servicios <code>WebSocket</code> no estaban prefijados. Este objeto se ha cambiado a <code>MozWebSocket</code> .</span></span></p>
+</div>
+<div class="geckoVersionNote">
+<p><span><span style="">{{ gecko_callout_heading("7.0") }}</span></span></p>
+<p><span><span style="">A partir de Gecko 7.0 {{ geckoRelease ("7,0 ") }}, la preferencia <code>network.websocket.max-connections</code> se usa para determinar el número máximo de conexiones WebSocket que pueden estar abiertas a la vez.</span></span> <span><span style="">El valor predeterminado es 200.</span></span></p>
+</div>
+<div class="warning"><span><span style="">Advertencia: entre otras cosas, una razón clave por la que WebSockets está desactivado por defecto es el descubrimiento de un <a class=" external" href="http://www.ietf.org/mail-archive/web/hybi/current/msg04744.html" title="http://www.ietf.org/mail-archive/web/hybi/current/msg04744.html">problema de seguridad en el diseño del protocolo</a>.</span></span> <span><span style="">En este momento no se recomienda utilizar WebSockets en las versiones de Firefox en un entorno de producción.</span></span> <span><span style="">Si aun así deseas experimentar con WebSockets, puedes hacerlo abriendo about: config y estableciendo la preferencia network.websocket.enabled en true.</span></span> <span><span style="">También tendrás que establecer la preferencia network.websocket.override-security-block en true para permitir la inicialización de una conexión WebSocket.</span></span></div>
+<p><span><span style="">{{ HTML5ArticleTOC () }}</span></span></p>
+<p><span><span style="">{{ languages ( {"en": "en/WebSockets", "zh-tw": "zh_tw/WebSockets"} ) }}</span></span></p>
diff --git a/files/es/conflicting/web/api/window/localstorage/index.html b/files/es/conflicting/web/api/window/localstorage/index.html
new file mode 100644
index 0000000000..d4307e30a4
--- /dev/null
+++ b/files/es/conflicting/web/api/window/localstorage/index.html
@@ -0,0 +1,137 @@
+---
+title: LocalStorage
+slug: conflicting/Web/API/Window/localStorage
+tags:
+  - Almacenamiento en Navegador
+  - Almacenamiento local
+translation_of: Web/API/Window/localStorage
+translation_of_original: Web/API/Web_Storage_API/Local_storage
+original_slug: Web/API/Storage/LocalStorage
+---
+<p><code>localStorage</code> (almacenamiento local) es lo mismo que<code> <a href="/en-US/docs/Web/API/sessionStorage">sessionStorage</a> </code>(almacenamiento de sesión), con las mismas reglas de mismo-origen aplicadas, pero es persistente a través de diferentes sesiones. <code>localStorage</code> se introdujo en la version Firefox 3.5.</p>
+
+<div class="note"><strong>Nota:</strong> Cuando el navegador está en modo de navegación privado, una nueva base de datos temporal se crea para guardar <em>datos </em>de almacenamiento local. Esta base de datos se vacía y descarta cuando salimos del modo de navegación privado.</div>
+
+<pre class="brush:js notranslate" style="font-size: 14px;">// Guardar datos al almacenamiento local actual
+localStorage.setItem("nombredeusuario", "John");
+
+// Acceder a datos almacenados
+alert( "nombredeusuario = " + localStorage.getItem("nombredeusuario"));</pre>
+
+<p class="note">La persistencia de <code>localStorage</code> lo hace útil para una variedad de cosas, incluyendo contadores de páginas, como se demuestra en <a href="http://codepen.io/awesom3/pen/Hlfma">este tutorial en Codepen</a>.</p>
+
+<h4 id="Compatibilidad" style="line-height: 18px; font-size: 1.28571428571429rem;">Compatibilidad</h4>
+
+<p>Los objetos de <code>Storage</code> (almacenamiento) son una adición reciente al estándar, por lo que pueden no estar presentes en todos los navegadores. Esto se puede solucionar si introduce uno de los dos códigos al principio de sus <em>scripts</em>, permitiendo el uso de el objeto <code>localStorage</code> en implementaciones que no lo soportan de forma nativa.</p>
+
+<p>Este algoritmo es una imitación exacta del objeto <code>localStorage</code>, pero hace uso de cookies.</p>
+
+<pre class="brush:js notranslate" style="font-size: 14px;">if (!window.localStorage) {
+  Object.defineProperty(window, "localStorage", new (function () {
+    var aKeys = [], oStorage = {};
+    Object.defineProperty(oStorage, "getItem", {
+      value: function (sKey) { return sKey ? this[sKey] : null; },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "key", {
+      value: function (nKeyId) { return aKeys[nKeyId]; },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "setItem", {
+      value: function (sKey, sValue) {
+        if(!sKey) { return; }
+        document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/";
+      },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "length", {
+      get: function () { return aKeys.length; },
+      configurable: false,
+      enumerable: false
+    });
+    Object.defineProperty(oStorage, "removeItem", {
+      value: function (sKey) {
+        if(!sKey) { return; }
+        document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
+      },
+      writable: false,
+      configurable: false,
+      enumerable: false
+    });
+    this.get = function () {
+      var iThisIndx;
+      for (var sKey in oStorage) {
+        iThisIndx = aKeys.indexOf(sKey);
+        if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); }
+        else { aKeys.splice(iThisIndx, 1); }
+        delete oStorage[sKey];
+      }
+      for (aKeys; aKeys.length &gt; 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); }
+      for (var aCouple, iKey, nIdx = 0, aCouples = document.cookie.split(/\s*;\s*/); nIdx &lt; aCouples.length; nIdx++) {
+        aCouple = aCouples[nIdx].split(/\s*=\s*/);
+        if (aCouple.length &gt; 1) {
+          oStorage[iKey = unescape(aCouple[0])] = unescape(aCouple[1]);
+          aKeys.push(iKey);
+        }
+      }
+      return oStorage;
+    };
+    this.configurable = false;
+    this.enumerable = true;
+  })());
+}
+</pre>
+
+<div class="note"><strong>Nota:</strong> El tamaño máximo de datos que se puede guardar está muy restringido por el uso de cookies. Con este algoritmo, utilize las funciones <code>localStorage.getItem()</code>, <code>localStorage.setItem()</code>, y <code>localStorage.removeItem()</code> para agregar, cambiar, o quitar una clave. El uso del método <code>localStorage.suClave</code> para obtener, establecer, o borrar una clave <strong>no está permitido con este código</strong>. También se puede cambiar el nombre y usarse sólo para gestionar las cookies de el documento sin importar el objeto localStorage.</div>
+
+<div class="note"><strong>Nota:</strong> Al cambiar la cadena <code style="background: rgb(204, 204, 204);">"; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/"</code> a: <code style="background: rgb(204, 204, 204);">"; path=/"</code> (y al cambiar el nombre del objeto), esto se pasará a ser un <code>sessionStorage</code> <em>polyfill</em> en vez de un <code>localStorage</code> <em>polyfill</em>. Sin embargo, esta implementación compartirá valores almacenados a través de pestañas y ventanas del navegador (y sólo se borrará cuando todas las ventanas del navegador hayan sido cerradas), mientras que una implementación  <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">sessionStorage</span><span style="line-height: 1.5em;"> completamente compatible sólo restringirá los valores guardados al contexto actual del navegador.</span></div>
+
+<p>Esta es otra imitación menos exacta de el objeto <code>localStorage</code>, es más simple que la anterior, pero es compatible con navegadores antiguos, como Internet Explorer &lt; 8 (<strong>probado y funcional incluso en Internet Explorer 6</strong>). También hace uso de cookies.</p>
+
+<pre class="brush:js notranslate" style="font-size: 14px;">if (!window.localStorage) {
+  window.localStorage = {
+    getItem: function (sKey) {
+      if (!sKey || !this.hasOwnProperty(sKey)) { return null; }
+      return unescape(document.cookie.replace(new RegExp("(?:^|.*;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=\\s*((?:[^;](?!;))*[^;]?).*"), "$1"));
+    },
+    key: function (nKeyId) {
+      return unescape(document.cookie.replace(/\s*\=(?:.(?!;))*$/, "").split(/\s*\=(?:[^;](?!;))*[^;]?;\s*/)[nKeyId]);
+    },
+    setItem: function (sKey, sValue) {
+      if(!sKey) { return; }
+      document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/";
+      this.length = document.cookie.match(/\=/g).length;
+    },
+    length: 0,
+    removeItem: function (sKey) {
+      if (!sKey || !this.hasOwnProperty(sKey)) { return; }
+      document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
+      this.length--;
+    },
+    hasOwnProperty: function (sKey) {
+      return (new RegExp("(?:^|;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=")).test(document.cookie);
+    }
+  };
+  window.localStorage.length = (document.cookie.match(/\=/g) || window.localStorage).length;
+}
+</pre>
+
+<div class="note"><strong>Nota:</strong> El tamaño máximo de datos que se puede guardar está muy restringido por el uso de cookies. Con este algoritmo, utilize las funciones <code>localStorage.getItem()</code>, <code>localStorage.setItem()</code>, y <code>localStorage.removeItem()</code> para agregar, cambiar, o quitar una clave. El uso del método <code>localStorage.suClave</code> para obtener, establecer, o borrar una clave <strong>no está permitido con este código</strong>. También se puede cambiar el nombre y usarse sólo para gestionar las cookies de el documento sin importar el objeto localStorage.</div>
+
+<div class="note"><strong>Nota:</strong> Al cambiar la cadena <code style="background: rgb(204, 204, 204);">"; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/"</code> a: <code style="background: rgb(204, 204, 204);">"; path=/"</code> (y al cambiar el nombre del objeto), esto se volverá un <code>sessionStorage</code> <em>polyfill</em> en vez de un <code>localStorage</code> <em>polyfill</em>. Sin embargo, esta implementación compartirá valores almacenados a través de pestañas y ventanas del navegador (y sólo se borrará cuando todas las ventanas del navegador hayan sido cerradas), mientras que una implementación  <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">sessionStorage</span><span style="line-height: 1.5em;"> completamente compatible sólo restringirá los valores guardados al contexto actual del navegador.</span></div>
+
+<h4 id="Compatibilidad_y_relación_con_globalStorage" style="line-height: 18px; font-size: 1.28571428571429rem;">Compatibilidad y relación con globalStorage</h4>
+
+<p class="note"><code>localStorage</code> es lo mismo que <code>globalStorage[location.hostname]</code>, con la excepción de que tiene un ámbito de origen HTML5 (<em>esquema </em>+ <em>nombre del host </em>+ <em>puerto no estandar</em>), y <code>localStorage</code> es una instancia de <code>Storage</code>, al contrario que <code>globalStorage[location.hostname]</code>, que es una instancia de <code>StorageObsolete</code>, como se explica más adelante. Por ejemplo, <a class="external" href="http://example.com" rel="freelink">http://ejemplo.com</a> no puede acceder al mismo objeto <code>localStorage</code> que <a class="link-https" href="https://example.com" rel="freelink">https://ejemplo.com,</a> pero los dos pueden acceder al mismo elemento de <code>globalStorage</code>. --<code>localStorage</code> es una interfaz estándar mientras que <code>globalStorage</code> no lo es, así que no se debe depender de ella.</p>
+
+<p>Nótese que al establecer una propiedad en <code>globalStorage[location.hostname]</code> <strong>no</strong> la establece en <code>localStorage</code>, y al extender <code>Storage.prototype</code> no afecta a los elementos de <code>globalStorage</code>; sólo al extender <code>StorageObsolete.prototype</code> los afecta.</p>
+
+<h4 id="El_formato_de_Storage">El formato de Storage</h4>
+
+<p>Las claves y valores de <code>Storage</code> se guardan en el formato UTF-16 <a href="/en-US/docs/Web/API/DOMString">DOMString</a>, que usa 2 bytes por carácter.</p>
diff --git a/files/es/conflicting/web/api/windoworworkerglobalscope/index.html b/files/es/conflicting/web/api/windoworworkerglobalscope/index.html
new file mode 100644
index 0000000000..881424841a
--- /dev/null
+++ b/files/es/conflicting/web/api/windoworworkerglobalscope/index.html
@@ -0,0 +1,110 @@
+---
+title: WindowBase64
+slug: conflicting/Web/API/WindowOrWorkerGlobalScope
+tags:
+  - API
+  - HTML-DOM
+  - Helper
+  - NeedsTranslation
+  - TopicStub
+  - WindowBase64
+translation_of: Web/API/WindowOrWorkerGlobalScope
+translation_of_original: Web/API/WindowBase64
+original_slug: Web/API/WindowBase64
+---
+<p>{{APIRef}}</p>
+<p>The <code><strong>WindowBase64</strong></code> helper contains utility methods to convert data to and from base64, a binary-to-text encoding scheme. For example it is used in <a href="/en-US/docs/data_URIs">data URIs</a>.</p>
+<p>There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.</p>
+<h2 id="Properties">Properties</h2>
+<p><em>This helper neither defines nor inherits any properties.</em></p>
+<h2 id="Methods">Methods</h2>
+<p><em>This helper does not inherit any methods.</em></p>
+<dl>
+ <dt>
+  {{domxref("WindowBase64.atob()")}}</dt>
+ <dd>
+  Decodes a string of data which has been encoded using base-64 encoding.</dd>
+ <dt>
+  {{domxref("WindowBase64.btoa()")}}</dt>
+ <dd>
+  Creates a base-64 encoded ASCII string from a string of binary data.</dd>
+</dl>
+<h2 id="Specifications">Specifications</h2>
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', '#windowbase64', 'WindowBase64')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', '#windowbase64', 'WindowBase64')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. No change.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "#windowbase64", "WindowBase64")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowBase64</code> (properties where on the target before it).</td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+<p>{{CompatibilityTable}}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Firefox (Gecko)</th>
+    <th>Chrome</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>Basic support</td>
+    <td>{{CompatGeckoDesktop(1)}} [1]</td>
+    <td>{{CompatVersionUnknown}}</td>
+    <td>10.0</td>
+    <td>{{CompatVersionUnknown}}</td>
+    <td>{{CompatVersionUnknown}}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>Android</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Basic support</td>
+    <td>{{CompatGeckoMobile(1)}}</td>
+    <td rowspan="1">{{CompatVersionUnknown}}</td>
+    <td rowspan="1">{{CompatVersionUnknown}}</td>
+    <td rowspan="1">{{CompatVersionUnknown}}</td>
+    <td rowspan="1">{{CompatVersionUnknown}}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<p>[1]  <code>atob()</code> is also available to XPCOM components implemented in JavaScript, even though {{domxref("Window")}} is not the global object in components.</p>
+<h2 id="See_also">See also</h2>
+<ul>
+ <li><a href="/Web/API/WindowBase64/Base64_encoding_and_decoding">Base64 encoding and decoding</a></li>
+ <li>{{domxref("Window")}}, {{domxref("WorkerGlobalScope")}}, {{domxref("DedicatedWorkerGlobalScope")}}, {{domxref("SharedWorkerGlobalScope")}}, and {{domxref("ServiceWorkerGlobalScope")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html b/files/es/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html
new file mode 100644
index 0000000000..bede3a0c57
--- /dev/null
+++ b/files/es/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html
@@ -0,0 +1,120 @@
+---
+title: WindowTimers
+slug: conflicting/Web/API/WindowOrWorkerGlobalScope_e2691f7ad05781a30c5fc5bb3b3f633a
+tags:
+  - API
+translation_of: Web/API/WindowOrWorkerGlobalScope
+translation_of_original: Web/API/WindowTimers
+original_slug: Web/API/WindowTimers
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p><code><strong>WindowTimers</strong></code> contains utility methods to set and clear timers.</p>
+
+<p>There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.</p>
+
+<h2 id="Properties">Properties</h2>
+
+<p><em>This interface do not define any property, nor inherit any.</em></p>
+
+<h2 id="Methods">Methods</h2>
+
+<p><em>This interface do not inherit any method.</em></p>
+
+<dl>
+ <dt>{{domxref("WindowTimers.clearInterval()")}}</dt>
+ <dd>Cancels the repeated execution set using {{domxref("WindowTimers.setInterval()")}}.</dd>
+ <dt>{{domxref("WindowTimers.clearTimeout()")}}</dt>
+ <dd>Cancels the repeated execution set using {{domxref("WindowTimers.setTimeout()")}}.</dd>
+ <dt>{{domxref("WindowTimers.setInterval()")}}</dt>
+ <dd>Schedules the execution of a function each X milliseconds.</dd>
+ <dt>{{domxref("WindowTimers.setTimeout()")}}</dt>
+ <dd>Sets a delay for executing a function.</dd>
+</dl>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', '#windowtimers', 'WindowTimers')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', '#windowtimers', 'WindowTimers')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. No change.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "#windowtimers", "WindowTimers")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowBase64</code> (properties where on the target before it).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatGeckoDesktop(1)}}</td>
+   <td>1.0</td>
+   <td>4.0</td>
+   <td>4.0</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatGeckoMobile(1)}}</td>
+   <td rowspan="1">{{CompatVersionUnknown}}</td>
+   <td rowspan="1">{{CompatVersionUnknown}}</td>
+   <td rowspan="1">{{CompatVersionUnknown}}</td>
+   <td rowspan="1">{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Window")}}, {{domxref("WorkerGlobalScope")}}, {{domxref("DedicatedWorkerGlobalScope")}}, {{domxref("SharedWorkerGlobalScope")}}, and {{domxref("ServiceWorkerGlobalScope")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/api_dd04ca1265cb79b990b8120e5f5070d3/index.html b/files/es/conflicting/web/api_dd04ca1265cb79b990b8120e5f5070d3/index.html
new file mode 100644
index 0000000000..7630d77e37
--- /dev/null
+++ b/files/es/conflicting/web/api_dd04ca1265cb79b990b8120e5f5070d3/index.html
@@ -0,0 +1,145 @@
+---
+title: WebAPI
+slug: conflicting/Web/API_dd04ca1265cb79b990b8120e5f5070d3
+tags:
+  - Apps
+  - DOM
+  - Firefox OS
+  - Mobile
+  - NeedsTranslation
+  - TopicStub
+translation_of: Web/API
+translation_of_original: WebAPI
+original_slug: WebAPI
+---
+<p><strong>WebAPI</strong> es un termino usado para referirse al conjunto de APIs compatibles y de acceso a los dispositivos que permite a las Web apps y contenido acceder al hardware del dispositivo (como el estado de la batería o la vibración de hardware), al igual que acceso a información almacenada en el dispositivo (como el calendario o la lista de contactos). Agregando estas APIs, esperamos expandir lo que la Web puede hacer hoy y solo plataformas propietarias fueron capaces de hacer en el pasado.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> More of this documentation has been written than it looks like; links are not all added yet. We're actively working on improving this and expect to see things much better over the next couple of weeks. See the <a href="/en-US/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">WebAPI doc status page</a>, where we're tracking work on WebAPI docs.</p>
+</div>
+
+<div class="row topicpage-table">
+<div class="section">
+<h2 class="Documentation" id="Communication_APIs" name="Communication_APIs">APIs DE COMUNICACIÓN</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/WebAPI/Network_Information" title="WebAPI/Network_Information">API de información de la red</a></dt>
+ <dd>Provee información básica sobre la conexión de red actual, como la velocidad de conexión.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/docs/WebAPI/WebBluetooth" title="WebAPI/WebBluetooth">Bluetooth</a></dt>
+ <dd>La API de  WebBluetooth provee acceso a bajo nivel  al hardware de Bluetooth del dispositivo.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Mobile_Connection" title="WebAPI/Mobile_Connection">API de conexión móvil</a> {{NonStandardBadge}}</dt>
+ <dd>Expone información sobre la conectividad celular del dispositivo, como la fuerza de la señal, información del operador y así suscesivamente.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Network_Stats" title="WebAPI/Network_Stats">API de estadísticas de red</a></dt>
+ <dd>Monitorea la data usada y expone esta data a aplicaciones privilegiadas.</dd>
+ <dt><a href="/en-US/docs/WebAPI/TCP_Socket" title="WebAPI/TCP_Socket">TCP Socket API</a></dt>
+ <dd>Proporciona sockets de bajo nivel y soporte SSL.</dd>
+ <dt><a href="/en-US/docs/WebAPI/WebTelephony" title="WebAPI/WebTelephony">Telefonía</a> {{NonStandardBadge}}</dt>
+ <dd>Permite a las apps contestar llamadas telefónicas y usar la interfaz de usuario de telefonía integrada.</dd>
+ <dt><a href="/en-US/docs/WebAPI/WebSMS" title="WebAPI/WebSMS">WebSMS </a>{{NonStandardBadge}}</dt>
+ <dd>Permite a las apps enviar y recibir mensajes de texto, así como también acceder y manejar los mensajes almacenados en el dispositivo.</dd>
+ <dt><a href="/en-US/docs/WebAPI/WiFi_Information" title="WebAPI/WiFi_Information">API de información de WiFi</a></dt>
+ <dd>API privilegiada, la cual provee información sobre la fuerza de la señal, el nombre de la red actual, redes wifi disponibles, y más.</dd>
+</dl>
+
+<h2 class="Documentation" id="Hardware_access_APIs" name="Hardware_access_APIs">APIS de acceso a Hardware</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/WebAPI/Using_Light_Events">API de sensor de luz ambiental</a></dt>
+ <dd>Provee acceso al sensor de luz ambiental, el cual permite a una app detectar el nivel de luz ambiental proximos al dispositivo.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Battery_Status" title="WebAPI/Battery_Status">API de estado de batería</a></dt>
+ <dd>Provee información sobre el nivel de carga de la batería y si el dispositivo se encuentra conectado a un punto de carga o no.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/docs/Using_geolocation" title="Using_geolocation">API de Geolocalización</a></dt>
+ <dd>Provee información sobre la ubicación física del dispositivo.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Pointer_Lock" title="API/Pointer_Lock_API">API de bloqueo de puntero</a></dt>
+ <dd>Permite a las apps bloquear acceso al mouse y obtener acceso a los deltas de movimiento en lugar de coordenadas absolutas; esto es ideal para juegos.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/docs/WebAPI/Proximity" title="WebAPI/Proximity">API de proximidad</a></dt>
+ <dd>Permite determinar la proximidad del dispositivo a objetos cercanos, como el rostro del usuario.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Detecting_device_orientation" title="WebAPI/Detecting_device_orientation">API de orientación del dispositivo</a></dt>
+ <dd>Provee notificaciones cuando la orientación del dispositivo cambia.</dd>
+ <dt><a href="/en-US/docs/Detecting_device_orientation" title="Detecting_device_orientation">API de orientación de pantalla</a></dt>
+ <dd>Provee notificaciones cuando cambia la orientación de la pantalla. También puedes usar esta API para dejar que su app indique que orientación prefiere.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Vibration" title="WebAPI/WebBluetooth">API de Vibración</a></dt>
+ <dd>Permite a las apps controlar la vibración de hardware del dispositivo para cosas como retroalimentación háptica en juegos. Esto <strong>no</strong> es pensado para cosas como vibraciones de notificaciones, para ello revisa la <a href="/en-US/docs/WebAPI/Alarm" title="WebAPI/Alarm">API de Alarma</a>.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/docs/WebAPI/Camera" title="WebAPI/Camera">API de Cámara</a> {{NonStandardBadge}}</dt>
+ <dd>Permite a las apps tomar fotografías y/o grabar videos usaando la cámara integrada del dispositivo.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Power_Management" title="WebAPI/Power_Management">API de administración de energía </a>{{NonStandardBadge}}</dt>
+ <dd>Permite a las apps encender o apagar la pantalla, el CPU, la energía del dispositivo, y así sucesivamente. También provee soporte para escuchar e inspeccionar eventos de bloqueo de recursos.</dd>
+</dl>
+
+<p><span class="alllinks"><a href="/en-US/docs/tag/WebAPI" title="tag/CSS">View All...</a></span></p>
+</div>
+
+<div class="section">
+<h2 class="Documentation" id="Data_management_APIs" name="Data_management_APIs">APIs de administración de información</h2>
+
+<dl>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/docs/WebAPI/FileHandle_API" title="WebAPI/FileHandle_API">API de identificador de archivos</a></dt>
+ <dd>Provee soporte para escribir archivos con soporte de bloqueo.</dd>
+ <dt><a href="/en-US/docs/IndexedDB" title="IndexedDB">IndexedDB</a></dt>
+ <dd>Almacenamiento de información estructurada del lado cliente con soporte para búsquedas de alto rendimiento.</dd>
+</dl>
+
+<h2 class="Documentation" id="Other_APIs" name="Other_APIs">OtrAS APIs</h2>
+
+<dl>
+ <dt><a href="/es/docs/WebAPI/Alarm" title="WebAPI/Alarm">API de Alarma</a></dt>
+ <dd>Permite a las apps programar notificaciones.</dd>
+ <dd>También proporciona soporte para el lanzamiento de una aplicación de forma automática en un momento determinado.</dd>
+ <dt><a href="/en-US/docs/Apps" title="Apps">Apps API</a></dt>
+ <dd>La API de aplicaciones web abiertas permite soporte para instalar y administrar aplicaciones web. Y además, permite a las aplicaciones determinar información de pago.</dd>
+ <dt><a href="/en-US/docs/DOM/Using_the_Browser_API" title="DOM/Using_the_Browser_API"><strong>API de navegador</strong></a></dt>
+ <dd>Provee soporte para construir un navegador web usando tecnologías web completamente (en esencia, un navegador dentro de un navegador).</dd>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/docs/WebAPI/Idle" title="WebAPI/Device_Storage_API">Idle API</a></dt>
+ <dd>Permite a las apps recibir información cuando el usuario no está usando el dispositivo activamente.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Permissions" title="WebAPI/Permissions">API de permisos</a></dt>
+ <dd>Administra permisos de las apps en una ubicación central. Usado por la app de Ajustes.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Simple_Push" title="WebAPI/Push_Notifications">Simple Push API</a></dt>
+ <dd>Permite a la plataforma enviar mensajes de notificación a aplicaciones específicas.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Time_and_Clock" title="WebAPI/Time_and_Clock">API de tiempo/reloj</a> {{NonStandardBadge}}</dt>
+ <dd>Provee soporte para ajustar el tiempo actual. La zona horaria es establecida usando la <a href="/en-US/docs/WebAPI/Settings" title="WebAPI/Settings">API de ajustes</a>.</dd>
+ <dt><a href="/en-US/docs/WebAPI/Web_Activities" title="WebAPI/Web_Activities">Web Activities</a> {{NonStandardBadge}}</dt>
+ <dd>Permite a una app delegar una actividad a otra app; por ejemplo, una app podría preguntar a otra app seleccionar (o crear) y devolver una foto. Normalmente el usuario es capaz de configurar que aplicaciones se utilizan para que actividad.</dd>
+ <dt><a href="/en-US/docs/Apps/Publishing/In-app_payments" title="Apps/Publishing/In-app_payments">WebPayment API</a> {{NonStandardBadge}}</dt>
+ <dd>Permite a contenido web iniciar pago y reembolsos por bienes virtuales.</dd>
+</dl>
+
+<h2 class="Community" id="Community" name="Community">comunidad WebAPI</h2>
+
+<p>Si necesitas ayuda con estas APIs, existen varias maneras en la que puedes hablar con otros desarrolladores que las utilizan.</p>
+
+<ul>
+ <li>Consulta en el foro de WebAPI: {{DiscussionList("dev-webapi", "mozilla.dev.webapi")}}</li>
+ <li>Visita el canal de IRC de WebAPI: <a href="irc://irc.mozilla.org/webapi" title="irc://irc.mozilla.org/webapi">#webapi</a></li>
+</ul>
+
+<p><span class="alllinks"><a href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p>
+
+<h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">temas Relacionados</h2>
+
+<ul>
+ <li>El <a href="/es/docs/DOM" title="Document Object Model (DOM)">Modelo de Objetos del Documento (DOM)</a> es la representación estructural del documento HTML.</li>
+ <li><a href="/es/docs/JavaScript" title="JavaScript">JavaScript</a> - Lenguaje de Script para la Web.</li>
+ <li><a href="/en-US/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">Doc status</a>: Una lista de WebAPIs y el estado de su documentación.</li>
+</ul>
+</div>
+</div>
+
+<p> </p>
diff --git a/files/es/conflicting/web/css/@viewport/index.html b/files/es/conflicting/web/css/@viewport/index.html
new file mode 100644
index 0000000000..613ae5a285
--- /dev/null
+++ b/files/es/conflicting/web/css/@viewport/index.html
@@ -0,0 +1,127 @@
+---
+title: height
+slug: conflicting/Web/CSS/@viewport
+tags:
+  - Descriptor CSS
+  - Referencia
+translation_of: Web/CSS/@viewport
+translation_of_original: Web/CSS/@viewport/height
+original_slug: Web/CSS/@viewport/height
+---
+<div>{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El descriptor CSS <code><strong>height</strong></code> es un descriptor de forma reducida para establecer {{cssxref("@viewport/min-height", "min-height")}} y {{cssxref("@viewport/max-height", "max-height")}} en el viewport. Definiendo un valor de longitud para viewport se establecerán los dos, altura mínima y altura máxima, con el valor definido.</p>
+
+<p>Si se definen dos valores de viewport, el primero corresponderá a la altura mínima, y el segundo, a la altura máxima.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: css">/* Un valor */
+height: auto;
+height: 320px;
+height: 15em;
+
+/* Dos valores */
+height: 320px 200px;
+</pre>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt><code>auto</code></dt>
+ <dd>El valor a usar es calculado con los valores de otros descriptores CSS.</dd>
+ <dt><code>&lt;length&gt;</code></dt>
+ <dd>Un valor {{cssxref("&lt;length&gt;")}} de longitud absoluta o relativa no negativa.</dd>
+ <dt><code>&lt;percentage&gt;</code></dt>
+ <dd>Un valor {{cssxref("&lt;percentage&gt;")}} del porcentaje relativo a la anchura o altura del viewport inicial, con factor de zoom de 1.0, para longitudes verticales y horizontales respectivamente. No puede ser negativo.</dd>
+</dl>
+
+<h3 id="Sintaxis_formal">Sintaxis formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}
+</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: css">@viewport {
+  height: 500px;
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS3 Device', '#descdef-viewport-height', '"height" descriptor')}}</td>
+   <td>{{Spec2('CSS3 Device')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>29 (usando una bandera)</td>
+   <td>{{CompatNo}}</td>
+   <td>10 {{property_prefix("-ms")}}</td>
+   <td>11.10<br>
+    Removido en 15<br>
+    Reintroducido con una bandera en 16</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4.4</td>
+   <td>29</td>
+   <td>{{CompatNo}}</td>
+   <td>10{{property_prefix("-ms")}}</td>
+   <td>11.10<br>
+    Removido en 15<br>
+    Reintroducido con una bandera en 16</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/conflicting/web/css/@viewport_c925ec0506b352ea1185248b874f7848/index.html b/files/es/conflicting/web/css/@viewport_c925ec0506b352ea1185248b874f7848/index.html
new file mode 100644
index 0000000000..1c89eeec84
--- /dev/null
+++ b/files/es/conflicting/web/css/@viewport_c925ec0506b352ea1185248b874f7848/index.html
@@ -0,0 +1,124 @@
+---
+title: width
+slug: conflicting/Web/CSS/@viewport_c925ec0506b352ea1185248b874f7848
+translation_of: Web/CSS/@viewport
+translation_of_original: Web/CSS/@viewport/width
+original_slug: Web/CSS/@viewport/width
+---
+<div>{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El descriptor CSS <strong>width</strong> es una forma reducida para establecer {{cssxref("@viewport/min-width", "min-width")}} y {{cssxref("@viewport/max-width", "max-width")}} en el viewport. Definiendo un valor de longitud para viewport se establecerán los dos, anchura mínima y anchura máxima, con el valor definido.</p>
+
+<p>Si se definen dos valores de viewport, el primero corresponderá a la anchura mínima, y el segundo, a la anchura máxima.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="brush: css">/* Ejemplo con un valor de viewport: */
+@viewport {
+    width: 320px;
+}
+
+/* Ejemplo con dos valores de viewport: */
+@viewport {
+    width: 320px, 120px;
+}
+
+</pre>
+
+<p> </p>
+
+<h3 id="Values" name="Values">Valores</h3>
+
+<dl>
+ <dt><code>auto</code></dt>
+ <dd>El valor a usar es calculado con los valores de otros descriptores CSS.</dd>
+ <dt><code>&lt;length&gt;</code></dt>
+ <dd>Un valor {{cssxref("&lt;length&gt;")}} de longitud absoluta o relativa no negativa.</dd>
+ <dt><code>&lt;percentage&gt;</code></dt>
+ <dd>Un valor {{cssxref("&lt;percentage&gt;")}} del porcentaje relativo a la anchura o altura del viewport inicial, con factor de zoom de 1.0, para longitudes verticales y horizontales respectivamente. No puede ser negativo.</dd>
+</dl>
+
+<h3 id="Sintaxis_formal">Sintaxis formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS3 Device', '#descdef-viewport-min-width', '"min-width" descriptor')}}</td>
+   <td>{{Spec2('CSS3 Device')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table" style="height: 93px; width: 950px;">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>29 (usando una bandera)</td>
+   <td>{{CompatNo}}</td>
+   <td>10 {{property_prefix("-ms")}}</td>
+   <td>11.10<br>
+    Removido en 15<br>
+    Reintroducido con una bandera en 16</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table" style="height: 93px; width: 948px;">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4.4</td>
+   <td>29</td>
+   <td>{{CompatNo}}</td>
+   <td>10{{property_prefix("-ms")}}</td>
+   <td>11.10<br>
+    Removido en 15<br>
+    Reintroducido con una bandera en 16</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
diff --git a/files/es/conflicting/web/css/_colon_placeholder-shown/index.html b/files/es/conflicting/web/css/_colon_placeholder-shown/index.html
new file mode 100644
index 0000000000..a29af2de30
--- /dev/null
+++ b/files/es/conflicting/web/css/_colon_placeholder-shown/index.html
@@ -0,0 +1,124 @@
+---
+title: ':-moz-placeholder'
+slug: conflicting/Web/CSS/:placeholder-shown
+tags:
+  - CSS
+  - Marcador de Posición INPUT
+  - Marcador de posición
+  - No estándar(2)
+  - Placeholder
+  - Pseudo-Clase CSS
+  - Referencia CSS
+translation_of: Web/CSS/:placeholder-shown
+translation_of_original: Web/CSS/:-moz-placeholder
+original_slug: Web/CSS/:-moz-placeholder
+---
+<div class="note"><strong>Nota:</strong> La pseudo-clase CSS <code>:-moz-placeholder</code> está depreciada desde la versión Firefox 19 siendo desde entonces sustituida por el pseudo-elemento {{cssxref('::-moz-placeholder')}}.</div>
+
+<div class="note"><strong>Nota: </strong> El CSSWG ha decidido introducir  <code>:placeholder-shown</code>. Esta funcionalidad volverá a ser incluida en Gecko en algún momento futuro, sin prefijo y con un nuevo nombre.  {{bug(1069012)}}</div>
+
+<div>{{deprecated_header}}{{Non-standard_header}}{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p><code>La </code><a href="/es/docs/CSS/Pseudo-classes">pseudo-clase </a><code>:-moz-placeholder</code> representa a cualquier elemento que muestre un  <a href="/es/docs/Web/Guide/HTML/Forms_in_HTML#The_placeholder_attribute">texto del marcador de posición (placeholder)</a>. Permite a los desarrolladores web y a los diseñadores de tema personalizar la apariencia del texto de los marcadores de posición (placeholders) que, por defecto, son grises. Puede que esto no funcione bien si ha cambiado el color de fondo de los campos de sus formularios a un color similar así que, puede usar esta pseudo-clase para cambiar el color del texto de los marcadores de posición (placeholders).,</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Ejemplo_básico">Ejemplo básico</h3>
+
+<p>Este ejemplo le da estilo a un <em>placeholder</em> (marcador de posición) haciendo que el color del texto sea verde.</p>
+
+<pre class="brush: html">&lt;!doctype html&gt;
+&lt;html&gt;
+&lt;head&gt;
+  &lt;title&gt;Placeholder demo&lt;/title&gt;
+  &lt;style type="text/css"&gt;
+    input::-moz-placeholder {
+      color: green;
+    }
+    input:-moz-placeholder {
+      color: green;
+    }
+  &lt;/style&gt;
+&lt;/head&gt;
+&lt;body&gt;
+  &lt;input id="test" placeholder="Placeholder text!"&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Basic_example")}}</p>
+
+<h3 id="Desbordamiento">Desbordamiento</h3>
+
+<p>En numerosas ocasiones las cajas para las búsquedas y otros campos de los formularios son fuertemente acortados al ser mostrados en dispositivos móviles. Desafortunadamente , en algunas circunstancias, el texto del marcador de posición de los elementos INPUT no cabe y  es recortado de una manera poco afortunada y fea. Para evitar esto se puede usar la regla CSS <code>text-overflow: ellipsis</code> para envolverlo.</p>
+
+<pre class="brush: css">input[placeholder] { text-overflow: ellipsis; }
+::-moz-placeholder { text-overflow: ellipsis; } /* firefox 19+ */
+input:-moz-placeholder { text-overflow: ellipsis; }
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Implementado en {{bug("457801")}}.</p>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/Guide/HTML/Forms_in_HTML">Formularios en HTML</a></li>
+ <li>{{HTMLElement("input")}}</li>
+ <li>{{HTMLElement("textarea")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/css/_colon_placeholder-shown_f20b6cc785f9fd133a0f9fb582f36891/index.html b/files/es/conflicting/web/css/_colon_placeholder-shown_f20b6cc785f9fd133a0f9fb582f36891/index.html
new file mode 100644
index 0000000000..41ba68e25e
--- /dev/null
+++ b/files/es/conflicting/web/css/_colon_placeholder-shown_f20b6cc785f9fd133a0f9fb582f36891/index.html
@@ -0,0 +1,113 @@
+---
+title: ':-ms-input-placeholder'
+slug: conflicting/Web/CSS/:placeholder-shown_f20b6cc785f9fd133a0f9fb582f36891
+tags:
+  - CSS
+  - No estándar(2)
+  - Pseudo clase CSS
+  - Referencia
+translation_of: Web/CSS/:placeholder-shown
+translation_of_original: Web/CSS/:-ms-input-placeholder
+original_slug: Web/CSS/:-ms-input-placeholder
+---
+<div>{{Non-standard_header}}{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>La  <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-clase </a>propietaria y no estándar  <code>:-ms-input-placeholder</code> representa el  <a href="/es/docs/Web/HTML/Forms_in_HTML#The_placeholder_attribute">texto del marcador de posición (placeholder) </a> de un elemento de un formulario. Esto permite personalizar el texto de los marcadores de posición (placeholders) a los desarrolladores web y a los diseñadores de temas. Sólo es soportada por los navegadores Internet Explorer y Microsoft Edge.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>El siguiente ejemplo destaca con un estilo personalizado los campos <em>"Branch"</em> y código "<em>ID"</em>. El texto del marcardor de posición (placeholder) se muestra con un estilo hasta que el campo obtiene el foco, momento a partir del cual podemos escribir en él. Cuando el campo obtiene el foco vuelve a tener el estilo normal para un campo input y el texto del marcador de posición (placeholder) desaparece.</p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre>&lt;form id="test"&gt;
+  &lt;p&gt;&lt;label&gt;Enter Student Name: &lt;input id="name" placeholder="Student Name"/&gt;&lt;/label&gt;&lt;/p&gt;
+  &lt;p&gt;&lt;label&gt;Enter Student Branch: &lt;input id="branch" placeholder="Student Branch" /&gt;&lt;/label&gt;&lt;/p&gt;
+  &lt;p&gt;&lt;label&gt;Enter Student ID: &lt;input type="num" pattern="[0-9]{8}" title="8 digit ID" id="sid" class="studentid" placeholder="8 digit id" /&gt;&lt;/label&gt;&lt;/p&gt;
+  &lt;input type="submit" /&gt;
+&lt;/form&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">input {
+   background-color:#E8E8E8;
+   color:black; }
+/* placeholder only style */
+input.studentid:-ms-input-placeholder {
+   font-style:italic;
+   color: red;
+   background-color: yellow;
+}</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12684/bandicam%202016-03-08%2001-48-59-851.jpg" style="border-style: solid; border-width: 1px; height: 160px; margin: 0px; width: 650px;"></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación aunque  Microsoft tiene <a href="https://msdn.microsoft.com/en-us/library/hh772745(v=vs.85).aspx">una descripción en MSDN.</a></p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>{{cssxref("::placeholder")}}</li>
+ <li>{{cssxref("::-webkit-input-placeholder")}}</li>
+ <li>{{cssxref("::-moz-placeholder")}}</li>
+ <li><a href="/es/docs/Web/HTML/Forms_in_HTML">Formularios en HTML</a></li>
+ <li>{{HTMLElement("input")}}</li>
+ <li>{{HTMLElement("textarea")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/css/_doublecolon_placeholder/index.html b/files/es/conflicting/web/css/_doublecolon_placeholder/index.html
new file mode 100644
index 0000000000..99c5ec97ee
--- /dev/null
+++ b/files/es/conflicting/web/css/_doublecolon_placeholder/index.html
@@ -0,0 +1,110 @@
+---
+title: '::-moz-placeholder'
+slug: conflicting/Web/CSS/::placeholder
+tags:
+  - CSS
+  - No estándar(2)
+  - Pseudo-elemento CSS
+  - Referencia CSS
+translation_of: Web/CSS/::placeholder
+translation_of_original: Web/CSS/::-moz-placeholder
+original_slug: Web/CSS/::-moz-placeholder
+---
+<div>{{Non-standard_header}}{{CSSRef}}</div>
+
+<div class="note"><strong>Nota:</strong> El pseudo-elemento <code>::-moz-placeholder</code> fue creado como sustituto de la pseudo-clase {{cssxref(':-moz-placeholder')}} que fue depreciada a partir de la versión de 19 de Firefox.</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El  <a href="/es/docs/Web/CSS/Pseudo-elements">pseudo-elemento </a><code>::-moz-placeholder</code> sirve para seleccionar cualquier elemento de un formulario que esté mostrando un  <a href="/es/docs/Web/HTML/Forms_in_HTML#The_placeholder_attribute">marcador de posición de texto (placeholder text) </a>. Permite a los desarrolladores web y a los diseñadores de tema personalizar la apariencia de estos elementos, cuyo estilo por defecto es de color gris claro. Puede que no funcione correctamente si se cambia el color de fondo de los campos de los formularios para que sean, por ejemplo, de un color similar, así que en ese caso se puede usar este pseudo-elemento para cambiar el color del marcador de posición de texto (placeholder text).</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>En este ejemplo se da estilo al marcador de posición del texto (placeholder text) haciendo que el color del texto sea verde (green).</p>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush:html">&lt;input id="test" placeholder="Placeholder text!"&gt;
+</pre>
+
+<h3 id="Contenido_CSS">Contenido CSS</h3>
+
+<pre class="brush:css">input::-moz-placeholder {
+  color: green;
+}
+</pre>
+
+<p>Obtendremos el siguiente resultado:</p>
+
+<p>{{EmbedLiveSample("Example")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("19.0")}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("19.0")}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Firefox aplica un estilo por defecto de  <code>{{cssxref("opacity")}}: 0.54</code> al marcador de posición del texto (placeholder). Ver {{Bug("556145")}}. La mayoría de los demás navegadores importante no comparten este estilo ni para el pseudo-elemento ni para la pseudo-clase.</p>
+
+<p>La implementación previa en el motor Gecko era como la pseudo-clase  {{cssxref(":-moz-placeholder")}}. Ver {{Bug("737786")}}.</p>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>{{cssxref("::placeholder")}}</li>
+ <li>{{cssxref("::-webkit-input-placeholder")}}</li>
+ <li>{{cssxref(":-ms-input-placeholder")}}</li>
+ <li><a href="/es/docs/Web/HTML/Forms_in_HTML">Formularios en HTML</a></li>
+ <li>{{HTMLElement("input")}}</li>
+ <li>{{HTMLElement("textarea")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/css/_doublecolon_placeholder_70bda352bb504ebdd6cd3362879e2479/index.html b/files/es/conflicting/web/css/_doublecolon_placeholder_70bda352bb504ebdd6cd3362879e2479/index.html
new file mode 100644
index 0000000000..54824a3934
--- /dev/null
+++ b/files/es/conflicting/web/css/_doublecolon_placeholder_70bda352bb504ebdd6cd3362879e2479/index.html
@@ -0,0 +1,87 @@
+---
+title: '::-webkit-input-placeholder'
+slug: conflicting/Web/CSS/::placeholder_70bda352bb504ebdd6cd3362879e2479
+tags:
+  - CSS
+  - NeedsExample
+  - No estándar(2)
+  - Pseudo-elemento
+  - Pseudo-elemento CSS
+  - Referencia
+  - Referencia CSS
+translation_of: Web/CSS/::placeholder
+translation_of_original: Web/CSS/::-webkit-input-placeholder
+original_slug: Web/CSS/::-webkit-input-placeholder
+---
+<div>{{Non-standard_header}}{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El  <a href="/es/docs/Web/CSS/Pseudo-elements">pseudo-elemento</a> no estándar y propietario <code>::-webkit-input-placeholder</code> representa el <a href="/es/docs/Web/HTML/Forms_in_HTML#The_placeholder_attribute">marcador de posición de texto (placeholder text)</a> de un elemento formulario. Permite que desarrolladores y diseñadores de temas puedan personalizar este marcador de posición de texto (placeholder). Sólo está soportado por WebKit/Blink.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación. Es un pseudo-elemento propietario y específico de WebKit/Blink.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>{{cssxref("::placeholder")}}</li>
+ <li>{{cssxref("::-moz-placeholder")}}</li>
+ <li>{{cssxref(":-ms-input-placeholder")}}</li>
+ <li><a href="/es/docs/Web/HTML/Forms_in_HTML">Formularios en HTML</a></li>
+ <li>{{HTMLElement("input")}}</li>
+ <li>{{HTMLElement("textarea")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/es/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
new file mode 100644
index 0000000000..c2fb316660
--- /dev/null
+++ b/files/es/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
@@ -0,0 +1,377 @@
+---
+title: Usando las cajas flexibles CSS
+slug: conflicting/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
+translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
+translation_of_original: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
+original_slug: Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS
+---
+<div>{{CSSRef}}</div>
+
+<p><span class="seoSummary">La propiedad <strong>Flexible Box</strong>, o <strong>flexbox</strong>, de CSS3 es un <a href="https://developer.mozilla.org/es/docs/Web/CSS/Layout_mode">modo de diseño</a> que permite colocar los elementos de una página para que se comporten de forma predecible cuando el diseño de la página debe acomodarse a diferentes tamaños de pantalla y diferentes dispositivos. Para muchas aplicaciones, el modelo "caja flexible" produce una mejora sobre el modelo "bloque" porque no utiliza la propiedad <span style="font-family: courier new,andale mono,monospace;">float</span>, ni hace que los márgenes del contenedor flexible interfieran con los márgenes de sus contenidos.</span></p>
+
+<p>Muchos diseñadores verán que el modelo "caja flexible" es más sencillo de utilizar. Los elementos "hijos" de una "caja flexible" pueden colocarse en cualquier dirección y pueden tener dimensiones flexibles para adapterse al espacio visible. Posicionar los elementos "hijos" es por tanto mucho más sencillo, y los diseños complejos pueden hacerse más fácilmente y con código más limpio, ya que el orden de visualización de los elementos es independiente del orden que estos tengan en el código fuente. Esta independencia afecta intencionadamente únicamente a la representación visual, dejando el orden de locución y navegación a lo que diga el código fuente.</p>
+
+<div class="note"><strong>Nota:</strong> Aunque la especificación del diseño de "cajas flexibles" de CSS está en fase de "candidata a recomendación", no todos los navegadores la han implementado. La implementación de WebKit requiere el prefijo <code>-webkit</code>; Internet Explorer implementa una versión antigua de la especificación, con prefijo; Opera 12.10 implementa la última versión, sin prefijo. Revisa la tabla de compatibilidad de cada propiedad para saber cuál es el estado actual de compatibilidad.</div>
+
+<h2 id="El_concepto_de_cajas_flexibles">El concepto de "cajas flexibles"</h2>
+
+<p>Lo que caracteriza un diseño flexible es su habilidad para alterar el ancho y alto de sus elementos para ajustarse lo mejor posible al espacio disponible en cualquier dispositivo. Un contenedor flexible expande sus elementos para rellenar el espacio libre, o los comprime para evitar que rebasen el área prevista.</p>
+
+<p>El algoritmo del modelo de diseño de "cajas flexibles" no parte de niguna dirección predeterminada, al contrario de lo que ocurre con el modelo "bloque", que asume una disposición vertical de los elementos, o lo que pasa con el modelo "en línea", que asume una disposición horizontal. Mientras que el modelo "bloque" funciona bien para páginas, se queda muy corto cuando se trata de aplicaciones en las que hay que tener en cuenta el cambio de orientación del dispositivo o los cambios de tamaño realizados por los gestos del usuario. El modelo de "cajas flexibles" es más apropiado para diseños de pequeña escala, mientras que el (emergente) modelo "rejilla" es adecuado para diseños de gran escala. Ambos son parte del gran esfuerzo que el "CSS Working Group" está realizando para proveer de mayor interoperabilidad a las aplicaciones web con todo tipo de usuarios, distintos modos de escritura, y otras necesidades de flexibilidad.</p>
+
+<h2 id="Vocabulario_de_cajas_flexibles">Vocabulario de "cajas flexibles"</h2>
+
+<p>Aunque al hablar de las "cajas flexibles" nos olvidamos de términos como "horizontal/en línea" y "vertical/bloque", se hace necesario emplear una nueva terminología. Fíjate en el siguiente diagrama para afianzar el vocabulario empleado en sus elementos. Se muestra un contenedor flexible que tiene una <code>flex-direction</code> de tipo <code>row</code>, que significa que los elementos flexibles se muestra uno a continuación del otro horizontalmente a lo largo del eje principal (main axis) de acuerdo con el modo de escritura preestablecido, y en este caso, la dirección en que el texto de los elementos fluye es de izquierda-a-derecha.</p>
+
+<p><img alt="flex_terms.png" class="default internal" src="/files/3739/flex_terms.png"></p>
+
+<dl>
+ <dt>Contenedor flexible (Flex container)</dt>
+ <dd>El elemento "padre" que contiene los elementos flexibles. Un contenedor flexible se define usando los valores <code>flex</code> o <code>inline-flex</code> en la propiedad <a href="/en/CSS/display" rel="internal" title="display"><code>display</code></a>.</dd>
+ <dt>Elemento flexible (Flex item)</dt>
+ <dd>
+ <p>Cada hijo de un contenedor flex se convierte en un elemento flexible. Si hay texto directamente incluido en el contenedor flexible, se envuelve automáticamente en un elemento flexible anónimo.</p>
+ </dd>
+ <dt>Ejes</dt>
+ <dd>
+ <p>Cada diseño de "caja flexible" sigue dos ejes. El <strong>eje principal</strong> es el eje a lo largo del cual los elementos flexibles se suceden unos a otros. El <strong>eje secundario</strong> es el eje perpendicular al <strong>eje principal</strong>.</p>
+
+ <ul>
+  <li>La propiedad <code><a href="/en/CSS/flex-direction" rel="internal" title="flex-direction">flex-direction</a></code> establece el eje principal.</li>
+  <li>La propiedad <a href="/en/CSS/justify-content" rel="internal" title="en/CSS/justify-content"><code>justify-content</code></a> define cómo los elementos flexibles se disponen a lo largo del eje principal en la línea en curso.</li>
+  <li>La propiedad <a href="/en/CSS/align-items" title="en/CSS/align-items"><code>align-items</code></a> define cómo los elementos flexibles se disponen a lo largo del eje secundario de la línea en curso.</li>
+  <li>La propiedad <a href="/en/CSS/align-self" title="en/CSS/align-self"><code>align-self</code></a> define cómo cada elemento flexible se alinea respecto al eje secundario, y sustituye al valor por defecto establecido por <code>align-items.</code></li>
+ </ul>
+ </dd>
+ <dt>Direcciones</dt>
+ <dd>
+ <p>Los lados <strong>inicio principal</strong>/<strong>fin principal (main start/main end) </strong>e <strong>inicio secundario</strong>/<strong>fin </strong><strong>secundario (cross start/cross end)</strong> del contenedor flexible describen el origen y final del flujo de los elementos flexibles. Estos siguen el eje principal y secundario según el vector establecido por <code>writing-mode</code> (izquierda-a-derecha, derecha-a-izquierda, etc.).</p>
+
+ <ul>
+  <li>La propiedad <a href="/en/CSS/order" rel="internal" title="en/CSS/order"><code>order</code></a> asigna elementos a grupos ordinales y determina qué elementos aparecen primero.</li>
+  <li>La propiedad <a href="/en/CSS/flex-flow" rel="internal" title="flex-flow"><code>flex-flow</code></a> combina las propiedades <a href="/en/CSS/flex-direction" rel="internal" title="flex-direction"><code>flex-direction</code></a> y <a href="/en/CSS/flex-wrap" rel="internal" title="flex-wrap"><code>flex-wrap</code></a> para colocar los elementos flexibles.</li>
+ </ul>
+ </dd>
+ <dt>Líneas</dt>
+ <dd>
+ <p>Los elementos flexibles pueden disponerse en una sola o varias líneas de acuerdo con la propiedad <a href="/en/CSS/flex-wrap" rel="internal" title="flex-wrap"><code>flex-wrap</code></a>, que controla la dirección del eje secundario y la dirección en la que las nuevas líneas se apilan.</p>
+ </dd>
+ <dt>Dimensiones</dt>
+ <dd>
+ <p>Los términos equivalentes a "altura" y "anchura" usados en los elementos flexibles son <strong>tamaño principal (main size)</strong> and <strong>tamaño secundario (cross size),</strong> que respectivamente siguen al eje principal y al eje secundario del contenedor flexible.</p>
+
+ <ul>
+  <li>La propiedades <code><a href="/en/CSS/min-height" title="/en/CSS/min-height">min-height</a></code> y <code><a href="/en/CSS/min-width" title="/en/CSS/min-width">min-width</a></code> tienen un nuevo valor, <code>auto</code> que establece el tamaño mínimo de un elemento flexible.</li>
+  <li>La propiedad <a href="/en/CSS/flex" rel="internal" title="en/CSS/flex"><code>flex</code></a> combina las propiedades <code><a href="/en/CSS/flex-basis" rel="internal" title="en/CSS/flex-basis">flex-basis</a></code>, <a href="/en/CSS/flex-grow" rel="internal" title="en/CSS/flex-grow"><code>flex-grow</code></a>, y <a href="/en/CSS/flex-shrink" rel="internal" title="en/CSS/flex-shrink"><code>flex-shrink</code></a> para establecer el grado de flexibilidad de los elementos flexibles.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h2 id="Diseñando_una_caja_flexible">Diseñando una "caja flexible"</h2>
+
+<p>Para indicar que unos elementos tienen este estilo CSS, asigna la propiedad <a href="/en/CSS/display" title="/en/CSS/display">display</a> así:</p>
+
+<pre class="brush: css">display : flex</pre>
+
+<p>o</p>
+
+<pre class="brush: css">display : inline-flex</pre>
+
+<p>Haciendo esto, se define el elemento como contenedor flexible y todos sus "hijos" como elementos flexibles. El valor <code>flex</code> hace que el contenedor flexible sea un bloque dentro del elemento "padre" al que pertenezca. El valor <code>inline-flex</code> hace que el contenedor flexible sea un elemento "en línea" dentro del elemento "padre" al que pertenezca.</p>
+
+<div class="note"><strong>Nota:</strong> Cuando utilices un prefijo para el tipo de navegador, ponlo en la propiedad "display" no en el atributo "display". Por ejemplo, <code>display : -webkit-flex</code>.</div>
+
+<h2 id="Consideraciones_de_los_elementos_flexibles">Consideraciones de los elementos flexibles</h2>
+
+<p>El texto que se encuentre directamente dentro de un contenedor flexible, será automáticamente envuelto en un elemento flexible anónimo. Sin embargo, si un elemento flexible contiene solamente espacios en blanco no será mostrado, como si tuviera la propiedad <code style="color: rgb(93,86,54); font-size: 14px;">display:none</code>.</p>
+
+<p>Los "hijos" de un contenedor flexible que tengan un posicionamiento absoluto, se situarán de manera que su posición estática se determine en referencia a la esquina del <strong>inicio principal (main start)</strong> de su contenedor flexible.</p>
+
+<p>Actualmente, debido a un problema conocido, asignar <code style="font-size: 14px;">visibility:collapse</code> a un elemento flexible causa que sea tratado como si fuera <code style="font-size: 14px;">display:none</code> en vez de lo que se supone que debería ocurrir, es decir, como si fuera <code style="font-size: 14px;">visibility:hidden</code>. La alternativa mientras se resuelve este problema es usar <code>visibility:hidden</code> para elementos flexibles que deban comportarse como <code>visibility:collapse</code>.</p>
+
+<p>Los márgenes de elementos flexibles adyacentes no se colapsan. Usando márgenes <code>auto</code> se absorbe el espacio extra vertical y horizontalmente y puede ser utilizado para alinear o separar elementos flexibles adyacentes. Ver <a href="http://dev.w3.org/csswg/css3-flexbox/#auto-margins" title="http://dev.w3.org/csswg/css3-flexbox/#auto-margins">Aligning with 'auto' margins</a> en la especificación "W3C Flexible Box Layout Model" para más detalles al respecto.</p>
+
+<p>Para asegurar un tamaño mínimo por defecto de los elementos flexibles, usa <code>min-width:auto</code> y/o <code>min-height:auto</code>. Para los elementos flexibles, el valor de atributo <code>auto</code> calcula la mínima anchura/altura del elemento para que no sea menor que la anchura/altura de su contenido, garantizando que el elemento es mostrado suficientemente grande como para que se vea su contenido. Ver {{cssxref("min-width")}}  y {{cssxref("min-height")}} para más detalles al respecto.</p>
+
+<p>Las propiedades de alineación de "cajas flexibles" realizan un "verdadero" centrado en CSS. Esto significa que los elementos flexibles permanecerán centrados, incluso si estos rebasan su contenedor flexible. Esto puede llegar a ser un problema, ya que si sobrepasan el tope superior de la página o el izquierdo (en escritura LTR de izquierda-a-derecha) o el derecho (en escritura RTL de derecha-a-izquierda), no se puede desplazar hacia ese área, incluso habiendo contenido allí. En el futuro, las propiedades de alineación se ampliarán para que tengan una opción "safe" (seguro) para controlar esta situación. De momento, si esto te preocupa, puedes usar los márgenes para conseguir el centrado, ya que estos responderán de modo seguro parando el centrado si se sobrepasan los límites. En vez de usar las propiedades <code>align-</code>, simplemente pon márgenes automáticos en los elementos flexibles que quieras centrar. En vez de usar las propiedades <code>justify-</code>, pon márgenes automáticos en los límites exteriores del primer y último elemento flexible del contenedor flexible. Los márgenes automáticos se adaptarán asumiendo el espacio sobrante, centrando los elementos flexibles donde sobre espacio, y cambiando a alineación normal donde no sobre espacio. Sin embargo, si tratas de reemplazar <code>justify-content</code> con "centrado-basado-en-márgenes" en una "caja flexible" multi-línea, probablemente no funcionará, ya que tendrías que poner márgenes en el primer y último elemento de cada línea. A menos que puedas predecir qué elementos encajarán en cada línea, no tendrás una respuesta fiable usando el "<span style="line-height: inherit;">centrado-basado-en-márgenes</span><span style="line-height: inherit;">" en el eje principal al reemplazar la propiedad </span><code style="font-size: 14px; line-height: inherit;">justify-content</code><span style="line-height: inherit;">.</span></p>
+
+<p>Recuerda que mientras el orden en que se muestran los elementos es independiente de su orden en el código fuente, esta independecia afecta solamente a la representación visual, y no al orden de locución y navegación que seguirán el orden establecido en el código fuente. Incluso la propiedad {{cssxref("order")}} no afectará a la secuencia de locución ni de navegación. Así que los desarrolladores deben preocuparse del orden de los elementos adecuadamente en el código fuente para que no se deteriore la accesibilidad del documento. </p>
+
+<h2 id="Propiedades_de_las_cajas_flexibles">Propiedades de las "cajas flexibles"</h2>
+
+<h3 id="Propiedades_que_no_afectan_a_las_cajas_flexibles">Propiedades que no afectan a las "cajas flexibles"</h3>
+
+<p>Como las "cajas flexibles" emplean un algoritmo diferente, alguna propiedades no tienen sentido para un contenedor flexible.</p>
+
+<ul>
+ <li>Propiedades column-* del <a href="/en/CSS/Using_CSS_multi-column_layouts" title="/en/CSS/Using_CSS_multi-column_layouts">Módulo Multicol</a> no tienen ningún efecto en un elemento flexible.</li>
+ <li>{{cssxref("float")}} y {{cssxref("clear")}} no tienen ningún efecto en un elemento flexible. Usar <code>float</code> causa que la propiedad <code>display</code> del elemento se comporte como <code>block</code>.</li>
+ <li>{{cssxref("vertical-align")}} no tiene efecto en la alineación de los elementos flexibles.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_básico_flex">Ejemplo básico "flex"</h3>
+
+<p>Este ejemplo básico muestra como aplicar "flexibilidad" a un elemento y como sus "hijos" se comportan flexiblemente. </p>
+
+<pre class="brush:html;">​&lt;!DOCTYPE html&gt;
+&lt;html lang="en"&gt;
+  &lt;head&gt;
+    &lt;style&gt;
+
+   .flex
+   {
+      /* basic styling */
+      width: 350px;
+      height: 200px;
+      border: 1px solid #555;
+      font: 14px Arial;
+
+      /* flexbox setup */
+      display: -webkit-flex;
+      -webkit-flex-direction: row;
+
+      display: flex;
+      flex-direction: row;
+   }
+
+   .flex &gt; div
+   {
+      -webkit-flex: 1 1 auto;
+      flex: 1 1 auto;
+
+      width: 30px; /* To make the transition work nicely.  (Transitions to/from
+                      "width:auto" are buggy in Gecko and Webkit, at least.
+                      See http://bugzil.la/731886 for more info.) */
+
+      -webkit-transition: width 0.7s ease-out;
+      transition: width 0.7s ease-out;
+   }
+
+   /* colors */
+   .flex &gt; div:nth-child(1){ background : #009246; }
+   .flex &gt; div:nth-child(2){ background : #F1F2F1; }
+   .flex &gt; div:nth-child(3){ background : #CE2B37; }
+
+   .flex &gt; div:hover
+   {
+        width: 200px;
+   }
+
+   &lt;/style&gt;
+
+ &lt;/head&gt;
+ &lt;body&gt;
+  &lt;p&gt;Flexbox nuovo&lt;/p&gt;
+  &lt;div class="flex"&gt;
+    &lt;div&gt;uno&lt;/div&gt;
+    &lt;div&gt;due&lt;/div&gt;
+    &lt;div&gt;tre&lt;/div&gt;
+  &lt;/div&gt;
+ &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<h3 id="Ejemplo_de_Diseño_del_Santo_Gríal">Ejemplo de "Diseño del Santo Gríal"</h3>
+
+<p>Este ejemplo muestra como la "caja flexible" proporciona la habilidad de cambiar dinámicamente el diseño para distintas resoluciones de pantalla. El diagrama siguiente ilustra la transformación.</p>
+
+<p><img alt="HolyGrailLayout.png" class="default internal" src="/files/3760/HolyGrailLayout.png"></p>
+
+<p>Aquí se muestra el caso en que el diseño de la página adaptado a un navegador tiene que mostrarse óptimamente en un smartphone. No solamente los elementos se reducen de tamaño, sino que el orden en que se muestran también cambia. La "caja flexible" lo hace muy sencillo.</p>
+
+<pre class="brush:html;">​
+&lt;!DOCTYPE html&gt;
+&lt;html lang="en"&gt;
+  &lt;head&gt;
+    &lt;style&gt;
+
+  body {
+   font: 24px Helvetica;
+   background: #999999;
+  }
+
+  #main {
+   min-height: 800px;
+   margin: 0px;
+   padding: 0px;
+   display: -webkit-flex;
+   display:         flex;
+   -webkit-flex-flow: row;
+           flex-flow: row;
+   }
+
+  #main &gt; article {
+   margin: 4px;
+   padding: 5px;
+   border: 1px solid #cccc33;
+   border-radius: 7pt;
+   background: #dddd88;
+   -webkit-flex: 3 1 60%;
+           flex: 3 1 60%;
+   -webkit-order: 2;
+           order: 2;
+   }
+
+  #main &gt; nav {
+   margin: 4px;
+   padding: 5px;
+   border: 1px solid #8888bb;
+   border-radius: 7pt;
+   background: #ccccff;
+   -webkit-flex: 1 6 20%;
+           flex: 1 6 20%;
+   -webkit-order: 1;
+           order: 1;
+   }
+
+  #main &gt; aside {
+   margin: 4px;
+   padding: 5px;
+   border: 1px solid #8888bb;
+   border-radius: 7pt;
+   background: #ccccff;
+   -webkit-flex: 1 6 20%;
+           flex: 1 6 20%;
+   -webkit-order: 3;
+           order: 3;
+   }
+
+  header, footer {
+   display: block;
+   margin: 4px;
+   padding: 5px;
+   min-height: 100px;
+   border: 1px solid #eebb55;
+   border-radius: 7pt;
+   background: #ffeebb;
+   }
+
+  /* Too narrow to support three columns */
+  @media all and (max-width: 640px) {
+
+   #main, #page {
+    -webkit-flex-flow: column;
+            flex-flow: column;
+   }
+
+   #main &gt; article, #main &gt; nav, #main &gt; aside {
+    /* Return them to document order */
+    -webkit-order: 0;
+            order: 0;
+   }
+
+   #main &gt; nav, #main &gt; aside, header, footer {
+    min-height: 50px;
+    max-height: 50px;
+   }
+  }
+
+ &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+ &lt;header&gt;header&lt;/header&gt;
+ &lt;div id='main'&gt;
+    &lt;article&gt;article&lt;/article&gt;
+    &lt;nav&gt;nav&lt;/nav&gt;
+    &lt;aside&gt;aside&lt;/aside&gt;
+ &lt;/div&gt;
+ &lt;footer&gt;footer&lt;/footer&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<h2 id="Área_de_juego">Área de juego</h2>
+
+<p>Hay varias áreas de juego de "cajas flexibles" disponibles on-line para experimentar:</p>
+
+<ul>
+ <li><a href="http://demo.agektmr.com/flexbox/" title="http://demo.agektmr.com/flexbox/">Flexbox Playground</a></li>
+ <li><a href="http://the-echoplex.net/flexyboxes" title="http://the-echoplex.net/flexyboxes">Flexy Boxes</a></li>
+</ul>
+
+<h2 id="Cosas_a_tener_en_mente">Cosas a tener en mente</h2>
+
+<p>El algoritmo de las "cajas flexibles" puede ser un poco complejo de entender a veces. Hay una serie de cosas a considerar para evitar "sorpresas" cuando se utilizan las "cajas flexibles".</p>
+
+<p>Las "cajas flexibles" se comportan en función del <a href="https://developer.mozilla.org/en-US/docs/CSS/writing-mode" title="https://developer.mozilla.org/en-US/docs/CSS/writing-mode">modo de escritura</a> establecido. Esto siginifica que <strong>inicio principal</strong> (<strong>main start</strong>) y <strong>fin principal</strong> (<strong>main end</strong>) se disponen de según la posición de <strong>inicio</strong> (<strong>start</strong>) y <strong>fin</strong> (<strong>end</strong>).</p>
+
+<p><strong>inicio secundario (cross start)</strong> y <strong>fin secundario</strong> (<strong>cross end)</strong> confían en la definición de la posición <strong>inicio</strong> (<strong>start)</strong> o <strong>antes</strong> (<strong>before)</strong> que depende del valor de <a href="/en/CSS/direction" title="direction"><code>direction</code></a>.</p>
+
+<p>Los saltos de página son posibles en el diseño de "cajas flexibles" siempre que la propiedad <code>break-</code> lo permita. Las propiedades CSS3 <code>break-after</code>, <code>break-before</code> y <code>break-inside</code> así como las propiedades CSS 2.1 <code>page-break-before</code>, <code>page-break-after</code> y <code>page-break-inside</code> se aceptan en los contenedores flexibles, también en los elementos flexibles que ellos contienen, y también en los elementos que esos elementos flexibles a su vez contienen.</p>
+
+<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caraterística</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{ CompatGeckoDesktop("18.0") }}{{ property_prefix("-moz") }}(Behind a pref) [2]<br>
+    {{ CompatGeckoDesktop("22.0") }}</td>
+   <td>21.0{{ property_prefix("-webkit") }}</td>
+   <td>10{{ property_prefix("-ms") }}(partial)</td>
+   <td>12.1</td>
+   <td>3.1{{ property_prefix("-webkit") }}(partial)<br>
+    6.1{{ property_prefix("-webkit") }}<br>
+    9</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caraterística</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{ CompatGeckoMobile("18.0") }}{{ property_prefix("-moz") }}(Behind a pref) [2]<br>
+    {{ CompatGeckoMobile("22.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>10{{ property_prefix("-ms") }}(partial)<br>
+    11</td>
+   <td>12.1</td>
+   <td>
+    <p>3.2{{ property_prefix("-webkit") }}(partial)<br>
+     7.1{{ property_prefix("-webkit") }}<br>
+     9.0</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Notas">Notas</h3>
+
+<p>[1] Internet Explorer 10 y Safari soportan un antiguo borrador de la especificación que es incompatible. No han sido actualizados para soportar la versión final.</p>
+
+<p>[2] Firefox soporta solamente la "caja flexible" con una sola línea. Para activar el soporte de "caja flexible" el usuario tiene que cambiar la preferencia about:config "layout.css.flexbox.enabled" a <code>true</code>.</p>
+
+<p>[3] El navegador de Android hasta la versión 4.3 soporta un borrador antiguo e incompatible de la especificación. Android 4.4 ha sido actualizado para dar soporte a la versión final.</p>
+
+<p>[4] Mientras que en la implementación inicial en Opera 12.10 <code>flexbox </code>no estaba en el prefijo, obtuvo prefijos en las versiones de la 15 a la 16 de Opera y 15 a 19 de Opera Mobile con {{property_prefix("-webkit")}}. Este prefijo, fue eliminado de nuevo en Opera 17 y Opera Mobile 24.</p>
+
+<p>[5] Hasta Firefox 29, especificar <code>visibility: collapse</code> en un elemento flex causaba que fuera tratado como si fuera <code>display: none </code>en vez del comportamiento pretendido, tratándolo como si fuera <code>visibility: hidden</code>. El método alternativo sugerido es usar <code>visibility: hidden</code> para los elementos flex que debieran comportarse como si huberan sido designados <code>visibility: collapse</code>. Para más información, ver {{bug(783470)}}.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://github.com/philipwalton/flexbugs">El Proyecto Flexbugs</a> para información de errores en implementación de flexbox en navegadores.</li>
+</ul>
diff --git a/files/es/conflicting/web/css/css_flexible_box_layout/typical_use_cases_of_flexbox/index.html b/files/es/conflicting/web/css/css_flexible_box_layout/typical_use_cases_of_flexbox/index.html
new file mode 100644
index 0000000000..e28553d037
--- /dev/null
+++ b/files/es/conflicting/web/css/css_flexible_box_layout/typical_use_cases_of_flexbox/index.html
@@ -0,0 +1,192 @@
+---
+title: Usando flexbox para componer aplicaciones web
+slug: conflicting/Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
+tags:
+  - Avanzado
+  - CSS
+  - Cajas Flexibles CSS
+  - Ejemplo
+  - Guía
+  - Web
+translation_of: Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
+translation_of_original: Web/CSS/CSS_Flexible_Box_Layout/Using_flexbox_to_lay_out_web_applications
+original_slug: Web/CSS/CSS_Flexible_Box_Layout/Usando_flexbox_para_componer_aplicaciones_web
+---
+<p>{{CSSRef}}</p>
+
+<p>Usar <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">flexbox</a> puede ayudarte a diseñar atractivas composiciones en aplicaciones web que escalen mejor de escritorio a móvil. Pon fin a los elementos flotantes {{HTMLElement("div")}}, <a href="/en-US/docs/Web/CSS/position#Absolute_positioning">el posicionamiento absoluto</a>, y los <em>hacks</em> de JavaScript, y comienza a construir composiciones fluidas en horizontal y vertical en apenas unas líneas de <a href="/es/docs/Web/CSS">CSS</a>. Algunos ejemplos básicos de casos de uso:</p>
+
+<ul>
+ <li>Quieres centrar un elemento en la mitad de una página</li>
+ <li>Quieres un conjunto de contenedores que fluyan verticalmente, uno tras otro</li>
+ <li>Quieres crear una fila de botones u otros elementos que colapse verticalmente en tamaños menores de pantalla</li>
+</ul>
+
+<p>Este artículo sólo aborda el uso de <em>flexbox</em> con navegadores que soportan la implementación moderna y sin prefijos del estándar. Para información sobre prefijos de proveedores para navegadores más antiguos, por favor lee <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">la guía más general para usar cajas flexibles de CSS</a>.</p>
+
+<h2 id="Conceptos_básicos">Conceptos básicos</h2>
+
+<p>Con flexbox puedes hacer que los elementos dentro de cualquier {{HTMLElement("div")}} fluyan estableciendo la propiedad {{cssxref("display")}} como <code>flex</code> y luego dando a la propiedad {{cssxref("flex-flow")}} el valor <code>row</code>, si deseas que los elementos fluyan horizontalmente, o el valor <code>column</code>, si quieres que lo hagan verticalmente. Si estás usando un flexbox horizontal y deseas que tus contenidos queden envueltos verticalmente, especifica además el valor <code>wrap</code>.</p>
+
+<p>Después, para cada elemento que desees sea parte del flujo de cajas, establece la propiedad {{cssxref("flex")}}. Generalmente querrás utilizar uno de los tres siguientes valores:</p>
+
+<ul>
+ <li>Si quieres un elemento que sólo ocupa su ancho asignado, como un botón, utiliza <code>flex: none</code> que se expande a <code>0 0 auto</code>.</li>
+ <li>Si deseas explícitamente dimensionar un elemento, usa <code>flex: 0 0 <em>tamaño</em></code>. Por ejemplo: <code>flex 0 0 60px</code>.</li>
+ <li>Si necesitas un elemento que se expanda para rellenar el espacio disponible, compartiendo el espacio igualmente si hay múltiples elementos de este tipo dentro del flujo, utiliza <code>flex: auto</code>. Se expande a <code>1 1 auto</code>.</li>
+</ul>
+
+<p>Por supuesto, hay otras posibilidades, pero estas deberían cubrir los casos de uso básicos. Veamos cómo se aplica esto en algunos ejemplos.</p>
+
+<h2 id="Centrando_un_elemento_en_una_página">Centrando un elemento en una página</h2>
+
+<p>Para este caso, el método más sencillo es crear dos cajas flexibles, una dentro de otra. Cada flexbox tendrá tres elementos: dos de ellos conteniendo el elemento centrado y después el propio elemento centrado.</p>
+
+<h3 id="Contenido_CSS">Contenido CSS</h3>
+
+<pre class="brush: css;">.vertical-box {
+  display: flex;
+  height: 400px;
+  width: 400px;
+  flex-flow: column;
+}
+.horizontal-box {
+  display: flex;
+  flex-flow: row;
+}
+.spacer {
+  flex: auto;
+  background-color: black;
+}
+.centered-element {
+  flex: none;
+  background-color: white;
+}
+</pre>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush: html;">&lt;div class="vertical-box"&gt;
+  &lt;div class="spacer"&gt;&lt;/div&gt;
+  &lt;div class="centered-element horizontal-box"&gt;
+    &lt;div class="spacer"&gt;&lt;/div&gt;
+    &lt;div class="centered-element"&gt;Centered content&lt;/div&gt;
+     &lt;div class="spacer"&gt;&lt;/div&gt;
+  &lt;/div&gt;
+  &lt;div class="spacer"&gt;&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Centering_an_element_inside_a_page', 500, 500) }}</p>
+
+<h2 id="Haciendo_fluir_verticalmente_un_conjunto_de_contenedores">Haciendo fluir verticalmente un conjunto de contenedores</h2>
+
+<p>Imagina que tienes la composición de una página con una sección de cabecera, una de contenidos y un pie. La cabecera y el pie deberían tener un tamaño fijo, pero la sección de contenidos se debería redimensionar según el espacio disponible. Esto puede lograrse estableciendo la propiedad {{cssxref("flex")}} del contenido como <code>auto</code> y la misma propiedad {{cssxref("flex")}} de la cabecera y el pie como <code>none</code>.</p>
+
+<h3 id="Contenido_CSS_2">Contenido CSS</h3>
+
+<pre class="brush: css;highlight:[8,14,18]">.vertical-box {
+  display: flex;
+  height: 400px;
+  width: 400px;
+  flex-flow: column;
+}
+.fixed-size {
+  flex: none;
+  height: 30px;
+  background-color: black;
+  text-align: center;
+}
+.flexible-size {
+  flex: auto;
+  background-color: white;
+}
+</pre>
+
+<h3 id="Contenido_HTML_2">Contenido HTML</h3>
+
+<pre class="brush: html;">&lt;div id="document" class="vertical-box"&gt;
+  &lt;div class="fixed-size"&gt;&lt;button id="increase-size"&gt;Increase container size&lt;/button&gt;&lt;/div&gt;
+  &lt;div id="flexible-content" class="flexible-size"&gt;&lt;/div&gt;
+  &lt;div class="fixed-size"&gt;&lt;button id="decrease-size"&gt;Decrease container size&lt;/button&gt;&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
+
+<pre class="brush: js;">var height = 400;
+document.getElementById('increase-size').onclick=function() {
+  height += 10;
+  if (height &gt; 500) height = 500;
+  document.getElementById('document').style.height = (height + "px");
+}
+
+document.getElementById('decrease-size').onclick=function() {
+  height -= 10;
+  if (height &lt; 300) height = 300;
+  document.getElementById('document').style.height = (height + "px");
+}</pre>
+
+<h3 id="Resultado_2">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Flowing_a_set_of_containers_vertically', 500, 500) }}</p>
+
+<p>Este ejemplo se ha creado para que clicar en el encabezamiento incremente el tamaño y clicar en el pie lo reduzca. Observa cómo el contenido se redimensiona automática y adecuadamente, mientras las dimensiones del encabezamiento y el pie se mantienen constantes.</p>
+
+<h2 id="Creando_un_contenedor_que_colapse_horizontalmente">Creando un contenedor que colapse horizontalmente</h2>
+
+<p>En algunos casos podrías querer componer horizontalmente un conjunto de información donde el tamaño de pantalla lo permita, pero colapsar los contenidos horizontalmente donde no. Esto es bastate sencillo con flexbox. Puedes conseguirlo añadiendo a la propiedad {{cssxref("flex-flow")}} el valor <code>wrap</code>.</p>
+
+<h3 id="Contenido_CSS_3">Contenido CSS</h3>
+
+<pre class="brush: css;highlight:[4]">.horizontal-container {
+  display: flex;
+  width: 300px;
+  flex-flow: row wrap;
+}
+.fixed-size {
+  flex: none;
+  width: 100px;
+  background-color: black;
+  color: white;
+  text-align: center;
+}
+</pre>
+
+<h3 id="Contenido_HTML_3">Contenido HTML</h3>
+
+<pre class="brush: html;">&lt;div id="container" class="horizontal-container"&gt;
+  &lt;div class="fixed-size"&gt;Element 1&lt;/div&gt;
+  &lt;div class="fixed-size"&gt;Element 2&lt;/div&gt;
+  &lt;div class="fixed-size"&gt;Element 3&lt;/div&gt;
+&lt;/div&gt;&lt;button id="increase-size"&gt;Increase container size&lt;/button&gt;&lt;button id="decrease-size"&gt;Decrease container size&lt;/button&gt;
+</pre>
+
+<h3 id="Contenido_JavaScript_2">Contenido JavaScript</h3>
+
+<pre class="brush: js;">var width = 300;
+
+document.getElementById('increase-size').onclick=function() {
+  width += 100;
+  if (width &gt; 300) width = 300;
+  document.getElementById('container').style.width = (width + "px");
+}
+
+document.getElementById('decrease-size').onclick=function() {
+  width -= 100;
+  if (width &lt; 100) width = 100;
+  document.getElementById('container').style.width = (width + "px");
+}
+</pre>
+
+<h3 id="Resultado_3">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Creating_a_collapsing_horizontal_container', 500, 200) }}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">Usando cajas flexibles CSS</a></li>
+</ul>
diff --git a/files/es/conflicting/web/css/cursor/index.html b/files/es/conflicting/web/css/cursor/index.html
new file mode 100644
index 0000000000..a1b674c1c7
--- /dev/null
+++ b/files/es/conflicting/web/css/cursor/index.html
@@ -0,0 +1,12 @@
+---
+title: '-moz-cell'
+slug: conflicting/Web/CSS/cursor
+tags:
+  - CSS
+translation_of: Web/CSS/cursor
+translation_of_original: Web/CSS/-moz-cell
+original_slug: Web/CSS/-moz-cell
+---
+<div>{{CSSRef}}{{obsolete_header}}</div>
+
+<p><em>¡No uses este valor!Don't use this value! </em> Usa el valor  {{cssxref("cursor#cell","cell")}} en su lugar.</p>
diff --git a/files/es/conflicting/web/css/font-variant/index.html b/files/es/conflicting/web/css/font-variant/index.html
new file mode 100644
index 0000000000..09f79f2844
--- /dev/null
+++ b/files/es/conflicting/web/css/font-variant/index.html
@@ -0,0 +1,12 @@
+---
+title: normal
+slug: conflicting/Web/CSS/font-variant
+translation_of: Web/CSS/font-variant
+translation_of_original: Web/CSS/normal
+original_slug: Web/CSS/normal
+---
+<h2 id="Sumario" name="Sumario">Sumario</h2>
+<p>El valor <i>normal</i> en una propiedad CSS, es normalmente el valor medio de entre los posibles valores que puede tomar. Es el valor por defecto, es decir, el que tiene la propiedad si no establecemos uno distinto.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<p>En la propiedad <code>font-style:</code> <code>normal</code> establece que el tipo de fuente no es <code>italic</code> ni <code>oblique</code>.</p>
+<p>El la propiedad <code>font-size:</code> <code>normal</code>se establece al tamaño de la fuente al tamaño que esté establecido en el User Agent.</p>
diff --git a/files/es/conflicting/web/css/width/index.html b/files/es/conflicting/web/css/width/index.html
new file mode 100644
index 0000000000..ade93e4cf9
--- /dev/null
+++ b/files/es/conflicting/web/css/width/index.html
@@ -0,0 +1,51 @@
+---
+title: auto
+slug: conflicting/Web/CSS/width
+tags:
+  - CSS
+  - CSS:Referencias
+  - Todas_las_Categorías
+translation_of: Web/CSS/width
+translation_of_original: Web/CSS/auto
+original_slug: Web/CSS/auto
+---
+<p>
+</p><p>&lt;&lt; <a href="es/Gu%c3%ada_de_referencia_de_CSS">Volver</a>
+</p>
+<h3 id="Resumen" name="Resumen"> Resumen </h3>
+<p>Un valor computado automáticamente por el 'useragent.'
+</p><p>Usando el valor <i>auto</i> en cualquier propiedad, dejamos al navegador que calcule el valor requerido. </p><p><br>
+FIXME
+</p>
+<h3 id="Ejemplos" name="Ejemplos"> Ejemplos </h3>
+<pre class="eval">div {
+   height: 600px;
+   border: 1px solid #000;
+}
+</pre>
+<pre class="eval">div img {
+   height: auto;
+   border: 1px solid red;
+}
+</pre>
+<h3 id="Se_utiliza_en" name="Se_utiliza_en"> Se utiliza en </h3>
+<ul><li> {{ Cssxref("overflow") }}
+</li><li> {{ Cssxref("cursor") }}
+</li><li> {{ Cssxref("width") }}
+</li><li> {{ Cssxref("marker-offset") }}
+</li><li> {{ Cssxref("margin") }}
+</li><li> margin-* (left|bottom|top|right|start|end)
+</li><li> {{ Cssxref("bottom") }}
+</li><li> {{ Cssxref("left") }}
+</li><li> {{ Cssxref("table-layout") }}
+</li><li> {{ Cssxref("z-index") }}
+</li><li> {{ Cssxref("-moz-column-width") }}
+</li></ul>
+<p><br>
+</p>
+<div class="noinclude">
+<p><span class="comment">Categorías</span>
+<span class="comment">Interwiki Languages</span>
+</p>
+</div>
+{{ languages( { "en": "en/CSS/auto" } ) }}
diff --git a/files/es/conflicting/web/guide/index.html b/files/es/conflicting/web/guide/index.html
new file mode 100644
index 0000000000..e1fb2513bd
--- /dev/null
+++ b/files/es/conflicting/web/guide/index.html
@@ -0,0 +1,61 @@
+---
+title: Desarrollo Web
+slug: conflicting/Web/Guide
+tags:
+  - Desarrollo_Web
+  - Todas_las_Categorías
+translation_of: Web/Guide
+translation_of_original: Web_Development
+original_slug: Desarrollo_Web
+---
+<p>
+</p>
+<div class="callout-box"><b><a class="external" href="http://www.w3c.es/Divulgacion/Guiasbreves/WebSemantica">Guía Breve de Web Semántica</a></b> <br>
+Una magnífica introducción al tema.</div> <div>
+<div>
+<p>El <b>Desarrollo Web</b> abarca todos los aspectos necesarios para desarrollar un sitio o aplicación Web. Esto implica múltiples tecnologías, la mayoría cuentan con una sección específica en este wiki. En esta sección trataremos el tema desde una perspectiva más general.
+</p>
+</div>
+<table class="topicpage-table">
+<tbody><tr><td>
+<h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"> <a>Documentación</a> </h4>
+<dl><dt> <a class="external" href="http://www.w3c.es/Divulgacion/Guiasbreves/IndependenciaDispositivo">Guía Breve de Independencia de Dispositivo</a>
+</dt><dd> <small>"hacer la Web universal y accesible para cualquier persona, en cualquier sitio, en cualquier momento y usando cualquier dispositivo"</small>
+</dd></dl>
+<dl><dt> <a href="es/Selecci%c3%b3n_de_modo_en_Mozilla">Selección de modo en Mozilla</a>
+</dt><dd> <small>Este documento describe cómo Mozilla utiliza la declaración de DOCTYPE para determinar el modo de renderizado más apropiado para visualizar una página web. </small>
+</dd></dl>
+<dl><dt> <a href="es/Modo_casi_est%c3%a1ndar_de_Gecko">El modo casi estándar de Gecko</a>
+</dt><dd> <small>Además de los modos tradicionales, estándar y quirks, el motor gecko nos ofrece este modo intermedio. Puede que te interese.</small>
+</dd></dl>
+<dl><dt> <a class="external" href="http://www.mozilla.org/docs/web-developer/faq.html">Mozilla Web Author FAQ (en)</a>
+</dt><dd> <small>This document answers questions that Web authors ask frequently specifically in connection with Mozilla and other Gecko-based browsers such as Firefox.</small>
+</dd></dl>
+<p><span class="alllinks"><a>Ver más...</a></span>
+</p>
+</td> <td>
+<h4 id="Comunidad" name="Comunidad"> Comunidad </h4>
+<ul><li> En MozillaES
+<ul><li> <a class="external" href="http://www.mozillaes.org/index.php?option=com_forum&amp;Itemid=122&amp;page=viewforum&amp;f=13">Desarrollo web (HTML, CSS...)</a> </li></ul>
+</li></ul>
+<ul><li> En la comunidad Mozilla... en inglés
+</li></ul>
+<p>{{ DiscussionList("dev-web-development", "mozilla.dev.web-development") }}
+</p><p><span class="alllinks"><a href="es/Desarrollo_Web/Comunidad">Ver más...</a></span>
+</p>
+<h4 id="Herramientas" name="Herramientas"> Herramientas </h4>
+<ul><li> <a class="link-https" href="https://addons.mozilla.org/extensions/moreinfo.php?id=60&amp;application=firefox">Web Developer extension</a>
+</li><li> <a href="es/Venkman">Venkman</a>, the JavaScript debugger
+</li><li> <a href="es/DOM_Inspector">DOM Inspector</a>
+</li></ul>
+<p><span class="alllinks"><a>Ver más...</a></span>
+</p>
+<h4 id="Temas_relacionados" name="Temas_relacionados"> Temas relacionados </h4>
+<dl><dd><a href="es/HTML">HTML</a>, <a href="es/CSS">CSS</a>, <a href="es/XHTML">XHTML</a>, <a href="es/XML">XML</a>, <a href="es/AJAX">AJAX</a>, <a href="es/JavaScript">JavaScript</a>, <a href="es/Est%c3%a1ndares_Web">Estándares Web</a>
+</dd></dl>
+</td> </tr> </tbody></table>
+<p><span class="comment">Categorías</span>
+</p><p><span class="comment">Interwiki Language Links</span>
+</p>
+</div>
+{{ languages( { "de": "de/Webentwicklung", "en": "en/Web_Development", "fr": "fr/D\u00e9veloppement_Web", "it": "it/Sviluppo_Web", "ja": "ja/Web_Development", "pl": "pl/Programowanie_WWW" } ) }}
diff --git a/files/es/conflicting/web/guide/mobile/index.html b/files/es/conflicting/web/guide/mobile/index.html
new file mode 100644
index 0000000000..028d0c71ed
--- /dev/null
+++ b/files/es/conflicting/web/guide/mobile/index.html
@@ -0,0 +1,19 @@
+---
+title: Mobile Web development
+slug: conflicting/Web/Guide/Mobile
+tags:
+  - Mobile
+  - NeedsTranslation
+  - TopicStub
+  - Web Development
+translation_of: Web/Guide/Mobile
+translation_of_original: Web_Development/Mobile
+original_slug: Web_Development/Mobile
+---
+<p>Developing web sites to be viewed on mobile devices requires approaches that ensure a web site works as well on mobile devices as it does on desktop browsers. The following articles describe some of these approaches.</p>
+<ul>
+  <li><a class="vt-p" href="/en/Web_Development/Mobile/Mobile-friendliness" title="/en/Web_development/Mobile/Mobile-friendliness">What is mobile-friendliness?</a></li>
+  <li><a class="vt-p" href="/en/Web_Development/Mobile/Separate_sites" title="en/Web_development/Mobile/Separate sites">Separate sites</a></li>
+  <li><a class="vt-p" href="/en/Web_Development/Mobile/Responsive_design" title="/en/Web_development/Mobile/Responsive design">Responsive design</a></li>
+  <li><a class="vt-p" href="/en/Web_development/Mobile/A_hybrid_approach" title="A New Approach to Web Applications (external)">A hybrid approach</a></li>
+</ul>
diff --git a/files/es/conflicting/web/html/element/index.html b/files/es/conflicting/web/html/element/index.html
new file mode 100644
index 0000000000..ebde8fbff4
--- /dev/null
+++ b/files/es/conflicting/web/html/element/index.html
@@ -0,0 +1,600 @@
+---
+title: Lista de Elementos HTML5
+slug: conflicting/Web/HTML/Element
+translation_of: Web/HTML/Element
+translation_of_original: Web/Guide/HTML/HTML5/HTML5_element_list
+original_slug: HTML/HTML5/HTML5_lista_elementos
+---
+<p>Todos los <strong>elementos del estandar HTML5</strong> están listados aquí, descritos por su etiqueta de apertura y agrupados por su función. Contrariamente al <a href="/en-US/docs/HTML/Element" title="HTML/Element">indice de elementos HTML</a> el cual lista todas las posibles etiquetas, estandar, no-estandar, válidas, obsoletas o aquellas en desuso, esta lista solamente los elementos válidos de HTML5. Solamente aquellos elementos listados aquí son los que deberían ser usados en nuevos sitios Web.</p>
+
+<p>El simbolo <a href="/en-US/docs/HTML/HTML5"><img alt="This element was added as part of HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a> indica que el elemento fue añadido en HTML5. Nótese que otros elementos listados aqui pueden haber sido modificados o extendido en su significado por la especificación HTML5.</p>
+
+<h2 id="Elemento_raíz">Elemento raíz</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Elemento</td>
+   <td>Descripcion</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("&lt;!DOCTYPE html&gt;")}}</td>
+   <td>Define que el documento esta bajo el estandar de HTML 5</td>
+  </tr>
+ </tbody>
+</table>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("html")}}</td>
+   <td>Representa la raíz de un documento HTML o XHTML. Todos los demás elementos deben ser descendientes de este elemento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Metadatos_del_documento">Metadatos del documento</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("head")}}</td>
+   <td>Representa una colección de metadatos acerca del documento, incluyendo enlaces a, o definiciones de, scripts y hojas de estilo.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("title")}}</td>
+   <td>Define el título del documento, el cual se muestra en la barra de título del navegador o en las pestañas de página. Solamente puede contener texto y cualquier otra etiqueta contenida no será interpretada.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("base")}}</td>
+   <td>Define la URL base para las URLs relativas en la página.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("link")}}</td>
+   <td>Usada para enlazar JavaScript y CSS externos con el documento HTML actual.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("meta")}}</td>
+   <td>Define los metadatos que no pueden ser definidos usando otro elemento HTML.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("style")}}</td>
+   <td>Etiqueta de estilo usada para escribir CSS en línea.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Scripting">Scripting</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("script")}}</td>
+   <td>Define ya sea un script interno o un enlace hacia un script externo. El lenguaje de programación es JavaScript</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("noscript")}}</td>
+   <td>Define un contenido alternativo a mostrar cuando el navegador no soporta scripting.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Secciones">Secciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("body")}}</td>
+   <td>
+    <div>Representa el contenido principal de un documento HTML. Solo hay un elemento <code>&lt;body&gt;</code> en un documento.</div>
+   </td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("section")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define una sección en un documento.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("nav")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define una sección que solamente contiene enlaces de navegación</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("article")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define contenido autónomo que podría existir independientemente del resto del contenido.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("aside")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define algunos contenidos vagamente relacionados con el resto del contenido de la página. Si es removido, el contenido restante seguirá teniendo sentido</td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/HTML/Element/Heading_Elements"><code>&lt;h1&gt;,&lt;h2&gt;,&lt;h3&gt;,&lt;h4&gt;,&lt;h5&gt;,&lt;h6&gt;</code></a></td>
+   <td>Los elemento de cabecera  implementan seis niveles de cabeceras de documentos; <code>&lt;h1&gt;</code> es la de mayor y <code>&lt;h6&gt;</code> es la de menor importancia. Un elemento de cabecera describe brevemente el tema de la sección que introduce.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("header")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define la cabecera de una página o sección. Usualmente contiene un logotipo, el título del sitio Web y una tabla de navegación de contenidos.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("footer")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define el pie de una página o sección. Usualmente contiene un mensaje de derechos de autoría, algunos enlaces a información legal o direcciones para dar información de retroalimentación.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("address")}}</td>
+   <td>Define una sección que contiene información de contacto.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("main")}}<a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define el contenido principal o importante en el documento. Solamente existe un elemento <code>&lt;main&gt;</code> en el documento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Agrupación_de_Contenido">Agrupación de Contenido</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("p")}}</td>
+   <td>Define una parte que debe mostrarse como un párrafo.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("hr")}}</td>
+   <td>Representa un quiebre temático entre párrafos de una sección o articulo o cualquier contenido.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("pre")}}</td>
+   <td>Indica que su contenido esta preformateado y que este formato debe ser preservado.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("blockquote")}}</td>
+   <td>Representa un contenido citado desde otra fuente.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("ol")}}</td>
+   <td>Define una lista ordenada de artículos.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("ul")}}</td>
+   <td>Define una lista de artículos sin orden.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("li")}}</td>
+   <td>Define un artículo de una lista enumerada.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("dl")}}</td>
+   <td>Define una lista de definiciones, es decir, una lista de términos y sus definiciones asociadas.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("dt")}}</td>
+   <td>Representa un término definido por el siguiente <code>&lt;dd&gt;</code>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("dd")}}</td>
+   <td>Representa la definición de los términos listados antes que él.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("figure")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa una figura ilustrada como parte del documento.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("figcaption")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa la leyenda de una figura.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("div")}}</td>
+   <td>Representa un contenedor genérico sin ningún significado especial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Semántica_a_nivel_de_Texto">Semántica a nivel de Texto</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("a")}}</td>
+   <td>Representa un <em>hiperenlace</em>, enlazando a otro recurso.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("em")}}</td>
+   <td>Representa un texto <em>enfatizado</em>, como un acento de intensidad.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("strong")}}</td>
+   <td>Representa un texto especialmente <em>importante</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("small")}}</td>
+   <td>Representa un <em>comentario aparte</em>, es decir, textos como un descargo de responsabilidad o una nota de derechos de autoría, que no son esenciales para la comprensión del documento.<code> </code></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("s")}}</td>
+   <td>Representa contenido que <em>ya</em> <em>no es exacto o relevante</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("cite")}}</td>
+   <td>Representa el <em>título de una obra</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("q")}}</td>
+   <td>Representa una <em>cita textual</em> inline.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("dfn")}}</td>
+   <td>Representa un término cuya <em>definición</em>  está contenida en su contenido ancestro más próximo.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("abbr")}}</td>
+   <td>Representa una <em>abreviación </em>o un <em>acrónimo</em> ; la expansión de la abreviatura puede ser representada por el atributo <code>title</code>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("data")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Asocia un <em>equivalente legible por máquina </em>a sus contenidos. (Este elemento está sólamente en la versión de la WHATWG del estandar HTML, y no en la versión de la W3C de HTML5).</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("time")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un valor de <em>fecha </em>y <em>hora</em>; el equivalente legible por máquina puede ser representado en el atributo <span style="font-family: courier new,andale mono,monospace; line-height: normal;">datetime</span>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("code")}}</td>
+   <td>Representa un <em>código de </em><em>ordenador</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("var")}}</td>
+   <td>Representa a una <em>variable, </em>es decir<em>, una expresión matemática o contexto de programación, un identificador que represente a una constante, un símbolo que identifica una cantidad física, un parámetro de una función o un marcador de posición en prosa</em><em>.</em></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("samp")}}</td>
+   <td>Representa la <em>salida</em> de un programa o un ordenador.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("kbd")}}</td>
+   <td>Representa la <em>entrada de usuario</em>, por lo general desde un teclado, pero no necesariamente, este puede representar otras formas de entrada de usuario, como comandos de voz transcritos.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("sub")}},{{HTMLElement("sup")}}</td>
+   <td>Representan un <em>subíndice</em> y un <em>superíndice, </em>respectivamente.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("i")}}</td>
+   <td>Representa un texto en una voz o estado de ánimo <em>alterno</em>, o por lo menos de diferente calidad, como una designación taxonómica, un término técnico, una frase idiomática, un pensamiento o el nombre de un barco.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("b")}}</td>
+   <td>Representa un texto hacia el cual se llama la atención para <em>propósitos utilitarios. </em> No confiere ninguna importancia adicional y no implica una voz alterna.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("u")}}</td>
+   <td>Representa una anotación no textual <em>sin-articular</em>, como etiquetar un texto como mal escrito o etiquetar un nombre propio en texto en chino.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("mark")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa texto resaltado con propósitos de <em>referencia</em>, es decir por su relevancia en otro contexto.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("ruby")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>
+    <p>Representa contenidos a ser marcados con <em>anotaciones ruby</em>, recorridos cortos de texto presentados junto al texto. Estos son utilizados con regularidad en conjunto a lenguajes de Asia del Este, donde las anotaciones actúan como una guía para la pronunciación, como el <em>furigana</em> japonés.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("rt")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa el <em>texto de una anotación ruby</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("rp")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa los <em>paréntesis </em>alrededor de una anotación ruby, usada para mostrar la anotación de manera alterna por los navegadores que no soporten despliegue estandar para las anotaciones.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("bdi")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un texto que debe ser <em>aislado</em> de sus alrededores para el formateado bidireccional del texto.  Permite incrustar un fragmento de texto con una direccionalidad diferente o desconocida.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("bdo")}}</td>
+   <td>Representa la <em>direccionalidad</em> de sus descendientes con el fin de anular de forma explícita al algoritmo bidireccional Unicode.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("span")}}</td>
+   <td>Representa texto sin un significado específico.  Este debe ser usado cuando <em>ningún otro</em> elemento semántico le confiere un significado adecuado, en cuyo caso, provendrá de atributos globales como <code>class</code>, <code>lang</code>, o <code>dir</code>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("br")}}</td>
+   <td>Representa un <em>salto de línea</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("wbr")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa una <em>oportunidad de salto de línea, </em>es decir, un punto sugerido de envoltura donde el texto de múltiples líneas puede ser dividido para mejorar su legibilidad.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ediciones">Ediciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("ins")}}</td>
+   <td>Define una <em>adición</em> en el documento.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("del")}}</td>
+   <td>Define una <em>remoción</em> del documento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Contenido_incrustado">Contenido incrustado</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("img")}}</td>
+   <td>Representa una <em>imagen</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("iframe")}}</td>
+   <td>Representa un <em>contexto anidado de navegación</em>, es decir, un documento HTML embebido.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("embed")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>punto de integración</em> para una aplicación o contenido interactivo externo que por lo general no es HTML.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("object")}}</td>
+   <td>Representa un <em>recurso externo, </em>que será tratado como una imagen, un sub-documento HTML o un recurso externo a ser procesado por un plugin.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("param")}}</td>
+   <td>Define <em>parámetros</em> para el uso por los plugins invocados por los elementos <code>&lt;object&gt;</code>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("video")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>video</em>, y sus archivos de audio y capciones asociadas, con la interfaz necesaria para reproducirlos. </td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("audio")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>sonido</em> o <em>stream de audio.</em></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("source")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Permite a autores especificar recursos multimedia alternativos para los elementos multimedia como <code>&lt;video&gt;</code> o <code>&lt;audio&gt;</code>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("track")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Permite a autores especificar una <em>pista de texto</em> temporizado para elementos multimedia como <code>&lt;video&gt;</code> o<em> <code>&lt;audio&gt;</code>.</em></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("canvas")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>área de mapa de bits</em>  en el que se pueden utilizar scripts para renderizar gráficos como gráficas, gráficas de juegos o cualquier imagen visual al vuelo.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("map")}}</td>
+   <td>En conjunto con <code>&lt;area&gt;</code>, define un <em>mapa de imagen</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("area")}}</td>
+   <td>En conjunto con <code>&lt;map&gt;</code>, define un <em>mapa de imagen</em>.</td>
+  </tr>
+  <tr>
+   <td>{{SVGElement("svg")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define una <em>imagen vectorial</em> embebida.</td>
+  </tr>
+  <tr>
+   <td>{{MathMLElement("math")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Define una <em>fórmula matemática</em>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Datos_tabulares">Datos tabulares</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("table")}}</td>
+   <td>Representa <em>datos con más de una dimensión.</em></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("caption")}}</td>
+   <td>Representa el <em>título de una tabla</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("colgroup")}}</td>
+   <td>Representa un <em>conjunto de una o más columnas</em> de una tabla.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("col")}}</td>
+   <td>Representa una <em>columna </em>de una tabla.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("tbody")}}</td>
+   <td>Representa el bloque de filas que describen los <em>datos concretos </em>de una tabla.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("thead")}}</td>
+   <td>Representa el bloque de filas que describen las <em>etiquetas de columna</em> de una tabla.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("tfoot")}}</td>
+   <td>Representa los bloques de filas que describen los <em>resúmenes de columna</em> de una tabla.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("tr")}}</td>
+   <td>Representa una <em>fila de celdas </em>en una tabla.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("td")}}</td>
+   <td>Representa una <em>celda de datos</em> en una tabla.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("th")}}</td>
+   <td>
+    <p>Representa una <em>celda encabezado </em>en una tabla. </p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Formularios">Formularios</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("form")}}</td>
+   <td>Representa un <em>formulario</em>, consistiendo de controles que puede ser enviado a un servidor para procesamiento.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("fieldset")}}</td>
+   <td>Representa un <em>conjunto de controles</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("legend")}}</td>
+   <td>Representa el <em>título </em>de un <code>&lt;fieldset&gt;</code>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("label")}}</td>
+   <td>Representa el <em>título</em> de un control de formulario.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input")}}</td>
+   <td>Representa un <em>campo de datos escrito </em>que permite al usuario editar los datos.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("button")}}</td>
+   <td>Representa un <em>botón</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("select")}}</td>
+   <td>Representa un control que permite la <em>selección entre un conjunto de opciones</em>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("datalist")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>conjunto de opciones predefinidas </em>para otros controles.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("optgroup")}}</td>
+   <td>Representa un <em>conjunto de opciones, </em>agrupadas lógicamente.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("option")}}</td>
+   <td>Representa una <em>opción</em> en un elemento <code>&lt;select&gt;</code>, o una sugerencia de un elemento <code>&lt;datalist&gt;</code>.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("textarea")}}</td>
+   <td>Representa un <em>control de edición de texto multilínea.</em></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("keygen")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un control de <em>par generador de llaves.</em></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("output")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa el <em>resultado de un cálculo.</em></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("progress")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa el <em>progreso de finalización </em>de una tarea.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("meter")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa la <em>medida </em>escalar (o el valor fraccionario) dentro de un rango conocido.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Elementos_interactivos">Elementos interactivos</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Elemento</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("details")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>widget</em> desde el que un usuario puede obtener información o controles adicionales.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("summary")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>resumen, título</em> o <em>leyenda</em> para un elemento <code>&lt;details&gt;</code> dado.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("command")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa un <em>comando</em> que un usuario puede invocar.</td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("menu")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
+   <td>Representa una <em>lista de comandos</em> .</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/HTML/HTML5" title="HTML/HTML5">Un conjunto de documentos sobre HTML5</a>.</li>
+ <li>La <a href="/en-US/docs/HTML/Element" title="HTML/Element">referencia de todos las etiquetas HTML</a>, incluso elementos no validos en HTML5.</li>
+ <li>Otra manera de listar las etiquetas: la <a href="http://joshduck.com/periodic-table.html" title="http://joshduck.com/periodic-table.html">Tabla Periodica de elementos HTML5</a> por Josh Duck.</li>
+</ul>
diff --git a/files/es/conflicting/web/html/global_attributes/index.html b/files/es/conflicting/web/html/global_attributes/index.html
new file mode 100644
index 0000000000..5c1df0adc7
--- /dev/null
+++ b/files/es/conflicting/web/html/global_attributes/index.html
@@ -0,0 +1,28 @@
+---
+title: Atributo global
+slug: conflicting/Web/HTML/Global_attributes
+tags:
+  - CodingScripting
+  - Glosario
+  - HTML
+  - atributo
+translation_of: Web/HTML/Global_attributes
+translation_of_original: Glossary/Global_attribute
+original_slug: Glossary/Atributo_global
+---
+<p>Los<strong> Atributos Globales</strong> son {{glossary("attribute","atributos")}} que pueden ser usados en todos los {{glossary("element","elementos")}} (aunque a veces no tienen efecto en algunos de ellos).</p>
+
+<p>Algunos atributos se pueden utilizar en cualquier elemento HTML:</p>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales/dir"><strong>dir</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/lang"><strong>lang</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/style"><strong>style</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/id"><strong>id</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/class"><strong>class</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/tabindex"><strong>tabindex</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/accesskey"><strong>accesskey</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/title"><strong>title</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/hidden"><strong>hidden</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/data-*"><strong>data-*</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/contextmenu"><strong>contextmenu</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/contenteditable"><strong>contenteditable</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/translate"><strong>translate</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/spellcheck"><strong>spellcheck</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/draggable"><strong>draggable</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/dropzone"><strong>dropzone</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemid"><strong>itemid</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemprop"><strong>itemprop</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemref"><strong>itemref</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemscope"><strong>itemscope</strong></a>, y <a href="/es/docs/Web/HTML/Atributos_Globales/itemtype"><strong>itemtype</strong></a>.</li>
+ <li>Tanto <strong>xml:lang</strong> como <strong>xml:base</strong>, obsoletos, heredados de las especificaciones de {{glossary("XHTML")}} y mantenidos por razones de compatibilidad.</li>
+ <li>Los múltiples atributos <strong><a href="https://developer.mozilla.org/es/docs/Web/Accessibility/ARIA">aria-*</a></strong>, para mejorar la accesibilidad.</li>
+ <li>Los atributos de manejadores de eventos: <strong>onabort</strong>, <strong>onautocomplete</strong>, <strong>onautocompleteerror</strong>, <strong>onblur</strong>, <strong>oncancel</strong>, <strong>oncanplay</strong>, <strong>oncanplaythrough</strong>, <strong>onchange</strong>, <strong>onclick</strong>, <strong>onclose</strong>, <strong>oncontextmenu</strong>, <strong>oncuechange</strong>, <strong>ondblclick</strong>, <strong>ondrag</strong>, <strong>ondragend</strong>, <strong>ondragenter</strong>, <strong>ondragexit</strong>, <strong>ondragleave</strong>, <strong>ondragover</strong>, <strong>ondragstart</strong>, <strong>ondrop</strong>, <strong>ondurationchange</strong>, <strong>onemptied</strong>, <strong>onended</strong>, <strong>onerror</strong>, <strong>onfocus</strong>, <strong>oninput</strong>, <strong>oninvalid</strong>, <strong>onkeydown</strong>, <strong>onkeypress</strong>, <strong>onkeyup</strong>, <strong>onload</strong>, <strong>onloadeddata</strong>, <strong>onloadedmetadata</strong>, <strong>onloadstart</strong>, <strong>onmousedown</strong>, <strong>onmouseenter</strong>, <strong>onmouseleave</strong>, <strong>onmousemove</strong>, <strong>onmouseout</strong>, <strong>onmouseover</strong>, <strong>onmouseup</strong>, <strong>onmousewheel</strong>, <strong>onpause</strong>, <strong>onplay</strong>, <strong>onplaying</strong>, <strong>onprogress</strong>, <strong>onratechange</strong>, <strong>onreset</strong>, <strong>onresize</strong>, <strong>onscroll</strong>, <strong>onseeked</strong>, <strong>onseeking</strong>, <strong>onselect</strong>, <strong>onshow</strong>, <strong>onsort</strong>, <strong>onstalled</strong>, <strong>onsubmit</strong>, <strong>onsuspend</strong>, <strong>ontimeupdate</strong>, <strong>ontoggle</strong>, <strong>onvolumechange</strong>, <strong>onwaiting</strong>.</li>
+</ul>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<ul>
+ <li>Los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> de HTML.</li>
+</ul>
diff --git a/files/es/conflicting/web/html/global_attributes/spellcheck/index.html b/files/es/conflicting/web/html/global_attributes/spellcheck/index.html
new file mode 100644
index 0000000000..7d8b76554b
--- /dev/null
+++ b/files/es/conflicting/web/html/global_attributes/spellcheck/index.html
@@ -0,0 +1,74 @@
+---
+title: Control de la corrección ortográfica en formularios HTML
+slug: conflicting/Web/HTML/Global_attributes/spellcheck
+tags:
+  - Desarrollo_Web
+  - Gestión de configuración
+  - HTML
+  - Intermedio
+  - Todas_las_Categorías
+  - XHTML
+translation_of: Web/HTML/Global_attributes/spellcheck
+translation_of_original: Web/HTML/Controlling_spell_checking_in_HTML_forms
+original_slug: Control_de_la_corrección_ortográfica_en_formularios_HTML
+---
+<p><span class="seoSummary">{{ gecko_minversion_header("1.8.1") }} Firefox 2 incorpora un corrector ortográfico para las áreas y los campos de texto de los formularios web.</span> Usando la interfaz "about:config" el usuario puede activar o desactivar el corrector, además, puede indicar si desea o no habilitar la corrección ortográfica y si debe habilitarse para áreas y campos de texto o sólo en áreas de texto.</p>
+
+<p>Por defecto, se comprueban las áreas de texto y los documentos en <code>designMode</code>, pero los campos de texto no. Esto se debe a que sería una distracción para los usuarios si Firefox marca cosas como el ID de usuario y direcciones de correo electrónico como errores.</p>
+
+<p>Sin embargo, puede haber situaciones en las que este comportamiento no sea el más apropiado. Por ejemplo, si un área de texto va a ser usada para editar código HTML, u otro tipo de datos que no sean texto simple, el corrector ortográfico puede resultar un estorbo en vez de una ayuda. También puede haber casos en los que un sitio quiera recomendarle a Firefox que active la corrección ortográfica en un campo de texto específico; por ejemplo, para los cuadros de búsqueda y los campos de asunto del correo electrónico.</p>
+
+<p>Si un sitio web desea recomendar si usar o no la corrección ortográfica para un elemento <code>&lt;input type="text"&gt;</code> concreto, se puede usar el atributo <code>spellcheck</code>, especificando el valor <code>true</code> para recomendar la activación del corrector, o <code>false</code> para desaconsejarla.</p>
+
+<p>Ten en cuenta que la recomendación del sitio puede ser ignorado si el usuario ha desactivado la corrección ortográfica en su totalidad fijando <code>layout.spellcheckDefault</code> a "0". Si <code>layout.spellcheckDefault</code> tiene cualquier otro valor, el recomendaciones se tienen en cuenta.</p>
+
+<p>Por ejemplo, el siguiente código HTML recomienda el uso del corrector en un campo de texto simple:</p>
+
+<pre class="eval"><span class="nowiki">&lt;input type="text" size="50" spellcheck="true"&gt;</span>
+</pre>
+
+<p>Del mismo modo, se puede desaconsejar la corrección en un área de texto con un código HTML como este:</p>
+
+<pre class="eval"><span class="nowiki">&lt;textarea spellcheck="false"&gt;&lt;/textarea&gt;</span>
+</pre>
+
+<p>Se puede controlar un documento en <code>designMode</code> (habitualmente usado para la edición de texto enriquecido), poniendo el atributo <code>spellcheck</code> en la etiqueta <code>&lt;body&gt;</code> de los documentos. <span class="comment">N.T. Esto del designMode no me gusta</span></p>
+
+<p>También se puede usar el atributo <code>spellcheck</code> en otros elementos, como en los elementos <code>&lt;span&gt;</code> o <code>&lt;div&gt;</code>, en tal caso, cualquier elemento <code>&lt;input&gt;</code> contenido por estos elementos heredará ese atributo. Los elementos <code>&lt;input&gt;</code> que no tengan un atributo <code>spellcheck</code> lo heredarán de sus padres, y si estos tampoco lo tienen, se aplicará la configuración por defecto.</p>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: html">&lt;div spellcheck="true"&gt;
+  &lt;label&gt;Escribe una oración: &lt;/label&gt;&lt;input type="text" size="50"&gt;
+  &lt;br&gt;
+  &lt;label&gt;Escriba otra: &lt;/label&gt;&lt;input type="text" size="50"&gt;
+&lt;/div&gt;
+&lt;br&gt;
+&lt;label&gt;Escriba una tercera: &lt;/label&gt;&lt;input type="text" size="50"&gt;
+</pre>
+
+<p>En este fragmento de código HTML, los dos primeros campos de texto se comprueban mientras que el tercero no.</p>
+
+<p id="lang">{{ h1_gecko_minversion("Controlar el idioma del corrector ortográfico", "9.0") }}</p>
+
+<p>A partir de Gecko 9.0 {{ geckoRelease("9.0") }}, el corrector ortográfico utiliza un elemento {{ HTMLElement("input") }} con atributo {{ htmlattrxref("lang", "input") }} para determinar el idioma predeterminado del corrector ortográfico. Si {{ HTMLElement("input") }} no tiene atributo <code>lang</code>, el atributo se busca en cada elemento padre sucesivamente y hacia arriba, hacia el nodo raíz hasta encontrar uno.</p>
+
+<p>De esta manera, si un usuario tiene a la vez instalados los diccionarios Frances e Ingles, y un elemento editable tiene <code>lang="en"</code>, el diccionario Inglés se utilizará automáticamente para ese elemento.</p>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: html">&lt;html lang="en"&gt;
+&lt;body&gt;
+  &lt;textarea&gt;&lt;/textarea&gt;
+  &lt;textarea lang="fr"&gt;&lt;/textarea&gt;
+  &lt;div lang="ru"&gt;
+    &lt;textarea&gt;&lt;/textarea&gt;
+  &lt;/div&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+--
+
+<p>En este fragmento de código HTML, el primer {{ HTMLElement("textarea") }} será revisado en Inglés, el segundo en Francés, y el tercero en Ruso.
+
+</p><p>Si un elemento especifica un idioma, y el usuario no tiene instalado el diccionario para ese idioma, corrector ortográfico estrá desactivado por defecto, aunque el usuario puede elegir activarlo de forma manual.</p>
diff --git a/files/es/conflicting/web/http/basics_of_http/mime_types/index.html b/files/es/conflicting/web/http/basics_of_http/mime_types/index.html
new file mode 100644
index 0000000000..7e325a7d49
--- /dev/null
+++ b/files/es/conflicting/web/http/basics_of_http/mime_types/index.html
@@ -0,0 +1,48 @@
+---
+title: Tipo MIME incorrecto en archivos CSS
+slug: conflicting/Web/HTTP/Basics_of_HTTP/MIME_types
+tags:
+  - CSS
+  - Todas_las_Categorías
+translation_of: Web/HTTP/Basics_of_HTTP/MIME_types
+translation_of_original: Incorrect_MIME_Type_for_CSS_Files
+original_slug: Tipo_MIME_incorrecto_en_archivos_CSS
+---
+<h3 id=".C2.BFCu.C3.A1l_es_el_problema.3F"> ¿Cuál es el problema? </h3>
+<p>Quizás encuentres una web que use CSS con un diseño pobre en Netscape 7.x o cualquier navegador basado en Gecko como Mozilla, mientras que en Internet Explorer se muestra correctamente. Una de las razones más comunes para que esto suceda es una configuración inapropiada del servidor que tiene almacenado el archivo CSS. Algunos servidores Apache e iPlanet asocian archivos con extensión .CSS con un tipo incorrecto MIME como el "text/plain" o "application/x-pointplus". En algunos casos, Netscape 7.x y Mozilla ignoran el archivo CSS porque tiene un tipo MIME incorrecto y usan una hoja de estilo por defecto que causa que el diseño sea diferente del que se pretendía por parte del desarrollador web.
+</p>
+<h3 id=".C2.BFCu.C3.A1ndo_ocurre_esto.3F"> ¿Cuándo ocurre esto? </h3>
+<p>La <a class="external" href="http://www.w3.org/TR/REC-CSS2/conform.html#text-css">especificación</a> W3C menciona que los archivos CSS deben ser almacenados con el tipo MIME "text/css". Mozilla y Netscape 7.x, cuando son usados en "modo estricto" siguen la especificación al pie de la letra y esperan que el archivo CSS este almacenado con el tipo MIME correcto (El "Modo estricto" se activa teniendo una Definición del Tipo de Documento estricta en la primera línea de la página HTML). En el "modo no estricto", ambas aplicaciones tolerarán el tipo MIME incorrecto y usarán la hoja de estilo adjunta a pesar de la configuración errónea del servidor. Esto significa que no puedes tener documentos en modo "estricto" con un servidor mal configurado. Internet Explorer te permite saltarte esta desconfiguración al no tener en cuenta el tipo MIME que el servidor proporciona en la cabecera del http.
+</p>
+<h3 id=".C2.BFQu.C3.A9_puedo_hacer_para_cambiar_esto.3F"> ¿Qué puedo hacer para cambiar esto? </h3>
+<p>Debes comentar a los administradores del servidor que actualicen el archivo de configuración de tipo MIME en el servidor web.
+</p><p>Esta cuestión, en los servidores web iPlanet/Netscape ya ha sido puesta en conocimiento por el vendedor, quien ha añadido una <a href="#Cambiando_el_tipo_MIME_en_servidores_iPlanet.2FSun">nota técnica</a> en su base de conocimientos.
+</p><p>Si usas Apache, puedes cambiar también la configuración del archivo .htaccess en tu directorio raíz (El archivo .htaccess es un archivo de solo lectura que maneja varias cosas incluyendo los tipos MIME). Añade esta línea a tu archivo .htaccess:
+</p>
+<pre>AddType text/css .css</pre>
+<p>Ten en cuenta que algunos Webmasters han deshabilitado el uso del archivo de configuración .htaccess en sus servidores Apache porque tiene un pequeño impacto de rendimiento.
+</p>
+<h3 id="Conclusi.C3.B3n"> Conclusión </h3>
+<p>Usar un tipo de definición de documento estricta con Mozilla dará lugar a que el servidor que aloja tus páginas web necesite ser configurado apropiadamente. Hay varias soluciones a este problema, pero la más efectiva es tener el tipo MIME correcto asociado a los archivos .css. Comenta al Webmaster que arregle esto por ti, ¡todo el mundo que publique documentos html en modo estricto te lo agradecerá!
+</p>
+<h3 id="Cambiando_el_tipo_MIME_en_servidores_iPlanet.2FSun"> Cambiando el tipo MIME en servidores iPlanet/Sun </h3>
+<p><b>Problema</b>
+</p><p>Los usuarios se encuentran con un dialogo de <i>Salvar como</i> con el tipo de contenido <i>application/x-pointplus</i> o con el contenido del archivo CSS representado como texto en el navegador cuando una pagina incluye una Hoja de Estilo con la extensión .css.
+</p><p><b>Solución</b>
+</p><p>El tipo de archivo .css no esta enlazado a las hojas de estilo en los tipos por defecto MIME incluidos en el Enterprise Server. Puedes cambiar el enlace en la pagina de tipos globales MIME.
+</p><p>Para acceder a esta página, desde el admin server acceder a <i>Preferencias del Servidor</i>, <i>MIME Types</i>, y establece el tipo MIME a .css a <i>text/css</i> en vez de <i>application/x-pointplus</i>.
+</p><p>Si el problema persiste, desactiva el keepalive añadiendo "KeepAliveTimeout 0" al <i>magnus.conf</i>
+</p><p>Basado en: <a class="external" href="http://sunsolve.sun.com">SunSolve, Sun Microsystems</a>
+</p>
+<h3 id="Fuentes_adicionales"> Fuentes adicionales </h3>
+<p><a href="es/Configurar_correctamente_los_tipos_MIME_del_servidor">Configurar correctamente los tipos MIME del servidor</a>
+</p><p><a class="external" href="http://www.htmlhelp.com/faq/html/media.html#garbled-media">Sobre garbled media</a>
+</p>
+<div class="originaldocinfo">
+<h3 id="Informaci.C3.B3n_original_del_documento"> Información original del documento </h3>
+<ul><li> Autor(es): Tristan Nitot
+</li><li> Última actualización: March 18th, 2002
+</li><li> Copyright © 2001-2003 Netscape.
+</li></ul>
+</div>
+{{ languages( { "en": "en/Incorrect_MIME_Type_for_CSS_Files", "fr": "fr/Type_MIME_incorrect_pour_les_fichiers_CSS", "pl": "pl/Nieprawid\u0142owy_typ_MIME_plik\u00f3w_CSS" } ) }}
diff --git a/files/es/conflicting/web/http/csp/index.html b/files/es/conflicting/web/http/csp/index.html
new file mode 100644
index 0000000000..bb9d56164f
--- /dev/null
+++ b/files/es/conflicting/web/http/csp/index.html
@@ -0,0 +1,40 @@
+---
+title: CSP (Políticas de Seguridad de Contenido)
+slug: conflicting/Web/HTTP/CSP
+tags:
+  - Documento
+  - Referencia
+translation_of: Web/HTTP/CSP
+translation_of_original: Web/Security/CSP
+original_slug: Web/Security/CSP
+---
+<div>{{gecko_minversion_header("2.0")}}</div>
+
+<p><strong>Políticas de Seguridad de Contenido </strong>(CSP) es una capa de seguridad adicional que ayuda a detectar y mitigar cierto tipo de ataques, incluyendo <a href="/en-US/docs/Glossary/Cross-site_scripting">Cross-Site Scripting (XSS)</a> y ataques de inyección de datos. Estos ataques son usados para cualquier cosa desde robo de datos hasta la alteración de su sitio o distribución de malware.</p>
+
+<p>Aunque las Políticas de Seguridad de Contenido fueron incluidas desde Firefox 4, esa implementación, usando la cabecera <code>X-Content-Security-Policy</code>, es anterior a la existencia de una especificacion formal de CSP. Firefox 23 contiene una implementación actualizada de CSP que usa la cabecera <code>Content-Security-Policy</code> sin prefijo y las directivas como están descritas en la especificación W3C CSP 1.0.</p>
+
+<h2 id="Tópicos_de_Políticas_de_Seguridad_de_Contenido">Tópicos de Políticas de Seguridad de Contenido</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Web/Security/CSP/Introducing_Content_Security_Policy">Introducción a Políticas de Seguridad de Contenido</a></dt>
+ <dd>Un resumen de que es y como CSP puede hacer su sitio mas seguro.</dd>
+ <dt><a href="/en-US/docs/Web/Security/CSP/CSP_policy_directives">Directivas de Políticas CSP</a></dt>
+ <dd>Una referencia de las directivas de políticas CSP.</dd>
+ <dt><a href="/en-US/docs/Web/Security/CSP/Using_Content_Security_Policy">Usando Políticas de Seguridad de Contenido</a></dt>
+ <dd>Puede ajustar el comportamiento de CSP configurando el conjunto de las políticas. Esto le permite reducir y ajustar la seguridad para tipos individuales de recursos, basado en las necesidades de su sitio. Este artículo describe como configurar CSP, asi como también habilitarlo para el uso en su sitio.</dd>
+ <dt><a href="/en-US/docs/Web/Security/CSP/Using_CSP_violation_reports">Usando reportes de violación de CSP</a></dt>
+ <dd>Como usar los reportes de violación de las Políticas de Seguridad de Contenido para monitorear los intentos de ataque a su sitio y a sus usuarios.</dd>
+ <dt><a href="/en-US/docs/Security/CSP/Default_CSP_restrictions">Restricciones CSP por defecto</a></dt>
+ <dd>Detalles acerca de las restricciones por defecto reforzadas por CSP.</dd>
+</dl>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Security">Seguridad</a></li>
+ <li><a href="/en-US/docs/HTTP_access_control">Control de acceso HTTP</a></li>
+ <li><a class="link-https" href="http://www.w3.org/TR/CSP/">Especificación CSP 1.0</a></li>
+ <li><a class="link-https" href="http://w3c.github.io/webappsec/specs/content-security-policy/csp-specification.dev.html">Especificación CSP 2</a></li>
+ <li><a href="/docs/Apps/CSP">Restricciones CSP para Aplicaciones Web Públicas</a></li>
+</ul>
diff --git a/files/es/conflicting/web/http/csp_aeae68a149c6fbe64e541cbdcd6ed5c5/index.html b/files/es/conflicting/web/http/csp_aeae68a149c6fbe64e541cbdcd6ed5c5/index.html
new file mode 100644
index 0000000000..96a5cf6d8d
--- /dev/null
+++ b/files/es/conflicting/web/http/csp_aeae68a149c6fbe64e541cbdcd6ed5c5/index.html
@@ -0,0 +1,58 @@
+---
+title: Introducción a Políticas de Seguridad de Contenido
+slug: conflicting/Web/HTTP/CSP_aeae68a149c6fbe64e541cbdcd6ed5c5
+tags:
+  - Documento
+  - Políticas de Seguridad de Contenido
+  - Referencia
+  - Seguridad
+translation_of: Web/HTTP/CSP
+translation_of_original: Web/Security/CSP/Introducing_Content_Security_Policy
+original_slug: Web/Security/CSP/Introducing_Content_Security_Policy
+---
+<p>{{ gecko_minversion_header("2") }}</p>
+
+<p><strong>Políticas de Seguridad de Contenido</strong> (CSP) es una capa de seguridad adicional que ayuda a detectar y mitigar cierto tipo de ataques, incluyendo <a href="https://developer.mozilla.org/en-US/docs/Glossary/Cross-site_scripting">Cross-Site Scripting (XSS)</a> y ataques de inyección de datos. Estos ataques son usados para cualquier cosa desde el robo de datos hasta hasta la alteración de su sitio o la distribución de malware.</p>
+
+<p>CSP esta diseñado para ser completamente compatible hacia atras; los navegadores web que no lo soporten todavía pueden trabajar con servidores que las implementen, y viceversa. Los navegadores web que no soporten CSP simplemente la ignoran, funcionando como es normal, usando la política de mismo origen por defecto para contenido web. Si el sitio no tiene la cabecera CSP, los navegadores web usan en su lugar la <a href="/en-US/docs/Web/Security/Same-origin_policy" title="En/Same origin policy for JavaScript">política de mismo origen</a>.</p>
+
+<p>Habilitar CSP tan fácil como configurar su servidor web para retornar la cabecera HTTP <code>Content-Security-Policy</code>. (Antes de Firefox 23, la cabecera <code>X-Content-Security-Policy</code> era usada). Ver <a href="/en-US/docs/Web/Security/CSP/Using_Content_Security_Policy" title="en/Security/CSP/Using Content Security Policy">Usando Políticas de Seguridad de Contenido</a> para detalles de como configurar y habilitar CSP.</p>
+
+<div class="note"><strong>Nota:</strong> El estándar de Políticas de Seguridad de Contenido <a class="link-https" href="https://dvcs.w3.org/hg/content-security-policy/raw-file/tip/csp-specification.dev.html#meta-http-equiv--x-content-security-policy---html-element" title="https://dvcs.w3.org/hg/content-security-policy/raw-file/tip/csp-specification.dev.html#meta-http-equiv--x-content-security-policy---html-element">especifica</a> que un elemento {{ HTMLElement("meta") }} puede ser usado para configurar una política, pero esta característica todavía no está soportada en Firefox. El soporte para esta característica será añadida según <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=663570" title="https://bugzilla.mozilla.org/show_bug.cgi?id=663570">bug 663570</a>.</div>
+
+<h2 id="Mitigando_cross_site_scripting">Mitigando cross site scripting</h2>
+
+<p>Un objetivo primario de CSP es mitigar y reportar ataques XSS. Los ataques XSS explotan la confianza de los navegadores web en el contenido recibido del servidor. Los scripts maliciosos son ejecutados por la victima del navegador web por que éste confía en el origen del contenido, aún cuando no viene desde donde parece venir.</p>
+
+<p>CSP hace posible a los administradores de servidores reducir o eliminar los vectores por los cuales un ataque XSS puede ocurrir especificando los dominios que el navegador web debe considerar orígenes válidos de scripts ejecutables. Un navegador web compatible con CSP entonces solo ejecutará scripts cargados en archivos fuente recibidos de aquellos dominios permitidos, ignorando todos los demás scripts (incluyendo scripts en línea y atributos HTML de manejo de eventos).</p>
+
+<p>Como una última forma de protección, los sitios que no deseen permitir nunca la ejecución de scripts pueden optar por deshabilitar globalmente la ejecución de scripts.</p>
+
+<h2 id="Mitigando_ataques_de_packet_sniffing">Mitigando ataques de packet sniffing</h2>
+
+<p>En adición a la restricción de los dominos desde los cuales el contenido puede ser cargado, el servidor puede especificar que protocolos son permitidos para su uso; por ejemplo (e idealmente, desde un punto de vista de seguridad), un servidor puede especificar que todo el contenido debe ser cargado usando HTTPS.</p>
+
+<div class="note"><strong>Nota:</strong> Una estrategia de transmisión segura de datos incluye no solo reforzar HTTPS para la transferencia de datos, sino tambien marcar todas las cookies con indicadores seguros y proveer redirecciones automáticas desde páginas HTTP a sus contrapartes en HTTPS.</div>
+
+<div class="note"><strong>Nota:</strong> Los sitios pueden usar tambien la cabecera HTTP  <a href="/en-US/docs/Web/Security/HTTP_strict_transport_security" title="/en/Security/HTTP_Strict_Transport_Security">Strict-Transport-Security</a> para asegurarse de que los navegadores web se conecten solo a traves de un canal encriptado.</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Security/CSP/Using_Content_Security_Policy" title="en/Security/CSP/Using Content Security Policy">Usando las Políticas de Seguridad de Contenido</a></li>
+ <li><a href="/en-US/docs/Web/Security/CSP/CSP_policy_directives" title="en/Security/CSP/CSP policy directives">Directivas de políticas CSP</a></li>
+ <li><a href="/en-US/docs/Web/Security/CSP/Using_CSP_violation_reports" title="en/Security/CSP/Using CSP violation reports">Usando reportes de violación de CSP</a></li>
+</ul>
+
+<h2 id="Especificación">Especificación</h2>
+
+<ul>
+ <li>{{ spec("https://w3c.github.io/webappsec/specs/content-security-policy/", "Políticas de Seguridad de Contenidos (Borradores de Editores)") }}</li>
+ <li>{{ spec("http://www.w3.org/TR/CSP/", "Políticas de Seguridad de Contenido (Recomendación Candidata)") }}</li>
+</ul>
+
+<div class="noinclude">
+<p>{{ languages( { "ja": "ja/Introducing_Content_Security_Policy" } ) }}</p>
+</div>
+
+<p> </p>
diff --git a/files/es/conflicting/web/http/headers/content-security-policy/index.html b/files/es/conflicting/web/http/headers/content-security-policy/index.html
new file mode 100644
index 0000000000..dd1cb8d720
--- /dev/null
+++ b/files/es/conflicting/web/http/headers/content-security-policy/index.html
@@ -0,0 +1,710 @@
+---
+title: Políticas Directivas CSP
+slug: conflicting/Web/HTTP/Headers/Content-Security-Policy
+translation_of: Web/HTTP/Headers/Content-Security-Policy
+translation_of_original: Web/Security/CSP/CSP_policy_directives
+original_slug: Web/Security/CSP/CSP_policy_directives
+---
+<p> </p>
+
+<p>Hay varios ámbitos de las políticas que pueden ser definidas por los administradores de las páginas web usando las Normas de Seguridad de Contenido o CSP por sus siglas en ingles. Cualquier combinación de estas políticas puede ser utilizada para satisfacer las necesidades de su sitio web, no es necesario especificar todas ellas..</p>
+
+<h2 id="Fuentes_de_contenido">Fuentes de contenido</h2>
+
+<p>La mayoría de las políticas directivas necesitan de una o más fuentes de contenido. Una fuente de contenido es una cadena que indica una posible fuente de donde el contenido puede ser descargado.</p>
+
+<h3 id="Listas_de_fuentes">Listas de fuentes</h3>
+
+<p>Una lista de fuentes es un cadena que especifica uno o más hosts de internet o direcciones IP, así como un <a href="/en-US/docs/URIs_and_URLs" title="en/URIs and URLs">esquema de URL</a> opcional y/o número de puerto. La dirección del sitio puede incluir un comodín líder (el carácter asterisco, <code>'*'</code>), y puedes usar un comodín (de nuevo, <code>'*'</code>) como el número de puerto, indicando que todos los puertos legales son válidos para la fuente. Los hosts son delimitados por espacio.</p>
+
+<p>Las expresiones validas del host son:</p>
+
+<dl>
+ <dt><span class="nowiki">http://*.foo.com</span></dt>
+ <dd>Junta todos los intentos de carga desde cualquier subdominio de foo.com usando el sistema URL http:.</dd>
+ <dt><span class="nowiki">mail.foo.com:443</span></dt>
+ <dd>Junta todos los intentos de acceso al puerto 443 en mail.foo.com.</dd>
+ <dt><span class="nowiki">https://store.foo.com</span></dt>
+ <dd>Junta todos los intentos para acceder store.foo.com usando https:.</dd>
+</dl>
+
+<p>Si un número de puerto no está especificado, el navegador usara el número de puerto predeterminado para el sistema especificado. Si no hay sistema especificado, el mismo sistema que ha sido usado para acceder al documento protegido será usado.</p>
+
+<dl>
+</dl>
+
+<h3 id="Palabras_claves">Palabras claves</h3>
+
+<p>También existen algunas palabras claves disponibles para describir clases especiales de fuentes de contenido. Estas palabras son las siguientes:</p>
+
+<dl>
+ <dt><code>'none'</code></dt>
+ <dd>Se refiere al conjunto vacío, es decir, no hay URLs que coincidan. Las comillas simples son necesarias.</dd>
+ <dt><code>'self'</code></dt>
+ <dd>Se refiere al origen del cual los documentos protegidos están siendo enviados, incluyendo el mismo sistema de URL y numero de puerto. Las comillas simples deben ser incluidas. Algunos navegadores excluyen específicamente <code>blob</code> y <code>filesystem</code> de las políticas directivas. Sitios que necesitan permitir  este tipo de contenido puede especificarlos usando el Data attribute.</dd>
+ <dt><code>'unsafe-inline'</code></dt>
+ <dd>Permite el uso de recursos alineados como elementos alineados {{ HTMLElement("script") }} , <code>javascript:</code> URLs, controladores de eventos alineados e elementos alineados {{ HTMLElement("style") }} . Las comillas simples deben ser incluidas.</dd>
+ <dt><code>'unsafe-eval'</code></dt>
+ <dd>Permite el uso de <code>eval()</code>y métodos similares para la creación de códigos desde las cadenas de caracteres. Las comillas simples deben ser incluidas.</dd>
+</dl>
+
+<div class="note"><strong>Nota:</strong> 'unsafe-inline' y 'unsafe-eval' son inseguros y pueden hacer de tu página web vulnerable contra cross-site scripting.</div>
+
+<p>Ejemplo, puedes especificar que el contenido sea cargado desde el origen del documento, así como desde trustedscripts.foo.com de la siguiente manera:</p>
+
+<pre>Content-Security-Policy: default-src 'self' trustedscripts.foo.com
+</pre>
+
+<dl>
+</dl>
+
+<h3 id="Data">Data</h3>
+
+<div class="note"><strong>Nota:</strong> data: URIs son inseguras y pueden hacer de tu página web vulnerable contra cross-site scripting si es permitido por las fuentes del script.</div>
+
+<dl>
+ <dt>data:</dt>
+ <dd>Permite que <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs" title="en/data URIs"><code>data:</code> URIs</a> sea usada como fuente de contenido. Esto es inseguro y un atacante puede insertar data: URIs arbitrarias. Utilízala con moderación y definitivamente no para los scripts.</dd>
+ <dt>mediastream:</dt>
+ <dd>Permite que <a href="/en-US/docs/Web/API/MediaStream_API" title="/en/WebRTC/MediaStream_API"><code>mediastream:</code> URIs</a> sea usada como fuente de contenido.</dd>
+ <dt>blob:</dt>
+ <dd>Permite que <a href="/en-US/docs/Web/API/Blob" title="/en/WebRTC/MediaStream_API"><code>blob:</code> URIs</a> sea usada como fuente de contenido.</dd>
+ <dt>filesystem:</dt>
+ <dd>Permite que <a href="/en-US/docs/Web/API/FileSystem" title="/en/WebRTC/MediaStream_API"><code>filesystem:</code> URIs</a> sea usada como fuente de contenido.</dd>
+</dl>
+
+<pre>Content-Security-Policy: default-src 'self'; img-src 'self' data: blob: filesystem:; media-src mediastream:
+</pre>
+
+<h2 id="Políticas_directivas_soportadas">Políticas directivas soportadas</h2>
+
+<p>Las siguientes políticas directivas están disponibles para controlar la política de seguridad para varias ares de las políticas.</p>
+
+<h3 id="base-uri"><code>base-uri</code></h3>
+
+<p>La directiva &gt;<code>base-uri</code> define las URLs que un agente usuario puede usar como el documento URL base. Si este valor no está presente, cualquier URL está permitido. Si esta directiva no está presente, el agente usuario usara el valor en el elemento <code><a href="/en-US/docs/Web/HTML/Element/base">base</a>.</code></p>
+
+<pre>base-uri <em>source-list</em></pre>
+
+<h3 id="child-src"><code>child-src</code></h3>
+
+<p>La directiva <code>child-src</code> define las fuentes válidas para los trabajadores de la web y contextos de navegación anidados cargados utilizando elementos tales como {{ HTMLElement("frame") }} y {{ HTMLElement("iframe") }}. Esta opción es preferida sobre la directiva <code>frame-src</code><code>, </code><code>la cual es obsoleta. Para los trabajadores, las </code>solicitudes no conformes son tratadas como errores de red fatales por el agente usuario.</p>
+
+<div class="note"><strong>Nota: </strong>Si esta directiva no está presente, el agente usuario buscara la directiva por defecto <code>default-src.</code></div>
+
+<pre><span>​child-src <em>source-list</em></span></pre>
+
+<h3 id="connect-src"><code>connect-src</code></h3>
+
+<p>La directiva <code>connect-src</code> define fuentes válidas para fetch, <a href="/en/nsIXMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a>, WebSocket y conecciones EventSource.</p>
+
+<div class="note"><strong>Nota: </strong>Si esta directiva no está presente, el agente usuario buscara la directiva por defecto <code>default-src.</code></div>
+
+<div class="note"><strong>Nota: </strong>Antes de la versión Firefox 23, xhr-src  era utilizado en lugar de la directiva connect-src y solo restringía el uso de <a href="/en/nsIXMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a>.</div>
+
+<pre><code>connect-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="default-src"><code>default-src</code></h3>
+
+<p>La directiva por defecto <code>default-src </code><code>define la política de seguridad para los tipos de contenidos que no están expresamente señalados por otras directivas. Esta directiva abarca las siguientes directivas:</code></p>
+
+<ul>
+ <li><code>child-src</code></li>
+ <li><code>connect-src</code></li>
+ <li><code>font-src</code></li>
+ <li><code>img-src</code></li>
+ <li><code>media-src</code></li>
+ <li><code>object-src</code></li>
+ <li><code>script-src</code></li>
+ <li><code>style-src</code></li>
+</ul>
+
+<pre><code>default-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="font-src"><code>font-src</code></h3>
+
+<p>La directivas <code>font-src</code> especifica las fuentes válidas para los tipos de letras cargadas usando {{ cssxref("@font-face") }}.</p>
+
+<div class="note"><strong>Nota: </strong>Si esta directiva no está presente, el agente usuario buscara la directiva por defecto <code>default-src.</code></div>
+
+<pre><code>font-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="form-action"><code>form-action</code></h3>
+
+<p>La directiva <code>form-action</code>{{experimental_inline}} especifica criterios de valoración válidos para las sumisiones {{ HTMLElement("form") }}.</p>
+
+<pre id="script-src"><code><code>form-action</code> &gt;<em><code>source-list</code></em></code></pre>
+
+<h3 id="frame-ancestors"><code>frame-ancestors</code></h3>
+
+<p>La directiva <code>frame-ancestors</code>{{experimental_inline}} especifica padres validos que pueden incustrar una pagina usando elementos  {{ HTMLElement("frame") }} y {{ HTMLElement("frame") }}. Esta directiva no esta soportada en el elemento <code>&lt;meta&gt; </code>o por la cabecera <code>Content-Security-Policy-Report-Only.</code></p>
+
+<pre><code>frame-ancestors</code> <em><code>source-list</code></em></pre>
+
+<h3 id="frame-src_obsolete_inline"><code>frame-src</code> {{obsolete_inline}}</h3>
+
+<p>The <code>frame-src</code> directive specifies valid sources for web workers and nested browsing contexts loading using elements such as &gt;{{ HTMLElement("frame") }} and {{ HTMLElement("iframe") }}.&gt;</p>
+
+<div class="note">
+<div><strong>Note: </strong>This directive is deprecated. Use <code>child-src</code> instead.</div>
+</div>
+
+<pre>frame-src <em>source-list</em></pre>
+
+<h3 id="img-src"><code>img-src</code></h3>
+
+<p>The <code>img-src</code> directive specifies valid sources of images and favicons. </p>
+
+<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
+
+<pre><code>img-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="manifest-src"><code>manifest-src</code></h3>
+
+<p>The <code><strong>manifest-src</strong></code> directive specifies which manifest can be applied to the resource.</p>
+
+<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
+
+<pre><code>manifest-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="media-src"><code>media-src</code></h3>
+
+<p>The <code>media-src</code> directive specifies valid sources for loading media using the {{ HTMLElement("audio") }} and {{ HTMLElement("video") }} elements.</p>
+
+<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
+
+<pre><code>media-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="object-src"><code>object-src</code></h3>
+
+<p>The <code>object-src</code> directive specifies valid sources for the {{ HTMLElement("object") }}, {{ HTMLElement("embed") }}, and {{ HTMLElement("applet") }} elements. </p>
+
+<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
+
+<pre><code>object-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="plugin-types"><code>plugin-types</code></h3>
+
+<p>The <code>plugin-types</code> directive specifies the valid plugins that the user agent may invoke.</p>
+
+<pre>plugin-types <em>type-list</em></pre>
+
+<h3 id="referrer"><code>referrer</code></h3>
+
+<p>The <code>referrer</code> directive specifies information in the referrer header for links away from a page.</p>
+
+<pre>​referrer <em>value</em></pre>
+
+<h3 id="reflected-xss"><code>reflected-xss</code></h3>
+
+<p>The <code>reflected-xss</code> directive instructs a user agent to activate or deactivate any heuristics used to filter or block reflected cross-site scripting attacks. Valid values are <code>allow</code>, <code>block</code>, and <code>filter</code>. This directive is not supported in the <code>&lt;meta&gt;</code> element.</p>
+
+<div class="note"><strong>Note: </strong>This directive is ignored if it is contained in a <code>meta</code> element.</div>
+
+<pre>reflected-xss <em>value</em></pre>
+
+<h3 id="report-uri"><code>report-uri</code></h3>
+
+<p>The <code>report-uri</code> directive instructs the user agent to report attempts to violate the Content Security Policy. These violation reports consist of <a href="/en/JSON" title="en/JSON">JSON</a> documents sent via an HTTP <code>POST</code> request to the specified URI. See <a href="/en/Security/CSP/Using_CSP_violation_reports" title="en/Security/CSP/Using CSP violation reports">Using CSP violation reports</a> for details. This directive is not supported in the <code>&lt;meta&gt;</code> element.</p>
+
+<pre><code>report-uri</code> <em><code><a class="external" href="http://tools.ietf.org/html/rfc2396" title="http://tools.ietf.org/html/rfc2396">uri</a></code></em></pre>
+
+<h3 id="sandbox"><code>sandbox</code></h3>
+
+<p>The <code>sandbox</code> directive applies restrictions to a page's actions including preventing popups, preventing the execution of plugins and scripts, and enforcing a same-origin policy. This directive is not supported in the <code>&lt;meta&gt;</code> element or by the <code>Content-Security-policy-Report-Only</code> header field.</p>
+
+<pre>sandbox <em>value</em></pre>
+
+<h3 id="script-src_2"><code>script-src</code></h3>
+
+<p>The <code>script-src</code> directive specifies valid sources for JavaScript. When either the <code>script-src</code> or the <code>default-src</code> directive is included, inline script and <code>eval()</code> are disabled unless you specify 'unsafe-inline' and 'unsafe-eval', respectively.</p>
+
+<div class="note"><strong>Note: </strong>If this directive is absent the user agent will look for the <code>default-src</code> directive.</div>
+
+<pre><code>script-src</code> <em><code>source-list</code></em></pre>
+
+<h3 id="style-src"><code>style-src</code></h3>
+
+<p>The <code>style-src</code> directive specifies valid sources for stylesheets. This includes both externally-loaded stylesheets and inline use of the {{ HTMLElement("style") }} element and HTML <code>style</code> attributes. Stylesheets from sources that aren't included in the source list are not requested or loaded. When either the <code>style-src</code> or the <code>default-src</code> directive is included, inline use of the {{ HTMLElement("style") }} element and HTML <code>style</code> attributes are disabled unless you specify 'unsafe-inline'.</p>
+
+<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
+
+<pre><code>style-src</code> <em><code>source-list</code></em></pre>
+
+<div class="note"><strong>Note:</strong> Firefox currently requires using the same URL scheme and port for the <code>report-uri</code> as the content being protected by Content Security Policy.</div>
+
+<h3 id="upgrade-insecure-requests"><code>upgrade-insecure-requests</code></h3>
+
+<p>The <code>upgrade-insecure-requests</code> directive instructs user agents to treat all of a site's unsecure URL's (those serverd over HTTP) as though they have been replaced with secure URL's (those served over HTTPS). This directive is intended for web sites with large numbers of unsecure legacy URL's that need to be rewritten. </p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{ specName("Upgrade Insecure Requests")}}</td>
+   <td>{{Spec2('Upgrade Insecure Requests')}}</td>
+   <td>Adds <code>upgrade-insecure-requests</code>.</td>
+  </tr>
+  <tr>
+   <td>{{ specName("CSP 1.1") }}</td>
+   <td>{{Spec2('CSP 1.1')}}</td>
+   <td>Adds <code>base-uri</code>, <code>child-src</code>, <code>form-action</code>, <code>frame-ancestors</code>, <code>plugin-types</code>, <code>referrer</code>, <code>reflected-xss</code>, and <code>report-uri</code>. Deprecates <code>frame-src</code>.</td>
+  </tr>
+  <tr>
+   <td>{{ specName("CSP 1.0") }}</td>
+   <td>{{Spec2('CSP 1.0')}}</td>
+   <td>Defines <code>connect-src</code>, &gt;<code>default-src</code>, &gt;<code>font-src</code>, &gt;<code>frame-src</code>, &gt;<code>img-src</code>, &gt;<code>media-src</code>, &gt;<code>objects-src</code>, &gt;report-uri,&gt;<code>sandbox</code>, &gt;<code>script-src,</code> and &gt;<code>style-src</code>.&gt;</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">{{CompatUnknown}}
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome{{ref("2")}}</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>
+    <p>{{CompatChrome(14.0)}} (X-Webkit-CSP)</p>
+
+    <p>{{CompatChrome(25.0)}}</p>
+   </td>
+   <td>
+    <p>{{CompatGeckoDesktop("2.0")}} (X-Content-Security-Policy)</p>
+
+    <p>{{CompatGeckoDesktop("23.0")}}</p>
+   </td>
+   <td>Edge</td>
+   <td>15</td>
+   <td>
+    <p>6 (X-Webkit-CSP)</p>
+
+    <p>7</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>base-uri</code></td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatGeckoDesktop("35.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>child-src</code></td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>connect-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>default-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>font-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>form-action</code></td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatGeckoDesktop("36.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>frame-ancestors</code></td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatGeckoDesktop("33.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>frame-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>img-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>manifest-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("41.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>media-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>object-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>plugin-types</code></td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>referrer</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("37.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>reflected-xss</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>report-uri</code></td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>sandbox</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>script-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>style-src</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>
+    <p><code>upgrade-insecure-requests</code></p>
+   </td>
+   <td>
+    <p class="p1">{{CompatChrome(43.0)}}</p>
+   </td>
+   <td>{{CompatGeckoDesktop("42.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android Browser{{ref("1")}}</th>
+   <th>Android Webview{{ref("2")}}</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Mobile{{ref("2")}}</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>iOS 7.1</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>base-uri</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatGeckoMobile("35.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>child-src</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>connect-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>default-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>font-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>form-action</code> </td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatGeckoMobile("36.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>frame-ancestors</code> </td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatGeckoMobile("33.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>frame-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>img-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>manifest-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("41.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>media-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>object-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>plugin-types</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>referrer</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("37.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>reflected-xss</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>report-uri</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(40.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>sandbox</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>script-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>style-src</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>upgrade-insecure-requests</code></td>
+   <td>{{CompatGeckoMobile(42)}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Notes">Notes</h2>
+
+<p>{{ref("1")}} Deprecated since Android 4.0.</p>
+
+<p>{{ref("2")}} Starting with version {{CompatChrome(45.0)}}, Chrome excludes <code>blob</code> and <code>filesystem</code> from source directives. Sites needing to allow these content types can specify them using the Data attribute.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en/Security/CSP/Introducing_Content_Security_Policy" title="en/Security/CSP/Introducing Content Security Policy">Introducing Content Security Policy</a></li>
+ <li><a href="/en/Security/CSP/Using_Content_Security_Policy" title="en/Security/CSP/Using Content Security Policy">Using Content Security Policy</a></li>
+ <li><a href="/en/Security/CSP/Using_CSP_violation_reports" title="en/Security/CSP/Using CSP violation reports">Using CSP violation reports</a></li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html b/files/es/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html
new file mode 100644
index 0000000000..48a3db323c
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/arraybuffer/index.html
@@ -0,0 +1,70 @@
+---
+title: ArrayBuffer.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/ArrayBuffer
+tags:
+  - ArrayBuffer
+  - JavaScript
+  - Propiedad
+translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
+translation_of_original: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <strong><code>ArrayBuffer.prototype</code></strong> representa el prototipo para el objeto {{jsxref("ArrayBuffer")}}.</p>
+
+<div>{{js_property_attributes(0,0,0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las instancias de <code>ArrayBuffer</code> heredan de <code>ArrayBuffer.prototype</code>. Como con todos los constructores, puedes modificar el prototipo del constructor para aplicar cambios sobre todas las instancias de <code>ArrayBuffer</code>.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>ArrayBuffer.prototype.constructor</dt>
+ <dd>Especifica la función que se encarga de crear el prototipo del objeto. El valor inicial es el constructor incluido en el estándar <code>ArrayBuffer</code>.</dd>
+ <dt>{{jsxref("ArrayBuffer.prototype.byteLength")}} {{readonlyInline}}</dt>
+ <dd>El tamaño, en bytes, del array. Este valor se establece al construir el objeto y no se puede modificar. <strong>Sólo lectura.</strong></dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("ArrayBuffer.prototype.slice()")}}</dt>
+ <dd>Retorna un nuevo <code>ArrayBuffer</code> cuyo contenido es una copia los bytes de este <code>ArrayBuffer</code> desde <code>begin</code>, incluido, hasta  <code>end</code>, no incluido. Si <code>begin</code> o <code>end</code> son negativos, éstos hacen referencia a un índice que comienza a partir del final del array.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.ArrayBuffer.prototype")}}</p>
+
+<div id="compat-mobile"> </div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("ArrayBuffer")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/date/index.html b/files/es/conflicting/web/javascript/reference/global_objects/date/index.html
new file mode 100644
index 0000000000..362876f5af
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/date/index.html
@@ -0,0 +1,202 @@
+---
+title: Date.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/Date
+tags:
+  - Date
+  - JavaScript
+  - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Date
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Date/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/prototype
+---
+<div>
+ {{JSRef("Objetos_globales", "Date")}}</div>
+<h2 id="Resumen">Resumen</h2>
+<p>Representa el prototipo para esta clase. Puede utilizar el prototipo para añadir propiedades o métodos a todas las instancias de una clase.</p>
+<div>
+ {{js_property_attributes(0,0,1)}}</div>
+<h2 class="noinclude" id="Propriedades">Propriedades</h2>
+<dl>
+ <dt class="noinclude">
+  <code>Date.prototype.constructor</code></dt>
+ <dd>
+   </dd>
+</dl>
+<div>
+ {{ jsOverrides("Object", "properties", "constructor") }}</div>
+<h2 id="Métodos">Métodos</h2>
+<dl>
+ <dt>
+  {{jsxref("Date.prototype.getDate()")}}</dt>
+ <dd>
+  Devuelve el día del mes de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getDay()")}}</dt>
+ <dd>
+  Devuelve el día de la semana de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getFullYear()")}}</dt>
+ <dd>
+  Devuelve el año de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getHours()")}}</dt>
+ <dd>
+  Devuelve la hora de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getMilliseconds()")}}</dt>
+ <dd>
+  Devuelve los milisegundos de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getMinutes()")}}</dt>
+ <dd>
+  Devuelve los minutos de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getMonth()")}}</dt>
+ <dd>
+  Devuelve el mes de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getSeconds()")}}</dt>
+ <dd>
+  Devuelve los segundos de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getTime()")}}</dt>
+ <dd>
+  Devuelve el valor numérico correspondiente a la hora especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getTimezoneOffset()")}}</dt>
+ <dd>
+  Devuelve la diferencia horaria en minutos para la zona geográfica actual.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCDate()")}}</dt>
+ <dd>
+  Devuelve el día del mes de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCDay()")}}</dt>
+ <dd>
+  Devuelve el día de la semana de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCFullYear()")}}</dt>
+ <dd>
+  Devuelve el día el año de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCHours()")}}</dt>
+ <dd>
+  Devuelve las horas de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCMilliseconds()")}}</dt>
+ <dd>
+  Devuelve los milisegundos de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCMinutes()")}}</dt>
+ <dd>
+  Devuelve los minutos de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCMonth()")}}</dt>
+ <dd>
+  Devuelve el mes de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getUTCSeconds()")}}</dt>
+ <dd>
+  Devuelve los segundos de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.getYear()")}} {{ deprecated_inline() }}</dt>
+ <dd>
+  Devuelve el año de la fecha especificada según la hora local. Use {{jsxref("Date.prototype.getFullYear()")}} a cambio.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setDate()")}}</dt>
+ <dd>
+  Establece el día del mes de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setFullYear()")}}</dt>
+ <dd>
+  Establece el año completo de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setHours()")}}</dt>
+ <dd>
+  Establece las horas de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setMilliseconds()")}}</dt>
+ <dd>
+  Establece los milisegundos de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setMinutes()")}}</dt>
+ <dd>
+  Establece los minutos de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setMonth()")}}</dt>
+ <dd>
+  Establece el mes de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setSeconds()")}}</dt>
+ <dd>
+  Establece los segundos de la fecha especificada según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setTime()")}}</dt>
+ <dd>
+  Establece el valor del objeto <code>Date</code> según la hora local.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setUTCDate()")}}</dt>
+ <dd>
+  Establece el día del mes de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setUTCFullYear()")}}</dt>
+ <dd>
+  Establece el año completo de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setUTCHours()")}}</dt>
+ <dd>
+  Establece la hora de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setUTCMilliseconds()")}}</dt>
+ <dd>
+  Establece los milisegundos de la fecha especificada según la hora universal..</dd>
+ <dt>
+  {{jsxref("Date.prototype.setUTCMinutes()")}}</dt>
+ <dd>
+  Establece los minutos de la fecha especificada según la hora universal..</dd>
+ <dt>
+  {{jsxref("Date.prototype.setUTCMonth()")}}</dt>
+ <dd>
+  Establece el mes de la fecha especificada según la hora universal.</dd>
+ <dt>
+  {{jsxref("Date.prototype.setUTCSeconds()")}}</dt>
+ <dd>
+  Establece los segundos de la fecha especificada según la hora universal..</dd>
+ <dt>
+  {{jsxref("Date.prototype.setYear ()")}}{{deprecated_inline}}</dt>
+ <dd>
+  Establece el año de la fecha especificada según la hora local. Use {{jsxref("Date.prototype.setFullYear()")}} a cambio.</dd>
+ <dt>
+  {{jsxref("Date.prototype.toGMTString()")}} {{ deprecated_inline}}</dt>
+ <dd>
+  Convierte una fecha en una cadena, usando las convenciones de Internet GMT. Utilice {{jsxref("Date.prototype.toUTCString()")}} a cambio.</dd>
+ <dt>
+  {{jsxref("Date.prototype.toLocaleString()")}}</dt>
+ <dd>
+  Convierte una fecha en una cadena, usando las reglas de la localización actual. Sobreescribe el método {{jsxref("Object.toLocaleString()")}}.</dd>
+ <dt>
+  {{jsxref("Date.prototype.toLocaleDateString()")}}</dt>
+ <dd>
+  Devuelve la porción fecha (sin la hora) de una fecha como una cadena, usando las reglas de la localización actual.</dd>
+ <dt>
+  {{jsxref("Date.prototype.toLocaleTimeString()")}}</dt>
+ <dd>
+  Devuelve la porción hora (sin la fecha) de una fecha como una cadena, siguiendo las reglas de la localización actual.</dd>
+ <dt>
+  {{jsxref("Date.prototype.toSource()")}}</dt>
+ <dd>
+  Devuelve un literal que representa al objeto <code>Date</code> especificado; puede usar este valor para crear un nuevo objeto. Sobreescribe el método {{jsxref("Object.toSource()")}}.</dd>
+ <dt>
+  {{jsxref("Date.prototype.toString()")}}</dt>
+ <dd>
+  Devuelve una cadena representando el objeto <code>Date</code> especificado. Sobreescribe el método {{jsxref("Object.toString()")}}.</dd>
+ <dt>
+  {{jsxref("Date.prototype.toUTCString()")}}</dt>
+ <dd>
+  Convierte una fecha en una cadena, usando las reglas horarias universales.</dd>
+ <dt>
+  {{jsxref("Date.prototype.valueOf()")}}</dt>
+ <dd>
+  Devuelve el valor primitivo de un objeto <code>Date</code>. Sobreescribe el método {{jsxref("Object.valueOf()")}}.</dd>
+</dl>
+<p>{{ jsOverrides("Object", "methods", "getDate", "getDay", "getFullYear", "getHours", "getMilliseconds", "getMinutes", "getMonth", "getSeconds", "getTime", "getTimezoneOffset", "getUTCDate", "getUTCDay", "getUTCFullYear", "getUTCHours", "getUTCMilliseconds", "getUTCMinutes", "getUTCMonth", "getUTCSeconds", "getYear", "setdate", "setFullYear", "setHours", "setMilliseconds", "setMinutes", "setMontth", "setSeconds", "setTime", "setUTCDate", "setUTCFullYear", "setUTCHours", "setUTCMilliseconds", "setUTCMinutes", "setUTCMonth", "setUTCSeconds", "setYear", "toDateString", "toGMTString", "toLocaleDateString", "toLocaleFormat", "toLocaleString", "toLocaleTimeString", "toSource", "toString", "toTimeString", "toUTCString", "valueOf") }}</p>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/error/index.html b/files/es/conflicting/web/javascript/reference/global_objects/error/index.html
new file mode 100644
index 0000000000..5540880b03
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/error/index.html
@@ -0,0 +1,155 @@
+---
+title: Error.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/Error
+translation_of: Web/JavaScript/Reference/Global_Objects/Error
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Error/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>Error.prototype</strong></code> representa el prototipo del constructor {{jsxref("Error")}}.</p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Todas las instancias de {{jsxref("Error")}} e instancias de {{jsxref("Global_Objects/Error", "errores no genéricos", "#Error_types", 1)}}, heredan de <code>Error.prototype</code>. Como todas las funciones constructoras, se puede usar el protoipo del constructor para añadir propiedades o métodos a todas las instancias creadas con este constructor.</p>
+
+<h2 id="Properties">Properties</h2>
+
+<h3 id="Propiedades_estándar">Propiedades estándar</h3>
+
+<dl>
+ <dt><code>Error.prototype.constructor</code></dt>
+ <dd>Especifica la función que crea una instancia del prototipo.</dd>
+ <dt>{{jsxref("Error.prototype.message")}}</dt>
+ <dd>Mensaje de error.</dd>
+ <dt>{{jsxref("Error.prototype.name")}}</dt>
+ <dd>Nombre del error.</dd>
+</dl>
+
+<h3 id="Extensiones_específicas_del_proveedor">Extensiones específicas del proveedor</h3>
+
+<div>{{non-standard_header}}</div>
+
+<h4 id="Microsoft">Microsoft</h4>
+
+<dl>
+ <dt>{{jsxref("Error.prototype.description")}}</dt>
+ <dd>Descripción del error. Similar a {{jsxref("Error.prototype.message", "message")}}.</dd>
+ <dt>{{jsxref("Error.prototype.number")}}</dt>
+ <dd>Número de error.</dd>
+</dl>
+
+<h4 id="Mozilla">Mozilla</h4>
+
+<dl>
+ <dt>{{jsxref("Error.prototype.fileName")}}</dt>
+ <dd>Ruta del archivo que lanzó el error.</dd>
+ <dt>{{jsxref("Error.prototype.lineNumber")}}</dt>
+ <dd>Número de fila en el archivo que lanzó el error.</dd>
+ <dt>{{jsxref("Error.prototype.columnNumber")}}</dt>
+ <dd>Número de columna en el archivo que lanzó el error.</dd>
+ <dt>{{jsxref("Error.prototype.stack")}}</dt>
+ <dd>Seguimiento de la pila.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Error.prototype.toSource()")}} {{non-standard_inline}}</dt>
+ <dd>Devuelve una cadena que contiene el codígo del objeto {{jsxref("Error")}}; se puede usar este valor para crear un nuevo objeto. Sobreescribe el método {{jsxref("Object.prototype.toSource()")}}.</dd>
+ <dt>{{jsxref("Error.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el objeto. Sobreescribe el método {{jsxref("Object.prototype.toString()")}}.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.11.3.1', 'Error')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-error.prototype', 'Error')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-error.prototype', 'Error')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Error")}}</li>
+ <li>{{jsxref("Object.prototype")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/function/index.html b/files/es/conflicting/web/javascript/reference/global_objects/function/index.html
new file mode 100644
index 0000000000..20de74f338
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/function/index.html
@@ -0,0 +1,66 @@
+---
+title: Function.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/Function
+tags:
+  - Function
+  - JavaScript
+  - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Function
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Function/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/prototype
+---
+<div>{{JSRef("Objetos_globales", "Function")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Un valor desde cuyas instancias de una clase particular son creados. Cada objeto que puede ser creado por la invocación a la función constructora posee una propiedad prototype asociada.</p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Puede añadir propiedades o métodos a una clase existente mediante la adición de ellos al prototipo asociado con la función constructora para esa clase.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("Function.arguments")}} {{Deprecated_inline}}</dt>
+ <dd>Una matriz correspondiente a los argumentos pasados a una función. Como propiedad de una <code>Function</code>, este uso está obsoleto. Se recomenda el uso del objeto {{jsxref("Functiones/arguments", "arguments")}}.</dd>
+ <dt>{{jsxref("Function.arity")}} {{obsolete_inline}}</dt>
+ <dd>Especifica el número de argumentos que espera la función. Se recomienda, no obstante, utilizar la función {{jsxref("Function.length", "length")}}.</dd>
+ <dt>{{jsxref("Function.caller")}}</dt>
+ <dd>Especifica la función que invoca la ejecución de la función actual (no estándar).</dd>
+ <dt>{{jsxref("Function.constructor")}}</dt>
+ <dd>Especifica la función que crea un prototipo de objeto.</dd>
+ <dt>{{jsxref("Function.length")}}</dt>
+ <dd>Specifica el número de argumentos esperados por la función.</dd>
+ <dt>{{jsxref("Function.name")}}</dt>
+ <dd>El nombre de la función (no forma parte del estándar).</dd>
+ <dt>{{jsxref("Function.prototype")}}</dt>
+ <dd>Permite añadir propiedades a los objetos función (ambos, los construidos usando <code>Function</code> y los declarados usando una declaración de función o una expresión de función).</dd>
+</dl>
+
+<div>{{ jsOverrides("Object", "properties", "arguments", "arity", "caller", "constructor", "length", "name", "displayName") }}</div>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Function.prototype.apply()")}}</dt>
+ <dd>Le permite aplicar el método de otro objeto en el contexto de un objeto diferente (el objeto llamado).</dd>
+ <dt>{{jsxref("Function.prototype.call()")}}</dt>
+ <dd>Le Permite llamar (ejecutar) a un método de otro objeto en el contexto de un objeto diferente (el objeto que llama).</dd>
+ <dt>{{jsxref("Function.prototype.toSource()")}}</dt>
+ <dd>Devuelve una cadena que representa el código fuente de la función. Anula al método {{jsxref("Object.toSource")}}.</dd>
+ <dt>{{jsxref("Function.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el código fuente de la función. Anula al método {{jsxref("Object.toSource")}}.</dd>
+</dl>
+
+<div>{{ jsOverrides("Object", "methods", "apply", "call", "toSource", "toString") }}</div>
+
+<dl>
+ <dt> </dt>
+</dl>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Objetos_globales/Function", "Function")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/map/index.html b/files/es/conflicting/web/javascript/reference/global_objects/map/index.html
new file mode 100644
index 0000000000..557a561e76
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/map/index.html
@@ -0,0 +1,136 @@
+---
+title: Map.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/Map
+translation_of: Web/JavaScript/Reference/Global_Objects/Map
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Map/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>Map</strong></code><strong><code>.prototype</code></strong>  representa el prototipo del constructor {{jsxref("Map")}}.</p>
+
+<div>{{js_property_attributes(0,0,0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La instancia de {{jsxref("Map")}} hereda de {{jsxref("Map.prototype")}}. Puedes utilizar el constructor del prototipo del objeto para agregar propiedades o métodos a todas las instancias de <code>Map</code>.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>Map.prototype.constructor</code></dt>
+ <dd>Devuelve la función que creó el prototipo de una instancia. Esta es la función de {{jsxref("Map")}} por defecto.</dd>
+ <dt>{{jsxref("Map.prototype.size")}}</dt>
+ <dd>Devuelve el número de conjuntos de llave/valor en el objeto <code>Map</code>.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Map.prototype.clear()")}}</dt>
+ <dd>Elimina todos los conjuntos de llave/valor del objeto <code>Map</code>.</dd>
+ <dt>{{jsxref("Map.delete", "Map.prototype.delete(key)")}}</dt>
+ <dd>Elimina cualquier valor asociado a la <code>llave</code> y devuelve el valor que  <code>Map.prototype.has(key)</code> tenía previamente. Después  <code>Map.prototype.has(key)</code> devolverá <code>false</code>.</dd>
+ <dt>{{jsxref("Map.prototype.entries()")}}</dt>
+ <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene<strong> un array de <code>[llave, valor]</code></strong> para cada elemento en el objeto  <code>Map</code> en orden de inserción.</dd>
+ <dt>{{jsxref("Map.forEach", "Map.prototype.forEach(callbackFn[, thisArg])")}}</dt>
+ <dd>Llama a la callbackFn una vez por cada conjunto llave/valor presentes en cada objeto  <code>Map</code>, en orden de inserción. Si se le proporciona un parámetro thisArg a forEach, se usará como valor "this" para cada callback.</dd>
+ <dt>{{jsxref("Map.get", "Map.prototype.get(key)")}}</dt>
+ <dd>Devuelve el valor asociado a la  <code>llave</code>, o <code>undefined</code> si no tiene ninguno.</dd>
+ <dt>{{jsxref("Map.has", "Map.prototype.has(key)")}}</dt>
+ <dd>Devuelve un booleano que indica si un valor se ha asociado a la <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: #eeeeee;">llave</span></font> en el objeto <code>Map</code> o no se ha asociado.</dd>
+ <dt>{{jsxref("Map.prototype.keys()")}}</dt>
+ <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene las <strong>llaves</strong> para cada elemento en el objeto <code>Map</code> en orden de inserción.</dd>
+ <dt>{{jsxref("Map.set", "Map.prototype.set(key, value)")}}</dt>
+ <dd>Establece un valor para la <code>llave</code> en el objeto <code>Map</code>. Devuelve el objeto  <code>Map</code>.</dd>
+ <dt>{{jsxref("Map.prototype.values()")}}</dt>
+ <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene los <strong>valores</strong> para cada elemento en el objeto  <code>Map</code> en orden de inserción.</dd>
+ <dt>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</dt>
+ <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene<strong> un array de <code>[llave, valor]</code></strong> para cada elemento en el objeto <code>Map</code> en orden de inserción.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-map.prototype', 'Map.prototype')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype', 'Map.prototype')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("13") }}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("13")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>
+    <p>8</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Set.prototype")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/number/index.html b/files/es/conflicting/web/javascript/reference/global_objects/number/index.html
new file mode 100644
index 0000000000..2f9f0a8e4e
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/number/index.html
@@ -0,0 +1,17 @@
+---
+title: Number.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/Number
+tags:
+  - JavaScript
+  - Number
+  - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Number
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Number/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/prototype
+---
+<div>
+ {{JSRef("Objetos_globales", "Number")}}</div>
+<h3 id="Resumen" name="Resumen">Resumen</h3>
+<p>Representa el prototipo para esta clase. Puede utilizar el prototipo para añadir propiedades o métodos a todas las instancias de una clase. Para información acerca de prototipos.</p>
+<div class="noinclude">
+  </div>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/object/index.html b/files/es/conflicting/web/javascript/reference/global_objects/object/index.html
new file mode 100644
index 0000000000..805aa55cf9
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/object/index.html
@@ -0,0 +1,196 @@
+---
+title: Object.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/Object
+tags:
+  - JavaScript
+  - Objeto
+  - Propiedad
+translation_of: Web/JavaScript/Reference/Global_Objects/Object
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Object/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/prototype
+---
+<div>{{JSRef("Objetos_globales", "Object")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La propiedad <code><strong>Object.prototype</strong></code> representa al objeto prototipo de {{jsxref("Object")}}.</p>
+
+<p>{{js_property_attributes(0,0,0)}}</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Todos los objetos en JavaScript provienen de {{jsxref("Global_Objects/Object", "Object")}}; todos los objetos heredan métodos y propiedades de<code> Object.prototype</code>, aunque pueden ser sobrecargados. Sin embargo, un <code>Object</code>  puede ser deliberadamente creado para que esto no sea cierto (por ejemplo usando  {{jsxref("Object.create", "Object.create(null)")}}), o bien alterado para que no cumpla esta propiedad (por ejemplo usando {{jsxref("Object.setPrototypeOf")}}).</p>
+
+<p>Cambios en el prototipo de {{jsxref("Object")}} son vistos por <strong>todos </strong>los objetos a traves de el encadenado de prototype, a no ser que las propiedades y los metodos sujetos a estos cambios sean sobreescritos en algun lugar de la cadena de prototype. Este poderoso y a la vez potencialmente peligroso mecanismo permite extender o sobreescribir el comportamiento de un objeto.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("Object.prototype.constructor")}}</dt>
+ <dd>Especifica la función que crea el prototipo de un objeto.</dd>
+ <dt>{{jsxref("Object.proto", "Object.prototype.__proto__")}} {{Non-standard_inline}}</dt>
+ <dd>Apunta al objeto que se usó como prototipo cuando fue instanciado.</dd>
+ <dt>{{jsxref("Object.noSuchMethod", "Object.prototype.__noSuchMethod__")}} {{Non-standard_inline}}</dt>
+ <dd>Permite a una función ser definida que sera ejecutada cuando un miembro del objeto es llamado como un metodo.</dd>
+ <dt><s class="obsoleteElement">{{jsxref("Object.count", "Object.prototype.__count__")}} {{obsolete_inline()}}</s></dt>
+ <dd>Se utiliza para devolver el número de propiedades enumerables directamente en un objeto definido por el usuario, pero que ha sido eliminado.</dd>
+ <dt><s class="obsoleteElement">{{jsxref("Object.parent", "Object.prototype.__parent__")}} {{obsolete_inline()}}</s></dt>
+ <dd><s class="obsoleteElement">Apunta al contexto de un objeto. Ha sido borrado.</s></dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Object.defineGetter", "Object.prototype.__defineGetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
+ <dd>Asocia una función con una propiedad que, cuando se accede a ella, ejecuta esa función y devuelve su valor de retorno.</dd>
+ <dt>{{jsxref("Object.defineSetter", "Object.prototype.__defineSetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
+ <dd>Asocia una función con una propiedad que al establecerse ejecuta esa función que modifica la propiedad.</dd>
+ <dt>{{jsxref("Object.lookupGetter", "Object.prototype.__lookupGetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
+ <dd>Devuelve la función asociada con la propiedad indicada por el método {{jsxref("Object.defineGetter", "__defineGetter__")}}.</dd>
+ <dt>{{jsxref("Object.lookupSetter", "Object.prototype.__lookupSetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
+ <dd>Devuelve la función asociada con la propiedad indicada en el método {{jsxref("Object.defineSetter", "__defineSetter__")}}.</dd>
+ <dt>{{jsxref("Object.prototype.hasOwnProperty()")}}</dt>
+ <dd>Devuelve un valor lógico (boolean) que indica si el objeto contiene la propiedad indicada como una propiedad directa de ese objeto y no heredada por la cadena de prototipo.</dd>
+ <dt>{{jsxref("Object.prototype.isPrototypeOf()")}}</dt>
+ <dd>Devuelve una indicación <em>booleana</em> cuando el objeto especificado está en la cadena de prototipos del objeto sobre el cuál éste método es llamado.</dd>
+ <dt>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</dt>
+ <dd>Devuelve un valor lógico (boolean) indicando si el attributo <a href="/es/docs/Web/JavaScript/Data_structures#Objetos">ECMAScript [[Enumerable]]</a> está definido.</dd>
+ <dt>{{jsxref("Object.prototype.toSource()")}} {{Non-standard_inline}}</dt>
+ <dd>Devuelve una cadena con el fuente de un literal de objeto que representa el objeto desde el que este método es llamado; se puede usar este valor para crear un nuevo objeto.</dd>
+ <dt>{{jsxref("Object.prototype.toLocaleString()")}}</dt>
+ <dd>Llama a {{jsxref("Object.toString", "toString()")}}.</dd>
+ <dt>{{jsxref("Object.prototype.toString()")}}</dt>
+ <dd>Devuelve la cadena de texto (string) que representa al objeto.</dd>
+ <dt>{{jsxref("Object.prototype.unwatch()")}} {{Non-standard_inline}}</dt>
+ <dd>Remueve un punto de mira de una propiedad del objeto.</dd>
+ <dt>{{jsxref("Object.prototype.valueOf()")}}</dt>
+ <dd>Devuelve el valor primitivo del objeto indicado.</dd>
+ <dt>{{jsxref("Object.prototype.watch()")}} {{Non-standard_inline}}</dt>
+ <dd>Agrega un punto de mira a una propiedad del objeto.</dd>
+ <dt><s class="obsoleteElement">{{jsxref("Object.prototype.eval()")}} {{ obsolete_inline()}}</s></dt>
+ <dd><s class="obsoleteElement">Se utiliza para evaluar una cadena de código JavaScript  en el contexto del objeto especificado, pero que ha sido removido.</s></dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Al alterar el comportamiento de un método existente en Object.prototype, es oportuno considerar envolver el código de tu extensión antes o después de la existente lógica. Por ejemplo, este trozo de código (sin testear) ejecutara una determinada lógica antes de que la lógica existente o la de algún otro elemento sea ejecutada.</p>
+
+<p>Cuando una función es llamada, los parámetros de la llamada son mantenidos en el argumento parecido a una array llamado "arguments". Por ejemplo, en la llamada "myFn(a, b, c)", los parámetros dentro del cuerpo de la función myFn estarán contenidos en una variable llamada "arguments". Si se desea llamar al siguiente método de la cadena de prototype, simplemente añade this y arguments a la funcion apply(). Este patrón puede ser usado en cualquier prototype, por ejemplo Node.prototype, Function.prototype, etc.</p>
+
+<pre class="brush: js">var current = Object.prototype.valueOf;
+
+// Como mi propiedad "-prop-value" es un atajo y no se encuentra siempre
+// en la cadena de prototype, queremos modificar Object.prototype:
+Object.prototype.valueOf = function() {
+  if (this.hasOwnProperty('-prop-value')) {
+    return this['-prop-value'];
+  } else {
+    // No parece que este objeto sea uno de los mios, por lo que recaeeremos
+    // en el comportamiento por defecto lo mejor que podamos.
+    // La llamada apply se comporta como el "super" en otros lenguages de programación.
+    // A pesar de que valueOf() no tiene parametros, alguna otra llamada podria tenerlos.
+    return current.apply(this, arguments);
+  }
+}</pre>
+
+<p>Como JavaScript no tiene objetos de tipo “subclase”, prototype es realmente útil para crear un objeto “base” donde ciertas funciones actúan como objetos. Por ejemplo:</p>
+
+<pre class="brush: js">var Person = function(name) {
+  this.name = name;
+  this.canTalk = true;
+};
+
+Person.prototype.greet = function() {
+  if (this.canTalk) {
+    console.log('Hi, I am ' + this.name);
+  }
+};
+
+var Employee = function(name, title) {
+  Person.call(this, name);
+  this.title = title;
+};
+
+Employee.prototype = Object.create(Person.prototype);
+Employee.prototype.constructor = Employee;
+
+Employee.prototype.greet = function() {
+  if (this.canTalk) {
+    console.log('Hi, I am ' + this.name + ', the ' + this.title);
+  }
+};
+
+var Customer = function(name) {
+  Person.call(this, name);
+};
+
+Customer.prototype = Object.create(Person.prototype);
+Customer.prototype.constructor = Customer;
+
+var Mime = function(name) {
+  Person.call(this, name);
+  this.canTalk = false;
+};
+
+Mime.prototype = Object.create(Person.prototype);
+Mime.prototype.constructor = Mime;
+
+var bob = new Employee('Bob', 'Builder');
+var joe = new Customer('Joe');
+var rg = new Employee('Red Green', 'Handyman');
+var mike = new Customer('Mike');
+var mime = new Mime('Mime');
+
+bob.greet();
+// Hi, I am Bob, the Builder
+
+joe.greet();
+// Hi, I am Joe
+
+rg.greet();
+// Hi, I am Red Green, the Handyman
+
+mike.greet();
+// Hi, I am Mike
+
+mime.greet();</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>
+    <p>Definición inicial.Implementado en  JavaScript 1.0.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.1', 'Object.prototype')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.prototype', 'Object.prototype')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>
+    <p> </p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.prototype', 'Object.prototype')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Object.prototype")}}</p>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/promise/index.html b/files/es/conflicting/web/javascript/reference/global_objects/promise/index.html
new file mode 100644
index 0000000000..99fe5cfd8d
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/promise/index.html
@@ -0,0 +1,70 @@
+---
+title: Promise.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/Promise
+tags:
+  - JavaScript
+  - Promesa
+  - Propiedad
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Promise/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>Promise.prototype</strong></code> representa el prototipo del constructor de {{jsxref("Promise")}}</p>
+
+<div>{{js_property_attributes(0,0,0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las instancias de {{jsxref("Promise")}} heredan de {{jsxref("Promise.prototype")}}. Se puede usar el objeto prototipo del constructor para agregar propiedades o métodos a todas las instancias de <code>Promise</code>.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>Promise.prototype.constructor</code></dt>
+ <dd>Retorna la función que creó el prototipo de una instancia. Esta es la función por defecto de {{jsxref("Promise")}}.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Promise.catch", "Promise.prototype.catch(alRechazarse)")}}</dt>
+ <dd>Anexa a la promesa un callback manejador de rechazo, y retorna una nueva promesa que resuelve al valor de retorno del callback si es llamado, o de lo contrario a su valor de cumplimiento original si la promesa es cumplida.</dd>
+ <dt>{{jsxref("Promise.then", "Promise.prototype.then(alCumplirse, alRechazarse)")}}</dt>
+ <dd>Anexa a la promesa manejadores de cumplimiento y rechazo, y retorna una nueva promesa que resuelve al valor de retorno del manejador llamado, o a su valor de <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise#settledNote">determinación (settled)</a> original si la promesa no fue manejada (p.ej. si el manejador relevante <code>alCumplirse</code> o <code>alRechazarse</code> no es una función).</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-promise.prototype', 'Promise.prototype')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.prototype', 'Promise.prototype')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">To contribute to this compatibility data, please write a pull request against this file: <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json">https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json</a>.</p>
+
+<p>{{Compat("javascript/promise","Promise.prototype")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/rangeerror/index.html b/files/es/conflicting/web/javascript/reference/global_objects/rangeerror/index.html
new file mode 100644
index 0000000000..0f4dc1fde3
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/rangeerror/index.html
@@ -0,0 +1,132 @@
+---
+title: RangeError.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/RangeError
+tags:
+  - Error
+  - JavaScript
+  - Propiedad
+  - Prototipo
+  - Prototype
+  - RangeError
+translation_of: Web/JavaScript/Reference/Global_Objects/RangeError
+translation_of_original: Web/JavaScript/Reference/Global_Objects/RangeError/prototype
+original_slug: Web/JavaScript/Reference/Global_Objects/RangeError/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>RangeError.prototype</strong></code> representa el prototipo de {{jsxref("RangeError")}}.</p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Todas las instancias de {{jsxref("RangeError")}} heredan de <code>RangeError.prototype</code>. Puede utilizar el prototipo para añadir propiedades o métodos a todas las instancias.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>RangeError.prototype.constructor</code></dt>
+ <dd>Especifica la función que crea instancias del prototipo.</dd>
+ <dt>{{jsxref("Error.prototype.message", "RangeError.prototype.message")}}</dt>
+ <dd>Mensaje de error. Aunque ECMA-262 especifica que {{jsxref("RangeError")}} debe procurar su propio <code>message</code>, en <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, se hereda de {{jsxref("Error.prototype.message")}}.</dd>
+ <dt>{{jsxref("Error.prototype.name", "RangeError.prototype.name")}}</dt>
+ <dd>Nombre del error. Heredada de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.fileName", "RangeError.prototype.fileName")}}</dt>
+ <dd>Ruta al fichero en el que se produjo el error. Heredada de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.lineNumber", "RangeError.prototype.lineNumber")}}</dt>
+ <dd>Número de línea en el fichero en el que se produjo el error. Heredada de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.columnNumber", "RangeError.prototype.columnNumber")}}</dt>
+ <dd>Número de columna de la línea en la que se produjo. Heredada de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.stack", "RangeError.prototype.stack")}}</dt>
+ <dd>Pila de llamadas. Heredada de {{jsxref("Error")}}.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<p>Aunque el prototipo del objeto {{jsxref("RangeError")}} no contiene métodos propios, las instancias de {{jsxref("RangeError")}} heredan algunos a través de la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Herencia_y_la_cadena_de_protipos">cadena de prototipos</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Commentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definido como <code><em>NativeError</em>.prototype</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definido como <code><em>NativeError</em>.prototype</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Error.prototype")}}</li>
+ <li>{{jsxref("Function.prototype")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/string/index.html b/files/es/conflicting/web/javascript/reference/global_objects/string/index.html
new file mode 100644
index 0000000000..5f13679c36
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/string/index.html
@@ -0,0 +1,119 @@
+---
+title: String.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/String
+tags:
+  - JavaScript
+  - Property
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String
+translation_of_original: Web/JavaScript/Reference/Global_Objects/String/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/prototype
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>The <strong><code>String.prototype</code></strong> propiedad representa el prototipo de esta clase. Puede usar el prototipo para añadir propiedades o métodos a todas las instancias de una clase.</p>
+
+<div>{{js_property_attributes(0,0,0)}}</div>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>String.prototype.constructor</code></dt>
+ <dd>Especifica la función que crea un prototipo de objeto.</dd>
+ <dt>{{jsxref("String.prototype.length")}}</dt>
+ <dd>Refleja la longitud de la cadena.</dd>
+</dl>
+
+<div>{{ jsOverrides("Object", "properties", "constructor", "length") }}</div>
+
+<h2 id="Métodos">Métodos</h2>
+
+<h3 id="M.C3.A9todos_no_relacionados_con_HTML" name="M.C3.A9todos_no_relacionados_con_HTML">Métodos no relacionados con HTML</h3>
+
+<dl>
+ <dt>{{jsxref("String.prototype.charAt()")}}</dt>
+ <dd>Devuelve el carácter en el índice especificado.</dd>
+ <dt>{{jsxref("String.prototype.charCodeAt()")}}</dt>
+ <dd>Devuelve el número que indica el valor Unicode del carácter en el índice especificado.</dd>
+ <dt>{{jsxref("String.prototype.concat()")}}</dt>
+ <dd>Combina el texto de dos cadenas y devuelve una nueva cadena.</dd>
+ <dt>{{jsxref("String.prototype.indexOf()")}}</dt>
+ <dd>Devuelve el índice dentro del objeto <code>String</code> que realiza la llamada de la primera ocurrencia del valor especificado, o -1 si no lo encuentra.</dd>
+ <dt>{{jsxref("String.prototype.lastIndexOf()")}}</dt>
+ <dd>Devuelve el índice dentro del objeto <code>String</code> que realiza la llamada de la última ocurrencia del valor especificado, o -1 si no lo encuentra.</dd>
+ <dt>{{jsxref("String.prototype.match()")}}</dt>
+ <dd>Se usa para emparejar una expresión regular con una cadena.</dd>
+ <dt>{{jsxref("String.prototype.replace()")}}</dt>
+ <dd>Se usa para emparejar una expresión regular con una cadena, y reemplezar la subcadena emparejada con una nueva subcadena.</dd>
+ <dt>{{jsxref("String.prototype.search()")}}</dt>
+ <dd>Realiza una búsqueda de una expresión regular en una cadena especificada.</dd>
+ <dt>{{jsxref("String.prototype.slice()")}}</dt>
+ <dd>Extrae una sección de una cadena y devuelve una nueva cadena.</dd>
+ <dt>{{jsxref("String.prototype.split()")}}</dt>
+ <dd>Divide un objeto <code>String</code> en un arreglo de cadenas, separando la cadena en subcadenas.</dd>
+ <dt>{{jsxref("String.prototype.substr()")}}</dt>
+ <dd>Devuelve los caracteres de una cadena comenzando en la localización especificada y hasta el número de caracteres especificado.</dd>
+ <dt>{{jsxref("String.prototype.substring()")}}</dt>
+ <dd>Devuelve los caracteres de una cadena entre dos índices dentro de la cadena.</dd>
+ <dt>{{jsxref("String.prototype.toLowerCase()")}}</dt>
+ <dd>Devuelve el valor de la cadena que realiza la llamada en minúsculas.</dd>
+ <dt>{{jsxref("String.prototype.toSource()")}}</dt>
+ <dd>Devuelve el objeto literal que representa el objeto especificado; puede usar este valor para crear un nuevo objeto. Sobreescribe el método {{jsxref("Object.prototype.toSource()")}}.</dd>
+ <dt>{{jsxref("String.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el objeto especificado. Sobreescribe el método {{jsxref("Object.prototype.toString()")}}.</dd>
+ <dt>{{jsxref("String.prototype.toUpperCase()")}}</dt>
+ <dd>Devuelve el valor de la cadena que realiza la llamada en mayúsculas.</dd>
+ <dt>{{jsxref("String.prototype.valueOf()")}}</dt>
+ <dd>Devuelve el valor primitivo del objeto especificado. Sobreescribe el método {{jsxref("Object.prototype.valueOf()")}}.</dd>
+</dl>
+
+<h3 id="HTML_wrapper_methods" name="HTML_wrapper_methods">Métodos de encapsulado HTML</h3>
+
+<p>Cada uno de los métodos siguientes devuelve una copia de la cadena encapsulada dentro de una etiqueta HTML. Por ejemplo, "test".bold() devuelve "&lt;b&gt;test&lt;/b&gt;".</p>
+
+<dl>
+ <dt>{{jsxref("String.prototype.anchor()")}}</dt>
+ <dd><a class="external" href="http://www.w3.org/TR/html401/struct/links.html#adef-name-A"><code>&lt;a name="<em>name</em>"&gt;</code></a> (Ancha Hipertexto)</dd>
+ <dt>{{jsxref("String.prototype.big()")}}</dt>
+ <dd>{{HTMLElement("big")}}</dd>
+ <dt>{{jsxref("String.prototype.blink()")}}</dt>
+ <dd>{{HTMLElement("blink")}}</dd>
+ <dt>{{jsxref("String.prototype.bold()")}}</dt>
+ <dd>{{HTMLElement("b")}}</dd>
+ <dt>{{jsxref("String.prototype.fixed()")}}</dt>
+ <dd>{{HTMLElement("tt")}}</dd>
+ <dt>{{jsxref("String.prototype.fontcolor()")}}</dt>
+ <dd><code>&lt;font color="<em>color</em>"&gt;</code></dd>
+ <dt>{{jsxref("String.prototype.fontsize()")}}</dt>
+ <dd><code>&lt;font size="<em>size</em>"&gt;</code></dd>
+ <dt>{{jsxref("String.prototype.italics()")}}</dt>
+ <dd>{{HTMLElement("i")}}</dd>
+ <dt>{{jsxref("String.prototype.link()")}}</dt>
+ <dd><a class="external" href="http://www.w3.org/TR/html401/struct/links.html#adef-href"><code>&lt;a href="<em>url</em>"&gt;</code></a> (Enlace a URL)</dd>
+ <dt>{{jsxref("String.prototype.small()")}}</dt>
+ <dd>{{HTMLElement("small")}}</dd>
+ <dt>{{jsxref("String.prototype.strike()")}}</dt>
+ <dd>{{HTMLElement("strike")}}</dd>
+ <dt>{{jsxref("String.prototype.sub()")}}</dt>
+ <dd>{{HTMLElement("sub")}}</dd>
+ <dt>{{jsxref("String.prototype.sup()")}}</dt>
+ <dd>{{HTMLElement("sup")}}</dd>
+</dl>
+
+<p>Estos métodos son de uso limitado, ya que sólo están disponibles un subconjunto de etiquetas HTML y atributos.</p>
+
+<p>{{ jsOverrides("Object", "methods", "charAt", "charCodeAt", "concat", "indexOf", "lastIndexOf", "localeCompare", "match", "quote", "replace", "search", "slice", "split", "substr", "substring", "toLocaleLowerCase", "toLocaleUpperCase", "toLowerCase", "toSource", "toString", "toUpperCase", "trim", "trimLeft", "trimRight", "valueOf", "anchor", "big", "blink", "bold", "fixed", "fontcolor", "fontsize", "italics", "link", "small", "strike", "sub", "sup") }}</p>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("String")}}</li>
+ <li>{{jsxref("Function.prototype")}}</li>
+</ul>
+
+<dl>
+ <dt> </dt>
+</dl>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/syntaxerror/index.html b/files/es/conflicting/web/javascript/reference/global_objects/syntaxerror/index.html
new file mode 100644
index 0000000000..8fbdac1a8d
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/syntaxerror/index.html
@@ -0,0 +1,134 @@
+---
+title: SyntaxError.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/SyntaxError
+tags:
+  - Error
+  - JavaScript
+  - Property
+  - Prototype
+  - SyntaxError
+translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError
+translation_of_original: Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>SyntaxError.prototype</strong></code> representa el prototipo para el constructor {{jsxref("SyntaxError")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Todas las instancias de {{jsxref("SyntaxError")}} son heredadas de <code>SyntaxError.prototype</code>. Puedes usar el prototipo para agregar propiedades o metodos a todas las instancias.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>SyntaxError.prototype.constructor</code></dt>
+ <dd>Especifica la funcion que creó una instancia del prototipo.</dd>
+ <dt>{{jsxref("Error.prototype.message", "SyntaxError.prototype.message")}}</dt>
+ <dd>Mensaje de error. A pesar de que ECMA-262 especifica que {{jsxref("SyntaxError")}} debe proveer su propia propiedad <code>message</code> , en <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, es heredada de {{jsxref("Error.prototype.message")}}.</dd>
+ <dt>{{jsxref("Error.prototype.name", "SyntaxError.prototype.name")}}</dt>
+ <dd>Error name. Inherited from {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.fileName", "SyntaxError.prototype.fileName")}}</dt>
+ <dd>Ruta al archivo que produjo el error. Heredada de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.lineNumber", "SyntaxError.prototype.lineNumber")}}</dt>
+ <dd>Numero de linea en el archivo que produjo el error. Heredada de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.columnNumber", "SyntaxError.prototype.columnNumber")}}</dt>
+ <dd>Numero de columna en la linea que produjo el error. Heredada de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.stack", "SyntaxError.prototype.stack")}}</dt>
+ <dd>Stack trace. Heredada de {{jsxref("Error")}}.</dd>
+</dl>
+
+<h2 id="Metodos">Metodos</h2>
+
+<p>A pesar de que el objeto prototipo de {{jsxref("SyntaxError")}} no contiene metodos propios, las instancias de {{jsxref("SyntaxError")}} heredan algunos metodos debido a la cadena de prototipos.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Defined as <code><em>NativeError</em>.prototype</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Defined as <code><em>NativeError</em>.prototype</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Defined as <code><em>NativeError</em>.prototype</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<h2 id="CompatibilityTable"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{CompatibilityTable}}</span></h2>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Error.prototype")}}</li>
+ <li>{{jsxref("Function.prototype")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/global_objects/weakmap/index.html b/files/es/conflicting/web/javascript/reference/global_objects/weakmap/index.html
new file mode 100644
index 0000000000..fd84aa6280
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/global_objects/weakmap/index.html
@@ -0,0 +1,144 @@
+---
+title: WeakMap.prototype
+slug: conflicting/Web/JavaScript/Reference/Global_Objects/WeakMap
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Property
+  - WeakMap
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap
+translation_of_original: Web/JavaScript/Reference/Global_Objects/WeakMap/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>WeakMap</strong></code><strong><code>.prototype</code></strong> representa el prototipo para el constructor {{jsxref("WeakMap")}}.</p>
+
+<div>{{js_property_attributes(0,0,0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las instancias de {{jsxref("WeakMap")}} heredan de {{jsxref("WeakMap.prototype")}}. Se puede usar el objeto prototipo del constructor para añadir propiedades o métodos para todas las instancias de  <code>WeakMap</code>.</p>
+
+<p><code>WeakMap.prototype</code> por si mismo es solamente un objeto ordinario:</p>
+
+<pre class="brush: js">Object.prototype.toString.call(WeakMap.prototype); // "[object Object]"</pre>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>WeakMap.prototype.constructor</code></dt>
+ <dd>Retorna la función que creó el prototipo de la instanciaReturns the function that created an instance's prototype. Esta es la función {{jsxref("WeakMap")}} por defecto.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("WeakMap.delete", "WeakMap.prototype.delete(key)")}}</dt>
+ <dd>Remueve cualquier valor asociado a la clave. Después de esto <code>WeakMap.prototype.has(key)</code> retornará falso.</dd>
+ <dt>{{jsxref("WeakMap.get", "WeakMap.prototype.get(key)")}}</dt>
+ <dd>Retorna el valor asociado a la clave, o <code>undefined</code> si no hay ninguno.</dd>
+ <dt>{{jsxref("WeakMap.has", "WeakMap.prototype.has(key)")}}</dt>
+ <dd>Retorna un valor booleano indicando si hay un valor asociado a la clave en el objeto the <code>WeakMap</code> object o no.</dd>
+ <dt>{{jsxref("WeakMap.set", "WeakMap.prototype.set(key, value)")}}</dt>
+ <dd>Asigna el valor para la clave en el objeto <code>WeakMap</code>. Retorna el objeto <code>WeakMap</code>.</dd>
+ <dt><s class="obsoleteElement">{{jsxref("WeakMap.prototype.clear()")}} {{obsolete_inline}}</s></dt>
+ <dd><s class="obsoleteElement">Remueve todas los pares clave/valore del objeto <code>WeakMap</code>. Notese que es posible implementar un objeto parecido al <code>WeakMap</code> que posea un método <code>.clear()</code>, encapsulando el objeto <code>WeakMap</code> que no lo tiene (ver ejemplo en la página {{jsxref("WeakMap")}})</s></dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>36</td>
+   <td>{{CompatGeckoDesktop("6.0")}}</td>
+   <td>11</td>
+   <td>23</td>
+   <td>7.1</td>
+  </tr>
+  <tr>
+   <td>Objeto ordinario</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("40")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("6.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+  <tr>
+   <td>Objeto ordinario</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("40")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map.prototype")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/lexical_grammar/index.html b/files/es/conflicting/web/javascript/reference/lexical_grammar/index.html
new file mode 100644
index 0000000000..0f36de5c58
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/lexical_grammar/index.html
@@ -0,0 +1,100 @@
+---
+title: Palabras Reservadas
+slug: conflicting/Web/JavaScript/Reference/Lexical_grammar
+tags:
+  - JavaScript
+  - palabras reservadas
+translation_of: Web/JavaScript/Reference/Lexical_grammar#Keywords
+translation_of_original: Web/JavaScript/Reference/Reserved_Words
+original_slug: Web/JavaScript/Referencia/Palabras_Reservadas
+---
+<p> </p>
+
+<p>Las siguientes son palabras reservadas y no pueden ser utilizadas como variables, funciones, métodos o identificadores de objetos. Las siguientes son reservadas como palabras claves existentes por la especificación ECMAScript:</p>
+
+<h3 id="Reserved_keywords_as_of_ECMAScript_6">Reserved keywords as of ECMAScript 6</h3>
+
+<div class="threecolumns">
+<ul>
+ <li>{{jsxref("Sentencias/break", "break")}}</li>
+ <li>{{jsxref("Sentencias/switch", "case")}}</li>
+ <li><code>class</code></li>
+ <li>{{jsxref("Sentencias/try...catch", "catch")}}</li>
+ <li>{{jsxref("Sentencias/const", "const")}}</li>
+ <li>{{jsxref("Sentencias/continue", "continue")}}</li>
+ <li>{{jsxref("Sentencias/debugger", "debugger")}}</li>
+ <li>{{jsxref("Sentencias/switch", "default")}}</li>
+ <li>{{jsxref("Operadores/delete", "delete")}}</li>
+ <li>{{jsxref("Sentencias/while", "do")}}</li>
+ <li>{{jsxref("Sentencias/if...else", "else")}}</li>
+ <li>{{jsxref("Sentencias/export", "export")}}</li>
+ <li><code>extends</code></li>
+ <li>{{jsxref("Sentencias/try...catch", "finally")}}</li>
+ <li>{{jsxref("Sentencias/for", "for")}}</li>
+ <li>{{jsxref("Sentencias/function", "function")}}</li>
+ <li>{{jsxref("Sentencias/if...else", "if")}}</li>
+ <li>{{jsxref("Sentencias/import", "import")}}</li>
+ <li>{{jsxref("Sentencias/for...in", "in")}}</li>
+ <li>{{jsxref("Operadores/instanceof", "instanceof")}}</li>
+ <li>{{jsxref("Sentencias/let", "let")}}</li>
+ <li>{{jsxref("Operadores/new", "new")}}</li>
+ <li>{{jsxref("Sentencias/return", "return")}}</li>
+ <li>{{jsxref("Operadores/super", "super")}}</li>
+ <li>{{jsxref("Sentencias/switch", "switch")}}</li>
+ <li>{{jsxref("Operadores/this", "this")}}</li>
+ <li>{{jsxref("Sentencias/throw", "throw")}}</li>
+ <li>{{jsxref("Sentencias/try...catch", "try")}}</li>
+ <li>{{jsxref("Operadores/typeof", "typeof")}}</li>
+ <li>{{jsxref("Sentencias/var", "var")}}</li>
+ <li>{{jsxref("Operadores/void", "void")}}</li>
+ <li>{{jsxref("Sentencias/while", "while")}}</li>
+ <li>{{jsxref("Sentencias/with", "with")}}</li>
+ <li><code>yield</code></li>
+</ul>
+</div>
+
+<p>Las siguientes estan reservadas como palabras futuras por la especificación ECMAScript:</p>
+
+<ul>
+ <li><code>enum</code></li>
+</ul>
+
+<p>Las siguientes estan reservadas como palabras futuras cuando se encuentre el modo correcto para su estructura de codigo:</p>
+
+<div class="threecolumns">
+<ul>
+ <li><code>implements</code></li>
+ <li><code>package</code></li>
+ <li><code>protected</code></li>
+ <li><code>static</code></li>
+ <li><code>interface</code></li>
+ <li><code>private</code></li>
+ <li><code>public</code></li>
+</ul>
+</div>
+
+<h4 id="Futuras_Palabras_Reservadas_en_estandares_antiguos">Futuras Palabras Reservadas en estandares antiguos</h4>
+
+<p>Las siguientes estan reservadas como palabras futuras por la antigua especificación ECMAScript (ECMAScript 1 hasta 3).</p>
+
+<div class="threecolumns">
+<ul>
+ <li><code>abstract</code></li>
+ <li><code>boolean</code></li>
+ <li><code>byte</code></li>
+ <li><code>char</code></li>
+ <li><code>double</code></li>
+ <li><code>final</code></li>
+ <li><code>float</code></li>
+ <li><code>goto</code></li>
+ <li><code>int</code></li>
+ <li><code>long</code></li>
+ <li><code>native</code></li>
+ <li><code>short</code></li>
+ <li><code>synchronized</code></li>
+ <li><code>transient</code></li>
+ <li><code>volatile</code></li>
+</ul>
+</div>
+
+<p>Adicionalmente, los literales "<code>null"</code>, "<code>true"</code>, y "<code>false"</code> estan reservadas en ECMAScript para usos normales.</p>
diff --git a/files/es/conflicting/web/javascript/reference/operators/index.html b/files/es/conflicting/web/javascript/reference/operators/index.html
new file mode 100644
index 0000000000..ef6c162b92
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/operators/index.html
@@ -0,0 +1,316 @@
+---
+title: Operadores Aritméticos
+slug: conflicting/Web/JavaScript/Reference/Operators
+tags:
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators
+translation_of_original: Web/JavaScript/Reference/Operators/Arithmetic_Operators
+original_slug: Web/JavaScript/Referencia/Operadores/Aritméticos
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>Los operadores Aritméticos toman valores numéricos (ya sean literales o variables) como sus operandos y retornan un valor numérico único. Los operadores aritméticos estándar son adición o suma (+), sustracción o resta (-), multiplicación (*), y división (/).</p>
+
+<p>Estos operadores trabajan al igual que en la mayoría de otros lenguajes de programacion, excepto el operador /, que retorna una división de punto flotante en JavaScript, no una división truncada como en lenguajes tales como C o Java. Por ejemplo:</p>
+
+<p>{{EmbedInteractiveExample("pages/js/expressions-arithmetic.html")}}</p>
+
+<h2 id="Suma_o_adición_()"><a name="Addition">Suma o adición (+)</a></h2>
+
+<p>La operación suma se produce mediante la suma de número o strings concatenados.</p>
+
+<h3 id="Sintaxis">Sintaxis</h3>
+
+<pre class="brush: js"><strong>Operador:</strong> x + y</pre>
+
+<h3 id="Ejemplos">Ejemplos:</h3>
+
+<pre class="brush: js">// Número + Número = Adición
+
+1 + 2 // 3
+
+// Bolean + Número = Adición
+
+true + 1 // 2
+
+// Bolean + Bolean // Adición
+
+false + false // 0
+
+// Número + String = Concatenación
+
+5 + 'foo' // "5foo"
+
+// String + Bolean = Concatenación
+
+'foo' + true // "footrue"
+
+// String + String = Concatenación
+
+'foo' + 'bar' // "foobar"
+</pre>
+
+<h2 id="Resta_o_sustracción_(-)"><a name="Subtraction">Resta o sustracción (-)</a></h2>
+
+<p>La resta se produce cuando se sutraen el resultado de los operadores, produciendo su diferencia.</p>
+
+<h3 id="Sintaxis_2">Sintaxis</h3>
+
+<pre class="brush: js"><strong>Operador:</strong> x - y</pre>
+
+<h3 id="Ejemplos_2">Ejemplos</h3>
+
+<pre class="brush: js">5 - 3     // 2
+3 - 5     // -2
+'foo' - 3 // NaN
+</pre>
+
+<h2 id="División_()"><a name="Division">División (/)</a></h2>
+
+<p>El operador división se produce el cociente de la operación donde el operando izquierdo es el dividendo y el operando derecho es el divisor.</p>
+
+<h3 id="Sintaxis_3">Sintaxis</h3>
+
+<pre class="brush: js"><strong>Operador:</strong> x / y</pre>
+
+<h3 id="Ejemplos_3">Ejemplos</h3>
+
+<pre class="brush: js">1 / 2      // devuelve 0.5 en JavaScript
+1 / 2      // devuelve 0 en Java
+// (Ninguno de los números es explícitamente un número de punto flotante)
+
+1.0 / 2.0  // devuelve 0.5 en JavaScript y Java
+
+2.0 / 0    // devuelve Infinito en JavaScript
+2.0 / 0.0  // devuelve Infinito
+2.0 / -0.0 // devuelve -Infinito en JavaScript
+</pre>
+
+<h2 id="Multiplicación_(*)"><a name="Multiplication">Multiplicación (*)</a></h2>
+
+<p>El operador multiplicación produce el producto de la multiplicación de los operandos.</p>
+
+<h3 id="Sintaxis_4">Sintaxis</h3>
+
+<pre class="brush: js"><strong>Operador:</strong> x * y</pre>
+
+<h3 id="Ejemplos_4">Ejemplos</h3>
+
+<pre class="brush: js">2 * 2 // 4
+-2 * 2 // -4
+Infinito * 0 // NaN
+Infinito * Infinito // Infinito
+'foo' * 2 // NaN</pre>
+
+<h2 id=".25_.28modular.29" name=".25_.28modular.29">Resto o Residuo  (%)</h2>
+
+<p>El operador resto devuelve el resto que queda cuando un operando se divide por un segundo operando. Siempre toma el signo del dividendo, no el divisor. Utiliza una función de <code>modulo</code> incorporada para producir el resultado, que es el resto entero de dividir <code>var1</code> por <code>var2</code> - por ejemplo - <code>var1</code> modulo <code>var2</code>. <a href="http://wiki.ecmascript.org/doku.php?id=strawman:modulo_operator">Existe una propuesta para obtener un operador de módulo real en una versión futura de ECMAScript</a>, con la diferencia de que el resultado del operador de módulo tomaría el signo del divisor, no el dividendo.</p>
+
+<h3 id="Sintaxis_5">Sintaxis</h3>
+
+<pre class="brush: js"><strong>Operador:</strong> var1 % var2</pre>
+
+<h3 id="Ejemplos_5">Ejemplos</h3>
+
+<pre class="brush: js">12 % 5  // 2
+-1 % 2  // -1
+1 % -2  // 1
+NaN % 2 // NaN
+1 % 2   // 1
+2 % 3   // 2
+-4 % 2  // -0
+5.5 % 2 // 1.5</pre>
+
+<h2 id="Exponenciación_(**)">Exponenciación (**)</h2>
+
+<p>El operador de exponenciación devuelve el resultado de elevar el primer operando al segundo operando de potencia. es decir, <code>var1<sup>var2</sup></code>, en la declaración anterior, donde <code>var1</code> y <code>var2</code> son variables. El operador de exponenciación es asociativo a la derecha. <code>a ** b ** c</code> es igual a <code>a ** (b ** c)</code>.</p>
+
+<h3 id="Sintaxis_6">Sintaxis</h3>
+
+<pre><strong>Operador:</strong> var1 ** var2</pre>
+
+<p> </p>
+
+<h3 id="Notas">Notas</h3>
+
+<p>En la mayoría de los lenguajes como PHP y Python y otros que tienen un operador de exponenciación (**), el operador de exponenciación se define para tener una precedencia más alta que los operadores unarios, como unario + y unario -, pero hay algunas excepciones. Por ejemplo, en Bash, el operador ** se define como de menor precedencia que los operadores unarios. En JavaScript, es imposible escribir una expresión de exponenciación ambigua, es decir, no se puede poner un operador unario (<code>+/-/~/!/delete/void/typeof</code>) inmediatamente antes del número de base.</p>
+
+<pre class="brush: js">-2 ** 2;
+// 4 en Bash, -4 en otros idiomas.
+// Esto no es válido en JavaScript, ya que la operación es ambigua.
+
+
+-(2 ** 2);
+// -4 en JavaScript y la intención del autor no es ambigua.</pre>
+
+<h3 id="Ejemplos_6">Ejemplos</h3>
+
+<pre class="brush: js">2 ** 3        // 8
+3 ** 2        // 9
+3 ** 2.5      // 15.588457268119896
+10 ** -1      // 0.1
+NaN ** 2      // NaN
+
+2 ** 3 ** 2   // 512
+2 ** (3 ** 2) // 512
+(2 ** 3) ** 2 // 64</pre>
+
+<p>Para invertir el signo del resultado de una expresión de exponenciación:</p>
+
+<pre class="brush: js">-(2 ** 2) // -4</pre>
+
+<p>Para forzar la base de una expresión de exponenciación a ser un número negativo:</p>
+
+<pre class="brush: js">(-2) ** 2 // 4</pre>
+
+<div class="note">
+<p><strong>Nota:</strong> JavaScript también tiene <a href="/es/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#Bitwise_XOR">un operador bit a bit ^ (logical XOR)</a>. <code>**</code> y <code>^</code> son diferentes (por ejemplo: <code>2 ** 3 === 8</code> cuando <code>2 ^ 3 === 1</code>.)</p>
+</div>
+
+<p> </p>
+
+<h2 id=".2B.2B_.28incremento.29" name=".2B.2B_.28incremento.29">Incremento (++)</h2>
+
+<p> </p>
+
+<p>El operador de incremento incrementa (agrega uno a) su operando y devuelve un valor.</p>
+
+<ul>
+ <li>Si se usa postfijo, con el operador después del operando (por ejemplo, x++), devuelve el valor antes de incrementar.</li>
+ <li>Si se usa prefijo, con el operador antes del operando (por ejemplo, ++x), devuelve el valor después de incrementar.</li>
+</ul>
+
+<h3 id="Sintaxis_7">Sintaxis</h3>
+
+<pre><strong>Operador:</strong> x++ o ++x</pre>
+
+<h3 id="Ejemplos_7">Ejemplos</h3>
+
+<pre class="brush: js">// Postfijo
+var x = 3;
+y = x++; // y = 3, x = 4
+
+// Prefijo
+var a = 2;
+b = ++a; // a = 3, b = 3
+</pre>
+
+<h2 id="--_.28decremento.29" name="--_.28decremento.29">Decremento (--)</h2>
+
+<p>El operador de decremento disminuye (resta uno de) su operando y devuelve un valor.</p>
+
+<ul>
+ <li>Si se usa postfijo (por ejemplo, x--), devuelve el valor antes de decrementar.</li>
+ <li>Si usa el prefijo (por ejemplo, --x), entonces devuelve el valor después de decrementar.</li>
+</ul>
+
+<h3 id="Sintaxis_8">Sintaxis</h3>
+
+<pre><strong>Operador:</strong> x-- o --x</pre>
+
+<h3 id="Ejemplos_8">Ejemplos</h3>
+
+<pre class="brush: js">// Postfijo
+var x = 3;
+y = x--; // y = 3, x = 2
+
+// Prefijo
+var a = 2;
+b = --a; // a = 1, b = 1</pre>
+
+<p> </p>
+
+<h2 id="-_.28negaci.C3.B3n_unitario.29" name="-_.28negaci.C3.B3n_unitario.29">Negación unaria (-)</h2>
+
+<p>El operador de negación unaria precede su operando y lo niega.</p>
+
+<h3 id="Sintaxis_9">Sintaxis</h3>
+
+<pre><strong>Operador:</strong> -x</pre>
+
+<h3 id="Ejemplos_9">Ejemplos</h3>
+
+<pre class="brush: js">var x = 3;
+y = -x; // y = -3, x = 3
+
+// el operador de negación unario puede convertir no-números en un número
+var x = "4";
+y = -x; // y = -4</pre>
+
+<h2 id="Unario_más_()">Unario más (+)</h2>
+
+<p>El operador unario más precede su operando y evalúa su operando, pero intenta convertirlo en un número, si no lo está. Aunque la negación unaria (-) también puede convertir no números, unario plus es la manera más rápida y preferida de convertir algo en un número, porque no realiza ninguna otra operación en el número. Puede convertir representaciones de cadenas de enteros y flotantes, así como los valores que no sean cadenas <code>true</code>, <code>false</code> y <code>null</code>. Se admiten enteros en formato decimal y hexadecimal ("0x" -prefijado). Los números negativos son compatibles (aunque no para hexadecimal). Si no puede analizar un valor particular, evaluará a <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a>.</p>
+
+<h3 id="Sintaxis_10">Sintaxis</h3>
+
+<pre><strong>Operador:</strong> +x</pre>
+
+<h3 id="Ejemplos_10">Ejemplos</h3>
+
+<pre class="brush: js">+3     // 3
++'3'   // 3
++true  // 1
++false // 0
++null  // 0
++function(val){  return val } // NaN</pre>
+
+<p> </p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.3')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>
+    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.6">Operadores aditivos</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.5">Operadores multiplicativos</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.3">Expresiones Postfijas</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4">Operadores unarios.</a></p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-postfix-expressions')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>
+    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-additive-operators">Operadores aditivos</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-multiplicative-operators">Operadores multiplicativos</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-postfix-expressions">Expresiones Postfijas</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-unary-operators">Operadores unarios.</a></p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2016', '#sec-postfix-expressions')}}</td>
+   <td>{{Spec2('ES2016')}}</td>
+   <td><a href="https://github.com/rwaldron/exponentiation-operator">Operador de exponenciación</a> agregado.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2017', '#sec-postfix-expressions')}}</td>
+   <td>{{Spec2('ES2017')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-additive-operators')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.operators.arithmetic")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Assignment_Operators">Operadores de Asignación</a></li>
+</ul>
+
+<p> </p>
diff --git a/files/es/conflicting/web/javascript/reference/operators/spread_syntax/index.html b/files/es/conflicting/web/javascript/reference/operators/spread_syntax/index.html
new file mode 100644
index 0000000000..f8d23e4eaa
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/operators/spread_syntax/index.html
@@ -0,0 +1,221 @@
+---
+title: Operador de propagación
+slug: conflicting/Web/JavaScript/Reference/Operators/Spread_syntax
+tags:
+  - Experimental
+  - Expérimental(2)
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators/Spread_syntax
+translation_of_original: Web/JavaScript/Reference/Operators/Spread_operator
+original_slug: Web/JavaScript/Referencia/Operadores/Spread_operator
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de propagación <em><strong>spread operator</strong></em> permite que una expresión sea expandida en situaciones donde se esperan múltiples argumentos (llamadas a funciones) o múltiples elementos (arrays literales).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p>Llamadas a funciones:</p>
+
+<pre class="brush: js">f(...iterableObj);
+</pre>
+
+<p>Arrays literales:</p>
+
+<pre class="brush: js">[...iterableObj, 4, 5, 6]</pre>
+
+<p>Desestructuración <em>destructuring</em>:</p>
+
+<pre class="brush: js">[a, b, ...iterableObj] = [1, 2, 3, 4, 5];</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Un_mejor_método_apply">Un mejor método apply</h3>
+
+<p><strong>Ejemplo:</strong> Es común usar {{jsxref( "Function.prototype.apply")}} en casos donde se require un array como contenedor de los argumentos que se enviarán a una llamada de función:</p>
+
+<pre class="brush: js">function f(x, y, z) { }
+var args = [0, 1, 2];
+f.apply(null, args);</pre>
+
+<p>Con el operador spread de ES6, el ejemplo anterior se puede rescribir como:</p>
+
+<pre class="brush: js">function f(x, y, z) { }
+var args = [0, 1, 2];
+f(...args);</pre>
+
+<p>Cualquier argumento en la lista de argumentos puede usar la sintaxis de propagación <em>spread, </em>donde además puede ser usada varias veces.</p>
+
+<pre class="brush: js">function f(v, w, x, y, z) { }
+var args = [0, 1];
+f(-1, ...args, 2, ...[3]);</pre>
+
+<h3 id="Un_array_literal_mas_poderoso">Un array literal mas poderoso</h3>
+
+<p><strong>Ejemplo:</strong> La sintaxis de un array literal que existe hoy en día no es suficiente si se requiere agregar los elementos de un array dentro de otro array existente. Actualmente se debe escribir código imperativo usando una combinación de métodos como <code>push</code>, <code>splice</code>, <code>concat</code>, etc. Con la sintaxis de propagación <em>spread</em> esta tarea resulta mucho mas concisa:</p>
+
+<pre class="brush: js">var parts = ['shoulder', 'knees'];
+var lyrics = ['head', ...parts, 'and', 'toes'];</pre>
+
+<p>Al igual que con una lista de argumentos, en este caso también puede ser usado en cualquier ubicación dentro del array literal, además de poderse incluir una o varias veces.</p>
+
+<h3 id="Combinación_del_método_apply_y_el_operador_new">Combinación del método apply y el operador new</h3>
+
+<p><strong>Ejemplo:</strong> En ES5 no es posible combinar <code>new</code> y <code>apply</code> (en ES5  el método <code>apply</code> crea un <code>[[Call]]</code> y no un <code>[[Construct]]</code>). En ES6 la sintaxis de propagación <em>spread</em> soporta esto de forma natural:</p>
+
+<pre class="brush: js">var dateFields = readDateFields(database);
+var d = new Date(...dateFields);</pre>
+
+<h3 id="Un_método_push_mejorado">Un método push mejorado</h3>
+
+<p><strong>Ejemplo:</strong> {{jsxref("Global_Objects/Array/push", "push")}} suele usarse para agregar los elementos de un array al final de otro array existente. En ES5 esta tarea puede ser realizada de la siguiente manera:</p>
+
+<pre class="brush: js">var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+// Agregar todos los elementos de arr2 a arr1
+Array.prototype.push.apply(arr1, arr2);</pre>
+
+<p>Usando el operador de propagación <em>spread</em> de ES6, este sería el resultado:</p>
+
+<pre class="brush: js">var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+arr1.push(...arr2);</pre>
+
+<h3 id="Solo_funciona_para_iterables">Solo funciona para iterables</h3>
+
+<pre class="brush: js">var obj = {"key1":"value1"};
+function myFunction(x) {
+    console.log(x); // undefined
+}
+myFunction(...obj);
+var args = [...obj];
+console.log(args, args.length) //[] 0</pre>
+
+<h2 id="Operador_Rest">Operador Rest</h2>
+
+<p>El operador <em>Rest</em> es exactamente igual a la sintaxis del operador de propagación, y se utiliza para desestructurar arrays y objetos. En cierto modo, <em>Rest</em> es lo contrario de <em>spread</em>. <em>Spread</em> 'expande' un array en sus elementos, y <em>Rest</em> recoge múltiples elementos y los 'condensa' en uno solo.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Commentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>
+    <p>{{SpecName('ES6', '#sec-array-initializer', 'Array Initializer')}}<br>
+     {{SpecName('ES6', '#sec-argument-lists', 'Argument Lists')}}</p>
+   </td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>
+    <ul>
+     <li>12.2.4 Array Initializer</li>
+     <li>12.3.6 Argument Lists</li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Operación de spread en arrays literales</td>
+   <td>{{CompatNo}}<br>
+    <a href="https://code.google.com/p/v8/issues/detail?id=3018">v8 issue 3018</a></td>
+   <td>{{ CompatGeckoDesktop("16") }}<br>
+    {{ CompatGeckoDesktop("36") }} (Symbol.iterator)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>7.1</td>
+  </tr>
+  <tr>
+   <td>Operación de spread en llamadas a funciones</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("27") }}<br>
+    {{ CompatGeckoDesktop("36") }} (Symbol.iterator)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>7.1</td>
+  </tr>
+  <tr>
+   <td>Operación de spread en desestructuración<br>
+    <em>destructuring</em></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("34") }}<br>
+    {{ CompatGeckoDesktop("36") }} (Symbol.iterator)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Características</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td><span style="font-size: 12px; line-height: 18px;">Operación de spread en arrays literales</span></td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("16") }}<br>
+    {{ CompatGeckoMobile("36") }} (Symbol.iterator)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>iOS 8</td>
+  </tr>
+  <tr>
+   <td><span style="font-size: 12px; line-height: 18px;">Operación de spread en llamadas a funciones</span></td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("27") }}<br>
+    {{ CompatGeckoMobile("36") }} (Symbol.iterator)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>iOS 8</td>
+  </tr>
+  <tr>
+   <td><span style="font-size: 12px; line-height: 18px;">Operación de spread en desestructuración</span><br>
+    <em>destructuring</em></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("34") }}<br>
+    {{ CompatGeckoMobile("36") }} (Symbol.iterator)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Temas_relacionados">Temas relacionados</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/rest_parameters">Parámetros rest</a></li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/operators_5a0acbbb60ea37d0fdc52e3bd4c3fae8/index.html b/files/es/conflicting/web/javascript/reference/operators_5a0acbbb60ea37d0fdc52e3bd4c3fae8/index.html
new file mode 100644
index 0000000000..9c2a7a8c40
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/operators_5a0acbbb60ea37d0fdc52e3bd4c3fae8/index.html
@@ -0,0 +1,264 @@
+---
+title: Operadores de Comparación
+slug: >-
+  conflicting/Web/JavaScript/Reference/Operators_5a0acbbb60ea37d0fdc52e3bd4c3fae8
+tags:
+  - JavaScript
+  - Operador
+  - Referencia
+translation_of: Web/JavaScript/Reference/Operators
+translation_of_original: Web/JavaScript/Reference/Operators/Comparison_Operators
+original_slug: Web/JavaScript/Referencia/Operadores/Comparison_Operators
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>JavaScript tiene comparaciones estrictas y de conversión de tipos. Una comparación estricta (por ejemplo, <code>===</code>) solo es verdadera si los operandos son del mismo tipo y los contenidos coinciden. La comparación abstracta más comúnmente utilizada (por ejemplo, <code>==</code>) convierte los operandos al mismo tipo antes de hacer la comparación. Para las comparaciones abstractas relacionales (p. Ej., <code>&lt;=</code>), Los operandos primero se convierten en primitivos, y luego en el mismo tipo, antes de la comparación.</p>
+
+<p>Las cadenas se comparan en base al orden lexicográfico estándar, utilizando valores Unicode.</p>
+
+<pre class="brush: js notranslate">console.log(1 == 1)
+// Esperamos True
+
+console.log("1" == 1 )
+// Esperamos true
+
+console.log( 1 === 1)
+// Esperamos true
+
+console.log( "1" === 1)
+// Esperamos false
+</pre>
+
+<p>Características de las comparaciones:</p>
+
+<ul>
+ <li>Dos cadenas son estrictamente iguales cuando tienen la misma secuencia de caracteres, la misma longitud y los mismos caracteres en las posiciones correspondientes.</li>
+ <li>Dos números son estrictamente iguales cuando son numéricamente iguales (tienen el mismo valor numérico). <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a> no es igual a nada, incluido NaN. Los ceros positivos y negativos son iguales entre sí. </li>
+ <li>Dos operandos booleanos son estrictamente iguales si ambos son <code>true</code> o ambos son <code>false</code>.</li>
+ <li>Dos objetos distintos nunca son iguales para comparaciones estrictas o abstractas.</li>
+ <li>Una expresión que compara objetos solo es verdadera si los operandos hacen referencia al mismo objeto.</li>
+ <li>Los tipos Null y Undefined son estrictamente iguales a ellos mismos y abstractivamente iguales entre sí.</li>
+</ul>
+
+<h2 id="Operadores_de_igualdad">Operadores de igualdad</h2>
+
+<h3 id="Igualdad"><a name="Equality">Igualdad (==)</a></h3>
+
+<p>El operador de igualdad convierte los operandos si <strong>no son del mismo tipo</strong>, luego aplica una comparación estricta. Si <strong>ambos operandos son objetos</strong>, entonces JavaScript compara las referencias internas que son iguales cuando los operandos se refieren al mismo objeto en la memoria.</p>
+
+<h4 id="Sintaxis">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate">x == y
+</pre>
+
+<h4 id="Ejemplos">Ejemplos</h4>
+
+<pre class="brush: js notranslate">1    ==  1         // true
+'1'  ==  1         // true
+1    == '1'        // true
+0    == false      // true
+0    == null       // false
+var object1 = {'key': 'value'}, object2 = {'key': 'value'};
+object1 == object2 // false
+0    == undefined  // false
+null == undefined  // true
+</pre>
+
+<h3 id="Desigualdad_!"><a name="Inequality">Desigualdad (!=)</a></h3>
+
+<p>El operador de desigualdad devuelve verdadero si los operandos no son iguales. Si los dos operandos <strong>no son del mismo tipo</strong>, JavaScript intenta convertir los operandos a un tipo apropiado para la comparación. Si <strong>ambos operandos son objetos</strong>, entonces JavaScript compara las referencias internas que no son iguales cuando los operandos se refieren a diferentes objetos en la memoria.</p>
+
+<h4 id="Sintaxis_2">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate">x != y</pre>
+
+<h4 id="Ejemplos_2">Ejemplos</h4>
+
+<pre class="brush: js notranslate">1 !=   2     // true
+1 !=  '1'    // false
+1 !=  "1"    // false
+1 !=  true   // false
+0 !=  false  // false
+</pre>
+
+<h3 id="Identidad_igualdad_estricta"><a name="Identity">Identidad / igualdad estricta (===)</a></h3>
+
+<p>El operador de identidad devuelve verdadero si los operandos son estrictamente iguales (ver arriba) <strong>sin conversión de tipo</strong>.</p>
+
+<h4 id="Sintaxis_3">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate">x === y</pre>
+
+<h4 id="Ejemplos_3">Ejemplos</h4>
+
+<pre class="brush: js  notranslate">3 === 3   // true
+3 === '3' // false
+var object1 = {'key': 'value'}, object2 = {'key': 'value'};
+object1 === object2 // false</pre>
+
+
+
+<h3 id="Sin_identidad_desigualdad_estricta_!"><a name="Nonidentity">Sin identidad / desigualdad estricta (!==)</a></h3>
+
+<p>El operador sin identidad devuelve verdadero si los operandos <strong>no son iguales y / o no del mismo tipo</strong>.</p>
+
+<h4 id="Sintaxis_4">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate">x !== y</pre>
+
+<h4 id="Ejemplos_4">Ejemplos</h4>
+
+<pre class="brush: js notranslate">3 !== '3' // true
+4 !== 3   // true
+</pre>
+
+<h2 id="Operadores_relacionales">Operadores relacionales</h2>
+
+<p>Cada uno de estos operadores llamará a la función <code>valueOf()</code> en cada operando antes de realizar una comparación.</p>
+
+<h3 id="Operador_mayor_que_>"><a name="Greater_than_operator">Operador mayor que (&gt;)</a></h3>
+
+<p>El operador mayor que, devuelve verdadero si el operando izquierdo es mayor que el operando derecho.</p>
+
+<h4 id="Sintaxis_5">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate">x &gt; y</pre>
+
+<h4 id="Ejemplos_5">Ejemplos</h4>
+
+<pre class="brush: js notranslate">4 &gt; 3 // true
+</pre>
+
+<h3 id="Operador_mayor_o_igual_>"><a name="Greater_than_or_equal_operator">Operador mayor o igual (&gt;=)</a></h3>
+
+<p>El operador mayor o igual que, devuelve verdadero si el operando izquierdo es mayor o igual que el operando derecho.</p>
+
+<h4 id="Sintaxis_6">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate"> x &gt;= y</pre>
+
+<h4 id="Ejemplos_6">Ejemplos</h4>
+
+<pre class="brush: js notranslate">4 &gt;= 3 // true
+3 &gt;= 3 // true
+</pre>
+
+<h3 id="Operador_menor_que_&lt;"><a name="Less_than_operator"> Operador menor que (&lt;)</a></h3>
+
+<p>El operador menor que devuelve verdadero si el operando de la izquierda es menor que el operando de la derecha.</p>
+
+<h4 id="Sintaxis_7">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate"> x &lt; y</pre>
+
+<h4 id="Ejemplos_7">Ejemplos</h4>
+
+<pre class="brush: js notranslate">3 &lt; 4 // true
+</pre>
+
+<h3 id="Operador_menor_o_igual_&lt;"><a id="Less_than_or_equal_operator" name="Less_than_or_equal_operator">Operador menor o igual (&lt;=)</a></h3>
+
+<p>El operador menor o igual devuelve verdadero si el operando izquierdo es menor o igual que el operando derecho.</p>
+
+<h4 id="Sintaxis_8">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate"> x &lt;= y</pre>
+
+<h4 id="Ejemplos_8">Ejemplos</h4>
+
+<pre class="brush: js notranslate">3 &lt;= 4 // true
+</pre>
+
+<h2 id="Usando_los_operadores_de_igualdad">Usando los operadores de igualdad</h2>
+
+<p>Los operadores de igualdad estándar (<code>==</code> y <code>!=</code>) utilizan el <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.3">Algoritmo de Comparación de Igualdad Abstracta</a> para comparar dos operandos. Si los operandos son de tipos diferentes, intentará convertirlos al mismo tipo antes de hacer la comparación, por ejemplo, en la expresión <code>5 == '5'</code>, la cadena de la derecha se convierte a {{jsxref("Number")}} antes de realizar la comparación.</p>
+
+<p>Los operadores de igualdad estricta (<code>===</code> y <code>!==</code>) usan el <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.6">Algoritmo de Comparación de Igualdad Estricta</a> y están destinados a realizar comparaciones de igualdad en operandos del mismo tipo. Si los operandos son de tipos diferentes, el resultado siempre es <code>false</code>, entonces <code>5 !== '5'</code>.</p>
+
+<p>Utilice operadores de igualdad estrictos si los operandos deben ser de un tipo específico así como de valor o si el tipo exacto de los operandos es importante. De lo contrario, utilice los operadores de igualdad estándar, que le permiten comparar la identidad de dos operandos, incluso si no son del mismo tipo.</p>
+
+<p>Cuando la conversión de tipo está involucrada en la comparación (es decir, comparación no estricta), JavaScript convierte los tipos {{jsxref("String")}}, {{jsxref("Number")}}, {{jsxref("Boolean")}} o {{jsxref("Object")}} operandos de la siguiente manera:</p>
+
+<ul>
+ <li>Al comparar un número y una cadena, la cadena se convierte en un valor numérico. JavaScript intenta convertir el literal numérico de cadena a un valor de tipo <code>Number</code>. Primero, un valor matemático se deriva del literal numérico de cadena. A continuación, este valor se redondea al valor de tipo <code>Number</code> más cercano.</li>
+ <li>Si uno de los operandos es <code>Boolean</code>, el operando <code>Boolean</code> se convierte en 1 si es <code>true</code> y +0 si es <code>false</code>.</li>
+ <li>Si un objeto se compara con un número o cadena, JavaScript intenta devolver el valor predeterminado para el objeto. Los operadores intentan convertir el objeto a un valor primitivo, un valor <code>String</code> o <code>Number</code>, utilizando los métodos <code>valueOf</code> y <code>toString</code> de los objetos. Si falla este intento de convertir el objeto, se genera un error de tiempo de ejecución.</li>
+ <li>Tenga en cuenta que un objeto se convierte en una primitiva si, y solo si, su comparando es una primitiva. Si ambos operandos son objetos, se comparan como objetos, y la prueba de igualdad es verdadera solo si ambos refieren el mismo objeto.</li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> Los objetos de cadena son Tipo Objeto, no String! Los objetos de cadena rara vez se utilizan, por lo que los siguientes resultados pueden ser sorprendentes:</div>
+
+<pre class="brush:js notranslate">// true, ya que ambos operandos son de tipo String (es decir, primitivas de cadena):
+'foo' === 'foo'
+
+var a = new String('foo');
+var b = new String('foo');
+
+// false como a y b son tipo Objeto y referencia a diferentes objetos
+a == b
+
+// false como a y b son tipo Objeto y referencia a diferentes objetos
+a === b
+
+// true como a y 'foo' son de tipo diferente y, el Objeto (a)
+// se convierte en cadena 'foo' antes de la comparación
+a == 'foo'</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>
+    <p>Agrega <code>===</code> y <code>!==</code> operadores. Implementado en JavaScript 1.3</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.8')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>
+    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.8">Operadores Relacionales</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9">Operadores de Igualdad</a></p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-relational-operators')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>
+    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-relational-operators">Operadores Relacionales</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-equality-operators">Operadores de Igualdad</a></p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-relational-operators')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>
+    <p>Definido en varias secciones de la especificación: <a href="http://tc39.github.io/ecma262/#sec-relational-operators">Operadores Relacionales</a>, <a href="http://tc39.github.io/ecma262/#sec-equality-operators">Operadores de Igualdad</a></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.comparison")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.is()")}}</li>
+ <li>{{jsxref("Math.sign()")}}</li>
+ <li><a href="/es/docs/Web/JavaScript/Equality_comparisons_and_sameness">Comparaciones de igualdad y uniformidad</a></li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/operators_5c44e7d07c463ff1a5a63654f4bda87b/index.html b/files/es/conflicting/web/javascript/reference/operators_5c44e7d07c463ff1a5a63654f4bda87b/index.html
new file mode 100644
index 0000000000..7d80f90f12
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/operators_5c44e7d07c463ff1a5a63654f4bda87b/index.html
@@ -0,0 +1,724 @@
+---
+title: Operadores a nivel de bit
+slug: >-
+  conflicting/Web/JavaScript/Reference/Operators_5c44e7d07c463ff1a5a63654f4bda87b
+tags:
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators
+translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators
+original_slug: Web/JavaScript/Referencia/Operadores/Bitwise_Operators
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p><strong>Los operadores a nivel de bit </strong>tratan sus operandos como una secuencia de 32 bits (unos y ceros) en lugar de <a href="/es/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">números</a> decimales, hexadecimales u octales.  Por ejemplo, el número decimal nueve tiene una representación binaria de 1001. Los operadores a nivel de bit realizan las operaciones en esas representaciones binarias, pero los valores devueltos son los valores numéricos estándar de JavaScript.</p>
+
+<p>La siguiente tabla resume los operadores a nivel de bit de JavaScript:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Operador</th>
+   <th>Uso</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_AND">AND binario</a></td>
+   <td><code>a &amp; b</code></td>
+   <td>Devuelve un uno en cada posición en la que ambos operandos sea uno.</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_OR">OR binario </a></td>
+   <td><code>a | b</code></td>
+   <td>Devuelve un uno en cada posición en la que uno o ambos operandos sea uno.</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_XOR">Bitwise XOR</a></td>
+   <td><code>a ^ b</code></td>
+   <td>Devuelve un uno en cada posición en la que los bits correspondientes en cada uno de los operandos, pero no en ambos, es uno. </td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_NOT">Bitwise NOT</a></td>
+   <td><code>~ a</code></td>
+   <td>Invierte los bits del operando.</td>
+  </tr>
+  <tr>
+   <td><a href="#Left_shift">Left shift</a></td>
+   <td><code>a &lt;&lt; b</code></td>
+   <td>Desplaza en representación binaria <code>b</code> (&lt; 32) bits a la izquierda, desplazando en ceros desde la derecha.</td>
+  </tr>
+  <tr>
+   <td><a href="#Right_shift">Sign-propagating right shift</a></td>
+   <td><code>a &gt;&gt; b</code></td>
+   <td>Desplaza en representación binaria <code>b</code> (&lt; 32) bits a la derecha, descartando los bits desplazados fuera.</td>
+  </tr>
+  <tr>
+   <td><a href="#Unsigned_right_shift">Zero-fill right shift</a></td>
+   <td><code>a &gt;&gt;&gt; b</code></td>
+   <td>Desplaza en representación binaria <code>b</code> (&lt; 32) bits a la derecha, desplazando en ceros desde la izquierda.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Enteros_con_signo_de_32_bits">Enteros con signo de 32 bits</h2>
+
+<p>Los operandos de todas las operaciones bitwise son convertidos a enteros con signo de 32 bits en complemento a dos. Complemento a dos significa que el equivalente negativo de un número (por ejemplo, 5 y -5) es igual a todos los bits del número invertido (un NOT del número, también conocido como el compelemento a uno del número) más uno. Por ejemplo, a continuación se codifica el entero 314:</p>
+
+<pre>00000000000000000000000100111010
+</pre>
+
+<p>A continuación se codifica <code>~314</code> como complemento a uno de 314:</p>
+
+<pre>11111111111111111111111011000101
+</pre>
+
+<p>Por último, se codifica <code>-314 como complemento a dos de </code><code>314</code>:</p>
+
+<pre>11111111111111111111111011000110
+</pre>
+
+<p>El complemento a dos garantiza que el bit más a la izquierda es 0 cuando el número es positivo, y 1 cuando el número es negativo. Por esto es llamado <em>bit de signo.</em></p>
+
+<p>El número 0 es el entero compuesto íntegramente por bits en 0.</p>
+
+<pre>0 (base 10) = 00000000000000000000000000000000 (base 2)
+
+</pre>
+
+<p>El número -1 es el entero compuesto íntegramente por bits de 1.</p>
+
+<pre>-1 (base 10) = 11111111111111111111111111111111 (base 2)
+</pre>
+
+<p>El número <code>-2147483648</code> (representación hexadecimal: <code>-0x80000000</code>) es el entero compuesto íntegramente por bits de 0 excepto el de más a la izquierda.</p>
+
+<pre>-2147483648 (base 10) = 10000000000000000000000000000000 (base 2)
+</pre>
+
+<p>El número <code>2147483647</code> (representación hexadecimal: <code>0x7fffffff</code>) es el entero compuesto íntegramente por bits de 1 excepto el de más a la izquierda. </p>
+
+<pre>2147483647 (base 10) = 01111111111111111111111111111111 (base 2)
+</pre>
+
+<p>Los números <code>-2147483648</code> and <code>2147483647</code> son el mínimo y el máximo entero que se pueden representar con signo de 32 bits.</p>
+
+<h2 id="Operadores_lógicos_a_nivel_de_bit">Operadores lógicos<strong> a nivel de bit</strong></h2>
+
+<p>Conceptualmente, los operadores lógicos bit a bit funcionan de la siguiente manera:</p>
+
+<ul>
+ <li>Los operandos son convertidos en enteros de 32 bits y representados por series de bits (ceros y unos). Los numeros con más de 32 bits se convierten para que sus bits más significativos sean descartados. Por ejemplo, el siguiente entero con más de 32 bits se convierte a un entero de 32 bits.</li>
+ <li>
+  <pre><code>Antes:     1100110111110100000000000000110000000000001
+Después:              10100000000000000110000000000001</code></pre>
+ </li>
+ <li>Cada bit del primer operando es emparejado con su bit correspondiente en el segundo operando: el primero con el primero, el segundo con el segundo, y así.</li>
+ <li>El operador se aplica a cada pareja de bits, y el resultado se construye bit a bit. </li>
+</ul>
+
+<h3 id="(Bitwise_AND_o_AND_a_nivel_de_bits)"><a name="Bitwise_AND">&amp; (Bitwise AND o AND a nivel de bits)</a></h3>
+
+<p>Corresponde al operador lógico &amp; o "Y". Ejecuta la operación AND en cada par de bits, <code>a</code> AND <code>b</code> es 1 sólo si tanto a como b son 1. La tabla de verdad del operador AND es:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">a</td>
+   <td class="header">b</td>
+   <td class="header">a AND b</td>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>0</td>
+   <td>0</td>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>1</td>
+   <td>0</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>0</td>
+   <td>0</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>1</td>
+   <td>1</td>
+  </tr>
+ </tbody>
+</table>
+
+<pre>     9 (base 10) = 00000000000000000000000000001001 (base 2)
+    14 (base 10) = 00000000000000000000000000001110 (base 2)
+                   --------------------------------
+14 &amp; 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10)
+</pre>
+
+<p>El resultado de hacer un AND de cualquier número x con 0 es 0, mientras que el de hacer un AND de cualquier número x con -1 da como resultado x. </p>
+
+<h3 id="(Bitwise_OR_o_OR_a_nivel_de_bits)"><a name="Bitwise_OR">| (Bitwise OR o  OR a nivel de bits)</a></h3>
+
+<p>Realiza la operación OR en cada par de bits. a OR b devuelve 1 si a o b son 1. La tabla de verdad para la operación OR es la siguiente:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">a</td>
+   <td class="header">b</td>
+   <td class="header">a OR b</td>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>0</td>
+   <td>0</td>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>1</td>
+   <td>1</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>0</td>
+   <td>1</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>1</td>
+   <td>1</td>
+  </tr>
+ </tbody>
+</table>
+
+<pre>     9 (base 10) = 00000000000000000000000000001001 (base 2)
+    14 (base 10) = 00000000000000000000000000001110 (base 2)
+                   --------------------------------
+14 | 9 (base 10) = 00000000000000000000000000001111 (base 2) = 15 (base 10)
+</pre>
+
+<p>Ejecutar la operación OR sobre cualquier número x y 0 devuelve x. Ejecutar OR sobre cualquier número X y -1 devuelve -1.</p>
+
+<h3 id="(Bitwise_XOR_o_XOR_a_nivel_de_bits)"><a name="Bitwise_XOR">^ (Bitwise XOR o XOR a nivel de bits)</a></h3>
+
+<p>Realiza la operación XOR en cada par de bits. a OR b devuelve 1 si a o b son diferentes. La tabla de verdad para la operación OR es la siguiente:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">a</td>
+   <td class="header">b</td>
+   <td class="header">a XOR b</td>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>0</td>
+   <td>0</td>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>1</td>
+   <td>1</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>0</td>
+   <td>1</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>1</td>
+   <td>0</td>
+  </tr>
+ </tbody>
+</table>
+
+<pre>     9 (base 10) = 00000000000000000000000000001001 (base 2)
+    14 (base 10) = 00000000000000000000000000001110 (base 2)
+                   --------------------------------
+14 ^ 9 (base 10) = 00000000000000000000000000000111 (base 2) = 7 (base 10)
+</pre>
+
+<p>Ejecutar la operación XOR sobre cualquier número x y 0 devuelve x. Ejecutar la operación XOR sobre cualquier número x y -1 devuelve ~x</p>
+
+<h3 id="(Bitwise_NOT_o_Negación_a_nivel_de_bits)"><a name="Bitwise_NOT">~ (Bitwise NOT o Negación a nivel de bits)</a></h3>
+
+<p>Realiza la operación NOT a cada bit. NOT devuelve el valor invertido ( conocido como complementario). La tabla de verdad para la operación NOT es la siguiente:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">a</td>
+   <td class="header">NOT a</td>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>1</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>0</td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<pre> 9 (base 10) = 00000000000000000000000000001001 (base 2)
+               --------------------------------
+~9 (base 10) = 11111111111111111111111111110110 (base 2) = -10 (base 10)
+</pre>
+
+<p> </p>
+
+<p>Ejecutar la operación NOT sobre cualquier número x devuelve -(x+1). Por ejemplo -5 devuelve 4.</p>
+
+<p>Ejemplo con indexOf:</p>
+
+<pre class="brush: js">var str = 'rawr';
+var searchFor = 'a';
+
+// esta es un forma alternativa de escribir (-1*str.indexOf('a') &lt;= 0)
+if (~str.indexOf(searchFor)) {
+  // searchFor esta en el string
+} else {
+  // searchFor no esta en el string
+}
+
+// aquí verás los valores que retorna (~str.indexOf(searchFor))
+// r == -1
+// a == -2
+// w == -3
+</pre>
+
+<h2 id="Operadores_de_desplazamiento_a_nivel_de_bit">Operadores de desplazamiento <strong>a nivel de bit</strong></h2>
+
+<p>Los operadores de desplazamiento toman dos operandos: el primero es la cantidad a ser desplazados, y el segundo especifica el número de posiciones bits que el primer operando debe ser desplazado. El sentido del operador de desplazamiento es determinado por el operador utilizado.</p>
+
+<p>Shift operators u operadores de desplazamiento, convierten sus operandos a enteros de 32-bit en orden big-endian y retorna el resultado del mismo tipo que el operando izquierdo. El operador derecho debe ser menor que 32, de lo contrario solo se usaran los ultimos cinco bits mas bajos.</p>
+
+<h3 id="&lt;&lt;_(Desplazamiento_a_la_izquierda)"><a name="Left_shift">&lt;&lt; (Desplazamiento a la izquierda)</a></h3>
+
+<p>Este operador desplaza el primer operando el número especificado de bits a la izquierda. Los bits en exceso desplazados hacia la izquierda se descartan. Los bits cero se desplazan desde la derecha.</p>
+
+<p>Por ejemplo, 9 &lt;&lt; 2 devuelve 36:</p>
+
+<pre>     9 (base 10): 00000000000000000000000000001001 (base 2)
+                  --------------------------------
+9 &lt;&lt; 2 (base 10): 00000000000000000000000000100100 (base 2) = 36 (base 10)
+</pre>
+
+<p>Desplazar a la izquierda cualquier número <strong>x</strong> por <strong>y</strong> bits da por resultado <strong>x * 2^y</strong>.</p>
+
+<h3 id=">>_(Desplazamiento_a_la_derecha_con_propagación_de_signo_o_Desplazamiento_aritmético_a_la_derecha)"><a name="Right_shift">&gt;&gt; (Desplazamiento a la derecha con propagación de signo o </a><a name="Unsigned_right_shift">Desplazamiento aritmético a la derecha</a><a name="Right_shift">)</a></h3>
+
+<p>Este operador desplaza el primer operando la cantidad de bits especificada a la derecha. Los bits en exceso desplazados a la derecha se descartan. Las copias del bit del extremo izquierdo se desplazan desde la izquierda. Como el nuevo bit más a la izquierda tiene el mismo valor que el bit anterior más a la izquierda, el bit de signo (el bit más a la izquierda) no cambia. De ahí el nombre "propagación de signo".</p>
+
+<p>Por ejemplo, <code>9 &gt;&gt; 2</code> devuelve 2:</p>
+
+<pre>     9 (base 10): 00000000000000000000000000001001 (base 2)
+                  --------------------------------
+9 &gt;&gt; 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
+</pre>
+
+<p>Igualmente, <code>-9 &gt;&gt; 2</code> devuelve-3, porque se mantiene el signo:</p>
+
+<pre>     -9 (base 10): 11111111111111111111111111110111 (base 2)
+                   --------------------------------
+-9 &gt;&gt; 2 (base 10): 11111111111111111111111111111101 (base 2) = -3 (base 10)
+</pre>
+
+<h3 id=">>>_(Desplazamiento_a_la_derecha_con_relleno_de_ceros_o_Desplazamiento_lógico_)"><a name="Unsigned_right_shift">&gt;&gt;&gt; (Desplazamiento a la derecha con relleno de ceros o Desplazamiento lógico )</a></h3>
+
+<p>Este operador desplaza el primer operando la cantidad de bits especificada a la derecha. Los bits en exceso desplazados a la derecha se descartan. Ceros son despalzadas o introducidos desde la izquierda. El bit de signo aútomaticamente se convierte 0, así que el resultado siempre es pósitivo. </p>
+
+<p><br>
+ Para números no negativos, el desplazamiento lógico y arítmetico dan el mismo resultado. Por ejemplo, <code>9 &gt;&gt;&gt; 2</code> da 2, al igual que <code>9 &gt;&gt; 2</code>:</p>
+
+<pre>      9 (base 10): 00000000000000000000000000001001 (base 2)
+                   --------------------------------
+9 &gt;&gt;&gt; 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
+</pre>
+
+<p>Sin embargo, no es el caso para números negativos. Por ejemplo, <code>-9 &gt;&gt;&gt; 2</code> da 1073741821, que es diferente de  <code>-9 &gt;&gt; 2</code> (que da -3):</p>
+
+<pre>      -9 (base 10): 11111111111111111111111111110111 (base 2)
+                    --------------------------------
+-9 &gt;&gt;&gt; 2 (base 10): 00111111111111111111111111111101 (base 2) = 1073741821 (base 10)
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Banderas_y_máscaras_de_bits">Banderas y máscaras de bits</h3>
+
+<p>Los operadores lógicos a nivel de bits se utilizan a menudo para crear, manipular y leer secuencias de indicadores, que son como variables binarias. Se podrían usar variables en lugar de estas secuencias, pero las banderas binarias toman mucho menos memoria (por un factor de 32).</p>
+
+<p>Supongamos que hay 4 banderas:</p>
+
+<ul>
+ <li>bandera A: tenemos un problema de hormigas</li>
+ <li>bandera B: somos dueños de un murciélago</li>
+ <li>bandera C: somos dueños de un gato</li>
+ <li>bandera D: somos dueños de un pato</li>
+</ul>
+
+<p>Estas banderas están representadas por una secuencia de bits: DCBA. Cuando se establece un indicador, tiene un valor de 1. Cuando se elimina un indicador, tiene un valor de 0. Suponga que los indicadores de una variable tienen el valor binario 0101:</p>
+
+<pre class="brush: js">var flags = 5;   // binary 0101
+</pre>
+
+<p>Este valor indica:</p>
+
+<ul>
+ <li>la bandera A es verdadera (tenemos un problema de hormigas);</li>
+ <li>la bandera B es falsa (no tenemos un murciélago);</li>
+ <li>la bandera C es verdadera (somos dueños de un gato);</li>
+ <li>la bandera D es falsa (no tenemos pato);</li>
+</ul>
+
+<p>Dado que los operadores bitwise son de 32 bits, 0101 es en realidad 0000000000000000000000000000000101, pero los ceros anteriores pueden ignorarse ya que no contienen información significativa.</p>
+
+<p>Una máscara de bits es una secuencia de bits que puede manipular y / o leer banderas. Normalmente, se define una máscara de bits "primitiva" para cada bandera:</p>
+
+<pre class="brush: js">var FLAG_A = 1; // 0001
+var FLAG_B = 2; // 0010
+var FLAG_C = 4; // 0100
+var FLAG_D = 8; // 1000
+</pre>
+
+<p>Se pueden crear nuevas máscaras de bits utilizando los operadores lógicos a nivel de bits en estas máscaras de bits primitivas. Por ejemplo, la máscara de bits 1011 se puede crear mediante ORing FLAG_A, FLAG_B y FLAG_D:</p>
+
+<pre class="brush: js">var mask = FLAG_A | FLAG_B | FLAG_D; // 0001 | 0010 | 1000 =&gt; 1011
+</pre>
+
+<p>Los valores de los indicadores individuales se pueden extraer mediante AND con una máscara de bits, donde cada bit con el valor de uno "extraerá" el indicador correspondiente. La máscara de bits enmascara las marcas no relevantes mediante AND con ceros (de ahí el término "bitmask"). Por ejemplo, la máscara de bits 0101 se puede usar para ver si el indicador C está establecido:</p>
+
+<pre class="brush: js">// if we own a cat
+if (flags &amp; FLAG_C) { // 0101 &amp; 0100 =&gt; 0100 =&gt; true
+   // do stuff
+}
+</pre>
+
+<p>Una máscara de bits con varios indicadores establecidos actúa como un "either/or". Por ejemplo, los siguientes dos son equivalentes:</p>
+
+<pre class="brush: js">// if we own a bat or we own a cat
+// (0101 &amp; 0010) || (0101 &amp; 0100) =&gt; 0000 || 0100 =&gt; true
+if ((flags &amp; FLAG_B) || (flags &amp; FLAG_C)) {
+   // do stuff
+}
+</pre>
+
+<pre class="brush: js">// if we own a bat or cat
+var mask = FLAG_B | FLAG_C; // 0010 | 0100 =&gt; 0110
+if (flags &amp; mask) { // 0101 &amp; 0110 =&gt; 0100 =&gt; true
+   // do stuff
+}
+</pre>
+
+<p>Los indicadores se pueden establecer mediante ORing con una máscara de bits, donde cada bit con el valor uno establecerá el indicador correspondiente, si ese indicador no está ya establecido. Por ejemplo, la máscara de bits 1100 se puede utilizar para establecer los indicadores C y D:</p>
+
+<pre class="brush: js">// yes, we own a cat and a duck
+var mask = FLAG_C | FLAG_D; // 0100 | 1000 =&gt; 1100
+flags |= mask;   // 0101 | 1100 =&gt; 1101
+</pre>
+
+<p>Los indicadores se pueden borrar ANDing con una máscara de bits, donde cada bit con el valor cero borrará el indicador correspondiente, si aún no se ha borrado. Esta máscara de bits se puede crear NOTing las máscaras de bits primitivas. Por ejemplo, la máscara de bits 1010 se puede utilizar para borrar los indicadores A y C:</p>
+
+<pre class="brush: js">// no, we don't have an ant problem or own a cat
+var mask = ~(FLAG_A | FLAG_C); // ~0101 =&gt; 1010
+flags &amp;= mask;   // 1101 &amp; 1010 =&gt; 1000
+</pre>
+
+<p>La máscara también podría haberse creado con ~ FLAG_A &amp; ~ FLAG_C (ley de De Morgan):</p>
+
+<pre class="brush: js">// no, we don't have an ant problem, and we don't own a cat
+var mask = ~FLAG_A &amp; ~FLAG_C;
+flags &amp;= mask;   // 1101 &amp; 1010 =&gt; 1000
+</pre>
+
+<p>Los indicadores se pueden alternar mediante XORing con una máscara de bits, donde cada bit con el valor uno cambiará el indicador correspondiente. Por ejemplo, la máscara de bits 0110 se puede utilizar para alternar los indicadores B y C:</p>
+
+<pre class="brush: js">// if we didn't have a bat, we have one now,
+// and if we did have one, bye-bye bat
+// same thing for cats
+var mask = FLAG_B | FLAG_C;
+flags = flags ^ mask;   // 1100 ^ 0110 =&gt; 1010
+</pre>
+
+<p>Finalmente, todas las banderas se pueden voltear con el operador NOT:</p>
+
+<pre class="brush: js">// entering parallel universe...
+flags = ~flags;    // ~1010 =&gt; 0101
+</pre>
+
+<h3 id="Fragmentos_de_conversión">Fragmentos de conversión</h3>
+
+<p>Convert a binary <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/JavaScript/Reference/Global_Objects/String">String</a></code> to a decimal <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number">Number</a></code>:</p>
+
+<pre class="brush: js">var sBinString = "1011";
+var nMyNumber = parseInt(sBinString, 2);
+alert(nMyNumber); // prints 11, i.e. 1011
+</pre>
+
+<p> </p>
+
+<p>Convierte una cadena binaria a un número decimal:</p>
+
+<p> </p>
+
+<pre class="brush: js">var nMyNumber = 11;
+var sBinString = nMyNumber.toString(2);
+alert(sBinString); // prints 1011, i.e. 11
+</pre>
+
+<h3 id="Automatiza_la_creación_de_una_máscara.">Automatiza la creación de una máscara.</h3>
+
+<p>Si tiene que crear muchas máscaras a partir de algunos valores booleanos, puede automatizar el proceso:</p>
+
+<pre class="brush: js">function createMask () {
+  var nMask = 0, nFlag = 0, nLen = arguments.length &gt; 32 ? 32 : arguments.length;
+  for (nFlag; nFlag &lt; nLen; nMask |= arguments[nFlag] &lt;&lt; nFlag++);
+  return nMask;
+}
+var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011
+var mask2 = createMask(false, false, true); // 4, i.e.: 0100
+var mask3 = createMask(true); // 1, i.e.: 0001
+// etc.
+
+alert(mask1); // prints 11, i.e.: 1011
+</pre>
+
+<h3 id="Algoritmo_inverso_una_matriz_de_valores_booleanos_de_una_máscara">Algoritmo inverso: una matriz de valores booleanos de una máscara</h3>
+
+<p>Si desea crear una matriz de valores booleanos a partir de una máscara, puede usar este código:</p>
+
+<pre class="brush: js">function arrayFromMask (nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  if (nMask &gt; 0x7fffffff || nMask &lt; -0x80000000) {
+    throw new TypeError("arrayFromMask - out of range");
+  }
+  for (var nShifted = nMask, aFromMask = []; nShifted;
+       aFromMask.push(Boolean(nShifted &amp; 1)), nShifted &gt;&gt;&gt;= 1);
+  return aFromMask;
+}
+
+var array1 = arrayFromMask(11);
+var array2 = arrayFromMask(4);
+var array3 = arrayFromMask(1);
+
+alert("[" + array1.join(", ") + "]");
+// prints "[true, true, false, true]", i.e.: 11, i.e.: 1011
+</pre>
+
+<p>Puedes probar ambos algoritmos al mismo tiempo ...</p>
+
+<pre class="brush: js">var nTest = 19; // our custom mask
+var nResult = createMask.apply(this, arrayFromMask(nTest));
+
+alert(nResult); // 19
+</pre>
+
+<p>Solo para fines didácticos (ya que existe el método Number.toString (2)), mostramos cómo es posible modificar el algoritmo arrayFromMask para crear una cadena que contenga la representación binaria de un número, en lugar de una matriz de booleanos:</p>
+
+<pre class="brush: js">function createBinaryString (nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  for (var nFlag = 0, nShifted = nMask, sMask = ""; nFlag &lt; 32;
+       nFlag++, sMask += String(nShifted &gt;&gt;&gt; 31), nShifted &lt;&lt;= 1);
+  return sMask;
+}
+
+var string1 = createBinaryString(11);
+var string2 = createBinaryString(4);
+var string3 = createBinaryString(1);
+
+alert(string1);
+// prints 00000000000000000000000000001011, i.e. 11
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definicion inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.7')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definido en varias secciones de la especificación: operador NOT a nivel de bit, operadores de cambio a nivel de bit, operadores a nivel de bit binarios</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-bitwise-shift-operators')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definido en varias secciones de la especificación: operador NOT a nivel de bit, operadores de cambio a nivel de bit, operadores a nivel de bit binarios</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_NOT">Bitwise NOT (<code>~</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_AND">Bitwise AND (<code>&amp;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_OR">Bitwise OR (<code>|</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_XOR">Bitwise XOR (<code>^</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Left_shift">Left shift (<code>&lt;&lt;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Right_shift">Right shift (<code>&gt;&gt;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Unsigned_right_shift">Unsigned right shift (<code>&gt;&gt;&gt;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_NOT">Bitwise NOT (<code>~</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_AND">Bitwise AND (<code>&amp;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_OR">Bitwise OR (<code>|</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_XOR">Bitwise XOR (<code>^</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Left_shift">Left shift (<code>&lt;&lt;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Right_shift">Right shift (<code>&gt;&gt;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><a href="#Unsigned_right_shift">Unsigned right shift (<code>&gt;&gt;&gt;</code>)</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators">Operadores logicos</a></li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/operators_d3958587a3d3dd644852ad397eb5951b/index.html b/files/es/conflicting/web/javascript/reference/operators_d3958587a3d3dd644852ad397eb5951b/index.html
new file mode 100644
index 0000000000..90a97a1033
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/operators_d3958587a3d3dd644852ad397eb5951b/index.html
@@ -0,0 +1,464 @@
+---
+title: Operadores de asignación
+slug: >-
+  conflicting/Web/JavaScript/Reference/Operators_d3958587a3d3dd644852ad397eb5951b
+tags:
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators#Assignment_operators
+translation_of_original: Web/JavaScript/Reference/Operators/Assignment_Operators
+original_slug: Web/JavaScript/Referencia/Operadores/Assignment_Operators
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>Un <strong>operador de asignacion</strong> asigna un valor al operando de la izquierda basado en el valor del operando de la derecha.</p>
+
+<h2 id="Visión_general"><span class="short_text" id="result_box" lang="es"><span>Visión general</span></span></h2>
+
+<p>El operador de asignación basico es el igual (<code>=</code>), el cual asigna el valor del operando derecho al operando izquierdo. Es decir, x = y asigna el valor de y a x. El otro operador de asignacion son usualmente son abreviaciones para operaciones estandar, como se muestra en las siguientes definiciones y ejemplos.</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Nombres</th>
+   <th>Abreviaciones</th>
+   <th>Significado</th>
+  </tr>
+  <tr>
+   <td><a href="#Assignment">Asignación</a></td>
+   <td><code>x = y</code></td>
+   <td><code>x = y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Addition_assignment">Asignación de adición</a></td>
+   <td><code>x += y</code></td>
+   <td><code>x = x + y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Subtraction_assignment">Asignación de sustracción</a></td>
+   <td><code>x -= y</code></td>
+   <td><code>x = x - y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Subtraction_assignment">Asignación de multiplicación</a></td>
+   <td><code>x *= y</code></td>
+   <td><code>x = x * y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Subtraction_assignment">Asignación de división</a></td>
+   <td><code>x /= y</code></td>
+   <td><code>x = x / y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Remainder_assignment">Asignación de Resto</a></td>
+   <td><code>x %= y</code></td>
+   <td><code>x = x % y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Exponentiation_assignment">Asignación de exponenciación</a></td>
+   <td><code>x **= y</code></td>
+   <td><code>x = x ** y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Left_shift_assignment">Asignación de desplazamiento a la izquierda</a></td>
+   <td><code>x &lt;&lt;= y</code></td>
+   <td><code>x = x &lt;&lt; y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Left_shift_assignment">Asignación de desplazamiento a la derecha</a></td>
+   <td><code>x &gt;&gt;= y</code></td>
+   <td><code>x = x &gt;&gt; y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Unsigned_right_shift_assignment">Asignación sin signo de desplazamiento a la derecha</a></td>
+   <td><code>x &gt;&gt;&gt;= y</code></td>
+   <td><code>x = x &gt;&gt;&gt; y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_AND_assignment">Asignacion AND</a></td>
+   <td><code>x &amp;= y</code></td>
+   <td><code>x = x &amp; y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_XOR_assignment">Asignacion XOR</a></td>
+   <td><code>x ^= y</code></td>
+   <td><code>x = x ^ y</code></td>
+  </tr>
+  <tr>
+   <td><a href="#Bitwise_XOR_assignment">Asignacion OR</a></td>
+   <td><code>x |= y</code></td>
+   <td><code>x = x | y</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Asignación"><a name="Assignment">Asignación</a></h2>
+
+<p>Operador de asignación simple que asigna un valor a una variable. EL operador de asignación evalua al valor asignado. Encadenando el operador de asignación es posible en orden de asignar un solo valor a multiples variables. Vea el ejemplo.</p>
+
+<h3 id="Sintaxis">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x = y
+</pre>
+
+<h3 id="Ejemplos">Ejemplos</h3>
+
+<pre class="brush: js notranslate">// Asumiendo las siguientes variables
+//  x = 5
+//  y = 10
+//  z = 25
+
+
+x = y     // x es 10
+x = y = z // x, y, z son todas 25
+</pre>
+
+<h2 id="Asignación_de_Adición"><a name="Addition_assignment">Asignación de Adición</a></h2>
+
+<p>El operador de asignación de suma <strong>agrega</strong> el valor del operando derecho a la variable y le asigna el resultado a la variable. Los dos tipos de operandos determinan el comportamiento del operador de asignación de adición. Adición o concatenación es posible. Mira el {{jsxref("Operators/Arithmetic_Operators", "operador de adición", "#Addition", 1)}} para más detalles.</p>
+
+<h3 id="Sintaxis_2">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x += y
+<strong>Significado:</strong>  x  = x + y
+</pre>
+
+<h3 id="Ejemplos_2">Ejemplos</h3>
+
+<pre class="brush: js notranslate">// Asuma las siguientes variables
+//  foo = "foo"
+//  bar = 5
+//  baz = true
+
+
+// Number + Number -&gt; Adición
+bar += 2 // 7
+
+// Boolean + Number -&gt; Adición
+baz += 1 // 2
+
+// Boolean + Boolean -&gt; Adición
+baz += false // 1
+
+// Number + String -&gt; concatenación
+bar += "foo" // "5foo"
+
+// String + Boolean -&gt; concatenación
+foo += false // "foofalse"
+
+// String + String -&gt; concatenación
+foo += "bar" // "foobar"
+</pre>
+
+<h2 id="Asignación_de_Sustracción"><a name="Subtraction_assignment">Asignación de Sustracción</a></h2>
+
+<p>El operador de asignación de sustracción <strong>sustrae </strong>el valor del operador derecho desde la variable y asigna el resultado a la variable. Mira el {{jsxref("Operators/Arithmetic_Operators", "operador de sustracción", "#Subtraction", 1)}} para mas detalles.</p>
+
+
+
+<h4 id="Sintaxis_3">Sintaxis</h4>
+
+
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x -= y
+<strong>Significado:</strong>  x  = x - y
+</pre>
+
+<h4 id="Ejemplos_3">Ejemplos</h4>
+
+<pre class="brush: js notranslate">// Asumiendo las siguientes variables
+//  bar = 5
+
+bar -= 2     // 3
+bar -= "foo" // NaN
+</pre>
+
+<h2 id="Asignación_de_Multiplicación">Asignación de Multiplicación </h2>
+
+<p>El operador de asignación de multiplicación <strong>multiplica </strong>la variable por el valor del operando derecho y asigna el resultado a la variable. Vea el  {{jsxref("Operators/Arithmetic_Operators", "Operador de Multiplicación", "#Multiplication", 1)}} para mas detalles.</p>
+
+<h3 id="Sintaxis_4">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x *= y
+<strong>Significado:</strong>  x  = x * y
+</pre>
+
+<h3 id="Ejemplos_4">Ejemplos</h3>
+
+<pre class="brush: js notranslate">// Asumiendo la siguiente variable
+//  bar = 5
+
+bar *= 2     // 10
+bar *= "foo" // NaN
+</pre>
+
+<h2 id="Asignación_de_división"><a name="Division_assignment">Asignación de división</a></h2>
+
+<p>El operador de asignación de división <strong>divide </strong>la variable por el valor del operando derecho y asigna el resultado a la variable. Vea el {{jsxref("Operators/Arithmetic_Operators", "operador de división", "#Division", 1)}} para mas detalles.</p>
+
+<h3 id="Sintaxis_5">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x /= y
+<strong>Significado:</strong>  x  = x / y
+</pre>
+
+<h3 id="Ejemplos_5">Ejemplos</h3>
+
+<pre class="brush: js notranslate">// Asumiendo la siguiente variable
+//  bar = 5
+
+bar /= 2     // 2.5
+bar /= "foo" // NaN
+bar /= 0     // Infinity
+</pre>
+
+<h2 id="Asignación_de_resto"><a name="Remainder_assignment">Asignación  de resto</a></h2>
+
+<p>El operador de asignación de resto <strong>divide </strong>la variable por el valor del operador derecho y asigna el <strong>resto </strong>a la variable. Vea el {{jsxref("Operators/Arithmetic_Operators", "Operador de resto", "#Remainder", 1)}} para mas detelles.</p>
+
+<h3 id="Sintaxis_6">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x %= y
+<strong>Significado:</strong>  x  = x % y
+</pre>
+
+<h3 id="Ejemplos_6">Ejemplos</h3>
+
+<pre class="brush: js notranslate">// Asumiendo la siguiente variable
+//  bar = 5
+
+bar %= 2     // 1
+bar %= "foo" // NaN
+bar %= 0     // NaN
+</pre>
+
+<h2 id="Asignación_de_exponenciación"><a id="Exponentiation_assignment" name="Exponentiation_assignment"></a>Asignación de <span id="result_box" lang="es"><span>exponenciación</span></span></h2>
+
+<p>El operador de asignación de exponente evalua el resultado de elevar primero el operando a la <strong>potencia </strong>del segundo operando. Vea el {{jsxref("Operators/Bitwise_Operators", "operador de exponenciación", "#Left_shift", 1)}}para mas detalles</p>
+
+<h3 id="Sintaxis_7">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x **= y
+<strong>Significado:</strong>  x  = x ** y
+</pre>
+
+<h3 id="Ejemplos_7">Ejemplos</h3>
+
+<pre class="brush: js notranslate">// Asumiendo la siguiente variable
+//  bar = 5
+
+bar **= 2     // 25
+bar **= "foo" // NaN</pre>
+
+<h2 id="Asignación_de_desplazamiento_a_la_izquierda"><a name="Left_shift_assignment">Asignación de desplazamiento a la izquierda</a></h2>
+
+<p>El operador de asignación de desplazamiento a la izquierda mueve una cantidad especifica de bits a la izquierda y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador de desplazamiento a la izquierda", "#Left_shift", 1)}} para mas detalles.</p>
+
+<h3 id="Sintaxis_8">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &lt;&lt;= y
+<strong>Significado:</strong>  x   = x &lt;&lt; y
+</pre>
+
+<h3 id="Ejemplos_8">Ejemplos</h3>
+
+<pre class="brush: js notranslate">var bar = 5; //  (00000000000000000000000000000101)
+bar &lt;&lt;= 2; // 20 (00000000000000000000000000010100)
+</pre>
+
+<h2 id="Asignación_de_desplazamiento_a_la_derecha"><a name="Right_shift_assignment">Asignación de desplazamiento a la derecha</a></h2>
+
+<p>El operador de asignación de desplazamiento a la derecha mueve una cantidad especifica de bits a la derecha y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador de desplazamiento a la derecha", "#Right_shift", 1)}} para mas detalles.</p>
+
+<h3 id="Sintaxis_9">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &gt;&gt;= y
+<strong>Significado:</strong>  x   = x &gt;&gt; y
+</pre>
+
+<h3 id="Ejemplos_9">Ejemplos</h3>
+
+<pre class="brush: js notranslate">var bar = 5; //   (00000000000000000000000000000101)
+bar &gt;&gt;= 2;   // 1 (00000000000000000000000000000001)
+
+var bar -5; //    (-00000000000000000000000000000101)
+bar &gt;&gt;= 2;  // -2 (-00000000000000000000000000000010)
+</pre>
+
+<h2 id="Asignación_sin_signo_de_desplazamiento_a_la_derecha"><a name="Unsigned_right_shift_assignment">Asignación sin signo de desplazamiento a la derecha</a></h2>
+
+<p>El operador de asignación sin signo de desplazamiento a la derecha mueve una cantidad especifica de bits a la derecha y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador sin signo de desplazamiento a la derecha", "#Unsigned_right_shift", 1)}} para mas detalles.</p>
+
+<h3 id="Sintaxis_10">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &gt;&gt;&gt;= y
+<strong>Significado:</strong>  x    = x &gt;&gt;&gt; y
+</pre>
+
+<h3 id="Ejemplo">Ejemplo</h3>
+
+<pre class="brush: js notranslate">var bar = 5; //   (00000000000000000000000000000101)
+bar &gt;&gt;&gt;= 2;  // 1 (00000000000000000000000000000001)
+
+var bar = -5; // (-00000000000000000000000000000101)
+bar &gt;&gt;&gt;= 2; // 1073741822 (00111111111111111111111111111110)</pre>
+
+<h2 id="Asignación_AND"><a name="Bitwise_AND_assignment">Asignación AND</a></h2>
+
+<p>El operador de asignacion AND usa la representación binaria de ambos operandos, hace una operacion AND en ellos y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador AND", "#Bitwise_AND", 1)}} para mas detalles.</p>
+
+<h3 id="Sintaxis_11">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &amp;= y
+<strong>Significado:</strong>  x  = x &amp; y
+</pre>
+
+<h3 id="Ejemplo_2">Ejemplo</h3>
+
+<pre class="brush: js notranslate">var bar = 5;
+// 5:     00000000000000000000000000000101
+// 2:     00000000000000000000000000000010
+bar &amp;= 2; // 0
+</pre>
+
+<h2 id="Asignación_XOR"><a name="Bitwise_XOR_assignment">Asignación XOR</a></h2>
+
+<p>El operador de asignacion XOR usa la representación binaria de ambos operandos, hace una operacion XOR en ellos y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador XOR", "#Bitwise_XOR", 1)}} para mas detalles</p>
+
+<h3 id="Sintaxis_12">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x ^= y
+<strong>Significado:</strong>  x  = x ^ y
+</pre>
+
+<h3 id="Ejemplo_3">Ejemplo</h3>
+
+<pre class="brush: js notranslate">var bar = 5;
+bar ^= 2; // 7
+// 5: 00000000000000000000000000000101
+// 2: 00000000000000000000000000000010
+// -----------------------------------
+// 7: 00000000000000000000000000000111
+</pre>
+
+<h2 id="Asignación_OR"><a name="Bitwise_OR_assignment">Asignación OR</a></h2>
+
+<p>El operador de asignacion OR usa la representación binaria de ambos operandos, hace una operacion OR en ellos y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador OR", "#Bitwise_XOR", 1)}} para mas detalles</p>
+
+<h3 id="Sintaxis_13">Sintaxis</h3>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x |= y
+<strong>Significado:</strong>  x  = x | y
+</pre>
+
+<h3 id="Ejemplo_4">Ejemplo</h3>
+
+<pre class="brush: js notranslate">var bar = 5;
+bar |= 2; // 7
+// 5: 00000000000000000000000000000101
+// 2: 00000000000000000000000000000010
+// -----------------------------------
+// 7: 00000000000000000000000000000111
+</pre>
+
+<h2 id="Ejemplos_10">Ejemplos</h2>
+
+<h3 id="Operador_izquierdo_con_otros_operadores_de_asignación">Operador izquierdo con otros operadores de asignación</h3>
+
+<p>En situaciones inusuales, el operador de asignacion (e.g x += y) no es identico al significado de la expresión (aca x = x + y). Cuando el operando izquierdo de un mismo operador de asignación contiene un operador de asignaciónm el operando izquierdo es evaluado una vez. por ejemplo:</p>
+
+<pre class="brush: js notranslate">a[i++] += 5         // i es evaluado una vez
+a[i++] = a[i++] + 5 // i es evaluado dos veces
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-assignment-operators', 'Operadores de asignación')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-assignment-operators', 'Operadores de asignación')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.13', 'Operadores de asignación')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-11.13', 'Operadores de asignación')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>
+    <p>Definición inicial</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_tambien">Vea tambien</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators">Operadores Aritméticos</a></li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/operators_e72d8790e25513408a18a5826660f704/index.html b/files/es/conflicting/web/javascript/reference/operators_e72d8790e25513408a18a5826660f704/index.html
new file mode 100644
index 0000000000..a2a2ca8de7
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/operators_e72d8790e25513408a18a5826660f704/index.html
@@ -0,0 +1,298 @@
+---
+title: Operadores lógicos
+slug: >-
+  conflicting/Web/JavaScript/Reference/Operators_e72d8790e25513408a18a5826660f704
+translation_of: Web/JavaScript/Reference/Operators
+translation_of_original: Web/JavaScript/Reference/Operators/Logical_Operators
+original_slug: Web/JavaScript/Referencia/Operadores/Operadores_lógicos
+---
+<div>{{jsSidebar("Operadores_lógicos")}}</div>
+
+<p>Los operadores lógicos se usan típicamente con valores {{jsxref("Boolean")}}. En tal caso, regresan un valor Boolean. Sin embargo, los operadores &amp;&amp; y || regresan en realidad el valor de uno de los operandos especificados, por lo que si estos operadores se usan con valores no Boolean, posiblemente regresen un valor no Boolean.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los operadores lógicos se describen en la tabla siguiente:</p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th>Operador</th>
+   <th>Uso</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>AND (<code>&amp;&amp;</code>) lógico</td>
+   <td><code><em>expr1</em> &amp;&amp; <em>expr2</em></code></td>
+   <td>
+    <p>Regresa <code>expr1 </code>si tal puede convertirse a false; de lo contrario, regresa <code>expr2</code>. De esta forma, cuando se usa con valores Boolean, &amp;&amp; regresa true si ambos operandos son verdaderos; de lo contrario regresa false.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>OR (<code>||</code>) lógico</td>
+   <td><code><em>expr1</em> || <em>expr2</em></code></td>
+   <td>
+    <p>Regresa<code> expr1</code> si tal puede convertirse a true; de lo contrario, regresa <code>expr2</code>. De esta forma, cuando se usa con valores Boolean, || regresa true si cualquier operando es verdadero; pero si ambos son falsos, regresa "false".</p>
+   </td>
+  </tr>
+  <tr>
+   <td>NOT (<code>!</code>) lógico</td>
+   <td><code>!<em>expr</em></code></td>
+   <td>
+    <p>Regresa false si su único operando puede convertirse a true; de lo contrario, regresa true.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Algunos ejemplos de expresiones que pueden convertirse a false son aquellas que evalúan a null, 0, un string vacío (""), o undefined.</p>
+
+<p>A pesar de que los operadores &amp;&amp; y ||  pueden ser usados con operandos que no son valores Boolean, aún pueden ser considerados como operadores Boolean porque sus valores de regreso siempre pueden convertirse a valores Boolean.</p>
+
+<h3 id="Evaluación_contra_corto_circuitos">Evaluación contra "corto circuitos"</h3>
+
+<p>Ya que las expresiones lógicas son evaluadas de izquierda a derecha, se prueban con una evaluación contra posibles "cortos circuitos" usando las siguientes normas:</p>
+
+<ul>
+ <li><code>false &amp;&amp; (<em>cualquier valor)</em></code> evalúa a "false".</li>
+ <li><code>true || (<em>cualquier valor)</em></code> evalúa a "true".</li>
+</ul>
+
+<p>Las reglas de lógica garantizan que estas evaluaciones siempre son correctas. Se debe notar que la parte de "cualquier valor" en las expresiones anteriores no se evalúa, para que tal acción no afecte de ninguna forma. Además, es de notar que la parte de "cualquier valor" en las expresiones anteriores debe ser cualquier expresión lógica (lo que se indica con los paréntesis).</p>
+
+<p>Por ejemplo, las siguientes dos expresiones son equivalentes.</p>
+
+<pre class="brush: js">function shortCircuitEvaluation() {
+  doSomething() || doSomethingElse()
+}
+
+function equivalentEvaluation() {
+  var flag = doSomething();
+  if (!flag) {
+    doSomethingElse();
+  }
+}
+</pre>
+
+<p>Sin embargo, las siguientes expresiones no son equivalentes debido a la <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">precedencia de operadores</a>, y con tal ejemplo se enfatiza la importancia de que la parte derecha sea una única expresión (agrupada en paréntesis si es necesario).</p>
+
+<pre class="brush: js">false &amp;&amp; true  || true      // regresa true
+false &amp;&amp; (true || true)     // regresa false</pre>
+
+<h3 id="AND_()_lógico"><a name="Logical_AND">AND (<code>&amp;&amp;</code>) lógico</a></h3>
+
+<p>El siguiente código muestra ejemplos del operador &amp;&amp; (AND lógico).</p>
+
+<pre class="brush: js">a1 = true  &amp;&amp; true      // t &amp;&amp; t regresa true
+a2 = true  &amp;&amp; false     // t &amp;&amp; f regresa false
+a3 = false &amp;&amp; true      // f &amp;&amp; t regresa false
+a4 = false &amp;&amp; (3 == 4)  // f &amp;&amp; f regresa false
+a5 = "Cat" &amp;&amp; "Dog"     // t &amp;&amp; t regresa "Dog"
+a6 = false &amp;&amp; "Cat"     // f &amp;&amp; t regresa false
+a7 = "Cat" &amp;&amp; false     // t &amp;&amp; f regresa false
+</pre>
+
+<h3 id="OR_()_lógico"><a name="Logical_OR">OR (<code>||</code>) lógico</a></h3>
+
+<p>El siguiente código muestra ejemplos del operador <code>||</code> (OR lógico).</p>
+
+<pre class="brush: js">o1 = true  || true       // t || t regresa true
+o2 = false || true       // f || t regresa true
+o3 = true  || false      // t || f regresa true
+o4 = false || (3 == 4)   // f || f regresa false
+o5 = "Cat" || "Dog"      // t || t regresa "Cat"
+o6 = false || "Cat"      // f || t regresa "Cat"
+o7 = "Cat" || false      // t || f regresa "Cat"
+</pre>
+
+<h3 id="Logical_NOT_(!)"><a name="Logical_NOT">Logical NOT (<code>!</code>)</a></h3>
+
+<p>El siguiente código muestra ejemplos del operador <code>!</code> (NOT lógico).</p>
+
+<pre class="brush: js">n1 = !true              // !t regresa false
+n2 = !false             // !f regresa true
+n3 = !"Cat"             // !t regresa false
+</pre>
+
+<h3 id="Reglas_de_conversión">Reglas de conversión</h3>
+
+<h4 id="Convertir_de_AND_a_OR">Convertir de AND a OR</h4>
+
+<p>la siguiente operación que involucra Booleans:</p>
+
+<pre class="brush: js">bCondition1 &amp;&amp; bCondition2</pre>
+
+<p>siempre es igual a:</p>
+
+<pre class="brush: js">!(!bCondition1 || !bCondition2)</pre>
+
+<h4 id="Convertir_de_OR_a_AND">Convertir de OR a AND</h4>
+
+<p>la siguiente operación que involucra Booleans:</p>
+
+<pre class="brush: js">bCondition1 || bCondition2</pre>
+
+<p>siempre es igual a:</p>
+
+<pre class="brush: js">!(!bCondition1 &amp;&amp; !bCondition2)</pre>
+
+<h4 id="Convertir_entre_operadores_NOT">Convertir entre operadores NOT</h4>
+
+<p>la siguiente operación que involucra Booleans:</p>
+
+<pre class="brush: js">!!bCondition</pre>
+
+<p>siempre es igual a:</p>
+
+<pre class="brush: js">bCondition</pre>
+
+<h3 id="Eliminando_paréntesis_anidados">Eliminando paréntesis anidados</h3>
+
+<p>Ya que las expresiones lógicas son evaluadas de izquierda a derecha, siempre es posible eliminar paréntesis en una expresión compleja, si se siguen ciertas reglas.</p>
+
+<h4 id="Eliminando_operadores_AND_anidados">Eliminando operadores AND anidados</h4>
+
+<p>La siguiente operación compleja que involucra Booleans:</p>
+
+<pre class="brush: js">bCondition1 || (bCondition2 &amp;&amp; bCondition3)</pre>
+
+<p>siempre es igual a:</p>
+
+<pre class="brush: js">bCondition1 || bCondition2 &amp;&amp; bCondition3</pre>
+
+<h4 id="Eliminando_operadores_OR_anidados">Eliminando operadores OR anidados</h4>
+
+<p>La siguiente operación compleja que involucra Booleans:</p>
+
+<pre class="brush: js">bCondition1 &amp;&amp; (bCondition2 || bCondition3)</pre>
+
+<p>siempre es igual a:</p>
+
+<pre class="brush: js">!(!bCondition1 || !bCondition2 &amp;&amp; !bCondition3)</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.11')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>
+    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4.9">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.11">Binary Logical Operators</a></p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-binary-logical-operators')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-binary-logical-operators">Binary Logical Operators</a></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-binary-logical-operators')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Definido en varias secciones de la especificación: <a href="http://tc39.github.io/ecma262/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://tc39.github.io/ecma262/#sec-binary-logical-operators">Binary Logical Operators</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>AND (<code>&amp;&amp;</code>) lógico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>OR (<code>||</code>) lógico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>NOT (<code>!</code>) lógico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>AND (<code>&amp;&amp;</code>) lógico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>OR (<code>||</code>) lógico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>NOT (<code>!</code>) lógico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">Operaciones binarias</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">Boolean</a></li>
+</ul>
diff --git a/files/es/conflicting/web/javascript/reference/statements/switch/index.html b/files/es/conflicting/web/javascript/reference/statements/switch/index.html
new file mode 100644
index 0000000000..c70e5eec5d
--- /dev/null
+++ b/files/es/conflicting/web/javascript/reference/statements/switch/index.html
@@ -0,0 +1,122 @@
+---
+title: default
+slug: conflicting/Web/JavaScript/Reference/Statements/switch
+tags:
+  - JavaScript
+  - Palabra clave
+translation_of: Web/JavaScript/Reference/Statements/switch
+translation_of_original: Web/JavaScript/Reference/Statements/default
+original_slug: Web/JavaScript/Referencia/Sentencias/default
+---
+<div>{{jsSidebar("Sentencias")}}</div>
+
+<p>La palabra clave<strong> default, </strong>en JavaScript puede ser usada en dos situaciones: dentro una sentencia {{jsxref("Sentencias/switch", "switch")}}, o con un sentencia{{jsxref("Sentencias/export", "export")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-default.html")}}</div>
+
+<p class="hidden">El codigo fuente para este ejemplo interactivo esta almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y mandenos un pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p>Dentro de una sentencia {{jsxref("Sentencias/switch", "switch")}}:</p>
+
+<pre class="syntaxbox">switch (expresion) {
+  case valor1:
+    //Declaración ejecutada cuando el resultado de la expresion conincida con valor1
+    [break;]
+  default:
+    //Declaración ejecutada cuando ninguno de los valores conincida con algun valor de la expresion
+    [break;]
+}</pre>
+
+<p>Con una sentencia {{jsxref("Sentencias/export", "export")}}:</p>
+
+<pre class="syntaxbox">export default <em>nameN</em> </pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Para mas detalles vea las paginas:</p>
+
+<ul>
+ <li>Sentencia {{jsxref("Sentencias/switch", "switch")}} y</li>
+ <li>Sentencia {{jsxref("Sentencias/export", "export")}}.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_default_en_una_sentencia_switch">Usando <code>default</code> en una sentencia <code>switch</code></h3>
+
+<p>En el siguiente ejemplo, si se evalua <code>expr</code>  como "Naranjas" o "Manzanas", el programa coincide los valores en cada caso: "Naranjas" o "Manzanas", y ejecuta la declaración correspondiente. La palabra clave <code>default</code> ayudara en algun otro caso y ejecuta la declaración asociada.</p>
+
+<pre class="brush: js">switch (expr) {
+  case 'Naranjas':
+    console.log('Las Naranjas cuestan $0.59 el kilogramo.');
+    break;
+  case 'Manzanas':
+    console.log('Las Manzanas cuestan $0.32 el kilogramo.');
+    break;
+  default:
+    console.log('Lo esntimos, no tenemos ' + expr + '.');
+}</pre>
+
+<h3 id="Usando_default_con_export">Usando <code>default</code> con <code>export</code></h3>
+
+<p>Si queres exportar un solo valor o necesitas reservar un valor para un modulo, puedes usar una exportación por defecto:</p>
+
+<pre class="brush: js">// modulo "mi-modulo.js"
+let cube = function cube(x) {
+  return x * x * x;
+};
+export default cube;</pre>
+
+<p>Entonces, en otro script, sera sencillo de importar el valor del modulo:</p>
+
+<pre class="brush: js">// modulo "otro-modulo.js"
+import cubeArea from 'mi-modulo';  //default export nos da la libertad de decir import cubeArea, en lugar de import cube from 'my-module'
+console.log(cubeArea(3)); // 27
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-switch-statement', 'switch statement')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-exports', 'Exports')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-switch-statement', 'switch statement')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-exports', 'Exports')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta pagina es generada desde datos estruturados. si quieres contribuir con los datos, revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un pull request.</div>
+
+<p>{{Compat("javascript.statements.default")}}</p>
+
+<h2 id="Vea_tambien">Vea tambien</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/export", "export")}}</li>
+ <li>{{jsxref("Sentencias/switch", "switch")}}</li>
+</ul>
diff --git a/files/es/conflicting/web/media/formats/index.html b/files/es/conflicting/web/media/formats/index.html
new file mode 100644
index 0000000000..15b4627d03
--- /dev/null
+++ b/files/es/conflicting/web/media/formats/index.html
@@ -0,0 +1,282 @@
+---
+title: Formatos de medios admitidos por los elementos HTML audio y video
+slug: conflicting/Web/Media/Formats
+translation_of: Web/Media/Formats
+translation_of_original: Web/HTML/Supported_media_formats
+original_slug: Web/HTML/Formatos_admitidos_de_audio_y_video_en_html5
+---
+<p>Las etiquetas {{ HTMLElement("audio") }} y {{ HTMLElement("video") }} <span id="result_box" lang="es"><span class="hps">proporcionan apoyo</span> <span class="hps">para la reproducción de</span> <span class="hps">audio</span> <span class="hps">y video</span> <span class="hps">sin necesidad de</span> <span class="atn hps">plug-</span><span>ins.</span> <span class="hps">Codecs</span> <span class="hps">de vídeo</span> <span class="hps">y codecs</span> <span class="hps">de audio</span> <span class="hps">se utilizan para manejar</span> <span class="hps">vídeo y</span> <span class="hps">audio,</span> <span class="hps">y los diferentes</span> <span class="hps">codecs</span> <span class="hps">ofrecen diferentes</span> <span class="hps">niveles de compresión</span> <span class="hps">y calidad.</span> <span class="hps">Un</span> <span class="hps">formato de contenedor</span> <span class="hps">se utiliza para</span> <span class="hps">almacenar y transmitir</span> <span class="hps">el vídeo</span> <span class="hps">y el audio</span> <span class="hps">codificado</span> <span class="hps">juntos.</span> <span class="hps">Muchos</span> <span class="hps">codecs</span> <span class="hps">y formatos</span> <span class="hps">de contenedor</span> <span class="hps">existe</span><span>,</span> <span class="hps">e incluso hay</span> <span class="hps">más combinaciones de</span> <span class="hps">ellos.</span> <span class="hps">Para su uso</span> <span class="hps">en la web,</span> <span class="hps">sólo un puñado de</span> <span class="hps">combinaciones</span> <span class="hps">son relevantes.</span></span></p>
+
+<p>Diferentes navegadores no soportan los mismos formatos para audio y video en HTML5, principalmente debido a problemas de patentes. El área de formatos de medios en la web ha sufrido mucho por la ley de patentes en muchos paises, incluyendo EE.UU y la UE (La memoria de las patentes en este articulo se proporciona tal cual y sin ningun tipo de garantia.)</p>
+
+<p><span id="result_box" lang="es"><span class="hps">Para hacer</span> <span class="hps">un vídeo de</span> <span class="hps">HTML5</span><span>, que</span> <span class="hps">trabaja en</span> <span class="hps">las nuevas versiones de</span> <span class="hps">los principales navegadores</span><span>, puede</span> <span class="hps">usar el elemento {{HTMLElement("source")}} para reproducir</span> <span class="hps">en formatos WebM</span> o el formato <span class="hps">AAC</span> <span class="hps">MPEG</span> <span class="hps">H.264,</span> <span class="hps">usando el</span> <span class="hps">elemento de origen</span> <span class="hps">de esta manera:</span></span></p>
+
+<pre class="brush: html">&lt;video controls&gt;
+  &lt;source src="somevideo.webm" type="video/webm"&gt;
+  &lt;source src="somevideo.mp4" type="video/mp4"&gt;
+  I'm sorry; your browser doesn't support HTML5 video.
+  &lt;!-- You can embed a Flash player here, to play your mp4 video in older browsers --&gt;
+&lt;/video&gt;
+</pre>
+
+<h3 id="WebM">WebM</h3>
+
+<p><span id="result_box" lang="es"><span class="hps">El formato</span> <a href="http://www.webmproject.org/" title="http://www.webmproject.org/"><span class="hps">WebM</span></a> <span class="hps">se basa en</span> <span class="hps">una versión restringida</span> <span class="hps">del</span> <span class="hps">formato contenedor</span> <span class="hps">Matroska</span><span>.</span> <span class="hps">Siempre</span> <span class="hps">utiliza</span> <span class="hps">el códec de vídeo</span> <span class="hps">VP8</span> <span class="hps">y</span> <span class="hps">el códec de audio</span> <span class="hps">Vorbis</span><span>.</span> <span class="hps">WebM</span> <span class="hps">es</span> <span class="hps">soportado nativamente</span> <span class="hps">en</span> <span class="hps">Gecko</span> <span class="atn hps">(</span><span>Firefox)</span><span>, Chrome</span> <span class="hps">y</span> <span class="hps">Opera,</span> <span class="hps">y el</span> <span class="hps">soporte para el formato</span> <span class="hps">se puede agregar a</span> <span class="hps">Internet</span> <span class="hps">Explorer y</span> <span class="hps">Safari</span> <span class="hps">mediante la instalación de</span> <span class="hps">un add</span><span>-on</span><span>.</span></span></p>
+
+<p><a href="http://blogs.msdn.com/b/ie/archive/2011/02/02/html5-and-web-video-questions-for-the-industry-from-the-community.aspx" title="http://blogs.msdn.com/b/ie/archive/2011/02/02/html5-and-web-video-questions-for-the-industry-from-the-community.aspx"><span id="result_box" lang="es"><span class="hps">Declaración</span> <span class="hps">de</span> <span class="hps">Microsoft</span> <span class="hps">sobre por qué</span> <span class="hps">IE9</span> <span class="hps">no tiene soporte</span> <span class="hps">WebM</span> <span class="hps">nativo.</span></span></a></p>
+
+<p><span id="result_box" lang="es"><span class="hps">El formato</span> <span class="hps">WebM</span><span>,</span> <span class="hps">específicamente</span> <span class="hps">el códec de vídeo</span> <span class="hps">VP8</span><span>,</span> <span class="alt-edited hps">habría</span> sido <span class="alt-edited hps">acusado</span> <span class="hps">de</span> <span class="hps">infracción de derechos de</span> <span class="hps">patente</span> <span class="hps">por un grupo de</span> <span class="hps">empresas de</span> <span class="hps">responder a una llamada</span> <span class="hps">por la</span> <span class="hps">MPEG</span> <span class="hps">LA</span> <span class="hps">para la formación de</span> <span class="hps">un consorcio de patentes</span><span>, pero</span> <a href="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8" title="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8"><span class="hps">MPEG</span> <span class="hps">LA</span> <span class="hps">se ha comprometido a</span> <span class="hps">licenciar</span> <span class="hps">las patentes</span> <span class="hps">de</span> <span class="hps">Google</span></a> <span class="hps">bajo</span> <span class="atn hps">"</span><a href="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8" title="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8"><span class="hps">transferible y de licencia gratuita</span></a><span class="atn hps">"</span><span>.</span> <span class="hps">Esto significa,</span> <span class="hps">efectivamente</span><span>,</span> <span class="hps">que todas las patentes</span> <span class="hps">conocidas en</span> <span class="hps">el formato</span> <span class="hps">WebM</span> <span class="hps">tienen licencia</span> <span class="hps">para todo el mundo</span> <span class="hps">de forma gratuita.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Gecko</span> <span class="hps">reconoce los siguientes</span> <span class="hps">tipos MIME</span> <span class="hps">para los archivos WebM:</span></span></p>
+
+<dl>
+ <dt><code>video/webm</code></dt>
+ <dd>Un archivo WebM que es capaz de reproducir video (y es posible audio también)</dd>
+ <dt><code>audio/webm</code></dt>
+ <dd>Un archivo WebM que contiene audio unicamente.</dd>
+</dl>
+
+<h3 id="Ogg_Theora_Vorbis">Ogg Theora Vorbis</h3>
+
+<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps">formato contenedor</span> <span class="hps">Ogg</span> <span class="hps">con</span> <span class="hps">el códec de vídeo</span> <span class="hps">Theora</span> <span class="hps">y</span> <span class="hps">el códec de audio</span> <span class="hps">Vorbis</span> <span class="hps">es compatible con</span> <span class="hps">Gecko</span> <span class="atn hps">(</span><span>Firefox)</span><span>, Chrome</span> <span class="hps">y</span> <span class="hps">Opera,</span> <span class="hps">y el</span> <span class="hps">soporte para el formato</span> <span class="hps">se puede agregar a</span> <span class="hps">Safari</span> <span class="hps">mediante la instalación de</span> <span class="hps">un add</span><span>-on</span><span>.</span> <span class="hps">El formato no</span> <span class="hps">es compatible en Internet</span> <span class="hps">Explorer.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">WebM</span> <span class="alt-edited hps">es preferente</span>, <span class="hps">generalmente sobre</span> <span class="hps">Theora</span> <span class="hps">Ogg</span> <span class="hps">Vorbis</span> <span class="hps">cuando esté disponible</span></span><span id="result_box" lang="es"><span>,</span> <span class="hps">ya que proporciona</span> <span class="hps">una mejor</span> <span class="hps">relación de</span> <span class="hps">compresión para</span> <span class="hps">la calidad</span> <span class="hps">y</span> <span class="hps">se apoya</span> <span class="hps">en</span> <span class="hps">más navegadores</span><span>.</span> <span class="hps">El formato</span> <span class="hps">Ogg</span> <span class="hps">sin embargo, puede</span> <span class="hps">ser utilizado para apoyar</span> <span class="hps">versiones de los navegadores</span> <span class="hps">más antiguos</span><span>, en los que</span> <span class="hps">aún no</span> <span class="hps">se dispone de</span> <span class="hps">soporte para</span> <span class="hps">WebM</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">La</span> <span class="hps">situación de las patentes</span> <span class="hps">de</span> <span class="hps">Theora</span> <span class="hps">es</span> <span class="hps">similar a la de</span> <span class="hps">WebM</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Usted puede aprender</span> <span class="hps">más sobre la creación</span> <span class="hps">de medios</span> <span class="hps">Ogg</span> <span class="hps">leyendo </span></span><a class="external" href="http://en.flossmanuals.net/ogg-theora/" title="http://en.flossmanuals.net/ogg-theora/">the Theora Cookbook</a>.</p>
+
+<p>Gecko reconoce los siguientes tipos de MIME para el archivo Ogg:</p>
+
+<dl>
+ <dt><code>audio/ogg</code></dt>
+ <dd><span class="short_text" id="result_box" lang="es"><span class="hps">Un archivo</span> <span class="hps">Ogg</span> <span class="hps">que contiene sólo</span> <span class="hps">audio.</span></span></dd>
+ <dt><code>video/ogg</code></dt>
+ <dd><span id="result_box" lang="es"><span class="hps">Un video</span> <span class="hps">que contiene</span> <span class="hps">el archivo</span> <span class="hps">ogg</span> <span class="hps">(y posiblemente </span><span class="hps">audio también)</span><span>.</span></span></dd>
+ <dt><code>application/ogg</code></dt>
+ <dd><span id="result_box" lang="es"><span class="hps">Un archivo</span> <span class="hps">Ogg</span> <span class="hps">con el contenido</span> <span class="hps">especificado.</span> <span class="hps">Utilizando uno de</span> <span class="hps">los otros dos tipos</span> <span class="hps">MIME</span> <span class="hps">es</span> <span class="hps">preferido</span><span>,</span> <span class="hps">pero se puede usar</span> <span class="hps">esta opción si</span> <span class="hps">usted no sabe</span> <span class="hps">lo que</span> <span class="hps">el contenido</span> <span class="hps">del fichero es</span></span>.</dd>
+</dl>
+
+<h3 id="Ogg_Opus">Ogg Opus</h3>
+
+<p><span id="result_box" lang="es"><span class="hps">El contenedor</span> <span class="hps">Ogg</span> <span class="hps">también puede contener</span> <span class="hps">audio codificado</span> <span class="hps">con el <a href="http://www.opus-codec.org/" title="http://www.opus-codec.org/">códec</a></span><a href="http://www.opus-codec.org/" title="http://www.opus-codec.org/"> <span class="hps">Opus</span><span>.</span></a> <span class="hps">El apoyo a esta</span> <span class="hps">disponible en</span></span> Gecko 15.0 {{ geckoRelease("15.0") }} y superior.</p>
+
+<h3 id="MP4_H.264_(AAC_o_MP3)">MP4 H.264 (AAC o MP3)</h3>
+
+<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps">formato contenedor</span> <span class="hps">MP4</span> <span class="hps">con</span> <span class="hps">el códec de vídeo</span> <span class="hps">H.264</span> <span class="hps">y, o bien</span> <span class="hps">el códec de audio</span> <span class="hps">AAC</span> <span class="hps">o</span> <span class="hps">el códec de audio</span> <span class="hps">MP3</span> <span class="alt-edited hps">es</span> <span class="alt-edited hps">nativamente</span> <span class="hps">compatible con</span> <span class="hps">Internet</span> <span class="hps">Explorer,</span> <span class="hps">Safari</span> <span class="hps">y</span> <span class="hps">Chrome,</span> pero <span class="hps">Chromium y</span> <span class="hps">Opera</span> <span class="hps">no son compatibles con</span> <span class="hps">el formato</span><span>.</span> <span class="hps">Firefox</span> <span class="hps">pronto</span> <span class="hps">admite el formato</span><span>, pero sólo cuando</span> <span class="hps">un decodificador</span> <span class="hps">de terceros</span> <span class="hps">esté disponible.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Los</span> <span class="hps">formatos</span> <span class="hps">MPEG</span> <span class="hps">están cubiertos por</span> <span class="hps">patentes, que</span> <span class="hps">no tienen licencia</span> <span class="hps">libre</span><span>.</span> <span class="hps">Todas</span> <span class="hps">las licencias necesarias</span> <span class="hps">se pueden comprar de</span> <span class="hps">MPEG</span> <span class="hps">LA.</span> <span class="hps">Desde</span> <span class="hps">H.264</span> <span class="hps">no está en</span> <span class="hps">un formato</span> <span class="hps">libre de</span> <span class="hps">regalías,</span> <span class="hps">no es apto</span> <span class="hps">para la plataforma</span> <span class="hps">web de código abierto</span><span>, de acuerdo con</span> <span class="hps">Mozilla</span> <span class="atn hps">[</span><a href="http://shaver.off.net/diary/2010/01/23/html5-video-and-codecs/" title="http://shaver.off.net/diary/2010/01/23/html5-video-and-codecs/"><span>1</span></a><span>,</span> <a href="http://robert.ocallahan.org/2010/01/video-freedom-and-mozilla_23.html" title="http://robert.ocallahan.org/2010/01/video-freedom-and-mozilla_23.html"><span class="hps">2</span></a><span>]</span><span>,</span> <span class="hps">Google</span> <span class="atn hps">[</span><a href="http://blog.chromium.org/2011/01/html-video-codec-support-in-chrome.html" title="http://blog.chromium.org/2011/01/html-video-codec-support-in-chrome.html"><span>1</span></a><span>,</span> <a href="http://blog.chromium.org/2011/01/more-about-chrome-html-video-codec.html" title="http://blog.chromium.org/2011/01/more-about-chrome-html-video-codec.html"><span class="hps">2</span></a><span>]</span> <span class="hps">y Opera.</span> <span class="hps">Sin embargo, los</span> <span class="hps">formatos libres</span> <span class="hps">no son compatibles con</span> <span class="hps">Internet</span> <span class="hps">Explorer y</span> <span class="hps">Safari</span><span>, <a href="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/" title="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/">Mozilla</a></span><a href="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/" title="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/"> <span class="hps">ha decidido apoyar</span> <span class="hps">el formato de</span> </a><span class="hps"><a href="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/" title="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/">todos modos</a>, y</span> <span class="hps">Google</span> <span class="hps">no</span> <span class="hps">cumplió</span> <span class="hps">su promesa de</span> <span class="hps">eliminar el soporte</span> <span class="hps">para él en</span> <span class="hps">Chrome.</span></span></p>
+
+<h3 id="WAVE_PCM">WAVE PCM</h3>
+
+<p>El formato contenedor WAVE, con el códec de audio PCM (WAVE codec "1") con el apoyo de Gecko (Firefox), y Safari. Archivos en el formato contenedor WAVE normalmente terminan con la extensión ". wav".</p>
+
+<div class="note"><strong>Nota: </strong><span class="short_text" id="result_box" lang="es"><span class="hps">Consulte</span> <a href="http://www.rfc-editor.org/rfc/rfc2361.txt" title="http://www.rfc-editor.org/rfc/rfc2361.txt"><span class="hps">RFC</span> <span class="hps">2361</span></a> <span class="hps">para</span> <span class="hps">el registro</span> <span class="hps">códec</span> <span class="hps">WAVE</span><span>.</span></span></div>
+
+<p><span id="result_box" lang="es"><span class="hps">Gecko</span> <span class="hps">reconoce los siguientes</span> <span class="hps">tipos MIME</span> <span class="alt-edited hps">en archivos de audio</span> <span class="hps">WAVE</span><span>:</span></span></p>
+
+<ul>
+ <li><code>audio/wave</code> (preferido)</li>
+ <li><code>audio/wav</code></li>
+ <li><code>audio/x-wav</code></li>
+ <li><code>audio/x-pn-wav</code></li>
+</ul>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>3.0</td>
+   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
+   <td>9.0</td>
+   <td>10.50</td>
+   <td>3.1</td>
+  </tr>
+  <tr>
+   <td><code>&lt;audio&gt;</code>: WAVE, PCM</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>3.1</td>
+  </tr>
+  <tr>
+   <td><code>&lt;audio&gt;</code>: WebM, Vorbis</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("2.0") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>10.60</td>
+   <td>3.1 (must be installed separately)</td>
+  </tr>
+  <tr>
+   <td><code>&lt;audio&gt;</code>: Ogg, Vorbis</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>10.50</td>
+   <td>3.1 (must be installed separately, e.g. <a class="external" href="http://www.xiph.org/quicktime/" title="http://www.xiph.org/quicktime/">XiphQT</a>)</td>
+  </tr>
+  <tr>
+   <td><code>&lt;audio&gt;</code>: MP4, MP3</td>
+   <td>
+    <p>{{ CompatVersionUnknown() }} (Not in Chromium)</p>
+   </td>
+   <td>
+    <p>Partial (see below)</p>
+   </td>
+   <td>9.0</td>
+   <td>{{ CompatNo() }}</td>
+   <td>3.1</td>
+  </tr>
+  <tr>
+   <td><code>&lt;audio&gt;</code>: MP4, AAC</td>
+   <td>
+    <p>{{ CompatVersionUnknown() }} (Main only) (Not in Chromium)</p>
+   </td>
+   <td>
+    <p>Partial (see below)</p>
+   </td>
+   <td>9.0</td>
+   <td>{{ CompatNo() }}</td>
+   <td>3.1</td>
+  </tr>
+  <tr>
+   <td><code>&lt;audio&gt;</code>: Ogg, Opus</td>
+   <td>27.0</td>
+   <td>{{ CompatGeckoDesktop("15.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+  <tr>
+   <td><code>&lt;video&gt;</code>: WebM, VP8, Vorbis</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("2.0") }}</td>
+   <td>9.0 (<a class="external" href="http://blogs.msdn.com/b/ie/archive/2011/03/16/html5-video-update-webm-for-ie9.aspx" title="http://blogs.msdn.com/b/ie/archive/2011/03/16/html5-video-update-webm-for-ie9.aspx">must be installed separately</a>, e.g. <a class="external" href="http://tools.google.com/dlpage/webmmf/" title="http://tools.google.com/dlpage/webmmf/">WebM MF</a>)</td>
+   <td>10.60</td>
+   <td>3.1 (must be installed separately, e.g. <a class="external" href="http://perian.org/" title="http://perian.org/">Perian</a>)</td>
+  </tr>
+  <tr>
+   <td><code>&lt;video&gt;</code>: Ogg, Theora, Vorbis</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>10.50</td>
+   <td>3.1 (must be installed separately, e.g. <a class="external" href="http://www.xiph.org/quicktime/" title="http://www.xiph.org/quicktime/">XiphQT</a>)</td>
+  </tr>
+  <tr>
+   <td><code>&lt;video&gt;</code>: MP4, H.264, MP3</td>
+   <td>
+    <p>{{ CompatVersionUnknown() }} (Not in Chromium)</p>
+   </td>
+   <td>Partial (see below)</td>
+   <td>9.0</td>
+   <td>{{ CompatNo() }}</td>
+   <td>3.1</td>
+  </tr>
+  <tr>
+   <td><code>&lt;video&gt;</code>: MP4, H.264, AAC</td>
+   <td>
+    <p>{{ CompatVersionUnknown() }} (Not in Chromium)</p>
+   </td>
+   <td>Partial (see below)</td>
+   <td>9.0</td>
+   <td>{{ CompatNo() }}</td>
+   <td>3.1</td>
+  </tr>
+  <tr>
+   <td>any other format</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>3.1 (plays all formats available via QuickTime)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Para evitar</span> <span class="hps">problemas de patentes</span><span>, el apoyo a</span> <span class="hps">MPEG</span> <span class="hps">4</span><span>, H.264</span><span>, MP3</span> <span class="hps">y</span> <span class="hps">AAC</span> <span class="hps">no</span> <span class="hps">está integrado directamente en</span> <span class="hps">Firefox.</span> <span class="hps">En su lugar,</span> <span class="hps">se basa en</span> <span class="hps">el apoyo del</span> <span class="hps">sistema operativo o</span> <span class="hps">hardware.</span> <span class="hps">Firefox</span> <span class="hps">soporta</span> <span class="hps">estos formatos</span> <span class="hps">en las siguientes plataformas</span><span>:</span></span></p>
+
+<table class="standard-table" style="height: 159px; width: 285px;">
+ <thead>
+  <tr>
+   <th scope="col">Plataforma</th>
+   <th scope="col">Versión de Firefox</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=799315" title="https://bugzilla.mozilla.org/show_bug.cgi?id=799315">Windows 7+</a></td>
+   <td>21.0</td>
+  </tr>
+  <tr>
+   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=825153" title="https://bugzilla.mozilla.org/show_bug.cgi?id=825153">Windows Vista</a></td>
+   <td>22.0</td>
+  </tr>
+  <tr>
+   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=748351" title="https://bugzilla.mozilla.org/show_bug.cgi?id=748351">Android</a></td>
+   <td>20.0</td>
+  </tr>
+  <tr>
+   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=714408" title="https://bugzilla.mozilla.org/show_bug.cgi?id=714408">Firefox OS</a></td>
+   <td>15.0</td>
+  </tr>
+  <tr>
+   <td>OS X 10.7</td>
+   <td>22.0</td>
+  </tr>
+ </tbody>
+</table>
+
+<ul>
+ <li><a class="external" href="http://dev.opera.com/articles/view/introduction-html5-video/#codecs" title="http://dev.opera.com/articles/view/introduction-html5-video/#codecs">Video codecs in Opera</a></li>
+ <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff975073%28v=VS.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ff975073%28v=VS.85%29.aspx">Video codecs in Internet Explorer</a></li>
+ <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff975061%28v=vs.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ff975061%28v=vs.85%29.aspx">Audio codecs in Internet Explorer</a></li>
+ <li><a href="http://www.chromium.org/audio-video" title="http://www.chromium.org/audio-video">Audio &amp; Video codecs in Chrome</a></li>
+</ul>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a class="internal" href="/en/Using_HTML5_audio_and_video" title="En/Using audio and video in Firefox">Using audio and video in Firefox</a></li>
+ <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#media-elements" title="http://www.whatwg.org/specs/web-apps/current-work/#media-elements">Media elements</a> (HTML 5 specification)</li>
+ <li><code><a class="internal" href="/en/HTML/Element/Video" title="En/HTML/Element/Video">video</a></code></li>
+ <li><a class="internal" href="/en/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a></li>
+</ul>
diff --git a/files/es/conflicting/web/opensearch/index.html b/files/es/conflicting/web/opensearch/index.html
new file mode 100644
index 0000000000..524c22557e
--- /dev/null
+++ b/files/es/conflicting/web/opensearch/index.html
@@ -0,0 +1,55 @@
+---
+title: Añadir motores de búsqueda desde páginas web
+slug: conflicting/Web/OpenSearch
+tags:
+  - Plugins_de_búsqueda
+translation_of: Web/OpenSearch
+translation_of_original: Web/API/Window/sidebar/Adding_search_engines_from_Web_pages
+original_slug: Añadir_motores_de_búsqueda_desde_páginas_web
+---
+<p>Firefox permite que código JavaScript instale plugins de motores de búsqueda, y soporta dos formatos de plugin de motores de búsqueda: <a href="es/Creando_plugins_de_OpenSearch_para_Firefox">OpenSearch</a>, y Sherlock.
+</p>
+<div class="note"><b>Nota:</b> a partir de Firefox 2, OpenSearch es el formato preferido de búsqueda para Firefox.</div>
+<p>Cuando código JavaScript intenta instalar un plugin de búsqueda, Firefox presenta una alerta pidiendo permiso al usuario para instalar el plugin.
+</p>
+<h2 id="Instalando_plugins_de_OpenSearch">Instalando plugins de OpenSearch</h2>
+<p>Para instalar un plugin de OpenSearch, necesita utlilizar el método<code>window.external.AddSearchProvider()</code> DOM . El síntaxis de éste método es:
+</p>
+<pre class="eval">window.external.AddSearchProvider(<i>engineURL</i>);
+</pre>
+<p>Donde <i>engineURL</i> es la URL absoluta del archivo XML para el plugin del motor de búsqueda.
+</p>
+<div class="note"><b>Nota:</b> El soporte de OpenSearch esta sólo disponible en Firefox 2 y posterior.</div>
+<h2 id="Instalando_plugins_de_Sherlock">Instalando plugins de Sherlock</h2>
+<p>Para instalar un plugin de Sherlock, necesitará llamar <code>window.sidebar.addSearchEngine()</code>, el síntaxis para el mismo es:
+</p>
+<pre class="eval">window.sidebar.addSearchEngine(<i>engineURL</i>, <i>iconURL</i>, <i>suggestedName</i>, <i>suggestedCategory</i>);
+</pre>
+<ul><li> El parámetro <code>engineURL</code> es la URL del plugin de Sherlock (un archivo ".src") a instalar.
+</li><li> <code>iconURL</code> es la URL a un icono para asociar al plugin.
+</li><li> El parámetro <code>suggestedName</code> sólo se usa al pedir permiso al usuario para instalar el plugin, así que un mensaje cómo "Desea instalar <i>suggestedName</i> de <i>engineURL</i>?" podrá mostrarse.
+</li><li> El parámetro <code>suggestedCategory</code> no se usa. Debería especificar un valor vacío tipo string (<code>""</code>) o <code>null</code> (nulo).
+</li></ul>
+<p>Para detalles de Sherlock, visite <a class=" external" href="http://developer.apple.com/macosx/sherlock/">http://developer.apple.com/macosx/sherlock/</a>
+</p>
+<h2 id="Detecci.C3.B3n_de_la_capacidad_del_motor_de_b.C3.BAsqueda_del_navegador">Detección de la capacidad del motor de búsqueda del navegador</h2>
+<p>Debido a que las APIs para añadir motores de búsqueda ha cambiado en el paso de la versión 1.5 a la 2 de firefox y ya que Firefox 1.5 no soporta los ficheros de descripción OpenSearch, los desarrolladores web que quieran añadir motores de búsqueda manteniendo la compatibilidad hacia atrás (p.e. que funcione en Firefox 1.5, Firefox 2.0 o IE 7) deben soportar tanto el formato Sherlock como el OpenSearch y deben detectar las capacidades del navegador de acuerdo a ello. El siguiente fragmento de código es un ejemplo de cómo puede hacerse esto:
+</p>
+<pre class="eval">function installSearchEngine() {
+ if (window.external &amp;&amp; ("AddSearchProvider" in window.external)) {
+   // Firefox 2 and IE 7, OpenSearch
+   window.external.AddSearchProvider("<span class="nowiki">http://example.com/search-plugin.xml</span>");
+ } else if (window.sidebar &amp;&amp; ("addSearchEngine" in window.sidebar)) {
+   // Firefox &lt;= 1.5, Sherlock
+   window.sidebar.addSearchEngine("<span class="nowiki">http://example.com/search-plugin.src</span>",
+                                  "<span class="nowiki">http://example.com/search-icon.png</span>",
+                                  "Search Plugin", "");
+ } else {
+   // Sin soporte para motores de búsqueda (IE 6, Opera, etc...).
+   alert("Sin soporte para motores de búsqueda");
+ }
+}
+</pre>
+<div class="noinclude">
+</div>
+{{ languages( { "ca": "ca/Addici\u00f3_de_motors_de_cerca_a_les_p\u00e0gines_web", "en": "en/Adding_search_engines_from_web_pages", "fr": "fr/Ajout_de_moteurs_de_recherche_depuis_des_pages_Web", "it": "it/Installare_plugin_di_ricerca_dalle_pagine_web", "ja": "ja/Adding_search_engines_from_web_pages", "pl": "pl/Dodawanie_wyszukiwarek_z_poziomu_stron_WWW", "zh-tw": "zh_tw/\u81ea\u7db2\u9801\u6dfb\u52a0\u641c\u5c0b\u5f15\u64ce" } ) }}
diff --git a/files/es/conflicting/web/progressive_web_apps/index.html b/files/es/conflicting/web/progressive_web_apps/index.html
new file mode 100644
index 0000000000..4025b422b5
--- /dev/null
+++ b/files/es/conflicting/web/progressive_web_apps/index.html
@@ -0,0 +1,46 @@
+---
+title: Diseño adaptable («responsivo»)
+slug: conflicting/Web/Progressive_web_apps
+translation_of: Web/Progressive_web_apps
+translation_of_original: Web/Guide/Responsive_design
+original_slug: Web_Development/Mobile/Diseño_responsivo
+---
+<p>Como reacción a los problemas asociados con la estrategia de desarrollar <a href="https://developer.mozilla.org/en/Web_Development/Mobile/Separate_sites" title="en/Web development/Mobile/Separate sites">sitios web separados</a> para los móviles y los escritorios, una idea relativamente nueva — aunque de hecho es <a class="external" href="http://www.alistapart.com/articles/dao/">bastante vieja</a>— que está aumentando en popularidad: deshacerse por completo de la detección del agente de usuario y hacer que la misma página responda a las capacidades del navegador en el lado del cliente. Este enfoque se ha denominado comúnmente como <a class="external" href="http://www.alistapart.com/articles/responsive-web-design/">diseño web adaptable —o «responsivo»—</a>. Al igual que la estrategia de sitios separados, el diseño web adaptativo tiene aspectos positivos y negativos.</p>
+<h2 id="Las_ventajas">Las ventajas</h2>
+<p>Aunque no se propuso inicialmente como un método para crear sitios para los móviles, el diseño flexible ha ganado recientemente mucha atención como una forma de dar los primeros pasos para el desarrollo de sitios que sean compatibles y amigables con los móviles en vez de tener un sitio separado para los mismos.</p>
+<p>Se ahorra tiempo y dinero, ya que no es necesario mantener sitios web separados para los diferentes dispositivos.</p>
+<p>El diseño flexilbe ofrece cada página con una sola y única URL. Las estadísticas compartidas de las redes sociales (Facebook Likes, Tweets, 1 en Google plus) no están divididas, ya que las versiones de tus páginas web para el escritorio y los móviles utilizan la misma URL .</p>
+<p>El diseño adaptativo no se preocupa por los agentes de usuario.</p>
+<p>Hay aspectos realmente buenos en este enfoque. Puesto que no se basa en la detección del navegador del usuario, tiene más capacidad de adaptarse cara al futuro que el enfoque de sitios separados. Para sitios sencillos, puede ser más fácil de implementar y mantener que otras opciones.</p>
+<h2 id="Las_desventajas">Las desventajas</h2>
+<p>Este enfoque no está excento de limitaciones. Dado que el contenido debe ser modificado del lado del cliente con JavaScript, se busca cambiar solo lo mínimo necesario. En general, las cosas suelen complicarse muy rápido si tratamos de escribir dos códigos separados en JavaScript para trabajar con el mismo DOM. Ésta es la razón más importante por la que las aplicaciones web tienden a no adoptan esta enfoque.</p>
+<p>Dar a tu sitio actual un diseño flexible también implica reescribir tus estilos, si aún no están luciendo un diseño flexible. Podría tener sus ventajas hacer un diseño adaptativo de tu sitio y ser una buena oportunidad para modernizar y limpiar el CSS de tu sitio.</p>
+<p>Por último, dado que vas a añadir código a tus archivos de comandos (scripts) y tus estilos, el rendimiento puede ser peor que con el enfoque de los sitios separados. En realidad no hay forma de evitar esto salvo refactorizar tus archivos de comandos y tus estilos para ahorrar algunos bytes a largo plazo.</p>
+<h2 id="Cuándo_es_adecuado_elegir_esta_opción">Cuándo es adecuado elegir esta opción</h2>
+<p><a href="/@api/deki/files/5894/=teixido_responsive-300x177.png" title="teixido_responsive-300x177.png"><img align="right" alt="teixido_responsive-300x177.png" class="internal rwrap" src="/@api/deki/files/5894/=teixido_responsive-300x177.png?size=webview" style="width: 300px; height: 177px;"></a>Como se mencionó anteriormente, debido a que los cambios de contenido pueden resultar difíciles, cuando se toma este enfoque, no somos capaces de dar a los usuarios una experiencia radicalmente diferente en el móvil sin un aumento significativo en la complejidad del código. Entonces, si las versiones del escritorio y los móviles son muy similares, este enfoque es una opción muy buena. Ésto es partir de páginas bien adaptadas a sitios centrados en los datos, como las páginas de producto. Puede ver ejemplos debajo, de blog o portfolios!</p>
+<h2 id="Ejemplos">Ejemplos</h2>
+<p>Aunque no es tan popular como el enfoque de sitios separados, hay cada día más sitios web que emplean esta técnica. Por suerte, ya que todo el código está del lado del cliente, si desea ver cómo un sitio implementa técnicamente este método, es tan simple como visitar el sitio y hacer clic en “Ver código fuente.” Aquí tienes algunos ejemplos:</p>
+<ul>
+ <li><a class="external" href="http://teixido.co/">http://teixido.co/</a> – uno de mis diseños flexibles favoritos, también la foto de arriba.</li>
+ <li><a class="external" href="http://adactio.com/journal/1696">http://adactio.com/journal/1696</a> – también es un buen artículo para leer, con sus propios enlaces a ejemplos</li>
+ <li><a class="external" href="http://thinkvitamin.com/">http://thinkvitamin.com/</a></li>
+ <li><a class="external" href="http://stephencaver.com/">http://stephencaver.com/</a></li>
+ <li><a class="external" href="http://hicksdesign.co.uk/">http://hicksdesign.co.uk/</a></li>
+</ul>
+<p>A pesar de ser un método relativamente nuevo, ya están apareciendo mejores prácticas. Por ejemplo, si tú estás diseñando un sitio desde cero con esta opción en mente,  por lo general vale la pena  <a class="external" href="http://www.lukew.com/ff/entry.asp?1117">crear primero un diseño de pantalla pequeña</a>, de manera que las limitaciones del telefono móvil están contigo desde el principio. También es de gran utilidad la mejora progresiva de tus estilos en lugar de ocultar los elementos de tu sitio actual con preguntas de los medios. De esta manera, los navegadores antiguos que no admitan las preguntas de los medios siguen mostrando la disposición adecuada. Una excelente presentación sobre las ventajas de este método la puedes ver <a class="external" href="http://www.slideshare.net/bryanrieger/rethinking-the-mobile-web-by-yiibu">aquí</a>.</p>
+<h2 id="Métodos_de_desarrollo_web_para_móviles">Métodos de desarrollo web para móviles</h2>
+<p>Consulta los siguientes artículos de antecedentes y otros enfoques para el desarrollo de plataformas móviles.</p>
+<ul>
+ <li><a href="/en/Web_Development/Mobile/Mobile-friendliness" title="XML Web Services">¿Qué es un móvil-amigable?</a></li>
+ <li><a href="/en/Web_Development/Mobile/Separate_sites" title="en/Web development/Mobile/Separate sites">Sitios separados</a></li>
+ <li><a href="/en/Web_development/Mobile/A_hybrid_approach" title="en/Web development/Mobile/Hybrid approach">Un enfoque híbrido</a></li>
+</ul>
+<h2 id="Véase_también">Véase también</h2>
+<ul>
+ <li><a href="/en/Web_Development/Responsive_Web_design" title="Responsive Web design">Diseño Web Adaptativo</a> para ver recursos adicionales</li>
+</ul>
+<div class="originaldocinfo">
+ <h3 id="Original_document_information">Original document information</h3>
+ <p>Originally published on 27 May, 2011 on the Mozilla Webdev blog as "<a class="external" href="http://blog.mozilla.com/webdev/2011/05/27/approaches-to-mobile-web-development-part-3-responsive-design/" title="http://blog.mozilla.com/webdev/2011/05/27/approaches-to-mobile-web-development-part-3-responsive-design/">Approaches to Mobile Web Development Part 3 - Responsive Design</a>", by Jason Grlicky.</p>
+</div>
+<p> </p>
diff --git a/files/es/conflicting/web/progressive_web_apps/introduction/index.html b/files/es/conflicting/web/progressive_web_apps/introduction/index.html
new file mode 100644
index 0000000000..be12926a85
--- /dev/null
+++ b/files/es/conflicting/web/progressive_web_apps/introduction/index.html
@@ -0,0 +1,64 @@
+---
+title: Ventajas de una aplicación web progresiva (AWP)
+slug: conflicting/Web/Progressive_web_apps/Introduction
+tags:
+  - AWP
+  - aplicaciones web progresivas
+  - conceptos
+  - ventajas
+translation_of: Web/Progressive_web_apps/Introduction#Advantages_of_web_applications
+translation_of_original: Web/Progressive_web_apps/Advantages
+original_slug: Web/Progressive_web_apps/Ventajas
+---
+<p class="summary">Las Aplicaciones Web Progresivas deben tener todas las ventajas enumeradas en las siguientes secciones a continuación.</p>
+
+
+
+<h2 id="Reconocible">Reconocible<img alt="" src="https://mdn.mozillademos.org/files/12654/discoverable.svg" style="float: right; height: 40px; width: 38px;"></h2>
+
+<p>El objetivo final es que las aplicaciones web deben tener una mejor representación en los motores de búsqueda, ser más fáciles de exponer, catalogar y clasificar, y tener metadatos que los navegadores puedan utilizar para darles capacidades especiales.</p>
+
+<p>Algunas de las capacidades ya se han habilitado en ciertas plataformas basadas en la web mediante tecnologías patentadas como <a href="http://ogp.me/">Open Graph</a>, que proporciona un formato para especificar metadatos similares en el <code>&lt;head&gt;</code> de HTML usando metaetiquetas.</p>
+
+<p>El estándar web relevante aquí es el <a href="/en-US/docs/Web/Manifest">Manifiesto de aplicación web</a>, que define las características de una aplicación, como el nombre, el icono, la pantalla de presentación y los colores del tema en un archivo de manifiesto con formato JSON. Esto es para usar en contextos como listados de aplicaciones y pantallas de inicio de dispositivos.</p>
+
+<ul>
+</ul>
+
+<h2 id="Instalable">Instalable<img alt="" src="https://mdn.mozillademos.org/files/12656/installable.svg" style="float: right; height: 40px; width: 38px;"></h2>
+
+<p>Una parte central de la experiencia de aplicaciones es que los usuarios tengan iconos de aplicaciones en su pantalla de inicio, y ser capaz de pulsar para abrir aplicaciones en su propio contenedor nativo que se siente bien integrado con la plataforma subyacente.</p>
+
+<p>Las aplicaciones web modernas pueden tener esta sensación de aplicación nativa a través de las propiedades establecidas dentro del manifiesto de la aplicación web, y a través de una función disponible en los navegadores de teléfonos inteligentes modernos llamada <a href="/en-US/docs/Web/Apps/Progressive/Add_to_home_screen">Añadir a la página de inicio</a>.</p>
+
+<h2 id="Enlazable">Enlazable<img alt="" src="https://mdn.mozillademos.org/files/12658/linkable.svg" style="float: right; height: 40px; width: 38px;"></h2>
+
+<p>Una de las características más potentes de la Web es ser capaz de enlazar a una aplicación en una URL específica. No necesita tienda de aplicaciones, ningún proceso de instalación complejo. Así es como siempre ha sido.</p>
+
+<h2 id="Independencia_de_la_red">Independencia de la red<img alt="" src="https://mdn.mozillademos.org/files/12660/network-independent.svg" style="float: right; height: 40px; width: 38px;"></h2>
+
+<p>Las aplicaciones web modernas pueden funcionar cuando la red no es confiable, o incluso inexistente. Las ideas básicas detrás de la independencia de la red son:</p>
+
+<ul>
+ <li>Volver a visitar un sitio y obtener sus contenidos, incluso si no hay una conexión red disponible.</li>
+ <li>Explore cualquier tipo de contenido que el usuario haya visitado anteriormente al menos una vez, incluso en situaciones de poca conectividad.</li>
+ <li>Controlar lo que se muestra al usuario en situaciones en las que no hay conectividad.</li>
+</ul>
+
+<p>Esto se logra mediante una combinación de tecnologías: <a href="/en-US/docs/Web/API/Service_Worker_API">Service Workers</a> para controlar las solicitudes de página (por ejemplo, almacenarlas sin conexión), la <a href="/en-US/docs/Web/API/Cache">Cache API</a> para almacenar respuestas a solicitudes de red fuera de línea (muy útil para almacenar recursos del sitio) y tecnologías de almacenamiento de datos del lado del cliente como <a href="/en-US/docs/Web/API/Web_Storage_API">Web Storage</a> y <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a> para almacenar datos de la aplicación sin conexión.</p>
+
+<h2 id="Progresiva">Progresiva<img alt="" src="https://mdn.mozillademos.org/files/12662/progressive.svg" style="float: right; height: 40px; width: 38px;"></h2>
+
+<p>Las aplicaciones web modernas se pueden desarrollar para proporcionar una experiencia súper genial a los navegadores totalmente capaces, y una experiencia aceptable (aunque no tan brillante) para los navegadores menos capaces. Hemos estado haciendo esto durante años con las mejores prácticas como <a href="/en-US/docs/Glossary/Progressive_Enhancement">mejora progresiva</a>.</p>
+
+<h2 id="Reconectable">Reconectable<img alt="" src="https://mdn.mozillademos.org/files/12666/re-engageable.svg" style="float: right; height: 40px; width: 38px;"></h2>
+
+<p>Una de las principales ventajas de las plataformas nativas es la facilidad con la que los usuarios pueden volver a participar mediante actualizaciones y contenido nuevo, incluso cuando no están mirando la aplicación o utilizando sus dispositivos. Las aplicaciones web modernas ahora también pueden hacer esto, utilizando nuevas tecnologías como <a href="/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers">Service Workers</a> para controlar páginas, el <a href="/en-US/docs/Web/API/Push_API">Web Push API</a> para enviar actualizaciones directamente del servidor a la aplicación a través de un service worker, y la <a href="/en-US/docs/Web/API/Notifications_API">API de notificaciones</a> para generar notificaciones del sistema para ayudar a atraer a los usuarios cuando no están en el navegador.</p>
+
+<h2 id="Adaptable">Adaptable<img alt="" src="https://mdn.mozillademos.org/files/12650/responsive.svg" style="float: right; height: 40px; width: 38px;"></h2>
+
+<p>Las aplicaciones web adaptables usan tecnologías como consultas de media y viewport para asegurarse de que sus interfaces se ajusten a cualquier factor de forma: escritorio, móvil, tableta o lo que sea que venga después.</p>
+
+<h2 id="Seguro">Seguro<img alt="" src="https://mdn.mozillademos.org/files/12664/safe.svg" style="float: right; height: 47px; width: 38px;"></h2>
+
+<p>La plataforma web proporciona un mecanismo de entrega seguro que evita la intromisión y garantiza que el contenido no haya sido alterado, siempre que aproveche de HTTPS y desarrolle sus aplicaciones teniendo en cuenta la seguridad. Además, puede verificar la verdadera naturaleza de una AWP confirmando que está en la URL correcta, mientras que las aplicaciones en las tiendas de aplicaciones a menudo pueden parecer una cosa, pero ser otra (<a href="https://twitter.com/andreasbovens/status/926965095296651264">ejemplo</a>).</p>
diff --git a/files/es/conflicting/web/web_components/using_custom_elements/index.html b/files/es/conflicting/web/web_components/using_custom_elements/index.html
new file mode 100644
index 0000000000..9ca4c50786
--- /dev/null
+++ b/files/es/conflicting/web/web_components/using_custom_elements/index.html
@@ -0,0 +1,183 @@
+---
+title: Custom Elements
+slug: conflicting/Web/Web_Components/Using_custom_elements
+tags:
+  - Componentes Web
+  - Web Components
+  - custom elements
+translation_of: Web/Web_Components/Using_custom_elements
+translation_of_original: Web/Web_Components/Custom_Elements
+original_slug: Web/Web_Components/Custom_Elements
+---
+<p>Los <em>Custom Elements </em>son una característica que permite crear tus propios <a href="https://developer.mozilla.org/en-US/docs/Glossary/Element">elementos</a> HTML personalizados. Pueden tener un comportamiento personalizado y estilos CSS propios. Son una parte de los <a href="https://developer.mozilla.org/en-US/docs/Web/Web_Components">Web Components</a>, pero también pueden ser utilizados independientemente.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Los <em>Custom elements</em> sólo se han estabilizado recientemente, y partes de MDN todavía contienen información desactualizada de las APIs de los antiguos borradores de la especificación.</p>
+</div>
+
+<p>Puede no estar claro por qué se creó la nueva capacidad de elementos personalizados, ya que ya era posible crear una etiqueta como <code>&lt;mytag&gt;</code> y aplicarle estilo con CSS, luego utilizar scripts para darle comportamiento. Una ventaja que tienen los <em>custom elements</em> son las reacciones de ciclo de vida (<em>lifecycle reactions)</em>, que permiten asociar comportamiento a diferentes partes del nuevo "ciclo de vida" del elemento. Por ejemplo, se puede asociar un comportamiento concreto cuando un nuevo elemento se inserta en el DOM ("conectado"), y otro distinto cuando es eliminado del DOM ("desconectado"), o cuando sus atributos cambien.</p>
+
+<p>El habilitador de claves de los elementos personalizados v1 es el método {{domxref("CustomElementRegistry.define()")}}, el cual se puede utilizar para definir un nuevo elemento personalizado. El nuevo elemento utilizará la clase suministrada para cualquier instancia, en lugar del valor predeterminado  {{domxref("HTMLUnknownElement")}}.  Los elementos personalizados pueden basarse en un elemento nativo como <code>&lt;button&gt;</code>,  utilizando la sintaxis  <code>&lt;button is="my-button"&gt;</code>;  estos se llaman <em>elementos integrados personalizados.</em></p>
+
+<h2 id="Métodos_de_custom_element">Métodos de <em>custom element</em></h2>
+
+<p>Los <em>Custom elements</em> tienen los siguientes métodos que dictan su comportamiento:</p>
+
+<dl>
+ <dt>constructor()</dt>
+ <dd>Llamado cuando el elemento es creado o actualizado</dd>
+ <dt>connectedCallback()</dt>
+ <dd>Llamado cuando el elemento se es insertado en el documento, incluyéndose en un árbol shadow</dd>
+ <dt>disconnectedCallback()</dt>
+ <dd>Llamado cuando el elemento es eliminado de un documento</dd>
+ <dt>attributeChangedCallback(nombreDelAtributo, antiguoValor, nuevoValor, dominio)</dt>
+ <dd>Llamado cuando un atributo es cambiado, concatenado, eliminado o reemplazado en el elemento. Sólo llamado sobre <a href="#Atributos_Observados">atributos observados</a>.</dd>
+ <dt>adoptedCallback(antiguoDocumento, nuevoDocumento)</dt>
+ <dd>Llamado cuando un elemento es adoptado en otro nuevo documento</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Los <em>custom elements</em> necesitan usar la <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes">sintaxis de clase</a> introducida en las versiones modernas de JavaScript.</p>
+
+<p>Archivo HTML:</p>
+
+<pre class="brush: html">Si no aparece nada debajo, es que tu navegador no soporta aún los Custom Elements.
+&lt;x-product data-name="Ruby" data-img="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4621/ruby.png" data-url="http://example.com/1"&gt;&lt;/x-product&gt;
+&lt;x-product data-name="JavaScript" data-img="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4621/javascript.png" data-url="http://example.com/2"&gt;&lt;/x-product&gt;
+&lt;x-product data-name="Python" data-img="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4621/python.png" data-url="http://example.com/3"&gt;&lt;/x-product&gt;</pre>
+
+<p>Archivo JS:</p>
+
+<pre class="brush: js">// Declaración de un <em>custom element</em> que hereda de HTMLElement
+class XProduct extends HTMLElement {
+  constructor() {
+    // Siempre debe llamarse primero al constructor padre
+    super();
+
+    // Se crea el <em>shadow root</em>
+    var shadow = this.attachShadow({mode: 'open'});
+
+    // Se crea un elemnto img y se asignan sus atributos.
+    var img = document.createElement('img');
+    img.alt = this.getAttribute('data-name');
+    img.src = this.getAttribute('data-img');
+    img.width = '150';
+    img.height = '150';
+    img.className = 'product-img';
+
+    // Añadir la imagen al shadow root.
+    shadow.appendChild(img);
+
+    // Añadir un elemento de escucha a la imagen.
+    img.addEventListener('click', () =&gt; {
+      window.location = this.getAttribute('data-url');
+    });
+
+    // Crear un enlace al producto.
+    var link = document.createElement('a');
+    link.innerText = this.getAttribute('data-name');
+    link.href = this.getAttribute('data-url');
+    link.className = 'product-name';
+
+    // Añadir el enlace al shadow root.
+    shadow.appendChild(link);
+  }
+}
+
+// Definir el nuevo elemento.
+customElements.define('x-product', XProduct);
+</pre>
+
+<p>Archivo CSS:</p>
+
+<pre class="brush: css">body {
+  background: #F7F7F7;
+}
+
+x-product {
+  display: inline-block;
+  float: left;
+  margin: 0.5em;
+  border-radius: 3px;
+  background: #FFF;
+  box-shadow: 0 1px 3px rgba(0,0,0,0.25);
+  font-family: Helvetica, arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+}
+
+x-product::slotted(.product-img) {
+  cursor: pointer;
+  background: #FFF;
+  margin: 0.5em;
+}
+
+x-product::slotted(.product-name) {
+  display: block;
+  text-align: center;
+  text-decoration: none;
+  color: #08C;
+  border-top: 1px solid #EEE;
+  font-weight: bold;
+  padding: 0.75em 0;
+}
+</pre>
+
+<p>A continuación se muestra el ejemplo en vivo de lo anterior:</p>
+
+<p>{{ EmbedLiveSample('Example', '1500', '250', '', 'Web/Web_Components/Custom_Elements') }}</p>
+
+<h2 id="Atributos_Observados">Atributos Observados</h2>
+
+<p>Para ser notificado cuando un atributo cambia, se debe definir una lista de atributos observados al inicializar el elemento, poniendo un getter estático <code>observedAttributes</code> en la clase del elemento que devuelve un array de nombre de atributos.</p>
+
+<p>Archivo JS:</p>
+
+<pre class="brush: js">class HelloElement extends HTMLElement {
+  // Observar los cambios en el atributo 'name'.
+  static get observedAttributes() {return ['name']; }
+
+  // Responder a los cambios en el atributo.
+  attributeChangedCallback(attr, oldValue, newValue) {
+    if (attr == 'name') {
+      this.textContent = `Hello, ${newValue}`;
+    }
+  }
+}
+
+// Definir el nuevo elemento
+customElements.define('hello-element', HelloElement);
+</pre>
+
+<p>Archivo HTML:</p>
+
+<pre class="brush: html">&lt;hello-element name="Anita"&gt;&lt;/hello-element&gt;</pre>
+
+<p>A continuación está el ejemplo en vivo de lo anterior:</p>
+
+<p>{{ EmbedLiveSample('Observed_attributes', '750', '100', '', 'Web/Web_Components/Custom_Elements') }}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>Los <em>Custom Elements </em>están definido en la siguiente especificación:</p>
+
+<table class="spec-table standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td><a href="https://html.spec.whatwg.org/multipage/scripting.html#custom-elements">The HTML Standard: Custom elements</a></td>
+   <td>LS</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Recursos">Recursos</h2>
+
+<ul>
+ <li><a href="https://developers.google.com/web/fundamentals/primers/customelements/">Custom elements v1: reusable web components - Google Developers tutorial</a></li>
+</ul>
diff --git a/files/es/control_de_la_corrección_ortográfica_en_formularios_html/index.html b/files/es/control_de_la_corrección_ortográfica_en_formularios_html/index.html
deleted file mode 100644
index 0f409bb10e..0000000000
--- a/files/es/control_de_la_corrección_ortográfica_en_formularios_html/index.html
+++ /dev/null
@@ -1,73 +0,0 @@
----
-title: Control de la corrección ortográfica en formularios HTML
-slug: Control_de_la_corrección_ortográfica_en_formularios_HTML
-tags:
-  - Desarrollo_Web
-  - Gestión de configuración
-  - HTML
-  - Intermedio
-  - Todas_las_Categorías
-  - XHTML
-translation_of: Web/HTML/Global_attributes/spellcheck
-translation_of_original: Web/HTML/Controlling_spell_checking_in_HTML_forms
----
-<p><span class="seoSummary">{{ gecko_minversion_header("1.8.1") }} Firefox 2 incorpora un corrector ortográfico para las áreas y los campos de texto de los formularios web.</span> Usando la interfaz "about:config" el usuario puede activar o desactivar el corrector, además, puede indicar si desea o no habilitar la corrección ortográfica y si debe habilitarse para áreas y campos de texto o sólo en áreas de texto.</p>
-
-<p>Por defecto, se comprueban las áreas de texto y los documentos en <code>designMode</code>, pero los campos de texto no. Esto se debe a que sería una distracción para los usuarios si Firefox marca cosas como el ID de usuario y direcciones de correo electrónico como errores.</p>
-
-<p>Sin embargo, puede haber situaciones en las que este comportamiento no sea el más apropiado. Por ejemplo, si un área de texto va a ser usada para editar código HTML, u otro tipo de datos que no sean texto simple, el corrector ortográfico puede resultar un estorbo en vez de una ayuda. También puede haber casos en los que un sitio quiera recomendarle a Firefox que active la corrección ortográfica en un campo de texto específico; por ejemplo, para los cuadros de búsqueda y los campos de asunto del correo electrónico.</p>
-
-<p>Si un sitio web desea recomendar si usar o no la corrección ortográfica para un elemento <code>&lt;input type="text"&gt;</code> concreto, se puede usar el atributo <code>spellcheck</code>, especificando el valor <code>true</code> para recomendar la activación del corrector, o <code>false</code> para desaconsejarla.</p>
-
-<p>Ten en cuenta que la recomendación del sitio puede ser ignorado si el usuario ha desactivado la corrección ortográfica en su totalidad fijando <code>layout.spellcheckDefault</code> a "0". Si <code>layout.spellcheckDefault</code> tiene cualquier otro valor, el recomendaciones se tienen en cuenta.</p>
-
-<p>Por ejemplo, el siguiente código HTML recomienda el uso del corrector en un campo de texto simple:</p>
-
-<pre class="eval"><span class="nowiki">&lt;input type="text" size="50" spellcheck="true"&gt;</span>
-</pre>
-
-<p>Del mismo modo, se puede desaconsejar la corrección en un área de texto con un código HTML como este:</p>
-
-<pre class="eval"><span class="nowiki">&lt;textarea spellcheck="false"&gt;&lt;/textarea&gt;</span>
-</pre>
-
-<p>Se puede controlar un documento en <code>designMode</code> (habitualmente usado para la edición de texto enriquecido), poniendo el atributo <code>spellcheck</code> en la etiqueta <code>&lt;body&gt;</code> de los documentos. <span class="comment">N.T. Esto del designMode no me gusta</span></p>
-
-<p>También se puede usar el atributo <code>spellcheck</code> en otros elementos, como en los elementos <code>&lt;span&gt;</code> o <code>&lt;div&gt;</code>, en tal caso, cualquier elemento <code>&lt;input&gt;</code> contenido por estos elementos heredará ese atributo. Los elementos <code>&lt;input&gt;</code> que no tengan un atributo <code>spellcheck</code> lo heredarán de sus padres, y si estos tampoco lo tienen, se aplicará la configuración por defecto.</p>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: html">&lt;div spellcheck="true"&gt;
-  &lt;label&gt;Escribe una oración: &lt;/label&gt;&lt;input type="text" size="50"&gt;
-  &lt;br&gt;
-  &lt;label&gt;Escriba otra: &lt;/label&gt;&lt;input type="text" size="50"&gt;
-&lt;/div&gt;
-&lt;br&gt;
-&lt;label&gt;Escriba una tercera: &lt;/label&gt;&lt;input type="text" size="50"&gt;
-</pre>
-
-<p>En este fragmento de código HTML, los dos primeros campos de texto se comprueban mientras que el tercero no.</p>
-
-<p id="lang">{{ h1_gecko_minversion("Controlar el idioma del corrector ortográfico", "9.0") }}</p>
-
-<p>A partir de Gecko 9.0 {{ geckoRelease("9.0") }}, el corrector ortográfico utiliza un elemento {{ HTMLElement("input") }} con atributo {{ htmlattrxref("lang", "input") }} para determinar el idioma predeterminado del corrector ortográfico. Si {{ HTMLElement("input") }} no tiene atributo <code>lang</code>, el atributo se busca en cada elemento padre sucesivamente y hacia arriba, hacia el nodo raíz hasta encontrar uno.</p>
-
-<p>De esta manera, si un usuario tiene a la vez instalados los diccionarios Frances e Ingles, y un elemento editable tiene <code>lang="en"</code>, el diccionario Inglés se utilizará automáticamente para ese elemento.</p>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: html">&lt;html lang="en"&gt;
-&lt;body&gt;
-  &lt;textarea&gt;&lt;/textarea&gt;
-  &lt;textarea lang="fr"&gt;&lt;/textarea&gt;
-  &lt;div lang="ru"&gt;
-    &lt;textarea&gt;&lt;/textarea&gt;
-  &lt;/div&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
---
-
-<p>En este fragmento de código HTML, el primer {{ HTMLElement("textarea") }} será revisado en Inglés, el segundo en Francés, y el tercero en Ruso.
-
-</p><p>Si un elemento especifica un idioma, y el usuario no tiene instalado el diccionario para ese idioma, corrector ortográfico estrá desactivado por defecto, aunque el usuario puede elegir activarlo de forma manual.</p>
diff --git a/files/es/creacion_de_plugins_opensearch_para_firefox/index.html b/files/es/creacion_de_plugins_opensearch_para_firefox/index.html
deleted file mode 100644
index 12c71b6c03..0000000000
--- a/files/es/creacion_de_plugins_opensearch_para_firefox/index.html
+++ /dev/null
@@ -1,154 +0,0 @@
----
-title: Creacion de plugins OpenSearch para Firefox
-slug: Creacion_de_plugins_OpenSearch_para_Firefox
-tags:
-  - Agregados
-  - Complementos
-  - OpenSearch
-  - Plugins
-  - Plugins_de_búsqueda
-  - para_revisar
-translation_of: Web/OpenSearch
----
-<p> </p>
-<h2 id="OpenSearch" name="OpenSearch">OpenSearch</h2>
-<p><a href="es/Firefox_2">Firefox 2</a> admite el formato de descripción <a class="external" href="http://opensearch.org/">OpenSearch</a> para complementos (<em>plugins</em>) de búsqueda. Aquellos complementos que usen <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1#OpenSearch_description_document">la sintaxis OpenSearch</a> son compatibles con Firefox e Internet Explorer 7. Por ello es el formato recomendado para cualquier nuevo desarrollo.</p>
-<p>Firefox admite además capacidades de búsqueda adicionales no incluidas en <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1#OpenSearch_description_document">la sintaxis de descripción OpenSearch</a>, tales como las "sugerencias de búsqueda" y el elemento <code>SearchForm</code>. Este artículo se centrará en la creación de complementos compatibles con OpenSearch que empleen estas capacidades adicionales de Firefox.</p>
-<p>Además, los ficheros de descripción OpenSearch pueden ser anunciados dentro de una página HTML de forma que puedan ser descubiertos automáticamente por el navegador (esto se describe en <a href="#Autodiscovery_of_search_plugins">Detección automática de motores de búsqueda</a>.</p>
-<p>Por último, estos complementos, pueden ser instalados mediante código tal y como se describe en <a href="es/A%c3%b1adir_motores_de_b%c3%basqueda_desde_p%c3%a1ginas_web">Añadir motores de búsqueda desde páginas web</a>.</p>
-<h2 id="El_fichero_de_descripci.C3.B3n_OpenSearch" name="El_fichero_de_descripci.C3.B3n_OpenSearch">El fichero de descripción OpenSearch</h2>
-<p>El fichero XML que describe un motor de búsqueda es bastante sencillo, tal y como se puede ver en la plantilla básica que se muestra más abajo. Las secciones en negrita deben ser personalizadas basándonos en las necesidades particulares del motor para el que estamos escribiendo nuestro complemento.</p>
-<pre class="eval">&lt;OpenSearchDescription xmlns="<span class="nowiki">http://a9.com/-/spec/opensearch/1.1/</span>"
-                       xmlns:moz="<span class="nowiki">http://www.mozilla.org/2006/browser/search/</span>"&gt;
-&lt;ShortName&gt;<strong>engineName</strong>&lt;/ShortName&gt;
-&lt;Description&gt;<strong>engineDescription</strong>&lt;/Description&gt;
-&lt;InputEncoding&gt;<strong>inputEncoding</strong>&lt;/InputEncoding&gt;
-&lt;Image width="16" height="16"&gt;data:image/x-icon;base64,<strong>imageData</strong>&lt;/Image&gt;
-&lt;Url type="text/html" method="<strong>method</strong>" template="<strong>searchURL</strong>"&gt;
-  &lt;Param name="<strong>paramName1</strong>" value="<strong>paramValue1</strong>"/&gt;
-  ...
-  &lt;Param name="<strong>paramNameN</strong>" value="<strong>paramValueN</strong>"/&gt;
-&lt;/Url&gt;
-&lt;Url type="application/x-suggestions+json" template="<strong>suggestionURL</strong>"/&gt;
-&lt;moz:SearchForm&gt;<strong>searchFormURL</strong>&lt;/moz:SearchForm&gt;
-&lt;/OpenSearchDescription&gt;
-</pre>
-<dl>
- <dt>
-  <strong>ShortName</strong></dt>
- <dd>
-  Nombre corto para el motor de búsqueda.</dd>
-</dl>
-<dl>
- <dt>
-  <strong>Description</strong></dt>
- <dd>
-  Descripción del motor de búsqueda.</dd>
-</dl>
-<dl>
- <dt>
-  <strong>InputEncoding</strong></dt>
- <dd>
-  Codificación de caracteres a emplear en los datos que se envían al motor de búsqueda. Por ejemplo, "UTF-8".</dd>
-</dl>
-<dl>
- <dt>
-  <strong>Image</strong></dt>
- <dd>
-  Icono de 16x16 codificado en Base-64 que represente al motor de búsqueda. Puedes encontrar una utilidad para generar estos datos en: <a class="external" href="http://software.hixie.ch/utilities/cgi/data/data">The data: URI kitchen</a>.</dd>
-</dl>
-<dl>
- <dt>
-  <strong>Url</strong></dt>
- <dd>
-  Describe la(s) URL(s) a emplear para la búsqueda. El atributo <code>method</code> indica si se debe emplear una petición <code>GET</code> o <code>POST</code> para obtener los resultados.</dd>
-</dl>
-<dl>
- <dd>
-  <div class="note">
-   <strong>Nota:</strong> Internet Explorer 7 no admite peticiones <code>POST</code>.</div>
- </dd>
-</dl>
-<dl>
- <dd>
-  Firefox admite dos tipos de URL en el campo <code>type</code>:</dd>
-</dl>
-<ul>
- <li><code>type="text/html"</code> se usa al especificar la URL a donde se va a enviar la petición de búsqueda.</li>
- <li><code>type="application/x-suggestions+json"</code> se usa al especificar la URL de donde se van a obtener las sugerencias de búsqueda.</li>
-</ul>
-<dl>
- <dd>
-  El atributo <code>template</code> indica la forma en que se construirá la URL para la consulta. Dentro de este atributo se pueden introducir plantillas que se expanden de forma dinámica; la más habitual es <code>{searchTerms}</code>, la cual se expande a los términos de búsqueda introducidos por el usuario en la barra de búsquedas. En <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1/Draft_3#OpenSearch_1.1_parameters">OpenSearch 1.1 parameters</a> se describen los otros tipos admitidos.</dd>
-</dl>
-<dl>
- <dd>
-  Para consultas que devuelven sugerencias de búsqueda, la URL descrita en <code>template</code> se usa para obtener una lista de sugerencias en el formato JSON (JavaScript Object Notation). Para saber más sobre como incorporar sugerencias de búsqueda en el lado del servidor, ver <a href="es/Permitir_sugerencias_en_los_plugins_de_b%c3%basqueda">Permitir sugerencias en los plugins de búsqueda</a>.</dd>
-</dl>
-<p><img alt="Image:SearchSuggestionSample.png"></p>
-<dl>
- <dt>
-  <strong>Param</strong></dt>
- <dd>
-  Los parámetros que es necesario suministrar junto con la consulta, en la forma de pares clave/valor. En los valores es posible emplear las plantillas dinámicas presentadas anteriormente; por ejemplo, se puede usar <code>{searchTerms}</code> para insertar los términos de búsqueda que el usuario introdujo en la barra de búsquedas.</dd>
-</dl>
-<dl>
- <dd>
-  <div class="note">
-   <strong>Nota:</strong> Internet Explorer 7 no admite este elemento.</div>
- </dd>
-</dl>
-<dl>
- <dt>
-  <strong>SearchForm</strong></dt>
- <dd>
-  La URL donde se encuentra la página de búsquedas del sitio al que hace referencia el complemento que estamos desarrollando. Esto permite al usuario acceder directamente al sitio web en cuestión.</dd>
- <dd>
-  <div class="note">
-   <strong>Nota:</strong> Dado que este elemento es específico de Firefox y no forma parte de la especificación OpenSearch, en el ejemplo anterior, usamos el prefijo "<code>moz:</code>" en el espacio de nombres XML para asegurarnos que otros agentes de usuario que no admiten este elemento puedan ignoralo de forma segura.</div>
- </dd>
-</dl>
-<h2 id="Detecci.C3.B3n_autom.C3.A1tica_de_complementos_de_b.C3.BAsqueda" name="Detecci.C3.B3n_autom.C3.A1tica_de_complementos_de_b.C3.BAsqueda">Detección automática de complementos de búsqueda</h2>
-<p>Un sitio web que ofrezca un complemento de búsqueda puede anunciarlo, de forma que los usuarios de Firefox puedan descargarlo e instalarlo fácilmente.</p>
-<p>Para incorporar la detección automática, sólo es necesario añadir una línea a la sección <code>&lt;head&gt;</code> de la página:</p>
-<pre class="eval">&lt;link rel="search" type="application/opensearchdescription+xml" title="<em>searchTitle</em>" href="<em>pluginURL</em>"&gt;
-</pre>
-<p>Sustituiremos los elementos en itálica tal y como se explica a continuación:</p>
-<dl>
- <dt>
-  <strong>searchTitle</strong></dt>
- <dd>
-  El título de la búsqueda que se va a llevar a cabo; por ejemplo, "Buscar en MDC" o "Búsqueda en Google". Este valor debe coincidir con el <code>ShortName</code> de nuestro complemento.</dd>
-</dl>
-<dl>
- <dt>
-  <strong>pluginURL</strong></dt>
- <dd>
-  La URL que debe emplear el navegador para descargar el fichero XML con la descripción del complemento.</dd>
-</dl>
-<p>Si tu sitio ofrece múltiples complementos de búsqueda también es posible que el navegador los descubra de forma automática; basta con repetir el <code>link</code> las veces que sea necesario. Por ejemplo:</p>
-<pre class="eval">&lt;link rel="search" type="application/opensearchdescription+xml" title="MiSitio: Por Autor" href="<a class="external" href="http://www.misitio.com/autores.xml" rel="freelink">http://www.misitio.com/autores.xml</a>"&gt;
-&lt;link rel="search" type="application/opensearchdescription+xml" title="MiSitio: Por Título" href="<a class="external" href="http://www.misitio.com/titulos.xml" rel="freelink">http://www.misitio.com/titulos.xml</a>"&gt;
-</pre>
-<p>De esta forma podemos ofrecer complementos independientes para buscar tanto por autor como por título.</p>
-<h2 id="Resoluci.C3.B3n_de_problemas" name="Resoluci.C3.B3n_de_problemas">Resolución de problemas</h2>
-<p>Si hay algún error en el fichero XML que describe el complemento, seguramente habrá problemas al añadir en Firefox 2 un complemento descubierto automáticamente. El mensaje de error puede no ser de mucha ayuda, así que los siguientes consejos pueden ayudar a encontrar la causa del problema.</p>
-<ul>
- <li>Asegúrate de que el documento XML de tu complemento está bien formado. Puedes comprobarlo cargando el fichero directamente en Firefox. Los <em>Ampersands</em> en la plantilla de la URL deben ser escapadas con &amp;amp; y las etiquetas (<em>tags</em>) deben ser cerradas con una barra (<code>/</code>) al final o con la correspondiente etiqueta de cierre.</li>
- <li>El atributo <code>xmlns</code> es importante. Sin él, puedes obtener un mensaje de error indicando que "Firefox no pudo descargar el motor de búsqueda desde: (URL)".</li>
- <li>Ten en cuente que <strong>debes</strong> incluir una URL del tipo <code>text/html</code> — los complmentos que sólo incluyan URLs del tipo Atom o <a href="es/RSS">RSS</a> (lo cual es válido, pero Firefox no admite) producirán el error "no pudo descargar el motor de búsqueda".</li>
- <li>Los <em>favicons</em> obtenidos remotamente no deben ser mayores de 10KB (ver {{ Bug(361923) }}).</li>
-</ul>
-<p>Adicionalmente, el servicio de complementos de búsqueda suministra un mecanismo de registro (<em>logging</em>) que puede ser de utilidad a los desarrolladores de complementos. Usa <em>about:config</em> para establecer la preferencia '<code>browser.search.log</code>' al valor <code>true</code>. La información de registro aparecerá en la consola de errores de Firefox (Tools-&gt;Error Console) cuando se añada un complemento de búsqueda.</p>
-<h2 id="Material_de_referencia" name="Material_de_referencia">Material de referencia</h2>
-<ul>
- <li><a class="external" href="http://opensearch.org/">OpenSearch - Documentación oficial</a></li>
- <li>Technorati.com tiene un ejemplo de fichero XML en <a class="external" href="http://technorati.com/osd.xml" rel="freelink">http://technorati.com/osd.xml</a></li>
- <li>Más información sobre problemas en la detección automática en bugzilla {{ Bug(340208) }}</li>
- <li>Wikipedia - <a class="external" href="http://es.wikipedia.org/wiki/Data:_URL"><code>data:</code> URL</a></li>
- <li><a class="external" href="http://searchy.protecus.de/">Searchy</a> - <a class="external" href="http://searchy.protecus.de/en/add2.php">Crea</a> tu propio complemento o usa <a class="external" href="http://searchy.protecus.de/en/searchbox-add-ons.php">la lista de complementos</a>.</li>
- <li><a class="external" href="http://www.searchplugins.net">searchplugins.net</a> - Crea complementos OpenSearch plugins para ser usados con Firefox 2. <a class="external" href="http://www.searchplugins.net/pluginlist.aspx">Lista de complementos de búsqueda</a></li>
- <li><a class="external" href="http://ready.to/search/en/">Ready2Search</a> - Crea complementos OpenSearch. <a class="external" href="http://ready.to/search/make/en_make_plugin.htm">Búsquedas personalizadas a través de Ready2Search</a></li>
-</ul>
-<p><span class="comment">Interwiki link</span></p>
-<p>{{ languages( { "ca": "ca/Creaci\u00f3_de_connectors_OpenSearch_per_al_Firefox", "en": "en/Creating_OpenSearch_plugins_for_Firefox", "fr": "fr/Cr\u00e9ation_de_plugins_OpenSearch_pour_Firefox", "ja": "ja/Creating_OpenSearch_plugins_for_Firefox", "pl": "pl/Tworzenie_wtyczek_OpenSearch_dla_Firefoksa", "pt": "pt/Criando_plugins_OpenSearch_para_o_Firefox" } ) }}</p>
diff --git a/files/es/creación_de_componentes_xpcom/interior_del_componente/index.html b/files/es/creación_de_componentes_xpcom/interior_del_componente/index.html
deleted file mode 100644
index e69797653b..0000000000
--- a/files/es/creación_de_componentes_xpcom/interior_del_componente/index.html
+++ /dev/null
@@ -1,216 +0,0 @@
----
-title: Interior del Componente
-slug: Creación_de_Componentes_XPCOM/Interior_del_Componente
-tags:
-  - Todas_las_Categorías
-  - XPCOM
----
-<p></p><div class="prevnext" style="text-align: right;">
-    <p><a href="/es/docs/Creación_de_Componentes_XPCOM:Using_XPCOM_Components" style="float: left;">« Anterior</a><a href="/es/docs/Creación_de_Componentes_XPCOM:Creating_the_Component_Code">Siguiente  »</a></p>
-</div> En el capítulo anterior describimos los componentes desde una perspectiva de un cliente de los componentes XPCOM, en este capútulo abordamos los componentes desde la perspectiva del desarrollador del programa. Léelo para ver como se implementan generalmente los componentes en XPCOM, o puedes brincarte al siguiente capítulo, donde el tutorial del componente WebLock te lleva paso a paso através del proceso de creación del componente. <span class="comment">XXX mediawiki...</span><span class="comment">XXX sucks</span><p></p>
-
-<h3 id="Creaci.C3.B3n_de_Componentes_en_C.2B.2B" name="Creaci.C3.B3n_de_Componentes_en_C.2B.2B">Creación de Componentes en C++</h3>
-
-<p>Empecemos por examinar como se escriben en C++ los componentes XPCOM. El tipo más común de componente es el escrito en C++ y compilado en una biblioteca compartida (una <abbr title="Dynamic Link Library">DLL</abbr> en un sistema Windows o una <abbr title="Dynamic Shared Object">DSO</abbr> en Unix).</p>
-
-<p>La imagen de abajo muestra la relación básica entre una biblioteca que contiene la implementación del código del componente que escribiste y la plataforma XPCOM en sí misma. En este diagrama, la superficie más externa del módulo es la biblioteca compartida en la que se define un componente.</p>
-
-<p><span id="Un_Componente_en_la_Plataforma_XPCOM"><a id="Un_Componente_en_la_Plataforma_XPCOM"></a><strong>Un Componente en la Plataforma XPCOM</strong></span></p>
-
-<p><img alt="Image:component-internals-framework.png"></p>
-
-<p>Cuando construyes un componente o un módulo y lo compilas dentro de una biblioteca, debe exportar un método llamado <code>NSGetModule</code>. Esta función <code>NSGetModule</code> es el punto de acceso a la biblioteca. Es llamado durante el registro y el desregistro del componente y cuando XPCOM quiere descubrir qué interfaces o clases implementa el módulo/biblioteca. En este capítulo abordaremos todo este proceso.</p>
-
-<p>Como ilustra <a href="#Un_Componente_en_la_Plataforma_XPCOM">Un Componente en la Plataforma XPCOM</a>, además del punto de acceso <code>NSGetModule</code>, están las interfaces <code>nsIModule</code> y <code>nsIFactory</code> que controlan la creación actual del componente y también las partes XPCOM glue y cadenas, que discutiremos un poco a detalle en la siguiente sección (Ve <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Interior_del_Componente#XPCOM_Glue">XPCOM Glue</a>). Estas nos darán utilidades para desarrollo fácil más adelante como son punteros inteligentes, soporte de módulos genéricos e implementaciones simples de cadenas. La parte más larga y posiblemente la más compleja de un componente es el código específico del componente en sí mismo.</p>
-
-<div class="side-note">
-<p><span id="%C2%BFPero_D%C3%B3nde_Est%C3%A1n_los_Componentes?"><a id="%C2%BFPero_D%C3%B3nde_Est%C3%A1n_los_Componentes?"></a><strong>¿Pero Dónde Están los Componentes?</strong></span></p>
-
-<p>Los componentes residen en módulos y esos módulos son definidos en bibliotecas compartidas típicamente situadas en el directorio<em>components</em> de una aplicación XPCOM.</p>
-
-<p>Un conjunto de bibliotecas son almacenadas por defecto en este directorio components es lo que hay en una típica instalación de Gecko, dando la funcionalidad que consiste en trabajo en red, layout, composición, una interfaz de usuario multiplataforma y otros.</p>
-
-<p>Otra vista aún más básica de esta relación de componentes a archivos e interfaces que los definen se muestra en <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Creaci%c3%b3n_del_C%c3%b3digo_del_Componente">Vista de Papel Cebolla de la creación del Componente XPCOM</a> en el próximo capítulo. El componente es una abstracción situada entre el módulo actual en el que se implementa y los objetos que el código de su factoría crea para que uso de los clientes.</p>
-</div>
-
-<h3 id="Inicializaci.C3.B3n_de_XPCOM" name="Inicializaci.C3.B3n_de_XPCOM">Inicialización de XPCOM</h3>
-
-<p>Para entender porqué y cuándo tu biblioteca de componentes es llamada, es importante entender el proceso de inicialización de XPCOM. Cuando inicia una aplicación, la aplicación puede<em>inicializar</em> XPCOM. La secuencia de eventos que lanza esta inicialización de XPCOM pueden ser lanzados por una ccioón del usuario o por el inicio de la aplicación en sí misma. Un buscador web que tiene embebido Gecko, por ejemplo, puede inicializar XPCOM al inicio atravéz de APIs embebidas. Otra aplicación puede este inicio hasta que XPCOM se necesite por primera vez. En otro caso, la secuencia de inicialización dentro de XPCOM es la misma.</p>
-
-<p>XPCOM inicia cuando la aplicación hace una llamada para inicializarlo. Los parámetros pasados a esta llamada de inicialización te permiten configurar algunos aspectos de XPCOM, incluyendo la personalización de la ubicación de directorios específicos. El propósito principal del API en este punto es cambiar que directorio<em>components</em> inspecciona cuando busca componentes XPCOM. Así es como se usa el API, por ejemplo, en el<em>Gecko Runtime Environment</em> (GRE).</p>
-
-<div class="side-note">
-<p><span id="Inicializaci%C3%B3n_de_XPCOM"><a id="Inicializaci%C3%B3n_de_XPCOM"></a><strong>Inicialización de XPCOM</strong></span></p>
-
-<p>Los seis pasos básicos para arrancar XPCOM son los siguientes:</p>
-
-<ol>
- <li>La aplicación inicia XPCOM.</li>
- <li>XPCOM envía una notificación que inicia el arranque.</li>
- <li>XPCOM encuentra y procesa el<em>manifiesto del componente</em> (ve <a href="#Manifiestos_de_Componentes">Manifiestos de Componentes</a> abajo).</li>
- <li>Si hay nuevos componentes, XPCOM los registra:
-  <ol>
-   <li>XPCOM llama el arranque del autoregistro.</li>
-   <li>XPCOM registra los nuevos componentes.</li>
-   <li>XPCOM llama el fin del autoregistro.</li>
-  </ol>
- </li>
- <li>Arranque completo de XPCOM: XPCOM notifica que ha iniciado.</li>
-</ol>
-
-<p>Los manifiestos de Componentes y bibliotecas de tipos son descritos en la siguiente sección, <a href="#Registro_de_Manifiestos_de_XPCOM">Registro de Manifiestos de XPCOM</a>.</p>
-</div>
-
-<h4 id="Registro_de_Manifiestos_de_XPCOM" name="Registro_de_Manifiestos_de_XPCOM">Registro de Manifiestos de XPCOM</h4>
-
-<p>XPCOM usa archivos especiales llamados manifiestos para cambiar y guardar información acerca de los componentes en el sistema local. Hay dos tipos de manifiestos que usa XPCOM para cambiar componentes:</p>
-
-<h5 id="Manifiestos_de_Componente" name="Manifiestos_de_Componente">Manifiestos de Componente</h5>
-
-<p>Cuando XPCOM inicia por primera vez, busca el<em>manifiesto de componentes</em> que es un archivo que lista todos los componentes registrados y guarda detalles de lo que exactamente puede hacer cada componente. XPCOM usa el manifiesto de componentes para determinar que componentes han sido sobreescritos. Empezando en Mozilla 1.2, este archivo es llamado <code>compreg.dat</code> y existe en el directorio<em>components</em>, pero hay esfuerzos por moverlo fuera de esta ubicación a una ubicación menos centrada en la aplicación y más centrada en el usuario. Cualquier aplicación bassada en Gecko puede escoger ponerlo en otro lado. XPCOM lee este archivo dentro de una base de datos en memoria.</p>
-
-<div class="side-note">
-<p><span id="Manifiestos_de_Componentes"><a id="Manifiestos_de_Componentes"></a><strong>Manifiestos de Componentes</strong></span></p>
-
-<p>El manifiesto de componente es una correlación de archivos a componentes y de componentes a clases. Especifica la siguiente información:</p>
-
-<ul>
- <li>Ubicación en disco de los componentes registrados con el tamaño de archivo</li>
- <li>ID de Clase relacionado a la Ubicación.</li>
- <li>Contract ID relacionado al ID de Clase.</li>
-</ul>
-
-<p>El manifiesto del componente relaciona archivos de componentes a identificadores únicos para las implementaciones específicas (IDs de Clase), que en su momento son relacionados a identificadores de componente más generales (contract IDs).</p>
-</div>
-
-<h5 id="Manifiestos_de_Bibliotecas_de_Tipos" name="Manifiestos_de_Bibliotecas_de_Tipos">Manifiestos de Bibliotecas de Tipos</h5>
-
-<p>Otro archivo importante que lee XPCOM es el<em>manifiesto de bibliotecas de tipos</em>. Este archivo tambien se localiza en el directorio<em>components</em> y se llama <code>xpti.dat</code>. Incluye la ubicación y direcciones de búsqueda de todas las bibliotecas de tipos en el sistema. este archivo también lista todas las interfaces conocidas y enlaces a los archivos de bibliotecas de tipos que definen estas estructuras de interfaces. Estos archivos de bibliotecas de tipos son el core para que XPCOM pueda ser script y de la arquitectura de componentes binarios de XPCOM.</p>
-
-<div class="side-note">
-<p><span id="Manifiestos_de_Bibliotecas_de_Tipos"><a id="Manifiestos_de_Bibliotecas_de_Tipos"></a><strong>Manifiestos de Bibliotecas de Tipos</strong></span> Los manifiestos de bibliotecas de tipos contienen la siguiente información:</p>
-
-<ul>
- <li>ubicación de todos los archivos de bibliotecas de tipos</li>
- <li>correlación de todas las interfaces conocidas y bibliotecas de tipos donde están definidas estas estructuras.</li>
-</ul>
-</div>
-
-<p>Using the data in these two manifests, XPCOM knows exactly which component libraries have been installed and what implementations go with which interfaces. Additionally, it relates the components to the type libraries in which the binary representations of the interfaces they support are defined.</p>
-
-<p>The next section describes how to hook into the XPCOM startup and registration process and make the data about your component available in these manifests, so that your component will be found and registered at startup.</p>
-
-<h4 id="M.C3.A9todos_de_Registro_en_XPCOM" name="M.C3.A9todos_de_Registro_en_XPCOM">Métodos de Registro en XPCOM</h4>
-
-<div class="side-note">
-<p><span id="What_Is_XPCOM_Registration?"><a id="What_Is_XPCOM_Registration?"></a><strong>What Is XPCOM Registration?</strong></span></p>
-
-<p>In a nutshell, registration is the process that makes XPCOM aware of your component(s). As this section and the next describe, you can register your component explicitly during installation, or with the <code>regxpcom</code> program, or you can use the autoregistration methods in the Service Manager to find and register components in a specified components directory:</p>
-
-<ul>
- <li>XPInstall APIs</li>
- <li><code>regxpcom</code> command-line tool</li>
- <li><code>nsIComponentRegistrar</code> APIs from Service Manager</li>
-</ul>
-
-<p>The registration process is fairly involved. This section introduces it in terms of XPCOM initialization, and the next chapter describes what you have to do in your component code to register your component with XPCOM.</p>
-</div>
-
-<p>Once the manifest files are read in, XPCOM checks to see if there are any components that need to be registered. There are two supported ways to go about registering your XPCOM component. The first is to use<em>XPInstall</em>, which is an installation technology that may or may not come with a Gecko application and provides interfaces for registering your component during installation. Another, more explicit way to register your component is to run the application <code>regxpcom</code>, which is built as part of Mozilla and is also available in the Gecko SDK. <code>regxpcom</code> registers your component in the default component registry.</p>
-
-<p>A Gecko embedding application may also provide its own way of registering XPCOM components using the interface that is in fact used by both XPInstall and <code>regxpcom</code>, <code>nsIComponentRegistrar</code>. An application, for example, could provide a "registration-less" component directory whose components are automatically registered at startup and unregistered at shutdown. Component discovery does not currently happen automatically in non-debug builds of Gecko, however.</p>
-
-<p>When the registration process begins, XPCOM broadcasts to all registered observers a notification that says XPCOM has begun the registration of new components. After all components are registered, another notification is fired saying that XPCOM is done with the registration step. The <code>nsIObserver</code> interface that handles this notification is discussed in <a href="es/Creating_XPCOM_Components/Starting_WebLock">Starting WebLock</a>.</p>
-
-<p>Once registration is complete and the notifications have fired, XPCOM is ready to be used by the application. If XPCOM registered your component, then it will be available to other parts of the XPCOM system. The <a href="#XPCOM_Initialization">XPCOM Initialization</a> section in this chapter describes registration in more detail.</p>
-
-<h4 id="Autoregistro" name="Autoregistro">Autoregistro</h4>
-
-<p>The term<em>autoregistration</em> is sometimes used synonymously with registration in XPCOM. In the <a href="#What_Is_XPCOM_Registration?">What Is XPCOM Registration?</a> note, we describe the three ways you can register components with XPCOM. Sometimes, applications use the <code>nsIComponentRegistrar</code> interface and create their own code for watching a particular directory and registering new components that are added there, which is what's often referred to as<em>autoregistration</em>. You should always know what the installation and registration requirements are for the applications that will be using your component.</p>
-
-<h4 id="El_Proceso_de_Paro" name="El_Proceso_de_Paro">El Proceso de Paro</h4>
-
-<p>When the application is ready to shutdown XPCOM, it calls <code>NS_ShutdownXPCOM</code>. When that method is called, the following sequence of events occurs:</p>
-
-<ol>
- <li>XPCOM fires a shutdown notification to all registered observers.</li>
- <li>XPCOM closes down the Component Manager, the Service Manager and associated services.</li>
- <li>XPCOM frees all global services.</li>
- <li>NS_ShutdownXPCOM returns and the application may exit normally.</li>
-</ol>
-
-<div class="side-note">
-<p><span id="The_Unstoppable_Shutdown"><a id="The_Unstoppable_Shutdown"></a><strong>The Unstoppable Shutdown</strong></span></p>
-
-<p>Note that shutdown observation is unstoppable. In other words, the event you observe cannot be used to implement something like a "Are you sure you want to Quit?" dialog. Rather, the shutdown event gives the component or embedding application a last chance to clean up any leftovers before they are released. In order to support something like an "Are you sure you want to quit" dialog, the application needs to provide a higher-level event (e.g., <code>startShutdown()</code>) which allows for cancellation.</p>
-
-<p>Note also that XPCOM services may deny you access once you have received the shutdown notification. It is possible that XPCOM will return an error if you access the <code>nsIServiceManager</code> at that point, for example, so you may have to keep a reference-counted pointer to the service you are interested in using during this notification.</p>
-</div>
-
-<h4 id="Component_Loaders" name="Component_Loaders">Component Loaders</h4>
-
-<p>Components can be written in many languages. So far this book has been focusing on "native components," shared libraries exporting a <code>NSGetModule</code> symbol. But if there is a<em>component loader</em> for Javascript installed, then you can also write a JavaScript component.</p>
-
-<p>To register, unregister, load and manage various component types, XPCOM abstracts the interface between the XPCOM component and XPCOM with the Component Loader. This loader is responsible for initialization, loading, unloading, and supporting the <code>nsIModule</code> interface on behalf of each component. It is the Component Loader's responsibility to provide scriptable component support.</p>
-
-<p>When building a "native" component, the component loader looks for an exported symbol from the components shared library. "Native" here includes any language that can generate a platform native dynamically loaded library. Scripting languages and other "non-native" languages usually have no way to build native libraries. In order to have "non-native" XPCOM components work, XPCOM must have a special component loader which knows how to deal with these type of components.</p>
-
-<p>XPConnect, for example, provides a component loader that makes the various types, including the interfaces and their parameters, available to JavaScript. Each language supported by XPCOM must have a component loader.</p>
-
-<h4 id="Tres_Partes_de_una_Biblioteca_de_Componentes_XPCOM" name="Tres_Partes_de_una_Biblioteca_de_Componentes_XPCOM">Tres Partes de una Biblioteca de Componentes XPCOM</h4>
-
-<p>XPCOM is like an onion<span class="comment">or a parfait! Everybody likes parfaits</span>. XPCOM components have at least three layers. From the innermost and moving outward these layers include:</p>
-
-<ul>
- <li>The core XPCOM object</li>
- <li>The factory code</li>
- <li>The module code</li>
-</ul>
-
-<p>The core XPCOM object is the object that will implement the functionality you need. For example, this is the object that may start a network download and implement interfaces that will listen to the progress. Or the object may provide a new content type handler. Whatever it does, this object is at the core of the XPCOM component, and the other layers are supporting it, plugging it into the XPCOM system. A single library may have many of these core objects.</p>
-
-<p>One layer above the core object is the factory code. The factory object provides a basic abstraction of the core XPCOM object. <a href="es/Creating_XPCOM_Components/An_Overview_of_XPCOM">An Overview of XPCOM</a> discussed the factory design pattern that's used in a factory object. At this layer of the XPCOM Component Library, the factory objects are factories for the core XPCOM objects of the layer below.</p>
-
-<p>One more layer outward is the module code. The module interface provides yet another abstraction - this time of the factories - and allows for multiple factory objects. From the outside of the component library, there is only the single entry point, <code>NSGetModule()</code>. This point of entry may fan out to any number of factories, and from there, to any number of XPCOM objects.</p>
-
-<p>The following chapter details these layers in terms of the XPCOM interfaces that represent them. Here we will just introduce them. The factory design pattern in XPCOM is represented by the <code>nsIFactory</code> interface. The module layer is represented by the <code>nsIModule</code> interface. Most component libraries only need these two interfaces, along with the <code>nsISupports</code> interface, to have XPCOM load, recognize, and use their core object code.</p>
-
-<p>In the next section, we'll be writing the code that actually compiles into a component library, and you will see how each layer is implemented and how each interface is used. Following this initial, verbose demonstration of the APIs, we will introduce a faster more generic way of implementing the module and factory code using macros, which can make components much easier to create.</p>
-
-<h3 id="XPCOM_Glue" name="XPCOM_Glue">XPCOM Glue</h3>
-
-<p>XPCOM contains a lot of stuff. Most of the XPCOM interfaces are not frozen and are meant to be used only by the Gecko internals, not by clients. XPCOM provides many data structures from linked lists to <a class="external" href="http://en.wikipedia.org/wiki/AVL_tree">AVL trees</a>. Instead of writing your own linked list, it's tempting to reuse <code>nsVoidArray</code> or another publicly available class, but this might be a fatal mistake. At any time the class can change and give you unexpected behavior.</p>
-
-<p>XPCOM makes for a very open environment. At runtime you can acquire any service or component merely by knowing a CID, or Contract ID, and an IID. At last count there were over 1300 interfaces defined in XPIDL. Of those 1300 interfaces, less than 100 were frozen, which means that a developer has a good chance of stumbling upon useful interfaces that aren't frozen. If an interface isn't explicitly marked "FROZEN" in the IDL comments, however - and most of them aren't - it will cause your component to possibly break or crash when the version changes.</p>
-
-<h4 id="La_Biblioteca_Glue" name="La_Biblioteca_Glue">La Biblioteca Glue</h4>
-
-<p>In general you should avoid any unfrozen interfaces, any symbols in XPCOM, or any other part of Gecko libraries that aren't frozen. However, there are some unfrozen tools in XPCOM that are used so often they are practically required parts of component programming.</p>
-
-<p>The smart pointer class, <code>nsCOMPtr</code>, for example, which can make reference counting a lot less tedious and error-prone, is not actually frozen, and neither are <code>nsDebug</code>, a class for aiding in tracking down bugs, or <code>nsMemory</code>, a class to ensure that everyone uses the same heap, generic factory, and module. Instead of asking every developer to find and copy these various files into their own application, XPCOM provides a single library of "not-ready-to-freeze-but-really-helpful" classes that you can link into your application, as the following figure demonstrates.</p>
-
-<p><span id="XPCOM_Glue_and_Tools"><a id="XPCOM_Glue_and_Tools"></a><strong>XPCOM Glue and Tools</strong></span></p>
-
-<p><img alt="Image:xpcom-glue-tools.png"></p>
-
-<p>This is the glue library. It provides a bridge, or "glue" layer, between your component and XPCOM.</p>
-
-<p>A version of the glue library is built into XPCOM, and when your component uses it, it links a snapshot of this library: it includes a copy of these unfrozen classes directly, which allows the XPCOM library version to change without affecting the software. There is a slight footprint penalty to linking directly, but this gives your component freedom to work in any recent environment. If footprint is a big issue in your component or application, you can trim out the pieces you don't need.</p>
-
-<h4 id="Clases_de_Cadenas_de_XPCOM" name="Clases_de_Cadenas_de_XPCOM">Clases de Cadenas de XPCOM</h4>
-
-<p>The base string types that XPCOM uses are <code>nsAString</code> and <code>nsACString</code>. These classes are described in the Mozilla String Guide (see <a href="es/Creating_XPCOM_Components/Resources#Gecko_Resources">Gecko Resources</a>).</p>
-
-<p>The string classes that implement these abstract classes are another set of helpful, unfrozen classes in XPCOM. Most components and embedding applications need to link to some kind of string classes in order to utilize certain Gecko APIs, but the string code that Mozilla uses is highly complex and even more expensive than the glue code in terms of footprint (~100k). <code>nsEmbedString</code> and <code>nsEmbedCString</code> are available as very light string class implementations for component development, especially in small embedded applications. This string implementation does the bare minimum to support <code>nsAString</code>/<code>nsACString</code> string classes.</p>
-
-<p>In your own component, you can go "slim" and restrict yourself to the <code>nsEmbedString</code> or go "hog wild" and use all of the functionality of the other strings. WebLock restricts itself to using the simple <code>nsEmbedString</code> family of classes.</p>
-
-<p><span id="String_Classes_and_XPCOM"><a id="String_Classes_and_XPCOM"></a><strong>String Classes and XPCOM</strong></span></p>
-
-<p><img alt="Image:strings-in-xpcom.png"></p>
-
-<p>The glue library provides stub functions for the public functions that XPCOM provides (see <code><a href="https://dxr.mozilla.org/mozilla-central/source/xpcom/build/nsXPCOM.h" rel="custom">xpcom/build/nsXPCOM.h</a></code>). When the glue library is initialized, it dynamically loads these symbols from the XPCOM library, which allows the component to avoid linking directly with the XPCOM library. You shouldn't have to link to the XPCOM library to create a XPCOM component - in fact, if your component has to, then something is wrong. </p><div class="prevnext" style="text-align: right;">
-    <p><a href="/es/docs/Creating_XPCOM_Components:Using_XPCOM_Components" style="float: left;">« Anterior</a><a href="/es/docs/Creating_XPCOM_Components:Creating_the_Component_Code">Siguiente  »</a></p>
-</div> <p></p><div class="licenseblock">
-<p>Copyright (c) 2003 by Doug Turner and Ian Oeschger. This material may be distributed only subject to the terms and conditions set forth in the <a class="external" href="http://www.opencontent.org/openpub/" rel="noopener">Open Publication License</a>, v1.02 or later. Distribution of substantively modified versions of this document is prohibited without the explicit permission of the copyright holder. Distribution of the work or derivative of the work in any standard (paper) book form is prohibited unless prior permission is obtained from the copyright holder.</p>
-</div><p></p>
diff --git a/files/es/creación_de_componentes_xpcom/prefacio/index.html b/files/es/creación_de_componentes_xpcom/prefacio/index.html
deleted file mode 100644
index 5ba98982da..0000000000
--- a/files/es/creación_de_componentes_xpcom/prefacio/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: Prefacio
-slug: Creación_de_Componentes_XPCOM/Prefacio
----
-<p>Este es un libro acerca de Gecko, y cómo crear componentes <a href="es/XPCOM">XPCOM</a> para aplicaciones basadas en Gecko. Aunque se hace énfasis en los pasos prácticos que sigues para que hagas tu código C++ dentro de un componente que pueda ser usado en Gecko, esperamos que esos pasos nos den también la ocasión de abordar todas las herramientas, técnicas y tecnologías que integran XPCOM. En consecuencia, este libro es arreglado de tal forma que puedes seguirlo y crear tus propios componentes o aprender distintos tópicos de XPCOM individualmente, como en una guía de referencia. Por ejemplo, la introducción incluye una discusión acerca de lo que son los componentes; y el primer capítulo - en el cual tu compilas un código básico y lo registras en Mozilla - apunta una discusión de la relación entre componentes y módulos de las interfases de XPCOM y del proceso de registro en general.
-</p><p>El principio de cada capítulo provee una lista de los tópicos más importantes tratados. Las secciones en la barra de al lado son incluidas para resaltar detalles técnicos. Al terminar el libro, si hemos hecho nuestro trabajo, habrás aprendido como construir componentes y sabrás algo acerca del framework para esos componentes en Gecko, que es XPCOM.
-</p>
-<h3 id="Quién_debe_leer_este_Libro"> Quién debe leer este Libro </h3>
-<p><a href="es/Creaci%c3%b3n_de_Componentes_XPCOM">Creación de Componentes XPCOM</a> está dirigido a desarrolladores C++. Aunque puedes crear componentes XPCOM en <a href="es/Javascript">Javascript</a> y otros lenguajes y aunque tal vez puedas seguir el libro como programador <a href="es/C">C</a>, el código de implementación está escrito en C++ y mucha de la discusión de cómo hacer tu código <i>dentro</i> de un componente XPCOM empieza desde C++. De cualquier modo no necesitas ser un experto en C++, aunque debes estar familiarizado con ideas básicas como herencia y encapsulación, ideas que cuando es posible son explicadas en el libro donde son usadas. También muchos de los ejemplos son en Javascript, que es usado en Mozilla para accesar componentes XPCOM como objetos script, así que estar familiarizado con ese lenguaje es útil también.
-</p><p>XPCOM significa Cross Platform Component Object Model(Modelo Componente Objeto Multiplataforma), como su nombre lo implica, XPCOM es similar al Microsoft COM, si tienes alguna experiencia con esta tecnología, grán parte de eso puede aplicarse a XPCOM. De cualquier modo este libro no asume ningún conocimiento previo de COM - todas las ideas básicas de COM serán introducidas.
-</p><p>Este libro provee un tutorial de cómo construir un componente XPCOM que controle el comportamiento de búsqueda; aunque XPCOM puede ser usado en muchos ambientes relacionados con búsqueda web, su principal cliente es Gecko, un buscador web embebido de código abierto, que cumple con estándares, donde es más fácil y práctico ilustrar la funcionalidad de XPCOM. Una descripción completa del componente de este turial puede ser encontrada en la sección <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Creaci%c3%b3n_de_el_C%c3%b3digo_del_Componente#En_lo_que_Estaremos_Trabajando">En lo que Estaremos Trabajando</a> de este tutorial.
-</p>
-<div class="note">
-<p>A pesar de lo que dice la documentación, XPCOM no debe ser usado para hacer <a href="es/Plugins">NPAPI plugins</a> script. A partir de la versión 1.7.5 de Gecko(Firefox 1.0) una extensión especial NPAPI para llamar desde script es soportada vea <a href="es/Gecko_Plugin_API_Reference/Scripting_plugins">Scripting plugins</a>.
-</p>
-</div>
-<h3 id="Organización_del_Tutorial"> Organización del Tutorial </h3>
-<p>La siguiente lista da una reseña de de los pasos que seguiremos para crear un componente XPCOM llamado <i>Weblock</i>, el cual provee la funcionalidad de bloqueo de sitios a los buscadores basados en Gecko. Cada uno de estos pasos tiene su propio capitulo, en el que se discuten varios tópicos asociados al paso.
-</p>
-<ul><li> Crear el módulo genérico de módulo para el componente.
-</li><li> Usar macros C++, clases especiales de cadenas y punteros inteligentes para optimizar el código.
-</li><li> Definir la funcionalidad del componente; crear una interfaz <a href="es/XPIDL">XPIDL</a> para esa funcionalidad, crear el código específico para la implementación adaptada de la interfaz del componente <i>Weblock</i>.
-</li><li> Finalizar la implementación del componente <i>Weblock</i>: <code>nsIContentPolicy</code>, E/S de archivos, bloqueo, etc.
-</li><li> Creación de la interfaz de usuario del componente <i>Weblock</i>.
-</li><li> Empaquetar <i>Weblock</i> para su distribución e instalación.
-</li></ul>
-<h3 id="Continuando_con_los_Ejemplos"> Continuando con los Ejemplos </h3>
-<p>Hay dos formas diferentes de tener XPCOM en tu máquina para poder crear componentes. Si ya tienes un Mozilla construído o el código fuente de Mozilla 1.2 o posterior, entonces puedes usar la plataforma XPCOM disponible ahí. Si no tienes las fuentes de Mozilla, entonces puedes bajar el Gecko SDK, que es una colección de librerías y herramientas que componen la plataforma de componentes XPCOM.
-</p><p>No importa si compilas tu código en el directorio de las fuentes de Mozilla o usas el Gecko SDK, puedes construir tus propios componentes que usen los componentes previamente existentes en Gecko. el componente <b>Weblock</b> que describimos en este tutorial es un complemento práctico(y esperamos genuinamente útil) para el navegador. Para poder construirlo, tu Gecko SDK o tus fuentes de Mozilla deben ser versión 1.2 o superior (las interfaces XPCOM en versiones anteriores no fueron completamente congeladas).
-</p><p>Este Libro asume que estas usando el SDK en vez del directorio de las fuentes de Mozilla, de cualquier forma la diferencia entre ambos es mínima. Detalles acerca de cómo obtener el SDK, construir y obtener acceso programático a los componetes de Gecko se dan en el APENDICE del libro, <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Configurar_el_Gecko_SDK">Configurar el Gecko SDK</a>.
-</p>
-<h3 id="Convenciones"> Convenciones </h3>
-<p>Las convenciones de formato listadas abajo se usan para designar tipos específicos de información en el libro y hacer las cosas más fáciles de encontrar. El objetivo es usar tan pocos formatos como sea posible, pero distinguir los diferentes tipos de información claramente.
-</p>
-<table class="standard-table"> <tbody><tr> <td class="header">Formato</td> <td class="header">Descripción</td> </tr> <tr> <td><b>bold</b></td> <td><b>nombres de componentes</b> aparecen en negro en el texto</td> </tr> <tr> <td><code>monospace</code></td> <td><code>referencias al código</code>, <code>nombres de interfaces</code> y <code>miembros</code> de interfaces (ejm. <code>createInstance()</code>) aparecen en letra monospaced. Líneas de código aparecen en cajas separadas. También <code>nombres de archivos</code> y <code>directorios</code> aparecen en letra monospaced.</td> </tr> <tr> <td><i>itálica</i></td> <td><i>variables</i> aparecen en letra itálica. Términos importantes y nuevos conceptos también aparecen en letra itálica la primera vez que aparecen en el texto. También aquellos términos que son explicados inmediatamente después de ser citados, o donde se le dice al lector que vaya a una sección en el libro en donde se describen dichos términos a detalle.</td> </tr> <tr> <td>link</td> <td>Referencias a otras secciones, imágenes y tablas también son links a esas secciones.</td> </tr>
-</tbody></table>
-<h3 id="Agradecimientos"> Agradecimientos </h3>
-<p>Gracias a Peter Lubczynski, John Gaunt, Ellen Evans y Alec Flett por sus revisiones técnicas. Un agradecimiento especial a Darin Fisher por sus observaciones tan meticulosas, lectura tan cercana y atención a los detalles.
-</p>
diff --git a/files/es/creando_una_extensión/index.html b/files/es/creando_una_extensión/index.html
deleted file mode 100644
index 6a155e7f50..0000000000
--- a/files/es/creando_una_extensión/index.html
+++ /dev/null
@@ -1,236 +0,0 @@
----
-title: Creando una extensión
-slug: Creando_una_extensión
-tags:
-  - Complementos
-  - Todas_las_Categorías
-  - extensiones
----
-<h2 id="Introducci.C3.B3n" name="Introducci.C3.B3n">Introducción</h2>
-<p>Este tutorial contiene los pasos necesarios para desarrollar una extensión muy básica - la cuál añadirá un texto que diga "¡Hola, mundo!" en el panel de la barra de estado del navegador Firefox</p>
-<div class="note">
-  <p><strong>Nota</strong> Este tutorial sobre el desarrollo de una extensión es para la versión 1.5 de Firefox . Existen otros para versiones anteriores.</p>
-</div>
-<h2 id="Preparando_el_Entorno_de_Desarrollo" name="Preparando_el_Entorno_de_Desarrollo">Preparando el Entorno de Desarrollo</h2>
-<p>Las extensiones se distribuyen en archivos comprimidos en formato ZIP, o en paquetes, con extensión <code>xpi</code> (<em>se pronuncia “zippy”</em>). Los archivos XPI contienen el siguiente código:</p>
-<pre>extension.xpi:
-              /<a href="/es/docs/Install.rdf" title="Install.rdf">install.rdf</a>
-              <a href="#XPCOM_Components">/components/*</a>
-              <a href="#Application_Command_Line">/components/cmdline.js</a>
-              <a href="#Defaults_Files">/defaults/</a>
-              <a href="#Defaults_Files">/defaults/preferences/*.js</a>
-              /plugins/*
-              /<a href="/es/docs/Chrome.manifest" title="Chrome.manifest">chrome.manifest</a>
-              /<a href="/es/docs/Chrome_window_icons" title="Chrome_window_icons">chrome/icons/default/*</a>
-              /chrome/
-              /chrome/content/
-
-</pre>
-<p>Debido a esto, es más fácil presentar nuestros archivos fuente en un modo similar, a menos que decidamos crear alguno del tipo "Makefile" o un script "shell" para comprimirlos todos. Incluso si optamos por este método, es muy sencillo hacer pruebas, gracias al sistema de <em>Addons</em> de Firefox 1.5.</p>
-<p>Aclarado esto comenzamos. Crea una carpeta para tu extensión en algún lugar de tu disco duro, e.j. <code>C:\extensions\my_extension\</code> o <code>~/extensions/my_extension/</code>. (Nota: usa todos los caracteres en minúscula) Dentro de esta carpeta creamos otra carpeta llamada <code>chrome</code>, dentro de <code>chrome</code> creamos otra carpeta llamada <code>content</code>. (En sistemas Unix podemos crear los 3 directorios con el siguiente comando <code>mkdir -p chrome/content</code> dentro del directorio de raíz de la extensión.)</p>
-<p>Dentro de la <strong>raíz</strong> de la carpeta extensión, junto a la carpeta <code>chrome</code>, creamos dos archivos de textos vacíos, uno llamado <code>chrome.manifest</code> y el otro <code>install.rdf</code>.</p>
-<p>Deberías tener algo así:</p>
-<pre>&lt;carpeta extension&gt;\
-          install.rdf
-          chrome.manifest
-          chrome\
-             content\
-</pre>
-<p>Puedes encontrar más tips (ideas) sobre la configuración del ambiente de desarrollo en <a class="external" href="http://kb.mozillazine.org/Setting_up_extension_development_environment">Mozillazine Knowledge Base</a>.</p>
-<h2 id="Crear_el_manifest_de_la_instalaci.C3.B3n" name="Crear_el_manifest_de_la_instalaci.C3.B3n">Crear el manifiesto de la instalación</h2>
-<p>Abre el archivo llamado <code><a href="/es/docs/Manifiesto_de_instalación" title="Manifiesto_de_instalación">install.rdf</a></code> que creaste en la carpeta raíz de tu extensión y escribe lo siguiente en él:</p>
-<pre>&lt;?xml version="1.0"?&gt;
-
-&lt;RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-     xmlns:em="http://www.mozilla.org/2004/em-rdf#"&gt;
-
-  &lt;Description about="urn:mozilla:install-manifest"&gt;
-    &lt;em:id&gt;<strong><a class="link-mailto" href="mailto:sample@foo.net" rel="freelink">sample@foo.net</a></strong>&lt;/em:id&gt;
-    &lt;em:version&gt;<strong>1.0</strong>&lt;/em:version&gt;
-    &lt;em:type&gt;2&lt;/em:type&gt;
-
-    &lt;!-- Target Application this extension can install into,
-         with minimum and maximum supported versions. --&gt;
-    &lt;em:targetApplication&gt;
-      &lt;Description&gt;
-        &lt;em:id&gt;<strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong>&lt;/em:id&gt;
-        &lt;em:minVersion&gt;<strong>1.0+</strong>&lt;/em:minVersion&gt;
-        &lt;em:maxVersion&gt;<strong>1.5.0.*</strong>&lt;/em:maxVersion&gt;
-      &lt;/Description&gt;
-    &lt;/em:targetApplication&gt;
-
-    &lt;!-- Front End MetaData --&gt;
-    &lt;em:name&gt;<strong>¡Ejemplo!</strong>&lt;/em:name&gt;
-    &lt;em:description&gt;<strong>Una extensión de prueba</strong>&lt;/em:description&gt;
-    &lt;em:creator&gt;<strong>Tu nombre aquí</strong>&lt;/em:creator&gt;
-    &lt;em:homepageURL&gt;<strong>http://www.foo.com/</strong>&lt;/em:homepageURL&gt;
-  &lt;/Description&gt;
-&lt;/RDF&gt;
-</pre>
-
-<ul>
-  <li><strong><a class="link-mailto" href="mailto:sample@foo.net" rel="freelink">sample@foo.net</a></strong> - la ID de tu extensión. Esta es una clave que has creado para identificar tu extensión en formato de correo electrónico (nota: esta clave no debería ser tu email). Hazla única. Otra opción es usar un GUID.</li>
-  <li>Especifica <code>&lt;em:type&gt;2&lt;/em:type&gt;</code> -- el 2 indica que una extensión está siendo descrita (mira en <a href="/es/docs/Manifiesto_de_instalación#tipo" title="Manifiesto_de_instalación#tipo">Instalar el manifest#tipo</a> para ver los otros códigos).</li>
-  <li><strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong> - La ID del programa Firefox.</li>
-  <li><strong>1.0+</strong> - indica la versión mínima de Firefox con la que afirmas que tu extensión funcionará. Establece ésta como la versión mínima con la que te comprometes a comprobar y corregir errores.</li>
-  <li><strong>1.5.0.*</strong> - indica la versión máxima de Firefox con la que afirmas que tu extensión funcionará. ¡Establece ésta como no superior a la máxima versión que esté disponible!</li>
-</ul>
-<p>Mira <a href="/es/docs/Manifiesto_de_instalación" title="Manifiesto_de_instalación">Instalar el manifest</a> para una relación completa de las propiedades tanto obligatorias como opcionales.</p>
-<p>Guarda el archivo.</p>
-<h2 id="Ampliando_el_Navegador_con_XUL" name="Ampliando_el_Navegador_con_XUL">Ampliando el navegador con XUL</h2>
-<p>La interfaz de usuario de Firefox está escrita en XUL y Javascript. <a href="/es/docs/XUL" title="XUL">XUL</a> es una implementación XML que proporciona elementos de la interfaz de usuario como botones, menús, barras de botones etc. Las acciones del usuario se controlan mediante JavaScript. Para ampliar el navegador modificamos o añadimos elementos de la interfaz de usuario. Añadimos nuevos elementos mediante la inserción de nuevos elementos XUL DOM dentro de la ventana del navegador, y los modificamos usando scripts e incluyendo manejadores de eventos.</p>
-<p>El navegador está definido en un archivo XUL llamado <code>browser.xul</code> (<code>$FIREFOX_INSTALL_DIR/chrome/browser.jar</code> que incluye <code>content/browser/browser.xul</code>). En el archivo browser.xul podemos encontrar la barra de estado, definida en aproximadamente estos términos:</p>
-<pre>&lt;statusbar id="status-bar"&gt;
- ... &lt;statusbarpanel&gt;s ...
-&lt;/statusbar&gt;
-</pre>
-<p><code>&lt;statusbar id="status-bar"&gt;</code> es un "punto de anclaje" para una capa XUL.</p>
-<h3 id="Capas__XUL" name="Capas__XUL">Capas XUL</h3>
-<p><a href="/es/docs/Capas_XUL" title="Capas_XUL">Capas XUL</a> son una manera de añadir un elemento a la interfaz de usuario en un documento XUL durante el tiempo de ejecución. Una capa XUL es un archivo .xul que marca elementos XUL para insertar en puntos de anclaje específicos dentro del "documento maestro". Estos fragmentos  indican que los elementos pueden ser añadidos, modificados o eliminados.</p>
-<p><strong>Ejemplo de documento de capa XUL</strong></p>
-<pre>&lt;?xml version="1.0"?&gt;
-&lt;overlay id="sample"
-         xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"&gt;
- &lt;statusbar id="<strong>status-bar</strong>"&gt;
-  &lt;statusbarpanel id="my-panel" label="Hello, World"/&gt;
- &lt;/statusbar&gt;
-&lt;/overlay&gt;
-</pre>
-<p>El <code>&lt;statusbar&gt;</code> llamado <code><strong>status-bar</strong></code> indica el punto de anclaje dentro de la ventana del navegador donde lo queremos incluir.</p>
-<p>El <code>&lt;statusbarpanel&gt;</code> hijo es un nuevo elemento que queremos insertar en el punto de anclaje.</p>
-<p>Copia el código de ejemplo arriba mostrado y guardaló en un archivo llamado <code><strong>sample.xul</strong></code> dentro de la carpeta <code>chrome/content</code> que creó.</p>
-<p>Para más información sobre elementos de inserción y modificar la interfaz de usuario empleando Capas, mira más abajo.</p>
-<h2 id="Chrome_URIs" name="Chrome_URIs">Chrome URIs</h2>
-<p>Los archivos XUL forman parte de "<a href="/es/docs/Chrome_Registration" title="Chrome_Registration">Chrome Packages</a>" - paquetes de componentes de interfaz del usuario, los cuales se cargan a través de la dirección <code>chrome://</code> URIs. Más que cargar el navegador desde el disco utilizando un (archivo) <code>file://</code> URI (ya que la ubicación de Firefox en un sistema puede cambiar de una plataforma a otra y de un sistema a otro), los desarrolladores de Mozilla se decantaron por una solución para crear URI al contexto de XUL,que la aplicación instalada ya conoce.</p>
-<p>La ventana del navegador es: <code><a class="external" rel="freelink">chrome://browser/content/browser.xul</a></code> ¡Prueba a teclear esta dirección URL en la barra de navegación de Firefox!</p>
-<p>Los Chrome URIs constan de varios componentes:</p>
-<ul>
-  <li>En primer lugar, la <strong>URI scheme</strong> Esquema URI (<code>chrome</code>) informa a la librería de red de Firefox de que es un 'Chrome URI' y que el contenido que se cargue debe ser manejado de manera especial.</li>
-  <li>En segundo lugar, un nombre de paquete (en el ejemplo superior utilizamos <code><strong>browser</strong></code>), que identifica la extension en la interfaz del usuario. Este nombre debe ser, en un caso ideal, único, de esa manera se evitará el conflicto entre extensiones.</li>
-  <li>En tercer lugar, el tipo de información que ofrece el archivo. Hay tres tipos: <code>content</code> (XUL, JavaScript, XBLs, etc. que forman la estructura y el comportamiento de una aplicación UI), <code>locale</code> (DTD, archivos .propiedades, etc., que contienen cadenas para la <a href="/es/docs/Localization" title="Localization">localization</a> del UI), y <code>skin</code> (CSS e imágenes que forman el <a href="/es/docs/Theme" title="Theme">theme</a> del UI)</li>
-  <li>En último lugar, la ruta del archivo a cargar.</li>
-</ul>
-<p>Por lo tanto, <code><a class="external" rel="freelink">chrome://foo/skin/bar.png</a></code> carga el archivo <code>bar.png</code> de la sección <code>skin</code>, del tema <code>foo</code>.</p>
-<p>Cuando cargas contenido usando un Chrome URI, Firefox usa el Chrome Registry para traducir esos URIs en los archivos fuentes en el disco (o en paquetes JAR).</p>
-<h2 id="Creando_un_Chrome_manifest" name="Creando_un_Chrome_manifest">Creando un Chrome manifest</h2>
-<p>Para más información sobre el Chrome manifest y las propiedades que soporta, mira la referencia <a href="/es/docs/Chrome_Manifest" title="Chrome_Manifest">Chrome Manifest</a>.</p>
-<p>Abre el archivo llamado <code><strong>chrome.manifest</strong></code> que creaste en el directorio <code>chrome</code> en la raìz de la jerarquía de la carpeta orìgen de la extensión</p>
-<p>Agrega este código:</p>
-<pre>content     sample    chrome/content/
-</pre>
-<p>(<strong>¡No te olvides de la barra oblicua, "<code>/</code>"!</strong> sin ella, la extensión no se cargará.)</p>
-<p>Esto especifica lo siguiente:</p>
-<ol>
-  <li>Tipo de material dentro de un paquete chrome.</li>
-  <li>Nombre del paquete chrome (Asegúrate de usar todos los caracteres en minúscula para el nombre del paquete "sample", ya que Firefox/Thunderbird no lo soporta en la versión 2 y anteriores - {{ Bug(132183) }})</li>
-  <li>Localización de los archivos del paquete chrome.</li>
-</ol>
-<p>Esta línea dice que para obtener una muestra del paquete chrome, debemos encontrar los archivos de <strong>content</strong> en la ruta <code>chrome/content</code>, la cual es relativa a la ruta de <code>chrome.manifest</code>.</p>
-<p>Nótese que el contenido, los archivos de idioma y los del skin, deben mantenerse dentro de carpetas llamadas <strong>content</strong> (para contenido), <strong>locale</strong> (para idioma) y <strong>skin</strong> dentro de tu subdirectorio <code>chrome</code>.</p>
-<p>Salva los cambios del archivo. Cuando inicies Firefox con tu extensión, (lo cual se hará despues en este tutorial), aquel-Firefox- registrará el chrome del paquete.</p>
-<h2 id="Registrar_un_Overlay" name="Registrar_un_Overlay">Registrar un Overlay</h2>
-<p>Necesitas que Firefox fusione tu overlay con la ventana del browser cada vez que se muestra, por lo que añade esta línea a tu archivo <code>chrome.manifest</code>:</p>
-<pre>overlay <a class="external" rel="freelink">chrome://browser/content/browser.xul</a> <a class="external" rel="freelink">chrome://sample/content/sample.xul</a>
-</pre>
-<p><br>
-  Esto le dice a Firefox que fusione <code>sample.xul</code> con <code>browser.xul</code> cuando <code>browser.xul</code> se cargue.</p>
-<h2 id="Pruebas" name="Pruebas">Pruebas</h2>
-<p>Primero, necesitamos informar a Firefox acerca de tu extensión. En los malos y viejos tiempos de Firefox 1.0, ésto significaba empaquetar tu extensión como un XPI e instalarlo a través de la interfaz de usuario, lo que era engorroso. Ahora es mucho más simple.</p>
-<ol>
-  <li>Abre tu <a class="external" href="http://kb.mozillazine.org/Profile_folder">carpeta Profiles</a> y adentrate en el perfil con el que deseas trabajar (e.g. <code>Firefox/Profiles/&lt;profile_id&gt;.default/</code>).</li>
-  <li>Abre la carpeta <strong>extensions</strong> (creala si ésta no existe)</li>
-  <li>Crea un nuevo archivo de texto, y añade la ruta de la carpeta que contiene tu extensión, e.g. <code>C:\extensions\my_extension\</code> o <code>~/extensions/my_extension</code>. Guarda el archivo con el identificador de tu extensión como nombre de archivo, e.g. <code><a class="link-mailto" href="mailto:sample@foo.net" rel="freelink">sample@foo.net</a></code></li>
-</ol>
-<p>¡¡Ahora estás preparado para comprobar tu extensión!!</p>
-<p>Ejecuta Firefox. Firefox detectará el vínculo de texto al directorio de tu extensión y la instalará. Cuando la ventana del navegador aparezca verás el texto "Hello, World!" en el lado derecho del panel de la barra de estado.</p>
-<p>Ahora puedes retornar al archivo .xul y realizar cambios, reinicia Firefox y éstos se verán reflejados.</p>
-&lt;center&gt;
-  <p><img alt="Image:Helloworld_tools_menu.PNG" class="internal" src="/@api/deki/files/1116/=Helloworld_tools_menu.PNG"></p>
-  <p><img alt="Image:Helloworld_extensions_wnd.PNG" class="internal" src="/@api/deki/files/1115/=Helloworld_extensions_wnd.PNG"></p>
-&lt;/center&gt;
-<h2 id="Empaquetado" name="Empaquetado">Empaquetado</h2>
-<p>Ahora que tu extensión funciona, puedes empaquetarla para su distribución e instalación.</p>
-<p>Comprime con zip los contenidos de las carpetas de tu carpeta (no la carpeta de la extensión en sí misma) y cambia la extensión del archivo de .zip a .xpi. En windows XP, puedes hacer esto fácilmente seleccionando todas las carpetas y subcarpeta de la carpeta de tu extensión, haz click con el botón derecho y selecciona "enviar a" -&gt; "Comprimir carpeta". Se creará un archivo .zip. Renómbralo y ya está.</p>
-<p>Ahora sube el archivo .xpi a tu servidor, asegurándote de que se sirve con el tipo mime <code>application/x-xpinstall</code>. Haciendo un hipervínculo al archivo puedes permitir a la gente que descargue e instale tu extensión en Firefox.</p>
-<h3 id="Usando_addons.mozilla.org" name="Usando_addons.mozilla.org">Usando addons.mozilla.org</h3>
-<p>En el sitio de distribución Mozilla Update puedes subir tus extensiones totalmente gratis. Tus extensiones serán alojadas en los mirrors de la red Mozilla para garantizar la transferencia directa aún cuando pueda ser muy popular su descarga. La web de Mozilla proporciona a los usuarios una instalación sencilla, y podrán automáticamente disponer de las ultimas versiones que hagas de tu extensión. Además Mozilla Update permite que los usuarios comenten y hagan mejoras sobre tu extensión. ¡Es muy recomendable que utilices Mozilla Update para distribuir tus extensiones!</p>
-<p>¡Visita <a class="external" href="http://addons.mozilla.org/developers/" rel="freelink">http://addons.mozilla.org/developers/</a> para crear una cuenta y comenzar a distribuir tu extensión!</p>
-<p><em>Nota:</em> Tu extensión será aceptada y descargada más rápidamente si tiene una buena descripción y algunas imágenes en uso.</p>
-<h3 id="Colocaci.C3.B3n_de_extensiones_en_el_registro_de_Windows" name="Colocaci.C3.B3n_de_extensiones_en_el_registro_de_Windows">Colocación de extensiones en el registro de Windows</h3>
-<p>En Windows, la información sobre las extensiones se puede agregar al registro, y dicha extensión será automáticamente seleccionada la próxima vez que se ejecute la aplicación. Esto permite que los instaladores de la aplicación integren fácilmente la extensión. Ver <a href="/es/docs/Agregar_una_Extensión_usando_el_Registro_de_Windows" title="Agregar_una_Extensión_usando_el_Registro_de_Windows">Agregar una Extensión usando el Registro de Windows</a> para más información.</p>
-<h2 id="M.C3.A1s_sobre_las_Capas_XUL" name="M.C3.A1s_sobre_las_Capas_XUL">Más sobre las capas XUL</h2>
-<p>Además de añadir elementos de la interfaz de usuario en el punto de anclaje, puede emplear fragmentos XUL dentro de las capas para:</p>
-<ul>
-  <li>Cambiar atributos en el punto de anclaje, e.g. <code>&lt;statusbar id="status-bar" hidden="true"/&gt;</code> (esconde la barra de estado)</li>
-  <li>Eliminar el punto de anclaje del documento maestro, e.g. <code>&lt;statusbar id="status-bar" removeelement="true"/&gt;</code></li>
-  <li>Controlar la posición de los elementos insertados:</li>
-</ul>
-<pre>&lt;statusbarpanel position="1" .../&gt;
-
-&lt;statusbarpanel insertbefore="other-id" .../&gt;
-
-&lt;statusbarpanel insertafter="other-id" .../&gt;
-</pre>
-<h2 id="Creando_nuevos_componentes_del_interfaz_de_usuario" name="Creando_nuevos_componentes_del_interfaz_de_usuario">Creando nuevos componentes de la interfaz de usuario</h2>
-<p>Puedes crear tus propias ventanas y cajas de diálogo separadas de los archivos .xul, proporcionar funcionalidad colocando acciones del usuario en ejecución en archivos .js , usar métodos DOM para manipular UI widgets. Puedes usar las reglas de estilos .css, adjuntar imágenes, cambiar colores, etc.</p>
-<p>Ver la guía <a href="/es/docs/XUL" title="XUL">XUL</a> contiene más recursos para desarrolladores XUL.</p>
-<h2 id="Archivos_Por_Defecto" name="Archivos_Por_Defecto">Archivos por defecto</h2>
-<p>Los archivos por defecto son utilizados para crear un perfil de usuario y se crean en la carpeta <code>defaults/</code> que se encuentra dentro de la carpeta raíz de tu extensión. Los archivos .js se deben almacenar dentro de <code>defaults/preferences/</code> - al ser almacenados aquí serán cargados automáticamente por el sistema de preferencias de Firefox- de modo que se pueda tener acceso mediante las <a href="/es/docs/Preferences_API" title="Preferences_API">Preferences API</a>.</p>
-<h2 id="Componente_XPCOM" name="Componente_XPCOM">Componente XPCOM</h2>
-<p>Firefox soporta el uso del componente <a href="/es/docs/XPCOM" title="XPCOM">XPCOM</a> en extensiones. Puedes crear tus propios componentes fácilmente usando JavaScript o C++ (usando el <a href="/es/docs/Gecko_SDK" title="Gecko_SDK">Gecko SDK</a>).</p>
-<p>Coloca todos tus archivos .js o .dll en el directorio <code>components/</code>- para que sean automáticamente registrados la primera vez que inicie Firefox después de instalada la extensión.</p>
-<p>Para más información revisa <a href="/es/docs/How_to_Build_an_XPCOM_Component_in_Javascript" title="How_to_Build_an_XPCOM_Component_in_Javascript">How to Build an XPCOM Component in Javascript</a> y el libro <a href="/es/docs/Creating_XPCOM_Components" title="Creating_XPCOM_Components">Creating XPCOM Components</a>.</p>
-<h3 id="Comandos_de_la_Aplicaci.C3.B3n" name="Comandos_de_la_Aplicaci.C3.B3n">Comandos de la aplicación</h3>
-<p>Una de las ventajas de las aplicaciones que usan el componente XPCOM es la de poder usar líneas de comandos para su ejecución tanto en Firefox como en Thunderbird. Puedes utilizar esta técnica para correr tus extensiones:</p>
-<pre> firefox.exe -myapp
-</pre>
-<p><span class="comment">I should move the useful parts of this to the Command Line page. -Nickolay This is done by adding a component containing the function... function NSGetModule(comMgr, fileSpec) { return myAppHandlerModule; } This function is run by firefox each time firefox is started. Firefox registers the myAppHandlerModule's by calling its 'registerSelf()'. Then it obtains the myAppHandlerModule's handler factory via 'getClassObject()'. The handler factory is then used to create the handle using its 'createInstance(). Finally, the handle's 'handle(cmdline)' processes the command line cmdline's handleFlagWithParam() and handleFlag().</span> Ver <a href="/es/docs/Chrome/Command_Line" title="Chrome/Command_Line">Chrome: Command Line</a> o visitar <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=365297">forum discussion</a> para más detalles.</p>
-<h2 id="Ubicaci.C3.B3n" name="Ubicaci.C3.B3n">Ubicación</h2>
-<p>Para permitir más de un lenguaje, debes separar las cadenas del contenido usando <a href="/es/docs/XUL_Tutorial/Localization" title="XUL_Tutorial/Localization">entities</a> y <a href="/es/docs/XUL_Tutorial/Property_Files" title="XUL_Tutorial/Property_Files">string bundles</a>. ¡Es mucho más fácil de hacer esto cuando estás desarrollando tu extensión que volver y hacerlo luego!</p>
-<p>La información de la ubicación está almacenada en el directorio locale para las extensiones. Por ejemplo, para agregar un locale para nuestra extensión de prueba, crea un directorio llamado "locale" en chrome (donde esta ubicado el "contenido" del directorio) y agrega las siguientes líneas al archivo chrome.manifest:</p>
-<pre>locale sample sampleLocale chrome/locale/
-</pre>
-<p>Para crear valores de atributos ubicables en XUL, pones los valores en un archivo <code>.ent</code> (o un <code>.dtd</code>), el cual deberá ponerse en el directorio locale y verse así:</p>
-<pre>&lt;!ENTITY  button.label     "Clickeame!"&gt;
-&lt;!ENTITY  button.accesskey "C"&gt;
-</pre>
-<p>Y entonces inclúyelo en la parte superior del documento XUL (pero debajo de: "&lt;?xml version"1.0"?&gt;") quedando asi:</p>
-<pre>&lt;!DOCTYPE <strong>window</strong> SYSTEM "<a class="external" rel="freelink">chrome://packagename/locale/filename.ent</a>"&gt;
-</pre>
-<p>Donde <code><strong>window</strong></code> es el <code><a href="/es/docs/DOM/element.localName" title="DOM/element.localName">localName</a></code> del elemento raíz del documento XUL, y el valor de la propiedad  <code>SYSTEM</code> es la URI de chorme al archivo entity. Para nuestra extensión de ejemplo, el elemento de la raíz es <code><strong>overlay</strong></code>.</p>
-<p>Para usar entities, tu XUL debe verse asi:</p>
-<pre>&lt;button label="&amp;button.label;" accesskey="&amp;button.accesskey;"/&gt;
-</pre>
-<p>El registro de Chrome se asegurara que el archivo entity ha sido cargado del  paquete correspondiente a la localizacion elegida.</p>
-<p>Para las lineas que usarás en tu script, crea un archivo .properties; un archivo de texto que contendrá estas líneas:</p>
-<pre>key=value
-</pre>
-<p>Entonces usa el tag <code><a href="/es/docs/NsIStringBundleService" title="NsIStringBundleService">nsIStringBundleService</a></code>/<code><a href="/es/docs/NsIStringBundle" title="NsIStringBundle">nsIStringBundle</a></code> o el tag <code><a class="external" href="http://xulplanet.com/references/elemref/ref_stringbundle.html">&lt;stringbundle&gt;</a></code> para cargar los valores en el script.</p>
-<h2 id="Comprendiendo_el_navegador" name="Comprendiendo_el_navegador">Comprender el navegador</h2>
-<p>Utiliza <a href="/es/docs/DOM_Inspector" title="DOM_Inspector">DOM Inspector</a> (no es parte de la instalación <strong>Estandar</strong> de Firefox, debes reinstalar seleccionando instalación personalizada y elegir <strong>Herramientas de Desarrollo </strong> si no hay un elemento "Inspector de DOM" en el menu Herramientas del browser) para inspeccionar la ventana del browser o cualquier otra ventana XUL que quieras extender.</p>
-<p>Utiliza el botón de búsqueda apuntar-y-clic situado en la parte superior izquierda de la barra de herramientas de DOM Inspector visualmente en un nodo de la ventana XUL para seleccionarlo. Cuando hagas esto DOM Inspector ira dentro del árbor jerárquico al nodo sobre el que hiciste clic.</p>
-<p>Utiliza el panel lateral derecho de DOM Inspector para descubrir los puntos de anclaje con los ids que puedes utilzar para insertar tus elementos en los overlays. Si no pudieses encontrar un elemento con un id sobre el que hacer la mezcla, puedes añadir un script en tu overlay e insertar tus elementos cuando el evento load se dispare en la ventana XUL maestra.</p>
-<p>Depurar extensiones</p>
-<p><strong>Herramientas analitícas para Depurar (Debugging)</strong></p>
-<ul>
-  <li>El <a href="/es/docs/DOM_Inspector" title="DOM_Inspector">DOM Inspector</a> - inspecciona atributos, estructura del DOM, reglas de estilos CSS que están afectando (ej. buscar-porque sus reglas de estilo parecen no estar trabajando para un elemento -, ¡una herramienta invaluable!)</li>
-  <li><a href="/es/docs/Venkman" title="Venkman">Venkman</a> - Marca de control (breakpoints) en JavaScript e inspeccionar la pila de llamada.</li>
-  <li><code><a href="/es/docs/Core_JavaScript_1.5_Reference/Objects/Function/arguments/callee" title="Core_JavaScript_1.5_Reference/Objects/Function/arguments/callee">arguments.callee</a>.<a href="/es/docs/Core_JavaScript_1.5_Reference/Objects/Function/caller" title="Core_JavaScript_1.5_Reference/Objects/Function/caller">caller</a></code> en JavaScript - accede a la pila de llamada de funciones.</li>
-</ul>
-<p><strong>printf debugging</strong></p>
-<ul>
-  <li>Ejecutar Firefox con <code>-console</code> en la linea de comandos y usar</li>
-</ul>
-<p><code><a href="/es/docs/DOM/window.dump" title="DOM/window.dump">dump</a>("string")</code> (ver el enlace para detalles)</p>
-<ul>
-  <li>Usar <code><a href="/es/docs/NsIConsoleService" title="NsIConsoleService">nsIConsoleService</a></code> para ingresar/invocar la consola JavaScript</li>
-</ul>
-<p><strong>Depuración avanzada</strong></p>
-<ul>
-  <li>Ejecutar una “construcción” de Firefox de depuración y establecer los puntos de interrupción en el propio Firefox, o sus componentes C++. Para el desarrollador experimentado, esta es a menudo la manera más rápida de diagnosticar un problema. Para más información ver <a href="/es/docs/Build_Documentation" title="Build_Documentation">Build Documentation</a> y <a href="/es/docs/Developing_Mozilla" title="Developing_Mozilla">Developing Mozilla</a>.</li>
-</ul>
-<ul>
-  <li>Para obtener mas consejos útiles ver <a href="/es/docs/Debugging_a_XULRunner_Application" title="Debugging_a_XULRunner_Application">Debugging a XULRunner Application</a>.</li>
-</ul>
-<h3 id="Gu.C3.ADa_R.C3.A1pida" name="Gu.C3.ADa_R.C3.A1pida">Guía Rápida</h3>
-<p>Otro tutorial desde <a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">MozillaZine Knowledge Base</a>, también puedes bajar este archivo para usarlo como base en la creación de tus extensiones <a class="external" href="http://mozilla.doslash.org/stuff/helloworld.zip">helloworld.zip</a>.</p>
diff --git a/files/es/crear_una_extensión_personalizada_de_firefox_con_el_mozilla_build_system/index.html b/files/es/crear_una_extensión_personalizada_de_firefox_con_el_mozilla_build_system/index.html
deleted file mode 100644
index 865956ce0f..0000000000
--- a/files/es/crear_una_extensión_personalizada_de_firefox_con_el_mozilla_build_system/index.html
+++ /dev/null
@@ -1,580 +0,0 @@
----
-title: Crear una extensión personalizada de Firefox con el Mozilla Build System
-slug: Crear_una_extensión_personalizada_de_Firefox_con_el_Mozilla_Build_System
-tags:
-  - Complementos
-  - Documentación_de_compilado
-  - Todas_las_Categorías
-  - XPCOM
-  - extensiones
----
-<p> </p>
-
-<div class="note"><strong>Nota:</strong> Todas las instrucciones de este artículo sólo son aplicables a la rama 1.8 de Mozilla (p.e. Firefox 1.5). Intentaré mantener actualizada la versión estable aunque de hecho no deberías asumir que esto funcionará con la rama 1.5 (p.e, Firefox 1.0) o anteriores.</div>
-
-<p>Existe una <a href="/es/Extensiones" title="es/Extensiones">infinidad de documentación</a> sobre la creación de extensiones para Firefox. Sin embargo, actualmente todos esos documentos asumen que estás desarrollando tu extensión utilizando únicamente <a href="/es/XUL" title="es/XUL">XUL</a> y <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a>. Para las extensiones complejas puede ser necesario crear componentes en C++ que proporcionen funcionalidades adicionales. Las razones por las que podrías querer agregar componentes C++ en tu extensión incluyen:</p>
-
-<ul>
- <li>La necesidad de un alto rendimiento más allá de lo que te ofrece el código JavaScript.</li>
- <li>El uso de bibliotecas de terceras partes escritas en C o en C++.</li>
- <li>El uso de interfaces de Mozilla que no están disponibles vía <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> (p.e, <a href="/es/NSPR" title="es/NSPR">NSPR</a>).</li>
-</ul>
-
-<p>Este artículo describe cómo configurar el entorno de desarrollo para una extensión de Firefox grande y compleja utilizando parcial o totalmente los requerimientos ya mencionados. El proceso de reunir esta información ha sido de algún modo un calvario debido a la falta de información publicada sobre este tema, aunque varios miembros de la comunidad de desarrolladores de Mozilla han colaborado en su creación. Ellos han mostrado una paciencia extraordinaria respondiendo preguntas típicas de novatos ignorantes. Me quedo corto si digo que estoy lejos de ser un experto de Mozilla, aunque voy mejorando. Puede que muchas partes de este documento sean imprecisas, confusas o simplemente incorrectas. De hecho, una de mis metas al escribir esto es afinar dichas instrucciones hasta que constituyan una guía definitiva para los hackers del núcleo que quieran ampliar la plataforma Firefox. Si tú eres uno de los muchos que saben más que yo sobre esto, tu ayuda mejorando este artículo será gratamente recibida.</p>
-
-<p>También debería enfatizar que <em>no</em> tienes por qué compilar Mozilla o utilizar el sistema de compilación de Mozilla si quieres crear componentes C++ para Mozilla. Si sólo buscas crear un componente <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> o dos, este artículo será algo excesivo y puede que te interese mirar <a class="external" href="http://www.iosart.com/firefox/xpcom/">esta guía</a> en su lugar. Por otra parte, si tienes experiencia desarrollando o dirigiendo un equipo y sabes que tienes que desarrollar una extensión grande y compleja, probablemente hagas bien en considerar la aproximación descrita en este artículo.</p>
-
-<p>Una última nota: sólo he probado dichas técnicas dentro de Firefox aunque probablemente funcionarán más o menos bien en otras plataformas basadas en Gecko como Thunderbird o SeaMonkey. Si alguien puede confirmar esto y/o suministrar guías de estilo para aquello en lo que difiere actualizaré el artículo para incorporar esta información.</p>
-
-<h3 id="Y_Bambi_y_Mozilla_se_encontraron..." name="Y_Bambi_y_Mozilla_se_encontraron...">Y Bambi y Mozilla se encontraron...</h3>
-
-<p>Nada en este artículo es para cobardes. En particular el primer paso conlleva la compilación de Mozilla, lo cual es un gran... no, un inmenso proyecto. Muchos desarrolladores inteligentes han sido llevados al borde de la locura intentando compilarlo por  primera vez. Si no tienes experiencia desarrollando C++ no deberías ni preocuparte. Sigue con JavaScript.</p>
-
-<h4 id="Plataformas_Windows" name="Plataformas_Windows">Plataformas Windows</h4>
-
-<p>La primera vez que compilé Mozilla utilicé <a href="/es/Prerrequisitos_de_compilaci%C3%B3n_en_Windows" title="es/Prerrequisitos_de_compilación_en_Windows">esta guía</a>. Ni siquiera puedo recordar por qué, pero me quedé pillado unas cuantas veces, aunque la odisea llevó más tiempo de lo que me había imaginado al principio. Me cargué los muebles y me arranqué el pelo. Aquí tienes una <a class="external" href="http://whereswalden.com/mozilla/msvcfree/">guía comprensiva rápida</a>, bien redactada. Sigue cada paso metódicamente y probablemente todo irá bien. Céntrate en el hecho de que una vez hayas completado la compilación, posiblemente el resto del trabajo no conllevará esfuerzo alguno. Posiblemente.</p>
-
-<h4 id="Otras_plataformas" name="Otras_plataformas">Otras plataformas</h4>
-
-<p>En otras plataformas, léase Linux y MacOS, el proceso es mucho más sencillo. Todas las herramientas para compilar están disponibles de forma integrada y por tanto todo lo que tienes que hacer es ejecutar algunas órdenes en el terminal. Puedes encontrar las instrucciones completas para casi cualquier SO <a href="/es/Documentaci%C3%B3n_de_compilaci%C3%B3n" title="es/Documentación_de_compilación">aquí</a>.</p>
-
-<h3 id="Estructurar_tu_proyecto" name="Estructurar_tu_proyecto">Estructurar tu proyecto</h3>
-
-<p>Mozilla incorpora un número de extensiones complejas que son integradas en su proceso de compilación. Es así que ha sido necesario resolver todos los problemas inherentes a la creación y registro de componentes XPCOM, a la compilación de ficheros JAR y los manifiestos; instalando el montón en el directorio <code>extensions</code> de Firefox y así sucesivamente. Así pues, lo mejor para nosotros es aprovecharnos de esta infraestructura para construir nuestra extensión.</p>
-
-<p>Antes que nada, elige un nombre con gancho para tu extensión y crea un directorio con ese nombre bajo el directorio <code>/mozilla/extensions/</code>. Utiliza sólo minísculas. Deberías ver un montón de otros directorios (<code>inspector/</code>, <code>reporter/</code>, etc...) al mismo nivel del árbol de directorios.</p>
-
-<p>Date cuenta  que antes de realmente construir nada, el sistema de desarrollo de Mozilla llama a un proceso que genera los makefiles usados por la compilación a partir de plantillas de makefiles llamadas <code>Makefile.in</code>. Los makefiles reales tienden a ser muy parecidos si no idénticos a las plantillas, pero la flexibilidad extra adquirida al obtener los makefiles generados dinámicamente es una de las cosas que hacen al sistema de compilación tan potente.</p>
-
-<h4 id="Anatom.C3.ADa_de_una_simple_extensi.C3.B3n_en_C.2B.2B" name="Anatom.C3.ADa_de_una_simple_extensi.C3.B3n_en_C.2B.2B">Anatomía de una simple extensión en C++</h4>
-
-<p>Asumiremos que estamos usando C++ para escribir componentes XPCOM que pueden ser usados tanto desde otros componentes C++ o desde JavaScript. El proceso de crear un componente es, en realidad, algo relativamente simple cuando se utiliza Mozilla Build System.</p>
-
-<p>El caso más simple ocurre cuando un componente va a consistir en un único directorio principal con dos subdirectorios, <code>public/</code> y <code>src/</code>. El directorio principal y cada subdirectorio deben contener un <code>Makefile.in</code> (a partir de ahora me referiré a este fichero como un makefile aunque, como sabemos, en la práctica es usado para generar los makefiles reales). Este makefile dice dos cosas: lo primero: lista los subdirectorios que componen la extensión por lo que el sistema de compilación conoce dónde buscar los makefiles adicionales. Después dà las instrucciones para compilar el sistema que crea una nueva extensión, en lugar de copiar los componentes directamente en el directorio de binarios de Firefox. La principal ventaja de utilizar una extensión es que es fácil empaquetarlo todo e instalarlo en otra máquina.</p>
-
-<p>Así pues, aquí tienes el makefile principal más básico y simplón que te puedas encontrar (<code>Makefile.in</code> en el directorio principal de la extensión):</p>
-
-<pre>DEPTH		= ../..
-topsrcdir	= @top_srcdir@
-srcdir		= @srcdir@
-VPATH		= @srcdir@
-
-include $(DEPTH)/config/autoconf.mk
-
-MODULE = myextension
-
-DIRS		= public src
-
-XPI_NAME		= myextension
-INSTALL_EXTENSION_ID	= myextension@mycompany.com
-XPI_PKGNAME		= myextension
-
-DIST_FILES = install.rdf
-
-include $(topsrcdir)/config/rules.mk
-</pre>
-
-<p>La descripción detallada del proceso de creación, describiendo las opciones clave de este makefile pueden ser encontradas <a href="/es/C%C3%B3mo_funciona_el_sistema_de_compilaci%C3%B3n_de_Mozilla" title="es/Cómo_funciona_el_sistema_de_compilación_de_Mozilla">aquí</a>. Tanto <strong>MODULE</strong> como <strong>XPI_NAME</strong> están asignados al nombre de tu extensión; deben aparecer repetidos en todos los makefiles del proyecto para que todos los ficheros acaben en el mismo lugar en el área de pruebas del XPI (ver más adelante). <strong>INSTALL_EXTENSION_ID</strong> es el ID único de tu extensión. Puede ser un GUID aunque el formato mostrado antes es más bonito y, asumámoslo, mucho más fácil de recordar. No tienes porqué proporcionar un <strong>XPI_PKGNAME</strong> aunque si creas un fichero XPI susceptible de ser distribuido, será creado automáticamente en el directorio raíz del área de pruebas del XPI (<code>/mozilla/$(MOZ_OBJDIR)/dist/xpi-stage/</code>).</p>
-
-<p>Toda extensión debe incluir un fichero <code>install.rdf</code> que le diga a Firefox cómo instalarla. Este fichero debería estar ubicado en el directorio principal de la extensión y tener este aspecto:</p>
-
-<pre>&lt;?xml version="1.0"?&gt;
-
-&lt;RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-     xmlns:em="http://www.mozilla.org/2004/em-rdf#"&gt;
-  &lt;Description about="urn:mozilla:install-manifest"&gt;
-    &lt;em:id&gt;myextension@mycompany.com&lt;/em:id&gt;
-    &lt;em:version&gt;0.1&lt;/em:version&gt;
-
-    &lt;em:targetApplication&gt;
-      &lt;!-- Firefox --&gt;
-      &lt;Description&gt;
-        &lt;em:id&gt;{ec8030f7-c20a-464f-9b0e-13a3a9e97384}&lt;/em:id&gt;
-        &lt;em:minVersion&gt;1.0+&lt;/em:minVersion&gt;
-        &lt;em:maxVersion&gt;1.0+&lt;/em:maxVersion&gt;
-      &lt;/Description&gt;
-    &lt;/em:targetApplication&gt;
-
-    &lt;!-- front-end metadata --&gt;
-    &lt;em:name&gt;My First Extension&lt;/em:name&gt;
-    &lt;em:description&gt;Just an example.&lt;/em:description&gt;
-    &lt;em:creator&gt;allpeers.com&lt;/em:creator&gt;
-    &lt;em:homepageURL&gt;http://www.allpeers.com/blog/&lt;/em:homepageURL&gt;
-  &lt;/Description&gt;
-&lt;/RDF&gt;
-</pre>
-
-<p>Existe una <a href="/es/Manifiestos_de_instalaci%C3%B3n" title="es/Manifiestos_de_instalación">descripción detallada</a> del formato del fichero <code>install.rdf</code>. Utiliza la variable <strong>DIST_FILES</strong> del makefile para decirle a <code>make</code> que copie el fichero en el directorio de la extensión y (opcionalmente) el fichero XPI.</p>
-
-<h4 id="Interfaces_p.C3.BAblicas" name="Interfaces_p.C3.BAblicas">Interfaces públicas</h4>
-
-<p>El directorio <code>public/</code> contiene todas las interfaces necesarias para que otros módulos puedan utilizarlas. Éstas pueden ser ficheros <a class="external" href="http://www.mozilla.org/scriptable/xpidl/idl-authors-guide/index.html">IDL</a> que describan interfaces <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a>, los cuales son utilizados para generar ficheros de cabecera normales de C++ para incluirlos en los ficheros fuente. También pueden ser ficheros de cabecera normales de C++ que son utilizados directamente por otros módulos. La forma más fácil de hacer esto último es usar implementaciones en línea para todos los métodos, por lo que no tendrás ninguna dependencia de enlazado adicional. En otro caso tendrás que utilizar enlazado estático en tu módulo si utilizas estas cabeceras públicas en otros módulos. Personalmente desaconsejo esta práctica (entre otras cosas porque el enlazado estático significa que el mismo código se carga más de una vez en memoria y el código no estará disponible desde JavaScript u otros lenguajes diferentes a C++) y animo a usar XPCOM siempre que sea posible.</p>
-
-<p>El makefile en el directorio <code>public/</code> debería parecerse a este modelo:</p>
-
-<pre>DEPTH		= ../../..
-topsrcdir	= @top_srcdir@
-srcdir		= @srcdir@
-VPATH		= @srcdir@
-
-include $(DEPTH)/config/autoconf.mk
-
-MODULE		= myextension
-XPIDL_MODULE	= myextension
-
-XPI_NAME = myextension
-
-EXPORTS = \
-		myHeader.h \
-		$(NULL)
-
-XPIDLSRCS	= \
-		myIFirstComponent.idl \
-		myISecondComponent.idl \
-		$(NULL)
-
-include $(topsrcdir)/config/rules.mk
-</pre>
-
-<p><strong>XPIDL_MODULE</strong> es el nombre del fichero XPT generado que contiene información de tipos sobre tus interfaces <a class="external" href="http://www.mozilla.org/scriptable/xpidl/idl-authors-guide/index.html">IDL</a>. Si tienes múltiples módulos, asegúrate de que utilizas un valor diferente de <strong>XPIDL_MODULE</strong> para cada uno. En caso contrario, el fichero XPT del primer módulo será sobrescrito por el segundo y obtendrás errores del tipo <strong>NS_ERROR_XPC_BAD_IID</strong> cuando intentes acceder a sus interfaces IDL desde el código. Los ficheros bajo <strong>EXPORTS</strong> son copiados directamente al directorio <code>/mozilla/$(MOZ_OBJDIR)/dist/include/myextension/</code> siendo así accesibles desde otros módulos (el valor de <strong>MOZ_OBJDIR</strong> se define en <code>/mozilla/.mozconfig</code>). XPIDLSRCS es ejecutado a través del procesador IDL y las cabeceras generadas de C++ son copiadas en el mismo directorio include. Además, se genera un fichero XPT (biblioteca de tipos) que se copia en el subdirectorio <code>components/</code> de tu extensión.</p>
-
-<h4 id="Ficheros_fuente" name="Ficheros_fuente">Ficheros fuente</h4>
-
-<p>Ahora es cuando hay que crear el makefile y los ficheros-fuente en el subdirectorio <code>src/</code>. Si estás implementando interfaces y las estás describiendo con IDL, la forma más fácil de hacer esto es dejando vacío el directorio <code>src/</code> y ejecutando <code>make</code> sólo en el directorio <code>public/</code>. Esto serà explicado en breve.</p>
-
-<p>Luego abre el fichero de cabecera generado para tu interfaz en <code>/mozilla/$(MOZ_OBJDIR)/dist/include/myextension/</code>. Este fichero tendrá algunas plantillas para los ficheros de componentes .H y .CPP que puedes copiar y pegar en tus ficheros de implementación. Todo lo que tienes que hacer es rellenar los huecos del fichero C++ con la implementación real y estarás listo para continuar.</p>
-
-<p>A continuación se muestra un ejemplo del makefile que necesitas colocar en tu directorio <code>src</code>.</p>
-
-<pre class="eval">DEPTH		= ../../..
-topsrcdir	= @top_srcdir@
-srcdir		= @srcdir@
-VPATH		= @srcdir@
-
-include $(DEPTH)/config/autoconf.mk
-
-IS_COMPONENT = 1
-MODULE = myextension
-LIBRARY_NAME =  myExtension
-
-XPI_NAME = myextension
-
-REQUIRES	= xpcom \
-		  string \
-		  $(NULL)
-
-CPPSRCS		= \
-		  myFirstComponent.cpp \
-		  mySecondComponent.cpp \
-		  myExtension.cpp \
-		  $(NULL)
-
-include $(topsrcdir)/config/rules.mk
-
-EXTRA_DSO_LDOPTS += \
-  $(XPCOM_GLUE_LDOPTS) \
-  $(NSPR_LIBS) \
-  $(NULL)
-
-# <span class="highlightred">NOTA: si estás codificando contra la versión 1.8.0 branch (no 1.8 branch o trunk),</span>
-# <span class="highlightred">la línea anterior no funcionará debido a problemas de modificadores del enlazador.</span>
-# En su lugar utiliza las siguientes variables:
-#
-# EXTRA_DSO_LDOPTS += \
-#   $(MOZ_COMPONENT_LIBS) \
-#   $(NULL)
-#
-# Por desgracia, usando MOZ_COMPONENT_LIBS se enlaza contra xpcom_core, lo que
-# significa que tus componentes no funcionarán en futuras versiones de Firefox.
-</pre>
-
-<p>La sección <code>REQUIRES</code> le dice a <code>make</code> qué módulos utilizan tus componentes. Esto provoca que los subdirectorios relevantes de <code>/mozilla/$(MOZ_OBJDIR)/dist/include/</code> sean añadidos a la ruta include del compilador de C++. Si estás incluyendo las cabeceras de Mozilla y el compilador es incapaz de encontrarlas, podría ser que no hayas listado todos los módulos necesarios aquí. <code>CPPSRCS</code> enumera los ficheros fuente que necesitan ser compilados.</p>
-
-<p>En este ejemplo, los dos primeros ficheros contienen la implementación de los dos componentes de la extensión. El fichero final <code>myExtension.cpp</code> contiene el código necesario para registrar dichos componentes, como se describirá en la siguiente sección.</p>
-
-<h4 id="Registrar_tus_componentes" name="Registrar_tus_componentes">Registrar tus componentes</h4>
-
-<p>Para poder usar tus componentes desde otros módulos de C++ y JavaScript primero tienes que registrarlos. Para hacerlo, tu extensión necesita implementar una clase que exponga la interfaz <code><a href="/es/NsIModule" title="es/NsIModule">nsIModule</a></code> la cual posee métodos para acceder a los componentes definidos en un módulo. Afortunadamente, esto puede ser llevado a cabo mediante el uso de unas pocas y simples macros por lo que no tienes que embarrarte con los detalles de qué está pasando internamente.</p>
-
-<p>El primer paso es definir un CID, un contract ID (o ID de contrato) y un nombre de clase para cada uno de tus componentes. Pega el siguiente código (adaptando los <strong>#defines</strong> según convenga) en la cabecera de cada componente que tenga que ser instanciado utilizando el administrador de componentes:</p>
-
-<pre>// {00000000-0000-0000-0000-000000000000}
-#define MYFIRSTCOMPONENT_CID \
-	{ 0x00000000, 0x0000, 0x0000, \
-	{ 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00 } }
-
-#define MYFIRSTCOMPONENT_CONTRACTID	"@mycompany.com/myfirst;1"
-#define MYFIRSTCOMPONENT_CLASSNAME	"My First Component"
-</pre>
-
-<p>Obviamente necesitas completar el CID con un GUID real. Bajo Windows puede ser generado utilizando <a class="external" href="http://www.microsoft.com/downloads/details.aspx?familyid=94551F58-484F-4A8C-BB39-ADB270833AFC">guidgen.exe</a>. Los Unixeros pueden utilizar uuidgen (viene de modo predeterminado en la mayoría de distribuciones de Unix y Linux).</p>
-
-<p>Ahora crea el fichero <code>myExtension.cpp</code> así:</p>
-
-<pre>#include "nsXPCOM.h"
-
-#include "nsIGenericFactory.h"
-
-/**
- * Components to be registered
- */
-#include "myFirstComponent.h"
-#include "mySecondComponent.h"
-
-NS_GENERIC_FACTORY_CONSTRUCTOR(myFirstComponent)
-NS_GENERIC_FACTORY_CONSTRUCTOR(mySecondComponent)
-
-//----------------------------------------------------------
-
-static const nsModuleComponentInfo components[] =
-{
-	{
-		MYFIRSTCOMPONENT_CLASSNAME,
-		MYFIRSTCOMPONENT_CID,
-		MYFIRSTCOMPONENT_CONTRACTID,
-		myFirstComponentConstructor
-	},
-	{
-		MYSECONDCOMPONENT_CLASSNAME,
-		MYSECONDCOMPONENT_CID,
-		MYSECONDCOMPONENT_CONTRACTID,
-		mySecondComponentConstructor
-	},
-};
-
-NS_IMPL_NSGETMODULE(MyExtension, components)
-</pre>
-
-<p>La macro <strong>NS_IMPL_NSGETMODULE</strong> crea el objeto de módulo apropiado suministrando acceso a todos los componentes listados en el array <code><a href="/es/NsModuleComponentInfo" title="es/NsModuleComponentInfo">nsModuleComponentInfo</a></code>.</p>
-
-<h4 id="Compilaci.C3.B3n" name="Compilaci.C3.B3n">Compilación</h4>
-
-<p>Como se dijo antes, probablemente querrás compilar tu extensión inmediatamente tras crear tus ficheros IDL para poder generar las plantillas C++ para las implementaciones del componente. Estoy asumiendo que ya has podido compilar Firefox sin problemas. Si no es así, vuelve inmediatamente al inicio de este artículo y no regreses hasta que hayas generado un <code>firefox.exe</code> funcional. <span class="comment">Creo que es una casilla del monopoly: Do not pass go. Do not collect $200.</span></p>
-
-<p>¿Sigues ahí? Bien, ahora vamos a modificar tu <code>.mozconfig</code> (en el directorio raíz <code>/mozilla/</code> para que tu extensión se compile junto con Mozilla. Añade la siguiente línea al final del fichero:</p>
-
-<pre>ac_add_options --enable-extensions=default,myextension
-</pre>
-
-<p>Ahora ejecuta <code>make</code> en el directorio raíz de Mozilla:</p>
-
-<pre>make -f client.mk build
-</pre>
-
-<p>Incluso aunque hayas compilado una versión actualizada de Firefox, tendrás que esperar un momento para que <code>make</code> pueda recorrer el árbol de Mozilla por completo buscando nuevo material (en mi máquina, que es bastante rápida, esto tarda unos 10-15 minutos). Finalmente alcanzará tu extensión y generará un montón de material bajo el directorio <code>/mozilla/$(MOZ_OBJDIR)/</code>:</p>
-
-<ul>
- <li>Varios ficheros de cabecera exportados y ficheros de cabecera generados (desde IDL) en <code>dist/include/myextension/</code></li>
- <li>Bibliotecas estáticas para tus módulos en <code>dist/lib/</code> (en el caso de que otros módulos quieran enlazar estáticamente a tu material en lugar de utilizar XPCOM).</li>
- <li>Un fichero XPI en <code>dist/xpi-stage/myextensión.xpi</code>.</li>
- <li>Los makefiles generados para tus proyectos en <code>extensions/myextension/</code> (recuerda que estamos bajo el directorio <code>/mozilla/$(MOZ_OBJDIR)/</code>.</li>
- <li>Todo lo demás en <code>dist/bin/extensions/<a class="link-mailto" href="mailto:myextension@mycompany.com" rel="freelink">myextension@mycompany.com</a>/</code>.</li>
-</ul>
-
-<p>Gran parte de este material no será creado en la primera pasada ya que <code>make</code> se impacientará cuando no encuentre los ficheros fuente para tus componentes. No te preocupes por eso, todo lo que necesitas son los ficheros de cabecera generados que contengan las plantillas de implementación en C++. Vuelve atrás y rellena la implementación en C++ de tus componentes para que puedan ser compilados la siguiente vez. Recuerda que no deberías modificar jamás, nunca, ningún fichero generado. Modifica siempre los ficheros utilizados para generarlos y vuelve a ejecutar <code>make</code>. Quizá haya excepciones a esta regla, pero si estás cambiando los ficheros generados directamente muy probablemente estás metiendo la pata.</p>
-
-<p>El proceso de recorrer el árbol completo de Mozilla lleva bastante tiempo. Si ya has compilado Mozilla puedes evitar esto creando un makefile para tu extensión directamente. Ve al directorio raíz de tu $(MOZ_OBJDIR) y (desde un shell compatible con bash) introduce:</p>
-
-<pre class="eval">../build/autoconf/make-makefile extensions/myextension
-</pre>
-
-<p>Si tu $(MOZ_OBJDIR) está ubicado fuera de tu $(TOPSRCDIR), necesitarás hacer:</p>
-
-<pre class="eval">$(TOPSRCDIR)/build/autoconf/make-makefile -t $(TOPSRCDIR) extensions/myextension
-</pre>
-
-<p>para que el script sepa dónde están tus fuentes (usará la ruta de la extensión que des relativa al directorio actual para resolver dónde quieres que vayan tus makefiles).</p>
-
-<p>Esto generará el makefile apropiado para tu extensión. Tanto si quieres compilar el árbol completo de Mozilla como si tomas este atajo, puedes compilar de ahora en adelante yendo a <code>/mozilla/$(MOZ_OBJDIR)/extensions/myextension/</code> y escribiendo "make" en la línea de órdenes. Esto debería compilar tu componente sin distraerse con el resto de Mozilla. Si todo va bien, verás tu fichero XPI en el área de pruebas de XPI. También verás la versión descomprimida (es decir, la estructura de directorios descomprimida) bajo <code>/mozilla/$(MOZ_OBJDIR)/dist/bin/extensions</code> (si algo va mal, averigua qué es, corrígelo y luego vuelve aquí y añádelo a este artículo).</p>
-
-<p>Para asegurarte de que la compilación ha finalizado realmente, lanza Firefox y comprueba que tu extensión aparece en la lista cuando selecciones Herramientas / Complementos. Si estás usando Firefox como tu navegador habitual (y si no, ¿por qué no?), puede que te moleste el hecho que de que tendrás que cerrar tu Firefox normal antes de ejecutar tu versión personalizada. Si es así, prueba a establecer la variable de entorno <strong>MOZ_NO_REMOTE</strong> a "1" antes de ejecutar la versión de desarrollo de Firefox. También necesitarás usar un perfil diferente para tu versión de desarrollo:</p>
-
-<pre class="eval">firefox -P <em>desarrollo</em>
-</pre>
-
-<p>Donde <em>desarrollo</em> se sustituye con el nombre del perfil extra que has creado. Esto te permitirá ejecutar ambas versiones de Firefox simultáneamente, ahorràndote montones de tiempo a lo largo del ciclo de compilación/prueba.</p>
-
-<h4 id="No_hay_nada_como_estar_en_chrome" name="No_hay_nada_como_estar_en_chrome">No hay nada como estar en chrome</h4>
-
-<p>¡Yuhuuuu! Ahora ya tienes una extensión que no hace absolutamente nada. Es hora de hacer algo con esos geniales componentes que implementaste y registraste. La forma más fácil de hacer esto es escribiendo algo de código <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a> y <a href="/es/XUL" title="es/XUL">XUL</a>. En este punto sería de mucha utilidad tener algo de experiencia <a href="/es/Extensiones" title="es/Extensiones">escribiendo extensiones "normales"</a> (p.e., sin utilizar componentes de C++ personalizadas). Si nunca has hecho esto, te recomiendo encarecidamente que pienses una idea guay para algo simple que siempre hayas querido hacer para Firefox y lo escribas. Mostrar sólo un nuevo elemento de menú que abra un cuadro de diálogo "¡Hola mundo!" sería ya un gran ejercicio de precalentamiento.</p>
-
-<p>Suponiendo que sabes cómo escribir extensiones en XUL/JavaScript, estarás al corriente de que la parte más importante va en el directorio <code>chrome/</code> de tu extensión. Bueno, el hecho de que estés utilizando también componentes C++ no cambia eso ni una pizca. Por tanto, ahora necesitas crear los directorios normales <code>content/</code>, <code>locale/</code> y <code>skin/</code> en los que has de poner tus ficheros chrome. Personalmente me gusta ubicar dichos directorios directamente bajo el directorio raíz de mi módulo pero supongo que no habrá diferencia si prefieres ponerlos bajo el subdirectorio <code>chrome/</code> o el que sea. ¡Viva la libertad!</p>
-
-<p>Una vez has escrito los ficheros chrome necesarios (por ejemplo, un overlay que añade un elemento de menú para instanciar y utilizar uno de tus componentes), necesitas empaquetarlo como parte de tu extensión. Esto es llevado a cabo a través del uso de un <a href="/es/Manifiestos_JAR" title="es/Manifiestos_JAR">manifiesto JAR</a>. Para nuestro ejemplo de extensión simple este fichero podría tener este aspecto:</p>
-
-<pre>myextension.jar:
-%  content myextension %content/
-%  locale myextension en-US %locale/en-US/
-%  skin myextension classic/1.0 %skin/classic/
-%  overlay chrome://browser/content/browser.xul chrome://myextension/content/MyExtensionOverlay.xul
-	content/MyExtensionOverlay.js		(content/MyExtensionOverlay.js)
-	content/MyExtensionOverlay.xul		(content/MyExtensionOverlay.xul)
-	locale/en-US/MyExtension.dtd		(locale/en-US/MyExtension.dtd)
-	locale/en-US/MyExtension.properties	(locale/en-US/MyExtension.properties)
-	skin/classic/MyExtension.css		(skin/classic/MyExtension.css)
-</pre>
-
-<p>Pon este código en un fichero llamado <code>jar.mn</code> en el directorio raíz de tu extensión, asegurándote de que las rutas en los paréntesis apuntan a los ficheros reales (relativos al directorio raíz). Además tienes que hacer un pequeño cambio al makefile del mismo directorio, añadiendo la siguiente línea:</p>
-
-<pre class="eval">USE_EXTENSION_MANIFEST = 1
-</pre>
-
-<p>Esto le dice a <code>make</code> que cree un único fichero de manifiesto llamado <code>chrome.manifest</code> en lugar de crear manifiestos separados con nombres tontos para cada paquete.</p>
-
-<p>Ahora ejecuta <code>make</code> de nuevo. Deberías ver un subdirectorio <code>chrome</code> en tu extensión (<code>/mozilla/$(MOZ_OBJDIR)/dist/bin/extensions/<a class="link-mailto" href="mailto:myextension@mycompany.com" rel="freelink">myextension@mycompany.com</a>/</code>). Observa que el directorio <code>chrome</code> contiene un fichero JAR (o sea, ZIP) con todos los ficheros chrome listados en <code>jar.mn</code> además de una estructura de directorio completa reflejo de la del fichero JAR. La estructura de directorio sin embargo está vacía. ¿Por qué? No lo sé. No te preocupes por esto, los ficheros en el JAR son los que realmente se usan.</p>
-
-<h4 id="Manteni.C3.A9ndolo_complejo" name="Manteni.C3.A9ndolo_complejo">Manteniéndolo complejo</h4>
-
-<p>Si estás desarrollando extensiones realmente complejas con un montón de componentes <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a>, probablemente desees dividir tu código en módulos más pequeños.</p>
-
-<h5 id="Extensiones_moderadamente_complejas" name="Extensiones_moderadamente_complejas">Extensiones moderadamente complejas</h5>
-
-<p>Para una extensión moderadamente compleja, probablemente bastará con dividir el código en módulos de un solo nivel. Supongamos que tienes un módulo <code>base/</code> que define un manojo de componentes XPCOM básicos y un módulo <code>advanced/</code> que define algunos componentes chrome así como otros componentes que usan a los básicos. La estructura del directorio debería lucir más o menos así:</p>
-
-<ul>
- <li>myextension
-  <ul>
-   <li>base
-    <ul>
-     <li>public</li>
-     <li>src</li>
-    </ul>
-   </li>
-   <li>advanced
-    <ul>
-     <li>content</li>
-     <li>locale
-      <ul>
-       <li>en-US</li>
-       <li>...other locales...</li>
-      </ul>
-     </li>
-     <li>public</li>
-     <li>skin
-      <ul>
-       <li>classic</li>
-       <li>...other skins...</li>
-      </ul>
-     </li>
-     <li>src</li>
-    </ul>
-   </li>
-  </ul>
- </li>
-</ul>
-
-<p>Más allá de eso, nada cambia. Los makefiles en los directorios <code>base/</code> y <code>advanced/</code> deberían tener más o menos el mismo aspecto que el makefile original del directorio raíz, sin olvidar cambiar la variable <strong>DEPTH</strong> para reflejar el hecho de que se han movido a un nivel más de profundidad respecto de la raíz de mozilla. También debes quitar la variable <strong>DIST_FILES</strong> porque va a estar en el makefile de nivel superior. Cada makefile que genere algo debería definir la variable <strong>XPI_NAME</strong> para asegurarse que los archivos generados van dentro de tu extensión y no dentro del directorio global <code>components/</code>. Define esto en cada makefile para asegurarte. Puedes usar el mismo <strong>MODULE</strong> para ambos casos, <code>base/</code> y <code>advanced/</code>, y así todos los archivos include generados irán al mismo directorio, pero asegúrate de no usar el mismo <strong>XPIDL_MODULE</strong> en los dos directorios <code>public/</code> o una de las bibliotecas de componentes (es decir, archivos XPT) sobrescribirá al otro y todo se echará a perder.</p>
-
-<p>Cada módulo debe tener también un valor diferente para la variable <strong>LIBRARY_NAME</strong>. Éste es el nombre de la biblioteca dinámica generada, así que si llamamos a las bibliotecas "myBase" y "myAdvance" entonces tendremos los archivos <code>myBase.dll</code> y <code>myAdvance.dll</code> (por lo menos así es en Windows). Y cada uno de estos módulos va a tener un archivo C++ separado para registrar componentes, así que va a haber dos archivos que lucirán como <code>myExtension.cpp</code> en el ejemplo original, digamos Base.cpp y Advanced.cpp. Por último, cada módulo tendrá, obviamente, su propio jar.mn, aunque pueden referenciar al mismo nombre de archivo JAR y nombre de paquete si quieres que todos los archivos chrome estén organizados en un mismo paquete y archivo JAR. El único que realmente permanece es install.rdf, que existe una vez y sólo una vez en el directorio raíz de la extensión.</p>
-
-<p>En cuanto al makefile de nivel superior, ahora tendrá este aspecto:</p>
-
-<pre>DEPTH		= ../..
-topsrcdir	= @top_srcdir@
-srcdir		= @srcdir@
-VPATH		= @srcdir@
-
-include $(DEPTH)/config/autoconf.mk
-
-MODULE = myextension
-
-DIRS		= base advanced
-
-XPI_NAME               = myextension
-INSTALL_EXTENSION_ID   = myextension@mycompany.com
-XPI_PKGNAME		= myextension
-
-DIST_FILES = install.rdf
-
-include $(topsrcdir)/config/rules.mk
-</pre>
-
-<h5 id="Extensiones_realmente_complejas" name="Extensiones_realmente_complejas">Extensiones realmente complejas</h5>
-
-<p>En algún momento, hasta un solo módulo puede crecer hasta un punto en que desees dividirlo en submódulos. La diferencia entre tener módulos diferentes y tener un módulo dividido en submódulos es que todos los submódulos comparten el mismo archivo para registrar componentes (el famoso archivo myExtension.cpp) y cuando lo compilas genera una sola biblioteca dinámica. La decisión para dividir un módulo en submódulos es sólo cuestión de organización del código, no afecta al producto final.</p>
-
-<p>Para dividir un módulo en submódulos primero debes crear un directorio para cada submódulo. Luego debes crear un directorio adicional llamado <code>build/</code>. Cada submódulo será configurado para crear una biblioteca estática y el directorio <code>build/</code> las unirá para crear una sola biblioteca dinámica. ¿Confundido? Aquí hay un ejemplo mostrando la subrama <code>advanced/</code> del directorio <code>myextension/</code>:</p>
-
-<ul>
- <li>advanced
-  <ul>
-   <li>build</li>
-   <li>intricate
-    <ul>
-     <li>public</li>
-     <li>src</li>
-    </ul>
-   </li>
-   <li>multifarious
-    <ul>
-     <li>public</li>
-     <li>src</li>
-    </ul>
-   </li>
-   <li>content</li>
-   <li>locale
-    <ul>
-     <li>en-US</li>
-     <li>...otros idiomas...</li>
-    </ul>
-   </li>
-   <li>skin
-    <ul>
-     <li>classic</li>
-     <li>...otros skins...</li>
-    </ul>
-   </li>
-  </ul>
- </li>
-</ul>
-
-<p>Como puedes ver, hemos dividido <code>advanced/</code> dentro de dos submódulos: <code>intrincate/</code> y <code>multifarious/</code> y hemos añadido un directorio <code>build/</code> adicional. Hemos dejado los directorios chrome directamente bajo <code>advanced/</code>, los cuales no están enlazados a ningún submódulo específico. Esto significa que jar.mn estará en el mismo lugar.</p>
-
-<p>Los makefiles <code>intricate/</code> y <code>multifarious/</code> lucirán casi igual al makefile original <code>advanced/</code>, pero necesitamos modificarlos un poquito. Como siempre, debemos ajustar la variable <strong>DEPTH</strong> porque el makefile está más profundo en la estructura de directorios. Y deberíamos cambiar <strong>LIBRARY_NAME</strong> para indicar que estamos generando una biblioteca estática para cada submódulo. Por convenio, se usa el sufijo "_s" para este propósito. Así que las llamaremos "myIntricate_s" y "myMultifarious_s". Finalmente definimos la variable <strong>FORCE_STATIC_LIB</strong> para que quede un makefile que comience más o menos así:</p>
-
-<pre>DEPTH		= ../../../../..
-topsrcdir	= @top_srcdir@
-srcdir		= @srcdir@
-VPATH		= @srcdir@
-
-include $(DEPTH)/config/autoconf.mk
-
-MODULE = myextension
-LIBRARY_NAME = myIntricate_s
-FORCE_STATIC_LIB = 1
-
-XPI_NAME = myextension
-
-...más cosas aquí...
-</pre>
-
-<p>El makefile build une las bibliotecas estáticas generadas por los submódulos y crea una única biblioteca dinámica de componentes:</p>
-
-<pre>DEPTH		= ../../../..
-topsrcdir	= @top_srcdir@
-srcdir		= @srcdir@
-VPATH		= @srcdir@
-
-include $(DEPTH)/config/autoconf.mk
-
-IS_COMPONENT = 1
-MODULE = myextension
-LIBRARY_NAME = myAdvanced
-
-XPI_NAME = myextension
-
-DEFINES += XPCOM_GLUE
-
-SHARED_LIBRARY_LIBS = \
-		$(DIST)/lib/$(LIB_PREFIX)myIntricate_s.$(LIB_SUFFIX) \
-		$(DIST)/lib/$(LIB_PREFIX)myMultifarious_s.$(LIB_SUFFIX) \
-                $(DIST)/lib/$(LIB_PREFIX)xpcomglue_s.$(LIB_SUFFIX) \
-                $(DIST)/lib/$(LIB_PREFIX)xpcom.$(LIB_SUFFIX) \
-                $(DIST)/lib/$(LIB_PREFIX)nspr4.$(LIB_SUFFIX) \
-                $(DIST)/lib/$(LIB_PREFIX)plds4.$(LIB_SUFFIX) \
-                $(DIST)/lib/$(LIB_PREFIX)plc4.$(LIB_SUFFIX) \
-		$(NULL)
-
-REQUIRES	= \
-		xpcom \
-		string \
-		$(NULL)
-
-CPPSRCS		= \
-		Advanced.cpp \
-		$(NULL)
-
-include $(topsrcdir)/config/rules.mk
-
-LOCAL_INCLUDES += \
-        -I$(srcdir)/../intricate/src \
-        -I$(srcdir)/../multifarious/src \
-        $(NULL)
-</pre>
-
-<p>El makefile en el directorio <code>advanced/</code> debería listar los directorios <code>intricate/</code>, <code>multifarious/</code> y <code>build/</code> en su variable <strong>DIRS</strong>. Asegúrate de que <code>build/</code> esté al final porque no puede crear la biblioteca hasta que los otros makefiles hayan sido completados.</p>
-
-<h3 id="Otros_temas" name="Otros_temas">Otros temas</h3>
-
-<h4 id="Agregar_archivos_de_datos_a_tus_extensiones" name="Agregar_archivos_de_datos_a_tus_extensiones">Agregar archivos de datos a tus extensiones</h4>
-
-<p>En algunos casos, puedes desear incluir archivos adicionales en tus extensiones que no pertenecen al subdirectorio <code>chrome/</code>. Algunos ejemplos pueden ser archivos de bases de datos o esquemas XML. Esto puede conseguirse añadiendo, en el makefile, código personalizado que copie los ficheros desde el árbol de origen hacia el directorio de destino de la extensión.</p>
-
-<h5 id="Copiar_archivos_de_datos_al_directorio_de_destino" name="Copiar_archivos_de_datos_al_directorio_de_destino">Copiar archivos de datos al directorio de destino</h5>
-
-<p>Supongamos que tienes algunos ficheros de datos que contienen información estadística que deseas incluir en tu extensión y que esté disponible para tus componentes. Tienes estos archivos, cuya extensión es .TXT, dentro del subdirectorio <code>stats/</code> bajo el directorio de tu extensión en el árbol del código fuente. Puedes usar el siguiente makefile para copiar los ficheros al directorio de destino de la extensión:</p>
-
-<pre>libs::
-	if test ! -d $(FINAL_TARGET)/stats; then \
-		$(NSINSTALL) -D $(FINAL_TARGET)/stats; \
-	fi
-	$(INSTALL) $(srcdir)/*.txt $(FINAL_TARGET)/stats
-</pre>
-
-<h5 id="Acceder_a_ficheros_de_datos_desde_los_componentes" name="Acceder_a_ficheros_de_datos_desde_los_componentes">Acceder a ficheros de datos desde los componentes</h5>
-
-<p>El truco para acceder a los ficheros es averiguar dónde está el directorio <em>home</em> de tu extensión. Los rumores dicen que en el futuro esto será posible a través del interface <a href="/es/NsExtensionManager" title="es/NsExtensionManager">nsExtensionManager</a> o alguna cosa similar. Mientras tanto, hay un modo simple y fiable de hacer esto. En la implementación de cualquier componente JavaScript XPCOM hay un símbolo especial <strong>__LOCATION__</strong> (dos subrayados delante y dos detrás) que apunta al fichero de implementación del componente. Así, puedes escribir un componente simple que deduzca el directorio raíz de tu extensión extrapolando desde su ubicación.</p>
-
-<p><a class="external" href="http://www.builderau.com.au/program/soa/Creating_XPCOM_components_with_JavaScript/0,39024614,39206503,00.htm">Este artículo</a> explica cómo crear un componente XPCOM en JavaScript. Necesitarás un fichero IDL para un interfaz que tenga un aspecto más o menos así:</p>
-
-<pre>interface myILocation : nsISupports
-{
-    readonly attribute nsIFile locationFile;
-};
-</pre>
-
-<p>Sitúa el fichero IDL en el directorio <code>public/</code> del proyecto o subproyecto. En el directorio <code>src/</code> coloca el fichero JavaScript que implementa el componente. La implementación del componente incluirá los métodos para solicitar la ruta o el fichero para el directorio <em>home</em> de la extensión.</p>
-
-<pre>myLocation.prototype =
-{
-  QueryInterface: function(iid)
-  {
-    if (iid.equals(nsISupports))
-      return this;
-    if (iid.equals(myILocation))
-      return this;
-
-    Components.returnCode = Components.results.NS_ERROR_NO_INTERFACE;
-    return null;
-  },
-
-  get locationFile()
-  {
-     return __LOCATION__.parent.parent;
-  }
-}
-</pre>
-
-<p>Esto asume que el componente se encuentra en un subdirectorio del directorio de la extensión (por convenio, este directorio se llama <code>components/</code>). La propiedad <code>parent</code> de <strong>__LOCATION__</strong> devuelve <code>components/</code>, y el valor <code>parent</code> de éste es el directorio de la extensión.</p>
-
-<p>El último paso es modificar el makefile del directorio de orìgen donde colocaste el fichero JavaScript para que sea copiado dentro de la ubicación apropiada en la extensión.</p>
-
-<pre>libs::
-	$(INSTALL) $(srcdir)/*.js $(FINAL_TARGET)/components
-</pre>
-
-<p>Ahora puedes instanciar este componente y usar la propiedad <code>locationFile</code> para obtener un interface <code><a href="/es/NsIFile" title="es/NsIFile">nsIFile</a></code> que apunte al directorio <em>home</em> de tu extensión.</p>
-
-<h4 id="Usar_otras_bibliotecas" name="Usar_otras_bibliotecas">Usar otras bibliotecas</h4>
-
-<p>Para extensiones más sofisticadas, tal vez desees integrar bibliotecas de terceros que proveerán funciones especializadas para conectividad de bases de datos, procesamiento de imágenes, funciones de red y otras tareas. Si quieres que tu extensión se ejecute en todas las plataformas de FireFox, necesitarás el código fuente de la biblioteca en cuestión, así que asumiré que está disponible.</p>
-
-<p>La mejor forma de hacerlo, desde el punto de vista del ciclo de desarrollo, es crear un makefile estilo-Mozilla para la biblioteca. Esto funciona bien para bibliotecas que tienen un proceso de compilación sencillo sin demasiada configuración. Un buen ejemplo de esto es la biblioteca SQLite incluida en el árbol de compilación de Mozilla en <code>db/sqlite</code>. Adaptando el makefile de esta manera, la biblioteca se crea como una parte estándar del proceso de compilado de Mozilla, lo cual elimina pasos adicionales. El lado malo es que necesitarás actualizar el makefile modificado cada vez que se publique una nueva versión de la biblioteca.</p>
-
-<p>Para bibliotecas que tienen un proceso de configuración complejo, que use un compilador no-estándar, o que tengan alguna otra característica especial, quizá no sea viable crear un makefile compatible con el estilo Mozilla. En este caso, recomendaría colocar la distribución completa de la biblioteca dentro del proyecto o subproyecto que la utiliza. Por ejemplo, si la biblioteca <code>acmelib</code> se usa dentro del subproyecto <code>multifarious/</code> en el ejemplo de arriba, se colocaría como un subdirectorio bajo ese proyecto (en el mismo nivel que <code>public/</code> y <code>src/</code>).</p>
-
-<p>Por supuesto, esto significa que tendrás que compilar <code>acmelib</code> manualmente en cada plataforma antes de lanzar Mozilla. Pero por lo menos luego puedes referirte a los archivos include y las bibliotecas importadas desde tus componentes usando rutas relativas.</p>
-
-<h4 id="Compilar_para_m.C3.BAltiples_plataformas" name="Compilar_para_m.C3.BAltiples_plataformas">Compilar para múltiples plataformas</h4>
-
-<p>Información del Documento Original</p>
-
-<div class="originaldocinfo">
-<ul>
- <li>Autor: Matthew Gertner - Julio 26, 2005.</li>
- <li>Permission granted to migrate in Jan 2006, including permission to relicense under the CC:By-SA.</li>
- <li>Código Original: <a class="external" href="http://www.allpeers.com/blog/creating-complex-firefox-extensions/" rel="freelink">http://www.allpeers.com/blog/creatin...ox-extensions/</a></li>
-</ul>
-</div>
-
-<p> </p>
diff --git a/files/es/css/media_queries/index.html b/files/es/css/media_queries/index.html
deleted file mode 100644
index 997626e12d..0000000000
--- a/files/es/css/media_queries/index.html
+++ /dev/null
@@ -1,828 +0,0 @@
----
-title: CSS media queries
-slug: CSS/Media_queries
-tags:
-  - CSS
-  - Media
-  - Media Queries
-  - query
-translation_of: Web/CSS/Media_Queries/Using_media_queries
----
-<div>{{cssref}}</div>
-
-<p class="seoSummary">Las <strong>media queries</strong> (en español "consultas de medios") son útiles cuando deseas modificar tu página web o aplicación en función del tipo de dispositivo (como una impresora o una pantalla) o de características y parámetros específicos (como la resolución de la pantalla o el ancho del {{glossary("viewport")}} del navegador).</p>
-
-<p>Se utilizan para:</p>
-
-<ul>
- <li>Aplicar estilos condicionales con las <a href="/es/docs/Web/CSS/At-rule">reglas-at</a> {{cssxref("@media")}} e {{cssxref("@import")}} de <a href="/es/docs/Web/CSS">CSS</a>.</li>
- <li>Indicar medios específicos en los elementos {{HTMLElement("link")}}, {{HTMLElement("source")}} y otros elementos <a href="/es/docs/Web/HTML">HTML</a>.</li>
- <li><a href="/es/docs/Web/Guide/CSS/probando_media_queries">Testear y monitorizar los estados de los medios</a> usando los métodos de javascript {{domxref("Window.matchMedia()")}} y {{domxref("MediaQueryList.addListener()")}}.</li>
-</ul>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p> </p>
-
-<p>Las <em>media queries</em> consisten de un tipo de medio opcional y una o más expresiones de <em>características de medios</em>. Varias consultas se pueden combinar utilizando operadores lógicos. No distinguen entre mayúsculas y minúsculas.</p>
-
-<p>El resultado de la consulta es "verdadero" cuando el tipo de medio (si se especifica) coincide con el dispositivo en el que se está mostrando el documento y todas las expresiones en el <em>media query</em> son "verdaderas". En este caso, se aplica los estilos correspondientes, siguiendo las reglas usuales de cascada.</p>
-
-<p>Las consultas sobre tipos de medios desconocidos son siempre falsas.</p>
-
-<p> </p>
-
-<pre class="brush: html"><code class="brush: html">&lt;!-- CSS media query on a link element --&gt;
-</code>&lt;link rel="stylesheet" media="(max-width: 800px)" href="example.css" /&gt;
-
-<code class="brush: html">&lt;!-- CSS media query within a style sheet --&gt;
-&lt;style&gt;
-@media (max-width: 600px) {
-  .facet_sidebar {
-    display: none;
-  }
-}
-&lt;/style&gt;</code>
-</pre>
-
-<h3 id="Media_Types">Media Types</h3>
-
-<p>Los <em>Media Types</em> (tipos de medios) describen la categoría general de un dispositivo. Excepto cuando se utilizan los operadores lógicos <code>not</code> o <code>only</code>, el tipo de medio es opcional y será interpretada como <code>all</code>.</p>
-
-<dl>
- <dt><code id="all">all</code></dt>
- <dd>Apto para todos los dispositivos.</dd>
- <dt><code id="print">print</code></dt>
- <dd>Destinado a material impreso y visualización de documentos en una pantalla en el modo de vista previa de impresión. </dd>
- <dt><code id="screen">screen</code></dt>
- <dd>Destinado principalmente a las pantallas.</dd>
- <dt><code id="speech">speech</code></dt>
- <dd>Destinado a sintetizadores de voz.</dd>
-</dl>
-
-<div class="blockIndicator note">
-<p><strong>Tipos de medios depreciados:</strong> CSS2.1 y <a href="/es/docs/">Media Queries 3</a> definieron varios tipos de medios adicionales (<code>tty</code>, <code>tv</code>, <code>projection</code>, <code>handheld</code>, <code>braille</code>, <code>embossed</code> y <code>aural</code>), pero fueron desaprobados en <a href="https://drafts.csswg.org/mediaqueries/#media-types">Media Queries 4</a> y no deberían ser usados. El tipo <code>aural</code> ha sido reemplazado por <code>speech</code>, que es similar.</p>
-</div>
-
-<h3 id="Operadores_Lógicos">Operadores Lógicos</h3>
-
-<p>Se pueden redactar queries utilizando operadores lógicos, incluyendo <code>not</code>, <code>and</code>, y <code>only</code>.</p>
-
-<p>Además se puede combinar múltiples queries en una lista separada por comas múltiples; si cualquiera de las queries en la lista es verdadera, la hoja de estilo asociada es aplicada. Esto es equivalente a una operación lógica "or".</p>
-
-<h4 id="and">and</h4>
-
-<p>El operador <code>and</code> es usado para colocar juntas múltiples funciones multimedia. Un query básico con el tipo de medio especificado como <code>all</code> puede lucir así:</p>
-
-<pre class="brush: css">@media (min-width: 700px) { ... }</pre>
-
-<p>Si usted quiere aplicar ese query solo si la pantalla esta en formato horizontal, usted puede utilizar el operador <code>and</code> y colocar la siguiente cadena:</p>
-
-<pre class="brush: css">@media (min-width: 700px) and (orientation: landscape) { ... }</pre>
-
-<p>La siguiente query solo retornara verdadero si la ventana tiene un ancho de 700px o mas y la pantalla esta en formato horizontal. Ahora si usted quiere aplicar esta opción solo si tipo de medio es TV, usted puede utilizar la siguiente cadena:</p>
-
-<pre class="brush: css">@media tv and (min-width: 700px) and (orientation: landscape) { ... }</pre>
-
-<p>Esta query solo se aplica si el tipo de medio es TV, la ventana tiene 700px de ancho o mas y la pantalla esta en formato horizontal.</p>
-
-<h4 id="lista_separada_por_comas">lista separada por comas</h4>
-
-<p>Las listas separadas por comas se comportan como el operador <code>or</code> cuando es usado en media queries. Cuando utilice una lista separada por comas y alguno de los queries retorna verdadero, el estilo o la hoja de estilos sera aplicada. Cada query en una lista separada por comas es tratado como una query individual y cualquier operador aplicado a un medio no afectara a los demás. Esto significa que cada query en una lista separada por comas puede tener como objetivo diferentes medios, tipos y estados.</p>
-
-<p>Si usted quiere aplicar una serie de estilos para un equipo con un ancho mínimo de 700px o si el dispositivo esta colocado en horizontal, usted puede escribir lo siguiente:</p>
-
-<pre class="brush: css">@media (min-width: 700px), handheld and (orientation: landscape) { ... }</pre>
-
-<p>Por lo tanto, si esta en una <code>screen</code> con una ventana de 800px de ancho, la declaración del medio retornara verdadero debido a la primera parte de la lista, si aplicamos esto a un dispositivo <code>@media all and (min-width: 700px)</code> podría retornar verdadero a pesar del hecho de que la pantalla falle la verificación tipo de medio del <code>handheld</code> en la segunda query. Por otra parte si estuviese en un <code>handheld</code> con un ancho de ventana de 500px, la primera parte de la lista fallaría pero la segunda parte retornara verdadero debido a la declaración de medio.</p>
-
-<h4 id="not">not</h4>
-
-<p>El operador <code>not</code> aplica a todo el query y retorna verdadero si es posible y sino retorna falso (como por ejemplo <code>monochrome</code> en un monitor a color o una ventana con un ancho mínimo de <code>min-width: 700px</code> en un monitor de 600px). Un <code>not</code> negara un query si es posible pero no a todos los query posibles si están ubicados en una lista separada por comas. El operador <code>not</code> no puede ser usado para negar un query individual, solo para un query completo. Por ejemplo<span style="line-height: 1.572;">, el </span><code style="font-size: 14px;">not</code><span style="line-height: 1.572;"> en el siguiente query es evaluado al final:</span></p>
-
-<pre class="brush: css" style="font-size: 14px;">@media not all and (monochrome) { ... }
-</pre>
-
-<p>Esto significa que el query es evaluado de la siguiente forma:</p>
-
-<pre class="brush: css" style="font-size: 14px;">@media not (all and (monochrome)) { ... }
-</pre>
-
-<p>... y no de esta forma:</p>
-
-<pre class="brush: css" style="font-size: 14px;">@media (not all) and (monochrome) { ... }</pre>
-
-<p>Otro Ejemplo:</p>
-
-<pre class="brush: css" style="font-size: 14px;">@media not screen and (color), print and (color)
-</pre>
-
-<p>Es evaluado de la siguiente forma:</p>
-
-<pre class="brush: css" style="font-size: 14px;">@media (not (screen and (color))), print and (color)</pre>
-
-<h4 id="only">only</h4>
-
-<p><span style="line-height: 21px;">El operador </span><code style="font-size: 14px;">only</code><span style="line-height: 21px;"> previene que navegadores antiguos que no soportan queries con funciones apliquen los estilos asignados:</span></p>
-
-<pre class="brush: html">&lt;link rel="stylesheet" media="only screen and (color)" href="Ejemplo.css" /&gt;
-</pre>
-
-<h3 id="Pseudo-BNF">Pseudo-BNF</h3>
-
-<pre class="syntaxbox">media_query_list: &lt;media_query&gt; [, &lt;media_query&gt; ]*
-media_query: [[only | not]? &lt;media_type&gt; [ and &lt;expression&gt; ]*]
-  | &lt;expression&gt; [ and &lt;expression&gt; ]*
-expression: ( &lt;media_feature&gt; [: &lt;value&gt;]? )
-media_type: all | aural | braille | handheld | print |
-  projection | screen | tty | tv | embossed
-media_feature: width | min-width | max-width
-  | height | min-height | max-height
-  | device-width | min-device-width | max-device-width
-  | device-height | min-device-height | max-device-height
-  | aspect-ratio | min-aspect-ratio | max-aspect-ratio
-  | device-aspect-ratio | min-device-aspect-ratio | max-device-aspect-ratio
-  | color | min-color | max-color
-  | color-index | min-color-index | max-color-index
-  | monochrome | min-monochrome | max-monochrome
-  | resolution | min-resolution | max-resolution
-  | scan | grid</pre>
-
-<p>Los queries son insensibles a las mayúsculas o minúsculas. Media queries que contengan tipos de medios desconocidos siempre retornaran falso.</p>
-
-<div class="note"><strong>Nota:</strong> Los paréntesis son requeridos alrededor de las expresiones, no utilizarlos es un error.</div>
-
-<h2 id="Funciones_Multimedia">Funciones Multimedia</h2>
-
-<p>La mayoría de las funciones multimedia pueden ser precedidas por "min-" o "max-" para expresar "greater or equal to" o "less than or equal to". Esto elimina la necesidad de usar los símbolos "&lt;" y "&gt;" los cuales podrían causar conflictos con HTML y XML. Si usted usa una función multimedia sin especificarle un valor, la expresión retornara verdadero si el valor es diferente de cero.</p>
-
-<div class="note"><strong>Nota:</strong> Si una función multimedia no aplica al dispositivo donde el navegador esta corriendo, la expresión que contiene esa función siempre retornara falso. Por Ejemplo, cambiar la relación de aspecto en un dispositivo aural siempre resultara falso.</div>
-
-<h3 id="color">color</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;color&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> si</p>
-
-<p>Indica el numero de bits por componente de color del dispositivo de salida. Si el dispositivo no soporta colores, este valor es 0.</p>
-
-<div class="note"><strong>Nota:</strong> Si el componente de color tiene diferente numero de bits por color, entonces el valor mas pequeño es utilizado. Por Ejemplo, si una pantalla utiliza 5 bits para azul y rojo y 6 bits para el verde, entonces se utilizan 5 bits por componente de color. Si el dispositivo utiliza índices de color se usara el mínimo valor de bits por color en la tabla.</div>
-
-<h4 id="Ejemplos">Ejemplos</h4>
-
-<p>Para aplicar una hoja de estilo a todos los dispositivos que soporten colores:</p>
-
-<pre class="brush: css">@media all and (color) { ... }
-</pre>
-
-<p>Para aplicar una hoja de estilo a dispositivos con al menos 4 bits por componente de color:</p>
-
-<pre class="brush: css">@media all and (min-color: 4) { ... }
-</pre>
-
-<h3 id="color-index">color-index</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max</strong><strong>:</strong> sí</p>
-
-<p>Indica el numero de entradas en la tabla de colores para el dispositivo de salida.</p>
-
-<h4 id="Ejemplos_2">Ejemplos</h4>
-
-<p>Para indicar que una hoja de estilo debe aplicarse a todos los dispositivos utilizando índices de color, usted puede hacer esto:</p>
-
-<pre class="brush: css">@media all and (color-index) { ... }
-</pre>
-
-<p>Para aplicar una hoja de estilo a un dispositivo con un índice de al menos 256 colores:</p>
-
-<pre class="brush: html">&lt;link rel="stylesheet" media="all and (min-color-index: 256)" href="http://foo.bar.com/stylesheet.css" /&gt;
-</pre>
-
-<h3 id="aspect-ratio">aspect-ratio</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;ratio&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
- <strong>Acepta prefijos min/max</strong><strong>:</strong> sí</p>
-
-<p>Describe el aspecto de una zona a mostrar en el dispositivo de salida. Este valor consiste en enteros positivos separados por una barra ("/"). Esto representa la razón de aspecto de los pixeles horizontales (primer termino) a los pixeles verticales (segundo termino).</p>
-
-<h4 id="Ejemplo">Ejemplo</h4>
-
-<p>Lo siguiente selecciona una hoja de estilo especial para ser aplicada donde la proporción del tamaño de la pantalla del dispositivo de salida es al menos la misma de ancho que de alto.</p>
-
-<pre class="brush: css">@media screen and (min-aspect-ratio: 1/1) { ... }</pre>
-
-<p>Este selecciona el estilo cuando la proporción de aspecto sea 1:1 o superior. En otras palabras este estilo solo sera aplicado cuando el área de visualización sea cuadrada u horizontal.</p>
-
-<h3 id="device-aspect-ratio">device-aspect-ratio</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;ratio&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>Describe la proporción de aspecto del dispositivo de salida. Este valor consiste de dos enteros positivos separados por una barra ("/"). Este representa la proporción de aspecto de los pixeles horizontales (primer termino) a los pixeles verticales (segundo termino).</p>
-
-<h4 id="Ejemplo_2">Ejemplo</h4>
-
-<p>El siguiente código selecciona una hoja de estilo especial para ser aplicada en pantallas panorámicas ("widescreen").</p>
-
-<pre class="brush: css">@media screen and (device-aspect-ratio: 16/9), screen and (device-aspect-ratio: 16/10) { ... }</pre>
-
-<p>Este selecciona el estilo cuando la proporción de aspecto sea 16:9 o 16:10.</p>
-
-<h3 id="device-height">device-height</h3>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;length&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>Describe la altura del dispositivo de salida (ya sea la totalidad de la pantalla o página y no el área del documento a renderizar).</p>
-
-<h3 id="device-width">device-width</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;length&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>Describe la anchura del dispositivo de salida (ya sea la totalidad de la pantalla o página y no el área del documento a renderizar).</p>
-
-<h4 id="Ejemplo_3">Ejemplo</h4>
-
-<p>Para aplicar una hoja de estilo a un documento cuando este sea mostrado en una pantalla de menos de 800px de ancho, usted puede usar esto:</p>
-
-<pre class="brush: html">&lt;link rel="stylesheet" media="screen and (max-device-width: 799px)" /&gt;
-</pre>
-
-<h3 id="grid">grid</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> all<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Determina cuando el dispositivo de salida es un dispositivo de cuadrícula o de mapa de bits. Si el dispositivo esta basado en una cuadrícula (como una terminal TTY o una pantalla de teléfono de solo texto), el valor sera 1, de lo contrario sera 0.</p>
-
-<h4 id="Ejemplo_4">Ejemplo</h4>
-
-<p>Para aplicar una hoja de estilo a un dispositivo portátil con una pantalla de 15 caracteres o mas estrecha:</p>
-
-<pre class="brush: css">@media handheld and (grid) and (max-width: 15em) { ... }
-</pre>
-
-<div class="note"><strong>Nota:</strong> La unidad "em" tiene un significado especial para los dispositivos de cuadrícula; ya que la anchura exacta de una "em" no puede ser determinada, se asume un "em" como el ancho de una celda en la cuadrícula y el alto de una celda en la cuadrícula.</div>
-
-<h3 id="height">height</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;length&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>La función <code>height</code> describe la altura de la superficie a renderizar en el dispositivo de salida (como la altura de una ventana o la bandeja de papel en una impresora).</p>
-
-<div class="note"><strong>Nota:</strong> Cuando el usuario cambia el tamaño de una ventana Firefox también cambia las hojas de estilo para utilizar la mas adecuada basándose en los valores de <code>width</code> y <code>height</code> del query.</div>
-
-<h3 id="monochrome">monochrome</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>Indica el número de bits por pixel en un dispositivo monocromático (escala de grises). Si el dispositivo no es monocromático el valor sera 0.</p>
-
-<h4 id="Ejemplos_3">Ejemplos</h4>
-
-<p>Para aplicar una hoja de estilo a todos los dispositivos monocromáticos:</p>
-
-<pre class="brush: css">@media all and (monochrome) { ... }
-</pre>
-
-<p>Para aplicar una hoja de estilo a un dispositivo monocromático con al menos 8 bits por pixel:</p>
-
-<pre class="brush: css">@media all and (min-monochrome: 8) { ... }
-</pre>
-
-<h3 id="orientation">orientation</h3>
-
-<p><strong>Valor</strong><strong>:</strong> <code>landscape</code> | <code>portrait</code><br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Indica cuando el dispositivo esta en modo landscape (el ancho de la pantalla es mayor al alto) o modo portrait (el alto de la pantalla es mayor al ancho).</p>
-
-<h4 id="Ejemplo_5">Ejemplo</h4>
-
-<p>Para aplicar una hoja de estilo solo en orientación vertical (portrait):</p>
-
-<pre class="brush: css">@media all and (orientation: portrait) { ... }</pre>
-
-<h3 id="resolution">resolution</h3>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;resolution&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Bitmap", "bitmap")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>Indica la resolución (densidad de pixeles) del dispositivo de salida. La resolución puede ser especificada en puntos por pulgada (dpi) o en puntos por centímetros (dpcm).</p>
-
-<h4 id="Ejemplo_6">Ejemplo</h4>
-
-<p>Para aplicar una hoja de estilo a dispositivos con al menos 300 dpi de resolución:</p>
-
-<pre class="brush: css">@media print and (min-resolution: 300dpi) { ... }
-</pre>
-
-<p>Para reemplazar la vieja sintaxis <span style="font-family: courier new,andale mono,monospace; line-height: normal;">(min-device-pixel-ratio: 2)</span>:</p>
-
-<pre class="brush: css">@media screen and (min-resolution: 2dppx) { ... }</pre>
-
-<h3 id="scan">scan</h3>
-
-<p><strong>Valor</strong><strong>:</strong> <code>progressive</code> | <code>interlace</code><br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/TV")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Describe el proceso de exploración de televisión de los dispositivos de salida.</p>
-
-<h4 id="Ejemplo_7">Ejemplo</h4>
-
-<p>Para aplicar una hoja de estilo solo a televisores de exploración progresiva:</p>
-
-<pre class="brush: css">@media tv and (scan: progressive) { ... }
-</pre>
-
-<h3 id="width">width</h3>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;length&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>La función <code>width</code> describe el ancho de la superficie a renderizar en el dispositivo de salida (como el ancho de una ventana de un documento o el ancho de la bandeja de papel en una impresora).</p>
-
-<div class="note"><strong>Nota:</strong> Cuando el usuario cambia el tamaño de una ventana Firefox también cambia las hojas de estilo para utilizar la mas adecuada basándose en los valores de <code>width</code> y <code>height</code> del query.</div>
-
-<h4 id="Ejemplos_4">Ejemplos</h4>
-
-<p>Si usted quiere especificar una hoja de estilo para dispositivos portátiles o pantallas con un ancho de al menos 20em, usted puede usar esta query:</p>
-
-<pre class="brush: css">@media handheld and (min-width: 20em), screen and (min-width: 20em) { ... }
-</pre>
-
-<p>Esta query especifica una hoja de estilo para ser aplicada a un medio impreso con un ancho mayor a 8.5 pulgadas:</p>
-
-<pre class="brush: html">&lt;link rel="stylesheet" media="print and (min-width: 8.5in)"
-    href="http://foo.com/mystyle.css" /&gt;
-</pre>
-
-<p>Esta query especifica una hoja de estilo para ser utilizada cuando la ventana tiene un ancho entre 500 y 800 pixeles:</p>
-
-<pre class="brush: css">@media screen and (min-width: 500px) and (max-width: 800px) { ... }
-
-</pre>
-
-<ul>
-</ul>
-
-<h2 id="Específico_de_Mozilla">Específico de Mozilla</h2>
-
-<p>Mozilla ofrece varias funciones especificas de Gecko. Algunas de estas pueden ser propuestas como funcines oficiales.</p>
-
-<p>{{ h3_gecko_minversion("-moz-images-in-menus", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Si el dispositivo acepta que haya imágenes en menús, el valor es 1; de otro modo sera 0. Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(images-in-menus)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-mac-graphite-theme", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Si el usuario ha configurado su dispositivo para usar la apariencia "Grafito" en Mac OS X, esto sera 1. Si el usuario esta usando la apariencia azul por defecto, o si no usa Mac OS X, esto sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(mac-graphite-theme)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-maemo-classic", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Si el usuario esta usando Maemo con el tema original, esto sera 1; Si esta usando el nuevo tema Fremantle, sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(maemo-classic)") }}</p>
-
-<p>{{ h3_gecko_minversion("-moz-device-pixel-ratio", "2.0") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;number&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> sí</p>
-
-<p>Da el numero de pixeles del dispositivo por pixeles de CSS.</p>
-
-<div class="geckoVersionNote style-wrap">
-<p><strong>No use esta función. </strong></p>
-
-<p>En cambio use la función <code>resolution</code> con la unidad <code>dppx</code>.<br>
- <br>
- <code>-moz-device-pixel-ratio</code> puede ser usada para compatibilidad con Firefox 16 o anterior; y <code>-webkit-device-pixel-ratio</code> con navegadores basados en WebKit que no soporten <code>dppx</code>.</p>
-
-<p>Ejemplo:</p>
-
-<pre class="brush: css">@media (-webkit-min-device-pixel-ratio: 2), /* Navegadores basados en WebKit */
-       (min--moz-device-pixel-ratio: 2),    /* Navegadores anteriores a Firefox 16 */
-       (min-resolution: 2dppx),             /* La forma estandar */
-       (min-resolution: 192dpi)             /* compatibilidad con dppx */ </pre>
-
-<p>Vea este <a href="http://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/" title="http://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/">articulo CSSWG </a>sobre buenas practicas para compatibilidad en relación a <code>resolution</code> y <code>dppx</code>.</p>
-</div>
-
-<div class="note">Nota: Esta funcion multimedia tambien esta implementada en Webkit como <span style="font-family: courier new;">-webkit-device-pixel-ratio</span>. Los prefijos minimos y maximos de esta funcion implementados por Gecko se llaman asi: <span style="font-family: courier new;">min--moz-device-pixel-ratio</span> y <span style="font-family: courier new;">max--moz-device-pixel-ratio</span>; y los mismos prefijos implementados por Webkit se llaman asi: <span style="font-family: courier new;">-webkit-min-device-pixel-ratio</span> y <span style="font-family: courier new;">-webkit-max-device-pixel-ratio</span>.</div>
-
-<p>{{ h3_gecko_minversion("-moz-os-version", "25.0") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> <code>windows-xp</code> | <code>windows-vista</code> | <code>windows-win7</code> | <code>windows-win8</code><br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Indica que sistema operativo esta en uso actualmente. Actualmente solo es implementado en Windows. Sus posibles valores son:</p>
-
-<ul>
- <li><code>windows-xp</code></li>
- <li><code>windows-vista</code></li>
- <li><code>windows-win7</code></li>
- <li><code>windows-win8</code></li>
- <li><code>windows-win10</code></li>
-</ul>
-
-<p>Esto se hace para permitir a los skins y a algunos códigos funcionen mejor con el sistema operativo en el que se ejecutan.</p>
-
-<p>{{ h3_gecko_minversion("-moz-scrollbar-end-backward", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si la interfaz de usuario muestra una fecha inversa al final de la barra de desplazamiento, de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-end-backward)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-scrollbar-end-forward", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si la interfaz de usuario muestra una fecha apuntando hacia la derecha al final de la barra de desplazamiento. de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-end-forward)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-scrollbar-start-backward", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si la interfaz de usuario muestra una fecha inversa al principio de la barra de desplazamiento, de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-start-backward)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-scrollbar-start-forward", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si la interfaz de usuario muestra una fecha apuntando hacia la derecha al principio de la barra de desplazamiento, de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-start-forward)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-scrollbar-thumb-proportional", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si la interfaz de usuario muestra la miniatura de la barra de desplazamiento de forma proporcional (basado en el porcentaje del documento que es visible), de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-thumb-proportional)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-touch-enabled", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si el dispositivo soporta eventos táctiles (una pantalla táctil), de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(touch-enabled)") }}.</p>
-
-<h4 id="Ejemplo_8">Ejemplo</h4>
-
-<p>Usted puede usar esto para renderizar sus botones un poco mas grandes, Por Ejemplo, si el usuario se encuentra en una pantalla táctil, esto hará los botones mas fáciles de usar con los dedos.</p>
-
-<p>{{ h3_gecko_minversion("-moz-windows-classic", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si el usuario utiliza un windows sin temas visuales (modo clasico); de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(windows-classic)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-windows-compositor", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si el usuario utiliza windows con el compositor de ventanas DWM; de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(windows-compositor)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-windows-default-theme", "1.9.2") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>El valor sera 1 si el usuario actualmente esta utilizando algunos de los temas por defecto de Windows (Luna, Royale, Zune, or Aero), de lo contrario el valor sera 0.</p>
-
-<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(windows-default-theme)") }}.</p>
-
-<p>{{ h3_gecko_minversion("-moz-windows-theme", "2.0") }}</p>
-
-<p><strong>Valor</strong><strong>:</strong> <code>aero</code> | <code>luna-blue</code> | <code>luna-olive</code> | <code>luna-silver</code> | <code>royale</code> | <code>generic</code> | <code>zune</code><br>
- <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<p>Indica cual tema de Windows esta en uso actualmente. Solo disponible para Windows. Sus posibles valores son:</p>
-
-<ul>
- <li><code>aero</code></li>
- <li><code>luna-blue</code></li>
- <li><code>luna-olive</code></li>
- <li><code>luna-silver</code></li>
- <li><code>royale</code></li>
- <li><code>generic</code></li>
- <li><code>zune</code></li>
-</ul>
-
-<p>Esto se hace para permitir a los skins y a algunos códigos funcionen mejor con el tema utilizado por el sistema operativo en el que se ejecutan.</p>
-
-<h2 id="Específico_de_WebKit">Específico de WebKit</h2>
-
-<h3 id="-webkit-transform-3d">-webkit-transform-3d</h3>
-
-<p><strong>Vakir:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong>Medio:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<ul>
- <li><a href="https://compat.spec.whatwg.org/#css-media-queries-webkit-transform-3d">Especificación</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/-webkit-transform-3d">Documentación</a></li>
-</ul>
-
-<p>Si está soportado, el valor es 1, si no, el valor es 0.</p>
-
-<p>Ejemplo</p>
-
-<pre class="brush: css"><code>@media (-webkit-transform-3d) {
-  .foo {
-    transform-style: preserve-3d;
-  }
-}
-
-@media (-webkit-transform-3d: 1) {
-  .foo {
-    transform-style: preserve-3d;
-  }
-}</code></pre>
-
-<h3 id="-webkit-transform-2d">-webkit-transform-2d</h3>
-
-<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong>Medio:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/-webkit-transform-2d">Documentación</a></li>
-</ul>
-
-<p>Si está soportado, el valor es 1, si no, el valor es 0.</p>
-
-<h3 id="-webkit-transition">-webkit-transition</h3>
-
-<p><strong>Value:</strong> {{cssxref("&lt;integer&gt;")}}<br>
- <strong>Medio:</strong> {{cssxref("Media/Visual")}}<br>
- <strong>Acepta prefijos min/max:</strong> no</p>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/-webkit-transition">Documentación</a></li>
-</ul>
-
-<p>Si está soportado, el valor es 1, si no, el valor es 0.</p>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("21")}}</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
-   <td>{{CompatIE("9.0")}}</td>
-   <td>{{CompatOpera("9")}}</td>
-   <td>{{CompatSafari("4")}}</td>
-  </tr>
-  <tr>
-   <td><code>grid</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}} <sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>resolution</code></td>
-   <td>{{CompatChrome("29")}}</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}} <sup>[2]</sup><br>
-    {{CompatGeckoDesktop("8.0")}} <sup>[3]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>scan</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[4]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>-webkit-min-device-pixel-ratio</code>, <code>-webkit-max-device-pixel-ratio</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}<sup>[7]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>-webkit-transform-3d</code></td>
-   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
-   <td>{{CompatGeckoDesktop("49")}}<sup>[6]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
-   <td>{{CompatSafari("1.0")}}<sup>[5]</sup></td>
-  </tr>
-  <tr>
-   <td><code>-webkit-transform-2d</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
-   <td>{{CompatSafari("1.0")}}<sup>[5]</sup></td>
-  </tr>
-  <tr>
-   <td><code>-webkit-transition</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
-   <td>{{CompatSafari("1.0")}}<sup>[5]</sup></td>
-  </tr>
-  <tr>
-   <td><code>display-mode</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("47")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>grid</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>resolution</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>scan</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>-webkit-min-device-pixel-ratio</code>, <code>-webkit-max-device-pixel-ratio</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>-webkit-transform-3d</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>-webkit-transform-2d</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>-webkit-transition</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>display-mode</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] <code>grid</code> media type no está soportado</p>
-
-<p>[2] Soporta valores {{cssxref("&lt;integer&gt;")}}.</p>
-
-<p>[3] Soporta valores {{cssxref("&lt;number&gt;")}}, según la especificación.</p>
-
-<p>[4] <code>tv</code> media no está soportado</p>
-
-<p>[5] Ver {{WebKitBug(22494)}}.</p>
-
-<p>[6] Implementado por razones de compatibilidad web en Gecko 46.0 {{geckoRelease("46.0")}} tras tras cambiar <code>layout.css.prefixes.webkit</code> por defecto a <code>false</code> (ver {{bug(1239799)}}). Desde Gecko 49.0 {{geckoRelease("49")}} <code>layout.css.prefixes.webkit</code> por defecto es <code>true</code>.</p>
-
-<p>[7] Implementado como alias para <code>min--moz-device-pixel-ratio </code>y <code>max--moz-device-pixel-ratio</code> por razones de compatibilidad web in Gecko 45.5 {{geckoRelease("45.0")}} (ver {{bug(1176968)}}) tras cambiar <code>layout.css.prefixes.webkit</code> y <code>layout.css.prefixes.device-pixel-ratio-webkit</code> por defecto a <code>false</code>. Desde Gecko 49.0 {{geckoRelease("49")}} <code>layout.css.prefixes.webkit</code> por defecto es <code>true</code>.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/css3-mediaqueries/" title="http://www.w3.org/TR/css3-mediaqueries/">Especificación CSS 3 media query</a></li>
- <li><a class="internal" href="/es/docs/Web/CSS/@media">Tipos de Medios</a></li>
- <li><a href="/es/docs/Web/Guide/CSS/probando_media_queries">Usando media queries desde código</a></li>
-</ul>
diff --git a/files/es/css/using_css_gradients/index.html b/files/es/css/using_css_gradients/index.html
deleted file mode 100644
index 2e3f5e13a4..0000000000
--- a/files/es/css/using_css_gradients/index.html
+++ /dev/null
@@ -1,386 +0,0 @@
----
-title: Usando gradientes con CSS
-slug: CSS/Using_CSS_gradients
-translation_of: Web/CSS/CSS_Images/Using_CSS_gradients
----
-<p><a href="/en-US/docs/CSS/CSS3" title="CSS3">CSS3</a> posee soporte para nuevos tipos de <em>gradientes</em>  en las propiedades CSS. Usarlos <span id="result_box" lang="es"><span class="hps">en</span> <span class="hps">un</span> <span class="hps">segundo plano,</span> <span class="hps">permite mostrar</span> <span class="hps">transiciones suaves</span> <span class="hps">entre dos o</span> <span class="hps">más</span> <span class="hps">colores especificados,</span></span> <span id="result_box" lang="es"><span class="hps">evitando así</span> <span class="hps">el uso de imágenes</span> <span class="hps">para estos efectos</span></span>, lo que reduce<span id="result_box" lang="es"><span class="hps"> el tiempo</span> <span class="hps">de descarga y</span> <span class="hps">el uso de</span> <span class="hps">ancho de banda</span></span>. <span id="result_box" lang="es"><span class="hps">Además</span><span>,</span> <span class="hps">debido a que el</span> <span class="hps">gradiente</span> <span class="hps">es generado por el</span> <span class="hps">navegador</span><span>,</span></span> los <span id="result_box" lang="es"><span class="hps">objetos</span> <span class="hps">degradados</span> <span class="hps">se ven mejor</span> <span class="hps">cuando se hace un acercamiento</span></span>, y el ajuste de diseño es mucho más flexible.</p>
-
-<p>Los navegadores soportan dos tipos de gradientes: <em>lineal</em>, definido con la función <em>linear-gradient</em>, y <em>radial</em>, definido con <em>radial-gradient</em>.</p>
-
-<h2 id="Gradientes_lineales">Gradientes lineales</h2>
-
-<p>Para crear un gradiente lineal, <span id="result_box" lang="es"><span class="hps">se establece un</span> <span class="hps">punto</span> <span class="hps">de partida y una</span> <span class="hps">dirección</span> <span class="hps">(indicada por</span> <span class="hps">un ángulo)</span> <span class="hps">a lo largo de</span> <span class="hps">la cual se aplica</span> <span class="hps">el</span> <span class="hps">efecto</span></span>. Usted también puede definir <strong>paradas de color</strong>. las paradas de color son los colores que usted desea que Gecko renderise con suaves transiciones entre ellos, y usted puede específicar al menos dos de ellas, pero puede específicar más para crear efectos de gradientes más complejos.</p>
-
-<h3 id="Gradientes_lineales_simples">Gradientes lineales simples</h3>
-
-<p>Aquí está un gradiente lineal que inicia en el centro (horizontalmente) y arriba (verticalmente), e inicia en azul, transicionando a blanco.</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Captura de pantalla</td>
-   <td class="header">Demo en vivo</td>
-  </tr>
-  <tr>
-   <td><img alt="" src="/@api/deki/files/3950/=basic_linear_bluetop.png" style="text-align: center;"></td>
-   <td>
-    <div class="gradient-demo linear-top-bottom" style=""> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<div style="margin-right: 255px;">
-<pre class="brush: css">/* La sintaxis vieja, obsoleta, pero todavía necesaria, con prefijo, para Opera y navegadores basados en WebKit-based */
-background: -prefix-linear-gradient(top, blue, white);
-
-/* La nueva sintaxis necesaria para navegadores apegados al estandar (IE 10 y Firefox 10 en adelante), sin prefijo */
-background: linear-gradient(to bottom, blue, white);
-</pre>
-</div>
-
-<h3 id="Cambiando_el_mismo_gradiente_para_correr_de_izquierda_a_derecha">Cambiando el mismo gradiente para correr de izquierda a derecha:</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Captura de pantalla</td>
-   <td class="header">Demo en vivo</td>
-  </tr>
-  <tr>
-   <td><img alt="basic_linear_blueleft.png" class="default internal" src="/@api/deki/files/3951/=basic_linear_blueleft.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">/* la vieja sintaxis, obsoleta, pero todavía necesaria, prefijada, para Opera y Navegadores basados en Webkit */
-background: -prefix-linear-gradient(left, blue, white);
-
-/* La nueva sintaxis necesaria para navegadores apegados al estandar (IE 10 y Firefox 10 en adelante), sin prefijo */
-background: linear-gradient(to right, blue, white);
-</pre>
-
-<p>Usted puede hace el gradiente sea generado diagonalmente mediante la especificación de la posición de inicio vertical y horizontal. Por ejemplo:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Captura de pantalla</td>
-   <td class="header">Demo en vivo</td>
-  </tr>
-  <tr>
-   <td><img alt="basic_linear_bluetopleft.png" class="default internal" src="/@api/deki/files/3952/=basic_linear_bluetopleft.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">/* la vieja sintaxis, obsoleta, pero todavía necesaria, prefijada, para Opera y Navegadores basados en Webkit */
-background: -prefix-linear-gradient(left top, blue, white);
-
-/* La nueva sintaxis necesaria para navegadores apegados al estandar (IE 10 y Firefox 10 en adelante), sin prefijo */
-background: linear-gradient(to bottom right, blue, white);
-</pre>
-
-<h3 id="Usando_Angulos">Usando Angulos</h3>
-
-<p>Si usted no específica un ángulo, uno es determinado automáticamente basado en la dirección dada. Si usted desea más control sobre la dirección del gradiente, usted necesita establecer el ángulo específicamente.</p>
-
-<p>Por ejemplo, aquí hay dos gradientes, el primero con una dirección hacia la derecha, y el segundo tiene un ángulo de 70 grados.</p>
-
-<p><img alt="linear_gradient_angle.png" class="default internal" src="/@api/deki/files/3953/=linear_gradient_angle.png"></p>
-
-<p>El de la derecha usa un CSS Como este:</p>
-
-<pre class="brush: css">background: linear-gradient(70deg, black, white);
-</pre>
-
-<p>El ángulo es especificado como un ángulo entre una línea vertical y la línea del gradiente, contando en el sentido horario. En otras palabras, <code>0deg crea un gradiente vertical desde el fondo hasta el tope, mientras 90deg genera un gradiente horizontal de izquierda a derecha:</code></p>
-
-<p><img alt="linear_redangles.png" class="default internal" src="/files/3811/linear_red_angles.png"></p>
-
-<pre class="brush: css">background: linear-gradient(&lt;angle&gt;, red, white);
-</pre>
-
-<div class="note style-wrap">
-<p><strong>Note:</strong> several browsers implement, prefixed, an older draft of the specification where <code>0deg</code> was pointing to the right rather than to the top. Pay attention in the value of the angle when mixing prefixed and standard linear-gradient, some may need to have <code>90deg</code> added to the <code>&lt;angle&gt;</code>.</p>
-</div>
-
-<h3 id="Color_stops">Color stops</h3>
-
-<p>Color stops are points along the gradient line that will have a specific color at that location. The location can be specified as either a percentage of the length of the line, or as an absolute length. You may specify as many color stops as you like in order to achieve the desired effect.</p>
-
-<p>If you specify the location as a percentage, <code>0%</code> represents the starting point, while <code>100%</code> represents the ending point; however, you can use values outside that range if necessary to get the effect you want.</p>
-
-<h4 id="Example_Three_color_stops">Example: Three color stops</h4>
-
-<p>This example specifies three color stops:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="linear_colorstops1.png" class="default internal" src="/@api/deki/files/3955/=linear_colorstops1.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">/* The old syntax, deprecated, but still needed, prefixed, for Opera and WebKit-based browsers */
-background: -prefix-linear-gradient(top, blue, white 80%, orange);
-
-/* The new syntax needed by standard-compliant browsers (IE 10 and Firefox 10 onwards), without prefix */
-background: linear-gradient(to bottom, blue, white 80%, orange);
-</pre>
-
-<p>Note that the first and last color stops don't specify a location; because of that, values of 0% and 100% are assigned automatically. The middle color stop specifies a location of 80%, putting it most of the way toward the bottom.</p>
-
-<h4 id="Example_Evenly_spaced_color_stops">Example: Evenly spaced color stops</h4>
-
-<p>Here's an example using a wide variety of colors, all evenly spaced:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="linear_rainbow.png" class="default internal" src="/@api/deki/files/3956/=linear_rainbow.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">/* The old syntax, deprecated, but still needed, prefixed, for Opera and WebKit-based browsers */
-background: -prefix-linear-gradient(left, red, orange, yellow, green, blue);
-
-/* The new syntax needed by standard-compliant browsers (IE 10 and Firefox 10 onwards), without prefix */
-background: linear-gradient(to right, red, orange, yellow, green, blue);
-</pre>
-
-<p>Notice that the color stops are automatically spaced evenly when no locations are specified.</p>
-
-<h3 id="Transparency_and_gradients">Transparency and gradients</h3>
-
-<p>Gradients support transparency. You can use this, for example, when stacking multiple backgrounds, to create fading effects on background images. For example:</p>
-
-<p><img alt="linear_multibg_transparent.png" class="default internal" src="/@api/deki/files/3957/=linear_multibg_transparent.png"></p>
-
-<pre class="brush: css">/* The old syntax, deprecated, but still needed, prefixed, for Opera and WebKit-based browsers */
-background: linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,1)), url(http://foo.com/image.jpg);
-
-/* The new syntax needed by standard-compliant browsers (IE 10 and Firefox 10 onwards), without prefix */
-background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)), url(http://foo.com/image.jpg);
-</pre>
-
-<p>The backgrounds are stacked with the first specified background on top, and each successive background farther away. By stacking backgrounds this way, you can create very creative effects as seen above.</p>
-
-<h2 id="Radial_gradients">Radial gradients</h2>
-
-<p>Radial gradients are specified using the {{ cssxref("radial-gradient") }} functional notation. The syntax is similar to that for linear gradients, except you can specify the gradient's ending shape (whether it should be a circle or ellipse) as well as its size. By default, the ending shape is an ellipse with the same proportions than the container's box.</p>
-
-<h3 id="Color_stops_2">Color stops</h3>
-
-<p>You specify color stops the same way as for linear gradients. The gradient line extends out from the starting position in all directions.</p>
-
-<h4 id="Example_Evenly_spaced_color_stops_2">Example: Evenly spaced color stops</h4>
-
-<p>By default, as with linear gradients, the color stops are evenly spaced:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="radial_gradient_even.png" class="default internal" src="/@api/deki/files/3958/=radial_gradient_even.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">background: radial-gradient(red, yellow, rgb(30, 144, 255));
-</pre>
-
-<h4 id="Example_Explicitly_spaced_color_stops">Example: Explicitly spaced color stops</h4>
-
-<p>Here we specify specific locations for the color stops:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="radial_gradient_varied.png" class="default internal" src="/@api/deki/files/3959/=radial_gradient_varied.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">background: radial-gradient(red 5%, yellow 25%, #1E90FF 50%);
-</pre>
-
-<h3 id="Size">Size</h3>
-
-<p>This is one of the areas in which radial gradients differ from linear gradients. You can provide a size value that specifies the point that defines the size of the circle or ellipse. See <a href="/en-US/docs/CSS/radial-gradient#Size_constants" title="en-US/docs/CSS/-moz-radial-gradient#Size constants">this description of the size constants</a> for specifics.</p>
-
-<h4 id="Example_closest-side_for_ellipses">Example: closest-side for ellipses</h4>
-
-<p>This ellipse uses the <code>closest-side</code> size value, which means the size is set by the distance from the starting point (the center) to the closest side of the enclosing box.</p>
-
-<table class="standard-table" style="width: 520px;">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="radial_ellipse_size1.png" class="default internal" src="/@api/deki/files/3960/=radial_ellipse_size1.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">background: radial-gradient(ellipse closest-side, red, yellow 10%, #1E90FF 50%, white);
-</pre>
-
-<h4 id="Example_farthest-corner_for_ellipses">Example: farthest-corner for ellipses</h4>
-
-<p>This example is similar to the previous one, except that its size is specified as <code>farthest-corner</code>, which sets the size of the gradient by the distance from the starting point to the farthest corner of the enclosing box from the starting point.</p>
-
-<table class="standard-table" style="width: 520px;">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="radial_ellipse_size2.png" class="default internal" src="/@api/deki/files/3961/=radial_ellipse_size2.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">background: radial-gradient(ellipse farthest-corner, red, yellow 10%, #1E90FF 50%, white);
-</pre>
-
-<h4 id="Example_closest-side_for_circles">Example: closest-side for circles</h4>
-
-<p>This example uses <code>closest-side</code>, which determines the circle's size as the distance between the start point (the center) and the closest side.</p>
-
-<table class="standard-table" style="width: 520px;">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="radial_circle_size1.png" class="default internal" src="/@api/deki/files/3962/=radial_circle_size1.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">background: radial-gradient(circle closest-side, red, yellow 10%, #1E90FF 50%, white);
-</pre>
-
-<p>Here, the circle's radius is half the height of the box, since the top and bottom edges are equidistant from the start point and are closer than the left and right edges.</p>
-
-<h2 id="Repeating_gradients">Repeating gradients</h2>
-
-<p>The {{ cssxref("linear-gradient") }} and {{ cssxref("radial-gradient") }} properties don't support automatically repeating the color stops. However, the {{ cssxref("repeating-linear-gradient") }} and {{ cssxref("repeating-radial-gradient") }} properties are available to offer this functionality.</p>
-
-<h3 id="Examples_Repeating_linear_gradient">Examples: Repeating linear gradient</h3>
-
-<p>This example uses {{ cssxref("repeating-linear-gradient") }} to create a gradient:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="repeating_linear_gradient.png" class="default internal" src="/@api/deki/files/3964/=repeating_linear_gradient.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">background: repeating-linear-gradient(-45deg, red, red 5px, white 5px, white 10px);
-</pre>
-
-<p>Another example using the {{ cssxref("repeating-linear-gradient") }} property.</p>
-
-<p><a href="/@api/deki/files/6192/=repeat_background_gradient_checked.png" title="repeat_background_gradient_checked.png"><img alt="repeat_background_gradient_checked.png" class="default internal" src="/@api/deki/files/6192/=repeat_background_gradient_checked.png?size=thumb" style="height: 160px; width: 160px;"></a></p>
-
-<pre class="brush: css">background-color: #000;
-background-image: repeating-linear-gradient(90deg, transparent, transparent 50px,
-      rgba(255, 127, 0, 0.25) 50px, rgba(255, 127, 0, 0.25) 56px, transparent 56px, transparent 63px,
-      rgba(255, 127, 0, 0.25) 63px, rgba(255, 127, 0, 0.25) 69px, transparent 69px, transparent 116px,
-      rgba(255, 206, 0, 0.25) 116px, rgba(255, 206, 0, 0.25) 166px),
-repeating-linear-gradient(0deg, transparent, transparent 50px, rgba(255, 127, 0, 0.25) 50px,
-      rgba(255, 127, 0, 0.25) 56px, transparent 56px, transparent 63px, rgba(255, 127, 0, 0.25) 63px,
-      rgba(255, 127, 0, 0.25) 69px, transparent 69px, transparent 116px, rgba(255, 206, 0, 0.25) 116px,
-      rgba(255, 206, 0, 0.25) 166px),
-repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(143, 77, 63, 0.25) 5px,
-      rgba(143, 77, 63, 0.25) 10px),
-repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(143, 77, 63, 0.25) 5px,
-      rgba(143, 77, 63, 0.25) 10px);
-</pre>
-
-<h3 id="Example_Repeating_radial_gradient">Example: Repeating radial gradient</h3>
-
-<p>This example uses {{ cssxref("repeating-radial-gradient") }} to create a gradient:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Screen Shot</td>
-   <td class="header">Live Demo</td>
-  </tr>
-  <tr>
-   <td><img alt="repeating_radial_gradient.png" class="default internal" src="/@api/deki/files/3965/=repeating_radial_gradient.png"></td>
-   <td>
-    <div> </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<pre class="brush: css">background: repeating-radial-gradient(black, black 5px, white 5px, white 10px);
-</pre>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>Gradient-related reference articles: {{cssxref("&lt;image&gt;")}}, {{cssxref("&lt;gradient&gt;")}}, {{cssxref("linear-gradient")}}, {{cssxref("radial-gradient")}}, {{cssxref("repeating-linear-gradient")}}, {{cssxref("repeating-radial-gradient")}}.</li>
-</ul>
diff --git a/files/es/css_dinámico/index.html b/files/es/css_dinámico/index.html
deleted file mode 100644
index e77502cb70..0000000000
--- a/files/es/css_dinámico/index.html
+++ /dev/null
@@ -1,339 +0,0 @@
----
-title: CSS dinámico
-slug: CSS_dinámico
-tags:
-  - CSS
-  - Todas_las_Categorías
----
-<p>
-</p>
-<h3 id="Introducci.C3.B3n"> Introducción </h3>
-<p>Tradicionalmente las páginas web se han dividido en dos categorías: estáticas y dinámicas. Hemos leído muchas veces que con <a href="es/XHTML">XHTML</a> y <a href="es/CSS">CSS</a> se pueden crear documentos de calidad, pero fijos, estáticos. Si quieres que tus páginas se adapten y cambien según las acciones del usuario, si quieres dinamismo, necesitas javascript o similares... Ya no.
-</p><p>Si teniamos <a href="es/DHTML">DHTML</a> (html dinámico), ahora tenemos <b>CDSS</b> (<b>C</b>ss <b>D</b>inámico <b>S</b>in <b>S</b>cripts). Como en un cuento de hadas en el que un humilde sapo acaba siendo el príncipe de la historia, unas modestas pseudo-clases pueden acabar siendo las estrellas de la Web. </p><p>Las <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/selector.html#q15">pseudo-clases</a> en principio nacieron para darle dinamismo a los enlaces, y este es el uso que se les ha dado durante los últimos años. Es raro el archivo CSS que no incluya unas líneas semejantes a estas:
-</p>
-<pre>a:link { ... }
-a:active { ... }
-a:visited { ... }
-</pre>
-<p>¡Pero la situación ha cambiado! Ahora podemos aplicarle pseudo-clases a la mayoría de los elementos, y jugando con los selectores podemos crear documentos dinámicos usando exclusivamente CSS.
-</p>
-<h3 id="Poco_a_poco"> Poco a poco </h3>
-<p>Lo veremos poco a poco y por medio de ejemplos centrados en la pseudo-clase :hover. Obviamente combinando diversas pseudo-clases pueden obtenerse efectos más complejos.
-Para probar los ejemplos basta copiar y pegar el código (sin quitar ni añadir nada) en un archivo vacio y visualizarlo con el navegador. </p><p>Empecemos por el uso tradicional:
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-a:hover { color: red; }
-
-&lt;/style&gt;
-
-&lt;p&gt; Párrafo con &lt;a&gt;enlace&lt;/a&gt; que se pone rojo &lt;/p&gt;
-
-</pre>
-<p>Soltamos amarras, levamos 'anclas' y...
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-p:hover { color: red; font-variant: small-caps; }
-li:hover { color: blue; background: silver; }
-div:hover { color: orange; text-align: right; }
-
-&lt;/style&gt;
-
-&lt;p&gt; Párrafo que se pone rojo y mayúsculo. &lt;/p&gt;
-&lt;ul&gt; &lt;li&gt; Item que se pone azul y con fondo gris. &lt;/li&gt; &lt;/ul&gt;
-&lt;div&gt; División con texto que se flota a la derecha y se pone naranja. &lt;/div&gt;
-</pre> <p>Esto nos permite crear con facilidad efectos dinámicos, podemos cambiar la visualización de las cosas dependiendo de los actos del usuario. Con un poco de imaginación y buen gusto se pueden hacer maravillas.
-</p>
-<h4 id="La_cosa_da_mucho_juego"> La cosa da mucho juego </h4>
-<p>Podemos cambiar cualquier propiedad, pero no todas son igual de útiles a la hora de crear dinamismo. Algunas de las más interesantes serían por ejemplo: display, position, z-index...
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-.comun { position: absolute; width: 10em;
-	 padding: 2em; text-align: center; }
-
-#rojo { background-color: red;
-        left: 1em; top: 1em;
-        z-index: 1; }
-
-#azul { background-color: blue;
-        left: 5em; top: 5em;
-        z-index: 2; }
-
-#naranja { background-color: orange;
-           left: 9em; top: 2em;
-           z-index: 3; }
-
-#rojo:hover,
-#azul:hover,
-#naranja:hover { z-index: 4; }
-
-&lt;/style&gt;
-
-&lt;p id='rojo'    class='comun'&gt;El rojo es vivo&lt;/p&gt;
-&lt;p id='azul'    class='comun'&gt;El azul es elegante&lt;/p&gt;
-&lt;p id='naranja' class='comun'&gt;El naranja es guay&lt;/p&gt;
-</pre>
-<h3 id="Pero_esto_no_es_todo.2C_a.C3.BAn_hay_m.C3.A1s."> Pero esto no es todo, aún hay más. </h3>
-<p>Jugando con los <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/selector.html">selectores</a> podemos relacionar unos elementos con otros.
-</p><p>Por ejemplo: al posicionarnos sobre <a href="es/HTML/Elemento/p">p</a> cambiamos las propiedades de <a href="es/HTML/Elemento/a">a</a>, y al posicionarnos sobre <a href="es/HTML/Elemento/a">a</a> cambiamos las propiedades de <a href="es/HTML/Elemento/em">em</a>.
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-em { display: none; }
-
-p:hover a { color: red; }
-a:hover em { display: inline; }
-
-&lt;/style&gt;
-
-&lt;p&gt; Párrafo &lt;a&gt;con enlace &lt;em&gt;que se pone rojo&lt;/em&gt; &lt;/a&gt; &lt;/p&gt;
-</pre>
-<p>Bueno, despues de unos ejemplos simples, uno un poco más complejo:
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-.editorial { width: 30%;}
-.item { list-style: none; list-style-position: inside;
-        padding: 0.2ex; margin: 0.2ex; }
-
-a { color: darkblue; text-decoration: none;}
-div:hover a { color: blue; text-decoration: underline;}
-
-.oculto ul { display: none; }
-div:hover ul { display: block; }
-
-ul { border: transparent solid 0.1ex; }
-ul:hover { border: peru solid 0.1ex; }
-
-ul:hover abbr,
-ul:hover dfn { color: red; }
-
-.vista { visibility: hidden; }
-ul:hover .vista { visibility: visible; }
-
-&lt;/style&gt;
-
-&lt;div class='editorial oculto'&gt;
-   &lt;h2&gt; &lt;a&gt; CSS &lt;/a&gt; &lt;/h2&gt;
-   &lt;ul class='item'&gt;
-      &lt;li&gt; &lt;dfn&gt;CSS&lt;/dfn&gt; es una c seguida de dos eses. &lt;/li&gt;
-      &lt;li&gt; También es un estándar del &lt;abbr&gt;W3C&lt;/abbr&gt;. &lt;/li&gt;
-      &lt;li class='vista'&gt; No se me ocurre qué poner aquí. &lt;/li&gt;
-   &lt;/ul&gt;
-
-&lt;/div&gt;
-
-&lt;div class='editorial'&gt;
-   &lt;h2&gt; &lt;a&gt; HTML &lt;/a&gt; &lt;/h2&gt;
-   &lt;ul class='item'&gt;
-      &lt;li&gt; &lt;dfn&gt;HTML&lt;/dfn&gt; es un lenguaje para el marcado de hipertextos. &lt;/li&gt;
-      &lt;li&gt; Es un estándar del &lt;abbr&gt;W3C&lt;/abbr&gt;. &lt;/li&gt;
-      &lt;li class='vista'&gt; Creado por Tim Berners-Lee. &lt;/li&gt;
-   &lt;/ul&gt;
-&lt;/div&gt;
-</pre>
-<h4 id="Tipos_de_relaciones_familiares"> Tipos de relaciones <i>familiares</i></h4>
-<p>Hasta el momento todos los ejemplos muestran relaciones padre → descendiente, si has consultado la especificación sabrás que no son las únicas, las posibilidades son las siguientes:
-</p>
-<h5 id="Padre_.E2.86.92_hijo"> Padre → hijo </h5>
-<p>Esta relación se expresa por medio del combinador ("&gt;"), relaciona un elemento con sus descendientes directos. En el siguiente ejemplo seleccionamos los elementos con clase 'subrayado' que sean hijos directos de <a href="es/HTML/Elemento/div">div</a>
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-body:hover &gt; .subrayado { text-decoration: underline;}
-
-&lt;/style&gt;
-
-&lt;div&gt;
-&lt;p&gt; Lo siguiente es una
- &lt;span class='subrayado'&gt;cita&lt;/span&gt;:
-&lt;/p&gt;
-&lt;hr&gt;
-&lt;blockquote class='subrayado'&gt; &lt;p&gt;Si buscas resultados distintos, no hagas siempre lo mismo.
- &lt;cite&gt;Einstein&lt;/cite&gt; &lt;/p&gt;
-&lt;/blockquote&gt;
-&lt;/div&gt;
-</pre>
-<h5 id="Padre_.E2.86.92_descendiente"> Padre → descendiente </h5>
-<p>Esta relación se expresa por medio de un espacio en blanco (" ") relaciona un elemento con un descendiente. Este es el método más flexible, puedes seleccionar cualquier elemento independientemente del parentesco exacto.
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-     p:hover em { visibility: hidden;}
-
-&lt;/style&gt;
-
-&lt;h2&gt; Selección de descendientes&lt;/h2&gt;
-&lt;p&gt;
-  &lt;em&gt;Este em es hijo de un párrafo&lt;/em&gt;
-  &lt;span&gt; span tambien, pero...
-     &lt;em&gt;Este em no es hijo de un párrafo, &lt;/em&gt;
-     aunque sí descendiente (hijo de un hijo).
-  &lt;/span&gt;
-&lt;/p&gt;
-</pre>
-<h5 id="Hermano_.E2.86.92_hermano_.28adyacente.29"> Hermano → hermano (adyacente) </h5>
-<p>Esta relación es expresa por medio del combinador ("+"), relaciona un elemento con su hermano adyacente (el inmediatamente siquiente). Este es el método aparentemente más limitado, pero el que abre más puertas.
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-#primero + li { list-style-type: none; }
-
-&lt;/style&gt;
-
-&lt;ul&gt;
-  &lt;li id='primero'&gt;item 1&lt;/li&gt;
-  &lt;li&gt;item 2&lt;/li&gt;
-  &lt;li&gt;item 3&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-<p><br>
-Esto de relacionar hermanos está muy bien, pero solo se puede seleccionar el adyacente, esto es una limitación importante, pero bueno, siempre puedes seleccionar el adyacente del adyacente, o el...
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-#primero + li + li + li { list-style-type: none; }
-
-&lt;/style&gt;
-
-&lt;ul&gt;
-  &lt;li id='primero'&gt;item 1&lt;/li&gt;
-  &lt;li&gt;item 2&lt;/li&gt;
-  &lt;li&gt;item 3&lt;/li&gt;
-  &lt;li&gt;item 4&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-<h5 id="Otros_parentescos"> Otros parentescos </h5>
-<p>Padres, hijos y hermanos no son las únicas relaciones dentro de una familia. ¿Qué pasa si quiero seleccionar un nieto, o un sobrino? ¿Se puede? </p>
-<dl><dt> Seleccionando un nieto
-</dt><dd> No tiene mayor complicación, al fin y al cabo, un nieto no es más que un hijo de un hijo.
-</dd></dl>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-p:hover &gt; span &gt; em { color: red; }
-
-&lt;/style&gt;
-
-&lt;p&gt;
- &lt;em&gt;este em es hijo de un párrafo&lt;/em&gt;
- &lt;span&gt; span también, pero...
-   &lt;em&gt;este em es nieto&lt;/em&gt; &lt;/span&gt;
-&lt;/p&gt;
-</pre>
-<dl><dt> Seleccionando un sobrino.
-</dt><dd> No hay problema, un sobrino no es más que un hijo de un hermano.
-</dd></dl>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-p:hover + div &gt; em { color: red; }
-
-&lt;/style&gt;
-
-&lt;p&gt;Al ponerte sobre este párrafo&lt;/p&gt;
-&lt;div&gt; Cambias las propiedades de
-   &lt;em&gt;este em&lt;/em&gt;
-&lt;/div&gt;
-</pre>
-<h5 id="Limitaciones"> Limitaciones </h5>
-<p>De los ejemplos anteriores se desprende que es muy fácil abarcar todas las combinaciones posibles. Siempre y cuando la secuencia de los selectores sea:
-</p>
-<ol><li>Descendente - Un elemento y sus descendientes.
-</li><li>Horizontal - Un elemento y sus hermanos.
-</li><li>Mixta - Una combinación de las anteriores.
-</li></ol>
-<p>Lo que no se puede hacer es seleccionar un ascendiente (ej. un padre). Por lo tanto <u>el siquiente ejemplo ni funciona ni debe hacerlo</u>:
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-em:hover #div { color: red; }
-
-&lt;/style&gt;
-
-&lt;h1&gt;Este ejemplo ni funciona ni debe hacerlo.&lt;/h1&gt;
-
-&lt;div id='div'&gt;
-   &lt;em&gt;Este em&lt;/em&gt;
-   no puede cambiar las propiedades de su padre.
-&lt;/div&gt;
-</pre>
-<p>Además hay una curiosa limitación ¿será un bug? Un selector compuesto puede empezar por un elemento o por un #id con :hover, Pero no puede empezar por una clase con :hover. Sorprendentemente con el selector universal (*) tampoco funciona.
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-* { color: red; }
-
-  .uno       .cero { color: blue; }      /* esto sí funciona */
- *.uno       .cerocero { color: blue; }  /* esto sí funciona */
-
-  #uno:hover .dos { color: blue; }       /* esto sí funciona */
-ul.uno:hover .cuatro { color: blue; }    /* esto sí funciona */
-
-  .uno:hover .tres { color: blue; }      /* esto NO funciona */
- *.uno:hover .cinco { color: blue; }     /* esto TAMPOCO funciona */
-
-&lt;/style&gt;
-
-&lt;div class='uno'&gt;
-  .uno       .cero { color: blue; }
-  &lt;em class='cero'&gt;Esto sí funciona,&lt;/em&gt; y... &lt;br&gt;
-  *.uno       .cerocero { color: blue; }
-  &lt;em class='cerocero'&gt;esto también funciona.&lt;/em&gt;
-&lt;/div&gt;
-
-&lt;ul id='uno' class='uno'&gt;
-  &lt;li class='dos'&gt;#uno:hover .dos - esto sí funciona.&lt;/li&gt;
-  &lt;li class='tres'&gt;.uno:hover .tres - esto NO funciona.&lt;/li&gt;
-  &lt;li class='cuatro'&gt;ul.uno:hover .cuatro - esto sí funciona.&lt;/li&gt;
-  &lt;li class='cinco'&gt;*.uno:hover .cinco - esto TAMPOCO funciona.&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-<h3 id="Navegadores_que_lo_soportan">Navegadores que lo implementan</h3>
-<p>Los navegadores pueden dividirse en dos grupos: IE y el resto.</p>
-<ul> <li><strong>IE</strong>: IE6 no lo implementa, pero IE7 sí, aunque parece que sólo parcialmente... (probado en IE7 beta).</li> <li><strong>El resto</strong>: cada día son más los navegadores que implementan este uso de las pseudo-clases: <ul> <li>Firefox 1.5 - sí lo implementa, al igual que todos los navegadores basados en las últimas versiones de Gecko.</li> <li>Opera - sí lo implementa (pendiente de confirmación plena).</li> <li>Konqueror/Safari - sí lo implementa (pendiente de confirmación plena) al igual que todos los navegadores basados en las últimas versiones de KHTML.</li> </ul> </li>
-</ul><h3 id="Referencia">Referencia</h3>
-<p>Lo cierto es que no hay mucho escrito sobre el tema (en castellano casi nada, o nada), la gente sólo suele escribir sobre las cosas que funcionan en IE. Pero tampoco hace mucha falta. Todo lo que necesitamos está en <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/cover.html#minitoc">el estándar CSS-2</a>. Además, <em>curiosamente</em>, los dos pilares que sostienen esta funcionalidad (pseudoclases y selectores), están explicados en la misma página: <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/selector.html">el capítulo 5</a>.</p>
-<p>Recomiendo encarecidamente la lectura completa y atenta de todo el capítulo, y ya puestos, de toda la especificación. Aunque para el asunto que nos ocupa nos interesan principalmente:</p>
-<dl> <dd>Sobre los selectores por parentesco, sub-capítulos: 5.5, 5.6, 5.7</dd> <dd>Sobre las pseudo-clases, sub-capítulo: 5.11</dd>
-</dl><h3 id="CSS-3"> CSS-3 </h3>
-<p>Todo lo explicado es conforme a CSS-2.1 ¿Qué nos depara el futuro? Si los pilares de esta técnica son las pseudo-clases y los selectores, <a class="external" href="http://www.w3.org/Style/CSS/current-work">CSS-3</a> traerá muchas más <a class="external" href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#pseudo-classes">pseudo-clases</a> y muchos más <a class="external" href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#selectors">selectores</a>, en definitiva, muchas más posibilidades de hacer cosas interesantes.
-</p><p>Por ejemplo, hemos visto las limitaciones de CSS-2 para seleccionar hermanos, con CSS-3 esta limitación desaparece. Lo siguiente es CSS-3 pero funciona (usando el navegador apropiado).
-</p>
-<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
-&lt;style type='text/css'&gt;
-
-.gracias { visibility: hidden; }
-
-#primero:hover + .gracias { visibility: visible; }
-#primero:hover ~ * span { color: red; } /* esto:'~' es CSS-3 */
-
-&lt;/style&gt;
-
-&lt;ul&gt;
-  &lt;li id='primero'&gt;Por favor, ponga el cursor encima de esta frase.&lt;/li&gt;
-  &lt;li class='gracias'&gt;Le doy las gracias con CSS-2.1&lt;/li&gt;
-  &lt;li&gt;Item normal y corriente&lt;/li&gt;
-  &lt;li&gt;El futuro: &lt;span&gt;span en rojo gracias a CSS-3&lt;/span&gt;&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-<h3 id="Notas_finales"> Notas finales </h3>
-<ul><li> Sí, es cierto que con <a href="es/JavaScript">JavaScript</a> o PHP pueden hacerse cosas mucho más avanzadas, pero aquí está la gracia del artículo, que sin necesidad de Javascript o PHP, solo con CSS, puede añadírsele mucho dinamismo a las páginas web.
-</li></ul>
-<ul><li> Este artículo es sólo una introducción al tema, por razones didácticas los ejemplos son premeditadamente simples y limitados a una sola pseudo-clase (:hover). Puede que en el futuro exista un <a href="es/CSS_Din%c3%a1mico_II">CSS Dinámico II</a> que profundice más en el tema, muestre el uso de otras pseudo-clases y ejemplos más complejos.
-</li></ul>
-<p><span class="comment">Categorías</span>
-</p>
diff --git a/files/es/desarrollando_mozilla/index.html b/files/es/desarrollando_mozilla/index.html
deleted file mode 100644
index 4551e8fea2..0000000000
--- a/files/es/desarrollando_mozilla/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
----
-title: Desarrollando Mozilla
-slug: Desarrollando_Mozilla
-tags:
-  - Desarrollando_Mozilla
-  - Todas_las_Categorías
----
-<p>¿Quieres echar una mano corrigiendo bugs, pero no sabes por dónde empezar?</p>
-<p>Este es el punto de partida para todo lo relacionado con el hackeo de la bestia. Descubrirás cómo conseguir el código fuente, cómo compilarlo, cómo crear parches, y todas esas cosas esenciales que cualquier hacker de Mozilla debería conocer.</p>
-<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Documentaci.C3.B3n"><a href="/Special:Tags?tag=Desarrollando_Mozilla&amp;language=es" title="Special:Tags?tag=Desarrollando_Mozilla&amp;language=es">Documentación</a></h4> <dl> <dt><a href="/es/Descargar_el_código_fuente_de_Mozilla" title="es/Descargar_el_código_fuente_de_Mozilla">Descargar el código fuente de Mozilla</a></dt> <dd><small>El código fuente de Mozilla puede obtenerse descargando el archivo con el código fuente o usando el cliente CVS (Concurrent Versioning System).</small></dd> </dl> <dl> <dt><a href="/es/Hackeando_Firefox" title="es/Hackeando_Firefox">Hackeando Firefox</a></dt> <dd><small>Participa en el desarrollo de <em>front-end</em> de Firefox.</small></dd> </dl> <dl> <dt><a href="/es/Documentación_para_la_compilación" title="es/Documentación_para_la_compilación">Documentación para la compilación</a></dt> <dd><small>Esta sección contiente documentación sobre el sistema de compilación de Mozilla. Entre otras cosas, muestra como obtener el código y como compilarlo.</small></dd> </dl> <dl> <dt><a class="external" href="http://www.mozilla.org/hacking/">Hacking documentation on mozilla.org (en)</a></dt> <dd><small>Another page with hacking-related documentation. We're working on this.</small></dd> </dl> <dl> <dt>Preguntas frecuentes sobre depuración.</dt> <dd><small>Los consejos de depuración son específicos para cada plataforma. Elija: <a href="/es/Depurando_Mozilla_en_Windows" title="es/Depurando_Mozilla_en_Windows">Windows</a>, <a class="external" href="http://www.mozilla.org/unix/debugging-faq.html">Linux</a>, o <a href="/es/Depurando_Mozilla_en_Mac_OS_X" title="es/Depurando_Mozilla_en_Mac_OS_X">Mac OS X</a>.</small></dd> </dl> <p><span>enlaces en rojo: ; <a href="/es/Creando_un_parche" title="es/Creando un parche">Creando un parche</a>: &lt;small&gt;Consejos para crear parches que permitan que tus cambios se incluyan.&lt;/small&gt;</span> <span><a href="/Special:Tags?tag=Desarrollando_Mozilla&amp;language=es" title="Special:Tags?tag=Desarrollando_Mozilla&amp;language=es">Ver más...</a></span></p> </td> <td> <h4 id="Comunidad">Comunidad</h4> <ul> <li>En mozillaES <ul> <li><a class="external" href="http://www.mozillaes.org/index.php?option=com_forum&amp;Itemid=122&amp;page=viewforum&amp;f=15&amp;sid=b486df56e1b6b367ab5a0e85a612bbf6">Desarrollo Mozilla</a></li> </ul> </li> </ul> <ul> <li>En la comunidad Mozilla... en inglés</li> </ul> <p>{{ DiscussionList("dev-general", "mozilla.dev.general") }}</p> <ul> <li><a class="link-irc" href="irc://irc.mozilla.org/developers">#developers en irc.mozilla.org</a></li> <li><a class="external" href="http://www.mozilla.org/community/developer-forums.html">Lista de temas específicos para todos los foros sobre desarrollo</a></li> </ul> <p><span><a href="/es/Desarrollando_Mozilla/Comunidad" title="es/Desarrollando_Mozilla/Comunidad">Ver más...</a></span></p> <h4 id="Herramientas">Herramientas</h4> <ul> <li><a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?format=guided">Bugzilla</a></li> <li><a class="external" href="http://bonsai.mozilla.org/cvsqueryform.cgi">Bonsai</a></li> <li><a href="/es/Tinderbox" title="es/Tinderbox">Tinderbox</a></li> <li><a class="external" href="http://lxr.mozilla.org/">Mozilla Cross-Reference (LXR)</a></li> </ul> <p><span><a href="/Special:Tags?tag=Desarrollando_Mozilla:Herramientas&amp;language=es" title="Special:Tags?tag=Desarrollando_Mozilla:Herramientas&amp;language=es">Ver más...</a></span></p> <h4 id="Temas_Relacionados">Temas Relacionados</h4> <dl> <dd><a href="/es/Garantía_de_Calidad" title="es/Garantía_de_Calidad">Garantía de Calidad</a>, <a href="/es/Seguridad" title="es/Seguridad">Seguridad</a></dd> </dl> </td> </tr> </tbody>
-</table>
-<p><span>Categorías</span></p>
-<p><span>Interwiki Language Links</span></p>
-<p> </p>
-
-<p>{{ languages( { "de": "de/Mozilla_entwickeln", "en": "en/Developing_Mozilla", "fr": "fr/D\u00e9veloppement_de_Mozilla", "ja": "ja/Developing_Mozilla", "pl": "pl/Programowanie_Mozilli", "pt": "pt/Desenvolvimento_Mozilla", "zh-cn": "cn/\u5f00\u53d1Mozilla" } ) }}</p>
diff --git a/files/es/desarrollo_web/index.html b/files/es/desarrollo_web/index.html
deleted file mode 100644
index d6d72dfef3..0000000000
--- a/files/es/desarrollo_web/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: Desarrollo Web
-slug: Desarrollo_Web
-tags:
-  - Desarrollo_Web
-  - Todas_las_Categorías
-translation_of: Web/Guide
-translation_of_original: Web_Development
----
-<p>
-</p>
-<div class="callout-box"><b><a class="external" href="http://www.w3c.es/Divulgacion/Guiasbreves/WebSemantica">Guía Breve de Web Semántica</a></b> <br>
-Una magnífica introducción al tema.</div> <div>
-<div>
-<p>El <b>Desarrollo Web</b> abarca todos los aspectos necesarios para desarrollar un sitio o aplicación Web. Esto implica múltiples tecnologías, la mayoría cuentan con una sección específica en este wiki. En esta sección trataremos el tema desde una perspectiva más general.
-</p>
-</div>
-<table class="topicpage-table">
-<tbody><tr><td>
-<h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"> <a>Documentación</a> </h4>
-<dl><dt> <a class="external" href="http://www.w3c.es/Divulgacion/Guiasbreves/IndependenciaDispositivo">Guía Breve de Independencia de Dispositivo</a>
-</dt><dd> <small>"hacer la Web universal y accesible para cualquier persona, en cualquier sitio, en cualquier momento y usando cualquier dispositivo"</small>
-</dd></dl>
-<dl><dt> <a href="es/Selecci%c3%b3n_de_modo_en_Mozilla">Selección de modo en Mozilla</a>
-</dt><dd> <small>Este documento describe cómo Mozilla utiliza la declaración de DOCTYPE para determinar el modo de renderizado más apropiado para visualizar una página web. </small>
-</dd></dl>
-<dl><dt> <a href="es/Modo_casi_est%c3%a1ndar_de_Gecko">El modo casi estándar de Gecko</a>
-</dt><dd> <small>Además de los modos tradicionales, estándar y quirks, el motor gecko nos ofrece este modo intermedio. Puede que te interese.</small>
-</dd></dl>
-<dl><dt> <a class="external" href="http://www.mozilla.org/docs/web-developer/faq.html">Mozilla Web Author FAQ (en)</a>
-</dt><dd> <small>This document answers questions that Web authors ask frequently specifically in connection with Mozilla and other Gecko-based browsers such as Firefox.</small>
-</dd></dl>
-<p><span class="alllinks"><a>Ver más...</a></span>
-</p>
-</td> <td>
-<h4 id="Comunidad" name="Comunidad"> Comunidad </h4>
-<ul><li> En MozillaES
-<ul><li> <a class="external" href="http://www.mozillaes.org/index.php?option=com_forum&amp;Itemid=122&amp;page=viewforum&amp;f=13">Desarrollo web (HTML, CSS...)</a> </li></ul>
-</li></ul>
-<ul><li> En la comunidad Mozilla... en inglés
-</li></ul>
-<p>{{ DiscussionList("dev-web-development", "mozilla.dev.web-development") }}
-</p><p><span class="alllinks"><a href="es/Desarrollo_Web/Comunidad">Ver más...</a></span>
-</p>
-<h4 id="Herramientas" name="Herramientas"> Herramientas </h4>
-<ul><li> <a class="link-https" href="https://addons.mozilla.org/extensions/moreinfo.php?id=60&amp;application=firefox">Web Developer extension</a>
-</li><li> <a href="es/Venkman">Venkman</a>, the JavaScript debugger
-</li><li> <a href="es/DOM_Inspector">DOM Inspector</a>
-</li></ul>
-<p><span class="alllinks"><a>Ver más...</a></span>
-</p>
-<h4 id="Temas_relacionados" name="Temas_relacionados"> Temas relacionados </h4>
-<dl><dd><a href="es/HTML">HTML</a>, <a href="es/CSS">CSS</a>, <a href="es/XHTML">XHTML</a>, <a href="es/XML">XML</a>, <a href="es/AJAX">AJAX</a>, <a href="es/JavaScript">JavaScript</a>, <a href="es/Est%c3%a1ndares_Web">Estándares Web</a>
-</dd></dl>
-</td> </tr> </tbody></table>
-<p><span class="comment">Categorías</span>
-</p><p><span class="comment">Interwiki Language Links</span>
-</p>
-</div>
-{{ languages( { "de": "de/Webentwicklung", "en": "en/Web_Development", "fr": "fr/D\u00e9veloppement_Web", "it": "it/Sviluppo_Web", "ja": "ja/Web_Development", "pl": "pl/Programowanie_WWW" } ) }}
diff --git a/files/es/detectar_la_orientación_del_dispositivo/index.html b/files/es/detectar_la_orientación_del_dispositivo/index.html
deleted file mode 100644
index 08f93e1145..0000000000
--- a/files/es/detectar_la_orientación_del_dispositivo/index.html
+++ /dev/null
@@ -1,56 +0,0 @@
----
-title: Detectar la orientación del dispositivo
-slug: Detectar_la_orientación_del_dispositivo
-tags:
-  - Aceleración
-  - CSS
-  - Consultas
-  - Orientación
-  - para_revisar
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ gecko_minversion_header ("1.9.1") }}</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cada vez más, los dispositivos habilitados para la web son capaces de determinar su <strong>orientación,</strong> es decir, que pueden informar sobre los datos que indican cambios en su orientación con relación a la atracción de la gravedad.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En concreto, los dispositivos manuales como, por ejemplo, los teléfonos móviles pueden utilizar esta información para rotar automáticamente la pantalla de forma que se mantenga en posición vertical. Cuando el dispositivo se gira, presenta una vista en pantalla panorámica del contenido de la web, de manera que su anchura es superior a su altura.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Hay dos maneras de tratar la información de orientación en Gecko.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La primera es la <a href="/En/CSS/Media_queries#orientation" title="En/CSS/Media queries#orientation">consulta a medios de orientación</a> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto te permite ajustar el contenido de tu diseño con CSS, en función de si el dispositivo está en modo horizontal (es decir, su anchura es superior a su altura) o en modo vertical (su altura es mayor que su anchura).</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La segunda manera de administrar la información de orientación, , es el <a href="/en/DOM/MozOrientation" title="en/DOM/MozOrientation">evento </a></span></span><a href="/en/DOM/MozOrientation" title="en/DOM/MozOrientation"><code>MozOrientation</code></a><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a>, agregado en Gecko 1.9.2 (Firefox 3.6).</a></span></span><a> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Este evento se envía cuando el acelerómetro detecta un cambio en la orientación del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al recibir y procesar los datos reportados por los eventos <code>MozOrientation</code>, es posible responder de forma interactiva a los cambios de elevación y rotación causados por el movimiento del dispositivo.</span></span></a></p><a>
-<h2 id="Ajuste_de_diseño_cuando_cambia_la_orientación"><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Ajuste de diseño cuando cambia la orientación</span></span></h2>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Uno de los casos en que te interesarán los cambios de orientación es cuando quieras evaluar el diseño de tu contenido en función de la orientación del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por ejemplo, tal vez desees que una barra de botones se extienda a lo largo de la pantalla del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si utilizas una consulta multimedia, puede hacer esto fácilmente y de forma automática.</span></span></p>
-<h3 id="Construir_el_CSS_para_cada_orientación"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Construir el CSS para cada orientación</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para este caso práctico, necesitarás dos hojas de estilo: una para ser usada cuando el dispositivo está en orientación vertical (su altura es mayor que su anchura) y la otra que se utiliza cuando el dispositivo está en posición horizontal (su ancho es mayor a su altura).</span></span></p>
-<table class="standard-table" style="width: auto;"> <tbody> <tr> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Vertical</span></span></td> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Horizontal</span></span></td> </tr> <tr> <td> <p><code>#toolbar {</code><br> <code>   width: 100%;</code><br> <code> }</code><br> <code> </code></p> </td> <td><code>#toolbar {</code><br> <code>   min-height: 500px;</code><br> <code>   width: 125px;</code><br> <code>   margin-right: 8px;</code><br> <code>   float: left;</code><br> <code> }</code><br> <code> </code></td> </tr> </tbody>
-</table>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Como puedes ver si analizas los dos fragmentos de CSS anteriores, en el modo vertical, hacemos que la barra de herramientas se extienda horizontalmente en la parte superior de la ventana, con el fin de maximizar el espacio horizontal disponible para el contenido.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el modo horizontal, la barra de herramientas se extiende verticalmente por el lado izquierdo del documento.</span></span></p>
-<h3 id="La_aplicación_del_CSS_correcto_en_función_de_la_orientación_actual"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La aplicación del CSS correcto en función de la orientación actual</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo único que tienes que hacer ahora es establecer las consultas multimedia que seleccionará automáticamente el archivo CSS correcto basado en la orientación del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto es sencillo:</span></span></p>
-<pre class="brush: css">&lt;link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css"&gt;
-&lt;link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css"&gt;
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">A partir de ahora, la carga de los contenidos da como resultado la disposición correcta que se aplicará en función de la orientación del dispositivo.</span></span></p><h2 id="Procesamiento_de_eventos_de_orientación"><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Procesamiento de eventos de orientación</span></span></h2>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ gecko_minversion_header("1.9.2") }}</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Firefox 3.6 (Gecko 1.9.2) introdujo el evento <code>MozOrientation</code>, al que puedes prestar atención con el fin de recibir las actualizaciones mientras el usuario ajusta la orientación del dispositivo.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En la actualidad, este es compatible con algunos dispositivos móviles (Windows Mobile, por ejemplo) y en el MacBook de Apple y los equipos MacBook Pro.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo único que tienes que hacer para comenzar a recibir los eventos de orientación es lo siguiente:</span></span></p>
-<pre class="brush: js">window.addEventListener("MozOrientation", handleOrientation, true);</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Después de registrar tu escucha de eventos (en este caso, una función de JavaScript llamada handleOrientation()), la función de escucha se llama de forma periódica con la orientación de datos actualizada.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El evento de orientación contiene tres valores:</span></span></p>
-<table class="standard-table"> <tbody> <tr> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Campo</span></span></td> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Tipo</span></span></td> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Descripción</span></span></td> </tr> <tr> <td><code>x</code></td> <td><code>double</code></td> <td><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La cantidad de inclinación a lo largo del eje X.</span></span></td> </tr> <tr> <td><code>y</code></td> <td><code>double</code></td> <td><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La cantidad de inclinación a lo largo del eje Y.</span></span></td> </tr> <tr> <td><code>z</code></td> <td><code>double</code></td> <td><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El importe de la inclinación a lo largo del eje Z.</span></span></td> </tr> </tbody>
-</table>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los valores de <code>x</code> , <code>y</code> y <code>z</code> pueden variar desde -1 a 1, donde 0 significa que el dispositivo está en equilibrio sobre ese eje.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La función de controlador o manejador de eventos puede ser algo así:</span></span></p>
-<pre class="brush: js">function handleOrientation(orientData) {
-  var x = orientData.x;
-  var y = orientData.y;
-  var z = orientData.z;
-
-  // Haz cosas con los datos de orientación nuevos
-}
-</pre>
-<h3 id="Los_valores_del_acelerómetro_explicados"><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los valores del acelerómetro explicados</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El valor indicado para cada acceso indica la cantidad de la aceleración a lo largo de ese eje que está teniendo lugar actualmente.</span></span></p>
-<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><strong>Nota:</strong> en esta sección se describe cómo estos valores funcionan en la actualidad, sin embargo, esto está sujeto a cambios en un futuro.</span></span></div>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El eje X representa la cantidad de inclinación de derecha a izquierda.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este valor es 0 si el dispositivo está a nivel del eje X, y se aproxima a 1 si el dispositivo se inclina hacia la izquierda, y -1 si el dispositivo se inclina hacia la derecha.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El eje Y representa la cantidad de inclinación de adelante hacia atrás.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El valor es 0 si el dispositivo está a nivel del eje Y, y se aproxima a 1 a medida que inclinas el dispositivo hacia atrás (lejos de ti) y -1 si inclinas el dispositivo hacia el frente (hacia ti).</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El eje Z representa la aceleración vertical.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El valor es 1 cuando el dispositivo está pasando por la gravedad terrestre estándar (9.8m/sec <sup>2),</sup> pero no en movimiento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al mover el dispositivo hacia arriba hace que el valor descienda.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El valor es 0 si el dispositivo está en caída libre (ingrávido o precipitándose como consecuencia de una caída).</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En ingravidez, todos los valores será igual a cero cuando el dispositivo no se mueva, independientemente de su orientación, y sólo cambiará cuando se acelere.</span></span></p><h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Consulta también</span></span></h2>
-</a><ul><a> </a><li><a><code></code></a><code><a href="/en/DOM/MozOrientation" title="en/DOM/MozOrientation">MozOrientation</a></code></li> <li><a class=" external" href="http://hacks.mozilla.org/2009/06/media-queries/" title="http://hacks.mozilla.org/2009/06/media-queries/"><span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Una breve introducción a las consultas multimedia en Firefox 3.5</span></span></a></li>
-</ul>
-<p>{{ languages ( { "en": "en/Detecting_device_orientation" } ) }}</p>
diff --git a/files/es/dhtml/index.html b/files/es/dhtml/index.html
deleted file mode 100644
index ee735a29bc..0000000000
--- a/files/es/dhtml/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: DHTML
-slug: DHTML
-tags:
-  - DHTML
-  - Todas_las_Categorías
-translation_of: Glossary/DHTML
----
-<p>
-</p>
-<div><b>DHTML es la abreviatura de "HTML dinámico"</b>.El término DHTML se usa generalmente para referirse al código del que están hechas las páginas web interactivas que no requieren la utilización de plugins tales como Flash o Java.El término abarca las funcionalidades disponibles para los desarrolladores web que utilizan las tecnologías <a href="es/HTML">HTML</a>, <a href="es/CSS">CSS</a>, <a href="es/DOM">Document Object Model</a>, y <a href="es/JavaScript">JavaScript</a> de forma combinada.
-</div>
-<table class="topicpage-table">
-<tbody><tr><td>
-<h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"> <a>Documentación</a> </h4>
-<dl><dt> <a href="es/Referencia_de_Objetos_Clientes_DOM">Referencia de Objetos Clientes DOM</a>
-</dt><dd> <small>Esta referencia de objetos clientes proporciona información sobre los objetos usados comúnmente en DHTML, y su intención es ayudar a determinar que propiedades están soportadas en cada navegador.</small>
-</dd></dl>
-<dl><dt> <a href="es/DHTML_Demostraciones_del_uso_de_DOM%2f%2fStyle">DHTML Demostraciones del uso de DOM/Style</a>
-</dt><dd> <small>Demostraciones de Modelo de Objetos del Documento(DOM) , Cross-browser widgets, y recursos adicionales para aprender sobre DOM.</small>
-</dd></dl>
-<dl><dt> <a href="es/Soluci%c3%b3n_a_errores_DHTML_en_Firefox_1.0.3">Solución a errores DHTML en Firefox 1.0.3</a>
-</dt><dd> <small>Tenga en cuenta que los problemas tratados en este artículo se han solucionado en la versión 1.0.4 de Firefox, y este documento solo es de aplicación a las versiones 1.0.3 del navegador.
-</small></dd></dl>
-<p>
-</p><p><span class="alllinks"><a>View All...</a></span>
-</p>
-</td>
-<td>
-<h4 id="Comunidad" name="Comunidad"> Comunidad </h4>
-<ul><li> Ver foros en Mozilla ...
-</li></ul>
-<p>{{ DiscussionList("dev-ajax", "mozilla.dev.ajax") }}
-</p>
-<h4 id="Herramientas" name="Herramientas"> Herramientas </h4>
-<ul><li> <a class="link-https" href="https://addons.mozilla.org/extensions/moreinfo.php?id=1843&amp;application=firefox">Extensión Firebug para Firefox</a>
-</li></ul>
-<h4 id="Temas_Relacionados" name="Temas_Relacionados"> Temas Relacionados </h4>
-<dl><dd> <a href="es/AJAX">AJAX</a>, <a href="es/CSS">CSS</a>, <a href="es/DOM">DOM</a>, <a href="es/HTML">HTML</a>, <a href="es/JavaScript">JavaScript</a>
-</dd></dl>
-</td>
-</tr>
-</tbody></table>
-<p><span class="comment">Categories</span>
-</p><p><span class="comment">Interwiki Language Links</span>
-</p><p><br>
-</p>{{ languages( { "en": "en/DHTML", "fr": "fr/DHTML", "ja": "ja/DHTML", "ko": "ko/DHTML", "pl": "pl/DHTML", "pt": "pt/DHTML" } ) }}
diff --git a/files/es/dhtml_demostraciones_del_uso_de_dom_style/index.html b/files/es/dhtml_demostraciones_del_uso_de_dom_style/index.html
deleted file mode 100644
index 9ceaa0803d..0000000000
--- a/files/es/dhtml_demostraciones_del_uso_de_dom_style/index.html
+++ /dev/null
@@ -1,49 +0,0 @@
----
-title: DHTML Demostraciones del uso de DOM/Style
-slug: DHTML_Demostraciones_del_uso_de_DOM_Style
-tags:
-  - CSS
-  - DHTML
-  - DOM
-  - JavaScript
-  - Todas_las_Categorías
----
-<p>
-</p><p><b>Proyecto de ejemplos DOM Mozilla</b>
-</p><p><a class="external" href="http://cgi.din.or.jp/%7Ehagi3/JavaScript/Mozilla/SampleList.cgi?fmt=html">Esta página</a> contiene una lista de ejemplos DOM basados en sus diversas características. La lista incluye demostraciones para eventos DOM, DOM Core, DOM HTML y mucho más.
-</p><p><b> Animación y manipulación de elementos de texto </b>
-</p>
-<ul><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/colorfades.html">Atenuación de colores</a>
-</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/textinterlace.html">Text Interlace Effect</a>
-</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/fadespacing.html">Atenuación y espaciado</a>
-</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/bouncingsmile.html">Texto animado 1</a> - <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/geckowave.html">y 2</a>
-</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/credits.html">Demo de títulos de crédito</a> (requiere Netscape 7.x/Mozilla)
-</li></ul>
-<p><b> Animación 3D en tiempo real </b>
-</p><p><a class="external" href="http://www.world-direct.com/mozilla/dhtml/funo/3dcube/index.htm">Esta demostración</a> muestra cómo usar JavaScript y DOM para animar un conjunto de imágenes para crear un efecto de animación 3D.
-</p>
-<h3 id="Demostraciones_DOM_.28Requiere_navegador_que_interprete_DOM_1_y_2.29"> Demostraciones DOM (Requiere navegador que interprete DOM 1 y 2) </h3>
-<p><b> Estilo DOM: Recortar y posicionar elementos con la interfaz JavaScript DOM </b>
-</p><p><a class="external" href="http://www.mozilla.org/docs/dom/samples/can/index.html">Esta demostración</a> está optimizada para funcionar con Mozilla porque usa imágenes PNG con canal alpha. Demuestra el uso de interfaces DOM para establecer el valor de las propiedades de posición y recorte de los elementos DIV.
-</p><p><b> Eventos DOM 1 y DOM 2: Arrastrar y redimensionar un elemento usando DOM </b>
-</p><p><a class="external" href="http://www.mozilla.org/docs/dom/samples/resize/index.html">Esta muestra</a> requiere un navegador compatible con eventos DOM 1 y DOM 2. Ha sido probado con Netscape 7.x/Mozilla.
-</p><p><b> DOM 1 y DOM 2: Manipulando dinámicamente una tabla de elementos </b>
-</p><p><a class="external" href="http://www.mozilla.org/docs/dom/samples/dynatable-light/index.html">Esta demo</a> requiere un navegador que soporte la especificación DOM 1 y DOM 2, como Netscape 7.x o Mozilla. Usa los eventos DOM 2 del ratón para proporcionar un interfaz que puede manipular dinámicamente los elementos de la tabla.
-</p>
-<h3 id="Controles_multiplataforma"> Controles multiplataforma </h3>
-<p><b>Windowing API: La ventana DHTML de BrainJar </b>
-</p><p><a class="external" href="http://www.brainjar.com/dhtml/windows/demo.html">BrainJar's DHTML Windows</a> es un control (<i>widget</i>) que muestra cómo añadir ventanas DHTML dinámicas en una aplicación DHTML.
-</p><p><b> Stock Ticker </b>
-</p><p><a class="external" href="http://developer.mozilla.org/en/docs/DHTML_Demonstrations_Using_DOM/Style:Stock_Ticker">Stock Ticker</a> proporciona un objeto reutilizable que puede adaptarse para monitorizar (mediante una línea en movimiento) valores financieros en cualquier navegador que soporte el estándar DOM.
-<br>
-</p>
-<h3 id="Recursos_adicionales_para_aprender_DOM"> Recursos adicionales para aprender DOM </h3>
-<p><b> Cruzando una tabla HTML con JavaScript e Interfaces DOM </b>
-</p><p><a class="external" href="http://www.mozilla.org/docs/dom/technote/tn-dom-table/">Una visión</a> general sobre los métodos DOM de nivel 1 y de cómo usarlos mediante JavaScript. Estas notas técnicas cubren los métodos del núcleo, que son los que permiten la creación y manipulación dinámica de los elementos de marcado mediante JavaScript.
-</p><p><b> DOM Central </b>
-</p><p>Aprenda más acerca de <a href="es/DOM">W3C DOM</a>.
-</p><p><b> Visita GetElementById.com </b>
-</p><p><a class="external" href="http://getelementbyid.com/">GetElementById.com</a> contiene scripts DHTML y tutoriales que emplean W3C DOM. Descubre la <a class="external" href="http://getelementbyid.com/scripts/index.aspx?CodeID=28">demo Zoom Intro</a> y otras magníficas demostraciones y scripts DOM.
-</p><p><b> La categoría W3C DOM en DMOZ.ORG </b>
-</p><p><a class="external" href="http://dmoz.org/Computers/Programming/Languages/JavaScript/W3C_DOM/">Esta categoría</a> contiene notas técnicas, tutoriales y otros muchos recursos relacionados con JavaScript y W3C DOM.
-</p>{{ languages( { "en": "en/DHTML", "fr": "fr/DHTML", "ja": "ja/DHTML", "ko": "ko/DHTML", "pl": "pl/DHTML", "pt": "pt/DHTML" } ) }}
diff --git a/files/es/dibujando_gráficos_con_canvas/index.html b/files/es/dibujando_gráficos_con_canvas/index.html
deleted file mode 100644
index e7dbd60c0e..0000000000
--- a/files/es/dibujando_gráficos_con_canvas/index.html
+++ /dev/null
@@ -1,5 +0,0 @@
----
-title: Dibujando Gráficos con Canvas
-slug: Dibujando_Gráficos_con_Canvas
----
-<p>v</p>
diff --git a/files/es/dibujar_texto_usando_canvas/index.html b/files/es/dibujar_texto_usando_canvas/index.html
deleted file mode 100644
index 10a5970824..0000000000
--- a/files/es/dibujar_texto_usando_canvas/index.html
+++ /dev/null
@@ -1,67 +0,0 @@
----
-title: Dibujar texto usando canvas
-slug: Dibujar_texto_usando_canvas
-tags:
-  - 'HTML:Canvas'
-translation_of: Web/API/Canvas_API/Tutorial/Drawing_text
----
-<p>{{ Gecko_minversion_header(1.9) }}
-{{ Fx_minversion_header(3) }}
-El elemento <code><a href="es/HTML/Canvas">&lt;canvas&gt;</a></code> permite dibujar texto en él a través de una API experimental de Mozilla.
-</p>
-<h3 id="API" name="API"> API </h3>
-<pre class="eval">attribute DOMString mozTextStyle;
-void mozDrawText(in DOMString textToDraw);
-float mozMeasureText(in DOMString textToMeasure);
-void mozPathText(in DOMString textToPath);
-void mozTextAlongPath(in DOMString textToDraw, in boolean stroke);
-</pre>
-<h3 id="Notas" name="Notas"> Notas </h3>
-<ul><li> El tipo de letra predeterminado es sans-serif 12pt.
-</li><li> Estas extensiones de texto no están aún estandarizadas por WHATWG.
-</li><li> No necesitas un contexto especial para usarlas; el contexto 2D funciona bien.
-</li><li> Todos los dibujos se realizan usando la transformación actual.
-</li><li> Revisa el {{ Bug(339553) }} si quieres leer más sobre las implementaciones específicas.
-</li></ul>
-<h3 id="Demostraciones" name="Demostraciones"> Demostraciones </h3>
-<p>Mira algunos ejemplos <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273497">aquí</a>, <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273498">aquí</a>, y <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273499">aquí</a>.
-</p>
-<h3 id="Cambiar_el_tipo_de_letra_actual" name="Cambiar_el_tipo_de_letra_actual"> Cambiar el tipo de letra actual </h3>
-<p>El atributo <code>mozTextStyle</code> contiene el estilo de texto actual. Usa la misma sintaxis que el especificado para las <a href="es/CSS/font">tipografías CSS</a>.
-</p><p>Ej:
-</p>
-<pre class="eval">ctx.mozTextStyle = "20pt Arial"
-</pre>
-<h3 id="Dibujar_texto" name="Dibujar_texto"> Dibujar texto </h3>
-<p>Dibujar es muy sencillo. <code>mozDrawText</code> usa el estilo de texto actual, cualquiera que sea éste. Se usa el color de relleno del contexto como color del texto.
-</p>
-<pre class="eval">ctx.translate(10, 50);
-ctx.fillStyle = "Red";
-ctx.mozDrawText("Sample String");
-</pre>
-<h3 id="Medir_texto" name="Medir_texto"> Medir texto </h3>
-<p>A veces es útil saber qué tan ancho es un trozo de texto en particular (para centrarlo en una ventana, por ejemplo).
-</p>
-<pre class="eval">var text = "Sample String";
-var width = ctx.canvas.width;
-var len = ctx.mozMeasureText(text);
-ctx.translate(len/2, 0);
-ctx.mozDrawText(text);
-</pre>
-<h3 id="Interacci.C3.B3n_texto.2Ftrazo" name="Interacci.C3.B3n_texto.2Ftrazo"> Interacción texto/trazo </h3>
-<p>Si quieres tachar un texto, <code>mozDrawText</code> no te lo permite. En cambio, <code>mozPathText</code> agrega el tachado de texto al trazo actual.
-</p>
-<pre class="eval">ctx.fillStyle = "green";
-ctx.strokeStyle = "black";
-ctx.mozPathText("Sample String");
-ctx.fill()
-ctx.stroke()
-</pre>
-<p>Supongamos ahora que quieres agregar un texto que se acomode a un trazo que dibujaste (una línea curva o algo parecido) es donde aparece <code>mozTextAlongPath</code>. Al contrario de otras funciones de texto, <code>mozTextAlongPath</code> necesita dos argumentos: el texto y qué se quiere hacer con él. <code>mozTextAlongPath</code> aproxima el trazo actual como una serie de segmentos de línea y ubica cada carácter encima de ese trazo. Los caracteres no son cambiados de tamaño o transformados de acuerdo a la curvatura de la base; toman la orientación del trazo a la mitad del carácter.
-</p><p>Una vez que <code>mozTextAlongPath</code> sabe dónde está el carácter, busca el segundo parámetro para decidir qué hacer con él. Si el segundo parámetro es <code>false</code>, entonces dibuja el carácter como lo haría <code>mozDrawText</code>. Si es <code>true</code>, agrega el carácter al trazo actual, como lo hace <code>mozPathText</code>. Esto puede usarse para crear efectos únicos.
-</p><p><br>
-</p><p><br>
-</p>
-<div class="noinclude">
-</div>
-{{ languages( { "en": "en/Drawing_text_using_a_canvas", "fr": "fr/Dessin_de_texte_avec_canvas", "ja": "ja/Drawing_text_using_a_canvas", "pl": "pl/Rysowanie_tekstu_przy_u\u017cyciu_canvas" } ) }}
diff --git a/files/es/dom/almacenamiento/index.html b/files/es/dom/almacenamiento/index.html
deleted file mode 100644
index 6889022c7a..0000000000
--- a/files/es/dom/almacenamiento/index.html
+++ /dev/null
@@ -1,303 +0,0 @@
----
-title: Almacenamiento
-slug: DOM/Almacenamiento
-tags:
-  - DOM
-  - JavaScript
-  - Referencia_DOM_de_Gecko
-  - Todas_las_Categorías
-  - para_revisar
-translation_of: Web/API/Web_Storage_API
-translation_of_original: Web/Guide/API/DOM/Storage
----
-<p>{{ ApiRef() }}</p>
-<h3 id="Introducci.C3.B3n" name="Introducci.C3.B3n">Introducción</h3>
-<p>El almacenamiento DOM (DOM Storage) es el nombre dado al conjunto de <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#storage">características relacionadas con el almacenamiento</a> introducidas en la especificación de <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">aplicaciones web 1.0</a> y ahora detalladas por separado en su propia especificación <a class="external" href="http://dev.w3.org/html5/webstorage/" rel="external nofollow" title="http://dev.w3.org/html5/webstorage/">W3C Web Storage</a>. El almacenamiento DOM está diseñado para facilitar una forma amplia, segura y sencilla para almacenar información alternativa a las cookies. Fue introducido por primera vez en <a href="/es/Firefox_2_para_desarrolladores" title="es/Firefox_2_para_desarrolladores">Firefox 2</a> y <a class="external" href="http://developer.apple.com/safari/library/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Name-ValueStorage/Name-ValueStorage.html" rel="external nofollow" title="http://developer.apple.com/safari/library/documentation/iPhone/Conceptual/SafariJSDatabaseGuide/Name-ValueStorage/Name-ValueStorage.html">Safari 4</a> .</p>
-<div class="note">
- <strong>Nota:</strong> el almacenamiento DOM no es lo mismo que <a href="/es/Almacenamiento" title="es/Almacenamiento">mozStorage</a> (las interfaces XPCOM de Mozilla para SQLite) o la <a href="/es/API_para_guardar_sesiones" title="es/API_para_guardar_sesiones">API para guardar sesiones</a> (una utilidad de almacenamiento <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> usada por extensiones).</div>
-<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
-<p>El mecanismo de almacenamiento DOM es el medio a través del cual pares de clave/valor pueden ser almacenadas de forma segura para ser recuperadas y utilizadas más adelante. La meta de este añadido es suministrar un método exhaustivo a través del cual puedan construirse aplicaciones interactivas (incluyendo características avanzadas tales como ser capaces de trabajar "sin conexión" durante largos períodos de tiempo).</p>
-<p>Actualmente los navegadores basados en Mozilla, Internet Explorer 8+ y Safari 4 y Chrome proporcionan una implementación funcional de la especificación del almacenamiento DOM. Sin embargo, las versiones anteriores a Internet Explorer 8 poseen una característica similar llamada "<a class="external" href="http://msdn.microsoft.com/workshop/author/behaviors/reference/behaviors/userdata.asp">userData behavior</a>" que permite conservar datos entre múltiples sesiones.</p>
-<p>El almacenamiento DOM es útil ya que ningún navegador dispone de buenos métodos para conservar cantidades razonables de datos durante un periodo de tiempo. Las <a class="external" href="http://en.wikipedia.org/wiki/HTTP_cookie">cookies de los navegadores</a> tienen una capacidad limitada y no implementan una forma de organizar datos persistentes y otros métodos (tales como <a class="external" href="http://www.macromedia.com/support/documentation/en/flashplayer/help/help02.html">almacenamiento local de Flash</a>) necesitan un plugin externo.</p>
-<p>Una de las primeras aplicaciones hechas públicas que hace uso de la nueva funcionalidad de almacenamiento DOM (además del userData Behavior de Internet Explorer) fue <a class="external" href="http://aaronboodman.com/halfnote/">halfnote</a> (una aplicación para tomar notas) escrita por <a class="external" href="http://aaronboodman.com/">Aaron Boodman</a>. En su aplicación, Aaron enviaba notas hacia el servidor (cuando la conexión a Internet estaba disponible) y simultáneamente las guardaba en local. Esto permitía al usuario escribir notas de modo seguro incluso cuando no disponía de conexión a Internet.</p>
-<p>Aunque el concepto e implementación presentada en halfnote era en comparación simple, su creación mostró las posibilidades de esta nueva generación de aplicaciones web utilizables tanto con conexión como sin ella.</p>
-<h3 id="Referencias" name="Referencias">Referencia</h3>
-<p>Los siguientes objetos globales existen como propiedades de cada <a href="/es/DOM/window" title="es/DOM/window">objeto <code>window</code></a>. Esto significa que se puede acceder a ellas como <code>sessionStorage</code> o <code>window.sessionStorage</code> (esto es importante ya que se puede usar IFrames para almacenar o acceder a datos adicionales, más allá de lo que está inmediatamente incluido en la página).</p>
-<h4 id="sessionStorage" name="sessionStorage"><code>Storage</code></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-1"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este es un constructor ( <code>Storage</code> ) para todos los objetos de almacenamiento ( <code>sessionStorage</code> y <code>globalStorage[location.hostname]).</code></span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al hacer <code>Storage.prototype.removeKey = function(key){ this.removeItem(this.key(key)) }</code> podrías usar luego como atajo a la función <code>removeItem("key")</code> la forma <code>localStorage.removeKey and sessionStorage.removeKey</code>.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los elementos <code>globalStorage</code> no son de tipo <code>Storage</code> , sino <code>StorageObsolete</code> .</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><code>Storage</code> se define por la <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fdev.w3.org%2Fhtml5%2Fwebstorage%2F%23storage-0&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNGvCDT1Wf0oh4zXJCIScYRZKlrPAA">interfaz de almacenamiento</a> WhatWG de la siguiente forma:</span></span></p>
-<pre class="eval"><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">interface Storage {</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">readonly attribute unsigned long <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-length" title="http://dev.w3.org/html5/webstorage/#dom-storage-length">length</a>;</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">[IndexGetter]<a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-key" title="http://dev.w3.org/html5/webstorage/#dom-storage-key">key</a> DOMString (in unsigned long index);</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">[NameGetter] DOMString <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-getitem" title="http://dev.w3.org/html5/webstorage/#dom-storage-getitem">GetItem</a> (in DOMString key);</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">[NameSetter] void <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-setitem" title="http://dev.w3.org/html5/webstorage/#dom-storage-setitem">setItem</a> (in DOMString key, in DOMString data);</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">[NameDeleter] void <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-removeitem" title="http://dev.w3.org/html5/webstorage/#dom-storage-removeitem">removeItem</a> (in DOMString key);</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">void <a class="external" href="http://dev.w3.org/html5/webstorage/#dom-storage-clear" title="http://dev.w3.org/html5/webstorage/#dom-storage-clear">clear</a>();</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">};
-</span></span></pre>
-<p> </p>
-<div class="note">
- <strong>Nota: </strong>aunque los valores pueden establecerse y leerse a través del método de acceso de la propiedad de JavaScript estándar, se recomienda el uso de los métodos getItem y setItem.</div>
-<div class="note">
- <strong>Nota:</strong> ten en cuenta que todo lo que guardes en cualquiera de los almacenamientos (<em>storages) </em>descritos en esta página se convierte en una cadena a través de su método <code>.toString </code>almacenado anteriormente, por lo que al intentar almacenar un objeto común, se almacenará una cadena <code>"[object Object]" </code>en lugar del objeto o su representación JSON. Usar los métodos de serialización y análisis de JSON nativos que proporciona el navegador es una buena forma bastante común de almacenar objetos en formato cadena.</div>
-<h4 id="sessionStorage" name="sessionStorage"><code>sessionStorage</code></h4>
-<p>Este es un objeto global (<code>sessionStorage</code>) que mantiene un área de almacenamiento que está disponible durante la sesión de página. Una sesión de página existe mientras el navegador esté abierto y sobrevive a recargas o restauraciones de páginas. Abrir una página en una nueva pestaña o en una ventana provoca que se cree una nueva sesión.</p>
-<pre class="brush: js">// Guardar datos en el almacén de la sesión actual
-sessionStorage.setItem("username", "John");
-
-// Acceder a algunos datos guardados
-alert( "username = " + sessionStorage.getItem("username"));
-</pre>
-<p>El objeto <code>sessionStorage</code> es más usado para manejar datos temporales que deberían ser guardados y recuperados si el navegador es recargado accidentalmente.</p>
-<p>{{ fx_minversion_note("3.5", "Antes de Firefox 3.5, los datos de sessionStorage no se restablecían automáticamente después de recuperarse de un fallo del navegador. A partir de Firefox 3.5, funciona según la especificación.") }}</p>
-<p><strong>Ejemplos:</strong></p>
-<p>Autoguardado de los contenidos de un campo de texto y, si el navegador se recarga accidentalmente, restauración del contenido del campo de texto para evitar la pérdida de datos.</p>
-<pre class="brush: js"> // Obtener el campo de texto al que vamos a seguir la pista
- var field = document.getElementById("field");
-
- // Ver si se tiene un valor de autoguardado
- // (esto sólo sucede si la página es actualizada accidentalmente)
- if ( sessionStorage.getItem("autosave")) {
-    // Restaurar los contenidos del campo de texto
-    field.value = sessionStorage.getItem("autosave");
- }
-
- // Comprobar los contenidos del campo de texto cada segundo
- setInterval(function(){
-    // Y guardar los resultados en el objeto de almacenamiento de sesión
-    sessionStorage.setItem("autosave", field.value);
- }, 1000);
-</pre>
-<p><strong>Más información:</strong></p>
-<ul>
- <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#sessionstorage" title="http://www.whatwg.org/specs/web-apps/current-work/#sessionstorage">Especificación sessionStorage</a></li>
-</ul>
-<h4 id="globalStorage" name="globalStorage"><code>globalStorage</code></h4>
-<p> </p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ Non-standard_header() }} Este es un objeto global ( <code>globalStorage</code> ) que mantiene múltiples áreas de almacenamiento privado que se pueden utilizar para almacenar los datos durante un largo período de tiempo (por ejemplo, en varias páginas y las sesiones del navegador) .</span></span></p>
-<div class="warning">
- <span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Nota: <code>globalStorage</code> no es de tipo <code>Storage</code>, sino un objeto de tipo <code>StorageList</code> que contiene a su vez elementos <code>StorageObsolete</code>.</span></span></div>
-<pre class="brush: js">// Guardar datos a los que sólo pueden acceder scripts del dominio mozilla.org
-globalStorage['mozilla.org'].setItem("snippet", "&lt;b&gt;Hola&lt;/b&gt;, ¿cómo estás?");
-</pre>
-<p>Específicamente, el objeto <code>globalStorage</code> proporciona acceso a un número de diferentes objetos de almacenamiento en los que los datos pueden ser guardados. Por ejemplo, si se construye una página web que usa <code>globalStorage</code> en este dominio (developer.mozilla.org) se dispondría de los siguientes objetos de almacenamiento:</p>
-<ul>
- <li><code>globalStorage['developer.mozilla.org']</code>- Todas las páginas web dentro del subdominio developer.mozilla.org podrán leer de, y escribir datos en, este objeto de almacenamiento.</li>
-</ul>
-<p>{{ Fx_minversion_note(3, "Firefox 2 permitía el acceso a objetos de almacenamiento superiores en la jerarquía del dominio al documento actual, pero esto ya no se permite en Firefox 3 por razones de seguridad. Además, se ha eliminado esta adición propuesta a HTML 5 de la especificación en favor de <code>localStorage</code>, que se implementa a partir de Firefox 3.5.") }}</p>
-<p><strong>Ejemplos:</strong></p>
-<p>Todos estos ejemplos necesitan que haya un script insertado (con el siguiente código) en cada página en la que se quiera ver el resultado.</p>
-<p>Recordar el nombre un usuario para un subdominio en particular que está siendo visitado:</p>
-<pre class="brush: js"> globalStorage['developer.mozilla.org'].setItem("username", "John");
-</pre>
-<p>Seguir la pista al número de veces que un usuario visita todas las páginas de un dominio:</p>
-<pre class="brush: js"> // parseInt must be used since all data is stored as a string
- globalStorage['mozilla.org'].setItem("visits", parseInt(globalStorage['mozilla.org'].getItem("visits") || 0 ) + 1);
-</pre>
-<p> </p>
-<h4 class="editable" id="localStorage"><span><code>localStorage</code></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"><code>localStorage</code> es lo mismo que <code>globalStorage[location.hostname]</code>, excepto que está dentro del ámbito de un origen HTML5 (esquema + nombre de servidor + puerto no estándar), y que <code>localStorage</code> es un elemento de tipo <code>Storage</code> a diferencia de <code>globalStorage[location.hostname]</code>, que es de tipo <code>StorageObsolete</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Por ejemplo, <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fexample.com%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHbmhS24rOBWpzaMcUapS5k_3_-JQ" rel="external nofollow">http://example.com</a> no es capaz de acceder al mismo objeto <code>localStorage</code> que <a class="link-https" href="http://www.google.com/url?q=https%3A%2F%2Fexample.com%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFdUqh3fgxBA_n6BEUpV3eYKVuHXA" rel="external nofollow">https://example.com</a> pero pueden acceder al mismo objeto <code>globalStorage</code>. <code>localStorage</code> es una interfaz estándar, mientras que <code>globalStorage</code> no es estándar. <code>localStorage</code> fue introducida en Firefox 3.5.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Ten en cuenta que establecer una propiedad en <code>globalStorage[location.hostname]</code> <strong>no</strong> la establece en <code>localStorage</code> y extender <code>Storage.prototype</code> no afecta a los elementos <code>globalStorage</code>. Esto sólo se hace extendiendo <code>StorageObsolete.prototype</code>.</span></span></p>
-<div class="note">
- <span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"><strong>Nota:</strong> cuando el navegador entra en modo de navegación privada, se crea una nueva base de datos temporal para almacenar los datos locales de almacenamiento; </span></span><span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">esta base de datos se vacía cuando se sale del modo de navegación privada.</span></span></div>
-<div id="section_8">
- <h5 id="Compatibilidad">Compatibilidad</h5>
- <p>Los objetos <code>Storage</code> se han agregado recientemente al estándar, por lo que puede ocurrir que no estén presentes en todos los navegadores. Puedes solucionar esto insertando uno de los siguientes códigos al principio de tus scripts, lo que permitirá el uso del objeto <code>localStorage</code> object en aquellas implementaciones que de forma nativa no lo admitan.</p>
- <p>Este algoritmo es una imitación exacta del objeto <code>localStorage</code>, pero haciendo uso de cookies.</p>
- <pre class="brush: js">if (!window.localStorage) {
-  Object.defineProperty(window, "localStorage", new (function () {
-    var aKeys = [], oStorage = {};
-    Object.defineProperty(oStorage, "getItem", {
-      value: function (sKey) { return sKey ? this[sKey] : null; },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "key", {
-      value: function (nKeyId) { return aKeys[nKeyId]; },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "setItem", {
-      value: function (sKey, sValue) {
-        if(!sKey) { return; }
-        document.cookie = escape(sKey) + "=" + escape(sValue) + "; path=/";
-      },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "length", {
-      get: function () { return aKeys.length; },
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "removeItem", {
-      value: function (sKey) {
-        if(!sKey) { return; }
-        var sExpDate = new Date();
-        sExpDate.setDate(sExpDate.getDate() - 1);
-        document.cookie = escape(sKey) + "=; expires=" + sExpDate.toGMTString() + "; path=/";
-      },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    this.get = function () {
-      var iThisIndx;
-      for (var sKey in oStorage) {
-        iThisIndx = aKeys.indexOf(sKey);
-        if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); }
-        else { aKeys.splice(iThisIndx, 1); }
-        delete oStorage[sKey];
-      }
-      for (aKeys; aKeys.length &gt; 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); }
-      for (var iCouple, iKey, iCouplId = 0, aCouples = document.cookie.split(/\s*;\s*/); iCouplId &lt; aCouples.length; iCouplId++) {
-        iCouple = aCouples[iCouplId].split(/\s*=\s*/);
-        if (iCouple.length &gt; 1) {
-          oStorage[iKey = unescape(iCouple[0])] = unescape(iCouple[1]);
-          aKeys.push(iKey);
-        }
-      }
-      return oStorage;
-    };
-    this.configurable = false;
-    this.enumerable = true;
-  })());
-}
-</pre>
- <div class="note">
-  <strong>Nota:</strong> el tamaño máximo de datos que pueden guardarse está bastante restringido por el uso de cookies. Con este algoritmo, usa las funciones <code>localStorage.setItem()</code> y <code>localStorage.removeItem()</code> para agregar, cambiar o eliminar una clave. Usar los métodos <code>localStorage.tuClave = tuValor;</code> y <code>delete localStorage.tuClave;</code> para establecer o eliminar una clave <strong>no es muy seguro con este código</strong>. También puedes cambiar su nombre y usarlo para administrar las cookies de un documento independientemente del objeto localStorage.</div>
- <p>Aquí tienes otra imitación, menos exacta, del objeto <code>localStorage</code>. Es mucho más simple  que el anterior, pero es compatible con los navegadores antiguos como Internet Explorer &lt; 8. También usa cookies.</p>
- <pre class="brush: js">if (!window.localStorage) {
-  window.localStorage = {
-    getItem: function (sKey) {
-      if (!sKey || !this.hasOwnProperty(sKey)) { return null; }
-      return unescape(document.cookie.replace(new RegExp("(?:^|.*;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=\\s*((?:[^;](?!;))*[^;]?).*"), "$1"));
-    },
-    key: function (nKeyId) { return unescape(document.cookie.replace(/\s*\=(?:.(?!;))*$/, "").split(/\s*\=(?:[^;](?!;))*[^;]?;\s*/)[nKeyId]); },
-    setItem: function (sKey, sValue) {
-      if(!sKey) { return; }
-      document.cookie = escape(sKey) + "=" + escape(sValue) + "; path=/";
-      this.length = document.cookie.match(/\=/g).length;
-    },
-    length: 0,
-    removeItem: function (sKey) {
-      if (!sKey || !this.hasOwnProperty(sKey)) { return; }
-      var sExpDate = new Date();
-      sExpDate.setDate(sExpDate.getDate() - 1);
-      document.cookie = escape(sKey) + "=; expires=" + sExpDate.toGMTString() + "; path=/";
-      this.length--;
-    },
-    hasOwnProperty: function (sKey) { return (new RegExp("(?:^|;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=")).test(document.cookie); }
-  };
-  window.localStorage.length = (document.cookie.match(/\=/g) || window.localStorage).length;
-}
-</pre>
- <div class="note">
-  <strong>Nota:</strong> el tamaño máximo de datos que pueden guardarse está bastante restringido por el uso de cookies. Con este algoritmo, usa las funciones <code>localStorage.getItem()</code>, <code>localStorage.setItem()</code> y <code>localStorage.removeItem()</code> para agregar, cambiar o eliminar una clave. Usar los métodos <code>localStorage.tuClave</code> para obtener, establecer o eliminar una clave <strong>no es muy seguro con este código</strong>. También puedes cambiar su nombre y usarlo para administrar las cookies de un documento independientemente del objeto localStorage.</div>
- <h3 class="editable" id="Lugar_de_almacenamiento_y_borrado_de_datos"><span><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Lugar de almacenamiento y borrado de datos</span></span></span></h3>
- <p><span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Los datos de almacenamiento DOM se guardan en el <a class="external" href="http://kb.mozillazine.org/Webappsstore.sqlite" rel="external nofollow" title="http://kb.mozillazine.org/Webappsstore.sqlite">archivo webappsstore.sqlite</a> de la carpeta del perfil.</span></span></p>
- <ul>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Almacenamiento DOM se puede borrar a través de "Herramientas -&gt; Borrar Historial reciente -&gt; Cookies" cuando el rango de tiempo es "Todo" (a través de nsICookieManager:: removeAll)</span></span>
-   <ul>
-    <li><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Pero no cuando se especifica otro intervalo de tiempo: ( <a class="link-https" href="http://www.google.com/url?q=https%3A%2F%2Fbugzilla.mozilla.org%2Fshow_bug.cgi%3Fid%3D527667&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNEMF8WI1pO7c8uQnfOUS0KITnlz5Q" rel="external nofollow">bug 527667</a> )</span></span></li>
-    <li><span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">No aparece en Herramientas -&gt; Opciones -&gt; Privacidad -&gt; Eliminar cookies individuales ( <a class="link-https" href="http://www.google.com/url?q=https%3A%2F%2Fbugzilla.mozilla.org%2Fshow_bug.cgi%3Fid%3D506692&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNH3d0Etkixvdpdvd_u6gywZoEmsMQ" rel="external nofollow">bug 506692</a> )</span></span></li>
-   </ul>
-  </li>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">El almacenamiento DOM <strong>no</strong> se elimina a través de Herramientas -&gt; Opciones -&gt; Avanzado -&gt; Red -&gt; Datos en modo sin conexión -&gt; Limpiar ahora.</span></span></li>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">No aparece en la lista "Herramientas -&gt; Opciones -&gt; Avanzado -&gt; Red -&gt; Datos en modo sin conexión", a menos que el sitio también utilice la caché sin conexión.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si el sitio aparece en esa lista, los datos de almacenamiento DOM se eliminan junto con la <a href="/en/Using_Application_Cache" rel="internal" title="https://developer.mozilla.org/en/Using_Application_Cache">memoria caché sin conexión</a> cuando se hace clic en el botón Eliminar.</span></span></li>
- </ul>
- <p><span class="goog-gtc-unit" id="goog-gtc-unit-73"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Consulta también <a href="/en/Using_Application_Cache#Storage_location_and_clearing_the_offline_cache" rel="internal" title="https://developer.mozilla.org/en/Using_Application_Cache#Storage_location_and_clearing_the_offline_cache">borrar la caché de recursos en modo sin conexión</a> .</span></span></p>
-</div>
-<h3 id="M.C3.A1s_informaci.C3.B3n" name="M.C3.A1s_informaci.C3.B3n"><span class="goog-gtc-unit" id="goog-gtc-unit-74"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Más información</span></span></h3>
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-75"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"><a class="external" href="http://www.w3.org/TR/webstorage/" rel="external nofollow" title="http://www.w3.org/TR/webstorage/">Almacenamiento web</a> (W3C Web Grupo de trabajo sobre aplicaciones web)</span></span></li>
- <li><a class="external" href="http://kb.mozillazine.org/Dom.storage.enabled" rel="external nofollow" title="http://kb.mozillazine.org/Dom.storage.enabled"><span class="goog-gtc-unit" id="goog-gtc-unit-76"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Activar / Desactivar almacenamiento DOM en Firefox o SeaMonkey</span></span></a></li>
-</ul>
-<h3 id="Ejemplos" name="Ejemplos"><span class="goog-gtc-unit" id="goog-gtc-unit-77"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Ejemplos</span></span></h3>
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-78"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://www.diveintojavascript.com/tutorials/web-storage-tutorial-creating-an-address-book-application" rel="external nofollow" title="http://www.diveintojavascript.com/tutorials/web-storage-tutorial-creating-an-address-book-application">Tutorial de almacenamiento web JavaScript: cómo crear una aplicación de la libreta de direcciones</a>. Práctico tutorial que describe cómo utilizar la API de almacenamiento web mediante la creación de una aplicación sencilla de la libreta de direcciones.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-79"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://hacks.mozilla.org/2010/01/offline-web-applications/" rel="external nofollow" title="http://hacks.mozilla.org/2010/01/offline-web-applications/">Aplicaciones web en modo desconexión</a> en hacks.mozilla.org: muestra una demo de la aplicación en modo desconexión y explica cómo funciona.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-80"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://noteboard.eligrey.com/" rel="external nofollow" title="http://noteboard.eligrey.com/">Noteboard</a>: aplicación para escritura de notas que almacena todos los datos en local.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-81"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://github.com/eligrey/jData-host" rel="external nofollow" title="http://github.com/eligrey/jData-host">JData</a>: una interfaz de objetos compartidos localStorage a la que cualquier sitio web en Internet puede acceder y que funciona en Firefox 3 +, Webkit 3.1.2 + versiones estables ("nightlies) y IE8.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-82"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Piensa en ella como pseudo-globalStorage [""], pero el acceso de escritura necesita la confirmación del usuario.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-83"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://codebase.es/test/webstorage.html" rel="external nofollow" title="http://codebase.es/test/webstorage.html">Ejemplo de localStorage en HTML 5 </a>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-84"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Un ejemplo de localStorage muy sencillo y fácil de entender.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-85"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Guarda y recupera los textos y muestra una lista de elementos guardados.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Probado en Firefox 3 o superior.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-87"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a class="external" href="http://upload.jonathanwilsson.com/html5/sessionstorage.php" rel="external nofollow" title="http://upload.jonathanwilsson.com/html5/sessionstorage.php">Almacenamiento de sesión en HTML5</a>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-88"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Un ejemplo muy simple de almacenamiento de sesión.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-89"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">También incluye un ejemplo en almacenamiento local.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-90"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Probado en Firefox 3.6 o superior.</span></span></li>
-</ul>
-<h3 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h3>
-<p>{{ CompatibilityTable() }}</p>
-<div id="compat-desktop">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Característica</th>
-    <th>Chrome</th>
-    <th>Firefox (Gecko)</th>
-    <th>Internet Explorer</th>
-    <th>Opera</th>
-    <th>Safari (WebKit)</th>
-   </tr>
-   <tr>
-    <td>localStorage</td>
-    <td>4</td>
-    <td>3.5</td>
-    <td>8</td>
-    <td>10.50</td>
-    <td>4</td>
-   </tr>
-   <tr>
-    <td>sessionStorage</td>
-    <td>5</td>
-    <td>2</td>
-    <td>8</td>
-    <td>10.50</td>
-    <td>4</td>
-   </tr>
-   <tr>
-    <td>globalStorage</td>
-    <td>{{ CompatNo() }}</td>
-    <td>2</td>
-    <td>{{ CompatNo() }}</td>
-    <td>{{ CompatNo() }}</td>
-    <td>{{ CompatNo() }}</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Característica</th>
-    <th>Android</th>
-    <th>Firefox Mobile (Gecko)</th>
-    <th>IE Phone</th>
-    <th>Opera Mobile</th>
-    <th>Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Compatibilidad básica</td>
-    <td>{{ CompatUnknown() }}</td>
-    <td>{{ CompatUnknown() }}</td>
-    <td>{{ CompatUnknown() }}</td>
-    <td>{{ CompatUnknown() }}</td>
-    <td>{{ CompatUnknown() }}</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<p>Todos los navegadores tienen diferentes niveles de capacidad tanto para local- como para sessionStorage. Aquí puedes ver un<a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/"> resumen detallado de todas las capacidades de almacenamiento de los distintos navegadores</a>.</p>
-<h3 id="Contenido_relacionado" name="Contenido_relacionado"><span class="goog-gtc-unit" id="goog-gtc-unit-91"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Contenido relacionado</span></span></h3>
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-92"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style=""><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fen.wikipedia.org%2Fwiki%2FHTTP_cookie&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFACogcWPyUjw22LvVhbEL5L07xEA">Cookies HTTP</a> ( <a><code>document.cookie</code></a> )</span></span></li>
- <li><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.macromedia.com%2Fsupport%2Fdocumentation%2Fen%2Fflashplayer%2Fhelp%2Fhelp02.html&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFrtvzw9ttNpzuCXBX_Hlq3o20cYA"><span class="goog-gtc-unit" id="goog-gtc-unit-93"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Almacenamiento local de Flash</span></span></a></li>
- <li><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fmsdn2.microsoft.com%2Fen-us%2Flibrary%2Fms531424.aspx&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFaRBrB2GGggww2L9dRDlUWDBm9IQ"><span class="goog-gtc-unit" id="goog-gtc-unit-94"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Comportamiento userData en Internet Explorer </span></span></a></li>
- <li><a><span class="goog-gtc-unit" id="goog-gtc-unit-95"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">nsIDOMStorageEventObsolete</span></span></a></li>
- <li><a><span class="goog-gtc-unit" id="goog-gtc-unit-96"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">StorageEvent</span></span></a></li>
-</ul>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-97"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">{{ HTML5ArticleTOC () }}</span></span></p>
-<p> </p>
-<p> </p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-98"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ languages( { "en": "en/DOM/Storage", "fr": "fr/DOM/Storage", "ja": "ja/DOM/Storage", "pl": "pl/DOM/Storage", "zh-cn": "cn/DOM/Storage" } ) }}</span></span></p>
diff --git a/files/es/dom/document.cookie/index.html b/files/es/dom/document.cookie/index.html
deleted file mode 100644
index 791ae788f2..0000000000
--- a/files/es/dom/document.cookie/index.html
+++ /dev/null
@@ -1,119 +0,0 @@
----
-title: document.cookie
-slug: DOM/document.cookie
-tags:
-  - NeedsContent
-translation_of: Web/API/Document/cookie
----
-<p>{{ApiRef("DOM")}}</p>
-
-<h3 id="Resumen" name="Resumen">Resumen</h3>
-
-<p>Con <code>document.cookie</code> se obtienen y definen las <code>cookies</code> asociadas con el documento.</p>
-
-<h2 id="Sintaxis_2">Sintaxis</h2>
-
-<h3 id="Sintaxis" name="Sintaxis">Leer todas las cookies accesibles desde una localización</h3>
-
-<pre class="eval"><em>todasLasCookies</em> = <em>document</em>.cookie;
-</pre>
-
-<p>En el código anterior <em><code>todasLasCookies</code></em> es una cadena que contiene una lista de todas las cookies separadas por punto y coma (en pares <em><code>clave=valor</code></em>). Tenga en cuenta que <var>clave</var> y <var>valor</var> pueden estar rodeadas por espacios en blanco (caracteres espacio y tabulación): de hecho <a href="https://tools.ietf.org/html/rfc6265">RFC 6265</a> especifica que debe haber un espacio en blanco después de cada punto y coma (;), pero algunos agentes de usuario no son muy estrictos con esto.</p>
-
-<h3 id="Escribir_una_nueva_cookie">Escribir una nueva cookie</h3>
-
-<pre class="eval"><em>document</em>.cookie = <em>nuevaCookie</em>;</pre>
-
-<p class="eval">En el código anterior, <em><code>nuevacookie</code></em> es una cadena de la forma <em><code>clave=valor</code></em>. Tenga en cuenta que solo se puede crear o actualizar una cookie de cada vez mediante este método. Considere también que:</p>
-
-<ul>
- <li class="eval">Cualquiera de los siguientes atributos opcionales se puede escribir después del par clave-valor, especificando la cookie que se va a crear o actualizar, precedidos de un punto y coma.
-  <ul>
-   <li class="eval"><code>;path=<em>pat</em>h</code> (p. ej.: '/'. '/midir'). Si no se especifica, por defecto corresponde a la ruta del documento actual.<br>
-    La ruta debe ser <strong>absoluta</strong> (ver <a href="https://tools.ietf.org/html/rfc6265">RFC 6265</a>). Para más información sobre cómo utilizar rutas relativas, ir a <a href="https://developer.mozilla.org/es/docs/DOM/document.cookie$edit#Using_relative_URLs_in_the_path_parameter">este párrafo</a>.</li>
-   <li class="eval"><code>;domain=<em>domain</em></code> (p. ej. 'example.com', 'subdomain.example.com'). Si no se especifica, su valor por defecto es la porción de la dirección web de la ubicación actual del archivo. A diferencia de lo que ocurría en las primeras especificaciones, los puntos iniciales de los nombre de dominio se ignoran, pero los navegadores pueden impedir crear cookies que contengan dichos puntos. Si se especifica un dominio, los subdominios siempre son incluidos.</li>
-   <li class="eval"><code>;max-age=</code><em><code>duración-máxima-en-segundos</code></em> Por ejemplo: 60*60*24*365 para un año.</li>
-   <li class="eval"><code>;expires=</code><em><code>fecha-en-formato-GMTString</code> </em>Si no se especifica <code>max-age</code> ni <code>expires</code>, la cookie expirará al terminar la sesión actual.</li>
-   <li class="eval"><code>;secure</code> La cookie sólo será transmitida en un protocolo seguro (HTTPS, SSL). Antes de Chrmoe 52, este atributo podía aparecer con cookes de dominios http.</li>
-   <li class="eval"><code>;samesite</code> Este atributo impide al navegador enviar esta cookie a través de peticiones cross-site. Los valores posibles son lax o strict. El soporte de este atributo se añadió en Chrome 51.
-    <ul>
-     <li class="eval">El valor <em><code>strict</code></em> impide que la cookie sea enviada por el navegador al sitio destino en contexto de navegador cross-site, incluso cuando sigue un enlace regular.</li>
-     <li class="eval">El valor <em><code>lax</code></em> sólo envía cookies a las peticiones de GET de ALTO NIVEL. Es suficiente para seguir al usuario, pero evitará muchos ataques CSRF.</li>
-    </ul>
-   </li>
-  </ul>
- </li>
- <li class="eval">El valor de la cookie puede ser evaluado mediante <a href="/es/Referencia_de_JavaScript_1.5/Funciones_globales/encodeURIComponent" title="encodeURIComponent">encodeURIComponent()</a> para asegurarse de que dicha cadena no incluya comas, punto y coma, ni espacios en blanco (lo cual no está permitido en el valor de una cookie).</li>
- <li class="eval">Algunas implementaciones de agente de usuario soporta los siguientes prefijos de cookie:
-  <ul>
-   <li class="eval"><code>__Secure-</code>  Señales para el navegador que solo deben incluirse en las perticiones de cookie transmitidas por un canal seguro.</li>
-   <li class="eval"><code>__Host-</code> Señales del navegador que además de la restricción de uso de cookies que provienen de un origen serugo, el ámbito de la cookie está limitado a un atributo path que proporciona el servidor. Si el servidor omite el atributo path, el directorio de las petición URI está en uso. Tabién las señales del atributo dominio no deben estar presentes, lo cual previene que la cookie sea usada en otros dominis. Para Chrome, el atributo path debe tener el mismo origen.</li>
-  </ul>
- </li>
-</ul>
-
-<div class="geckoVersionNote">{{ gecko_callout_heading("6.0") }}</div>
-
-<div class="geckoVersionNote">Nótese que previamente a Gecko 6.0 {{ geckoRelease("6.0") }}, rutas que contenían comillas eran tratadas como si las comillas fueran parte de la cadena, en lugar de considerarse como un delimitador de la ruta actual. Esto ya ha sido arreglado.</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo" name="Ejemplo">Ejemplo # 1: Uso sencillo</h3>
-
-<pre class="brush: js">document.cookie = "nombre=oeschger";
-document.cookie = "comida_preferida=tripa";
-function alertCookie() {
-  alert(document.cookie); // visualizar: nombre=oeschger;comida favorita=tripa
-
-}</pre>
-
-<pre>&lt;button onclick="alertCookie()"&gt;Mostrar cookies&lt;/button&gt;</pre>
-
-<p>{{EmbedLiveSample('Example_1_Simple_usage', 200, 36)}}</p>
-
-<h3 id="Ejemplo_2_Obtener_una_cookie_de_ejemplo_llamada_test2">Ejemplo #2: Obtener una cookie de ejemplo llamada <em>test2</em></h3>
-
-<pre>document.cookie = "test1=Hola";
-document.cookie = "test2=Mundo";
-
-var cookieValor = document.cookie.replace(/(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/, "$1");
-
-function alertCookieValue() {
-  alert(cookieValor);
-}
-</pre>
-
-<pre>&lt;button onclick="alertCookieValue()"&gt;Mostrar valor de cookie&lt;/button&gt;</pre>
-
-<p>{{EmbedLiveSample('Example_2_Get_a_sample_cookie_named_test2', 200, 36)}}</p>
-
-<h3 id="Ejemplo_3_Hacer_algo_una_sola_vez">Ejemplo #3: Hacer algo una sola vez</h3>
-
-<p>De manera a usar el siguiente código, favor remplace todas las veces la palabra <code>hacerAlgoUnaSolaVez</code> (el nombre de la cookie) con un nombre personalizado.</p>
-
-<pre>function hazUnaVez() {
-  if (document.cookie.replace(/(?:(?:^|.*;\s*)<code>hacerAlgoUnaSolaVez</code>\s*\=\s*([^;]*).*$)|^.*$/, "$1") !== "true") {
-    alert("Hacer algo aquí!");
-    document.cookie = "<code>hacerAlgoUnaSolaVez</code>=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
-  }
-}</pre>
-
-<pre>&lt;button onclick="dhacerUnaVez()"&gt;Solo hacer algo una vez&lt;/button&gt;</pre>
-
-<p>{{EmbedLiveSample('Example_3_Do_something_only_once', 200, 36)}}</p>
-
-<h3 id="Notas" name="Notas">Seguridad</h3>
-
-<p>Es importante mencionar que la restricción path no protege contra la lectura no autorizada de cookies de una ruta distinta. Puede ser fácilmente resuelto mediante DOM (por ejemplo creando un <a href="/en/HTML/Element/iframe" title="en/HTML/Element/iframe">iframe</a> oculto con la ruta de la cookie y accediendo a la propiedad contentDocument.cookie del iframe). La única manera de proteger el acceso a cookies es ocupando un dominio o subdominio diferente, debido a la <a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">política de mismo origen</a>.</p>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li>Empezando con Firefox 2, está disponible un mejor mecanismo de almacenamiento en cliente - <a href="/es/DOM/Storage" title="es/DOM/Storage">WHATWG DOM Storage</a>.</li>
- <li>Puedes eliminar una cookie simplemente estableciendo su fecha de expiración a cero.</li>
- <li>Cabe mencionar que entre más cookies se tengan, mayor cantidad de datos serán transferidos entre el servidor y el cliente en cada solicitud. Esto reducirá el tiempo entre cada solicitud. Es altamente recomendado que se utilice <a href="/es/DOM/Storage" title="es/DOM/Storage">WHATWG DOM Storage</a> si se van a mantener los datos solamente en el cliente.</li>
-</ul>
-
-<h3 id="Especificaci.C3.B3n" name="Especificaci.C3.B3n">Especificación</h3>
-
-<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-8747038">DOM Level 2: HTMLDocument.cookie</a></p>
diff --git a/files/es/dom/index.html b/files/es/dom/index.html
deleted file mode 100644
index 26d372847a..0000000000
--- a/files/es/dom/index.html
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: DOM
-slug: DOM
-tags:
-  - DOM
-  - Todas_las_Categorías
-translation_of: Web/API/Document_Object_Model
-translation_of_original: DOM
----
-<div class="callout-box">
-  <strong><a href="/es/Acerca_del_Modelo_de_Objetos_del_Documento" title="es/Acerca_del_Modelo_de_Objetos_del_Documento">Acerca del Modelo de Objetos del Documento</a></strong><br>
-  Un par de cosas básicas sobre DOM y Mozilla.</div>
-<div>
-  <p>El <strong>Modelo de Objetos del Documento (DOM)</strong> es un API para documentos <a href="/es/HTML" title="es/HTML">HTML</a> y <a href="/es/XML" title="es/XML">XML</a>. Proporciona una representación estructural del documento, permitiendo la modificación de su contenido o su presentación visual. Esencialmente, comunica las páginas web con los scripts o los lenguajes de programación.</p>
-</div>
-<p><strong>DOM</strong> es un estándar del <a class="external" href="http://www.w3.org/DOM/">W3C</a></p>
-<table class="topicpage-table">
-  <tbody>
-    <tr>
-      <td>
-        <h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"><a href="/Special:Tags?tag=DOM&amp;language=es" title="Special:Tags?tag=DOM&amp;language=es">Documentación</a></h4>
-        <dl>
-          <dt>
-            <a class="external" href="http://www.maestrosdelweb.com/editorial/dom/">Introducción a la manipulación DOM</a></dt>
-          <dd>
-            <small>Introducción a los métodos de manipulación DOM mediante Javascript</small></dd>
-        </dl>
-        <dl>
-          <dt>
-            <a class="external" href="http://html.conclase.net/w3c/dom1-es/cover.html">Especificación del DOM Nivel 1</a></dt>
-          <dd>
-            <small>El objetivo de la especificación DOM es definir una interfaz programable para HTML y XML.</small></dd>
-        </dl>
-        <dl>
-          <dt>
-            <a href="/es/Uso_del_núcleo_del_nivel_1_del_DOM" title="es/Uso_del_núcleo_del_nivel_1_del_DOM">Uso del núcleo del nivel 1 del DOM</a></dt>
-          <dd>
-            <small>Es un potente modelo de objetos para modificar el árbol de contenidos de los documentos.</small></dd>
-        </dl>
-        <dl>
-          <dt>
-            <a href="/es/Los_niveles_del_DOM" title="es/Los_niveles_del_DOM">Los niveles del DOM</a></dt>
-          <dd>
-            <small>Una descripción de los niveles del DOM y el soporte ofrecido por Mozilla a cada uno de ellos.</small></dd>
-        </dl>
-        <dl>
-          <dt>
-            <a href="/es/DHTML_Demostraciones_del_uso_de_DOM//Style" title="es/DHTML_Demostraciones_del_uso_de_DOM//Style">DHTML Demostraciones del uso de DOM/Style</a></dt>
-          <dd>
-            <small>Contiene una lista de ejemplos DOM basados en sus diversas características. La lista incluye demostraciones para Eventos DOM, DOM Core, DOM HTML y mucho mas.</small></dd>
-        </dl>
-        <dl>
-          <dt>
-            <a class="external" href="http://www.mozilla.org/docs/dom/">The Document Object Model in Mozilla.org <small>(en)</small></a></dt>
-          <dd>
-            <small>Una versión más antigua acerca de DOM se encuentra en mozilla.org.</small></dd>
-        </dl>
-        <p><span class="comment">enlaces a ninguna parte: ; <a href="/es/DOM_y_JavaScript">DOM y JavaScript</a>: &lt;small&gt;"¿Qué está haciendo que? ¿En un script embebido en mi página web, el cual usa DOM y Javascript?"&lt;/small&gt;  ; <a href="/es/Modificando_dinámicamente_las_interfaces_de_usuario_en_XUL">Modificando dinámicamente las interfaces de usuario en XUL</a>: &lt;small&gt;Fundamentos de manipulación con XUL UI y métodos DOM.&lt;/small&gt;  ; <a href="/es/Espacios_en_blanco_en_el_DOM">Espacios en blanco en el DOM</a>: &lt;small&gt;Una solución al problema de ignorar los espacios en blanco cuando se interactúa con el DOM.&lt;/small&gt;  ; <a href="/es/Tablas_HTML_con_JavaScript_e_interfaces_DOM">Tablas HTML con JavaScript e interfaces DOM</a>: &lt;small&gt;Una descripción de algunos métodos de gran alcance, fundamentales para el nivel 1 en el uso de DOM y de cómo utilizarlo con Javascript .&lt;/small&gt; fin de enlaces a ninguna parte</span> <span class="alllinks"><a href="/Special:Tags?tag=DOM&amp;language=es" title="Special:Tags?tag=DOM&amp;language=es">Ver todos</a></span></p>
-      </td>
-      <td>
-        <h4 id="Comunidad" name="Comunidad">Comunidad</h4>
-        <ul>
-          <li>En la comunidad Mozilla... en inglés</li>
-        </ul>
-        <p>{{ DiscussionList("dev-tech-dom", "mozilla.dev.tech.dom") }}</p>
-        <p><span class="alllinks"><a href="/es/DOM/Comunidad" title="es/DOM/Comunidad">Ver todos</a></span></p>
-        <h4 id="Herramientas" name="Herramientas">Herramientas</h4>
-        <ul>
-          <li><a href="/es/DOM_Inspector" title="es/DOM_Inspector">DOM Inspector</a></li>
-          <li><a class="external" href="http://slayeroffice.com/tools/modi/v2.0/modi_help.html">Mouse-over DOM Inspector</a></li>
-          <li><a class="external" href="http://www.karmatics.com/aardvark/">Aardvark, extension para Firefox</a></li>
-        </ul>
-        <p><span class="alllinks"><a href="/Special:Tags?tag=DOM:Herramientas&amp;language=es" title="Special:Tags?tag=DOM:Herramientas&amp;language=es">Ver todos</a></span></p>
-        <h4 id="Temas_relacionados" name="Temas_relacionados">Temas relacionados</h4>
-        <dl>
-          <dd>
-            • <a href="/es/AJAX" title="es/AJAX">AJAX</a> • <a href="/es/CSS" title="es/CSS">CSS</a> • <a href="/es/XML" title="es/XML">XML</a> • <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a> •</dd>
-        </dl>
-        <p> </p>
-      </td>
-    </tr>
-  </tbody>
-</table>
-<p><span class="comment">fin de tabla</span></p>
-<p><span class="comment">Categorías</span></p>
-<p><span class="comment">Interwiki Language Links</span></p>
-<p>{{ languages( { "de": "de/DOM", "en": "en/DOM", "fr": "fr/DOM", "hu": "hu/DOM", "ja": "ja/DOM", "ko": "ko/DOM", "nl": "nl/DOM", "pl": "pl/DOM", "pt": "pt/DOM", "ru": "ru/DOM", "zh-cn": "cn/DOM", "zh-tw": "zh_tw/DOM" } ) }} </p>
diff --git a/files/es/dom/manipulando_el_historial_del_navegador/ejemplo/index.html b/files/es/dom/manipulando_el_historial_del_navegador/ejemplo/index.html
deleted file mode 100644
index 1971f1348f..0000000000
--- a/files/es/dom/manipulando_el_historial_del_navegador/ejemplo/index.html
+++ /dev/null
@@ -1,415 +0,0 @@
----
-title: Ejemplo de Navegación usando Ajax
-slug: DOM/Manipulando_el_historial_del_navegador/Ejemplo
-translation_of: Web/API/History_API/Example
----
-<p>This is an example of an AJAX web site composed only of three pages (<em>first_page.php</em>, <em>second_page.php</em> and <em>third_page.php</em>). To see how it works, please, create the following files (or git clone <a href="https://github.com/giabao/mdn-ajax-nav-example" title="/en-US/docs/">https://github.com/giabao/mdn-ajax-nav-example.git</a> ):</p>
-
-<div class="note" id="const_compatibility"><strong>Note:</strong> For fully integrating the {{HTMLElement("form")}} elements within this <em>mechanism</em>, please take a look at the paragraph <a href="/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files">Submitting forms and uploading files</a>.</div>
-
-<p><strong>first_page.php</strong>:</p>
-
-<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
-<pre class="brush: php">&lt;?php
-    $page_title = "First page";
-
-    $as_json = false;
-    if (isset($_GET["view_as"]) &amp;&amp; $_GET["view_as"] == "json") {
-        $as_json = true;
-        ob_start();
-    } else {
-?&gt;
-&lt;!doctype html&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;?php
-        include "include/header.php";
-        echo "&lt;title&gt;" . $page_title . "&lt;/title&gt;";
-?&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-
-&lt;?php include "include/before_content.php"; ?&gt;
-
-&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;first_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;div id="ajax-content"&gt;
-&lt;?php } ?&gt;
-
-    &lt;p&gt;This is the content of &lt;strong&gt;first_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;?php
-    if ($as_json) {
-        echo json_encode(array("page" =&gt; $page_title, "content" =&gt; ob_get_clean()));
-    } else {
-?&gt;
-&lt;/div&gt;
-
-&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;first_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;?php
-        include "include/after_content.php";
-        echo "&lt;/body&gt;\n&lt;/html&gt;";
-    }
-?&gt;
-</pre>
-</div>
-
-<p><strong>second_page.php</strong>:</p>
-
-<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
-<pre class="brush: php">&lt;?php
-    $page_title = "Second page";
-
-    $as_json = false;
-    if (isset($_GET["view_as"]) &amp;&amp; $_GET["view_as"] == "json") {
-        $as_json = true;
-        ob_start();
-    } else {
-?&gt;
-&lt;!doctype html&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;?php
-        include "include/header.php";
-        echo "&lt;title&gt;" . $page_title . "&lt;/title&gt;";
-?&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-
-&lt;?php include "include/before_content.php"; ?&gt;
-
-&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;second_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;div id="ajax-content"&gt;
-&lt;?php } ?&gt;
-
-    &lt;p&gt;This is the content of &lt;strong&gt;second_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;?php
-    if ($as_json) {
-        echo json_encode(array("page" =&gt; $page_title, "content" =&gt; ob_get_clean()));
-    } else {
-?&gt;
-&lt;/div&gt;
-
-&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;second_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;?php
-        include "include/after_content.php";
-        echo "&lt;/body&gt;\n&lt;/html&gt;";
-    }
-?&gt;
-</pre>
-</div>
-
-<p><strong>third_page.php</strong>:</p>
-
-<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
-<pre class="brush: php">&lt;?php
-    $page_title = "Third page";
-    $page_content = "&lt;p&gt;This is the content of &lt;strong&gt;third_page.php&lt;/strong&gt;. This content is stored into a php variable.&lt;/p&gt;";
-
-    if (isset($_GET["view_as"]) &amp;&amp; $_GET["view_as"] == "json") {
-        echo json_encode(array("page" =&gt; $page_title, "content" =&gt; $page_content));
-    } else {
-?&gt;
-&lt;!doctype html&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;?php
-        include "include/header.php";
-        echo "&lt;title&gt;" . $page_title . "&lt;/title&gt;";
-?&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-
-&lt;?php include "include/before_content.php"; ?&gt;
-
-&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;third_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;div id="ajax-content"&gt;
-&lt;?php echo $page_content; ?&gt;
-&lt;/div&gt;
-
-&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;third_page.php&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;?php
-        include "include/after_content.php";
-        echo "&lt;/body&gt;\n&lt;/html&gt;";
-    }
-?&gt;
-</pre>
-</div>
-
-<p><strong>css/style.css</strong>:</p>
-
-<pre class="brush: css">#ajax-loader {
-    position: fixed;
-    display: table;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-}
-
-#ajax-loader &gt; div {
-    display: table-cell;
-    width: 100%;
-    height: 100%;
-    vertical-align: middle;
-    text-align: center;
-    background-color: #000000;
-    opacity: 0.65;
-}
-</pre>
-
-<p><strong>include/after_content.php</strong>:</p>
-
-<pre class="brush: php">&lt;p&gt;This is the footer. It is shared between all ajax pages.&lt;/p&gt;
-</pre>
-
-<p><strong>include/before_content.php</strong>:</p>
-
-<pre class="brush: php">&lt;p&gt;
-[ &lt;a class="ajax-nav" href="first_page.php"&gt;First example&lt;/a&gt;
-| &lt;a class="ajax-nav" href="second_page.php"&gt;Second example&lt;/a&gt;
-| &lt;a class="ajax-nav" href="third_page.php"&gt;Third example&lt;/a&gt;
-| &lt;a class="ajax-nav" href="unexisting.php"&gt;Unexisting page&lt;/a&gt; ]
-&lt;/p&gt;
-
-</pre>
-
-<p><strong>include/header.php</strong>:</p>
-
-<pre class="brush: php">&lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
-&lt;script type="text/javascript" src="js/ajax_nav.js"&gt;&lt;/script&gt;
-&lt;link rel="stylesheet" href="css/style.css" /&gt;
-</pre>
-
-<p><strong>js/ajax_nav.js</strong>:</p>
-
-<p>(before implementing it in a working environment, <strong>please read <a href="#const_compatibility" title="Note about *const* compatibility">the note about the const statement compatibility</a></strong>)</p>
-
-<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
-<pre class="brush: js">"use strict";
-
-const ajaxRequest = new (function () {
-
-    function closeReq () {
-        oLoadingBox.parentNode &amp;&amp; document.body.removeChild(oLoadingBox);
-        bIsLoading = false;
-    }
-
-    function abortReq () {
-        if (!bIsLoading) { return; }
-        oReq.abort();
-        closeReq();
-    }
-
-    function ajaxError () {
-        alert("Unknown error.");
-    }
-
-    function ajaxLoad () {
-        var vMsg, nStatus = this.status;
-        switch (nStatus) {
-            case 200:
-                vMsg = JSON.parse(this.responseText);
-                document.title = oPageInfo.title = vMsg.page;
-                document.getElementById(sTargetId).innerHTML = vMsg.content;
-                if (bUpdateURL) {
-                    history.pushState(oPageInfo, oPageInfo.title, oPageInfo.url);
-                    bUpdateURL = false;
-                }
-                break;
-            default:
-                vMsg = nStatus + ": " + (oHTTPStatus[nStatus] || "Unknown");
-                switch (Math.floor(nStatus / 100)) {
-                    /*
-                    case 1:
-                        // Informational 1xx
-                        console.log("Information code " + vMsg);
-                        break;
-                    case 2:
-                        // Successful 2xx
-                        console.log("Successful code " + vMsg);
-                        break;
-                    case 3:
-                        // Redirection 3xx
-                        console.log("Redirection code " + vMsg);
-                        break;
-                    */
-                    case 4:
-                        /* Client Error 4xx */
-                        alert("Client Error #" + vMsg);
-                        break;
-                    case 5:
-                        /* Server Error 5xx */
-                        alert("Server Error #" + vMsg);
-                        break;
-                    default:
-                        /* Unknown status */
-                        ajaxError();
-                }
-        }
-        closeReq();
-    }
-
-    function filterURL (sURL, sViewMode) {
-        return sURL.replace(rSearch, "") + ("?" + sURL.replace(rHost, "&amp;").replace(rView, sViewMode ? "&amp;" + sViewKey + "=" + sViewMode : "").slice(1)).replace(rEndQstMark, "");
-    }
-
-    function getPage (sPage) {
-        if (bIsLoading) { return; }
-        oReq = new XMLHttpRequest();
-        bIsLoading = true;
-        oReq.onload = ajaxLoad;
-        oReq.onerror = ajaxError;
-        if (sPage) { oPageInfo.url = filterURL(sPage, null); }
-        oReq.open("get", filterURL(oPageInfo.url, "json"), true);
-        oReq.send();
-        oLoadingBox.parentNode || document.body.appendChild(oLoadingBox);
-    }
-
-    function requestPage (sURL) {
-        if (history.pushState) {
-            bUpdateURL = true;
-            getPage(sURL);
-        } else {
-            /* Ajax navigation is not supported */
-            location.assign(sURL);
-        }
-    }
-
-    function processLink () {
-        if (this.className === sAjaxClass) {
-            requestPage(this.href);
-            return false;
-        }
-        return true;
-    }
-
-    function init () {
-        oPageInfo.title = document.title;
-        for (var oLink, nIdx = 0, nLen = document.links.length; nIdx &lt; nLen; document.links[nIdx++].onclick = processLink);
-    }
-
-    const
-
-        /* customizable constants */
-        sTargetId = "ajax-content", sViewKey = "view_as", sAjaxClass = "ajax-nav",
-
-        /* not customizable constants */
-        rSearch = /\?.*$/, rHost = /^[^\?]*\?*&amp;*/, rView = new RegExp("&amp;" + sViewKey + "\\=[^&amp;]*|&amp;*$", "i"), rEndQstMark = /\?$/,
-        oLoadingBox = document.createElement("div"), oCover = document.createElement("div"), oLoadingImg = new Image(),
-        oPageInfo = {
-            title: null,
-            url: location.href
-        }, oHTTPStatus = /* http://www.iana.org/assignments/http-status-codes/http-status-codes.xml */ {
-            100: "Continue",
-            101: "Switching Protocols",
-            102: "Processing",
-            200: "OK",
-            201: "Created",
-            202: "Accepted",
-            203: "Non-Authoritative Information",
-            204: "No Content",
-            205: "Reset Content",
-            206: "Partial Content",
-            207: "Multi-Status",
-            208: "Already Reported",
-            226: "IM Used",
-            300: "Multiple Choices",
-            301: "Moved Permanently",
-            302: "Found",
-            303: "See Other",
-            304: "Not Modified",
-            305: "Use Proxy",
-            306: "Reserved",
-            307: "Temporary Redirect",
-            308: "Permanent Redirect",
-            400: "Bad Request",
-            401: "Unauthorized",
-            402: "Payment Required",
-            403: "Forbidden",
-            404: "Not Found",
-            405: "Method Not Allowed",
-            406: "Not Acceptable",
-            407: "Proxy Authentication Required",
-            408: "Request Timeout",
-            409: "Conflict",
-            410: "Gone",
-            411: "Length Required",
-            412: "Precondition Failed",
-            413: "Request Entity Too Large",
-            414: "Request-URI Too Long",
-            415: "Unsupported Media Type",
-            416: "Requested Range Not Satisfiable",
-            417: "Expectation Failed",
-            422: "Unprocessable Entity",
-            423: "Locked",
-            424: "Failed Dependency",
-            425: "Unassigned",
-            426: "Upgrade Required",
-            427: "Unassigned",
-            428: "Precondition Required",
-            429: "Too Many Requests",
-            430: "Unassigned",
-            431: "Request Header Fields Too Large",
-            500: "Internal Server Error",
-            501: "Not Implemented",
-            502: "Bad Gateway",
-            503: "Service Unavailable",
-            504: "Gateway Timeout",
-            505: "HTTP Version Not Supported",
-            506: "Variant Also Negotiates (Experimental)",
-            507: "Insufficient Storage",
-            508: "Loop Detected",
-            509: "Unassigned",
-            510: "Not Extended",
-            511: "Network Authentication Required"
-        };
-
-    var
-
-        oReq, bIsLoading = false, bUpdateURL = false;
-
-    oLoadingBox.id = "ajax-loader";
-    oCover.onclick = abortReq;
-    oLoadingImg.src = "data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==";
-    oCover.appendChild(oLoadingImg);
-    oLoadingBox.appendChild(oCover);
-
-    onpopstate = function (oEvent) {
-        bUpdateURL = false;
-        oPageInfo.title = oEvent.state.title;
-        oPageInfo.url = oEvent.state.url;
-        getPage();
-    };
-
-    window.addEventListener ? addEventListener("load", init, false) : window.attachEvent ? attachEvent("onload", init) : (onload = init);
-
-    // Public methods
-
-    this.open = requestPage;
-    this.stop = abortReq;
-    this.rebuildLinks = init;
-
-})();
-</pre>
-</div>
-
-<div class="note" id="const_compatibility"><strong>Note:</strong> The current implementation of <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> (constant statement) <strong>is not part of ECMAScript 5</strong>. It is supported in Firefox &amp; Chrome (V8) and partially supported in Opera 9+ and Safari. <strong>It is not supported in Internet Explorer 6-9, or in the preview of Internet Explorer 10</strong>. <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> is going to be defined by ECMAScript 6, but with different semantics. Similar to variables declared with the <a href="/en/JavaScript/Reference/Statements/let" title="en/JavaScript/Reference/Statements/let"><code>let</code></a> statement, constants declared with <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> will be block-scoped. <strong>We used it only for didactic purpose. If you want a full browser compatibility of this library, please replace all the <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> statements with the <a href="/en/JavaScript/Reference/Statements/var" title="en/JavaScript/Reference/Statements/var"><code>var</code></a> statements.</strong></div>
-
-<p>For more information, please see: <a href="/en-US/docs/DOM/Manipulating_the_browser_history" title="/en-US/docs/DOM/Manipulating_the_browser_history">Manipulating the browser history</a>.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{ domxref("window.history") }}</li>
- <li>{{ domxref("window.onpopstate") }}</li>
-</ul>
diff --git a/files/es/dom/manipulando_el_historial_del_navegador/index.html b/files/es/dom/manipulando_el_historial_del_navegador/index.html
deleted file mode 100644
index eb2c0b3fdd..0000000000
--- a/files/es/dom/manipulando_el_historial_del_navegador/index.html
+++ /dev/null
@@ -1,228 +0,0 @@
----
-title: Manipulando el historial del navegador
-slug: DOM/Manipulando_el_historial_del_navegador
-tags:
-  - HTML5
-  - historial
-  - para_revisar
-translation_of: Web/API/History_API
----
-<p>El objeto DOM {{ domxref("window") }} proporciona acceso al historial del navegador a través del objeto {{ domxref("window.history", "history") }} . Este da acceso a métodos y propiedades útiles que permiten avanzar y retroceder a través del historial del usuario, así como --a partir de HTML5-- manipular el contenido del historial.</p>
-
-<h2 id="Viajando_a_través_del_historial">Viajando a través del historial</h2>
-
-<p>Retroceder y avanzar a través del historial del usuario utilizando los métodos <code>back()</code>, <code>forward()</code> y <code>go()</code>.</p>
-
-<h3 id="Moviéndose_hacia_adelante_y_hacia_atrás">Moviéndose hacia adelante y hacia atrás</h3>
-
-<p>Para moverte hacia atrás, solo debes hacer:</p>
-
-<pre>window.history.back();
-</pre>
-
-<p>Esto actuará exactamente como si el usuario hiciera clic en el botón "atrás" en la barra de herramientas del navegador.</p>
-
-<p>De manera similar, puedes moverte hacia adelante (como si el usuario hiciera clic en en el botón "adelante"), de esta forma:</p>
-
-<pre>window.history.forward();
-</pre>
-
-<h3 id="Moverse_a_un_punto_específico_del_historial">Moverse a un punto específico del historial</h3>
-
-<p>Puedes usar el método <code>go()</code> para cargar una página desde el historial de la sesión, identificada por su poscición relativa a la página actual  (Siendo la página actual, por supuesto, relativa al índice 0).</p>
-
-<p>Para moverse atrás una página (equivalente a llamar <code>back()</code>):</p>
-
-<pre><code>window.history.go(-1);</code>
-</pre>
-
-<p>Para moverse una página hacia adelante, como si se llamara a <code>forward()</code>:</p>
-
-<pre><code>window.history.go(1);</code>
-</pre>
-
-<p>De manera similar, puedes avanzar 2 páginas pasando 2 y así sucesivamente.</p>
-
-<p>Otro uso para <code>go()</code> es el de actualizar la página ya sea pasando <code>0</code> como parámetro o ninguno.</p>
-
-<pre><code>// Cada una de las siguientes
-// instrucciones actualiza la página
-window.history.go(0);
-window.history.go();</code></pre>
-
-<p>Puedes obtener el número de páginas en la pila del historial consultando el valor de la propiedad <span class="long_text" id="result_box" lang="es"><span title=""><code>length</code>:</span></span></p>
-
-<pre>var numeroDeEntradas = window.history.length;
-</pre>
-
-<div class="note"><strong>Nota:</strong> Internet Explorer admite el paso de cadenas de URL como parámetro para <code>go()</code>; esto no es estándar y no está implementado en Gecko.</div>
-
-<h2 id="Añadiendo_y_modificando_entradas_del_historial">Añadiendo y modificando entradas del historial</h2>
-
-<p>{{ gecko_minversion_header("2") }}</p>
-
-<p>HTML5 introduce los métodos <code>history.pushState()</code> y <code>history.replaceState()</code>, los cuales te permiten añadir y modificar entradas del historial, respectivamente. Estos métodos trabajan en conjunto con el evento {{ domxref("window.onpopstate") }}.</p>
-
-<p>Hacer uso de <code>history.pushState()</code> cambia el referer que es utilizado en la cabecera HTTP por los objetos <a href="/es/docs/XMLHttpRequest">XMLHttpRequest</a> que hayan sido creados luego de cambiar el estado. El referer utilizará la URL del documento cuyo objeto window sea <code>this</code> al momento de la creación del objeto <a href="/es/docs/XMLHttpRequest">XMLHttpRequest</a>.</p>
-
-<h3 id="Ejemplo">Ejemplo</h3>
-
-<p>Supongamos que <span class="nowiki">http://mozilla.org/foo.html</span> ejecuta el siguiente JavaScript:</p>
-
-<pre>var stateObj = { foo: "bar" };
-history.pushState(stateObj, "page 2", "bar.html");
-</pre>
-
-<p>Esto causará que la barra de URL muestre <span class="nowiki">http://mozilla.org/bar.html</span>, pero no provocará que el navegador carge bar.html ni tampoco que verifique si bar.html existe.</p>
-
-<p>Supongamos ahora que el usuario navega hacia <span class="nowiki">http://google.com</span>, y despúes hace clic en Atrás.  En este punto, la barra de URL mostrará <span class="nowiki">http://mozilla.org/bar.html</span>, y la página tendrá un evento <code>popstate</code> cuyo <em>state object</em> contiene una copia de <code>stateObj</code>. La página en si se verá como <code>foo.html</code>, aunque la página podria modificar su contenido durante el evento <code>popstate</code> event.</p>
-
-<p>Si hacemos clic en "atrás" nuevamente, la URL cambiará a <span class="nowiki">http://mozilla.org/foo.html</span>, y el documento generará otro evento <code>popstate</code> event, esta vez con un state object nulo. Aquí también, ir atrás no cambia el contenido del documento con respecto al paso anterior, aunque el documento permite actualizar su contenido manualmente después de recibir el evento <code>popstate</code>.</p>
-
-<h3 id="El_método_pushState()">El método pushState()</h3>
-
-<p><code>pushState()</code> toma tres parámetros: un objeto estado, un título (el cual es normalmente ignorado) y (opcionalmente) una URL.  Vamos a examinar cada uno de estos tres parametros en más detalle:</p>
-
-<ul>
- <li>
-  <p><strong>object estado</strong> —  El objeto estado es un objeto JavaScript el cual esta asociado con la nueva entrada al historial creada por <code>pushState()</code>. Cada vez que el usuario navega hacia un nuevo estado, un evento <code>popstate</code> event se dispara, y la propiedad <code>state</code> del evento contiene una copia del historial de entradas del objeto estado.</p>
-
-  <p>El objeto estado puede ser cualquier cosa que puedas pasar a <code>JSON.stringify</code>. Dado que Firefox guarda los objetos estado en el disco del usuario para que puedan ser restaurados después de que el usuario reinicie su navegador, se ha impuesto  un tamaño límite de 640K caracteres en representación JSON de un objeto estado. Si pasas un objeto estado cuya representación es más larga que esto a <code>pushState()</code>, el método arrojará una excepción. Si necesitas más espacio, se recomienda usar <code>sessionStorage</code> y/o <code>localStorage</code>.</p>
- </li>
- <li>
-  <p><strong>título</strong> — Firefox actualmente ignora este parámetro, aunque podría usarse en el futuro. Pasar una cadena de caracteres vacia aquí podría asegurar estar a salvo de futuros cambios en este método. Alternativamente podrías pasar un título corto del estado hacia el cual te estás moviendo.</p>
- </li>
- <li>
-  <p><strong>URL</strong> — La URL de la nueva entrada al  historial está dada por este parámetro. Recuerda que el browser no intentará cargar esta URL después de llamar a <code>pushState()</code>,  <span class="long_text" id="result_box" lang="es"><span title="">pero podría intentar cargar la URL más tarde, por ejemplo, después de que el usuario reinicie su navegador</span></span>. La nueva URL no necesita ser absoluta; si es relativa, es resuelta relativamente a la actual URL.  La nueva URL debe ser del mismo origen que la actual URL. Si no es así, <code>pushState()</code> arrojará una excepción. Este parámetro es opcional; <span class="long_text" id="result_box" lang="es"><span title="">si no se especifica, se tomará la URL actual del documento.</span></span></p>
- </li>
-</ul>
-
-<p>En un sentido, llamar <code>pushState()</code> es similar a asignar <code>window.location = "#foo"</code>, <span class="long_text" id="result_box" lang="es"><span title="">en tanto que también se va a crear y activar otra entrada al historial asociada con el documento actual</span></span>. Pero <code>pushState()</code> tiene las siguientes ventajas:</p>
-
-<ul>
- <li>La nueva URL puede ser cualquier URL en el mismo origen de la actual URL. En contraste, asignar <code>window.location</code> te mantiene en el mismo {{ domxref("document") }} solamente si modificas unicamente el hash.</li>
- <li>No hay por qué cambiar la URL si no se desea. Por el contrario, asignar <code>window.location = "#foo"; solamente crea una nueva entrada en el historial si el hash actual no es </code><code>#foo</code>.</li>
- <li>Puedes asociar datos arbitrarios con tu nuevo historial de entrada. Con el enfoque hash-based, tu necesitas codificar todos datos relevantes dentro de una cadena de caracteres corta.</li>
- <li>Si <code>title</code> es utilizado por los navegadores, estos datos pueden utilizarse (independientemente de, por ejemplo, el hash).</li>
-</ul>
-
-<p>Hay que tener en cuenta que <code>pushState()</code> nunca dispara un evento <code>hashchange</code>, incluso si la nueva URL difiere de la antigua URL únicamente en su hash.</p>
-
-<p>En un documento XUL, crea el elemento XUL específico.</p>
-
-<p>En otros documentos, crea un elemento con un namespace de URI nulo (<code>null</code>).</p>
-
-<h3 id="El_método_replaceState()">El método replaceState()</h3>
-
-<p><code>history.replaceState()</code> trabaja exactamente igual a <code>history.pushState()</code> excepto que <code>replaceState()</code> modifica la entrada al historial actual en lugar de crear una nueva.</p>
-
-<p><code>replaceState()</code> es particularmente útil si deseas actualizar el objeto estado o la URL del la actual entrada al historial en respuesta a alguna acción del usuario.</p>
-
-<h3 id="El_evento_popstate">El evento popstate</h3>
-
-<p>Un evento <code>popstate</code> es dirigido a la ventana cada vez que la entrada al historial cambia. Si la entrada al historial es activada y fue creada por un llamado a <code>pushState</code> o afectada por una llamada a <code>replaceState</code>, la propiedad state del evento <code>popstate</code> contiene una copia del historial de entradas del objeto estado.</p>
-
-<p>Ver {{ domxref("window.onpopstate") }} para un ejemplo de uso.</p>
-
-<h3 id="Leyendo_el_estado_actual">Leyendo el estado actual</h3>
-
-<p>Cuando la página carga, debería tener un objeto de estado no nulo. Esto podría ocurrir, por ejemplo, si la página establece un object de estado (usando <code>pushState()</code> o <code>replaceState()</code>) y entonces el usuario reinicia su navegador. Cuando la página carga de nuevo, la página recibirá el evento onload, pero no el evento popstate.  Sin embargo, si lees la propiedad history.state, obtendrás el objeto estado que habrías tenido si se hubiera lanzado el evento apopstate.</p>
-
-<p>Puedes leer el estado del historial actual sin tener que esperar un evento <code>popstate</code> usando la propiedad  <code>history.state</code> de esta manera:</p>
-
-<pre><code>var currentState = history.state;</code></pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Para un ejemplo completo de un sitio AJAX, ver: <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history/Example" title="/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history/Example">Ejemplo de navegación AJAX</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado </th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "browsers.html#history", "History")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No hay cambios desde {{SpecName("HTML5 W3C")}}.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "browsers.html#history", "History")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<table>
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>replaceState, pushState</td>
-   <td>5</td>
-   <td>{{ CompatGeckoDesktop("2.0") }}</td>
-   <td>10</td>
-   <td>11.50</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>history.state</td>
-   <td>18</td>
-   <td>{{ CompatGeckoDesktop("2.0") }}</td>
-   <td>10</td>
-   <td>11.50</td>
-   <td>6.0</td>
-  </tr>
- </tbody>
-</table>
-
-<table>
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>replaceState, pushState</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
-  <tr>
-   <td>history.state</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{ domxref("window.history") }}</li>
- <li>{{ domxref("window.onpopstate") }}</li>
-</ul>
diff --git a/files/es/dom/touch_events/index.html b/files/es/dom/touch_events/index.html
deleted file mode 100644
index 02a4a4eacb..0000000000
--- a/files/es/dom/touch_events/index.html
+++ /dev/null
@@ -1,292 +0,0 @@
----
-title: Eventos de toque
-slug: DOM/Touch_events
-tags:
-  - DOM
-  - Event
-  - Mobile
-  - NeedsMobileBrowserCompatTable
-  - eventos
-translation_of: Web/API/Touch_events
----
-<p>Con el fin de proporcionar soporte de calidad para usuarios de interfaces táctiles, los eventos táctiles dan la posibilidad de interpretar la actividad de los dedos en pantallas táctiles o trackpads.</p>
-
-<h2 id="Definiciones">Definiciones</h2>
-
-<dl>
- <dt>Superficie</dt>
- <dd>La superficie sensible al tacto. Esta puede ser una pantalla o un trackpad.</dd>
-</dl>
-
-<dl>
- <dt><strong style="font-weight: bold;">Punto de toque</strong></dt>
- <dd>Un punto de contacto con la superficie. Esto podría ser un dedo (o un codo, oreja, nariz, o lo que sea, pero probablemente un dedo) o un stylus.</dd>
-</dl>
-
-<h2 id="Interfaces">Interfaces</h2>
-
-<dl>
- <dt>{{ domxref("TouchEvent") }}</dt>
- <dd>Representa un evento que ocurre cuando el estado de los toques en la superficie cambian.</dd>
- <dt>{{ domxref("Touch") }}</dt>
- <dd>Represeta un único punto de contacto entre el usuario y la superficie táctil.</dd>
- <dt>{{ domxref("TouchList") }}</dt>
- <dd>Representa varios puntos de toque: esto se utiliza cuando el usuario tiene, por ejemplo, varios dedos en la superficie al mismo tiempo.</dd>
- <dt>{{ domxref("DocumentTouch") }}</dt>
- <dd>Contiene varios métodos para crear objetos de {{domxref("Touch")}} y {{domxref("TouchList")}}.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Este ejemplo muestra múltiples puntos de toques al mismo tiempo, permitiendo al usuario dibujar en un {{ HTMLElement("canvas") }} con más de un dedo a la vez. Esto funciona solamente en un navegador que soporte eventos táctiles.</p>
-
-<div class="note"><strong>Not</strong><strong>a:</strong> El texto de abajo usa el término "dedo" cuando describe el contacto con la superficie, pero esto podría ser, por supuesto, también un stylus u otro método de contacto.</div>
-
-<h3 id="Configurando_los_eventos_de_manipulación">Configurando los eventos de manipulación</h3>
-
-<p>Cuando la página carga, la función <code>startup()</code> mostrada a continuación es llamada por nuestro atributo <code>onload</code> del elemento {{ HTMLElement("body") }}.</p>
-
-<pre class="brush: js">function startup() {
-  var el = document.getElementsByTagName("canvas")[0];
-  el.addEventListener("touchstart", handleStart, false);
-  el.addEventListener("touchend", handleEnd, false);
-  el.addEventListener("touchcancel", handleCancel, false);
-  el.addEventListener("touchleave", handleLeave, false);
-  el.addEventListener("touchmove", handleMove, false);
-}
-</pre>
-
-<p>Esto simplemente configura todos los detectores de eventos para nuestro elemento {{ HTMLElement("canvas") }}, por lo que podremos manejar todos los eventos de toque cuando se produzcan.</p>
-
-<h3 id="Seguimiento_de_nuevos_toques">Seguimiento de nuevos toques</h3>
-
-<p>Cuando un evento <code>touchstart</code> ocurre, indicando que un nuevo toque sobre la superficie se ha producido, la función <code>handleStart()</code> de a continuación es llamada.</p>
-
-<pre class="brush: js">function handleStart(evt) {
-  evt.preventDefault();
-  var el = document.getElementsByTagName("canvas")[0];
-  var ctx = el.getContext("2d");
-  var touches = evt.changedTouches;
-
-  for (var i=0; i&lt;touches.length; i++) {
-    ongoingTouches.push(touches[i]);
-    var color = colorForTouch(touches[i]);
-    ctx.fillStyle = color;
-    ctx.fillRect(touches[i].pageX-2, touches[i].pageY-2, 4, 4);
-  }
-}
-</pre>
-
-<p>Esto llama a {{ domxref("event.preventDefault()") }} para mantener al navegador procesando el evento de toque (esto también previene que un evento del ratón o mouse sea entregado). Entonces obtenemos el contexto y lanzamos la lista de puntos de contacto cambiados de la propiedad {{ domxref("TouchEvent.changedTouches") }} del evento.</p>
-
-<p>Después de ello, iteramos sobre todos los objetos {{ domxref("Touch") }} de la lista, insertándolo en una matriz de puntos de toque activos y dibujando el punto de inicio como un pequeño rectángulo; estamos usando una línea de 4 pixeles de ancho, por tanto estamos dibujando un cuadrado de 4 por 4 píxeles como punto de consistencia.</p>
-
-<h3 id="Dibujando_mientras_los_eventos_de_toque_se_mueven">Dibujando mientras los eventos de toque se mueven</h3>
-
-<p>Cada vez que uno o más dedos se mueven, un evento <code>touchmove</code> es entregado, resultando en una llamada a nuestra función <code>handleMove()</code>. Su responsabilidad en este ejemplo es actualizar la información de toque cacheada y dibujar una línea desde la posición previa a la posición actual en cada toque.</p>
-
-<pre class="brush: js">function handleMove(evt) {
-  evt.preventDefault();
-  var el = document.getElementsByTagName("canvas")[0];
-  var ctx = el.getContext("2d");
-  var touches = evt.changedTouches;
-
-  ctx.lineWidth = 4;
-
-  for (var i=0; i&lt;touches.length; i++) {
-    var color = colorForTouch(touches[i]);
-    var idx = ongoingTouchIndexById(touches[i].identifier);
-
-    ctx.fillStyle = color;
-    ctx.beginPath();
-    ctx.moveTo(ongoingTouches[idx].pageX, ongoingTouches[idx].pageY);
-    ctx.lineTo(touches[i].pageX, touches[i].pageY);
-    ctx.closePath();
-    ctx.stroke();
-    ongoingTouches.splice(idx, 1, touches[i]);  // swap in the new touch record
-  }
-}
-</pre>
-
-<p>Esto se repite también en los toques cambiados, pero mira en nuestra matriz de información de toques cacheados la información previa de cada toque con el fin de determinar los puntos de inicio para cada nuevo segmento de línea de toques que será dibujada. Esto se hace mirando cada propiedad de los toques de {{ domxref("Touch.identifier") }} . Esta propiedad es un único entero para cada toque, y sigue siendo consistente para cada evento durante la duración del contacto de cada dedo con la superficie.</p>
-
-<p>Esto nos permite conseguir las coordenadas de la posición previa de cada toque y usar el método apropiado de contexto para dibujar un segmento de línea uniendo dos posiciones a la vez.</p>
-
-<p>Después de dibujar la línea, llamamos a  <a href="/en/JavaScript/Reference/Global_Objects/Array/splice" title="en/JavaScript/Reference/Global Objects/Array/splice"><code>Array.splice()</code></a> para reemplazar la información previa sobre el punto de toque con la información actual de la matriz <code>ongoingTouches</code>.</p>
-
-<h3 id="Manejando_el_final_de_un_toque">Manejando el final de un toque</h3>
-
-<p>Cuando el usuario levanta un dedo de la superficie, un evento <code>touchend</code> es enviado.  De igual manera, si el dedo se desliza fuera de nuestro lienzo, obtenemos un evento <code>touchleave</code>. Manejamos ambos casos de la misma manera: llamando a la función <code>handleEnd()</code> de abajo. Su trabajo es dibujar el último segmento de línea para cada toque que ha finalizado y remueve el punto de toque de la lista de toques en marcha.</p>
-
-<pre class="brush: js">function handleEnd(evt) {
-  evt.preventDefault();
-  var el = document.getElementsByTagName("canvas")[0];
-  var ctx = el.getContext("2d");
-  var touches = evt.changedTouches;
-
-  ctx.lineWidth = 4;
-
-  for (var i=0; i&lt;touches.length; i++) {
-    var color = colorForTouch(touches[i]);
-    var idx = ongoingTouchIndexById(touches[i].identifier);
-
-    ctx.fillStyle = color;
-    ctx.beginPath();
-    ctx.moveTo(ongoingTouches[i].pageX, ongoingTouches[i].pageY);
-    ctx.lineTo(touches[i].pageX, touches[i].pageY);
-    ongoingTouches.splice(i, 1);  // remove it; we're done
-  }
-}
-</pre>
-
-<p>Esto es muy similar a la función previa; la única diferencia real es que cuando llamamos a  <a href="/en/JavaScript/Reference/Global_Objects/Array/splice" title="en/JavaScript/Reference/Global Objects/Array/splice"><code>Array.splice()</code></a>, simplemente remueve la antigua entrada de la lista de toques en marcha, sin añadir la información actualizada. El resultado es que detenemos el seguimiento del punto de toque.</p>
-
-<h3 id="Manejando_los_toques_cancelados">Manejando los toques cancelados</h3>
-
-<p>Si el dedo del usuario se equivoca en la Interfaz del navegador, o el toque necesita ser cancelado, el evento <code>touchcancel</code> es enviado, y llamamos a la función <code>handleCancel()</code> abajo.</p>
-
-<pre class="brush: js">function handleCancel(evt) {
-  evt.preventDefault();
-  var touches = evt.changedTouches;
-
-  for (var i=0; i&lt;touches.length; i++) {
-    ongoingTouches.splice(i, 1);  // remove it; we're done
-  }
-}
-</pre>
-
-<p>Dado que la idea es cancelar el toque inmediatamente, simplemente lo removemos de la lista de toques en marcha sin dibujar un segmento de línea final.</p>
-
-<h3 id="Funciones_de_conveniencia">Funciones de conveniencia</h3>
-
-<p>Este ejemplo usa dos funciones de convenience que deben mirarse brevemente para ayudar a que el resto del código sea más claro.</p>
-
-<h4 id="Seleccionando_un_color_para_cada_toque">Seleccionando un color para cada toque</h4>
-
-<p>Con el fin de hacer que cada dibujo de toque se vea diferente, la función  <code>colorForTouch()</code> es usada para elegir un color basado en el identificador único de toque. Este identificador estará siempre entre 0 y un valor menos que el número de toques activos. Puesto que es muy improbable que alguna persona con más de 16 dedos use este demo, convertimos estos directamente en colores de escalas grises.</p>
-
-<pre class="brush: js">function colorForTouch(touch) {
-  var id = touch.identifier;
-  id = id.toString(16); // make it a hex digit
-  return "#" + id + id + id;
-}
-</pre>
-
-<p>El resultado de esta función es un string o cadena que puede ser usada cuando se llame a funciones {{ HTMLElement("canvas") }} para configurar los colores de dibujos. Por ejemplo, para un valor {{ domxref("Touch.identifier") }}  de 10, el resultado string o cadena es "#aaa".</p>
-
-<h4 id="Encontrando_un_toque_continuo">Encontrando un toque continuo</h4>
-
-<p>La función <code>ongoingTouchIndexById()</code> abajo explora mediante la matriz <code>ongoingTouches</code> para encontrar el toque que coincida con el identificador dado, luego devuelve los índices de toques a la matriz.</p>
-
-<pre class="brush: js">function ongoingTouchIndexById(idToFind) {
-  for (var i=0; i&lt;ongoingTouches.length; i++) {
-    var id = ongoingTouches[i].identifier;
-
-    if (id == idToFind) {
-      return i;
-    }
-  }
-  return -1;    // not found
-}
-</pre>
-
-<p><a href="/samples/domref/touchevents.html">Ver ejemplo en vivo</a></p>
-
-<h2 id="Consejos_adicionales">Consejos adicionales</h2>
-
-<p>Esta sección provee consejos adicionales sobre como manejar los eventos de toques en tu aplicación web.</p>
-
-<h3 id="Manejando_los_clics">Manejando los clics</h3>
-
-<p>Ya que la llamada <code>preventDefault()</code> en un <code>touchstart</code> o el primer evento <code>touchmove</code> de una serie impide que los eventos correspondientes eventos del mouse o ratón se disparen, es común llamar a <code>preventDefault()</code> en <code>touchmove</code> en lugar de <code>touchstart</code>. De esta manera, los eventos del ratón pueden todavía ser disparados y cosas como enlaces siguen funcionando. Alternativamente, algunos frameworks tienen que referirse a eventos de toque como eventos de ratón para este mismo propósito. (Este ejemplo es muy simplificado y podria resultar en un extraño comportamiento. Solo se diseñó como guía).</p>
-
-<pre class="brush: js">function onTouch(evt) {
-  evt.preventDefault();
-  if (evt.touches.length &gt; 1 || (evt.type == "touchend" &amp;&amp; evt.touches.length &gt; 0))
-    return;
-
-  var newEvt = <a href="https://developer.mozilla.org/en/DOM/document.createEvent" rel="internal" title="en/DOM/document.createEvent">document.createEvent</a>("MouseEvents");
-  var type = null;
-  var touch = null;
-  switch (event.type) {
-    case "touchstart": type = "mousedown"; touch = event.changedTouches[[0];
-    case "touchmove":  type = "mousemove"; touch = event.changedTouches[[0];
-    case "touchend":   type = "mouseup"; touch = event.changedTouches[0];
-  }
-  newEvt.<strong>initMouseEvent</strong>(type, true, true, event.<code><a href="https://developer.mozilla.org/en/DOM/event.originalTarget" rel="custom">originalTarget</a>.ownerDocument.defaultView</code>, 0,
-    touch.screenX, touch.screenY, touch.clientX, touch.clientY,
-    evt.ctrlKey, evt.altKey, evt.shirtKey, evt.metaKey, 0, null);
-  event.<code><a href="https://developer.mozilla.org/en/DOM/event.originalTarget" rel="custom">originalTarget</a></code>.<a href="https://developer.mozilla.org/en/DOM/element.dispatchEvent" rel="internal" title="en/DOM/element.dispatchEvent">dispatchEvent</a>(newEvt);
-}
-</pre>
-
-<h3 id="Llamando_a_preventDefault()_solo_en_un_segundo_toque">Llamando a preventDefault() solo en un segundo toque</h3>
-
-<p>Una cosa para prevenir cosas como <code>pinchZoom</code> en una página es llamar a <code>preventDefault()</code> en el segundo toque de una serie. Este comportamiento no está bien definido en los eventos de toque, y resulta en diferentes comportamientos en diferentes navegadores (osea iOS evitará el zoom o acercamiento pero permitirá vista panorámica con ambos dedos. Android permitirá zoom o acercamiento pero no una panorámica. Opera and Firefox actualmente evita panorámica y zoom o acercamiento). Actualmente, no se recomienda depender de ningún comportamiento en particular en este caso, si no mas bien depender de una meta vista para evitar el zoom.</p>
-
-<dl>
-</dl>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatChrome("22.0") }}</td>
-   <td>{{ CompatGeckoDesktop("18.0") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("6.0") }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Notas_de_Gecko">Notas de Gecko</h3>
-
-<p>La preferencia <code>dom.w3c_touch_events.enabled</code> puede ser utilizada para activar o desactivar el soporte de eventos de toque estándares; por defecto, están activados.</p>
-
-<div class="geckoVersionNote" style="">
-<p>{{ gecko_callout_heading("12.0") }}</p>
-
-<p>Antes de Gecko 12.0 {{ geckoRelease("12.0") }}, Gecko no soportaba multi-toques; solo un toque cada vez era reportado.</p>
-</div>
-
-<div class="note"><strong>Note: </strong>Antes de Gecko 6.0 {{ geckoRelease("6.0") }}, Gecko ofrecía una <a href="/en/DOM/Touch_events_(Mozilla_experimental)" title="en/DOM/Touch events (Mozilla experimental)">API de eventos de toque propietaria</a>. Está API está obsoleta actualmente; deberías cambiar a esta."</div>
diff --git a/files/es/dom_inspector/index.html b/files/es/dom_inspector/index.html
deleted file mode 100644
index c6217195c6..0000000000
--- a/files/es/dom_inspector/index.html
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: DOM Inspector
-slug: DOM_Inspector
-tags:
-  - CSS
-  - 'CSS:Herramientas'
-  - DOM
-  - 'DOM:Herramientas'
-  - 'Extensiones:Herramientas'
-  - HTML
-  - 'HTML:Herramientas'
-  - JavaScript
-  - 'JavaScript:Herramientas'
-  - Temas
-  - 'Temas:Herramientas'
-  - Todas_las_Categorías
-  - XUL
-  - 'XUL:Herramientas'
-  - extensiones
-translation_of: Tools/Add-ons/DOM_Inspector
----
-<p>
-</p><p>El <b><a class="external" href="http://www.mozilla.org/projects/inspector/">DOM Inspector</a></b> (conocido como <b>DOMi</b>) es una herramienta de Mozilla utilizada para inspeccionar, navegar y editar el <i>Modelo de Objetos del Documento</i>(<a href="es/DOM">Document Object Model</a> en inglés) de los documentos - normalmente páginas web o ventanas <a href="es/XUL">XUL</a> .
-</p><p>Para más información sobre el DOMi, consulta <a class="external" href="http://kb.mozillazine.org/DOM_Inspector">la página del DOM Inspector en MozillaZine</a>.
-</p><p><span>Categorías</span>
-</p>
-<div class="noinclude">
-</div>
-{{ languages( { "en": "en/DOM_Inspector", "fr": "fr/Inspecteur_DOM", "it": "it/DOM_Inspector", "ja": "ja/DOM_Inspector", "ko": "ko/DOM_Inspector", "pl": "pl/Inspektor_DOM" } ) }}
diff --git a/files/es/dragdrop/drag_and_drop/drag_and_drop_archivo/index.html b/files/es/dragdrop/drag_and_drop/drag_and_drop_archivo/index.html
deleted file mode 100644
index 1225072b01..0000000000
--- a/files/es/dragdrop/drag_and_drop/drag_and_drop_archivo/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: Drag & Drop archivo
-slug: DragDrop/Drag_and_Drop/drag_and_drop_archivo
-tags:
-  - Guía
-  - arrastra y suelta
-  - drag and drop
-  - drop zone
-  - zona de arrastre
-translation_of: Web/API/HTML_Drag_and_Drop_API/File_drag_and_drop
----
-<p>{{DefaultAPISidebar("HTML Drag and Drop API")}}</p>
-
-<p>Las interfaces Drag-and-Drop posibilitan arrastrar y soltar archivos en una página web. En este documento se describe cómo una aplicación puede aceptar uno, o más, archivos que son arrastrados desde el <em>explorador de archivos </em>de la plataforma y soltados en una página web.</p>
-
-<p>Los pasos principales para configurar Drag-and-drop son: 1) definir una "zona drop (<em>drop zone), </em>es decir, definir un elemento donde se podrá soltar el archivo; y 2) definir funciones para la gestión de los eventos {{event("drop")}} y {{event("dragover")}}. Estos pasos se describen a continuación, tambien se incluyen ejemplos snippets de código. El código fuente completo está disponible en el <a href="https://github.com/mdn/dom-examples/tree/master/drag-and-drop">repositorio drag-and-drop de MDN</a> (cualquier sugerencia o  tema que revisar es bienvenido).</p>
-
-<p class="note">Nota: {{domxref("HTML_Drag_and_Drop_API","HTML drag and drop")}} define 2 diferentes APIs para soportar drag and drop de archivos. Una API es la interfaz {{domxref("DataTransfer")}} y la segunda API son las interfaces {{domxref("DataTransferItem")}} y {{domxref("DataTransferItemList")}}.  Este ejemplo ilustra el uso de ambas APIs (y no usa ninguna interfaz específica de Gecko).</p>
-
-<h2 id="Define_la_zona_drop_drop_zone">Define la zona "drop" [drop <em>zone</em>]</h2>
-
-<p>Es necesario configurar un evento {{event("drop")}} en el objeto sobre el cual se soltará el objeto arrastrado. Este evento llamará una función global {{domxref("GlobalEventHandlers.ondrop","ondrop")}} que recibe los datos del objeto arrastrado. El siguiente código muestra cómo se hace con un elemento {{HTMLelement("div")}}:</p>
-
-<pre class="brush: html notranslate">&lt;div id="drop_zone" ondrop="dropHandler(event);"&gt;
-  &lt;p&gt;Arrastra y suelta uno o más archivos a esta zona ...&lt;/p&gt;
-&lt;/div&gt;</pre>
-
-<p>Normalmente, una aplicación incluirá una función de gestión de eventos {{event("dragover")}} en el elemento objetivo del arrastre y esa función desactivará el comportamiento de arrastre por defecto del browser. Para añadir esta función necesita incluir una función global {{domxref("GlobalEventHandlers.ondragover","ondragover")}}:</p>
-
-<pre class="brush: html notranslate">&lt;div id="drop_zone" ondrop="dropHandler(event);" ondragover="dragOverHandler(event);"&gt;
-  &lt;p&gt;Arrastra y suelta uno o más archivos a esta zona ...&lt;/p&gt;
-&lt;/div&gt;
-</pre>
-
-<p>Por último, puede que una aplicación quiera personalizar el estilo del elemento objetivo del arrastre para indicar visualmente que es una zona drag and drop. En este ejemplo, el elemento objetivo usa el siguiente estilo:</p>
-
-<pre class="brush: css notranslate">#drop_zone {
-  border: 5px solid blue;
-  width:  200px;
-  height: 100px;
-}
-</pre>
-
-<div class="note">
-<p>Fíjese que los eventos <code>dragstart</code> y <code>dragend</code> no son activados cuando se arrastra un archivo al browser desde el SO.</p>
-</div>
-
-<h2 id="Procesar_la_acción_de_soltar_drop">Procesar la acción de soltar [drop]</h2>
-
-<p>El evento {{event("drop")}} se ejecuta cuando el usuario suelta el o los archivos. En el siguiente manejador, si el navegador sorporta la interfaz {{domxref("DataTransferItemList")}} , el método {{domxref("DataTransferItem.getAsFile","getAsFile()")}} se utiliza para acceder cada fichero; de lo contrario la propiedad {{domxref("DataTransfer")}} de la interfaz {{domxref("DataTransfer.files","files")}} es usada para acceder cada archivo.</p>
-
-<p>El ejemplo siguiente muestra como escribir el nombre de cada fichero arrastrado en la consola. En una aplicación <em>real</em>, se querrá procesar un archivo usando {{domxref("File","File API")}}.</p>
-
-<p>Nótese que en este ejemplo, cualquier item arrastrado que no sea un archivo es ignorado.</p>
-
-<pre class="brush: js notranslate">function dropHandler(ev) {
-  console.log('Fichero(s) arrastrados');
-
-  // Evitar el comportamiendo por defecto (Evitar que el fichero se abra/ejecute)
-  ev.preventDefault();
-
-  if (ev.dataTransfer.items) {
-    // Usar la interfaz DataTransferItemList para acceder a el/los archivos)
-    for (var i = 0; i &lt; ev.dataTransfer.items.length; i++) {
-      // Si los elementos arrastrados no son ficheros, rechazarlos
-      if (ev.dataTransfer.items[i].kind === 'file') {
-        var file = ev.dataTransfer.items[i].getAsFile();
-        console.log('... file[' + i + '].name = ' + file.name);
-      }
-    }
-  } else {
-    // Usar la interfaz DataTransfer para acceder a el/los archivos
-    for (var i = 0; i &lt; ev.dataTransfer.files.length; i++) {
-      console.log('... file[' + i + '].name = ' + ev.dataTransfer.files[i].name);
-    }
-  }
-
-  // Pasar el evento a removeDragData para limpiar
-  removeDragData(ev)
-}</pre>
-
-<h2 id="Prevenir_el_comportamiento_default_de_arrastrado_en_el_browser">Prevenir el comportamiento default de arrastrado en el browser </h2>
-
-<p>El siguiente evento {{event("dragover")}} llama a  {{domxref("Event.preventDefault","preventDefault()")}} para deshabilitar (turn off) la respuesta estandar drag-and-drop del browser.</p>
-
-<pre class="brush: js notranslate">function dragOverHandler(ev) {
-  console.log('File(s) in drop zone');
-
-  // Prevent default behavior (Prevent file from being opened)
-  ev.preventDefault();
-}
-</pre>
-
-<h2 id="Limpieza_Cleanup">Limpieza (Cleanup)</h2>
-
-<p>Typically, an application may want to perform some cleanup by deleting the file drag data. In this example, the drop event is passed along from drop handler to a custom function called removeDragData. If the browser supports the {{domxref("DataTransferItemList")}} interface, the list's {{domxref("DataTransferItemList.clear","clear()")}} method is used to delete the file drag data; otherwise the {{domxref("DataTransfer")}} object's {{domxref("DataTransfer.clearData","clearData()")}} method is used to delete the data.</p>
-
-<pre class="brush: js notranslate">function removeDragData(ev) {
-  console.log('Removing drag data')
-
-  if (ev.dataTransfer.items) {
-    // Use DataTransferItemList interface to remove the drag data
-    ev.dataTransfer.items.clear();
-  } else {
-    // Use DataTransfer interface to remove the drag data
-    ev.dataTransfer.clearData();
-  }
-}
-</pre>
-
-<h2 id="See_also" name="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/HTML_Drag_and_Drop_API">HTML Drag and Drop API</a></li>
- <li><a class="internal" href="/Web/Guide/HTML/Drag_operations" title="Drag Operations">Drag Operations</a></li>
- <li><a href="https://html.spec.whatwg.org/multipage/interaction.html#dnd" title="Drag and Drop Standard">HTML5 Living Standard: Drag and Drop</a></li>
-</ul>
diff --git a/files/es/dragdrop/drag_and_drop/index.html b/files/es/dragdrop/drag_and_drop/index.html
deleted file mode 100644
index 82e069ed48..0000000000
--- a/files/es/dragdrop/drag_and_drop/index.html
+++ /dev/null
@@ -1,57 +0,0 @@
----
-title: Arrastrar y soltar
-slug: DragDrop/Drag_and_Drop
-tags:
-  - HTML5
-  - XUL
-translation_of: Web/API/HTML_Drag_and_Drop_API
----
-<p>Firefox y otras aplicaciones de Mozilla admiten una serie de características para gestionar la funcionalidad de arrastrar y soltar. Esto le permite al usuario hacer clic y mantener presionado el botón del ratón/mouse sobre un elemento, arrastrarlo a otra ubicación y soltarlo para colocar el elemento allí. Al puntero le seguirá una representación transparente de lo que se está arrastrando durante la operación. La ubicación de destino puede ser una aplicación diferente. Sitios web, extensiones y aplicaciones XUL pueden hacer uso de esta funcionalidad para personalizar los elementos que pueden ser arrastrados, evaluar la operación, así como especificar el lugar donde los elementos se pueden soltar.</p>
-<div class="note"> Esta sección trata sobre la funcionalidad de arrastrar y soltar en Firefox 3.5 (Gecko 1.9.1) y versiones posteriores. Consulta la <a href="/en-US/docs/Drag_and_Drop" title="/en-US/docs/Drag_and_Drop">documentación de la API anterior</a> para Firefox 3.0 y versiones anteriores.</div>
-
-
-<h2 id="Elementos_básicos_de_arrastrar_y_soltar">Elementos básicos de arrastrar y soltar</h2>
-<p>Cuando comienza una operación de arrastre, se puede proporcionar una serie de datos:</p>
-<ul>
-	<li>los datos que se van a arrastrar, que pueden ser de varios formatos diferentes. Por ejemplo, datos de texto que contienen una cadena de texto que se va a arrastrar. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragdata" title="/en-US/docs/DragDrop/Drag_Operations#dragdata">Datos de la operación de arrastre</a> .</li>
-	<li>la imagen de confirmación sobre la operación de arrastre que aparece junto al puntero durante la operación. Esta imagen puede personalizarse, sin embargo, la mayoría de las veces, no se especifica y se genera una imagen por defecto basándose en el elemento donde se ha pulsado el ratón/mouse. Para obtener más información acerca de estas imágenes, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragfeedback" title="/en-US/docs/DragDrop/Drag_Operations#dragfeedback">Configurar la imagen de confirmación sobre la operación de descarga</a> .</li>
-	<li>efectos de arrastre que se permiten. Son posibles tres efectos: <code>copy</code> para indicar que los datos que se arrastran se copiarán desde su ubicación actual a la ubicación de destino, <code>move</code> para indicar que los datos que se arrastran serán movidos y <code>link</code> para indicar que se creará algún tipo de relación o conexión entre la ubicación actual y la ubicación de destino. Durante la operación, se pueden modificar los efectos de arrastre y especificar cuáles en concreto se permiten en determinadas ubicaciones. Si se permite, se puede realizar una operación de colocación en esa ubicación. Consulta <a href="/en-US/docs/DragDrop/Drag_Operations#drageffects" title="/en-US/docs/DragDrop/Drag_Operations#drageffects">Efectos de arrastre</a> para obtener más detalles.</li>
-</ul>
-<p>Mozilla y Firefox admiten una serie de características que no se encuentran en el modelo estándar de arrastrar y soltar. Estas te permiten arrastrar elementos múltiples y arrastrar datos que no son cadenas. Para obtener más información, consulta <a href="/en-US/docs/DragDrop/Dragging_and_Dropping_Multiple_Items" title="/en-US/docs/DragDrop/Dragging_and_Dropping_Multiple_Items">Arrastrar y soltar múltiples elementos</a> .</p>
-<p>Para obtener una lista de tipos de datos comunes utilizados para arrastrar y soltar, consulta <a href="/en-US/docs/DragDrop/Recommended_Drag_Types" title="/en-US/docs/DragDrop/Recommended_Drag_Types">Tipos de operaciones de arrastre recomendados</a>.</p>
-<p>Está disponible una referencia rápida para los procedimientos recomendados en la operación de arrastre de los siguientes tipos de elementos:</p>
-<ul>
-	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#text" title="/en-US/docs/DragDrop/Recommended_Drag_Types#text">Texto</a></li>
-	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#link" title="/en-US/docs/DragDrop/Recommended_Drag_Types#link">Enlaces</a></li>
-	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#html" title="/en-US/docs/DragDrop/Recommended_Drag_Types#html">HTML y XML</a></li>
-	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#file" title="/en-US/docs/DragDrop/Recommended_Drag_Types#file">Archivos</a></li>
-	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#image" title="/en-US/docs/DragDrop/Recommended_Drag_Types#image">Imágenes</a></li>
-	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#node" title="/en-US/docs/DragDrop/Recommended_Drag_Types#node">Nodos de documento</a></li>
-</ul>
-<p>Consulta <a href="/en-US/docs/DragDrop/DataTransfer" title="/en-US/docs/DragDrop/DataTransfer">DataTransfer</a> para tener una referencia al objeto DataTransfer.</p>
-
-
-<h2 id="events" name="events">Eventos de arrastre</h2>
-<p>Se utilizan una serie de eventos que se ejecutan durante las diversas etapas de la operación de arrastre y colocación. Ten en cuenta que se ejecutan sólo los eventos de arrastre, los eventos del ratón/mouse como <code>mousemove</code> no se ejecutan durante una operación de arrastre.</p>
-<p>La propiedad <a href="/en-US/docs/DragDrop/DataTransfer" title="/en-US/docs/DragDrop/DataTransfer">dataTransfer</a> de todos los eventos de arrastre contiene datos sobre la operación de arrastre y colocación.</p>
-
-
-<dl>
-	<dt>dragstart</dt>
-	<dd>Se ejecuta sobre un elemento cuando se inicia una operación de arrastre. El usuario está solicitando arrastrar el elemento al que dispara el evento dragstart. Durante este evento, un proceso de escucha ajustará cierto tipo de información como los datos de la operación de arrastre y la imagen que se asocia con ella. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragstart" title="/en-US/docs/DragDrop/Drag_Operations#dragstart">Inicio de una operación de arrastre</a> .</dd>
-	<dt>dragenter</dt>
-	<dd>Se dispara cuando el ratón/mouse se mueve primero sobre un elemento, mientras está teniendo lugar una operación de arrastre. Un proceso de escucha de este evento debe indicar si se permite una operación de arrastre sobre esta ubicación. Si no hay procesos de escucha o éstos no realizan ninguna operación, entonces no se permite, de manera predeterminada, una operación de arrastre. Este es también el evento al que escuchar si deseas proporcionar información acerca de que se permite una operación de arrastre, como, por ejemplo, mostrar un resaltado o un marcador de inserción. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#droptargets" title="/en-US/docs/DragDrop/Drag_Operations#droptargets">Especificación de destinos de colocación</a> .</dd>
-	<dt>dragover</dt>
-	<dd>Este evento se activa cuando el ratón/mouse se mueve sobre un elemento cuando está teniendo lugar una operación de arrastre. Gran parte del tiempo, la operación que tiene lugar durante un proceso de escucha será la misma que el evento dragenter. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#droptargets" title="/en-US/docs/DragDrop/Drag_Operations#droptargets">Especificación de destinos de colocación</a>.</dd>
-	<dt>dragleave</dt>
-	<dd>Este evento se activa cuando el ratón/mouse sale de un elemento mientras que está teniendo lugar una operación de arrastre. Los procesos de escucha deben eliminar cualquier resaltado o marcador de inserción que usan para la información sobre el proceso de arrastre.</dd>
-	<dt>drag</dt>
-	<dd>Este evento se activa en el origen del arrastre, es decir, el elemento donde dragstart fue disparado, durante la operación de arrastre.</dd>
-	<dt>drop</dt>
-	<dd>El evento se dispara sobre el elemento en el que se produjo la colocación al finalizar la operación de arrastre. Un proceso de escucha se encargará de recuperar los datos que se arrastran e insertarlos en la ubicación de la colocación. Este evento sólo se activará si se desea disponer de la funcionalidad de soltar. No se activará si el usuario cancela la operación de arrastre, por ejemplo, pulsando la tecla Escape, o si se liberó el botón del ratón/mouse mientras que éste no estaba sobre un destino de colocación válido. Para más información sobre esto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#drop" title="/en-US/docs/DragDrop/Drag_Operations#drop">Realizar una operación de colocación</a>.</dd>
-	<dt>dragend</dt>
-	<dd>El origen del arrastre recibirá un evento dragend cuando la operación se haya completado, tanto si tuvo éxito como si no. Consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragend" title="/en-US/docs/DragDrop/Drag_Operations#dragend">Finalizar una operación de arrastre</a> si deseas más información.</dd>
-</dl>
-
-
-<div>{{ HTML5ArticleTOC () }}</div>
diff --git a/files/es/dragdrop/index.html b/files/es/dragdrop/index.html
deleted file mode 100644
index 292b860888..0000000000
--- a/files/es/dragdrop/index.html
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: DragDrop
-slug: DragDrop
-tags:
-  - NeedsTranslation
-  - TopicStub
-translation_of: Web/API/HTML_Drag_and_Drop_API
-translation_of_original: DragDrop
----
-<p> </p>
-<p>See <a href="https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop">https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop</a></p>
diff --git a/files/es/dragdrop/recommended_drag_types/index.html b/files/es/dragdrop/recommended_drag_types/index.html
deleted file mode 100644
index daad516a44..0000000000
--- a/files/es/dragdrop/recommended_drag_types/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Tipos de Drag recomendados
-slug: DragDrop/Recommended_Drag_Types
-translation_of: Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types
----
-<p>A continuación se describe la mejor practica para utilizar los datos a ser arrastrado.</p>
-<h2 id="text" name="text">Arrastramdo Texto</h2>
-<p>Al arrastrar el texto, utilice el texto / texto normal. Los datos deben ser la cadena de arrastre. Por ejemplo:</p>
-<pre>event.dataTransfer.setData("text/plain", "This is text to drag")
-</pre>
-<p>Arrastrar texto en cuadros de texto y las selecciones de las páginas web se realiza de forma automática, por lo que no es necesario para manejar dragging.</p>
-<p><span style="line-height: 1.5;">Se recomienda que siempre se agrega datos del tipo  </span><code style="font-size: 14px;">text/plain</code><span style="line-height: 1.5;">  </span><span style="line-height: 1.5;">como un mensaje para las aplicaciones o los destinos que no soportan otros tipos, a menos que no hay alternativa de texto lógico. Siempre agregue el tipo de texto sin formato pasado, ya que es el menos específico.</span></p>
-<p><span style="line-height: 1.5;">En códigos más viejo, encontrara </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/unicode o </span>el tipo<span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"> </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">Text.</span><span style="line-height: 1.5;">Estos equivalen </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/plain,</span><span style="line-height: 1.5;">que </span><span style="line-height: 1.5;">guardara y recibia los datos del texto plano en ese lugar</span><font face="Courier New, Andale Mono, monospace"><span style="line-height: normal;">.</span></font></p>
-<h2 id="link" name="link">Arrastrando Enlaces</h2>
-<p>Los enlaces deben incluir los datos de los dos tipos, el primero debe ser  URL utilizando el tipo <span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/uri-list,</span><span style="line-height: 1.5;">y el segundo es URL utilizando el tipo </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/plain. </span><span style="line-height: 1.5;">Ambos tipos deben utilizar los mismos datos, la URL del enlace. Por ejemplo:</span></p>
-<pre>var dt = event.dataTransfer;
-dt.setData("text/uri-list", "http://www.mozilla.org");
-dt.setData("text/plain", "http://www.mozilla.org");
-</pre>
-<p>Es constumbre, establecer el tipo <span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/plain de ultimo, </span><span style="line-height: 1.5;">, ya que es menos específico que el tipo de URI.</span></p>
-<p>Note que el tipo de URL <span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">uri-list </span><span style="line-height: 1.5;">es con una "i", no una "L"</span></p>
-<p><span style="line-height: 1.5;">Note that the URL type is </span><code style="font-size: 14px;">uri-list</code><span style="line-height: 1.5;"> with an 'I', not with an 'L'.</span></p>
-<p>To drag multiple links, you can also separate each link with a linebreak. A line that begins with a number sign (#) is a comment and should not be considered a valid URL. You can use a comment to indicate the purpose of a link, or to hold the title associated with a link. The <code>text/plain</code> version of the drag data should include all links but should not include the comments.</p>
-<p>For example:</p>
-<pre>http://www.mozilla.org
-#A second link
-http://www.xulplanet.com
-</pre>
-<p>This sample <code>text/uri-list</code> data contains two links and a comment.</p>
-<p>When retrieving a dropped link, you should ensure you handle the case where multiple links may have been dragged, and any comments that appear in the data. For convenience, the special type <code>URL</code> may be used to refer to the first valid link within the data for the <code>text/uri-list</code> type. You should not add data using the <code>URL</code> type; attempting to do so will just set the value of the <code>text/uri-list</code> type instead.</p>
-<pre>var url = event.dataTransfer.getData("URL");
-</pre>
-<p>You may also see data using the <code>text/x-moz-url</code> type which is a Mozilla specific type. If it appears, it should be used before the <code>text/uri-list</code> type. It holds the URL of the link followed by the title of the link, separated by a linebreak. For example:</p>
-<pre>http://www.mozilla.org
-Mozilla
-http://www.xulplanet.com
-XUL Planet
-</pre>
-<h2 id="html" name="html">Dragging HTML and XML</h2>
-<p>HTML content may use the <code>text/html</code> type. The data for this type should be the serialized HTML to drag. For instance, it would be suitable to set the data value for this type to the value of the <code>innerHTML</code> property of an element.</p>
-<p>XML content may use the <code>text/xml</code> type, but you should ensure that the data value is well-formed XML.</p>
-<p>You may also include a plain text representation of the HTML or XML data using the <code>text/plain</code> type. The data should be just the text and should not include any of the source tags or attributes. For instance:</p>
-<pre>var dt = event.dataTransfer;
-dt.setData("text/html", "Hello there, &lt;strong&gt;stranger&lt;/strong&gt;");
-dt.setData("text/plain", "Hello there, stranger");
-</pre>
-<h2 id="file" name="file">Dragging Files</h2>
-<p>A local file is dragged using the <code>application/x-moz-file</code> type with a data value that is an <a href="/en/XPCOM_Interface_Reference/nsIFile" title="nsIFile">nsIFile</a> object. Non-privileged web pages are not able to retrieve or modify data of this type. Because a file is not a string, you must use the <a href="/En/DragDrop/DataTransfer#mozSetDataAt.28.29" title="mozSetDataAt">mozSetDataAt</a> method to assign the data. Similarly, when retrieving the data, you must use the <a href="/En/DragDrop/DataTransfer#mozGetDataAt.28.29" title="mozGetDataAt">mozGetDataAt</a> method.</p>
-<pre>event.dataTransfer.mozSetDataAt("application/x-moz-file", file, 0);
-</pre>
-<p>If possible, you may also include the file URL of the file using both the <code>text/uri-list</code> and/or <code>text/plain</code> types. These types should be added last so that the more specific <code>application/x-moz-file</code> type has higher priority.</p>
-<p>Multiple files will be received during a drop as mutliple items in the data transfer. See <a href="/En/DragDrop/Dragging_and_Dropping_Multiple_Items" title="Dragging and Dropping Multiple Items">Dragging and Dropping Multiple Items</a> for more details about this.</p>
-<p>The following example shows how to create an area for receiving dropped files:</p>
-<pre>&lt;listbox ondragenter="return checkDrag(event)"
-         ondragover="return checkDrag(event)"
-         ondrop="doDrop(event)"/&gt;
-
-&lt;script&gt;
-function checkDrag(event)
-{
-  return event.dataTransfer.types.contains("application/x-moz-file");
-}
-
-function doDrop(event)
-{
-  var file = event.dataTransfer.mozGetDataAt("application/x-moz-file", 0);
-  if (file instanceof Components.interfaces.nsIFile)
-    event.currentTarget.appendItem(file.leafName);
-}
-&lt;/script&gt;
-</pre>
-<p>In this example, the event returns false only if the data transfer contains the <code>application/x-moz-file</code> type. During the drop event, the data associated with the file type is retrieved, and the filename of the file is added to the listbox. Note that the <code>instanceof</code> operator is used here as the <a href="/En/DragDrop/DataTransfer#mozGetDataAt.28.29" title="mozGetDataAt">mozGetDataAt</a> method will return an <code>nsISupports</code> that needs to be checked and converted into an nsIFile. This is also a good extra check in case someone made a mistake and added a non-file for this type.</p>
-<h2 id="image" name="image">Dragging Images</h2>
-<p>Direct image dragging is not commonly done. In fact, Mozilla does not support direct image dragging on Mac or Linux platforms. Instead, images are usually dragged only by their URLs. To do this, use the <code>text/uri-list</code> type as with other URL links. The data should be the URL of the image or a data URL if the image is not stored on a web site or disk. For more information about data URLs, see <a class="internal" href="/en/data_URIs" title="en/The data URL scheme">the data URL scheme</a>.</p>
-<p>As with other links, the data for the <code>text/plain</code> type should also contain the URL. However, a data URL is not usually as useful in a text context, so you may wish to exclude the <code>text/plain</code> data in this situation.</p>
-<p>In chrome or other privileged code, you may also use the <code>image/jpeg</code>, <code>image/png</code> or <code>image/gif</code> types, depending on the type of image. The data should be an object which implements the <a href="/en/XPCOM_Interface_Reference/nsIInputStream" title="nsIInputStream">nsIInputStream</a> interface. When this stream is read, it should provide the data bits for the image, as if the image was a file of that type.</p>
-<p>You should also include the <code>application/x-moz-file</code> type if the image is located on disk. In fact, this a common way in which image files are dragged.</p>
-<p>It is important to set the data in the right order, from most specific to least specific. The image type such as <code>image/jpeg</code> should come first, followed by the <code>application/x-moz-file</code> type. Next, you should set the <code>text/uri-list</code> data and finally the <code>text/plain</code> data. For example:</p>
-<pre>var dt = event.dataTransfer;
-dt.mozSetDataAt("image/png", stream, 0);
-dt.mozSetDataAt("application/x-moz-file", file, 0);
-dt.setData("text/uri-list", imageurl);
-dt.setData("text/plain", imageurl);
-</pre>
-<p>Note that the <a href="/En/DragDrop/DataTransfer#mozGetDataAt.28.29" title="mozGetDataAt">mozGetDataAt</a> method is used for non-text data. As some contexts may only include some of these types, it is important to check which type is made available when receiving dropped images.</p>
-<h2 id="node" name="node">Dragging Nodes</h2>
-<p>Nodes and elements in a document may be dragged using the <code>application/x-moz-node</code> type. This data for the type should be a DOM node. This allows the drop target to receive the actual node where the drag was started from. Note that callers from a different domain will not be able to access the node even when it has been dropped.</p>
-<p>You should always include a plain text alternative for the node.</p>
-<h2 id="custom" name="custom">Dragging Custom Data</h2>
-<p>You can also use other types that you make up for custom purposes. You should strive to always include a plain text alternative unless that object being dragged is specific to a particular site or application. In this case, the custom type ensures that the data cannot be dropped elsewhere.</p>
-<h2 id="filestoos" name="filestoos">Dragging files to an operating system folder</h2>
-<p>There are cases in which you may want to add a file to an existing drag event session, and you may also want to write the file to disk when the drop operation happens over a folder in the operating system when your code receives notification of the target folder's location. This only works in extensions (or other privileged code) and the data flavor "application/moz-file-promise" should be used. The following sample offers an overview of this advanced case:</p>
-<pre class="brush: js">// currentEvent is a given existing drag operation event
-
-currentEvent.dataTransfer.setData("text/x-moz-url", URL);
-currentEvent.dataTransfer.setData("application/x-moz-file-promise-url", URL);
-currentEvent.dataTransfer.setData("application/x-moz-file-promise-filename", leafName);
-currentEvent.dataTransfer.mozSetDataAt('application/x-moz-file-promise',
-                  new dataProvider(success,error),
-                  0, Components.interfaces.nsISupports);
-
-function dataProvider(){}
-
-dataProvider.prototype = {
-  QueryInterface : function(iid) {
-    if (iid.equals(Components.interfaces.nsIFlavorDataProvider)
-                  || iid.equals(Components.interfaces.nsISupports))
-      return this;
-    throw Components.results.NS_NOINTERFACE;
-  },
-  getFlavorData : function(aTransferable, aFlavor, aData, aDataLen) {
-    if (aFlavor == 'application/x-moz-file-promise') {
-
-       var urlPrimitive = {};
-       var dataSize = {};
-
-       aTransferable.getTransferData('application/x-moz-file-promise-url', urlPrimitive, dataSize);
-       var url = new String(urlPrimitive.value.QueryInterface(Components.interfaces.nsISupportsString));
-       console.log("URL file orignal is = " + url);
-
-       var namePrimitive = {};
-       aTransferable.getTransferData('application/x-moz-file-promise-filename', namePrimitive, dataSize);
-       var name = new String(namePrimitive.value.QueryInterface(Components.interfaces.nsISupportsString));
-
-       console.log("target filename is = " + name);
-
-       var dirPrimitive = {};
-       aTransferable.getTransferData('application/x-moz-file-promise-dir', dirPrimitive, dataSize);
-       var dir = dirPrimitive.value.QueryInterface(Components.interfaces.nsILocalFile);
-
-       console.log("target folder is = " + dir.path);
-
-       var file = Cc['@mozilla.org/file/local;1'].createInstance(Components.interfaces.nsILocalFile);
-       file.initWithPath(dir.path);
-       file.appendRelativePath(name);
-
-       console.log("output final path is =" + file.path);
-
-       // now you can write or copy the file yourself...
-    }
-  }
-}
-</pre>
-<p>{{ languages( { "ja": "Ja/DragDrop/Recommended_Drag_Types" } ) }}</p>
diff --git a/files/es/estructura_de_directorios_de_código_fuente_de_mozilla/index.html b/files/es/estructura_de_directorios_de_código_fuente_de_mozilla/index.html
deleted file mode 100644
index 64997a3c50..0000000000
--- a/files/es/estructura_de_directorios_de_código_fuente_de_mozilla/index.html
+++ /dev/null
@@ -1,698 +0,0 @@
----
-title: Estructura de directorios de código fuente de Mozilla
-slug: Estructura_de_directorios_de_código_fuente_de_Mozilla
----
-<p>El código para todos los proyectos de la familia Mozilla (como <span style="color: #0000cd;">Firefox</span>, <span style="color: #0000cd;">Thunderbird</span>, <span style="color: #0000cd;">etc.</span>) se combina en un único árbol-fuente. El árbol contiene el código fuente, así como el código necesario para generar cada proyecto en las plataformas compatibles (Linux, Windows, Mac OS, etc).</p>
-<p>Si simplemente quieres echar un vistazo al código fuente de Mozilla, no es necesario que lo descargues. Puedes mirar el codigo fuente directamente con tu navegador web usando MXR (la raiz del codigo fuente completo de Mozilla comienza en <a class="external" href="http://mxr.mozilla.org/mozilla-central/source/" rel="external" title="http://mxr.mozilla.org/mozilla-central/source/">http://mxr.mozilla.org/mozilla-central/source/</a>).</p>
-<p>Para modificar el código fuente, tienes que adquirirlo, ya sea descargando una<span style="color: #0000cd;"> instantánea </span>de las fuentes o <span style="color: #0000cd;">revisando las fuentes actuales de Mercurial</span>.</p>
-<p>Este documento describe la estructura de directorios que puede ser generada por client.mk -- es decir, los directorios que se utilizan por lo menos en algún producto del proyecto Mozilla. Hay otros directorios en el repositorio CVS de Mozilla, como los de las herramientas Web y los del código base clásico.</p>
-<p>Esto no está del todo actualizado. Mira la <span style="color: #0000cd;">descripción general de los directorios del código fuente</span> para una versión algo diferente (antigua) de la misma información. También mira la <span style="color: #0000cd;">descripción más detallada de las partes de Gecko</span>.</p>
-<h2 id="accessible">accessible</h2>
-<p>Archivos para la accesibilidad (por ejemplo, los archivos de soporte MSAA (Microsoft Active Accessibility) y ATK (Accessibility Toolkit, usado por GTK+ 2)). Ver <span style="color: #0000cd;">Accesibilidad de Mozilla</span>  <span style="color: #0000cd;">Accesibilidad</span>.</p>
-<h2 id="browser">browser</h2>
-<p>Contiene el código de la parte del usuario para el navegador Firefox (en XUL, JavaScript, XBL, y C++). Muchos de estos archivos comenzaron como una copia de los archivos de <span style="color: #0000cd;">xpfe</span>/.</p>
-<div id="section_3">
-  <h2 id="build">build</h2>
-  <p>Archivos varios, utilizados en el proceso de compilación. Véase también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#config" title="Mozilla_Source_Code_Directory_Structure#config">config</a>/.</p>
-</div>
-
-<div id="section_4">
-  <h2 id="calendar">calendar</h2>
-  <p>Implementación de <span style="color: #0000cd;">Calendar</span>, creado originalmente por OEone. Véase también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#extensions.2Flightning" title="Mozilla_Source_Code_Directory_Structure#extensions.2Flightning">extensions/lightning</a>/.</p>
-  <h2 id="caps">caps</h2>
-  <p>Gestión de la seguridad de la página web basada en capabilities.</p>
-  <p>Caps contiene las interfaces de C++ y el código para determinar las capabilities del contenido basado en la configuración de seguridad o certificados (por ejemplo VeriSign). Ver <span style="color: #0000cd;">seguridad de componentes</span>.</p>
-  <div id="section_6">
-    <h2 id="chrome">chrome</h2>
-    <p>Registro chrome utilizado con <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#toolkit" title="Mozilla_Source_Code_Directory_Structure#toolkit">toolkit</a>/. Estos archivos fueron originalmente copias de los archivos de <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#rdf" title="Mozilla_Source_Code_Directory_Structure#rdf">rdf</a>/chrome/.</p>
-  </div>
-  <div id="section_7">
-    <h2 id="composer">composer</h2>
-    <p>El código (XUL y JavaScript) de la parte del usuario (front-end) para la aplicación standalone <a href="http://www-archive.mozilla.org/editor/" title="http://www-archive.mozilla.org/editor/">Composer</a>.</p>
-  </div>
-  <div id="section_8">
-    <h2 id="config">config</h2>
-    <p>Más archivos utilizados por el proceso de compilación, incluidos normalmente para los makefiles, etc. Véase también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#build" title="Mozilla_Source_Code_Directory_Structure#build">build</a>/.</p>
-    <h2 id="content">content</h2>
-    <p>Las estructuras de datos que representan la estructura de las páginas Web (HTML, SVG, documentos XML, elementos, nodos de texto, etc.). Estos objetos contienen la implementación de varias interfaces DOM y también implementan algunos de los comportamientos asociados a esos objetos, como manejo de enlaces, control del comportamiento del formulario y envío del formulario.</p>
-    <p>Este directorio también contiene el código para <span style="color: #0000cd;">XUL</span>, <span style="color: #0000cd;">XBL</span>, <span style="color: #0000cd;">XTF</span>, <span style="color: #0000cd;">&lt;canvas&gt;</span>, así como el código de la implementación XSLT y manejo de eventos.</p>
-    <h2 id="db">db</h2>
-    <p>Contenedor para los módulos de acceso a las bases de datos. Actualmente contiene mork y sqlite.</p>
-    <h2 id="dbmdb_dbmork_and_dbmorkreader">db/mdb, db/mork, and db/morkreader</h2>
-    Implementación de <a href="/en-US/docs/Mork" title="Mork">Mork</a>, un formato de texto para bases de datos. Este se utiliza por ejemplo para almacenar la historia global.<br>
-    <p><code>morkreader</code> es un analizador simple para mork usado para migrar los datos antiguos a las nuevas bases de datos basadas en sqlite.</p>
-    <div id="section_12">
-      <h2 id="dbsqlite3">db/sqlite3</h2>
-      <p>La base de datos SQLite, usada por <a href="/en-US/docs/Storage" title="Storage">storage</a>. Reemplaza a mork en <a href="/en-US/docs/Firefox_3_for_developers" title="Firefox_3_for_developers">Firefox 3</a>.</p>
-    </div>
-    <div id="section_13">
-      <h2 id="dbm">dbm</h2>
-      <p>Código fuente de la librería Berkeley de base de datos, hackeado desde la versión 4.4BSD. Utilizado principalmente por el código NSS como almacén de certificados.</p>
-    </div>
-    <div id="section_14">
-      <h2 id="directory"><span>directory</span></h2>
-      <p>Soporte LDAP para Mozilla. Utilizado en las noticias por correo.</p>
-    </div>
-    <div id="section_15">
-      <h2 id="docshell"><span>docshell</span></h2>
-      <p>Implementación del docshell, el objeto principal para el manejo de lo relacionado con la ventana de un documento. Cada cuadro tiene su propio docshell. Contiene métodos para la carga de URIs, gestión de los oyentes del contenido de los URIs, etc. Es la capa más externa de la API embebida usada para incrustar un navegador Gecko en una aplicación. Ver también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#webshell">webshell</a>/.</p>
-    </div>
-    <div id="section_16">
-      <h2 id="dom">dom</h2>
-      <p>Contiene:</p>
-      <ul>
-        <li><a href="/en-US/docs/XPIDL" title="XPIDL">Definiciones IDL</a> de las interfaces definidas por las especificaciones DOM y las extensiones de Mozilla a estas interfaces (las implementaciones de estas interfaces están principalmente, aunque no completamente, en <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#content">content</a>/).</li>
-        <li>Las partes de la conexión entre JavaScript y las implementaciones de objetos DOM que son específicos para JavaScript y el DOM. (Las partes que no son específicas del DOM, es decir, la unión genérica entre XPCOM y JavaScript, se encuentran en <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#js/src/xpconnect" rel="custom">js/src/xpconnect</a>/.)</li>
-        <li>Las implementaciones de algunos de los principales objetos "DOM nivel 0", tales como window, window.navigator, window.location, etc.</li>
-      </ul>
-    </div>
-    <div id="section_17">
-      <h2 id="editor"><span>editor</span></h2>
-      <p>The editor directory contains C++ interfaces, C++ code, and XUL/JavaScript for the embeddable editor component, which is used for the HTML Editor("Composer"), for plain and HTML mail composition, and for text fields and text areas throughout the product. The editor is designed like a "browser window with editing features": it adds some special classes for editing text and managing transaction undo/redo, but reuses browser code for nearly everything else.</p>
-      <p>Contains:</p>
-      <ul>
-        <li>The backend for HTML and text editing. This is not only used for the mail composer and the page editor composer, but also for <a class="external" href="http://www.mozilla.org/editor/midas-spec.html" rel="external" title="http://www.mozilla.org/editor/midas-spec.html">rich text editing inside webpages</a>. Textarea and input fields are using such an editor as well (in the plaintext variant). See <a class="external" href="http://www.mozilla.org/editor/" rel="external" title="http://www.mozilla.org/editor/">Mozilla Editor</a>.</li>
-        <li>The frontend for the HTML editor that is part of SeaMonkey.</li>
-      </ul>
-    </div>
-    <div id="section_18">
-      <h2 id="embedding"><span>embedding</span></h2>
-      <p>XXX this needs a description. See <a class="external" href="http://www.mozilla.org/projects/embedding/" rel="external" title="http://www.mozilla.org/projects/embedding/">Embedding</a>.</p>
-    </div>
-    <div id="section_19">
-      <h2 id="extensions"><span>extensions</span></h2>
-      Contains several extensions to mozilla, which can be enabled at compile-time using the <code>--enable-extensions</code> configure argument.<br>
-      <p>Note that some of these are now built specially and not using the <code>--enable-extensions</code> option. For example, disabling xmlextras is done using <code>--disable-xmlextras</code>.</p>
-      <div id="section_20">
-        <h3 id="extensionsauth"><span>extensions/auth</span></h3>
-        <p>Implementation of the negotiate auth method for HTTP and other protocols. Has code for SSPI, GSSAPI, etc. See <a class="external" href="http://www.mozilla.org/projects/netlib/integrated-auth.html" rel="external" title="http://www.mozilla.org/projects/netlib/integrated-auth.html">Integrated Authentication</a>.</p>
-      </div>
-      <div id="section_21">
-        <h3 id="extensionscontent-packs"><span>extensions/content-packs</span></h3>
-        <p>Content- and locale-pack switching user interface.</p>
-      </div>
-      <div id="section_22">
-        <h3 id="extensionscookie"><span>extensions/cookie</span></h3>
-        <p>Permissions backend for cookies, images etc, as well as the user interface to these permissions and other cookie features.</p>
-      </div>
-      <div id="section_23">
-        <h3 id="extensionscview"><span>extensions/cview</span></h3>
-        <p>Component viewer, which allows to view the currently registered components and interfaces.</p>
-      </div>
-      <div id="section_24">
-        <h3 id="extensionsdatetime"><span>extensions/datetime</span></h3>
-        <p>Support for the datetime protocol.</p>
-      </div>
-      <div id="section_25">
-        <h3 id="extensionsfinger"><span>extensions/finger</span></h3>
-        <p>Support for the finger protocol.</p>
-      </div>
-      <div id="section_26">
-        <h3 id="extensionsgnomevfs"><span>extensions/gnomevfs</span></h3>
-        <p>Interface to gnome-vfs to allow using all protocols supported by gnome-vfs inside of mozilla.</p>
-      </div>
-      <div id="section_27">
-        <h3 id="extensionshelp"><span>extensions/help</span></h3>
-        <p>Help viewer and help content. See <a class="external" href="http://www.mozilla.org/projects/help-viewer/" rel="external" title="http://www.mozilla.org/projects/help-viewer/">Mozilla Help Viewer Project</a>.</p>
-      </div>
-      <div id="section_28">
-        <h3 id="extensionsirc"><span>extensions/irc</span></h3>
-        <div class="editIcon">
-          <h3 id="sect1"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=28"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>This is ChatZilla, the IRC (Internet Relay Chat) component. See <a class="external" href="http://www.mozilla.org/projects/rt-messaging/chatzilla/" rel="external" title="http://www.mozilla.org/projects/rt-messaging/chatzilla/">ChatZilla</a>.</p>
-      </div>
-      <div id="section_29">
-        <h3 id="extensionsjava"><span>extensions/java</span></h3>
-        <div class="editIcon">
-          <h3 id="sect2"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=29"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>XPCOM&lt;-&gt;Java bridge ("<a href="/en-US/docs/JavaXPCOM" title="JavaXPCOM">JavaXPCOM</a>", formerly known as Javaconnect). Unrelated to the code in <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#java">java</a>/.</p>
-      </div>
-      <div id="section_30">
-        <h3 id="extensionslayout-debug"><span>extensions/layout-debug</span></h3>
-        <div class="editIcon">
-          <h3 id="sect3"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=30"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Layout debugger. Intended as replacement for "viewer". Can be used to run layout regression tests and has support for other layout debugging features.</p>
-      </div>
-      <div id="section_31">
-        <h3 id="extensionslightning"><span>extensions/lightning</span></h3>
-        <div class="editIcon">
-          <h3 id="sect4"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=31"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>The Lightning project, "an extension to tightly integrate calendar functionality (scheduling, tasks, etc.) into Thunderbird." See <a class="external" href="http://wiki.mozilla.org/Calendar:Lightning" rel="external" title="http://wiki.mozilla.org/Calendar:Lightning">Lightning</a>.</p>
-      </div>
-      <div id="section_32">
-        <h3 id="extensionsmono"><span>extensions/mono</span></h3>
-        <div class="editIcon">
-          <h3 id="sect5"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=32"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>A two-way bridge between the CLR/.NET/Mono/C#/etc. world and XPCOM.</p>
-      </div>
-      <div id="section_33">
-        <h3 id="extensionsp3p"><span>extensions/p3p</span></h3>
-        <div class="editIcon">
-          <h3 id="sect6"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=33"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Implementation of W3C's Platform for Privacy Preferences standard. See <a class="external" href="http://www.mozilla.org/projects/p3p/" rel="external" title="http://www.mozilla.org/projects/p3p/">Platform for Privacy Preferences (P3P)</a>.</p>
-      </div>
-      <div id="section_34">
-        <h3 id="extensionspref"><span>extensions/pref</span></h3>
-        <div class="editIcon">
-          <h3 id="sect7"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=34"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Preference-related extensions:</p>
-      </div>
-      <div id="section_35">
-        <h3 id="extensionspython"><span>extensions/python</span></h3>
-        <div class="editIcon">
-          <h3 id="sect8"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=35"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Support for implementing XPCOM components in python. See <a href="/en-US/docs/PyXPCOM" title="PyXPCOM">PyXPCOM</a>.</p>
-      </div>
-      <div id="section_36">
-        <h3 id="extensionsreporter"><span>extensions/reporter</span></h3>
-        <div class="editIcon">
-          <h3 id="sect9"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=36"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>An extension to report problems with web pages. Client-side part. See <a class="external" href="http://reporter.mozilla.org/" rel="external" title="http://reporter.mozilla.org/">Mozilla Reporter</a>.</p>
-      </div>
-      <div id="section_37">
-        <h3 id="extensionschema-validation"><span>extension/schema-validation</span></h3>
-        <div class="editIcon">
-          <h3 id="sect10"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=37"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Allows to validate XML trees according to specified XML Schemas.</p>
-      </div>
-      <div id="section_38">
-        <h3 id="extensionspatialnavigation"><span>extension/spatialnavigation</span></h3>
-        <div class="editIcon">
-          <h3 id="sect11"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=38"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Spatial navigation, navigating between links of a document according to their on-screen position. See <a class="external" href="http://www.mozilla.org/access/keyboard/snav/" rel="external" title="http://www.mozilla.org/access/keyboard/snav/">Spatial Navigation</a>.</p>
-      </div>
-      <div id="section_39">
-        <h3 id="extensionsspellcheck"><span>extensions/spellcheck</span></h3>
-        <div class="editIcon">
-          <h3 id="sect12"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=39"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Spellchecker for mailnews and composer.</p>
-      </div>
-      <div id="section_40">
-        <h3 id="extensionssql"><span>extensions/sql</span></h3>
-        <div class="editIcon">
-          <h3 id="sect13"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=40"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Support for accessing SQL databases from XUL applications. See <a class="external" href="http://www.mozilla.org/projects/sql/" rel="external" title="http://www.mozilla.org/projects/sql/">SQL Support in Mozilla</a>.</p>
-      </div>
-      <div id="section_41">
-        <h3 id="extensionssroaming"><span>extensions/sroaming</span></h3>
-        <div class="editIcon">
-          <h3 id="sect14"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=41"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Session roaming, i.e. support for storing a profile on a remote server.</p>
-      </div>
-      <div id="section_42">
-        <h3 id="extensionstransformiix"><span>extensions/transformiix</span></h3>
-        <div class="editIcon">
-          <h3 id="sect15"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=42"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>XSLT support. XSL Transformations is a language used to transform XML documents into other XML documents. See <a class="external" href="http://www.mozilla.org/projects/xslt/" rel="external" title="http://www.mozilla.org/projects/xslt/">XSL Transformations</a>.</p>
-      </div>
-      <div id="section_43">
-        <h3 id="extensionstridentprofile"><span>extensions/tridentprofile</span></h3>
-        <div class="editIcon">
-          <h3 id="sect16"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=43"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Support for importing profiles from MSIE.</p>
-      </div>
-      <div id="section_44">
-        <h3 id="extensionstypeaheadfind"><span>extensions/typeaheadfind</span></h3>
-        <div class="editIcon">
-          <h3 id="sect17"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=44"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Find As You Type allows quick web page navigation when you type a succession of characters in the body of the displayed page. See <a class="external" href="http://www.mozilla.org/projects/ui/accessibility/typeaheadfind.html" rel="external" title="http://www.mozilla.org/projects/ui/accessibility/typeaheadfind.html">Find As You Type</a>.</p>
-      </div>
-      <div id="section_45">
-        <h3 id="extensionsuniversalchardet"><span>extensions/universalchardet</span></h3>
-        <div class="editIcon">
-          <h3 id="sect18"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=45"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Universal character set detector.</p>
-      </div>
-      <div id="section_46">
-        <h3 id="extensionsvenkman"><span>extensions/venkman</span></h3>
-        <div class="editIcon">
-          <h3 id="sect19"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=46"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>The <a href="/en-US/docs/Venkman" title="Venkman">JavaScript Debugger</a>.</p>
-      </div>
-      <div id="section_47">
-        <h3 id="extensionswallet"><span>extensions/wallet</span></h3>
-        <div class="editIcon">
-          <h3 id="sect20"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=47"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Password and Form Manager.</p>
-      </div>
-      <div id="section_48">
-        <h3 id="extensionswebdav"><span>extensions/webdav</span></h3>
-        <div class="editIcon">
-          <h3 id="sect21"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=48"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>WebDAV code; exposes special APIs for accessing WebDAV servers. Used by the Calendar project.</p>
-      </div>
-      <div id="section_49">
-        <h3 id="extensionswebservices"><span>extensions/webservices</span></h3>
-        <div class="editIcon">
-          <h3 id="sect22"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=49"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Support for Webservices. See <a class="external" href="http://www.mozilla.org/projects/webservices/" rel="external" title="http://www.mozilla.org/projects/webservices/">Web Services</a>.</p>
-      </div>
-      <div id="section_50">
-        <h3 id="extensionsxforms"><span>extensions/xforms</span></h3>
-        <div class="editIcon">
-          <h3 id="sect23"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=50"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Code for the XForms extension. See <a class="external" href="http://www.mozilla.org/projects/xforms/" rel="external" title="http://www.mozilla.org/projects/xforms/">XForms</a>.</p>
-      </div>
-      <div id="section_51">
-        <h3 id="extensionsxmlextras"><span>extensions/xmlextras</span></h3>
-        <div class="editIcon">
-          <h3 id="sect24"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=51"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Several XML-related extensions. See <a href="/en-US/docs/XML_Extras" title="XML_Extras">XML Extras</a>.</p>
-      </div>
-      <div id="section_52">
-        <h3 id="extensionsxml-rpc"><span>extensions/xml-rpc</span></h3>
-        <div class="editIcon">
-          <h3 id="sect25"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=52"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>XML Remote Procedure Calls. Unowned these days. See <a class="external" href="http://www.mozilla.org/projects/xmlrpc/" rel="external" title="http://www.mozilla.org/projects/xmlrpc/">XML-RPC in Mozilla</a>.</p>
-      </div>
-      <div id="section_53">
-        <h3 id="extensionsxmlterm"><span>extensions/xmlterm</span></h3>
-        <div class="editIcon">
-          <h3 id="sect26"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=53"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>XMLTerm, a terminal implemented using mozilla technology. Only available on GTK builds.</p>
-      </div>
-    </div>
-    <div id="section_54">
-      <h2 id="gc"><span>gc</span></h2>
-      <div class="editIcon">
-        <h2 id="sect27"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=54"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Container for garbage collection libraries, currently only boehm GC.</p>
-    </div>
-    <div id="section_55">
-      <h2 id="gfx"><span>gfx</span></h2>
-      <div class="editIcon">
-        <h2 id="sect28"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=55"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Contains interfaces that abstract the capabilities of platform specific graphics toolkits, along with implementations on various platforms. These interfaces provide methods for things like drawing images, text, and basic shapes. It also contains basic data structures such as points and rectangles used here and in other parts of Mozilla.</p>
-      <p>It is also the home of the new graphics architecture based on cairo (via a C++ wrapper called thebes). See <a class="external" href="http://wiki.mozilla.org/Mozilla2:NewGFXAPIs" rel="external" title="http://wiki.mozilla.org/Mozilla2:NewGFXAPIs">NewGFXAPIs</a> and <a class="external" href="http://wiki.mozilla.org/Mozilla2:GFXEvolution" rel="external" title="http://wiki.mozilla.org/Mozilla2:GFXEvolution">GFXEvolution</a>.</p>
-    </div>
-    <div id="section_56">
-      <h2 id="image"><span>image</span></h2>
-      <div class="editIcon">
-        <h2 id="sect29"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=56"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Image rendering library. Contains decoders for the image formats mozilla supports.</p>
-    </div>
-    <div id="section_57">
-      <h2 id="intl"><span>intl</span></h2>
-      <div class="editIcon">
-        <h2 id="sect30"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=57"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Internationalization and localization support. See <a class="external" href="http://www.mozilla.org/projects/intl/index.html" rel="external" title="http://www.mozilla.org/projects/intl/index.html">Internationalisation Projects</a>.</p>
-      <dl>
-        <dt>
-          bidi</dt>
-        <dd>
-          Obsolete.</dd>
-        <dt>
-          chardet</dt>
-        <dd>
-          Code for "sniffing" the character encoding of Web pages.</dd>
-        <dt>
-          ctl</dt>
-        <dd>
-          Code for dealing with Complex Text Layout, related to shaping of south Asian languages (not built by default, needs <code>--enable-ctl</code>).</dd>
-        <dt>
-          locale</dt>
-        <dd>
-          Code related to determination of locale information from the operating environment.</dd>
-        <dt>
-          lwbrk</dt>
-        <dd>
-          Code related to line breaking and word breaking.</dd>
-        <dt>
-          strres</dt>
-        <dd>
-          Code related to string resources used for localization.</dd>
-        <dt>
-          uconv</dt>
-        <dd>
-          Code that converts (both ways: encoders and decoders) between UTF-16 and many other character encodings.</dd>
-        <dt>
-          unicharutil</dt>
-        <dd>
-          Code related to implementation of various algorithms for Unicode text, such as case conversion.</dd>
-      </dl>
-    </div>
-    <div id="section_58">
-      <h2 id="ipc"><span>ipc</span></h2>
-      <div class="editIcon">
-        <h2 id="sect31"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=58"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Container for implementations of IPC (Inter-Process Communication) mechanisms.</p>
-    </div>
-    <div id="section_59">
-      <h2 id="ipcipcd"><span>ipc/ipcd</span></h2>
-      <div class="editIcon">
-        <h2 id="sect32"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=59"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>The IPC daemon that is used for communication between several mozilla processes to support profile sharing. (Note that at the time of this writing (Dec 2005), profile sharing is not supported by mozilla).</p>
-    </div>
-    <div id="section_60">
-      <h2 id="jpeg"><span>jpeg</span></h2>
-      <div class="editIcon">
-        <h2 id="sect33"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=60"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Source code of libjpeg, used by the mozilla image library.</p>
-    </div>
-    <div id="section_61">
-      <h2 id="jssrc"><span>js/src</span></h2>
-      <div class="editIcon">
-        <h2 id="sect34"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=61"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>The JavaScript engine, also known as <a class="link-https" href="https://wiki.mozilla.org/JavaScript" rel="external" title="https://wiki.mozilla.org/JavaScript">SpiderMonkey</a>. See also <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>.</p>
-    </div>
-    <div id="section_62">
-      <h2 id="jsjsd"><span>js/jsd</span></h2>
-      <div class="editIcon">
-        <h2 id="sect35"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=62"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>JavaScript debugging library. See <a class="external" href="http://www.mozilla.org/js/jsd/" rel="external" title="http://www.mozilla.org/js/jsd/">JavaScript Debugging</a>.</p>
-    </div>
-    <div id="section_63">
-      <h2 id="jssrcxpconnect"><span>js/src/xpconnect</span></h2>
-      <div class="editIcon">
-        <h2 id="sect36"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=63"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Support code for calling JavaScript code from C++ code and C++ code from JavaScript code, using XPCOM interfaces. See <a href="/en-US/docs/XPConnect" title="XPConnect">XPConnect</a>].</p>
-    </div>
-    <div id="section_64">
-      <h2 id="jssrcliveconnect"><span>js/src/liveconnect</span></h2>
-      <div class="editIcon">
-        <h2 id="sect37"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=64"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Liveconnect, the bridge between JavaScript and Java. See <a href="/en-US/docs/JavaScript/Guide/LiveConnect_Overview" title="JavaScript/Guide/LiveConnect_Overview">LiveConnect Overview</a>.</p>
-    </div>
-    <div id="section_65">
-      <h2 id="l10n"><span>l10n</span></h2>
-      <div class="editIcon">
-        <h2 id="sect38"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=65"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Basically empty and not used by the mozilla build.</p>
-    </div>
-    <div id="section_66">
-      <h2 id="layout"><span>layout</span></h2>
-      <div class="editIcon">
-        <h2 id="sect39"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=66"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Code that implements a tree of rendering objects that describe the types and locations of the objects that are displayed on the screen (such as CSS boxes, tables, form controls, XUL boxes, etc.), and code that manages operations over that rendering tree (such as creating and destroying it, doing layout, painting, and event handling). See <a class="external" href="http://www.mozilla.org/newlayout/doc/" rel="external" title="http://www.mozilla.org/newlayout/doc/">documentation</a> and <a class="external" href="http://www.mozilla.org/newlayout/" rel="external" title="http://www.mozilla.org/newlayout/">other information</a>.</p>
-      <dl>
-        <dt>
-          base</dt>
-        <dd>
-          Code that deals with the rendering tree.</dd>
-        <dt>
-          generic</dt>
-        <dd>
-          The basic rendering object interface and the rendering tree objects for basic CSS boxes.</dd>
-        <dt>
-          forms</dt>
-        <dd>
-          Rendering tree objects for HTML form controls.</dd>
-        <dt>
-          tables</dt>
-        <dd>
-          Rendering tree objects for CSS/HTML tables</dd>
-        <dt>
-          mathml</dt>
-        <dd>
-          Rendering tree objects for <a href="/en-US/docs/MathML" title="MathML">MathML</a>.</dd>
-        <dt>
-          svg</dt>
-        <dd>
-          Rendering tree objects for <a href="/en-US/docs/SVG" title="SVG">SVG</a>.</dd>
-        <dt>
-          xul</dt>
-        <dd>
-          Additional rendering object interfaces for <a href="/en-US/docs/XUL" title="XUL">XUL</a> and the rendering tree objects for XUL boxes.</dd>
-      </dl>
-    </div>
-    <div id="section_67">
-      <h2 id="lib"><span>lib</span></h2>
-      <div class="editIcon">
-        <h2 id="sect40"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=67"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Mostly unused; might be used on mac?</p>
-    </div>
-    <div id="section_68">
-      <h2 id="mail"><span>mail</span></h2>
-      <div class="editIcon">
-        <h2 id="sect41"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=68"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Thunderbird frontend files. Note that many thunderbird files are shared with Mozilla Mailnews and can be found under <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#mailnews">mailnews</a>/.</p>
-    </div>
-    <div id="section_69">
-      <h2 id="mailnews"><span>mailnews</span></h2>
-      <div class="editIcon">
-        <h2 id="sect42"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=69"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>The mail and news backend code (e.g. code that manages folders, manages databases, or interacts with mail servers) and the frontend code for the SeaMonkey mail client, some of which is shared by Thunderbird.</p>
-    </div>
-    <div id="section_70">
-      <h2 id="moduleslibimg"><span>modules/libimg</span></h2>
-      <div class="editIcon">
-        <h2 id="sect43"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=70"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Contains libpng, used by the image library for PNG Image decoding.</p>
-    </div>
-    <div id="section_71">
-      <h2 id="moduleslibjar"><span>modules/libjar</span></h2>
-      <div class="editIcon">
-        <h2 id="sect44"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=71"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Code to read zip files, used for reading the .jar files that contain the files for the mozilla frontend.</p>
-    </div>
-    <div id="section_72">
-      <h2 id="moduleslibpref"><span>modules/libpref</span></h2>
-      <div class="editIcon">
-        <h2 id="sect45"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=72"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Library for reading and writing preferences.</p>
-    </div>
-    <div id="section_73">
-      <h2 id="moduleslibreg"><span>modules/libreg</span></h2>
-      <div class="editIcon">
-        <h2 id="sect46"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=73"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Library for reading the netscape binary registry files, used for the <code>~/.mozilla/appreg</code> file (<code>registry.dat</code> on windows).</p>
-    </div>
-    <div id="section_74">
-      <h2 id="modulesoji"><span>modules/oji</span></h2>
-      <div class="editIcon">
-        <h2 id="sect47"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=74"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Support for the Java plugin (a bridge for plugging-in generic Java VMs). See <a class="external" href="http://www.mozilla.org/oji/" rel="external" title="http://www.mozilla.org/oji/">Open JVM Integration (OJI)</a>.</p>
-      <p><em>Note: OJI may be removed from Mozilla 2.0 according to <a class="external" href="http://boomswaggerboom.wordpress.com/2007/04/16/javaplugin-cleanup-for-mozilla-20/" rel="external" title="http://boomswaggerboom.wordpress.com/2007/04/16/javaplugin-cleanup-for-mozilla-20/">this post by Josh</a>.</em></p>
-    </div>
-    <div id="section_75">
-      <h2 id="modulesplugin"><span>modules/plugin</span></h2>
-      <div class="editIcon">
-        <h2 id="sect48"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=75"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Plugin support. Implements the Netscape Plugin API (NPAPI). See <a href="/en-US/docs/Plugins" title="Plugins">Plugins</a>.</p>
-    </div>
-    <div id="section_76">
-      <h2 id="modulesstaticmod"><span>modules/staticmod</span></h2>
-      <div class="editIcon">
-        <h2 id="sect49"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=76"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Helper files for static mozilla builds.</p>
-    </div>
-    <div id="section_77">
-      <h2 id="moduleszlib"><span>modules/zlib</span></h2>
-      <div class="editIcon">
-        <h2 id="sect50"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=77"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Source code of zlib, used at least in the networking library for compressed transfers.</p>
-    </div>
-    <div id="section_78">
-      <h2 id="netwerk"><span>netwerk</span></h2>
-      <div class="editIcon">
-        <h2 id="sect51"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=78"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p><a href="/en-US/docs/Necko" title="Necko">Networking library</a>, also known as Necko. Responsible for doing actual transfers from and to servers, as well as for URI handling and related stuff. See also <a class="external" href="http://www.mozilla.org/projects/netlib/" rel="external" title="http://www.mozilla.org/projects/netlib/">Network library documentation</a>.</p>
-    </div>
-    <div id="section_79">
-      <h2 id="nsprpub"><span>nsprpub</span></h2>
-      <div class="editIcon">
-        <h2 id="sect52"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=79"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Netscape Portable Runtime. Used as an abstraction layer to things like threads, file I/O and socket I/O. See <a class="external" href="http://www.mozilla.org/projects/nspr/" rel="external" title="http://www.mozilla.org/projects/nspr/">Netscape Portable Runtime</a>.</p>
-    </div>
-    <div id="section_80">
-      <h2 id="other-licenses"><span>other-licenses</span></h2>
-      <div class="editIcon">
-        <h2 id="sect53"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=80"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Contains libraries that are not covered by the MPL but used in some mozilla code.</p>
-    </div>
-    <div id="section_81">
-      <h2 id="parserexpat"><span>parser/expat</span></h2>
-      <div class="editIcon">
-        <h2 id="sect54"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=81"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Copy of the expat source code, which is the XML parser used by mozilla.</p>
-    </div>
-    <div id="section_82">
-      <h2 id="parserhtmlparser"><span>parser/htmlparser</span></h2>
-      <div class="editIcon">
-        <h2 id="sect55"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=82"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Contains the html parser used by Mozilla, which parses HTML source code and calls the appropriate methods on a content sink.</p>
-    </div>
-    <div id="section_83">
-      <h2 id="profile"><span>profile</span></h2>
-      <div class="editIcon">
-        <h2 id="sect56"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=83"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Code for profile handling, the profile manager backend and frontend.</p>
-    </div>
-    <div id="section_84">
-      <h2 id="rdf"><span>rdf</span></h2>
-      <div class="editIcon">
-        <h2 id="sect57"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=84"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>RDF handling APIs. See <a href="/en-US/docs/RDF" title="RDF">RDF</a> and <a class="external" href="http://www.mozilla.org/rdf/doc/" rel="external" title="http://www.mozilla.org/rdf/doc/">RDF</a>.</p>
-      <p>Also contains the chrome registry code used by SeaMonkey, although toolkit apps (such as Firefox and Thunderbird) use the copy forked into <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#chrome">chrome</a>.</p>
-    </div>
-    <div id="section_85">
-      <h2 id="security"><span>security</span></h2>
-      <div class="editIcon">
-        <h2 id="sect58"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=85"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Contains NSS and PSM, to support cryptographic functions in mozilla (like S/MIME, SSL, etc). See <a class="external" href="http://www.mozilla.org/projects/security/pki/nss/" rel="external" title="http://www.mozilla.org/projects/security/pki/nss/">Network Security Services (NSS)</a> and <a class="external" href="http://www.mozilla.org/projects/security/pki/psm/" rel="external" title="http://www.mozilla.org/projects/security/pki/psm/">Personal Security Manager (PSM)</a>.</p>
-    </div>
-    <div id="section_86">
-      <h2 id="storage"><span>storage</span></h2>
-      <div class="editIcon">
-        <h2 id="sect59"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=86"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p><a href="/en-US/docs/Storage" title="Storage">Storage</a>: XPCOM wrapper for sqlite. Wants to unify storage of all profile-related data. Supersedes mork. See also <a class="external" href="http://wiki.mozilla.org/Mozilla2:Unified_Storage" rel="external" title="http://wiki.mozilla.org/Mozilla2:Unified_Storage">Unified Storage</a>.</p>
-    </div>
-    <div id="section_87">
-      <h2 id="suite"><span>suite</span></h2>
-      <div class="editIcon">
-        <h2 id="sect60"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=87"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Newer parts of SeaMonkey-specific code. Older parts live in <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#xpfe">xpfe</a>/.</p>
-    </div>
-    <div id="section_88">
-      <h2 id="themes"><span>themes</span></h2>
-      <div class="editIcon">
-        <h2 id="sect61"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=88"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Contains the themes shipped with SeaMonkey. Classic and Modern at the time of this writing.</p>
-    </div>
-    <div id="section_89">
-      <h2 id="toolkit"><span>toolkit</span></h2>
-      <div class="editIcon">
-        <h2 id="sect62"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=89"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>The "new toolkit" used by Thunderbird, Firefox, etc. This contains numerous front-end components shared between applications as well as most of the XBL-implemented parts of the XUL language (most of which was originally forked from versions in <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#xpfe">xpfe</a>/).</p>
-    </div>
-    <div id="section_90">
-      <h2 id="tools"><span>tools</span></h2>
-      <div class="editIcon">
-        <h2 id="sect63"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=90"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Some tools which are optionally built during the mozilla build process, mostly used for debugging.</p>
-    </div>
-    <div id="section_91">
-      <h2 id="uriloaderbase"><span>uriloader/base</span></h2>
-      <div class="editIcon">
-        <h2 id="sect64"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=91"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Content dispatch in Mozilla. Used to load uris and find an appropriate content listener for the data. Also manages web progress notifications. See <a class="external" href="http://www.mozilla.org/docs/docshell/uri-load-start.html" rel="external" title="http://www.mozilla.org/docs/docshell/uri-load-start.html">Document Loading: From Load Start to Finding a Handler</a> and <a class="external" href="http://www.mozilla.org/docs/url_load.html" rel="external" title="http://www.mozilla.org/docs/url_load.html">The Life Of An HTML HTTP Request</a>.</p>
-    </div>
-    <div id="section_92">
-      <h2 id="uriloaderexthandler"><span>uriloader/exthandler</span></h2>
-      <div class="editIcon">
-        <h2 id="sect65"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=92"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Used to handle content that Mozilla can't handle itself. Responsible for showing the helper app dialog, and generally for finding information about helper applications.</p>
-    </div>
-    <div id="section_93">
-      <h2 id="uriloaderprefetch"><span>uriloader/prefetch</span></h2>
-      <div class="editIcon">
-        <h2 id="sect66"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=93"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>Service to prefetch documents in order to have them cached for faster loading.</p>
-    </div>
-    <div id="section_94">
-      <h2 id="view"><span>view</span></h2>
-      <div class="editIcon">
-        <h2 id="sect67"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=94"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>View manager. Contains cross-platform code used for painting, scrolling, event handling, z-ordering, and opacity. Soon to become obsolete, gradually.</p>
-    </div>
-    <div id="section_95">
-      <h2 id="widget"><span>widget</span></h2>
-      <div class="editIcon">
-        <h2 id="sect68"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=95"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>A cross-platform API, with implementations on each platform, for dealing with operating system/environment widgets, i.e., code related to creation and handling of windows, popups, and other native widgets and to converting the system's messages related to painting and events into the messages used by other parts of Mozilla (e.g. <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#view">view</a>/ and <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#content">content</a>/, the latter of which converts many of the messages to yet another API, the DOM event API).</p>
-    </div>
-    <div id="section_96">
-      <h2 id="xpcom"><span>xpcom</span></h2>
-      <div class="editIcon">
-        <h2 id="sect69"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=96"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p><a href="/en-US/docs/XPCOM" title="XPCOM">Cross-Platform Component Object Model</a>. Also contains data structures used by the rest of the mozilla code. See also <a class="external" href="http://www.mozilla.org/projects/xpcom/" rel="external" title="http://www.mozilla.org/projects/xpcom/">XPCOM Project</a>.</p>
-    </div>
-    <div id="section_97">
-      <h2 id="xpfe"><span>xpfe</span></h2>
-      <div class="editIcon">
-        <h2 id="sect70"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=97"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>XPFE is the SeaMonkey frontend. It contains the XUL files for the browser interface, common files used by the other parts of the mozilla suite, and the XBL files for the parts of the XUL language that are implemented in XBL. Much of this code has been copied to <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#browser">browser</a>/ and <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#toolkit">toolkit</a>/ for use in Firefox, Thunderbird, etc.</p>
-      <div id="section_98">
-        <h3 id="xpfecomponents"><span>xpfe/components</span></h3>
-        <div class="editIcon">
-          <h3 id="sect71"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=98"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Components used by the Mozilla frontend, as well as implementations of interfaces that other parts of mozilla expect.</p>
-      </div>
-      <div id="section_99">
-        <h3 id="xpfebootstrap"><span>xpfe/bootstrap</span></h3>
-        <div class="editIcon">
-          <h3 id="sect72"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=99"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
-        </div>
-        <p>Startup code for Mozilla. This contains the main/WinMain function. (Not used by "new toolkit" apps; for those, see <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#toolkit">toolkit</a>/xre and the "app" directory for each specific app).</p>
-      </div>
-    </div>
-    <div id="section_100">
-      <h2 id="xpinstall"><span>xpinstall</span></h2>
-      <div class="editIcon" style="">
-        <h2 id="sect73"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=100"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
-      </div>
-      <p>The installer, which contains code for installing Mozilla and for installing XPIs/extensions. This directory also contains code needed to build installer packages. See <a href="/en-US/docs/XPInstall" title="XPInstall">XPInstall</a> and the <a class="external" href="http://www.mozilla.org/projects/xpinstall/" rel="external" title="http://www.mozilla.org/projects/xpinstall/">XPInstall project page</a>.</p>
-    </div>
-  </div>
-</div>
diff --git a/files/es/etiquetas_audio_y_video_en_firefox/index.html b/files/es/etiquetas_audio_y_video_en_firefox/index.html
deleted file mode 100644
index b89a3a028e..0000000000
--- a/files/es/etiquetas_audio_y_video_en_firefox/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Etiquetas audio y video en Firefox
-slug: Etiquetas_audio_y_video_en_Firefox
----
-<p>{{ gecko_minversion_header("1.9.1") }}</p>
-<p>En Firefox 3.5 se ha incorporado la posibilidad de usar las etiquetas para los elementos  <a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a> y <a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a>, agregados a las especificaciones de HTML 5, lo que permite insertar  fácilmente archivos de audio o video en los documentos HTML.  Actualmente sólo pueden usarse los formatos Ogg y WAV, pero se espera agregar la posibilidad de usar otros formatos en el futuro.</p>
-<h2 id="Insertar_medios">Insertar medios</h2>
-<p>Insertar medios en su documento HTML es sencillo:</p>
-<pre class="brush: html">&lt;video src="http://v2v.cc/~j/theora_testsuite/320x240.ogg" autoplay&gt;
-  Your browser does not support the &lt;code&gt;video&lt;/code&gt; element.
-&lt;/video&gt;
-</pre>
-<p>Este ejemplo reproduce un video del sitio web de Theora.</p>
-<p>Se pueden agregar múltiples archivos usando el elemento <a class="internal" href="/En/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> para especificar diferentes archivos con diferentes formatos para distintos navegadores. Por ejemplo:</p>
-<pre class="brush: html">&lt;video autoplay&gt;
-  &lt;source src="foo.ogg" type="video/ogg"&gt;
-  &lt;source src="foo.mov"&gt;
-  Your browser does not support the &lt;code&gt;video&lt;/code&gt; element.
-&lt;/video&gt;
-</pre>
-<p>ejecutará el archivo OGG en los navegadores que puedan reproducir ese formato. Si el navegador no puede reproducir ese formato, intentará usar el archivo MOV.</p>
-<div class="note"><strong>Nota: </strong>El elemento source todavía no es completamente funcional en Firefox. Mire el {{ bug(449363) }} para más detalles.</div>
-<h2 id="Controlar_la_reproducción_de_los_archivos">Controlar la reproducción de los archivos</h2>
-<p>Una vez que haya insertado el archivo en el documento HTML usando los nuevos elementos, puede controlarlos usando JavaScript. Por ejemplo, para empezar (o reiniciar) la reproducción, puede hacer esto::</p>
-<pre class="brush: js">var v = document.getElementsByTagName("video")[0];
-v.play();
-</pre>
-<p>La primera línea localiza el elemento en el documento y la segunda usa el método <a class="external" href="/En/NsIDOMHTMLMediaElement#play()" title="https://developer.mozilla.org/editor/fckeditor/core/editor/En/NsIDOMHTMLMediaElement#play()"><code>play()</code></a> del mismo, como está definido en la interface {{ interface("nsIDOMHTMLMediaElement") }} que se usa para implementar los elementos de medios.</p>
-<h2 id="Eventos_en_medios">Eventos en medios</h2>
-<p>Muchos eventos son enviados cuando se manejan medios:</p>
-<table class="standard-table"> <tbody> <tr> <td class="header">Nombre del evento</td> <td class="header">Descripción</td> </tr> <tr> <td><code>abort</code></td> <td>Se envía cuando se aborta la reproducción, por ejemplo, cuando el archivo se está reproduciendo y es reiniciado, se envía este evento.</td> </tr> <tr> <td><code>canplay</code></td> <td>Se envía cuando ya está disponible la suficiente cantidad del archivo para que pueda reproducirse, por lo menos por unos cuantos cuadros. Se corresponde con <code>CAN_PLAY</code> <code>readyState</code>.</td> </tr> <tr> <td><code>canplaythrough</code></td> <td>Se envía cuando el estado cambia a <code>CAN_PLAY_THROUGH</code>, lo que indica que puede reproducirse completamente el archivo sin interrupciones, asumiendo que la tasa de descaraga se mantendrá en el nivel actual.</td> </tr> <tr> <td><code>canshowcurrentframe</code></td> <td>El cuadro actual fue cargado y puede mostrarse. Este se corresponde a <code>CAN_SHOW_CURRENT_FRAME</code> <code>readyState</code>.</td> </tr> <tr> <td><code>dataunavailable</code></td> <td>Se envía cuando el estado cambia a <code>DATA_UNAVAILABLE</code>.</td> </tr> <tr> <td><code>durationchange</code></td> <td>Los metadatos fueron cargados o han cambiado, lo que indica un cambio en la duración del archivo. Esto se envía, por ejemplo, cuando se ha cargado tanto del archivo que se conoce la duración total del mismo.</td> </tr> <tr> <td><code>emptied</code></td> <td>El  archivo se ha vaciado. Por ejemplo, este evento se envía si el archivo había sido cargado (o parcialmente cargado), y se llamó al método <a class="internal" href="/En/nsIDOMMediaHTMLElement#load()" title="En/nsIDOMMediaHTMLElement#load()"><code>load()</code></a> para recargarlo.</td> </tr> <tr> <td><code>empty</code></td> <td>Se envía cuando hay un error y el archivo está vacío.</td> </tr> <tr> <td><code>ended</code></td> <td>Se envía cuando se termina la reproducción.</td> </tr> <tr> <td><code>error</code></td> <td>Se envía cuando hay un error. El atributo <code>error</code> del elemento contiene más información.</td> </tr> <tr> <td><code>load</code></td> <td>El archivo se descargó completamente.</td> </tr> <tr> <td><code>loadedfirstframe</code></td> <td>El primer cuadro del archivo se terminó de descargar.</td> </tr> <tr> <td><code>loadedmetadata</code></td> <td>Los metadatos del archivo se terminaron de descargar, todos los atributos contienen la mayor cantidad de información posible.</td> </tr> <tr> <td><code>loadstart</code></td> <td>Se envía cuando comienza la carga del archivo.</td> </tr> <tr> <td><code>pause</code></td> <td>Se envia cuando se pone en pausa la reproducción.</td> </tr> <tr> <td><code>play</code></td> <td>Se envía cuando se comienza la reproducción o cuando se reinicia.</td> </tr> <tr> <td><code>ratechange</code></td> <td>Se envía cuando cambia la velocidad de reproducción.</td> </tr> <tr> <td><code>seeked</code></td> <td>Se envía cuando se completa la operación de búsqueda.</td> </tr> <tr> <td><code>seeking</code></td> <td>Se envía cuando comienza la operación de búsqueda.</td> </tr> <tr> <td><code>timeupdate</code></td> <td>El tiempo indicado por el atributo <code>currentTime</code> del elemento cambió.</td> </tr> <tr> <td><code>volumechange</code></td> <td>Se envía al cambiar el volumen del audio (cuando el volumen es elegido y cuando cambia el atributo <code>muted</code>).</td> </tr> <tr> <td><code>waiting</code></td> <td>Se envía cuando la operación solicitada (como la reproducción) se retrasa porque espera que se complete otra operación (como una búsqueda).</td> </tr> </tbody>
-</table>
-<p>Fácilmente puede vigilar estos eventos, si usa un código parecido al siguiente:</p>
-<pre>var v = document.getElementsByTagName("video")[0];
-
-v.addEventListener("seeked", function() { document.getElementsByTagName("video")[0].play(); }, true);
-v.currentTime = 10.0;
-</pre>
-<p>Este ejemplo obtiene el primer elemento de video del documento y le adhiere un event listenert, esperando por el evento seeked, que se envía cuando termino una operación de búsqueda.  El listener simplemente ejecuta el método <code>play()</code> del elemento, que comenzará la reproducción.</p>
-<p>En la línea 4, se configura el atributo <code>currentTime</code> a 10.0, que inicia una operación de busqueda a la marca de los 10 segundos en el archivo.  Esto genera que se envíe un evento <code>seeking</code> cuando comienza la operación, después un evento <code>seeked</code> se enviara cuando la búsqueda se haya completado.</p>
-<p>En otras palabras, en este ejemplo se busca la marca de los 10 segundos en el archivo, y luego comienza la reproducción.</p>
-<h2 id="Vea_también">Vea también</h2>
-<ul> <li><a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a></li> <li><a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a></li> <li><a class="internal" href="/En/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> </li> <li><a class="internal" href="/En/Manipulating_video_using_canvas" title="En/Manipulating video using canvas">Manipulating video using canvas</a></li> <li>{{ interface("nsIDOMHTMLMediaElement") }}</li>
-</ul>
-<p> {{ languages( { "en": "en/Using_audio_and_video_in_Firefox" } ) }}</p>
-<p> {{ languages( { "fr": "fr/Utilisation_d'audio_et_video_dans_Firefox" } ) }}</p>
diff --git a/files/es/extensiones/actualización_de_extensiones_para_firefox_4/index.html b/files/es/extensiones/actualización_de_extensiones_para_firefox_4/index.html
deleted file mode 100644
index cdc9521967..0000000000
--- a/files/es/extensiones/actualización_de_extensiones_para_firefox_4/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title: Actualización de extensiones para Firefox 4
-slug: Extensiones/Actualización_de_extensiones_para_Firefox_4
-tags:
-  - Agregados
-  - Complementos
-  - Firefox 4
-  - Gecko 2.0
-  - extensiones
-  - para_revisar
----
-<p>{{ fx_minversion_header(4) }}</p>
-<p>Este artículo ofrece detalles sobre aquellos cambios en Firefox 4 que pueden afectar a las extensiones existentes.</p>
-<h2 id="Cambios_en_XPCOM">Cambios en XPCOM</h2>
-<p>Se han llevado a cabo una serie de cambios que afectan a los complementos/agregados y las aplicaciones que incluyen componentes XPCOM. Consulta <a href="/es/XPCOM/Cambios_XPCOM_en_Gecko_2.0" title="https://developer.mozilla.org/es/XPCOM/Cambios_XPCOM_en_Gecko_2.0">los cambios de XPCOM en Gecko 2</a> para obtener más detalles.</p>
-<h2 id="Desempaquetado_de_XPI">Desempaquetado de XPI</h2>
-<p>Firefox 4 <a class=" link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=533038" title="https://bugzilla.mozilla.org/show_bug.cgi?id=533038">ya no extrae XPIs</a> al instalar complementos/agregados. Simplemente coloca el archivo XPI en el perfil del usuario y a continuación lee los archivos chrome y otro tipos de archivos directamente del XPI. Todavía funciona un jar en el XPI, aunque haya dejado de ser necesario, para facilitarte el proceso de desarrollo o compilación. Se ha hecho así principalmente por razones de rendimiento en los SO lentos a la vez que permite mejorar la invalidación de la caché, lo cual también ayuda a los desarrolladores. Sin embargo, no todos los tipos de archivos pueden leerse ya desde el XPI, por lo tanto si tu complemento/agregado usa uno de ellos, tienes que especificar <span class="nowiki"><a title="https://developer.mozilla.org/en/Install_Manifests#unpack"><code>&lt;em:unpack&gt;</code></a></span>  en tu install.rdf para hacer que Firefox continúe extrayendo tu XPI y usando archivos solos. De lo contrario, tu complemento/agregado fallará al intentar tener acceso a estos archivos.</p>
-<p>Si tu complemento/agregado sólo contiene estos tipos de archivos, no es necesario que realices ningún cambio::</p>
-<ul> <li><code>install.rdf</code></li> <li><code>chrome.manifest</code></li> <li><code>chrome</code> (incluyendo <code>content</code>, <code>locale</code>, <code>skin</code>)</li> <li>preferencias predeterminadas</li> <li>componentes XPCOM escritos en JavaScript</li>
-</ul>
-<p>Si tu complemento/agregado contiene alguno de los siguientes tipos de archivos, tendrás que incluir <code><code>&lt;em:unpack&gt;</code></code> en el install.rdf:</p>
-<ul> <li>componentes binarios XPCOM</li> <li>DLLs cargadas con CTypes</li> <li><code>searchplugins/</code> (que deben ser cargadas automáticamente por Firefox)</li> <li><code>dictionaries/</code></li> <li>Iconos de ventana (podrían <a class=" link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=595462" title="https://bugzilla.mozilla.org/show_bug.cgi?id=595462">solucionarse</a>)</li>
-</ul>
-<p>Si el código de tu complemento/agregado tiene acceso a otros archivos que has empaquetado en el XPI, entonces tendrás que incluir <code> </code><code>&lt;em:unpack&gt;</code> en el install.rdf o bien tendrás que realizar algunos cambios en tu código para poder admitir una instalación empaquetada. Cualquier código que usara getInstallLocation() y nsIFile tendrá que incluir em:unpack o modificarse. Puedes usar el método <code><a href="/en/Addons/Add-on_Manager/Addon#getResourceURI%28%29" title="https://developer.mozilla.org/en/Addons/Add-on_Manager/Addon#getResourceURI()">Addon.getResourceURI()</a></code>, devolverá un {{ interface("nsIURI") }} que apunta al archivo solicitado. Si la extensión o el agregado está sin empaquetar, entonces será un <code><span class="nowiki">file://</span></code> URI. Si la extensión o el agregado está empaquetada/o, será un <span class="nowiki"><code>jar://</code></span> URI. Puedes abrir secuencias para estas URI abriendo un canal mediante {{ interface("nsIIOService") }} que te permitirá descargar los contenidos de los archivos sin que haya que desempaquetar.</p>
-<h2 id="Se_han_eliminado_los_HWND_secundarios">Se han eliminado los HWND secundarios</h2>
-<p>Afectará a un número muy reducido de desarrolladores. En las versiones anteriores de Firefox, los <code>HWND</code> se creaban en Windows para uso interno. Como parte del trabajo destinado a la mejora del rendimiento de gráficos, éstos ya no se crean.</p>
-<p>Lamentablemente, las pocas extensiones que han tenido acceso y han manipulado directamente estos <code>HWND</code> no funcionarán en Firefox 4. Hemos colocado algunos parches para ayudar a los drivers de determinados dispositivos señaladores y al software de tecnología de ayuda (lectores de pantalla, por ejemplo). Sin embargo, hemos optado por no añadir más parches para admitir extensiones, que desde el principio no deberían haberlo hecho.</p>
-<p>Si mantienes una extensión que usa componentes nativos que dependen de unos <code>HWND</code> que ya no existen, tendrás que actualizar tu extensión. Existen dos formas de hacer esto.</p>
-<p>La primera, y la mejor, solución es dejar de acceder a los <code>HWND</code> y en su lugar usar características Web o XUL para implementar tus extensiones. Existen muchas características nuevas en Firefox 4 que posibilitan muchas cosas que requerían código nativo, por lo tanto ya no tendrás que hacerlo.</p>
-<p>Si ves que no funciona y sigues teniendo que acceder directamente a los <code>HWND</code>s, tal vez tu única solución sea escribir un plugin <a href="/en/NPAPI" title="en/NPAPI">NPAPI</a> para que haga el trabajo. Puede suponer mucho trabajo pero debería funcionar. Por supuesto, no te servirá si los <code>HWND</code> específicos que usabas ya no existen.</p>
-<p>{{ languages( { "en": "en/Extensions/Updating_extensions_for_Firefox_4" } ) }}</p>
diff --git a/files/es/faq_incrustando_mozilla/index.html b/files/es/faq_incrustando_mozilla/index.html
deleted file mode 100644
index 28f70b65ee..0000000000
--- a/files/es/faq_incrustando_mozilla/index.html
+++ /dev/null
@@ -1,70 +0,0 @@
----
-title: FAQ Incrustando Mozilla
-slug: FAQ_Incrustando_Mozilla
-tags:
-  - Incrustando_Mozilla
-  - Preguntas_frecuentes_sobre_incrustación_en_Mozilla
-  - Todas_las_Categorías
----
-<p>Esta página es una recopilación de preguntas frecuentes sobre <a href="es/Incrustrando_Mozilla"> Incrustrando Mozilla </a>.
-</p><p>Lista de correo (en inglés): <a class="external" href="http://www.mozilla.org/community/developer-forums.html#mozilla-embedding">mozilla-embedding@mozilla.org</a>
-</p>
-<ol><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n">Introducción a Gecko e inscrustación</a>
-<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_Gecko.3F"> ¿Qué es Gecko?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_Mozilla.3F"> ¿Qué es Mozilla?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_el_GRE.3F"> ¿Qué es el GRE?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_XPCOM.3F"> ¿Qué es XPCOM?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_significa_.22incrustar.22_Gecko.3F"> ¿Qué significa "incrustar" Gecko?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Cuales_son_los_t.C3.A9rminos_de_licencia_para_incrustar_Gecko.3F"> ¿Cuales son los términos de licencia para incrustar Gecko?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Hay_disponible_un_SDK_.3F"> ¿Hay disponible un SDK?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Cu.C3.A1l_es_la_.C3.BAltima_versi.C3.B3n.3F_Que_versi.C3.B3n_deber.C3.ADa_usar.3F"> ¿Cuál es la última versión? ¿Que versión debería usar?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Qui.C3.A9n_esta_usando_Gecko_actualmente.3F"> ¿Quién está usando Gecko actualmente?</a>
-</li></ol>
-</li><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko"> Incrustando Gecko</a>
-<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Qu.C3.A9_archivos_necesito_para_poder_incrustar_.3F"> ¿Qué archivos necesito para poder incrustar?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#C.C3.B3mo_se_lleva_a_cabo_la_distribuci.C3.B3n_de_la_incrustaci.C3.B3n.3F"> ¿Cómo se lleva a cabo a la distribución de la incrustación?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Por_qu.C3.A9_necesito_incluir_archivos_XPT_en_mi_aplicaci.C3.B3n3F"> ¿Por qué necesito incluir archivos XPT en mi aplicación?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#C.C3.B3mo_me_mantengo_al_tanto_con_los_cambios_en_la_interfaz_de_Gecko_.3F"> ¿Cómo me mantengo al tanto con los cambios en la interfaz de Gecko?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Esto_significa_que_mi_compilaci.C3.B3n_ser.C3.A1_compatible_con_todas_las_versiones_futuras_de_GRE_.2F_Gecko_.2F_Mozilla.3F"> ¿Esto significa que mi compilación será compatible con todas las versiones futuras de GRE/Gecko/Mozilla?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Qu.C3.A9_plataformas_son_soportadas_.3F"> ¿Qué plataformas son soportadas?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Admite_la_versi.C3.B3n_incrustada_protocolos_seguros_como_HTTPS.3F"> ¿Admite la versión incrustada protocolos seguros como HTTPS?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#C.C3.B3mo_se_comunica_mi_aplicaci.C3.B3n_con_Gecko.3F"> ¿Cómo se comunica mi aplicación con Gecko?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Puedo_incrustar_sin..."> ¿Puedo incrustar_sin ...</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Puedo_incrustar_el_editor_mozilla_de_HTML.3F"> Puedo incrustar el editor mozilla de HTML?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Qu.C3.A9_herramienta_de_creaci.C3.B3n_de_wigdets_emplea_Mozilla.3F"> ¿Qué herramienta de creación de wigdets emplea Mozilla?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Tiene_elmozilla_incrustado_soporte_para_Javat.3F"> Tiene el mozilla incrustado soporte para Java?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Puedo_incrustar_en_ozilla_de_alguna_otra_manera.3F"> ¿Puedo incrustar en mozilla de alguna otra manera?</a>
-</li></ol>
-</li><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago_...">Cómo hago ...</a>
-<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_incrusto_Gecko.3F"> ¿Cómo incrusto Gecko?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#Qu.C3.A9_es_un_servicio.3F"> ¿Qué es un servicio?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_cargo_una_p.C3.A1gina.3F"> ¿Cómo cargo una página?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_bloqueo_una_carga.3F"> ¿Cómo bloqueo una carga?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_vigilo_.2Finterrumpo_una_carga_antes_de_que_ocurra_.3F"> ¿Cómo vigilo/interrumpo una carga antes de que ocurra?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_copio_elementos_al_portapapeles.3F"> Cómo copio elementos al portapapeles?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_grabo_un_documento_o_dato_en_el_disco.3F"> ¿Cómo grabo un documento o dato en el disco?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_grabo_.2F_cuelgo_un_archivo_.2F_dato_a_un_sitio_web_o_un_servidor_ftp.3F"> ¿Cómo grabo/cuelgo un archivo/dato a un sitio web o un servidor ftp?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_s.C3.A9_cuando_una_grabaci.C3.B3n_ha_concluido_.2C_vigilo_el_progreso_etc..3F"> ¿Cómo sé cuando una grabación ha concluido, vigilo el progreso etc.?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_imprimo_una_p.C3.A1gina.3F"> ¿Cómo imprimo una página?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_creo_la_vista_preliminar_de_una_p.C3.A1gina.3F"> Cómo creo la vista preliminar de una página?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_consigo_que_los_elemento_semergentes_fucionen_.3F"> Cómo consigo que los elementos emergentes fucionen?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#Necesito_que_el_Javascript_dentro_de_la_ventana_del_navegador_se_comunique_con_mi_cliente_incrustado._C.C3.B3mo_lo_hago_.3F"> Necesito que el Javascript dentro de la ventana del navegador se comunique con mi cliente incrustado. Cómolohago?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezaco_otras_ubicaciones_para_archivos_como_components.reg.3F"> Cómo establezco otras ubicaciones para archivos como components.reg?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezaco_otras_ubicaciones_para_los_perfiles.3F"> ¿Cómo establezco otras ubicaciones para los perfiles?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_cambio_la_cadena_de_identificaci.C3.B3n.3F"> ¿Cómo cambio la cadena de identificación?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_muestro_mi_propio_mensaje.2C_alertas_y_ventanas_de_aviso.3F"> ¿Cómo muestro mi propio mensaje, alertas y ventanas de aviso?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_obtengo_el_archivo_DOM_del_objeto_navegador.3F"> ¿Cómo obtengo el archivo DOM del objeto navegador?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#Qu.C3.A9_es_el_docshell.3F"> ¿Qué es el docshell?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezco_menus_contextuales_.3F"> ¿Cómo establezco menus contextuales?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezco_los_tool_tips.3F"> ¿Cómo establezco los tool tips?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_hago_para_ver_tool_tips_para_nodos_con_attributos_ALT.3F"> ¿Cómo hago para ver tool tips para nodos con attributos ALT?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_hago_para_configurar_el_proxy_.3F"> ¿Cómo hago para configurar el proxy?</a>
-</li></ol>
-</li><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_Comunes">Problemas comunes</a>
-<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#TestGTKEmbed_no_funciona.21"> ¡El TestGTKEmbed no funciona!</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#C.C3.B3mo_compilo_MFCEmbed_.3F"> ¿Cómo compilo MFCEmbed?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#C.C3.B3mo_depuro_MFCEmbed.3F"> ¿Cómo depuro MFCEmbed?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#Por_qu.C3.A9_no_funciona_el_FTP.3F"> ¿Por qué no funciona el FTP?</a>
-</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#Por_qu.C3.A9_es_mi_compilaci.C3.B3n_tan_grande.3F.21"> ¿Por qué es mi compilación tan grande?</a>
-</li></ol>
-</li></ol>
diff --git a/files/es/firefox_1.5_para_desarrolladores/index.html b/files/es/firefox_1.5_para_desarrolladores/index.html
deleted file mode 100644
index 2372dd0f81..0000000000
--- a/files/es/firefox_1.5_para_desarrolladores/index.html
+++ /dev/null
@@ -1,164 +0,0 @@
----
-title: Firefox 1.5 para Desarrolladores
-slug: Firefox_1.5_para_Desarrolladores
-tags:
-  - CSS
-  - Complementos
-  - DOM
-  - Desarrollo_Web
-  - Estándares_Web
-  - HTML
-  - JavaScript
-  - RDF
-  - SVG
-  - Servicios_Web_XML
-  - Todas_las_Categorías
-  - XML
-  - XSLT
-  - XUL
-  - extensiones
-translation_of: Mozilla/Firefox/Releases/1.5
----
-<div>{{FirefoxSidebar}}</div><h3 id="Firefox_1.5" name="Firefox_1.5">Firefox 1.5</h3>
-
-<p>Se ha lanzado Firefox 1.5 y ya se puede descargar <strong><a class="external" href="http://www.mozilla.com/firefox/">descarga</a></strong>. Este programa esta basado en el motor de <a href="es/Gecko">Gecko</a> 1.8, esta nueva versión del navegador mejora su ya magnífico soporte a los estándares web y proporciona nuevas capacidades que hacen posible una nueva generación de aplicaciones web. Algunas de las nuevas características de Firefox 1.5 son: soporte de CSS2 y CSS3 mejorado, APIs para programar gráficos en 2D por medio de <code>&lt;canvas&gt;</code>, o gráficos vectoriales con <a href="es/SVG">SVG</a> 1.1, <a href="es/XForms">XForms</a> y eventos XML, así como muchas mejoras en DHTML, JavaScript y DOM.</p>
-
-<p><strong>Firefox 1.5</strong> ya puede descargarse en el siguiente link: - <a class="external" href="http://www.mozilla.com/firefox/" rel="freelink">http://www.mozilla.com/firefox/</a></p>
-
-<h3 id="Herramientas_para_desarrolladores" name="Herramientas_para_desarrolladores">Herramientas para desarrolladores</h3>
-
-<p>Firefox 1.5 dispone de diversas herramientas y extensiones de gran utilidad para los desarrolladores.</p>
-
-<ul>
- <li><a href="es/DOM_Inspector">DOM Inspector</a>, una herramienta que permite a los desarrolladores inspeccionar y modificar documentos sin tener que editar el documento directamente. DOM Inspector está disponible como una opción en la Instalación personalizada de Firefox 1.5 bajo Herramientas para desarrolladores.</li>
- <li>Consola JavaScript, una herramienta para escribir y testear código JavaScript a la vez que sirve para ver los errores JavaScript y de CSS en una página.</li>
- <li>Ver código fuente de la página, con sombreado de código y opciones de búsqueda.</li>
- <li><a class="link-https" href="https://addons.mozilla.org/extensions/showlist.php?application=firefox&amp;category=Developer%20Tools">Extensiones para el navegador</a> incluyendo <a href="es/Web_Developer_Firefox_Extension_(external)">Web Developer toolbar</a>, <a href="es/Live_HTTP_Headers_(external)">Live HTTP Headers</a>, <a href="es/HTML_Validator_(external)">HTML Validator</a> y muchas más.</li>
-</ul>
-
-<p><strong>Nota:</strong> Algunas extensiones no soportan actualmente Firefox 1.5, y serán automáticamente desactivadas.</p>
-
-<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
-
-<p>Algunas de las nuevas características en Firefox 1.5:</p>
-
-<h4 id="Desarrolladores_de_sitios_web_y_aplicaciones" name="Desarrolladores_de_sitios_web_y_aplicaciones">Desarrolladores de sitios web y aplicaciones</h4>
-
-<dl>
- <dt><a href="es/SVG_en_HTML_Introducci%c3%b3n">Introducción a SVG en HTML </a></dt>
- <dd>Aprenda cómo usar SVG en sus páginas XHTML y a manipular imágenes con JavaScript y CSS de forma similar a como haría un script para XHTML. Vea también <a href="es/SVG_en_Firefox_1.5">SVG en Firefox 1.5</a> para saber más sobre el estado y los problemas de la implementación de SVG en Firefox 1.5.</dd>
-</dl>
-
-<dl>
- <dt><a href="es/Dibujar_gr%c3%a1ficos_con_Canvas">Dibujar gráficos con Canvas</a> </dt>
- <dd>Aprenda acerca de la nueva etiqueta <code>&lt;canvas&gt;</code> y cómo dibujar gráficos y otros objetos en Firefox.</dd>
-</dl>
-
-<dl>
- <dt><a href="es/Columnas_con_CSS-3">Columnas con CSS-3</a> </dt>
- <dd>Aprenda sobre el soporte a la disposición automática de texto en multi-columnas según lo propuesto en CSS3.</dd>
-</dl>
-
-<dl>
- <dt><a href="es/El_cache_de_Firefox_1.5">El cache de Firefox 1.5</a> </dt>
- <dd>Aprenda acerca de <code>bfcache</code> y cómo aumenta la velocidad de la navegación en páginas ya visitadas.</dd>
-</dl>
-
-<h4 id="XUL_y_Desarrolladores_de_Extensi.C3.B3n" name="XUL_y_Desarrolladores_de_Extensi.C3.B3n">XUL y Desarrolladores de Extensión</h4>
-
-<dl>
- <dt><a href="es/Creando_una_extensi%c3%b3n">Creando una extensión</a> </dt>
- <dd>Este tutorial te llevará a través de los pasos necesarios para construir una extensión para Firefox muy básica. Ver también <a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">otro tutorial en la base de conocimiento MozillaZine</a>, el cual demuestra las nuevas características del Administrador de Extensión en 1.5, que hace la creación de una nueva extensión incluso mas fácil.</dd>
-</dl>
-
-<dl>
- <dt><a href="es/XPCNativeWrapper">XPCNativeWrapper</a> </dt>
- <dd><code>XPCNativeWrapper</code> es una forma de envolver un objeto cuyo <a href="es/Safely_accessing_content_DOM_from_chrome">acceso es seguro desde un código privilegiado</a>. Puede ser usado en todas las versiones de Firefox, a pesar que su funcionamiento ha cambiado con la versión 1.5 (Gecko 1.8).</dd>
-</dl>
-
-<dl>
- <dt><a href="es/Preferencias_del_Sistema">Preferencias del Sistema</a> </dt>
- <dd>Aprenda acerca de los nuevos widgets, que te permiten crear ventanas de Opciones mas fácilmente y usando menos código JavaScript.</dd>
-</dl>
-
-<dl>
- <dt><a href="es/Caracteres_Internacionales_en_XUL_JavaScript">Caracteres Internacionales en XUL JavaScript</a> </dt>
- <dd>Ahora los archivos XUL JavaScript pueden contener caracteres no-ASCII.</dd>
-</dl>
-
-<dl>
- <dt><a href="es/Cambios_en_el_API_tree">Cambios en el API tree</a> </dt>
- <dd>Las interfaces para acceder a los elementos <code>&lt;tree&gt;</code> han cambiado.</dd>
-</dl>
-
-<dl>
- <dt><a href="es/Cambios_en_XUL_en_Firefox_1.5">Cambios en XUL en Firefox 1.5</a> </dt>
- <dd>Un resumen de los cambios en Xul. Vea también <a href="es/Adaptando_las_aplicaciones_XUL_a_Firefox_1.5">Adaptando las aplicaciones XUL a Firefox 1.5</a>.</dd>
-</dl>
-
-<dl>
- <dt>Cambios referentes a la red </dt>
- <dd> </dd>
-</dl>
-
-<ul>
- <li>Certificate prompts can now be overridden on a per-channel basis. This works by setting an interface requestor as an <a href="es/NsIChannel">nsIChannel</a>'s notificationCallbacks and giving out an interface for <a href="es/NsIBadCertListener">nsIBadCertListener</a>.</li>
- <li>nsIWebBrowserPersist's listeners can now implement <a href="es/NsIInterfaceRequestor">nsIInterfaceRequestor</a>::GetInterface and will get an opportunity to provide all interfaces that channels might ask for, including <a href="es/NsIProgressEventSink">nsIProgressEventSink</a> (not too useful, redundant with <a href="es/NsIWebProgressListener">nsIWebProgressListener</a>). Useful interfaces here include <a href="es/NsIChannelEventSink">nsIChannelEventSink</a> and <a href="es/NsIBadCertListener">nsIBadCertListener</a>.</li>
- <li>Extensions or other necko consumers, including XMLHttpRequest, can set a Cookie header explicitly, and necko will not replace it. Stored cookies will be merged with the explicitly set header, in a way that the explicit header will override the stored cookies</li>
-</ul>
-
-<h3 id="Nuevas_caracter.C3.ADsticas_para_el_usuario_final" name="Nuevas_caracter.C3.ADsticas_para_el_usuario_final">Nuevas características para el usuario final</h3>
-
-<h4 id="Experiencia_de_usuario" name="Experiencia_de_usuario">Experiencia de usuario</h4>
-
-<ul>
- <li><strong>Navegación más rápida</strong> con un rendimiento mejorado usando los botones de vuelta atrás y adelante.</li>
- <li><strong>Reordenación de las pestañas del navegador al pulsar y soltar.</strong></li>
- <li><strong>Answers.com ha sido añadida a la lista de buscadores</strong> para permitir búsquedas en su diccionario.</li>
- <li><strong>Mejoras en la usabilidad</strong> incluyendo descripciones en la páginas erróneas, opciones del menú rediseñadas, RSS discovery, y "Modo Seguro".</li>
- <li><strong>Mejor soporte para la accesibilidad</strong> incluyendo accesibilidad para DHTML.</li>
- <li><strong>Ayudante para notificar sitios webs rotos</strong> para reportar los sitio web que no estan funcionando con Firefox.</li>
- <li><strong>Mejor soporte para Mac OS X</strong> (10.2 y posterior) incluyendo la migración del perfil desde Safari e Internet Explorer para Mac.</li>
-</ul>
-
-<h4 id="Seguridad_y_privacidad" name="Seguridad_y_privacidad">Seguridad y privacidad</h4>
-
-<ul>
- <li><strong>Actualización automática</strong> para racionalizar to streamline product upgrades. Notification of an update is more prominent, and updates to Firefox may now be half a megabyte or smaller. Updating extensions has also improved.</li>
- <li><strong>Bloqueo de ventanas emergentes mejorado.</strong></li>
- <li><strong>Limpieza de datos privados</strong> proporciona un modo fácil y cómodo de eliminar nuestros datos personales desde un menú o con atajos de teclado.</li>
-</ul>
-
-<h3 id="Soporte_a_los_est.C3.A1ndares_Web" name="Soporte_a_los_est.C3.A1ndares_Web">Soporte a los estándares Web</h3>
-
-<p>Firefox es lider de la industria en el soporte a los estandares Web con constantes implementaciones multiplataforma para:</p>
-
-<ul>
- <li>Lenguaje para el Formato de HiperTextos (<a href="es/HTML">HTML</a>) y lenguaje extensible de marcado de hipertexto (<a href="es/XHTML">XHTML</a>): <a class="external" href="http://www.w3.org/TR/html401/">HTML 4.01</a> y <a class="external" href="http://www.w3.org/TR/xhtml1/">XHTML 1.0/1.1</a></li>
- <li>Hojas de Estilo en Cascada (<a href="es/CSS">CSS</a>): <a class="external" href="http://www.w3.org/TR/REC-CSS1">CSS Level 1</a>, <a class="external" href="http://www.w3.org/TR/REC-CSS2">CSS Level 2</a> y partes de <a class="external" href="http://www.w3.org/Style/CSS/current-work.html">CSS Level 3</a></li>
- <li>Modelo de Objetos de Documento (<a href="es/DOM">DOM</a>): <a class="external" href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/">DOM Level 1</a>, <a class="external" href="http://www.w3.org/DOM/DOMTR#dom2">DOM Level 2</a> and parts of <a class="external" href="http://www.w3.org/DOM/DOMTR#dom3">DOM Level 3</a></li>
- <li>Mathematical Markup Language: <a class="external" href="http://www.w3.org/Math/">MathML Version 2.0</a></li>
- <li>Lenguaje Extensible de Marcas (<a href="es/XML">XML</a>): <a class="external" href="http://www.w3.org/TR/REC-xml">XML 1.0</a>, <a class="external" href="http://www.w3.org/TR/REC-xml-names/">Namespaces in XML</a>, <a class="external" href="http://www.w3.org/TR/xml-stylesheet/">Associating Style Sheets with XML Documents 1.0</a>, <a class="external" href="http://lists.w3.org/Archives/Public/www-xml-linking-comments/2001AprJun/att-0074/01-NOTE-FIXptr-20010425.htm">Fragment Identifier for XML</a></li>
- <li>XSL Transformations (<a href="es/XSLT">XSLT</a>): <a class="external" href="http://www.w3.org/TR/xslt">XSLT 1.0</a></li>
- <li>XML Path Language (<a href="es/XPath">XPath</a>): <a class="external" href="http://www.w3.org/TR/xpath">XPath 1.0</a></li>
- <li>Resource Description Framework (<a href="es/RDF">RDF</a>): <a class="external" href="http://www.w3.org/RDF/">RDF</a></li>
- <li>Simple Object Access Protocol (SOAP): <a class="external" href="http://www.w3.org/TR/SOAP/">SOAP 1.1</a></li>
- <li><a href="es/JavaScript">JavaScript</a> 1.6, based on <a href="es/ECMA-262">ECMA-262</a>, revision 3: <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMA-262</a></li>
-</ul>
-
-<p>Firefox 1.5 soporta: los siguientes protocolos para transporte de datos (HTTP, FTP, SSL, TLS, y otros), caracteres multilingües (Unicode), múltiples formatos gráficos (GIF, JPEG, PNG, SVG, y otros) y la última versión del lenguaje para scripts más popular del mundo, <a href="es/Novedades_en_JavaScript_1.6">JavaScript 1.6</a>.</p>
-
-<h3 id="Cambios_desde_Firefox_1.0" name="Cambios_desde_Firefox_1.0">Cambios desde Firefox 1.0</h3>
-
-<p>Muchos cambios han sido introducido en Firefox desde su lanzamiento el 9 de noviembre de 2004. Firefox ha sido mejorado con muchas nuevas características y correciones de bugs. Las release-notes de Deer Park y Firefox son unas excelentes fuentes la información sobre los cambios en cada lanzamiento de Firefox.</p>
-
-<ul>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5-comprehensive.html">What's new in Firefox 1.5 (comprehensive)</a></li>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5rc3.html">What's new in Firefox 1.5 RC 3</a></li>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5rc2.html">What's new in Firefox 1.5 RC 2</a></li>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5rc1.html">What's new in Firefox 1.5 RC 1</a></li>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5b2.html">What's new in Firefox 1.5 Beta 2</a></li>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5b1.html">What's new in Firefox 1.5 Beta 1</a></li>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5a2.html">What's new in Deer Park Alpha 2</a></li>
- <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5a1.html">What's new in Deer Park Alpha 1</a></li>
-</ul>
diff --git a/files/es/firefox_19_para_desarrolladores/index.html b/files/es/firefox_19_para_desarrolladores/index.html
deleted file mode 100644
index bf38aea264..0000000000
--- a/files/es/firefox_19_para_desarrolladores/index.html
+++ /dev/null
@@ -1,66 +0,0 @@
----
-title: Firefox 19 para Desarrolladores
-slug: Firefox_19_para_desarrolladores
-translation_of: Mozilla/Firefox/Releases/19
----
-<div>{{FirefoxSidebar}}</div>
-
-<p>
- </p><p>Quieres ayudar a documentar Firefox 19? Visita la <a class="external" href="http://beta.elchi3.de/doctracker/#list=fx&amp;version=19.0">lista de bugs que necesitan ser revisados</a> e inicia!</p>
-<p></p>
-
-<h2 id="Cambios_para_desarrolladores">Cambios para desarrolladores</h2>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<ul>
- <li>Los objetos <code style="font-size: 14px;"><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Map" title="/en-US/docs/JavaScript/Reference/Global_Objects/Map">Map</a> y</code> <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Set" title="/en-US/docs/JavaScript/Reference/Global_Objects/Set">Set</a></code> pasaron de tener un método <code>size()</code> a tener una propiedad <code>size</code> ({{bug("807001")}})</li>
- <li>Los objetos <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Map" style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;" title="/en-US/docs/JavaScript/Reference/Global_Objects/Map">Map</a> and <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Set" title="/en-US/docs/JavaScript/Reference/Global_Objects/Set">Set</a></code> ahora tienen un método clear(). ({{bug("805003")}})</li>
-</ul>
-
-<h3 id="CSS">CSS</h3>
-
-<ul>
- <li>Support for the viewport-relative {{cssxref("&lt;length&gt;")}} units, <code>vh</code>, <code>vw</code>, <code>vmin</code>, and <code>vmax</code>, has landed ({{bug("503720")}})</li>
- <li>CSS Flexbox has been unprefixed, but remains disabled by default ({{bug("801098")}}).</li>
- <li>The <code>-moz-initial</code> value has been unprefixed ({{bug("806068")}}). <code>-moz-initial</code> will be kept for a while as an alias; however, authors are strongly encouraged to switch over to <code>initial</code>.</li>
- <li>The CSS {{ cssxref("text-transform")}} property now supports the <code>full-width</code> keyword, which allows a more seamless inclusion of Latin characters in text using ideographic fixed-width characters, like Chinese or Japanese ({{bug("774560")}}).</li>
- <li>The CSS {{ cssxref("page-break-inside")}} has been implemented ({{bug("685012")}}).</li>
- <li>The CSS {{ cssxref("calc", "calc()")}} function can now be used on <code>&lt;color-stop&gt;</code> (on {{cssxref("&lt;gradient&gt;")}}).</li>
- <li>The CSS {{ cssxref("@page") }} at-rule is now supported ({{bug("115199")}}). Note that the pseudo-classes {{cssxref(":first")}}, {{cssxref(":right")}}, and {{cssxref(":left")}} are not yet implemented.</li>
- <li>The {{ cssxref(":-moz-placeholder") }} pseudo-class is replaced by the {{ cssxref("::-moz-placeholder") }} pseudo-<em>element</em> ({{ bug("737786") }}).</li>
-</ul>
-
-<h3 id="DOM">DOM</h3>
-
-<ul>
- <li>The {{ domxref("element.getElementsByTagName") }} method will now return <code>HTMLCollection</code> ({{bug("799464")}}).</li>
- <li>The {{domxref("File")}} <code>mozLastModifiedDate</code> property has been implemented. ({{bug("793955")}})</li>
- <li>The {{domxref("CanvasRenderingContext2D")}} <code>isPointInStroke</code> method has been implemented ({{bug("803124")}}).</li>
-</ul>
-
-<h3 id="XForms">XForms</h3>
-
-<p>Support for <a href="/en-US/docs/XForms" title="/en-US/docs/XForms">XForms</a> has been <a href="http://www.philipp-wagner.com/blog/2011/07/the-future-of-mozilla-xforms/" title="http://www.philipp-wagner.com/blog/2011/07/the-future-of-mozilla-xforms/"><strong>removed</strong></a> in Firefox 19.</p>
-
-<h2 id="Changes_for_add-on_and_Mozilla_developers">Changes for add-on and Mozilla developers</h2>
-
-<div class="note">
-<p><strong>Note:</strong> A key change in Firefox 19 is that <a href="/en-US/docs/XPCOM_API_Reference/nsresult" title="/en-US/docs/XPCOM_API_Reference/nsresult"><code>nsresult</code></a> is now strongly typed. This will help make it easier to detect bugs that are caused by mishandling of return values, but may cause existing code to break if it's making incorrect assumptions in this regard.</p>
-</div>
-
-<ul>
- <li><code>getBrowserSelection()</code> now returns the selected text in a text input field. As a result, <code>gContextMenu.isTextSelected</code> will be <code>true</code> when the user selects text in a text input field that is not a password field. ({{bug("565717")}})</li>
- <li><a href="/en/Mozilla/JavaScript_code_modules/Dict.jsm" title="en/Mozilla/JavaScript_code_modules/Dict.jsm">Dict.jsm</a>: <a href="/en/Mozilla/JavaScript_code_modules/Dict.jsm#Creating_a_dictionary" title="en/Mozilla/JavaScript_code_modules/Dict.jsm#Creating_a_dictionary"><code>Dict()</code></a> now takes a JSON String. <a href="/en/Mozilla/JavaScript_code_modules/Dict.jsm#toJSON()" title="en/Mozilla/JavaScript_code_modules/Dict.jsm#toJSON()"><code>Dict.toJSON()</code></a> was added, and it returns a JSON String. ({{bug("727967")}})</li>
-</ul>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="http://www.mozilla.org/en-US/firefox/19.0beta/releasenotes/">Firefox 19 Beta Release Notes</a></li>
- <li><a href="/en-US/docs/Site_Compatibility_for_Firefox_19">Site Compatibility for Firefox 19</a></li>
-</ul>
-
-<h3 id="Older_versions">Older versions</h3>
-
-<p>{{Firefox_for_developers('18')}}</p>
diff --git a/files/es/firefox_2_para_desarrolladores/index.html b/files/es/firefox_2_para_desarrolladores/index.html
deleted file mode 100644
index 54da671995..0000000000
--- a/files/es/firefox_2_para_desarrolladores/index.html
+++ /dev/null
@@ -1,157 +0,0 @@
----
-title: Firefox 2 para desarrolladores
-slug: Firefox_2_para_desarrolladores
-tags:
-  - CSS
-  - Complementos
-  - DOM
-  - Desarrollo_Web
-  - Estándares_Web
-  - HTML
-  - JavaScript
-  - RDF
-  - SVG
-  - Servicios_Web_XML
-  - Todas_las_Categorías
-  - XML
-  - XSLT
-  - XUL
-  - extensiones
-translation_of: Mozilla/Firefox/Releases/2
----
-<div>{{FirefoxSidebar}}</div><h2 id="Nuevas_caracter.C3.ADsticas_para_desarrolladores_en_Firefox_2" name="Nuevas_caracter.C3.ADsticas_para_desarrolladores_en_Firefox_2">Nuevas características para desarrolladores en Firefox 2</h2>
-
-<p>Firefox 2 aporta gran cantidad de funcionalidades nuevas, este artículo proporciona enlaces que describen estas nuevas capacidades.</p>
-
-<h3 id="Para_desarrolladores_de_sitios_y_aplicaciones_web." name="Para_desarrolladores_de_sitios_y_aplicaciones_web.">Para desarrolladores de sitios y aplicaciones web.</h3>
-
-<dl>
- <dt><a class="external" href="http://wiki.mozilla.org/Microsummaries">MicroResúmenes <small>(en)</small></a></dt>
- <dd>Son breves recopilaciones actualizables de la información más importante en una página Web. Pueden ser proporcionados por los desarrolladores del sitio o por terceros. Cuando se añade a marcadores una página con esta funcionalidad, los usuarios pueden escoger que se muestre este microresúmen en vez del típico título estático.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Como_crear_un_Microresumen" title="es/Como_crear_un_Microresumen">Cómo crear un Microresumen</a></dt>
- <dd>Tutorial sobre cómo crear un generador de microresúmenes.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Marcado_XML_en_los_microres%C3%BAmenes" title="es/Marcado_XML_en_los_microresúmenes">Marcado XML en los microresúmenes</a></dt>
- <dd>Una guía de referencia sobre el marcado XML usado para crear microresúmenes.</dd>
-</dl>
-
-<dl>
- <dt><a class="external" href="http://opensearch.a9.com/">Soporte OpenSearch</a></dt>
- <dd>Firefox 2 admite el formato de búsqueda OpenSearch.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Creaci%C3%B3n_de_plugins_MozSearch" title="es/Creación_de_plugins_MozSearch">Creación de plugins MozSearch</a></dt>
- <dd>Firefox 2 soporta MozSearch, un plugin de búsqueda basado en OpenSearch, pero previsto sólo para uso interno.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Permitir_sugerencias_en_los_plugins_de_b%C3%BAsqueda" title="es/Permitir_sugerencias_en_los_plugins_de_búsqueda">Permitir sugerencias en los plugins de búsqueda</a></dt>
- <dd>Cómo hacer que su plugin MozSearch ofrezca sugerencias de búsqueda en una ventana emergente cuando usamos la barra de búsqueda.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Novedades_en_JavaScript_1.7" title="es/Novedades_en_JavaScript_1.7">Novedades en JavaScript 1.7</a></dt>
- <dd>Firefox 2 soporta JavaScript 1.7, que incluye nuevas características como <code>let</code>, asignación desestructurada, generadores e iteradores, y "array comprehensions".</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/DOM/Almacenamiento" title="es/DOM/Almacenamiento">WHATWG Sesiones del lado cliente y el almacenamiento continuo (Almacenamiento DOM)</a></dt>
- <dd>Las sesiones del lado cliente y el almacenamiento continuo permiten que las aplicaciones web puedan almacenar datos estructurados en el lado del cliente.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/SVG_en_Firefox" title="es/SVG_en_Firefox">SVG en Firefox</a></dt>
- <dd>Firefox 2 mejora el soporte a Gráficos Vectoriales Escalables (SVG), implementando el elemento <code>&lt;textPath&gt;</code> y aumentando el número de atributos soportados.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Control_de_la_correcci%C3%B3n_ortogr%C3%A1fica_en_formularios_HTML" title="es/Control_de_la_corrección_ortográfica_en_formularios_HTML">Control de la corrección ortográfica en formularios HTML</a></dt>
- <dd>Firefox 2 incluye soporte para la revisión ortográfica en línea de los campos y áreas de texto. Este artículo describe cómo escribir HTML para activar o desactivar la revisión ortográfica en los elementos del formulario de manera individual.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Seguridad_en_Firefox_2" title="es/Seguridad_en_Firefox_2">Seguridad en Firefox 2</a></dt>
- <dd>Firefox 2 cambia los protocolos de seguridad que están activos por defecto.</dd>
-</dl>
-
-<h3 id="Para_desarrolladores_XUL_y_de_extensiones" name="Para_desarrolladores_XUL_y_de_extensiones">Para desarrolladores XUL y de extensiones</h3>
-
-<dl>
- <dt><a href="/es/API_de_restauraci%C3%B3n_de_sesi%C3%B3n" title="es/API_de_restauración_de_sesión">API de restauración de sesión</a></dt>
- <dd>Aporta métodos para poder guardar y restaurar entre sesiones en Firefox.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/API_de_acceso_a_canales" title="es/API_de_acceso_a_canales">API de acceso a canales</a></dt>
- <dd>API que permite al desarrollador tener acceso y parsear canales Atom y RSS.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/SAX" title="es/SAX">SAX</a></dt>
- <dd>API de <abbr title="análisis sintáctico">parseo</abbr> basado en eventos XML.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Instalaci%C3%B3n_de_motores_de_b%C3%BAsqueda_desde_p%C3%A1ginas_web" title="es/Instalación_de_motores_de_búsqueda_desde_páginas_web">Instalación de motores de búsqueda desde páginas web</a></dt>
- <dd>Un código JavaScript puede indicarle a Firefox cómo instalar el plugin de un nuevo motor de búsqueda escrito en formato Sherlock u OpenSearch.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/A%C3%B1adir_datos_para_la_protecci%C3%B3n_anti-phishing" title="es/Añadir_datos_para_la_protección_anti-phishing">Añadir datos para la protección anti-phishing</a></dt>
- <dd>Es posible aumentar la protección anti-phishing de Firefox añadiendo datos adicionales del proveedor para un sistema de navegación seguro.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/A%C3%B1adir_lectores_de_canales_a_Firefox" title="es/Añadir_lectores_de_canales_a_Firefox">Añadir lectores de canales a Firefox</a></dt>
- <dd>Puedes añadir más lectores de canales a Firefox, ya sean webs o aplicaciones.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Almacenamiento" title="es/Almacenamiento">Almacenamiento</a></dt>
- <dd>Firefox 2 presenta mozStorage, una arquitectura de base de datos basada en sqlite.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Cambios_del_tema_en_Firefox_2" title="es/Cambios_del_tema_en_Firefox_2">Cambios del tema en Firefox 2</a></dt>
- <dd>Comenta los cambios necesarios para actualizar temas existentes para que funcionen en Firefox 2.</dd>
-</dl>
-
-<h2 id="Nuevas_caracter.C3.ADsticas_para_usuarios_finales" name="Nuevas_caracter.C3.ADsticas_para_usuarios_finales">Nuevas características para usuarios finales</h2>
-
-<p>Firefox 2.0 proporciona una versión mejorada de la limpia interfaz que ofrecía en versiones anteriores. Con mejoras de seguridad para que tu experiencia en línea sea más segura y práctica que nunca.</p>
-
-<h3 id="Experiencia_de_usuario" name="Experiencia_de_usuario">Experiencia de usuario</h3>
-
-<ul>
- <li>La <strong>corrección ortográfica de las áreas de texto</strong> permite rellenar formularios Web con tranquilidad.</li>
- <li>Los <strong>microresúmenes</strong> permiten crear marcadores que muestren información extraída de las páginas que enlazan. Pueden ser actualizados automáticamente; esto es muy útil para seguir el curso de una acción, o datos cambiantes.</li>
- <li>El <strong>Administrador de extensiones</strong> ha sido mejorado.</li>
- <li>El <strong>Administrador de motores de búsqueda</strong> permite que estos puedan ser recolocados y/o suprimidos en la barra de búsqueda.</li>
- <li><strong>Navegación con pestañas mejorada</strong>. Se incluye un botón de cierre en cada pestaña. Firefox cambia su modo de decidir qué pestaña mostrar cuando cerramos la pestaña actual. Se simplifican la preferencias de las pestañas.</li>
- <li>La <strong>detección automática de motores de búsqueda</strong> permite a los motores ofrecer plugins para la barra de búsqueda de Firefox y ofrecerse a instalarlos para ti.</li>
- <li>Con las <strong>sugerencias de búsqueda</strong> los motores de búsqueda pueden sugerir términos basándose en lo que se escribió en búsquedas anteriores.</li>
-</ul>
-
-<h3 id="Seguridad_y_privacidad" name="Seguridad_y_privacidad">Seguridad y privacidad</h3>
-
-<ul>
- <li><strong>Anti-phishing</strong> para avisar a los usuarios cuando visitan un sitio web sospechoso.</li>
-</ul>
-
-<h3 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h3>
-
-<ul>
- <li><a href="/es/Firefox_1.5_para_Desarrolladores" title="es/Firefox_1.5_para_Desarrolladores">Firefox 1.5 para Desarrolladores</a></li>
-</ul>
-
-<p><span class="comment">Categorías</span></p>
-
-<p><span class="comment">Interwiki links</span></p>
-
-<p>{{ languages( { "ca": "ca/Firefox_2_per_a_desenvolupadors", "en": "en/Firefox_2_for_developers", "fr": "fr/Firefox_2_pour_les_d\u00e9veloppeurs", "it": "it/Firefox_2.0_per_Sviluppatori", "ja": "ja/Firefox_2_for_developers", "ko": "ko/Firefox_2_for_developers", "pl": "pl/Firefox_2_dla_programist\u00f3w", "pt": "pt/Firefox_2_para_desenvolvedores", "zh-tw": "zh_tw/Firefox_2_\u6280\u8853\u6587\u4ef6" } ) }}</p>
diff --git a/files/es/firefox_3.5_para_desarrolladores/index.html b/files/es/firefox_3.5_para_desarrolladores/index.html
deleted file mode 100644
index 5043206fe8..0000000000
--- a/files/es/firefox_3.5_para_desarrolladores/index.html
+++ /dev/null
@@ -1,231 +0,0 @@
----
-title: Firefox 3.5 para desarrolladores
-slug: Firefox_3.5_para_desarrolladores
-translation_of: Mozilla/Firefox/Releases/3.5
----
-<div>{{FirefoxSidebar}}</div><p>Firefox 3.5 implementa nuevas funcionalidades, además de agregar y mejorar el funcionamiento de una amplia variedad de estándares web. Este artículo ofrece una extensa lista con enlaces a artículos que explican estas grandes mejoras.</p>
-
-<h2 id="Nuevas_funcionalidades_para_desarrolladores_en_Firefox_3.5">Nuevas funcionalidades para desarrolladores en Firefox 3.5</h2>
-
-<h3 id="Para_desarrolladores_de_sitios_y_aplicaciones_web">Para desarrolladores de sitios y aplicaciones web</h3>
-
-<h4 id="Funciones_de_HTML_5">Funciones de HTML 5</h4>
-
-<dl>
- <dt><a href="/Es/Usar_audio_y_v%C3%ADdeo_en_Firefox" title="Es/Usar audio y video en Firefox">Usar audio y video en Firefox</a></dt>
- <dd>Firefox 3.5 implementa los elementos  <a href="/en-US/docs/HTML/Element/Audio" title="HTML/Element/Audio"><code>audio</code></a> y <a href="/en-US/docs/HTML/Element/Video" title="HTML/Element/Video"><code>video</code></a> de HTML 5.</dd>
- <dt><a href="/en-US/docs/Offline_resources_in_Firefox" title="Offline resources in Firefox">Recursos sin conexión en Firefox</a></dt>
- <dd>Firefox 3.5 implementa de forma completa la especificación para recursos sin conexión de HTML 5.</dd>
- <dt><a href="/en-US/docs/DragDrop/Drag_and_Drop" title="DragDrop/Drag and Drop">Arrastrar y soltar (Drag and drop</a>)</dt>
- <dd>La API para arrastrar y soltar de HTML 5 permite que el usuario pueda arrastrar y soltar objetos entre sitios web. También permite una API más simple para el uso por parte de las extensiones o aplicaciones basadas en la plataforma Mozilla.</dd>
-</dl>
-
-<h4 id="Nuevas_características_de_CSS_implementadas">Nuevas características de CSS implementadas</h4>
-
-<dl>
- <dt><a href="/en-US/docs/CSS/@font-face" title="CSS/@font-face">Tipografías descargables</a></dt>
- <dd>La nueva regla {{cssxref("@font-face")}} permite a las páginas web disponer de tipografías descargables, para que los sitios web puedan ser visualizados como el autor lo pretende.</dd>
- <dt><a href="/en-US/docs/CSS/Media_queries" title="CSS/Media queries">Pedidos de CSS según el medio</a></dt>
- <dd>Firefox 3.5 implementa esta característica que permite al autor del sitio web tener más control sobre el archivo CSS que cada dispositivo va a recibir según las características del mismo.</dd>
- <dt>{{cssxref(":before")}} y {{cssxref(":after")}} actualizados a CSS 2.1</dt>
- <dd>Los pseudo-elementos <code>:before</code> y <code>:after</code> han sido actualizados para implementar por completo las características de CSS 2.1, añadiendo la posibilidad de usar <code>position</code>, <code>float</code>, <code>list-style-*</code> y algunas propiedades de <code>display</code>.</dd>
- <dt><a href="/en-US/docs/CSS/opacity" title="CSS/Opacity"><code>opacity</code></a></dt>
- <dd>La extensión al CSS <code>-moz-opacity</code> fue eliminada para implementar la propiedad estandar <code>opacity</code>.</dd>
- <dt><a href="/en-US/docs/CSS/text-shadow" title="CSS/Text-shadow"><code>text-shadow</code></a></dt>
- <dd>La propiedad <code>text-shadow</code>, que permite especificar efectos de sombra para textos y decoraciones del texto, está implementada.</dd>
- <dt><a href="/en-US/docs/CSS/Word-wrap" title="CSS/Word-wrap"><code>word-wrap</code></a></dt>
- <dd>Esta propiedad permite especificar cuando las líneas deben o no ser cortadas entre palabras para prevenir el overflow cuando una línea que no puede ser cortada es demasiado larga para entrar en una sola línea.</dd>
- <dt><a href="/en-US/docs/CSS/-moz-box-shadow" title="CSS/-moz-box-shadow"><code>-moz-box-shadow</code></a></dt>
- <dt><a href="/en-US/docs/CSS/-moz-border-image" title="CSS/-moz-border-image"><code>-moz-border-image</code></a></dt>
- <dt><a href="/en-US/docs/CSS/-moz-column-rule" title="CSS/-moz-column-rule"><code>-moz-column-rule</code></a></dt>
- <dt><a href="/en-US/docs/CSS/-moz-column-rule-width" title="CSS/-moz-column-rule-width"><code>-moz-column-rule-width</code></a></dt>
- <dt><a href="/en-US/docs/CSS/-moz-column-rule-style" title="CSS/-moz-column-rule-style"><code>-moz-column-rule-style</code></a></dt>
- <dt><a href="/en-US/docs/CSS/-moz-column-rule-color" title="CSS/-moz-column-rule-color"><code>-moz-column-rule-color</code></a></dt>
- <dd>Firefox 3.5 añade la posibilidad de usar estas extensiones al CSS de Mozilla.</dd>
- <dt><a href="/en-US/docs/CSS/color#Mozilla_Specific_Colors" title="CSS/color#Mozilla Specific Colors">The <code>-moz-nativehyperlinktext</code> color value</a></dt>
- <dd>Este nuevo valor del color representa el predefinido por el sistema del usuario para los hipervínculos.</dd>
- <dt>Las nuevas propiedades <a href="/en-US/docs/CSS/-moz-window-shadow" title="CSS/-moz-window-shadow"><code>-moz-window-shadow</code></a> y <a href="/en-US/docs/CSS/:-moz-system-metric(mac-graphite-theme)" title="CSS/:-moz-system-metric(mac-graphite-theme)"><code>-moz-system-metric(mac-graphite-theme)</code></a></dt>
- <dd>Estas nuevas propiedades de CSS fueron añadidas para facilitar la creación de temas.</dd>
- <dt>Nuevos valores para <a href="/en-US/docs/CSS/-moz-appearance" title="CSS/-moz-appearance"><code>-moz-appearance</code></a></dt>
- <dd>Los valores <code>-moz-win-glass</code> y <code>-moz-mac-unified-toolbar</code> se agregaron a <code>-moz-appearance</code>.</dd>
- <dt><a href="/en-US/docs/CSS/Using_CSS_transforms" title="CSS/Using CSS transforms">Usar transformaciones CSS</a></dt>
- <dd>Firefox 3.5 implementa las transformaciones CSS.  Mirá <a href="/en-US/docs/CSS/-moz-transform" title="CSS/-moz-transform"><code>-moz-transform</code></a> y <a href="/en-US/docs/CSS/-moz-transform-origin" title="CSS/-moz-transform-origin"><code>-moz-transform-origin</code></a> para saber más detalles.</dd>
- <dt><a href="/en-US/docs/CSS/:nth-child" title="CSS/:nth-child"><code>:nth-child</code></a></dt>
- <dt><code><a href="/en-US/docs/CSS/:nth-last-child" title="CSS/:nth-last-child">:nth-last-child</a></code></dt>
- <dt><code><a href="/en-US/docs/CSS/:nth-of-type" title="CSS/:nth-of-type">:nth-of-type</a></code></dt>
- <dt><code><a href="/en-US/docs/CSS/:nth-last-of-type" title="CSS/:nth-last-of-type">:nth-last-of-type</a></code></dt>
- <dt><code><a href="/en-US/docs/CSS/:first-of-type" title="CSS/:first-of-type">:first-of-type</a></code></dt>
- <dt><code><a href="/en-US/docs/CSS/:nth-last-of-type" title="CSS/:nth-last-of-type">:last-of-type</a></code></dt>
- <dt><a href="/en-US/docs/CSS/:only-of-type" title="CSS/:only-of-type"><code>:only-of-type</code></a></dt>
- <dd>Estos selectores pueden ser usados en Firefox 3.5.</dd>
-</dl>
-
-<h4 id="Nuevas_funcionalidades_del_DOM">Nuevas funcionalidades del DOM</h4>
-
-<dl>
- <dt><a href="/en-US/docs/DOM/Storage#localStorage" title="DOM/Storage#localStorage">localStorage</a></dt>
- <dd>Firefox 3.5 implementa el uso de la propiedad <code>localStorage</code> del Web Storage, que permite que las aplicaciones web guarden datos en la computadora del cliente.</dd>
- <dt><a href="/en-US/docs/Using_web_workers" title="Using DOM workers">Usar DOM workers</a></dt>
- <dd>Firefox 3.5 implementa los trabajadores (workers) del DOM lo que permite el multi-threading en las aplicaciones web.</dd>
- <dt><a href="/en-US/docs/Using_geolocation" title="Using geolocation">Usar geolocalización</a></dt>
- <dd>Firefox 3.5 implementa la API de geolocalización, que permite que las aplicaciones web obtengan información sobre la ubicación actual del usuario si unu proveedor de ese servicio está instalado y habilitado.</dd>
- <dt><a href="/en-US/docs/Using_native_JSON" title="Using JSON in Firefox">Usar JSON en Firefox</a></dt>
- <dd>Posibilidad de usar <a href="/en-US/docs/JSON" title="JSON">JSON</a> en el DOM.</dd>
- <dt><a href="/en-US/docs/DOM/Locating_DOM_elements_using_selectors" title="DOM/Locating DOM elements using selectors">Localizar elementos del DOM con selectores</a></dt>
- <dd>El API de selectores permite pedirle a un documento que localice los elementos que coincidan con una regla seleccionada.</dd>
- <dt><a href="/en-US/docs/DOM/NodeIterator" title="DOM/NodeIterator">El objeto <code>NodeIterator</code></a></dt>
- <dd>El objeto <code>NodeIterator</code> permite recorrer la lista de nodos en un árbol del DOM.</dd>
- <dt><a href="/en-US/docs/Gecko-Specific_DOM_Events#MozAfterPaint" title="Gecko-Specific DOM Events#MozAfterPaint">El evento MozAfterPaint</a></dt>
- <dd>Este nuevo evento del DOM es lanzado después de actualizar partes de una ventana.</dd>
- <dt><a href="/en-US/docs/Gecko-Specific_DOM_Events#MozMousePixelScroll" title="Gecko-Specific DOM Events#MozMousePixelScroll">El evento MozMousePixelScroll</a></dt>
- <dd>Este nuevo evento del DOM permite detectar el desplazamiento con la rueda del ratón/mouse en lugar de los eventos basados en la línea de desplazamiento.</dd>
-</dl>
-
-<h4 id="Nuevas_funcionalidades_JavaScript">Nuevas funcionalidades JavaScript</h4>
-
-<dl>
- <dt><a href="/en-US/docs/New_in_JavaScript_1.8.1" title="New in JavaScript 1.8.1">Nuevo en JavaScript 1.8.1</a></dt>
- <dd>Una introducción a todos los cambios de JavaScript 1.8.1.</dd>
- <dt><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/GetPrototypeOf" title="JavaScript/ Reference/Global Objects/Object/GetPrototypeOf"><code>Object.getPrototypeOf()</code></a></dt>
- <dd>Este nuevo método retorna el prototipo de un objeto especificado.</dd>
- <dt><a href="/en-US/docs/Using_native_JSON" title="Using JSON in Firefox">Uso de JSON nativo</a></dt>
- <dd>Firefox 3.5 tiene soporte para <a href="/en-US/docs/JSON" title="JSON">JSON</a> nativo.</dd>
- <dt>Nuevos métodos trim en el objeto String</dt>
- <dd>El objeto <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String" title="JavaScript/ Reference/Global Objects/String"><code>String</code></a> tiene ahora los métodos <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String/Trim" rel="internal"><code>trim()</code></a>, <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String/TrimLeft" rel="internal"><code>trimLeft()</code></a>, y <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String/TrimRight" rel="internal"><code>trimRight()</code></a> .</dd>
-</dl>
-
-<h4 id="Networking">Networking</h4>
-
-<dl>
- <dt><a href="/en-US/docs/HTTP_access_control" title="HTTP access control">Controles de acceso cross-site para HTTP</a></dt>
- <dd>En Firefox 3.5, es ahora posible en las peticiones HTTP, incluyendo aquellas hechas por <a href="/en-US/docs/XMLHttpRequest" title="XMLHttpRequest"><code>XMLHttpRequest</code></a>, trabajar entre dominios si el servidor lo permite.</dd>
- <dt><a href="/en-US/docs/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress" title="Using XMLHttpRequest#Monitoring progress">Eventos de progreso para </a><code><a href="/en-US/docs/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress" title="Using XMLHttpRequest#Monitoring progress">XMLHttpRequest</a></code></dt>
- <dd>Ahora se ofrecen eventos de progreso para que las extensiones puedan monitorizar el progreso de las peticiones.</dd>
- <dt>Soporte <code>XMLHttpRequest</code> síncrono mejorado</dt>
- <dd><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=340345" title="https://bugzilla.mozilla.org/show_bug.cgi?id=340345">DOM Timeout</a> y <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=333198" title="https://bugzilla.mozilla.org/show_bug.cgi?id=333198">Input Events</a> son ahora soportados durante un <code>XMLHttpRequest</code> síncrono.</dd>
- <dt><a href="/en-US/docs/Controlling_DNS_prefetching" title="Controlling DNS prefetching">Control de prefetch de DNS</a></dt>
- <dd>Firefox 3.5 ofrece prefetch de DNS, por el que resuelve nombres de dominio con anticipación para links incluidos en la página actual, para ahorrar tiempo cuando los enlaces son realmente clickados. Este artículo describe cómo puedes optimizar tu sitio web para desactivar el prefetch, o ajustar cómo opera el prefetch.</dd>
-</dl>
-
-<h4 id="Nuevas_funcionalidades_Canvas">Nuevas funcionalidades Canvas</h4>
-
-<dl>
- <dt><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing text using a canvas">API de texto HTML 5 para elementos <code>canvas</code></a></dt>
- <dd>Los elementos Canvas ahora soportan la API de texto HTML 5.</dd>
- <dt><a href="/en-US/docs/Canvas_tutorial/Applying_styles_and_colors#Shadows" title="Canvas tutorial/Applying styles and colors#Shadows">Efectos de sombra en un <code>canvas</code></a></dt>
- <dd>Los efectos de sombra de Canvas son ahora soportados.</dd>
- <dt><a href="/en-US/docs/HTML/Canvas/Pixel_manipulation_with_canvas#Creating_an_ImageData_object" title="HTML/Canvas/Pixel manipulation with canvas#Creating an ImageData object"><code>createImageData()</code></a></dt>
- <dd>El método canvas <code>createImageData()</code> es ahora soportado, permitiendo al código crear específicamente un objeto <code>ImageData</code> en lugar de necesitar que sea hecho automáticamente. Esto puede mejorar el rendimiento de otros métodos <code>ImageData</code> evitando que deban crear el objeto.</dd>
- <dt>Atributo <code>moz-opaque</code></dt>
- <dd>Añadido el atributo DOM <code>moz-opaque</code>, que permite al canvas saber si la translucencia será un factor. Si el canvas sabe que no hay translucencia, el rendimiento de pintado puede ser optimizado.</dd>
-</dl>
-
-<h4 id="Nuevas_funcionalidades_SVG">Nuevas funcionalidades SVG</h4>
-
-<dl>
- <dt><a href="/en-US/docs/Applying_SVG_effects_to_HTML_content" title="Applying SVG effects to HTML content">Aplicar efectos SVG al contenido HTML</a></dt>
- <dd>Ahora puedes aplicar efectos SVG a contenido HTML y XHTML; este artículo describe cómo.</dd>
-</dl>
-
-<h4 id="Otras_nuevas_funcionalidades">Otras nuevas funcionalidades</h4>
-
-<dl>
- <dt><a href="/en-US/docs/ICC_color_correction_in_Firefox" title="ICC color correction in Firefox">Corrección de color ICC en Firefox</a></dt>
- <dd>Firefox 3.5 ahora soporta corrección de color ICC para imágenes etiquetadas.</dd>
- <dt>El atributo <code>defer</code> es ahora soportado en elementos <a href="/en-US/docs/HTML/Element/Script" title="HTML/Element/script"><code>script</code></a></dt>
- <dd>Este atributo indica al navegador que <em>puede</em> escoger continuar parseando y renderizando la página sin esperar a que el script termine de ejecutarse.</dd>
-</dl>
-
-<h3 id="Otras_mejoras">Otras mejoras</h3>
-
-<ul>
- <li>La propiedad de los nodosde texto <code><a href="/en-US/docs/DOM/Text.wholeText" rel="internal">wholeText</a></code> y el método <code><a href="/en-US/docs/DOM/Text.replaceWholeText" rel="internal">replaceWholeText()</a></code> han sido implementados.</li>
- <li>La propiedad <code><a href="/en-US/docs/DOM/Element.children" rel="internal">element.children</a></code> ha sido añadida. Retorna una <em>colección</em> de elementos hijo del elemento dado.</li>
- <li> La propiedad {{domxref("element.contentEditable")}} es ahora soportada, para soportar elementos editables.</li>
- <li>La API Element Traversal es ahora soportada por el objeto DOM <a href="/en-US/docs/DOM/element" rel="internal">Element</a>.</li>
- <li>Los nodos de documento HTML pueden ser ahora clonados  usando <a href="/en-US/docs/DOM/Node.cloneNode" title="DOM/Node.cloneNode"><code>cloneNode()</code></a>.</li>
- <li>El método no estándar <code>getBoxObjectFor()</code> ha sido eliminado. Deberías usar <a href="/en-US/docs/DOM/element.getBoundingClientRect" title="DOM/Element.getBoundingClientRect"><code>getBoundingClientRect()</code></a> en su lugar.</li>
- <li>Los eventos DOM ya despachados pueden ser ahora re-despachados. Esto hace que Firefox 3.5 pase el test 30 de Acid 3.</li>
- <li>Se han hecho mejoras en el manejo de rango DOM 2.</li>
- <li>En ámbito no-chrome, los objetos capturados en excepciones son ahora el objeto realmente lanzado en lugar de un wrapper <a href="/en-US/docs/XPConnect" title="XPConnect">XPConnect</a> que contiene el objeto lanzado.</li>
- <li>Las referencias ID de SVG ahora son vivas.</li>
- <li>Los filtros SVG ahora funcionan para <code>foreignObject</code>.</li>
- <li>El método <code>GetSVGDocument()</code> ha sido añadido a los elementos <a href="/en-US/docs/HTML/Element/object" title="HTML/Element/Object"><code>object</code></a> y <a href="/en-US/docs/HTML/Element/iframe" title="HTML/Element/Iframe"><code>iframe</code></a> por compatibilidad.</li>
- <li>El setting implícito de propiedades en inicializadores de objeto y array ya no ejecuta los setters JavaScript. Ver el post <a href="/web-tech/2009/04/29/object-and-array-initializers-should-not-invoke-setters-when-evaluated" title="web-tech/2009/04/29/object-and-array-initializers-should-not-invoke-setters-when-evaluated">Object and array initializers should not invoke setters when evaluated</a> para más detalles.</li>
- <li>La variable <code>gDownloadLastDir.path</code> ha sido renombrada a <code>gDownloadLastDir.file</code> porque se refiere a un {{interface("nsIFile")}}, no a una ruta.</li>
- <li>La variable <code>gDownloadLastDirPath</code> ha sido renombrada a <code>gDownloadLastDirFile</code> porque se refiere a un {{interface("nsIFile")}}, not a una ruta.</li>
- <li>A partir de Firefox 3.5, no puedes usar <code>data:</code> bindings en los chrome packages que tienen automatización <code>XPCNativeWrapper</code>.</li>
-</ul>
-
-<h3 id="For_XUL_and_add-on_developers">For XUL and add-on developers</h3>
-
-<p>If you're an extension developer, you should start by reading <a href="/en-US/docs/Updating_extensions_for_Firefox_3.5" title="Updating extensions for Firefox 3.5">Updating extensions for Firefox 3.5</a>, which offers a helpful overview of what changes may affect your extension.</p>
-
-<h4 id="New_components_and_functionality">New components and functionality</h4>
-
-<dl>
- <dt><a href="/en-US/docs/Supporting_private_browsing_mode" title="Supporting private browsing mode">Supporting private browsing mode</a></dt>
- <dd>Firefox 3.5 offers Private Browsing mode, which doesn't record the user's activities.  Extensions may support private browsing following the guidelines offered by this article.</dd>
- <dt><a href="/en-US/docs/Security_changes_in_Firefox_3.5" title="Security changes in Firefox 3.5">Security changes in Firefox 3.5</a></dt>
- <dd>This article covers security-related changes in Firefox 3.5.</dd>
- <dt><a href="/en-US/docs/Theme_changes_in_Firefox_3.5" title="Theme changes in Firefox 3.5">Theme changes in Firefox 3.5</a></dt>
- <dd>This article covers theme-related changes in Firefox 3.5.</dd>
- <dt><a href="/en-US/docs/Monitoring_WiFi_access_points" title="Monitoring WiFi access points">Monitoring WiFi access points</a></dt>
- <dd>Code with UniversalXPConnect privileges can now monitor the list of available access points, getting information on their SSIDs, MAC addresses, and signal strength.  This can be used in tandem with Geolocation to offer WiFi-based location service.</dd>
-</dl>
-
-<h4 id="Notable_changes_and_improvements">Notable changes and improvements</h4>
-
-<ul>
- <li>The XUL <code><a href="../../../../en/XUL/textbox" rel="internal">textbox</a></code> widget now offers a <code><a href="../../../../en/XUL/Attribute/textbox.type" rel="internal">search</a></code> type, for use as search fields.</li>
- <li>In order to support dragging and dropping tabs between windows, the <a href="/en-US/docs/XUL/browser" title="XUL/Browser"><code>browser</code></a> widget now has a <a href="/en-US/docs/XUL/Method/SwapDocShells" title="XUL/Method/SwapDocShells"><code>swapDocShells()</code></a> method.</li>
- <li>Added the <a href="/en-US/docs/XUL/Attribute/Panel.level" title="XUL/Attribute/panel.level"><code>level</code></a> attribute to the <a href="/en-US/docs/XUL/panel" title="XUL/Panel"><code>panel</code></a> element; this specifies whether panels appear on top of other applications, or just on top of the window the panel is contained within.</li>
- <li>XUL elements now support the <code>clientXXX</code> and <code>scrollXXX</code> properties.</li>
- <li><a href="/en-US/docs/XUL/keyset" title="XUL/Keyset"><code>keyset</code></a>s now include a <code>disabled</code> attribute.</li>
- <li>In addition, <code>keyset</code>s can now be removed using the node's <a href="/en-US/docs/DOM/Node.removeChild" title="DOM/Node.removeChild"><code>removeChild()</code></a> method.</li>
- <li><span class="lang lang-en"><code><a href="../../../../en/mozIStorageStatement" rel="internal">mozIStorageStatement</a></code> </span> had the <code>initialize()</code> method removed; consumers should use the <span class="lang lang-en"><code><a href="../../../../en/mozIStorageConnection#createStatement%28%29" rel="internal">createStatement()</a></code> </span> method instead to get a new statement object.</li>
- <li>The <a href="/en-US/docs/Storage" title="Storage">Storage</a> API now offers support for asynchronous requests.</li>
- <li>The <a href="/en-US/docs/nsICookie2" title="NsICookie2"><code>nsICookie2</code></a> interface now exposes the time at which cookies were created in its new <code>creationTime</code> attribute.</li>
- <li>Added a flag to <code><a href="../../../../en/nsIProtocolHandler" rel="internal">nsIProtocolHandler</a></code> (<code>URI_IS_LOCAL_RESOURCE</code>) that is checked during chrome registration to make sure a protocol is allowed to be registered.</li>
- <li>Firefox now looks for plugins in <code>/usr/lib/mozilla/plugins</code> on Linux, as well as the previously supported locations.</li>
- <li>The plugin API has been updated to include support for private browsing mode; you may now use <a href="/en-US/docs/NPN_GetValue" title="NPN GetValue"><code>NPN_GetValue()</code></a> to query the state of private browsing mode using the variable <code>NPNVprivateModeBool</code>.</li>
-</ul>
-
-<h2 id="New_features_for_end_users">New features for end users</h2>
-
-<h3 id="User_experience">User experience</h3>
-
-<dl>
- <dt>Location aware browsing</dt>
- <dd>If you choose, you may allow Firefox 3.5 to share information about your current location with web sites.  Firefox 3.5 can use information about the network you're connected to to share your location. Of course, it asks for your permission before doing so, to ensure your privacy.</dd>
- <dt>Open audio and video support</dt>
- <dd>Firefox 3.5 supports embedded video and audio using the open Ogg format, as well as WAV for audio. No plugins, no confusing error messages about needing to install something or other that turns out not to be available on your platform anyway.</dd>
- <dt>Local data storage</dt>
- <dd>Web applications can now use Web Storage's local storage capabilities to store data on your computer.  This is great for anything from site preferences to more complex data.</dd>
-</dl>
-
-<h3 id="Security_and_privacy">Security and privacy</h3>
-
-<dl>
- <dt>Private Browsing</dt>
- <dd>Need to use someone else's computer? Switch on Private Browsing mode and nothing will be recorded about your session, including cookies, history, and any other potentially private information.</dd>
- <dt>Better privacy controls</dt>
- <dd>The Privacy preference pane has been completely redesigned to offer users more control over their private information. Users can choose to retain or discard anything including history information, cookies, downloads, and form field information.  In addition, users can specify whether or not to include history and/or bookmarks in the location bar's automated suggestions, so you can keep private web addresses from popping up unexpectedly while typing in the location bar.</dd>
-</dl>
-
-<h3 id="Performance">Performance</h3>
-
-<dl>
- <dt>Faster JavaScript performance</dt>
- <dd>JavaScript, the "J" in "AJAX," is sped up dramatically in Firefox 3.5 with the new TraceMonkey JavaScript engine.  Web applications are much faster than in Firefox 3.</dd>
- <dt>Faster page rendering</dt>
- <dd>Web content draws faster in Firefox 3.5, thanks to technologies such as "speculative parsing." Your users don't need to know what it means, other than "it makes things draw faster."</dd>
-</dl>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Firefox_3_for_developers" title="Firefox 3 for developers">Firefox 3 for developers</a></li>
- <li><a href="/en-US/docs/Firefox_2_for_developers" title="Firefox 2 for developers">Firefox 2 for developers</a></li>
- <li><a href="/en-US/docs/Firefox_1.5_for_developers" title="Firefox 1.5 for developers">Firefox 1.5 for developers</a></li>
-</ul>
diff --git a/files/es/firefox_3_para_desarrolladores/index.html b/files/es/firefox_3_para_desarrolladores/index.html
deleted file mode 100644
index 1456bfb969..0000000000
--- a/files/es/firefox_3_para_desarrolladores/index.html
+++ /dev/null
@@ -1,283 +0,0 @@
----
-title: Firefox 3 para desarrolladores
-slug: Firefox_3_para_desarrolladores
-tags:
-  - Firefox 3
-translation_of: Mozilla/Firefox/Releases/3
----
-<div>{{FirefoxSidebar}}</div><p>Si eres un desarrollador que intenta ponerse al día con todas las nuevas características de Firefox 3, este es el lugar perfecto para empezar. Este artículo proporciona una lista de nuevos artículos que tratan sobre las características añadidas a Firefox 3. Aunque no cubre necesariamente todos los pequeños cambios, te ayudará a conocer mejor las mejoras más importantes.</p>
-
-<p> </p>
-
-<h3 id="Caracter.C3.ADsticas_nuevas_para_desarrolladores_en_Firefox_3" name="Caracter.C3.ADsticas_nuevas_para_desarrolladores_en_Firefox_3">Características nuevas para desarrolladores en Firefox 3</h3>
-
-<h4 id="Para_desarrolladores_de_sitios_y_aplicaciones_web" name="Para_desarrolladores_de_sitios_y_aplicaciones_web">Para desarrolladores de sitios y aplicaciones web</h4>
-
-<dl>
- <dt><a href="/es/Actualizar_aplicaciones_web_para_Firefox_3" title="es/Actualizar_aplicaciones_web_para_Firefox_3">Actualizar aplicaciones web para Firefox 3</a></dt>
- <dd>Información sobre los cambios que se podrían necesitar para realizar un sitio o aplicación web y sacarle mayor ventaja a las nuevas características de Firefox 3.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Eventos_online_y_offline" title="es/Eventos_online_y_offline">Eventos online y offline</a></dt>
- <dd>Firefox 3 implementa los eventos conectado y desconectado definidos por WHATWG, que permiten a aplicaciones y extensiones descubrir si una conexión activa de internet es disponible, además de detectar cuando hay conexión o desconexión.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/DOM/window.navigator.registerProtocolHandler" title="es/DOM/window.navigator.registerProtocolHandler">Manipuladores de protocolo web</a></dt>
- <dd>Ahora se puede registrar una aplicación web como manipulador de protocolo con el método <code>navigator.registerProtocolHandler()</code>.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Dibujar_texto_usando_canvas" title="es/Dibujar_texto_usando_canvas">Dibujar texto usando canvas</a></dt>
- <dd>Ahora se puede dibujar texto en canvas con una API no estándar implementada por Firefox 3.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Tutorial_de_Canvas/Transformaciones#Transformaciones" title="es/Tutorial_de_Canvas/Transformaciones#Transformaciones">Gestión de transformaciones en canvas</a></dt>
- <dd>Firefox 3 administra los métodos <code>transform()</code> y <code>setTransform()</code> en canvases (lienzos).</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/El_uso_de_microformatos" title="es/El_uso_de_microformatos">El uso de microformatos</a></dt>
- <dd>Firefox 3 tiene APIs que permiten trabajar con microformatos.</dd>
-</dl>
-
-<p><span class="comment">;<a href="/es/Hojas_de_estilo_alternativas">Hojas de estilo alternativas</a> :Firefox 3 implementa modelos alternativos de hojas de estilo API de objeto CSS.</span></p>
-
-<dl>
- <dt><a href="/es/Eventos_arrastrar_y_soltar" title="es/Eventos_arrastrar_y_soltar">Eventos arrastrar y soltar</a></dt>
- <dd>Firefox 3 implementa nuevos eventos que se envían al nodo de origen cuando la operación de arrastre comienza y termina.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Gestión_del_foco_en_HTML" title="es/Gestión_del_foco_en_HTML">Gestión del foco en HTML</a></dt>
- <dd>Se han implementado los atributos <code>activeElement</code> y <code>hasFocus</code> de la nueva especificación HTML 5.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Recursos_en_modo_desconectado_en_Firefox" title="es/Recursos_en_modo_desconectado_en_Firefox">Recursos en modo desconectado en Firefox</a></dt>
- <dd>Firefox 3 permite ahora que las aplicaciones web soliciten que recursos puedan ser puestos en cache para ser ejecutados en modo desconectado.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Mejoras_CSS_en_Firefox_3" title="es/Mejoras_CSS_en_Firefox_3">Mejoras CSS en Firefox 3</a></dt>
- <dd>Firefox 3 ofrece un número de mejoras en su implementación de CSS.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Mejoras_DOM_en_Firefox_3" title="es/Mejoras_DOM_en_Firefox_3">Mejoras DOM en Firefox 3</a></dt>
- <dd>Firefox 3 ofrece mejoras en la implementación de DOM, incluyendo la gestión de varias extensiones de Internet Explorer al DOM.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Novedades_en_JavaScript_1.8" title="es/Novedades_en_JavaScript_1.8">Implementación de JavaScript 1.8</a></dt>
- <dd>Firefox 3 ofrece JavaScript 1.8.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/EXSLT" title="es/EXSLT">Implementación de EXSLT</a></dt>
- <dd>Firefox 3 permite la utilización de una parte importante de las extensiones <a href="/es/EXSLT" title="es/EXSLT">EXSLT</a> y <a href="/es/XSLT" title="es/XSLT">XSLT</a>.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Mejoras_SVG_en_Firefox_3" title="es/Mejoras_SVG_en_Firefox_3">Mejoras SVG en Firefox 3</a></dt>
- <dd>La implementación a SVG en Firefox 3 ha sido mejorada de manera significante, con muchos nuevos filtros, elementos, atributos y otras mejoras.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Gráficos_PNG_animados" title="es/Gráficos_PNG_animados">Gráficos PNG animados</a></dt>
- <dd>Firefox 3 administra las imágenes animadas en formato PNG (APNG).</dd>
-</dl>
-
-<h4 id="Para_desarrolladores_de_XUL_y_de_extensiones" name="Para_desarrolladores_de_XUL_y_de_extensiones">Para desarrolladores de XUL y de extensiones</h4>
-
-<h5 id="Cambios_y_mejoras_notables" name="Cambios_y_mejoras_notables">Cambios y mejoras notables</h5>
-
-<dl>
- <dt><a href="/es/Actualizar_extensiones_para_Firefox_3" title="es/Actualizar_extensiones_para_Firefox_3">Actualizar extensiones para Firefox 3</a></dt>
- <dd>Una guía con las cosas que hay que hacer para poner al día una extensión para que trabaje con Firefox 3.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Mejoras_XUL_en_Firefox_3" title="es/Mejoras_XUL_en_Firefox_3">Mejoras XUL en Firefox 3</a></dt>
- <dd>Firefox 3 ofrece varios nuevos elementos XUL, incluyendo escaleras deslizables, selectores de hora y fecha, y botones de incremento.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Plantillas_en_Firefox_3" title="es/Plantillas_en_Firefox_3">Plantillas en Firefox 3</a></dt>
- <dd>Las plantillas han sido notablemente mejoradas en Firefox 3. Las mejoras más importantes es la posibilidad de usar procesadores de solicitud personalizada para permitir el uso de otras fuentes de datos que RDF.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Versionado,_actualización_y_compatibilidad_de_extensiones#Asegurando_las_actualizaciones" title="es/Versionado,_actualización_y_compatibilidad_de_extensiones#Asegurando_las_actualizaciones">Asegurando las actualizaciones</a></dt>
- <dd>Para proporcionar actualizaciones más seguras de los complementos a los usuarios, ahora los complementos requieren proporcionar un método seguro para obtener las actualizaciones antes de ser instaladas. Los complementos alojados en <a class="external" href="http://addons.mozilla.org">AMO</a> lo proporcionan automáticamente.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Migrar_y_usar_el_catálogo" title="es/Migrar_y_usar_el_catálogo">Migrar y usar el catálogo</a></dt>
- <dd>Un artículo sobre como migrar una extensión existente para utilizar el API de catálogo.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Mejoras_en_el_administrador_de_descargas_en_Firefox_3" title="es/Mejoras_en_el_administrador_de_descargas_en_Firefox_3">Mejoras en el gestor de descargas en Firefox 3</a></dt>
- <dd>El administrador de descargas de Firefox 3 contiene nuevas y mejoradas APIs, incluyendo la implementación de múltiples escuchas de progreso.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Uso_de_nsILoginManager" title="es/Uso_de_nsILoginManager">Uso de nsILoginManager</a></dt>
- <dd>El administrador de contraseñas ha sido reemplazado por el nuevo Login Manager.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/XBL/Referencia_de_XBL_1.0/Elementos#binding" title="es/XBL/Referencia_de_XBL_1.0/Elementos#binding">Integración de los vínculos XBL</a></dt>
- <dd>Ya es posible utilizar el protocolo URL <code>data:</code> para integrar directamente los vínculos XBL en lugar de tener que colocarlos en un archivo XML por separado.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Traducir_las_descripciones_de_las_extensiones" title="es/Traducir_las_descripciones_de_las_extensiones">Traducir las descripciones de las extensiones</a></dt>
- <dd>Firefox 3 ofrece un nuevo método localizando add-on metadata. Esto permite que los detalles localizados estén disponibles tan pronto como los add-on han sido descargados, al igual que cuando el add-on sea desinstalado.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Localización_y_Plurales" title="es/Localización_y_Plurales">Localización y plurales</a></dt>
- <dd>Firefox 3 dispone del nuevo módulo PluralForm, el cual sirve para ayudar a poner correctamente en plural las palabras según el idioma local.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Cambios_en_los_temas_de_Firefox_3" title="es/Cambios_en_los_temas_de_Firefox_3">Cambios en los temas de Firefox 3</a></dt>
- <dd>Notas e información para quienes quisiera crear temas para Firefox 3.</dd>
-</dl>
-
-<h5 id="Nuevos_componentes_y_funcionalidades" name="Nuevos_componentes_y_funcionalidades">Nuevos componentes y funcionalidades</h5>
-
-<dl>
- <dt><a href="/es/FUEL" title="es/FUEL">Biblioteca FUEL</a></dt>
- <dd>FUEL sirve para facilitar la productividad de los desarrolladores de extensiones, reduciendo algunas formalidades de XPCOM y colocando algunas ideas "modernas" en JavaScript.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Catálogo" title="es/Catálogo">Catálogo</a></dt>
- <dd>Las APIS del historial y de los marcadores han sido remplazadas completamente por la nueva API del <a href="/es/Catálogo" title="es/Catálogo">Catálogo</a>.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/nsIIdleService" title="es/nsIIdleService">Servicio idle</a></dt>
- <dd>Firefox 3 ofrece la nueva interfaz {{ Interface("nsIIdleService") }}, la cual permite a las extensiones determinar cuánto tiempo ha pasado desde que el usuario pulso una tecla o movió el ratón por última vez.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/El_convertidor_ZIP" title="es/El_convertidor_ZIP">El convertidor ZIP</a></dt>
- <dd>La nueva interfaz <code>nsIZipWriter</code> permite a las extensiones crear archivos ZIP.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Zoom_a_página_completa" title="es/Zoom_a_página_completa">Zoom a página completa</a></dt>
- <dd>Firefox 3 mejora la experiencia de usuario ofreciendo zoom a página completa además de zoom de solo texto.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/El_colector_de_ciclo_XPCOM" title="es/El_colector_de_ciclo_XPCOM">El colector de ciclo XPCOM</a></dt>
- <dd>El código XPCOM puede beneficiarse del colector de ciclo, el cual ayuda a asegurar que la memoria no utilizada es liberada y evitar fugas de memoria.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/El_administrador_de_hilos" title="es/El_administrador_de_hilos">El administrador de hilos</a></dt>
- <dd>Firefox 3 proporciona la nueva interfaz {{ Interface("nsIThreadManager") }}, así como otras nuevas interfaces para hilos y eventos de hilos, los cuales proporcionan una manera apropiada de crear y administrar hilos en tu código.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Módulos_JavaScript" title="es/Módulos_JavaScript">Módulos JavaScript</a></dt>
- <dd>Firefox 3 ofrece un nuevo mecanismo de código compartido que te permite crear módulos facilmente en JavaScript que pueden ser cargados por extensiones y aplicaciones para su uso, muy parecido a las librerías compartidas.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/NsIJSON" title="es/NsIJSON">La interfaz nsIJSON</a></dt>
- <dd>Firefox 3 ofrece la nueva interface {{ Interface("nsIJSON") }}, which offers high-performance encoding and decoding of JSON strings.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/NsIParentalControlsService" title="es/NsIParentalControlsService">La interfaz nsIParentalControlsService</a></dt>
- <dd>Ahora Firefox 3 implementa las características del control parental de Microsoft Windows Vista, y permite al cñodigo interactuar con él.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Usar_las_preferencias_de_contenido" title="es/Usar_las_preferencias_de_contenido">Usar las preferencias de contenido</a></dt>
- <dd>Firefox 3 incluye un nuevo servicio para obtener y fijar configuraciones especificas para cada sitio web que pueden usar tanto las extensiones como el código principal para llevar un registro de las preferencias de usuarios en sitios individuales.</dd>
-</dl>
-
-<dl>
- <dt><a href="/es/Vigilancia_de_plugins" title="es/Vigilancia_de_plugins">Vigilancia de plugins</a></dt>
- <dd>Está disponible un nuevo componente del sistema de plugins para controlar el tiempo que les toma a los plugins (como por ejemplo: Macromedia Flash) ejecutar sus llamadas.</dd>
-</dl>
-
-<h3 id="Bugs_ya_solucionados" name="Bugs_ya_solucionados">Bugs ya solucionados</h3>
-
-<dl>
- <dt><a href="/es/Bugs_importantes_solucionados_en_Firefox_3" title="es/Bugs_importantes_solucionados_en_Firefox_3">Bugs importantes solucionados en Firefox 3</a></dt>
-</dl>
-
-<h3 id="Nuevas_caracter.C3.ADsticas_para_el_usuario_final" name="Nuevas_caracter.C3.ADsticas_para_el_usuario_final">Nuevas características para el usuario final</h3>
-
-<h4 id="Mejoras_para_el_usuario" name="Mejoras_para_el_usuario">Mejoras para el usuario</h4>
-
-<ul>
- <li><strong>Gestión más sencilla de contraseñas.</strong> En la parte superior de la ventana del navegador aparece una barra de información que permitirá guardar las contraseñas después de iniciar la sesión.</li>
- <li><strong>Instalación simplificada de complementos.</strong> Ahora, instalar extensiones de terceros se hace en menos pasos porque se ha eliminado el filtro de los sitios de confianza para la descarga de complementos.</li>
- <li><strong>Nuevo administrador de descargas.</strong> El administrador de descargas facilita el acceso a los archivos descargados.</li>
- <li><strong>Reanudar descargas.</strong> Podemos reanudar las descargas al reiniciar el navegador o la conexión a la red.</li>
- <li><strong>Vista a pantalla completa.</strong> Podemos aumentar o reducir el tamaño de todo el contenido de la página desde el menú Ver o con los atajos de teclado. Estas modificaciones de tamaño se aplicarán tanto al texto como a las imágenes.</li>
- <li><strong>Desplazamiento y menú rápido de pestañas.</strong> Las pestañas son más fáciles de identificar gracias a su nueva característica de desplazamiento y menú rápido.</li>
- <li><strong>Guardar lo que estamos haciendo.</strong> En Firefox 3, una ventana emergente nos preguntará si queremos guardar las pestañas abiertas antes de cerrar.</li>
- <li><strong>Comportamiento de la opción "Abrir en pestañas".</strong> Al abrir una carpeta de marcadores en pestañas, las pestañas nuevas no sustituyen a las que están abiertas sino que se suman a ellas.</li>
- <li><strong>Barra de direcciones y de búsquedas más simples de dimensionar.</strong> Modificar el tamaño de la barra de dirección y de búsquedas se hace fácilmente con el icono que aparece entre ellas.</li>
- <li><strong>Mejoras en la selección de texto.</strong> Podemos seleccionar varias secciones de texto con la tecla Control 'Ctrl' (Comando en Macintosh), un doble clic y arrastrar lo hará palabra por palabra y un triple clic agarrará un párrafo entero.</li>
- <li><strong>Barra de búsqueda.</strong> La barra de búsqueda funciona también sobre la selección actual.</li>
- <li><strong>Administración de plugins.</strong> El usuario puede deshabilitar el o los plugins que desea en el administrador de complementos.</li>
- <li><strong>Integración con Windows Vista.</strong> Los menús de Firefox se muestran utilizando el tema nativo de Vista.</li>
- <li><strong>Integración con Mac OS X.</strong> Firefox 3 utiliza el corrector ortográfico de Mac OS X y permite usar <a class="external" href="http://growl.info/">Growl</a> para la notificación de descargas completadas y actualizaciones disponibles.</li>
- <li><strong>Botón estrella.</strong> El nuevo botón con forma de estrella en la barra de direcciones añade un marcador nuevo con un solo clic, un segundo clic permite ordenar y etiquetarlo.</li>
- <li><strong>Etiquetas.</strong> Permiten clasificar los marcadores por temas asignándoles palabras clave.</li>
- <li><strong>Barra de búsqueda local y autocompletado.</strong> Sirve para buscar una página en el historial y los marcadores. Lo iconos, marcadores y etiquetas permiten ver la ubicación de los resultados mostrados.</li>
- <li><strong>Carpeta de marcadores inteligentes.</strong> La carpeta de marcadores inteligentes de Firefox permite acceder rápidamente a los últimos sitios etiquetados o añadidos a marcadores, así como las páginas visitadas con frecuencia.</li>
- <li><strong>Administrador de marcadores e historial.</strong> La creación de un único administrador para los marcadores y el historial permite buscar en ambos con múltiples vistas y carpetas inteligentes para almacenar búsquedas frecuentes.</li>
- <li><strong>Administradores de protocolos Web.</strong> Las aplicaciones web, como los proveedores de correo electrónico, se pueden utilizar en vez de aplicaciones de escritorio para administrar los enlaces <code>mailto:</code> de otras webs. También se prestan gestiones similares para otros protocolos. (Aviso: las aplicaciones Web deben estar registradas en Firefox para que funcione).</li>
- <li><strong>Acciones de descarga fáciles de usar.</strong> El nuevo panel de preferencias de aplicaciones proporciona una interfaz de usuario mejorada para configurar los administradores de varios tipos de archivos y esquemas de protocolo.</li>
- <li><strong>Apariencia y entorno mejorados.</strong> La gestión gráfica y de las fuentes ha sido mejorada para que las páginas web se vean con más calidad, incluidas la nitidez del texto y la mayor compatibilidad con fuentes complejas. Además, gracias a este nuevo aspecto de Firefox, los usuarios de Mac y Linux (Gnome) lo encontrarán más parecido a una aplicación nativa de su propio sistema.</li>
- <li><strong>Gestión del color.</strong> Al establecer la preferencia <code>gfx.color_management.enabled</code> en <code>about:config</code>, haremos que Firefox utilice los perfiles de color integrados en las imágenes para que se adapten a la configuración de nuestra pantalla.</li>
- <li><strong>Funcionamiento en modo desconectado.</strong> Las aplicaciones Web pueden beneficiarse de nuevas características que permiten utilizarlas sin estar conectado a Internet.</li>
-</ul>
-
-<h4 id="Seguridad_y_privacidad" name="Seguridad_y_privacidad">Seguridad y privacidad</h4>
-
-<ul>
- <li><strong>Información con un clic.</strong> ¿Quiere tener más información sobre el sitio Web que estás visitando? Haciendo clic en el icono del sitio en la barra de direcciones veremos a quién pertenece. La información de identificación se muestra de forma clara y es más fácil de entender que nunca.</li>
- <li><strong>Protección contra malware.</strong> Firefox 3 avisa cuando se entra en una Web que instala virus, spyware, troyanos, u otro software peligroso (conocido como malware). Puede ver un ejemplo <a class="link-https" href="https://www.mozilla.com/firefox/its-an-attack.html">aquí</a>.</li>
- <li><strong>Protección mejorada contra páginas Web que intentan suplantar tu identidad.</strong> Cuando visite una página sospechosa de suplantación se mostrará en su lugar una página especial con una advertencia. Puede ver un ejemplo <a class="link-https" href="https://www.mozilla.com/firefox/its-a-trap.html">aquí</a>.</li>
- <li><strong>Mensajes de error SSL fáciles de entender.</strong> Ahora cuando aparezca un mensaje de error por certificado SSL incorrecto comprenderá más fácil en qué consiste el problema.</li>
- <li><strong>Protección contra complementos desactualizados.</strong> Firefox 3 comprueba automáticamente los plugins y complementos, deshabilitando las versiones más antiguas y peligrosas.</li>
- <li><strong>Actualizaciones seguras de complementos.</strong> Se ha mejorado la seguridad en la actualización de complementos al obligarlos a proporcionar un mecanismo seguro de actualización.</li>
- <li><strong>Integración con antivirus.</strong> Firefox 3 envía un informe al antivirus cuando se descargan archivos ejecutables.</li>
- <li><strong>Compatible con el control paterno de Windows Vista.</strong> Firefox 3 es compatible con la función para deshabilitar la descarga de archivos del control paterno de Vista.</li>
-</ul>
-
-<h4 id="Rendimiento" name="Rendimiento">Rendimiento</h4>
-
-<ul>
- <li><strong>Fiabilidad.</strong> Firefox 3 almacena marcadores, historial, cookies, y preferencias usando un formato transaccional de base de datos seguro. Es decir, tus datos no se perderán aunque tengas una caída del sistema.</li>
- <li><strong>Velocidad.</strong> Se ha mejorado el rendimiento de Firefox 3 al sustituir totalmente la parte del software que controla el aspecto gráfico, así como el modo de gestionar los formatos de página.</li>
- <li><strong>Reducción de consumo de memoria.</strong> Firefox 3 es más eficaz que nunca gracias a la corrección de unos 300 fallos de fuga de memoria y nuevas características que ayudan a localizar y eliminar automáticamente los bloques con fuga de memoria.</li>
-</ul>
-
-<h3 id="Lecturas_relacionadas" name="Lecturas_relacionadas">Lecturas relacionadas</h3>
-
-<ul>
- <li><a href="/es/Actualizar_extensiones_para_Firefox_3" title="es/Actualizar_extensiones_para_Firefox_3">Actualizar extensiones para Firefox 3</a></li>
- <li><a href="/es/Actualizar_aplicaciones_web_para_Firefox_3" title="es/Actualizar_aplicaciones_web_para_Firefox_3">Actualizar aplicaciones web para Firefox 3</a></li>
- <li><a href="/es/Firefox_2_para_desarrolladores" title="es/Firefox_2_para_desarrolladores">Firefox 2 para desarrolladores</a></li>
- <li><a href="/es/Firefox_1.5_para_Desarrolladores" title="es/Firefox_1.5_para_Desarrolladores">Firefox 1.5 para Desarrolladores</a></li>
-</ul>
-
-<p> </p>
-
-<p>{{ languages( { "en": "en/Firefox_3_for_developers", "fr": "fr/Firefox_3_pour_les_d\u00e9veloppeurs", "ja": "ja/Firefox_3_for_developers", "ko": "ko/Firefox_3_for_developers", "pl": "pl/Firefox_3_dla_programist\u00f3w", "pt": "pt/Firefox_3_para_desenvolvedores", "zh-tw": "zh_tw/Firefox_3_for_developers" } ) }}</p>
diff --git a/files/es/firefox_addons_developer_guide/introduction_to_extensions/index.html b/files/es/firefox_addons_developer_guide/introduction_to_extensions/index.html
deleted file mode 100644
index 1261f4d562..0000000000
--- a/files/es/firefox_addons_developer_guide/introduction_to_extensions/index.html
+++ /dev/null
@@ -1,159 +0,0 @@
----
-title: 'Capítulo 1: Introducción a las extensiones.'
-slug: Firefox_addons_developer_guide/Introduction_to_Extensions
----
-<div>
- {{ Draft() }}</div>
-<p>{{ PreviousNext("Firefox_addons_developer_guide", "Firefox_addons_developer_guide/Technologies_used_in_developing_extensions") }}</p>
-<div class="note">
- <strong>Note: </strong>If you want contribute to this document please following guidelines from the <a class="internal" href="/en-US/docs/Firefox_addons_developer_guide/Contribute" title="En/Firefox_addons_developer_guide/Contribute">Contribute</a> page.</div>
-<p><em>Este documento fue escrito por </em><a class="external" href="http://level.s69.xrea.com/mozilla/" title="http://level.s69.xrea.com/mozilla/"><em>Hideyuki Emura</em></a><em> y publicado originalmente en japonés para el </em><a class="link-https" href="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English" title="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English"><em>Firefox Developers Conference Summer 2007</em></a><em>. Emura-san es un coautor de <a class="external" href="http://www.oreilly.co.jp/books/9784873113753/index.html" title="http://www.oreilly.co.jp/books/9784873113753/index.html">Firefox 3 Hacks</a> (O'Reilly Japan, 2008.)</em></p>
-<h2 id="Introducción">Introducción</h2>
-<p>Si estás leyendo esta guía, probablemente has utilizado firefox antes. Tal vez la primera vez que viste firefox, es posible que te hayas sorprendido al ver que tiene una estructurara mucho más simple que otros navegadores con muchas funciones, como Opera o Safari.</p>
-<p>¿Qué características son consideradas estándar para los navegadores en estos días? Tal vez cosas como controles de pestañas, movimientos del ratón, barras de herramientas y botones, un lector de feed, integración con una variedad de aplicaciones web, o herramientas sofisticadas para ayudar al diseño web. Pero nosotros no teníamos la intención de crear un navegador todo-en uno que pueda satisfacer a todos</p>
-<p>En cambio, Firefox puede soportar estas características a través de las extensiones. El núcleo del navegador se limita a las funciones básicas, algo que puede hacer sentirse cómodo a un principiante, pero los usuarios que quieren algo más pueden instalar las extensiones.</p>
-<h2 id="Acerca_de_las_extensiones">Acerca de las extensiones</h2>
-<h3 id="Administrador_de_complementos">Administrador de complementos</h3>
-<p>El administrador de complementos de firefox es una excelente manera para manejar las extensiones y es muy fácil de usar.</p>
-<p><img alt="" class="internal" src="/@api/deki/files/3818/=addons-manager.png" style="width: 563px; height: 462px;"></p>
-<p>El Administrador de complementos se encarga de las siguientes tareas:</p>
-<ul>
- <li>Instalaciones y desintalaciones seguras de complementos.</li>
- <li>Verifica que el complemento sea compatible con la versión de firefox que estás usando.</li>
- <li>Maneja listas blancas de sitios de confianza para la instalación de complementos.</li>
- <li>Ayuda a solucionar problemas de complementos inhabilitándolos y faciliar un modo seguro.</li>
- <li>Confirma y ejecuta actualizaciones.</li>
- <li>Provee acceso a los diálogos de configuración del complemento.</li>
- <li>Provee acceso a las páginas web de asistencia de los complementos.</li>
-</ul>
-<h3 id="Características_del_entorno_de_desarrollo">Características del entorno de desarrollo</h3>
-<p>Inicialmente, no había suficiente documentación disponible, y los desarrolladores de extensiones quedaron en gran medida a su suerte; sin embargo, ahora hay un cuantioso depósito de conocimiento.</p>
-<p>Debido a que Firefox y sus extensiones están diseñadas para soportar multiples idiomas, excelentes extensiones vienen de todo el mundo, y pueden ser localizadas rápidamente por cualquier persona que esté interesada.</p>
-<p>Ésto facilita el uso y el desarrollo de extensiones; este hecho, combinado con la popularidad creciente de firefox, ha creado un búcle de realimentación positiva, y un crecimiento explosivo del número de usuarios  y desarrolladores de las extensiones. Hay ahora más de 7000 extensiones y temas publicados en la página web de complementos de firefox. (<a class="link-https" href="https://addons.mozilla.org" rel="freelink">https://addons.mozilla.org</a>).</p>
-<h2 id="¿Qué_podemos_hacer_con_las_extensiones">¿Qué podemos hacer con las extensiones?</h2>
-<p>Echemos un vistazo a que características pueden añadir las extensiones y algunos ejemplos reales de ellas.</p>
-<h3 id="Extensiones_solo_con_una_función.">Extensiones solo con una función.</h3>
-<p>{{ TODO("Update this") }}.</p>
-<p>Éstas son extensiones relativamente simples que añaden solo una función.</p>
-<dl>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/1939/" title="https://addons.mozilla.org/firefox/1939/">Enlace de texto</a></dt>
- <dd>
-  Makes it so that double-clicking on an unlinked URL follows that URL.</dd>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/3082/" title="https://addons.mozilla.org/firefox/3082/">Botón para abrir pestañas cerradas</a></dt>
- <dd>
-  <span id="Dst[0][0:3:0:4]">Añade</span><span> </span><span id="Dst[0][5:5:6:7]">un</span><span> </span><span id="Dst[0][15:20:9:13]">botón</span><span> en la </span><span id="Dst[0][7:13:18:38]">barra de herramientas</span><span> </span><span id="Dst[0][22:23:40:43]">para</span><span> </span><span id="Dst[0][25:31:45:58]">volver a abrir</span><span> </span><span id="Dst[0][33:35:60:62]">las</span><span> </span><span id="Dst[0][58:61:64:71]">pestañas</span><span> </span><span id="Dst[0][51:56:73:80]">cerradas</span><span> </span><span id="Dst[0][42:49:86:98]">más recientemente</span><span> </span><span id="Dst[0][63:64:100:101]">en</span><span> </span><span id="Dst[0][66:68:103:104]">el</span><span> </span><span id="Dst[0][78:81:106:109]">menú del</span><span> </span><span id="Dst[0][70:76:111:119]">historial.</span></dd>
-</dl>
-<dl>
- <dd>
-  <img alt="1211576231.png" class="internal default" src="/@api/deki/files/3316/=1211576231.png" style="width: 340px; height: 317px;"></dd>
-</dl>
-<dl>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/4014/" title="https://addons.mozilla.org/firefox/4014/">Barra de la dirección</a></dt>
- <dd>
-  <div>
-   <span id="Dst[0][0:8:0:5]">Separa</span><span> </span><span id="Dst[0][18:23:18:24]">el dominio</span><span> </span><span id="Dst[0][25:27:26:26]">y</span><span> la ruta de </span><span id="Dst[0][29:32:36:41]">acceso</span><span> de una URL para facilitar su lectura </span><span id="Dst[0][34:35:43:44]">en</span><span> </span><span id="Dst[0][37:39:46:47]">la</span><span> </span><span id="Dst[0][50:52:49:53]">barra</span><span> de </span><span id="Dst[0][41:48:58:68]">direcciones</span><span>.</span></div>
- </dd>
- <dd>
-  <img alt="locationbar.png" class="internal default" src="/@api/deki/files/3317/=locationbar.png" style="width: 200px; height: 150px;"></dd>
-</dl>
-<h3 id="Feature_enhancing_extensions">Feature enhancing extensions</h3>
-<p>{{ TODO("Update this") }}.</p>
-<p>These extensions enhance features that already exist in Firefox.</p>
-<dl>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/1122/" title="https://addons.mozilla.org/firefox/1122/">Tab Mix Plus</a></dt>
- <dd>
-  Offers detailed tab-related settings.</dd>
- <dt>
-  <a class="external" href="http://prefbar.mozdev.org/" title="http://prefbar.mozdev.org/">PrefBar</a></dt>
- <dd>
-  Gives access to numerous preferences from the toolbar.<img alt="PrefBar.png" class="internal default" src="/@api/deki/files/3371/=PrefBar.png" style="width: 843px; height: 113px;"></dd>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/722/" title="https://addons.mozilla.org/firefox/722/">NoScript</a></dt>
- <dd>
-  Enables and disables JavaScript execution on a site-by-site basis.</dd>
-</dl>
-<h3 id="Web_application_integration_extensions">Web application integration extensions</h3>
-<p>{{ TODO("Update this") }}.</p>
-<p>The use the APIs of certain web applications to provide certain pieces of information.</p>
-<p><img alt="Forecastfox.png" class="internal default" src="/@api/deki/files/3372/=Forecastfox.png" style="width: 359px; height: 94px;"></p>
-<h3 id="New_feature_extensions">New feature extensions</h3>
-<p>{{ TODO("Update this") }}.</p>
-<p>Extensions can add completely new features to Firefox. This class of extension requires a greater level of knowledge and programming ability.</p>
-<dl>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/748/" title="https://addons.mozilla.org/firefox/748/">GreaseMonkey</a></dt>
- <dt>
-  <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=397735" title="http://forums.mozillazine.org/viewtopic.php?t=397735">UserChrome.js</a></dt>
- <dd>
-  Both of these provide an environment for running user scripts (JavaScript) in Firefox itself, where the scripts can target specific websites.</dd>
-</dl>
-<dl>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/1865/" title="https://addons.mozilla.org/firefox/1865/">Adblock Plus</a></dt>
- <dd>
-  Blocks the display of unwanted advertisements on web pages.</dd>
- <dt>
-  <a class="link-https" href="https://addons.mozilla.org/firefox/12/" title="https://addons.mozilla.org/firefox/12/">All-in-One Gestures</a></dt>
- <dd>
-  Adds mouse-gesture functionality.</dd>
-</dl>
-<h3 id="Application_level_extensions">Application level extensions</h3>
-<p>{{ TODO("Update this") }}.</p>
-<p>These are sophisticated extensions that can be considered full-scale applications in their own right, essentially using Firefox as the development platform.</p>
-<p><img alt="Firebug.gif" class="internal default" src="/@api/deki/files/3373/=Firebug.gif" style="width: 712px; height: 336px;"></p>
-<h3 id="One-trick_gag_extensions">One-trick gag extensions</h3>
-<p>{{ TODO("Update this") }}.</p>
-<p>There are a number of one-trick gag extensions that aren’t very useful.</p>
-<p><img alt="Shiitake Mushroom (1).png" class="internal default" src="/@api/deki/files/3375/=Shiitake%20Mushroom%20(1).png" style="width: 200px; height: 150px;"></p>
-<p>This is a very brief survey of a few extensions, but there are many other unique extensions available.</p>
-<p><strong>Table 1: Advanced customization methods for Firefox</strong></p>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Customization Method</td>
-   <td class="header">Does it work for web sites?</td>
-   <td class="header">Does it work for Firefox?</td>
-  </tr>
-  <tr>
-   <td>User style sheets (change appearance through CSS)</td>
-   <td>
-    <p>Yes; you can change the <code>userContent.css</code> file, or use the Stylish extension.</p>
-   </td>
-   <td>
-    <p>Yes; you can change the <code>userChrome.css</code> file, or use the Stylish extension.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>User scripts (change appearance and functionality through JavaScript)</td>
-   <td>
-    <p>Yes; you can use the GreaseMonkey extension or "bookmarklets."</p>
-   </td>
-   <td>
-    <p>Yes; you can change <code>userChrome.js</code> to add functionality through JavaScript.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Extensions (these can do anything)</td>
-   <td>Yes</td>
-   <td>Yes</td>
-  </tr>
-  <tr>
-   <td>Theming (this changes the look of the browser)</td>
-   <td>No</td>
-   <td>Yes</td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Vamos_a_construir_una_extensión">Vamos a construir una extensión</h2>
-<p>La tabla 1 muestra varias opciones de personalización disponibles para un usuario en firefox. Los usuarios tienen opciones de personalicación Flexibles, usando CSS en las hojas de estilo del usuario y javaScript/DOM en los script del usuario.</p>
-<p>En adición a CSS y Javascript, las extensiones pueden tomar ventajas de las tecnologías XUL y XPCOM para características más sofisticadas. Temas, los cuales pueden alterar la apariencia de firefox, son un tipo de complemento.</p>
-<p>Para crear una extension, necesitas una idea y sólo un poco de abilidad programando. Los siguientes capítulos explicaremos con detalles las tecnicas para escribir extensiones.</p>
-<div class="footnotes">
- <div class="note" id="footnote1">
-  <a href="#from_footnote1">1</a> One of the authors of this special edition, Piro, is world-famous as one of the original developers.</div>
-</div>
-<p>{{ PreviousNext("Firefox_addons_developer_guide", "Firefox_addons_developer_guide/Technologies_used_in_developing_extensions") }}</p>
diff --git a/files/es/firefox_addons_developer_guide/technologies_used_in_developing_extensions/index.html b/files/es/firefox_addons_developer_guide/technologies_used_in_developing_extensions/index.html
deleted file mode 100644
index 92188c9df8..0000000000
--- a/files/es/firefox_addons_developer_guide/technologies_used_in_developing_extensions/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: 'Chapter 2: Technologies used in developing extensions'
-slug: Firefox_addons_developer_guide/Technologies_used_in_developing_extensions
----
-<p>{{ Draft() }} {{ PreviousNext("Firefox addons developer guide/Introduction to Extensions", "Firefox addons developer guide/Introduction_to_XUL—How_to_build_a_more_intuitive_UI") }}</p>
-<p><em>This document was authored by <a class="external" href="http://piro.sakura.ne.jp/" title="http://piro.sakura.ne.jp/">Hiroshi Shimoda</a> of </em><a class="external" href="http://www.clear-code.com/" title="http://www.clear-code.com/"><em>Clear Code Inc.</em></a><em> and was originally published in Japanese for the </em><a class="link-https" href="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English" title="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English"><em>Firefox Developers Conference Summer 2007</em></a><em>. Shimoda-san </em><em>is a co-author of <a class="external" href="http://www.oreilly.co.jp/books/9784873113753/index.html" title="http://www.oreilly.co.jp/books/9784873113753/index.html">Firefox 3 Hacks</a> (O'Reilly Japan, 2008).</em></p>
-<p>Antes de sumergirse en una explicación, rápidamente nos introduciremos en las tecnologías utilizadas para desarrollar extensiones en firefox. Nosotros también conoceremos los conocimientos míminos que se necesitan para desarrollar una extensión para firefox.</p>
-<h2 id="Tecnologías_utilizadas_para_desarrollar_extensiones_para_Firefox">Tecnologías utilizadas para desarrollar extensiones para Firefox</h2>
-<p>Firefox y sus extensiones están ambos basados en el desarrollo con tecnologías ampliamente usadas en la web. Su estructura es similar a la de HTML dynamico usado en algunas páginas webs, or el HTML de aplicaciones usado en Windows. Si tienes experiencia desarrollando HTML dinamico, Tú probablemente lo encontrarás relativamente fácil desarrollar una extensión para Firefox.</p>
-<h2 id="El_rol_de_cada_tecnología">El rol de cada tecnología</h2>
-<p>Firefox está construido en gran parte con cuatro tecnologías: XUL, CSS, Javascript y XPCOM. Las extensiones también están construidas usando esas cuatros tecnologías.</p>
-<p><strong>Figure 1: rol de cada tecnología en firefox.</strong></p>
-<p><img alt="" class="internal" src="/@api/deki/files/3762/=chap2_fig1.png" style="width: 740px; height: 350px;"></p>
-<p>En addition a esas tecnologías, el desarrollo de una extensión requerira que aprendas sobre como otorgar priviligos para vence priviligios de restricciones de seguridad en el código que escribistes, y como insertar tu codigo dentro de Firefox UI. Estos errores son discutidos en el <a class="internal" href="/En/Firefox_addons_developer_guide/Let's_build_a_Firefox_extension" title="En/Firefox addons developer guide/Let's build a Firefox extension">Capítulo 5</a>.</p>
-<h2 id="Conocimientos_básicos_requeridos">Conocimientos básicos requeridos</h2>
-<p>En el interest de brevedad, Vamos a omitir explicaciones de tecnologías, y nos enfocaremos en la introducción de nuevas tecnologías que necesitarás entender para desarrollar para Firefox. Asumimos que tu tienes esperiencia desarrollando con HTML dinamico, así como de los temas a continuación.<br>
-  Para más información sobre estas tecnologías, por favor consulte otras fuentes.</p>
-<ul>
-  <li><a class="internal" href="/en/XML" title="En/XML">XML codificación</a></li>
-  <li><a class="internal" href="/en/CSS" title="En/CSS">CSS coding</a></li>
-  <li><a class="internal" href="/en/JavaScript" title="En/JavaScript">Basic JavaScript syntax</a></li>
-</ul>
-<h3 id="XML_A_text-based_structural_language">XML: A text-based structural language</h3>
-<p> XML, siglas en inglés de <a class="external" href="http://www.w3.org/TR/REC-xml/" title="http://www.w3.org/TR/REC-xml/">eXtensible Markup Language</a> ('lenguaje de marcas extensible'), es un lenguaje de marcas desarrollado por el World Wide Web Consortium (W3C). Deriva del lenguaje SGML y permite definir la gramática de lenguajes específicos (de la misma manera que HTML es a su vez un lenguaje definido por SGML) para estructurar documentos grandes. A diferencia de otros lenguajes XML da soporte a bases de datos, siendo útil cuando varias aplicaciones se deben comunicar entre sí o integrar información. (Bases de datos Silberschatz).</p>
-<p><strong>Listing 1: XML syntax</strong></p>
-<pre class="brush: xml">&lt;elementname someattribute="somevalue"&gt;
-  content
-&lt;/elementname&gt;</pre>
-<p>As shown in Listing 1, XML uses elements, which consist of an opening tag, a closing tag, and content.</p>
-<div class="note" id="footnote2">
-  <strong>Note: </strong>Elements that take no content can be expressed in compact form as <code>&lt;elementname/&gt;.</code></div>
-<p>An element can include other elements as well as text in its content, and all information is structured as a tree. As in all trees, elements can have children (elements contained within them) and parents (elements that contain them). Attributes can also be added to opening tags, each with a value.</p>
-<p>As the "extensible" part of XML implies, elements from various XML-based languages such as XHTML and SVG can be interspersed in one another as a means to extend the language. All elements can carry a "namespace URI" identifier, which is unique for each language. For example, even though XHTML and SVG have elements with the same name, these can be distinguished. The namespace URI for XHTML is <code>"<a class="external" href="http://www.w3.org/1999/xhtml" rel="freelink">http://www.w3.org/1999/xhtml</a>"</code> ; for SVG is it "<code><a class="external" href="http://www.w3.org/2000/svg" rel="freelink">http://www.w3.org/2000/svg</a></code>".</p>
-<h3 id="CSS_A_style_language_to_alter_the_display_of_XML_documents">CSS: A style language to alter the display of XML documents</h3>
-<p>Like XML, Cascading Style Sheets (CSS) is a <a class="external" href="http://www.w3.org/Style/CSS/" title="http://www.w3.org/Style/CSS/">technical specification</a> established by the W3C; it is a style-description language defining the display of data marked up in XML and HTML. As shown in Listing 1, it has an extremely simple syntax. By separating the structure of the data, expressed through HTML or XML, and the display style, indicated by CSS, data can be reused better than it is when structural and stylistic markup are both embedded in HTML.</p>
-<p>There are three CSS specifications (Level 1 through Level 3), with progressively powerful features. The Gecko rendering engine handles nearly all of CSS Level 2 and some of CSS Level 3.</p>
-<p><strong>Listing 2: CSS code sample</strong></p>
-<pre class="brush: css">body {
-  color: black;
-  background-color: white;
-}
-p {
-  margin-bottom: 1em;
-  text-indent: 1em;
-}
-</pre>
-<h3 id="JavaScript_The_world's_most_misunderstood_language">JavaScript: The world's most misunderstood language</h3>
-<p>JavaScript is a scripting language first developed in the 1990s, at which time it was created as a way to add dynamic features to web pages. Because it was often used at first to display pop-up windows, marching text in status bars, or in other ways that made web pages less useful to users, the language acquired a reputation as having little practical use and lacking in functionality.</p>
-<p>Also, because a series of security holes were discovered in JavaScript and the compatible technology JScript, there was an initial reluctance to use JavaScript at all.</p>
-<p>Nevertheless, the rise of web services like Google Maps, which used JavaScript and asynchronous communications, created an awareness of a set of technologies nicknamed <a class="internal" href="/en/AJAX" title="En/AJAX">AJAX</a> (Asynchronous JavaScript and XML); that plus the advent of a number of libraries that paper over implementation differences between different web browsers has more recently led to a re-evaluation of JavaScript as a programming language.</p>
-<p>JavaScript is a prototype-based object-oriented language, and as shown in Listing 3, also permits independent class definitions. It does not have strict typing like Java, making it extremely flexible and giving it qualities that in some senses could be considered similar to Lisp.</p>
-<p>Firefox 3.5 includes a number of extensions to the specification standardized in ECMAScript 3rd Edition, and can use <a class="internal" href="/en/New_in_JavaScript_1.7" title="En/New in JavaScript 1.7">JavaScript 1.7</a> and <a class="internal" href="/en/New_in_JavaScript_1.8" title="En/New in JavaScript 1.8">JavaScript 1.8</a>.</p>
-<p><strong>Listing 3: An example of a class definition in JavaScript</strong></p>
-<pre class="brush: js">function MyClass() {
-}
-MyClass.prototype = {
-  property1 : true,
-  property2 : 'string',
-  method : function() {
-    alert('Hello, world!');
-  }
-};
-var obj = new MyClass();
-obj.method();
-</pre>
-<h3 id="DOM_An_API_for_manipulating_XML_documents">DOM: An API for manipulating XML documents</h3>
-<p>The <a class="internal" href="/en/DOM" title="En/DOM">Document Object Model</a> (DOM) is a <a class="external" href="http://www.w3.org/DOM/" title="http://www.w3.org/DOM/">technical standard</a> promulgated by the W3C, and is an API for manipulating the contents of XML documents as objects. In earlier dynamic HTML approaches, the typical method was to use the <code>innerHTML</code> property of the HTML element node to dynamically change the contents of the HTML document by manipulating strings, but using the DOM makes it possible to manipulate XML documents in a way that better matches JavaScript's object-oriented nature.</p>
-<p>In addition, XUL lacks any equivalent for the <code>innerHTML</code> property, so if it weren’t for the DOM, dynamic processing would be impossible.</p>
-<p>There are a number of levels to the DOM with different levels of functionality. Gecko supports nearly all of DOM Level 2 and some of DOM Level 3.</p>
-<p>With the DOM, the contents of an XML document are handled as a "DOM tree," a collection of element nodes and other nodes. Listing 4 shows an example that deletes the second child element of the element with the "toolbar" id, adds a new button element as a substitute, and sets a label attribute.</p>
-<p>We do not go into the details of the various APIs in the DOM. To learn more about the DOM, please take a look at the <a class="internal" href="/en/XUL_Tutorial/Document_Object_Model" title="En/XUL Tutorial/Document Object Model">MDC documentation</a>.</p>
-<p><strong>Listing 4: An example manipulation using the DOM</strong></p>
-<pre class="brush: js">var bar = document.getElementById('toolbar');
-bar.removeChild(bar.childNodes[1]);
-bar.appendChild(document.createElement('button'));
-bar.lastChild.setAttribute('label', 'Hello!');
-</pre>
-<p>{{ PreviousNext("Firefox addons developer guide/Introduction to Extensions", "Firefox addons developer guide/Introduction_to_XUL—How_to_build_a_more_intuitive_UI") }}</p>
diff --git a/files/es/formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio/index.html b/files/es/formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio/index.html
deleted file mode 100644
index 478990b1a1..0000000000
--- a/files/es/formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: Formatos multimedia admitidos por los elementos de audio y video
-slug: Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio
-tags:
-  - Firefox
-  - HTML5
-  - Multimedia
-  - formatos de audio
-  - formatos multimedia
-  - para_revisar
----
-<p>{{ gecko_minversion_header("1.9.1") }}</p>
-<p>Gecko 1.9.1 admite los elementos <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/" title="http://www.whatwg.org/specs/web-apps/current-work/">HTML 5</a> <a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a> y <a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a>, los cuales proporcionan una compatibilidad integrada para la reproducción de medios de audio y video sin necesidad de instalar plug-ins. Este artículo aborda los formatos que son compatibles al implementar Gecko estos elementos .</p>
-<h2 id="Formatos_multimedia_compatibles">Formatos multimedia compatibles</h2>
-<p>Actualmente Gecko admite audio en formato WAVE así como contenedores Ogg con audio codificado en Vorbis y/o video Theora.</p>
-<div class="geckoVersionNote">
-<p>{{ gecko_callout_heading("2.0") }}</p>
-<p>A partir de Gecko 2.0 se admite también el formato de medios WebM. <a class=" external" href="http://www.webmproject.org/" title="http://www.webmproject.org/">WebM</a> usa el códec V8 para video y Vorbis para audio.</p>
-</div>
-<h3 id="Contenedores_WAVE">Contenedores WAVE</h3>
-<p>Gecko admite audio en contenedores WAVE; los archivos de este tipo suelen terminar en la extensión ".wav". Actualmente sólo se admite el códec "1" (PCM) .</p>
-<div class="note"><strong>Nota: </strong>Consulta <a class="external" href="http://www.rfc-editor.org/rfc/rfc2361.txt" title="http://www.rfc-editor.org/rfc/rfc2361.txt">RFC 2361</a> para el registro de códecs WAVE.</div>
-<h4 id="Tipos_MIME_reconocidos_para_audio_WAVE">Tipos MIME reconocidos para audio WAVE</h4>
-<p>Gecko reconoce que los siguientes tipos MIME representan archivos de audio WAVE.</p>
-<ul> <li><code>audio/wave</code> (preferido)</li> <li><code>audio/wav</code></li> <li><code>audio/x-wav</code></li> <li><code>audio/x-pn-wav</code></li>
-</ul>
-<p>{{ h2_gecko_minversion("WebM", 2) }}</p>
-<p><a class=" external" href="http://www.webmproject.org/" title="http://www.webmproject.org/">WebM</a> es un formato nuevo, basado en estándares abiertos, para la presentación de video en la web. Usa VP8 para video y Vorbis para audio, en un contenedor basado en <a class=" external" href="http://corecodec.com/products/matroska" title="http://corecodec.com/products/matroska">Matroska</a>.</p>
-<h4 id="Tipos_MIME_reconocidos_para_medios_WebM">Tipos MIME reconocidos para medios WebM</h4>
-<p>Gecko reconoce que los siguientes tipos MIME representan archivos de medios WebM.</p>
-<dl> <dt><code>video/webm</code></dt> <dd>Un archivo de medios WebM que contiene video (y posiblemente audio también).</dd> <dt><code>audio/webm</code></dt> <dd>Un archivo de medios WebM que contiene solamente audio.</dd>
-</dl>
-<h3 id="Contenedores_Ogg">Contenedores Ogg</h3>
-<p>Gecko también admite contenedores Ogg, que pueden contener audio y/o video. Gecko admite el códec Vorbis para audio Ogg y los códecs Theora y <a class=" external" href="http://wiki.xiph.org/OggYUV" title="http://wiki.xiph.org/OggYUV">OggYUV</a> para video.</p>
-<p>Puedes saber más acerca de la creación de medios Ogg si lees el <a class="external" href="http://en.flossmanuals.net/TheoraCookbook" title="http://en.flossmanuals.net/TheoraCookbook">Theora Cookbook</a>.</p>
-<h4 id="Tipos_MIME_reconocidos_para_medios_Ogg">Tipos MIME reconocidos para medios Ogg</h4>
-<p>Gecko reconoce que los siguientes tipos MIME son archivos Ogg.</p>
-<dl> <dt><code>audio/ogg</code></dt> <dd>Un archivo Ogg que contiene sólo audio.</dd> <dt><code>video/ogg</code></dt> <dd>Un archivo Ogg que contiene video (y posiblemente audio también).</dd> <dt><code>application/ogg</code></dt> <dd>Un archivo Ogg con contenido sin especificar. Es preferible usar uno de los otros dos tipo MIME pero puedes usarlo si no sabes cuáles son los contenidos del archivo.</dd>
-</dl>
-<h2 id="Consulta_también">Consulta también</h2>
-<ul> <li><a class="internal" href="/es/Usando_audio_y_video_en_Firefox" title="Es/Usando audio y video en Firefox">Usar audio y video en Firefox</a></li> <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#media-elements" title="http://www.whatwg.org/specs/web-apps/current-work/#media-elements">Elementos multimedia</a> (especificación HTML 5)</li> <li><code><a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video">video</a></code></li> <li><a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a></li>
-</ul>
-<p>{{ languages( { "en": "en/Media_formats_supported_by_the_audio_and_video_elements" } ) }}</p>
diff --git a/files/es/fragmentos_de_código/index.html b/files/es/fragmentos_de_código/index.html
deleted file mode 100644
index 89f586d8f3..0000000000
--- a/files/es/fragmentos_de_código/index.html
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Fragmentos de código
-slug: Fragmentos_de_código
-tags:
-  - Add-ons
-  - extensiones
-  - fragmentos de código
----
-<p>Esta es una lista rápida de fragmentos de código útiles (pequeñas muestras de código) disponible para los desarrolladores de extensiones para las diversas aplicaciones de Mozilla. Muchas de estas muestras también pueden ser usados en aplicaciones XULRunner, así como en el propio código de Mozilla.</p>
-<p>Estos ejemplos demuestran cómo lograr tareas básicas que podrían no ser evidentes a simple vista.</p>
-<h2 id="Browser-oriented_code">Código orientado al Navegador</h2>
-<dl> <dt><a href="/es/Code_snippets/Tabbed_browser" title="es/Code_snippets/Tabbed_browser">Código del navegador con pestañas</a> (Firefox/SeaMonkey)</dt> <dd>Operaciones básicas, tales como la carga de la página en el navegador con pestañas, que es el corazón de las aplicaciones del navegador Mozilla.</dd> <dt>
-</dt></dl>
diff --git a/files/es/funciones/index.html b/files/es/funciones/index.html
deleted file mode 100644
index 8fdf449542..0000000000
--- a/files/es/funciones/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: Funciones
-slug: Funciones
-tags:
-  - Funciones
----
-<p>Aquí necesitamos una lista completa de Funciones de XPCOM, algo parecido a la lista de <a href="es/Interfaces">Interfaces</a>.
-</p>
diff --git a/files/es/games/herramients/asm.js/index.html b/files/es/games/herramients/asm.js/index.html
deleted file mode 100644
index bd41ed70a3..0000000000
--- a/files/es/games/herramients/asm.js/index.html
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: asm.js
-slug: Games/Herramients/asm.js
-tags:
-  - JavaScript
-  - asm.js
-translation_of: Games/Tools/asm.js
----
-<div>{{GamesSidebar}}</div>
-
-<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<div class="summary">
-<p><span class="seoSummary"><a href="http://asmjs.org/">Asm.js</a> es un subconjunto de JavaScript que es altamente optimizable. Este artículo analiza exactamente lo que está permitido en el subconjunto asm.js, las mejoras que confiere, donde y cómo puedo utilizarlo, y otros recursos y ejemplos.</span></p>
-</div>
-
-<h2 id="¿Qué_es_asm.js_exactamente">¿Qué es asm.js exactamente?</h2>
-
-<p>Es un subconjunto muy pequeño y estricto de JavaScript que solo permite cosas como `while`, `if`, números, funciones con nombres de nivel superior y otras construcciones simples. No permite objetos, cadenas, cierres y básicamente cualquier cosa que requiera una asignación de la pila. El código asm.js se parece al lenguaje de programación "C" en muchos aspectos, pero es JavaScript completamente válido que se ejecuta en todos los motores actuales. Impulsa los motores JS para optimizar este tipo de código, y le da a los compiladores como Emscripten una definición clara de qué tipo de código generar. A continuación, mostraremos cómo es un código asm.js y explicaremos cómo le ayuda y cómo puede usarlo.</p>
-
-<p>Este subconjunto de JavaScript ya está altamente optimizado en muchos motores de JavaScript que utilizan técnicas de compilación Just-In-Time (JIT) sofisticadas. Sin embargo, al definir un estándar tan explícito, podemos trabajar en la optimización de este tipo de código aún más y obtener el máximo rendimiento posible. Facilita la colaboración en múltiples motores JS porque es fácil de comparar. La idea es que este tipo de código se ejecute muy rápido en cada motor, y si no lo hace, es que hay un error y es un claro mensaje de que los motores deben optimizarse.</p>
-
-<p>También facilita la tarea de las personas que escriben compiladores que desean generar código de alto rendimiento en la web. Pueden consultar las especificaciones de asm.js para saber que se ejecutará rápidamente si se adhieren a los patrones de asm.js. Emscripten, un compilador de C/C++ a JavaScript, genera código asm.js para que funcione con un rendimiento casi nativo en varios navegadores.</p>
-
-<p>Además, si un motor elige reconocer especialmente código asm.js, se pueden realizar aún más optimizaciones. Firefox es el único navegador que hace esto ahora.</p>
-
-<h2 id="Resumen_del_lenguaje_asm.js">Resumen del lenguaje asm.js</h2>
-
-<p>asm.js es un lenguaje de programación intermedio. Tiene una tasa de rendimiento muy predecible porque está limitada a un subconjunto extremadamente restringido de JavaScript que proporciona solo enteros, números en coma flotante, aritmética, llamadas a funciones y accesos de pila de tipo estricto. Las características de rendimiento son más cercanas al código nativo que las de JavaScript estándar. El uso del subconjunto de JavaScript asm.js ya es compatible con los principales navegadores web. Como asm.js se ejecuta en un navegador, depende en gran medida del navegador y del hardware.</p>
diff --git a/files/es/games/herramients/index.html b/files/es/games/herramients/index.html
deleted file mode 100644
index e09812b07d..0000000000
--- a/files/es/games/herramients/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Herramientas para desarrolladores de juegos
-slug: Games/Herramients
-tags:
-  - NeedsContent
-  - NeedsTranslation
-  - aplicaciones
-  - juegos
-translation_of: Games/Tools
----
-<div>{{GamesSidebar}}</div><div class="summary">
- <p><span class="seoSummary">En esta pagina puedes encontrar enlaces a nuestros articulos de desarrollo de juegos, que enventualmente apuenta a cubrir frameworks, compiladores y herramientas de depuracion.</span></p>
-</div>
-<dl>
- <dt>
-  <a href="/en-US/docs/Games/Tools/asm.js">asm.js</a></dt>
- <dd>
-  asm.js es una subconjunto muy limitado del lenguaje Javascript que puede ser en gran medida optimizado y correr en modo compilador <em>ahead-of-time</em> (AOT) para un mejor rendimiento que el rendimiento tipico de JavaScript. Este es, por supuesto, bueno para juegos.</dd>
- <dt>
-  <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a></dt>
- <dd>
-  <p>Un compilador <em>LLVM</em> a JavaScript; con Emscripten, tu puedes compilar C++ y otros lenguajes que se pueden compilar a<em> LLVM</em> y luego a JavaScript de alto rendimiento. Es una buena herramiente para portar aplicaciones a la Web! Aqui hay un <a href="https://github.com/kripken/emscripten/wiki/Tutorial">util tutorial sobre Emscripten</a> disponible en la wiki. Estamos <a href="/en-US/docs/Emscripten">mirando cubrir Emscripten en su propia seccion de MDN</a>.</p>
- </dd>
- <dt>
-  <a href="https://addons.mozilla.org/en-us/firefox/addon/gecko-profiler/" title="https://addons.mozilla.org/en-us/firefox/addon/gecko-profiler/">Gecko profiler</a></dt>
- <dd>
-  <em>Gecko profiler</em> es una extension que te permite perfilar tu codigo para ayudar donde tienes errores de rendimiento, asi puedes hacer que tu juego corra a velocidad maxima.</dd>
- <dt>
-  <a href="/en-US/docs/Games/Tools/Engines_and_tools">Motores de juegos y herramientas</a></dt>
- <dd>
-  Una lista de motores, plantillas y tecnologias utiles para los desarrolladores de juegos.</dd>
- <dt>
-  <a href="/en-US/docs/Mozilla/Projects/Shumway">Shumway</a></dt>
- <dd>
-  <em>Shumway</em> es un renderizador para Adobe Flash construido completamente con JavaScript, WebGL, entre otros, haciendo una brecha entre Flash y los estandares Web. Este articulo muestra como hacer uso de Shumway y como contribuir arreglos y errores al proyecto.</dd>
- <dt>
-  Cadena de herramientas para desarrollar y depurar juegos</dt>
- <dd>
-  Como difieren de depurar una Web app normal? Que herramientas especializadas estan disponibles? Un lote de esto va a ser cubierto por Will en <a href="/en-US/docs/Tools">herramientas</a>, pero aqui te vamos a proveer una cadena de herramientas practicas para depurar juegos con links a las cosas de Will:
-  <ul>
-   <li>Basic tools overview</li>
-   <li><a href="/en-US/docs/Tools/Shader_Editor">Shader editor</a></li>
-   <li>Performance tools (still in production, estimated early 2014)</li>
-  </ul>
- </dd>
-</dl>
diff --git a/files/es/games/introduccion/index.html b/files/es/games/introduccion/index.html
deleted file mode 100644
index b19ea1a61e..0000000000
--- a/files/es/games/introduccion/index.html
+++ /dev/null
@@ -1,167 +0,0 @@
----
-title: Introduccion para desarrollo de juegos para la Web
-slug: Games/Introduccion
-tags:
-  - Firefox OS
-  - juegos
-  - moviles
-translation_of: Games/Introduction
----
-<div>{{GamesSidebar}}</div>
-
-<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<div>La Web rapidamente se ha convertido en una plataforma viable no solo para crear impresionantes juegos de alta calidad, sino también para distruibuirlos.</div>
-
-<div></div>
-
-<div>El rango de juegos que pueden ser creados está a la par tanto de los juegos de escritorio como de SO nativos (Android, iOS). Con tecnologias Web modernas y un navegador reciente es totalmente posible hacer juegos de primera categoria para la Web. Y no estamos hablando sobre simples juegos de cartas o juegos sociales multijugadores que en tiempos anteriores se podian hacer con Flash®. Estamos hablando sobre juegos 3D <em>shooters</em> de accion, RPGs, y más. Gracias a las masivas mejoras de rendimiento en <a href="/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a>  con tecnologia de compilación <em>just-in-time</em> y nuevas APIs, se pueden construir juegos que pueden correr en el navegador (o en dispositivos <a href="/en-US/docs/HTML/HTML5" title="/en-US/docs/HTML/HTML5">HTML5</a> como <a href="/en-US/docs/Mozilla/Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a>) sin problemas.</div>
-
-<h2 id="La_plataforma_de_juegos_HTML5">La plataforma de juegos HTML5</h2>
-
-<p>Puedes pensar en la Web como una mejor opción de plataforma para desarrollar tu juego. Como nos gusta decir, "la Web es la plataforma". Hechemos un vistazo al nucleo de la plataforma Web:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Funcion</th>
-   <th scope="col">Tecnología</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><strong>Audio</strong></td>
-   <td><a href="/es/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">Web Audio API</a></td>
-  </tr>
-  <tr>
-   <td><strong>Graficos</strong></td>
-   <td><a href="/es/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a> (<a href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0)</td>
-  </tr>
-  <tr>
-   <td><strong>Entrada</strong></td>
-   <td><a href="/es/docs/DOM/Touch_events" title="/en-US/docs/DOM/Touch_events">Touch events</a>, <a href="/en-US/docs/API/Gamepad/Using_Gamepad_API" title="/en-US/docs/API/Gamepad/Using_Gamepad_API">Gamepad API</a>, device sensors, <a href="/es/docs/Web/API/WebRTC_API" title="/en-US/docs/WebRTC">WebRTC</a>, <a href="/es/docs/DOM/Using_fullscreen_mode" title="/en-US/docs/DOM/Using_fullscreen_mode">Full Screen API</a>, <a href="/es/docs/WebAPI/Pointer_Lock" title="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a></td>
-  </tr>
-  <tr>
-   <td><strong>Lenguaje</strong></td>
-   <td><a href="/es/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a> (o C/C++ usando <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a> para compilar a JavaScript)</td>
-  </tr>
-  <tr>
-   <td><strong>Redes</strong></td>
-   <td><a href="/es/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> and/or <a href="/es/docs/WebSockets" title="/en-US/docs/WebSockets">WebSockets</a></td>
-  </tr>
-  <tr>
-   <td><strong>Almacenamiento</strong></td>
-   <td><a href="/es/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a> o la "nube"</td>
-  </tr>
-  <tr>
-   <td><strong>Web</strong></td>
-   <td><a href="/es/docs/HTML" title="/en-US/docs/HTML">HTML</a>, <a href="/es/docs/CSS" title="/en-US/docs/CSS">CSS</a>, <a href="/es/docs/SVG" title="/en-US/docs/SVG">SVG</a>, <a href="/es/docs/Social_API" title="/en-US/docs/Social_API">Social API</a> (y mucho más!)</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="El_caso_de_Exito">El caso de Exito</h2>
-
-<div>Como un desarrollador de juegos, de forma individual o como un gran studio de juegos, tu quieres por que tiene sentido apuntar a la Web como tu práximo proyecto de juego. Veamos como la Web puede ayudarte.</div>
-
-<div></div>
-
-<ol>
- <li>
-  <div><span class="notranslate">El alcance de la Web es enorme;</span> <span class="notranslate"> está en todas partes.</span> <span class="notranslate"> Los juegos construidos con HTML5 funcionan en smartphones, tablets, PCs y Smart TVs.</span></div>
- </li>
- <li><span class="notranslate">Se mejoran la comercialización y la detección.</span> <span class="notranslate"> No estás limitado a promocionar tu aplicación en la tienda de aplicaciones de otra persona.</span> <span class="notranslate"> En su lugar, puede anunciar y promover su juego en toda la Web, así como en otros medios, aprovechando la inherente capacidad de enlace y capacidad de compartir de la Web para llegar a nuevos clientes.</span></li>
- <li><span class="notranslate">Usted tiene control donde importa: Pagos.</span> <span class="notranslate"> Usted no tiene que entregar más del 30% de sus ingresos a otra persona sólo porque su juego está en su ecosistema.</span> <span class="notranslate"> En su lugar, cargue lo que quiera y utilice cualquier servicio de procesamiento de pagos que le guste.</span></li>
- <li><span class="notranslate">Una vez más con más control, puedes actualizar tu juego cuando quieras.</span> <span class="notranslate"> No hay que esperar sin aliento para la aprobación, mientras que alguien oculto dentro de otra empresa decide si su solución de error crítico se enviará hoy o mañana.</span></li>
- <li><span class="notranslate">¡Controla tus análisis!</span> <span class="notranslate"> En lugar de confiar en otra persona para tomar todas las decisiones sobre qué analítica necesita, puede recoger su propia o elegir la tercera parte que más le guste para recopilar información sobre sus ventas y el alcance de su juego.</span></li>
- <li><span class="notranslate">Usted consigue manejar su relación del cliente más de cerca, en su propia manera.</span> <span class="notranslate"> No más tener comentarios de los clientes filtrados a través de los mecanismos limitados de una tienda de aplicaciones.</span> <span class="notranslate"> Involucrarse con sus clientes de la manera que desee, sin un intermediario.</span></li>
- <li><span class="notranslate">Sus jugadores pueden jugar su juego en cualquier lugar, en cualquier momento.</span> <span class="notranslate"> Debido a que la Web es omnipresente, sus clientes pueden comprobar el estado de su juego en sus teléfonos, tabletas, computadoras portátiles domésticas, sus escritorios de trabajo o cualquier otra cosa.</span></li>
-</ol>
-
-<h2 class="highlight-spanned" id="Tecnologías_web_para_desarrolladores_de_juegos_Edit"><span class="highlight-span"><span class="notranslate">Tecnologías web para desarrolladores de juegos</span> </span><a class="button section-edit only-icon" href="https://developer.mozilla.org/es/docs/Games/Introduccion$edit#Web_technologies_for_game_developers" rel="nofollow, noindex"><span>Edit</span></a></h2>
-
-<p><span class="notranslate">Para la gente de tecnología, vamos a cavar en las API que la Web aporta a la mesa que atienden a los desarrolladores de juegos. Esta es una lista exhaustiva para darle una muestra de lo que la Web puede hacer por usted:</span></p>
-
-<div class="twocolumns">
-<dl>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/Fullscreen_API" title="/ Es-ES / docs / DOM / Using_fullscreen_mode">API de pantalla completa</a></span></dt>
- <dd><span class="notranslate">Esta sencilla API permite que su juego se haga cargo de toda la pantalla, sumergiendo al jugador en acción.</span></dd>
- <dt><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/API/Gamepad/Using_Gamepad_API&amp;usg=ALkJrhhV6r_1Mvu6SOpsoQgHhJElOIWX7g" title="/ Es-ES / docs / API / Gamepad / Using_Gamepad_API">API de Gamepad</a></span></dt>
- <dd><span class="notranslate">Si desea que sus usuarios puedan usar gamepads u otros controladores de juego para trabajar su juego, necesitará esta API.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/HTML" title="/ Es-US / docs / HTML">HTML</a> y <a href="https://developer.mozilla.org/es/docs/Web/CSS" title="/ Es-ES / docs / CSS">CSS</a></span></dt>
- <dd><span class="notranslate">Juntas, estas dos tecnologías le permiten construir, diseñar y diseñar la interfaz de usuario de su juego.</span> <span class="notranslate"> Parte de HTML es el elemento <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/HTML/Elemento/canvas&amp;usg=ALkJrhhVmlLNFuUPIZvH_teRdETdIbBebw" title="Este artículo aún no se ha escrito. ¡Considere contribuir!"><code>&lt;canvas&gt;</code></a> , que proporciona una forma de hacer gráficos 2D.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/audio" title="/ Es-ES / docs / HTML / Elemento / audio">Audio HTML</a></span></dt>
- <dd><span class="notranslate">El elemento <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/HTML/Elemento/audio&amp;usg=ALkJrhjtX6Px9Gu7gkcd0fdLB1gVGNTqZQ" title="Este artículo aún no se ha escrito. ¡Considere contribuir!"><code>&lt;audio&gt;</code></a> te permite reproducir fácilmente efectos de sonido y música sencillos.</span> <span class="notranslate"> Si sus necesidades están más involucradas, echa un vistazo a la <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Web_Audio_API&amp;usg=ALkJrhgCQeHzpAri8qJ00kmc9rNqYXZzHg" title="/ Es-ES / docs / Web_Audio_API">API de audio web</a> para obtener potencia de procesamiento de audio real.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/IndexedDB-840092-dup" title="/ Es-US / docs / IndexedDB">IndexedDB</a></span></dt>
- <dd><span class="notranslate">Una poderosa API de almacenamiento de datos para mantener los datos del usuario en su propio ordenador o dispositivo.</span> <span class="notranslate"> Una gran manera de guardar el estado del juego y otra información localmente para que no tenga que ser descargado cada vez que sea necesario.</span> <span class="notranslate"> También es útil para ayudar a que su juego sea jugable incluso cuando el usuario no está conectado a la Web (por ejemplo, cuando están atrapados en un avión durante horas y horas ...).</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/JavaScript" title="/ Es-ES / docs / JavaScript">JavaScript</a></span></dt>
- <dd><span class="notranslate">JavaScript, el lenguaje de programación utilizado en la Web, está ardiendo rápido en los navegadores modernos y cada vez más rápido.</span> <span class="notranslate"> Usa su poder para escribir el código para tu juego, o mira usando tecnologías como <a class="external external-icon" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://github.com/kripken/emscripten/wiki&amp;usg=ALkJrhhAf0czxz7h2rDyV_JV7PSlfap69g" title="Https://github.com/kripken/emscripten/wiki">Emscripten</a> o <a class="external external-icon" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=http://asmjs.org/spec/latest/&amp;usg=ALkJrhh9WXUvKAZKrbEzyZxr8nWhmVHYfw" title="Http://asmjs.org/spec/latest/">Asm.js</a> para portar fácilmente tus juegos existentes.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/WebAPI/Pointer_Lock" title="/ Es-ES / docs / WebAPI / Pointer_Lock">API de bloqueo de puntero</a></span></dt>
- <dd><span class="notranslate">La API de Bloqueo de Puntero le permite bloquear el ratón u otro dispositivo señalador dentro de la interfaz de su juego para que en lugar de posicionamiento absoluto del cursor reciba deltas de coordenadas que le den medidas más precisas de lo que el usuario está haciendo e impide que el usuario envíe accidentalmente su entrada En algún otro lugar, por lo tanto falta una acción importante.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/SVG" title="/ Es-ES / docs / SVG">SVG</a> (Gráficos Vectoriales Escalables)</span></dt>
- <dd><span class="notranslate">Permite crear gráficos vectoriales que se escalan sin problemas, independientemente del tamaño o la resolución de la pantalla del usuario.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Vectores_tipados" title="/ Es-US / docs / JavaScript / Typed_arrays">Matrices Arrays</a></span></dt>
- <dd><span class="notranslate">Los arrays tipados en JavaScript le dan acceso a datos binarios sin procesar desde JavaScript;</span> <span class="notranslate"> Esto le permite manipular texturas GL, datos de juego, o cualquier otra cosa, incluso si no está en un formato JavaScript nativo.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web_Audio_API" title="/ Es-ES / docs / Web_Audio_API">API de audio web</a></span></dt>
- <dd><span class="notranslate">Esta API para controlar la reproducción, síntesis y manipulación de audio a partir de código JavaScript le permite crear efectos de sonido impresionantes, así como jugar y manipular música en tiempo real.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/WebGL_API" title="/ Es-ES / docs / WebGL">WebGL</a></span></dt>
- <dd><span class="notranslate">Permite crear gráficos 3D (y 2D) acelerados por hardware de alto rendimiento a partir del contenido Web.</span> <span class="notranslate"> Se trata de una implementación Web de <a class="external external-icon" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=http://www.khronos.org/opengles/&amp;usg=ALkJrhj7Pnj9FaaR-5oxI5CJw3N2i05Ngw" title="Http://www.khronos.org/opengles/">OpenGL ES</a> 2.0.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/WebRTC_API" title="/ En-US / docs / WebRTC">WebRTC</a></span></dt>
- <dd><span class="notranslate">La API WebRTC (Comunicaciones en tiempo real) le permite controlar los datos de audio y vídeo, incluyendo la teleconferencia y la transmisión de otros datos de la aplicación entre dos usuarios.</span> <span class="notranslate"> ¿Quieren que sus jugadores puedan hablar entre sí mientras explotan monstruos?</span> <span class="notranslate"> Esta es la API para usted.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/WebSockets_API" title="/ Es-ES / docs / WebSockets">WebSockets</a></span></dt>
- <dd><span class="notranslate">La API de WebSocket le permite conectar su aplicación o sitio a un servidor para transmitir datos de un lado a otro en tiempo real.</span> <span class="notranslate"> Perfecto para la acción de juego multijugador, servicios de chat, y así sucesivamente.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/Guide/Performance/Usando_web_workers" title="/ Es-ES / docs / DOM / Using_web_workers">Trabajadores de la Web</a></span></dt>
- <dd><span class="notranslate">Los trabajadores le dan la posibilidad de generar hilos de fondo que ejecutan su propio código JavaScript, para aprovechar los modernos procesadores multi-núcleo.</span></dd>
- <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/XMLHttpRequest" title="/ Es-US / docs / DOM / XMLHttpRequest">XMLHttpRequest</a> y <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/DOM/File_API&amp;usg=ALkJrhjS1RWLb9XbCcHs-KcDniPTbC4fcw" title="/ Es-US / docs / DOM / File_API">API de archivos</a></span></dt>
- <dd><span class="notranslate">La combinación de XMLHttpRequest y la API de archivos le permiten enviar y recibir cualquier tipo de datos que desee (no deje que el "XML" te lance!) Desde un servidor Web.</span> <span class="notranslate"> Esta es una gran manera de hacer cualquier cosa desde la descarga de nuevos niveles de juego y obras de arte a la transmisión de información de estado de juego en tiempo no real de ida y vuelta.</span></dd>
-</dl>
-</div>
-
-<aside class="helpful-survey" id="helpful-survey">
-<p><span class="notranslate">¿Te resultó útil este artículo?</span></p>
-
-<div class="helpful-survey-content">
-<div class="helpful-survey-buttons"></div>
-</div>
-</aside>
-
-<div class="column-half wiki-column text-content" id="wiki-content">
-<article id="wikiArticle">
-<aside class="helpful-survey" id="helpful-survey">
-<div class="helpful-survey-content">
-<div class="helpful-survey-thankyou"><span class="notranslate">Gracias</span></div>
-</div>
-</aside>
-</article>
-
-<div class="wiki-block contributors">
-<h2 class="offscreen" id="Etiquetas_y_colaboradores_del_documento"><span class="notranslate">Etiquetas y colaboradores del documento</span></h2>
-
-<div class="tag-attach-list contributors-sub"><span class="notranslate"><strong>Etiquetas:</strong></span>
-
-<ul class="tags tags-small">
- <li><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/tag/Firefox%2520OS&amp;usg=ALkJrhiMz60hq0NctaBY3vvrFB_d0qOW4A" rel="nofollow, noindex">Firefox OS</a></span></li>
- <li><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/tag/juegos&amp;usg=ALkJrhgDjdxSwGCqqR9onHjg5aeHWXOtZQ" rel="nofollow, noindex">Juegos</a></span></li>
- <li><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/tag/moviles&amp;usg=ALkJrhh4FtxUHYR70IVPrUF4PGeh5CrfcA" rel="nofollow, noindex">Moviles</a></span></li>
-</ul>
-</div>
-
-<div class="contributors-sub"><span class="notranslate"><strong>Colaboradores en esta página:</strong> <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/profiles/Albizures&amp;usg=ALkJrhgWRBfS71scMhWnz4J-PjnFKsFIBA">Albizures</a> , <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/profiles/atlas7jean&amp;usg=ALkJrhgzALymuEYfsd8CnptuoTY4OCPMWw">atlas7jean</a></span></div>
-
-<div class="contributors-sub"><span class="notranslate"><strong>Última actualización por:</strong> <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/profiles/Albizures&amp;usg=ALkJrhgWRBfS71scMhWnz4J-PjnFKsFIBA">Albizures</a> ,</span> <time datetime="2014-10-16T13:58:46-07:00"> <span class="notranslate"> 16 oct.</span> <span class="notranslate"> 2014 13:58:46</span> </time></div>
-</div>
-</div>
-
-<div class="column-strip wiki-column" id="wiki-left">
-<nav class="zone-subnav-container">
-<div class="subnav" id="Subnav">
-<ol class="accordion">
- <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/Games/Introduccion&amp;usg=ALkJrhiT8uSw5K2TSW051FTS2G9ftOFnZQ#">Introducción</a></span></li>
- <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/Games/Introduccion&amp;usg=ALkJrhiT8uSw5K2TSW051FTS2G9ftOFnZQ#">API para el desarrollo de juegos</a></span></li>
- <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Games/Techniques&amp;usg=ALkJrhjTEqvKzu-maArgaCVGov9Q1DC62g">Técnicas</a></span></li>
- <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Games/Tutorials&amp;usg=ALkJrhi4A0KaxMCbPvV5D8_zjT3bnOfGaA">Tutoriales</a></span></li>
- <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Games/Publishing_games&amp;usg=ALkJrhgQiYOYtL4GRD4H7y3qveRGSfUqvg">Publicar juegos</a></span></li>
-</ol>
-</div>
-</nav>
-</div>
diff --git a/files/es/games/introducción_al_desarrollo_de_juegos_html5_(resumen)/index.html b/files/es/games/introducción_al_desarrollo_de_juegos_html5_(resumen)/index.html
deleted file mode 100644
index dcbaca6422..0000000000
--- a/files/es/games/introducción_al_desarrollo_de_juegos_html5_(resumen)/index.html
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: Introducción al desarrollo de juegos HTML5 (resumen)
-slug: Games/Introducción_al_desarrollo_de_juegos_HTML5_(resumen)
-tags:
-  - Firefox OS
-  - HTML5
-  - Móvil
-  - juegos
-translation_of: Games/Introduction_to_HTML5_Game_Development_(summary)
----
-<div>{{GamesSidebar}}</div>
-
-<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<div>
-<h2 id="Ventajas" style="line-height: 30px;">Ventajas</h2>
-
-<ol>
- <li><span class="seoSummary">Los juegos hechos con HTML5 funcionan en smartphones, tabletas, PCs y Smart TVs.</span></li>
- <li>Anuncia y promociona tu juego en toda la web, así como en otros medios.</li>
- <li>Pagos. Carga lo que quieras y usa el servicio de procesamiento de pagos que desees.</li>
- <li><span class="seoSummary">Actualiza tu juego cuando quieras.</span></li>
- <li>¡Colecciona tus propios análisis!</li>
- <li>Conécta con tus clientes más de cerca.</li>
- <li><span class="seoSummary">Los jugadores pueden jugar el juego en cualquier lugar, en cualquier momento.</span></li>
-</ol>
-
-<h2 id="Tecnologías_Web" style="line-height: 30px;">Tecnologías Web</h2>
-</div>
-
-<div> </div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col" style="text-align: left;"><strong>Funcionalidad</strong></th>
-   <th scope="col" style="text-align: left;"><strong>Tecnología</strong></th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><strong>Audio</strong></td>
-   <td><a href="/en-US/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">Web Audio API</a></td>
-  </tr>
-  <tr>
-   <td><strong>Graphics</strong></td>
-   <td><a href="/en-US/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a> (<a href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0)</td>
-  </tr>
-  <tr>
-   <td><strong>Input</strong></td>
-   <td><a href="/en-US/docs/DOM/Touch_events" title="/en-US/docs/DOM/Touch_events">Touch events</a>, <a href="/en-US/docs/API/Gamepad/Using_Gamepad_API" title="/en-US/docs/API/Gamepad/Using_Gamepad_API">Gamepad API</a>, sensores del dispositivo, <a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a>, <a href="/en-US/docs/DOM/Using_fullscreen_mode" title="/en-US/docs/DOM/Using_fullscreen_mode">Full Screen API</a>, <a href="/en-US/docs/WebAPI/Pointer_Lock" title="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a></td>
-  </tr>
-  <tr>
-   <td><strong>Language</strong></td>
-   <td><a href="/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a> (o C/C++ usando <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a> para compilar a JavaScript)</td>
-  </tr>
-  <tr>
-   <td><strong>Networking</strong></td>
-   <td><a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> y/o <a href="/en-US/docs/WebSockets" title="/en-US/docs/WebSockets">WebSockets</a></td>
-  </tr>
-  <tr>
-   <td><strong>Storage</strong></td>
-   <td><a href="/en-US/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a> o la "nube"</td>
-  </tr>
-  <tr>
-   <td><strong>Web</strong></td>
-   <td><a href="/en-US/docs/HTML" title="/en-US/docs/HTML">HTML</a>, <a href="/en-US/docs/CSS" title="/en-US/docs/CSS">CSS</a>, <a href="/en-US/docs/SVG" title="/en-US/docs/SVG">SVG</a>, <a href="/en-US/docs/Social_API" title="/en-US/docs/Social_API">Social API</a> (¡y muchos más!)</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="twocolumns">
-<dl>
- <dt><a href="/en-US/docs/DOM/Using_fullscreen_mode" title="/en-US/docs/DOM/Using_fullscreen_mode">Full Screen API</a></dt>
- <dd>Juego de pantalla completa.</dd>
- <dt><a href="/en-US/docs/API/Gamepad/Using_Gamepad_API" title="/en-US/docs/API/Gamepad/Using_Gamepad_API">Gamepad API</a></dt>
- <dd>Utiliza gamepads u otros controladores de juego.</dd>
- <dt><a href="/en-US/docs/HTML" title="/en-US/docs/HTML">HTML</a> y <a href="/en-US/docs/CSS" title="/en-US/docs/CSS">CSS</a></dt>
- <dd>Crea, diseña y diseña la interfaz de usuario de tu juego.</dd>
- <dt><a href="/en-US/docs/HTML/Element/audio" title="/en-US/docs/HTML/Element/audio">HTML audio</a></dt>
- <dd>Juega fácilmente efectos de sonido simples y música.</dd>
- <dt><a href="/en-US/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a></dt>
- <dd>Almacena los datos del usuario en tu propio ordenador o dispositivo.</dd>
- <dt><a href="/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a></dt>
- <dd>Rápido lenguaje de programación web para escribir el código de tu juego.<br>
- Para portar fácilmente tus juegos existentes en <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a> o <a href="http://asmjs.org/spec/latest/" title="http://asmjs.org/spec/latest/">Asm.js</a></dd>
- <dt><a href="/en-US/docs/WebAPI/Pointer_Lock" title="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a></dt>
- <dd>Bloquea el ratón u otro dispositivo señalador dentro de la interfaz de tu juego.</dd>
- <dt><a href="/en-US/docs/SVG" title="/en-US/docs/SVG">SVG</a> (Scalable Vector Graphics)</dt>
- <dd>Cree gráficos vectoriales que se escalan sin problemas, independientemente del tamaño o la resolución de la pantalla del usuario.</dd>
- <dt><a href="/en-US/docs/JavaScript/Typed_arrays" title="/en-US/docs/JavaScript/Typed_arrays">Typed Arrays</a></dt>
- <dd>Accede a datos binarios sin procesar desde JavaScript; Manipula texturas GL, datos de juegos, o cualquier otra cosa.</dd>
- <dt><a href="/en-US/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">Web Audio API</a></dt>
- <dd>Controla la reproducción, síntesis y manipulación del audio en tiempo real.</dd>
- <dt><a href="/en-US/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a></dt>
- <dd>Cree gráficos 3D (y 2D) acelerados por hardware y de alto rendimiento. <a href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0.</dd>
- <dt><a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a></dt>
- <dd>Las comunicaciones en tiempo real para controlar los datos de audio y video, incluidas las teleconferencias y la transmisión de datos de otras aplicaciones entre dos usuarios, como el chat.</dd>
- <dt><a href="/en-US/docs/WebSockets" title="/en-US/docs/WebSockets">WebSockets</a></dt>
- <dd>Conecte tu aplicación o sitio a un servidor para transmitir datos de un lado a otro en tiempo real. Perfecto para la acción de juegos multijugador, servicios de chat, etc.</dd>
- <dt><a href="/en-US/docs/DOM/Using_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web Workers</a></dt>
- <dd>Genere hilos de fondo ejecutando tu propio código JavaScript para procesadores multi-core.</dd>
- <dt><a href="/en-US/docs/DOM/XMLHttpRequest" title="/en-US/docs/DOM/XMLHttpRequest">XMLHttpRequest</a> y <a href="/en-US/docs/DOM/File_API" title="/en-US/docs/DOM/File_API">File API</a></dt>
- <dd>Envía y recibe cualquier tipo de información que desees desde un servidor web, como descargar nuevos niveles de juego y material gráfico para transmitir información de estado del juego en tiempo no real.</dd>
-</dl>
-</div>
-
-<p> </p>
diff --git a/files/es/games/introduction/index.html b/files/es/games/introduction/index.html
new file mode 100644
index 0000000000..60f96afec0
--- /dev/null
+++ b/files/es/games/introduction/index.html
@@ -0,0 +1,168 @@
+---
+title: Introduccion para desarrollo de juegos para la Web
+slug: Games/Introduction
+tags:
+  - Firefox OS
+  - juegos
+  - moviles
+translation_of: Games/Introduction
+original_slug: Games/Introduccion
+---
+<div>{{GamesSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<div>La Web rapidamente se ha convertido en una plataforma viable no solo para crear impresionantes juegos de alta calidad, sino también para distruibuirlos.</div>
+
+<div></div>
+
+<div>El rango de juegos que pueden ser creados está a la par tanto de los juegos de escritorio como de SO nativos (Android, iOS). Con tecnologias Web modernas y un navegador reciente es totalmente posible hacer juegos de primera categoria para la Web. Y no estamos hablando sobre simples juegos de cartas o juegos sociales multijugadores que en tiempos anteriores se podian hacer con Flash®. Estamos hablando sobre juegos 3D <em>shooters</em> de accion, RPGs, y más. Gracias a las masivas mejoras de rendimiento en <a href="/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a>  con tecnologia de compilación <em>just-in-time</em> y nuevas APIs, se pueden construir juegos que pueden correr en el navegador (o en dispositivos <a href="/en-US/docs/HTML/HTML5" title="/en-US/docs/HTML/HTML5">HTML5</a> como <a href="/en-US/docs/Mozilla/Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a>) sin problemas.</div>
+
+<h2 id="La_plataforma_de_juegos_HTML5">La plataforma de juegos HTML5</h2>
+
+<p>Puedes pensar en la Web como una mejor opción de plataforma para desarrollar tu juego. Como nos gusta decir, "la Web es la plataforma". Hechemos un vistazo al nucleo de la plataforma Web:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Funcion</th>
+   <th scope="col">Tecnología</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><strong>Audio</strong></td>
+   <td><a href="/es/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">Web Audio API</a></td>
+  </tr>
+  <tr>
+   <td><strong>Graficos</strong></td>
+   <td><a href="/es/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a> (<a href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0)</td>
+  </tr>
+  <tr>
+   <td><strong>Entrada</strong></td>
+   <td><a href="/es/docs/DOM/Touch_events" title="/en-US/docs/DOM/Touch_events">Touch events</a>, <a href="/en-US/docs/API/Gamepad/Using_Gamepad_API" title="/en-US/docs/API/Gamepad/Using_Gamepad_API">Gamepad API</a>, device sensors, <a href="/es/docs/Web/API/WebRTC_API" title="/en-US/docs/WebRTC">WebRTC</a>, <a href="/es/docs/DOM/Using_fullscreen_mode" title="/en-US/docs/DOM/Using_fullscreen_mode">Full Screen API</a>, <a href="/es/docs/WebAPI/Pointer_Lock" title="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a></td>
+  </tr>
+  <tr>
+   <td><strong>Lenguaje</strong></td>
+   <td><a href="/es/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a> (o C/C++ usando <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a> para compilar a JavaScript)</td>
+  </tr>
+  <tr>
+   <td><strong>Redes</strong></td>
+   <td><a href="/es/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> and/or <a href="/es/docs/WebSockets" title="/en-US/docs/WebSockets">WebSockets</a></td>
+  </tr>
+  <tr>
+   <td><strong>Almacenamiento</strong></td>
+   <td><a href="/es/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a> o la "nube"</td>
+  </tr>
+  <tr>
+   <td><strong>Web</strong></td>
+   <td><a href="/es/docs/HTML" title="/en-US/docs/HTML">HTML</a>, <a href="/es/docs/CSS" title="/en-US/docs/CSS">CSS</a>, <a href="/es/docs/SVG" title="/en-US/docs/SVG">SVG</a>, <a href="/es/docs/Social_API" title="/en-US/docs/Social_API">Social API</a> (y mucho más!)</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="El_caso_de_Exito">El caso de Exito</h2>
+
+<div>Como un desarrollador de juegos, de forma individual o como un gran studio de juegos, tu quieres por que tiene sentido apuntar a la Web como tu práximo proyecto de juego. Veamos como la Web puede ayudarte.</div>
+
+<div></div>
+
+<ol>
+ <li>
+  <div><span class="notranslate">El alcance de la Web es enorme;</span> <span class="notranslate"> está en todas partes.</span> <span class="notranslate"> Los juegos construidos con HTML5 funcionan en smartphones, tablets, PCs y Smart TVs.</span></div>
+ </li>
+ <li><span class="notranslate">Se mejoran la comercialización y la detección.</span> <span class="notranslate"> No estás limitado a promocionar tu aplicación en la tienda de aplicaciones de otra persona.</span> <span class="notranslate"> En su lugar, puede anunciar y promover su juego en toda la Web, así como en otros medios, aprovechando la inherente capacidad de enlace y capacidad de compartir de la Web para llegar a nuevos clientes.</span></li>
+ <li><span class="notranslate">Usted tiene control donde importa: Pagos.</span> <span class="notranslate"> Usted no tiene que entregar más del 30% de sus ingresos a otra persona sólo porque su juego está en su ecosistema.</span> <span class="notranslate"> En su lugar, cargue lo que quiera y utilice cualquier servicio de procesamiento de pagos que le guste.</span></li>
+ <li><span class="notranslate">Una vez más con más control, puedes actualizar tu juego cuando quieras.</span> <span class="notranslate"> No hay que esperar sin aliento para la aprobación, mientras que alguien oculto dentro de otra empresa decide si su solución de error crítico se enviará hoy o mañana.</span></li>
+ <li><span class="notranslate">¡Controla tus análisis!</span> <span class="notranslate"> En lugar de confiar en otra persona para tomar todas las decisiones sobre qué analítica necesita, puede recoger su propia o elegir la tercera parte que más le guste para recopilar información sobre sus ventas y el alcance de su juego.</span></li>
+ <li><span class="notranslate">Usted consigue manejar su relación del cliente más de cerca, en su propia manera.</span> <span class="notranslate"> No más tener comentarios de los clientes filtrados a través de los mecanismos limitados de una tienda de aplicaciones.</span> <span class="notranslate"> Involucrarse con sus clientes de la manera que desee, sin un intermediario.</span></li>
+ <li><span class="notranslate">Sus jugadores pueden jugar su juego en cualquier lugar, en cualquier momento.</span> <span class="notranslate"> Debido a que la Web es omnipresente, sus clientes pueden comprobar el estado de su juego en sus teléfonos, tabletas, computadoras portátiles domésticas, sus escritorios de trabajo o cualquier otra cosa.</span></li>
+</ol>
+
+<h2 class="highlight-spanned" id="Tecnologías_web_para_desarrolladores_de_juegos_Edit"><span class="highlight-span"><span class="notranslate">Tecnologías web para desarrolladores de juegos</span> </span><a class="button section-edit only-icon" href="https://developer.mozilla.org/es/docs/Games/Introduccion$edit#Web_technologies_for_game_developers" rel="nofollow, noindex"><span>Edit</span></a></h2>
+
+<p><span class="notranslate">Para la gente de tecnología, vamos a cavar en las API que la Web aporta a la mesa que atienden a los desarrolladores de juegos. Esta es una lista exhaustiva para darle una muestra de lo que la Web puede hacer por usted:</span></p>
+
+<div class="twocolumns">
+<dl>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/Fullscreen_API" title="/ Es-ES / docs / DOM / Using_fullscreen_mode">API de pantalla completa</a></span></dt>
+ <dd><span class="notranslate">Esta sencilla API permite que su juego se haga cargo de toda la pantalla, sumergiendo al jugador en acción.</span></dd>
+ <dt><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/API/Gamepad/Using_Gamepad_API&amp;usg=ALkJrhhV6r_1Mvu6SOpsoQgHhJElOIWX7g" title="/ Es-ES / docs / API / Gamepad / Using_Gamepad_API">API de Gamepad</a></span></dt>
+ <dd><span class="notranslate">Si desea que sus usuarios puedan usar gamepads u otros controladores de juego para trabajar su juego, necesitará esta API.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/HTML" title="/ Es-US / docs / HTML">HTML</a> y <a href="https://developer.mozilla.org/es/docs/Web/CSS" title="/ Es-ES / docs / CSS">CSS</a></span></dt>
+ <dd><span class="notranslate">Juntas, estas dos tecnologías le permiten construir, diseñar y diseñar la interfaz de usuario de su juego.</span> <span class="notranslate"> Parte de HTML es el elemento <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/HTML/Elemento/canvas&amp;usg=ALkJrhhVmlLNFuUPIZvH_teRdETdIbBebw" title="Este artículo aún no se ha escrito. ¡Considere contribuir!"><code>&lt;canvas&gt;</code></a> , que proporciona una forma de hacer gráficos 2D.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/audio" title="/ Es-ES / docs / HTML / Elemento / audio">Audio HTML</a></span></dt>
+ <dd><span class="notranslate">El elemento <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/HTML/Elemento/audio&amp;usg=ALkJrhjtX6Px9Gu7gkcd0fdLB1gVGNTqZQ" title="Este artículo aún no se ha escrito. ¡Considere contribuir!"><code>&lt;audio&gt;</code></a> te permite reproducir fácilmente efectos de sonido y música sencillos.</span> <span class="notranslate"> Si sus necesidades están más involucradas, echa un vistazo a la <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Web_Audio_API&amp;usg=ALkJrhgCQeHzpAri8qJ00kmc9rNqYXZzHg" title="/ Es-ES / docs / Web_Audio_API">API de audio web</a> para obtener potencia de procesamiento de audio real.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/IndexedDB-840092-dup" title="/ Es-US / docs / IndexedDB">IndexedDB</a></span></dt>
+ <dd><span class="notranslate">Una poderosa API de almacenamiento de datos para mantener los datos del usuario en su propio ordenador o dispositivo.</span> <span class="notranslate"> Una gran manera de guardar el estado del juego y otra información localmente para que no tenga que ser descargado cada vez que sea necesario.</span> <span class="notranslate"> También es útil para ayudar a que su juego sea jugable incluso cuando el usuario no está conectado a la Web (por ejemplo, cuando están atrapados en un avión durante horas y horas ...).</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/JavaScript" title="/ Es-ES / docs / JavaScript">JavaScript</a></span></dt>
+ <dd><span class="notranslate">JavaScript, el lenguaje de programación utilizado en la Web, está ardiendo rápido en los navegadores modernos y cada vez más rápido.</span> <span class="notranslate"> Usa su poder para escribir el código para tu juego, o mira usando tecnologías como <a class="external external-icon" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://github.com/kripken/emscripten/wiki&amp;usg=ALkJrhhAf0czxz7h2rDyV_JV7PSlfap69g" title="Https://github.com/kripken/emscripten/wiki">Emscripten</a> o <a class="external external-icon" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=http://asmjs.org/spec/latest/&amp;usg=ALkJrhh9WXUvKAZKrbEzyZxr8nWhmVHYfw" title="Http://asmjs.org/spec/latest/">Asm.js</a> para portar fácilmente tus juegos existentes.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/WebAPI/Pointer_Lock" title="/ Es-ES / docs / WebAPI / Pointer_Lock">API de bloqueo de puntero</a></span></dt>
+ <dd><span class="notranslate">La API de Bloqueo de Puntero le permite bloquear el ratón u otro dispositivo señalador dentro de la interfaz de su juego para que en lugar de posicionamiento absoluto del cursor reciba deltas de coordenadas que le den medidas más precisas de lo que el usuario está haciendo e impide que el usuario envíe accidentalmente su entrada En algún otro lugar, por lo tanto falta una acción importante.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/SVG" title="/ Es-ES / docs / SVG">SVG</a> (Gráficos Vectoriales Escalables)</span></dt>
+ <dd><span class="notranslate">Permite crear gráficos vectoriales que se escalan sin problemas, independientemente del tamaño o la resolución de la pantalla del usuario.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Vectores_tipados" title="/ Es-US / docs / JavaScript / Typed_arrays">Matrices Arrays</a></span></dt>
+ <dd><span class="notranslate">Los arrays tipados en JavaScript le dan acceso a datos binarios sin procesar desde JavaScript;</span> <span class="notranslate"> Esto le permite manipular texturas GL, datos de juego, o cualquier otra cosa, incluso si no está en un formato JavaScript nativo.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web_Audio_API" title="/ Es-ES / docs / Web_Audio_API">API de audio web</a></span></dt>
+ <dd><span class="notranslate">Esta API para controlar la reproducción, síntesis y manipulación de audio a partir de código JavaScript le permite crear efectos de sonido impresionantes, así como jugar y manipular música en tiempo real.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/WebGL_API" title="/ Es-ES / docs / WebGL">WebGL</a></span></dt>
+ <dd><span class="notranslate">Permite crear gráficos 3D (y 2D) acelerados por hardware de alto rendimiento a partir del contenido Web.</span> <span class="notranslate"> Se trata de una implementación Web de <a class="external external-icon" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=http://www.khronos.org/opengles/&amp;usg=ALkJrhj7Pnj9FaaR-5oxI5CJw3N2i05Ngw" title="Http://www.khronos.org/opengles/">OpenGL ES</a> 2.0.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/WebRTC_API" title="/ En-US / docs / WebRTC">WebRTC</a></span></dt>
+ <dd><span class="notranslate">La API WebRTC (Comunicaciones en tiempo real) le permite controlar los datos de audio y vídeo, incluyendo la teleconferencia y la transmisión de otros datos de la aplicación entre dos usuarios.</span> <span class="notranslate"> ¿Quieren que sus jugadores puedan hablar entre sí mientras explotan monstruos?</span> <span class="notranslate"> Esta es la API para usted.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/WebSockets_API" title="/ Es-ES / docs / WebSockets">WebSockets</a></span></dt>
+ <dd><span class="notranslate">La API de WebSocket le permite conectar su aplicación o sitio a un servidor para transmitir datos de un lado a otro en tiempo real.</span> <span class="notranslate"> Perfecto para la acción de juego multijugador, servicios de chat, y así sucesivamente.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/Guide/Performance/Usando_web_workers" title="/ Es-ES / docs / DOM / Using_web_workers">Trabajadores de la Web</a></span></dt>
+ <dd><span class="notranslate">Los trabajadores le dan la posibilidad de generar hilos de fondo que ejecutan su propio código JavaScript, para aprovechar los modernos procesadores multi-núcleo.</span></dd>
+ <dt><span class="notranslate"><a href="https://developer.mozilla.org/es/docs/Web/API/XMLHttpRequest" title="/ Es-US / docs / DOM / XMLHttpRequest">XMLHttpRequest</a> y <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/DOM/File_API&amp;usg=ALkJrhjS1RWLb9XbCcHs-KcDniPTbC4fcw" title="/ Es-US / docs / DOM / File_API">API de archivos</a></span></dt>
+ <dd><span class="notranslate">La combinación de XMLHttpRequest y la API de archivos le permiten enviar y recibir cualquier tipo de datos que desee (no deje que el "XML" te lance!) Desde un servidor Web.</span> <span class="notranslate"> Esta es una gran manera de hacer cualquier cosa desde la descarga de nuevos niveles de juego y obras de arte a la transmisión de información de estado de juego en tiempo no real de ida y vuelta.</span></dd>
+</dl>
+</div>
+
+<aside class="helpful-survey" id="helpful-survey">
+<p><span class="notranslate">¿Te resultó útil este artículo?</span></p>
+
+<div class="helpful-survey-content">
+<div class="helpful-survey-buttons"></div>
+</div>
+</aside>
+
+<div class="column-half wiki-column text-content" id="wiki-content">
+<article id="wikiArticle">
+<aside class="helpful-survey" id="helpful-survey">
+<div class="helpful-survey-content">
+<div class="helpful-survey-thankyou"><span class="notranslate">Gracias</span></div>
+</div>
+</aside>
+</article>
+
+<div class="wiki-block contributors">
+<h2 class="offscreen" id="Etiquetas_y_colaboradores_del_documento"><span class="notranslate">Etiquetas y colaboradores del documento</span></h2>
+
+<div class="tag-attach-list contributors-sub"><span class="notranslate"><strong>Etiquetas:</strong></span>
+
+<ul class="tags tags-small">
+ <li><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/tag/Firefox%2520OS&amp;usg=ALkJrhiMz60hq0NctaBY3vvrFB_d0qOW4A" rel="nofollow, noindex">Firefox OS</a></span></li>
+ <li><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/tag/juegos&amp;usg=ALkJrhgDjdxSwGCqqR9onHjg5aeHWXOtZQ" rel="nofollow, noindex">Juegos</a></span></li>
+ <li><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/tag/moviles&amp;usg=ALkJrhh4FtxUHYR70IVPrUF4PGeh5CrfcA" rel="nofollow, noindex">Moviles</a></span></li>
+</ul>
+</div>
+
+<div class="contributors-sub"><span class="notranslate"><strong>Colaboradores en esta página:</strong> <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/profiles/Albizures&amp;usg=ALkJrhgWRBfS71scMhWnz4J-PjnFKsFIBA">Albizures</a> , <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/profiles/atlas7jean&amp;usg=ALkJrhgzALymuEYfsd8CnptuoTY4OCPMWw">atlas7jean</a></span></div>
+
+<div class="contributors-sub"><span class="notranslate"><strong>Última actualización por:</strong> <a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/profiles/Albizures&amp;usg=ALkJrhgWRBfS71scMhWnz4J-PjnFKsFIBA">Albizures</a> ,</span> <time datetime="2014-10-16T13:58:46-07:00"> <span class="notranslate"> 16 oct.</span> <span class="notranslate"> 2014 13:58:46</span> </time></div>
+</div>
+</div>
+
+<div class="column-strip wiki-column" id="wiki-left">
+<nav class="zone-subnav-container">
+<div class="subnav" id="Subnav">
+<ol class="accordion">
+ <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/Games/Introduccion&amp;usg=ALkJrhiT8uSw5K2TSW051FTS2G9ftOFnZQ#">Introducción</a></span></li>
+ <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/es/docs/Games/Introduccion&amp;usg=ALkJrhiT8uSw5K2TSW051FTS2G9ftOFnZQ#">API para el desarrollo de juegos</a></span></li>
+ <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Games/Techniques&amp;usg=ALkJrhjTEqvKzu-maArgaCVGov9Q1DC62g">Técnicas</a></span></li>
+ <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Games/Tutorials&amp;usg=ALkJrhi4A0KaxMCbPvV5D8_zjT3bnOfGaA">Tutoriales</a></span></li>
+ <li class="toggleable"><span class="notranslate"><a href="https://translate.googleusercontent.com/translate_c?depth=1&amp;hl=es&amp;rurl=translate.google.com&amp;sl=auto&amp;sp=nmt4&amp;tl=es&amp;u=https://developer.mozilla.org/en-US/docs/Games/Publishing_games&amp;usg=ALkJrhgQiYOYtL4GRD4H7y3qveRGSfUqvg">Publicar juegos</a></span></li>
+</ol>
+</div>
+</nav>
+</div>
diff --git a/files/es/games/introduction_to_html5_game_development/index.html b/files/es/games/introduction_to_html5_game_development/index.html
new file mode 100644
index 0000000000..58ce238fbc
--- /dev/null
+++ b/files/es/games/introduction_to_html5_game_development/index.html
@@ -0,0 +1,109 @@
+---
+title: Introducción al desarrollo de juegos HTML5 (resumen)
+slug: Games/Introduction_to_HTML5_Game_Development
+tags:
+  - Firefox OS
+  - HTML5
+  - Móvil
+  - juegos
+translation_of: Games/Introduction_to_HTML5_Game_Development_(summary)
+original_slug: Games/Introducción_al_desarrollo_de_juegos_HTML5_(resumen)
+---
+<div>{{GamesSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<div>
+<h2 id="Ventajas" style="line-height: 30px;">Ventajas</h2>
+
+<ol>
+ <li><span class="seoSummary">Los juegos hechos con HTML5 funcionan en smartphones, tabletas, PCs y Smart TVs.</span></li>
+ <li>Anuncia y promociona tu juego en toda la web, así como en otros medios.</li>
+ <li>Pagos. Carga lo que quieras y usa el servicio de procesamiento de pagos que desees.</li>
+ <li><span class="seoSummary">Actualiza tu juego cuando quieras.</span></li>
+ <li>¡Colecciona tus propios análisis!</li>
+ <li>Conécta con tus clientes más de cerca.</li>
+ <li><span class="seoSummary">Los jugadores pueden jugar el juego en cualquier lugar, en cualquier momento.</span></li>
+</ol>
+
+<h2 id="Tecnologías_Web" style="line-height: 30px;">Tecnologías Web</h2>
+</div>
+
+<div> </div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col" style="text-align: left;"><strong>Funcionalidad</strong></th>
+   <th scope="col" style="text-align: left;"><strong>Tecnología</strong></th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><strong>Audio</strong></td>
+   <td><a href="/en-US/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">Web Audio API</a></td>
+  </tr>
+  <tr>
+   <td><strong>Graphics</strong></td>
+   <td><a href="/en-US/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a> (<a href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0)</td>
+  </tr>
+  <tr>
+   <td><strong>Input</strong></td>
+   <td><a href="/en-US/docs/DOM/Touch_events" title="/en-US/docs/DOM/Touch_events">Touch events</a>, <a href="/en-US/docs/API/Gamepad/Using_Gamepad_API" title="/en-US/docs/API/Gamepad/Using_Gamepad_API">Gamepad API</a>, sensores del dispositivo, <a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a>, <a href="/en-US/docs/DOM/Using_fullscreen_mode" title="/en-US/docs/DOM/Using_fullscreen_mode">Full Screen API</a>, <a href="/en-US/docs/WebAPI/Pointer_Lock" title="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a></td>
+  </tr>
+  <tr>
+   <td><strong>Language</strong></td>
+   <td><a href="/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a> (o C/C++ usando <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a> para compilar a JavaScript)</td>
+  </tr>
+  <tr>
+   <td><strong>Networking</strong></td>
+   <td><a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> y/o <a href="/en-US/docs/WebSockets" title="/en-US/docs/WebSockets">WebSockets</a></td>
+  </tr>
+  <tr>
+   <td><strong>Storage</strong></td>
+   <td><a href="/en-US/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a> o la "nube"</td>
+  </tr>
+  <tr>
+   <td><strong>Web</strong></td>
+   <td><a href="/en-US/docs/HTML" title="/en-US/docs/HTML">HTML</a>, <a href="/en-US/docs/CSS" title="/en-US/docs/CSS">CSS</a>, <a href="/en-US/docs/SVG" title="/en-US/docs/SVG">SVG</a>, <a href="/en-US/docs/Social_API" title="/en-US/docs/Social_API">Social API</a> (¡y muchos más!)</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="twocolumns">
+<dl>
+ <dt><a href="/en-US/docs/DOM/Using_fullscreen_mode" title="/en-US/docs/DOM/Using_fullscreen_mode">Full Screen API</a></dt>
+ <dd>Juego de pantalla completa.</dd>
+ <dt><a href="/en-US/docs/API/Gamepad/Using_Gamepad_API" title="/en-US/docs/API/Gamepad/Using_Gamepad_API">Gamepad API</a></dt>
+ <dd>Utiliza gamepads u otros controladores de juego.</dd>
+ <dt><a href="/en-US/docs/HTML" title="/en-US/docs/HTML">HTML</a> y <a href="/en-US/docs/CSS" title="/en-US/docs/CSS">CSS</a></dt>
+ <dd>Crea, diseña y diseña la interfaz de usuario de tu juego.</dd>
+ <dt><a href="/en-US/docs/HTML/Element/audio" title="/en-US/docs/HTML/Element/audio">HTML audio</a></dt>
+ <dd>Juega fácilmente efectos de sonido simples y música.</dd>
+ <dt><a href="/en-US/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a></dt>
+ <dd>Almacena los datos del usuario en tu propio ordenador o dispositivo.</dd>
+ <dt><a href="/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a></dt>
+ <dd>Rápido lenguaje de programación web para escribir el código de tu juego.<br>
+ Para portar fácilmente tus juegos existentes en <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a> o <a href="http://asmjs.org/spec/latest/" title="http://asmjs.org/spec/latest/">Asm.js</a></dd>
+ <dt><a href="/en-US/docs/WebAPI/Pointer_Lock" title="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a></dt>
+ <dd>Bloquea el ratón u otro dispositivo señalador dentro de la interfaz de tu juego.</dd>
+ <dt><a href="/en-US/docs/SVG" title="/en-US/docs/SVG">SVG</a> (Scalable Vector Graphics)</dt>
+ <dd>Cree gráficos vectoriales que se escalan sin problemas, independientemente del tamaño o la resolución de la pantalla del usuario.</dd>
+ <dt><a href="/en-US/docs/JavaScript/Typed_arrays" title="/en-US/docs/JavaScript/Typed_arrays">Typed Arrays</a></dt>
+ <dd>Accede a datos binarios sin procesar desde JavaScript; Manipula texturas GL, datos de juegos, o cualquier otra cosa.</dd>
+ <dt><a href="/en-US/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">Web Audio API</a></dt>
+ <dd>Controla la reproducción, síntesis y manipulación del audio en tiempo real.</dd>
+ <dt><a href="/en-US/docs/WebGL" title="/en-US/docs/WebGL">WebGL</a></dt>
+ <dd>Cree gráficos 3D (y 2D) acelerados por hardware y de alto rendimiento. <a href="http://www.khronos.org/opengles/" title="http://www.khronos.org/opengles/">OpenGL ES</a> 2.0.</dd>
+ <dt><a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a></dt>
+ <dd>Las comunicaciones en tiempo real para controlar los datos de audio y video, incluidas las teleconferencias y la transmisión de datos de otras aplicaciones entre dos usuarios, como el chat.</dd>
+ <dt><a href="/en-US/docs/WebSockets" title="/en-US/docs/WebSockets">WebSockets</a></dt>
+ <dd>Conecte tu aplicación o sitio a un servidor para transmitir datos de un lado a otro en tiempo real. Perfecto para la acción de juegos multijugador, servicios de chat, etc.</dd>
+ <dt><a href="/en-US/docs/DOM/Using_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web Workers</a></dt>
+ <dd>Genere hilos de fondo ejecutando tu propio código JavaScript para procesadores multi-core.</dd>
+ <dt><a href="/en-US/docs/DOM/XMLHttpRequest" title="/en-US/docs/DOM/XMLHttpRequest">XMLHttpRequest</a> y <a href="/en-US/docs/DOM/File_API" title="/en-US/docs/DOM/File_API">File API</a></dt>
+ <dd>Envía y recibe cualquier tipo de información que desees desde un servidor web, como descargar nuevos niveles de juego y material gráfico para transmitir información de estado del juego en tiempo no real.</dd>
+</dl>
+</div>
+
+<p> </p>
diff --git a/files/es/games/publishing_games/game_monetization/index.html b/files/es/games/publishing_games/game_monetization/index.html
new file mode 100644
index 0000000000..82a7ca2cd6
--- /dev/null
+++ b/files/es/games/publishing_games/game_monetization/index.html
@@ -0,0 +1,101 @@
+---
+title: Monetización de videojuegos
+slug: Games/Publishing_games/Game_monetization
+tags:
+  - HTLM5
+  - JavaScript
+  - Licencias
+  - anuncios
+  - juegos
+  - marca
+  - monetización
+translation_of: Games/Publishing_games/Game_monetization
+original_slug: Games/Publishing_games/Monetización_de_los_juegos
+---
+<div>{{GamesSidebar}}</div>
+
+<p class="summary">Cuando empleas tu tiempo en crear un juego, <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_distribution">distribuirlo </a>y <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_promotion">promocionarlo </a>deberías considerar ganar un poco de dinero con ello. Si tu trabajo es un esfuerzo serio en tu camino para ser un desarrollador independiente de juegos capaz de ganarse la vida, sigue leyendo y verás cuales son tus opciones. La tecnología es lo suficientemente madura; ahora es cuestión de elegir el enfoque adecuado.</p>
+
+<h2 id="Juegos_de_pago">Juegos de pago</h2>
+
+<p>Lo primero, la opción más obvia que probablemente venga a tu mente, podría ser vender los juegos de la forma en que se realiza para grandes títulos AAA ---- con un precio fijado por adelantado. Aunque el mercado digital es clave y no necesitas imprimir portadas y sacar tu juego en una tienda física, para ganar un dinero decente vendiendo tus juegos con un precio fijo, tienes que invertir tu tiempo y dinero en marketing. Solo con los mejores juegos se recupera o gana más de lo que costo hacerlo, y necesitas un montón de suerte para ello.</p>
+
+<p>Cuanto ganes por tu jugo depende del mercado, la calidad de tu juego y otros tantos pequeños factores. Un título de arcade para iOS puede venderse por 0,99 USD, pero un juego de escritorio estilo RPG más largo, en Steam, puede venderse por 20 USD; ambos precios están bien. Tienes que seguir el mercado y tu propia investigación --- aprender rápido de tus errores es importante.</p>
+
+<h2 id="Compras_en_la_aplicación">Compras en la aplicación</h2>
+
+<p>En lugar de que la gente pague por tu juego por adelantado, puedes ofrecer un juego de forma gratuita con compras dentro de la aplicación. En este caso, el juego puede ser adquirido sin gastarse un centavo --- dar el juego a los jugadores, pero ofreciendo monedas del juego, bonus extra  o beneficios por dinero real. Ejemplos específicos pueden ser, incluir bonus de nivel, mejores armas o hechizos, o volver a llenar la energía necesaria para jugar. Diseñar un buen sistema de compras en la aplicación es un arte propio.</p>
+
+<p>Recuerda que necesitas miles de descargas de tu juego para hacer efectivas/rentables las compras en la aplicación --- solo una pequeña parte de los jugadores pagará por las compras en la aplicación. ¿Cómo de pequeña? Varía, pero alrededor de una persona por cada mil es aproximadamente la media. Cuantas más personas jueguen a tu juego, mayor será la probabilidad de que alguien pague, o sea que tus beneficios dependen en gran medida de tus actividades de <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_promotion">promoción.</a></p>
+
+<h3 id="Freemium">Freemium</h3>
+
+<p>Los juegos que ofrecen compras en el juego, a menudo se refieren a <strong>freemium </strong>--- un juego freemium puede ser adquirido y jugado gratis, pero puedes pagar por características extra (premium), bienes virtuales u otros beneficios. La palabra en sí, adquirió una connotación negativa después de que las grandes compañías se centraran en crear juegos, cuyo objetivo principal era ganar el máximo dinero posible de los jugadores, en lugar de proporcionar una experiencia divertida. Los peores casos fueron cuando podías utilizar dinero real para obtener ventajas sobre otros jugadores, o cuando restringían el acceso a las siguientes etapas del juego, a menos que los jugadores pagaran. El término "pagar para ganar" fue acuñado y este enfoque no gustó a muchos jugadores  y desarrolladores. Si quieres implementar compras dentro del juego asegúrate de que intenten añadir valor al juego con algo que los jugadores disfruten, en lugar de sacarlo y luego cobrarlo.</p>
+
+<h3 id="Complementos_y_DLCs">Complementos y DLCs</h3>
+
+<p> </p>
+
+<p>Los complementos y el contenido descargable son una buena manera de proporcionar un valor extra a un juego ya lanzado, pero recuerda que tendrás que ofrecer contenido decente y entretenido para atraer a la gente a comprarlo. Un conjunto totalmente nuevo de niveles con nuevos personajes, armas e historia es un buen material para DLC, pero para tener suficientes ventas el juego en sí debe ser popular, o de lo contrario no habrá jugadores interesados ​​en gastar su dinero duramente ganado. eso.</p>
+
+<p>En lugar de vender activamente los juegos, también puede intentar obtener un ingreso pasivo: mostrar anuncios y confiar en actividades anteriores relacionadas con la <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_promotion">promoción</a> de su juego puede ser beneficioso, pero su juego debe ser adictivo, lo cual no es tan fácil como parece. Todavía necesitas planearlo, y en algún momento también necesitarás un poco de suerte. Si su juego se vuelve viral y la gente comienza a compartirlo, puede obtener muchas descargas y dinero de los anuncios.</p>
+
+<p>Hay muchas compañías que ofrecen sistemas de publicidad: usted se registra y les permite mostrar anuncios a cambio de un porcentaje de las ganancias. Se dice que Google AdSense es el más efectivo, pero no está diseñado para juegos y es una práctica bastante mala usarlo para ese propósito. En lugar de arriesgarse a que se cierre su cuenta y se bloquee todo el dinero, intente utilizar los portales habituales de gamedev como <a href="https://www.leadbolt.com/">LeadBolt. </a>Ofrecen sistemas fáciles de implementar para mostrar los anuncios en sus juegos y dividir las ganancias con usted.</p>
+
+<p>Los anuncios de video son cada vez más populares, especialmente en forma de pre-roll: se muestran al principio de su juego mientras aún se está cargando. Y sobre el tema de dónde colocar los anuncios en tu juego, realmente depende de ti. Debería ser lo más sutil posible para no molestar demasiado a los jugadores, pero lo suficientemente visible como para hacerles clic o al menos tomar nota. Adición de anuncios entre sesiones de juego en juego sobre pantallas es un enfoque popular.</p>
+
+<p> </p>
+
+<h2 id="Licencias">Licencias</h2>
+
+<p>Hay un enfoque que puede funcionar como un modelo de monetización por sí mismo, y es vendiendo licencias para la distribución de tu juego. Existen más y más portales interesados en enseñar tu juego en sus páginas web. Ellos siguen varias estrategias para ganar dinero, gracias a tus juegos, pero no te tienes que preocuparte sobre eso, ya que la venta de la licencia suele ser un contrato único. Tu consigues el dinero y ellos pueden ser creativos con el uso de tu juego para hacer dinero con él.</p>
+
+<p>Encontrar editores puede ser difícil la primera vez --- intenta buscarlos en los foros <a href="http://www.html5gamedevs.com/">HTML5 Gamedevs</a>. Si eres bien conocido, los editores llegarán a ti. La mayoria de las ofertas se realizan a través de correos electrónicos cuando se habla con una persona dedicada en el lado del editor. Algunos editores de sitios web tienen esa información a la vista, mientras que para contactar con otros editores es más difícil. Cuando busques un editor intenta ser amable e ir directo al grano --- son gente ocupada.</p>
+
+<h3 id="Licencias_exclusivas">Licencias exclusivas</h3>
+
+<p>La licencia exclusiva es un tipo de licencia para un editor --- has creado un juego y vendes todos sus derechos a una única entidad junto con los derechos para redistribuirla ---- <a href="http://www.softgames.de/">Softgames</a> es un ejemplo de tal editor. No puedes vender el juego otra vez de ninguna forma mientras que el editor tenga los derechos --- esto es por lo que las ofertas exclusivas valen mucho dinero. ¿Cuánto exactamente? Depende de la calidad del juego, el género, el editor, y otros tantos factores, pero habitualmente puede estar entre los 2000 y 5000 USD. Un vez que vendiste una licencia exclusiva puedes olvidarte de promocionar ese juego en particular, ya que no ganarás más dinero con él, así que acepta tal oferta solo si estas seguro de que es lo suficientemente rentable.</p>
+
+<h3 id="Licencias_no_exclusivas">Licencias no exclusivas</h3>
+
+<p>Este enfoque es menos estricto --- puedes vender una misma licencia a varios editores. Este es el enfoque más popular entre os editores nuevos (y los editores están apareciendo constantemente), puedes vender tus juegos con unos términos no exclusivos. Recuerda que con esta licencia el editor no puede redistribuirlo más --- a menudo se le llama un acuerdo de sitio cerrado cuando compran el derecho de publicar el juego en su propio portal. El coste normal de una licencia no exclusiva esta alrededor de 500 USD.</p>
+
+<h3 id="Subscripciones">Subscripciones</h3>
+
+<p>También hay una opción para obtener un dinero pasivo mensual, a través de un acuerdo de subscripción. En lugar de obtener un único pago, puedes obtener pequeños pagos de dinero por juego, por mes --- puede estar entorno a 20-50 USD por mes, por juego. Normalmente depende de ti, si quieres ganar todo el dinero en un solo pago o ganarlo por meses. Recuerda que puede ser cancelado, o sea que no es una solución que funcione indefinidamente.</p>
+
+<h3 id="Ingresos_por_publicidad">Ingresos por publicidad</h3>
+
+<p>Puedes implementar anuncios en tu juego tu mismo e intentar encontrar el tráfico adecuado para ganar un poco de dinero, pero también puedes hacer un acuerdo de reparto de ingresos con un editor. Los editores se encargarán de dirigir el tráfico y de dividir los beneficios --- habitualmente los acuerdos son de 70/30% o 50/50%, ganado por mes.</p>
+
+<p>Recuerda que muchos nuevos editores de baja calidad querrán coger tu juego con ingresos por anuncios, en lugar de licencia, porque será más barato para ellos y podrías terminar con beneficios de 2 USD por juego por trato completado. Ten cuidado cuando contrates con nuevos editores --- algunas veces es mejor reducir el coste de la licencia a un editor conocido, en lugar de que te defraude un nuevo editor por más dinero.</p>
+
+<p>Los editores cogen tus juegos para la participación en los beneficios, y/o licenciar podrá requerir implementar sus propias APIs, lo cual dará un trabajo extra, asi que considera eso en tu precio final.</p>
+
+<h3 id="Marca">Marca</h3>
+
+<p>Puedes vender los derechos de usar tu juego para la marca, o hacerlo tu mismo.  En el primer caso, es casi como una licencia no exclusiva, pero el cliente normalmente compra derechos para el código e implementarán sus propios gráficos. En el segundo caso, es como un trato independiente, pero estas reutilizando el código y añadiendo gráficos proporcionados por los clientes, algunas veces implementándolos como ellos te enseñen. Por ejemplo, si tu tienes un juego donde un jugador golpea los artículos de comida, podrías cambiar la comida a los productos del cliente para darles publicidad. Los precios en este modelo varían mucho dependiendo de la marca, cliente, y las horas que le eches.</p>
+
+<h2 id="Otras_estrategias_de_monetización_no_enfocadas_al_juego">Otras estrategias de monetización no enfocadas al juego</h2>
+
+<p>Hay otros caminos en los que puedes ganar dinero cuando haces juegos HTML5, y ni siquiera tiene que estar relacionado con el juego.</p>
+
+<h3 id="Venta_de_recursos">Venta de recursos</h3>
+
+<p>Si eres un diseñador gráfico, puedes vender los bienes de los juegos que has creado, o algo completamente nuevo exclusivamente para ese propósito en tiendas online como  <a href="http://market.envato.com/">Envato Market</a>. No es mucho, pero si eres un diseñador conocido, puede ser una forma de ganar un dinero extra.</p>
+
+<h3 id="Escribir_artículos_y_tutoriales">Escribir artículos y tutoriales</h3>
+
+<p>Es posible escribir artículos sobre tus juegos y que te paguen por ello. La promoción del juego y la monetización al mismo tiempo es un ganar-ganar, y si no abusas de ello con muchos anuncios, los lectores disfrutarán leyendo los artículos y aprenderán una o dos cosas. Si te enfocas en compartir el conocimiento primero y usas tus juegos solo como ejemplos, estará bien. Visita <a href="http://gamedevelopment.tutsplus.com/">Tuts+ Game Development</a> o sitios web similares para tener oportunidades donde escribir artículos.</p>
+
+<h3 id="Mercancías">Mercancías</h3>
+
+<p>Puedes vender camisetas, <a href="https://www.stickermule.com/user/1070634890/stickers">pegatinas</a> o otros objetos --- algunos desarrolladores ganan más dinero con las mercancías que con sus propios juegos, pero solo funciona en juegos muy populares y reconocidos, como Angry Birds. Todavía, puede ser otra forma de ganar un poco de dinero. Cuanto más diversificados sean tus ingresos, mejor será tu estabilidad comercial.</p>
+
+<h3 id="Donaciones">Donaciones</h3>
+
+<p>Cuando todo lo demás falla puedes intentar poner un botón de donaciones en la página de tu juego y pedir apoyo de la comunidad. Algunas veces funciona, pero solo si el jugador te conoce y siente que te ayudará. Este es el porque de que manejar cuidadosamente la comunidad es tan importante. Funcionó con la competición de <a href="http://js13kgames.com/">js13kGames</a> --- todos los participantes obtuvieron una camiseta gratis, y algunos incluso dieron unos cuantos dólares para ayudarlo a seguir funcionado en los próximos años.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Hay muchas maneras de ganar dinero --- todo lo que se aplica al mundo de los juegos AAA "normalmente" puede ser, más o menos, aplicable a los juegos casuales HTML5. Sin embargo, también podrías enfocarte en vender licencias, hacer marcas, o ganar unos beneficios compartidos de los anuncios. Depende totalmente de ti, que camino vas a seguir.</p>
diff --git a/files/es/games/publishing_games/monetización_de_los_juegos/index.html b/files/es/games/publishing_games/monetización_de_los_juegos/index.html
deleted file mode 100644
index 1549b222da..0000000000
--- a/files/es/games/publishing_games/monetización_de_los_juegos/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: Monetización de videojuegos
-slug: Games/Publishing_games/Monetización_de_los_juegos
-tags:
-  - HTLM5
-  - JavaScript
-  - Licencias
-  - anuncios
-  - juegos
-  - marca
-  - monetización
-translation_of: Games/Publishing_games/Game_monetization
----
-<div>{{GamesSidebar}}</div>
-
-<p class="summary">Cuando empleas tu tiempo en crear un juego, <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_distribution">distribuirlo </a>y <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_promotion">promocionarlo </a>deberías considerar ganar un poco de dinero con ello. Si tu trabajo es un esfuerzo serio en tu camino para ser un desarrollador independiente de juegos capaz de ganarse la vida, sigue leyendo y verás cuales son tus opciones. La tecnología es lo suficientemente madura; ahora es cuestión de elegir el enfoque adecuado.</p>
-
-<h2 id="Juegos_de_pago">Juegos de pago</h2>
-
-<p>Lo primero, la opción más obvia que probablemente venga a tu mente, podría ser vender los juegos de la forma en que se realiza para grandes títulos AAA ---- con un precio fijado por adelantado. Aunque el mercado digital es clave y no necesitas imprimir portadas y sacar tu juego en una tienda física, para ganar un dinero decente vendiendo tus juegos con un precio fijo, tienes que invertir tu tiempo y dinero en marketing. Solo con los mejores juegos se recupera o gana más de lo que costo hacerlo, y necesitas un montón de suerte para ello.</p>
-
-<p>Cuanto ganes por tu jugo depende del mercado, la calidad de tu juego y otros tantos pequeños factores. Un título de arcade para iOS puede venderse por 0,99 USD, pero un juego de escritorio estilo RPG más largo, en Steam, puede venderse por 20 USD; ambos precios están bien. Tienes que seguir el mercado y tu propia investigación --- aprender rápido de tus errores es importante.</p>
-
-<h2 id="Compras_en_la_aplicación">Compras en la aplicación</h2>
-
-<p>En lugar de que la gente pague por tu juego por adelantado, puedes ofrecer un juego de forma gratuita con compras dentro de la aplicación. En este caso, el juego puede ser adquirido sin gastarse un centavo --- dar el juego a los jugadores, pero ofreciendo monedas del juego, bonus extra  o beneficios por dinero real. Ejemplos específicos pueden ser, incluir bonus de nivel, mejores armas o hechizos, o volver a llenar la energía necesaria para jugar. Diseñar un buen sistema de compras en la aplicación es un arte propio.</p>
-
-<p>Recuerda que necesitas miles de descargas de tu juego para hacer efectivas/rentables las compras en la aplicación --- solo una pequeña parte de los jugadores pagará por las compras en la aplicación. ¿Cómo de pequeña? Varía, pero alrededor de una persona por cada mil es aproximadamente la media. Cuantas más personas jueguen a tu juego, mayor será la probabilidad de que alguien pague, o sea que tus beneficios dependen en gran medida de tus actividades de <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_promotion">promoción.</a></p>
-
-<h3 id="Freemium">Freemium</h3>
-
-<p>Los juegos que ofrecen compras en el juego, a menudo se refieren a <strong>freemium </strong>--- un juego freemium puede ser adquirido y jugado gratis, pero puedes pagar por características extra (premium), bienes virtuales u otros beneficios. La palabra en sí, adquirió una connotación negativa después de que las grandes compañías se centraran en crear juegos, cuyo objetivo principal era ganar el máximo dinero posible de los jugadores, en lugar de proporcionar una experiencia divertida. Los peores casos fueron cuando podías utilizar dinero real para obtener ventajas sobre otros jugadores, o cuando restringían el acceso a las siguientes etapas del juego, a menos que los jugadores pagaran. El término "pagar para ganar" fue acuñado y este enfoque no gustó a muchos jugadores  y desarrolladores. Si quieres implementar compras dentro del juego asegúrate de que intenten añadir valor al juego con algo que los jugadores disfruten, en lugar de sacarlo y luego cobrarlo.</p>
-
-<h3 id="Complementos_y_DLCs">Complementos y DLCs</h3>
-
-<p> </p>
-
-<p>Los complementos y el contenido descargable son una buena manera de proporcionar un valor extra a un juego ya lanzado, pero recuerda que tendrás que ofrecer contenido decente y entretenido para atraer a la gente a comprarlo. Un conjunto totalmente nuevo de niveles con nuevos personajes, armas e historia es un buen material para DLC, pero para tener suficientes ventas el juego en sí debe ser popular, o de lo contrario no habrá jugadores interesados ​​en gastar su dinero duramente ganado. eso.</p>
-
-<p>En lugar de vender activamente los juegos, también puede intentar obtener un ingreso pasivo: mostrar anuncios y confiar en actividades anteriores relacionadas con la <a href="https://developer.mozilla.org/en-US/docs/Games/Techniques/Publishing_games/Game_promotion">promoción</a> de su juego puede ser beneficioso, pero su juego debe ser adictivo, lo cual no es tan fácil como parece. Todavía necesitas planearlo, y en algún momento también necesitarás un poco de suerte. Si su juego se vuelve viral y la gente comienza a compartirlo, puede obtener muchas descargas y dinero de los anuncios.</p>
-
-<p>Hay muchas compañías que ofrecen sistemas de publicidad: usted se registra y les permite mostrar anuncios a cambio de un porcentaje de las ganancias. Se dice que Google AdSense es el más efectivo, pero no está diseñado para juegos y es una práctica bastante mala usarlo para ese propósito. En lugar de arriesgarse a que se cierre su cuenta y se bloquee todo el dinero, intente utilizar los portales habituales de gamedev como <a href="https://www.leadbolt.com/">LeadBolt. </a>Ofrecen sistemas fáciles de implementar para mostrar los anuncios en sus juegos y dividir las ganancias con usted.</p>
-
-<p>Los anuncios de video son cada vez más populares, especialmente en forma de pre-roll: se muestran al principio de su juego mientras aún se está cargando. Y sobre el tema de dónde colocar los anuncios en tu juego, realmente depende de ti. Debería ser lo más sutil posible para no molestar demasiado a los jugadores, pero lo suficientemente visible como para hacerles clic o al menos tomar nota. Adición de anuncios entre sesiones de juego en juego sobre pantallas es un enfoque popular.</p>
-
-<p> </p>
-
-<h2 id="Licencias">Licencias</h2>
-
-<p>Hay un enfoque que puede funcionar como un modelo de monetización por sí mismo, y es vendiendo licencias para la distribución de tu juego. Existen más y más portales interesados en enseñar tu juego en sus páginas web. Ellos siguen varias estrategias para ganar dinero, gracias a tus juegos, pero no te tienes que preocuparte sobre eso, ya que la venta de la licencia suele ser un contrato único. Tu consigues el dinero y ellos pueden ser creativos con el uso de tu juego para hacer dinero con él.</p>
-
-<p>Encontrar editores puede ser difícil la primera vez --- intenta buscarlos en los foros <a href="http://www.html5gamedevs.com/">HTML5 Gamedevs</a>. Si eres bien conocido, los editores llegarán a ti. La mayoria de las ofertas se realizan a través de correos electrónicos cuando se habla con una persona dedicada en el lado del editor. Algunos editores de sitios web tienen esa información a la vista, mientras que para contactar con otros editores es más difícil. Cuando busques un editor intenta ser amable e ir directo al grano --- son gente ocupada.</p>
-
-<h3 id="Licencias_exclusivas">Licencias exclusivas</h3>
-
-<p>La licencia exclusiva es un tipo de licencia para un editor --- has creado un juego y vendes todos sus derechos a una única entidad junto con los derechos para redistribuirla ---- <a href="http://www.softgames.de/">Softgames</a> es un ejemplo de tal editor. No puedes vender el juego otra vez de ninguna forma mientras que el editor tenga los derechos --- esto es por lo que las ofertas exclusivas valen mucho dinero. ¿Cuánto exactamente? Depende de la calidad del juego, el género, el editor, y otros tantos factores, pero habitualmente puede estar entre los 2000 y 5000 USD. Un vez que vendiste una licencia exclusiva puedes olvidarte de promocionar ese juego en particular, ya que no ganarás más dinero con él, así que acepta tal oferta solo si estas seguro de que es lo suficientemente rentable.</p>
-
-<h3 id="Licencias_no_exclusivas">Licencias no exclusivas</h3>
-
-<p>Este enfoque es menos estricto --- puedes vender una misma licencia a varios editores. Este es el enfoque más popular entre os editores nuevos (y los editores están apareciendo constantemente), puedes vender tus juegos con unos términos no exclusivos. Recuerda que con esta licencia el editor no puede redistribuirlo más --- a menudo se le llama un acuerdo de sitio cerrado cuando compran el derecho de publicar el juego en su propio portal. El coste normal de una licencia no exclusiva esta alrededor de 500 USD.</p>
-
-<h3 id="Subscripciones">Subscripciones</h3>
-
-<p>También hay una opción para obtener un dinero pasivo mensual, a través de un acuerdo de subscripción. En lugar de obtener un único pago, puedes obtener pequeños pagos de dinero por juego, por mes --- puede estar entorno a 20-50 USD por mes, por juego. Normalmente depende de ti, si quieres ganar todo el dinero en un solo pago o ganarlo por meses. Recuerda que puede ser cancelado, o sea que no es una solución que funcione indefinidamente.</p>
-
-<h3 id="Ingresos_por_publicidad">Ingresos por publicidad</h3>
-
-<p>Puedes implementar anuncios en tu juego tu mismo e intentar encontrar el tráfico adecuado para ganar un poco de dinero, pero también puedes hacer un acuerdo de reparto de ingresos con un editor. Los editores se encargarán de dirigir el tráfico y de dividir los beneficios --- habitualmente los acuerdos son de 70/30% o 50/50%, ganado por mes.</p>
-
-<p>Recuerda que muchos nuevos editores de baja calidad querrán coger tu juego con ingresos por anuncios, en lugar de licencia, porque será más barato para ellos y podrías terminar con beneficios de 2 USD por juego por trato completado. Ten cuidado cuando contrates con nuevos editores --- algunas veces es mejor reducir el coste de la licencia a un editor conocido, en lugar de que te defraude un nuevo editor por más dinero.</p>
-
-<p>Los editores cogen tus juegos para la participación en los beneficios, y/o licenciar podrá requerir implementar sus propias APIs, lo cual dará un trabajo extra, asi que considera eso en tu precio final.</p>
-
-<h3 id="Marca">Marca</h3>
-
-<p>Puedes vender los derechos de usar tu juego para la marca, o hacerlo tu mismo.  En el primer caso, es casi como una licencia no exclusiva, pero el cliente normalmente compra derechos para el código e implementarán sus propios gráficos. En el segundo caso, es como un trato independiente, pero estas reutilizando el código y añadiendo gráficos proporcionados por los clientes, algunas veces implementándolos como ellos te enseñen. Por ejemplo, si tu tienes un juego donde un jugador golpea los artículos de comida, podrías cambiar la comida a los productos del cliente para darles publicidad. Los precios en este modelo varían mucho dependiendo de la marca, cliente, y las horas que le eches.</p>
-
-<h2 id="Otras_estrategias_de_monetización_no_enfocadas_al_juego">Otras estrategias de monetización no enfocadas al juego</h2>
-
-<p>Hay otros caminos en los que puedes ganar dinero cuando haces juegos HTML5, y ni siquiera tiene que estar relacionado con el juego.</p>
-
-<h3 id="Venta_de_recursos">Venta de recursos</h3>
-
-<p>Si eres un diseñador gráfico, puedes vender los bienes de los juegos que has creado, o algo completamente nuevo exclusivamente para ese propósito en tiendas online como  <a href="http://market.envato.com/">Envato Market</a>. No es mucho, pero si eres un diseñador conocido, puede ser una forma de ganar un dinero extra.</p>
-
-<h3 id="Escribir_artículos_y_tutoriales">Escribir artículos y tutoriales</h3>
-
-<p>Es posible escribir artículos sobre tus juegos y que te paguen por ello. La promoción del juego y la monetización al mismo tiempo es un ganar-ganar, y si no abusas de ello con muchos anuncios, los lectores disfrutarán leyendo los artículos y aprenderán una o dos cosas. Si te enfocas en compartir el conocimiento primero y usas tus juegos solo como ejemplos, estará bien. Visita <a href="http://gamedevelopment.tutsplus.com/">Tuts+ Game Development</a> o sitios web similares para tener oportunidades donde escribir artículos.</p>
-
-<h3 id="Mercancías">Mercancías</h3>
-
-<p>Puedes vender camisetas, <a href="https://www.stickermule.com/user/1070634890/stickers">pegatinas</a> o otros objetos --- algunos desarrolladores ganan más dinero con las mercancías que con sus propios juegos, pero solo funciona en juegos muy populares y reconocidos, como Angry Birds. Todavía, puede ser otra forma de ganar un poco de dinero. Cuanto más diversificados sean tus ingresos, mejor será tu estabilidad comercial.</p>
-
-<h3 id="Donaciones">Donaciones</h3>
-
-<p>Cuando todo lo demás falla puedes intentar poner un botón de donaciones en la página de tu juego y pedir apoyo de la comunidad. Algunas veces funciona, pero solo si el jugador te conoce y siente que te ayudará. Este es el porque de que manejar cuidadosamente la comunidad es tan importante. Funcionó con la competición de <a href="http://js13kgames.com/">js13kGames</a> --- todos los participantes obtuvieron una camiseta gratis, y algunos incluso dieron unos cuantos dólares para ayudarlo a seguir funcionado en los próximos años.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Hay muchas maneras de ganar dinero --- todo lo que se aplica al mundo de los juegos AAA "normalmente" puede ser, más o menos, aplicable a los juegos casuales HTML5. Sin embargo, también podrías enfocarte en vender licencias, hacer marcas, o ganar unos beneficios compartidos de los anuncios. Depende totalmente de ti, que camino vas a seguir.</p>
diff --git a/files/es/games/tools/asm.js/index.html b/files/es/games/tools/asm.js/index.html
new file mode 100644
index 0000000000..7cf59242f7
--- /dev/null
+++ b/files/es/games/tools/asm.js/index.html
@@ -0,0 +1,30 @@
+---
+title: asm.js
+slug: Games/Tools/asm.js
+tags:
+  - JavaScript
+  - asm.js
+translation_of: Games/Tools/asm.js
+original_slug: Games/Herramients/asm.js
+---
+<div>{{GamesSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<div class="summary">
+<p><span class="seoSummary"><a href="http://asmjs.org/">Asm.js</a> es un subconjunto de JavaScript que es altamente optimizable. Este artículo analiza exactamente lo que está permitido en el subconjunto asm.js, las mejoras que confiere, donde y cómo puedo utilizarlo, y otros recursos y ejemplos.</span></p>
+</div>
+
+<h2 id="¿Qué_es_asm.js_exactamente">¿Qué es asm.js exactamente?</h2>
+
+<p>Es un subconjunto muy pequeño y estricto de JavaScript que solo permite cosas como `while`, `if`, números, funciones con nombres de nivel superior y otras construcciones simples. No permite objetos, cadenas, cierres y básicamente cualquier cosa que requiera una asignación de la pila. El código asm.js se parece al lenguaje de programación "C" en muchos aspectos, pero es JavaScript completamente válido que se ejecuta en todos los motores actuales. Impulsa los motores JS para optimizar este tipo de código, y le da a los compiladores como Emscripten una definición clara de qué tipo de código generar. A continuación, mostraremos cómo es un código asm.js y explicaremos cómo le ayuda y cómo puede usarlo.</p>
+
+<p>Este subconjunto de JavaScript ya está altamente optimizado en muchos motores de JavaScript que utilizan técnicas de compilación Just-In-Time (JIT) sofisticadas. Sin embargo, al definir un estándar tan explícito, podemos trabajar en la optimización de este tipo de código aún más y obtener el máximo rendimiento posible. Facilita la colaboración en múltiples motores JS porque es fácil de comparar. La idea es que este tipo de código se ejecute muy rápido en cada motor, y si no lo hace, es que hay un error y es un claro mensaje de que los motores deben optimizarse.</p>
+
+<p>También facilita la tarea de las personas que escriben compiladores que desean generar código de alto rendimiento en la web. Pueden consultar las especificaciones de asm.js para saber que se ejecutará rápidamente si se adhieren a los patrones de asm.js. Emscripten, un compilador de C/C++ a JavaScript, genera código asm.js para que funcione con un rendimiento casi nativo en varios navegadores.</p>
+
+<p>Además, si un motor elige reconocer especialmente código asm.js, se pueden realizar aún más optimizaciones. Firefox es el único navegador que hace esto ahora.</p>
+
+<h2 id="Resumen_del_lenguaje_asm.js">Resumen del lenguaje asm.js</h2>
+
+<p>asm.js es un lenguaje de programación intermedio. Tiene una tasa de rendimiento muy predecible porque está limitada a un subconjunto extremadamente restringido de JavaScript que proporciona solo enteros, números en coma flotante, aritmética, llamadas a funciones y accesos de pila de tipo estricto. Las características de rendimiento son más cercanas al código nativo que las de JavaScript estándar. El uso del subconjunto de JavaScript asm.js ya es compatible con los principales navegadores web. Como asm.js se ejecuta en un navegador, depende en gran medida del navegador y del hardware.</p>
diff --git a/files/es/games/tools/index.html b/files/es/games/tools/index.html
new file mode 100644
index 0000000000..d738ba2f7b
--- /dev/null
+++ b/files/es/games/tools/index.html
@@ -0,0 +1,47 @@
+---
+title: Herramientas para desarrolladores de juegos
+slug: Games/Tools
+tags:
+  - NeedsContent
+  - NeedsTranslation
+  - aplicaciones
+  - juegos
+translation_of: Games/Tools
+original_slug: Games/Herramients
+---
+<div>{{GamesSidebar}}</div><div class="summary">
+ <p><span class="seoSummary">En esta pagina puedes encontrar enlaces a nuestros articulos de desarrollo de juegos, que enventualmente apuenta a cubrir frameworks, compiladores y herramientas de depuracion.</span></p>
+</div>
+<dl>
+ <dt>
+  <a href="/en-US/docs/Games/Tools/asm.js">asm.js</a></dt>
+ <dd>
+  asm.js es una subconjunto muy limitado del lenguaje Javascript que puede ser en gran medida optimizado y correr en modo compilador <em>ahead-of-time</em> (AOT) para un mejor rendimiento que el rendimiento tipico de JavaScript. Este es, por supuesto, bueno para juegos.</dd>
+ <dt>
+  <a href="https://github.com/kripken/emscripten/wiki" title="https://github.com/kripken/emscripten/wiki">Emscripten</a></dt>
+ <dd>
+  <p>Un compilador <em>LLVM</em> a JavaScript; con Emscripten, tu puedes compilar C++ y otros lenguajes que se pueden compilar a<em> LLVM</em> y luego a JavaScript de alto rendimiento. Es una buena herramiente para portar aplicaciones a la Web! Aqui hay un <a href="https://github.com/kripken/emscripten/wiki/Tutorial">util tutorial sobre Emscripten</a> disponible en la wiki. Estamos <a href="/en-US/docs/Emscripten">mirando cubrir Emscripten en su propia seccion de MDN</a>.</p>
+ </dd>
+ <dt>
+  <a href="https://addons.mozilla.org/en-us/firefox/addon/gecko-profiler/" title="https://addons.mozilla.org/en-us/firefox/addon/gecko-profiler/">Gecko profiler</a></dt>
+ <dd>
+  <em>Gecko profiler</em> es una extension que te permite perfilar tu codigo para ayudar donde tienes errores de rendimiento, asi puedes hacer que tu juego corra a velocidad maxima.</dd>
+ <dt>
+  <a href="/en-US/docs/Games/Tools/Engines_and_tools">Motores de juegos y herramientas</a></dt>
+ <dd>
+  Una lista de motores, plantillas y tecnologias utiles para los desarrolladores de juegos.</dd>
+ <dt>
+  <a href="/en-US/docs/Mozilla/Projects/Shumway">Shumway</a></dt>
+ <dd>
+  <em>Shumway</em> es un renderizador para Adobe Flash construido completamente con JavaScript, WebGL, entre otros, haciendo una brecha entre Flash y los estandares Web. Este articulo muestra como hacer uso de Shumway y como contribuir arreglos y errores al proyecto.</dd>
+ <dt>
+  Cadena de herramientas para desarrollar y depurar juegos</dt>
+ <dd>
+  Como difieren de depurar una Web app normal? Que herramientas especializadas estan disponibles? Un lote de esto va a ser cubierto por Will en <a href="/en-US/docs/Tools">herramientas</a>, pero aqui te vamos a proveer una cadena de herramientas practicas para depurar juegos con links a las cosas de Will:
+  <ul>
+   <li>Basic tools overview</li>
+   <li><a href="/en-US/docs/Tools/Shader_Editor">Shader editor</a></li>
+   <li>Performance tools (still in production, estimated early 2014)</li>
+  </ul>
+ </dd>
+</dl>
diff --git a/files/es/games/tutorials/2d_breakout_game_phaser/botones/index.html b/files/es/games/tutorials/2d_breakout_game_phaser/botones/index.html
deleted file mode 100644
index 672d7528a6..0000000000
--- a/files/es/games/tutorials/2d_breakout_game_phaser/botones/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: Botones
-slug: Games/Tutorials/2D_breakout_game_Phaser/Botones
-tags:
-  - 2D
-  - Botones
-  - JavaScript
-  - Lienzo
-  - Phaser
-  - Principiante
-  - Tutorial
-  - juegos
-translation_of: Games/Tutorials/2D_breakout_game_Phaser/Buttons
----
-<div>{{GamesSidebar}}</div>
-
-<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Animations_and_tweens", "Games/Workflows/2D_Breakout_game_Phaser/Randomizing_gameplay")}}</p>
-
-<div class="summary">
-<p>Este es el <strong>paso 15 </strong>de 16 del tutorial <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser">Gamedev Phaser</a>. Puedes encontrar el código fuente como debería quedar después de completar el tutorial en <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/lesson15.html">Gamedev-Phaser-Content-Kit/demos/lesson15.html</a>.</p>
-</div>
-
-<p><span class="seoSummary">En lugar de comenzar el juego de inmediato, podemos dejar la decisión en el jugador añadiendo un botón de Inicio que pueda pulsar. Vamos a investigar cómo hacerlo.</span></p>
-
-<h2 id="Variables_nuevas">Variables nuevas</h2>
-
-<p>Necesitamos una variable para almacenar un valor booleano que represente si el juego se está jugando actualmente o no, y otra para representar a nuestro botón. Añade las siguientes lineas a tu declaración de variables:</p>
-
-<pre class="brush: js">var playing = false;
-var startButton;
-</pre>
-
-<h2 id="Cargando_el_botón_de_spritesheet">Cargando el botón de spritesheet</h2>
-
-<p>Podemos cargar el botón de spritesheet de la misma manera que cargamos la animación del movimiento de la pelota. Añade lo siguiente al botón de la función <code>preload()</code>:</p>
-
-<pre class="brush: js">game.load.spritesheet('button', 'img/button.png', 120, 40);
-</pre>
-
-<p>El marco de un solo botón mide 120 pixels de ancho y 40 pixels de alto.</p>
-
-<p>También se debe tomar el botón de spritesheet de <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/img/button.png">Github</a>, y guardarlo en el directorio <code>/img</code>.</p>
-
-<h2 id="Añadiendo_el_botón_al_juego">Añadiendo el botón al juego</h2>
-
-<p>Para añadir el botón al juego usaremos el método <code>add.button</code>. Añade las siguientes lineas del botón a la función <code>create()</code>:</p>
-
-<pre class="brush: js">startButton = game.add.button(game.world.width*0.5, game.world.height*0.5, 'button', startGame, this, 1, 0, 2);
-startButton.anchor.set(0.5);
-</pre>
-
-<p>Los parámetros del método <code>button()</code> son los siguientes:</p>
-
-<ul>
- <li>Las coordenadas x e y del botón.</li>
- <li>El nombre del elemento gráfico que se mostrará en el botón.</li>
- <li>Una función de callback que se ejecutará cuando se presione el botón.</li>
- <li>Una referencia a <code>this</code> para especificar el contexto de ejecución.</li>
- <li>Los marcos que usaremos para los eventos <em>over</em>, <em>out</em> and <em>down</em>.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: El evento over es igual al hover, out es cuando el puntero se mueve fuera del botón y down cuando el botón es presionado.</p>
-</div>
-
-<p>Ahora necesitamos definir la función <code>startGame()</code> referenciada en el siguiente código:</p>
-
-<pre class="brush: js">function startGame() {
-    startButton.destroy();
-    ball.body.velocity.set(150, -150);
-    playing = true;
-}
-</pre>
-
-<p>Cuando se presiona el botón, se borra el botón, se establecen la velocidad inicial de la pelota y la variable <code>playing</code> a <code>true</code>.</p>
-
-<p>Para terminar con esta sección, vuelve a la función <code>create()</code>, encuentra la linea <code>ball.body.velocity.set(150, -150);</code>, y bórrala. Solo queremos que la pelota se mueva cuando se presione el botón, no antes.</p>
-
-<h2 id="Mantener_la_paleta_inmóvil_antes_de_que_comience_el_juego">Mantener la paleta inmóvil antes de que comience el juego</h2>
-
-<p>Funciona como se esperaba, pero aún podemos mover la paleta cuando el juego aún no ha comenzado, lo que parece un poco tonto. Para impedir esto, podemos aprovechar la variable <code>playing</code> y hacer que la paleta solo se mueva cuando el juego haya empezado. Para hacer esto, ajustamos la función <code>update()</code> así:</p>
-
-<pre class="brush: js">function update() {
-    game.physics.arcade.collide(ball, paddle, ballHitPaddle);
-    game.physics.arcade.collide(ball, bricks, ballHitBrick);
-    if(playing) {
-        paddle.x = game.input.x || game.world.width*0.5;
-    }
-}
-</pre>
-
-<p>De esta manera la paleta es inamovible hasta que todo esté cargado y preparado, pero sí cuando el juego actual comience.</p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Puedes comprobar el código acabado en esta lección en la demo de abajo, y jugar para entender mejor cómo funciona:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/1rpj71k4/","","400")}}</p>
-
-<h2 id="Siguientes_pasos">Siguientes pasos</h2>
-
-<p>La última cosa que haremos en esta serie de artículos es hacer el juego más interesante añadiendo algo de aleatorización a la forma en la que la pelota rebota con la paleta.</p>
-
-<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Animations_and_tweens", "Games/Workflows/2D_Breakout_game_Phaser/Randomizing_gameplay")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_phaser/bounce_off_the_walls/index.html b/files/es/games/tutorials/2d_breakout_game_phaser/bounce_off_the_walls/index.html
new file mode 100644
index 0000000000..f15637347d
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_phaser/bounce_off_the_walls/index.html
@@ -0,0 +1,52 @@
+---
+title: Rebotar en las paredes
+slug: Games/Tutorials/2D_breakout_game_Phaser/Bounce_off_the_walls
+tags:
+  - 2D
+  - Canvas
+  - JavaScript
+  - Phaser
+  - Principiante
+  - Tutorial
+  - fuerte
+  - juegos
+translation_of: Games/Tutorials/2D_breakout_game_Phaser/Bounce_off_the_walls
+original_slug: Games/Tutorials/2D_breakout_game_Phaser/Rebotar_en_las_paredes
+---
+<div>{{GamesSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Physics", "Games/Workflows/2D_Breakout_game_Phaser/Player_paddle_and_controls")}}</p>
+
+<div class="summary">
+<p>Este es el <strong>paso 6</strong> de 16 del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser">tutorial de Gamedev Phaser</a>. Puedes encontrar el código fuente como debería verse después de completar esta lección en <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/lesson06.html">Gamedev-Phaser-Content-Kit/demos/lesson06.html</a>.</p>
+</div>
+
+<p>Ahora que las físicas han sido introducidas,<span class="seoSummary">podemos empezar a implementar la detección de colisión en el juego — </span>primero miraremos las paredes<span class="seoSummary">.</span></p>
+
+<h2 id="Rebotando_en_las_fronteras_del_mundo">Rebotando en las fronteras del mundo</h2>
+
+<p>La forma más fácil de hacer que nuestra bola rebote en las paredes es decirle al marco que queremos tratar los límites del elemento  {{htmlelement("canvas")}} como paredes y no dejar que la pelota pase por ellos.  En Phaser esto se puede puede lograr usando la propiedad <code>collideWorldsBound</code>. Añade esta linea justo después de la llamada al método <code>game.physics.enable()</code> existente:</p>
+
+<pre class="brush: js">ball.body.collideWorldBounds = true;
+</pre>
+
+<p>Ahora la bola se detendrá en el borde de la pantalla en lugar de desaparecer, pero no rebota. Para que esto ocurra tenemos que configurar su rebote. Añade la siguiente línea debajo de la anterior:</p>
+
+<pre class="brush: js">ball.body.bounce.set(1);
+</pre>
+
+<p>Intenta recargar index.html otra vez — ahora deberías ver la pelota rebotando en todas las paredes y moviéndose dentro del área del lienzo.</p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Puedes consultar el código terminado para esta lección en la demostración en vivo a continuación, y jugar con él para comprender mejor cómo funciona:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/dcw36opz/","","400")}}</p>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<p>Esto está empezando a parecerse más a un juego ahora, Pero no podemos controlarlo de ninguna manera — es hora de que introduzacamos <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser/Player_paddle_and_controls">reproductor de paletas y controles</a>.</p>
+
+<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Physics", "Games/Workflows/2D_Breakout_game_Phaser/Player_paddle_and_controls")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_phaser/buttons/index.html b/files/es/games/tutorials/2d_breakout_game_phaser/buttons/index.html
new file mode 100644
index 0000000000..c9ecc25441
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_phaser/buttons/index.html
@@ -0,0 +1,107 @@
+---
+title: Botones
+slug: Games/Tutorials/2D_breakout_game_Phaser/Buttons
+tags:
+  - 2D
+  - Botones
+  - JavaScript
+  - Lienzo
+  - Phaser
+  - Principiante
+  - Tutorial
+  - juegos
+translation_of: Games/Tutorials/2D_breakout_game_Phaser/Buttons
+original_slug: Games/Tutorials/2D_breakout_game_Phaser/Botones
+---
+<div>{{GamesSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Animations_and_tweens", "Games/Workflows/2D_Breakout_game_Phaser/Randomizing_gameplay")}}</p>
+
+<div class="summary">
+<p>Este es el <strong>paso 15 </strong>de 16 del tutorial <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser">Gamedev Phaser</a>. Puedes encontrar el código fuente como debería quedar después de completar el tutorial en <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/lesson15.html">Gamedev-Phaser-Content-Kit/demos/lesson15.html</a>.</p>
+</div>
+
+<p><span class="seoSummary">En lugar de comenzar el juego de inmediato, podemos dejar la decisión en el jugador añadiendo un botón de Inicio que pueda pulsar. Vamos a investigar cómo hacerlo.</span></p>
+
+<h2 id="Variables_nuevas">Variables nuevas</h2>
+
+<p>Necesitamos una variable para almacenar un valor booleano que represente si el juego se está jugando actualmente o no, y otra para representar a nuestro botón. Añade las siguientes lineas a tu declaración de variables:</p>
+
+<pre class="brush: js">var playing = false;
+var startButton;
+</pre>
+
+<h2 id="Cargando_el_botón_de_spritesheet">Cargando el botón de spritesheet</h2>
+
+<p>Podemos cargar el botón de spritesheet de la misma manera que cargamos la animación del movimiento de la pelota. Añade lo siguiente al botón de la función <code>preload()</code>:</p>
+
+<pre class="brush: js">game.load.spritesheet('button', 'img/button.png', 120, 40);
+</pre>
+
+<p>El marco de un solo botón mide 120 pixels de ancho y 40 pixels de alto.</p>
+
+<p>También se debe tomar el botón de spritesheet de <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/img/button.png">Github</a>, y guardarlo en el directorio <code>/img</code>.</p>
+
+<h2 id="Añadiendo_el_botón_al_juego">Añadiendo el botón al juego</h2>
+
+<p>Para añadir el botón al juego usaremos el método <code>add.button</code>. Añade las siguientes lineas del botón a la función <code>create()</code>:</p>
+
+<pre class="brush: js">startButton = game.add.button(game.world.width*0.5, game.world.height*0.5, 'button', startGame, this, 1, 0, 2);
+startButton.anchor.set(0.5);
+</pre>
+
+<p>Los parámetros del método <code>button()</code> son los siguientes:</p>
+
+<ul>
+ <li>Las coordenadas x e y del botón.</li>
+ <li>El nombre del elemento gráfico que se mostrará en el botón.</li>
+ <li>Una función de callback que se ejecutará cuando se presione el botón.</li>
+ <li>Una referencia a <code>this</code> para especificar el contexto de ejecución.</li>
+ <li>Los marcos que usaremos para los eventos <em>over</em>, <em>out</em> and <em>down</em>.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: El evento over es igual al hover, out es cuando el puntero se mueve fuera del botón y down cuando el botón es presionado.</p>
+</div>
+
+<p>Ahora necesitamos definir la función <code>startGame()</code> referenciada en el siguiente código:</p>
+
+<pre class="brush: js">function startGame() {
+    startButton.destroy();
+    ball.body.velocity.set(150, -150);
+    playing = true;
+}
+</pre>
+
+<p>Cuando se presiona el botón, se borra el botón, se establecen la velocidad inicial de la pelota y la variable <code>playing</code> a <code>true</code>.</p>
+
+<p>Para terminar con esta sección, vuelve a la función <code>create()</code>, encuentra la linea <code>ball.body.velocity.set(150, -150);</code>, y bórrala. Solo queremos que la pelota se mueva cuando se presione el botón, no antes.</p>
+
+<h2 id="Mantener_la_paleta_inmóvil_antes_de_que_comience_el_juego">Mantener la paleta inmóvil antes de que comience el juego</h2>
+
+<p>Funciona como se esperaba, pero aún podemos mover la paleta cuando el juego aún no ha comenzado, lo que parece un poco tonto. Para impedir esto, podemos aprovechar la variable <code>playing</code> y hacer que la paleta solo se mueva cuando el juego haya empezado. Para hacer esto, ajustamos la función <code>update()</code> así:</p>
+
+<pre class="brush: js">function update() {
+    game.physics.arcade.collide(ball, paddle, ballHitPaddle);
+    game.physics.arcade.collide(ball, bricks, ballHitBrick);
+    if(playing) {
+        paddle.x = game.input.x || game.world.width*0.5;
+    }
+}
+</pre>
+
+<p>De esta manera la paleta es inamovible hasta que todo esté cargado y preparado, pero sí cuando el juego actual comience.</p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Puedes comprobar el código acabado en esta lección en la demo de abajo, y jugar para entender mejor cómo funciona:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/1rpj71k4/","","400")}}</p>
+
+<h2 id="Siguientes_pasos">Siguientes pasos</h2>
+
+<p>La última cosa que haremos en esta serie de artículos es hacer el juego más interesante añadiendo algo de aleatorización a la forma en la que la pelota rebota con la paleta.</p>
+
+<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Animations_and_tweens", "Games/Workflows/2D_Breakout_game_Phaser/Randomizing_gameplay")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_phaser/rebotar_en_las_paredes/index.html b/files/es/games/tutorials/2d_breakout_game_phaser/rebotar_en_las_paredes/index.html
deleted file mode 100644
index 0276d5dc7f..0000000000
--- a/files/es/games/tutorials/2d_breakout_game_phaser/rebotar_en_las_paredes/index.html
+++ /dev/null
@@ -1,51 +0,0 @@
----
-title: Rebotar en las paredes
-slug: Games/Tutorials/2D_breakout_game_Phaser/Rebotar_en_las_paredes
-tags:
-  - 2D
-  - Canvas
-  - JavaScript
-  - Phaser
-  - Principiante
-  - Tutorial
-  - fuerte
-  - juegos
-translation_of: Games/Tutorials/2D_breakout_game_Phaser/Bounce_off_the_walls
----
-<div>{{GamesSidebar}}</div>
-
-<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Physics", "Games/Workflows/2D_Breakout_game_Phaser/Player_paddle_and_controls")}}</p>
-
-<div class="summary">
-<p>Este es el <strong>paso 6</strong> de 16 del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser">tutorial de Gamedev Phaser</a>. Puedes encontrar el código fuente como debería verse después de completar esta lección en <a href="https://github.com/end3r/Gamedev-Phaser-Content-Kit/blob/gh-pages/demos/lesson06.html">Gamedev-Phaser-Content-Kit/demos/lesson06.html</a>.</p>
-</div>
-
-<p>Ahora que las físicas han sido introducidas,<span class="seoSummary">podemos empezar a implementar la detección de colisión en el juego — </span>primero miraremos las paredes<span class="seoSummary">.</span></p>
-
-<h2 id="Rebotando_en_las_fronteras_del_mundo">Rebotando en las fronteras del mundo</h2>
-
-<p>La forma más fácil de hacer que nuestra bola rebote en las paredes es decirle al marco que queremos tratar los límites del elemento  {{htmlelement("canvas")}} como paredes y no dejar que la pelota pase por ellos.  En Phaser esto se puede puede lograr usando la propiedad <code>collideWorldsBound</code>. Añade esta linea justo después de la llamada al método <code>game.physics.enable()</code> existente:</p>
-
-<pre class="brush: js">ball.body.collideWorldBounds = true;
-</pre>
-
-<p>Ahora la bola se detendrá en el borde de la pantalla en lugar de desaparecer, pero no rebota. Para que esto ocurra tenemos que configurar su rebote. Añade la siguiente línea debajo de la anterior:</p>
-
-<pre class="brush: js">ball.body.bounce.set(1);
-</pre>
-
-<p>Intenta recargar index.html otra vez — ahora deberías ver la pelota rebotando en todas las paredes y moviéndose dentro del área del lienzo.</p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Puedes consultar el código terminado para esta lección en la demostración en vivo a continuación, y jugar con él para comprender mejor cómo funciona:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/dcw36opz/","","400")}}</p>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<p>Esto está empezando a parecerse más a un juego ahora, Pero no podemos controlarlo de ninguna manera — es hora de que introduzacamos <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_Breakout_game_Phaser/Player_paddle_and_controls">reproductor de paletas y controles</a>.</p>
-
-<p>{{PreviousNext("Games/Workflows/2D_Breakout_game_Phaser/Physics", "Games/Workflows/2D_Breakout_game_Phaser/Player_paddle_and_controls")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html
new file mode 100644
index 0000000000..b9a7ed4290
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/bounce_off_the_walls/index.html
@@ -0,0 +1,102 @@
+---
+title: Rebota en las paredes
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls
+---
+<div>{{GamesSidebar}}</div><div>
+<p>{{IncludeSubnav("/es/docs/Games")}}</p>
+</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado")}}</p>
+
+<div class="summary">
+<p>Este es el tercer paso de 10 del  <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">tutorial Canvas para el desarrollo de juegos</a>. Puedes encontrar el código fuente y pegarle un vistazo después de completar esta lección <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson03.html">Gamedev-Canvas-workshop/lesson3.html</a>.</p>
+</div>
+
+<p><span class="seoSummary">Es agradable ver nuestra bola moviéndose, pero desaparece rápidamente de la pantalla, limitando la diversión que podemos tener con ella. Para superar esto, implementaremos una detección de colisión muy simple (que se explicará <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch/Collision_detection">más adelante</a> con más detalle) para hacer que la pelota rebote en los cuatro bordes del Canvas.</span></p>
+
+<h2 id="Detección_de_colisión_simple">Detección de colisión simple</h2>
+
+<p>Para detectar la colisión verificamos si la bola está tocando (chocando con) la pared y si es así, cambiaremos la dirección de su movimiento en consecuencia.</p>
+
+<p>Para facilitar los cálculos, definamos una variable llamada <code>ballRadius</code> que mantendrá el radio del círculo dibujado y se utilizará para los cálculos. Añade esto a tu código, en algún lugar por debajo de las declaraciones de variables existentes:</p>
+
+<pre class="brush: js">var ballRadius = 10;</pre>
+
+<p>Ahora actualice la línea que dibuja la bola dentro de la funcion drawBall() a esto:</p>
+
+<pre class="brush: js">ctx.arc(x, y, ballRadius, 0, Math.PI*2);</pre>
+
+<h3 id="Rebotando_arriba_y_abajo">Rebotando arriba y abajo</h3>
+
+<p>Hay cuatro paredes para rebotar la pelota - vamos a centrarnos en la de arriba en primer lugar. Tendremos que comprobar, en cada fotograma, si la pelota está tocando el borde superior del Canvas - si es así, invertiremos el movimiento de la bola para que empiece a moverse en la dirección opuesta y se mantenga dentro de los límites visibles. Recordando que el sistema de coordenadas comienza desde la parte superior izquierda, podemos llegar a algo como esto:</p>
+
+<pre class="brush: js">if(y + dy &lt; 0) {
+    dy = -dy;
+}</pre>
+
+<p>Si el valor de y de la posición de la bola es menor que cero, cambie la dirección del movimiento en el eje y, estableciéndolo igual a sí mismo, invertido. Si la pelota se movía hacia arriba con una velocidad de 2 píxeles por fotograma, ahora se moverá "arriba" con una velocidad de -2 píxeles, lo que en realidad equivale a bajar a una velocidad de 2 píxeles por fotograma.</p>
+
+<p>El código anterior se ocuparía de que la pelota rebote desde el borde superior, así que ahora vamos a pensar en el borde inferior:</p>
+
+<pre class="brush: js">if(y + dy &gt; canvas.height) {
+    dy = -dy;
+}</pre>
+
+<p>Si la posición y de la pelota es mayor que la altura del canvas (recuerde que contamos los valores y desde la parte superior izquierda, de modo que el borde superior empieza en 0 y el borde inferior está en 480 píxeles, la altura del canvas), entonces rebota del borde inferior invirtiendo el movimiento del eje y como antes.</p>
+
+<p>Podríamos fusionar esas dos sentencias en una para ahorrar código:</p>
+
+<pre class="brush: js">if(y + dy &gt; canvas.height || y + dy &lt; 0) {
+    dy = -dy;
+}</pre>
+
+<p>Si cualquiera de las dos afirmaciones es verdadera, invierte el movimiento de la pelota.</p>
+
+<h3 id="Rebotando_en_la_izquierda_y_derecha">Rebotando en la izquierda y derecha</h3>
+
+<p>Tenemos el borde superior e inferior cubiertos, así que pensemos en los de izquierda y derecha. Es muy similar en realidad, todo lo que tienes que hacer es repetir las declaraciones de x en lugar de y:</p>
+
+<pre class="brush: js">if(x + dx &gt; canvas.width || x + dx &lt; 0) {
+    dx = -dx;
+}
+
+if(y + dy &gt; canvas.height || y + dy &lt; 0) {
+    dy = -dy;
+}</pre>
+
+<p>En este punto, debe insertar el bloque de código anterior en la función draw(), justo antes de la llave de cierre.</p>
+
+<h3 id="¡La_pelota_sigue_desapareciendo_en_la_pared!">¡La pelota sigue desapareciendo en la pared!</h3>
+
+<p>Prueba tu código en este punto, y te quedarás impresionado - ¡ahora tenemos una pelota que rebotó en los cuatro bordes del canvas! Pero tenemos otro problema sin embargo - cuando la bola golpea cada pared se hunde en ella levemente antes de cambiar la dirección:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10432/ball-in-wall.png" style="display: block; height: 320px; margin: 0px auto; width: 480px;"></p>
+
+<p>Esto es porque estamos calculando el punto de colisión de la pared y el centro de la bola, mientras que deberíamos hacerlo por su circunferencia. La bola debe rebotar justo después de que toca la pared, no cuando ya está a medio camino en la pared, así que vamos a ajustar nuestras declaraciones un poco para incluir eso. Actualice el último código que agregó, a esto:</p>
+
+<pre class="brush: js">if(x + dx &gt; canvas.width-ballRadius || x + dx &lt; ballRadius) {
+    dx = -dx;
+}
+if(y + dy &gt; canvas.height-ballRadius || y + dy &lt; ballRadius) {
+    dy = -dy;
+}</pre>
+
+<p>Cuando la distancia entre el centro de la bola y el borde de la pared es exactamente igual que el radio de la pelota, cambiará la dirección del movimiento. Restando el radio de un ancho del eje y añadiéndolo al otro nos da la impresión de una adecuada detección de colisiones - la pelota rebota de las paredes como debería hacerlo.</p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Chequea el código acabado para esta parte con el tuyo, y juega:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/redj37dc/","","370")}}</p>
+
+<div class="note">
+<p><strong>Ejercicio</strong>: cambia el color de la bola a un color al azar, cada vez que golpea una pared.</p>
+</div>
+
+<h2 id="Siguientes_pasos">Siguientes pasos</h2>
+
+<p>Ahora hemos llegado al punto donde nuestra pelota se mueve y permanece en el tablero de juego. En el capítulo cuarto, veremos la implementación del control de una pala - vea <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado">Control de Pala y teclado</a>.</p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html
new file mode 100644
index 0000000000..1cc9c22783
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/build_the_brick_field/index.html
@@ -0,0 +1,127 @@
+---
+title: Construye el muro de ladrillos
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones")}}</p>
+
+<div class="summary">
+<p>Este es el sexto<strong> paso de 10 del</strong> <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro">Tutorial del Lienzo (Canvas) para desarrollar juegos (Gamedev Canvas Tutorial)</a>. Puedes encontrar el código fuente como debería quedar tras completar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson06.html">Gamedev-Canvas-workshop/lesson6.html</a>.</p>
+</div>
+
+<p>Hemos cambiado la mecánica del juego y ahora ya podemos perder.<span class="seoSummary"> Esto es genial porque significa que el juego finalmente se comporta como un juego. Sin embargo, pronto resultará aburrido si todo lo que puedes conseguir es hacer rebotar la pelota en las paredes y en la pala. Lo que el juego necesitamos es romper ladrillos con la bola. Ahora vamos a dibujar los ladrillos.</span></p>
+
+<h2 id="Declarar_e_inicializar_las_variables_de_los_ladrillos">Declarar e inicializar las variables de los ladrillos</h2>
+
+<p>El propósito principal de esta lección consiste en escribir unas pocas líneas de código para los ladrillos, utilizando un bucle anidado que recorra una matriz bidimensional. Pero, antes, necesitamos preparar unas variables que definan la información sobre los ladrillos, como su ancho y alto, filas y columnas, etc. Añade estas líneas a tu programa, debajo de las otras variables que has definido antes:</p>
+
+<pre class="brush: js">var brickRowCount = 3;
+var brickColumnCount = 5;
+var brickWidth = 75;
+var brickHeight = 20;
+var brickPadding = 10;
+var brickOffsetTop = 30;
+var brickOffsetLeft = 30;</pre>
+
+<p>Aquí hemos definido el número de filas (Row) y columnas (Column) de ladrillos, su ancho (Width) y alto (Height), el hueco entre los ladrillos para que no se toquen (Padding), y un margen superior (Top) e izquierdo (Left) para que no se dibujen tocando los bordes.</p>
+
+<p>Guardaremos nuestros ladrillos en una matriz bidimensional que contendrá las columnas (c) de los ladrillos. Cada columna contendrá, a su vez, toda la fila (r) de ladrillos. Cada ladrillo se va a representar con un objeto con las posiciones "x" e "y" en las que se dibujará. Añade esto detrás de las definiciones de las variables:</p>
+
+<pre class="brush: js">var bricks = [];
+for(c=0; c&lt;brickColumnCount; c++) {
+    bricks[c] = [];
+    for(r=0; r&lt;brickRowCount; r++) {
+        bricks[c][r] = { x: 0, y: 0 };
+    }
+}</pre>
+
+<p>El código anterior pasará por las filas y las columnas y creará los ladrillos. TEN EN CUENTA que esos objetos que representan a los ladrillos también se utilizarán para detectar colisiones más adelante.</p>
+
+<p>Por si no lo terminas de entender... bricks[0][0] es el primer ladrillo (columna 0, fila 0) y se dibujará en "x" 0 e "y" 0. El siguiente ladrillo será el brick[0][1] (columna 0, fila 1) y se dibujará también en (0,0). Así, continuaremos hasta el final de la primera columna, que será el ladrillo bricks[0][2] porque hay 3 filas, de la 0 a la 2. Terminará así el bucle de dentro y seguirá el de fuera, valiendo ahora la "c" 1. Seguiremos recorriendo bricks[] hasta llegar a bricks[2][4], que es el último ladrillo.</p>
+
+<h2 id="Dibujar_los_bloques">Dibujar los bloques</h2>
+
+<p>Ahora vamos a crear una función para recorrer todos los bloques de la matriz y dibujarlos en la pantalla:</p>
+
+<pre class="brush: js">function drawBricks() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            bricks[c][r].x = 0;
+            bricks[c][r].y = 0;
+            ctx.beginPath();
+            ctx.rect(0, 0, brickWidth, brickHeight);
+            ctx.fillStyle = "#0095DD";
+            ctx.fill();
+            ctx.closePath();
+        }
+    }
+}
+</pre>
+
+<p>Viene a ser lo mismo de antes, sólo que hemos añadido ctx.rect() para dibujar un rectángulo por cada ladrillo, además de otras llamadas a funciones para que, efectivamente, se dibuje el rectángulo.</p>
+
+<p>Cada ladrillo se dibujará en la posición (0, 0), tendrá un ancho brickWidth y un alto de brickHeight.</p>
+
+<p>Estupendo pero... ¡estamos dibujando todos los ladrillos en el mismo sitio! ¡Eso no puede ser!</p>
+
+<p>Vamos a calcular en qué posición "x" e "y" se tiene que dibujar cada ladrillo así:</p>
+
+<pre class="brush: js">var brickX = (c*(brickWidth+brickPadding))+brickOffsetLeft;
+var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;
+</pre>
+
+<p>El primer ladrillo se dibujará arriba a la izquierda, concretamente en (brickoffsetLeft, brickOffsetTop), porque c y r valen 0.</p>
+
+<p>El siguiente ladrillo (columna 0, fila 1) se dibujará más abajo.</p>
+
+<p>Intenta hacer tú mismo los cálculos y verás cómo cada ladrillo de la misma columna se dibujará más abajo o más arriba según en qué fila se encuentre.</p>
+
+<p>También verás cómo cada ladrillo de la misma fila se dibujará más a la izquierda o a la derecha según en qué columna se encuentre.</p>
+
+<p>Vamos a terminar la función drawBricks() para que quede así:</p>
+
+<pre class="brush: js">function drawBricks() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            var brickX = (c*(brickWidth+brickPadding))+brickOffsetLeft;
+            var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;
+            bricks[c][r].x = brickX;
+            bricks[c][r].y = brickY;
+            ctx.beginPath();
+            ctx.rect(brickX, brickY, brickWidth, brickHeight);
+            ctx.fillStyle = "#0095DD";
+            ctx.fill();
+            ctx.closePath();
+        }
+    }
+}</pre>
+
+<h2 id="Dibujar_los_bloques_(ahora_sí)">Dibujar los bloques (ahora sí)</h2>
+
+<p>Lo estamos haciendo muy bien, pero si has probado te habrás dado cuenta de que no se dibuja nada. ¿Qué es lo que falla?</p>
+
+<p>Pues, sencillamente, que tenemos definida la función drawBricks() pero no la llamamos desde ningún sitio.</p>
+
+<p>Añade drawBricks() dentro de draw(), justo antes de drawBall ():</p>
+
+<pre class="brush: js">drawBricks();
+</pre>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Compara tu código con este:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/kundan333/myd4vbwg/2/","","320")}}</p>
+
+<div class="note">
+<p>Ejercicio: Prueba a cambiar el número de bloques por fila o columna, o sus posiciones (utiliza las variables que definiste al principio de este capítulo).</p>
+</div>
+
+<h2 id="Pasos_siguientes">Pasos siguientes</h2>
+
+<p>¡Así que ahora tenemos ladrillos! Un gran avance pero... la pelota no los rompe, simplemente los atraviesa. En el siguiente capítulo lo arreglaremos: <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones">Detección de colisiones</a>.</p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html
new file mode 100644
index 0000000000..3fa35ecbfb
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/collision_detection/index.html
@@ -0,0 +1,129 @@
+---
+title: Detección de colisiones
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Collision_detection
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Collision_detection
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones
+---
+<div>{{GamesSidebar}}</div>
+
+<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win")}}</p>
+
+<div class="summary">
+<p>Este es el séptimo paso de los 10 del juego "<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>". Puedes encontrar el código como deberá quedar después de completar la leción en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson07.html">Gamedev-Canvas-workshop/lesson7.html</a>.</p>
+</div>
+
+<p><span class="seoSummary">Ya tenemos los ladrillos en la pantalla pero el juego todavía no es muy interesante, porque la bola los atraviesa. Tenemos que pensar una manera de detectar colisiones para que la bola pueda rebotar en los ladrillos y romperlos.</span></p>
+
+<p><span class="seoSummary">Nosotros decidimos cómo implementar esto, por supuesto, pero puede ser complicado calcular si la bola está tocando el rectángulo o no, porque no hay funciones del &lt;canvas&gt; que sirvan para saberlo. En este tutorial vamos a hacerlo de la manera más fácil que existe: comprobaremos si el centro de la bola está tocando (colisionando) con cualquiera de los ladrillos. No siempre funcionará a la perfección y hay formas de detectar colisiones más sofisticadas que funcionan mejor, pero no nos interesa verlas porque estamos aprendiendo y tenemos que hacer las cosas fáciles</span>.</p>
+
+<h2 id="Una_función_para_detectar_colisiones">Una función para detectar colisiones</h2>
+
+<p>Para lograr nuestro objetivo vamos a definir una función que, con un bucle, recorrerá todos los ladrillos y comparará la posición de cada uno con la posición de la bola, cada vez que se dibuje un fotograma. Para que el código sea más legible definiremos la variable "b" que almacenará el objeto ladrillo en cada vuelta de bucle:</p>
+
+<pre class="brush: js">function collisionDetection() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            var b = bricks[c][r];
+            // calculations
+        }
+    }
+}</pre>
+
+<p>Si el centro de la bola está dentro de las coordenadas de uno de nuestros ladrillos, cambiaremos la dirección de la bola. Se cumplirá que el centro de la bola está dentro de ladrillo si se cumplen al mismo tiempo estas cuatro condiciones:</p>
+
+<ul>
+ <li>La posición "x" de la bola es mayor que la posición "x" del ladrillo</li>
+ <li>La posición "x" de la bola es menor que la posición del ladrillo más el ancho del ladrillo</li>
+ <li>La posición "y" de la bola es mayor que la posición "y" del ladrillo.</li>
+ <li>La posición "y" de la bola es menor que la posición del ladrillo más su altura.</li>
+</ul>
+
+<p>Traducimos esto a JavaScript:</p>
+
+<pre class="brush: js">function collisionDetection() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            var b = bricks[c][r];
+            if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
+                dy = -dy;
+            }
+        }
+    }
+}</pre>
+
+<p>Añade lo anterior a tu código, debajo de la función <code>keyUpHandler()</code>.</p>
+
+<h2 id="Hacer_que_los_ladrillos_desaparezcan_cuando_reciben_un_golpe">Hacer que los ladrillos desaparezcan cuando reciben un golpe</h2>
+
+<p>El código anterior funcionará correctamente y la bola cambiará de dirección. El problema es que los ladrillos siguen donde están. Tenemos que imaginar una forma de ocuparnos de los que ya hemos golpeado con la bola. Podemos hacerlo añadiendo un parámetro extra para indicar si queremos pintar cada ladrillo en la pantalla o no. En la parte del código donde inicializamos los ladrillos, añadiremos una propiedad <code>status</code> a cada ladrillo. Cambia tu código fijándote en la línea que está resaltada:</p>
+
+<pre class="brush: js; highlight:[5]">var bricks = [];
+for(c=0; c&lt;brickColumnCount; c++) {
+    bricks[c] = [];
+    for(r=0; r&lt;brickRowCount; r++) {
+        bricks[c][r] = { x: 0, y: 0, status: 1 };
+    }
+}</pre>
+
+<p>A continuación consultaremos el "status" de cada ladrillo para saber si lo tenemos que dibujar o no. Si "status" vale 1, lo dibujaremos. Si vale 0, no lo dibujaremos porque habrá sido golpeado por la bola. Actualiza tu función <code>drawBricks()</code> para que quede así:</p>
+
+<pre class="brush: js; highlight:[4,5,6,7,8,9,10,11,12,13,14]">function drawBricks() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            if(bricks[c][r].status == 1) {
+                var brickX = (c*(brickWidth+brickPadding))+brickOffsetLeft;
+                var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;
+                bricks[c][r].x = brickX;
+                bricks[c][r].y = brickY;
+                ctx.beginPath();
+                ctx.rect(brickX, brickY, brickWidth, brickHeight);
+                ctx.fillStyle = "#0095DD";
+                ctx.fill();
+                ctx.closePath();
+            }
+        }
+    }
+}</pre>
+
+<h2 id="Actualizar_el_status_en_la_función_de_detección_de_colisiones">Actualizar el "status" en la función de detección de colisiones</h2>
+
+<p>Ahora tenemos que ocuparnos del valor de "status" en la función <code>collisionDetection()</code>: si el ladrillo está activo (status 1) comprobaremos si hay colisión. Si hay colisión, pondremos el "status" de ese ladrillo a 0 para no volver a pintarlo. Actualiza <code>collisionDetection()</code> así:</p>
+
+<pre class="brush: js; highlight:[5,6,7,8,9,10]">function collisionDetection() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            var b = bricks[c][r];
+            if(b.status == 1) {
+                if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
+                    dy = -dy;
+                    b.status = 0;
+                }
+            }
+        }
+    }
+}</pre>
+
+<h2 id="Activar_la_función_de_detección_de_colisiones">Activar la función de detección de colisiones</h2>
+
+<p>Ya sólo falta llamar a la función <code>collisionDetection()</code> desde la función <code>draw()</code>. Añade la línea siguiente dentro de <code>draw()</code> function, justo después de la llamada a <code>drawPaddle()</code>:</p>
+
+<pre class="brush: js">collisionDetection();
+</pre>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Ahora se comprueban las colisiones cada vez que se dibuja un fotograma. Concretamente, miramos si la bola colisiona con cada ladrillo. ¡Ahora ya podemos romper ladrillos! :-</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/kundan333/myd4vbwg/5/","","320")}}</p>
+
+<div class="note">
+<p><strong>Ejercicio</strong>: cambia el color de la bola cada vez que choque con un ladrillo.</p>
+</div>
+
+<h2 id="Pasos_siguientes">Pasos siguientes</h2>
+
+<p>Definitivamente, lo estamos consiguiendo. ¡Adelanteeee! En el capítulo octavo nos ocuparemos de la <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win">Puntuación y fin del juego ganando</a>.</p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html
new file mode 100644
index 0000000000..bc415c8db4
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html
@@ -0,0 +1,110 @@
+---
+title: Crea el lienzo (canvas) y dibuja en él
+slug: >-
+  Games/Tutorials/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it
+translation_of: >-
+  Games/Tutorials/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it
+original_slug: >-
+  Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola")}}</p>
+
+<div class="summary">
+<p>Este es el primero de los 10 pasos del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Tutorial del Lienzo (Canvas) para desarrollar juegos (Gamedev Canvas Tutorial)</a>. Puedes encontrar el código fuente como debería quedar tras completar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson01.html">Gamedev-Canvas-workshop/lesson1.html</a>.</p>
+</div>
+
+<p><span class="seoSummary">Antes de que podamos programar la parte funcional del juego, necesitamos crear la estructura básica de la página que lo va a contener. Podemos hacerlo utilizando HTML y el elemento  {{htmlelement("canvas")}} .</span></p>
+
+<h2 id="El_HTML_del_juego">El HTML del juego</h2>
+
+<p>La estructura del documento HTML es muy simple, porque todo el juego se visualizará dentro del elemento {{htmlelement("canvas")}}. Con tu editor de textos favorito, prepara un documento en blanco, guárdalo como <code>index.html</code> en un lugar adecuado, y escribe el siguiente código:</p>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+    &lt;meta charset="utf-8" /&gt;
+    &lt;title&gt;Gamedev Canvas Workshop&lt;/title&gt;
+    &lt;style&gt;
+    	* { padding: 0; margin: 0; }
+    	canvas { background: #eee; display: block; margin: 0 auto; }
+    &lt;/style&gt;
+&lt;/head&gt;
+&lt;body&gt;
+
+&lt;canvas id="myCanvas" width="480" height="320"&gt;&lt;/canvas&gt;
+
+&lt;script&gt;
+	// JavaScript code goes here
+&lt;/script&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>En la cabecera (head) tenemos un <code>charset</code>, el título de la página {{htmlelement("title")}} y un poco de CSS básico. El {{htmlelement("body")}} contiene los elementos{{htmlelement("canvas")}} y {{htmlelement("script")}}. Representaremos el juego en el primero y escribiremos el código JavaScript que lo controla en el segundo. El elemento  {{htmlelement("canvas")}} tiene el <code>id</code> <code>myCanvas</code> para que podamos hacer referencia a él con facilidad, y mide 480 píxeles de ancho por 320 de alto. Todo el código JavaScript que vamos a escribir en este tutorial lo pondremos entre las etiquetas <code>&lt;script&gt;<font face="Thread-00002020-Id-00000048"> y</font></code> <code>&lt;/script&gt;</code>.</p>
+
+<h2 id="El_lienzo_(canvas)">El lienzo (canvas)</h2>
+
+<p>Para que podamos visualizar los gráficos en el elemento {{htmlelement("canvas")}}, primero tenemos que preparar una referencia a él en JavaScript. Añade lo siguiente después de la etiqueta <code>&lt;script&gt;:</code></p>
+
+<pre class="brush: js">var canvas = document.getElementById("myCanvas");
+var ctx = canvas.getContext("2d");</pre>
+
+<p>Aquí estamos guardando una referencia al elemento {{htmlelement("canvas")}} en la variable <code>canvas</code>. Después estamos creando la variable <code>ctx</code> para guardar el contexto de gráficos 2D, que es la herramienta  que realmente utilizaremos para dibujar.</p>
+
+<p>Veamos un fragmento de código de ejemplo que dibuja un cuadrado rojo en el canvas. Añade el código a continuación y abre el archivo <code>index.html</code> con un navegador para comprobar que funciona:</p>
+
+<pre class="brush: js">ctx.beginPath();
+ctx.rect(20, 40, 50, 50);
+ctx.fillStyle = "#FF0000";
+ctx.fill();
+ctx.closePath();</pre>
+
+<p>Todas las instrucciones están entre los métodos {{domxref("CanvasRenderingContext2D.beginPath()","beginPath()")}} y {{domxref("CanvasRenderingContext2D.closePath()","closePath()")}}. Estamos definiendo un rectángulo utilizando {{domxref("CanvasRenderingContext2D.rect()","rect()")}}: los dos primeros valores especifican las coordenadas de la esquina superior izquierda del rectángulo en el canvas, y  los otros dos sirven para indicar el ancho y el alto. En nuestro caso, el rectángulo se dibuja a 20 píxeles desde la izquierda de la pantalla y 40 píxeles desde la parte de arriba, y tiene 50 píxeles de ancho y 50 de alto, con lo que obtenemos un cuadrado perfecto. La propiedad {{domxref("CanvasRenderingContext2D.fillStyle","fillStyle")}} guarda un color que utilizará el método {{domxref("CanvasRenderingContext2D.fill()","fill()")}} para pintar el cuadrado que, en nuestro caso, será rojo.</p>
+
+<p>Podemos dibujar otras cosas aparte de rectángulos. Aquí hay un fragmento de código que dibuja un círculo verde. Prueba a añadir esto al final de tu código JavaScript, guárdalo y recarga la página en el navegador:</p>
+
+<pre class="brush: js">ctx.beginPath();
+ctx.arc(240, 160, 20, 0, Math.PI*2, false);
+ctx.fillStyle = "green";
+ctx.fill();
+ctx.closePath();</pre>
+
+<p>Como puedes ver, estamos utilizando otra vez los métodos {{domxref("CanvasRenderingContext2D.beginPath()","beginPath()")}} y {{domxref("CanvasRenderingContext2D.closePath()","closePath()")}}. De lo que hay en medio, la parte más importante del código anterior es el método {{domxref("CanvasRenderingContext2D.arc()","arc()")}}. Tiene seis parámetros:</p>
+
+<ul>
+ <li>las coordenadas x e y del centro del arco</li>
+ <li>el radio del arco</li>
+ <li>los ángulos inicial y final (en qué ángulo empezar y terminar de dibujar el círculo, en radianes)</li>
+ <li>la dirección hacia la que se dibujará (<code>false</code> para seguir el sentido de las agujas del reloj, que es el valor por defecto, o <code>true</code> para el sentido contrario). Este parámetro es opcional.</li>
+</ul>
+
+<p>La propiedad {{domxref("CanvasRenderingContext2D.fillStyle","fillStyle")}} tiene un valor distinto al que habíamos puesto antes. Esto se debe a que, como ocurre en CSS, el color se puede especificar como un valor hexadecimal, como un nombre de color en inglés, la función <code>rgba()</code>, o cualquiera de los otros métodos de descripción de color que existen.</p>
+
+<p>En lugar de utilizar {{domxref("CanvasRenderingContext2D.fill()","fill()")}} y rellenar las formas con colores, podemos utilizar {{domxref("CanvasRenderingContext2D.stroke()","stroke()")}} para colorear únicamente el trazo exterior. Prueba a añadir también esto a tu código JavaScript:</p>
+
+<pre class="brush: js">ctx.beginPath();
+ctx.rect(160, 10, 100, 40);
+ctx.strokeStyle = "rgba(0, 0, 255, 0.5)";
+ctx.stroke();
+ctx.closePath();</pre>
+
+<p>El código anterior dibuja un rectángulo vacío con el perímetro azul. Gracias al canal alfa de la función <code>rgba()</code>, que es el cuarto valor (Red, Green, Blue, Alpha), el color azul será medio transparente.</p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Aquí está el código fuente completo de la primera lección, ejecutándose en un JSFiddle:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/x62h15e2/","","370")}}</p>
+
+<div class="note">
+<p><strong>Ejercicio</strong>: cambia el tamaño y el color de las figuras.</p>
+</div>
+
+<h2 id="Pasos_siguientes">Pasos siguientes</h2>
+
+<p>Hemos preparado la estructura HTML básica y hemos aprendido un poquito a manejar el canvas. Para continuar, en el segundo capítulo averiguaremos cómo mover la bola en nuestro juego (<a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola">Mueve la bola</a>).</p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html
new file mode 100644
index 0000000000..6401e237b6
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/finishing_up/index.html
@@ -0,0 +1,96 @@
+---
+title: Terminando
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Finishing_up
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Finishing_up
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>{{Previous("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
+
+<div class="summary">
+<p>Este es el último de los 10 pasos del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>. Puedes encontrar el código fuente tal y como quedará al terminar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson10.html">Gamedev-Canvas-workshop/lesson10.html</a>.</p>
+</div>
+
+<p>Siempre es posible mejorar cualquier juego que hagamos. Por ejemplo, podemos dar vidas al jugador. Así, aunque pierda la bola una o dos veces, todavía puede intentar derribar todo el muro. También podemos mejorar los aspectos gráficos.</p>
+
+<h2 id="Dar_vidas_al_jugador">Dar vidas al jugador</h2>
+
+<p>Dar vidas es bastante sencillo. Primero, añade una variable para guardar el número de vidas que tiene en cada momento. Ponla después de las que ya tienes:</p>
+
+<pre class="brush: js">var lives = 3;</pre>
+
+<p>Mostrar por pantalla el número de vidas es prácticamente lo mismo que mostrar el contador de puntos. Añade la función siguiente detrás de la función <code>drawScore()</code>:</p>
+
+<pre class="brush: js">function drawLives() {
+    ctx.font = "16px Arial";
+    ctx.fillStyle = "#0095DD";
+    ctx.fillText("Lives: "+lives, canvas.width-65, 20);
+}</pre>
+
+<p>En lugar de terminar el juego inmediatamente, restaremos una vida hasta que ya no quede ninguna. También podemos colocar la bola y la paleta en la posición inicial cuando el jugador empiece con la vida siguiente. En la función <code style="font-style: normal; font-weight: normal;">draw()</code> cambia las dos líneas siguientes...</p>
+
+<pre class="brush: js">alert("GAME OVER");
+document.location.reload();</pre>
+
+<p>... por estas otras:</p>
+
+<pre class="brush: js">lives--;
+if(!lives) {
+    alert("GAME OVER");
+    document.location.reload();
+}
+else {
+    x = canvas.width/2;
+    y = canvas.height-30;
+    dx = 2;
+    dy = -2;
+    paddleX = (canvas.width-paddleWidth)/2;
+}</pre>
+
+<p>Ahora, cuando la bola toca el fondo, restamos una vida. Si no queda ninguna, el jugador pierde y termina la partida. Si queda alguna, entonces colocamos la bola y la paleta en el centro, y hacemos que la bola vaya en la nueva dirección correcta y a la velocidad inicial.</p>
+
+<h3 id="Sacar_por_pantalla_el_contador_de_vidas">Sacar por pantalla el contador de vidas</h3>
+
+<p>Tienes que añadir una llamada a <code>drawLives()</code> dentro de <code>draw()</code> debajo de la llamada a <code>drawScore():</code></p>
+
+<pre class="brush: js">drawLives();
+</pre>
+
+<h2 id="Mejorar_el_refresco_con_requestAnimationFrame()">Mejorar el refresco con requestAnimationFrame()</h2>
+
+<p>Ahora vamos a ocuparnos de algo que no es particular de este juego, sino de la forma en la que se muestran las imágenes en pantalla.</p>
+
+<p>{{domxref("window.requestAnimationFrame", "requestAnimationFrame")}} ayuda al navegador a refrescar la imagen mejor que con el método {{domxref("windowTimers.setInterval()", "setInterval()")}} que estamos utilizando. Cambia la línea siguiente...</p>
+
+<pre class="brush: js">setInterval(draw, 10);</pre>
+
+<p>...por esta otra:</p>
+
+<pre class="brush: js">draw();</pre>
+
+<p>Y, ahora, al final de la función draw(), justo antes de la llave que la cierra, añade la línea siguiente, que hará que la función <code>draw()</code> se llame a sí misma una y otra vez:</p>
+
+<pre class="brush: js">requestAnimationFrame(draw);</pre>
+
+<p>Ahora draw() se ejecuta una y otra vez con un bucle <code>requestAnimationFrame()</code> pero, en lugar de hacerlo cada 10 milisegundos, dejamos que sea el navegadro quien decida cada cuánto tiempo. El navegador sincronizará el refresco, es decir, el número de fotogramas por segundo, a lo que sea capaz la máquina que está ejecutando el juego. De este modo la animación será más eficiente y más suave que el viejo método <code>setInterval()</code>.</p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Ya hemos terminado. ¡La versión final del juego está lista para publicar!</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/9temh0ta/","","320")}}</p>
+
+<div class="note">
+<p><strong>Ejercicio</strong>: cambia el número de vidas y el ángulo de la trayectoria de la bola cuando golpea la paleta.</p>
+</div>
+
+<h2 id="Game_over_-_de_momento!">Game over - de momento!</h2>
+
+<p>Enhorabuena, has terminado todas las lecciones. Ya has aprendido las técnicas básicas de manipulación del &lt;canvas&gt; y la lógica que hay detrás de los juegos 2D sencillos.</p>
+
+<p>Ahora sería un buen momento para aprender a utilizar entornos de desarrollo (frameworks) y de continuar con el desarrollo de juegos. Puedes echar un vistazo a estas otra forma de realizar el mismo juego que has visto en <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">2D breakout game using Phaser</a>, o de echar un vistazo al tutorial <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">Cyber Orb built in Phaser</a>. También puedes leer el contenido de <a href="https://developer.mozilla.org/en/docs/Games">Games section on MDN</a> para inspirarte y seguir aprendiendo.</p>
+
+<p>También puedes volve al <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro">índice de este tutorial</a>. ¡Diviértete programando!</p>
+
+<p>{{Previous("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html
new file mode 100644
index 0000000000..6aa0db9751
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html
@@ -0,0 +1,76 @@
+---
+title: Fin del juego
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Game_over
+tags:
+  - Canvas
+  - Fin del juego
+  - JavaScript
+  - Tutorial
+  - graficos
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Game_over
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es-ES/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques")}}</p>
+
+<div class="summary">
+<p>Este es el quinto paso de 10 del <a href="/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>. Puedes ver como debería quedar el código fuente después de completar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson05.html">Gamedev-Canvas-workshop/lesson5.html</a>.</p>
+</div>
+
+<p><span id="result_box" lang="es"><span>Es divertido ver la bola rebotando en las paredes y ser capaz de mover la pala pero, aparte de eso, el juego no hace nada y no tiene ningún progreso ni un objetivo final.</span> <span>Sería bueno desde el punto de vista del juego poder perder.</span> <span>La lógica asociada a perder en este juego es fácil de entender: si se te escapa la bola y alcanza el borde inferior de la pantalla, pierdes y se acabó el juego</span></span><span lang="es"><span>.</span></span></p>
+
+<h2 id="Implementar_el_final_del_juego">Implementar el final del juego</h2>
+
+<p><span id="result_box" lang="es"><span>Intentemos implementar el final del juego en nuestro juego.</span> <span>Aquí está el trozo de código de la tercera lección en donde hicimos que la pelota rebotara en las paredes:</span></span></p>
+
+<pre class="brush: js">if(x + dx &gt; canvas.width-ballRadius || x + dx &lt; ballRadius) {
+    dx = -dx;
+}
+
+if(y + dy &gt; canvas.height-ballRadius || y + dy &lt; ballRadius) {
+    dy = -dy;
+}</pre>
+
+<p><span id="result_box" lang="es"><span>En lugar de dejar que la pelota rebote en las cuatro paredes, vamos a permitir que lo haga sólo en tres: izquierda, arriba y derecha.</span> Alcanzar <span>la pared inferior supondrá el fin del juego.</span> <span>Editaremos el segundo bloque if y lo convertiremos en un "if else" que activará el estado de "final de juego" cuando la pelota colisione con el borde inferior del terreno de juego.</span> <span>Por ahora nos conformaremos con mostrar un mensaje con la función alert() y con reiniciar el juego volviendo a cargar la página. Modifica el segundo if para que quede así</span><span>:</span></span></p>
+
+<pre class="brush: js">if(y + dy &lt; ballRadius) {
+    dy = -dy;
+} else if(y + dy &gt; canvas.height-ballRadius) {
+    alert("GAME OVER");
+    document.location.reload();
+}</pre>
+
+<h2 id="Hacer_que_la_pala_golpee_la_bola">Hacer que la pala golpee la bola</h2>
+
+<p>Para terminar esta lección sólo nos falta detectar la colisión de la bola y la paleta para que pueda rebotar, volviendo hacia la zona de juego. La manera más sencilla de hacerlo es comprobar si el centro de la bola está entre los límites izquierdo y derecho de la paleta. Actualiza el último <span id="result_box" lang="es"><span>fragmento del código, el "if else" de antes, para que te quede así:</span></span></p>
+
+<pre class="brush: js">if(y + dy &lt; ballRadius) {
+    dy = -dy;
+} else if(y + dy &gt; canvas.height-ballRadius) {
+    if(x &gt; paddleX &amp;&amp; x &lt; paddleX + paddleWidth) {
+        dy = -dy;
+    }
+    else {
+        alert("GAME OVER");
+        document.location.reload();
+    }
+}</pre>
+
+<p>Si la bola toca el <span id="result_box" lang="es"><span>borde inferior del lienzo (Canvas) debemos comprobar si golpea la pala.</span> <span>Si es así, entonces rebota como el jugador se imagina que va a ocurrir;</span> si no,<span> el juego ha terminado.</span></span></p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Aquí tienes el código que funciona para que lo compares con el tuyo:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/z4zy79fo/","","320")}}</p>
+
+<div class="note">
+<p><strong>Ejercicio</strong>: haz que la bola se mueva más rápida cuando golpea la pala.</p>
+</div>
+
+<h2 id="Siguientes_pasos">Siguientes pasos</h2>
+
+<p><span id="result_box" lang="es"><span>Lo estamos haciendo bastante bien hasta ahora y nuestro juego está empezando a despertar interés ahora que se puede perder. </span><span>Pero todavía falta algo.</span> <span>Vamos a pasar al sexto capítulo,</span></span> <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques">Construir el muro de ladrillos</a>, <span lang="es"><span>y crear algunos ladrillos para que la bola los destruya.</span></span></p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/index.html
new file mode 100644
index 0000000000..9eba1ed40f
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/index.html
@@ -0,0 +1,53 @@
+---
+title: Famoso juego 2D usando JavaScript puro
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript
+tags:
+  - 2D Canvas JavaScript Tutorial
+  - Principiante Juegos
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es-ES/docs/Games")}}</div>
+
+<p>{{Next("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it")}}</p>
+
+<p class="summary">En este tutorial paso a paso creamos un juego de la MDN, sencillo y muy famoso, escrito íntegramente en JavaScript puro. Todos los elementos gráficos aparecerán dentro de la etiqueta {{htmlelement("canvas")}} de HTML5.</p>
+
+<p>Cada paso tiene ejemplos editables y listos para ejecutar, para que puedas ver qué aspecto debería tener el ejercicio en cada momento. Apenderás a utilizar el elemento {{htmlelement("canvas")}} para implementar mecánicas de juego fundamentales como la representación de imágenes, el movimiento, la detección de colisiones, los mecanismos de control y el final del juego ganando o perdiendo.</p>
+
+<p>Para aprovechar al máximo esta serie de artículos necesitas tener ya un conocimiento básico o intermedio de <a href="/en-US/Learn/Getting_started_with_the_web/JavaScript_basics">JavaScript</a>. Cuando termines este tutorial serás capaz de construir tus propios juegos Web.</p>
+
+<p><img alt="Gameplay screen from the game MDN Breakout where you can use your paddle to bounce the ball and destroy the brick field, with keeping the score and lives." src="https://mdn.mozillademos.org/files/10383/mdn-breakout-gameplay.png" style="display: block; height: 320px; margin: 0px auto; width: 480px;"></p>
+
+<h2 id="Detalle_de_las_lecciones">Detalle de las lecciones</h2>
+
+<p>Todas las lecciones y las diferentes versiones del <a href="http://breakout.enclavegames.com/lesson10.html">famoso juego MDN</a> que estamos construyendo juntos están <a href="https://github.com/end3r/Canvas-gamedev-workshop">disponibles en GitHub</a>:</p>
+
+<ol>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it">Crea el lienzo (canvas) y dibuja en él</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola">Mueve la bola</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls">Rebota en las paredes</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado">Control de la pala y el teclado</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego">Fin del juego</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques">Construye el muro de ladrillos</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones">Detección de colisiones</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win">Cuenta los puntos y gana</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton">Controles del ratón</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando">Finalizando</a></li>
+</ol>
+
+<p>Empezar con JavaScript puro es la mejor forma de adquirir un conocimiento sólido sobre desarrollo de juegos. Después, puedes escoger cualquier entorno de desarrollo (framework) que te guste y usarlo para tus proyectos. Los frameworks son simplemente herramientas construidas con el lenguaje JavaScript; por tanto aunque planees trabajar con ellas, es bueno aprender primero  sobre el mismo lenguaje para saber exactamente qué es lo que hay por debajo. Los frameworks aceleran el tiempo de desarrollo y ayudan a tener en cuenta las partes aburridas del juego, pero si algo no funciona como esperas, siempre puedes intentar depurarlo o simplemente escribir tu solución en JavaScript puro.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si estás interesado en aprender sobre el desarrollo de juegos en 2D usando una entorno de desarrollo, consulta esta serie homóloga, <a href="/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">famoso juego 2D usando Phaser</a>.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>:  Esta serie de artículos puede usarse como material para talleres prácticos de desarrollo de juegos. También puedes hacer uso del <a href="/en-US/docs/">kit de contenido canvas Gamedev</a>  basado en este tutorial si quieres dar una charla sobre desarrollo de juegos en general.</p>
+</div>
+
+<h2 id="Siguientes_pasos">Siguientes pasos</h2>
+
+<p>Vale, ¡vamos a empezar! Dirígete hacia el primer tema — <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it">Crea el lienzo (canvas) y dibuja en él</a>.</p>
+
+<p>{{Next("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it")}} </p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html
new file mode 100644
index 0000000000..d233538b93
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/mouse_controls/index.html
@@ -0,0 +1,54 @@
+---
+title: Controles del ratón
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Mouse_controls
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Mouse_controls
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando")}}</p>
+
+<div class="summary">
+<p>Este es el noveno paso de 10 del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">tutorial Canvas para el desarrollo de juegos</a>. Puedes encontrar el código y pegarle un vistazo después de completar esta lección <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson09.html">Gamedev-Canvas-workshop/lesson9.html</a>.</p>
+</div>
+
+<p>El juego en sí está terminado, así que ahora vamos a pulirlo. Ya le hemos puesto el control del teclado y ahora le añadiremos el control del ratón<span class="seoSummary">.</span></p>
+
+<h2 id="Detectar_el_movimiento_del_ratón">Detectar el movimiento del ratón</h2>
+
+<p>Detectar el movimiento del ratón es más fácil que detectar las pulsaciones de las teclas. Todo lo que necesitamos es un añadir "escuchador" al evento {{event("mousemove")}}.Añade esta línea destrás de los otros "listeners", justo debajo del evento <code>keyup</code>:</p>
+
+<pre class="brush: js">document.addEventListener("mousemove", mouseMoveHandler, false);</pre>
+
+<h2 id="Asociar_el_movimiento_de_la_pala_con_el_movimiento_del_ratón">Asociar el movimiento de la pala con el movimiento del ratón</h2>
+
+<p>Podemos cambiar la posición de la pala basándonos en las coordenadas del puntero del ratón. Eso es lo que hace la función siguiente. Añádela detrás de la línea que acabas de añadir:</p>
+
+<pre class="brush: js">function mouseMoveHandler(e) {
+    var relativeX = e.clientX - canvas.offsetLeft;
+    if(relativeX &gt; 0 &amp;&amp; relativeX &lt; canvas.width) {
+        paddleX = relativeX - paddleWidth/2;
+    }
+}</pre>
+
+<p>En esta función calculamos un valor <code style="font-style: normal; font-weight: normal;">relativeX</code>, que es la posición horizontal del ratón en el "viewport" (<code style="font-style: normal; font-weight: normal;">e.clientX</code>), menos la distancia entre el borde izquierdo del terreno de juego y el borde izquierdo del "viewport" (<code style="font-style: normal; font-weight: normal;">canvas.offsetLeft</code>).</p>
+
+<p>Si el valor resultante es mayor que cero y menor que el ancho del terreno de juego, es que el ratón está dentro de los límites, y calculamos la posición de la paleta poniéndole el valor <code style="font-style: normal; font-weight: normal;">relativeX</code> menos la mitad del ancho de la paleta, para que el movimiento sea de verdad relativo a la mitad de la paleta.</p>
+
+<p>Ahora, la paleta seguirá la posición del cursor del ratón pero, como restringimos el movimiento al &lt;canvas&gt;, no desaparecerá completamente por los lados.</p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Aquí tienes el código para comparar:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/L3gngab5/","","320")}}</p>
+
+<div class="summary">
+<p>Ejercicio: ajusta los límites del movimiento de la pala para que siempre se vea la pala completa (ahora sólo se ve media en los laterales).</p>
+</div>
+
+<h2 id="Pasos_siguientes">Pasos siguientes</h2>
+
+<p>Ya tenemos el juego terminado, pero aún lo podemos mejorar con algunos trucos <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando">Finalizando</a>.</p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html
new file mode 100644
index 0000000000..d4b80386e7
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html
@@ -0,0 +1,155 @@
+---
+title: Mueve la bola
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Move_the_ball
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Move_the_ball
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es-ES/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls")}}</p>
+
+<div class="summary">
+<p>Este es el segundo paso de los 10 del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">tutorial de Canvas para el desarrollo de juegos</a>. Puedes encontrar el código fuente como debería quedar después de completar la lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson02.html">Gamedev-Canvas-workshop/lesson2.html</a>.</p>
+</div>
+
+<p><span id="result_box" lang="es"><span>Ya sabes cómo dibujar una pelota, lo has aprendido en el artículo anterior. Ahora vamos a hacer que se mueva.</span> <span>Técnicamente, estaremos pintando la pelota en la pantalla, borrándola y luego pintándola de nuevo en una posición ligeramente diferente cada fotograma para dar la impresión de movimiento, igual que se hace en las películas.</span></span></p>
+
+<p> </p>
+
+<h2 id="Definir_un_bucle_de_dibujo">Definir un bucle de dibujo</h2>
+
+<p> </p>
+
+<p><span id="result_box" lang="es"><span>Para actualizar el dibujo del lienzo en cada fotograma, necesitamos definir una función de dibujo que se ejecutará una y otra vez, cambiando una serie de variables para modificar la posición de cada personaje (sprite). Para que una misma función se ejecute una y otra vez puedes utilizar una función </span><span>de sincronización de JavaScript, como</span></span> {{domxref("WindowTimers.setInterval()", "setInterval()")}} or {{domxref("window.requestAnimationFrame()", "requestAnimationFrame()")}}.</p>
+
+<p><span id="result_box" lang="es"><span>Elimina todo el código JavaScript que tienes ahora mismo en de tu archivo HTML, excepto las dos primeras líneas, y añade lo siguiente debajo de ellas.</span> <span>La función draw() se ejecutará dentro de setInterval cada 10 milisegundos:</span></span></p>
+
+<pre class="brush: js">function draw() {
+    // código para dibujar
+}
+setInterval(draw, 10);</pre>
+
+<p><span id="result_box" lang="es"><span>Gracias a la naturaleza infinita de setInterval, la función draw () se llamará cada 10 milisegundos por siempre, o hasta que lo detengamos.</span> <span>Ahora, vamos a dibujar la bola. A</span></span><span lang="es"><span>grega lo siguiente dentro de tu función draw ():</span></span></p>
+
+<pre class="brush: js">ctx.beginPath();
+ctx.arc(50, 50, 10, 0, Math.PI*2);
+ctx.fillStyle = "#0095DD";
+ctx.fill();
+ctx.closePath();
+</pre>
+
+<p>Prueba tu código actualizado ahora — la bola debería repintarse en cada fotograma (frame).</p>
+
+<h2 id="Hacer_que_se_mueva">Hacer que se mueva</h2>
+
+<div id="gt-res-content">
+<div class="trans-verified-button-small" dir="ltr">Aunque la bola se está dibujando cada 10 milisegundos no se nota porque no hay movimiento, se dibuja una y otra vez en el mismo sitio.<span id="result_box" lang="es"><span>Vamos a cambiar eso.</span> <span>En primer lugar, en lugar de dibujar siempre en la posición (50, 50) definiremos un punto de inicio en la parte central inferior del lienzo en las variables llamadas x e y, a continuación, las utilizaremos para definir la posición en la que se dibuja el círculo.</span><br>
+<br>
+<span>Primero, agrega las dos líneas siguientes a la función draw (), para definir x e y:</span></span></div>
+</div>
+
+<p> </p>
+
+<pre class="brush: js">var x = canvas.width/2;
+var y = canvas.height-30;
+</pre>
+
+<p> </p>
+
+<p>A continuación actualiza la función <code>draw()</code> para usar las variables x e y en el método {{domxref("CanvasRenderingContext2D.arc()","arc()")}}, como se muestra en la siguiente línea resaltada:</p>
+
+<pre class="brush: js; highlight:[3]">function draw() {
+    ctx.beginPath();
+    ctx.arc(x, y, 10, 0, Math.PI*2);
+    ctx.fillStyle = "#0095DD";
+    ctx.fill();
+    ctx.closePath();
+}
+</pre>
+
+<p><span id="result_box" lang="es"><span>Ahora viene la parte importante: queremos añadir un valor pequeño a x e y después de que cada fotograma se haya dibujado para que parezca que la pelota se está moviendo.</span> <span>Definamos estos valores pequeños como dx y dy, y establezcamos sus valores en 2 y -2 respectivamente.</span> <span>Agrega lo siguiente debajo de sus definiciones de variables x e y:</span></span></p>
+
+<pre class="brush: js">var dx = 2;
+var dy = -2;
+</pre>
+
+<p><span id="result_box" lang="es"><span>Lo último que hay que hacer es actualizar x e y con nuestras variables dx y dy en cada fotograma, de modo que la bola será pintada en la nueva posición en cada actualización.</span> <span>Agrega las dos nuevas líneas</span></span><span lang="es"><span> siguientes indicadas a continuación a la función draw ():</span></span></p>
+
+<pre class="brush: js; highlight:[7,8]">function draw() {
+    ctx.beginPath();
+    ctx.arc(x, y, 10, 0, Math.PI*2);
+    ctx.fillStyle = "#0095DD";
+    ctx.fill();
+    ctx.closePath();
+    x += dx;
+    y += dy;
+}</pre>
+
+<p><span id="result_box" lang="es"><span>Guarda el código de nuevo y pruébalo en tu navegador.</span> <span>Esto funciona bien, aunque parece que la bola está dejando un rastro detrás de ella:</span></span></p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10430/ball-trail.png" style="display: block; height: 320px; margin: 0px auto; width: 480px;"></p>
+
+<h2 id="Borrar_el_lienzo_antes_de_cada_fotograma">Borrar el  lienzo antes de cada fotograma</h2>
+
+<div id="gt-res-content">
+<div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr"><span id="result_box" lang="es"><span>La bola está dejando un rastro porque estamos pintando un nuevo círculo en cada fotograma sin borrar el anterior.</span> <span>No te preocupes, porque hay un método para borrar todo el contenido de lienzo: {{domxref ("CanvasRenderingContext2D.clearRect ()", "clearRect ()")}}.</span> <span>Este método tiene cuatro parámetros: las coordenadas x e y de la esquina superior izquierda de un rectángulo y las coordenadas x e y de la esquina inferior derecha de un rectángulo.</span> En todo el área definida por ese rectángulo se borrará cualquier cosa que se haya pintado antes<span>.</span></span></div>
+</div>
+
+<div id="gt-res-tools">
+<div id="gt-res-tools-l">
+<div id="gt-pb-star"> </div>
+</div>
+</div>
+
+<p>Añade la siguiente nueva línea resaltada a la función draw():</p>
+
+<pre class="brush: js; highlight:[2]">function draw() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    ctx.beginPath();
+    ctx.arc(x, y, 10, 0, Math.PI*2);
+    ctx.fillStyle = "#0095DD";
+    ctx.fill();
+    ctx.closePath();
+    x += dx;
+    y += dy;
+}
+</pre>
+
+<p><span id="result_box" lang="es"><span>Guarda tu código y vuelve a probarlo. Esta vez verás el movimiento de la bola sin dejar rastro.</span> <span>Cada 10 milisegundos se borra todo el lienzo, se dibuja el círculo azul (nuestra pelota) en una posición determinada y los valores x e y se actualizan para el siguiente fotograma.</span></span></p>
+
+<h2 id="Limpiar_el_código">Limpiar el código</h2>
+
+<p><span id="result_box" lang="es"><span>Vamos a añadir más y más comandos a la función draw () en los próximos artículos, por lo que es bueno mantenerlo lo más simple y limpio posible.</span> <span>Comencemos moviendo el código de dibujo de la bola a una función separada.</span><br>
+ <br>
+ <span>Reemplaza la función draw() con las dos funciones siguientes:</span></span></p>
+
+<pre class="brush: js">function drawBall() {
+    ctx.beginPath();
+    ctx.arc(x, y, 10, 0, Math.PI*2);
+    ctx.fillStyle = "#0095DD";
+    ctx.fill();
+    ctx.closePath();
+}
+
+function draw() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    drawBall();
+    x += dx;
+    y += dy;
+}</pre>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p><span id="result_box" lang="es"><span>Puedes comprobar el código terminado de este artículo en la demostración en vivo a continuación, y jugar con ella para entender mejor cómo funciona:</span></span></p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/3x5foxb1/","","415")}}</p>
+
+<div class="summary">
+<p>Ejercicio: intenta cambiar la velocidad de la bola en movimiento o la dirección hacia la que se mueve.</p>
+</div>
+
+<h2 id="Siguientes_pasos">Siguientes pasos</h2>
+
+<p>Hemos dibujado nuestra bola y hemos hecho que se mueva, pero cuando supera el borde del canvas, desaparece. En el tercer capítulo exploraremos como hacer que <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls">rebote en las paredes</a>.</p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html
new file mode 100644
index 0000000000..18def1565a
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/paddle_and_keyboard_controls/index.html
@@ -0,0 +1,131 @@
+---
+title: Control de la pala y el teclado
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego")}}</p>
+
+<div class="summary">
+<p>Este es el cuarto de los 10 pasos del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Tutorial de Canvas para el desarrollo de juegos</a>. Puedes encontrar el código fuente como debería quedar después de completar la lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson04.html">Gamedev-Canvas-workshop/lesson4.html</a>.</p>
+</div>
+
+<p> </p>
+
+<p><span class="seoSummary">La bola está rebotando en las paredes libremente y puedes estar mirándola toda la vida, pero, ahora mismo, no hay interactividad. ¡No es un juego si no puedes controlarlo! Vamos a añadirle la interacción del usuario: una paleta.</span></p>
+
+<h2 id="Definir_una_paleta_para_golpear_la_bola">Definir una paleta para golpear la bola</h2>
+
+<p>Necesitamos una paleta para golpear la bola. Empezamos por definir variables para conseguirlo. Añade las variables siguientes en la parte de arriba de tu código, junto a las que ya tenías:</p>
+
+<pre class="brush: js">var paddleHeight = 10;
+var paddleWidth = 75;
+var paddleX = (canvas.width-paddleWidth)/2;</pre>
+
+<p>paddleHeight servirá para definir la altura de la paleta, paddleWidth la anchura y paddleX la posición en el eje X en la que empieza a dibujarse. Definimos una función que dibujará la paleta en la pantalla. Añade este código justo después de la función <code>drawBall()</code>:</p>
+
+<pre class="brush: js">function drawPaddle() {
+    ctx.beginPath();
+    ctx.rect(paddleX, canvas.height-paddleHeight, paddleWidth, paddleHeight);
+    ctx.fillStyle = "#0095DD";
+    ctx.fill();
+    ctx.closePath();
+}</pre>
+
+<h2 id="Permitir_que_el_usuario_controle_la_paleta">Permitir que el usuario controle la paleta</h2>
+
+<p>Podemos dibujar la paleta donde queramos, pero debería responder a las acciones del usuario. Ha llegado la hora de implementar algunos controles de teclado. Vamos a necesitar:</p>
+
+<ul>
+ <li>Dos variables para guardar la información sobre si se ha pulsado el botón izquierdo o el derecho.</li>
+ <li>Dos funciones (event listeners) que respondan a los eventos <code>keydown</code> y <code>keyup</code> (pulsar tecla, liberar tecla). Queremos que se ejecute algún código para manejar la paleta cuando se pulsen los botones.</li>
+ <li>Dos funciones que manejen los eventos <code>keydown</code> y <code>keyup</code> que se ejecutarán cuando se pulsen los botones.</li>
+ <li>La habilidad de mover la paleta a la izquierda y a la derecha</li>
+</ul>
+
+<p>Empezaremos por definir las variables que nos dirán si se ha pulsado un botón. Añade estas líneas donde has definido las demás variables:</p>
+
+<pre class="brush: js">var rightPressed = false;
+var leftPressed = false;</pre>
+
+<p>Las dos las inicializamos con el valor <code>false</code> porque al principio no están pulsados los botones. Para "escuchar" las pulsaciones de las teclas necesitamos definir dos "escuchadores de eventos" (event listeners). Añade las líneas siguientes justo antes de <code>setInterval()</code> al final de tu código:</p>
+
+<pre class="brush: js">document.addEventListener("keydown", keyDownHandler, false);
+document.addEventListener("keyup", keyUpHandler, false);</pre>
+
+<p>Cuando ocurra el evento <code>keydown</code> al pulsar cualquier tecla del teclado, la función <code>keyDownHandler()</code> se ejecutará. Cuando se liberará la tecla pulsada, se ejecutará la función <code>keyUpHandler()</code>. Añade esto después de las líneas del <code>addEventListener()</code> que acababas de escribir:</p>
+
+<pre class="brush: js">function keyDownHandler(e) {
+    if(e.keyCode == 39) {
+        rightPressed = true;
+    }
+    else if(e.keyCode == 37) {
+        leftPressed = true;
+    }
+}
+
+function keyUpHandler(e) {
+    if(e.keyCode == 39) {
+        rightPressed = false;
+    }
+    else if(e.keyCode == 37) {
+        leftPressed = false;
+    }
+}</pre>
+
+<p>Cuando pulsamos una tecla se ejecuta keyDownHandler(e), que pone en la variable "e" los datos que necesitamos. Efectivamente, e.keyCode nos va a decir qué tecla se ha pulsado. Si vale 37 es porque se ha pulsado la "flecha izquierda" del teclado. El código 39 representa a la "flecha derecha".</p>
+
+<p>Pues bien, cuando se pulsará la "flecha izquierda" pondremos leftPressed a true.</p>
+
+<p>Cuando se liberará la "flecha izquierda" pondremos leftPressed a false.</p>
+
+<p>De igual forma procederá el programa con la "flecha derecha", detectando el código 39 y dando los valores oportunos a la variable rightPressed.</p>
+
+<h3 id="La_lógica_del_movimiento_de_la_paleta">La lógica del movimiento de la paleta</h3>
+
+<p>Ya tenemos las variables que contienen la información sobre las teclas pulsadas, los escuchadores de eventos y las funciones relevantes. Ahora vamos a ocuparnos del código que utilizará todo eso y moverá la paleta en la pantalla. Dentro de la función <code>draw()</code> comprobaremos si está pulsada la flecha izquierda o la derecha cada vez que se dibuje un fotograma. Nuestro código podría tener este aspecto:</p>
+
+<pre class="brush: js">if(rightPressed) {
+    paddleX += 7;
+}
+else if(leftPressed) {
+    paddleX -= 7;
+}</pre>
+
+<p>Si se pulsa la flecha izquierda, la paleta se moverá 7 píxeles a la izquierda. Si se pulsa la flecha derecha, se moverá 7 píxeles a la derecha. Aunque esto funciona bien, la paleta desaparece en los laterales del terreno de juego si mantenemos pulsada una tecla demasiado tiempo. Podemos mejorar esto para que se mueva dentro de los límites del canvas, cambiando el código así:</p>
+
+<pre class="brush: js">if(rightPressed &amp;&amp; paddleX &lt; canvas.width-paddleWidth) {
+    paddleX += 7;
+}
+else if(leftPressed &amp;&amp; paddleX &gt; 0) {
+    paddleX -= 7;
+}</pre>
+
+<p>La posición paddleX que estamos utilizando variará entre 0 para la lado izquierdo y <code style="font-style: normal; font-weight: normal;">canvas.width-paddleWidth</code> para el lado derecho, que es justo lo que queremos.</p>
+
+<p>Añade el código anterior dentro de la función <code>draw(), al final</code>, justo antes de la llave que cierra.</p>
+
+<p>Lo único que nos falta por hacer es llamar a la función <code>drawPaddle()</code> desde dentro de la función <code>draw()</code> para que dibuje la paleta dentro en la pantalla. Añade la línea siguiente dentro de <code>draw(), justo antes de la línea que llama a la función</code> <code>drawBall()</code>:</p>
+
+<pre class="brush: js">drawPaddle();
+</pre>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Aquí está el código que funciona, para que lo compares con el tuyo:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/tgn3zscj/","","320")}}</p>
+
+<div class="note">
+<p><strong>Ejercicio</strong>: haz que la paleta se mueva más deprisa o más despacio, o cambia su tamaño.</p>
+</div>
+
+<h2 id="Pasos_siguientes">Pasos siguientes</h2>
+
+<p>Ahora mismo tenemos algo que parece un juego. El único problema es que todo lo que puedes hacer es golpear la bola con la paleta toda la vida (en realidad, ni siquiera la golpeas). Todo esto cambiará en el quinto capítulo, <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego">Fin del juego</a>, cuando añadiremos un estado de "Game Over".</p>
+
+<div> </div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego")}}</p>
diff --git a/files/es/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html b/files/es/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html
new file mode 100644
index 0000000000..3b921fc5c2
--- /dev/null
+++ b/files/es/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html
@@ -0,0 +1,93 @@
+---
+title: Poner un contador y terminar ganando
+slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win
+translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win
+original_slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win
+---
+<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
+
+<div class="summary">
+<p>Este es el octavo capítulo de 10, del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>. Puedes encontrar el código fuente como debería quedar tras este capítulo en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson08.html">Gamedev-Canvas-workshop/lesson8.html</a>.</p>
+</div>
+
+<p><span class="seoSummary">Destruir los ladrillos mola, pero para que el juego sea aún mejor, podría dar puntos cada vez que el jugador rompe un ladrillo, y mostrar un contador.</span></p>
+
+<h2 id="El_contador">El contador</h2>
+
+<p>Si puedes ver el contador mientras juegas, puede que consigas impresionar a tus amigos. Necesitas una variable para guardar el contador. Añade esto a tu JavaScript, después de las otras definiciones de variables:</p>
+
+<pre class="brush: js">var score = 0;</pre>
+
+<p>También necesitas una función <code>drawScore()</code> para enseñar el contador por pantalla. Añade esto después de la función <code>collisionDetection()</code>:</p>
+
+<pre class="brush: js">function drawScore() {
+    ctx.font = "16px Arial";
+    ctx.fillStyle = "#0095DD";
+    ctx.fillText("Score: "+score, 8, 20);
+}</pre>
+
+<p>Dibujar texto en el &lt;canvas&gt; es similar a dibujar un círculo o cualquier otra figura. La definición del tipo de letra (fuente) se hace igual que en CSS, puedes fijar el tamaño y fuente con el método {{domxref("CanvasRenderingContext2D.font","font()")}} method. Despúes utilizas {{domxref("CanvasRenderingContext2D.fillStyle()","fillStyle()")}} para fijar el color y {{domxref("CanvasRenderingContext2D.fillText","fillText()")}} para escribir el texto y el lugar en el que se va a dibujar. El primer parámetro es el texto en si y los otros dos son las coordenadas.</p>
+
+<p>Para sumar un punto cada vez que se rompe un ladrillo, añade la línea que está marcada aquí debajo:</p>
+
+<pre class="brush: js; highlight:[9]">function collisionDetection() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            var b = bricks[c][r];
+            if(b.status == 1) {
+                if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
+                    dy = -dy;
+                    b.status = 0;
+                    score++;
+                }
+            }
+        }
+    }
+}</pre>
+
+<p>Llamando a <code>drawScore()</code> (dibujar contador) desde la función <code>draw()</code> hace que se muestre el contador actualizado en la pantalla. Añade la línea siguiente en <code>draw()</code>, justo debajo de la llamada a <code>drawPaddle()</code>:</p>
+
+<pre class="brush: js">drawScore();</pre>
+
+<h2 id="Mostrar_un_mensaje_de_victoria_cuando_se_hayan_destruido_todos_los_ladrillos">Mostrar un mensaje de victoria cuando se hayan destruido todos los ladrillos</h2>
+
+<p>Lo de sumar puntos funciona, pero tiene un final. ¿Qué ocurrirá cuando no queden ladrillos? Precisamente ese es el principal objetivo del juego, tendrás que dibujar un mensaje de victoria. Añade las líneas marcadas a tu función <code>collisionDetection()</code>:</p>
+
+<pre class="brush: js; highlight:[10,11,12,13]">function collisionDetection() {
+    for(c=0; c&lt;brickColumnCount; c++) {
+        for(r=0; r&lt;brickRowCount; r++) {
+            var b = bricks[c][r];
+            if(b.status == 1) {
+                if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
+                    dy = -dy;
+                    b.status = 0;
+                    score++;
+                    if(score == brickRowCount*brickColumnCount) {
+                        alert("YOU WIN, CONGRATULATIONS!");
+                        document.location.reload();
+                    }
+                }
+            }
+        }
+    }
+}</pre>
+
+<p>Gracias a esto, los jugadores pueden ganar cuando rompen todos los ladrillos, que es muy importante. La función <code>document.location.reload()</code> vuelve a cargar la página y el juego empieza de nuevo, una vez se hace clic sobre el botón del alert().</p>
+
+<h2 id="Compara_tu_código">Compara tu código</h2>
+
+<p>Puedes comparar tu código con este:</p>
+
+<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/mvfkcydz/","","320")}}</p>
+
+<div class="note">
+<p><strong>Ejercicio</strong>: añade más puntos por ladrillo y muestra el contador cuando salga el alert() del final del juego con victoria.</p>
+</div>
+
+<h2 id="Pasos_siguientes">Pasos siguientes</h2>
+
+<p>El juego, ahora mismo, ya tiene buena pinta. En la siguiente lección conseguirás que sea más atractivo porque añadirás el <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton">Control del ratón</a>.</p>
+
+<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
diff --git a/files/es/games/tutorials/html5_gamedev_phaser_device_orientation/index.html b/files/es/games/tutorials/html5_gamedev_phaser_device_orientation/index.html
new file mode 100644
index 0000000000..26b3eb46f1
--- /dev/null
+++ b/files/es/games/tutorials/html5_gamedev_phaser_device_orientation/index.html
@@ -0,0 +1,438 @@
+---
+title: >-
+  Introducción al Desarrollo de Juegos en HTML5 con Phaser y la API de
+  Orientación a Dispositivos
+slug: Games/Tutorials/HTML5_Gamedev_Phaser_Device_Orientation
+tags:
+  - API Vibración
+  - API orientacion de dispositivos
+  - Canvas
+  - Desarrollo de videojuegos
+  - HTML5
+  - Phaser
+translation_of: Games/Tutorials/HTML5_Gamedev_Phaser_Device_Orientation
+original_slug: Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation
+---
+<div>{{GamesSidebar}}</div><p>{{ draft() }}</p>
+
+<h2 id="Introducción">Introducción</h2>
+
+<p><span style="line-height: 1.5;">En este tutorial iremos a través del proceso de construcción de un juego en HTML5 para móviles que utilizará las <em>APIs</em> de <a href="https://developer.mozilla.org/en-US/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Orientación para Dispositivos</a> y <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/Vibration">Vibración</a> para mejorar la jugabilidad y estará construido utilizando el <em>framework</em> <a href="http://phaser.io/">Phaser</a>. Se recomienda tener conocimientos básicos de JavaScript para sacar mayor provecho a este tutorial.</span></p>
+
+<h2 id="Ejemplo"><span style="line-height: 1.5;">Ejemplo</span></h2>
+
+<p><span style="line-height: 1.5;">Al finalizar este tutorial tendrás un juego <em>demo</em> completamente funcional: <a href="http://orb.enclavegames.com/">Cyber Orb</a>. Se verá más o menos así:</span></p>
+
+<p><span style="line-height: 1.5;"><img alt="" src="https://mdn.mozillademos.org/files/10297/cyber-orb.png" style="display: block; height: 450px; margin: 0px auto; width: 300px;"></span></p>
+
+<h2 id="Phaser_framework">Phaser framework</h2>
+
+<p><a href="http://phaser.io/">Phaser</a> es un <em>framework</em> para construir juegos, de móvil o escritorio, en HTML5 . Es nuevo pero está creciendo velozmente gracias a la apasionada comunidad involucrada en el proceso de desarrollo. Puedes chequearlo <a href="https://github.com/photonstorm/phaser">en GitHub</a> donde se encuentra como <em>open source. </em>Lee <a href="http://docs.phaser.io/">la documentación</a> en línea y recorre su gran colección de <a href="http://examples.phaser.io/">ejemplos</a>. El <em>framework</em> Phaser provee una serie de herramientas que acelerarán el desarrollo y te ayudaran a manejar las tareas genéricas necesarias para completar tu juego, para que así puedas concentrarte en la idea del juego en sí.</p>
+
+<h2 id="Empezando_con_el_proyecto">Empezando con el proyecto</h2>
+
+<p>Puedes ver <a href="https://github.com/EnclaveGames/Cyber-Orb">el código fuente de Cyber Orb</a> en GitHub. <span style="line-height: 1.5;">La estructura de carpetas no es nada complicada: </span><span style="line-height: 1.5;">el punto de partida es el archivo </span><code>index.html</code><span style="line-height: 1.5;"> donde inicializaremos el <em>framework</em> y </span><span style="line-height: 1.5;">configuraremos el canvas donde correrá el juego.</span></p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10357/cyber-orb-github.png" style="display: block; height: 423px; width: 620px;"></p>
+
+<p><span style="line-height: 1.5;">Puedes hacer clic en el archivo index desde tu navegador favorito para iniciar el juego y probarlo. </span><span style="line-height: 1.5;">También hay tres carpetas en el directorio: </span></p>
+
+<ul>
+ <li><span style="line-height: 1.5;"><code>img</code></span>: Todas las imágenes que usaremos en el juego.</li>
+ <li><span style="line-height: 1.5;"><code>src</code></span>: Los archivos JavaScript que contienen todo el código fuente del juego definido dentro.</li>
+ <li><span style="line-height: 1.5;"><code>audio</code>:</span> Los archivos de sonido usados en el juego.</li>
+</ul>
+
+<h2 id="Configurando_el_canvas">Configurando el canvas</h2>
+
+<p>Vamos a renderizar nuestro juego sobre el elemento <code>&lt;canvas&gt;</code>, pero no lo haremos manualmente  — de esto se ocupará el <em>framework. </em> Vamos a configurarlo: nuestro punto de partida es el archivo <code>index.html</code> con el siguiente contenido. Puedes crearlo tú mismo si quieres hacer un seguimiento más detallado:</p>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+    &lt;meta charset="utf-8" /&gt;
+    &lt;title&gt;Cyber Orb&lt;/title&gt;
+    &lt;style&gt; body { margin: 0; background: #333; } &lt;/style&gt;
+    &lt;script src="src/phaser.min.js"&gt;&lt;/script&gt;
+    &lt;script src="src/Boot.js"&gt;&lt;/script&gt;
+    &lt;script src="src/Preloader.js"&gt;&lt;/script&gt;
+    &lt;script src="src/MainMenu.js"&gt;&lt;/script&gt;
+    &lt;script src="src/Game.js"&gt;&lt;/script&gt;
+&lt;/head&gt;
+&lt;body&gt;
+&lt;script&gt;
+(function() {
+    var game = new Phaser.Game(320, 480, Phaser.CANVAS, 'game');
+    game.state.add('Boot', Ball.Boot);
+    game.state.add('Preloader', Ball.Preloader);
+    game.state.add('MainMenu', Ball.MainMenu);
+    game.state.add('Game', Ball.Game);
+    game.state.start('Boot');
+})();
+&lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p><span style="line-height: 1.5;">Hasta ahora tenemos una simple página web </span><code>HTML</code><span style="line-height: 1.5;"> con el contenido básico en la sección </span><code>&lt;head&gt;</code><span style="line-height: 1.5;">: configuración de caracteres, título, estilo y las inclusión de los archivos JavaScripts. El </span><code>&lt;body&gt;</code><span style="line-height: 1.5;"> contiene la inicialización del framework Phaser y las definiciones del estado del juego.</span></p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> game <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Phaser<span class="punctuation token">.</span>Game</span><span class="punctuation token">(</span><span class="number token">320</span><span class="punctuation token">,</span> <span class="number token">480</span><span class="punctuation token">,</span> Phaser<span class="punctuation token">.</span>CANVAS<span class="punctuation token">,</span> <span class="string token">'game'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>La linea de arriba inicializará la intancia de Phaser — los argumentos son el ancho del <code>&lt;canvas&gt;</code>, su altura, el método de renderizado (estamos utilizando <code>CANVAS</code> pero también existen disponibles las opciones <code>WEBGL</code> y <code>AUTO</code>) y el ID opcional del contenedor DOM en el que queremos poner el <code>&lt;canvas&gt;</code>. Si no hay nada especificado en el último argumento o el elemento no es encontrado, el <code>&lt;canvas&gt;</code> será añadido a la etiqueta <code>&lt;body&gt;</code>. Sin el <em>framework </em>para añadir el elemento canvas hubieses tenido que escribir algo como esto dentro de la etiqueta <code>&lt;body&gt;</code>:</p>
+
+<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>canvas</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">'</span>game<span class="punctuation token">'</span></span> <span class="attr-name token">width</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">'</span>320<span class="punctuation token">'</span></span> <span class="attr-name token">height</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">'</span>480<span class="punctuation token">'</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>canvas</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p>Es importante recordar que el <em>framework</em> está montando métodos útiles para acelerar un montón de cosas como la manipulación de imagenes o la administración de elementos, que serían más difíciles si tuvieramos que hacerlo manualmente.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes leer este artículo: "<a href="http://gamedevelopment.tutsplus.com/tutorials/getting-started-with-phaser-building-monster-wants-candy--cms-21723">Building Monster Wants Candy</a>" para una introducción en profundidad a las funciones y métodos específicos de Phaser.</p>
+</div>
+
+<p>Volviendo a los estados del juego: La linea de abajo añade un nuevo estado al juego llamado <code>Boot</code>:</p>
+
+<pre class="brush: js"><code class="language-html">game.state.add('Boot', Ball.Boot);</code></pre>
+
+<p>El primer valor es el nombre del estado, el segundo es el objeto al que queremos asignárselo. El metodo <code>start</code> está iniciando el estado dado y haciendolo activo. Veamos qué es lo que son los estados realmente.</p>
+
+<pre class="brush: html"> </pre>
+
+<h2 id="Gestionando_los_estados_de_juego">Gestionando los estados de juego</h2>
+
+<p>Los estados en Phaser son partes separadas de la lógica del juego, en nuestro caso los estamos cargando de archivos JavaScript independientes para un mejor mantenimiento. En este juego tenemos estados básicos: <code>Boot</code>, <code>Preloader</code>, <code>MainMenu</code>, <code>Howto</code> y <code>Game</code>. <code>Boot</code> se hará cargo de la inicialización de algunas opciones de configuración, <code>Preloader</code> cargará todos los elementos utilizados como los gráficos y el audio, <code>MainMenu</code> es el menu con el botón de inicio, <code>Howto</code> muestra las intrucciones de cómo jugar y el estado <code>Game</code> es el que finalmente te permite jugar el juego. Veamos rapidamente el contenido de esos estados.</p>
+
+<h3 id="Boot.js">Boot.js</h3>
+
+<p>El estado <code>Boot</code> es el primero en el juego.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> Ball <span class="operator token">=</span> <span class="punctuation token">{</span>
+    _WIDTH<span class="punctuation token">:</span> <span class="number token">320</span><span class="punctuation token">,</span>
+    _HEIGHT<span class="punctuation token">:</span> <span class="number token">480</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span>
+Ball<span class="punctuation token">.</span>Boot <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+Ball<span class="punctuation token">.</span>Boot<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
+    preload<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">image</span><span class="punctuation token">(</span><span class="string token">'preloaderBg'</span><span class="punctuation token">,</span> <span class="string token">'img/loading-bg.png'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">image</span><span class="punctuation token">(</span><span class="string token">'preloaderBar'</span><span class="punctuation token">,</span> <span class="string token">'img/loading-bar.png'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span><span class="punctuation token">,</span>
+    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>scale<span class="punctuation token">.</span>scaleMode <span class="operator token">=</span> Phaser<span class="punctuation token">.</span>ScaleManager<span class="punctuation token">.</span>SHOW_ALL<span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>scale<span class="punctuation token">.</span>pageAlignHorizontally <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>scale<span class="punctuation token">.</span>pageAlignVertically <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'Preloader'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
+
+<p>El objeto principal <code>Ball</code> es definido y estamos añadiendo dos variables llamadas <code>_WIDTH</code> y <code>_HEIGHT</code> esos seran el ancho y la altura del canvas de nuestro juego, respectivamente — nos ayudarán a posicionar los elementos en la pantalla. Estamos cargando dos imagenes primero que serán usadas después en el estado <code>Preload</code> para mostrar el progreso de la carga de los demás elementos. La función <code>create</code> contiene algunas de las configuraciones básicas: estamos configurando la escala y la alineación del canvas, y avanzando al estado <code>Preload</code> cuando todo este listo.</p>
+
+<h3 id="Preloader.js">Preloader.js</h3>
+
+<p>El estado <code>Preloader</code> se ocupa de cargar todos los elementos:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">Ball<span class="punctuation token">.</span>Preloader <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+Ball<span class="punctuation token">.</span>Preloader<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
+    preload<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>preloadBg <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span><span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_WIDTH<span class="number token">-297</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_HEIGHT<span class="number token">-145</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="string token">'preloaderBg'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>preloadBar <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span><span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_WIDTH<span class="number token">-158</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_HEIGHT<span class="number token">-50</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="string token">'preloaderBar'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">setPreloadSprite</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>preloadBar<span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">image</span><span class="punctuation token">(</span><span class="string token">'ball'</span><span class="punctuation token">,</span> <span class="string token">'img/ball.png'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="comment token">// ...</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">spritesheet</span><span class="punctuation token">(</span><span class="string token">'button-start'</span><span class="punctuation token">,</span> <span class="string token">'img/button-start.png'</span><span class="punctuation token">,</span> <span class="number token">146</span><span class="punctuation token">,</span> <span class="number token">51</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="comment token">// ...</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">audio</span><span class="punctuation token">(</span><span class="string token">'audio-bounce'</span><span class="punctuation token">,</span> <span class="punctuation token">[</span><span class="string token">'audio/bounce.ogg'</span><span class="punctuation token">,</span> <span class="string token">'audio/bounce.mp3'</span><span class="punctuation token">,</span> <span class="string token">'audio/bounce.m4a'</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span><span class="punctuation token">,</span>
+    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'MainMenu'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
+
+<p>Para crear un nuevo botón tenemos el método <code>add.button</code> con la siguiente lista de argumentos opcionales:</p>
+
+<ul>
+ <li>Posición absoluta superior del canvas, en pixeles.</li>
+ <li>Posición absoluta izquierda del canvas, en pixeles.</li>
+ <li>Nombre del elemento imagen utilizado por el botón.</li>
+ <li>Función que será ejecutada cuando alguien haga click sobre el botón.</li>
+ <li>El contexto de la ejecución.</li>
+ <li>Cuadro (<em>frame) </em>del elemento imagen utilizado para el estado 'hover' del botón (cuando el mouse se encuentra sobre él).</li>
+ <li>Cuadro (<em>frame)</em> del elemento imagen utilizado para el estado 'normal' o 'out' del botón.</li>
+ <li>Cuadro (<em>frame) </em>del elemento imagen utilizado para el 'click' o 'down' del botón.</li>
+</ul>
+
+<p>El <code>anchor.set</code> colocará el punto de ancla en el botón con el cual se realizarán y aplicarán todos los cálculos de posición para el botón. En nuestro caso, está anclado a la mitad del borde izquierdo y al comienzo del borde superior, para así centrarlo de manera horizontal facilmente, sin necesidad de saber su ancho.</p>
+
+<p>Cuando el boton de inicio es presionado, en lugar de saltar directamente a la acción, el juego mostrará la pantalla con las intrucciones para jugar.</p>
+
+<h3 id="Howto.js">Howto.js</h3>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">Ball<span class="punctuation token">.</span>Howto <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span>
+Ball<span class="punctuation token">.</span>Howto<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
+    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>buttonContinue <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">button</span><span class="punctuation token">(</span><span class="number token">0</span><span class="punctuation token">,</span> <span class="number token">0</span><span class="punctuation token">,</span> <span class="string token">'screen-howtoplay'</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>startGame<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span><span class="punctuation token">,</span>
+    startGame<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'Game'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
+
+<p>El estado <code>Howto</code> muesta las intrucciones de juego en la pantalla antes de comenzar el juego. Luego de clickear la pantalla el juego es lanzado.</p>
+
+<h3 id="Game.js">Game.js</h3>
+
+<p>El estado <code>Game</code> del archivo <code>Game.js</code> es donde ocurre toda la magia. Todas las inicializaciones estan en la función <code>create()</code> (que se lanza una vez al comienzo del juego). Luego de eso, algunas funcionalidades requeriran más código para controlar — escribiremos nuestras propias funciones para manejar tareas más complicadas. En particular, toma nota de la función <code>update()</code> que es ejecutada en cada <em>frame </em>y actualiza cosas como la posición de la pelota.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">Ball<span class="punctuation token">.</span>Game <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+Ball<span class="punctuation token">.</span>Game<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
+    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    initLevels<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    showLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span>level<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    updateCounter<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    managePause<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    manageAudio<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    update<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    wallCollision<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    handleOrientation<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
+    finishLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
+
+<p>Las funciones <code>create</code> y <code>update</code> son específicas del <em>framework</em>, mientras que otras seran nuestras propias creaciones:</p>
+
+<ul>
+ <li><code>initLevels</code> inicializa los datos del nivel.</li>
+ <li><code>showLevel</code> imprime los datos del nivel en la pantalla.</li>
+ <li><code>updateCounter</code> actualiza el tiempo dedicado a jugar cada nivel y registra el tiempo total dedicado al juego.</li>
+ <li><code>managePause</code> pausa y reanuda el juego.</li>
+ <li><code>manageAudio</code> enciende y apaga el audio.</li>
+ <li><code>wallCollision</code> es ejecutado cuando la pelota golpea las paredes u otros objetos.</li>
+ <li><code>handleOrientation</code> es la función ligada al evento responsable por la API de orientación de dispositivo, proporciona los controles de movimiento cuando el juego es ejecutado en un dispositivo móvil con el hardware apropiado.</li>
+ <li><code>finishLevel</code> carga un nuevo nivel cuando se completa el nivel actual, o termina el juego si se completa el nivel final.</li>
+</ul>
+
+<h4 id="Agregando_la_pelota_y_sus_mecanismos_de_movimiento">Agregando la pelota y sus mecanismos de movimiento</h4>
+
+<p>Primero vamos a ir a la función <code>create()</code>, inicializamos el objeto <code>ball</code> y le asignamos unas cuantas propiedades:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>ball <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>x<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>y<span class="punctuation token">,</span> <span class="string token">'ball'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>anchor<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">(</span><span class="number token">0.5</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span><span class="function token">enable</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> Phaser<span class="punctuation token">.</span>Physics<span class="punctuation token">.</span>ARCADE<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">setSize</span><span class="punctuation token">(</span><span class="number token">18</span><span class="punctuation token">,</span> <span class="number token">18</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>bounce<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">(</span><span class="number token">0.3</span><span class="punctuation token">,</span> <span class="number token">0.3</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Aqui estamos agregando un sprite en un lugar de la pantalla y utilizando la imagen de la pelota de los elementos gráficos ya cargados. También estamos configurando el <code>anchor</code> (ancla) que realizará los cálculos de física para el centro de la pelota, habilitando el motor de físicas Arcade (que manejara todas las físicas para el movimiento de la pelota), y estableciendo el tamaño del cuerpo para la detección de colisiones. La propiedad <code>bounce</code> es utilizada para configurar el 'rebote' de la pelota cuando golpea los obstaculos.</p>
+
+<h4 id="Controlando_la_pelota">Controlando la pelota</h4>
+
+<p>Es genial tener lista la pelota para poder lanzarla en la zona del juego, pero también es importante poder realmente moverla! Ahora vamos a añadir la capacidad de controlar con el teclado la pelota en los dispositivos de escritorio, y luego pasaremos a la implementación de la API de Orientación de Dispositivo. Vamos a enfocarnos en el teclado primero añadiendo lo siguiente a la función <code>create()</code>:</p>
+
+<pre class="brush: js">this.keys = this.game.input.keyboard.createCursorKeys();</pre>
+
+<p>Como puedes ver, hay una función especial de Phaser llamada <code>createCursorKeys()</code> que nos dará un objeto con controladores de evento para las cuatro teclas de flecha, que nos permitira jugar con: arriba, abajo, izquierda y derecha.</p>
+
+<p>A continuación añadiremos el siguiente código a la función <code>update()</code>, para que sea ejecutado en cada <em>frame</em>. El objeto <code>this.keys</code> será chequeado con el input del jugador (las teclas que presione por ejemplo) así la pelota podrá reaccionar acorde, con una fuerza predefinida:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>left<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">-</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+<span class="keyword token">else</span> <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>right<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+<span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>up<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">-</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+<span class="keyword token">else</span> <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>down<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p>De esa manera podemos verificar qué tecla es presionada en determinado <em>frame</em> y aplicar la fuerza definida a la pelota, así aumentar la velocidad en la dirección correcta.</p>
+
+<h4 id="Implementando_la_API_de_Orientación_del_Dispositivo">Implementando la API de Orientación del Dispositivo</h4>
+
+<p>Probablemente la parte más interesante del juego es que utiliza la API de Orientación para Dispositivos móviles. Gracias a esto puedes jugar el juego inclinando el dispositivo en la dirección que quieres que la pelota ruede. Aquí está el código de la función <code>create()</code><em> </em>responsable por esto:</p>
+
+<pre class="brush: js">window.addEventListener("deviceorientation", this.handleOrientation, true);</pre>
+
+<p>Vamos a añadir un detector de eventos al evento "<code>deviceorientation</code>" y vincularlo a la función <code>handleOrientation</code>, se ve como esto:</p>
+
+<pre class="brush: js">handleOrientation: function(e) {
+    var x = e.gamma;
+    var y = e.beta;
+<code class="language-js">    Ball<span class="punctuation token">.</span>_player<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">+</span><span class="operator token">=</span> x<span class="punctuation token">;</span>
+    Ball<span class="punctuation token">.</span>_player<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">+</span><span class="operator token">=</span> y<span class="punctuation token">;</span></code>
+}</pre>
+
+<p><span style="line-height: 1.5;">Mientras más inclines el dispositivo, más fuerza se aplica a la pelota y la velocidad en la que se mueve es mayor.</span></p>
+
+<p><span style="line-height: 1.5;"><img alt="" src="https://mdn.mozillademos.org/files/10369/cyber-orb-flame-orientation.png"></span></p>
+
+<div class="note">
+<p><span style="line-height: 1.5;"><strong>Nota</strong>: Para encontrar más sobre implementar la orientación de los dispositivos y cómo se vé en código crudo, lee </span> <a href="https://developer.mozilla.org/en-US/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Keep it level: responding to device orientation changes</a>.</p>
+</div>
+
+<h4 id="Añadiendo_el_agujero">Añadiendo el agujero</h4>
+
+<p>El principal objetivo del juego es mover la pelota desde la posición inicial a la posición final: un agujero en el suelo. Esta implementación es muy similar a la parte anterior en donde creamos la pelota, y también es añadida en la función <code>create()</code> de nuestro estado <code>Game</code>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>hole <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_WIDTH<span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="number token">90</span><span class="punctuation token">,</span> <span class="string token">'hole'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span><span class="function token">enable</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">,</span> Phaser<span class="punctuation token">.</span>Physics<span class="punctuation token">.</span>ARCADE<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">.</span>anchor<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">(</span><span class="number token">0.5</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">setSize</span><span class="punctuation token">(</span><span class="number token">2</span><span class="punctuation token">,</span> <span class="number token">2</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>La diferencia está en que el cuerpo del agujero se configura como inamovible por lo que no se moverá cuando acertamos con la pelota y tendrá calculada la detección de colisión (esto se tratará más adelante en este artículo).</p>
+
+<h4 id="Construyendo_el_laberinto_de_bloques"><strong>Construyendo el laberinto de bloques</strong></h4>
+
+<p>Para hacer más difícil el juego, y más interesante, añadiremos algunos obstaculos entre la pelota y la sálida. Podríamos usar un editor de niveles pero por motivo de este tutorial, vamos a crear algo nosotros mismos.</p>
+
+<p>Para contener el bloque de información usaremos un <em>array</em> con los datos de nivel: para cada bloque almacenaremos las posiciones abolutas izquierda y superior en pixeles (<strong>x </strong>e <strong>y</strong>) y el tipo de bloque: horizontal o vertical (<code>t</code> con el valor <code>'w'</code> para el ancho, y <code>'h'</code> para la altura). Luego, para cargar el nivel analizaremos los datos y mostraremos los bloques especificos para ese nivel. En la función <code>initLevels</code> tenemos:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>levelData <span class="operator token">=</span> <span class="punctuation token">[</span>
+    <span class="punctuation token">[</span>
+        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">96</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">224</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'w'</span> <span class="punctuation token">}</span>
+    <span class="punctuation token">]</span><span class="punctuation token">,</span>
+    <span class="punctuation token">[</span>
+        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">72</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">320</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'w'</span> <span class="punctuation token">}</span><span class="punctuation token">,</span>
+        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">200</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">320</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'h'</span> <span class="punctuation token">}</span><span class="punctuation token">,</span>
+        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">72</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">150</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'w'</span> <span class="punctuation token">}</span>
+    <span class="punctuation token">]</span><span class="punctuation token">,</span>
+    <span class="comment token">// ...</span>
+<span class="punctuation token">]</span><span class="punctuation token">;</span></code></pre>
+
+<p>Todos los elementos del <em>array</em> contienen una colección de bloques con una posición <code>x</code> e <code>y</code> y un valor <code>t</code> para cada uno. Luego de <code>levelData</code> pero dentro de la función <code>initLevels</code>, añadiremos los bloques dentro de un <em>array</em> en el loop <code>for</code> usando algunos de los métodos específicos del <em>framework</em>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">for</span><span class="punctuation token">(</span><span class="keyword token">var</span> i<span class="operator token">=</span><span class="number token">0</span><span class="punctuation token">;</span> i<span class="operator token">&lt;</span><span class="keyword token">this</span><span class="punctuation token">.</span>maxLevels<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">var</span> newLevel <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">group</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    newLevel<span class="punctuation token">.</span>enableBody <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
+    newLevel<span class="punctuation token">.</span>physicsBodyType <span class="operator token">=</span> Phaser<span class="punctuation token">.</span>Physics<span class="punctuation token">.</span>ARCADE<span class="punctuation token">;</span>
+    <span class="keyword token">for</span><span class="punctuation token">(</span><span class="keyword token">var</span> e<span class="operator token">=</span><span class="number token">0</span><span class="punctuation token">;</span> e<span class="operator token">&lt;</span><span class="keyword token">this</span><span class="punctuation token">.</span>levelData<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">.</span>length<span class="punctuation token">;</span> e<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">var</span> item <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>levelData<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">[</span>e<span class="punctuation token">]</span><span class="punctuation token">;</span>
+        newLevel<span class="punctuation token">.</span><span class="function token">create</span><span class="punctuation token">(</span>item<span class="punctuation token">.</span>x<span class="punctuation token">,</span> item<span class="punctuation token">.</span>y<span class="punctuation token">,</span> <span class="string token">'element-'</span><span class="operator token">+</span>item<span class="punctuation token">.</span>t<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    newLevel<span class="punctuation token">.</span><span class="function token">setAll</span><span class="punctuation token">(</span><span class="string token">'body.immovable'</span><span class="punctuation token">,</span> <span class="keyword token">true</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    newLevel<span class="punctuation token">.</span>visible <span class="operator token">=</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">.</span><span class="function token">push</span><span class="punctuation token">(</span>newLevel<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p>Primero, <code>add.group()</code> es usado para crear un nuevo grupo de items. Luego, el <em>body tipe</em> <code>ARCADE</code> se configura para permitir los cálculos de física. El método <code>newLevel.create</code> crea nuevos items en el grupo con posiciones superior e izquierda iniciales y su propia imagen. Si no quieres recorrer nuevamente la lista de elementos para agregar una propiedad a cada uno explicitamente, puedes usar <code>setAll</code> en un grupo para aplicarlo a todos los items en ese grupo.</p>
+
+<p>Los objetos son almacenados en el <em>array</em> <code>this.levels</code>, el cual es por defecto invisible. Para cargar niveles específicos, nos aseguramos de que los niveles previos esten escondidos, y mostramos el nivel actual:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">showLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span>level<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">var</span> lvl <span class="operator token">=</span> level <span class="operator token">|</span> <span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="punctuation token">;</span>
+    <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span>lvl<span class="number token">-2</span><span class="punctuation token">]</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span>lvl<span class="number token">-2</span><span class="punctuation token">]</span><span class="punctuation token">.</span>visible <span class="operator token">=</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span>lvl<span class="number token">-1</span><span class="punctuation token">]</span><span class="punctuation token">.</span>visible <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p>Gracias a eso el juego da al jugador un reto: ahora tiene que rodar la pelota a través del área de juego y guiarla por el laberinto construido por bloques. Es solo un ejemplo de cargar los niveles, y solo hay 5 puramente para mostrar la idea, pero podés trabajar en expandirlo por tu cuenta.</p>
+
+<h4 id="Detección_de_colisión"><strong>Detección de colisión</strong></h4>
+
+<p>Hasta este punto tenemos la pelota, que puede ser controlada por el jugador, el agujero que se tiene que alcanzar y los obstáculos que bloquean el camino. <span style="line-height: 1.5;">Sin embargo, hay un problema: nuestro juego todavía no tiene ninguna detección de colisiones, así que no sucede nada cuando la pelota golpea los bloques, sólo los atraviesa. Vamos a arreglarlo! La buena noticia es que el <em>framework</em> se ocupará de calcular la detección de colisones, nosotros sólo debemos especificar los objetos con los que colisionará en la función <code>update()</code>:</span></p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span>arcade<span class="punctuation token">.</span><span class="function token">collide</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>borderGroup<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>wallCollision<span class="punctuation token">,</span> <span class="keyword token">null</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span>arcade<span class="punctuation token">.</span><span class="function token">collide</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span><span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="number token">-1</span><span class="punctuation token">]</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>wallCollision<span class="punctuation token">,</span> <span class="keyword token">null</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Esto le dirá al <em>framework</em> que ejecute la función <code>wallCollision</code> cuando la pelota golpee cualquiera de las paredes. Podemos usar la función <code>wallCollision</code> para añadir cualquier funcionalidad que querramos, como por ejemplo agregar el sonido de rebote e implementar la <strong>API de Vibración</strong>.</p>
+
+<p><span style="line-height: 1.5;">También debemos volver al objeto pelota y limitarlo a moverse sólo en la zona visible, para que no salga de la pantalla. Hay una función muy útil en Phaser que se llama </span><code style="font-style: normal; line-height: 1.5;">collideWorldBounds</code><span style="line-height: 1.5;">:</span></p>
+
+<pre class="brush: js">ball.body.collideWorldBounds = true;</pre>
+
+<p>Hace exactamente lo que necesitamos: ahora la pelota rebotará en los bordes de la pantalla como de las paredes.</p>
+
+<h4 id="Añadiendo_el_sonido">Añadiendo el sonido</h4>
+
+<p>Entre los elementos precargados hay una pista de audio (en varios formatos para asegurar la compatibilidad con el navegador), que podremos usar ahora. Debe primero ser definida en la función <code>create()</code>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>bounceSound <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">audio</span><span class="punctuation token">(</span><span class="string token">'audio-bounce'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p><span class="punctuation token">Si el estado del audio es <code>true</code> (es decir que el sonido del juego está activado)</span> podremos reproducirlo en la función <code>wallCollision</code>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>audioStatus<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>bounceSound<span class="punctuation token">.</span><span class="function token">play</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p>Eso es todo: cargar y reproducir sonidos es sencillo con Phaser.</p>
+
+<h4 id="Implementando_la_API_de_Vibración">Implementando la API de Vibración</h4>
+
+<p>Cuando la detección de colisión funcione como es esperado, añadamos algunos efectos especiales con la ayuda de la API de Vibración.<img alt="" src="https://mdn.mozillademos.org/files/10371/cyber-orb-flame-vibration.png"></p>
+
+<p>La mejor forma de usarla en nuestro caso es haciendo que el teléfono vibre cada vez que la pelota golpee las paredes: dentro de la función <code>wallCollision</code>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">if</span><span class="punctuation token">(</span><span class="string token">"vibrate"</span> <span class="keyword token">in</span> window<span class="punctuation token">.</span>navigator<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    window<span class="punctuation token">.</span>navigator<span class="punctuation token">.</span><span class="function token">vibrate</span><span class="punctuation token">(</span><span class="number token">100</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p><span class="punctuation token">Si el método <code>vibrate</code> es soportado por el navegador y está disponible en el objeto <code>window.navigator</code>, hará vibrar al telefono por 100 milisegundos. Eso es todo!</span></p>
+
+<h4 id="Añadiendo_el_tiempo_transcurrido">Añadiendo el tiempo transcurrido</h4>
+
+<p>Para mejorar la re-jugabilidad y dar a los jugadores la opción de competir entre ellos, almacenaremos el tiempo transcurrido: los jugadores entonces intentaran mejorar su tiempo de finalizacion. Para implementar esto en el juego tenemos que crear una variable para almacenar el número actual de segundos transcurrido desde el inicio del juego y mostrarselo al jugador durante el juego. Definamos primero las variables en la función <code>create</code>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>timer <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> <span class="comment token">// time elapsed in the current level</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> <span class="comment token">// time elapsed in the whole game</span></code></pre>
+
+<p>Luego, podemos inicializar los objetos de texto necesarios para mostrar la información al usuario:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>timerText <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">text</span><span class="punctuation token">(</span><span class="number token">15</span><span class="punctuation token">,</span> <span class="number token">15</span><span class="punctuation token">,</span> <span class="string token">"Time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>fontBig<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">this</span><span class="punctuation token">.</span>totalTimeText <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">text</span><span class="punctuation token">(</span><span class="number token">120</span><span class="punctuation token">,</span> <span class="number token">30</span><span class="punctuation token">,</span> <span class="string token">"Total time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>fontSmall<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Estamos definiendo la posición superior e izquierda del texto, el contenido que se muestra y el estilo aplicado al texto. Lo hemos impreso en pantalla, pero sería bueno actualizar los valores cada segundo:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>time<span class="punctuation token">.</span>events<span class="punctuation token">.</span><span class="function token">loop</span><span class="punctuation token">(</span>Phaser<span class="punctuation token">.</span>Timer<span class="punctuation token">.</span>SECOND<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>updateCounter<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Este bucle, también en la función <code>create</code>, ejecutará la función <code>updateCounter</code> cada segundo desde el comienzo del juego, así podemos aplicar los cambios acordes. Así es como se ve la función <code>updateCounter</code> completa:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">updateCounter<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="operator token">++</span><span class="punctuation token">;</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>timerText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimeText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Total time: "</span><span class="operator token">+</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span><span class="punctuation token">,</span></code></pre>
+
+<p>Como puedes ver estamos incrementando la variable <code>this.timer</code> y actualizando el contenido del objeto de texto con el valor actual en cada iteración, por lo que el jugador verá el tiempo transcurrido.</p>
+
+<h4 id="Terminando_el_nivel_y_el_juego">Terminando el nivel y el juego</h4>
+
+<p>La pelota está rodando en la pantalla, el temporizador funciona y tenemos el agujero al que tenemos que llegar. Vamos a configurar la posibilidad de finalizar el juego! La siguiente linea en la funcion <code>update()</code> añade un detector que se activa cuando la pelota llega al agujero.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span>arcade<span class="punctuation token">.</span><span class="function token">overlap</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>finishLevel<span class="punctuation token">,</span> <span class="keyword token">null</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Esto funciona de manera similar al método <code>colide</code> explicado anteriormente. Cuando la pelota se superpone con el agujero (en lugar de colisionar), la función <code>finishLevel</code> es ejecutada:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">finishLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>level <span class="operator token">&gt;=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>maxLevels<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">;</span>
+        <span class="function token">alert</span><span class="punctuation token">(</span><span class="string token">'Congratulations, game completed!\nTotal time of play: '</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="operator token">+</span><span class="string token">' seconds!'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'MainMenu'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">else</span> <span class="punctuation token">{</span>
+        <span class="function token">alert</span><span class="punctuation token">(</span><span class="string token">'Congratulations, level '</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="operator token">+</span><span class="string token">' completed!'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>timer <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="operator token">++</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>timerText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimeText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Total time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>levelText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Level: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="operator token">+</span><span class="string token">" / "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>maxLevels<span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>x <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>x<span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>y <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>y<span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">showLevel</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">,</span></code></pre>
+
+<p>Si el nivel actual es igual al maximo número de niveles (5, en este caso), entonces el juego termina: recibiras un mensaje de felicitación junto con el numero de segundas transcurridos durante todo el juego, y un botoón para presionar que te llevará al menú principal.</p>
+
+<p>Si el nivel actual es menor que 5, todas las variables necesarias se reinician y el siguiente nivel es cargado.</p>
+
+<h2 id="Ideas_para_nuevas_características">Ideas para nuevas características</h2>
+
+<p><span style="line-height: 1.5;">Esto no es más que una demostración funcional de un juego que podría tener un montón de características adicionales. Por ejemplo podemos añadir poderes para recoger en el camino que harán que nuestra pelota ruede más rápido, otro podría detener el temporizador durante unos segundos o dar la pelota poderes especiales para atravesar obstáculos. También hay espacio para los obstáculos y trampas que harán más lenta la pelota, acelerar el tiempo o trampas de la propia pelota. Puedes crear más niveles con dificultades diferentes para cada uno. Incluso puedes obtener logros, tablas de clasificación y medallas para diferentes acciones en el juego. Hay un sinfín de posibilidades: sólo dependen de tu imaginación.</span></p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Espero que este tutorial te ayude a introducirte dentro del desarrollo de los juegos 2D y te inspire a crear asombrosos juegos por tu cuenta. Puedes jugar el demo de Cyber Orb y chequear su código fuente en GitHub.</p>
+
+<p>HTML5 nos da herramientas en bruto, los <em>frameworks</em> construidos sobre estas se están volviendo más rápidos y mejores, por lo que ahora es un gran momento para meterse en el desarrollo de juegos web. En este tutorial usamos Phaser, pero hay un gran número de otros <em>frameworks</em> que vale la pena considerar también, como ImpactJS, Construct 2 o PlayCanvas — depende de tus preferencias, habilidades de programación (o la falta de estas), el tamaño de tu proyecto, los requerimientos y otros aspectos. Deberías chequearlos todos y decidir cual es el que mejor se ajusta a tus necesidades.</p>
diff --git a/files/es/games/tutorials/index.html b/files/es/games/tutorials/index.html
new file mode 100644
index 0000000000..8b40ad4353
--- /dev/null
+++ b/files/es/games/tutorials/index.html
@@ -0,0 +1,11 @@
+---
+title: Workflows for different game types
+slug: Games/Tutorials
+tags:
+  - NeedsTranslation
+  - TopicStub
+translation_of: Games/Tutorials
+original_slug: Games/Workflows
+---
+<div>{{GamesSidebar}}</div><p>This page will contain links to different article series covering different workflows for effectively creating different types of web games, whether you want to create a 2D or 3D game from scratch, or port a C++ or Flash game over to open web technologies.</p>
+<p>For example, a <a href="/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">2D maze game with Phaser and the Device Orientation API</a>.</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/bounce_off_the_walls/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/bounce_off_the_walls/index.html
deleted file mode 100644
index d168aa0102..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/bounce_off_the_walls/index.html
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: Rebota en las paredes
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Bounce_off_the_walls
----
-<div>{{GamesSidebar}}</div><div>
-<p>{{IncludeSubnav("/es/docs/Games")}}</p>
-</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado")}}</p>
-
-<div class="summary">
-<p>Este es el tercer paso de 10 del  <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">tutorial Canvas para el desarrollo de juegos</a>. Puedes encontrar el código fuente y pegarle un vistazo después de completar esta lección <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson03.html">Gamedev-Canvas-workshop/lesson3.html</a>.</p>
-</div>
-
-<p><span class="seoSummary">Es agradable ver nuestra bola moviéndose, pero desaparece rápidamente de la pantalla, limitando la diversión que podemos tener con ella. Para superar esto, implementaremos una detección de colisión muy simple (que se explicará <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch/Collision_detection">más adelante</a> con más detalle) para hacer que la pelota rebote en los cuatro bordes del Canvas.</span></p>
-
-<h2 id="Detección_de_colisión_simple">Detección de colisión simple</h2>
-
-<p>Para detectar la colisión verificamos si la bola está tocando (chocando con) la pared y si es así, cambiaremos la dirección de su movimiento en consecuencia.</p>
-
-<p>Para facilitar los cálculos, definamos una variable llamada <code>ballRadius</code> que mantendrá el radio del círculo dibujado y se utilizará para los cálculos. Añade esto a tu código, en algún lugar por debajo de las declaraciones de variables existentes:</p>
-
-<pre class="brush: js">var ballRadius = 10;</pre>
-
-<p>Ahora actualice la línea que dibuja la bola dentro de la funcion drawBall() a esto:</p>
-
-<pre class="brush: js">ctx.arc(x, y, ballRadius, 0, Math.PI*2);</pre>
-
-<h3 id="Rebotando_arriba_y_abajo">Rebotando arriba y abajo</h3>
-
-<p>Hay cuatro paredes para rebotar la pelota - vamos a centrarnos en la de arriba en primer lugar. Tendremos que comprobar, en cada fotograma, si la pelota está tocando el borde superior del Canvas - si es así, invertiremos el movimiento de la bola para que empiece a moverse en la dirección opuesta y se mantenga dentro de los límites visibles. Recordando que el sistema de coordenadas comienza desde la parte superior izquierda, podemos llegar a algo como esto:</p>
-
-<pre class="brush: js">if(y + dy &lt; 0) {
-    dy = -dy;
-}</pre>
-
-<p>Si el valor de y de la posición de la bola es menor que cero, cambie la dirección del movimiento en el eje y, estableciéndolo igual a sí mismo, invertido. Si la pelota se movía hacia arriba con una velocidad de 2 píxeles por fotograma, ahora se moverá "arriba" con una velocidad de -2 píxeles, lo que en realidad equivale a bajar a una velocidad de 2 píxeles por fotograma.</p>
-
-<p>El código anterior se ocuparía de que la pelota rebote desde el borde superior, así que ahora vamos a pensar en el borde inferior:</p>
-
-<pre class="brush: js">if(y + dy &gt; canvas.height) {
-    dy = -dy;
-}</pre>
-
-<p>Si la posición y de la pelota es mayor que la altura del canvas (recuerde que contamos los valores y desde la parte superior izquierda, de modo que el borde superior empieza en 0 y el borde inferior está en 480 píxeles, la altura del canvas), entonces rebota del borde inferior invirtiendo el movimiento del eje y como antes.</p>
-
-<p>Podríamos fusionar esas dos sentencias en una para ahorrar código:</p>
-
-<pre class="brush: js">if(y + dy &gt; canvas.height || y + dy &lt; 0) {
-    dy = -dy;
-}</pre>
-
-<p>Si cualquiera de las dos afirmaciones es verdadera, invierte el movimiento de la pelota.</p>
-
-<h3 id="Rebotando_en_la_izquierda_y_derecha">Rebotando en la izquierda y derecha</h3>
-
-<p>Tenemos el borde superior e inferior cubiertos, así que pensemos en los de izquierda y derecha. Es muy similar en realidad, todo lo que tienes que hacer es repetir las declaraciones de x en lugar de y:</p>
-
-<pre class="brush: js">if(x + dx &gt; canvas.width || x + dx &lt; 0) {
-    dx = -dx;
-}
-
-if(y + dy &gt; canvas.height || y + dy &lt; 0) {
-    dy = -dy;
-}</pre>
-
-<p>En este punto, debe insertar el bloque de código anterior en la función draw(), justo antes de la llave de cierre.</p>
-
-<h3 id="¡La_pelota_sigue_desapareciendo_en_la_pared!">¡La pelota sigue desapareciendo en la pared!</h3>
-
-<p>Prueba tu código en este punto, y te quedarás impresionado - ¡ahora tenemos una pelota que rebotó en los cuatro bordes del canvas! Pero tenemos otro problema sin embargo - cuando la bola golpea cada pared se hunde en ella levemente antes de cambiar la dirección:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10432/ball-in-wall.png" style="display: block; height: 320px; margin: 0px auto; width: 480px;"></p>
-
-<p>Esto es porque estamos calculando el punto de colisión de la pared y el centro de la bola, mientras que deberíamos hacerlo por su circunferencia. La bola debe rebotar justo después de que toca la pared, no cuando ya está a medio camino en la pared, así que vamos a ajustar nuestras declaraciones un poco para incluir eso. Actualice el último código que agregó, a esto:</p>
-
-<pre class="brush: js">if(x + dx &gt; canvas.width-ballRadius || x + dx &lt; ballRadius) {
-    dx = -dx;
-}
-if(y + dy &gt; canvas.height-ballRadius || y + dy &lt; ballRadius) {
-    dy = -dy;
-}</pre>
-
-<p>Cuando la distancia entre el centro de la bola y el borde de la pared es exactamente igual que el radio de la pelota, cambiará la dirección del movimiento. Restando el radio de un ancho del eje y añadiéndolo al otro nos da la impresión de una adecuada detección de colisiones - la pelota rebota de las paredes como debería hacerlo.</p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Chequea el código acabado para esta parte con el tuyo, y juega:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/redj37dc/","","370")}}</p>
-
-<div class="note">
-<p><strong>Ejercicio</strong>: cambia el color de la bola a un color al azar, cada vez que golpea una pared.</p>
-</div>
-
-<h2 id="Siguientes_pasos">Siguientes pasos</h2>
-
-<p>Ahora hemos llegado al punto donde nuestra pelota se mueve y permanece en el tablero de juego. En el capítulo cuarto, veremos la implementación del control de una pala - vea <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado">Control de Pala y teclado</a>.</p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/construye_grupo_bloques/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/construye_grupo_bloques/index.html
deleted file mode 100644
index 99c944764b..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/construye_grupo_bloques/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: Construye el muro de ladrillos
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Build_the_brick_field
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones")}}</p>
-
-<div class="summary">
-<p>Este es el sexto<strong> paso de 10 del</strong> <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro">Tutorial del Lienzo (Canvas) para desarrollar juegos (Gamedev Canvas Tutorial)</a>. Puedes encontrar el código fuente como debería quedar tras completar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson06.html">Gamedev-Canvas-workshop/lesson6.html</a>.</p>
-</div>
-
-<p>Hemos cambiado la mecánica del juego y ahora ya podemos perder.<span class="seoSummary"> Esto es genial porque significa que el juego finalmente se comporta como un juego. Sin embargo, pronto resultará aburrido si todo lo que puedes conseguir es hacer rebotar la pelota en las paredes y en la pala. Lo que el juego necesitamos es romper ladrillos con la bola. Ahora vamos a dibujar los ladrillos.</span></p>
-
-<h2 id="Declarar_e_inicializar_las_variables_de_los_ladrillos">Declarar e inicializar las variables de los ladrillos</h2>
-
-<p>El propósito principal de esta lección consiste en escribir unas pocas líneas de código para los ladrillos, utilizando un bucle anidado que recorra una matriz bidimensional. Pero, antes, necesitamos preparar unas variables que definan la información sobre los ladrillos, como su ancho y alto, filas y columnas, etc. Añade estas líneas a tu programa, debajo de las otras variables que has definido antes:</p>
-
-<pre class="brush: js">var brickRowCount = 3;
-var brickColumnCount = 5;
-var brickWidth = 75;
-var brickHeight = 20;
-var brickPadding = 10;
-var brickOffsetTop = 30;
-var brickOffsetLeft = 30;</pre>
-
-<p>Aquí hemos definido el número de filas (Row) y columnas (Column) de ladrillos, su ancho (Width) y alto (Height), el hueco entre los ladrillos para que no se toquen (Padding), y un margen superior (Top) e izquierdo (Left) para que no se dibujen tocando los bordes.</p>
-
-<p>Guardaremos nuestros ladrillos en una matriz bidimensional que contendrá las columnas (c) de los ladrillos. Cada columna contendrá, a su vez, toda la fila (r) de ladrillos. Cada ladrillo se va a representar con un objeto con las posiciones "x" e "y" en las que se dibujará. Añade esto detrás de las definiciones de las variables:</p>
-
-<pre class="brush: js">var bricks = [];
-for(c=0; c&lt;brickColumnCount; c++) {
-    bricks[c] = [];
-    for(r=0; r&lt;brickRowCount; r++) {
-        bricks[c][r] = { x: 0, y: 0 };
-    }
-}</pre>
-
-<p>El código anterior pasará por las filas y las columnas y creará los ladrillos. TEN EN CUENTA que esos objetos que representan a los ladrillos también se utilizarán para detectar colisiones más adelante.</p>
-
-<p>Por si no lo terminas de entender... bricks[0][0] es el primer ladrillo (columna 0, fila 0) y se dibujará en "x" 0 e "y" 0. El siguiente ladrillo será el brick[0][1] (columna 0, fila 1) y se dibujará también en (0,0). Así, continuaremos hasta el final de la primera columna, que será el ladrillo bricks[0][2] porque hay 3 filas, de la 0 a la 2. Terminará así el bucle de dentro y seguirá el de fuera, valiendo ahora la "c" 1. Seguiremos recorriendo bricks[] hasta llegar a bricks[2][4], que es el último ladrillo.</p>
-
-<h2 id="Dibujar_los_bloques">Dibujar los bloques</h2>
-
-<p>Ahora vamos a crear una función para recorrer todos los bloques de la matriz y dibujarlos en la pantalla:</p>
-
-<pre class="brush: js">function drawBricks() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            bricks[c][r].x = 0;
-            bricks[c][r].y = 0;
-            ctx.beginPath();
-            ctx.rect(0, 0, brickWidth, brickHeight);
-            ctx.fillStyle = "#0095DD";
-            ctx.fill();
-            ctx.closePath();
-        }
-    }
-}
-</pre>
-
-<p>Viene a ser lo mismo de antes, sólo que hemos añadido ctx.rect() para dibujar un rectángulo por cada ladrillo, además de otras llamadas a funciones para que, efectivamente, se dibuje el rectángulo.</p>
-
-<p>Cada ladrillo se dibujará en la posición (0, 0), tendrá un ancho brickWidth y un alto de brickHeight.</p>
-
-<p>Estupendo pero... ¡estamos dibujando todos los ladrillos en el mismo sitio! ¡Eso no puede ser!</p>
-
-<p>Vamos a calcular en qué posición "x" e "y" se tiene que dibujar cada ladrillo así:</p>
-
-<pre class="brush: js">var brickX = (c*(brickWidth+brickPadding))+brickOffsetLeft;
-var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;
-</pre>
-
-<p>El primer ladrillo se dibujará arriba a la izquierda, concretamente en (brickoffsetLeft, brickOffsetTop), porque c y r valen 0.</p>
-
-<p>El siguiente ladrillo (columna 0, fila 1) se dibujará más abajo.</p>
-
-<p>Intenta hacer tú mismo los cálculos y verás cómo cada ladrillo de la misma columna se dibujará más abajo o más arriba según en qué fila se encuentre.</p>
-
-<p>También verás cómo cada ladrillo de la misma fila se dibujará más a la izquierda o a la derecha según en qué columna se encuentre.</p>
-
-<p>Vamos a terminar la función drawBricks() para que quede así:</p>
-
-<pre class="brush: js">function drawBricks() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            var brickX = (c*(brickWidth+brickPadding))+brickOffsetLeft;
-            var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;
-            bricks[c][r].x = brickX;
-            bricks[c][r].y = brickY;
-            ctx.beginPath();
-            ctx.rect(brickX, brickY, brickWidth, brickHeight);
-            ctx.fillStyle = "#0095DD";
-            ctx.fill();
-            ctx.closePath();
-        }
-    }
-}</pre>
-
-<h2 id="Dibujar_los_bloques_(ahora_sí)">Dibujar los bloques (ahora sí)</h2>
-
-<p>Lo estamos haciendo muy bien, pero si has probado te habrás dado cuenta de que no se dibuja nada. ¿Qué es lo que falla?</p>
-
-<p>Pues, sencillamente, que tenemos definida la función drawBricks() pero no la llamamos desde ningún sitio.</p>
-
-<p>Añade drawBricks() dentro de draw(), justo antes de drawBall ():</p>
-
-<pre class="brush: js">drawBricks();
-</pre>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Compara tu código con este:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/kundan333/myd4vbwg/2/","","320")}}</p>
-
-<div class="note">
-<p>Ejercicio: Prueba a cambiar el número de bloques por fila o columna, o sus posiciones (utiliza las variables que definiste al principio de este capítulo).</p>
-</div>
-
-<h2 id="Pasos_siguientes">Pasos siguientes</h2>
-
-<p>¡Así que ahora tenemos ladrillos! Un gran avance pero... la pelota no los rompe, simplemente los atraviesa. En el siguiente capítulo lo arreglaremos: <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones">Detección de colisiones</a>.</p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/control_pala_y_teclado/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/control_pala_y_teclado/index.html
deleted file mode 100644
index 81403423c7..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/control_pala_y_teclado/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: Control de la pala y el teclado
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Paddle_and_keyboard_controls
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego")}}</p>
-
-<div class="summary">
-<p>Este es el cuarto de los 10 pasos del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Tutorial de Canvas para el desarrollo de juegos</a>. Puedes encontrar el código fuente como debería quedar después de completar la lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson04.html">Gamedev-Canvas-workshop/lesson4.html</a>.</p>
-</div>
-
-<p> </p>
-
-<p><span class="seoSummary">La bola está rebotando en las paredes libremente y puedes estar mirándola toda la vida, pero, ahora mismo, no hay interactividad. ¡No es un juego si no puedes controlarlo! Vamos a añadirle la interacción del usuario: una paleta.</span></p>
-
-<h2 id="Definir_una_paleta_para_golpear_la_bola">Definir una paleta para golpear la bola</h2>
-
-<p>Necesitamos una paleta para golpear la bola. Empezamos por definir variables para conseguirlo. Añade las variables siguientes en la parte de arriba de tu código, junto a las que ya tenías:</p>
-
-<pre class="brush: js">var paddleHeight = 10;
-var paddleWidth = 75;
-var paddleX = (canvas.width-paddleWidth)/2;</pre>
-
-<p>paddleHeight servirá para definir la altura de la paleta, paddleWidth la anchura y paddleX la posición en el eje X en la que empieza a dibujarse. Definimos una función que dibujará la paleta en la pantalla. Añade este código justo después de la función <code>drawBall()</code>:</p>
-
-<pre class="brush: js">function drawPaddle() {
-    ctx.beginPath();
-    ctx.rect(paddleX, canvas.height-paddleHeight, paddleWidth, paddleHeight);
-    ctx.fillStyle = "#0095DD";
-    ctx.fill();
-    ctx.closePath();
-}</pre>
-
-<h2 id="Permitir_que_el_usuario_controle_la_paleta">Permitir que el usuario controle la paleta</h2>
-
-<p>Podemos dibujar la paleta donde queramos, pero debería responder a las acciones del usuario. Ha llegado la hora de implementar algunos controles de teclado. Vamos a necesitar:</p>
-
-<ul>
- <li>Dos variables para guardar la información sobre si se ha pulsado el botón izquierdo o el derecho.</li>
- <li>Dos funciones (event listeners) que respondan a los eventos <code>keydown</code> y <code>keyup</code> (pulsar tecla, liberar tecla). Queremos que se ejecute algún código para manejar la paleta cuando se pulsen los botones.</li>
- <li>Dos funciones que manejen los eventos <code>keydown</code> y <code>keyup</code> que se ejecutarán cuando se pulsen los botones.</li>
- <li>La habilidad de mover la paleta a la izquierda y a la derecha</li>
-</ul>
-
-<p>Empezaremos por definir las variables que nos dirán si se ha pulsado un botón. Añade estas líneas donde has definido las demás variables:</p>
-
-<pre class="brush: js">var rightPressed = false;
-var leftPressed = false;</pre>
-
-<p>Las dos las inicializamos con el valor <code>false</code> porque al principio no están pulsados los botones. Para "escuchar" las pulsaciones de las teclas necesitamos definir dos "escuchadores de eventos" (event listeners). Añade las líneas siguientes justo antes de <code>setInterval()</code> al final de tu código:</p>
-
-<pre class="brush: js">document.addEventListener("keydown", keyDownHandler, false);
-document.addEventListener("keyup", keyUpHandler, false);</pre>
-
-<p>Cuando ocurra el evento <code>keydown</code> al pulsar cualquier tecla del teclado, la función <code>keyDownHandler()</code> se ejecutará. Cuando se liberará la tecla pulsada, se ejecutará la función <code>keyUpHandler()</code>. Añade esto después de las líneas del <code>addEventListener()</code> que acababas de escribir:</p>
-
-<pre class="brush: js">function keyDownHandler(e) {
-    if(e.keyCode == 39) {
-        rightPressed = true;
-    }
-    else if(e.keyCode == 37) {
-        leftPressed = true;
-    }
-}
-
-function keyUpHandler(e) {
-    if(e.keyCode == 39) {
-        rightPressed = false;
-    }
-    else if(e.keyCode == 37) {
-        leftPressed = false;
-    }
-}</pre>
-
-<p>Cuando pulsamos una tecla se ejecuta keyDownHandler(e), que pone en la variable "e" los datos que necesitamos. Efectivamente, e.keyCode nos va a decir qué tecla se ha pulsado. Si vale 37 es porque se ha pulsado la "flecha izquierda" del teclado. El código 39 representa a la "flecha derecha".</p>
-
-<p>Pues bien, cuando se pulsará la "flecha izquierda" pondremos leftPressed a true.</p>
-
-<p>Cuando se liberará la "flecha izquierda" pondremos leftPressed a false.</p>
-
-<p>De igual forma procederá el programa con la "flecha derecha", detectando el código 39 y dando los valores oportunos a la variable rightPressed.</p>
-
-<h3 id="La_lógica_del_movimiento_de_la_paleta">La lógica del movimiento de la paleta</h3>
-
-<p>Ya tenemos las variables que contienen la información sobre las teclas pulsadas, los escuchadores de eventos y las funciones relevantes. Ahora vamos a ocuparnos del código que utilizará todo eso y moverá la paleta en la pantalla. Dentro de la función <code>draw()</code> comprobaremos si está pulsada la flecha izquierda o la derecha cada vez que se dibuje un fotograma. Nuestro código podría tener este aspecto:</p>
-
-<pre class="brush: js">if(rightPressed) {
-    paddleX += 7;
-}
-else if(leftPressed) {
-    paddleX -= 7;
-}</pre>
-
-<p>Si se pulsa la flecha izquierda, la paleta se moverá 7 píxeles a la izquierda. Si se pulsa la flecha derecha, se moverá 7 píxeles a la derecha. Aunque esto funciona bien, la paleta desaparece en los laterales del terreno de juego si mantenemos pulsada una tecla demasiado tiempo. Podemos mejorar esto para que se mueva dentro de los límites del canvas, cambiando el código así:</p>
-
-<pre class="brush: js">if(rightPressed &amp;&amp; paddleX &lt; canvas.width-paddleWidth) {
-    paddleX += 7;
-}
-else if(leftPressed &amp;&amp; paddleX &gt; 0) {
-    paddleX -= 7;
-}</pre>
-
-<p>La posición paddleX que estamos utilizando variará entre 0 para la lado izquierdo y <code style="font-style: normal; font-weight: normal;">canvas.width-paddleWidth</code> para el lado derecho, que es justo lo que queremos.</p>
-
-<p>Añade el código anterior dentro de la función <code>draw(), al final</code>, justo antes de la llave que cierra.</p>
-
-<p>Lo único que nos falta por hacer es llamar a la función <code>drawPaddle()</code> desde dentro de la función <code>draw()</code> para que dibuje la paleta dentro en la pantalla. Añade la línea siguiente dentro de <code>draw(), justo antes de la línea que llama a la función</code> <code>drawBall()</code>:</p>
-
-<pre class="brush: js">drawPaddle();
-</pre>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Aquí está el código que funciona, para que lo compares con el tuyo:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/tgn3zscj/","","320")}}</p>
-
-<div class="note">
-<p><strong>Ejercicio</strong>: haz que la paleta se mueva más deprisa o más despacio, o cambia su tamaño.</p>
-</div>
-
-<h2 id="Pasos_siguientes">Pasos siguientes</h2>
-
-<p>Ahora mismo tenemos algo que parece un juego. El único problema es que todo lo que puedes hacer es golpear la bola con la paleta toda la vida (en realidad, ni siquiera la golpeas). Todo esto cambiará en el quinto capítulo, <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego">Fin del juego</a>, cuando añadiremos un estado de "Game Over".</p>
-
-<div> </div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/controles_raton/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/controles_raton/index.html
deleted file mode 100644
index 65e32f0ac2..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/controles_raton/index.html
+++ /dev/null
@@ -1,53 +0,0 @@
----
-title: Controles del ratón
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Mouse_controls
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando")}}</p>
-
-<div class="summary">
-<p>Este es el noveno paso de 10 del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">tutorial Canvas para el desarrollo de juegos</a>. Puedes encontrar el código y pegarle un vistazo después de completar esta lección <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson09.html">Gamedev-Canvas-workshop/lesson9.html</a>.</p>
-</div>
-
-<p>El juego en sí está terminado, así que ahora vamos a pulirlo. Ya le hemos puesto el control del teclado y ahora le añadiremos el control del ratón<span class="seoSummary">.</span></p>
-
-<h2 id="Detectar_el_movimiento_del_ratón">Detectar el movimiento del ratón</h2>
-
-<p>Detectar el movimiento del ratón es más fácil que detectar las pulsaciones de las teclas. Todo lo que necesitamos es un añadir "escuchador" al evento {{event("mousemove")}}.Añade esta línea destrás de los otros "listeners", justo debajo del evento <code>keyup</code>:</p>
-
-<pre class="brush: js">document.addEventListener("mousemove", mouseMoveHandler, false);</pre>
-
-<h2 id="Asociar_el_movimiento_de_la_pala_con_el_movimiento_del_ratón">Asociar el movimiento de la pala con el movimiento del ratón</h2>
-
-<p>Podemos cambiar la posición de la pala basándonos en las coordenadas del puntero del ratón. Eso es lo que hace la función siguiente. Añádela detrás de la línea que acabas de añadir:</p>
-
-<pre class="brush: js">function mouseMoveHandler(e) {
-    var relativeX = e.clientX - canvas.offsetLeft;
-    if(relativeX &gt; 0 &amp;&amp; relativeX &lt; canvas.width) {
-        paddleX = relativeX - paddleWidth/2;
-    }
-}</pre>
-
-<p>En esta función calculamos un valor <code style="font-style: normal; font-weight: normal;">relativeX</code>, que es la posición horizontal del ratón en el "viewport" (<code style="font-style: normal; font-weight: normal;">e.clientX</code>), menos la distancia entre el borde izquierdo del terreno de juego y el borde izquierdo del "viewport" (<code style="font-style: normal; font-weight: normal;">canvas.offsetLeft</code>).</p>
-
-<p>Si el valor resultante es mayor que cero y menor que el ancho del terreno de juego, es que el ratón está dentro de los límites, y calculamos la posición de la paleta poniéndole el valor <code style="font-style: normal; font-weight: normal;">relativeX</code> menos la mitad del ancho de la paleta, para que el movimiento sea de verdad relativo a la mitad de la paleta.</p>
-
-<p>Ahora, la paleta seguirá la posición del cursor del ratón pero, como restringimos el movimiento al &lt;canvas&gt;, no desaparecerá completamente por los lados.</p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Aquí tienes el código para comparar:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/L3gngab5/","","320")}}</p>
-
-<div class="summary">
-<p>Ejercicio: ajusta los límites del movimiento de la pala para que siempre se vea la pala completa (ahora sólo se ve media en los laterales).</p>
-</div>
-
-<h2 id="Pasos_siguientes">Pasos siguientes</h2>
-
-<p>Ya tenemos el juego terminado, pero aún lo podemos mejorar con algunos trucos <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando">Finalizando</a>.</p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/create_the_canvas_and_draw_on_it/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/create_the_canvas_and_draw_on_it/index.html
deleted file mode 100644
index 59703d3bc7..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/create_the_canvas_and_draw_on_it/index.html
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: Crea el lienzo (canvas) y dibuja en él
-slug: >-
-  Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it
-translation_of: >-
-  Games/Tutorials/2D_Breakout_game_pure_JavaScript/Create_the_Canvas_and_draw_on_it
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola")}}</p>
-
-<div class="summary">
-<p>Este es el primero de los 10 pasos del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Tutorial del Lienzo (Canvas) para desarrollar juegos (Gamedev Canvas Tutorial)</a>. Puedes encontrar el código fuente como debería quedar tras completar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson01.html">Gamedev-Canvas-workshop/lesson1.html</a>.</p>
-</div>
-
-<p><span class="seoSummary">Antes de que podamos programar la parte funcional del juego, necesitamos crear la estructura básica de la página que lo va a contener. Podemos hacerlo utilizando HTML y el elemento  {{htmlelement("canvas")}} .</span></p>
-
-<h2 id="El_HTML_del_juego">El HTML del juego</h2>
-
-<p>La estructura del documento HTML es muy simple, porque todo el juego se visualizará dentro del elemento {{htmlelement("canvas")}}. Con tu editor de textos favorito, prepara un documento en blanco, guárdalo como <code>index.html</code> en un lugar adecuado, y escribe el siguiente código:</p>
-
-<pre class="brush: html">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-    &lt;meta charset="utf-8" /&gt;
-    &lt;title&gt;Gamedev Canvas Workshop&lt;/title&gt;
-    &lt;style&gt;
-    	* { padding: 0; margin: 0; }
-    	canvas { background: #eee; display: block; margin: 0 auto; }
-    &lt;/style&gt;
-&lt;/head&gt;
-&lt;body&gt;
-
-&lt;canvas id="myCanvas" width="480" height="320"&gt;&lt;/canvas&gt;
-
-&lt;script&gt;
-	// JavaScript code goes here
-&lt;/script&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>En la cabecera (head) tenemos un <code>charset</code>, el título de la página {{htmlelement("title")}} y un poco de CSS básico. El {{htmlelement("body")}} contiene los elementos{{htmlelement("canvas")}} y {{htmlelement("script")}}. Representaremos el juego en el primero y escribiremos el código JavaScript que lo controla en el segundo. El elemento  {{htmlelement("canvas")}} tiene el <code>id</code> <code>myCanvas</code> para que podamos hacer referencia a él con facilidad, y mide 480 píxeles de ancho por 320 de alto. Todo el código JavaScript que vamos a escribir en este tutorial lo pondremos entre las etiquetas <code>&lt;script&gt;<font face="Thread-00002020-Id-00000048"> y</font></code> <code>&lt;/script&gt;</code>.</p>
-
-<h2 id="El_lienzo_(canvas)">El lienzo (canvas)</h2>
-
-<p>Para que podamos visualizar los gráficos en el elemento {{htmlelement("canvas")}}, primero tenemos que preparar una referencia a él en JavaScript. Añade lo siguiente después de la etiqueta <code>&lt;script&gt;:</code></p>
-
-<pre class="brush: js">var canvas = document.getElementById("myCanvas");
-var ctx = canvas.getContext("2d");</pre>
-
-<p>Aquí estamos guardando una referencia al elemento {{htmlelement("canvas")}} en la variable <code>canvas</code>. Después estamos creando la variable <code>ctx</code> para guardar el contexto de gráficos 2D, que es la herramienta  que realmente utilizaremos para dibujar.</p>
-
-<p>Veamos un fragmento de código de ejemplo que dibuja un cuadrado rojo en el canvas. Añade el código a continuación y abre el archivo <code>index.html</code> con un navegador para comprobar que funciona:</p>
-
-<pre class="brush: js">ctx.beginPath();
-ctx.rect(20, 40, 50, 50);
-ctx.fillStyle = "#FF0000";
-ctx.fill();
-ctx.closePath();</pre>
-
-<p>Todas las instrucciones están entre los métodos {{domxref("CanvasRenderingContext2D.beginPath()","beginPath()")}} y {{domxref("CanvasRenderingContext2D.closePath()","closePath()")}}. Estamos definiendo un rectángulo utilizando {{domxref("CanvasRenderingContext2D.rect()","rect()")}}: los dos primeros valores especifican las coordenadas de la esquina superior izquierda del rectángulo en el canvas, y  los otros dos sirven para indicar el ancho y el alto. En nuestro caso, el rectángulo se dibuja a 20 píxeles desde la izquierda de la pantalla y 40 píxeles desde la parte de arriba, y tiene 50 píxeles de ancho y 50 de alto, con lo que obtenemos un cuadrado perfecto. La propiedad {{domxref("CanvasRenderingContext2D.fillStyle","fillStyle")}} guarda un color que utilizará el método {{domxref("CanvasRenderingContext2D.fill()","fill()")}} para pintar el cuadrado que, en nuestro caso, será rojo.</p>
-
-<p>Podemos dibujar otras cosas aparte de rectángulos. Aquí hay un fragmento de código que dibuja un círculo verde. Prueba a añadir esto al final de tu código JavaScript, guárdalo y recarga la página en el navegador:</p>
-
-<pre class="brush: js">ctx.beginPath();
-ctx.arc(240, 160, 20, 0, Math.PI*2, false);
-ctx.fillStyle = "green";
-ctx.fill();
-ctx.closePath();</pre>
-
-<p>Como puedes ver, estamos utilizando otra vez los métodos {{domxref("CanvasRenderingContext2D.beginPath()","beginPath()")}} y {{domxref("CanvasRenderingContext2D.closePath()","closePath()")}}. De lo que hay en medio, la parte más importante del código anterior es el método {{domxref("CanvasRenderingContext2D.arc()","arc()")}}. Tiene seis parámetros:</p>
-
-<ul>
- <li>las coordenadas x e y del centro del arco</li>
- <li>el radio del arco</li>
- <li>los ángulos inicial y final (en qué ángulo empezar y terminar de dibujar el círculo, en radianes)</li>
- <li>la dirección hacia la que se dibujará (<code>false</code> para seguir el sentido de las agujas del reloj, que es el valor por defecto, o <code>true</code> para el sentido contrario). Este parámetro es opcional.</li>
-</ul>
-
-<p>La propiedad {{domxref("CanvasRenderingContext2D.fillStyle","fillStyle")}} tiene un valor distinto al que habíamos puesto antes. Esto se debe a que, como ocurre en CSS, el color se puede especificar como un valor hexadecimal, como un nombre de color en inglés, la función <code>rgba()</code>, o cualquiera de los otros métodos de descripción de color que existen.</p>
-
-<p>En lugar de utilizar {{domxref("CanvasRenderingContext2D.fill()","fill()")}} y rellenar las formas con colores, podemos utilizar {{domxref("CanvasRenderingContext2D.stroke()","stroke()")}} para colorear únicamente el trazo exterior. Prueba a añadir también esto a tu código JavaScript:</p>
-
-<pre class="brush: js">ctx.beginPath();
-ctx.rect(160, 10, 100, 40);
-ctx.strokeStyle = "rgba(0, 0, 255, 0.5)";
-ctx.stroke();
-ctx.closePath();</pre>
-
-<p>El código anterior dibuja un rectángulo vacío con el perímetro azul. Gracias al canal alfa de la función <code>rgba()</code>, que es el cuarto valor (Red, Green, Blue, Alpha), el color azul será medio transparente.</p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Aquí está el código fuente completo de la primera lección, ejecutándose en un JSFiddle:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/x62h15e2/","","370")}}</p>
-
-<div class="note">
-<p><strong>Ejercicio</strong>: cambia el tamaño y el color de las figuras.</p>
-</div>
-
-<h2 id="Pasos_siguientes">Pasos siguientes</h2>
-
-<p>Hemos preparado la estructura HTML básica y hemos aprendido un poquito a manejar el canvas. Para continuar, en el segundo capítulo averiguaremos cómo mover la bola en nuestro juego (<a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola">Mueve la bola</a>).</p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/deteccion_colisiones/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/deteccion_colisiones/index.html
deleted file mode 100644
index e6d950b834..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/deteccion_colisiones/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: Detección de colisiones
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Collision_detection
----
-<div>{{GamesSidebar}}</div>
-
-<div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win")}}</p>
-
-<div class="summary">
-<p>Este es el séptimo paso de los 10 del juego "<a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>". Puedes encontrar el código como deberá quedar después de completar la leción en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson07.html">Gamedev-Canvas-workshop/lesson7.html</a>.</p>
-</div>
-
-<p><span class="seoSummary">Ya tenemos los ladrillos en la pantalla pero el juego todavía no es muy interesante, porque la bola los atraviesa. Tenemos que pensar una manera de detectar colisiones para que la bola pueda rebotar en los ladrillos y romperlos.</span></p>
-
-<p><span class="seoSummary">Nosotros decidimos cómo implementar esto, por supuesto, pero puede ser complicado calcular si la bola está tocando el rectángulo o no, porque no hay funciones del &lt;canvas&gt; que sirvan para saberlo. En este tutorial vamos a hacerlo de la manera más fácil que existe: comprobaremos si el centro de la bola está tocando (colisionando) con cualquiera de los ladrillos. No siempre funcionará a la perfección y hay formas de detectar colisiones más sofisticadas que funcionan mejor, pero no nos interesa verlas porque estamos aprendiendo y tenemos que hacer las cosas fáciles</span>.</p>
-
-<h2 id="Una_función_para_detectar_colisiones">Una función para detectar colisiones</h2>
-
-<p>Para lograr nuestro objetivo vamos a definir una función que, con un bucle, recorrerá todos los ladrillos y comparará la posición de cada uno con la posición de la bola, cada vez que se dibuje un fotograma. Para que el código sea más legible definiremos la variable "b" que almacenará el objeto ladrillo en cada vuelta de bucle:</p>
-
-<pre class="brush: js">function collisionDetection() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            var b = bricks[c][r];
-            // calculations
-        }
-    }
-}</pre>
-
-<p>Si el centro de la bola está dentro de las coordenadas de uno de nuestros ladrillos, cambiaremos la dirección de la bola. Se cumplirá que el centro de la bola está dentro de ladrillo si se cumplen al mismo tiempo estas cuatro condiciones:</p>
-
-<ul>
- <li>La posición "x" de la bola es mayor que la posición "x" del ladrillo</li>
- <li>La posición "x" de la bola es menor que la posición del ladrillo más el ancho del ladrillo</li>
- <li>La posición "y" de la bola es mayor que la posición "y" del ladrillo.</li>
- <li>La posición "y" de la bola es menor que la posición del ladrillo más su altura.</li>
-</ul>
-
-<p>Traducimos esto a JavaScript:</p>
-
-<pre class="brush: js">function collisionDetection() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            var b = bricks[c][r];
-            if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
-                dy = -dy;
-            }
-        }
-    }
-}</pre>
-
-<p>Añade lo anterior a tu código, debajo de la función <code>keyUpHandler()</code>.</p>
-
-<h2 id="Hacer_que_los_ladrillos_desaparezcan_cuando_reciben_un_golpe">Hacer que los ladrillos desaparezcan cuando reciben un golpe</h2>
-
-<p>El código anterior funcionará correctamente y la bola cambiará de dirección. El problema es que los ladrillos siguen donde están. Tenemos que imaginar una forma de ocuparnos de los que ya hemos golpeado con la bola. Podemos hacerlo añadiendo un parámetro extra para indicar si queremos pintar cada ladrillo en la pantalla o no. En la parte del código donde inicializamos los ladrillos, añadiremos una propiedad <code>status</code> a cada ladrillo. Cambia tu código fijándote en la línea que está resaltada:</p>
-
-<pre class="brush: js; highlight:[5]">var bricks = [];
-for(c=0; c&lt;brickColumnCount; c++) {
-    bricks[c] = [];
-    for(r=0; r&lt;brickRowCount; r++) {
-        bricks[c][r] = { x: 0, y: 0, status: 1 };
-    }
-}</pre>
-
-<p>A continuación consultaremos el "status" de cada ladrillo para saber si lo tenemos que dibujar o no. Si "status" vale 1, lo dibujaremos. Si vale 0, no lo dibujaremos porque habrá sido golpeado por la bola. Actualiza tu función <code>drawBricks()</code> para que quede así:</p>
-
-<pre class="brush: js; highlight:[4,5,6,7,8,9,10,11,12,13,14]">function drawBricks() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            if(bricks[c][r].status == 1) {
-                var brickX = (c*(brickWidth+brickPadding))+brickOffsetLeft;
-                var brickY = (r*(brickHeight+brickPadding))+brickOffsetTop;
-                bricks[c][r].x = brickX;
-                bricks[c][r].y = brickY;
-                ctx.beginPath();
-                ctx.rect(brickX, brickY, brickWidth, brickHeight);
-                ctx.fillStyle = "#0095DD";
-                ctx.fill();
-                ctx.closePath();
-            }
-        }
-    }
-}</pre>
-
-<h2 id="Actualizar_el_status_en_la_función_de_detección_de_colisiones">Actualizar el "status" en la función de detección de colisiones</h2>
-
-<p>Ahora tenemos que ocuparnos del valor de "status" en la función <code>collisionDetection()</code>: si el ladrillo está activo (status 1) comprobaremos si hay colisión. Si hay colisión, pondremos el "status" de ese ladrillo a 0 para no volver a pintarlo. Actualiza <code>collisionDetection()</code> así:</p>
-
-<pre class="brush: js; highlight:[5,6,7,8,9,10]">function collisionDetection() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            var b = bricks[c][r];
-            if(b.status == 1) {
-                if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
-                    dy = -dy;
-                    b.status = 0;
-                }
-            }
-        }
-    }
-}</pre>
-
-<h2 id="Activar_la_función_de_detección_de_colisiones">Activar la función de detección de colisiones</h2>
-
-<p>Ya sólo falta llamar a la función <code>collisionDetection()</code> desde la función <code>draw()</code>. Añade la línea siguiente dentro de <code>draw()</code> function, justo después de la llamada a <code>drawPaddle()</code>:</p>
-
-<pre class="brush: js">collisionDetection();
-</pre>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Ahora se comprueban las colisiones cada vez que se dibuja un fotograma. Concretamente, miramos si la bola colisiona con cada ladrillo. ¡Ahora ya podemos romper ladrillos! :-</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/kundan333/myd4vbwg/5/","","320")}}</p>
-
-<div class="note">
-<p><strong>Ejercicio</strong>: cambia el color de la bola cada vez que choque con un ladrillo.</p>
-</div>
-
-<h2 id="Pasos_siguientes">Pasos siguientes</h2>
-
-<p>Definitivamente, lo estamos consiguiendo. ¡Adelanteeee! En el capítulo octavo nos ocuparemos de la <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win">Puntuación y fin del juego ganando</a>.</p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/fin_del_juego/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/fin_del_juego/index.html
deleted file mode 100644
index d57ccef444..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/fin_del_juego/index.html
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: Fin del juego
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego
-tags:
-  - Canvas
-  - Fin del juego
-  - JavaScript
-  - Tutorial
-  - graficos
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Game_over
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es-ES/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques")}}</p>
-
-<div class="summary">
-<p>Este es el quinto paso de 10 del <a href="/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>. Puedes ver como debería quedar el código fuente después de completar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson05.html">Gamedev-Canvas-workshop/lesson5.html</a>.</p>
-</div>
-
-<p><span id="result_box" lang="es"><span>Es divertido ver la bola rebotando en las paredes y ser capaz de mover la pala pero, aparte de eso, el juego no hace nada y no tiene ningún progreso ni un objetivo final.</span> <span>Sería bueno desde el punto de vista del juego poder perder.</span> <span>La lógica asociada a perder en este juego es fácil de entender: si se te escapa la bola y alcanza el borde inferior de la pantalla, pierdes y se acabó el juego</span></span><span lang="es"><span>.</span></span></p>
-
-<h2 id="Implementar_el_final_del_juego">Implementar el final del juego</h2>
-
-<p><span id="result_box" lang="es"><span>Intentemos implementar el final del juego en nuestro juego.</span> <span>Aquí está el trozo de código de la tercera lección en donde hicimos que la pelota rebotara en las paredes:</span></span></p>
-
-<pre class="brush: js">if(x + dx &gt; canvas.width-ballRadius || x + dx &lt; ballRadius) {
-    dx = -dx;
-}
-
-if(y + dy &gt; canvas.height-ballRadius || y + dy &lt; ballRadius) {
-    dy = -dy;
-}</pre>
-
-<p><span id="result_box" lang="es"><span>En lugar de dejar que la pelota rebote en las cuatro paredes, vamos a permitir que lo haga sólo en tres: izquierda, arriba y derecha.</span> Alcanzar <span>la pared inferior supondrá el fin del juego.</span> <span>Editaremos el segundo bloque if y lo convertiremos en un "if else" que activará el estado de "final de juego" cuando la pelota colisione con el borde inferior del terreno de juego.</span> <span>Por ahora nos conformaremos con mostrar un mensaje con la función alert() y con reiniciar el juego volviendo a cargar la página. Modifica el segundo if para que quede así</span><span>:</span></span></p>
-
-<pre class="brush: js">if(y + dy &lt; ballRadius) {
-    dy = -dy;
-} else if(y + dy &gt; canvas.height-ballRadius) {
-    alert("GAME OVER");
-    document.location.reload();
-}</pre>
-
-<h2 id="Hacer_que_la_pala_golpee_la_bola">Hacer que la pala golpee la bola</h2>
-
-<p>Para terminar esta lección sólo nos falta detectar la colisión de la bola y la paleta para que pueda rebotar, volviendo hacia la zona de juego. La manera más sencilla de hacerlo es comprobar si el centro de la bola está entre los límites izquierdo y derecho de la paleta. Actualiza el último <span id="result_box" lang="es"><span>fragmento del código, el "if else" de antes, para que te quede así:</span></span></p>
-
-<pre class="brush: js">if(y + dy &lt; ballRadius) {
-    dy = -dy;
-} else if(y + dy &gt; canvas.height-ballRadius) {
-    if(x &gt; paddleX &amp;&amp; x &lt; paddleX + paddleWidth) {
-        dy = -dy;
-    }
-    else {
-        alert("GAME OVER");
-        document.location.reload();
-    }
-}</pre>
-
-<p>Si la bola toca el <span id="result_box" lang="es"><span>borde inferior del lienzo (Canvas) debemos comprobar si golpea la pala.</span> <span>Si es así, entonces rebota como el jugador se imagina que va a ocurrir;</span> si no,<span> el juego ha terminado.</span></span></p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Aquí tienes el código que funciona para que lo compares con el tuyo:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/z4zy79fo/","","320")}}</p>
-
-<div class="note">
-<p><strong>Ejercicio</strong>: haz que la bola se mueva más rápida cuando golpea la pala.</p>
-</div>
-
-<h2 id="Siguientes_pasos">Siguientes pasos</h2>
-
-<p><span id="result_box" lang="es"><span>Lo estamos haciendo bastante bien hasta ahora y nuestro juego está empezando a despertar interés ahora que se puede perder. </span><span>Pero todavía falta algo.</span> <span>Vamos a pasar al sexto capítulo,</span></span> <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques">Construir el muro de ladrillos</a>, <span lang="es"><span>y crear algunos ladrillos para que la bola los destruya.</span></span></p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/index.html
deleted file mode 100644
index 10ea794d5f..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
----
-title: Famoso juego 2D usando JavaScript puro
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro
-tags:
-  - 2D Canvas JavaScript Tutorial
-  - Principiante Juegos
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es-ES/docs/Games")}}</div>
-
-<p>{{Next("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it")}}</p>
-
-<p class="summary">En este tutorial paso a paso creamos un juego de la MDN, sencillo y muy famoso, escrito íntegramente en JavaScript puro. Todos los elementos gráficos aparecerán dentro de la etiqueta {{htmlelement("canvas")}} de HTML5.</p>
-
-<p>Cada paso tiene ejemplos editables y listos para ejecutar, para que puedas ver qué aspecto debería tener el ejercicio en cada momento. Apenderás a utilizar el elemento {{htmlelement("canvas")}} para implementar mecánicas de juego fundamentales como la representación de imágenes, el movimiento, la detección de colisiones, los mecanismos de control y el final del juego ganando o perdiendo.</p>
-
-<p>Para aprovechar al máximo esta serie de artículos necesitas tener ya un conocimiento básico o intermedio de <a href="/en-US/Learn/Getting_started_with_the_web/JavaScript_basics">JavaScript</a>. Cuando termines este tutorial serás capaz de construir tus propios juegos Web.</p>
-
-<p><img alt="Gameplay screen from the game MDN Breakout where you can use your paddle to bounce the ball and destroy the brick field, with keeping the score and lives." src="https://mdn.mozillademos.org/files/10383/mdn-breakout-gameplay.png" style="display: block; height: 320px; margin: 0px auto; width: 480px;"></p>
-
-<h2 id="Detalle_de_las_lecciones">Detalle de las lecciones</h2>
-
-<p>Todas las lecciones y las diferentes versiones del <a href="http://breakout.enclavegames.com/lesson10.html">famoso juego MDN</a> que estamos construyendo juntos están <a href="https://github.com/end3r/Canvas-gamedev-workshop">disponibles en GitHub</a>:</p>
-
-<ol>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it">Crea el lienzo (canvas) y dibuja en él</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola">Mueve la bola</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls">Rebota en las paredes</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Control_pala_y_teclado">Control de la pala y el teclado</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Fin_del_juego">Fin del juego</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Construye_grupo_bloques">Construye el muro de ladrillos</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones">Detección de colisiones</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win">Cuenta los puntos y gana</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton">Controles del ratón</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando">Finalizando</a></li>
-</ol>
-
-<p>Empezar con JavaScript puro es la mejor forma de adquirir un conocimiento sólido sobre desarrollo de juegos. Después, puedes escoger cualquier entorno de desarrollo (framework) que te guste y usarlo para tus proyectos. Los frameworks son simplemente herramientas construidas con el lenguaje JavaScript; por tanto aunque planees trabajar con ellas, es bueno aprender primero  sobre el mismo lenguaje para saber exactamente qué es lo que hay por debajo. Los frameworks aceleran el tiempo de desarrollo y ayudan a tener en cuenta las partes aburridas del juego, pero si algo no funciona como esperas, siempre puedes intentar depurarlo o simplemente escribir tu solución en JavaScript puro.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si estás interesado en aprender sobre el desarrollo de juegos en 2D usando una entorno de desarrollo, consulta esta serie homóloga, <a href="/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">famoso juego 2D usando Phaser</a>.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>:  Esta serie de artículos puede usarse como material para talleres prácticos de desarrollo de juegos. También puedes hacer uso del <a href="/en-US/docs/">kit de contenido canvas Gamedev</a>  basado en este tutorial si quieres dar una charla sobre desarrollo de juegos en general.</p>
-</div>
-
-<h2 id="Siguientes_pasos">Siguientes pasos</h2>
-
-<p>Vale, ¡vamos a empezar! Dirígete hacia el primer tema — <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it">Crea el lienzo (canvas) y dibuja en él</a>.</p>
-
-<p>{{Next("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it")}} </p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/mueve_la_bola/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/mueve_la_bola/index.html
deleted file mode 100644
index 60a5df8c5a..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/mueve_la_bola/index.html
+++ /dev/null
@@ -1,154 +0,0 @@
----
-title: Mueve la bola
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Mueve_la_bola
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Move_the_ball
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/es-ES/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls")}}</p>
-
-<div class="summary">
-<p>Este es el segundo paso de los 10 del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">tutorial de Canvas para el desarrollo de juegos</a>. Puedes encontrar el código fuente como debería quedar después de completar la lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson02.html">Gamedev-Canvas-workshop/lesson2.html</a>.</p>
-</div>
-
-<p><span id="result_box" lang="es"><span>Ya sabes cómo dibujar una pelota, lo has aprendido en el artículo anterior. Ahora vamos a hacer que se mueva.</span> <span>Técnicamente, estaremos pintando la pelota en la pantalla, borrándola y luego pintándola de nuevo en una posición ligeramente diferente cada fotograma para dar la impresión de movimiento, igual que se hace en las películas.</span></span></p>
-
-<p> </p>
-
-<h2 id="Definir_un_bucle_de_dibujo">Definir un bucle de dibujo</h2>
-
-<p> </p>
-
-<p><span id="result_box" lang="es"><span>Para actualizar el dibujo del lienzo en cada fotograma, necesitamos definir una función de dibujo que se ejecutará una y otra vez, cambiando una serie de variables para modificar la posición de cada personaje (sprite). Para que una misma función se ejecute una y otra vez puedes utilizar una función </span><span>de sincronización de JavaScript, como</span></span> {{domxref("WindowTimers.setInterval()", "setInterval()")}} or {{domxref("window.requestAnimationFrame()", "requestAnimationFrame()")}}.</p>
-
-<p><span id="result_box" lang="es"><span>Elimina todo el código JavaScript que tienes ahora mismo en de tu archivo HTML, excepto las dos primeras líneas, y añade lo siguiente debajo de ellas.</span> <span>La función draw() se ejecutará dentro de setInterval cada 10 milisegundos:</span></span></p>
-
-<pre class="brush: js">function draw() {
-    // código para dibujar
-}
-setInterval(draw, 10);</pre>
-
-<p><span id="result_box" lang="es"><span>Gracias a la naturaleza infinita de setInterval, la función draw () se llamará cada 10 milisegundos por siempre, o hasta que lo detengamos.</span> <span>Ahora, vamos a dibujar la bola. A</span></span><span lang="es"><span>grega lo siguiente dentro de tu función draw ():</span></span></p>
-
-<pre class="brush: js">ctx.beginPath();
-ctx.arc(50, 50, 10, 0, Math.PI*2);
-ctx.fillStyle = "#0095DD";
-ctx.fill();
-ctx.closePath();
-</pre>
-
-<p>Prueba tu código actualizado ahora — la bola debería repintarse en cada fotograma (frame).</p>
-
-<h2 id="Hacer_que_se_mueva">Hacer que se mueva</h2>
-
-<div id="gt-res-content">
-<div class="trans-verified-button-small" dir="ltr">Aunque la bola se está dibujando cada 10 milisegundos no se nota porque no hay movimiento, se dibuja una y otra vez en el mismo sitio.<span id="result_box" lang="es"><span>Vamos a cambiar eso.</span> <span>En primer lugar, en lugar de dibujar siempre en la posición (50, 50) definiremos un punto de inicio en la parte central inferior del lienzo en las variables llamadas x e y, a continuación, las utilizaremos para definir la posición en la que se dibuja el círculo.</span><br>
-<br>
-<span>Primero, agrega las dos líneas siguientes a la función draw (), para definir x e y:</span></span></div>
-</div>
-
-<p> </p>
-
-<pre class="brush: js">var x = canvas.width/2;
-var y = canvas.height-30;
-</pre>
-
-<p> </p>
-
-<p>A continuación actualiza la función <code>draw()</code> para usar las variables x e y en el método {{domxref("CanvasRenderingContext2D.arc()","arc()")}}, como se muestra en la siguiente línea resaltada:</p>
-
-<pre class="brush: js; highlight:[3]">function draw() {
-    ctx.beginPath();
-    ctx.arc(x, y, 10, 0, Math.PI*2);
-    ctx.fillStyle = "#0095DD";
-    ctx.fill();
-    ctx.closePath();
-}
-</pre>
-
-<p><span id="result_box" lang="es"><span>Ahora viene la parte importante: queremos añadir un valor pequeño a x e y después de que cada fotograma se haya dibujado para que parezca que la pelota se está moviendo.</span> <span>Definamos estos valores pequeños como dx y dy, y establezcamos sus valores en 2 y -2 respectivamente.</span> <span>Agrega lo siguiente debajo de sus definiciones de variables x e y:</span></span></p>
-
-<pre class="brush: js">var dx = 2;
-var dy = -2;
-</pre>
-
-<p><span id="result_box" lang="es"><span>Lo último que hay que hacer es actualizar x e y con nuestras variables dx y dy en cada fotograma, de modo que la bola será pintada en la nueva posición en cada actualización.</span> <span>Agrega las dos nuevas líneas</span></span><span lang="es"><span> siguientes indicadas a continuación a la función draw ():</span></span></p>
-
-<pre class="brush: js; highlight:[7,8]">function draw() {
-    ctx.beginPath();
-    ctx.arc(x, y, 10, 0, Math.PI*2);
-    ctx.fillStyle = "#0095DD";
-    ctx.fill();
-    ctx.closePath();
-    x += dx;
-    y += dy;
-}</pre>
-
-<p><span id="result_box" lang="es"><span>Guarda el código de nuevo y pruébalo en tu navegador.</span> <span>Esto funciona bien, aunque parece que la bola está dejando un rastro detrás de ella:</span></span></p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10430/ball-trail.png" style="display: block; height: 320px; margin: 0px auto; width: 480px;"></p>
-
-<h2 id="Borrar_el_lienzo_antes_de_cada_fotograma">Borrar el  lienzo antes de cada fotograma</h2>
-
-<div id="gt-res-content">
-<div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr"><span id="result_box" lang="es"><span>La bola está dejando un rastro porque estamos pintando un nuevo círculo en cada fotograma sin borrar el anterior.</span> <span>No te preocupes, porque hay un método para borrar todo el contenido de lienzo: {{domxref ("CanvasRenderingContext2D.clearRect ()", "clearRect ()")}}.</span> <span>Este método tiene cuatro parámetros: las coordenadas x e y de la esquina superior izquierda de un rectángulo y las coordenadas x e y de la esquina inferior derecha de un rectángulo.</span> En todo el área definida por ese rectángulo se borrará cualquier cosa que se haya pintado antes<span>.</span></span></div>
-</div>
-
-<div id="gt-res-tools">
-<div id="gt-res-tools-l">
-<div id="gt-pb-star"> </div>
-</div>
-</div>
-
-<p>Añade la siguiente nueva línea resaltada a la función draw():</p>
-
-<pre class="brush: js; highlight:[2]">function draw() {
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-    ctx.beginPath();
-    ctx.arc(x, y, 10, 0, Math.PI*2);
-    ctx.fillStyle = "#0095DD";
-    ctx.fill();
-    ctx.closePath();
-    x += dx;
-    y += dy;
-}
-</pre>
-
-<p><span id="result_box" lang="es"><span>Guarda tu código y vuelve a probarlo. Esta vez verás el movimiento de la bola sin dejar rastro.</span> <span>Cada 10 milisegundos se borra todo el lienzo, se dibuja el círculo azul (nuestra pelota) en una posición determinada y los valores x e y se actualizan para el siguiente fotograma.</span></span></p>
-
-<h2 id="Limpiar_el_código">Limpiar el código</h2>
-
-<p><span id="result_box" lang="es"><span>Vamos a añadir más y más comandos a la función draw () en los próximos artículos, por lo que es bueno mantenerlo lo más simple y limpio posible.</span> <span>Comencemos moviendo el código de dibujo de la bola a una función separada.</span><br>
- <br>
- <span>Reemplaza la función draw() con las dos funciones siguientes:</span></span></p>
-
-<pre class="brush: js">function drawBall() {
-    ctx.beginPath();
-    ctx.arc(x, y, 10, 0, Math.PI*2);
-    ctx.fillStyle = "#0095DD";
-    ctx.fill();
-    ctx.closePath();
-}
-
-function draw() {
-    ctx.clearRect(0, 0, canvas.width, canvas.height);
-    drawBall();
-    x += dx;
-    y += dy;
-}</pre>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p><span id="result_box" lang="es"><span>Puedes comprobar el código terminado de este artículo en la demostración en vivo a continuación, y jugar con ella para entender mejor cómo funciona:</span></span></p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/3x5foxb1/","","415")}}</p>
-
-<div class="summary">
-<p>Ejercicio: intenta cambiar la velocidad de la bola en movimiento o la dirección hacia la que se mueve.</p>
-</div>
-
-<h2 id="Siguientes_pasos">Siguientes pasos</h2>
-
-<p>Hemos dibujado nuestra bola y hemos hecho que se mueva, pero cuando supera el borde del canvas, desaparece. En el tercer capítulo exploraremos como hacer que <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls">rebote en las paredes</a>.</p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Create_the_Canvas_and_draw_on_it", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Bounce_off_the_walls")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/terminando/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/terminando/index.html
deleted file mode 100644
index a3bd5e2c2e..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/terminando/index.html
+++ /dev/null
@@ -1,95 +0,0 @@
----
-title: Terminando
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Terminando
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Finishing_up
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<p>{{Previous("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
-
-<div class="summary">
-<p>Este es el último de los 10 pasos del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>. Puedes encontrar el código fuente tal y como quedará al terminar esta lección en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson10.html">Gamedev-Canvas-workshop/lesson10.html</a>.</p>
-</div>
-
-<p>Siempre es posible mejorar cualquier juego que hagamos. Por ejemplo, podemos dar vidas al jugador. Así, aunque pierda la bola una o dos veces, todavía puede intentar derribar todo el muro. También podemos mejorar los aspectos gráficos.</p>
-
-<h2 id="Dar_vidas_al_jugador">Dar vidas al jugador</h2>
-
-<p>Dar vidas es bastante sencillo. Primero, añade una variable para guardar el número de vidas que tiene en cada momento. Ponla después de las que ya tienes:</p>
-
-<pre class="brush: js">var lives = 3;</pre>
-
-<p>Mostrar por pantalla el número de vidas es prácticamente lo mismo que mostrar el contador de puntos. Añade la función siguiente detrás de la función <code>drawScore()</code>:</p>
-
-<pre class="brush: js">function drawLives() {
-    ctx.font = "16px Arial";
-    ctx.fillStyle = "#0095DD";
-    ctx.fillText("Lives: "+lives, canvas.width-65, 20);
-}</pre>
-
-<p>En lugar de terminar el juego inmediatamente, restaremos una vida hasta que ya no quede ninguna. También podemos colocar la bola y la paleta en la posición inicial cuando el jugador empiece con la vida siguiente. En la función <code style="font-style: normal; font-weight: normal;">draw()</code> cambia las dos líneas siguientes...</p>
-
-<pre class="brush: js">alert("GAME OVER");
-document.location.reload();</pre>
-
-<p>... por estas otras:</p>
-
-<pre class="brush: js">lives--;
-if(!lives) {
-    alert("GAME OVER");
-    document.location.reload();
-}
-else {
-    x = canvas.width/2;
-    y = canvas.height-30;
-    dx = 2;
-    dy = -2;
-    paddleX = (canvas.width-paddleWidth)/2;
-}</pre>
-
-<p>Ahora, cuando la bola toca el fondo, restamos una vida. Si no queda ninguna, el jugador pierde y termina la partida. Si queda alguna, entonces colocamos la bola y la paleta en el centro, y hacemos que la bola vaya en la nueva dirección correcta y a la velocidad inicial.</p>
-
-<h3 id="Sacar_por_pantalla_el_contador_de_vidas">Sacar por pantalla el contador de vidas</h3>
-
-<p>Tienes que añadir una llamada a <code>drawLives()</code> dentro de <code>draw()</code> debajo de la llamada a <code>drawScore():</code></p>
-
-<pre class="brush: js">drawLives();
-</pre>
-
-<h2 id="Mejorar_el_refresco_con_requestAnimationFrame()">Mejorar el refresco con requestAnimationFrame()</h2>
-
-<p>Ahora vamos a ocuparnos de algo que no es particular de este juego, sino de la forma en la que se muestran las imágenes en pantalla.</p>
-
-<p>{{domxref("window.requestAnimationFrame", "requestAnimationFrame")}} ayuda al navegador a refrescar la imagen mejor que con el método {{domxref("windowTimers.setInterval()", "setInterval()")}} que estamos utilizando. Cambia la línea siguiente...</p>
-
-<pre class="brush: js">setInterval(draw, 10);</pre>
-
-<p>...por esta otra:</p>
-
-<pre class="brush: js">draw();</pre>
-
-<p>Y, ahora, al final de la función draw(), justo antes de la llave que la cierra, añade la línea siguiente, que hará que la función <code>draw()</code> se llame a sí misma una y otra vez:</p>
-
-<pre class="brush: js">requestAnimationFrame(draw);</pre>
-
-<p>Ahora draw() se ejecuta una y otra vez con un bucle <code>requestAnimationFrame()</code> pero, en lugar de hacerlo cada 10 milisegundos, dejamos que sea el navegadro quien decida cada cuánto tiempo. El navegador sincronizará el refresco, es decir, el número de fotogramas por segundo, a lo que sea capaz la máquina que está ejecutando el juego. De este modo la animación será más eficiente y más suave que el viejo método <code>setInterval()</code>.</p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Ya hemos terminado. ¡La versión final del juego está lista para publicar!</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/9temh0ta/","","320")}}</p>
-
-<div class="note">
-<p><strong>Ejercicio</strong>: cambia el número de vidas y el ángulo de la trayectoria de la bola cuando golpea la paleta.</p>
-</div>
-
-<h2 id="Game_over_-_de_momento!">Game over - de momento!</h2>
-
-<p>Enhorabuena, has terminado todas las lecciones. Ya has aprendido las técnicas básicas de manipulación del &lt;canvas&gt; y la lógica que hay detrás de los juegos 2D sencillos.</p>
-
-<p>Ahora sería un buen momento para aprender a utilizar entornos de desarrollo (frameworks) y de continuar con el desarrollo de juegos. Puedes echar un vistazo a estas otra forma de realizar el mismo juego que has visto en <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/2D_breakout_game_Phaser">2D breakout game using Phaser</a>, o de echar un vistazo al tutorial <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">Cyber Orb built in Phaser</a>. También puedes leer el contenido de <a href="https://developer.mozilla.org/en/docs/Games">Games section on MDN</a> para inspirarte y seguir aprendiendo.</p>
-
-<p>También puedes volve al <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro">índice de este tutorial</a>. ¡Diviértete programando!</p>
-
-<p>{{Previous("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
diff --git a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/track_the_score_and_win/index.html b/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/track_the_score_and_win/index.html
deleted file mode 100644
index b67a730e94..0000000000
--- a/files/es/games/workflows/famoso_juego_2d_usando_javascript_puro/track_the_score_and_win/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: Poner un contador y terminar ganando
-slug: Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Track_the_score_and_win
-translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score_and_win
----
-<div>{{GamesSidebar}}</div><div>{{IncludeSubnav("/en-US/docs/Games")}}</div>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
-
-<div class="summary">
-<p>Este es el octavo capítulo de 10, del <a href="https://developer.mozilla.org/en-US/docs/Games/Workflows/Breakout_game_from_scratch">Gamedev Canvas tutorial</a>. Puedes encontrar el código fuente como debería quedar tras este capítulo en <a href="https://github.com/end3r/Gamedev-Canvas-workshop/blob/gh-pages/lesson08.html">Gamedev-Canvas-workshop/lesson8.html</a>.</p>
-</div>
-
-<p><span class="seoSummary">Destruir los ladrillos mola, pero para que el juego sea aún mejor, podría dar puntos cada vez que el jugador rompe un ladrillo, y mostrar un contador.</span></p>
-
-<h2 id="El_contador">El contador</h2>
-
-<p>Si puedes ver el contador mientras juegas, puede que consigas impresionar a tus amigos. Necesitas una variable para guardar el contador. Añade esto a tu JavaScript, después de las otras definiciones de variables:</p>
-
-<pre class="brush: js">var score = 0;</pre>
-
-<p>También necesitas una función <code>drawScore()</code> para enseñar el contador por pantalla. Añade esto después de la función <code>collisionDetection()</code>:</p>
-
-<pre class="brush: js">function drawScore() {
-    ctx.font = "16px Arial";
-    ctx.fillStyle = "#0095DD";
-    ctx.fillText("Score: "+score, 8, 20);
-}</pre>
-
-<p>Dibujar texto en el &lt;canvas&gt; es similar a dibujar un círculo o cualquier otra figura. La definición del tipo de letra (fuente) se hace igual que en CSS, puedes fijar el tamaño y fuente con el método {{domxref("CanvasRenderingContext2D.font","font()")}} method. Despúes utilizas {{domxref("CanvasRenderingContext2D.fillStyle()","fillStyle()")}} para fijar el color y {{domxref("CanvasRenderingContext2D.fillText","fillText()")}} para escribir el texto y el lugar en el que se va a dibujar. El primer parámetro es el texto en si y los otros dos son las coordenadas.</p>
-
-<p>Para sumar un punto cada vez que se rompe un ladrillo, añade la línea que está marcada aquí debajo:</p>
-
-<pre class="brush: js; highlight:[9]">function collisionDetection() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            var b = bricks[c][r];
-            if(b.status == 1) {
-                if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
-                    dy = -dy;
-                    b.status = 0;
-                    score++;
-                }
-            }
-        }
-    }
-}</pre>
-
-<p>Llamando a <code>drawScore()</code> (dibujar contador) desde la función <code>draw()</code> hace que se muestre el contador actualizado en la pantalla. Añade la línea siguiente en <code>draw()</code>, justo debajo de la llamada a <code>drawPaddle()</code>:</p>
-
-<pre class="brush: js">drawScore();</pre>
-
-<h2 id="Mostrar_un_mensaje_de_victoria_cuando_se_hayan_destruido_todos_los_ladrillos">Mostrar un mensaje de victoria cuando se hayan destruido todos los ladrillos</h2>
-
-<p>Lo de sumar puntos funciona, pero tiene un final. ¿Qué ocurrirá cuando no queden ladrillos? Precisamente ese es el principal objetivo del juego, tendrás que dibujar un mensaje de victoria. Añade las líneas marcadas a tu función <code>collisionDetection()</code>:</p>
-
-<pre class="brush: js; highlight:[10,11,12,13]">function collisionDetection() {
-    for(c=0; c&lt;brickColumnCount; c++) {
-        for(r=0; r&lt;brickRowCount; r++) {
-            var b = bricks[c][r];
-            if(b.status == 1) {
-                if(x &gt; b.x &amp;&amp; x &lt; b.x+brickWidth &amp;&amp; y &gt; b.y &amp;&amp; y &lt; b.y+brickHeight) {
-                    dy = -dy;
-                    b.status = 0;
-                    score++;
-                    if(score == brickRowCount*brickColumnCount) {
-                        alert("YOU WIN, CONGRATULATIONS!");
-                        document.location.reload();
-                    }
-                }
-            }
-        }
-    }
-}</pre>
-
-<p>Gracias a esto, los jugadores pueden ganar cuando rompen todos los ladrillos, que es muy importante. La función <code>document.location.reload()</code> vuelve a cargar la página y el juego empieza de nuevo, una vez se hace clic sobre el botón del alert().</p>
-
-<h2 id="Compara_tu_código">Compara tu código</h2>
-
-<p>Puedes comparar tu código con este:</p>
-
-<p>{{JSFiddleEmbed("https://jsfiddle.net/end3r/mvfkcydz/","","320")}}</p>
-
-<div class="note">
-<p><strong>Ejercicio</strong>: añade más puntos por ladrillo y muestra el contador cuando salga el alert() del final del juego con victoria.</p>
-</div>
-
-<h2 id="Pasos_siguientes">Pasos siguientes</h2>
-
-<p>El juego, ahora mismo, ya tiene buena pinta. En la siguiente lección conseguirás que sea más atractivo porque añadirás el <a href="https://developer.mozilla.org/es/docs/Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton">Control del ratón</a>.</p>
-
-<p>{{PreviousNext("Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Deteccion_colisiones", "Games/Workflows/Famoso_juego_2D_usando_JavaScript_puro/Controles_raton")}}</p>
diff --git a/files/es/games/workflows/html5_gamedev_phaser_device_orientation/index.html b/files/es/games/workflows/html5_gamedev_phaser_device_orientation/index.html
deleted file mode 100644
index 135193ec50..0000000000
--- a/files/es/games/workflows/html5_gamedev_phaser_device_orientation/index.html
+++ /dev/null
@@ -1,437 +0,0 @@
----
-title: >-
-  Introducción al Desarrollo de Juegos en HTML5 con Phaser y la API de
-  Orientación a Dispositivos
-slug: Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation
-tags:
-  - API Vibración
-  - API orientacion de dispositivos
-  - Canvas
-  - Desarrollo de videojuegos
-  - HTML5
-  - Phaser
-translation_of: Games/Tutorials/HTML5_Gamedev_Phaser_Device_Orientation
----
-<div>{{GamesSidebar}}</div><p>{{ draft() }}</p>
-
-<h2 id="Introducción">Introducción</h2>
-
-<p><span style="line-height: 1.5;">En este tutorial iremos a través del proceso de construcción de un juego en HTML5 para móviles que utilizará las <em>APIs</em> de <a href="https://developer.mozilla.org/en-US/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Orientación para Dispositivos</a> y <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/Vibration">Vibración</a> para mejorar la jugabilidad y estará construido utilizando el <em>framework</em> <a href="http://phaser.io/">Phaser</a>. Se recomienda tener conocimientos básicos de JavaScript para sacar mayor provecho a este tutorial.</span></p>
-
-<h2 id="Ejemplo"><span style="line-height: 1.5;">Ejemplo</span></h2>
-
-<p><span style="line-height: 1.5;">Al finalizar este tutorial tendrás un juego <em>demo</em> completamente funcional: <a href="http://orb.enclavegames.com/">Cyber Orb</a>. Se verá más o menos así:</span></p>
-
-<p><span style="line-height: 1.5;"><img alt="" src="https://mdn.mozillademos.org/files/10297/cyber-orb.png" style="display: block; height: 450px; margin: 0px auto; width: 300px;"></span></p>
-
-<h2 id="Phaser_framework">Phaser framework</h2>
-
-<p><a href="http://phaser.io/">Phaser</a> es un <em>framework</em> para construir juegos, de móvil o escritorio, en HTML5 . Es nuevo pero está creciendo velozmente gracias a la apasionada comunidad involucrada en el proceso de desarrollo. Puedes chequearlo <a href="https://github.com/photonstorm/phaser">en GitHub</a> donde se encuentra como <em>open source. </em>Lee <a href="http://docs.phaser.io/">la documentación</a> en línea y recorre su gran colección de <a href="http://examples.phaser.io/">ejemplos</a>. El <em>framework</em> Phaser provee una serie de herramientas que acelerarán el desarrollo y te ayudaran a manejar las tareas genéricas necesarias para completar tu juego, para que así puedas concentrarte en la idea del juego en sí.</p>
-
-<h2 id="Empezando_con_el_proyecto">Empezando con el proyecto</h2>
-
-<p>Puedes ver <a href="https://github.com/EnclaveGames/Cyber-Orb">el código fuente de Cyber Orb</a> en GitHub. <span style="line-height: 1.5;">La estructura de carpetas no es nada complicada: </span><span style="line-height: 1.5;">el punto de partida es el archivo </span><code>index.html</code><span style="line-height: 1.5;"> donde inicializaremos el <em>framework</em> y </span><span style="line-height: 1.5;">configuraremos el canvas donde correrá el juego.</span></p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10357/cyber-orb-github.png" style="display: block; height: 423px; width: 620px;"></p>
-
-<p><span style="line-height: 1.5;">Puedes hacer clic en el archivo index desde tu navegador favorito para iniciar el juego y probarlo. </span><span style="line-height: 1.5;">También hay tres carpetas en el directorio: </span></p>
-
-<ul>
- <li><span style="line-height: 1.5;"><code>img</code></span>: Todas las imágenes que usaremos en el juego.</li>
- <li><span style="line-height: 1.5;"><code>src</code></span>: Los archivos JavaScript que contienen todo el código fuente del juego definido dentro.</li>
- <li><span style="line-height: 1.5;"><code>audio</code>:</span> Los archivos de sonido usados en el juego.</li>
-</ul>
-
-<h2 id="Configurando_el_canvas">Configurando el canvas</h2>
-
-<p>Vamos a renderizar nuestro juego sobre el elemento <code>&lt;canvas&gt;</code>, pero no lo haremos manualmente  — de esto se ocupará el <em>framework. </em> Vamos a configurarlo: nuestro punto de partida es el archivo <code>index.html</code> con el siguiente contenido. Puedes crearlo tú mismo si quieres hacer un seguimiento más detallado:</p>
-
-<pre class="brush: html">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-    &lt;meta charset="utf-8" /&gt;
-    &lt;title&gt;Cyber Orb&lt;/title&gt;
-    &lt;style&gt; body { margin: 0; background: #333; } &lt;/style&gt;
-    &lt;script src="src/phaser.min.js"&gt;&lt;/script&gt;
-    &lt;script src="src/Boot.js"&gt;&lt;/script&gt;
-    &lt;script src="src/Preloader.js"&gt;&lt;/script&gt;
-    &lt;script src="src/MainMenu.js"&gt;&lt;/script&gt;
-    &lt;script src="src/Game.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
-&lt;script&gt;
-(function() {
-    var game = new Phaser.Game(320, 480, Phaser.CANVAS, 'game');
-    game.state.add('Boot', Ball.Boot);
-    game.state.add('Preloader', Ball.Preloader);
-    game.state.add('MainMenu', Ball.MainMenu);
-    game.state.add('Game', Ball.Game);
-    game.state.start('Boot');
-})();
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p><span style="line-height: 1.5;">Hasta ahora tenemos una simple página web </span><code>HTML</code><span style="line-height: 1.5;"> con el contenido básico en la sección </span><code>&lt;head&gt;</code><span style="line-height: 1.5;">: configuración de caracteres, título, estilo y las inclusión de los archivos JavaScripts. El </span><code>&lt;body&gt;</code><span style="line-height: 1.5;"> contiene la inicialización del framework Phaser y las definiciones del estado del juego.</span></p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> game <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Phaser<span class="punctuation token">.</span>Game</span><span class="punctuation token">(</span><span class="number token">320</span><span class="punctuation token">,</span> <span class="number token">480</span><span class="punctuation token">,</span> Phaser<span class="punctuation token">.</span>CANVAS<span class="punctuation token">,</span> <span class="string token">'game'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>La linea de arriba inicializará la intancia de Phaser — los argumentos son el ancho del <code>&lt;canvas&gt;</code>, su altura, el método de renderizado (estamos utilizando <code>CANVAS</code> pero también existen disponibles las opciones <code>WEBGL</code> y <code>AUTO</code>) y el ID opcional del contenedor DOM en el que queremos poner el <code>&lt;canvas&gt;</code>. Si no hay nada especificado en el último argumento o el elemento no es encontrado, el <code>&lt;canvas&gt;</code> será añadido a la etiqueta <code>&lt;body&gt;</code>. Sin el <em>framework </em>para añadir el elemento canvas hubieses tenido que escribir algo como esto dentro de la etiqueta <code>&lt;body&gt;</code>:</p>
-
-<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>canvas</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">'</span>game<span class="punctuation token">'</span></span> <span class="attr-name token">width</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">'</span>320<span class="punctuation token">'</span></span> <span class="attr-name token">height</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">'</span>480<span class="punctuation token">'</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>canvas</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<p>Es importante recordar que el <em>framework</em> está montando métodos útiles para acelerar un montón de cosas como la manipulación de imagenes o la administración de elementos, que serían más difíciles si tuvieramos que hacerlo manualmente.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes leer este artículo: "<a href="http://gamedevelopment.tutsplus.com/tutorials/getting-started-with-phaser-building-monster-wants-candy--cms-21723">Building Monster Wants Candy</a>" para una introducción en profundidad a las funciones y métodos específicos de Phaser.</p>
-</div>
-
-<p>Volviendo a los estados del juego: La linea de abajo añade un nuevo estado al juego llamado <code>Boot</code>:</p>
-
-<pre class="brush: js"><code class="language-html">game.state.add('Boot', Ball.Boot);</code></pre>
-
-<p>El primer valor es el nombre del estado, el segundo es el objeto al que queremos asignárselo. El metodo <code>start</code> está iniciando el estado dado y haciendolo activo. Veamos qué es lo que son los estados realmente.</p>
-
-<pre class="brush: html"> </pre>
-
-<h2 id="Gestionando_los_estados_de_juego">Gestionando los estados de juego</h2>
-
-<p>Los estados en Phaser son partes separadas de la lógica del juego, en nuestro caso los estamos cargando de archivos JavaScript independientes para un mejor mantenimiento. En este juego tenemos estados básicos: <code>Boot</code>, <code>Preloader</code>, <code>MainMenu</code>, <code>Howto</code> y <code>Game</code>. <code>Boot</code> se hará cargo de la inicialización de algunas opciones de configuración, <code>Preloader</code> cargará todos los elementos utilizados como los gráficos y el audio, <code>MainMenu</code> es el menu con el botón de inicio, <code>Howto</code> muestra las intrucciones de cómo jugar y el estado <code>Game</code> es el que finalmente te permite jugar el juego. Veamos rapidamente el contenido de esos estados.</p>
-
-<h3 id="Boot.js">Boot.js</h3>
-
-<p>El estado <code>Boot</code> es el primero en el juego.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> Ball <span class="operator token">=</span> <span class="punctuation token">{</span>
-    _WIDTH<span class="punctuation token">:</span> <span class="number token">320</span><span class="punctuation token">,</span>
-    _HEIGHT<span class="punctuation token">:</span> <span class="number token">480</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span>
-Ball<span class="punctuation token">.</span>Boot <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-Ball<span class="punctuation token">.</span>Boot<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
-    preload<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">image</span><span class="punctuation token">(</span><span class="string token">'preloaderBg'</span><span class="punctuation token">,</span> <span class="string token">'img/loading-bg.png'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">image</span><span class="punctuation token">(</span><span class="string token">'preloaderBar'</span><span class="punctuation token">,</span> <span class="string token">'img/loading-bar.png'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span><span class="punctuation token">,</span>
-    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>scale<span class="punctuation token">.</span>scaleMode <span class="operator token">=</span> Phaser<span class="punctuation token">.</span>ScaleManager<span class="punctuation token">.</span>SHOW_ALL<span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>scale<span class="punctuation token">.</span>pageAlignHorizontally <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>scale<span class="punctuation token">.</span>pageAlignVertically <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'Preloader'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
-
-<p>El objeto principal <code>Ball</code> es definido y estamos añadiendo dos variables llamadas <code>_WIDTH</code> y <code>_HEIGHT</code> esos seran el ancho y la altura del canvas de nuestro juego, respectivamente — nos ayudarán a posicionar los elementos en la pantalla. Estamos cargando dos imagenes primero que serán usadas después en el estado <code>Preload</code> para mostrar el progreso de la carga de los demás elementos. La función <code>create</code> contiene algunas de las configuraciones básicas: estamos configurando la escala y la alineación del canvas, y avanzando al estado <code>Preload</code> cuando todo este listo.</p>
-
-<h3 id="Preloader.js">Preloader.js</h3>
-
-<p>El estado <code>Preloader</code> se ocupa de cargar todos los elementos:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">Ball<span class="punctuation token">.</span>Preloader <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-Ball<span class="punctuation token">.</span>Preloader<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
-    preload<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>preloadBg <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span><span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_WIDTH<span class="number token">-297</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_HEIGHT<span class="number token">-145</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="string token">'preloaderBg'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>preloadBar <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span><span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_WIDTH<span class="number token">-158</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_HEIGHT<span class="number token">-50</span><span class="punctuation token">)</span><span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="string token">'preloaderBar'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">setPreloadSprite</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>preloadBar<span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">image</span><span class="punctuation token">(</span><span class="string token">'ball'</span><span class="punctuation token">,</span> <span class="string token">'img/ball.png'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="comment token">// ...</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">spritesheet</span><span class="punctuation token">(</span><span class="string token">'button-start'</span><span class="punctuation token">,</span> <span class="string token">'img/button-start.png'</span><span class="punctuation token">,</span> <span class="number token">146</span><span class="punctuation token">,</span> <span class="number token">51</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="comment token">// ...</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>load<span class="punctuation token">.</span><span class="function token">audio</span><span class="punctuation token">(</span><span class="string token">'audio-bounce'</span><span class="punctuation token">,</span> <span class="punctuation token">[</span><span class="string token">'audio/bounce.ogg'</span><span class="punctuation token">,</span> <span class="string token">'audio/bounce.mp3'</span><span class="punctuation token">,</span> <span class="string token">'audio/bounce.m4a'</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span><span class="punctuation token">,</span>
-    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'MainMenu'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
-
-<p>Para crear un nuevo botón tenemos el método <code>add.button</code> con la siguiente lista de argumentos opcionales:</p>
-
-<ul>
- <li>Posición absoluta superior del canvas, en pixeles.</li>
- <li>Posición absoluta izquierda del canvas, en pixeles.</li>
- <li>Nombre del elemento imagen utilizado por el botón.</li>
- <li>Función que será ejecutada cuando alguien haga click sobre el botón.</li>
- <li>El contexto de la ejecución.</li>
- <li>Cuadro (<em>frame) </em>del elemento imagen utilizado para el estado 'hover' del botón (cuando el mouse se encuentra sobre él).</li>
- <li>Cuadro (<em>frame)</em> del elemento imagen utilizado para el estado 'normal' o 'out' del botón.</li>
- <li>Cuadro (<em>frame) </em>del elemento imagen utilizado para el 'click' o 'down' del botón.</li>
-</ul>
-
-<p>El <code>anchor.set</code> colocará el punto de ancla en el botón con el cual se realizarán y aplicarán todos los cálculos de posición para el botón. En nuestro caso, está anclado a la mitad del borde izquierdo y al comienzo del borde superior, para así centrarlo de manera horizontal facilmente, sin necesidad de saber su ancho.</p>
-
-<p>Cuando el boton de inicio es presionado, en lugar de saltar directamente a la acción, el juego mostrará la pantalla con las intrucciones para jugar.</p>
-
-<h3 id="Howto.js">Howto.js</h3>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">Ball<span class="punctuation token">.</span>Howto <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span>
-Ball<span class="punctuation token">.</span>Howto<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
-    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>buttonContinue <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">button</span><span class="punctuation token">(</span><span class="number token">0</span><span class="punctuation token">,</span> <span class="number token">0</span><span class="punctuation token">,</span> <span class="string token">'screen-howtoplay'</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>startGame<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span><span class="punctuation token">,</span>
-    startGame<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'Game'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
-
-<p>El estado <code>Howto</code> muesta las intrucciones de juego en la pantalla antes de comenzar el juego. Luego de clickear la pantalla el juego es lanzado.</p>
-
-<h3 id="Game.js">Game.js</h3>
-
-<p>El estado <code>Game</code> del archivo <code>Game.js</code> es donde ocurre toda la magia. Todas las inicializaciones estan en la función <code>create()</code> (que se lanza una vez al comienzo del juego). Luego de eso, algunas funcionalidades requeriran más código para controlar — escribiremos nuestras propias funciones para manejar tareas más complicadas. En particular, toma nota de la función <code>update()</code> que es ejecutada en cada <em>frame </em>y actualiza cosas como la posición de la pelota.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">Ball<span class="punctuation token">.</span>Game <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>game<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-Ball<span class="punctuation token">.</span>Game<span class="punctuation token">.</span>prototype <span class="operator token">=</span> <span class="punctuation token">{</span>
-    create<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    initLevels<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    showLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span>level<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    updateCounter<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    managePause<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    manageAudio<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    update<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    wallCollision<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    handleOrientation<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span><span class="punctuation token">,</span>
-    finishLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span><span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre>
-
-<p>Las funciones <code>create</code> y <code>update</code> son específicas del <em>framework</em>, mientras que otras seran nuestras propias creaciones:</p>
-
-<ul>
- <li><code>initLevels</code> inicializa los datos del nivel.</li>
- <li><code>showLevel</code> imprime los datos del nivel en la pantalla.</li>
- <li><code>updateCounter</code> actualiza el tiempo dedicado a jugar cada nivel y registra el tiempo total dedicado al juego.</li>
- <li><code>managePause</code> pausa y reanuda el juego.</li>
- <li><code>manageAudio</code> enciende y apaga el audio.</li>
- <li><code>wallCollision</code> es ejecutado cuando la pelota golpea las paredes u otros objetos.</li>
- <li><code>handleOrientation</code> es la función ligada al evento responsable por la API de orientación de dispositivo, proporciona los controles de movimiento cuando el juego es ejecutado en un dispositivo móvil con el hardware apropiado.</li>
- <li><code>finishLevel</code> carga un nuevo nivel cuando se completa el nivel actual, o termina el juego si se completa el nivel final.</li>
-</ul>
-
-<h4 id="Agregando_la_pelota_y_sus_mecanismos_de_movimiento">Agregando la pelota y sus mecanismos de movimiento</h4>
-
-<p>Primero vamos a ir a la función <code>create()</code>, inicializamos el objeto <code>ball</code> y le asignamos unas cuantas propiedades:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>ball <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>x<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>y<span class="punctuation token">,</span> <span class="string token">'ball'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>anchor<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">(</span><span class="number token">0.5</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span><span class="function token">enable</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> Phaser<span class="punctuation token">.</span>Physics<span class="punctuation token">.</span>ARCADE<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">setSize</span><span class="punctuation token">(</span><span class="number token">18</span><span class="punctuation token">,</span> <span class="number token">18</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>bounce<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">(</span><span class="number token">0.3</span><span class="punctuation token">,</span> <span class="number token">0.3</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Aqui estamos agregando un sprite en un lugar de la pantalla y utilizando la imagen de la pelota de los elementos gráficos ya cargados. También estamos configurando el <code>anchor</code> (ancla) que realizará los cálculos de física para el centro de la pelota, habilitando el motor de físicas Arcade (que manejara todas las físicas para el movimiento de la pelota), y estableciendo el tamaño del cuerpo para la detección de colisiones. La propiedad <code>bounce</code> es utilizada para configurar el 'rebote' de la pelota cuando golpea los obstaculos.</p>
-
-<h4 id="Controlando_la_pelota">Controlando la pelota</h4>
-
-<p>Es genial tener lista la pelota para poder lanzarla en la zona del juego, pero también es importante poder realmente moverla! Ahora vamos a añadir la capacidad de controlar con el teclado la pelota en los dispositivos de escritorio, y luego pasaremos a la implementación de la API de Orientación de Dispositivo. Vamos a enfocarnos en el teclado primero añadiendo lo siguiente a la función <code>create()</code>:</p>
-
-<pre class="brush: js">this.keys = this.game.input.keyboard.createCursorKeys();</pre>
-
-<p>Como puedes ver, hay una función especial de Phaser llamada <code>createCursorKeys()</code> que nos dará un objeto con controladores de evento para las cuatro teclas de flecha, que nos permitira jugar con: arriba, abajo, izquierda y derecha.</p>
-
-<p>A continuación añadiremos el siguiente código a la función <code>update()</code>, para que sea ejecutado en cada <em>frame</em>. El objeto <code>this.keys</code> será chequeado con el input del jugador (las teclas que presione por ejemplo) así la pelota podrá reaccionar acorde, con una fuerza predefinida:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>left<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">-</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-<span class="keyword token">else</span> <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>right<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-<span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>up<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">-</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-<span class="keyword token">else</span> <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>keys<span class="punctuation token">.</span>down<span class="punctuation token">.</span>isDown<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>movementForce<span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<p>De esa manera podemos verificar qué tecla es presionada en determinado <em>frame</em> y aplicar la fuerza definida a la pelota, así aumentar la velocidad en la dirección correcta.</p>
-
-<h4 id="Implementando_la_API_de_Orientación_del_Dispositivo">Implementando la API de Orientación del Dispositivo</h4>
-
-<p>Probablemente la parte más interesante del juego es que utiliza la API de Orientación para Dispositivos móviles. Gracias a esto puedes jugar el juego inclinando el dispositivo en la dirección que quieres que la pelota ruede. Aquí está el código de la función <code>create()</code><em> </em>responsable por esto:</p>
-
-<pre class="brush: js">window.addEventListener("deviceorientation", this.handleOrientation, true);</pre>
-
-<p>Vamos a añadir un detector de eventos al evento "<code>deviceorientation</code>" y vincularlo a la función <code>handleOrientation</code>, se ve como esto:</p>
-
-<pre class="brush: js">handleOrientation: function(e) {
-    var x = e.gamma;
-    var y = e.beta;
-<code class="language-js">    Ball<span class="punctuation token">.</span>_player<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">+</span><span class="operator token">=</span> x<span class="punctuation token">;</span>
-    Ball<span class="punctuation token">.</span>_player<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">+</span><span class="operator token">=</span> y<span class="punctuation token">;</span></code>
-}</pre>
-
-<p><span style="line-height: 1.5;">Mientras más inclines el dispositivo, más fuerza se aplica a la pelota y la velocidad en la que se mueve es mayor.</span></p>
-
-<p><span style="line-height: 1.5;"><img alt="" src="https://mdn.mozillademos.org/files/10369/cyber-orb-flame-orientation.png"></span></p>
-
-<div class="note">
-<p><span style="line-height: 1.5;"><strong>Nota</strong>: Para encontrar más sobre implementar la orientación de los dispositivos y cómo se vé en código crudo, lee </span> <a href="https://developer.mozilla.org/en-US/Apps/Build/gather_and_modify_data/responding_to_device_orientation_changes">Keep it level: responding to device orientation changes</a>.</p>
-</div>
-
-<h4 id="Añadiendo_el_agujero">Añadiendo el agujero</h4>
-
-<p>El principal objetivo del juego es mover la pelota desde la posición inicial a la posición final: un agujero en el suelo. Esta implementación es muy similar a la parte anterior en donde creamos la pelota, y también es añadida en la función <code>create()</code> de nuestro estado <code>Game</code>:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>hole <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">sprite</span><span class="punctuation token">(</span>Ball<span class="punctuation token">.</span>_WIDTH<span class="operator token">*</span><span class="number token">0.5</span><span class="punctuation token">,</span> <span class="number token">90</span><span class="punctuation token">,</span> <span class="string token">'hole'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span><span class="function token">enable</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">,</span> Phaser<span class="punctuation token">.</span>Physics<span class="punctuation token">.</span>ARCADE<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">.</span>anchor<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">(</span><span class="number token">0.5</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">setSize</span><span class="punctuation token">(</span><span class="number token">2</span><span class="punctuation token">,</span> <span class="number token">2</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>La diferencia está en que el cuerpo del agujero se configura como inamovible por lo que no se moverá cuando acertamos con la pelota y tendrá calculada la detección de colisión (esto se tratará más adelante en este artículo).</p>
-
-<h4 id="Construyendo_el_laberinto_de_bloques"><strong>Construyendo el laberinto de bloques</strong></h4>
-
-<p>Para hacer más difícil el juego, y más interesante, añadiremos algunos obstaculos entre la pelota y la sálida. Podríamos usar un editor de niveles pero por motivo de este tutorial, vamos a crear algo nosotros mismos.</p>
-
-<p>Para contener el bloque de información usaremos un <em>array</em> con los datos de nivel: para cada bloque almacenaremos las posiciones abolutas izquierda y superior en pixeles (<strong>x </strong>e <strong>y</strong>) y el tipo de bloque: horizontal o vertical (<code>t</code> con el valor <code>'w'</code> para el ancho, y <code>'h'</code> para la altura). Luego, para cargar el nivel analizaremos los datos y mostraremos los bloques especificos para ese nivel. En la función <code>initLevels</code> tenemos:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>levelData <span class="operator token">=</span> <span class="punctuation token">[</span>
-    <span class="punctuation token">[</span>
-        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">96</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">224</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'w'</span> <span class="punctuation token">}</span>
-    <span class="punctuation token">]</span><span class="punctuation token">,</span>
-    <span class="punctuation token">[</span>
-        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">72</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">320</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'w'</span> <span class="punctuation token">}</span><span class="punctuation token">,</span>
-        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">200</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">320</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'h'</span> <span class="punctuation token">}</span><span class="punctuation token">,</span>
-        <span class="punctuation token">{</span> x<span class="punctuation token">:</span> <span class="number token">72</span><span class="punctuation token">,</span> y<span class="punctuation token">:</span> <span class="number token">150</span><span class="punctuation token">,</span> t<span class="punctuation token">:</span> <span class="string token">'w'</span> <span class="punctuation token">}</span>
-    <span class="punctuation token">]</span><span class="punctuation token">,</span>
-    <span class="comment token">// ...</span>
-<span class="punctuation token">]</span><span class="punctuation token">;</span></code></pre>
-
-<p>Todos los elementos del <em>array</em> contienen una colección de bloques con una posición <code>x</code> e <code>y</code> y un valor <code>t</code> para cada uno. Luego de <code>levelData</code> pero dentro de la función <code>initLevels</code>, añadiremos los bloques dentro de un <em>array</em> en el loop <code>for</code> usando algunos de los métodos específicos del <em>framework</em>:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">for</span><span class="punctuation token">(</span><span class="keyword token">var</span> i<span class="operator token">=</span><span class="number token">0</span><span class="punctuation token">;</span> i<span class="operator token">&lt;</span><span class="keyword token">this</span><span class="punctuation token">.</span>maxLevels<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">var</span> newLevel <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">group</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    newLevel<span class="punctuation token">.</span>enableBody <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
-    newLevel<span class="punctuation token">.</span>physicsBodyType <span class="operator token">=</span> Phaser<span class="punctuation token">.</span>Physics<span class="punctuation token">.</span>ARCADE<span class="punctuation token">;</span>
-    <span class="keyword token">for</span><span class="punctuation token">(</span><span class="keyword token">var</span> e<span class="operator token">=</span><span class="number token">0</span><span class="punctuation token">;</span> e<span class="operator token">&lt;</span><span class="keyword token">this</span><span class="punctuation token">.</span>levelData<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">.</span>length<span class="punctuation token">;</span> e<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">var</span> item <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>levelData<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">[</span>e<span class="punctuation token">]</span><span class="punctuation token">;</span>
-        newLevel<span class="punctuation token">.</span><span class="function token">create</span><span class="punctuation token">(</span>item<span class="punctuation token">.</span>x<span class="punctuation token">,</span> item<span class="punctuation token">.</span>y<span class="punctuation token">,</span> <span class="string token">'element-'</span><span class="operator token">+</span>item<span class="punctuation token">.</span>t<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    newLevel<span class="punctuation token">.</span><span class="function token">setAll</span><span class="punctuation token">(</span><span class="string token">'body.immovable'</span><span class="punctuation token">,</span> <span class="keyword token">true</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    newLevel<span class="punctuation token">.</span>visible <span class="operator token">=</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">.</span><span class="function token">push</span><span class="punctuation token">(</span>newLevel<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<p>Primero, <code>add.group()</code> es usado para crear un nuevo grupo de items. Luego, el <em>body tipe</em> <code>ARCADE</code> se configura para permitir los cálculos de física. El método <code>newLevel.create</code> crea nuevos items en el grupo con posiciones superior e izquierda iniciales y su propia imagen. Si no quieres recorrer nuevamente la lista de elementos para agregar una propiedad a cada uno explicitamente, puedes usar <code>setAll</code> en un grupo para aplicarlo a todos los items en ese grupo.</p>
-
-<p>Los objetos son almacenados en el <em>array</em> <code>this.levels</code>, el cual es por defecto invisible. Para cargar niveles específicos, nos aseguramos de que los niveles previos esten escondidos, y mostramos el nivel actual:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">showLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span>level<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">var</span> lvl <span class="operator token">=</span> level <span class="operator token">|</span> <span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="punctuation token">;</span>
-    <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span>lvl<span class="number token">-2</span><span class="punctuation token">]</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span>lvl<span class="number token">-2</span><span class="punctuation token">]</span><span class="punctuation token">.</span>visible <span class="operator token">=</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span>lvl<span class="number token">-1</span><span class="punctuation token">]</span><span class="punctuation token">.</span>visible <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<p>Gracias a eso el juego da al jugador un reto: ahora tiene que rodar la pelota a través del área de juego y guiarla por el laberinto construido por bloques. Es solo un ejemplo de cargar los niveles, y solo hay 5 puramente para mostrar la idea, pero podés trabajar en expandirlo por tu cuenta.</p>
-
-<h4 id="Detección_de_colisión"><strong>Detección de colisión</strong></h4>
-
-<p>Hasta este punto tenemos la pelota, que puede ser controlada por el jugador, el agujero que se tiene que alcanzar y los obstáculos que bloquean el camino. <span style="line-height: 1.5;">Sin embargo, hay un problema: nuestro juego todavía no tiene ninguna detección de colisiones, así que no sucede nada cuando la pelota golpea los bloques, sólo los atraviesa. Vamos a arreglarlo! La buena noticia es que el <em>framework</em> se ocupará de calcular la detección de colisones, nosotros sólo debemos especificar los objetos con los que colisionará en la función <code>update()</code>:</span></p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span>arcade<span class="punctuation token">.</span><span class="function token">collide</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>borderGroup<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>wallCollision<span class="punctuation token">,</span> <span class="keyword token">null</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span>arcade<span class="punctuation token">.</span><span class="function token">collide</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>levels<span class="punctuation token">[</span><span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="number token">-1</span><span class="punctuation token">]</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>wallCollision<span class="punctuation token">,</span> <span class="keyword token">null</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Esto le dirá al <em>framework</em> que ejecute la función <code>wallCollision</code> cuando la pelota golpee cualquiera de las paredes. Podemos usar la función <code>wallCollision</code> para añadir cualquier funcionalidad que querramos, como por ejemplo agregar el sonido de rebote e implementar la <strong>API de Vibración</strong>.</p>
-
-<p><span style="line-height: 1.5;">También debemos volver al objeto pelota y limitarlo a moverse sólo en la zona visible, para que no salga de la pantalla. Hay una función muy útil en Phaser que se llama </span><code style="font-style: normal; line-height: 1.5;">collideWorldBounds</code><span style="line-height: 1.5;">:</span></p>
-
-<pre class="brush: js">ball.body.collideWorldBounds = true;</pre>
-
-<p>Hace exactamente lo que necesitamos: ahora la pelota rebotará en los bordes de la pantalla como de las paredes.</p>
-
-<h4 id="Añadiendo_el_sonido">Añadiendo el sonido</h4>
-
-<p>Entre los elementos precargados hay una pista de audio (en varios formatos para asegurar la compatibilidad con el navegador), que podremos usar ahora. Debe primero ser definida en la función <code>create()</code>:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>bounceSound <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">audio</span><span class="punctuation token">(</span><span class="string token">'audio-bounce'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p><span class="punctuation token">Si el estado del audio es <code>true</code> (es decir que el sonido del juego está activado)</span> podremos reproducirlo en la función <code>wallCollision</code>:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>audioStatus<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>bounceSound<span class="punctuation token">.</span><span class="function token">play</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<p>Eso es todo: cargar y reproducir sonidos es sencillo con Phaser.</p>
-
-<h4 id="Implementando_la_API_de_Vibración">Implementando la API de Vibración</h4>
-
-<p>Cuando la detección de colisión funcione como es esperado, añadamos algunos efectos especiales con la ayuda de la API de Vibración.<img alt="" src="https://mdn.mozillademos.org/files/10371/cyber-orb-flame-vibration.png"></p>
-
-<p>La mejor forma de usarla en nuestro caso es haciendo que el teléfono vibre cada vez que la pelota golpee las paredes: dentro de la función <code>wallCollision</code>:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">if</span><span class="punctuation token">(</span><span class="string token">"vibrate"</span> <span class="keyword token">in</span> window<span class="punctuation token">.</span>navigator<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    window<span class="punctuation token">.</span>navigator<span class="punctuation token">.</span><span class="function token">vibrate</span><span class="punctuation token">(</span><span class="number token">100</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<p><span class="punctuation token">Si el método <code>vibrate</code> es soportado por el navegador y está disponible en el objeto <code>window.navigator</code>, hará vibrar al telefono por 100 milisegundos. Eso es todo!</span></p>
-
-<h4 id="Añadiendo_el_tiempo_transcurrido">Añadiendo el tiempo transcurrido</h4>
-
-<p>Para mejorar la re-jugabilidad y dar a los jugadores la opción de competir entre ellos, almacenaremos el tiempo transcurrido: los jugadores entonces intentaran mejorar su tiempo de finalizacion. Para implementar esto en el juego tenemos que crear una variable para almacenar el número actual de segundos transcurrido desde el inicio del juego y mostrarselo al jugador durante el juego. Definamos primero las variables en la función <code>create</code>:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>timer <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> <span class="comment token">// time elapsed in the current level</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> <span class="comment token">// time elapsed in the whole game</span></code></pre>
-
-<p>Luego, podemos inicializar los objetos de texto necesarios para mostrar la información al usuario:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>timerText <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">text</span><span class="punctuation token">(</span><span class="number token">15</span><span class="punctuation token">,</span> <span class="number token">15</span><span class="punctuation token">,</span> <span class="string token">"Time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>fontBig<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">this</span><span class="punctuation token">.</span>totalTimeText <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>add<span class="punctuation token">.</span><span class="function token">text</span><span class="punctuation token">(</span><span class="number token">120</span><span class="punctuation token">,</span> <span class="number token">30</span><span class="punctuation token">,</span> <span class="string token">"Total time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>fontSmall<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Estamos definiendo la posición superior e izquierda del texto, el contenido que se muestra y el estilo aplicado al texto. Lo hemos impreso en pantalla, pero sería bueno actualizar los valores cada segundo:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>time<span class="punctuation token">.</span>events<span class="punctuation token">.</span><span class="function token">loop</span><span class="punctuation token">(</span>Phaser<span class="punctuation token">.</span>Timer<span class="punctuation token">.</span>SECOND<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>updateCounter<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Este bucle, también en la función <code>create</code>, ejecutará la función <code>updateCounter</code> cada segundo desde el comienzo del juego, así podemos aplicar los cambios acordes. Así es como se ve la función <code>updateCounter</code> completa:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">updateCounter<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="operator token">++</span><span class="punctuation token">;</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>timerText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimeText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Total time: "</span><span class="operator token">+</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span><span class="punctuation token">,</span></code></pre>
-
-<p>Como puedes ver estamos incrementando la variable <code>this.timer</code> y actualizando el contenido del objeto de texto con el valor actual en cada iteración, por lo que el jugador verá el tiempo transcurrido.</p>
-
-<h4 id="Terminando_el_nivel_y_el_juego">Terminando el nivel y el juego</h4>
-
-<p>La pelota está rodando en la pantalla, el temporizador funciona y tenemos el agujero al que tenemos que llegar. Vamos a configurar la posibilidad de finalizar el juego! La siguiente linea en la funcion <code>update()</code> añade un detector que se activa cuando la pelota llega al agujero.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">this</span><span class="punctuation token">.</span>physics<span class="punctuation token">.</span>arcade<span class="punctuation token">.</span><span class="function token">overlap</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>hole<span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">.</span>finishLevel<span class="punctuation token">,</span> <span class="keyword token">null</span><span class="punctuation token">,</span> <span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Esto funciona de manera similar al método <code>colide</code> explicado anteriormente. Cuando la pelota se superpone con el agujero (en lugar de colisionar), la función <code>finishLevel</code> es ejecutada:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">finishLevel<span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">if</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>level <span class="operator token">&gt;=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>maxLevels<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">;</span>
-        <span class="function token">alert</span><span class="punctuation token">(</span><span class="string token">'Congratulations, game completed!\nTotal time of play: '</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="operator token">+</span><span class="string token">' seconds!'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>game<span class="punctuation token">.</span>state<span class="punctuation token">.</span><span class="function token">start</span><span class="punctuation token">(</span><span class="string token">'MainMenu'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">else</span> <span class="punctuation token">{</span>
-        <span class="function token">alert</span><span class="punctuation token">(</span><span class="string token">'Congratulations, level '</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="operator token">+</span><span class="string token">' completed!'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer <span class="operator token">+</span><span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>timer <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="operator token">++</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>timerText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>timer<span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>totalTimeText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Total time: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>totalTimer<span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>levelText<span class="punctuation token">.</span><span class="function token">setText</span><span class="punctuation token">(</span><span class="string token">"Level: "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>level<span class="operator token">+</span><span class="string token">" / "</span><span class="operator token">+</span><span class="keyword token">this</span><span class="punctuation token">.</span>maxLevels<span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>x <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>x<span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>y <span class="operator token">=</span> <span class="keyword token">this</span><span class="punctuation token">.</span>ballStartPos<span class="punctuation token">.</span>y<span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>x <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>ball<span class="punctuation token">.</span>body<span class="punctuation token">.</span>velocity<span class="punctuation token">.</span>y <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">showLevel</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">,</span></code></pre>
-
-<p>Si el nivel actual es igual al maximo número de niveles (5, en este caso), entonces el juego termina: recibiras un mensaje de felicitación junto con el numero de segundas transcurridos durante todo el juego, y un botoón para presionar que te llevará al menú principal.</p>
-
-<p>Si el nivel actual es menor que 5, todas las variables necesarias se reinician y el siguiente nivel es cargado.</p>
-
-<h2 id="Ideas_para_nuevas_características">Ideas para nuevas características</h2>
-
-<p><span style="line-height: 1.5;">Esto no es más que una demostración funcional de un juego que podría tener un montón de características adicionales. Por ejemplo podemos añadir poderes para recoger en el camino que harán que nuestra pelota ruede más rápido, otro podría detener el temporizador durante unos segundos o dar la pelota poderes especiales para atravesar obstáculos. También hay espacio para los obstáculos y trampas que harán más lenta la pelota, acelerar el tiempo o trampas de la propia pelota. Puedes crear más niveles con dificultades diferentes para cada uno. Incluso puedes obtener logros, tablas de clasificación y medallas para diferentes acciones en el juego. Hay un sinfín de posibilidades: sólo dependen de tu imaginación.</span></p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Espero que este tutorial te ayude a introducirte dentro del desarrollo de los juegos 2D y te inspire a crear asombrosos juegos por tu cuenta. Puedes jugar el demo de Cyber Orb y chequear su código fuente en GitHub.</p>
-
-<p>HTML5 nos da herramientas en bruto, los <em>frameworks</em> construidos sobre estas se están volviendo más rápidos y mejores, por lo que ahora es un gran momento para meterse en el desarrollo de juegos web. En este tutorial usamos Phaser, pero hay un gran número de otros <em>frameworks</em> que vale la pena considerar también, como ImpactJS, Construct 2 o PlayCanvas — depende de tus preferencias, habilidades de programación (o la falta de estas), el tamaño de tu proyecto, los requerimientos y otros aspectos. Deberías chequearlos todos y decidir cual es el que mejor se ajusta a tus necesidades.</p>
diff --git a/files/es/games/workflows/index.html b/files/es/games/workflows/index.html
deleted file mode 100644
index 3a0807cc77..0000000000
--- a/files/es/games/workflows/index.html
+++ /dev/null
@@ -1,10 +0,0 @@
----
-title: Workflows for different game types
-slug: Games/Workflows
-tags:
-  - NeedsTranslation
-  - TopicStub
-translation_of: Games/Tutorials
----
-<div>{{GamesSidebar}}</div><p>This page will contain links to different article series covering different workflows for effectively creating different types of web games, whether you want to create a 2D or 3D game from scratch, or port a C++ or Flash game over to open web technologies.</p>
-<p>For example, a <a href="/en-US/docs/Games/Workflows/HTML5_Gamedev_Phaser_Device_Orientation">2D maze game with Phaser and the Device Orientation API</a>.</p>
diff --git a/files/es/generación_de_guids/index.html b/files/es/generación_de_guids/index.html
deleted file mode 100644
index 6fb035653b..0000000000
--- a/files/es/generación_de_guids/index.html
+++ /dev/null
@@ -1,61 +0,0 @@
----
-title: Generación de GUIDs
-slug: Generación_de_GUIDs
----
-<div class="note">(Esta página se encuentra en proceso de traducción - ruego a quién la complete, si no lo hago antes, retirar esta nota de estatus - Ibnkhaldun)</div>
-<p>Los <strong>GUID</strong>s son empleados por los programas integrados en Mozilla para identificar de modo único a una gran variedad de entidades, entre las que se incluyen las <a href="/en/Interfaces" title="en/Interfaces">Interfaces</a> XPCOM (en este caso, la GUID es llamada IID), los componentes (CID), y los "agregados" (add-ons), como <a href="/en/Extensions" title="en/Extensions">extensiones</a> y <a href="/en/Themes" title="en/Themes">temas</a>; no obstante, los "agregados" (add-ons) <a href="/en/Install_Manifests#id" title="en/Install_Manifests#id">pueden (y debieran) ser identificados</a> mediante IDs (identificadores) de la forma <code><a class=" link-mailto" href="mailto:nombreextension@nombreorganizacion.tld" rel="freelink">nombreextension@nombreorganizacion.tld</a></code> a partir de <a href="/en/Firefox_1.5_for_developers" title="en/Firefox_1.5_for_developers">Firefox 1.5</a>.</p>
-<h3 id="Canonical_form" name="Canonical_form">Forma canónica de una GUID</h3>
-<p>La forma usual de una GUID es <code>xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxx</code>, donde cada <code>x</code> corresponde a un dígito hexadecimal (01...9A...F). Y, debe ser única en el mundo dígital. De modo que no importa en que equipo sea instalada la entidad a la que identifica no compita con el identificador de otro objeto o programa instalado en el mismo. Esto quiere decir, que una GUID no puede ser escrita de modo arbitrario, siguiendo el modelo canónico. Debe ser generada por una utilidad (algoritmo) que garantice su unicidad. Sería gravísimo crear un componente o una biblioteca y asignar GUIDs arbitrarias a ella y sus entidades integrantes: al distribuirla e instalarla en otros equipos podría provocar efectos inesperados cuando los programas y utilitarios instalados en los mismos traten de hacer referencia a (o cargar) piezas de software cuyos identificadores se solapan. Existen muchas utilidades que permiten generar GUIDs únicos que se ajustan a la forma canónica. Entre otras:</p>
-<h4 id="Online_tools" name="Online_tools">Herramientas en línea</h4>
-<ul> <li><a class="external" href="http://www.somacon.com/p113.php">Generate GUID Online</a></li> <li><a class="external" href="http://www.famkruithof.net/uuid/uuidgen">UUID (GUID) Generator on the WEB</a></li> <li><a class="external" href="http://mozilla.pettay.fi/cgi-bin/mozuuid.pl">UUID Generator for Mozilla Code</a> (tanto en forma IDL como C++.h)</li> <li>Se puede obtener una GUID desde algunos robots de correo (tales como botbot, firebot) el canal IRC <a class="link-irc" href="irc://irc.mozilla.org/firefox">#firefox</a> enviandoles <code>/msg</code>ing "uuid" .</li>
-</ul>
-<h4 id="Windows" name="Windows">Windows</h4>
-<p>Los usuarios de Windows pueden emplear el utilitario <a class="external" href="http://www.microsoft.com/downloads/details.aspx?FamilyID=94551F58-484F-4A8C-BB39-ADB270833AFC&amp;displaylang=en">GuidGen</a> de Microsoft para obtener una GUID. (esta utilidad de parte de MS Visual C++)</p>
-<h4 id="Linux" name="Linux">Linux</h4>
-<p>Usar <code>/usr/bin/uuidgen</code>. Se encuentra en el paquete <code>libuuid1</code> (Debian).</p>
-<h4 id="Mac_OS_X">Mac OS X</h4>
-<p>Usar <code>/usr/bin/uuidgen</code>.</p>
-<h4 id="Perl" name="Perl">Perl</h4>
-<p><a class="external" href="http://www.johnkeiser.com/mozilla/mozilla_tools.html">jkeiser's Mozilla tools</a> incluye un generador UUID con salidas en los estilos C++ e IDL.</p>
-<h4 id="nsIUUIDGenerator" name="nsIUUIDGenerator">nsIUUIDGenerator</h4>
-<p>Se puede generar un identificador UUID desde código, contando con privilegios de ejecución en Mozilla, utilizando los métodos del objeto <code><a href="/en/XPCOM_Interface_Reference/nsIUUIDGenerator" title="en/nsIUUIDGenerator">nsIUUIDGenerator</a></code>. Ver la página enlazada para obtener detalles.</p>
-<h3 id="COM.2FXPCOM_format" name="COM.2FXPCOM_format">Formato COM/XPCOM</h3>
-<p>Cuando se declaran IIDs y CIDs mediante enunciados  <code>#define</code> en código C++ para Mozilla, suele emplearse el siguiente formato:</p>
-<pre class="eval">// xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxx
-#define NS_...ID \
-{ 0xXXXXXXXX, 0xXXXX, 0xXXXX, \
-  { 0xXX, 0xXX, 0xXX, 0xXX, 0xXX, 0xXX, 0xXX, 0xXX } }
-</pre>
-<p>Para generar código en este formato puede emplearse alguna de las siguientes herramientas.</p>
-<h4 id="Online_tools_2" name="Online_tools_2">Utilidades en línea</h4>
-<ul> <li><a class=" external" href="http://mozilla.pettay.fi/cgi-bin/mozuuid.pl" rel="freelink">http://mozilla.pettay.fi/cgi-bin/mozuuid.pl</a></li>
-</ul>
-<h4 id="guidgen" name="guidgen">guidgen</h4>
-<p><code>guidgen.exe</code>, hace parte de Microsoft Visual Studio, genera UUIDs en este formato.</p>
-<div class="note">(N de T. Los dos párrafos siguientes son poco claros en el original - su traducción es difícil ¿alguna sugerencia? - hace falta un texto que los haga más orientadores - no son una buena ayuda)</div>
-<h4 id="bash" name="bash">bash</h4>
-<p>You can put the following into your <code>.bashrc</code> file:</p>
-<pre>uuidgen-c++()
-{
-       local UUID=$(uuidgen)
-       echo "// $UUID"
-       echo "#define NS__IID \\"
-       echo "{ 0x${UUID:0:8}, 0x${UUID:9:4}, 0x${UUID:14:4}, \\"
-       echo -n "  { 0x${UUID:19:2}, 0x${UUID:21:2}, 0x${UUID:24:2}, "
-       echo -n "0x${UUID:26:2}, 0x${UUID:28:2}, 0x${UUID:30:2}, "
-       echo "0x${UUID:32:2}, 0x${UUID:34:2} } }"
-}
-</pre>
-<h4 id="Perl_2" name="Perl_2">Perl</h4>
-<pre>#!/usr/bin/perl
-$uuid = `uuidgen`;
-chomp $uuid;
-print $uuid, "\n";
-@parts = ($uuid =~ /^(.{8})-(.{4})-(.{4})-(..)(..)-(..)(..)(..)(..)(..)(..)$/);
-print "{ 0x$parts[0], 0x$parts[1], 0x$parts[2], \\", "\n", " { ";
-for (3 .. 9) {
-    print "0x$parts[$_], ";
-}
-print "0x$parts[10] } }", "\n";
-</pre>
-<p>{{ languages( { "fr": "fr/G\u00e9n\u00e9ration_de_GUID", "ja": "ja/Generating_GUIDs", "pl": "pl/Generowanie_GUID" } ) }}</p>
diff --git a/files/es/glossary/algorithm/index.html b/files/es/glossary/algorithm/index.html
new file mode 100644
index 0000000000..8164762d9a
--- /dev/null
+++ b/files/es/glossary/algorithm/index.html
@@ -0,0 +1,10 @@
+---
+title: Algoritmo
+slug: Glossary/Algorithm
+tags:
+  - CodingScripting
+  - Glossary
+translation_of: Glossary/Algorithm
+original_slug: Glossary/Algoritmo
+---
+<p><span class="seoSummary">Un algoritmo es un conjunto de instrucciones autocontenidas que realiza una función.</span></p>
diff --git a/files/es/glossary/algoritmo/index.html b/files/es/glossary/algoritmo/index.html
deleted file mode 100644
index e007ec918e..0000000000
--- a/files/es/glossary/algoritmo/index.html
+++ /dev/null
@@ -1,9 +0,0 @@
----
-title: Algoritmo
-slug: Glossary/Algoritmo
-tags:
-  - CodingScripting
-  - Glossary
-translation_of: Glossary/Algorithm
----
-<p><span class="seoSummary">Un algoritmo es un conjunto de instrucciones autocontenidas que realiza una función.</span></p>
diff --git a/files/es/glossary/argument/index.html b/files/es/glossary/argument/index.html
new file mode 100644
index 0000000000..0a3ff5c6bb
--- /dev/null
+++ b/files/es/glossary/argument/index.html
@@ -0,0 +1,21 @@
+---
+title: Argumento
+slug: Glossary/Argument
+translation_of: Glossary/Argument
+original_slug: Glossary/Argumento
+---
+<p>Un argumento es un valor (primitivo u objeto) (Véase {{glossary("value")}},  {{Glossary("primitive")}}, {{Glossary("object")}}) pasado como valor de entrada a una función ({{Glossary("function")}}).</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Parameter_(computer_programming)", "Difference between Parameter and Argument")}} on Wikipedia</li>
+</ul>
+
+<h3 id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li>The {{jsxref("Functions/arguments","arguments")}} object in {{glossary("JavaScript")}}</li>
+</ul>
diff --git a/files/es/glossary/argumento/index.html b/files/es/glossary/argumento/index.html
deleted file mode 100644
index c3ccfb69ca..0000000000
--- a/files/es/glossary/argumento/index.html
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Argumento
-slug: Glossary/Argumento
-translation_of: Glossary/Argument
----
-<p>Un argumento es un valor (primitivo u objeto) (Véase {{glossary("value")}},  {{Glossary("primitive")}}, {{Glossary("object")}}) pasado como valor de entrada a una función ({{Glossary("function")}}).</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Parameter_(computer_programming)", "Difference between Parameter and Argument")}} on Wikipedia</li>
-</ul>
-
-<h3 id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li>The {{jsxref("Functions/arguments","arguments")}} object in {{glossary("JavaScript")}}</li>
-</ul>
diff --git a/files/es/glossary/arquitectura_de_la_información/index.html b/files/es/glossary/arquitectura_de_la_información/index.html
deleted file mode 100644
index 222ed88e59..0000000000
--- a/files/es/glossary/arquitectura_de_la_información/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Arquitectura de la información
-slug: Glossary/Arquitectura_de_la_información
-tags:
-  - Arquitectura informacional
-  - Diseño
-  - Glosario
-translation_of: Glossary/Information_architecture
----
-<p>La arquitectura de la información, aplicada al diseño y desarrollo web, es la práctica de organizar la información, contenido y funcionalidad de un sitio web para que presente la mejor experiencia de usuario posible, con información y servicios fáciles de usar y encontrar.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Arquitectura_de_la_información", "Arquitectura de la información")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/array/index.html b/files/es/glossary/array/index.html
new file mode 100644
index 0000000000..cf3f7346e1
--- /dev/null
+++ b/files/es/glossary/array/index.html
@@ -0,0 +1,42 @@
+---
+title: Arreglos (Matrices)
+slug: Glossary/array
+tags:
+  - Arreglos
+  - CodificaciónScripting
+  - Glosario
+  - JavaScript
+  - Matriz
+  - programacion
+translation_of: Glossary/array
+original_slug: Glossary/Arreglos
+---
+<p>Un arreglo (matriz<em>)</em> es una colección ordenada de datos (tanto {{glossary("Primitivo", "primitivos")}} u {{glossary("Object", "objetos")}} dependiendo del lenguaje). Los arreglos (matrices<em>)</em> se emplean para almacenar multiples valores en una sola variable, frente a las variables que sólo pueden almacenar un valor (por cada variable).</p>
+
+<p>Cada elemento del arreglo (matriz) <em> </em>tiene un número al que está asociado, llamado "<strong>índice numérico"</strong> (numeric index)<strong>,</strong> que permite acceder a él.</p>
+
+<p>En JavaScript, los arreglos (matrices) comienzan a partir del índice cero y pueden ser manipulados con varios {{glossary("Método", "métodos")}}.</p>
+
+<p>Un arreglo (matriz<em>)</em> en JavaScript se ve de esta forma:</p>
+
+<pre><code>var myArray = [1, 2, 3, 4];
+
+var catNamesArray = ["Jacqueline", "Sophia", "Autumn"];
+
+//Los arreglos en Javascript pueden guardar distintos tipos de datos como se muestra anteriormente
+</code>
+</pre>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Array data structure", "Array")}} en Wikipedia</li>
+</ul>
+
+<h3 id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li>JavaScript {{jsxref("Array")}} en MDN</li>
+</ul>
diff --git a/files/es/glossary/arreglos/index.html b/files/es/glossary/arreglos/index.html
deleted file mode 100644
index 74b22dbedc..0000000000
--- a/files/es/glossary/arreglos/index.html
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: Arreglos (Matrices)
-slug: Glossary/Arreglos
-tags:
-  - Arreglos
-  - CodificaciónScripting
-  - Glosario
-  - JavaScript
-  - Matriz
-  - programacion
-translation_of: Glossary/array
----
-<p>Un arreglo (matriz<em>)</em> es una colección ordenada de datos (tanto {{glossary("Primitivo", "primitivos")}} u {{glossary("Object", "objetos")}} dependiendo del lenguaje). Los arreglos (matrices<em>)</em> se emplean para almacenar multiples valores en una sola variable, frente a las variables que sólo pueden almacenar un valor (por cada variable).</p>
-
-<p>Cada elemento del arreglo (matriz) <em> </em>tiene un número al que está asociado, llamado "<strong>índice numérico"</strong> (numeric index)<strong>,</strong> que permite acceder a él.</p>
-
-<p>En JavaScript, los arreglos (matrices) comienzan a partir del índice cero y pueden ser manipulados con varios {{glossary("Método", "métodos")}}.</p>
-
-<p>Un arreglo (matriz<em>)</em> en JavaScript se ve de esta forma:</p>
-
-<pre><code>var myArray = [1, 2, 3, 4];
-
-var catNamesArray = ["Jacqueline", "Sophia", "Autumn"];
-
-//Los arreglos en Javascript pueden guardar distintos tipos de datos como se muestra anteriormente
-</code>
-</pre>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Array data structure", "Array")}} en Wikipedia</li>
-</ul>
-
-<h3 id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li>JavaScript {{jsxref("Array")}} en MDN</li>
-</ul>
diff --git a/files/es/glossary/asynchronous/index.html b/files/es/glossary/asynchronous/index.html
new file mode 100644
index 0000000000..e68d6f7162
--- /dev/null
+++ b/files/es/glossary/asynchronous/index.html
@@ -0,0 +1,32 @@
+---
+title: Asíncrono
+slug: Glossary/Asynchronous
+tags:
+  - Asíncrono
+  - Glosario
+  - Mecánicas de la Web
+  - Web
+translation_of: Glossary/Asynchronous
+original_slug: Glossary/Asíncrono
+---
+<p>El término <strong>asíncrono </strong>se refiere al concepto de que más de una cosa ocurre al mismo tiempo, o múltiples cosas relacionadas ocurren sin esperar a que la previa se haya completado. En informática, la palabra "asíncrono" se usa en los siguientes contextos:</p>
+
+<dl>
+ <dt>Redes y comunicaciones</dt>
+ <dd>La comunicación asíncrona es un método de intercambio de mensajes entre dos o más partes, en la que cada parte recibe y procesa el mensaje cuando sea conveniente o posible de realizar, en vez de hacerlo inmediatamente al recibirlo. Adicionalmente, los mensajes pueden ser enviados sin esperar el acuse de recibo de los mismos, bajo el entendimiento de que si ocurre algún problema, quien los recibe solicitará las correcciones o manejara la situación.</dd>
+ <dd>Para los humanos, el correo electrónico es un método de comunicación asíncrono: el emisor envía el correo y el receptor lo leerá y responderá cuando le sea conveniente en vez de hacerlo de una vez. Ambos lados pueden continuar enviando y recibiendo mensajes cuando quiera que ellos deseen, en lugar de tener que programarse uno alrededor del otro.</dd>
+ <dd>Cuando el software se comunica de manera asíncrona, un programa puede realizar una solicitud de información a otra pieza de software (un servidor, por ejemplo), y continuar haciendo otras tareas mientras espera por la respuesta. Por ejemplo,la técnica de programación <a href="/es/docs/">AJAX</a> (Asynchronus JavaScript and {{Glossary("XML")}}) - usualmente llamada simplemente "Ajax", incluso a pesar de que usualmente en las aplicaciones modernas se utilice {{Glossary("JSON")}} en vez de XML - es un mecanismo por el que se solicitan tamaños relativamente pequeños de datos al servidor usando {{Glossary("HTTP")}} , siendo los resultados devueltos cuando estén disponibles más que de inmediato.</dd>
+ <dt>Diseño de Software</dt>
+ <dd>El diseño de software asíncrono amplía el concepto al construir código que permita a un programa solicitar que una tarea se realice al mismo tiempo que la tarea (o tareas) original, sin detenerse a esperar a que la primera se haya completado. Cuando la tarea secundaria se completa, la original es notificada usando un mecanismo acordado, de tal forma que sepa que el trabajo se ha completado y que el resultado, si es que existe, está disponible.</dd>
+ <dd>Existen diversas técnicas de programación para implementar software asíncrono. Vea el artículo <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous">Asynchronous JavaScript</a>  para terner una introducción a ellos.</dd>
+ <dt></dt>
+</dl>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">Fetching data from the server</a> (Learning Area)</li>
+ <li>{{glossary("Synchronous")}}</li>
+</ul>
diff --git a/files/es/glossary/asíncrono/index.html b/files/es/glossary/asíncrono/index.html
deleted file mode 100644
index 439f95eb37..0000000000
--- a/files/es/glossary/asíncrono/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title: Asíncrono
-slug: Glossary/Asíncrono
-tags:
-  - Asíncrono
-  - Glosario
-  - Mecánicas de la Web
-  - Web
-translation_of: Glossary/Asynchronous
----
-<p>El término <strong>asíncrono </strong>se refiere al concepto de que más de una cosa ocurre al mismo tiempo, o múltiples cosas relacionadas ocurren sin esperar a que la previa se haya completado. En informática, la palabra "asíncrono" se usa en los siguientes contextos:</p>
-
-<dl>
- <dt>Redes y comunicaciones</dt>
- <dd>La comunicación asíncrona es un método de intercambio de mensajes entre dos o más partes, en la que cada parte recibe y procesa el mensaje cuando sea conveniente o posible de realizar, en vez de hacerlo inmediatamente al recibirlo. Adicionalmente, los mensajes pueden ser enviados sin esperar el acuse de recibo de los mismos, bajo el entendimiento de que si ocurre algún problema, quien los recibe solicitará las correcciones o manejara la situación.</dd>
- <dd>Para los humanos, el correo electrónico es un método de comunicación asíncrono: el emisor envía el correo y el receptor lo leerá y responderá cuando le sea conveniente en vez de hacerlo de una vez. Ambos lados pueden continuar enviando y recibiendo mensajes cuando quiera que ellos deseen, en lugar de tener que programarse uno alrededor del otro.</dd>
- <dd>Cuando el software se comunica de manera asíncrona, un programa puede realizar una solicitud de información a otra pieza de software (un servidor, por ejemplo), y continuar haciendo otras tareas mientras espera por la respuesta. Por ejemplo,la técnica de programación <a href="/es/docs/">AJAX</a> (Asynchronus JavaScript and {{Glossary("XML")}}) - usualmente llamada simplemente "Ajax", incluso a pesar de que usualmente en las aplicaciones modernas se utilice {{Glossary("JSON")}} en vez de XML - es un mecanismo por el que se solicitan tamaños relativamente pequeños de datos al servidor usando {{Glossary("HTTP")}} , siendo los resultados devueltos cuando estén disponibles más que de inmediato.</dd>
- <dt>Diseño de Software</dt>
- <dd>El diseño de software asíncrono amplía el concepto al construir código que permita a un programa solicitar que una tarea se realice al mismo tiempo que la tarea (o tareas) original, sin detenerse a esperar a que la primera se haya completado. Cuando la tarea secundaria se completa, la original es notificada usando un mecanismo acordado, de tal forma que sepa que el trabajo se ha completado y que el resultado, si es que existe, está disponible.</dd>
- <dd>Existen diversas técnicas de programación para implementar software asíncrono. Vea el artículo <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous">Asynchronous JavaScript</a>  para terner una introducción a ellos.</dd>
- <dt></dt>
-</dl>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">Fetching data from the server</a> (Learning Area)</li>
- <li>{{glossary("Synchronous")}}</li>
-</ul>
diff --git a/files/es/glossary/atributo/index.html b/files/es/glossary/atributo/index.html
deleted file mode 100644
index 42027cf072..0000000000
--- a/files/es/glossary/atributo/index.html
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Atributo
-slug: Glossary/Atributo
-translation_of: Glossary/Attribute
----
-<p>Un atributo amplía una etiqueta ({{Glossary("tag")}}), cambiando su comportamiento o proporcionando metadatos. Un atributo tiene la forma nombre=valor (especificando el identificador del atributo y el valor asociado al atributo).</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Referencia_técnica"><span style="font-size: 1.71428571428571rem;">Referencia técnica</span></h3>
-
-<ul>
- <li><a href="/en-US/docs/Web/HTML/Attributes">HTML attribute reference</a></li>
- <li>Information about HTML's <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</li>
-</ul>
diff --git a/files/es/glossary/atributo_global/index.html b/files/es/glossary/atributo_global/index.html
deleted file mode 100644
index 64afaf64ff..0000000000
--- a/files/es/glossary/atributo_global/index.html
+++ /dev/null
@@ -1,27 +0,0 @@
----
-title: Atributo global
-slug: Glossary/Atributo_global
-tags:
-  - CodingScripting
-  - Glosario
-  - HTML
-  - atributo
-translation_of: Web/HTML/Global_attributes
-translation_of_original: Glossary/Global_attribute
----
-<p>Los<strong> Atributos Globales</strong> son {{glossary("attribute","atributos")}} que pueden ser usados en todos los {{glossary("element","elementos")}} (aunque a veces no tienen efecto en algunos de ellos).</p>
-
-<p>Algunos atributos se pueden utilizar en cualquier elemento HTML:</p>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales/dir"><strong>dir</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/lang"><strong>lang</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/style"><strong>style</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/id"><strong>id</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/class"><strong>class</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/tabindex"><strong>tabindex</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/accesskey"><strong>accesskey</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/title"><strong>title</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/hidden"><strong>hidden</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/data-*"><strong>data-*</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/contextmenu"><strong>contextmenu</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/contenteditable"><strong>contenteditable</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/translate"><strong>translate</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/spellcheck"><strong>spellcheck</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/draggable"><strong>draggable</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/dropzone"><strong>dropzone</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemid"><strong>itemid</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemprop"><strong>itemprop</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemref"><strong>itemref</strong></a>, <a href="/es/docs/Web/HTML/Atributos_Globales/itemscope"><strong>itemscope</strong></a>, y <a href="/es/docs/Web/HTML/Atributos_Globales/itemtype"><strong>itemtype</strong></a>.</li>
- <li>Tanto <strong>xml:lang</strong> como <strong>xml:base</strong>, obsoletos, heredados de las especificaciones de {{glossary("XHTML")}} y mantenidos por razones de compatibilidad.</li>
- <li>Los múltiples atributos <strong><a href="https://developer.mozilla.org/es/docs/Web/Accessibility/ARIA">aria-*</a></strong>, para mejorar la accesibilidad.</li>
- <li>Los atributos de manejadores de eventos: <strong>onabort</strong>, <strong>onautocomplete</strong>, <strong>onautocompleteerror</strong>, <strong>onblur</strong>, <strong>oncancel</strong>, <strong>oncanplay</strong>, <strong>oncanplaythrough</strong>, <strong>onchange</strong>, <strong>onclick</strong>, <strong>onclose</strong>, <strong>oncontextmenu</strong>, <strong>oncuechange</strong>, <strong>ondblclick</strong>, <strong>ondrag</strong>, <strong>ondragend</strong>, <strong>ondragenter</strong>, <strong>ondragexit</strong>, <strong>ondragleave</strong>, <strong>ondragover</strong>, <strong>ondragstart</strong>, <strong>ondrop</strong>, <strong>ondurationchange</strong>, <strong>onemptied</strong>, <strong>onended</strong>, <strong>onerror</strong>, <strong>onfocus</strong>, <strong>oninput</strong>, <strong>oninvalid</strong>, <strong>onkeydown</strong>, <strong>onkeypress</strong>, <strong>onkeyup</strong>, <strong>onload</strong>, <strong>onloadeddata</strong>, <strong>onloadedmetadata</strong>, <strong>onloadstart</strong>, <strong>onmousedown</strong>, <strong>onmouseenter</strong>, <strong>onmouseleave</strong>, <strong>onmousemove</strong>, <strong>onmouseout</strong>, <strong>onmouseover</strong>, <strong>onmouseup</strong>, <strong>onmousewheel</strong>, <strong>onpause</strong>, <strong>onplay</strong>, <strong>onplaying</strong>, <strong>onprogress</strong>, <strong>onratechange</strong>, <strong>onreset</strong>, <strong>onresize</strong>, <strong>onscroll</strong>, <strong>onseeked</strong>, <strong>onseeking</strong>, <strong>onselect</strong>, <strong>onshow</strong>, <strong>onsort</strong>, <strong>onstalled</strong>, <strong>onsubmit</strong>, <strong>onsuspend</strong>, <strong>ontimeupdate</strong>, <strong>ontoggle</strong>, <strong>onvolumechange</strong>, <strong>onwaiting</strong>.</li>
-</ul>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<ul>
- <li>Los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> de HTML.</li>
-</ul>
diff --git a/files/es/glossary/attribute/index.html b/files/es/glossary/attribute/index.html
new file mode 100644
index 0000000000..50b5977e59
--- /dev/null
+++ b/files/es/glossary/attribute/index.html
@@ -0,0 +1,16 @@
+---
+title: Atributo
+slug: Glossary/Attribute
+translation_of: Glossary/Attribute
+original_slug: Glossary/Atributo
+---
+<p>Un atributo amplía una etiqueta ({{Glossary("tag")}}), cambiando su comportamiento o proporcionando metadatos. Un atributo tiene la forma nombre=valor (especificando el identificador del atributo y el valor asociado al atributo).</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Referencia_técnica"><span style="font-size: 1.71428571428571rem;">Referencia técnica</span></h3>
+
+<ul>
+ <li><a href="/en-US/docs/Web/HTML/Attributes">HTML attribute reference</a></li>
+ <li>Information about HTML's <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</li>
+</ul>
diff --git a/files/es/glossary/base64/index.html b/files/es/glossary/base64/index.html
new file mode 100644
index 0000000000..319f83ee89
--- /dev/null
+++ b/files/es/glossary/base64/index.html
@@ -0,0 +1,346 @@
+---
+title: Base64 codificando y decodificando
+slug: Glossary/Base64
+translation_of: Glossary/Base64
+original_slug: Web/API/WindowBase64/Base64_codificando_y_decodificando
+---
+<p><strong>Base64</strong> es un grupo de esquemas de <a href="https://es.wikipedia.org/wiki/Codificaci%C3%B3n_de_binario_a_texto">codificación de binario a texto</a> que representa los datos binarios mediante una cadena ASCII, traduciéndolos en una representación radix-64. El término <em>Base64</em> se origina de un <a href="https://es.wikipedia.org/wiki/Multipurpose_Internet_Mail_Extensions#Content-Transfer-Encoding">sistema de codificación de transmisión de contenido MIME</a> específico.</p>
+
+<p>Los esquemas de codificación Base64 son comúnmente usados cuando se necesita codificar datos binarios para que sean almacenados y transferidos sobre un medio diseñado para tratar con datos textuales. Esto es para asegurar que los datos se mantienen intactos y sin modificaciones durante la transmisión. Base64 es comúnmente usado en muchas aplicaciones, incluyendo la escritura de emails vía <a href="https://es.wikipedia.org/wiki/Multipurpose_Internet_Mail_Extensions">MIME</a> y el almacenamiento de datos complejos en <a href="/es/docs/XML">XML</a>.</p>
+
+<p>En JavaScript hay dos funciones para decodificar y codificar cadenas base64, respectivamente:</p>
+
+<ul>
+ <li>{{domxref("WindowBase64.atob","atob()")}}</li>
+ <li>{{domxref("WindowBase64.btoa","btoa()")}}</li>
+</ul>
+
+<p>La función <code>atob()</code> decodifica una cadena de datos que ha sido codificada usando la codificación en base 64. Por el contrario, la función <code>btoa()</code> crea una cadena ASCII codificada en base 64 a partir de una "cadena" de datos binarios.</p>
+
+<p>Ambas funciones trabajan sobre cadenas de texto. Si desea trabajar con <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer">ArrayBuffers</a>, lea <a href="/es/docs/Web/API/WindowBase64/Base64_codificando_y_decodificando$edit#Solution_.232_.E2.80.93_rewriting_atob%28%29_and_btoa%28%29_using_TypedArrays_and_UTF-8">este párrafo</a>.</p>
+
+
+
+<table class="topicpage-table">
+ <tbody>
+  <tr>
+   <td>
+    <h2 class="Documentation" id="Documentation" name="Documentation">Documentación</h2>
+
+    <dl>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/data_URIs" title="https://developer.mozilla.org/en-US/docs/data_URIs"><code>data</code> URIs</a></dt>
+     <dd><small><code>Los URIs de</code> datos, definidos por <a class="external" href="http://tools.ietf.org/html/rfc2397" title="http://tools.ietf.org/html/rfc2397">RFC 2397</a>, permiten a los creadores de contenido introducir pequeños ficheros en línea en documentos.</small></dd>
+     <dt><a href="https://es.wikipedia.org/wiki/Base64" title="https://en.wikipedia.org/wiki/Base64">Base64</a></dt>
+     <dd><small>Artículo en Wikipedia sobre el sistema de codificación Base64.</small></dd>
+     <dt>{{domxref("WindowBase64.atob","atob()")}}</dt>
+     <dd><small>Decodifica una cadena de datos que ha sido codificada utilizando base-64.</small></dd>
+     <dt>{{domxref("WindowBase64.btoa","btoa()")}}</dt>
+     <dd><small>Crea una cadena ASCII codificada en base 64 a partir de una "cadena" de datos binarios.</small></dd>
+     <dt><a href="#The_.22Unicode_Problem.22">The "Unicode Problem"</a></dt>
+     <dd><small>En la mayoría de navegadores, llamar a <code>btoa()</code> con una cadena Unicode causará una excepción <code>Character Out Of Range</code>. Este párrafo muestra algunas soluciones.</small></dd>
+     <dt><a href="/en-US/docs/URIScheme" title="/en-US/docs/URIScheme">URIScheme</a></dt>
+     <dd><small>Lista de esquemas URI soportados por Mozilla.</small></dd>
+     <dt><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a></dt>
+     <dd>En este artículo está publicada una librería hecha por nosotros con los siguientes objetivos:</dd>
+     <dd>
+     <ul>
+      <li>crear una interfaz al estilo de <a class="external" href="http://en.wikipedia.org/wiki/C_%28programming_language%29" title="http://en.wikipedia.org/wiki/C_%28programming_language%29">C</a> para cadenas (es decir, arrays de códigos de caracteres —<a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView" title="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView"> <code>ArrayBufferView</code></a> en JavaScript) basada en la interfaz  <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer" title="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer"><code>ArrayBuffer</code></a> de JavaScript.</li>
+      <li>crear una colección de métodos para los que los objetos parecidos a cadenas (de ahora en adelante, <code>stringView</code>s) funcionen estrictamente en arrays de números más que en cadenas JavaScript inmutables.</li>
+      <li>trabajar con otras codificaciones Unicode diferentes de las <a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a>s UTF-16 por defecto de JavaScript.</li>
+     </ul>
+     </dd>
+    </dl>
+
+    <p><span class="alllinks"><a href="/en-US/docs/tag/Base64">Ver todo...</a></span></p>
+   </td>
+   <td>
+    <h2 class="Tools" id="Tools" name="Tools">Herramientas</h2>
+
+    <ul>
+     <li><a href="#Solution_.232_.E2.80.93_rewriting_atob()_and_btoa()_using_TypedArrays_and_UTF-8">Reescribir atob() y btoa() usando TypedArrays y UTF-8</a></li>
+     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code>, una representación parecida a C de cadenas basadas en arrays tipados</a><span class="alllinks"><a href="/en-US/docs/tag/Base64">View All...</a></span></li>
+    </ul>
+
+    <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Temas relacionados</h2>
+
+    <ul>
+     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer"><code>ArrayBuffer</code></a></li>
+     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">Vectores o arrays tipados</a></li>
+     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView">ArrayBufferView</a></li>
+     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array"><code>Uint8Array</code></a></li>
+     <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView">, una representación parecida a C de cadenas basadas en arrays tipados</a></li>
+     <li><a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a></li>
+     <li><a href="/en-US/docs/URI" title="/en-US/docs/URI"><code>URI</code></a></li>
+     <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI"><code>encodeURI()</code></a></li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+
+
+<h2 id="El_Problema_Unicode">El "Problema Unicode"</h2>
+
+<p>Como las <a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a>s son cadenas codificadas en 16 bits, en la mayoría de navegadores llamar a <code>window.btoa</code> sobre una cadena Unicode resultará en una excepción <code>Character Out Of Range </code>si un carácter excede el rango de los caracteres ASCII de 8 bits. Hay dos posibles métodos para resolver este problema:</p>
+
+<ul>
+ <li>el primero es escapar la cadena completa y, entonces, codificarla;</li>
+ <li>el segundo es convertir la <a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a> UTF-16 en un array de caracteres UTF-8 y codificarla.</li>
+</ul>
+
+<p>Aquí están los dos posibles métodos:</p>
+
+<h3 id="Solución_1_–_escapar_la_cadena_antes_de_codificarla">Solución #1 – escapar la cadena antes de codificarla</h3>
+
+<pre class="brush:js notranslate">function utf8_to_b64( str ) {
+  return window.btoa(unescape(encodeURIComponent( str )));
+}
+
+function b64_to_utf8( str ) {
+  return decodeURIComponent(escape(window.atob( str )));
+}
+
+// Uso:
+utf8_to_b64('✓ à la mode'); // "4pyTIMOgIGxhIG1vZGU="
+b64_to_utf8('4pyTIMOgIGxhIG1vZGU='); // "✓ à la mode"</pre>
+
+<p>Esta solución ha sido propuesta por <a href="http://ecmanaut.blogspot.com/2006/07/encoding-decoding-utf8-in-javascript.html">Johan Sundström</a>.</p>
+
+<p>Otra posible solución sin utilizar las funciones 'unscape' y 'escape', ya obsoletas.</p>
+
+<pre class="brush:js notranslate">function b64EncodeUnicode(str) {
+    return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
+        return String.fromCharCode('0x' + p1);
+    }));
+}
+ b64EncodeUnicode('✓ à la mode'); // "4pyTIMOgIGxhIG1vZGU="
+</pre>
+
+<h3 id="Solución_2_–_reescribir_atob_y_btoa_usando_TypedArrays_y_UTF-8">Solución #2 – reescribir <code>atob()</code> y <code>btoa()</code> usando <code>TypedArray</code>s y UTF-8</h3>
+
+<div class="note"><strong>Nota:</strong> El siguiente código también es útil para obtener un <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">ArrayBuffer</a> a partir de una cadena <em>Base64</em> y/o viceversa (<a href="#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer" title="#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer">véase abajo</a>). <strong>Para una librería completa de arrays tipados, vea <a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView">este artículo</a></strong>.</div>
+
+<pre class="brush: js notranslate">"use strict";
+
+/*\
+|*|
+|*|  Base64 / binary data / UTF-8 strings utilities
+|*|
+|*|  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding
+|*|
+\*/
+
+/* Decodificación de cadena base64 en array de bytes */
+
+function b64ToUint6 (nChr) {
+
+  return nChr &gt; 64 &amp;&amp; nChr &lt; 91 ?
+      nChr - 65
+    : nChr &gt; 96 &amp;&amp; nChr &lt; 123 ?
+      nChr - 71
+    : nChr &gt; 47 &amp;&amp; nChr &lt; 58 ?
+      nChr + 4
+    : nChr === 43 ?
+      62
+    : nChr === 47 ?
+      63
+    :
+      0;
+
+}
+
+function base64DecToArr (sBase64, nBlocksSize) {
+
+  var
+    sB64Enc = sBase64.replace(/[^A-Za-z0-9\+\/]/g, ""), nInLen = sB64Enc.length,
+    nOutLen = nBlocksSize ? Math.ceil((nInLen * 3 + 1 &gt;&gt; 2) / nBlocksSize) * nBlocksSize : nInLen * 3 + 1 &gt;&gt; 2, taBytes = new Uint8Array(nOutLen);
+
+  for (var nMod3, nMod4, nUint24 = 0, nOutIdx = 0, nInIdx = 0; nInIdx &lt; nInLen; nInIdx++) {
+    nMod4 = nInIdx &amp; 3;
+    nUint24 |= b64ToUint6(sB64Enc.charCodeAt(nInIdx)) &lt;&lt; 18 - 6 * nMod4;
+    if (nMod4 === 3 || nInLen - nInIdx === 1) {
+      for (nMod3 = 0; nMod3 &lt; 3 &amp;&amp; nOutIdx &lt; nOutLen; nMod3++, nOutIdx++) {
+        taBytes[nOutIdx] = nUint24 &gt;&gt;&gt; (16 &gt;&gt;&gt; nMod3 &amp; 24) &amp; 255;
+      }
+      nUint24 = 0;
+
+    }
+  }
+
+  return taBytes;
+}
+
+/* Codificación de array en una cadena Base64 */
+
+function uint6ToB64 (nUint6) {
+
+  return nUint6 &lt; 26 ?
+      nUint6 + 65
+    : nUint6 &lt; 52 ?
+      nUint6 + 71
+    : nUint6 &lt; 62 ?
+      nUint6 - 4
+    : nUint6 === 62 ?
+      43
+    : nUint6 === 63 ?
+      47
+    :
+      65;
+
+}
+
+function base64EncArr (aBytes) {
+
+  var nMod3 = 2, sB64Enc = "";
+
+  for (var nLen = aBytes.length, nUint24 = 0, nIdx = 0; nIdx &lt; nLen; nIdx++) {
+    nMod3 = nIdx % 3;
+    if (nIdx &gt; 0 &amp;&amp; (nIdx * 4 / 3) % 76 === 0) { sB64Enc += "\r\n"; }
+    nUint24 |= aBytes[nIdx] &lt;&lt; (16 &gt;&gt;&gt; nMod3 &amp; 24);
+    if (nMod3 === 2 || aBytes.length - nIdx === 1) {
+      sB64Enc += String.fromCharCode(uint6ToB64(nUint24 &gt;&gt;&gt; 18 &amp; 63), uint6ToB64(nUint24 &gt;&gt;&gt; 12 &amp; 63), uint6ToB64(nUint24 &gt;&gt;&gt; 6 &amp; 63), uint6ToB64(nUint24 &amp; 63));
+      nUint24 = 0;
+    }
+  }
+
+  return sB64Enc.substr(0, sB64Enc.length - 2 + nMod3) + (nMod3 === 2 ? '' : nMod3 === 1 ? '=' : '==');
+
+}
+
+/* De array UTF-8 a DOMString y viceversa */
+
+function UTF8ArrToStr (aBytes) {
+
+  var sView = "";
+
+  for (var nPart, nLen = aBytes.length, nIdx = 0; nIdx &lt; nLen; nIdx++) {
+    nPart = aBytes[nIdx];
+    sView += String.fromCharCode(
+      nPart &gt; 251 &amp;&amp; nPart &lt; 254 &amp;&amp; nIdx + 5 &lt; nLen ? /* six bytes */
+        /* (nPart - 252 &lt;&lt; 30) may be not so safe in ECMAScript! So...: */
+        (nPart - 252) * 1073741824 + (aBytes[++nIdx] - 128 &lt;&lt; 24) + (aBytes[++nIdx] - 128 &lt;&lt; 18) + (aBytes[++nIdx] - 128 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
+      : nPart &gt; 247 &amp;&amp; nPart &lt; 252 &amp;&amp; nIdx + 4 &lt; nLen ? /* five bytes */
+        (nPart - 248 &lt;&lt; 24) + (aBytes[++nIdx] - 128 &lt;&lt; 18) + (aBytes[++nIdx] - 128 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
+      : nPart &gt; 239 &amp;&amp; nPart &lt; 248 &amp;&amp; nIdx + 3 &lt; nLen ? /* four bytes */
+        (nPart - 240 &lt;&lt; 18) + (aBytes[++nIdx] - 128 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
+      : nPart &gt; 223 &amp;&amp; nPart &lt; 240 &amp;&amp; nIdx + 2 &lt; nLen ? /* three bytes */
+        (nPart - 224 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
+      : nPart &gt; 191 &amp;&amp; nPart &lt; 224 &amp;&amp; nIdx + 1 &lt; nLen ? /* two bytes */
+        (nPart - 192 &lt;&lt; 6) + aBytes[++nIdx] - 128
+      : /* nPart &lt; 127 ? */ /* one byte */
+        nPart
+    );
+  }
+
+  return sView;
+
+}
+
+function strToUTF8Arr (sDOMStr) {
+
+  var aBytes, nChr, nStrLen = sDOMStr.length, nArrLen = 0;
+
+  /* mapeando... */
+
+  for (var nMapIdx = 0; nMapIdx &lt; nStrLen; nMapIdx++) {
+    nChr = sDOMStr.charCodeAt(nMapIdx);
+    nArrLen += nChr &lt; 0x80 ? 1 : nChr &lt; 0x800 ? 2 : nChr &lt; 0x10000 ? 3 : nChr &lt; 0x200000 ? 4 : nChr &lt; 0x4000000 ? 5 : 6;
+  }
+
+  aBytes = new Uint8Array(nArrLen);
+
+  /* transcripción... */
+
+  for (var nIdx = 0, nChrIdx = 0; nIdx &lt; nArrLen; nChrIdx++) {
+    nChr = sDOMStr.charCodeAt(nChrIdx);
+    if (nChr &lt; 128) {
+      /* un byte */
+      aBytes[nIdx++] = nChr;
+    } else if (nChr &lt; 0x800) {
+      /* dos bytes */
+      aBytes[nIdx++] = 192 + (nChr &gt;&gt;&gt; 6);
+      aBytes[nIdx++] = 128 + (nChr &amp; 63);
+    } else if (nChr &lt; 0x10000) {
+      /* tres bytes */
+      aBytes[nIdx++] = 224 + (nChr &gt;&gt;&gt; 12);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &amp; 63);
+    } else if (nChr &lt; 0x200000) {
+      /* cuatro bytes */
+      aBytes[nIdx++] = 240 + (nChr &gt;&gt;&gt; 18);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 12 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &amp; 63);
+    } else if (nChr &lt; 0x4000000) {
+      /* cinco bytes */
+      aBytes[nIdx++] = 248 + (nChr &gt;&gt;&gt; 24);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 18 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 12 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &amp; 63);
+    } else /* if (nChr &lt;= 0x7fffffff) */ {
+      /* seis bytes */
+      aBytes[nIdx++] = 252 + (nChr &gt;&gt;&gt; 30);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 24 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 18 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 12 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
+      aBytes[nIdx++] = 128 + (nChr &amp; 63);
+    }
+  }
+
+  return aBytes;
+
+}
+</pre>
+
+<h4 id="Tests">Tests</h4>
+
+<pre class="brush: js notranslate">/* Tests */
+
+var sMyInput = "Base 64 \u2014 Mozilla Developer Network";
+
+var aMyUTF8Input = strToUTF8Arr(sMyInput);
+
+var sMyBase64 = base64EncArr(aMyUTF8Input);
+
+alert(sMyBase64);
+
+var aMyUTF8Output = base64DecToArr(sMyBase64);
+
+var sMyOutput = UTF8ArrToStr(aMyUTF8Output);
+
+alert(sMyOutput);</pre>
+
+<h4 id="Apéndice_Decodificar_una_cadena_Base64_en_Uint8Array_o_ArrayBuffer">Apéndice: Decodificar una cadena <em>Base64</em> en <a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array">Uint8Array</a> o <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">ArrayBuffer</a></h4>
+
+<p>Estas funciones nos permiten crear también <a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array">uint8Arrays</a> o <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">arrayBuffers</a> a partir de cadenas codificadas en base 64:</p>
+
+<pre class="brush: js notranslate">var myArray = base64DecToArr("QmFzZSA2NCDigJQgTW96aWxsYSBEZXZlbG9wZXIgTmV0d29yaw=="); // "Base 64 \u2014 Mozilla Developer Network"
+
+var myBuffer = base64DecToArr("QmFzZSA2NCDigJQgTW96aWxsYSBEZXZlbG9wZXIgTmV0d29yaw==").buffer; // "Base 64 \u2014 Mozilla Developer Network"
+
+alert(myBuffer.byteLength);</pre>
+
+<div class="note"><strong>Nota:</strong> La función <code>base64DecToArr(sBase64[, <em>nBlocksSize</em>])</code> devuelve un <a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array"><code>uint8Array</code></a> de bytes. Si tu objetivo es construir un búfer de datos crudos de 16, 32 o 64 bits, usa el argumento <code>nBlocksSize</code>, que es el número de bytes de los que la propiedad <code>uint8Array.buffer.bytesLength</code> debe devolver un múltiplo (1 u omitido para ASCII, <a href="/en-US/docs/Web/API/DOMString/Binary">cadenas binarias</a> o cadenas UTF-8 codificacas, 2 para cadenas UTF-16, 4 para cadenas UTF-32).</div>
+
+<p>Para una librería más completa, véase <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView">, una representación parecida a C de cadenas basadas en arrays tipados</a>.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{domxref("WindowBase64.atob","atob()")}}</li>
+ <li>{{domxref("WindowBase64.btoa","btoa()")}}</li>
+ <li><a href="/en-US/docs/data_URIs" title="/en-US/docs/data_URIs"><code>data</code> URIs</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">ArrayBuffer</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">TypedArrays</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView">ArrayBufferView</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array">Uint8Array</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code> – a C-like representation of strings based on typed arrays</a></li>
+ <li><a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString">DOMString</a></li>
+ <li><a href="/en-US/docs/URI" title="/en-US/docs/URI"><code>URI</code></a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI"><code>encodeURI()</code></a></li>
+ <li><a href="/en-US/docs/XPCOM_Interface_Reference/nsIURIFixup" title="/en-US/docs/XPCOM_Interface_Reference/nsIURIFixup"><code>nsIURIFixup()</code></a></li>
+ <li><a href="https://en.wikipedia.org/wiki/Base64" title="https://en.wikipedia.org/wiki/Base64"><code>Base64 on Wikipedia</code></a></li>
+</ul>
diff --git a/files/es/glossary/breadcrumb/index.html b/files/es/glossary/breadcrumb/index.html
new file mode 100644
index 0000000000..3bed52fd22
--- /dev/null
+++ b/files/es/glossary/breadcrumb/index.html
@@ -0,0 +1,18 @@
+---
+title: Miga de pan
+slug: Glossary/Breadcrumb
+tags:
+  - Accesibilidad
+  - Glosario
+  - Miga de pan
+  - navegación
+translation_of: Glossary/Breadcrumb
+original_slug: Glossary/miga-de-pan
+---
+<p><span class="seoSummary">Una <strong>miga de pan</strong>, o rastro de migas de pan, es una ayuda a la navegación que se sitúa normalmente entre la cabecera del sitio y el contenido principal y muestra, bien la jerarquía de la página actual en relación con la estructura del sitio desde el nivel superior o bien una lista de los enlaces utilizados para llegar a la página actual en el orden en que se han visitado. </span></p>
+
+<p>Una miga de pan para este documento se vería más o menos así:</p>
+
+<p><a href="/">MDN</a> &gt; <a href="/en-US/docs/Glossary/">Glosario</a> &gt; Miga de pan</p>
+
+<p>Los rastros de migas de pan permiten a los usuarios conocer su situación dentro de un sitio web. Este tipo de navegación, si se construye correctamente, ayuda a los usuarios a saber dónde están dentro del sitio y cómo han llegado hasta ahí. También pueden ayudar al usuario a volver a donde estaba anteriormente y pueden reducir el número de clics necesario para llegar a una página de nivel superior.</p>
diff --git a/files/es/glossary/cabecera_general/index.html b/files/es/glossary/cabecera_general/index.html
deleted file mode 100644
index d27644dad0..0000000000
--- a/files/es/glossary/cabecera_general/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: Cabecera general
-slug: Glossary/Cabecera_general
-translation_of: Glossary/General_header
----
-<p>Una <strong>cabecera general</strong> es una {{glossary('Header', 'cabecera HTTP')}} que puede ser utilizada tanto en mensajes de consultas como de respuestas pero que no se aplican al contenido en sí mismo. Dependiendo del contexto en que son usadas, las cabeceras generales pueden ser de {{glossary("Response header", "respuesta")}} o de {{glossary("request header", "consulta")}}. Sin embargo, no son {{glossary("entity header", "cabeceras de entidad.")}}.</p>
-
-<p>Las cabeceras generales más comunes son {{HTTPHeader('Date')}}, {{HTTPheader("Cache-Control")}} y {{HTTPHeader("Connection")}}.</p>
diff --git a/files/es/glossary/cache/index.html b/files/es/glossary/cache/index.html
new file mode 100644
index 0000000000..c2259b370f
--- /dev/null
+++ b/files/es/glossary/cache/index.html
@@ -0,0 +1,18 @@
+---
+title: Caché
+slug: Glossary/Cache
+tags:
+  - Glosario
+  - HTTP
+translation_of: Glossary/Cache
+original_slug: Glossary/Caché
+---
+<p>La <strong>caché </strong>(o caché web) es un componente que almacena temporalmente respuestas HTTP para que puedan ser usadas por peticiones HTTP posteriores mientras cumplan ciertas condiciones.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Cach%C3%A9_web">Caché web</a> en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/caché/index.html b/files/es/glossary/caché/index.html
deleted file mode 100644
index 1c9b861ae8..0000000000
--- a/files/es/glossary/caché/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Caché
-slug: Glossary/Caché
-tags:
-  - Glosario
-  - HTTP
-translation_of: Glossary/Cache
----
-<p>La <strong>caché </strong>(o caché web) es un componente que almacena temporalmente respuestas HTTP para que puedan ser usadas por peticiones HTTP posteriores mientras cumplan ciertas condiciones.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Cach%C3%A9_web">Caché web</a> en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/call_stack/index.html b/files/es/glossary/call_stack/index.html
new file mode 100644
index 0000000000..3eea4ae1cc
--- /dev/null
+++ b/files/es/glossary/call_stack/index.html
@@ -0,0 +1,93 @@
+---
+title: Pila de llamadas
+slug: Glossary/Call_stack
+tags:
+  - Glosario
+  - JavaScript
+  - Pila de llamadas
+translation_of: Glossary/Call_stack
+original_slug: Glossary/Pila_llamadas
+---
+<p>Una <strong>pila de llamadas</strong> es un mecanismo para que un intérprete (como el intérprete de JavaScript en un navegador web) realice un seguimiento de en que lugar se llama a múltiples {{glossary("function","funciones")}}, qué función se esta ejecutando actualmente y qué funciones son llamadas desde esa función, etc.</p>
+
+<ul>
+ <li>Cuando un script llama a una función, el intérprete la añade a la pila de llamadas y luego empieza a ejecutar la función.</li>
+ <li>Cualquier función o funciones que sean llamadas por esa función son añadidas arriba de la pila de llamadas y serán ejecutadas cuando su llamada sea alcanzada.</li>
+ <li>Cuando la función actual termina, el intérprete la elimina de la pila y reanuda la ejecución donde se quedó.</li>
+ <li>Si la pila necesita más espacio del que se le asignó, se producirá un error de "desbordamiento de pila".</li>
+</ul>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: js">function saludar() {
+   // [1] Código
+   diHola();
+   // [2] Código
+}
+function diHola() {
+   return "!Hola!";
+}
+
+// Invocar la función `saludar`
+saludar();
+
+// [3] Código
+</pre>
+
+<p>El código del ejemplo se ejecutaría de la siguiente manera:</p>
+
+<ol>
+ <li>Ignora todas las funciones hasta que alcanza la invocación de la función <code>saludar()</code>.</li>
+ <li>Añade la función <code>saludar()</code> a la lista de la pila de llamadas.
+  <div class="note">
+  <p>Lista de la pila de llamadas:<br>
+   - saludar</p>
+  </div>
+ </li>
+ <li>Ejecuta todas las líneas de código de dentro de la función <code>saludar()</code>.</li>
+ <li>Llega a la incovación de la función <code>diHola()</code>.</li>
+ <li>Añade la función <code>diHola()</code> a la lista de la pila de llamadas.
+  <div class="note">
+  <p>Lista de la pila de llamadas:<br>
+   - saludar<br>
+   - diHola</p>
+  </div>
+ </li>
+ <li>Ejecuta todas las líneas de código de dentro de la función <code>diHola()</code> hasta que llega al final.</li>
+ <li>Devuelve la ejecución a la línea que invocó a la función <code>diHola()</code> y continua con la ejecuación del resto de código de la función <code>saludar()</code>.</li>
+ <li>Elimina la función <code>diHola()</code> de la lista de la pila de llamadas.
+  <div class="note">
+  <p>Lista de la pila de llamadas:<br>
+   - saludar</p>
+  </div>
+ </li>
+ <li>Cuando todo el código dentro de la función <code>saludar()</code> ha sido ejecutado, vuelve a la línea que la invocó y continua ejecutando el resto de código JavaScript.</li>
+ <li>Elimina la función <code>saludar()</code> de la lista de la pila de llamadas.
+  <div class="note">
+  <p>Lista de la pila de llamadas:<br>
+   VACÍA</p>
+  </div>
+ </li>
+</ol>
+
+<p>En resumen, empezamos con una lista de la pila llamadas vacía. Cuando invocamos una función, ésta es automáticamente añadida a la pila de llamadas. Una vez ha ejecutado todo su código, también de manera automática es eliminada de la pila de llamadas. Finalmente, la pila de llamadas vuelve a estar vacía.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Pila de llamadas")}} en Wikipedia</li>
+</ul>
+
+<section class="Quick_links" id="Quick_Links">
+<ul>
+ <li><a href="/es-ES/docs/Glossary">Glosario</a>
+
+  <ul>
+   <li>{{Glossary("Call stack", "Pila de llamadas")}}</li>
+   <li>{{Glossary("function", "Función")}}</li>
+  </ul>
+ </li>
+</ul>
+</section>
diff --git a/files/es/glossary/caracter/index.html b/files/es/glossary/caracter/index.html
deleted file mode 100644
index 5198607137..0000000000
--- a/files/es/glossary/caracter/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: Caracter
-slug: Glossary/Caracter
-tags:
-  - CodingScripting
-  - Glosario
-  - String
-translation_of: Glossary/Character
----
-<p>Un <em>caracter</em> es un símbolo (letras, números, puntuación) o un caracter de "control" que no se imprime (p. ej., Retorno de carro o guión suave — <code>soft hypen</code>). {{Glossary("UTF-8")}} es el conjunto de caracteres más común e incluye los grafemas de los lenguajes humanos más populares.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Character (informática)")}} en Wikipedia</li>
- <li>{{interwiki("wikipedia", "Character encoding")}} en Wikipedia</li>
- <li>{{interwiki("wikipedia", "ASCII")}} en Wikipedia</li>
- <li>{{interwiki("wikipedia", "UTF-8")}} en Wikipedia</li>
- <li>{{interwiki("wikipedia", "Unicode")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/card_sorting/index.html b/files/es/glossary/card_sorting/index.html
new file mode 100644
index 0000000000..d65a7b93bf
--- /dev/null
+++ b/files/es/glossary/card_sorting/index.html
@@ -0,0 +1,19 @@
+---
+title: Clasificación por tarjetas (card sorting)
+slug: Glossary/Card_sorting
+tags:
+  - Card sorting
+  - Diseño
+  - Glosario
+translation_of: Glossary/Card_sorting
+original_slug: Glossary/Clasificación_por_tarjetas_(card_sorting)
+---
+<p>La clasificación por tarjetas (card sorting) es una técnica simple utilizada en la {{glossary("Information architecture", "arquitectura de la información")}} en la cual las personas involucradas en el diseño de una página web (u otro tipo de producto) están invitadas a describir el contenido / servicios / características que creen que el producto debería contener, para luego organizar estas características dentro de categorías o grupos. Esto se puede usar, por ejemplo, para determinar qué debe aparecer en cada página de una aplicación web. El nombre proviene del hecho de que a menudo la clasificación de las cartas se lleva a cabo literalmente escribiendo los elementos que se van a clasificar en tarjetas, y luego apilando las tarjetas.</p>
+
+<h2 id="Saber_más"><strong>Saber más</strong></h2>
+
+<h3 id="Conocimientos_generales"><strong>Conocimientos generales</strong></h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Card_sorting", "Card sorting")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/character/index.html b/files/es/glossary/character/index.html
new file mode 100644
index 0000000000..163c694890
--- /dev/null
+++ b/files/es/glossary/character/index.html
@@ -0,0 +1,23 @@
+---
+title: Caracter
+slug: Glossary/Character
+tags:
+  - CodingScripting
+  - Glosario
+  - String
+translation_of: Glossary/Character
+original_slug: Glossary/Caracter
+---
+<p>Un <em>caracter</em> es un símbolo (letras, números, puntuación) o un caracter de "control" que no se imprime (p. ej., Retorno de carro o guión suave — <code>soft hypen</code>). {{Glossary("UTF-8")}} es el conjunto de caracteres más común e incluye los grafemas de los lenguajes humanos más populares.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Character (informática)")}} en Wikipedia</li>
+ <li>{{interwiki("wikipedia", "Character encoding")}} en Wikipedia</li>
+ <li>{{interwiki("wikipedia", "ASCII")}} en Wikipedia</li>
+ <li>{{interwiki("wikipedia", "UTF-8")}} en Wikipedia</li>
+ <li>{{interwiki("wikipedia", "Unicode")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/character_set/index.html b/files/es/glossary/character_set/index.html
new file mode 100644
index 0000000000..cbfc145643
--- /dev/null
+++ b/files/es/glossary/character_set/index.html
@@ -0,0 +1,32 @@
+---
+title: Conjunto de caracteres
+slug: Glossary/character_set
+tags:
+  - Codificación de caracteres
+  - Conjunto de caracteres
+  - Glosario
+translation_of: Glossary/character_set
+original_slug: Glossary/conjunto_de_caracteres
+---
+<p><span class="seoSummary">Un <strong>conjunto de caracteres</strong> es un sistema de codificación para que las computadoras sepan cómo reconocer un {{Glossary("Character", "caracter")}}, incluidas letras, números, signos de puntuación y espacios en blanco.</span></p>
+
+<p>En épocas anteriores, los países desarrollaron sus propios conjuntos de caracteres debido a los diferentes idiomas utilizados, como los códigos Kanji JIS (por ejemplo, Shift-JIS, EUC-JP, etc.) para japonés, Big5 para chino tradicional y KOI8-R para ruso. Sin embargo, {{Glossary("Unicode")}} se convirtió gradualmente en el conjunto de caracteres más aceptable por su soporte de idiomas universal.</p>
+
+<p>Si un conjunto de caracteres se usa incorrectamente (por ejemplo, Unicode para un artículo codificado en Big5), es posible que no vean más que caracteres rotos, que se llaman {{Interwiki("wikipedia", "Mojibake")}}.</p>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li>Artículos de Wikipedia
+  <ol>
+   <li>{{Interwiki("wikipedia", "Codificación_de_caracteres", "Codificación de caracteres")}}</li>
+   <li>{{Interwiki("wikipedia", "Mojibake")}}</li>
+  </ol>
+ </li>
+ <li><a href="/es/docs/Glossary">Glosario</a>
+  <ol>
+   <li>{{Glossary("Character", "Caracter")}}</li>
+   <li>{{Glossary("Unicode")}}</li>
+  </ol>
+ </li>
+</ol>
+</section>
diff --git a/files/es/glossary/cia/index.html b/files/es/glossary/cia/index.html
new file mode 100644
index 0000000000..4e51564f39
--- /dev/null
+++ b/files/es/glossary/cia/index.html
@@ -0,0 +1,18 @@
+---
+title: CID
+slug: Glossary/CIA
+tags:
+  - Glosario
+  - Seguridad
+translation_of: Glossary/CIA
+original_slug: Glossary/CID
+---
+<p>CID (Confidencialidad, Integridad, Disponibilidad) (también llamado la triada CID o la triada DIC) es un modelo que guía las políticas de una organización para la seguridad de la información.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Seguridad_de_la_información#Concepción_de_la_seguridad_de_la_información", "CIA")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/cid/index.html b/files/es/glossary/cid/index.html
deleted file mode 100644
index 983f0d0447..0000000000
--- a/files/es/glossary/cid/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: CID
-slug: Glossary/CID
-tags:
-  - Glosario
-  - Seguridad
-translation_of: Glossary/CIA
----
-<p>CID (Confidencialidad, Integridad, Disponibilidad) (también llamado la triada CID o la triada DIC) es un modelo que guía las políticas de una organización para la seguridad de la información.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Seguridad_de_la_información#Concepción_de_la_seguridad_de_la_información", "CIA")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/cifrado/index.html b/files/es/glossary/cifrado/index.html
deleted file mode 100644
index e0679eca97..0000000000
--- a/files/es/glossary/cifrado/index.html
+++ /dev/null
@@ -1,32 +0,0 @@
----
-title: Algoritmo criptográfico
-slug: Glossary/Cifrado
-tags:
-  - Criptografía
-  - Glosario
-  - Seguridad
-  - privacidad
-translation_of: Glossary/Cipher
----
-<p>En {{glossary("cryptography", "criptografía")}}, un algoritmo criptográfico es un algoritmo que puede {{glossary("encryption", "encriptar")}} {{glossary("cleartext", "texto en lenguaje natural")}} para hacerlo ilegible, y para que sea {{glossary("decryption", "desencriptado")}} con el fin de recuperar el texto original.</p>
-
-<p>Los algoritmos de cifrado eran muy comunes mucho antes de la era de la información (e.g., <a href="https://es.wikipedia.org/wiki/Cifrado_por_sustituci%C3%B3n">cifrados por sustitucion</a> y <a href="https://es.wikipedia.org/wiki/Cifrado_por_transposici%C3%B3n">cifrados por transposición</a>), pero ninguno de ellos era criptográficamente seguros excepto <a href="https://es.wikipedia.org/wiki/Libreta_de_un_solo_uso">one-time pad</a>.</p>
-
-<p>Los algoritmos modernos de cifrado están diseñados para resistir a {{glossary("attack", "ataques")}} descubiertos por un {{glossary("cryptanalysis", "criptoanalista")}}. No hay garantía de que todos los métodos de ataque hayan sido descubiertos, pero cada algoritmo es probado contra todos los tipos de ataque conocidos.</p>
-
-<p>Los algoritmos de cifrado funcionan de dos maneras, una es como <a href="https://es.wikipedia.org/wiki/Cifrado_por_bloques">cifrado por bloques</a> en bloques sucesivos o buffers de datos, y la otra es como un <a href="https://es.wikipedia.org/wiki/Cifrador_de_flujo">cifrado en flujo</a> en un flujo continuo de datos (generalmente de audio o vídeo).</p>
-
-<p>También son clasificados en función de cómo se manejan sus  {{glossary("key", "claves")}}:</p>
-
-<ul>
- <li>Los <a href="https://es.wikipedia.org/wiki/Criptograf%C3%ADa_simétrica">algoritmos de clave simétrica</a> usan la misma clave para codificar y para decodificar un mensaje. La clave debe ser enviada de forma segura para mantener la confidencialidad del mensaje.</li>
- <li>Los <a href="https://es.wikipedia.org/wiki/Criptograf%C3%ADa_asimétrica">algoritmos de clave asimétrica</a> usan claves diferentes para codificar y para decodificar.</li>
-</ul>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Algoritmo_criptográfico">Algoritmo criptográfico</a> en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/cipher/index.html b/files/es/glossary/cipher/index.html
new file mode 100644
index 0000000000..5cf2de6446
--- /dev/null
+++ b/files/es/glossary/cipher/index.html
@@ -0,0 +1,33 @@
+---
+title: Algoritmo criptográfico
+slug: Glossary/Cipher
+tags:
+  - Criptografía
+  - Glosario
+  - Seguridad
+  - privacidad
+translation_of: Glossary/Cipher
+original_slug: Glossary/Cifrado
+---
+<p>En {{glossary("cryptography", "criptografía")}}, un algoritmo criptográfico es un algoritmo que puede {{glossary("encryption", "encriptar")}} {{glossary("cleartext", "texto en lenguaje natural")}} para hacerlo ilegible, y para que sea {{glossary("decryption", "desencriptado")}} con el fin de recuperar el texto original.</p>
+
+<p>Los algoritmos de cifrado eran muy comunes mucho antes de la era de la información (e.g., <a href="https://es.wikipedia.org/wiki/Cifrado_por_sustituci%C3%B3n">cifrados por sustitucion</a> y <a href="https://es.wikipedia.org/wiki/Cifrado_por_transposici%C3%B3n">cifrados por transposición</a>), pero ninguno de ellos era criptográficamente seguros excepto <a href="https://es.wikipedia.org/wiki/Libreta_de_un_solo_uso">one-time pad</a>.</p>
+
+<p>Los algoritmos modernos de cifrado están diseñados para resistir a {{glossary("attack", "ataques")}} descubiertos por un {{glossary("cryptanalysis", "criptoanalista")}}. No hay garantía de que todos los métodos de ataque hayan sido descubiertos, pero cada algoritmo es probado contra todos los tipos de ataque conocidos.</p>
+
+<p>Los algoritmos de cifrado funcionan de dos maneras, una es como <a href="https://es.wikipedia.org/wiki/Cifrado_por_bloques">cifrado por bloques</a> en bloques sucesivos o buffers de datos, y la otra es como un <a href="https://es.wikipedia.org/wiki/Cifrador_de_flujo">cifrado en flujo</a> en un flujo continuo de datos (generalmente de audio o vídeo).</p>
+
+<p>También son clasificados en función de cómo se manejan sus  {{glossary("key", "claves")}}:</p>
+
+<ul>
+ <li>Los <a href="https://es.wikipedia.org/wiki/Criptograf%C3%ADa_simétrica">algoritmos de clave simétrica</a> usan la misma clave para codificar y para decodificar un mensaje. La clave debe ser enviada de forma segura para mantener la confidencialidad del mensaje.</li>
+ <li>Los <a href="https://es.wikipedia.org/wiki/Criptograf%C3%ADa_asimétrica">algoritmos de clave asimétrica</a> usan claves diferentes para codificar y para decodificar.</li>
+</ul>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Algoritmo_criptográfico">Algoritmo criptográfico</a> en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/ciphertext/index.html b/files/es/glossary/ciphertext/index.html
new file mode 100644
index 0000000000..734da35770
--- /dev/null
+++ b/files/es/glossary/ciphertext/index.html
@@ -0,0 +1,20 @@
+---
+title: Texto Cifrado
+slug: Glossary/Ciphertext
+tags:
+  - Cryptography
+  - Glossary
+  - Privacy
+  - Security
+translation_of: Glossary/Ciphertext
+original_slug: Glossary/TextoCifrado
+---
+<p>En {{glossary("Cryptography", "Criptografía")}}, un texto cifrado es un mensaje codificado que transmite información pero no es legible a menos que se {{glossary("decryption","descifre")}} con el {{glossary("cipher", "algoritmo criptográfico")}} correcto y el secreto correcto (generalmente una {{glossary("key","clave")}}), reproduciendo el {{glossary("cleartext", "texto simple")}} original. La seguridad de un texto cifrado, y por lo tanto el secreto de la información contenida, depende de usar un cifrado seguro y mantener la clave en secreto.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Ciphertext")}} on Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/clasificación_por_tarjetas_(card_sorting)/index.html b/files/es/glossary/clasificación_por_tarjetas_(card_sorting)/index.html
deleted file mode 100644
index a9b2638bb2..0000000000
--- a/files/es/glossary/clasificación_por_tarjetas_(card_sorting)/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Clasificación por tarjetas (card sorting)
-slug: Glossary/Clasificación_por_tarjetas_(card_sorting)
-tags:
-  - Card sorting
-  - Diseño
-  - Glosario
-translation_of: Glossary/Card_sorting
----
-<p>La clasificación por tarjetas (card sorting) es una técnica simple utilizada en la {{glossary("Information architecture", "arquitectura de la información")}} en la cual las personas involucradas en el diseño de una página web (u otro tipo de producto) están invitadas a describir el contenido / servicios / características que creen que el producto debería contener, para luego organizar estas características dentro de categorías o grupos. Esto se puede usar, por ejemplo, para determinar qué debe aparecer en cada página de una aplicación web. El nombre proviene del hecho de que a menudo la clasificación de las cartas se lleva a cabo literalmente escribiendo los elementos que se van a clasificar en tarjetas, y luego apilando las tarjetas.</p>
-
-<h2 id="Saber_más"><strong>Saber más</strong></h2>
-
-<h3 id="Conocimientos_generales"><strong>Conocimientos generales</strong></h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Card_sorting", "Card sorting")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/clausura/index.html b/files/es/glossary/clausura/index.html
deleted file mode 100644
index 2f4cbbb479..0000000000
--- a/files/es/glossary/clausura/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: Clausura
-slug: Glossary/Clausura
-tags:
-  - Glosario
-translation_of: Glossary/Closure
----
-<p>Una clausura o <em>closure</em> es una función que guarda referencias del estado adyacente (<strong>{{glossary("scope", "ámbito léxico")}}</strong>). En otras palabras, una clausura permite acceder al ámbito de una función exterior desde una función interior. En {{glossary("JavaScript")}}, las clausuras se crean cada vez que una <strong>{{glossary("function","función")}}</strong> es creada.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Clausura (informática)", "Clausura")}} en Wikipedia</li>
-</ul>
-
-<h3 id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Closures">Clausuras</a> en MDN</li>
-</ul>
diff --git a/files/es/glossary/clave/index.html b/files/es/glossary/clave/index.html
deleted file mode 100644
index b228776065..0000000000
--- a/files/es/glossary/clave/index.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Clave
-slug: Glossary/Clave
-tags:
-  - Criptografía
-  - Glosario
-  - Seguridad
-translation_of: Glossary/Key
----
-<p>Una clave es una pieza de información utilizada por un algoritmo criptográfico para el {{Glossary("encryption", "cifrado")}} y/o {{Glossary("decryption", "descifrado")}}. Los mensajes cifrados deben permanecer seguros incluso si todo lo relacionado con el {{Glossary("cryptosystem","sistema de cifrado")}}, excepto la clave, es de conocimiento público.</p>
-
-<p>En la {{Glossary("symmetric-key cryptography", "criptografía de clave simétrica")}}, la misma clave se utiliza tanto para el cifrado como para el descifrado. En la criptografía de clave pública, existen un par de claves relacionadas conocidas como <em>clave pública</em> y <em>clave privada</em>. La clave pública está disponible libremente, mientras que la clave privada se mantiene secreta. La clave pública puede cifrar mensajes que sólo la clave privada correspondiente puede descifrar, y viceversa.</p>
-
-<p><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="font-size: 37.33327865600586px;"><strong>Saber más</strong></span></font></p>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Principios_de_Kerckhoffs">Principos de Kerckhoffs</a> en Wikipedia</li>
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Glossary/Cifrado">Cifrado</a></li>
-</ul>
diff --git a/files/es/glossary/closure/index.html b/files/es/glossary/closure/index.html
new file mode 100644
index 0000000000..5f4fb688d7
--- /dev/null
+++ b/files/es/glossary/closure/index.html
@@ -0,0 +1,23 @@
+---
+title: Clausura
+slug: Glossary/Closure
+tags:
+  - Glosario
+translation_of: Glossary/Closure
+original_slug: Glossary/Clausura
+---
+<p>Una clausura o <em>closure</em> es una función que guarda referencias del estado adyacente (<strong>{{glossary("scope", "ámbito léxico")}}</strong>). En otras palabras, una clausura permite acceder al ámbito de una función exterior desde una función interior. En {{glossary("JavaScript")}}, las clausuras se crean cada vez que una <strong>{{glossary("function","función")}}</strong> es creada.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Clausura (informática)", "Clausura")}} en Wikipedia</li>
+</ul>
+
+<h3 id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Closures">Clausuras</a> en MDN</li>
+</ul>
diff --git a/files/es/glossary/cms/index.html b/files/es/glossary/cms/index.html
new file mode 100644
index 0000000000..70fbfac3eb
--- /dev/null
+++ b/files/es/glossary/cms/index.html
@@ -0,0 +1,19 @@
+---
+title: Sistema de gestión de contenidos
+slug: Glossary/CMS
+tags:
+  - CMS
+  - Glosario
+  - Sistema de gestión de contenidos
+translation_of: Glossary/CMS
+original_slug: Glossary/Sistema_gestion_contenidos
+---
+<p>Un sistema de gestión de contenidos o CMS es un programa informático que permite a los usuarios publicar, organizar, cambiar o eliminar diferentes tipos de contenido como texto, imágenes incrustadas, video, audio y código interactivo.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Sistema de gestión de contenidos")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/coercion/index.html b/files/es/glossary/coercion/index.html
deleted file mode 100644
index 02721fad10..0000000000
--- a/files/es/glossary/coercion/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: Coerción
-slug: Glossary/coercion
-translation_of: Glossary/Type_coercion
----
-<p>La coerción es la conversión automática o implicita de valores de un tipo de dato a otro (Ejemplo: de cadena de texto a número). La conversión es similar a la coerción porque ambas convierten valores de un tipo de dato a otro pero con una diferencia clave - la coerción es implícita mientras que la conversión puede ser implícita o explícita.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<pre class="brush: js">const valor1 = '5';
-const valor2 = 9;
-let suma = valor1 + valor2;
-
-console.log(suma);</pre>
-
-<p>En el ejemplo anterior, JavaScript ha coercido el <code>9</code> de nùmero a cadena de texto y luego ha concatenado los dos valores resultando en una cadena de texto de <code>59</code>. JavaScript tuvo la opción de coercer a cadena de texto o número y decidió usar número.</p>
-
-<p>El compilador pudo haber coercido el <code>5</code> a un número y retornar el valor de <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">14</span></font>, pero no lo hizo. Para retornar ese resultado, tendrías que convertir explícitamente el <code>5</code> a un número usando el método <code>Number()</code>:</p>
-
-<pre class="brush: js">sumar = Number(valor1) + valor2</pre>
-
-<section class="Quick_links" id="Quick_Links"></section>
diff --git a/files/es/glossary/conjunto_de_caracteres/index.html b/files/es/glossary/conjunto_de_caracteres/index.html
deleted file mode 100644
index 27e5a7345c..0000000000
--- a/files/es/glossary/conjunto_de_caracteres/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title: Conjunto de caracteres
-slug: Glossary/conjunto_de_caracteres
-tags:
-  - Codificación de caracteres
-  - Conjunto de caracteres
-  - Glosario
-translation_of: Glossary/character_set
----
-<p><span class="seoSummary">Un <strong>conjunto de caracteres</strong> es un sistema de codificación para que las computadoras sepan cómo reconocer un {{Glossary("Character", "caracter")}}, incluidas letras, números, signos de puntuación y espacios en blanco.</span></p>
-
-<p>En épocas anteriores, los países desarrollaron sus propios conjuntos de caracteres debido a los diferentes idiomas utilizados, como los códigos Kanji JIS (por ejemplo, Shift-JIS, EUC-JP, etc.) para japonés, Big5 para chino tradicional y KOI8-R para ruso. Sin embargo, {{Glossary("Unicode")}} se convirtió gradualmente en el conjunto de caracteres más aceptable por su soporte de idiomas universal.</p>
-
-<p>Si un conjunto de caracteres se usa incorrectamente (por ejemplo, Unicode para un artículo codificado en Big5), es posible que no vean más que caracteres rotos, que se llaman {{Interwiki("wikipedia", "Mojibake")}}.</p>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li>Artículos de Wikipedia
-  <ol>
-   <li>{{Interwiki("wikipedia", "Codificación_de_caracteres", "Codificación de caracteres")}}</li>
-   <li>{{Interwiki("wikipedia", "Mojibake")}}</li>
-  </ol>
- </li>
- <li><a href="/es/docs/Glossary">Glosario</a>
-  <ol>
-   <li>{{Glossary("Character", "Caracter")}}</li>
-   <li>{{Glossary("Unicode")}}</li>
-  </ol>
- </li>
-</ol>
-</section>
diff --git a/files/es/glossary/constant/index.html b/files/es/glossary/constant/index.html
new file mode 100644
index 0000000000..d036a7c989
--- /dev/null
+++ b/files/es/glossary/constant/index.html
@@ -0,0 +1,21 @@
+---
+title: Constante
+slug: Glossary/Constant
+tags:
+  - CodingScripting
+  - Constante
+  - Glosario
+translation_of: Glossary/Constant
+original_slug: Glossary/Constante
+---
+<p>Una constante es un valor que el programador no puede cambiar, por ejemplo números (1, 2, 42). Con {{glossary("variable","variables")}}, por otra parte, el programador puede asignar un nuevo {{glossary("value", "valor")}} a una variable cuyo nombre ya esté en uso.</p>
+
+<p>Al igual que las variables, algunas constantes están unidas a identificadores. Por ejemplo, el identificador <code>pi</code> podría estar vinculado al valor 3.14... .</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Constante_(informática)", "Constante")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/constante/index.html b/files/es/glossary/constante/index.html
deleted file mode 100644
index 41d4efb98a..0000000000
--- a/files/es/glossary/constante/index.html
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Constante
-slug: Glossary/Constante
-tags:
-  - CodingScripting
-  - Constante
-  - Glosario
-translation_of: Glossary/Constant
----
-<p>Una constante es un valor que el programador no puede cambiar, por ejemplo números (1, 2, 42). Con {{glossary("variable","variables")}}, por otra parte, el programador puede asignar un nuevo {{glossary("value", "valor")}} a una variable cuyo nombre ya esté en uso.</p>
-
-<p>Al igual que las variables, algunas constantes están unidas a identificadores. Por ejemplo, el identificador <code>pi</code> podría estar vinculado al valor 3.14... .</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Constante_(informática)", "Constante")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/criptoanálisis/index.html b/files/es/glossary/criptoanálisis/index.html
deleted file mode 100644
index c56576e600..0000000000
--- a/files/es/glossary/criptoanálisis/index.html
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Criptoanálisis
-slug: Glossary/Criptoanálisis
-tags:
-  - Criptografía
-  - Glosario
-  - Seguridad
-  - privacidad
-translation_of: Glossary/Cryptanalysis
----
-<p dir="ltr" id="tw-target-text">El criptoanálisis es la rama de {{glossary ("cryptography","criptografía")}} que estudia cómo romper códigos y criptosistemas. El criptoanálisis crea técnicas para romper {{glossary ("cipher", "cifrados")}}, en particular por métodos más eficientes que una búsqueda por fuerza bruta. Además de los métodos tradicionales como el análisis de frecuencia y el índice de coincidencia, el criptoanálisis incluye métodos más recientes, como el criptoanálisis lineal o el criptoanálisis diferencial, que puede romper cifrados más avanzados.</p>
-
-<p> </p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Criptoanálisis">Criptoanálisis</a> en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/criptografía/index.html b/files/es/glossary/criptografía/index.html
deleted file mode 100644
index cfd3f498db..0000000000
--- a/files/es/glossary/criptografía/index.html
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Criptografía
-slug: Glossary/Criptografía
-tags:
-  - Criptografía
-  - Glosario
-  - Seguridad
-  - privacidad
-translation_of: Glossary/Cryptography
----
-<p><span class="seoSummary">Criptografía, o criptología, es la ciencia que estudia como codificar y transmitir mensajes de manera segura. La criptografía diseña y estudia algoritmos que son usados para la codificación y decoficación de mensajes en un entorno inseguro y sus aplicaciones.</span> Más que confidencialidad de información, la criptografía también aborda la identificación, autenticación, el no repudio y la integridad de la información. Para ello tambien estudia el uso de métodos criptográficos en contexto, criptosistemas.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Criptografía")}} en Wikipedia</li>
- <li>{{glossary("Cryptanalysis")}}</li>
- <li><a href="https://developer.mozilla.org/en-US/Learn/tutorial/Information_Security_Basics">T</a><a href="/en-US/docs/Web/Security/Information_Security_Basics">utorial de seguridad de la información</a></li>
-</ul>
diff --git a/files/es/glossary/cryptanalysis/index.html b/files/es/glossary/cryptanalysis/index.html
new file mode 100644
index 0000000000..e390d9d650
--- /dev/null
+++ b/files/es/glossary/cryptanalysis/index.html
@@ -0,0 +1,22 @@
+---
+title: Criptoanálisis
+slug: Glossary/Cryptanalysis
+tags:
+  - Criptografía
+  - Glosario
+  - Seguridad
+  - privacidad
+translation_of: Glossary/Cryptanalysis
+original_slug: Glossary/Criptoanálisis
+---
+<p dir="ltr" id="tw-target-text">El criptoanálisis es la rama de {{glossary ("cryptography","criptografía")}} que estudia cómo romper códigos y criptosistemas. El criptoanálisis crea técnicas para romper {{glossary ("cipher", "cifrados")}}, en particular por métodos más eficientes que una búsqueda por fuerza bruta. Además de los métodos tradicionales como el análisis de frecuencia y el índice de coincidencia, el criptoanálisis incluye métodos más recientes, como el criptoanálisis lineal o el criptoanálisis diferencial, que puede romper cifrados más avanzados.</p>
+
+<p> </p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Criptoanálisis">Criptoanálisis</a> en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/cryptography/index.html b/files/es/glossary/cryptography/index.html
new file mode 100644
index 0000000000..6b0e1043fa
--- /dev/null
+++ b/files/es/glossary/cryptography/index.html
@@ -0,0 +1,22 @@
+---
+title: Criptografía
+slug: Glossary/Cryptography
+tags:
+  - Criptografía
+  - Glosario
+  - Seguridad
+  - privacidad
+translation_of: Glossary/Cryptography
+original_slug: Glossary/Criptografía
+---
+<p><span class="seoSummary">Criptografía, o criptología, es la ciencia que estudia como codificar y transmitir mensajes de manera segura. La criptografía diseña y estudia algoritmos que son usados para la codificación y decoficación de mensajes en un entorno inseguro y sus aplicaciones.</span> Más que confidencialidad de información, la criptografía también aborda la identificación, autenticación, el no repudio y la integridad de la información. Para ello tambien estudia el uso de métodos criptográficos en contexto, criptosistemas.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Criptografía")}} en Wikipedia</li>
+ <li>{{glossary("Cryptanalysis")}}</li>
+ <li><a href="https://developer.mozilla.org/en-US/Learn/tutorial/Information_Security_Basics">T</a><a href="/en-US/docs/Web/Security/Information_Security_Basics">utorial de seguridad de la información</a></li>
+</ul>
diff --git a/files/es/glossary/css_preprocessor/index.html b/files/es/glossary/css_preprocessor/index.html
new file mode 100644
index 0000000000..db56737d8d
--- /dev/null
+++ b/files/es/glossary/css_preprocessor/index.html
@@ -0,0 +1,22 @@
+---
+title: Preprocesador CSS
+slug: Glossary/CSS_preprocessor
+translation_of: Glossary/CSS_preprocessor
+original_slug: Glossary/Preprocesador_CSS
+---
+<p><span class="seoSummary">Un preprocesador CSS es un programa que te permite generar {{Glossary("CSS")}} a partir de la {{Glossary("syntax")}} única del preprocesador. </span>Existen varios preprocesadores CSS de los cuales escoger, sin embargo la mayoría de preprocesadores CSS añadiran algunas características que no existen en CSS puro, como {{Glossary("variable")}}, mixins, selectores anidados, entre otros. Estas características hacen la estructura de CSS más legible y fácil de mantener.</p>
+
+<p>Para utilizar un preprocesador CSS debes instalar un compilador CSS en tu web  {{Glossary("server")}}.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<p>Estos son algunos de lo preprocesadores CSS más populares:</p>
+
+<ul>
+ <li><a href="http://sass-lang.com/">SASS</a></li>
+ <li><a href="http://lesscss.org/">LESS</a></li>
+ <li><a href="http://stylus-lang.com/">Stylus</a></li>
+ <li><a href="http://postcss.org/">PostCSS</a></li>
+</ul>
diff --git a/files/es/glossary/data_structure/index.html b/files/es/glossary/data_structure/index.html
new file mode 100644
index 0000000000..016b605981
--- /dev/null
+++ b/files/es/glossary/data_structure/index.html
@@ -0,0 +1,19 @@
+---
+title: Estructura de datos
+slug: Glossary/Data_structure
+tags:
+  - Codificación
+  - Estructura de datos
+  - Glosario
+translation_of: Glossary/Data_structure
+original_slug: Glossary/Estructura_de_datos
+---
+<p><strong>Estructura de datos</strong> es una forma particular de organizar datos para que puedan ser usados eficientemente.</p>
+
+<h2 id="Aprende_másEdit">Aprende más<a class="button section-edit only-icon" href="https://developer.mozilla.org/en-US/docs/Glossary/Accessibility$edit#Learn_more" rel="nofollow, noindex"><span>Edit</span></a></h2>
+
+<h3 class="highlight-spanned" id="Conocimiento_general"><span class="highlight-span">Conocimiento general</span></h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Estructura_de_datos", "Estructura de datos")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/decryption/index.html b/files/es/glossary/decryption/index.html
new file mode 100644
index 0000000000..6fa7ee3da6
--- /dev/null
+++ b/files/es/glossary/decryption/index.html
@@ -0,0 +1,34 @@
+---
+title: Descifrado
+slug: Glossary/Decryption
+tags:
+  - Criptografía
+  - Glosario
+  - Seguridad
+  - privacidad
+translation_of: Glossary/Decryption
+original_slug: Glossary/Descifrado
+---
+<p> </p>
+
+<p>En {{glossary("cryptography" ,"criptografía")}}, el descifrado es la conversión de {{glossary("Ciphertext", "texto cifrado")}} en {{glossary("Plaintext", "texto simple")}}.</p>
+
+<p>El descifrado es una primitiva criptográfica: transforma un mensaje de texto cifrado en texto simple utilizando un algoritmo criptográfico llamado {{glossary("cipher", "cifrado")}}. Al igual que el cifrado, el descifrado en cifrados modernos se realiza mediante un algoritmo específico y una {{glossary("Key", "clave")}}. Dado que el algoritmo suele ser público, la clave debe permanecer secreta si el cifrado se mantiene seguro.</p>
+
+<p> </p>
+
+<p><img alt=""><img alt="The decryption primitive." src="https://mdn.mozillademos.org/files/9817/Decryption.png" style="height: 81px; width: 485px;"></p>
+
+<p>El descifrado es el reverso del {{glossary("Encryption", "cifrado")}} y si la clave permanece secreta, el descifrado sin conocer el secreto específico, entonces el descifrado es matemáticamente difícil de realizar. El grado de dificultad depende de la seguridad del algoritmo criptográfico elegido, que está en constante evolución mediante el progreso del {{glossary("cryptanalysis", "criptoanálisis")}}.</p>
+
+<p> </p>
+
+<p> </p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 class="highlight-spanned" id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Archive/Security/Encriptación_y_Desencriptación">Cifrado y descifrado</a></li>
+</ul>
diff --git a/files/es/glossary/descifrado/index.html b/files/es/glossary/descifrado/index.html
deleted file mode 100644
index 838c76438b..0000000000
--- a/files/es/glossary/descifrado/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: Descifrado
-slug: Glossary/Descifrado
-tags:
-  - Criptografía
-  - Glosario
-  - Seguridad
-  - privacidad
-translation_of: Glossary/Decryption
----
-<p> </p>
-
-<p>En {{glossary("cryptography" ,"criptografía")}}, el descifrado es la conversión de {{glossary("Ciphertext", "texto cifrado")}} en {{glossary("Plaintext", "texto simple")}}.</p>
-
-<p>El descifrado es una primitiva criptográfica: transforma un mensaje de texto cifrado en texto simple utilizando un algoritmo criptográfico llamado {{glossary("cipher", "cifrado")}}. Al igual que el cifrado, el descifrado en cifrados modernos se realiza mediante un algoritmo específico y una {{glossary("Key", "clave")}}. Dado que el algoritmo suele ser público, la clave debe permanecer secreta si el cifrado se mantiene seguro.</p>
-
-<p> </p>
-
-<p><img alt=""><img alt="The decryption primitive." src="https://mdn.mozillademos.org/files/9817/Decryption.png" style="height: 81px; width: 485px;"></p>
-
-<p>El descifrado es el reverso del {{glossary("Encryption", "cifrado")}} y si la clave permanece secreta, el descifrado sin conocer el secreto específico, entonces el descifrado es matemáticamente difícil de realizar. El grado de dificultad depende de la seguridad del algoritmo criptográfico elegido, que está en constante evolución mediante el progreso del {{glossary("cryptanalysis", "criptoanálisis")}}.</p>
-
-<p> </p>
-
-<p> </p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 class="highlight-spanned" id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Archive/Security/Encriptación_y_Desencriptación">Cifrado y descifrado</a></li>
-</ul>
diff --git a/files/es/glossary/dhtml/index.html b/files/es/glossary/dhtml/index.html
new file mode 100644
index 0000000000..5163f10090
--- /dev/null
+++ b/files/es/glossary/dhtml/index.html
@@ -0,0 +1,48 @@
+---
+title: DHTML
+slug: Glossary/DHTML
+tags:
+  - DHTML
+  - Todas_las_Categorías
+translation_of: Glossary/DHTML
+original_slug: DHTML
+---
+<p>
+</p>
+<div><b>DHTML es la abreviatura de "HTML dinámico"</b>.El término DHTML se usa generalmente para referirse al código del que están hechas las páginas web interactivas que no requieren la utilización de plugins tales como Flash o Java.El término abarca las funcionalidades disponibles para los desarrolladores web que utilizan las tecnologías <a href="es/HTML">HTML</a>, <a href="es/CSS">CSS</a>, <a href="es/DOM">Document Object Model</a>, y <a href="es/JavaScript">JavaScript</a> de forma combinada.
+</div>
+<table class="topicpage-table">
+<tbody><tr><td>
+<h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"> <a>Documentación</a> </h4>
+<dl><dt> <a href="es/Referencia_de_Objetos_Clientes_DOM">Referencia de Objetos Clientes DOM</a>
+</dt><dd> <small>Esta referencia de objetos clientes proporciona información sobre los objetos usados comúnmente en DHTML, y su intención es ayudar a determinar que propiedades están soportadas en cada navegador.</small>
+</dd></dl>
+<dl><dt> <a href="es/DHTML_Demostraciones_del_uso_de_DOM%2f%2fStyle">DHTML Demostraciones del uso de DOM/Style</a>
+</dt><dd> <small>Demostraciones de Modelo de Objetos del Documento(DOM) , Cross-browser widgets, y recursos adicionales para aprender sobre DOM.</small>
+</dd></dl>
+<dl><dt> <a href="es/Soluci%c3%b3n_a_errores_DHTML_en_Firefox_1.0.3">Solución a errores DHTML en Firefox 1.0.3</a>
+</dt><dd> <small>Tenga en cuenta que los problemas tratados en este artículo se han solucionado en la versión 1.0.4 de Firefox, y este documento solo es de aplicación a las versiones 1.0.3 del navegador.
+</small></dd></dl>
+<p>
+</p><p><span class="alllinks"><a>View All...</a></span>
+</p>
+</td>
+<td>
+<h4 id="Comunidad" name="Comunidad"> Comunidad </h4>
+<ul><li> Ver foros en Mozilla ...
+</li></ul>
+<p>{{ DiscussionList("dev-ajax", "mozilla.dev.ajax") }}
+</p>
+<h4 id="Herramientas" name="Herramientas"> Herramientas </h4>
+<ul><li> <a class="link-https" href="https://addons.mozilla.org/extensions/moreinfo.php?id=1843&amp;application=firefox">Extensión Firebug para Firefox</a>
+</li></ul>
+<h4 id="Temas_Relacionados" name="Temas_Relacionados"> Temas Relacionados </h4>
+<dl><dd> <a href="es/AJAX">AJAX</a>, <a href="es/CSS">CSS</a>, <a href="es/DOM">DOM</a>, <a href="es/HTML">HTML</a>, <a href="es/JavaScript">JavaScript</a>
+</dd></dl>
+</td>
+</tr>
+</tbody></table>
+<p><span class="comment">Categories</span>
+</p><p><span class="comment">Interwiki Language Links</span>
+</p><p><br>
+</p>{{ languages( { "en": "en/DHTML", "fr": "fr/DHTML", "ja": "ja/DHTML", "ko": "ko/DHTML", "pl": "pl/DHTML", "pt": "pt/DHTML" } ) }}
diff --git a/files/es/glossary/domain_name/index.html b/files/es/glossary/domain_name/index.html
new file mode 100644
index 0000000000..dfe5a9fe3b
--- /dev/null
+++ b/files/es/glossary/domain_name/index.html
@@ -0,0 +1,16 @@
+---
+title: Nombre de dominio
+slug: Glossary/Domain_name
+translation_of: Glossary/Domain_name
+original_slug: Glossary/Nombre_de_dominio
+---
+<p>Un nombre de dominio es la dirección de un sitio web en {{Glossary("Internet")}}. Los nombres de dominio se utilizan en {{Glossary("URL","URLs")}} para identificar a qué servidor pertenece una página web específica. El nombre de dominio consiste en una secuencia jerárquica de nombres (etiquetas) separados por puntos y que terminan con una {{glossary("TLD","extensión")}}.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimientos_generales"><strong>Conocimientos generales</strong></h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Dominio_de_Internet", "Dominio de Internet")}} en Wikipedia</li>
+ <li><a href="/en-US/Learn/Understanding_domain_names">Entendiendo los nombres de los dominios</a></li>
+</ul>
diff --git a/files/es/glossary/dtd/index.html b/files/es/glossary/dtd/index.html
deleted file mode 100644
index d59af84200..0000000000
--- a/files/es/glossary/dtd/index.html
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: DTD
-slug: Glossary/DTD
-translation_of: Glossary/Doctype
-translation_of_original: Glossary/DTD
----
-<p>{{page("/en-US/docs/Glossary/Doctype")}}</p>
diff --git a/files/es/glossary/dynamic_typing/index.html b/files/es/glossary/dynamic_typing/index.html
new file mode 100644
index 0000000000..56797b0663
--- /dev/null
+++ b/files/es/glossary/dynamic_typing/index.html
@@ -0,0 +1,25 @@
+---
+title: Tipado Dinámico
+slug: Glossary/Dynamic_typing
+tags:
+  - Código
+  - Glosario
+  - LenguajeDeProgramación
+translation_of: Glossary/Dynamic_typing
+original_slug: Glossary/Tipado_dinámico
+---
+<p><strong>Los lenguajes de tipado dinámico</strong> son aquellos (como {{glossary("JavaScript")}}) donde el intérprete asigna a las {{glossary("variable","variables")}} un {{glossary("tipo")}} durante el tiempo de ejecución basado en su {{glossary("valor")}} en ese momento.</p>
+
+<h2 id="Ver_más">Ver más</h2>
+
+<h3 id="Conoce_sobre_el_tema">Conoce sobre el tema</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Data_structures">Tipos de datos y estructuras de datos en Javascript</a></li>
+</ul>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Sistema_de_tipos", "Sistema de tipos")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/elemento/index.html b/files/es/glossary/elemento/index.html
deleted file mode 100644
index a947c1e053..0000000000
--- a/files/es/glossary/elemento/index.html
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: elemento
-slug: Glossary/elemento
-tags:
-  - Junk
----
-<p>Componentes que especifican como los documentos HTML deben ser construidos y que tipo de contenido debe ser posicionado en que lugar de un documento HTML.</p>
diff --git a/files/es/glossary/encriptación/index.html b/files/es/glossary/encriptación/index.html
deleted file mode 100644
index 4d98cc9ad5..0000000000
--- a/files/es/glossary/encriptación/index.html
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Encriptación
-slug: Glossary/Encriptación
-tags:
-  - Criptografía
-  - Glosario
-  - Seguridad
-  - privacidad
-translation_of: Glossary/Encryption
----
-<p>En {{glossary("cryptography", "criptografía")}}, la <strong>encriptación</strong> es la conversión del {{glossary("cleartext", "lenguaje natural")}} en un texto codificado o {{glossary("ciphertext", "cifrado")}}. Un texto cifrado es utilizado para ser ilegible por lectores no autorizados.</p>
-
-<p>La encriptación es una primitiva criptográfica: transforma un mensaje en texto plano en un texto cifrado usando un {{glossary("cipher", "algoritmo criptográfico")}}. La encriptación en los algoritmos modernos se lleva a cabo usando un algoritmo específico y un secreto, llamado la {{glossary("key", "clave")}}. Ya que la mayoría de los algoritmos son públicos, la clave debe ser secreta para que la encriptación sea segura.</p>
-
-<p><img alt="How encryption works." src="https://mdn.mozillademos.org/files/9815/Encryption.png" style="height: 108px; width: 472px;"></p>
-
-<p>Sin conocer el secreto, la operación inversa, {{glossary("decryption", "desencriptación")}}, es matemáticamente costosa de realizar. Cómo de difícil resulte depende de la seguridad del algoritmo criptográfico elegido y evoluciona con el progreso del {{glossary("cryptanalysis", "criptoanálisis")}}.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<ul>
- <li>Saber má sobre <a href="/es/docs/Archive/Security/Encriptación_y_Desencriptación">Encriptación y Desencriptación</a></li>
-</ul>
diff --git a/files/es/glossary/encryption/index.html b/files/es/glossary/encryption/index.html
new file mode 100644
index 0000000000..44c2438f4f
--- /dev/null
+++ b/files/es/glossary/encryption/index.html
@@ -0,0 +1,24 @@
+---
+title: Encriptación
+slug: Glossary/Encryption
+tags:
+  - Criptografía
+  - Glosario
+  - Seguridad
+  - privacidad
+translation_of: Glossary/Encryption
+original_slug: Glossary/Encriptación
+---
+<p>En {{glossary("cryptography", "criptografía")}}, la <strong>encriptación</strong> es la conversión del {{glossary("cleartext", "lenguaje natural")}} en un texto codificado o {{glossary("ciphertext", "cifrado")}}. Un texto cifrado es utilizado para ser ilegible por lectores no autorizados.</p>
+
+<p>La encriptación es una primitiva criptográfica: transforma un mensaje en texto plano en un texto cifrado usando un {{glossary("cipher", "algoritmo criptográfico")}}. La encriptación en los algoritmos modernos se lleva a cabo usando un algoritmo específico y un secreto, llamado la {{glossary("key", "clave")}}. Ya que la mayoría de los algoritmos son públicos, la clave debe ser secreta para que la encriptación sea segura.</p>
+
+<p><img alt="How encryption works." src="https://mdn.mozillademos.org/files/9815/Encryption.png" style="height: 108px; width: 472px;"></p>
+
+<p>Sin conocer el secreto, la operación inversa, {{glossary("decryption", "desencriptación")}}, es matemáticamente costosa de realizar. Cómo de difícil resulte depende de la seguridad del algoritmo criptográfico elegido y evoluciona con el progreso del {{glossary("cryptanalysis", "criptoanálisis")}}.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<ul>
+ <li>Saber má sobre <a href="/es/docs/Archive/Security/Encriptación_y_Desencriptación">Encriptación y Desencriptación</a></li>
+</ul>
diff --git a/files/es/glossary/entidad/index.html b/files/es/glossary/entidad/index.html
deleted file mode 100644
index cc6ebf2682..0000000000
--- a/files/es/glossary/entidad/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: Entidad
-slug: Glossary/Entidad
-tags:
-  - Caractères
-  - HTML
-  - entidad
-translation_of: Glossary/Entity
----
-<p><span class="seoSummary">Una <strong>entidad </strong>{{glossary("HTML")}} es un conjunto de caracteres ("string") que comienza con un ampersand (<code>&amp;</code>) y termina con un punto y coma (<code>;</code>) . Las entidades son utilizadas frecuentemente para imprimir en pantalla caracteres reservados (aquellos que serían interpretados como HTML por el navegador) o invisibles (cómo tabulaciones). También pueden usarse para representar caracteres que no existan en algunos teclados, por ejemplo caracterés con tilde o diéresis.  </span></p>
-
-<div class="note">
-<p>Muchos caracteres tienen entidades con nombres fáciles de recordar, como las vocales con tilde (<code>á</code>) es <code>&amp;aacute;</code>, (<code>é</code>) es <code>&amp;eacute;</code> y así sucesivamente. Otro ejempo es el simbolo de copyright, (<code>©</code>) representado por la entidad <code>&amp;copy;</code>. Al lidiar con entidades menos representativas de los caracteres que representan, es de gran ayuda utilizar una <a href="https://html.spec.whatwg.org/multipage/named-characters.html#named-character-references">tabla de referencia</a> o  un <a href="https://mothereff.in/html-entities">decodificador</a>.</p>
-</div>
-
-<h2 id="Caracteres_Reservados">Caracteres Reservados</h2>
-
-<p>Algunos caracteres son reservados para uso en HTML, es decir que no pueden utilizarse sin que el navegador los interprete como parte del código HTML. Por ejemplo, al utilizar el simbolo para "menor a" (<code>&lt;</code>), el navegador interpretara cualquier texto que siga como parte de una <a href="/es/docs/Glossary/Tag">etiqueta</a>.</p>
-
-<p>Para utilizar estos caracteres como texto, deben reemplazarse por la entidad que les corresponda, a saber:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracter</th>
-   <th scope="col">Entitdad</th>
-   <th scope="col">Nota</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>&amp;</td>
-   <td><code>&amp;amp;</code></td>
-   <td>Interpretado como el comienzo de una entidad HTML.</td>
-  </tr>
-  <tr>
-   <td>&lt;</td>
-   <td><code>&amp;lt;</code></td>
-   <td>Interpretado como la apertura de una <a href="/es/docs/Glossary/Tag">etiqueta</a>.</td>
-  </tr>
-  <tr>
-   <td>&gt;</td>
-   <td><code>&amp;gt;</code></td>
-   <td>Interpretado como el cierre de una <a href="/es/docs/Glossary/Tag">etiqueta</a>.</td>
-  </tr>
-  <tr>
-   <td>"</td>
-   <td><code>&amp;quot;</code></td>
-   <td>Interpretado como apertura o cierre del valor de un  <a href="/es/docs/Glossary/Atributo">atributo</a>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li><a href="https://html.spec.whatwg.org/multipage/named-characters.html#named-character-references">Lista oficial de entidades HTML [en-US]</a></li>
-</ul>
diff --git a/files/es/glossary/entity/index.html b/files/es/glossary/entity/index.html
new file mode 100644
index 0000000000..7b58bae960
--- /dev/null
+++ b/files/es/glossary/entity/index.html
@@ -0,0 +1,61 @@
+---
+title: Entidad
+slug: Glossary/Entity
+tags:
+  - Caractères
+  - HTML
+  - entidad
+translation_of: Glossary/Entity
+original_slug: Glossary/Entidad
+---
+<p><span class="seoSummary">Una <strong>entidad </strong>{{glossary("HTML")}} es un conjunto de caracteres ("string") que comienza con un ampersand (<code>&amp;</code>) y termina con un punto y coma (<code>;</code>) . Las entidades son utilizadas frecuentemente para imprimir en pantalla caracteres reservados (aquellos que serían interpretados como HTML por el navegador) o invisibles (cómo tabulaciones). También pueden usarse para representar caracteres que no existan en algunos teclados, por ejemplo caracterés con tilde o diéresis.  </span></p>
+
+<div class="note">
+<p>Muchos caracteres tienen entidades con nombres fáciles de recordar, como las vocales con tilde (<code>á</code>) es <code>&amp;aacute;</code>, (<code>é</code>) es <code>&amp;eacute;</code> y así sucesivamente. Otro ejempo es el simbolo de copyright, (<code>©</code>) representado por la entidad <code>&amp;copy;</code>. Al lidiar con entidades menos representativas de los caracteres que representan, es de gran ayuda utilizar una <a href="https://html.spec.whatwg.org/multipage/named-characters.html#named-character-references">tabla de referencia</a> o  un <a href="https://mothereff.in/html-entities">decodificador</a>.</p>
+</div>
+
+<h2 id="Caracteres_Reservados">Caracteres Reservados</h2>
+
+<p>Algunos caracteres son reservados para uso en HTML, es decir que no pueden utilizarse sin que el navegador los interprete como parte del código HTML. Por ejemplo, al utilizar el simbolo para "menor a" (<code>&lt;</code>), el navegador interpretara cualquier texto que siga como parte de una <a href="/es/docs/Glossary/Tag">etiqueta</a>.</p>
+
+<p>Para utilizar estos caracteres como texto, deben reemplazarse por la entidad que les corresponda, a saber:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracter</th>
+   <th scope="col">Entitdad</th>
+   <th scope="col">Nota</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>&amp;</td>
+   <td><code>&amp;amp;</code></td>
+   <td>Interpretado como el comienzo de una entidad HTML.</td>
+  </tr>
+  <tr>
+   <td>&lt;</td>
+   <td><code>&amp;lt;</code></td>
+   <td>Interpretado como la apertura de una <a href="/es/docs/Glossary/Tag">etiqueta</a>.</td>
+  </tr>
+  <tr>
+   <td>&gt;</td>
+   <td><code>&amp;gt;</code></td>
+   <td>Interpretado como el cierre de una <a href="/es/docs/Glossary/Tag">etiqueta</a>.</td>
+  </tr>
+  <tr>
+   <td>"</td>
+   <td><code>&amp;quot;</code></td>
+   <td>Interpretado como apertura o cierre del valor de un  <a href="/es/docs/Glossary/Atributo">atributo</a>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li><a href="https://html.spec.whatwg.org/multipage/named-characters.html#named-character-references">Lista oficial de entidades HTML [en-US]</a></li>
+</ul>
diff --git a/files/es/glossary/espacio_en_blanco/index.html b/files/es/glossary/espacio_en_blanco/index.html
deleted file mode 100644
index db6014deae..0000000000
--- a/files/es/glossary/espacio_en_blanco/index.html
+++ /dev/null
@@ -1,45 +0,0 @@
----
-title: Espacio en blanco
-slug: Glossary/Espacio_en_blanco
-tags:
-  - Glosario
-  - Gramática léxica
-  - espacioenblanco
-translation_of: Glossary/Whitespace
----
-<p><span class="seoSummary">El <strong>espacio en blanco</strong> es un conjunto de {{Glossary("Caracter", "caracteres")}} que se utiliza para mostrar espacios horizontales o verticales entre otros caracteres. A menudo se utilizan para separar fragmentos en {{Glossary("HTML")}}, {{Glossary("CSS")}}, {{Glossary("JavaScript")}} y otros lenguajes informáticos.</span>Los caracteres de espacio en blanco y su uso varía de un lenguaje a otro.</p>
-
-<h2 id="En_HTML">En HTML</h2>
-
-<p>La <a href="https://html.spec.whatwg.org/"><em>HTML Living Standard</em></a> especifica 5 caracteres ASCII como espacio en blanco: <code>U+0009</code> TAB, <code>U+000A</code> LF, <code>U+000C</code> FF, <code>U+000D</code> CR y <code>U+0020</code> ESPACIO. En forma de texto, se tratan como caracteres de espacio normal y los espacios en blanco secuenciales se contraen como un solo espacio en muchos casos (este comportamiento se puede cambiar mediante la propiedad CSS {{cssxref("white-space")}}. También se utilizan como separadores del nombre de un elemento y sus parámetros, nombres de clases, etc.</p>
-
-<h2 id="En_JavaScript">En JavaScript</h2>
-
-<p>La <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-white-space">especificación del lenguaje ECMAScript® 2015</a> establece varios puntos de código Unicode como espacio en blanco: <code>U+0009</code> CARACTERES de TABULACIÓN &lt;TAB&gt;, <code>U+000B</code> TABULACIÓN DE LÍNEA &lt;VT&gt;, <code>U+000C</code> FORM FEED &lt;FF&gt;, <code>U+0020</code> ESPACIO &lt;SP&gt;, <code>U+00A0</code> ESPACIO SIN ROTURA &lt;NBSP&gt;, <code>U+FEFF</code> ANCHO CERO NO -BREAK SPACE &lt;ZWNBSP&gt; y otra categoría “Zs” Cualquier otro punto de código Unicode “Separador, espacio” &lt;USP&gt;. Estos caracteres suelen ser innecesarios para la funcionalidad del código.</p>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li>Especificaciones
-  <ol>
-   <li><a href="https://infra.spec.whatwg.org/#ascii-whitespace">Espacio en blanco ASCII</a></li>
-   <li><a href="https://www.ecma-international.org/ecma-262/6.0/#sec-white-space">Especificación del lenguaje ECMAScript® 2015</a></li>
-  </ol>
- </li>
- <li>Referencias
-  <ol>
-   <li><a href="/es/docs/Web/API/Document_Object_Model/Whitespace">Cómo se manejan los espacios en blanco mediante HTML, CSS y el DOM</a></li>
-   <li>{{cssxref("white-space")}}</li>
-  </ol>
- </li>
- <li>Artículos de Wikipedia
-  <ol>
-   <li>{{interwiki("wikipedia", "El caracter de espacio en blanco")}}</li>
-  </ol>
- </li>
- <li><a href="/es/docs/Glossary">Glosario</a>
-  <ol>
-   <li>{{Glossary("Character", "Caracter")}}</li>
-  </ol>
- </li>
-</ol>
-</section>
diff --git a/files/es/glossary/estructura_de_datos/index.html b/files/es/glossary/estructura_de_datos/index.html
deleted file mode 100644
index d01f1b0ac8..0000000000
--- a/files/es/glossary/estructura_de_datos/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Estructura de datos
-slug: Glossary/Estructura_de_datos
-tags:
-  - Codificación
-  - Estructura de datos
-  - Glosario
-translation_of: Glossary/Data_structure
----
-<p><strong>Estructura de datos</strong> es una forma particular de organizar datos para que puedan ser usados eficientemente.</p>
-
-<h2 id="Aprende_másEdit">Aprende más<a class="button section-edit only-icon" href="https://developer.mozilla.org/en-US/docs/Glossary/Accessibility$edit#Learn_more" rel="nofollow, noindex"><span>Edit</span></a></h2>
-
-<h3 class="highlight-spanned" id="Conocimiento_general"><span class="highlight-span">Conocimiento general</span></h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Estructura_de_datos", "Estructura de datos")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/first-class_function/index.html b/files/es/glossary/first-class_function/index.html
new file mode 100644
index 0000000000..1d1e569277
--- /dev/null
+++ b/files/es/glossary/first-class_function/index.html
@@ -0,0 +1,112 @@
+---
+title: Funcion de primera clase
+slug: Glossary/First-class_Function
+translation_of: Glossary/First-class_Function
+original_slug: Glossary/Funcion_de_primera_clase
+---
+<p>Un lenguaje de programación se dice que tiene <strong>Funciones de primera clase </strong>cuando las funciones en ese lenguaje son tratadas como cualquier otra variable. Por ejemplo, en ese lenguaje, una función puede ser pasada como argumento a otras funciones, puede ser retornada por otra función y puede ser asignada a una variable.</p>
+
+<h2 id="Ejemplo_Asignar_función_a_una_variable">Ejemplo | Asignar función a una variable</h2>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js">const foo = function() {
+   console.log("foobar");
+}
+// Invocación usando una variable
+foo();
+</pre>
+
+<p>Asignamos una <strong>Función Anónima</strong> a una {{glossary("Variable")}}, la cual utilizamos para invocar la función añadiendo paréntesis <code>()</code> al final.</p>
+
+<div class="note">
+<p><strong>Aunque la función no sea anónima (función nombrada),</strong> se puede utilizar la variable para invocarla. Nombrar las funciones puede ser útil cuando estamos depurando el código. <em>Pero no afectará como invocamos a la función.</em></p>
+</div>
+
+<h2 id="Ejemplo_Pasar_la_función_como_argumento">Ejemplo | Pasar la función como argumento</h2>
+
+<h3 id="JavaScript_2">JavaScript</h3>
+
+<pre class="brush: js">function diHola() {
+   return "Hola ";
+}
+function saludar(saludo, nombre) {
+  console.log(saludo() + nombre);
+}
+// Pasamos `diHola` como argumento de la función `saludar`
+saludar(diHola, "JavaScript!");
+</pre>
+
+<p>Pasamos nuestra función <code>diHola()</code> como argumento de la función <code>saludar()</code>, esto explica como tratamos la función como un <strong>valor</strong>.</p>
+
+<div class="note">
+<p>Una función que pasamos como argumento a otra función, se llama <strong>{{glossary("Callback function")}}</strong>. <em><code>diHola</code> es una función Callback.</em></p>
+</div>
+
+<h2 id="Ejemplo_Devolver_una_función">Ejemplo | Devolver una función</h2>
+
+<h3 id="JavaScript_3">JavaScript</h3>
+
+<pre class="brush: js">function diHola() {
+   return function() {
+      console.log("¡Hola!");
+   }
+}
+</pre>
+
+<p>En este ejemplo; Necesitamos devolver una función desde otra función - <em>Podemos devolver una función porque JavaScript trata la función como un <strong>value</strong>.</em></p>
+
+<div class="note">
+<p>Una función que devuelve una función se llama <strong>Higher-Order Function</strong>.</p>
+</div>
+
+<p>Volviendo al ejemplo; Ahora, necesitamos invocar la función <code>diHola</code> y su  <code>Función Anónima</code> devuelta. Para ello, tenemos dos maneras:</p>
+
+<h3 id="1-_Usando_una_variable">1- Usando una variable</h3>
+
+<pre class="brush: js">const diHola = function() {
+   return function() {
+      console.log("¡Hola!");
+   }
+}
+const miFuncion = diHola();
+miFuncion();
+</pre>
+
+<p>De esta manera, devolverá el mensaje <code>¡Hola!</code>.</p>
+
+<div class="note">
+<p>Debes usar otra variable para que devuelve el mensaje. Si invocas <code>diHola</code> directamente, devolvera la función en si misma <strong>sin invocar a la función devuelta</strong>.</p>
+</div>
+
+<h3 id="2-_Usando_paréntesis_doble">2- Usando paréntesis doble</h3>
+
+<pre class="brush: js">function diHola() {
+   return function() {
+      console.log("¡Hola!");
+   }
+}
+diHola()();
+</pre>
+
+<p>Usamos parétesis dobre <code>()()</code> para invocar también a la función retornada.</p>
+
+<ul>
+</ul>
+
+<h2 id="Aprender_más">Aprender más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li>{{Interwiki("wikipedia", "First-class_function", "First-class functions")}} on Wikipedia</li>
+ <li><a href="/en-US/docs/Glossary">MDN Web Docs Glossary</a>
+  <ul>
+   <li>{{glossary("Callback function")}}</li>
+   <li>{{glossary("Function")}}</li>
+   <li>{{glossary("Variable")}}</li>
+  </ul>
+ </li>
+</ol>
+</section>
diff --git a/files/es/glossary/forbidden_header_name/index.html b/files/es/glossary/forbidden_header_name/index.html
new file mode 100644
index 0000000000..6a978cd6e4
--- /dev/null
+++ b/files/es/glossary/forbidden_header_name/index.html
@@ -0,0 +1,48 @@
+---
+title: Nombre de encabezado prohibido
+slug: Glossary/Forbidden_header_name
+tags:
+  - Encabezados
+  - Fetch
+  - Glosario
+  - HTTP
+  - prohibido
+translation_of: Glossary/Forbidden_header_name
+original_slug: Glossary/Nombre_de_encabezado_prohibido
+---
+<p>Un nombre de encabezado prohibido es un nombre de <a href="/en-US/docs/Web/HTTP/Headers">encabezado HTTP</a> que no se puede modificar mediante programación; específicamente, un nombre de encabezado de HTTP <strong>solicitud</strong> HTTP.</p>
+
+<p>Contrasta con el {{Glossary("Forbidden response header name")}}.</p>
+
+<p>La modificación de estas cabeceras está prohibida, por lo que el agente de usuario mantiene el control total sobre ellos. Los nombres que comienzan con `<code title="">Sec-</code>` están reservados para crear nuevos encabezados seguros a partir de las {{glossary("API","APIs")}} que usan <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> que otorgan a los desarrolladores control sobre las cabeceras, como {{domxref("XMLHttpRequest")}}.</p>
+
+<p>Los nombres de encabezado prohibidos comienzan con <code>Proxy-</code> or <code>Sec-</code>, o se componen de uno de estos:</p>
+
+<ul class="brief">
+ <li><code title="">Accept-Charset</code></li>
+ <li><code title="">Accept-Encoding</code></li>
+ <li><code title="">Access-Control-Request-Headers</code></li>
+ <li><code title="">Access-Control-Request-Method</code></li>
+ <li><code title="">Connection</code></li>
+ <li><code title="">Content-Length</code></li>
+ <li><code title="">Cookie</code></li>
+ <li><code title="">Cookie2</code></li>
+ <li><code title="">Date</code></li>
+ <li><code title="">DNT</code></li>
+ <li><code title="">Expect</code></li>
+ <li><code title="">Host</code></li>
+ <li><code title="">Keep-Alive</code></li>
+ <li><code title="http-origin">Origin</code></li>
+ <li><code title="http-origin">Proxy-</code></li>
+ <li><code title="http-origin">Sec-</code></li>
+ <li><code title="">Referer</code></li>
+ <li><code title="">TE</code></li>
+ <li><code title="">Trailer</code></li>
+ <li><code title="">Transfer-Encoding</code></li>
+ <li><code title="">Upgrade</code></li>
+ <li><code title="">Via</code></li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: El encabezado<code>User-Agent</code> ya no está prohibido, <a href="https://fetch.spec.whatwg.org/#terminology-headers">según la especificación</a> — vea la lista de nombres prohibidos de encabezado (esta fue implementada en Firefox 43), por lo que ahora puede establecerse en un objecto Fetch <a href="/en-US/docs/Web/API/Headers">Headers</a>, a través de XHR <a href="/en-US/docs/Web/API/XMLHttpRequest#setRequestHeader%28%29">setRequestHeader()</a>, etc.</p>
+</div>
diff --git a/files/es/glossary/funcion_de_primera_clase/index.html b/files/es/glossary/funcion_de_primera_clase/index.html
deleted file mode 100644
index 311f068470..0000000000
--- a/files/es/glossary/funcion_de_primera_clase/index.html
+++ /dev/null
@@ -1,111 +0,0 @@
----
-title: Funcion de primera clase
-slug: Glossary/Funcion_de_primera_clase
-translation_of: Glossary/First-class_Function
----
-<p>Un lenguaje de programación se dice que tiene <strong>Funciones de primera clase </strong>cuando las funciones en ese lenguaje son tratadas como cualquier otra variable. Por ejemplo, en ese lenguaje, una función puede ser pasada como argumento a otras funciones, puede ser retornada por otra función y puede ser asignada a una variable.</p>
-
-<h2 id="Ejemplo_Asignar_función_a_una_variable">Ejemplo | Asignar función a una variable</h2>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<pre class="brush: js">const foo = function() {
-   console.log("foobar");
-}
-// Invocación usando una variable
-foo();
-</pre>
-
-<p>Asignamos una <strong>Función Anónima</strong> a una {{glossary("Variable")}}, la cual utilizamos para invocar la función añadiendo paréntesis <code>()</code> al final.</p>
-
-<div class="note">
-<p><strong>Aunque la función no sea anónima (función nombrada),</strong> se puede utilizar la variable para invocarla. Nombrar las funciones puede ser útil cuando estamos depurando el código. <em>Pero no afectará como invocamos a la función.</em></p>
-</div>
-
-<h2 id="Ejemplo_Pasar_la_función_como_argumento">Ejemplo | Pasar la función como argumento</h2>
-
-<h3 id="JavaScript_2">JavaScript</h3>
-
-<pre class="brush: js">function diHola() {
-   return "Hola ";
-}
-function saludar(saludo, nombre) {
-  console.log(saludo() + nombre);
-}
-// Pasamos `diHola` como argumento de la función `saludar`
-saludar(diHola, "JavaScript!");
-</pre>
-
-<p>Pasamos nuestra función <code>diHola()</code> como argumento de la función <code>saludar()</code>, esto explica como tratamos la función como un <strong>valor</strong>.</p>
-
-<div class="note">
-<p>Una función que pasamos como argumento a otra función, se llama <strong>{{glossary("Callback function")}}</strong>. <em><code>diHola</code> es una función Callback.</em></p>
-</div>
-
-<h2 id="Ejemplo_Devolver_una_función">Ejemplo | Devolver una función</h2>
-
-<h3 id="JavaScript_3">JavaScript</h3>
-
-<pre class="brush: js">function diHola() {
-   return function() {
-      console.log("¡Hola!");
-   }
-}
-</pre>
-
-<p>En este ejemplo; Necesitamos devolver una función desde otra función - <em>Podemos devolver una función porque JavaScript trata la función como un <strong>value</strong>.</em></p>
-
-<div class="note">
-<p>Una función que devuelve una función se llama <strong>Higher-Order Function</strong>.</p>
-</div>
-
-<p>Volviendo al ejemplo; Ahora, necesitamos invocar la función <code>diHola</code> y su  <code>Función Anónima</code> devuelta. Para ello, tenemos dos maneras:</p>
-
-<h3 id="1-_Usando_una_variable">1- Usando una variable</h3>
-
-<pre class="brush: js">const diHola = function() {
-   return function() {
-      console.log("¡Hola!");
-   }
-}
-const miFuncion = diHola();
-miFuncion();
-</pre>
-
-<p>De esta manera, devolverá el mensaje <code>¡Hola!</code>.</p>
-
-<div class="note">
-<p>Debes usar otra variable para que devuelve el mensaje. Si invocas <code>diHola</code> directamente, devolvera la función en si misma <strong>sin invocar a la función devuelta</strong>.</p>
-</div>
-
-<h3 id="2-_Usando_paréntesis_doble">2- Usando paréntesis doble</h3>
-
-<pre class="brush: js">function diHola() {
-   return function() {
-      console.log("¡Hola!");
-   }
-}
-diHola()();
-</pre>
-
-<p>Usamos parétesis dobre <code>()()</code> para invocar también a la función retornada.</p>
-
-<ul>
-</ul>
-
-<h2 id="Aprender_más">Aprender más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li>{{Interwiki("wikipedia", "First-class_function", "First-class functions")}} on Wikipedia</li>
- <li><a href="/en-US/docs/Glossary">MDN Web Docs Glossary</a>
-  <ul>
-   <li>{{glossary("Callback function")}}</li>
-   <li>{{glossary("Function")}}</li>
-   <li>{{glossary("Variable")}}</li>
-  </ul>
- </li>
-</ol>
-</section>
diff --git a/files/es/glossary/función/index.html b/files/es/glossary/función/index.html
deleted file mode 100644
index f67d9e90c8..0000000000
--- a/files/es/glossary/función/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: Función
-slug: Glossary/Función
-tags:
-  - CodingScripting
-  - Glosario
-  - IIFE
-  - JavaScript
-translation_of: Glossary/Function
----
-<p>Una <strong>función</strong> es un fragmento de código que puede ser llamado por otro código o por sí mismo, o por una {{Glossary("variable")}} que haga referencia a la función. Cuando se llama a una función, los {{Glossary("Argument", "argumentos")}} se pasan a la función como entrada, y la función puede devolver opcionalmente una salida. Una función en {{glossary("JavaScript")}} es también un {{glossary("object", "objeto")}}.</p>
-
-<p>El nombre de la función es un {{Glossary("identifier", "identificador")}} declarado como parte de una declaración de función o expresión de función. El {{Glossary("scope", "ámbito")}} de la función depende de si el nombre de la función es una declaración o una expresión.</p>
-
-<h3 id="Diferentes_tipos_de_funciones">Diferentes tipos de funciones</h3>
-
-<p>Una <strong>función anónima</strong> es una función que no tiene nombre:</p>
-
-<pre class="brush: js">function () {};
-// o se puede usar la anotación con flecha ECMAScript 2015
-() =&gt; {};
-</pre>
-
-<p> </p>
-
-<p>Una <strong>función nombrada</strong> es una función con nombre:</p>
-
-<pre class="brush: js">function foo() {};
-// o se puede usar la anotación con flecha ECMAScript 2015
-const foo = () =&gt; {};
-</pre>
-
-<p>Una <strong>función interna</strong> es una función que está dentro de otra función (<code>cuadrado</code> en este caso). Una <strong>función externa</strong> es una función que contiene a otra función (<code>sumarCuadrados</code> en este caso):</p>
-
-<pre class="brush: js">function sumarCuadradors(a,b) {
-   function cuadrado(x) {
-      return x * x;
-   }
-   return cuadrado(a) + cuadrado(b);
-};
-//Usando la anotación de flecha ECMAScript 2015
-const sumarCuadrados = (a,b) =&gt; {
-   const cuadrado = x =&gt; x*x;
-   return cuadrado(a) + cuadrado(b);
-};
-</pre>
-
-<p>Una <strong>función recursiva</strong> es una función que se llama a sí misma. Mira {{Glossary("Recursion", "recursión")}}.</p>
-
-<pre class="brush: js">function bucle(x) {
-   if (x &gt;= 10)
-      return;
-   bucle(x + 1);
-};
-//Usando la anotación de flecha ECMAScript 2015
-const bucle = x =&gt; {
-   if (x &gt;= 10)
-      return;
-   bucle(x + 1);
-};
-</pre>
-
-<p>Una <strong>expresión de una función que se invoca inmediatamente </strong>({{glossary("IIFE")}}, por sus siglas en inglés) es una función que se llama directamente después de que la función se haya cargado en el compilador del navegador. La forma de identificar un IIFE es ubicando el paréntesis izquierdo y derecho adicional al final de la declaración de la función.</p>
-
-<pre class="brush: js">// Error (https://en.wikipedia.org/wiki/Immediately-invoked_function_expression)
-/*
-​function foo() {
-    console.log('Hello Foo');
-}();
-*/
-
-(function foo() {
-    console.log("Hello Foo");
-}());
-
-(function food() {
-    console.log("Hello Food");
-})();
-
-</pre>
-
-<p>Si desea obtener más información sobre las IIFE, consulte la siguiente página en Wikipedia: <a href="https://en.wikipedia.org/wiki/Immediately-invoked_function_expression">Immediately Invoked Function Expression</a></p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Referencias_técnicas">Referencias técnicas</h3>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions" title="en-US/docs/Web/JavaScript/Guide/Functions">Funciones</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Funciones de flecha</a></li>
-</ul>
diff --git a/files/es/glossary/function/index.html b/files/es/glossary/function/index.html
new file mode 100644
index 0000000000..8f4f309f00
--- /dev/null
+++ b/files/es/glossary/function/index.html
@@ -0,0 +1,92 @@
+---
+title: Función
+slug: Glossary/Function
+tags:
+  - CodingScripting
+  - Glosario
+  - IIFE
+  - JavaScript
+translation_of: Glossary/Function
+original_slug: Glossary/Función
+---
+<p>Una <strong>función</strong> es un fragmento de código que puede ser llamado por otro código o por sí mismo, o por una {{Glossary("variable")}} que haga referencia a la función. Cuando se llama a una función, los {{Glossary("Argument", "argumentos")}} se pasan a la función como entrada, y la función puede devolver opcionalmente una salida. Una función en {{glossary("JavaScript")}} es también un {{glossary("object", "objeto")}}.</p>
+
+<p>El nombre de la función es un {{Glossary("identifier", "identificador")}} declarado como parte de una declaración de función o expresión de función. El {{Glossary("scope", "ámbito")}} de la función depende de si el nombre de la función es una declaración o una expresión.</p>
+
+<h3 id="Diferentes_tipos_de_funciones">Diferentes tipos de funciones</h3>
+
+<p>Una <strong>función anónima</strong> es una función que no tiene nombre:</p>
+
+<pre class="brush: js">function () {};
+// o se puede usar la anotación con flecha ECMAScript 2015
+() =&gt; {};
+</pre>
+
+<p> </p>
+
+<p>Una <strong>función nombrada</strong> es una función con nombre:</p>
+
+<pre class="brush: js">function foo() {};
+// o se puede usar la anotación con flecha ECMAScript 2015
+const foo = () =&gt; {};
+</pre>
+
+<p>Una <strong>función interna</strong> es una función que está dentro de otra función (<code>cuadrado</code> en este caso). Una <strong>función externa</strong> es una función que contiene a otra función (<code>sumarCuadrados</code> en este caso):</p>
+
+<pre class="brush: js">function sumarCuadradors(a,b) {
+   function cuadrado(x) {
+      return x * x;
+   }
+   return cuadrado(a) + cuadrado(b);
+};
+//Usando la anotación de flecha ECMAScript 2015
+const sumarCuadrados = (a,b) =&gt; {
+   const cuadrado = x =&gt; x*x;
+   return cuadrado(a) + cuadrado(b);
+};
+</pre>
+
+<p>Una <strong>función recursiva</strong> es una función que se llama a sí misma. Mira {{Glossary("Recursion", "recursión")}}.</p>
+
+<pre class="brush: js">function bucle(x) {
+   if (x &gt;= 10)
+      return;
+   bucle(x + 1);
+};
+//Usando la anotación de flecha ECMAScript 2015
+const bucle = x =&gt; {
+   if (x &gt;= 10)
+      return;
+   bucle(x + 1);
+};
+</pre>
+
+<p>Una <strong>expresión de una función que se invoca inmediatamente </strong>({{glossary("IIFE")}}, por sus siglas en inglés) es una función que se llama directamente después de que la función se haya cargado en el compilador del navegador. La forma de identificar un IIFE es ubicando el paréntesis izquierdo y derecho adicional al final de la declaración de la función.</p>
+
+<pre class="brush: js">// Error (https://en.wikipedia.org/wiki/Immediately-invoked_function_expression)
+/*
+​function foo() {
+    console.log('Hello Foo');
+}();
+*/
+
+(function foo() {
+    console.log("Hello Foo");
+}());
+
+(function food() {
+    console.log("Hello Food");
+})();
+
+</pre>
+
+<p>Si desea obtener más información sobre las IIFE, consulte la siguiente página en Wikipedia: <a href="https://en.wikipedia.org/wiki/Immediately-invoked_function_expression">Immediately Invoked Function Expression</a></p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Referencias_técnicas">Referencias técnicas</h3>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions" title="en-US/docs/Web/JavaScript/Guide/Functions">Funciones</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Funciones de flecha</a></li>
+</ul>
diff --git a/files/es/glossary/general_header/index.html b/files/es/glossary/general_header/index.html
new file mode 100644
index 0000000000..4072537f04
--- /dev/null
+++ b/files/es/glossary/general_header/index.html
@@ -0,0 +1,9 @@
+---
+title: Cabecera general
+slug: Glossary/General_header
+translation_of: Glossary/General_header
+original_slug: Glossary/Cabecera_general
+---
+<p>Una <strong>cabecera general</strong> es una {{glossary('Header', 'cabecera HTTP')}} que puede ser utilizada tanto en mensajes de consultas como de respuestas pero que no se aplican al contenido en sí mismo. Dependiendo del contexto en que son usadas, las cabeceras generales pueden ser de {{glossary("Response header", "respuesta")}} o de {{glossary("request header", "consulta")}}. Sin embargo, no son {{glossary("entity header", "cabeceras de entidad.")}}.</p>
+
+<p>Las cabeceras generales más comunes son {{HTTPHeader('Date')}}, {{HTTPheader("Cache-Control")}} y {{HTTPHeader("Connection")}}.</p>
diff --git a/files/es/glossary/hilo_principal/index.html b/files/es/glossary/hilo_principal/index.html
deleted file mode 100644
index 47cef4e428..0000000000
--- a/files/es/glossary/hilo_principal/index.html
+++ /dev/null
@@ -1,30 +0,0 @@
----
-title: Hilo principal
-slug: Glossary/Hilo_principal
-tags:
-  - Actualización Web
-  - Glosario
-  - Referencia
-  - Web de rendimiento
-translation_of: Glossary/Main_thread
----
-<p>El hilo principal es donde un navegador procesa eventos y pinturas del usuario. De manera predeterminada, el navegador usa un solo hilo para ejecutar todo el JavaScript en su página, así como para realizar el diseño, los reflujos y la recolección de basura. Esto significa que las funciones de JavaScript de larga duración pueden bloquear el hilo, lo que lleva a una página que no responde y a una mala experiencia del usuario.</p>
-
-<p>A menos que use intencionalmente un trabajador web, como un trabajador de servicio, JavaScript se ejecuta en el hilo principal, por lo que es fácil que un script provoque retrasos en el procesamiento o la pintura de eventos. Cuanto menos trabajo se requiera del hilo principal, más puede responder ese hilo a los eventos del usuario, pintar y, en general, responder al usuario.</p>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li>See also
-  <ol>
-   <li><a href="/en-US/docs/Learn/JavaScript/Asynchronous">Asynchronous JavaScript</a></li>
-   <li><a href="/en-US/docs/Web/API/Web_Workers_API">Web worker API</a></li>
-   <li><a href="/en-US/docs/Web/API/Service_Worker_API">Service worker API</a></li>
-  </ol>
- </li>
- <li><a href="/en-US/docs/Glossary">Glossary</a>
-  <ol>
-   <li>{{Glossary("Thread")}}</li>
-  </ol>
- </li>
-</ol>
-</section>
diff --git a/files/es/glossary/identificador/index.html b/files/es/glossary/identificador/index.html
deleted file mode 100644
index 63f26a35a8..0000000000
--- a/files/es/glossary/identificador/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: Identificador
-slug: Glossary/Identificador
-tags:
-  - Campartir
-  - CodingScripting
-  - Glosario
-  - Novato
-  - Principiante
-translation_of: Glossary/Identifier
----
-<p>Un <strong>Identificador</strong> es una secuencia de caracteres en el código que identifica una {{Glossary("Variable")}}, {{Glossary("Function", "función")}} o {{Glossary("Property", "propiedad")}}.</p>
-
-<p>En {{Glossary("JavaScript")}}, los identificadores distinguen entre mayúsculas y minúsculas y pueden contener letras {{Glossary("Unicode")}}, <code>$</code>, <code>_</code>, y dígitos (0-9), pero no puede comenzar con un dígito.</p>
-
-<p>Un identificador se diferencia de una cadena en que una {{Glossary("String", "cadena")}} son datos, mientras que un identificador es parte del código. En JavaScript, no hay forma de convertir identificadores en cadenas, pero a veces es posible procesar cadenas como identificadores.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Identificador#Identificadores_en_lenguajes_informáticos", "Identificador")}} en Wikipedia</li>
-</ul>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li><a href="/es/docs/Glossary">Glosario</a>
-
-  <ol>
-   <li>{{Glossary("Identifier", "Identificador")}}</li>
-   <li>{{Glossary("Scope", "Alcance")}}</li>
-   <li>{{Glossary("String", "Cadena")}}</li>
-   <li>{{Glossary("Unicode")}}</li>
-  </ol>
- </li>
- <li>{{interwiki("wikipedia", "Identificador#Identificadores_en_lenguajes_informáticos", "Identificador")}} en Wikipedia</li>
-</ol>
-</section>
diff --git a/files/es/glossary/identifier/index.html b/files/es/glossary/identifier/index.html
new file mode 100644
index 0000000000..cda711dece
--- /dev/null
+++ b/files/es/glossary/identifier/index.html
@@ -0,0 +1,40 @@
+---
+title: Identificador
+slug: Glossary/Identifier
+tags:
+  - Campartir
+  - CodingScripting
+  - Glosario
+  - Novato
+  - Principiante
+translation_of: Glossary/Identifier
+original_slug: Glossary/Identificador
+---
+<p>Un <strong>Identificador</strong> es una secuencia de caracteres en el código que identifica una {{Glossary("Variable")}}, {{Glossary("Function", "función")}} o {{Glossary("Property", "propiedad")}}.</p>
+
+<p>En {{Glossary("JavaScript")}}, los identificadores distinguen entre mayúsculas y minúsculas y pueden contener letras {{Glossary("Unicode")}}, <code>$</code>, <code>_</code>, y dígitos (0-9), pero no puede comenzar con un dígito.</p>
+
+<p>Un identificador se diferencia de una cadena en que una {{Glossary("String", "cadena")}} son datos, mientras que un identificador es parte del código. En JavaScript, no hay forma de convertir identificadores en cadenas, pero a veces es posible procesar cadenas como identificadores.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Identificador#Identificadores_en_lenguajes_informáticos", "Identificador")}} en Wikipedia</li>
+</ul>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li><a href="/es/docs/Glossary">Glosario</a>
+
+  <ol>
+   <li>{{Glossary("Identifier", "Identificador")}}</li>
+   <li>{{Glossary("Scope", "Alcance")}}</li>
+   <li>{{Glossary("String", "Cadena")}}</li>
+   <li>{{Glossary("Unicode")}}</li>
+  </ol>
+ </li>
+ <li>{{interwiki("wikipedia", "Identificador#Identificadores_en_lenguajes_informáticos", "Identificador")}} en Wikipedia</li>
+</ol>
+</section>
diff --git a/files/es/glossary/immutable/index.html b/files/es/glossary/immutable/index.html
new file mode 100644
index 0000000000..f1a0428fce
--- /dev/null
+++ b/files/es/glossary/immutable/index.html
@@ -0,0 +1,24 @@
+---
+title: Inmutable
+slug: Glossary/Immutable
+tags:
+  - CodingScripting
+  - Glosario
+translation_of: Glossary/Immutable
+original_slug: Glossary/Inmutable
+---
+<p>Un {{glossary("object", "objeto")}} inmutable es aquel cuyo contenido no se puede cambiar.Un objeto puede ser inmutable por varias razones, por ejemplo:</p>
+
+<ul>
+ <li>Para mejorar el rendimiento (al no haber planificados cambios futuros del objeto)</li>
+ <li>Para reducir el uso de memoria (haciendo {{glossary("object reference","referencias al objeto")}} en vez de clonar el objeto entero)</li>
+ <li>Para la seguridad de los subprocesos (varios subprocesos pueden hacer referencia al mismo objeto sin interferir entre sí)</li>
+</ul>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Objeto_inmutable", "Objeto Inmutable")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/information_architecture/index.html b/files/es/glossary/information_architecture/index.html
new file mode 100644
index 0000000000..5791adce1a
--- /dev/null
+++ b/files/es/glossary/information_architecture/index.html
@@ -0,0 +1,19 @@
+---
+title: Arquitectura de la información
+slug: Glossary/Information_architecture
+tags:
+  - Arquitectura informacional
+  - Diseño
+  - Glosario
+translation_of: Glossary/Information_architecture
+original_slug: Glossary/Arquitectura_de_la_información
+---
+<p>La arquitectura de la información, aplicada al diseño y desarrollo web, es la práctica de organizar la información, contenido y funcionalidad de un sitio web para que presente la mejor experiencia de usuario posible, con información y servicios fáciles de usar y encontrar.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Arquitectura_de_la_información", "Arquitectura de la información")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/inmutable/index.html b/files/es/glossary/inmutable/index.html
deleted file mode 100644
index 534f00b6b6..0000000000
--- a/files/es/glossary/inmutable/index.html
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Inmutable
-slug: Glossary/Inmutable
-tags:
-  - CodingScripting
-  - Glosario
-translation_of: Glossary/Immutable
----
-<p>Un {{glossary("object", "objeto")}} inmutable es aquel cuyo contenido no se puede cambiar.Un objeto puede ser inmutable por varias razones, por ejemplo:</p>
-
-<ul>
- <li>Para mejorar el rendimiento (al no haber planificados cambios futuros del objeto)</li>
- <li>Para reducir el uso de memoria (haciendo {{glossary("object reference","referencias al objeto")}} en vez de clonar el objeto entero)</li>
- <li>Para la seguridad de los subprocesos (varios subprocesos pueden hacer referencia al mismo objeto sin interferir entre sí)</li>
-</ul>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Objeto_inmutable", "Objeto Inmutable")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/iu/index.html b/files/es/glossary/iu/index.html
deleted file mode 100644
index 0b24558082..0000000000
--- a/files/es/glossary/iu/index.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: IU
-slug: Glossary/IU
-tags:
-  - Accesibilidad
-  - Diseño
-  - Glosario
-translation_of: Glossary/UI
----
-<p>La <em>Interfaz de Usuario </em>(IU) es el medio que facilita la interacción entre el usuario y la máquina. En el campo de la informática, puede ser un teclado, un joystick, una pantalla, o un programa. En el caso del software, puede ser una entrada de línea de comandos, una página web, un formulario, o el front-end de cualquier aplicación.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Interfaz_de_usuario">Interfaz de Usuario</a> en Wikipedia</li>
- <li><a href="https://es.wikipedia.org/wiki/Desarrollo_web_Front-end">Desarrollo Front-end</a> on Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/key/index.html b/files/es/glossary/key/index.html
new file mode 100644
index 0000000000..be1524acf3
--- /dev/null
+++ b/files/es/glossary/key/index.html
@@ -0,0 +1,20 @@
+---
+title: Clave
+slug: Glossary/Key
+tags:
+  - Criptografía
+  - Glosario
+  - Seguridad
+translation_of: Glossary/Key
+original_slug: Glossary/Clave
+---
+<p>Una clave es una pieza de información utilizada por un algoritmo criptográfico para el {{Glossary("encryption", "cifrado")}} y/o {{Glossary("decryption", "descifrado")}}. Los mensajes cifrados deben permanecer seguros incluso si todo lo relacionado con el {{Glossary("cryptosystem","sistema de cifrado")}}, excepto la clave, es de conocimiento público.</p>
+
+<p>En la {{Glossary("symmetric-key cryptography", "criptografía de clave simétrica")}}, la misma clave se utiliza tanto para el cifrado como para el descifrado. En la criptografía de clave pública, existen un par de claves relacionadas conocidas como <em>clave pública</em> y <em>clave privada</em>. La clave pública está disponible libremente, mientras que la clave privada se mantiene secreta. La clave pública puede cifrar mensajes que sólo la clave privada correspondiente puede descifrar, y viceversa.</p>
+
+<p><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="font-size: 37.33327865600586px;"><strong>Saber más</strong></span></font></p>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Principios_de_Kerckhoffs">Principos de Kerckhoffs</a> en Wikipedia</li>
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Glossary/Cifrado">Cifrado</a></li>
+</ul>
diff --git a/files/es/glossary/localization/index.html b/files/es/glossary/localization/index.html
new file mode 100644
index 0000000000..47305fa6d9
--- /dev/null
+++ b/files/es/glossary/localization/index.html
@@ -0,0 +1,17 @@
+---
+title: Localización
+slug: Glossary/Localization
+tags:
+  - Localización
+translation_of: Glossary/Localization
+original_slug: Localización
+---
+<p>  </p>
+<div> <p>La <strong>localización</strong> es el proceso de traducción de interfaces de usuario de un lenguaje a otro y adaptación para que una cultura extranjera lo comprenda. Estos recursos tratan sobre cómo hacer aplicaciones/extensiones de Mozilla localizables.</p>
+</div>
+<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Documentaci.C3.B3n"><a href="/Special:Tags" title="Site Tags">Documentación</a></h4> <dl> <dt><a class="external" href="http://www.proyectonave.es/docs/extensiones" title="http://www.proyectonave.es/docs/extensiones">Sistema de traducción de extensiones para NAVE</a></dt> <dd><small>"Este documento tiene como principal objetivo fomentar la traducción de extensiones mediante un sistema escalable que, aunque inicialmente puede ser complicado de entender, al final, se minimiza el tiempo total empleado en generar un paquete de idioma con la traducción." </small></dd> </dl> <dl> <dt><a class="external" href="http://www.proyectonave.es/docs/instaladores" title="http://www.proyectonave.es/docs/instaladores">Creación de instaladores</a></dt> <dd><small>Este documento explica cómo hacer instaladores de productos Mozilla 100% es-ES a partir del correspondiente instalador original en-US y los paquetes de idioma es-ES más, en algunos casos, archivos adicionales de personalización es-ES.</small></dd> </dl> <dl> <dt><a href="/es/Escribir_código_localizable" title="es/Escribir_código_localizable">Escribir código localizable</a></dt> <dd><small>Esta página te explica las buenas prácticas y directrices al tratar con código UI en relación a la localización. Está dirigido a desarrolladores de Mozilla y sus extensiones.</small></dd> </dl> <dl> <dt><a class="external" href="http://kb.mozillazine.org/Localize_extension_descriptions">Localizando las descripciones de las extensiones</a></dt> <dd><small>Para localizar la descripción de una extensión (secuencia que muestra arriba y abajo el nombre de la extensión en ventanas de extensiones), necesitas utilizar una clave especial para anular la descripción especificada en su archivo install.rdf. Este artículo contiene instrucciones de cómo modificar esta tecla de preferencia.</small></dd> </dl> <p><span class="alllinks"><a href="/Special:Tags" title="Site Tags">Ver todo...</a></span></p> </td> <td> <h4 id="Comunidad">Comunidad</h4> <ul> <li><a class="external" href="http://www.proyectonave.es/" title="http://www.proyectonave.es/">El proyecto NAVE</a></li> <li><a class="external" href="http://www.babelzilla.org/forum/index.php?showforum=38">Babelzilla</a></li> <li><a class="external" href="http://www.mozillaes.org/index.php?option=com_forum&amp;Itemid=122&amp;page=viewforum&amp;f=13">Foro sobre traducciones en MozillaES</a></li> <li><a class="external" href="http://www.mozilla-hispano.org/foro/viewforum.php?f=7&amp;sid=f1ffba39f7bdd70f5f54283be1ab23ac" title="http://www.mozilla-hispano.org/foro/viewforum.php?f=7&amp;sid=f1ffba39f7bdd70f5f54283be1ab23ac">Foro sobre traducciones en Mozilla Hispano</a></li> </ul> <ul> <li>En la comunidad Mozilla... en ingles</li> </ul> <p>{{ DiscussionList("dev-l10n", "mozilla.dev.l10n") }}</p> <ul> <li> <ul> <li><a class="external" href="http://www.mozilla.org/projects/l10n/">Proyecto de localización de Mozilla</a></li> </ul> </li> </ul> <p><span class="alllinks"><a href="/es/Localización/Comunidad" title="es/Localización/Comunidad">Ver todo...</a></span></p> <h3 id="Herramientas">Herramientas</h3> <ul> <li><a class="external" href="http://kbabel.kde.org/">KBabel</a></li> <li><a class="external" href="http://wiki.mozilla.org/L10n:MozillaTranslator" title="http://wiki.mozilla.org/L10n:MozillaTranslator">MozillaTranslator</a></li> <li><a class="external" href="http://www.mozilla.org/projects/l10n/mlp_tools.html">Herramientas para la localización (en)</a></li> </ul> <p><span class="alllinks"><a href="/Special:Tags" title="Site Tags">Ver todo...</a></span></p> <h4 id="Temas_Relacionados">Temas Relacionados</h4> <dl> <dd><a href="/es/Extensiones" title="es/Extensiones">Extensiones</a>, <a href="/es/Desarrollando_Mozilla" title="es/Desarrollando_Mozilla">Desarrollando Mozilla</a>, <a href="/es/XUL" title="es/XUL">XUL</a></dd> </dl> </td> </tr> </tbody>
+</table>
+<p><span class="comment">Categorías</span></p>
+<p><span class="comment">Interwiki Language Links</span></p>
+<p>  </p>
+<p>{{ languages( { "de": "de/Lokalisierung", "en": "en/Localization", "fr": "fr/Localisation", "it": "it/Localization", "ja": "ja/Localization", "pl": "pl/Lokalizacja", "pt": "pt/Localiza\u00e7\u00e3o", "zh-tw": "zh_tw/\u672c\u5730\u5316" } ) }}</p>
diff --git a/files/es/glossary/main_thread/index.html b/files/es/glossary/main_thread/index.html
new file mode 100644
index 0000000000..f58296fe3f
--- /dev/null
+++ b/files/es/glossary/main_thread/index.html
@@ -0,0 +1,31 @@
+---
+title: Hilo principal
+slug: Glossary/Main_thread
+tags:
+  - Actualización Web
+  - Glosario
+  - Referencia
+  - Web de rendimiento
+translation_of: Glossary/Main_thread
+original_slug: Glossary/Hilo_principal
+---
+<p>El hilo principal es donde un navegador procesa eventos y pinturas del usuario. De manera predeterminada, el navegador usa un solo hilo para ejecutar todo el JavaScript en su página, así como para realizar el diseño, los reflujos y la recolección de basura. Esto significa que las funciones de JavaScript de larga duración pueden bloquear el hilo, lo que lleva a una página que no responde y a una mala experiencia del usuario.</p>
+
+<p>A menos que use intencionalmente un trabajador web, como un trabajador de servicio, JavaScript se ejecuta en el hilo principal, por lo que es fácil que un script provoque retrasos en el procesamiento o la pintura de eventos. Cuanto menos trabajo se requiera del hilo principal, más puede responder ese hilo a los eventos del usuario, pintar y, en general, responder al usuario.</p>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li>See also
+  <ol>
+   <li><a href="/en-US/docs/Learn/JavaScript/Asynchronous">Asynchronous JavaScript</a></li>
+   <li><a href="/en-US/docs/Web/API/Web_Workers_API">Web worker API</a></li>
+   <li><a href="/en-US/docs/Web/API/Service_Worker_API">Service worker API</a></li>
+  </ol>
+ </li>
+ <li><a href="/en-US/docs/Glossary">Glossary</a>
+  <ol>
+   <li>{{Glossary("Thread")}}</li>
+  </ol>
+ </li>
+</ol>
+</section>
diff --git a/files/es/glossary/metadata/index.html b/files/es/glossary/metadata/index.html
new file mode 100644
index 0000000000..d7387d5a0a
--- /dev/null
+++ b/files/es/glossary/metadata/index.html
@@ -0,0 +1,25 @@
+---
+title: Metadato
+slug: Glossary/Metadata
+tags:
+  - CodingScripting
+  - Glosario
+  - HTML
+translation_of: Glossary/Metadata
+original_slug: Glossary/Metadato
+---
+<p>Los<strong> metadatos </strong>son, en su definición más simple, datos que describen otros datos. Por ejemplo, un documento {{glossary("HTML")}} son datos, pero HTML también puede contener metadatos en su elemento {{htmlelement("head")}} que describe el documento, como por ejemplo, quién lo escribió y su resumen.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Metadatos", "Metadatos")}} en Wikipedia</li>
+</ul>
+
+<h3 id="HTML_metadata">HTML metadata</h3>
+
+<ul>
+ <li>The {{htmlelement("meta")}} element on MDN</li>
+</ul>
diff --git a/files/es/glossary/metadato/index.html b/files/es/glossary/metadato/index.html
deleted file mode 100644
index dddb546b28..0000000000
--- a/files/es/glossary/metadato/index.html
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: Metadato
-slug: Glossary/Metadato
-tags:
-  - CodingScripting
-  - Glosario
-  - HTML
-translation_of: Glossary/Metadata
----
-<p>Los<strong> metadatos </strong>son, en su definición más simple, datos que describen otros datos. Por ejemplo, un documento {{glossary("HTML")}} son datos, pero HTML también puede contener metadatos en su elemento {{htmlelement("head")}} que describe el documento, como por ejemplo, quién lo escribió y su resumen.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Metadatos", "Metadatos")}} en Wikipedia</li>
-</ul>
-
-<h3 id="HTML_metadata">HTML metadata</h3>
-
-<ul>
- <li>The {{htmlelement("meta")}} element on MDN</li>
-</ul>
diff --git a/files/es/glossary/method/index.html b/files/es/glossary/method/index.html
new file mode 100644
index 0000000000..85006330ed
--- /dev/null
+++ b/files/es/glossary/method/index.html
@@ -0,0 +1,29 @@
+---
+title: Método
+slug: Glossary/Method
+tags:
+  - Glosario
+  - JavaScript
+translation_of: Glossary/Method
+original_slug: Glossary/Método
+---
+<p>Un <strong>metodo</strong> es una {{glossary("function", "función")}} la cual es {{glossary("property", "propiedad")}} de un {{glossary("Objecto", "Objeto")}}. Existen dos tipos de métodos: <em>Métodos de Instancia</em> los cuales son tareas integradas realizadas por la instacia de un objeto, y los <em>Métodos Estáticos </em>que son tareas que pueden ser llamadas directamente en el constructor de un objeto.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> En JavaScript las funciones en si son objectos, asi que, en ese contexto, un método es de hecho un {{glossary("Object Reference", "objeto de referencia")}} a una función.</p>
+</div>
+
+<h2 id="Aprender_más">Aprender más</h2>
+
+<h3 id="Aprender_acerca_de_esto">Aprender acerca de esto</h3>
+
+<ul>
+ <li>{{InterWiki("wikipedia","Método (informática)")}} en Wikipedia</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">Definiendo un método en JavaScript</a> (comparacion de la sintaxis tradicionas y la nueva abreviación)</li>
+</ul>
+
+<h3 id="Referencia_Técnica">Referencia Técnica</h3>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Methods_Index">Lista de los métodos integrados de JavaScript</a></li>
+</ul>
diff --git a/files/es/glossary/miga-de-pan/index.html b/files/es/glossary/miga-de-pan/index.html
deleted file mode 100644
index 0fe4ade2f7..0000000000
--- a/files/es/glossary/miga-de-pan/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Miga de pan
-slug: Glossary/miga-de-pan
-tags:
-  - Accesibilidad
-  - Glosario
-  - Miga de pan
-  - navegación
-translation_of: Glossary/Breadcrumb
----
-<p><span class="seoSummary">Una <strong>miga de pan</strong>, o rastro de migas de pan, es una ayuda a la navegación que se sitúa normalmente entre la cabecera del sitio y el contenido principal y muestra, bien la jerarquía de la página actual en relación con la estructura del sitio desde el nivel superior o bien una lista de los enlaces utilizados para llegar a la página actual en el orden en que se han visitado. </span></p>
-
-<p>Una miga de pan para este documento se vería más o menos así:</p>
-
-<p><a href="/">MDN</a> &gt; <a href="/en-US/docs/Glossary/">Glosario</a> &gt; Miga de pan</p>
-
-<p>Los rastros de migas de pan permiten a los usuarios conocer su situación dentro de un sitio web. Este tipo de navegación, si se construye correctamente, ayuda a los usuarios a saber dónde están dentro del sitio y cómo han llegado hasta ahí. También pueden ayudar al usuario a volver a donde estaba anteriormente y pueden reducir el número de clics necesario para llegar a una página de nivel superior.</p>
diff --git a/files/es/glossary/método/index.html b/files/es/glossary/método/index.html
deleted file mode 100644
index b0539a9474..0000000000
--- a/files/es/glossary/método/index.html
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: Método
-slug: Glossary/Método
-tags:
-  - Glosario
-  - JavaScript
-translation_of: Glossary/Method
----
-<p>Un <strong>metodo</strong> es una {{glossary("function", "función")}} la cual es {{glossary("property", "propiedad")}} de un {{glossary("Objecto", "Objeto")}}. Existen dos tipos de métodos: <em>Métodos de Instancia</em> los cuales son tareas integradas realizadas por la instacia de un objeto, y los <em>Métodos Estáticos </em>que son tareas que pueden ser llamadas directamente en el constructor de un objeto.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> En JavaScript las funciones en si son objectos, asi que, en ese contexto, un método es de hecho un {{glossary("Object Reference", "objeto de referencia")}} a una función.</p>
-</div>
-
-<h2 id="Aprender_más">Aprender más</h2>
-
-<h3 id="Aprender_acerca_de_esto">Aprender acerca de esto</h3>
-
-<ul>
- <li>{{InterWiki("wikipedia","Método (informática)")}} en Wikipedia</li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">Definiendo un método en JavaScript</a> (comparacion de la sintaxis tradicionas y la nueva abreviación)</li>
-</ul>
-
-<h3 id="Referencia_Técnica">Referencia Técnica</h3>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Methods_Index">Lista de los métodos integrados de JavaScript</a></li>
-</ul>
diff --git a/files/es/glossary/nombre_de_dominio/index.html b/files/es/glossary/nombre_de_dominio/index.html
deleted file mode 100644
index e2c9e01c16..0000000000
--- a/files/es/glossary/nombre_de_dominio/index.html
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Nombre de dominio
-slug: Glossary/Nombre_de_dominio
-translation_of: Glossary/Domain_name
----
-<p>Un nombre de dominio es la dirección de un sitio web en {{Glossary("Internet")}}. Los nombres de dominio se utilizan en {{Glossary("URL","URLs")}} para identificar a qué servidor pertenece una página web específica. El nombre de dominio consiste en una secuencia jerárquica de nombres (etiquetas) separados por puntos y que terminan con una {{glossary("TLD","extensión")}}.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimientos_generales"><strong>Conocimientos generales</strong></h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Dominio_de_Internet", "Dominio de Internet")}} en Wikipedia</li>
- <li><a href="/en-US/Learn/Understanding_domain_names">Entendiendo los nombres de los dominios</a></li>
-</ul>
diff --git a/files/es/glossary/nombre_de_encabezado_prohibido/index.html b/files/es/glossary/nombre_de_encabezado_prohibido/index.html
deleted file mode 100644
index e2f16bbecf..0000000000
--- a/files/es/glossary/nombre_de_encabezado_prohibido/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: Nombre de encabezado prohibido
-slug: Glossary/Nombre_de_encabezado_prohibido
-tags:
-  - Encabezados
-  - Fetch
-  - Glosario
-  - HTTP
-  - prohibido
-translation_of: Glossary/Forbidden_header_name
----
-<p>Un nombre de encabezado prohibido es un nombre de <a href="/en-US/docs/Web/HTTP/Headers">encabezado HTTP</a> que no se puede modificar mediante programación; específicamente, un nombre de encabezado de HTTP <strong>solicitud</strong> HTTP.</p>
-
-<p>Contrasta con el {{Glossary("Forbidden response header name")}}.</p>
-
-<p>La modificación de estas cabeceras está prohibida, por lo que el agente de usuario mantiene el control total sobre ellos. Los nombres que comienzan con `<code title="">Sec-</code>` están reservados para crear nuevos encabezados seguros a partir de las {{glossary("API","APIs")}} que usan <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a> que otorgan a los desarrolladores control sobre las cabeceras, como {{domxref("XMLHttpRequest")}}.</p>
-
-<p>Los nombres de encabezado prohibidos comienzan con <code>Proxy-</code> or <code>Sec-</code>, o se componen de uno de estos:</p>
-
-<ul class="brief">
- <li><code title="">Accept-Charset</code></li>
- <li><code title="">Accept-Encoding</code></li>
- <li><code title="">Access-Control-Request-Headers</code></li>
- <li><code title="">Access-Control-Request-Method</code></li>
- <li><code title="">Connection</code></li>
- <li><code title="">Content-Length</code></li>
- <li><code title="">Cookie</code></li>
- <li><code title="">Cookie2</code></li>
- <li><code title="">Date</code></li>
- <li><code title="">DNT</code></li>
- <li><code title="">Expect</code></li>
- <li><code title="">Host</code></li>
- <li><code title="">Keep-Alive</code></li>
- <li><code title="http-origin">Origin</code></li>
- <li><code title="http-origin">Proxy-</code></li>
- <li><code title="http-origin">Sec-</code></li>
- <li><code title="">Referer</code></li>
- <li><code title="">TE</code></li>
- <li><code title="">Trailer</code></li>
- <li><code title="">Transfer-Encoding</code></li>
- <li><code title="">Upgrade</code></li>
- <li><code title="">Via</code></li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: El encabezado<code>User-Agent</code> ya no está prohibido, <a href="https://fetch.spec.whatwg.org/#terminology-headers">según la especificación</a> — vea la lista de nombres prohibidos de encabezado (esta fue implementada en Firefox 43), por lo que ahora puede establecerse en un objecto Fetch <a href="/en-US/docs/Web/API/Headers">Headers</a>, a través de XHR <a href="/en-US/docs/Web/API/XMLHttpRequest#setRequestHeader%28%29">setRequestHeader()</a>, etc.</p>
-</div>
diff --git a/files/es/glossary/number/index.html b/files/es/glossary/number/index.html
new file mode 100644
index 0000000000..0853572a97
--- /dev/null
+++ b/files/es/glossary/number/index.html
@@ -0,0 +1,25 @@
+---
+title: Number
+slug: Glossary/Number
+tags:
+  - Glosario
+  - JavaScript
+translation_of: Glossary/Number
+original_slug: Glossary/Numero
+---
+<p>En {{Glossary("JavaScript")}}, <strong>Number</strong> es un tipo de datos numérico (<a class="external external-icon" href="http://en.wikipedia.org/wiki/Double_precision_floating-point_format">double-precision 64-bit floating point format (IEEE 754)</a>). En otros lenguajes de programación puede existir diferentes tipos numéricos, por ejemplo: Integers, Floats, Doubles, or Bignums.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li><a href="es.wikipedia.org/wiki/Tipo_de_dato#Num.C3.A9ricos">Tipos de datos numérico en Wikipedia</a></li>
+</ul>
+
+<h3 id="Referencia_Técnica">Referencia Técnica</h3>
+
+<ul>
+ <li>La estructura de datos de JavaScript: <a href="/en-US/docs/Web/JavaScript/Data_structures#Number_type">Number</a></li>
+ <li>El objeto global de JavaScript: {{jsxref("Number")}}</li>
+</ul>
diff --git a/files/es/glossary/numero/index.html b/files/es/glossary/numero/index.html
deleted file mode 100644
index 6c1b7cd2b5..0000000000
--- a/files/es/glossary/numero/index.html
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: Number
-slug: Glossary/Numero
-tags:
-  - Glosario
-  - JavaScript
-translation_of: Glossary/Number
----
-<p>En {{Glossary("JavaScript")}}, <strong>Number</strong> es un tipo de datos numérico (<a class="external external-icon" href="http://en.wikipedia.org/wiki/Double_precision_floating-point_format">double-precision 64-bit floating point format (IEEE 754)</a>). En otros lenguajes de programación puede existir diferentes tipos numéricos, por ejemplo: Integers, Floats, Doubles, or Bignums.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li><a href="es.wikipedia.org/wiki/Tipo_de_dato#Num.C3.A9ricos">Tipos de datos numérico en Wikipedia</a></li>
-</ul>
-
-<h3 id="Referencia_Técnica">Referencia Técnica</h3>
-
-<ul>
- <li>La estructura de datos de JavaScript: <a href="/en-US/docs/Web/JavaScript/Data_structures#Number_type">Number</a></li>
- <li>El objeto global de JavaScript: {{jsxref("Number")}}</li>
-</ul>
diff --git a/files/es/glossary/object/index.html b/files/es/glossary/object/index.html
new file mode 100644
index 0000000000..723857e098
--- /dev/null
+++ b/files/es/glossary/object/index.html
@@ -0,0 +1,14 @@
+---
+title: Object
+slug: Glossary/Object
+translation_of: Glossary/Object
+original_slug: Glossary/Objecto
+---
+<p>El <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object">Object</a> se refiere a una estructura de datos que contiene datos e instrucciones para trabajar con los datos.  Algunas veces los Objects se refieren a cosas del mundo real, por ejemplo, un object de un coche o mapa en un juego de carreras. {{glossary("JavaScript")}}, Java, C++, y Python son ejemplos de {{glossary("OOP","programación orientada a objetos")}}.</p>
+
+<h2 id="Aprender_más">Aprender más</h2>
+
+<ul>
+ <li>{{jsxref("Object")}} en la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia">Referencia de JavaScript</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Objects">Estructura de datos Object en JavaScript</a></li>
+</ul>
diff --git a/files/es/glossary/objecto/index.html b/files/es/glossary/objecto/index.html
deleted file mode 100644
index aeda572ea9..0000000000
--- a/files/es/glossary/objecto/index.html
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Object
-slug: Glossary/Objecto
-translation_of: Glossary/Object
----
-<p>El <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object">Object</a> se refiere a una estructura de datos que contiene datos e instrucciones para trabajar con los datos.  Algunas veces los Objects se refieren a cosas del mundo real, por ejemplo, un object de un coche o mapa en un juego de carreras. {{glossary("JavaScript")}}, Java, C++, y Python son ejemplos de {{glossary("OOP","programación orientada a objetos")}}.</p>
-
-<h2 id="Aprender_más">Aprender más</h2>
-
-<ul>
- <li>{{jsxref("Object")}} en la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia">Referencia de JavaScript</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures#Objects">Estructura de datos Object en JavaScript</a></li>
-</ul>
diff --git a/files/es/glossary/operador/index.html b/files/es/glossary/operador/index.html
deleted file mode 100644
index 0385f67830..0000000000
--- a/files/es/glossary/operador/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Operador
-slug: Glossary/Operador
-tags:
-  - Glosario
-  - Scripting
-translation_of: Glossary/Operator
----
-<p>Parte de la sintaxis reservada consistente en signos de puntuación o carácteres alfanuméricos que tienen funcionalidades incorporadas. Por ejemplo, "+" indica el operador suma y "!" indica el operador "not" (negación).</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Referencias_técnicas">Referencias técnicas</h3>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators">Operadores en JavaScript</a></li>
-</ul>
diff --git a/files/es/glossary/operand/index.html b/files/es/glossary/operand/index.html
new file mode 100644
index 0000000000..212d5f1372
--- /dev/null
+++ b/files/es/glossary/operand/index.html
@@ -0,0 +1,16 @@
+---
+title: Operando
+slug: Glossary/Operand
+tags:
+  - Codificación
+  - Glosario
+translation_of: Glossary/Operand
+original_slug: Glossary/Operando
+---
+<p><strong>Un operando</strong> es la parte de una instruccion que representa los datos manipulados por el {{glossary("Operator")}}. por ejemplo, cuando sumas dos numeros, los numeros son el operando y "+" es el operador.</p>
+
+<h2 id="Aprende_mas">Aprende mas</h2>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Operador")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/operando/index.html b/files/es/glossary/operando/index.html
deleted file mode 100644
index 6a198905e3..0000000000
--- a/files/es/glossary/operando/index.html
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Operando
-slug: Glossary/Operando
-tags:
-  - Codificación
-  - Glosario
-translation_of: Glossary/Operand
----
-<p><strong>Un operando</strong> es la parte de una instruccion que representa los datos manipulados por el {{glossary("Operator")}}. por ejemplo, cuando sumas dos numeros, los numeros son el operando y "+" es el operador.</p>
-
-<h2 id="Aprende_mas">Aprende mas</h2>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Operador")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/operator/index.html b/files/es/glossary/operator/index.html
new file mode 100644
index 0000000000..4307dbcf21
--- /dev/null
+++ b/files/es/glossary/operator/index.html
@@ -0,0 +1,18 @@
+---
+title: Operador
+slug: Glossary/Operator
+tags:
+  - Glosario
+  - Scripting
+translation_of: Glossary/Operator
+original_slug: Glossary/Operador
+---
+<p>Parte de la sintaxis reservada consistente en signos de puntuación o carácteres alfanuméricos que tienen funcionalidades incorporadas. Por ejemplo, "+" indica el operador suma y "!" indica el operador "not" (negación).</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Referencias_técnicas">Referencias técnicas</h3>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators">Operadores en JavaScript</a></li>
+</ul>
diff --git a/files/es/glossary/pila_llamadas/index.html b/files/es/glossary/pila_llamadas/index.html
deleted file mode 100644
index f164d913ca..0000000000
--- a/files/es/glossary/pila_llamadas/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: Pila de llamadas
-slug: Glossary/Pila_llamadas
-tags:
-  - Glosario
-  - JavaScript
-  - Pila de llamadas
-translation_of: Glossary/Call_stack
----
-<p>Una <strong>pila de llamadas</strong> es un mecanismo para que un intérprete (como el intérprete de JavaScript en un navegador web) realice un seguimiento de en que lugar se llama a múltiples {{glossary("function","funciones")}}, qué función se esta ejecutando actualmente y qué funciones son llamadas desde esa función, etc.</p>
-
-<ul>
- <li>Cuando un script llama a una función, el intérprete la añade a la pila de llamadas y luego empieza a ejecutar la función.</li>
- <li>Cualquier función o funciones que sean llamadas por esa función son añadidas arriba de la pila de llamadas y serán ejecutadas cuando su llamada sea alcanzada.</li>
- <li>Cuando la función actual termina, el intérprete la elimina de la pila y reanuda la ejecución donde se quedó.</li>
- <li>Si la pila necesita más espacio del que se le asignó, se producirá un error de "desbordamiento de pila".</li>
-</ul>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: js">function saludar() {
-   // [1] Código
-   diHola();
-   // [2] Código
-}
-function diHola() {
-   return "!Hola!";
-}
-
-// Invocar la función `saludar`
-saludar();
-
-// [3] Código
-</pre>
-
-<p>El código del ejemplo se ejecutaría de la siguiente manera:</p>
-
-<ol>
- <li>Ignora todas las funciones hasta que alcanza la invocación de la función <code>saludar()</code>.</li>
- <li>Añade la función <code>saludar()</code> a la lista de la pila de llamadas.
-  <div class="note">
-  <p>Lista de la pila de llamadas:<br>
-   - saludar</p>
-  </div>
- </li>
- <li>Ejecuta todas las líneas de código de dentro de la función <code>saludar()</code>.</li>
- <li>Llega a la incovación de la función <code>diHola()</code>.</li>
- <li>Añade la función <code>diHola()</code> a la lista de la pila de llamadas.
-  <div class="note">
-  <p>Lista de la pila de llamadas:<br>
-   - saludar<br>
-   - diHola</p>
-  </div>
- </li>
- <li>Ejecuta todas las líneas de código de dentro de la función <code>diHola()</code> hasta que llega al final.</li>
- <li>Devuelve la ejecución a la línea que invocó a la función <code>diHola()</code> y continua con la ejecuación del resto de código de la función <code>saludar()</code>.</li>
- <li>Elimina la función <code>diHola()</code> de la lista de la pila de llamadas.
-  <div class="note">
-  <p>Lista de la pila de llamadas:<br>
-   - saludar</p>
-  </div>
- </li>
- <li>Cuando todo el código dentro de la función <code>saludar()</code> ha sido ejecutado, vuelve a la línea que la invocó y continua ejecutando el resto de código JavaScript.</li>
- <li>Elimina la función <code>saludar()</code> de la lista de la pila de llamadas.
-  <div class="note">
-  <p>Lista de la pila de llamadas:<br>
-   VACÍA</p>
-  </div>
- </li>
-</ol>
-
-<p>En resumen, empezamos con una lista de la pila llamadas vacía. Cuando invocamos una función, ésta es automáticamente añadida a la pila de llamadas. Una vez ha ejecutado todo su código, también de manera automática es eliminada de la pila de llamadas. Finalmente, la pila de llamadas vuelve a estar vacía.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Pila de llamadas")}} en Wikipedia</li>
-</ul>
-
-<section class="Quick_links" id="Quick_Links">
-<ul>
- <li><a href="/es-ES/docs/Glossary">Glosario</a>
-
-  <ul>
-   <li>{{Glossary("Call stack", "Pila de llamadas")}}</li>
-   <li>{{Glossary("function", "Función")}}</li>
-  </ul>
- </li>
-</ul>
-</section>
diff --git a/files/es/glossary/plaintext/index.html b/files/es/glossary/plaintext/index.html
new file mode 100644
index 0000000000..6e8a7fa6c9
--- /dev/null
+++ b/files/es/glossary/plaintext/index.html
@@ -0,0 +1,15 @@
+---
+title: Texto Simple
+slug: Glossary/Plaintext
+tags:
+  - Cryptography
+  - Glossary
+  - Security
+translation_of: Glossary/Plaintext
+original_slug: Glossary/TextoSimple
+---
+<p dir="ltr">Texto simple se refiere a la información que se está utilizando como entrada para un {{Glossary("algorithm", "algoritmo")}} de {{Glossary("encryption","cifrado")}}, o para el {{Glossary("ciphertext", "texto cifrado")}} que se ha descifrado.</p>
+
+<p dir="ltr">Con frecuencia se usa indistintamente con el término texto claro, que se refiere de manera más general a cualquier información, como un documento de texto, una imagen, etc., que no se haya cifrado y que un humano o una computadora puedan leer sin procesamiento adicional.</p>
+
+<p> </p>
diff --git a/files/es/glossary/preflight_peticion/index.html b/files/es/glossary/preflight_peticion/index.html
deleted file mode 100644
index 6bd66f555a..0000000000
--- a/files/es/glossary/preflight_peticion/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: Preflight petición
-slug: Glossary/Preflight_peticion
-translation_of: Glossary/Preflight_request
----
-<p>Una petición preflight CORS es una petición <a href="/en-US/docs/Glossary/CORS">CORS</a> realizada para comprobar si el protocolo {{Glossary("CORS")}} es comprendido.</p>
-
-<p>Es una petición {{HTTPMethod("OPTIONS")}}, que emplea tres cabeceras HTTP: {{HTTPHeader("Access-Control-Request-Method")}}, {{HTTPHeader("Access-Control-Request-Headers")}}, y la cabecera {{HTTPHeader("Origin")}} .</p>
-
-<p>Las peticiones preflight se lanzan automáticamente desde el navegador cuando son necesarias. Normalmente los desarrolladores front-end no necesitan realizar estas peticiones manualmente.</p>
-
-<p>Por ejemplo, un cliente puede preguntar si el servidor permite una petición {{HTTPMethod("DELETE")}} antes de enviar la petición <code>DELETE </code>usando una petición preflight:</p>
-
-<pre>OPTIONS /resource/foo
-Access-Control-Request-Method: DELETE
-Access-Control-Request-Headers: origin, x-requested-with
-Origin: https://foo.bar.org</pre>
-
-<p>Si el servidor lo permite responderá a la petición preflight con una cabecera de respuesta {{HTTPHeader("Access-Control-Allow-Methods")}} que incluirá el método <code>DELETE</code>:</p>
-
-<pre>HTTP/1.1 200 OK
-Content-Length: 0
-Connection: keep-alive
-Access-Control-Allow-Origin: https://foo.bar.org
-Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
-Access-Control-Max-Age: 86400</pre>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Glossary/CORS">CORS</a></li>
- <li>{{HTTPMethod("OPTIONS")}}</li>
-</ul>
diff --git a/files/es/glossary/preflight_request/index.html b/files/es/glossary/preflight_request/index.html
new file mode 100644
index 0000000000..4c9aa5ddb8
--- /dev/null
+++ b/files/es/glossary/preflight_request/index.html
@@ -0,0 +1,34 @@
+---
+title: Preflight petición
+slug: Glossary/Preflight_request
+translation_of: Glossary/Preflight_request
+original_slug: Glossary/Preflight_peticion
+---
+<p>Una petición preflight CORS es una petición <a href="/en-US/docs/Glossary/CORS">CORS</a> realizada para comprobar si el protocolo {{Glossary("CORS")}} es comprendido.</p>
+
+<p>Es una petición {{HTTPMethod("OPTIONS")}}, que emplea tres cabeceras HTTP: {{HTTPHeader("Access-Control-Request-Method")}}, {{HTTPHeader("Access-Control-Request-Headers")}}, y la cabecera {{HTTPHeader("Origin")}} .</p>
+
+<p>Las peticiones preflight se lanzan automáticamente desde el navegador cuando son necesarias. Normalmente los desarrolladores front-end no necesitan realizar estas peticiones manualmente.</p>
+
+<p>Por ejemplo, un cliente puede preguntar si el servidor permite una petición {{HTTPMethod("DELETE")}} antes de enviar la petición <code>DELETE </code>usando una petición preflight:</p>
+
+<pre>OPTIONS /resource/foo
+Access-Control-Request-Method: DELETE
+Access-Control-Request-Headers: origin, x-requested-with
+Origin: https://foo.bar.org</pre>
+
+<p>Si el servidor lo permite responderá a la petición preflight con una cabecera de respuesta {{HTTPHeader("Access-Control-Allow-Methods")}} que incluirá el método <code>DELETE</code>:</p>
+
+<pre>HTTP/1.1 200 OK
+Content-Length: 0
+Connection: keep-alive
+Access-Control-Allow-Origin: https://foo.bar.org
+Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
+Access-Control-Max-Age: 86400</pre>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Glossary/CORS">CORS</a></li>
+ <li>{{HTTPMethod("OPTIONS")}}</li>
+</ul>
diff --git a/files/es/glossary/preprocesador_css/index.html b/files/es/glossary/preprocesador_css/index.html
deleted file mode 100644
index 7304385604..0000000000
--- a/files/es/glossary/preprocesador_css/index.html
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: Preprocesador CSS
-slug: Glossary/Preprocesador_CSS
-translation_of: Glossary/CSS_preprocessor
----
-<p><span class="seoSummary">Un preprocesador CSS es un programa que te permite generar {{Glossary("CSS")}} a partir de la {{Glossary("syntax")}} única del preprocesador. </span>Existen varios preprocesadores CSS de los cuales escoger, sin embargo la mayoría de preprocesadores CSS añadiran algunas características que no existen en CSS puro, como {{Glossary("variable")}}, mixins, selectores anidados, entre otros. Estas características hacen la estructura de CSS más legible y fácil de mantener.</p>
-
-<p>Para utilizar un preprocesador CSS debes instalar un compilador CSS en tu web  {{Glossary("server")}}.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<p>Estos son algunos de lo preprocesadores CSS más populares:</p>
-
-<ul>
- <li><a href="http://sass-lang.com/">SASS</a></li>
- <li><a href="http://lesscss.org/">LESS</a></li>
- <li><a href="http://stylus-lang.com/">Stylus</a></li>
- <li><a href="http://postcss.org/">PostCSS</a></li>
-</ul>
diff --git a/files/es/glossary/primitive/index.html b/files/es/glossary/primitive/index.html
new file mode 100644
index 0000000000..2591883ebb
--- /dev/null
+++ b/files/es/glossary/primitive/index.html
@@ -0,0 +1,126 @@
+---
+title: Primitivo
+slug: Glossary/Primitive
+tags:
+  - CodingScripting
+  - Glosario
+  - JavaScript
+translation_of: Glossary/Primitive
+original_slug: Glossary/Primitivo
+---
+<p><span class="seoSummary">En {{Glossary("JavaScript")}}, un <strong>primitive</strong> (valor primitivo, tipo de dato primitivo) son datos que no son un {{Glossary("object", "objeto")}} y no tienen {{Glossary("method", "métodos")}}. Hay 6 tipos de datos primitivos: {{Glossary("string")}}, {{Glossary("number")}}, {{Glossary("bigint")}}, {{Glossary("boolean")}} , {{Glossary("undefined")}} y {{Glossary("symbol")}}. También hay {{Glossary("null")}}, que aparentemente es primitivo, pero de hecho es un caso especial para cada {{JSxRef("Object")}}: y cualquier tipo estructurado se deriva de <code>null</code> por la {{web.link("/es/docs/Learn/JavaScript/Objects/Inheritance", "Cadena de prototipos")}}.</span></p>
+
+<p>La mayoría de las veces, un valor primitivo se representa directamente en el nivel más bajo de la implementación del lenguaje.</p>
+
+<p>Todos los primitivos son <strong>inmutables</strong>, es decir, no se pueden modificar. Es importante no confundir un primitivo en sí mismo con un valor primitivo asignado a una variable. Se puede reasignar un nuevo valor a la variable, pero el valor existente no se puede cambiar de la misma forma en que se pueden modificar los objetos, los arreglos y las funciones.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Este ejemplo te ayudará a comprender que los valores primitivos son <strong>inmutables</strong>.</p>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js notranslate">// El uso de un método de cadena no modifica la cadena
+var bar = "baz";
+console.log(bar);               // baz
+bar.toUpperCase();
+console.log(bar);               // baz
+
+// El uso de un método de arreglo muta el arreglo
+var foo = [];
+console.log(foo);               // []
+foo.push("plugh");
+console.log(foo);               // ["plugh"]
+
+// La asignación le da al primitivo un nuevo valor (no lo muta)
+bar = bar.toUpperCase();       // BAZ
+</pre>
+
+<p>Un primitivo se puede reemplazar, pero no se puede modificar directamente.</p>
+
+<h2 id="Otro_ejemplo_paso_a_paso">Otro ejemplo [paso a paso]</h2>
+
+<p>El siguiente ejemplo te ayudará a analizar cómo se ocupa JavaScript de los primitivos.</p>
+
+<h3 class="highlight-spanned" id="JavaScript_2"><span class="highlight-span">JavaScript</span></h3>
+
+<pre class="brush: js line-numbers  language-js notranslate">// El primitivo
+let foo = 5;
+
+// Define una función que debería cambiar el valor primitivo
+function addTwo(num) {
+   num += 2;
+}
+// Otra función que intenta hacer lo mismo
+function addTwo_v2(foo) {
+   foo += 2;
+}
+
+// Llama a tu primera función mientras pasas el primitivo como argumento
+addTwo(foo);
+// Obtiene el valor primitivo actual
+console.log(foo);   // 5
+
+// Intenta de nuevo con tu segunda función...
+addTwo_v2(foo);
+console.log(foo);   // 5
+</pre>
+
+<p>¿Esperaba que fuera <code>7</code> en lugar de <code>5</code>?, si es así, lee cómo se ejecuta este código:</p>
+
+<ul>
+ <li>Para las llamadas a las funciones <code>addTwo</code> y <code>addTwo_v2</code>, JavaScript busca el valor del identificador <code>foo</code>. Encuentra correctamente tu variable instanciada con la primera declaración</li>
+ <li>Después de encontrarla, evalúa la expresión, <code>foo</code> se reemplaza por 5 y el motor de JavaScript pasa ese valor a las funciones como argumento</li>
+ <li>Antes de ejecutar las declaraciones dentro del cuerpo de las funciones, <strong>JavaScript toma una copia del argumento originalmente pasado</strong> (que es un primitivo) y crea una copia local. Estas copias, que existen solo dentro del ámbito de las funciones, son accesibles a través de los identificadores que especificaste en las definiciones de las funciones (<code>num</code> para <code>addTwo</code>, <code>foo</code> para <code>addTwo_v2</code>)</li>
+ <li>Luego, se ejecutan las instrucciones de las funciones:
+  <ul>
+   <li>En la primera función, se creó una variable <code>num</code> local. ¡Estas aumentando su valor en 2, no el valor original de <code>foo</code>!</li>
+   <li>En la segunda función, se creó una variable <code>foo</code> local. ¡Esto incrementa su valor en 2, no el valor original (externo) de <code>foo</code>!, además, en esta situación, no se puede acceder directamente a la variable <code>foo</code> externa. Esto se debe al alcance léxico de JavaScript y al ensombrecimiento de variables resultante. El <code>foo</code> local oculta al <code>foo</code> externo. Para obtener más información, consulta {{JSxRef("../Closures", "Cierres")}}. (Ten en cuenta que <code>window.foo</code> aún se podría usar para acceder a la variable <code>foo</code> externa).</li>
+  </ul>
+ </li>
+ <li>En conclusión, cualquier cambio dentro de tus funciones <strong>no</strong> afectará a la <code>foo</code> original en absoluto, ya que estas modificando <strong>copias</strong> de la misma.</li>
+</ul>
+
+<p>Es por eso que los primitivos son inmutables: en lugar de cambiarlos directamente, modificas una <em>copia, sin afectar el original</em>.</p>
+
+<h2 id="Envolturas_de_objetos_primitivos_en_JavaScript">Envolturas de objetos primitivos en JavaScript</h2>
+
+<p>A excepción de <code>null</code> y <code>undefined</code>, todos los valores primitivos tienen objetos equivalentes que envuelven los valores primitivos:</p>
+
+<ul>
+ <li>{{JSxRef("String")}} para el <code>string</code> primitivo.</li>
+ <li>{{JSxRef("Number")}} para el <code>number</code> primitivo.</li>
+ <li>{{JSxRef("BigInt")}} para el <code>bigint</code> primitivo.</li>
+ <li>{{JSxRef("Boolean")}} para el <code>boolean</code> primitivo.</li>
+ <li>{{JSxRef("Symbol")}} para el <code>symbol</code> primitivo.</li>
+</ul>
+
+<p>El método {{JSxRef("Objetos_globales/Object/valueOf"," valueOf()")}} del contenedor devuelve el valor primitivo.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{JSxRef("../Data_structures", "Introducción a los tipos de datos de JavaScript")}}</li>
+ <li>{{Interwiki("wikipedia", "Tipo de dato primitivo")}} en Wikipedia</li>
+</ul>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li>{{Link("/es/docs/Glossary")}}
+
+  <ol>
+   <li>{{Glossary("JavaScript")}}</li>
+   <li>{{Glossary("string")}}</li>
+   <li>{{Glossary("number")}}</li>
+   <li>{{Glossary("bigint")}}</li>
+   <li>{{Glossary("boolean")}}</li>
+   <li>{{Glossary("null")}}</li>
+   <li>{{Glossary("undefined")}}</li>
+   <li>{{Glossary("symbol")}}</li>
+  </ol>
+ </li>
+ <li>{{JSxRef("../Data_structures", "Tipos de datos JavaScript")}}</li>
+</ol>
+</section>
diff --git a/files/es/glossary/primitivo/index.html b/files/es/glossary/primitivo/index.html
deleted file mode 100644
index 1966a23803..0000000000
--- a/files/es/glossary/primitivo/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: Primitivo
-slug: Glossary/Primitivo
-tags:
-  - CodingScripting
-  - Glosario
-  - JavaScript
-translation_of: Glossary/Primitive
----
-<p><span class="seoSummary">En {{Glossary("JavaScript")}}, un <strong>primitive</strong> (valor primitivo, tipo de dato primitivo) son datos que no son un {{Glossary("object", "objeto")}} y no tienen {{Glossary("method", "métodos")}}. Hay 6 tipos de datos primitivos: {{Glossary("string")}}, {{Glossary("number")}}, {{Glossary("bigint")}}, {{Glossary("boolean")}} , {{Glossary("undefined")}} y {{Glossary("symbol")}}. También hay {{Glossary("null")}}, que aparentemente es primitivo, pero de hecho es un caso especial para cada {{JSxRef("Object")}}: y cualquier tipo estructurado se deriva de <code>null</code> por la {{web.link("/es/docs/Learn/JavaScript/Objects/Inheritance", "Cadena de prototipos")}}.</span></p>
-
-<p>La mayoría de las veces, un valor primitivo se representa directamente en el nivel más bajo de la implementación del lenguaje.</p>
-
-<p>Todos los primitivos son <strong>inmutables</strong>, es decir, no se pueden modificar. Es importante no confundir un primitivo en sí mismo con un valor primitivo asignado a una variable. Se puede reasignar un nuevo valor a la variable, pero el valor existente no se puede cambiar de la misma forma en que se pueden modificar los objetos, los arreglos y las funciones.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Este ejemplo te ayudará a comprender que los valores primitivos son <strong>inmutables</strong>.</p>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<pre class="brush: js notranslate">// El uso de un método de cadena no modifica la cadena
-var bar = "baz";
-console.log(bar);               // baz
-bar.toUpperCase();
-console.log(bar);               // baz
-
-// El uso de un método de arreglo muta el arreglo
-var foo = [];
-console.log(foo);               // []
-foo.push("plugh");
-console.log(foo);               // ["plugh"]
-
-// La asignación le da al primitivo un nuevo valor (no lo muta)
-bar = bar.toUpperCase();       // BAZ
-</pre>
-
-<p>Un primitivo se puede reemplazar, pero no se puede modificar directamente.</p>
-
-<h2 id="Otro_ejemplo_paso_a_paso">Otro ejemplo [paso a paso]</h2>
-
-<p>El siguiente ejemplo te ayudará a analizar cómo se ocupa JavaScript de los primitivos.</p>
-
-<h3 class="highlight-spanned" id="JavaScript_2"><span class="highlight-span">JavaScript</span></h3>
-
-<pre class="brush: js line-numbers  language-js notranslate">// El primitivo
-let foo = 5;
-
-// Define una función que debería cambiar el valor primitivo
-function addTwo(num) {
-   num += 2;
-}
-// Otra función que intenta hacer lo mismo
-function addTwo_v2(foo) {
-   foo += 2;
-}
-
-// Llama a tu primera función mientras pasas el primitivo como argumento
-addTwo(foo);
-// Obtiene el valor primitivo actual
-console.log(foo);   // 5
-
-// Intenta de nuevo con tu segunda función...
-addTwo_v2(foo);
-console.log(foo);   // 5
-</pre>
-
-<p>¿Esperaba que fuera <code>7</code> en lugar de <code>5</code>?, si es así, lee cómo se ejecuta este código:</p>
-
-<ul>
- <li>Para las llamadas a las funciones <code>addTwo</code> y <code>addTwo_v2</code>, JavaScript busca el valor del identificador <code>foo</code>. Encuentra correctamente tu variable instanciada con la primera declaración</li>
- <li>Después de encontrarla, evalúa la expresión, <code>foo</code> se reemplaza por 5 y el motor de JavaScript pasa ese valor a las funciones como argumento</li>
- <li>Antes de ejecutar las declaraciones dentro del cuerpo de las funciones, <strong>JavaScript toma una copia del argumento originalmente pasado</strong> (que es un primitivo) y crea una copia local. Estas copias, que existen solo dentro del ámbito de las funciones, son accesibles a través de los identificadores que especificaste en las definiciones de las funciones (<code>num</code> para <code>addTwo</code>, <code>foo</code> para <code>addTwo_v2</code>)</li>
- <li>Luego, se ejecutan las instrucciones de las funciones:
-  <ul>
-   <li>En la primera función, se creó una variable <code>num</code> local. ¡Estas aumentando su valor en 2, no el valor original de <code>foo</code>!</li>
-   <li>En la segunda función, se creó una variable <code>foo</code> local. ¡Esto incrementa su valor en 2, no el valor original (externo) de <code>foo</code>!, además, en esta situación, no se puede acceder directamente a la variable <code>foo</code> externa. Esto se debe al alcance léxico de JavaScript y al ensombrecimiento de variables resultante. El <code>foo</code> local oculta al <code>foo</code> externo. Para obtener más información, consulta {{JSxRef("../Closures", "Cierres")}}. (Ten en cuenta que <code>window.foo</code> aún se podría usar para acceder a la variable <code>foo</code> externa).</li>
-  </ul>
- </li>
- <li>En conclusión, cualquier cambio dentro de tus funciones <strong>no</strong> afectará a la <code>foo</code> original en absoluto, ya que estas modificando <strong>copias</strong> de la misma.</li>
-</ul>
-
-<p>Es por eso que los primitivos son inmutables: en lugar de cambiarlos directamente, modificas una <em>copia, sin afectar el original</em>.</p>
-
-<h2 id="Envolturas_de_objetos_primitivos_en_JavaScript">Envolturas de objetos primitivos en JavaScript</h2>
-
-<p>A excepción de <code>null</code> y <code>undefined</code>, todos los valores primitivos tienen objetos equivalentes que envuelven los valores primitivos:</p>
-
-<ul>
- <li>{{JSxRef("String")}} para el <code>string</code> primitivo.</li>
- <li>{{JSxRef("Number")}} para el <code>number</code> primitivo.</li>
- <li>{{JSxRef("BigInt")}} para el <code>bigint</code> primitivo.</li>
- <li>{{JSxRef("Boolean")}} para el <code>boolean</code> primitivo.</li>
- <li>{{JSxRef("Symbol")}} para el <code>symbol</code> primitivo.</li>
-</ul>
-
-<p>El método {{JSxRef("Objetos_globales/Object/valueOf"," valueOf()")}} del contenedor devuelve el valor primitivo.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{JSxRef("../Data_structures", "Introducción a los tipos de datos de JavaScript")}}</li>
- <li>{{Interwiki("wikipedia", "Tipo de dato primitivo")}} en Wikipedia</li>
-</ul>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li>{{Link("/es/docs/Glossary")}}
-
-  <ol>
-   <li>{{Glossary("JavaScript")}}</li>
-   <li>{{Glossary("string")}}</li>
-   <li>{{Glossary("number")}}</li>
-   <li>{{Glossary("bigint")}}</li>
-   <li>{{Glossary("boolean")}}</li>
-   <li>{{Glossary("null")}}</li>
-   <li>{{Glossary("undefined")}}</li>
-   <li>{{Glossary("symbol")}}</li>
-  </ol>
- </li>
- <li>{{JSxRef("../Data_structures", "Tipos de datos JavaScript")}}</li>
-</ol>
-</section>
diff --git a/files/es/glossary/property/index.html b/files/es/glossary/property/index.html
new file mode 100644
index 0000000000..a5578b1ff2
--- /dev/null
+++ b/files/es/glossary/property/index.html
@@ -0,0 +1,12 @@
+---
+title: Propiedad
+slug: Glossary/property
+tags:
+  - Desambiguación
+  - Glosario
+translation_of: Glossary/property
+original_slug: Glossary/propiedad
+---
+<p>El término <strong>propiedad</strong> puede tener varios significados según el contexto. Se puede referir a:</p>
+
+<p>\{{GlossaryDisambiguation}}</p>
diff --git a/files/es/glossary/propiedad/index.html b/files/es/glossary/propiedad/index.html
deleted file mode 100644
index 07eae32e78..0000000000
--- a/files/es/glossary/propiedad/index.html
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Propiedad
-slug: Glossary/propiedad
-tags:
-  - Desambiguación
-  - Glosario
-translation_of: Glossary/property
----
-<p>El término <strong>propiedad</strong> puede tener varios significados según el contexto. Se puede referir a:</p>
-
-<p>\{{GlossaryDisambiguation}}</p>
diff --git a/files/es/glossary/pseudo-clase/index.html b/files/es/glossary/pseudo-clase/index.html
deleted file mode 100644
index b3984258d3..0000000000
--- a/files/es/glossary/pseudo-clase/index.html
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Pseudo-clase
-slug: Glossary/Pseudo-clase
-tags:
-  - CSS
-  - Glosario
-  - Pseudo-clase
-  - Selector
-  - Selectores
-translation_of: Glossary/Pseudo-class
----
-<p>En CSS, un selector de <strong>pseudo-clase </strong>apunta a elementos dependiendo de su estado en lugar de en su información en el arbol del documento. Por ejemplo, el selector <code>a</code>{{ cssxref(":visited") }} aplica estilos solamente a los links que el usuario ha visitado.</p>
-
-<h2 id="Aprender_más">Aprender más</h2>
-
-<h3 id="Referencía_técnica">Referencía técnica</h3>
-
-<ul>
- <li><a href="/en-US/docs/Web/CSS/Pseudo-classes">Pseudo-class documentación</a></li>
-</ul>
diff --git a/files/es/glossary/pseudo-class/index.html b/files/es/glossary/pseudo-class/index.html
new file mode 100644
index 0000000000..549bc2b1f9
--- /dev/null
+++ b/files/es/glossary/pseudo-class/index.html
@@ -0,0 +1,21 @@
+---
+title: Pseudo-clase
+slug: Glossary/Pseudo-class
+tags:
+  - CSS
+  - Glosario
+  - Pseudo-clase
+  - Selector
+  - Selectores
+translation_of: Glossary/Pseudo-class
+original_slug: Glossary/Pseudo-clase
+---
+<p>En CSS, un selector de <strong>pseudo-clase </strong>apunta a elementos dependiendo de su estado en lugar de en su información en el arbol del documento. Por ejemplo, el selector <code>a</code>{{ cssxref(":visited") }} aplica estilos solamente a los links que el usuario ha visitado.</p>
+
+<h2 id="Aprender_más">Aprender más</h2>
+
+<h3 id="Referencía_técnica">Referencía técnica</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Web/CSS/Pseudo-classes">Pseudo-class documentación</a></li>
+</ul>
diff --git a/files/es/glossary/pseudocode/index.html b/files/es/glossary/pseudocode/index.html
new file mode 100644
index 0000000000..75af780d8d
--- /dev/null
+++ b/files/es/glossary/pseudocode/index.html
@@ -0,0 +1,19 @@
+---
+title: Pseudocódigo
+slug: Glossary/Pseudocode
+tags:
+  - CodingScripting
+  - Glosario
+  - Pseudocódigo
+translation_of: Glossary/Pseudocode
+original_slug: Glossary/Pseudocódigo
+---
+<p>El pseudocódigo se refiere a la sintaxis del código que generalmente se usa para indicar a los humanos cómo funciona dicho código, o para ilustrar el diseño de un elemento. No funcionará si intentas ejecutarlo como código.</p>
+
+<h2 id="Saber_más"><strong>Saber más</strong></h2>
+
+<h3 id="Conocimientos_generales"><strong>Conocimientos generales</strong></h3>
+
+<ul>
+ <li>{{interwiki("wikipedia", "Pseudocódigo", "Pseudocódigo")}} en Wikipedia.</li>
+</ul>
diff --git a/files/es/glossary/pseudocódigo/index.html b/files/es/glossary/pseudocódigo/index.html
deleted file mode 100644
index 7a68d05ecb..0000000000
--- a/files/es/glossary/pseudocódigo/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Pseudocódigo
-slug: Glossary/Pseudocódigo
-tags:
-  - CodingScripting
-  - Glosario
-  - Pseudocódigo
-translation_of: Glossary/Pseudocode
----
-<p>El pseudocódigo se refiere a la sintaxis del código que generalmente se usa para indicar a los humanos cómo funciona dicho código, o para ilustrar el diseño de un elemento. No funcionará si intentas ejecutarlo como código.</p>
-
-<h2 id="Saber_más"><strong>Saber más</strong></h2>
-
-<h3 id="Conocimientos_generales"><strong>Conocimientos generales</strong></h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Pseudocódigo", "Pseudocódigo")}} en Wikipedia.</li>
-</ul>
diff --git a/files/es/glossary/recursion/index.html b/files/es/glossary/recursion/index.html
new file mode 100644
index 0000000000..cb0f4d9cf0
--- /dev/null
+++ b/files/es/glossary/recursion/index.html
@@ -0,0 +1,19 @@
+---
+title: Recursión
+slug: Glossary/Recursion
+tags:
+  - CodingScripting
+  - Glosario
+translation_of: Glossary/Recursion
+original_slug: Glossary/Recursión
+---
+<p>Es el acto de una función llamándose a sí misma. La recursión es utilizada para resolver problemas que contienen subproblemas más pequeños. Una función recursiva puede recibir 2 entradas: un caso base (finaliza la recursión) o un un caso recursivo (continúa la recursión).</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Recursión_(ciencias_de_computación)">Recursión</a> en Wikipedia</li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Funciones#Recursion">Más detalles sobre recursión en Javascript</a></li>
+</ul>
diff --git a/files/es/glossary/recursión/index.html b/files/es/glossary/recursión/index.html
deleted file mode 100644
index 866ba64a33..0000000000
--- a/files/es/glossary/recursión/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Recursión
-slug: Glossary/Recursión
-tags:
-  - CodingScripting
-  - Glosario
-translation_of: Glossary/Recursion
----
-<p>Es el acto de una función llamándose a sí misma. La recursión es utilizada para resolver problemas que contienen subproblemas más pequeños. Una función recursiva puede recibir 2 entradas: un caso base (finaliza la recursión) o un un caso recursivo (continúa la recursión).</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Recursión_(ciencias_de_computación)">Recursión</a> en Wikipedia</li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Funciones#Recursion">Más detalles sobre recursión en Javascript</a></li>
-</ul>
diff --git a/files/es/glossary/safe/index.html b/files/es/glossary/safe/index.html
new file mode 100644
index 0000000000..7a2be815a7
--- /dev/null
+++ b/files/es/glossary/safe/index.html
@@ -0,0 +1,41 @@
+---
+title: Seguro
+slug: Glossary/safe
+translation_of: Glossary/safe
+original_slug: Glossary/seguro
+---
+<p>Un método  HTTP es <strong>seguro</strong> cuando no altera el estado del servidor. En otras palabras, un método HTTP es seguro solo cuando ejecuta una operación de lectura. Todos los métodos seguros también son {{glossary("idempotent")}} así como algunos, pero no todos, métodos inseguros como {{HTTPMethod("PUT")}}, o {{HTTPMethod("DELETE")}}.</p>
+
+<p>Incluso si los métodos seguros tienen una semántica de solo lectura, los servidores pueden alterar su estado: por ejemplo, pueden registrar o mantener estadísticas. Lo importante aquí es que al llamar a un método seguro, el cliente no solicita ningún cambio en el servidor y, por lo tanto, no creará una carga o carga innecesaria para el servidor. Los navegadores pueden llamar a métodos seguros sin temor a causar ningún daño al servidor: esto les permite realizar actividades como la búsqueda previa sin riesgos. Los rastreadores web también confían en llamar a métodos seguros.</p>
+
+<p>Los métodos seguros no solo sirven archivos estáticos; un servidor puede generar una respuesta a un método seguro sobre la marcha, siempre que el script de generación garantice la seguridad: no debe desencadenar efectos externos, como desencadenar un pedido en un sitio web de comercio electrónico.</p>
+
+<p>Es responsabilidad de la aplicación en el servidor implementar la semántica segura correctamente, el propio servidor web, ya sea Apache, nginx o IIS, no puede imponerlo por sí mismo. En particular, una aplicación no debe permitir que {{HTTPMethod("GET")}} solicite alterar su estado.</p>
+
+<p>Una petición de un método seguro, no cambia ningún estado en el servidor:</p>
+
+<pre>GET /pageX.html HTTP/1.1
+</pre>
+
+<p>Una petición de un método inseguro, puede cambiar el estado en el servidor:</p>
+
+<pre>POST /pageX.html HTTP/1.1 </pre>
+
+<p>Una petición de un método idempotente pero no seguro:</p>
+
+<pre>DELETE /idX/delete HTTP/1.1</pre>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>Definición de <a href="https://tools.ietf.org/html/rfc7231#section-4.2.1">seguro</a> en la especificación HTTP.</li>
+</ul>
+
+<h3 id="Conocimientos_técnicos">Conocimientos técnicos</h3>
+
+<ul>
+ <li>Descripción de los metodos seguros: {{HTTPMethod("GET")}}, {{HTTPMethod("HEAD")}}, {{HTTPMethod("OPTIONS")}}</li>
+ <li>Descripción de los métodos inseguros: {{HTTPMethod("PUT")}}, {{HTTPMethod("DELETE")}}, {{HTTPMethod("POST")}}</li>
+</ul>
diff --git a/files/es/glossary/scm/index.html b/files/es/glossary/scm/index.html
new file mode 100644
index 0000000000..a05c47a98b
--- /dev/null
+++ b/files/es/glossary/scm/index.html
@@ -0,0 +1,21 @@
+---
+title: SCV
+slug: Glossary/SCM
+tags:
+  - CodingScripting
+  - Glosario
+  - SCV
+translation_of: Glossary/SCM
+original_slug: Glossary/SCV
+---
+<p>Un SCV (sistema de control de versiones) es un sistema para gestionar código fuente. Normalmente se refiere al uso de software para manejar versiones de ficheros fuente. Un programador puede modificar ficheros de código fuente sin miedo a eliminar código que funciona, porque un SCV realiza un seguimiento de cómo el código fuente ha cambiado y quién ha realizado los cambios.</p>
+
+<p>Algunos sistemas SCV son CVS, SVN y Git.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Control_de_versiones">Control de versiones</a> en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/scv/index.html b/files/es/glossary/scv/index.html
deleted file mode 100644
index be400de190..0000000000
--- a/files/es/glossary/scv/index.html
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: SCV
-slug: Glossary/SCV
-tags:
-  - CodingScripting
-  - Glosario
-  - SCV
-translation_of: Glossary/SCM
----
-<p>Un SCV (sistema de control de versiones) es un sistema para gestionar código fuente. Normalmente se refiere al uso de software para manejar versiones de ficheros fuente. Un programador puede modificar ficheros de código fuente sin miedo a eliminar código que funciona, porque un SCV realiza un seguimiento de cómo el código fuente ha cambiado y quién ha realizado los cambios.</p>
-
-<p>Algunos sistemas SCV son CVS, SVN y Git.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Control_de_versiones">Control de versiones</a> en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/seguro/index.html b/files/es/glossary/seguro/index.html
deleted file mode 100644
index f5c1c42763..0000000000
--- a/files/es/glossary/seguro/index.html
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: Seguro
-slug: Glossary/seguro
-translation_of: Glossary/safe
----
-<p>Un método  HTTP es <strong>seguro</strong> cuando no altera el estado del servidor. En otras palabras, un método HTTP es seguro solo cuando ejecuta una operación de lectura. Todos los métodos seguros también son {{glossary("idempotent")}} así como algunos, pero no todos, métodos inseguros como {{HTTPMethod("PUT")}}, o {{HTTPMethod("DELETE")}}.</p>
-
-<p>Incluso si los métodos seguros tienen una semántica de solo lectura, los servidores pueden alterar su estado: por ejemplo, pueden registrar o mantener estadísticas. Lo importante aquí es que al llamar a un método seguro, el cliente no solicita ningún cambio en el servidor y, por lo tanto, no creará una carga o carga innecesaria para el servidor. Los navegadores pueden llamar a métodos seguros sin temor a causar ningún daño al servidor: esto les permite realizar actividades como la búsqueda previa sin riesgos. Los rastreadores web también confían en llamar a métodos seguros.</p>
-
-<p>Los métodos seguros no solo sirven archivos estáticos; un servidor puede generar una respuesta a un método seguro sobre la marcha, siempre que el script de generación garantice la seguridad: no debe desencadenar efectos externos, como desencadenar un pedido en un sitio web de comercio electrónico.</p>
-
-<p>Es responsabilidad de la aplicación en el servidor implementar la semántica segura correctamente, el propio servidor web, ya sea Apache, nginx o IIS, no puede imponerlo por sí mismo. En particular, una aplicación no debe permitir que {{HTTPMethod("GET")}} solicite alterar su estado.</p>
-
-<p>Una petición de un método seguro, no cambia ningún estado en el servidor:</p>
-
-<pre>GET /pageX.html HTTP/1.1
-</pre>
-
-<p>Una petición de un método inseguro, puede cambiar el estado en el servidor:</p>
-
-<pre>POST /pageX.html HTTP/1.1 </pre>
-
-<p>Una petición de un método idempotente pero no seguro:</p>
-
-<pre>DELETE /idX/delete HTTP/1.1</pre>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>Definición de <a href="https://tools.ietf.org/html/rfc7231#section-4.2.1">seguro</a> en la especificación HTTP.</li>
-</ul>
-
-<h3 id="Conocimientos_técnicos">Conocimientos técnicos</h3>
-
-<ul>
- <li>Descripción de los metodos seguros: {{HTTPMethod("GET")}}, {{HTTPMethod("HEAD")}}, {{HTTPMethod("OPTIONS")}}</li>
- <li>Descripción de los métodos inseguros: {{HTTPMethod("PUT")}}, {{HTTPMethod("DELETE")}}, {{HTTPMethod("POST")}}</li>
-</ul>
diff --git a/files/es/glossary/sentencias/index.html b/files/es/glossary/sentencias/index.html
deleted file mode 100644
index 501478a820..0000000000
--- a/files/es/glossary/sentencias/index.html
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Sentencias
-slug: Glossary/Sentencias
-tags:
-  - Glosario
-  - Principiante
-translation_of: Glossary/Statement
----
-<p>En un lenguaje de programación, una <strong>sentencia</strong> es una línea de código al mando de una tarea <span style="line-height: 1.5;">Cada programa consiste en una secuencia de sentencias.</span></p>
-
-<h2 id="Aprender_más" style="line-height: 30px; font-size: 2.14285714285714rem;">Aprender más</h2>
-
-<h3 id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements">Sentencias y declaraciones en JavaScript</a> (en inglés)</li>
-</ul>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li><a href="http://en.wikipedia.org/wiki/Statement_(computer_science)">Sentencias - Wikipedia</a> (en inglés)</li>
-</ul>
diff --git a/files/es/glossary/sincronico/index.html b/files/es/glossary/sincronico/index.html
deleted file mode 100644
index cfe10edd6f..0000000000
--- a/files/es/glossary/sincronico/index.html
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: Sincrónico
-slug: Glossary/Sincronico
-tags:
-  - Glosario
-  - Mecánicas
-  - Web
-  - WebMechanics
-translation_of: Glossary/Synchronous
----
-<p>Sincrónico<em> se</em> refiere a la comunicación en tiempo real donde cada lado recibe (y si es necesario, procesa y responde) mensajes instantáneamente (o lo más cerca posible a instantáneamente).</p>
-
-<p>Un ejemplo humano es el teléfono — durante una llamada telefónica tiendes a responder a la otra persona inmediatamente.</p>
-
-<p>Muchos comandos de programación son también sincrónicos — por ejemplo cuando escribes en una calculadora, el entorno te devolverá el resultado instantáneamente, a menos que lo programes para no hacerlo.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Referencias_técnicas">Referencias técnicas</h3>
-
-<ul>
- <li>{{glossary("Asynchronous")}}</li>
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests">Solicitudes síncronas y asíncronas</a> usando la {{glossary("API")}} <a href="https://developer.mozilla.org/es/docs/Web/API/XMLHttpRequest">XMLHttpRequest()</a></li>
-</ul>
diff --git a/files/es/glossary/sistema_gestion_contenidos/index.html b/files/es/glossary/sistema_gestion_contenidos/index.html
deleted file mode 100644
index e4a67f504b..0000000000
--- a/files/es/glossary/sistema_gestion_contenidos/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Sistema de gestión de contenidos
-slug: Glossary/Sistema_gestion_contenidos
-tags:
-  - CMS
-  - Glosario
-  - Sistema de gestión de contenidos
-translation_of: Glossary/CMS
----
-<p>Un sistema de gestión de contenidos o CMS es un programa informático que permite a los usuarios publicar, organizar, cambiar o eliminar diferentes tipos de contenido como texto, imágenes incrustadas, video, audio y código interactivo.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Sistema de gestión de contenidos")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/speculative_parsing/index.html b/files/es/glossary/speculative_parsing/index.html
new file mode 100644
index 0000000000..95ea987e5a
--- /dev/null
+++ b/files/es/glossary/speculative_parsing/index.html
@@ -0,0 +1,35 @@
+---
+title: Optimizar sus páginas para análisis especulativo
+slug: Glossary/speculative_parsing
+tags:
+  - Avanzado
+  - Desarrollo web
+  - HTML
+  - HTML5
+translation_of: Glossary/speculative_parsing
+original_slug: Web/HTML/Optimizing_your_pages_for_speculative_parsing
+---
+<p><span class="seoSummary">Tradicionalmente en los navegadores el analizador de HTML corre en el hilo de ejecución principal y se queda bloqueado después de una etiqueta &lt;/script&gt; hasta que el código se haya recuperado y ejecutado. El analizador de HTML de Firefox 4 y posteriores soporta análisis especulativo fuera del hilo de ejecución principal. Este analiza anticipadamente mientras el codigo está siendo descargado y ejecutado. Como en Firefox 3.5 y 3.6, el analizador de HTML es el que inicia la carga especulativa de código, las hojas de estilos y las imagenes que va encontrando en el flujo de la página. Sin embargo en Firefox 4 y posteriores el analizador de HTML también ejecuta el algoritmo especulativo de la construcción del árbol HTML. La ventaja es que cuando lo especulado tiene exito, no hay necesidad de reanalizar la parte del archivo de entrada que ya fue analizada junto la descarga de código,  hojas de estilo y las imágenes. La desventaja es que se ha realizado un trabajo inútil cuando la especulación fracasa.</span></p>
+
+<p>Este documento le ayuda a evitar este tipo de situaciones que hacen que la especulación falle y ralentize la carga de la página.</p>
+
+<h2 id="Haciendo_cargas_especulativas_exitosas">Haciendo cargas especulativas exitosas</h2>
+
+<p>Hay solo una regla para hacer cargas especulativas exitosas en scripts enlazados, hojas de estilo e imagenes:</p>
+
+<ul>
+ <li>Si usted usa el elemento &lt;base&gt; para anular la base URI de su pagina, ponga el elemento en la parte no-escrita de el documento. No la añada via document.write() o document.createElement().</li>
+</ul>
+
+<h2 id="Evitando_perder_la_salida_del_generador_de_arbol">Evitando perder la salida del generador de arbol</h2>
+
+<p>La generación de árbol especulativo falla cuando <code>document.write()</code> cambia el estado del generador de árbol de tal manera que el estado especulativo después del tag <code>&lt;/script&gt;</code> no se mantiene cuando todo el contenido es inertado por <code>document.write()</code> ha sido analizado. Sin embargo, sólo usos inusuales de <code>document.write()</code> causa problemas. Aquí están las cosas a evitar:</p>
+
+<ul>
+ <li>No escriba árboles desbalanceados. <code>&lt;script&gt;document.write("&lt;div&gt;");&lt;/script&gt;</code> está mal. <code>&lt;script&gt;document.write("&lt;div&gt;&lt;/div&gt;");&lt;/script&gt;</code> es correcto.</li>
+ <li>No escriba un token sin finalizar. <code>&lt;script&gt;document.write("&lt;div&gt;&lt;/div");&lt;/script&gt;</code> esta mal.</li>
+ <li>No termine con un carater de retorno de carro. <code>&lt;script&gt;document.write("Hello World!\r");&lt;/script&gt;</code> está mal. <code>&lt;script&gt;document.write("Hello World!\n");&lt;/script&gt;</code> es correcto.</li>
+ <li>Note que escribiendo etiquetas balanceadas pueden causarse que se creen otras etiquetas desbalanceadas. Ej. <code>&lt;script&gt;document.write("&lt;div&gt;&lt;/div&gt;");&lt;/script&gt;</code> dentro del elemento <code>head</code> será interpretado como <code>&lt;script&gt;document.write("&lt;/head&gt;&lt;body&gt;&lt;div&gt;&lt;/div&gt;");&lt;/script&gt;</code> el cual está desbalanceado.</li>
+ <li>No formatee parte de una tabla. <code>&lt;table&gt;&lt;script&gt;document.write("&lt;tr&gt;&lt;td&gt;Hello World!&lt;/td&gt;&lt;/tr&gt;");&lt;/script&gt;&lt;/table&gt;</code> está mal. Sin embargo, <code>&lt;script&gt;document.write("</code><code>&lt;table&gt;</code><code>&lt;tr&gt;&lt;td&gt;Hello World!&lt;/td&gt;&lt;/tr&gt;</code><code>&lt;/table&gt;</code><code>");&lt;/script&gt;</code> está correcto.</li>
+ <li>HAGA: document.write dentro de otro elemento de formateo.</li>
+</ul>
diff --git a/files/es/glossary/statement/index.html b/files/es/glossary/statement/index.html
new file mode 100644
index 0000000000..b2fef82b81
--- /dev/null
+++ b/files/es/glossary/statement/index.html
@@ -0,0 +1,24 @@
+---
+title: Sentencias
+slug: Glossary/Statement
+tags:
+  - Glosario
+  - Principiante
+translation_of: Glossary/Statement
+original_slug: Glossary/Sentencias
+---
+<p>En un lenguaje de programación, una <strong>sentencia</strong> es una línea de código al mando de una tarea <span style="line-height: 1.5;">Cada programa consiste en una secuencia de sentencias.</span></p>
+
+<h2 id="Aprender_más" style="line-height: 30px; font-size: 2.14285714285714rem;">Aprender más</h2>
+
+<h3 id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements">Sentencias y declaraciones en JavaScript</a> (en inglés)</li>
+</ul>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li><a href="http://en.wikipedia.org/wiki/Statement_(computer_science)">Sentencias - Wikipedia</a> (en inglés)</li>
+</ul>
diff --git a/files/es/glossary/static_typing/index.html b/files/es/glossary/static_typing/index.html
new file mode 100644
index 0000000000..68648c0b59
--- /dev/null
+++ b/files/es/glossary/static_typing/index.html
@@ -0,0 +1,19 @@
+---
+title: Tipificación estática
+slug: Glossary/Static_typing
+tags:
+  - CodingScripting
+  - Glossary
+  - Type
+translation_of: Glossary/Static_typing
+original_slug: Glossary/Tipificación_estática
+---
+<p>Un lenguaje de <strong>tipo estático </strong>es un lenguaje (como Java, C, o C++) en donde los tipos de variables se conocen en tiempo de compilación. En la mayoria de estos lenguajes, los tipos deben ser expresamente indicados por el programador; en otros casos (como en OCaml), la inferencia de tipos permite al programador no indicar sus tipos de variables.</p>
+
+<h2 id="Learn_more">Learn more</h2>
+
+<h3 id="General_knowledge">General knowledge</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Type system")}} on Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/synchronous/index.html b/files/es/glossary/synchronous/index.html
new file mode 100644
index 0000000000..d4382e0855
--- /dev/null
+++ b/files/es/glossary/synchronous/index.html
@@ -0,0 +1,25 @@
+---
+title: Sincrónico
+slug: Glossary/Synchronous
+tags:
+  - Glosario
+  - Mecánicas
+  - Web
+  - WebMechanics
+translation_of: Glossary/Synchronous
+original_slug: Glossary/Sincronico
+---
+<p>Sincrónico<em> se</em> refiere a la comunicación en tiempo real donde cada lado recibe (y si es necesario, procesa y responde) mensajes instantáneamente (o lo más cerca posible a instantáneamente).</p>
+
+<p>Un ejemplo humano es el teléfono — durante una llamada telefónica tiendes a responder a la otra persona inmediatamente.</p>
+
+<p>Muchos comandos de programación son también sincrónicos — por ejemplo cuando escribes en una calculadora, el entorno te devolverá el resultado instantáneamente, a menos que lo programes para no hacerlo.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Referencias_técnicas">Referencias técnicas</h3>
+
+<ul>
+ <li>{{glossary("Asynchronous")}}</li>
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests">Solicitudes síncronas y asíncronas</a> usando la {{glossary("API")}} <a href="https://developer.mozilla.org/es/docs/Web/API/XMLHttpRequest">XMLHttpRequest()</a></li>
+</ul>
diff --git a/files/es/glossary/textocifrado/index.html b/files/es/glossary/textocifrado/index.html
deleted file mode 100644
index 65315ab297..0000000000
--- a/files/es/glossary/textocifrado/index.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Texto Cifrado
-slug: Glossary/TextoCifrado
-tags:
-  - Cryptography
-  - Glossary
-  - Privacy
-  - Security
-translation_of: Glossary/Ciphertext
----
-<p>En {{glossary("Cryptography", "Criptografía")}}, un texto cifrado es un mensaje codificado que transmite información pero no es legible a menos que se {{glossary("decryption","descifre")}} con el {{glossary("cipher", "algoritmo criptográfico")}} correcto y el secreto correcto (generalmente una {{glossary("key","clave")}}), reproduciendo el {{glossary("cleartext", "texto simple")}} original. La seguridad de un texto cifrado, y por lo tanto el secreto de la información contenida, depende de usar un cifrado seguro y mantener la clave en secreto.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Conocimiento_general">Conocimiento general</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Ciphertext")}} on Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/textosimple/index.html b/files/es/glossary/textosimple/index.html
deleted file mode 100644
index 2c76ac8212..0000000000
--- a/files/es/glossary/textosimple/index.html
+++ /dev/null
@@ -1,14 +0,0 @@
----
-title: Texto Simple
-slug: Glossary/TextoSimple
-tags:
-  - Cryptography
-  - Glossary
-  - Security
-translation_of: Glossary/Plaintext
----
-<p dir="ltr">Texto simple se refiere a la información que se está utilizando como entrada para un {{Glossary("algorithm", "algoritmo")}} de {{Glossary("encryption","cifrado")}}, o para el {{Glossary("ciphertext", "texto cifrado")}} que se ha descifrado.</p>
-
-<p dir="ltr">Con frecuencia se usa indistintamente con el término texto claro, que se refiere de manera más general a cualquier información, como un documento de texto, una imagen, etc., que no se haya cifrado y que un humano o una computadora puedan leer sin procesamiento adicional.</p>
-
-<p> </p>
diff --git a/files/es/glossary/tipado_dinámico/index.html b/files/es/glossary/tipado_dinámico/index.html
deleted file mode 100644
index c8ee61a087..0000000000
--- a/files/es/glossary/tipado_dinámico/index.html
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: Tipado Dinámico
-slug: Glossary/Tipado_dinámico
-tags:
-  - Código
-  - Glosario
-  - LenguajeDeProgramación
-translation_of: Glossary/Dynamic_typing
----
-<p><strong>Los lenguajes de tipado dinámico</strong> son aquellos (como {{glossary("JavaScript")}}) donde el intérprete asigna a las {{glossary("variable","variables")}} un {{glossary("tipo")}} durante el tiempo de ejecución basado en su {{glossary("valor")}} en ese momento.</p>
-
-<h2 id="Ver_más">Ver más</h2>
-
-<h3 id="Conoce_sobre_el_tema">Conoce sobre el tema</h3>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Data_structures">Tipos de datos y estructuras de datos en Javascript</a></li>
-</ul>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{interwiki("wikipedia", "Sistema_de_tipos", "Sistema de tipos")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/tipificación_estática/index.html b/files/es/glossary/tipificación_estática/index.html
deleted file mode 100644
index 161ab31c61..0000000000
--- a/files/es/glossary/tipificación_estática/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Tipificación estática
-slug: Glossary/Tipificación_estática
-tags:
-  - CodingScripting
-  - Glossary
-  - Type
-translation_of: Glossary/Static_typing
----
-<p>Un lenguaje de <strong>tipo estático </strong>es un lenguaje (como Java, C, o C++) en donde los tipos de variables se conocen en tiempo de compilación. En la mayoria de estos lenguajes, los tipos deben ser expresamente indicados por el programador; en otros casos (como en OCaml), la inferencia de tipos permite al programador no indicar sus tipos de variables.</p>
-
-<h2 id="Learn_more">Learn more</h2>
-
-<h3 id="General_knowledge">General knowledge</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Type system")}} on Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/type_coercion/index.html b/files/es/glossary/type_coercion/index.html
new file mode 100644
index 0000000000..7260ab3c2d
--- /dev/null
+++ b/files/es/glossary/type_coercion/index.html
@@ -0,0 +1,23 @@
+---
+title: Coerción
+slug: Glossary/Type_coercion
+translation_of: Glossary/Type_coercion
+original_slug: Glossary/coercion
+---
+<p>La coerción es la conversión automática o implicita de valores de un tipo de dato a otro (Ejemplo: de cadena de texto a número). La conversión es similar a la coerción porque ambas convierten valores de un tipo de dato a otro pero con una diferencia clave - la coerción es implícita mientras que la conversión puede ser implícita o explícita.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js">const valor1 = '5';
+const valor2 = 9;
+let suma = valor1 + valor2;
+
+console.log(suma);</pre>
+
+<p>En el ejemplo anterior, JavaScript ha coercido el <code>9</code> de nùmero a cadena de texto y luego ha concatenado los dos valores resultando en una cadena de texto de <code>59</code>. JavaScript tuvo la opción de coercer a cadena de texto o número y decidió usar número.</p>
+
+<p>El compilador pudo haber coercido el <code>5</code> a un número y retornar el valor de <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">14</span></font>, pero no lo hizo. Para retornar ese resultado, tendrías que convertir explícitamente el <code>5</code> a un número usando el método <code>Number()</code>:</p>
+
+<pre class="brush: js">sumar = Number(valor1) + valor2</pre>
+
+<section class="Quick_links" id="Quick_Links"></section>
diff --git a/files/es/glossary/ui/index.html b/files/es/glossary/ui/index.html
new file mode 100644
index 0000000000..87d1d4cb69
--- /dev/null
+++ b/files/es/glossary/ui/index.html
@@ -0,0 +1,20 @@
+---
+title: IU
+slug: Glossary/UI
+tags:
+  - Accesibilidad
+  - Diseño
+  - Glosario
+translation_of: Glossary/UI
+original_slug: Glossary/IU
+---
+<p>La <em>Interfaz de Usuario </em>(IU) es el medio que facilita la interacción entre el usuario y la máquina. En el campo de la informática, puede ser un teclado, un joystick, una pantalla, o un programa. En el caso del software, puede ser una entrada de línea de comandos, una página web, un formulario, o el front-end de cualquier aplicación.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Conocimiento_general">Conocimiento general</h3>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Interfaz_de_usuario">Interfaz de Usuario</a> en Wikipedia</li>
+ <li><a href="https://es.wikipedia.org/wiki/Desarrollo_web_Front-end">Desarrollo Front-end</a> on Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/validador/index.html b/files/es/glossary/validador/index.html
deleted file mode 100644
index 8b105054a9..0000000000
--- a/files/es/glossary/validador/index.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Validador
-slug: Glossary/Validador
-tags:
-  - Glosario
-  - Principiante
-  - Seguridad
-translation_of: Glossary/Validator
----
-<p id="Summary" style="line-height: 30px;">Un validador es un programa que comprueba errores de sintaxis en el código. Las validadores pueden ser creados para cualquier formato o lenguaje, pero en este contexto se habla de herramientas que comprueban {{Glossary("HTML")}}, {{Glossary("CSS")}}, y {{Glossary("XML")}}.</p>
-
-<h2 id="Saber_más"><strong style="font-size: 2.142857142857143rem; font-weight: 700; letter-spacing: -1px; line-height: 30px;">Saber más</strong></h2>
-
-<h3 id="Conocimiento_general" style="line-height: 24px;">Conocimiento general</h3>
-
-<ul>
- <li><a href="https://es.wikipedia.org/wiki/Validador">Validador</a> en Wikipedia</li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Validators">Lista de validadores</a></li>
-</ul>
diff --git a/files/es/glossary/validator/index.html b/files/es/glossary/validator/index.html
new file mode 100644
index 0000000000..587c8a3e96
--- /dev/null
+++ b/files/es/glossary/validator/index.html
@@ -0,0 +1,20 @@
+---
+title: Validador
+slug: Glossary/Validator
+tags:
+  - Glosario
+  - Principiante
+  - Seguridad
+translation_of: Glossary/Validator
+original_slug: Glossary/Validador
+---
+<p id="Summary" style="line-height: 30px;">Un validador es un programa que comprueba errores de sintaxis en el código. Las validadores pueden ser creados para cualquier formato o lenguaje, pero en este contexto se habla de herramientas que comprueban {{Glossary("HTML")}}, {{Glossary("CSS")}}, y {{Glossary("XML")}}.</p>
+
+<h2 id="Saber_más"><strong style="font-size: 2.142857142857143rem; font-weight: 700; letter-spacing: -1px; line-height: 30px;">Saber más</strong></h2>
+
+<h3 id="Conocimiento_general" style="line-height: 24px;">Conocimiento general</h3>
+
+<ul>
+ <li><a href="https://es.wikipedia.org/wiki/Validador">Validador</a> en Wikipedia</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Validators">Lista de validadores</a></li>
+</ul>
diff --git a/files/es/glossary/valor/index.html b/files/es/glossary/valor/index.html
deleted file mode 100644
index d0d2cc2bf8..0000000000
--- a/files/es/glossary/valor/index.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Valor
-slug: Glossary/Valor
-tags:
-  - CodingScripting
-  - Glosario
-translation_of: Glossary/Value
----
-<div>{{jsSidebar}}</div>
-
-<p>En el contexto de datos o un objeto <strong>{{Glossary("Wrapper", "wrapper")}}</strong> alrededor de esos datos, el valor es el <strong>{{Glossary("Primitive", "valor primitivo")}}</strong> que contiene el contenedor de objetos. En el contexto de una <strong>{{Glossary("Variable", "variable")}}</strong> o <strong>{{Glossary("Property", "property")}}</strong>, el El valor puede ser primitivo o <strong>{{Glossary("Object reference", "Referencia de objeto")}}</strong>.</p>
-
-<h2 id="Aprende_más">Aprende más</h2>
-
-<h3 id="Conocimientos_generales">Conocimientos generales</h3>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Primitive wrapper class")}} en Wikipedia</li>
-</ul>
diff --git a/files/es/glossary/value/index.html b/files/es/glossary/value/index.html
new file mode 100644
index 0000000000..aca8799dcc
--- /dev/null
+++ b/files/es/glossary/value/index.html
@@ -0,0 +1,20 @@
+---
+title: Valor
+slug: Glossary/Value
+tags:
+  - CodingScripting
+  - Glosario
+translation_of: Glossary/Value
+original_slug: Glossary/Valor
+---
+<div>{{jsSidebar}}</div>
+
+<p>En el contexto de datos o un objeto <strong>{{Glossary("Wrapper", "wrapper")}}</strong> alrededor de esos datos, el valor es el <strong>{{Glossary("Primitive", "valor primitivo")}}</strong> que contiene el contenedor de objetos. En el contexto de una <strong>{{Glossary("Variable", "variable")}}</strong> o <strong>{{Glossary("Property", "property")}}</strong>, el El valor puede ser primitivo o <strong>{{Glossary("Object reference", "Referencia de objeto")}}</strong>.</p>
+
+<h2 id="Aprende_más">Aprende más</h2>
+
+<h3 id="Conocimientos_generales">Conocimientos generales</h3>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Primitive wrapper class")}} en Wikipedia</li>
+</ul>
diff --git a/files/es/glossary/whitespace/index.html b/files/es/glossary/whitespace/index.html
new file mode 100644
index 0000000000..05638d15ef
--- /dev/null
+++ b/files/es/glossary/whitespace/index.html
@@ -0,0 +1,46 @@
+---
+title: Espacio en blanco
+slug: Glossary/Whitespace
+tags:
+  - Glosario
+  - Gramática léxica
+  - espacioenblanco
+translation_of: Glossary/Whitespace
+original_slug: Glossary/Espacio_en_blanco
+---
+<p><span class="seoSummary">El <strong>espacio en blanco</strong> es un conjunto de {{Glossary("Caracter", "caracteres")}} que se utiliza para mostrar espacios horizontales o verticales entre otros caracteres. A menudo se utilizan para separar fragmentos en {{Glossary("HTML")}}, {{Glossary("CSS")}}, {{Glossary("JavaScript")}} y otros lenguajes informáticos.</span>Los caracteres de espacio en blanco y su uso varía de un lenguaje a otro.</p>
+
+<h2 id="En_HTML">En HTML</h2>
+
+<p>La <a href="https://html.spec.whatwg.org/"><em>HTML Living Standard</em></a> especifica 5 caracteres ASCII como espacio en blanco: <code>U+0009</code> TAB, <code>U+000A</code> LF, <code>U+000C</code> FF, <code>U+000D</code> CR y <code>U+0020</code> ESPACIO. En forma de texto, se tratan como caracteres de espacio normal y los espacios en blanco secuenciales se contraen como un solo espacio en muchos casos (este comportamiento se puede cambiar mediante la propiedad CSS {{cssxref("white-space")}}. También se utilizan como separadores del nombre de un elemento y sus parámetros, nombres de clases, etc.</p>
+
+<h2 id="En_JavaScript">En JavaScript</h2>
+
+<p>La <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-white-space">especificación del lenguaje ECMAScript® 2015</a> establece varios puntos de código Unicode como espacio en blanco: <code>U+0009</code> CARACTERES de TABULACIÓN &lt;TAB&gt;, <code>U+000B</code> TABULACIÓN DE LÍNEA &lt;VT&gt;, <code>U+000C</code> FORM FEED &lt;FF&gt;, <code>U+0020</code> ESPACIO &lt;SP&gt;, <code>U+00A0</code> ESPACIO SIN ROTURA &lt;NBSP&gt;, <code>U+FEFF</code> ANCHO CERO NO -BREAK SPACE &lt;ZWNBSP&gt; y otra categoría “Zs” Cualquier otro punto de código Unicode “Separador, espacio” &lt;USP&gt;. Estos caracteres suelen ser innecesarios para la funcionalidad del código.</p>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li>Especificaciones
+  <ol>
+   <li><a href="https://infra.spec.whatwg.org/#ascii-whitespace">Espacio en blanco ASCII</a></li>
+   <li><a href="https://www.ecma-international.org/ecma-262/6.0/#sec-white-space">Especificación del lenguaje ECMAScript® 2015</a></li>
+  </ol>
+ </li>
+ <li>Referencias
+  <ol>
+   <li><a href="/es/docs/Web/API/Document_Object_Model/Whitespace">Cómo se manejan los espacios en blanco mediante HTML, CSS y el DOM</a></li>
+   <li>{{cssxref("white-space")}}</li>
+  </ol>
+ </li>
+ <li>Artículos de Wikipedia
+  <ol>
+   <li>{{interwiki("wikipedia", "El caracter de espacio en blanco")}}</li>
+  </ol>
+ </li>
+ <li><a href="/es/docs/Glossary">Glosario</a>
+  <ol>
+   <li>{{Glossary("Character", "Caracter")}}</li>
+  </ol>
+ </li>
+</ol>
+</section>
diff --git a/files/es/glossary/xform/index.html b/files/es/glossary/xform/index.html
deleted file mode 100644
index 6590baacdd..0000000000
--- a/files/es/glossary/xform/index.html
+++ /dev/null
@@ -1,14 +0,0 @@
----
-title: XForm
-slug: Glossary/XForm
-translation_of: Glossary/XForms
----
-<p><strong>XForms </strong>es una norma para la creación de formularios web y el procesamiento de datos de formulario en formato  {{glossary("XML")}}. Actualmente ningún navegador soporta Xforms—sugerimos en su lugar utilizar los formularios en <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms">HTML5 forms</a>.</p>
-
-<h2 id="Saber_más">Saber más</h2>
-
-<h3 id="Referencia_técnica">Referencia técnica</h3>
-
-<ul>
- <li><a href="/en-US/docs/XForms">XForms documentation on MDN</a></li>
-</ul>
diff --git a/files/es/glossary/xforms/index.html b/files/es/glossary/xforms/index.html
new file mode 100644
index 0000000000..7290ade27c
--- /dev/null
+++ b/files/es/glossary/xforms/index.html
@@ -0,0 +1,15 @@
+---
+title: XForm
+slug: Glossary/XForms
+translation_of: Glossary/XForms
+original_slug: Glossary/XForm
+---
+<p><strong>XForms </strong>es una norma para la creación de formularios web y el procesamiento de datos de formulario en formato  {{glossary("XML")}}. Actualmente ningún navegador soporta Xforms—sugerimos en su lugar utilizar los formularios en <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms">HTML5 forms</a>.</p>
+
+<h2 id="Saber_más">Saber más</h2>
+
+<h3 id="Referencia_técnica">Referencia técnica</h3>
+
+<ul>
+ <li><a href="/en-US/docs/XForms">XForms documentation on MDN</a></li>
+</ul>
diff --git a/files/es/glossary/xhtml/index.html b/files/es/glossary/xhtml/index.html
new file mode 100644
index 0000000000..f62bdb0aad
--- /dev/null
+++ b/files/es/glossary/xhtml/index.html
@@ -0,0 +1,34 @@
+---
+title: XHTML
+slug: Glossary/XHTML
+tags:
+  - HTML
+  - Todas_las_Categorías
+  - XHTML
+  - XML
+translation_of: Glossary/XHTML
+original_slug: XHTML
+---
+<p>
+</p><p><b>XHTML</b> es a <a href="es/XML">XML</a> como <a href="es/HTML">HTML</a> es a <a href="es/SGML">SGML</a>. Es decir, XHTML es un lenguaje de marcado que es similar al HTML, pero con un sintaxis más estricta. Dos versiones de XHTML han sido terminadas por el <a class="external" href="http://www.w3.org/">W3C</a>:
+</p>
+<ul><li> <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/xhtml11.htm">XHTML 1.0</a> es HTML4 reformulado como una aplicación XML, y es compatible con versiones anteriores de HTML en casos limitados.
+</li><li> <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/xhtml11_es.html">XHTML 1.1</a> es una versión modular de XHTML que no es compatible con versiones anteriores de HTML.
+<ul><li> Para entender mejor la <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/modxhtml/index.html">Modularidad en XHTML</a>
+</li></ul>
+</li><li> <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/xhtml-basic.html">XHTML Básico</a> Es una versión simplificada pensada para los nuevos dispositivos de acceso a internet, como telefonos, PDAs, y otros.
+</li></ul>
+<p>Actualmente se encuentra en desarrollo <a class="external" href="http://www.w3.org/TR/xhtml2/">XHTML 2</a>, con cambios significativos en el vocabulario de elementos. Para más información sobre XHTML, lea:
+</p>
+<ul><li> <a class="external" href="http://es.wikipedia.org/wiki/XHTML">Artículo sobre XHTML en la Wikipedia</a>
+</li></ul>
+<h3 id="Herramientas" name="Herramientas"> Herramientas </h3>
+<ul><li> <a class="external" href="http://validator.w3.org/">Servicio de validación de XHTML (W3C)</a>
+</li></ul>
+<p><span class="alllinks"><a>Ver todas...</a></span>
+</p><p><span class="comment">Categorías</span>
+</p><p><span class="comment">Interwiki enlaces a otros idiomas</span>
+</p>
+<div class="noinclude">
+</div>
+{{ languages( { "en": "en/XHTML", "fr": "fr/XHTML", "it": "it/XHTML", "ja": "ja/XHTML", "pl": "pl/XHTML", "pt": "pt/XHTML" } ) }}
diff --git a/files/es/guía_para_el_desarrollador_de_agregados_para_firefox/index.html b/files/es/guía_para_el_desarrollador_de_agregados_para_firefox/index.html
deleted file mode 100644
index b4510b3822..0000000000
--- a/files/es/guía_para_el_desarrollador_de_agregados_para_firefox/index.html
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Guía para el desarrollador de agregados para Firefox
-slug: Guía_para_el_desarrollador_de_agregados_para_Firefox
----
-<p><em><br>
-</em>{{ Next("Firefox addons developer guide/Introduction to Extensions") }}</p>
-<p><a class="internal" href="/es/Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones" title="Es/Guía para el desarrollador de agregados para Firefox/Introducción a las extensiones">Capítulo 1: Introducción a las extensiones</a></p>
-<p><a class="internal" href="/Es/Guía_para_el_desarrollador_de_agregados_para_Firefox/Tecnologías_usadas_en_el_desarrollo_de_extensiones" title="Es/Guía para el desarrollador de agregados para Firefox/Tecnologías usadas en el desarrollo de extensiones">Capítulo 2: Tecnologías usadas para el desarrollo de extensiones<br>
-</a></p>
-<p><a class="internal" href="/En/Firefox_addons_developer_guide/Introduction_to_XUL—How_to_build_a_more_intuitive_UI" title="En/Firefox Addons Dev Guide/Introduction
-to XUL—How to build a more intuitive UI">Chapter 3: Introduction to XUL—How to build a more intuitive UI</a></p>
-<p><a class="internal" href="/En/Firefox_addons_developer_guide/Using_XPCOM—Implementing_advanced_processes" title="En/Firefox addons developer guide/Using
-XPCOM—Implementing advanced processes">Chapter 4: Using XPCOM—Implementing advanced processes</a></p>
-<p><a class="internal" href="/En/Firefox_addons_developer_guide/Let's_build_a_Firefox_extension" title="En/Firefox addons developer guide/Let's
-build a Firefox extension">Chapter 5: Let's build a Firefox extension</a> </p>
-<p><a class="internal" href="/En/Firefox_addons_developer_guide/Firefox_extensions_and_XUL_applications" title="En/Firefox addons developer guide/Firefox
-extensions and XUL applications">Chapter 6: Firefox extensions and XUL applications</a></p>
-<p><a class="internal" href="/En/Firefox_addons_developer_guide/License_authors" title="En/Firefox addons developer guide/License authors"><strong>License and authors</strong></a></p>
-<p>{{ Next("Guía para el desarrollador de agregados para Firefox/Introducción a las extensiones") }}</p>
-<p>{{ languages( { "de" : "de/Firefox_addons_developer_guide", "en" : "en/Firefox_addons_developer_guide" }) }}<em><br>
-</em></p>
-<p><a href="/en:Firefox_addons_developer_guide" title="en:Firefox_addons_developer_guide"><br>
-</a></p>
diff --git a/files/es/guía_para_el_desarrollador_de_agregados_para_firefox/introducción_a_las_extensiones/index.html b/files/es/guía_para_el_desarrollador_de_agregados_para_firefox/introducción_a_las_extensiones/index.html
deleted file mode 100644
index b925716b8b..0000000000
--- a/files/es/guía_para_el_desarrollador_de_agregados_para_firefox/introducción_a_las_extensiones/index.html
+++ /dev/null
@@ -1,192 +0,0 @@
----
-title: Introducción a las extensiones
-slug: >-
-  Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones
----
-<p style="text-align: justify;">{{ Draft() }}</p>
-
-<p>{{ PreviousNext("Guía para el desarrollador de agregados para Firefox", "Guía para el desarrollador de agregados para Firefox/Tecnologías usadas en el desarrollo de extensiones") }}</p>
-
-<div class="note"><strong>Nota: </strong>Si desea contribuir en este documento, por favor siga las directivas de la página de <a class="internal" href="/Es/Guía_para_el_desarrollador_de_agregados_para_Firefox/Contribución" title="Es/Guía para el desarrollador de agregados para Firefox/Contribución">Contribución</a>.</div>
-
-<p><em>Este documento fue creado por </em><a class="external" href="http://level.s69.xrea.com/mozilla/" title="http://level.s69.xrea.com/mozilla/"><em>Hideyuki Emura</em></a><em> y fue originalmente publicado en japonés para la </em><a class="link-https" href="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English" title="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English"><em>Firefox Developers Conference Summer 2007</em></a><em>. Emura-san es un coautor de <a class="external" href="http://www.oreilly.co.jp/books/9784873113753/index.html" title="http://www.oreilly.co.jp/books/9784873113753/index.html">Firefox 3 Hacks</a> (O'Reilly Japan, 2008.)</em></p>
-
-<h2 id="Introducción">Introducción</h2>
-
-<p>Si estás leyendo esta guía, probablemente ya has usado Firefox. Quizás la primera vez que miraste Firefox, te has sorprendido de ver que tiene una estructura mucho más simple que otros exploradores de amplias funcionalidades, como Opera o Safari.</p>
-
-<p>¿Qué funcionalidades son consideradas estándar en los exploradores web en estos días? Tal vez cosas como controles de pestañas de "granulado fino", gestos con el ratón, botones y barras de herramientas amplias, un lector de fuentes web, integración con una variedad de aplicaciones web, o herramientas sofisticadas para asistir el diseño web. Pero no nos hemos propuesto crear un explorador todo-en-uno que pueda satisfacer a todos.</p>
-
-<p>En su lugar, Firefox puede soportar esas funcionalidades a través de extensiones. El explorador básico está limitado a funcionalidades básicas, así es algo con lo que un principiante se siente cómodo, pero los usuarios que quieren ir más allá pueden instalar extensiones.</p>
-
-<h2 id="Acerca_de_las_extensiones">Acerca de las extensiones</h2>
-
-<h3 id="Manejo_usando_el_administrador_de_complementos">Manejo usando el administrador de complementos</h3>
-
-<p>El administrador de complementos de Firefox es una excelente forma de manejar las extensiones, y es un gran avance es facilidad de uso.</p>
-
-<p><img alt="" class="internal" src="/@api/deki/files/3818/=addons-manager.png" style="height: 462px; width: 563px;"></p>
-
-<p>El administrador de complementos se encarga de las siguientes tareas:</p>
-
-<ul>
- <li>Instalar y desinstalar complementos de mandera segura</li>
- <li>Asegurarse de que los complementos sean compatibles con la versión de Firefox en uso</li>
- <li>Administrar la lista blanca de sitios en los que se confía para instalar complementos</li>
- <li>Ayudar a solucionar problemas de los complementos deshabilitándolos y ofreciéndolos en modo seguro</li>
- <li>Confirma y ejecuta actualizaciones</li>
- <li>Proveé acceso a las ventanas de configuración de complementos</li>
- <li>Proveé acceso a los sitios de soporte de los complementos</li>
-</ul>
-
-<h3 id="Comodidades_para_el_entorno_de_desarrollo">Comodidades para el entorno de desarrollo</h3>
-
-<p>Inicialmente, no había disponible una documentacíon adecuada, y los desarrolladores de extensiones quedaban en gran medida a su suerte<sup><a href="#footnote1" id="from_footnote1">1</a></sup>; sin embargo, ahora hay una considerable acumulación de conocimientos.</p>
-
-<p>Como Firefox y sus extensiones están diseñados para soportar múltiples idiomas, llegan excelentes ideas de todo el mundo, y pueden ser rápidamente localizadas por cualquier interesado.</p>
-
-<p>Esto disminuye el umbral tanto para el uso como para el desarrollo de extesiones; de hecho, combinado con el rápido crecimiento de la popularidad de Firefox, ha creado un bucle de retroalimentación positiva, con e número de usuarios y desarrolladores de extensiones aumentando explosivamente —actualmente hay más de 7000 extensiones y temas publicados en el sitio de Complementos para Firefox (<a class="link-https" href="https://addons.mozilla.org" rel="freelink">https://addons.mozilla.org</a>).</p>
-
-<h2 id="Qué_puedes_hacer_con_extensiones">Qué puedes hacer con extensiones</h2>
-
-<p>Let's look at what features extensions can add, and some actual examples of extensions.</p>
-
-<h3 id="Extensiones_de_una_sola_función">Extensiones de una sola función</h3>
-
-<p>{{ TODO("Update this") }}.</p>
-
-<p>These are relatively simple extensions that add a single feature.</p>
-
-<dl>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/1939/" title="https://addons.mozilla.org/firefox/1939/">Text Link</a></dt>
- <dd>Makes it so that double-clicking on an unlinked URL follows that URL.</dd>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/3082/" title="https://addons.mozilla.org/firefox/3082/">Undo Closed Tabs Button</a></dt>
- <dd>Adds a toolbar button to re-open the most recently closed tabs to the History menu.</dd>
-</dl>
-
-<dl>
- <dd><img alt="1211576231.png" class="default internal" src="/@api/deki/files/3316/=1211576231.png" style="height: 317px; width: 340px;"></dd>
-</dl>
-
-<dl>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/4014/" title="https://addons.mozilla.org/firefox/4014/">Locationbar</a></dt>
- <dd>Separa el dominio y la ruta de la URL en la barra de localización para una lectura más fácil.</dd>
- <dd><img alt="locationbar.png" class="default internal" src="/@api/deki/files/3317/=locationbar.png" style="height: 150px; width: 200px;"></dd>
-</dl>
-
-<h3 id="Feature_enhancing_extensions">Feature enhancing extensions</h3>
-
-<p>{{ TODO("Update this") }}.</p>
-
-<p>Estas extensiones amplían características ya disponibles en Firefox.</p>
-
-<dl>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/1122/" title="https://addons.mozilla.org/firefox/1122/">Tab Mix Plus</a></dt>
- <dd>Ofrece configuración detallada sobre las pestañas.</dd>
- <dt><a class="external" href="http://prefbar.mozdev.org/" title="http://prefbar.mozdev.org/">PrefBar</a></dt>
- <dd>Ofrece acceso a numerosas preferencias sobre la barra de herramientas.<img alt="PrefBar.png" class="default internal" src="/@api/deki/files/3371/=PrefBar.png" style="height: 113px; width: 843px;"></dd>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/722/" title="https://addons.mozilla.org/firefox/722/">NoScript</a></dt>
- <dd>Enables and disables JavaScript execution on a site-by-site basis.</dd>
-</dl>
-
-<h3 id="Extensiones_de_integración_con_aplicaciones_web">Extensiones de integración con aplicaciones web</h3>
-
-<p>{{ TODO("Update this") }}.</p>
-
-<p>The use the APIs of certain web applications to provide certain pieces of information.</p>
-
-<p><img alt="Forecastfox.png" class="default internal" src="/@api/deki/files/3372/=Forecastfox.png" style="height: 94px; width: 359px;"></p>
-
-<h3 id="New_feature_extensions">New feature extensions</h3>
-
-<p>{{ TODO("Update this") }}.</p>
-
-<p>Extensions can add completely new features to Firefox. This class of extension requires a greater level of knowledge and programming ability.</p>
-
-<dl>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/748/" title="https://addons.mozilla.org/firefox/748/">GreaseMonkey</a></dt>
- <dt><a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=397735" title="http://forums.mozillazine.org/viewtopic.php?t=397735">UserChrome.js</a></dt>
- <dd>Both of these provide an environment for running user scripts (JavaScript) in Firefox itself, where the scripts can target specific websites.</dd>
-</dl>
-
-<dl>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/1865/" title="https://addons.mozilla.org/firefox/1865/">Adblock Plus</a></dt>
- <dd>Blocks the display of unwanted advertisements on web pages.</dd>
- <dt><a class="link-https" href="https://addons.mozilla.org/firefox/12/" title="https://addons.mozilla.org/firefox/12/">All-in-One Gestures</a></dt>
- <dd>Adds mouse-gesture functionality.</dd>
-</dl>
-
-<h3 id="Application_level_extensions">Application level extensions</h3>
-
-<p>{{ TODO("Update this") }}.</p>
-
-<p>These are sophisticated extensions that can be considered full-scale applications in their own right, essentially using Firefox as the development platform.</p>
-
-<p><img alt="Firebug.gif" class="default internal" src="/@api/deki/files/3373/=Firebug.gif" style="height: 336px; width: 712px;"></p>
-
-<h3 id="One-trick_gag_extensions">One-trick gag extensions</h3>
-
-<p>{{ TODO("Update this") }}.</p>
-
-<p>There are a number of one-trick gag extensions that aren’t very useful.</p>
-
-<p><img alt="Shiitake Mushroom (1).png" class="default internal" src="/@api/deki/files/3375/=Shiitake%20Mushroom%20(1).png" style="height: 150px; width: 200px;"></p>
-
-<p>This is a very brief survey of a few extensions, but there are many other unique extensions available.</p>
-
-<p><strong>Tabla 1: Métodos avanzados de personalización para Firefox</strong></p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Método de personalización</td>
-   <td class="header">¿Funciona en sitios web?</td>
-   <td class="header">¿Funciona en Firefox?</td>
-  </tr>
-  <tr>
-   <td>Hojas de estilo de usuario (cambia la apariencia a través de CSS)</td>
-   <td>
-    <p>Sí; puedes cambiar el archivo <code>userContent.css</code>, o usar la extensión Stylish.</p>
-   </td>
-   <td>
-    <p>Sí; puedes cambiar el archivo <code>userChrome.css</code>,o usar la extensión Stylish.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Usar scripts (cambia la apariencia y funcionalidad a través de JavaScript)</td>
-   <td>
-    <p>Sí; puedes usar la extensión GreaseMonkey o "bookmarklets."</p>
-   </td>
-   <td>
-    <p>Sí; puedes cambiar <code>userChrome.js</code> para agregar funcionalidades a través de JavaScript.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Extensiones (pueden hacer cualquier cosa)</td>
-   <td>Sí</td>
-   <td>Sí</td>
-  </tr>
-  <tr>
-   <td>Temas (cambian la apariencia del explorador)</td>
-   <td>No</td>
-   <td>Sí</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Construyamos_una_extensión">Construyamos una extensión</h2>
-
-<p>La table 1 muestra varias opciones de personalización disponibles para los usuarios en Firefox. Tienen opciones de personalización flexibles, usando CSS en hojas de estilo de usuario y JavaScript/DOM en scripts de usuario (depende de Stylish, GreaseMonkey, y <code>userChrome.js</code>).</p>
-
-<p>Además de CSS y JavaScript, las extensiones pueden tomar ventaja de las tecnologías XUL y XPCOM para funciones más sofisticadas. Los temas, que alteran la apariencia de Firefox, son una clase de complemento.</p>
-
-<p>Para crear una extensión, neesitas una idea y un poco de habilidades de programación. Los siguientes capítulos explican en detalle las técnicas de escritura de extensiones de algunos de los principales autores de extensiones japoneses. Te alentamos a que pruebes suerta con ellas.</p>
-
-<div class="footnotes">
-<div class="note" id="footnote1"><a href="#from_footnote1">1</a> Uno de los autores de esta edición especial, Piro, es mundialmente conocido como uno de los desarrolladores originales.</div>
-</div>
-
-<dl>
-</dl>
-
-<p>{{ PreviousNext("Guía para el desarrollador de agregados para Firefox", "Guía para el desarrollador de agregados para Firefox/Tecnologías usadas en el desarrollo de extensiones") }}</p>
diff --git a/files/es/guía_para_la_migración_a_catálogo/index.html b/files/es/guía_para_la_migración_a_catálogo/index.html
deleted file mode 100644
index 1c76c3bd88..0000000000
--- a/files/es/guía_para_la_migración_a_catálogo/index.html
+++ /dev/null
@@ -1,176 +0,0 @@
----
-title: Guía para la migración a catálogo
-slug: Guía_para_la_migración_a_catálogo
-tags:
-  - NeedsContent
-  - Places
----
-<p>{{ Fx_minversion_header(3) }}
-Este documento es para los desarrolladores de aplicaciones y extensiones que tienen código los API de los marcadores y de el historial es Firefox 2 y anteriores y que están migrando a Firefox 3.
-</p>
-<h2 id="Visi.C3.B3n_general" name="Visi.C3.B3n_general">Visión general</h2>
-<p><a href="es/Cat%c3%a1logo">Catálogo</a> es un conjunto de API para la administración del historial de navegación y los meta datos de las URI. Esto incluye historial, marcadores, pestañas, favicons y anotaciones. Existen dos modelos de identidad en el sistema: URI e identificadores únicos para elementos del sistema de marcadores. Algunos de los API están centrados en URI, mientras que otros usan identificadores de elementos. La firma del API y su contexto, generalmente dejan claro qué modelo se requiere.
-</p>
-<h2 id="Marcadores" name="Marcadores"> Marcadores </h2>
-<p>El servicio del toolkit marcadores es {{ Source("toolkit/components/places/public/nsINavBookmarksService.idl", "nsINavBookmarksService") }}:
-</p>
-<pre>var bookmarks = Cc["@mozilla.org/browser/nav-bookmarks-service;1"].
-                getService(Ci.nsINavBookmarksService);
-</pre>
-<p>EL almacenamiento de los marcadores es jerárquico, sirviendo de modelo a las carpetas y su contenido. Varias carpetas significativas están disponibles como atributos de {{ Interface("nsINavBookmarksService") }}.
-</p>
-<ul><li> nsINavBookmarksService.placesRoot - La carpeta raíz de la jerarquía.
-</li><li> nsINavBookmarksService.bookmarksMenuFolder - El contenido de esta carpeta es visible en el menú Buscadores.
-</li><li> nsINavBookmarksService.toolbarFolder - El contenido de esta carpeta está visible en la barra de herramientas Marcadores.
-</li><li> nsINavBookmarksService.unfiledBookmarksFolder - Los elementos que han sido marcados con una estrella, pero que no están incluidos en ninguna carpeta.
-</li><li> nsINavBookmarksService.tagsFolder - Las sub carpetas de esta carpeta son pestañas y sus hijos son URI que han sido marcadas con ese naombre de carpeta.
-</li></ul>
-<p>Nota: Este documento cubre el servicio de tolkit Catálogo. Sin embargo, los desarrolladores de Firefox pueden aprovechar diversos API de ayuda que son específicos del navegador: </p>
-<ul><li> <a href="es/FUEL">FUEL</a>
-</li><li> {{ Source("browser/components/places/public/nsIPlacesTransactionsService.idl", "nsIPlacesTransactionsService") }}
-</li><li> <a href="es/Utilidades_Javascript_para_Cat%c3%a1logo">Utilidades_Javascript_para_Catálogo</a>
-</li></ul>
-<h3 id="Creaci.C3.B3n" name="Creaci.C3.B3n"> Creación </h3>
-<p>Crear un Marcador
-</p>
-<pre>// create an nsIURI for the URL to be bookmarked.
-var bookmarkURI = Cc["@mozilla.org/network/io-service;1"].
-                  getService(Ci.nsIIOService).
-                  newURI("http://www.mozilla.com", null, null);
-
-var bookmarkId = bookmarks.insertBookmark(
-  bookmarks.toolbarFolder, // El Id de la carpeta donde se guardará el marcador.
-  bookmarkURI,             // La URI del marcador - un objeto nsIURI.
-  bookmarks.DEFAULT_INDEX, // La posición del marcador en su carpeta padre.
-  "my bookmark title");    // El título del marcador.
-</pre>
-<p>Crear una carpeta
-</p>
-<pre>var folderId = bookmarks.createFolder(
-  bookmarks.toolbarFolder, // La id de la carpeta donde se guardará la nueva carpeta.
-  "my folder title",       // El título de la nueva carpeta.
-  bookmarks.DEFAULT_INDEX);    // La posición de la nueva carpeta en su carpeta padre.
-</pre>
-<p>Crear un separador
-</p>
-<pre>var separatorId = bookmarks.insertSeparator(
-  bookmarks.toolbarFolder, // La id de la carpeta donde será puesto el separador.
-  bookmarks.DEFAULT_INDEX);    // La posición del separador en su carpeta padre.
-</pre>
-<p>Crear un marcador dinámico
-</p>
-<pre>var IOService = Cc["@mozilla.org/network/io-service;1"].
-                  getService(Ci.nsIIOService);
-
-var siteURI = IOService.newURI("http://www.mozilla.com", null, null);
-var feedURI = IOService.newURI("http://www.mozilla.org/news.rdf", null, null);
-
-var livemarks = Cc["@mozilla.org/browser/livemark-service;2"].
-                getService(Ci.nsILivemarkService);
-
-livemarks.createLivemark(bookmarks.toolbarFolder, // La id de la carpeta donde será almacenado el marcador dinámico
-  "My Livemark Title",        // El título del marcador dinámico
-  siteURI,                    // La URI del sitio. Un objeto nsIURI.
-  feedURI,                    // La URI del Canal. Un objeto nsIURI.
-  bookmarks.DEFAULT_INDEX);   // La posición del marcador dinámico en su carpeta padre.
-</pre>
-<h3 id="Lectura" name="Lectura"> Lectura </h3>
-<h4 id="Propiedades_de_los_elementos" name="Propiedades_de_los_elementos">Propiedades de los elementos</h4>
-<p>Para todos los elementos:
-</p>
-<ul><li> String getItemTitle(aItemId) - XXX
-</li><li> Int64 getItemIndex(aItemId) - XXX
-</li><li> PRTime getItemType(aItemId) - XXX
-</li><li> PRTime getItemDateAdded(aItemId) - XXX
-</li><li> PRTime getItemLastModified(aItemId) - XXX
-</li><li> Int64 getFolderIdForItem(aItemId) - Devuelve la id de la carpeta que contienen el elemento dado.
-</li><li> String getItemGUID(aItemId) - Devuelve un identificador global único del elemento. Esto se usa principalmente en las extensiones, para sincronizar los datos de los marcadores entre diferentes perfiles.
-</li></ul>
-<p>Para marcadores:
-</p>
-<ul><li> nsIURI getBookmarkURI(aItemId) - XXX
-</li><li> String getKeywordForBookmark(aItemId) - XXX
-</li></ul>
-<p>Para carpetas:
-</p>
-<ul><li> Int64 getChildFolder(aFolderId, aSubfolderTitle) - Devuelve la id de la primera sub carpeta que coincide con el título dado.
-</li><li> Int64 getIdForItemAt(aFolderId, aPosition) - Devuelve la id del elemento en la posición determinada .
-</li><li> Bool getFolderReadonly(aFolderId)
-</li></ul>
-<h4 id="Contenido_de_las_carpetas" name="Contenido_de_las_carpetas">Contenido de las carpetas</h4>
-<p>Las consultas en Catálogo se ejecutan a través del servicio principal de historial. El ejemplo siguiente, muestra como listar el contenido de una carpeta de Marcadores y cómo acceder a las propiedades de cada elemento.
-</p>
-<pre>var history = Cc["@mozilla.org/browser/nav-history-service;1"].
-              getService(Ci.nsINavHistoryService);
-var query = history.getNewQuery();
-query.setFolders([myFolderId], 1);
-
-var result = history.executeQuery(query, history.getNewQueryOptions());
-
-// La propiedad raíz del resultado de una consulta es un objeto representando la carpeta que especificaste.
-var folderNode = result.root;
-
-// Abre la carpeta y actúa reiterativamente con su contenido.
-folderNode.containerOpen = true;
-for (var i=0; i &lt; folderNode.childCount; ++i) {
-  var childNode = folderNode.getChild(i);
-
-  // Algunas propiedades del elemento.
-  var title = childNode.title;
-  var id = childNode.itemId;
-  var type = childNode.type;
-
-  // Algunas acciones específicas del tipo.
-  if (type == Ci.nsINavHistoryResultNode.RESULT_TYPE_URI) {
-
-    var uri = childNode.uri;
-
-  }
-  else if (type == Ci.nsINavHistoryResultNode.RESULT_TYPE_FOLDER) {
-
-    childNode.QueryInterface(Ci.nsINavHistoryContainerResultNode);
-    childNode.containerOpen = true;
-    // ahora puedes actuar reiterativamente sobre el 'hijo' de una carpeta.
-
-  }
-}
-</pre>
-<p>Hay documentación sobre otros tipos de nodo disponible en <a class="external" href="http://mxr.mozilla.org/seamonkey/source/toolkit/components/places/public/nsINavHistoryService.idl">IDL</a>.
-</p>
-<h4 id="B.C3.BAsqueda" name="B.C3.BAsqueda">Búsqueda</h4>
-<h3 id="Actualizaci.C3.B3n" name="Actualizaci.C3.B3n">Actualización</h3>
-<p>Para todos los elementos:
-</p>
-<ul><li> setItemTitle(aItemId, aTitle) - Cambia el título de un elemento.
-</li><li> setItemIndex(aItemId, aIndex) - Cambia la posición de un elemento. NOTA: este no cambia los indices de toda la carpeta - para una solución administrada, usa moveItem.
-</li><li> setItemDateAdded(aItemId, aDateAdded) - Ajusta la fecha en que fue añadido el elemento por primera vez, en micro segundos.
-</li><li> setItemLastModified(aItemId, aLastModified) - Ajusta la fecha en que fue añadido el elemento por última vez, en micro segundos.
-</li><li> setItemGUID(aItemId, aGUID) - Devuelve un identificador global único del elemento. Esto se usa principalmente en las extensiones, para sincronizar los datos de los marcadores entre diferentes perfiles.
-</li><li> moveItem (aFolderId, aNewParentId, aIndex) - Mueve un elemento de una carpeta a otra.
-</li></ul>
-<p>Para marcadores:
-</p>
-<ul><li> changeBookmarkURI(aItemId, aURI) - Cambia la URI del marcador.
-</li><li> setKeywordForBookmark(aItemId, aKeyword) - Ajusta la palabra-clave para el marcador.
-</li></ul>
-<h3 id="Borrado" name="Borrado">Borrado</h3>
-<ul><li> Elementos
-</li><li> Contenedores
-</li></ul>
-<h3 id="Observar" name="Observar">Observar </h3>
-<h3 id="Importar.2FExportar_en_formato_HTML" name="Importar.2FExportar_en_formato_HTML">Importar/Exportar en formato HTML</h3>
-<h3 id="Respaldo.2FRestauraci.C3.B3n" name="Respaldo.2FRestauraci.C3.B3n">Respaldo/Restauración</h3>
-<h3 id="Nuevo" name="Nuevo">Nuevo</h3>
-<ul><li> Pestañas
-</li><li> Anotaciones
-</li><li> Búsquedas guardadas
-</li><li> Contenedores dinámicos
-</li></ul>
-<h2 id="Historia" name="Historia">Historia</h2>
-<h3 id="Agregar" name="Agregar">Agregar</h3>
-<h3 id="Consultas" name="Consultas">Consultas</h3>
-<h3 id="Observar_2" name="Observar_2">Observar</h3>
-<h3 id="Nuevo_2" name="Nuevo_2">Nuevo</h3>
-<div class="noinclude">
-</div>
-{{ languages( { "es": "es/Lugares/Gu\u00eda_para_migraci\u00f3n_con_lugares", "fr": "fr/Guide_de_migration_vers_Places", "ja": "ja/Places/Migration_Guide", "en": "en/Places_migration_guide" } ) }}
diff --git a/files/es/herramientas/index.html b/files/es/herramientas/index.html
deleted file mode 100644
index 4cde340000..0000000000
--- a/files/es/herramientas/index.html
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Herramientas
-slug: Herramientas
-tags:
-  - Herramientas
-  - para_revisar
----
-<p> </p>
-<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Web_Development"><span><span style="">Desarrollo web</span></span></h4> <h5 id="Extensions"><span><span style="">Extensiones</span></span></h5> <dl> <dt><span><a href="/en/Venkman" title="en/Venkman"><span style="">Venkman</span></a></span></dt> <dd><span><span style="">El depurador JavaScript proporciona un potente entorno de depuración de JavaScript para navegadores basados ​​en Mozilla.</span></span></dd> </dl> <dl> <dt><a href="/en/DOM_Inspector" title="en/DOM_Inspector"><span><span style="">Inspector DOM</span></span></a></dt> <dd><span><span style="">Una herramienta de desarrollo utilizada para inspeccionar, examinar y modificar el DOM de documentos - normalmente páginas web o ventanas XUL.</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1843" title="https://addons.mozilla.org/en-US/firefox/addon/1843"><span><span style="">Firebug</span></span></a></dt> <dd><span><span style="">Integra una gran cantidad de herramientas de desarrollo para editar, depurar y monitorear CSS, HTML y JavaScript en vivo en cualquier página web ( <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.getfirebug.com%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNEyc4EzUXofVv9S_vhAmGQUczkTSw">detalles</a> )</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/60" title="https://addons.mozilla.org/en-US/firefox/addon/60"><span><span style="">Web Developer</span></span></a></dt> <dd><span><span style="">Agrega un menú y una barra de herramientas al navegador con varias herramientas de desarrollo web. ( <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fchrispederick.com%2Fwork%2Fweb-developer%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHJ8M44D_i_pGIzwqlkNOrImQNU2w">detalles</a> )</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/4111" title="https://addons.mozilla.org/en-US/firefox/addon/4111"><span><span style="">Aardvark</span></span></a></dt> <dd><span><span style="">Revela los elementos DOM mientras se mueve el ratón/mouse sobre una página. ( <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.karmatics.com%2Faardvark%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHv0RxPV-ntEr1Fan_wylejOyhf6g">detalles</a> )</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/browse/type:1/cat:4" title="https://addons.mozilla.org/en-US/firefox/browse/type:1/cat:4"><span><span style="">Más sobre Firefox Add-ons</span></span></a></dt> </dl> <h5 id="Validators"><span><span style="">Validadores</span></span></h5> <dl> <dt><a href="/en/Tools/Validators" title="en/Tools/Validators"><span><span style="">Lista de validadores</span></span></a></dt> </dl> <h5 id="Authoring_Software"><span><span style="">Software de creación</span></span></h5> <dl> <dt><a href="/en/Standards-Compliant_Authoring_Tools" title="en/Standards-Compliant_Authoring_Tools"><span><span style="">Herramientas de creación que cumplen con los estándares </span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://tidy.sourceforge.net/" title="http://tidy.sourceforge.net/"><span><span style="">HTMLTidy</span></span></a></dt> <dd><span><span style="">Una herramienta para limpiar HTML</span></span></dd> </dl> </td> <td> <h4 id="JavaScript"><span><span style="">JavaScript</span></span></h4> <table class="topicpage-table"> <tbody> <tr> <td> <dl> <dt><a href="/en/Tools/Scratchpad" title="en/Tools/Scratchpad"><span><span style="">Borrador</span></span></a>{{ gecko_minversion_inline ("6.0") }}</dt> <dd><span><span style="">Un editor de texto integrado en Firefox que te permite editar y ejecutar código JavaScript.</span></span></dd> <dt><a href="/en/Error_Console" title="en/Error_Console"><span><span style="">Consola de errores</span></span></a></dt> </dl> <dl> <dt><a href="/en/Venkman" title="en/Venkman"><span><span style="">Venkman</span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://www.jslint.com/" title="http://www.jslint.com/"><span><span style="">JSLint</span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://jsdoc.sourceforge.net/" title="http://jsdoc.sourceforge.net/"><span><span style="">JSDoc</span></span></a></dt> <dd><span><span style="">herramienta para la generación de documentación (generalmente HTML) a partir de los comentarios de código (similar a JavaDoc).</span></span></dd> </dl> <h4 id="DOM"><span><span style="">DOM</span></span></h4> <dl> <dt><a href="/en/DOM_Inspector" title="en/DOM_Inspector"><span><span style="">Inspector DOM</span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://slayeroffice.com/tools/modi/v2.0/modi_help.html" title="http://slayeroffice.com/tools/modi/v2.0/modi_help.html"><span><span style="">MODI</span></span></a></dt> <dd><span><span style="">Mouseover DOM Inpector es un bookmarklet que te permite ver y manipular el DOM de una página web con sólo pasar el ratón/mouse por el documento.</span></span></dd> </dl> <h4 id="Localization"><span><span style="">Localización</span></span></h4> <dl> <dt><a class="external" href="http://www.mozilla.org/projects/l10n/mlp_tools.html" title="http://www.mozilla.org/projects/l10n/mlp_tools.html"><span><span style="">Herramientas de localización y aprovechamiento</span></span></a></dt> </dl> <h4 id="Tree_and_branch_management"><span><span style="">Gestión de árboles y ramas</span></span></h4> <dl> <dd><a href="../en/Using_cross_commit" title="en/Using_cross_commit"><code>cross-commit</code> script</a></dd> </dl> <h4 id="User_Profile_Tools"><span><span style="">Herramientas de perfil de usuario</span></span></h4> <div><strong><a href="/en/Profile_Manager" title="en/Profile_Manager"><span><span style="">Profile Manager</span></span></a></strong></div> <h4 id="Navegar_por_el_código_base_de_Mozilla"><span><span style="">Navegar por el código base de Mozilla</span></span></h4> <p><span><span style=""><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fmxr.mozilla.org%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNGrg4dzGorguMnILmPWPgZEabuZdw">MXR</a><a class="external" href="http://mxr.mozilla.org/" title="http://mxr.mozilla.org/"> </a>(si utilizas vim, mxr-vim acelera el proceso)</span></span></p> <p><a class="external" href="http://dxr.mozilla.org/clang/" title="http://dxr.mozilla.org/clang/"><span><span style="">DXR</span></span></a></p> <dl> <dt> </dt><dd> </dd></dl> </td> </tr> </tbody> </table> </td> </tr> </tbody>
-</table>
-<p><span><span><span style="">Categorías</span></span></span></p>
-<p><span><span><span style="">Interwiki Language Links</span></span></span></p>
-<p><span><span style="">{{ languages( { "en": "en/Tools", "fr": "fr/Outils", "ja": "ja/Tools", "pl": "pl/Narz\u0119dzia" } ) }}</span></span></p>
diff --git a/files/es/how_to_create_a_dom_tree/index.html b/files/es/how_to_create_a_dom_tree/index.html
deleted file mode 100644
index 25546a1704..0000000000
--- a/files/es/how_to_create_a_dom_tree/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: Cómo crear un DOM tree
-slug: How_to_create_a_DOM_tree
-translation_of: Web/API/Document_object_model/How_to_create_a_DOM_tree
----
-<p> </p>
-<p>Esta página describe cómo usar el API <a class="external" href="http://www.w3.org/TR/DOM-Level-3-Core/core.html">DOM Core</a> en JavaScript para crear o modificar objetos DOM. Es aplicable a todas las aplicaciones basadas en Gecko (como Mozilla Firefox) cuyo código tenga privilegios (como las extensiones) y a las que no (páginas web).</p>
-<h3 id="Dynamically_creating_a_DOM_tree" name="Dynamically_creating_a_DOM_tree">Creación dinámica de un DOM tree</h3>
-<p>Considere el siguiente documento XML:</p>
-<pre class="brush: xml">&lt;?xml version="1.0"?&gt;
-&lt;people&gt;
-  &lt;person first-name="eric" middle-initial="H" last-name="jung"&gt;
-    &lt;address street="321 south st" city="denver" state="co" country="usa"/&gt;
-    &lt;address street="123 main st" city="arlington" state="ma" country="usa"/&gt;
-  &lt;/person&gt;
-
-  &lt;person first-name="jed" last-name="brown"&gt;
-    &lt;address street="321 north st" city="atlanta" state="ga" country="usa"/&gt;
-    &lt;address street="123 west st" city="seattle" state="wa" country="usa"/&gt;
-    &lt;address street="321 south avenue" city="denver" state="co" country="usa"/&gt;
-  &lt;/person&gt;
-&lt;/people&gt;
-</pre>
-<p>El W3C DOM API soportado por Mozilla, puede ser usado para crear una representación en memoria del documento anterior, como se ve a continuación:</p>
-<pre class="brush: js">var doc = document.implementation.createDocument("", "", null);
-var peopleElem = doc.createElement("people");
-
-var personElem1 = doc.createElement("person");
-personElem1.setAttribute("first-name", "eric");
-personElem1.setAttribute("middle-initial", "h");
-personElem1.setAttribute("last-name", "jung");
-
-var addressElem1 = doc.createElement("address");
-addressElem1.setAttribute("street", "321 south st");
-addressElem1.setAttribute("city", "denver");
-addressElem1.setAttribute("state", "co");
-addressElem1.setAttribute("country", "usa");
-personElem1.appendChild(addressElem1);
-
-var addressElem2 = doc.createElement("address");
-addressElem2.setAttribute("street", "123 main st");
-addressElem2.setAttribute("city", "arlington");
-addressElem2.setAttribute("state", "ma");
-addressElem2.setAttribute("country", "usa");
-personElem1.appendChild(addressElem2);
-
-var personElem2 = doc.createElement("person");
-personElem2.setAttribute("first-name", "jed");
-personElem2.setAttribute("last-name", "brown");
-
-var addressElem3 = doc.createElement("address");
-addressElem3.setAttribute("street", "321 north st");
-addressElem3.setAttribute("city", "atlanta");
-addressElem3.setAttribute("state", "ga");
-addressElem3.setAttribute("country", "usa");
-personElem2.appendChild(addressElem3);
-
-var addressElem4 = doc.createElement("address");
-addressElem4.setAttribute("street", "123 west st");
-addressElem4.setAttribute("city", "seattle");
-addressElem4.setAttribute("state", "wa");
-addressElem4.setAttribute("country", "usa");
-personElem2.appendChild(addressElem4);
-
-var addressElem5 = doc.createElement("address");
-addressElem5.setAttribute("street", "321 south avenue");
-addressElem5.setAttribute("city", "denver");
-addressElem5.setAttribute("state", "co");
-addressElem5.setAttribute("country", "usa");
-personElem2.appendChild(addressElem5);
-
-peopleElem.appendChild(personElem1);
-peopleElem.appendChild(personElem2);
-doc.appendChild(peopleElem);
-</pre>
-<p>Vea también el <a href="/en/XUL_Tutorial/Document_Object_Model" title="en/XUL_Tutorial/Document_Object_Model"> Capítulo DOM del Tutorial de XUL</a>.</p>
-<p>Se puede automatizar la creación de un DOM tree usando el <a href="/en/JXON#JXON_reverse_algorithms" title="en/JXON#JXON_reverse_algorithms">JXON reverse algorithm (algoritmo inverso JXON)</a> en asociación con la siguiente representación JSON:</p>
-<pre class="brush: js">{
-  "people": {
-    "person": [{
-      "address": [{
-        "@street": "321 south st",
-        "@city": "denver",
-        "@state": "co",
-        "@country": "usa"
-      }, {
-        "@street": "123 main st",
-        "@city": "arlington",
-        "@state": "ma",
-        "@country": "usa"
-      }],
-      "@first-name": "eric",
-      "@middle-initial": "H",
-      "@last-name": "jung"
-    }, {
-      "address": [{
-        "@street": "321 north st",
-        "@city": "atlanta",
-        "@state": "ga",
-        "@country": "usa"
-      }, {
-        "@street": "123 west st",
-        "@city": "seattle",
-        "@state": "wa",
-        "@country": "usa"
-      }, {
-        "@street": "321 south avenue",
-        "@city": "denver",
-        "@state": "co",
-        "@country": "usa"
-      }],
-      "@first-name": "jed",
-      "@last-name": "brown"
-    }]
-  }
-}
-</pre>
-<h3 id="So_what.3F" name="So_what.3F">¿Ahora qué?</h3>
-<p>Los DOM trees pueden ser <a href="/en/Using_XPath" title="en/Using_XPath">invocados usando expresiones XPath</a>, convertidos a cadenas de texto, salvados a un archivo local o remoto usando <a href="/en/Parsing_and_serializing_XML" title="en/Parsing_and_serializing_XML">XMLSerializer</a> (sin tener que convertirlo primero a una cadena de texto), Enviados mediante <a href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest">POST a un servidor web</a> (via <code>XMLHttpRequest</code>), transformados usando <a href="/en/XSLT" title="en/XSLT">XSLT</a>, <a href="/en/XLink" title="en/XLink">XLink</a>, convertidos a un objeto JavaScript a tráves del  <a href="/en/JXON" title="en/JXON">algoritmo </a><a href="/en/JXON" title="en/JXON">JXON</a>, etc.</p>
-<p>Adicionalmente se puede hacer uso de los DOM trees para modelar los datos que no estén bien formados para RDF (o si sólo no prefieres usar RDF). Otra aplicación que puedes darle, se relaciona a XUL (que es XML), la UI (interfaz) de tu aplicación puede ser manipulada dinámicamente, descargada, subida, guardada, cargada, convertida, o transformada fácilmente.</p>
-<h2 id="Vea_también">Vea también</h2>
-<ul>
- <li><a class="internal" href="/en/XML" title="en/XML">XML</a></li>
- <li><a class="internal" href="/en/JXON" title="en/JXON">JXON</a></li>
- <li><a class="internal" href="/en/XPath" title="en/XPath">XPath</a></li>
- <li><a class="internal" href="/en/E4X" title="en/E4X">E4X (ECMAScript for XML)</a></li>
- <li><a class="internal" href="/en/Parsing_and_serializing_XML" title="en/Parsing_and_serializing_XML">Parsing and serializing XML</a></li>
- <li><a class="internal" href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a></li>
-</ul>
-<p>{{ languages( { "fr": "fr/Comment_cr\u00e9er_un_arbre_DOM", "ja": "ja/How_to_create_a_DOM_tree", "zh-cn": "zh-cn/How_to_create_a_DOM_tree" } ) }}</p>
diff --git a/files/es/html/elemento/datalist/index.html b/files/es/html/elemento/datalist/index.html
deleted file mode 100644
index 2f94162678..0000000000
--- a/files/es/html/elemento/datalist/index.html
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: datalist
-slug: HTML/Elemento/datalist
-tags:
-  - HTML5
----
-<p>Redirigir <a class="redirect" href="/es/docs/Web/HTML/Elemento/datalist">datalist</a></p>
diff --git a/files/es/html/elemento/form/index.html b/files/es/html/elemento/form/index.html
deleted file mode 100644
index dd039bead3..0000000000
--- a/files/es/html/elemento/form/index.html
+++ /dev/null
@@ -1,5 +0,0 @@
----
-title: form
-slug: HTML/Elemento/form
----
-<p>a</p>
diff --git a/files/es/html/elemento/section/index.html b/files/es/html/elemento/section/index.html
deleted file mode 100644
index dc632fa052..0000000000
--- a/files/es/html/elemento/section/index.html
+++ /dev/null
@@ -1,177 +0,0 @@
----
-title: Section
-slug: HTML/Elemento/section
----
-<div class="geckoVersionNote">
-<h2 id="DEFINICIÓN" style="margin-left: 40px;">DEFINICIÓN:</h2>
-</div>
-
-<h4 id="La_etiqueta_section_proviene_del_idioma_inglés_y_se_traduce_al_español_como_sección.">La etiqueta section proviene del idioma inglés y se traduce al español como sección.</h4>
-
-<p> </p>
-
-<div class="geckoVersionNote">
-<h2 id="ETIQUETAS" style="margin-left: 40px;">ETIQUETAS: </h2>
-</div>
-
-<h4 id="&lt;section>&lt;section>">&lt;section&gt;&lt;/section&gt;</h4>
-
-<h4 id="Genera_una_sección_de_contenido_en_el_cuál_podemos_ubicar_dentro_muchos_otros_tipos_de_sección_(nav_article_asideheaderfooter_etc).">Genera una sección de contenido, en el cuál podemos ubicar dentro muchos otros tipos de sección (nav, article, aside,header,footer, etc).</h4>
-
-<p> </p>
-
-<div class="geckoVersionNote">
-<h2 id="ATRIBUTOS" style="margin-left: 40px;">ATRIBUTOS:</h2>
-</div>
-
-<table class="fullwidth-table standard-table">
- <thead>
-  <tr>
-   <th scope="col" style="text-align: center;">
-    <h4 id="Atributo"><strong>Atributo</strong></h4>
-   </th>
-   <th colspan="2" scope="col" style="text-align: center;">
-    <h4 id="Valor"><strong>Valor</strong></h4>
-   </th>
-   <th scope="col" style="text-align: center;">
-    <h4 id="Descripción"><strong>Descripción</strong></h4>
-   </th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4">
-    <h4 id="Genéricos"><strong>Genéricos</strong></h4>
-   </th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title </code></td>
-   <td>Texto</td>
-   <td>Implícito</td>
-   <td>Título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style </code></td>
-   <td>Declaraciones de estilo</td>
-   <td>Implícito</td>
-   <td>Información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id </code></td>
-   <td>Un 'nombre'</td>
-   <td>Implícito</td>
-   <td>Identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class </code></td>
-   <td>Lista de clases CSS</td>
-   <td>implícito</td>
-   <td>Identificador a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir </code></td>
-   <td>Uno de los siguientes: <code>"ltr"</code> o <code>"rtl"</code></td>
-   <td>Implícito</td>
-   <td>Dirección del texto.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang </code></td>
-   <td>Código de idioma</td>
-   <td>Implícito</td>
-   <td>Información sobre el idioma.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">
-    <h4 id="Específicos"><strong>Específicos</strong></h4>
-   </th>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;"> onload, onunload.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">
-    <h4 id="De_transición"><strong>De transición</strong></h4>
-   </th>
-  </tr>
-  <tr>
-   <th>
-    <h4 id="atributo"><strong>atributo</strong></h4>
-   </th>
-   <th colspan="2" rowspan="1">
-    <h4 id="valor"><strong>valor</strong></h4>
-   </th>
-   <th>
-    <h4 id="descripción"><strong>descripción</strong></h4>
-   </th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">background </code></td>
-   <td>Una dirección</td>
-   <td>Implícito</td>
-   <td>Dirección de la imagen que se usará como fondo.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">bgcolor </code></td>
-   <td>Un color</td>
-   <td>Implícito</td>
-   <td>Color del fondo.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">text </code></td>
-   <td>Un color</td>
-   <td>Implícito</td>
-   <td>Color del texto.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">link </code></td>
-   <td>Un color</td>
-   <td>Implícito</td>
-   <td>Indica el color inicial de los enlaces</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">alink </code></td>
-   <td>Un color</td>
-   <td>Implícito</td>
-   <td>Indica el color de los enlaces cuando están activos.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">vlink </code></td>
-   <td>Un color</td>
-   <td>Implícito</td>
-   <td>Indica el color de los enlaces que han sido visitados.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval  language-html"><code class="language-html">
-   &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-        "http://www.w3.org/TR/html4/strict.dtd"&gt;
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
-           <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>title</span><span class="punctuation token">&gt;</span></span>Documento html básico<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>title</span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
-
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
-
-        &lt;section&gt;
-          &lt;article&gt;
-   <span class="tag token"><span class="tag token"><span class="punctuation token">          &lt;</span>p</span><span class="punctuation token">&gt;</span></span>Ejemplo de texto1<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;
-          &lt;/article&gt;
-  <code class="language-html">       &lt;article&gt;
-   <span class="tag token"><span class="tag token"><span class="punctuation token">          &lt;</span>p</span><span class="punctuation token">&gt;</span></span>Ejemplo de texto2<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;
-          &lt;/article&gt;</span></span></code>
-        &lt;/section&gt;
-
-        &lt;section&gt;
-<code class="language-html"><span class="tag token"><span class="punctuation token">  <code class="language-html">       &lt;article&gt;
-   <span class="tag token"><span class="tag token"><span class="punctuation token">          &lt;</span>p</span><span class="punctuation token">&gt;</span></span>Ejemplo de texto3 en un segundo artículo <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;
-          &lt;/article&gt;</span></span></code></span></span></code>
-<code class="language-html"><span class="tag token"><span class="punctuation token">       &lt;/section&gt;</span></span></code></span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span>
- </code></pre>
diff --git a/files/es/html/html5/forms_in_html5/index.html b/files/es/html/html5/forms_in_html5/index.html
deleted file mode 100644
index a0e77ec827..0000000000
--- a/files/es/html/html5/forms_in_html5/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: Formularios en HTML5
-slug: HTML/HTML5/Forms_in_HTML5
-tags:
-  - Forms
-  - HTML
-  - HTML5
----
-<p>{{ gecko_minversion_header("2") }}</p>
-
-<p>Los elementos y atributos para formularios en HTML5 proveen un mayor grado de marcado semántico que en HTML4 y eliminan gran parte del tedioso trabajo de programar y diseñar que se necesitaba en HTML4. Las funcionalidades de los formularios en HTML5 brindan una experiencia mejor para los usuarios al permitir que los formularios tengan un comportamiento más consistente entre diferentes sitios web y al darle una devolución inmediata acerca de la información ingresada. También proveen esta experiencia a los usuarios que han deshabilitado javascript en sus navegadores.</p>
-
-<p>Este documento describe los elementos nuevos o que han cambiado que están disponibles en Gecko/Firefox.</p>
-
-<h3 id="El_elemento_&lt;input>">El elemento <code>&lt;input&gt;</code></h3>
-
-<p>El elemento <code>{{ HTMLElement("input") }}</code> tiene nuevos valores para el atributo {{ htmlattrxref("type", "input") }}.</p>
-
-<ul>
- <li><span style="font-family: courier new;">search</span>: El elemento representa una caja de búsqueda. Los saltos de línea son quitados del valor ingresado pero no se modifica ninguna otra sintaxis.</li>
- <li><span style="font-family: courier new;">tel</span>: El elemento representa un control para editar un número de teléfono, porque los números teléfonicos varían ampliamente en el mundo. Puedes usar atributos como {{ htmlattrxref("pattern", "input") }} y {{ htmlattrxref("maxlength", "input") }} para restringir los valores ingresados en la caja.</li>
- <li><span style="font-family: courier new;">url</span>: El elemento representa un control para editar una <a class="external" href="http://es.wikipedia.org/URL" title="http://es.wikipedia.org/URL">URL</a>. Se quitan los saltos de línea y espacios en blanco antes y después del valor ingresados.</li>
- <li>
-  <p><span style="font-family: courier new;">email</span>: El elemento representa una dirección de correo electrónico. Los saltos de línea se quitan automáticamente del valor ingresado. Puede ingresarse una direccón de correo no válida, pero el campo de ingreso sólo funcionará si la dirección ingresada satisface la producción ABNF <span style="font-family: courier new;"><code><code title="">1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )</code></code></span> donde <code title="">atext</code> está definida en RFC 5322, sección 3.2.3 y <code title="">ldh-str</code> está definida en RFC 1034, sección 3.5.</p>
-
-  <div class="note">Nota: si el atributo {{ htmlattrxref("multiple", "input") }} está agregado, pueden ingresarse muchas direcciones de correo electrónico en ese campo {{ HTMLElement("input") }}, como una lista separada por espacios, pero no está implementado actualmente en Firefox.</div>
- </li>
-</ul>
-
-<p>El elemento {{ HTMLElement("input") }} también tiene nuevos atributos:</p>
-
-<ul>
- <li>{{ htmlattrxref("list", "input") }}: El ID de un elemento {{ HTMLElement("datalist") }} cuyo contenido, los elementos {{ HTMLElement("option") }}, van a ser usados como ayudas y serán mostrados como propuestas en el área de sugerencias del campo input.</li>
- <li>{{ htmlattrxref("pattern", "input") }}: Una expresión regular contra la que es verificado el valor del control, que puede ser usada con valores de {{ htmlattrxref("type", "input") }} de <code>text</code>, <code>tel</code>, <code>search</code>, <code>url</code> y <code>email</code>.</li>
- <li>{{ htmlattrxref("formmethod", "input") }}: Una cadena que indica qué método HTTP (GET, POST, PUT o DELETE) debe ser usado cuando se envía; sobrescribe el {{ htmlattrxref("method", "form") }} del elemento {{ HTMLElement("form") }}, si se define. El {{ htmlattrxref("formmethod", "input") }} sólo se aplica cuando el {{ htmlattrxref("type", "input") }} es <span style="font-family: courier new;">image</span> o <span style="font-family: courier new;">submit</span>, y, para los métodos PUT y DELETE, sólo funcionará con un destino que esté en el mismo dominio (política del mismo origen).</li>
-</ul>
-
-<h3 id="El_elemento_&lt;form>">El elemento <code>&lt;form&gt;</code></h3>
-
-<p>El elemento {{ HTMLElement("form") }} tiene un nuevo atributo:</p>
-
-<ul>
- <li>{{ htmlattrxref("novalidate", "form") }}: Este atributo previene que el formulario sea validado antes del envío.</li>
-</ul>
-
-<h3 id="El_elemento_&lt;datalist>">El elemento <code>&lt;datalist&gt; </code></h3>
-
-<p>El elemento {{ HTMLElement("datalist") }} representa la lista de elementos {{ HTMLElement("option") }} como sugerencias cuando se llena un campo {{ HTMLElement("input") }}.</p>
-
-<p>Puedes usar el atributo {{ htmlattrxref("list", "input") }} en un elemento {{ HTMLElement("input") }} para enlazar a un campo de ingreso específico con un elemento {{ HTMLElement("datalist") }} determinado.</p>
-
-<pre>&lt;label&gt;Superhéroe favorito&lt;/label&gt;
-&lt;input list="superheroes" name="list" /&gt;
-&lt;datalist id="superheroes"&gt;
-    &lt;option label="Iron Man" value="Iron Man"&gt;
-    &lt;option label="The Hulk" value="The Hulk"&gt;
-&lt;/datalist&gt;
-</pre>
-
-<h3 id="El_elemento_&lt;output>">El elemento <code>&lt;output&gt;</code></h3>
-
-<p>El elemento <code>{{ HTMLElement("output") }}</code> representa el resultado de un cálculo.</p>
-
-<p>Puedes usar el atributo {{ htmlattrxref("for", "output") }} para especificar una relación entre el elemento output y otros elementos en el documento que afectan el cálculo (por ejemplo, ingreso de datos o parámetros). El valor del atributo {{ htmlattrxref("for", "output") }} es una lista separada por espacios de IDs de otros elementos.</p>
-
-<h3 id="El_atributo_placeholder">El atributo placeholder</h3>
-
-<p>El atributo {{ htmlattrxref("placeholder", "input") }} en elementos <code>{{ HTMLElement("input") }}</code> y <code>{{ HTMLElement("textarea") }}</code> provee una ayuda a los usuarios acerca de qué debe ser ingresado en el campo. El texto introducido en el placeholder no debe contener «enters» o saltos de línea.</p>
-
-<pre>&lt;input type="email" id="user-email" placeholder="e.g. john.doe@mozilla.com" required/&gt;
-</pre>
-
-<h3 id="El_atributo_autofocus">El atributo autofocus</h3>
-
-<p>El atributo <strong>autofocus</strong> te permite especificar que una parte del formulario debe tener foco para ingresar información cuando se carga la página, a menos que el usuario lo cambie, por ejemplo al escribir en otro lugar. Sólo un elemento del formulario en un documento puede tener el atributo <strong>autofocus</strong>, que es de tipo boolean. Este atributo puede ser aplicado a los elementos <code>{{ HTMLElement("input") }}</code>, <code>{{ HTMLElement("button") }}</code>, <code>{{ HTMLElement("select") }}</code> y <code>{{ HTMLElement("textarea") }}</code>. La excepción es que <strong>autofocus</strong> no puede ser aplicado a un elemento <code>&lt;input&gt;</code> si el atributo {{ htmlattrxref("type", "input") }} <code>hidden</code> está seleccionado (esto quiere decir, no se puede enfocar automáticamente un elemento escondido).</p>
-
-<pre>&lt;input type="text" id="user" autofocus /&gt;
-</pre>
-
-<h3 id="La_propiedad_label.control_del_DOM">La propiedad label.control del DOM</h3>
-
-<p>La interface <a href="/en/DOM/HTMLLabelElement" title="en/DOM/HTMLLabelElement">HTMLLabelElement</a> DOM brinda una propiedad extra, sumadas a las propiedades que corresponden a los atributos del elemento <code>{{ HTMLElement("label") }}</code> de HTML. La propiedad <strong>control</strong> devuelve el controlador etiquetado, es decir el controlador para quien está hecha la etiqueta, que está determinado por el atributo {{ htmlattrxref("for", "label") }} (si está definido) o por el primer elemento controlador descendiente.</p>
-
-<h3 id="Validación_restringida">Validación restringida</h3>
-
-<p>El HTML5 brinda sintaxis y elementos de API para posibilitar la validación de formularios del lado del cliente. Aunque esta funcionalidad no reemplaza la validación del lado del servidor, que todavía es necesaria por seguridad e integridad de la información, la validación del lado del cliente puede brindar una experiencia de usuario mejor al darle al usuario una respuesta inmediata acerca de la información ingresada.</p>
-
-<h4 id="Sintaxis_de_HTML_para_la_validación_restringida">Sintaxis de HTML para la validación restringida</h4>
-
-<p>Los siguientes elementos de sintaxis de HTML5 pueden ser usados para restringir datos en el formulario.</p>
-
-<ul>
- <li>El atributo {{ htmlattrxref("required", "input") }} en los elementos {{ HTMLElement("input") }}, {{ HTMLElement("select") }} y {{ HTMLElement("textarea") }} indica que se debe ingresar algún dato. (En el elemento {{ HTMLElement("input") }}, {{ htmlattrxref("required", "input") }} sólo se aplica con ciertos valores del atributo {{ htmlattrxref("type", "input") }}.)</li>
- <li>El atributo {{ htmlattrxref("pattern", "input") }} en el elemento {{ HTMLElement("input") }} restringe el valor para que concuerde con una expresión regular específica.</li>
- <li>Los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }} del elemento {{ HTMLElement("input") }} restringen los valores máximos y mínimos que pueden ser ingresados.</li>
- <li>El atributo {{ htmlattrxref("step", "input") }} del elemento {{ HTMLElement("input") }} (cuando se usa en combinación con los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }}) restringe la granularidad de los valores ingresados. Un valor que no se corresponda con un valor permitido no será validado.</li>
- <li>El atributo {{ htmlattrxref("maxlength", "input") }} de los elementos {{ HTMLElement("input") }} y {{ HTMLElement("textarea") }} restringe el máximo número de caracteres (en puntos de código unicode) que el usuario puede ingresar.</li>
- <li>Los valores <code>url</code> y <code>email</code> para {{ htmlattrxref("type", "input") }} restringen el valor para una URL o dirección de correo válida respectivamente.</li>
-</ul>
-
-<p>Además, puedes prevenir la validación restringida especificando el atributo {{ htmlattrxref("novalidate", "form") }} en el elemento {{ HTMLElement("form") }}, o el atributo {{ htmlattrxref("formnovalidate", "button") }} en el elemento {{ HTMLElement("button") }} y en el elemento {{ HTMLElement("input") }} (cuando {{ htmlattrxref("type", "input") }} es <code>submit</code> o <code>image</code>). Estos atributos indican que el formulario no será validado cuando se envie.</p>
-
-<h4 id="API_de_validación_restringida">API de validación restringida</h4>
-
-<p>Las siguientes propiedades y métodos del DOM relacionadas con la validación restringida están disponibles para scripts del lado del cliente:</p>
-
-<ul>
- <li>En objetos <a href="/en/DOM/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a>, el método <code>checkValidity()</code>, que devuelve verdadero si todos los elementos asociados del formulario que necesitan validación satisfacen las restricciones y falso si no lo hacen.</li>
- <li>En <a href="/en/HTML/Content_categories#form-associated" title="en/HTML/Content Categories#form-associated">elementos asociados al formulario</a>:
-  <ul>
-   <li>la propiedad <code>willValidate</code>, que es falso si el elemento no satisface las restricciones.</li>
-   <li>la propiedad <code>validity</code>, que es un objeto <a href="/en/DOM/ValidityState_Interface" title="en/DOM/ValidityState Interface">ValidityState</a> que representa los estados de validación en que está el elemento (p.e., condiciones de restricción que han fallado o exitosas).</li>
-   <li>la propiedad <code>validationMessage</code>, que es un mensaje que contiene todas las fallas en las restricciones que pertenecen a ese elemento.</li>
-   <li>el método <code>checkValidity()</code>, que devuelve falso si el elemento falla en satisfacer alguna de las restricciones o verdadero si pasa lo contrario.</li>
-   <li>el método <code>setCustomValidity()</code>, que establece un mensaje de validación personalizado, permitiendo imponer y validad restricciones más allá de las que están predefinidas.</li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/html/html5/formularios_en_html5/index.html b/files/es/html/html5/formularios_en_html5/index.html
deleted file mode 100644
index 6e4cd130d6..0000000000
--- a/files/es/html/html5/formularios_en_html5/index.html
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: Formularios en HTML5
-slug: HTML/HTML5/Formularios_en_HTML5
-tags:
-  - HTML
-  - HTML5
-  - formulários
-  - para_revisar
-translation_of: Learn/HTML/Forms/HTML5_updates
----
-<p>{{ gecko_minversion_header("2") }}</p>
-<p>Los elementos y atributos para formularios en HTML5 proveen un mayor grado de marcado semántico que en HTML4 y eliminan gran parte del tedioso trabajo de programación y diseño que se necesitaba en HTML4. Las funcionalidades de los formularios en HTML5 brindan una mejor experiencia para los usuarios al permitir que estos tengan un comportamiento más coherente entre diferentes sitios web y proporcionar una retroalimentación inmediata acerca de la información ingresada. Asimismo, proporcionan esta experiencia a los usuarios que han deshabilitado el javascript en sus navegadores.</p>
-<p>Este documento describe los elementos nuevos o modificados que están disponibles en Gecko/Firefox.</p>
-<h3 id="El_elemento_&lt;input>">El elemento <code>&lt;input&gt;</code></h3>
-<p>El elemento <code>{{ HTMLElement("input") }}</code> tiene nuevos valores para el atributo {{ htmlattrxref("type", "input") }}.</p>
-<ul> <li><span style="font-family: Courier New;">search</span>: El atributo representa un campo de búsqueda. Los saltos de línea son automáticamente eliminados del valor ingresado pero no se modifica ninguna otra sintaxis.</li> <li><span style="font-family: Courier New;">tel</span>: El atributo representa un control para editar un número de teléfono. Los saltos de línea son automáticamente eliminados del valor ingresado pero no se modifica ninguna otra sintaxis, ya que los números telefónicos varían enormemente en todo el mundo. Puedes usar atributos como {{ htmlattrxref("pattern", "input") }} y {{ htmlattrxref("maxlength", "input") }} para restringir los valores ingresados en el campo.</li> <li><span style="font-family: Courier New;">url</span>: El atributo representa un control para editar una <a class=" external" href="http://es.wikipedia.org/URL" title="http://es.wikipedia.org/URL">URL</a>. Se eliminan los saltos de línea y espacios en blanco antes y después del valor ingresado.</li> <li> <p><span style="font-family: Courier New;">email</span>: El atributo representa una dirección de correo electrónico. Los saltos de línea se eliminan automáticamente del valor ingresado. Puede ingresarse una dirección de correo no válida, pero el campo de ingreso sólo funcionará si la dirección  satisface la producción ABNF <span style="font-family: Courier New;"><code><code title="">1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )</code></code></span> donde <code title="">atext</code> está definida en RFC 5322, sección 3.2.3 y <code title="">ldh-str</code> está definida en RFC 1034, sección 3.5.</p> <div class="note">Nota: si el atributo {{ htmlattrxref("multiple", "input") }} está incluido, pueden ingresarse muchas direcciones de correo electrónico en ese campo {{ HTMLElement("input") }}, como una lista separada por comas, pero no está implementado actualmente en Firefox.</div> </li>
-</ul>
-<p>El elemento {{ HTMLElement("input") }} también tiene nuevos atributos:</p>
-<ul> <li>{{ htmlattrxref("list", "input") }}: el id. de un elemento {{ HTMLElement("datalist") }} cuyo contenido, los elementos {{ HTMLElement("option") }}, van a ser usados como ayudas y serán mostrados como propuestas en el área de sugerencias del campo input.</li> <li>{{ htmlattrxref("pattern", "input") }}: una expresión regular respecto a la cual se comprueba el valor del control, que puede ser usada con valores de {{ htmlattrxref("type", "input") }} de <code>text</code>, <code>tel</code>, <code>search</code>, <code>url</code> y <code>email</code>.</li> <li>{{ htmlattrxref("formmethod", "input") }}: una cadena que indica qué método HTTP (GET, POST, PUT o DELETE) debe ser usado cuando se envía; sobrescribe el {{ htmlattrxref("method", "form") }} del elemento {{ HTMLElement("form") }}, si se define. El {{ htmlattrxref("formmethod", "input") }} sólo se aplica cuando el {{ htmlattrxref("type", "input") }} es <span style="font-family: Courier New;">image</span> o <span style="font-family: Courier New;">submit</span>.</li> <li>{{ htmlattrxref("x-moz-errormessage", "input") }} {{ non-standard_inline() }}: una cadena que se muestra como un mensaje de error si el campo no logra validarse. Es una extensión de Mozilla.</li> </ul>
-<h3 id="El_elemento_&lt;form>">El elemento <code>&lt;form&gt;</code></h3>
-<p>El elemento {{ HTMLElement("form") }} tiene un nuevo atributo:</p>
-<ul> <li>{{ htmlattrxref("novalidate", "form") }}: este atributo evita que el formulario sea validado antes del envío.</li>
-</ul><h3 id="El_elemento_&lt;datalist>">El elemento <code>&lt;datalist&gt; </code></h3>
-<p>El elemento {{ HTMLElement("datalist") }} representa la lista de elementos {{ HTMLElement("option") }} como sugerencias cuando se llena un campo {{ HTMLElement("input") }}.</p>
-<p>Puedes usar el atributo {{ htmlattrxref("list", "input") }} en un elemento {{ HTMLElement("input") }} para enlazar a un campo de ingreso específico con un elemento {{ HTMLElement("datalist") }} determinado.</p>
-<h3 id="El_elemento_&lt;output>">El elemento <code>&lt;output&gt;</code></h3>
-<p>El elemento <code>{{ HTMLElement("output") }}</code> representa el resultado de un cálculo.</p>
-<p>Puedes usar el atributo {{ htmlattrxref("for", "output") }} para especificar una relación entre el elemento output y otros elementos en el documento que afectan el cálculo (por ejemplo, ingreso de datos o parámetros). El valor del atributo {{ htmlattrxref("for", "output") }} es una lista separada por espacios de identificadores de otros elementos.</p><h3 id="El_atributo_placeholder">El atributo placeholder</h3>
-<p>El atributo {{ htmlattrxref("placeholder", "input") }} en elementos <code>{{ HTMLElement("input") }}</code> y <code>{{ HTMLElement("textarea") }}</code> proporciona una ayuda a los usuarios acerca de qué debe ingresarse en el campo. El texto introducido en el placeholder no debe contener retornos de carro o saltos de línea.</p><h3 id="El_atributo_autofocus">El atributo autofocus</h3>
-<p>El atributo {{ htmlattrxref("autofocus", "input") }} te permite especificar que una parte del formulario debe tener foco para ingresar información cuando se carga la página, a menos que el usuario lo cambie, por ejemplo al escribir en otro lugar. Sólo un elemento del formulario en un documento puede tener el atributo <code>autofocus</code>, que es booleano. Este atributo puede ser aplicado a los elementos <code>{{ HTMLElement("input") }}</code>, <code>{{ HTMLElement("button") }}</code>, <code>{{ HTMLElement("select") }}</code> y <code>{{ HTMLElement("textarea") }}</code>. La excepción es que <code>autofocus</code> no puede aplicarse a un elemento <code>&lt;input&gt;</code> si el atributo {{ htmlattrxref("type", "input") }} <code>hidden</code> está seleccionado (es decir, no puede enfocar automáticamente un elemento escondido).</p><h3 id="La_propiedad_label.control_del_DOM">La propiedad label.control del DOM</h3>
-<p>La interface <a href="/en/DOM/HTMLLabelElement" title="en/DOM/HTMLLabelElement">HTMLLabelElement</a> DOM brinda una propiedad extra, sumadas a las propiedades que corresponden a los atributos del elemento <code>{{ HTMLElement("label") }}</code> de HTML. La propiedad <strong>control</strong> devuelve el controlador etiquetado, es decir, el controlador para el que está hecha la etiqueta, que está determinado por el atributo {{ htmlattrxref("for", "label") }} (si está definido) o por el primer elemento controlador descendiente.</p><h3 id="Validación_restringida">Validación restringida</h3>
-<p>El HTML5 brinda sintaxis y elementos de API para posibilitar la validación de formularios del lado del cliente. Aunque esta funcionalidad no reemplaza la validación del lado del servidor, que todavía es necesaria por seguridad e integridad de la información, la validación del lado del cliente puede brindar una experiencia de usuario mejor al darle al usuario una respuesta inmediata acerca de la información ingresada.</p>
-<p>Si se ajusta el atributo <code>title</code> al elemento {{ HTMLElement("input") }}, esa cadena se mostrará en una ventana emergente de ayuda cuando falle la validación. Si <code>title</code> se ajusta a una cadena vacía, no se mostrará ninguna ventana emergente. Si el atributo <code>title</code> no se configura, en su lugar se mostrará el mensaje de validación estándar (como especifica el atributo {{ htmlattrxref("x-moz-errormessage") }} o llamando al método <code>setCustomValidity()</code>).</p>
-<div class="note"><strong>Note:</strong> la validación restringida no es compatible con los elementos {{ HTMLElement("button") }} en un formulario; si quieres aplicar estilo a un botón basado en la validez del formulario asociado, usa la seudoclase {{ cssxref(":-moz-submit-invalid") }}.</div>
-<h4 id="Sintaxis_de_HTML_para_la_validación_restringida">Sintaxis de HTML para la validación restringida</h4>
-<p>Los siguientes elementos de sintaxis de HTML5 pueden ser usados para restringir datos en el formulario.</p>
-<ul> <li>El atributo {{ htmlattrxref("required", "input") }} en los elementos {{ HTMLElement("input") }}, {{ HTMLElement("select") }} y {{ HTMLElement("textarea") }} indica que se debe ingresar algún dato. (En el elemento {{ HTMLElement("input") }}, {{ htmlattrxref("required", "input") }} solo se aplica con ciertos valores del atributo {{ htmlattrxref("type", "input") }}.)</li> <li>El atributo {{ htmlattrxref("pattern", "input") }} en el elemento {{ HTMLElement("input") }} restringe el valor para que concuerde con una expresión regular específica.</li> <li>Los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }} del elemento {{ HTMLElement("input") }} restringen los valores máximos y mínimos que pueden ser ingresados.</li> <li>El atributo {{ htmlattrxref("step", "input") }} del elemento {{ HTMLElement("input") }} (cuando se usa en combinación con los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }}) restringe la granularidad de los valores ingresados. Un valor que no se corresponda con un valor permitido no será validado.</li> <li>El atributo {{ htmlattrxref("maxlength", "input") }} de los elementos {{ HTMLElement("input") }} y {{ HTMLElement("textarea") }} restringe el máximo número de caracteres (en puntos de código unicode) que el usuario puede ingresar.</li> <li>Los valores <code>url</code> y <code>email</code> para {{ htmlattrxref("type", "input") }} restringen el valor para una URL o dirección de correo válida respectivamente.</li>
-</ul>
-<p>Además, puedes evitar la validación restringida especificando el atributo {{ htmlattrxref("novalidate", "form") }} en el elemento {{ HTMLElement("form") }}, o el atributo {{ htmlattrxref("formnovalidate", "button") }} en el elemento {{ HTMLElement("button") }} y en el elemento {{ HTMLElement("input") }} (cuando {{ htmlattrxref("type", "input") }} es <code>submit</code> o <code>image</code>). Estos atributos indican que el formulario no será validado cuando se envie.</p><h4 id="API_de_validación_restringida">API de validación restringida</h4>
-<p>Las siguientes propiedades y métodos del DOM relacionadas con la validación restringida están disponibles para scripts del lado del cliente:</p>
-<ul> <li>En objetos <code><a href="/en/DOM/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a></code> el método <code>checkValidity()</code>, que devuelve verdadero si todos los elementos asociados del formulario que necesitan validación satisfacen las restricciones, y falso si no lo hacen,</li> <li>En <a href="/en/HTML/Content_categories#form-associated" title="en/HTML/Content Categories#form-associated">elementos asociados al formulario</a>: <ul> <li>la propiedad <code>willValidate</code>, que es falso si el elemento no satisface las restricciones.</li> <li>la propiedad <code>validity</code>, que es un objeto <code><a href="../../../../en/DOM/ValidityState" rel="internal">ValidityState</a></code> que representa los estados de validación en que está el elemento (p. ej., condiciones de restricción que han fallado o exitosas).</li> <li>la propiedad <code>validationMessage</code>, que es un mensaje que contiene todas las fallas o errores en las restricciones que pertenecen a ese elemento.</li> <li>el método <code>checkValidity()</code>, que devuelve falso si el elemento no logra satisfacer alguna de las restricciones, o verdadero si pasa lo contrario.</li> <li>el método <code>setCustomValidity()</code>, que establece un mensaje de validación personalizado, permitiendo imponer y validad restricciones más allá de las que están predefinidas.</li> </ul> </li>
-</ul>
-<p>{{ languages({"en": "en/HTML/HTML5/Forms_in_HTML5", "ja": "ja/HTML/HTML5/Forms_in_HTML5"}) }}</p>
-<p>{{ HTML5ArticleTOC() }}</p>
diff --git a/files/es/html/html5/html5_lista_elementos/index.html b/files/es/html/html5/html5_lista_elementos/index.html
deleted file mode 100644
index 64595418c8..0000000000
--- a/files/es/html/html5/html5_lista_elementos/index.html
+++ /dev/null
@@ -1,599 +0,0 @@
----
-title: Lista de Elementos HTML5
-slug: HTML/HTML5/HTML5_lista_elementos
-translation_of: Web/HTML/Element
-translation_of_original: Web/Guide/HTML/HTML5/HTML5_element_list
----
-<p>Todos los <strong>elementos del estandar HTML5</strong> están listados aquí, descritos por su etiqueta de apertura y agrupados por su función. Contrariamente al <a href="/en-US/docs/HTML/Element" title="HTML/Element">indice de elementos HTML</a> el cual lista todas las posibles etiquetas, estandar, no-estandar, válidas, obsoletas o aquellas en desuso, esta lista solamente los elementos válidos de HTML5. Solamente aquellos elementos listados aquí son los que deberían ser usados en nuevos sitios Web.</p>
-
-<p>El simbolo <a href="/en-US/docs/HTML/HTML5"><img alt="This element was added as part of HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a> indica que el elemento fue añadido en HTML5. Nótese que otros elementos listados aqui pueden haber sido modificados o extendido en su significado por la especificación HTML5.</p>
-
-<h2 id="Elemento_raíz">Elemento raíz</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Elemento</td>
-   <td>Descripcion</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("&lt;!DOCTYPE html&gt;")}}</td>
-   <td>Define que el documento esta bajo el estandar de HTML 5</td>
-  </tr>
- </tbody>
-</table>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("html")}}</td>
-   <td>Representa la raíz de un documento HTML o XHTML. Todos los demás elementos deben ser descendientes de este elemento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Metadatos_del_documento">Metadatos del documento</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("head")}}</td>
-   <td>Representa una colección de metadatos acerca del documento, incluyendo enlaces a, o definiciones de, scripts y hojas de estilo.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("title")}}</td>
-   <td>Define el título del documento, el cual se muestra en la barra de título del navegador o en las pestañas de página. Solamente puede contener texto y cualquier otra etiqueta contenida no será interpretada.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("base")}}</td>
-   <td>Define la URL base para las URLs relativas en la página.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("link")}}</td>
-   <td>Usada para enlazar JavaScript y CSS externos con el documento HTML actual.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("meta")}}</td>
-   <td>Define los metadatos que no pueden ser definidos usando otro elemento HTML.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("style")}}</td>
-   <td>Etiqueta de estilo usada para escribir CSS en línea.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Scripting">Scripting</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("script")}}</td>
-   <td>Define ya sea un script interno o un enlace hacia un script externo. El lenguaje de programación es JavaScript</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("noscript")}}</td>
-   <td>Define un contenido alternativo a mostrar cuando el navegador no soporta scripting.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Secciones">Secciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("body")}}</td>
-   <td>
-    <div>Representa el contenido principal de un documento HTML. Solo hay un elemento <code>&lt;body&gt;</code> en un documento.</div>
-   </td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("section")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define una sección en un documento.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("nav")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define una sección que solamente contiene enlaces de navegación</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("article")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define contenido autónomo que podría existir independientemente del resto del contenido.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("aside")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define algunos contenidos vagamente relacionados con el resto del contenido de la página. Si es removido, el contenido restante seguirá teniendo sentido</td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/HTML/Element/Heading_Elements"><code>&lt;h1&gt;,&lt;h2&gt;,&lt;h3&gt;,&lt;h4&gt;,&lt;h5&gt;,&lt;h6&gt;</code></a></td>
-   <td>Los elemento de cabecera  implementan seis niveles de cabeceras de documentos; <code>&lt;h1&gt;</code> es la de mayor y <code>&lt;h6&gt;</code> es la de menor importancia. Un elemento de cabecera describe brevemente el tema de la sección que introduce.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("header")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define la cabecera de una página o sección. Usualmente contiene un logotipo, el título del sitio Web y una tabla de navegación de contenidos.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("footer")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define el pie de una página o sección. Usualmente contiene un mensaje de derechos de autoría, algunos enlaces a información legal o direcciones para dar información de retroalimentación.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("address")}}</td>
-   <td>Define una sección que contiene información de contacto.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("main")}}<a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define el contenido principal o importante en el documento. Solamente existe un elemento <code>&lt;main&gt;</code> en el documento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Agrupación_de_Contenido">Agrupación de Contenido</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("p")}}</td>
-   <td>Define una parte que debe mostrarse como un párrafo.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("hr")}}</td>
-   <td>Representa un quiebre temático entre párrafos de una sección o articulo o cualquier contenido.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("pre")}}</td>
-   <td>Indica que su contenido esta preformateado y que este formato debe ser preservado.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("blockquote")}}</td>
-   <td>Representa un contenido citado desde otra fuente.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("ol")}}</td>
-   <td>Define una lista ordenada de artículos.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("ul")}}</td>
-   <td>Define una lista de artículos sin orden.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("li")}}</td>
-   <td>Define un artículo de una lista enumerada.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("dl")}}</td>
-   <td>Define una lista de definiciones, es decir, una lista de términos y sus definiciones asociadas.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("dt")}}</td>
-   <td>Representa un término definido por el siguiente <code>&lt;dd&gt;</code>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("dd")}}</td>
-   <td>Representa la definición de los términos listados antes que él.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("figure")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa una figura ilustrada como parte del documento.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("figcaption")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa la leyenda de una figura.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("div")}}</td>
-   <td>Representa un contenedor genérico sin ningún significado especial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Semántica_a_nivel_de_Texto">Semántica a nivel de Texto</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("a")}}</td>
-   <td>Representa un <em>hiperenlace</em>, enlazando a otro recurso.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("em")}}</td>
-   <td>Representa un texto <em>enfatizado</em>, como un acento de intensidad.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("strong")}}</td>
-   <td>Representa un texto especialmente <em>importante</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("small")}}</td>
-   <td>Representa un <em>comentario aparte</em>, es decir, textos como un descargo de responsabilidad o una nota de derechos de autoría, que no son esenciales para la comprensión del documento.<code> </code></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("s")}}</td>
-   <td>Representa contenido que <em>ya</em> <em>no es exacto o relevante</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("cite")}}</td>
-   <td>Representa el <em>título de una obra</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("q")}}</td>
-   <td>Representa una <em>cita textual</em> inline.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("dfn")}}</td>
-   <td>Representa un término cuya <em>definición</em>  está contenida en su contenido ancestro más próximo.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("abbr")}}</td>
-   <td>Representa una <em>abreviación </em>o un <em>acrónimo</em> ; la expansión de la abreviatura puede ser representada por el atributo <code>title</code>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("data")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Asocia un <em>equivalente legible por máquina </em>a sus contenidos. (Este elemento está sólamente en la versión de la WHATWG del estandar HTML, y no en la versión de la W3C de HTML5).</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("time")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un valor de <em>fecha </em>y <em>hora</em>; el equivalente legible por máquina puede ser representado en el atributo <span style="font-family: courier new,andale mono,monospace; line-height: normal;">datetime</span>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("code")}}</td>
-   <td>Representa un <em>código de </em><em>ordenador</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("var")}}</td>
-   <td>Representa a una <em>variable, </em>es decir<em>, una expresión matemática o contexto de programación, un identificador que represente a una constante, un símbolo que identifica una cantidad física, un parámetro de una función o un marcador de posición en prosa</em><em>.</em></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("samp")}}</td>
-   <td>Representa la <em>salida</em> de un programa o un ordenador.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("kbd")}}</td>
-   <td>Representa la <em>entrada de usuario</em>, por lo general desde un teclado, pero no necesariamente, este puede representar otras formas de entrada de usuario, como comandos de voz transcritos.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("sub")}},{{HTMLElement("sup")}}</td>
-   <td>Representan un <em>subíndice</em> y un <em>superíndice, </em>respectivamente.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("i")}}</td>
-   <td>Representa un texto en una voz o estado de ánimo <em>alterno</em>, o por lo menos de diferente calidad, como una designación taxonómica, un término técnico, una frase idiomática, un pensamiento o el nombre de un barco.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("b")}}</td>
-   <td>Representa un texto hacia el cual se llama la atención para <em>propósitos utilitarios. </em> No confiere ninguna importancia adicional y no implica una voz alterna.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("u")}}</td>
-   <td>Representa una anotación no textual <em>sin-articular</em>, como etiquetar un texto como mal escrito o etiquetar un nombre propio en texto en chino.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("mark")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa texto resaltado con propósitos de <em>referencia</em>, es decir por su relevancia en otro contexto.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("ruby")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>
-    <p>Representa contenidos a ser marcados con <em>anotaciones ruby</em>, recorridos cortos de texto presentados junto al texto. Estos son utilizados con regularidad en conjunto a lenguajes de Asia del Este, donde las anotaciones actúan como una guía para la pronunciación, como el <em>furigana</em> japonés.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("rt")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa el <em>texto de una anotación ruby</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("rp")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa los <em>paréntesis </em>alrededor de una anotación ruby, usada para mostrar la anotación de manera alterna por los navegadores que no soporten despliegue estandar para las anotaciones.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("bdi")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un texto que debe ser <em>aislado</em> de sus alrededores para el formateado bidireccional del texto.  Permite incrustar un fragmento de texto con una direccionalidad diferente o desconocida.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("bdo")}}</td>
-   <td>Representa la <em>direccionalidad</em> de sus descendientes con el fin de anular de forma explícita al algoritmo bidireccional Unicode.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("span")}}</td>
-   <td>Representa texto sin un significado específico.  Este debe ser usado cuando <em>ningún otro</em> elemento semántico le confiere un significado adecuado, en cuyo caso, provendrá de atributos globales como <code>class</code>, <code>lang</code>, o <code>dir</code>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("br")}}</td>
-   <td>Representa un <em>salto de línea</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("wbr")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa una <em>oportunidad de salto de línea, </em>es decir, un punto sugerido de envoltura donde el texto de múltiples líneas puede ser dividido para mejorar su legibilidad.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ediciones">Ediciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("ins")}}</td>
-   <td>Define una <em>adición</em> en el documento.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("del")}}</td>
-   <td>Define una <em>remoción</em> del documento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Contenido_incrustado">Contenido incrustado</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("img")}}</td>
-   <td>Representa una <em>imagen</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("iframe")}}</td>
-   <td>Representa un <em>contexto anidado de navegación</em>, es decir, un documento HTML embebido.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("embed")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>punto de integración</em> para una aplicación o contenido interactivo externo que por lo general no es HTML.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("object")}}</td>
-   <td>Representa un <em>recurso externo, </em>que será tratado como una imagen, un sub-documento HTML o un recurso externo a ser procesado por un plugin.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("param")}}</td>
-   <td>Define <em>parámetros</em> para el uso por los plugins invocados por los elementos <code>&lt;object&gt;</code>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("video")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>video</em>, y sus archivos de audio y capciones asociadas, con la interfaz necesaria para reproducirlos. </td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("audio")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>sonido</em> o <em>stream de audio.</em></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("source")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Permite a autores especificar recursos multimedia alternativos para los elementos multimedia como <code>&lt;video&gt;</code> o <code>&lt;audio&gt;</code>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("track")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Permite a autores especificar una <em>pista de texto</em> temporizado para elementos multimedia como <code>&lt;video&gt;</code> o<em> <code>&lt;audio&gt;</code>.</em></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("canvas")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>área de mapa de bits</em>  en el que se pueden utilizar scripts para renderizar gráficos como gráficas, gráficas de juegos o cualquier imagen visual al vuelo.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("map")}}</td>
-   <td>En conjunto con <code>&lt;area&gt;</code>, define un <em>mapa de imagen</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("area")}}</td>
-   <td>En conjunto con <code>&lt;map&gt;</code>, define un <em>mapa de imagen</em>.</td>
-  </tr>
-  <tr>
-   <td>{{SVGElement("svg")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define una <em>imagen vectorial</em> embebida.</td>
-  </tr>
-  <tr>
-   <td>{{MathMLElement("math")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Define una <em>fórmula matemática</em>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Datos_tabulares">Datos tabulares</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("table")}}</td>
-   <td>Representa <em>datos con más de una dimensión.</em></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("caption")}}</td>
-   <td>Representa el <em>título de una tabla</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("colgroup")}}</td>
-   <td>Representa un <em>conjunto de una o más columnas</em> de una tabla.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("col")}}</td>
-   <td>Representa una <em>columna </em>de una tabla.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("tbody")}}</td>
-   <td>Representa el bloque de filas que describen los <em>datos concretos </em>de una tabla.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("thead")}}</td>
-   <td>Representa el bloque de filas que describen las <em>etiquetas de columna</em> de una tabla.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("tfoot")}}</td>
-   <td>Representa los bloques de filas que describen los <em>resúmenes de columna</em> de una tabla.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("tr")}}</td>
-   <td>Representa una <em>fila de celdas </em>en una tabla.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("td")}}</td>
-   <td>Representa una <em>celda de datos</em> en una tabla.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("th")}}</td>
-   <td>
-    <p>Representa una <em>celda encabezado </em>en una tabla. </p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Formularios">Formularios</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("form")}}</td>
-   <td>Representa un <em>formulario</em>, consistiendo de controles que puede ser enviado a un servidor para procesamiento.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("fieldset")}}</td>
-   <td>Representa un <em>conjunto de controles</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("legend")}}</td>
-   <td>Representa el <em>título </em>de un <code>&lt;fieldset&gt;</code>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("label")}}</td>
-   <td>Representa el <em>título</em> de un control de formulario.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("input")}}</td>
-   <td>Representa un <em>campo de datos escrito </em>que permite al usuario editar los datos.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("button")}}</td>
-   <td>Representa un <em>botón</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("select")}}</td>
-   <td>Representa un control que permite la <em>selección entre un conjunto de opciones</em>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("datalist")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>conjunto de opciones predefinidas </em>para otros controles.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("optgroup")}}</td>
-   <td>Representa un <em>conjunto de opciones, </em>agrupadas lógicamente.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("option")}}</td>
-   <td>Representa una <em>opción</em> en un elemento <code>&lt;select&gt;</code>, o una sugerencia de un elemento <code>&lt;datalist&gt;</code>.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("textarea")}}</td>
-   <td>Representa un <em>control de edición de texto multilínea.</em></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("keygen")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un control de <em>par generador de llaves.</em></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("output")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa el <em>resultado de un cálculo.</em></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("progress")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa el <em>progreso de finalización </em>de una tarea.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("meter")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa la <em>medida </em>escalar (o el valor fraccionario) dentro de un rango conocido.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Elementos_interactivos">Elementos interactivos</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("details")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>widget</em> desde el que un usuario puede obtener información o controles adicionales.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("summary")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>resumen, título</em> o <em>leyenda</em> para un elemento <code>&lt;details&gt;</code> dado.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("command")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa un <em>comando</em> que un usuario puede invocar.</td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("menu")}} <a href="/en-US/docs/HTML/HTML5"><img alt="This element has been added in HTML5" src="/files/3843/HTML5_Badge_32.png" style="height: 16px; vertical-align: middle; width: 16px;" title="This element has been added in HTML5"></a></td>
-   <td>Representa una <em>lista de comandos</em> .</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/HTML/HTML5" title="HTML/HTML5">Un conjunto de documentos sobre HTML5</a>.</li>
- <li>La <a href="/en-US/docs/HTML/Element" title="HTML/Element">referencia de todos las etiquetas HTML</a>, incluso elementos no validos en HTML5.</li>
- <li>Otra manera de listar las etiquetas: la <a href="http://joshduck.com/periodic-table.html" title="http://joshduck.com/periodic-table.html">Tabla Periodica de elementos HTML5</a> por Josh Duck.</li>
-</ul>
diff --git a/files/es/html/html5/html5_parser/index.html b/files/es/html/html5/html5_parser/index.html
deleted file mode 100644
index 591fcbe865..0000000000
--- a/files/es/html/html5/html5_parser/index.html
+++ /dev/null
@@ -1,64 +0,0 @@
----
-title: Analizador de HTML5
-slug: HTML/HTML5/HTML5_Parser
-tags:
-  - HTML
-  - HTML5
-  - para_revisar
-translation_of: Web/Guide/HTML/HTML5/HTML5_Parser
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">{{ gecko_minversion_header("2") }}{{ draft() }}</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Gecko 2 introduce un nuevo analizador basado en HTML 5.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">El analizador de HTML es una de las piezas más complicadas y delicadas de un navegador.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Controla la forma en que tu código fuente HTML es convertido en páginas web y, como tal, los cambios en él son poco habituales.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">El nuevo analizador es más rápido, cumple con el estándar HTML 5 y permite muchas funcionalidades nuevas.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">El nuevo analizador presenta estas mejoras importantes:</span></span></p>
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Ahora puedes utilizar SVG y MathML alineado en las páginas de HTML 5, sin sintaxis de espacio de nombres XML.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">El análisis se hace ahora en un tema aparte del hilo principal de la interfaz de usuario de Firefox, mejorando la capacidad de respuesta global del navegador.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Las llamadas a <code>innerHTML</code> son mucho más rápidas.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Se han corregido <a class="external" href="http://tinyurl.com/html-parser-bugs" title="http://tinyurl.com/html-parser-bugs">decenas de errores relacionados desde hace tiempo con el analizador</a>.</span></span></li>
-</ul>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">La <a class="external" href="http://www.w3.org/TR/html5/" title="http://www.w3.org/TR/html5/">especificación de HTML 5</a> ofrece una descripción más detallada que los anteriores estándares HTML sobre cómo convertir una secuencia de bytes en un árbol DOM.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Esto dará lugar a un comportamiento más consistente a través de las implementaciones del navegador.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">En otras palabras, al ser compatibles con HTML5, Gecko, WebKit, e Internet Explorer (IE) se comportarán de forma más coherente entre sí.</span></span></p>
-<h2 id="Conductas_del_analizador_modificadas"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Conductas del analizador modificadas</span></span></h2>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Algunos cambios en la forma en que se comporta el analizador de Gecko 2, en comparación con versiones anteriores de Gecko, pueden afectar a los desarrolladores web, dependiendo de cómo hayas escrito anteriormente el código y en qué navegadores lo hayas probado.</span></span></p>
-<h3 id="Tokenización_del_ángulo_izquierdo_del_soporte_dentro_de_una_etiqueta"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Tokenización del ángulo izquierdo del soporte dentro de una etiqueta</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Teniendo en cuenta la cadena <code>&lt;foo&lt;bar&gt;</code> , el nuevo analizador la lee como una etiqueta llamada <code>foo&lt;bar</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Este comportamiento es compatible con IE y Opera, y es diferente de Gecko 1.x y WebKit, que lo leen como dos etiquetas, <code>foo</code> y <code>bar</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si anteriormente has probado tu código en Internet Explorer y Opera, entonces probablemente no tendrás ningunas etiquetas así.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si hiciste la prueba de tu sitio sólo con Gecko 1.x o WebKit (por ejemplo, intranets exclusivas de Firefox o sitios móviles orientados hacia WebKit), entonces podrías tener etiquetas que coincidan con este modelo y se comportarán de manera diferente con Gecko 2.</span></span></p>
-<h3 id="Llamar_a_document.write_()_durante_el_análisis"><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Llamar a document.write () durante el análisis</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Antes de HTML5, Gecko y WebKit permitían las llamadas a <a href="/en/DOM/document.write" title="en/DOM/document.write"><code>document.write()</code></a> <em>durante el análisis</em> para insertar contenido en la secuencia de origen.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Este comportamiento daba lugar inherentemente a <a class="external" href="http://en.wikipedia.org/wiki/Race_condition" title="http://en.wikipedia.org/wiki/Race_condition">condiciones de carrera</a>, puesto que el contenido se insertaba, </span></span><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">en la secuencia de origen, en</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"> un punto dependiente de los tiempos de ejecución.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si la llamada ocurría después de que el análisis acabara, el contenido insertado sustituía al documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">En IE, este tipo de llamadas son ignoradas o implican una llamada a <a href="/en/DOM/document.open" title="en/DOM/document.open"><code>document.open()</code></a>, sustituyendo el documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">En HTML5, <code>document.write()</code> sólo se puede llamar desde un script que creado mediante la etiqueta {{ HTMLElement ("script") }} que no tenga establecidos los atributos <code><a href="/En/HTML/Element/Script#attr_async" title="En/HTML/Element/Script#attr async">async</a></code> o <code><a href="/En/HTML/Element/Script#attr_defer" title="En/HTML/Element/Script#attr defer">defer</a></code>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Con el analizador de HTML 5, las llamadas a <code>document.write()</code> en cualquier otro contexto o se ignoran o sustituyen el documento.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Algunos contextos en los que <em>no</em> debes llamar a <code>document.write()</code> incluyen:</span></span></p>
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">scripts creados con <a href="/en/DOM/document.createElement" title="en/DOM/document.createElement">document.createElement ()</a></span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">controladores de eventos</span></span></li>
- <li><a href="/en/DOM/window.setTimeout" title="en/DOM/window.setTimeout"><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">setTimeout ()</span></span></a></li>
- <li><a href="/en/DOM/window.setInterval" title="en/DOM/window.setInterval"><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">setInterval ()</span></span></a></li>
- <li><code>&lt;script async src="..."&gt;</code></li>
- <li><code>&lt;script defer src="..."&gt;</code></li>
-</ul>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si utilizas el mismo mecanismo para cargar bibliotecas de scripts para todos los navegadores, incluyendo Internet Explorer, entonces tu código probablemente no se vea afectado por este cambio.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los scripts que pueden provocar condiciones de carrera en Firefox, pero que resultarían seguros en Internet Explorer, se comportarán de manera diferente debido a este cambio.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Firefox escribe una advertencia en la consola de JavaScript cuando ignora una llamada a <code>document.write()</code> .</span></span></p>
-<h3 id="Falta_de_repetición_del_análisis"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Falta de repetición del análisis</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Antes de HTML5, los analizadores repetían el análisis del documento si alcanzaban el final del archivo dentro de ciertos elementos o dentro de los comentarios.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por ejemplo, si el documento carecía de una etiqueta de cierre <code>&lt;/title&gt;</code>, el analizador repetía el análisis para buscar el primer "&lt;" del documento, o si el comentario no estaba cerrado, buscaba el primer '&gt;'.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este comportamiento creaba una vulnerabilidad de seguridad.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si un atacante forzaba un final de archivo prematuro, el analizador podía cambiar qué partes del documento consideraba scripts ejecutables.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Además, la compatibilidad con la repetición de análisis dio lugar a código de análisis innecesariamente complejo.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Con HTML 5, los analizadores ya no repiten análisis de ningún documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Este cambio tiene las siguientes consecuencias para los desarrolladores web:</span></span></p>
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si se omite la etiqueta de cierre para &lt;title&gt;, &lt;style&gt;, &lt;textarea&gt; o &lt;XMP&gt;, la página <em>fallará</em> el análisis.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">IE ya falla al analizar documentos si falta una etiqueta &lt;/ title&gt;, así que si pruebas con IE, es probable que no tengas ese problema.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si olvidas cerrar un comentario, lo más probable es que la página falle al analizarse.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Sin embargo, los comentarios no cerrados a menudo se rompen en los navegadores existentes, por una razón u otra, así que es poco probable que tengas este problema en los sitios que se han probado en varios navegadores.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En un script alineado, con el fin de utilizar las cadenas literales <code>&lt;/script&gt;</code> y <code>&lt;!--</code> , deberías evitar que se analicen literalmente, expresándolas como <code>\u003c/script&gt;</code> y <code>\u003c!--</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La práctica anterior de escapar de la cadena <code>&lt;/script&gt;</code> rodeándola con los marcadores de comentario, aunque es compatible con HTML5, causa problemas en los casos en los que se omite el marcador de comentario (ver punto anterior).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Puedes evitar estos problemas utilizando el código de carácter para el primer '&lt;' en su lugar.</span></span></li>
-</ul>
-<h2 id="Mejora_del_rendimiento_con_el_análisis_especulativo"><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Mejora del rendimiento con el análisis especulativo</span></span></h2>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Sin relación con los requisitos de la especificación de HTML 5, el analizador de Gecko 2 utiliza <em>el análisis especulativo</em>, en el que continúa el análisis de un documento mientras que los scripts se están descargando y ejecutando.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto se traduce en un mejor rendimiento en comparación con análisis anteriores, ya que la mayoría de las veces, Gecko puede realizar estas tareas en paralelo.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para aprovechar al máximo el análisis especulativo y ayudar a que tus páginas se carguen lo más rápido posible, asegúrate de que cuando llames a <a href="/en/DOM/document.write" title="en/DOM/document.write">document.write ()</a> , escribas un <em>subárbol equilibrado</em> dentro de ese trozo de script.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Un subárbol equilibrado es el código HTML en el que todos los elementos que se abren también están cerrados, de forma que después de la secuencia de comandos, los elementos que se dejan abiertos son los mismos que fueron abiertos antes de la secuencia de comandos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Las etiquetas de apertura y cierra no necesitan ser escritas por la misma llamada <code>document.write()</code>, siempre y cuando estén dentro de la misma etiqueta <code>&lt;script&gt;</code>.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Ten en cuenta que no debes usar etiquetas de cierre para elementos nulos que no tienen etiquetas de cierre: {{ HTMLElement('area') }}, {{ HTMLElement('base') }}, {{ HTMLElement('br') }}, {{ HTMLElement('col') }}, {{ HTMLElement('command') }}, {{ HTMLElement('embed') }}, {{ HTMLElement('hr') }}, {{ HTMLElement('img') }}, {{ HTMLElement('input') }}, {{ HTMLElement('keygen') }}, {{ HTMLElement('link') }}, {{ HTMLElement('meta') }}, {{ HTMLElement('param') }}, {{ HTMLElement('source') }} and {{ HTMLElement('wbr') }}.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">(También existe algún elemento cuyas etiquetas de cierre pueden omitirse en algunos casos, como {{ HTMLElement ('p') }} del ejemplo siguiente, pero es más fácil usar siempre etiquetas de cierre para dichos elementos que asegurarse de que las etiquetas de cierre sólo se omitan cuando no sean necesarias.)</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por ejemplo, el siguiente código escribe un subárbol equilibrado:</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;script&gt;</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">document.write ("&lt;div&gt;");</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">document.write ("&lt;p&gt; Aquí va el contenido. &lt;/ p&gt;");</span></span>
-  <span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">document.write ("&lt;/ div&gt;");</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ script&gt;</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;!-- Aquí va el HTML sin script. --&gt;
-</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por el contrario, el siguiente código contiene dos scripts con subárboles no equilibrados, lo que hace que el análisis especulativo falle y por lo tanto el tiempo para analizar el documento sea más largo.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-68-goog-gtc-unit-69-goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-human" style="">&lt;script&gt;document.write("&lt;div&gt;");&lt;/script&gt;
-&lt;p&gt;El contenido va aquí.&lt;/p&gt;
-&lt;script&gt;document.write("&lt;/div&gt;");&lt;/script&gt;
-</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para obtener más información, consulta <a href="/en/HTML/HTML5/Optimizing_Your_Pages_for_Speculative_Parsing" title="en/HTML/HTML5/Optimizing Your Pages for Speculative Parsing">Optimizar tus páginas para el análisis especulativo</a></span></span></p>
-<p>{{ languages( { "en": "en/HTML/HTML5/HTML5_Parser" } ) }}</p>
diff --git a/files/es/html/html5/index.html b/files/es/html/html5/index.html
deleted file mode 100644
index 054d21d534..0000000000
--- a/files/es/html/html5/index.html
+++ /dev/null
@@ -1,199 +0,0 @@
----
-title: HTML5
-slug: HTML/HTML5
-tags:
-  - API
-  - CSS3
-  - Gráficos(2)
-  - HTML
-  - HTML5
-  - Multimedia
-  - SVG
-  - conectividad
-  - graficos
-  - mejoras
-  - nuevo
-translation_of: Web/Guide/HTML/HTML5
----
-<p style="line-height: 22px;"><span class="seoSummary"><strong>HTML5 </strong> <span style="line-height: 21px;">es la última versión de</span> <a href="/en-US/docs/HTML" title="HTML">HTML</a>. </span><span style="line-height: 21px;">El término representa dos conceptos diferentes:</span></p>
-
-<ul style="line-height: 22px;">
- <li><span class="seoSummary">Se trata de una nueva versión de HTML, con nuevos elementos, atributos y comportamientos.</span></li>
- <li><span class="seoSummary">Contiene un conjunto más amplio de tecnologías que permite a los sitios Web y a las aplicaciones ser más diversas y de gran alcance.</span> A este conjunto se le llama <em>HTML5 y amigos</em>, a menudo reducido a <em>HTML5</em> .</li>
-</ul>
-
-<p style="line-height: 22px;"><span style="line-height: 21px;">Diseñado para ser utilizable por todos los desarrolladores de Open Web, esta página referencía numerosos recursos sobre las tecnologías de HTML5, clasificados en varios grupos según su función. </span></p>
-
-<ul style="line-height: 22px;">
- <li><em>Semántica</em>: Permite describir con mayor precisión <span id="docs-internal-guid-624d18e2-7fff-fe56-de5d-c9472725617e" style="background-color: transparent; color: #000000; font-family: Arial; font-size: 11pt; font-style: normal; font-variant: normal; font-weight: 400; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">cuál</span> es su contenido.</li>
- <li><em>Conectividad</em>: Permite comunicarse con el servidor de formas nuevas e innovadoras.</li>
- <li><em>Sin conexión y almacenamiento</em>: Permite a las páginas web almacenar datos localmente en el lado del cliente y operar sin conexión de manera más eficiente.</li>
- <li><em>Multimedia</em>: <span style="background-color: #ffffff; color: #4d4e53; display: inline !important; float: none; font-family: open sans,sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;">Nos otorga un excelente soporte para utilizar contenido multimedia</span> como lo son audio y video nativamente.</li>
- <li><em>Gráficos y efectos 2D/3D</em>: Proporciona una amplia gama de nuevas características que se ocupan de los gráficos en la web como lo son canvas 2D, WebGL, SVG, etc.</li>
- <li><em>Rendimiento e Integración</em>: Proporciona una mayor optimización de la velocidad y un mejor uso del hardware.</li>
- <li><em>Acceso al dispositivo</em>: Proporciona APIs para el uso de varios componentes internos de entrada y salida de nuestro dispositivo.</li>
- <li><em>CSS3</em>: Nos ofrece una nueva gran variedad de opciones para hacer diseños más sofisticados.</li>
-</ul>
-
-<div class="cleared row topicpage-table" style="line-height: 22px;">
-<div class="section" style="width: 436px;">
-<h2 id="SEMÁNTICA" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3827/HTML5_Semantics_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">SEMÁNTICA</h2>
-
-<dl>
- <dt><a href="https://developer.mozilla.org/es/docs/Sections_and_Outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">Secciones y contenidos en HTML5</a></dt>
- <dd>Un vistazo al nuevo esquema y secciones de un documento HTML5: <span style="line-height: 1.572;">{{HTMLElement("section")}}, {{HTMLElement("article")}}, {{HTMLElement("nav")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("aside")}}.</span></dd>
- <dt><a href="/docs/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content" title="Uso de audio y video en HTML5">Uso de audio y video en HTML5</a></dt>
- <dd>Los elementos {{HTMLElement("audio")}} y {{HTMLElement("video")}} permiten la manipulacion de nuevo contenido multimedia.</dd>
-</dl>
-
-<dl>
- <dt><a href="https://developer.mozilla.org/es/docs/HTML/HTML5/Formularios_en_HTML5" title="Forms in HTML5">Formularios en HTML5</a></dt>
- <dd>Un mirada a la mejora de los formularios web en HTML5: La API de validación de restricción, varios atributos nuevos, nuevos valores para el<span style="line-height: 1.572;"> {{HTMLElement("input")}} como el atributo {{htmlattrxref("type", "input")}} y el nuevo elemento {{HTMLElement("output")}}.</span></dd>
- <dt><span style="line-height: 1.572;">Nuevos elementos semánticos</span></dt>
- <dd>Junto a las secciones , los medios de comunicación y elementos de formularios, se crearon muchos nuevos elementos como: {{HTMLElement("mark")}}, {{HTMLElement("figure")}}, {{HTMLElement("figcaption")}}, {{HTMLElement("data")}}, {{HTMLElement("time")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, o {{HTMLElement("meter")}}, aumentando la cantidad de <a href="/en-US/docs/HTML/HTML5/HTML5_element_list" title="HTML/HTML5/HTML5_element_list">elementos de HTML5 validos</a>.
- <dl>
-  <dt></dt>
-  <dt>Mejora en {{HTMLElement("iframe")}}</dt>
-  <dd>Uso de atributos de {{htmlattrxref("sandbox", "iframe")}}, {{htmlattrxref("seamless", "iframe")}}, y  {{htmlattrxref("srcdoc", "iframe")}} los autores ahora pueden precisar el nivel de seguridad y la reproduccion deseada de un elemento {{HTMLElement("iframe")}}.</dd>
-  <dt><a href="/en-US/docs/MathML" title="MathML">MathML</a></dt>
-  <dd>Permite integrar directamente fórmulas matemáticas.</dd>
-  <dd></dd>
-  <dt><a href="/en-US/docs/HTML/HTML5/Introduction_to_HTML5" title="HTML/HTML5/Introduction_to_HTML5">Introducción a HTML5</a></dt>
-  <dd><span id="result_box" lang="es"><span class="hps">En este artículo</span> <span class="hps">se explica cómo</span> <span class="hps">indicar al</span> <span class="hps">navegador</span> <span class="hps">que está utilizando</span> <span class="hps">HTML5</span> <span class="hps">en</span> <span class="hps">su diseño web</span> <span class="hps">o aplicación web</span><span>.</span></span></dd>
-  <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/HTML5/HTML5_Parser" title="HTML/HTML5/HTML5 parser">Analizador de HTML5 compatible</a></dt>
-  <dd>El programa de análisis, lo que convierte los bytes de un documento HTML en un DOM, se ha ampliado y ahora define con precisión el comportamiento a utilizar en todos los casos, incluso cuando se trata de HTML inválido. Esto conduce a una mayor previsibilidad e interoperabilidad entre los navegadores compatibles con HTML5.</dd>
- </dl>
-
- <h2 id="CONECTIVIDAD" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3839/HTML5_Connectivity_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">CONECTIVIDAD</h2>
-
- <dl>
-  <dt><a href="/en-US/docs/WebSockets" title="WebSockets">Web Sockets</a></dt>
-  <dd>Permite crear una conexión permanente entre la página y el servidor e intercambiar datos no HTML a través de ese medio.</dd>
-  <dt><a href="https://developer.mozilla.org/en-US/docs/Server-sent_events/Using_server-sent_events" title="Server-sent_events/Using_server-sent_events">Eventos de servidor enviados</a></dt>
-  <dd>Permite a un servidor "colocar" eventos en un cliente, en lugar del clásico paradigma  donde el servidor podría enviar datos sólo en respuesta a la petición de un cliente.</dd>
-  <dt><a href="/en-US/docs/WebRTC" title="WebRTC">WebRTC</a></dt>
-  <dd>Esta tecnología, donde RTC es sinónimo de comunicación en tiempo real, permite conectar con otras personas y servicio de videoconferencia de control directamente en el navegador, sin necesidad de un plugin o una aplicación externa.</dd>
- </dl>
-
- <h2 id="Sin_Conexión_Y_ALMACENAMIENTO" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3833/HTML5_Offline_Storage_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Sin Conexión Y ALMACENAMIENTO</h2>
-
- <dl>
-  <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/Using_the_application_cache" title="Offline_resources_in_Firefox">Recursos sin conexión: el caché de la aplicación</a></dt>
-  <dd>Firefox es totalmente compatible con la especificación de recursos sin conexión de HTML5. La mayoría de los otros recursos sin conexión tienen soporte en un cierto nivel.</dd>
-  <dt><a href="https://developer.mozilla.org/en-US/docs/Online_and_offline_events" title="Online_and_offline_events">Eventos  con y sin conexión</a></dt>
-  <dd>Firefox 3 soporta WHATWG, eventos con y sin conexión, que permiten a las aplicaciones y extensiones detectar si hay o no una conexión a Internet, así como tambien, detectar cuando la conexión se pierde o se recupera.</dd>
-  <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Storage" title="DOM / Almacenamiento">WHATWG sesión del lado cliente y el almacenamiento continuo (Almacenamiento DOM)</a></dt>
-  <dd>Sesión del lado del cliente y el almacenamiento continuo permite a las aplicaciones web almacenar datos estructurados en el lado del cliente.</dd>
-  <dt><a href="/en-US/docs/IndexedDB" title="IndexedDB">IndexedDB</a></dt>
-  <dd>Es un estándar de Internet para el almacenamiento de grandes cantidades de datos estructurados en el navegador y para las búsquedas de alto rendimiento de estos datos mediante índices.</dd>
-  <dt><a href="https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications" title="Using_files_from_web_applications">Uso de archivos desde aplicaciones web</a></dt>
-  <dd>El soporte para la nueva API de archivos de HTML5 ha sido añadido a Gecko, por lo que es posible que las aplicaciones de Internet accedan a los archivos locales seleccionados por el usuario. Esto incluye el apoyo para la selección de varios archivos utilizando el<span style="line-height: 1.572;"> </span><span style="font-family: monospace; line-height: 1.572;">{{HTMLElement("input")}}</span><span style="line-height: 1.572;"> de </span><strong style="line-height: 1.572;"><a href="/en-US/docs/HTML/Element/Input#attr-type" style="line-height: 1.572;" title="HTML/Element/input#attr-type">tipo</a></strong><span style="line-height: 1.572;"> <em>file</em> </span>del elemento HTML <strong style="line-height: 1.572;"><a href="/en-US/docs/HTML/Element/Input#attr-multiple" style="line-height: 1.572;" title="HTML/Element/input#attr-multiple">múltiple</a>s </strong><span style="line-height: 1.572;">atributos. </span>También esta<span style="line-height: 1.572;"> </span><a href="/en-US/docs/DOM/FileReader" style="line-height: 1.572;" title="DOM/FileReader"><code style="font-size: 14px;">FileReader</code></a><span style="line-height: 1.572;">.</span></dd>
- </dl>
-
- <h2 id="MULTIMEDIA" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3835/HTML5_Multimedia_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">MULTIMEDIA</h2>
-
- <dl>
-  <dt><a href="https://developer.mozilla.org/en-US/docs/Using_HTML5_audio_and_video" title="Using_audio_and_video_in_Firefox">Usando HTML5 de audio y video</a></dt>
-  <dd>Los elementos {{HTMLElement("audio")}} y {{HTMLElement("video")}} permiten la manipulación de nuevos contenidos multimedia.
-  <dl>
-   <dt></dt>
-   <dt><a href="/en-US/docs/WebRTC" title="WebRTC">WebRTC</a></dt>
-   <dd>Esta tecnología, donde RTC es sinónimo de comunicación en tiempo real, permite conectar con otras personas y controlar servicios de videoconferencia directamente en el navegador, sin necesidad de un plugin o una aplicación externa.</dd>
-   <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Using_the_Camera_API" title="DOM / Using_the_Camera_API">Usando la API de la cámara</a></dt>
-   <dd>Permite utilizar, manipular y almacenar una imagen de la cámara del ordenador.</dd>
-   <dt>Track and WebVTT</dt>
-   <dd>El elemento {{HTMLElement("track")}} permite subtítulos y capítulos. <a href="/en-US/docs/HTML/WebVTT" title="HTML/WebVTT">WebVTT</a> <span style="line-height: 1.572;">es un formato de pista de texto.</span></dd>
-  </dl>
-
-  <h2 id="3D_GRAFICOS_EFECTOS" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3841/HTML5_3D_Effects_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">3D, GRAFICOS &amp; EFECTOS</h2>
-
-  <dl>
-   <dt><a href="/en-US/docs/Canvas_tutorial" title="Canvas tutorial">Canvas Tutorial</a></dt>
-   <dd>Conozca el nuevo elemento <span style="font-family: courier new,andale mono,monospace; line-height: normal;">{{HTMLElement("canvas")}}</span>  y cómo dibujar gráficos y otros objetos en Firefox</dd>
-   <dt><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas">API de texto para elementos <code style="font-size: 14px;">&lt;canvas&gt;</code> </a></dt>
-   <dd>El API de texto HTML5 es ahora compatible con elementos {{HTMLElement("canvas")}} .</dd>
-   <dt><a href="/en-US/docs/WebGL" title="WebGL">WebGL</a></dt>
-   <dd>WebGL trae gráficos en 3D para la Web mediante la introducción de una API que se ajusta estrechamente a OpenGL ES 2.0 que se puede utilizar en elementos <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas"><code style="font-size: 14px;">&lt;canvas&gt;</code></a> HTML5  .</dd>
-   <dt><a href="/en-US/docs/SVG" title="SVG">SVG</a></dt>
-   <dd>Un formato basado en XML de imágenes vectoriales que directamente se pueden incrustar en el código HTML.</dd>
-   <dt></dt>
-  </dl>
-  </dd>
- </dl>
- </dd>
-</dl>
-</div>
-
-<div class="section" style="width: 435px;">
-<h2 id="RESULTADOS_e_INTEGRACIÓN" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3831/HTML5_Performance_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">RESULTADOS e INTEGRACIÓN</h2>
-
-<dl>
- <dt><a href="/en-US/docs/DOM/Using_web_workers" title="Using web workers">Web Workers</a></dt>
- <dd>Permite delegar la evaluación JavaScript para subprocesos en segundo plano, lo que evita que estas actividades ralenticen eventos interactivos.</dd>
- <dt><code style="font-size: 14px;"><a href="/en-US/docs/DOM/XMLHttpRequest" title="XMLHttpRequest">XMLHttpRequest</a></code> Nivel 2</dt>
- <dd>Permite buscar de forma asíncrona algunas partes de la página, mostrando contenido dinámico, que varía según el tiempo y las acciones del usuario. Esta es la tecnología detrás de<span style="line-height: 1.572;"> </span><a href="/en-US/docs/AJAX" style="line-height: 1.572;" title="AJAX">Ajax</a><span style="line-height: 1.572;">.</span></dd>
-</dl>
-
-<dl>
- <dt>Motores JIT compilación de JavaScript</dt>
- <dd>La nueva generación de motores de JavaScript son mucho más poderosos, lo que lleva a un mayor rendimiento.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history" title="DOM/Manipulating_the_browser_history">History API</a></dt>
- <dd>Permite la manipulación del historial del navegador. Esto es especialmente útil para la carga interactivamente nueva información en las páginas.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_Editable" title="HTML / contenido editable">El atributo contentEditable: transformar su sitio web en una wiki!</a></dt>
- <dd>HTML5 ha estandarizado el atributo contentEditable. Aprenda más sobre esta opción.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop" title="DragDrop / Drag_and_Drop">Arrastrar y soltar</a></dt>
- <dd>La API de arrastrar y soltar (drag and drop) permite soporte para arrastrar y soltar elementos dentro y entre sitios web. Esto también proporciona una API simple para el uso de extensiones y aplicaciones basadas ​​en Mozilla.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/Focus_management_in_HTML" title="Focus_management_in_HTML">Gestión del foco en HTML</a></dt>
- <dd>Los nuevos atributos HTML5 <code style="font-size: 14px;">activeElement</code> y <code style="font-size: 14px;">hasFocus</code> son soportados.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/Web-based_protocol_handlers" title="Web-based_protocol_handlers">Manejadores de protocolo basados ​​en web</a></dt>
- <dd>Ahora puede registrar las aplicaciones web como controladores de protocolo utilizando el metodo <code style="font-size: 14px;">navigator.registerProtocolHandler()</code>.</dd>
- <dt><a href="/en-US/docs/DOM/window.requestAnimationFrame" title="DOM/window.requestAnimationFrame"><code style="font-size: 14px;">requestAnimationFrame</code></a></dt>
- <dd>Permite controlar la renderización de  animaciones para obtener un óptimo rendimiento.</dd>
- <dt><a href="/en-US/docs/DOM/Using_full-screen_mode" title="DOM/Using_full-screen_mode">Fullscreen API</a></dt>
- <dd>Controla el uso de la pantalla completa de una página Web o aplicación, sin la interfáz de usuario del explorador mostrada.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/API/Pointer_Lock_API" title="API / Pointer_Lock_API">API Pointer Lock</a></dt>
- <dd>Permite bloquear el puntero al contenido, por lo que los juegos y aplicaciones similares no pierden el foco cuando el puntero alcanza el límite de la ventana.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/Online_and_offline_events" title="Online_and_offline_events">Eventos en línea y fuera de línea</a></dt>
- <dd>
- <dl style="margin: 0px 0px 1.286em; padding: 0px;">
-  <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px;">Para construir una buena aplicación web offline-funcional, lo que necesita saber cuando su aplicación esta realmente sin conexión. Dicho sea de paso, también es necesario saber cuando su solicitud sea devuelta a un estado de conexión de nuevo.</dd>
- </dl>
- </dd>
-</dl>
-
-<h2 id="ACCESO_al_dispositivo" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3837/HTML5_Device_Access_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">ACCESO al dispositivo</h2>
-
-<dl>
- <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Using_the_Camera_API" title="DOM / Using_the_Camera_API">Usando la API de la cámara</a></dt>
- <dd>Permite utilizar, manipular y almacenar una imagen de la cámara del ordenador.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Touch_events" title="DOM / Touch_events">Eventos táctiles</a></dt>
- <dd>Manipuladores para reaccionar a los eventos creados por un usuario cuando pulsa pantallas táctiles.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/Using_geolocation" title="El uso de geolocalización">El uso de geolocalización</a></dt>
- <dd>Permite a los navegadores localizar la posición del usuario mediante geolocalización.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/Detecting_device_orientation" title="Detecting_device_orientation">Detección de la orientación del dispositivo</a></dt>
- <dd>Obtiene la información cuando el dispositivo en el que se ejecuta el navegador, cambia de orientación. Esto puede ser utilizado como un dispositivo de entrada (por ejemplo, para hacer que los juegos que reaccionan a la posición del dispositivo) o adaptar el diseño de una página a la orientación de la pantalla (vertical u horizontal).</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/API/Pointer_Lock_API" title="API / Pointer_Lock_API">API Pointer Lock</a></dt>
- <dd>Permite bloquear el puntero al contenido, por lo que los juegos y aplicaciones similares no pierden el foco cuando el puntero alcanza el límite de la ventana.</dd>
-</dl>
-
-<h2 id="CSS3_STYLING" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3829/HTML5_Styling_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">CSS3 STYLING</h2>
-
-<p><a href="/en-US/docs/CSS" title="CSS">CSS </a> <font>se ha ampliado para ser capaz de menajar elementos de estilo de una manera mucho más compleja. </font><font>Esto se refiere a menudo como</font> <a href="/en-US/docs/CSS/CSS3" title="CSS/CSS3">CSS3</a>,  <span style="line-height: 21px;">aunque CSS no es una especificación monolítica más y los diferentes módulos no están todos en el nivel 3: algunos están en el nivel 1 y otros en el nivel 4, con todos los niveles intermedios cubiertos.</span></p>
-
-<dl>
- <dt>Nuevas características de diseño de fondo</dt>
- <dd>Ahora es posible poner una sombra a un cuadro, con <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow"><code style="font-size: 14px;">box-shadow</code></a> y <a href="https://developer.mozilla.org/en-US/docs/CSS/Multiple_backgrounds" title="CSS / Multiple_backgrounds">varios fondos</a> se pueden ajustar.</dd>
-</dl>
-
-<dl>
- <dt>Bordes mas "lujosos"</dt>
- <dd>Ahora no sólo es posible utilizar las imágenes con los estilos de bordes, utilizando {{cssxref("border-image")}} y asociando sus propiedades asociadas a <span style="line-height: 1.572;">longhand</span><span style="line-height: 1.572;">, </span>aunque los bordes redondeados son apoyados a través de propiedades <span style="line-height: 1.572;">{{cssxref("border-radius")}} .</span></dd>
- <dt>Animación de su estilo</dt>
- <dd>Utilizando <a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_transitions" title="CSS / Using_CSS_transitions">Transiciones CSS</a> para animar entre los diferentes estados o utilizando <a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations" title="CSS / Using_CSS_animations">animaciones CSS</a> para animar partes de la página, sin que el evento se dispare, ahora puede controlar los elementos móviles en su página.</dd>
- <dt>Tipografía mejorada</dt>
- <dd>Los autores tienen un mejor control para usar la tipografía. Se puede controlar <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow"><code style="font-size: 14px;">el texto </code></a>{{cssxref("text-overflow")}} y <a href="https://developer.mozilla.org/en-US/docs/CSS/hyphens" title="CSS / guiones">guiones</a> y también puede poner una<a href="https://developer.mozilla.org/en-US/docs/CSS/text-shadow" title="CSS / text-shadow"> sombra</a>  o controlar con mayor precisión sus <a href="https://developer.mozilla.org/en-US/docs/CSS/text-decoration" title="SVG / atributo / text-decoration">decoraciones</a> . Los tipos de letra personalizados se pueden descargar y aplicar gracias a la nueva regla <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face"><code style="font-size: 14px;">@font-face</code></a> .</dd>
- <dt>Nuevos diseños de presentación</dt>
- <dd>Con el fin de mejorar la flexibilidad de los diseños, se han añadido dos nuevos diseños: el <a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_multi-column_layouts" title="CSS / Using_CSS_multi-column_layouts">CSS diseño de varias columnas</a> , y el <a href="https://developer.mozilla.org/en-US/docs/CSS/Flexbox" title="CSS / Flexbox">cuadro de distribución flexible de CSS</a> .</dd>
-</dl>
-</div>
-</div>
diff --git a/files/es/html/html5/introducción_a_html5/index.html b/files/es/html/html5/introducción_a_html5/index.html
deleted file mode 100644
index 091a90f7af..0000000000
--- a/files/es/html/html5/introducción_a_html5/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
----
-title: Introducción a HTML5
-slug: HTML/HTML5/Introducción_a_HTML5
-tags:
-  - HTML
-  - HTML5
-translation_of: Web/Guide/HTML/HTML5/Introduction_to_HTML5
----
-<p><br>
- <span lang="es-ES"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/" title="http://www.whatwg.org/specs/web-apps/current-work/">HTML5</a>, algunas de cuyas características inicialmente comenzaron a llegar a Gecko 1.8.1, es la versión más reciente de HTML estándar.</span> <span lang="es-ES">Ofrece nuevas características que proporcionan no solo una amplia compatibilidad de medios, sino también una compatibilidad mejorada para la creación de aplicaciones web que pueden interactuar de una manera más sencilla y efectiva con el usuario, sus datos locales y los servidores.</span></p>
-<p><span lang="es-ES">Al estar HTML5 aún en la fase de diseño, son inevitables los cambios en las especificaciones.</span> <span lang="es-ES">Debido a esto, algunos navegadores no admiten aún determinadas características.</span> <span lang="es-ES">Sin embargo, Gecko (y por extensión, Firefox) tiene una compatibilidad inicial muy buena para HTML5 y se continúa trabajando para que sea compatible con cada vez más características.</span> <span lang="es-ES">Puedes encontrar una lista de las características de HTML5 que admite Gecko en la <a href="/es/HTML/HTML5" title="es/HTML/HTML5">página principal de HTML5</a>.</span></p>
-<h2 id="El_tipo_de_documento_HTML5">El tipo de documento HTML5</h2>
-<p><span lang="es-ES">El tipo de documento para HTML5 es muy sencillo.</span> <span lang="es-ES">Para indicar que el contenido de tu HTML usa HTML5, simplemente utiliza:</span></p>
-<pre lang="es-ES" style="margin-bottom: 0.5cm;">&lt;!DOCTYPE html&gt;</pre>
-<p lang="es-ES">Este tipo de documento tan sencillo hará que incluso aquellos navegadores que no admiten actualmente HTML5 entren en modo estándar, lo que significa que interpretarán conforme a HTML5 las partes establecidas hace tiempo, al ignorar las nuevas características de HTML5 que no admiten.</p>
-<p lang="es-ES">{{ languages( { "en": "en/HTML/HTML5/Introduction_to_HTML5" } ) }}</p>
diff --git a/files/es/html/html5/validacion_de_restricciones/index.html b/files/es/html/html5/validacion_de_restricciones/index.html
deleted file mode 100644
index 04182a8fec..0000000000
--- a/files/es/html/html5/validacion_de_restricciones/index.html
+++ /dev/null
@@ -1,345 +0,0 @@
----
-title: Validación de restricciones
-slug: HTML/HTML5/Validacion_de_restricciones
-tags:
-  - CSS
-  - Guía
-  - HTML5
-  - NecesitaContenido
-  - Selectores
-translation_of: Web/Guide/HTML/HTML5/Constraint_validation
----
-<p>La creación de formularios web siempre ha sido una tarea compleja. Mientras armar el formulario en sí es fácil, verificar si cada campo tiene un valor que es válido y coherente es aun más difícil, e informar al usuario acerca del problema puede convertirse en un dolor de cabeza.<a href="/es/docs/HTML/HTML5" title="en/HTML/HTML5"> HTML5</a> introdujo nuevos mecanismos para formularios: añadió nuevos tipos semánticos para el elemento {{ HTMLElement("input") }} y <em>validación de restricciones</em> para facilitar el trabajo de revisar el contenido del formulario de lado del cliente. Se pueden usar restricciones básicas y comunes, sin la necesidad de JavaScript, estableciendo nuevos atributos; para restricciones más complejas se puede usar la <a href="/es/docs/HTML/HTML5/Formularios_en_HTML5#Validaci.C3.B3n_restringida" title="en/HTML/HTML5/Forms in HTML5#Constraint Validation API">API de Validación de Restricciones</a> de HTML.</p>
-
-<div class="note"><strong>Nota:</strong> La validación de restricciones de HTML5 no elimina la necesidad de hacer validaciones <em>de lado del servidor</em>. Aunque se esperen menos envíos con formularios inválidos, sí se pueden seguir recibiendo datos inválidos, en navegadores sin soporte (por ejemplo, navegadores sin HTML y sin JavaScript) o por chicos malos que traten de burlar las restricciones de la aplicación. Por lo tanto, como en HTML4, también tendrás que validar las restricciones de captura del lado del servidor, de modo que sea consistente con las que se hacen del lado del cliente.</div>
-
-<h2 id="Restricciones_intrínsecas_y_básicas">Restricciones intrínsecas y básicas</h2>
-
-<p>En HTML5, las restricciones básicas son declaradas de dos formas:</p>
-
-<ul>
- <li>Eligiendo el valor semánticamente más apropiado para el atributo {{ htmlattrxref("type", "input") }} del elemento {{ HTMLElement("input") }}, por ejemplo, elegir el tipo <span style="font-family: courier new;">email</span> creará automáticamente la restricción para verificar que el valor sea una dirección de correo electrónico válida.</li>
- <li>Estableciendo valores a los atributos de validación, permitiendo que se describan restricciones básicas de manera simple, sin la necesidad de JavaScript.</li>
-</ul>
-
-<h3 id="Tipos_de_captura_semánticos">Tipos de captura semánticos</h3>
-
-<p>Las restricciones intrínsecas para el atributo {{ htmlattrxref("type", "input") }} son:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Tipo de input</th>
-   <th scope="col">Descripción</th>
-   <th scope="col">Incumplimiento asociado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><span style="font-family: courier new;">&lt;input type="URL"&gt;</span></td>
-   <td>El valor debe ser una URL absoluta, es decir, una de las siguientes:
-    <ul>
-     <li>una URI válida (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3986.txt" title="http://www.ietf.org/rfc/rfc3986.txt">RFC 3986</a>)</li>
-     <li>una IRI válida, sin un componente de query (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li>
-     <li>una IRI válida, con componente de query sin caracteres no ASCII sin escapar (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li>
-     <li>una IRI válida, y que el conjunto de caracteres para el documento sea UTF-8 o UTF-16 (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li>
-    </ul>
-   </td>
-   <td>Incumplimiento de restricción por <strong>tipo no coincidente (Type mismatch)</strong></td>
-  </tr>
-  <tr>
-   <td> <span style="font-family: courier new;">&lt;input type="email"&gt;</span></td>
-   <td>El valor debe obedecer a la producción <a class="external" href="http://www.ietf.org/rfc/std/std68.txt" title="http://www.ietf.org/rfc/std/std68.txt">ABNF</a>: <code>1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )</code> donde:
-    <ul>
-     <li><code>atext</code> está definido en  <a class="external" href="http://tools.ietf.org/html/rfc5322" title="http://tools.ietf.org/html/rfc5322">RFC 5322</a>, y representa una letra US-ASCII (<span style="font-family: courier new;">A</span>-<span style="font-family: courier new;">Z</span> y <span style="font-family: courier new;">a</span>-<span style="font-family: courier new;">z</span>), un dígito (<span style="font-family: courier new;">0</span>-<span style="font-family: courier new;">9</span>) o uno de los siguientes caracteres especiales: <span style="font-family: courier new;">! # $ % &amp; ' * + - / = ? ` { } | ~</span>,</li>
-     <li><code>ldh-str</code> está definido en <a class="external" href="http://www.apps.ietf.org/rfc/rfc1034.html#sec-3.5" title="http://www.apps.ietf.org/rfc/rfc1034.html#sec-3.5">RFC 1034</a>, y representa letras US-ASCII, combinadas con dígitos y el símbolo <span style="font-family: courier new;">-</span> agrupados en palabras separadas por un punto (<span style="font-family: courier new;">.</span>).</li>
-    </ul>
-
-    <div class="note"><strong>Nota:</strong> si se estableció el atributo {{ htmlattrxref("multiple", "input") }}, se pueden definir distintas direcciones de correo, separadas por coma, para este control. Si cualquiera de ellas no satisface la condición descrita aquí, se ejecuta el incumplimiento de restricción por <strong>tipo no coincidente</strong>.</div>
-   </td>
-   <td>Incumplimiento de restricción por <strong>tipo no coincidente (Type mismatch)</strong></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Nótese que la mayoría de los tipos de input no tienen restricciones intrínsecas, puesto que algunos simplemente son excluidos de la validación de restricciones, o tienen un algoritmo de sanitización que transforma los valores incorrectos a uno valor correcto predeterminado. </p>
-
-<h3 id="Atributos_relacionados_con_validaciones">Atributos relacionados con validaciones</h3>
-
-<p>Los siguientes atributos son usados para describir restricciones básicas:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Atributo</th>
-   <th scope="col">Tipos de input que soportan el atributo</th>
-   <th scope="col">Valores posibles</th>
-   <th scope="col">Descripción</th>
-   <th scope="col">Incumplimiento asociado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{ htmlattrxref("pattern", "input") }}</td>
-   <td>text, search, url, tel, email, password</td>
-   <td>Una expresión regular de JavaScript (compilada con las banderas <code title="">global</code>, <code title="">ignoreCase</code>, y <code title="">multiline</code> de ECMAScript 5 <em>desabilitadas</em>)</td>
-   <td>El valor debe coincidir con el patrón.</td>
-   <td>Incumplimiento de restricción por <strong>incompatibilidad de patrones (Pattern mismatch)</strong></td>
-  </tr>
-  <tr>
-   <td rowspan="3">{{ htmlattrxref("min", "input") }}</td>
-   <td>range, number</td>
-   <td>Un número válido</td>
-   <td rowspan="3">El valor debe ser mayor o igual al de este atributo.</td>
-   <td rowspan="3">Incumplimiento de restricción por <strong>flujo insuficiente (Underflow)</strong></td>
-  </tr>
-  <tr>
-   <td>date, month, week</td>
-   <td>Una fecha válida</td>
-  </tr>
-  <tr>
-   <td>datetime, datetime-local, time</td>
-   <td>Una fecha y hora válidos</td>
-  </tr>
-  <tr>
-   <td rowspan="3">{{ htmlattrxref("max", "input") }}</td>
-   <td>range, number</td>
-   <td>Un número válido</td>
-   <td rowspan="3">El valor debe ser menor o igual al de este atributo</td>
-   <td rowspan="3">Incumplimiento de restricción por <strong>desborde (Overflow)</strong></td>
-  </tr>
-  <tr>
-   <td>date, month, week</td>
-   <td>Una fecha válida</td>
-  </tr>
-  <tr>
-   <td>datetime, datetime-local, time</td>
-   <td>Una fecha y hora válidos</td>
-  </tr>
-  <tr>
-   <td>{{ htmlattrxref("required", "input") }}</td>
-   <td>text, search, url, tel, email, password, date, datetime, datetime-local, month, week, time, number, checkbox, radio, file; también en los elementos {{ HTMLElement("select") }} y {{ HTMLElement("textarea") }}</td>
-   <td><em>ninguno</em>, pues éste es un atributo de tipo Boolean: su presencia representa <em>true</em>, y su ausencia representa <em>false</em></td>
-   <td>Debe tener un valor (si se establece).</td>
-   <td>Incumplimiento de restricción por<strong> ausencia (Missing)</strong></td>
-  </tr>
-  <tr>
-   <td rowspan="5">{{ htmlattrxref("step", "input") }}</td>
-   <td>date</td>
-   <td>Un número entero de días</td>
-   <td rowspan="5">A menos que se establezca el atributo con la literal <span style="font-family: courier new;">any</span>, el valor debe ser <strong>min</strong> + un enter múltiplo del valor de este atributo.</td>
-   <td rowspan="5">Incumplimiento de restricción por<strong> inconsistencia de paso (Step mismatch)</strong></td>
-  </tr>
-  <tr>
-   <td>month</td>
-   <td>Un número entero de meses</td>
-  </tr>
-  <tr>
-   <td>week</td>
-   <td>Un número entero de semanas</td>
-  </tr>
-  <tr>
-   <td>datetime, datetime-local, time</td>
-   <td>Un número entero de segundos</td>
-  </tr>
-  <tr>
-   <td>range, number</td>
-   <td>Un entero</td>
-  </tr>
-  <tr>
-   <td>{{ htmlattrxref("maxlength", "input") }}</td>
-   <td>text, search, url, tel, email, password; también en el elemento {{ HTMLElement("textarea") }}</td>
-   <td>Una longitud en enteros</td>
-   <td>El número de caracteres (puntos de código) no debe exceder el valor del atributo.</td>
-   <td>Incumplimiento de restricción por ser<strong> muy largo (Too long)</strong></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Proceso_de_validación_de_restricciones"><span class="author-g-by4vjwmiwjiydpj7">Proceso de validación de restricciones</span></h2>
-
-<p>La validación de restricciones se hace a través de la API de Validación de Restricciones, ya sea en un elemento de formulario individual o a nivel de formulario, en el elemento {{ HTMLElement("form") }} mismo. La validación de restricciones se hace de las siguientes maneras:</p>
-
-<ul>
- <li>Invocando a la función <code>checkValidity()</code> de una interfaz <a href="/es/docs/DOM" title="en/DOM">DOM</a> relacionada con formas (<code><a href="/es/docs/Web/API/HTMLInputElement" title="en/DOM/HTMLInputElement">HTMLInputElement</a></code>, <code><a href="/es/docs/Web/API/HTMLSelectElement" title="en/DOM/HTMLSelectElement">HTMLSelectElement</a></code>, <code><a href="/es/docs/Web/API/HTMLButtonElement" title="en/DOM/HTMLButtonElement">HTMLButtonElement</a></code> o <code><a href="/es/docs/Web/API/HTMLTextAreaElement" title="en/DOM/HTMLTextAreaElement">HTMLTextAreaElement</a></code>), la cual evalúa las restricciones para este elemento únicamente, permitiendo que un script obtenga esta información. (Esto lo hace comúnmente el agente usuario cuando determina cuál de las pseudo-clases <a href="/es/docs/Web/CSS" title="en/CSS">CSS</a>, {{ Cssxref(":valid") }} o {{ Cssxref(":invalid") }}, se aplicará.)</li>
- <li>Invocando a la función <code>checkValidity()</code> en la interfaz <code><a href="/es/docs/Web/API/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a></code>, llamada <em>validación estática de restricciones</em>.</li>
- <li>Enviando el formulario en sí, llamado <em>validación interactiva de restricciones</em>.</li>
-</ul>
-
-<div class="note"><strong>Nota: </strong>
-
-<ul>
- <li>Si se establece el atributo {{ htmlattrxref("novalidate", "form") }} en el elemento {{ HTMLElement("form") }}, la validación interactiva de las restricciones no se aplica.</li>
- <li>Invocando al método <code>send()</code> en la interfaz <a href="/es/docs/Web/API/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a> no invoca a la validación de restricciones. en otras palabras, este método envía los datos del formulario al servidor aunque no se satisfagan las restricciones.</li>
-</ul>
-</div>
-
-<h2 id="Restricciones_complejas_usando_la_API_de_Restricciones_de_HTML5"><span class="author-g-by4vjwmiwjiydpj7">Restricciones complejas usando la API de Restricciones de HTML5</span></h2>
-
-<p><span class="author-g-by4vjwmiwjiydpj7">Usando JavaScript y la API de Restricciones, es posible implementar restricciones más complejas, por ejemplo, restricciones que combinen varios campos, o que involucren cálculos complejos.</span></p>
-
-<p><span class="author-g-by4vjwmiwjiydpj7">Básicamente, la idea es ejecutar JavaScript en un evento de algún campo del formulario (como <strong>onchange</strong>) para calcular si la restricción no se cumple, y entonces usar el método <code><em>field</em>.setCustomValidity()</code> para establecer el resultado de la validación: una cadena vacía significa que la restricción se satisfizo, y cualquier otro texto significa que hay un error, siendo el texto el mensaje que se mostrará al usuario.</span></p>
-
-<h3 id="Restricciones_que_combinan_varios_campos_Validación_de_código_postal">Restricciones que combinan varios campos: Validación de código postal</h3>
-
-<p>El formato de código postal varía de un país a otro. No sólo la mayoría de los países permiten un prefijo opcional con el código del país (como <code>D-</code> en Alemania, <code>F-</code> en Francia o Suiza), sino que algunos países tienen códigos postales con solamente un número fijo de dígitos; otros, como el Reino Unido, tienen estructuras más complejas, permitiendo letras en posiciones específicas.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Esto no es una guía completa para una biblioteca de validación de código postal, sino más bien una demostración de conceptos clave.</p>
-</div>
-
-<p><span style="line-height: 1.5;">Como un ejemplo, añadiremos un script que verificará la validación de restricciones en este formulario simple:</span></p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-    &lt;label for="ZIP"&gt;Código postal : &lt;/label&gt;
-    &lt;input type="text" id="ZIP"&gt;
-    &lt;label for="Country"&gt;País : &lt;/label&gt;
-    &lt;select id="Country"&gt;
-      &lt;option value="ch"&gt;Suiza&lt;/option&gt;
-      &lt;option value="fr"&gt;Francia&lt;/option&gt;
-      &lt;option value="de"&gt;Alemania&lt;/option&gt;
-      &lt;option value="nl"&gt;Países Bajos&lt;/option&gt;
-    &lt;/select&gt;
-    &lt;input type="submit" value="Validar"&gt;
-&lt;/form&gt;</pre>
-
-<p>Esto mostrará el siguiente formulario: </p>
-
-<p><label>Código Postal : </label><input> <label>Country: </label><select><option value="ch">Suiza</option><option value="fr">Francia</option><option value="de">Alemania</option><option value="nl">Países Bajos</option></select></p>
-
-<p>Primero, escribimos una función que revisará las restricciones en sí:</p>
-
-<pre class="brush: js notranslate">function checkZIP() {
-  // Para cada país, se define el patrón para el código postal
-  var constraints = {
-    ch : [ '^(CH-)?\\d{4}$', "El código postal de Suiza debe tener cuatro dígitos: p.ej. CH-1950 o 1950" ],
-    fr : [ '^(F-)?\\d{5}$' , "El código postal de Francia debe tener cinco dígitos: p.ej. F-75012 o 75012" ],
-    de : [ '^(D-)?\\d{5}$' , "El código postal de Alemania debe tener cinco dígitos: p-ej. D-12345 o 12345" ],
-    nl : [ '^(NL-)?\\d{4}\\s*([A-RT-Z][A-Z]|S[BCE-RT-Z])$',
-                    "El código postal de Países Bajos debe tener cuatro dígitos, seguidos de dos letras excepto SA, SD y SS" ]
-  };
-
-  // Se lee el ID del país
-  var country = document.getElementById("Country").value;
-
-  // Se obtiene el campo del código postal
-  var ZIPField = document.getElementById("ZIP");
-
-  // Se crea el validador de la restricción
-  var constraint = new RegExp(constraints[country][0], "");
-    console.log(constraint);
-
-
-  // ¡Se hace la revisión!
-  if (constraint.test(ZIPField.value)) {
-    // El código postal cumple la restricción, usamos la API de Restricciones para indicarlo
-    ZIPField.setCustomValidity("");
-  }
-  else {
-    // El código postal no cumple la restricción, usamos la API de Restricciones para
-    // dar un mensaje sobre el formato requerido para este país
-    ZIPField.setCustomValidity(constraints[country][1]);
-  }
-}
-</pre>
-
-<p>Entonces, enlazamos este código al evento <strong>onchange</strong> del elemento {{ HTMLElement("select") }} y al evento <strong>oninput</strong> del elemento {{ HTMLElement("input") }}:</p>
-
-<pre class="brush: js notranslate">window.onload = function () {
-    document.getElementById("Country").onchange = checkZIP;
-    document.getElementById("ZIP").oninput = checkZIP;
-}</pre>
-
-<p>Puedes ver <a href="/@api/deki/files/4744/=constraint.html" title="https://developer.mozilla.org/@api/deki/files/4744/=constraint.html">aquí un ejemplo en vivo</a> de la validación de código postal.</p>
-
-<h3 id="Limitando_el_tamaño_de_un_archivo_antes_de_ser_subido">Limitando el tamaño de un archivo antes de ser subido</h3>
-
-<p>Otra restricción común es limitar el tamaño de un archivo que será subido. Verificar esto de lado del cliente antes de que el archivo sea transmitido al servidor requiere combinar la API de Validación de Restricciones, y especialmente la función field.setCustomValidity(), con otra API de JavaScript, la File API.</p>
-
-<p>Aquí está la parte de HTML:</p>
-
-<pre class="brush: html notranslate">&lt;label for="FS"&gt;Selecciona un archivo menor a 75KB : &lt;/label&gt;
-&lt;input type="file" id="FS"&gt;</pre>
-
-<p>Esto muestra lo siguiente:</p>
-
-<p><label>Seleciona un archivo menor a 75KB : </label> <input></p>
-
-
-
-<p>Con JavaScript, leemos el archivo seleccionado, usamos el método File.size() para obtener su tamaño, lo comparamos con el límite fijo (hard coded), y llamamos a la API de Validación de Restricciones para informar al navegador si no se cumple la restricción:</p>
-
-<pre class="brush: js notranslate">function checkFileSize() {
-  var FS = document.getElementById("FS");
-  var files = FS.files;
-
-  // Si hay (por lo menos) un archivo seleccionado
-  if (files.length &gt; 0) {
-     if (files[0].size &gt; 75 * 1024) { // Validar la restricción
-       FS.setCustomValidity("El archivo seleccionado no debe ser mayor a 75KB");
-       return;
-     }
-  }
-  // No hay incumplimiento de la restricción
-  FS.setCustomValidity("");
-}</pre>
-
-
-
-<p>Finalmente, anclamos el método al evento requerido:</p>
-
-<pre class="brush: js notranslate">window.onload = function () {
-  document.getElementById("FS").onchange = checkFileSize;
-}</pre>
-
-<p>Puedes ver <a href="/@api/deki/files/4745/=fileconstraint.html" title="https://developer.mozilla.org/@api/deki/files/4745/=fileconstraint.html">aquí un ejemplo en vivo</a> de la validación de tamaño de archivos.</p>
-
-<h2 id="Estilos_visuales_de_validación_de_restricciones"><span class="author-g-by4vjwmiwjiydpj7">Estilos visuales de validación de restricciones</span></h2>
-
-<p>Aparte de establecer las restricciones, los desarrolladores web querrán controlar los mensajes que son desplegados al usuario y los estilos de los mismos.</p>
-
-<h3 id="Controlando_el_aspecto_de_los_elementos">Controlando el aspecto de los elementos</h3>
-
-<p>El aspecto de los elementos puede ser controlado por medio de pseudo-clases de CSS.</p>
-
-<h4 id="Pseudo-clases_required_y_optional">Pseudo-clases :required y :optional</h4>
-
-<p>Las <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudo-clases</a> <a href="/en-US/docs/Web/CSS/:required" title=":required"><code>:required</code></a> y <a href="/en-US/docs/Web/CSS/:optional" title=":optional"><code>:optional</code></a> permitene escribir selectores que coincidan con elementos de formulario que tengan el atributo {{ htmlattrxref("required") }} y los que no lo tengan, respectivamente.</p>
-
-<h4 id="Pseudo-clase_-moz-placeholder">Pseudo-clase :-moz-placeholder</h4>
-
-<p>Véase <a href="/es/docs/Web/CSS/::placeholder" title="/en-US/docs/Web/CSS/:-moz-placeholder">::placeholder</a> (experimental).</p>
-
-<h4 id="Pseudo-clases_valid_invalid">Pseudo-clases :valid :invalid</h4>
-
-<p>Las <a href="/es/docs/Web/CSS/Pseudo-classes" title="/en-US/docs/Web/CSS/Pseudo-classes?redirectlocale=en-US&amp;redirectslug=CSS%2FPseudo-classes">pseudo-clases</a> <a href="/en-US/docs/Web/CSS/:valid" title="/en-US/docs/Web/CSS/:valid">:valid</a> e <a href="/en-US/docs/Web/CSS/:invalid" title="/en-US/docs/Web/CSS/:invalid?redirectlocale=en-US&amp;redirectslug=CSS%2F%3Ainvalid">:invalid</a> son usadas para representar elementos &lt;input&gt; cuyo contenido es válido o inválido, respectivamente, acorde a las configuraciones de captura. Estas clases permiten al usuario estilizar elementos de formulario válidos e inválidos, para hacer más fácil el identificar elementos que tienen valores correctos o incorrectos.</p>
-
-<h4 id="Estilos_predeterminados">Estilos predeterminados</h4>
-
-<h3 id="Controlando_el_texto_de_incumplimiento_de_restricciones">Controlando el texto de incumplimiento de restricciones</h3>
-
-<h4 id="El_atributo_x-moz-errormessage">El atributo x-moz-errormessage</h4>
-
-<p>El atributo x-moz-errormessage es una extensión de Mozilla que te permite especificar el mensaje de error que se mostrará cuando un campo no es validado exitosamente.</p>
-
-<div class="note">
-<p style="margin-left: 40px;">Nota: Esta extensión no es estándar.</p>
-</div>
-
-<h4 id="element.setCustomValidity_de_la_API_de_Validación_de_Restricciones">element.setCustomValidity() de la API de Validación de Restricciones</h4>
-
-<p>El método element.setCustomValidity(error) es usado para establecer un mensaje de error personalizado para mostrar cuando el formulario es enviado. El método toma una cadena de texto como parámetro con el error. Si el error es una cadena no vacía, el método asume que la validación no fue exitosa, y despliega el mensaje con el error indicado. Si el error es una cadena vacía, el elemento es considerado válido, y restablece el mensaje de error.</p>
-
-<h4 id="Objeto_ValidityState_de_la_API_de_Validación_de_Restricciones"><span class="author-g-by4vjwmiwjiydpj7">Objeto ValidityState</span> de la API de Validación de Restricciones</h4>
-
-<p>La interfaz de DOM <code><a href="/es/docs/Web/API/ValidityState">ValidityState</a></code><a href="/es/docs/Web/API/ValidityState"> </a>representa los <em>estados de validez</em> en los que puede estar un elemento, respecto a la validación de restricciones. En conjunto, ayudan a explicar por qué el valor de un elemento falló en la validación, si no es válido.</p>
-
-<h3 id="Examples_of_personalized_styling"><span class="author-g-by4vjwmiwjiydpj7">Examples of personalized styling</span></h3>
-
-<h3 id="HTML4_fallback"><span class="author-g-by4vjwmiwjiydpj7">HTML4 fallback</span></h3>
-
-<h4 id="Trivial_fallback"><span class="author-g-by4vjwmiwjiydpj7">Trivial fallback</span></h4>
-
-<h4 id="JS_fallback"><span class="author-g-by4vjwmiwjiydpj7">JS fallback</span></h4>
-
-<h2 id="Conclusión"><span class="author-g-by4vjwmiwjiydpj7">Conclusión</span></h2>
diff --git a/files/es/incrustando_mozilla/comunidad/index.html b/files/es/incrustando_mozilla/comunidad/index.html
deleted file mode 100644
index 70853c59a3..0000000000
--- a/files/es/incrustando_mozilla/comunidad/index.html
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: Comunidad
-slug: Incrustando_Mozilla/Comunidad
----
-<p>este comentario considero esta fuera dl tema pero queria saber  si hay proceso para instala firefox os en iphone</p>
-
-<p> </p>
diff --git a/files/es/indexeddb/index.html b/files/es/indexeddb/index.html
deleted file mode 100644
index 91e216833a..0000000000
--- a/files/es/indexeddb/index.html
+++ /dev/null
@@ -1,145 +0,0 @@
----
-title: IndexedDB
-slug: IndexedDB
-tags:
-  - páginas_a_traducir
----
-<p>{{ SeeCompatTable() }}</p>
-
-<p>IndexedDB es una API del lado del cliente, para el almacenamiento de grandes cantidades de datos estructurados y para búsquedas de alto rendimiento en esos datos, usando índices. Mientras <a href="/en-US/docs/DOM/Storage" title="en-US/docs/DOM/Storage">DOM Storage</a> es útil para el almacenamiento de pequeñas cantidades de datos, no es útil para almacenar grandes cantidades de datos estructurados. IndexedDB proporciona una solución.</p>
-
-<p>Esta página es básicamente el punto de entrada para la descripción técnica de los objetos de la API. Si necesita algo elemental, debería consultar ;<a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB" title="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB">Conceptos básicos acerca de IndexedDB</a>. Para más detalles, vea <a href="https://developer.mozilla.org/en-US/docs/IndexedDB/Using_IndexedDB" title="https://developer.mozilla.org/en-US/docs/IndexedDB/Using_IndexedDB">Usando IndexedDB</a>.</p>
-
-<p>IndexedDB provee APIs separados para un acceso síncrono o asíncrono. El API síncrono está destinado a ser usado únicamente dentro de <a href="/en-US/docs/DOM/Worker" title="Worker">Web Workers</a>, pero no será implementado aún por cualquier navegador. El API asíncrono trabaja con o sin Web Workers.</p>
-
-<h2 id="API_Asíncrono">API Asíncrono</h2>
-
-<p>Los métodos del API Asíncrono, retornan sin bloquear el hilo de llamada. Para obtener un acceso asíncrono a la base de datos, use <code><a href="/en-US/docs/IndexedDB/IDBFactory#open" title="en-US/docs/IndexedDB/IDBFactory#open">open</a></code>() en el atributo <code><a href="/en-US/docs/IndexedDB/IDBEnvironment#attr_indexedDB" title="en-US/docs/IndexedDB/IDBEnvironment#attr indexedDB">indexedDB</a></code> de un objeto <a href="/en-US/docs/DOM/window" title="en-US/docs/DOM/window">window</a>. Este método retorna un objeto IDBRequest (IDBOpenDBRequest); operaciones asíncronas se comunicarán con la aplicación que llama, disparando eventos en los objetos IDBRequest.</p>
-
-<div class="note">
-<p>Nota: El objeto <code>indexedDB</code> se prefija en las versiones antiguas de los navegadores (propiedad <code>mozIndexedDB</code> para Gecko &lt; 16, <code>webkitIndexedDB</code> en Chrome, y <code>msIndexedDB</code> en IE 10).</p>
-</div>
-
-<ul>
- <li><a href="/en-US/docs/IndexedDB/IDBFactory" title="en-US/docs/IndexedDB/IDBFactory"><code>IDBFactory</code></a> provee acceso a la base de datos. Esta es la interface implementada por el objeto global <code>indexedDB</code> y es el punto de entrada para la API.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBCursor" title="en-US/docs/IndexedDB/IDBCursor"><code>IDBCursor</code></a> itera sobre los objetos de almacenamiento y de índices.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBCursorWithValue"><code>IDBCursorWithValue</code></a> itera sobre los objetos de almacenamiento y de índices y retorna el valor actual del cursor.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBDatabase" title="en-US/docs/IndexedDB/IDBDatabase"><code>IDBDatabase</code></a> representa una conexión a la base de datos. Es la única manera de realizar una transacción en la base de datos.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBEnvironment" title="en-US/docs/IndexedDB/IDBEnvironment"><code>IDBEnvironment</code></a> provee acceso a la base de datos, desde el lado del cliente. Está implementada por el objeto <a href="/../en-US/docs/DOM/window" rel="internal" title="../en-US/docs/DOM/window">window</a>.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBIndex" title="en-US/docs/IndexedDB/IDBIndex"><code>IDBIndex</code></a> provee acceso a la metadata de un índice.</li>
- <li><code><a href="/en-US/docs/IndexedDB/IDBKeyRange" title="en-US/docs/IndexedDB/KeyRange">IDBKeyRange</a></code> define un rango de claves.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBObjectStore" title="en-US/docs/IndexedDB/IDBObjectStore"><code>IDBObjectStore</code></a> representa un objeto de almacenamiento.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="en-US/docs/IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> representa un requerimiento para abrir una base de datos.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBRequest" title="en-US/docs/IndexedDB/IDBRequest"><code>IDBRequest</code></a> provee acceso a los resultados de los requerimientos asíncronos a la base de datos y a los objetos database. Es lo que se obtiene cuando se llama a un método asíncrono.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBTransaction" title="en-US/docs/IndexedDB/IDBTransaction"><code>IDBTransaction</code></a> representa una transacción. Cuando Ud. crea una transacción en la base de datos, especifica el alcance (como a que objetos store desea tener acceso), y determina la clase de acceso (sólo lectura o escritura) que desea tener.</li>
- <li><a href="/en-US/docs/IndexedDB/IDBVersionChangeEvent" title="IDBVersionChangeEvent"><code>IDBVersionChangeEvent</code></a> indica que la versión de la base de datos ha cambiado.</li>
-</ul>
-
-<p>Una versión anterior de la especificación también define estas -ahora removidas- interfaces. Éstas son documentadas todavía, en caso de que necesite actualizar código escrito previamente:</p>
-
-<ul>
- <li><code><a href="/en-US/docs/IndexedDB/IDBVersionChangeRequest" title="https://developer.mozilla.org/en-US/docs/IndexedDB/IDBVersionChangeRequest">IDBVersionChangeRequest</a></code> representa una solicitud para cambiar la versión de una base de datos. La manera de cambiar la versión de la base de datos ahora es diferente (llamando <a href="/en-US/docs/IndexedDB/IDBFactory#open" title="en-US/docs/IndexedDB/IDBFactory#open"><code>IDBFactory.open()</code></a> sin llamar también a <a href="/en-US/docs/IndexedDB/IDBDatabase#setVersion()" title="en-US/docs/IndexedDB/IDBDatabase#setVersion()"><code>IDBDatabase.setVersion()</code></a>), y la interfaz <a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="en-US/docs/IndexedDB/IDBOpenDBRequest"><code>IDBOpenDBRequest</code></a> tiene ahora la funcionalidad de la eliminada <code>IDBVersionChangeRequest</code>.</li>
- <li><code><a href="/en-US/docs/IndexedDB/IDBDatabaseException" title="en-US/docs/IndexedDB/DatabaseException">IDBDatabaseException </a></code> {{ obsolete_inline() }} representa las condiciones de excepción que se pueden encontrar mientras se ejecutan operaciones en la base de datos.</li>
-</ul>
-
-<p>Hay también una <a href="/en-US/docs/IndexedDB/Syncronous_API" title="/en-US/docs/IndexedDB/SyncronousAPI">versión sincrónica de la API</a>. La API síncrona no ha sido implementada en cualquier navegador. Está destinada a ser usada con <a href="/en-US/docs/DOM/Using_web_workers" title="https://developer.mozilla.org/en-US/docs/Using_web_workers">WebWorkers</a>.</p>
-
-<h2 id="Límites_de_almacenamiento">Límites de almacenamiento</h2>
-
-<p>No existe un límite de tamaño para un elemento simple de la base de datos. Sin embargo, puede haber un límite en el tamaño de cada base de datos IndexedDB. Este límite (y la forma en que la interfaz de usuario la hace valer) puede variar de una navegador a otro:</p>
-
-<ul>
- <li>
-  <p>Firefox: no hay límite en el tamaño de una base de datos IndexedDB. La interfaz de usuario solicita permiso para almacenar blobs de más de 50MB. Este límite puede ser modificado mediante la preferencia dom.indexedDB.warningQuota (que está definida en <a href="http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js" title="http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js">http://mxr.mozilla.org/mozilla-central/source/modules/libpref/src/init/all.js</a>).</p>
- </li>
- <li>Google Chrome: vea <a class="link-https" href="https://developers.google.com/chrome/whitepapers/storage#temporary" rel="freelink">https://developers.google.com/chrome...rage#temporary</a></li>
-</ul>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<p>Un claro ejemplo para lo que IndexedDB puede ser utilizado en la web, es el ejemplo de Marco Castelluccio, ganador del DevDerby IndexedDB Mozilla. La demostración ganadora fue <a href="/en-US/demos/detail/elibri" title="https://developer.mozilla.org/en-US/demos/detail/elibri">eLibri</a>, una biblioteca y una aplicación de lectura de libros electrónicos.</p>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de los navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>API asíncrono</td>
-   <td>
-    <p>24.0<br>
-     11.0 {{ property_prefix("webkit") }}</p>
-   </td>
-   <td>
-    <p>{{ CompatGeckoDesktop("16.0") }}<br>
-     {{ CompatGeckoDesktop("2.0") }} {{ property_prefix("moz") }}</p>
-   </td>
-   <td>10 {{ property_prefix("ms") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-  </tr>
-  <tr>
-   <td>API síncrono<br>
-    (usado por <a href="/en-US/docs/DOM/Using_web_workers" title="https://developer.mozilla.org/en-US/docs/Using_web_workers">WebWorkers</a>)</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}<br>
-    Vea {{ bug(701634) }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>API síncrono</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatGeckoDesktop("6.0") }} {{ property_prefix("moz") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Para otra matriz de compatibilidad, vea también: <a href="http://caniuse.com/indexeddb" title="http://caniuse.com/indexeddb">Cuándo puedo usar IndexedDB</a></p>
-
-<p>También existe la posibilidad de usar IndexedDB en <a href="http://caniuse.com/sql-storage" title="http://caniuse.com/sql-storage"> navegadores que soportan WebSQL</a> por el uso de <a href="https://github.com/axemclion/IndexedDBShim" title="https://github.com/axemclion/IndexedDBShim">IndexedDB Polyfill</a>.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB" title="en-US/docs/IndexedDB/Basic Concepts Behind IndexedDB">Conceptos básicos acerca de IndexedDB</a></li>
- <li><a href="/en-US/docs/IndexedDB/Using_IndexedDB" title="en-US/docs/IndexedDB/IndexedDB primer">Usando IndexedDB</a></li>
- <li><a class="external" href="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/" title="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">Almacenando imágenes y archivos en IndexedDB</a></li>
- <li><a class="external" href="http://www.html5rocks.com/tutorials/indexeddb/todo/" title="http://www.html5rocks.com/tutorials/indexeddb/todo/">Una lista simple de PENDIENTES usando HTML5 IndexedDB</a>. {{ Note("Este tutorial está basado en una antigua versión de la especificación y no funciona en los navegadores actualizados. por ejemplo, todavía usa el método actualmente eliminado <code>setVersion()</code>.") }}</li>
- <li><a class="external" href="http://www.w3.org/TR/IndexedDB/" title="http://www.w3.org/TR/IndexedDB/">Especificación de la API para Indexed Database </a></li>
- <li><a class="external" href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx" title="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — El alamcén en su navegador</a></li>
- <li><a class="external" href="http://caniuse.com/indexeddb" title="http://caniuse.com/indexeddb">Soporte IndexedDB en navegadores</a></li>
- <li><a class="external" href="http://nparashuram.com/IndexedDB/trialtool/index.html" title="http://nparashuram.com/IndexedDB/trialtool/index.html">Ejemplos IndexedDB</a></li>
- <li><a href="https://github.com/axemclion/IndexedDBShim" title="https://github.com/axemclion/IndexedDBShim">IndexedDB Polyfill</a> para navegadores que sólo soportan WebSQL (p.e. mobile WebKit)</li>
- <li><a href="http://nparashuram.com/IndexedDBShim/" title="http://nparashuram.com/IndexedDBShim/">JQuery IndexedDB plugin</a></li>
-</ul>
diff --git a/files/es/instalación_de_motores_de_búsqueda_desde_páginas_web/index.html b/files/es/instalación_de_motores_de_búsqueda_desde_páginas_web/index.html
deleted file mode 100644
index c1c1755bb9..0000000000
--- a/files/es/instalación_de_motores_de_búsqueda_desde_páginas_web/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: Instalación de motores de búsqueda desde páginas web
-slug: Instalación_de_motores_de_búsqueda_desde_páginas_web
-tags:
-  - Plugins_de_búsqueda
----
-<p>Firefox permite que código de JavaScript instale plugins de motores de búsqueda, los formatos de plugin que soporta son: MozSearch, OpenSearch, y Sherlock.
-</p><p>Cuando el código JavaScript intenta instalar un plugin de búsqueda, Firefox muestra una alerta que pide al usuario permiso para instalarlo.
-</p>
-<h2 id="Instalaci.C3.B3n_de_plugins_MozSearch_y_OpenSearch"> Instalación de plugins MozSearch y OpenSearch </h2>
-<p>Para instalar plugin MozSearch o OpenSearch, es necesario usar el método DOM <code>window.external.AddSearchProvider()</code>. La sintaxis para este método es:
-</p>
-<pre class="eval">window.external.AddSearchProvider(<i>engineURL</i>);
-</pre>
-<p>Donde <i>engineURL</i> es el URL del archivo XML del plugin del motor de búsqueda.
-</p>
-<div class="note"><b>Nota</b>: el soporte a OpenSearch y MozSearch está disponible sólo en Firefox 2 y superior.</div>
-<p>Para más detalles sobre MozSearch, lease <a href="es/Creaci%c3%b3n_de_plugins_MozSearch">Creación de plugins MozSearch</a>.
-</p>
-<h2 id="Instalaci.C3.B3n_de_plugins_Sherlock"> Instalación de plugins Sherlock </h2>
-<p>Para instalar un plugin Sherlock, hay que llamar a <code>window.sidebar.addSearchEngine()</code>, la sintaxis para hacerlo es:
-</p>
-<pre class="eval">window.sidebar.addSearchEngine(<i>engineURL</i>, <i>iconURL</i>, <i>suggestedName</i>, <i>suggestedCategory</i>);
-</pre>
-<ul><li> El parámetro <code>engineURL</code> es el URL del plugin Sherlock a instalar (un archivo ".src").
-</li><li> <code>iconURL</code> es el URL del icono asociado al plugin.
-</li><li> El parámetro <code>suggestedName</code> sólo es usado cuando se le pide permiso al usuario para instala el plugin, de modo que pueda mostrarse un mensaje del tipo "¿Desea instalar <i>suggestedName</i> desde <i>engineURL</i>?".
-</li><li> El parámetro <code>suggestedCategory</code> no se usa. Se debería especificar una cadena vacía (<code>""</code>) o <code>null</code>.
-</li></ul>
-<p>Para más detalles sobre Sherlock, visite <a class=" external" href="http://developer.apple.com/macosx/sherlock/">http://developer.apple.com/macosx/sherlock/</a>
-</p><p><span class="comment">Categorías</span>
-</p><p><span class="comment">interwiki links</span>
-</p>{{ languages( { "en": "en/Adding_search_engines_from_web_pages", "ca": "ca/Addici\u00f3_de_motors_de_cerca_a_les_p\u00e0gines_web", "it": "it/Installare_plugin_di_ricerca_dalle_pagine_web", "ja": "ja/Adding_search_engines_from_web_pages" } ) }}
diff --git a/files/es/learn/accessibility/qué_es_la_accesibilidad/index.html b/files/es/learn/accessibility/qué_es_la_accesibilidad/index.html
deleted file mode 100644
index e92994e37c..0000000000
--- a/files/es/learn/accessibility/qué_es_la_accesibilidad/index.html
+++ /dev/null
@@ -1,211 +0,0 @@
----
-title: ¿Qué es la accesibilidad?
-slug: Learn/Accessibility/Qué_es_la_accesibilidad
-translation_of: Learn/Accessibility/What_is_accessibility
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/Accessibility/HTML", "Learn/Accessibility")}}</div>
-
-<p class="summary">En este artículo se inicia el módulo con una explicación ampliada sobre qué es la accesibilidad. Esta visión general incluye qué grupos de personas necesitamos tener en cuenta y por qué, qué herramientas utilizan estas personas para interactuar con la web y cómo podemos hacer que la accesibilidad sea parte de nuestro flujo de trabajo de desarrollo web.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática y de lenguaje HTML y CSS.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Familiarizarse con la accesibilidad (qué es y cómo te afecta como desarrollador web).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_la_accesibilidad">¿Qué es la accesibilidad?</h2>
-
-<p>La accesibilidad hace que tus sitios web puedan ser utilizados por el mayor número de personas posible. Tradicionalmente, se ideó para las personas con discapacidad, pero la creación de sitios accesibles también beneficia a otros grupos, como los que utilizan los dispositivos móviles o los que tienen conexiones de red lentas.</p>
-
-<p>También podrías pensar en la accesibilidad como una forma de tratar a todos por igual y darles las mismas oportunidades, sin importar su capacidad o circunstancias. Al igual que es injusto excluir a alguien de un edificio porque vaya en silla de ruedas (generalmente, los edificios públicos modernos tienen rampas o ascensores), tampoco es correcto excluir a alguien de un sitio web porque tenga una discapacidad visual. Todos somos diferentes, pero todos somos humanos, y por lo tanto tenemos los mismos derechos.</p>
-
-<p>Por eso debemos hacer las cosas accesibles. En algunos países es obligado por ley proporcionar sitios web accesibles, lo que te puede abrir algunos mercados importantes que de otra manera no serían capaces de utilizar tus servicios o comprar tus productos.</p>
-
-<p>Crear sitios web accesibles nos beneficia a todos:</p>
-
-<ul>
- <li>El HTML semántico, aparte de mejorar la accesibilidad, también mejora la optimización en motores de búsqueda (SEO), y la gente encuentra tu sitio web con mayor facilidad.</li>
- <li>Preocuparse por la accesibilidad demuestra buenos criterios éticos y morales, lo que mejora tu imagen pública.</li>
- <li>Mejorar la accesibilidad también hace que tu sitio sea más fácil de usar por otros grupos, como los usuarios de dispositivos móviles o los que tienen internet de baja velocidad. De hecho, todo el mundo puede beneficiarse de estas mejoras.</li>
- <li>¿Hemos mencionado también que en algunos países está estipulado por ley?</li>
-</ul>
-
-<h2 id="¿Con_que_tipo_de_discapacidades_nos_encontraremos">¿Con que tipo de discapacidades nos encontraremos?</h2>
-
-<p>Las personas con discapacidad son tan diversas como las personas sin discapacidad, y también lo son sus discapacidades. La clave está en pensar más allá de tu ordenador y en cómo utilizas la web y empezar a aprender acerca de cómo otros la utilizan. <em>Tú no eres tus usuarios</em>. A continuación explicaremos los principales tipos de discapacidad que vamos a considerar, junto con las herramientas especiales que se utilizan para acceder al contenido web (conocidas como <strong>tecnologías de apoyo</strong> o <strong>AT</strong>, de <em>assistive technologies</em>).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: La hoja informativa sobre <a href="https://www.who.int/es/news-room/fact-sheets/detail/disability-and-health">discapacidad y salud</a> de la Organización Mundial de la Salud establece que «Más de mil millones de personas, aproximadamente el 15% de la población mundial, tienen alguna forma de discapacidad» y «Entre 110 millones y 190 millones de adultos tienen dificultades funcionales significativas».</p>
-</div>
-
-<h3 id="Personas_con_discapacidad_visual">Personas con discapacidad visual</h3>
-
-<p>Las personas con discapacidad visual son aquellas con ceguera, poca visión o daltonismo. Muchas personas con discapacidad visual utilizan amplificadores de pantalla que consisten en lupas físicas o funciones de zoom por software. La mayoría de los navegadores y sistemas operativos de hoy en día tienen instaladas funciones de zoom. Algunos usuarios confían en los lectores de pantalla, un software que lee en voz alta los textos digitales. Algunos ejemplos de lectores de pantalla incluyen:</p>
-
-<ul>
- <li>Productos comerciales de pago, como <a class="external external-icon" href="https://www.freedomscientific.com/Products/software/JAWS/">JAWS</a> (Windows) y <a href="https://yourdolphin.com/screenreader">Dolphin Screen Reader</a> (Windows).</li>
- <li>Productos gratuitos, como <a class="external external-icon" href="https://www.nvaccess.org/">NVDA</a> (Windows), <a class="external external-icon" href="https://www.chromevox.com/">ChromeVox</a> (Chrome, Windows y Mac OS X) y <a class="external external-icon" href="https://wiki.gnome.org/Projects/Orca">Orca</a> (Linux).</li>
- <li>Productos integrados en el sistema operativo, como <a class="external external-icon" href="https://www.apple.com/accessibility/mac/vision/">VoiceOver</a> (MacOS, iPadOS, IOS), <a class="external external-icon" href="https://support.microsoft.com/en-us/help/22798/windows-10-narrator-get-started">Narrator</a> (Microsoft Windows), <a class="external external-icon" href="https://www.chromevox.com/">ChromeVox</a> (en Chrome OS) y <a class="external external-icon" href="https://play.google.com/store/apps/details?id=com.google.android.marvin.talkback">TalkBack</a> (Android).</li>
-</ul>
-
-<p>Familiarizarse con los lectores de pantalla puede ser útil, así como configurar un lector de pantalla y jugar con él para aprender cómo funciona. Consulta nuestra <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders"> guía de lectores de pantalla de prueba para la navegación cruzada</a> para obtener más detalles sobre su uso. El vídeo siguiente proporciona un breve ejemplo de cómo es esta experiencia.</p>
-
-<p>{{EmbedYouTube("IK97XMibEws")}}</p>
-
-<p>En términos de estadística, la Organización Mundial de la Salud estima que «Alrededor de 285 millones de personas de todo el mundo tienen discapacidad visual: 39 millones son ciegas y 246 tienen visión reducida.» (Véase <a href="https://www.who.int/es/news-room/fact-sheets/detail/blindness-and-visual-impairment">Discapacidad visual y ceguera</a>). Esa es una población grande y significativa de usuarios (casi la misma población de los Estados Unidos de América), a la que simplemente perderás porque tu sitio web no está codificado correctamente.</p>
-
-<h3 id="Personas_con_discapacidades_auditivas">Personas con discapacidades auditivas</h3>
-
-<p>También conocidas como personas con trastornos auditivos o personas sordas. Son un grupo de personas con niveles de audición bajos o nulos. Las personas con discapacidad auditiva usan AT (véase <a href="https://www.nidcd.nih.gov/health/assistive-devices-people-hearing-voice-speech-or-language-disorders">Dispositivos de asistencia para personas con trastornos auditivos, de voz, del habla o del lenguaje</a>), pero en realidad no hay AT específicos para el uso del ordenador/web.</p>
-
-<p>Hay, sin embargo, técnicas específicas para ofrecer alternativas textuales a contenidos de audio, que van desde simples transcripciones hasta pistas de texto (es decir, subtítulos) que se pueden mostrar junto con el vídeo. Pero lo veremos más adelante.</p>
-
-<p>Las personas con discapacidad auditiva también representan una importante base de usuarios: «466 millones de personas en todo el mundo tienen pérdida auditiva discapacitante», dice la hoja informativa sobre <a href="https://www.who.int/es/news-room/fact-sheets/detail/deafness-and-hearing-loss">Sordera y pérdida auditiva</a> de la Organización Mundial de la Salud.</p>
-
-<h3 id="Personas_con_discapacidad_motriz">Personas con discapacidad motriz</h3>
-
-<p>Estas personas tienen discapacidades relativas a la movilidad, que pueden implicar problemas puramente físicos (como la pérdida de una extremidad o la parálisis) o trastornos neurológicos/genéticos que conducen a la debilidad o pérdida de control en las extremidades. Algunas personas simplemente pueden tener dificultades a la hora de mover el ratón, mientras que otras podrían verse más gravemente afectadas, tal vez estén paralizadas y necesiten utilizar un <a href="https://www.performancehealth.com/baseball-cap-head-pointer">puntero de cabeza</a> para interactuar con los ordenadores.</p>
-
-<p>Este tipo de discapacidad se da principalmente por la vejez, y no por cualquier trauma o condición específica, y también podría resultar de limitaciones en el hardware (algunos usuarios podrían no tener un ratón).</p>
-
-<p>La forma en que esto afecta al desarrollo web es el requisito de que los controles sean accesibles por el teclado. Hablaremos de la accesibilidad del teclado en artículos posteriores de este módulo, pero te recomendamos probar algunos sitios web utilizando solo el teclado para ver cómo funcionan. Por ejemplo, ¿se puede utilizar la tecla de tabulación para moverse entre los diferentes controles de un formulario web? Puedes encontrar más detalles sobre los controles del teclado en nuestro apartado <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Using_native_keyboard_accessibility">Accesibilidad desde el teclado</a>.</p>
-
-<p>Si nos basamos en las estadísticas, vemos que un número significativo de personas tienen problemas de movilidad. Los Centros para el Control y la Prevención de Enfermedades de <a href="https://www.cdc.gov/nchs/fastats/disability.htm">Discapacidad y Funcionalidad (Adultos a partir de 18 años no registrados en una institución)</a> de los Estados Unidos informan de que el porcentaje de adultos con alguna disfunción física en los EUA es del 16,1%.</p>
-
-<h3 id="Personas_con_discapacidad_cognitiva">Personas con discapacidad cognitiva</h3>
-
-<p>La discapacidad cognitiva engloba una amplia gama de discapacidades, desde las personas que presentan las capacidades intelectuales más limitadas hasta toda la población que tiene problemas a la hora de recordar por los síntomas de la edad. Este amplio abanico incluye a las personas con enfermedades mentales como la <a href="https://www.nimh.nih.gov/health/topics/depression/index.shtml">depresión</a> y la <a href="https://www.nimh.nih.gov/health/topics/schizophrenia/index.shtml">esquizofrenia</a>. También incluye a personas con dificultades de aprendizaje, como la <a href="https://www.ninds.nih.gov/Disorders/All-Disorders/Learning-Disabilities-Information-Page">dislexia</a> y el <a href="https://www.nimh.nih.gov/health/topics/attention-deficit-hyperactivity-disorder-adhd/index.shtml">trastorno por déficit de atención con hiperactividad</a>. Es importante destacar que, aunque hay una gran diversidad dentro de las definiciones clínicas de alteraciones cognitivas, las personas que las experimentan tienen un conjunto común de problemas funcionales, que incluye dificultades a la hora de entender los contenidos, recordar cómo completar las tareas y confusión ante páginas web diseñadas de forma incoherente.</p>
-
-<p>Una buena base de accesibilidad para personas con deficiencias cognitivas incluye:</p>
-
-<ul>
- <li>proporcionar el contenido en más de un formato, como puede ser texto-a-voz o vídeo;</li>
- <li>proporcionar contenidos fáciles de entender, como texto escrito con estándares de lenguaje sencillo;</li>
- <li>centrar la atención en el contenido importante;</li>
- <li>minimizar las distracciones, tales como contenidos innecesarios o anuncios;</li>
- <li>proporcionar un diseño coherente de la página web y del sistema de navegación;</li>
- <li>usar elementos ya conocidos, como los enlaces subrayados en azul cuando aún no se han visitado, y en morado cuando sí;</li>
- <li>dividir los procesos en pasos lógicos y esenciales con indicadores de progreso;</li>
- <li>ofrecer un sistema de autenticación del sitio web de la forma más fácil posible sin comprometer la seguridad; y</li>
- <li>diseñar formularios fáciles de completar, con mensajes de error claros y de fácil solución.</li>
-</ul>
-
-<h3 id="Observaciones">Observaciones</h3>
-
-<ul>
- <li>Diseñar para la <a href="/en-US/docs/Web/Accessibility/Cognitive_accessibility">accesibilidad cognitiva</a> proporcionará buenas prácticas de diseño que beneficiarán a todo el mundo.</li>
- <li>Muchas personas con discapacidades cognitivas también tienen discapacidades físicas. Los sitios web deben cumplir con las directrices de accesibilidad a los contenidos web <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web Content Accessibility Guidelines</a> de W3C, que incluyen las <a href="/en-US/docs/Web/Accessibility/Cognitive_accessibility#Guidelines">directrices de accesibilidad cognitiva</a>.</li>
- <li>El apartado <a href="https://www.w3.org/WAI/GL/task-forces/coga/">Cognitive and Learning Disabilities Accessibility Task Force</a> de W3C aporta pautas de accesibilidad web para personas con discapacidades cognitivas.</li>
- <li>WebAIM tiene una <a href="https://webaim.org/articles/cognitive/">página cognitiva</a> con la información y los recursos correspondientes.</li>
- <li>Los Centros para el Control de Enfermedades estimaron que, en 2018, 1 de cada 4 ciudadanos de Estados Unidos presentaba alguna discapacidad y que la discapacidad cognitiva es la más común entre los jóvenes.</li>
- <li>En los EUA, el término «retraso mental» se ha sustituido por el de «discapacidad intelectual». En el Reino Unido, a la «discapacidad intelectual» se le llama comúnmente «discapacidades de aprendizaje» o «dificultades de aprendizaje».</li>
-</ul>
-
-<h2 id="Implementa_la_accesibilidad_en_tu_proyecto">Implementa la accesibilidad en tu proyecto</h2>
-
-<p>Un mito común de la accesibilidad es que se trata de un «extra añadido» que encarece tu proyecto. Este mito <em>puede</em> resultar cierto si:</p>
-
-<ul>
- <li>Tratas de «readaptar» la accesibilidad de un sitio web que tiene problemas de accesibilidad importantes.</li>
- <li>Solo has empezado a considerar la accesibilidad y temas relacionados en las últimas etapas de un proyecto.</li>
-</ul>
-
-<p>Sin embargo, si se tiene en cuenta la accesibilidad desde el inicio de un proyecto, el coste es muy reducido.</p>
-
-<p>Al planificar tu proyecto, debes tener en cuenta las pruebas de accesibilidad en la fase de pruebas, lo mismo que las pruebas para cualquier otro sector de público objetivo importante (por ejemplo, los navegadores de escritorio o los navegadores para dispositivo móvil). Somete tu proyecto a pruebas desde una etapa temprana y con frecuencia, idealmente con pruebas automatizadas para detectar carencias detectables en la programación, como la falta de <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Text_alternatives">textos alternativos</a> en las imágenes o textos de enlace no adecuados (consulta <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Element_relationships_and_context">Relaciones entre elementos y contexto</a>). Y haz algunas pruebas con grupos de usuarios con discapacidad para ver cómo se desenvuelven con las características más complejas de tu sitio web. Por ejemplo:</p>
-
-<ul>
- <li>¿Las personas que utilizan lectores de pantalla tendrán problemas con mi selector de fechas?</li>
- <li>¿Pueden saber las personas con discapacidad visual si el contenido se actualiza dinámicamente?</li>
- <li>¿Puedo acceder a los botones de mi interfaz de usuario desde el teclado y desde las interfaces táctiles?</li>
-</ul>
-
-<p>Puedes y debes tener en cuenta las áreas potencialmente problemáticas del contenido que habrá que modificar para proporcionarles accesibilidad, asegúrate de que se prueban a fondo y piensa en soluciones/alternativas. El contenido textual (como veremos en el próximo artículo) es fácil, pero ¿qué pasa con el contenido multimedia y con esos fantásticos gráficos 3D? Echa un ojo al presupuesto del proyecto y piensa en soluciones que estén a tu disposición para convertir tales contenidos en accesibles. Transcribir todos tus archivos multimedia es una opción posible, aunque cara.</p>
-
-<p>Seamos realistas. El «100% de accesibilidad» es un ideal inalcanzable, ya que siempre te encontrarás con algún tipo de caso límite en que un determinado usuario encuentra ciertos contenidos difíciles de usar, pero debes hacer todo lo que puedas. Si planeas incluir un gráfico 3D circular creado a partir de WebGL, es posible que desees incluir una tabla de datos como una representación alternativa accesible. O bien puedes simplemente incluir la tabla y deshacerte del gráfico circular 3D (todo el mundo puede acceder a la tabla, su codificación resulta más simple, y además consume menos recursos de la CPU y es de mantenimiento más fácil.</p>
-
-<p>Por otro lado, si trabajas en un sitio web de una galería que muestra obras de arte interesantes en 3D, no sería razonable esperar que cada obra de arte sea perfectamente accesible para las personas con discapacidad visual, ya que se trata de un medio completamente visual.</p>
-
-<p>Para demostrar que te importa y que has pensado en la accesibilidad, publica una declaración de accesibilidad en la página web que explique tu política de accesibilidad y los pasos realizados para hacer que el sitio web sea accesible. Si alguien se queja de que tiene un problema de accesibilidad: inicia un diálogo con ellos, se empático y toma las medidas razonables para tratar de solucionar el problema.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Nuestro artículo sobre <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility">Cómo afrontar los problemas de accesibilidad más comunes</a> expone los detalles de accesibilidad que es necesario tener más en cuenta.</p>
-</div>
-
-<p>En resumen:</p>
-
-<ul>
- <li>Considera la accesibilidad desde el inicio de un proyecto y haz pruebas con frecuencia. Al igual que cualquier otro error, un problema de accesibilidad se vuelve más caro de arreglar cuanto más tarde se descubre.</li>
- <li>Ten en cuenta que muchas de las buenas prácticas de accesibilidad benefician a todo el mundo, no solo a los usuarios con discapacidad. Por ejemplo, el marcado semántico no solo es bueno para los lectores de pantalla, sino que también es de carga y ejecución rápidas. Esto nos beneficia a todos, especialmente a quienes entran con dispositivos móviles y/o tienen conexión lenta.</li>
- <li>Publica una declaración de accesibilidad en la página web y relacionarse con la gente que tiene problemas.</li>
-</ul>
-
-<h2 id="Directrices_de_accesibilidad_y_la_ley">Directrices de accesibilidad y la ley</h2>
-
-<p>Hay numerosas listas de control y conjuntos de directrices en las cuales basar las pruebas de accesibilidad, por lo que podría parecer abrumador a primera vista. Nuestro consejo es que te familiarices con las áreas básicas en las que te interesa centrarte, así como que comprendas las estructuras de alto nivel de las directrices que son más relevantes para ti.</p>
-
-<ul>
- <li>Para empezar, el W3C ha publicado un documento muy extenso y detallado que incluye criterios de accesibilidad muy precisos, independientes de la tecnología. Se llaman <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web Content Accessibility Guidelines</a> (WCAG). Los criterios se dividen en cuatro categorías principales, las cuales especifican según el tipo de implementaciones: perceptibles, operables, comprensibles y robustas. El mejor lugar para adquirir una ligera introducción y comenzar el aprendizaje es <a href="https://www.w3.org/WAI/standards-guidelines/wcag/glance/">WCAG at a Glance</a>. No es necesario que te aprendas las directrices WCAG de memoria, solo tienes que ser consciente de las áreas de preocupación principales y utilizar una variedad de técnicas y herramientas para destacar aquellas áreas que no se ajustan a los criterios WCAG (véase más abajo).</li>
- <li>Tu país también puede tener una legislación específica que regule la necesidad de la accesibilidad que los sitios web. Por ejemplo, la norma <a href="https://www.etsi.org/deliver/etsi_en/301500_301599/301549/02.01.02_60/en_301549v020102p.pdf">EN 301 549</a> en la UE, la <a href="https://www.section508.gov/training">sección 508 de la Ley de Rehabilitación</a> en los EUA, la <a href="https://www.einfach-fuer-alle.de/artikel/bitv_english/">Ordenanza Federal de Tecnología de la Información sin barreras</a> en Alemania, el <a href="https://www.legislation.gov.uk/uksi/2018/952/introduction/made">Reglamento de accesibilidad 2018</a> en el Reino Unido, la <a href="https://www.agid.gov.it/it/design-servizi/accessibilita-siti-web">Accessibilità</a> en Italia, la <a href="https://www.humanrights.gov.au/world-wide-web-access-disability-discrimination-act-advisory-notes-ver-41-2014">Ley de Discriminación por Discapacidad</a> en Australia, etc. La W3C tiene una lista de <a href="https://www.w3.org/WAI/policies/">políticas y leyes de accesibilidad web</a> según países.</li>
-</ul>
-
-<p>Así, mientras que la WCAG es un conjunto de directrices, tu país probablemente tiene leyes que rigen la accesibilidad web, o al menos la accesibilidad de los servicios disponibles para el público (que incluyen sitios web, televisión, espacios físicos, etc.). Conocer estas leyes puede resultarte útil. Si no te preocupas por comprobar que tu contenido sea accesible, podrías incurrir en alguna responsabilidad legal, si la gente se queja.</p>
-
-<p>Suena serio, pero en realidad solo tienes que considerar la accesibilidad como la prioridad principal a la hora de desarrollar tu web, como ya hemos dicho. En caso de duda, asesórate por un abogado cualificado. Y como nosotros no lo somos, no vamos a ofrecer más consejos sobre este tema.</p>
-
-<h2 id="API_de_accesibilidad">API de accesibilidad</h2>
-
-<p>Los navegadores web hacen uso de <strong>API de accesibilidad</strong> especiales (proporcionadas por el sistema operativo subyacente) que exponen información útil para las tecnologías de asistencia (AT, <em>assistive technologies</em>): la mayoría de AT tienden a utilizar información semántica, por lo que esta información no incluye información de estilo o JavaScript. Esta información se estructura en un árbol de datos, denominado <strong>árbol de accesibilidad</strong>.</p>
-
-<p>Los diferentes sistemas operativos disponen de diferentes API de accesibilidad:</p>
-
-<ul>
- <li>Windows: MSAA/IAccessible, UIAExpress, IAccessible2</li>
- <li>Mac OS X: NSAccessibility</li>
- <li>Linux: AT-SPI</li>
- <li>Android: Accessibility framework</li>
- <li>iOS: UIAccessibility</li>
-</ul>
-
-<p>Cuando la información semántica nativa proporcionada por los elementos HTML de tus aplicaciones web falla, puedes complementarlo con características de la <a href="https://www.w3.org/TR/wai-aria/">especificación WAI-ARIA</a>, que añaden información semántica al árbol para mejorar la accesibilidad. Puedes aprender más acerca de WAI-ARIA en nuestro artículo de <a href="/en-US/docs/Learn/Accessibility/WAI-ARIA_basics">fundamentos WAI-ARIA</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Este artículo debería haber dado una descripción detallada sobre la accesibilidad, mostrar por qué es importante y enseñar cómo puede encajar en tu flujo de trabajo. Ahora también deberías tener sed de conocimientos sobre los detalles de implementación que hacen que los sitios sean accesibles. Comenzaremos con esto en la sección siguiente, observando por qué HTML es una buena base para la accesibilidad.</p>
-
-<p>{{NextMenu("Learn/Accessibility/HTML", "Learn/Accessibility")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Accessibility/What_is_accessibility">¿Qué es la accesibilidad?</a></li>
- <li><a href="/en-US/docs/Learn/Accessibility/HTML">HTML: Una buena base para la accesibilidad</a></li>
- <li><a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript">Buenas prácticas de accesibilidad en CSS y JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/Accessibility/WAI-ARIA_basics">Fundamentos WAI-ARIA</a></li>
- <li><a href="/en-US/docs/Learn/Accessibility/Multimedia">Multimedia accesible</a></li>
- <li><a href="/en-US/docs/Learn/Accessibility/Mobile">Accesibilidad móvil</a></li>
- <li><a href="/en-US/docs/Learn/Accessibility/Accessibility_troubleshooting">Resolución de problemas de accesibilidad</a></li>
-</ul>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG">WCAG</a>
-
-  <ul>
-   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable">Perceptible</a></li>
-   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable">Operable</a></li>
-   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Understandable">Comprensible</a></li>
-   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Robust">Robusto</a></li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/learn/accessibility/what_is_accessibility/index.html b/files/es/learn/accessibility/what_is_accessibility/index.html
new file mode 100644
index 0000000000..3d9d8d2843
--- /dev/null
+++ b/files/es/learn/accessibility/what_is_accessibility/index.html
@@ -0,0 +1,212 @@
+---
+title: ¿Qué es la accesibilidad?
+slug: Learn/Accessibility/What_is_accessibility
+translation_of: Learn/Accessibility/What_is_accessibility
+original_slug: Learn/Accessibility/Qué_es_la_accesibilidad
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/Accessibility/HTML", "Learn/Accessibility")}}</div>
+
+<p class="summary">En este artículo se inicia el módulo con una explicación ampliada sobre qué es la accesibilidad. Esta visión general incluye qué grupos de personas necesitamos tener en cuenta y por qué, qué herramientas utilizan estas personas para interactuar con la web y cómo podemos hacer que la accesibilidad sea parte de nuestro flujo de trabajo de desarrollo web.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática y de lenguaje HTML y CSS.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Familiarizarse con la accesibilidad (qué es y cómo te afecta como desarrollador web).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_la_accesibilidad">¿Qué es la accesibilidad?</h2>
+
+<p>La accesibilidad hace que tus sitios web puedan ser utilizados por el mayor número de personas posible. Tradicionalmente, se ideó para las personas con discapacidad, pero la creación de sitios accesibles también beneficia a otros grupos, como los que utilizan los dispositivos móviles o los que tienen conexiones de red lentas.</p>
+
+<p>También podrías pensar en la accesibilidad como una forma de tratar a todos por igual y darles las mismas oportunidades, sin importar su capacidad o circunstancias. Al igual que es injusto excluir a alguien de un edificio porque vaya en silla de ruedas (generalmente, los edificios públicos modernos tienen rampas o ascensores), tampoco es correcto excluir a alguien de un sitio web porque tenga una discapacidad visual. Todos somos diferentes, pero todos somos humanos, y por lo tanto tenemos los mismos derechos.</p>
+
+<p>Por eso debemos hacer las cosas accesibles. En algunos países es obligado por ley proporcionar sitios web accesibles, lo que te puede abrir algunos mercados importantes que de otra manera no serían capaces de utilizar tus servicios o comprar tus productos.</p>
+
+<p>Crear sitios web accesibles nos beneficia a todos:</p>
+
+<ul>
+ <li>El HTML semántico, aparte de mejorar la accesibilidad, también mejora la optimización en motores de búsqueda (SEO), y la gente encuentra tu sitio web con mayor facilidad.</li>
+ <li>Preocuparse por la accesibilidad demuestra buenos criterios éticos y morales, lo que mejora tu imagen pública.</li>
+ <li>Mejorar la accesibilidad también hace que tu sitio sea más fácil de usar por otros grupos, como los usuarios de dispositivos móviles o los que tienen internet de baja velocidad. De hecho, todo el mundo puede beneficiarse de estas mejoras.</li>
+ <li>¿Hemos mencionado también que en algunos países está estipulado por ley?</li>
+</ul>
+
+<h2 id="¿Con_que_tipo_de_discapacidades_nos_encontraremos">¿Con que tipo de discapacidades nos encontraremos?</h2>
+
+<p>Las personas con discapacidad son tan diversas como las personas sin discapacidad, y también lo son sus discapacidades. La clave está en pensar más allá de tu ordenador y en cómo utilizas la web y empezar a aprender acerca de cómo otros la utilizan. <em>Tú no eres tus usuarios</em>. A continuación explicaremos los principales tipos de discapacidad que vamos a considerar, junto con las herramientas especiales que se utilizan para acceder al contenido web (conocidas como <strong>tecnologías de apoyo</strong> o <strong>AT</strong>, de <em>assistive technologies</em>).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: La hoja informativa sobre <a href="https://www.who.int/es/news-room/fact-sheets/detail/disability-and-health">discapacidad y salud</a> de la Organización Mundial de la Salud establece que «Más de mil millones de personas, aproximadamente el 15% de la población mundial, tienen alguna forma de discapacidad» y «Entre 110 millones y 190 millones de adultos tienen dificultades funcionales significativas».</p>
+</div>
+
+<h3 id="Personas_con_discapacidad_visual">Personas con discapacidad visual</h3>
+
+<p>Las personas con discapacidad visual son aquellas con ceguera, poca visión o daltonismo. Muchas personas con discapacidad visual utilizan amplificadores de pantalla que consisten en lupas físicas o funciones de zoom por software. La mayoría de los navegadores y sistemas operativos de hoy en día tienen instaladas funciones de zoom. Algunos usuarios confían en los lectores de pantalla, un software que lee en voz alta los textos digitales. Algunos ejemplos de lectores de pantalla incluyen:</p>
+
+<ul>
+ <li>Productos comerciales de pago, como <a class="external external-icon" href="https://www.freedomscientific.com/Products/software/JAWS/">JAWS</a> (Windows) y <a href="https://yourdolphin.com/screenreader">Dolphin Screen Reader</a> (Windows).</li>
+ <li>Productos gratuitos, como <a class="external external-icon" href="https://www.nvaccess.org/">NVDA</a> (Windows), <a class="external external-icon" href="https://www.chromevox.com/">ChromeVox</a> (Chrome, Windows y Mac OS X) y <a class="external external-icon" href="https://wiki.gnome.org/Projects/Orca">Orca</a> (Linux).</li>
+ <li>Productos integrados en el sistema operativo, como <a class="external external-icon" href="https://www.apple.com/accessibility/mac/vision/">VoiceOver</a> (MacOS, iPadOS, IOS), <a class="external external-icon" href="https://support.microsoft.com/en-us/help/22798/windows-10-narrator-get-started">Narrator</a> (Microsoft Windows), <a class="external external-icon" href="https://www.chromevox.com/">ChromeVox</a> (en Chrome OS) y <a class="external external-icon" href="https://play.google.com/store/apps/details?id=com.google.android.marvin.talkback">TalkBack</a> (Android).</li>
+</ul>
+
+<p>Familiarizarse con los lectores de pantalla puede ser útil, así como configurar un lector de pantalla y jugar con él para aprender cómo funciona. Consulta nuestra <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders"> guía de lectores de pantalla de prueba para la navegación cruzada</a> para obtener más detalles sobre su uso. El vídeo siguiente proporciona un breve ejemplo de cómo es esta experiencia.</p>
+
+<p>{{EmbedYouTube("IK97XMibEws")}}</p>
+
+<p>En términos de estadística, la Organización Mundial de la Salud estima que «Alrededor de 285 millones de personas de todo el mundo tienen discapacidad visual: 39 millones son ciegas y 246 tienen visión reducida.» (Véase <a href="https://www.who.int/es/news-room/fact-sheets/detail/blindness-and-visual-impairment">Discapacidad visual y ceguera</a>). Esa es una población grande y significativa de usuarios (casi la misma población de los Estados Unidos de América), a la que simplemente perderás porque tu sitio web no está codificado correctamente.</p>
+
+<h3 id="Personas_con_discapacidades_auditivas">Personas con discapacidades auditivas</h3>
+
+<p>También conocidas como personas con trastornos auditivos o personas sordas. Son un grupo de personas con niveles de audición bajos o nulos. Las personas con discapacidad auditiva usan AT (véase <a href="https://www.nidcd.nih.gov/health/assistive-devices-people-hearing-voice-speech-or-language-disorders">Dispositivos de asistencia para personas con trastornos auditivos, de voz, del habla o del lenguaje</a>), pero en realidad no hay AT específicos para el uso del ordenador/web.</p>
+
+<p>Hay, sin embargo, técnicas específicas para ofrecer alternativas textuales a contenidos de audio, que van desde simples transcripciones hasta pistas de texto (es decir, subtítulos) que se pueden mostrar junto con el vídeo. Pero lo veremos más adelante.</p>
+
+<p>Las personas con discapacidad auditiva también representan una importante base de usuarios: «466 millones de personas en todo el mundo tienen pérdida auditiva discapacitante», dice la hoja informativa sobre <a href="https://www.who.int/es/news-room/fact-sheets/detail/deafness-and-hearing-loss">Sordera y pérdida auditiva</a> de la Organización Mundial de la Salud.</p>
+
+<h3 id="Personas_con_discapacidad_motriz">Personas con discapacidad motriz</h3>
+
+<p>Estas personas tienen discapacidades relativas a la movilidad, que pueden implicar problemas puramente físicos (como la pérdida de una extremidad o la parálisis) o trastornos neurológicos/genéticos que conducen a la debilidad o pérdida de control en las extremidades. Algunas personas simplemente pueden tener dificultades a la hora de mover el ratón, mientras que otras podrían verse más gravemente afectadas, tal vez estén paralizadas y necesiten utilizar un <a href="https://www.performancehealth.com/baseball-cap-head-pointer">puntero de cabeza</a> para interactuar con los ordenadores.</p>
+
+<p>Este tipo de discapacidad se da principalmente por la vejez, y no por cualquier trauma o condición específica, y también podría resultar de limitaciones en el hardware (algunos usuarios podrían no tener un ratón).</p>
+
+<p>La forma en que esto afecta al desarrollo web es el requisito de que los controles sean accesibles por el teclado. Hablaremos de la accesibilidad del teclado en artículos posteriores de este módulo, pero te recomendamos probar algunos sitios web utilizando solo el teclado para ver cómo funcionan. Por ejemplo, ¿se puede utilizar la tecla de tabulación para moverse entre los diferentes controles de un formulario web? Puedes encontrar más detalles sobre los controles del teclado en nuestro apartado <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Using_native_keyboard_accessibility">Accesibilidad desde el teclado</a>.</p>
+
+<p>Si nos basamos en las estadísticas, vemos que un número significativo de personas tienen problemas de movilidad. Los Centros para el Control y la Prevención de Enfermedades de <a href="https://www.cdc.gov/nchs/fastats/disability.htm">Discapacidad y Funcionalidad (Adultos a partir de 18 años no registrados en una institución)</a> de los Estados Unidos informan de que el porcentaje de adultos con alguna disfunción física en los EUA es del 16,1%.</p>
+
+<h3 id="Personas_con_discapacidad_cognitiva">Personas con discapacidad cognitiva</h3>
+
+<p>La discapacidad cognitiva engloba una amplia gama de discapacidades, desde las personas que presentan las capacidades intelectuales más limitadas hasta toda la población que tiene problemas a la hora de recordar por los síntomas de la edad. Este amplio abanico incluye a las personas con enfermedades mentales como la <a href="https://www.nimh.nih.gov/health/topics/depression/index.shtml">depresión</a> y la <a href="https://www.nimh.nih.gov/health/topics/schizophrenia/index.shtml">esquizofrenia</a>. También incluye a personas con dificultades de aprendizaje, como la <a href="https://www.ninds.nih.gov/Disorders/All-Disorders/Learning-Disabilities-Information-Page">dislexia</a> y el <a href="https://www.nimh.nih.gov/health/topics/attention-deficit-hyperactivity-disorder-adhd/index.shtml">trastorno por déficit de atención con hiperactividad</a>. Es importante destacar que, aunque hay una gran diversidad dentro de las definiciones clínicas de alteraciones cognitivas, las personas que las experimentan tienen un conjunto común de problemas funcionales, que incluye dificultades a la hora de entender los contenidos, recordar cómo completar las tareas y confusión ante páginas web diseñadas de forma incoherente.</p>
+
+<p>Una buena base de accesibilidad para personas con deficiencias cognitivas incluye:</p>
+
+<ul>
+ <li>proporcionar el contenido en más de un formato, como puede ser texto-a-voz o vídeo;</li>
+ <li>proporcionar contenidos fáciles de entender, como texto escrito con estándares de lenguaje sencillo;</li>
+ <li>centrar la atención en el contenido importante;</li>
+ <li>minimizar las distracciones, tales como contenidos innecesarios o anuncios;</li>
+ <li>proporcionar un diseño coherente de la página web y del sistema de navegación;</li>
+ <li>usar elementos ya conocidos, como los enlaces subrayados en azul cuando aún no se han visitado, y en morado cuando sí;</li>
+ <li>dividir los procesos en pasos lógicos y esenciales con indicadores de progreso;</li>
+ <li>ofrecer un sistema de autenticación del sitio web de la forma más fácil posible sin comprometer la seguridad; y</li>
+ <li>diseñar formularios fáciles de completar, con mensajes de error claros y de fácil solución.</li>
+</ul>
+
+<h3 id="Observaciones">Observaciones</h3>
+
+<ul>
+ <li>Diseñar para la <a href="/en-US/docs/Web/Accessibility/Cognitive_accessibility">accesibilidad cognitiva</a> proporcionará buenas prácticas de diseño que beneficiarán a todo el mundo.</li>
+ <li>Muchas personas con discapacidades cognitivas también tienen discapacidades físicas. Los sitios web deben cumplir con las directrices de accesibilidad a los contenidos web <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web Content Accessibility Guidelines</a> de W3C, que incluyen las <a href="/en-US/docs/Web/Accessibility/Cognitive_accessibility#Guidelines">directrices de accesibilidad cognitiva</a>.</li>
+ <li>El apartado <a href="https://www.w3.org/WAI/GL/task-forces/coga/">Cognitive and Learning Disabilities Accessibility Task Force</a> de W3C aporta pautas de accesibilidad web para personas con discapacidades cognitivas.</li>
+ <li>WebAIM tiene una <a href="https://webaim.org/articles/cognitive/">página cognitiva</a> con la información y los recursos correspondientes.</li>
+ <li>Los Centros para el Control de Enfermedades estimaron que, en 2018, 1 de cada 4 ciudadanos de Estados Unidos presentaba alguna discapacidad y que la discapacidad cognitiva es la más común entre los jóvenes.</li>
+ <li>En los EUA, el término «retraso mental» se ha sustituido por el de «discapacidad intelectual». En el Reino Unido, a la «discapacidad intelectual» se le llama comúnmente «discapacidades de aprendizaje» o «dificultades de aprendizaje».</li>
+</ul>
+
+<h2 id="Implementa_la_accesibilidad_en_tu_proyecto">Implementa la accesibilidad en tu proyecto</h2>
+
+<p>Un mito común de la accesibilidad es que se trata de un «extra añadido» que encarece tu proyecto. Este mito <em>puede</em> resultar cierto si:</p>
+
+<ul>
+ <li>Tratas de «readaptar» la accesibilidad de un sitio web que tiene problemas de accesibilidad importantes.</li>
+ <li>Solo has empezado a considerar la accesibilidad y temas relacionados en las últimas etapas de un proyecto.</li>
+</ul>
+
+<p>Sin embargo, si se tiene en cuenta la accesibilidad desde el inicio de un proyecto, el coste es muy reducido.</p>
+
+<p>Al planificar tu proyecto, debes tener en cuenta las pruebas de accesibilidad en la fase de pruebas, lo mismo que las pruebas para cualquier otro sector de público objetivo importante (por ejemplo, los navegadores de escritorio o los navegadores para dispositivo móvil). Somete tu proyecto a pruebas desde una etapa temprana y con frecuencia, idealmente con pruebas automatizadas para detectar carencias detectables en la programación, como la falta de <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Text_alternatives">textos alternativos</a> en las imágenes o textos de enlace no adecuados (consulta <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Element_relationships_and_context">Relaciones entre elementos y contexto</a>). Y haz algunas pruebas con grupos de usuarios con discapacidad para ver cómo se desenvuelven con las características más complejas de tu sitio web. Por ejemplo:</p>
+
+<ul>
+ <li>¿Las personas que utilizan lectores de pantalla tendrán problemas con mi selector de fechas?</li>
+ <li>¿Pueden saber las personas con discapacidad visual si el contenido se actualiza dinámicamente?</li>
+ <li>¿Puedo acceder a los botones de mi interfaz de usuario desde el teclado y desde las interfaces táctiles?</li>
+</ul>
+
+<p>Puedes y debes tener en cuenta las áreas potencialmente problemáticas del contenido que habrá que modificar para proporcionarles accesibilidad, asegúrate de que se prueban a fondo y piensa en soluciones/alternativas. El contenido textual (como veremos en el próximo artículo) es fácil, pero ¿qué pasa con el contenido multimedia y con esos fantásticos gráficos 3D? Echa un ojo al presupuesto del proyecto y piensa en soluciones que estén a tu disposición para convertir tales contenidos en accesibles. Transcribir todos tus archivos multimedia es una opción posible, aunque cara.</p>
+
+<p>Seamos realistas. El «100% de accesibilidad» es un ideal inalcanzable, ya que siempre te encontrarás con algún tipo de caso límite en que un determinado usuario encuentra ciertos contenidos difíciles de usar, pero debes hacer todo lo que puedas. Si planeas incluir un gráfico 3D circular creado a partir de WebGL, es posible que desees incluir una tabla de datos como una representación alternativa accesible. O bien puedes simplemente incluir la tabla y deshacerte del gráfico circular 3D (todo el mundo puede acceder a la tabla, su codificación resulta más simple, y además consume menos recursos de la CPU y es de mantenimiento más fácil.</p>
+
+<p>Por otro lado, si trabajas en un sitio web de una galería que muestra obras de arte interesantes en 3D, no sería razonable esperar que cada obra de arte sea perfectamente accesible para las personas con discapacidad visual, ya que se trata de un medio completamente visual.</p>
+
+<p>Para demostrar que te importa y que has pensado en la accesibilidad, publica una declaración de accesibilidad en la página web que explique tu política de accesibilidad y los pasos realizados para hacer que el sitio web sea accesible. Si alguien se queja de que tiene un problema de accesibilidad: inicia un diálogo con ellos, se empático y toma las medidas razonables para tratar de solucionar el problema.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Nuestro artículo sobre <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility">Cómo afrontar los problemas de accesibilidad más comunes</a> expone los detalles de accesibilidad que es necesario tener más en cuenta.</p>
+</div>
+
+<p>En resumen:</p>
+
+<ul>
+ <li>Considera la accesibilidad desde el inicio de un proyecto y haz pruebas con frecuencia. Al igual que cualquier otro error, un problema de accesibilidad se vuelve más caro de arreglar cuanto más tarde se descubre.</li>
+ <li>Ten en cuenta que muchas de las buenas prácticas de accesibilidad benefician a todo el mundo, no solo a los usuarios con discapacidad. Por ejemplo, el marcado semántico no solo es bueno para los lectores de pantalla, sino que también es de carga y ejecución rápidas. Esto nos beneficia a todos, especialmente a quienes entran con dispositivos móviles y/o tienen conexión lenta.</li>
+ <li>Publica una declaración de accesibilidad en la página web y relacionarse con la gente que tiene problemas.</li>
+</ul>
+
+<h2 id="Directrices_de_accesibilidad_y_la_ley">Directrices de accesibilidad y la ley</h2>
+
+<p>Hay numerosas listas de control y conjuntos de directrices en las cuales basar las pruebas de accesibilidad, por lo que podría parecer abrumador a primera vista. Nuestro consejo es que te familiarices con las áreas básicas en las que te interesa centrarte, así como que comprendas las estructuras de alto nivel de las directrices que son más relevantes para ti.</p>
+
+<ul>
+ <li>Para empezar, el W3C ha publicado un documento muy extenso y detallado que incluye criterios de accesibilidad muy precisos, independientes de la tecnología. Se llaman <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web Content Accessibility Guidelines</a> (WCAG). Los criterios se dividen en cuatro categorías principales, las cuales especifican según el tipo de implementaciones: perceptibles, operables, comprensibles y robustas. El mejor lugar para adquirir una ligera introducción y comenzar el aprendizaje es <a href="https://www.w3.org/WAI/standards-guidelines/wcag/glance/">WCAG at a Glance</a>. No es necesario que te aprendas las directrices WCAG de memoria, solo tienes que ser consciente de las áreas de preocupación principales y utilizar una variedad de técnicas y herramientas para destacar aquellas áreas que no se ajustan a los criterios WCAG (véase más abajo).</li>
+ <li>Tu país también puede tener una legislación específica que regule la necesidad de la accesibilidad que los sitios web. Por ejemplo, la norma <a href="https://www.etsi.org/deliver/etsi_en/301500_301599/301549/02.01.02_60/en_301549v020102p.pdf">EN 301 549</a> en la UE, la <a href="https://www.section508.gov/training">sección 508 de la Ley de Rehabilitación</a> en los EUA, la <a href="https://www.einfach-fuer-alle.de/artikel/bitv_english/">Ordenanza Federal de Tecnología de la Información sin barreras</a> en Alemania, el <a href="https://www.legislation.gov.uk/uksi/2018/952/introduction/made">Reglamento de accesibilidad 2018</a> en el Reino Unido, la <a href="https://www.agid.gov.it/it/design-servizi/accessibilita-siti-web">Accessibilità</a> en Italia, la <a href="https://www.humanrights.gov.au/world-wide-web-access-disability-discrimination-act-advisory-notes-ver-41-2014">Ley de Discriminación por Discapacidad</a> en Australia, etc. La W3C tiene una lista de <a href="https://www.w3.org/WAI/policies/">políticas y leyes de accesibilidad web</a> según países.</li>
+</ul>
+
+<p>Así, mientras que la WCAG es un conjunto de directrices, tu país probablemente tiene leyes que rigen la accesibilidad web, o al menos la accesibilidad de los servicios disponibles para el público (que incluyen sitios web, televisión, espacios físicos, etc.). Conocer estas leyes puede resultarte útil. Si no te preocupas por comprobar que tu contenido sea accesible, podrías incurrir en alguna responsabilidad legal, si la gente se queja.</p>
+
+<p>Suena serio, pero en realidad solo tienes que considerar la accesibilidad como la prioridad principal a la hora de desarrollar tu web, como ya hemos dicho. En caso de duda, asesórate por un abogado cualificado. Y como nosotros no lo somos, no vamos a ofrecer más consejos sobre este tema.</p>
+
+<h2 id="API_de_accesibilidad">API de accesibilidad</h2>
+
+<p>Los navegadores web hacen uso de <strong>API de accesibilidad</strong> especiales (proporcionadas por el sistema operativo subyacente) que exponen información útil para las tecnologías de asistencia (AT, <em>assistive technologies</em>): la mayoría de AT tienden a utilizar información semántica, por lo que esta información no incluye información de estilo o JavaScript. Esta información se estructura en un árbol de datos, denominado <strong>árbol de accesibilidad</strong>.</p>
+
+<p>Los diferentes sistemas operativos disponen de diferentes API de accesibilidad:</p>
+
+<ul>
+ <li>Windows: MSAA/IAccessible, UIAExpress, IAccessible2</li>
+ <li>Mac OS X: NSAccessibility</li>
+ <li>Linux: AT-SPI</li>
+ <li>Android: Accessibility framework</li>
+ <li>iOS: UIAccessibility</li>
+</ul>
+
+<p>Cuando la información semántica nativa proporcionada por los elementos HTML de tus aplicaciones web falla, puedes complementarlo con características de la <a href="https://www.w3.org/TR/wai-aria/">especificación WAI-ARIA</a>, que añaden información semántica al árbol para mejorar la accesibilidad. Puedes aprender más acerca de WAI-ARIA en nuestro artículo de <a href="/en-US/docs/Learn/Accessibility/WAI-ARIA_basics">fundamentos WAI-ARIA</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Este artículo debería haber dado una descripción detallada sobre la accesibilidad, mostrar por qué es importante y enseñar cómo puede encajar en tu flujo de trabajo. Ahora también deberías tener sed de conocimientos sobre los detalles de implementación que hacen que los sitios sean accesibles. Comenzaremos con esto en la sección siguiente, observando por qué HTML es una buena base para la accesibilidad.</p>
+
+<p>{{NextMenu("Learn/Accessibility/HTML", "Learn/Accessibility")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Accessibility/What_is_accessibility">¿Qué es la accesibilidad?</a></li>
+ <li><a href="/en-US/docs/Learn/Accessibility/HTML">HTML: Una buena base para la accesibilidad</a></li>
+ <li><a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript">Buenas prácticas de accesibilidad en CSS y JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/Accessibility/WAI-ARIA_basics">Fundamentos WAI-ARIA</a></li>
+ <li><a href="/en-US/docs/Learn/Accessibility/Multimedia">Multimedia accesible</a></li>
+ <li><a href="/en-US/docs/Learn/Accessibility/Mobile">Accesibilidad móvil</a></li>
+ <li><a href="/en-US/docs/Learn/Accessibility/Accessibility_troubleshooting">Resolución de problemas de accesibilidad</a></li>
+</ul>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG">WCAG</a>
+
+  <ul>
+   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable">Perceptible</a></li>
+   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Operable">Operable</a></li>
+   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Understandable">Comprensible</a></li>
+   <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Robust">Robusto</a></li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/learn/aprender_y_obtener_ayuda/index.html b/files/es/learn/aprender_y_obtener_ayuda/index.html
deleted file mode 100644
index a7f06d90d8..0000000000
--- a/files/es/learn/aprender_y_obtener_ayuda/index.html
+++ /dev/null
@@ -1,321 +0,0 @@
----
-title: Aprender y obtener ayuda
-slug: Learn/Aprender_y_obtener_ayuda
-tags:
-  - Aprender
-  - Desarrollo web
-  - Principiante
-  - conseguir ayuda
-  - obtener ayuda
-translation_of: Learn/Learning_and_getting_help
----
-<p>{{learnsidebar}}</p>
-
-<p>Es genial que dediques algo de tiempo a aprender un nuevo conjunto de habilidades, pero puedes emplear algunas buenas prácticas que harán que tu aprendizaje sea más efectivo. También hay momentos en los que te atascarás y te sentirás frustrado, incluso los desarrolladores web profesionales se sienten así regularmente, y vale la pena conocer las formas más efectivas de tratar de obtener ayuda para que puedas progresar en tu trabajo. Este artículo proporciona algunos consejos y sugerencias en ambas áreas que te ayudarán a obtener más provecho del aprendizaje del desarrollo web, así como una lectura adicional para que puedas obtener más información sobre cada subtema si lo deseas.</p>
-
-<h2 id="Aprendizaje_efectivo">Aprendizaje efectivo</h2>
-
-<p>Sigamos adelante y pensemos en un aprendizaje efectivo.</p>
-
-<h3 id="Diferentes_métodos_de_aprendizaje">Diferentes métodos de aprendizaje</h3>
-
-<p>Es interesante considerar que hay dos formas principales en las que tu cerebro aprende cosas — el aprendizaje <strong>enfocado</strong> y el aprendizaje <strong>difuso</strong>:</p>
-
-<ul>
- <li>El aprendizaje enfocado es lo que tradicionalmente podrías asociar con las materias académicas. Te concentras profundamente en un tema de bajo nivel y resuelves los problemas específicos demostrando que eres muy capaz. Estás enfocado en una área estrecha.</li>
- <li>El aprendizaje difuso tiene más que ver con el pensamiento de alto nivel en un área más amplia. Dejas que tu mente divague más y aparentemente haces conexiones aleatorias entre diferentes cosas. Este es más el tipo de pensamiento que llevas a cabo mientras estás en la ducha o durante un descanso para tomar café.</li>
-</ul>
-
-<p>A partir de los estudios que los neurocientíficos han realizado sobre la actividad cerebral, hemos descubierto que realmente no se puede participar en ambas formas de aprendizaje, o de pensamiento simultáneamente. Entonces, ¿cuál debes elegir? Puedes pensar que el aprendizaje enfocado es mejor para estudiar, pero en realidad, <strong>ambos</strong> son muy importantes.</p>
-
-<p>El pensamiento enfocado es excelente para concentrarte mucho en temas específicos, profundizar en la resolución de problemas y mejorar tu dominio de las técnicas requeridas, fortaleciendo las vías neuronales en tu cerebro donde se almacena esa información. Sin embargo, no es muy bueno para entender "el panorama general" y desbloquear nuevas vías neuronales cuando intentas comprender nuevos temas o resolver nuevos problemas que no has encontrado antes.</p>
-
-<p>Para eso, necesitas un pensamiento difuso. Esto es lo opuesto al enfoque — dejas que tu cerebro divague por el paisaje más amplio, buscando conexiones que no tenías antes, tocando cosas nuevas (o nuevas combinaciones de cosas) en las que luego puedes concentrarte para fortalecerlas y empezar a entender realmente lo que significan.</p>
-
-<p>Es por eso que generalmente es bueno leer primero un material introductorio para obtener una comprensión de alto nivel de un área, antes de saltar a los detalles específicos.</p>
-
-<p>También es la razón por la que, a veces, puedes quedar realmente atrapado en un problema, pero luego averiguar la respuesta cuando vas a tomar un café (o a caminar). Podrías:</p>
-
-<ol>
- <li>Saber cómo solucionar el problema A con la herramienta A.</li>
- <li>Saber cómo solucionar el problema B con la herramienta B.</li>
- <li>No saber cómo solucionar el problema C.</li>
-</ol>
-
-<p>Supongamos que te enfocas en el problema C por un tiempo y te frustras porque no puedes encontrar la solución para resolverlo. Pero luego, después de caminar para tomar un poco de aire fresco, es posible que descubras que, mientras tu mente divaga, de repente estableces una conexión entre la herramienta A y la herramienta B, ¡y te das cuenta de que las puedes usar juntas para solucionar el problema C! No siempre es así de simple, pero también es sorprendente cuántas veces sucede. Esto también resalta la importancia de tomar descansos regulares cuando estás estudiando frente a la computadora.</p>
-
-<h3 id="Diferentes_materiales_de_aprendizaje">Diferentes materiales de aprendizaje</h3>
-
-<p>También vale la pena mirar los diferentes tipos de materiales de aprendizaje disponibles, para ver cuáles son los más efectivos para que aprendas.</p>
-
-<h4 id="Artículos_textuales">Artículos textuales</h4>
-
-<p>Encontrarás muchos artículos escritos en la web para enseñarte sobre diseño web. Como la mayor parte de este curso, por ejemplo. Algunos de los artículos serán tutoriales, para enseñarte una determinada técnica o concepto importante (como "<em>aprender a crear un reproductor de video</em>" o "<em>Aprender el modelo de cajas CSS</em>"), y algunos de los artículos serán material de referencia, para permitirte recordar detalles que hayas olvidado (como "<em>¿cuál es la sintaxis de la propiedad <code>background</code> de CSS</em>"?)</p>
-
-<p>MDN Web Docs es muy bueno para ambos tipos — el área en la que te encuentras actualmente es excelente para aprender técnicas y conceptos, y también tenemos varias secciones de referencia gigantes que te permiten buscar cualquier sintaxis que no puedas recordar.</p>
-
-<p>También hay varios otros recursos excelentes en la web, algunos de los cuales mencionaremos a continuación.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: el texto anterior debería haberte proporcionado un dato importante: <em>¡no se espera que recuerdes todo!</em> Los desarrolladores web profesionales todo el tiempo usan herramientas como <em>MDN Web Docs</em> para buscar cosas que han olvidado. Como descubrirás a lo largo de estas líneas, aprender desarrollo web tiene más que ver con la resolución de problemas y patrones de aprendizaje que con el aprendizaje de muchas sintaxis.</p>
-</div>
-
-<h4 id="Videos">Videos</h4>
-
-<p>También hay una serie de sitios que tienen contenido de aprendizaje de video en ellos. YouTube es obvio, con canales como <a href="https://www.youtube.com/channel/UC7TizprGknbDalbHplROtag" rel="noopener">Mozilla Layout Land</a>, <a href="https://www.youtube.com/MozillaDeveloper" rel="noopener">MozillaDeveloper</a> y <a href="https://www.youtube.com/user/ChromeDevelopers/" rel="noopener">Google ChromeDevelopers</a> que proporcionan muchos útiles videos. Muchas personas prefieren artículos textuales para un aprendizaje más profundo y material de referencia, y videos para explicaciones rápidas de conceptos y nuevas características, pero realmente depende de ti lo que prefieras aprender. Aquí no hay una respuesta correcta e incorrecta.</p>
-
-<h4 id="Código_de_juegos_interactivos">Código de juegos interactivos</h4>
-
-<p>Posiblemente seas el tipo de persona que prefiere instrucciones mínimas y preferirías saltar directamente y comenzar a jugar con el código. Este también es un enfoque razonable, y algunos sitios de aprendizaje tienden a favorecerlo. <a href="https://www.codecademy.com/" rel="noopener">Codecademy,</a> por ejemplo, es un sitio de aprendizaje donde los tutoriales consisten principalmente en editores de códigos interactivos en los que debes escribir directamente el código y ver si se logró el resultado deseado.</p>
-
-<p>Muchas páginas de referencia de documentos web de MDN también proporcionan ejemplos interactivos, donde puedes modificar el código y ver cómo cambia el resultado en vivo. Y tampoco hay nada de malo en crear tus propios ejemplos de código en tu computadora o en un editor de código en línea como <a href="https://jsbin.com/?html,css,js,output" rel="noopener">JSBin</a>, <a href="https://codepen.io/" rel="noopener">Codepen</a> o <a href="https://glitch.com/" rel="noopener">Glitch</a>. De hecho, ¡te invitarán a usarlos como parte de este curso cuando estés aprendiendo!</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Los editores de código en línea también son realmente útiles para compartir el código que has escrito, por ejemplo, si estás colaborando en el aprendizaje con otra persona que no se encuentra en la misma ubicación o se lo envías a alguien para pedir ayuda con eso. Puedes compartir la dirección web del ejemplo con ellos para que puedan verlo y ayudarte.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Es posible que prefieras un método de aprendizaje sobre los demás, pero, de manera realista, probablemente terminarás con un enfoque híbrido. Y probablemente se te ocurran otros métodos además de los tres que cubrimos anteriormente.</p>
-</div>
-
-<h3 id="Haz_un_plan">Haz un plan</h3>
-
-<p>Es una buena idea crear un plan para ayudarte a lograr lo que quieres conseguir a través de tu aprendizaje.</p>
-
-<h4 id="Una_declaración_de_objetivos">Una declaración de objetivos</h4>
-
-<p>Suena tonto, pero ¿por qué no comenzar con una sola oración que diga lo que quieres lograr? Los siguientes tienen diferentes ámbitos, pero todos son realistas y alcanzables:</p>
-
-<ul>
- <li>Quiero convertirme en un desarrollador web profesional dentro de dos años.</li>
- <li>Quiero aprender lo suficiente como para crear un sitio web para mi club de tenis amateur local.</li>
- <li>Quiero aprender HTML y CSS para poder ampliar mi rol de trabajo para encargarme de actualizar el contenido del sitio web de nuestra empresa.</li>
-</ul>
-
-<p>Los siguientes no son tan razonables:</p>
-
-<ul>
- <li>Quiero pasar de ser un principiante completamente novato a ser un desarrollador web senior en tres meses.</li>
- <li>Quiero comenzar mi propia empresa y construir una red social que supere a Facebook en dos años.</li>
-</ul>
-
-<h4 id="¿Qué_necesitas_para_llegar_allí">¿Qué necesitas para llegar allí?</h4>
-
-<p>Una vez que hayas descrito tu objetivo, es una buena idea investigar qué necesitarás para lograrlo. Por ejemplo:</p>
-
-<p>Materiales que necesito:</p>
-
-<ul>
- <li>Un ordenador</li>
- <li>Acceso a Internet</li>
- <li>Bolígrafos y papel</li>
-</ul>
-
-<p>Conocimiento que necesito:</p>
-
-<ul>
- <li>Cómo usar HTML, CSS, JavaScript y las herramientas asociadas y las mejores prácticas para crear sitios web y aplicaciones web (¡definitivamente te podemos ayudar con esto!).</li>
- <li>Cómo obtener un dominio, alojamiento y usarlos para poner un sitio web o una aplicación en línea.</li>
- <li>Cómo dirigir una pequeña empresa.</li>
- <li>Cómo publicitar tu negocio y atraer clientes.</li>
-</ul>
-
-<h4 id="¿Cuánto_tiempo_y_dinero_costará">¿Cuánto tiempo y dinero costará?</h4>
-
-<p>Calcula el tiempo y el costo para obtener estas cosas. Si necesitas trabajar para ganar dinero para comprar los materiales requeridos, entonces deberás tener en cuenta el tiempo para hacerlo. Una vez que tengas un estimado del tiempo, puedes comenzar a elaborar un plan para tu vida.</p>
-
-<h4 id="¿Cuántas_horas_por_semana_necesitas_invertir">¿Cuántas horas por semana necesitas invertir?</h4>
-
-<p>Una vez que sepas lo que necesitas hacer y cuánto tiempo crees que te llevará, puedes comenzar a escribir un plan a seguir para lograr tu objetivo. Puede ser tan simple como:</p>
-
-<p>"Me llevará 500 horas aprender lo que necesito saber, y tengo un año para hacerlo, así que si asumo 2 semanas de vacaciones, tendré que trabajar en esto durante 10 horas por semana. Estoy gratis por las tardes y fines de semana, así que planearé mi tiempo en torno a eso".</p>
-
-<p>La cantidad de tiempo que puedes dedicar a esto, por supuesto, depende de cuáles sean tus circunstancias. Si estás en la escuela, entonces tienes mucho más tiempo libre que si tienes un trabajo y niños que mantener. Todavía es posible lograr tus objetivos, pero debes ser realista sobre la rapidez con que puedes lograrlo.</p>
-
-<p>Si estás haciendo un curso colegial o universitario para aprender desarrollo web, entonces la mayor parte de esta planificación la haces tú, ¡qué suerte!</p>
-
-<p>Cuando hayas elaborado un horario semanal, debes mantener un registro de lo que logras hacer cada semana en una simple hoja de cálculo o incluso en un cuaderno.</p>
-
-<p>Además, sería una buena idea tener algunos objetivos secundarios resueltos que te permitan realizar fácilmente un seguimiento de dónde te encuentras, por ejemplo:</p>
-
-<ul>
- <li>Conceptos básicos de HTML y CSS aprendidos en verano</li>
- <li>Conceptos básicos de JavaScript aprendidos en Diciembre</li>
- <li>Ejemplo de proyecto del sitio web creado para el próximo mes de abril</li>
- <li>etc.</li>
-</ul>
-
-<p>Sigue pensando en cuánto progreso estás haciendo y ajusta tu plan si es necesario.</p>
-
-<h3 id="Mantente_motivado">Mantente motivado</h3>
-
-<p>Es difícil mantenerte motivado, especialmente si estás tratando de aprender una habilidad compleja como la programación o el desarrollo web. Lo que sigue son algunos consejos para mantenerte motivado y seguir trabajando:</p>
-
-<ul>
- <li><strong>Intenta que tu entorno de trabajo sea lo más productivo posible</strong>. Intenta conseguir un escritorio y una silla cómodos para trabajar, asegúrate de tener suficiente luz para ver lo que estás haciendo e intenta incluir cosas que te ayuden a concentrarte (por ejemplo, música suave, fragancias, cualquier otra cosa que necesites). No intentes trabajar en una habitación con distracciones, por ejemplo, un televisor encendido, ¡con tus amigos mirando fútbol! Además, deja tu teléfono móvil fuera de la habitación; la mayoría de las personas que lo tenemos nos distraemos mucho con el teléfono, por lo que debes dejarlo en otro lugar.</li>
- <li><strong>Tómate descansos regulares</strong>. No es bueno para tu motivación seguir trabajando durante horas sin descanso, especialmente si te resulta difícil o te estás quedando atrapado en un problema. Eso solo conduce a la frustración — a menudo, es mejor tomar un descanso, muévete un poco, luego relájate con una bebida antes de volver al trabajo, y como dijimos anteriormente, el aprendizaje difuso que haces en ese momento a menudo puede ayudarte para encontrar una solución al problema que estabas enfrentando. Además, físicamente es malo trabajar durante demasiado tiempo sin un descanso — mirar un monitor durante demasiado tiempo puede lastimar los ojos, y permanecer sentado demasiado tiempo puede ser malo para la espalda o las piernas. Recomendamos tomar un descanso de 15 minutos cada hora a 90 minutos.</li>
- <li><strong>Come, haz ejercicio y duerme</strong>. Come saludablemente, haz ejercicio regularmente y asegúrate de dormir lo suficiente. Esto suena obvio, pero es fácil olvidar cuando realmente te dedicas a la codificación. Incluye estos ingredientes esenciales en tu horario y asegúrate de no estar haciendo tu tiempo de aprendizaje en lugar de estas cosas.</li>
- <li><strong>Regálate recompensas</strong> . Es cierto que <em>todo trabajo y nada de juego hacen que Jack sea un niño aburrido</em>. Debes tratar de programar cosas divertidas para hacer después de cada sesión de aprendizaje, que solo tendrás cuando hayas terminado y completado el aprendizaje. Si realmente te gustan los juegos, por ejemplo, hay algo bastante motivador en decir "no jugaré esta noche a menos que termine mis 5 horas de aprendizaje". Ahora, todo lo que necesitas es fuerza de voluntad. ¡Buena suerte!</li>
- <li><strong>Coaprendizaje y demostración</strong>. Esta no será una opción para todos, pero si es posible, trata de aprender junto con otros. Una vez más, esto es más fácil si estás haciendo un curso universitario sobre desarrollo web, pero ¿tal vez podrías convencer a un amigo para que aprenda junto contigo? o encontrar una reunión local o un grupo de intercambio de habilidades. Es realmente útil y motivador tener a alguien con quien discutir ideas y pedir ayuda, y también debes tomarte el tiempo para demostrar tu trabajo. Esas palabras de agradecimiento te estimularán.</li>
-</ul>
-
-<h3 id="Resolución_de_problemas_eficaz">Resolución de problemas eficaz</h3>
-
-<p>No hay una única forma efectiva de resolver todos los problemas (y aprender todo) lo relacionado con el diseño y desarrollo web, pero hay algunos consejos generales que te servirán en la mayoría de los casos.</p>
-
-<h4 id="Romper_las_cosas_en_trozos">Romper las cosas en trozos</h4>
-
-<p>Para empezar, cuando intentas implementar algo específico y parece realmente difícil entenderlo, debes tratar de dividirlo en múltiples problemas o fragmentos más pequeños.</p>
-
-<p>Por ejemplo, si estás considerando la tarea de "Crear un sitio web simple de dos columnas", la puedes desglosar de la siguiente manera:</p>
-
-<ul>
- <li>Crea la estructura HTML</li>
- <li>Resuelve la tipografía básica del sitio</li>
- <li>Elabora un esquema de color básico</li>
- <li>Implementa un diseño de alto nivel: encabezado, menú de navegación horizontal, área de contenido principal con columnas principales y laterales y pie de página.</li>
- <li>Implementa un menú de navegación horizontal.</li>
- <li>etc.</li>
-</ul>
-
-<p>Luego, podrías desglosarlo aún más, por ejemplo, "Implementar menú de navegación horizontal" podría escribirse como:</p>
-
-<ul>
- <li>Haz una lista de los elementos del menú situados horizontalmente en una línea.</li>
- <li>Elimina los valores predeterminados innecesarios, como el espaciado de las listas y viñetas.</li>
- <li>Estiliza el cursor/enfoque/estados activos de los elementos del menú adecuadamente.</li>
- <li>Haz los elementos del menú igualmente espaciados a lo largo de la línea.</li>
- <li>Da a los elementos del menú suficiente espacio vertical.</li>
- <li>Asegúrate de que el texto esté centrado dentro de cada elemento del menú</li>
- <li>etc.</li>
-</ul>
-
-<p>Cada uno de estos problemas no parece tan difícil de resolver como el gran problema que tuviste inicialmente. ¡Ahora solo tienes que empezar a resolverlos todos!</p>
-
-<h4 id="Aprende_y_reconoce_los_patrones">Aprende y reconoce los patrones</h4>
-
-<p>Como dijimos antes, el diseño/programación web se trata principalmente de resolución de problemas y patrones. Una vez que hayas escrito lo que necesitarás hacer para resolver un problema específico, puedes comenzar a descubrir qué características tecnológicas usar para resolverlo. Por ejemplo, los desarrolladores web profesionales han creado muchos menús de navegación horizontal, por lo que inmediatamente comenzarás a pensar en una solución como esta:</p>
-
-<p>Un menú de navegación generalmente se crea a partir de una lista de enlaces, algo así como:</p>
-
-<pre class="brush: html notranslate">&lt;ul&gt;
-  &lt;li&gt;Primer elemento del menú&lt;/li&gt;
-  &lt;li&gt;Segundo elemento del menú&lt;/li&gt;
-  &lt;li&gt;Tercer elemento del menú&lt;/li&gt;
-  &lt;li&gt;etc.&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-
-<p>Para hacer que todos los elementos se asienten horizontalmente en una línea, la forma moderna más fácil es usar flexbox:</p>
-
-<pre class="notranslate">ul {
-  display: flex;
-}</pre>
-
-<p>Para eliminar el espacio innecesario y las viñetas, podemos hacer esto:</p>
-
-<pre class="notranslate">ul {
-  list-style-type: none;
-  padding: 0;
-}</pre>
-
-<p>etc.</p>
-
-<p>Si realmente eres un principiante en el desarrollo web, tendrás que estudiar y buscar en la web y encontrar soluciones para tales problemas. Si eres un desarrollador web profesional, probablemente recordarás la última vez que resolviste un problema similar, y solo tendrás que buscar algunos bits de la sintaxis que olvidaste desde entonces.</p>
-
-<p>Cuando encuentres soluciones a tales problemas, vale la pena escribir notas sobre lo que hiciste y mantener algunos ejemplos de código mínimos en un directorio en algún lugar para que puedas mirar hacia atrás en el trabajo anterior.</p>
-
-<p>Además, la web tiene {{web.link("/es/docs/Learn/Common_questions/What_are_browser_developer_tools", "herramientas de desarrollo")}} que te permiten ver el código utilizado para crear cualquier sitio en la web, si no tienes una solución a mano, un buen método de investigación es encontrar sitios web con características similares en la naturaleza y averiguar cómo lo hicieron.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Observa cómo hablamos antes sobre el problema que estamos tratando de resolver primero, y la tecnología utilizada para resolverlo, en segundo lugar. Esta, casi siempre es la mejor manera de hacerlo — no comiences con una tecnología nueva y genial que desees usar, e intenta adaptarla a tu caso de uso.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: La solución más sencilla suele ser la mejor.</p>
-</div>
-
-<h3 id="Practica">Practica</h3>
-
-<p>Cuanto más practiques la resolución de un problema, más fuertes serán las vías neuronales de tu cerebro en esa área y más fácil será recordar los detalles y la lógica de ese problema en particular.</p>
-
-<p>Sigue jugando con el código y practica más. Si se te acaban los problemas por resolver, busca algunas pruebas en línea, realiza algunos cursos más o pregunta a tus amigos y familiares (o escuela, o iglesia local) si hay algo que les gustaría que construyeras para ellos.</p>
-
-<h2 dir="ltr" id="Obtener_ayuda">Obtener ayuda</h2>
-
-<p dir="ltr">El desarrollo web requiere que aprendas un complejo conjunto de habilidades — a veces estarás atascado y necesitarás ayuda. Como dijimos antes, incluso los desarrolladores profesionales regularmente necesitan ayuda para resolver problemas.</p>
-
-<p dir="ltr">Hay una variedad de formas de obtener ayuda, y la siguiente información son algunos consejos para hacerlo de manera más efectiva.</p>
-
-<h3 dir="ltr" id="Búsquedas_web_efectivas">Búsquedas web efectivas</h3>
-
-<p dir="ltr">Una habilidad importante para aprender es el arte de las búsquedas web efectivas — ¿qué términos de búsqueda necesitas usar en tu motor de búsqueda favorito para encontrar los artículos que necesitas?</p>
-
-<p dir="ltr">A menudo es bastante obvio qué buscar. Por ejemplo:</p>
-
-<ul dir="ltr">
- <li>Si deseas obtener más información sobre el diseño web receptivo, puedes buscar "diseño web receptivo".</li>
- <li>Si deseas obtener más información sobre una característica tecnológica específica, como el elemento HTML <code>&lt;video&gt;</code>, el <code>background-color</code> o las propiedades <code>opacity</code> de CSS, o el método <code>Date.setTime()</code> de JavaScript, debes buscar el nombre de la característica.</li>
- <li>Si estás buscando información más específica, puedes agregar otras palabras clave como modificadores, por ejemplo, "atributo de reproducción automática de elementos &lt;video&gt;" o "Parámetros Date.setTime".</li>
-</ul>
-
-<p dir="ltr">Si deseas buscar algo que tenga palabras de moda menos obvias, debes pensar en qué es más probable que te devuelva lo que deseas.</p>
-
-<ul dir="ltr">
- <li>Ejecuta el código después de cumplir varias promesas</li>
- <li>Reproduce una transmisión de video desde una cámara web en el navegador</li>
- <li>Crea un degradado lineal en el fondo de tu elemento</li>
-</ul>
-
-<h4 id="Mensajes_de_error">Mensajes de error</h4>
-
-<p>Si tienes un problema con algún código y aparece un mensaje de error específico, a menudo es una buena idea copiar el mensaje de error en tu motor de búsqueda y utilizarlo como término de búsqueda. Si otras personas han tenido el mismo problema, es probable que haya algunos artículos o publicaciones de blog al respecto en lugares como MDN o Stack Overflow.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: <a href="https://stackoverflow.com/">Stack Overflow</a> es un sitio web realmente útil; básicamente es una enorme base de datos de preguntas y respuestas seleccionadas sobre diversas tecnologías y técnicas relacionadas. Probablemente encontrarás una respuesta que responda a tu pregunta. Si no, puedes hacer una pregunta y ver si alguien puede ayudarte.</p>
-</div>
-
-<h4 id="Prueba_en_el_navegador">Prueba en el navegador</h4>
-
-<p dir="ltr">A menudo es una buena idea ver si tu problema está afectando a todos los navegadores, o si solo ocurre en uno o en un pequeño número de navegadores. Si solo afecta a un navegador, por ejemplo, puedes usar ese navegador para limitar la búsqueda. Las búsquedas de ejemplo podrían verse así:</p>
-
-<ul dir="ltr">
- <li>La reproducción de &lt;video&gt; no funciona en el navegador iOS.</li>
- <li>Firefox no parece admitir la API de Beetlejuice.</li>
-</ul>
-
-<h3 dir="ltr" id="Usa_MDN">Usa MDN</h3>
-
-<p dir="ltr">El sitio en el que ya estás tiene una gran cantidad de información disponible, tanto material de referencia para buscar la sintaxis del código como guías/tutoriales para aprender técnicas.</p>
-
-<p dir="ltr">Hemos proporcionado la mayoría de las respuestas a las preguntas que tendrás sobre los fundamentos del desarrollo web en esta parte de MDN. Si estás atascado, es bueno volver a leer los artículos asociados para ver si te perdiste algo.</p>
-
-<p dir="ltr">Si no estás seguro de qué artículo leer, intenta buscar en MDN algunas palabras clave relacionadas (como se indicó anteriormente), o intenta una búsqueda web general. Para buscar en MDN, puedes usar la funcionalidad de búsqueda incorporada del sitio o mejor aún, usar tu motor de búsqueda favorito y poner "mdn" delante del término de búsqueda, por ejemplo, "diseño web receptivo mdn" o "backgrounf-color mdn".</p>
-
-<h3 dir="ltr" id="Otros_recursos_en_línea">Otros recursos en línea</h3>
-
-<p>Ya mencionamos Stack Overflow, pero hay otros recursos en línea que pueden ayudar.</p>
-
-<p>Es bueno encontrar una comunidad de la que formar parte, y obtendrás mucho respeto si intentas ayudar a otros a responder sus preguntas y también a hacer las tuyas. Otros buenos ejemplos incluyen:</p>
-
-<ul dir="ltr">
- <li><a href="https://discourse.mozilla.org/c/mdn" rel="noopener">Discurso MDN</a></li>
- <li><a href="https://www.sitepoint.com/community/" rel="noopener">Foros de Sitepoint</a></li>
- <li><a href="https://www.webdeveloper.com/" rel="noopener">Foros de webdeveloper.com</a></li>
-</ul>
-
-<p dir="ltr">Sin embargo, también tiene sentido encontrar grupos útiles en sitios de redes sociales como Twitter o Facebook. Busca grupos que discutan los temas de desarrollo web que te interesen y únete. Sigue a las personas en Twitter que sabes que son influyentes, inteligentes o simplemente parecen compartir muchos consejos útiles.</p>
-
-<h3 dir="ltr" id="Encuentros_físicos">Encuentros físicos</h3>
-
-<p dir="ltr">Por último, deberías intentar asistir a algunas reuniones físicas para conocer a otras personas de ideas afines, especialmente aquellas que atienden a principiantes. <a href="https://www.meetup.com/find/tech/" rel="noopener">meetup.com</a> es un buen lugar para encontrar reuniones físicas locales, y también puedes probar tu prensa local o lo que hay en los sitios.</p>
-
-<p dir="ltr">También puedes intentar asistir a conferencias web completas. Si bien estas pueden ser costosas, puedes intentar ofrecerte como voluntario con ellos, y muchas conferencias ofrecen boletos de tarifa reducida, por ejemplo, boletos de estudiante o diversidad.</p>
-
-<h2 dir="ltr" id="Ve_también">Ve también</h2>
-
-<ul dir="ltr">
- <li><a href="https://www.coursera.org/learn/learning-how-to-learn" rel="noopener">Coursera: aprende a aprender</a></li>
- <li><a href="https://www.freecodecamp.org/" rel="noopener">Freecodecamp</a></li>
- <li><a href="https://www.codecademy.com/" rel="noopener">Codecademy</a></li>
-</ul>
diff --git a/files/es/learn/codificacion-scripting/index.html b/files/es/learn/codificacion-scripting/index.html
deleted file mode 100644
index 0092ba899e..0000000000
--- a/files/es/learn/codificacion-scripting/index.html
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Codificación-Scripting
-slug: Learn/codificacion-scripting
-tags:
-  - Codificación
-  - Principiante
-  - Scripting
-translation_of: Learn
-translation_of_original: Learn/Coding-Scripting
----
-<p>REDIRIGE <a href="/es/docs/Learn">Aprende</a></p>
diff --git a/files/es/learn/common_questions/common_web_layouts/index.html b/files/es/learn/common_questions/common_web_layouts/index.html
new file mode 100644
index 0000000000..5c78b094cd
--- /dev/null
+++ b/files/es/learn/common_questions/common_web_layouts/index.html
@@ -0,0 +1,116 @@
+---
+title: ¿Qué contienen los diseños web comunes?
+slug: Learn/Common_questions/Common_web_layouts
+tags:
+  - CSS
+  - Común
+  - Diseño
+  - Diseño Común
+  - HTML
+  - Principiante
+translation_of: Learn/Common_questions/Common_web_layouts
+original_slug: Learn/Common_questions/diseños_web_comunes
+---
+<div>{{IncludeSubnav("/en-US/Learn")}}</div>
+
+<div class="summary">
+<p>Cuando diseña páginas para su sitio web es bueno tener una idea de los diseños más comunes.</p>
+</div>
+
+<table class="learn-box nostripe standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Asegúrese que usted ya ha pensado sobre <a href="/es/docs/Learn/Common_questions/Thinking_before_coding">lo que quiere lograr</a> con su proyecto web.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender dónde colocar las cosas en sus páginas web, y cómo hacerlo. </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Existe una razón para que hablemos sobre diseño web. Se comienza con una página en blanco, y se pueden tomar muchas direcciones. Si no tienes mucha experiencia, comenzar con una página en blanco pudiera ser un poco temible. Nosotros tenemos alrededor de 25 años de experiencia y te daremos algunas reglas básicas para ayudarte a diseñar tu sitio. </p>
+
+<p>Aún ahora con el nuevo enfoque de la web para móviles, la mayoría de las páginas web principales son construídas a partir de las siguientes partes:</p>
+
+<dl>
+ <dt>Encabezado</dt>
+ <dd>Visible en la parte superior de cada página de un sitio. Contiene información relevante para todas las páginas (como el nombre del sitio o el logo) y un sistema de navegación fácil de usar.</dd>
+ <dt>Contenido principal</dt>
+ <dd>Es el área más grande, contiene contenido único para la página actual.</dd>
+ <dt>Contenido secundario</dt>
+ <dd>1) Información complementaria del contenido principal; 2) información compartida entre un subconjunto de páginas; 3) sistema de navegación alternativo. De hecho, todo lo que no es absolutamente requerido por el contenido de la página principal. </dd>
+ <dt>Pie de página</dt>
+ <dd>Visible en la parte inferior de cada página de un sitio. Análogamente al encabezado contiene información global, en este caso menos llamativa como avisos legales o información de contacto.</dd>
+</dl>
+
+<p>Estos elementos son bastante comunes en todos los factores de forma, pero pueden ser dispuestos de diferentes maneras. Aquí se presentan algunos ejemplos (<strong>1 </strong>representa encabezado, <strong>2 </strong>pie de página; <strong>A </strong>contenido principal; <strong>B1, B2 </strong>barras laterales):</p>
+
+<p><strong>Diseño de una columna.</strong> Especialmente importante para navegadores de móviles de modo que no se llene la pequeña pantalla.</p>
+
+<p><img alt="Example of a 1 column layout: Main on top and asides stacked beneath it." src="https://mdn.mozillademos.org/files/9501/1-col-layout.png" style="height: 100px; width: 160px;"></p>
+
+<p><strong>Diseño de dos columnas.</strong> A menudo utilizado para tabletas, ya que tienen pantallas de tamaño medio.</p>
+
+<p> <img alt="Example of a basic 2 column layout: One aside on the left column, and main on the right column." src="https://mdn.mozillademos.org/files/9499/2-col-layout-right.png" style="height: 100px; width: 160px;"> <img alt="Example of a basic 2 column layout: One aside on the right column, and main on the left column." src="https://mdn.mozillademos.org/files/9497/2-col-layout-left.png" style="height: 100px; width: 160px;"></p>
+
+<p><strong>Diseños de tres columnas</strong>. Solamene adecuado para escritorios con pantallas grandes. (Incluso muchos usuarios de escritorio prefieren ver cosas en pequeñas ventanas que en pantalla completa.)</p>
+
+<p><img alt="Example of a basic 3 column layout: Aside on the left and right column, Main on the middle column." src="https://mdn.mozillademos.org/files/9491/3-col-layout.png" style="height: 100px; width: 160px;"> <img alt="Another example of a 3 column layout: Aside side by side on the left, Main on the right column." src="https://mdn.mozillademos.org/files/9493/3-col-layout-alt.png" style="height: 100px; width: 160px;"> <img alt="Another example of a 3 column layout: Aside side by side on the right, Main on the left column." src="https://mdn.mozillademos.org/files/9495/3-col-layout-alt2.png" style="height: 100px; width: 160px;"></p>
+
+<p>La verdadera diversión comienza cuando empiezas a mezclarlos todos juntos.</p>
+
+<p><img alt="Example of mixed layout: Main on top and asides beneath it side by side." src="https://mdn.mozillademos.org/files/9503/1-col-layout-alt.png" style="height: 100px; width: 160px;"> <img alt="Example of a mixed layout: Main on the left column and asides stack on top of each other on the right column" src="https://mdn.mozillademos.org/files/9505/2-col-layout-left-alt.png" style="height: 100px; width: 160px;"> <img alt="Example of a mixed layout: one aside on the left column and main in the right column with a aside beneath main." src="https://mdn.mozillademos.org/files/9507/2-col-layout-mix.png" style="height: 100px; width: 160px;"> <img alt="Example of a mixed layout: Main on the left of the first row and one aside on the right of that same row, a second aside convering the whole second row." src="https://mdn.mozillademos.org/files/9509/2-col-layout-mix-alt.png" style="height: 100px; width: 160px;">…</p>
+
+<p>Estos son solo ejemplos y eres bastante libre de diseñar las cosas como quieras. Puedes notar que mientras el contenido se puede mover alrededor de la pantalla, siempre se mantiene el encabezado (1) en la parte superior y el pie de página (2) en la parte inferior. Además, el contenido principal (A) es lo más importante, así que dale la mayor parte del espacio. </p>
+
+<p>Estas son reglas del juego que puedes aprovechar. Desde luego, existen diseños complejos y excepciones. En otros artículos discutiremos cómo diseñar sitios responsivos (sitios que cambian en dependencia del tamaño de la pantalla) y sitios cuyos diseños varían entre las páginas. Por ahora, es mejor mantener tu diseño consistente en todo tu sitio. </p>
+
+<h2 id="Aprendizaje_activo">Aprendizaje activo</h2>
+
+<p><em>Aún no hay aprendizaje activo disponible. <a href="/en-US/docs/MDN/Getting_started">Por favor, considere contribuir</a>.</em></p>
+
+<h2 id="Profundización">Profundización</h2>
+
+<p>Estudiemos algunos ejemplos más concretos tomados de sitios web bien conocidos. </p>
+
+<h3 id="Diseño_de_una_columna">Diseño de una columna</h3>
+
+<p><strong><a href="http://www.invisionapp.com/" rel="external">Aplicación de Invision</a></strong>. Un diseño típico de una columna proporcionando toda la información linealmente en una sola página. </p>
+
+<p><img alt="Example of a 1 column layout in the wild" src="https://mdn.mozillademos.org/files/9523/screenshot-product.jpg" style="height: 643px; width: 200px;">        <img alt="1 column layout with header, main content, a stack of aside contents and a footer" src="https://mdn.mozillademos.org/files/9525/screenshot-product-overlay.jpg" style="height: 643px; width: 200px;"></p>
+
+<p>Bastante sencillo. Sólo recuerda que muchas personas navegarán por tu sitio desde escritorios, así que haz tu contenido también utilizable allí.</p>
+
+<h3 id="Diseño_de_dos_columnas.">Diseño de dos columnas.</h3>
+
+<p><strong><a href="http://abduzeedo.com/typography-mania-261" rel="external">Abduzeedo</a></strong>, un simple diseño de blog. Los blogs usualmente tienen dos columnas, una para el contenido principal que es más ancha y otra más estrecha para el contenido secundario (como widgets, niveles de navegación secundarios y anuncios). </p>
+
+<p><img alt="Example of a 2 column layout for a blog" src="https://mdn.mozillademos.org/files/9527/screenshot-blog.jpg" style="height: 643px; width: 200px;">        <img alt="A 2 column layout with the main content on the left column" src="https://mdn.mozillademos.org/files/9529/screenshot-blog-overlay.jpg" style="height: 643px; width: 200px;"></p>
+
+<p>En este ejemplo, mira la imagen (B1) justo debajo del encabezado. Está relacionada con el contenido principal, pero el contenido principal tiene sentido sin esta, de este modo pudieras pensar que la imagen forma parte del contenido principal o del lateral. En realidad no importa. Lo que importa es que si pones algo justo debajo del encabezado, debería ser parte del contenido principal o estar directamente relacionado con este. </p>
+
+<h3 id="Es_una_trampa">Es una trampa</h3>
+
+<p><strong><a href="http://www.mica.edu/About_MICA.html" rel="external">MICA</a></strong>. Este es un poco más complicado. Parece un diseño de tres columnas...</p>
+
+<p><img alt="Example of a false 3 columns layout" src="https://mdn.mozillademos.org/files/9531/screenshot-education.jpg" style="height: 267px; width: 200px;">        <img alt="It looks like a 3 columns layout but actually, the aside content is floating around." src="https://mdn.mozillademos.org/files/9533/screenshot-education-overlay.jpg" style="height: 267px; width: 200px;"></p>
+
+<p>...pero no lo es. B1 y B2 flotan alrededor del contenido principal. Recuerda esa palabra "float"--te acordarás cuando empieces a aprender sobre {{Glossary("CSS")}}.</p>
+
+<p>¿Por qué pensarías que es un diseño de tres columnas? Porque la imagen en la parte superior derecha está en forma de L, porque B1 parece una columna sosteniendo el conenido principal desplazado, y porque la "M" y la  "I" del logo MICA crean una línea de fuerza vertical.</p>
+
+<p>Este es un buen ejemplo de diseño clásico que admite cierta creatividad. Los diseños simples son más fáciles de implementar, pero deje espacio expresar su creatividad en el área.</p>
+
+<h3 id="Un_diseño_mucho_más_complicado">Un diseño mucho más complicado</h3>
+
+<p><strong>La <a href="https://www.operadeparis.fr/en/saison-2014-2015/opera/la-boheme-puccini" rel="external">Opera de Paris</a>.</strong></p>
+
+<p><img alt="An example of a tricky layout." src="https://mdn.mozillademos.org/files/9535/screenshot-opera.jpg" style="height: 424px; width: 200px;">        <img alt="This is a 2 column layout but the header is overlaping the main content." src="https://mdn.mozillademos.org/files/9537/screenshot-opera-overlay.jpg" style="height: 424px; width: 200px;"></p>
+
+<p>Básicamente un diseño de dos columnas, pero notarás muchos ajustes por aquí y por allá que rompen visualmente el diseño. Especialmente, el encabezado se superposiciona a la imagen del contenido principal. La manera en que la curva del menú del encabezado se une con la curva en el fondo de la imagen, hacen que el encabezado y el contenido principal parezcan un solo componente a pesar de que son técnicamente completamente distintos. </p>
+
+<p>Como ves, puedes crear maravillosos sitios web incluso sólo con diseños básicos. Échale una mirada a tus propios sitos web favoritos y pregúntate a ti mismo, ¿dónde está el encabezado, el pie de página, el contenido principal y el contenido secundario? Esto te inspirará para tu propio diseño y te dará buenas pistas sobre para cuáles diseños funciona y para cuáles no. </p>
diff --git a/files/es/learn/common_questions/cuanto_cuesta/index.html b/files/es/learn/common_questions/cuanto_cuesta/index.html
deleted file mode 100644
index aeffd72c64..0000000000
--- a/files/es/learn/common_questions/cuanto_cuesta/index.html
+++ /dev/null
@@ -1,162 +0,0 @@
----
-title: ¿Cuánto cuesta hacer algo en la Web?
-slug: Learn/Common_questions/Cuanto_cuesta
-tags:
-  - Comenzando
-  - Herramientas de desarrollo web
-  - Principiante
-  - alojamiento
-  - costo
-  - hosting
-translation_of: Learn/Common_questions/How_much_does_it_cost
----
-<div class="summary">
-<p>Dedicarse a la web no es tan barato como parece. En este artículo discutimos cuánto puedes tener que gastar, y por qué.</p>
-</div>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Deberías ya entender <a href="/en-US/Learn/What_software_do_I_need">qué software necesitas</a>, la diferencia entre <a href="/en-US/Learn/page_vs_site_vs_server_vs_search_engine">una página web, un sitio web, etc</a>., y qué <a href="/en-US/Learn/Understanding_domain_names">es un nombre de dominio</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Examina el proceso completo para crear un sitio web y descubre cuánto te puede costar cada paso.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p><span class="seoSummary">Al lanzar un sitio web, puedes no gastar nada, o puede que el costo sea muy elevado. En este artículo discutimos acerca de cuánto cuesta todo y cómo obtienes lo que pagas (o no pagas).</span></p>
-
-<h2 id="Software">Software</h2>
-
-<h3 id="Editores_de_texto">Editores de texto</h3>
-
-<p>Probablemente tienes un editor de texto: tal como Notepad en Windows, Gedit en Linux, TextEdit en Mac. Le resultará más fácil escribir código si elige un editor que coloree el código, chequee la sintaxis y te ayude a mantener la estructura del programa. </p>
-
-<p>Muchos editores son gratis, por ejemplo <a href="https://atom.io/">Atom</a>, <a href="http://brackets.io/">Brackets</a>, <a href="http://bluefish.openoffice.nl/">Bluefish</a>, <a href="http://www.barebones.com/products/textwrangler/">TextWrangler</a>, <a href="http://eclipse.org/">Eclipse</a>, y <a href="https://netbeans.org/">Netbeans</a>. Algunos, como <a href="http://www.sublimetext.com/">Sublime Text</a>, los puedes probar tanto como quieras, pero se te anima a pagar. Otros, como <a href="https://www.jetbrains.com/phpstorm/">PhpStorm</a>, pueden costar entre unas pocas docenas y 200 dólares, en dependencia del plan que pague. Algunos de ellos, como <a href="http://www.visualstudio.com/">Microsoft Visual Studio</a>, pueden costar cientos o miles de dólares; aunque Visual Studio Express is gratis para desarrolladores individuales o proyectos de código abierto. A menudo, los editores pagados tienen una versión de prueba.</p>
-
-<p>Para comenzar, le segerimos probar con diferentes editores, para tener un indicio de cuál trabaja mejor para ti. Si está solamente escribiendo código simple de {{Glossary("HTML")}}, {{Glossary("CSS")}}, and {{Glossary("Javascript")}}, utilice un editor sencillo.</p>
-
-<p>El el precio no refleja de manera confiable la calidad o utilidad de un editor de texto. Tienes que probarlo por ti mismo y decidir si se ajusta a tus necesidades. Por ejemplo, Sublime Text es barato, pero tiene muhos plugins gratis que pueden extender su funcionalidad. </p>
-
-<h3 id="Editores_de_imágenes">Editores de imágenes</h3>
-
-<p>Tu sistema incluye seguramente un simple editor de imágenes, o visor: Paint en Windows, Eye of Gnome en Ubuntu, Preview en Mac. Estos programas son relativamente limitados, pronto gustarás tener un editor más potente para añadir capas, efectos y agrupamiento de imágenes.</p>
-
-<p>Los editores pueden ser gratis (<a href="http://www.gimp.org/">GIMP</a>, <a href="https://www.getpaint.net/">Paint.NET</a>), de costo moderado (<a href="http://www.paintshoppro.com/">PaintShop Pro</a>, menos de $100), o cientos de dólares (<a href="https://www.adobe.com/products/photoshop.html">Adobe Photoshop</a>).</p>
-
-<p>Puedes usar cualquiera de ellos, ya que tienen funciones similares, aunque algunos son tan completos que nunca vas a utilizar cada característica. Si en algún punto necesitas intercambiar proyectos con otros diseñadores, deberías descubrir qué herramientas utilizan. Los editores pueden exportar los proyectos finalizados a formatos de archivo estándares, pero cada editor guarda los proyectos actuales en su formato especializado. La mayoría de las imágenes en Internet están protegidas por los derechos de autor, por lo que es mejor chequear la licencia del aechivo antes de utilizarlo. Sitios como <a href="https://pixabay.com/">Pixabay</a> proporcionan imágenes bajo la licencia CC0, así que la puedes usar, editar y publicar incluso con modificaciones para uso comercial.</p>
-
-<h3 id="Editores_de_medios">Editores de medios</h3>
-
-<p>Si desea incluir video o audio en su sitio web, puede incrustar servicios online (por ejemplo YouTube, Vimeo, or Dailymotion), o incluir sus propios videos (ver más abajo los costos de ancho de banda).</p>
-
-<p>Para archivos de audio, puede encontrar software gratuito(<a href="http://audacity.sourceforge.net/?lang=en">Audacity</a>, <a href="http://www.wavosaur.com/">Wavosaur</a>), o pagar hasta unos poco cientos de dólares (<a href="http://www.sonycreativesoftware.com/soundforge">Sony Sound Forge</a>, <a href="http://www.adobe.com/products/audition.html">Adobe Audition</a>). Sin embargo, el software de edición de vídeo puede ser gratis (<a href="http://www.pitivi.org/">PiTiVi</a>, <a href="http://www.openshot.org/">OpenShot</a> for Linux, <a href="https://www.apple.com/mac/imovie/">iMovie</a> for Mac), menos de $100 (<a href="https://www.adobe.com/us/products/premiere-elements.html">Adobe Premiere Elements</a>), o varios cientos de dólares (<a href="https://www.adobe.com/products/premiere.html">Adobe Premiere Pro</a>, <a href="http://www.avid.com/US/products/family/Media-Composer">Avid Media Composer</a>, <a href="https://www.apple.com/final-cut-pro/">Final Cut Pro</a>). El software recibido con tu cámara digital puede cubrir todas tus necesidades.</p>
-
-<h3 id="Herramientas_de_publicación">Herramientas de publicación</h3>
-
-<p>Además necesitas una forma de subir archivos: desde tu disco duro a un servidor web distante. Para hacer esto deberías utilizar una herramienta de publicación tal como un cliente  (S)<a href="/en-US/docs/Glossary/FTP">FTP</a>, <a href="https://en.wikipedia.org/wiki/Rsync">RSync</a>, o <a href="https://help.github.com/articles/using-a-custom-domain-with-github-pages/">Git/GitHub</a>.</p>
-
-<p>Cada sistema operativo incluye un cliente (S)FTP, como parte de su administrador de archivos. Windows Explorer, Nautilus (un administrador de archivos común en Linux), y Mac Finder inclueyen todos esta funcionalidad. Sin embargo, las personas a menudo seleccionan clientes (S)FTP dedicados a mostrar directorios locales y remotos y almacenar contraseñas de servidor.</p>
-
-<p>Si desea instalar un cliente (S)FTP, existen varias opciones seguras y gratuitas: por ejemplo, <a href="https://filezilla-project.org/">FileZilla</a> para todas las plataformas, <a href="http://winscp.net/">WinSCP</a> para Windows, <a href="https://cyberduck.io/">Cyberduck</a> para Mac o Windows, <a href="https://en.wikipedia.org/wiki/List_of_FTP_server_software">y otros más</a>.</p>
-
-<p>Debido a que el protocolo FTP es inseguro, deberías asegurarte de utilizar SFTP — la versión segura, encriptada de FTP que la mayoría de los sitios de alojamiento (en inglés <em>hosting</em>) actuales ofrecen por defecto— u otra solución segura como Rsync sobre SSH.</p>
-
-<h2 id="Navegadores">Navegadores</h2>
-
-<p>Ya debes tener un navegador o puedes conseguirlo gratuito. Si lo necesitas, descarga Firefox <a href="https://www.mozilla.org/en-US/firefox/all/">aquí</a> o Google Chrome <a href="https://www.google.com/chrome/browser/">aquí</a>.</p>
-
-<h2 id="Acceso_a_la_web">Acceso a la web</h2>
-
-<h3 id="Computadora_módem">Computadora / módem</h3>
-
-<p>Necesitas una computadora. El costo puede variar mucho, en dependencia de tu presupuesto, y dónde vivas. Para publicar un sitio web básico, sólo necesitas una computadora básica capaz de ejecutar, por lo que el nivel de entrada puede ser bastante bajo. </p>
-
-<p>Por supuesto, necesitarás una computadora más formal si quieres producir diseños complicados, retocar fotos, o producir archivos de audio y vídeo. </p>
-
-<p>Necesitas subir contenido a un servidor remoto (ver <em>Alojamiento</em> más abajo), por lo que necesitas un módem.Tu proveedor {{Glossary("ISP")}} puede venderte la conexión a internet por unos pocos dólares al mes, aunque tu presupuesto pudiera variar, en dependencia de tu localización.</p>
-
-<h3 id="Acceso_del_Proveedor_ISP">Acceso del Proveedor ISP</h3>
-
-<p>Asegúrese de contar con suficiente {{Glossary("Ancho de banda", "ancho de banda")}}:</p>
-
-<ul>
- <li>El acceso de ancho de banda bajo puede ser adecuado para soportar un sitio web simple: imágenes reducidas, textos, algunos archivos CSS y JavaScript. Esto probablemente te cueste unas pocas docenas de dólares, incluyendo la renta del módem.</li>
- <li>De otra manera, necesitarás un ancho de banda superior, tal como acceso por DSL, cable, o fibra, si desea un sitio web más avanzado con cientos de archivos o quiere entregar archivos pesados de vídeo/audio directamente desde tu servidor. Te pudiera costar lo mismo que el acceso de ancho de banda bajo, hasta varios cientos de dólares mensuales para necesidades más profesionales. </li>
-</ul>
-
-<h2 id="Alojamiento">Alojamiento</h2>
-
-<h3 id="Entendiendo_el_ancho_de_banda">Entendiendo el ancho de banda</h3>
-
-<p>Los proveedores de alojamiento te cobran de acuerdo a cuánto {{Glossary("Ancho de banda", "ancho de banda")}} consume tu sitio web. . Esto depende de cuántas personaas, y robots de rastreo Web, accedan a tu contenido durante un tiempo dado, y cuánto espacio en el servidor tu contenido ocupa. Esta es la razón por la cual las personas usualmente almacenan sus videos en servicios dedicadostales como Youtube, Dailymotion, y Vimeo. Por ejemplo, tu proveedor puede tener un plan que incluye hasta varios miles de visitantes por díam por un uso “razonable”. Sea cuidadoso, puesto que puede variar mucho de un servidor de alojamiento a otro. Como regla de oro, reconozca que el servicio de alojamiento confiable, pagado y personal puede costar alrededor de 10 a 15 dólares al mes. </p>
-
-<div class="note">
-<p>Note que que no existe el ancho de banda “ilimitado”. Si consumes una enorme cantidad de ancho de banda, espere pagar una enorme cantidad de dinero.</p>
-</div>
-
-<h3 id="Nombre_de_dominio">Nombre de dominio</h3>
-
-<p>Su nombre de dominio tiene que ser comprado a través de un proveedor de nombres (un registrador). Tu proveedor de alojamiento puede además ser un registrador (por ejemplo <a href="https://www.1and1.com/">1&amp;1</a> y <a href="https://www.gandi.net/?lang=en">Gandi</a>  son al mismo tiempo registradores y proveedores de alojamiento). El nombre de dominio usualmente cuesta $5-15 por año. Este costo varía en dependencia de:</p>
-
-<ul>
- <li>Obligaciones locales: algunos nombres de dominio de primer nivel pertenecientes a países son más costosos, ya que diferentes países establecen precios diferentes.</li>
- <li>Servicios asociados con un nombre de dominio: algunos registradores proveen protección contra spam ocultando tu dirección postal y corre electrónico detrás de sus propias direcciones: la dirección postal puede ser proveída a cargo del registrador y tu dirección de correo puede ser ocultada detrás del alias de tu registrador. </li>
-</ul>
-
-<h3 id="Alojamiento_de_aficionados_vs._Alojamiento_“empaquetado”">Alojamiento de aficionados vs. Alojamiento “empaquetado”</h3>
-
-<p>Cuando deseas publicar un sitio web, puedes hacer todo por ti mismo: preparar una base de datos (si es necesaria), Sistema de Gestión de Contenidos, or {{Glossary("CMS")}} (como <a href="http://wordpress.org/">Wordpress</a>, <a href="http://dotclear.org/">Dotclear</a>, <a href="http://www.spip.net/en_rubrique25.html">spip</a>, etc.), subir tus propias plantillas o contenido preeditado.</p>
-
-<p>Pudieras utilizar el entorno de tu proveedor de alojamiento, por aproximadamente de 10 a 15 dólares al mes, o suscribirse directamente a un servicio de alojamiento con CMS pre-empaquetado (por ejemplo, <a href="http://wordpress.com/">Wordpress</a>, <a href="https://www.tumblr.com/">Tumblr</a>, <a href="https://www.blogger.com/">Blogger</a>). Para esta última no tienes que pagar nada, pero puedes tener menos control sobre las plantillas y otras opciones. </p>
-
-<h3 id="Alojamiento_gratuito_vs._alojamiento_pagado">Alojamiento gratuito vs. alojamiento pagado</h3>
-
-<p>Te pudieras preguntar, ¿por qué pago por mi alojamiento cuando existen tantos servicios gratuitos?</p>
-
-<ul>
- <li>Tienes más libertad cuando pagas. Tu sitio web es tuyo, y puedes trasladarlo a la perfección de un proveedor de alojamiento a otro.</li>
- <li>Los proveedores de alojamiento gratuito puede añadir anuncios Free hosting providers may add advertising to your content, beyond your control.</li>
-</ul>
-
-<p>Es mejor pagar el alojamiento que depender de alojamiento gratuito, ya que en la mayoría de los sitios pagados es posible trasladar tus archivos fácilmente y el tiempo de actividad está garantizado. La mayoría de los proveedores de alojamiento te dan un gran descuento para comenzar. </p>
-
-<p>Algunas personan optan por un enfoque mixto. Por ejemplo, su blog principal en un sitio pagado con un nombre de dominio completo, y a su vez contenido espóntaneo, menos estratégico en un servicio de alojamiento gratuito.</p>
-
-<h2 id="Agencias_y_alojamiento_de_sitios_web_profesionales">Agencias y alojamiento de sitios web profesionales</h2>
-
-<p>Si desea un sitio web profesional, probablemente le pedirás a una agencia web que lo haga por ti.<br>
- <br>
- Aquí, los costos dependen de múltiples factores, tales como: </p>
-
-<ul>
- <li>¿Es este un sitio web sencillo con unas pocas páginas de texto? ¿O un sitio web más complejo con miles de extensas páginas?</li>
- <li>¿Quieres actualizarlo de manera regular? ¿O será un sitio web estático?</li>
- <li>¿Tu sitio web debe conectarse a tu compañía para obtener el contenido (es decir, datos internos)?</li>
- <li>¿Quieres algunas características fanstásticas de las más usadas del momento? En el momento que se escribió este artículo, los clientes buscan sitios de página única con complicados paralajes (React).</li>
- <li>¿Necesitarás que la agencia cree historias de usuarios o resuelva complejos problemas {{Glossary("UX")}}? Por ejemplo, crear una estrategia que atraiga usuarios, o pruebas A/B para seleccionar una solución entre diferentes ideas. </li>
-</ul>
-
-<p>...y para alojamiento:</p>
-
-<ul>
- <li>¿Quieres servidores adicionales, en caso de que tu servidor se caiga?</li>
- <li>¿Es 95% porciento adecuada la fiabilidad, o necesitas servicio profesional las 24 horas?</li>
- <li>¿Quiere un gran perfil, servidores dedicados ultra-responsivos, o puede trabajar con una máquina más lenta compartida?</li>
-</ul>
-
-<p>En dependencia de cómo responda estas preguntas, su sitio pudiera costar miles hasta cientos de miles de dólares.</p>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<p>Ahora que entiende que cantidad de dinero su sitio puede costarle, es tiempo de comenzar a diseñar un sitio web y <a href="/en-US/docs/Learn/Set_up_a_basic_working_environment">preparar su entorno de trabajo</a>.</p>
-
-<ul>
- <li>Lea sobre <a href="/en-US/docs/Learn/Choose,_Install_and_set_up_a_text_editor">cómo seleccionar e instalar un editor de texto</a>.</li>
- <li>SI está más enfocado en diseño, eche una mirada a la <a href="/en-US/Learn/Anatomy_of_a_web_page">anatomía de una página web</a>.</li>
-</ul>
diff --git a/files/es/learn/common_questions/diseños_web_comunes/index.html b/files/es/learn/common_questions/diseños_web_comunes/index.html
deleted file mode 100644
index 7e05cbcaad..0000000000
--- a/files/es/learn/common_questions/diseños_web_comunes/index.html
+++ /dev/null
@@ -1,115 +0,0 @@
----
-title: ¿Qué contienen los diseños web comunes?
-slug: Learn/Common_questions/diseños_web_comunes
-tags:
-  - CSS
-  - Común
-  - Diseño
-  - Diseño Común
-  - HTML
-  - Principiante
-translation_of: Learn/Common_questions/Common_web_layouts
----
-<div>{{IncludeSubnav("/en-US/Learn")}}</div>
-
-<div class="summary">
-<p>Cuando diseña páginas para su sitio web es bueno tener una idea de los diseños más comunes.</p>
-</div>
-
-<table class="learn-box nostripe standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Asegúrese que usted ya ha pensado sobre <a href="/es/docs/Learn/Common_questions/Thinking_before_coding">lo que quiere lograr</a> con su proyecto web.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender dónde colocar las cosas en sus páginas web, y cómo hacerlo. </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Existe una razón para que hablemos sobre diseño web. Se comienza con una página en blanco, y se pueden tomar muchas direcciones. Si no tienes mucha experiencia, comenzar con una página en blanco pudiera ser un poco temible. Nosotros tenemos alrededor de 25 años de experiencia y te daremos algunas reglas básicas para ayudarte a diseñar tu sitio. </p>
-
-<p>Aún ahora con el nuevo enfoque de la web para móviles, la mayoría de las páginas web principales son construídas a partir de las siguientes partes:</p>
-
-<dl>
- <dt>Encabezado</dt>
- <dd>Visible en la parte superior de cada página de un sitio. Contiene información relevante para todas las páginas (como el nombre del sitio o el logo) y un sistema de navegación fácil de usar.</dd>
- <dt>Contenido principal</dt>
- <dd>Es el área más grande, contiene contenido único para la página actual.</dd>
- <dt>Contenido secundario</dt>
- <dd>1) Información complementaria del contenido principal; 2) información compartida entre un subconjunto de páginas; 3) sistema de navegación alternativo. De hecho, todo lo que no es absolutamente requerido por el contenido de la página principal. </dd>
- <dt>Pie de página</dt>
- <dd>Visible en la parte inferior de cada página de un sitio. Análogamente al encabezado contiene información global, en este caso menos llamativa como avisos legales o información de contacto.</dd>
-</dl>
-
-<p>Estos elementos son bastante comunes en todos los factores de forma, pero pueden ser dispuestos de diferentes maneras. Aquí se presentan algunos ejemplos (<strong>1 </strong>representa encabezado, <strong>2 </strong>pie de página; <strong>A </strong>contenido principal; <strong>B1, B2 </strong>barras laterales):</p>
-
-<p><strong>Diseño de una columna.</strong> Especialmente importante para navegadores de móviles de modo que no se llene la pequeña pantalla.</p>
-
-<p><img alt="Example of a 1 column layout: Main on top and asides stacked beneath it." src="https://mdn.mozillademos.org/files/9501/1-col-layout.png" style="height: 100px; width: 160px;"></p>
-
-<p><strong>Diseño de dos columnas.</strong> A menudo utilizado para tabletas, ya que tienen pantallas de tamaño medio.</p>
-
-<p> <img alt="Example of a basic 2 column layout: One aside on the left column, and main on the right column." src="https://mdn.mozillademos.org/files/9499/2-col-layout-right.png" style="height: 100px; width: 160px;"> <img alt="Example of a basic 2 column layout: One aside on the right column, and main on the left column." src="https://mdn.mozillademos.org/files/9497/2-col-layout-left.png" style="height: 100px; width: 160px;"></p>
-
-<p><strong>Diseños de tres columnas</strong>. Solamene adecuado para escritorios con pantallas grandes. (Incluso muchos usuarios de escritorio prefieren ver cosas en pequeñas ventanas que en pantalla completa.)</p>
-
-<p><img alt="Example of a basic 3 column layout: Aside on the left and right column, Main on the middle column." src="https://mdn.mozillademos.org/files/9491/3-col-layout.png" style="height: 100px; width: 160px;"> <img alt="Another example of a 3 column layout: Aside side by side on the left, Main on the right column." src="https://mdn.mozillademos.org/files/9493/3-col-layout-alt.png" style="height: 100px; width: 160px;"> <img alt="Another example of a 3 column layout: Aside side by side on the right, Main on the left column." src="https://mdn.mozillademos.org/files/9495/3-col-layout-alt2.png" style="height: 100px; width: 160px;"></p>
-
-<p>La verdadera diversión comienza cuando empiezas a mezclarlos todos juntos.</p>
-
-<p><img alt="Example of mixed layout: Main on top and asides beneath it side by side." src="https://mdn.mozillademos.org/files/9503/1-col-layout-alt.png" style="height: 100px; width: 160px;"> <img alt="Example of a mixed layout: Main on the left column and asides stack on top of each other on the right column" src="https://mdn.mozillademos.org/files/9505/2-col-layout-left-alt.png" style="height: 100px; width: 160px;"> <img alt="Example of a mixed layout: one aside on the left column and main in the right column with a aside beneath main." src="https://mdn.mozillademos.org/files/9507/2-col-layout-mix.png" style="height: 100px; width: 160px;"> <img alt="Example of a mixed layout: Main on the left of the first row and one aside on the right of that same row, a second aside convering the whole second row." src="https://mdn.mozillademos.org/files/9509/2-col-layout-mix-alt.png" style="height: 100px; width: 160px;">…</p>
-
-<p>Estos son solo ejemplos y eres bastante libre de diseñar las cosas como quieras. Puedes notar que mientras el contenido se puede mover alrededor de la pantalla, siempre se mantiene el encabezado (1) en la parte superior y el pie de página (2) en la parte inferior. Además, el contenido principal (A) es lo más importante, así que dale la mayor parte del espacio. </p>
-
-<p>Estas son reglas del juego que puedes aprovechar. Desde luego, existen diseños complejos y excepciones. En otros artículos discutiremos cómo diseñar sitios responsivos (sitios que cambian en dependencia del tamaño de la pantalla) y sitios cuyos diseños varían entre las páginas. Por ahora, es mejor mantener tu diseño consistente en todo tu sitio. </p>
-
-<h2 id="Aprendizaje_activo">Aprendizaje activo</h2>
-
-<p><em>Aún no hay aprendizaje activo disponible. <a href="/en-US/docs/MDN/Getting_started">Por favor, considere contribuir</a>.</em></p>
-
-<h2 id="Profundización">Profundización</h2>
-
-<p>Estudiemos algunos ejemplos más concretos tomados de sitios web bien conocidos. </p>
-
-<h3 id="Diseño_de_una_columna">Diseño de una columna</h3>
-
-<p><strong><a href="http://www.invisionapp.com/" rel="external">Aplicación de Invision</a></strong>. Un diseño típico de una columna proporcionando toda la información linealmente en una sola página. </p>
-
-<p><img alt="Example of a 1 column layout in the wild" src="https://mdn.mozillademos.org/files/9523/screenshot-product.jpg" style="height: 643px; width: 200px;">        <img alt="1 column layout with header, main content, a stack of aside contents and a footer" src="https://mdn.mozillademos.org/files/9525/screenshot-product-overlay.jpg" style="height: 643px; width: 200px;"></p>
-
-<p>Bastante sencillo. Sólo recuerda que muchas personas navegarán por tu sitio desde escritorios, así que haz tu contenido también utilizable allí.</p>
-
-<h3 id="Diseño_de_dos_columnas.">Diseño de dos columnas.</h3>
-
-<p><strong><a href="http://abduzeedo.com/typography-mania-261" rel="external">Abduzeedo</a></strong>, un simple diseño de blog. Los blogs usualmente tienen dos columnas, una para el contenido principal que es más ancha y otra más estrecha para el contenido secundario (como widgets, niveles de navegación secundarios y anuncios). </p>
-
-<p><img alt="Example of a 2 column layout for a blog" src="https://mdn.mozillademos.org/files/9527/screenshot-blog.jpg" style="height: 643px; width: 200px;">        <img alt="A 2 column layout with the main content on the left column" src="https://mdn.mozillademos.org/files/9529/screenshot-blog-overlay.jpg" style="height: 643px; width: 200px;"></p>
-
-<p>En este ejemplo, mira la imagen (B1) justo debajo del encabezado. Está relacionada con el contenido principal, pero el contenido principal tiene sentido sin esta, de este modo pudieras pensar que la imagen forma parte del contenido principal o del lateral. En realidad no importa. Lo que importa es que si pones algo justo debajo del encabezado, debería ser parte del contenido principal o estar directamente relacionado con este. </p>
-
-<h3 id="Es_una_trampa">Es una trampa</h3>
-
-<p><strong><a href="http://www.mica.edu/About_MICA.html" rel="external">MICA</a></strong>. Este es un poco más complicado. Parece un diseño de tres columnas...</p>
-
-<p><img alt="Example of a false 3 columns layout" src="https://mdn.mozillademos.org/files/9531/screenshot-education.jpg" style="height: 267px; width: 200px;">        <img alt="It looks like a 3 columns layout but actually, the aside content is floating around." src="https://mdn.mozillademos.org/files/9533/screenshot-education-overlay.jpg" style="height: 267px; width: 200px;"></p>
-
-<p>...pero no lo es. B1 y B2 flotan alrededor del contenido principal. Recuerda esa palabra "float"--te acordarás cuando empieces a aprender sobre {{Glossary("CSS")}}.</p>
-
-<p>¿Por qué pensarías que es un diseño de tres columnas? Porque la imagen en la parte superior derecha está en forma de L, porque B1 parece una columna sosteniendo el conenido principal desplazado, y porque la "M" y la  "I" del logo MICA crean una línea de fuerza vertical.</p>
-
-<p>Este es un buen ejemplo de diseño clásico que admite cierta creatividad. Los diseños simples son más fáciles de implementar, pero deje espacio expresar su creatividad en el área.</p>
-
-<h3 id="Un_diseño_mucho_más_complicado">Un diseño mucho más complicado</h3>
-
-<p><strong>La <a href="https://www.operadeparis.fr/en/saison-2014-2015/opera/la-boheme-puccini" rel="external">Opera de Paris</a>.</strong></p>
-
-<p><img alt="An example of a tricky layout." src="https://mdn.mozillademos.org/files/9535/screenshot-opera.jpg" style="height: 424px; width: 200px;">        <img alt="This is a 2 column layout but the header is overlaping the main content." src="https://mdn.mozillademos.org/files/9537/screenshot-opera-overlay.jpg" style="height: 424px; width: 200px;"></p>
-
-<p>Básicamente un diseño de dos columnas, pero notarás muchos ajustes por aquí y por allá que rompen visualmente el diseño. Especialmente, el encabezado se superposiciona a la imagen del contenido principal. La manera en que la curva del menú del encabezado se une con la curva en el fondo de la imagen, hacen que el encabezado y el contenido principal parezcan un solo componente a pesar de que son técnicamente completamente distintos. </p>
-
-<p>Como ves, puedes crear maravillosos sitios web incluso sólo con diseños básicos. Échale una mirada a tus propios sitos web favoritos y pregúntate a ti mismo, ¿dónde está el encabezado, el pie de página, el contenido principal y el contenido secundario? Esto te inspirará para tu propio diseño y te dará buenas pistas sobre para cuáles diseños funciona y para cuáles no. </p>
diff --git a/files/es/learn/common_questions/how_much_does_it_cost/index.html b/files/es/learn/common_questions/how_much_does_it_cost/index.html
new file mode 100644
index 0000000000..1a6116151d
--- /dev/null
+++ b/files/es/learn/common_questions/how_much_does_it_cost/index.html
@@ -0,0 +1,163 @@
+---
+title: ¿Cuánto cuesta hacer algo en la Web?
+slug: Learn/Common_questions/How_much_does_it_cost
+tags:
+  - Comenzando
+  - Herramientas de desarrollo web
+  - Principiante
+  - alojamiento
+  - costo
+  - hosting
+translation_of: Learn/Common_questions/How_much_does_it_cost
+original_slug: Learn/Common_questions/Cuanto_cuesta
+---
+<div class="summary">
+<p>Dedicarse a la web no es tan barato como parece. En este artículo discutimos cuánto puedes tener que gastar, y por qué.</p>
+</div>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Deberías ya entender <a href="/en-US/Learn/What_software_do_I_need">qué software necesitas</a>, la diferencia entre <a href="/en-US/Learn/page_vs_site_vs_server_vs_search_engine">una página web, un sitio web, etc</a>., y qué <a href="/en-US/Learn/Understanding_domain_names">es un nombre de dominio</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Examina el proceso completo para crear un sitio web y descubre cuánto te puede costar cada paso.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p><span class="seoSummary">Al lanzar un sitio web, puedes no gastar nada, o puede que el costo sea muy elevado. En este artículo discutimos acerca de cuánto cuesta todo y cómo obtienes lo que pagas (o no pagas).</span></p>
+
+<h2 id="Software">Software</h2>
+
+<h3 id="Editores_de_texto">Editores de texto</h3>
+
+<p>Probablemente tienes un editor de texto: tal como Notepad en Windows, Gedit en Linux, TextEdit en Mac. Le resultará más fácil escribir código si elige un editor que coloree el código, chequee la sintaxis y te ayude a mantener la estructura del programa. </p>
+
+<p>Muchos editores son gratis, por ejemplo <a href="https://atom.io/">Atom</a>, <a href="http://brackets.io/">Brackets</a>, <a href="http://bluefish.openoffice.nl/">Bluefish</a>, <a href="http://www.barebones.com/products/textwrangler/">TextWrangler</a>, <a href="http://eclipse.org/">Eclipse</a>, y <a href="https://netbeans.org/">Netbeans</a>. Algunos, como <a href="http://www.sublimetext.com/">Sublime Text</a>, los puedes probar tanto como quieras, pero se te anima a pagar. Otros, como <a href="https://www.jetbrains.com/phpstorm/">PhpStorm</a>, pueden costar entre unas pocas docenas y 200 dólares, en dependencia del plan que pague. Algunos de ellos, como <a href="http://www.visualstudio.com/">Microsoft Visual Studio</a>, pueden costar cientos o miles de dólares; aunque Visual Studio Express is gratis para desarrolladores individuales o proyectos de código abierto. A menudo, los editores pagados tienen una versión de prueba.</p>
+
+<p>Para comenzar, le segerimos probar con diferentes editores, para tener un indicio de cuál trabaja mejor para ti. Si está solamente escribiendo código simple de {{Glossary("HTML")}}, {{Glossary("CSS")}}, and {{Glossary("Javascript")}}, utilice un editor sencillo.</p>
+
+<p>El el precio no refleja de manera confiable la calidad o utilidad de un editor de texto. Tienes que probarlo por ti mismo y decidir si se ajusta a tus necesidades. Por ejemplo, Sublime Text es barato, pero tiene muhos plugins gratis que pueden extender su funcionalidad. </p>
+
+<h3 id="Editores_de_imágenes">Editores de imágenes</h3>
+
+<p>Tu sistema incluye seguramente un simple editor de imágenes, o visor: Paint en Windows, Eye of Gnome en Ubuntu, Preview en Mac. Estos programas son relativamente limitados, pronto gustarás tener un editor más potente para añadir capas, efectos y agrupamiento de imágenes.</p>
+
+<p>Los editores pueden ser gratis (<a href="http://www.gimp.org/">GIMP</a>, <a href="https://www.getpaint.net/">Paint.NET</a>), de costo moderado (<a href="http://www.paintshoppro.com/">PaintShop Pro</a>, menos de $100), o cientos de dólares (<a href="https://www.adobe.com/products/photoshop.html">Adobe Photoshop</a>).</p>
+
+<p>Puedes usar cualquiera de ellos, ya que tienen funciones similares, aunque algunos son tan completos que nunca vas a utilizar cada característica. Si en algún punto necesitas intercambiar proyectos con otros diseñadores, deberías descubrir qué herramientas utilizan. Los editores pueden exportar los proyectos finalizados a formatos de archivo estándares, pero cada editor guarda los proyectos actuales en su formato especializado. La mayoría de las imágenes en Internet están protegidas por los derechos de autor, por lo que es mejor chequear la licencia del aechivo antes de utilizarlo. Sitios como <a href="https://pixabay.com/">Pixabay</a> proporcionan imágenes bajo la licencia CC0, así que la puedes usar, editar y publicar incluso con modificaciones para uso comercial.</p>
+
+<h3 id="Editores_de_medios">Editores de medios</h3>
+
+<p>Si desea incluir video o audio en su sitio web, puede incrustar servicios online (por ejemplo YouTube, Vimeo, or Dailymotion), o incluir sus propios videos (ver más abajo los costos de ancho de banda).</p>
+
+<p>Para archivos de audio, puede encontrar software gratuito(<a href="http://audacity.sourceforge.net/?lang=en">Audacity</a>, <a href="http://www.wavosaur.com/">Wavosaur</a>), o pagar hasta unos poco cientos de dólares (<a href="http://www.sonycreativesoftware.com/soundforge">Sony Sound Forge</a>, <a href="http://www.adobe.com/products/audition.html">Adobe Audition</a>). Sin embargo, el software de edición de vídeo puede ser gratis (<a href="http://www.pitivi.org/">PiTiVi</a>, <a href="http://www.openshot.org/">OpenShot</a> for Linux, <a href="https://www.apple.com/mac/imovie/">iMovie</a> for Mac), menos de $100 (<a href="https://www.adobe.com/us/products/premiere-elements.html">Adobe Premiere Elements</a>), o varios cientos de dólares (<a href="https://www.adobe.com/products/premiere.html">Adobe Premiere Pro</a>, <a href="http://www.avid.com/US/products/family/Media-Composer">Avid Media Composer</a>, <a href="https://www.apple.com/final-cut-pro/">Final Cut Pro</a>). El software recibido con tu cámara digital puede cubrir todas tus necesidades.</p>
+
+<h3 id="Herramientas_de_publicación">Herramientas de publicación</h3>
+
+<p>Además necesitas una forma de subir archivos: desde tu disco duro a un servidor web distante. Para hacer esto deberías utilizar una herramienta de publicación tal como un cliente  (S)<a href="/en-US/docs/Glossary/FTP">FTP</a>, <a href="https://en.wikipedia.org/wiki/Rsync">RSync</a>, o <a href="https://help.github.com/articles/using-a-custom-domain-with-github-pages/">Git/GitHub</a>.</p>
+
+<p>Cada sistema operativo incluye un cliente (S)FTP, como parte de su administrador de archivos. Windows Explorer, Nautilus (un administrador de archivos común en Linux), y Mac Finder inclueyen todos esta funcionalidad. Sin embargo, las personas a menudo seleccionan clientes (S)FTP dedicados a mostrar directorios locales y remotos y almacenar contraseñas de servidor.</p>
+
+<p>Si desea instalar un cliente (S)FTP, existen varias opciones seguras y gratuitas: por ejemplo, <a href="https://filezilla-project.org/">FileZilla</a> para todas las plataformas, <a href="http://winscp.net/">WinSCP</a> para Windows, <a href="https://cyberduck.io/">Cyberduck</a> para Mac o Windows, <a href="https://en.wikipedia.org/wiki/List_of_FTP_server_software">y otros más</a>.</p>
+
+<p>Debido a que el protocolo FTP es inseguro, deberías asegurarte de utilizar SFTP — la versión segura, encriptada de FTP que la mayoría de los sitios de alojamiento (en inglés <em>hosting</em>) actuales ofrecen por defecto— u otra solución segura como Rsync sobre SSH.</p>
+
+<h2 id="Navegadores">Navegadores</h2>
+
+<p>Ya debes tener un navegador o puedes conseguirlo gratuito. Si lo necesitas, descarga Firefox <a href="https://www.mozilla.org/en-US/firefox/all/">aquí</a> o Google Chrome <a href="https://www.google.com/chrome/browser/">aquí</a>.</p>
+
+<h2 id="Acceso_a_la_web">Acceso a la web</h2>
+
+<h3 id="Computadora_módem">Computadora / módem</h3>
+
+<p>Necesitas una computadora. El costo puede variar mucho, en dependencia de tu presupuesto, y dónde vivas. Para publicar un sitio web básico, sólo necesitas una computadora básica capaz de ejecutar, por lo que el nivel de entrada puede ser bastante bajo. </p>
+
+<p>Por supuesto, necesitarás una computadora más formal si quieres producir diseños complicados, retocar fotos, o producir archivos de audio y vídeo. </p>
+
+<p>Necesitas subir contenido a un servidor remoto (ver <em>Alojamiento</em> más abajo), por lo que necesitas un módem.Tu proveedor {{Glossary("ISP")}} puede venderte la conexión a internet por unos pocos dólares al mes, aunque tu presupuesto pudiera variar, en dependencia de tu localización.</p>
+
+<h3 id="Acceso_del_Proveedor_ISP">Acceso del Proveedor ISP</h3>
+
+<p>Asegúrese de contar con suficiente {{Glossary("Ancho de banda", "ancho de banda")}}:</p>
+
+<ul>
+ <li>El acceso de ancho de banda bajo puede ser adecuado para soportar un sitio web simple: imágenes reducidas, textos, algunos archivos CSS y JavaScript. Esto probablemente te cueste unas pocas docenas de dólares, incluyendo la renta del módem.</li>
+ <li>De otra manera, necesitarás un ancho de banda superior, tal como acceso por DSL, cable, o fibra, si desea un sitio web más avanzado con cientos de archivos o quiere entregar archivos pesados de vídeo/audio directamente desde tu servidor. Te pudiera costar lo mismo que el acceso de ancho de banda bajo, hasta varios cientos de dólares mensuales para necesidades más profesionales. </li>
+</ul>
+
+<h2 id="Alojamiento">Alojamiento</h2>
+
+<h3 id="Entendiendo_el_ancho_de_banda">Entendiendo el ancho de banda</h3>
+
+<p>Los proveedores de alojamiento te cobran de acuerdo a cuánto {{Glossary("Ancho de banda", "ancho de banda")}} consume tu sitio web. . Esto depende de cuántas personaas, y robots de rastreo Web, accedan a tu contenido durante un tiempo dado, y cuánto espacio en el servidor tu contenido ocupa. Esta es la razón por la cual las personas usualmente almacenan sus videos en servicios dedicadostales como Youtube, Dailymotion, y Vimeo. Por ejemplo, tu proveedor puede tener un plan que incluye hasta varios miles de visitantes por díam por un uso “razonable”. Sea cuidadoso, puesto que puede variar mucho de un servidor de alojamiento a otro. Como regla de oro, reconozca que el servicio de alojamiento confiable, pagado y personal puede costar alrededor de 10 a 15 dólares al mes. </p>
+
+<div class="note">
+<p>Note que que no existe el ancho de banda “ilimitado”. Si consumes una enorme cantidad de ancho de banda, espere pagar una enorme cantidad de dinero.</p>
+</div>
+
+<h3 id="Nombre_de_dominio">Nombre de dominio</h3>
+
+<p>Su nombre de dominio tiene que ser comprado a través de un proveedor de nombres (un registrador). Tu proveedor de alojamiento puede además ser un registrador (por ejemplo <a href="https://www.1and1.com/">1&amp;1</a> y <a href="https://www.gandi.net/?lang=en">Gandi</a>  son al mismo tiempo registradores y proveedores de alojamiento). El nombre de dominio usualmente cuesta $5-15 por año. Este costo varía en dependencia de:</p>
+
+<ul>
+ <li>Obligaciones locales: algunos nombres de dominio de primer nivel pertenecientes a países son más costosos, ya que diferentes países establecen precios diferentes.</li>
+ <li>Servicios asociados con un nombre de dominio: algunos registradores proveen protección contra spam ocultando tu dirección postal y corre electrónico detrás de sus propias direcciones: la dirección postal puede ser proveída a cargo del registrador y tu dirección de correo puede ser ocultada detrás del alias de tu registrador. </li>
+</ul>
+
+<h3 id="Alojamiento_de_aficionados_vs._Alojamiento_“empaquetado”">Alojamiento de aficionados vs. Alojamiento “empaquetado”</h3>
+
+<p>Cuando deseas publicar un sitio web, puedes hacer todo por ti mismo: preparar una base de datos (si es necesaria), Sistema de Gestión de Contenidos, or {{Glossary("CMS")}} (como <a href="http://wordpress.org/">Wordpress</a>, <a href="http://dotclear.org/">Dotclear</a>, <a href="http://www.spip.net/en_rubrique25.html">spip</a>, etc.), subir tus propias plantillas o contenido preeditado.</p>
+
+<p>Pudieras utilizar el entorno de tu proveedor de alojamiento, por aproximadamente de 10 a 15 dólares al mes, o suscribirse directamente a un servicio de alojamiento con CMS pre-empaquetado (por ejemplo, <a href="http://wordpress.com/">Wordpress</a>, <a href="https://www.tumblr.com/">Tumblr</a>, <a href="https://www.blogger.com/">Blogger</a>). Para esta última no tienes que pagar nada, pero puedes tener menos control sobre las plantillas y otras opciones. </p>
+
+<h3 id="Alojamiento_gratuito_vs._alojamiento_pagado">Alojamiento gratuito vs. alojamiento pagado</h3>
+
+<p>Te pudieras preguntar, ¿por qué pago por mi alojamiento cuando existen tantos servicios gratuitos?</p>
+
+<ul>
+ <li>Tienes más libertad cuando pagas. Tu sitio web es tuyo, y puedes trasladarlo a la perfección de un proveedor de alojamiento a otro.</li>
+ <li>Los proveedores de alojamiento gratuito puede añadir anuncios Free hosting providers may add advertising to your content, beyond your control.</li>
+</ul>
+
+<p>Es mejor pagar el alojamiento que depender de alojamiento gratuito, ya que en la mayoría de los sitios pagados es posible trasladar tus archivos fácilmente y el tiempo de actividad está garantizado. La mayoría de los proveedores de alojamiento te dan un gran descuento para comenzar. </p>
+
+<p>Algunas personan optan por un enfoque mixto. Por ejemplo, su blog principal en un sitio pagado con un nombre de dominio completo, y a su vez contenido espóntaneo, menos estratégico en un servicio de alojamiento gratuito.</p>
+
+<h2 id="Agencias_y_alojamiento_de_sitios_web_profesionales">Agencias y alojamiento de sitios web profesionales</h2>
+
+<p>Si desea un sitio web profesional, probablemente le pedirás a una agencia web que lo haga por ti.<br>
+ <br>
+ Aquí, los costos dependen de múltiples factores, tales como: </p>
+
+<ul>
+ <li>¿Es este un sitio web sencillo con unas pocas páginas de texto? ¿O un sitio web más complejo con miles de extensas páginas?</li>
+ <li>¿Quieres actualizarlo de manera regular? ¿O será un sitio web estático?</li>
+ <li>¿Tu sitio web debe conectarse a tu compañía para obtener el contenido (es decir, datos internos)?</li>
+ <li>¿Quieres algunas características fanstásticas de las más usadas del momento? En el momento que se escribió este artículo, los clientes buscan sitios de página única con complicados paralajes (React).</li>
+ <li>¿Necesitarás que la agencia cree historias de usuarios o resuelva complejos problemas {{Glossary("UX")}}? Por ejemplo, crear una estrategia que atraiga usuarios, o pruebas A/B para seleccionar una solución entre diferentes ideas. </li>
+</ul>
+
+<p>...y para alojamiento:</p>
+
+<ul>
+ <li>¿Quieres servidores adicionales, en caso de que tu servidor se caiga?</li>
+ <li>¿Es 95% porciento adecuada la fiabilidad, o necesitas servicio profesional las 24 horas?</li>
+ <li>¿Quiere un gran perfil, servidores dedicados ultra-responsivos, o puede trabajar con una máquina más lenta compartida?</li>
+</ul>
+
+<p>En dependencia de cómo responda estas preguntas, su sitio pudiera costar miles hasta cientos de miles de dólares.</p>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<p>Ahora que entiende que cantidad de dinero su sitio puede costarle, es tiempo de comenzar a diseñar un sitio web y <a href="/en-US/docs/Learn/Set_up_a_basic_working_environment">preparar su entorno de trabajo</a>.</p>
+
+<ul>
+ <li>Lea sobre <a href="/en-US/docs/Learn/Choose,_Install_and_set_up_a_text_editor">cómo seleccionar e instalar un editor de texto</a>.</li>
+ <li>SI está más enfocado en diseño, eche una mirada a la <a href="/en-US/Learn/Anatomy_of_a_web_page">anatomía de una página web</a>.</li>
+</ul>
diff --git a/files/es/learn/common_questions/que_es_un_servidor_web/index.html b/files/es/learn/common_questions/que_es_un_servidor_web/index.html
deleted file mode 100644
index 4969677db6..0000000000
--- a/files/es/learn/common_questions/que_es_un_servidor_web/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: Que es un servidor WEB?
-slug: Learn/Common_questions/Que_es_un_servidor_WEB
-tags:
-  - Infraestructura
-  - Principiante
-  - necesitaEsquema
-translation_of: Learn/Common_questions/What_is_a_web_server
----
-<div class="summary">
-<p>En este articulo veremos que son los servidores, cómo funcionan y por qué son importantes.</p>
-</div>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>Debes saber <a href="/en-US/docs/Learn/How_the_Internet_works">como funciona internet</a>, y <a href="/en-US/docs/Learn/page_vs_site_vs_server_vs_search_engine">entendiendo la diferencia entre pagina web, sitio web, servidor y motor de busqueda</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender qué es un servidor web y comprender cómo funciona.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Sumario">Sumario</h2>
-
-<p>Con "Servidor web" podemos referirnos a hardware o software, o a ambos trabajando juntos.</p>
-
-<ol>
- <li>En cuanto a hardware, un servidor web es una computadora que almacena los archivos que componen un sitio web (ej.  documentos HTML , imágenes, hojas de estilos CSS y archivo JavaScript) y los entrega al dispositivo del usuario final. Está conectado a internet y es accesible a través de un nombre de dominio como<code> mozilla.org</code>.</li>
- <li>En cuanto a software, un servidor web tiene muchas partes encargadas del control sobre cómo tienen acceso los usuarios a los archivos, por lo menos un servidor <em>HTTP. </em>Un servidor HTTP es una pieza de software que comprende {{Glossary("URL","URLs")}} (direcciones web) y {{Glossary("HTTP")}} (el protocolo que tu navegador usa para ver las páginas web).</li>
-</ol>
-
-<p>Al nivel más básico, siempre que un navegador necesite un archivo almacenado en un  servidor web, el navegador hará una solicitud al servidor mediante la vía HTTP. Cuando la petición llega al servidor web correcto (hardware), el  servidor <em>HTTP </em> (software) envía el archivo antes solicitado, tambien a través de HTTP.</p>
-
-<p><img alt="Basic representation of a client/server connection through HTTP" src="https://mdn.mozillademos.org/files/8659/web-server.svg" style="height: 200px; width: 600px;"></p>
-
-<p>Para publicar un sitio web, necesitarás un servidor web dinámico o estático.</p>
-
-<p>Un <strong>servidor web estático</strong>, o pila, consiste en una computadora (hardware) con un servidor HTTP (software). Llamamos a este "estático" debido a que el servidor envía los archivos almacenados "tal cual" a tu navegador.</p>
-
-<p>Un <strong>servidor web dinámico </strong>consiste en un servidor web estático con un software extra , lo común es que sea una <em>aplicación</em> servidor <em> y una </em> base de datos<em>. Llamamos a esto</em> "dinámico" por que la aplicacion servidor actualiza los archivos almacenados en la base de datos antes de enviarlos mediante el servidor HTTP.</p>
-
-<p>Por ejemplo, para ver la página que ves en tu navegador finalmente, el servidor aplicación puede mostrar el diseño HTML con contenido desde una base de datos. Sitios como MDN o Wikipedia tienen cientos de páginas web, que no son realmente archivos HTML, si no una estrucura HTML asociada a una gigantesca base de datos. Esto hace mas fácil y rápido el mantenimiento y entrega del contenido.</p>
-
-<h2 id="Aprendizaje_activo">Aprendizaje activo</h2>
-
-<p><em>No hay aprendizaje activo disponible. <a href="https://developer.mozilla.org/en-US/docs/MDN/Getting_started">P</a><u>or favor, considere colaborar.</u></em></p>
-
-<h2 id="Inmersión_más_profunda">Inmersión más profunda</h2>
-
-<p>Para recuperar una página web, como ya dijimos, su navegador envía una solicitud al servidor web, que procede a buscar el archivo solicitado en su propio espacio de almacenamiento. Al encontrar el archivo, el servidor lo lee, lo procesa según sea necesario y lo envía al navegador. Veamos esos pasos con más detalle.</p>
-
-<h3 id="Alojamiento_de_archivos_Hosting">Alojamiento de archivos (Hosting)</h3>
-
-<p>Un servidor web primero debe almacenar los archivos del sitio web, es decir, todos los documentos HTML y sus medios relacionados, incluidas las imágenes, las hojas de estilo CSS, los archivos JavaScript, las fuentes y videos.</p>
-
-<p>Técnicamente, puede alojar todos esos archivos en su propia computadora, pero es mucho más conveniente almacenarlos en un servidor web dedicado que:</p>
-
-<ul>
- <li>siempre está funcionando.</li>
- <li>siempre está conectado a internet.</li>
- <li>tiene la misma dirección IP todo el tiempo.</li>
- <li>es mantenido por un proveedor externo.</li>
-</ul>
-
-<p>Por todas estas razones, encontrar un buen proveedor de alojamiento es una parte clave del desarrollo de su sitio web. Investigue a través de los diversos servicios que ofrecen las compañías y elija uno que se ajuste a sus necesidades y a su presupuesto (los servicios van desde los gratuitos hasta los miles de dólares al mes). Puede encontrar mas información <a href="https://developer.mozilla.org/en-US/Learn/How_much_does_it_cost#Hosting">en este artículo</a>.</p>
-
-<p>Una vez que configura una solución de alojamiento web, solo tiene que <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">cargar sus archivos en su servidor web</a>.</p>
-
-<h3 id="Comunicación_a_través_de_HTTP">Comunicación a través de HTTP</h3>
-
-<p>En segundo lugar, un servidor web brinda soporte para HTTP (<strong>H</strong>yper<strong>t</strong>ext <strong>T</strong>ransfer <strong>P</strong>rotocol ó  <span>Protocolo de Transferencia de Hipertexto</span>). <span class="tlid-translation translation"><span title="">Como su nombre lo indica, HTTP especifica cómo transferir hypertext (es decir, documentos web vinculados) entre dos computadoras.</span></span></p>
-
-<p>Un <em>protocolo </em> es un conjunto de reglas para la comunicación entre dos computadoras. HTTP es un protocolo textual, sin estado.</p>
-
-<dl>
- <dt>Textual</dt>
- <dd>Todos los comandos son de texto plano y legible para ser leído por humanos.</dd>
- <dt><span class="tlid-translation translation"><span class="alt-edited" title="">Sin estado</span></span></dt>
- <dd>Ni el servidor ni el cliente recuerdan las comunicaciones anteriores. Por ejemplo, al confiar solo en HTTP, un servidor no puede recordar la contraseña que ingresó ni el paso que está realizando en una transacción. Necesita un servidor de aplicaciones para tareas como esa. (Cubriremos ese tipo de tecnología en otros artículos).</dd>
-</dl>
-
-<p>HTTP proporciona reglas claras sobre cómo se comunican un cliente y un servidor. Cubriremos el propio HTTP en un <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP">artículo técnico</a> más adelante. Por ahora, sólo sé consciente de estas cosas:</p>
-
-<ul>
- <li>Solo los clientes pueden hacer solicitudes HTTP a los servidores. Los servidores solo pueden responder a la solicitud HTTP de un cliente.</li>
- <li>Al solicitar un archivo a través de HTTP, los clientes deben proporcionar la URL del archivo.</li>
- <li>El servidor web debe responder a todas las solicitudes HTTP, al menos con un mensaje de error.</li>
-</ul>
-
-<p><a href="https://developer.mozilla.org/en-US/404"><img alt="The MDN 404 page as an example of such error page" src="https://mdn.mozillademos.org/files/8661/mdn-404.jpg" style="float: right; height: 300px; width: 300px;"></a> En un servidor web, el servidor HTTP es responsable de procesar y responder las solicitudes entrantes.</p>
-
-<ol>
- <li>Al recibir una solicitud, un servidor HTTP primero verifica si la URL solicitada coincide con un archivo existente.</li>
- <li>Si es así, el servidor web envía el contenido del archivo de nuevo al navegador. Si no, un servidor de aplicaciones construye el archivo necesario.</li>
- <li>Si ninguno de los procesos es posible, el servidor web devuelve un mensaje de error al navegador, generalmente "404 Not Found". ( Ese error es tan común que muchos diseñadores web pasan bastante tiempo diseñando páginas de error 404.)</li>
-</ol>
-
-<h3 id="Contenido_Estático_vs._Dinámico">Contenido Estático vs. Dinámico</h3>
-
-<p><span class="tlid-translation translation"><span title="">En términos generales, un servidor puede entregar contenido estático o dinámico.</span> <span title="">"Estático" significa "servido como está".</span> <span title="">Los sitios web estáticos son los más fáciles de configurar, por lo que le sugerimos que convierta su primer sitio en un sitio estático.</span></span></p>
-
-<p>"Dinámico" significa que el servidor procesa el contenido o incluso lo genera desde una base de datos. Esta solución proporciona más flexibilidad, pero se vuelve más difícil de manejar, lo que hace que sea mucho más complejo desarrollar el sitio web.</p>
-
-<p>Tomemos por ejemplo la página que estás leyendo en este momento. En el servidor web que lo aloja, hay un servidor de aplicaciones que toma el contenido del artículo de una base de datos, lo formatea, lo coloca dentro de algunas plantillas HTML y le envía los resultados. En este caso, el servidor de aplicaciones se llama <a href="/en-US/docs/MDN/Kuma">Kuma </a>y está desarrollado con Python (utilizando el framework <a href="https://www.djangoproject.com/">Django</a>). El equipo de Mozilla creó Kuma para las necesidades específicas de MDN, pero hay muchas aplicaciones similares basadas en otras tecnologías.</p>
-
-<p><span class="tlid-translation translation"><span title="">Hay tantos servidores de aplicaciones que es resulta difícil sugerir uno en particular.</span></span> <span class="tlid-translation translation"><span title="">Algunos servidores de aplicaciones se adaptan a categorías específicas de sitios web como blogs, wikis o tiendas electrónicas;</span></span> <span class="tlid-translation translation"><span title="">otros, llamados</span></span> CMS (Content Management Systems ó <span class="tlid-translation translation"><span title="">Sistemas de Gestión de Contenidos</span></span>), <span class="tlid-translation translation"><span title="">son más genéricos.</span></span> <span class="tlid-translation translation"><span title="">Si está desarrollando un sitio web dinámico, tómese el tiempo para elegir una herramienta que se adapte a sus necesidades.</span></span> <span class="tlid-translation translation"><span title="">A menos que desee aprender algo de programación de servidores web</span></span> (¡es un área emocionante!), no necesita crear su propio servidor de aplicaciones.</p>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<p>Ahora que estás familiarizado con los servidores web, podrías:</p>
-
-<ul>
- <li>leer sobre<a href="/en-US/docs/Learn/How_much_does_it_cost"> cuánto cuesta hacer algo en la web</a></li>
- <li>consultar otros artículos relacionados con<a href="/en-US/docs/Learn/What_software_do_I_need">los diferentes software que puedes utilizar para crear un sitio web</a></li>
- <li>pasar a algo práctico tipo: <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">¿cómo subir archivos al servidor?</a>.</li>
-</ul>
diff --git a/files/es/learn/common_questions/que_software_necesito/index.html b/files/es/learn/common_questions/que_software_necesito/index.html
deleted file mode 100644
index 92687e7d13..0000000000
--- a/files/es/learn/common_questions/que_software_necesito/index.html
+++ /dev/null
@@ -1,226 +0,0 @@
----
-title: ¿Qué software necesito para construir un sitio web?
-slug: Learn/Common_questions/Que_software_necesito
-tags:
-  - Build a website
-  - Building
-  - Mecanismos Web
-  - Principiante
-  - software
-translation_of: Learn/Common_questions/What_software_do_I_need
----
-<div class="summary">
-<p>En este artículo se explican cuales componentes de software necesita para editar, cargar, o visualizar un sitio web. </p>
-</div>
-
-<table class="learn-box nostripe standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Deberías conocer acerca de <a href="/en-US/docs/Learn/page_vs_site_vs_server_vs_search_engine">la diferencia entre páginas web, sitios web, servidores web, y moteres de búsqueda.</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender qué componentes de software necesita si quiere editar, cargar o visualizar un sitio web.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p><span class="seoSummary">Puede descargar la mayoría de los programas que necesita para el desarrollo web de forma gratuita. Proporcionaremos unos enlaces en este artículo. </span></p>
-
-<p><span class="seoSummary">Necesitarás herramientas para:</span></p>
-
-<ul>
- <li><span class="seoSummary">Crear y editar páginas web </span></li>
- <li><span class="seoSummary">Cargar archivos a tu servidor web</span></li>
- <li><span class="seoSummary">Visualizar tu servidor web</span></li>
-</ul>
-
-<p><span class="seoSummary">Casi todos los sistemas operativos incluyen por defecto un editor de texto y un navegador, el cual puedes usar para ver los sitios web. Como resultado, usualmente sólo necesitas adquirir software para la transferencia de archivos a tu servidor web.</span></p>
-
-<h2 id="Aprendizaje_activo">Aprendizaje activo</h2>
-
-<p><em>No hay aprendizaje activo disponible todavía. <a href="/es/docs/MDN/Comenzando">Por favor, considere contribuir</a>.</em></p>
-
-<h2 id="Profundización">Profundización</h2>
-
-<h3 id="Creción_y_edición_de_páginas_web">Creción y edición de páginas web</h3>
-
-<p>Para crear y editar un sitio web, necesita un editor de texto. Editores de texto crean y modifican archivos de texto sin formato.  Otros formatos, como <strong>{{Glossary("RTF")}}</strong>, te permiten añadirle formato, como negrita y señalado, esos no son adecuados para escribir páginas web. Debe pensar bien qué editor de texto usar, ya que trabajará intensamente con él mientras construye el sitio web.</p>
-
-<p>Todos los sistemas operativos de escritorio traen un editor de texto básico. Estos editores son muy sencillos, pero les faltan características especiales para codificar páginas web. Si desea algo un poco más elegante, hay muchas herramientas de terceros disponibles. Editores de terceros, a menudo viene con características extra, como coloreado de sintaxis, autocompletado, secciones expandibles y búsqueda de código. A continuación se muestra una lista de algunos editores:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Sistema operativo</th>
-   <th scope="col">Editor incorporado</th>
-   <th scope="col">Editor de terceros</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>Windows</td>
-   <td>
-    <ul>
-     <li><a href="http://en.wikipedia.org/wiki/Notepad_%28software%29" rel="external">Notepad</a></li>
-    </ul>
-   </td>
-   <td>
-    <ul>
-     <li><a href="http://notepad-plus-plus.org/">Notepad++</a></li>
-     <li><a href="https://www.visualstudio.com/">Visual Studio Code</a></li>
-     <li><a href="https://www.jetbrains.com/webstorm/">Web Storm</a></li>
-     <li><a href="http://brackets.io/">Brackets</a></li>
-     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
-     <li><a href="https://www.sublimetext.com/">Sublime Text</a></li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <td>Mac OS</td>
-   <td>
-    <ul>
-     <li><a href="http://en.wikipedia.org/wiki/TextEdit" rel="external">TextEdit</a></li>
-    </ul>
-   </td>
-   <td>
-    <ul>
-     <li><a href="http://www.barebones.com/products/textwrangler/">TextWrangler</a></li>
-     <li><a href="https://www.visualstudio.com/">Visual Studio Code</a></li>
-     <li><a href="http://brackets.io/">Brackets</a></li>
-     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
-     <li><a href="https://www.sublimetext.com/">Sublime Text</a></li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <td>Linux</td>
-   <td>
-    <ul>
-     <li><a href="http://en.wikipedia.org/wiki/Vi" rel="external">Vi</a> (All UNIX)</li>
-     <li><a href="http://en.wikipedia.org/wiki/Gedit" rel="external">GEdit</a> (Gnome)</li>
-     <li><a href="http://en.wikipedia.org/wiki/Kate_%28text_editor%29" rel="external">Kate</a> (KDE)</li>
-     <li><a href="http://en.wikipedia.org/wiki/Leafpad" rel="external">LeafPad</a> (Xfce)</li>
-    </ul>
-   </td>
-   <td>
-    <ul>
-     <li><a href="http://www.gnu.org/software/emacs/">Emacs</a></li>
-     <li><a href="http://www.vim.org/" rel="external">Vim</a></li>
-     <li><a href="https://www.visualstudio.com/">Visual Studio Code</a></li>
-     <li><a href="http://brackets.io/">Brackets</a></li>
-     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
-     <li><a href="https://www.sublimetext.com/">Sublime Text</a></li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <td>Chrome OS</td>
-   <td> </td>
-   <td>
-    <ul>
-     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>Aquí se muestra una captura de pantalla de un editor de texto avanzado:</p>
-
-<p><img alt="Screenshot of Notepad++." src="https://mdn.mozillademos.org/files/8221/NotepadPlusPlus.png" style="display: block; height: 311px; margin: 0 auto; width: 450px;"> </p>
-
-<p>Esta es una captura de panalla de un editor de texto online:</p>
-
-<p><img alt="Screenshot of ShiftEdit" src="https://mdn.mozillademos.org/files/15837/shiftedit.png" style="display: block; height: 311px; margin: 0 auto; width: 475px;"></p>
-
-<h3 id="Subir_archivos_a_la_Web">Subir archivos a la Web</h3>
-
-<p>Cuando tu sitio web está listo para visualización pública , tendrás que subir tus páginas web a tu servidor web. Puedes comprar espacio en un servidor de varios proveedores (vea el artículo <a class="new" href="/en-US/docs/Learn/How_much_does_it_cost">¿Cuánto cuesta hacer algo en la web?</a>). Una vez que establezca qué proveedor utilizar, el proveedor le enviará un correo con la información de acceso, usualmente en la forma de una URL SFTP, nombre de usuario, contraseña, y otra información necesaria para conectarte con su servidor. Tenga en cuenta que el protocolo (S)FTP está actualmente algo pasado de moda, mientras otros sistemas de carga de archivos están comenzando a volverse populares como <a href="https://en.wikipedia.org/wiki/Rsync">RSync</a> y <a href="https://help.github.com/articles/using-a-custom-domain-with-github-pages/">Git/GitHub</a>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Note: </strong>FTP es inherentemente inseguro. Deberías asegurarte de que tu proveedor de alojamiento permite el uso de una conexión segura, por ejemplo SFTP o RSync sobre SSH.</p>
-</div>
-
-<p>Subir archivos a un sitio web es un paso muy importante mientras se crea un sitio web, por lo que sete tema se abarca en detalle en <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">un artículo aparte</a>. Por ahora, se presenta una lista de clientes (S)FTP gratuitos:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Sistema operativo</th>
-   <th colspan="2" rowspan="1" scope="col" style="text-align: center;"> Software FTP </th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>Windows</td>
-   <td>
-    <ul>
-     <li><a href="http://winscp.net" rel="external">WinSCP</a></li>
-     <li><a href="http://mobaxterm.mobatek.net/">Moba Xterm</a></li>
-    </ul>
-   </td>
-   <td colspan="1" rowspan="3">
-    <ul>
-     <li><a href="https://filezilla-project.org/">FileZilla</a> (Todos los SO)</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <td>Linux</td>
-   <td>
-    <ul>
-     <li><a href="https://wiki.gnome.org/action/show/Apps/Files?action=show&amp;redirect=Apps%2FNautilus" rel="external">Nautilus/Files</a> (Gnome)</li>
-     <li><a href="http://dolphin.com/" rel="external">Dolphin</a> (KDE)</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <td> Mac OS</td>
-   <td>
-    <ul>
-     <li><a href="http://cyberduck.de/">Cyberduck</a></li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <td> Chrome OS</td>
-   <td>
-    <ul>
-     <li><a href="https://shiftedit.net/">ShiftEdit</a> (Todos los SO)</li>
-    </ul>
-   </td>
-   <td colspan="1"> </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Navegación_por_sitios_web">Navegación por sitios web</h3>
-
-<p>Como ya sabe, necesita un navegador para ver los sitios web. Existen <a href="http://en.wikipedia.org/wiki/List_of_web_browsers">docenas</a>  de opciones de navegadores para uso personal, pero cuando usted está desarrollando un sitio web debe probarlo al menos con los navegadores principales siguientes, para estar seguro de que su sitio web funciona para la mayoría de las personas:  </p>
-
-<ul>
- <li><a href="https://www.mozilla.org/en-US/firefox/new/" rel="external">Mozilla Firefox</a></li>
- <li><a href="https://www.google.fr/chrome/browser/" rel="external">Google Chrome</a></li>
- <li><a href="http://windows.microsoft.com/en-US/internet-explorer/download-ie" rel="external">Microsoft Internet Explorer</a></li>
- <li><a href="http://www.apple.com/safari/" rel="external">Apple Safari</a></li>
-</ul>
-
-<p>Si su sitio está destinado a un grupo específico (por ejemplo, una plataforma técnica o país), puede que tenga que probar el sitio con navegadores adicionales, como <a href="http://www.opera.com/" rel="external">Opera</a>, <a href="http://www.konqueror.org/">Konqueror</a>, o<a href="http://www.ucweb.com/ucbrowser/" rel="external"> UC Browser</a>.</p>
-
-<p>Sin embargo las pruebas se dificultan debido a que algunos navegadores sólo funcionan en determinados sistemas operativos. Apple Safari se ejecuta en iOS y Mac OS, mientras Internet Explorer corre solamente en Windows. Lo mejor es aprovechar los servicios como <a href="http://browsershots.org/" rel="external">Browsershots</a> o <a href="http://www.browserstack.com/" rel="external">Browserstack</a>. Browsershots proporciona capturas de pantallas de tu sitio web en diferentes navegadores. Browserstack  realmente te otorga acceso remoto a máquinas virtuales de modo que puedes probar tu sitio en los entornos más comunes. De manera alternativa, puedes instalar tu propia máquina virtual, pero se necesita algo de experiencia. ( Si escoge este camino, Microsoft tiene algunas herramientas para desarrolladores incluso una máquina virtual lista para utilizar en <a href="https://modern.ie" rel="external">modern.ie</a>.)</p>
-
-<p>Sin falta ejecute algunas pruebas en dispositivos reales, especialmente en dispositivos móviles reales. Simulación de dispositivos móviles es una tecnología nueva, en evolución y menos confiable que la simulación de escritorio. Desde luego, los dispositivos móviles son costosos, por lo que le sugerimos echar un vistazo a <a href="http://opendevicelab.com/" rel="external">la inictiva de Laboratorios de dispositivos abiertos</a>. Puede además compartir dispositivos quiere probar en diferentes plataformas sin gastar mucho.</p>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<ul>
- <li>Algunos de estos programas son gratis, pero no todos. <a href="/en-US/docs/Learn/Common_questions/How_much_does_it_cost">Descubra cuánto cuesta hacer algo en la web</a><a class="new" href="/en-US/docs/Learn/How_much_does_it_cost">.</a></li>
- <li>Si desea aprrender más sobre editores de texto, lea este artículo acerca de <a href="/en-US/docs/Learn/Choose,_Install_and_set_up_a_text_editor">cómo seleccionar e instalar un editor de texto</a>.</li>
- <li>Si se está preguntando cómo publicar en tu sitio web, eche un vistazo a <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">"Cómo subir archivos a un servidor web"</a>.</li>
-</ul>
-
-<p> </p>
diff --git a/files/es/learn/common_questions/qué_es_una_url/index.html b/files/es/learn/common_questions/qué_es_una_url/index.html
deleted file mode 100644
index ef50be60ad..0000000000
--- a/files/es/learn/common_questions/qué_es_una_url/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: ¿Qué es una URL?
-slug: Learn/Common_questions/Qué_es_una_URL
-translation_of: Learn/Common_questions/What_is_a_URL
----
-<div class="summary">
-<p>Este artículo habla sobre las Uniform Resource Locators (URLs), explicando qué son y cómo se estructuran.</p>
-</div>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>Primero necesitas saber <a href="/en-US/docs/Learn/How_the_Internet_works">Como funciona Internet</a>, <a href="/en-US/docs/Learn/What_is_a_Web_server">qué es un servidor Web</a> y <a href="/en-US/docs/Learn/Understanding_links_on_the_web">los conceptos detrás de los enlaces en la web</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprenderás lo que es una URL y como funcionan en la Web.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p><span class="seoSummary">Junto con el {{Glossary("Hypertext", "Hipertexto")}} y {{Glossary("HTTP")}}, las <strong><dfn>URL</dfn></strong> son uno de los conceptos claves de la Web. Es el mecanismo usado por los {{Glossary("Browser","navegadores")}} para obtener cualquier recurso publicadon en la web.</span></p>
-
-<p><strong>URL</strong> significa <em>Uniform Resource Locator (Localizador de Recursos Uniforme)</em>. Una URL no es más que una direccion que es dada a un recurso único en la Web. En teoria, cada URL valida apunta a un único recurso. Dichos recursos pueden ser páginas HTML, documentos CSS, imagenes, etc. En la practica, hay algunas excepciones, siendo la más común una URL apuntando a un recurso que ya no existe o que ha sido movido. Como el recurso representado por la URL y la URL en si son manejadas por el servidor Web, depende del dueño del servidor web manejar ese recurso y su URL asociada adecuadamente.</p>
-
-<h2 id="Active_Learning">Active Learning</h2>
-
-<p><em>There is no active learning available yet. <a href="/en-US/docs/MDN/Getting_started">Please, consider contributing</a>.</em></p>
-
-<h2 id="Profundizando">Profundizando</h2>
-
-<h3 id="Conceptos_básicos_anatomía_de_una_URL">Conceptos básicos: anatomía de una URL</h3>
-
-<p>Aquí hay algunos ejemplos de URL:</p>
-
-<pre class="notranslate">https://developer.mozilla.org
-https://developer.mozilla.org/en-US/docs/Learn/
-https://developer.mozilla.org/en-US/search?q=URL</pre>
-
-<p>Cualquiera de esas URL se puede escribir en la barra de direcciones de su navegador para indicarle que cargue la página (recurso) asociada.</p>
-
-<p>Una URL está compuesta de diferentes partes, algunas obligatorias y otras opcionales. Veamos las partes más importantes usando la siguiente URL:</p>
-
-<pre class="notranslate">http://www.example.com:80/path/to/myfile.html?key1=value1&amp;key2=value2#SomewhereInTheDocument</pre>
-
-<dl>
- <dt><img alt="Protocol" src="https://mdn.mozillademos.org/files/15766/mdn-url-protocol@x2_update.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>http</code> es el protocolo. La primera parte de la URL indica qué protocolo debe usar el navegador. Un protocolo es un método establecido para intercambiar o transferir datos alrededor de una red informática. Por lo general, para sitios web es el protocolo HTTP o su versión segura, HTTPS. La Web requiere uno de estos dos, pero los navegadores también saben cómo manejar otros protocolos como mailto: (para abrir un cliente de correo) o ftp: para manejar la transferencia de archivos, así que no se sorprenda si ve tales protocolos.</dd>
- <dt><img alt="Domaine Name" src="https://mdn.mozillademos.org/files/8015/mdn-url-domain@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>www.example.com</code> es el nombre de dominio. Indica qué servidor web se solicita. Alternativamente, es posible usar directamente un {{Glossary("dirección IP")}}, pero debido a que es menos conveniente, no se usa con frecuencia en la Web.</dd>
- <dt><img alt="Port" src="https://mdn.mozillademos.org/files/8017/mdn-url-port@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>:80</code> es el puerto. Indica la "puerta" técnica utilizada para acceder a los recursos en el servidor web. Por lo general, se omite si el servidor web utiliza los puertos estándar del protocolo HTTP (80 para HTTP y 443 para HTTPS) para otorgar acceso a sus recursos. De lo contrario es obligatorio.</dd>
- <dt><img alt="Path to the file" src="https://mdn.mozillademos.org/files/8019/mdn-url-path@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>/path/to/myfile.html</code> es la ruta al recurso en el servidor web. En los primeros días de la Web, una ruta como esta representaba la ubicación de un archivo físico en el servidor web. Hoy en día, es principalmente una abstracción manejada por servidores web sin ninguna realidad física.</dd>
- <dt><img alt="Parameters" src="https://mdn.mozillademos.org/files/8021/mdn-url-parameters@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>?key1=value1&amp;key2=value2</code> son parámetros adicionales proporcionados al servidor web. Esos parámetros son una lista de pares clave/valor separados con el símbolo &amp;. El servidor web puede usar esos parámetros para hacer cosas adicionales antes de devolver el recurso. Cada servidor web tiene sus propias reglas con respecto a los parámetros, y la única forma confiable de saber si un servidor web específico está manejando parámetros es preguntando al propietario del servidor web.</dd>
- <dt><img alt="Anchor" src="https://mdn.mozillademos.org/files/8023/mdn-url-anchor@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>#SomewhereInTheDocument</code> es un ancla para otra parte del recurso en sí. Un ancla representa una especie de "marcador" dentro del recurso, dando al navegador las instrucciones para mostrar el contenido ubicado en ese lugar "marcado". En un documento HTML, por ejemplo, el navegador se desplazará hasta el punto donde se define el ancla; en un video o documento de audio, el navegador intentará ir a la hora que representa el ancla. Vale la pena señalar que la parte después del #, también conocido como el identificador de fragmento, nunca se envía al servidor con la solicitud.</dd>
-</dl>
-
-<p>{{Note('Existen <a href="http://en.wikipedia.org/wiki/Uniform_Resource_Locator">algunas partes extras y reglas extras </a>con respecto a las URL, pero no son relevantes para usuarios habituales o desarrolladores web. No se preocupe por esto, no necesita conocerlos para construir y usar URL completamente funcionales.')}}</p>
-
-<p>Puede pensar en una URL como una dirección de correo postal normal: el protocolo representa el servicio postal que desea utilizar, el nombre de dominio es la ciudad o el pueblo y el puerto es como el código postal; la ruta representa el edificio donde se debe entregar su correo; los parámetros representan información adicional como el número de apartamento en el edificio; y, finalmente, el ancla representa a la persona real a la que ha dirigido su correo.</p>
-
-<h3 id="Cómo_usar_las_URL">Cómo usar las URL</h3>
-
-<p>Se puede escribir cualquier URL dentro de la barra de direcciones del navegador para acceder al recurso que se encuentra detrás. ¡Pero esto es sólo la punta del iceberg!</p>
-
-<p>El lenguaje {{Glossary("HTML")}} — <a href="/en-US/docs/Learn/HTML/HTML_tags">que se discutirá más adelante</a> — hace un uso extensivo de las URL:</p>
-
-<ul>
- <li>para crear enlaces a otros documentos con el elemento {{HTMLElement("a")}};</li>
- <li>para vincular un documento con sus recursos relacionados a través de varios elementos como {{HTMLElement("link")}} o {{HTMLElement("script")}};</li>
- <li>para mostrar recursos como imágenes (con el elemento {{HTMLElement("img")}}), videos (con el elemento {{HTMLElement("video")}}), sonido y música (con el elemento {{HTMLElement("audio")}} ), etc.;</li>
- <li>para mostrar otros documentos HTML con el elemento {{HTMLElement ("iframe")}}.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota:</strong> Al especificar URL para cargar recursos como parte de una página (como cuando se usa &lt;script&gt;, &lt;audio&gt;, &lt;img&gt;, &lt;video&gt; y similares), solo debe usar URL HTTP y HTTPS. El uso de FTP, por ejemplo, no es particularmente seguro y muchos navegadores ya no lo admiten.</p>
-</div>
-
-<p>Otras tecnologías, como {{Glossary("CSS")}} o {{Glossary("JavaScript")}}, usan URLs ampliamente, y estos son realmente el corazón de la Web.</p>
-
-<h3 id="URL_absolutas_vs_URL_relativas">URL absolutas vs URL relativas</h3>
-
-<p>Lo que vimos arriba se llama URL absoluta, pero también hay algo llamado URL relativa. Examinemos lo que significa esa distinción con más detalle.</p>
-
-<p>Las partes requeridas de una URL dependen en gran medida del contexto en el que se utiliza la URL. En la barra de direcciones de su navegador, una URL no tiene ningún contexto, por lo que debe proporcionar una URL completa (o absoluta), como las que vimos anteriormente. No necesita incluir el protocolo (el navegador usa HTTP de manera predeterminada) o el puerto (que solo se requiere cuando el servidor web de destino está utilizando algún puerto inusual), pero todas las otras partes de la URL son necesarias.</p>
-
-<p>Cuando se usa una URL dentro de un documento, como en una página HTML, las cosas son un poco diferentes. Debido a que el navegador ya tiene la propia URL del documento, puede usar esta información para completar las partes faltantes de cualquier URL disponible dentro de ese documento. Podemos diferenciar entre una URL absoluta y una URL relativa mirando solo la parte de ruta de la URL. Si la parte de ruta de la URL comienza con el carácter "/", el navegador buscará ese recurso desde la raíz superior del servidor, sin referencia al contexto dado por el documento actual.</p>
-
-<p>Veamos algunos ejemplos para aclarar esto.</p>
-
-<h4 id="Ejemplos_de_URL_absolutas">Ejemplos de URL absolutas</h4>
-
-<dl>
- <dt>URL Completa (la misma que usamos antes)</dt>
- <dd>
- <pre class="notranslate">https://developer.mozilla.org/en-US/docs/Learn</pre>
- </dd>
- <dt>Protocolo implícito</dt>
- <dd>
- <pre class="notranslate">//developer.mozilla.org/en-US/docs/Learn</pre>
-
- <p>En este caso, el navegador llamará a esa URL con el mismo protocolo que el utilizado para cargar el documento que aloja esa URL.</p>
- </dd>
- <dt>Nombre de dominio implícito</dt>
- <dd>
- <pre class="notranslate">/en-US/docs/Learn</pre>
-
- <p>Este es el caso de uso más común para una URL absoluta dentro de un documento HTML. El navegador utilizará el mismo protocolo y el mismo nombre de dominio que el utilizado para cargar el documento que aloja esa URL. <strong>Nota</strong>: <em>no es posible omitir el nombre de dominio sin omitir también el protocolo</em>.</p>
- </dd>
-</dl>
-
-<h4 id="Ejemplos_de_URL_relativas">Ejemplos de URL relativas</h4>
-
-<p>Para comprender mejor los siguientes ejemplos, supongamos que las URL se invocan desde el documento ubicado en la siguiente URL:<code>https://developer.mozilla.org/en-US/docs/Learn</code></p>
-
-<dl>
- <dt>Sub-recursos</dt>
- <dd>
- <pre class="notranslate">Skills/Infrastructure/Understanding_URLs
-</pre>
- Debido a que la URL no se inicia con <code>/</code>, el navegador intentará encontrar el documento en un subdirectorio del que contiene el recurso actual. Entonces, en este ejemplo, realmente queremos llegar a esta URL:<code>https://developer.mozilla.org/en-US/docs/Learn/Skills/Infrastructure/Understanding_URLs</code></dd>
- <dt>Volviendo en el árbol de directorios</dt>
- <dd>
- <pre class="notranslate">../CSS/display</pre>
-
- <p>En este caso, usamos el <code>../</code> convención de escritura, heredada del mundo del sistema de archivos UNIX, para decirle al navegador que queremos subir desde un directorio. Aquí queremos llegar a esta URL:<code>https://developer.mozilla.org/en-US/docs/Learn/../CSS/display</code>, que se puede simplificar a: <code>https://developer.mozilla.org/en-US/docs/CSS/display</code></p>
- </dd>
-</dl>
-
-<h3 id="URL_semánticas">URL semánticas</h3>
-
-<p>A pesar de su sabor muy técnico, las URL representan un punto de entrada legible para un sitio web. Se pueden memorizar y cualquiera puede ingresarlos en la barra de direcciones de un navegador. Las personas están en el centro de la Web, por lo que se considera una buena práctica construir lo que se llama <a href="http://en.wikipedia.org/wiki/Semantic_URL"><em>URL semánticas</em></a>. Las URL semánticas usan palabras con un significado inherente que cualquier persona puede entender, independientemente de sus conocimientos técnicos.</p>
-
-<p>La semántica lingüística es, por supuesto, irrelevante para las computadoras. Probablemente has visto URL que parecen mashups de caracteres aleatorios. Pero hay muchas ventajas en la creación de URL legibles por humanos:</p>
-
-<ul>
- <li>Es más fácil para ti manipularlos.</li>
- <li>Aclara las cosas para los usuarios en términos de dónde están, qué están haciendo, qué están leyendo o interactuando en la Web.</li>
- <li>Algunos motores de búsqueda pueden usar esa semántica para mejorar la clasificación de las páginas asociadas.</li>
-</ul>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Understanding_domain_names">Comprendiendo nombres de dominio</a></li>
-</ul>
diff --git a/files/es/learn/common_questions/using_github_pages/index.html b/files/es/learn/common_questions/using_github_pages/index.html
new file mode 100644
index 0000000000..2c52f5ef79
--- /dev/null
+++ b/files/es/learn/common_questions/using_github_pages/index.html
@@ -0,0 +1,104 @@
+---
+title: ¿Cómo se utiliza Github pages?
+slug: Learn/Common_questions/Using_Github_pages
+translation_of: Learn/Common_questions/Using_Github_pages
+original_slug: Learn/Using_Github_pages
+---
+<p class="summary"><a href="https://github.com/">GitHub</a> es un sitio "social coding". Te permite subir repositorios de código para almacenarlo en el <strong>sistema de control de versiones</strong> <a href="http://git-scm.com/">Git</a>. Tu puedes colaborar en proyectos de código, y el sistema es código abierto por defecto, lo que significa que cualquiera en el mundo puede encontrar tu código en GitHub, usarlo, aprender de el, y mejorarlo. ¡Tú puedes hacer eso con el código de otras personas tambien! Este artículo provee una guía básica para publicar contenido usando la característica gh-pages de Github.</p>
+
+<h2 id="Publicando_contenido">Publicando contenido</h2>
+
+<p>Github es una comunidad muy importante y útil para involucrarse, y Git/GitHub es un <a href="http://git-scm.com/book/en/v2/Getting-Started-About-Version-Control">sistema de control de versiones</a> muy popular — la mayoría de las empresas de tecnología ahora lo utilizan en su flujo de trabajo. GitHub tiene una característica muy útil llamada <a href="https://pages.github.com/">GitHub pages</a>, que te permite publicar el código del sitio en vivo en la Web.</p>
+
+<h3 id="Configuración_básica_de_Github"><span class="short_text" id="result_box" lang="es"><span class="hps">Configuración básica</span> de <span class="hps">Github</span></span></h3>
+
+<ol>
+ <li>Primero que todo, <a href="http://git-scm.com/downloads">instala Git</a> en tu máquina. <span id="result_box" lang="es"><span class="hps">Este es el</span> <span class="hps">software del sistema</span> <span class="hps">de control de versiones</span> <span class="hps">subyacente en el que</span> <span class="hps">GitHub</span> <span class="hps">funciona</span><span>.</span></span></li>
+ <li>Seguido, <a href="https://github.com/join">Regístrate para una cuenta de GitHub</a>. Es simple y fácil.</li>
+ <li>Una vez te hayas registrado, inicia sesión en <a href="https://github.com">github.com</a> con tu nombre de usuario y contraseña.</li>
+</ol>
+
+<h3 id="Preparando_tu_código_para_subirlo">Preparando tu código para subirlo</h3>
+
+<p>Tú puedes almacenar cualquier código que tu quieras en un repositorio de Github, pero para usar la característica páginas de Github con pleno efecto, tu código debe estar estructurado como un sitio web típico, por ejemplo que el punto de entrada primario sea un archivo HTML llamado<code> index.html</code>.</p>
+
+<p>La otra cosa que necesitas hacer <span id="result_box" lang="es"><span class="hps">antes de seguir adelante</span> <span class="hps">es</span> <span class="hps">inicializar</span> <span class="hps">el directorio de</span> <span class="hps">código como</span> <span class="hps">un repositorio</span> <span class="hps">Git</span></span>. para hacer esto:</p>
+
+<ol>
+ <li>Apunta la línea de comandos a tu directorio <code>test-site</code> (<span id="result_box" lang="es"><span class="hps">o como se</span> <span class="hps">llame</span> <span class="hps">el directorio que contiene</span> tu<span class="hps"> sitio web</span></span>). Para esto, usa el comando <code>cd</code> (Es decir "<em>cambio de</em> <em>d</em>irectorio"). Esto es lo que deberías digitar si has puesto tu sitio web en un directorio llamado <code>test-site</code> en tu escritorio:
+
+  <pre class="brush: bash">cd Desktop/test-site</pre>
+ </li>
+ <li>Cuando la línea comandos está apuntando hacia el interior del directorio de tu sitio web, digita el siguiente comando, que le dice a la herramienta <code>git</code> para convertir el directorio en un repositorio git:</li>
+ <li>
+  <pre class="brush: bash">git init</pre>
+ </li>
+</ol>
+
+<h4 id="An_aside_on_command_line_interfaces">An aside on command line interfaces</h4>
+
+<p>La mejor manera de subir tu código a Github es mediante la linea de comandos — esta es una ventana donde tú escribe <span id="result_box" lang="es"><span class="hps">comandos</span> <span class="hps">para hacer cosas como</span> <span class="hps">crear</span> <span class="hps">archivos y ejecutar programas</span></span>, en lugar de hacer clic dentro de una interfaz de usuario. Se verá algo como esto:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/9483/command-line.png" style="display: block; height: 478px; margin: 0px auto; width: 697px;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Tú también podrías considerar una <a href="http://git-scm.com/downloads/guis">interfaz gráfica de usuario de Git</a> para hacer el mismo trabajo, si te sientes incómodo con la linea de comandos.</p>
+</div>
+
+<p><span id="result_box" lang="es"><span class="hps">Cada sistema operativo</span> <span class="hps">viene con</span> <span class="hps">una herramienta de línea</span> <span class="hps">de comandos</span><span>:</span></span></p>
+
+<ul>
+ <li><strong>Windows</strong>: <strong>Command Prompt</strong> se puede acceder pulsando la tecla Windows, tipeando <em>Command Prompt</em>, Y elegirlo de la lista que aparece. Nota que Windows tiene sus propias convenciones de comando diferentes de Linux y OS X, así que los comandos abajo pueden variar en su máquina.</li>
+ <li><strong>OS X</strong>: <strong>Terminal</strong> se puede encontrar en <em>Aplicaciones &gt; Utilidades</em>.</li>
+ <li><strong>Linux</strong>: Por lo general, puede extraer una terminal con <em>Ctrl + Alt + T</em>. <span class="short_text" id="result_box" lang="es"><span class="hps">Si</span> <span class="hps">eso no funciona</span></span>, busca <strong>Terminal</strong> en una barra de aplicaciones o menú.</li>
+</ul>
+
+<p><span class="short_text" id="result_box" lang="es"><span class="hps">Esto puede</span> <span class="hps">parecer un poco</span> espantoso<span class="hps"> al principio</span></span>, pero no te preocupes — que pronto conseguiras la <span id="result_box" lang="es"><span class="hps">caída de</span> <span class="hps">los conceptos básicos</span></span>. Tú<span id="result_box" lang="es"><span class="hps"> le dices a</span> <span class="hps">la computadora que </span><span class="hps">haga algo en la</span> <span class="hps">terminal, digitando</span> <span class="hps">un comando y</span> <span class="hps">oprimiendo la tecla Enter</span><span>,</span> <span class="hps">como se ha visto</span> <span class="hps">anteriormente.</span></span></p>
+
+<h3 id="Creando_un_repositorio_para_tu_código">Creando un repositorio para tu código</h3>
+
+<ol>
+ <li>
+  <p><span id="result_box" lang="es"><span class="hps">A continuación</span></span>, tu necesitas crear un nuevo repositorio para colocar tus archivos en el. Has clic en el signo más (+) en la parte superior derecha de la página de inicio de GitHub, luego escoge <em>Nuevo Repositorio</em>.</p>
+ </li>
+ <li><span class="short_text" id="result_box" lang="es"><span class="hps">En esta página,</span></span> en la caja <em>Nombre del Repositorio</em>, digita el nombre para tu repositorio de código, por ejemplo <em>my-repository</em>.</li>
+ <li>También llena una descripción <span class="short_text" id="result_box" lang="es"><span class="hps">para decir lo que</span> tu <span class="hps">repositorio</span> <span class="hps">va a</span> <span class="hps">contener</span></span>. Tu pantalla debe mostrar algo como esto:<br>
+  <img alt="" src="https://mdn.mozillademos.org/files/12143/create-new-repo.png" style="display: block; height: 548px; margin: 0px auto; width: 800px;"></li>
+ <li>Has Clic en <em>Crear repositorio</em>; Esto debería llevarte a la siguiente página: <br>
+  <img alt="" src="https://mdn.mozillademos.org/files/12141/github-repo.png" style="display: block; height: 520px; margin: 0px auto; width: 800px;"></li>
+</ol>
+
+<h3 id="Subiendo_tus_archivos_a_GitHub">Subiendo tus archivos a GitHub</h3>
+
+<ol>
+ <li>En la página actual, tú estás interesado en la sección <em>…o empujar un repositorio existente desde la línea de comandos</em>. Tú deberias ver dos lineas de código listado en esta sección. <span class="short_text" id="result_box" lang="es"><span class="hps">Copia</span> <span class="hps">la totalidad de la</span> <span class="hps">primera</span> <span class="hps">línea</span></span>, pégala en la línea de comandos, presiona la tecla Enter. El comando debería mostrarte algo como esto:
+
+  <pre class="copyable-terminal-content js-zeroclipboard-target"><span class="user-select-contain">git remote add origin <span class="js-live-clone-url">https://github.com/chrisdavidmills/my-repository.git</span></span></pre>
+ </li>
+ <li><span id="result_box" lang="es"><span class="hps">A continuación</span></span>, digita los siguientes dos comandos, presionando Enter despues de cada uno. Estos preparán el código para subirlo a GitHub, y pida a GIt que administre estos archivos.
+  <pre class="brush: bash">git add --all
+git commit -m 'adding my files to my repository'</pre>
+ </li>
+ <li>Por último,<span class="short_text" id="result_box" lang="es"><span class="hps"> empuja el</span> <span class="hps">código</span> <span class="hps">hasta</span></span> GitHub yendo a la página de GitHub en la que estas e ingresando en la terminal el segundo de los dos comandos que vimos <em>…o empuje un repositorio existente desde la sección de línea de comandos</em>:
+  <pre class="brush: bash">git push -u origin master</pre>
+ </li>
+ <li>Ahora necesitas crear la rama gh-pages de tu repositorio; actualiza la página actual <span id="result_box" lang="es"><span class="hps">y verá</span> <span class="hps">una página</span> del <span class="hps">repositorio</span> <span class="hps">algo así como</span> <span class="hps">la de abajo.</span></span> Tú necesitas presionar el boton que dice <em>Branch: <strong>master</strong></em>, digita <em>gh-pages</em> en el campo de texto, luego presiona el boton azul que dice <em>Create branch: gh-pages</em>. Esto crea una rama de código especial llamada gh-pages que es publicada en una ubicación especial. La URL toma la forma <em>username.github.io/my-repository-name</em>, asi en mi caso de ejemplo, la URL debería ser <em>https://chrisdavidmills.github.io/my-repository</em>. La página mostrada es la página index.html.<br>
+  <img alt="" src="https://mdn.mozillademos.org/files/12145/repo-site.png" style="display: block; margin: 0px auto;"></li>
+ <li>Navega tu dirección web de GitHub pages en un nuevo ta del navegador, y tu deberias ver tu sitio en linea! Mandalo <span id="result_box" lang="es"><span class="hps">por correo electrónico a</span> <span class="hps">tus</span> <span class="hps">amigos</span> <span class="hps">y muestra tu</span> <span class="hps">dominio</span><span>.</span></span></li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: <span class="short_text" id="result_box" lang="es"><span class="hps">Si te atascas</span></span>, la <a href="https://pages.github.com/">página de inicio de GitHub Pages</a> <span class="short_text" id="result_box" lang="es"><span class="hps">también</span> <span class="hps">es</span> <span class="hps">muy</span> <span class="hps">útil</span></span>.</p>
+</div>
+
+<h3 id="Un_mayor_conocimiento_de_GitHub"><span class="short_text" id="result_box" lang="es"><span class="hps">Un mayor conocimiento</span> <span class="hps">de GitHub</span></span></h3>
+
+<p><span id="result_box" lang="es"><span>Si deseas realizar más cambios en su sitio de prueba y cargarlos en GitHub, simplemente tendrás que realizar el cambio en tus archivos como antes.</span> <span>A continuación, debes introducir los siguientes comandos (pulsando Intro después de cada uno) para empujar los cambios a GitHub</span></span>:</p>
+
+<pre>git add --all
+git commit -m 'another commit'
+git push</pre>
+
+<p>Puedes reemplazar <em>otro commit</em> con un mensaje más adecuado para describir qué cambio acaba de hacer.</p>
+
+<p>Apenas hemos arañado la superficie de Git.Para obtener más información, comience con el <a href="https://help.github.com/index.html">sitio de ayuda de GitHub</a>.</p>
diff --git a/files/es/learn/common_questions/what_is_a_url/index.html b/files/es/learn/common_questions/what_is_a_url/index.html
new file mode 100644
index 0000000000..de5d24db8d
--- /dev/null
+++ b/files/es/learn/common_questions/what_is_a_url/index.html
@@ -0,0 +1,153 @@
+---
+title: ¿Qué es una URL?
+slug: Learn/Common_questions/What_is_a_URL
+translation_of: Learn/Common_questions/What_is_a_URL
+original_slug: Learn/Common_questions/Qué_es_una_URL
+---
+<div class="summary">
+<p>Este artículo habla sobre las Uniform Resource Locators (URLs), explicando qué son y cómo se estructuran.</p>
+</div>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>Primero necesitas saber <a href="/en-US/docs/Learn/How_the_Internet_works">Como funciona Internet</a>, <a href="/en-US/docs/Learn/What_is_a_Web_server">qué es un servidor Web</a> y <a href="/en-US/docs/Learn/Understanding_links_on_the_web">los conceptos detrás de los enlaces en la web</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprenderás lo que es una URL y como funcionan en la Web.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p><span class="seoSummary">Junto con el {{Glossary("Hypertext", "Hipertexto")}} y {{Glossary("HTTP")}}, las <strong><dfn>URL</dfn></strong> son uno de los conceptos claves de la Web. Es el mecanismo usado por los {{Glossary("Browser","navegadores")}} para obtener cualquier recurso publicadon en la web.</span></p>
+
+<p><strong>URL</strong> significa <em>Uniform Resource Locator (Localizador de Recursos Uniforme)</em>. Una URL no es más que una direccion que es dada a un recurso único en la Web. En teoria, cada URL valida apunta a un único recurso. Dichos recursos pueden ser páginas HTML, documentos CSS, imagenes, etc. En la practica, hay algunas excepciones, siendo la más común una URL apuntando a un recurso que ya no existe o que ha sido movido. Como el recurso representado por la URL y la URL en si son manejadas por el servidor Web, depende del dueño del servidor web manejar ese recurso y su URL asociada adecuadamente.</p>
+
+<h2 id="Active_Learning">Active Learning</h2>
+
+<p><em>There is no active learning available yet. <a href="/en-US/docs/MDN/Getting_started">Please, consider contributing</a>.</em></p>
+
+<h2 id="Profundizando">Profundizando</h2>
+
+<h3 id="Conceptos_básicos_anatomía_de_una_URL">Conceptos básicos: anatomía de una URL</h3>
+
+<p>Aquí hay algunos ejemplos de URL:</p>
+
+<pre class="notranslate">https://developer.mozilla.org
+https://developer.mozilla.org/en-US/docs/Learn/
+https://developer.mozilla.org/en-US/search?q=URL</pre>
+
+<p>Cualquiera de esas URL se puede escribir en la barra de direcciones de su navegador para indicarle que cargue la página (recurso) asociada.</p>
+
+<p>Una URL está compuesta de diferentes partes, algunas obligatorias y otras opcionales. Veamos las partes más importantes usando la siguiente URL:</p>
+
+<pre class="notranslate">http://www.example.com:80/path/to/myfile.html?key1=value1&amp;key2=value2#SomewhereInTheDocument</pre>
+
+<dl>
+ <dt><img alt="Protocol" src="https://mdn.mozillademos.org/files/15766/mdn-url-protocol@x2_update.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>http</code> es el protocolo. La primera parte de la URL indica qué protocolo debe usar el navegador. Un protocolo es un método establecido para intercambiar o transferir datos alrededor de una red informática. Por lo general, para sitios web es el protocolo HTTP o su versión segura, HTTPS. La Web requiere uno de estos dos, pero los navegadores también saben cómo manejar otros protocolos como mailto: (para abrir un cliente de correo) o ftp: para manejar la transferencia de archivos, así que no se sorprenda si ve tales protocolos.</dd>
+ <dt><img alt="Domaine Name" src="https://mdn.mozillademos.org/files/8015/mdn-url-domain@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>www.example.com</code> es el nombre de dominio. Indica qué servidor web se solicita. Alternativamente, es posible usar directamente un {{Glossary("dirección IP")}}, pero debido a que es menos conveniente, no se usa con frecuencia en la Web.</dd>
+ <dt><img alt="Port" src="https://mdn.mozillademos.org/files/8017/mdn-url-port@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>:80</code> es el puerto. Indica la "puerta" técnica utilizada para acceder a los recursos en el servidor web. Por lo general, se omite si el servidor web utiliza los puertos estándar del protocolo HTTP (80 para HTTP y 443 para HTTPS) para otorgar acceso a sus recursos. De lo contrario es obligatorio.</dd>
+ <dt><img alt="Path to the file" src="https://mdn.mozillademos.org/files/8019/mdn-url-path@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>/path/to/myfile.html</code> es la ruta al recurso en el servidor web. En los primeros días de la Web, una ruta como esta representaba la ubicación de un archivo físico en el servidor web. Hoy en día, es principalmente una abstracción manejada por servidores web sin ninguna realidad física.</dd>
+ <dt><img alt="Parameters" src="https://mdn.mozillademos.org/files/8021/mdn-url-parameters@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>?key1=value1&amp;key2=value2</code> son parámetros adicionales proporcionados al servidor web. Esos parámetros son una lista de pares clave/valor separados con el símbolo &amp;. El servidor web puede usar esos parámetros para hacer cosas adicionales antes de devolver el recurso. Cada servidor web tiene sus propias reglas con respecto a los parámetros, y la única forma confiable de saber si un servidor web específico está manejando parámetros es preguntando al propietario del servidor web.</dd>
+ <dt><img alt="Anchor" src="https://mdn.mozillademos.org/files/8023/mdn-url-anchor@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>#SomewhereInTheDocument</code> es un ancla para otra parte del recurso en sí. Un ancla representa una especie de "marcador" dentro del recurso, dando al navegador las instrucciones para mostrar el contenido ubicado en ese lugar "marcado". En un documento HTML, por ejemplo, el navegador se desplazará hasta el punto donde se define el ancla; en un video o documento de audio, el navegador intentará ir a la hora que representa el ancla. Vale la pena señalar que la parte después del #, también conocido como el identificador de fragmento, nunca se envía al servidor con la solicitud.</dd>
+</dl>
+
+<p>{{Note('Existen <a href="http://en.wikipedia.org/wiki/Uniform_Resource_Locator">algunas partes extras y reglas extras </a>con respecto a las URL, pero no son relevantes para usuarios habituales o desarrolladores web. No se preocupe por esto, no necesita conocerlos para construir y usar URL completamente funcionales.')}}</p>
+
+<p>Puede pensar en una URL como una dirección de correo postal normal: el protocolo representa el servicio postal que desea utilizar, el nombre de dominio es la ciudad o el pueblo y el puerto es como el código postal; la ruta representa el edificio donde se debe entregar su correo; los parámetros representan información adicional como el número de apartamento en el edificio; y, finalmente, el ancla representa a la persona real a la que ha dirigido su correo.</p>
+
+<h3 id="Cómo_usar_las_URL">Cómo usar las URL</h3>
+
+<p>Se puede escribir cualquier URL dentro de la barra de direcciones del navegador para acceder al recurso que se encuentra detrás. ¡Pero esto es sólo la punta del iceberg!</p>
+
+<p>El lenguaje {{Glossary("HTML")}} — <a href="/en-US/docs/Learn/HTML/HTML_tags">que se discutirá más adelante</a> — hace un uso extensivo de las URL:</p>
+
+<ul>
+ <li>para crear enlaces a otros documentos con el elemento {{HTMLElement("a")}};</li>
+ <li>para vincular un documento con sus recursos relacionados a través de varios elementos como {{HTMLElement("link")}} o {{HTMLElement("script")}};</li>
+ <li>para mostrar recursos como imágenes (con el elemento {{HTMLElement("img")}}), videos (con el elemento {{HTMLElement("video")}}), sonido y música (con el elemento {{HTMLElement("audio")}} ), etc.;</li>
+ <li>para mostrar otros documentos HTML con el elemento {{HTMLElement ("iframe")}}.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota:</strong> Al especificar URL para cargar recursos como parte de una página (como cuando se usa &lt;script&gt;, &lt;audio&gt;, &lt;img&gt;, &lt;video&gt; y similares), solo debe usar URL HTTP y HTTPS. El uso de FTP, por ejemplo, no es particularmente seguro y muchos navegadores ya no lo admiten.</p>
+</div>
+
+<p>Otras tecnologías, como {{Glossary("CSS")}} o {{Glossary("JavaScript")}}, usan URLs ampliamente, y estos son realmente el corazón de la Web.</p>
+
+<h3 id="URL_absolutas_vs_URL_relativas">URL absolutas vs URL relativas</h3>
+
+<p>Lo que vimos arriba se llama URL absoluta, pero también hay algo llamado URL relativa. Examinemos lo que significa esa distinción con más detalle.</p>
+
+<p>Las partes requeridas de una URL dependen en gran medida del contexto en el que se utiliza la URL. En la barra de direcciones de su navegador, una URL no tiene ningún contexto, por lo que debe proporcionar una URL completa (o absoluta), como las que vimos anteriormente. No necesita incluir el protocolo (el navegador usa HTTP de manera predeterminada) o el puerto (que solo se requiere cuando el servidor web de destino está utilizando algún puerto inusual), pero todas las otras partes de la URL son necesarias.</p>
+
+<p>Cuando se usa una URL dentro de un documento, como en una página HTML, las cosas son un poco diferentes. Debido a que el navegador ya tiene la propia URL del documento, puede usar esta información para completar las partes faltantes de cualquier URL disponible dentro de ese documento. Podemos diferenciar entre una URL absoluta y una URL relativa mirando solo la parte de ruta de la URL. Si la parte de ruta de la URL comienza con el carácter "/", el navegador buscará ese recurso desde la raíz superior del servidor, sin referencia al contexto dado por el documento actual.</p>
+
+<p>Veamos algunos ejemplos para aclarar esto.</p>
+
+<h4 id="Ejemplos_de_URL_absolutas">Ejemplos de URL absolutas</h4>
+
+<dl>
+ <dt>URL Completa (la misma que usamos antes)</dt>
+ <dd>
+ <pre class="notranslate">https://developer.mozilla.org/en-US/docs/Learn</pre>
+ </dd>
+ <dt>Protocolo implícito</dt>
+ <dd>
+ <pre class="notranslate">//developer.mozilla.org/en-US/docs/Learn</pre>
+
+ <p>En este caso, el navegador llamará a esa URL con el mismo protocolo que el utilizado para cargar el documento que aloja esa URL.</p>
+ </dd>
+ <dt>Nombre de dominio implícito</dt>
+ <dd>
+ <pre class="notranslate">/en-US/docs/Learn</pre>
+
+ <p>Este es el caso de uso más común para una URL absoluta dentro de un documento HTML. El navegador utilizará el mismo protocolo y el mismo nombre de dominio que el utilizado para cargar el documento que aloja esa URL. <strong>Nota</strong>: <em>no es posible omitir el nombre de dominio sin omitir también el protocolo</em>.</p>
+ </dd>
+</dl>
+
+<h4 id="Ejemplos_de_URL_relativas">Ejemplos de URL relativas</h4>
+
+<p>Para comprender mejor los siguientes ejemplos, supongamos que las URL se invocan desde el documento ubicado en la siguiente URL:<code>https://developer.mozilla.org/en-US/docs/Learn</code></p>
+
+<dl>
+ <dt>Sub-recursos</dt>
+ <dd>
+ <pre class="notranslate">Skills/Infrastructure/Understanding_URLs
+</pre>
+ Debido a que la URL no se inicia con <code>/</code>, el navegador intentará encontrar el documento en un subdirectorio del que contiene el recurso actual. Entonces, en este ejemplo, realmente queremos llegar a esta URL:<code>https://developer.mozilla.org/en-US/docs/Learn/Skills/Infrastructure/Understanding_URLs</code></dd>
+ <dt>Volviendo en el árbol de directorios</dt>
+ <dd>
+ <pre class="notranslate">../CSS/display</pre>
+
+ <p>En este caso, usamos el <code>../</code> convención de escritura, heredada del mundo del sistema de archivos UNIX, para decirle al navegador que queremos subir desde un directorio. Aquí queremos llegar a esta URL:<code>https://developer.mozilla.org/en-US/docs/Learn/../CSS/display</code>, que se puede simplificar a: <code>https://developer.mozilla.org/en-US/docs/CSS/display</code></p>
+ </dd>
+</dl>
+
+<h3 id="URL_semánticas">URL semánticas</h3>
+
+<p>A pesar de su sabor muy técnico, las URL representan un punto de entrada legible para un sitio web. Se pueden memorizar y cualquiera puede ingresarlos en la barra de direcciones de un navegador. Las personas están en el centro de la Web, por lo que se considera una buena práctica construir lo que se llama <a href="http://en.wikipedia.org/wiki/Semantic_URL"><em>URL semánticas</em></a>. Las URL semánticas usan palabras con un significado inherente que cualquier persona puede entender, independientemente de sus conocimientos técnicos.</p>
+
+<p>La semántica lingüística es, por supuesto, irrelevante para las computadoras. Probablemente has visto URL que parecen mashups de caracteres aleatorios. Pero hay muchas ventajas en la creación de URL legibles por humanos:</p>
+
+<ul>
+ <li>Es más fácil para ti manipularlos.</li>
+ <li>Aclara las cosas para los usuarios en términos de dónde están, qué están haciendo, qué están leyendo o interactuando en la Web.</li>
+ <li>Algunos motores de búsqueda pueden usar esa semántica para mejorar la clasificación de las páginas asociadas.</li>
+</ul>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Understanding_domain_names">Comprendiendo nombres de dominio</a></li>
+</ul>
diff --git a/files/es/learn/common_questions/what_is_a_web_server/index.html b/files/es/learn/common_questions/what_is_a_web_server/index.html
new file mode 100644
index 0000000000..a7ded29232
--- /dev/null
+++ b/files/es/learn/common_questions/what_is_a_web_server/index.html
@@ -0,0 +1,121 @@
+---
+title: Que es un servidor WEB?
+slug: Learn/Common_questions/What_is_a_web_server
+tags:
+  - Infraestructura
+  - Principiante
+  - necesitaEsquema
+translation_of: Learn/Common_questions/What_is_a_web_server
+original_slug: Learn/Common_questions/Que_es_un_servidor_WEB
+---
+<div class="summary">
+<p>En este articulo veremos que son los servidores, cómo funcionan y por qué son importantes.</p>
+</div>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>Debes saber <a href="/en-US/docs/Learn/How_the_Internet_works">como funciona internet</a>, y <a href="/en-US/docs/Learn/page_vs_site_vs_server_vs_search_engine">entendiendo la diferencia entre pagina web, sitio web, servidor y motor de busqueda</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender qué es un servidor web y comprender cómo funciona.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Sumario">Sumario</h2>
+
+<p>Con "Servidor web" podemos referirnos a hardware o software, o a ambos trabajando juntos.</p>
+
+<ol>
+ <li>En cuanto a hardware, un servidor web es una computadora que almacena los archivos que componen un sitio web (ej.  documentos HTML , imágenes, hojas de estilos CSS y archivo JavaScript) y los entrega al dispositivo del usuario final. Está conectado a internet y es accesible a través de un nombre de dominio como<code> mozilla.org</code>.</li>
+ <li>En cuanto a software, un servidor web tiene muchas partes encargadas del control sobre cómo tienen acceso los usuarios a los archivos, por lo menos un servidor <em>HTTP. </em>Un servidor HTTP es una pieza de software que comprende {{Glossary("URL","URLs")}} (direcciones web) y {{Glossary("HTTP")}} (el protocolo que tu navegador usa para ver las páginas web).</li>
+</ol>
+
+<p>Al nivel más básico, siempre que un navegador necesite un archivo almacenado en un  servidor web, el navegador hará una solicitud al servidor mediante la vía HTTP. Cuando la petición llega al servidor web correcto (hardware), el  servidor <em>HTTP </em> (software) envía el archivo antes solicitado, tambien a través de HTTP.</p>
+
+<p><img alt="Basic representation of a client/server connection through HTTP" src="https://mdn.mozillademos.org/files/8659/web-server.svg" style="height: 200px; width: 600px;"></p>
+
+<p>Para publicar un sitio web, necesitarás un servidor web dinámico o estático.</p>
+
+<p>Un <strong>servidor web estático</strong>, o pila, consiste en una computadora (hardware) con un servidor HTTP (software). Llamamos a este "estático" debido a que el servidor envía los archivos almacenados "tal cual" a tu navegador.</p>
+
+<p>Un <strong>servidor web dinámico </strong>consiste en un servidor web estático con un software extra , lo común es que sea una <em>aplicación</em> servidor <em> y una </em> base de datos<em>. Llamamos a esto</em> "dinámico" por que la aplicacion servidor actualiza los archivos almacenados en la base de datos antes de enviarlos mediante el servidor HTTP.</p>
+
+<p>Por ejemplo, para ver la página que ves en tu navegador finalmente, el servidor aplicación puede mostrar el diseño HTML con contenido desde una base de datos. Sitios como MDN o Wikipedia tienen cientos de páginas web, que no son realmente archivos HTML, si no una estrucura HTML asociada a una gigantesca base de datos. Esto hace mas fácil y rápido el mantenimiento y entrega del contenido.</p>
+
+<h2 id="Aprendizaje_activo">Aprendizaje activo</h2>
+
+<p><em>No hay aprendizaje activo disponible. <a href="https://developer.mozilla.org/en-US/docs/MDN/Getting_started">P</a><u>or favor, considere colaborar.</u></em></p>
+
+<h2 id="Inmersión_más_profunda">Inmersión más profunda</h2>
+
+<p>Para recuperar una página web, como ya dijimos, su navegador envía una solicitud al servidor web, que procede a buscar el archivo solicitado en su propio espacio de almacenamiento. Al encontrar el archivo, el servidor lo lee, lo procesa según sea necesario y lo envía al navegador. Veamos esos pasos con más detalle.</p>
+
+<h3 id="Alojamiento_de_archivos_Hosting">Alojamiento de archivos (Hosting)</h3>
+
+<p>Un servidor web primero debe almacenar los archivos del sitio web, es decir, todos los documentos HTML y sus medios relacionados, incluidas las imágenes, las hojas de estilo CSS, los archivos JavaScript, las fuentes y videos.</p>
+
+<p>Técnicamente, puede alojar todos esos archivos en su propia computadora, pero es mucho más conveniente almacenarlos en un servidor web dedicado que:</p>
+
+<ul>
+ <li>siempre está funcionando.</li>
+ <li>siempre está conectado a internet.</li>
+ <li>tiene la misma dirección IP todo el tiempo.</li>
+ <li>es mantenido por un proveedor externo.</li>
+</ul>
+
+<p>Por todas estas razones, encontrar un buen proveedor de alojamiento es una parte clave del desarrollo de su sitio web. Investigue a través de los diversos servicios que ofrecen las compañías y elija uno que se ajuste a sus necesidades y a su presupuesto (los servicios van desde los gratuitos hasta los miles de dólares al mes). Puede encontrar mas información <a href="https://developer.mozilla.org/en-US/Learn/How_much_does_it_cost#Hosting">en este artículo</a>.</p>
+
+<p>Una vez que configura una solución de alojamiento web, solo tiene que <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">cargar sus archivos en su servidor web</a>.</p>
+
+<h3 id="Comunicación_a_través_de_HTTP">Comunicación a través de HTTP</h3>
+
+<p>En segundo lugar, un servidor web brinda soporte para HTTP (<strong>H</strong>yper<strong>t</strong>ext <strong>T</strong>ransfer <strong>P</strong>rotocol ó  <span>Protocolo de Transferencia de Hipertexto</span>). <span class="tlid-translation translation"><span title="">Como su nombre lo indica, HTTP especifica cómo transferir hypertext (es decir, documentos web vinculados) entre dos computadoras.</span></span></p>
+
+<p>Un <em>protocolo </em> es un conjunto de reglas para la comunicación entre dos computadoras. HTTP es un protocolo textual, sin estado.</p>
+
+<dl>
+ <dt>Textual</dt>
+ <dd>Todos los comandos son de texto plano y legible para ser leído por humanos.</dd>
+ <dt><span class="tlid-translation translation"><span class="alt-edited" title="">Sin estado</span></span></dt>
+ <dd>Ni el servidor ni el cliente recuerdan las comunicaciones anteriores. Por ejemplo, al confiar solo en HTTP, un servidor no puede recordar la contraseña que ingresó ni el paso que está realizando en una transacción. Necesita un servidor de aplicaciones para tareas como esa. (Cubriremos ese tipo de tecnología en otros artículos).</dd>
+</dl>
+
+<p>HTTP proporciona reglas claras sobre cómo se comunican un cliente y un servidor. Cubriremos el propio HTTP en un <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP">artículo técnico</a> más adelante. Por ahora, sólo sé consciente de estas cosas:</p>
+
+<ul>
+ <li>Solo los clientes pueden hacer solicitudes HTTP a los servidores. Los servidores solo pueden responder a la solicitud HTTP de un cliente.</li>
+ <li>Al solicitar un archivo a través de HTTP, los clientes deben proporcionar la URL del archivo.</li>
+ <li>El servidor web debe responder a todas las solicitudes HTTP, al menos con un mensaje de error.</li>
+</ul>
+
+<p><a href="https://developer.mozilla.org/en-US/404"><img alt="The MDN 404 page as an example of such error page" src="https://mdn.mozillademos.org/files/8661/mdn-404.jpg" style="float: right; height: 300px; width: 300px;"></a> En un servidor web, el servidor HTTP es responsable de procesar y responder las solicitudes entrantes.</p>
+
+<ol>
+ <li>Al recibir una solicitud, un servidor HTTP primero verifica si la URL solicitada coincide con un archivo existente.</li>
+ <li>Si es así, el servidor web envía el contenido del archivo de nuevo al navegador. Si no, un servidor de aplicaciones construye el archivo necesario.</li>
+ <li>Si ninguno de los procesos es posible, el servidor web devuelve un mensaje de error al navegador, generalmente "404 Not Found". ( Ese error es tan común que muchos diseñadores web pasan bastante tiempo diseñando páginas de error 404.)</li>
+</ol>
+
+<h3 id="Contenido_Estático_vs._Dinámico">Contenido Estático vs. Dinámico</h3>
+
+<p><span class="tlid-translation translation"><span title="">En términos generales, un servidor puede entregar contenido estático o dinámico.</span> <span title="">"Estático" significa "servido como está".</span> <span title="">Los sitios web estáticos son los más fáciles de configurar, por lo que le sugerimos que convierta su primer sitio en un sitio estático.</span></span></p>
+
+<p>"Dinámico" significa que el servidor procesa el contenido o incluso lo genera desde una base de datos. Esta solución proporciona más flexibilidad, pero se vuelve más difícil de manejar, lo que hace que sea mucho más complejo desarrollar el sitio web.</p>
+
+<p>Tomemos por ejemplo la página que estás leyendo en este momento. En el servidor web que lo aloja, hay un servidor de aplicaciones que toma el contenido del artículo de una base de datos, lo formatea, lo coloca dentro de algunas plantillas HTML y le envía los resultados. En este caso, el servidor de aplicaciones se llama <a href="/en-US/docs/MDN/Kuma">Kuma </a>y está desarrollado con Python (utilizando el framework <a href="https://www.djangoproject.com/">Django</a>). El equipo de Mozilla creó Kuma para las necesidades específicas de MDN, pero hay muchas aplicaciones similares basadas en otras tecnologías.</p>
+
+<p><span class="tlid-translation translation"><span title="">Hay tantos servidores de aplicaciones que es resulta difícil sugerir uno en particular.</span></span> <span class="tlid-translation translation"><span title="">Algunos servidores de aplicaciones se adaptan a categorías específicas de sitios web como blogs, wikis o tiendas electrónicas;</span></span> <span class="tlid-translation translation"><span title="">otros, llamados</span></span> CMS (Content Management Systems ó <span class="tlid-translation translation"><span title="">Sistemas de Gestión de Contenidos</span></span>), <span class="tlid-translation translation"><span title="">son más genéricos.</span></span> <span class="tlid-translation translation"><span title="">Si está desarrollando un sitio web dinámico, tómese el tiempo para elegir una herramienta que se adapte a sus necesidades.</span></span> <span class="tlid-translation translation"><span title="">A menos que desee aprender algo de programación de servidores web</span></span> (¡es un área emocionante!), no necesita crear su propio servidor de aplicaciones.</p>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<p>Ahora que estás familiarizado con los servidores web, podrías:</p>
+
+<ul>
+ <li>leer sobre<a href="/en-US/docs/Learn/How_much_does_it_cost"> cuánto cuesta hacer algo en la web</a></li>
+ <li>consultar otros artículos relacionados con<a href="/en-US/docs/Learn/What_software_do_I_need">los diferentes software que puedes utilizar para crear un sitio web</a></li>
+ <li>pasar a algo práctico tipo: <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">¿cómo subir archivos al servidor?</a>.</li>
+</ul>
diff --git a/files/es/learn/common_questions/what_software_do_i_need/index.html b/files/es/learn/common_questions/what_software_do_i_need/index.html
new file mode 100644
index 0000000000..d5ee07aac3
--- /dev/null
+++ b/files/es/learn/common_questions/what_software_do_i_need/index.html
@@ -0,0 +1,227 @@
+---
+title: ¿Qué software necesito para construir un sitio web?
+slug: Learn/Common_questions/What_software_do_I_need
+tags:
+  - Build a website
+  - Building
+  - Mecanismos Web
+  - Principiante
+  - software
+translation_of: Learn/Common_questions/What_software_do_I_need
+original_slug: Learn/Common_questions/Que_software_necesito
+---
+<div class="summary">
+<p>En este artículo se explican cuales componentes de software necesita para editar, cargar, o visualizar un sitio web. </p>
+</div>
+
+<table class="learn-box nostripe standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Deberías conocer acerca de <a href="/en-US/docs/Learn/page_vs_site_vs_server_vs_search_engine">la diferencia entre páginas web, sitios web, servidores web, y moteres de búsqueda.</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender qué componentes de software necesita si quiere editar, cargar o visualizar un sitio web.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p><span class="seoSummary">Puede descargar la mayoría de los programas que necesita para el desarrollo web de forma gratuita. Proporcionaremos unos enlaces en este artículo. </span></p>
+
+<p><span class="seoSummary">Necesitarás herramientas para:</span></p>
+
+<ul>
+ <li><span class="seoSummary">Crear y editar páginas web </span></li>
+ <li><span class="seoSummary">Cargar archivos a tu servidor web</span></li>
+ <li><span class="seoSummary">Visualizar tu servidor web</span></li>
+</ul>
+
+<p><span class="seoSummary">Casi todos los sistemas operativos incluyen por defecto un editor de texto y un navegador, el cual puedes usar para ver los sitios web. Como resultado, usualmente sólo necesitas adquirir software para la transferencia de archivos a tu servidor web.</span></p>
+
+<h2 id="Aprendizaje_activo">Aprendizaje activo</h2>
+
+<p><em>No hay aprendizaje activo disponible todavía. <a href="/es/docs/MDN/Comenzando">Por favor, considere contribuir</a>.</em></p>
+
+<h2 id="Profundización">Profundización</h2>
+
+<h3 id="Creción_y_edición_de_páginas_web">Creción y edición de páginas web</h3>
+
+<p>Para crear y editar un sitio web, necesita un editor de texto. Editores de texto crean y modifican archivos de texto sin formato.  Otros formatos, como <strong>{{Glossary("RTF")}}</strong>, te permiten añadirle formato, como negrita y señalado, esos no son adecuados para escribir páginas web. Debe pensar bien qué editor de texto usar, ya que trabajará intensamente con él mientras construye el sitio web.</p>
+
+<p>Todos los sistemas operativos de escritorio traen un editor de texto básico. Estos editores son muy sencillos, pero les faltan características especiales para codificar páginas web. Si desea algo un poco más elegante, hay muchas herramientas de terceros disponibles. Editores de terceros, a menudo viene con características extra, como coloreado de sintaxis, autocompletado, secciones expandibles y búsqueda de código. A continuación se muestra una lista de algunos editores:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Sistema operativo</th>
+   <th scope="col">Editor incorporado</th>
+   <th scope="col">Editor de terceros</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>Windows</td>
+   <td>
+    <ul>
+     <li><a href="http://en.wikipedia.org/wiki/Notepad_%28software%29" rel="external">Notepad</a></li>
+    </ul>
+   </td>
+   <td>
+    <ul>
+     <li><a href="http://notepad-plus-plus.org/">Notepad++</a></li>
+     <li><a href="https://www.visualstudio.com/">Visual Studio Code</a></li>
+     <li><a href="https://www.jetbrains.com/webstorm/">Web Storm</a></li>
+     <li><a href="http://brackets.io/">Brackets</a></li>
+     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
+     <li><a href="https://www.sublimetext.com/">Sublime Text</a></li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <td>Mac OS</td>
+   <td>
+    <ul>
+     <li><a href="http://en.wikipedia.org/wiki/TextEdit" rel="external">TextEdit</a></li>
+    </ul>
+   </td>
+   <td>
+    <ul>
+     <li><a href="http://www.barebones.com/products/textwrangler/">TextWrangler</a></li>
+     <li><a href="https://www.visualstudio.com/">Visual Studio Code</a></li>
+     <li><a href="http://brackets.io/">Brackets</a></li>
+     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
+     <li><a href="https://www.sublimetext.com/">Sublime Text</a></li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <td>Linux</td>
+   <td>
+    <ul>
+     <li><a href="http://en.wikipedia.org/wiki/Vi" rel="external">Vi</a> (All UNIX)</li>
+     <li><a href="http://en.wikipedia.org/wiki/Gedit" rel="external">GEdit</a> (Gnome)</li>
+     <li><a href="http://en.wikipedia.org/wiki/Kate_%28text_editor%29" rel="external">Kate</a> (KDE)</li>
+     <li><a href="http://en.wikipedia.org/wiki/Leafpad" rel="external">LeafPad</a> (Xfce)</li>
+    </ul>
+   </td>
+   <td>
+    <ul>
+     <li><a href="http://www.gnu.org/software/emacs/">Emacs</a></li>
+     <li><a href="http://www.vim.org/" rel="external">Vim</a></li>
+     <li><a href="https://www.visualstudio.com/">Visual Studio Code</a></li>
+     <li><a href="http://brackets.io/">Brackets</a></li>
+     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
+     <li><a href="https://www.sublimetext.com/">Sublime Text</a></li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <td>Chrome OS</td>
+   <td> </td>
+   <td>
+    <ul>
+     <li><a href="https://shiftedit.net/">ShiftEdit</a></li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Aquí se muestra una captura de pantalla de un editor de texto avanzado:</p>
+
+<p><img alt="Screenshot of Notepad++." src="https://mdn.mozillademos.org/files/8221/NotepadPlusPlus.png" style="display: block; height: 311px; margin: 0 auto; width: 450px;"> </p>
+
+<p>Esta es una captura de panalla de un editor de texto online:</p>
+
+<p><img alt="Screenshot of ShiftEdit" src="https://mdn.mozillademos.org/files/15837/shiftedit.png" style="display: block; height: 311px; margin: 0 auto; width: 475px;"></p>
+
+<h3 id="Subir_archivos_a_la_Web">Subir archivos a la Web</h3>
+
+<p>Cuando tu sitio web está listo para visualización pública , tendrás que subir tus páginas web a tu servidor web. Puedes comprar espacio en un servidor de varios proveedores (vea el artículo <a class="new" href="/en-US/docs/Learn/How_much_does_it_cost">¿Cuánto cuesta hacer algo en la web?</a>). Una vez que establezca qué proveedor utilizar, el proveedor le enviará un correo con la información de acceso, usualmente en la forma de una URL SFTP, nombre de usuario, contraseña, y otra información necesaria para conectarte con su servidor. Tenga en cuenta que el protocolo (S)FTP está actualmente algo pasado de moda, mientras otros sistemas de carga de archivos están comenzando a volverse populares como <a href="https://en.wikipedia.org/wiki/Rsync">RSync</a> y <a href="https://help.github.com/articles/using-a-custom-domain-with-github-pages/">Git/GitHub</a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Note: </strong>FTP es inherentemente inseguro. Deberías asegurarte de que tu proveedor de alojamiento permite el uso de una conexión segura, por ejemplo SFTP o RSync sobre SSH.</p>
+</div>
+
+<p>Subir archivos a un sitio web es un paso muy importante mientras se crea un sitio web, por lo que sete tema se abarca en detalle en <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">un artículo aparte</a>. Por ahora, se presenta una lista de clientes (S)FTP gratuitos:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Sistema operativo</th>
+   <th colspan="2" rowspan="1" scope="col" style="text-align: center;"> Software FTP </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>Windows</td>
+   <td>
+    <ul>
+     <li><a href="http://winscp.net" rel="external">WinSCP</a></li>
+     <li><a href="http://mobaxterm.mobatek.net/">Moba Xterm</a></li>
+    </ul>
+   </td>
+   <td colspan="1" rowspan="3">
+    <ul>
+     <li><a href="https://filezilla-project.org/">FileZilla</a> (Todos los SO)</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <td>Linux</td>
+   <td>
+    <ul>
+     <li><a href="https://wiki.gnome.org/action/show/Apps/Files?action=show&amp;redirect=Apps%2FNautilus" rel="external">Nautilus/Files</a> (Gnome)</li>
+     <li><a href="http://dolphin.com/" rel="external">Dolphin</a> (KDE)</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <td> Mac OS</td>
+   <td>
+    <ul>
+     <li><a href="http://cyberduck.de/">Cyberduck</a></li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <td> Chrome OS</td>
+   <td>
+    <ul>
+     <li><a href="https://shiftedit.net/">ShiftEdit</a> (Todos los SO)</li>
+    </ul>
+   </td>
+   <td colspan="1"> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Navegación_por_sitios_web">Navegación por sitios web</h3>
+
+<p>Como ya sabe, necesita un navegador para ver los sitios web. Existen <a href="http://en.wikipedia.org/wiki/List_of_web_browsers">docenas</a>  de opciones de navegadores para uso personal, pero cuando usted está desarrollando un sitio web debe probarlo al menos con los navegadores principales siguientes, para estar seguro de que su sitio web funciona para la mayoría de las personas:  </p>
+
+<ul>
+ <li><a href="https://www.mozilla.org/en-US/firefox/new/" rel="external">Mozilla Firefox</a></li>
+ <li><a href="https://www.google.fr/chrome/browser/" rel="external">Google Chrome</a></li>
+ <li><a href="http://windows.microsoft.com/en-US/internet-explorer/download-ie" rel="external">Microsoft Internet Explorer</a></li>
+ <li><a href="http://www.apple.com/safari/" rel="external">Apple Safari</a></li>
+</ul>
+
+<p>Si su sitio está destinado a un grupo específico (por ejemplo, una plataforma técnica o país), puede que tenga que probar el sitio con navegadores adicionales, como <a href="http://www.opera.com/" rel="external">Opera</a>, <a href="http://www.konqueror.org/">Konqueror</a>, o<a href="http://www.ucweb.com/ucbrowser/" rel="external"> UC Browser</a>.</p>
+
+<p>Sin embargo las pruebas se dificultan debido a que algunos navegadores sólo funcionan en determinados sistemas operativos. Apple Safari se ejecuta en iOS y Mac OS, mientras Internet Explorer corre solamente en Windows. Lo mejor es aprovechar los servicios como <a href="http://browsershots.org/" rel="external">Browsershots</a> o <a href="http://www.browserstack.com/" rel="external">Browserstack</a>. Browsershots proporciona capturas de pantallas de tu sitio web en diferentes navegadores. Browserstack  realmente te otorga acceso remoto a máquinas virtuales de modo que puedes probar tu sitio en los entornos más comunes. De manera alternativa, puedes instalar tu propia máquina virtual, pero se necesita algo de experiencia. ( Si escoge este camino, Microsoft tiene algunas herramientas para desarrolladores incluso una máquina virtual lista para utilizar en <a href="https://modern.ie" rel="external">modern.ie</a>.)</p>
+
+<p>Sin falta ejecute algunas pruebas en dispositivos reales, especialmente en dispositivos móviles reales. Simulación de dispositivos móviles es una tecnología nueva, en evolución y menos confiable que la simulación de escritorio. Desde luego, los dispositivos móviles son costosos, por lo que le sugerimos echar un vistazo a <a href="http://opendevicelab.com/" rel="external">la inictiva de Laboratorios de dispositivos abiertos</a>. Puede además compartir dispositivos quiere probar en diferentes plataformas sin gastar mucho.</p>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<ul>
+ <li>Algunos de estos programas son gratis, pero no todos. <a href="/en-US/docs/Learn/Common_questions/How_much_does_it_cost">Descubra cuánto cuesta hacer algo en la web</a><a class="new" href="/en-US/docs/Learn/How_much_does_it_cost">.</a></li>
+ <li>Si desea aprrender más sobre editores de texto, lea este artículo acerca de <a href="/en-US/docs/Learn/Choose,_Install_and_set_up_a_text_editor">cómo seleccionar e instalar un editor de texto</a>.</li>
+ <li>Si se está preguntando cómo publicar en tu sitio web, eche un vistazo a <a href="/en-US/docs/Learn/Upload_files_to_a_web_server">"Cómo subir archivos a un servidor web"</a>.</li>
+</ul>
+
+<p> </p>
diff --git a/files/es/learn/como_contribuir/index.html b/files/es/learn/como_contribuir/index.html
deleted file mode 100644
index 6cc600f24d..0000000000
--- a/files/es/learn/como_contribuir/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: ¿Cómo contribuir al Área de Aprendizaje en MDN?
-slug: Learn/Como_Contribuir
-tags:
-  - Aprender
-  - Documentación
-  - Guía
-  - MDN Meta
-  - Principiante
-  - contribuir
-  - 'l10n:priority'
-translation_of: Learn/How_to_contribute
----
-<div>{{LearnSidebar}}</div>
-
-<p><br>
- <span style="line-height: 1.5;">Si estás aqui, es probable que sea porque estas interesado en contribuir al área de aprendizaje de MDN. ¡Una noticia estupenda!</span></p>
-
-<p><span class="seoSummary">En esta página encontrarás todo lo que necesitas para comenzar ayudando a mejorar el contenido de aprendizaje en MDN. Hay muchas cosas que puedes hacer, dependiendo de cuanto tiempo tienes y de si eres <a href="/en-US/Learn/How_to_contribute#I'm_a_beginner">principiante</a>, <a href="/en-US/Learn/How_to_contribute#I'm_a_web_developer">desarrollador web</a>, o <a href="/en-US/Learn/How_to_contribute#I'm_a_teacher">profesor</a>.</span></p>
-
-<div class="note">
-<p><strong>Nota:</strong> Si ya eres colaborador de MDN, no dudes en volver a revisar la <a href="/en-US/docs/MDN/Doc_status/Learn">página de status de la documentación</a> para mantener un seguimiento del trabajo que se ha realizado y observar cuáles son nuestras prioridades de escritura.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota:</strong> Los colaboradores usan<a href="https://trello.com/b/LDggrYSV"> tableros de Trello</a> para organizar sus actividades. Si quieres usarlos, no tienes más que <a href="https://trello.com/signup">crearte una cuenta de Trello </a>y avisar a <a href="/en-US/docs/MDN/Contribute/Drivers_and_curators">Jeremie</a> para que te deje editar el tablero.</p>
-</div>
-
-<h2 id="Soy_principiante">Soy principiante</h2>
-
-<p>¡Genial! Los principiantes son muy importantes y valiosos para crear y dar retroalimentación sobre el material de aprendizaje. Tú tienes una perspectiva única sobre estos artículos como miembro de la audiencia a la que están dirigidos, lo cual puede convertirte en un miembro de incalculable valor para nuestro equipo. De hecho, si estás aprendiendo algo de uno de nuestros artículos y te encuentras atascado, o tienes las sensación de que el artículo es algo confuso, puedes modificarlo tú mismo o simplemente informarnos para que podamos resolverlo.</p>
-
-<p>Colaborar es un gran modo de divertirse mientras se aprenden cosas nuevas. Si alguna vez te sientes perdido o tienes algunas preguntas, no dudes en contactarnos a través de <a href="/en-US/docs/MDN/Community#Join_our_mailing_lists">nuestra lista de correo </a>o <a href="/en-US/docs/MDN/Community#Get_into_IRC">nuestro canal IRC</a> (ve al final de la página para más detalles).</p>
-
-<p>A continuación puedes encontrar algunas formas de las que puedes contribuir:</p>
-
-<dl>
- <dt><a href="/en-US/docs/MDN/Contribute/Howto/Tag">Añade etiquetas a nuestros artículos</a> (<em>5 min</em>)</dt>
- <dd>Etiquetar contenido de MDN es una de las formas más sencillas de contribuir a MDN. Como muchas de las características de nuestra plataforma usan etiquetas para ayudar a presentar la información en contexto, la ayuda con el etiquetado es una contribución muy valiosa. Echa un vistazo a la lista de <a href="/en-US/docs/MDN/Doc_status/Glossary#No_tags">entradas del glosario</a> y a los <a href="/en-US/docs/MDN/Doc_status/Learn#No_tags">artículos de aprendizaje</a> sin etiquetas para comenzar.</dd>
- <dt><a href="/en-US/docs/Glossary">Lee y revisa una entrada de glosario</a> (<em>15 min</em>)</dt>
- <dd>Como principiante, necesitamos que tu vista fresca revise nuestro contenido. Si encuentras alguna entrada del glosario difícil de entender, significa que hay que mejorarla. No dudes en realizar cualquier cambio que estimes oportuno. Si crees que no tienes las habilidades adecuadas para editar la entrada, puedes contactarnos <span style="line-height: 1.5;">a través de </span><a href="/en-US/docs/MDN/Community#Join_our_mailing_lists" style="line-height: 1.5;">nuestra lista de correo</a>.</dd>
- <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">Escribe una nueva entrada de glosario </a>(<em>1 hora</em>)</dt>
- <dd>Esta es la forma más eficaz de aprender algo nuevo. Elige un concepto que quieras comprender y, mientras aprendes, escribe una entrada del glosario sobre dicho concepto. Explicar algo a otros es un buen modo de "fijar" el conocimiento a tu cerebro y de ayudarte a darle sentido a las cosas. Todo mientras ayudas a otras personas. ¡Gana todo el mundo!</dd>
- <dt><a href="/en-US/Learn/Index">Lee y revisa un artículo de aprendizaje</a> (<em>2 horas</em>)</dt>
- <dd>Esto es bastante similar a revisar entradas del glosario (ver arriba); aunque lleva más tiempo, ya que estos artículos son un poco más largos.</dd>
-</dl>
-
-<h2 id="Soy_desarrollador_web">Soy desarrollador web</h2>
-
-<p>¡Fantástico! Tus habilidades técnicas son justo lo que necesitamos para asegurarnos de que proporcionamos contenido técnicamente preciso para los principiantes. Como esta parte específica de MDN está dedicada al aprendizaje de la web, asegúrate de explicar las cosas de la forma más sencilla posible. Pero procura no pasarte de sencillez, ya que entonces el contenido deja de ser útil. Es más importante que se comprenda a que sea innecesariamente preciso.</p>
-
-<dl>
- <dt><a href="/en-US/docs/Glossary">Lee y revisa una entrada de glosario</a> (<em>15 min</em>)</dt>
- <dd>Como desarrollador web, te necesitamos para asegurarnos de que nuestro contenido es técnicamente correcto sin ser demasiado pedante. No dudes en realizar cualquier cambio que creas necesario. Si quieres debatir sobre el contenido antes de editarlo, danos un toque<span style="line-height: 1.5;"> </span><a href="/en-US/docs/MDN/Community#Join_our_mailing_lists" style="line-height: 1.5;">a nuestra lista de correo</a> o al <a href="/en-US/docs/MDN/Community#Get_into_IRC">canal IRC</a>.</dd>
- <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">Escribe una nueva entrada de glosario</a> (<em>1 hora</em>)</dt>
- <dd>Clarificar nuestra jerga técnica es un muy buen modo de aprender y ser técnicamente preciso y simple. La gente con menos experiencia te lo agradecerá. Tenemos <a href="/en-US/docs/Glossary#Contribute">muchos términos indefinidos</a> que necesitan tu atención. Escoge uno y listo.</dd>
- <dt><a href="/en-US/Learn/Index">Lee y revisa un artículo de aprendizaje</a> (<em>2 horas</em>)</dt>
- <dd>Esto es lo mismo que revisar entradas del glosario (ver arriba); aunque lleva un poco más de tiempo, ya que estos artículos son un poco más largos.</dd>
-</dl>
-
-<dl>
- <dt><a href="/en-US/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web">Escribe un nuevo artículo de aprendizaje</a> (<em>4 horas</em>)</dt>
- <dd>En MDN hacen falta artículos sencillos y prácticos sobre el uso de tecnologías web (<a href="/en-US/docs/Learn/CSS">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>, etc). Incluso tenemos contenido viejo en MDN que merece ser revisado y reformado. Lleva tus habilidades al límite para lograr que las tecnologías web puedan ser utilizadas incluso por principiantes.</dd>
- <dt><a href="/en-US/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">Crea ejercicios, ejemplos de código o herramientas de aprendizaje interactivo</a> (<em>? horas</em>)</dt>
- <dd>Todos nuestros artículos de aprendizaje requieren lo que nosotros llamamos materiales de "aprendizaje activo", porque la gente aprende mejor haciendo las cosas por sí mismos. Materiales como ejercicios o contenido interactivo que ayude a los usuarios a aplicar y manejar los conceptos detallados en un artículo. Hay muchas formas de crear contenido de aprendizaje activo, desde crear ejemplos de código con <a href="http://jsfiddle.net" rel="external">JSFiddle</a> o similares, hasta crear contenido interactivo completamente hackeable con <a href="https://thimble.webmaker.org/" rel="external">Thimble</a>. ¡Libera tu creatividad!</dd>
-</dl>
-
-<h2 id="Soy_profesor">Soy profesor</h2>
-
-<p>MDN tiene un largo historial de excelencia técnica, pero necesitamos ayuda para mostrar el camino a los principiantes en conceptos técnicos. Aqué es donde entras tú, como profesor o educador. Puedes ayudarnos a asegurar que nuestro material se provee de forma adecuada y práctica para nuestros lectores.</p>
-
-<dl>
- <dt><a href="/en-US/docs/Glossary">Lee y revisa una entrada en el glosario</a> (<em>15 min</em>)</dt>
- <dd>Comprueba una entrada en el glosario y siéntete libre de hacer todos los cambios que creas que son necesarios. Si quieres discutir el contenido antes de editarlo, danos un toque en nuestra <a href="/en-US/docs/MDN/Community#Join_our_mailing_lists" style="line-height: 1.5;">lista de correo </a> or <a href="/en-US/docs/MDN/Community#Get_into_IRC">Canal de chat IRC</a>.</dd>
- <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">Escribir una nueva entrada de glosario</a> (<em>1 hora</em>)</dt>
- <dd><span id="result_box" lang="es"><span>Las definiciones simples y claras de los términos y las descripciones básicas de los conceptos en el glosario son fundamentales para satisfacer las necesidades de los principiantes.</span> <span>Su experiencia como educador puede ayudar a crear excelentes entradas de glosario;</span> <span>tenemos</span></span>  <a href="/en-US/docs/Glossary#Contribute">muchos terminos indefinidos</a> que necesitan de su atención. Escoge uno y ve por él.</dd>
- <dt><a href="/en-US/docs/tag/needsSchema">Añadir ilustraciones y/o esquemas a los artículos</a> (<em>1 hora</em>)</dt>
- <dd>Como ya sabrás, Las ilustraciones son parte invaluable de cualquier contenido de aprendizaje. Esto es algo que generalmente falta en MDN y tus habilidades pueden haer la diferencia en esta área. Mira en los <a href="/en-US/docs/tag/needsSchema">artículos que le falan contenido ilustrativo</a> y escoge uno al que te gustaría crearle los gráficos.</dd>
- <dt><a href="/en-US/Learn/Index">Leer y revisar un artículo de aprendizaje</a> (<em>2 horas</em>)</dt>
- <dd><span id="result_box" lang="es"><span>Esto es similar a revisar las entradas del glosario (ver arriba), pero requiere más tiempo ya que los artículos son bastante más largos</span></span> .</dd>
- <dt><a href="/en-US/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web">Escribir un nuevo artículo de aprendizaje</a> (<em>4 horas</em>)</dt>
- <dd><span id="result_box" lang="es"><span title="We need simple, straightforward articles about the Web ecosystem and other functional topics around it.">Necesitamos artículos simples y directos sobre el ecosistema web y otros temas funcionales a su alrededor. </span><span title="Since these learning articles need to be educational rather than trying to literally cover everything there is to know, your experience in knowing what to cover and how will be a great asset.
-">Dado que estos artículos de aprendizaje deben ser educativos en lugar de tratar de cubrir literalmente todo lo que hay que saber, su experiencia en saber qué cubrir y cómo será una gran ventaja</span></span>.</dd>
- <dt><a href="/en-US/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">Crear ejercicios, cuestionarios o herramientas interactivas de aprendizaje</a> (<em>? horas</em>)</dt>
- <dd><span id="result_box" lang="es"><span title='All our learning articles require what we call "active learning" materials.'>Todos nuestros artículos de aprendizaje requieren lo que llamamos materiales de "aprendizaje activo". </span><span title="Such materials are exercises or interactive content which help a user learn to use and expand upon the concepts detailed in an article.">Dichos materiales son ejercicios o contenido interactivo que ayudan al usuario a aprender a usar y ampliar los conceptos detallados en un artículo. </span><span title="There are lots of things you can do here, from creating quizzes to building fully hackable interactive content with Thimble.">Aquí puede hacer muchas cosas, desde crear concursos hasta crear contenido interactivo completamente pirateable con</span></span>  <a href="https://thimble.webmaker.org/" rel="external">Thimble</a>. Da rienda suelta a tu creatividad!</dd>
- <dt><a href="/en-US/docs/MDN/Contribute/Howto/Create_learning_pathways">Crea rutas de aprendizaje</a> (<em>? horas</em>)</dt>
- <dd><span id="result_box" lang="es"><span title="In order to provide progressive and comprehensible tutorials, we need to shape our content into pathways.">Con el fin de proporcionar tutoriales progresivos y comprensibles, tenemos que dar forma a nuestro contenido en rutas. </span><span title="It's a way to gather existing content and figure out what is missing to create a learning article to write">Es una forma de recopilar contenido existente y descubrir lo que falta para crear un artículo de aprendizaje para escribir</span></span> .</dd>
-</dl>
diff --git a/files/es/learn/css/building_blocks/backgrounds_and_borders/index.html b/files/es/learn/css/building_blocks/backgrounds_and_borders/index.html
new file mode 100644
index 0000000000..a44c392720
--- /dev/null
+++ b/files/es/learn/css/building_blocks/backgrounds_and_borders/index.html
@@ -0,0 +1,307 @@
+---
+title: Fondos y bordes
+slug: Learn/CSS/Building_blocks/Backgrounds_and_borders
+translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders
+original_slug: Learn/CSS/Building_blocks/Fondos_y_bordes
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks")}}</div>
+
+<p>En este artículo, veremos algunas de las cosas creativas que puedes hacer con los fondos y los bordes de CSS. Añadir degradados, imágenes de fondo o redondear esquinas; los fondos y los bordes son la solución para una gran cantidad de cuestiones de estilo en CSS.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender a diseñar el fondo y los bordes de las cajas.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Aplicar_estilo_a_los_fondos_en_CSS">Aplicar estilo a los fondos en CSS</h2>
+
+<p>La propiedad {{cssxref ("background")}} de CSS es una propiedad abreviada de una serie de propiedades de fondo que vamos a ver en este artículo. Si descubres una propiedad de fondo compleja en una hoja de estilo, puede parecer un poco difícil de entender porque pueden estarse pasando muchos valores a la vez.</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  background: linear-gradient(105deg, rgba(255,255,255,.2) 39%, rgba(51,56,57,1) 96%) center center / 400px 200px no-repeat,
+  url(big-star.png) center no-repeat, rebeccapurple;
+} </code>
+</pre>
+
+<p>Más adelante en este tutorial regresaremos a cómo funcionan las propiedades abreviadas, pero primero echemos un vistazo a las diferentes cosas que puedes hacer con los fondos en CSS, a partir de observar las propiedades de fondo individuales.</p>
+
+<h3 id="Los_colores_de_fondo">Los colores de fondo</h3>
+
+<p>La propiedad {{cssxref ("background-color")}} define el color de fondo de cualquier elemento en CSS. La propiedad admite cualquier <code><a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a></code> válido. Un color de fondo (<code>background-color</code>) se extiende por debajo del contenido y el relleno del elemento.</p>
+
+<p>En el ejemplo siguiente hemos utilizado varios valores de color para añadir un color de fondo a la caja, a un encabezado y a un elemento {{htmlelement ("span")}}.</p>
+
+<p><strong>Juega un poco con ellos; usa cualquier valor <a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a> disponible.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/color.html", '100%', 800)}}</p>
+
+<h3 id="Las_imágenes_de_fondo">Las imágenes de fondo</h3>
+
+<p>La propiedad {{cssxref ("background-image")}} permite visualizar una imagen de fondo en un elemento. En el ejemplo siguiente hay dos cajas: una tiene una imagen de fondo que es más grande que la caja misma, la otra tiene una imagen pequeña en forma de estrella.</p>
+
+<p>Este ejemplo demuestra dos cosas sobre las imágenes de fondo. De forma predeterminada, la imagen grande no se reduce para ajustarse a la caja, por lo que solo vemos una pequeña esquina de esta, mientras que la imagen pequeña aparece en forma de mosaico hasta llenar la caja. En este caso, la imagen es en realidad una sola estrella.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/background-image.html", '100%', 800)}}</p>
+
+<p><strong>Si especificas un color de fondo además de una imagen de fondo, la imagen se muestra encima del color de fondo. Añade una propiedad <code>background-color</code> al ejemplo anterior y obsérvalo en acción.</strong></p>
+
+<h4 id="Controlar_background-repeat">Controlar background-repeat</h4>
+
+<p>La propiedad {{cssxref ("background-repeat")}} se usa para controlar el comportamiento de tipo mosaico de las imágenes. Los valores disponibles son:</p>
+
+<ul>
+ <li><code>no-repeat</code>: evita que el fondo se repita.</li>
+ <li><code>repeat-x</code>: repite horizontalmente.</li>
+ <li><code>repeat-y</code>: repite verticalmente.</li>
+ <li><code>repeat</code>: es el valor por defecto; repite en ambas direcciones.</li>
+</ul>
+
+<p><strong>Prueba estos valores en el ejemplo siguiente. Hemos establecido el valor <code>no-repeat</code>, así que solo verás una estrella. Prueba los diferentes valores (<code>repeat-x</code> y <code>repeat-y</code>) y observa cuáles son los efectos.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/repeat.html", '100%', 800)}}</p>
+
+<h4 id="Dimensionar_la_imagen_de_fondo">Dimensionar la imagen de fondo</h4>
+
+<p>En el ejemplo anterior hay una imagen grande que aparece recortada porque es más grande que el fondo. En este caso, podríamos usar la propiedad {{cssxref ("background-size")}}, que puede tomar valores de <a href="/es/docs/Web/CSS/length">longitud</a> o <a href="/es/docs/Web/CSS/porcentaje">porcentaje</a>, para ajustar el tamaño de la imagen para que quepa dentro del fondo.</p>
+
+<p>También puedes utilizar palabras clave:</p>
+
+<ul>
+ <li><code>cover</code>: el navegador agrandará la imagen lo suficientemente grande como para que esta cubra por completo el área de la caja sin que pierda su relación de aspecto. En este caso, es probable que parte de la imagen quede fuera de la caja.</li>
+ <li><code>contain</code>: el navegador adecuará el tamaño de la imagen para que quepa dentro de la caja. En este caso, pueden quedar huecos a ambos lados o en la parte superior e inferior de la imagen si la relación de aspecto de la imagen es diferente de la de la caja.</li>
+</ul>
+
+<p>En el ejemplo siguiente hemos usado la imagen más grande del ejemplo anterior y unidades de longitud para establecer sus dimensiones dentro de la caja. Puedes ver que esto ha distorsionado la imagen.</p>
+
+<p>Prueba lo siguiente:</p>
+
+<ul>
+ <li>Cambia las unidades de longitud que has utilizado para modificar el tamaño del fondo.</li>
+ <li>Elimina las unidades de longitud y observa qué sucede cuando usas <code>background-size: cover</code> o <code>background-size: contain</code>.</li>
+ <li>Si tu imagen es más pequeña que la caja, puedes cambiar el valor <code>background-repeat</code> para que la imagen se repita.</li>
+</ul>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/size.html", '100%', 800)}}</p>
+
+<h4 id="Posicionar_la_imagen_de_fondo">Posicionar la imagen de fondo</h4>
+
+<p>La propiedad {{cssxref ("background-position")}} te permite elegir la posición en la que aparece la imagen de fondo dentro de la caja a la que está asociada. Para ello se utiliza un sistema de coordenadas en el que la esquina superior izquierda de la caja es <code>(0,0)</code>, y la caja se coloca sobre los ejes horizontal (<code>x</code>) y vertical (<code>y</code>).</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: El valor predeterminado de <code>background-position</code> es <code>(0,0)</code>.</p>
+</div>
+
+<p>Los valores de <code>background-position</code> más comunes toman dos valores independientes: un valor horizontal seguido de un valor vertical.</p>
+
+<p>Puedes usar palabras clave como <code>top</code> y <code>right</code> (busca todas las demás en la página sobre la propiedad {{cssxref ("background-position")}}):</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  background-image: url(star.png);
+  background-repeat: no-repeat;
+  background-position: top center;
+} </code>
+</pre>
+
+<p>Y también <a href="/es/docs/Web/CSS/length">longitudes</a> y <a href="/es/docs/Web/CSS/porcentaje">porcentajes</a>:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  background-image: url(star.png);
+  background-repeat: no-repeat;
+  background-position: 20px 10%;
+} </code>
+</pre>
+
+<p>También puedes mezclar valores de palabras clave con longitudes o porcentajes, por ejemplo:</p>
+
+<pre class="brush: css notranslate">.box {
+  background-image: url(star.png);
+  background-repeat: no-repeat;
+  background-position: top 20px;
+}</pre>
+
+<p>Por último, también puedes usar una sintaxis de 4 valores para indicar una distancia desde ciertos bordes del cuadro: la unidad de longitud en este caso es un desplazamiento del valor que la precede. Entonces, en el CSS siguiente, colocamos el fondo a 20 px desde la parte superior y a 10 px desde la derecha:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  background-image: url(star.png);
+  background-repeat: no-repeat;
+  background-position: top 20px right 10px;
+} </code></pre>
+
+<p><strong>Utiliza el ejemplo siguiente para jugar con estos valores y mover la estrella por la caja.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/position.html", '100%', 800)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: <code>background-position</code> es una propiedad abreviada de {{cssxref("background-position-x")}} y {{cssxref("background-position-y")}}, que te permiten configurar los diferentes valores de posición del eje por separado.</p>
+</div>
+
+<h3 id="Degradados_de_fondo">Degradados de fondo</h3>
+
+<p>Un degradado, cuando se usa para un fondo, actúa como una imagen y también se establece usando la propiedad {{cssxref("background-image")}}.</p>
+
+<p>Puedes leer más sobre los diferentes tipos de degradados y sobre qué puedes hacer con ellos en la página sobre el tipo de datos <code><a href="/en-US/docs/Web/CSS/gradient">&lt;gradient&gt;</a></code> de MDN. Una forma divertida de jugar con degradados es usar uno de los muchos generadores de degradados CSS que hay disponibles en la web, <a href="https://cssgradient.io/">como este</a>. Puedes crear un degradado y luego copiar y pegar el código fuente que lo genera.</p>
+
+<p>Prueba algunos degradados diferentes en el ejemplo siguiente. En las dos cajas hay, respectivamente, un degradado lineal que se extiende por toda la caja, y un degradado radial con un tamaño establecido, que por lo tanto se repite.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/gradients.html", '100%', 800)}}</p>
+
+<h3 id="Múltiples_imágenes_de_fondo">Múltiples imágenes de fondo</h3>
+
+<p>También es posible poner múltiples imágenes de fondo: puedes especificar múltiples valores <code>background-image</code> para un solo atributo, separados cada uno por una coma.</p>
+
+<p>Si haces esto, las imágenes de fondo pueden quedar superpuestas entre sí. Los fondos se superponen con la última imagen de fondo que hay en la parte inferior de la lista, y cada imagen anterior se apila encima de la que sigue en el código.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Los degradados se pueden mezclar con imágenes de fondo normales.</p>
+</div>
+
+<p>Las otras propiedades <code>background-*</code> también pueden tener valores múltiples separados por comas, de la misma manera que <code>background-image</code>:</p>
+
+<pre class="brush: css notranslate">background-image: url(image1.png), url(image2.png), url(image3.png), url(image1.png);
+background-repeat: no-repeat, repeat-x, repeat;
+background-position: 10px 20px,  top right;</pre>
+
+<p>Cada valor de las diversas propiedades coincide con los valores que están en la misma posición en las otras propiedades. Arriba, por ejemplo, el valor para la propiedad <code>background-repeat</code> de <code>image1</code> será <code>no-repeat</code>. Sin embargo, ¿qué sucede cuando diferentes propiedades tienen una cantidad diferente de valores? La respuesta es que los valores que ocupan las posiciones más pequeñas se alternan cíclicamente: en el ejemplo anterior hay cuatro imágenes de fondo pero solo dos valores <code>background-position</code>. Los primeros dos valores de posición se aplicarán a las dos primeras imágenes, luego los valores volverán a asignarse cíclicamente: a <code>image3</code> se le dará el primer valor de posición, y a <code>image4</code> se le dará el segundo valor de posición.</p>
+
+<p><strong>Vamos a jugar. En el ejemplo siguiente hemos incluido dos imágenes. Para demostrar el orden de superposición, cambia la imagen de fondo que aparece primero en la lista. O juega con las otras propiedades para cambiar la posición, el tamaño o repite los valores.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/multiple-background-image.html", '100%', 800)}}</p>
+
+<h3 id="Anclaje_del_fondo">Anclaje del fondo</h3>
+
+<p>Otra opción que hay disponible para fondos es especificar cómo se desplazan cuando se desplaza el contenido. Esto se controla con la propiedad {{cssxref ("background-attachment")}}, que puede tomar los valores siguientes:</p>
+
+<ul>
+ <li><code>scroll</code>: Hace que el fondo del elemento se desplace cuando te desplazas por el contenido de la página. Si te desplazas por el contenido del elemento, el fondo no se mueve. El efecto resultante es que el fondo está anclado a la página en una posición fija, por lo que se desplaza a medida que la página se desplaza.</li>
+ <li><code>fixed</code>: Hace que el fondo de un elemento quede fijo con respecto a la ventana gráfica, de modo que no se desplace cuando te desplazas por la página o el contenido del elemento. Siempre permanece en la misma posición de la pantalla.</li>
+ <li><code>local</code>: Este valor se añadió posteriormente (solo es compatible con Internet Explorer 9+, mientras que los otros son compatibles con IE4+) porque el valor <code>scroll</code> es bastante confuso y en muchos casos no hace lo que deseas. El valor <code>local</code> ancla el fondo al elemento en el que está configurado, de modo que cuando te desplazas por el contenido del elemento, el fondo se desplaza con este.</li>
+</ul>
+
+<p>La propiedad {{cssxref ("background-attachment")}} solo tiene efecto cuando hay contenido por el que puedas desplazarte, por lo que hemos preparado un ejemplo para demostrar las diferencias entre los tres valores: echa un vistazo a <a href="http://mdn.github.io/learning-area/css/styling-boxes/backgrounds/background-attachment.html">background-attachment.html</a> (También puedes consultar el <a href="https://github.com/mdn/learning-area/tree/master/css/styling-boxes/backgrounds">código fuente</a> aquí).</p>
+
+<h3 id="Usar_la_propiedad_abreviada_para_el_fondo">Usar la propiedad abreviada para el fondo</h3>
+
+<p>Como mencionamos al comienzo de este artículo, a menudo verás fondos que están especificados usando la propiedad {{cssxref ("background")}}. Esta forma abreviada te permite configurar todas las diferentes propiedades a la vez.</p>
+
+<p>Si utilizas varios fondos, debes especificar todas las propiedades para el primer fondo y luego añadir el fondo siguiente separado por una coma. En el ejemplo siguiente hay un degradado con un tamaño y una posición, luego un fondo de imagen con <code>no-repeat</code> y una posición y, por último, un color.</p>
+
+<p>Al escribir los valores abreviados de las imágenes de fondo es necesario seguir algunas reglas, por ejemplo:</p>
+
+<ul>
+ <li>Solo es posible especificar un color de fondo (<code>background-color</code>) después de la coma final.</li>
+ <li>El valor para <code>background-size</code> solo puede incluirse inmediatamente después de <code>background-position</code>, separado con el carácter '/', así: <code>center/80%</code>.</li>
+</ul>
+
+<p>Consulta la página para el atributo {{cssxref ("background")}} de MDN para ver todas las posibilidades.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/background.html", '100%', 800)}}</p>
+
+<h3 id="Consideraciones_de_accesibilidad_con_los_fondos">Consideraciones de accesibilidad con los fondos</h3>
+
+<p>Al colocar texto sobre una imagen o un color de fondo, debes asegurarte de que tiene suficiente contraste para que tus visitantes puedan leer el texto. Si estableces una imagen de fondo y el texto se coloca encima de la imagen, también debes especificar un color de fondo (<code>background-color</code>) que permita leer el texto si la imagen no se carga.</p>
+
+<p>Los lectores de pantalla no pueden analizar las imágenes de fondo, por lo tanto, deben ser puramente decorativas; cualquier contenido importante debe ser parte de la página HTML y no debe estar contenido en un fondo.</p>
+
+<h2 id="Bordes">Bordes</h2>
+
+<p>Al aprender sobre el modelo de cajas descubrimos cómo los bordes afectan al tamaño de nuestra caja. En este artículo veremos cómo usar los bordes de una manera creativa. Por lo general, cuando a un elemento le añadimos bordes con CSS, usamos una propiedad abreviada que establece el color, el ancho y el estilo del borde en una línea de CSS.</p>
+
+<p>Podemos establecer un borde para los cuatro lados de una caja con {{cssxref ("border")}}:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  border: 1px solid black;
+} </code></pre>
+
+<p>O podemos establecer solo un borde de la caja, por ejemplo:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  border-top: 1px solid black;
+} </code></pre>
+
+<p>Cada una de las propiedades de estas propiedades abreviadas sería:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  border-width: 1px;
+  border-style: solid;
+  border-color: black;
+} </code></pre>
+
+<p>Y las no abreviadas:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  border-top-width: 1px;
+  border-top-style: solid;
+  border-top-color: black;
+} </code></pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Estas propiedades para el borde superior, derecho, inferior e izquierdo también tienen propiedades <em>lógicas</em> asignadas que se relacionan con el modo de escritura del documento (por ejemplo, texto de izquierda a derecha o de derecha a izquierda, o de arriba a abajo). Exploraremos esto en la próxima lección, que expone el <a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">uso de diferentes direcciones de texto</a>.</p>
+</div>
+
+<p><strong>Hay una variedad de estilos que puedes usar para los bordes. En el ejemplo siguiente, hemos utilizado un estilo de borde diferente para los cuatro lados de la caja. Juega con el estilo, el ancho y el color del borde para ver cómo funcionan los bordes.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/borders.html", '100%', 800)}}</p>
+
+<h3 id="Esquinas_redondeadas">Esquinas redondeadas</h3>
+
+<p>El redondeo de esquinas en una caja se logra mediante el uso de la propiedad {{cssxref ("border-radius")}} y otras propiedades asociadas que se relacionan con cada esquina de la caja. Como valor pueden usarse dos longitudes o porcentajes: el primer valor define el radio horizontal y el segundo el radio vertical. En muchos casos, solo se pondrá un valor, que se utilizará para ambos.</p>
+
+<p>Por ejemplo, para hacer que las cuatro esquinas de una caja tengan un radio de 10 píxeles:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  border-radius: 10px;
+} </code></pre>
+
+<p>O para hacer que la esquina superior derecha tenga un radio horizontal de 1 em y un radio vertical del 10%:</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  border-top-right-radius: 1em 10%;
+} </code></pre>
+
+<p>En el ejemplo siguiente hemos establecido las cuatro esquinas, y luego cambiamos los valores de la esquina superior derecha para que sea diferente. Juega con los valores para cambiar las esquinas. Echa un vistazo a la página de la propiedad {{cssxref ("border-radius")}} para ver las opciones de sintaxis disponibles.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/corners.html", '100%', 800)}}</p>
+
+<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
+
+<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más relevante? Encontrarás más pruebas para verificar que retienes la información antes de seguir adelante en<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Test_your_skills_backgrounds_and_borders"> Test your skills: Backgrounds and Borders</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>En este artículo hemos expuesto bastantes conceptos y puedes ver que hay mucho para añadir a un fondo o a un borde de una caja. Explora las diferentes páginas de propiedades si deseas obtener más información sobre cualquiera de las características que hemos discutido. Todas las páginas de MDN contienen más ejemplos de uso, para que juegues y mejores tus conocimientos.</p>
+
+<p>En el próximo artículo descubriremos cómo interacciona el modo de escritura de tu documento con tu CSS. ¿Qué sucede cuando el texto no fluye de izquierda a derecha?</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/cascada_y_herencia/index.html b/files/es/learn/css/building_blocks/cascada_y_herencia/index.html
deleted file mode 100644
index 91a359181f..0000000000
--- a/files/es/learn/css/building_blocks/cascada_y_herencia/index.html
+++ /dev/null
@@ -1,333 +0,0 @@
----
-title: Cascada y herencia
-slug: Learn/CSS/Building_blocks/Cascada_y_herencia
-translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance
----
-<div>{{LearnSidebar}}{{NextMenu("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks")}}</div>
-
-<p>El objetivo de este artículo es desarrollar la comprensión de algunos de los conceptos fundamentales de CSS (cascada, especificidad y herencia) que controlan cómo se aplica el CSS al HTML y cómo se resuelven los conflictos.</p>
-
-<p>A medida que avances en este apartado verás que puede resultar menos relevante y un poco más académico que otros artículos, pero la comprensión de estas cuestiones te ahorrará problemas más adelante. Te animamos a que trabajes meticulosamente este apartado y verifiques que entiendes los conceptos antes de continuar.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="https://developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y una idea de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender qué son la cascada y la especificidad, y cómo funciona la herencia en CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Reglas_conflictivas">Reglas conflictivas</h2>
-
-<p>CSS significa <strong> hojas de estilo en cascada</strong> (cascading style sheets), y es muy importante entender la palabra <em>cascada</em>. La forma en que se comporta la cascada es la clave para comprender el CSS.</p>
-
-<p>En algún momento trabajarás en un proyecto y encontrarás que el CSS que pensabas que debería aplicarse a un elemento no funciona. Por lo general, el problema suele ser que has creado dos normas que podrían aplicarse al mismo elemento. La <strong>cascada</strong>, y el concepto estrechamente relacionado de <strong>especificidad</strong> son mecanismos que controlan qué regla se aplica cuando aparecen tales conflictos. Es posible que la regla que se apliuca finalmente a tu elemento no sea la que esperas, por lo que debes comprender cómo funcionan estos mecanismos.</p>
-
-<p>También es significativo el concepto de <strong>herencia</strong>, que significa que algunas propiedades CSS heredan por defecto los valores establecidos en el elemento padre, pero otras no. Esto también puede causar una respuesta diferente a la que esperas.</p>
-
-<p>Vamos a empezar por echar un vistazo rápido a los principales elementos que nos interesan, y a continuación veremos cómo interactúan entre sí y con tu CSS. Pueden resultar un poco difíciles de entender, pero a medida que practiques escribiendo CSS te resultará más fácil de entender la manera cómo funcionan.</p>
-
-<h3 id="Cascada">Cascada</h3>
-
-<p>En un primer nivel de simplicidad, la <strong>cascada</strong> en las hojas de estilo significa que el orden de las reglas importa en CSS: cuando dos reglas tienen la misma especificidad, se aplica la que aparece en último lugar en el CSS.</p>
-
-<p>En el ejemplo siguiente tenemos dos reglas que pueden aplicarse al <code>h1</code>. El <code>h1</code> acaba siendo de color azul porque estas normas tienen un selector idéntico y, por lo tanto, tienen la misma especificidad. Por esta razón, se aplica la última que aparece.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/cascade-simple.html", '100%', 400)}} </p>
-
-<h3 id="Especificidad">Especificidad</h3>
-
-<p>La especificidad es el modo que tiene el navegador de decidir qué regla se aplica si diversas reglas tienen selectores diferentes pero podrían aplicarse a un mismo elemento. Básicamente, la especificidad mide cuán específica es la selección de un selector:</p>
-
-<ul>
- <li>Un selector de elemento es menos específico (selecciona todos los elementos de aquel tipo que aparecen en la página) por lo que presenta una puntuación más baja en especificidad.</li>
- <li>Un selector de clase es más específico (selecciona solo los elementos de una página que tienen un valor de atributo <code>class</code> dado), y por tanto recibe una puntuación mayor.</li>
-</ul>
-
-<p>Veamos un ejemplo. Aquí abajo encontrarás dos reglas que pueden aplicarse al elemento <code>h1</code>. Este elemento <code>h1</code> termina siendo de color rojo: el selector de clase confiere a esta regla una mayor especificidad, así que se aplicará a pesar de la regla para el selector de elemento que aparece más abajo en el orden del código.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/specificity-simple.html", '100%', 500)}} </p>
-
-<p>Profundizaremos en la especificidad más adelante.</p>
-
-<h3 id="Herencia">Herencia</h3>
-
-<p>La herencia también debe entenderse en este contexto: algunos valores de las propiedades CSS que se han establecido para los elementos padre los heredan los elementos hijo, pero otros no.</p>
-
-<p>Por ejemplo, si para un elemento se establece el color (<code>color</code>) y el tipo de letra (<code>font-family</code>), cada elemento que se encuentre dentro de él también se mostrará de ese color y con ese tipo de letra, a menos que les se haya aplicado un color y un tipo de letra diferentes directamente.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/inheritance-simple.html", '100%', 550)}} </p>
-
-<p>Algunas propiedades no se heredan. Por ejemplo, si para un elemento se establece un ancho {{cssxref("width")}} del 50%, sus descendientes no tendrán un 50% de ancho con respecto al de sus padres. Si este fuera el caso, ¡sería muy frustrante usar CSS!</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: En las páginas de referencia de las propiedades CSS de MDN encontrarás un cuadro con información técnica (por lo general, en la parte inferior de la sección de especificaciones) que enumera una serie de puntos sobre cada propiedad, incluyendo cuáles se heredan y cuáles no. Véase, por ejemplo, la <a href="/es/docs/Web/CSS/color#Especificaciones">sección de especificaciones de la propiedad color</a>.</p>
-</div>
-
-<h2 id="Comprender_cómo_trabajan_juntos_estos_conceptos">Comprender cómo trabajan juntos estos conceptos</h2>
-
-<p>Estos tres conceptos controlan qué CSS se aplica a qué elemento. En las secciones siguientes veremos cómo funcionan en conjunto. A veces puede parecer un poco complicado, pero lo irás recordando a medida que ganes experiencia con el CSS, y siempre puedes consultar los detalles si se te olvidan. ¡Incluso los desarrolladores experimentados lo hacen!</p>
-
-<h2 id="Comprender_la_herencia">Comprender la herencia</h2>
-
-<p>Vamos a empezar con la herencia. En el ejemplo siguiente tenemos un elemento {{HTMLElement( "ul")}} con dos niveles de listas no ordenadas anidadas en él. Hemos establecido para el <code>&lt;ul&gt;</code> exterior un borde, un relleno y un color de fuente.</p>
-
-<p>El color se ha aplicado a los hijos directos y también a los hijos indirectos: los elementos hijo <code>&lt;li&gt;</code> inmediatos y los que están dentro de la primera lista. A continuación, hemos añadido a la segunda lista anidada una clase especial y le hemos aplicado un color diferente, que los elementos hijo de esta heredarán.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/inheritance.html", '100%', 700)}} </p>
-
-<p>La anchura (como se mencionó anteriormente), los márgenes, el relleno y los bordes no se heredan. Si los elementos hijo de nuestra lista heredaran los bordes, todas las listas y los elementos de lista ganarían un borde cada vez ¡y no es probable que vez quieras un efecto así!</p>
-
-<p>Las propiedades que se heredan por defecto y las que no son cuestión, en gran medida, de sentido común.</p>
-
-<h3 id="Control_de_la_herencia">Control de la herencia</h3>
-
-<p>CSS proporciona cuatro valores de propiedad universales especiales para el control de la herencia. Todas las propiedades CSS aceptan estos valores.</p>
-
-<dl>
- <dt>{{cssxref("inherit")}}</dt>
- <dd>Establece que el valor de la propiedad que se aplica a un elemento determinado sea exactamente igual al del elemento padre. En la práctica, esto "activa la herencia".</dd>
- <dt>{{cssxref("initial")}}</dt>
- <dd>Establece que el valor de la propiedad que se aplica a un elemento seleccionado tenga el mismo valor que esté establecido para esa propiedad en la hoja de estilo por defecto del navegador.</dd>
- <dt>{{cssxref("unset")}}</dt>
- <dd>Restablece la propiedad a su valor natural, lo que significa que si la propiedad se hereda de forma natural, actúa como <code>inherit</code>, y en caso contrario como <code>initial</code>.</dd>
-</dl>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: También hay un valor más reciente, {{cssxref ("revert")}}, que todavía admiten pocos navegadores.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Véase la sección <a href="/en-US/docs/Web/CSS/Cascade#Origin_of_CSS_declarations" title="Este artículo explica qué es la cascada, el orden de la secuencia en cascada de las declaraciones CSS, y cómo esto afecta al desarrollador web.">El origen de las declaraciones CSS</a> en el artículo <a href="/en-US/docs/Web/CSS/Cascade" title=" Este artículo explica qué es la cascada, el orden de la secuencia en cascada de las declaraciones CSS, y cómo esto afecta al desarrollador web.">Introducción al concepto de cascada en CSS </a> para obtener más información sobre cada uno de estos valores y el modo en que funcionan.</p>
-</div>
-
-<p>A continuación veremos una lista de enlaces y exploraremos cómo funcionan los valores universales. El ejemplo en vivo de abajo te permite jugar con el CSS y ver lo que sucede cuando se hacen cambios. Jugar con el código es la mejor forma de enfrentarse al HTML y el CSS.</p>
-
-<p>Por ejemplo:</p>
-
-<ol>
- <li>Se ha aplicado la clase <code>my-class-1</code> al segundo elemento de lista. Esto establece por herencia el color del elemento <code>&lt;a&gt;</code> que está anidado en él. ¿Cómo cambia el color del enlace si quitamos esta regla?</li>
- <li>¿Entiendes por qué el tercer y el cuarto enlace se ven de este color? En caso contrario, comprueba la descripción de los valores anteriores.</li>
- <li>¿Cuál de los enlaces va a cambiar de color si se define un nuevo color para el elemento <code>&lt;a&gt;</code>, por ejemplo, <code>a { color: red; }</code>?</li>
-</ol>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/keywords.html", '100%', 700)}} </p>
-
-<h3 id="Restablecer_todos_los_valores_de_propiedad">Restablecer todos los valores de propiedad</h3>
-
-<p>La propiedad CSS abreviada <code>all</code> se puede utilizar para aplicar uno de estos valores de herencia a (casi) todas las propiedades a la vez. Su valor puede ser cualquiera de los valores de herencia (<code>inherit</code>, <code>initial</code>, <code>unset</code>, o <code>revert</code>). Es una forma práctica de deshacer los cambios realizados respecto al estilo para que puedas volver a un punto de partida conocido antes de empezar a introducir cambios.</p>
-
-<p>En el ejemplo siguiente hay dos bloques de cita. El primero ya tiene un estilo aplicado al propio elemento de cita, mientras que el segundo tiene una clase aplicada al bloque de cita que establece el valor <code>all</code> en <code>unset</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/all.html", '100%', 700)}} </p>
-
-<p>Prueba a establecer el valor de <code>all</code> al resto de valores disponibles y observa la diferencia.</p>
-
-<h2 id="Comprender_la_cascada">Comprender la cascada</h2>
-
-<p>Ahora entendemos por qué un párrafo que está anidado en la estructura del HTML es del mismo color que el CSS aplicado al cuerpo (<code>body</code>) del HTML y, a partir de los artículos de introducción sabemos cómo cambiar el CSS aplicado a algo en cualquier parte del documento, ya sea mediante la asignación de CSS a un elemento o la creación de una clase. Ahora vamos a echar un vistazo a la forma en que el concepto de cascada define qué reglas CSS se aplican cuando más de un elemento de estilo puede aplicar estilo a un elemento.</p>
-
-<p>Hay que considerar tres factores, que se enumeran a continuación en orden de importancia creciente. Los posteriores invalidan los anteriores:</p>
-
-<ol>
- <li><strong>Orden en el código</strong></li>
- <li><strong>Especificidad</strong></li>
- <li><strong>Importancia</strong></li>
-</ol>
-
-<p>Vamos a explicarlos para ver cómo los navegadores determinan exactamente que CSS deben aplicar.</p>
-
-<h3 id="Orden_en_el_código">Orden en el código</h3>
-
-<p>Ya hemos visto cómo el orden en el código es importante en el concepto de cascada. Si tienes más de una regla con exactamente el mismo peso, la que ocupa el último lugar en el CSS gana. Puedes entenderlo como que las reglas que están más cerca del elemento considerado sobreescriben las anteriores hasta que la última gana y da formato al elemento.</p>
-
-<h3 id="Especificidad_2">Especificidad</h3>
-
-<p>Una vez entendido el hecho de que el orden de los elementos en el código es importante, te encontrarás en alguna situación en la que sabes cuál es la última norma en la hoja de estilo, pero se aplica una regla anterior. Esto se debe a que la regla anterior tiene <strong>una especificidad mayor</strong>, es decir, es más específica y, por lo tanto, el navegador la escoge como la que debe dar forma al elemento.</p>
-
-<p>Como hemos visto anteriormente en este mismo artículo, un selector de clase tiene más peso que un selector de elemento, por lo que las propiedades que se definen en la clase tienen prioridad sobre las que se aplican directamente en el elemento.</p>
-
-<p>Un elemento que hay que tener en cuenta es que aunque pensamos en términos de selectores y reglas que se aplican a lo que estos seleccionan, no es toda la regla lo que se sobrescribe, sino solo las propiedades que entran en conflicto.</p>
-
-<p>Este comportamiento ayuda a evitar repeticiones en el CSS. Una práctica común es definir estilos genéricos para los elementos básicos y luego, crear clases para los elementos que son diferentes. Por ejemplo, en la hoja de estilo que mostramos a continuación hemos definido estilos genéricos para los encabezados de nivel 2; posteriormente hemos creado algunas clases que solo cambian algunas de las propiedades y los valores. Los valores definidos inicialmente se aplican a todos los encabezados, y entonces los valores más específicos se aplican a los encabezados con las clases.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/mixing-rules.html", '100%', 700)}} </p>
-
-<p>Ahora vamos a echar un vistazo a cómo el navegador calcula la especificidad. Ya sabemos que un selector de elemento tiene una especificidad baja y se puede sobrescribir con un elemento de clase. Esencialmente se otorga un valor de puntos a los diferentes tipos de selectores y la suma de estos establece la importancia de ese selector en particular, que a continuación puede evaluarse ante otras posibles coincidencias.</p>
-
-<p>La cantidad de especificidad de un selector se mide usando cuatro valores diferentes (o componentes), que pueden describirse como millares, centenas, decenas y unidades (cuatro dígitos individuales dispuestos en cuatro columnas):</p>
-
-<ol>
- <li><strong>Millares</strong>: Se suma un punto en esta columna si la declaración está en un atributo de {{htmlattrxref ("style")}} o, como suelen denominarse, estilos en línea. Tales declaraciones no tienen selectores, por lo que su especificidad siempre es 1000.</li>
- <li><strong>Centenas</strong>: Se suma un punto en esta columna por cada selector con ID particular que esté contenido en el selector general.</li>
- <li><strong>Decenas</strong>: Se suma un punto en esta columna por cada selector de clase, de atributo o pseudoclase que estén contenidos en el selector general.</li>
- <li><strong>Unidades</strong>: Se suma un punto en esta columna por cada selector o pseudoelemento que esté contenido en el selector general.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: El selector universal (<code>*</code>), los operadores de combinación (<code>+</code>, <code>&gt;</code>, <code>~</code>, ' ') y la pseudo-clase de negación (<code>:not</code>) no tienen ningún efecto sobre la especificidad.</p>
-</div>
-
-<p>La tabla siguiente muestra algunos ejemplos concretos para ayudarte a entenderlo mejor. Analízalos y trata de entender por qué tienen la especificidad que les hemos dado. Aun no hemos explicado los selectores de forma detallada, pero puedes encontrar detalles de cada selector en los <a href="/es/docs/Web/CSS/Selectores_CSS">selectores de referencia</a> de MDN.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Selector</th>
-   <th scope="col">Millares:</th>
-   <th scope="col">Centenas:</th>
-   <th scope="col">Decenas:</th>
-   <th scope="col">Unidades:</th>
-   <th scope="col">Especificidad total</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>h1</code></td>
-   <td>0</td>
-   <td>0</td>
-   <td>0</td>
-   <td>1</td>
-   <td>0001</td>
-  </tr>
-  <tr>
-   <td><code>h1 + p::first-letter</code></td>
-   <td>0</td>
-   <td>0</td>
-   <td>0</td>
-   <td>3</td>
-   <td>0003</td>
-  </tr>
-  <tr>
-   <td><code>li &gt; a[href*="en-US"] &gt; .inline-warning</code></td>
-   <td>0</td>
-   <td>0</td>
-   <td>2</td>
-   <td>2</td>
-   <td>0022</td>
-  </tr>
-  <tr>
-   <td><code>#identifier</code></td>
-   <td>0</td>
-   <td>1</td>
-   <td>0</td>
-   <td>0</td>
-   <td>0100</td>
-  </tr>
-  <tr>
-   <td>Sin selector, con una regla en el atributo de un elemento {{htmlattrxref("style")}}</td>
-   <td>1</td>
-   <td>0</td>
-   <td>0</td>
-   <td>0</td>
-   <td>1000</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Antes de continuar, vamos a ver un ejemplo:</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/specificity-boxes.html", '100%', 700)}} </p>
-
-<p>¿Qué pasa aquí? En primer lugar, estamos interesados solo en las primeras siete reglas de este ejemplo y, como te habrás dado cuenta, hemos incluido sus valores de especificidad en un comentario antes de cada una.</p>
-
-<ul>
- <li>Los dos primeros selectores compiten sobre el estilo del color del fondo del vínculo (el segundo gana y por eso el color de fondo es azul, porque en la cadena hay un selector con ID particular extra: la especificidad es de 201 contra 101).</li>
- <li>El tercer y el cuarto selector compiten sobre el estilo del color del texto del enlace (el segundo gana y hace que el texto sea blanco porque, aunque tiene un selector de elemento de menos, el selector que falta se sustituye por un selector de clase, con un valor de decena en vez de un valor de unidad). Así que la especificidad es de 113 contra 104.</li>
- <li>Los selectores 5-7 compiten por el estilo del borde del vínculo cuando el cursor se desplaza sobre estos. El sexto selector pierde claramente ante el quinto con una especificidad de 23 contra 24. En la cadena hay un selector de elemento de menos. El séptimo selector, sin embargo, los supera a ambos: en la cadena hay el mismo número de estos subselectores que en el quinto, pero se ha intercambiado un elemento por un selector de clase. Así que la especificidad es de 33 contra 23 y 24.</li>
-</ul>
-
-<ol>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Esto solo es un ejemplo aproximado para facilitar la comprensión. En realidad, cada tipo de selector tiene su nivel de especificidad propio, que no pueden sobrescribir los selectores con un nivel de especificidad menor. Por ejemplo, un <em>millar</em> de selectores de <strong>clase</strong> combinados no serían capaces de sobrescribir las reglas de <em>un</em> selector <strong>ID</strong>.</p>
-
-<p>Una forma más precisa de evaluar la especificidad sería anotar los niveles de especificidad individualmente de mayor a menor. Solo cuando hay empate entre las puntuaciones de los selectores dentro de un nivel especifico será necesario evaluar el nivel inferior siguiente; de lo contrario, puedes prescindir de los selectores de especificidad de los niveles inferiores, ya que nunca pueden sobrescribir los niveles de especificidad más altos.</p>
-</div>
-
-<h3 id="Propiedad_!important">Propiedad <code>!important</code></h3>
-
-<p>Hay una pieza especial de CSS que se puede utilizar para anular todos los cálculos anteriores, sin embargo se debe tener mucho cuidado con su uso: <code>!important</code>. Se utiliza para convertir una propiedad y un valor particular en el elemento más específico, de modo que se invalidan las reglas normales de la cascada.</p>
-
-<p>Echa un vistazo a este ejemplo en el que se muestran dos párrafos, uno de los cuales tiene un elemento ID.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/cascade/important.html", '100%', 700)}} </p>
-
-<p>Vamos a observarlo con detenimiento para ver qué sucede. Elimina algunas de las propiedades para ver lo que sucede si te cuesta entender lo que ocurre:</p>
-
-<ol>
- <li>Verás que se han aplicado los valores de {{cssxref("color")}} y {{cssxref("padding")}} de la tercera regla pero no el de {{cssxref("background-color")}}. ¿Por qué? Deberían haberse aplicado para los tres porque las reglas que se encuentran más adelante en el orden en el código fuente prevalecen sobre las reglas anteriores.</li>
- <li>Sin embargo, ganan las reglas que están antes porque los selectores de clase tienen mayor especificidad que selectores de elemento.</li>
- <li>En ambos bloques de código hay una clase {{htmlattrxref("class")}} con el valor <code>better</code>, pero en el segundo bloque de código hay un {{htmlattrxref("id")}} con el valor <code>winning</code>. Puesto que los identificadores tienen una especificidad <em>incluso mayor</em> que las clases (solo puede haber un elemento con un determinado ID en cada página, mientras que puede haber muchos elementos de la misma clase: los selectores ID son <em>muy específicos</em> con lo que delimitan), el primer bloque de código tendría un fondo de color gris y ningún borde, según lo que especifica la clase, mientras que al segundo bloque de código se aplicarían tanto el color de fondo rojo como el borde negro de 1 píxel.</li>
- <li>El segundo elemento, en cambio, se muestra con el fondo de color rojo pero sin borde. ¿Por qué? Porque la declaración <code>!important</code> que hay en la segunda regla, después de <code>border: none</code> significa que esta declaración tendrá más valor que la regla anterior, aunque el ID de esta tenga mayor especificidad.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: La única manera de anular la declaración <code>!important</code> sería incluir otra declaración <code>!important</code> en una declaración con la <em>misma especificidad</em> que aparezca más adelante en el orden del código fuente, o con una especificidad superior.</p>
-</div>
-
-<p>Es útil saber que <code>!important</code> existe para que sepas qué es cuando te lo encuentres en el código de otras personas. <strong>Sin embargo, te recomendamos encarecidamente que no lo utilices a menos que sea absolutamente necesario.</strong> <code>!important</code> cambia el modo en que suele funcionar la cascada, por lo que puede dificultar mucho la depuración de problemas en el CSS, especialmente en una hoja de estilo grande.</p>
-
-<p>Una situación en la que puede que tengas que utilizarlo es si trabajas en un CMS en el que no es posible editar los módulos básicos de CSS y realmente tienes que anular un estilo que no puede anularse de ninguna otra forma. Aun así, te recomendamos encarecidamente que evites su uso.</p>
-
-<h2 id="El_efecto_de_la_ubicación_del_CSS">El efecto de la ubicación del CSS</h2>
-
-<p>Por último, resulta útil señalar que la importancia de una declaración CSS depende de la hoja de estilo en que se especifica (es posible que los usuarios configuren hojas de estilo personalizadas para anular los estilos de los desarrolladores, por ejemplo, porque el usuario podría tener alguna discapacidad visual, o bien porque desea configurar el tamaño de letra de todas las páginas web que visita para que sea el doble de grande y le proporcione una mayor facilidad de lectura).</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Las declaraciones contradictorias se aplicarán en el orden siguiente (recuerda que las últimas prevalecen sobre las anteriores):</p>
-
-<ol>
- <li>Declaraciones en las hojas de estilo de agente de usuario (por ejemplo, estilos predeterminados del navegador, que se utilizan cuando no hay otro estilo).</li>
- <li>Declaraciones normales en las hojas de estilo del usuario (estilos personalizados creados por un usuario).</li>
- <li>Declaraciones normales en las hojas de estilo de autor (los estilos que creamos nosotros, los desarrolladores web).</li>
- <li>Declaraciones <code>!important</code> en las hojas de estilo de autor</li>
- <li>Declaraciones <code>!important</code> en las hojas de estilo del usuario</li>
-</ol>
-
-<p>Para los desarrolladores tiene sentido que sus hojas de estilo anulen a las de usuario para mantener el diseño según lo previsto, pero, como hemos visto, a veces los usuarios tienen buenas razones para anular las directrices de los desarrolladores web. Esto puede lograrse con el uso de <code>!important</code> en sus reglas.</p>
-
-<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
-
-<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más importante? Encontrarás más pruebas para verificar que retienes esa einformación en <a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_tasks">Test your skills: the Cascade</a>.</p>
-
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-
-<p>Si has entendido la mayor parte de este artículo, ¡enhorabuena! Has comenzado a familiarizarte con la mecánica fundamental del CSS. En el artículo siguiente vamos a ver con detalle los selectores.</p>
-
-<p>Si todavía no tienes una comprensión completa de los conceptos de cascada, especificidad y herencia, ¡no te preocupes! Es, sin duda, lo más complejo que hemos expuesto hasta ahora y es algo que incluso los desarrolladores web profesionales encuentran difícil. Te aconsejamos que regreses a este artículo cuantas veces necesites a medida que avances con el curso.</p>
-
-<p>Regresa a esta página si empiezas a toparte con problemas extraños o con que los estilos no se aplican de la forma que esperas. Podría ser un problema de especificidad.</p>
-
-<p>{{NextMenu("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudo-clases y los pseudo-elementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario </a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/cascade_and_inheritance/index.html b/files/es/learn/css/building_blocks/cascade_and_inheritance/index.html
new file mode 100644
index 0000000000..b90c7a9d1f
--- /dev/null
+++ b/files/es/learn/css/building_blocks/cascade_and_inheritance/index.html
@@ -0,0 +1,334 @@
+---
+title: Cascada y herencia
+slug: Learn/CSS/Building_blocks/Cascade_and_inheritance
+translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance
+original_slug: Learn/CSS/Building_blocks/Cascada_y_herencia
+---
+<div>{{LearnSidebar}}{{NextMenu("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks")}}</div>
+
+<p>El objetivo de este artículo es desarrollar la comprensión de algunos de los conceptos fundamentales de CSS (cascada, especificidad y herencia) que controlan cómo se aplica el CSS al HTML y cómo se resuelven los conflictos.</p>
+
+<p>A medida que avances en este apartado verás que puede resultar menos relevante y un poco más académico que otros artículos, pero la comprensión de estas cuestiones te ahorrará problemas más adelante. Te animamos a que trabajes meticulosamente este apartado y verifiques que entiendes los conceptos antes de continuar.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="https://developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y una idea de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender qué son la cascada y la especificidad, y cómo funciona la herencia en CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Reglas_conflictivas">Reglas conflictivas</h2>
+
+<p>CSS significa <strong> hojas de estilo en cascada</strong> (cascading style sheets), y es muy importante entender la palabra <em>cascada</em>. La forma en que se comporta la cascada es la clave para comprender el CSS.</p>
+
+<p>En algún momento trabajarás en un proyecto y encontrarás que el CSS que pensabas que debería aplicarse a un elemento no funciona. Por lo general, el problema suele ser que has creado dos normas que podrían aplicarse al mismo elemento. La <strong>cascada</strong>, y el concepto estrechamente relacionado de <strong>especificidad</strong> son mecanismos que controlan qué regla se aplica cuando aparecen tales conflictos. Es posible que la regla que se apliuca finalmente a tu elemento no sea la que esperas, por lo que debes comprender cómo funcionan estos mecanismos.</p>
+
+<p>También es significativo el concepto de <strong>herencia</strong>, que significa que algunas propiedades CSS heredan por defecto los valores establecidos en el elemento padre, pero otras no. Esto también puede causar una respuesta diferente a la que esperas.</p>
+
+<p>Vamos a empezar por echar un vistazo rápido a los principales elementos que nos interesan, y a continuación veremos cómo interactúan entre sí y con tu CSS. Pueden resultar un poco difíciles de entender, pero a medida que practiques escribiendo CSS te resultará más fácil de entender la manera cómo funcionan.</p>
+
+<h3 id="Cascada">Cascada</h3>
+
+<p>En un primer nivel de simplicidad, la <strong>cascada</strong> en las hojas de estilo significa que el orden de las reglas importa en CSS: cuando dos reglas tienen la misma especificidad, se aplica la que aparece en último lugar en el CSS.</p>
+
+<p>En el ejemplo siguiente tenemos dos reglas que pueden aplicarse al <code>h1</code>. El <code>h1</code> acaba siendo de color azul porque estas normas tienen un selector idéntico y, por lo tanto, tienen la misma especificidad. Por esta razón, se aplica la última que aparece.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/cascade-simple.html", '100%', 400)}} </p>
+
+<h3 id="Especificidad">Especificidad</h3>
+
+<p>La especificidad es el modo que tiene el navegador de decidir qué regla se aplica si diversas reglas tienen selectores diferentes pero podrían aplicarse a un mismo elemento. Básicamente, la especificidad mide cuán específica es la selección de un selector:</p>
+
+<ul>
+ <li>Un selector de elemento es menos específico (selecciona todos los elementos de aquel tipo que aparecen en la página) por lo que presenta una puntuación más baja en especificidad.</li>
+ <li>Un selector de clase es más específico (selecciona solo los elementos de una página que tienen un valor de atributo <code>class</code> dado), y por tanto recibe una puntuación mayor.</li>
+</ul>
+
+<p>Veamos un ejemplo. Aquí abajo encontrarás dos reglas que pueden aplicarse al elemento <code>h1</code>. Este elemento <code>h1</code> termina siendo de color rojo: el selector de clase confiere a esta regla una mayor especificidad, así que se aplicará a pesar de la regla para el selector de elemento que aparece más abajo en el orden del código.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/specificity-simple.html", '100%', 500)}} </p>
+
+<p>Profundizaremos en la especificidad más adelante.</p>
+
+<h3 id="Herencia">Herencia</h3>
+
+<p>La herencia también debe entenderse en este contexto: algunos valores de las propiedades CSS que se han establecido para los elementos padre los heredan los elementos hijo, pero otros no.</p>
+
+<p>Por ejemplo, si para un elemento se establece el color (<code>color</code>) y el tipo de letra (<code>font-family</code>), cada elemento que se encuentre dentro de él también se mostrará de ese color y con ese tipo de letra, a menos que les se haya aplicado un color y un tipo de letra diferentes directamente.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/inheritance-simple.html", '100%', 550)}} </p>
+
+<p>Algunas propiedades no se heredan. Por ejemplo, si para un elemento se establece un ancho {{cssxref("width")}} del 50%, sus descendientes no tendrán un 50% de ancho con respecto al de sus padres. Si este fuera el caso, ¡sería muy frustrante usar CSS!</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: En las páginas de referencia de las propiedades CSS de MDN encontrarás un cuadro con información técnica (por lo general, en la parte inferior de la sección de especificaciones) que enumera una serie de puntos sobre cada propiedad, incluyendo cuáles se heredan y cuáles no. Véase, por ejemplo, la <a href="/es/docs/Web/CSS/color#Especificaciones">sección de especificaciones de la propiedad color</a>.</p>
+</div>
+
+<h2 id="Comprender_cómo_trabajan_juntos_estos_conceptos">Comprender cómo trabajan juntos estos conceptos</h2>
+
+<p>Estos tres conceptos controlan qué CSS se aplica a qué elemento. En las secciones siguientes veremos cómo funcionan en conjunto. A veces puede parecer un poco complicado, pero lo irás recordando a medida que ganes experiencia con el CSS, y siempre puedes consultar los detalles si se te olvidan. ¡Incluso los desarrolladores experimentados lo hacen!</p>
+
+<h2 id="Comprender_la_herencia">Comprender la herencia</h2>
+
+<p>Vamos a empezar con la herencia. En el ejemplo siguiente tenemos un elemento {{HTMLElement( "ul")}} con dos niveles de listas no ordenadas anidadas en él. Hemos establecido para el <code>&lt;ul&gt;</code> exterior un borde, un relleno y un color de fuente.</p>
+
+<p>El color se ha aplicado a los hijos directos y también a los hijos indirectos: los elementos hijo <code>&lt;li&gt;</code> inmediatos y los que están dentro de la primera lista. A continuación, hemos añadido a la segunda lista anidada una clase especial y le hemos aplicado un color diferente, que los elementos hijo de esta heredarán.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/inheritance.html", '100%', 700)}} </p>
+
+<p>La anchura (como se mencionó anteriormente), los márgenes, el relleno y los bordes no se heredan. Si los elementos hijo de nuestra lista heredaran los bordes, todas las listas y los elementos de lista ganarían un borde cada vez ¡y no es probable que vez quieras un efecto así!</p>
+
+<p>Las propiedades que se heredan por defecto y las que no son cuestión, en gran medida, de sentido común.</p>
+
+<h3 id="Control_de_la_herencia">Control de la herencia</h3>
+
+<p>CSS proporciona cuatro valores de propiedad universales especiales para el control de la herencia. Todas las propiedades CSS aceptan estos valores.</p>
+
+<dl>
+ <dt>{{cssxref("inherit")}}</dt>
+ <dd>Establece que el valor de la propiedad que se aplica a un elemento determinado sea exactamente igual al del elemento padre. En la práctica, esto "activa la herencia".</dd>
+ <dt>{{cssxref("initial")}}</dt>
+ <dd>Establece que el valor de la propiedad que se aplica a un elemento seleccionado tenga el mismo valor que esté establecido para esa propiedad en la hoja de estilo por defecto del navegador.</dd>
+ <dt>{{cssxref("unset")}}</dt>
+ <dd>Restablece la propiedad a su valor natural, lo que significa que si la propiedad se hereda de forma natural, actúa como <code>inherit</code>, y en caso contrario como <code>initial</code>.</dd>
+</dl>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: También hay un valor más reciente, {{cssxref ("revert")}}, que todavía admiten pocos navegadores.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Véase la sección <a href="/en-US/docs/Web/CSS/Cascade#Origin_of_CSS_declarations" title="Este artículo explica qué es la cascada, el orden de la secuencia en cascada de las declaraciones CSS, y cómo esto afecta al desarrollador web.">El origen de las declaraciones CSS</a> en el artículo <a href="/en-US/docs/Web/CSS/Cascade" title=" Este artículo explica qué es la cascada, el orden de la secuencia en cascada de las declaraciones CSS, y cómo esto afecta al desarrollador web.">Introducción al concepto de cascada en CSS </a> para obtener más información sobre cada uno de estos valores y el modo en que funcionan.</p>
+</div>
+
+<p>A continuación veremos una lista de enlaces y exploraremos cómo funcionan los valores universales. El ejemplo en vivo de abajo te permite jugar con el CSS y ver lo que sucede cuando se hacen cambios. Jugar con el código es la mejor forma de enfrentarse al HTML y el CSS.</p>
+
+<p>Por ejemplo:</p>
+
+<ol>
+ <li>Se ha aplicado la clase <code>my-class-1</code> al segundo elemento de lista. Esto establece por herencia el color del elemento <code>&lt;a&gt;</code> que está anidado en él. ¿Cómo cambia el color del enlace si quitamos esta regla?</li>
+ <li>¿Entiendes por qué el tercer y el cuarto enlace se ven de este color? En caso contrario, comprueba la descripción de los valores anteriores.</li>
+ <li>¿Cuál de los enlaces va a cambiar de color si se define un nuevo color para el elemento <code>&lt;a&gt;</code>, por ejemplo, <code>a { color: red; }</code>?</li>
+</ol>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/keywords.html", '100%', 700)}} </p>
+
+<h3 id="Restablecer_todos_los_valores_de_propiedad">Restablecer todos los valores de propiedad</h3>
+
+<p>La propiedad CSS abreviada <code>all</code> se puede utilizar para aplicar uno de estos valores de herencia a (casi) todas las propiedades a la vez. Su valor puede ser cualquiera de los valores de herencia (<code>inherit</code>, <code>initial</code>, <code>unset</code>, o <code>revert</code>). Es una forma práctica de deshacer los cambios realizados respecto al estilo para que puedas volver a un punto de partida conocido antes de empezar a introducir cambios.</p>
+
+<p>En el ejemplo siguiente hay dos bloques de cita. El primero ya tiene un estilo aplicado al propio elemento de cita, mientras que el segundo tiene una clase aplicada al bloque de cita que establece el valor <code>all</code> en <code>unset</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/all.html", '100%', 700)}} </p>
+
+<p>Prueba a establecer el valor de <code>all</code> al resto de valores disponibles y observa la diferencia.</p>
+
+<h2 id="Comprender_la_cascada">Comprender la cascada</h2>
+
+<p>Ahora entendemos por qué un párrafo que está anidado en la estructura del HTML es del mismo color que el CSS aplicado al cuerpo (<code>body</code>) del HTML y, a partir de los artículos de introducción sabemos cómo cambiar el CSS aplicado a algo en cualquier parte del documento, ya sea mediante la asignación de CSS a un elemento o la creación de una clase. Ahora vamos a echar un vistazo a la forma en que el concepto de cascada define qué reglas CSS se aplican cuando más de un elemento de estilo puede aplicar estilo a un elemento.</p>
+
+<p>Hay que considerar tres factores, que se enumeran a continuación en orden de importancia creciente. Los posteriores invalidan los anteriores:</p>
+
+<ol>
+ <li><strong>Orden en el código</strong></li>
+ <li><strong>Especificidad</strong></li>
+ <li><strong>Importancia</strong></li>
+</ol>
+
+<p>Vamos a explicarlos para ver cómo los navegadores determinan exactamente que CSS deben aplicar.</p>
+
+<h3 id="Orden_en_el_código">Orden en el código</h3>
+
+<p>Ya hemos visto cómo el orden en el código es importante en el concepto de cascada. Si tienes más de una regla con exactamente el mismo peso, la que ocupa el último lugar en el CSS gana. Puedes entenderlo como que las reglas que están más cerca del elemento considerado sobreescriben las anteriores hasta que la última gana y da formato al elemento.</p>
+
+<h3 id="Especificidad_2">Especificidad</h3>
+
+<p>Una vez entendido el hecho de que el orden de los elementos en el código es importante, te encontrarás en alguna situación en la que sabes cuál es la última norma en la hoja de estilo, pero se aplica una regla anterior. Esto se debe a que la regla anterior tiene <strong>una especificidad mayor</strong>, es decir, es más específica y, por lo tanto, el navegador la escoge como la que debe dar forma al elemento.</p>
+
+<p>Como hemos visto anteriormente en este mismo artículo, un selector de clase tiene más peso que un selector de elemento, por lo que las propiedades que se definen en la clase tienen prioridad sobre las que se aplican directamente en el elemento.</p>
+
+<p>Un elemento que hay que tener en cuenta es que aunque pensamos en términos de selectores y reglas que se aplican a lo que estos seleccionan, no es toda la regla lo que se sobrescribe, sino solo las propiedades que entran en conflicto.</p>
+
+<p>Este comportamiento ayuda a evitar repeticiones en el CSS. Una práctica común es definir estilos genéricos para los elementos básicos y luego, crear clases para los elementos que son diferentes. Por ejemplo, en la hoja de estilo que mostramos a continuación hemos definido estilos genéricos para los encabezados de nivel 2; posteriormente hemos creado algunas clases que solo cambian algunas de las propiedades y los valores. Los valores definidos inicialmente se aplican a todos los encabezados, y entonces los valores más específicos se aplican a los encabezados con las clases.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/mixing-rules.html", '100%', 700)}} </p>
+
+<p>Ahora vamos a echar un vistazo a cómo el navegador calcula la especificidad. Ya sabemos que un selector de elemento tiene una especificidad baja y se puede sobrescribir con un elemento de clase. Esencialmente se otorga un valor de puntos a los diferentes tipos de selectores y la suma de estos establece la importancia de ese selector en particular, que a continuación puede evaluarse ante otras posibles coincidencias.</p>
+
+<p>La cantidad de especificidad de un selector se mide usando cuatro valores diferentes (o componentes), que pueden describirse como millares, centenas, decenas y unidades (cuatro dígitos individuales dispuestos en cuatro columnas):</p>
+
+<ol>
+ <li><strong>Millares</strong>: Se suma un punto en esta columna si la declaración está en un atributo de {{htmlattrxref ("style")}} o, como suelen denominarse, estilos en línea. Tales declaraciones no tienen selectores, por lo que su especificidad siempre es 1000.</li>
+ <li><strong>Centenas</strong>: Se suma un punto en esta columna por cada selector con ID particular que esté contenido en el selector general.</li>
+ <li><strong>Decenas</strong>: Se suma un punto en esta columna por cada selector de clase, de atributo o pseudoclase que estén contenidos en el selector general.</li>
+ <li><strong>Unidades</strong>: Se suma un punto en esta columna por cada selector o pseudoelemento que esté contenido en el selector general.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: El selector universal (<code>*</code>), los operadores de combinación (<code>+</code>, <code>&gt;</code>, <code>~</code>, ' ') y la pseudo-clase de negación (<code>:not</code>) no tienen ningún efecto sobre la especificidad.</p>
+</div>
+
+<p>La tabla siguiente muestra algunos ejemplos concretos para ayudarte a entenderlo mejor. Analízalos y trata de entender por qué tienen la especificidad que les hemos dado. Aun no hemos explicado los selectores de forma detallada, pero puedes encontrar detalles de cada selector en los <a href="/es/docs/Web/CSS/Selectores_CSS">selectores de referencia</a> de MDN.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Selector</th>
+   <th scope="col">Millares:</th>
+   <th scope="col">Centenas:</th>
+   <th scope="col">Decenas:</th>
+   <th scope="col">Unidades:</th>
+   <th scope="col">Especificidad total</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>h1</code></td>
+   <td>0</td>
+   <td>0</td>
+   <td>0</td>
+   <td>1</td>
+   <td>0001</td>
+  </tr>
+  <tr>
+   <td><code>h1 + p::first-letter</code></td>
+   <td>0</td>
+   <td>0</td>
+   <td>0</td>
+   <td>3</td>
+   <td>0003</td>
+  </tr>
+  <tr>
+   <td><code>li &gt; a[href*="en-US"] &gt; .inline-warning</code></td>
+   <td>0</td>
+   <td>0</td>
+   <td>2</td>
+   <td>2</td>
+   <td>0022</td>
+  </tr>
+  <tr>
+   <td><code>#identifier</code></td>
+   <td>0</td>
+   <td>1</td>
+   <td>0</td>
+   <td>0</td>
+   <td>0100</td>
+  </tr>
+  <tr>
+   <td>Sin selector, con una regla en el atributo de un elemento {{htmlattrxref("style")}}</td>
+   <td>1</td>
+   <td>0</td>
+   <td>0</td>
+   <td>0</td>
+   <td>1000</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Antes de continuar, vamos a ver un ejemplo:</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/specificity-boxes.html", '100%', 700)}} </p>
+
+<p>¿Qué pasa aquí? En primer lugar, estamos interesados solo en las primeras siete reglas de este ejemplo y, como te habrás dado cuenta, hemos incluido sus valores de especificidad en un comentario antes de cada una.</p>
+
+<ul>
+ <li>Los dos primeros selectores compiten sobre el estilo del color del fondo del vínculo (el segundo gana y por eso el color de fondo es azul, porque en la cadena hay un selector con ID particular extra: la especificidad es de 201 contra 101).</li>
+ <li>El tercer y el cuarto selector compiten sobre el estilo del color del texto del enlace (el segundo gana y hace que el texto sea blanco porque, aunque tiene un selector de elemento de menos, el selector que falta se sustituye por un selector de clase, con un valor de decena en vez de un valor de unidad). Así que la especificidad es de 113 contra 104.</li>
+ <li>Los selectores 5-7 compiten por el estilo del borde del vínculo cuando el cursor se desplaza sobre estos. El sexto selector pierde claramente ante el quinto con una especificidad de 23 contra 24. En la cadena hay un selector de elemento de menos. El séptimo selector, sin embargo, los supera a ambos: en la cadena hay el mismo número de estos subselectores que en el quinto, pero se ha intercambiado un elemento por un selector de clase. Así que la especificidad es de 33 contra 23 y 24.</li>
+</ul>
+
+<ol>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Esto solo es un ejemplo aproximado para facilitar la comprensión. En realidad, cada tipo de selector tiene su nivel de especificidad propio, que no pueden sobrescribir los selectores con un nivel de especificidad menor. Por ejemplo, un <em>millar</em> de selectores de <strong>clase</strong> combinados no serían capaces de sobrescribir las reglas de <em>un</em> selector <strong>ID</strong>.</p>
+
+<p>Una forma más precisa de evaluar la especificidad sería anotar los niveles de especificidad individualmente de mayor a menor. Solo cuando hay empate entre las puntuaciones de los selectores dentro de un nivel especifico será necesario evaluar el nivel inferior siguiente; de lo contrario, puedes prescindir de los selectores de especificidad de los niveles inferiores, ya que nunca pueden sobrescribir los niveles de especificidad más altos.</p>
+</div>
+
+<h3 id="Propiedad_!important">Propiedad <code>!important</code></h3>
+
+<p>Hay una pieza especial de CSS que se puede utilizar para anular todos los cálculos anteriores, sin embargo se debe tener mucho cuidado con su uso: <code>!important</code>. Se utiliza para convertir una propiedad y un valor particular en el elemento más específico, de modo que se invalidan las reglas normales de la cascada.</p>
+
+<p>Echa un vistazo a este ejemplo en el que se muestran dos párrafos, uno de los cuales tiene un elemento ID.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/cascade/important.html", '100%', 700)}} </p>
+
+<p>Vamos a observarlo con detenimiento para ver qué sucede. Elimina algunas de las propiedades para ver lo que sucede si te cuesta entender lo que ocurre:</p>
+
+<ol>
+ <li>Verás que se han aplicado los valores de {{cssxref("color")}} y {{cssxref("padding")}} de la tercera regla pero no el de {{cssxref("background-color")}}. ¿Por qué? Deberían haberse aplicado para los tres porque las reglas que se encuentran más adelante en el orden en el código fuente prevalecen sobre las reglas anteriores.</li>
+ <li>Sin embargo, ganan las reglas que están antes porque los selectores de clase tienen mayor especificidad que selectores de elemento.</li>
+ <li>En ambos bloques de código hay una clase {{htmlattrxref("class")}} con el valor <code>better</code>, pero en el segundo bloque de código hay un {{htmlattrxref("id")}} con el valor <code>winning</code>. Puesto que los identificadores tienen una especificidad <em>incluso mayor</em> que las clases (solo puede haber un elemento con un determinado ID en cada página, mientras que puede haber muchos elementos de la misma clase: los selectores ID son <em>muy específicos</em> con lo que delimitan), el primer bloque de código tendría un fondo de color gris y ningún borde, según lo que especifica la clase, mientras que al segundo bloque de código se aplicarían tanto el color de fondo rojo como el borde negro de 1 píxel.</li>
+ <li>El segundo elemento, en cambio, se muestra con el fondo de color rojo pero sin borde. ¿Por qué? Porque la declaración <code>!important</code> que hay en la segunda regla, después de <code>border: none</code> significa que esta declaración tendrá más valor que la regla anterior, aunque el ID de esta tenga mayor especificidad.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: La única manera de anular la declaración <code>!important</code> sería incluir otra declaración <code>!important</code> en una declaración con la <em>misma especificidad</em> que aparezca más adelante en el orden del código fuente, o con una especificidad superior.</p>
+</div>
+
+<p>Es útil saber que <code>!important</code> existe para que sepas qué es cuando te lo encuentres en el código de otras personas. <strong>Sin embargo, te recomendamos encarecidamente que no lo utilices a menos que sea absolutamente necesario.</strong> <code>!important</code> cambia el modo en que suele funcionar la cascada, por lo que puede dificultar mucho la depuración de problemas en el CSS, especialmente en una hoja de estilo grande.</p>
+
+<p>Una situación en la que puede que tengas que utilizarlo es si trabajas en un CMS en el que no es posible editar los módulos básicos de CSS y realmente tienes que anular un estilo que no puede anularse de ninguna otra forma. Aun así, te recomendamos encarecidamente que evites su uso.</p>
+
+<h2 id="El_efecto_de_la_ubicación_del_CSS">El efecto de la ubicación del CSS</h2>
+
+<p>Por último, resulta útil señalar que la importancia de una declaración CSS depende de la hoja de estilo en que se especifica (es posible que los usuarios configuren hojas de estilo personalizadas para anular los estilos de los desarrolladores, por ejemplo, porque el usuario podría tener alguna discapacidad visual, o bien porque desea configurar el tamaño de letra de todas las páginas web que visita para que sea el doble de grande y le proporcione una mayor facilidad de lectura).</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Las declaraciones contradictorias se aplicarán en el orden siguiente (recuerda que las últimas prevalecen sobre las anteriores):</p>
+
+<ol>
+ <li>Declaraciones en las hojas de estilo de agente de usuario (por ejemplo, estilos predeterminados del navegador, que se utilizan cuando no hay otro estilo).</li>
+ <li>Declaraciones normales en las hojas de estilo del usuario (estilos personalizados creados por un usuario).</li>
+ <li>Declaraciones normales en las hojas de estilo de autor (los estilos que creamos nosotros, los desarrolladores web).</li>
+ <li>Declaraciones <code>!important</code> en las hojas de estilo de autor</li>
+ <li>Declaraciones <code>!important</code> en las hojas de estilo del usuario</li>
+</ol>
+
+<p>Para los desarrolladores tiene sentido que sus hojas de estilo anulen a las de usuario para mantener el diseño según lo previsto, pero, como hemos visto, a veces los usuarios tienen buenas razones para anular las directrices de los desarrolladores web. Esto puede lograrse con el uso de <code>!important</code> en sus reglas.</p>
+
+<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
+
+<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más importante? Encontrarás más pruebas para verificar que retienes esa einformación en <a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_tasks">Test your skills: the Cascade</a>.</p>
+
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+
+<p>Si has entendido la mayor parte de este artículo, ¡enhorabuena! Has comenzado a familiarizarte con la mecánica fundamental del CSS. En el artículo siguiente vamos a ver con detalle los selectores.</p>
+
+<p>Si todavía no tienes una comprensión completa de los conceptos de cascada, especificidad y herencia, ¡no te preocupes! Es, sin duda, lo más complejo que hemos expuesto hasta ahora y es algo que incluso los desarrolladores web profesionales encuentran difícil. Te aconsejamos que regreses a este artículo cuantas veces necesites a medida que avances con el curso.</p>
+
+<p>Regresa a esta página si empiezas a toparte con problemas extraños o con que los estilos no se aplican de la forma que esperas. Podría ser un problema de especificidad.</p>
+
+<p>{{NextMenu("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudo-clases y los pseudo-elementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario </a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/contenido_desbordado/index.html b/files/es/learn/css/building_blocks/contenido_desbordado/index.html
deleted file mode 100644
index 808a519c12..0000000000
--- a/files/es/learn/css/building_blocks/contenido_desbordado/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: Contenido desbordado
-slug: Learn/CSS/Building_blocks/Contenido_desbordado
-translation_of: Learn/CSS/Building_blocks/Overflowing_content
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks")}}</div>
-
-<p>En este artículo veremos otro concepto importante en CSS: el <strong>desbordamiento</strong>. El desbordamiento es lo que sucede cuando hay demasiado contenido para que pueda caber cómodamente en una caja. En esta guía aprenderás qué es y cómo administrarlo.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender el desbordamiento y cómo gestionarlo.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_el_desbordamiento">¿Qué es el desbordamiento?</h2>
-
-<p>Ya sabemos que todo en CSS está dentro de una caja, y que podemos restringir el tamaño de estas cajas asignándoles los valores {{cssxref ("width")}} y {{cssxref ("height")}} (o {{cssxref("inline-size")}} y {{cssxref("block-size")}}). <strong>El desbordamiento es lo que sucede cuando hay demasiado contenido en una caja, y no cabe cómodamente en ella.</strong> El CSS te proporciona varias herramientas para administrar este desbordamiento, y además es un concepto que resulta útil de conocer desde las primeras etapas. Te encontrarás con situaciones de desbordamiento con bastante frecuencia al escribir CSS, especialmente cuando profundices en compaginación con CSS.</p>
-
-<h2 id="El_CSS_trata_de_evitar_«la_pérdida_de_datos»">El CSS trata de evitar «la pérdida de datos»</h2>
-
-<p>Vamos a comenzar con dos ejemplos que demuestran cómo se comporta el CSS por defecto cuando ocurre un desbordamiento.</p>
-
-<p>El primero consiste en una caja que a la que se le ha restringido la dimensión al darle una altura. Luego hemos añadido más contenido del que cabe en la caja. El contenido se desborda y se distribuye desordenadamente sobre el párrafo que hay debajo de la caja.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/overflow/block-overflow.html", '100%', 600)}}</p>
-
-<p>El segundo consiste en una palabra dentro de una caja cuya dimensión en línea está restringida. La caja se ha hecho demasiado pequeña para que esa palabra quepa, y se desborda.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/overflow/inline-overflow.html", '100%', 500)}}</p>
-
-<p>Te debes estar preguntando por qué el CSS ha tomado por defecto el enfoque más bien desarreglado de provocar el desbordamiento desordenado del contenido. ¿Por qué no ocultar el contenido adicional o hacer crecer la caja?</p>
-
-<p>Siempre que sea posible, el CSS no oculta su contenido; hacerlo provocaría la pérdida de datos, que generalmente es un problema. En términos de CSS, esto significa que una parte del contenido desaparece. El problema con que desaparezca contenido es que podría ser que no notaras que ha desaparecido. Tus visitantes podrían no darse cuenta de que ha desaparecido contenido. Si se trata del botón de envío de datos en un formulario, nadie podría completar el formulario, y ¡eso es un gran problema! Así que, en vez de esto, el CSS tiende a desbordarse de un modo que sea visible. Es probable que te des cuenta de ese desarreglo, o en el peor de los casos, que un visitante de tu sitio web te informe de que una parte del contenido se superpone y debas arreglarlo.</p>
-
-<p>Si has restringido el tamaño de una caja con una anchura o una altura determinadas, el CSS asume que sabes lo que haces y que gestionas correctamente el potencial de desbordamiento. En general, restringir el tamaño de un bloque es problemático cuando el texto se va a poner en una caja, porque puede haber más texto del que te esperabas al diseñar el sitio o el tamaño del texto puede ser mayor, por ejemplo, si el usuario lo aumenta.</p>
-
-<p>En los artículos siguientes veremos diferentes modos de controlar el tamaño que podrían ser menos propensos a desbordarse. Sin embargo, si necesitas un tamaño fijo, también puedes controlar cómo se comporta el desbordamiento. ¡Sigue leyendo!</p>
-
-<h2 id="La_propiedad_overflow">La propiedad <code>overflow</code></h2>
-
-<p>La propiedad {{cssxref ("overflow")}} es el modo como tomas el control del desbordamiento de un elemento y le dices al navegador cómo desea que se comporte. El valor predeterminado para la propiedad <code>overflow</code> es <code>visible</code>, por lo que, de forma predeterminada vamos a poder ver cuándo se desborda nuestro contenido.</p>
-
-<p>Si deseas cortar el contenido cuando se desborda, puedes establecer el valor <code>overflow: hidden</code> en tu caja, que hace exactamente lo que dice: ocultar el desbordamiento. Esto puede hacer que las cosas desaparezcan, por lo que solo debes utilizar esta opción si ocultar contenido no te va a causar ningún problema.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/overflow/hidden.html", '100%', 600)}}</p>
-
-<p>Quizás te gustaría añadir barras de desplazamiento cuando el contenido se desborde. Si usas <code>overflow: scroll</code>, tu navegador siempre mostrará barras de desplazamiento, incluso cuando no haya suficiente contenido para que pueda desbordarse. Es posible que desees hacer esto, porque evita que aparezcan y desaparezcan barras de desplazamiento según el contenido.</p>
-
-<p><strong>Si en la caja siguiente eliminas parte del contenido, observarás que las barras de desplazamiento permanecen aun sin que haya nada que desplazar (o, como mucho, solo las pistas de la barra de desplazamiento).</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/overflow/scroll.html", '100%', 600)}}</p>
-
-<p>En el ejemplo anterior solo necesitamos desplazarnos en el eje <code>y</code>, sin embargo, obtenemos barras de desplazamiento en ambos ejes. En su lugar, puedes usar la propiedad {{cssxref ("overflow-y")}}, y establecer <code>overflow-y: scroll</code> para poder desplazarte solo por el eje <em>y</em>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/overflow/scroll-y.html", '100%', 600)}}</p>
-
-<p>También puedes desplazarte por el eje <em>x</em> usando {{cssxref ("overflow-x")}}, aunque esta no es una forma recomendada para manejar palabras largas. Si necesitas lidiar con una palabra larga en una caja pequeña, puedes consultar las propiedades {{cssxref ("word-break")}} o {{cssxref ("overflow-wrap")}}. Además, algunos de los métodos expuestos en el artículo <a href="/es/docs/Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS">Elementos de dimensionado en CSS</a> pueden ayudarte a crear cuadros que se adapten mejor a cantidades variables de contenido.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/overflow/scroll-x.html", '100%', 500)}}</p>
-
-<p>Al igual que con el desplazamiento, obtendrás una barra de desplazamiento en la dimensión de desplazamiento independientemente de si hay suficiente contenido para provocar una barra de desplazamiento.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: observa que puedes especificar un desplazamiento en <em>x</em> y en <em>y</em> utilizando la propiedad <code>overflow</code> y pasando dos valores. Si especificas dos palabras clave, la primera se aplica a <code>overflow-x</code> y la segunda a <code>overflow-y</code>. De lo contrario, tanto <code>overflow-x</code> como <code>overflow-y</code> se fijan en el mismo valor. Por ejemplo, <code>overflow: scroll hidden</code> establece <code>overflow-x</code> en <code>scroll</code> y <code>overflow-y</code> en <code>hidden</code>.</p>
-</div>
-
-<p>Si deseas que aparezcan barras de desplazamiento solo si hay más contenido del que cabe en la caja, utiliza <code>overflow: auto</code>. En este caso, el navegador decide si muestra las barras de desplazamiento o no. Los navegadores de escritorio solo suelen hacerlo cuando hay contenido suficiente para causar desbordamiento.</p>
-
-<p><strong>En el ejemplo siguiente, elimina parte del contenido hasta que quepa en la caja y observarás que las barras de desplazamiento desaparecen.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/overflow/auto.html", '100%', 600)}}</p>
-
-<h2 id="overflow_establece_un_contexto_de_formato_de_bloque"><code>overflow</code> establece un contexto de formato de bloque</h2>
-
-<p>En CSS hay un concepto conocido como <strong>block formatting context</strong> o BFC (<em>contexto de formato de bloque</em>). No es algo de lo que debas preocuparte demasiado en este momento, pero es útil saber que cuando usas un valor de <code>overflow</code>, como <code>scroll</code> o <code>auto</code>, creas un BFC. El resultado es que el contenido de la caja al que acabas de cambiar el valor <code>overflow</code> se convierte en un minidiseño propio. Las cosas que están fuera del contenedor no pueden meterse en él, y nada puede sobresalir de esa caja hacia el diseño circundante. Esto es para permitir un comportamiento con desplazamiento, porque para poder crear una experiencia de desplazamiento consistente todo el contenido de tu caja ha de estar contenido en algo, y no puede superponerse con otros elementos de la página.</p>
-
-<h2 id="Desbordamiento_no_deseado_en_diseño_web">Desbordamiento no deseado en diseño web</h2>
-
-<p>Los métodos de diseño modernos (explicados en el módulo <a href="/es/docs/Learn/CSS/CSS_layout">Diseñar con el CSS</a>) gestionan muy bien el desbordamiento. Han sido diseñados para hacer frente al hecho de que tendemos a no poder predecir cuánto contenido habrá en la web. Sin embargo, en el pasado, los desarrolladores a menudo usaban alturas fijas para tratar de alinear los fondos de cajas que en realidad no tenían relación entre sí. Este método era frágil y, en una aplicación heredada, ocasionalmente puede aparecer una caja en que el contenido se superpone a otro contenido de la página. Si ves esto, sabrás que se trata de desbordamiento. Lo ideal sería volver a calcular el diseño para no tener que confiar tamaños de caja fijos.</p>
-
-<p>Al desarrollar un sitio web, siempre debes tener en cuenta los problemas de desbordamiento. Debes probar diseños con cantidades grandes y pequeñas de contenido, aumentar el tamaño de letra... y asegurarte de que tu CSS puede hacerle frente sin ningún problema. Es probable que cambiar el valor de <code>overflow</code> para ocultar contenido o añadir barras de desplazamiento sea algo que debas reservar solo para unos pocos casos especiales, en que realmente desees una caja con barra de desplazamiento, por ejemplo.</p>
-
-<h2 id="Pon_a_prueba_tus_conocimientos">Pon a prueba tus conocimientos</h2>
-
-<p>Hay mucho que absorber en esta lección. ¿Recuerdas la información más importante? Para comprobarlo, ve a <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Overflow_Tasks">Test your skills: overflow</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Este breve artículo ha introducido el concepto de desbordamiento; ahora comprendes que el CSS intenta no hacer invisible el desbordamiento de contenido, porque esto provoca la pérdida de datos. Has descubierto que puedes gestionar el desbordamiento potencial y también que debes probar tu trabajo para asegurarte de que no causa un desbordamiento problemático accidentalmente.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Valores y unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Estilo de las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/debugging_css/index.html b/files/es/learn/css/building_blocks/debugging_css/index.html
new file mode 100644
index 0000000000..3e1b940897
--- /dev/null
+++ b/files/es/learn/css/building_blocks/debugging_css/index.html
@@ -0,0 +1,199 @@
+---
+title: Depurar el CSS
+slug: Learn/CSS/Building_blocks/Debugging_CSS
+translation_of: Learn/CSS/Building_blocks/Debugging_CSS
+original_slug: Learn/CSS/Building_blocks/Depurar_el_CSS
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks/Organizing", "Learn/CSS/Building_blocks")}}</div>
+
+<p>Al escribir CSS te puedes encontrar que, a veces, alguna parte de tu CSS no hace lo que esperas. Tal vez creas que cierto selector debería coincidir con un elemento, pero no sucede nada; o una caja tiene un tamaño diferente al que esperabas. Este artículo te orientará sobre cómo solucionar un problema de CSS y te mostrará cómo las DevTools incluidas en todos los navegadores modernos pueden ayudarte a descubrir qué sucede.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Conocer los conceptos básicos de las DevTools que hay en los navegadores y de cómo inspeccionar y editar el CSS de un modo fácil.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Cómo_acceder_a_las_DevTools_de_los_navegadores">Cómo acceder a las DevTools de los navegadores</h2>
+
+<p>El artículo <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">¿Qué son las herramientas de desarrollo de los navegadores?</a> es una guía actualizada que explica cómo acceder a las herramientas en varios navegadores y plataformas. Si bien puedes optar por desarrollar principalmente en un navegador en particular y, por lo tanto, te familiarizarás más con las herramientas incluidas en ese navegador, vale la pena saber cómo acceder a ellas en otros navegadores. Esto ayudará si haces pruebas de las representaciones que dan diferentes navegadores.</p>
+
+<p>También te darás cuenta de que los diversos navegadores han optado por centrarse en áreas diferentes al crear sus DevTools. Por ejemplo, en Firefox hay algunas herramientas excelentes para trabajar visualmente con la compaginación con CSS, que te permiten inspeccionar y editar <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Compaginaciones de cuadrícula</a>, <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_Flexbox_layouts">Flexbox</a> y <a href="/en-US/docs/Tools/Page_Inspector/How_to/Edit_CSS_shapes">formas</a>. Sin embargo, todos los navegadores tienen herramientas fundamentales similares. Por ejemplo, para inspeccionar las propiedades y los valores que se aplican a los elementos de tu página, y hacer cambios desde el editor.</p>
+
+<p>En este artículo veremos algunas características útiles de Firefox DevTools para trabajar con CSS. Para hacerlo, usaremos <a href="https://mdn.github.io/css-examples/learn/inspecting/inspecting.html">un archivo de ejemplo</a>. Carga esto en una pestaña nueva si deseas seguir adelante y abre tus DevTools como se describe en el artículo del enlace anterior.</p>
+
+<h2 id="El_DOM_y_View_Source">El DOM y "View Source"</h2>
+
+<p>Algo que puede hacer tropezar a los recién llegados a DevTools es la diferencia entre lo que ves cuando <a href="/es/docs/Tools/View_source">miras el código fuente</a> de una página web, o miras el archivo HTML que colocas en el servidor, y lo que puedes ver en la <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Panel_HTML">ventana HTML</a> de DevTools. Aunque ves más o menos lo mismo que puedes ver desde View Source (Ver código fuente de la página), hay algunas diferencias.</p>
+
+<p>En el DOM procesado, el navegador puede haber corregido algunos HTML mal escritos por ti. Si cerraste un elemento incorrectamente, por ejemplo, por abrir con un <code>&lt;h2&gt;</code> y cerrar con un <code>&lt;/h3&gt;</code>, el navegador descubre lo que ibas a hacer y el HTML del DOM cerrará ese <code>&lt;h2&gt;</code> de apertura correctamente con un <code>&lt;/h2&gt;</code>. El navegador también normaliza todo el HTML, y el DOM también muestra los cambios que hace JavaScript.</p>
+
+<p>En comparación, View Source es simplemente el código fuente HTML tal como está almacenado en el servidor. El <a href="/es/docs/Tools/Page_Inspector/How_to/Examinar_y_editar_HTML#%C3%81rbol_HTML">árbol HTML</a> de tus DevTools muestra exactamente lo que el navegador representa en un momento dado, y te da una idea de lo que sucede en realidad.</p>
+
+<h2 id="Inspección_del_CSS_aplicado">Inspección del CSS aplicado</h2>
+
+<p>Selecciona un elemento de tu página, ya sea haciendo clic con el botón derecho o pulsando la tecla ctrl para seleccionar la opción <em>Inspect</em>, o seleccionándolo del árbol HTML que hay a la izquierda de la pantalla de la interfaz DevTools. Selecciona el elemento con la clase <code>box1</code>; este es el primer elemento de la página con una caja alrededor.</p>
+
+<p><img alt="La página de ejemplo para este tutorial con DevTools abiertas." src="https://mdn.mozillademos.org/files/16606/inspecting1.png" style="border-style: solid; border-width: 1px; height: 1527px; width: 2278px;"></p>
+
+<p>Si observasla  <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Panel_CSS">vista de reglas</a>, que está a la derecha de tu HTML, deberías poder ver las propiedades y los valores CSS aplicados sobre ese elemento. Verás las reglas aplicadas directamente a la clase <code>box1</code> y también el CSS que la caja hereda de su elemento padre, en este caso <code>&lt;body&gt;</code>. Esto es útil para cuando ves que se aplica un CSS que no esperabas. Tal vez se esté heredando de un elemento padre y necesites añadir una regla para sobrescribirlo en el contexto de este elemento.</p>
+
+<p>También es útil la capacidad de expandir las propiedades abreviadas. En nuestro ejemplo se usa la abreviación <code>margin</code>.</p>
+
+<p><strong>Haz clic en la pequeña flecha para expandir la vista, que muestra las diferentes propiedades sin abreviar y sus valores.</strong></p>
+
+<p><strong>Puedes activar y desactivar los valores en la vista de reglas, cuando ese panel esté activo; si mantienes el ratón sobre él, aparecerán casillas de verificación. Desmarca la casilla de verificación de una regla, por ejemplo <code>border-radius</code>, y el CSS dejará de aplicarse.</strong></p>
+
+<p>Puedes usar esto para hacer una comparación entre A y B, decidir si algo se ve mejor con una regla aplicada o sin aplicar, y también para ayudar a depurarlo. Por ejemplo, si un diseño falla e intentas determinar qué propiedad causa el problema.</p>
+
+<h2 id="Editar_valores">Editar valores</h2>
+
+<p>Además de activar y desactivar las propiedades, puedes editar sus valores. ¿Quieres ver si quizá otro color se ve mejor, o deseas modificar algún tamaño? Las DevTools pueden ahorrarte mucho tiempo a la hora de editar una hoja de estilo y volver a cargar la página.</p>
+
+<p><strong>Selecciona <code>box1</code> y haz clic en la muestra (el pequeño círculo de color) que muestra el color aplicado al borde. Se abrirá un selector de color y puedes probar con colores diferentes, que se actualizarán en tiempo real en la página. De manera similar puedes cambiar el ancho o el estilo del borde.</strong></p>
+
+<p><img alt="Ventana de aplicación de estilos de DevTools con un selector de color abierto." src="https://mdn.mozillademos.org/files/16607/inspecting2-color-picker.png" style="border-style: solid; border-width: 1px; height: 1173px; width: 2275px;"></p>
+
+<h2 id="Añadir_una_propiedad_nueva">Añadir una propiedad nueva</h2>
+
+<p>Puedes añadir propiedades usando las DevTools. ¿Te has dado cuenta de que quizá no quieres que tu caja herede el tamaño de letra del elemento <code>&lt;body&gt;</code> y quieres establecer tu propio tamaño de letra específico? Pruébalo en DevTools antes de añadirlo a tu archivo CSS.</p>
+
+<p><strong>Puedes hacer clic en la llave de cierre de la regla para comenzar a introducir una declaración nueva, y en ese momento puedes comenzar a escribir la nueva propiedad y DevTools te mostrará una lista de propiedades coincidentes que se completará automáticamente. Después de seleccionar <code>font-size</code>, introduce el valor que deseas probar. También puede hacer clic en el botón + para añadir una regla adicional con el mismo selector y tus reglas nuevas.</strong></p>
+
+<p><img alt="La ventana DevTools, que añade una propiedad nueva a las reglas, con el autocompletado para font-open" src="https://mdn.mozillademos.org/files/16608/inspecting3-font-size.png" style="border-style: solid; border-width: 1px; height: 956px; width: 2275px;"></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: También hay otras funciones útiles en la vista de reglas; por ejemplo, las declaraciones con valores no válidos están tachadas. Puedes obtener más información en <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS">Examinar y editar CSS</a>.</p>
+</div>
+
+<h2 id="Comprender_el_modelo_de_cajas">Comprender el modelo de cajas</h2>
+
+<p>En artículos anteriores hemos expuesto el <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">modelo de cajas</a>, y el hecho de que tengamos un modelo de cajas alternativo que cambia la forma en que se calcula el tamaño de los elementos en función del tamaño que les asignas, más el relleno y los bordes. Las DevTools realmente pueden ayudarte a comprender cómo se calcula el tamaño de un elemento.</p>
+
+<p><a href="/es/docs/Tools/Page_Inspector/UI_Tour#Panel_CSS">El panel de disposición</a> muestra un diagrama del modelo de cajas en el elemento seleccionado, junto con una descripción de las propiedades y los valores que cambian la forma en que el elemento se presenta. Esto incluye una descripción de las propiedades que puedes no haber utilizado explícitamente en el elemento, pero que tienen valores iniciales establecidos.</p>
+
+<p>En esta ventana, una de las propiedades que se detallan es la propiedad <code>box-sizing</code>, que controla qué modelo de cajas usa el elemento.</p>
+
+<p><strong>Compara las dos cajas con las clases <code>box1</code> y <code>box2</code>. Ambas tienen el mismo ancho aplicado (400 px), sin embargo, <code>box1</code> es visualmente más ancha. En la ventana de diseño puedes ver que usa <code>content-box</code>. Este es el valor que toma el tamaño que asignas al elemento y luego añade el área de relleno y el ancho del borde.</strong></p>
+
+<p>El elemento con una clase <code>box2</code> usa <code>border-box</code>, por lo que aquí el área de relleno y el borde se restan del tamaño que has asignado al elemento. Esto significa que el espacio que la caja ocupa en la página es el tamaño exacto que se ha especificado, en nuestro caso <code>width: 400px</code>.</p>
+
+<p><img alt="La ventana de diseño de DevTools" src="https://mdn.mozillademos.org/files/16609/inspecting4-box-model.png" style="border-style: solid; border-width: 1px; height: 1532px; width: 2275px;"></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Descubre más en <a href="/es/docs/Tools/Page_Inspector/How_to/Examinar_y_editar_el_modelo_de_cajasmodel">Examinar e inspeccionar el modelo de cajas</a>.</p>
+</div>
+
+<h2 id="Resolver_problemas_de_especificidad">Resolver problemas de especificidad</h2>
+
+<p>A veces, durante el desarrollo, pero en particular cuando necesitas editar el CSS de un sitio ya publicado, te resultará difícil conseguir que se aplique un determinado CSS. No importa lo que hagas, el elemento simplemente no parece aceptar tu CSS. Lo que suele suceder aquí es que un selector más específico anula tus cambios, y en este caso DevTools te será de gran ayuda.</p>
+
+<p>En nuestro archivo de ejemplo hay dos palabras incluidas en un elemento <code>&lt;em&gt;</code>. Uno se muestra en color naranja y el otro en rosa. En el CSS hemos aplicado:</p>
+
+<pre class="brush: css notranslate">em {
+  color: hotpink;
+  font-weight: bold;
+}</pre>
+
+<p>Sin embargo, un poco más arriba en la hoja de estilo hay una regla con un selector <code>.special</code>:</p>
+
+<pre class="brush: css notranslate">.special {
+  color: orange;
+}</pre>
+
+<p>Como recordarás del artículo sobre <a href="/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia"> cascada y herencia</a>, en que hablamos sobre la especificidad, los selectores de clase son más específicos que los selectores de elemento, por lo que este es el valor que se aplica. DevTools puede ayudarte a encontrar estos problemas, especialmente si la información está oculta en algún lugar de una extensa hoja de estilo.</p>
+
+<p><strong>Inspecciona <code>&lt;em&gt;</code> con la clase <code>.special</code> y DevTools te mostrará que el naranja es el color que se aplica, y también te muestra la propiedad <code>color</code> aplicada al em tachado. Aquí puedes ver que la clase anula el selector de elemento.</strong></p>
+
+<p><img alt="Selecciona un em y mira en DevTools qué solapa el color." src="https://mdn.mozillademos.org/files/16610/inspecting5-specificity.png" style="border-style: solid; border-width: 1px; height: 1161px; width: 2275px;"></p>
+
+<h2 id="Descubre_más_sobre_las_DevTools_de_Firefox">Descubre más sobre las DevTools de Firefox</h2>
+
+<p>Hay mucha información aquí en MDN sobre las DevTools de Firefox. Echa un vistazo a la <a href="/es/docs/Tools">sección principal de las DevTools</a>, y consulta las <a href="/es/docs/Tools/Page_Inspector#How_to">Guías prácticas</a> para obtener información más detallada sobre las cosas que hemos expuesto brevemente en este artículo.</p>
+
+<h2 id="Problemas_al_depurar_en_CSS">Problemas al depurar en CSS</h2>
+
+<p>Las DevTools pueden ser de gran ayuda a la hora de resolver problemas con el CSS, pero ¿cómo resuelves una situación en la que el CSS no se comporta como esperas? Los siguientes pasos deberían ayudarte.</p>
+
+<h3 id="Aléjate_del_problema">Aléjate del problema</h3>
+
+<p>Cualquier problema de código puede ser frustrante, especialmente los problemas de CSS, porque a menudo no recibes un mensaje de error que buscar en línea para ayudarte a encontrar una solución. Si te sientes frustrado, aléjate del problema por un tiempo: sal a caminar, tómate una copa, habla con un compañero de trabajo o trabaja en otra cosa por un tiempo. A veces, la solución aparece mágicamente cuando dejas de pensar en el problema, e incluso si no llega, trabajar en ello cuando te sientas más fresco te será mucho más fácil.</p>
+
+<h3 id="¿Tu_HTML_y_CSS_son_válidos">¿Tu HTML y CSS son válidos?</h3>
+
+<p>Los navegadores esperan que tu CSS y HTML estén escritos correctamente, sin embargo, los navegadores también son muy indulgentes y harán todo lo posible para mostrar tus páginas web incluso si tiene errores en el marcado o en la hoja de estilo. Si tienes errores en el código, el navegador trata de adivinar lo que quieres decir, y podría tomar una decisión diferente a lo que tenías en mente. Además, dos navegadores diferentes pueden hacer frente al problema de dos maneras diferentes. Por lo tanto, un buen primer paso es pasar tu HTML y CSS por un validador, que detectar cualquier error.</p>
+
+<ul>
+ <li><a href="https://jigsaw.w3.org/css-validator/">Validador de CSS</a></li>
+ <li><a href="https://validator.w3.org/">Validador de HTML</a></li>
+</ul>
+
+<h3 id="¿La_propiedad_y_el_valor_son_compatibles_con_el_navegador">¿La propiedad y el valor son compatibles con el navegador?</h3>
+
+<p>Los navegadores simplemente ignoran el CSS que no entienden. Si la propiedad o el valor que utilizas no es compatible con el navegador en el que lo pruebas, no se romperá nada, pero ese CSS no se aplicará. Las DevTools en general destacan de alguna manera las propiedades y los valores que no son compatibles. En la captura de pantalla siguiente, el navegador no admite el valor de subcuadrícula {{cssxref ("grid-template-columns")}}.</p>
+
+<p><img alt="Imagen de las DevTools del navegador con la cuadrícula-plantilla-columnas: subcuadrícula tachada porque el valor de la subcuadrícula no es compatible." src="https://mdn.mozillademos.org/files/16641/no-support.png" style="height: 397px; width: 1649px;"></p>
+
+<p>También puedes echar un vistazo a las tablas de compatibilidad de navegadores en la parte inferior de cada página de propiedades del proyecto MDN. Te muestran la compatibilidad de cada navegador para esa propiedad, a menudo desglosado si hay compatibilidad para un uso de la propiedad y no para otros. La tabla siguiente muestra los datos de compatibilidad para la propiedad {{cssxref ("shape-outside")}}.</p>
+
+<p>{{compat("css.shape-outside")}}</p>
+
+<h3 id="¿Hay_algo_más_que_anule_tu_CSS">¿Hay algo más que anule tu CSS?</h3>
+
+<p>Aquí es donde la información que has aprendido sobre la especificidad será muy útil. Si tienes algo más específico que anula lo que intentas hacer, puedes entrar en un juego muy frustrante de tratar de resolverlo sin saber qué tienes que resolver. Sin embargo, como hemos dicho, las DevTools te mostrarán qué CSS se ha aplicado y así puedes averiguar cómo hacer que el nuevo selector sea lo suficientemente específico como para anularlo.</p>
+
+<h3 id="Haz_un_caso_de_prueba_reducido_del_problema">Haz un caso de prueba reducido del problema</h3>
+
+<p>Si el problema no se resuelve con los pasos anteriores, deberás investigar un poco más. Lo mejor que puedes hacer en este momento es crear lo que se conoce como un caso de prueba reducido. Ser capaz de «reducir un problema» es una habilidad muy útil. Te ayudará a encontrar problemas en tu propio código y en el de tus colegas, y también te permitirá informar de errores y solicitar ayuda de manera más efectiva.</p>
+
+<p>Un caso de prueba reducido es un ejemplo de código que muestra el problema de la manera más simple posible, sin contenido ni estilo circundante. Esto significa a menudo sacar el código problemático de tu diseño para hacer un pequeño ejemplo que solo muestre ese código o característica.</p>
+
+<p>Para crear un caso de prueba reducido:</p>
+
+<ol>
+ <li>Si tu marcado se genera dinámicamente, por ejemplo desde un CMS, crea una versión estática de la salida que muestre el problema. Un sitio para compartir código como <a href="https://codepen.io/">CodePen</a> es útil para alojar casos de prueba reducidos, porque son accesibles en línea y puedes compartirlos fácilmente con tus colegas. Puedes comenzar por hacer un View Source de la página y copiar el HTML en CodePen, luego toma cualquier CSS y JavaScript relevante e inclúyelo también. Después de eso, puedes verificar si el problema sigue ahí.</li>
+ <li>Si eliminar el JavaScript no soluciona el problema, no incluyas el JavaScript. Si eliminar el JavaScript hace desaparecer el problema, elimina la mayor cantidad de JavaScript que puedas; deja solo las causas del problema.</li>
+ <li>Elimina cualquier HTML que no contribuya al problema. Elimina componentes o incluso elementos principales del diseño. Nuevamente, intenta reducir al mínimo la cantidad de código que aún muestra el problema.</li>
+ <li>Elimina cualquier CSS que no afecte al problema.</li>
+</ol>
+
+<p>En el proceso, puedes descubrir qué causa el problema, o al menos ser capaz de ponerlo o quitarlo al eliminar algo específico. Vale la pena añadir algunos comentarios a tu código a medida que vas descubriendo cosas. Si tienes que pedir ayuda, estos comentarios indicarán a la persona que te ayuda lo que ya has intentado. Esto puede proporcionarte bastante información para permitirte buscar posibles problemas por sondeo y soluciones alternativas.</p>
+
+<p>Si todavía tienes dificultades para solucionar el problema, tener un caso de prueba reducido te ofrece algo con lo que pedir ayuda, publicarlo en un foro o mostrarlo a un compañero de trabajo. Es mucho más probable que obtengas ayuda si antes de pedir la ayuda muestras que has hecho el trabajo de reducir el problema e identificar dónde sucede exactamente. Un desarrollador más experimentado va a poder detectar el problema con rapidez y orientarte en la dirección correcta, y aunque no sea así, echarle un vistazo rápido a tu caso de prueba reducido y, con suerte, ofrecerte al menos algo de ayuda.</p>
+
+<p>En el caso de que tu problema sea en realidad un error en un navegador, también puedes usar un caso de prueba reducido para presentar un informe de error al proveedor del navegador correspondiente (por ejemplo, en el sitio de <a href="https://bugzilla.mozilla.org">Bugzilla</a> de Mozilla).</p>
+
+<p>A medida que adquieras más experiencia con CSS, descubrirás que vas adquiriendo rapidez para descubrir de dónde vienen los problemas. Sin embargo, incluso los más experimentados a veces nos preguntamos qué pasa. Adoptar un enfoque metódico, hacer un caso de prueba reducido y explicar el problema a otra persona suele dar un buen resultado para encontrar una solución.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks/Organizing", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/depurar_el_css/index.html b/files/es/learn/css/building_blocks/depurar_el_css/index.html
deleted file mode 100644
index 5f04fdd756..0000000000
--- a/files/es/learn/css/building_blocks/depurar_el_css/index.html
+++ /dev/null
@@ -1,198 +0,0 @@
----
-title: Depurar el CSS
-slug: Learn/CSS/Building_blocks/Depurar_el_CSS
-translation_of: Learn/CSS/Building_blocks/Debugging_CSS
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks/Organizing", "Learn/CSS/Building_blocks")}}</div>
-
-<p>Al escribir CSS te puedes encontrar que, a veces, alguna parte de tu CSS no hace lo que esperas. Tal vez creas que cierto selector debería coincidir con un elemento, pero no sucede nada; o una caja tiene un tamaño diferente al que esperabas. Este artículo te orientará sobre cómo solucionar un problema de CSS y te mostrará cómo las DevTools incluidas en todos los navegadores modernos pueden ayudarte a descubrir qué sucede.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Conocer los conceptos básicos de las DevTools que hay en los navegadores y de cómo inspeccionar y editar el CSS de un modo fácil.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Cómo_acceder_a_las_DevTools_de_los_navegadores">Cómo acceder a las DevTools de los navegadores</h2>
-
-<p>El artículo <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">¿Qué son las herramientas de desarrollo de los navegadores?</a> es una guía actualizada que explica cómo acceder a las herramientas en varios navegadores y plataformas. Si bien puedes optar por desarrollar principalmente en un navegador en particular y, por lo tanto, te familiarizarás más con las herramientas incluidas en ese navegador, vale la pena saber cómo acceder a ellas en otros navegadores. Esto ayudará si haces pruebas de las representaciones que dan diferentes navegadores.</p>
-
-<p>También te darás cuenta de que los diversos navegadores han optado por centrarse en áreas diferentes al crear sus DevTools. Por ejemplo, en Firefox hay algunas herramientas excelentes para trabajar visualmente con la compaginación con CSS, que te permiten inspeccionar y editar <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Compaginaciones de cuadrícula</a>, <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_Flexbox_layouts">Flexbox</a> y <a href="/en-US/docs/Tools/Page_Inspector/How_to/Edit_CSS_shapes">formas</a>. Sin embargo, todos los navegadores tienen herramientas fundamentales similares. Por ejemplo, para inspeccionar las propiedades y los valores que se aplican a los elementos de tu página, y hacer cambios desde el editor.</p>
-
-<p>En este artículo veremos algunas características útiles de Firefox DevTools para trabajar con CSS. Para hacerlo, usaremos <a href="https://mdn.github.io/css-examples/learn/inspecting/inspecting.html">un archivo de ejemplo</a>. Carga esto en una pestaña nueva si deseas seguir adelante y abre tus DevTools como se describe en el artículo del enlace anterior.</p>
-
-<h2 id="El_DOM_y_View_Source">El DOM y "View Source"</h2>
-
-<p>Algo que puede hacer tropezar a los recién llegados a DevTools es la diferencia entre lo que ves cuando <a href="/es/docs/Tools/View_source">miras el código fuente</a> de una página web, o miras el archivo HTML que colocas en el servidor, y lo que puedes ver en la <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Panel_HTML">ventana HTML</a> de DevTools. Aunque ves más o menos lo mismo que puedes ver desde View Source (Ver código fuente de la página), hay algunas diferencias.</p>
-
-<p>En el DOM procesado, el navegador puede haber corregido algunos HTML mal escritos por ti. Si cerraste un elemento incorrectamente, por ejemplo, por abrir con un <code>&lt;h2&gt;</code> y cerrar con un <code>&lt;/h3&gt;</code>, el navegador descubre lo que ibas a hacer y el HTML del DOM cerrará ese <code>&lt;h2&gt;</code> de apertura correctamente con un <code>&lt;/h2&gt;</code>. El navegador también normaliza todo el HTML, y el DOM también muestra los cambios que hace JavaScript.</p>
-
-<p>En comparación, View Source es simplemente el código fuente HTML tal como está almacenado en el servidor. El <a href="/es/docs/Tools/Page_Inspector/How_to/Examinar_y_editar_HTML#%C3%81rbol_HTML">árbol HTML</a> de tus DevTools muestra exactamente lo que el navegador representa en un momento dado, y te da una idea de lo que sucede en realidad.</p>
-
-<h2 id="Inspección_del_CSS_aplicado">Inspección del CSS aplicado</h2>
-
-<p>Selecciona un elemento de tu página, ya sea haciendo clic con el botón derecho o pulsando la tecla ctrl para seleccionar la opción <em>Inspect</em>, o seleccionándolo del árbol HTML que hay a la izquierda de la pantalla de la interfaz DevTools. Selecciona el elemento con la clase <code>box1</code>; este es el primer elemento de la página con una caja alrededor.</p>
-
-<p><img alt="La página de ejemplo para este tutorial con DevTools abiertas." src="https://mdn.mozillademos.org/files/16606/inspecting1.png" style="border-style: solid; border-width: 1px; height: 1527px; width: 2278px;"></p>
-
-<p>Si observasla  <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Panel_CSS">vista de reglas</a>, que está a la derecha de tu HTML, deberías poder ver las propiedades y los valores CSS aplicados sobre ese elemento. Verás las reglas aplicadas directamente a la clase <code>box1</code> y también el CSS que la caja hereda de su elemento padre, en este caso <code>&lt;body&gt;</code>. Esto es útil para cuando ves que se aplica un CSS que no esperabas. Tal vez se esté heredando de un elemento padre y necesites añadir una regla para sobrescribirlo en el contexto de este elemento.</p>
-
-<p>También es útil la capacidad de expandir las propiedades abreviadas. En nuestro ejemplo se usa la abreviación <code>margin</code>.</p>
-
-<p><strong>Haz clic en la pequeña flecha para expandir la vista, que muestra las diferentes propiedades sin abreviar y sus valores.</strong></p>
-
-<p><strong>Puedes activar y desactivar los valores en la vista de reglas, cuando ese panel esté activo; si mantienes el ratón sobre él, aparecerán casillas de verificación. Desmarca la casilla de verificación de una regla, por ejemplo <code>border-radius</code>, y el CSS dejará de aplicarse.</strong></p>
-
-<p>Puedes usar esto para hacer una comparación entre A y B, decidir si algo se ve mejor con una regla aplicada o sin aplicar, y también para ayudar a depurarlo. Por ejemplo, si un diseño falla e intentas determinar qué propiedad causa el problema.</p>
-
-<h2 id="Editar_valores">Editar valores</h2>
-
-<p>Además de activar y desactivar las propiedades, puedes editar sus valores. ¿Quieres ver si quizá otro color se ve mejor, o deseas modificar algún tamaño? Las DevTools pueden ahorrarte mucho tiempo a la hora de editar una hoja de estilo y volver a cargar la página.</p>
-
-<p><strong>Selecciona <code>box1</code> y haz clic en la muestra (el pequeño círculo de color) que muestra el color aplicado al borde. Se abrirá un selector de color y puedes probar con colores diferentes, que se actualizarán en tiempo real en la página. De manera similar puedes cambiar el ancho o el estilo del borde.</strong></p>
-
-<p><img alt="Ventana de aplicación de estilos de DevTools con un selector de color abierto." src="https://mdn.mozillademos.org/files/16607/inspecting2-color-picker.png" style="border-style: solid; border-width: 1px; height: 1173px; width: 2275px;"></p>
-
-<h2 id="Añadir_una_propiedad_nueva">Añadir una propiedad nueva</h2>
-
-<p>Puedes añadir propiedades usando las DevTools. ¿Te has dado cuenta de que quizá no quieres que tu caja herede el tamaño de letra del elemento <code>&lt;body&gt;</code> y quieres establecer tu propio tamaño de letra específico? Pruébalo en DevTools antes de añadirlo a tu archivo CSS.</p>
-
-<p><strong>Puedes hacer clic en la llave de cierre de la regla para comenzar a introducir una declaración nueva, y en ese momento puedes comenzar a escribir la nueva propiedad y DevTools te mostrará una lista de propiedades coincidentes que se completará automáticamente. Después de seleccionar <code>font-size</code>, introduce el valor que deseas probar. También puede hacer clic en el botón + para añadir una regla adicional con el mismo selector y tus reglas nuevas.</strong></p>
-
-<p><img alt="La ventana DevTools, que añade una propiedad nueva a las reglas, con el autocompletado para font-open" src="https://mdn.mozillademos.org/files/16608/inspecting3-font-size.png" style="border-style: solid; border-width: 1px; height: 956px; width: 2275px;"></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: También hay otras funciones útiles en la vista de reglas; por ejemplo, las declaraciones con valores no válidos están tachadas. Puedes obtener más información en <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS">Examinar y editar CSS</a>.</p>
-</div>
-
-<h2 id="Comprender_el_modelo_de_cajas">Comprender el modelo de cajas</h2>
-
-<p>En artículos anteriores hemos expuesto el <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">modelo de cajas</a>, y el hecho de que tengamos un modelo de cajas alternativo que cambia la forma en que se calcula el tamaño de los elementos en función del tamaño que les asignas, más el relleno y los bordes. Las DevTools realmente pueden ayudarte a comprender cómo se calcula el tamaño de un elemento.</p>
-
-<p><a href="/es/docs/Tools/Page_Inspector/UI_Tour#Panel_CSS">El panel de disposición</a> muestra un diagrama del modelo de cajas en el elemento seleccionado, junto con una descripción de las propiedades y los valores que cambian la forma en que el elemento se presenta. Esto incluye una descripción de las propiedades que puedes no haber utilizado explícitamente en el elemento, pero que tienen valores iniciales establecidos.</p>
-
-<p>En esta ventana, una de las propiedades que se detallan es la propiedad <code>box-sizing</code>, que controla qué modelo de cajas usa el elemento.</p>
-
-<p><strong>Compara las dos cajas con las clases <code>box1</code> y <code>box2</code>. Ambas tienen el mismo ancho aplicado (400 px), sin embargo, <code>box1</code> es visualmente más ancha. En la ventana de diseño puedes ver que usa <code>content-box</code>. Este es el valor que toma el tamaño que asignas al elemento y luego añade el área de relleno y el ancho del borde.</strong></p>
-
-<p>El elemento con una clase <code>box2</code> usa <code>border-box</code>, por lo que aquí el área de relleno y el borde se restan del tamaño que has asignado al elemento. Esto significa que el espacio que la caja ocupa en la página es el tamaño exacto que se ha especificado, en nuestro caso <code>width: 400px</code>.</p>
-
-<p><img alt="La ventana de diseño de DevTools" src="https://mdn.mozillademos.org/files/16609/inspecting4-box-model.png" style="border-style: solid; border-width: 1px; height: 1532px; width: 2275px;"></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Descubre más en <a href="/es/docs/Tools/Page_Inspector/How_to/Examinar_y_editar_el_modelo_de_cajasmodel">Examinar e inspeccionar el modelo de cajas</a>.</p>
-</div>
-
-<h2 id="Resolver_problemas_de_especificidad">Resolver problemas de especificidad</h2>
-
-<p>A veces, durante el desarrollo, pero en particular cuando necesitas editar el CSS de un sitio ya publicado, te resultará difícil conseguir que se aplique un determinado CSS. No importa lo que hagas, el elemento simplemente no parece aceptar tu CSS. Lo que suele suceder aquí es que un selector más específico anula tus cambios, y en este caso DevTools te será de gran ayuda.</p>
-
-<p>En nuestro archivo de ejemplo hay dos palabras incluidas en un elemento <code>&lt;em&gt;</code>. Uno se muestra en color naranja y el otro en rosa. En el CSS hemos aplicado:</p>
-
-<pre class="brush: css notranslate">em {
-  color: hotpink;
-  font-weight: bold;
-}</pre>
-
-<p>Sin embargo, un poco más arriba en la hoja de estilo hay una regla con un selector <code>.special</code>:</p>
-
-<pre class="brush: css notranslate">.special {
-  color: orange;
-}</pre>
-
-<p>Como recordarás del artículo sobre <a href="/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia"> cascada y herencia</a>, en que hablamos sobre la especificidad, los selectores de clase son más específicos que los selectores de elemento, por lo que este es el valor que se aplica. DevTools puede ayudarte a encontrar estos problemas, especialmente si la información está oculta en algún lugar de una extensa hoja de estilo.</p>
-
-<p><strong>Inspecciona <code>&lt;em&gt;</code> con la clase <code>.special</code> y DevTools te mostrará que el naranja es el color que se aplica, y también te muestra la propiedad <code>color</code> aplicada al em tachado. Aquí puedes ver que la clase anula el selector de elemento.</strong></p>
-
-<p><img alt="Selecciona un em y mira en DevTools qué solapa el color." src="https://mdn.mozillademos.org/files/16610/inspecting5-specificity.png" style="border-style: solid; border-width: 1px; height: 1161px; width: 2275px;"></p>
-
-<h2 id="Descubre_más_sobre_las_DevTools_de_Firefox">Descubre más sobre las DevTools de Firefox</h2>
-
-<p>Hay mucha información aquí en MDN sobre las DevTools de Firefox. Echa un vistazo a la <a href="/es/docs/Tools">sección principal de las DevTools</a>, y consulta las <a href="/es/docs/Tools/Page_Inspector#How_to">Guías prácticas</a> para obtener información más detallada sobre las cosas que hemos expuesto brevemente en este artículo.</p>
-
-<h2 id="Problemas_al_depurar_en_CSS">Problemas al depurar en CSS</h2>
-
-<p>Las DevTools pueden ser de gran ayuda a la hora de resolver problemas con el CSS, pero ¿cómo resuelves una situación en la que el CSS no se comporta como esperas? Los siguientes pasos deberían ayudarte.</p>
-
-<h3 id="Aléjate_del_problema">Aléjate del problema</h3>
-
-<p>Cualquier problema de código puede ser frustrante, especialmente los problemas de CSS, porque a menudo no recibes un mensaje de error que buscar en línea para ayudarte a encontrar una solución. Si te sientes frustrado, aléjate del problema por un tiempo: sal a caminar, tómate una copa, habla con un compañero de trabajo o trabaja en otra cosa por un tiempo. A veces, la solución aparece mágicamente cuando dejas de pensar en el problema, e incluso si no llega, trabajar en ello cuando te sientas más fresco te será mucho más fácil.</p>
-
-<h3 id="¿Tu_HTML_y_CSS_son_válidos">¿Tu HTML y CSS son válidos?</h3>
-
-<p>Los navegadores esperan que tu CSS y HTML estén escritos correctamente, sin embargo, los navegadores también son muy indulgentes y harán todo lo posible para mostrar tus páginas web incluso si tiene errores en el marcado o en la hoja de estilo. Si tienes errores en el código, el navegador trata de adivinar lo que quieres decir, y podría tomar una decisión diferente a lo que tenías en mente. Además, dos navegadores diferentes pueden hacer frente al problema de dos maneras diferentes. Por lo tanto, un buen primer paso es pasar tu HTML y CSS por un validador, que detectar cualquier error.</p>
-
-<ul>
- <li><a href="https://jigsaw.w3.org/css-validator/">Validador de CSS</a></li>
- <li><a href="https://validator.w3.org/">Validador de HTML</a></li>
-</ul>
-
-<h3 id="¿La_propiedad_y_el_valor_son_compatibles_con_el_navegador">¿La propiedad y el valor son compatibles con el navegador?</h3>
-
-<p>Los navegadores simplemente ignoran el CSS que no entienden. Si la propiedad o el valor que utilizas no es compatible con el navegador en el que lo pruebas, no se romperá nada, pero ese CSS no se aplicará. Las DevTools en general destacan de alguna manera las propiedades y los valores que no son compatibles. En la captura de pantalla siguiente, el navegador no admite el valor de subcuadrícula {{cssxref ("grid-template-columns")}}.</p>
-
-<p><img alt="Imagen de las DevTools del navegador con la cuadrícula-plantilla-columnas: subcuadrícula tachada porque el valor de la subcuadrícula no es compatible." src="https://mdn.mozillademos.org/files/16641/no-support.png" style="height: 397px; width: 1649px;"></p>
-
-<p>También puedes echar un vistazo a las tablas de compatibilidad de navegadores en la parte inferior de cada página de propiedades del proyecto MDN. Te muestran la compatibilidad de cada navegador para esa propiedad, a menudo desglosado si hay compatibilidad para un uso de la propiedad y no para otros. La tabla siguiente muestra los datos de compatibilidad para la propiedad {{cssxref ("shape-outside")}}.</p>
-
-<p>{{compat("css.shape-outside")}}</p>
-
-<h3 id="¿Hay_algo_más_que_anule_tu_CSS">¿Hay algo más que anule tu CSS?</h3>
-
-<p>Aquí es donde la información que has aprendido sobre la especificidad será muy útil. Si tienes algo más específico que anula lo que intentas hacer, puedes entrar en un juego muy frustrante de tratar de resolverlo sin saber qué tienes que resolver. Sin embargo, como hemos dicho, las DevTools te mostrarán qué CSS se ha aplicado y así puedes averiguar cómo hacer que el nuevo selector sea lo suficientemente específico como para anularlo.</p>
-
-<h3 id="Haz_un_caso_de_prueba_reducido_del_problema">Haz un caso de prueba reducido del problema</h3>
-
-<p>Si el problema no se resuelve con los pasos anteriores, deberás investigar un poco más. Lo mejor que puedes hacer en este momento es crear lo que se conoce como un caso de prueba reducido. Ser capaz de «reducir un problema» es una habilidad muy útil. Te ayudará a encontrar problemas en tu propio código y en el de tus colegas, y también te permitirá informar de errores y solicitar ayuda de manera más efectiva.</p>
-
-<p>Un caso de prueba reducido es un ejemplo de código que muestra el problema de la manera más simple posible, sin contenido ni estilo circundante. Esto significa a menudo sacar el código problemático de tu diseño para hacer un pequeño ejemplo que solo muestre ese código o característica.</p>
-
-<p>Para crear un caso de prueba reducido:</p>
-
-<ol>
- <li>Si tu marcado se genera dinámicamente, por ejemplo desde un CMS, crea una versión estática de la salida que muestre el problema. Un sitio para compartir código como <a href="https://codepen.io/">CodePen</a> es útil para alojar casos de prueba reducidos, porque son accesibles en línea y puedes compartirlos fácilmente con tus colegas. Puedes comenzar por hacer un View Source de la página y copiar el HTML en CodePen, luego toma cualquier CSS y JavaScript relevante e inclúyelo también. Después de eso, puedes verificar si el problema sigue ahí.</li>
- <li>Si eliminar el JavaScript no soluciona el problema, no incluyas el JavaScript. Si eliminar el JavaScript hace desaparecer el problema, elimina la mayor cantidad de JavaScript que puedas; deja solo las causas del problema.</li>
- <li>Elimina cualquier HTML que no contribuya al problema. Elimina componentes o incluso elementos principales del diseño. Nuevamente, intenta reducir al mínimo la cantidad de código que aún muestra el problema.</li>
- <li>Elimina cualquier CSS que no afecte al problema.</li>
-</ol>
-
-<p>En el proceso, puedes descubrir qué causa el problema, o al menos ser capaz de ponerlo o quitarlo al eliminar algo específico. Vale la pena añadir algunos comentarios a tu código a medida que vas descubriendo cosas. Si tienes que pedir ayuda, estos comentarios indicarán a la persona que te ayuda lo que ya has intentado. Esto puede proporcionarte bastante información para permitirte buscar posibles problemas por sondeo y soluciones alternativas.</p>
-
-<p>Si todavía tienes dificultades para solucionar el problema, tener un caso de prueba reducido te ofrece algo con lo que pedir ayuda, publicarlo en un foro o mostrarlo a un compañero de trabajo. Es mucho más probable que obtengas ayuda si antes de pedir la ayuda muestras que has hecho el trabajo de reducir el problema e identificar dónde sucede exactamente. Un desarrollador más experimentado va a poder detectar el problema con rapidez y orientarte en la dirección correcta, y aunque no sea así, echarle un vistazo rápido a tu caso de prueba reducido y, con suerte, ofrecerte al menos algo de ayuda.</p>
-
-<p>En el caso de que tu problema sea en realidad un error en un navegador, también puedes usar un caso de prueba reducido para presentar un informe de error al proveedor del navegador correspondiente (por ejemplo, en el sitio de <a href="https://bugzilla.mozilla.org">Bugzilla</a> de Mozilla).</p>
-
-<p>A medida que adquieras más experiencia con CSS, descubrirás que vas adquiriendo rapidez para descubrir de dónde vienen los problemas. Sin embargo, incluso los más experimentados a veces nos preguntamos qué pasa. Adoptar un enfoque metódico, hacer un caso de prueba reducido y explicar el problema a otra persona suele dar un buen resultado para encontrar una solución.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks/Organizing", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/dimensionar_elementos_en_css/index.html b/files/es/learn/css/building_blocks/dimensionar_elementos_en_css/index.html
deleted file mode 100644
index 81759abccc..0000000000
--- a/files/es/learn/css/building_blocks/dimensionar_elementos_en_css/index.html
+++ /dev/null
@@ -1,129 +0,0 @@
----
-title: Dimensionar elementos en CSS
-slug: Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS
-translation_of: Learn/CSS/Building_blocks/Sizing_items_in_CSS
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks/Images_media_form_elements", "Learn/CSS/Building_blocks")}}</div>
-
-<p>En los diversos artículos vistos hasta ahora, has aprendido varias formas de dimensionar elementos en una página web utilizando CSS. Es importante que comprendas qué tamaños van a tener los diferentes elementos de tu diseño, y en este artículo vamos a resumir las diversas formas en que puedes asignar tamaños a los elementos con CSS y definir algunos términos relativos al dimensionado que te ayudarán en el futuro.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender las diferentes formas en que podemos dimensionar las cosas en CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="El_tamaño_natural_o_intrínseco_de_las_cosas">El tamaño natural o intrínseco de las cosas</h2>
-
-<p>Los elementos HTML tienen un tamaño natural, establecido antes de que se vean afectados por cualquier código CSS. Un ejemplo sencillo es una imagen. Una imagen tiene un ancho y una altura que están definidos en el archivo de imagen que está incrustando en la página. Este tamaño se describe como el <strong>tamaño intrínseco</strong>, que proviene de la imagen misma.</p>
-
-<p>Si colocas una imagen en una página y no cambias su altura y ancho, ya sea usando atributos en la etiqueta <code>&lt;img&gt;</code> o el CSS, se mostrará con ese tamaño intrínseco. En el ejemplo siguiente le hemos dado un borde a la imagen para que puedas ver la extensión del archivo.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/intrinsic-image.html", '100%', 600)}}</p>
-
-<p>Sin embargo, un elemento {{htmlelement ("div")}} vacío no tiene tamaño propio. Si añades un elemento {{htmlelement ("div")}} sin contenido a tu HTML, entonces debes darle un borde como hemos hecho con la imagen y verás una línea en la página. Se trata del borde del elemento replegado sobre sí mismo porque no hay contenido para mantenerlo abierto. En nuestro ejemplo siguiente, ese borde se extiende por todo el ancho del contenedor, porque es un elemento de nivel de bloque, un comportamiento con el que deberías comenzar a familiarizarte. No tiene altura (o tamaño en la dimensión de bloque) porque no hay contenido.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/intrinsic-text.html", '100%', 500)}}</p>
-
-<p>En el ejemplo anterior, añade texto al elemento vacío. Ahora el borde contiene ese texto porque la altura del elemento queda definida por el contenido. Por lo tanto, el tamaño de este elemento <code>&lt;div&gt;</code> en la dimensión del bloque proviene del tamaño del contenido. Nuevamente, este es el tamaño intrínseco del elemento: su tamaño está definido por su contenido.</p>
-
-<h2 id="Configurar_un_tamaño_específico">Configurar un tamaño específico</h2>
-
-<p>Por supuesto, podemos dar a los elementos de nuestro diseño un tamaño específico. Cuando asignas un tamaño a un elemento (al cual deberá ajustarse el contenido del elemento) nos referimos a este como <strong>tamaño extrínseco</strong>. Toma nuestro elemento <code>&lt;div&gt;</code> del ejemplo anterior: podemos darle valores específicos como {{cssxref ("width")}} y {{cssxref ("height")}}, y así tendrá ese tamaño sea cual sea su contenido. Como descubrimos en <a href="/es/docs/Learn/CSS/Building_blocks/Contenido_desbordado">nuestro artículo anterior sobre el desbordamiento</a>, una altura establecida puede causar el desbordamiento del contenido si hay más contenido del que cabe en el elemento.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/height.html", '100%', 600)}}</p>
-
-<p>Debido a este problema de desbordamiento, fijar la altura de los elementos con longitudes o porcentajes es algo que debemos hacer con mucho cuidado en la web.</p>
-
-<h3 id="El_uso_de_porcentajes">El uso de porcentajes</h3>
-
-<p>En muchos sentidos, los porcentajes actúan como unidades de longitud, y como discutimos en el <a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS#Porcentajes">artículo sobre valores y unidades</a>, a menudo se pueden usar indistintamente con longitudes. Cuando usas un porcentaje, debes tener claro de qué es porcentaje. En el caso de una caja dentro de otro contenedor, si a la caja secundaria le asignas un porcentaje al ancho, será un porcentaje del ancho del contenedor principal.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/percent-width.html", '100%', 600)}}</p>
-
-<p>Esto se debe a que los porcentajes se refieren al tamaño del bloque contenedor. Sin un porcentaje aplicado, nuestro elemento <code>&lt;div&gt;</code> ocuparía el 100% del espacio disponible, porque es un elemento de nivel de bloque. Si le damos un ancho porcentual, este se convierte en un porcentaje del espacio que normalmente ocuparía.</p>
-
-<h3 id="Porcentaje_de_márgenes_y_áreas_de_relleno">Porcentaje de márgenes y áreas de relleno</h3>
-
-<p>Si configuras <code>margins</code> y <code>padding</code> como un porcentaje, puede que observes un comportamiento extraño. En el ejemplo siguiente hay una caja. Hemos asignado a la caja interna un margen ({{cssxref ("margin")}}) del 10% y una área de relleno ({{cssxref ("padding")}}) del 10%. El área de relleno y el margen de la parte superior e inferior de la caja son del mismo tamaño que el margen de la izquierda y de la derecha.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/percent-mp.html", '100%', 700)}}</p>
-
-<p>Podrías esperar, por ejemplo, que el porcentaje de los márgenes superior e inferior sea un porcentaje de la altura del elemento, y el porcentaje de los márgenes izquierdo y derecho sea un porcentaje del ancho del elemento. Sin embargo, ¡este no es el caso!</p>
-
-<p>Cuando utilizas el margen y el área de relleno en porcentajes, el valor se calcula a partir del <strong>tamaño en línea</strong> del elemento, es decir, el ancho del elemento cuando se trabaja en un lenguaje horizontal. En nuestro ejemplo, todos los márgenes y el área de relleno son del 10% del ancho del elemento. Esto significa que puedes tener márgenes y relleno alrededor de la caja del mismo tamaño. Este es un hecho que vale la pena recordar si utilizas porcentajes de esta manera.</p>
-
-<h2 id="Tamaños_mínimo_y_máximo">Tamaños mínimo y máximo</h2>
-
-<p>Además de asignar a las cosas un tamaño fijo, podemos pedirle al CSS que asigne a un elemento un tamaño mínimo o máximo. Si tienes una caja que puede contener una cantidad variable de contenido y deseas que tenga siempre <em>al menos</em> una altura determinada, puedes establecer la propiedad {{cssxref ("min-height")}}. La caja siempre tendrá al menos esta altura, pero crecerá si hay más contenido del que la caja puede contener.</p>
-
-<p>En el ejemplo siguiente puedes ver dos cuadros, ambos con una altura definida de 150 píxeles. La caja de la izquierda tiene 150 píxeles de alto; la de la derecha contiene contenido que necesita más espacio, por lo que su tamaño supera los 150 píxeles.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/min-height.html", '100%', 800)}}</p>
-
-<p>Esto es muy útil para trabajar con cantidades de contenido variables y asimismo evitar desbordamientos.</p>
-
-<p>Un uso común de {{cssxref ("max-width")}} es para reducir el tamaño de las imágenes si no hay suficiente espacio para mostrarlas en su ancho intrínseco, al asegurarte de que no serán mayores que ese ancho.</p>
-
-<p>A modo de ejemplo, si para una imagen tienes que establecer <code>width: 100%</code> y su ancho intrínseco es menor que su contenedor, la imagen se verá obligada a expandirse y agrandarse, y se pixelará. Si su ancho intrínseco es mayor que su contenedor, se desbordará. No es probable que desees que suceda ninguno de estos casos.</p>
-
-<p>Si en lugar de ello usas <code>max-width: 100%</code>, la imagen puede encogerse con respecto a su tamaño intrínseco, pero no se agranda más allá del 100% de su tamaño.</p>
-
-<p>En el ejemplo siguiente hemos utilizado la misma imagen dos veces. La primera imagen tiene <code>width: 100%</code> y está en un contenedor que es más grande, por lo que se extiende hasta el ancho del contenedor. La segunda imagen tiene <code>max-width: 100%</code> y, por lo tanto, no se estira para llenar el recipiente. La tercera caja contiene la misma imagen de nuevo, también con <code>max-width: 100%</code>; pero en este caso puedes ver cómo se ha reducido para encajar en la caja.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/max-width.html", '100%', 800)}}</p>
-
-<p>Esta técnica se utiliza para dar a las imágenes una respuesta <em>adaptativa</em>, de modo que se reduzcan adecuadamente cuando se visualizan en un dispositivo más pequeño. Sin embargo, no es conveniente usar esta técnica para cargar imágenes demasiado grandes y luego reducirlas en el navegador. Las imágenes deben tener el tamaño adecuado, no deben ser más grandes de lo que sea necesario para el tamaño más grande que se muestran en el diseño. Descargar imágenes muy grandes ralentizará tu sitio y puede costarles más dinero a los usuarios si tienen una conexión tarifada.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Obtén más información sobre las <a href="/es/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">técnicas adaptativas para las imágenes</a>.</p>
-</div>
-
-<h2 id="Unidades_de_ventana_gráfica">Unidades de ventana gráfica</h2>
-
-<p>La ventana gráfica es el área visible de tu página en el navegador que utilizas para ver un sitio, y también tiene un tamaño. En CSS hay unidades que asociadas con el tamaño de la ventana gráfica: las unidades <code>vw</code> para el ancho y <code>vh</code> para la altura. Con estas unidades puedes establecer tamaños relativos a la ventana gráfica del usuario.</p>
-
-<p><code>1vh</code> es igual al 1% de la altura de visualización, y <code>1vw</code> es igual al 1% de la anchura. Puedes usar estas unidades para dimensionar cajas, pero también texto. En el ejemplo siguiente hay un cuadro que tiene un tamaño de 20vh y 20vw. La caja contiene una letra <code>A</code>, a la que se le ha dado un valor para {{cssxref ("font-size")}} de 10vh.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/sizing/vw-vh.html", '100%', 600)}}</p>
-
-<p><strong>Si cambias los valores <code>vh</code> y <code>vw</code>, cambia el tamaño de la caja o de la letra; cambiar el tamaño de la ventana gráfica también cambia esos tamaños porque están dimensionados en relación con el de la ventana gráfica. Para ver el cambio del ejemplo cuando cambias el tamaño de la ventana gráfica, debes cargar el ejemplo en una ventana nueva del navegador, que pueda cambiar de tamaño (ya que tu ventana gráfica es el <code>&lt;iframe&gt;</code> incrustado que contiene el ejemplo que se muestra arriba). <a href="https://mdn.github.io/css-examples/learn/sizing/vw-vh.html">Abre el ejemplo</a>, cambia el tamaño de la ventana del navegador y observa lo que ocurre con el tamaño de la caja y el texto.</strong></p>
-
-<p>Cambiar los tamaños según la ventana gráfica puede ser útil en tus diseños. Por ejemplo, si deseas mostrar una sección principal a pantalla completa antes del resto del contenido, haz que esa parte de tu página de 100vh empuje el resto del contenido por debajo de la ventana gráfica, de modo que solo aparezca cuando desplacen los contenidos del documento con la barra de desplazamiento.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Este artículo te ha dado un resumen de algunos problemas clave con los que puedes encontrarte al dimensionar cosas en la web. Cuando llegues al artículo <a href="/es/docs/Learn/CSS/CSS_layout">Compaginar con CSS</a>, el tamaño va a ser un aspecto muy importante para dominar los diferentes métodos de compaginación, por lo que, antes de continuar, vale la pena comprender los conceptos que hemos expuesto en este artículo.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks/Images_media_form_elements", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/el_modelo_de_caja/index.html b/files/es/learn/css/building_blocks/el_modelo_de_caja/index.html
deleted file mode 100644
index dbc0d644f8..0000000000
--- a/files/es/learn/css/building_blocks/el_modelo_de_caja/index.html
+++ /dev/null
@@ -1,343 +0,0 @@
----
-title: El modelo de caja
-slug: Learn/CSS/Building_blocks/El_modelo_de_caja
-translation_of: Learn/CSS/Building_blocks/The_box_model
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks")}}</div>
-
-<p>Todo en CSS tiene una caja alrededor, y comprender estas cajas es clave para poder crear diseños con CSS o para alinear elementos con otros elementos. En este artículo, echaremos un vistazo más de cerca al <em>modelo de cajas</em> en CSS con el que vas a poder crear diseños de compaginación más complejos con una comprensión de cómo funciona y la terminología relacionada.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de cómo <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender sobre el modelo de cajas en CSS, en qué consiste el modelo de cajas y cómo cambiar al modelo alternativo.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Cajas_en_bloque_y_en_línea">Cajas en bloque y en línea</h2>
-
-<p>En CSS, en general, hay dos tipos de cajas: <strong>cajas en bloque</strong> y <strong>cajas en línea</strong>. Estas características se refieren al modo como se comporta la caja en términos de flujo de página y en relación con otras cajas de la página:</p>
-
-<p>Si una caja se define como un bloque, se comportará de las maneras siguientes:</p>
-
-<ul>
- <li>La caja fuerza un salto de línea al llegar al final de la línea.</li>
- <li>La caja se extenderá en la dirección de la línea para llenar todo el espacio disponible que haya en su contenedor. En la mayoría de los casos, esto significa que la caja será tan ancha como su contenedor, y llenará el 100% del espacio disponible.</li>
- <li>Se respetan las propiedades {{cssxref ("width")}} y {{cssxref ("height")}}.</li>
- <li>El relleno, el margen y el borde mantienen a los otros elementos alejados de la caja.</li>
-</ul>
-
-<p>A menos que decidamos cambiar el tipo de visualización a en línea, elementos como los encabezados (por ejemplo, <code>&lt;h1&gt;</code>) y todos los elementos <code>&lt;p&gt;</code> usan por defecto <code>block</code> como tipo de visualización externa.</p>
-
-<p>Si una caja tiene una visualización externa de tipo <code>inline</code>, entonces:</p>
-
-<ul>
- <li>La caja no fuerza ningún salto de línea al llegar al final de la línea.</li>
- <li>Las propiedades {{cssxref ("width")}} y {{cssxref ("height")}} no se aplican.</li>
- <li>Se aplican relleno, margen y bordes verticales, pero no mantienen alejadas otras cajas en línea.</li>
- <li>Se aplican relleno, margen y bordes horizontales, y mantienen alejadas otras cajas en línea.</li>
-</ul>
-
-<p>El elemento <code>&lt;a&gt;</code>, que se utiliza para los enlaces, y los elementos <code>&lt;span&gt;</code>, <code>&lt;em&gt;</code> y <code>&lt;strong&gt;</code> son ejemplos de elementos que se muestran en línea por defecto.</p>
-
-<p>El tipo de caja que se aplica a un elemento está definido por los valores de propiedad {{cssxref ("display")}}, como <code>block</code> y <code>inline</code>, y se relaciona con el valor <strong>externo</strong> (<em>outer</em>) de visualización (<code>display</code>).</p>
-
-<h2 id="Aparte_tipos_de_visualización_interna_y_externa">Aparte: tipos de visualización interna y externa</h2>
-
-<p>En este punto, será mejor que también expliquemos los tipos de visualización <strong>interna</strong> y <strong>externa</strong>. Como se mencionó anteriormente, las cajas en CSS tienen un tipo de visualización <em>externa</em>, que define si se trata de una caja en bloque o en línea.</p>
-
-<p>Sin embargo, las cajas también tienen un tipo de visualización <em>interna</em>, que determina cómo se disponen los elementos dentro de esa caja. De forma predeterminada, los elementos dentro de una caja se presentan en <strong><a href="/es/docs/Learn/CSS/CSS_layout/Flujo_normal">flujo normal</a></strong>, lo que significa que se comportan como otros elementos de tipo en bloque o en línea (como se explicó anteriormente).</p>
-
-<p>Sin embargo, podemos cambiar el tipo de visualización interna utilizando valores de <code>display</code>, como <code>flex</code>. Si en un elemento establecemos <code>display: flex;</code>, el tipo de visualización externa es de tipo bloque (<code>block</code>), pero el tipo de visualización interna cambia a flexible (<code>flex</code>). Cualquier elemento que sea hijo directo de esta caja pasará a comportarse como un elemento de tipo flex, de acuerdo con las reglas que se establecen en la especificación de <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a>, tema que veremos más adelante.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Para obtener más información acerca de los valores de visualización y el modo como funcionan las cajas en las disposiciones en bloque y en línea, echa un vistazo a la guía <a href="/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow">Disposiciones en bloque y en línea</a> de MDN.</p>
-</div>
-
-<p>A medida que vayas aprendiendo más detalles sobre el diseño CSS, te irás encontrando con el valor <code>flex</code> y con otros valores internos que puedan presentar tus cajas, por ejemplo, <code><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">grid</a></code>.</p>
-
-<p>Sin embargo, la disposición en bloque y en línea es la forma predeterminada cómo se comportan las cosas en la web; como ya dijimos, a veces esto se conoce como <em>flujo normal</em>, porque nuestras cajas se dispondrán en bloque o en línea, si no reciben ninguna otra instrucción.</p>
-
-<h2 id="Ejemplos_de_diferentes_tipos_de_visualización">Ejemplos de diferentes tipos de visualización</h2>
-
-<p>Sigamos adelante y veamos algunos ejemplos. A continuación tenemos tres elementos HTML diferentes, todos con visualización externa de tipo <code>block</code>. El primero es un párrafo, que tiene un borde añadido con CSS. El navegador representa esto como una caja en bloque, por lo que el párrafo comienza en una línea nueva y se expande por todo el ancho disponible.</p>
-
-<p>El segundo es una lista, que se presenta usando <code>display: flex</code>. Esto establece una disposición flexible para los elementos que están dentro del contenedor; sin embargo, la lista en sí misma es una caja que se comporta en bloque y, como el párrafo, se expande por todo el ancho del contenedor y fuerza un salto de línea al llegar al final de línea.</p>
-
-<p>Debajo hay un párrafo a nivel de bloque, dentro del cual hay dos elementos <code>&lt;span&gt;</code>. Estos elementos normalmente serían de tipo <code>inline</code>; sin embargo, uno de los elementos tiene una clase de bloque, y lo hemos establecido como <code>display: block</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/block.html", '100%', 1000)}} </p>
-
-<p>Podemos ver cómo se comportan los elementos <code>inline</code> en el ejemplo siguiente. Los elementos <code>&lt;span&gt;</code> del primer párrafo están en línea de manera predeterminada y, por lo tanto, no fuerzan ningún salto de línea.</p>
-
-<p>También hay un elemento <code>&lt;ul&gt;</code> que se establece como <code>display: inline-flex</code>, que crea una caja con un comportamiento de tipo en línea alrededor de algunos elementos de tipo <code>flex</code>.</p>
-
-<p>Finalmente, hay dos párrafos configurados con <code>display: inline</code>. El contenedor flexible en línea y los párrafos fluyen todos juntos en línea, en lugar de dividirse en líneas nuevas como lo harían si se mostraran como elementos de bloque.</p>
-
-<p><strong>En el ejemplo puedes cambiar <code>display: inline</code> por <code>display: block</code> o <code>display: inline-flex</code> y por <code>display: flex</code> para alternar entre estos modos de visualización.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline.html", '100%', 1000)}} </p>
-
-<p>En artículos posteriores encontrarás cosas como el diseño flexible. El aspecto clave a recordar aquí es que cambiar el valor de la propiedad <code>display</code> puede cambiar entre el modo de visualización exterior en bloque y en línea de una caja, que cambia la forma en que se presenta junto con otros elementos en la disposición en pantalla.</p>
-
-<p>En el resto de este artículo, nos concentraremos en el tipo de visualización externa.</p>
-
-<h2 id="¿Qué_es_el_modelo_de_cajas_CSS">¿Qué es el modelo de cajas CSS?</h2>
-
-<p>El modelo de cajas CSS completo se aplica a cajas que presentan comportamiento en bloque; las cajas con comportamiento en línea solo usan una parte del comportamiento definido en el modelo de cajas. El modelo define cómo funcionan juntas las diferentes partes de una caja (margen, borde, relleno y contenido) para crear una caja que puedas ver en tu página. Para complicarlo un poco más, hay un modelo de cajas estándar y un modelo de cajas alternativo.</p>
-
-<h3 id="Partes_de_una_caja">Partes de una caja</h3>
-
-<p>Al hacer una caja de tipo bloque en CSS tenemos los elementos siguientes:</p>
-
-<ul>
- <li>El <strong>contenido de la caja</strong> (o <em>content box</em>): El área donde se muestra el contenido, cuyo tamaño puede cambiarse utilizando propiedades como {{cssxref ("width")}} y {{cssxref ("height")}}.</li>
- <li>El <strong>relleno de la caja</strong> (o <em>padding box</em>): El relleno es espacio en blanco alrededor del contenido; es posible controlar su tamaño usando la propiedad {{cssxref ("padding")}} y otras propiedades relacionadas.</li>
- <li>El <strong>borde de la caja</strong> (o <em>border box</em>): El borde de la caja envuelve el contenido y el de relleno. Es posible controlar su tamaño y estilo utilizando la propiedad {{cssxref ("border")}} y otras propiedades relacionadas.</li>
- <li>El <strong>margen de la caja</strong> (o <em>margin box</em>): El margen es la capa más externa. Envuelve el contenido, el relleno y el borde como espacio en blanco entre la caja y otros elementos. Es posible controlar su tamaño usando la propiedad {{cssxref ("margin")}} y otras propiedades relacionadas.</li>
-</ul>
-
-<p>El diagrama siguiente muestra estas capas:</p>
-
-<p><img alt="Diagrama del modelo de cajas" src="https://mdn.mozillademos.org/files/16558/box-model.png" style="height: 300px; width: 544px;"></p>
-
-<h3 id="El_modelo_de_cajas_CSS_estándar">El modelo de cajas CSS estándar</h3>
-
-<p>En el modelo de cajas estándar, cuando estableces los atributos <code>width</code> y <code>height</code> para una caja, defines el ancho y el alto del <em>contenido de la caja</em>. Cualquier área de relleno y borde se añade a ese ancho y alto para obtener el tamaño total que ocupa la caja. Esto se muestra en la imagen que encontrarás a continuación.</p>
-
-<p>Si suponemos que la caja tiene el CSS siguiente, que establece los valores para las propiedades <code>width</code>, <code>height</code>, <code>margin</code>, <code>border</code>, y <code>padding</code>:</p>
-
-<pre class="brush: css notranslate">.box {
-  width: 350px;
-  height: 150px;
-  margin: 10px;
-  padding: 25px;
-  border: 5px solid black;
-}
-</pre>
-
-<p>El espacio que ocupa nuestra caja usando el modelo de cajas estándar será en realidad de 410 px (350 + 25 + 25 + 5 + 5); y su altura, de 210 px (150 + 25 + 25 + 5 + 5), porque el área de relleno y el borde se añaden al ancho que se utiliza para el contenido de la caja.</p>
-
-<p><img alt="Mostrar el tamaño de la caja cuando se usa el modelo de cajas estándar." src="https://mdn.mozillademos.org/files/16559/standard-box-model.png" style="height: 300px; width: 500px;"></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: El margen no se cuenta para el tamaño real de la caja; por supuesto, afecta al espacio total que la caja ocupa en la página, pero solo al espacio de fuera de la caja. El área de la caja se termina en el borde, no se extiende hasta el margen.</p>
-</div>
-
-<h3 id="El_modelo_de_cajas_CSS_alternativo">El modelo de cajas CSS alternativo</h3>
-
-<p>Podrías pensar que es más bien incómodo tener que sumar el borde y el área de relleno para obtener el tamaño real de la caja, ¡y tienes razón! Por este motivo, CSS introdujo un modelo de caja alternativo algún tiempo después del modelo de cajas estándar. Con este modelo, cualquier ancho es el ancho de la caja visible en la página, por lo tanto, el ancho del área de contenido es ese ancho menos el ancho para el relleno y el borde. El mismo CSS que hemos usado antes daría entonces el resultado siguiente (ancho = 350 px, altura = 150 px).</p>
-
-<p><img alt="Mostrar el tamaño de la caja cuando se usa el modelo de cajas alternativo." src="https://mdn.mozillademos.org/files/16557/alternate-box-model.png" style="height: 240px; width: 440px;"></p>
-
-<p>Por defecto, los navegadores usan el modelo de cajas estándar. Si deseas activar el modelo de cajas alternativo para un elemento, hazlo configurando <code>box-sizing: border-box</code>. Con ello, le dices al navegador que tome como el borde de la caja el área definida por cualquier tamaño que establezcas.</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  box-sizing: border-box;
-} </code></pre>
-
-<p>Si quieres que todos tus elementos usen el modelo de cajas alternativo (opción común entre los desarrolladores) debes establecer la propiedad <code>box-sizing</code> en el elemento <code>&lt;html&gt;</code>. Luego debes configurar todos los demás elementos para que hereden ese valor, como se ve en el fragmento de código siguiente. Si deseas comprender qué hay detrás, consulta el <a href="https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/">artículo de <em>CSS-Tricks</em> sobre el tamaño de las cajas</a>.</p>
-
-<pre class="brush: css notranslate"><code class="language-css"><span class="selector token">html</span> <span class="punctuation token">{</span>
-  <span class="property token">box-sizing</span><span class="punctuation token">:</span> border-box<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-<span class="selector token">*, *<span class="pseudo-element token">::before</span>, *<span class="pseudo-element token">::after</span></span> <span class="punctuation token">{</span>
-  <span class="property token">box-sizing</span><span class="punctuation token">:</span> inherit<span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Un dato curioso es que Internet Explorer usaba por defecto el modelo de cajas alternativo, y no disponía de ningún mecanismo para cambiarlo.</p>
-</div>
-
-<h2 id="Jugar_con_los_modelos_de_cajas">Jugar con los modelos de cajas</h2>
-
-<p>En el ejemplo siguiente puedes ver dos cajas. Ambas tienen una clase <code>.box</code>, lo que les da los mismos atributos <code>width</code>, <code>height</code>, <code>margin</code>, <code>border</code> y <code>padding</code>. La única diferencia es que la segunda caja se ha configurado para utilizar el modelo de cajas alternativo.</p>
-
-<p><strong>¿Puedes cambiar el tamaño de la segunda caja (añadiendo CSS a la clase <code>.alternate</code>) para que su anchura y altura coincidan con las de la primera caja?</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/box-models.html", '100%', 1000)}} </p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar la solución <a href="https://github.com/mdn/css-examples/blob/master/learn/solutions.md#the-box-model">aquí</a>.</p>
-</div>
-
-<h3 id="Utilizar_las_DevTools_del_navegador_para_ver_el_modelo_de_cajas">Utilizar las DevTools del navegador para ver el modelo de cajas</h3>
-
-<p>Las <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">herramientas del desarrollador de tu navegador</a> pueden facilitar la comprensión del modelo de cajas. Si inspeccionas un elemento con las DevTools de Firefox, puedes ver el tamaño del elemento más su margen, área de relleno y borde. Inspeccionar un elemento de esta manera es un modo excelente de descubrir si tu caja es en realidad del tamaño que crees que es.</p>
-
-<p><img alt="Inspeccionar el modelo de cajas de un elemento utilizando Firefox DevTools" src="https://mdn.mozillademos.org/files/16560/box-model-devtools.png" style="height: 683px; width: 1150px;"></p>
-
-<h2 id="Márgenes_relleno_y_bordes">Márgenes, relleno y bordes</h2>
-
-<p>Ya has visto las propiedades {{cssxref ("margin")}}, {{cssxref ("padding")}} y {{cssxref ("border")}} que usamos en el ejemplo anterior. Las propiedades que hemos usado en ese ejemplo son <strong>propiedades abreviadas</strong> y nos permiten establecer los cuatro lados de la caja a la vez. Estas propiedades abreviadas también tienen propiedades sin abreviar equivalentes, que permiten tener control sobre los diferentes lados de la caja de forma individual.</p>
-
-<p>Vamos a explorar estas propiedades más detalladamente.</p>
-
-<h3 id="Margen">Margen</h3>
-
-<p>El margen es un espacio invisible que hay alrededor de la caja. Aleja el resto de elementos de la caja. Los márgenes pueden tener valores positivos o negativos. Establecer un margen negativo para un lado de tu caja puede hacer que se superponga con otros elementos de la página. Tanto si utilizas el modelo de cajas estándar como el alternativo, el margen siempre se añade después de haber calculado el tamaño de la caja que se ve.</p>
-
-<p>Podemos controlar todos los márgenes de un elemento a la vez usando la propiedad {{cssxref ("margin")}}, o cada lado individualmente usando las propiedades equivalentes sin abreviar:</p>
-
-<ul>
- <li>{{cssxref("margin-top")}}</li>
- <li>{{cssxref("margin-right")}}</li>
- <li>{{cssxref("margin-bottom")}}</li>
- <li>{{cssxref("margin-left")}}</li>
-</ul>
-
-<p><strong>En el ejemplo siguiente, cambia los valores de margen para ver cómo se empuja la caja debido al espacio que el margen crea o se elimina (si es un margen negativo) entre este elemento y el elemento que lo contiene.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/margin.html", '100%', 1000)}} </p>
-
-<h4 id="Colapso_del_margen">Colapso del margen</h4>
-
-<p>Un punto clave a la hora de entender los márgenes es el concepto de colapso del margen. Si tienes dos elementos cuyos márgenes se tocan, esos márgenes se combinan para convertirse en un solo margen, cuyo tamaño es el del margen más grande.</p>
-
-<p>En el ejemplo siguiente hay dos párrafos. El párrafo superior tiene un atributo <code>margin-bottom</code> de 50 píxeles. El segundo párrafo tiene un atributo <code>margin-top</code> de 30 píxeles. Los márgenes colapsan, por lo que el margen real entre las cajas es de 50 píxeles, y no el total de ambos márgenes.</p>
-
-<p><strong>Pruébalo ajustando el atributo <code>margin-top</code> del segundo párrafo a 0. El margen visible entre los dos párrafos no cambiará, sino que conservará los 50 píxeles fijados en el atributo <code>bottom-margin</code> del primer párrafo.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/margin-collapse.html", '100%', 1000)}} </p>
-
-<p>Hay una serie de reglas que establecen cuándo los márgenes colapsan y cuándo no. Para obtener más información, consulta la página web sobre <a href="/es/docs/Web/CSS/CSS_Modelo_Caja/Mastering_margin_collapsing">entender el colapso de márgenes</a>. Por ahora solo debes recordar que el colapso de los márgenes es algo que puede suceder. Si creas un espacio con márgenes y no obtienes el espacio que esperas, probablemente es que se haya producido algún colapso de márgenes.</p>
-
-<h3 id="Bordes">Bordes</h3>
-
-<p>El borde se dibuja entre el margen y el área de relleno de una caja. Si utilizas el modelo de cajas estándar, el tamaño del borde se añade a los elementos <code>width</code> y <code>height</code> que establecen el alto y el ancho de la caja. Si utilizas el modelo de cajas alternativo, el tamaño del borde reduce el tamaño de la caja de contenido, porque ocupa una parte del alto y el ancho disponibles.</p>
-
-<p>Hay una gran cantidad de propiedades que sirven para aplicar estilo a los bordes: hay cuatro bordes y cada borde tiene un estilo, un ancho y un color que podemos modificar.</p>
-
-<p>Puedes establecer el ancho, el estilo o el color de los cuatro bordes a la vez utilizando la propiedad {{cssxref ("border")}}.</p>
-
-<p>Para establecer las propiedades de cada lado de forma individual, puedes utilizar:</p>
-
-<ul>
- <li>{{cssxref("border-top")}}</li>
- <li>{{cssxref("border-right")}}</li>
- <li>{{cssxref("border-bottom")}}</li>
- <li>{{cssxref("border-left")}}</li>
-</ul>
-
-<p>Para establecer el ancho, el estilo o el color de todos los lados, usa lo siguiente:</p>
-
-<ul>
- <li>{{cssxref("border-width")}}</li>
- <li>{{cssxref("border-style")}}</li>
- <li>{{cssxref("border-color")}}</li>
-</ul>
-
-<p>Para establecer el ancho, el estilo o el color de un solo lado, puedes usar una de las propiedades no abreviadas:</p>
-
-<ul>
- <li>{{cssxref("border-top-width")}}</li>
- <li>{{cssxref("border-top-style")}}</li>
- <li>{{cssxref("border-top-color")}}</li>
- <li>{{cssxref("border-right-width")}}</li>
- <li>{{cssxref("border-right-style")}}</li>
- <li>{{cssxref("border-right-color")}}</li>
- <li>{{cssxref("border-bottom-width")}}</li>
- <li>{{cssxref("border-bottom-style")}}</li>
- <li>{{cssxref("border-bottom-color")}}</li>
- <li>{{cssxref("border-left-width")}}</li>
- <li>{{cssxref("border-left-style")}}</li>
- <li>{{cssxref("border-left-color")}}</li>
-</ul>
-
-<p><strong>En el ejemplo siguiente, hemos utilizado varios ejemplos de la lista anterior para crear bordes. Juega con las diferentes propiedades para comprobar que entiendes cómo funcionan. Las páginas de MDN sobre las propiedades de los bordes te proporcionan información sobre los diferentes estilos entre los que puedes elegir para los bordes.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/border.html", '100%', 1000)}} </p>
-
-<h3 id="Relleno">Relleno</h3>
-
-<p>El relleno se encuentra entre el borde y el área de contenido. A diferencia de los márgenes, el relleno no puede tomar valores negativos, por lo que el valor debe ser 0 o positivo. Cualquier fondo aplicado a tu elemento se mostrará detrás del área de relleno y, generalmente, se usa para mantener el contenido alejado del borde.</p>
-
-<p>Podemos controlar el área de relleno para todos los lados de un mismo elemento usando la propiedad {{cssxref ("padding")}}, o para cada lado uno de los lados usando las propiedades equivalentes:</p>
-
-<ul>
- <li>{{cssxref("padding-top")}}</li>
- <li>{{cssxref("padding-right")}}</li>
- <li>{{cssxref("padding-bottom")}}</li>
- <li>{{cssxref("padding-left")}}</li>
-</ul>
-
-<p><strong>Si cambias los valores para el elleno en la clase <code>.box</code> del ejemplo siguiente, puedes ver que cambia dónde comienza el texto en relación con la caja.</strong></p>
-
-<p><strong>También puedes cambiar el relleno en la clase <code>.container</code>, que abrirá el espacio entre el contenedor y la caja. El área de relleno se puede cambiar para cualquier elemento y abrirá espacio entre su borde y lo que esté dentro del elemento.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/padding.html", '100%', 800)}} </p>
-
-<h2 id="El_modelo_de_cajas_y_las_cajas_en_línea">El modelo de cajas y las cajas en línea</h2>
-
-<p>Todo lo anterior se aplica por completo a las cajas en bloque. Algunas de las propiedades también pueden aplicarse a las cajas en línea, como las que crea un elemento <code>&lt;span&gt;</code>.</p>
-
-<p>En el ejemplo siguiente hay un elemento <code>&lt;span&gt;</code> dentro de un párrafo al que hemos aplicado las propiedades <code>width</code>, <code>height</code>, <code>margin</code>, <code>border</code>, y <code>padding</code> Puedes ver que la anchura y la altura se ignoran. Se respetan el margen, el relleno y el borde, pero no cambian la relación de otro contenido con respecto a nuestra caja en línea, por lo que el relleno y el borde se superponen a otras palabras en el párrafo.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline-box-model.html", '100%', 800)}} </p>
-
-<h2 id="El_uso_de_display_inline-block">El uso de display: inline-block</h2>
-
-<p>Hay un valor especial de <code>display</code> que proporciona un punto medio entre <code>inline</code> y <code>block</code>. Esto es útil para situaciones en las que no deseas que un elemento fuerce un salto de línea, pero sí deseas que se respeten las propiedades <code>width</code> y <code>height</code> para evitar superposiciones como la que se ve arriba.</p>
-
-<p>Un elemento con <code>display: inline-block</code> conforma un subconjunto de los elementos en bloque que ya conocemos:</p>
-
-<ul>
- <li>Se respetan las propiedades de ancho y alto.</li>
- <li>El relleno, el margen y el borde mantienen los otros elementos alejados de la caja.</li>
-</ul>
-
-<p>Sin embargo, no se fuerza un salto de línea, y solo se hace más grande que su contenido si añades las propiedades <code>width</code> y <code>height</code> explícitamente.</p>
-
-<p><strong>En el ejemplo siguiente hemos añadido <code>display: inline-block</code> a nuestro elemento <code>&lt;span&gt;</code>. Cámbialo por <code>display: block</code> o elimina la línea para ver la diferencia entre ambos modelos de visualización.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline-block.html", '100%', 800)}} </p>
-
-<p>Esto puede ser útil cuando deseas dar a un enlace un área de impacto más grande añadiendo <code>padding</code>. <code>&lt;a&gt;</code> es un elemento en línea como <code>&lt;span&gt;</code>; puedes usar <code>display: inline-block</code> para configurar el área de relleno para facilitar al usuario hacer clic en el enlace.</p>
-
-<p>Esto se ve con bastante frecuencia en las barras de navegación. La navegación siguiente se muestra en una fila usando <code>flexbox</code> y hemos añadido una área de relleno al elemento <code>&lt;a&gt;</code> porque queremos poder cambiar su color de fondo (<code>background-color</code>) cuando se pasa el ratón por encima de <code>&lt;a&gt;</code>. El área de relleno parece superponerse al borde del elemento <code>&lt;ul&gt;</code>. Esto se debe a que <code>&lt;a&gt;</code> es un elemento en línea.</p>
-
-<p><strong>Añade <code>display: inline-block</code> a la regla con el selector <code>.links-list a</code> y verás cómo se soluciona este problema, al hacer que otros elementos respeten el área de relleno.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline-block-nav.html", '100%', 600)}} </p>
-
-<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
-
-<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más relevante? Encontrarás más pruebas para verificar que has retenido esa información en <a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Box_Model_Tasks">Test your skills: The Box Model</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Eso es lo que hay que entender sobre el modelo de cajas. Es posible que en el futuro desees volver a este artículo si alguna vez te lías con los tamaños de las cajas en la disposición de tu página web.</p>
-
-<p>En el artículo siguiente veremos cómo se pueden usar los <a href="/es/docs/Learn/CSS/Building_blocks/Fondos_y_bordes">fondos y bordes</a> para hacer que tus simples cajas presenten un aspecto más interesante.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS </a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/fondos_y_bordes/index.html b/files/es/learn/css/building_blocks/fondos_y_bordes/index.html
deleted file mode 100644
index 0de93e1eb1..0000000000
--- a/files/es/learn/css/building_blocks/fondos_y_bordes/index.html
+++ /dev/null
@@ -1,306 +0,0 @@
----
-title: Fondos y bordes
-slug: Learn/CSS/Building_blocks/Fondos_y_bordes
-translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks")}}</div>
-
-<p>En este artículo, veremos algunas de las cosas creativas que puedes hacer con los fondos y los bordes de CSS. Añadir degradados, imágenes de fondo o redondear esquinas; los fondos y los bordes son la solución para una gran cantidad de cuestiones de estilo en CSS.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender a diseñar el fondo y los bordes de las cajas.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Aplicar_estilo_a_los_fondos_en_CSS">Aplicar estilo a los fondos en CSS</h2>
-
-<p>La propiedad {{cssxref ("background")}} de CSS es una propiedad abreviada de una serie de propiedades de fondo que vamos a ver en este artículo. Si descubres una propiedad de fondo compleja en una hoja de estilo, puede parecer un poco difícil de entender porque pueden estarse pasando muchos valores a la vez.</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  background: linear-gradient(105deg, rgba(255,255,255,.2) 39%, rgba(51,56,57,1) 96%) center center / 400px 200px no-repeat,
-  url(big-star.png) center no-repeat, rebeccapurple;
-} </code>
-</pre>
-
-<p>Más adelante en este tutorial regresaremos a cómo funcionan las propiedades abreviadas, pero primero echemos un vistazo a las diferentes cosas que puedes hacer con los fondos en CSS, a partir de observar las propiedades de fondo individuales.</p>
-
-<h3 id="Los_colores_de_fondo">Los colores de fondo</h3>
-
-<p>La propiedad {{cssxref ("background-color")}} define el color de fondo de cualquier elemento en CSS. La propiedad admite cualquier <code><a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a></code> válido. Un color de fondo (<code>background-color</code>) se extiende por debajo del contenido y el relleno del elemento.</p>
-
-<p>En el ejemplo siguiente hemos utilizado varios valores de color para añadir un color de fondo a la caja, a un encabezado y a un elemento {{htmlelement ("span")}}.</p>
-
-<p><strong>Juega un poco con ellos; usa cualquier valor <a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a> disponible.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/color.html", '100%', 800)}}</p>
-
-<h3 id="Las_imágenes_de_fondo">Las imágenes de fondo</h3>
-
-<p>La propiedad {{cssxref ("background-image")}} permite visualizar una imagen de fondo en un elemento. En el ejemplo siguiente hay dos cajas: una tiene una imagen de fondo que es más grande que la caja misma, la otra tiene una imagen pequeña en forma de estrella.</p>
-
-<p>Este ejemplo demuestra dos cosas sobre las imágenes de fondo. De forma predeterminada, la imagen grande no se reduce para ajustarse a la caja, por lo que solo vemos una pequeña esquina de esta, mientras que la imagen pequeña aparece en forma de mosaico hasta llenar la caja. En este caso, la imagen es en realidad una sola estrella.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/background-image.html", '100%', 800)}}</p>
-
-<p><strong>Si especificas un color de fondo además de una imagen de fondo, la imagen se muestra encima del color de fondo. Añade una propiedad <code>background-color</code> al ejemplo anterior y obsérvalo en acción.</strong></p>
-
-<h4 id="Controlar_background-repeat">Controlar background-repeat</h4>
-
-<p>La propiedad {{cssxref ("background-repeat")}} se usa para controlar el comportamiento de tipo mosaico de las imágenes. Los valores disponibles son:</p>
-
-<ul>
- <li><code>no-repeat</code>: evita que el fondo se repita.</li>
- <li><code>repeat-x</code>: repite horizontalmente.</li>
- <li><code>repeat-y</code>: repite verticalmente.</li>
- <li><code>repeat</code>: es el valor por defecto; repite en ambas direcciones.</li>
-</ul>
-
-<p><strong>Prueba estos valores en el ejemplo siguiente. Hemos establecido el valor <code>no-repeat</code>, así que solo verás una estrella. Prueba los diferentes valores (<code>repeat-x</code> y <code>repeat-y</code>) y observa cuáles son los efectos.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/repeat.html", '100%', 800)}}</p>
-
-<h4 id="Dimensionar_la_imagen_de_fondo">Dimensionar la imagen de fondo</h4>
-
-<p>En el ejemplo anterior hay una imagen grande que aparece recortada porque es más grande que el fondo. En este caso, podríamos usar la propiedad {{cssxref ("background-size")}}, que puede tomar valores de <a href="/es/docs/Web/CSS/length">longitud</a> o <a href="/es/docs/Web/CSS/porcentaje">porcentaje</a>, para ajustar el tamaño de la imagen para que quepa dentro del fondo.</p>
-
-<p>También puedes utilizar palabras clave:</p>
-
-<ul>
- <li><code>cover</code>: el navegador agrandará la imagen lo suficientemente grande como para que esta cubra por completo el área de la caja sin que pierda su relación de aspecto. En este caso, es probable que parte de la imagen quede fuera de la caja.</li>
- <li><code>contain</code>: el navegador adecuará el tamaño de la imagen para que quepa dentro de la caja. En este caso, pueden quedar huecos a ambos lados o en la parte superior e inferior de la imagen si la relación de aspecto de la imagen es diferente de la de la caja.</li>
-</ul>
-
-<p>En el ejemplo siguiente hemos usado la imagen más grande del ejemplo anterior y unidades de longitud para establecer sus dimensiones dentro de la caja. Puedes ver que esto ha distorsionado la imagen.</p>
-
-<p>Prueba lo siguiente:</p>
-
-<ul>
- <li>Cambia las unidades de longitud que has utilizado para modificar el tamaño del fondo.</li>
- <li>Elimina las unidades de longitud y observa qué sucede cuando usas <code>background-size: cover</code> o <code>background-size: contain</code>.</li>
- <li>Si tu imagen es más pequeña que la caja, puedes cambiar el valor <code>background-repeat</code> para que la imagen se repita.</li>
-</ul>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/size.html", '100%', 800)}}</p>
-
-<h4 id="Posicionar_la_imagen_de_fondo">Posicionar la imagen de fondo</h4>
-
-<p>La propiedad {{cssxref ("background-position")}} te permite elegir la posición en la que aparece la imagen de fondo dentro de la caja a la que está asociada. Para ello se utiliza un sistema de coordenadas en el que la esquina superior izquierda de la caja es <code>(0,0)</code>, y la caja se coloca sobre los ejes horizontal (<code>x</code>) y vertical (<code>y</code>).</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: El valor predeterminado de <code>background-position</code> es <code>(0,0)</code>.</p>
-</div>
-
-<p>Los valores de <code>background-position</code> más comunes toman dos valores independientes: un valor horizontal seguido de un valor vertical.</p>
-
-<p>Puedes usar palabras clave como <code>top</code> y <code>right</code> (busca todas las demás en la página sobre la propiedad {{cssxref ("background-position")}}):</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  background-image: url(star.png);
-  background-repeat: no-repeat;
-  background-position: top center;
-} </code>
-</pre>
-
-<p>Y también <a href="/es/docs/Web/CSS/length">longitudes</a> y <a href="/es/docs/Web/CSS/porcentaje">porcentajes</a>:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  background-image: url(star.png);
-  background-repeat: no-repeat;
-  background-position: 20px 10%;
-} </code>
-</pre>
-
-<p>También puedes mezclar valores de palabras clave con longitudes o porcentajes, por ejemplo:</p>
-
-<pre class="brush: css notranslate">.box {
-  background-image: url(star.png);
-  background-repeat: no-repeat;
-  background-position: top 20px;
-}</pre>
-
-<p>Por último, también puedes usar una sintaxis de 4 valores para indicar una distancia desde ciertos bordes del cuadro: la unidad de longitud en este caso es un desplazamiento del valor que la precede. Entonces, en el CSS siguiente, colocamos el fondo a 20 px desde la parte superior y a 10 px desde la derecha:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  background-image: url(star.png);
-  background-repeat: no-repeat;
-  background-position: top 20px right 10px;
-} </code></pre>
-
-<p><strong>Utiliza el ejemplo siguiente para jugar con estos valores y mover la estrella por la caja.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/position.html", '100%', 800)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: <code>background-position</code> es una propiedad abreviada de {{cssxref("background-position-x")}} y {{cssxref("background-position-y")}}, que te permiten configurar los diferentes valores de posición del eje por separado.</p>
-</div>
-
-<h3 id="Degradados_de_fondo">Degradados de fondo</h3>
-
-<p>Un degradado, cuando se usa para un fondo, actúa como una imagen y también se establece usando la propiedad {{cssxref("background-image")}}.</p>
-
-<p>Puedes leer más sobre los diferentes tipos de degradados y sobre qué puedes hacer con ellos en la página sobre el tipo de datos <code><a href="/en-US/docs/Web/CSS/gradient">&lt;gradient&gt;</a></code> de MDN. Una forma divertida de jugar con degradados es usar uno de los muchos generadores de degradados CSS que hay disponibles en la web, <a href="https://cssgradient.io/">como este</a>. Puedes crear un degradado y luego copiar y pegar el código fuente que lo genera.</p>
-
-<p>Prueba algunos degradados diferentes en el ejemplo siguiente. En las dos cajas hay, respectivamente, un degradado lineal que se extiende por toda la caja, y un degradado radial con un tamaño establecido, que por lo tanto se repite.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/gradients.html", '100%', 800)}}</p>
-
-<h3 id="Múltiples_imágenes_de_fondo">Múltiples imágenes de fondo</h3>
-
-<p>También es posible poner múltiples imágenes de fondo: puedes especificar múltiples valores <code>background-image</code> para un solo atributo, separados cada uno por una coma.</p>
-
-<p>Si haces esto, las imágenes de fondo pueden quedar superpuestas entre sí. Los fondos se superponen con la última imagen de fondo que hay en la parte inferior de la lista, y cada imagen anterior se apila encima de la que sigue en el código.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Los degradados se pueden mezclar con imágenes de fondo normales.</p>
-</div>
-
-<p>Las otras propiedades <code>background-*</code> también pueden tener valores múltiples separados por comas, de la misma manera que <code>background-image</code>:</p>
-
-<pre class="brush: css notranslate">background-image: url(image1.png), url(image2.png), url(image3.png), url(image1.png);
-background-repeat: no-repeat, repeat-x, repeat;
-background-position: 10px 20px,  top right;</pre>
-
-<p>Cada valor de las diversas propiedades coincide con los valores que están en la misma posición en las otras propiedades. Arriba, por ejemplo, el valor para la propiedad <code>background-repeat</code> de <code>image1</code> será <code>no-repeat</code>. Sin embargo, ¿qué sucede cuando diferentes propiedades tienen una cantidad diferente de valores? La respuesta es que los valores que ocupan las posiciones más pequeñas se alternan cíclicamente: en el ejemplo anterior hay cuatro imágenes de fondo pero solo dos valores <code>background-position</code>. Los primeros dos valores de posición se aplicarán a las dos primeras imágenes, luego los valores volverán a asignarse cíclicamente: a <code>image3</code> se le dará el primer valor de posición, y a <code>image4</code> se le dará el segundo valor de posición.</p>
-
-<p><strong>Vamos a jugar. En el ejemplo siguiente hemos incluido dos imágenes. Para demostrar el orden de superposición, cambia la imagen de fondo que aparece primero en la lista. O juega con las otras propiedades para cambiar la posición, el tamaño o repite los valores.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/multiple-background-image.html", '100%', 800)}}</p>
-
-<h3 id="Anclaje_del_fondo">Anclaje del fondo</h3>
-
-<p>Otra opción que hay disponible para fondos es especificar cómo se desplazan cuando se desplaza el contenido. Esto se controla con la propiedad {{cssxref ("background-attachment")}}, que puede tomar los valores siguientes:</p>
-
-<ul>
- <li><code>scroll</code>: Hace que el fondo del elemento se desplace cuando te desplazas por el contenido de la página. Si te desplazas por el contenido del elemento, el fondo no se mueve. El efecto resultante es que el fondo está anclado a la página en una posición fija, por lo que se desplaza a medida que la página se desplaza.</li>
- <li><code>fixed</code>: Hace que el fondo de un elemento quede fijo con respecto a la ventana gráfica, de modo que no se desplace cuando te desplazas por la página o el contenido del elemento. Siempre permanece en la misma posición de la pantalla.</li>
- <li><code>local</code>: Este valor se añadió posteriormente (solo es compatible con Internet Explorer 9+, mientras que los otros son compatibles con IE4+) porque el valor <code>scroll</code> es bastante confuso y en muchos casos no hace lo que deseas. El valor <code>local</code> ancla el fondo al elemento en el que está configurado, de modo que cuando te desplazas por el contenido del elemento, el fondo se desplaza con este.</li>
-</ul>
-
-<p>La propiedad {{cssxref ("background-attachment")}} solo tiene efecto cuando hay contenido por el que puedas desplazarte, por lo que hemos preparado un ejemplo para demostrar las diferencias entre los tres valores: echa un vistazo a <a href="http://mdn.github.io/learning-area/css/styling-boxes/backgrounds/background-attachment.html">background-attachment.html</a> (También puedes consultar el <a href="https://github.com/mdn/learning-area/tree/master/css/styling-boxes/backgrounds">código fuente</a> aquí).</p>
-
-<h3 id="Usar_la_propiedad_abreviada_para_el_fondo">Usar la propiedad abreviada para el fondo</h3>
-
-<p>Como mencionamos al comienzo de este artículo, a menudo verás fondos que están especificados usando la propiedad {{cssxref ("background")}}. Esta forma abreviada te permite configurar todas las diferentes propiedades a la vez.</p>
-
-<p>Si utilizas varios fondos, debes especificar todas las propiedades para el primer fondo y luego añadir el fondo siguiente separado por una coma. En el ejemplo siguiente hay un degradado con un tamaño y una posición, luego un fondo de imagen con <code>no-repeat</code> y una posición y, por último, un color.</p>
-
-<p>Al escribir los valores abreviados de las imágenes de fondo es necesario seguir algunas reglas, por ejemplo:</p>
-
-<ul>
- <li>Solo es posible especificar un color de fondo (<code>background-color</code>) después de la coma final.</li>
- <li>El valor para <code>background-size</code> solo puede incluirse inmediatamente después de <code>background-position</code>, separado con el carácter '/', así: <code>center/80%</code>.</li>
-</ul>
-
-<p>Consulta la página para el atributo {{cssxref ("background")}} de MDN para ver todas las posibilidades.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/background.html", '100%', 800)}}</p>
-
-<h3 id="Consideraciones_de_accesibilidad_con_los_fondos">Consideraciones de accesibilidad con los fondos</h3>
-
-<p>Al colocar texto sobre una imagen o un color de fondo, debes asegurarte de que tiene suficiente contraste para que tus visitantes puedan leer el texto. Si estableces una imagen de fondo y el texto se coloca encima de la imagen, también debes especificar un color de fondo (<code>background-color</code>) que permita leer el texto si la imagen no se carga.</p>
-
-<p>Los lectores de pantalla no pueden analizar las imágenes de fondo, por lo tanto, deben ser puramente decorativas; cualquier contenido importante debe ser parte de la página HTML y no debe estar contenido en un fondo.</p>
-
-<h2 id="Bordes">Bordes</h2>
-
-<p>Al aprender sobre el modelo de cajas descubrimos cómo los bordes afectan al tamaño de nuestra caja. En este artículo veremos cómo usar los bordes de una manera creativa. Por lo general, cuando a un elemento le añadimos bordes con CSS, usamos una propiedad abreviada que establece el color, el ancho y el estilo del borde en una línea de CSS.</p>
-
-<p>Podemos establecer un borde para los cuatro lados de una caja con {{cssxref ("border")}}:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  border: 1px solid black;
-} </code></pre>
-
-<p>O podemos establecer solo un borde de la caja, por ejemplo:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  border-top: 1px solid black;
-} </code></pre>
-
-<p>Cada una de las propiedades de estas propiedades abreviadas sería:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  border-width: 1px;
-  border-style: solid;
-  border-color: black;
-} </code></pre>
-
-<p>Y las no abreviadas:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  border-top-width: 1px;
-  border-top-style: solid;
-  border-top-color: black;
-} </code></pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Estas propiedades para el borde superior, derecho, inferior e izquierdo también tienen propiedades <em>lógicas</em> asignadas que se relacionan con el modo de escritura del documento (por ejemplo, texto de izquierda a derecha o de derecha a izquierda, o de arriba a abajo). Exploraremos esto en la próxima lección, que expone el <a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">uso de diferentes direcciones de texto</a>.</p>
-</div>
-
-<p><strong>Hay una variedad de estilos que puedes usar para los bordes. En el ejemplo siguiente, hemos utilizado un estilo de borde diferente para los cuatro lados de la caja. Juega con el estilo, el ancho y el color del borde para ver cómo funcionan los bordes.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/borders.html", '100%', 800)}}</p>
-
-<h3 id="Esquinas_redondeadas">Esquinas redondeadas</h3>
-
-<p>El redondeo de esquinas en una caja se logra mediante el uso de la propiedad {{cssxref ("border-radius")}} y otras propiedades asociadas que se relacionan con cada esquina de la caja. Como valor pueden usarse dos longitudes o porcentajes: el primer valor define el radio horizontal y el segundo el radio vertical. En muchos casos, solo se pondrá un valor, que se utilizará para ambos.</p>
-
-<p>Por ejemplo, para hacer que las cuatro esquinas de una caja tengan un radio de 10 píxeles:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  border-radius: 10px;
-} </code></pre>
-
-<p>O para hacer que la esquina superior derecha tenga un radio horizontal de 1 em y un radio vertical del 10%:</p>
-
-<pre class="brush: css notranslate"><code>.box {
-  border-top-right-radius: 1em 10%;
-} </code></pre>
-
-<p>En el ejemplo siguiente hemos establecido las cuatro esquinas, y luego cambiamos los valores de la esquina superior derecha para que sea diferente. Juega con los valores para cambiar las esquinas. Echa un vistazo a la página de la propiedad {{cssxref ("border-radius")}} para ver las opciones de sintaxis disponibles.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/corners.html", '100%', 800)}}</p>
-
-<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
-
-<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más relevante? Encontrarás más pruebas para verificar que retienes la información antes de seguir adelante en<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Test_your_skills_backgrounds_and_borders"> Test your skills: Backgrounds and Borders</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>En este artículo hemos expuesto bastantes conceptos y puedes ver que hay mucho para añadir a un fondo o a un borde de una caja. Explora las diferentes páginas de propiedades si deseas obtener más información sobre cualquiera de las características que hemos discutido. Todas las páginas de MDN contienen más ejemplos de uso, para que juegues y mejores tus conocimientos.</p>
-
-<p>En el próximo artículo descubriremos cómo interacciona el modo de escritura de tu documento con tu CSS. ¿Qué sucede cuando el texto no fluye de izquierda a derecha?</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/fundamental_css_comprehension/index.html b/files/es/learn/css/building_blocks/fundamental_css_comprehension/index.html
new file mode 100644
index 0000000000..a4f90859a7
--- /dev/null
+++ b/files/es/learn/css/building_blocks/fundamental_css_comprehension/index.html
@@ -0,0 +1,118 @@
+---
+title: Comprensión de los fundamentos de CSS
+slug: Learn/CSS/Building_blocks/Fundamental_CSS_comprehension
+tags:
+  - CSS
+  - Estilo
+  - Evaluación
+  - Modelo de Caja
+  - Principiante
+  - Selectores
+  - Sintaxis
+  - comentários
+  - reglas
+translation_of: Learn/CSS/Building_blocks/Fundamental_CSS_comprehension
+original_slug: Learn/CSS/Introduction_to_CSS/Fundamental_CSS_comprehension
+---
+<div class="boxed translate-rendered">
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenu("Learn/CSS/Introduction_to_CSS/Debugging_CSS", "Learn/CSS/Introduction_to_CSS")}}</div>
+
+<p class="summary">Has avanzado mucho en este módulo, debes sentirte orgulloso de haber llegado hasta el final. El último paso antes de terminar es intentar el examen del módulo — que incluye completar varios ejercicios para crear el último diseño — una tarjeta de presentación/de jugador/perfil de redes sociales.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Antes de intentar esta evaluación, debería haber revisado todos los artículos en este módulo.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Probar la comprensión de los fundamentos de la teoría, sintaxis y mecánica de CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Punto_de_Partida">Punto de Partida</h2>
+
+<p>Para comenzar esta evaluación, debes:</p>
+
+<ul>
+ <li>Ve y coge el <a href="https://github.com/mdn/learning-area/blob/master/css/introduction-to-css/fundamental-css-comprehension/index.html">archivo HTML del ejercicio</a>, y el <a href="https://github.com/mdn/learning-area/blob/master/css/introduction-to-css/fundamental-css-comprehension/chris.jpg">archivo de imagen asociada</a>, y guárdalos en un nuevo directorio en tu ordenador local. Si quieres usar tu propio archivo de imagen y rellenar tu propio nombre, eres bienvenido - sólo asegúrate de que la imagen es cuadrada.</li>
+ <li>Coge el <a href="https://github.com/mdn/learning-area/blob/master/css/introduction-to-css/fundamental-css-comprehension/style-resources.txt">archivo de texto de los recursos CSS</a> — este contiene un conjunto de selectores y conjuntos de reglas en estado puro que necesitarás estudiar y combinar para responder a parte de esta evaluación.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Alternativamente, se puede utilizar un sitio como  <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer la evaluación. Puede pegar el HTML y completar el CSS en uno de estos editores en línea, y usar  <a href="http://mdn.github.io/learning-area/css/introduction-to-css/fundamental-css-comprehension/chris.jpg">esta URL</a> para apuntar el elemento <code>&lt;img&gt;</code> al archivo de imagen. Si el editor en línea que estás usando no tiene un panel CSS separado, no dudes en ponerlo en un elemento <code>&lt;style&gt;</code> en el encabezado del documento.</p>
+</div>
+
+<h2 id="Resumen_del_Proyecto">Resumen del Proyecto</h2>
+
+<p>Se le ha proporcionado un poco de HTML puro y una imagen, y necesitas escribir el CSS necesario para darle estilo a una pequeña tarjeta de presentación en línea, que tal vez pueda servir como una tarjeta de jugador o de perfil en redes sociales. Las siguientes secciones describen lo que debes hacer.</p>
+
+<p>Configuración básica:</p>
+
+<ul>
+ <li>En primer lugar, crea un nuevo archivo en el mismo directorio que tus archivos HTML y de imagen. Llámalo algo realmente imaginativo como <code>style.css</code>.</li>
+ <li>Vincula tu CSS a tu archivo HTML mediante un elemento <code>&lt;link&gt;</code>.</li>
+ <li>Las dos primeras reglas en el archivo de recursos CSS son tuyas, ¡GRATIS! Después de que hayas terminado de regocijarte de tu buena fortuna, cópialas y pégalas en la parte superior de tu nuevo archivo CSS. Úsalas como prueba para asegurarte de que tu CSS se aplica correctamente a tu HTML.</li>
+ <li>
+  <p>Sobre las dos reglas, agregue un comentario CSS con algún texto dentro para indicar que se trata de un conjunto de estilos generales para toda la página. "Estilos generales de la página" sería suficiente. También agrega tres comentarios más en la parte inferior del archivo CSS para indicar estilos específicos para la configuración del contenedor de la tarjeta, estilos específicos para el header y footer (encabezado y pie de página), y estilos específicos para el contenido principal de la tarjeta de presentación. De ahora en adelante, los estilos subsiguientes añadidos a la hoja de estilo deben organizarse en el lugar apropiado.</p>
+ </li>
+</ul>
+
+<p>Encargandonos de los selectores y conjuntos de reglas proporcionados:</p>
+
+<ul>
+ <li>A continuación, nos gustaría que examinaras los cuatro selectores y calcularas la especificidad de cada uno. Escríbelas en algún lugar donde las puedas encontrar más tarde, como en un comentario en la parte superior de tu CSS.</li>
+ <li>Ahora es el momento de poner el selector correcto en el conjunto de reglas correcto! Tienes cuatro pares de selectores y reglas que coinciden en tus recursos de CSS. Hazlo ahora y agrégalos a tu archivo CSS. Necesitaras:
+  <ul>
+   <li>Asignar al contenedor principal de tarjetas un ancho/alto fijo (width/height), color de fondo sólido (background-color), borde (border) y radio de borde (border-radius), entre otras cosas.</li>
+   <li>Asigna al header un degradado (linear-gradient) de fondo que va de más oscuro a más claro, además de esquinas redondeadas que encajan con las esquinas redondeadas establecidas en el contenedor principal de tarjetas.</li>
+   <li>Asigna al pie de página un degradado (linear-gradient) de fondo que vaya de más claro a más oscuro, además de esquinas redondeadas que encajen con las esquinas redondeadas establecidas en el contenedor principal de tarjetas.</li>
+   <li>Asigna a la imagen un float a la derecha para que se pegue al lado derecho del contenido principal de la tarjeta de presentación, y dale una altura máxima (max-height) del 100% (un truco inteligente que asegura que crecerá/encogerá para que se mantenga a la misma altura que el contenedor principal, sin importar a que altura se trasforme).</li>
+  </ul>
+ </li>
+ <li>¡Cuidado! Hay dos errores en los conjuntos de reglas proporcionados. Utilizando cualquier técnica que conozcas, localízalas y arréglalas antes de seguir adelante.</li>
+</ul>
+
+<p>Nuevos conjuntos de reglas que necesitas escribir:</p>
+
+<ul>
+ <li>Escribe un conjunto de reglas que apunte tanto al header de la tarjeta como al footer de la misma, dándoles una altura total de 50px, (que incluye una altura de contenido de 30px y un padding de 10px en todos los lados). Pero expresalo en <code>em</code>s.</li>
+ <li>El margen por defecto aplicado a los elementos <code>&lt;h2&gt;</code> y <code>&lt;p&gt;</code> por el navegador interferirá con nuestro diseño, así que escribe una regla que apunte a todos estos elementos y establezca su margen en 0.</li>
+ <li>Para evitar que la imagen se derrame del contenido principal de la tarjeta de presentación (el elemento <code>&lt;article&gt;</code>), necesitamos darle una altura específica. Ajustar la altura del <code>&lt;article&gt;</code> a 120px,  expresada en <code>em</code>s. También asigna un background-color negro semitransparente, resultando en un tono ligeramente más oscuro que deja que el color rojo del fondo brille un poco también.</li>
+ <li>Escribe un conjunto de reglas que le asigne al <code>&lt;h2&gt;</code> un font-size efectivo de 20px (pero expresado en <code>em</code>s) y una line-height (altura de línea) apropiada para colocarlo en el centro de la caja de contenido del header. Recuerde que la altura de la caja de contenido debe ser de 30px - esto te proporciona todos los números que necesitas para calcular la line-height.</li>
+ <li>Escribe un conjunto de reglas que le asigne al <code>&lt;p&gt;</code> dentro del footer un font-size efectivo de 15px (pero expresado en <code>em</code>s) y una line-height apropiada para colocarlo en el centro de la caja de contenido del footer. Recuerda que la altura de la caja de contenido debe ser de 30px - esto te proporciona todos los números que necesitas para calcular la line-height.</li>
+ <li>Como último toque, asigna al párrafo dentro del <code>&lt;article&gt;</code> un padding apropiado para que su borde izquierdo se alinee con el <code>&lt;h2&gt;</code> y el párrafo del footer, y ajuste su color para que sea bastante claro y sea fácil de leer.</li>
+</ul>
+
+<p>Otras cosas en las que pensar:</p>
+
+<ul>
+ <li>Obtendrás puntos adicionales si escribes tu CSS para una legibilidad máxima, con una declaración separada en cada línea..</li>
+ <li>Deberás incluir <code>.card</code> al principio de la cadena de selección en todas tus reglas,  para que estas reglas no interfieran con el estilo de cualquier otro elemento si la tarjeta de presentación se pusiera en una página con un montón de otro contenido.</li>
+</ul>
+
+<h2 id="Consejos_y_Sugerencias">Consejos y Sugerencias</h2>
+
+<ul>
+ <li>No necesitas editar el HTML de ninguna manera, excepto para aplicar el CSS a tu HTML.</li>
+ <li>Cuando intentes calcular el valor <code>em</code> que necesita para representar una cierta longitud de píxel, piensa en el tamaño de fuente base que tiene el elemento raíz (<code>&lt;html&gt;</code>) , y por el que necesita multiplicarse para obtener el valor deseado. Eso te dará tu valor, al menos en un caso sencillo como este.</li>
+</ul>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>La siguiente captura de pantalla muestra un ejemplo de cómo debe ser el diseño terminado:</p>
+
+<p><img alt="A view of the finished business card, show a reader header and footer, and a darker center panel containing the main details and image." src="https://mdn.mozillademos.org/files/12616/business-card.png" style="display: block; margin: 0 auto;"></p>
+
+<p> </p>
+
+<h2 id="Evaluación">Evaluación</h2>
+
+<p>Si estás siguiendo esta evaluación como parte de un curso organizado, deberías ser capaz de entregar tu trabajo a tu profesor/mentor para que lo califique. Si eres autodidacta, entonces puedes obtener la guía de puntuación fácilmente preguntando en el hilo del <a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">Discurso del Área de Aprendizaje</a>, o en el canal IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Haz el ejercicio primero - ¡No hay nada que ganar haciendo trampa!</p>
+
+<p>{{PreviousMenu("Learn/CSS/Introduction_to_CSS/Debugging_CSS", "Learn/CSS/Introduction_to_CSS")}}</p>
+</div>
diff --git a/files/es/learn/css/building_blocks/handling_different_text_directions/index.html b/files/es/learn/css/building_blocks/handling_different_text_directions/index.html
new file mode 100644
index 0000000000..4f1e9a7143
--- /dev/null
+++ b/files/es/learn/css/building_blocks/handling_different_text_directions/index.html
@@ -0,0 +1,166 @@
+---
+title: Manejando diferentes direcciones de texto
+slug: Learn/CSS/Building_blocks/Handling_different_text_directions
+tags:
+  - Aprendizaje
+  - CSS
+  - Diseño en bloque
+  - Diseño lineal
+  - Modos de escritura
+  - Principiante
+  - Propiedades lógicas
+translation_of: Learn/CSS/Building_blocks/Handling_different_text_directions
+original_slug: Learn/CSS/Building_blocks/Manejando_diferentes_direcciones_de_texto
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks")}}</div>
+
+<p>Muchas de las propiedades y valores que hemos encontrado hasta ahora en nuestro aprendizaje de CSS han estado ligadas a las dimensiones físicas de nuestra pantalla. Creamos bordes arriba, a la derecha, abajo y a la izquierda de una caja, por ejemplo. Estas dimensiones físicas se ajustan adecuadamente al contenido que se visualiza de forma horizontal, y por defecto, la web tiende a apoyar lenguajes de izquierda a derecha, como el castellano o el francés, mejor que aquellos que se escriben de derecha a izquierda, como el árabe.</p>
+
+<p>Sin embargo, en los últimos años, CSS ha evolucionado para soportar de mejor forma contenidos en diferente direccionalidad, incluyendo contenido de derecha a izquierda, pero también de arriba-abajo, como el japonés - Estas direccionalidades se llaman <strong>modos de escritura</strong>.<strong> </strong>En la medida que progresa tu estudio y comiences a trabajar con diseños, comprender los modos de escritura será de mucha utilidad para ti, por ello los explicaremos a continuación.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Literatura computacional básica, <a href="https://developer.mozilla.org/en-US/Learn/Getting_started_with_the_web/Installing_basic_software">software básico instalado</a>, conocimiento básico de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">manejo de archivos</a>, HTML básico (<a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>), y una idea de cómo funciona CSS (<a href="/es/docs/Learn/CSS/First_steps">Primeros pasos en CSS</a>.)</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Entender la importancia de los modos de escritura en el CSS moderno.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_son_los_modos_de_escritura">¿Qué son los modos de escritura?</h2>
+
+<p>Un modo de escritura en CSS se refiere a si el texto está escrito horizontal o verticalmente. La propiedad {{cssxref("writing-mode")}} permite cambiar de un modo a otro. No necesitas estar trabajando en un lenguaje que use un modo de escritura vertical para querer hacer esto - Podrías cambiar el modo de escritura de partes de tu diseño por razones creativas.</p>
+
+<p>En el ejemplo siguiente existe un encabezado desplegado usando <code>writing-mode: vertical-rl</code>. El texto ahora aparece vertical. El texto vertical es común en diseño gráfico, y puede ser una forma de agregar un aspecto más interesante a tu diseño web.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/simple-vertical.html", '100%', 800)}}</p>
+
+<p>Los tres valores posibles para la propiedad <code><a href="/en-US/docs/Web/CSS/writing-mode">writing-mode</a></code> son:</p>
+
+<ul>
+ <li><code>horizontal-tb</code>: Dirección de flujo de bloque de arriba abajo. Las frases aparecen horizontales.</li>
+ <li><code>vertical-rl</code>: Dirección de flujo de bloque de derecha a izquierda. Las frases aparecen verticales.</li>
+ <li><code>vertical-lr</code>: Dirección de flujo de bloque de izquierda a derecha. Las frases aparecen verticales.</li>
+</ul>
+
+<p>Así, la propiedad <code>writing-mode</code> está configurando en realidad la direccion en que los elementos de nivel bloque son desplegados en la página - ya sea de arriba abajo, derecha a izquierda, o de izquierda a derecha. Luego señala la dirección del flujo de texto en las frases.</p>
+
+<h2 id="Modos_de_escritura_y_diseño_en_bloque_y_lineal.">Modos de escritura y diseño en bloque y lineal.</h2>
+
+<p>Ya hemos visto el diseño en bloque y lineal, y el hecho de que algunas cosas se muestran como elementos de bloque y otras como elementos lineales. Ésto se encuentra ligado al modo de escritura del documento, y no de la pantalla física. Los bloques sólo se presentan desde la parte superior a la inferior de la página si estas usando un modo de escritura que presente el texto horizontalmente, como el español.</p>
+
+<p>Con el siguiente ejemplo quedará más claro. Si tienes dos cajas que contengan un <code>heading</code> y un <code>paragraph</code>. La primera usa <code>writing-mode: horizontal-tb</code>, un modo de escritura horizontal y desde la parte superior de la página a la base. La segunda usa <code>writing-mode: vertical-rl</code>; este es un modo de escritura vertical y de derecha a izquierda.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/block-inline.html", '100%', 1200)}}</p>
+
+<p>Cuando cambiamos el modo de escritura, estamos cambiando que dirección es en bloque y cuál es lineal. En un modo de escritura <code>horizontal-tb</code> El la direccion del bloque va de arriba abajo; en un modo de escritura <code>vertical-rl</code> el bloque corre de derecha a izquierda horizontalmente. De esta forma la <strong>dimensión del bloque</strong> es siempre la direccion en la que se muestran los bloques en el modo de escritura en uso. La <strong>dimensión lineal</strong>, es siempre la dirección en que fluye una frase.</p>
+
+<p>Este dibujo muestra las dos dimensiones en un modo de escritura horizontal.<img alt="Showing the block and inline axis for a horizontal writing mode." src="https://mdn.mozillademos.org/files/16574/horizontal-tb.png" style="height: 353px; width: 634px;"></p>
+
+<p>Este dibujo muestra las dos dimensiones en un modo de escritura vertical.</p>
+
+<p><img alt="Showing the block and inline axis for a vertical writing mode." src="https://mdn.mozillademos.org/files/16575/vertical.png" style="height: 472px; width: 406px;"></p>
+
+<p>Una vez que empieces a observar el diseño CSS, y en particular los nuevos métodos de diseño, esta idea de bloque y lineal cobra mayor importancia. Será revisado más adelante.</p>
+
+<h3 id="Dirección">Dirección</h3>
+
+<p>Además del modo de escritura también tenemos la dirección del texto. Como se mencionó antes, algunos idiomas como el Árabe se escriben horizontalmente, de derecha a izquierda. Esto no es algo que usarías en un sentido creativo. Si tu simplemente quieres alinear algún elemento a la derecha, existen otras formas de hacerlo. Sin embargo es importante entender esto como parte de la naturaleza del CSS. La web no es solo para lenguajes que son escritos de izquierda a derecha!</p>
+
+<p>Debido al hecho de que el modo de escritura y la dirección del texto pueden cambiar, los nuevos métodos de diseño CSS no toman como referencia la izquierda y derecha, ni la parte superior e inferior. En su lugar, hablarán de inicio y fin junto con esta idea de en línea y bloque. No te preocupes mucho por eso en este momento, pero ten en cuenta estas ideas a medida que empiezas a mirar el diseño de una página web; va a ser de gran ayuda en tu entendimiento de CSS.</p>
+
+<h2 id="Valores_y_propiedades_lógicas">Valores y propiedades lógicas</h2>
+
+<p>La razón de hablar acerca de modos de escritura y dirección en este punto en tu aprendizaje, es por el hecho de que ya vimos muchas de estas propiedades que están atadas a las dimensiones físicas de la pantalla, y tienen más sentido cuando está en un modo de escritura horizontal.</p>
+
+<p>Vamos a echarle un vistzo a nuestras dos cajas de nuevo, una con el modo escritura <code>horizontal-tb</code> y otro con <code>vertical-rl</code>. Le hemos dado a estas dos cajas un {{cssxref("width")}}. Puedes ver que cuando la caja está en el modo de escritura vertical, aún tiene una anchura, y esto está causando que el texto se desborde.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/width.html", '100%', 1200)}}</p>
+
+<p>Lo que nosotros realmente queremos en este escenario, es esencialmente intercambiar altura y anchura junto con el modo de escritura. Cuando estamos en el modo de escritura vertical, queremos que la caja se expanda en la dimensión del bloque así como lo hace en el modo horizontal.</p>
+
+<p>Para hacerlo más fácil, CSS ha desarrollado recientemente un conjunto de propiedades asignadas. Estas esencialmente reemplazan las propiedades físicas como <code>width </code>and <code>height</code>, con versiones <strong>lógicas</strong> o <strong>relativas al flujo</strong>.</p>
+
+<p>La propiedad asignada a <code>width</code> cuando está en el modo de escritura horizontal se llama {{cssxref("inline-size")}}, se refiere al tamaño en la dimensión inline. La propiedad para <code>height </code>se llama {{cssxref("block-size")}} y es el tamaño en la dimensión de bloque. Puedes ver como funciona en el ejemplo de abajo, donde reemplazamos <code>width</code> con <code>inline-size</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/inline-size.html", '100%', 1200)}}</p>
+
+<h3 id="Propiedades_lógicas_margin_border_y_padding">Propiedades lógicas <code>margin</code>, <code>border</code> y <code>padding</code></h3>
+
+<p>En las últimas dos lecciones aprendimos acerca del modelo de cajas con CSS, y los bordes CSS. En las propiedades margin, border y padding vas a encontrar varias instancias de propiedades físicas, por ejemplo {{cssxref("margin-top")}}, {{cssxref("padding-left")}}, y {{cssxref("border-bottom")}}. Del mismo modo que tenemos asignaciones para ancho y alto, hay asignaciones para estas propiedades.</p>
+
+<p>La propiedad <code>margin-top</code> está asignada a {{cssxref("margin-block-start")}}, esto siempre se va a referir al margen al inicio de la dimensión del bloque. </p>
+
+<p>La propiedad {{cssxref("padding-left")}} se asigna a {{cssxref("padding-inline-start")}}, el padding que se aplica al inicio de la dirección inline. Aquí será donde las oraciones comienzan en ese modo de escritura. La propiedad {{cssxref("border-bottom")}} se asigna a {{cssxref("border-block-end")}}, que es el borde del final de la dimensión del bloque.</p>
+
+<p>Puedes ver una comparación entre las propiedades físicas y lógicas a continuación.</p>
+
+
+
+<p><strong>Si cambias el modo de escritura de las cajas asignando a la propiedad <code>writing-mode</code> en <code>.box</code> a <code>vertical-rl</code>, vas a ver como las propiedades físicas se quedan ligadas a sus direcciones físicas, mientras que las propiedades lógicas cambian con el modo de escritura.</strong></p>
+
+<p><strong>También puedes ver que el </strong><strong>{{htmlelement("h2")}} tiene  un <code>border-bottom</code> negro. ¿Puedes averiguar como hacer que el borde inferior siempre esté debajo del texto en ambos modos de escritura?</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/logical-mbp.html", '100%', 1200)}}</p>
+
+<p>Existe un gran número de propiedades cuando consideras cada uno de los bordes que puedes hacer a mano, y puedes ver todas las propiedades asignadas en la página de MDN para <a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/CSS_Logical_Properties">propiedades Lógicas y Valores</a></p>
+
+<h3 id="Valores_lógicos">Valores lógicos</h3>
+
+<p>Hasta ahora hemos examinado los nombres de las propiedades lógicas. Existen también algunas propiedades que toman valores físicos de <code>top</code>, <code>right</code>, <code>bottom</code>, y <code>left</code>. Estos valores también tienen asignaciones a valores lógicos: <code>block-start</code>, <code>inline-end</code>, <code>block-end</code>, y <code>inline-start</code>.</p>
+
+<p>Por ejemplo, puedes hacer que una imagen flote a la izquierda para hacer que el texto se ajuste alrededor de la imagen. Puedes reemplazar <code>left</code> con <code>inline-start</code> como se muestra en el ejemplo a continuación.</p>
+
+<p><strong>Cambia el modo de escritura en este ejemplo a <code>vertical-rl</code> para ver que sucede con la imagen. Cambia <code>inline-start</code> por <code>inline-end</code> para cambiar el modo en que flota.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/float.html", '100%', 1200)}}</p>
+
+<p>Aquí también estamos usando valores lógicos de el margen para asegurar que el margen está en el sitio correcto sin importar que modo de escritura es.</p>
+
+<div class="blockIndicator note">
+<p>Actualmente, solo Firefox soporta valores relativos de flujo para <code>float</code>. Si estás usando <strong>Google Chrome </strong>o <strong>Microsoft Edge</strong>, deberías ver que la imagen no flota.</p>
+</div>
+
+<h3 id="¿Debería_usar_propiedades_físicas_o_lógicas">¿Debería usar propiedades físicas o lógicas?</h3>
+
+<p>Las propiedades lógicas y los valores son más recientes que su equivalente físico, y por lo tanto se han implementado recientemente en los navegadores. Puedes revisar cualquier página de propiedades en MDN para ver hasta donde llega el soporte del navegador. Si no estás usando multiples modos de escritura, entonces, por ahora, deberías preferir usar las versiones físicas. Sin embargo, en última instancia, esperamos que la gente va a pasar a las versiones lógicas para la mayoría de las cosas, ya que tienen mucho sentido una vez que comienzas a tratar también con métodos de diseño como Flexbox y Grid.</p>
+
+<h2 id="¡Prueba_tus_habilidades!">¡Prueba tus habilidades!</h2>
+
+<p>Tenemos mucho terreno cubierto en este artículo, pero puedes recordad la información más importante? Puedes encontrar algunas pruebas adicionales para verificar que has retenido esta información antes de seguir adelante: <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Writing_Modes_Tasks">Prueba tus habilidades: modos de escritura.</a></p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Los conceptos explicados en esta lección son cada vez más importantes en CSS. Un entendimiento pleno de las direcciones en bloque y en línea, y como el flujo de texto cambia con la variación de los modos de escritura, van a ser de gran ayuda en el futuro. Te ayudará a entender CSS incluso si nunca usas un modo de escritura diferente al horizontal.</p>
+
+<p>En el módulo siguiente, vamos a echar un buen vistazo al desbordamiento en CSS</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia">Cascada y herencia</a></li>
+ <li><a href="/es/docs/Web/CSS/Selectores_CSS">Selectores CSS</a>
+  <ul>
+   <li><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID">Selectores de tipo, clase e ID</a></li>
+   <li><a href="/es/docs/Web/CSS/Selectores_atributo">Selectores de atributo</a></li>
+   <li><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos">Pseudoclases y pseudoelementos</a></li>
+   <li><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores">Combinadores</a></li>
+  </ul>
+ </li>
+ <li><a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">The box model</a></li>
+ <li><a href="/es/docs/Learn/CSS/Building_blocks/Fondos_y_bordes">Backgrounds and borders</a></li>
+ <li><a href="/es/docs/Learn/CSS/Building_blocks/Manejando_diferentes_direcciones_de_texto">Handling different text directions</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">Overflowing content</a></li>
+ <li><a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS">Values and units</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Sizing items in CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Images, media, and form elements</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Styling tables</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Debugging CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizing your CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/images_media_form_elements/index.html b/files/es/learn/css/building_blocks/images_media_form_elements/index.html
new file mode 100644
index 0000000000..27232582a5
--- /dev/null
+++ b/files/es/learn/css/building_blocks/images_media_form_elements/index.html
@@ -0,0 +1,194 @@
+---
+title: Imágenes, medios y elementos de formulario
+slug: Learn/CSS/Building_blocks/Images_media_form_elements
+translation_of: Learn/CSS/Building_blocks/Images_media_form_elements
+original_slug: Learn/CSS/Building_blocks/Imágenes_medios_y_elementos_de_formulario
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks")}}</div>
+
+<p>En este artículo vamos a ver cómo se tratan ciertos elementos especiales en CSS. Las imágenes y otros medios y los elementos de formulario presentan un comportamiento algo distinto que otros elementos CSS, como las cajas, en cuanto a aplicación de estilo. Comprender qué es y qué no es posible te ahorrará frustraciones, y en este artículo vamos a destacar algunas de las cuestiones principales que necesitas saber.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender el modo en que algunos elementos se comportan de manera inusual cuando se diseñan con CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Elementos_de_reemplazo">Elementos de reemplazo</h2>
+
+<p>Las imágenes y los vídeos se describen como <strong><a href="/es/docs/Web/CSS/Elemento_reemplazo">elementos de reemplazo</a></strong>. Esto significa que el CSS no puede intervenir en aspectos del diseño interno de estos elementos, sino solo a su posición en la página y algunos otros aspectos. Sin embargo, como veremos, hay varias cosas que el CSS puede hacer con una imagen.</p>
+
+<p>También se describen ciertos elementos de reemplazo que, como las imágenes y vídeos, presentan una <strong>relación de aspecto</strong>. Esto significa que tienen un tamaño definido tanto en la dimensión horizontal (x) como en la vertical (y), y por defecto se mostrarán con las dimensiones intrínsecas del archivo.</p>
+
+<h2 id="El_tamaño_de_las_imágenes">El tamaño de las imágenes</h2>
+
+<p>Como ya conoces de estos artículos, todo en CSS genera una caja. Si colocas una imagen dentro de una caja que es más pequeña o más grande que las dimensiones intrínsecas del archivo de imagen en cualquier dirección, aparecerá más pequeño que la caja o se desbordará. Debes decidir qué hacer con el desbordamiento.</p>
+
+<p>En el ejemplo siguiente hay dos cajas, ambas de 200 píxeles de tamaño:</p>
+
+<ul>
+ <li>Una contiene una imagen que es más pequeña de 200 píxeles: es más pequeña que la caja y no se expande para rellenarla.</li>
+ <li>La otra es más grande de 200 píxeles y desborda la caja.</li>
+</ul>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/images/size.html", '100%', 1000)}}</p>
+
+<p>¿Qué podemos hacer con el problema del desbordado?</p>
+
+<p>Como aprendimos en <a href="/es/docs/Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS">nuestro artículo anterior</a>, una técnica común es hacer que el la propiedad {{cssxref ("max-width")}} de una imagen sea 100%. Esto permite que la imagen tenga un tamaño menor que la caja, pero no que tenga un tamaño mayor. Esta técnica funciona con otros elementos de reemplazo, como <code><a href="/es/docs/Web/HTML/Elemento/video">&lt;video&gt;</a></code> o <code><a href="/es/docs/Web/HTML/Elemento/iframe">&lt;iframe&gt;</a></code>.</p>
+
+<p><strong>Añade <code>max-width: 100%</code> al elemento <code>&lt;img&gt;</code> del ejemplo anterior. Verás que la imagen más pequeña permanece sin cambios, pero la más grande se reduce hasta caber en la caja.</strong></p>
+
+<p>Puedes tomar otras decisiones sobre las imágenes dentro de los contenedores. Por ejemplo, es posible que desees cambiar el tamaño de una imagen para que cubra una caja por completo.</p>
+
+<p>La propiedad {{cssxref ("object-fit")}} puede ser de gran ayuda. Cuando se usa <code>object-fit</code>, el elemento de reemplazo puede dimensionarse para adaptarse a una caja de varias maneras.</p>
+
+<p>A continuación, hemos utilizado el valor <code>cover</code>, que reduce el tamaño de la imagen a la vez que mantiene la relación de aspecto hasta que rellena toda la caja. Al mantenerse la relación de aspecto, la caja corta algunas partes de la imagen.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/images/object-fit.html", '100%', 1000)}}</p>
+
+<p>Si usamos el valor <code>contain</code>, la imagen se reduce hasta que es lo bastante pequeña para caber dentro de la caja. Esto puede dar lugar a un formato panorámico si la imagen no presenta la misma relación de aspecto que la caja.</p>
+
+<p>También puedes probar el valor <code>fill</code>, que rellena la caja, pero no mantiene la relación de aspecto.</p>
+
+<h2 id="Elementos_de_reemplazo_en_una_compaginación">Elementos de reemplazo en una compaginación</h2>
+
+<p>A medida que vayas usando diversas técnicas de diseño CSS en elementos de reemplazo, irás descubriendo que se comportan de manera ligeramente diferente a otros elementos. Por ejemplo, en un diseño flexible o en un diseño de página de cuadrícula, los elementos se expanden por defecto hasta que llenan toda el área. En cambio, las imágenes no se expanden, sino que se alinean con el inicio del área de la cuadrícula o del contenedor flexible.</p>
+
+<p>Puedes ver esto en el ejemplo siguiente, en que hay un contenedor de con dos columnas y dos filas, que tiene cuatro elementos. Todos los elementos <code>&lt;div&gt;</code> tienen un color de fondo y se estiran para llenar la fila y la columna. La imagen, sin embargo, no se expande.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/images/layout.html", '100%', 1000)}}</p>
+
+<p>Si sigues estos artículos en orden, no habrás llegado todavía a la compaginación. Ten en cuenta solo que cuando los elementos de reemplazo forman parte de una cuadrícula o un diseño flexible, presentan comportamientos predeterminados diferentes, en esencia para evitar que el diseño los expanda de manera extraña.</p>
+
+<p>Para forzar que la imagen se expanda para llenar la celda de la cuadrícula en la que se encuentra, tendrías que hacer algo como lo siguiente:</p>
+
+<pre class="brush: css">img {
+  width: 100%;
+  height: 100%;
+}</pre>
+
+<p>Sin embargo, esto deformaría la imagen, por lo que probablemente no es lo que querrías hacer.</p>
+
+<h2 id="Los_elementos_de_formulario">Los elementos de formulario</h2>
+
+<p>Los elementos de formulario pueden ser un problema si queremos diseñar con CSS, y el <a href="/es/docs/Learn/HTML/Forms">artículo sobre formularios web</a> contiene guías detalladas sobre los aspectos más complicados relativos a este tema, que no vamos a repetir en este artículo. Hay algunos conceptos básicos clave que vale la pena destacar en esta sección.</p>
+
+<p>Muchos controles de formulario se añaden con el elemento <code><a href="/en-US/docs/Web/HTML/Element/input">&lt;input&gt;</a></code>: este elemento define desde campos de formulario simples, como entradas de texto, hasta campos más complejos añadidos en HTML5, como selectores de color y fecha. Hay algunos elementos adicionales, como <code><a href="/en-US/docs/Web/HTML/Element/textarea">&lt;textarea&gt;</a></code> para la entrada de texto multilínea, y también elementos que se utilizan para contener y etiquetar partes de formularios como <code><a href="/en-US/docs/Web/HTML/Element/fieldset">&lt;fieldset&gt;</a></code> y <code><a href="/en-US/docs/Web/HTML/Element/legend">&lt;legend&gt;</a></code>.</p>
+
+<p>El HTML5 también incluye atributos que permiten a los desarrolladores web indicar qué campos son obligatorios e incluso el tipo de contenido que debe introducirse. Si el usuario añade algo inesperado o deja un campo obligatorio en blanco, el navegador puede mostrar un mensaje de error. Los diversos navegadores no presentan ningún estilo coherente ni ninguna homogeneización en cuanto a la personalización que permiten para tales elementos.</p>
+
+<h3 id="Aplicar_estilo_a_los_elementos_de_entrada_de_texto">Aplicar estilo a los elementos de entrada de texto</h3>
+
+<p>Los elementos que permiten la entrada de texto, como <code>&lt;input type="text"&gt;</code>, algunos tipos específicos como <code>&lt;input type="email"&gt;</code> y el elemento <code>&lt;textarea&gt;</code> son bastante fáciles de diseñar y tienden a comportarse como otras cajas de tu página. Sin embargo, el estilo predeterminado de estos elementos es diferente según el sistema operativo y el navegador con el que el usuario visite el sitio.</p>
+
+<p>En el ejemplo siguiente hemos diseñado algunas entradas de texto con CSS: puedes ver que algunos elementos como los bordes, los márgenes y el área de relleno se aplican como es de esperar. Utilizamos selectores de atributos para apuntar a los diferentes tipos de entrada. Intenta cambiar el aspecto de este formulario ajustando los bordes, añadiendo colores de fondo a los campos y cambiando las fuentes y área de relleno.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/images/form.html", '100%', 1000)}}</p>
+
+<div class="blockIndicator warning">
+<p><strong>¡Importante!</strong>: Al cambiar el estilo de los elementos de formulario debes asegurarte de que para el usuario sigue siendo obvio que se trata de elementos de formulario. Podrías crear una entrada de formulario sin bordes y un fondo que sea casi indistinguible del contenido que lo rodea, pero esto haría que sea muy difícil de reconocer y completar.</p>
+</div>
+
+<p>Como se explica en los artículos sobre <a href="/es/docs/Learn/HTML/Forms/Styling_HTML_forms">el diseño de formularios</a> en la parte HTML de esta web, el sistema operativo presenta muchos de los tipos de entrada más complejos y son inaccesibles para el diseño. Por lo tanto, siempre debes suponer que los formularios se verán de manera bastante diferentes para los distintos visitantes, y deberás probar los formularios complejos en diversos navegadores.</p>
+
+<h3 id="Herencia_y_elementos_de_formulario">Herencia y elementos de formulario</h3>
+
+<p>En algunos navegadores, los elementos de formulario no heredan el estilo de letra por defecto. Por lo tanto, si deseas asegurarte de que tus campos de formulario usan la letra que se define para el cuerpo o para un elemento principal, debes añadir esta regla a tu CSS.</p>
+
+<pre class="brush: css"><code>button,
+input,
+select,
+textarea {
+  font-family : inherit;
+  font-size : 100%;
+} </code></pre>
+
+<h3 id="Elementos_de_formulario_y_tamaño_de_la_caja">Elementos de formulario y tamaño de la caja</h3>
+
+<p>Los elementos de formulario utilizan reglas diferentes en los diversos navegadores para el dimensionado de las cajas de los diferentes controles de formulario. Ya cubrimos la propiedad <code>box-sizing</code> en <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">el artículo sobre el modelo de cajas</a>. Puedes usar este conocimiento cuando diseñes formularios que garanticen una experiencia homogénea en cuanto a los anchos y las alturas de los elementos de formulario.</p>
+
+<p>Por coherencia, es una buena idea establecer los márgenes y el área de relleno en <code>0</code> para todos los elementos, y luego establecerlos de nuevo al diseñar cada uno de los controles de formulario.</p>
+
+<pre class="brush: css"><code>button,
+input,
+select,
+textarea {
+  box-sizing: border-box;
+  padding: 0;
+  margin: 0;
+}</code></pre>
+
+<h3 id="Otros_ajustes_útiles">Otros ajustes útiles</h3>
+
+<p>Además de las reglas ya mencionadas, también debes configurar <code>overflow: auto</code> en <code>&lt;textarea&gt;</code> para que Internet Explorer no muestre una barra de desplazamiento cuando no hay necesidad:</p>
+
+<pre class="brush: css">textarea {
+  overflow: auto;
+}</pre>
+
+<h3 id="Ponerlo_todo_junto_en_un_«Reinicio»">Ponerlo todo junto en un «Reinicio»</h3>
+
+<p>Como último paso podemos resumir las diversas propiedades expuestas en el «reinicio de formulario» siguiente para proporcionar una base coherente sobre la que trabajar. Esto incluye todos los elementos mencionados en las tres últimas secciones:</p>
+
+<pre class="brush: css"><code>button,
+input,
+select,
+textarea {
+  font-family: inherit;
+  font-size: 100%;
+  box-sizing: border-box;
+  padding: 0; margin: 0;
+}
+
+textarea {
+  overflow: auto;
+} </code></pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Muchos desarrolladores utilizan las hojas de estilo de normalización para crear un conjunto de estilos de línea base para usar en todos los proyectos. Por lo general, estas hojas hacen cosas similares a las que acabamos de describir y garantizan que cualquier cosa que pueda ser diferente en distintos navegadores tenga establecido un valor por defecto coherente antes de que tú hagas tu propio trabajo con el CSS. Aunque ya no son tan importantes como lo eran antes, porque los navegadores suelen ser más homogéneos que en el pasado. Sin embargo, si deseas ver un ejemplo, consulta <a href="http://necolas.github.io/normalize.css/">Normalize.css</a>, que es una hoja de estilo muy popular que muchos proyectos utilizan como base.</p>
+</div>
+
+<p>Para obtener más información sobre los formularios de estilo, echa un vistazo a los dos artículos en la sección HTML de estas guías.</p>
+
+<ul>
+ <li><a href="/es/docs/Learn/HTML/Forms/Styling_HTML_forms">Diseño de formularios web</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Aspectos avanzados de aplicación de estilo a formularios</a></li>
+</ul>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>En este artículo hemos destacado algunas de las diferencias que se presentan cuando trabajas con imágenes o media, y otros elementos inusuales, en CSS. En el artículo siguiente veremos algunos consejos que te resultarán útiles cuando tengas que diseñar tablas HTML.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/imágenes_medios_y_elementos_de_formulario/index.html b/files/es/learn/css/building_blocks/imágenes_medios_y_elementos_de_formulario/index.html
deleted file mode 100644
index db0f522728..0000000000
--- a/files/es/learn/css/building_blocks/imágenes_medios_y_elementos_de_formulario/index.html
+++ /dev/null
@@ -1,193 +0,0 @@
----
-title: 'Imágenes, medios y elementos de formulario'
-slug: Learn/CSS/Building_blocks/Imágenes_medios_y_elementos_de_formulario
-translation_of: Learn/CSS/Building_blocks/Images_media_form_elements
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks")}}</div>
-
-<p>En este artículo vamos a ver cómo se tratan ciertos elementos especiales en CSS. Las imágenes y otros medios y los elementos de formulario presentan un comportamiento algo distinto que otros elementos CSS, como las cajas, en cuanto a aplicación de estilo. Comprender qué es y qué no es posible te ahorrará frustraciones, y en este artículo vamos a destacar algunas de las cuestiones principales que necesitas saber.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender el modo en que algunos elementos se comportan de manera inusual cuando se diseñan con CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Elementos_de_reemplazo">Elementos de reemplazo</h2>
-
-<p>Las imágenes y los vídeos se describen como <strong><a href="/es/docs/Web/CSS/Elemento_reemplazo">elementos de reemplazo</a></strong>. Esto significa que el CSS no puede intervenir en aspectos del diseño interno de estos elementos, sino solo a su posición en la página y algunos otros aspectos. Sin embargo, como veremos, hay varias cosas que el CSS puede hacer con una imagen.</p>
-
-<p>También se describen ciertos elementos de reemplazo que, como las imágenes y vídeos, presentan una <strong>relación de aspecto</strong>. Esto significa que tienen un tamaño definido tanto en la dimensión horizontal (x) como en la vertical (y), y por defecto se mostrarán con las dimensiones intrínsecas del archivo.</p>
-
-<h2 id="El_tamaño_de_las_imágenes">El tamaño de las imágenes</h2>
-
-<p>Como ya conoces de estos artículos, todo en CSS genera una caja. Si colocas una imagen dentro de una caja que es más pequeña o más grande que las dimensiones intrínsecas del archivo de imagen en cualquier dirección, aparecerá más pequeño que la caja o se desbordará. Debes decidir qué hacer con el desbordamiento.</p>
-
-<p>En el ejemplo siguiente hay dos cajas, ambas de 200 píxeles de tamaño:</p>
-
-<ul>
- <li>Una contiene una imagen que es más pequeña de 200 píxeles: es más pequeña que la caja y no se expande para rellenarla.</li>
- <li>La otra es más grande de 200 píxeles y desborda la caja.</li>
-</ul>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/images/size.html", '100%', 1000)}}</p>
-
-<p>¿Qué podemos hacer con el problema del desbordado?</p>
-
-<p>Como aprendimos en <a href="/es/docs/Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS">nuestro artículo anterior</a>, una técnica común es hacer que el la propiedad {{cssxref ("max-width")}} de una imagen sea 100%. Esto permite que la imagen tenga un tamaño menor que la caja, pero no que tenga un tamaño mayor. Esta técnica funciona con otros elementos de reemplazo, como <code><a href="/es/docs/Web/HTML/Elemento/video">&lt;video&gt;</a></code> o <code><a href="/es/docs/Web/HTML/Elemento/iframe">&lt;iframe&gt;</a></code>.</p>
-
-<p><strong>Añade <code>max-width: 100%</code> al elemento <code>&lt;img&gt;</code> del ejemplo anterior. Verás que la imagen más pequeña permanece sin cambios, pero la más grande se reduce hasta caber en la caja.</strong></p>
-
-<p>Puedes tomar otras decisiones sobre las imágenes dentro de los contenedores. Por ejemplo, es posible que desees cambiar el tamaño de una imagen para que cubra una caja por completo.</p>
-
-<p>La propiedad {{cssxref ("object-fit")}} puede ser de gran ayuda. Cuando se usa <code>object-fit</code>, el elemento de reemplazo puede dimensionarse para adaptarse a una caja de varias maneras.</p>
-
-<p>A continuación, hemos utilizado el valor <code>cover</code>, que reduce el tamaño de la imagen a la vez que mantiene la relación de aspecto hasta que rellena toda la caja. Al mantenerse la relación de aspecto, la caja corta algunas partes de la imagen.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/images/object-fit.html", '100%', 1000)}}</p>
-
-<p>Si usamos el valor <code>contain</code>, la imagen se reduce hasta que es lo bastante pequeña para caber dentro de la caja. Esto puede dar lugar a un formato panorámico si la imagen no presenta la misma relación de aspecto que la caja.</p>
-
-<p>También puedes probar el valor <code>fill</code>, que rellena la caja, pero no mantiene la relación de aspecto.</p>
-
-<h2 id="Elementos_de_reemplazo_en_una_compaginación">Elementos de reemplazo en una compaginación</h2>
-
-<p>A medida que vayas usando diversas técnicas de diseño CSS en elementos de reemplazo, irás descubriendo que se comportan de manera ligeramente diferente a otros elementos. Por ejemplo, en un diseño flexible o en un diseño de página de cuadrícula, los elementos se expanden por defecto hasta que llenan toda el área. En cambio, las imágenes no se expanden, sino que se alinean con el inicio del área de la cuadrícula o del contenedor flexible.</p>
-
-<p>Puedes ver esto en el ejemplo siguiente, en que hay un contenedor de con dos columnas y dos filas, que tiene cuatro elementos. Todos los elementos <code>&lt;div&gt;</code> tienen un color de fondo y se estiran para llenar la fila y la columna. La imagen, sin embargo, no se expande.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/images/layout.html", '100%', 1000)}}</p>
-
-<p>Si sigues estos artículos en orden, no habrás llegado todavía a la compaginación. Ten en cuenta solo que cuando los elementos de reemplazo forman parte de una cuadrícula o un diseño flexible, presentan comportamientos predeterminados diferentes, en esencia para evitar que el diseño los expanda de manera extraña.</p>
-
-<p>Para forzar que la imagen se expanda para llenar la celda de la cuadrícula en la que se encuentra, tendrías que hacer algo como lo siguiente:</p>
-
-<pre class="brush: css">img {
-  width: 100%;
-  height: 100%;
-}</pre>
-
-<p>Sin embargo, esto deformaría la imagen, por lo que probablemente no es lo que querrías hacer.</p>
-
-<h2 id="Los_elementos_de_formulario">Los elementos de formulario</h2>
-
-<p>Los elementos de formulario pueden ser un problema si queremos diseñar con CSS, y el <a href="/es/docs/Learn/HTML/Forms">artículo sobre formularios web</a> contiene guías detalladas sobre los aspectos más complicados relativos a este tema, que no vamos a repetir en este artículo. Hay algunos conceptos básicos clave que vale la pena destacar en esta sección.</p>
-
-<p>Muchos controles de formulario se añaden con el elemento <code><a href="/en-US/docs/Web/HTML/Element/input">&lt;input&gt;</a></code>: este elemento define desde campos de formulario simples, como entradas de texto, hasta campos más complejos añadidos en HTML5, como selectores de color y fecha. Hay algunos elementos adicionales, como <code><a href="/en-US/docs/Web/HTML/Element/textarea">&lt;textarea&gt;</a></code> para la entrada de texto multilínea, y también elementos que se utilizan para contener y etiquetar partes de formularios como <code><a href="/en-US/docs/Web/HTML/Element/fieldset">&lt;fieldset&gt;</a></code> y <code><a href="/en-US/docs/Web/HTML/Element/legend">&lt;legend&gt;</a></code>.</p>
-
-<p>El HTML5 también incluye atributos que permiten a los desarrolladores web indicar qué campos son obligatorios e incluso el tipo de contenido que debe introducirse. Si el usuario añade algo inesperado o deja un campo obligatorio en blanco, el navegador puede mostrar un mensaje de error. Los diversos navegadores no presentan ningún estilo coherente ni ninguna homogeneización en cuanto a la personalización que permiten para tales elementos.</p>
-
-<h3 id="Aplicar_estilo_a_los_elementos_de_entrada_de_texto">Aplicar estilo a los elementos de entrada de texto</h3>
-
-<p>Los elementos que permiten la entrada de texto, como <code>&lt;input type="text"&gt;</code>, algunos tipos específicos como <code>&lt;input type="email"&gt;</code> y el elemento <code>&lt;textarea&gt;</code> son bastante fáciles de diseñar y tienden a comportarse como otras cajas de tu página. Sin embargo, el estilo predeterminado de estos elementos es diferente según el sistema operativo y el navegador con el que el usuario visite el sitio.</p>
-
-<p>En el ejemplo siguiente hemos diseñado algunas entradas de texto con CSS: puedes ver que algunos elementos como los bordes, los márgenes y el área de relleno se aplican como es de esperar. Utilizamos selectores de atributos para apuntar a los diferentes tipos de entrada. Intenta cambiar el aspecto de este formulario ajustando los bordes, añadiendo colores de fondo a los campos y cambiando las fuentes y área de relleno.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/images/form.html", '100%', 1000)}}</p>
-
-<div class="blockIndicator warning">
-<p><strong>¡Importante!</strong>: Al cambiar el estilo de los elementos de formulario debes asegurarte de que para el usuario sigue siendo obvio que se trata de elementos de formulario. Podrías crear una entrada de formulario sin bordes y un fondo que sea casi indistinguible del contenido que lo rodea, pero esto haría que sea muy difícil de reconocer y completar.</p>
-</div>
-
-<p>Como se explica en los artículos sobre <a href="/es/docs/Learn/HTML/Forms/Styling_HTML_forms">el diseño de formularios</a> en la parte HTML de esta web, el sistema operativo presenta muchos de los tipos de entrada más complejos y son inaccesibles para el diseño. Por lo tanto, siempre debes suponer que los formularios se verán de manera bastante diferentes para los distintos visitantes, y deberás probar los formularios complejos en diversos navegadores.</p>
-
-<h3 id="Herencia_y_elementos_de_formulario">Herencia y elementos de formulario</h3>
-
-<p>En algunos navegadores, los elementos de formulario no heredan el estilo de letra por defecto. Por lo tanto, si deseas asegurarte de que tus campos de formulario usan la letra que se define para el cuerpo o para un elemento principal, debes añadir esta regla a tu CSS.</p>
-
-<pre class="brush: css"><code>button,
-input,
-select,
-textarea {
-  font-family : inherit;
-  font-size : 100%;
-} </code></pre>
-
-<h3 id="Elementos_de_formulario_y_tamaño_de_la_caja">Elementos de formulario y tamaño de la caja</h3>
-
-<p>Los elementos de formulario utilizan reglas diferentes en los diversos navegadores para el dimensionado de las cajas de los diferentes controles de formulario. Ya cubrimos la propiedad <code>box-sizing</code> en <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">el artículo sobre el modelo de cajas</a>. Puedes usar este conocimiento cuando diseñes formularios que garanticen una experiencia homogénea en cuanto a los anchos y las alturas de los elementos de formulario.</p>
-
-<p>Por coherencia, es una buena idea establecer los márgenes y el área de relleno en <code>0</code> para todos los elementos, y luego establecerlos de nuevo al diseñar cada uno de los controles de formulario.</p>
-
-<pre class="brush: css"><code>button,
-input,
-select,
-textarea {
-  box-sizing: border-box;
-  padding: 0;
-  margin: 0;
-}</code></pre>
-
-<h3 id="Otros_ajustes_útiles">Otros ajustes útiles</h3>
-
-<p>Además de las reglas ya mencionadas, también debes configurar <code>overflow: auto</code> en <code>&lt;textarea&gt;</code> para que Internet Explorer no muestre una barra de desplazamiento cuando no hay necesidad:</p>
-
-<pre class="brush: css">textarea {
-  overflow: auto;
-}</pre>
-
-<h3 id="Ponerlo_todo_junto_en_un_«Reinicio»">Ponerlo todo junto en un «Reinicio»</h3>
-
-<p>Como último paso podemos resumir las diversas propiedades expuestas en el «reinicio de formulario» siguiente para proporcionar una base coherente sobre la que trabajar. Esto incluye todos los elementos mencionados en las tres últimas secciones:</p>
-
-<pre class="brush: css"><code>button,
-input,
-select,
-textarea {
-  font-family: inherit;
-  font-size: 100%;
-  box-sizing: border-box;
-  padding: 0; margin: 0;
-}
-
-textarea {
-  overflow: auto;
-} </code></pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Muchos desarrolladores utilizan las hojas de estilo de normalización para crear un conjunto de estilos de línea base para usar en todos los proyectos. Por lo general, estas hojas hacen cosas similares a las que acabamos de describir y garantizan que cualquier cosa que pueda ser diferente en distintos navegadores tenga establecido un valor por defecto coherente antes de que tú hagas tu propio trabajo con el CSS. Aunque ya no son tan importantes como lo eran antes, porque los navegadores suelen ser más homogéneos que en el pasado. Sin embargo, si deseas ver un ejemplo, consulta <a href="http://necolas.github.io/normalize.css/">Normalize.css</a>, que es una hoja de estilo muy popular que muchos proyectos utilizan como base.</p>
-</div>
-
-<p>Para obtener más información sobre los formularios de estilo, echa un vistazo a los dos artículos en la sección HTML de estas guías.</p>
-
-<ul>
- <li><a href="/es/docs/Learn/HTML/Forms/Styling_HTML_forms">Diseño de formularios web</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Aspectos avanzados de aplicación de estilo a formularios</a></li>
-</ul>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>En este artículo hemos destacado algunas de las diferencias que se presentan cuando trabajas con imágenes o media, y otros elementos inusuales, en CSS. En el artículo siguiente veremos algunos consejos que te resultarán útiles cuando tengas que diseñar tablas HTML.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks/Styling_tables", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/manejando_diferentes_direcciones_de_texto/index.html b/files/es/learn/css/building_blocks/manejando_diferentes_direcciones_de_texto/index.html
deleted file mode 100644
index fa21de66e5..0000000000
--- a/files/es/learn/css/building_blocks/manejando_diferentes_direcciones_de_texto/index.html
+++ /dev/null
@@ -1,165 +0,0 @@
----
-title: Manejando diferentes direcciones de texto
-slug: Learn/CSS/Building_blocks/Manejando_diferentes_direcciones_de_texto
-tags:
-  - Aprendizaje
-  - CSS
-  - Diseño en bloque
-  - Diseño lineal
-  - Modos de escritura
-  - Principiante
-  - Propiedades lógicas
-translation_of: Learn/CSS/Building_blocks/Handling_different_text_directions
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks")}}</div>
-
-<p>Muchas de las propiedades y valores que hemos encontrado hasta ahora en nuestro aprendizaje de CSS han estado ligadas a las dimensiones físicas de nuestra pantalla. Creamos bordes arriba, a la derecha, abajo y a la izquierda de una caja, por ejemplo. Estas dimensiones físicas se ajustan adecuadamente al contenido que se visualiza de forma horizontal, y por defecto, la web tiende a apoyar lenguajes de izquierda a derecha, como el castellano o el francés, mejor que aquellos que se escriben de derecha a izquierda, como el árabe.</p>
-
-<p>Sin embargo, en los últimos años, CSS ha evolucionado para soportar de mejor forma contenidos en diferente direccionalidad, incluyendo contenido de derecha a izquierda, pero también de arriba-abajo, como el japonés - Estas direccionalidades se llaman <strong>modos de escritura</strong>.<strong> </strong>En la medida que progresa tu estudio y comiences a trabajar con diseños, comprender los modos de escritura será de mucha utilidad para ti, por ello los explicaremos a continuación.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Literatura computacional básica, <a href="https://developer.mozilla.org/en-US/Learn/Getting_started_with_the_web/Installing_basic_software">software básico instalado</a>, conocimiento básico de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">manejo de archivos</a>, HTML básico (<a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>), y una idea de cómo funciona CSS (<a href="/es/docs/Learn/CSS/First_steps">Primeros pasos en CSS</a>.)</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Entender la importancia de los modos de escritura en el CSS moderno.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_son_los_modos_de_escritura">¿Qué son los modos de escritura?</h2>
-
-<p>Un modo de escritura en CSS se refiere a si el texto está escrito horizontal o verticalmente. La propiedad {{cssxref("writing-mode")}} permite cambiar de un modo a otro. No necesitas estar trabajando en un lenguaje que use un modo de escritura vertical para querer hacer esto - Podrías cambiar el modo de escritura de partes de tu diseño por razones creativas.</p>
-
-<p>En el ejemplo siguiente existe un encabezado desplegado usando <code>writing-mode: vertical-rl</code>. El texto ahora aparece vertical. El texto vertical es común en diseño gráfico, y puede ser una forma de agregar un aspecto más interesante a tu diseño web.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/simple-vertical.html", '100%', 800)}}</p>
-
-<p>Los tres valores posibles para la propiedad <code><a href="/en-US/docs/Web/CSS/writing-mode">writing-mode</a></code> son:</p>
-
-<ul>
- <li><code>horizontal-tb</code>: Dirección de flujo de bloque de arriba abajo. Las frases aparecen horizontales.</li>
- <li><code>vertical-rl</code>: Dirección de flujo de bloque de derecha a izquierda. Las frases aparecen verticales.</li>
- <li><code>vertical-lr</code>: Dirección de flujo de bloque de izquierda a derecha. Las frases aparecen verticales.</li>
-</ul>
-
-<p>Así, la propiedad <code>writing-mode</code> está configurando en realidad la direccion en que los elementos de nivel bloque son desplegados en la página - ya sea de arriba abajo, derecha a izquierda, o de izquierda a derecha. Luego señala la dirección del flujo de texto en las frases.</p>
-
-<h2 id="Modos_de_escritura_y_diseño_en_bloque_y_lineal.">Modos de escritura y diseño en bloque y lineal.</h2>
-
-<p>Ya hemos visto el diseño en bloque y lineal, y el hecho de que algunas cosas se muestran como elementos de bloque y otras como elementos lineales. Ésto se encuentra ligado al modo de escritura del documento, y no de la pantalla física. Los bloques sólo se presentan desde la parte superior a la inferior de la página si estas usando un modo de escritura que presente el texto horizontalmente, como el español.</p>
-
-<p>Con el siguiente ejemplo quedará más claro. Si tienes dos cajas que contengan un <code>heading</code> y un <code>paragraph</code>. La primera usa <code>writing-mode: horizontal-tb</code>, un modo de escritura horizontal y desde la parte superior de la página a la base. La segunda usa <code>writing-mode: vertical-rl</code>; este es un modo de escritura vertical y de derecha a izquierda.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/block-inline.html", '100%', 1200)}}</p>
-
-<p>Cuando cambiamos el modo de escritura, estamos cambiando que dirección es en bloque y cuál es lineal. En un modo de escritura <code>horizontal-tb</code> El la direccion del bloque va de arriba abajo; en un modo de escritura <code>vertical-rl</code> el bloque corre de derecha a izquierda horizontalmente. De esta forma la <strong>dimensión del bloque</strong> es siempre la direccion en la que se muestran los bloques en el modo de escritura en uso. La <strong>dimensión lineal</strong>, es siempre la dirección en que fluye una frase.</p>
-
-<p>Este dibujo muestra las dos dimensiones en un modo de escritura horizontal.<img alt="Showing the block and inline axis for a horizontal writing mode." src="https://mdn.mozillademos.org/files/16574/horizontal-tb.png" style="height: 353px; width: 634px;"></p>
-
-<p>Este dibujo muestra las dos dimensiones en un modo de escritura vertical.</p>
-
-<p><img alt="Showing the block and inline axis for a vertical writing mode." src="https://mdn.mozillademos.org/files/16575/vertical.png" style="height: 472px; width: 406px;"></p>
-
-<p>Una vez que empieces a observar el diseño CSS, y en particular los nuevos métodos de diseño, esta idea de bloque y lineal cobra mayor importancia. Será revisado más adelante.</p>
-
-<h3 id="Dirección">Dirección</h3>
-
-<p>Además del modo de escritura también tenemos la dirección del texto. Como se mencionó antes, algunos idiomas como el Árabe se escriben horizontalmente, de derecha a izquierda. Esto no es algo que usarías en un sentido creativo. Si tu simplemente quieres alinear algún elemento a la derecha, existen otras formas de hacerlo. Sin embargo es importante entender esto como parte de la naturaleza del CSS. La web no es solo para lenguajes que son escritos de izquierda a derecha!</p>
-
-<p>Debido al hecho de que el modo de escritura y la dirección del texto pueden cambiar, los nuevos métodos de diseño CSS no toman como referencia la izquierda y derecha, ni la parte superior e inferior. En su lugar, hablarán de inicio y fin junto con esta idea de en línea y bloque. No te preocupes mucho por eso en este momento, pero ten en cuenta estas ideas a medida que empiezas a mirar el diseño de una página web; va a ser de gran ayuda en tu entendimiento de CSS.</p>
-
-<h2 id="Valores_y_propiedades_lógicas">Valores y propiedades lógicas</h2>
-
-<p>La razón de hablar acerca de modos de escritura y dirección en este punto en tu aprendizaje, es por el hecho de que ya vimos muchas de estas propiedades que están atadas a las dimensiones físicas de la pantalla, y tienen más sentido cuando está en un modo de escritura horizontal.</p>
-
-<p>Vamos a echarle un vistzo a nuestras dos cajas de nuevo, una con el modo escritura <code>horizontal-tb</code> y otro con <code>vertical-rl</code>. Le hemos dado a estas dos cajas un {{cssxref("width")}}. Puedes ver que cuando la caja está en el modo de escritura vertical, aún tiene una anchura, y esto está causando que el texto se desborde.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/width.html", '100%', 1200)}}</p>
-
-<p>Lo que nosotros realmente queremos en este escenario, es esencialmente intercambiar altura y anchura junto con el modo de escritura. Cuando estamos en el modo de escritura vertical, queremos que la caja se expanda en la dimensión del bloque así como lo hace en el modo horizontal.</p>
-
-<p>Para hacerlo más fácil, CSS ha desarrollado recientemente un conjunto de propiedades asignadas. Estas esencialmente reemplazan las propiedades físicas como <code>width </code>and <code>height</code>, con versiones <strong>lógicas</strong> o <strong>relativas al flujo</strong>.</p>
-
-<p>La propiedad asignada a <code>width</code> cuando está en el modo de escritura horizontal se llama {{cssxref("inline-size")}}, se refiere al tamaño en la dimensión inline. La propiedad para <code>height </code>se llama {{cssxref("block-size")}} y es el tamaño en la dimensión de bloque. Puedes ver como funciona en el ejemplo de abajo, donde reemplazamos <code>width</code> con <code>inline-size</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/inline-size.html", '100%', 1200)}}</p>
-
-<h3 id="Propiedades_lógicas_margin_border_y_padding">Propiedades lógicas <code>margin</code>, <code>border</code> y <code>padding</code></h3>
-
-<p>En las últimas dos lecciones aprendimos acerca del modelo de cajas con CSS, y los bordes CSS. En las propiedades margin, border y padding vas a encontrar varias instancias de propiedades físicas, por ejemplo {{cssxref("margin-top")}}, {{cssxref("padding-left")}}, y {{cssxref("border-bottom")}}. Del mismo modo que tenemos asignaciones para ancho y alto, hay asignaciones para estas propiedades.</p>
-
-<p>La propiedad <code>margin-top</code> está asignada a {{cssxref("margin-block-start")}}, esto siempre se va a referir al margen al inicio de la dimensión del bloque. </p>
-
-<p>La propiedad {{cssxref("padding-left")}} se asigna a {{cssxref("padding-inline-start")}}, el padding que se aplica al inicio de la dirección inline. Aquí será donde las oraciones comienzan en ese modo de escritura. La propiedad {{cssxref("border-bottom")}} se asigna a {{cssxref("border-block-end")}}, que es el borde del final de la dimensión del bloque.</p>
-
-<p>Puedes ver una comparación entre las propiedades físicas y lógicas a continuación.</p>
-
-
-
-<p><strong>Si cambias el modo de escritura de las cajas asignando a la propiedad <code>writing-mode</code> en <code>.box</code> a <code>vertical-rl</code>, vas a ver como las propiedades físicas se quedan ligadas a sus direcciones físicas, mientras que las propiedades lógicas cambian con el modo de escritura.</strong></p>
-
-<p><strong>También puedes ver que el </strong><strong>{{htmlelement("h2")}} tiene  un <code>border-bottom</code> negro. ¿Puedes averiguar como hacer que el borde inferior siempre esté debajo del texto en ambos modos de escritura?</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/logical-mbp.html", '100%', 1200)}}</p>
-
-<p>Existe un gran número de propiedades cuando consideras cada uno de los bordes que puedes hacer a mano, y puedes ver todas las propiedades asignadas en la página de MDN para <a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/CSS_Logical_Properties">propiedades Lógicas y Valores</a></p>
-
-<h3 id="Valores_lógicos">Valores lógicos</h3>
-
-<p>Hasta ahora hemos examinado los nombres de las propiedades lógicas. Existen también algunas propiedades que toman valores físicos de <code>top</code>, <code>right</code>, <code>bottom</code>, y <code>left</code>. Estos valores también tienen asignaciones a valores lógicos: <code>block-start</code>, <code>inline-end</code>, <code>block-end</code>, y <code>inline-start</code>.</p>
-
-<p>Por ejemplo, puedes hacer que una imagen flote a la izquierda para hacer que el texto se ajuste alrededor de la imagen. Puedes reemplazar <code>left</code> con <code>inline-start</code> como se muestra en el ejemplo a continuación.</p>
-
-<p><strong>Cambia el modo de escritura en este ejemplo a <code>vertical-rl</code> para ver que sucede con la imagen. Cambia <code>inline-start</code> por <code>inline-end</code> para cambiar el modo en que flota.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/writing-modes/float.html", '100%', 1200)}}</p>
-
-<p>Aquí también estamos usando valores lógicos de el margen para asegurar que el margen está en el sitio correcto sin importar que modo de escritura es.</p>
-
-<div class="blockIndicator note">
-<p>Actualmente, solo Firefox soporta valores relativos de flujo para <code>float</code>. Si estás usando <strong>Google Chrome </strong>o <strong>Microsoft Edge</strong>, deberías ver que la imagen no flota.</p>
-</div>
-
-<h3 id="¿Debería_usar_propiedades_físicas_o_lógicas">¿Debería usar propiedades físicas o lógicas?</h3>
-
-<p>Las propiedades lógicas y los valores son más recientes que su equivalente físico, y por lo tanto se han implementado recientemente en los navegadores. Puedes revisar cualquier página de propiedades en MDN para ver hasta donde llega el soporte del navegador. Si no estás usando multiples modos de escritura, entonces, por ahora, deberías preferir usar las versiones físicas. Sin embargo, en última instancia, esperamos que la gente va a pasar a las versiones lógicas para la mayoría de las cosas, ya que tienen mucho sentido una vez que comienzas a tratar también con métodos de diseño como Flexbox y Grid.</p>
-
-<h2 id="¡Prueba_tus_habilidades!">¡Prueba tus habilidades!</h2>
-
-<p>Tenemos mucho terreno cubierto en este artículo, pero puedes recordad la información más importante? Puedes encontrar algunas pruebas adicionales para verificar que has retenido esta información antes de seguir adelante: <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Writing_Modes_Tasks">Prueba tus habilidades: modos de escritura.</a></p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Los conceptos explicados en esta lección son cada vez más importantes en CSS. Un entendimiento pleno de las direcciones en bloque y en línea, y como el flujo de texto cambia con la variación de los modos de escritura, van a ser de gran ayuda en el futuro. Te ayudará a entender CSS incluso si nunca usas un modo de escritura diferente al horizontal.</p>
-
-<p>En el módulo siguiente, vamos a echar un buen vistazo al desbordamiento en CSS</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia">Cascada y herencia</a></li>
- <li><a href="/es/docs/Web/CSS/Selectores_CSS">Selectores CSS</a>
-  <ul>
-   <li><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID">Selectores de tipo, clase e ID</a></li>
-   <li><a href="/es/docs/Web/CSS/Selectores_atributo">Selectores de atributo</a></li>
-   <li><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos">Pseudoclases y pseudoelementos</a></li>
-   <li><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores">Combinadores</a></li>
-  </ul>
- </li>
- <li><a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">The box model</a></li>
- <li><a href="/es/docs/Learn/CSS/Building_blocks/Fondos_y_bordes">Backgrounds and borders</a></li>
- <li><a href="/es/docs/Learn/CSS/Building_blocks/Manejando_diferentes_direcciones_de_texto">Handling different text directions</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">Overflowing content</a></li>
- <li><a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS">Values and units</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Sizing items in CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Images, media, and form elements</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Styling tables</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Debugging CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizing your CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/overflowing_content/index.html b/files/es/learn/css/building_blocks/overflowing_content/index.html
new file mode 100644
index 0000000000..4c5b173d08
--- /dev/null
+++ b/files/es/learn/css/building_blocks/overflowing_content/index.html
@@ -0,0 +1,124 @@
+---
+title: Contenido desbordado
+slug: Learn/CSS/Building_blocks/Overflowing_content
+translation_of: Learn/CSS/Building_blocks/Overflowing_content
+original_slug: Learn/CSS/Building_blocks/Contenido_desbordado
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks")}}</div>
+
+<p>En este artículo veremos otro concepto importante en CSS: el <strong>desbordamiento</strong>. El desbordamiento es lo que sucede cuando hay demasiado contenido para que pueda caber cómodamente en una caja. En esta guía aprenderás qué es y cómo administrarlo.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender el desbordamiento y cómo gestionarlo.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_el_desbordamiento">¿Qué es el desbordamiento?</h2>
+
+<p>Ya sabemos que todo en CSS está dentro de una caja, y que podemos restringir el tamaño de estas cajas asignándoles los valores {{cssxref ("width")}} y {{cssxref ("height")}} (o {{cssxref("inline-size")}} y {{cssxref("block-size")}}). <strong>El desbordamiento es lo que sucede cuando hay demasiado contenido en una caja, y no cabe cómodamente en ella.</strong> El CSS te proporciona varias herramientas para administrar este desbordamiento, y además es un concepto que resulta útil de conocer desde las primeras etapas. Te encontrarás con situaciones de desbordamiento con bastante frecuencia al escribir CSS, especialmente cuando profundices en compaginación con CSS.</p>
+
+<h2 id="El_CSS_trata_de_evitar_«la_pérdida_de_datos»">El CSS trata de evitar «la pérdida de datos»</h2>
+
+<p>Vamos a comenzar con dos ejemplos que demuestran cómo se comporta el CSS por defecto cuando ocurre un desbordamiento.</p>
+
+<p>El primero consiste en una caja que a la que se le ha restringido la dimensión al darle una altura. Luego hemos añadido más contenido del que cabe en la caja. El contenido se desborda y se distribuye desordenadamente sobre el párrafo que hay debajo de la caja.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/overflow/block-overflow.html", '100%', 600)}}</p>
+
+<p>El segundo consiste en una palabra dentro de una caja cuya dimensión en línea está restringida. La caja se ha hecho demasiado pequeña para que esa palabra quepa, y se desborda.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/overflow/inline-overflow.html", '100%', 500)}}</p>
+
+<p>Te debes estar preguntando por qué el CSS ha tomado por defecto el enfoque más bien desarreglado de provocar el desbordamiento desordenado del contenido. ¿Por qué no ocultar el contenido adicional o hacer crecer la caja?</p>
+
+<p>Siempre que sea posible, el CSS no oculta su contenido; hacerlo provocaría la pérdida de datos, que generalmente es un problema. En términos de CSS, esto significa que una parte del contenido desaparece. El problema con que desaparezca contenido es que podría ser que no notaras que ha desaparecido. Tus visitantes podrían no darse cuenta de que ha desaparecido contenido. Si se trata del botón de envío de datos en un formulario, nadie podría completar el formulario, y ¡eso es un gran problema! Así que, en vez de esto, el CSS tiende a desbordarse de un modo que sea visible. Es probable que te des cuenta de ese desarreglo, o en el peor de los casos, que un visitante de tu sitio web te informe de que una parte del contenido se superpone y debas arreglarlo.</p>
+
+<p>Si has restringido el tamaño de una caja con una anchura o una altura determinadas, el CSS asume que sabes lo que haces y que gestionas correctamente el potencial de desbordamiento. En general, restringir el tamaño de un bloque es problemático cuando el texto se va a poner en una caja, porque puede haber más texto del que te esperabas al diseñar el sitio o el tamaño del texto puede ser mayor, por ejemplo, si el usuario lo aumenta.</p>
+
+<p>En los artículos siguientes veremos diferentes modos de controlar el tamaño que podrían ser menos propensos a desbordarse. Sin embargo, si necesitas un tamaño fijo, también puedes controlar cómo se comporta el desbordamiento. ¡Sigue leyendo!</p>
+
+<h2 id="La_propiedad_overflow">La propiedad <code>overflow</code></h2>
+
+<p>La propiedad {{cssxref ("overflow")}} es el modo como tomas el control del desbordamiento de un elemento y le dices al navegador cómo desea que se comporte. El valor predeterminado para la propiedad <code>overflow</code> es <code>visible</code>, por lo que, de forma predeterminada vamos a poder ver cuándo se desborda nuestro contenido.</p>
+
+<p>Si deseas cortar el contenido cuando se desborda, puedes establecer el valor <code>overflow: hidden</code> en tu caja, que hace exactamente lo que dice: ocultar el desbordamiento. Esto puede hacer que las cosas desaparezcan, por lo que solo debes utilizar esta opción si ocultar contenido no te va a causar ningún problema.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/overflow/hidden.html", '100%', 600)}}</p>
+
+<p>Quizás te gustaría añadir barras de desplazamiento cuando el contenido se desborde. Si usas <code>overflow: scroll</code>, tu navegador siempre mostrará barras de desplazamiento, incluso cuando no haya suficiente contenido para que pueda desbordarse. Es posible que desees hacer esto, porque evita que aparezcan y desaparezcan barras de desplazamiento según el contenido.</p>
+
+<p><strong>Si en la caja siguiente eliminas parte del contenido, observarás que las barras de desplazamiento permanecen aun sin que haya nada que desplazar (o, como mucho, solo las pistas de la barra de desplazamiento).</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/overflow/scroll.html", '100%', 600)}}</p>
+
+<p>En el ejemplo anterior solo necesitamos desplazarnos en el eje <code>y</code>, sin embargo, obtenemos barras de desplazamiento en ambos ejes. En su lugar, puedes usar la propiedad {{cssxref ("overflow-y")}}, y establecer <code>overflow-y: scroll</code> para poder desplazarte solo por el eje <em>y</em>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/overflow/scroll-y.html", '100%', 600)}}</p>
+
+<p>También puedes desplazarte por el eje <em>x</em> usando {{cssxref ("overflow-x")}}, aunque esta no es una forma recomendada para manejar palabras largas. Si necesitas lidiar con una palabra larga en una caja pequeña, puedes consultar las propiedades {{cssxref ("word-break")}} o {{cssxref ("overflow-wrap")}}. Además, algunos de los métodos expuestos en el artículo <a href="/es/docs/Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS">Elementos de dimensionado en CSS</a> pueden ayudarte a crear cuadros que se adapten mejor a cantidades variables de contenido.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/overflow/scroll-x.html", '100%', 500)}}</p>
+
+<p>Al igual que con el desplazamiento, obtendrás una barra de desplazamiento en la dimensión de desplazamiento independientemente de si hay suficiente contenido para provocar una barra de desplazamiento.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: observa que puedes especificar un desplazamiento en <em>x</em> y en <em>y</em> utilizando la propiedad <code>overflow</code> y pasando dos valores. Si especificas dos palabras clave, la primera se aplica a <code>overflow-x</code> y la segunda a <code>overflow-y</code>. De lo contrario, tanto <code>overflow-x</code> como <code>overflow-y</code> se fijan en el mismo valor. Por ejemplo, <code>overflow: scroll hidden</code> establece <code>overflow-x</code> en <code>scroll</code> y <code>overflow-y</code> en <code>hidden</code>.</p>
+</div>
+
+<p>Si deseas que aparezcan barras de desplazamiento solo si hay más contenido del que cabe en la caja, utiliza <code>overflow: auto</code>. En este caso, el navegador decide si muestra las barras de desplazamiento o no. Los navegadores de escritorio solo suelen hacerlo cuando hay contenido suficiente para causar desbordamiento.</p>
+
+<p><strong>En el ejemplo siguiente, elimina parte del contenido hasta que quepa en la caja y observarás que las barras de desplazamiento desaparecen.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/overflow/auto.html", '100%', 600)}}</p>
+
+<h2 id="overflow_establece_un_contexto_de_formato_de_bloque"><code>overflow</code> establece un contexto de formato de bloque</h2>
+
+<p>En CSS hay un concepto conocido como <strong>block formatting context</strong> o BFC (<em>contexto de formato de bloque</em>). No es algo de lo que debas preocuparte demasiado en este momento, pero es útil saber que cuando usas un valor de <code>overflow</code>, como <code>scroll</code> o <code>auto</code>, creas un BFC. El resultado es que el contenido de la caja al que acabas de cambiar el valor <code>overflow</code> se convierte en un minidiseño propio. Las cosas que están fuera del contenedor no pueden meterse en él, y nada puede sobresalir de esa caja hacia el diseño circundante. Esto es para permitir un comportamiento con desplazamiento, porque para poder crear una experiencia de desplazamiento consistente todo el contenido de tu caja ha de estar contenido en algo, y no puede superponerse con otros elementos de la página.</p>
+
+<h2 id="Desbordamiento_no_deseado_en_diseño_web">Desbordamiento no deseado en diseño web</h2>
+
+<p>Los métodos de diseño modernos (explicados en el módulo <a href="/es/docs/Learn/CSS/CSS_layout">Diseñar con el CSS</a>) gestionan muy bien el desbordamiento. Han sido diseñados para hacer frente al hecho de que tendemos a no poder predecir cuánto contenido habrá en la web. Sin embargo, en el pasado, los desarrolladores a menudo usaban alturas fijas para tratar de alinear los fondos de cajas que en realidad no tenían relación entre sí. Este método era frágil y, en una aplicación heredada, ocasionalmente puede aparecer una caja en que el contenido se superpone a otro contenido de la página. Si ves esto, sabrás que se trata de desbordamiento. Lo ideal sería volver a calcular el diseño para no tener que confiar tamaños de caja fijos.</p>
+
+<p>Al desarrollar un sitio web, siempre debes tener en cuenta los problemas de desbordamiento. Debes probar diseños con cantidades grandes y pequeñas de contenido, aumentar el tamaño de letra... y asegurarte de que tu CSS puede hacerle frente sin ningún problema. Es probable que cambiar el valor de <code>overflow</code> para ocultar contenido o añadir barras de desplazamiento sea algo que debas reservar solo para unos pocos casos especiales, en que realmente desees una caja con barra de desplazamiento, por ejemplo.</p>
+
+<h2 id="Pon_a_prueba_tus_conocimientos">Pon a prueba tus conocimientos</h2>
+
+<p>Hay mucho que absorber en esta lección. ¿Recuerdas la información más importante? Para comprobarlo, ve a <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Overflow_Tasks">Test your skills: overflow</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Este breve artículo ha introducido el concepto de desbordamiento; ahora comprendes que el CSS intenta no hacer invisible el desbordamiento de contenido, porque esto provoca la pérdida de datos. Has descubierto que puedes gestionar el desbordamiento potencial y también que debes probar tu trabajo para asegurarte de que no causa un desbordamiento problemático accidentalmente.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Handling_different_text_directions", "Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Valores y unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Estilo de las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/selectores_css/combinadores/index.html b/files/es/learn/css/building_blocks/selectores_css/combinadores/index.html
deleted file mode 100644
index 54f416456d..0000000000
--- a/files/es/learn/css/building_blocks/selectores_css/combinadores/index.html
+++ /dev/null
@@ -1,111 +0,0 @@
----
-title: Combinadores
-slug: Learn/CSS/Building_blocks/Selectores_CSS/Combinadores
-translation_of: Learn/CSS/Building_blocks/Selectors/Combinators
----
-<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks")}}</p>
-
-<p>Los últimos selectores que veremos son los llamados selectores de combinación. Se llaman así porqué combinan otros selectores de manera que proporciona una relación útil entre ellos y la ubicación del contenido en el documento.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Conocer los diferentes selectores de combinación que se pueden utilizar en el CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Selector_de_descendientes">Selector de descendientes</h2>
-
-<p>Ya hemos visto los selectores de descendientes en artículos anteriores (selectores con espacios entre ellos):</p>
-
-<pre class="brush: css notranslate">body article p</pre>
-
-<p>Estos selectores seleccionan elementos que son descendientes de otros selectores. No es necesario que sean hijos directos.</p>
-
-<p>En el ejemplo siguiente seleccionamos solo el elemento <code>&lt;p&gt;</code> que hay dentro de un elemento con una clase <code>.box</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/descendant.html", '100%', 500)}}</p>
-
-<h2 id="Selector_de_combinación_de_elementos_hijo">Selector de combinación de elementos hijo</h2>
-
-<p>El selector de combinación de elementos hijo es un símbolo de «mayor que» (<code>&gt;</code>), que selecciona solo cuando los selectores identifican elementos que son hijos directos. Los elementos descendientes que se encuentran más abajo en la jerarquía no se seleccionan. Por ejemplo, para seleccionar solo los elementos <code>&lt;p&gt;</code> que son hijos directos de elementos <code>&lt;article&gt;</code>:</p>
-
-<pre class="brush: css notranslate">article &gt; p</pre>
-
-<p>En el ejemplo siguiente hay una lista ordenada anidada dentro de otra lista no ordenada. Utilizamos los selectores de elementos hijo para seleccionar solo los elementos <code>&lt;li&gt;</code> que son hijos directos de <code>&lt;ul&gt;</code> y les aplicamos un borde superior.</p>
-
-<p>Si eliminamos el símbolo <code>&gt;</code> que lo identifica como un selector de elementos hijo, lo convertimos en un selector de elementos descendientes y se aplicará el borde rojo a todos los elementos <code>&lt;li&gt;</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/child.html", '100%', 600)}}</p>
-
-<h2 id="Hermanos_adyacentes">Hermanos adyacentes</h2>
-
-<p>El selector de elementos hermanos adyacentes (<code>+</code>) se utiliza para seleccionar un elemento que se encuentra justo al lado de otro elemento en el mismo nivel de la jerarquía. Por ejemplo, para seleccionar todos los elementos <code>&lt;img&gt;</code> que aparecen justo después de elementos <code>&lt;p&gt;</code>:</p>
-
-<pre class="brush: css notranslate">p + img</pre>
-
-<p>El caso de uso más común es modificar el párrafo que va justo después del título, como en el ejemplo siguiente. Vamos a buscar un párrafo que sea directamente adyacente a <code>&lt;h1&gt;</code> y le vamos a aplicar un estilo.</p>
-
-<p>Si insertas algún otro elemento, como <code>&lt;h2&gt;</code> entre las etiquetas <code>&lt;h1&gt;</code> y <code>&lt;p&gt;</code>, verás que el selector ya no selecciona el párrafo y no se muestra con los mismos colores de fondo y de primer plano que cuando es adyacente.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/adjacent.html", '100%', 800)}}</p>
-
-<h2 id="Hermanos_generales">Hermanos generales</h2>
-
-<p>Si deseas seleccionar los hermanos de un elemento, incluso si no son directamente adyacentes, puedes utilizar el combinador de hermanos general (<code>~</code>). Por ejemplo, para seleccionar todos los elementos <code>&lt;img&gt;</code> que aparecen <em>después</em> de los elementos <code>&lt;p&gt;</code>, hacemos esto:</p>
-
-<pre class="brush: css notranslate">p ~ img</pre>
-
-<p>En el ejemplo siguiente seleccionamos todos los elementos <code>&lt;p&gt;</code> que vienen después de <code>&lt;h1&gt;</code>, y aunque en el documento también hay un <code>&lt;div&gt;</code>, se selecciona incluso la etiqueta <code>&lt;p&gt;</code> que viene después.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/general.html", '100%', 600)}}</p>
-
-<h2 id="El_uso_de_selectores_de_combinación">El uso de selectores de combinación</h2>
-
-<p>Puedes combinar cualquiera de los selectores de los artículos anteriores con selectores de combinación para seleccionar una parte del documento. Por ejemplo, podrías utilizar el código siguiente para seleccionar elementos de una lista con una clase «a» que son hijos directos de <code>&lt;ul&gt;</code>:</p>
-
-<pre class="brush: css notranslate">ul &gt; li[class="a"]  {  }</pre>
-
-<p>Ten cuidado cuando creas largas listas de selectores que seleccionan partes del documento muy específicas. Te será difícil volver a utilizar las reglas CSS porque has definido un selector muy específico para la ubicación del elemento en el marcado.</p>
-
-<p>A menudo es mejor crear una clase sencilla y aplicarla al elemento en cuestión. Dicho esto, tu conocimiento de los selectores de combinación te será muy útil si necesitas modificar algo del documento y no puedes acceder al código HTML (tal vez porque se haya generado a partir de CMS).</p>
-
-<h2 id="Comprueba_tus_habilidades">Comprueba tus habilidades</h2>
-
-<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más importante? Encontrarás más pruebas para verificar que retienes esa información en <a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Selectors_Tasks">Test your skills: Selectors</a>.</p>
-
-<h2 id="Continuamos">Continuamos</h2>
-
-<p>Esta es la última sección de nuestros artículos sobre selectores. A continuación vamos a pasar a otra parte importante del CSS: <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">el modelo de caja CSS</a>.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Elementos de imagen, de media y de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Estilo de las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/selectores_css/index.html b/files/es/learn/css/building_blocks/selectores_css/index.html
deleted file mode 100644
index d0ea61da20..0000000000
--- a/files/es/learn/css/building_blocks/selectores_css/index.html
+++ /dev/null
@@ -1,223 +0,0 @@
----
-title: Selectores CSS
-slug: Learn/CSS/Building_blocks/Selectores_CSS
-translation_of: Learn/CSS/Building_blocks/Selectors
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Cascade_and_inheritance", "Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks")}}</div>
-
-<p class="summary">En {{Glossary( "CSS")}} los selectores se utilizan para delimitar los elementos {{glossary("HTML")}} de nuestra página web a los que queremos aplicar estilo. Hay una amplia variedad de selectores CSS, lo que permite una gran precisión a la hora de seleccionar elementos a los que aplicar estilo. En este artículo y sus subartículos veremos con detalle todos los tipos y el modo como funcionan.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Nociones básicas de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y una idea de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender con detalle cómo funcionan los selectores CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_un_selector">¿Qué es un selector?</h2>
-
-<p>En un artículo anterior explicamos qué son los selectores. Un selector CSS es la primera parte de una regla CSS. Es un patrón de elementos y otros términos que indican al navegador qué elementos HTML se seleccionan para aplicarles una regla que incluye los valores de las propiedades CSS. El elemento o los elementos seleccionados por el selector se denominan <em>sujeto del selector</em>.</p>
-
-<p><img alt="Fragmento de código con el elemento h1 resaltado." src="https://mdn.mozillademos.org/files/16550/selector.png" style="border: 1px solid #cccccc; height: 218px; width: 471px;"></p>
-
-<p>En artículos anteriores ya has visto algunos selectores y has aprendido que hay diversas maneras de organizar el documento. Por ejemplo, seleccionando un elemento, como <code>h1</code>, o seleccionando una clase, como <code>.special</code>.</p>
-
-<p>En CSS, los selectores se definen en la especificación de selectores de CSS correspondiente; al igual que cualquier otro elemento de CSS, es necesario que los navegadores los admitan para que funcionen. La mayoría de los selectores que encontrarás se definen en <a href="https://www.w3.org/TR/selectors-3/">especificación de nivel 3 de selectores</a>, que es una especificación consolidada y, por lo tanto, la mayoría de navegadores admitirán esos selectores.</p>
-
-<h2 id="Listas_de_selectores">Listas de selectores</h2>
-
-<p>Si más de un elemento utiliza el mismo CSS, puedes combinar los selectores en una <em>lista de selectores</em> para que la regla se aplique a cada uno de los selectores individuales. Por ejemplo, si tengo el mismo CSS para un <code>h1</code> y para una clase <code>.special</code>, los puedo escribir como dos reglas separadas.</p>
-
-<pre class="brush: css notranslate"><code>h1 {
-  color: blue;
-}
-
-.special {
-  color: blue;
-} </code></pre>
-
-<p>También los podrías combinar en una lista de selectores, separándolos con una coma.</p>
-
-<pre class="brush: css notranslate"><code>h1, .special {
-  color: blue;
-} </code></pre>
-
-<p>Es posible dejar un espacio en blanco tanto antes como después de la coma. Incluso puede resultar más legible si cada selector se encuentra en una línea distinta.</p>
-
-<pre class="brush: css notranslate"><code>h1,
-.special {
-  color: blue;
-} </code></pre>
-
-<p>En el ejemplo siguiente, intenta combinar los dos selectores de modo que tengan la misma declaración. El aspecto visual debe permanecer igual tras la combinación.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/selector-list.html", '100%', 1000)}} </p>
-
-<p>Cuando agrupas los selectores de esta manera, si alguno de los selectores no es válido, el navegador sencillamente ignora toda la regla.</p>
-
-<p>En el ejemplo siguiente, la regla que corresponde al selector de clase que no es válido se ignora, mientras que el estilo se aplica al elemento <code>h1</code>.</p>
-
-<pre class="brush: css notranslate"><code>h1 {
-  color: blue;
-}
-
-..special {
-  color: blue;
-} </code></pre>
-
-<p>Sin embargo, si se combinan, toda la regla se considera no válida y no se aplicará estilo ni a <code>h1</code> ni a la clase.</p>
-
-<pre class="brush: css notranslate"><code>h1, ..special {
-  color: blue;
-} </code></pre>
-
-<h2 id="Tipos_de_selectores">Tipos de selectores</h2>
-
-<p>Hay diferentes agrupaciones de selectores, y conocer qué tipo de selector necesitas te ayudará a encontrar la herramienta adecuada para tu trabajo. En estos subartículos vamos a ver los diferentes grupos de selectores con más detalle.</p>
-
-<h3 id="Selectores_de_tipo_de_clase_y_de_ID">Selectores de tipo, de clase y de ID</h3>
-
-<p>Este grupo incluye selectores que delimitan un elemento HTML, como por ejemplo un <code>&lt;h1&gt;</code>.</p>
-
-<pre class="brush: css notranslate">h1 { }</pre>
-
-<p>También incluye selectores que delimitan una clase:</p>
-
-<pre class="brush: css notranslate">.box { }</pre>
-
-<p>o un ID:</p>
-
-<pre class="brush: css notranslate">#unique { }</pre>
-
-<h3 id="Selectores_de_atributo">Selectores de atributo</h3>
-
-<p>Este grupo de selectores te proporciona diferentes formas de seleccionar elementos según la presencia de un atributo determinado en un elemento:</p>
-
-<pre class="brush: css notranslate">a[title] { }</pre>
-
-<p>O incluso hacer una selección basada en la presencia de un atributo que tiene un valor particular asignado:</p>
-
-<pre class="brush: css notranslate">a[href="https://example.com"] { }</pre>
-
-<h3 id="Las_pseudoclases_y_los_pseudoelementos">Las pseudoclases y los pseudoelementos</h3>
-
-<p>Este grupo de selectores incluye pseudoclases, que aplican estilo a ciertos estados de un elemento. La pseudoclase <code>:hover</code>, por ejemplo, selecciona un elemento solo cuando se le pasa el ratón por encima.</p>
-
-<pre class="brush: css notranslate">a: hover {}</pre>
-
-<p>También incluye pseudoelementos, que seleccionan una parte determinada de un elemento en vez del elemento en sí. Por ejemplo, <code>::first-line</code> siempre selecciona la primera línea del texto que se encuentra dentro de un elemento (<code>&lt;p&gt;</code>, en el ejemplo siguiente), y actúa como si un elemento <code>&lt;span&gt;</code> hubiera delimitado la primera línea, seleccionado y aplicado estilo.</p>
-
-<pre class="brush: css notranslate">p::first-line { }</pre>
-
-<h3 id="Combinadores">Combinadores</h3>
-
-<p>El último grupo de selectores combina otros selectores con el fin de delimitar elementos de nuestros documentos. El ejemplo siguiente selecciona los párrafos que son hijos directos del elemento <code>&lt;article&gt;</code> utilizando el operador de combinación hijo (<code>&gt;</code>):</p>
-
-<pre class="brush: css notranslate">article &gt; p { }</pre>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<p>Echa un vistazo a esta tabla de referencia de selectores que contiene enlaces directos a los distintos tipos de selectores que se explican en nuestra sección de aprendizaje o en MDN, o bien sigue adelante e inicia tu viaje para averiguar cómo funcionan en <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID">Selectores de tipo, de clase y de ID</a>.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Cascade_and_inheritance", "Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="Tabla_de_referencia_de_selectores">Tabla de referencia de selectores</h2>
-
-<p>La tabla que te mostramos a continuación proporciona una descripción general de los selectores que puedes utilizar junto con enlaces a diversas páginas de esta guía que te mostrarán cómo utilizar cada tipo de selector. También hemos incluido un enlace a la página MDN de cada selector para poder comprobar la información sobre los navegadores que lo admiten. Puedes utilizarlo como referencia para volver cuando necesites buscar los selectores a medida que avanzas con la materia o mientras experimentas con CSS por tu cuenta.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Selector</th>
-   <th scope="col">Ejemplo</th>
-   <th scope="col">Tutorial de aprendizaje de CSS</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Type_selectors">Selector de tipo</a></td>
-   <td><code>h1 {  }</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#Tipos_de_selectores">Los tipos de selectores</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Universal_selectors">Selector universal</a></td>
-   <td><code>* {  }</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#El_selector_universal">El selector universal</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Class_selectors">Selector de clase</a></td>
-   <td><code>.box {  }</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#Selectores_de_clase">Los selectores de clase</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/ID_selectors">Selector de ID</a></td>
-   <td><code>#unique { }</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#Selectores_de_ID">Los selectores de ID</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Selectores_atributo">Selector de atributo</a></td>
-   <td><code>a[title] {  }</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos">Los selectores de atributo</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Pseudo-classes">Pseudoclase</a></td>
-   <td><code>p:first-child { }</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos#%C2%BFQu%C3%A9_es_una_pseudoclase">Las pseudoclases</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Pseudoelementos">Pseudoelemento</a></td>
-   <td><code>p::first-line { }</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos#%C2%BFQu%C3%A9_es_un_pseudoelemento">Los pseudoelementos</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Descendant_combinator">Operadores de combinación descendentes</a></td>
-   <td><code>article p</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Selector_de_descendientes">Operadores de combinación descendentes</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Child_combinator">Operador de combinación de elementos hijo</a></td>
-   <td><code>article &gt; p</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Selector_de_combinaci%C3%B3n_de_elementos_hijo">Operadores de combinación de elementos hijo</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Selectores_hermanos_adyacentes">Operador de combinación de elementos hermanos adyacentes</a></td>
-   <td><code>h1 + p</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Hermanos_adyacentes">Hermanos adyacentes</a></td>
-  </tr>
-  <tr>
-   <td><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Operador de combinación general de elementos hermanos</a></td>
-   <td><code>h1 ~ p</code></td>
-   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Hermanos_generales">Hermanos generales</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/selectores_css/pseudo-clases_y_pseudo-elementos/index.html b/files/es/learn/css/building_blocks/selectores_css/pseudo-clases_y_pseudo-elementos/index.html
deleted file mode 100644
index f48dfdcbd5..0000000000
--- a/files/es/learn/css/building_blocks/selectores_css/pseudo-clases_y_pseudo-elementos/index.html
+++ /dev/null
@@ -1,397 +0,0 @@
----
-title: Pseudoclases y pseudoelementos
-slug: Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos
-translation_of: Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements
----
-<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks")}}</p>
-
-<p>El conjunto de selectores que estudiaremos en este artículo se conocen como <strong>pseudoclases</strong> y <strong>pseudoelementos</strong>. Hay muchos y a menudo sirven para fines muy específicos. Una vez que sepas cómo usarlos, puedes echar un vistazo a la lista para ver si alguno sirve para la página que quieres crear. Una vez más, la página correspondiente de MDN resulta muy útil para conocer qué navegadores los admiten o no.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Obtener información sobre los selectores de pseudoclases y pseudoelementos.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_una_pseudoclase">¿Qué es una pseudoclase?</h2>
-
-<p>Una pseudoclase es un selector que marca los elementos que están en un estado específico, por ejemplo, los que son el primer elemento de su tipo, o aquellos por los que el cursor les pasa por encima. Tienden a actuar como si hubieras aplicado una clase en una parte determinada del documento y, a menudo, ayudan a reducir el exceso de clases y proporcionan un marcado más flexible y fácil de mantener.</p>
-
-<p>Las pseudoclases son palabras clave que comienzan con dos puntos:</p>
-
-<pre class="notranslate">:<em>pseudo-class-name</em></pre>
-
-<h3 id="Ejemplos_simples_de_pseudoclases">Ejemplos simples de pseudoclases</h3>
-
-<p>Echemos un vistazo a algunos ejemplos. Si queremos el primer párrafo de un artículo en letra más grande y en negrita, podemos añadir una clase a ese párrafo y luego añadirle CSS a esa clase, como se muestra en este ejemplo:</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/first-child.html", '100%', 800)}}</p>
-
-<p>Sin embargo, podría ser complicado de mantener. ¿Y si añadiésemos un párrafo nuevo en la parte superior del documento? Habría que mover la clase para que quede antes del nuevo párrafo. En lugar de añadir la clase, podríamos utilizar el selector de pseudoclase {{cssxref(":first-child")}}, que <em>siempre</em> seleccionará el primer elemento hijo del artículo, y de esta forma no tendremos que editar el código HTML (esto no siempre es posible, tal vez debido a que lo genera un CMS).</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/first-child2.html", '100%', 700)}}</p>
-
-<p>Todas las pseudoclases se comportan del mismo modo. Seleccionan un fragmento del documento que está en un estado determinado y se comportan como si se hubiera añadido una clase a su HTML. Echa un vistazo a otros ejemplos en MDN:</p>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/CSS/:last-child">:last-child</a></code></li>
- <li><code><a href="/en-US/docs/Web/CSS/:only-child">:only-child</a></code></li>
- <li><code><a href="/en-US/docs/Web/CSS/:invalid">:invalid</a></code></li>
-</ul>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> Es válido escribir pseudoclases y pseudoelementos sin que les preceda un selector de elemento. En el ejemplo anterior, podría escribirse <code>:first-child</code> y la regla se aplicaríaa cualquier elemento que sea el primer hijo de un elemento <code>&lt;article&gt;</code>, no solo un párrafo primer hijo. <code>:first-child</code> equivale a <code>*:first-child</code>. Pero normalmente se quiere más control y hay que ser más específico.</p>
-</div>
-
-<h3 id="Pseudoclases_de_acción_de_usuario">Pseudoclases de acción de usuario</h3>
-
-<p>Algunas pseudoclases solo intervienen cuando el usuario interactúa con el documento de alguna manera. Estas pseudoclases de <strong>acción de usuario</strong>, que también reciben el nombre de <strong>pseudoclases dinámicas</strong>, actúan como si se añadiese una clase al elemento cuando el usuario interactúa con él. Algunos ejemplos son:</p>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/CSS/:hover">:hover</a></code>: solo interviene si el usuario pasa el cursor sobre un elemento, normalmente un enlace.</li>
- <li><code><a href="/en-US/docs/Web/CSS/:focus">:focus</a></code>: solo interviene si el usuario selecciona el elemento con los controles del teclado.</li>
-</ul>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/hover.html", '100%', 500)}}</p>
-
-<h2 id="¿Qué_es_un_pseudoelemento">¿Qué es un pseudoelemento?</h2>
-
-<p>Los pseudoelementos se comportan de manera similar. Sin embargo, actúan como si hubieras añadido un elemento HTML totalmente nuevo en el marcado, en lugar de haber aplicado una clase nueva a los elementos presentes. Los pseudoelementos empiezan con un doble signo de dos puntos <code>::</code>.</p>
-
-<pre class="notranslate"><em>::pseudo-element-name</em></pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Algunos de los primeros pseudoelementos utilizaban la sintaxis de un solo signo de dos puntos, así que puede ser que en ocasiones los veas escritos de esta forma en algún código o ejemplo. Los navegadores modernos leen tanto los pseudoelementos con la sintaxis de los dos puntos simple como la de los dos puntos doble para garantizar la compatibilidad retrospectiva.</p>
-</div>
-
-<p>Por ejemplo, si deseas seleccionar la primera línea de un párrafo simplemente puedes delimitarlo con el elemento <code>&lt;span&gt;</code> y utilizar un selector de elementos. Sin embargo, fallará si el número de palabras que has delimitado resulta ser más largo o más corto que el ancho del elemento padre. Ya que normalmente no sabemos cuántas palabras caben en una línea porque esto cambia con el ancho de la pantalla o con los cambios de tamaño de la letra, no es posible hacer esto introduciendo solo HTML.</p>
-
-<p>El pseudoelemento <code>::first-line</code> soluciona este problema: no importa si el número de palabras aumenta o disminuye, siempre se selecciona la primera línea.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/first-line.html", '100%', 800)}}</p>
-
-<p>Actúa como si hubiera un elemento <code>&lt;span&gt;</code> mágicamente delimitando esa primera línea, que se actualiza cada vez que la longitud de la línea cambia.</p>
-
-<p>Puedes observar que en ambos párrafos se selecciona la primera línea.</p>
-
-<h2 id="Combinar_pseudoclases_y_pseudoelementos">Combinar pseudoclases y pseudoelementos</h2>
-
-<p>Si quieres poner en negrita la primera línea del primer párrafo, puedes encadenar los selectores <code>:first-child</code> y <code>::first-line</code>. Añade al ejemplo anterior el CSS siguiente. Queremos que se seleccione la primera línea del primer elemento <code>&lt;p&gt;</code> que esté dentro de un elemento <code>&lt;article&gt;</code>.</p>
-
-<pre class="brush: css notranslate"><code>article p:first-child::first-line {
-  font-size: 120%;
-  font-weight: bold;
-}</code></pre>
-
-<h2 id="Generar_contenido_con_before_y_after">Generar contenido con ::before y ::after</h2>
-
-<p>Hay un par de pseudoelementos especiales que se utilizan junto con la propiedad de <code><a href="/en-US/docs/Web/CSS/content">content</a></code> para introducir contenido en el documento usando el CSS.</p>
-
-<p>Puedes utilizarlos para insertar una cadena de texto, como en el ejemplo siguiente. Intenta cambiar el valor del texto de la propiedad {{cssxref("content")}} y observa el cambio en la salida. También puedes cambiar el pseudoelemento <code>::before</code> por <code>::after</code> y verás que el texto se inserta al final del elemento, en lugar de al principio.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/before.html", '100%', 400)}}</p>
-
-<p>Sin embargo, en realidad no es habitual insertar cadenas de texto desde el CSS, porque ese texto resulta inaccesible para algunos lectores de pantalla y puede ser difícil de buscar y modificar en el futuro.</p>
-
-<p>Un uso más adecuado de estos pseudoelementos es insertar un icono. Por ejemplo, la pequeña flecha que añadimos en el ejemplo siguiente es un indicador visual que no queremos que el lector de pantalla muestre:</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/after-icon.html", '100%', 400)}}</p>
-
-<p>Estos pseudoelementos también se utilizan con frecuencia para insertar una cadena vacía a la que luego se le puede aplicar estilo, como a cualquier otro elemento de la página.</p>
-
-<p>En el ejemplo siguiente hemos añadido una cadena vacía mediante el pseudoelemento <code>::before</code>. Le hemos asociado <code>display: block</code> para poder aplicarle estilo para que tenga una anchura y una altura determinadas. A continuación, utilizamos el CSS para aplicar estilo de la misma forma que lo haríamos con cualquier otro elemento. Juega con el CSS y cambia la forma en que se ve y se comporta.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/before-styled.html", '100%', 500)}}</p>
-
-<p>El uso de los pseudoelementos <code>::before</code> y <code>::after</code>, junto con la propiedad <code>content</code> se conoce como «contenido generado» en CSS, y verás que esta técnica se utiliza a menudo para diversas tareas. Un buen ejemplo es la página web <a href="http://www.cssarrowplease.com/">CSS Arrow Please</a>, que te ayuda a generar una flecha con CSS. Echa un vistazo al CSS a medida que creas tu flecha y verás cómo funcionan los pseudoelementos {{cssxref("::before")}} y {{cssxref("::after")}}. Cada vez que veas estos selectores, echa un vistazo a la propiedad {{cssxref("content")}} para ver qué se añade al documento.</p>
-
-<h2 id="Sección_de_referencia">Sección de referencia</h2>
-
-<p>Hay un gran número de pseudoclases y pseudoelementos, así que resulta útil tener una lista para ir consultándolos. A continuación encontrarás un par de tablas con enlaces a sus páginas de referencia en MDN. Tómalas como referencia para ver de qué dispones para seleccionar qué tipos de elementos.</p>
-
-<h3 id="Las_pseudoclases">Las pseudoclases</h3>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Selector</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{ Cssxref(":active") }}</td>
-   <td>Selecciona un elemento cuando el usuario lo activa (por ejemplo, con un clic).</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":any-link") }}</td>
-   <td>Selecciona los estados <code>:link</code> y <code>:visited</code> de un enlace.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":blank") }}</td>
-   <td>Selecciona un <a href="/es/docs/Web/HTML/Elemento/input">elemento <code>&lt;input&gt;</code></a> cuyo valor de entrada está vacío.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":checked") }}</td>
-   <td>Selecciona un botón de opción o casilla de verificación en el estado que determines.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":current") }}</td>
-   <td>Selecciona el elemento que se muestra en ese momento, o un ancestro de ese elemento.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":default") }}</td>
-   <td>Selecciona uno o más elementos de interfaz de usuario cuyo valor es el predeterminado de entre un conjunto de elementos similares.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":dir") }}</td>
-   <td>Selecciona un elemento según su direccionalidad (valor del atributo <code><a href="/en-US/docs/Web/HTML/Global_attributes/dir">dir</a></code> de HTML o propiedad <code><a href="/en-US/docs/Web/CSS/direction">direction</a></code> de CSS).</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":disabled") }}</td>
-   <td>Selecciona elementos de la interfaz de usuario que están en estado inactivo.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":empty") }}</td>
-   <td>Selecciona un elemento que no tiene elementos hijo, excepto por algún espacio en blanco opcional.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":enabled") }}</td>
-   <td>Selecciona elementos de la interfaz de usuario que están en estado activo.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":first") }}</td>
-   <td>En <a href="/en-US/docs/Web/CSS/Paged_Media">Paged Media</a>, selecciona la primera página.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":first-child") }}</td>
-   <td>Selecciona el primero entre elementos hermanos.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":first-of-type") }}</td>
-   <td>Selecciona el primero entre un tipo determinado de elementos hermanos.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":focus") }}</td>
-   <td>Selecciona el elemento que tiene el foco.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":focus-visible")}}</td>
-   <td>Selecciona el elemento que tiene el foco cuando el foco tiene que estar visible para el usuario.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":focus-within") }}</td>
-   <td>Selecciona el elemento que tiene el foco y el elemento con un descendiente que tiene el foco.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":future") }}</td>
-   <td>Selecciona los elementos que van después del elemento en curso.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":hover") }}</td>
-   <td>Selecciona un elemento cuando el usuario interactúa con él.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":indeterminate") }}</td>
-   <td>Selecciona elementos de interfaz de usuario cuyo valor está en un estado no determinado, por lo general se trata de <a href="/es/docs/Web/HTML/Elemento/input/checkbox">casillas de verificación</a>.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":in-range") }}</td>
-   <td>Selecciona un elemento cuyo valor se encuentra dentro de un rango de valores determinado.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":invalid") }}</td>
-   <td>Selecciona un elemento, como por ejemplo un <code>&lt;input&gt;</code>, cuyo estado es no válido.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":lang") }}</td>
-   <td>Selecciona un elemento según el idioma (valor del atributo <a href="/es/docs/Web/HTML/Atributos_Globales/lang">lang</a> de HTML).</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":last-child") }}</td>
-   <td>Selecciona el último elemento de entre sus elementos hermanos.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":last-of-type") }}</td>
-   <td>Selecciona el último de entre los elementos hermanos de un tipo determinado.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":left") }}</td>
-   <td>En <a href="/en-US/docs/Web/CSS/CSS_Pages">Paged Media</a> selecciona las páginas de la izquierda.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":link")}}</td>
-   <td>Selecciona los enlaces no visitados.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":local-link")}}</td>
-   <td>Selecciona los enlaces que dirigen a páginas que se encuentran en la misma página web que el documento activo.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":is", ":is()")}}</td>
-   <td>Selecciona cualquiera de los selectores de la lista de selección que se pase como valor de este selector.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":not") }}</td>
-   <td>Selecciona elementos que otros selectores no han seleccionado antes y que se han pasado como valor de este selector.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":nth-child") }}</td>
-   <td>Selecciona elementos de entre una lista de elementos hermanos. Los elementos hermanos están relacionados por una fórmula del tipo <var>an + b</var> (por ejemplo, 2<var>n</var> + 1 seleccionaría los elementos 1, 3, 5, 7, etc., es decir, todos los impares).</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":nth-of-type") }}</td>
-   <td>Selecciona elementos de entre una lista de elementos hermanos de un tipo determinado (por ejemplo, todos los elementos <code>&lt;p&gt;</code>). Los elementos hermanos están relacionados por una fórmula del tipo <var>an + b</var> (por ejemplo, 2<var>n</var> + 1 relacionaría en la secuencia ese tipo de elementos, los números 1, 3, 5, 7, etc., es decir, todos los impares).</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":nth-last-child") }}</td>
-   <td>Selecciona elementos de entre una lista de elementos hermanos, contando hacia atrás desde el final. Los elementos hermanos están relacionados por una fórmula del tipo <var>an+b</var> (por ejemplo, 2<var>n<var> <em>+ 1 r</em>elacionaría en la secuencia el último de los elementos de este tipo con el que se encuentra dos por delante, y así sucesivamente. Todos los impares, contando desde el final).</var></var></td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":nth-last-of-type") }}</td>
-   <td>Selecciona los elementos de entre una lista de elementos hermanos que son de un tipo determinado (por ejemplo, elementos <code>&lt;p&gt;</code>), contando hacia atrás desde el final. Los elementos hermanos están relacionados por una fórmula del tipo <var>an+b</var> (por ejemplo, 2<var>n</var> + 1 relacionaría en la secuencia el último de los elementos de ese tipo con el que se encuentra dos por delante, y así sucesivamente. Todos los impares, contando desde el final).</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":only-child") }}</td>
-   <td>Selecciona un elemento que no tiene elementos hermanos.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":only-of-type") }}</td>
-   <td>Selecciona un elemento que es el único de su tipo entre sus elementos hermanos.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":optional") }}</td>
-   <td>Selecciona los elementos de formulario que son innecesarios.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":out-of-range") }}</td>
-   <td>Selecciona un elemento cuyo valor está fuera de rango.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":past") }}</td>
-   <td>Selecciona los elementos que se encuentran antes del elemento activo.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":placeholder-shown") }}</td>
-   <td>Selecciona el elemento de entrada que muestra texto de marcador de posición.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":playing") }}</td>
-   <td>Selecciona un elemento que representa un audio, un vídeo o un recurso similar que se puede «reproducir» o «pausar», cuando el elemento está «en reproducción».</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":paused") }}</td>
-   <td>Selecciona un elemento que representa un audio, un vídeo o un recurso similar que se puede “«reproducir» o «pausar» cuando el elemento está «pausado».</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":read-only") }}</td>
-   <td>Selecciona los elementos que el usuario no puede modificar.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":read-write") }}</td>
-   <td>Selecciona los elementos que el usuario puede modificar.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":required") }}</td>
-   <td>Selecciona los elementos de formulario que son necesarios.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":right") }}</td>
-   <td>En <a href="/en-US/docs/Web/CSS/CSS_Pages">Paged Media</a> selecciona las páginas de la derecha.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":root") }}</td>
-   <td>Selecciona un elemento que es la raíz del documento.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":scope") }}</td>
-   <td>Selecciona cualquier elemento de ámbito.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":valid") }}</td>
-   <td>Selecciona un elemento como <code>&lt;input&gt;</code>, en un estado válido.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":target") }}</td>
-   <td>Selecciona el elemento al que apunta la URL activa (es decir, cuyo ID coincide con el <a href="https://en.wikipedia.org/wiki/Fragment_identifier">identificador de fragmento de la URL</a> activo).</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref(":visited") }}</td>
-   <td>Selecciona los enlaces visitados.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Pseudoelementos">Pseudoelementos</h3>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Selector</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{ Cssxref("::after") }}</td>
-   <td>Selecciona el elemento al que se puede aplicar estilo que aparece a continuación del contenido del elemento que lo origina.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref("::before") }}</td>
-   <td>Selecciona el elemento al que se puede aplicar estilo que aparece antes del contenido del elemento que lo origina.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref("::first-letter") }}</td>
-   <td>Selecciona la primera letra del elemento.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref("::first-line") }}</td>
-   <td>Selecciona la primera línea del elemento de contenido.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref("::grammar-error") }}</td>
-   <td>Selecciona una parte del documento que contiene un error de gramática indicado por el navegador.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref("::selection") }}</td>
-   <td>Selecciona la parte del documento que ha sido seleccionada.</td>
-  </tr>
-  <tr>
-   <td>{{ Cssxref("::spelling-error") }}</td>
-   <td>Selecciona una parte del documento que contiene un error de ortografía indicado por el navegador.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Elementos de imagen, de media y de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/selectores_css/selectores_de_atributos/index.html b/files/es/learn/css/building_blocks/selectores_css/selectores_de_atributos/index.html
deleted file mode 100644
index 057c38c18d..0000000000
--- a/files/es/learn/css/building_blocks/selectores_css/selectores_de_atributos/index.html
+++ /dev/null
@@ -1,154 +0,0 @@
----
-title: Selectores de atributo
-slug: Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos
-translation_of: Learn/CSS/Building_blocks/Selectors/Attribute_selectors
----
-<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks")}}</p>
-
-<p>Como ya explicamos en los artículos de HTML, los elementos pueden tener atributos que proporcionan un nivel de detalle mayor sobre el elemento que delimitan. En el CSS puedes utilizar selectores de atributo para seleccionar elementos definidos con unos atributos determinados. En este artículo veremos cómo utilizar estos selectores tan útiles.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender a identificar y utilizar selectores de atributo.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Selectores_de_presencia_y_valor">Selectores de presencia y valor</h2>
-
-<p>Estos selectores permiten seleccionar un elemento solo a partir de la presencia de un atributo (por ejemplo <code>href</code>) o a partir de varias coincidencias diferentes con respecto al valor del atributo.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Selector</th>
-   <th scope="col">Ejemplo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>[<em>attr</em>]</code></td>
-   <td><code>a[title]</code></td>
-   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em> (el valor que se indica entre corchetes).</td>
-  </tr>
-  <tr>
-   <td><code>[<em>attr</em>=<em>value</em>]</code></td>
-   <td><code>a[href="https://example.com"]</code></td>
-   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor es exactamente el mismo, <em>value</em> (la cadena de caracteres que se indica entre corchetes).</td>
-  </tr>
-  <tr>
-   <td><code>[<em>attr</em>~=<em>value</em>]</code></td>
-   <td><code>p[class~="special"]</code></td>
-   <td>
-    <p>Relaciona los elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor es exactamente <em>value</em>, o los elementos con un mismo atributo <em>attr</em> que contiene uno o más valores de los cuales, al menos uno, coincide con <em>value</em>.</p>
-
-    <p>Ten en cuenta que en una lista que incluya más de un valor, los distintos valores se separan con un espacio.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>[<em>attr</em>|=<em>value</em>]</code></td>
-   <td><code>div[lang|="zh"]</code></td>
-   <td>Relaciona los elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor puede ser exactamente <em>value</em> o puede comenzar con <em>value</em> seguido inmediatamente por un guion.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>En el ejemplo siguiente puedes observar cómo se utilizan estos selectores.</p>
-
-<ul>
- <li>Mediante el uso de <code>li[class]</code> podemos relacionar cualquier selector con un atributo de clase. Los relaciona todos menos el primer elemento de la lista.</li>
- <li><code>li[class="a"]</code> relaciona un selector con una clase de <code>a</code>, pero no un selector con una clase de <code>a</code> con otra clase separada por un espacio como parte del valor. Selecciona el segundo elemento de la lista.</li>
- <li><code>li[class~="a"]</code> coincidirá con una clase <code>a</code> pero también con un valor que contenga la clase de <code>a</code> como parte de una lista de elementos separados por un espacio. Selecciona el segundo y el tercer elemento de la lista.</li>
-</ul>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/attribute.html", '100%', 800)}}</p>
-
-<h2 id="Selectores_coincidentes_con_subcadenas">Selectores coincidentes con subcadenas</h2>
-
-<p>Estos selectores permiten un tipo más avanzado de relación entre las subcadenas de caracteres que constituyen el valor del atributo. Por ejemplo, si tienes las clases <code>box-warning</code> y <code>box-error</code> y quieres encontrar todos los elementos que empiezan con la cadena de caracteres “box-”, puedes seleccionarlas ambas con <code>[class^="box-"]</code>.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Selector</th>
-   <th scope="col">Ejemplo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>[<em>attr</em>^=<em>value</em>]</code></td>
-   <td><code>li[class^="box-"]</code></td>
-   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor empieza exactamente con la subcadena de caracteres <em>value</em>.</td>
-  </tr>
-  <tr>
-   <td><code>[<em>attr</em>$=<em>value</em>]</code></td>
-   <td><code>li[class$="-box"]</code></td>
-   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor termina exactamente con la subcadena de caracteres <em>value</em>.</td>
-  </tr>
-  <tr>
-   <td><code>[<em>attr</em>*=<em> </em>]</code></td>
-   <td><code>li[class*="box"]</code></td>
-   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor incluye al menos una ocurrencia de la subcadena <em>value</em> en algún punto de la cadena.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>El ejemplo siguiente muestra cómo se usan estos selectores:</p>
-
-<ul>
- <li><code>li[class^="a"]</code> relaciona cualquier valor de atributo que empieza con <code>a</code>; luego, relaciona los dos primeros elementos de la lista se verán iguales.</li>
- <li><code>li[class$="a"]</code> relaciona cualquier valor de atributo que termina con <code>a</code>; luego, relaciona el primer y el tercer elemento de la lista.</li>
- <li><code>li[class*="a"]</code> relaciona cualquier valor de atributo que contiene <code>a</code> en cualquier posición; luego, relaciona todos los elementos de la lista.</li>
-</ul>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/attribute-substring.html", '100%', 800)}}</p>
-
-<h2 id="Mayúsculas_y_minúsculas">Mayúsculas y minúsculas</h2>
-
-<p>Si quieres relacionar los valores de atributo tanto si están escritos en mayúsculas como en minúsculas, puedes utilizar el valor <code>i</code> antes del paréntesis de cierre. Este indicador informa al navegador de que debe relacionar todos los caracteres ASCII independientemente de si las letras son mayúsculas o minúsculas. Sin este indicador, los valores se relacionarán según las directrices del lenguaje del documento con respecto a la distinción entre mayúsculas y minúsculas; en el caso del HTML, se distinguirá entre mayúsculas y minúsculas.</p>
-
-<p>En el ejemplo siguiente, el primer selector relaciona valores que empiezan con <code>a</code>; luego, solo coincide el primer elemento de la lista porque los otros dos comienzan con una A mayúscula. El segundo selector utiliza el indicador de no distinción entre mayúsculas y minúsculas, así que relaciona todos los elementos de la lista.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/attribute-case.html", '100%', 800)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Recientemente se ha creado un valor <code>s</code>, que obliga a establecer la distinción de mayúsculas y minúsculas en contextos en que no se suele establecer esta distinción. Sin embargo, pocos navegadores lo utilizan y no resulta demasiado útil en un contexto HTML.</p>
-</div>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<p>Ahora que hemos terminado con los selectores de atributo, puedes avanzar al artículo siguiente y leer acerca de los <a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">selectores de pseudoclases y pseudoelementos</a>.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/selectores_css/selectores_de_tipo_clase_e_id/index.html b/files/es/learn/css/building_blocks/selectores_css/selectores_de_tipo_clase_e_id/index.html
deleted file mode 100644
index 01b3963f8a..0000000000
--- a/files/es/learn/css/building_blocks/selectores_css/selectores_de_tipo_clase_e_id/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: 'Selectores de tipo, clase e ID'
-slug: Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID
-translation_of: Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors
----
-<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks")}}</p>
-
-<p>En este artículo vamos a echar un vistazo a los selectores más simples de que dispones y que seguramente serán los que utilices con mayor frecuencia.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Conocer los diferentes selectores CSS que podemos utilizar para aplicar CSS a un documento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Tipos_de_selectores">Tipos de selectores</h2>
-
-<p>Un <strong>selector de tipo</strong> también recibe el nombre de <em>selector de nombre de etiqueta</em> o <em>selector de elemento</em> porque selecciona un elemento/etiqueta HTML del documento. En el ejemplo siguiente hemos utilizado los selectores span, em y strong. Se aplica estilo a todas las instancias de los elementos <code>&lt;span&gt;</code>, <code>&lt;em&gt;</code> y <code>&lt;strong&gt;</code>.</p>
-
-<p><strong>Trata de añadir una regla CSS que seleccione el elemento <code>&lt;h1&gt;</code> y cambie su color para que se vea azul.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/type.html", '100%', 1100)}}</p>
-
-<h2 id="El_selector_universal">El selector universal</h2>
-
-<p>El selector universal se indica con un asterisco (<code>*</code>) y selecciona todos los elementos del documento (o del elemento padre si está encadenado con otro elemento y un operador de combinación descendente, por ejemplo). En el ejemplo siguiente hemos utilizado el selector universal para eliminar los márgenes en todos los elementos. Esto significa que en lugar de la opción predeterminada de aplicación de estilos del navegador, que muestra los títulos de encabezado y los párrafos separados por un margen de respeto, todo se mostrará pegado y no resultará tan fácil distinguir los diversos párrafos.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/universal.html", '100%', 750)}}</p>
-
-<p>Es posible observar este tipo de comportamiento en las «hojas de estilo de puesta a cero» (o «hojas de estilo <em>reset</em>»), que anulan el formato del navegador. Fueron muy populares en un momento dado; sin embargo, excluir todo el estilo significa que luego tienes que ponerlo todo de nuevo. Por este motivo tendemos a utilizar el selector universal con mucho cuidado, y para situaciones muy específicas como la que se describe a continuación.</p>
-
-<h3 id="Uso_del_selector_universal_para_facilitar_la_legibilidad_de_tus_selectores">Uso del selector universal para facilitar la legibilidad de tus selectores</h3>
-
-<p>Uno de los usos del selector universal es facilitar la legibilidad de los selectores y clarificar sus funciones. Por ejemplo, si quiero seleccionar el primer elemento hijo de cualquier elemento <code>&lt;article&gt;</code> y poner ese elemento, cualquiera que sea, en negrita, puedo utilizar el selector {{cssxref(":first-child")}}, que veremos con mayor detalle más adelante en el artículo de <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos">pseudoclases y pseudoelementos</a>, como selector descendente junto con el selector de elemento <code>&lt;article&gt;</code>: </p>
-
-<pre class="brush: css notranslate">article :first-child {
-
-}</pre>
-
-<p>Sin embargo, esto podría confundirse con <code>article:first-child</code>, que selecciona cualquier elemento <code>&lt;article&gt;</code> que sea el primer elemento hijo de otro elemento.</p>
-
-<p>Para evitar esta confusión podemos añadir al selector <code>:first-child</code> el selector universal. De este modo la función del selector resulta obvia: seleccionará <em>cualquier</em> elemento que entre en la jerarquía de primer hijo de un elemento <code>&lt;article&gt;</code>:</p>
-
-<pre class="brush: css notranslate">article *:first-child {
-
-} </pre>
-
-<h2 id="Selectores_de_clase">Selectores de clase</h2>
-
-<p>El selector de clase comienza con un punto (<code>.</code>) y selecciona todo elemento del documento que esté afectado por esa clase. En el ejemplo siguiente hemos creado una clase llamada <code>.highlight</code> y la hemos aplicado en varios lugares del documento. Todos los elementos a los que se aplique esta clase se resaltarán en amarillo.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/class.html", '100%', 750)}}</p>
-
-<h3 id="Delimitación_de_clases_en_elementos_particulares">Delimitación de clases en elementos particulares</h3>
-
-<p>Puedes crear un selector que seleccionará los elementos concretos que estén afectados por esa clase. En el ejemplo siguiente vamos a introducir un resaltado en un elemento <code>&lt;span&gt;</code> con una clase <code>highlight</code> del de los títulos <code>&lt;h1&gt;</code> con clase <code>highlight</code>. Para ello hay que anexar esa clase al selector de tipo correspondiente al elemento que queremos delimitar, sin dejar entre ellos ningún espacio.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/class-type.html", '100%', 750)}}</p>
-
-<p>Este enfoque hace el elemento CSS menos reutilizable porque la clase solo se aplicará a ese elemento en particular y tendrás que agregar otro selector en caso que quieras que las normas también se apliquen a otros elementos.</p>
-
-<h3 id="Delimitar_un_elemento_afectado_por_más_de_una_clase">Delimitar un elemento afectado por más de una clase</h3>
-
-<p>Puedes aplicar más de una clase a un elemento y delimitarlos de forma individual o seleccionar el elemento cuando todas las clases están presentes en el selector. Puede ser útil cuando se trabaja con componentes que se pueden combinar de maneras diferentes en tu página web.</p>
-
-<p>En el ejemplo siguiente hay un elemento <code>&lt;div&gt;</code> que contiene una nota. El borde gris se aplica cuando la caja tiene una clase <code>notebox</code>. Si además tiene una clase <code>warning</code> o <code>danger</code>, la propiedad {{cssxref("border-color")}} cambia.</p>
-
-<p>Para decirle al navegador que solo queremos seleccionar el elemento si incluye todas estas clases, las encadenamos juntas sin ningún espacio entre ellas.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/class-many.html", '100%', 900)}}</p>
-
-<h2 id="Selectores_de_ID">Selectores de ID</h2>
-
-<p>Un selector de ID comienza con un carácter <code>#</code> en lugar de un punto, pero se utiliza básicamente de la misma manera que un selector de clase. Sin embargo, un ID se puede utilizar una sola vez en cada documento, y a cada elemento solo se le puede aplicar un único <code>id</code>. Puede seleccionar un elemento que tenga propiedad <code>id</code> y ese ID puede ir precedido de un selector de tipo que seleccionará el elemento solo si el elemento y el ID coinciden. En el ejemplo siguiente puedes ver todos estos usos:</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/selectors/id.html", '100%', 750)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Como aprendimos en el artículo sobre la especificidad, un ID tiene una especificidad muy alta y anula la mayoría de los otros selectores. Esto puede dificultar su uso. En la mayoría de los casos es preferible añadir una clase al elemento en lugar de utilizar un ID. Sin embargo, si el ID es la única manera de seleccionar el elemento (tal vez porque no tengas acceso al marcado y, por lo tanto, no lo puedes editar) no hay ningún problema en utilizarlo.</p>
-</div>
-
-<h2 id="En_el_próximo_artículo">En el próximo artículo</h2>
-
-<p>Seguiremos con la descripción de los selectores examinando los <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos">selectores de atributo</a>.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/selectors/attribute_selectors/index.html b/files/es/learn/css/building_blocks/selectors/attribute_selectors/index.html
new file mode 100644
index 0000000000..fc106ec303
--- /dev/null
+++ b/files/es/learn/css/building_blocks/selectors/attribute_selectors/index.html
@@ -0,0 +1,155 @@
+---
+title: Selectores de atributo
+slug: Learn/CSS/Building_blocks/Selectors/Attribute_selectors
+translation_of: Learn/CSS/Building_blocks/Selectors/Attribute_selectors
+original_slug: Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos
+---
+<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks")}}</p>
+
+<p>Como ya explicamos en los artículos de HTML, los elementos pueden tener atributos que proporcionan un nivel de detalle mayor sobre el elemento que delimitan. En el CSS puedes utilizar selectores de atributo para seleccionar elementos definidos con unos atributos determinados. En este artículo veremos cómo utilizar estos selectores tan útiles.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender a identificar y utilizar selectores de atributo.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Selectores_de_presencia_y_valor">Selectores de presencia y valor</h2>
+
+<p>Estos selectores permiten seleccionar un elemento solo a partir de la presencia de un atributo (por ejemplo <code>href</code>) o a partir de varias coincidencias diferentes con respecto al valor del atributo.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Selector</th>
+   <th scope="col">Ejemplo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>[<em>attr</em>]</code></td>
+   <td><code>a[title]</code></td>
+   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em> (el valor que se indica entre corchetes).</td>
+  </tr>
+  <tr>
+   <td><code>[<em>attr</em>=<em>value</em>]</code></td>
+   <td><code>a[href="https://example.com"]</code></td>
+   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor es exactamente el mismo, <em>value</em> (la cadena de caracteres que se indica entre corchetes).</td>
+  </tr>
+  <tr>
+   <td><code>[<em>attr</em>~=<em>value</em>]</code></td>
+   <td><code>p[class~="special"]</code></td>
+   <td>
+    <p>Relaciona los elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor es exactamente <em>value</em>, o los elementos con un mismo atributo <em>attr</em> que contiene uno o más valores de los cuales, al menos uno, coincide con <em>value</em>.</p>
+
+    <p>Ten en cuenta que en una lista que incluya más de un valor, los distintos valores se separan con un espacio.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>[<em>attr</em>|=<em>value</em>]</code></td>
+   <td><code>div[lang|="zh"]</code></td>
+   <td>Relaciona los elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor puede ser exactamente <em>value</em> o puede comenzar con <em>value</em> seguido inmediatamente por un guion.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>En el ejemplo siguiente puedes observar cómo se utilizan estos selectores.</p>
+
+<ul>
+ <li>Mediante el uso de <code>li[class]</code> podemos relacionar cualquier selector con un atributo de clase. Los relaciona todos menos el primer elemento de la lista.</li>
+ <li><code>li[class="a"]</code> relaciona un selector con una clase de <code>a</code>, pero no un selector con una clase de <code>a</code> con otra clase separada por un espacio como parte del valor. Selecciona el segundo elemento de la lista.</li>
+ <li><code>li[class~="a"]</code> coincidirá con una clase <code>a</code> pero también con un valor que contenga la clase de <code>a</code> como parte de una lista de elementos separados por un espacio. Selecciona el segundo y el tercer elemento de la lista.</li>
+</ul>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/attribute.html", '100%', 800)}}</p>
+
+<h2 id="Selectores_coincidentes_con_subcadenas">Selectores coincidentes con subcadenas</h2>
+
+<p>Estos selectores permiten un tipo más avanzado de relación entre las subcadenas de caracteres que constituyen el valor del atributo. Por ejemplo, si tienes las clases <code>box-warning</code> y <code>box-error</code> y quieres encontrar todos los elementos que empiezan con la cadena de caracteres “box-”, puedes seleccionarlas ambas con <code>[class^="box-"]</code>.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Selector</th>
+   <th scope="col">Ejemplo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>[<em>attr</em>^=<em>value</em>]</code></td>
+   <td><code>li[class^="box-"]</code></td>
+   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor empieza exactamente con la subcadena de caracteres <em>value</em>.</td>
+  </tr>
+  <tr>
+   <td><code>[<em>attr</em>$=<em>value</em>]</code></td>
+   <td><code>li[class$="-box"]</code></td>
+   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor termina exactamente con la subcadena de caracteres <em>value</em>.</td>
+  </tr>
+  <tr>
+   <td><code>[<em>attr</em>*=<em> </em>]</code></td>
+   <td><code>li[class*="box"]</code></td>
+   <td>Relaciona elementos con un mismo nombre de atributo, <em>attr</em>, cuyo valor incluye al menos una ocurrencia de la subcadena <em>value</em> en algún punto de la cadena.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>El ejemplo siguiente muestra cómo se usan estos selectores:</p>
+
+<ul>
+ <li><code>li[class^="a"]</code> relaciona cualquier valor de atributo que empieza con <code>a</code>; luego, relaciona los dos primeros elementos de la lista se verán iguales.</li>
+ <li><code>li[class$="a"]</code> relaciona cualquier valor de atributo que termina con <code>a</code>; luego, relaciona el primer y el tercer elemento de la lista.</li>
+ <li><code>li[class*="a"]</code> relaciona cualquier valor de atributo que contiene <code>a</code> en cualquier posición; luego, relaciona todos los elementos de la lista.</li>
+</ul>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/attribute-substring.html", '100%', 800)}}</p>
+
+<h2 id="Mayúsculas_y_minúsculas">Mayúsculas y minúsculas</h2>
+
+<p>Si quieres relacionar los valores de atributo tanto si están escritos en mayúsculas como en minúsculas, puedes utilizar el valor <code>i</code> antes del paréntesis de cierre. Este indicador informa al navegador de que debe relacionar todos los caracteres ASCII independientemente de si las letras son mayúsculas o minúsculas. Sin este indicador, los valores se relacionarán según las directrices del lenguaje del documento con respecto a la distinción entre mayúsculas y minúsculas; en el caso del HTML, se distinguirá entre mayúsculas y minúsculas.</p>
+
+<p>En el ejemplo siguiente, el primer selector relaciona valores que empiezan con <code>a</code>; luego, solo coincide el primer elemento de la lista porque los otros dos comienzan con una A mayúscula. El segundo selector utiliza el indicador de no distinción entre mayúsculas y minúsculas, así que relaciona todos los elementos de la lista.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/attribute-case.html", '100%', 800)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Recientemente se ha creado un valor <code>s</code>, que obliga a establecer la distinción de mayúsculas y minúsculas en contextos en que no se suele establecer esta distinción. Sin embargo, pocos navegadores lo utilizan y no resulta demasiado útil en un contexto HTML.</p>
+</div>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<p>Ahora que hemos terminado con los selectores de atributo, puedes avanzar al artículo siguiente y leer acerca de los <a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">selectores de pseudoclases y pseudoelementos</a>.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/selectors/combinators/index.html b/files/es/learn/css/building_blocks/selectors/combinators/index.html
new file mode 100644
index 0000000000..b6c2f0a5bf
--- /dev/null
+++ b/files/es/learn/css/building_blocks/selectors/combinators/index.html
@@ -0,0 +1,112 @@
+---
+title: Combinadores
+slug: Learn/CSS/Building_blocks/Selectors/Combinators
+translation_of: Learn/CSS/Building_blocks/Selectors/Combinators
+original_slug: Learn/CSS/Building_blocks/Selectores_CSS/Combinadores
+---
+<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks")}}</p>
+
+<p>Los últimos selectores que veremos son los llamados selectores de combinación. Se llaman así porqué combinan otros selectores de manera que proporciona una relación útil entre ellos y la ubicación del contenido en el documento.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Conocer los diferentes selectores de combinación que se pueden utilizar en el CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Selector_de_descendientes">Selector de descendientes</h2>
+
+<p>Ya hemos visto los selectores de descendientes en artículos anteriores (selectores con espacios entre ellos):</p>
+
+<pre class="brush: css notranslate">body article p</pre>
+
+<p>Estos selectores seleccionan elementos que son descendientes de otros selectores. No es necesario que sean hijos directos.</p>
+
+<p>En el ejemplo siguiente seleccionamos solo el elemento <code>&lt;p&gt;</code> que hay dentro de un elemento con una clase <code>.box</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/descendant.html", '100%', 500)}}</p>
+
+<h2 id="Selector_de_combinación_de_elementos_hijo">Selector de combinación de elementos hijo</h2>
+
+<p>El selector de combinación de elementos hijo es un símbolo de «mayor que» (<code>&gt;</code>), que selecciona solo cuando los selectores identifican elementos que son hijos directos. Los elementos descendientes que se encuentran más abajo en la jerarquía no se seleccionan. Por ejemplo, para seleccionar solo los elementos <code>&lt;p&gt;</code> que son hijos directos de elementos <code>&lt;article&gt;</code>:</p>
+
+<pre class="brush: css notranslate">article &gt; p</pre>
+
+<p>En el ejemplo siguiente hay una lista ordenada anidada dentro de otra lista no ordenada. Utilizamos los selectores de elementos hijo para seleccionar solo los elementos <code>&lt;li&gt;</code> que son hijos directos de <code>&lt;ul&gt;</code> y les aplicamos un borde superior.</p>
+
+<p>Si eliminamos el símbolo <code>&gt;</code> que lo identifica como un selector de elementos hijo, lo convertimos en un selector de elementos descendientes y se aplicará el borde rojo a todos los elementos <code>&lt;li&gt;</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/child.html", '100%', 600)}}</p>
+
+<h2 id="Hermanos_adyacentes">Hermanos adyacentes</h2>
+
+<p>El selector de elementos hermanos adyacentes (<code>+</code>) se utiliza para seleccionar un elemento que se encuentra justo al lado de otro elemento en el mismo nivel de la jerarquía. Por ejemplo, para seleccionar todos los elementos <code>&lt;img&gt;</code> que aparecen justo después de elementos <code>&lt;p&gt;</code>:</p>
+
+<pre class="brush: css notranslate">p + img</pre>
+
+<p>El caso de uso más común es modificar el párrafo que va justo después del título, como en el ejemplo siguiente. Vamos a buscar un párrafo que sea directamente adyacente a <code>&lt;h1&gt;</code> y le vamos a aplicar un estilo.</p>
+
+<p>Si insertas algún otro elemento, como <code>&lt;h2&gt;</code> entre las etiquetas <code>&lt;h1&gt;</code> y <code>&lt;p&gt;</code>, verás que el selector ya no selecciona el párrafo y no se muestra con los mismos colores de fondo y de primer plano que cuando es adyacente.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/adjacent.html", '100%', 800)}}</p>
+
+<h2 id="Hermanos_generales">Hermanos generales</h2>
+
+<p>Si deseas seleccionar los hermanos de un elemento, incluso si no son directamente adyacentes, puedes utilizar el combinador de hermanos general (<code>~</code>). Por ejemplo, para seleccionar todos los elementos <code>&lt;img&gt;</code> que aparecen <em>después</em> de los elementos <code>&lt;p&gt;</code>, hacemos esto:</p>
+
+<pre class="brush: css notranslate">p ~ img</pre>
+
+<p>En el ejemplo siguiente seleccionamos todos los elementos <code>&lt;p&gt;</code> que vienen después de <code>&lt;h1&gt;</code>, y aunque en el documento también hay un <code>&lt;div&gt;</code>, se selecciona incluso la etiqueta <code>&lt;p&gt;</code> que viene después.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/general.html", '100%', 600)}}</p>
+
+<h2 id="El_uso_de_selectores_de_combinación">El uso de selectores de combinación</h2>
+
+<p>Puedes combinar cualquiera de los selectores de los artículos anteriores con selectores de combinación para seleccionar una parte del documento. Por ejemplo, podrías utilizar el código siguiente para seleccionar elementos de una lista con una clase «a» que son hijos directos de <code>&lt;ul&gt;</code>:</p>
+
+<pre class="brush: css notranslate">ul &gt; li[class="a"]  {  }</pre>
+
+<p>Ten cuidado cuando creas largas listas de selectores que seleccionan partes del documento muy específicas. Te será difícil volver a utilizar las reglas CSS porque has definido un selector muy específico para la ubicación del elemento en el marcado.</p>
+
+<p>A menudo es mejor crear una clase sencilla y aplicarla al elemento en cuestión. Dicho esto, tu conocimiento de los selectores de combinación te será muy útil si necesitas modificar algo del documento y no puedes acceder al código HTML (tal vez porque se haya generado a partir de CMS).</p>
+
+<h2 id="Comprueba_tus_habilidades">Comprueba tus habilidades</h2>
+
+<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más importante? Encontrarás más pruebas para verificar que retienes esa información en <a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Selectors_Tasks">Test your skills: Selectors</a>.</p>
+
+<h2 id="Continuamos">Continuamos</h2>
+
+<p>Esta es la última sección de nuestros artículos sobre selectores. A continuación vamos a pasar a otra parte importante del CSS: <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">el modelo de caja CSS</a>.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements", "Learn/CSS/Building_blocks/The_box_model", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Elementos de imagen, de media y de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Estilo de las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/selectors/index.html b/files/es/learn/css/building_blocks/selectors/index.html
new file mode 100644
index 0000000000..4584bb30d3
--- /dev/null
+++ b/files/es/learn/css/building_blocks/selectors/index.html
@@ -0,0 +1,224 @@
+---
+title: Selectores CSS
+slug: Learn/CSS/Building_blocks/Selectors
+translation_of: Learn/CSS/Building_blocks/Selectors
+original_slug: Learn/CSS/Building_blocks/Selectores_CSS
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Cascade_and_inheritance", "Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks")}}</div>
+
+<p class="summary">En {{Glossary( "CSS")}} los selectores se utilizan para delimitar los elementos {{glossary("HTML")}} de nuestra página web a los que queremos aplicar estilo. Hay una amplia variedad de selectores CSS, lo que permite una gran precisión a la hora de seleccionar elementos a los que aplicar estilo. En este artículo y sus subartículos veremos con detalle todos los tipos y el modo como funcionan.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Nociones básicas de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y una idea de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender con detalle cómo funcionan los selectores CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_un_selector">¿Qué es un selector?</h2>
+
+<p>En un artículo anterior explicamos qué son los selectores. Un selector CSS es la primera parte de una regla CSS. Es un patrón de elementos y otros términos que indican al navegador qué elementos HTML se seleccionan para aplicarles una regla que incluye los valores de las propiedades CSS. El elemento o los elementos seleccionados por el selector se denominan <em>sujeto del selector</em>.</p>
+
+<p><img alt="Fragmento de código con el elemento h1 resaltado." src="https://mdn.mozillademos.org/files/16550/selector.png" style="border: 1px solid #cccccc; height: 218px; width: 471px;"></p>
+
+<p>En artículos anteriores ya has visto algunos selectores y has aprendido que hay diversas maneras de organizar el documento. Por ejemplo, seleccionando un elemento, como <code>h1</code>, o seleccionando una clase, como <code>.special</code>.</p>
+
+<p>En CSS, los selectores se definen en la especificación de selectores de CSS correspondiente; al igual que cualquier otro elemento de CSS, es necesario que los navegadores los admitan para que funcionen. La mayoría de los selectores que encontrarás se definen en <a href="https://www.w3.org/TR/selectors-3/">especificación de nivel 3 de selectores</a>, que es una especificación consolidada y, por lo tanto, la mayoría de navegadores admitirán esos selectores.</p>
+
+<h2 id="Listas_de_selectores">Listas de selectores</h2>
+
+<p>Si más de un elemento utiliza el mismo CSS, puedes combinar los selectores en una <em>lista de selectores</em> para que la regla se aplique a cada uno de los selectores individuales. Por ejemplo, si tengo el mismo CSS para un <code>h1</code> y para una clase <code>.special</code>, los puedo escribir como dos reglas separadas.</p>
+
+<pre class="brush: css notranslate"><code>h1 {
+  color: blue;
+}
+
+.special {
+  color: blue;
+} </code></pre>
+
+<p>También los podrías combinar en una lista de selectores, separándolos con una coma.</p>
+
+<pre class="brush: css notranslate"><code>h1, .special {
+  color: blue;
+} </code></pre>
+
+<p>Es posible dejar un espacio en blanco tanto antes como después de la coma. Incluso puede resultar más legible si cada selector se encuentra en una línea distinta.</p>
+
+<pre class="brush: css notranslate"><code>h1,
+.special {
+  color: blue;
+} </code></pre>
+
+<p>En el ejemplo siguiente, intenta combinar los dos selectores de modo que tengan la misma declaración. El aspecto visual debe permanecer igual tras la combinación.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/selector-list.html", '100%', 1000)}} </p>
+
+<p>Cuando agrupas los selectores de esta manera, si alguno de los selectores no es válido, el navegador sencillamente ignora toda la regla.</p>
+
+<p>En el ejemplo siguiente, la regla que corresponde al selector de clase que no es válido se ignora, mientras que el estilo se aplica al elemento <code>h1</code>.</p>
+
+<pre class="brush: css notranslate"><code>h1 {
+  color: blue;
+}
+
+..special {
+  color: blue;
+} </code></pre>
+
+<p>Sin embargo, si se combinan, toda la regla se considera no válida y no se aplicará estilo ni a <code>h1</code> ni a la clase.</p>
+
+<pre class="brush: css notranslate"><code>h1, ..special {
+  color: blue;
+} </code></pre>
+
+<h2 id="Tipos_de_selectores">Tipos de selectores</h2>
+
+<p>Hay diferentes agrupaciones de selectores, y conocer qué tipo de selector necesitas te ayudará a encontrar la herramienta adecuada para tu trabajo. En estos subartículos vamos a ver los diferentes grupos de selectores con más detalle.</p>
+
+<h3 id="Selectores_de_tipo_de_clase_y_de_ID">Selectores de tipo, de clase y de ID</h3>
+
+<p>Este grupo incluye selectores que delimitan un elemento HTML, como por ejemplo un <code>&lt;h1&gt;</code>.</p>
+
+<pre class="brush: css notranslate">h1 { }</pre>
+
+<p>También incluye selectores que delimitan una clase:</p>
+
+<pre class="brush: css notranslate">.box { }</pre>
+
+<p>o un ID:</p>
+
+<pre class="brush: css notranslate">#unique { }</pre>
+
+<h3 id="Selectores_de_atributo">Selectores de atributo</h3>
+
+<p>Este grupo de selectores te proporciona diferentes formas de seleccionar elementos según la presencia de un atributo determinado en un elemento:</p>
+
+<pre class="brush: css notranslate">a[title] { }</pre>
+
+<p>O incluso hacer una selección basada en la presencia de un atributo que tiene un valor particular asignado:</p>
+
+<pre class="brush: css notranslate">a[href="https://example.com"] { }</pre>
+
+<h3 id="Las_pseudoclases_y_los_pseudoelementos">Las pseudoclases y los pseudoelementos</h3>
+
+<p>Este grupo de selectores incluye pseudoclases, que aplican estilo a ciertos estados de un elemento. La pseudoclase <code>:hover</code>, por ejemplo, selecciona un elemento solo cuando se le pasa el ratón por encima.</p>
+
+<pre class="brush: css notranslate">a: hover {}</pre>
+
+<p>También incluye pseudoelementos, que seleccionan una parte determinada de un elemento en vez del elemento en sí. Por ejemplo, <code>::first-line</code> siempre selecciona la primera línea del texto que se encuentra dentro de un elemento (<code>&lt;p&gt;</code>, en el ejemplo siguiente), y actúa como si un elemento <code>&lt;span&gt;</code> hubiera delimitado la primera línea, seleccionado y aplicado estilo.</p>
+
+<pre class="brush: css notranslate">p::first-line { }</pre>
+
+<h3 id="Combinadores">Combinadores</h3>
+
+<p>El último grupo de selectores combina otros selectores con el fin de delimitar elementos de nuestros documentos. El ejemplo siguiente selecciona los párrafos que son hijos directos del elemento <code>&lt;article&gt;</code> utilizando el operador de combinación hijo (<code>&gt;</code>):</p>
+
+<pre class="brush: css notranslate">article &gt; p { }</pre>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<p>Echa un vistazo a esta tabla de referencia de selectores que contiene enlaces directos a los distintos tipos de selectores que se explican en nuestra sección de aprendizaje o en MDN, o bien sigue adelante e inicia tu viaje para averiguar cómo funcionan en <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID">Selectores de tipo, de clase y de ID</a>.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Cascade_and_inheritance", "Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="Tabla_de_referencia_de_selectores">Tabla de referencia de selectores</h2>
+
+<p>La tabla que te mostramos a continuación proporciona una descripción general de los selectores que puedes utilizar junto con enlaces a diversas páginas de esta guía que te mostrarán cómo utilizar cada tipo de selector. También hemos incluido un enlace a la página MDN de cada selector para poder comprobar la información sobre los navegadores que lo admiten. Puedes utilizarlo como referencia para volver cuando necesites buscar los selectores a medida que avanzas con la materia o mientras experimentas con CSS por tu cuenta.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Selector</th>
+   <th scope="col">Ejemplo</th>
+   <th scope="col">Tutorial de aprendizaje de CSS</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Type_selectors">Selector de tipo</a></td>
+   <td><code>h1 {  }</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#Tipos_de_selectores">Los tipos de selectores</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Universal_selectors">Selector universal</a></td>
+   <td><code>* {  }</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#El_selector_universal">El selector universal</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Class_selectors">Selector de clase</a></td>
+   <td><code>.box {  }</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#Selectores_de_clase">Los selectores de clase</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/ID_selectors">Selector de ID</a></td>
+   <td><code>#unique { }</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID#Selectores_de_ID">Los selectores de ID</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Selectores_atributo">Selector de atributo</a></td>
+   <td><code>a[title] {  }</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos">Los selectores de atributo</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Pseudo-classes">Pseudoclase</a></td>
+   <td><code>p:first-child { }</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos#%C2%BFQu%C3%A9_es_una_pseudoclase">Las pseudoclases</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Pseudoelementos">Pseudoelemento</a></td>
+   <td><code>p::first-line { }</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos#%C2%BFQu%C3%A9_es_un_pseudoelemento">Los pseudoelementos</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Descendant_combinator">Operadores de combinación descendentes</a></td>
+   <td><code>article p</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Selector_de_descendientes">Operadores de combinación descendentes</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Child_combinator">Operador de combinación de elementos hijo</a></td>
+   <td><code>article &gt; p</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Selector_de_combinaci%C3%B3n_de_elementos_hijo">Operadores de combinación de elementos hijo</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Selectores_hermanos_adyacentes">Operador de combinación de elementos hermanos adyacentes</a></td>
+   <td><code>h1 + p</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Hermanos_adyacentes">Hermanos adyacentes</a></td>
+  </tr>
+  <tr>
+   <td><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Operador de combinación general de elementos hermanos</a></td>
+   <td><code>h1 ~ p</code></td>
+   <td><a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Combinadores#Hermanos_generales">Hermanos generales</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/selectors/pseudo-classes_and_pseudo-elements/index.html b/files/es/learn/css/building_blocks/selectors/pseudo-classes_and_pseudo-elements/index.html
new file mode 100644
index 0000000000..6cba271113
--- /dev/null
+++ b/files/es/learn/css/building_blocks/selectors/pseudo-classes_and_pseudo-elements/index.html
@@ -0,0 +1,398 @@
+---
+title: Pseudoclases y pseudoelementos
+slug: Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements
+translation_of: Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements
+original_slug: Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos
+---
+<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks")}}</p>
+
+<p>El conjunto de selectores que estudiaremos en este artículo se conocen como <strong>pseudoclases</strong> y <strong>pseudoelementos</strong>. Hay muchos y a menudo sirven para fines muy específicos. Una vez que sepas cómo usarlos, puedes echar un vistazo a la lista para ver si alguno sirve para la página que quieres crear. Una vez más, la página correspondiente de MDN resulta muy útil para conocer qué navegadores los admiten o no.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Obtener información sobre los selectores de pseudoclases y pseudoelementos.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_una_pseudoclase">¿Qué es una pseudoclase?</h2>
+
+<p>Una pseudoclase es un selector que marca los elementos que están en un estado específico, por ejemplo, los que son el primer elemento de su tipo, o aquellos por los que el cursor les pasa por encima. Tienden a actuar como si hubieras aplicado una clase en una parte determinada del documento y, a menudo, ayudan a reducir el exceso de clases y proporcionan un marcado más flexible y fácil de mantener.</p>
+
+<p>Las pseudoclases son palabras clave que comienzan con dos puntos:</p>
+
+<pre class="notranslate">:<em>pseudo-class-name</em></pre>
+
+<h3 id="Ejemplos_simples_de_pseudoclases">Ejemplos simples de pseudoclases</h3>
+
+<p>Echemos un vistazo a algunos ejemplos. Si queremos el primer párrafo de un artículo en letra más grande y en negrita, podemos añadir una clase a ese párrafo y luego añadirle CSS a esa clase, como se muestra en este ejemplo:</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/first-child.html", '100%', 800)}}</p>
+
+<p>Sin embargo, podría ser complicado de mantener. ¿Y si añadiésemos un párrafo nuevo en la parte superior del documento? Habría que mover la clase para que quede antes del nuevo párrafo. En lugar de añadir la clase, podríamos utilizar el selector de pseudoclase {{cssxref(":first-child")}}, que <em>siempre</em> seleccionará el primer elemento hijo del artículo, y de esta forma no tendremos que editar el código HTML (esto no siempre es posible, tal vez debido a que lo genera un CMS).</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/first-child2.html", '100%', 700)}}</p>
+
+<p>Todas las pseudoclases se comportan del mismo modo. Seleccionan un fragmento del documento que está en un estado determinado y se comportan como si se hubiera añadido una clase a su HTML. Echa un vistazo a otros ejemplos en MDN:</p>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/CSS/:last-child">:last-child</a></code></li>
+ <li><code><a href="/en-US/docs/Web/CSS/:only-child">:only-child</a></code></li>
+ <li><code><a href="/en-US/docs/Web/CSS/:invalid">:invalid</a></code></li>
+</ul>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Es válido escribir pseudoclases y pseudoelementos sin que les preceda un selector de elemento. En el ejemplo anterior, podría escribirse <code>:first-child</code> y la regla se aplicaríaa cualquier elemento que sea el primer hijo de un elemento <code>&lt;article&gt;</code>, no solo un párrafo primer hijo. <code>:first-child</code> equivale a <code>*:first-child</code>. Pero normalmente se quiere más control y hay que ser más específico.</p>
+</div>
+
+<h3 id="Pseudoclases_de_acción_de_usuario">Pseudoclases de acción de usuario</h3>
+
+<p>Algunas pseudoclases solo intervienen cuando el usuario interactúa con el documento de alguna manera. Estas pseudoclases de <strong>acción de usuario</strong>, que también reciben el nombre de <strong>pseudoclases dinámicas</strong>, actúan como si se añadiese una clase al elemento cuando el usuario interactúa con él. Algunos ejemplos son:</p>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/CSS/:hover">:hover</a></code>: solo interviene si el usuario pasa el cursor sobre un elemento, normalmente un enlace.</li>
+ <li><code><a href="/en-US/docs/Web/CSS/:focus">:focus</a></code>: solo interviene si el usuario selecciona el elemento con los controles del teclado.</li>
+</ul>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/hover.html", '100%', 500)}}</p>
+
+<h2 id="¿Qué_es_un_pseudoelemento">¿Qué es un pseudoelemento?</h2>
+
+<p>Los pseudoelementos se comportan de manera similar. Sin embargo, actúan como si hubieras añadido un elemento HTML totalmente nuevo en el marcado, en lugar de haber aplicado una clase nueva a los elementos presentes. Los pseudoelementos empiezan con un doble signo de dos puntos <code>::</code>.</p>
+
+<pre class="notranslate"><em>::pseudo-element-name</em></pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Algunos de los primeros pseudoelementos utilizaban la sintaxis de un solo signo de dos puntos, así que puede ser que en ocasiones los veas escritos de esta forma en algún código o ejemplo. Los navegadores modernos leen tanto los pseudoelementos con la sintaxis de los dos puntos simple como la de los dos puntos doble para garantizar la compatibilidad retrospectiva.</p>
+</div>
+
+<p>Por ejemplo, si deseas seleccionar la primera línea de un párrafo simplemente puedes delimitarlo con el elemento <code>&lt;span&gt;</code> y utilizar un selector de elementos. Sin embargo, fallará si el número de palabras que has delimitado resulta ser más largo o más corto que el ancho del elemento padre. Ya que normalmente no sabemos cuántas palabras caben en una línea porque esto cambia con el ancho de la pantalla o con los cambios de tamaño de la letra, no es posible hacer esto introduciendo solo HTML.</p>
+
+<p>El pseudoelemento <code>::first-line</code> soluciona este problema: no importa si el número de palabras aumenta o disminuye, siempre se selecciona la primera línea.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/first-line.html", '100%', 800)}}</p>
+
+<p>Actúa como si hubiera un elemento <code>&lt;span&gt;</code> mágicamente delimitando esa primera línea, que se actualiza cada vez que la longitud de la línea cambia.</p>
+
+<p>Puedes observar que en ambos párrafos se selecciona la primera línea.</p>
+
+<h2 id="Combinar_pseudoclases_y_pseudoelementos">Combinar pseudoclases y pseudoelementos</h2>
+
+<p>Si quieres poner en negrita la primera línea del primer párrafo, puedes encadenar los selectores <code>:first-child</code> y <code>::first-line</code>. Añade al ejemplo anterior el CSS siguiente. Queremos que se seleccione la primera línea del primer elemento <code>&lt;p&gt;</code> que esté dentro de un elemento <code>&lt;article&gt;</code>.</p>
+
+<pre class="brush: css notranslate"><code>article p:first-child::first-line {
+  font-size: 120%;
+  font-weight: bold;
+}</code></pre>
+
+<h2 id="Generar_contenido_con_before_y_after">Generar contenido con ::before y ::after</h2>
+
+<p>Hay un par de pseudoelementos especiales que se utilizan junto con la propiedad de <code><a href="/en-US/docs/Web/CSS/content">content</a></code> para introducir contenido en el documento usando el CSS.</p>
+
+<p>Puedes utilizarlos para insertar una cadena de texto, como en el ejemplo siguiente. Intenta cambiar el valor del texto de la propiedad {{cssxref("content")}} y observa el cambio en la salida. También puedes cambiar el pseudoelemento <code>::before</code> por <code>::after</code> y verás que el texto se inserta al final del elemento, en lugar de al principio.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/before.html", '100%', 400)}}</p>
+
+<p>Sin embargo, en realidad no es habitual insertar cadenas de texto desde el CSS, porque ese texto resulta inaccesible para algunos lectores de pantalla y puede ser difícil de buscar y modificar en el futuro.</p>
+
+<p>Un uso más adecuado de estos pseudoelementos es insertar un icono. Por ejemplo, la pequeña flecha que añadimos en el ejemplo siguiente es un indicador visual que no queremos que el lector de pantalla muestre:</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/after-icon.html", '100%', 400)}}</p>
+
+<p>Estos pseudoelementos también se utilizan con frecuencia para insertar una cadena vacía a la que luego se le puede aplicar estilo, como a cualquier otro elemento de la página.</p>
+
+<p>En el ejemplo siguiente hemos añadido una cadena vacía mediante el pseudoelemento <code>::before</code>. Le hemos asociado <code>display: block</code> para poder aplicarle estilo para que tenga una anchura y una altura determinadas. A continuación, utilizamos el CSS para aplicar estilo de la misma forma que lo haríamos con cualquier otro elemento. Juega con el CSS y cambia la forma en que se ve y se comporta.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/before-styled.html", '100%', 500)}}</p>
+
+<p>El uso de los pseudoelementos <code>::before</code> y <code>::after</code>, junto con la propiedad <code>content</code> se conoce como «contenido generado» en CSS, y verás que esta técnica se utiliza a menudo para diversas tareas. Un buen ejemplo es la página web <a href="http://www.cssarrowplease.com/">CSS Arrow Please</a>, que te ayuda a generar una flecha con CSS. Echa un vistazo al CSS a medida que creas tu flecha y verás cómo funcionan los pseudoelementos {{cssxref("::before")}} y {{cssxref("::after")}}. Cada vez que veas estos selectores, echa un vistazo a la propiedad {{cssxref("content")}} para ver qué se añade al documento.</p>
+
+<h2 id="Sección_de_referencia">Sección de referencia</h2>
+
+<p>Hay un gran número de pseudoclases y pseudoelementos, así que resulta útil tener una lista para ir consultándolos. A continuación encontrarás un par de tablas con enlaces a sus páginas de referencia en MDN. Tómalas como referencia para ver de qué dispones para seleccionar qué tipos de elementos.</p>
+
+<h3 id="Las_pseudoclases">Las pseudoclases</h3>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Selector</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ Cssxref(":active") }}</td>
+   <td>Selecciona un elemento cuando el usuario lo activa (por ejemplo, con un clic).</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":any-link") }}</td>
+   <td>Selecciona los estados <code>:link</code> y <code>:visited</code> de un enlace.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":blank") }}</td>
+   <td>Selecciona un <a href="/es/docs/Web/HTML/Elemento/input">elemento <code>&lt;input&gt;</code></a> cuyo valor de entrada está vacío.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":checked") }}</td>
+   <td>Selecciona un botón de opción o casilla de verificación en el estado que determines.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":current") }}</td>
+   <td>Selecciona el elemento que se muestra en ese momento, o un ancestro de ese elemento.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":default") }}</td>
+   <td>Selecciona uno o más elementos de interfaz de usuario cuyo valor es el predeterminado de entre un conjunto de elementos similares.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":dir") }}</td>
+   <td>Selecciona un elemento según su direccionalidad (valor del atributo <code><a href="/en-US/docs/Web/HTML/Global_attributes/dir">dir</a></code> de HTML o propiedad <code><a href="/en-US/docs/Web/CSS/direction">direction</a></code> de CSS).</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":disabled") }}</td>
+   <td>Selecciona elementos de la interfaz de usuario que están en estado inactivo.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":empty") }}</td>
+   <td>Selecciona un elemento que no tiene elementos hijo, excepto por algún espacio en blanco opcional.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":enabled") }}</td>
+   <td>Selecciona elementos de la interfaz de usuario que están en estado activo.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":first") }}</td>
+   <td>En <a href="/en-US/docs/Web/CSS/Paged_Media">Paged Media</a>, selecciona la primera página.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":first-child") }}</td>
+   <td>Selecciona el primero entre elementos hermanos.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":first-of-type") }}</td>
+   <td>Selecciona el primero entre un tipo determinado de elementos hermanos.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":focus") }}</td>
+   <td>Selecciona el elemento que tiene el foco.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":focus-visible")}}</td>
+   <td>Selecciona el elemento que tiene el foco cuando el foco tiene que estar visible para el usuario.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":focus-within") }}</td>
+   <td>Selecciona el elemento que tiene el foco y el elemento con un descendiente que tiene el foco.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":future") }}</td>
+   <td>Selecciona los elementos que van después del elemento en curso.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":hover") }}</td>
+   <td>Selecciona un elemento cuando el usuario interactúa con él.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":indeterminate") }}</td>
+   <td>Selecciona elementos de interfaz de usuario cuyo valor está en un estado no determinado, por lo general se trata de <a href="/es/docs/Web/HTML/Elemento/input/checkbox">casillas de verificación</a>.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":in-range") }}</td>
+   <td>Selecciona un elemento cuyo valor se encuentra dentro de un rango de valores determinado.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":invalid") }}</td>
+   <td>Selecciona un elemento, como por ejemplo un <code>&lt;input&gt;</code>, cuyo estado es no válido.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":lang") }}</td>
+   <td>Selecciona un elemento según el idioma (valor del atributo <a href="/es/docs/Web/HTML/Atributos_Globales/lang">lang</a> de HTML).</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":last-child") }}</td>
+   <td>Selecciona el último elemento de entre sus elementos hermanos.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":last-of-type") }}</td>
+   <td>Selecciona el último de entre los elementos hermanos de un tipo determinado.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":left") }}</td>
+   <td>En <a href="/en-US/docs/Web/CSS/CSS_Pages">Paged Media</a> selecciona las páginas de la izquierda.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":link")}}</td>
+   <td>Selecciona los enlaces no visitados.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":local-link")}}</td>
+   <td>Selecciona los enlaces que dirigen a páginas que se encuentran en la misma página web que el documento activo.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":is", ":is()")}}</td>
+   <td>Selecciona cualquiera de los selectores de la lista de selección que se pase como valor de este selector.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":not") }}</td>
+   <td>Selecciona elementos que otros selectores no han seleccionado antes y que se han pasado como valor de este selector.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":nth-child") }}</td>
+   <td>Selecciona elementos de entre una lista de elementos hermanos. Los elementos hermanos están relacionados por una fórmula del tipo <var>an + b</var> (por ejemplo, 2<var>n</var> + 1 seleccionaría los elementos 1, 3, 5, 7, etc., es decir, todos los impares).</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":nth-of-type") }}</td>
+   <td>Selecciona elementos de entre una lista de elementos hermanos de un tipo determinado (por ejemplo, todos los elementos <code>&lt;p&gt;</code>). Los elementos hermanos están relacionados por una fórmula del tipo <var>an + b</var> (por ejemplo, 2<var>n</var> + 1 relacionaría en la secuencia ese tipo de elementos, los números 1, 3, 5, 7, etc., es decir, todos los impares).</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":nth-last-child") }}</td>
+   <td>Selecciona elementos de entre una lista de elementos hermanos, contando hacia atrás desde el final. Los elementos hermanos están relacionados por una fórmula del tipo <var>an+b</var> (por ejemplo, 2<var>n<var> <em>+ 1 r</em>elacionaría en la secuencia el último de los elementos de este tipo con el que se encuentra dos por delante, y así sucesivamente. Todos los impares, contando desde el final).</var></var></td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":nth-last-of-type") }}</td>
+   <td>Selecciona los elementos de entre una lista de elementos hermanos que son de un tipo determinado (por ejemplo, elementos <code>&lt;p&gt;</code>), contando hacia atrás desde el final. Los elementos hermanos están relacionados por una fórmula del tipo <var>an+b</var> (por ejemplo, 2<var>n</var> + 1 relacionaría en la secuencia el último de los elementos de ese tipo con el que se encuentra dos por delante, y así sucesivamente. Todos los impares, contando desde el final).</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":only-child") }}</td>
+   <td>Selecciona un elemento que no tiene elementos hermanos.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":only-of-type") }}</td>
+   <td>Selecciona un elemento que es el único de su tipo entre sus elementos hermanos.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":optional") }}</td>
+   <td>Selecciona los elementos de formulario que son innecesarios.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":out-of-range") }}</td>
+   <td>Selecciona un elemento cuyo valor está fuera de rango.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":past") }}</td>
+   <td>Selecciona los elementos que se encuentran antes del elemento activo.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":placeholder-shown") }}</td>
+   <td>Selecciona el elemento de entrada que muestra texto de marcador de posición.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":playing") }}</td>
+   <td>Selecciona un elemento que representa un audio, un vídeo o un recurso similar que se puede «reproducir» o «pausar», cuando el elemento está «en reproducción».</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":paused") }}</td>
+   <td>Selecciona un elemento que representa un audio, un vídeo o un recurso similar que se puede “«reproducir» o «pausar» cuando el elemento está «pausado».</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":read-only") }}</td>
+   <td>Selecciona los elementos que el usuario no puede modificar.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":read-write") }}</td>
+   <td>Selecciona los elementos que el usuario puede modificar.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":required") }}</td>
+   <td>Selecciona los elementos de formulario que son necesarios.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":right") }}</td>
+   <td>En <a href="/en-US/docs/Web/CSS/CSS_Pages">Paged Media</a> selecciona las páginas de la derecha.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":root") }}</td>
+   <td>Selecciona un elemento que es la raíz del documento.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":scope") }}</td>
+   <td>Selecciona cualquier elemento de ámbito.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":valid") }}</td>
+   <td>Selecciona un elemento como <code>&lt;input&gt;</code>, en un estado válido.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":target") }}</td>
+   <td>Selecciona el elemento al que apunta la URL activa (es decir, cuyo ID coincide con el <a href="https://en.wikipedia.org/wiki/Fragment_identifier">identificador de fragmento de la URL</a> activo).</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref(":visited") }}</td>
+   <td>Selecciona los enlaces visitados.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Pseudoelementos">Pseudoelementos</h3>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Selector</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ Cssxref("::after") }}</td>
+   <td>Selecciona el elemento al que se puede aplicar estilo que aparece a continuación del contenido del elemento que lo origina.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref("::before") }}</td>
+   <td>Selecciona el elemento al que se puede aplicar estilo que aparece antes del contenido del elemento que lo origina.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref("::first-letter") }}</td>
+   <td>Selecciona la primera letra del elemento.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref("::first-line") }}</td>
+   <td>Selecciona la primera línea del elemento de contenido.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref("::grammar-error") }}</td>
+   <td>Selecciona una parte del documento que contiene un error de gramática indicado por el navegador.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref("::selection") }}</td>
+   <td>Selecciona la parte del documento que ha sido seleccionada.</td>
+  </tr>
+  <tr>
+   <td>{{ Cssxref("::spelling-error") }}</td>
+   <td>Selecciona una parte del documento que contiene un error de ortografía indicado por el navegador.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Elementos de imagen, de media y de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.html b/files/es/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.html
new file mode 100644
index 0000000000..c4e6758ca2
--- /dev/null
+++ b/files/es/learn/css/building_blocks/selectors/type_class_and_id_selectors/index.html
@@ -0,0 +1,118 @@
+---
+title: Selectores de tipo, clase e ID
+slug: Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors
+translation_of: Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors
+original_slug: Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_tipo_clase_e_ID
+---
+<p>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks")}}</p>
+
+<p>En este artículo vamos a echar un vistazo a los selectores más simples de que dispones y que seguramente serán los que utilices con mayor frecuencia.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Conocer los diferentes selectores CSS que podemos utilizar para aplicar CSS a un documento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Tipos_de_selectores">Tipos de selectores</h2>
+
+<p>Un <strong>selector de tipo</strong> también recibe el nombre de <em>selector de nombre de etiqueta</em> o <em>selector de elemento</em> porque selecciona un elemento/etiqueta HTML del documento. En el ejemplo siguiente hemos utilizado los selectores span, em y strong. Se aplica estilo a todas las instancias de los elementos <code>&lt;span&gt;</code>, <code>&lt;em&gt;</code> y <code>&lt;strong&gt;</code>.</p>
+
+<p><strong>Trata de añadir una regla CSS que seleccione el elemento <code>&lt;h1&gt;</code> y cambie su color para que se vea azul.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/type.html", '100%', 1100)}}</p>
+
+<h2 id="El_selector_universal">El selector universal</h2>
+
+<p>El selector universal se indica con un asterisco (<code>*</code>) y selecciona todos los elementos del documento (o del elemento padre si está encadenado con otro elemento y un operador de combinación descendente, por ejemplo). En el ejemplo siguiente hemos utilizado el selector universal para eliminar los márgenes en todos los elementos. Esto significa que en lugar de la opción predeterminada de aplicación de estilos del navegador, que muestra los títulos de encabezado y los párrafos separados por un margen de respeto, todo se mostrará pegado y no resultará tan fácil distinguir los diversos párrafos.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/universal.html", '100%', 750)}}</p>
+
+<p>Es posible observar este tipo de comportamiento en las «hojas de estilo de puesta a cero» (o «hojas de estilo <em>reset</em>»), que anulan el formato del navegador. Fueron muy populares en un momento dado; sin embargo, excluir todo el estilo significa que luego tienes que ponerlo todo de nuevo. Por este motivo tendemos a utilizar el selector universal con mucho cuidado, y para situaciones muy específicas como la que se describe a continuación.</p>
+
+<h3 id="Uso_del_selector_universal_para_facilitar_la_legibilidad_de_tus_selectores">Uso del selector universal para facilitar la legibilidad de tus selectores</h3>
+
+<p>Uno de los usos del selector universal es facilitar la legibilidad de los selectores y clarificar sus funciones. Por ejemplo, si quiero seleccionar el primer elemento hijo de cualquier elemento <code>&lt;article&gt;</code> y poner ese elemento, cualquiera que sea, en negrita, puedo utilizar el selector {{cssxref(":first-child")}}, que veremos con mayor detalle más adelante en el artículo de <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos">pseudoclases y pseudoelementos</a>, como selector descendente junto con el selector de elemento <code>&lt;article&gt;</code>: </p>
+
+<pre class="brush: css notranslate">article :first-child {
+
+}</pre>
+
+<p>Sin embargo, esto podría confundirse con <code>article:first-child</code>, que selecciona cualquier elemento <code>&lt;article&gt;</code> que sea el primer elemento hijo de otro elemento.</p>
+
+<p>Para evitar esta confusión podemos añadir al selector <code>:first-child</code> el selector universal. De este modo la función del selector resulta obvia: seleccionará <em>cualquier</em> elemento que entre en la jerarquía de primer hijo de un elemento <code>&lt;article&gt;</code>:</p>
+
+<pre class="brush: css notranslate">article *:first-child {
+
+} </pre>
+
+<h2 id="Selectores_de_clase">Selectores de clase</h2>
+
+<p>El selector de clase comienza con un punto (<code>.</code>) y selecciona todo elemento del documento que esté afectado por esa clase. En el ejemplo siguiente hemos creado una clase llamada <code>.highlight</code> y la hemos aplicado en varios lugares del documento. Todos los elementos a los que se aplique esta clase se resaltarán en amarillo.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/class.html", '100%', 750)}}</p>
+
+<h3 id="Delimitación_de_clases_en_elementos_particulares">Delimitación de clases en elementos particulares</h3>
+
+<p>Puedes crear un selector que seleccionará los elementos concretos que estén afectados por esa clase. En el ejemplo siguiente vamos a introducir un resaltado en un elemento <code>&lt;span&gt;</code> con una clase <code>highlight</code> del de los títulos <code>&lt;h1&gt;</code> con clase <code>highlight</code>. Para ello hay que anexar esa clase al selector de tipo correspondiente al elemento que queremos delimitar, sin dejar entre ellos ningún espacio.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/class-type.html", '100%', 750)}}</p>
+
+<p>Este enfoque hace el elemento CSS menos reutilizable porque la clase solo se aplicará a ese elemento en particular y tendrás que agregar otro selector en caso que quieras que las normas también se apliquen a otros elementos.</p>
+
+<h3 id="Delimitar_un_elemento_afectado_por_más_de_una_clase">Delimitar un elemento afectado por más de una clase</h3>
+
+<p>Puedes aplicar más de una clase a un elemento y delimitarlos de forma individual o seleccionar el elemento cuando todas las clases están presentes en el selector. Puede ser útil cuando se trabaja con componentes que se pueden combinar de maneras diferentes en tu página web.</p>
+
+<p>En el ejemplo siguiente hay un elemento <code>&lt;div&gt;</code> que contiene una nota. El borde gris se aplica cuando la caja tiene una clase <code>notebox</code>. Si además tiene una clase <code>warning</code> o <code>danger</code>, la propiedad {{cssxref("border-color")}} cambia.</p>
+
+<p>Para decirle al navegador que solo queremos seleccionar el elemento si incluye todas estas clases, las encadenamos juntas sin ningún espacio entre ellas.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/class-many.html", '100%', 900)}}</p>
+
+<h2 id="Selectores_de_ID">Selectores de ID</h2>
+
+<p>Un selector de ID comienza con un carácter <code>#</code> en lugar de un punto, pero se utiliza básicamente de la misma manera que un selector de clase. Sin embargo, un ID se puede utilizar una sola vez en cada documento, y a cada elemento solo se le puede aplicar un único <code>id</code>. Puede seleccionar un elemento que tenga propiedad <code>id</code> y ese ID puede ir precedido de un selector de tipo que seleccionará el elemento solo si el elemento y el ID coinciden. En el ejemplo siguiente puedes ver todos estos usos:</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/selectors/id.html", '100%', 750)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Como aprendimos en el artículo sobre la especificidad, un ID tiene una especificidad muy alta y anula la mayoría de los otros selectores. Esto puede dificultar su uso. En la mayoría de los casos es preferible añadir una clase al elemento en lugar de utilizar un ID. Sin embargo, si el ID es la única manera de seleccionar el elemento (tal vez porque no tengas acceso al marcado y, por lo tanto, no lo puedes editar) no hay ningún problema en utilizarlo.</p>
+</div>
+
+<h2 id="En_el_próximo_artículo">En el próximo artículo</h2>
+
+<p>Seguiremos con la descripción de los selectores examinando los <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Selectores_de_atributos">selectores de atributo</a>.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks/Selectors/Attribute_selectors", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">La cascada y la herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Operadores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/sizing_items_in_css/index.html b/files/es/learn/css/building_blocks/sizing_items_in_css/index.html
new file mode 100644
index 0000000000..4577a3a34a
--- /dev/null
+++ b/files/es/learn/css/building_blocks/sizing_items_in_css/index.html
@@ -0,0 +1,130 @@
+---
+title: Dimensionar elementos en CSS
+slug: Learn/CSS/Building_blocks/Sizing_items_in_CSS
+translation_of: Learn/CSS/Building_blocks/Sizing_items_in_CSS
+original_slug: Learn/CSS/Building_blocks/Dimensionar_elementos_en_CSS
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks/Images_media_form_elements", "Learn/CSS/Building_blocks")}}</div>
+
+<p>En los diversos artículos vistos hasta ahora, has aprendido varias formas de dimensionar elementos en una página web utilizando CSS. Es importante que comprendas qué tamaños van a tener los diferentes elementos de tu diseño, y en este artículo vamos a resumir las diversas formas en que puedes asignar tamaños a los elementos con CSS y definir algunos términos relativos al dimensionado que te ayudarán en el futuro.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender las diferentes formas en que podemos dimensionar las cosas en CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="El_tamaño_natural_o_intrínseco_de_las_cosas">El tamaño natural o intrínseco de las cosas</h2>
+
+<p>Los elementos HTML tienen un tamaño natural, establecido antes de que se vean afectados por cualquier código CSS. Un ejemplo sencillo es una imagen. Una imagen tiene un ancho y una altura que están definidos en el archivo de imagen que está incrustando en la página. Este tamaño se describe como el <strong>tamaño intrínseco</strong>, que proviene de la imagen misma.</p>
+
+<p>Si colocas una imagen en una página y no cambias su altura y ancho, ya sea usando atributos en la etiqueta <code>&lt;img&gt;</code> o el CSS, se mostrará con ese tamaño intrínseco. En el ejemplo siguiente le hemos dado un borde a la imagen para que puedas ver la extensión del archivo.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/intrinsic-image.html", '100%', 600)}}</p>
+
+<p>Sin embargo, un elemento {{htmlelement ("div")}} vacío no tiene tamaño propio. Si añades un elemento {{htmlelement ("div")}} sin contenido a tu HTML, entonces debes darle un borde como hemos hecho con la imagen y verás una línea en la página. Se trata del borde del elemento replegado sobre sí mismo porque no hay contenido para mantenerlo abierto. En nuestro ejemplo siguiente, ese borde se extiende por todo el ancho del contenedor, porque es un elemento de nivel de bloque, un comportamiento con el que deberías comenzar a familiarizarte. No tiene altura (o tamaño en la dimensión de bloque) porque no hay contenido.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/intrinsic-text.html", '100%', 500)}}</p>
+
+<p>En el ejemplo anterior, añade texto al elemento vacío. Ahora el borde contiene ese texto porque la altura del elemento queda definida por el contenido. Por lo tanto, el tamaño de este elemento <code>&lt;div&gt;</code> en la dimensión del bloque proviene del tamaño del contenido. Nuevamente, este es el tamaño intrínseco del elemento: su tamaño está definido por su contenido.</p>
+
+<h2 id="Configurar_un_tamaño_específico">Configurar un tamaño específico</h2>
+
+<p>Por supuesto, podemos dar a los elementos de nuestro diseño un tamaño específico. Cuando asignas un tamaño a un elemento (al cual deberá ajustarse el contenido del elemento) nos referimos a este como <strong>tamaño extrínseco</strong>. Toma nuestro elemento <code>&lt;div&gt;</code> del ejemplo anterior: podemos darle valores específicos como {{cssxref ("width")}} y {{cssxref ("height")}}, y así tendrá ese tamaño sea cual sea su contenido. Como descubrimos en <a href="/es/docs/Learn/CSS/Building_blocks/Contenido_desbordado">nuestro artículo anterior sobre el desbordamiento</a>, una altura establecida puede causar el desbordamiento del contenido si hay más contenido del que cabe en el elemento.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/height.html", '100%', 600)}}</p>
+
+<p>Debido a este problema de desbordamiento, fijar la altura de los elementos con longitudes o porcentajes es algo que debemos hacer con mucho cuidado en la web.</p>
+
+<h3 id="El_uso_de_porcentajes">El uso de porcentajes</h3>
+
+<p>En muchos sentidos, los porcentajes actúan como unidades de longitud, y como discutimos en el <a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS#Porcentajes">artículo sobre valores y unidades</a>, a menudo se pueden usar indistintamente con longitudes. Cuando usas un porcentaje, debes tener claro de qué es porcentaje. En el caso de una caja dentro de otro contenedor, si a la caja secundaria le asignas un porcentaje al ancho, será un porcentaje del ancho del contenedor principal.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/percent-width.html", '100%', 600)}}</p>
+
+<p>Esto se debe a que los porcentajes se refieren al tamaño del bloque contenedor. Sin un porcentaje aplicado, nuestro elemento <code>&lt;div&gt;</code> ocuparía el 100% del espacio disponible, porque es un elemento de nivel de bloque. Si le damos un ancho porcentual, este se convierte en un porcentaje del espacio que normalmente ocuparía.</p>
+
+<h3 id="Porcentaje_de_márgenes_y_áreas_de_relleno">Porcentaje de márgenes y áreas de relleno</h3>
+
+<p>Si configuras <code>margins</code> y <code>padding</code> como un porcentaje, puede que observes un comportamiento extraño. En el ejemplo siguiente hay una caja. Hemos asignado a la caja interna un margen ({{cssxref ("margin")}}) del 10% y una área de relleno ({{cssxref ("padding")}}) del 10%. El área de relleno y el margen de la parte superior e inferior de la caja son del mismo tamaño que el margen de la izquierda y de la derecha.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/percent-mp.html", '100%', 700)}}</p>
+
+<p>Podrías esperar, por ejemplo, que el porcentaje de los márgenes superior e inferior sea un porcentaje de la altura del elemento, y el porcentaje de los márgenes izquierdo y derecho sea un porcentaje del ancho del elemento. Sin embargo, ¡este no es el caso!</p>
+
+<p>Cuando utilizas el margen y el área de relleno en porcentajes, el valor se calcula a partir del <strong>tamaño en línea</strong> del elemento, es decir, el ancho del elemento cuando se trabaja en un lenguaje horizontal. En nuestro ejemplo, todos los márgenes y el área de relleno son del 10% del ancho del elemento. Esto significa que puedes tener márgenes y relleno alrededor de la caja del mismo tamaño. Este es un hecho que vale la pena recordar si utilizas porcentajes de esta manera.</p>
+
+<h2 id="Tamaños_mínimo_y_máximo">Tamaños mínimo y máximo</h2>
+
+<p>Además de asignar a las cosas un tamaño fijo, podemos pedirle al CSS que asigne a un elemento un tamaño mínimo o máximo. Si tienes una caja que puede contener una cantidad variable de contenido y deseas que tenga siempre <em>al menos</em> una altura determinada, puedes establecer la propiedad {{cssxref ("min-height")}}. La caja siempre tendrá al menos esta altura, pero crecerá si hay más contenido del que la caja puede contener.</p>
+
+<p>En el ejemplo siguiente puedes ver dos cuadros, ambos con una altura definida de 150 píxeles. La caja de la izquierda tiene 150 píxeles de alto; la de la derecha contiene contenido que necesita más espacio, por lo que su tamaño supera los 150 píxeles.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/min-height.html", '100%', 800)}}</p>
+
+<p>Esto es muy útil para trabajar con cantidades de contenido variables y asimismo evitar desbordamientos.</p>
+
+<p>Un uso común de {{cssxref ("max-width")}} es para reducir el tamaño de las imágenes si no hay suficiente espacio para mostrarlas en su ancho intrínseco, al asegurarte de que no serán mayores que ese ancho.</p>
+
+<p>A modo de ejemplo, si para una imagen tienes que establecer <code>width: 100%</code> y su ancho intrínseco es menor que su contenedor, la imagen se verá obligada a expandirse y agrandarse, y se pixelará. Si su ancho intrínseco es mayor que su contenedor, se desbordará. No es probable que desees que suceda ninguno de estos casos.</p>
+
+<p>Si en lugar de ello usas <code>max-width: 100%</code>, la imagen puede encogerse con respecto a su tamaño intrínseco, pero no se agranda más allá del 100% de su tamaño.</p>
+
+<p>En el ejemplo siguiente hemos utilizado la misma imagen dos veces. La primera imagen tiene <code>width: 100%</code> y está en un contenedor que es más grande, por lo que se extiende hasta el ancho del contenedor. La segunda imagen tiene <code>max-width: 100%</code> y, por lo tanto, no se estira para llenar el recipiente. La tercera caja contiene la misma imagen de nuevo, también con <code>max-width: 100%</code>; pero en este caso puedes ver cómo se ha reducido para encajar en la caja.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/max-width.html", '100%', 800)}}</p>
+
+<p>Esta técnica se utiliza para dar a las imágenes una respuesta <em>adaptativa</em>, de modo que se reduzcan adecuadamente cuando se visualizan en un dispositivo más pequeño. Sin embargo, no es conveniente usar esta técnica para cargar imágenes demasiado grandes y luego reducirlas en el navegador. Las imágenes deben tener el tamaño adecuado, no deben ser más grandes de lo que sea necesario para el tamaño más grande que se muestran en el diseño. Descargar imágenes muy grandes ralentizará tu sitio y puede costarles más dinero a los usuarios si tienen una conexión tarifada.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Obtén más información sobre las <a href="/es/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">técnicas adaptativas para las imágenes</a>.</p>
+</div>
+
+<h2 id="Unidades_de_ventana_gráfica">Unidades de ventana gráfica</h2>
+
+<p>La ventana gráfica es el área visible de tu página en el navegador que utilizas para ver un sitio, y también tiene un tamaño. En CSS hay unidades que asociadas con el tamaño de la ventana gráfica: las unidades <code>vw</code> para el ancho y <code>vh</code> para la altura. Con estas unidades puedes establecer tamaños relativos a la ventana gráfica del usuario.</p>
+
+<p><code>1vh</code> es igual al 1% de la altura de visualización, y <code>1vw</code> es igual al 1% de la anchura. Puedes usar estas unidades para dimensionar cajas, pero también texto. En el ejemplo siguiente hay un cuadro que tiene un tamaño de 20vh y 20vw. La caja contiene una letra <code>A</code>, a la que se le ha dado un valor para {{cssxref ("font-size")}} de 10vh.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/sizing/vw-vh.html", '100%', 600)}}</p>
+
+<p><strong>Si cambias los valores <code>vh</code> y <code>vw</code>, cambia el tamaño de la caja o de la letra; cambiar el tamaño de la ventana gráfica también cambia esos tamaños porque están dimensionados en relación con el de la ventana gráfica. Para ver el cambio del ejemplo cuando cambias el tamaño de la ventana gráfica, debes cargar el ejemplo en una ventana nueva del navegador, que pueda cambiar de tamaño (ya que tu ventana gráfica es el <code>&lt;iframe&gt;</code> incrustado que contiene el ejemplo que se muestra arriba). <a href="https://mdn.github.io/css-examples/learn/sizing/vw-vh.html">Abre el ejemplo</a>, cambia el tamaño de la ventana del navegador y observa lo que ocurre con el tamaño de la caja y el texto.</strong></p>
+
+<p>Cambiar los tamaños según la ventana gráfica puede ser útil en tus diseños. Por ejemplo, si deseas mostrar una sección principal a pantalla completa antes del resto del contenido, haz que esa parte de tu página de 100vh empuje el resto del contenido por debajo de la ventana gráfica, de modo que solo aparezca cuando desplacen los contenidos del documento con la barra de desplazamiento.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Este artículo te ha dado un resumen de algunos problemas clave con los que puedes encontrarte al dimensionar cosas en la web. Cuando llegues al artículo <a href="/es/docs/Learn/CSS/CSS_layout">Compaginar con CSS</a>, el tamaño va a ser un aspecto muy importante para dominar los diferentes métodos de compaginación, por lo que, antes de continuar, vale la pena comprender los conceptos que hemos expuesto en este artículo.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Values_and_units", "Learn/CSS/Building_blocks/Images_media_form_elements", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/the_box_model/index.html b/files/es/learn/css/building_blocks/the_box_model/index.html
new file mode 100644
index 0000000000..d0b81d69fe
--- /dev/null
+++ b/files/es/learn/css/building_blocks/the_box_model/index.html
@@ -0,0 +1,344 @@
+---
+title: El modelo de caja
+slug: Learn/CSS/Building_blocks/The_box_model
+translation_of: Learn/CSS/Building_blocks/The_box_model
+original_slug: Learn/CSS/Building_blocks/El_modelo_de_caja
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks")}}</div>
+
+<p>Todo en CSS tiene una caja alrededor, y comprender estas cajas es clave para poder crear diseños con CSS o para alinear elementos con otros elementos. En este artículo, echaremos un vistazo más de cerca al <em>modelo de cajas</em> en CSS con el que vas a poder crear diseños de compaginación más complejos con una comprensión de cómo funciona y la terminología relacionada.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de cómo <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, conocimientos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender sobre el modelo de cajas en CSS, en qué consiste el modelo de cajas y cómo cambiar al modelo alternativo.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Cajas_en_bloque_y_en_línea">Cajas en bloque y en línea</h2>
+
+<p>En CSS, en general, hay dos tipos de cajas: <strong>cajas en bloque</strong> y <strong>cajas en línea</strong>. Estas características se refieren al modo como se comporta la caja en términos de flujo de página y en relación con otras cajas de la página:</p>
+
+<p>Si una caja se define como un bloque, se comportará de las maneras siguientes:</p>
+
+<ul>
+ <li>La caja fuerza un salto de línea al llegar al final de la línea.</li>
+ <li>La caja se extenderá en la dirección de la línea para llenar todo el espacio disponible que haya en su contenedor. En la mayoría de los casos, esto significa que la caja será tan ancha como su contenedor, y llenará el 100% del espacio disponible.</li>
+ <li>Se respetan las propiedades {{cssxref ("width")}} y {{cssxref ("height")}}.</li>
+ <li>El relleno, el margen y el borde mantienen a los otros elementos alejados de la caja.</li>
+</ul>
+
+<p>A menos que decidamos cambiar el tipo de visualización a en línea, elementos como los encabezados (por ejemplo, <code>&lt;h1&gt;</code>) y todos los elementos <code>&lt;p&gt;</code> usan por defecto <code>block</code> como tipo de visualización externa.</p>
+
+<p>Si una caja tiene una visualización externa de tipo <code>inline</code>, entonces:</p>
+
+<ul>
+ <li>La caja no fuerza ningún salto de línea al llegar al final de la línea.</li>
+ <li>Las propiedades {{cssxref ("width")}} y {{cssxref ("height")}} no se aplican.</li>
+ <li>Se aplican relleno, margen y bordes verticales, pero no mantienen alejadas otras cajas en línea.</li>
+ <li>Se aplican relleno, margen y bordes horizontales, y mantienen alejadas otras cajas en línea.</li>
+</ul>
+
+<p>El elemento <code>&lt;a&gt;</code>, que se utiliza para los enlaces, y los elementos <code>&lt;span&gt;</code>, <code>&lt;em&gt;</code> y <code>&lt;strong&gt;</code> son ejemplos de elementos que se muestran en línea por defecto.</p>
+
+<p>El tipo de caja que se aplica a un elemento está definido por los valores de propiedad {{cssxref ("display")}}, como <code>block</code> y <code>inline</code>, y se relaciona con el valor <strong>externo</strong> (<em>outer</em>) de visualización (<code>display</code>).</p>
+
+<h2 id="Aparte_tipos_de_visualización_interna_y_externa">Aparte: tipos de visualización interna y externa</h2>
+
+<p>En este punto, será mejor que también expliquemos los tipos de visualización <strong>interna</strong> y <strong>externa</strong>. Como se mencionó anteriormente, las cajas en CSS tienen un tipo de visualización <em>externa</em>, que define si se trata de una caja en bloque o en línea.</p>
+
+<p>Sin embargo, las cajas también tienen un tipo de visualización <em>interna</em>, que determina cómo se disponen los elementos dentro de esa caja. De forma predeterminada, los elementos dentro de una caja se presentan en <strong><a href="/es/docs/Learn/CSS/CSS_layout/Flujo_normal">flujo normal</a></strong>, lo que significa que se comportan como otros elementos de tipo en bloque o en línea (como se explicó anteriormente).</p>
+
+<p>Sin embargo, podemos cambiar el tipo de visualización interna utilizando valores de <code>display</code>, como <code>flex</code>. Si en un elemento establecemos <code>display: flex;</code>, el tipo de visualización externa es de tipo bloque (<code>block</code>), pero el tipo de visualización interna cambia a flexible (<code>flex</code>). Cualquier elemento que sea hijo directo de esta caja pasará a comportarse como un elemento de tipo flex, de acuerdo con las reglas que se establecen en la especificación de <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a>, tema que veremos más adelante.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Para obtener más información acerca de los valores de visualización y el modo como funcionan las cajas en las disposiciones en bloque y en línea, echa un vistazo a la guía <a href="/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow">Disposiciones en bloque y en línea</a> de MDN.</p>
+</div>
+
+<p>A medida que vayas aprendiendo más detalles sobre el diseño CSS, te irás encontrando con el valor <code>flex</code> y con otros valores internos que puedan presentar tus cajas, por ejemplo, <code><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">grid</a></code>.</p>
+
+<p>Sin embargo, la disposición en bloque y en línea es la forma predeterminada cómo se comportan las cosas en la web; como ya dijimos, a veces esto se conoce como <em>flujo normal</em>, porque nuestras cajas se dispondrán en bloque o en línea, si no reciben ninguna otra instrucción.</p>
+
+<h2 id="Ejemplos_de_diferentes_tipos_de_visualización">Ejemplos de diferentes tipos de visualización</h2>
+
+<p>Sigamos adelante y veamos algunos ejemplos. A continuación tenemos tres elementos HTML diferentes, todos con visualización externa de tipo <code>block</code>. El primero es un párrafo, que tiene un borde añadido con CSS. El navegador representa esto como una caja en bloque, por lo que el párrafo comienza en una línea nueva y se expande por todo el ancho disponible.</p>
+
+<p>El segundo es una lista, que se presenta usando <code>display: flex</code>. Esto establece una disposición flexible para los elementos que están dentro del contenedor; sin embargo, la lista en sí misma es una caja que se comporta en bloque y, como el párrafo, se expande por todo el ancho del contenedor y fuerza un salto de línea al llegar al final de línea.</p>
+
+<p>Debajo hay un párrafo a nivel de bloque, dentro del cual hay dos elementos <code>&lt;span&gt;</code>. Estos elementos normalmente serían de tipo <code>inline</code>; sin embargo, uno de los elementos tiene una clase de bloque, y lo hemos establecido como <code>display: block</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/block.html", '100%', 1000)}} </p>
+
+<p>Podemos ver cómo se comportan los elementos <code>inline</code> en el ejemplo siguiente. Los elementos <code>&lt;span&gt;</code> del primer párrafo están en línea de manera predeterminada y, por lo tanto, no fuerzan ningún salto de línea.</p>
+
+<p>También hay un elemento <code>&lt;ul&gt;</code> que se establece como <code>display: inline-flex</code>, que crea una caja con un comportamiento de tipo en línea alrededor de algunos elementos de tipo <code>flex</code>.</p>
+
+<p>Finalmente, hay dos párrafos configurados con <code>display: inline</code>. El contenedor flexible en línea y los párrafos fluyen todos juntos en línea, en lugar de dividirse en líneas nuevas como lo harían si se mostraran como elementos de bloque.</p>
+
+<p><strong>En el ejemplo puedes cambiar <code>display: inline</code> por <code>display: block</code> o <code>display: inline-flex</code> y por <code>display: flex</code> para alternar entre estos modos de visualización.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline.html", '100%', 1000)}} </p>
+
+<p>En artículos posteriores encontrarás cosas como el diseño flexible. El aspecto clave a recordar aquí es que cambiar el valor de la propiedad <code>display</code> puede cambiar entre el modo de visualización exterior en bloque y en línea de una caja, que cambia la forma en que se presenta junto con otros elementos en la disposición en pantalla.</p>
+
+<p>En el resto de este artículo, nos concentraremos en el tipo de visualización externa.</p>
+
+<h2 id="¿Qué_es_el_modelo_de_cajas_CSS">¿Qué es el modelo de cajas CSS?</h2>
+
+<p>El modelo de cajas CSS completo se aplica a cajas que presentan comportamiento en bloque; las cajas con comportamiento en línea solo usan una parte del comportamiento definido en el modelo de cajas. El modelo define cómo funcionan juntas las diferentes partes de una caja (margen, borde, relleno y contenido) para crear una caja que puedas ver en tu página. Para complicarlo un poco más, hay un modelo de cajas estándar y un modelo de cajas alternativo.</p>
+
+<h3 id="Partes_de_una_caja">Partes de una caja</h3>
+
+<p>Al hacer una caja de tipo bloque en CSS tenemos los elementos siguientes:</p>
+
+<ul>
+ <li>El <strong>contenido de la caja</strong> (o <em>content box</em>): El área donde se muestra el contenido, cuyo tamaño puede cambiarse utilizando propiedades como {{cssxref ("width")}} y {{cssxref ("height")}}.</li>
+ <li>El <strong>relleno de la caja</strong> (o <em>padding box</em>): El relleno es espacio en blanco alrededor del contenido; es posible controlar su tamaño usando la propiedad {{cssxref ("padding")}} y otras propiedades relacionadas.</li>
+ <li>El <strong>borde de la caja</strong> (o <em>border box</em>): El borde de la caja envuelve el contenido y el de relleno. Es posible controlar su tamaño y estilo utilizando la propiedad {{cssxref ("border")}} y otras propiedades relacionadas.</li>
+ <li>El <strong>margen de la caja</strong> (o <em>margin box</em>): El margen es la capa más externa. Envuelve el contenido, el relleno y el borde como espacio en blanco entre la caja y otros elementos. Es posible controlar su tamaño usando la propiedad {{cssxref ("margin")}} y otras propiedades relacionadas.</li>
+</ul>
+
+<p>El diagrama siguiente muestra estas capas:</p>
+
+<p><img alt="Diagrama del modelo de cajas" src="https://mdn.mozillademos.org/files/16558/box-model.png" style="height: 300px; width: 544px;"></p>
+
+<h3 id="El_modelo_de_cajas_CSS_estándar">El modelo de cajas CSS estándar</h3>
+
+<p>En el modelo de cajas estándar, cuando estableces los atributos <code>width</code> y <code>height</code> para una caja, defines el ancho y el alto del <em>contenido de la caja</em>. Cualquier área de relleno y borde se añade a ese ancho y alto para obtener el tamaño total que ocupa la caja. Esto se muestra en la imagen que encontrarás a continuación.</p>
+
+<p>Si suponemos que la caja tiene el CSS siguiente, que establece los valores para las propiedades <code>width</code>, <code>height</code>, <code>margin</code>, <code>border</code>, y <code>padding</code>:</p>
+
+<pre class="brush: css notranslate">.box {
+  width: 350px;
+  height: 150px;
+  margin: 10px;
+  padding: 25px;
+  border: 5px solid black;
+}
+</pre>
+
+<p>El espacio que ocupa nuestra caja usando el modelo de cajas estándar será en realidad de 410 px (350 + 25 + 25 + 5 + 5); y su altura, de 210 px (150 + 25 + 25 + 5 + 5), porque el área de relleno y el borde se añaden al ancho que se utiliza para el contenido de la caja.</p>
+
+<p><img alt="Mostrar el tamaño de la caja cuando se usa el modelo de cajas estándar." src="https://mdn.mozillademos.org/files/16559/standard-box-model.png" style="height: 300px; width: 500px;"></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: El margen no se cuenta para el tamaño real de la caja; por supuesto, afecta al espacio total que la caja ocupa en la página, pero solo al espacio de fuera de la caja. El área de la caja se termina en el borde, no se extiende hasta el margen.</p>
+</div>
+
+<h3 id="El_modelo_de_cajas_CSS_alternativo">El modelo de cajas CSS alternativo</h3>
+
+<p>Podrías pensar que es más bien incómodo tener que sumar el borde y el área de relleno para obtener el tamaño real de la caja, ¡y tienes razón! Por este motivo, CSS introdujo un modelo de caja alternativo algún tiempo después del modelo de cajas estándar. Con este modelo, cualquier ancho es el ancho de la caja visible en la página, por lo tanto, el ancho del área de contenido es ese ancho menos el ancho para el relleno y el borde. El mismo CSS que hemos usado antes daría entonces el resultado siguiente (ancho = 350 px, altura = 150 px).</p>
+
+<p><img alt="Mostrar el tamaño de la caja cuando se usa el modelo de cajas alternativo." src="https://mdn.mozillademos.org/files/16557/alternate-box-model.png" style="height: 240px; width: 440px;"></p>
+
+<p>Por defecto, los navegadores usan el modelo de cajas estándar. Si deseas activar el modelo de cajas alternativo para un elemento, hazlo configurando <code>box-sizing: border-box</code>. Con ello, le dices al navegador que tome como el borde de la caja el área definida por cualquier tamaño que establezcas.</p>
+
+<pre class="brush: css notranslate"><code>.box {
+  box-sizing: border-box;
+} </code></pre>
+
+<p>Si quieres que todos tus elementos usen el modelo de cajas alternativo (opción común entre los desarrolladores) debes establecer la propiedad <code>box-sizing</code> en el elemento <code>&lt;html&gt;</code>. Luego debes configurar todos los demás elementos para que hereden ese valor, como se ve en el fragmento de código siguiente. Si deseas comprender qué hay detrás, consulta el <a href="https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/">artículo de <em>CSS-Tricks</em> sobre el tamaño de las cajas</a>.</p>
+
+<pre class="brush: css notranslate"><code class="language-css"><span class="selector token">html</span> <span class="punctuation token">{</span>
+  <span class="property token">box-sizing</span><span class="punctuation token">:</span> border-box<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+<span class="selector token">*, *<span class="pseudo-element token">::before</span>, *<span class="pseudo-element token">::after</span></span> <span class="punctuation token">{</span>
+  <span class="property token">box-sizing</span><span class="punctuation token">:</span> inherit<span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Un dato curioso es que Internet Explorer usaba por defecto el modelo de cajas alternativo, y no disponía de ningún mecanismo para cambiarlo.</p>
+</div>
+
+<h2 id="Jugar_con_los_modelos_de_cajas">Jugar con los modelos de cajas</h2>
+
+<p>En el ejemplo siguiente puedes ver dos cajas. Ambas tienen una clase <code>.box</code>, lo que les da los mismos atributos <code>width</code>, <code>height</code>, <code>margin</code>, <code>border</code> y <code>padding</code>. La única diferencia es que la segunda caja se ha configurado para utilizar el modelo de cajas alternativo.</p>
+
+<p><strong>¿Puedes cambiar el tamaño de la segunda caja (añadiendo CSS a la clase <code>.alternate</code>) para que su anchura y altura coincidan con las de la primera caja?</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/box-models.html", '100%', 1000)}} </p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar la solución <a href="https://github.com/mdn/css-examples/blob/master/learn/solutions.md#the-box-model">aquí</a>.</p>
+</div>
+
+<h3 id="Utilizar_las_DevTools_del_navegador_para_ver_el_modelo_de_cajas">Utilizar las DevTools del navegador para ver el modelo de cajas</h3>
+
+<p>Las <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">herramientas del desarrollador de tu navegador</a> pueden facilitar la comprensión del modelo de cajas. Si inspeccionas un elemento con las DevTools de Firefox, puedes ver el tamaño del elemento más su margen, área de relleno y borde. Inspeccionar un elemento de esta manera es un modo excelente de descubrir si tu caja es en realidad del tamaño que crees que es.</p>
+
+<p><img alt="Inspeccionar el modelo de cajas de un elemento utilizando Firefox DevTools" src="https://mdn.mozillademos.org/files/16560/box-model-devtools.png" style="height: 683px; width: 1150px;"></p>
+
+<h2 id="Márgenes_relleno_y_bordes">Márgenes, relleno y bordes</h2>
+
+<p>Ya has visto las propiedades {{cssxref ("margin")}}, {{cssxref ("padding")}} y {{cssxref ("border")}} que usamos en el ejemplo anterior. Las propiedades que hemos usado en ese ejemplo son <strong>propiedades abreviadas</strong> y nos permiten establecer los cuatro lados de la caja a la vez. Estas propiedades abreviadas también tienen propiedades sin abreviar equivalentes, que permiten tener control sobre los diferentes lados de la caja de forma individual.</p>
+
+<p>Vamos a explorar estas propiedades más detalladamente.</p>
+
+<h3 id="Margen">Margen</h3>
+
+<p>El margen es un espacio invisible que hay alrededor de la caja. Aleja el resto de elementos de la caja. Los márgenes pueden tener valores positivos o negativos. Establecer un margen negativo para un lado de tu caja puede hacer que se superponga con otros elementos de la página. Tanto si utilizas el modelo de cajas estándar como el alternativo, el margen siempre se añade después de haber calculado el tamaño de la caja que se ve.</p>
+
+<p>Podemos controlar todos los márgenes de un elemento a la vez usando la propiedad {{cssxref ("margin")}}, o cada lado individualmente usando las propiedades equivalentes sin abreviar:</p>
+
+<ul>
+ <li>{{cssxref("margin-top")}}</li>
+ <li>{{cssxref("margin-right")}}</li>
+ <li>{{cssxref("margin-bottom")}}</li>
+ <li>{{cssxref("margin-left")}}</li>
+</ul>
+
+<p><strong>En el ejemplo siguiente, cambia los valores de margen para ver cómo se empuja la caja debido al espacio que el margen crea o se elimina (si es un margen negativo) entre este elemento y el elemento que lo contiene.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/margin.html", '100%', 1000)}} </p>
+
+<h4 id="Colapso_del_margen">Colapso del margen</h4>
+
+<p>Un punto clave a la hora de entender los márgenes es el concepto de colapso del margen. Si tienes dos elementos cuyos márgenes se tocan, esos márgenes se combinan para convertirse en un solo margen, cuyo tamaño es el del margen más grande.</p>
+
+<p>En el ejemplo siguiente hay dos párrafos. El párrafo superior tiene un atributo <code>margin-bottom</code> de 50 píxeles. El segundo párrafo tiene un atributo <code>margin-top</code> de 30 píxeles. Los márgenes colapsan, por lo que el margen real entre las cajas es de 50 píxeles, y no el total de ambos márgenes.</p>
+
+<p><strong>Pruébalo ajustando el atributo <code>margin-top</code> del segundo párrafo a 0. El margen visible entre los dos párrafos no cambiará, sino que conservará los 50 píxeles fijados en el atributo <code>bottom-margin</code> del primer párrafo.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/margin-collapse.html", '100%', 1000)}} </p>
+
+<p>Hay una serie de reglas que establecen cuándo los márgenes colapsan y cuándo no. Para obtener más información, consulta la página web sobre <a href="/es/docs/Web/CSS/CSS_Modelo_Caja/Mastering_margin_collapsing">entender el colapso de márgenes</a>. Por ahora solo debes recordar que el colapso de los márgenes es algo que puede suceder. Si creas un espacio con márgenes y no obtienes el espacio que esperas, probablemente es que se haya producido algún colapso de márgenes.</p>
+
+<h3 id="Bordes">Bordes</h3>
+
+<p>El borde se dibuja entre el margen y el área de relleno de una caja. Si utilizas el modelo de cajas estándar, el tamaño del borde se añade a los elementos <code>width</code> y <code>height</code> que establecen el alto y el ancho de la caja. Si utilizas el modelo de cajas alternativo, el tamaño del borde reduce el tamaño de la caja de contenido, porque ocupa una parte del alto y el ancho disponibles.</p>
+
+<p>Hay una gran cantidad de propiedades que sirven para aplicar estilo a los bordes: hay cuatro bordes y cada borde tiene un estilo, un ancho y un color que podemos modificar.</p>
+
+<p>Puedes establecer el ancho, el estilo o el color de los cuatro bordes a la vez utilizando la propiedad {{cssxref ("border")}}.</p>
+
+<p>Para establecer las propiedades de cada lado de forma individual, puedes utilizar:</p>
+
+<ul>
+ <li>{{cssxref("border-top")}}</li>
+ <li>{{cssxref("border-right")}}</li>
+ <li>{{cssxref("border-bottom")}}</li>
+ <li>{{cssxref("border-left")}}</li>
+</ul>
+
+<p>Para establecer el ancho, el estilo o el color de todos los lados, usa lo siguiente:</p>
+
+<ul>
+ <li>{{cssxref("border-width")}}</li>
+ <li>{{cssxref("border-style")}}</li>
+ <li>{{cssxref("border-color")}}</li>
+</ul>
+
+<p>Para establecer el ancho, el estilo o el color de un solo lado, puedes usar una de las propiedades no abreviadas:</p>
+
+<ul>
+ <li>{{cssxref("border-top-width")}}</li>
+ <li>{{cssxref("border-top-style")}}</li>
+ <li>{{cssxref("border-top-color")}}</li>
+ <li>{{cssxref("border-right-width")}}</li>
+ <li>{{cssxref("border-right-style")}}</li>
+ <li>{{cssxref("border-right-color")}}</li>
+ <li>{{cssxref("border-bottom-width")}}</li>
+ <li>{{cssxref("border-bottom-style")}}</li>
+ <li>{{cssxref("border-bottom-color")}}</li>
+ <li>{{cssxref("border-left-width")}}</li>
+ <li>{{cssxref("border-left-style")}}</li>
+ <li>{{cssxref("border-left-color")}}</li>
+</ul>
+
+<p><strong>En el ejemplo siguiente, hemos utilizado varios ejemplos de la lista anterior para crear bordes. Juega con las diferentes propiedades para comprobar que entiendes cómo funcionan. Las páginas de MDN sobre las propiedades de los bordes te proporcionan información sobre los diferentes estilos entre los que puedes elegir para los bordes.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/border.html", '100%', 1000)}} </p>
+
+<h3 id="Relleno">Relleno</h3>
+
+<p>El relleno se encuentra entre el borde y el área de contenido. A diferencia de los márgenes, el relleno no puede tomar valores negativos, por lo que el valor debe ser 0 o positivo. Cualquier fondo aplicado a tu elemento se mostrará detrás del área de relleno y, generalmente, se usa para mantener el contenido alejado del borde.</p>
+
+<p>Podemos controlar el área de relleno para todos los lados de un mismo elemento usando la propiedad {{cssxref ("padding")}}, o para cada lado uno de los lados usando las propiedades equivalentes:</p>
+
+<ul>
+ <li>{{cssxref("padding-top")}}</li>
+ <li>{{cssxref("padding-right")}}</li>
+ <li>{{cssxref("padding-bottom")}}</li>
+ <li>{{cssxref("padding-left")}}</li>
+</ul>
+
+<p><strong>Si cambias los valores para el elleno en la clase <code>.box</code> del ejemplo siguiente, puedes ver que cambia dónde comienza el texto en relación con la caja.</strong></p>
+
+<p><strong>También puedes cambiar el relleno en la clase <code>.container</code>, que abrirá el espacio entre el contenedor y la caja. El área de relleno se puede cambiar para cualquier elemento y abrirá espacio entre su borde y lo que esté dentro del elemento.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/padding.html", '100%', 800)}} </p>
+
+<h2 id="El_modelo_de_cajas_y_las_cajas_en_línea">El modelo de cajas y las cajas en línea</h2>
+
+<p>Todo lo anterior se aplica por completo a las cajas en bloque. Algunas de las propiedades también pueden aplicarse a las cajas en línea, como las que crea un elemento <code>&lt;span&gt;</code>.</p>
+
+<p>En el ejemplo siguiente hay un elemento <code>&lt;span&gt;</code> dentro de un párrafo al que hemos aplicado las propiedades <code>width</code>, <code>height</code>, <code>margin</code>, <code>border</code>, y <code>padding</code> Puedes ver que la anchura y la altura se ignoran. Se respetan el margen, el relleno y el borde, pero no cambian la relación de otro contenido con respecto a nuestra caja en línea, por lo que el relleno y el borde se superponen a otras palabras en el párrafo.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline-box-model.html", '100%', 800)}} </p>
+
+<h2 id="El_uso_de_display_inline-block">El uso de display: inline-block</h2>
+
+<p>Hay un valor especial de <code>display</code> que proporciona un punto medio entre <code>inline</code> y <code>block</code>. Esto es útil para situaciones en las que no deseas que un elemento fuerce un salto de línea, pero sí deseas que se respeten las propiedades <code>width</code> y <code>height</code> para evitar superposiciones como la que se ve arriba.</p>
+
+<p>Un elemento con <code>display: inline-block</code> conforma un subconjunto de los elementos en bloque que ya conocemos:</p>
+
+<ul>
+ <li>Se respetan las propiedades de ancho y alto.</li>
+ <li>El relleno, el margen y el borde mantienen los otros elementos alejados de la caja.</li>
+</ul>
+
+<p>Sin embargo, no se fuerza un salto de línea, y solo se hace más grande que su contenido si añades las propiedades <code>width</code> y <code>height</code> explícitamente.</p>
+
+<p><strong>En el ejemplo siguiente hemos añadido <code>display: inline-block</code> a nuestro elemento <code>&lt;span&gt;</code>. Cámbialo por <code>display: block</code> o elimina la línea para ver la diferencia entre ambos modelos de visualización.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline-block.html", '100%', 800)}} </p>
+
+<p>Esto puede ser útil cuando deseas dar a un enlace un área de impacto más grande añadiendo <code>padding</code>. <code>&lt;a&gt;</code> es un elemento en línea como <code>&lt;span&gt;</code>; puedes usar <code>display: inline-block</code> para configurar el área de relleno para facilitar al usuario hacer clic en el enlace.</p>
+
+<p>Esto se ve con bastante frecuencia en las barras de navegación. La navegación siguiente se muestra en una fila usando <code>flexbox</code> y hemos añadido una área de relleno al elemento <code>&lt;a&gt;</code> porque queremos poder cambiar su color de fondo (<code>background-color</code>) cuando se pasa el ratón por encima de <code>&lt;a&gt;</code>. El área de relleno parece superponerse al borde del elemento <code>&lt;ul&gt;</code>. Esto se debe a que <code>&lt;a&gt;</code> es un elemento en línea.</p>
+
+<p><strong>Añade <code>display: inline-block</code> a la regla con el selector <code>.links-list a</code> y verás cómo se soluciona este problema, al hacer que otros elementos respeten el área de relleno.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/box-model/inline-block-nav.html", '100%', 600)}} </p>
+
+<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
+
+<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más relevante? Encontrarás más pruebas para verificar que has retenido esa información en <a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Box_Model_Tasks">Test your skills: The Box Model</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Eso es lo que hay que entender sobre el modelo de cajas. Es posible que en el futuro desees volver a este artículo si alguna vez te lías con los tamaños de las cajas en la disposición de tu página web.</p>
+
+<p>En el artículo siguiente veremos cómo se pueden usar los <a href="/es/docs/Learn/CSS/Building_blocks/Fondos_y_bordes">fondos y bordes</a> para hacer que tus simples cajas presenten un aspecto más interesante.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Selectors/Combinators", "Learn/CSS/Building_blocks/Backgrounds_and_borders", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de cajas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS </a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/building_blocks/valores_y_unidades_css/index.html b/files/es/learn/css/building_blocks/valores_y_unidades_css/index.html
deleted file mode 100644
index 4470746bc8..0000000000
--- a/files/es/learn/css/building_blocks/valores_y_unidades_css/index.html
+++ /dev/null
@@ -1,392 +0,0 @@
----
-title: Valores y unidades CSS
-slug: Learn/CSS/Building_blocks/Valores_y_unidades_CSS
-translation_of: Learn/CSS/Building_blocks/Values_and_units
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks")}}</div>
-
-<p>Todas las propiedades que se utilizan en CSS tienen un valor o un conjunto de valores que esa propiedad admite, y echar un vistazo a cualquier página de propiedades en MDN te ayudará a comprender qué valores admite una propiedad en particular. En este artículo veremos algunos de los valores y unidades más comunes en uso.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Conocer los diferentes tipos de valores y unidades que admiten las propiedades CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_un_valor_CSS">¿Qué es un valor CSS?</h2>
-
-<p>En las especificaciones CSS y en las páginas de propiedades de este proyecto MDN, podrás detectar los valores porque estarán escritos entre corchetes angulares, como <code><a href="/en-US/docs/Web/CSS/color_value">&lt;color&gt;</a></code> o <code><a href="/en-US/docs/Web/CSS/length">&lt;length&gt;</a></code>. Cuando veas que el valor <code>&lt;color&gt;</code> es válido para una propiedad en particular, significa que para esa propiedad puedes usar como valor cualquier color válido de entre los que se enumeran en la página de referencia de la propiedad <code><a href="/en-US/docs/Web/CSS/color_value">&lt;color&gt;</a></code>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: También verás valores CSS denominados <em>tipos de datos</em>. Los términos son básicamente intercambiables: cuando veas algo en CSS denominado ‘tipo de datos’, en realidad es solo una forma elegante de decir ‘valor’.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Sí, hay una tendencia de denotar los valores CSS entre corchetes angulares, para diferenciarlos de las propiedades CSS (por ejemplo, la propiedad {{cssxref ("color")}} con respecto al tipo de dato <a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a>). Aunque podría generarte confusión entre los tipos de datos CSS y los elementos HTML, porque ambos usan corchetes angulares, es poco probable porque se usan en contextos muy diferentes.</p>
-</div>
-
-<p>En el ejemplo siguiente hemos establecido el color de nuestro encabezado con una palabra clave y el fondo con la función <code>rgb()</code>:</p>
-
-<pre class="brush: css notranslate"><code>h1 {
-  color: black;
-  background-color: rgb(197,93,161);
-} </code>
-</pre>
-
-<p>Un valor en CSS es una forma de definir una colección de subvalores admitidos. Esto significa que si ves <code>&lt;color&gt;</code> como válido, no necesitas preguntarte cuáles de los diferentes tipos de valor de color puedes usar: palabras clave, valores hexadecimales, funciones <code>rgb()</code>, etc. Puedes usar <em>cualquier</em> valor <code>&lt;color&gt;</code> disponible siempre que tu navegador lo admita. La página de MDN te dará información sobre lo que admite cada navegador para cada valor. Por ejemplo, puedes ver que en la sección de compatibilidad de navegadores de la página para <code><a href="/en-US/docs/Web/CSS/color_value">&lt;color&gt;</a></code> se enumeran diferentes tipos de valores de color y los navegadores que los admiten.</p>
-
-<p>Echemos un vistazo a algunos de los tipos de valores y unidades con los que puedes encontrar con frecuencia, con ejemplos para que puedas probar diferentes valores posibles.</p>
-
-<h2 id="Números_longitudes_y_porcentajes">Números, longitudes y porcentajes</h2>
-
-<p>Al utilizar CSS te puedes encontrar con varios tipos de datos numéricos. Todos los siguientes están clasificados como tipos de datos numéricos:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Tipo de datos</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code><a href="/es/docs/Web/CSS/integer">&lt;integer&gt;</a></code></td>
-   <td>Un <code>&lt;integer&gt;</code> es un número entero, como <code>1024</code> o <code>-55</code>.</td>
-  </tr>
-  <tr>
-   <td><code><a href="/es/docs/Web/CSS/number">&lt;number&gt;</a></code></td>
-   <td>Un <code>&lt;number&gt;</code> representa un número decimal; puede tener o no un punto de separación decimal con un componente fraccionario, por ejemplo: <code>0,255</code>, <code>128</code> o <code>-1,2</code>.</td>
-  </tr>
-  <tr>
-   <td><code>&lt;dimension&gt;</code></td>
-   <td>Una <code>&lt;dimension&gt;</code> es un <code>&lt;number&gt;</code> con una unidad asociada, por ejemplo: <code>45deg</code> (grados), <code>5s</code> (segundos) o <code>10px</code> (píxeles). <code>&lt;dimension&gt;</code> es una categoría general que incluye los tipos <code><a href="/es/docs/Web/CSS/length">&lt;length&gt;</a></code>, <code><a href="/es/docs/Web/CSS/angle">&lt;angle&gt;</a></code>, <code><a href="/es/docs/Web/CSS/time">&lt;time&gt;</a></code> y <code><a href="/es/docs/Web/CSS/resolución">&lt;resolution&gt;</a></code><a href="/en-US/docs/Web/CSS/resolution">.</a></td>
-  </tr>
-  <tr>
-   <td><code><a href="/en-US/docs/Web/CSS/percentage">&lt;percentage&gt;</a></code></td>
-   <td>Un <code>&lt;percentage&gt;</code> representa una fracción de algún otro valor, por ejemplo, <code>50%</code>. Los valores de porcentaje siempre son relativos a otra cantidad, por ejemplo, la longitud de un elemento es relativa a la longitud de su elemento padre.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Longitudes">Longitudes</h3>
-
-<p>El tipo numérico con el que te vas a encontrar con mayor frecuencia es <code>&lt;length&gt;</code>, por ejemplo, <code>10px</code> (píxeles) o <code>30em</code>. En CSS se utilizan dos longitudes diferentes: relativa y absoluta. Es importante conocer la diferencia para entender qué dimensiones van a tener las cosas.</p>
-
-<h4 id="Unidades_de_longitud_absoluta">Unidades de longitud absoluta</h4>
-
-<p>Todas las unidades siguientes son unidades de longitud <strong>absoluta</strong>: no son relativas a nada más y en general se considera que siempre tienen el mismo tamaño.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Unidad</th>
-   <th scope="col">Nombre</th>
-   <th scope="col">Equivale a</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>cm</code></td>
-   <td>Centímetros</td>
-   <td>1cm = 96px/2,54</td>
-  </tr>
-  <tr>
-   <td><code>mm</code></td>
-   <td>Milímetros</td>
-   <td>1mm = 1/10 de 1cm</td>
-  </tr>
-  <tr>
-   <td><code>Q</code></td>
-   <td>Cuartos de milímetros</td>
-   <td>1Q = 1/40 de 1cm</td>
-  </tr>
-  <tr>
-   <td><code>in</code></td>
-   <td>Pulgadas</td>
-   <td>1in = 2,54cm = 96px</td>
-  </tr>
-  <tr>
-   <td><code>pc</code></td>
-   <td>Picas</td>
-   <td>1pc = 1/16 de 1in</td>
-  </tr>
-  <tr>
-   <td><code>pt</code></td>
-   <td>Puntos</td>
-   <td>1pt = 1/72 de 1in</td>
-  </tr>
-  <tr>
-   <td><code>px</code></td>
-   <td>Píxeles</td>
-   <td>1px = 1/96 de 1in</td>
-  </tr>
- </tbody>
-</table>
-
-<p>La mayoría de estos valores son más útiles cuando se usan en una salida en formato impreso que en la salida de pantalla. Por ejemplo, normalmente no usamos <code>cm</code> (centímetros) en pantalla. El único valor que usarás de forma frecuente es <code>px</code> (píxeles).</p>
-
-<h4 id="Unidades_de_longitud_relativa">Unidades de longitud relativa</h4>
-
-<p>Las unidades de longitud relativa son relativas a algo más, por ejemplo, al tamaño de letra del elemento principal o al tamaño de la ventana gráfica. La ventaja de usar unidades relativas es que con una planificación cuidadosa puedes lograr que el tamaño del texto u otros elementos escalen en relación con todo lo demás en la página. En la tabla siguiente se enumeran algunas de las unidades más útiles para el desarrollo web.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Unidad</th>
-   <th scope="col">Relativa a</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>em</code></td>
-   <td>Tamaño de letra del elemento padre, en el caso de propiedades tipográficas como {{cssxref("font-size")}}, y tamaño de la fuente del propio elemento en el caso de otras propiedades, como {{cssxref("width")}}.</td>
-  </tr>
-  <tr>
-   <td><code>ex</code></td>
-   <td>Altura x de la fuente del elemento.</td>
-  </tr>
-  <tr>
-   <td><code>ch</code></td>
-   <td>La medida de avance (ancho) del glifo "0" de la letra del elemento.</td>
-  </tr>
-  <tr>
-   <td><code>rem</code></td>
-   <td>Tamaño de la letra del elemento raíz.</td>
-  </tr>
-  <tr>
-   <td><code>lh</code></td>
-   <td>Altura de la línea del elemento.</td>
-  </tr>
-  <tr>
-   <td><code>vw</code></td>
-   <td>1% del ancho de la ventana gráfica.</td>
-  </tr>
-  <tr>
-   <td><code>vh</code></td>
-   <td>1% de la altura de la ventana gráfica.</td>
-  </tr>
-  <tr>
-   <td><code>vmin</code></td>
-   <td>1% de la dimensión más pequeña de la ventana gráfica.</td>
-  </tr>
-  <tr>
-   <td><code>vmax</code></td>
-   <td>1% de la dimensión más grande de la ventana gráfica.</td>
-  </tr>
- </tbody>
-</table>
-
-<h4 id="Un_ejemplo_de_análisis">Un ejemplo de análisis</h4>
-
-<p>En el ejemplo siguiente puedes ver cómo se comportan algunas unidades de longitud relativa y absoluta. La primera caja tiene un ancho ({{cssxref ("width")}}) establecido en píxeles. Como unidad absoluta, este ancho será siempre el mismo aunque lo demás cambie.</p>
-
-<p>La segunda caja tiene un ancho establecido en unidades <code>vw</code> (ancho de ventana). Este valor es relativo al ancho de la ventana gráfica, por lo que 10vw es el 10 por ciento del ancho de la ventana gráfica. Si cambiases el ancho de la ventana de tu navegador, el tamaño de la caja cambiaría. Sin embargo, esto no te va a funcionar porque este ejemplo se ha incrustado en la página usando <code><a href="/en-US/docs/Web/HTML/Element/iframe">&lt;iframe&gt;</a></code>. Para verlo en acción debes <a href="https://mdn.github.io/css-examples/learn/values-units/length.html">probar el ejemplo después de abrirlo en una pestaña independiente de tu navegador</a>.</p>
-
-<p>La tercera caja utiliza unidades <code>em</code>. Son unidades relativas al tamaño de la letra. Hemos establecido un tamaño de fuente de <code>1em</code> en el contenido {{htmlelement ("div")}}, que tiene una clase <code>.wrapper</code>. Si cambias este valor a <code>1.5em</code>, verás que el tamaño de letra de todos los elementos aumenta, pero solo se amplía el ancho en el último elemento, porque el ancho es relativo a ese tamaño de letra.</p>
-
-<p>Después de seguir las instrucciones anteriores, juega un poco más con los valores para ver qué obtienes.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/length.html", '100%', 820)}}</p>
-
-<h4 id="ems_y_rems">ems y rems</h4>
-
-<p><code>em</code> y <code>rem</code> son las dos longitudes relativas que es probable que encuentres con mayor frecuencia al cambiar el tamaño de cualquier cosa, de cajas a texto. Vale la pena entender cómo funcionan y las diferencias entre ellos, especialmente cuando comienzas a abordar temas más complejos como <a href="/es/docs/Learn/CSS/Styling_text">aplicar estilos a texto</a> o <a href="/es/docs/Learn/CSS/CSS_layout">compaginar con CSS</a>. El ejemplo siguiente te proporciona una muestra.</p>
-
-<p>El HTML es un conjunto de listas anidadas: hay tres listas en total y ambos ejemplos tienen el mismo HTML. La única diferencia es que el primero tiene una clase <em>ems</em> y el segundo una clase <em>rems</em>.</p>
-
-<p>Para empezar, configuramos un tamaño de letra de 16px en el elemento <code>&lt;html&gt;</code>.</p>
-
-<p><strong>En definitiva, la unidad <em>em</em> significa «el tamaño de letra de mi elemento padre»</strong>. Los elementos {{htmlelement ("li")}} dentro de un elemento {{htmlelement ("ul")}} con una clase de <code>ems</code> toman el tamaño con respecto a su elemento padre. Por lo tanto, en cada nivel de anidamiento sucesivo, el tamaño de letra aumenta progresivamente, porque en cada uno el tamaño de letra está establecido en <code>1.3em</code> (1,3 veces el tamaño de letra de su elemento padre).</p>
-
-<p><strong>En definitiva, la unidad <em>rem</em> significa «el tamaño de letra del elemento raíz»</strong>. (‘rem’ viene de «root em»). Los elementos {{htmlelement ("li")}} dentro de un elemento {{htmlelement ("ul")}} con una clase de <code>rems</code> toman su tamaño del elemento raíz (<code>&lt;html&gt;</code>). Esto significa que el tamaño de letra no aumenta en cada nivel sucesivo de anidamiento.</p>
-
-<p>Sin embargo, si cambias el atributo <code>font-size</code> de <code>&lt;html&gt;</code> en el CSS, verás que todo lo demás cambia en relación con él, tanto la letra cuyo tamaño está especificado en unidades <code>rem</code> como la que lo está en unidades <code>em</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/em-rem.html", '100%', 1000)}} </p>
-
-<h3 id="Porcentajes">Porcentajes</h3>
-
-<p>En muchos casos, un porcentaje es tratado de la misma manera que una longitud. Lo que sucede con los porcentajes es que siempre se establecen en relación con otro valor. Por ejemplo, si estableces el atributo <code>font-size</code> de un elemento como un porcentaje, será un porcentaje del <code>font-size</code> del elemento padre. Si usas un porcentaje para un valor <code>width</code>, será un porcentaje del atributo <code>width</code> del elemento padre.</p>
-
-<p>En el ejemplo siguiente, las dos cajas con el tamaño especificado en unidades de porcentaje y las dos cajas con el tamaño especificado en unidades de píxel tienen los mismos nombres de clase. En ambos conjuntos de cajas, los anchos de las cajas son de 200 píxeles y de 40%, respectivamente.</p>
-
-<p>La diferencia es que el segundo conjunto de dos cajas está dentro de un contenedor que tiene 400 píxeles de ancho. La segunda caja de 200 px de ancho tiene el mismo ancho que la primera, pero la segunda caja de 40% ahora es el 40% de 400 px, ¡mucho más estrecha que la primera!</p>
-
-<p><strong>Cambia el ancho del contenedor o el valor de porcentaje para ver cómo funciona.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/percentage.html", '100%', 850)}} </p>
-
-<p>El ejemplo siguiente tiene tamaños de letra establecidos en porcentajes. Cada elemento <code>&lt;li&gt;</code> tiene un atributo <code>font-size</code> del 80%, por lo tanto, los elementos de la lista anidada se vuelven progresivamente más pequeños a medida que heredan su tamaño del elemento padre.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/percentage-fonts.html", '100%', 650)}} </p>
-
-<p>Observa que aunque muchos valores admiten unidades de longitud o porcentaje, algunos solo admiten unidades de longitud. Puedes ver qué valores admite cada propiedad en las páginas de referencia correspondientes del proyecto MDN. Si el valor admitido incluye <code><a href="/en-US/docs/Web/CSS/length-percentage">&lt;length-percentage&gt;</a></code>, puedes usar una unidad de longitud o un porcentaje. Si el valor admitido solo incluye <code>&lt;length&gt;</code>, no es posible utilizar un porcentaje.</p>
-
-<h3 id="Números">Números</h3>
-
-<p>Algunos valores aceptan números sin ninguna unidad asociada. Un ejemplo de una propiedad que acepta un número sin unidades es la propiedad <code>opacity</code>, que controla la opacidad de un elemento (cuán transparente es). Esta propiedad admite un número entre <code>0</code> (totalmente transparente) y <code>1</code> (totalmente opaco).</p>
-
-<p><strong>En el ejemplo siguiente, asigna al valor de <code>opacity</code> diversos valores decimales entre <code>0</code> y <code>1</code> para ver cómo la caja y su contenido cambian su opacidad.</strong></p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/opacity.html", '100%', 500)}} </p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Cuando en CSS utilizas un número como valor, no debe estar entre comillas.</p>
-</div>
-
-<h2 id="Color">Color</h2>
-
-<p>En CSS hay muchas formas de especificar el color, algunas de las cuales se implementaron más recientemente que otras. En todas partes en CSS se pueden usar los mismos valores de color, tanto para especificar el color del texto como el color de fondo, o de cualquier otra cosa.</p>
-
-<p>El sistema de colores estándar disponible en los ordenadores modernos es de 24 bits, lo que permite visualizar aproximadamente 16,7 millones de colores distintos a partir de una combinación de diferentes canales de rojo, verde y azul con 256 valores diferentes por canal (256 x 256 x 256 = 16.777.216). Echemos un vistazo a algunas de las formas en que podemos especificar colores en CSS.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: En este artículo vamos a ver los métodos comunes para especificar colores que admiten los navegadores; hay otros métodos no tan comunes que no admiten todos los navegadores.</p>
-</div>
-
-<h3 id="Palabras_clave_para_los_colores">Palabras clave para los colores</h3>
-
-<p>Muy a menudo, en los ejemplos de este artículo o en cualquier otra página de MDN, verás que se utilizan las palabras clave para los colores, ya que son una forma simple y comprensible de especificar colores. Hay una multitud de estas palabras clave, ¡algunas de las cuales tienen nombres de lo más curiosos! Puedes ver una lista completa en la página para el valor <code><a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a></code>.</p>
-
-<p><strong>Juega con diferentes valores de color en los ejemplos en vivo que encontrarás a continuación, para adquirir una idea más clara de cómo funcionan.</strong></p>
-
-<h3 id="Los_valores_hexadecimales_RGB">Los valores hexadecimales RGB</h3>
-
-<p>El siguiente tipo de valores de color que es probable que encuentres son los códigos hexadecimales. Cada valor hexadecimal consiste en un símbolo de hashtag/almohadilla (#) seguido de seis cifras hexadecimales, cada una de las cuales puede tomar uno de los 16 valores entre el 0 y la f (que representa el 15), por ejemplo: <code>0123456789abcdef</code>. Cada par de cifras representa uno de los canales (rojo, verde y azul) y nos permite especificar cualesquiera de los 256 valores disponibles para cada uno (16 x 16 = 256).</p>
-
-<p>Estos valores son un poco más complejos y menos fáciles de entender, pero son mucho más versátiles que las palabras clave: puedes usar valores hexadecimales para representar cualquier color que desees usar en tu combinación de colores.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-hex.html", '100%', 700)}} </p>
-
-<p><strong>Una vez más, cambia los valores para ver cómo varían los colores.</strong></p>
-
-<h3 id="Valores_RGB_y_RGBA">Valores RGB y RGBA</h3>
-
-<p>El tercer esquema del que hablaremos aquí es RGB. Un valor RGB es una función <code>rgb()</code> que recibe tres parámetros que representan los valores de los canales rojo, verde y azul del color, de modo muy similar a los valores hexadecimales. La diferencia con RGB es que cada canal está representado no por dos dígitos hexadecimales, sino por un número decimal entre el 0 y el 255, lo que de algún modo resulta algo más fácil de entender.</p>
-
-<p>Vamos a reescribir nuestro último ejemplo para utilizar colores RGB:</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-rgb.html", '100%', 700)}} </p>
-
-<p>También puedes usar colores RGBA: estos funcionan exactamente de la misma manera que los colores RGB, por lo que puedes usar cualquier valor RGB; sin embargo, hay un cuarto valor que representa el canal alfa del color, que controla la opacidad. Si estableces este valor en <code>0</code>, el color será completamente transparente, mientras que en <code>1</code> será completamente opaco. Los valores intermedios le confieren diferentes niveles de transparencia.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Establecer un canal alfa en un color representa una diferencia clave para usar la propiedad {{cssxref ("opacity")}} que vimos anteriormente. Cuando usas la opacidad, el elemento y todo lo que contiene es opaco, mientras que cuando usas colores RGBA, solo son opacos los que especificas.</p>
-</div>
-
-<p>En el ejemplo siguiente hemos añadido una imagen de fondo al bloque que contiene nuestras cajas de color. También hemos configurado las cajas para que tengan diferentes valores de opacidad: observa que el fondo se muestra más cuanto menor es el valor del canal alfa.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-rgba.html", '100%', 770)}}</p>
-
-<p><strong>En este ejemplo, cambia los valores del canal alfa y observa cómo afecta a la salida de color. </strong></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: En algún momento, los navegadores modernos se actualizaron para que <code>rgba()</code> y <code>rgb()</code>, y <code>hsl()</code> y <code>hsla()</code> (ver más abajo) se convirtieran en alias puros el uno del otro y comenzaran a comportarse exactamente igual. Así, por ejemplo, tanto <code>rgba()</code> como <code>rgb()</code> admiten colores con y sin valores de canal alfa. Cambia el <code>rgba()</code> del ejemplo anterior por <code>rgb()</code> y observa si los colores aún funcionan. El estilo que uses depende de ti, pero separar las definiciones de los colores transparentes y las de los no transparentes con el uso de funciones diferentes mejora la ejecución de los navegadores y puede actuar como un indicador visual de dónde se definen colores transparentes en tu código.</p>
-</div>
-
-<h3 id="Los_valores_HSL_y_HSLA">Los valores HSL y HSLA</h3>
-
-<p>Un poco menos compatible que RGB es el modelo de color HSL (no compatible con las antiguas versiones de Internet Explorer), que se implementó después de mucha insistencia por parte de los diseñadores. En lugar de los valores rojo, verde y azul, la función <code>hsl()</code> admite valores de matiz, saturación y luminosidad, que se utilizan para distinguir entre los 16,7 millones de colores, pero de una manera diferente:</p>
-
-<ul>
- <li><strong>Matiz</strong>: El tono base del color. Toma un valor entre 0 y 360, que representa un ángulo en torno a una rueda de colores.</li>
- <li><strong>Saturación</strong>: ¿Qué nivel de saturación presenta el color? Esta propiedad toma un valor entre 0 y 100%, en que 0 no es un color (aparece como un tono de gris) y 100% es el nivel de saturación total del color.</li>
- <li><strong>Luminosidad</strong>: ¿Qué claridad o brillo presenta el color? Este atributo toma un valor entre 0 y 100%, en que 0 es no claro (aparece completamente negro) y 100% es completamente claro (aparece completamente blanco).</li>
-</ul>
-
-<p>Podemos adaptar el ejemplo con colores RGB para usar colores HSL, así:</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-hsl.html", '100%', 700)}} </p>
-
-<p>Al igual que RGB tiene un equivalente RGBA, HSL tiene un equivalente HSLA, que le proporciona la misma capacidad para especificar el canal alfa. Demostramos esto a continuación cambiando nuestro ejemplo RGBA para usar colores HSLA.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-hsla.html", '100%', 770)}} </p>
-
-<p>Puedes usar cualquiera de estos valores de color en tus proyectos. Es probable que para la mayoría de los proyectos te decidas por una paleta de colores y luego uses esos colores (y tu método elegido para especificar el color) en todo el proyecto. También puedes mezclar y combinar diversos modelos de color, sin embargo, por coherencia, en general es mejor si todo el proyecto usa el mismo.</p>
-
-<h2 id="Imágenes">Imágenes</h2>
-
-<p>El tipo de datos <code><a href="/en-US/docs/Web/CSS/image">&lt;image&gt;</a></code> se usa cuando una imagen es un valor válido. Puede ser un archivo de imagen real al que apunta una función <code>url()</code>, o un degradado.</p>
-
-<p>En el ejemplo siguiente mostramos una imagen y un gradiente en uso como un valor para la propiedad CSS <code>background-image</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/image.html", '100%', 740)}} </p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: hay otros valores posibles para <code>&lt;image&gt;</code>, pero son más nuevos y aún hay pocos navegadores que los admiten. Consulta la página de MDN para el tipo de dato <code><a href="/en-US/docs/Web/CSS/image">&lt;image&gt;</a></code> si deseas saber más sobre ellos.</p>
-</div>
-
-<h2 id="Posición">Posición</h2>
-
-<p>El tipo de dato <code><a href="/en-US/docs/Web/CSS/position_value">&lt;position&gt;</a></code> representa un conjunto de coordenadas 2D que se utiliza para colocar un elemento, por ejemplo una imagen de fondo (con el atributo <code><a href="/en-US/docs/Web/CSS/background-position">background-position</a></code>). Puede tomar palabras clave como <code>top</code>, <code>left</code>, <code>bottom</code>, <code>right</code> y <code>center</code> para alinear los elementos con los límites específicos de una caja de dos dimensiones, y también longitudes, que representan desplazamientos desde los bordes superior e izquierdo de la caja.</p>
-
-<p>Un valor de posición típico consta de dos valores: el primero establece la posición horizontal, y el segundo la vertical. Si solo especificas valores para un eje, el otro usará <code>center</code> por defecto.</p>
-
-<p>En el ejemplo siguiente hemos colocado una imagen de fondo a 40px de la parte superior, y a la derecha del contenedor con una palabra clave.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/position.html", '100%', 720)}} </p>
-
-<p><strong>Juega un poco con estos valores y observa cómo cambia la posición de la imagen.</strong></p>
-
-<h2 id="Cadenas_e_identificadores">Cadenas e identificadores</h2>
-
-<p>En los ejemplos anteriores hemos visto casos en que se usan palabras clave como valores (por ejemplo, palabras clave para <code>&lt;color&gt;</code>, como <code>red</code>, <code>black</code>, <code>rebeccapurple</code> y <code>goldenrod</code>). Estas palabras clave normalmente se describen como <em>identificadores</em>, un valor especial que el CSS entiende. Como tales, no se escriben entre comillas (es decir, no se tratan como cadenas).</p>
-
-<p>Hay casos en el CSS en que debes usar cadenas, por ejemplo, <a href="https://wiki.developer.mozilla.org/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos#Generar_contenido_con_before_y_after">al especificar el contenido que generas</a>. En este caso, el valor se escribe entre comillas para mostrar que se trata de una cadena de caracteres. En el ejemplo siguiente hemos usado palabras clave para el color, sin entrecomillar, y también una cadena caracteres, de contenido generado, entrecomillada.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/strings-idents.html", '100%', 550)}} </p>
-
-<h2 id="Funciones">Funciones</h2>
-
-<p>El último tipo de valor que vamos a analizar es el grupo de valores conocidos como funciones. En programación, una función es un bloque de código reutilizable que es posible ejecutar varias veces para completar una tarea repetitiva con el mínimo esfuerzo tanto por parte del desarrollador como del ordenador. Las funciones suelen asociarse a lenguajes como JavaScript, Python o C++, pero también hay funciones en CSS, como valores de código propietario. Ya hemos visto funciones en acción en la sección sobre los colores: <code>rgb()</code>, <code>hsl()</code>, etc. El valor que se utiliza para devolver una imagen de un archivo, en este caso <code>url()</code>, también es una función.</p>
-
-<p>Un valor que se comporta más como algo que puedes encontrar en un lenguaje de programación tradicional es la función <code>calc()</code>. Esta función te proporciona la capacidad de hacer cálculos simples en tu CSS. Es particularmente útil si deseas calcular valores que no puedes definir al escribir el CSS para tu proyecto y necesitas que el navegador lo haga durante la ejecución.</p>
-
-<p>Por ejemplo, a continuación usamos <code>calc()</code> para hacer que la caja tenga <code>20% + 100px</code> de ancho. El 20% se calcula a partir del ancho del contenedor principal <code>.wrapper</code> y, por lo tanto, cambiará si ese ancho cambia. No podemos hacer este cálculo de antemano porque no sabemos cuál será el 20% del elemento padre, por lo que usamos <code>calc()</code> para decirle al navegador que lo haga por nosotros.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/values-units/calc.html", '100%', 450)}}</p>
-
-<h2 id="Pon_a_prueba_tus_conocimientos">Pon a prueba tus conocimientos</h2>
-
-<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más importante? Encontrarás más pruebas para comprobar que retienes esa información antes de seguir en <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_tasks">Test your skills: Values and units</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Esta ha sido una revisión rápida de los tipos de valores y unidades más comunes que te puedes encontrar. Puedes echar un vistazo a todos los diferentes tipos en la página de referencia de <a href="/en-US/docs/Web/CSS/CSS_Values_and_Units">valores y unidades CSS</a>; encontrarás muchos de estos mientras trabajas en estos artículos.</p>
-
-<p>Lo que debes recordar es que cada propiedad tiene una lista definida de valores admisibles, y cada valor incluye una definición que explica cuáles son sus subvalores. A continuación puedes buscar los detalles aquí, en MDN.</p>
-
-<p>Por ejemplo, comprender que <code><a href="/es/docs/Web/CSS/image">&lt;image&gt;</a></code> también te permite crear un degradado de color es útil, ¡pero quizás no sea un conocimiento obvio!</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
-  <ul>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
-   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
-</ol>
diff --git a/files/es/learn/css/building_blocks/values_and_units/index.html b/files/es/learn/css/building_blocks/values_and_units/index.html
new file mode 100644
index 0000000000..c72e131a90
--- /dev/null
+++ b/files/es/learn/css/building_blocks/values_and_units/index.html
@@ -0,0 +1,393 @@
+---
+title: Valores y unidades CSS
+slug: Learn/CSS/Building_blocks/Values_and_units
+translation_of: Learn/CSS/Building_blocks/Values_and_units
+original_slug: Learn/CSS/Building_blocks/Valores_y_unidades_CSS
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks")}}</div>
+
+<p>Todas las propiedades que se utilizan en CSS tienen un valor o un conjunto de valores que esa propiedad admite, y echar un vistazo a cualquier página de propiedades en MDN te ayudará a comprender qué valores admite una propiedad en particular. En este artículo veremos algunos de los valores y unidades más comunes en uso.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de <a href="/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a>, HTML básico (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos con el CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Conocer los diferentes tipos de valores y unidades que admiten las propiedades CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_un_valor_CSS">¿Qué es un valor CSS?</h2>
+
+<p>En las especificaciones CSS y en las páginas de propiedades de este proyecto MDN, podrás detectar los valores porque estarán escritos entre corchetes angulares, como <code><a href="/en-US/docs/Web/CSS/color_value">&lt;color&gt;</a></code> o <code><a href="/en-US/docs/Web/CSS/length">&lt;length&gt;</a></code>. Cuando veas que el valor <code>&lt;color&gt;</code> es válido para una propiedad en particular, significa que para esa propiedad puedes usar como valor cualquier color válido de entre los que se enumeran en la página de referencia de la propiedad <code><a href="/en-US/docs/Web/CSS/color_value">&lt;color&gt;</a></code>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: También verás valores CSS denominados <em>tipos de datos</em>. Los términos son básicamente intercambiables: cuando veas algo en CSS denominado ‘tipo de datos’, en realidad es solo una forma elegante de decir ‘valor’.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Sí, hay una tendencia de denotar los valores CSS entre corchetes angulares, para diferenciarlos de las propiedades CSS (por ejemplo, la propiedad {{cssxref ("color")}} con respecto al tipo de dato <a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a>). Aunque podría generarte confusión entre los tipos de datos CSS y los elementos HTML, porque ambos usan corchetes angulares, es poco probable porque se usan en contextos muy diferentes.</p>
+</div>
+
+<p>En el ejemplo siguiente hemos establecido el color de nuestro encabezado con una palabra clave y el fondo con la función <code>rgb()</code>:</p>
+
+<pre class="brush: css notranslate"><code>h1 {
+  color: black;
+  background-color: rgb(197,93,161);
+} </code>
+</pre>
+
+<p>Un valor en CSS es una forma de definir una colección de subvalores admitidos. Esto significa que si ves <code>&lt;color&gt;</code> como válido, no necesitas preguntarte cuáles de los diferentes tipos de valor de color puedes usar: palabras clave, valores hexadecimales, funciones <code>rgb()</code>, etc. Puedes usar <em>cualquier</em> valor <code>&lt;color&gt;</code> disponible siempre que tu navegador lo admita. La página de MDN te dará información sobre lo que admite cada navegador para cada valor. Por ejemplo, puedes ver que en la sección de compatibilidad de navegadores de la página para <code><a href="/en-US/docs/Web/CSS/color_value">&lt;color&gt;</a></code> se enumeran diferentes tipos de valores de color y los navegadores que los admiten.</p>
+
+<p>Echemos un vistazo a algunos de los tipos de valores y unidades con los que puedes encontrar con frecuencia, con ejemplos para que puedas probar diferentes valores posibles.</p>
+
+<h2 id="Números_longitudes_y_porcentajes">Números, longitudes y porcentajes</h2>
+
+<p>Al utilizar CSS te puedes encontrar con varios tipos de datos numéricos. Todos los siguientes están clasificados como tipos de datos numéricos:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Tipo de datos</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code><a href="/es/docs/Web/CSS/integer">&lt;integer&gt;</a></code></td>
+   <td>Un <code>&lt;integer&gt;</code> es un número entero, como <code>1024</code> o <code>-55</code>.</td>
+  </tr>
+  <tr>
+   <td><code><a href="/es/docs/Web/CSS/number">&lt;number&gt;</a></code></td>
+   <td>Un <code>&lt;number&gt;</code> representa un número decimal; puede tener o no un punto de separación decimal con un componente fraccionario, por ejemplo: <code>0,255</code>, <code>128</code> o <code>-1,2</code>.</td>
+  </tr>
+  <tr>
+   <td><code>&lt;dimension&gt;</code></td>
+   <td>Una <code>&lt;dimension&gt;</code> es un <code>&lt;number&gt;</code> con una unidad asociada, por ejemplo: <code>45deg</code> (grados), <code>5s</code> (segundos) o <code>10px</code> (píxeles). <code>&lt;dimension&gt;</code> es una categoría general que incluye los tipos <code><a href="/es/docs/Web/CSS/length">&lt;length&gt;</a></code>, <code><a href="/es/docs/Web/CSS/angle">&lt;angle&gt;</a></code>, <code><a href="/es/docs/Web/CSS/time">&lt;time&gt;</a></code> y <code><a href="/es/docs/Web/CSS/resolución">&lt;resolution&gt;</a></code><a href="/en-US/docs/Web/CSS/resolution">.</a></td>
+  </tr>
+  <tr>
+   <td><code><a href="/en-US/docs/Web/CSS/percentage">&lt;percentage&gt;</a></code></td>
+   <td>Un <code>&lt;percentage&gt;</code> representa una fracción de algún otro valor, por ejemplo, <code>50%</code>. Los valores de porcentaje siempre son relativos a otra cantidad, por ejemplo, la longitud de un elemento es relativa a la longitud de su elemento padre.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Longitudes">Longitudes</h3>
+
+<p>El tipo numérico con el que te vas a encontrar con mayor frecuencia es <code>&lt;length&gt;</code>, por ejemplo, <code>10px</code> (píxeles) o <code>30em</code>. En CSS se utilizan dos longitudes diferentes: relativa y absoluta. Es importante conocer la diferencia para entender qué dimensiones van a tener las cosas.</p>
+
+<h4 id="Unidades_de_longitud_absoluta">Unidades de longitud absoluta</h4>
+
+<p>Todas las unidades siguientes son unidades de longitud <strong>absoluta</strong>: no son relativas a nada más y en general se considera que siempre tienen el mismo tamaño.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Unidad</th>
+   <th scope="col">Nombre</th>
+   <th scope="col">Equivale a</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>cm</code></td>
+   <td>Centímetros</td>
+   <td>1cm = 96px/2,54</td>
+  </tr>
+  <tr>
+   <td><code>mm</code></td>
+   <td>Milímetros</td>
+   <td>1mm = 1/10 de 1cm</td>
+  </tr>
+  <tr>
+   <td><code>Q</code></td>
+   <td>Cuartos de milímetros</td>
+   <td>1Q = 1/40 de 1cm</td>
+  </tr>
+  <tr>
+   <td><code>in</code></td>
+   <td>Pulgadas</td>
+   <td>1in = 2,54cm = 96px</td>
+  </tr>
+  <tr>
+   <td><code>pc</code></td>
+   <td>Picas</td>
+   <td>1pc = 1/16 de 1in</td>
+  </tr>
+  <tr>
+   <td><code>pt</code></td>
+   <td>Puntos</td>
+   <td>1pt = 1/72 de 1in</td>
+  </tr>
+  <tr>
+   <td><code>px</code></td>
+   <td>Píxeles</td>
+   <td>1px = 1/96 de 1in</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>La mayoría de estos valores son más útiles cuando se usan en una salida en formato impreso que en la salida de pantalla. Por ejemplo, normalmente no usamos <code>cm</code> (centímetros) en pantalla. El único valor que usarás de forma frecuente es <code>px</code> (píxeles).</p>
+
+<h4 id="Unidades_de_longitud_relativa">Unidades de longitud relativa</h4>
+
+<p>Las unidades de longitud relativa son relativas a algo más, por ejemplo, al tamaño de letra del elemento principal o al tamaño de la ventana gráfica. La ventaja de usar unidades relativas es que con una planificación cuidadosa puedes lograr que el tamaño del texto u otros elementos escalen en relación con todo lo demás en la página. En la tabla siguiente se enumeran algunas de las unidades más útiles para el desarrollo web.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Unidad</th>
+   <th scope="col">Relativa a</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>em</code></td>
+   <td>Tamaño de letra del elemento padre, en el caso de propiedades tipográficas como {{cssxref("font-size")}}, y tamaño de la fuente del propio elemento en el caso de otras propiedades, como {{cssxref("width")}}.</td>
+  </tr>
+  <tr>
+   <td><code>ex</code></td>
+   <td>Altura x de la fuente del elemento.</td>
+  </tr>
+  <tr>
+   <td><code>ch</code></td>
+   <td>La medida de avance (ancho) del glifo "0" de la letra del elemento.</td>
+  </tr>
+  <tr>
+   <td><code>rem</code></td>
+   <td>Tamaño de la letra del elemento raíz.</td>
+  </tr>
+  <tr>
+   <td><code>lh</code></td>
+   <td>Altura de la línea del elemento.</td>
+  </tr>
+  <tr>
+   <td><code>vw</code></td>
+   <td>1% del ancho de la ventana gráfica.</td>
+  </tr>
+  <tr>
+   <td><code>vh</code></td>
+   <td>1% de la altura de la ventana gráfica.</td>
+  </tr>
+  <tr>
+   <td><code>vmin</code></td>
+   <td>1% de la dimensión más pequeña de la ventana gráfica.</td>
+  </tr>
+  <tr>
+   <td><code>vmax</code></td>
+   <td>1% de la dimensión más grande de la ventana gráfica.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h4 id="Un_ejemplo_de_análisis">Un ejemplo de análisis</h4>
+
+<p>En el ejemplo siguiente puedes ver cómo se comportan algunas unidades de longitud relativa y absoluta. La primera caja tiene un ancho ({{cssxref ("width")}}) establecido en píxeles. Como unidad absoluta, este ancho será siempre el mismo aunque lo demás cambie.</p>
+
+<p>La segunda caja tiene un ancho establecido en unidades <code>vw</code> (ancho de ventana). Este valor es relativo al ancho de la ventana gráfica, por lo que 10vw es el 10 por ciento del ancho de la ventana gráfica. Si cambiases el ancho de la ventana de tu navegador, el tamaño de la caja cambiaría. Sin embargo, esto no te va a funcionar porque este ejemplo se ha incrustado en la página usando <code><a href="/en-US/docs/Web/HTML/Element/iframe">&lt;iframe&gt;</a></code>. Para verlo en acción debes <a href="https://mdn.github.io/css-examples/learn/values-units/length.html">probar el ejemplo después de abrirlo en una pestaña independiente de tu navegador</a>.</p>
+
+<p>La tercera caja utiliza unidades <code>em</code>. Son unidades relativas al tamaño de la letra. Hemos establecido un tamaño de fuente de <code>1em</code> en el contenido {{htmlelement ("div")}}, que tiene una clase <code>.wrapper</code>. Si cambias este valor a <code>1.5em</code>, verás que el tamaño de letra de todos los elementos aumenta, pero solo se amplía el ancho en el último elemento, porque el ancho es relativo a ese tamaño de letra.</p>
+
+<p>Después de seguir las instrucciones anteriores, juega un poco más con los valores para ver qué obtienes.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/length.html", '100%', 820)}}</p>
+
+<h4 id="ems_y_rems">ems y rems</h4>
+
+<p><code>em</code> y <code>rem</code> son las dos longitudes relativas que es probable que encuentres con mayor frecuencia al cambiar el tamaño de cualquier cosa, de cajas a texto. Vale la pena entender cómo funcionan y las diferencias entre ellos, especialmente cuando comienzas a abordar temas más complejos como <a href="/es/docs/Learn/CSS/Styling_text">aplicar estilos a texto</a> o <a href="/es/docs/Learn/CSS/CSS_layout">compaginar con CSS</a>. El ejemplo siguiente te proporciona una muestra.</p>
+
+<p>El HTML es un conjunto de listas anidadas: hay tres listas en total y ambos ejemplos tienen el mismo HTML. La única diferencia es que el primero tiene una clase <em>ems</em> y el segundo una clase <em>rems</em>.</p>
+
+<p>Para empezar, configuramos un tamaño de letra de 16px en el elemento <code>&lt;html&gt;</code>.</p>
+
+<p><strong>En definitiva, la unidad <em>em</em> significa «el tamaño de letra de mi elemento padre»</strong>. Los elementos {{htmlelement ("li")}} dentro de un elemento {{htmlelement ("ul")}} con una clase de <code>ems</code> toman el tamaño con respecto a su elemento padre. Por lo tanto, en cada nivel de anidamiento sucesivo, el tamaño de letra aumenta progresivamente, porque en cada uno el tamaño de letra está establecido en <code>1.3em</code> (1,3 veces el tamaño de letra de su elemento padre).</p>
+
+<p><strong>En definitiva, la unidad <em>rem</em> significa «el tamaño de letra del elemento raíz»</strong>. (‘rem’ viene de «root em»). Los elementos {{htmlelement ("li")}} dentro de un elemento {{htmlelement ("ul")}} con una clase de <code>rems</code> toman su tamaño del elemento raíz (<code>&lt;html&gt;</code>). Esto significa que el tamaño de letra no aumenta en cada nivel sucesivo de anidamiento.</p>
+
+<p>Sin embargo, si cambias el atributo <code>font-size</code> de <code>&lt;html&gt;</code> en el CSS, verás que todo lo demás cambia en relación con él, tanto la letra cuyo tamaño está especificado en unidades <code>rem</code> como la que lo está en unidades <code>em</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/em-rem.html", '100%', 1000)}} </p>
+
+<h3 id="Porcentajes">Porcentajes</h3>
+
+<p>En muchos casos, un porcentaje es tratado de la misma manera que una longitud. Lo que sucede con los porcentajes es que siempre se establecen en relación con otro valor. Por ejemplo, si estableces el atributo <code>font-size</code> de un elemento como un porcentaje, será un porcentaje del <code>font-size</code> del elemento padre. Si usas un porcentaje para un valor <code>width</code>, será un porcentaje del atributo <code>width</code> del elemento padre.</p>
+
+<p>En el ejemplo siguiente, las dos cajas con el tamaño especificado en unidades de porcentaje y las dos cajas con el tamaño especificado en unidades de píxel tienen los mismos nombres de clase. En ambos conjuntos de cajas, los anchos de las cajas son de 200 píxeles y de 40%, respectivamente.</p>
+
+<p>La diferencia es que el segundo conjunto de dos cajas está dentro de un contenedor que tiene 400 píxeles de ancho. La segunda caja de 200 px de ancho tiene el mismo ancho que la primera, pero la segunda caja de 40% ahora es el 40% de 400 px, ¡mucho más estrecha que la primera!</p>
+
+<p><strong>Cambia el ancho del contenedor o el valor de porcentaje para ver cómo funciona.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/percentage.html", '100%', 850)}} </p>
+
+<p>El ejemplo siguiente tiene tamaños de letra establecidos en porcentajes. Cada elemento <code>&lt;li&gt;</code> tiene un atributo <code>font-size</code> del 80%, por lo tanto, los elementos de la lista anidada se vuelven progresivamente más pequeños a medida que heredan su tamaño del elemento padre.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/percentage-fonts.html", '100%', 650)}} </p>
+
+<p>Observa que aunque muchos valores admiten unidades de longitud o porcentaje, algunos solo admiten unidades de longitud. Puedes ver qué valores admite cada propiedad en las páginas de referencia correspondientes del proyecto MDN. Si el valor admitido incluye <code><a href="/en-US/docs/Web/CSS/length-percentage">&lt;length-percentage&gt;</a></code>, puedes usar una unidad de longitud o un porcentaje. Si el valor admitido solo incluye <code>&lt;length&gt;</code>, no es posible utilizar un porcentaje.</p>
+
+<h3 id="Números">Números</h3>
+
+<p>Algunos valores aceptan números sin ninguna unidad asociada. Un ejemplo de una propiedad que acepta un número sin unidades es la propiedad <code>opacity</code>, que controla la opacidad de un elemento (cuán transparente es). Esta propiedad admite un número entre <code>0</code> (totalmente transparente) y <code>1</code> (totalmente opaco).</p>
+
+<p><strong>En el ejemplo siguiente, asigna al valor de <code>opacity</code> diversos valores decimales entre <code>0</code> y <code>1</code> para ver cómo la caja y su contenido cambian su opacidad.</strong></p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/opacity.html", '100%', 500)}} </p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Cuando en CSS utilizas un número como valor, no debe estar entre comillas.</p>
+</div>
+
+<h2 id="Color">Color</h2>
+
+<p>En CSS hay muchas formas de especificar el color, algunas de las cuales se implementaron más recientemente que otras. En todas partes en CSS se pueden usar los mismos valores de color, tanto para especificar el color del texto como el color de fondo, o de cualquier otra cosa.</p>
+
+<p>El sistema de colores estándar disponible en los ordenadores modernos es de 24 bits, lo que permite visualizar aproximadamente 16,7 millones de colores distintos a partir de una combinación de diferentes canales de rojo, verde y azul con 256 valores diferentes por canal (256 x 256 x 256 = 16.777.216). Echemos un vistazo a algunas de las formas en que podemos especificar colores en CSS.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: En este artículo vamos a ver los métodos comunes para especificar colores que admiten los navegadores; hay otros métodos no tan comunes que no admiten todos los navegadores.</p>
+</div>
+
+<h3 id="Palabras_clave_para_los_colores">Palabras clave para los colores</h3>
+
+<p>Muy a menudo, en los ejemplos de este artículo o en cualquier otra página de MDN, verás que se utilizan las palabras clave para los colores, ya que son una forma simple y comprensible de especificar colores. Hay una multitud de estas palabras clave, ¡algunas de las cuales tienen nombres de lo más curiosos! Puedes ver una lista completa en la página para el valor <code><a href="/es/docs/Web/CSS/color_value">&lt;color&gt;</a></code>.</p>
+
+<p><strong>Juega con diferentes valores de color en los ejemplos en vivo que encontrarás a continuación, para adquirir una idea más clara de cómo funcionan.</strong></p>
+
+<h3 id="Los_valores_hexadecimales_RGB">Los valores hexadecimales RGB</h3>
+
+<p>El siguiente tipo de valores de color que es probable que encuentres son los códigos hexadecimales. Cada valor hexadecimal consiste en un símbolo de hashtag/almohadilla (#) seguido de seis cifras hexadecimales, cada una de las cuales puede tomar uno de los 16 valores entre el 0 y la f (que representa el 15), por ejemplo: <code>0123456789abcdef</code>. Cada par de cifras representa uno de los canales (rojo, verde y azul) y nos permite especificar cualesquiera de los 256 valores disponibles para cada uno (16 x 16 = 256).</p>
+
+<p>Estos valores son un poco más complejos y menos fáciles de entender, pero son mucho más versátiles que las palabras clave: puedes usar valores hexadecimales para representar cualquier color que desees usar en tu combinación de colores.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-hex.html", '100%', 700)}} </p>
+
+<p><strong>Una vez más, cambia los valores para ver cómo varían los colores.</strong></p>
+
+<h3 id="Valores_RGB_y_RGBA">Valores RGB y RGBA</h3>
+
+<p>El tercer esquema del que hablaremos aquí es RGB. Un valor RGB es una función <code>rgb()</code> que recibe tres parámetros que representan los valores de los canales rojo, verde y azul del color, de modo muy similar a los valores hexadecimales. La diferencia con RGB es que cada canal está representado no por dos dígitos hexadecimales, sino por un número decimal entre el 0 y el 255, lo que de algún modo resulta algo más fácil de entender.</p>
+
+<p>Vamos a reescribir nuestro último ejemplo para utilizar colores RGB:</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-rgb.html", '100%', 700)}} </p>
+
+<p>También puedes usar colores RGBA: estos funcionan exactamente de la misma manera que los colores RGB, por lo que puedes usar cualquier valor RGB; sin embargo, hay un cuarto valor que representa el canal alfa del color, que controla la opacidad. Si estableces este valor en <code>0</code>, el color será completamente transparente, mientras que en <code>1</code> será completamente opaco. Los valores intermedios le confieren diferentes niveles de transparencia.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Establecer un canal alfa en un color representa una diferencia clave para usar la propiedad {{cssxref ("opacity")}} que vimos anteriormente. Cuando usas la opacidad, el elemento y todo lo que contiene es opaco, mientras que cuando usas colores RGBA, solo son opacos los que especificas.</p>
+</div>
+
+<p>En el ejemplo siguiente hemos añadido una imagen de fondo al bloque que contiene nuestras cajas de color. También hemos configurado las cajas para que tengan diferentes valores de opacidad: observa que el fondo se muestra más cuanto menor es el valor del canal alfa.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-rgba.html", '100%', 770)}}</p>
+
+<p><strong>En este ejemplo, cambia los valores del canal alfa y observa cómo afecta a la salida de color. </strong></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: En algún momento, los navegadores modernos se actualizaron para que <code>rgba()</code> y <code>rgb()</code>, y <code>hsl()</code> y <code>hsla()</code> (ver más abajo) se convirtieran en alias puros el uno del otro y comenzaran a comportarse exactamente igual. Así, por ejemplo, tanto <code>rgba()</code> como <code>rgb()</code> admiten colores con y sin valores de canal alfa. Cambia el <code>rgba()</code> del ejemplo anterior por <code>rgb()</code> y observa si los colores aún funcionan. El estilo que uses depende de ti, pero separar las definiciones de los colores transparentes y las de los no transparentes con el uso de funciones diferentes mejora la ejecución de los navegadores y puede actuar como un indicador visual de dónde se definen colores transparentes en tu código.</p>
+</div>
+
+<h3 id="Los_valores_HSL_y_HSLA">Los valores HSL y HSLA</h3>
+
+<p>Un poco menos compatible que RGB es el modelo de color HSL (no compatible con las antiguas versiones de Internet Explorer), que se implementó después de mucha insistencia por parte de los diseñadores. En lugar de los valores rojo, verde y azul, la función <code>hsl()</code> admite valores de matiz, saturación y luminosidad, que se utilizan para distinguir entre los 16,7 millones de colores, pero de una manera diferente:</p>
+
+<ul>
+ <li><strong>Matiz</strong>: El tono base del color. Toma un valor entre 0 y 360, que representa un ángulo en torno a una rueda de colores.</li>
+ <li><strong>Saturación</strong>: ¿Qué nivel de saturación presenta el color? Esta propiedad toma un valor entre 0 y 100%, en que 0 no es un color (aparece como un tono de gris) y 100% es el nivel de saturación total del color.</li>
+ <li><strong>Luminosidad</strong>: ¿Qué claridad o brillo presenta el color? Este atributo toma un valor entre 0 y 100%, en que 0 es no claro (aparece completamente negro) y 100% es completamente claro (aparece completamente blanco).</li>
+</ul>
+
+<p>Podemos adaptar el ejemplo con colores RGB para usar colores HSL, así:</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-hsl.html", '100%', 700)}} </p>
+
+<p>Al igual que RGB tiene un equivalente RGBA, HSL tiene un equivalente HSLA, que le proporciona la misma capacidad para especificar el canal alfa. Demostramos esto a continuación cambiando nuestro ejemplo RGBA para usar colores HSLA.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/color-hsla.html", '100%', 770)}} </p>
+
+<p>Puedes usar cualquiera de estos valores de color en tus proyectos. Es probable que para la mayoría de los proyectos te decidas por una paleta de colores y luego uses esos colores (y tu método elegido para especificar el color) en todo el proyecto. También puedes mezclar y combinar diversos modelos de color, sin embargo, por coherencia, en general es mejor si todo el proyecto usa el mismo.</p>
+
+<h2 id="Imágenes">Imágenes</h2>
+
+<p>El tipo de datos <code><a href="/en-US/docs/Web/CSS/image">&lt;image&gt;</a></code> se usa cuando una imagen es un valor válido. Puede ser un archivo de imagen real al que apunta una función <code>url()</code>, o un degradado.</p>
+
+<p>En el ejemplo siguiente mostramos una imagen y un gradiente en uso como un valor para la propiedad CSS <code>background-image</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/image.html", '100%', 740)}} </p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: hay otros valores posibles para <code>&lt;image&gt;</code>, pero son más nuevos y aún hay pocos navegadores que los admiten. Consulta la página de MDN para el tipo de dato <code><a href="/en-US/docs/Web/CSS/image">&lt;image&gt;</a></code> si deseas saber más sobre ellos.</p>
+</div>
+
+<h2 id="Posición">Posición</h2>
+
+<p>El tipo de dato <code><a href="/en-US/docs/Web/CSS/position_value">&lt;position&gt;</a></code> representa un conjunto de coordenadas 2D que se utiliza para colocar un elemento, por ejemplo una imagen de fondo (con el atributo <code><a href="/en-US/docs/Web/CSS/background-position">background-position</a></code>). Puede tomar palabras clave como <code>top</code>, <code>left</code>, <code>bottom</code>, <code>right</code> y <code>center</code> para alinear los elementos con los límites específicos de una caja de dos dimensiones, y también longitudes, que representan desplazamientos desde los bordes superior e izquierdo de la caja.</p>
+
+<p>Un valor de posición típico consta de dos valores: el primero establece la posición horizontal, y el segundo la vertical. Si solo especificas valores para un eje, el otro usará <code>center</code> por defecto.</p>
+
+<p>En el ejemplo siguiente hemos colocado una imagen de fondo a 40px de la parte superior, y a la derecha del contenedor con una palabra clave.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/position.html", '100%', 720)}} </p>
+
+<p><strong>Juega un poco con estos valores y observa cómo cambia la posición de la imagen.</strong></p>
+
+<h2 id="Cadenas_e_identificadores">Cadenas e identificadores</h2>
+
+<p>En los ejemplos anteriores hemos visto casos en que se usan palabras clave como valores (por ejemplo, palabras clave para <code>&lt;color&gt;</code>, como <code>red</code>, <code>black</code>, <code>rebeccapurple</code> y <code>goldenrod</code>). Estas palabras clave normalmente se describen como <em>identificadores</em>, un valor especial que el CSS entiende. Como tales, no se escriben entre comillas (es decir, no se tratan como cadenas).</p>
+
+<p>Hay casos en el CSS en que debes usar cadenas, por ejemplo, <a href="https://wiki.developer.mozilla.org/es/docs/Learn/CSS/Building_blocks/Selectores_CSS/Pseudo-clases_y_pseudo-elementos#Generar_contenido_con_before_y_after">al especificar el contenido que generas</a>. En este caso, el valor se escribe entre comillas para mostrar que se trata de una cadena de caracteres. En el ejemplo siguiente hemos usado palabras clave para el color, sin entrecomillar, y también una cadena caracteres, de contenido generado, entrecomillada.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/strings-idents.html", '100%', 550)}} </p>
+
+<h2 id="Funciones">Funciones</h2>
+
+<p>El último tipo de valor que vamos a analizar es el grupo de valores conocidos como funciones. En programación, una función es un bloque de código reutilizable que es posible ejecutar varias veces para completar una tarea repetitiva con el mínimo esfuerzo tanto por parte del desarrollador como del ordenador. Las funciones suelen asociarse a lenguajes como JavaScript, Python o C++, pero también hay funciones en CSS, como valores de código propietario. Ya hemos visto funciones en acción en la sección sobre los colores: <code>rgb()</code>, <code>hsl()</code>, etc. El valor que se utiliza para devolver una imagen de un archivo, en este caso <code>url()</code>, también es una función.</p>
+
+<p>Un valor que se comporta más como algo que puedes encontrar en un lenguaje de programación tradicional es la función <code>calc()</code>. Esta función te proporciona la capacidad de hacer cálculos simples en tu CSS. Es particularmente útil si deseas calcular valores que no puedes definir al escribir el CSS para tu proyecto y necesitas que el navegador lo haga durante la ejecución.</p>
+
+<p>Por ejemplo, a continuación usamos <code>calc()</code> para hacer que la caja tenga <code>20% + 100px</code> de ancho. El 20% se calcula a partir del ancho del contenedor principal <code>.wrapper</code> y, por lo tanto, cambiará si ese ancho cambia. No podemos hacer este cálculo de antemano porque no sabemos cuál será el 20% del elemento padre, por lo que usamos <code>calc()</code> para decirle al navegador que lo haga por nosotros.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/values-units/calc.html", '100%', 450)}}</p>
+
+<h2 id="Pon_a_prueba_tus_conocimientos">Pon a prueba tus conocimientos</h2>
+
+<p>Hemos cubierto mucho terreno en este artículo. ¿Recuerdas la información más importante? Encontrarás más pruebas para comprobar que retienes esa información antes de seguir en <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_tasks">Test your skills: Values and units</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Esta ha sido una revisión rápida de los tipos de valores y unidades más comunes que te puedes encontrar. Puedes echar un vistazo a todos los diferentes tipos en la página de referencia de <a href="/en-US/docs/Web/CSS/CSS_Values_and_Units">valores y unidades CSS</a>; encontrarás muchos de estos mientras trabajas en estos artículos.</p>
+
+<p>Lo que debes recordar es que cada propiedad tiene una lista definida de valores admisibles, y cada valor incluye una definición que explica cuáles son sus subvalores. A continuación puedes buscar los detalles aquí, en MDN.</p>
+
+<p>Por ejemplo, comprender que <code><a href="/es/docs/Web/CSS/image">&lt;image&gt;</a></code> también te permite crear un degradado de color es útil, ¡pero quizás no sea un conocimiento obvio!</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Building_blocks/Overflowing_content", "Learn/CSS/Building_blocks/Sizing_items_in_CSS", "Learn/CSS/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">Cascada y herencia</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors">Selectores CSS</a>
+  <ul>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">Selectores de tipo, de clase y de ID</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">Selectores de atributo</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Pseudo-classes_and_pseudo-elements">Las pseudoclases y los pseudoelementos</a></li>
+   <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Selectors/Combinators">Selectores de combinación</a></li>
+  </ul>
+ </li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/The_box_model">El modelo de caja</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Backgrounds_and_borders">Fondos y bordes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">El uso de diferentes direcciones de texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Overflowing_content">El desbordamiento de los contenidos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Values_and_units">Los valores y las unidades</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">Elementos de dimensionado en CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Images_media_form_elements">Imágenes, media y elementos de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Debugging_CSS">Depurar el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Building_blocks/Organizing">Organizar el CSS</a></li>
+</ol>
diff --git a/files/es/learn/css/css_layout/diseño_receptivo/index.html b/files/es/learn/css/css_layout/diseño_receptivo/index.html
deleted file mode 100644
index 4ddb7a94db..0000000000
--- a/files/es/learn/css/css_layout/diseño_receptivo/index.html
+++ /dev/null
@@ -1,324 +0,0 @@
----
-title: Diseño receptivo
-slug: Learn/CSS/CSS_layout/Diseño_receptivo
-translation_of: Learn/CSS/CSS_layout/Responsive_Design
----
-<div>{{learnsidebar}}{{PreviousMenuNext("Learn/CSS/CSS_layout/Multiple-column_Layout", "Learn/CSS/CSS_layout/Media_queries", "Learn/CSS/CSS_layout")}}</div>
-
-<p>En los primeros días del diseño web, las páginas se diseñaban para llenar un tamaño de pantalla en particular. Si el usuario tenía una pantalla más grande o más pequeña que la del diseñador, los resultados esperados iban desde barras de desplazamiento no deseadas hasta longitudes de línea excesivamente largas y un mal uso del espacio. A medida que estuvieron disponibles tamaños de pantalla más diversos, apareció el concepto de <em>diseño web responsivo </em> (RWD, <em>responsive web design</em>), un conjunto de prácticas que permite a las páginas web alterar su diseño y apariencia para adaptarse a diferentes anchos de pantalla, resoluciones, etc. Es una idea que cambió la forma en que diseñamos para una web multidispositivo, y en este artículo te ayudaremos a comprender las principales técnicas que necesitas saber para dominarlo.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos en CSS</a> y <a href="/es/docs/Learn/CSS/Building_blocks">Los elementos básicos del CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender los conceptos fundamentales y la historia del diseño responsivo.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Diseños_de_sitios_web_históricos">Diseños de sitios web históricos</h2>
-
-<p>En un momento de la historia, solo tenías dos opciones al diseñar un sitio web:</p>
-
-<ul>
- <li>Podías crear un sitio <em>líquido</em>, que se expandiría para llenar toda la ventana del navegador</li>
- <li>o un sitio de <em>ancho fijo</em>, que sería un tamaño fijo en píxeles.</li>
-</ul>
-
-<p>Estos dos enfoques tendían a dar como resultado un sitio web que se veía mejor ¡en la pantalla de la persona que diseñaba el sitio! El sitio líquido dio como resultado un diseño encogido en las pantallas que eran más pequeñas (como se ve a continuación) o longitudes de línea interminables en las pantallas que eran más grandes.</p>
-
-<figure><img alt="Un diseño de página con dos columnas encogidas en una ventana gráfica del tamaño de un teléfono móvil." src="https://mdn.mozillademos.org/files/16834/mdn-rwd-liquid.png" style="display: block; height: 406px; width: 300px;">
-<figcaption></figcaption>
-</figure>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Observa este <a href="https://mdn.github.io/css-examples/learn/rwd/liquid-width.html">ejemplo</a> y su <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/liquid-width.html">código fuente</a> de un diseño líquido sencillo. Amplía o reduce la ventana del navegador y observa cómo cambia su aspecto en diferentes tamaños.</p>
-</div>
-
-<p>El sitio de ancho fijo se arriesgaba a una barra de desplazamiento horizontal en pantallas que eran más pequeñas que el ancho del sitio (como se ve a continuación), y a un gran espacio en blanco en los bordes del diseño en las pantallas que eran más grandes.</p>
-
-<figure><img alt="Un diseño con una barra de desplazamiento horizontal en una ventana de teléfono móvil." src="https://mdn.mozillademos.org/files/16835/mdn-rwd-fixed.png" style="display: block; height: 411px; width: 300px;">
-<figcaption></figcaption>
-</figure>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Observa este <a href="https://mdn.github.io/css-examples/learn/rwd/fixed-width.html">ejemplo</a> y su <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/fixed-width.html">código fuente</a> de un diseño sencillo con un ancho fijo. Nuevamente, cambia el tamaño de la ventana del navegador y observa el resultado.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Las capturas de pantalla anteriores se han tomado usando el <a href="/es/docs/Tools/Responsive_Design_View">modo de diseño responsivo</a> de las herramientas DevTools de Firefox.</p>
-</div>
-
-<p>A medida que la web móvil comenzó a hacerse realidad con los primeros teléfonos con funciones, las empresas que deseaban adoptar los dispositivos móviles solían crear una versión especial de su sitio web para dispositivo móvil, con una URL diferente (a menudo algo así como <em>m.example.com</em> o <em>example.mobi</em>). Esto significaba que había que desarrollar y actualizar dos versiones independientes del sitio web.</p>
-
-<p>Además, estos sitios web para dispositivos móviles a menudo ofrecían una experiencia muy reducida. A medida que los dispositivos móviles se volvían más potentes y capaces de mostrar sitios web completos, esto resultaba frustrante para los usuarios de dispositivos móviles, que se veían atrapados en la versión móvil del sitio web y no podían acceder a la información que sabían que había en la versión de escritorio, que incluía todas las funciones del sitio web.</p>
-
-<h2 id="Diseño_flexible_antes_del_diseño_responsivo">Diseño flexible antes del diseño responsivo</h2>
-
-<p>Se desarrollaron varios enfoques para tratar de resolver los inconvenientes de los métodos líquidos o de ancho fijo para crear sitios web. En 2004, Cameron Adams escribió una publicación titulada <a href="http://www.themaninblue.com/writing/perspective/2004/09/21/">Resolution dependent layout</a>, que describe un método para crear un diseño que podría adaptarse a diferentes resoluciones de pantalla. Este enfoque requería JavaScript para detectar la resolución de la pantalla y cargar el CSS correcto.</p>
-
-<p>Zoe Mickley Gillenwater fue determinante en <a href="http://zomigi.com/blog/voices-that-matter-slides-available/">su trabajo</a> de descripción y formalización de los diversos modos en que se podían crear sitios web flexibles para intentar encontrar una situación intermedia entre llenar toda la pantalla o tener un tamaño completamente fijo.</p>
-
-<h2 id="Diseño_responsivo">Diseño responsivo</h2>
-
-<p>El término <em>diseño responsivo</em> fue acuñado por <a href="https://alistapart.com/article/responsive-web-design/">Ethan Marcotte en 2010</a>, y describía el uso combinado de tres técnicas.</p>
-
-<ol>
- <li>La primera era la idea de las redes fluidas, algo que ya exploraba Gillenwater, y que puede leerse en el artículo de Marcotte, <a href="https://alistapart.com/article/fluidgrids/">Fluid Grids</a> (publicado en 2009 en <em>A list apart</em>).</li>
- <li>La segunda técnica era la idea de las <a href="http://unstoppablerobotninja.com/entry/fluid-images">imágenes fluidas</a>. Usando una técnica muy simple de establecer la propiedad de <code>max-width</code> al <code>100%</code>, las imágenes se reducían si su columna de contención se volvía más estrecha que el tamaño intrínseco de la imagen, pero nunca se expandía. Esto permite reducir una imagen para que se ajuste a una columna de tamaño flexible, en lugar de que desborde, pero no se expande ni se pixela si la columna se ensancha más que la imagen.</li>
- <li>El tercer componente clave era la <a href="/es/docs/Web/CSS/Media_Queries">consulta a los media</a>. Las consultas a los media habilitan el tipo de cambio de diseño que Cameron Adams había explorado previamente usando JavaScript, pero usando solo CSS. En lugar de tener un único diseño para todos los tamaños de pantalla, el diseño podría cambiarse. Las barras laterales pueden reposicionarse en una pantalla más pequeña, o puede mostrarse una navegación alternativa.</li>
-</ol>
-
-<p>Es importante comprender que <strong>el diseño web responsivo no es una tecnología independiente</strong>: es un término utilizado para describir un enfoque para el diseño web, o un conjunto de buenas prácticas utilizado para crear un diseño que puede <em>responder</em> según el dispositivo que se utiliza para ver un contenido. En la exploración original de Marcotte, esto significaba cuadrículas flexibles (mediante elementos flotantes) y consultas de media; sin embargo, en los casi 10 años desde que se escribió ese artículo, trabajar de manera responsiva se ha convertido en la norma. Los métodos de diseño CSS modernos son inherentemente responsivos, y la plataforma web dispone de herramientas integradas nuevas que facilitan el diseño de sitios web responsivos.</p>
-
-<p>El resto de este artículo te indicará las diversas características de la plataforma web que puedas querer utilizar para crear un sitio responsivo.</p>
-
-<h2 id="La_consulta_a_los_media">La consulta a los media</h2>
-
-<p>El diseño responsivo solo pudo surgir gracias a la consulta a los media. La especificación de nivel 3 de consulta a los media se convirtió en una candidata a Recomendación en 2009, lo que significa que se consideró lista para su implementación en los navegadores. Las consultas a los media nos permiten ejecutar una serie de pruebas (por ejemplo, si la pantalla del usuario es mayor que un ancho o una resolución determinados) y aplicar CSS selectivamente para diseñar la página de manera que resulte adecuada a las necesidades del usuario.</p>
-
-<p>Por ejemplo, la consulta a los media siguiente explora si la página web que se muestra lo hace como un medio de pantalla (por lo tanto, no es un documento impreso) y si la ventana tiene al menos 800 píxeles de ancho. El CSS para el selector <code>.container</code> solo se aplicará si ambas condiciones son ciertas.</p>
-
-<pre class="brush: css"><code>@media screen and (min-width: 800px) {
-  .container {
-    margin: 1em 2em;
-  }
-} </code>
-</pre>
-
-<p>Puedes añadir múltiples consultas a los media dentro de una hoja de estilo, y ajustar todo tu diseño o solo partes de él para que se adapte mejor a los diferentes tamaños de pantalla. Los puntos en los que se introduce una consulta a los media y se cambia el diseño se conocen como <em>puntos de interrupción</em>.</p>
-
-<p>Un enfoque común cuando se usan las consultas a los media es crear un diseño sencillo de una sola columna para dispositivos de pantalla estrecha (por ejemplo, teléfonos móviles), luego implementar un diseño en columnas para pantallas más grandes cuando se sabe que hay suficiente ancho de pantalla para manejarlo. Esto se describe a menudo como diseño <strong>primero móvil</strong>.</p>
-
-<p>Obtén más información sobre las <a href="/es/docs/Web/CSS/Media_Queries">consultas a los media</a> en la documentación de MDN.</p>
-
-<h2 id="Cuadrículas_flexibles">Cuadrículas flexibles</h2>
-
-<p>Los sitios responsivos no solo cambian su diseño entre puntos de interrupción, sino que se construyen sobre cuadrículas flexibles. Una cuadrícula flexible significa que no tienes que centrarte en todos los tamaños de dispositivo posibles y construir para ellos un diseño en píxeles perfecto. Ese enfoque sería imposible dada la gran cantidad de dispositivos de tamaños diferentes que hay, y el hecho de que, al menos en la versión de escritorio, las personas no siempre tienen la ventana de su navegador maximizada.</p>
-
-<p>Al usar una cuadrícula flexible, solo necesitas añadir un punto de interrupción y cambiar el diseño en el punto en que el contenido comienza a verse mal. Por ejemplo, si las longitudes de las líneas se vuelven interminablemente largas a medida que el tamaño de la pantalla aumenta, o una caja se encoje hasta un ancho de dos palabras en cada línea a medida que el tamaño de la pantalla se reduce.</p>
-
-<p>En los primeros días del diseño responsivo, nuestra única opción para el diseño de páginas web era usar <a href="/es/docs/Learn/CSS/CSS_layout/Floats">elementos flotantes</a>. Los diseños de pantalla con elementos flotantes flexibles se lograban dando a cada elemento un ancho porcentual asegurándose de que para toda la página no alcanzara más del 100%. En su trabajo original sobre cuadrículas fluidas, Marcotte detalló una fórmula para tomar un diseño de página web diseñado usando píxeles y convertirlo en porcentajes.</p>
-
-<pre><code>target / context = result </code>
-</pre>
-
-<p>Por ejemplo, si el tamaño de nuestra columna de destino es de 60 píxeles y el contexto (o contenedor) en el que se encuentra es de 960 píxeles, dividimos 60 por 960 para obtener un valor que podemos usar en nuestro CSS, después de mover el separador de cifras decimales dos posiciones a la derecha.</p>
-
-<pre class="brush: css"><code>.col {
-  width: 6.25%; /* 60 / 960 = 0.0625 */
-} </code>
-</pre>
-
-<p>Este enfoque se encuentra hoy en muchos lugares de la web, y aquí está documentado en la sección de compaginación de nuestro artículo sobre <a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">métodos de compaginación heredados</a>. Es probable que encuentres sitios web que utilizan este enfoque en su trabajo, por lo que vale la pena entenderlo, aunque no vas a construir un sitio web moderno utilizando una cuadrícula flexible basada en elementos flotantes.</p>
-
-<p>El ejemplo siguiente muestra un diseño responsivo sencillo que utiliza consultas a los medios y una cuadrícula flexible. En pantallas estrechas, el diseño de página muestra las cajas en columna una encima de la otra:</p>
-
-<figure><img alt="Una vista de un dispositivo móvil con un diseño de página con cajas en columna vertical una encima de la otra." src="https://mdn.mozillademos.org/files/16836/mdn-rwd-mobile.png" style="display: block; height: 407px; width: 300px;">
-<figcaption></figcaption>
-</figure>
-
-<p>En pantallas más anchas se pasa a dos columnas:</p>
-
-<figure><img alt="Una vista de un dispositivo de escritorio con un diseño a dos columnas." src="https://mdn.mozillademos.org/files/16837/mdn-rwd-desktop.png" style="display: block; height: 217px; width: 600px;">
-<figcaption></figcaption>
-</figure>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar el <a href="https://mdn.github.io/css-examples/learn/rwd/float-based-rwd.html">ejemplo en vivo</a> y el <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/float-based-rwd.html">código fuente</a> de este ejemplo en GitHub.</p>
-</div>
-
-<h2 id="Tecnologías_modernas_de_diseño_de_páginas_web">Tecnologías modernas de diseño de páginas web</h2>
-
-<p>Los métodos modernos de diseño de páginas web, como el <a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">diseño en columnas</a>, <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a> y <a href="/es/docs/Learn/CSS/CSS_layout/Grids">Grid</a> son responsivos por defecto. Todos estos métodos asumen que tratas de crear una cuadrícula flexible y te proporcionan los modos más fáciles de hacerlo.</p>
-
-<h3 id="Multicol">Multicol</h3>
-
-<p>El más antiguo de estos métodos de diseño de páginas web es multicol. Cuando especificas un atributo <code>column-count</code>, esto indica en cuántas columnas deseas dividir tu contenido. El navegador entonces calcula el tamaño de estas columnas, que cambiará de acuerdo con el tamaño de la pantalla.</p>
-
-<pre class="brush: css"><code>.container {
-  column-count: 3;
-} </code>
-</pre>
-
-<p>Si en lugar de ello estableces el atributo <code>column-width</code>, especificas un ancho <em>mínimo</em>. El navegador crea tantas columnas de ese ancho como quepan cómodamente en el contenedor, y reparte el espacio entre todas las columnas. Por lo tanto, el número de columnas cambia según la cantidad de espacio que hay.</p>
-
-<pre class="brush: css"><code>.container {
-  column-width: 10em;
-} </code>
-</pre>
-
-<h3 id="Flexbox">Flexbox</h3>
-
-<p>En el método Flexbox, los elementos flexibles se encogen y distribuyen el espacio entre los elementos según el espacio que hay en su contenedor, según su comportamiento inicial. Al cambiar los valores de <code>flex-grow</code> y <code>flex-shrink</code>, puedes indicar cómo deseas que se comporten los elementos cuando a su alrededor hay más o menos espacio.</p>
-
-<p>En el ejemplo siguiente, los elementos flexibles ocupan cada uno la misma cantidad de espacio en el contenedor flexible, al utilizar la abreviatura <code>flex: 1</code> como se describe en el artículo <a href="/es/docs/Learn/CSS/CSS_layout/Grids#Cuadr%C3%ADculas_flexibles_con_la_unidad_fr">Flexbox: Dimensionamiento flexible de los elementos flex</a>.</p>
-
-<pre class="brush: css"><code>.container {
-  display: flex;
-}
-
-.item {
-  flex: 1;
-} </code>
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Como ejemplo, hemos reconstruido el anterior diseño de página responsivo sencillo, esta vez usando Flexbox. Puedes ver que ya no necesitamos usar valores de porcentaje extraños para calcular el tamaño de las columnas: <a href="https://mdn.github.io/css-examples/learn/rwd/flex-based-rwd.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/flex-based-rwd.html">código fuente</a>.</p>
-</div>
-
-<h3 id="Cuadrículas_CSS">Cuadrículas CSS</h3>
-
-<p>En el diseño de cuadrículas con CSS, la unidad <code>fr</code> permite la distribución del espacio disponible en las trazas de la cuadrícula. El ejemplo siguiente crea un contenedor de cuadrícula con tres trazas dimensionadas a <code>1fr</code>. Esto crea tres columnas, cada una de las cuales ocupa una parte del espacio que hay disponible en el contenedor. Puedes obtener más información sobre este enfoque para crear una cuadrícula en el módulo Aprender a diseñar cuadrículas en <a href="/en-US/docs/Learn/CSS/CSS_layout/Grids#Flexible_grids_with_the_fr_unit">Cuadrículas flexibles con la unidad fr</a>.</p>
-
-<pre class="brush: css"><code>.container {
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-} </code>
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: La versión del diseño de página en cuadrícula es aún más simple, ya que podemos definir las columnas en .wrapper: <a href="https://mdn.github.io/css-examples/learn/rwd/grid-based-rwd.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/grid-based-rwd.html">código fuente</a>.</p>
-</div>
-
-<h2 id="Imágenes_responsivas">Imágenes responsivas</h2>
-
-<p>El enfoque más simple para las imágenes responsivas es el que se describe en los primeros artículos de Marcotte sobre diseño responsivo. Básicamente, tomar una imagen que tenga el tamaño más grande que puedas necesitar, y reducirla. Este continúa siendo un enfoque utilizado hoy en día, y en la mayoría de las hojas de estilo encontrarás en alguna parte el CSS siguiente:</p>
-
-<pre class="brush: css"><code>img {
-  max-width: 100%:
-} </code>
-</pre>
-
-<p>Hay inconvenientes obvios en este enfoque. La imagen puede mostrarse mucho más pequeña que su tamaño intrínseco, lo que representa una pérdida de ancho de banda: un usuario de dispositivo móvil puede descargar una imagen que sea varias veces el tamaño de lo que ve en realidad en la ventana del navegador. Además, es posible que no desees la misma relación de aspecto de la imagen en dispositivos móviles y en ordenadores de escritorio. Por ejemplo, podría ser bueno tener una imagen cuadrada para dispositivos móviles, pero mostrar la misma escena que una imagen horizontal en el escritorio. O bien es posible que, reconociendo el tamaño más pequeño de una imagen en dispositivos móviles, desees mostrar una imagen diferente, que se entienda mejor en un tamaño de pantalla pequeño. Estas cosas no se pueden lograr simplemente reduciendo una imagen.</p>
-
-<p>Las imágenes responsivas, que utilizan el elemento {{htmlelement ("picture")}} y los atributos {{htmlelement ("img")}} <code>srcset</code> y <code>sizes</code> resuelven ambos problemas. Puedes proporcionar varios tamaños junto con «sugerencias» (metadatos que describen el tamaño de pantalla y la resolución para que la imagen sea la más adecuada), y el navegador elije la imagen que resulta más adecuada para cada dispositivo, y se asegura de que el usuario descarga un tamaño de imagen apropiado para el dispositivo que utiliza.</p>
-
-<p>También puedes usar imágenes <em>de director artístico</em>, que proporcionan un recorte o una imagen completamente diferente para diferentes tamaños de pantalla.</p>
-
-<p>Puedes encontrar una <a href="/es/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">guía detallada de imágenes responsivas en el artículo sobre Aprender HTML</a> en MDN.</p>
-
-<h2 id="Tipografía_responsiva">Tipografía responsiva</h2>
-
-<p>Un elemento de diseño responsivo que todavía no hemos tratado en trabajos anteriores es la idea de la tipografía responsiva. Este concepto describe esencialmente el hecho de cambiar el tamaño de letra según el espacio de pantalla que reflejan las consultas a media.</p>
-
-<p>En este ejemplo, queremos establecer que nuestro encabezado de nivel 1 sea <code>4rem</code>, lo que significa que será cuatro veces nuestro tamaño de letra base. ¡Es un título muy grande! Solo queremos este título de encabezado gigante en los tamaños de pantalla más grandes, por lo tanto, primero creamos un título de encabezado más pequeño y luego usamos las consultas a los media para sobrescribirlo con el tamaño más grande si sabemos que el usuario tiene un tamaño de pantalla de al menos <code>1200px</code>.</p>
-
-<pre class="brush: css"><code>html {
-  font-size: 1em;
-}
-
-h1 {
-  font-size: 2rem;
-}
-
-@media (min-width: 1200px) {
-  h1 {
-    font-size: 4rem;
-  }
-} </code>
-</pre>
-
-<p>Hemos editado nuestro ejemplo anterior de cuadrícula responsiva para incluir también el tipo de respuesta utilizando el método descrito. Puedes ver cómo el título de encabezado cambia de tamaño cuando el diseño para a la versión de dos columnas.</p>
-
-<p>En la versión para dispositivo móvil, el encabezado es más pequeño:</p>
-
-<figure><img alt="Un diseño de elementos apilados en columna con un tamaño de título de encabezado pequeño." src="https://mdn.mozillademos.org/files/16838/mdn-rwd-font-mobile.png" style="display: block; height: 407px; width: 300px;">
-<figcaption></figcaption>
-</figure>
-
-<p>Sin embargo, en las versiones de escritorio vemos un tamaño de título de encabezado más grande:</p>
-
-<figure><img alt="Un diseño en dos columnas con un título grande." src="https://mdn.mozillademos.org/files/16839/mdn-rwd-font-desktop.png" style="display: block; height: 169px; width: 600px;">
-<figcaption></figcaption>
-</figure>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Observa este ejemplo en: <a href="https://mdn.github.io/css-examples/learn/rwd/type-rwd.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/type-rwd.html">código fuente</a>.</p>
-</div>
-
-<p>Como muestra este enfoque sobre la tipografía, no es necesario restringir las consultas a medios a cambiar solo el diseño de página. Se pueden usar para ajustar cualquier elemento y hacerlo más útil o atractivo según los diversos tamaños de pantalla.</p>
-
-<h3 id="El_uso_de_unidades_de_ventana_gráfica_para_tipografía_responsiva">El uso de unidades de ventana gráfica para tipografía responsiva</h3>
-
-<p>Un enfoque interesante es utilizar las unidades de ventana gráfica <code>vw</code> para habilitar la tipografía responsiva. <code>1vw</code> es igual al uno por ciento del ancho de la ventana gráfica, lo que significa que si configuras el tamaño del tipo de letra con <code>vw</code>, siempre estará en relación con el tamaño de la ventana gráfica.</p>
-
-<pre class="brush: css">h1 {
-  font-size: 6vw;
-}</pre>
-
-<p>El problema de hacer esto es que el usuario pierde la posibilidad de ampliar cualquier conjunto de texto configurado en unidades <code>vw</code>, porque ese texto siempre está en relación con el tamaño de la ventana gráfica. <strong>Por lo tanto, nunca hay que establecer texto utilizando solo unidades de ventana</strong>.</p>
-
-<p>Hay una solución, que implica el uso de la función <code><a href="/en-US/docs/Web/CSS/calc">calc()</a></code>. Si añades la unidad <code>vw</code> a un valor establecido con un tamaño fijo, como <code>em</code> o <code>rem</code>, el texto continúa siendo ampliable. Esencialmente, la unidad <code>vw</code> se añade sobre ese valor ampliado:</p>
-
-<pre class="brush: css">h1 {
-  font-size: calc(1.5rem + 3vw);
-}</pre>
-
-<p>Esto significa que necesitamos especificar el tamaño de letra para el título de encabezado una sola vez, en lugar de configurarlo para dispositivos móviles y redefinirlo en las consultas a medios. Luego, el tipo de letra aumenta gradualmente a medida que aumenta el tamaño de la ventana gráfica.</p>
-
-<div class="blockIndicator note">
-<p>Observa un ejemplo en: <a href="https://mdn.github.io/css-examples/learn/rwd/type-vw.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/type-vw.html">código fuente</a>.</p>
-</div>
-
-<h2 id="La_metaetiqueta_viewport">La metaetiqueta viewport</h2>
-
-<p>Si observas el tipo de letra de una página HTML responsiva, en general vas a encontrar la siguiente etiqueta {{htmlelement ("meta")}} en la cabecera del documento.</p>
-
-<pre class="brush: html"><code>&lt;meta name="viewport" content="width=device-width,initial-scale=1"&gt;</code>
-</pre>
-
-<p>Esta metaetiqueta informa a los navegadores de los dispositivos móviles que deben establecer el ancho de la ventana gráfica al ancho del dispositivo y escalar el documento al 100% de ese tamaño, de modo que el documento se mostrará al tamaño optimizado para esos dispositivos móviles.</p>
-
-<p>¿Por qué esto es necesario? Porque los navegadores de los dispositivos móviles tienden a mentir sobre el ancho de su ventana gráfica.</p>
-
-<p>Esta metaetiqueta existe porque cuando se lanzó el iPhone original y la gente comenzó a ver sitios web en una pequeña pantalla de teléfono móvil, la mayoría de los sitios web no estaban optimizados para dispositivos móviles. Por lo tanto, el navegador móvil establecía el ancho de la ventana gráfica en 960 píxeles, representaba la página con ese ancho y mostraba el resultado como una versión reducida del diseño del escritorio. Otros navegadores de dispositivos móviles (por ejemplo, en Google Android) hicieron lo mismo. Los usuarios podían acercarse y desplazarse por el sitio web para ver las partes que les interesaban, pero se veía mal. Todavía verás esto hoy en día si tienes la desgracia de encontrarte con un sitio web que no tiene un diseño de página responsivo.</p>
-
-<p>El problema es que tu diseño responsivo con puntos de interrupción y consultas a media no va a funcionar según lo previsto en los navegadores de dispositivos móviles, si tienes un diseño de pantalla estrecho que se inicia con un ancho de ventana de 480px o menos, pero la ventana gráfica está configurada en 960px. E cambio, al configurar <code>width=device-width</code> anulas el ancho predeterminado <code>width=960px</code> de Apple con el ancho real del dispositivo, y tus consultas a media funcionarán según lo previsto.</p>
-
-<p><strong>Por lo tanto, <em>siempre</em> debes incluir la línea de HTML anterior en la cabecera de tus documentos.</strong></p>
-
-<p>Con la metaetiqueta <code>viewport</code> puedes usar otras configuraciones, aunque, en general vas a querer usar la línea anterior.</p>
-
-<ul>
- <li><code>initial-scale</code>: Establece el zoom inicial de la página, que establecemos en 1.</li>
- <li><code>height</code>: Establece una altura específica para la ventana gráfica.</li>
- <li><code>minimum-scale</code>: Establece el nivel mínimo de zoom.</li>
- <li><code>maximum-scale</code>: Establece el nivel máximo de zoom.</li>
- <li><code>user-scalable</code>: Impide el zoom si se establece en <code>no</code>.</li>
-</ul>
-
-<p>Deberías evitar el uso de <code>minimum-scale</code> y <code>maximum-scale</code>, y en particular establecer <code>user-scalable</code> en <code>no</code>. Hay que permitir a los usuarios hacer zoom tanto o tan poco como lo necesiten; evitarlo provoca problemas de accesibilidad.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Hay una @regla CSS establecida para reemplazar la metaetiqueta <code>viewport</code>: <a href="/en-US/docs/Web/CSS/@viewport">@viewport</a>. Sin embargo, tiene poca compatibilidad con los navegadores. Se implementó en Internet Explorer y Edge, pero una vez que se lance el navegador Edge basado en Chromium, dejará de formar parte del navegador Edge.</p>
-</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El diseño responsivo se refiere a un diseño página de un sitio web o una aplicación que responde al entorno en el que se visualiza. Abarca una serie de características y técnicas de CSS y HTML, y ahora es esencialmente el modo como construimos los sitios web de forma predeterminada. Piensa en los sitios web que visitas con tu dispositivo móvil; probablemente sea inusual encontrar un sitio web que tenga la versión de escritorio reducida o en que necesites desplazarse hacia los lados para encontrar las cosas. Esto se debe a que la web se ha movido a este enfoque de diseño responsivo.</p>
-
-<p>Además, lograr diseños responsivos se ha vuelto mucho más fácil con la ayuda de los métodos de diseño que has aprendido en estos artículos. Si eres nuevo en el desarrollo web, hoy tienes muchas más herramientas a tu disposición que en los primeros días del diseño de página responsivo. Por lo tanto, vale la pena verificar la antigüedad de los materiales que consultas. Si bien los artículos históricos continúan siendo útiles, el uso moderno de CSS y HTML facilita mucho la creación de diseños elegantes y útiles, sin importar con qué dispositivo el visitante visita el sitio.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Multiple-column_Layout", "Learn/CSS/CSS_layout/Media_queries", "Learn/CSS/CSS_layout")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">Flujo normal</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Elementos flotantes</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño responsivo</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a medios</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredados</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad de navegadores antiguos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de elementos básicos de compaginación</a></li>
-</ul>
diff --git a/files/es/learn/css/css_layout/flujo_normal/index.html b/files/es/learn/css/css_layout/flujo_normal/index.html
deleted file mode 100644
index ffc873938f..0000000000
--- a/files/es/learn/css/css_layout/flujo_normal/index.html
+++ /dev/null
@@ -1,95 +0,0 @@
----
-title: Flujo normal
-slug: Learn/CSS/CSS_layout/Flujo_normal
-translation_of: Learn/CSS/CSS_layout/Normal_Flow
----
-<div>{{LearnSidebar}}</div>
-
-<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Introduction", "Learn/CSS/CSS_layout/Flexbox", "Learn/CSS/CSS_layout")}}</p>
-
-<p class="summary">Este artículo explica el flujo normal, o la forma en que se presentan los elementos de la página web si no cambias su compaginación.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Conocer cómo los navegadores presentan de forma predeterminada las páginas web antes de comenzar a hacer cambios.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Como se detalla en el último artículo de introducción al diseño, los elementos en una página web se distribuyen según el flujo normal si no se aplica ningún CSS que cambie la forma en la que se comportan. Y, como comenzamos a descubrir, puedes cambiar el comportamiento de los elementos, ya sea ajustando su posición en este flujo normal o eliminándolos de este por completo. Comenzar con un documento coherente y bien estructurado que sea legible en el flujo normal es la mejor manera de comenzar cualquier página web. Asegura que tu contenido sea legible, incluso si el usuario usa un navegador muy limitado o un dispositivo como un lector de pantalla que lee el contenido de la página. Además, como el flujo normal está diseñado para que un documento sea legible, al comenzar de esta manera, trabajas en el documento en lugar de luchar contra él a medida que haces cambios en su diseño.</p>
-
-<p>Antes de profundizar en los diferentes métodos de diseño, vale la pena revisar algunas de las cosas que ya debes haber estudiado en artículos anteriores con respecto al flujo normal de los documentos.</p>
-
-<h2 id="¿Cómo_se_presentan_por_defecto_los_elementos">¿Cómo se presentan por defecto los elementos?</h2>
-
-<p>En primer lugar, se toma de las cajas de cada uno de los elementos el contenido, luego se añade cualquier área de relleno, borde y margen alrededor de ellas; es el modelo de cajas que hemos visto antes.</p>
-
-<p>De manera predeterminada, el contenido de un <a href="/es/docs/Web/HTML/Block-level_elements">elemento de nivel de bloque</a> es el 100% del ancho de su elemento padre y su altura viene determinada por su contenido. Los <a href="/es/docs/Web/HTML/Elementos_en_línea">elementos en línea</a> tienen su altura y anchura determinados por su contenido. No puedes establecer el ancho o la altura de los elementos en línea, simplemente se ubican dentro del contenido de los elementos de nivel de bloque. Si deseas controlar el tamaño de un elemento en línea de esta manera, debes configurarlo para que se comporte como un elemento de nivel de bloque con <code>display: block;</code> (o incluso, <code>display: inline-block;</code>, que combina características de ambos).</p>
-
-<p>Esto explica los elementos individuales, pero ¿qué hay del modo como los elementos interactúan entre sí? El flujo de diseño normal (mencionado en el artículo de introducción al diseño) es el sistema mediante el cual los elementos se colocan en la ventana gráfica del navegador. De manera predeterminada, los elementos de nivel de bloque se presentan en la <em>dirección del flujo del bloque</em>, en función del <a href="/es/docs/Web/CSS/writing-mode">modo de escritura</a> de los padres (<em>initial</em>: horizontal-tb): cada uno aparecerá en una línea nueva debajo de la última, y estarán separados por cualquier margen que se establezca en ellos. Por lo tanto, en inglés, o en cualquier otro modo de escritura horizontal y de arriba a abajo, los elementos de nivel de bloque se disponen verticalmente.</p>
-
-<p>Los elementos en línea se comportan de manera diferente: no aparecen en líneas nuevas; en su lugar, se asientan en la misma línea entre sí y con cualquier contenido de texto adyacente (o envuelto), siempre que tengan espacio dentro del ancho del elemento de nivel de bloque primario. Si no hay espacio, el texto o los elementos que desborden bajarán a la línea siguiente.</p>
-
-<p>Si dos elementos adyacentes tienen algún margen configurado y los dos márgenes se tocan, se mantiene el mayor de los dos y el menor desaparece; esto se llama colapso del margen, y ya lo hemos visto antes.</p>
-
-<p>Echemos un vistazo a un ejemplo sencillo que explica todo esto:</p>
-
-<div id="Normal_Flow">
-<pre class="brush: html">&lt;h1&gt;Flujo de los documentos básicos&lt;/h1&gt;
-
-&lt;p&gt;Soy un elemento básico de nivel de bloque. Mis elementos de nivel de bloque adyacentes se encuentran en líneas nuevas debajo de mí.&lt;/p&gt;
-
-&lt;p&gt;Cubrimos por defecto el 100% del ancho de nuestro elemento principal, y somos tan altos como nuestro contenido secundario. Nuestro ancho y alto total es nuestro contenido + área de relleno + ancho/alto del borde.&lt;/p&gt;
-
-&lt;p&gt;Estamos separados por nuestros márgenes. Debido al colapso del margen, estamos separados por el ancho de uno de nuestros márgenes, no por ambos.&lt;/p&gt;
-
-&lt;p&gt;Los elementos en línea &lt;span&gt;como este&lt;/span&gt; y &lt;span&gt;este otro&lt;/span&gt; se ubican en la misma y la de los nodos de texto adyacentes, mientras hay espacio en la misma línea. Si un elemento en línea desborda, &lt;span&gt;sigue por la línea siguiente, si es posible (como la que contiene este texto)&lt;/span&gt;, o simplemente pasa a una línea nueva, como hace esta imagen: &lt;img src="https://mdn.mozillademos.org/files/13360/long.jpg"&gt;&lt;/p&gt;</pre>
-
-<pre class="brush: css">body {
-  width: 500px;
-  margin: 0 auto;
-}
-
-p {
-  background: rgba(255,84,104,0.3);
-  border: 2px solid rgb(255,84,104);
-  padding: 10px;
-  margin: 10px;
-}
-
-span {
-  background: white;
-  border: 1px solid black;
-}</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Normal_Flow', '100%', 500) }}</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Ahora que comprendes el flujo normal y cómo el navegador presenta las cosas por defecto, continúa para comprender cómo cambiar esta pantalla predeterminada para crear el diseño que necesitas.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Introduction", "Learn/CSS/CSS_layout/Flexbox", "Learn/CSS/CSS_layout")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">El flujo normal</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Flotación</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño adaptativo</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a media</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredada</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad con los navegadores antiguos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de de elementos básicos de compaginación </a></li>
-</ul>
diff --git a/files/es/learn/css/css_layout/introducción/index.html b/files/es/learn/css/css_layout/introducción/index.html
deleted file mode 100644
index 2f409d97c3..0000000000
--- a/files/es/learn/css/css_layout/introducción/index.html
+++ /dev/null
@@ -1,701 +0,0 @@
----
-title: Introducción al diseño en CSS
-slug: Learn/CSS/CSS_layout/Introducción
-translation_of: Learn/CSS/CSS_layout/Introduction
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/CSS/CSS_layout/Normal_Flow", "Learn/CSS/CSS_layout")}}</div>
-
-<p class="summary">Este artículo resumirá algunas de las características de diseño de páginas web con CSS que ya hemos mencionado en módulos anteriores, como los diferentes valores de {{cssxref ("display")}}, e introducirá algunos de los conceptos que vamos a tratar en este módulo.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Proporcionar una visión general de las técnicas de diseño de páginas web con CSS. Cada técnica se puede aprender con mayor detalle en tutoriales posteriores.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Las técnicas de diseño de páginas web con CSS nos permiten controlar dónde se ubican los elementos que están contenidos en una página web en relación con su posición predeterminada en el flujo de diseño normal, así como el resto de elementos a su alrededor, su contenedor principal o la vista/ventana principal. Las técnicas de diseño de páginas web que trataremos con más detalle en este módulo son:</p>
-
-<ul>
- <li>Flujo normal</li>
- <li>La propiedad {{cssxref ("display")}}</li>
- <li>Flexbox</li>
- <li>Grid</li>
- <li>Floats</li>
- <li>Posicionamiento</li>
- <li>Diseño de tablas</li>
- <li>Diseño a varias columnas</li>
-</ul>
-
-<p>Cada técnica tiene sus usos, ventajas y desventajas, y ninguna técnica está diseñada para usarse de forma aislada. Si entiendes para qué se ha diseñado cada método, te será fácil comprender cuál es la mejor herramienta de diseño para cada tarea.</p>
-
-<h2 id="Flujo_normal">Flujo normal</h2>
-
-<p>El flujo normal es el modo como el navegador presenta las páginas HTML de forma predeterminada cuando no haces nada para controlar el diseño de página. Echemos un vistazo rápido a un ejemplo HTML:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Amo a mi gato.&lt;/p&gt;
-
-&lt;ul&gt;
-  &lt;li&gt;Comprar comida para gatos&lt;/li&gt;
-  &lt;li&gt;Ejercicio&lt;/li&gt;
-  &lt;li&gt;Anímate amigo&lt;/li&gt;
-&lt;/ul&gt;
-
-&lt;p&gt;¡Fin!&lt;/p&gt;</pre>
-
-<p>Por defecto, el navegador mostrará este código de la manera siguiente:</p>
-
-<p>{{ EmbedLiveSample('Normal_flow', '100%', 200) }}</p>
-
-<p>Observa aquí cómo se muestra el HTML en el orden exacto en que aparece en el código fuente, con los elementos uno debajo del otro: el primer párrafo, seguido de la lista desordenada, y a continuación el segundo párrafo.</p>
-
-<p>Los elementos que aparecen uno debajo del otro se describen como <em>elementos de bloque</em>, en contraposición con los <em>elementos de línea</em>, que aparecen uno al lado del otro, como las palabras de un párrafo.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: La dirección en la que se presentan los contenidos de un elemento de bloque se describe como dirección de los bloques. La dirección de los bloques va de arriba a abajo en un idioma como el español, cuyo modo de escritura es horizontal. Sería horizontal en cualquier idioma con un modo de escritura vertical, como el japonés. Correspondientemente, la dirección de línea es la dirección en la que los contenidos de línea (por ejemplo, una frase) se disponen.</p>
-</div>
-
-<p>Cuando usas CSS para crear un diseño de página web, alejas los elementos del flujo normal, pero para muchos de los elementos de tu página, el flujo normal proporciona exactamente el diseño que necesitas. Por esta razón resulta tan importante comenzar con un documento HTML bien estructurado, porque te permite trabajar ya con la forma en que las cosas se presentan por defecto, en lugar de tener que luchar contra ello.</p>
-
-<p>Los métodos que permiten cambiar la disposición de los elementos en CSS son los siguientes:</p>
-
-<ul>
- <li><strong>La propiedad {{cssxref ("display")}}</strong>: los valores estándar como <code>block</code>, <code>inline</code> o <code>inline-block</code> pueden cambiar el comportamiento de los elementos en el flujo normal (consulta <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">Tipos de cajas en CSS</a> para obtener más información). Luego hay métodos de diseño completos que se activan con un valor <code>display</code>, por ejemplo <a href="/es/docs/Learn/CSS/CSS_layout/Grids">CSS Grid</a> y <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a>.</li>
- <li><strong>Floats</strong>: la aplicación de un valor {{cssxref ("float")}} como <code>left</code> puede hacer que los elementos de nivel de bloque rodeen el elemento por uno de sus lados, como la forma en que las imágenes a veces tienen texto flotando a su alrededor en los diseños de algunas revistas.</li>
- <li><strong>La propiedad {{cssxref ("position")}}</strong>: permite controlar con precisión la ubicación de las cajas dentro de otras cajas. El posicionamiento estático es el valor predeterminado en el flujo normal, pero puede hacer que los elementos se distribuyan de manera diferente si se utilizan otros valores, por ejemplo, pueden estar siempre fijados a la parte superior izquierda de la ventana del navegador.</li>
- <li><strong>Diseño de tablas</strong>: se pueden usar las características que sirven para diseñar las partes de una tabla HTML en elementos que no son de tabla con <code>display: table</code> y las propiedades asociadas.</li>
- <li><strong>Diseño en varias columnas</strong>: las propiedades de <a href="/es/docs/Web/CSS/Columnas_CSS">diseño en varias columnas</a> permiten distribuir el contenido de un bloque en columnas, como en el caso de un periódico.</li>
-</ul>
-
-<h2 id="La_propiedad_display">La propiedad display</h2>
-
-<p>Los métodos principales para lograr el diseño de páginas web con CSS son todos los valores de la propiedad <code>display</code>. Esta propiedad permite cambiar la forma predeterminada en que algo se muestra. Todo en flujo normal tiene un valor de <code>display</code>, utilizado como la forma como se comportan por defecto los elementos en los que están configurados. Por ejemplo, el hecho de que los párrafos en español se muestran uno debajo del otro se debe a que presentan la configuración <code>display: block</code>. Si creas un enlace alrededor de un texto dentro de un párrafo, ese enlace permanece en línea con el resto del texto y no se divide al pasar a una línea nueva. Esto se debe a que el elemento {{htmlelement ("a")}} es por defecto <code>display: inline</code>.</p>
-
-<p>Puedes cambiar este comportamiento predeterminado de visualización (<code>display</code>). Por ejemplo, el elemento {{htmlelement ("li")}} es <code>display: block</code> de forma predeterminada, lo que significa que los elementos de la lista se muestran uno debajo del otro en nuestro documento en español. Si cambiamos el valor de visualización a <code>inline</code>, ahora se muestran uno al lado del otro, como lo harían las palabras de una frase. El hecho de que puedas cambiar el valor de <code>display</code> de cualquier elemento significa que puedes elegir elementos HTML por su significado semántico, sin preocuparte por cómo se verán. La forma en que se ven es algo que puedes cambiar.</p>
-
-<p>Además de poder cambiar la presentación predeterminada de un elemento <code>block</code> a un elemento <code>inline</code> y viceversa, hay algunos métodos de diseño de página más poderosos que se inician como un valor de <code>display</code>. Sin embargo, cuando los uses, en general vas a necesitar propiedades adicionales. Los dos valores más importantes para nuestros propósitos cuando hablamos del diseño de páginas web son <code>display: flex</code> y <code>display: grid</code>.</p>
-
-<h2 id="Flexbox">Flexbox</h2>
-
-<p>Flexbox es el nombre corto del <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout">módulo de diseño de cajas flexibles</a>, pensado para facilitarnos la distribución de las cosas en una dimensión, ya sea como una fila o como una columna. Para usar el método Flexbox, aplica <code>display: flex</code> al elemento padre de los elementos que deseas distribuir; todos sus elementos hijo directos se convierten en elementos flexibles. Vamos a verlo en un ejemplo sencillo.</p>
-
-<p>El marcado HTML siguiente nos proporciona un elemento contenedor con una clase <code>wrapper</code> dentro del cual hay tres elementos {{htmlelement ("div")}}. Por defecto, estos elementos se mostrarían como elementos de bloque, uno debajo del otro, en nuestro documento en español.</p>
-
-<p>Sin embargo, si añadimos <code>display: flex</code> al elemento padre, los tres elementos se organizan en columnas. Esto se debe a que se convierten en <em>elementos flexibles</em> y se ven afectados por algunos valores iniciales que el método Flexbox establece en el contenedor flexible. Se muestran en una fila porque el valor inicial de {{cssxref ("flex-direction")}} establecido en su elemento padre es <code>row</code>. Todos parecen expandirse hasta la altura del elemento de más altura, porque el valor inicial de la propiedad {{cssxref ("align-items")}} establecida en su elemento primario es <code>stretch</code>. Esto significa que los artículos se expanden hasta la altura del contenedor flexible, que en este caso está definida por el artículo de mayor altura. Todos los artículos se alinean al comienzo del contenedor y dejan el espacio que sobra al final de la fila.</p>
-
-<div id="Flex_1">
-<div class="hidden">
-<h6 id="Ejemplo_Flexbox_1">Ejemplo Flexbox 1</h6>
-
-<pre class="brush: css notranslate">* {box-sizing: border-box;}
-
-.wrapper &gt; div {
-    border-radius: 5px;
-    background-color: rgb(207,232,220);
-    padding: 1em;
-}
-    </pre>
-</div>
-
-<pre class="brush: css notranslate">.wrapper {
-  display: flex;
-}
-</pre>
-
-<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
-  &lt;div class="box1"&gt;Uno&lt;/div&gt;
-  &lt;div class="box2"&gt;Dos&lt;/div&gt;
-  &lt;div class="box3"&gt;Tres&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Flex_1', '300', '200') }}</p>
-
-<p>Además de las propiedades anteriores, que pueden aplicarse a contenedores flexibles, también hay propiedades que pueden aplicarse a los elementos flexibles. Estas propiedades, entre otras cosas, pueden cambiar el comportamiento de estos elementos flexibles y permitirles expandirse y contraerse para adaptarse al espacio disponible.</p>
-
-<p>Como un ejemplo sencillo de esto podemos añadir la propiedad {{cssxref ("flex")}} a todos nuestros elementos secundarios, con un valor de <code>1</code>. Esto hará que todos los elementos crezcan y llenen el contenedor, en lugar de dejar espacio al final. Si hay más espacio, los artículos se ensancharán; si hay menos espacio, se volverán más estrechos. Además, si añades al código otro elemento, todos los elementos se volverán más pequeños para dejarle espacio; ajustarán el tamaño para ocupar la misma cantidad de espacio, cualquiera que sea.</p>
-
-<div id="Flex_2">
-<div class="hidden">
-<h6 id="Ejemplo_Flexbox_2">Ejemplo Flexbox 2</h6>
-
-<pre class="brush: css notranslate">* {box-sizing: border-box;}
-
-    .wrapper &gt; div {
-        border-radius: 5px;
-        background-color: rgb(207,232,220);
-        padding: 1em;
-    }</pre>
-</div>
-
-<pre class="brush: css notranslate">.wrapper {
-    display: flex;
-}
-
-.wrapper &gt; div {
-    flex: 1;
-}
-</pre>
-
-<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
-    &lt;div class="box1"&gt;Uno&lt;/div&gt;
-    &lt;div class="box2"&gt;Dos&lt;/div&gt;
-    &lt;div class="box3"&gt;Tres&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Flex_2', '300', '200') }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Esta ha sido una breve introducción de lo que permite el método Flexbox. Para obtener más información, consulta nuestro artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a>.</p>
-</div>
-
-<h2 id="Diseño_de_cuadrícula">Diseño de cuadrícula</h2>
-
-<p>Mientras que el método Flexbox está pensado para distribuir elementos unidimensionalmente, el diseño de cuadrícula está diseñado para distribuir elementos en dos dimensiones: alinear elementos en filas y columnas.</p>
-
-<p>Una vez más, puedes activar el diseño de páginas web en cuadrícula con un valor de visualización específico: <code>display: grid</code>. El ejemplo siguiente utiliza un marcado similar al del ejemplo del método Flexbox, con un contenedor y algunos elementos secundarios. Además de usar <code>display: grid</code>, también definimos algunos tramos de filas y columnas en el elemento padre con las propiedades {{cssxref("grid-template-rows")}} y {{cssxref("grid-template-columns")}}. Hemos definido tres columnas, cada una de <code>1fr</code>, y dos filas de <code>100px</code>. No necesitamos poner ninguna regla sobre los elementos secundarios porque se colocan automáticamente en las celdas que nuestra cuadrícula ha creado.</p>
-
-<div id="Grid_1">
-<div class="hidden">
-<h6 id="Ejemplo_de_cuadrícula_1">Ejemplo de cuadrícula 1</h6>
-
-<pre class="brush: css notranslate">* {box-sizing: border-box;}
-
-    .wrapper &gt; div {
-        border-radius: 5px;
-        background-color: rgb(207,232,220);
-        padding: 1em;
-    }</pre>
-</div>
-
-<pre class="brush: css notranslate">.wrapper {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr;
-    grid-template-rows: 100px 100px;
-    grid-gap: 10px;
-}
-</pre>
-
-<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
-    &lt;div class="box1"&gt;Uno&lt;/div&gt;
-    &lt;div class="box2"&gt;Dos&lt;/div&gt;
-    &lt;div class="box3"&gt;Tres&lt;/div&gt;
-    &lt;div class="box4"&gt;Cuatro&lt;/div&gt;
-    &lt;div class="box5"&gt;Cinco&lt;/div&gt;
-    &lt;div class="box6"&gt;Seis&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Grid_1', '300', '330') }}</p>
-
-<p>Cuando ya tienes una cuadrícula, se puede colocar tus elementos en ella explícitamente en lugar de confiar en el comportamiento de colocación automática que hemos visto arriba. En el segundo ejemplo, hemos definido la misma cuadrícula, pero esta vez con tres elementos secundarios. Hemos establecido la línea de inicio y final de cada elemento con las propiedades {{cssxref ("grid-column")}} y {{cssxref ("grid-row")}}. Esto hace que los elementos abarquen varios tramos.</p>
-
-<div id="Grid_2">
-<div class="hidden">
-<h6 id="Ejemplo_de_cuadrícula_2">Ejemplo de cuadrícula 2</h6>
-
-<pre class="brush: css notranslate">* {box-sizing: border-box;}
-
-    .wrapper &gt; div {
-        border-radius: 5px;
-        background-color: rgb(207,232,220);
-        padding: 1em;
-    }</pre>
-</div>
-
-<pre class="brush: css notranslate">.wrapper {
-    display: grid;
-    grid-template-columns: 1fr 1fr 1fr;
-    grid-template-rows: 100px 100px;
-    grid-gap: 10px;
-}
-
-.box1 {
-    grid-column: 2 / 4;
-    grid-row: 1;
-}
-
-.box2 {
-    grid-column: 1;
-    grid-row: 1 / 3;
-}
-
-.box3 {
-    grid-row: 2;
-    grid-column: 3;
-}
-</pre>
-
-<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
-    &lt;div class="box1"&gt;Uno&lt;/div&gt;
-    &lt;div class="box2"&gt;Dos&lt;/div&gt;
-    &lt;div class="box3"&gt;Tres&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Grid_2', '300', '330') }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Estos dos ejemplos son solo una pequeña parte del poder del diseño de cuadrículas; para obtener más información, consulta nuestro artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Grids">Diseñar cuadrículas</a>.</p>
-</div>
-
-<p>El resto de esta guía expone otros métodos de diseño de páginas web que son menos importantes para las estructuras principales de diseño de tu página web, pero que pueden serte de ayuda para tareas específicas. Si entiendes la naturaleza de cada una de las tareas de diseño de una página web, vas a descubrir enseguida que a menudo vas a ser capaz de discernir qué tipo de diseño se adapta mejor a cada componente de tu diseño particular.</p>
-
-<h2 id="Floats">Floats</h2>
-
-<p>El método de flotación de un elemento cambia el comportamiento de ese elemento y de los elementos de nivel de bloque que lo siguen en el flujo normal. El elemento es desplazado hacia la izquierda o hacia la derecha y es eliminado del flujo normal, y el contenido circundante flota alrededor de este elemento.</p>
-
-<p>La propiedad {{cssxref ("float")}} tiene cuatro valores posibles:</p>
-
-<ul>
- <li><code>left</code>: establece la flotación a la izquierda del elemento.</li>
- <li><code>right</code>: establece la flotación a la derecha del elemento.</li>
- <li><code>none</code>: especifica que no hay flotación en absoluto. Este es el valor predeterminado.</li>
- <li><code>inherit</code>: especifica que el valor de la propiedad <code>float</code> debe heredarse del elemento padre.</li>
-</ul>
-
-<p>En el ejemplo siguiente, establecemos una flotación a la izquierda para un elemento <code>&lt;div&gt;</code> y le damos un {{cssxref ("margin")}} a la derecha para mantener el texto alejado del elemento. Esto nos da el efecto del texto envuelto alrededor de ese cuadro, y es la mayor parte de lo que necesitas saber sobre la flotación, tal como se utiliza en el diseño web moderno.</p>
-
-<div id="Float_1">
-<div class="hidden">
-<h6 id="Ejemplo_de_flotación">Ejemplo de flotación</h6>
-
-<pre class="brush: css notranslate">body {
-    width: 90%;
-    max-width: 900px;
-    margin: 0 auto;
-}
-
-p {
-    line-height: 2;
-    word-spacing: 0.1rem;
-}
-
-.box {
-    background-color: rgb(207,232,220);
-    border: 2px solid rgb(79,185,227);
-    padding: 10px;
-    border-radius: 5px;
-}
-</pre>
-</div>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Ejemplo sencillo de flotación&lt;/h1&gt;
-
-&lt;div class="box"&gt;Float&lt;/div&gt;
-
-&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
-
-</pre>
-
-<pre class="brush: css notranslate">
-.box {
-    float: left;
-    width: 150px;
-    height: 150px;
-    margin-right: 30px;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Float_1', '100%', 600) }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El método de flotación se explica al completo en nuestro artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Floats">las propiedades float y clear</a>. El método de flotación es el que se usaba para crear diseños de columnas antes de la aparición de técnicas como los métodos Flexbox y diseño en rejillas. En la red aún puedes toparte con estos métodos. Vamos a exponer todo esto en el artículo sobre <a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">métodos de diseño heredados</a>.</p>
-</div>
-
-<h2 id="Técnicas_de_posicionamiento">Técnicas de posicionamiento</h2>
-
-<p>El posicionamiento permite mover un elemento desde donde se colocaría cuando está en flujo normal a otra ubicación. El posicionamiento no es un método para crear diseños de página principal, se trata más bien de administrar y ajustar la posición de elementos específicos en la página.</p>
-
-<p>Sin embargo, hay técnicas útiles para ciertos patrones de diseños de páginas web que se basan en la propiedad {{cssxref ("position")}}. Comprender el posicionamiento también ayuda a comprender el flujo normal y qué implica sacar un elemento del flujo normal.</p>
-
-<p>Hay cinco tipos de posicionamiento que debes conocer:</p>
-
-<ul>
- <li>El <strong>posicionamiento estático</strong> es el valor por defecto que tiene establecido cada elemento, esto significa sencillamente «coloca el elemento en su posición normal en el flujo de diseño del documento, nada especial que ver aquí».</li>
- <li>El <strong>posicionamiento relativo</strong> permite modificar la posición de un elemento en la página y moverlo con respecto a su posición en el flujo normal, lo que incluye superposiciones con otros elementos de la página.</li>
- <li>El <strong>posicionamiento absoluto</strong> mueve un elemento completamente fuera del flujo de diseño normal de la página, como si estuviera asentado en una capa separada propia. A partir de aquí, puedes fijarlo en una posición relativa a los bordes del elemento <code>&lt;html&gt;</code> de la página (o su elemento padre más próximo). Esto es útil para crear efectos complejos de diseño de página, como cuadros con pestañas en que diferentes paneles de contenido se ubican uno encima del otro y se muestran y ocultan según se desee, o paneles de información que por defecto se asientan fuera de la pantalla, pero puedes hacer que se deslicen hacia la pantalla usando un control de tipo botón.</li>
- <li>El <strong>posicionamiento fijo</strong> es muy similar al posicionamiento absoluto, excepto que corrige un elemento relativo a la ventana gráfica del navegador, no otro elemento. Esto es útil para crear efectos, como un menú de navegación persistente que siempre permanece en el mismo lugar en la pantalla al contrario que el contenido, que se desplaza.</li>
- <li>El <strong>posicionamiento <em>sticky</em> (pegajoso)</strong> es un método de posicionamiento más reciente que hace que un elemento actúe como <code>position: static</code> hasta que alcanza un desplazamiento definido con respecto a la ventana gráfica, en cuyo punto actúa como un elemento con la propiedad <code>position: fixed</code>.</li>
-</ul>
-
-<h3 id="Ejemplo_sencillo_de_posicionamiento">Ejemplo sencillo de posicionamiento</h3>
-
-<p>Para familiarizarte con estas técnicas de diseño de página, te mostraremos un par de ejemplos rápidos. Todos nuestros ejemplos contarán con el mismo HTML, que es el siguiente:</p>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento&lt;/h1&gt;
-
-&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
-&lt;p class="positioned"&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
-&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;</pre>
-
-<p>Aplicaremos a este HTML un estilo predeterminado definido por el CSS siguiente:</p>
-
-<pre class="brush: css notranslate">body {
-  width: 500px;
-  margin: 0 auto;
-}
-
-p {
-    background-color: rgb(207,232,220);
-    border: 2px solid rgb(79,185,227);
-    padding: 10px;
-    margin: 10px;
-    border-radius: 5px;
-}
-</pre>
-
-<p>La salida que se obtiene es la siguiente:</p>
-
-<p>{{ EmbedLiveSample('Simple_positioning_example', '100%', 300) }}</p>
-
-<h3 id="El_posicionamiento_relativo">El posicionamiento relativo</h3>
-
-<p>El posicionamiento relativo permite compensar un elemento desde la posición por defecto que tendría en flujo normal. Esto significa que podrías hacer una tarea como mover un icono un poco hacia abajo para que se alinee con una etiqueta de texto. Para ello, podríamos añadir la regla de posicionamiento relativo siguiente:</p>
-
-<pre class="brush: css notranslate">.positioned {
-  position: relative;
-  top: 30px;
-  left: 30px;
-}</pre>
-
-<p>Aquí asignamos el valor <code>relative</code> a la propiedad {{cssxref ("position")}} de nuestro párrafo del medio: esto no hace nada por sí solo, así que también añadimos las propiedades {{cssxref ("top")}} y {{cssxref ( "left")}}, que sirven para mover el elemento afectado hacia abajo y a la derecha. Esto puede parecer lo contrario de lo que esperabas, pero debes pensar en ello como un elemento al que se empuja por sus lados superior e izquierdo, lo que resulta en un movimiento a la derecha y abajo.</p>
-
-<p>Añadir este código dará el resultado siguiente:</p>
-
-<div id="Relative_1">
-<div class="hidden">
-<h6 id="Ejemplo_de_posicionamiento_relativo">Ejemplo de posicionamiento relativo</h6>
-
-<pre class="brush: html notranslate">&lt;h1&gt;El posicionamiento relativo&lt;/h1&gt;
-
-&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
-&lt;p class="positioned"&gt;Este es mi elemento con posicionamiento relativo. &lt;/p&gt;
-&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;</pre>
-
-<pre class="brush: css notranslate">body {
-  width: 500px;
-  margin: 0 auto;
-}
-
-p {
-    background-color: rgb(207,232,220);
-    border: 2px solid rgb(79,185,227);
-    padding: 10px;
-    margin: 10px;
-    border-radius: 5px;
-}
-</pre>
-</div>
-
-<pre class="brush: css notranslate">.positioned {
-  position: relative;
-  background: rgba(255,84,104,.3);
-  border: 2px solid rgb(255,84,104);
-  top: 30px;
-  left: 30px;
-}</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Relative_1', '100%', 300) }}</p>
-
-<h3 id="El_posicionamiento_absoluto">El posicionamiento absoluto</h3>
-
-<p>El posicionamiento absoluto se utiliza para eliminar por completo un elemento del flujo normal y colocarlo mediante desplazamientos desde los bordes de un bloque contenedor.</p>
-
-<p>Volviendo a nuestro ejemplo original no posicionado, podríamos añadir la regla CSS siguiente para implementar el posicionamiento absoluto:</p>
-
-<pre class="brush: css notranslate">.positioned {
-  position: absolute;
-  top: 30px;
-  left: 30px;
-}</pre>
-
-<p>Aquí le damos a la propiedad {{cssxref ("position")}} de nuestro párrafo del medio un valor de <code>absolute</code>, y le asignamos las mismas propiedades {{cssxref ("top")}} y {{cssxref ("left")}}. Sin embargo, ahora añadir este código da el resultado siguiente:</p>
-
-<div id="Absolute_1">
-<div class="hidden">
-<h6 id="Ejemplo_de_posicionamiento_absoluto">Ejemplo de posicionamiento absoluto</h6>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento absoluto&lt;/h1&gt;
-
-&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
-&lt;p class="positioned"&gt;Este es mi elemento con posicionamiento absoluto. &lt;/p&gt;
-&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;</pre>
-
-<pre class="brush: css notranslate">body {
-  width: 500px;
-  margin: 0 auto;
-}
-
-p {
-    background-color: rgb(207,232,220);
-    border: 2px solid rgb(79,185,227);
-    padding: 10px;
-    margin: 10px;
-    border-radius: 5px;
-}
-</pre>
-</div>
-
-<pre class="brush: css notranslate">.positioned {
-    position: absolute;
-    background: rgba(255,84,104,.3);
-    border: 2px solid rgb(255,84,104);
-    top: 30px;
-    left: 30px;
-}</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Absolute_1', '100%', 300) }}</p>
-
-<p>¡Este resultado es muy diferente! El elemento posicionado ahora se ha separado por completo del resto del diseño de la página y se superpone encima de este. Los otros dos párrafos ahora se asientan juntos, como si su hermano con posicionamiento absoluto no existiera. Las propiedades {{cssxref ("top")}} y {{cssxref ("left")}} tienen un efecto diferente en elementos con posicionamiento absoluto que en elementos con posicionamiento relativo. En este caso, los desplazamientos se han calculado desde la parte superior e izquierda de la página. Es posible cambiar el elemento padre para que se convierta en este tipo de contenedor, y lo veremos en el artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Positioning">posicionamiento</a>.</p>
-
-<h3 id="Posicionamiento_fijo">Posicionamiento fijo</h3>
-
-<p>El posicionamiento fijo elimina nuestro elemento del flujo de documentos de la misma manera que el posicionamiento absoluto. Sin embargo, en lugar de contar los desplazamientos en relación con el contenedor, se cuentan con respecto a la ventana gráfica. Como el elemento permanece fijo en relación con la ventana gráfica, podemos crear efectos como un menú que permanece fijo mientras la página se desplaza por debajo de él.</p>
-
-<p>En este ejemplo nuestro HTML tiene tres párrafos de texto para poder tener una página que se desplace, y un cuadro al que asignamos la propiedad <code>position: fixed</code>.</p>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento fijo&lt;/h1&gt;
-
-&lt;div class="positioned"&gt;Fijo&lt;/div&gt;
-
-&lt;p&gt;Párrafo 1.&lt;/p&gt;
-&lt;p&gt;Párrafo 2.&lt;/p&gt;
-&lt;p&gt;Párrafo 3.&lt;/p&gt;
-</pre>
-
-<div id="Fixed_1">
-<div class="hidden">
-<h6 id="Ejemplo_de_posicionamiento_fijo">Ejemplo de posicionamiento fijo</h6>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento fijo&lt;/h1&gt;
-
-&lt;div class="positioned"&gt;Fijo&lt;/div&gt;
-
-&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
-
-&lt;p&gt;Nam vulputate diam nec tempor bibendum. Donec luctus augue eget malesuada ultrices. Phasellus turpis est, posuere sit amet dapibus ut, facilisis sed est. Nam id risus quis ante semper consectetur eget aliquam lorem. Vivamus tristique elit dolor, sed pretium metus suscipit vel. Mauris ultricies lectus sed lobortis finibus. Vivamus eu urna eget velit cursus viverra quis vestibulum sem. Aliquam tincidunt eget purus in interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.&lt;/p&gt;
-
-&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;</pre>
-
-<pre class="brush: css notranslate">body {
-    width: 500px;
-    margin: 0 auto;
-}
-
-.positioned {
-    background: rgba(255,84,104,.3);
-    border: 2px solid rgb(255,84,104);
-    padding: 10px;
-    margin: 10px;
-    border-radius: 5px;
-}</pre>
-</div>
-
-<pre class="brush: css notranslate">.positioned {
-    position: fixed;
-    top: 30px;
-    left: 30px;
-}</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Fixed_1', '100%', 200) }}</p>
-
-<h3 id="Posicionamiento_pegajoso">Posicionamiento pegajoso</h3>
-
-<p>El posicionamiento pegajoso es el último método de posicionamiento que tenemos a nuestra disposición. Mezcla el posicionamiento estático predeterminado con el posicionamiento fijo. Cuando un elemento tiene la propiedad <code>position: sticky</code>, se desplaza en flujo normal hasta que se alcanzan los desplazamientos con respecto a la ventana gráfica que hemos definido. En ese punto se queda «atascado» como si tuviera configurado un valor <code>position: fixed</code>.</p>
-
-<div id="Sticky_1">
-<div class="hidden">
-<h6 id="Ejemplo_de_posicionamiento_pegajoso">Ejemplo de posicionamiento pegajoso</h6>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento pegajoso&lt;/h1&gt;
-
-&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
-
-&lt;div class="positioned"&gt;Pegajoso&lt;/div&gt;
-
-&lt;p&gt;Nam vulputate diam nec tempor bibendum. Donec luctus augue eget malesuada ultrices. Phasellus turpis est, posuere sit amet dapibus ut, facilisis sed est. Nam id risus quis ante semper consectetur eget aliquam lorem. Vivamus tristique elit dolor, sed pretium metus suscipit vel. Mauris ultricies lectus sed lobortis finibus. Vivamus eu urna eget velit cursus viverra quis vestibulum sem. Aliquam tincidunt eget purus in interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.&lt;/p&gt;
-
-&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;       </pre>
-
-<pre class="brush: css notranslate">body {
-  width: 500px;
-  margin: 0 auto;
-}
-
-.positioned {
-  background: rgba(255,84,104,.3);
-  border: 2px solid rgb(255,84,104);
-  padding: 10px;
-  margin: 10px;
-  border-radius: 5px;
-}</pre>
-</div>
-
-<pre class="brush: css notranslate">.positioned {
-  position: sticky;
-  top: 30px;
-  left: 30px;
-}</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Sticky_1', '100%', 200) }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: para obtener más información sobre el posicionamiento, consulta nuestro artículo <a href="/es/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a>.</p>
-</div>
-
-<h2 id="Diseño_de_tablas">Diseño de tablas</h2>
-
-<p>Las tablas HTML sirven para mostrar datos tabulados, pero hace muchos años, antes incluso de que el CSS básico fuera compatible de forma fiable en todos los navegadores, los desarrolladores web también usaban tablas para hacer el diseño completo de una página web, colocando en las diversas filas y columnas de una tabla los títulos de encabezado de la página, los pies de página, las diferentes columnas, etc. Esto funcionó en ese momento, pero presenta muchos problemas: los diseños de tabla no son flexibles, requieren mucho código de marcado, son difíciles de depurar y no son semánticamente correctos (por ejemplo, los usuarios de lectores de pantalla tienen problemas para navegar por estos diseños de página web con tablas).</p>
-
-<p>El aspecto que presenta una tabla en una página web cuando usas el código de marcado de una tabla se debe a un conjunto de propiedades CSS que definen el diseño de la tabla. Estas propiedades se pueden usar para diseñar elementos que no son tablas, un uso que a veces se describe como «usar tablas CSS».</p>
-
-<p>El ejemplo siguiente muestra uno de esos usos; el uso de tablas CSS para el diseño debe considerarse en este punto un método heredado, para aquellas situaciones en las que tienes navegadores muy antiguos que no son compatibles con los métodos Flexbox o Grid.</p>
-
-<p>Veamos un ejemplo. Primero, un código de marcado sencillo que crea un formulario HTML. Cada elemento de entrada tiene una etiqueta, y también hemos incluido un título dentro de un párrafo. Cada par etiqueta/entrada está delimitado por un elemento {{htmlelement ("div")}}, con fines de compaginación.</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;p&gt;En primer lugar, díganos su nombre y edad.&lt;/p&gt;
-  &lt;div&gt;
-    &lt;label for="fname"&gt;Nombre:&lt;/label&gt;
-    &lt;input type="text" id="fname"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="lname"&gt;Apellidos:&lt;/label&gt;
-    &lt;input type="text" id="lname"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="age"&gt;Edad:&lt;/label&gt;
-    &lt;input type="text" id="age"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Ahora, el CSS para nuestro ejemplo. La mayor parte del CSS es bastante común, excepto por los usos de la propiedad {{cssxref ("display")}}. A los elementos {{htmlelement ("form")}}, {{htmlelement ("div")}}, {{htmlelement ("label")}} y {{htmlelement ("input")}} se les dice que se muestren como una tabla, filas de tabla y celdas de tabla, respectivamente; actuarán básicamente como marcas de tabla HTML, y lograrán por defecto la alineación perfecta de las etiquetas y las entradas. Todo lo que hay que hacer es añadir un poco de tamaños, márgenes, etc., para que todo se vea un poco mejor, ¡y listo!</p>
-
-<p>Observa que se la ha proporcionado al párrafo de encabezado <code>display: table-caption;,</code> lo que hace que actúe como una celda de encabezado ({{htmlelement ("caption")}}) de la tabla; y con <code>caption-side: bottom;</code> se le dice a la celda de encabezado que se asiente en la parte inferior de la tabla con fines de aplicación de estilo, aunque en el código fuente el marcado está antes que los elementos <code>&lt;input&gt;</code>. Esto permite un poco de flexibilidad.</p>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-form {
-  display: table;
-  margin: 0 auto;
-}
-
-form div {
-  display: table-row;
-}
-
-form label, form input {
-  display: table-cell;
-  margin-bottom: 10px;
-}
-
-form label {
-  width: 200px;
-  padding-right: 5%;
-  text-align: right;
-}
-
-form input {
-  width: 300px;
-}
-
-form p {
-  display: table-caption;
-  caption-side: bottom;
-  width: 300px;
-  color: #999;
-  font-style: italic;
-}</pre>
-
-<p>Esto nos da el resultado siguiente:</p>
-
-<p>{{ EmbedLiveSample('Table_layout', '100%', '170') }}</p>
-
-<p>También puedes ver este ejemplo en vivo en <a href="https://mdn.github.io/learning-area/css/styling-boxes/box-model-recap/css-tables-example.html">css-tables-example.html</a> (ver el <a href="https://github.com/mdn/learning-area/blob/master/css/styling-boxes/box-model-recap/css-tables-example.html">código fuente</a>).</p>
-
-<h2 id="Diseño_en_columnas">Diseño en columnas</h2>
-
-<p>El módulo de diseño en columnas nos proporciona un modo de distribuir el contenido en columnas, de forma similar al modo como el texto fluye en un periódico. Aunque en un contexto web leer en columnas de arriba a abajo no resulta tan útil porque podría obligar a los usuarios a tener que hacer desplazamientos de arriba a abajo, la técnica de organizar el contenido en columnas también puede tener su utilidad.</p>
-
-<p>Para convertir un bloque en un contenedor, utilizamos la propiedad {{cssxref ("column-count")}}, que le dice al navegador cuántas columnas nos gustaría tener, o {{cssxref ("column-width")}}, que le dice al navegador que llene el contenedor con tantas columnas de al menos ese ancho.</p>
-
-<p>En el ejemplo siguiente comenzamos con un bloque de HTML dentro de un elemento <code>&lt;div&gt;</code> que contiene una clase <code>container</code>.</p>
-
-<pre class="brush: html notranslate">&lt;div class="container"&gt;
-    &lt;H1&gt;Diseño en columnas&lt;/ h1&gt;
-
-    &lt;p&gt;Párrafo 1.&lt;/p&gt;
-    &lt;p&gt;Párrafo 2.&lt;/p&gt;
-
-&lt;/div&gt;
-</pre>
-
-<p>Utilizamos un <code>column-width</code> de 200 píxeles en ese contenedor, que crea en el navegador tantas columnas de 200 píxeles como quepan en el contenedor y luego comparte el espacio restante entre las columnas creadas.</p>
-
-<div id="Multicol_1">
-<div class="hidden">
-<h6 id="Ejemplo_de_diseño_en_columnas">Ejemplo de diseño en columnas</h6>
-
-<pre class="brush: html notranslate">&lt;div class="container"&gt;
-        &lt;h1&gt; Diseño en columnas &lt;/h1&gt;
-
-        &lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
-
-
-        &lt;p&gt;Nam vulputate diam nec tempor bibendum. Donec luctus augue eget malesuada ultrices. Phasellus turpis est, posuere sit amet dapibus ut, facilisis sed est. Nam id risus quis ante semper consectetur eget aliquam lorem. Vivamus tristique elit dolor, sed pretium metus suscipit vel. Mauris ultricies lectus sed lobortis finibus. Vivamus eu urna eget velit cursus viverra quis vestibulum sem. Aliquam tincidunt eget purus in interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.&lt;/p&gt;
-
-    &lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">body { max-width: 800px; margin: 0 auto; } </pre>
-</div>
-
-<pre class="brush: css notranslate">    .container {
-        column-width: 200px;
-    }</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Multicol_1', '100%', 200) }}</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Este artículo ha proporcionado un breve resumen de todas las tecnologías de diseño que debes conocer. ¡Sigue leyendo para obtener más información sobre cada tecnología individual!</p>
-
-<p>{{NextMenu("Learn/CSS/CSS_layout/Normal_Flow", "Learn/CSS/CSS_layout")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">Flujo normal</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Flotación</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño adaptativo</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a medios</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredados</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad en navegadores antiguos </a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de elementos básicos de compaginación</a></li>
-</ul>
diff --git a/files/es/learn/css/css_layout/introduction/index.html b/files/es/learn/css/css_layout/introduction/index.html
new file mode 100644
index 0000000000..769cd9da0f
--- /dev/null
+++ b/files/es/learn/css/css_layout/introduction/index.html
@@ -0,0 +1,702 @@
+---
+title: Introducción al diseño en CSS
+slug: Learn/CSS/CSS_layout/Introduction
+translation_of: Learn/CSS/CSS_layout/Introduction
+original_slug: Learn/CSS/CSS_layout/Introducción
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/CSS/CSS_layout/Normal_Flow", "Learn/CSS/CSS_layout")}}</div>
+
+<p class="summary">Este artículo resumirá algunas de las características de diseño de páginas web con CSS que ya hemos mencionado en módulos anteriores, como los diferentes valores de {{cssxref ("display")}}, e introducirá algunos de los conceptos que vamos a tratar en este módulo.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Proporcionar una visión general de las técnicas de diseño de páginas web con CSS. Cada técnica se puede aprender con mayor detalle en tutoriales posteriores.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Las técnicas de diseño de páginas web con CSS nos permiten controlar dónde se ubican los elementos que están contenidos en una página web en relación con su posición predeterminada en el flujo de diseño normal, así como el resto de elementos a su alrededor, su contenedor principal o la vista/ventana principal. Las técnicas de diseño de páginas web que trataremos con más detalle en este módulo son:</p>
+
+<ul>
+ <li>Flujo normal</li>
+ <li>La propiedad {{cssxref ("display")}}</li>
+ <li>Flexbox</li>
+ <li>Grid</li>
+ <li>Floats</li>
+ <li>Posicionamiento</li>
+ <li>Diseño de tablas</li>
+ <li>Diseño a varias columnas</li>
+</ul>
+
+<p>Cada técnica tiene sus usos, ventajas y desventajas, y ninguna técnica está diseñada para usarse de forma aislada. Si entiendes para qué se ha diseñado cada método, te será fácil comprender cuál es la mejor herramienta de diseño para cada tarea.</p>
+
+<h2 id="Flujo_normal">Flujo normal</h2>
+
+<p>El flujo normal es el modo como el navegador presenta las páginas HTML de forma predeterminada cuando no haces nada para controlar el diseño de página. Echemos un vistazo rápido a un ejemplo HTML:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Amo a mi gato.&lt;/p&gt;
+
+&lt;ul&gt;
+  &lt;li&gt;Comprar comida para gatos&lt;/li&gt;
+  &lt;li&gt;Ejercicio&lt;/li&gt;
+  &lt;li&gt;Anímate amigo&lt;/li&gt;
+&lt;/ul&gt;
+
+&lt;p&gt;¡Fin!&lt;/p&gt;</pre>
+
+<p>Por defecto, el navegador mostrará este código de la manera siguiente:</p>
+
+<p>{{ EmbedLiveSample('Normal_flow', '100%', 200) }}</p>
+
+<p>Observa aquí cómo se muestra el HTML en el orden exacto en que aparece en el código fuente, con los elementos uno debajo del otro: el primer párrafo, seguido de la lista desordenada, y a continuación el segundo párrafo.</p>
+
+<p>Los elementos que aparecen uno debajo del otro se describen como <em>elementos de bloque</em>, en contraposición con los <em>elementos de línea</em>, que aparecen uno al lado del otro, como las palabras de un párrafo.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: La dirección en la que se presentan los contenidos de un elemento de bloque se describe como dirección de los bloques. La dirección de los bloques va de arriba a abajo en un idioma como el español, cuyo modo de escritura es horizontal. Sería horizontal en cualquier idioma con un modo de escritura vertical, como el japonés. Correspondientemente, la dirección de línea es la dirección en la que los contenidos de línea (por ejemplo, una frase) se disponen.</p>
+</div>
+
+<p>Cuando usas CSS para crear un diseño de página web, alejas los elementos del flujo normal, pero para muchos de los elementos de tu página, el flujo normal proporciona exactamente el diseño que necesitas. Por esta razón resulta tan importante comenzar con un documento HTML bien estructurado, porque te permite trabajar ya con la forma en que las cosas se presentan por defecto, en lugar de tener que luchar contra ello.</p>
+
+<p>Los métodos que permiten cambiar la disposición de los elementos en CSS son los siguientes:</p>
+
+<ul>
+ <li><strong>La propiedad {{cssxref ("display")}}</strong>: los valores estándar como <code>block</code>, <code>inline</code> o <code>inline-block</code> pueden cambiar el comportamiento de los elementos en el flujo normal (consulta <a href="/es/docs/Learn/CSS/Building_blocks/El_modelo_de_caja">Tipos de cajas en CSS</a> para obtener más información). Luego hay métodos de diseño completos que se activan con un valor <code>display</code>, por ejemplo <a href="/es/docs/Learn/CSS/CSS_layout/Grids">CSS Grid</a> y <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a>.</li>
+ <li><strong>Floats</strong>: la aplicación de un valor {{cssxref ("float")}} como <code>left</code> puede hacer que los elementos de nivel de bloque rodeen el elemento por uno de sus lados, como la forma en que las imágenes a veces tienen texto flotando a su alrededor en los diseños de algunas revistas.</li>
+ <li><strong>La propiedad {{cssxref ("position")}}</strong>: permite controlar con precisión la ubicación de las cajas dentro de otras cajas. El posicionamiento estático es el valor predeterminado en el flujo normal, pero puede hacer que los elementos se distribuyan de manera diferente si se utilizan otros valores, por ejemplo, pueden estar siempre fijados a la parte superior izquierda de la ventana del navegador.</li>
+ <li><strong>Diseño de tablas</strong>: se pueden usar las características que sirven para diseñar las partes de una tabla HTML en elementos que no son de tabla con <code>display: table</code> y las propiedades asociadas.</li>
+ <li><strong>Diseño en varias columnas</strong>: las propiedades de <a href="/es/docs/Web/CSS/Columnas_CSS">diseño en varias columnas</a> permiten distribuir el contenido de un bloque en columnas, como en el caso de un periódico.</li>
+</ul>
+
+<h2 id="La_propiedad_display">La propiedad display</h2>
+
+<p>Los métodos principales para lograr el diseño de páginas web con CSS son todos los valores de la propiedad <code>display</code>. Esta propiedad permite cambiar la forma predeterminada en que algo se muestra. Todo en flujo normal tiene un valor de <code>display</code>, utilizado como la forma como se comportan por defecto los elementos en los que están configurados. Por ejemplo, el hecho de que los párrafos en español se muestran uno debajo del otro se debe a que presentan la configuración <code>display: block</code>. Si creas un enlace alrededor de un texto dentro de un párrafo, ese enlace permanece en línea con el resto del texto y no se divide al pasar a una línea nueva. Esto se debe a que el elemento {{htmlelement ("a")}} es por defecto <code>display: inline</code>.</p>
+
+<p>Puedes cambiar este comportamiento predeterminado de visualización (<code>display</code>). Por ejemplo, el elemento {{htmlelement ("li")}} es <code>display: block</code> de forma predeterminada, lo que significa que los elementos de la lista se muestran uno debajo del otro en nuestro documento en español. Si cambiamos el valor de visualización a <code>inline</code>, ahora se muestran uno al lado del otro, como lo harían las palabras de una frase. El hecho de que puedas cambiar el valor de <code>display</code> de cualquier elemento significa que puedes elegir elementos HTML por su significado semántico, sin preocuparte por cómo se verán. La forma en que se ven es algo que puedes cambiar.</p>
+
+<p>Además de poder cambiar la presentación predeterminada de un elemento <code>block</code> a un elemento <code>inline</code> y viceversa, hay algunos métodos de diseño de página más poderosos que se inician como un valor de <code>display</code>. Sin embargo, cuando los uses, en general vas a necesitar propiedades adicionales. Los dos valores más importantes para nuestros propósitos cuando hablamos del diseño de páginas web son <code>display: flex</code> y <code>display: grid</code>.</p>
+
+<h2 id="Flexbox">Flexbox</h2>
+
+<p>Flexbox es el nombre corto del <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout">módulo de diseño de cajas flexibles</a>, pensado para facilitarnos la distribución de las cosas en una dimensión, ya sea como una fila o como una columna. Para usar el método Flexbox, aplica <code>display: flex</code> al elemento padre de los elementos que deseas distribuir; todos sus elementos hijo directos se convierten en elementos flexibles. Vamos a verlo en un ejemplo sencillo.</p>
+
+<p>El marcado HTML siguiente nos proporciona un elemento contenedor con una clase <code>wrapper</code> dentro del cual hay tres elementos {{htmlelement ("div")}}. Por defecto, estos elementos se mostrarían como elementos de bloque, uno debajo del otro, en nuestro documento en español.</p>
+
+<p>Sin embargo, si añadimos <code>display: flex</code> al elemento padre, los tres elementos se organizan en columnas. Esto se debe a que se convierten en <em>elementos flexibles</em> y se ven afectados por algunos valores iniciales que el método Flexbox establece en el contenedor flexible. Se muestran en una fila porque el valor inicial de {{cssxref ("flex-direction")}} establecido en su elemento padre es <code>row</code>. Todos parecen expandirse hasta la altura del elemento de más altura, porque el valor inicial de la propiedad {{cssxref ("align-items")}} establecida en su elemento primario es <code>stretch</code>. Esto significa que los artículos se expanden hasta la altura del contenedor flexible, que en este caso está definida por el artículo de mayor altura. Todos los artículos se alinean al comienzo del contenedor y dejan el espacio que sobra al final de la fila.</p>
+
+<div id="Flex_1">
+<div class="hidden">
+<h6 id="Ejemplo_Flexbox_1">Ejemplo Flexbox 1</h6>
+
+<pre class="brush: css notranslate">* {box-sizing: border-box;}
+
+.wrapper &gt; div {
+    border-radius: 5px;
+    background-color: rgb(207,232,220);
+    padding: 1em;
+}
+    </pre>
+</div>
+
+<pre class="brush: css notranslate">.wrapper {
+  display: flex;
+}
+</pre>
+
+<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
+  &lt;div class="box1"&gt;Uno&lt;/div&gt;
+  &lt;div class="box2"&gt;Dos&lt;/div&gt;
+  &lt;div class="box3"&gt;Tres&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Flex_1', '300', '200') }}</p>
+
+<p>Además de las propiedades anteriores, que pueden aplicarse a contenedores flexibles, también hay propiedades que pueden aplicarse a los elementos flexibles. Estas propiedades, entre otras cosas, pueden cambiar el comportamiento de estos elementos flexibles y permitirles expandirse y contraerse para adaptarse al espacio disponible.</p>
+
+<p>Como un ejemplo sencillo de esto podemos añadir la propiedad {{cssxref ("flex")}} a todos nuestros elementos secundarios, con un valor de <code>1</code>. Esto hará que todos los elementos crezcan y llenen el contenedor, en lugar de dejar espacio al final. Si hay más espacio, los artículos se ensancharán; si hay menos espacio, se volverán más estrechos. Además, si añades al código otro elemento, todos los elementos se volverán más pequeños para dejarle espacio; ajustarán el tamaño para ocupar la misma cantidad de espacio, cualquiera que sea.</p>
+
+<div id="Flex_2">
+<div class="hidden">
+<h6 id="Ejemplo_Flexbox_2">Ejemplo Flexbox 2</h6>
+
+<pre class="brush: css notranslate">* {box-sizing: border-box;}
+
+    .wrapper &gt; div {
+        border-radius: 5px;
+        background-color: rgb(207,232,220);
+        padding: 1em;
+    }</pre>
+</div>
+
+<pre class="brush: css notranslate">.wrapper {
+    display: flex;
+}
+
+.wrapper &gt; div {
+    flex: 1;
+}
+</pre>
+
+<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
+    &lt;div class="box1"&gt;Uno&lt;/div&gt;
+    &lt;div class="box2"&gt;Dos&lt;/div&gt;
+    &lt;div class="box3"&gt;Tres&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Flex_2', '300', '200') }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Esta ha sido una breve introducción de lo que permite el método Flexbox. Para obtener más información, consulta nuestro artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a>.</p>
+</div>
+
+<h2 id="Diseño_de_cuadrícula">Diseño de cuadrícula</h2>
+
+<p>Mientras que el método Flexbox está pensado para distribuir elementos unidimensionalmente, el diseño de cuadrícula está diseñado para distribuir elementos en dos dimensiones: alinear elementos en filas y columnas.</p>
+
+<p>Una vez más, puedes activar el diseño de páginas web en cuadrícula con un valor de visualización específico: <code>display: grid</code>. El ejemplo siguiente utiliza un marcado similar al del ejemplo del método Flexbox, con un contenedor y algunos elementos secundarios. Además de usar <code>display: grid</code>, también definimos algunos tramos de filas y columnas en el elemento padre con las propiedades {{cssxref("grid-template-rows")}} y {{cssxref("grid-template-columns")}}. Hemos definido tres columnas, cada una de <code>1fr</code>, y dos filas de <code>100px</code>. No necesitamos poner ninguna regla sobre los elementos secundarios porque se colocan automáticamente en las celdas que nuestra cuadrícula ha creado.</p>
+
+<div id="Grid_1">
+<div class="hidden">
+<h6 id="Ejemplo_de_cuadrícula_1">Ejemplo de cuadrícula 1</h6>
+
+<pre class="brush: css notranslate">* {box-sizing: border-box;}
+
+    .wrapper &gt; div {
+        border-radius: 5px;
+        background-color: rgb(207,232,220);
+        padding: 1em;
+    }</pre>
+</div>
+
+<pre class="brush: css notranslate">.wrapper {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+    grid-template-rows: 100px 100px;
+    grid-gap: 10px;
+}
+</pre>
+
+<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
+    &lt;div class="box1"&gt;Uno&lt;/div&gt;
+    &lt;div class="box2"&gt;Dos&lt;/div&gt;
+    &lt;div class="box3"&gt;Tres&lt;/div&gt;
+    &lt;div class="box4"&gt;Cuatro&lt;/div&gt;
+    &lt;div class="box5"&gt;Cinco&lt;/div&gt;
+    &lt;div class="box6"&gt;Seis&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Grid_1', '300', '330') }}</p>
+
+<p>Cuando ya tienes una cuadrícula, se puede colocar tus elementos en ella explícitamente en lugar de confiar en el comportamiento de colocación automática que hemos visto arriba. En el segundo ejemplo, hemos definido la misma cuadrícula, pero esta vez con tres elementos secundarios. Hemos establecido la línea de inicio y final de cada elemento con las propiedades {{cssxref ("grid-column")}} y {{cssxref ("grid-row")}}. Esto hace que los elementos abarquen varios tramos.</p>
+
+<div id="Grid_2">
+<div class="hidden">
+<h6 id="Ejemplo_de_cuadrícula_2">Ejemplo de cuadrícula 2</h6>
+
+<pre class="brush: css notranslate">* {box-sizing: border-box;}
+
+    .wrapper &gt; div {
+        border-radius: 5px;
+        background-color: rgb(207,232,220);
+        padding: 1em;
+    }</pre>
+</div>
+
+<pre class="brush: css notranslate">.wrapper {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr;
+    grid-template-rows: 100px 100px;
+    grid-gap: 10px;
+}
+
+.box1 {
+    grid-column: 2 / 4;
+    grid-row: 1;
+}
+
+.box2 {
+    grid-column: 1;
+    grid-row: 1 / 3;
+}
+
+.box3 {
+    grid-row: 2;
+    grid-column: 3;
+}
+</pre>
+
+<pre class="brush: html notranslate">&lt;div class="wrapper"&gt;
+    &lt;div class="box1"&gt;Uno&lt;/div&gt;
+    &lt;div class="box2"&gt;Dos&lt;/div&gt;
+    &lt;div class="box3"&gt;Tres&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Grid_2', '300', '330') }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Estos dos ejemplos son solo una pequeña parte del poder del diseño de cuadrículas; para obtener más información, consulta nuestro artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Grids">Diseñar cuadrículas</a>.</p>
+</div>
+
+<p>El resto de esta guía expone otros métodos de diseño de páginas web que son menos importantes para las estructuras principales de diseño de tu página web, pero que pueden serte de ayuda para tareas específicas. Si entiendes la naturaleza de cada una de las tareas de diseño de una página web, vas a descubrir enseguida que a menudo vas a ser capaz de discernir qué tipo de diseño se adapta mejor a cada componente de tu diseño particular.</p>
+
+<h2 id="Floats">Floats</h2>
+
+<p>El método de flotación de un elemento cambia el comportamiento de ese elemento y de los elementos de nivel de bloque que lo siguen en el flujo normal. El elemento es desplazado hacia la izquierda o hacia la derecha y es eliminado del flujo normal, y el contenido circundante flota alrededor de este elemento.</p>
+
+<p>La propiedad {{cssxref ("float")}} tiene cuatro valores posibles:</p>
+
+<ul>
+ <li><code>left</code>: establece la flotación a la izquierda del elemento.</li>
+ <li><code>right</code>: establece la flotación a la derecha del elemento.</li>
+ <li><code>none</code>: especifica que no hay flotación en absoluto. Este es el valor predeterminado.</li>
+ <li><code>inherit</code>: especifica que el valor de la propiedad <code>float</code> debe heredarse del elemento padre.</li>
+</ul>
+
+<p>En el ejemplo siguiente, establecemos una flotación a la izquierda para un elemento <code>&lt;div&gt;</code> y le damos un {{cssxref ("margin")}} a la derecha para mantener el texto alejado del elemento. Esto nos da el efecto del texto envuelto alrededor de ese cuadro, y es la mayor parte de lo que necesitas saber sobre la flotación, tal como se utiliza en el diseño web moderno.</p>
+
+<div id="Float_1">
+<div class="hidden">
+<h6 id="Ejemplo_de_flotación">Ejemplo de flotación</h6>
+
+<pre class="brush: css notranslate">body {
+    width: 90%;
+    max-width: 900px;
+    margin: 0 auto;
+}
+
+p {
+    line-height: 2;
+    word-spacing: 0.1rem;
+}
+
+.box {
+    background-color: rgb(207,232,220);
+    border: 2px solid rgb(79,185,227);
+    padding: 10px;
+    border-radius: 5px;
+}
+</pre>
+</div>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Ejemplo sencillo de flotación&lt;/h1&gt;
+
+&lt;div class="box"&gt;Float&lt;/div&gt;
+
+&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
+
+</pre>
+
+<pre class="brush: css notranslate">
+.box {
+    float: left;
+    width: 150px;
+    height: 150px;
+    margin-right: 30px;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Float_1', '100%', 600) }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El método de flotación se explica al completo en nuestro artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Floats">las propiedades float y clear</a>. El método de flotación es el que se usaba para crear diseños de columnas antes de la aparición de técnicas como los métodos Flexbox y diseño en rejillas. En la red aún puedes toparte con estos métodos. Vamos a exponer todo esto en el artículo sobre <a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">métodos de diseño heredados</a>.</p>
+</div>
+
+<h2 id="Técnicas_de_posicionamiento">Técnicas de posicionamiento</h2>
+
+<p>El posicionamiento permite mover un elemento desde donde se colocaría cuando está en flujo normal a otra ubicación. El posicionamiento no es un método para crear diseños de página principal, se trata más bien de administrar y ajustar la posición de elementos específicos en la página.</p>
+
+<p>Sin embargo, hay técnicas útiles para ciertos patrones de diseños de páginas web que se basan en la propiedad {{cssxref ("position")}}. Comprender el posicionamiento también ayuda a comprender el flujo normal y qué implica sacar un elemento del flujo normal.</p>
+
+<p>Hay cinco tipos de posicionamiento que debes conocer:</p>
+
+<ul>
+ <li>El <strong>posicionamiento estático</strong> es el valor por defecto que tiene establecido cada elemento, esto significa sencillamente «coloca el elemento en su posición normal en el flujo de diseño del documento, nada especial que ver aquí».</li>
+ <li>El <strong>posicionamiento relativo</strong> permite modificar la posición de un elemento en la página y moverlo con respecto a su posición en el flujo normal, lo que incluye superposiciones con otros elementos de la página.</li>
+ <li>El <strong>posicionamiento absoluto</strong> mueve un elemento completamente fuera del flujo de diseño normal de la página, como si estuviera asentado en una capa separada propia. A partir de aquí, puedes fijarlo en una posición relativa a los bordes del elemento <code>&lt;html&gt;</code> de la página (o su elemento padre más próximo). Esto es útil para crear efectos complejos de diseño de página, como cuadros con pestañas en que diferentes paneles de contenido se ubican uno encima del otro y se muestran y ocultan según se desee, o paneles de información que por defecto se asientan fuera de la pantalla, pero puedes hacer que se deslicen hacia la pantalla usando un control de tipo botón.</li>
+ <li>El <strong>posicionamiento fijo</strong> es muy similar al posicionamiento absoluto, excepto que corrige un elemento relativo a la ventana gráfica del navegador, no otro elemento. Esto es útil para crear efectos, como un menú de navegación persistente que siempre permanece en el mismo lugar en la pantalla al contrario que el contenido, que se desplaza.</li>
+ <li>El <strong>posicionamiento <em>sticky</em> (pegajoso)</strong> es un método de posicionamiento más reciente que hace que un elemento actúe como <code>position: static</code> hasta que alcanza un desplazamiento definido con respecto a la ventana gráfica, en cuyo punto actúa como un elemento con la propiedad <code>position: fixed</code>.</li>
+</ul>
+
+<h3 id="Ejemplo_sencillo_de_posicionamiento">Ejemplo sencillo de posicionamiento</h3>
+
+<p>Para familiarizarte con estas técnicas de diseño de página, te mostraremos un par de ejemplos rápidos. Todos nuestros ejemplos contarán con el mismo HTML, que es el siguiente:</p>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento&lt;/h1&gt;
+
+&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
+&lt;p class="positioned"&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
+&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;</pre>
+
+<p>Aplicaremos a este HTML un estilo predeterminado definido por el CSS siguiente:</p>
+
+<pre class="brush: css notranslate">body {
+  width: 500px;
+  margin: 0 auto;
+}
+
+p {
+    background-color: rgb(207,232,220);
+    border: 2px solid rgb(79,185,227);
+    padding: 10px;
+    margin: 10px;
+    border-radius: 5px;
+}
+</pre>
+
+<p>La salida que se obtiene es la siguiente:</p>
+
+<p>{{ EmbedLiveSample('Simple_positioning_example', '100%', 300) }}</p>
+
+<h3 id="El_posicionamiento_relativo">El posicionamiento relativo</h3>
+
+<p>El posicionamiento relativo permite compensar un elemento desde la posición por defecto que tendría en flujo normal. Esto significa que podrías hacer una tarea como mover un icono un poco hacia abajo para que se alinee con una etiqueta de texto. Para ello, podríamos añadir la regla de posicionamiento relativo siguiente:</p>
+
+<pre class="brush: css notranslate">.positioned {
+  position: relative;
+  top: 30px;
+  left: 30px;
+}</pre>
+
+<p>Aquí asignamos el valor <code>relative</code> a la propiedad {{cssxref ("position")}} de nuestro párrafo del medio: esto no hace nada por sí solo, así que también añadimos las propiedades {{cssxref ("top")}} y {{cssxref ( "left")}}, que sirven para mover el elemento afectado hacia abajo y a la derecha. Esto puede parecer lo contrario de lo que esperabas, pero debes pensar en ello como un elemento al que se empuja por sus lados superior e izquierdo, lo que resulta en un movimiento a la derecha y abajo.</p>
+
+<p>Añadir este código dará el resultado siguiente:</p>
+
+<div id="Relative_1">
+<div class="hidden">
+<h6 id="Ejemplo_de_posicionamiento_relativo">Ejemplo de posicionamiento relativo</h6>
+
+<pre class="brush: html notranslate">&lt;h1&gt;El posicionamiento relativo&lt;/h1&gt;
+
+&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
+&lt;p class="positioned"&gt;Este es mi elemento con posicionamiento relativo. &lt;/p&gt;
+&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;</pre>
+
+<pre class="brush: css notranslate">body {
+  width: 500px;
+  margin: 0 auto;
+}
+
+p {
+    background-color: rgb(207,232,220);
+    border: 2px solid rgb(79,185,227);
+    padding: 10px;
+    margin: 10px;
+    border-radius: 5px;
+}
+</pre>
+</div>
+
+<pre class="brush: css notranslate">.positioned {
+  position: relative;
+  background: rgba(255,84,104,.3);
+  border: 2px solid rgb(255,84,104);
+  top: 30px;
+  left: 30px;
+}</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Relative_1', '100%', 300) }}</p>
+
+<h3 id="El_posicionamiento_absoluto">El posicionamiento absoluto</h3>
+
+<p>El posicionamiento absoluto se utiliza para eliminar por completo un elemento del flujo normal y colocarlo mediante desplazamientos desde los bordes de un bloque contenedor.</p>
+
+<p>Volviendo a nuestro ejemplo original no posicionado, podríamos añadir la regla CSS siguiente para implementar el posicionamiento absoluto:</p>
+
+<pre class="brush: css notranslate">.positioned {
+  position: absolute;
+  top: 30px;
+  left: 30px;
+}</pre>
+
+<p>Aquí le damos a la propiedad {{cssxref ("position")}} de nuestro párrafo del medio un valor de <code>absolute</code>, y le asignamos las mismas propiedades {{cssxref ("top")}} y {{cssxref ("left")}}. Sin embargo, ahora añadir este código da el resultado siguiente:</p>
+
+<div id="Absolute_1">
+<div class="hidden">
+<h6 id="Ejemplo_de_posicionamiento_absoluto">Ejemplo de posicionamiento absoluto</h6>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento absoluto&lt;/h1&gt;
+
+&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;
+&lt;p class="positioned"&gt;Este es mi elemento con posicionamiento absoluto. &lt;/p&gt;
+&lt;p&gt;Soy un elemento básico de nivel de bloque.&lt;/p&gt;</pre>
+
+<pre class="brush: css notranslate">body {
+  width: 500px;
+  margin: 0 auto;
+}
+
+p {
+    background-color: rgb(207,232,220);
+    border: 2px solid rgb(79,185,227);
+    padding: 10px;
+    margin: 10px;
+    border-radius: 5px;
+}
+</pre>
+</div>
+
+<pre class="brush: css notranslate">.positioned {
+    position: absolute;
+    background: rgba(255,84,104,.3);
+    border: 2px solid rgb(255,84,104);
+    top: 30px;
+    left: 30px;
+}</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Absolute_1', '100%', 300) }}</p>
+
+<p>¡Este resultado es muy diferente! El elemento posicionado ahora se ha separado por completo del resto del diseño de la página y se superpone encima de este. Los otros dos párrafos ahora se asientan juntos, como si su hermano con posicionamiento absoluto no existiera. Las propiedades {{cssxref ("top")}} y {{cssxref ("left")}} tienen un efecto diferente en elementos con posicionamiento absoluto que en elementos con posicionamiento relativo. En este caso, los desplazamientos se han calculado desde la parte superior e izquierda de la página. Es posible cambiar el elemento padre para que se convierta en este tipo de contenedor, y lo veremos en el artículo sobre <a href="/es/docs/Learn/CSS/CSS_layout/Positioning">posicionamiento</a>.</p>
+
+<h3 id="Posicionamiento_fijo">Posicionamiento fijo</h3>
+
+<p>El posicionamiento fijo elimina nuestro elemento del flujo de documentos de la misma manera que el posicionamiento absoluto. Sin embargo, en lugar de contar los desplazamientos en relación con el contenedor, se cuentan con respecto a la ventana gráfica. Como el elemento permanece fijo en relación con la ventana gráfica, podemos crear efectos como un menú que permanece fijo mientras la página se desplaza por debajo de él.</p>
+
+<p>En este ejemplo nuestro HTML tiene tres párrafos de texto para poder tener una página que se desplace, y un cuadro al que asignamos la propiedad <code>position: fixed</code>.</p>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento fijo&lt;/h1&gt;
+
+&lt;div class="positioned"&gt;Fijo&lt;/div&gt;
+
+&lt;p&gt;Párrafo 1.&lt;/p&gt;
+&lt;p&gt;Párrafo 2.&lt;/p&gt;
+&lt;p&gt;Párrafo 3.&lt;/p&gt;
+</pre>
+
+<div id="Fixed_1">
+<div class="hidden">
+<h6 id="Ejemplo_de_posicionamiento_fijo">Ejemplo de posicionamiento fijo</h6>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento fijo&lt;/h1&gt;
+
+&lt;div class="positioned"&gt;Fijo&lt;/div&gt;
+
+&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
+
+&lt;p&gt;Nam vulputate diam nec tempor bibendum. Donec luctus augue eget malesuada ultrices. Phasellus turpis est, posuere sit amet dapibus ut, facilisis sed est. Nam id risus quis ante semper consectetur eget aliquam lorem. Vivamus tristique elit dolor, sed pretium metus suscipit vel. Mauris ultricies lectus sed lobortis finibus. Vivamus eu urna eget velit cursus viverra quis vestibulum sem. Aliquam tincidunt eget purus in interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.&lt;/p&gt;
+
+&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;</pre>
+
+<pre class="brush: css notranslate">body {
+    width: 500px;
+    margin: 0 auto;
+}
+
+.positioned {
+    background: rgba(255,84,104,.3);
+    border: 2px solid rgb(255,84,104);
+    padding: 10px;
+    margin: 10px;
+    border-radius: 5px;
+}</pre>
+</div>
+
+<pre class="brush: css notranslate">.positioned {
+    position: fixed;
+    top: 30px;
+    left: 30px;
+}</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Fixed_1', '100%', 200) }}</p>
+
+<h3 id="Posicionamiento_pegajoso">Posicionamiento pegajoso</h3>
+
+<p>El posicionamiento pegajoso es el último método de posicionamiento que tenemos a nuestra disposición. Mezcla el posicionamiento estático predeterminado con el posicionamiento fijo. Cuando un elemento tiene la propiedad <code>position: sticky</code>, se desplaza en flujo normal hasta que se alcanzan los desplazamientos con respecto a la ventana gráfica que hemos definido. En ese punto se queda «atascado» como si tuviera configurado un valor <code>position: fixed</code>.</p>
+
+<div id="Sticky_1">
+<div class="hidden">
+<h6 id="Ejemplo_de_posicionamiento_pegajoso">Ejemplo de posicionamiento pegajoso</h6>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Posicionamiento pegajoso&lt;/h1&gt;
+
+&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
+
+&lt;div class="positioned"&gt;Pegajoso&lt;/div&gt;
+
+&lt;p&gt;Nam vulputate diam nec tempor bibendum. Donec luctus augue eget malesuada ultrices. Phasellus turpis est, posuere sit amet dapibus ut, facilisis sed est. Nam id risus quis ante semper consectetur eget aliquam lorem. Vivamus tristique elit dolor, sed pretium metus suscipit vel. Mauris ultricies lectus sed lobortis finibus. Vivamus eu urna eget velit cursus viverra quis vestibulum sem. Aliquam tincidunt eget purus in interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.&lt;/p&gt;
+
+&lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;       </pre>
+
+<pre class="brush: css notranslate">body {
+  width: 500px;
+  margin: 0 auto;
+}
+
+.positioned {
+  background: rgba(255,84,104,.3);
+  border: 2px solid rgb(255,84,104);
+  padding: 10px;
+  margin: 10px;
+  border-radius: 5px;
+}</pre>
+</div>
+
+<pre class="brush: css notranslate">.positioned {
+  position: sticky;
+  top: 30px;
+  left: 30px;
+}</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Sticky_1', '100%', 200) }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: para obtener más información sobre el posicionamiento, consulta nuestro artículo <a href="/es/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a>.</p>
+</div>
+
+<h2 id="Diseño_de_tablas">Diseño de tablas</h2>
+
+<p>Las tablas HTML sirven para mostrar datos tabulados, pero hace muchos años, antes incluso de que el CSS básico fuera compatible de forma fiable en todos los navegadores, los desarrolladores web también usaban tablas para hacer el diseño completo de una página web, colocando en las diversas filas y columnas de una tabla los títulos de encabezado de la página, los pies de página, las diferentes columnas, etc. Esto funcionó en ese momento, pero presenta muchos problemas: los diseños de tabla no son flexibles, requieren mucho código de marcado, son difíciles de depurar y no son semánticamente correctos (por ejemplo, los usuarios de lectores de pantalla tienen problemas para navegar por estos diseños de página web con tablas).</p>
+
+<p>El aspecto que presenta una tabla en una página web cuando usas el código de marcado de una tabla se debe a un conjunto de propiedades CSS que definen el diseño de la tabla. Estas propiedades se pueden usar para diseñar elementos que no son tablas, un uso que a veces se describe como «usar tablas CSS».</p>
+
+<p>El ejemplo siguiente muestra uno de esos usos; el uso de tablas CSS para el diseño debe considerarse en este punto un método heredado, para aquellas situaciones en las que tienes navegadores muy antiguos que no son compatibles con los métodos Flexbox o Grid.</p>
+
+<p>Veamos un ejemplo. Primero, un código de marcado sencillo que crea un formulario HTML. Cada elemento de entrada tiene una etiqueta, y también hemos incluido un título dentro de un párrafo. Cada par etiqueta/entrada está delimitado por un elemento {{htmlelement ("div")}}, con fines de compaginación.</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;p&gt;En primer lugar, díganos su nombre y edad.&lt;/p&gt;
+  &lt;div&gt;
+    &lt;label for="fname"&gt;Nombre:&lt;/label&gt;
+    &lt;input type="text" id="fname"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="lname"&gt;Apellidos:&lt;/label&gt;
+    &lt;input type="text" id="lname"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="age"&gt;Edad:&lt;/label&gt;
+    &lt;input type="text" id="age"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Ahora, el CSS para nuestro ejemplo. La mayor parte del CSS es bastante común, excepto por los usos de la propiedad {{cssxref ("display")}}. A los elementos {{htmlelement ("form")}}, {{htmlelement ("div")}}, {{htmlelement ("label")}} y {{htmlelement ("input")}} se les dice que se muestren como una tabla, filas de tabla y celdas de tabla, respectivamente; actuarán básicamente como marcas de tabla HTML, y lograrán por defecto la alineación perfecta de las etiquetas y las entradas. Todo lo que hay que hacer es añadir un poco de tamaños, márgenes, etc., para que todo se vea un poco mejor, ¡y listo!</p>
+
+<p>Observa que se la ha proporcionado al párrafo de encabezado <code>display: table-caption;,</code> lo que hace que actúe como una celda de encabezado ({{htmlelement ("caption")}}) de la tabla; y con <code>caption-side: bottom;</code> se le dice a la celda de encabezado que se asiente en la parte inferior de la tabla con fines de aplicación de estilo, aunque en el código fuente el marcado está antes que los elementos <code>&lt;input&gt;</code>. Esto permite un poco de flexibilidad.</p>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+form {
+  display: table;
+  margin: 0 auto;
+}
+
+form div {
+  display: table-row;
+}
+
+form label, form input {
+  display: table-cell;
+  margin-bottom: 10px;
+}
+
+form label {
+  width: 200px;
+  padding-right: 5%;
+  text-align: right;
+}
+
+form input {
+  width: 300px;
+}
+
+form p {
+  display: table-caption;
+  caption-side: bottom;
+  width: 300px;
+  color: #999;
+  font-style: italic;
+}</pre>
+
+<p>Esto nos da el resultado siguiente:</p>
+
+<p>{{ EmbedLiveSample('Table_layout', '100%', '170') }}</p>
+
+<p>También puedes ver este ejemplo en vivo en <a href="https://mdn.github.io/learning-area/css/styling-boxes/box-model-recap/css-tables-example.html">css-tables-example.html</a> (ver el <a href="https://github.com/mdn/learning-area/blob/master/css/styling-boxes/box-model-recap/css-tables-example.html">código fuente</a>).</p>
+
+<h2 id="Diseño_en_columnas">Diseño en columnas</h2>
+
+<p>El módulo de diseño en columnas nos proporciona un modo de distribuir el contenido en columnas, de forma similar al modo como el texto fluye en un periódico. Aunque en un contexto web leer en columnas de arriba a abajo no resulta tan útil porque podría obligar a los usuarios a tener que hacer desplazamientos de arriba a abajo, la técnica de organizar el contenido en columnas también puede tener su utilidad.</p>
+
+<p>Para convertir un bloque en un contenedor, utilizamos la propiedad {{cssxref ("column-count")}}, que le dice al navegador cuántas columnas nos gustaría tener, o {{cssxref ("column-width")}}, que le dice al navegador que llene el contenedor con tantas columnas de al menos ese ancho.</p>
+
+<p>En el ejemplo siguiente comenzamos con un bloque de HTML dentro de un elemento <code>&lt;div&gt;</code> que contiene una clase <code>container</code>.</p>
+
+<pre class="brush: html notranslate">&lt;div class="container"&gt;
+    &lt;H1&gt;Diseño en columnas&lt;/ h1&gt;
+
+    &lt;p&gt;Párrafo 1.&lt;/p&gt;
+    &lt;p&gt;Párrafo 2.&lt;/p&gt;
+
+&lt;/div&gt;
+</pre>
+
+<p>Utilizamos un <code>column-width</code> de 200 píxeles en ese contenedor, que crea en el navegador tantas columnas de 200 píxeles como quepan en el contenedor y luego comparte el espacio restante entre las columnas creadas.</p>
+
+<div id="Multicol_1">
+<div class="hidden">
+<h6 id="Ejemplo_de_diseño_en_columnas">Ejemplo de diseño en columnas</h6>
+
+<pre class="brush: html notranslate">&lt;div class="container"&gt;
+        &lt;h1&gt; Diseño en columnas &lt;/h1&gt;
+
+        &lt;p&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla luctus aliquam dolor, eu lacinia lorem placerat vulputate. Duis felis orci, pulvinar id metus ut, rutrum luctus orci. Cras porttitor imperdiet nunc, at ultricies tellus laoreet sit amet. Sed auctor cursus massa at porta. Integer ligula ipsum, tristique sit amet orci vel, viverra egestas ligula. Curabitur vehicula tellus neque, ac ornare ex malesuada et. In vitae convallis lacus. Aliquam erat volutpat. Suspendisse ac imperdiet turpis. Aenean finibus sollicitudin eros pharetra congue. Duis ornare egestas augue ut luctus. Proin blandit quam nec lacus varius commodo et a urna. Ut id ornare felis, eget fermentum sapien.&lt;/p&gt;
+
+
+        &lt;p&gt;Nam vulputate diam nec tempor bibendum. Donec luctus augue eget malesuada ultrices. Phasellus turpis est, posuere sit amet dapibus ut, facilisis sed est. Nam id risus quis ante semper consectetur eget aliquam lorem. Vivamus tristique elit dolor, sed pretium metus suscipit vel. Mauris ultricies lectus sed lobortis finibus. Vivamus eu urna eget velit cursus viverra quis vestibulum sem. Aliquam tincidunt eget purus in interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.&lt;/p&gt;
+
+    &lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">body { max-width: 800px; margin: 0 auto; } </pre>
+</div>
+
+<pre class="brush: css notranslate">    .container {
+        column-width: 200px;
+    }</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Multicol_1', '100%', 200) }}</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Este artículo ha proporcionado un breve resumen de todas las tecnologías de diseño que debes conocer. ¡Sigue leyendo para obtener más información sobre cada tecnología individual!</p>
+
+<p>{{NextMenu("Learn/CSS/CSS_layout/Normal_Flow", "Learn/CSS/CSS_layout")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">Flujo normal</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Flotación</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño adaptativo</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a medios</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredados</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad en navegadores antiguos </a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de elementos básicos de compaginación</a></li>
+</ul>
diff --git a/files/es/learn/css/css_layout/normal_flow/index.html b/files/es/learn/css/css_layout/normal_flow/index.html
new file mode 100644
index 0000000000..6c528855af
--- /dev/null
+++ b/files/es/learn/css/css_layout/normal_flow/index.html
@@ -0,0 +1,96 @@
+---
+title: Flujo normal
+slug: Learn/CSS/CSS_layout/Normal_Flow
+translation_of: Learn/CSS/CSS_layout/Normal_Flow
+original_slug: Learn/CSS/CSS_layout/Flujo_normal
+---
+<div>{{LearnSidebar}}</div>
+
+<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Introduction", "Learn/CSS/CSS_layout/Flexbox", "Learn/CSS/CSS_layout")}}</p>
+
+<p class="summary">Este artículo explica el flujo normal, o la forma en que se presentan los elementos de la página web si no cambias su compaginación.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Conocer cómo los navegadores presentan de forma predeterminada las páginas web antes de comenzar a hacer cambios.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Como se detalla en el último artículo de introducción al diseño, los elementos en una página web se distribuyen según el flujo normal si no se aplica ningún CSS que cambie la forma en la que se comportan. Y, como comenzamos a descubrir, puedes cambiar el comportamiento de los elementos, ya sea ajustando su posición en este flujo normal o eliminándolos de este por completo. Comenzar con un documento coherente y bien estructurado que sea legible en el flujo normal es la mejor manera de comenzar cualquier página web. Asegura que tu contenido sea legible, incluso si el usuario usa un navegador muy limitado o un dispositivo como un lector de pantalla que lee el contenido de la página. Además, como el flujo normal está diseñado para que un documento sea legible, al comenzar de esta manera, trabajas en el documento en lugar de luchar contra él a medida que haces cambios en su diseño.</p>
+
+<p>Antes de profundizar en los diferentes métodos de diseño, vale la pena revisar algunas de las cosas que ya debes haber estudiado en artículos anteriores con respecto al flujo normal de los documentos.</p>
+
+<h2 id="¿Cómo_se_presentan_por_defecto_los_elementos">¿Cómo se presentan por defecto los elementos?</h2>
+
+<p>En primer lugar, se toma de las cajas de cada uno de los elementos el contenido, luego se añade cualquier área de relleno, borde y margen alrededor de ellas; es el modelo de cajas que hemos visto antes.</p>
+
+<p>De manera predeterminada, el contenido de un <a href="/es/docs/Web/HTML/Block-level_elements">elemento de nivel de bloque</a> es el 100% del ancho de su elemento padre y su altura viene determinada por su contenido. Los <a href="/es/docs/Web/HTML/Elementos_en_línea">elementos en línea</a> tienen su altura y anchura determinados por su contenido. No puedes establecer el ancho o la altura de los elementos en línea, simplemente se ubican dentro del contenido de los elementos de nivel de bloque. Si deseas controlar el tamaño de un elemento en línea de esta manera, debes configurarlo para que se comporte como un elemento de nivel de bloque con <code>display: block;</code> (o incluso, <code>display: inline-block;</code>, que combina características de ambos).</p>
+
+<p>Esto explica los elementos individuales, pero ¿qué hay del modo como los elementos interactúan entre sí? El flujo de diseño normal (mencionado en el artículo de introducción al diseño) es el sistema mediante el cual los elementos se colocan en la ventana gráfica del navegador. De manera predeterminada, los elementos de nivel de bloque se presentan en la <em>dirección del flujo del bloque</em>, en función del <a href="/es/docs/Web/CSS/writing-mode">modo de escritura</a> de los padres (<em>initial</em>: horizontal-tb): cada uno aparecerá en una línea nueva debajo de la última, y estarán separados por cualquier margen que se establezca en ellos. Por lo tanto, en inglés, o en cualquier otro modo de escritura horizontal y de arriba a abajo, los elementos de nivel de bloque se disponen verticalmente.</p>
+
+<p>Los elementos en línea se comportan de manera diferente: no aparecen en líneas nuevas; en su lugar, se asientan en la misma línea entre sí y con cualquier contenido de texto adyacente (o envuelto), siempre que tengan espacio dentro del ancho del elemento de nivel de bloque primario. Si no hay espacio, el texto o los elementos que desborden bajarán a la línea siguiente.</p>
+
+<p>Si dos elementos adyacentes tienen algún margen configurado y los dos márgenes se tocan, se mantiene el mayor de los dos y el menor desaparece; esto se llama colapso del margen, y ya lo hemos visto antes.</p>
+
+<p>Echemos un vistazo a un ejemplo sencillo que explica todo esto:</p>
+
+<div id="Normal_Flow">
+<pre class="brush: html">&lt;h1&gt;Flujo de los documentos básicos&lt;/h1&gt;
+
+&lt;p&gt;Soy un elemento básico de nivel de bloque. Mis elementos de nivel de bloque adyacentes se encuentran en líneas nuevas debajo de mí.&lt;/p&gt;
+
+&lt;p&gt;Cubrimos por defecto el 100% del ancho de nuestro elemento principal, y somos tan altos como nuestro contenido secundario. Nuestro ancho y alto total es nuestro contenido + área de relleno + ancho/alto del borde.&lt;/p&gt;
+
+&lt;p&gt;Estamos separados por nuestros márgenes. Debido al colapso del margen, estamos separados por el ancho de uno de nuestros márgenes, no por ambos.&lt;/p&gt;
+
+&lt;p&gt;Los elementos en línea &lt;span&gt;como este&lt;/span&gt; y &lt;span&gt;este otro&lt;/span&gt; se ubican en la misma y la de los nodos de texto adyacentes, mientras hay espacio en la misma línea. Si un elemento en línea desborda, &lt;span&gt;sigue por la línea siguiente, si es posible (como la que contiene este texto)&lt;/span&gt;, o simplemente pasa a una línea nueva, como hace esta imagen: &lt;img src="https://mdn.mozillademos.org/files/13360/long.jpg"&gt;&lt;/p&gt;</pre>
+
+<pre class="brush: css">body {
+  width: 500px;
+  margin: 0 auto;
+}
+
+p {
+  background: rgba(255,84,104,0.3);
+  border: 2px solid rgb(255,84,104);
+  padding: 10px;
+  margin: 10px;
+}
+
+span {
+  background: white;
+  border: 1px solid black;
+}</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Normal_Flow', '100%', 500) }}</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Ahora que comprendes el flujo normal y cómo el navegador presenta las cosas por defecto, continúa para comprender cómo cambiar esta pantalla predeterminada para crear el diseño que necesitas.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Introduction", "Learn/CSS/CSS_layout/Flexbox", "Learn/CSS/CSS_layout")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">El flujo normal</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Flotación</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño adaptativo</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a media</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredada</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad con los navegadores antiguos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de de elementos básicos de compaginación </a></li>
+</ul>
diff --git a/files/es/learn/css/css_layout/responsive_design/index.html b/files/es/learn/css/css_layout/responsive_design/index.html
new file mode 100644
index 0000000000..e1307d54a5
--- /dev/null
+++ b/files/es/learn/css/css_layout/responsive_design/index.html
@@ -0,0 +1,325 @@
+---
+title: Diseño receptivo
+slug: Learn/CSS/CSS_layout/Responsive_Design
+translation_of: Learn/CSS/CSS_layout/Responsive_Design
+original_slug: Learn/CSS/CSS_layout/Diseño_receptivo
+---
+<div>{{learnsidebar}}{{PreviousMenuNext("Learn/CSS/CSS_layout/Multiple-column_Layout", "Learn/CSS/CSS_layout/Media_queries", "Learn/CSS/CSS_layout")}}</div>
+
+<p>En los primeros días del diseño web, las páginas se diseñaban para llenar un tamaño de pantalla en particular. Si el usuario tenía una pantalla más grande o más pequeña que la del diseñador, los resultados esperados iban desde barras de desplazamiento no deseadas hasta longitudes de línea excesivamente largas y un mal uso del espacio. A medida que estuvieron disponibles tamaños de pantalla más diversos, apareció el concepto de <em>diseño web responsivo </em> (RWD, <em>responsive web design</em>), un conjunto de prácticas que permite a las páginas web alterar su diseño y apariencia para adaptarse a diferentes anchos de pantalla, resoluciones, etc. Es una idea que cambió la forma en que diseñamos para una web multidispositivo, y en este artículo te ayudaremos a comprender las principales técnicas que necesitas saber para dominarlo.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Primeros pasos en CSS</a> y <a href="/es/docs/Learn/CSS/Building_blocks">Los elementos básicos del CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender los conceptos fundamentales y la historia del diseño responsivo.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Diseños_de_sitios_web_históricos">Diseños de sitios web históricos</h2>
+
+<p>En un momento de la historia, solo tenías dos opciones al diseñar un sitio web:</p>
+
+<ul>
+ <li>Podías crear un sitio <em>líquido</em>, que se expandiría para llenar toda la ventana del navegador</li>
+ <li>o un sitio de <em>ancho fijo</em>, que sería un tamaño fijo en píxeles.</li>
+</ul>
+
+<p>Estos dos enfoques tendían a dar como resultado un sitio web que se veía mejor ¡en la pantalla de la persona que diseñaba el sitio! El sitio líquido dio como resultado un diseño encogido en las pantallas que eran más pequeñas (como se ve a continuación) o longitudes de línea interminables en las pantallas que eran más grandes.</p>
+
+<figure><img alt="Un diseño de página con dos columnas encogidas en una ventana gráfica del tamaño de un teléfono móvil." src="https://mdn.mozillademos.org/files/16834/mdn-rwd-liquid.png" style="display: block; height: 406px; width: 300px;">
+<figcaption></figcaption>
+</figure>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Observa este <a href="https://mdn.github.io/css-examples/learn/rwd/liquid-width.html">ejemplo</a> y su <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/liquid-width.html">código fuente</a> de un diseño líquido sencillo. Amplía o reduce la ventana del navegador y observa cómo cambia su aspecto en diferentes tamaños.</p>
+</div>
+
+<p>El sitio de ancho fijo se arriesgaba a una barra de desplazamiento horizontal en pantallas que eran más pequeñas que el ancho del sitio (como se ve a continuación), y a un gran espacio en blanco en los bordes del diseño en las pantallas que eran más grandes.</p>
+
+<figure><img alt="Un diseño con una barra de desplazamiento horizontal en una ventana de teléfono móvil." src="https://mdn.mozillademos.org/files/16835/mdn-rwd-fixed.png" style="display: block; height: 411px; width: 300px;">
+<figcaption></figcaption>
+</figure>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Observa este <a href="https://mdn.github.io/css-examples/learn/rwd/fixed-width.html">ejemplo</a> y su <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/fixed-width.html">código fuente</a> de un diseño sencillo con un ancho fijo. Nuevamente, cambia el tamaño de la ventana del navegador y observa el resultado.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Las capturas de pantalla anteriores se han tomado usando el <a href="/es/docs/Tools/Responsive_Design_View">modo de diseño responsivo</a> de las herramientas DevTools de Firefox.</p>
+</div>
+
+<p>A medida que la web móvil comenzó a hacerse realidad con los primeros teléfonos con funciones, las empresas que deseaban adoptar los dispositivos móviles solían crear una versión especial de su sitio web para dispositivo móvil, con una URL diferente (a menudo algo así como <em>m.example.com</em> o <em>example.mobi</em>). Esto significaba que había que desarrollar y actualizar dos versiones independientes del sitio web.</p>
+
+<p>Además, estos sitios web para dispositivos móviles a menudo ofrecían una experiencia muy reducida. A medida que los dispositivos móviles se volvían más potentes y capaces de mostrar sitios web completos, esto resultaba frustrante para los usuarios de dispositivos móviles, que se veían atrapados en la versión móvil del sitio web y no podían acceder a la información que sabían que había en la versión de escritorio, que incluía todas las funciones del sitio web.</p>
+
+<h2 id="Diseño_flexible_antes_del_diseño_responsivo">Diseño flexible antes del diseño responsivo</h2>
+
+<p>Se desarrollaron varios enfoques para tratar de resolver los inconvenientes de los métodos líquidos o de ancho fijo para crear sitios web. En 2004, Cameron Adams escribió una publicación titulada <a href="http://www.themaninblue.com/writing/perspective/2004/09/21/">Resolution dependent layout</a>, que describe un método para crear un diseño que podría adaptarse a diferentes resoluciones de pantalla. Este enfoque requería JavaScript para detectar la resolución de la pantalla y cargar el CSS correcto.</p>
+
+<p>Zoe Mickley Gillenwater fue determinante en <a href="http://zomigi.com/blog/voices-that-matter-slides-available/">su trabajo</a> de descripción y formalización de los diversos modos en que se podían crear sitios web flexibles para intentar encontrar una situación intermedia entre llenar toda la pantalla o tener un tamaño completamente fijo.</p>
+
+<h2 id="Diseño_responsivo">Diseño responsivo</h2>
+
+<p>El término <em>diseño responsivo</em> fue acuñado por <a href="https://alistapart.com/article/responsive-web-design/">Ethan Marcotte en 2010</a>, y describía el uso combinado de tres técnicas.</p>
+
+<ol>
+ <li>La primera era la idea de las redes fluidas, algo que ya exploraba Gillenwater, y que puede leerse en el artículo de Marcotte, <a href="https://alistapart.com/article/fluidgrids/">Fluid Grids</a> (publicado en 2009 en <em>A list apart</em>).</li>
+ <li>La segunda técnica era la idea de las <a href="http://unstoppablerobotninja.com/entry/fluid-images">imágenes fluidas</a>. Usando una técnica muy simple de establecer la propiedad de <code>max-width</code> al <code>100%</code>, las imágenes se reducían si su columna de contención se volvía más estrecha que el tamaño intrínseco de la imagen, pero nunca se expandía. Esto permite reducir una imagen para que se ajuste a una columna de tamaño flexible, en lugar de que desborde, pero no se expande ni se pixela si la columna se ensancha más que la imagen.</li>
+ <li>El tercer componente clave era la <a href="/es/docs/Web/CSS/Media_Queries">consulta a los media</a>. Las consultas a los media habilitan el tipo de cambio de diseño que Cameron Adams había explorado previamente usando JavaScript, pero usando solo CSS. En lugar de tener un único diseño para todos los tamaños de pantalla, el diseño podría cambiarse. Las barras laterales pueden reposicionarse en una pantalla más pequeña, o puede mostrarse una navegación alternativa.</li>
+</ol>
+
+<p>Es importante comprender que <strong>el diseño web responsivo no es una tecnología independiente</strong>: es un término utilizado para describir un enfoque para el diseño web, o un conjunto de buenas prácticas utilizado para crear un diseño que puede <em>responder</em> según el dispositivo que se utiliza para ver un contenido. En la exploración original de Marcotte, esto significaba cuadrículas flexibles (mediante elementos flotantes) y consultas de media; sin embargo, en los casi 10 años desde que se escribió ese artículo, trabajar de manera responsiva se ha convertido en la norma. Los métodos de diseño CSS modernos son inherentemente responsivos, y la plataforma web dispone de herramientas integradas nuevas que facilitan el diseño de sitios web responsivos.</p>
+
+<p>El resto de este artículo te indicará las diversas características de la plataforma web que puedas querer utilizar para crear un sitio responsivo.</p>
+
+<h2 id="La_consulta_a_los_media">La consulta a los media</h2>
+
+<p>El diseño responsivo solo pudo surgir gracias a la consulta a los media. La especificación de nivel 3 de consulta a los media se convirtió en una candidata a Recomendación en 2009, lo que significa que se consideró lista para su implementación en los navegadores. Las consultas a los media nos permiten ejecutar una serie de pruebas (por ejemplo, si la pantalla del usuario es mayor que un ancho o una resolución determinados) y aplicar CSS selectivamente para diseñar la página de manera que resulte adecuada a las necesidades del usuario.</p>
+
+<p>Por ejemplo, la consulta a los media siguiente explora si la página web que se muestra lo hace como un medio de pantalla (por lo tanto, no es un documento impreso) y si la ventana tiene al menos 800 píxeles de ancho. El CSS para el selector <code>.container</code> solo se aplicará si ambas condiciones son ciertas.</p>
+
+<pre class="brush: css"><code>@media screen and (min-width: 800px) {
+  .container {
+    margin: 1em 2em;
+  }
+} </code>
+</pre>
+
+<p>Puedes añadir múltiples consultas a los media dentro de una hoja de estilo, y ajustar todo tu diseño o solo partes de él para que se adapte mejor a los diferentes tamaños de pantalla. Los puntos en los que se introduce una consulta a los media y se cambia el diseño se conocen como <em>puntos de interrupción</em>.</p>
+
+<p>Un enfoque común cuando se usan las consultas a los media es crear un diseño sencillo de una sola columna para dispositivos de pantalla estrecha (por ejemplo, teléfonos móviles), luego implementar un diseño en columnas para pantallas más grandes cuando se sabe que hay suficiente ancho de pantalla para manejarlo. Esto se describe a menudo como diseño <strong>primero móvil</strong>.</p>
+
+<p>Obtén más información sobre las <a href="/es/docs/Web/CSS/Media_Queries">consultas a los media</a> en la documentación de MDN.</p>
+
+<h2 id="Cuadrículas_flexibles">Cuadrículas flexibles</h2>
+
+<p>Los sitios responsivos no solo cambian su diseño entre puntos de interrupción, sino que se construyen sobre cuadrículas flexibles. Una cuadrícula flexible significa que no tienes que centrarte en todos los tamaños de dispositivo posibles y construir para ellos un diseño en píxeles perfecto. Ese enfoque sería imposible dada la gran cantidad de dispositivos de tamaños diferentes que hay, y el hecho de que, al menos en la versión de escritorio, las personas no siempre tienen la ventana de su navegador maximizada.</p>
+
+<p>Al usar una cuadrícula flexible, solo necesitas añadir un punto de interrupción y cambiar el diseño en el punto en que el contenido comienza a verse mal. Por ejemplo, si las longitudes de las líneas se vuelven interminablemente largas a medida que el tamaño de la pantalla aumenta, o una caja se encoje hasta un ancho de dos palabras en cada línea a medida que el tamaño de la pantalla se reduce.</p>
+
+<p>En los primeros días del diseño responsivo, nuestra única opción para el diseño de páginas web era usar <a href="/es/docs/Learn/CSS/CSS_layout/Floats">elementos flotantes</a>. Los diseños de pantalla con elementos flotantes flexibles se lograban dando a cada elemento un ancho porcentual asegurándose de que para toda la página no alcanzara más del 100%. En su trabajo original sobre cuadrículas fluidas, Marcotte detalló una fórmula para tomar un diseño de página web diseñado usando píxeles y convertirlo en porcentajes.</p>
+
+<pre><code>target / context = result </code>
+</pre>
+
+<p>Por ejemplo, si el tamaño de nuestra columna de destino es de 60 píxeles y el contexto (o contenedor) en el que se encuentra es de 960 píxeles, dividimos 60 por 960 para obtener un valor que podemos usar en nuestro CSS, después de mover el separador de cifras decimales dos posiciones a la derecha.</p>
+
+<pre class="brush: css"><code>.col {
+  width: 6.25%; /* 60 / 960 = 0.0625 */
+} </code>
+</pre>
+
+<p>Este enfoque se encuentra hoy en muchos lugares de la web, y aquí está documentado en la sección de compaginación de nuestro artículo sobre <a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">métodos de compaginación heredados</a>. Es probable que encuentres sitios web que utilizan este enfoque en su trabajo, por lo que vale la pena entenderlo, aunque no vas a construir un sitio web moderno utilizando una cuadrícula flexible basada en elementos flotantes.</p>
+
+<p>El ejemplo siguiente muestra un diseño responsivo sencillo que utiliza consultas a los medios y una cuadrícula flexible. En pantallas estrechas, el diseño de página muestra las cajas en columna una encima de la otra:</p>
+
+<figure><img alt="Una vista de un dispositivo móvil con un diseño de página con cajas en columna vertical una encima de la otra." src="https://mdn.mozillademos.org/files/16836/mdn-rwd-mobile.png" style="display: block; height: 407px; width: 300px;">
+<figcaption></figcaption>
+</figure>
+
+<p>En pantallas más anchas se pasa a dos columnas:</p>
+
+<figure><img alt="Una vista de un dispositivo de escritorio con un diseño a dos columnas." src="https://mdn.mozillademos.org/files/16837/mdn-rwd-desktop.png" style="display: block; height: 217px; width: 600px;">
+<figcaption></figcaption>
+</figure>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar el <a href="https://mdn.github.io/css-examples/learn/rwd/float-based-rwd.html">ejemplo en vivo</a> y el <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/float-based-rwd.html">código fuente</a> de este ejemplo en GitHub.</p>
+</div>
+
+<h2 id="Tecnologías_modernas_de_diseño_de_páginas_web">Tecnologías modernas de diseño de páginas web</h2>
+
+<p>Los métodos modernos de diseño de páginas web, como el <a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">diseño en columnas</a>, <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a> y <a href="/es/docs/Learn/CSS/CSS_layout/Grids">Grid</a> son responsivos por defecto. Todos estos métodos asumen que tratas de crear una cuadrícula flexible y te proporcionan los modos más fáciles de hacerlo.</p>
+
+<h3 id="Multicol">Multicol</h3>
+
+<p>El más antiguo de estos métodos de diseño de páginas web es multicol. Cuando especificas un atributo <code>column-count</code>, esto indica en cuántas columnas deseas dividir tu contenido. El navegador entonces calcula el tamaño de estas columnas, que cambiará de acuerdo con el tamaño de la pantalla.</p>
+
+<pre class="brush: css"><code>.container {
+  column-count: 3;
+} </code>
+</pre>
+
+<p>Si en lugar de ello estableces el atributo <code>column-width</code>, especificas un ancho <em>mínimo</em>. El navegador crea tantas columnas de ese ancho como quepan cómodamente en el contenedor, y reparte el espacio entre todas las columnas. Por lo tanto, el número de columnas cambia según la cantidad de espacio que hay.</p>
+
+<pre class="brush: css"><code>.container {
+  column-width: 10em;
+} </code>
+</pre>
+
+<h3 id="Flexbox">Flexbox</h3>
+
+<p>En el método Flexbox, los elementos flexibles se encogen y distribuyen el espacio entre los elementos según el espacio que hay en su contenedor, según su comportamiento inicial. Al cambiar los valores de <code>flex-grow</code> y <code>flex-shrink</code>, puedes indicar cómo deseas que se comporten los elementos cuando a su alrededor hay más o menos espacio.</p>
+
+<p>En el ejemplo siguiente, los elementos flexibles ocupan cada uno la misma cantidad de espacio en el contenedor flexible, al utilizar la abreviatura <code>flex: 1</code> como se describe en el artículo <a href="/es/docs/Learn/CSS/CSS_layout/Grids#Cuadr%C3%ADculas_flexibles_con_la_unidad_fr">Flexbox: Dimensionamiento flexible de los elementos flex</a>.</p>
+
+<pre class="brush: css"><code>.container {
+  display: flex;
+}
+
+.item {
+  flex: 1;
+} </code>
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Como ejemplo, hemos reconstruido el anterior diseño de página responsivo sencillo, esta vez usando Flexbox. Puedes ver que ya no necesitamos usar valores de porcentaje extraños para calcular el tamaño de las columnas: <a href="https://mdn.github.io/css-examples/learn/rwd/flex-based-rwd.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/flex-based-rwd.html">código fuente</a>.</p>
+</div>
+
+<h3 id="Cuadrículas_CSS">Cuadrículas CSS</h3>
+
+<p>En el diseño de cuadrículas con CSS, la unidad <code>fr</code> permite la distribución del espacio disponible en las trazas de la cuadrícula. El ejemplo siguiente crea un contenedor de cuadrícula con tres trazas dimensionadas a <code>1fr</code>. Esto crea tres columnas, cada una de las cuales ocupa una parte del espacio que hay disponible en el contenedor. Puedes obtener más información sobre este enfoque para crear una cuadrícula en el módulo Aprender a diseñar cuadrículas en <a href="/en-US/docs/Learn/CSS/CSS_layout/Grids#Flexible_grids_with_the_fr_unit">Cuadrículas flexibles con la unidad fr</a>.</p>
+
+<pre class="brush: css"><code>.container {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+} </code>
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: La versión del diseño de página en cuadrícula es aún más simple, ya que podemos definir las columnas en .wrapper: <a href="https://mdn.github.io/css-examples/learn/rwd/grid-based-rwd.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/grid-based-rwd.html">código fuente</a>.</p>
+</div>
+
+<h2 id="Imágenes_responsivas">Imágenes responsivas</h2>
+
+<p>El enfoque más simple para las imágenes responsivas es el que se describe en los primeros artículos de Marcotte sobre diseño responsivo. Básicamente, tomar una imagen que tenga el tamaño más grande que puedas necesitar, y reducirla. Este continúa siendo un enfoque utilizado hoy en día, y en la mayoría de las hojas de estilo encontrarás en alguna parte el CSS siguiente:</p>
+
+<pre class="brush: css"><code>img {
+  max-width: 100%:
+} </code>
+</pre>
+
+<p>Hay inconvenientes obvios en este enfoque. La imagen puede mostrarse mucho más pequeña que su tamaño intrínseco, lo que representa una pérdida de ancho de banda: un usuario de dispositivo móvil puede descargar una imagen que sea varias veces el tamaño de lo que ve en realidad en la ventana del navegador. Además, es posible que no desees la misma relación de aspecto de la imagen en dispositivos móviles y en ordenadores de escritorio. Por ejemplo, podría ser bueno tener una imagen cuadrada para dispositivos móviles, pero mostrar la misma escena que una imagen horizontal en el escritorio. O bien es posible que, reconociendo el tamaño más pequeño de una imagen en dispositivos móviles, desees mostrar una imagen diferente, que se entienda mejor en un tamaño de pantalla pequeño. Estas cosas no se pueden lograr simplemente reduciendo una imagen.</p>
+
+<p>Las imágenes responsivas, que utilizan el elemento {{htmlelement ("picture")}} y los atributos {{htmlelement ("img")}} <code>srcset</code> y <code>sizes</code> resuelven ambos problemas. Puedes proporcionar varios tamaños junto con «sugerencias» (metadatos que describen el tamaño de pantalla y la resolución para que la imagen sea la más adecuada), y el navegador elije la imagen que resulta más adecuada para cada dispositivo, y se asegura de que el usuario descarga un tamaño de imagen apropiado para el dispositivo que utiliza.</p>
+
+<p>También puedes usar imágenes <em>de director artístico</em>, que proporcionan un recorte o una imagen completamente diferente para diferentes tamaños de pantalla.</p>
+
+<p>Puedes encontrar una <a href="/es/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">guía detallada de imágenes responsivas en el artículo sobre Aprender HTML</a> en MDN.</p>
+
+<h2 id="Tipografía_responsiva">Tipografía responsiva</h2>
+
+<p>Un elemento de diseño responsivo que todavía no hemos tratado en trabajos anteriores es la idea de la tipografía responsiva. Este concepto describe esencialmente el hecho de cambiar el tamaño de letra según el espacio de pantalla que reflejan las consultas a media.</p>
+
+<p>En este ejemplo, queremos establecer que nuestro encabezado de nivel 1 sea <code>4rem</code>, lo que significa que será cuatro veces nuestro tamaño de letra base. ¡Es un título muy grande! Solo queremos este título de encabezado gigante en los tamaños de pantalla más grandes, por lo tanto, primero creamos un título de encabezado más pequeño y luego usamos las consultas a los media para sobrescribirlo con el tamaño más grande si sabemos que el usuario tiene un tamaño de pantalla de al menos <code>1200px</code>.</p>
+
+<pre class="brush: css"><code>html {
+  font-size: 1em;
+}
+
+h1 {
+  font-size: 2rem;
+}
+
+@media (min-width: 1200px) {
+  h1 {
+    font-size: 4rem;
+  }
+} </code>
+</pre>
+
+<p>Hemos editado nuestro ejemplo anterior de cuadrícula responsiva para incluir también el tipo de respuesta utilizando el método descrito. Puedes ver cómo el título de encabezado cambia de tamaño cuando el diseño para a la versión de dos columnas.</p>
+
+<p>En la versión para dispositivo móvil, el encabezado es más pequeño:</p>
+
+<figure><img alt="Un diseño de elementos apilados en columna con un tamaño de título de encabezado pequeño." src="https://mdn.mozillademos.org/files/16838/mdn-rwd-font-mobile.png" style="display: block; height: 407px; width: 300px;">
+<figcaption></figcaption>
+</figure>
+
+<p>Sin embargo, en las versiones de escritorio vemos un tamaño de título de encabezado más grande:</p>
+
+<figure><img alt="Un diseño en dos columnas con un título grande." src="https://mdn.mozillademos.org/files/16839/mdn-rwd-font-desktop.png" style="display: block; height: 169px; width: 600px;">
+<figcaption></figcaption>
+</figure>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Observa este ejemplo en: <a href="https://mdn.github.io/css-examples/learn/rwd/type-rwd.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/type-rwd.html">código fuente</a>.</p>
+</div>
+
+<p>Como muestra este enfoque sobre la tipografía, no es necesario restringir las consultas a medios a cambiar solo el diseño de página. Se pueden usar para ajustar cualquier elemento y hacerlo más útil o atractivo según los diversos tamaños de pantalla.</p>
+
+<h3 id="El_uso_de_unidades_de_ventana_gráfica_para_tipografía_responsiva">El uso de unidades de ventana gráfica para tipografía responsiva</h3>
+
+<p>Un enfoque interesante es utilizar las unidades de ventana gráfica <code>vw</code> para habilitar la tipografía responsiva. <code>1vw</code> es igual al uno por ciento del ancho de la ventana gráfica, lo que significa que si configuras el tamaño del tipo de letra con <code>vw</code>, siempre estará en relación con el tamaño de la ventana gráfica.</p>
+
+<pre class="brush: css">h1 {
+  font-size: 6vw;
+}</pre>
+
+<p>El problema de hacer esto es que el usuario pierde la posibilidad de ampliar cualquier conjunto de texto configurado en unidades <code>vw</code>, porque ese texto siempre está en relación con el tamaño de la ventana gráfica. <strong>Por lo tanto, nunca hay que establecer texto utilizando solo unidades de ventana</strong>.</p>
+
+<p>Hay una solución, que implica el uso de la función <code><a href="/en-US/docs/Web/CSS/calc">calc()</a></code>. Si añades la unidad <code>vw</code> a un valor establecido con un tamaño fijo, como <code>em</code> o <code>rem</code>, el texto continúa siendo ampliable. Esencialmente, la unidad <code>vw</code> se añade sobre ese valor ampliado:</p>
+
+<pre class="brush: css">h1 {
+  font-size: calc(1.5rem + 3vw);
+}</pre>
+
+<p>Esto significa que necesitamos especificar el tamaño de letra para el título de encabezado una sola vez, en lugar de configurarlo para dispositivos móviles y redefinirlo en las consultas a medios. Luego, el tipo de letra aumenta gradualmente a medida que aumenta el tamaño de la ventana gráfica.</p>
+
+<div class="blockIndicator note">
+<p>Observa un ejemplo en: <a href="https://mdn.github.io/css-examples/learn/rwd/type-vw.html">ejemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/type-vw.html">código fuente</a>.</p>
+</div>
+
+<h2 id="La_metaetiqueta_viewport">La metaetiqueta viewport</h2>
+
+<p>Si observas el tipo de letra de una página HTML responsiva, en general vas a encontrar la siguiente etiqueta {{htmlelement ("meta")}} en la cabecera del documento.</p>
+
+<pre class="brush: html"><code>&lt;meta name="viewport" content="width=device-width,initial-scale=1"&gt;</code>
+</pre>
+
+<p>Esta metaetiqueta informa a los navegadores de los dispositivos móviles que deben establecer el ancho de la ventana gráfica al ancho del dispositivo y escalar el documento al 100% de ese tamaño, de modo que el documento se mostrará al tamaño optimizado para esos dispositivos móviles.</p>
+
+<p>¿Por qué esto es necesario? Porque los navegadores de los dispositivos móviles tienden a mentir sobre el ancho de su ventana gráfica.</p>
+
+<p>Esta metaetiqueta existe porque cuando se lanzó el iPhone original y la gente comenzó a ver sitios web en una pequeña pantalla de teléfono móvil, la mayoría de los sitios web no estaban optimizados para dispositivos móviles. Por lo tanto, el navegador móvil establecía el ancho de la ventana gráfica en 960 píxeles, representaba la página con ese ancho y mostraba el resultado como una versión reducida del diseño del escritorio. Otros navegadores de dispositivos móviles (por ejemplo, en Google Android) hicieron lo mismo. Los usuarios podían acercarse y desplazarse por el sitio web para ver las partes que les interesaban, pero se veía mal. Todavía verás esto hoy en día si tienes la desgracia de encontrarte con un sitio web que no tiene un diseño de página responsivo.</p>
+
+<p>El problema es que tu diseño responsivo con puntos de interrupción y consultas a media no va a funcionar según lo previsto en los navegadores de dispositivos móviles, si tienes un diseño de pantalla estrecho que se inicia con un ancho de ventana de 480px o menos, pero la ventana gráfica está configurada en 960px. E cambio, al configurar <code>width=device-width</code> anulas el ancho predeterminado <code>width=960px</code> de Apple con el ancho real del dispositivo, y tus consultas a media funcionarán según lo previsto.</p>
+
+<p><strong>Por lo tanto, <em>siempre</em> debes incluir la línea de HTML anterior en la cabecera de tus documentos.</strong></p>
+
+<p>Con la metaetiqueta <code>viewport</code> puedes usar otras configuraciones, aunque, en general vas a querer usar la línea anterior.</p>
+
+<ul>
+ <li><code>initial-scale</code>: Establece el zoom inicial de la página, que establecemos en 1.</li>
+ <li><code>height</code>: Establece una altura específica para la ventana gráfica.</li>
+ <li><code>minimum-scale</code>: Establece el nivel mínimo de zoom.</li>
+ <li><code>maximum-scale</code>: Establece el nivel máximo de zoom.</li>
+ <li><code>user-scalable</code>: Impide el zoom si se establece en <code>no</code>.</li>
+</ul>
+
+<p>Deberías evitar el uso de <code>minimum-scale</code> y <code>maximum-scale</code>, y en particular establecer <code>user-scalable</code> en <code>no</code>. Hay que permitir a los usuarios hacer zoom tanto o tan poco como lo necesiten; evitarlo provoca problemas de accesibilidad.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Hay una @regla CSS establecida para reemplazar la metaetiqueta <code>viewport</code>: <a href="/en-US/docs/Web/CSS/@viewport">@viewport</a>. Sin embargo, tiene poca compatibilidad con los navegadores. Se implementó en Internet Explorer y Edge, pero una vez que se lance el navegador Edge basado en Chromium, dejará de formar parte del navegador Edge.</p>
+</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El diseño responsivo se refiere a un diseño página de un sitio web o una aplicación que responde al entorno en el que se visualiza. Abarca una serie de características y técnicas de CSS y HTML, y ahora es esencialmente el modo como construimos los sitios web de forma predeterminada. Piensa en los sitios web que visitas con tu dispositivo móvil; probablemente sea inusual encontrar un sitio web que tenga la versión de escritorio reducida o en que necesites desplazarse hacia los lados para encontrar las cosas. Esto se debe a que la web se ha movido a este enfoque de diseño responsivo.</p>
+
+<p>Además, lograr diseños responsivos se ha vuelto mucho más fácil con la ayuda de los métodos de diseño que has aprendido en estos artículos. Si eres nuevo en el desarrollo web, hoy tienes muchas más herramientas a tu disposición que en los primeros días del diseño de página responsivo. Por lo tanto, vale la pena verificar la antigüedad de los materiales que consultas. Si bien los artículos históricos continúan siendo útiles, el uso moderno de CSS y HTML facilita mucho la creación de diseños elegantes y útiles, sin importar con qué dispositivo el visitante visita el sitio.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Multiple-column_Layout", "Learn/CSS/CSS_layout/Media_queries", "Learn/CSS/CSS_layout")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">Flujo normal</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Elementos flotantes</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño responsivo</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a medios</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredados</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad de navegadores antiguos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de elementos básicos de compaginación</a></li>
+</ul>
diff --git a/files/es/learn/css/css_layout/soporte_a_navegadores_antiguos/index.html b/files/es/learn/css/css_layout/soporte_a_navegadores_antiguos/index.html
deleted file mode 100644
index 18065a1da5..0000000000
--- a/files/es/learn/css/css_layout/soporte_a_navegadores_antiguos/index.html
+++ /dev/null
@@ -1,237 +0,0 @@
----
-title: Soporte a navegadores antiguos
-slug: Learn/CSS/CSS_layout/Soporte_a_navegadores_antiguos
-translation_of: Learn/CSS/CSS_layout/Supporting_Older_Browsers
----
-<div>{{LearnSidebar}}</div>
-
-<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Legacy_Layout_methods", "Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension", "Learn/CSS/CSS_layout")}}</p>
-
-<p class="summary">En este módulo recomendamos utilizar Flexbox y Grid como las herramientas principales para tus diseños. Sin embargo, habrá visitantes a tu sitio web que usen navegadores antiguos o navegadores que no admiten los métodos que has utilizado. Este siempre será el caso en la red: a medida que se desarrollan funciones nuevas, los diferentes navegadores priorizan cosas diferentes. Este artículo explica cómo usar técnicas web modernas sin perjudicar a los usuarios con tecnologías más antiguas.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender cómo proporcionar compatibilidad para tus diseños en navegadores antiguos que podrían no admitir las funciones que deseas utilizar.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Cuál_es_la_vista_del_navegador_para_tu_sitio">¿Cuál es la vista del navegador para tu sitio?</h2>
-
-<p>Cada sitio web es diferente en términos de público objetivo. Antes de decidir el enfoque a seguir, averigua la cantidad de visitantes que visitan tu sitio que utilizan navegadores antiguos. Esto es sencillo si se trata de un sitio web que simplemente modificas o reemplazas, porque probablemente haya análisis disponibles que te indiquen la tecnología que la gente utiliza. Si el sitio no tiene funciones de análisis o se trata de un sitio nuevo, hay sitios como <a href="http://gs.statcounter.com/">Statcounter</a> que pueden proporcionar estadísticas filtradas por ubicación.</p>
-
-<p>También debes considerar el tipo de dispositivos y la forma en que las personas usan tu sitio; por ejemplo, puedes esperar un número de dispositivos móviles superior al promedio. La accesibilidad y las personas que utilizan tecnología de asistencia siempre deben tenerse en cuenta, pero para algunos sitios pueden ser aspectos aún más críticos. Según experiencia propia, los desarrolladores a menudo se preocupan demasiado por la experiencia de usuario de un 1% de usuarios que usan una versión antigua de Internet Explorer, y no consideran en absoluto el número mucho mayor de usuarios que tiene necesidades de accesibilidad especiales.</p>
-
-<h2 id="¿Qué_compatibilidad_presentan_las_funciones_que_vas_a_usar">¿Qué compatibilidad presentan las funciones que vas a usar?</h2>
-
-<p>Una vez conozcas qué tipo de navegadores utiliza la gente que accede a tu sitio, puedes evaluar cualquier tecnología que desees utilizar según su compatibilidad y con qué facilidad es posible proporcionar una alternativa a los visitantes que no disponen de esa tecnología. Tratamos de facilitarte esta experiencia proporcionando información de compatibilidad de los navegadores en cada una de las páginas que detallan una propiedad CSS. Por ejemplo, echa un vistazo a la página de {{cssxref ("grid-template-columns")}}. En la parte inferior de esta página hay una tabla que enumera los navegadores principales, junto con la versión en la que comenzaron a admitir esta propiedad.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/16047/browser-table.png" style="height: 1178px; width: 2102px;"></p>
-
-<p>Otra forma popular de averiguar la compatibilidad de una característica es el sitio web <a href="https://caniuse.com/">Can I Use</a>. Este sitio enumera la mayoría de las características de la Plataforma Web con información sobre el estado de compatibilidad de tu navegador. Puedes ver las estadísticas de uso por ubicación, cosa que resulta útil si trabajas en un sitio cuyos usuarios son de un territorio particular. Incluso puedes vincular tu cuenta de Google Analytics para obtener un análisis basado en tus datos de usuario.</p>
-
-<p>Conocer las tecnologías de tus usuarios y las compatibilidades de las funciones que tal vez quieras usar te proporcionan una buena base para tomar todas tus decisiones y saber cuál es la mejor manera de dar compatibilidad a todos tus usuarios.</p>
-
-<h2 id="Compatibilidad_no_significa_«verse_igual»">Compatibilidad no significa «verse igual»</h2>
-
-<p>Es posible que un sitio web no tenga el mismo aspecto en todos los navegadores, porque algunos de tus usuarios lo verán en un teléfono y otros en el ordenador. Del mismo modo, algunos de tus usuarios tendrán una versión antigua del navegador y otros el navegador más reciente. Es posible que algunos de tus usuarios estén escuchando el contenido leído por un lector de pantalla, o hayan ampliado la página para poderla leer. Dar compatibilidad a todos significa servir una versión de tus contenidos diseñada estratégicamente para que se vea genial con los navegadores modernos, pero aún sea utilizable en un nivel básico para los usuarios con navegadores más antiguos.</p>
-
-<p>Un nivel básico de compatibilidad proviene de estructurar bien tus contenidos para que el flujo normal de tu página tenga sentido. Un usuario con un teléfono con funciones muy limitadas puede que no obtenga buena parte de tu CSS, pero el contenido fluirá de una manera que la lectura resulte fácil. Por lo tanto, un documento HTML bien estructurado siempre debe ser tu punto de partida. <em>¿Tu contenido tiene sentido si eliminas tu hoja de estilo?</em></p>
-
-<p>Una opción es dejar esta vista simple del sitio como alternativa para las personas que utilizan navegadores muy antiguos o limitados. Si la cantidad de personas que visitan el sitio con estos navegadores es pequeña, quizá no tenga sentido comercial dedicar tiempo a tratar de proporcionarles una experiencia similar a la de las personas que utilizan navegadores modernos. Sería mejor dedicar el tiempo a cosas que proporcionen accesibilidad al sitio, y servir así a muchos más usuarios. Hay un punto medio entre una página HTML simple y todos esos recursos, y CSS realmente ha logrado que proporcionar estas soluciones alternativas resulte bastante sencillo.</p>
-
-<h2 id="Crear_soluciones_alternativas_en_CSS">Crear soluciones alternativas en CSS</h2>
-
-<p>Las especificaciones CSS contienen información que explica qué hace el navegador cuando se aplican dos métodos de diseño al mismo elemento. Esto significa que hay una definición de lo que sucede si un elemento flotante, por ejemplo, también es un elemento Grid que usa diseño de cuadrícula CSS. Combina esta información con el conocimiento de que los navegadores ignoran el CSS que no entienden, y tienes una manera de crear diseños simples utilizando las <a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">técnicas heredadas</a> que ya hemos expuesto, que luego se sobrescriben con tu diseño de cuadrícula en los navegadores modernos que lo entienden.</p>
-
-<p>En el ejemplo siguiente hemos especificado tres elementos de flotación <code>&lt;div&gt;</code> para que se muestren en una fila. Cualquier navegador que no sea compatible con el método de compaginación <a href="/es/docs/Learn/CSS/CSS_layout/Grids">CSS Grid</a> verá la hilera de cajas como un diseño con el método de flotación. Un elemento de flotación que se convierte en un elemento de cuadrícula pierde el comportamiento de flotación, lo que significa que al convertir el contenedor en un contenedor de cuadrícula, los elementos de flotación se convierten en elementos de cuadrícula. Si el navegador admite el diseño de cuadrícula, muestra la vista de cuadrícula; si no, ignora las propiedades relacionadas con el diseño de cuadrícula y utiliza el diseño de flotación.</p>
-
-<div id="Example1">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  background-color: rgb(79,185,227);
-  padding: 10px;
-  max-width: 400px;
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-}
-
-.item {
-  float: left;
-  border-radius: 5px;
-  background-color: rgb(207,232,220);
-  padding: 1em;
-}
-</pre>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="item"&gt;Artículo uno&lt;/div&gt;
-  &lt;div class="item"&gt;Artículo dos&lt;/div&gt;
-  &lt;div class="item"&gt;Artículo tres&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p>{{ EmbedLiveSample('Example1', '100%', '200') }}</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: La propiedad {{cssxref ("clear")}} tampoco tiene efecto una vez que el elemento al que se le aplica se convierte en un elemento de cuadrícula, por lo que podrías tener una compaginación con un pie <code>clear</code>, que luego pase a ser un elemento de compaginación en cuadrícula.</p>
-</div>
-
-<h3 id="Métodos_de_soluciones_alternativas">Métodos de soluciones alternativas</h3>
-
-<p>Numerosos métodos de compaginación se pueden usar de manera similar a este ejemplo con comportamiento de flotación. Puedes elegir el que tenga más sentido para el patrón de compaginación que necesitas crear.</p>
-
-<dl>
- <dt><strong><code>float</code></strong> y <strong><code>clear</code></strong></dt>
- <dd>Como se muestra arriba, las propiedades <em>float</em> o <em>clear</em> dejan de afectar a la compaginación si los elementos afectados por estas propiedades pasan a ser de tipo flexible o de cuadrícula.</dd>
- <dt>display: inline-block;</dt>
- <dd>Este método se puede utilizar para crear compaginaciones en columnas; si un elemento tiene establecido un comportamiento <code>display: inline-block</code> pero se convierte a elemento con compaginación de tipo flexible o de cuadrícula, el comportamiento <code>inline-block</code> se ignora.</dd>
- <dt>display: table;</dt>
- <dd>El método de creación de tablas CSS que se describe en la <a href="/es/docs/Learn/CSS/CSS_layout/Introducción">introducción</a> de estos artículos puede utilizarse como opción alternativa. Los elementos que tienen diseños de tabla CSS pierden este comportamiento si se convierten en elementos con comportamiento flexible o de cuadrícula. Es importante destacar que no se crearán las cajas sin nombre que fueron creadas para arreglar la estructura de tabla.</dd>
- <dt>Compaginación en columnas</dt>
- <dd>Para ciertos tipos de compaginación puedes usar <a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">multi-col</a> como opción alternativa; si tu contenedor tiene alguna propiedad <code>column-*</code> definida y se convierte en un contenedor con comportamiento de cuadrícula, se anula el comportamiento en columnas.</dd>
- <dt>Flexbox como opción alternativa a la cuadrícula</dt>
- <dd><a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a> tiene una compatibilidad mayor con los navegadores que Grid porque es compatible con Internet Explorer 10 y 11, aunque te recomendamos que consultes la información que encontrarás más adelante en este artículo sobre la compatibilidad bastante irregular y confusa de Flexbox en navegadores más antiguos. Si conviertes un contenedor flexible en un contenedor de cuadrícula, se ignorará cualquier propiedad <code>flex</code> aplicada a los elementos secundarios.</dd>
-</dl>
-
-<p>Observa que si usas el CSS de esta manera puedes proporcionar una experiencia de usuario decente para ajustar muchas compaginaciones en navegadores antiguos. Añadimos una compaginación más simple basada en técnicas antiguas y con buena compatibilidad, y luego usamos el CSS más nuevo para crear la compaginación que va a ver más del 90% de tu público. Sin embargo, hay casos en los que el código alternativo va a tener que incluir algo que también van a interpretar los navegadores nuevos. Un buen ejemplo de esto es si queremos añadir anchos en porcentaje a nuestros elementos de flotación para que el aspecto de las columnas reproduzca mejor la visualización en cuadrícula, expandiendo para llenar el contenedor.</p>
-
-<p>En la compaginación de flotación, el porcentaje se calcula con respecto al contenedor: 33,333% es un tercio del ancho del contenedor. Sin embargo, en el método Grid ese 33,333% se calcula con respecto al área de la cuadrícula en la que el elemento está ubicado, por lo que en realidad se convierte en un tercio del tamaño que queremos una vez que se introduce la compaginación en cuadrícula.</p>
-
-<div id="Example2">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  background-color: rgb(79,185,227);
-  padding: 10px;
-  max-width: 400px;
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-}
-
-.item {
-  float: left;
-  border-radius: 5px;
-  background-color: rgb(207,232,220);
-  padding: 1em;
-  width: 33.333%;
-}
-</pre>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="item"&gt;Artículo uno&lt;/div&gt;
-  &lt;div class="item"&gt;Artículo dos&lt;/div&gt;
-  &lt;div class="item"&gt;Artículo tres&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p>{{ EmbedLiveSample('Example2', '100%', '200') }}</p>
-</div>
-
-<p>Para tratar este problema, necesitamos tener un modo de detectar si Grid es compatible y, por lo tanto, si anulará el ancho. El CSS tiene una solución.</p>
-
-<h2 id="Consultar_las_propiedades">Consultar las propiedades</h2>
-
-<p>Consultar las propiedades te permite comprobar si un navegador admite alguna característica CSS en particular. Esto significa que puedes escribir algunos CSS para navegadores que no admitan una propiedad determinada y luego verificar si el navegador es compatible, y añadir tu elegante diseño de ser así.</p>
-
-<p>Si añadimos al ejemplo anterior una consulta de las propiedades, podemos usarla para volver a establecer a <code>auto</code> los anchos de nuestros elementos, si sabemos que hay compatibilidad para la compaginación en cuadrícula.</p>
-
-<div id="Example3">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  background-color: rgb(79,185,227);
-  padding: 10px;
-  max-width: 400px;
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-}
-
-.item {
-  float: left;
-  border-radius: 5px;
-  background-color: rgb(207,232,220);
-  padding: 1em;
-  width: 33.333%;
-}
-
-@supports (display: grid) {
-  .item {
-      width: auto;
-  }
-}
-</pre>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="item"&gt;Elemento uno&lt;/div&gt;
-  &lt;div class="item"&gt;Elemento dos&lt;/div&gt;
-  &lt;div class="item"&gt;Elemento tres&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p>{{ EmbedLiveSample('Example3', '100%', '200') }}</p>
-</div>
-
-<p>La compatibilidad para la consulta de propiedades es muy buena en todos los navegadores modernos, pero debes tener en cuenta que son los navegadores que no admiten CSS Grid los que tampoco admiten la consulta de propiedades. Esto significa que para esos navegadores funcionará un enfoque como el que acabamos de detallar. Lo que hacemos es escribir primero nuestro CSS anterior sin hacer ninguna consulta de propiedades. Los navegadores que no admiten Grid y que no admiten la consulta de propiedades utilizan esa información de diseño que pueden entender e ignoran por completo todo lo demás. Los navegadores que admiten la consulta de propiedades también admiten CSS Grid y, por lo tanto, ejecutan el código de cuadrícula y el código de la consulta de propiedades.</p>
-
-<p>La especificación para la consulta de propiedades también incluye la posibilidad de probar si un navegador no admite una propiedad; esto solo es útil si el navegador admite consultas de propiedades. En el futuro bastará con el enfoque de verificar la falta de compatibilidad, porque los navegadores que no tienen compatibilidad para la consulta de propiedades desaparecen. Por ahora, sin embargo, utiliza el enfoque de usar el CSS anterior y luego sobrescribirlo para obtener la mejor compatibilidad.</p>
-
-<h2 id="Versiones_anteriores_de_Flexbox">Versiones anteriores de Flexbox</h2>
-
-<p>En versiones anteriores de navegadores, puedes encontrar versiones anteriores de la especificación Flexbox. En el momento de escribir esto se trata principalmente de un problema con Internet Explorer 10, que usa el prefijo <code>-ms-</code> para Flexbox. Esto también significa que algunos artículos y tutoriales están obsoletos; <a href="https://css-tricks.com/old-flexbox-and-new-flexbox/">esta guía útil</a> te ayuda a verificarlo y también puede ayudarte si necesitas compatibilidad Flexbox en navegadores muy antiguos.</p>
-
-<h2 id="La_versión_prefijada_de_Grid_de_Internet_Explorer_10_y_11">La versión prefijada de Grid de Internet Explorer 10 y 11</h2>
-
-<p>La especificación CSS Grid se prototipó inicialmente en Internet Explorer 10; esto significa que si bien IE10 e IE11 no tienen compatibilidad de cuadrícula <em>moderna</em>, sí tienen una versión de compaginación en cuadrícula, que es muy útil, aunque diferente de la especificación moderna que documentamos en este sitio. Las implementaciones de IE10 y 11 tienen el prefijo <code>-ms-</code>, lo que significa que puedes usarlo para estos navegadores y los navegadores que no sean de Microsoft lo ignorarán. Sin embargo, Edge todavía comprende la sintaxis anterior, así que ten cuidado de que todo se sobrescriba de forma segura en tu cuadrícula de CSS moderna.</p>
-
-<p>La guía de <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">Mejora progresiva en la compaginación en cuadrícula</a> puede ayudarte a comprender la versión de la cuadrícula de Internet Explorer, y hemos incluido algunos enlaces útiles adicionales al final de este artículo. Sin embargo, a menos que tengas una gran cantidad de visitantes con versiones anteriores de Internet Explorer, puede que te resulte mejor centrarte en crear una reserva que funcione para todos los navegadores no compatibles.</p>
-
-<h2 id="Pruebas_con_navegadores_antiguos">Pruebas con navegadores antiguos</h2>
-
-<p>Dado que la mayoría de los navegadores ya son compatibles con Flexbox y Grid, puede resultar en efecto difícil hacer pruebas con navegadores más antiguos. Una forma es utilizar una herramienta de prueba en línea como Sauce Labs, como se detalla en el módulo de <a href="/es/docs/Learn/Herramientas_y_pruebas/Cross_browser_testing">comprobación de compatibilidad entre navegadores</a>.</p>
-
-<p>También puedes descargar e instalar máquinas virtuales y ejecutar versiones anteriores de navegadores en un entorno de tu propio ordenador. Tener acceso a versiones anteriores de Internet Explorer es particularmente útil, y para ese propósito, Microsoft ha puesto a disposición de los usuarios una <a href="https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/">variedad de máquinas virtuales de descarga gratuita</a>. Están disponibles para los sistemas operativos Mac, Windows y Linux, por lo que resultan una manera excelente de hacer pruebas con los navegadores Windows antiguos y modernos, incluso si no utilizas una computadora con sistema Windows.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Ahora tienes el conocimiento para usar con confianza técnicas como Grid y Flexbox, crear soluciones alternativas para navegadores más antiguos y utilizar cualquier técnica nueva que pueda surgir en el futuro.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://hacks.mozilla.org/2016/08/using-feature-queries-in-css/">Uso de consultas de propiedades en CSS</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexbox">Compatibilidad con versiones anteriores de Flexbox</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">Compaginación en cuadrícula CSS y mejora progresiva</a></li>
- <li><a href="https://www.smashingmagazine.com/2017/11/css-grid-supporting-browsers-without-grid/">Uso de CSS Grid: Compatibilidad con navegadores sin comportamiento de cuadrícula</a></li>
- <li><a href="https://24ways.org/2012/css3-grid-layout/">Un tutorial que usa las versiones IE10 y 11 de Grid</a></li>
- <li><a href="https://rachelandrew.co.uk/archives/2016/11/26/should-i-try-to-use-the-ie-implementation-of-css-grid-layout/">¿Debo tratar de usar la implementación IE10 de Grid Layout?</a></li>
- <li><a href="https://24ways.org/2017/cascading-web-design/">Diseño web en cascada con consulta de propiedades</a></li>
- <li><a href="https://gridbyexample.com/learn/2016/12/24/learning-grid-day24/">Uso de las consultas de propiedades (vídeo)</a></li>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Legacy_Layout_methods", "Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension", "Learn/CSS/CSS_layout")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">Flujo normal</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Flotación</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño adaptativo</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a medios</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredados</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad con navegadores antiguos</a></li>
- <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de elementos básicos de compaginación</a></li>
-</ul>
diff --git a/files/es/learn/css/css_layout/supporting_older_browsers/index.html b/files/es/learn/css/css_layout/supporting_older_browsers/index.html
new file mode 100644
index 0000000000..d709a628d5
--- /dev/null
+++ b/files/es/learn/css/css_layout/supporting_older_browsers/index.html
@@ -0,0 +1,238 @@
+---
+title: Soporte a navegadores antiguos
+slug: Learn/CSS/CSS_layout/Supporting_Older_Browsers
+translation_of: Learn/CSS/CSS_layout/Supporting_Older_Browsers
+original_slug: Learn/CSS/CSS_layout/Soporte_a_navegadores_antiguos
+---
+<div>{{LearnSidebar}}</div>
+
+<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Legacy_Layout_methods", "Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension", "Learn/CSS/CSS_layout")}}</p>
+
+<p class="summary">En este módulo recomendamos utilizar Flexbox y Grid como las herramientas principales para tus diseños. Sin embargo, habrá visitantes a tu sitio web que usen navegadores antiguos o navegadores que no admiten los métodos que has utilizado. Este siempre será el caso en la red: a medida que se desarrollan funciones nuevas, los diferentes navegadores priorizan cosas diferentes. Este artículo explica cómo usar técnicas web modernas sin perjudicar a los usuarios con tecnologías más antiguas.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y nociones de cómo funciona el CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender cómo proporcionar compatibilidad para tus diseños en navegadores antiguos que podrían no admitir las funciones que deseas utilizar.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Cuál_es_la_vista_del_navegador_para_tu_sitio">¿Cuál es la vista del navegador para tu sitio?</h2>
+
+<p>Cada sitio web es diferente en términos de público objetivo. Antes de decidir el enfoque a seguir, averigua la cantidad de visitantes que visitan tu sitio que utilizan navegadores antiguos. Esto es sencillo si se trata de un sitio web que simplemente modificas o reemplazas, porque probablemente haya análisis disponibles que te indiquen la tecnología que la gente utiliza. Si el sitio no tiene funciones de análisis o se trata de un sitio nuevo, hay sitios como <a href="http://gs.statcounter.com/">Statcounter</a> que pueden proporcionar estadísticas filtradas por ubicación.</p>
+
+<p>También debes considerar el tipo de dispositivos y la forma en que las personas usan tu sitio; por ejemplo, puedes esperar un número de dispositivos móviles superior al promedio. La accesibilidad y las personas que utilizan tecnología de asistencia siempre deben tenerse en cuenta, pero para algunos sitios pueden ser aspectos aún más críticos. Según experiencia propia, los desarrolladores a menudo se preocupan demasiado por la experiencia de usuario de un 1% de usuarios que usan una versión antigua de Internet Explorer, y no consideran en absoluto el número mucho mayor de usuarios que tiene necesidades de accesibilidad especiales.</p>
+
+<h2 id="¿Qué_compatibilidad_presentan_las_funciones_que_vas_a_usar">¿Qué compatibilidad presentan las funciones que vas a usar?</h2>
+
+<p>Una vez conozcas qué tipo de navegadores utiliza la gente que accede a tu sitio, puedes evaluar cualquier tecnología que desees utilizar según su compatibilidad y con qué facilidad es posible proporcionar una alternativa a los visitantes que no disponen de esa tecnología. Tratamos de facilitarte esta experiencia proporcionando información de compatibilidad de los navegadores en cada una de las páginas que detallan una propiedad CSS. Por ejemplo, echa un vistazo a la página de {{cssxref ("grid-template-columns")}}. En la parte inferior de esta página hay una tabla que enumera los navegadores principales, junto con la versión en la que comenzaron a admitir esta propiedad.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16047/browser-table.png" style="height: 1178px; width: 2102px;"></p>
+
+<p>Otra forma popular de averiguar la compatibilidad de una característica es el sitio web <a href="https://caniuse.com/">Can I Use</a>. Este sitio enumera la mayoría de las características de la Plataforma Web con información sobre el estado de compatibilidad de tu navegador. Puedes ver las estadísticas de uso por ubicación, cosa que resulta útil si trabajas en un sitio cuyos usuarios son de un territorio particular. Incluso puedes vincular tu cuenta de Google Analytics para obtener un análisis basado en tus datos de usuario.</p>
+
+<p>Conocer las tecnologías de tus usuarios y las compatibilidades de las funciones que tal vez quieras usar te proporcionan una buena base para tomar todas tus decisiones y saber cuál es la mejor manera de dar compatibilidad a todos tus usuarios.</p>
+
+<h2 id="Compatibilidad_no_significa_«verse_igual»">Compatibilidad no significa «verse igual»</h2>
+
+<p>Es posible que un sitio web no tenga el mismo aspecto en todos los navegadores, porque algunos de tus usuarios lo verán en un teléfono y otros en el ordenador. Del mismo modo, algunos de tus usuarios tendrán una versión antigua del navegador y otros el navegador más reciente. Es posible que algunos de tus usuarios estén escuchando el contenido leído por un lector de pantalla, o hayan ampliado la página para poderla leer. Dar compatibilidad a todos significa servir una versión de tus contenidos diseñada estratégicamente para que se vea genial con los navegadores modernos, pero aún sea utilizable en un nivel básico para los usuarios con navegadores más antiguos.</p>
+
+<p>Un nivel básico de compatibilidad proviene de estructurar bien tus contenidos para que el flujo normal de tu página tenga sentido. Un usuario con un teléfono con funciones muy limitadas puede que no obtenga buena parte de tu CSS, pero el contenido fluirá de una manera que la lectura resulte fácil. Por lo tanto, un documento HTML bien estructurado siempre debe ser tu punto de partida. <em>¿Tu contenido tiene sentido si eliminas tu hoja de estilo?</em></p>
+
+<p>Una opción es dejar esta vista simple del sitio como alternativa para las personas que utilizan navegadores muy antiguos o limitados. Si la cantidad de personas que visitan el sitio con estos navegadores es pequeña, quizá no tenga sentido comercial dedicar tiempo a tratar de proporcionarles una experiencia similar a la de las personas que utilizan navegadores modernos. Sería mejor dedicar el tiempo a cosas que proporcionen accesibilidad al sitio, y servir así a muchos más usuarios. Hay un punto medio entre una página HTML simple y todos esos recursos, y CSS realmente ha logrado que proporcionar estas soluciones alternativas resulte bastante sencillo.</p>
+
+<h2 id="Crear_soluciones_alternativas_en_CSS">Crear soluciones alternativas en CSS</h2>
+
+<p>Las especificaciones CSS contienen información que explica qué hace el navegador cuando se aplican dos métodos de diseño al mismo elemento. Esto significa que hay una definición de lo que sucede si un elemento flotante, por ejemplo, también es un elemento Grid que usa diseño de cuadrícula CSS. Combina esta información con el conocimiento de que los navegadores ignoran el CSS que no entienden, y tienes una manera de crear diseños simples utilizando las <a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">técnicas heredadas</a> que ya hemos expuesto, que luego se sobrescriben con tu diseño de cuadrícula en los navegadores modernos que lo entienden.</p>
+
+<p>En el ejemplo siguiente hemos especificado tres elementos de flotación <code>&lt;div&gt;</code> para que se muestren en una fila. Cualquier navegador que no sea compatible con el método de compaginación <a href="/es/docs/Learn/CSS/CSS_layout/Grids">CSS Grid</a> verá la hilera de cajas como un diseño con el método de flotación. Un elemento de flotación que se convierte en un elemento de cuadrícula pierde el comportamiento de flotación, lo que significa que al convertir el contenedor en un contenedor de cuadrícula, los elementos de flotación se convierten en elementos de cuadrícula. Si el navegador admite el diseño de cuadrícula, muestra la vista de cuadrícula; si no, ignora las propiedades relacionadas con el diseño de cuadrícula y utiliza el diseño de flotación.</p>
+
+<div id="Example1">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  background-color: rgb(79,185,227);
+  padding: 10px;
+  max-width: 400px;
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+}
+
+.item {
+  float: left;
+  border-radius: 5px;
+  background-color: rgb(207,232,220);
+  padding: 1em;
+}
+</pre>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="item"&gt;Artículo uno&lt;/div&gt;
+  &lt;div class="item"&gt;Artículo dos&lt;/div&gt;
+  &lt;div class="item"&gt;Artículo tres&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p>{{ EmbedLiveSample('Example1', '100%', '200') }}</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: La propiedad {{cssxref ("clear")}} tampoco tiene efecto una vez que el elemento al que se le aplica se convierte en un elemento de cuadrícula, por lo que podrías tener una compaginación con un pie <code>clear</code>, que luego pase a ser un elemento de compaginación en cuadrícula.</p>
+</div>
+
+<h3 id="Métodos_de_soluciones_alternativas">Métodos de soluciones alternativas</h3>
+
+<p>Numerosos métodos de compaginación se pueden usar de manera similar a este ejemplo con comportamiento de flotación. Puedes elegir el que tenga más sentido para el patrón de compaginación que necesitas crear.</p>
+
+<dl>
+ <dt><strong><code>float</code></strong> y <strong><code>clear</code></strong></dt>
+ <dd>Como se muestra arriba, las propiedades <em>float</em> o <em>clear</em> dejan de afectar a la compaginación si los elementos afectados por estas propiedades pasan a ser de tipo flexible o de cuadrícula.</dd>
+ <dt>display: inline-block;</dt>
+ <dd>Este método se puede utilizar para crear compaginaciones en columnas; si un elemento tiene establecido un comportamiento <code>display: inline-block</code> pero se convierte a elemento con compaginación de tipo flexible o de cuadrícula, el comportamiento <code>inline-block</code> se ignora.</dd>
+ <dt>display: table;</dt>
+ <dd>El método de creación de tablas CSS que se describe en la <a href="/es/docs/Learn/CSS/CSS_layout/Introducción">introducción</a> de estos artículos puede utilizarse como opción alternativa. Los elementos que tienen diseños de tabla CSS pierden este comportamiento si se convierten en elementos con comportamiento flexible o de cuadrícula. Es importante destacar que no se crearán las cajas sin nombre que fueron creadas para arreglar la estructura de tabla.</dd>
+ <dt>Compaginación en columnas</dt>
+ <dd>Para ciertos tipos de compaginación puedes usar <a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">multi-col</a> como opción alternativa; si tu contenedor tiene alguna propiedad <code>column-*</code> definida y se convierte en un contenedor con comportamiento de cuadrícula, se anula el comportamiento en columnas.</dd>
+ <dt>Flexbox como opción alternativa a la cuadrícula</dt>
+ <dd><a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a> tiene una compatibilidad mayor con los navegadores que Grid porque es compatible con Internet Explorer 10 y 11, aunque te recomendamos que consultes la información que encontrarás más adelante en este artículo sobre la compatibilidad bastante irregular y confusa de Flexbox en navegadores más antiguos. Si conviertes un contenedor flexible en un contenedor de cuadrícula, se ignorará cualquier propiedad <code>flex</code> aplicada a los elementos secundarios.</dd>
+</dl>
+
+<p>Observa que si usas el CSS de esta manera puedes proporcionar una experiencia de usuario decente para ajustar muchas compaginaciones en navegadores antiguos. Añadimos una compaginación más simple basada en técnicas antiguas y con buena compatibilidad, y luego usamos el CSS más nuevo para crear la compaginación que va a ver más del 90% de tu público. Sin embargo, hay casos en los que el código alternativo va a tener que incluir algo que también van a interpretar los navegadores nuevos. Un buen ejemplo de esto es si queremos añadir anchos en porcentaje a nuestros elementos de flotación para que el aspecto de las columnas reproduzca mejor la visualización en cuadrícula, expandiendo para llenar el contenedor.</p>
+
+<p>En la compaginación de flotación, el porcentaje se calcula con respecto al contenedor: 33,333% es un tercio del ancho del contenedor. Sin embargo, en el método Grid ese 33,333% se calcula con respecto al área de la cuadrícula en la que el elemento está ubicado, por lo que en realidad se convierte en un tercio del tamaño que queremos una vez que se introduce la compaginación en cuadrícula.</p>
+
+<div id="Example2">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  background-color: rgb(79,185,227);
+  padding: 10px;
+  max-width: 400px;
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+}
+
+.item {
+  float: left;
+  border-radius: 5px;
+  background-color: rgb(207,232,220);
+  padding: 1em;
+  width: 33.333%;
+}
+</pre>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="item"&gt;Artículo uno&lt;/div&gt;
+  &lt;div class="item"&gt;Artículo dos&lt;/div&gt;
+  &lt;div class="item"&gt;Artículo tres&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p>{{ EmbedLiveSample('Example2', '100%', '200') }}</p>
+</div>
+
+<p>Para tratar este problema, necesitamos tener un modo de detectar si Grid es compatible y, por lo tanto, si anulará el ancho. El CSS tiene una solución.</p>
+
+<h2 id="Consultar_las_propiedades">Consultar las propiedades</h2>
+
+<p>Consultar las propiedades te permite comprobar si un navegador admite alguna característica CSS en particular. Esto significa que puedes escribir algunos CSS para navegadores que no admitan una propiedad determinada y luego verificar si el navegador es compatible, y añadir tu elegante diseño de ser así.</p>
+
+<p>Si añadimos al ejemplo anterior una consulta de las propiedades, podemos usarla para volver a establecer a <code>auto</code> los anchos de nuestros elementos, si sabemos que hay compatibilidad para la compaginación en cuadrícula.</p>
+
+<div id="Example3">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  background-color: rgb(79,185,227);
+  padding: 10px;
+  max-width: 400px;
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+}
+
+.item {
+  float: left;
+  border-radius: 5px;
+  background-color: rgb(207,232,220);
+  padding: 1em;
+  width: 33.333%;
+}
+
+@supports (display: grid) {
+  .item {
+      width: auto;
+  }
+}
+</pre>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="item"&gt;Elemento uno&lt;/div&gt;
+  &lt;div class="item"&gt;Elemento dos&lt;/div&gt;
+  &lt;div class="item"&gt;Elemento tres&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p>{{ EmbedLiveSample('Example3', '100%', '200') }}</p>
+</div>
+
+<p>La compatibilidad para la consulta de propiedades es muy buena en todos los navegadores modernos, pero debes tener en cuenta que son los navegadores que no admiten CSS Grid los que tampoco admiten la consulta de propiedades. Esto significa que para esos navegadores funcionará un enfoque como el que acabamos de detallar. Lo que hacemos es escribir primero nuestro CSS anterior sin hacer ninguna consulta de propiedades. Los navegadores que no admiten Grid y que no admiten la consulta de propiedades utilizan esa información de diseño que pueden entender e ignoran por completo todo lo demás. Los navegadores que admiten la consulta de propiedades también admiten CSS Grid y, por lo tanto, ejecutan el código de cuadrícula y el código de la consulta de propiedades.</p>
+
+<p>La especificación para la consulta de propiedades también incluye la posibilidad de probar si un navegador no admite una propiedad; esto solo es útil si el navegador admite consultas de propiedades. En el futuro bastará con el enfoque de verificar la falta de compatibilidad, porque los navegadores que no tienen compatibilidad para la consulta de propiedades desaparecen. Por ahora, sin embargo, utiliza el enfoque de usar el CSS anterior y luego sobrescribirlo para obtener la mejor compatibilidad.</p>
+
+<h2 id="Versiones_anteriores_de_Flexbox">Versiones anteriores de Flexbox</h2>
+
+<p>En versiones anteriores de navegadores, puedes encontrar versiones anteriores de la especificación Flexbox. En el momento de escribir esto se trata principalmente de un problema con Internet Explorer 10, que usa el prefijo <code>-ms-</code> para Flexbox. Esto también significa que algunos artículos y tutoriales están obsoletos; <a href="https://css-tricks.com/old-flexbox-and-new-flexbox/">esta guía útil</a> te ayuda a verificarlo y también puede ayudarte si necesitas compatibilidad Flexbox en navegadores muy antiguos.</p>
+
+<h2 id="La_versión_prefijada_de_Grid_de_Internet_Explorer_10_y_11">La versión prefijada de Grid de Internet Explorer 10 y 11</h2>
+
+<p>La especificación CSS Grid se prototipó inicialmente en Internet Explorer 10; esto significa que si bien IE10 e IE11 no tienen compatibilidad de cuadrícula <em>moderna</em>, sí tienen una versión de compaginación en cuadrícula, que es muy útil, aunque diferente de la especificación moderna que documentamos en este sitio. Las implementaciones de IE10 y 11 tienen el prefijo <code>-ms-</code>, lo que significa que puedes usarlo para estos navegadores y los navegadores que no sean de Microsoft lo ignorarán. Sin embargo, Edge todavía comprende la sintaxis anterior, así que ten cuidado de que todo se sobrescriba de forma segura en tu cuadrícula de CSS moderna.</p>
+
+<p>La guía de <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">Mejora progresiva en la compaginación en cuadrícula</a> puede ayudarte a comprender la versión de la cuadrícula de Internet Explorer, y hemos incluido algunos enlaces útiles adicionales al final de este artículo. Sin embargo, a menos que tengas una gran cantidad de visitantes con versiones anteriores de Internet Explorer, puede que te resulte mejor centrarte en crear una reserva que funcione para todos los navegadores no compatibles.</p>
+
+<h2 id="Pruebas_con_navegadores_antiguos">Pruebas con navegadores antiguos</h2>
+
+<p>Dado que la mayoría de los navegadores ya son compatibles con Flexbox y Grid, puede resultar en efecto difícil hacer pruebas con navegadores más antiguos. Una forma es utilizar una herramienta de prueba en línea como Sauce Labs, como se detalla en el módulo de <a href="/es/docs/Learn/Herramientas_y_pruebas/Cross_browser_testing">comprobación de compatibilidad entre navegadores</a>.</p>
+
+<p>También puedes descargar e instalar máquinas virtuales y ejecutar versiones anteriores de navegadores en un entorno de tu propio ordenador. Tener acceso a versiones anteriores de Internet Explorer es particularmente útil, y para ese propósito, Microsoft ha puesto a disposición de los usuarios una <a href="https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/">variedad de máquinas virtuales de descarga gratuita</a>. Están disponibles para los sistemas operativos Mac, Windows y Linux, por lo que resultan una manera excelente de hacer pruebas con los navegadores Windows antiguos y modernos, incluso si no utilizas una computadora con sistema Windows.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Ahora tienes el conocimiento para usar con confianza técnicas como Grid y Flexbox, crear soluciones alternativas para navegadores más antiguos y utilizar cualquier técnica nueva que pueda surgir en el futuro.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://hacks.mozilla.org/2016/08/using-feature-queries-in-css/">Uso de consultas de propiedades en CSS</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexbox">Compatibilidad con versiones anteriores de Flexbox</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">Compaginación en cuadrícula CSS y mejora progresiva</a></li>
+ <li><a href="https://www.smashingmagazine.com/2017/11/css-grid-supporting-browsers-without-grid/">Uso de CSS Grid: Compatibilidad con navegadores sin comportamiento de cuadrícula</a></li>
+ <li><a href="https://24ways.org/2012/css3-grid-layout/">Un tutorial que usa las versiones IE10 y 11 de Grid</a></li>
+ <li><a href="https://rachelandrew.co.uk/archives/2016/11/26/should-i-try-to-use-the-ie-implementation-of-css-grid-layout/">¿Debo tratar de usar la implementación IE10 de Grid Layout?</a></li>
+ <li><a href="https://24ways.org/2017/cascading-web-design/">Diseño web en cascada con consulta de propiedades</a></li>
+ <li><a href="https://gridbyexample.com/learn/2016/12/24/learning-grid-day24/">Uso de las consultas de propiedades (vídeo)</a></li>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/CSS/CSS_layout/Legacy_Layout_methods", "Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension", "Learn/CSS/CSS_layout")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Introduction">Introducción al diseño CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Normal_Flow">Flujo normal</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Grids">Cuadrícula</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Floats">Flotación</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Positioning">Posicionamiento</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Multiple-column_Layout">Diseño en columnas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design">Diseño adaptativo</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Media_queries">Guía para principiantes sobre consultas a medios</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Legacy_Layout_Methods">Métodos de compaginación heredados</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Supporting_Older_Browsers">Compatibilidad con navegadores antiguos</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/CSS_layout/Fundamental_Layout_Comprehension">Evaluación del conjunto de elementos básicos de compaginación</a></li>
+</ul>
diff --git a/files/es/learn/css/first_steps/comenzando_css/index.html b/files/es/learn/css/first_steps/comenzando_css/index.html
deleted file mode 100644
index 1da9edb582..0000000000
--- a/files/es/learn/css/first_steps/comenzando_css/index.html
+++ /dev/null
@@ -1,264 +0,0 @@
----
-title: Empezar con CSS
-slug: Learn/CSS/First_steps/Comenzando_CSS
-tags:
-  - Aprender
-  - CSS
-  - Clases
-  - Ejemplo
-  - Elementos
-  - Estado
-  - Principiante
-  - Selectores
-  - Sintaxis
-translation_of: Learn/CSS/First_steps/Getting_started
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/CSS/First_steps/What_is_CSS", "Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps")}}</div>
-
-<p class="summary">En este artículo aplicaremos CSS a un documento HTML sencillo para aprender algunos elementos prácticos sobre este lenguaje.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajo con archivos</a> y conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender los conceptos básicos para vincular un documento CSS a un archivo HTML y dar a un texto un formato sencillo con CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Empezamos_con_algo_de_HTML">Empezamos con algo de HTML</h2>
-
-<p>Nuestro punto de partida es un documento HTML. Puedes copiar el código de abajo si quieres trabajar en tu ordenador. Guarda el siguiente código como <code>index.html</code> en una carpeta de tu equipo.</p>
-
-<pre class="brush: html notranslate">&lt;!doctype html&gt;
-&lt;html lang="es"&gt;
-&lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Empezamos con el CSS&lt;/title&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-
-    &lt;h1&gt;Soy un título de nivel uno&lt;/h1&gt;
-
-    &lt;p&gt;Este es un párrafo de texto. En el texto hay un &lt;span&gt;elemento span&lt;/span&gt;
-y también un &lt;a href="http://example.com"&gt;enlace&lt;/a&gt;.&lt;/p&gt;
-
-    &lt;p&gt;Este es el segundo párrafo. Contiene un elemento &lt;em&gt;destacado&lt;/em&gt;.&lt;/p&gt;
-
-    &lt;ul&gt;
-        &lt;li&gt;Punto uno&lt;/li&gt;
-        &lt;li&gt;Punto dos&lt;/li&gt;
-        &lt;li&gt;Punto &lt;em&gt;tres&lt;/em&gt;&lt;/li&gt;
-    &lt;/ul&gt;
-
-&lt;/body&gt;
-
-&lt;/html&gt;
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Si lees esto en un dispositivo o un entorno donde no puedes crear archivos fácilmente, no te preocupes. A continuación hay editores de código en vivo que van a permitirte escribir ejemplos de código en esta misma página.</p>
-</div>
-
-<h2 id="Agregar_CSS_a_un_documento">Agregar CSS a un documento</h2>
-
-<p>Lo primero que se debe hacer es decirle al documento HTML que hay algunas reglas CSS que queremos que use. Hay tres formas diferentes de aplicar CSS a un documento HTML, sin embargo, por ahora, veremos la forma más habitual y útil de hacerlo: vincular el CSS desde el encabezado del documento.</p>
-
-<p>Crea un archivo en la misma carpeta que tu documento HTML y guárdalo como <code>styles.css</code>. La extensión <code>.css</code> muestra que es un archivo CSS.</p>
-
-<p>Para vincular <code>styles.css</code> a <code>index.html</code>, añade la siguiente línea en algún lugar dentro del {{htmlelement ("head")}} del documento HTML:</p>
-
-<pre class="brush: html notranslate">&lt;link rel="stylesheet" href="styles.css"&gt;</pre>
-
-<p>Este elemento {{htmlelement ("link")}} le dice al navegador que hay una hoja de estilo con el atributo <code>rel</code> y la ubicación de esa hoja de estilo como el valor del atributo <code>href</code>. Puedes probar si el CSS funciona añadiendo una regla a <code>styles.css</code>. Usando el editor de código, añade lo siguiente al archivo CSS:</p>
-
-<pre class="brush: css notranslate">h1 {
-  color: red;
-}</pre>
-
-<p>Guarda los archivos HTML y CSS antes de volver a cargar la página en un navegador web. Ahora el título de nivel uno de la parte superior del documento debería ser rojo. Si esto sucede, ¡felicidades!: has aplicado correctamente un poco de CSS a un documento HTML. Si no lo hace, verifica que hayas escrito todo correctamente.</p>
-
-<p>Puedes continuar trabajando en <code>styles.css</code> localmente o usar nuestro editor interactivo para continuar con este tutorial. El editor interactivo actúa como si el CSS del primer panel estuviera vinculado al documento HTML, tal como lo hemos hecho con el documento anterior.</p>
-
-<h2 id="Dar_formato_a_elementos_HTML">Dar formato a elementos HTML</h2>
-
-<p>Al poner nuestro título de encabezado en rojo, ya hemos demostrado que podemos elegir un elemento HTML y darle formato. Hacemos esto con un <em>selector de elementos</em>: un selector que coincide directamente con el nombre de un elemento HTML. Para determinar todos los párrafos del documento, se usa el selector <code>p</code>. Para hacer que todos los párrafos se vean verdes se usa:</p>
-
-<pre class="brush: css notranslate">p {
-  color: green;
-}</pre>
-
-<p>Puedes determinar múltiples selectores a la vez, separándolos con una coma. Si queremos que todos los párrafos y todos los elementos de la lista sean verdes, el código se verá así:</p>
-
-<pre class="brush: css notranslate">p, li {
-    color: green;
-}</pre>
-
-<p>Pruébalo en el editor interactivo que encontrarás a continuación (edita los cuadros de código) o en tu documento CSS.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/started1.html", '100%', 900)}} </p>
-
-<h2 id="Cambiar_el_comportamiento_predeterminado_de_los_elementos">Cambiar el comportamiento predeterminado de los elementos</h2>
-
-<p>Cuando miramos un documento HTML bien marcado, incluso con algo tan simple como nuestro ejemplo, podemos ver que el navegador facilita la legibilidad de este documento HTML al añadir un estilo predeterminado. Los títulos se muestran grandes y en negrita, y la lista tiene viñetas. Esto sucede porque los navegadores tienen hojas de estilo internas que contienen estilos predeterminados, los cuales se aplican a todas las páginas por defecto. Sin ellos, todo el texto se uniría en un grupo y tendríamos que darle formato desde cero. Todos los navegadores modernos muestran el contenido HTML por defecto de la misma manera.</p>
-
-<p>Sin embargo, a menudo querrás algo diferente a la elección que ha hecho el navegador. Esto se puede solucionar con el simple hecho de escoger el elemento HTML que deseas cambiar y utilizar una regla CSS para cambiar su apariencia.  Un buen ejemplo es <code>&lt;ul&gt;</code>, que muestra una lista desordenada. Tiene viñetas y, si decidimos que no las queremos, podemos eliminarlas de este modo:</p>
-
-<pre class="brush: css notranslate">li {
-  list-style-type: none;
-}</pre>
-
-<p>Ahora, intenta añadir esto a tu CSS.</p>
-
-<p>Es muy conveniente consultar en MDN la propiedad <code>list-style-type</code> para ver qué valores admite. Echa un vistazo a la página de <code><a href="/en-US/docs/Web/CSS/list-style-type">list-style-type</a></code> y encontrarás un ejemplo interactivo en la parte superior para probar diferentes valores (todos los permitidos se detallan más abajo en esa misma página).</p>
-
-<p>Al mirar esa página, descubrirás que, además de eliminar las viñetas de la lista, también puedes cambiarlas. Intenta cambiarlas por unas cuadradas utilizando el valor <code>square</code>.</p>
-
-<h2 id="Añadir_una_clase">Añadir una clase</h2>
-
-<p>Hasta ahora, hemos utilizado elementos cuyo nombre se basa en el nombre de elemento que reciben en HTML. Esto funciona siempre que se desee que todos los elementos de ese tipo tengan el mismo aspecto en el documento. La mayoría de las veces no es el caso, por lo que deberás encontrar una manera de seleccionar un subconjunto de los elementos sin que cambien los demás. La forma más común de hacer esto es añadir una clase al elemento HTML y determinarla.</p>
-
-<p>En tu documento HTML, añade al segundo elemento de la lista un <a href="/es/docs/Web/HTML/Atributos_Globales/class">atributo de clase</a>. Debería verse así:</p>
-
-<pre class="brush: html notranslate">&lt;ul&gt;
-  &lt;li&gt;Punto uno&lt;/li&gt;
-  &lt;li <strong>class = "special"</strong>&gt;Punto dos&lt;/li&gt;
-  &lt;li&gt;Punto &lt;em&gt;tres&lt;/em&gt;&lt;/li&gt;
-&lt;/ul&gt;</pre>
-
-<p>En tu CSS, puedes seleccionar una clase <code>special</code> creando un selector que comience con un carácter de punto final. Añade lo siguiente a tu archivo CSS:</p>
-
-<pre class="brush: css notranslate">.special {
-  color: orange;
-  font-weight: bold;
-}</pre>
-
-<p>Guarda y actualiza para ver cuál es el resultado.</p>
-
-<p>Puedes aplicar la clase <code>special</code> a cualquier elemento de la página que desees que tenga el mismo aspecto que este elemento de lista. Por ejemplo, es posible que desees que el <code>&lt;span&gt;</code> del párrafo también sea naranja y en negrita. Intenta añadirle una <code>class</code> <code>special</code>, luego vuelve a cargar la página y observa qué sucede.</p>
-
-<p>A veces verás reglas con un selector que enumera el selector de elementos HTML junto con la clase:</p>
-
-<pre class="brush: css notranslate">li.special {
-  color: orange;
-  font-weight: bold;
-}</pre>
-
-<p>Esta sintaxis significa «determina cualquier elemento <code>li</code> que tenga una clase special». Si hicieras esto, ya no podrías aplicar la clase a un elemento <code>&lt;span&gt;</code> u otro elemento simplemente añadiéndole la clase; tendrías que añadir ese elemento a la lista de selectores:</p>
-
-<pre class="brush: css notranslate">li.special,
-span.special {
-  color: orange;
-  font-weight: bold;
-}</pre>
-
-<p>Como puedes imaginar, algunas clases pueden aplicarse a muchos elementos y no queremos tener que seguir editando el CSS cada vez que algo nuevo necesita adoptar ese estilo. Por lo tanto, a veces es mejor eludir el elemento y simplemente referirse a la clase, a menos que sepas que vas a querer crear algunas reglas especiales para un solo elemento y tal vez quieras asegurarte de que no se apliquen a otros elementos.</p>
-
-<h2 id="Dar_formato_según_la_ubicación_en_un_documento">Dar formato según la ubicación en un documento</h2>
-
-<p>Hay momentos en los que querrás que algo se vea diferente en función de dónde esté en el documento. Hay múltiples selectores que pueden hacerlo, pero por ahora veremos solo un par. En nuestro documento hay dos elementos <code>&lt;em&gt;</code>: uno dentro de un párrafo y el otro dentro de un elemento de la lista. Para seleccionar solo un <code>&lt;em&gt;</code> que esté anidado dentro de un elemento <code>&lt;li&gt;</code>, podemos usar un selector llamado <strong>combinador descendente</strong>, que simplemente toma la forma de un espacio entre otros dos selectores.</p>
-
-<p>Añade la siguiente regla a la hoja de estilo.</p>
-
-<pre class="brush: css notranslate">li em {
-  color: rebeccapurple;
-}</pre>
-
-<p>Este selector separará cualquier elemento <code>&lt;em&gt;</code> que esté dentro de (un descendiente de) <code>&lt;li&gt;</code>. Entonces, en tu documento de ejemplo, deberías encontrar que el <code>&lt;em&gt;</code> del tercer elemento de la lista es morado, pero el que hay en el párrafo no ha cambiado.</p>
-
-<p>Otra cosa que puedes probar es dar formato un párrafo que venga directamente a continuación de un título que esté en el mismo nivel de jerarquía en el HTML. Para hacerlo, coloca un <code>+</code> (un <strong>combinador hermano adyacente</strong>) entre los selectores.</p>
-
-<p>Intenta añadir también esta regla a la hoja de estilo:</p>
-
-<pre class="brush: css notranslate">h1 + p {
-  font-size: 200%;
-}</pre>
-
-<p>El ejemplo que encontrarás a continuación incluye las dos reglas anteriores. Intenta añadir una regla para que un <code>span</code> dentro de un párrafo se vuelva rojo. Sabrás si lo has hecho bien si el <code>&lt;span&gt;</code> en el primer párrafo se vuelve rojo pero el que hay en el primer elemento de la lista no cambia de color.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/started2.html", '100%', 1100)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Como puedes ver, el CSS nos ofrece varias formas de seleccionar elementos, y hasta ahora solo hemos arañado la superficie. Examinaremos todos estos selectores y muchos más en los artículos correspondientes a <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS">Selectores</a> que encontrarás más adelante.</p>
-</div>
-
-<h2 id="Dar_formato_según_el_estado">Dar formato según el estado</h2>
-
-<p>El último tipo de estilo que veremos en este tutorial es la capacidad de dar formato a los elementos en función de su estado. Un ejemplo sencillo es el estilo de los enlaces. Cuando damos formato a un enlace, necesitamos seleccionar el elemento <code><a href="/en-US/docs/Web/HTML/Element/a">&lt;a&gt;</a></code> (anclaje). Tiene diferentes estados dependiendo de si se ha visitado o no, se pasa por encima, o se presiona con el teclado o se hace clic (se activa). Puedes usar CSS para dar formato a estos diferentes estados. El CSS que encontrarás a continuación presenta en color rosa los enlaces que no se han visitado y en verde los que sí.</p>
-
-<pre class="brush: css notranslate">a:link {
-  color: pink;
-}
-
-a:visited {
-  color: green;
-}</pre>
-
-<p>Puedes cambiar la apariencia del enlace, por ejemplo, eliminando el subrayado, lo que se logra mediante la siguiente regla:</p>
-
-<pre class="brush: css notranslate">a:hover {
-  text-decoration: none;
-}</pre>
-
-<p>En el ejemplo que encontrarás a continuación, puedes jugar con diferentes valores para los distintos estados de un enlace. Hemos añadido las reglas anteriores y ahora nos damos cuenta de que el color rosa es demasiado claro y difícil de leer, ¿por qué no cambiarlo a otro que se vea mejor? ¿Puedes poner los enlaces en negrita?</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/started3.html", '100%', 900)}} </p>
-
-<p>Hemos eliminado el subrayado del enlace cuando el ratón se pasa por encima, y se puede eliminar de todos los estados de un enlace. Sin embargo, vale la pena recordar que en una página web real deberás asegurarte de que los visitantes sepan reconocer que se trata de un enlace. Que aparezca subrayado puede ser una pista importante para que las personas se den cuenta de que pueden hacer clic en una palabra dentro del párrafo, ya que es a lo que están acostumbrados. Al igual que con todo en CSS, existe la posibilidad de que tus cambios resten accesibilidad al documento. Intentaremos resaltar estas posibles dificultades en los lugares apropiados.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: a menudo verás que se menciona la <a href="/es/docs/Learn/Accessibility">accesibilidad</a> en estas lecciones y en MDN. Cuando hablamos de accesibilidad nos referimos al requisito de que nuestras páginas web sean comprensibles y usables para todas las personas.</p>
-
-<p>Puede que tu visitante acceda a la página desde un ordenador con ratón o trackpad, o un teléfono inteligente con pantalla táctil. O puede que use un lector de pantalla que lea el contenido del documento, así como puede que necesite un tamaño de texto más grande o navegar por la página usando solo el teclado.</p>
-
-<p>Un documento HTML simple es, generalmente, accesible para todos. Es importante que el documento no pierda accesibilidad a medida que vayas aplicándole estilo.</p>
-</div>
-
-<h2 id="Combinaciones_de_selectores_y_combinadores">Combinaciones de selectores y combinadores</h2>
-
-<p>Vale la pena señalar que puedes hacer múltiples combinaciones de selectores y combinadores. Por ejemplo:</p>
-
-<pre class="brush: css notranslate">/* selecciona cualquier elemento &lt;span&gt; que se encuentre dentro de un &lt;p&gt;, que esté dentro de un &lt;artículo&gt; */
-artículo p span { ... }
-
-/* selecciona cualquier &lt;p&gt; que se encuentre directamente después de &lt;ul&gt;, que va directamente después de &lt;h1&gt; */
-h1 + ul + p { ... }</pre>
-
-<p>También puedes combinar varios tipos juntos. Intenta añadir lo siguiente al código:</p>
-
-<pre class="brush: css notranslate">body h1 + p .special {
-  color: yellow;
-  background-color: black;
-  padding: 5px;
-}</pre>
-
-<p>Dará formato a cualquier elemento con la clase <code>special</code>, dentro de un elemento <code>&lt;p&gt;</code> que venga justo después de <code>&lt;h1&gt;</code>, el cual se encuentra dentro de <code>&lt;body&gt;</code>. ¡Uf!</p>
-
-<p>En el HTML original que proporcionamos, el único elemento al que esto aplica estilo es <code>&lt;span class="special"&gt;</code>.</p>
-
-<p>No te preocupes si ahora mismo te parece complicado: irás acostumbrarte a medida que escribas más CSS.</p>
-
-<h2 id="Para_terminar">Para terminar</h2>
-
-<p>En este tutorial, hemos visto varias formas con las que se puede diseñar un documento usando CSS. Desarrollaremos este conocimiento a medida que avancemos con el resto de las lecciones. Sin embargo, ahora ya sabes lo suficiente como para aplicar estilo al texto, aplicar CSS en función de diferentes formas de determinar elementos en el documento y buscar propiedades y valores en la documentación de MDN.</p>
-
-<p>En el próximo artículo, veremos cómo se estructura el CSS.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/First_steps/What_is_CSS", "Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es el CSS?</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Empezar con CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
-</ol>
diff --git a/files/es/learn/css/first_steps/como_funciona_css/index.html b/files/es/learn/css/first_steps/como_funciona_css/index.html
deleted file mode 100644
index 920212e080..0000000000
--- a/files/es/learn/css/first_steps/como_funciona_css/index.html
+++ /dev/null
@@ -1,156 +0,0 @@
----
-title: Cómo funciona CSS
-slug: Learn/CSS/First_steps/Como_funciona_CSS
-translation_of: Learn/CSS/First_steps/How_CSS_works
----
-<p>{{LearnSidebar}}<br>
- {{PreviousMenuNext("Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps/Using_your_new_knowledge", "Learn/CSS/First_steps")}}</p>
-
-<p class="summary">Hemos aprendido los conceptos básicos de CSS, para qué sirve y cómo escribir hojas de estilo simples. En esta lección vamos a echar un vistazo a cómo un navegador crea una página web a partir de CSS y HTML.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de cómo <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a> y conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Entender los conceptos básicos de cómo el navegador analiza el CSS y el HTML y lo que sucede cuando encuentra un CSS que no entiende.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Cómo_funciona_realmente_el_CSS">¿Cómo funciona realmente el CSS?</h2>
-
-<p>Cuando un navegador muestra un documento, ha de combinar el contenido con la información de estilo del documento. Procesa el documento en una serie de etapas, que enumeraremos a continuación. Ten en cuenta que este es un modelo muy simplificado de lo que sucede cuando un navegador carga una página web y que cada navegador gestiona el proceso de manera diferente. Pero esto es más o menos lo que sucede.</p>
-
-<ol>
- <li>El navegador carga el HTML (por ejemplo, lo recibe de la red).</li>
- <li>Convierte el {{Glossary("HTML")}} en un {{Glossary("DOM")}} (<em>Modelo de objetos del documento</em>). El DOM representa el documento en la memoria del ordenador. Lo explicaremos más detalladamente en la sección siguiente.</li>
- <li>Entonces, el navegador va a buscar la mayor parte de los recursos vinculados al documento HTML, como las imágenes y los videos incrustados... ¡y también el CSS vinculado! JavaScript aparece un poco más adelante en el proceso, pero no vamos a hablar de ello aún para evitar complicar las cosas.</li>
- <li>El navegador analiza el CSS y ordena en diferentes «cubos» las diferentes reglas según el tipo de selector. Por ejemplo, elemento, clase, ID, y así sucesivamente. Para cada tipo de selector que encuentres, calcula qué reglas deben aplicarse y a qué nodos en el DOM se les aplica el estilo según corresponda (este paso intermedio se llama árbol de renderización).</li>
- <li>El árbol de renderización presenta la estructura en que los nodos deben aparecer después de aplicarle las reglas.</li>
- <li>En la pantalla se muestra el aspecto visual de la página (esta etapa se llama pintura).</li>
-</ol>
-
-<p>El siguiente diagrama ofrece una visión sencilla de este proceso.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/11781/rendering.svg" style="height: auto; max-width: 635px; width: 100%;"></p>
-
-<h2 id="Acerca_del_DOM">Acerca del DOM</h2>
-
-<p>Un DOM tiene una estructura en forma de árbol. Cada elemento, atributo o bloque en el lenguaje de marcado se convierte en un {{Glossary("Node/DOM","nodo DOM")}} con estructura de árbol. Los nodos se definen por su relación con otros nodos DOM. Algunos elementos son padres de nodos secundarios, y estos nodos hijos tienen hermanos.</p>
-
-<p>Comprender el DOM te ayuda a diseñar, depurar y mantener tu CSS porque en el DOM es donde tu CSS se encuentra con el contenido del documento. Cuando comiences a trabajar con las herramientas DevTools (o herramientas del desarrollador) del navegador, te moverás por el DOM mientras seleccionas elementos con el fin de ver qué reglas se aplican.</p>
-
-<h2 id="Una_representación_real_de_un_DOM">Una representación real de un DOM</h2>
-
-<p>En lugar de una explicación larga y aburrida, veamos un ejemplo para entender cómo un código HTML se convierte en DOM.</p>
-
-<p>Tomemos el siguiente código HTML:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;
-  Usaremos:
-  &lt;span&gt;Hojas&lt;/span&gt;
-  &lt;span&gt;de estilo&lt;/span&gt;
-  &lt;span&gt;en cascada&lt;/span&gt;
-&lt;/p&gt;
-</pre>
-
-<p>En el DOM, el nodo que se corresponde con nuestro elemento <code>&lt;p&gt;</code> es un padre. Sus hijos son un nodo de texto y los tres nodos correspondientes a nuestros elementos <code>&lt;span&gt;</code>. Los nodos <code>SPAN</code> son también los <span style="background-color: #f5f6f5;">padres</span>, y los nodos de texto sus hijos:</p>
-
-<pre class="notranslate">P
-├─ "Usaremos:"
-├─ SPAN
-|  └─ "Hojas"
-├─ SPAN
-|  └─ "de estilo"
-└─ SPAN
-   └─ "en cascada"
-</pre>
-
-<p>Así es como un navegador interpreta el código HTML anterior, interpreta el árbol DOM y luego lo muestra en el navegador, así:</p>
-
-<p>{{EmbedLiveSample('Una_representación_real_de_un_DOM', '100%', 55)}}</p>
-
-<div class="hidden">
-<pre class="brush: css notranslate">p {margin:0;}</pre>
-</div>
-
-<h2 id="La_aplicación_de_CSS_al_DOM">La aplicación de CSS al DOM</h2>
-
-<p>Pongamos que hemos añadido un poco de CSS a nuestro documento, para darle estilo. Una vez más, el HTML es el siguiente:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;
-  Usaremos:
-  &lt;span&gt;Hojas&lt;/span&gt;
-  &lt;span&gt;de estilo&lt;/span&gt;
-  &lt;span&gt;en cascada&lt;/span&gt;
-&lt;/p&gt;</pre>
-
-<p>Supongamos que le aplicamos el CSS siguiente:</p>
-
-<pre class="brush: css notranslate">span {
-  border: 1px solid black;
-  background-color: lime;
-}</pre>
-
-<p>El navegador analizará el código HTML y creará un DOM a partir de este. A continuación, analizará el CSS. Dado que la única regla disponible en el CSS tiene un selector <code>span</code>, el navegador ¡ordenará el CSS muy rápidamente! Aplicará la regla a cada uno de los tres <code>&lt;span&gt;</code>, que mostrarán en pantalla la representación visual final.</p>
-
-<p>La salida actualizada es la siguiente:</p>
-
-<p>{{EmbedLiveSample ( 'La_aplicación_de_CSS_al_DOM', '100%', 55)}}</p>
-
-<p>En nuestro artículo <a href="/es/docs/Learn/CSS/Building_blocks/Depurar_el_CSS">Depurar el CSS</a> que encontrarás en el siguiente módulo, vamos a utilizar las herramientas DevTools del navegador para depurar posibles problemas en el CSS. También aprenderemos más sobre cómo el navegador interpreta el CSS.</p>
-
-<h2 id="¿Qué_ocurre_si_un_navegador_encuentra_CSS_que_no_entiende">¿Qué ocurre si un navegador encuentra CSS que no entiende?</h2>
-
-<p>En una <a href="/es/docs/Learn/CSS/First_steps/Qu%C3%A9_es_CSS#Soporte_del_navegador">lección anterior</a> mencionamos que no todos los navegadores implementan las novedades de CSS en el mismo momento. Además, no todo el mundo utiliza la última versión de un navegador. Dado que el CSS está en desarrollo constante y, por lo tanto, por delante de lo que los navegadores pueden reconocer, puede que te preguntes qué sucede si un navegador encuentra un selector o una declaración CSS que no reconoce.</p>
-
-<p>La respuesta es que no hace nada y simplemente pasa a la siguiente parte del CSS.</p>
-
-<p>Si un navegador analiza tus reglas y encuentra una propiedad o un valor que no entiende, lo ignora y avanza hasta la declaración siguiente. Esto sucederá si has cometido un error y has escrito mal una propiedad o un valor, o si la propiedad o el valor son demasiado nuevos y el navegador aún no los admite.</p>
-
-<p>Del mismo modo, si un navegador encuentra un selector que no entiende, lo ignorará y pasará al siguiente.</p>
-
-<p>En el siguiente ejemplo hemos utilizado la ortografía británica para la propiedad color, que invalida la propiedad porque no la reconoce. Así que el párrafo no se muestra en azul. Sin embargo, se han aplicado todos los demás estilos del CSS; solo se ha ignorado la línea que no es válida.</p>
-
-<div id="Skipping_example">
-<pre class="brush: html notranslate">&lt;p&gt;Quiero este texto en grande, en negrita y en color azul.&lt;/p&gt;</pre>
-
-<pre class="brush: css notranslate">p {
-  font-weight: bold;
-  colour: blue; /* Ortografía incorrecta de la propiedad color */
-  font-size: 200%;
-}</pre>
-</div>
-
-<p>{{EmbedLiveSample('Skipping_example', '100%', 200)}}</p>
-
-<p>Este comportamiento es muy útil. Significa que puedes utilizar el CSS nuevo como una mejora, a sabiendas de que no se producirá ningún error si no se entiende: o bien el navegador entiende la característica nueva o no lo hace. Combinado con el funcionamiento del modo en cascada con el hecho de que los navegadores utilizarán la última CSS que encuentren en la hoja de estilo, cuando haya dos reglas con el mismo nivel de especificidad, también puedes ofrecer alternativas para los navegadores que no admiten el CSS nuevo.</p>
-
-<p>Esto funciona especialmente bien cuando quieres utilizar un valor que es bastante nuevo que no admiten todos los navegadores. Por ejemplo, algunos navegadores antiguos no entienden <code>calc()</code> como valor. Podríamos dar un valor de sustitución para el ancho de una caja en píxeles, y a continuación dar un ancho con un valor <code>calc()</code> de <code>100% - 50px</code>. Los navegadores antiguos usarán la versión en píxeles y harán caso omiso de la indicación <code>calc()</code>, porque no la entienden. Los navegadores nuevos interpretarán la línea del ancho en píxeles, pero la anularán al llegar a la línea de <code>calc()</code> porque aparece después en la cascada.</p>
-
-<pre class="brush: css notranslate">.box {
-  width: 500px;
-  width: calc(100% - 50px);
-}</pre>
-
-<p>En lecciones posteriores veremos muchas más formas de cómo admitir navegadores diferentes.</p>
-
-<h2 id="Y_finalmente">Y finalmente</h2>
-
-<p>Casi has terminado este módulo; solo nos queda una cosa más por hacer. En el próximo artículo, <a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">pondrás en práctica tu conocimiento nuevo</a> para cambiar el estilo de un ejemplo y probarte con un poco de CSS en el proceso.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps/Using_your_new_knowledge", "Learn/CSS/First_steps")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es CSS?</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Empezar con CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
-</ol>
diff --git a/files/es/learn/css/first_steps/como_se_estructura_css/index.html b/files/es/learn/css/first_steps/como_se_estructura_css/index.html
deleted file mode 100644
index a3e9bb94b8..0000000000
--- a/files/es/learn/css/first_steps/como_se_estructura_css/index.html
+++ /dev/null
@@ -1,512 +0,0 @@
----
-title: Cómo se estructura el CSS
-slug: Learn/CSS/First_steps/Como_se_estructura_CSS
-translation_of: Learn/CSS/First_steps/How_CSS_is_structured
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</div>
-
-<p class="summary">Ahora que ya sabes qué es el CSS y conoces sus conceptos básicos, es hora de profundizar un poco más en la estructura del lenguaje en sí. Ya hemos visto muchos de los conceptos que aparecen en este artículo; puedes volver para recapitular si más adelante encuentras conceptos confusos.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajo con archivos</a>, conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y una idea de <a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">cómo funciona el CSS</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender en detalle las estructuras de sintaxis fundamentales de CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Aplicar_CSS_al_HTML">Aplicar CSS al HTML</h2>
-
-<p>Lo primero que veremos son los tres métodos para aplicar CSS a un documento.</p>
-
-<h3 id="Hoja_de_estilo_externa">Hoja de estilo externa</h3>
-
-<p>En <a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Empezar con el CSS</a>, vinculamos una hoja de estilo externa a nuestra página. Este es el método más común y útil para adjuntar CSS a un documento, porque puedes vincular el CSS a varias páginas y dar estilo a todas ellas con la misma hoja de estilo. En la mayoría de los casos, las diferentes páginas de un sitio web se verán más o menos iguales, de modo que puedes usar el mismo conjunto de reglas para el aspecto y la interacción básicos.</p>
-
-<p>Una hoja de estilo externa significa que el CSS está escrito en un archivo independiente con una extensión <code>.css</code> y que lo vinculas desde un elemento <code>&lt;link&gt;</code> de HTML:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Mi experimento CSS&lt;/title&gt;
-    &lt;link rel="stylesheet" href="styles.css"&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;h1&gt;¡Hola, mundo!&lt;/h1&gt;
-    &lt;p&gt;Este es mi primer ejemplo de CSS&lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>El archivo CSS podría parecerse a esto:</p>
-
-<pre class="brush: css notranslate">h1 {
-  color: blue;
-  background-color: yellow;
-  border: 1px solid black;
-}
-
-p {
-  color: red;
-}</pre>
-
-<p>El atributo <code>href</code> del elemento {{htmlelement("link")}} tiene que hacer referencia a un archivo de tu sistema de archivos.</p>
-
-<p>En el ejemplo anterior, el archivo CSS está en la misma carpeta que el documento HTML, pero puedes colocarlo en otro lugar y especificar la ruta adecuada. Por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;!-- Dentro de un subdirectorio llamado styles dentro del directorio de trabajo --&gt;
-&lt;link rel="stylesheet" href="styles/style.css"&gt;
-
-&lt;!-- Dentro de un subdirectorio llamado general, que está en un subdirectorio llamado styles, dentro del directorio de trabajo --&gt;
-&lt;link rel="stylesheet" href="styles/general/style.css"&gt;
-
-&lt;!-- Sube un nivel de directorio, y luego dentro de un subdirectorio llamado styles --&gt;
-&lt;link rel="stylesheet" href="../styles/style.css"&gt;</pre>
-
-<h3 id="Hoja_de_estilo_interna">Hoja de estilo interna</h3>
-
-<p>Una hoja de estilo interna es cuando no hay ningún archivo CSS externo, sino que colocas tu CSS dentro de un elemento {{htmlelement("style")}} contenido dentro del elemento {{htmlelement("head")}} del HTML.</p>
-
-<p>En este caso, el HTML se vería así:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Mi experimento CSS&lt;/title&gt;
-    &lt;style&gt;
-      h1 {
-        color: blue;
-        background-color: yellow;
-        border: 1px solid black;
-      }
-
-      p {
-        color: red;
-      }
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;h1&gt;¡Hola, mundo!&lt;/h1&gt;
-    &lt;p&gt;Este es mi primer ejemplo de CSS&lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>Esto puede ser útil en algunas circunstancias (tal vez estés trabajando con un sistema de administración de contenido donde no sea posible modificar los archivos CSS directamente), pero no es tan eficiente como las hojas de estilo externas: en una página web, deberías repetir el CSS en cada página y actualizarlo en varios lugares en caso de que hubiera que hacer cambios.</p>
-
-<h3 id="Estilos_en_línea">Estilos en línea</h3>
-
-<p>Los estilos en línea son declaraciones CSS que afectan a un solo elemento, contenido dentro de un atributo de <code>style</code>:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Mi experimento CSS&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;h1 style="color: blue;background-color: yellow;border: 1px solid black;"&gt;¡Hola mundo!&lt;/h1&gt;
-    &lt;p style="color:red;"&gt;Este es mi primer ejemplo de CSS&lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p><strong>¡No hagas esto a menos que realmente tengas que hacerlo!</strong> Es realmente malo a la hora de realizar el mantenimiento (puede que tengas que actualizar la misma información varias veces en un mismo documento), y además mezcla tu información CSS para la presentación con tu información HTML para la estructura, lo que dificulta la lectura y la comprensión del código. Mantener los diferentes tipos de código separados facilita trabajar con ellos.</p>
-
-<p>Hay ciertos lugares donde los estilos en línea son más comunes, o incluso aconsejables. Es posible que tengas que recurrir a ellos si realmente tu entorno de trabajo es restrictivo (tal vez el CMS solo te permita editar el cuerpo del HTML). También verás que se usan mucho en el correo electrónico en formato HTML para lograr la máxima compatibilidad con el mayor número de clientes.</p>
-
-<h2 id="Juguemos_con_el_CSS_de_este_artículo">Juguemos con el CSS de este artículo</h2>
-
-<p>En este artículo hay mucho CSS con el que jugar. Para hacerlo, recomendamos crear un nuevo directorio/carpeta en el ordenador, dentro de la cual deberás crear una copia de los siguientes dos archivos:</p>
-
-<p><strong>index.html:</strong></p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html lang="en"&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Mis experimentos CSS&lt;/title&gt;
-    &lt;link rel="stylesheet" href="styles.css"&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-
-    &lt;p&gt;Crea tu HTML de prueba aquí&lt;/p&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p><strong>styles.css:</strong></p>
-
-<pre class="brush: css notranslate">/* Crea tu CSS de prueba aquí */
-
-p {
-  color: red;
-}</pre>
-
-<p>Entonces, cuando te encuentres con un CSS con el que desees experimentar, reemplaza el contenido <code>&lt;body&gt;</code> del HTML con algo de HTML sin estilos y añade CSS a tu archivo de CSS para darle estilo.</p>
-
-<p>Si no estás en un sistema donde puedas crear archivos fácilmente, puedes utilizar el editor interactivo que encontrarás a continuación para experimentar.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/experiment-sandbox.html", '100%', 800)}} </p>
-
-<p>¡Sigue leyendo y disfruta!</p>
-
-<h2 id="Selectores">Selectores</h2>
-
-<p>No se puede hablar de CSS sin mencionar los selectores, de los cuales ya hemos descubierto varios tipos diferentes en la lección <a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Empezar con el CSS</a>. Un selector es, como determinamos, un elemento de nuestro documento HTML para aplicarle estilo. Si los estilos no se aplican correctamente, es probable que el selector no coincida con lo que crees que debería coincidir.</p>
-
-<p>Cada regla CSS comienza con un selector o una lista de selectores que indican al navegador a qué elemento o elementos deben aplicarse dichas reglas. Todos los siguientes son ejemplos de selectores válidos o listas de selectores.</p>
-
-<pre class="brush: css notranslate">h1
-a:link
-.manythings
-#onething
-*
-.box p
-.box p:first-child
-h1, h2, .intro</pre>
-
-<p><strong>Prueba a crear algunas reglas CSS que usen los selectores anteriores y algo de HTML sin estilos. Si no conoces alguna de las sintaxis anteriores, ¡prueba a buscarla en MDN!</strong></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Aprenderás mucho más sobre los selectores en nuestros tutoriales sobre <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS">selectores CSS</a> de la próxima lección.</p>
-</div>
-
-<h3 id="Especificidad">Especificidad</h3>
-
-<p>A menudo habrá situaciones en las que dos selectores podrían determinar un mismo elemento HTML. Considera la siguiente hoja de estilo, en que definimos una regla con un selector <code>p</code> que establecerá los párrafos en color azul, y también una clase que establecerá los elementos seleccionados en color rojo.</p>
-
-<pre class="brush: css notranslate">.special {
-  color: red;
-}
-
-p {
-  color: blue;
-}</pre>
-
-<p>Digamos que en nuestro documento HTML hay un párrafo con una clase <code>special</code>. Ambas reglas podrían aplicarse. ¿Cuál ganará? ¿De qué color crees que será nuestro párrafo?</p>
-
-<pre class="brush: html notranslate">&lt;p class="special"&gt;¿De qué color soy?&lt;/p&gt;</pre>
-
-<p>El lenguaje CSS tiene reglas para controlar cuál ganará en caso de colisión; reciben el nombre de <strong>cascada</strong> y <strong>especificidad</strong>. En el siguiente bloque de códigos hemos definido dos reglas para el selector <code>p</code>, pero el párrafo termina siendo de color azul. Esto se debe a que la declaración que lo establece en azul aparece más abajo en la hoja de estilo, y los estilos posteriores anulan a los anteriores. Así funciona la regla de la cascada.</p>
-
-<pre class="brush: css notranslate">p {
-  color: red;
-}
-
-p {
-  color: blue;
-}</pre>
-
-<p>Sin embargo, en el caso de nuestro primer bloque, que contiene un selector de clase y otro de elementos, la clase ganará. Esto hará que el párrafo sea rojo, incluso aunque aparezca antes en la hoja de estilo. Una clase se describe de forma más específica o con más especificidad que el selector de elementos, razón por la que gana.</p>
-
-<p><strong>Prueba el ejemplo anterior: añade el HTML a tu experimento, luego pon las dos reglas <code>p { ... }</code> a tu hoja de estilo. A continuación, cambia el primer selector <code>p</code> por <code>.special</code> para ver cómo cambia el estilo.</strong></p>
-
-<p>Las reglas de especificidad y de cascada pueden parecer un poco complicadas al principio. Son más fáciles de entender a medida que se van adquiriendo conocimientos de CSS. En nuestro artículo sobre <a href="/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia">Cascada y herencia</a>, que abordaremos en la próxima lección, se explicará en detalle, incluyendo cómo calcular la especificidad. Por ahora, solo has de saber que existe y que a veces el CSS no se aplica como esperas porque algo más en la hoja de estilo tiene una mayor especificidad. El hecho de identificar que más de una regla podría aplicarse a un elemento es el primer paso para solucionar estos problemas.</p>
-
-<h2 id="Propiedades_y_valores">Propiedades y valores</h2>
-
-<p>En su nivel más básico, el CSS consta de dos componentes básicos:</p>
-
-<ul>
- <li><strong>Propiedades</strong>: Identificadores legibles por los humanos que indican qué características de estilo (por ejemplo, <code><a href="/en-US/docs/Web/CSS/font-size">font-size</a></code>, <code><a href="/en-US/docs/Web/CSS/width">width</a></code>, <code><a href="/en-US/docs/Web/CSS/background-color">background-color</a></code>) deseas cambiar.</li>
- <li><strong>Valores</strong>: A cada propiedad especificada se le asigna un valor que indica cómo quieres que cambien esas características de estilo (por ejemplo, lo que quieres que cambie de la fuente, el ancho o el color de fondo).</li>
-</ul>
-
-<p>La siguiente imagen resalta una sola propiedad y valor. El nombre de la propiedad es <code>color</code> y el valor <code>blue</code>.</p>
-
-<p><img alt="Una declaración resaltada en el CSS" src="https://mdn.mozillademos.org/files/16498/declaration.png" style="border: 1px solid #cccccc; display: block; height: 218px; margin: 0 auto; width: 471px;"></p>
-
-<p>Una propiedad emparejada con un valor se denomina <em>declaración CSS</em>. Las declaraciones CSS se colocan dentro de los <em>bloques de declaración CSS</em>. La siguiente imagen muestra nuestro CSS con el bloque de declaración resaltado.</p>
-
-<p><img alt="Un bloque de declaración resaltado" src="https://mdn.mozillademos.org/files/16499/declaration-block.png" style="border: 1px solid #cccccc; display: block; height: 218px; margin: 0 auto; width: 471px;"></p>
-
-<p>Finalmente, los bloques de declaración CSS se combinan con <em>selectores</em> para producir <em>conjuntos de reglas CSS</em> (o <em>reglas CSS</em>). Nuestra imagen contiene dos reglas, una para el selector <code>h1</code> y otra para el selector <code>p</code>. La regla para <code>h1</code> está resaltada.</p>
-
-<p><img alt="La regla para h1 resaltada" src="https://mdn.mozillademos.org/files/16500/rules.png" style="border: 1px solid #cccccc; display: block; height: 218px; margin: 0 auto; width: 471px;"></p>
-
-<p>Establecer las propiedades de CSS según valores específicos es la función principal del lenguaje CSS. El motor CSS calcula qué declaraciones se aplican a cada elemento de una página para darle la compaginación y los estilos adecuados.</p>
-
-<div class="blockIndicator warning">
-<p><strong>Importante:</strong> Las propiedades y valores de CSS son sensibles a mayúsculas y minúsculas. La propiedad y el valor de cada par están separados por dos puntos (<code>:</code>).</p>
-</div>
-
-<p><strong>Prueba a buscar diferentes valores de las siguientes propiedades y escribe reglas CSS que se puedan aplicar a diferentes elementos HTML: </strong></p>
-
-<ul>
- <li><strong>{{cssxref("font-size")}}</strong></li>
- <li><strong>{{cssxref("width")}}</strong></li>
- <li><strong>{{cssxref("background-color")}}</strong></li>
- <li><strong>{{cssxref("color")}}</strong></li>
- <li><strong>{{cssxref("border")}}</strong></li>
-</ul>
-
-<div class="warning">
-<p><strong>Importante</strong>: Si una propiedad es desconocida o si un valor no es válido para una propiedad determinada, la declaración se considera <em>inválida</em> y el motor CSS del navegador la ignora por completo.</p>
-</div>
-
-<div class="warning">
-<p><strong>Importante</strong>: En CSS (y otros estándares web) se ha acordado establecer como estándar la ortografía en inglés de los EE. UU. para solucionar las incertidumbres idiomáticas. Por ejemplo, <em>siempre</em> hay que escribir <code>color</code>. Si se escribe <code>colour</code>, no funcionará.</p>
-</div>
-
-<h3 id="Las_funciones">Las funciones</h3>
-
-<p>Si bien la mayoría de valores son palabras clave relativamente simples o valores numéricos, es posible que algunos valores tomen la forma de una función. Un ejemplo sería la función <code>calc()</code>. Esta función te permite hacer operaciones matemáticas sencillas desde tu CSS, por ejemplo:</p>
-
-<div id="calc_example">
-<pre class="brush: html notranslate">&lt;div class="external"&gt; &lt;div class="box"&gt;La caja interior es del 90% - 30px.&lt;/div&gt;&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">.outer {
-  border: 5px solid black;
-}
-
-.box {
-  padding: 10px;
-  width: calc(90% - 30px);
-  background-color: rebeccapurple;
-  color: white;
-}</pre>
-</div>
-
-<p>Esto se traduce así:</p>
-
-<p>{{EmbedLiveSample('calc_example', '100%', 200)}}</p>
-
-<p>Una función consta del nombre de la función y, a continuación, unos paréntesis entre los que se colocan los valores permitidos para esa función. En el caso del ejemplo <code>calc()</code> anterior, pedimos que el ancho de esta caja sea del 90% del ancho del bloque que la contiene, menos 30 píxeles. Esto no es algo que podamos calcular con anticipación y simplemente introducir el valor en el CSS, ya que no sabemos cuál será el 90%. Como con todos los valores, la página correspondiente del proyecto MDN tendrá ejemplos de uso para que puedas ver cómo funciona.</p>
-
-<p>Otro ejemplo serían los diversos valores para {{cssxref ("transform")}}, como <code>rotate()</code>.</p>
-
-<div id="transform_example">
-<pre class="brush: html notranslate">&lt;div class="box"&gt;&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">.box {
-  margin: 30px;
-  width: 100px;
-  height: 100px;
-  background-color: rebeccapurple;
-  transform: rotate(0.8turn)
-}</pre>
-</div>
-
-<p>El resultado del código anterior se ve así:</p>
-
-<p>{{EmbedLiveSample('transform_example', '100%', 200)}}</p>
-
-<p><strong>Prueba a buscar diferentes valores de las siguientes propiedades y escribe reglas CSS que se apliquen a diferentes elementos HTML: </strong></p>
-
-<ul>
- <li><strong>{{cssxref("transform")}}</strong></li>
- <li><strong>{{cssxref ("background-image")}}, en particular a valores de gradiente</strong></li>
- <li><strong>{{cssxref("color")}}, en particular a valores rgb/rgba/hsl/hsla</strong></li>
-</ul>
-
-<h2 id="rules">@rules</h2>
-
-<p>Las <code><a href="/es/docs/Web/CSS/At-rule">@rules</a></code> (leído "at-rules" en inglés) dan al CSS algunas instrucciones sobre cómo comportarse. Algunas <code>@rules</code> son simples, con el nombre de la regla y un valor. Por ejemplo, para importar una hoja de estilo adicional a tu hoja de estilo CSS principal, puedes usar <code>@import</code>:</p>
-
-<pre class="brush: css notranslate">@import 'styles2.css';</pre>
-
-<p>Una de las <code>@rules</code> más comunes con las que te encontrarás es <code>@media</code>, que permite usar <a href="/es/docs/Web/CSS/Media_Queries">consultas a medios</a> para aplicar CSS solo cuando se dan ciertas condiciones (por ejemplo, cuando la resolución de la pantalla supera un valor determinado o la anchura supera un valor concreto).</p>
-
-<p>En el CSS que se muestra a continuación, tenemos una hoja de estilo que le da al elemento <code>&lt;body&gt;</code> un color de fondo rosado. Sin embargo, luego usamos <code>@media</code> para crear una sección de nuestra hoja de estilo que solo se aplicará en los navegadores con una ventana gráfica de más de 30em de ancho. Si el navegador es más ancho que 30em, el color de fondo será azul.</p>
-
-<pre class="brush: css notranslate">body {
-  background-color: pink;
-}
-
-@media (min-width: 30em) {
-  body {
-    background-color: blue;
-  }
-}</pre>
-
-<p>Encontrarás otras <code>@rules</code> a lo largo de estas lecciones.</p>
-
-<p><strong>Prueba a añadir una consulta a medios en tu CSS que cambie los estilos según el ancho de la ventana gráfica. Cambia el ancho de la ventana de tu navegador para ver el resultado.</strong></p>
-
-<h2 id="Abreviaturas">Abreviaturas</h2>
-
-<p>Algunas propiedades como {{cssxref("font")}}, {{cssxref("background")}}, {{cssxref("padding")}}, {{cssxref("border")}} y {{ cssxref("margin")}} se llaman <strong>propiedades abreviadas</strong>. Esto se debe a que permiten establecer varios valores de propiedad en una sola línea, lo que ahorra tiempo y ordena el código.</p>
-
-<p>Por ejemplo, esta línea:</p>
-
-<pre class="brush: css notranslate">/* En propiedades abreviadas con 4 valores, como margin y padding (relleno), los valores se aplican
-   según el orden: arriba, derecha, abajo e izquierda (en sentido horario desde la parte superior). También hay otros
-   tipos de abreviaturas, como las propiedades abreviadas con 2 valores que establecen el relleno/margen,
-   arriba/abajo, y luego izquierda/derecha */
-padding: 10px 15px 15px 5px;</pre>
-
-<p>Hace lo mismo que todas estas juntas:</p>
-
-<pre class="brush: css notranslate">padding-top: 10px;
-padding-right: 15px;
-padding-bottom: 15px;
-padding-left: 5px;</pre>
-
-<p>Mientras que esta línea:</p>
-
-<pre class="brush: css notranslate">background: red url(bg-graphic.png) 10px 10px repeat-x fixed;</pre>
-
-<p>Hace lo mismo que todas estas juntas:</p>
-
-<pre class="brush: css notranslate">background-color: red;
-background-image: url(bg-graphic.png);
-background-position: 10px 10px;
-background-repeat: repeat-x;
-background-scroll: fixed;</pre>
-
-<p>Ahora mismo no pretendemos enseñarlos exhaustivamente: encontrarás muchos ejemplos más adelante en el curso. Te aconsejamos que busques los nombres de las propiedades abreviadas en nuestra <a href="/es/docs/Web/CSS/Referencia_CSS">referencia CSS</a> para obtener más información.</p>
-
-<p><strong>Prueba a añadir las declaraciones anteriores a tu CSS para ver cómo afecta al estilo de tu HTML. Experimenta con diferentes valores.</strong></p>
-
-<div class="blockIndicator warning">
-<p><strong>Advertencia</strong>: Si bien las propiedades abreviadas a menudo permiten ahorrarte valores, luego restablecerán a sus valores iniciales cualquier valor que no incluyas. Esto asegura que se use un conjunto de valores razonable. Sin embargo, puede resultar confuso si esperas que la propiedad abreviada solo cambie los valores que has introducido.</p>
-</div>
-
-<h2 id="Comentarios">Comentarios</h2>
-
-<p>Al igual que con el HTML, te recomendamos que hagas comentarios en tu CSS para que te ayuden a comprender cómo funciona su código cuando vuelvas a utilizarlo al cabo de varios meses, así como para ayudar a otros que vayan a trabajar con él a entenderlo.</p>
-
-<p>Los comentarios en el CSS comienzan con <code>/*</code> y terminan con <code>*/</code>. En el bloque de código que encontrarás a continuación, hemos usado comentarios para marcar el inicio de las diferentes secciones de código. Esto es útil para ayudarnos a movernos por la base de código a medida que aumenta: puedes buscar los comentarios en tu editor de código.</p>
-
-<pre class="brush: css notranslate">/* con elementos básicos de aplicación de estilo */
-/* -------------------------------------------------------------------------------------------- */
-body {
-  font: 1em/150% Helvética, Arial, sans-serif;
-  padding: 1em;
-  margin: 0 auto;
-  max-width: 33em;
-}
-
-@media (min-width: 70em) {
-  /* Prestemos especial atención al tamaño de fuente global. En una pantalla o una ventana grande,
-     aumentamos el tamaño de la fuente para conseguir una mejor legibilidad */
-  body {
-    font-size: 130%;
-  }
-}
-
-h1 {font-size: 1.5em;}
-
-/* Familiarización con algunos elementos anidados específicos en el DOM */
-/* -------------------------------------------------------------------------------------------- */
-div p, #id:first-line {
-  background-color: red;
-  border-radius: 3px;
-}
-
-div p {
-  margin: 0;
-  padding: 1em;
-}
-
-div p + p {
-  padding-top: 0;
-}</pre>
-
-<p>Los comentarios también son útiles para <em>comentar</em> temporalmente ciertas partes del código con fines de prueba, por ejemplo, si tratas de encontrar qué parte de tu código causa un error. En el siguiente ejemplo, hemos comentado las reglas para el selector <code>.special</code>.</p>
-
-<pre class="brush: css notranslate">/*.special {
-  color: red;
-}*/
-
-p {
-  color: blue;
-}</pre>
-
-<p><strong>Añade algunos comentarios al CSS para acostumbrarte a usarlos.</strong></p>
-
-<h2 id="Espacio_en_blanco">Espacio en blanco</h2>
-
-<p>Por espacio en blanco nos referimos los espacios en sí, tabuladores y retornos de carro o intros. De la misma manera que el HTML, el navegador ignora el espacio en blanco dentro del CSS. El valor del espacio en blanco es que puede mejorar la legibilidad.</p>
-
-<p>En el siguiente ejemplo, cada declaración (y el principio/fin de regla) está en una línea propia; esta es posiblemente una buena forma de escribir el CSS, ya que facilita el mantenimiento y la comprensión:</p>
-
-<pre class="brush: css notranslate">body {
-  font: 1em/150% Helvética, Arial, sans-serif;
-  padding: 1em;
-  margin: 0 auto;
-  max-width: 33em;
-}
-
-@media (min-width: 70em) {
-  body {
-    font-size: 130%;
-  }
-}
-
-h1 {
-  font-size: 1.5em;
-}
-
-div p,
-#id:first-line {
-  background-color: red;
-  border-radius: 3px;
-}
-
-div p {
-  margin: 0;
-  padding: 1em;
-}
-
-div p + p {
-  padding-top: 0;
-}
-</pre>
-
-<p id="Very_compact">Podrías escribir exactamente el mismo CSS eliminando la mayoría de los espacios en blanco; este bloque de código es funcionalmente idéntico al primer ejemplo, pero seguro que estarás de acuerdo en que resulta algo más difícil de leer:</p>
-
-<pre class="brush: css notranslate">body {font: 1em/150% Helvetica, Arial, sans-serif; padding: 1em; margin: 0 auto; max-width: 33em;}
-@media (min-width: 70em) { body {font-size: 130%;} }
-
-h1 {font-size: 1.5em;}
-
-div p, #id:first-line {background-color: red; border-radius: 3px;}
-div p {margin: 0; padding: 1em;}
-div p + p {padding-top: 0;}
-</pre>
-
-<p>La manera que elijas para disponer el código suele ser una preferencia personal, aunque cuando comiences a trabajar en equipo es posible que encuentres que el equipo ya tiene su propia guía de estilo que especifica una convención acordada a seguir.</p>
-
-<div class="blockIndicator warning">
-<p><strong>Importante:</strong> Aunque los valores de las declaraciones CSS se separan por espacios, <strong>los nombres de propiedad nunca tienen espacios</strong>.</p>
-</div>
-
-<p>Por ejemplo, las siguientes declaraciones de CSS son válidas:</p>
-
-<pre class="brush: css notranslate">margin: 0 auto;
-padding-left: 10px;</pre>
-
-<p>Pero las siguientes no lo son:</p>
-
-<pre class="brush: css notranslate">margin: 0auto;
-padding- left: 10px;</pre>
-
-<p>¿Ves los errores de espaciado? <code>0auto</code> no se reconoce como un valor válido para la propiedad de <code>margin</code> (<code>0</code> y <code>auto</code> son dos valores separados) y el navegador no reconoce <code>padding-</code> como una propiedad válida. El valor correcto de propiedad (<code>padding-left</code>) se ha separado por un espacio perdido.</p>
-
-<p>Debes asegurarte siempre de separar los valores distintos entre sí por al menos un espacio, pero mantén los nombres de las propiedades y los valores de las propiedades juntos.</p>
-
-<p><strong>Prueba a jugar con los espacios en blanco de tu CSS y observa qué es lo que se rompe y lo que no.</strong></p>
-
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-
-<p>Resulta útil entender un poco cómo el navegador toma tu HTML y tu CSS y los convierte en una página web, razón por la cual en el próximo artículo (<a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">Cómo funciona el CSS</a>) veremos ese proceso.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</p>
-
-<h2 id="En_este_modulo">En este modulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es el CSS?</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Empezar con el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
-</ol>
diff --git a/files/es/learn/css/first_steps/getting_started/index.html b/files/es/learn/css/first_steps/getting_started/index.html
new file mode 100644
index 0000000000..0fc4331abe
--- /dev/null
+++ b/files/es/learn/css/first_steps/getting_started/index.html
@@ -0,0 +1,265 @@
+---
+title: Empezar con CSS
+slug: Learn/CSS/First_steps/Getting_started
+tags:
+  - Aprender
+  - CSS
+  - Clases
+  - Ejemplo
+  - Elementos
+  - Estado
+  - Principiante
+  - Selectores
+  - Sintaxis
+translation_of: Learn/CSS/First_steps/Getting_started
+original_slug: Learn/CSS/First_steps/Comenzando_CSS
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/CSS/First_steps/What_is_CSS", "Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps")}}</div>
+
+<p class="summary">En este artículo aplicaremos CSS a un documento HTML sencillo para aprender algunos elementos prácticos sobre este lenguaje.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajo con archivos</a> y conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender los conceptos básicos para vincular un documento CSS a un archivo HTML y dar a un texto un formato sencillo con CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Empezamos_con_algo_de_HTML">Empezamos con algo de HTML</h2>
+
+<p>Nuestro punto de partida es un documento HTML. Puedes copiar el código de abajo si quieres trabajar en tu ordenador. Guarda el siguiente código como <code>index.html</code> en una carpeta de tu equipo.</p>
+
+<pre class="brush: html notranslate">&lt;!doctype html&gt;
+&lt;html lang="es"&gt;
+&lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Empezamos con el CSS&lt;/title&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+    &lt;h1&gt;Soy un título de nivel uno&lt;/h1&gt;
+
+    &lt;p&gt;Este es un párrafo de texto. En el texto hay un &lt;span&gt;elemento span&lt;/span&gt;
+y también un &lt;a href="http://example.com"&gt;enlace&lt;/a&gt;.&lt;/p&gt;
+
+    &lt;p&gt;Este es el segundo párrafo. Contiene un elemento &lt;em&gt;destacado&lt;/em&gt;.&lt;/p&gt;
+
+    &lt;ul&gt;
+        &lt;li&gt;Punto uno&lt;/li&gt;
+        &lt;li&gt;Punto dos&lt;/li&gt;
+        &lt;li&gt;Punto &lt;em&gt;tres&lt;/em&gt;&lt;/li&gt;
+    &lt;/ul&gt;
+
+&lt;/body&gt;
+
+&lt;/html&gt;
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Si lees esto en un dispositivo o un entorno donde no puedes crear archivos fácilmente, no te preocupes. A continuación hay editores de código en vivo que van a permitirte escribir ejemplos de código en esta misma página.</p>
+</div>
+
+<h2 id="Agregar_CSS_a_un_documento">Agregar CSS a un documento</h2>
+
+<p>Lo primero que se debe hacer es decirle al documento HTML que hay algunas reglas CSS que queremos que use. Hay tres formas diferentes de aplicar CSS a un documento HTML, sin embargo, por ahora, veremos la forma más habitual y útil de hacerlo: vincular el CSS desde el encabezado del documento.</p>
+
+<p>Crea un archivo en la misma carpeta que tu documento HTML y guárdalo como <code>styles.css</code>. La extensión <code>.css</code> muestra que es un archivo CSS.</p>
+
+<p>Para vincular <code>styles.css</code> a <code>index.html</code>, añade la siguiente línea en algún lugar dentro del {{htmlelement ("head")}} del documento HTML:</p>
+
+<pre class="brush: html notranslate">&lt;link rel="stylesheet" href="styles.css"&gt;</pre>
+
+<p>Este elemento {{htmlelement ("link")}} le dice al navegador que hay una hoja de estilo con el atributo <code>rel</code> y la ubicación de esa hoja de estilo como el valor del atributo <code>href</code>. Puedes probar si el CSS funciona añadiendo una regla a <code>styles.css</code>. Usando el editor de código, añade lo siguiente al archivo CSS:</p>
+
+<pre class="brush: css notranslate">h1 {
+  color: red;
+}</pre>
+
+<p>Guarda los archivos HTML y CSS antes de volver a cargar la página en un navegador web. Ahora el título de nivel uno de la parte superior del documento debería ser rojo. Si esto sucede, ¡felicidades!: has aplicado correctamente un poco de CSS a un documento HTML. Si no lo hace, verifica que hayas escrito todo correctamente.</p>
+
+<p>Puedes continuar trabajando en <code>styles.css</code> localmente o usar nuestro editor interactivo para continuar con este tutorial. El editor interactivo actúa como si el CSS del primer panel estuviera vinculado al documento HTML, tal como lo hemos hecho con el documento anterior.</p>
+
+<h2 id="Dar_formato_a_elementos_HTML">Dar formato a elementos HTML</h2>
+
+<p>Al poner nuestro título de encabezado en rojo, ya hemos demostrado que podemos elegir un elemento HTML y darle formato. Hacemos esto con un <em>selector de elementos</em>: un selector que coincide directamente con el nombre de un elemento HTML. Para determinar todos los párrafos del documento, se usa el selector <code>p</code>. Para hacer que todos los párrafos se vean verdes se usa:</p>
+
+<pre class="brush: css notranslate">p {
+  color: green;
+}</pre>
+
+<p>Puedes determinar múltiples selectores a la vez, separándolos con una coma. Si queremos que todos los párrafos y todos los elementos de la lista sean verdes, el código se verá así:</p>
+
+<pre class="brush: css notranslate">p, li {
+    color: green;
+}</pre>
+
+<p>Pruébalo en el editor interactivo que encontrarás a continuación (edita los cuadros de código) o en tu documento CSS.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/started1.html", '100%', 900)}} </p>
+
+<h2 id="Cambiar_el_comportamiento_predeterminado_de_los_elementos">Cambiar el comportamiento predeterminado de los elementos</h2>
+
+<p>Cuando miramos un documento HTML bien marcado, incluso con algo tan simple como nuestro ejemplo, podemos ver que el navegador facilita la legibilidad de este documento HTML al añadir un estilo predeterminado. Los títulos se muestran grandes y en negrita, y la lista tiene viñetas. Esto sucede porque los navegadores tienen hojas de estilo internas que contienen estilos predeterminados, los cuales se aplican a todas las páginas por defecto. Sin ellos, todo el texto se uniría en un grupo y tendríamos que darle formato desde cero. Todos los navegadores modernos muestran el contenido HTML por defecto de la misma manera.</p>
+
+<p>Sin embargo, a menudo querrás algo diferente a la elección que ha hecho el navegador. Esto se puede solucionar con el simple hecho de escoger el elemento HTML que deseas cambiar y utilizar una regla CSS para cambiar su apariencia.  Un buen ejemplo es <code>&lt;ul&gt;</code>, que muestra una lista desordenada. Tiene viñetas y, si decidimos que no las queremos, podemos eliminarlas de este modo:</p>
+
+<pre class="brush: css notranslate">li {
+  list-style-type: none;
+}</pre>
+
+<p>Ahora, intenta añadir esto a tu CSS.</p>
+
+<p>Es muy conveniente consultar en MDN la propiedad <code>list-style-type</code> para ver qué valores admite. Echa un vistazo a la página de <code><a href="/en-US/docs/Web/CSS/list-style-type">list-style-type</a></code> y encontrarás un ejemplo interactivo en la parte superior para probar diferentes valores (todos los permitidos se detallan más abajo en esa misma página).</p>
+
+<p>Al mirar esa página, descubrirás que, además de eliminar las viñetas de la lista, también puedes cambiarlas. Intenta cambiarlas por unas cuadradas utilizando el valor <code>square</code>.</p>
+
+<h2 id="Añadir_una_clase">Añadir una clase</h2>
+
+<p>Hasta ahora, hemos utilizado elementos cuyo nombre se basa en el nombre de elemento que reciben en HTML. Esto funciona siempre que se desee que todos los elementos de ese tipo tengan el mismo aspecto en el documento. La mayoría de las veces no es el caso, por lo que deberás encontrar una manera de seleccionar un subconjunto de los elementos sin que cambien los demás. La forma más común de hacer esto es añadir una clase al elemento HTML y determinarla.</p>
+
+<p>En tu documento HTML, añade al segundo elemento de la lista un <a href="/es/docs/Web/HTML/Atributos_Globales/class">atributo de clase</a>. Debería verse así:</p>
+
+<pre class="brush: html notranslate">&lt;ul&gt;
+  &lt;li&gt;Punto uno&lt;/li&gt;
+  &lt;li <strong>class = "special"</strong>&gt;Punto dos&lt;/li&gt;
+  &lt;li&gt;Punto &lt;em&gt;tres&lt;/em&gt;&lt;/li&gt;
+&lt;/ul&gt;</pre>
+
+<p>En tu CSS, puedes seleccionar una clase <code>special</code> creando un selector que comience con un carácter de punto final. Añade lo siguiente a tu archivo CSS:</p>
+
+<pre class="brush: css notranslate">.special {
+  color: orange;
+  font-weight: bold;
+}</pre>
+
+<p>Guarda y actualiza para ver cuál es el resultado.</p>
+
+<p>Puedes aplicar la clase <code>special</code> a cualquier elemento de la página que desees que tenga el mismo aspecto que este elemento de lista. Por ejemplo, es posible que desees que el <code>&lt;span&gt;</code> del párrafo también sea naranja y en negrita. Intenta añadirle una <code>class</code> <code>special</code>, luego vuelve a cargar la página y observa qué sucede.</p>
+
+<p>A veces verás reglas con un selector que enumera el selector de elementos HTML junto con la clase:</p>
+
+<pre class="brush: css notranslate">li.special {
+  color: orange;
+  font-weight: bold;
+}</pre>
+
+<p>Esta sintaxis significa «determina cualquier elemento <code>li</code> que tenga una clase special». Si hicieras esto, ya no podrías aplicar la clase a un elemento <code>&lt;span&gt;</code> u otro elemento simplemente añadiéndole la clase; tendrías que añadir ese elemento a la lista de selectores:</p>
+
+<pre class="brush: css notranslate">li.special,
+span.special {
+  color: orange;
+  font-weight: bold;
+}</pre>
+
+<p>Como puedes imaginar, algunas clases pueden aplicarse a muchos elementos y no queremos tener que seguir editando el CSS cada vez que algo nuevo necesita adoptar ese estilo. Por lo tanto, a veces es mejor eludir el elemento y simplemente referirse a la clase, a menos que sepas que vas a querer crear algunas reglas especiales para un solo elemento y tal vez quieras asegurarte de que no se apliquen a otros elementos.</p>
+
+<h2 id="Dar_formato_según_la_ubicación_en_un_documento">Dar formato según la ubicación en un documento</h2>
+
+<p>Hay momentos en los que querrás que algo se vea diferente en función de dónde esté en el documento. Hay múltiples selectores que pueden hacerlo, pero por ahora veremos solo un par. En nuestro documento hay dos elementos <code>&lt;em&gt;</code>: uno dentro de un párrafo y el otro dentro de un elemento de la lista. Para seleccionar solo un <code>&lt;em&gt;</code> que esté anidado dentro de un elemento <code>&lt;li&gt;</code>, podemos usar un selector llamado <strong>combinador descendente</strong>, que simplemente toma la forma de un espacio entre otros dos selectores.</p>
+
+<p>Añade la siguiente regla a la hoja de estilo.</p>
+
+<pre class="brush: css notranslate">li em {
+  color: rebeccapurple;
+}</pre>
+
+<p>Este selector separará cualquier elemento <code>&lt;em&gt;</code> que esté dentro de (un descendiente de) <code>&lt;li&gt;</code>. Entonces, en tu documento de ejemplo, deberías encontrar que el <code>&lt;em&gt;</code> del tercer elemento de la lista es morado, pero el que hay en el párrafo no ha cambiado.</p>
+
+<p>Otra cosa que puedes probar es dar formato un párrafo que venga directamente a continuación de un título que esté en el mismo nivel de jerarquía en el HTML. Para hacerlo, coloca un <code>+</code> (un <strong>combinador hermano adyacente</strong>) entre los selectores.</p>
+
+<p>Intenta añadir también esta regla a la hoja de estilo:</p>
+
+<pre class="brush: css notranslate">h1 + p {
+  font-size: 200%;
+}</pre>
+
+<p>El ejemplo que encontrarás a continuación incluye las dos reglas anteriores. Intenta añadir una regla para que un <code>span</code> dentro de un párrafo se vuelva rojo. Sabrás si lo has hecho bien si el <code>&lt;span&gt;</code> en el primer párrafo se vuelve rojo pero el que hay en el primer elemento de la lista no cambia de color.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/started2.html", '100%', 1100)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Como puedes ver, el CSS nos ofrece varias formas de seleccionar elementos, y hasta ahora solo hemos arañado la superficie. Examinaremos todos estos selectores y muchos más en los artículos correspondientes a <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS">Selectores</a> que encontrarás más adelante.</p>
+</div>
+
+<h2 id="Dar_formato_según_el_estado">Dar formato según el estado</h2>
+
+<p>El último tipo de estilo que veremos en este tutorial es la capacidad de dar formato a los elementos en función de su estado. Un ejemplo sencillo es el estilo de los enlaces. Cuando damos formato a un enlace, necesitamos seleccionar el elemento <code><a href="/en-US/docs/Web/HTML/Element/a">&lt;a&gt;</a></code> (anclaje). Tiene diferentes estados dependiendo de si se ha visitado o no, se pasa por encima, o se presiona con el teclado o se hace clic (se activa). Puedes usar CSS para dar formato a estos diferentes estados. El CSS que encontrarás a continuación presenta en color rosa los enlaces que no se han visitado y en verde los que sí.</p>
+
+<pre class="brush: css notranslate">a:link {
+  color: pink;
+}
+
+a:visited {
+  color: green;
+}</pre>
+
+<p>Puedes cambiar la apariencia del enlace, por ejemplo, eliminando el subrayado, lo que se logra mediante la siguiente regla:</p>
+
+<pre class="brush: css notranslate">a:hover {
+  text-decoration: none;
+}</pre>
+
+<p>En el ejemplo que encontrarás a continuación, puedes jugar con diferentes valores para los distintos estados de un enlace. Hemos añadido las reglas anteriores y ahora nos damos cuenta de que el color rosa es demasiado claro y difícil de leer, ¿por qué no cambiarlo a otro que se vea mejor? ¿Puedes poner los enlaces en negrita?</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/started3.html", '100%', 900)}} </p>
+
+<p>Hemos eliminado el subrayado del enlace cuando el ratón se pasa por encima, y se puede eliminar de todos los estados de un enlace. Sin embargo, vale la pena recordar que en una página web real deberás asegurarte de que los visitantes sepan reconocer que se trata de un enlace. Que aparezca subrayado puede ser una pista importante para que las personas se den cuenta de que pueden hacer clic en una palabra dentro del párrafo, ya que es a lo que están acostumbrados. Al igual que con todo en CSS, existe la posibilidad de que tus cambios resten accesibilidad al documento. Intentaremos resaltar estas posibles dificultades en los lugares apropiados.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: a menudo verás que se menciona la <a href="/es/docs/Learn/Accessibility">accesibilidad</a> en estas lecciones y en MDN. Cuando hablamos de accesibilidad nos referimos al requisito de que nuestras páginas web sean comprensibles y usables para todas las personas.</p>
+
+<p>Puede que tu visitante acceda a la página desde un ordenador con ratón o trackpad, o un teléfono inteligente con pantalla táctil. O puede que use un lector de pantalla que lea el contenido del documento, así como puede que necesite un tamaño de texto más grande o navegar por la página usando solo el teclado.</p>
+
+<p>Un documento HTML simple es, generalmente, accesible para todos. Es importante que el documento no pierda accesibilidad a medida que vayas aplicándole estilo.</p>
+</div>
+
+<h2 id="Combinaciones_de_selectores_y_combinadores">Combinaciones de selectores y combinadores</h2>
+
+<p>Vale la pena señalar que puedes hacer múltiples combinaciones de selectores y combinadores. Por ejemplo:</p>
+
+<pre class="brush: css notranslate">/* selecciona cualquier elemento &lt;span&gt; que se encuentre dentro de un &lt;p&gt;, que esté dentro de un &lt;artículo&gt; */
+artículo p span { ... }
+
+/* selecciona cualquier &lt;p&gt; que se encuentre directamente después de &lt;ul&gt;, que va directamente después de &lt;h1&gt; */
+h1 + ul + p { ... }</pre>
+
+<p>También puedes combinar varios tipos juntos. Intenta añadir lo siguiente al código:</p>
+
+<pre class="brush: css notranslate">body h1 + p .special {
+  color: yellow;
+  background-color: black;
+  padding: 5px;
+}</pre>
+
+<p>Dará formato a cualquier elemento con la clase <code>special</code>, dentro de un elemento <code>&lt;p&gt;</code> que venga justo después de <code>&lt;h1&gt;</code>, el cual se encuentra dentro de <code>&lt;body&gt;</code>. ¡Uf!</p>
+
+<p>En el HTML original que proporcionamos, el único elemento al que esto aplica estilo es <code>&lt;span class="special"&gt;</code>.</p>
+
+<p>No te preocupes si ahora mismo te parece complicado: irás acostumbrarte a medida que escribas más CSS.</p>
+
+<h2 id="Para_terminar">Para terminar</h2>
+
+<p>En este tutorial, hemos visto varias formas con las que se puede diseñar un documento usando CSS. Desarrollaremos este conocimiento a medida que avancemos con el resto de las lecciones. Sin embargo, ahora ya sabes lo suficiente como para aplicar estilo al texto, aplicar CSS en función de diferentes formas de determinar elementos en el documento y buscar propiedades y valores en la documentación de MDN.</p>
+
+<p>En el próximo artículo, veremos cómo se estructura el CSS.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/First_steps/What_is_CSS", "Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es el CSS?</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Empezar con CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
+</ol>
diff --git a/files/es/learn/css/first_steps/how_css_is_structured/index.html b/files/es/learn/css/first_steps/how_css_is_structured/index.html
new file mode 100644
index 0000000000..4021804ce5
--- /dev/null
+++ b/files/es/learn/css/first_steps/how_css_is_structured/index.html
@@ -0,0 +1,513 @@
+---
+title: Cómo se estructura el CSS
+slug: Learn/CSS/First_steps/How_CSS_is_structured
+translation_of: Learn/CSS/First_steps/How_CSS_is_structured
+original_slug: Learn/CSS/First_steps/Como_se_estructura_CSS
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</div>
+
+<p class="summary">Ahora que ya sabes qué es el CSS y conoces sus conceptos básicos, es hora de profundizar un poco más en la estructura del lenguaje en sí. Ya hemos visto muchos de los conceptos que aparecen en este artículo; puedes volver para recapitular si más adelante encuentras conceptos confusos.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico instalado</a>, conocimientos básicos de <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajo con archivos</a>, conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y una idea de <a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">cómo funciona el CSS</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender en detalle las estructuras de sintaxis fundamentales de CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Aplicar_CSS_al_HTML">Aplicar CSS al HTML</h2>
+
+<p>Lo primero que veremos son los tres métodos para aplicar CSS a un documento.</p>
+
+<h3 id="Hoja_de_estilo_externa">Hoja de estilo externa</h3>
+
+<p>En <a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Empezar con el CSS</a>, vinculamos una hoja de estilo externa a nuestra página. Este es el método más común y útil para adjuntar CSS a un documento, porque puedes vincular el CSS a varias páginas y dar estilo a todas ellas con la misma hoja de estilo. En la mayoría de los casos, las diferentes páginas de un sitio web se verán más o menos iguales, de modo que puedes usar el mismo conjunto de reglas para el aspecto y la interacción básicos.</p>
+
+<p>Una hoja de estilo externa significa que el CSS está escrito en un archivo independiente con una extensión <code>.css</code> y que lo vinculas desde un elemento <code>&lt;link&gt;</code> de HTML:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Mi experimento CSS&lt;/title&gt;
+    &lt;link rel="stylesheet" href="styles.css"&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;h1&gt;¡Hola, mundo!&lt;/h1&gt;
+    &lt;p&gt;Este es mi primer ejemplo de CSS&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>El archivo CSS podría parecerse a esto:</p>
+
+<pre class="brush: css notranslate">h1 {
+  color: blue;
+  background-color: yellow;
+  border: 1px solid black;
+}
+
+p {
+  color: red;
+}</pre>
+
+<p>El atributo <code>href</code> del elemento {{htmlelement("link")}} tiene que hacer referencia a un archivo de tu sistema de archivos.</p>
+
+<p>En el ejemplo anterior, el archivo CSS está en la misma carpeta que el documento HTML, pero puedes colocarlo en otro lugar y especificar la ruta adecuada. Por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;!-- Dentro de un subdirectorio llamado styles dentro del directorio de trabajo --&gt;
+&lt;link rel="stylesheet" href="styles/style.css"&gt;
+
+&lt;!-- Dentro de un subdirectorio llamado general, que está en un subdirectorio llamado styles, dentro del directorio de trabajo --&gt;
+&lt;link rel="stylesheet" href="styles/general/style.css"&gt;
+
+&lt;!-- Sube un nivel de directorio, y luego dentro de un subdirectorio llamado styles --&gt;
+&lt;link rel="stylesheet" href="../styles/style.css"&gt;</pre>
+
+<h3 id="Hoja_de_estilo_interna">Hoja de estilo interna</h3>
+
+<p>Una hoja de estilo interna es cuando no hay ningún archivo CSS externo, sino que colocas tu CSS dentro de un elemento {{htmlelement("style")}} contenido dentro del elemento {{htmlelement("head")}} del HTML.</p>
+
+<p>En este caso, el HTML se vería así:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Mi experimento CSS&lt;/title&gt;
+    &lt;style&gt;
+      h1 {
+        color: blue;
+        background-color: yellow;
+        border: 1px solid black;
+      }
+
+      p {
+        color: red;
+      }
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;h1&gt;¡Hola, mundo!&lt;/h1&gt;
+    &lt;p&gt;Este es mi primer ejemplo de CSS&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>Esto puede ser útil en algunas circunstancias (tal vez estés trabajando con un sistema de administración de contenido donde no sea posible modificar los archivos CSS directamente), pero no es tan eficiente como las hojas de estilo externas: en una página web, deberías repetir el CSS en cada página y actualizarlo en varios lugares en caso de que hubiera que hacer cambios.</p>
+
+<h3 id="Estilos_en_línea">Estilos en línea</h3>
+
+<p>Los estilos en línea son declaraciones CSS que afectan a un solo elemento, contenido dentro de un atributo de <code>style</code>:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Mi experimento CSS&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;h1 style="color: blue;background-color: yellow;border: 1px solid black;"&gt;¡Hola mundo!&lt;/h1&gt;
+    &lt;p style="color:red;"&gt;Este es mi primer ejemplo de CSS&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p><strong>¡No hagas esto a menos que realmente tengas que hacerlo!</strong> Es realmente malo a la hora de realizar el mantenimiento (puede que tengas que actualizar la misma información varias veces en un mismo documento), y además mezcla tu información CSS para la presentación con tu información HTML para la estructura, lo que dificulta la lectura y la comprensión del código. Mantener los diferentes tipos de código separados facilita trabajar con ellos.</p>
+
+<p>Hay ciertos lugares donde los estilos en línea son más comunes, o incluso aconsejables. Es posible que tengas que recurrir a ellos si realmente tu entorno de trabajo es restrictivo (tal vez el CMS solo te permita editar el cuerpo del HTML). También verás que se usan mucho en el correo electrónico en formato HTML para lograr la máxima compatibilidad con el mayor número de clientes.</p>
+
+<h2 id="Juguemos_con_el_CSS_de_este_artículo">Juguemos con el CSS de este artículo</h2>
+
+<p>En este artículo hay mucho CSS con el que jugar. Para hacerlo, recomendamos crear un nuevo directorio/carpeta en el ordenador, dentro de la cual deberás crear una copia de los siguientes dos archivos:</p>
+
+<p><strong>index.html:</strong></p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html lang="en"&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Mis experimentos CSS&lt;/title&gt;
+    &lt;link rel="stylesheet" href="styles.css"&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+
+    &lt;p&gt;Crea tu HTML de prueba aquí&lt;/p&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p><strong>styles.css:</strong></p>
+
+<pre class="brush: css notranslate">/* Crea tu CSS de prueba aquí */
+
+p {
+  color: red;
+}</pre>
+
+<p>Entonces, cuando te encuentres con un CSS con el que desees experimentar, reemplaza el contenido <code>&lt;body&gt;</code> del HTML con algo de HTML sin estilos y añade CSS a tu archivo de CSS para darle estilo.</p>
+
+<p>Si no estás en un sistema donde puedas crear archivos fácilmente, puedes utilizar el editor interactivo que encontrarás a continuación para experimentar.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/experiment-sandbox.html", '100%', 800)}} </p>
+
+<p>¡Sigue leyendo y disfruta!</p>
+
+<h2 id="Selectores">Selectores</h2>
+
+<p>No se puede hablar de CSS sin mencionar los selectores, de los cuales ya hemos descubierto varios tipos diferentes en la lección <a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Empezar con el CSS</a>. Un selector es, como determinamos, un elemento de nuestro documento HTML para aplicarle estilo. Si los estilos no se aplican correctamente, es probable que el selector no coincida con lo que crees que debería coincidir.</p>
+
+<p>Cada regla CSS comienza con un selector o una lista de selectores que indican al navegador a qué elemento o elementos deben aplicarse dichas reglas. Todos los siguientes son ejemplos de selectores válidos o listas de selectores.</p>
+
+<pre class="brush: css notranslate">h1
+a:link
+.manythings
+#onething
+*
+.box p
+.box p:first-child
+h1, h2, .intro</pre>
+
+<p><strong>Prueba a crear algunas reglas CSS que usen los selectores anteriores y algo de HTML sin estilos. Si no conoces alguna de las sintaxis anteriores, ¡prueba a buscarla en MDN!</strong></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Aprenderás mucho más sobre los selectores en nuestros tutoriales sobre <a href="/es/docs/Learn/CSS/Building_blocks/Selectores_CSS">selectores CSS</a> de la próxima lección.</p>
+</div>
+
+<h3 id="Especificidad">Especificidad</h3>
+
+<p>A menudo habrá situaciones en las que dos selectores podrían determinar un mismo elemento HTML. Considera la siguiente hoja de estilo, en que definimos una regla con un selector <code>p</code> que establecerá los párrafos en color azul, y también una clase que establecerá los elementos seleccionados en color rojo.</p>
+
+<pre class="brush: css notranslate">.special {
+  color: red;
+}
+
+p {
+  color: blue;
+}</pre>
+
+<p>Digamos que en nuestro documento HTML hay un párrafo con una clase <code>special</code>. Ambas reglas podrían aplicarse. ¿Cuál ganará? ¿De qué color crees que será nuestro párrafo?</p>
+
+<pre class="brush: html notranslate">&lt;p class="special"&gt;¿De qué color soy?&lt;/p&gt;</pre>
+
+<p>El lenguaje CSS tiene reglas para controlar cuál ganará en caso de colisión; reciben el nombre de <strong>cascada</strong> y <strong>especificidad</strong>. En el siguiente bloque de códigos hemos definido dos reglas para el selector <code>p</code>, pero el párrafo termina siendo de color azul. Esto se debe a que la declaración que lo establece en azul aparece más abajo en la hoja de estilo, y los estilos posteriores anulan a los anteriores. Así funciona la regla de la cascada.</p>
+
+<pre class="brush: css notranslate">p {
+  color: red;
+}
+
+p {
+  color: blue;
+}</pre>
+
+<p>Sin embargo, en el caso de nuestro primer bloque, que contiene un selector de clase y otro de elementos, la clase ganará. Esto hará que el párrafo sea rojo, incluso aunque aparezca antes en la hoja de estilo. Una clase se describe de forma más específica o con más especificidad que el selector de elementos, razón por la que gana.</p>
+
+<p><strong>Prueba el ejemplo anterior: añade el HTML a tu experimento, luego pon las dos reglas <code>p { ... }</code> a tu hoja de estilo. A continuación, cambia el primer selector <code>p</code> por <code>.special</code> para ver cómo cambia el estilo.</strong></p>
+
+<p>Las reglas de especificidad y de cascada pueden parecer un poco complicadas al principio. Son más fáciles de entender a medida que se van adquiriendo conocimientos de CSS. En nuestro artículo sobre <a href="/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia">Cascada y herencia</a>, que abordaremos en la próxima lección, se explicará en detalle, incluyendo cómo calcular la especificidad. Por ahora, solo has de saber que existe y que a veces el CSS no se aplica como esperas porque algo más en la hoja de estilo tiene una mayor especificidad. El hecho de identificar que más de una regla podría aplicarse a un elemento es el primer paso para solucionar estos problemas.</p>
+
+<h2 id="Propiedades_y_valores">Propiedades y valores</h2>
+
+<p>En su nivel más básico, el CSS consta de dos componentes básicos:</p>
+
+<ul>
+ <li><strong>Propiedades</strong>: Identificadores legibles por los humanos que indican qué características de estilo (por ejemplo, <code><a href="/en-US/docs/Web/CSS/font-size">font-size</a></code>, <code><a href="/en-US/docs/Web/CSS/width">width</a></code>, <code><a href="/en-US/docs/Web/CSS/background-color">background-color</a></code>) deseas cambiar.</li>
+ <li><strong>Valores</strong>: A cada propiedad especificada se le asigna un valor que indica cómo quieres que cambien esas características de estilo (por ejemplo, lo que quieres que cambie de la fuente, el ancho o el color de fondo).</li>
+</ul>
+
+<p>La siguiente imagen resalta una sola propiedad y valor. El nombre de la propiedad es <code>color</code> y el valor <code>blue</code>.</p>
+
+<p><img alt="Una declaración resaltada en el CSS" src="https://mdn.mozillademos.org/files/16498/declaration.png" style="border: 1px solid #cccccc; display: block; height: 218px; margin: 0 auto; width: 471px;"></p>
+
+<p>Una propiedad emparejada con un valor se denomina <em>declaración CSS</em>. Las declaraciones CSS se colocan dentro de los <em>bloques de declaración CSS</em>. La siguiente imagen muestra nuestro CSS con el bloque de declaración resaltado.</p>
+
+<p><img alt="Un bloque de declaración resaltado" src="https://mdn.mozillademos.org/files/16499/declaration-block.png" style="border: 1px solid #cccccc; display: block; height: 218px; margin: 0 auto; width: 471px;"></p>
+
+<p>Finalmente, los bloques de declaración CSS se combinan con <em>selectores</em> para producir <em>conjuntos de reglas CSS</em> (o <em>reglas CSS</em>). Nuestra imagen contiene dos reglas, una para el selector <code>h1</code> y otra para el selector <code>p</code>. La regla para <code>h1</code> está resaltada.</p>
+
+<p><img alt="La regla para h1 resaltada" src="https://mdn.mozillademos.org/files/16500/rules.png" style="border: 1px solid #cccccc; display: block; height: 218px; margin: 0 auto; width: 471px;"></p>
+
+<p>Establecer las propiedades de CSS según valores específicos es la función principal del lenguaje CSS. El motor CSS calcula qué declaraciones se aplican a cada elemento de una página para darle la compaginación y los estilos adecuados.</p>
+
+<div class="blockIndicator warning">
+<p><strong>Importante:</strong> Las propiedades y valores de CSS son sensibles a mayúsculas y minúsculas. La propiedad y el valor de cada par están separados por dos puntos (<code>:</code>).</p>
+</div>
+
+<p><strong>Prueba a buscar diferentes valores de las siguientes propiedades y escribe reglas CSS que se puedan aplicar a diferentes elementos HTML: </strong></p>
+
+<ul>
+ <li><strong>{{cssxref("font-size")}}</strong></li>
+ <li><strong>{{cssxref("width")}}</strong></li>
+ <li><strong>{{cssxref("background-color")}}</strong></li>
+ <li><strong>{{cssxref("color")}}</strong></li>
+ <li><strong>{{cssxref("border")}}</strong></li>
+</ul>
+
+<div class="warning">
+<p><strong>Importante</strong>: Si una propiedad es desconocida o si un valor no es válido para una propiedad determinada, la declaración se considera <em>inválida</em> y el motor CSS del navegador la ignora por completo.</p>
+</div>
+
+<div class="warning">
+<p><strong>Importante</strong>: En CSS (y otros estándares web) se ha acordado establecer como estándar la ortografía en inglés de los EE. UU. para solucionar las incertidumbres idiomáticas. Por ejemplo, <em>siempre</em> hay que escribir <code>color</code>. Si se escribe <code>colour</code>, no funcionará.</p>
+</div>
+
+<h3 id="Las_funciones">Las funciones</h3>
+
+<p>Si bien la mayoría de valores son palabras clave relativamente simples o valores numéricos, es posible que algunos valores tomen la forma de una función. Un ejemplo sería la función <code>calc()</code>. Esta función te permite hacer operaciones matemáticas sencillas desde tu CSS, por ejemplo:</p>
+
+<div id="calc_example">
+<pre class="brush: html notranslate">&lt;div class="external"&gt; &lt;div class="box"&gt;La caja interior es del 90% - 30px.&lt;/div&gt;&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">.outer {
+  border: 5px solid black;
+}
+
+.box {
+  padding: 10px;
+  width: calc(90% - 30px);
+  background-color: rebeccapurple;
+  color: white;
+}</pre>
+</div>
+
+<p>Esto se traduce así:</p>
+
+<p>{{EmbedLiveSample('calc_example', '100%', 200)}}</p>
+
+<p>Una función consta del nombre de la función y, a continuación, unos paréntesis entre los que se colocan los valores permitidos para esa función. En el caso del ejemplo <code>calc()</code> anterior, pedimos que el ancho de esta caja sea del 90% del ancho del bloque que la contiene, menos 30 píxeles. Esto no es algo que podamos calcular con anticipación y simplemente introducir el valor en el CSS, ya que no sabemos cuál será el 90%. Como con todos los valores, la página correspondiente del proyecto MDN tendrá ejemplos de uso para que puedas ver cómo funciona.</p>
+
+<p>Otro ejemplo serían los diversos valores para {{cssxref ("transform")}}, como <code>rotate()</code>.</p>
+
+<div id="transform_example">
+<pre class="brush: html notranslate">&lt;div class="box"&gt;&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">.box {
+  margin: 30px;
+  width: 100px;
+  height: 100px;
+  background-color: rebeccapurple;
+  transform: rotate(0.8turn)
+}</pre>
+</div>
+
+<p>El resultado del código anterior se ve así:</p>
+
+<p>{{EmbedLiveSample('transform_example', '100%', 200)}}</p>
+
+<p><strong>Prueba a buscar diferentes valores de las siguientes propiedades y escribe reglas CSS que se apliquen a diferentes elementos HTML: </strong></p>
+
+<ul>
+ <li><strong>{{cssxref("transform")}}</strong></li>
+ <li><strong>{{cssxref ("background-image")}}, en particular a valores de gradiente</strong></li>
+ <li><strong>{{cssxref("color")}}, en particular a valores rgb/rgba/hsl/hsla</strong></li>
+</ul>
+
+<h2 id="rules">@rules</h2>
+
+<p>Las <code><a href="/es/docs/Web/CSS/At-rule">@rules</a></code> (leído "at-rules" en inglés) dan al CSS algunas instrucciones sobre cómo comportarse. Algunas <code>@rules</code> son simples, con el nombre de la regla y un valor. Por ejemplo, para importar una hoja de estilo adicional a tu hoja de estilo CSS principal, puedes usar <code>@import</code>:</p>
+
+<pre class="brush: css notranslate">@import 'styles2.css';</pre>
+
+<p>Una de las <code>@rules</code> más comunes con las que te encontrarás es <code>@media</code>, que permite usar <a href="/es/docs/Web/CSS/Media_Queries">consultas a medios</a> para aplicar CSS solo cuando se dan ciertas condiciones (por ejemplo, cuando la resolución de la pantalla supera un valor determinado o la anchura supera un valor concreto).</p>
+
+<p>En el CSS que se muestra a continuación, tenemos una hoja de estilo que le da al elemento <code>&lt;body&gt;</code> un color de fondo rosado. Sin embargo, luego usamos <code>@media</code> para crear una sección de nuestra hoja de estilo que solo se aplicará en los navegadores con una ventana gráfica de más de 30em de ancho. Si el navegador es más ancho que 30em, el color de fondo será azul.</p>
+
+<pre class="brush: css notranslate">body {
+  background-color: pink;
+}
+
+@media (min-width: 30em) {
+  body {
+    background-color: blue;
+  }
+}</pre>
+
+<p>Encontrarás otras <code>@rules</code> a lo largo de estas lecciones.</p>
+
+<p><strong>Prueba a añadir una consulta a medios en tu CSS que cambie los estilos según el ancho de la ventana gráfica. Cambia el ancho de la ventana de tu navegador para ver el resultado.</strong></p>
+
+<h2 id="Abreviaturas">Abreviaturas</h2>
+
+<p>Algunas propiedades como {{cssxref("font")}}, {{cssxref("background")}}, {{cssxref("padding")}}, {{cssxref("border")}} y {{ cssxref("margin")}} se llaman <strong>propiedades abreviadas</strong>. Esto se debe a que permiten establecer varios valores de propiedad en una sola línea, lo que ahorra tiempo y ordena el código.</p>
+
+<p>Por ejemplo, esta línea:</p>
+
+<pre class="brush: css notranslate">/* En propiedades abreviadas con 4 valores, como margin y padding (relleno), los valores se aplican
+   según el orden: arriba, derecha, abajo e izquierda (en sentido horario desde la parte superior). También hay otros
+   tipos de abreviaturas, como las propiedades abreviadas con 2 valores que establecen el relleno/margen,
+   arriba/abajo, y luego izquierda/derecha */
+padding: 10px 15px 15px 5px;</pre>
+
+<p>Hace lo mismo que todas estas juntas:</p>
+
+<pre class="brush: css notranslate">padding-top: 10px;
+padding-right: 15px;
+padding-bottom: 15px;
+padding-left: 5px;</pre>
+
+<p>Mientras que esta línea:</p>
+
+<pre class="brush: css notranslate">background: red url(bg-graphic.png) 10px 10px repeat-x fixed;</pre>
+
+<p>Hace lo mismo que todas estas juntas:</p>
+
+<pre class="brush: css notranslate">background-color: red;
+background-image: url(bg-graphic.png);
+background-position: 10px 10px;
+background-repeat: repeat-x;
+background-scroll: fixed;</pre>
+
+<p>Ahora mismo no pretendemos enseñarlos exhaustivamente: encontrarás muchos ejemplos más adelante en el curso. Te aconsejamos que busques los nombres de las propiedades abreviadas en nuestra <a href="/es/docs/Web/CSS/Referencia_CSS">referencia CSS</a> para obtener más información.</p>
+
+<p><strong>Prueba a añadir las declaraciones anteriores a tu CSS para ver cómo afecta al estilo de tu HTML. Experimenta con diferentes valores.</strong></p>
+
+<div class="blockIndicator warning">
+<p><strong>Advertencia</strong>: Si bien las propiedades abreviadas a menudo permiten ahorrarte valores, luego restablecerán a sus valores iniciales cualquier valor que no incluyas. Esto asegura que se use un conjunto de valores razonable. Sin embargo, puede resultar confuso si esperas que la propiedad abreviada solo cambie los valores que has introducido.</p>
+</div>
+
+<h2 id="Comentarios">Comentarios</h2>
+
+<p>Al igual que con el HTML, te recomendamos que hagas comentarios en tu CSS para que te ayuden a comprender cómo funciona su código cuando vuelvas a utilizarlo al cabo de varios meses, así como para ayudar a otros que vayan a trabajar con él a entenderlo.</p>
+
+<p>Los comentarios en el CSS comienzan con <code>/*</code> y terminan con <code>*/</code>. En el bloque de código que encontrarás a continuación, hemos usado comentarios para marcar el inicio de las diferentes secciones de código. Esto es útil para ayudarnos a movernos por la base de código a medida que aumenta: puedes buscar los comentarios en tu editor de código.</p>
+
+<pre class="brush: css notranslate">/* con elementos básicos de aplicación de estilo */
+/* -------------------------------------------------------------------------------------------- */
+body {
+  font: 1em/150% Helvética, Arial, sans-serif;
+  padding: 1em;
+  margin: 0 auto;
+  max-width: 33em;
+}
+
+@media (min-width: 70em) {
+  /* Prestemos especial atención al tamaño de fuente global. En una pantalla o una ventana grande,
+     aumentamos el tamaño de la fuente para conseguir una mejor legibilidad */
+  body {
+    font-size: 130%;
+  }
+}
+
+h1 {font-size: 1.5em;}
+
+/* Familiarización con algunos elementos anidados específicos en el DOM */
+/* -------------------------------------------------------------------------------------------- */
+div p, #id:first-line {
+  background-color: red;
+  border-radius: 3px;
+}
+
+div p {
+  margin: 0;
+  padding: 1em;
+}
+
+div p + p {
+  padding-top: 0;
+}</pre>
+
+<p>Los comentarios también son útiles para <em>comentar</em> temporalmente ciertas partes del código con fines de prueba, por ejemplo, si tratas de encontrar qué parte de tu código causa un error. En el siguiente ejemplo, hemos comentado las reglas para el selector <code>.special</code>.</p>
+
+<pre class="brush: css notranslate">/*.special {
+  color: red;
+}*/
+
+p {
+  color: blue;
+}</pre>
+
+<p><strong>Añade algunos comentarios al CSS para acostumbrarte a usarlos.</strong></p>
+
+<h2 id="Espacio_en_blanco">Espacio en blanco</h2>
+
+<p>Por espacio en blanco nos referimos los espacios en sí, tabuladores y retornos de carro o intros. De la misma manera que el HTML, el navegador ignora el espacio en blanco dentro del CSS. El valor del espacio en blanco es que puede mejorar la legibilidad.</p>
+
+<p>En el siguiente ejemplo, cada declaración (y el principio/fin de regla) está en una línea propia; esta es posiblemente una buena forma de escribir el CSS, ya que facilita el mantenimiento y la comprensión:</p>
+
+<pre class="brush: css notranslate">body {
+  font: 1em/150% Helvética, Arial, sans-serif;
+  padding: 1em;
+  margin: 0 auto;
+  max-width: 33em;
+}
+
+@media (min-width: 70em) {
+  body {
+    font-size: 130%;
+  }
+}
+
+h1 {
+  font-size: 1.5em;
+}
+
+div p,
+#id:first-line {
+  background-color: red;
+  border-radius: 3px;
+}
+
+div p {
+  margin: 0;
+  padding: 1em;
+}
+
+div p + p {
+  padding-top: 0;
+}
+</pre>
+
+<p id="Very_compact">Podrías escribir exactamente el mismo CSS eliminando la mayoría de los espacios en blanco; este bloque de código es funcionalmente idéntico al primer ejemplo, pero seguro que estarás de acuerdo en que resulta algo más difícil de leer:</p>
+
+<pre class="brush: css notranslate">body {font: 1em/150% Helvetica, Arial, sans-serif; padding: 1em; margin: 0 auto; max-width: 33em;}
+@media (min-width: 70em) { body {font-size: 130%;} }
+
+h1 {font-size: 1.5em;}
+
+div p, #id:first-line {background-color: red; border-radius: 3px;}
+div p {margin: 0; padding: 1em;}
+div p + p {padding-top: 0;}
+</pre>
+
+<p>La manera que elijas para disponer el código suele ser una preferencia personal, aunque cuando comiences a trabajar en equipo es posible que encuentres que el equipo ya tiene su propia guía de estilo que especifica una convención acordada a seguir.</p>
+
+<div class="blockIndicator warning">
+<p><strong>Importante:</strong> Aunque los valores de las declaraciones CSS se separan por espacios, <strong>los nombres de propiedad nunca tienen espacios</strong>.</p>
+</div>
+
+<p>Por ejemplo, las siguientes declaraciones de CSS son válidas:</p>
+
+<pre class="brush: css notranslate">margin: 0 auto;
+padding-left: 10px;</pre>
+
+<p>Pero las siguientes no lo son:</p>
+
+<pre class="brush: css notranslate">margin: 0auto;
+padding- left: 10px;</pre>
+
+<p>¿Ves los errores de espaciado? <code>0auto</code> no se reconoce como un valor válido para la propiedad de <code>margin</code> (<code>0</code> y <code>auto</code> son dos valores separados) y el navegador no reconoce <code>padding-</code> como una propiedad válida. El valor correcto de propiedad (<code>padding-left</code>) se ha separado por un espacio perdido.</p>
+
+<p>Debes asegurarte siempre de separar los valores distintos entre sí por al menos un espacio, pero mantén los nombres de las propiedades y los valores de las propiedades juntos.</p>
+
+<p><strong>Prueba a jugar con los espacios en blanco de tu CSS y observa qué es lo que se rompe y lo que no.</strong></p>
+
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+
+<p>Resulta útil entender un poco cómo el navegador toma tu HTML y tu CSS y los convierte en una página web, razón por la cual en el próximo artículo (<a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">Cómo funciona el CSS</a>) veremos ese proceso.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</p>
+
+<h2 id="En_este_modulo">En este modulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es el CSS?</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Empezar con el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
+</ol>
diff --git a/files/es/learn/css/first_steps/how_css_works/index.html b/files/es/learn/css/first_steps/how_css_works/index.html
new file mode 100644
index 0000000000..74c3e7fc06
--- /dev/null
+++ b/files/es/learn/css/first_steps/how_css_works/index.html
@@ -0,0 +1,157 @@
+---
+title: Cómo funciona CSS
+slug: Learn/CSS/First_steps/How_CSS_works
+translation_of: Learn/CSS/First_steps/How_CSS_works
+original_slug: Learn/CSS/First_steps/Como_funciona_CSS
+---
+<p>{{LearnSidebar}}<br>
+ {{PreviousMenuNext("Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps/Using_your_new_knowledge", "Learn/CSS/First_steps")}}</p>
+
+<p class="summary">Hemos aprendido los conceptos básicos de CSS, para qué sirve y cómo escribir hojas de estilo simples. En esta lección vamos a echar un vistazo a cómo un navegador crea una página web a partir de CSS y HTML.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, tener el <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">software básico</a> instalado, conocimientos básicos de cómo <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a> y conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Entender los conceptos básicos de cómo el navegador analiza el CSS y el HTML y lo que sucede cuando encuentra un CSS que no entiende.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Cómo_funciona_realmente_el_CSS">¿Cómo funciona realmente el CSS?</h2>
+
+<p>Cuando un navegador muestra un documento, ha de combinar el contenido con la información de estilo del documento. Procesa el documento en una serie de etapas, que enumeraremos a continuación. Ten en cuenta que este es un modelo muy simplificado de lo que sucede cuando un navegador carga una página web y que cada navegador gestiona el proceso de manera diferente. Pero esto es más o menos lo que sucede.</p>
+
+<ol>
+ <li>El navegador carga el HTML (por ejemplo, lo recibe de la red).</li>
+ <li>Convierte el {{Glossary("HTML")}} en un {{Glossary("DOM")}} (<em>Modelo de objetos del documento</em>). El DOM representa el documento en la memoria del ordenador. Lo explicaremos más detalladamente en la sección siguiente.</li>
+ <li>Entonces, el navegador va a buscar la mayor parte de los recursos vinculados al documento HTML, como las imágenes y los videos incrustados... ¡y también el CSS vinculado! JavaScript aparece un poco más adelante en el proceso, pero no vamos a hablar de ello aún para evitar complicar las cosas.</li>
+ <li>El navegador analiza el CSS y ordena en diferentes «cubos» las diferentes reglas según el tipo de selector. Por ejemplo, elemento, clase, ID, y así sucesivamente. Para cada tipo de selector que encuentres, calcula qué reglas deben aplicarse y a qué nodos en el DOM se les aplica el estilo según corresponda (este paso intermedio se llama árbol de renderización).</li>
+ <li>El árbol de renderización presenta la estructura en que los nodos deben aparecer después de aplicarle las reglas.</li>
+ <li>En la pantalla se muestra el aspecto visual de la página (esta etapa se llama pintura).</li>
+</ol>
+
+<p>El siguiente diagrama ofrece una visión sencilla de este proceso.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11781/rendering.svg" style="height: auto; max-width: 635px; width: 100%;"></p>
+
+<h2 id="Acerca_del_DOM">Acerca del DOM</h2>
+
+<p>Un DOM tiene una estructura en forma de árbol. Cada elemento, atributo o bloque en el lenguaje de marcado se convierte en un {{Glossary("Node/DOM","nodo DOM")}} con estructura de árbol. Los nodos se definen por su relación con otros nodos DOM. Algunos elementos son padres de nodos secundarios, y estos nodos hijos tienen hermanos.</p>
+
+<p>Comprender el DOM te ayuda a diseñar, depurar y mantener tu CSS porque en el DOM es donde tu CSS se encuentra con el contenido del documento. Cuando comiences a trabajar con las herramientas DevTools (o herramientas del desarrollador) del navegador, te moverás por el DOM mientras seleccionas elementos con el fin de ver qué reglas se aplican.</p>
+
+<h2 id="Una_representación_real_de_un_DOM">Una representación real de un DOM</h2>
+
+<p>En lugar de una explicación larga y aburrida, veamos un ejemplo para entender cómo un código HTML se convierte en DOM.</p>
+
+<p>Tomemos el siguiente código HTML:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;
+  Usaremos:
+  &lt;span&gt;Hojas&lt;/span&gt;
+  &lt;span&gt;de estilo&lt;/span&gt;
+  &lt;span&gt;en cascada&lt;/span&gt;
+&lt;/p&gt;
+</pre>
+
+<p>En el DOM, el nodo que se corresponde con nuestro elemento <code>&lt;p&gt;</code> es un padre. Sus hijos son un nodo de texto y los tres nodos correspondientes a nuestros elementos <code>&lt;span&gt;</code>. Los nodos <code>SPAN</code> son también los <span style="background-color: #f5f6f5;">padres</span>, y los nodos de texto sus hijos:</p>
+
+<pre class="notranslate">P
+├─ "Usaremos:"
+├─ SPAN
+|  └─ "Hojas"
+├─ SPAN
+|  └─ "de estilo"
+└─ SPAN
+   └─ "en cascada"
+</pre>
+
+<p>Así es como un navegador interpreta el código HTML anterior, interpreta el árbol DOM y luego lo muestra en el navegador, así:</p>
+
+<p>{{EmbedLiveSample('Una_representación_real_de_un_DOM', '100%', 55)}}</p>
+
+<div class="hidden">
+<pre class="brush: css notranslate">p {margin:0;}</pre>
+</div>
+
+<h2 id="La_aplicación_de_CSS_al_DOM">La aplicación de CSS al DOM</h2>
+
+<p>Pongamos que hemos añadido un poco de CSS a nuestro documento, para darle estilo. Una vez más, el HTML es el siguiente:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;
+  Usaremos:
+  &lt;span&gt;Hojas&lt;/span&gt;
+  &lt;span&gt;de estilo&lt;/span&gt;
+  &lt;span&gt;en cascada&lt;/span&gt;
+&lt;/p&gt;</pre>
+
+<p>Supongamos que le aplicamos el CSS siguiente:</p>
+
+<pre class="brush: css notranslate">span {
+  border: 1px solid black;
+  background-color: lime;
+}</pre>
+
+<p>El navegador analizará el código HTML y creará un DOM a partir de este. A continuación, analizará el CSS. Dado que la única regla disponible en el CSS tiene un selector <code>span</code>, el navegador ¡ordenará el CSS muy rápidamente! Aplicará la regla a cada uno de los tres <code>&lt;span&gt;</code>, que mostrarán en pantalla la representación visual final.</p>
+
+<p>La salida actualizada es la siguiente:</p>
+
+<p>{{EmbedLiveSample ( 'La_aplicación_de_CSS_al_DOM', '100%', 55)}}</p>
+
+<p>En nuestro artículo <a href="/es/docs/Learn/CSS/Building_blocks/Depurar_el_CSS">Depurar el CSS</a> que encontrarás en el siguiente módulo, vamos a utilizar las herramientas DevTools del navegador para depurar posibles problemas en el CSS. También aprenderemos más sobre cómo el navegador interpreta el CSS.</p>
+
+<h2 id="¿Qué_ocurre_si_un_navegador_encuentra_CSS_que_no_entiende">¿Qué ocurre si un navegador encuentra CSS que no entiende?</h2>
+
+<p>En una <a href="/es/docs/Learn/CSS/First_steps/Qu%C3%A9_es_CSS#Soporte_del_navegador">lección anterior</a> mencionamos que no todos los navegadores implementan las novedades de CSS en el mismo momento. Además, no todo el mundo utiliza la última versión de un navegador. Dado que el CSS está en desarrollo constante y, por lo tanto, por delante de lo que los navegadores pueden reconocer, puede que te preguntes qué sucede si un navegador encuentra un selector o una declaración CSS que no reconoce.</p>
+
+<p>La respuesta es que no hace nada y simplemente pasa a la siguiente parte del CSS.</p>
+
+<p>Si un navegador analiza tus reglas y encuentra una propiedad o un valor que no entiende, lo ignora y avanza hasta la declaración siguiente. Esto sucederá si has cometido un error y has escrito mal una propiedad o un valor, o si la propiedad o el valor son demasiado nuevos y el navegador aún no los admite.</p>
+
+<p>Del mismo modo, si un navegador encuentra un selector que no entiende, lo ignorará y pasará al siguiente.</p>
+
+<p>En el siguiente ejemplo hemos utilizado la ortografía británica para la propiedad color, que invalida la propiedad porque no la reconoce. Así que el párrafo no se muestra en azul. Sin embargo, se han aplicado todos los demás estilos del CSS; solo se ha ignorado la línea que no es válida.</p>
+
+<div id="Skipping_example">
+<pre class="brush: html notranslate">&lt;p&gt;Quiero este texto en grande, en negrita y en color azul.&lt;/p&gt;</pre>
+
+<pre class="brush: css notranslate">p {
+  font-weight: bold;
+  colour: blue; /* Ortografía incorrecta de la propiedad color */
+  font-size: 200%;
+}</pre>
+</div>
+
+<p>{{EmbedLiveSample('Skipping_example', '100%', 200)}}</p>
+
+<p>Este comportamiento es muy útil. Significa que puedes utilizar el CSS nuevo como una mejora, a sabiendas de que no se producirá ningún error si no se entiende: o bien el navegador entiende la característica nueva o no lo hace. Combinado con el funcionamiento del modo en cascada con el hecho de que los navegadores utilizarán la última CSS que encuentren en la hoja de estilo, cuando haya dos reglas con el mismo nivel de especificidad, también puedes ofrecer alternativas para los navegadores que no admiten el CSS nuevo.</p>
+
+<p>Esto funciona especialmente bien cuando quieres utilizar un valor que es bastante nuevo que no admiten todos los navegadores. Por ejemplo, algunos navegadores antiguos no entienden <code>calc()</code> como valor. Podríamos dar un valor de sustitución para el ancho de una caja en píxeles, y a continuación dar un ancho con un valor <code>calc()</code> de <code>100% - 50px</code>. Los navegadores antiguos usarán la versión en píxeles y harán caso omiso de la indicación <code>calc()</code>, porque no la entienden. Los navegadores nuevos interpretarán la línea del ancho en píxeles, pero la anularán al llegar a la línea de <code>calc()</code> porque aparece después en la cascada.</p>
+
+<pre class="brush: css notranslate">.box {
+  width: 500px;
+  width: calc(100% - 50px);
+}</pre>
+
+<p>En lecciones posteriores veremos muchas más formas de cómo admitir navegadores diferentes.</p>
+
+<h2 id="Y_finalmente">Y finalmente</h2>
+
+<p>Casi has terminado este módulo; solo nos queda una cosa más por hacer. En el próximo artículo, <a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">pondrás en práctica tu conocimiento nuevo</a> para cambiar el estilo de un ejemplo y probarte con un poco de CSS en el proceso.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps/Using_your_new_knowledge", "Learn/CSS/First_steps")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es CSS?</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Empezar con CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
+</ol>
diff --git a/files/es/learn/css/first_steps/qué_es_css/index.html b/files/es/learn/css/first_steps/qué_es_css/index.html
deleted file mode 100644
index eb4f8e8a8a..0000000000
--- a/files/es/learn/css/first_steps/qué_es_css/index.html
+++ /dev/null
@@ -1,127 +0,0 @@
----
-title: ¿Qué es el CSS?
-slug: Learn/CSS/First_steps/Qué_es_CSS
-tags:
-  - Beginner
-  - CSS
-  - Introduction to CSS
-  - Learn
-  - Modules
-  - Specifications
-  - Syntax
-translation_of: Learn/CSS/First_steps/What_is_CSS
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps")}}</div>
-
-<p class="summary">Las hojas de estilo en cascada (<strong>{{Glossary("CSS")}}</strong>, cascading style sheets) permiten crear páginas web atractivas. Pero ¿cómo funcionan realmente? En este artículo explicaremos qué es el CSS con un ejemplo de sintaxis sencillo y describiremos algunos términos clave sobre este lenguaje.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">tener instalado el software básico</a>, conocimientos básicos de cómo <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a> y nociones de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender qué es CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>En el módulo <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>, exponemos qué es el HTML y cómo se usa para definir documentos destinados a leerse en un navegador web. Los títulos se verán más grandes que el texto y los párrafos empezarán en una línea nueva y habrá un espacio entre ellos. Los enlaces aparecerán en un color diferente y subrayados para distinguirlos del resto del texto. Vienen predeterminados por el navegador y, en la práctica, son estilos muy básicos que el navegador aplica al HTML para asegurarse, básicamente, de que sean legibles incluso si el autor de la página no especifica un estilo explícito.</p>
-
-<p><img alt="Los estilos predeterminados utilizados por el navegador" src="https://mdn.mozillademos.org/files/16493/html-example.png" style="border: 1px solid #cccccc; height: 594px; width: 1385px;"></p>
-
-<p>Sin embargo, Internet sería un lugar muy aburrido si todas las páginas web se vieran así. Usando CSS se pueden controlar con precisión cómo se ven los elementos HTML en el navegador, que presentará para las etiquetas de marcado el diseño que cada uno desee.</p>
-
-<h2 id="¿Para_qué_sirve_el_CSS">¿Para qué sirve el CSS?</h2>
-
-<p>Como hemos mencionado, el CSS es un lenguaje informático que especifica cómo se presentan los documentos a los usuarios: cómo se diseñan, compaginan, etc.</p>
-
-<p>Un <strong>documento</strong> suele ser un archivo de texto estructurado con un lenguaje de marcado: {{Glossary("HTML")}} es el más común, pero también existen otros como {{Glossary("SVG")}} o {{Glossary("XML")}}.</p>
-
-<p><strong>Presentar</strong> un documento a un usuario significa convertirlo en un formulario que el público pueda utilizar. Los {{Glossary("Navegador", "navegadores")}}, como por ejemplo {{Glossary("Mozilla Firefox", "Firefox")}}, {{Glossary("Google Chrome", "Chrome")}} o {{Glossary("Microsoft Edge", "Edge")}}, están diseñados para presentar documentos visualmente en una pantalla de ordenador, un proyector o una impresora.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Un navegador también recibe el nombre de {{Glossary("Agente de usuario", "agente de usuario")}}, que consiste en un programa informático que representa a una persona dentro del sistema. Los navegadores son el modelo principal de agente de usuario en el que pensamos cuando hablamos de CSS, pero no son el único. Hay otros documentos de usuario disponibles, como los que convierten documentos HTML y CSS en PDF para imprimir.</p>
-</div>
-
-<p>El CSS se puede usar para estilos de texto muy básicos como, por ejemplo, cambiar el <a href="/es/docs/Web/CSS/color_value">color</a> y el <a href="/en-US/docs/Web/CSS/font-size">tamaño</a> de los encabezados y los enlaces. Se puede utilizar para crear un diseño, como podría ser <a href="/en-US/docs/Web/CSS/Layout_cookbook/Column_layouts">convertir una columna de texto en una composición</a> con un área de contenido principal y una barra lateral para información relacionada. Incluso se puede usar para crear efectos de <a href="/es/docs/Web/CSS/CSS_Animations">animación</a>. Echa un vistazo a los enlaces de este párrafo para ver ejemplos específicos.</p>
-
-<h2 id="Sintaxis_del_CSS">Sintaxis del CSS</h2>
-
-<p>El CSS es un lenguaje basado en reglas: cada usuario define las reglas que especifican los grupos de estilos que van a aplicarse a elementos particulares o grupos de elementos de la página web. Por ejemplo: «Quiero que el encabezado principal de mi página se muestre en letras grandes de color rojo».</p>
-
-<p>El código siguiente muestra una regla CSS muy simple que proporcionaría el estilo descrito en el párrafo anterior:</p>
-
-<pre class="brush: css notranslate">h1 {
-    color: red;
-    font-size: 5em;
-}</pre>
-
-<p>La regla se abre con un {{Glossary("CSS Selector", "selector")}}. Este <em>selecciona</em> el elemento HTML que vamos a diseñar. En este caso, diseñaremos encabezados de nivel uno ({{htmlelement ("h1")}}).</p>
-
-<p>Luego tenemos un conjunto de llaves <code>{ }</code>. Entre estas habrá una o más <strong>declaraciones</strong>, que tomarán la forma de pares de <strong>propiedad</strong> y <strong>valor</strong>. Cada par especifica cada una de las propiedades de los elementos seleccionados y el valor que queremos dar a esa propiedad.</p>
-
-<p>Antes de los dos puntos, tenemos la propiedad; y después, el valor. Las {{Glossary("property/CSS", "propiedades")}} CSS admiten diferentes valores, dependiendo de qué propiedad se esté especificando. En el ejemplo anterior, tenemos la propiedad <code>color</code>, que puede tomar varios <a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS#Color">valores de color</a>. También tenemos la propiedad de <code>font-size</code>, que puede tomar varias <a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS#N%C3%BAmeros_longitudes_y_porcentajes">unidades de tamaño</a> como valor.</p>
-
-<p>Una hoja de estilo CSS contendrá muchas de estas reglas, escritas una tras otra.</p>
-
-<pre class="brush: css notranslate">h1 {
-    color: red;
-    font-size: 5em;
-}
-
-p {
-    color: black;
-}</pre>
-
-<p>Algunos valores se aprenden rápidamente, mientras que otros deberán buscarse. Las páginas de propiedades individuales que hay en el proyecto MDN proporcionan una forma rápida de buscar propiedades y sus valores en caso de olvidarlos o desear saber qué más se puede usar como valor.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar enlaces a todas las páginas de las propiedades CSS (junto con otras características CSS) enumeradas en la <a href="/es/docs/Web/CSS/Referencia_CSS">referencia CSS</a> del proyecto MDN. Alternativamente, deberías acostumbrarte a buscar «mdn <em>css-feature-name</em>» en tu motor de búsqueda favorito siempre que necesites obtener más información sobre una función CSS. Por ejemplo, intenta buscar «mdn color» y «mdn font-size».</p>
-</div>
-
-<h2 id="Módulos_CSS">Módulos CSS</h2>
-
-<p>Como hay tantas cosas que se podrían diseñar usando CSS, el lenguaje se divide en <em>módulos</em>. Verás referencias a estos módulos a medida que explores en MDN y observarás que muchas de las páginas de documentación están organizadas en torno a un módulo en particular. Por ejemplo, puedes echar un vistazo a la referencia MDN del módulo <a href="/en-US/docs/Web/CSS/CSS_Backgrounds_and_Borders">Fondos y bordes</a> para averiguar cuál es su propósito, qué otras propiedades y características diferentes contiene. También encontrarás enlaces a la <em>especificación CSS</em> que define la tecnología (ver más abajo).</p>
-
-<p>En esta fase, no debes preocuparte demasiado sobre cómo se estructura el CSS, sin embargo, puede facilitarte la búsqueda de información si, por ejemplo, sabes que es probable que cierta propiedad se encuentre entre otras similares y, por lo tanto, en la misma especificación. </p>
-
-<p>Volvamos al módulo de Fondos y bordes para un ejemplo específico: puedes pensar que tiene lógica que las propiedades <code><a href="/es/docs/Web/CSS/background-color">background-color</a></code> y <code><a href="/es/docs/Web/CSS/border-color">border-color</a></code> se definan en este módulo. Y llevas toda la razón.</p>
-
-<h3 id="Especificaciones_CSS">Especificaciones CSS</h3>
-
-<p>Todas las tecnologías de estándares web (HTML, CSS, JavaScript, etc.) se definen en extensos documentos denominados especificaciones, publicados por organizaciones de estándares (como {{glossary("W3C")}}, {{glossary("WHATWG")}}, {{glossary("ECMA")}} o {{glossary("Khronos")}}) que definen con precisión cómo se supone que deben comportarse esas tecnologías.</p>
-
-<p>El caso de CSS no es diferente: lo desarrolla un grupo del W3C llamado <a href="https://www.w3.org/Style/CSS/">CSS Working Group</a>. Este grupo está compuesto por representantes de proveedores de navegadores y otras compañías interesadas en CSS. También hay otras personas, conocidas como <em>expertos invitados</em>, que actúan como voces independientes y no están vinculados a ninguna organización.</p>
-
-<p>El CSS Working Group desarrolla o especifica características nuevas del CSS. Algunas veces lo hacen porque un navegador en particular está interesado en alguna capacidad, otras porque los diseñadores y desarrolladores web piden una característica, y otras porque el grupo ha identificado un requisito. El CSS está en desarrollo constante y todos los días presenta nuevas características disponibles. Sin embargo, un elemento clave sobre el CSS es que toda la comunidad se esfuerza mucho en no cambiar nunca nada que pueda perjudicar los sitios web antiguos. ¡Un sitio web creado en el año 2000, que utiliza el poco CSS disponible que había en ese momento, aún debería poder utilizarse hoy en día!</p>
-
-<p>Como recién llegado al CSS, es probable que encuentres las especificaciones abrumadoras: están destinadas a que los ingenieros las utilicen para implementar soporte de sus características en los agentes de usuario en que trabajan, no para que lo lean los desarrolladores web para comprender el CSS. Muchos desarrolladores experimentados preferirán consultar la documentación disponible en MDN u otros tutoriales. Sin embargo, vale la pena saber que existen y comprender la relación que hay entre el CSS que estás utilizando, el soporte del navegador (ver más abajo) y las especificaciones.</p>
-
-<h2 id="Soporte_del_navegador">Soporte del navegador</h2>
-
-<p>Una vez se ha especificado el CSS, solo es útil en el desarrollo de páginas web si uno o más navegadores lo han implementado. Esto significa que el código se ha escrito para convertir las instrucciones que se especifican en nuestro archivo CSS en algo que se pueda mostrar en pantalla. Veremos este proceso más en profundidad en el artículo <a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">Cómo funciona el CSS</a>. Es inusual que todos los navegadores puedan implementar una misma característica al mismo tiempo, por lo que suele haber una brecha en la que se pueden usar algunas partes del CSS en algunos navegadores pero no en otros. Por este motivo, es útil poder verificar el estado de implementación. En cada una de las páginas de propiedades que hay en la MDN se puede ver el estado de la propiedad de interés, por lo que se puede saber si será posible utilizarla en un sitio web.</p>
-
-<p>Lo que sigue es el gráfico de datos de compatibilidad para la propiedad CSS <code><a href="/es/docs/Web/CSS/font-family">font-family</a></code>.</p>
-
-<p>{{Compat("css.properties.font-family")}}</p>
-
-<h2 id="¿Qué_viene_ahora">¿Qué viene ahora?</h2>
-
-<p>Ahora que comprendes mínimamente qué es el CSS, pasemos a <a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Comenzar con CSS</a>, donde puedes empezar a escribir algo de CSS tú mismo.</p>
-
-<p>{{NextMenu("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es el CSS?</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Comenzar con CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona el CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
-</ol>
diff --git a/files/es/learn/css/first_steps/usa_tu_nuevo_conocimiento/index.html b/files/es/learn/css/first_steps/usa_tu_nuevo_conocimiento/index.html
deleted file mode 100644
index bff4f103bf..0000000000
--- a/files/es/learn/css/first_steps/usa_tu_nuevo_conocimiento/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: Usa tu nuevo conocimiento
-slug: Learn/CSS/First_steps/Usa_tu_nuevo_conocimiento
-tags:
-  - Aprendizaje
-  - CSS
-  - Principiante
-translation_of: Learn/CSS/First_steps/Using_your_new_knowledge
----
-<p>{{LearnSidebar}}{{PreviousMenu("Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</p>
-
-<p class="summary">Con las cosas que has aprendido en las últimas lecciones, puedes darle formato a documentos de texto simple utilizando CSS para agregar tu propio estilo a ellos. Esta evaluación te da una posibilidad de hacer eso.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Antes de intentar esta evaluación, deberías haber trabajado a través del módulo de CSS básico, y también comprender HTML básico (estudia la <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Introducción a HTML</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Utilizar algún CSS y probar conocimiento recién adquirido.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Punto_de_partida">Punto de partida</h2>
-
-<p>Puedes trabajar en el editor en vivo más abajo, o puedes descargar el punto de partida para trabajar con tu propio editor. Esta es una página HTML, con el inicio del CSS en el <code>&lt;head&gt;</code> del documento. Si prefieres, puedes mover este CSS a un archivo separado cuando crees el ejemplo en tu computador. Alternativamente, puedes usar una herramienta en línea como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a> para trabajar en las tareas.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Si te atascas, pide ayuda — mira la sección <a class="external external-icon" href="https://wiki.developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces#Evaluaci%C3%B3n_o_ayuda_adicional" rel="noopener">Evaluación o ayuda adicional</a> al final de esta página.</p>
-</div>
-
-<h2 id="Trabajando_con_CSS">Trabajando con CSS</h2>
-
-<p>Los siguientes ejemplos muestran una biografía, que ha sido estilizada usando CSS. Las propiedades CSS que se han utilizado son las siguientes - cada una enlaza a su página de propiedades en MDN, que te entregará más ejemplos de su uso:</p>
-
-<ul>
- <li>{{cssxref("font-family")}}</li>
- <li>{{cssxref("color")}}</li>
- <li>{{cssxref("border-bottom")}}</li>
- <li>{{cssxref("font-weight")}}</li>
- <li>{{cssxref("font-size")}}</li>
- <li>{{cssxref("text-decoration")}}</li>
-</ul>
-
-<p>Se ha usado una mezcla de selectores, elementos de estilo como <code>&lt;h1&gt;</code> y <code>&lt;h2&gt;</code>, y también una clase para el título del trabajo.</p>
-
-<p>Usa CSS para cambiar el aspecto de esta biografía, cambiando los valores de las propiedades iniciales.</p>
-
-<ol>
- <li>Coloca en rosado el nivel <code>&lt;h1&gt;</code>, usando el color CSS <code>hotpink</code>.</li>
- <li>Da al encabezado un {{cssxref("border-bottom")}} de 10px con puntos (<code>dotted</code>), que use el color CSS <code>purple</code>.</li>
- <li>Coloca en cursiva el <code>&lt;h2&gt;</code>.</li>
- <li>Al <code>ul</code> utilizado para los detalles de contacto un  {{cssxref("background-color")}}  <code>#eeeeee</code>, y un {{cssxref("border")}} de <code>5px solid purple</code>. Usa algo de {{cssxref("padding")}} para empujar el texto lejos del borde.</li>
- <li>Cambia los enlaces a verde cuando pase el cursor sobre ellos.</li>
-</ol>
-
-<p>Deberías conseguir algo parecido a esta página:</p>
-
-<p><img alt="Screenshot of how the example should look after completing the assessment." src="https://mdn.mozillademos.org/files/17035/learn-css-basics-assessment.png" style="height: 1199px; width: 1104px;"></p>
-
-<p>Posteriormente intenta buscar algunas propiedades no mencionadas en esta página en la <a href="/en-US/docs/Web/CSS/Reference">referencia de CSS de MDN</a> y ¡arriésgate!.</p>
-
-<p>Recuerda que no existen respuestas equivocadas acá - En esta etapa en tu aprendizaje puedes tener un poco de diversión.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/biog.html", '100%', 1600)}} </p>
-
-<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
-
-<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
-
-<ol>
- <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a class="external external-icon" href="https://codepen.io/" rel="noopener">CodePen</a>, <a class="external external-icon" href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a class="external external-icon" href="https://glitch.com/" rel="noopener">Glitch</a>.</li>
- <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a class="external external-icon" href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
-  <ul>
-   <li>Un título descriptivo como "Requiero evaluacion para Primeros pasos en CSS".</li>
-   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
-   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
-   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
-  </ul>
- </li>
-</ol>
-
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-
-<p>Felicitaciones por completar este primer modulo!. Deberías tener un buen entendimiento general de CSS, y ser capaz de comprender bastante de los que está sucediendo en una hoja de estilo. En el módulo siguiente, <a href="/en-US/docs/Learn/CSS/Building_blocks">bloques de construccion CSS</a>, revisaremos en profundidad algunas áreas clave.</p>
-
-<p>{{PreviousMenu("Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ol>
- <li><a href="/es/docs/Web/CSS/Como_iniciar/Que_es_CSS">¿Qué es CSS?</a></li>
- <li><a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Empezando con CSS</a></li>
- <li><a href="/es/docs/Learn/CSS/First_steps/Como_se_estructura_CSS">Cómo se estructura el CSS</a></li>
- <li><a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">Cómo funciona CSS</a></li>
- <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Usa tu nuevo conocimiento</a></li>
-</ol>
diff --git a/files/es/learn/css/first_steps/using_your_new_knowledge/index.html b/files/es/learn/css/first_steps/using_your_new_knowledge/index.html
new file mode 100644
index 0000000000..2fe00e7ce9
--- /dev/null
+++ b/files/es/learn/css/first_steps/using_your_new_knowledge/index.html
@@ -0,0 +1,101 @@
+---
+title: Usa tu nuevo conocimiento
+slug: Learn/CSS/First_steps/Using_your_new_knowledge
+tags:
+  - Aprendizaje
+  - CSS
+  - Principiante
+translation_of: Learn/CSS/First_steps/Using_your_new_knowledge
+original_slug: Learn/CSS/First_steps/Usa_tu_nuevo_conocimiento
+---
+<p>{{LearnSidebar}}{{PreviousMenu("Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</p>
+
+<p class="summary">Con las cosas que has aprendido en las últimas lecciones, puedes darle formato a documentos de texto simple utilizando CSS para agregar tu propio estilo a ellos. Esta evaluación te da una posibilidad de hacer eso.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Antes de intentar esta evaluación, deberías haber trabajado a través del módulo de CSS básico, y también comprender HTML básico (estudia la <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">Introducción a HTML</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Utilizar algún CSS y probar conocimiento recién adquirido.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Punto_de_partida">Punto de partida</h2>
+
+<p>Puedes trabajar en el editor en vivo más abajo, o puedes descargar el punto de partida para trabajar con tu propio editor. Esta es una página HTML, con el inicio del CSS en el <code>&lt;head&gt;</code> del documento. Si prefieres, puedes mover este CSS a un archivo separado cuando crees el ejemplo en tu computador. Alternativamente, puedes usar una herramienta en línea como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a> para trabajar en las tareas.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Si te atascas, pide ayuda — mira la sección <a class="external external-icon" href="https://wiki.developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces#Evaluaci%C3%B3n_o_ayuda_adicional" rel="noopener">Evaluación o ayuda adicional</a> al final de esta página.</p>
+</div>
+
+<h2 id="Trabajando_con_CSS">Trabajando con CSS</h2>
+
+<p>Los siguientes ejemplos muestran una biografía, que ha sido estilizada usando CSS. Las propiedades CSS que se han utilizado son las siguientes - cada una enlaza a su página de propiedades en MDN, que te entregará más ejemplos de su uso:</p>
+
+<ul>
+ <li>{{cssxref("font-family")}}</li>
+ <li>{{cssxref("color")}}</li>
+ <li>{{cssxref("border-bottom")}}</li>
+ <li>{{cssxref("font-weight")}}</li>
+ <li>{{cssxref("font-size")}}</li>
+ <li>{{cssxref("text-decoration")}}</li>
+</ul>
+
+<p>Se ha usado una mezcla de selectores, elementos de estilo como <code>&lt;h1&gt;</code> y <code>&lt;h2&gt;</code>, y también una clase para el título del trabajo.</p>
+
+<p>Usa CSS para cambiar el aspecto de esta biografía, cambiando los valores de las propiedades iniciales.</p>
+
+<ol>
+ <li>Coloca en rosado el nivel <code>&lt;h1&gt;</code>, usando el color CSS <code>hotpink</code>.</li>
+ <li>Da al encabezado un {{cssxref("border-bottom")}} de 10px con puntos (<code>dotted</code>), que use el color CSS <code>purple</code>.</li>
+ <li>Coloca en cursiva el <code>&lt;h2&gt;</code>.</li>
+ <li>Al <code>ul</code> utilizado para los detalles de contacto un  {{cssxref("background-color")}}  <code>#eeeeee</code>, y un {{cssxref("border")}} de <code>5px solid purple</code>. Usa algo de {{cssxref("padding")}} para empujar el texto lejos del borde.</li>
+ <li>Cambia los enlaces a verde cuando pase el cursor sobre ellos.</li>
+</ol>
+
+<p>Deberías conseguir algo parecido a esta página:</p>
+
+<p><img alt="Screenshot of how the example should look after completing the assessment." src="https://mdn.mozillademos.org/files/17035/learn-css-basics-assessment.png" style="height: 1199px; width: 1104px;"></p>
+
+<p>Posteriormente intenta buscar algunas propiedades no mencionadas en esta página en la <a href="/en-US/docs/Web/CSS/Reference">referencia de CSS de MDN</a> y ¡arriésgate!.</p>
+
+<p>Recuerda que no existen respuestas equivocadas acá - En esta etapa en tu aprendizaje puedes tener un poco de diversión.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/learn/getting-started/biog.html", '100%', 1600)}} </p>
+
+<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
+
+<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
+
+<ol>
+ <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a class="external external-icon" href="https://codepen.io/" rel="noopener">CodePen</a>, <a class="external external-icon" href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a class="external external-icon" href="https://glitch.com/" rel="noopener">Glitch</a>.</li>
+ <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a class="external external-icon" href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
+  <ul>
+   <li>Un título descriptivo como "Requiero evaluacion para Primeros pasos en CSS".</li>
+   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
+   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
+   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
+  </ul>
+ </li>
+</ol>
+
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+
+<p>Felicitaciones por completar este primer modulo!. Deberías tener un buen entendimiento general de CSS, y ser capaz de comprender bastante de los que está sucediendo en una hoja de estilo. En el módulo siguiente, <a href="/en-US/docs/Learn/CSS/Building_blocks">bloques de construccion CSS</a>, revisaremos en profundidad algunas áreas clave.</p>
+
+<p>{{PreviousMenu("Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/es/docs/Web/CSS/Como_iniciar/Que_es_CSS">¿Qué es CSS?</a></li>
+ <li><a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Empezando con CSS</a></li>
+ <li><a href="/es/docs/Learn/CSS/First_steps/Como_se_estructura_CSS">Cómo se estructura el CSS</a></li>
+ <li><a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">Cómo funciona CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Usa tu nuevo conocimiento</a></li>
+</ol>
diff --git a/files/es/learn/css/first_steps/what_is_css/index.html b/files/es/learn/css/first_steps/what_is_css/index.html
new file mode 100644
index 0000000000..82908677ec
--- /dev/null
+++ b/files/es/learn/css/first_steps/what_is_css/index.html
@@ -0,0 +1,128 @@
+---
+title: ¿Qué es el CSS?
+slug: Learn/CSS/First_steps/What_is_CSS
+tags:
+  - Beginner
+  - CSS
+  - Introduction to CSS
+  - Learn
+  - Modules
+  - Specifications
+  - Syntax
+translation_of: Learn/CSS/First_steps/What_is_CSS
+original_slug: Learn/CSS/First_steps/Qué_es_CSS
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps")}}</div>
+
+<p class="summary">Las hojas de estilo en cascada (<strong>{{Glossary("CSS")}}</strong>, cascading style sheets) permiten crear páginas web atractivas. Pero ¿cómo funcionan realmente? En este artículo explicaremos qué es el CSS con un ejemplo de sintaxis sencillo y describiremos algunos términos clave sobre este lenguaje.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Instalacion_de_software_basico">tener instalado el software básico</a>, conocimientos básicos de cómo <a href="https://developer.mozilla.org/es/docs/Learn/Getting_started_with_the_web/Manejando_los_archivos">trabajar con archivos</a> y nociones de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender qué es CSS.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>En el módulo <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>, exponemos qué es el HTML y cómo se usa para definir documentos destinados a leerse en un navegador web. Los títulos se verán más grandes que el texto y los párrafos empezarán en una línea nueva y habrá un espacio entre ellos. Los enlaces aparecerán en un color diferente y subrayados para distinguirlos del resto del texto. Vienen predeterminados por el navegador y, en la práctica, son estilos muy básicos que el navegador aplica al HTML para asegurarse, básicamente, de que sean legibles incluso si el autor de la página no especifica un estilo explícito.</p>
+
+<p><img alt="Los estilos predeterminados utilizados por el navegador" src="https://mdn.mozillademos.org/files/16493/html-example.png" style="border: 1px solid #cccccc; height: 594px; width: 1385px;"></p>
+
+<p>Sin embargo, Internet sería un lugar muy aburrido si todas las páginas web se vieran así. Usando CSS se pueden controlar con precisión cómo se ven los elementos HTML en el navegador, que presentará para las etiquetas de marcado el diseño que cada uno desee.</p>
+
+<h2 id="¿Para_qué_sirve_el_CSS">¿Para qué sirve el CSS?</h2>
+
+<p>Como hemos mencionado, el CSS es un lenguaje informático que especifica cómo se presentan los documentos a los usuarios: cómo se diseñan, compaginan, etc.</p>
+
+<p>Un <strong>documento</strong> suele ser un archivo de texto estructurado con un lenguaje de marcado: {{Glossary("HTML")}} es el más común, pero también existen otros como {{Glossary("SVG")}} o {{Glossary("XML")}}.</p>
+
+<p><strong>Presentar</strong> un documento a un usuario significa convertirlo en un formulario que el público pueda utilizar. Los {{Glossary("Navegador", "navegadores")}}, como por ejemplo {{Glossary("Mozilla Firefox", "Firefox")}}, {{Glossary("Google Chrome", "Chrome")}} o {{Glossary("Microsoft Edge", "Edge")}}, están diseñados para presentar documentos visualmente en una pantalla de ordenador, un proyector o una impresora.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Un navegador también recibe el nombre de {{Glossary("Agente de usuario", "agente de usuario")}}, que consiste en un programa informático que representa a una persona dentro del sistema. Los navegadores son el modelo principal de agente de usuario en el que pensamos cuando hablamos de CSS, pero no son el único. Hay otros documentos de usuario disponibles, como los que convierten documentos HTML y CSS en PDF para imprimir.</p>
+</div>
+
+<p>El CSS se puede usar para estilos de texto muy básicos como, por ejemplo, cambiar el <a href="/es/docs/Web/CSS/color_value">color</a> y el <a href="/en-US/docs/Web/CSS/font-size">tamaño</a> de los encabezados y los enlaces. Se puede utilizar para crear un diseño, como podría ser <a href="/en-US/docs/Web/CSS/Layout_cookbook/Column_layouts">convertir una columna de texto en una composición</a> con un área de contenido principal y una barra lateral para información relacionada. Incluso se puede usar para crear efectos de <a href="/es/docs/Web/CSS/CSS_Animations">animación</a>. Echa un vistazo a los enlaces de este párrafo para ver ejemplos específicos.</p>
+
+<h2 id="Sintaxis_del_CSS">Sintaxis del CSS</h2>
+
+<p>El CSS es un lenguaje basado en reglas: cada usuario define las reglas que especifican los grupos de estilos que van a aplicarse a elementos particulares o grupos de elementos de la página web. Por ejemplo: «Quiero que el encabezado principal de mi página se muestre en letras grandes de color rojo».</p>
+
+<p>El código siguiente muestra una regla CSS muy simple que proporcionaría el estilo descrito en el párrafo anterior:</p>
+
+<pre class="brush: css notranslate">h1 {
+    color: red;
+    font-size: 5em;
+}</pre>
+
+<p>La regla se abre con un {{Glossary("CSS Selector", "selector")}}. Este <em>selecciona</em> el elemento HTML que vamos a diseñar. En este caso, diseñaremos encabezados de nivel uno ({{htmlelement ("h1")}}).</p>
+
+<p>Luego tenemos un conjunto de llaves <code>{ }</code>. Entre estas habrá una o más <strong>declaraciones</strong>, que tomarán la forma de pares de <strong>propiedad</strong> y <strong>valor</strong>. Cada par especifica cada una de las propiedades de los elementos seleccionados y el valor que queremos dar a esa propiedad.</p>
+
+<p>Antes de los dos puntos, tenemos la propiedad; y después, el valor. Las {{Glossary("property/CSS", "propiedades")}} CSS admiten diferentes valores, dependiendo de qué propiedad se esté especificando. En el ejemplo anterior, tenemos la propiedad <code>color</code>, que puede tomar varios <a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS#Color">valores de color</a>. También tenemos la propiedad de <code>font-size</code>, que puede tomar varias <a href="/es/docs/Learn/CSS/Building_blocks/Valores_y_unidades_CSS#N%C3%BAmeros_longitudes_y_porcentajes">unidades de tamaño</a> como valor.</p>
+
+<p>Una hoja de estilo CSS contendrá muchas de estas reglas, escritas una tras otra.</p>
+
+<pre class="brush: css notranslate">h1 {
+    color: red;
+    font-size: 5em;
+}
+
+p {
+    color: black;
+}</pre>
+
+<p>Algunos valores se aprenden rápidamente, mientras que otros deberán buscarse. Las páginas de propiedades individuales que hay en el proyecto MDN proporcionan una forma rápida de buscar propiedades y sus valores en caso de olvidarlos o desear saber qué más se puede usar como valor.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar enlaces a todas las páginas de las propiedades CSS (junto con otras características CSS) enumeradas en la <a href="/es/docs/Web/CSS/Referencia_CSS">referencia CSS</a> del proyecto MDN. Alternativamente, deberías acostumbrarte a buscar «mdn <em>css-feature-name</em>» en tu motor de búsqueda favorito siempre que necesites obtener más información sobre una función CSS. Por ejemplo, intenta buscar «mdn color» y «mdn font-size».</p>
+</div>
+
+<h2 id="Módulos_CSS">Módulos CSS</h2>
+
+<p>Como hay tantas cosas que se podrían diseñar usando CSS, el lenguaje se divide en <em>módulos</em>. Verás referencias a estos módulos a medida que explores en MDN y observarás que muchas de las páginas de documentación están organizadas en torno a un módulo en particular. Por ejemplo, puedes echar un vistazo a la referencia MDN del módulo <a href="/en-US/docs/Web/CSS/CSS_Backgrounds_and_Borders">Fondos y bordes</a> para averiguar cuál es su propósito, qué otras propiedades y características diferentes contiene. También encontrarás enlaces a la <em>especificación CSS</em> que define la tecnología (ver más abajo).</p>
+
+<p>En esta fase, no debes preocuparte demasiado sobre cómo se estructura el CSS, sin embargo, puede facilitarte la búsqueda de información si, por ejemplo, sabes que es probable que cierta propiedad se encuentre entre otras similares y, por lo tanto, en la misma especificación. </p>
+
+<p>Volvamos al módulo de Fondos y bordes para un ejemplo específico: puedes pensar que tiene lógica que las propiedades <code><a href="/es/docs/Web/CSS/background-color">background-color</a></code> y <code><a href="/es/docs/Web/CSS/border-color">border-color</a></code> se definan en este módulo. Y llevas toda la razón.</p>
+
+<h3 id="Especificaciones_CSS">Especificaciones CSS</h3>
+
+<p>Todas las tecnologías de estándares web (HTML, CSS, JavaScript, etc.) se definen en extensos documentos denominados especificaciones, publicados por organizaciones de estándares (como {{glossary("W3C")}}, {{glossary("WHATWG")}}, {{glossary("ECMA")}} o {{glossary("Khronos")}}) que definen con precisión cómo se supone que deben comportarse esas tecnologías.</p>
+
+<p>El caso de CSS no es diferente: lo desarrolla un grupo del W3C llamado <a href="https://www.w3.org/Style/CSS/">CSS Working Group</a>. Este grupo está compuesto por representantes de proveedores de navegadores y otras compañías interesadas en CSS. También hay otras personas, conocidas como <em>expertos invitados</em>, que actúan como voces independientes y no están vinculados a ninguna organización.</p>
+
+<p>El CSS Working Group desarrolla o especifica características nuevas del CSS. Algunas veces lo hacen porque un navegador en particular está interesado en alguna capacidad, otras porque los diseñadores y desarrolladores web piden una característica, y otras porque el grupo ha identificado un requisito. El CSS está en desarrollo constante y todos los días presenta nuevas características disponibles. Sin embargo, un elemento clave sobre el CSS es que toda la comunidad se esfuerza mucho en no cambiar nunca nada que pueda perjudicar los sitios web antiguos. ¡Un sitio web creado en el año 2000, que utiliza el poco CSS disponible que había en ese momento, aún debería poder utilizarse hoy en día!</p>
+
+<p>Como recién llegado al CSS, es probable que encuentres las especificaciones abrumadoras: están destinadas a que los ingenieros las utilicen para implementar soporte de sus características en los agentes de usuario en que trabajan, no para que lo lean los desarrolladores web para comprender el CSS. Muchos desarrolladores experimentados preferirán consultar la documentación disponible en MDN u otros tutoriales. Sin embargo, vale la pena saber que existen y comprender la relación que hay entre el CSS que estás utilizando, el soporte del navegador (ver más abajo) y las especificaciones.</p>
+
+<h2 id="Soporte_del_navegador">Soporte del navegador</h2>
+
+<p>Una vez se ha especificado el CSS, solo es útil en el desarrollo de páginas web si uno o más navegadores lo han implementado. Esto significa que el código se ha escrito para convertir las instrucciones que se especifican en nuestro archivo CSS en algo que se pueda mostrar en pantalla. Veremos este proceso más en profundidad en el artículo <a href="/es/docs/Learn/CSS/First_steps/Como_funciona_CSS">Cómo funciona el CSS</a>. Es inusual que todos los navegadores puedan implementar una misma característica al mismo tiempo, por lo que suele haber una brecha en la que se pueden usar algunas partes del CSS en algunos navegadores pero no en otros. Por este motivo, es útil poder verificar el estado de implementación. En cada una de las páginas de propiedades que hay en la MDN se puede ver el estado de la propiedad de interés, por lo que se puede saber si será posible utilizarla en un sitio web.</p>
+
+<p>Lo que sigue es el gráfico de datos de compatibilidad para la propiedad CSS <code><a href="/es/docs/Web/CSS/font-family">font-family</a></code>.</p>
+
+<p>{{Compat("css.properties.font-family")}}</p>
+
+<h2 id="¿Qué_viene_ahora">¿Qué viene ahora?</h2>
+
+<p>Ahora que comprendes mínimamente qué es el CSS, pasemos a <a href="/es/docs/Learn/CSS/First_steps/Comenzando_CSS">Comenzar con CSS</a>, donde puedes empezar a escribir algo de CSS tú mismo.</p>
+
+<p>{{NextMenu("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ol>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/What_is_CSS">¿Qué es el CSS?</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Getting_started">Comenzar con CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_is_structured">Cómo se estructura el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/How_CSS_works">Cómo funciona el CSS</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/First_steps/Using_your_new_knowledge">Pon en práctica tus conocimientos nuevos</a></li>
+</ol>
diff --git a/files/es/learn/css/howto/css_faq/index.html b/files/es/learn/css/howto/css_faq/index.html
new file mode 100644
index 0000000000..3037ac68c8
--- /dev/null
+++ b/files/es/learn/css/howto/css_faq/index.html
@@ -0,0 +1,119 @@
+---
+title: Preguntas frecuentes sobre CSS
+slug: Learn/CSS/Howto/CSS_FAQ
+tags:
+  - CSS
+  - Proyecto MDC
+translation_of: Learn/CSS/Howto/CSS_FAQ
+original_slug: Web/CSS/Preguntas_frecuentes_sobre_CSS
+---
+<h4 id="My_CSS_is_valid.2C_but_not_correctly_rendered" name="My_CSS_is_valid.2C_but_not_correctly_rendered"><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Mi CSS es válida, pero no se representa correctamente</span></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los navegadores utilizan la declaración <code>DOCTYPE</code> para elegir entre mostrar el documento usando un modo que sea más compatible con los estándares de la Web o mostrarlo con los fallos de los navegadores antiguos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El uso de una declaración <code>DOCTYPE</code> correcta y moderna al inicio del código HTML mejorará el cumplimiento de los estándares del navegador.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Los navegadores modernos tienen fundamentalmente dos modos de renderizado:</span></span></p>
+<ul> <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><em>Quirks mode</em> (Modo no estándar): también se llama el modo de compatibilidad con versiones anteriores y permite que las páginas web heredadas se representen como sus autores habían previsto, siguiendo las normas de representación o renderizado no estándares que usan los navegadores antiguos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los documentos con una declaración <code>DOCTYPE</code> incompleta, incorrecta o faltante o con una declaración <code>DOCTYPE</code> conocida que se usara habitualmente antes de 2001 se representarán en el Modo no estándar.</span></span></li> <li><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><em>Standards Mode</em> (Modo estándar): el navegador intenta seguir estrictamente los estándares del W3C.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Se supone que las nuevas páginas HTML se diseñarán para navegadores compatibles con los estándares, y como resultado, las páginas con una declaración <code>DOCTYPE</code> moderna será renderizada con el Modo estándar.</span></span></li>
+</ul>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los navegadores basados en Gecko tienen un tercer <em><a href="/en/Gecko's_&quot;Almost_Standards&quot;_Mode" title="en/Gecko's &quot;Almost Standards&quot; Mode">Modo casi estándar</a></em> que tiene solo una peculiaridades menores.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esta es una lista de las declaraciones <code>DOCTYPE</code> más utilizadas que activarán el Modo estándar o el Modo casi estándar:</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.0 Transitional / / EN"</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/html4/loose.dtd"&gt;</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.01 / / EN"</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/html4/strict.dtd"&gt;</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD XHTML 1.0 Transitional / / EN"</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD XHTML 1.0 Strict / / EN"</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;</span></span>
+</pre>
+<h4 id="Difference_between_id_and_class" name="Difference_between_id_and_class"><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Diferencia entre <code>id</code> y <code>class</code></span></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los elementos HTML pueden tener un atributo <code>id</code> y / o un atributo <code>class</code>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El atributo <code>id</code> asigna un nombre a un elemento determinado y debe haber un solo elemento con ese nombre.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El atributo <code>class</code> asigna un elemento a una determinada clase y en general no puede haber más de un elemento con el mismo atributo <code>class</code>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">CSS te permite aplicar estilos a un atributo <code>id</code> y / o <code>class</code> concreto.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Utiliza un estilo específico de <code>id</code> cuando desees restringir las reglas de estilo a un bloque o elemento concreto.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este estilo lo usará <strong>un solo</strong> elemento con ese <code>id</code> concreto.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Usa un estilo específico de <code>class</code> cuando desees aplicar las reglas de estilo a una determinada clase de bloques y elementos.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Consulta <a href="/en/CSS/Getting_Started/Selectors" title="en/CSS/Getting Started/Selectors">Selectores CSS</a></span></span></p>
+<h4 id="Restoring_the_default_property_value" name="Restoring_the_default_property_value"><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Restaurar el valor de la propiedad predeterminado</span></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Debido a que CSS no proporciona una palabra clave "predeterminada", la única manera de restaurar el valor predeterminado de una propiedad es volver a declarar explícitamente dicha propiedad.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por lo tanto, debes tener especial cuidado al escribir reglas de estilo usando selectores (por ejemplo, los selectores por nombre de etiqueta, como <code>p</code> ) que tal vez desees reemplazar con reglas más específicas (como las que usan id o selectores de clase), porque el valor predeterminado original no puede restablecerse automáticamente.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Debido a la naturaleza <em>en cascada</em> de CSS, es una buena práctica definir reglas de estilo de una manera lo más concreta posible para evitar aplicar estilo a elementos a los que no se tenía previsto aplicar.</span></span></p>
+<h4 id="Derived_styles" name="Derived_styles"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Estilos derivados</span></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">CSS no permite que se defina un estilo según los términos de otro.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">(Consulta la <a class="external" href="http://archivist.incutio.com/viewlist/css-discuss/2685" title="http://archivist.incutio.com/viewlist/css-discuss/2685">nota de Eric Meyer acerca de la postura del Grupo de trabajo)</a>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Sin embargo, la asignación de múltiples clases a un solo elemento puede proporcionar el mismo efecto.</span></span></p>
+<h4 id="Assigning_multiple_classes" name="Assigning_multiple_classes"><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Asignación de múltiples clases</span></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">A los elementos HTML se les pueden asignar varias clases listándolas  en el atributo <code>class</code>, con un espacio en blanco para separarlas.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;style type="text/css"&gt;</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.news { background: black; color: white; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.today { font-weight: bold; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/style&gt;</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;div class="news today"&gt;</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">... contenido de las noticias de hoy ...</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si la misma propiedad se declara en ambas reglas, el conflicto se resuelve primero a través de la especificidad, a continuación, según el orden de las declaraciones CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El orden de las clases en el atributo <code>class</code> no es relevante.</span></span></p>
+<h4 id="Style_rules_that_don.27t_work" name="Style_rules_that_don.27t_work"><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Normas de estilo que no funcionan</span></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Las reglas de estilo que son sintácticamente correctas pueden no aplicarse en determinadas situaciones.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Puedes utilizar las <em>Reglas de estilo de CSS</em> del <a href="/en/DOM_Inspector" title="en/DOM Inspector">Inspector DOM</a> para depurar los problemas de este tipo, pero los casos más frecuentes en los que se ignoran las reglas de estilo se enumeran a continuación.</span></span></p>
+<h5 id="HTML_elements_hierarchy" name="HTML_elements_hierarchy"><span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Jerarquía de los elementos HTML</span></span></h5>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La forma en que se aplican los estilos CSS a los elementos HTML depende también de la jerarquía de los elementos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Es importante recordar que una regla que se aplica a un descendiente reemplaza el estilo del padre, a pesar de la especificidad o la prioridad de las reglas CSS.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.news { color: black; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">. corpName {font-weight: bold; color: red;}</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;!-- el texto de la noticia es negro, pero el nombre de la empresa va en rojo y negrita --&gt;</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div class="news"&gt;</span></span>
+   <span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">(Reuters) &lt;span class="corpName"&gt; General Electric &lt;/ span&gt; (GE.NYS) anunció el jueves ...</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el caso de jerarquías HTML complejas, si parece que se ignora una regla, comprueba si el elemento está dentro de otro elemento con un estilo diferente.</span></span></p>
+<h5 id="Explicitly_re-defined_style_rule" name="Explicitly_re-defined_style_rule"><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Regla de estilo explícitamente redefinida</span></span></h5>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En las hojas de estilo CSS el orden <strong>es</strong> importante.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si defines una regla y luego vuelves a definirla, se usará la última definición.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker { font-weight: bold; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockSymbol { color: red; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">/*  otras reglas             */</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">/*  otras reglas             */</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">/*  otras reglas             */</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-73"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockSymbol { font-weight: normal; }</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-74"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;!-- la mayor parte del texto va en negrita, con excepción de "GE", que va en rojo y no en negrita --&gt;</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-75"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="stockTicker"&gt;</span></span>
+   <span class="goog-gtc-unit" id="goog-gtc-unit-76"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">NYS: &lt;span class="stockSymbol"&gt;GE&lt;/span&gt; +1.0 ...</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-77"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-78"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para evitar este tipo de errores, intenta definir las reglas solo una vez para un selector determinado y agrupa todas las reglas que pertenecen a ese selector.</span></span></p>
+<h5 id="Use_of_a_shorthand_property" name="Use_of_a_shorthand_property"><span class="goog-gtc-unit" id="goog-gtc-unit-79"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Uso de una propiedad abreviada</span></span></h5>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-80"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Está bien usar las propiedades abreviadas para la definición de reglas de estilo, ya que utiliza una sintaxis muy compacta.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-81"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Usar la abreviatura con sólo algunos atributos es posible y correcto, pero hay que recordar que los atributos no declarados se restablecen a los valores predeterminados automáticamente.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-82"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto significa que una norma anterior para un solo atributo podría ser reemplazada implícitamente.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-83"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker { font-size: 12px; font-family: Verdana; font-weight: bold; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-84"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockSymbol { font: 14px Arial; color: red; }</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-85"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="stockTicker"&gt;</span></span>
+   <span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">NYS: &lt;span class="stockSymbol"&gt;GE&lt;/span&gt; +1.0 ...</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-87"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-88"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el ejemplo anterior el problema se produjo en las reglas que pertencían a distintos elementos, pero puede ocurrir también para el mismo elemento, porque el orden de las reglas <strong>es</strong> importante.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-89"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker {</span></span>
+   <span class="goog-gtc-unit" id="goog-gtc-unit-90"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">font-weight: bold;</span></span>
+   <span class="goog-gtc-unit" id="goog-gtc-unit-91"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">font: 12px Verdana; / * font-weight es ahora normal * /</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-92"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">}</span></span>
+</pre>
+<h5 id="Use_of_the_.2A_selector" name="Use_of_the_.2A_selector"><span class="goog-gtc-unit" id="goog-gtc-unit-93"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Uso del selector <code>*</code></span></span></h5>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-94"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El selector <code>*</code> se refiere a cualquier elemento y tiene que utilizarse con especial cuidado.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-95"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">body * { font-weight: normal; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-96"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker { font: 12px Verdana; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-97"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.corpName { font-weight: bold; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-98"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockUp { color: red; }</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-99"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="section"&gt;</span></span>
+   <span class="goog-gtc-unit" id="goog-gtc-unit-100"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">NYS: &lt;span class="corpName"&gt;&lt;span class="stockUp"&gt;GE&lt;/span&gt;&lt;/span&gt; +1.0 ...</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-101"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-102"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En este ejemplo, el selector <code>body *</code> aplica la regla a todos los elementos dentro del cuerpo (<em>body</em>), en cualquier nivel de jerarquía, incluyendo <em>redtext.</em></span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-103"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Así <code>font-weight: bold;</code> aplicada a la clase <em>boldtext</em> se reemplaza por <code>font-weight: normal;</code> aplicada a <em>redtext.</em></span></span></p>
+<h5 id="Specificity_in_CSS" name="Specificity_in_CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-104"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Especificidad en CSS</span></span></h5>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-105"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cuando se aplican múltiples reglas a un determinado elemento, la norma escogida depende de su especificidad de estilo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-106"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El estilo en línea (en los atributos HTML <code>style</code>) es lo primero, seguido por los selectores id, a continuación, los selectores class y, finalmente, los selectores element-name.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-107"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">div { color: black; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-108"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#orange { color: orange; }</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-109"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.green { color: green; }</span></span>
+
+<span class="goog-gtc-unit" id="goog-gtc-unit-110"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="orange" class="green" style="color: red;"&gt;This is red&lt;/div&gt;</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-111"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Las reglas son más complicadas cuando el selector tiene varias partes.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-112"><span class="goog-gtc-translatable goog-gtc-from-human goog-gtc-ph-missing" dir="ltr" style="">Se puede encontrar más información detallada acerca de cómo se calcula la especificidad del selector en el <a class=" external" href="http://www.w3.org/TR/CSS21/cascade.html#specificity" title="http://www.w3.org/TR/CSS21/cascade.html#specificity">capítulo 6.4.3 de la Especificación CSS 2.1</a></span></span></p>
+<h4 id="What_do_the_-moz-.2A_properties_do.3F" name="What_do_the_-moz-.2A_properties_do.3F"><span class="goog-gtc-unit" id="goog-gtc-unit-113"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">¿Qué hacen las propiedades -moz-*?</span></span></h4>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-114"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por favor, consulta la página <a class="internal" href="/en/CSS_Reference/Mozilla_Extensions" title="en/CSS Reference/Mozilla Extensions">Extensiones CSS de Mozilla</a>.</span></span></p>
+<p> </p>
+<p>{{ languages( { "en": "en/Common_CSS_Questions", "pl": "pl/Cz\u0119ste_pytania_o_CSS", "zh-tw": "zh_tw/CSS_\u4e00\u822c\u554f\u984c" } ) }}</p>
diff --git a/files/es/learn/css/howto/generated_content/index.html b/files/es/learn/css/howto/generated_content/index.html
new file mode 100644
index 0000000000..232c1c6e4d
--- /dev/null
+++ b/files/es/learn/css/howto/generated_content/index.html
@@ -0,0 +1,179 @@
+---
+title: Usando CSS para generar contenido
+slug: Learn/CSS/Howto/Generated_content
+tags:
+  - CSS
+  - Fundamentos
+  - Guía
+  - Principiante
+  - Web
+  - graficos
+translation_of: Learn/CSS/Howto/Generated_content
+original_slug: Learn/CSS/Sábercomo/Generated_content
+---
+<p>{{ CSSTutorialTOC() }}</p>
+
+<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Color", "Color") }}Esta es la 9ª sección del tutorial CSS Getting Started; Describe algunas formas en las que puede utilizar CSS para agregar contenido cuando se muestra un documento. Modifica su hoja de estilo para agregar contenido de texto y una imagen.</p>
+
+<h2 class="clearLeft" id="Informacion_Contenido">Informacion: Contenido</h2>
+
+<p>Una de las ventajas importantes de CSS es que le ayuda a separar el estilo de un documento de su contenido. Sin embargo, hay situaciones en las que tiene sentido especificar cierto contenido como parte de la hoja de estilo, no como parte del documento.</p>
+
+<p>El contenido especificado en una hoja de estilo puede consistir en texto o imágenes. Especifica el contenido de su hoja de estilos cuando el contenido está estrechamente vinculado a la estructura del documento.</p>
+
+<div class="tuto_details">
+<div class="tuto_type">
+<p>Más detalles</p>
+
+<p>Especificar contenido en una hoja de estilo puede causar complicaciones. Por ejemplo, es posible que tenga versiones de idioma diferentes de su documento que comparten una hoja de estilo. Si parte de la hoja de estilo tiene que ser traducida, significa que debe colocar las partes de la hoja de estilos en archivos separados y organizar para que se vincule con las versiones de idioma adecuado de su documento.</p>
+
+<p>Estas complicaciones no surgen si el contenido especificado incluye símbolos o imágenes que se aplican en todos los idiomas y culturas.</p>
+
+<p>El contenido especificado en una hoja de estilo no se convierte en parte del DOM.</p>
+</div>
+</div>
+
+<h3 id="Text_content" name="Text_content">Texto contenido</h3>
+
+<p>CSS puede insertar contenido de texto antes o después de un elemento. Para especificar esto, haga una regla y agregue {{cssxref (':: before')}} o {{cssxref (':: after')}} al selector. En la declaración, especifique la propiedad {{cssxref ('content')}} con el contenido de texto como su valor.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="brush: html">Un texto donde necesito &lt;span class="ref"&gt;alguna cosa&lt;/span&gt;
+</pre>
+
+<h4 id="CSS">CSS</h4>
+
+<pre class="brush: css">.ref::before {
+  font-weight: negrita;
+  color: navy;
+  content: "Reference: ";
+}</pre>
+
+<h4 id="Output">Output</h4>
+
+<p>{{ EmbedLiveSample('Text_content', 600, 30) }}</p>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type">Mas detalles</div>
+
+<p>El conjunto de caracteres de una hoja de estilo es UTF-8 de forma predeterminada, pero se puede especificar en el vínculo o en la hoja de estilos o en otras formas. Para obtener más información, consulte 4. 4 Representación de hoja de estilo CSS en la especificación CSS.</p>
+
+<p>Los caracteres individuales también se pueden especificar mediante un mecanismo de escape que utiliza la barra invertida como el carácter de escape. Por ejemplo, \ 265B es el símbolo del ajedrez para una reina negra ♛. Para obtener más información, consulte Referencia a caracteres no representados en una codificación de caracteres y también Caracteres y caso en la Especificación CSS.</p>
+</div>
+
+<h3 id="Imagen_contenido">Imagen contenido</h3>
+
+<p>Para agregar una imagen antes o después de un elemento, puede especificar la URL de un archivo de imagen en el valor de la propiedad {{cssxref ('content')}}.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p>Esta regla añade un espacio y un icono después de cada enlace que tiene el glosario de clases:</p>
+
+<pre class="brush:css">a.glossary:after {content: " " url("../images/glossary-icon.gif");}
+</pre>
+</div>
+
+<p>Para agregar una imagen como fondo de un elemento, especifique la URL de un archivo de imagen en el valor de la propiedad {{cssxref ('background')}}. Esta es una propiedad abreviada que especifica el color de fondo, la imagen, cómo se repite la imagen y algunos otros detalles.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p>Esta regla establece el fondo de un elemento específico, utilizando una URL para especificar un archivo de imagen.</p>
+
+<p>El selector especifica el id del elemento. El valor no-repeat hace que la imagen aparezca sólo una vez:</p>
+
+<pre class="brush:css">#sidebar-box {background: url("../images/sidebar-ground.png") no-repeat;}
+</pre>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type">Mas detalles</div>
+
+<p>Para obtener información sobre las propiedades individuales que afectan a los fondos y sobre otras opciones al especificar imágenes de fondo, consulte {{Cssxref ('fondo')}}, página de referencia.</p>
+</div>
+
+<h2 id="Acción_Añadir_una_imagen_de_fondo">Acción: Añadir una imagen de fondo</h2>
+
+<p>Esta imagen es un cuadrado blanco con una línea azul en la parte inferior:</p>
+
+<table style="border: 2px solid #cccccc;">
+ <tbody>
+  <tr>
+   <td><img alt="Image:Blue-rule.png" class="internal" src="https://mdn.mozillademos.org/files/160/Blue-rule.png"></td>
+  </tr>
+ </tbody>
+</table>
+
+<ol>
+ <li>Descargue el archivo de imagen en el mismo directorio que su archivo CSS. (Por ejemplo, haga clic con el botón derecho del ratón para obtener un menú contextual y, a continuación, seleccione Guardar imagen como y especifique el directorio que está utilizando para este tutorial).</li>
+ <li>Edit your CSS file and add this rule to the body, setting a background image for the entire page.</li>
+ <li>
+  <pre class="brush:css">background: url("Blue-rule.png");
+</pre>
+
+  <p>La repetición de valor es la predeterminada, por lo que no es necesario especificarla. La imagen se repite horizontal y verticalmente, dando una apariencia como papel de escribir forrado:</p>
+
+  <div style="position: relative; width: 24em; height: 11em; border: 2px outset #36b; overflow: hidden;">
+  <p style="margin: 0px;"><img alt="Image:Blue-rule-ground.png" class="internal" src="https://mdn.mozillademos.org/files/161/Blue-rule-ground.png"></p>
+
+  <div style="position: absolute; top: 0px; left: 0px; border: none; margin: 0px; padding: .5em 0px 0px 1em; font: 16px 'Comic Sams MS', cursive; color: blue; background-color: transparent;">
+  <div style="font-style: italic; width: 24em;">
+  <p><strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>heets</p>
+  </div>
+
+  <div style="font-style: normal; padding-top: 2px; height: 8em;">
+  <p><strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>heets</p>
+  </div>
+  </div>
+  </div>
+ </li>
+</ol>
+
+<div class="tuto_example">
+<div class="tuto_type">Reto</div>
+
+<p>Descarga esta imagen:</p>
+
+<table style="border: 2px solid #cccccc;">
+ <tbody>
+  <tr>
+   <td><img alt="Image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Agrega una nueva regla a tu hoja de estilos, luego, agrega la imagen al inicio de cada linea:</p>
+
+<div style="position: relative; width: 24em; height: 11em; border: 2px outset #36b; overflow: hidden;">
+<p style="margin: 0px;"><img alt="Image:Blue-rule-ground.png" class="internal" src="https://mdn.mozillademos.org/files/161/Blue-rule-ground.png"></p>
+
+<div style="position: absolute; top: 0px; left: 0px; border: none; margin: 0px; padding: .5em 0px 0px 1em; font: 16px 'Comic Sams MS', cursive; color: blue; background-color: transparent;">
+<div style="font-style: italic; width: 24em; padding-top: 8px;"><img alt="image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"> <strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>heets</div>
+
+<div style="font-style: normal; padding-top: 12px; height: 8em;"><img alt="image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"> <strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>heets</div>
+</div>
+</div>
+
+<div class="tuto_details" id="tutochallenge">
+<div class="tuto_type">Possible solution</div>
+
+<p>Add this rule to your stylesheet:</p>
+
+<pre class="brush: css">p:before{
+  content: url("yellow-pin.png");
+}
+</pre>
+
+<p> </p>
+<a class="hideAnswer" href="#challenge">Hide solution</a></div>
+<a href="#tutochallenge" title="Display a possible solution for the challenge">Ver la solución a este reto.</a></div>
+
+<h2 id="Qué_sigue">Qué sigue?</h2>
+
+<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Lists", "Lists") }}Una forma común en que las hojas de estilos agregan contenido es marcando los elementos en las listas. La siguiente sección describe cómo <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Lists" title="/en-US/docs/Web/Guide/CSS/Getting_Started/Lists">especificar estilos para una lista de elementos.</a></p>
diff --git a/files/es/learn/css/howto/index.html b/files/es/learn/css/howto/index.html
new file mode 100644
index 0000000000..c3669d187f
--- /dev/null
+++ b/files/es/learn/css/howto/index.html
@@ -0,0 +1,82 @@
+---
+title: Usa CSS para resolver problemas comunes
+slug: Learn/CSS/Howto
+translation_of: Learn/CSS/Howto
+original_slug: Learn/CSS/Sábercomo
+---
+<div>{{LearnSidebar}}</div>
+
+<p class="summary">Los siguientes enlaces apuntan a soluciones comunes a los problemas cotidianos que necesitará resolver con CSS.</p>
+
+<h2 id="Casos_de_uso_común">Casos de uso común</h2>
+
+<div class="column-container">
+<div class="column-half">
+<h3 id="Básicos">Básicos</h3>
+
+<ul>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_to_apply_your_CSS_to_your_HTML">Cómo aplicar CSS al HTML</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Syntax#White_space">How to use whitespace in CSS</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Syntax#Comments">Cómo escribir comentarios en CSS</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Simple_selectors">Cómo seleccionar elementos mediante nombre del elemento, clase o ID</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Attribute_selectors">Cómo seleccionar elementos mediante nombre del atributo y contenido</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Pseudo-classes">Cómo usar pseudo-clases</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Pseudo-elements">Cómo usar pseudo-elementos</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Multiple_selectors_on_one_rule">Cómo aplicar múltiples selectores a la misma regla</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Values_and_units#Colors">Cómo especificar colores en CSS</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Debugging_CSS#Inspecting_the_DOM_and_CSS">Cómo depurar CSS en el navegador</a></li>
+</ul>
+
+<h3 id="CSS_y_texto">CSS y texto</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/CSS/Styling_text/Fundamentals">Cómo dar estilo al texto</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Styling_text/Styling_lists">Cómo personalizar una lista de elementos</a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_text/Styling_links">Cómo dar estilo a links</a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_text/Fundamentals#Text_drop_shadows">Cómo agregar sombras al texto</a></li>
+</ul>
+</div>
+
+<div class="column-half">
+<h3 id="Cajas_y_diseños">Cajas y diseños</h3>
+
+<ul>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Box_properties">Cómo redimensionar cajas CSS</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Overflow">Cómo controlar el contenido que desborda</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Background_clip">Cómo controlar la parte de una caja CSS en la que se dibuja el fondo</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Types_of_CSS_boxes">Cómo defino un elemento inline, block o inline-block?</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Howto/create_fancy_boxes">How to create fancy boxes</a> (also see the <a href="/en-US/docs/Learn/CSS/Styling_boxes">Styling boxes</a> module, generally).</li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Background_clip">How to use <code>background-clip</code> to control how much of the box your background image covers</a>.</li>
+ <li><a href="/en-US/Learn/CSS/Styling_boxes/Box_model_recap#Changing_the_box_model_completely">How to change the box model completely using <code>box-sizing</code></a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_boxes/Backgrounds">How to control backgrounds</a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_boxes/Borders">How to control borders</a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_boxes/Styling_tables">How to style an HTML table</a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_boxes/Advanced_box_effects#Box_shadows">How to add shadows to boxes</a></li>
+</ul>
+</div>
+</div>
+
+<h2 id="Uncommon_or_advanced_techniques">Uncommon or advanced techniques</h2>
+
+<p>Beyond the basics, CSS is allows very advanced design techniques. These articles help you tackle the hardest use cases you may face.</p>
+
+<h3 id="General">General</h3>
+
+<ul>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Cascade_and_inheritance#Specificity">How to calculate specificity of a CSS selector</a></li>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Cascade_and_inheritance#Controlling_inheritance">How to control inheritance in CSS</a></li>
+</ul>
+
+<h3 id="Advanced_effects">Advanced effects</h3>
+
+<ul>
+ <li><a href="/en-US/Learn/CSS/Styling_boxes/Advanced_box_effects#Filters">How to use filters in CSS</a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_boxes/Advanced_box_effects#Blend_modes">How to use blend modes in CSS</a></li>
+</ul>
+
+<h3 id="Layout">Layout</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Guide/CSS/Flexible_boxes">Using CSS flexible boxes</a></li>
+ <li><a href="/en-US/docs/Web/Guide/CSS/Using_multi-column_layouts" title="/en-US/docs/Web/Guide/CSS/Using_multi-column_layouts">Using CSS multi-column layouts</a></li>
+</ul>
diff --git a/files/es/learn/css/introduction_to_css/fundamental_css_comprehension/index.html b/files/es/learn/css/introduction_to_css/fundamental_css_comprehension/index.html
deleted file mode 100644
index b53db2df02..0000000000
--- a/files/es/learn/css/introduction_to_css/fundamental_css_comprehension/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: Comprensión de los fundamentos de CSS
-slug: Learn/CSS/Introduction_to_CSS/Fundamental_CSS_comprehension
-tags:
-  - CSS
-  - Estilo
-  - Evaluación
-  - Modelo de Caja
-  - Principiante
-  - Selectores
-  - Sintaxis
-  - comentários
-  - reglas
-translation_of: Learn/CSS/Building_blocks/Fundamental_CSS_comprehension
----
-<div class="boxed translate-rendered">
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenu("Learn/CSS/Introduction_to_CSS/Debugging_CSS", "Learn/CSS/Introduction_to_CSS")}}</div>
-
-<p class="summary">Has avanzado mucho en este módulo, debes sentirte orgulloso de haber llegado hasta el final. El último paso antes de terminar es intentar el examen del módulo — que incluye completar varios ejercicios para crear el último diseño — una tarjeta de presentación/de jugador/perfil de redes sociales.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Antes de intentar esta evaluación, debería haber revisado todos los artículos en este módulo.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Probar la comprensión de los fundamentos de la teoría, sintaxis y mecánica de CSS.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Punto_de_Partida">Punto de Partida</h2>
-
-<p>Para comenzar esta evaluación, debes:</p>
-
-<ul>
- <li>Ve y coge el <a href="https://github.com/mdn/learning-area/blob/master/css/introduction-to-css/fundamental-css-comprehension/index.html">archivo HTML del ejercicio</a>, y el <a href="https://github.com/mdn/learning-area/blob/master/css/introduction-to-css/fundamental-css-comprehension/chris.jpg">archivo de imagen asociada</a>, y guárdalos en un nuevo directorio en tu ordenador local. Si quieres usar tu propio archivo de imagen y rellenar tu propio nombre, eres bienvenido - sólo asegúrate de que la imagen es cuadrada.</li>
- <li>Coge el <a href="https://github.com/mdn/learning-area/blob/master/css/introduction-to-css/fundamental-css-comprehension/style-resources.txt">archivo de texto de los recursos CSS</a> — este contiene un conjunto de selectores y conjuntos de reglas en estado puro que necesitarás estudiar y combinar para responder a parte de esta evaluación.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Alternativamente, se puede utilizar un sitio como  <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer la evaluación. Puede pegar el HTML y completar el CSS en uno de estos editores en línea, y usar  <a href="http://mdn.github.io/learning-area/css/introduction-to-css/fundamental-css-comprehension/chris.jpg">esta URL</a> para apuntar el elemento <code>&lt;img&gt;</code> al archivo de imagen. Si el editor en línea que estás usando no tiene un panel CSS separado, no dudes en ponerlo en un elemento <code>&lt;style&gt;</code> en el encabezado del documento.</p>
-</div>
-
-<h2 id="Resumen_del_Proyecto">Resumen del Proyecto</h2>
-
-<p>Se le ha proporcionado un poco de HTML puro y una imagen, y necesitas escribir el CSS necesario para darle estilo a una pequeña tarjeta de presentación en línea, que tal vez pueda servir como una tarjeta de jugador o de perfil en redes sociales. Las siguientes secciones describen lo que debes hacer.</p>
-
-<p>Configuración básica:</p>
-
-<ul>
- <li>En primer lugar, crea un nuevo archivo en el mismo directorio que tus archivos HTML y de imagen. Llámalo algo realmente imaginativo como <code>style.css</code>.</li>
- <li>Vincula tu CSS a tu archivo HTML mediante un elemento <code>&lt;link&gt;</code>.</li>
- <li>Las dos primeras reglas en el archivo de recursos CSS son tuyas, ¡GRATIS! Después de que hayas terminado de regocijarte de tu buena fortuna, cópialas y pégalas en la parte superior de tu nuevo archivo CSS. Úsalas como prueba para asegurarte de que tu CSS se aplica correctamente a tu HTML.</li>
- <li>
-  <p>Sobre las dos reglas, agregue un comentario CSS con algún texto dentro para indicar que se trata de un conjunto de estilos generales para toda la página. "Estilos generales de la página" sería suficiente. También agrega tres comentarios más en la parte inferior del archivo CSS para indicar estilos específicos para la configuración del contenedor de la tarjeta, estilos específicos para el header y footer (encabezado y pie de página), y estilos específicos para el contenido principal de la tarjeta de presentación. De ahora en adelante, los estilos subsiguientes añadidos a la hoja de estilo deben organizarse en el lugar apropiado.</p>
- </li>
-</ul>
-
-<p>Encargandonos de los selectores y conjuntos de reglas proporcionados:</p>
-
-<ul>
- <li>A continuación, nos gustaría que examinaras los cuatro selectores y calcularas la especificidad de cada uno. Escríbelas en algún lugar donde las puedas encontrar más tarde, como en un comentario en la parte superior de tu CSS.</li>
- <li>Ahora es el momento de poner el selector correcto en el conjunto de reglas correcto! Tienes cuatro pares de selectores y reglas que coinciden en tus recursos de CSS. Hazlo ahora y agrégalos a tu archivo CSS. Necesitaras:
-  <ul>
-   <li>Asignar al contenedor principal de tarjetas un ancho/alto fijo (width/height), color de fondo sólido (background-color), borde (border) y radio de borde (border-radius), entre otras cosas.</li>
-   <li>Asigna al header un degradado (linear-gradient) de fondo que va de más oscuro a más claro, además de esquinas redondeadas que encajan con las esquinas redondeadas establecidas en el contenedor principal de tarjetas.</li>
-   <li>Asigna al pie de página un degradado (linear-gradient) de fondo que vaya de más claro a más oscuro, además de esquinas redondeadas que encajen con las esquinas redondeadas establecidas en el contenedor principal de tarjetas.</li>
-   <li>Asigna a la imagen un float a la derecha para que se pegue al lado derecho del contenido principal de la tarjeta de presentación, y dale una altura máxima (max-height) del 100% (un truco inteligente que asegura que crecerá/encogerá para que se mantenga a la misma altura que el contenedor principal, sin importar a que altura se trasforme).</li>
-  </ul>
- </li>
- <li>¡Cuidado! Hay dos errores en los conjuntos de reglas proporcionados. Utilizando cualquier técnica que conozcas, localízalas y arréglalas antes de seguir adelante.</li>
-</ul>
-
-<p>Nuevos conjuntos de reglas que necesitas escribir:</p>
-
-<ul>
- <li>Escribe un conjunto de reglas que apunte tanto al header de la tarjeta como al footer de la misma, dándoles una altura total de 50px, (que incluye una altura de contenido de 30px y un padding de 10px en todos los lados). Pero expresalo en <code>em</code>s.</li>
- <li>El margen por defecto aplicado a los elementos <code>&lt;h2&gt;</code> y <code>&lt;p&gt;</code> por el navegador interferirá con nuestro diseño, así que escribe una regla que apunte a todos estos elementos y establezca su margen en 0.</li>
- <li>Para evitar que la imagen se derrame del contenido principal de la tarjeta de presentación (el elemento <code>&lt;article&gt;</code>), necesitamos darle una altura específica. Ajustar la altura del <code>&lt;article&gt;</code> a 120px,  expresada en <code>em</code>s. También asigna un background-color negro semitransparente, resultando en un tono ligeramente más oscuro que deja que el color rojo del fondo brille un poco también.</li>
- <li>Escribe un conjunto de reglas que le asigne al <code>&lt;h2&gt;</code> un font-size efectivo de 20px (pero expresado en <code>em</code>s) y una line-height (altura de línea) apropiada para colocarlo en el centro de la caja de contenido del header. Recuerde que la altura de la caja de contenido debe ser de 30px - esto te proporciona todos los números que necesitas para calcular la line-height.</li>
- <li>Escribe un conjunto de reglas que le asigne al <code>&lt;p&gt;</code> dentro del footer un font-size efectivo de 15px (pero expresado en <code>em</code>s) y una line-height apropiada para colocarlo en el centro de la caja de contenido del footer. Recuerda que la altura de la caja de contenido debe ser de 30px - esto te proporciona todos los números que necesitas para calcular la line-height.</li>
- <li>Como último toque, asigna al párrafo dentro del <code>&lt;article&gt;</code> un padding apropiado para que su borde izquierdo se alinee con el <code>&lt;h2&gt;</code> y el párrafo del footer, y ajuste su color para que sea bastante claro y sea fácil de leer.</li>
-</ul>
-
-<p>Otras cosas en las que pensar:</p>
-
-<ul>
- <li>Obtendrás puntos adicionales si escribes tu CSS para una legibilidad máxima, con una declaración separada en cada línea..</li>
- <li>Deberás incluir <code>.card</code> al principio de la cadena de selección en todas tus reglas,  para que estas reglas no interfieran con el estilo de cualquier otro elemento si la tarjeta de presentación se pusiera en una página con un montón de otro contenido.</li>
-</ul>
-
-<h2 id="Consejos_y_Sugerencias">Consejos y Sugerencias</h2>
-
-<ul>
- <li>No necesitas editar el HTML de ninguna manera, excepto para aplicar el CSS a tu HTML.</li>
- <li>Cuando intentes calcular el valor <code>em</code> que necesita para representar una cierta longitud de píxel, piensa en el tamaño de fuente base que tiene el elemento raíz (<code>&lt;html&gt;</code>) , y por el que necesita multiplicarse para obtener el valor deseado. Eso te dará tu valor, al menos en un caso sencillo como este.</li>
-</ul>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>La siguiente captura de pantalla muestra un ejemplo de cómo debe ser el diseño terminado:</p>
-
-<p><img alt="A view of the finished business card, show a reader header and footer, and a darker center panel containing the main details and image." src="https://mdn.mozillademos.org/files/12616/business-card.png" style="display: block; margin: 0 auto;"></p>
-
-<p> </p>
-
-<h2 id="Evaluación">Evaluación</h2>
-
-<p>Si estás siguiendo esta evaluación como parte de un curso organizado, deberías ser capaz de entregar tu trabajo a tu profesor/mentor para que lo califique. Si eres autodidacta, entonces puedes obtener la guía de puntuación fácilmente preguntando en el hilo del <a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">Discurso del Área de Aprendizaje</a>, o en el canal IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Haz el ejercicio primero - ¡No hay nada que ganar haciendo trampa!</p>
-
-<p>{{PreviousMenu("Learn/CSS/Introduction_to_CSS/Debugging_CSS", "Learn/CSS/Introduction_to_CSS")}}</p>
-</div>
diff --git a/files/es/learn/css/styling_text/fuentes_web/index.html b/files/es/learn/css/styling_text/fuentes_web/index.html
deleted file mode 100644
index 7bfa162217..0000000000
--- a/files/es/learn/css/styling_text/fuentes_web/index.html
+++ /dev/null
@@ -1,197 +0,0 @@
----
-title: Fuentes web
-slug: Learn/CSS/Styling_text/Fuentes_web
-translation_of: Learn/CSS/Styling_text/Web_fonts
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/CSS/Styling_text/Styling_links", "Learn/CSS/Styling_text/Typesetting_a_homepage", "Learn/CSS/Styling_text")}}</div>
-
-<p class="summary">En el primer artículo del módulo, exploramos las características básicas del CSS disponibles para aplicar estilos a tipos de letra y al texto. En este artículo vamos a ir más lejos: exploraremos en detalle las tipografías web, que permiten que te descargues tipos de letra personalizados junto con tu página web para lograr un estilo de texto más variado y personalizado.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>), <a href="/es/docs/Learn/CSS/Styling_text/Fundamentals">texto CSS y los fundamentos de la fuente</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender a aplicar tipos de letra a una página web, ya sea desde un servicio de terceros o desde tu código.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Resumen_de_las_familias_de_tipos_de_letra">Resumen de las familias de tipos de letra</h2>
-
-<p>Como observamos en el artículo <a href="/es/docs/Learn/CSS/Styling_text/Fundamentals">Texto y tipos de letra</a>, puedes controlar los tipos de letra que aplicas a tu HTML con la propiedad {{cssxref ("font-family")}}. Este atributo toma uno o más nombres de familia de tipos de letra y el navegador recorre esta lista hasta que encuentra un tipo de letra disponible en el sistema en el que se ejecuta:</p>
-
-<pre class="brush: css notranslate">p {
-  font-family: Helvetica, "Trebuchet MS", Verdana, sans-serif;
-}</pre>
-
-<p>Este sistema funciona bien, pero las opciones de tipo de letra tradicionales de los desarrolladores web eran limitadas. Solo hay un puñado de tipos de letra que puedes garantizar que están disponibles en todos los sistemas comunes: las llamadas <a href="/es/docs/Learn/CSS/Styling_text/Fundamentals#Familia_de_tipos_de_letras">fuentes seguras para la web</a>. Puedes usar la lista de tipos de letra para especificar cuáles prefieres, seguido de alternativas seguras para la web y del tipo de letra predeterminado del sistema. El problema es que esto añade trabajo extra en términos de pruebas para asegurarte de que tus diseños se ven bien con cada tipo de letra, etc.</p>
-
-<h2 id="Tipografías_web">Tipografías web</h2>
-
-<p>Hay una alternativa, sin embargo, que funciona muy bien hasta con versiones posteriores a la versión 6 de Internet Explorer. Las tipografías web son una función del CSS que te permite especificar los archivos de tipo de letra que se van a descargar junto con tu sitio web a medida que el usuario acceda a ellos, lo que significa que cualquier navegador que admita tipografías web puede disponer de los tipos de letra que especificas. ¡Increíble! Observa a continuación la sintaxis que se necesita.</p>
-
-<p>En primer lugar, tienes un bloque {{cssxref ("@font-face")}} al comienzo del CSS, que especifica los archivos de los tipos de letra que quieres que se descarguen:</p>
-
-<pre class="brush: css notranslate">@font-face {
-  font-family: "myFont";
-  src: url("myFont.woff");
-}</pre>
-
-<p>A continuación, puedes usar el nombre de la familia de tipos de letra especificado en <code>@font-face</code> para aplicar tu tipo de letra personalizado a cualquier elemento que desees:</p>
-
-<pre class="brush: css notranslate">html {
-  font-family: "myFont", "Bitstream Vera Serif", serif;
-}</pre>
-
-<p>La sintaxis es un poco más compleja; más adelante la veremos más detalladamente.</p>
-
-<p>Hay dos cosas importantes a tener en cuenta acerca de las tipografías web:</p>
-
-<ol>
- <li>Los navegadores admiten diferentes formatos de tipos de letra, por lo que necesitarás más de un formato de tipos de letra para conseguir una compatibilidad decente entre navegadores. Por ejemplo, la mayoría de los navegadores modernos admiten WOFF/WOFF2 (Web Open Font Format, versiones 1 y 2), el formato más eficiente disponible. Pero las versiones antiguas de Internet Explorer solo admiten tipos de letra con formato EOT (Embedded Open Type) y es posible que debas incluir una versión SVG del tipo de letra para soportar versiones antiguas de navegadores iPhone y Android. A continuación te mostraremos cómo generar el código necesario.</li>
- <li>Generalmente las fuentes no son de uso gratuito. Debes pagar por ellas y/o respetar otras condiciones de licencia, como acreditar al creador del tipo de letra en el código (o en tu sitio web). Los tipos de letra no deben robarse, ni debes utilizarlos sin otorgar a su creador el crédito apropiado.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: ¡Los tipos de letra seguros para web como tecnología han sido compatibles con Internet Explorer desde su versión 4!</p>
-</div>
-
-<h2 id="Aprendizaje_activo_Un_ejemplo_de_tipo_de_letra_seguro_para_web">Aprendizaje activo: Un ejemplo de tipo de letra seguro para web</h2>
-
-<p>Con esto en mente, vamos a construir un ejemplo básico de uso de un tipo de letra seguro para web a partir de los principios básicos. Es difícil hacer un ejemplo de demostración de este aspecto con un ejemplo en vivo incrustado, por lo tanto, nos gustaría que siguieses los pasos que se detallan en las secciones siguientes para que te hagas una idea de cómo funciona el proceso.</p>
-
-<p>Como punto de partida hay que utilizar los archivos <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-start.html">web-font-start.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-start.css">web-font-start.css</a> a los que añadir tu código (véase el <a href="http://mdn.github.io/learning-area/css/styling-text/web-fonts/web-font-start.html">ejemplo en vivo</a>). Haz una copia de estos archivos en un directorio nuevo de tu equipo. En el archivo <code>web-font-start.css</code>, encontrarás un poco de CSS para trabajar con el aspecto y los tipos de letra básicos del ejemplo.</p>
-
-<h3 id="Encontrar_tipos_de_letra">Encontrar tipos de letra</h3>
-
-<p>Para este ejemplo, utilizaremos dos tipografías web: una para los títulos de encabezado y otra para el texto base. Para empezar, hay que encontrar los archivos que contienen el tipo de letra. Los tipos de letra se crean en estudios de diseño y se guardan en diversos formatos de archivo. En general, hay tres tipos de sitios donde puedes obtener fuentes:</p>
-
-<ul>
- <li>Un distribuidor gratuito de tipos de letra: Es un sitio web que pone a disposición tipos de letra para descargar de forma gratuita (aunque puede haber algunas condiciones de licencia, como la acreditación del creador del tipo de letra). Algunos ejemplos de sitios web donde puedes encontrar tipos de letra gratis son <a href="https://www.fontsquirrel.com/">Font Squirrel</a>, <a href="http://www.dafont.com/">dafont</a> y <a href="https://everythingfonts.com/">Everything Fonts</a>.</li>
- <li>Un distribuidor de fuentes de pago: En este sitio web puedes encontrar tipos de letra a cambio de un precio, dos ejemplos son <a href="http://www.fonts.com/">fonts.com</a> o <a href="http://www.myfonts.com/">myfonts.com</a>. También puedes comprar tipos de letra directamente de estudios de diseño, por ejemplo, <a href="https://www.linotype.com/">Linotype</a>, <a href="http://www.monotype.com">Monotype</a>, o <a href="http://www.exljbris.com/">Exljbris</a>.</li>
- <li>Un servicio de tipos de letra en línea: Es un sitio que guarda y te sirve los tipos de letra, lo que te facilita todo el proceso. Consulta la sección {{anch ("Los servicios de tipos de letra en línea")}} para obtener más información.</li>
-</ul>
-
-<p>Vamos a ver algunos tipos de letra. Ve a <a href="https://www.fontsquirrel.com/">Font Squirrel</a> y elige dos tipos de letra: uno que te resulte agradable e interesante para los títulos (quizá una buena tipografía de tipo Display o Slab Serif), y otro un poco menos llamativo y más legible para los párrafos. Cuando encuentres los tipos de letra, pulsa el botón de descarga y guarda el archivo en el mismo directorio que los archivos HTML y CSS que guardaste anteriormente. No importa si son TTF (True Type Fonts) u OTF (Open Type Fonts).</p>
-
-<p>En cada caso, descomprime el paquete de tipos de letra (las tipografías web generalmente se distribuyen en archivos ZIP que contienen los archivos con el tipo de letra y la información de la licencia). En el paquete puede haber más de un archivo con tipos de letra: algunos tipos de letra se distribuyen por familias, con diferentes variantes disponibles, por ejemplo: <em>thin</em>, <em>medium</em>, <em>bold</em>, <em>italic</em>, <em>thin italic</em>, etc. Para este ejemplo, solo queremos que te quedes con un solo archivo de fuente para cada opción.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: En la sección «Encontrar tipos de letra» en la columna de la derecha, puedes hacer clic en las diferentes etiquetas y clasificaciones para filtrar las opciones.</p>
-</div>
-
-<h3 id="Generar_el_código">Generar el código</h3>
-
-<p>Ahora deberás generar el código que necesitas (y aplicar el estilo al tipo de letra). Para cada tipo de letra, sigue estos pasos:</p>
-
-<ol>
- <li>Asegúrate de cumplir con todos los requisitos de la licencia, sobre todo si vas a usarlo en un proyecto comercial y/o en una web.</li>
- <li>Ve a <a href="https://www.fontsquirrel.com/tools/webfont-generator">Webfont Generator </a>de Fontsquirrel.</li>
- <li>Sube tus dos archivos de tipo de letra con el botón <em>Cargar Fuentes</em>.</li>
- <li>Marca la casilla de verificación con el texto «Sí, las fuentes que elijo pueden utilizarse legalmente para una página web».</li>
- <li>Haz clic en <em>Descarga tu paquete</em>.</li>
-</ol>
-
-<p>Una vez que el generador haya finalizado el procesamiento, deberías obtener un archivo ZIP para descargar; guárdalo en el mismo directorio que tus archivos HTML y CSS.</p>
-
-<h3 id="El_código_de_tu_ejemplo_de_demostración">El código de tu ejemplo de demostración</h3>
-
-<p>En este punto, descomprime el paquete con los tipos de letra web que acabas de generar. En el directorio descomprimido verás tres elementos útiles:</p>
-
-<ul>
- <li>Las distintas versiones de cada tipo de letra, por ejemplo: <code>.ttf</code>, <code>.woff</code>, <code>.woff2</code>, etc.; los tipos de letra exactos proporcionados se actualizarán con el tiempo a medida que cambien los requisitos técnicos del navegador. Como se ya hemos dicho, se necesita más de un tipo de letra para garantizar la compatibilidad entre navegadores: esta es la forma en que Fontsquirrel se asegura de que tengas todo lo que necesitas.</li>
- <li>Un archivo HTML con un ejemplo de demostración para cada tipo de letra: cárgalos en tu navegador para ver cómo se ve la fuente en diferentes contextos de uso.</li>
- <li>Un archivo <code>stylesheet.css</code>, que contiene el código @font-face que necesitas.</li>
-</ul>
-
-<p>Para implementar estos tipos de letra en tu ejemplo de demostración, sigue estos pasos:</p>
-
-<ol>
- <li>Cambia el nombre del directorio descomprimido a algo fácil y simple, como <code>fonts</code>.</li>
- <li>Abre el archivo <code>stylesheet.css</code> y copia los dos bloques <code>@font-face</code> incluidos en tu archivo <code>web-font-start.css</code>. Debes ponerlos en la parte superior, antes de cualquier elemento CSS, ya que los tipos de letra deben importarse antes que los puedas utilizar en tu sitio web.</li>
- <li>Cada una de las funciones <code>url()</code> apunta a un archivo de tipo de letra que tenemos que importar a nuestro CSS. Necesitamos asegurarnos de que las rutas a los archivos son correctas, así que añade <code>fonts/</code> al inicio de cada ruta (ajusta la ruta como sea necesario).</li>
- <li>Ahora puedes usar estos tipos de letra en tu lista de tipos de letra, al igual que cualquier tipo de letra seguro o predeterminado del sistema. Por ejemplo:
-  <pre class="brush: css notranslate">font-family: 'zantrokeregular', serif;</pre>
- </li>
-</ol>
-
-<p>Con tu ejemplo de demostración, deberías obtener una página con unos agradables tipos de letra. Debido a que los tipos de letra se crean en diferentes tamaños, es posible que tengas que ajustar el tamaño, el espaciado, etc., para conseguir una apariencia más ordenada.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/12984/web-font-example.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si tienes problemas para lograr que esto funcione, no dudes en comparar tu versión con nuestros archivos terminados, consulta <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-finished.html">web-font-finished.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-finished.css">web-font-finished.css</a> (<a href="http://mdn.github.io/learning-area/css/styling-text/web-fonts/web-font-finished.html">ejecuta el ejemplo terminado en vivo</a>).</p>
-</div>
-
-<h2 id="Los_servicios_de_tipos_de_letra_en_línea">Los servicios de tipos de letra en línea</h2>
-
-<p>Los servicios de tipos de letra en línea en general guardan tipos de letra y los proporcionan a los usuarios, por lo que no tienes que preocuparte por escribir el código <code>@font-face</code>, solo necesitas insertar una o dos sencillas líneas de código en tu sitio web para que todo funcione. Los ejemplos incluyen <a href="https://fonts.adobe.com/">Adobe Fonts</a> y <a href="http://www.typography.com/cloud/welcome/">Cloud.typography</a>. La mayoría de estos servicios se basan en suscripciones de pago, con la excepción notable de <a href="https://www.google.com/fonts">Google Fonts</a>, un servicio gratuito y muy útil, sobre todo para trabajos de prueba rápida y escritura de ejemplos de demostración.</p>
-
-<p>La mayoría de estos servicios son fáciles de usar, por lo que no vamos a exponerlos en gran detalle. Vamos a echar un vistazo rápido a las fuentes de Google, para que te hagas una idea. De nuevo, usa copias de <code>web-font-start.html</code> y <code>web-font-start.css</code> como punto de partida.</p>
-
-<ol>
- <li>Ve a <a href="https://www.google.com/fonts">Google Fonts</a>.</li>
- <li>Usa los filtros del lado izquierdo para indicar los tipos de letra que deseas escoger y elige un par de tipos de letra que te gusten.</li>
- <li>Para seleccionar una familia de tipos de letra, pulsa el botón ⊕ que encontrarás al lado.</li>
- <li>Cuando hayas elegido las familias de tipos de letra, pulsa la barra <em>[número] familias seleccionadas</em> que encontrarás en la parte inferior de la página.</li>
- <li>En la pantalla resultante, primero debes copiar la línea de código HTML que se muestra y pegarla en el encabezado de tu archivo HTML. Ponlo encima del elemento {{HTMLElement("link")}}, de modo que el tipo de letra se importe correctamente antes de intentar utilizarlo en tu CSS.</li>
- <li>Luego, debes copiar las declaraciones CSS enumeradas en tu CSS según corresponda para aplicar los tipos de letra personalizados a tu HTML.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar una versión completa en <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/google-font.html">google-font.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/google-font.css">google-font.css</a>, si necesitas comparar tu trabajo con el nuestro (<a href="http://mdn.github.io/learning-area/css/styling-text/web-fonts/google-font.html">consúltalo en vivo</a>).</p>
-</div>
-
-<h2 id="font-face_con_más_detalle">@font-face con más detalle</h2>
-
-<p>Vamos a explorar que la sintaxis correspondiente a <code>@font-face</code> que te ha generado Fontsquirrel. Uno de los bloques se verá así:</p>
-
-<pre class="brush: css notranslate">@font-face {
-  font-family: 'ciclefina';
-  src: url('fonts/cicle_fina-webfont.eot');
-  src: url('fonts/cicle_fina-webfont.eot?#iefix') format('embedded-opentype'),
-         url('fonts/cicle_fina-webfont.woff2') format('woff2'),
-         url('fonts/cicle_fina-webfont.woff') format('woff'),
-         url('fonts/cicle_fina-webfont.ttf') format('truetype'),
-         url('fonts/cicle_fina-webfont.svg#ciclefina') format('svg');
-  font-weight: normal;
-  font-style: normal;
-}</pre>
-
-<p>Esto se conoce como «sintaxis @font-face a prueba de balas» desde una publicación de Paul Irish, en los tiempos en que <code><code>@font-face</code></code> empezaba a popularizarse (<a href="http://www.paulirish.com/2009/bulletproof-font-face-implementation-syntax/">Bulletproof @font-face Syntax</a>). Vamos a ver qué hace:</p>
-
-<ul>
- <li><code><code><code>font-family</code></code></code>: Esta línea especifica el nombre con el que vas a referirte a la fuente. Puedes poner el que quieras, siempre y cuando lo uses de manera coherente a lo largo de tu CSS.</li>
- <li><code><code><code>src</code></code></code>: Estas líneas especifican las rutas de acceso a los archivos de tipos de letra para que puedas importarlos a tu CSS (la parte <code><code><code>URL</code></code></code>) y el formato de cada archivo de tipo de letra (la parte <code><code><code>format</code></code></code>). La última parte en cada caso es opcional, pero es útil declararla porque permite que los navegadores encuentren más rápido un tipo de letra que puedan usar. Se pueden enumerar varias declaraciones, separadas por comas: el navegador buscará por ellas y usará la primera que encuentre. Por lo tanto, es mejor poner formatos nuevos y mejores, como WOFF2 y formatos más antiguos, no tan buenos, como TTF. La única excepción son las fuentes EOT: se colocan primero para corregir un par de errores en versiones anteriores de Internet Explorer, por lo que intentará usar lo primero que encuentre, incluso si realmente no puede usar la fuente.</li>
- <li>{{cssxref("font-weight")}}/{{cssxref("font-style")}}: Estas líneas especifican qué grueso tiene el tipo de letra y si se muestra en cursiva o no. Si vas a importar diversos grosores del mismo tipo de letra, puedes especificar cuál es su grueso/estilo y luego usar valores de {{cssxref("font-weight")}} / {{cssxref("font-style")}} diferentes para elegir entre ellos, en lugar de tener que llamar a todos los diferentes miembros de la familia de tipos de letra con nombres distintos. <a href="http://www.456bereastreet.com/archive/201012/font-face_tip_define_font-weight_and_font-style_to_keep_your_css_simple/">@tip-face tip: define font-weight and font-stile to keep your CSS simple</a> de Roger Johansson muestra qué hacer con más detalle.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: También puedes especificar los valores particulares {{cssxref ("font-variant")}} y {{cssxref ("font-stretch")}} para tus tipos de letra seguros para web. En los navegadores más nuevos también puedes especificar un valor {{cssxref ("unicode-range")}}, que es un rango de caracteres específicos que debes usar aparte del tipo de letra seguro para web en los navegadores que incluyan esta opción. Solo se descargaran los caracteres especificados y te ahorrarás descargas innecesarias. <a href="https://24ways.org/2011/creating-custom-font-stacks-with-unicode-range/">Creating Custom Font Stacks with Unicode-Range</a> de Drew McLellan proporciona algunas ideas útiles sobre cómo hacer uso de todo esto.</p>
-</div>
-
-<h2 id="Tipos_de_letra_variables">Tipos de letra variables</h2>
-
-<p>Los navegadores disponen hoy de una tecnología de tipos de letra reciente llamada tipos de letra variables: se trata de tipos de letra que permiten incorporar muchas variaciones diferentes de un tipo de letra en un solo archivo, en lugar de tener un archivo separado para cada ancho, grosor o estilo. Es demasiado avanzado para nuestro curso para principiantes, pero si te apetece avanzar y echarles un vistazo, lee nuestra <a href="/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide">guía de tipos de letra variables</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Ahora que has leído nuestros artículos sobre nociones de aplicación de estilo al texto, es hora de evaluar cuánto has retenido del módulo a partir de la creación de una composición tipográfica de una página de inicio de una escuela comunitaria.</p>
-
-<p>{{PreviousMenuNext("Learn/CSS/Styling_text/Styling_links", "Learn/CSS/Styling_text/Typesetting_a_homepage", "Learn/CSS/Styling_text")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/CSS/Styling_text/Fundamentals">Texto fundamental y estilo de fuente</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Styling_text/Styling_lists">Dar estilo a las listas</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Styling_text/Styling_links">Dar estilo a los enlaces</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Styling_text/Web_fonts">Las fuentes web</a></li>
- <li><a href="/en-US/Learn/CSS/Styling_text/Typesetting_a_homepage">Composición tipográfica de una página de inicio de una escuela comunitaria</a></li>
-</ul>
diff --git a/files/es/learn/css/styling_text/web_fonts/index.html b/files/es/learn/css/styling_text/web_fonts/index.html
new file mode 100644
index 0000000000..880307b419
--- /dev/null
+++ b/files/es/learn/css/styling_text/web_fonts/index.html
@@ -0,0 +1,198 @@
+---
+title: Fuentes web
+slug: Learn/CSS/Styling_text/Web_fonts
+translation_of: Learn/CSS/Styling_text/Web_fonts
+original_slug: Learn/CSS/Styling_text/Fuentes_web
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/CSS/Styling_text/Styling_links", "Learn/CSS/Styling_text/Typesetting_a_homepage", "Learn/CSS/Styling_text")}}</div>
+
+<p class="summary">En el primer artículo del módulo, exploramos las características básicas del CSS disponibles para aplicar estilos a tipos de letra y al texto. En este artículo vamos a ir más lejos: exploraremos en detalle las tipografías web, que permiten que te descargues tipos de letra personalizados junto con tu página web para lograr un estilo de texto más variado y personalizado.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, conceptos básicos de HTML (véase <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>) y de CSS (véase <a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a>), <a href="/es/docs/Learn/CSS/Styling_text/Fundamentals">texto CSS y los fundamentos de la fuente</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender a aplicar tipos de letra a una página web, ya sea desde un servicio de terceros o desde tu código.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Resumen_de_las_familias_de_tipos_de_letra">Resumen de las familias de tipos de letra</h2>
+
+<p>Como observamos en el artículo <a href="/es/docs/Learn/CSS/Styling_text/Fundamentals">Texto y tipos de letra</a>, puedes controlar los tipos de letra que aplicas a tu HTML con la propiedad {{cssxref ("font-family")}}. Este atributo toma uno o más nombres de familia de tipos de letra y el navegador recorre esta lista hasta que encuentra un tipo de letra disponible en el sistema en el que se ejecuta:</p>
+
+<pre class="brush: css notranslate">p {
+  font-family: Helvetica, "Trebuchet MS", Verdana, sans-serif;
+}</pre>
+
+<p>Este sistema funciona bien, pero las opciones de tipo de letra tradicionales de los desarrolladores web eran limitadas. Solo hay un puñado de tipos de letra que puedes garantizar que están disponibles en todos los sistemas comunes: las llamadas <a href="/es/docs/Learn/CSS/Styling_text/Fundamentals#Familia_de_tipos_de_letras">fuentes seguras para la web</a>. Puedes usar la lista de tipos de letra para especificar cuáles prefieres, seguido de alternativas seguras para la web y del tipo de letra predeterminado del sistema. El problema es que esto añade trabajo extra en términos de pruebas para asegurarte de que tus diseños se ven bien con cada tipo de letra, etc.</p>
+
+<h2 id="Tipografías_web">Tipografías web</h2>
+
+<p>Hay una alternativa, sin embargo, que funciona muy bien hasta con versiones posteriores a la versión 6 de Internet Explorer. Las tipografías web son una función del CSS que te permite especificar los archivos de tipo de letra que se van a descargar junto con tu sitio web a medida que el usuario acceda a ellos, lo que significa que cualquier navegador que admita tipografías web puede disponer de los tipos de letra que especificas. ¡Increíble! Observa a continuación la sintaxis que se necesita.</p>
+
+<p>En primer lugar, tienes un bloque {{cssxref ("@font-face")}} al comienzo del CSS, que especifica los archivos de los tipos de letra que quieres que se descarguen:</p>
+
+<pre class="brush: css notranslate">@font-face {
+  font-family: "myFont";
+  src: url("myFont.woff");
+}</pre>
+
+<p>A continuación, puedes usar el nombre de la familia de tipos de letra especificado en <code>@font-face</code> para aplicar tu tipo de letra personalizado a cualquier elemento que desees:</p>
+
+<pre class="brush: css notranslate">html {
+  font-family: "myFont", "Bitstream Vera Serif", serif;
+}</pre>
+
+<p>La sintaxis es un poco más compleja; más adelante la veremos más detalladamente.</p>
+
+<p>Hay dos cosas importantes a tener en cuenta acerca de las tipografías web:</p>
+
+<ol>
+ <li>Los navegadores admiten diferentes formatos de tipos de letra, por lo que necesitarás más de un formato de tipos de letra para conseguir una compatibilidad decente entre navegadores. Por ejemplo, la mayoría de los navegadores modernos admiten WOFF/WOFF2 (Web Open Font Format, versiones 1 y 2), el formato más eficiente disponible. Pero las versiones antiguas de Internet Explorer solo admiten tipos de letra con formato EOT (Embedded Open Type) y es posible que debas incluir una versión SVG del tipo de letra para soportar versiones antiguas de navegadores iPhone y Android. A continuación te mostraremos cómo generar el código necesario.</li>
+ <li>Generalmente las fuentes no son de uso gratuito. Debes pagar por ellas y/o respetar otras condiciones de licencia, como acreditar al creador del tipo de letra en el código (o en tu sitio web). Los tipos de letra no deben robarse, ni debes utilizarlos sin otorgar a su creador el crédito apropiado.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: ¡Los tipos de letra seguros para web como tecnología han sido compatibles con Internet Explorer desde su versión 4!</p>
+</div>
+
+<h2 id="Aprendizaje_activo_Un_ejemplo_de_tipo_de_letra_seguro_para_web">Aprendizaje activo: Un ejemplo de tipo de letra seguro para web</h2>
+
+<p>Con esto en mente, vamos a construir un ejemplo básico de uso de un tipo de letra seguro para web a partir de los principios básicos. Es difícil hacer un ejemplo de demostración de este aspecto con un ejemplo en vivo incrustado, por lo tanto, nos gustaría que siguieses los pasos que se detallan en las secciones siguientes para que te hagas una idea de cómo funciona el proceso.</p>
+
+<p>Como punto de partida hay que utilizar los archivos <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-start.html">web-font-start.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-start.css">web-font-start.css</a> a los que añadir tu código (véase el <a href="http://mdn.github.io/learning-area/css/styling-text/web-fonts/web-font-start.html">ejemplo en vivo</a>). Haz una copia de estos archivos en un directorio nuevo de tu equipo. En el archivo <code>web-font-start.css</code>, encontrarás un poco de CSS para trabajar con el aspecto y los tipos de letra básicos del ejemplo.</p>
+
+<h3 id="Encontrar_tipos_de_letra">Encontrar tipos de letra</h3>
+
+<p>Para este ejemplo, utilizaremos dos tipografías web: una para los títulos de encabezado y otra para el texto base. Para empezar, hay que encontrar los archivos que contienen el tipo de letra. Los tipos de letra se crean en estudios de diseño y se guardan en diversos formatos de archivo. En general, hay tres tipos de sitios donde puedes obtener fuentes:</p>
+
+<ul>
+ <li>Un distribuidor gratuito de tipos de letra: Es un sitio web que pone a disposición tipos de letra para descargar de forma gratuita (aunque puede haber algunas condiciones de licencia, como la acreditación del creador del tipo de letra). Algunos ejemplos de sitios web donde puedes encontrar tipos de letra gratis son <a href="https://www.fontsquirrel.com/">Font Squirrel</a>, <a href="http://www.dafont.com/">dafont</a> y <a href="https://everythingfonts.com/">Everything Fonts</a>.</li>
+ <li>Un distribuidor de fuentes de pago: En este sitio web puedes encontrar tipos de letra a cambio de un precio, dos ejemplos son <a href="http://www.fonts.com/">fonts.com</a> o <a href="http://www.myfonts.com/">myfonts.com</a>. También puedes comprar tipos de letra directamente de estudios de diseño, por ejemplo, <a href="https://www.linotype.com/">Linotype</a>, <a href="http://www.monotype.com">Monotype</a>, o <a href="http://www.exljbris.com/">Exljbris</a>.</li>
+ <li>Un servicio de tipos de letra en línea: Es un sitio que guarda y te sirve los tipos de letra, lo que te facilita todo el proceso. Consulta la sección {{anch ("Los servicios de tipos de letra en línea")}} para obtener más información.</li>
+</ul>
+
+<p>Vamos a ver algunos tipos de letra. Ve a <a href="https://www.fontsquirrel.com/">Font Squirrel</a> y elige dos tipos de letra: uno que te resulte agradable e interesante para los títulos (quizá una buena tipografía de tipo Display o Slab Serif), y otro un poco menos llamativo y más legible para los párrafos. Cuando encuentres los tipos de letra, pulsa el botón de descarga y guarda el archivo en el mismo directorio que los archivos HTML y CSS que guardaste anteriormente. No importa si son TTF (True Type Fonts) u OTF (Open Type Fonts).</p>
+
+<p>En cada caso, descomprime el paquete de tipos de letra (las tipografías web generalmente se distribuyen en archivos ZIP que contienen los archivos con el tipo de letra y la información de la licencia). En el paquete puede haber más de un archivo con tipos de letra: algunos tipos de letra se distribuyen por familias, con diferentes variantes disponibles, por ejemplo: <em>thin</em>, <em>medium</em>, <em>bold</em>, <em>italic</em>, <em>thin italic</em>, etc. Para este ejemplo, solo queremos que te quedes con un solo archivo de fuente para cada opción.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: En la sección «Encontrar tipos de letra» en la columna de la derecha, puedes hacer clic en las diferentes etiquetas y clasificaciones para filtrar las opciones.</p>
+</div>
+
+<h3 id="Generar_el_código">Generar el código</h3>
+
+<p>Ahora deberás generar el código que necesitas (y aplicar el estilo al tipo de letra). Para cada tipo de letra, sigue estos pasos:</p>
+
+<ol>
+ <li>Asegúrate de cumplir con todos los requisitos de la licencia, sobre todo si vas a usarlo en un proyecto comercial y/o en una web.</li>
+ <li>Ve a <a href="https://www.fontsquirrel.com/tools/webfont-generator">Webfont Generator </a>de Fontsquirrel.</li>
+ <li>Sube tus dos archivos de tipo de letra con el botón <em>Cargar Fuentes</em>.</li>
+ <li>Marca la casilla de verificación con el texto «Sí, las fuentes que elijo pueden utilizarse legalmente para una página web».</li>
+ <li>Haz clic en <em>Descarga tu paquete</em>.</li>
+</ol>
+
+<p>Una vez que el generador haya finalizado el procesamiento, deberías obtener un archivo ZIP para descargar; guárdalo en el mismo directorio que tus archivos HTML y CSS.</p>
+
+<h3 id="El_código_de_tu_ejemplo_de_demostración">El código de tu ejemplo de demostración</h3>
+
+<p>En este punto, descomprime el paquete con los tipos de letra web que acabas de generar. En el directorio descomprimido verás tres elementos útiles:</p>
+
+<ul>
+ <li>Las distintas versiones de cada tipo de letra, por ejemplo: <code>.ttf</code>, <code>.woff</code>, <code>.woff2</code>, etc.; los tipos de letra exactos proporcionados se actualizarán con el tiempo a medida que cambien los requisitos técnicos del navegador. Como se ya hemos dicho, se necesita más de un tipo de letra para garantizar la compatibilidad entre navegadores: esta es la forma en que Fontsquirrel se asegura de que tengas todo lo que necesitas.</li>
+ <li>Un archivo HTML con un ejemplo de demostración para cada tipo de letra: cárgalos en tu navegador para ver cómo se ve la fuente en diferentes contextos de uso.</li>
+ <li>Un archivo <code>stylesheet.css</code>, que contiene el código @font-face que necesitas.</li>
+</ul>
+
+<p>Para implementar estos tipos de letra en tu ejemplo de demostración, sigue estos pasos:</p>
+
+<ol>
+ <li>Cambia el nombre del directorio descomprimido a algo fácil y simple, como <code>fonts</code>.</li>
+ <li>Abre el archivo <code>stylesheet.css</code> y copia los dos bloques <code>@font-face</code> incluidos en tu archivo <code>web-font-start.css</code>. Debes ponerlos en la parte superior, antes de cualquier elemento CSS, ya que los tipos de letra deben importarse antes que los puedas utilizar en tu sitio web.</li>
+ <li>Cada una de las funciones <code>url()</code> apunta a un archivo de tipo de letra que tenemos que importar a nuestro CSS. Necesitamos asegurarnos de que las rutas a los archivos son correctas, así que añade <code>fonts/</code> al inicio de cada ruta (ajusta la ruta como sea necesario).</li>
+ <li>Ahora puedes usar estos tipos de letra en tu lista de tipos de letra, al igual que cualquier tipo de letra seguro o predeterminado del sistema. Por ejemplo:
+  <pre class="brush: css notranslate">font-family: 'zantrokeregular', serif;</pre>
+ </li>
+</ol>
+
+<p>Con tu ejemplo de demostración, deberías obtener una página con unos agradables tipos de letra. Debido a que los tipos de letra se crean en diferentes tamaños, es posible que tengas que ajustar el tamaño, el espaciado, etc., para conseguir una apariencia más ordenada.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12984/web-font-example.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si tienes problemas para lograr que esto funcione, no dudes en comparar tu versión con nuestros archivos terminados, consulta <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-finished.html">web-font-finished.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/web-font-finished.css">web-font-finished.css</a> (<a href="http://mdn.github.io/learning-area/css/styling-text/web-fonts/web-font-finished.html">ejecuta el ejemplo terminado en vivo</a>).</p>
+</div>
+
+<h2 id="Los_servicios_de_tipos_de_letra_en_línea">Los servicios de tipos de letra en línea</h2>
+
+<p>Los servicios de tipos de letra en línea en general guardan tipos de letra y los proporcionan a los usuarios, por lo que no tienes que preocuparte por escribir el código <code>@font-face</code>, solo necesitas insertar una o dos sencillas líneas de código en tu sitio web para que todo funcione. Los ejemplos incluyen <a href="https://fonts.adobe.com/">Adobe Fonts</a> y <a href="http://www.typography.com/cloud/welcome/">Cloud.typography</a>. La mayoría de estos servicios se basan en suscripciones de pago, con la excepción notable de <a href="https://www.google.com/fonts">Google Fonts</a>, un servicio gratuito y muy útil, sobre todo para trabajos de prueba rápida y escritura de ejemplos de demostración.</p>
+
+<p>La mayoría de estos servicios son fáciles de usar, por lo que no vamos a exponerlos en gran detalle. Vamos a echar un vistazo rápido a las fuentes de Google, para que te hagas una idea. De nuevo, usa copias de <code>web-font-start.html</code> y <code>web-font-start.css</code> como punto de partida.</p>
+
+<ol>
+ <li>Ve a <a href="https://www.google.com/fonts">Google Fonts</a>.</li>
+ <li>Usa los filtros del lado izquierdo para indicar los tipos de letra que deseas escoger y elige un par de tipos de letra que te gusten.</li>
+ <li>Para seleccionar una familia de tipos de letra, pulsa el botón ⊕ que encontrarás al lado.</li>
+ <li>Cuando hayas elegido las familias de tipos de letra, pulsa la barra <em>[número] familias seleccionadas</em> que encontrarás en la parte inferior de la página.</li>
+ <li>En la pantalla resultante, primero debes copiar la línea de código HTML que se muestra y pegarla en el encabezado de tu archivo HTML. Ponlo encima del elemento {{HTMLElement("link")}}, de modo que el tipo de letra se importe correctamente antes de intentar utilizarlo en tu CSS.</li>
+ <li>Luego, debes copiar las declaraciones CSS enumeradas en tu CSS según corresponda para aplicar los tipos de letra personalizados a tu HTML.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar una versión completa en <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/google-font.html">google-font.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/css/styling-text/web-fonts/google-font.css">google-font.css</a>, si necesitas comparar tu trabajo con el nuestro (<a href="http://mdn.github.io/learning-area/css/styling-text/web-fonts/google-font.html">consúltalo en vivo</a>).</p>
+</div>
+
+<h2 id="font-face_con_más_detalle">@font-face con más detalle</h2>
+
+<p>Vamos a explorar que la sintaxis correspondiente a <code>@font-face</code> que te ha generado Fontsquirrel. Uno de los bloques se verá así:</p>
+
+<pre class="brush: css notranslate">@font-face {
+  font-family: 'ciclefina';
+  src: url('fonts/cicle_fina-webfont.eot');
+  src: url('fonts/cicle_fina-webfont.eot?#iefix') format('embedded-opentype'),
+         url('fonts/cicle_fina-webfont.woff2') format('woff2'),
+         url('fonts/cicle_fina-webfont.woff') format('woff'),
+         url('fonts/cicle_fina-webfont.ttf') format('truetype'),
+         url('fonts/cicle_fina-webfont.svg#ciclefina') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}</pre>
+
+<p>Esto se conoce como «sintaxis @font-face a prueba de balas» desde una publicación de Paul Irish, en los tiempos en que <code><code>@font-face</code></code> empezaba a popularizarse (<a href="http://www.paulirish.com/2009/bulletproof-font-face-implementation-syntax/">Bulletproof @font-face Syntax</a>). Vamos a ver qué hace:</p>
+
+<ul>
+ <li><code><code><code>font-family</code></code></code>: Esta línea especifica el nombre con el que vas a referirte a la fuente. Puedes poner el que quieras, siempre y cuando lo uses de manera coherente a lo largo de tu CSS.</li>
+ <li><code><code><code>src</code></code></code>: Estas líneas especifican las rutas de acceso a los archivos de tipos de letra para que puedas importarlos a tu CSS (la parte <code><code><code>URL</code></code></code>) y el formato de cada archivo de tipo de letra (la parte <code><code><code>format</code></code></code>). La última parte en cada caso es opcional, pero es útil declararla porque permite que los navegadores encuentren más rápido un tipo de letra que puedan usar. Se pueden enumerar varias declaraciones, separadas por comas: el navegador buscará por ellas y usará la primera que encuentre. Por lo tanto, es mejor poner formatos nuevos y mejores, como WOFF2 y formatos más antiguos, no tan buenos, como TTF. La única excepción son las fuentes EOT: se colocan primero para corregir un par de errores en versiones anteriores de Internet Explorer, por lo que intentará usar lo primero que encuentre, incluso si realmente no puede usar la fuente.</li>
+ <li>{{cssxref("font-weight")}}/{{cssxref("font-style")}}: Estas líneas especifican qué grueso tiene el tipo de letra y si se muestra en cursiva o no. Si vas a importar diversos grosores del mismo tipo de letra, puedes especificar cuál es su grueso/estilo y luego usar valores de {{cssxref("font-weight")}} / {{cssxref("font-style")}} diferentes para elegir entre ellos, en lugar de tener que llamar a todos los diferentes miembros de la familia de tipos de letra con nombres distintos. <a href="http://www.456bereastreet.com/archive/201012/font-face_tip_define_font-weight_and_font-style_to_keep_your_css_simple/">@tip-face tip: define font-weight and font-stile to keep your CSS simple</a> de Roger Johansson muestra qué hacer con más detalle.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: También puedes especificar los valores particulares {{cssxref ("font-variant")}} y {{cssxref ("font-stretch")}} para tus tipos de letra seguros para web. En los navegadores más nuevos también puedes especificar un valor {{cssxref ("unicode-range")}}, que es un rango de caracteres específicos que debes usar aparte del tipo de letra seguro para web en los navegadores que incluyan esta opción. Solo se descargaran los caracteres especificados y te ahorrarás descargas innecesarias. <a href="https://24ways.org/2011/creating-custom-font-stacks-with-unicode-range/">Creating Custom Font Stacks with Unicode-Range</a> de Drew McLellan proporciona algunas ideas útiles sobre cómo hacer uso de todo esto.</p>
+</div>
+
+<h2 id="Tipos_de_letra_variables">Tipos de letra variables</h2>
+
+<p>Los navegadores disponen hoy de una tecnología de tipos de letra reciente llamada tipos de letra variables: se trata de tipos de letra que permiten incorporar muchas variaciones diferentes de un tipo de letra en un solo archivo, en lugar de tener un archivo separado para cada ancho, grosor o estilo. Es demasiado avanzado para nuestro curso para principiantes, pero si te apetece avanzar y echarles un vistazo, lee nuestra <a href="/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide">guía de tipos de letra variables</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Ahora que has leído nuestros artículos sobre nociones de aplicación de estilo al texto, es hora de evaluar cuánto has retenido del módulo a partir de la creación de una composición tipográfica de una página de inicio de una escuela comunitaria.</p>
+
+<p>{{PreviousMenuNext("Learn/CSS/Styling_text/Styling_links", "Learn/CSS/Styling_text/Typesetting_a_homepage", "Learn/CSS/Styling_text")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/CSS/Styling_text/Fundamentals">Texto fundamental y estilo de fuente</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Styling_text/Styling_lists">Dar estilo a las listas</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Styling_text/Styling_links">Dar estilo a los enlaces</a></li>
+ <li><a href="/en-US/docs/Learn/CSS/Styling_text/Web_fonts">Las fuentes web</a></li>
+ <li><a href="/en-US/Learn/CSS/Styling_text/Typesetting_a_homepage">Composición tipográfica de una página de inicio de una escuela comunitaria</a></li>
+</ul>
diff --git a/files/es/learn/css/sábercomo/generated_content/index.html b/files/es/learn/css/sábercomo/generated_content/index.html
deleted file mode 100644
index 605e87f9e2..0000000000
--- a/files/es/learn/css/sábercomo/generated_content/index.html
+++ /dev/null
@@ -1,178 +0,0 @@
----
-title: Usando CSS para generar contenido
-slug: Learn/CSS/Sábercomo/Generated_content
-tags:
-  - CSS
-  - Fundamentos
-  - Guía
-  - Principiante
-  - Web
-  - graficos
-translation_of: Learn/CSS/Howto/Generated_content
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Color", "Color") }}Esta es la 9ª sección del tutorial CSS Getting Started; Describe algunas formas en las que puede utilizar CSS para agregar contenido cuando se muestra un documento. Modifica su hoja de estilo para agregar contenido de texto y una imagen.</p>
-
-<h2 class="clearLeft" id="Informacion_Contenido">Informacion: Contenido</h2>
-
-<p>Una de las ventajas importantes de CSS es que le ayuda a separar el estilo de un documento de su contenido. Sin embargo, hay situaciones en las que tiene sentido especificar cierto contenido como parte de la hoja de estilo, no como parte del documento.</p>
-
-<p>El contenido especificado en una hoja de estilo puede consistir en texto o imágenes. Especifica el contenido de su hoja de estilos cuando el contenido está estrechamente vinculado a la estructura del documento.</p>
-
-<div class="tuto_details">
-<div class="tuto_type">
-<p>Más detalles</p>
-
-<p>Especificar contenido en una hoja de estilo puede causar complicaciones. Por ejemplo, es posible que tenga versiones de idioma diferentes de su documento que comparten una hoja de estilo. Si parte de la hoja de estilo tiene que ser traducida, significa que debe colocar las partes de la hoja de estilos en archivos separados y organizar para que se vincule con las versiones de idioma adecuado de su documento.</p>
-
-<p>Estas complicaciones no surgen si el contenido especificado incluye símbolos o imágenes que se aplican en todos los idiomas y culturas.</p>
-
-<p>El contenido especificado en una hoja de estilo no se convierte en parte del DOM.</p>
-</div>
-</div>
-
-<h3 id="Text_content" name="Text_content">Texto contenido</h3>
-
-<p>CSS puede insertar contenido de texto antes o después de un elemento. Para especificar esto, haga una regla y agregue {{cssxref (':: before')}} o {{cssxref (':: after')}} al selector. En la declaración, especifique la propiedad {{cssxref ('content')}} con el contenido de texto como su valor.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<h4 id="HTML">HTML</h4>
-
-<pre class="brush: html">Un texto donde necesito &lt;span class="ref"&gt;alguna cosa&lt;/span&gt;
-</pre>
-
-<h4 id="CSS">CSS</h4>
-
-<pre class="brush: css">.ref::before {
-  font-weight: negrita;
-  color: navy;
-  content: "Reference: ";
-}</pre>
-
-<h4 id="Output">Output</h4>
-
-<p>{{ EmbedLiveSample('Text_content', 600, 30) }}</p>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type">Mas detalles</div>
-
-<p>El conjunto de caracteres de una hoja de estilo es UTF-8 de forma predeterminada, pero se puede especificar en el vínculo o en la hoja de estilos o en otras formas. Para obtener más información, consulte 4. 4 Representación de hoja de estilo CSS en la especificación CSS.</p>
-
-<p>Los caracteres individuales también se pueden especificar mediante un mecanismo de escape que utiliza la barra invertida como el carácter de escape. Por ejemplo, \ 265B es el símbolo del ajedrez para una reina negra ♛. Para obtener más información, consulte Referencia a caracteres no representados en una codificación de caracteres y también Caracteres y caso en la Especificación CSS.</p>
-</div>
-
-<h3 id="Imagen_contenido">Imagen contenido</h3>
-
-<p>Para agregar una imagen antes o después de un elemento, puede especificar la URL de un archivo de imagen en el valor de la propiedad {{cssxref ('content')}}.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p>Esta regla añade un espacio y un icono después de cada enlace que tiene el glosario de clases:</p>
-
-<pre class="brush:css">a.glossary:after {content: " " url("../images/glossary-icon.gif");}
-</pre>
-</div>
-
-<p>Para agregar una imagen como fondo de un elemento, especifique la URL de un archivo de imagen en el valor de la propiedad {{cssxref ('background')}}. Esta es una propiedad abreviada que especifica el color de fondo, la imagen, cómo se repite la imagen y algunos otros detalles.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p>Esta regla establece el fondo de un elemento específico, utilizando una URL para especificar un archivo de imagen.</p>
-
-<p>El selector especifica el id del elemento. El valor no-repeat hace que la imagen aparezca sólo una vez:</p>
-
-<pre class="brush:css">#sidebar-box {background: url("../images/sidebar-ground.png") no-repeat;}
-</pre>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type">Mas detalles</div>
-
-<p>Para obtener información sobre las propiedades individuales que afectan a los fondos y sobre otras opciones al especificar imágenes de fondo, consulte {{Cssxref ('fondo')}}, página de referencia.</p>
-</div>
-
-<h2 id="Acción_Añadir_una_imagen_de_fondo">Acción: Añadir una imagen de fondo</h2>
-
-<p>Esta imagen es un cuadrado blanco con una línea azul en la parte inferior:</p>
-
-<table style="border: 2px solid #cccccc;">
- <tbody>
-  <tr>
-   <td><img alt="Image:Blue-rule.png" class="internal" src="https://mdn.mozillademos.org/files/160/Blue-rule.png"></td>
-  </tr>
- </tbody>
-</table>
-
-<ol>
- <li>Descargue el archivo de imagen en el mismo directorio que su archivo CSS. (Por ejemplo, haga clic con el botón derecho del ratón para obtener un menú contextual y, a continuación, seleccione Guardar imagen como y especifique el directorio que está utilizando para este tutorial).</li>
- <li>Edit your CSS file and add this rule to the body, setting a background image for the entire page.</li>
- <li>
-  <pre class="brush:css">background: url("Blue-rule.png");
-</pre>
-
-  <p>La repetición de valor es la predeterminada, por lo que no es necesario especificarla. La imagen se repite horizontal y verticalmente, dando una apariencia como papel de escribir forrado:</p>
-
-  <div style="position: relative; width: 24em; height: 11em; border: 2px outset #36b; overflow: hidden;">
-  <p style="margin: 0px;"><img alt="Image:Blue-rule-ground.png" class="internal" src="https://mdn.mozillademos.org/files/161/Blue-rule-ground.png"></p>
-
-  <div style="position: absolute; top: 0px; left: 0px; border: none; margin: 0px; padding: .5em 0px 0px 1em; font: 16px 'Comic Sams MS', cursive; color: blue; background-color: transparent;">
-  <div style="font-style: italic; width: 24em;">
-  <p><strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>heets</p>
-  </div>
-
-  <div style="font-style: normal; padding-top: 2px; height: 8em;">
-  <p><strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>heets</p>
-  </div>
-  </div>
-  </div>
- </li>
-</ol>
-
-<div class="tuto_example">
-<div class="tuto_type">Reto</div>
-
-<p>Descarga esta imagen:</p>
-
-<table style="border: 2px solid #cccccc;">
- <tbody>
-  <tr>
-   <td><img alt="Image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Agrega una nueva regla a tu hoja de estilos, luego, agrega la imagen al inicio de cada linea:</p>
-
-<div style="position: relative; width: 24em; height: 11em; border: 2px outset #36b; overflow: hidden;">
-<p style="margin: 0px;"><img alt="Image:Blue-rule-ground.png" class="internal" src="https://mdn.mozillademos.org/files/161/Blue-rule-ground.png"></p>
-
-<div style="position: absolute; top: 0px; left: 0px; border: none; margin: 0px; padding: .5em 0px 0px 1em; font: 16px 'Comic Sams MS', cursive; color: blue; background-color: transparent;">
-<div style="font-style: italic; width: 24em; padding-top: 8px;"><img alt="image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"> <strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: green; font: 200% serif;">S</strong>heets</div>
-
-<div style="font-style: normal; padding-top: 12px; height: 8em;"><img alt="image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"> <strong style="background-color: #ddddff; color: red; font: 200% serif;">C</strong>ascading <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>tyle <strong style="background-color: #ddddff; color: red; font: 200% serif;">S</strong>heets</div>
-</div>
-</div>
-
-<div class="tuto_details" id="tutochallenge">
-<div class="tuto_type">Possible solution</div>
-
-<p>Add this rule to your stylesheet:</p>
-
-<pre class="brush: css">p:before{
-  content: url("yellow-pin.png");
-}
-</pre>
-
-<p> </p>
-<a class="hideAnswer" href="#challenge">Hide solution</a></div>
-<a href="#tutochallenge" title="Display a possible solution for the challenge">Ver la solución a este reto.</a></div>
-
-<h2 id="Qué_sigue">Qué sigue?</h2>
-
-<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Lists", "Lists") }}Una forma común en que las hojas de estilos agregan contenido es marcando los elementos en las listas. La siguiente sección describe cómo <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Lists" title="/en-US/docs/Web/Guide/CSS/Getting_Started/Lists">especificar estilos para una lista de elementos.</a></p>
diff --git a/files/es/learn/css/sábercomo/index.html b/files/es/learn/css/sábercomo/index.html
deleted file mode 100644
index ffff1653c0..0000000000
--- a/files/es/learn/css/sábercomo/index.html
+++ /dev/null
@@ -1,81 +0,0 @@
----
-title: Usa CSS para resolver problemas comunes
-slug: Learn/CSS/Sábercomo
-translation_of: Learn/CSS/Howto
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">Los siguientes enlaces apuntan a soluciones comunes a los problemas cotidianos que necesitará resolver con CSS.</p>
-
-<h2 id="Casos_de_uso_común">Casos de uso común</h2>
-
-<div class="column-container">
-<div class="column-half">
-<h3 id="Básicos">Básicos</h3>
-
-<ul>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_to_apply_your_CSS_to_your_HTML">Cómo aplicar CSS al HTML</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Syntax#White_space">How to use whitespace in CSS</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Syntax#Comments">Cómo escribir comentarios en CSS</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Simple_selectors">Cómo seleccionar elementos mediante nombre del elemento, clase o ID</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Attribute_selectors">Cómo seleccionar elementos mediante nombre del atributo y contenido</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Pseudo-classes">Cómo usar pseudo-clases</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Pseudo-elements">Cómo usar pseudo-elementos</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Selectors#Multiple_selectors_on_one_rule">Cómo aplicar múltiples selectores a la misma regla</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Values_and_units#Colors">Cómo especificar colores en CSS</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Debugging_CSS#Inspecting_the_DOM_and_CSS">Cómo depurar CSS en el navegador</a></li>
-</ul>
-
-<h3 id="CSS_y_texto">CSS y texto</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/CSS/Styling_text/Fundamentals">Cómo dar estilo al texto</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Styling_text/Styling_lists">Cómo personalizar una lista de elementos</a></li>
- <li><a href="/en-US/Learn/CSS/Styling_text/Styling_links">Cómo dar estilo a links</a></li>
- <li><a href="/en-US/Learn/CSS/Styling_text/Fundamentals#Text_drop_shadows">Cómo agregar sombras al texto</a></li>
-</ul>
-</div>
-
-<div class="column-half">
-<h3 id="Cajas_y_diseños">Cajas y diseños</h3>
-
-<ul>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Box_properties">Cómo redimensionar cajas CSS</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Overflow">Cómo controlar el contenido que desborda</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Background_clip">Cómo controlar la parte de una caja CSS en la que se dibuja el fondo</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Types_of_CSS_boxes">Cómo defino un elemento inline, block o inline-block?</a></li>
- <li><a href="/en-US/docs/Learn/CSS/Howto/create_fancy_boxes">How to create fancy boxes</a> (also see the <a href="/en-US/docs/Learn/CSS/Styling_boxes">Styling boxes</a> module, generally).</li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Box_model#Background_clip">How to use <code>background-clip</code> to control how much of the box your background image covers</a>.</li>
- <li><a href="/en-US/Learn/CSS/Styling_boxes/Box_model_recap#Changing_the_box_model_completely">How to change the box model completely using <code>box-sizing</code></a></li>
- <li><a href="/en-US/Learn/CSS/Styling_boxes/Backgrounds">How to control backgrounds</a></li>
- <li><a href="/en-US/Learn/CSS/Styling_boxes/Borders">How to control borders</a></li>
- <li><a href="/en-US/Learn/CSS/Styling_boxes/Styling_tables">How to style an HTML table</a></li>
- <li><a href="/en-US/Learn/CSS/Styling_boxes/Advanced_box_effects#Box_shadows">How to add shadows to boxes</a></li>
-</ul>
-</div>
-</div>
-
-<h2 id="Uncommon_or_advanced_techniques">Uncommon or advanced techniques</h2>
-
-<p>Beyond the basics, CSS is allows very advanced design techniques. These articles help you tackle the hardest use cases you may face.</p>
-
-<h3 id="General">General</h3>
-
-<ul>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Cascade_and_inheritance#Specificity">How to calculate specificity of a CSS selector</a></li>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/Cascade_and_inheritance#Controlling_inheritance">How to control inheritance in CSS</a></li>
-</ul>
-
-<h3 id="Advanced_effects">Advanced effects</h3>
-
-<ul>
- <li><a href="/en-US/Learn/CSS/Styling_boxes/Advanced_box_effects#Filters">How to use filters in CSS</a></li>
- <li><a href="/en-US/Learn/CSS/Styling_boxes/Advanced_box_effects#Blend_modes">How to use blend modes in CSS</a></li>
-</ul>
-
-<h3 id="Layout">Layout</h3>
-
-<ul>
- <li><a href="/en-US/docs/Web/Guide/CSS/Flexible_boxes">Using CSS flexible boxes</a></li>
- <li><a href="/en-US/docs/Web/Guide/CSS/Using_multi-column_layouts" title="/en-US/docs/Web/Guide/CSS/Using_multi-column_layouts">Using CSS multi-column layouts</a></li>
-</ul>
diff --git a/files/es/learn/desarrollo_web_front-end/index.html b/files/es/learn/desarrollo_web_front-end/index.html
deleted file mode 100644
index f58a9ad486..0000000000
--- a/files/es/learn/desarrollo_web_front-end/index.html
+++ /dev/null
@@ -1,201 +0,0 @@
----
-title: Desarrollo web Front-end
-slug: Learn/Desarrollo_web_Front-end
-tags:
-  - Aprender
-  - CSS
-  - De lado del cliente
-  - Estándar Web
-  - Estándares web
-  - Front-end
-  - HTML
-  - Herramientas
-  - JavaScript
-  - Novato
-  - Principiante
-translation_of: Learn/Front-end_web_developer
----
-<p>{{learnsidebar}}</p>
-
-<p>¡Bienvenido a la ruta de aprendizaje para desarrolladores de la interfaz de usuario web!</p>
-
-<p>Aquí se te proporciona un curso estructurado que te enseñará todo lo que necesitas saber para convertirte en un desarrollador de la interfaz de usuario web. Simplemente trabaja en cada sección, aprendiendo nuevas habilidades (o mejorando las existentes) sobre la marcha. Cada sección incluye desafíos y ejercicios para evaluar tu comprensión antes de seguir adelante.</p>
-
-<h2 id="Temas_tratados">Temas tratados</h2>
-
-<p>Los temas tratados son:</p>
-
-<ul>
- <li>Configuración básica y conocimientos sobre cómo aprender</li>
- <li>Estándares web y mejores prácticas (como accesibilidad y compatibilidad entre navegadores)</li>
- <li>HTML, el lenguaje que da estructura y significado al contenido web</li>
- <li>CSS, el lenguaje utilizado para aplicar estilo a las páginas web</li>
- <li>JavaScript, el lenguaje programado por medio de <em>scripts</em> utilizado para crear funciones dinámicas en la web.</li>
- <li>Herramientas que se utilizan para facilitar el desarrollo web moderno de lado del cliente.</li>
-</ul>
-
-<p>Puedes trabajar en las secciones en orden, pero cada una también es autónoma. Por ejemplo, si ya conoces HTML, puedes pasar a la sección CSS.</p>
-
-<h2 id="Prerrequisitos">Prerrequisitos</h2>
-
-<p>No necesitas conocimientos previos para empezar este curso. Todo lo que necesitas es una computadora que pueda ejecutar navegadores web modernos, una conexión a Internet y la voluntad de aprender.</p>
-
-<p>Si no estás seguro de si el desarrollo de la interfaz de usuario web es para ti, y/o deseas una breve introducción antes de comenzar un curso más largo y completo, consulta una {{web.link("/es/docs/Learn/Getting_started_with_the_web", "Introducción a la Web")}}.</p>
-
-<h2 id="Cómo_obtener_ayuda">Cómo obtener ayuda</h2>
-
-<p>Hemos tratado de hacer que el desarrollo de la interfaz de usuario web sea lo más cómodo posible, pero probablemente todavía quedes encallado porque no entiendes algo o porque algún código simplemente no funciona.</p>
-
-<p>No entres en pánico. Todos hemos encallado, sin importar que seamos desarrolladores web principiantes o profesionales. El artículo {{web.link("/es/docs/Learn/Learning_and_getting_help", "Aprender y obtener ayuda")}} te brinda una serie de consejos para buscar información y ayudarte a ti mismo. Si aún estás atascado, no dudes en publicar una pregunta en nuestro <a href="https://discourse.mozilla.org/c/mdn/learn/">Foro de discusión</a>.</p>
-
-<p>Empecemos. ¡Diviértete!</p>
-
-<h2 id="El_camino_del_aprendizaje">El camino del aprendizaje</h2>
-
-<h3 id="Primeros_pasos">Primeros pasos</h3>
-
-<p>Tiempo para completar: 1.5 a 2 horas</p>
-
-<h4 id="Prerrequisitos_2">Prerrequisitos</h4>
-
-<p>Nada excepto conocimientos básicos de informática.</p>
-
-<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante">¿Cómo sabré que estoy listo para seguir adelante?</h4>
-
-<p>No hay evaluaciones en esta parte del curso. Pero asegúrate de no saltarla. Es importante prepararte para trabajar en la resolución de los ejercicios más adelante en el curso.</p>
-
-<h4 id="Guías">Guías</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/Getting_started_with_the_web/Installing_basic_software", "Instalación de software básico")}}: configuración básica de las herramientas (lectura de 15 minutos)</li>
- <li>{{web.link("/es/docs/Learn/Getting_started_with_the_web/The_web_and_web_standards", "Información básica sobre la web y los estándares web")}} (lectura de 45 minutos)</li>
- <li>{{web.link("/es/docs/Learn/Learning_and_getting_help", "Aprender y obtener ayuda")}} (lectura de 45 minutos)</li>
-</ul>
-
-<h3 id="Semántica_y_estructura_con_HTML">Semántica y estructura con HTML</h3>
-
-<p>Tiempo para completar: 35 a 50 horas</p>
-
-<h4 id="Prerrequisitos_3">Prerrequisitos</h4>
-
-<p>Nada, excepto: conocimientos básicos de informática y un entorno de desarrollo web básico.</p>
-
-<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_2">¿Cómo sabré que estoy listo para seguir adelante?</h4>
-
-<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
-
-<h4 id="Módulos">Módulos</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML", "Introducción a HTML")}} (15 a 20 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/HTML/Multimedia_and_embedding", "Multimedia e inserción")}} (15 a 20 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/HTML/Tables", "tablas HTML")}} (5 a 10 horas de lectura/ejercicios)</li>
-</ul>
-
-<h3 id="Estilo_y_diseño_con_CSS">Estilo y diseño con CSS</h3>
-
-<p>Tiempo para completar: 90 a 120 horas</p>
-
-<h4 id="Prerrequisitos_4">Prerrequisitos</h4>
-
-<p>Es recomendable que tengas conocimientos básicos de HTML antes de comenzar a aprender CSS. Primero deberías estudiar {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML", "Introducción a HTML")}} por lo menos.</p>
-
-<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_3">¿Cómo sabré que estoy listo para seguir adelante?</h4>
-
-<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
-
-<h4 id="Módulos_2">Módulos</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/CSS/First_steps", "Primeros pasos de CSS" )}} (10 a 15 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/CSS/Building_blocks", "Bloques de construcción de CSS")}} (35 a 45 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/CSS/Styling_text", "Diseño de texto")}} (15 a 20 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/CSS/CSS_layout", "Diseño CSS")}} (30 a 40 horas de lectura/ejercicios)</li>
-</ul>
-
-<h4 id="Recursos_adicionales">Recursos adicionales</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Web/CSS/Layout_cookbook", "Libro de recetas de diseño CSS")}}</li>
-</ul>
-
-<h3 id="Interactividad_con_JavaScript">Interactividad con JavaScript</h3>
-
-<p>Tiempo para completar: 135 a 185 horas</p>
-
-<h4 id="Prerrequisitos_5">Prerrequisitos</h4>
-
-<p>Es recomendable que tengas conocimientos básicos de HTML antes de comenzar a aprender JavaScript. Primero deberías estudiar {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML", "Introducción a HTML")}} por lo menos.</p>
-
-<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_4">¿Cómo sabré que estoy listo para seguir adelante?</h4>
-
-<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
-
-<h4 id="Módulos_3">Módulos</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/JavaScript/First_steps", "Primeros pasos en JavaScript")}} (30 a 40 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/JavaScript/Building_blocks", "Bloques de construcción de JavaScript")}} (25 a 35 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/JavaScript/Objects", "Introducción a los objetos JavaScript")}} (25 a 35 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/JavaScript/Client-side_web_APIs", "API web del lado del cliente")}} (30 a 40 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/JavaScript/Asynchronous", "JavaScript asincrónico")}} (25 a 35 horas de lectura/ejercicios)</li>
-</ul>
-
-<h3 id="Formularios_web_—_Trabajar_con_datos_del_usuario">Formularios web — Trabajar con datos del usuario</h3>
-
-<p>Tiempo para completar: 40 a 50 horas</p>
-
-<h4 id="Prerrequisitos_6">Prerrequisitos</h4>
-
-<p>Los formularios requieren conocimientos de HTML, CSS y JavaScript. Dada la complejidad de trabajar con formularios, es un tema dedicado.</p>
-
-<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_5">¿Cómo sabré que estoy listo para seguir adelante?</h4>
-
-<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
-
-<h4 id="Módulos_4">Módulos</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/Forms", "Formularios web")}} (40 a 50 horas)</li>
-</ul>
-
-<h3 id="Hacer_que_la_web_funcione_para_todos">Hacer que la web funcione para todos</h3>
-
-<p>Tiempo para completar: 60 a 75 horas</p>
-
-<h4 id="Prerrequisitos_7">Prerrequisitos</h4>
-
-<p>Es una buena idea conocer HTML, CSS y JavaScript antes de trabajar en esta sección. Muchas de las técnicas y mejores prácticas se refieren a múltiples tecnologías.</p>
-
-<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_6">¿Cómo sabré que estoy listo para seguir adelante?</h4>
-
-<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
-
-<h4 id="Módulos_5">Módulos</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/Tools_and_testing/Cross_browser_testing", "Pruebas en varios navegadores")}} (25 a 30 horas de lectura/ejercicios)</li>
- <li>{{web.link("/es/docs/Learn/Accessibility", "Accesibilidad")}} (20 a 25 horas de lectura/ejercicios)</li>
-</ul>
-
-<h3 id="Herramientas_modernas">Herramientas modernas</h3>
-
-<p>Tiempo para completar: 55 a 90 horas</p>
-
-<h4 id="Prerrequisitos_8">Prerrequisitos</h4>
-
-<p>Es una buena idea conocer HTML, CSS y JavaScript antes de trabajar en esta sección, ya que las herramientas analizadas funcionan junto con muchas de estas tecnologías.</p>
-
-<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_7">¿Cómo sabré que estoy listo para seguir adelante?</h4>
-
-<p>No hay artículos de evaluación específicos en este conjunto de módulos. Los tutoriales de casos de estudio al final del segundo y tercer módulo te preparan para comprender los conceptos básicos de las herramientas modernas.</p>
-
-<h4 id="Módulos_6">Módulos</h4>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/Tools_and_testing/GitHub", "Git y GitHub")}} (lectura de 5 horas)</li>
- <li>{{web.link("/es/docs/Learn/Tools_and_testing/Understanding_client-side_tools", "Comprender las herramientas de desarrollo web del lado del cliente")}} (lectura de 20 a 25 horas)</li>
- <li>
-  <p>{{web.link("/es/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks", "Comprender los marcos de JavaScript de lado del cliente")}} (30 a 60 horas de lectura/ejercicios)</p>
- </li>
-</ul>
diff --git a/files/es/learn/forms/basic_native_form_controls/index.html b/files/es/learn/forms/basic_native_form_controls/index.html
new file mode 100644
index 0000000000..74b5b08e46
--- /dev/null
+++ b/files/es/learn/forms/basic_native_form_controls/index.html
@@ -0,0 +1,327 @@
+---
+title: Controles de formulario originales
+slug: Learn/Forms/Basic_native_form_controls
+translation_of: Learn/Forms/Basic_native_form_controls
+original_slug: Learn/HTML/Forms/The_native_form_widgets
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Forms/How_to_structure_an_HTML_form", "Learn/Forms/HTML5_input_types", "Learn/Forms")}}</div>
+
+<p class="summary">En el <a href="/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">artículo anterior</a>, marcamos un ejemplo de formulario web funcional, presentamos algunos controles de formulario y elementos estructurales comunes, y nos centramos en las mejores prácticas de accesibilidad. A continuación, veremos con detalle las funciones de los diferentes controles de formulario, o <em>widgets</em>, y estudiaremos todas las diferentes opciones de que se dispone para la recopilación de diferentes tipos de datos. En este artículo en particular, veremos el conjunto original de controles de formulario, disponible en todos los navegadores desde los primeros días de la web.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática y de <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">lenguaje HTML</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender en detalle el conjunto original de controles de formulario originales disponibles en los navegadores para la recopilación de datos y su implementación con HTML.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Ya conoces algunos elementos de formulario, incluidos {{HTMLelement ('form')}}, {{HTMLelement ('fieldset')}}, {{HTMLelement ('legend')}}, {{HTMLelement ('textarea' )}}, {{HTMLelement ('label')}}, {{HTMLelement ('button')}} y {{HTMLelement ('input')}}. Este artículo expone:</p>
+
+<ul>
+ <li>Los tipos de entrada comunes {{HTMLelement('input/button', 'button')}}, {{HTMLelement('input/checkbox', 'checkbox')}}, {{HTMLelement('input/file', 'file')}}, {{HTMLelement('input/hidden', 'hidden')}}, {{HTMLelement('input/image', 'image')}}, {{HTMLelement('input/password', 'password')}}, {{HTMLelement('input/radio', 'radio')}}, {{HTMLelement('input/reset', 'reset')}}, {{HTMLelement('input/submit', 'submit')}} y {{HTMLelement('input/text', 'text')}}.</li>
+ <li>Algunos de los atributos que comunes para todos los controles de formulario.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Las características que se consideran en este artículo son compatibles con todos los navegadores, lo que no es el caso para todos los controles de formulario. En los próximos dos artículos vamos a exponer los controles de formulario que se han añadido a HTML5 más recientemente. Si quieres una referencia más avanzada, consulta nuestra <a href="/es/docs/Web/HTML/Elemento#Formularios">referencia a elementos de formulario HTML</a>, y en particular nuestra extensa referencia a <a href="/es/docs/Web/HTML/Elemento/input">tipos &lt;input&gt;</a>.</p>
+</div>
+
+<h2 id="Campos_de_entrada_de_texto">Campos de entrada de texto</h2>
+
+<p>Los campos de texto {{htmlelement ("input")}} son los controles de formulario más básicos. Son un modo muy cómodo de permitir al usuario introducir cualquier tipo de datos, y ya hemos visto algunos ejemplos sencillos.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Los campos de texto de los formularios HTML son controles de entrada de texto sencillos sin formato. Esto significa que no puedes usarlos para aplicar una <a href="/en-US/docs/Rich-Text_Editing_in_Mozilla" title="/en-US/docs/Rich-Text_Editing_in_Mozilla">edición enriquecida </a> (negrita, cursiva, etc.). Todos los controles de formulario que encuentres con texto enriquecido son controles de formulario personalizados creados con HTML, CSS y JavaScript.</p>
+</div>
+
+<p>Todos los controles de texto básicos comparten algunos comportamientos comunes:</p>
+
+<ul>
+ <li>Se pueden marcar como {{htmlattrxref ("readonly","input")}} (el usuario no puede modificar el valor de entrada, pero este se envía con el resto de los datos del formulario) o {{htmlattrxref ("disabled","input")}} (el valor de entrada no se puede modificar y nunca se envía con el resto de los datos del formulario).</li>
+ <li>Pueden tener un {{htmlattrxref ("placeholder","input")}}; se trata de un texto que aparece dentro de la caja de entrada de texto y que se usa para describir brevemente el propósito de la caja de texto.</li>
+ <li>Pueden presentar una limitación de <a href="/en-US/docs/Web/HTML/Attributes/size">tamaño</a> (el tamaño físico de la caja de texto) y de la <a href="/en-US/docs/Web/HTML/Attributes/maxlength" title="/en-US/docs/HTML/Element/input#attr-maxlength">extensión máxima</a> (el número máximo de caracteres que se pueden poner en la caja de texto).</li>
+ <li>Admiten <a href="/en-US/docs/HTML/Element/input#attr-spellcheck" title="/en-US/docs/HTML/Element/input#attr-spellcheck"> corrección ortográfica</a> (utilizando el atributo <a href="/en-US/docs/Web/HTML/Attributes/spellcheck"><code>spellcheck</code></a>), si el navegador la admite.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: El elemento {{htmlelement ("input")}} es único entre los elementos HTML porque puede tomar muchas formas diferentes según el valor de su atributo. Se utiliza para crear la mayoría de los tipos de controles de formulario, que incluyen campos de texto de una sola línea, controles para la fecha y la hora, controles sin introducción de texto, como casillas de verificación, botones de opción y selectores de color, y botones.</p>
+</div>
+
+<h3 id="Campos_de_texto_de_una_sola_línea">Campos de texto de una sola línea</h3>
+
+<p>Un campo de texto de una sola línea se crea utilizando un elemento {{HTMLElement ("input")}} cuyo valor de atributo {{htmlattrxref ("type","input")}} se establece en <code>text</code>, u omitiendo por completo el atributo {{htmlattrxref ( "type","input")}} (<code>text</code> es el valor predeterminado). El valor <code>text</code> de este atributo también es el valor alternativo si el navegador no reconoce el valor que has especificado para el atributo {{htmlattrxref ("type","input")}} (por ejemplo, si especificas <code>type="color"</code> y el navegador no está dotado en origen de un control de selección de colores).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar ejemplos de todos los tipos de campo de texto de una sola línea en GitHub en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/native-form-widgets/single-line-text-fields.html">single-line-text-fields.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/native-form-widgets/single-line-text-fields.html">o consultarlo en vivo</a>).</p>
+</div>
+
+<p>Aquí hay un ejemplo básico de campo de texto de una sola línea:</p>
+
+<pre class="brush: html notranslate">&lt;input type="text" id="comment" name="comment" value="I'm a text field"&gt;</pre>
+
+<p>Los campos de texto de una sola línea solo tienen una restricción verdadera: si escribes el texto con saltos de línea, el navegador elimina esos saltos de línea antes de enviar los datos al servidor.</p>
+
+<p><em>La captura de pantalla siguiente muestra los tipos de entrada de texto predeterminado, activo (con el foco) y deshabilitado en Firefox 71 y Safari en macOS y en Chrome 79 y Edge 18 en Windows 10.</em></p>
+
+<p><img alt="Captura de pantalla del atributo deshabilitado y predeterminado: estilo para  una entrada de texto activa (con el foco) en Firefox, Safari, Chrome y Edge." src="https://mdn.mozillademos.org/files/17021/disabled.png" style="height: 113px; width: 442px;"></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: HTML5 ha mejorado el campo de texto básico original de una sola línea al añadir valores especiales para el atributo {{htmlattrxref ("type", "input")}} que imponen restricciones de validación específicas y otras características, por ejemplo, específicas para introducir direcciones URL o números. Los expondremos en el artículo siguiente: <a href="/en-US/docs/Learn/Forms/HTML5_input_types">Los tipos de entrada en HTML5</a>.</p>
+</div>
+
+<h4 id="Campo_de_contraseña">Campo de contraseña</h4>
+
+<p>Uno de los tipos de entrada originales era el tipo de campo de texto <code>password</code>:</p>
+
+<pre class="brush: html notranslate">&lt;input type="password" id="pwd" name="pwd"&gt;</pre>
+
+<p>El valor de la contraseña no añade restricciones especiales al texto que se introduce, pero oculta el valor que se introduce en el campo (por ejemplo, con puntos o asteriscos) para impedir que otros puedan leerlo.</p>
+
+<p>Ten en cuenta que esto es solo una función de interfaz de usuario; a menos que envíes tu formulario en modo seguro, se enviará como texto plano, lo que es malo desde el punto de vista de la seguridad porque alguien con malas intenciones podría interceptar tus datos y robar tus contraseñas, datos de tarjetas de crédito o cualquier otra cosa que hayas enviado. La mejor manera de proteger a los usuarios de esto es alojar cualquier página que contenga formularios en una ubicación de conexión segura (es decir, en una dirección <code>https://</code>), de modo que los datos se cifren antes de enviarse.</p>
+
+<p>Los navegadores reconocen las implicaciones de seguridad de enviar datos de formulario por una conexión insegura y disponen de mensajes de advertencia para disuadir a los usuarios de usar formularios no seguros. Para obtener más información sobre las implementaciones de Firefox al respecto, consulta el artículo <a href="/es/docs/Seguridad/ContraseñasInseguras">Contraseñas inseguras</a>.</p>
+
+<h3 id="Contenido_oculto">Contenido oculto</h3>
+
+<p>Otro control de texto original es el tipo de entrada <code>hidden</code>. Se usa para crear un control de formulario que es invisible para el usuario, pero que aun así se envía al servidor junto con el resto de los datos del formulario una vez se transmiten; por ejemplo, es posible que desees enviar una marca de tiempo al servidor que indique cuándo se realizó un pedido. Al estar oculto, el usuario no puede ver ni editar su valor intencionadamente, el control nunca recibirá el foco y un lector de pantalla tampoco lo detectará.</p>
+
+<pre class="brush: html notranslate">&lt;input type="hidden" id="timestamp" name="timestamp" value="1286705410"&gt;
+</pre>
+
+<p>Si creas un elemento así, es necesario establecer sus atributos <code>name</code> y <code>value</code>. Su valor puede establecerse dinámicamente a través de JavaScript. El tipo de entrada oculta no debe tener ninguna etiqueta asociada.</p>
+
+<p>Otros tipos de entrada de texto, como {{HTMLElement ("input / search", "search")}}, {{HTMLElement ("input / url", "url")}} y {{HTMLElement ("input / tel" , "tel")}}, se añadieron con HTML5. Se tratarán en el próximo artículo: Tipos de entrada HTML5.</p>
+
+<h2 id="Elementos_de_selección_casillas_de_verificación_y_botones_de_opción">Elementos de selección: casillas de verificación y botones de opción</h2>
+
+<p>Los elementos de selección (o <em>checkable items</em>, en inglés) son controles cuyo estado puede cambiar cuando se hace clic en ellos o en sus etiquetas asociadas. Hay dos tipos de elementos de selección: las casillas de verificación (o <em>check boxes</em>) y los botones de opción (o <em>radio buttons</em>). Ambos usan el atributo <code>checked</code> para indicar si el control de formulario está seleccionado por defecto o no.</p>
+
+<p>Vale la pena señalar que estos controles no se comportan exactamente como otros controles de formulario. Para la mayoría de los controles de formulario, cuando se envía el formulario, se envían todos los controles que tienen un atributo <a href="/en-US/docs/Web/HTML/Attributes/name"><code>name</code></a>, incluso si en ellos no se ha introducido ningún valor. En el caso de elementos de selección, sus valores se envían solo si están seleccionados. Si no están seleccionados, no se envía nada, ni siquiera su nombre. Si están seleccionados pero no tienen ningún valor asignado, el nombre se envía con el valor <em>on.</em></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar los ejemplos de esta sección en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/forms/native-form-widgets/checkable-items.html">checkable-items.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/native-form-widgets/checkable-items.html">o consultarlos en vivo</a>).</p>
+</div>
+
+<p>Para una usabilidad/accesibilidad óptima, te recomendamos delimitar cada lista de elementos que estén relacionados entre sí dentro de un elemento {{htmlelement ("fieldset")}} con un elemento {{htmlelement ("legend")}} que proporcione una descripción general de la lista. Cada par individual de elementos {{htmlelement ("label")}}/{{htmlelement ("input")}} ha de estar contenido en un elemento de lista propio (o similar). El elemento {{htmlelement ('label')}} asociado se coloca en general inmediatamente después del botón de opción o la casilla de verificación, con las instrucciones para el grupo de botones de opción o casillas de verificación, que suelen ser el contenido del elemento {{htmlelement ("legend")}}. Observa las estructuras de ejemplo en los ejemplos asociados anteriores.</p>
+
+<h3 id="Casillas_de_verificación">Casillas de verificación</h3>
+
+<p>Las casillas de verificación se crean estableciendo el atributo <a href="/en-US/docs/Web/HTML/Attributes/type"><code>type</code></a> del elemento {{HTMLElement ("input")}} en el valor {{HTMLElement ("input / checkbox", "checkbox")}}.</p>
+
+<pre class="brush: html notranslate">&lt;input type="checkbox" id="carrots" name="carrots" value="carrots" checked&gt;
+</pre>
+
+<p>Al incluir el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/checked">checked</a></code>, la casilla de verificación se marca automáticamente cuando se carga la página. Al hacer clic en la casilla de verificación o en su etiqueta asociada, la casilla de verificación se activa o desactiva.</p>
+
+<p>Las capturas de pantalla siguientes muestran casillas de verificación predeterminadas, activas (con el foco) y deshabilitadas en Firefox 71 y Safari 13 en macOS y Chrome 79 y Edge 18 en Windows 10:</p>
+
+<p><img alt="Casillas de verificación predeterminadas, activas y deshabilitadas en Firefox 71 y Safari 13 en Mac y Chrome 79 y Edge 18 en Windows 10" src="https://mdn.mozillademos.org/files/17024/checkboxes.png" style="height: 203px; width: 293px;"></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Las casillas de verificación y los botones de opción con atributo <code><a href="/en-US/docs/Web/HTML/Attributes/checked">checked</a></code> al cargarse coinciden con la pseudoclase {{cssxref ('<code>:default</code>')}}, incluso aunque ya no estén seleccionadas. Las que están seleccionadas coinciden con la pseudoclase <code>{{cssxref(':checked')}}</code>.</p>
+</div>
+
+<p id="Radio_button">Debido a su naturaleza activa-inactiva, las casillas de verificación se consideran botones de conmutación, y muchos desarrolladores y diseñadores han ampliado el estilo de casilla de verificación predeterminado para crear botones que parecen interruptores de conmutación. Aquí puedes ver un <a href="https://mdn.github.io/learning-area/html/forms/toggle-switch-example/">ejemplo en acción</a> (observa también el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/toggle-switch-example/index.html">código fuente</a>).</p>
+
+<h3 id="Botón_de_opción">Botón de opción</h3>
+
+<p>Un botón de opción se crea estableciendo el atributo {{htmlattrxref ("type", "input")}} del elemento {{HTMLElement ("input")}} en el valor <code>radio</code>:</p>
+
+<pre class="brush: html notranslate">&lt;input type="radio" id="soup" name="meal" checked&gt;</pre>
+
+<p>Es posible asociar diversos botones de opción. Si comparten el mismo valor de atributo {{htmlattrxref ("name", "input")}}, se considera que están en el mismo grupo de botones. Solo un botón dentro de un grupo puede estar activado en cada momento. Esto significa que cuando uno de ellos se selecciona, todos los demás se deseleccionan automáticamente. Al enviar el formulario, solo se envía el valor del botón de opción seleccionado. Si ninguno de ellos está seleccionado, se considera que el conjunto completo de botones de opción está en un estado desconocido y no se envía ningún valor con el formulario. Cuando en un grupo de botones con el mismo nombre se selecciona uno de los botones de opción, no es posible deseleccionar todos los botones sin reiniciar el formulario.</p>
+
+<pre class="brush: html notranslate">&lt;fieldset&gt;
+  &lt;legend&gt;¿Cuál es tu comida favorita?&lt;/legend&gt;
+  &lt;ul&gt;
+    &lt;li&gt;
+      &lt;label for="soup"&gt;Sopa&lt;/label&gt;
+      &lt;input type="radio" id="soup" name="meal" value="soup" checked&gt;
+    &lt;/li&gt;
+    &lt;li&gt;
+      &lt;label for="curry"&gt;Curry&lt;/label&gt;
+      &lt;input type="radio" id="curry" name="meal" value="curry"&gt;
+    &lt;/li&gt;
+    &lt;li&gt;
+      &lt;label for="pizza"&gt;Pizza&lt;/label&gt;
+      &lt;input type="radio" id="pizza" name="meal" value="pizza"&gt;
+    &lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/fieldset&gt;</pre>
+
+<p>Las capturas de pantalla siguientes muestran botones de opción sin seleccionar y seleccionados, algunos con el foco y otros desactivados sin seleccionar y seleccionados, en Firefox 71 y Safari 13 en MacOS y Chrome 79 y Edge 18 en Windows 10.</p>
+
+<p><img alt="Botones de opción en Firefox 71 y Safari 13 en Mac y Chrome 79 y Edge 18 en Windows 10" src="https://mdn.mozillademos.org/files/17022/radios.png" style="height: 142px; width: 196px;"></p>
+
+<h2 id="Botones">Botones</h2>
+
+<p>El botón de opción no es realmente un botón, a pesar de su nombre; sigamos adelante y echemos un vistazo a los controles de formulario que son botones propiamente. Hay tres tipos de entrada según el tipo de botones que se utilicen:</p>
+
+<dl>
+ <dt><code>submit</code></dt>
+ <dd>Envía los datos del formulario al servidor. Para los elementos {{HTMLElement ("button")}}, omitir el atributo <code>type</code> (o introducir un valor de tipo no válido) da como resultado un botón de envío (<em>submit</em>).</dd>
+ <dt><code>reset</code></dt>
+ <dd>Restablece todos los controles de formulario a sus valores por defecto.</dd>
+ <dt><code>button</code></dt>
+ <dd>Botones que no tienen efecto automático, pero que se pueden personalizar con código JavaScript.</dd>
+</dl>
+
+<p>Además, el elemento {{htmlelement ("button")}} puede tomar un atributo <code>type</code> para imitar estos tres tipos de entrada. La diferencia principal entre los dos es que los elementos <code>&lt;button&gt;</code> propiamente admiten aplicación de estilo en mayor medida.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: El tipo de entrada <code>image</code> también se representa como un botón. También desarrollaremos este tema más adelante.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar los ejemplos de esta sección en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/forms/native-form-widgets/button-examples.html">button-examples.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/native-form-widgets/button-examples.html">o consultarlos en vivo</a>).</p>
+</div>
+
+<p>A continuación puedes encontrar ejemplos de cada tipo de botón <code>&lt;input&gt;</code>, junto con el tipo de botón equivalente.</p>
+
+<h3 id="enviar">enviar</h3>
+
+<pre class="brush: html notranslate">&lt;button type="submit"&gt;
+    Este es un &lt;strong&gt;botón de envío&lt;/strong&gt;
+&lt;/button&gt;
+
+&lt;input type="submit" value="Este es un botón de envío"&gt;</pre>
+
+<h3 id="reiniciar">reiniciar</h3>
+
+<pre class="brush: html notranslate">&lt;button type="reset"&gt;
+    Este es un &lt;strong&gt;botón de reinicio&lt;/strong&gt;
+&lt;/button&gt;
+
+&lt;input type="reset" value="Este es un botón de reinicio"&gt;</pre>
+
+<h3 id="anónimo">anónimo</h3>
+
+<pre class="brush: html notranslate">&lt;button type="button"&gt;
+    Este es un &lt;strong&gt;botón anónimo&lt;/strong&gt;
+&lt;/button&gt;
+
+&lt;input type="button" value="Este es un botón anónimo"&gt;</pre>
+
+<p>Los botones siempre se comportan igual, independientemente de su usas un elemento {{HTMLElement ("button")}} o un elemento {{HTMLElement ("input")}}. Sin embargo, como puedes ver en los ejemplos, los elementos {{HTMLElement ("button")}} te permiten usar HTML en tu contenido, que se inserta entre las etiquetas <code>&lt;button&gt;</code> de apertura y cierre. Los elementos {{HTMLElement ("input")}}, por otro lado, son elementos vacíos; el contenido que muestran está inserto en el atributo <code>value</code> y, por lo tanto, solo acepta contenido de texto sin formato.</p>
+
+<p>Los ejemplos siguientes muestran los tipos de entrada de botones predeterminados, activos y deshabilitados: en Firefox 71 y Safari 13 en macOS, y Chrome 79 y Edge 18 en Windows 10.</p>
+
+<p><img alt="Tipos de entrada de botones predeterminados, activos y deshabilitados en Firefox 71 y Safari 13 en Mac y Chrome 79 y Edge 18 en Windows 10" src="https://mdn.mozillademos.org/files/17023/buttons.png" style="height: 182px; width: 286px;"></p>
+
+<h3 id="Botón_de_imagen">Botón de imagen</h3>
+
+<p>El control <strong>botón de imagen</strong> se muestra exactamente como un elemento {{HTMLElement ("img")}}, excepto que cuando el usuario hace clic en él, se comporta como un botón de envío.</p>
+
+<p>Se crea un botón de imagen usando un elemento {{HTMLElement ("input")}} con su atributo {{htmlattrxref ("type","input")}} establecido en el valor <code>image</code>. Este elemento admite exactamente el mismo conjunto de atributos que el elemento {{HTMLElement ("img")}}, además de todos los atributos que admiten el resto de botones de formulario.</p>
+
+<pre class="brush: html notranslate">&lt;input type="image" alt="¡Púlsame!" src="my-img.png" width="80" height="30"&gt;</pre>
+
+<p>Si el botón de imagen se usa para enviar un formulario, este control no envía su valor; en lugar de ello se envían las coordenadas X e Y del clic que se ha hecho sobre la imagen (las coordenadas son relativas a la imagen, lo que significa que la esquina superior izquierda de la imagen representa la coordenada (0, 0)). Las coordenadas se envían como dos pares clave/valor:</p>
+
+<ul>
+ <li>La clave del valor X es el valor del atributo {{htmlattrxref ("name","input")}} seguido de la cadena de caracteres «<em>.x</em>».</li>
+ <li>La clave del valor Y es el valor del atributo {{htmlattrxref ("name","input")}} seguido de la cadena de caracteres «<em>.y</em>».</li>
+</ul>
+
+<p>Por ejemplo, cuando haces clic en las coordenadas (123, 456) de la imagen y se hace el envío por el método <code>get</code>, verás los valores añadidos a la URL de la manera siguiente:</p>
+
+<pre class="notranslate">http://foo.com?pos.x=123&amp;pos.y=456</pre>
+
+<p>Esta es una forma muy cómoda de construir un «mapa dinámico». La forma en que se envían y recuperan estos valores se detalla en el artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos del formulario</a>.</p>
+
+<h2 id="Selector_de_archivos">Selector de archivos</h2>
+
+<p>Hay un último tipo de <code>&lt;input&gt;</code> que nos llegó a principios del HTML: el tipo entrada de archivo. Los formularios pueden enviar archivos a un servidor (esta acción específica también se detalla en el artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos del formulario</a>). El control de selección de archivos se puede usar para elegir uno o más archivos para enviar.</p>
+
+<p>Para crear un <a href="/en-US/docs/Web/HTML/Element/input/file">control de selección de archivos</a>, utilizas el elemento {{HTMLElement ("input")}} con su atributo {{htmlattrxref ("type","input")}} establecido en <code>file</code>. Es posible restringir los tipos de archivos que se aceptan utilizando el atributo {{htmlattrxref ("accept","input")}}. Además, puedes permitir que el usuario elija más de un archivo añadiendo el atributo {{htmlattrxref ("multiple","input")}}.</p>
+
+<h4 id="Ejemplo">Ejemplo</h4>
+
+<p>En este ejemplo, se crea un control de selección de archivos que solicita archivos de imágenes gráficas. El usuario puede seleccionar múltiples archivos en este caso.</p>
+
+<pre class="brush: html notranslate">&lt;input type="file" name="file" id="file" accept="image/*" multiple&gt;</pre>
+
+<p>En algunos dispositivos móviles, el control de selección de archivos puede acceder a fotos, vídeos y audio capturados directamente por la cámara y el micrófono del dispositivo y añadir información de captura al atributo <code>accept</code> de la manera siguiente:</p>
+
+<pre class="notranslate">&lt;input type="file" accept="image/*;capture=camera"&gt;
+&lt;input type="file" accept="video/*;capture=camcorder"&gt;
+&lt;input type="file" accept="audio/*;capture=microphone"&gt;</pre>
+
+<h2 id="Atributos_comunes">Atributos comunes</h2>
+
+<p>Muchos de los elementos que se utilizan para definir controles de formulario tienen sus atributos específicos propios. Sin embargo, hay un conjunto de atributos que son comunes para todos los elementos de formulario. Ya has conocido algunos, pero a continuación encontrarás una lista de esos atributos comunes para referencias futuras:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Nombre del atributo</th>
+   <th scope="col">Valor por defecto</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code><a href="/en-US/docs/Web/HTML/Attributes/autofocus">autofocus</a></code></td>
+   <td>false</td>
+   <td>Este atributo booleano te permite especificar que el elemento ha de tener el foco de entrada automáticamente cuando se carga la página. En un documento, solo un elemento asociado a un formulario puede tener este atributo especificado.</td>
+  </tr>
+  <tr>
+   <td><code><a href="/en-US/docs/Web/HTML/Attributes/disabled">disabled</a></code></td>
+   <td>false</td>
+   <td>Este atributo booleano indica que el usuario no puede interactuar con el elemento. Si no se especifica este atributo, el elemento hereda su configuración del elemento que lo contiene, por ejemplo, {{HTMLElement ("fieldset")}}. Si el elemento que lo contiene no tiene el atributo establecido en <code>disabled</code>, el elemento está habilitado.</td>
+  </tr>
+  <tr>
+   <td><code><a href="/en-US/docs/Web/HTML/Attributes/form">form</a></code></td>
+   <td></td>
+   <td>El elemento <code>&lt;form&gt;</code> con el que está asociado el control, que se usa cuando no está anidado dentro de ese formulario. El valor del atributo debe ser el atributo <code>id</code> de un elemento {{HTMLElement ("form")}} del mismo documento. Esto te permite asociar un formulario con un control de formulario que esté fuera de aquel, incluso si está dentro de un elemento de formulario diferente.</td>
+  </tr>
+  <tr>
+   <td><code><a href="/en-US/docs/Web/HTML/Attributes/name">name</a></code></td>
+   <td></td>
+   <td>El nombre del elemento; se envía con los datos del formulario.</td>
+  </tr>
+  <tr>
+   <td><code><a href="/en-US/docs/Web/HTML/Attributes/value">value</a></code></td>
+   <td></td>
+   <td>El valor inicial del elemento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>Este artículo ha expuesto los tipos de entrada más antiguos: el conjunto original que se introdujo en los primeros días de HTML, que es compatible con todos los navegadores. En el artículo siguiente veremos los valores del atributo <code>type</code> que se han añadido en HTML5 más recientemente.</p>
+
+<p>{{PreviousMenuNext("Learn/Forms/How_to_structure_an_HTML_form", "Learn/Forms/HTML5_input_types", "Learn/Forms")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Tu primer formulario HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">Los controles básicos de formulario originales</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/HTML5_input_types">Tipos de entrada HTML5</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Additional_form_controls">Controles de formulario adicionales</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/UI_pseudo-classes">Pseudoclases UI</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Aplicar estilo a formularios HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Validación de datos en un formulario</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
+</ul>
+
+<h3 id="Temas_avanzados">Temas avanzados</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Enviar formularios con JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">Cómo crear widgets de formularios personalizados</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">Formularios HTML en navegadores antiguos</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Cuestiones avanzadas de aplicación de estilo para formularios HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de los controles de formulario</a></li>
+</ul>
diff --git a/files/es/learn/forms/form_validation/index.html b/files/es/learn/forms/form_validation/index.html
new file mode 100644
index 0000000000..c5a4d4f0dc
--- /dev/null
+++ b/files/es/learn/forms/form_validation/index.html
@@ -0,0 +1,846 @@
+---
+title: Validación de formularios de datos
+slug: Learn/Forms/Form_validation
+tags:
+  - Ejemplo
+  - Guía
+  - HTML
+  - Intermedio
+  - JavaScript
+  - Web
+  - formulários
+translation_of: Learn/Forms/Form_validation
+original_slug: Learn/HTML/Forms/Validacion_formulario_datos
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Forms/UI_pseudo-classes", "Learn/Forms/Sending_and_retrieving_form_data", "Learn/HTML/Forms")}}</div>
+
+<p>Antes de enviar datos al servidor, es importante asegurarse de que se completan todos los controles de formulario requeridos, y en el formato correcto. Esto se denomina <strong>validación de formulario en el lado del cliente</strong> y ayuda a garantizar que los datos que se envían coinciden con los requisitos establecidos en los diversos controles de formulario. Este artículo te guiará por los conceptos básicos y ejemplos de validación de formularios en el lado del cliente.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, y entender cómo funcionan el <a href="/es/docs/Learn/HTML">HTML</a>, el <a href="/es/docs/Learn/CSS">CSS</a> y el <a href="/es/docs/Learn/JavaScript">JavaScript</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Entender qué es la validación de formularios en el lado del cliente, porqué es importante y cómo aplicar diversas técnicas para implementarla.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>La validación en el lado del cliente es una verificación inicial y una característica importante para garantizar una buena experiencia de usuario; mediante la detección de datos no válidos en el lado del cliente, el usuario puede corregirlos de inmediato. Si el servidor lo recibe y, a continuación, lo rechaza; se produce un retraso considerable en la comunicación entre el servidor y el cliente que insta al usuario a corregir sus datos.</p>
+
+<p>Sin embargo, ¡la validación en el lado del cliente <em>no debe considerarse </em> una medida de seguridad exhaustiva! Tus aplicaciones siempre deben realizar comprobaciones de seguridad de los datos enviados por el formulario <em>en el lado del servidor</em>, <strong>así como también</strong> en el lado del cliente, porque la validación en el lado del cliente es demasiado fácil de evitar, por lo que los usuarios malintencionados pueden enviar fácilmente datos incorrectos a tu servidor. Lee <a href="/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad en los sitios web</a> para ver qué <em>podría</em> suceder. Cómo implementar la validación en el lado del servidor está fuera del alcance de este módulo, pero debes tenerlo en cuenta.</p>
+
+<h2 id="¿Qué_es_la_validación_de_formularios">¿Qué es la validación de formularios?</h2>
+
+<p>Ve a cualquier sitio web popular que incluya un formulario de registro y observa que proporcionan comentarios cuando no introduces tus datos en el formato que se espera. Recibirás mensajes como:</p>
+
+<ul>
+ <li>«Este campo es obligatorio» (No se puede dejar este campo en blanco).</li>
+ <li>«Introduzca su número de teléfono en el formato xxx-xxxx» (Se requiere un formato de datos específico para que se considere válido).</li>
+ <li>«Introduzca una dirección de correo electrónico válida» (los datos que introdujiste no están en el formato correcto).</li>
+ <li>«Su contraseña debe tener entre 8 y 30 caracteres y contener una letra mayúscula, un símbolo y un número». (Se requiere un formato de datos muy específico para tus datos).</li>
+</ul>
+
+<p>Esto se llama <strong>validación de formulario</strong>. Cuando introduces los datos, el navegador y/o el servidor web verifican que estén en el formato correcto y dentro de las restricciones establecidas por la aplicación. La validación realizada en el navegador se denomina validación <strong>en el lado del cliente</strong>, mientras que la validación realizada en el servidor se denomina validación <strong>en el lado del servidor</strong>. En este capítulo nos centraremos en la validación en el lado del cliente.</p>
+
+<p>Si la información está en el formato correcto, la aplicación permite que los datos se envíen al servidor y (en general) que se guarden en una base de datos; si la información no está en el formato correcto, da al usuario un mensaje de error que explica lo que debe corregir y le permite volver a intentarlo.</p>
+
+<p>Queremos que completar formularios web sea lo más fácil posible. Entonces, ¿por qué insistimos en validar nuestros formularios? Hay tres razones principales:</p>
+
+<ul>
+ <li><strong>Queremos obtener los datos correctos en el formato correcto.</strong> Nuestras aplicaciones no funcionarán correctamente si los datos de nuestros usuarios se almacenan en el formato incorrecto, son incorrectos o se omiten por completo.</li>
+ <li><strong>Queremos proteger los datos de nuestros usuarios</strong>. Obligar a nuestros usuarios a introducir contraseñas seguras facilita proteger la información de su cuenta.</li>
+ <li><strong>Queremos protegernos a nosotros mismo</strong>. Hay muchas formas en que los usuarios maliciosos puedan usar mal los formularios desprotegidos y dañar la aplicación (consulta <a href="/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad del sitio web</a>).</li>
+</ul>
+
+<div class="warning"><strong>Atención:</strong> No confíes nunca en los datos que se pasan al servidor desde el cliente. Incluso si tu formulario se valida correctamente y evita la introducción de datos con formato incorrecto en el lado del cliente, un usuario malintencionado puede alterar la petición de red.</div>
+
+<h2 id="Diferentes_tipos_de_validación_en_el_lado_del_cliente">Diferentes tipos de validación en el lado del cliente</h2>
+
+<p>Hay dos tipos diferentes de validación por parte del cliente que encontrarás en la web:</p>
+
+<ul>
+ <li>La <strong>validación de formularios incorporada</strong> utiliza características de validación de formularios HTML5, que hemos visto en muchos lugares a lo largo de este módulo. Esta validación generalmente no requiere mucho JavaScript. La validación de formularios incorporada tiene un mejor rendimiento que JavaScript, pero no es tan personalizable como la validación con JavaScript.</li>
+ <li>La <strong>validación con JavaScript</strong> se codifica utilizando JavaScript. Esta validación es completamente personalizable, pero debes crearlo todo (o usar una biblioteca).</li>
+</ul>
+
+<h2 id="Usar_la_validación_de_formulario_incorporada">Usar la validación de formulario incorporada</h2>
+
+<p>Una de las características más importantes de los <a href="/en-US/docs/Learn/Forms/HTML5_input_types">controles de formulario de HTML5</a> es la capacidad de validar la mayoría de los datos de usuario sin depender de JavaScript. Esto se realiza mediante el uso de atributos de validación en los elementos del formulario. Los hemos visto anteriormente en el curso, pero recapitulamos aquí:</p>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/HTML/Attributes/required">required</a></code>: Especifica si un campo de formulario debe completarse antes de que se pueda enviar el formulario.</li>
+ <li><code><a href="/en-US/docs/Web/HTML/Attributes/minlength">minlength</a></code> y <code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code>: Especifican la longitud mínima y máxima de los datos de texto (cadenas).</li>
+ <li><code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code> y <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code>: Especifican los valores mínimo y máximo de los tipos de entrada numéricos.</li>
+ <li><code>type</code>: Especifica si los datos deben ser un número, una dirección de correo electrónico o algún otro tipo de preajuste específico. </li>
+ <li><code><a href="/en-US/docs/Web/HTML/Attributes/pattern">pattern</a></code>: Especifica una <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresión regular</a> que define un patrón que los datos que se introduzcan deben seguir.</li>
+</ul>
+
+<p>Si los datos que se introducen en un campo de formulario siguen todas las reglas que especifican los atributos anteriores, se consideran válidos. Si no, se consideran no válidos.</p>
+
+<p>Cuando un elemento es válido, se cumplen los aspectos siguientes:</p>
+
+<ul>
+ <li>El elemento coincide con la pseudoclase {{cssxref(":valid")}} de CSS, lo que te permite aplicar un estilo específico a los elementos válidos.</li>
+ <li>Si el usuario intenta enviar los datos, el navegador envía el formulario siempre que no haya nada más que lo impida (por ejemplo, JavaScript).</li>
+</ul>
+
+<p>Cuando un elemento no es válido, se cumplen los aspectos siguientes:</p>
+
+<ul>
+ <li>El elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS, y a veces con otras pseudoclases de interfaz de usuario (UI) –por ejemplo, {{cssxref(":out-of-range")}}– dependiendo del error, que te permite aplicar un estilo específico a elementos no válidos.</li>
+ <li>Si el usuario intenta enviar los datos, el navegador bloquea el formulario y muestra un mensaje de error.</li>
+</ul>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Hay varios errores que evitan que el formulario se envíe, incluidos {{domxref('validityState.badInput', 'badInput')}}, {{domxref('validityState.patternMismatch','patternMismatch')}}, {{domxref('validityState.rangeOverflow','rangeOverflow')}} o {{domxref('validityState.rangeUnderflow','rangeUnderflow')}}, {{domxref('validityState.stepMismatch','stepMismatch')}}, {{domxref('validityState.tooLong','tooLong')}} o {{domxref('validityState.tooShort','tooShort')}}, {{domxref('validityState.typeMismatch','typeMismatch')}}, {{domxref('validityState.valueMissing','valueMissing')}} o {{domxref('validityState.customError','customError')}}.</p>
+</div>
+
+<h2 id="Ejemplos_de_validación_de_formularios_incorporados">Ejemplos de validación de formularios incorporados</h2>
+
+<p>En esta sección probaremos algunos de los atributos que hemos comentado antes.</p>
+
+<h3 id="Archivo_de_inicio_sencillo">Archivo de inicio sencillo</h3>
+
+<p>Vamos a empezar con un ejemplo sencillo: una entrada que te permite elegir si prefieres un plátano o una cereza. Este ejemplo implica una simple entrada ({{HTMLElement("input")}}) de texto con una etiqueta ({{htmlelement("label")}}) asociada y un botón de envío ({{htmlelement ("button")}}). Puedes encontrar el código fuente en GitHub en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-start.html">fruit-start.html</a> y el ejemplo en vivo a continuación.</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza?&lt;/label&gt;
+  &lt;input id="choose" name="i_like"&gt;
+  &lt;button&gt;Enviar&lt;/button&gt;
+&lt;/form&gt;</pre>
+
+<pre class="brush: css notranslate">input:invalid {
+  border: 2px dashed red;
+}
+
+input:valid {
+  border: 2px solid black;
+}</pre>
+
+<p>{{EmbedLiveSample("Archivo_de_inicio_sencillo", "100%", 80)}}</p>
+
+<p>Para empezar, haz una copia de <code>fruit-start.html</code> en un nuevo directorio de tu disco duro.</p>
+
+<h3 id="El_atributo_required">El atributo <code>required</code></h3>
+
+<p>La característica de validación de HTML5 más simple es el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/required">required</a></code>. Añade este atributo al elemento para que una entrada sea obligatoria. Cuando se establece este atributo, el elemento coincide con la pseudoclase de la interfaz de usuario {{cssxref(':required')}} y el formulario no se envía; muestra un mensaje de error al enviarlo si la entrada está vacía. Si está vacía, la entrada también se considera inválida, coincidiendo con la pseudoclase de interfaz de usuario {{cssxref(':invalid')}}.</p>
+
+<p>Añade un atributo <code>required</code> a tu entrada, como se muestra a continuación.</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza? (requerido) &lt;/label&gt;
+  &lt;input id="choose" name="i_like" <strong>required</strong>&gt;
+  &lt;button&gt;Enviar&lt;/button&gt;
+&lt;/form&gt;</pre>
+
+<p>Ten en cuenta el CSS que en el archivo de ejemplo se ha incluido:</p>
+
+<pre class="brush: css notranslate">input:invalid {
+  border: 2px dashed red;
+}
+
+input:invalid:required {
+  background-image: linear-gradient(to right, pink, lightgreen);
+}
+
+input:valid {
+  border: 2px solid black;
+}</pre>
+
+<p>Este CSS da un borde discontinuo rojo cuando la entrada no es válida, y un borde negro sólido más sutil cuando es válida. También añadimos un gradiente de fondo cuando la entrada es obligatoria <em>y</em> no válida. Prueba el nuevo comportamiento en el ejemplo siguiente:</p>
+
+<p>{{EmbedLiveSample("El_atributo_required", "100%", 80)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/fruit-required.html">fruit-validation.html</a> (consulta también el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-required.html">código fuente</a>).</p>
+</div>
+
+<p>Intenta enviar el formulario sin introducir ningún valor. Observa que la entrada no válida recibe el cursor, aparece un mensaje de error predeterminado («Complete este campo») y el formulario no se puede enviar.</p>
+
+<p>La presencia del atributo <code>required</code> en cualquier elemento que admite este atributo significa que el elemento coincide con la pseudoclase {{cssxref(':required')}}, tenga o no un valor. Si en el elemento {{HTMLElement("input")}} no se ha introducido ningún valor, <code>input</code> coincidirá con la pseudoclase {{cssxref(':invalid')}}.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Para una buena experiencia de usuario, indica al usuario que campos de formulario se requieren. No solo es una buena experiencia de usuario, sino que lo exigen las pautas de <a href="/es/docs/Learn/Accessibility">accesibilidad</a> de WCAG. Además, solo requiere que los usuarios introduzcan los datos que realmente necesitas: Por ejemplo, ¿por qué realmente necesitas saber el género o el tratamiento de alguien?</p>
+</div>
+
+<h3 id="Validación_de_una_expresión_regular">Validación de una expresión regular</h3>
+
+<p>Otra característica útil de validación es el atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a>, que espera una <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresión regular</a> como valor. Una expresión regular (<em>regex</em>) es un patrón que se puede usar para establecer combinaciones de caracteres en cadenas de texto, por lo que las expresiones regulares son ideales para la validación de formularios y sirven para una gran variedad de otros usos en JavaScript.</p>
+
+<p>Las expresiones regulares son bastante complejas y no vamos a exponerlas exhaustivamente en este artículo. A continuación hay algunos ejemplos para que te hagas una idea de cómo funcionan.</p>
+
+<ul>
+ <li><code>a</code>: coincide con un carácter que es <code>a</code> (ni <code>b</code>, ni <code>aa</code>, etc.).</li>
+ <li><code>abc</code>: coincide con <code>a</code>, seguido de <code>b</code>, seguido de <code>c</code>.</li>
+ <li><code>ab?c</code>: coincide con <code>a</code>, seguida opcionalmente de una sola <code>b</code>, seguida de <code>c</code> (<code>ac</code> o <code>abc</code>).</li>
+ <li><code>ab*c</code>: coincide con <code>a</code>, seguido opcionalmente de cualquier número de <code>b</code>, seguido de <code>c</code>. (<code>ac</code>, <code>abc</code>, <code>abbbbbc</code>, etc.)</li>
+ <li><code>a|b</code>: coincide con un carácter que es <code>a</code> o <code>b</code>.</li>
+ <li><code>abc|xyz</code>: coincide exactamente con <code>abc</code> o <code>xyz</code> (pero no con <code>abcxyz</code> <code>a</code> o <code>y</code>, y así sucesivamente).</li>
+</ul>
+
+<p>Hay muchas más posibilidades que no exponemos aquí. Para obtener una lista completa y muchos ejemplos, consulta nuestro documento de <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresiones regulares</a>.</p>
+
+<p>Implementemos un ejemplo. Actualiza tu HTML para añadir un atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a> como este:</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza?&lt;/label&gt;
+  &lt;input id="choose" name="i_like" required pattern="[Pp]látano|[Cc]ereza "&gt;
+  &lt;button&gt;Enviar&lt;/button&gt;
+&lt;/form&gt;
+</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">input:invalid {
+  border: 2px dashed red;
+}
+
+input:valid {
+  border: 2px solid black;
+}</pre>
+</div>
+
+<p>Esto nos da la siguiente actualización; pruébalo:</p>
+
+<p>{{EmbedLiveSample("Validación de una expresión regular", "100%", 80)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/fruit-pattern.html">fruit-pattern.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-pattern.html">código fuente</a>).</p>
+</div>
+
+<p>En este ejemplo, el elemento {{HTMLElement("input")}} acepta uno de los cuatro valores posibles: las cadenas «plátano», «Plátano», «cereza» o «Cereza». Las expresiones regulares distinguen entre mayúsculas y minúsculas, pero hemos hecho que admita versiones en mayúsculas y minúsculas utilizando un patrón «Aa» adicional anidado dentro de corchetes.</p>
+
+<p>En este punto, intenta cambiar el valor dentro del atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a> para que se vean iguales que algunos de los ejemplos vistos anteriormente, y observa que esto afecta a los valores que puedes añadir para que el valor de entrada sea válido. Intenta escribir algo por tu cuenta y mira cómo va. ¡Haz que estén relacionadas con la fruta siempre que sea posible para que tus ejemplos tengan sentido!</p>
+
+<p>Si un valor no vacío de {{HTMLElement("input")}} no coincide con el patrón de la expresión regular, <code>input</code> coincidirá con la pseudoclase {{cssxref(':invalid')}}.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Algunos tipos de elementos {{HTMLElement ("input")}} no necesitan validar una expresión regular con el atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a>. Especificar el tipo de correo electrónico (<code>email</code>), por ejemplo, valida el valor de las entradas con un patrón de dirección de correo electrónico bien formado o un patrón que coincida con una lista de direcciones de correo electrónico separadas por comas si tiene el atributo <a href="/en-US/docs/Web/HTML/Attributes/multiple"><code>multiple</code></a>.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: El elemento {{HTMLElement("textarea")}} no admite el atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a>.</p>
+</div>
+
+<h3 id="Restringir_la_longitud_de_tus_entradas">Restringir la longitud de tus entradas</h3>
+
+<p>Puedes restringir la longitud de los caracteres de todos los campos de texto creados por {{HTMLElement("input")}} o {{HTMLElement("textarea")}} utilizando los atributos <a href="/en-US/docs/Web/HTML/Attributes/minlength"><code>minlength</code></a> y <code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code>. Un campo no es válido si tiene un valor y ese valor tiene menos caracteres que el valor de longitud mínima (<a href="/en-US/docs/Web/HTML/Attributes/minlength"><code>minlength</code></a>), o más que el valor de longitud máxima (<code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code>).</p>
+
+<p>Los navegadores a menudo no permiten que el usuario escriba un valor más largo de lo esperado en los campos de texto. Lo que otorga una mejor experiencia de usuario que <code>maxlength</code> es proporcionar comentarios de recuento de caracteres de manera accesible y permitirles editar su contenido a un tamaño más reducido. Un ejemplo de esto es el límite de caracteres de Twitter. JavaScript, incluidas las <a href="https://github.com/mimo84/bootstrap-maxlength">soluciones que utilizan <code>maxlength</code></a>, se puede utilizar para proporcionar esta funcionalidad.</p>
+
+<h3 id="Restringir_los_valores_de_tus_entradas">Restringir los valores de tus entradas</h3>
+
+<p>Los atributos <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code> y <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code> se pueden usar para proporcionar a los campos numéricos (es decir, <code><a href="/en-US/docs/Web/HTML/Element/input/number">&lt;input type="number"&gt;</a></code>) un rango de valores válidos. El campo no será válido si contiene un valor fuera de este rango.</p>
+
+<p>Veamos otro ejemplo. Crea una nueva copia del archivo <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-start.html">fruit-start.html</a>.</p>
+
+<p>Ahora elimina el contenido del elemento <code>&lt;body&gt;</code> y reemplázalo con lo siguiente:</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza?&lt;/label&gt;
+    &lt;input type="text" id="choose" name="i_like" required minlength="6" maxlength="6"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="number"&gt;¿Cuántos te gustaría comer?&lt;/label&gt;
+    &lt;input type="number" id="number" name="amount" value="1" min="1" max="10"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<ul>
+ <li>Aquí verás que le hemos dado al campo de <code>text</code> unos valores <code>minlength</code> y <code>maxlength</code> de seis, que es la misma longitud que tienen el plátano y la cereza.</li>
+ <li>También le hemos dado al campo <code>number</code> un <code>min</code> de uno y un <code>max</code> de diez. Los números introducidos que queden fuera de este rango se mostrarán como no válidos; los usuarios no podrán usar las flechas de incremento/decremento para mover el valor fuera de este rango. Si el usuario introduce un número desde el teclado fuera de este rango, los datos no serán válidos. El número no es obligatorio, por lo que eliminar el valor aún dará como resultado un valor válido.</li>
+</ul>
+
+<div class="hidden">
+<pre class="brush: css notranslate">input:invalid {
+  border: 2px dashed red;
+}
+
+input:valid {
+  border: 2px solid black;
+}
+
+div {
+  margin-bottom: 10px;
+}</pre>
+</div>
+
+<p>Aquí está el ejemplo que se ejecuta en vivo:</p>
+
+<p>{{EmbedLiveSample("Restringir_los_valores_de_tus_entradas", "100%", 100)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/fruit-length.html">fruit-length.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-length.html">código fuente</a>).</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: <code>&lt;input type="number"&gt;</code> (y otros tipos, como <code>range</code> y <code>date</code>) también pueden tomar un atributo <a href="/en-US/docs/Web/HTML/Attributes/step"><code>step</code></a>, que especifica en qué incremento aumenta o disminuye el valor cuando se utilizan los controles de entrada (como el botones numéricos arriba y abajo). En el ejemplo anterior no hemos incluido un atributo <code>step</code>, por lo que el valor predeterminado es <code>1</code>. Esto significa que los valores de coma flotante, como 3.2, también se mostrarán como no válidos.</p>
+</div>
+
+<h3 id="Ejemplo_completo">Ejemplo completo</h3>
+
+<p>Aquí hay un ejemplo completo que muestra el uso de las funciones de validación integradas en HTML. En primer lugar, un poco de HTML:</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;p&gt;
+    &lt;fieldset&gt;
+      &lt;legend&gt;¿Tienes carné de conducir?&lt;abbr title="Este campo es obligatorio" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/legend&gt;
+      &lt;!-- Solo se puede seleccionar un botón de opción en un grupo con el mismo nombre,
+           y, por lo tanto, solo un botón de opción en un grupo con el mismo nombre que tiene marcado el atributo «requerido»
+           basta para hacer de una selección un requisito --&gt;
+      &lt;input type="radio" required name="driver" id="r1" value="yes"&gt;&lt;label for="r1"&gt;Sí&lt;/label&gt;
+      &lt;input type="radio" required name="driver" id="r2" value="no"&gt;&lt;label for="r2"&gt;No&lt;/label&gt;
+    &lt;/fieldset&gt;
+  &lt;/p&gt;
+  &lt;p&gt;
+    &lt;label for="n1"&gt;¿Qué edad tienes?&lt;/label&gt;
+    &lt;!-- El atributo pattern puede actuar como una alternativa para los navegadores que
+         no implementan el tipo de entrada de número, pero admiten el atributo pattern.
+         Ten en cuenta que los navegadores que admiten el atributo pattern lo harán
+         fallar silenciosamente cuando se use con un campo numérico.
+         Su uso aquí solo actúa como una alternativa --&gt;
+     &lt;input type="number" min="12" max="120" step="1" id="n1" name="age"
+           pattern="\d+"&gt;
+  &lt;/p&gt;
+  &lt;p&gt;
+    &lt;label for="t1"&gt;¿Cuál es tu fruta favorita?&lt;abbr title="Este campo es obligatorio" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/label&gt;
+    &lt;input type="text" id="t1" name="fruit" list="l1" required
+           pattern="[Bb]anana|[Cc]herry|[Aa]pple|[Ss]trawberry|[Ll]emon|[Oo]range "&gt;
+    &lt;datalist id="l1"&gt;
+      &lt;option&gt;Plátano&lt;/option&gt;
+      &lt;option&gt;Cereza&lt;/option&gt;
+      &lt;option&gt;Manzana&lt;/option&gt;
+      &lt;option&gt;Fresa&lt;/option&gt;
+      &lt;option&gt;Limón&lt;/option&gt;
+      &lt;option&gt;Naranja&lt;/option&gt;
+     &lt;/datalist&gt;
+  &lt;/p&gt;
+  &lt;p&gt;
+    &lt;label for="t2"&gt;¿Cuál es tu dirección de correo electrónico? &lt;/label&gt;
+    &lt;input type="email" id="t2" name="email"&gt;
+  &lt;/p&gt;
+  &lt;p&gt;
+    &lt;label for="t3"&gt;Deja un mensaje&lt;/label&gt;
+    &lt;textarea id="t3" name="msg" maxlength="140" rows="5"&gt;&lt;/textarea&gt;
+  &lt;/p&gt;
+  &lt;p&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/p&gt;
+&lt;/form&gt;</pre>
+
+<p>Y ahora, algo de CSS para añadir estilo al HTML:</p>
+
+<pre class="brush: css notranslate">form {
+  font: 1em sans-serif;
+  max-width: 320px;
+}
+
+p &gt; label {
+  display: block;
+}
+
+input[type="text"],
+input[type="email"],
+input[type="number"],
+textarea,
+fieldset {
+  width : 100%;
+  border: 1px solid #333;
+  box-sizing: border-box;
+}
+
+input:invalid {
+  box-shadow: 0 0 5px 1px red;
+}
+
+input:focus:invalid {
+  box-shadow: none;
+}</pre>
+
+<p>Esto se traduce de la siguiente manera:</p>
+
+<p>{{EmbedLiveSample("Ejemplo_completo", "100%", 420)}}</p>
+
+<p>Consulta <a href="/es/docs/HTML/HTML5/Validacion_de_restricciones#Atributos_relacionados_con_validaciones">Atributos relacionados con la validación</a> para obtener una lista completa de los atributos que se pueden usar para restringir los valores de entrada y los tipos de entrada que los admiten.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/full-example.html">full-example.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/full-example.html">código fuente</a>).</p>
+</div>
+
+<h2 id="Validar_formularios_utilizando_JavaScript">Validar formularios utilizando JavaScript</h2>
+
+<p>Debes usar JavaScript si quieres controlar la apariencia de los mensajes de error nativos o tratar con navegadores heredados que no admiten la validación de formularios incorporados en HTML. En esta sección veremos las diferentes formas de hacer esto.</p>
+
+<h3 id="La_API_de_validación_de_restricciones">La API de validación de restricciones</h3>
+
+<p>La mayoría de los navegadores admiten la <a href="/en-US/docs/Web/API/Constraint_validation">API de validación de restricciones</a>, que consta de un conjunto de métodos y propiedades disponibles en las interfaces DOM de elementos de formulario siguientes:</p>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/API/HTMLButtonElement">HTMLButtonElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/button">&lt;button&gt;</a></code>)</li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLFieldSetElement">HTMLFieldSetElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/fieldset">&lt;fieldset&gt;</a></code>)</li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLInputElement">HTMLInputElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/input">&lt;input&gt;</a></code>)</li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLOutputElement">HTMLOutputElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/output">&lt;output&gt;</a></code>)</li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLSelectElement">HTMLSelectElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/select">&lt;select&gt;</a></code>)</li>
+ <li><code><a href="/en-US/docs/Web/API/HTMLTextAreaElement">HTMLTextAreaElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/textarea">&lt;textarea&gt;</a></code>)</li>
+</ul>
+
+<p id="Constraint_validation_API_properties">La API de validación de restricciones hace que las propiedades siguientes estén disponibles en los elementos anteriores.</p>
+
+<ul>
+ <li><code>validationMessage</code>: Devuelve un mensaje localizado que describe las restricciones de validación que el control no satisface (si corresponde). Si el control no es candidato para la validación de restricciones (<code>willValidate</code> es <code>false</code>) o el valor del elemento satisface sus restricciones (es válido), esto devolverá una cadena vacía.</li>
+ <li><code>validity</code>: Devuelve un objeto <code>ValidityState</code> que contiene varias propiedades que describen el estado de validez del elemento. Puedes encontrar todos los detalles de todas las propiedades disponibles en la página de referencia {{domxref("ValidityState")}}; a continuación se enumeran algunos de los más comunes:
+  <ul>
+   <li>{{domxref("ValidityState.patternMismatch", "patternMismatch")}}: Devuelve <code>true</code> si el valor no coincide con el {{htmlattrxref("pattern", "input")}} especificado, y <code>false</code> si coincide. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
+   <li>{{domxref("ValidityState.tooLong", "tooLong")}}: Devuelve <code>true</code> si el valor es mayor que la longitud máxima especificada por el atributo {{htmlattrxref("maxlength", "input")}}, o <code>false</code> si es menor o igual al máximo. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
+   <li>{{domxref("ValidityState.tooShort", "tooShort")}}: Devuelve <code>true</code> si el valor es menor que la longitud mínima especificada por el atributo {{htmlattrxref("minlength", "input")}}, o <code>false</code> si es mayor o igual al mínmo. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
+   <li>{{domxref("ValidityState.rangeOverflow", "rangeOverflow")}}: Devuelve <code>true</code> si el valor es mayor que el máximo especificado por el atributo {{htmlattrxref("max", "input")}}, o <code>false</code> si es menor o igual que el máximo. Si es verdadero, el elemento coincide con las pseudoclases {{cssxref(":invalid")}} y {{cssxref(":out-of-range")}} de CSS.</li>
+   <li>{{domxref("ValidityState.rangeUnderflow", "rangeUnderflow")}}: Devuelve <code>true</code> si el valor es menor que el mínimo especificado por el atributo {{htmlattrxref("min", "input")}}, o <code>false</code> si es mayor o igual que el mínimo. Si es verdadero, el elemento coincide con las pseudoclases {{cssxref(":invalid")}} y {{cssxref(":out-of-range")}} de CSS.</li>
+   <li>{{domxref("ValidityState.typeMismatch", "typeMismatch")}}: Devuelve <code>true</code> si el valor no está en la sintaxis requerida (cuando {{htmlattrxref("type", "input")}} es <code>email</code> o <code>url</code>), o <code>false</code> si la sintaxis es correcta. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
+   <li><code>valid</code>: Devuelve <code>true</code> si el elemento cumple con todas sus restricciones de validación y por lo tanto se considera válido, o <code>false</code> si falla alguna restricción. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":valid")}} de CSS; o con la pseudoclase {{cssxref(":invalid")}} de CSS de lo contrario.</li>
+   <li><code>valueMissing</code>: Devuelve <code>true</code> si el elemento tiene un atributo {{htmlattrxref("required", "input")}} pero no tiene valor, o <code>false</code> de lo contrario. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
+  </ul>
+ </li>
+ <li><code>willValidate</code>: Devuelve <code>true</code> si el elemento se valida cuando se envía el formulario; <code>false</code> de lo contrario.</li>
+</ul>
+
+<p id="Constraint_validation_API_methods">La API de validación de restricciones también pone a disposición los siguientes métodos en los elementos anteriores.</p>
+
+<ul>
+ <li><code>checkValidity()</code>: Devuelve <code>true</code> si el valor del elemento no tiene problemas de validez; <code>false</code> en caso contrario. Si el elemento no es válido, este método también activa un <a href="/es/docs/Web/API/HTMLInputElement/invalid_event">evento <code>invalid</code></a> en el elemento.</li>
+ <li><code>setCustomValidity(<em>message</em>)</code>: Añade un mensaje de error personalizado al elemento; si configuras un mensaje de error personalizado, el elemento se considera no válido y se muestra el error especificado. Esto te permite utilizar el código JavaScript para establecer un fallo de validación distinto de los ofrecidos por las restricciones estándar de validación de HTML5. El mensaje se muestra al usuario cuando se informa del problema.</li>
+</ul>
+
+<h4 id="Implementar_un_mensaje_de_error_personalizado">Implementar un mensaje de error personalizado</h4>
+
+<p>Como has visto en los ejemplos de restricciones de validación de HTML5 anteriores, cada vez que un usuario intenta enviar un formulario no válido, el navegador muestra un mensaje de error. La forma en que se muestra este mensaje depende del navegador.</p>
+
+<p>Estos mensajes automatizados tienen dos inconvenientes:</p>
+
+<ul>
+ <li>No hay una forma estándar de cambiar su aspecto con CSS.</li>
+ <li>Dependen de la configuración regional del navegador, lo que significa que puedes tener una página en un idioma pero un mensaje de error en otro idioma, como se ve en la siguiente captura de pantalla de Firefox.</li>
+</ul>
+
+<p><img alt="Ejemplo de un mensaje de error en francés en una página de Firefox en inglés" src="/files/4329/error-firefox-win7.png" style="height: 97px; width: 228px;"></p>
+
+<p>La personalización de estos mensajes de error es uno de los casos de uso más comunes de la <a href="/en-US/docs/Web/API/Constraint_validation" rel="external">API de validación de restricciones</a>. Veamos un ejemplo simple de cómo hacer esto.</p>
+
+<p>Comenzaremos con un HTML simple (siéntete libre de poner esto en un archivo HTML en blanco; usa una copia nueva de <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-start.html">fruit-start.html</a> como base, si lo deseas):</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;label for="mail"&gt;Me gustaría que me proporcionara una dirección de correo electrónico:&lt;label&gt;
+  &lt;input type="email" id="mail" name="mail"&gt;
+  &lt;button&gt;Enviar&lt;/button&gt;
+&lt;/form&gt;</pre>
+
+<p>Y añade a la página el JavaScript siguiente:</p>
+
+<pre class="brush: js notranslate">const email = document.getElementById("mail");
+
+email.addEventListener("input", function (event) {
+  if (email.validity.typeMismatch) {
+    email.setCustomValidity("¡Se esperaba una dirección de correo electrónico!");
+  } else {
+    email.setCustomValidity("");
+  }
+});</pre>
+
+<p>Aquí guardamos una referencia para la entrada de la dirección de correo electrónico, luego le añadimos un detector de eventos que ejecuta el código de <code>content</code> cada vez que el valor de la entrada cambia.</p>
+
+<p>Dentro del código que contiene, verificamos si la propiedad <code>validity.typeMismatch</code> de la entrada de la dirección de correo electrónico devuelve <code>true</code>, lo que significa que el valor que contiene no coincide con el patrón para una dirección de correo electrónico bien formada. Si es así, llamamos al método <a href="/es/docs/HTML/HTML5/Validacion_de_restricciones"><code>setCustomValidity()</code></a> con un mensaje personalizado. Esto hace que la entrada no sea válida, de modo que cuando intentas enviar el formulario, el envío falla y se muestra el mensaje de error personalizado.</p>
+
+<p>Si la propiedad <code>validity.typeMismatch</code> devuelve <code>false</code>, llamamos al método <code>setCustomValidity()</code> con una cadena vacía. Esto hace que la entrada sea válida, y el formulario se envía.</p>
+
+<p>Puedes probarlo a continuación:</p>
+
+<p>{{EmbedGHLiveSample("/en-US/learning-area/html/forms/form-validation/custom-error-message.html", '100%', 80)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puede encontrar este ejemplo vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/custom-error-message.html">custom-error-message.html</a> (véase también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/custom-error-message.html">código fuente</a>).</p>
+</div>
+
+<h4 id="Un_ejemplo_más_detallado">Un ejemplo más detallado</h4>
+
+<p>Ahora que hemos visto un ejemplo realmente sencillo, veamos cómo podemos usar esta API para construir una validación personalizada un poco más compleja.</p>
+
+<p>En primer lugar, el código HTML. Una vez más, siéntete libre de construir esto junto con nosotros:</p>
+
+<pre class="brush: html notranslate">&lt;form novalidate&gt;
+  &lt;p&gt;
+    &lt;label for="mail"&gt;
+      &lt;span&gt;Por favor, introduzca una dirección de correo electrónico: &lt;/span&gt;
+      &lt;input type="email" id="mail" name="mail" required minlength="8"&gt;
+      &lt;span class="error" aria-live="polite"&gt;&lt;/span&gt;
+    &lt;/label&gt;
+  &lt;/p&gt;
+  &lt;button&gt;Enviar&lt;/button&gt;
+&lt;/form&gt;</pre>
+
+<p>Este sencillo formulario usa el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/novalidate">novalidate</a></code> para desactivar la validación automática del navegador; esto permite que nuestra secuencia de comandos tome control sobre la validación. Sin embargo, esto no deshabilita la compatibilidad para la API de validación de restricciones ni la aplicación de pseudoclases de CSS como {{cssxref(":valid")}}, etc. Eso significa que, aunque el navegador no verifica automáticamente la validez del formulario antes de enviar los datos, puedes hacerlo tú mismo y diseñar el formulario en consecuencia.</p>
+
+<p>Nuestra entrada para validar es <code><a href="/es/docs/Web/HTML/Elemento/input/email">&lt;input type="email"&gt;</a></code>, que es obligatoria y tiene una longitud mínima (<code>minlength</code>) de 8 caracteres. Vamos a verificar esto con nuestro propio código para que muestre un mensaje de error personalizado para cada elemento.</p>
+
+<p>Nuestro objetivo es mostrar los mensajes de error dentro de un elemento <code>&lt;span&gt;</code>. El atributo <a href="/en-US/docs/Accessibility/ARIA/ARIA_Live_Regions"><code>aria-live</code></a> se establece en ese <code>&lt;span&gt;</code> para asegurar que todo el mundo podrá ver nuestro mensaje de error personalizado, incluidos los usuarios de lectores de pantalla.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Un punto clave a tener en cuenta es que establecer el atributo <code>novalidate</code> en el formulario impide que el formulario muestre sus propios cuadros de diálogo de error, y nos permite mostrar los mensajes de error personalizados en el DOM de la manera que nosotros elijamos.</p>
+</div>
+
+<p>Ahora aplicaremos algo de CSS básico para mejorar ligeramente el aspecto del formulario y proporcionar algunos comentarios visuales cuando los datos de entrada no sean válidos:</p>
+
+<pre class="brush: css notranslate">body {
+  font: 1em sans-serif;
+  width: 200px;
+  padding: 0;
+  margin : 0 auto;
+}
+
+p * {
+  display: block;
+}
+
+input[type=email]{
+  -webkit-appearance: none;
+  appearance: none;
+
+  width: 100%;
+  border: 1px solid #333;
+  margin: 0;
+
+  font-family: inherit;
+  font-size: 90%;
+
+  box-sizing: border-box;
+}
+
+/* Este es nuestro diseño para los campos no válidos */
+input:invalid{
+  border-color: #900;
+  background-color: #FDD;
+}
+
+input:focus:invalid {
+  outline: none;
+}
+
+/* Este es el diseño para nuestros mensajes de error */
+.error {
+  width : 100%;
+  padding: 0;
+
+  font-size: 80%;
+  color: white;
+  background-color: #900;
+  border-radius: 0 0 5px 5px;
+
+  box-sizing: border-box;
+}
+
+.error.active {
+  padding: 0.3em;
+}</pre>
+
+<p>Vamos a ver el JavaScript que implementa la validación de error personalizada.</p>
+
+<pre class="brush: js notranslate">// Hay muchas formas de elegir un nodo DOM; aquí obtenemos el formulario y, a continuación, el campo de entrada
+// del correo electrónico, así como el elemento span en el que colocaremos el mensaje de error.
+const form  = document.getElementsByTagName('form')[0];
+
+const email = document.getElementById('mail');
+const emailError = document.querySelector('#mail + span.error');
+
+email.addEventListener('input', function (event) {
+  // Cada vez que el usuario escribe algo, verificamos si
+  // los campos del formulario son válidos.
+
+  if (email.validity.valid) {
+    // En caso de que haya un mensaje de error visible, si el campo
+    // es válido, eliminamos el mensaje de error.
+    emailError.innerHTML = ''; // Restablece el contenido del mensaje
+    emailError.className = 'error'; // Restablece el estado visual del mensaje
+  } else {
+    // Si todavía hay un error, muestra el error exacto
+    showError();
+  }
+});
+
+form.addEventListener('submit', function (event) {
+  // si el campo de correo electrónico es válido, dejamos que el formulario se envíe
+
+  if(!email.validity.valid) {
+    // Si no es así, mostramos un mensaje de error apropiado
+    showError();
+    // Luego evitamos que se envíe el formulario cancelando el evento
+    event.preventDefault();
+  }
+});
+
+function showError() {
+  if(email.validity.valueMissing) {
+    // Si el campo está vacío
+    // muestra el mensaje de error siguiente.
+    emailError.textContent = 'Debe introducir una dirección de correo electrónico.';
+  } else if(email.validity.typeMismatch) {
+    // Si el campo no contiene una dirección de correo electrónico
+    // muestra el mensaje de error siguiente.
+    emailError.textContent = 'El valor introducido debe ser una dirección de correo electrónico.';
+  } else if(email.validity.tooShort) {
+    // Si los datos son demasiado cortos
+    // muestra el mensaje de error siguiente.
+    emailError.textContent = 'El correo electrónico debe tener al menos ${ email.minLength } caracteres; ha introducido ${ email.value.length }.';
+  }
+
+  // Establece el estilo apropiado
+  emailError.className = 'error activo';
+}</pre>
+
+<p>Los comentarios explican las cosas bastante bien, pero de una manera muy breve:</p>
+
+<ul>
+ <li>Cada vez que cambiamos el valor de la entrada, verificamos si contiene datos válidos. Si es así, eliminamos cualquier mensaje de error que se muestre. Si los datos no son válidos, ejecutamos <code>showError()</code> para mostrar el error correspondiente.</li>
+ <li>Cada vez que intentamos enviar el formulario, verificamos nuevamente si los datos son válidos. Si es así, dejamos que envíe el formulario. Si no, ejecutamos <code>showError()</code> para mostrar el error correspondiente y detenemos el envío del formulario con <code><a href="/en-US/docs/Web/API/Event/preventDefault">preventDefault()</a></code>.</li>
+ <li>La función <code>showError()</code> usa varias propiedades de la entrada <code>validity</code> para determinar cuál es el error y luego muestra un mensaje de error según corresponda.</li>
+</ul>
+
+<p>Este es el resultado:</p>
+
+<p>{{EmbedGHLiveSample("/en-US/learning-area/html/forms/form-validation/detailed-custom-validation.html", '100%', 150)}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/detailed-custom-validation.html">detailed-custom-validation.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/detailed-custom-validation.html">código fuente</a>).</p>
+</div>
+
+<p>La API de validación de restricciones te proporciona una herramienta poderosa para manejar la validación de formularios, y te permite tener un control enorme sobre la interfaz de usuario más allá de lo que puedas hacer solo con HTML y CSS.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Para obtener más información, consulta nuestra <a href="/es/docs/HTML/HTML5/Validacion_de_restricciones">guía de validación de restricciones</a> y la referencia de <a href="/en-US/docs/Web/API/Constraint_validation">API de validación de restricciones</a>.</p>
+</div>
+
+<h3 id="Validar_formularios_sin_una_API_incorporada">Validar formularios sin una API incorporada</h3>
+
+<p>En algunos casos, como la compatibilidad heredada del navegador o los <a href="/es/docs/Learn/HTML/Forms/como_crear_widgets_de_formularios_personalizados">controles personalizados</a>, no podrás o no querrás usar la API de validación de restricciones. Todavía puedes usar JavaScript para validar tu formulario, pero vas a tener que escribirlo.</p>
+
+<p>Antes de validar el formulario, hazte estas preguntas:</p>
+
+<dl>
+ <dt>¿Qué tipo de validación debería realizar?</dt>
+ <dd>Debes determinar cómo validar los datos: operaciones de cadena, conversión de tipos, expresiones regulares, etc. Tú decides.</dd>
+ <dt>¿Qué debo hacer si el formulario no se valida?</dt>
+ <dd>Esto es claramente un problema de la interfaz de usuario. Tienes que decidir cómo se comportará el formulario. ¿El formulario va a enviar los datos de todos modos? ¿Deberías resaltar los campos que dan error? ¿Deberías mostrar mensajes de error?</dd>
+ <dt>¿Cómo puedo ayudar al usuario a corregir datos no válidos?</dt>
+ <dd>Para reducir la frustración del usuario, es muy importante proporcionar tanta información útil como sea posible para guiarlo a fin de que corrija sus entradas de datos. Debes ofrecer sugerencias por adelantado para que sepan lo que se espera de ellos, así como mensajes de error claros. Si deseas profundizar en los requisitos de interfaz de usuario para la validación de formularios, aquí hay algunos artículos útiles que debes leer:
+ <ul>
+  <li>SmashingMagazine: <a href="http://uxdesign.smashingmagazine.com/2012/06/27/form-field-validation-errors-only-approach/" rel="external">Form-Field Validation: The Errors-Only Approach</a> [Validación de campo de formulario: El enfoque de solo errores]</li>
+  <li>SmashingMagazine: <a href="http://www.smashingmagazine.com/2009/07/07/web-form-validation-best-practices-and-tutorials/" rel="external">Web Form Validation: Best Practices and Tutorials </a> [Validación de formularios web: Buenas prácticas y tutoriales]</li>
+  <li>Six Revision: <a href="http://sixrevisions.com/user-interface/best-practices-for-hints-and-validation-in-web-forms/" rel="external">Best Practices for Hints and Validation in Web Forms</a> [Buenas prácticas para sugerencias y validación de formularios web]</li>
+  <li>A List Apart: <a href="http://www.alistapart.com/articles/inline-validation-in-web-forms/" rel="external">Inline Validation in Web Forms</a> [Validación en línea de formularios web]</li>
+ </ul>
+ </dd>
+</dl>
+
+<h4 id="Un_ejemplo_que_no_usa_la_API_de_validación_de_restricciones">Un ejemplo que no usa la API de validación de restricciones</h4>
+
+<p>Para ilustrar esto, mostramos una versión simplificada del ejemplo anterior que funciona con navegadores con compatibilidad heredada.</p>
+
+<p>El HTML es casi el mismo; solo hemos eliminado las funciones de validación de HTML.</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;p&gt;
+    &lt;label for="mail"&gt;
+        &lt;span&gt;Por favor, introduzca una dirección de correo electrónico: &lt;/span&gt;
+        &lt;input type="text" class="mail" id="mail" name="mail"&gt;
+        &lt;span class="error" aria-live="polite"&gt;&lt;/span&gt;
+    &lt;/label&gt;
+  &lt;/p&gt;
+  &lt;!-- Algunos navegadores con compatibilidad heredada deben tener el atributo «type»
+       establecido explícitamente en el elemento «button» de «submit»--&gt;
+  &lt;button type="submit"&gt;Enviar&lt;/button&gt;
+&lt;/form&gt;</pre>
+
+<p>Del mismo modo, no es necesario cambiar mucho el CSS; acabamos de convertir la pseudoclase {{cssxref(":invalid")}} de CSS en una clase real y evitamos usar el selector de atributos que no funciona en Internet Explorer 6.</p>
+
+<pre class="brush: css notranslate">body {
+  font: 1em sans-serif;
+  width: 200px;
+  padding: 0;
+  margin : 0 auto;
+}
+
+form {
+  max-width: 200px;
+}
+
+p * {
+  display: block;
+}
+
+input.mail {
+  -webkit-appearance: none;
+
+  width: 100%;
+  border: 1px solid #333;
+  margin: 0;
+
+  font-family: inherit;
+  font-size: 90%;
+
+  box-sizing: border-box;
+}
+
+/* Este es nuestro diseño para los campos no válidos */
+input.invalid{
+  border-color: #900;
+  background-color: #FDD;
+}
+
+input:focus.invalid {
+  outline: none;
+}
+
+/* Este es el diseño para nuestros mensajes de error */
+.error {
+  width : 100%;
+  padding: 0;
+
+  font-size: 80%;
+  color: white;
+  background-color: #900;
+  border-radius: 0 0 5px 5px;
+  box-sizing: border-box;
+}
+
+.error.active {
+  padding: 0.3em;
+}</pre>
+
+<p>Los grandes cambios están en el código JavaScript, que necesita hacer mucho más trabajo pesado.</p>
+
+<pre class="brush: js notranslate">// Hay menos formas de elegir un nodo DOM con navegadores antiguos
+const form  = document.getElementsByTagName('form')[0];
+const email = document.getElementById('mail');
+
+// Lo siguiente es un truco para llegar al siguiente nodo de elementos hermanos en el DOM
+// Esto es peligroso porque puedes construir fácilmente un bucle infinito.
+// En los navegadores modernos es mejor usar element.nextElementSibling
+let error = email;
+while ((error = error.nextSibling).nodeType != 1);
+
+// según la especificación HTML5
+const emailRegExp = /^[a-zA-Z0-9.!#$%&amp;'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
+
+// Muchos navegadores antiguos no son compatibles con el método addEventListener.
+// Aquí hay una manera simple de manejar esto; está lejos de ser la única.
+function addEvent(element, event, callback) {
+  let previousEventCallBack = element["on"+event];
+  element["on"+event] = function (e) {
+    const output = callback(e);
+
+    // Una devolución de llamada que devuelve «false» detiene la cadena de devolución de llamada
+    // e interrumpe la ejecución de la devolución de llamada del evento.
+    if (output === false) return false;
+
+    if (typeof previousEventCallBack === 'function') {
+      output = previousEventCallBack(e);
+      if(output === false) return false;
+    }
+  }
+};
+
+// Ahora podemos reconstruir nuestra restricción de validación
+// Debido a que no confiamos en la pseudoclase de CSS, tenemos que
+// establecer explícitamente la clase valid/invalid en nuestro campo de correo electrónico
+addEvent(window, "load", function () {
+  // Aquí probamos si el campo está vacío (recuerda, el campo no es obligatorio)
+  // Si no es así, verificamos si su contenido es una dirección de correo electrónico con el formato correcto.
+  const test = email.value.length === 0 || emailRegExp.test(email.value);
+
+  email.className = test ? "valid" : "invalid";
+});
+
+// Esto define lo que sucede cuando el usuario escribe en el campo
+addEvent(email, "input", function () {
+  const test = email.value.length === 0 || emailRegExp.test(email.value);
+  if (test) {
+    email.className = "valid";
+    error.innerHTML = "";
+    error.className = "error";
+  } else {
+    email.className = "invalid";
+  }
+});
+
+// Esto define lo que sucede cuando el usuario intenta enviar los datos.
+addEvent(form, "submit", function () {
+  const test = email.value.length === 0 || emailRegExp.test(email.value);
+
+  if (!test) {
+    email.className = "invalid";
+    error.innerHTML = "I expect an e-mail, darling!";
+    error.className = "error active";
+
+    // Algunos navegadores antiguos no son compatibles con el método event.preventDefault ()
+    return false;
+  } else {
+    email.className = "valid";
+    error.innerHTML = "";
+    error.className = "error";
+  }
+});</pre>
+
+<p>El resultado es el siguiente:</p>
+
+<p>{{EmbedLiveSample("Validar_formularios_sin_una_API_incorporada", "100%", 130)}}</p>
+
+<p>Como puedes ver, no es tan difícil construir un sistema de validación por tu cuenta. La parte difícil es hacer que sea lo suficientemente genérico para que se pueda usar en diferentes plataformas y en cualquier forma. Hay muchas bibliotecas de archivos disponibles para realizar la validación de formularios, como por ejemplo <a href="http://rickharrison.github.com/validate.js/" rel="external">Validate.js</a></p>
+
+<p>.</p>
+
+<h2 id="Prueba_tus_habilidades!">Prueba tus habilidades!</h2>
+
+<p>Has llegado al final de este artículo pero ¿puedes recordar la información más importante?Puedes encontrar pruebas adicionales para comprovar que has comprendido la información antes de que continue — visita <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Forms/Test_your_skills:_Form_validation">Prueba tus habilidades: Validación de formularios</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>La validación de formularios en el lado del cliente a veces requiere JavaScript si deseas personalizar el estilo y los mensajes de error, pero <em>siempre</em> requiere que pienses cuidadosamente en el usuario. Recuerda que siempre debes ayudar a tus usuarios a corregir los datos que proporcionan. Para ese fin, asegúrate de:</p>
+
+<ul>
+ <li>Mostrar mensajes de error explícitos.</li>
+ <li>Ser permisivo con el formato de entrada.</li>
+ <li>Señalar exactamente dónde se produce el error, especialmente en formularios extensos.</li>
+</ul>
+
+<p>Una vez que hayas verificado que el formulario se ha completado correctamente, puedes proceder a enviarlo. Vamos a exponer el <a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">envío de los datos del formulario</a> en el próximo artículo.</p>
+
+<p>{{PreviousMenuNext("Learn/Forms/UI_pseudo-classes", "Learn/Forms/Sending_and_retrieving_form_data", "Learn/HTML/Forms")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Forms/Your_first_form">Tu primer formulario</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/How_to_structure_a_web_form">Cómo estructurar un formulario web</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">Los controles de formulario básicos originales</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/HTML5_input_types">Los tipos de entrada en HTML5</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Other_form_controls">Otros controles de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Styling_web_forms">Aplicar estilo a formularios web</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Aplicación de estilo a formularios avanzada</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/UI_pseudo-classes">Pseudoclases UI</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Form_validation">Validación de formularios en el lado del cliente</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
+</ul>
+
+<h3 id="Temas_avanzados">Temas avanzados</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_controls">Cómo construir controles de formulario personalizados</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Sending_forms_through_JavaScript">Enviar formularios por JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de propiedades para controles de formulario</a></li>
+</ul>
diff --git a/files/es/learn/forms/how_to_build_custom_form_controls/index.html b/files/es/learn/forms/how_to_build_custom_form_controls/index.html
new file mode 100644
index 0000000000..1f83cf0ad0
--- /dev/null
+++ b/files/es/learn/forms/how_to_build_custom_form_controls/index.html
@@ -0,0 +1,787 @@
+---
+title: Cómo crear widgets de formularios personalizados
+slug: Learn/Forms/How_to_build_custom_form_controls
+translation_of: Learn/Forms/How_to_build_custom_form_controls
+original_slug: Learn/HTML/Forms/como_crear_widgets_de_formularios_personalizados
+---
+<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/HTML/Forms/Form_validation", "Learn/HTML/Forms/Sending_forms_through_JavaScript", "Learn/HTML/Forms")}}</div>
+
+<p class="summary">Hay muchos casos donde los <a href="/en-US/docs/HTML/Forms/The_native_form_widgets" title="/en-US/docs/HTML/Forms/The_native_form_widgets">widgets de formularios HTML disponibles</a> simplemente no son suficientes. si desea <a href="/en-US/docs/Advanced_styling_for_HTML_forms" title="/en-US/docs/Advanced_styling_for_HTML_forms">establecer un estilo avanzado</a> en algunos widgets como el elemento {{HTMLElement("select")}} o si desea proporcionar comportamientos personalizados, no tiene más opción que crear sus propios widgets.</p>
+
+<p>En este aartículo, veremos cómo construir dicho widget. Para ello, trabajaremos con un ejemplo: Reconstruir el elemento {{HTMLElement("select")}}.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Nos enfocaremos en construir los widgets, no en cómo hacer que el código sea genérico y reutilizable; eso implicaría algún código JavaScript no trivial y manipulación del DOM en un contexto desconocido, y eso está fuera del alcance de este artículo.</p>
+</div>
+
+<h2 id="Diseño_estructura_y_semántica">Diseño, estructura, y semántica</h2>
+
+<p>Antes de crear un widget personalizado, debería iniciar por averiguar exactamente qué es lo que desea. Esto le ahorarrá tiempo considerable. En particular, es importante definir claramente todos los estados de su widget. Para hacer esto, es bueno comenzar con un widget existente, cuyos estados y comportamientos son bien conocidos, por lo que simplemente puede imitarlos tanto como sea posible.</p>
+
+<p>En nuestro ejemplo, reconstruiremos el elemento {{HTMLElement("select")}}. Este es el resultado que queremos lograr:</p>
+
+<p><img alt="The three states of a select box" src="/files/4481/custom-select.png" style="height: 135px; width: 366px;"></p>
+
+<p>Esta captura de pantall muestra los tres estados principales de nuestro widget: el estado normal (a la izquiera); el estado activo (en el centro) y el estado abierto (a la derecha).</p>
+
+<p>En términos de comportamiento, queremos que nuestro widget sea utilizable tanto con un ratón como con un teclado, al igual que cualquier widget nativo. Comencemos por definir cómo el widget llega a cada estado:</p>
+
+<dl>
+ <dt>El widget está en su estado normal cuando:</dt>
+ <dd>
+ <ul>
+  <li>La página carga</li>
+  <li>El widget estaba activo y el usuario hace clic en cualquier lugar fuera del widget</li>
+  <li>El widget estaba activo y el usuario mueve el foco a otro widget usando el teclado</li>
+ </ul>
+
+ <div class="note">
+ <p><strong>Nota:</strong> Mover el foco al rededor de la página generalmente se hace presionando la tecla de tabulación, pero este no es el estándar en todas partes. Por ejemplo, el ciclo a través de enlaces en una página se realiza en Safari de forma predeterminada usando la combinación <a href="http://www.456bereastreet.com/archive/200906/enabling_keyboard_navigation_in_mac_os_x_web_browsers/" title="http://www.456bereastreet.com/archive/200906/enabling_keyboard_navigation_in_mac_os_x_web_browsers/">combinación Opction+Tab</a>.</p>
+ </div>
+ </dd>
+ <dt>El widget está en su estado activo cuando:</dt>
+ <dd>
+ <ul>
+  <li>El usuario hace clic en él</li>
+  <li>El usuario presiona la tecla tab y obtiene foco</li>
+  <li>El widget estaba en su estado abierto y el usuario hace clic en el widget.</li>
+ </ul>
+ </dd>
+ <dt>El widget está en su estado abierto cuando:</dt>
+ <dd>
+ <ul>
+  <li>El widget está en cualquier otro estado diferente a abierto y el usuario hace clic en él.</li>
+ </ul>
+ </dd>
+</dl>
+
+<p>Una vez que sabemos cómo cambiar los estados, es importante definir cómo cambiar el valor del widget:</p>
+
+<dl>
+ <dt>El valor cambia cuando:</dt>
+ <dd>
+ <ul>
+  <li>El usuario hace clic en una opción cuando el widget está en estado abierto</li>
+  <li>El usuario pulsa las teclas de flecha hacia arriba o hacia abajocuando el widget está en estado activo</li>
+ </ul>
+ </dd>
+</dl>
+
+<p>Finalmente, definamos cómo se comportarán las opciones del widget:</p>
+
+<ul>
+ <li>Cuando se abre el widget, se resalta la opción seleccionada</li>
+ <li>Cuando el ratón está sobre una opción, la opción se resalta y la opción resaltada anteriormente vuelve a su estado normal</li>
+</ul>
+
+<p>Para los fines de nuestro ejemplo, nos detendremos con eso; sin embargo, si eres un lector cuidadoso, notarás que faltan algunos comportamientos. Por ejemplo, ¿qué crees que sucederá si el usuario pulsa la tecla de tabulación mientras el widget está en estado abierto? La respuesta es ... nada. OK, el comportamiento correcto parece obvio, pero el hecho es que, como no está definido en nuestras especificaciones, es muy fácil pasar por alto este comportamiento. Esto es especialmente cierto en un entorno de equipo cuando las personas que diseñan el comportamiento del widget son diferentes de las que lo implementan.</p>
+
+<p>Otro ejemplo divertido: ¿qué pasará si el usuario pulsa las teclas de flecha hacia arriba o hacia abajo mientras el widget está en estado abierto? Este es un poco más complicado. Si considera que el estado activo y el estado abierto son completamente diferentes, la respuesta es nuevamente "no pasará nada" porque no definimos ninguna interacción de teclado para el estado abierto. Por otro lado, si considera que el estado activo y el estado abierto se superponen un poco, el valor puede cambiar pero la opción definitivamente no se resaltará en consecuencia, una vez más porque no definimos ninguna interacción del teclado sobre las opciones cuando el widget es en su estado abierto (solo hemos definido lo que debería suceder cuando se abre el widget, pero nada después de eso).</p>
+
+<p>En nuestro ejemplo, las especificaciones faltantes son obvias, así que las manejaremos, pero puede ser un problema real en widgets nuevos y exóticos, para los cuales nadie tiene la menor idea de cuál es el comportamiento correcto. Por lo tanto, siempre es bueno pasar tiempo en esta etapa de diseño, porque si defines un comportamiento deficiente u olvidas definir uno, será muy difícil redefinirlo una vez que los usuarios se hayan acostumbrado. Si tiene dudas, solicite las opiniones de los demás y, si tiene el presupuesto para ello, no dude en realizar las pruebas de usuario. Este proceso se llama Diseño UX. Si desea obtener más información sobre este tema, debe consultar los siguientes recursos útiles:</p>
+
+<ul>
+ <li><a href="http://www.uxmatters.com/" rel="external" title="http://www.uxmatters.com/">UXMatters.com</a></li>
+ <li><a href="http://uxdesign.com/" rel="external" title="http://uxdesign.com/">UXDesign.com</a></li>
+ <li><a href="http://uxdesign.smashingmagazine.com/" rel="external" title="http://uxdesign.smashingmagazine.com/">The UX Design section of SmashingMagazine</a></li>
+</ul>
+
+<div class="note">
+<p><strong>Nota: </strong>Ademas, en la mayoría de los sistemas hay una forma de abrir el elemento {{HTMLElement("select")}} para ver todas las opciones disponibles (esto es lo mismo que hacer clic en el elemento {{HTMLElement("select")}} con un ratón). Esto se logra con Alt+Flecha abajo en Windows y no fué implementado en nuestro ejemplo —pero sería facil hacerlo, ya que el mecanismo ya se implementó para el evento <code>clic</code>.</p>
+</div>
+
+<h3 id="Definiendo_la_estructura_y_semántica_HTML">Definiendo la estructura y semántica HTML</h3>
+
+<p>Ahora que se ha decidido la funcionalidad básica del widget, es hora de comenzar a construir nuestro widget. El primer paso es definir su estructura HTML y darle una semántica básica. Esto es lo que necesitamos para reconstruir un elemento {{HTMLElement("select")}}:</p>
+
+<pre class="brush: html">&lt;!-- Este es nuestro contenedor principal para nuestro widget.
+     El atributo tabindex es lo que permite al usuario enforcar el widget.
+     Veremos más adelante que es mejor configurarlo a través de JavaScript. --&gt;
+&lt;div class="select" tabindex="0"&gt;
+
+  &lt;!-- Este contenedor será usado para mostrar el valor actual del widget --&gt;
+  &lt;span class="value"&gt;Cherry&lt;/span&gt;
+
+  &lt;!-- Este contenedor contedrá todas las opciones disponibles para nuestro widget.
+       Como es una lista, tiene sentido usar el elemento ul. --&gt;
+  &lt;ul class="optList"&gt;
+    &lt;!-- Cada opción solo contiene el valor que se mostrará, veremos más tarde
+         cómo manejar el valor real que será enviado con el formulario de datos --&gt;
+    &lt;li class="option"&gt;Cherry&lt;/li&gt;
+    &lt;li class="option"&gt;Lemon&lt;/li&gt;
+    &lt;li class="option"&gt;Banana&lt;/li&gt;
+    &lt;li class="option"&gt;Strawberry&lt;/li&gt;
+    &lt;li class="option"&gt;Apple&lt;/li&gt;
+  &lt;/ul&gt;
+
+&lt;/div&gt;</pre>
+
+<p>Tenga en cuanta el uso de nombres de clases; estos identifican cada parte relevante independientemente de los elementos HTML subyacentes reales utilizados. Esto es importante para garantizar que no vinculamos nuestro CSS y JavaScript a una estructura HTML sólida, de modo que podamos realizar cambios despues en la implementación sin romper el código que usa el widget. Pro ejemplo, si desea implementar el equivalente del elemento {{HTMLElement("optgroup")}}.</p>
+
+<h3 id="Creating_the_look_and_feel_using_CSS">Creating the look and feel using CSS</h3>
+
+<p>Now that we have a structure, we can start designing our widget. The whole point of building this custom widget is to be able to style this widget exactly as we want. To that end, we will split our CSS work into two parts: the first part will be the CSS rules absolutely necessary to have our widget behave like a {{HTMLElement("select")}} element, and the second part will consist of the fancy styles used to make it look the way we want.</p>
+
+<h4 id="Required_styles">Required styles</h4>
+
+<p>The required styles are those necessary to handle the three states of our widget.</p>
+
+<pre class="brush: css">.select {
+  /* This will create a positioning context for the list of options */
+  position: relative;
+
+  /* This will make our widget become part of the text flow and sizable at the same time */
+  display : inline-block;
+}</pre>
+
+<p>We need an extra class <code>active</code> to define the look and feel of our widget when it is in its active state. Because our widget is focusable, we double this custom style with the {{cssxref(":focus")}} pseudo-class in order to be sure they will behave the same.</p>
+
+<pre class="brush: css">.select.active,
+.select:focus {
+  outline: none;
+
+  /* This box-shadow property is not exactly required, however it's so important to be sure
+     the active state is visible that we use it as a default value, feel free to override it. */
+  box-shadow: 0 0 3px 1px #227755;
+}</pre>
+
+<p>Now, let's handle the list of options:</p>
+
+<pre class="brush: css">/* The .select selector here is syntactic sugar to be sure the classes we define are
+   the ones inside our widget. */
+.select .optList {
+  /* This will make sure our list of options will be displayed below the value
+     and out of the HTML flow */
+  position : absolute;
+  top      : 100%;
+  left     : 0;
+}</pre>
+
+<p>We need an extra class to handle when the list of options is hidden. This is necessary in order to manage the differences between the active state and the open state that do not exactly match.</p>
+
+<pre class="brush: css">.select .optList.hidden {
+  /* This is a simple way to hide the list in an accessible way,
+     we will talk more about accessibility in the end */
+  max-height: 0;
+  visibility: hidden;
+}</pre>
+
+<h4 id="Beautification">Beautification</h4>
+
+<p>So now that we have the basic functionality in place, the fun can start. The following is just an example of what is possible, and will match the screenshot at the beginning of this article. However, you should feel free to experiment and see what you can come up with.</p>
+
+<pre class="brush: css">.select {
+  /* All sizes will be expressed with the em value for accessibility reasons
+     (to make sure the widget remains resizable if the user uses the
+     browser's zoom in a text-only mode). The computations are made
+     assuming 1em == 16px which is the default value in most browsers.
+     If you are lost with px to em conversion, try http://riddle.pl/emcalc/ */
+  font-size   : 0.625em; /* this (10px) is the new font size context for em value in this context */
+  font-family : Verdana, Arial, sans-serif;
+
+  -moz-box-sizing : border-box;
+  box-sizing : border-box;
+
+  /* We need extra room for the down arrow we will add */
+  padding : .1em 2.5em .2em .5em; /* 1px 25px 2px 5px */
+  width   : 10em; /* 100px */
+
+  border        : .2em solid #000; /* 2px */
+  border-radius : .4em; /* 4px */
+  box-shadow    : 0 .1em .2em rgba(0,0,0,.45); /* 0 1px 2px */
+
+  /* The first declaration is for browsers that do not support linear gradients.
+     The second declaration is because WebKit based browsers haven't unprefixed it yet.
+     If you want to support legacy browsers, try http://www.colorzilla.com/gradient-editor/ */
+  background : #F0F0F0;
+  background : -webkit-linear-gradient(90deg, #E3E3E3, #fcfcfc 50%, #f0f0f0);
+  background : linear-gradient(0deg, #E3E3E3, #fcfcfc 50%, #f0f0f0);
+}
+
+.select .value {
+  /* Because the value can be wider than our widget, we have to make sure it will not
+     change the widget's width */
+  display  : inline-block;
+  width    : 100%;
+  overflow : hidden;
+
+  vertical-align: top;
+
+  /* And if the content overflows, it's better to have a nice ellipsis. */
+  white-space  : nowrap;
+  text-overflow: ellipsis;
+}</pre>
+
+<p>We don't need an extra element to design the down arrow; instead, we're using the {{cssxref(":after")}} pseudo-element. However, it could also be implemented using a simple background image on the <code>select</code> class.</p>
+
+<pre class="brush: css">.select:after {
+  content : "▼"; /* We use the unicode caracter U+25BC; see http://www.utf8-chartable.de */
+  position: absolute;
+  z-index : 1; /* This will be important to keep the arrow from overlapping the list of options */
+  top     : 0;
+  right   : 0;
+
+  -moz-box-sizing : border-box;
+  box-sizing : border-box;
+
+  height  : 100%;
+  width   : 2em;  /* 20px */
+  padding-top : .1em; /* 1px */
+
+  border-left  : .2em solid #000; /* 2px */
+  border-radius: 0 .1em .1em 0;  /* 0 1px 1px 0 */
+
+  background-color : #000;
+  color : #FFF;
+  text-align : center;
+}</pre>
+
+<p>Next, let's style the list of options:</p>
+
+<pre class="brush: css">.select .optList {
+  z-index : 2; /* We explicitly said the list of options will always overlap the down arrow */
+
+  /* this will reset the default style of the ul element */
+  list-style: none;
+  margin : 0;
+  padding: 0;
+
+  -moz-box-sizing : border-box;
+  box-sizing : border-box;
+
+  /* This will ensure that even if the values are smaller than the widget,
+     the list of options will be as large as the widget itself */
+  min-width : 100%;
+
+  /* In case the list is too long, its content will overflow vertically
+     (which will add a vertical scrollbar automatically) but never horizontally
+     (because we haven't set a width, the list will adjust its width automatically.
+     If it can't, the content will be truncated) */
+  max-height: 10em; /* 100px */
+  overflow-y: auto;
+  overflow-x: hidden;
+
+  border: .2em solid #000; /* 2px */
+  border-top-width : .1em; /* 1px */
+  border-radius: 0 0 .4em .4em; /* 0 0 4px 4px */
+
+  box-shadow: 0 .2em .4em rgba(0,0,0,.4); /* 0 2px 4px */
+  background: #f0f0f0;
+}</pre>
+
+<p>For the options, we need to add a <code>highlight</code> class to be able to identify the value the user will pick (or has picked).</p>
+
+<pre class="brush: css">.select .option {
+  padding: .2em .3em; /* 2px 3px */
+}
+
+.select .highlight {
+  background: #000;
+  color: #FFFFFF;
+}</pre>
+
+<p>So here's the result with our three states:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col" style="text-align: center;">Basic state</th>
+   <th scope="col" style="text-align: center;">Active state</th>
+   <th scope="col" style="text-align: center;">Open state</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{EmbedLiveSample("Basic_state",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_1")}}</td>
+   <td>{{EmbedLiveSample("Active_state",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_1")}}</td>
+   <td>{{EmbedLiveSample("Open_state",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_1")}}</td>
+  </tr>
+  <tr>
+   <td colspan="3" style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_1" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_1">Check out the source code</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Bring_your_widget_to_life_with_JavaScript">Bring your widget to life with JavaScript</h2>
+
+<p>Now that our design and structure are ready, we can write the JavaScript code to make the widget actually work.</p>
+
+<div class="warning">
+<p><strong>Warning:</strong> The following code is educational and should not be used as-is. Among many things, as we'll see, it is not future-proof and it will not work on legacy browsers. It also has redundant parts that should be optimized in production code.</p>
+</div>
+
+<div class="note">
+<p><strong>Note:</strong> Creating reusable widgets is something that can be a bit tricky. The <a href="http://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html" rel="external" title="http://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html">W3C Web Component draft</a> is one of the answers to this specific issue. <a href="http://x-tags.org/" rel="external" title="http://x-tags.org/">The X-Tag project</a> is a test implementation of this specification; we encourage you to take a look at it.</p>
+</div>
+
+<h3 id="Why_isn't_it_working">Why isn't it working?</h3>
+
+<p>Before we start, it's important to remember something very important about JavaScript: inside a browser, <strong>it's an unreliable technology</strong>. When you are building custom widgets, you'll have to rely on JavaScript because it's a necessary thread to tie everything together. However, there are many cases in which JavaScript isn't able to run in the browser:</p>
+
+<ul>
+ <li>The user has turned off JavaScript: This is the most unusual case ever; very few people turn off JavaScript nowadays.</li>
+ <li>The script is not loading. This is one of the most common cases, especially in the mobile world where the network is not very reliable.</li>
+ <li>The script is buggy. You should always consider this possibility.</li>
+ <li>The script is in conflict with a third party script. This can happen with tracking scripts or any bookmarklets the user uses.</li>
+ <li>The script is in conflict with, or is affected by, a browser extension (such as Firefox's <a href="https://addons.mozilla.org/fr/firefox/addon/noscript/" rel="external" title="https://addons.mozilla.org/fr/firefox/addon/noscript/">NoScript</a> extension or Chrome's <a href="https://chrome.google.com/webstore/detail/notscripts/odjhifogjcknibkahlpidmdajjpkkcfn" rel="external" title="https://chrome.google.com/webstore/detail/notscripts/odjhifogjcknibkahlpidmdajjpkkcfn">NotScripts</a> extension).</li>
+ <li>The user is using a legacy browser, and one of the features you require is not supported. This will happen frequently when you make use of cutting-edge APIs.</li>
+</ul>
+
+<p>Because of these risks, it's really important to seriously consider what will happen if JavaScript isn't working. Dealing in detail with this issue is out of the scope of this article because it's closely linked to how you want to make your script generic and reusable, but we'll consider the basics of this in our example.</p>
+
+<p>In our example, if our JavaScript code isn't running, we'll fall back to displaying a standard {{HTMLElement("select")}} element. To achieve this, we need two things.</p>
+
+<p>First, we need to add a regular {{HTMLElement("select")}} element before each use of our custom widget. This is actually also required in order to be able to send data from our custom widget along with the rest of our form data; more about this later.</p>
+
+<pre class="brush: html">&lt;body class="no-widget"&gt;
+  &lt;form&gt;
+    &lt;select name="myFruit"&gt;
+      &lt;option&gt;Cherry&lt;/option&gt;
+      &lt;option&gt;Lemon&lt;/option&gt;
+      &lt;option&gt;Banana&lt;/option&gt;
+      &lt;option&gt;Strawberry&lt;/option&gt;
+      &lt;option&gt;Apple&lt;/option&gt;
+    &lt;/select&gt;
+
+    &lt;div class="select"&gt;
+      &lt;span class="value"&gt;Cherry&lt;/span&gt;
+      &lt;ul class="optList hidden"&gt;
+        &lt;li class="option"&gt;Cherry&lt;/li&gt;
+        &lt;li class="option"&gt;Lemon&lt;/li&gt;
+        &lt;li class="option"&gt;Banana&lt;/li&gt;
+        &lt;li class="option"&gt;Strawberry&lt;/li&gt;
+        &lt;li class="option"&gt;Apple&lt;/li&gt;
+      &lt;/ul&gt;
+    &lt;/div&gt;
+  &lt;/form&gt;
+
+&lt;/body&gt;</pre>
+
+<p>Second, we need two new classes to let us hide the unneeded element (that is, the "real" {{HTMLElement("select")}} element if our script isn't running, or the custom widget if it is running). Note that by default, our HTML code hides our custom widget.</p>
+
+<pre class="brush: css">.widget select,
+.no-widget .select {
+  /* This CSS selector basically says:
+     - either we have set the body class to "widget" and thus we hide the actual {{HTMLElement("select")}} element
+     - or we have not changed the body class, therefore the body class is still "no-widget",
+       so the elements whose class is "select" must be hidden */
+  position : absolute;
+  left     : -5000em;
+  height   : 0;
+  overflow : hidden;
+}</pre>
+
+<p>Now we just need a JavaScript switch to determine if the script is running or not. This switch is very simple: if at page load time our script is running, it will remove the <code>no-widget</code> class and add the <code>widget</code> class, thereby swapping the visibility of the {{HTMLElement("select")}} element and of the custom widget.</p>
+
+<pre class="brush: js">window.addEventListener("load", function () {
+  document.body.classList.remove("no-widget");
+  document.body.classList.add("widget");
+});</pre>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col" style="text-align: center;">Without JS</th>
+   <th scope="col" style="text-align: center;">With JS</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{EmbedLiveSample("No_JS",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_2")}}</td>
+   <td>{{EmbedLiveSample("JS",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_2")}}</td>
+  </tr>
+  <tr>
+   <td colspan="2" style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_2" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_2">Check out the source code</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Note:</strong> If you really want to make your code generic and reusable, instead of doing a class switch it's far better to just add the widget class to hide the {{HTMLElement("select")}} elements, and to dynamically add the DOM tree representing the custom widget after every {{HTMLElement("select")}} element in the page.</p>
+</div>
+
+<h3 id="Making_the_job_easier">Making the job easier</h3>
+
+<p>In the code we are about to build, we will use the standard DOM API to do all the work we need. However, although DOM API support has gotten much better in browsers, there are always issues with legacy browsers (especially with good old Internet Explorer).</p>
+
+<p>If you want to avoid trouble with legacy browsers, there are two ways to do so: using a dedicated framework such as <a href="http://jquery.com/" rel="external" title="http://jquery.com/">jQuery</a>, <a href="https://github.com/julienw/dollardom" rel="external" title="https://github.com/julienw/dollardom">$dom</a>, <a href="http://prototypejs.org/" rel="external" title="http://prototypejs.org/">prototype</a>, <a href="http://dojotoolkit.org/" rel="external" title="http://dojotoolkit.org/">Dojo</a>, <a href="http://yuilibrary.com/" rel="external" title="http://yuilibrary.com/">YUI</a>, or the like, or by polyfilling the missing feature you want to use (which can easily be done through conditional loading, with the <a href="http://yepnopejs.com/" rel="external" title="http://yepnopejs.com/">yepnope</a> library for example).</p>
+
+<p>The features we plan to use are the following (ordered from the riskiest to the safest):</p>
+
+<ol>
+ <li>{{domxref("element.classList","classList")}}</li>
+ <li>{{domxref("EventTarget.addEventListener","addEventListener")}}</li>
+ <li><code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach">forEach</a></code> (This is not DOM but modern JavaScript)</li>
+ <li>{{domxref("element.querySelector","querySelector")}} and {{domxref("element.querySelectorAll","querySelectorAll")}}</li>
+</ol>
+
+<p>Beyond the availability of those specific features, there is still one issue remaining before starting. The object returned by the {{domxref("element.querySelectorAll","querySelectorAll()")}} function is a {{domxref("NodeList")}} rather than an <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array">Array</a></code>. This is important because <code>Array</code> objects support the <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach">forEach</a></code> function, but {{domxref("NodeList")}} doesn't. Because {{domxref("NodeList")}} really looks like an <code>Array</code> and because <code>forEach</code> is so convenient to use, we can easily add the support of <code>forEach</code> to {{domxref("NodeList")}} in order to make our life easier, like so:</p>
+
+<pre class="brush: js">NodeList.prototype.forEach = function (callback) {
+  Array.prototype.forEach.call(this, callback);
+}</pre>
+
+<p>We weren't kidding when we said it's easy to do.</p>
+
+<h3 id="Building_event_callbacks">Building event callbacks</h3>
+
+<p>The ground is ready, we can now start to define all the functions that will be used each time the user interacts with our widget.</p>
+
+<pre class="brush: js">// This function will be used each time we want to deactivate a custom widget
+// It takes one parameter
+// select : the DOM node with the `select` class to deactivate
+function deactivateSelect(select) {
+
+  // If the widget is not active there is nothing to do
+  if (!select.classList.contains('active')) return;
+
+  // We need to get the list of options for the custom widget
+  var optList = select.querySelector('.optList');
+
+  // We close the list of option
+  optList.classList.add('hidden');
+
+  // and we deactivate the custom widget itself
+  select.classList.remove('active');
+}
+
+// This function will be used each time the user wants to (de)activate the widget
+// It takes two parameters:
+// select : the DOM node with the `select` class to activate
+// selectList : the list of all the DOM nodes with the `select` class
+function activeSelect(select, selectList) {
+
+  // If the widget is already active there is nothing to do
+  if (select.classList.contains('active')) return;
+
+  // We have to turn off the active state on all custom widgets
+  // Because the deactivateSelect function fulfill all the requirement of the
+  // forEach callback function, we use it directly without using an intermediate
+  // anonymous function.
+  selectList.forEach(deactivateSelect);
+
+  // And we turn on the active state for this specific widget
+  select.classList.add('active');
+}
+
+// This function will be used each time the user wants to open/closed the list of options
+// It takes one parameter:
+// select : the DOM node with the list to toggle
+function toggleOptList(select) {
+
+  // The list is kept from the widget
+  var optList = select.querySelector('.optList');
+
+  // We change the class of the list to show/hide it
+  optList.classList.toggle('hidden');
+}
+
+// This function will be used each time we need to highlight an option
+// It takes two parameters:
+// select : the DOM node with the `select` class containing the option to highlight
+// option : the DOM node with the `option` class to highlight
+function highlightOption(select, option) {
+
+  // We get the list of all option available for our custom select element
+  var optionList = select.querySelectorAll('.option');
+
+  // We remove the highlight from all options
+  optionList.forEach(function (other) {
+    other.classList.remove('highlight');
+  });
+
+  // We highlight the right option
+  option.classList.add('highlight');
+};</pre>
+
+<p>That's all you need in order to handle the various states of the custom widget.</p>
+
+<p>Next, we bind these functions to the appropriate events:</p>
+
+<pre class="brush: js">// We handle the event binding when the document is loaded.
+window.addEventListener('load', function () {
+  var selectList = document.querySelectorAll('.select');
+
+  // Each custom widget needs to be initialized
+  selectList.forEach(function (select) {
+
+    // as well as all its `option` elements
+    var optionList = select.querySelectorAll('.option');
+
+    // Each time a user hovers their mouse over an option, we highlight the given option
+    optionList.forEach(function (option) {
+      option.addEventListener('mouseover', function () {
+        // Note: the `select` and `option` variable are closures
+        // available in the scope of our function call.
+        highlightOption(select, option);
+      });
+    });
+
+    // Each times the user click on a custom select element
+    select.addEventListener('click', function (event) {
+      // Note: the `select` variable is a closure
+      // available in the scope of our function call.
+
+      // We toggle the visibility of the list of options
+      toggleOptList(select);
+    });
+
+    // In case the widget gain focus
+    // The widget gains the focus each time the user clicks on it or each time
+    // they use the tabulation key to access the widget
+    select.addEventListener('focus', function (event) {
+      // Note: the `select` and `selectList` variable are closures
+      // available in the scope of our function call.
+
+      // We activate the widget
+      activeSelect(select, selectList);
+    });
+
+    // In case the widget loose focus
+    select.addEventListener('blur', function (event) {
+      // Note: the `select` variable is a closure
+      // available in the scope of our function call.
+
+      // We deactivate the widget
+      deactivateSelect(select);
+    });
+  });
+});</pre>
+
+<p>At that point, our widget will change state according to our design, but its value doesn't get updated yet. We'll handle that next.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col" style="text-align: center;">Live example</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{EmbedLiveSample("Change_states",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_3")}}</td>
+  </tr>
+  <tr>
+   <td style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_3" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_3">Check out the source code</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Handling_the_widget's_value">Handling the widget's value</h3>
+
+<p>Now that our widget is working, we have to add code to update its value according to user input and make it possible to send the value along with form data.</p>
+
+<p>The easiest way to do this is to use a native widget under the hood. Such a widget will keep track of the value with all the built-in controls provided by the browser, and the value will be sent as usual when a form is submitted. There's no point in reinventing the wheel when we can have all this done for us.</p>
+
+<p>As seen previously, we already use a native select widget as a fallback for accessibility reasons; we can simply synchronize its value with that of our custom widget:</p>
+
+<pre class="brush: js">// This function updates the displayed value and synchronizes it with the native widget.
+// It takes two parameters:
+// select : the DOM node with the class `select` containing the value to update
+// index  : the index of the value to be selected
+function updateValue(select, index) {
+  // We need to get the native widget for the given custom widget
+  // In our example, that native widget is a sibling of the custom widget
+  var nativeWidget = select.previousElementSibling;
+
+  // We also need  to get the value placeholder of our custom widget
+  var value = select.querySelector('.value');
+
+  // And we need the whole list of options
+  var optionList = select.querySelectorAll('.option');
+
+  // We set the selected index to the index of our choice
+  nativeWidget.selectedIndex = index;
+
+  // We update the value placeholder accordingly
+  value.innerHTML = optionList[index].innerHTML;
+
+  // And we highlight the corresponding option of our custom widget
+  highlightOption(select, optionList[index]);
+};
+
+// This function returns the current selected index in the native widget
+// It takes one parameter:
+// select : the DOM node with the class `select` related to the native widget
+function getIndex(select) {
+  // We need to access the native widget for the given custom widget
+  // In our example, that native widget is a sibling of the custom widget
+  var nativeWidget = select.previousElementSibling;
+
+  return nativeWidget.selectedIndex;
+};</pre>
+
+<p>With these two functions, we can bind the native widgets to the custom ones:</p>
+
+<pre class="brush: js">// We handle event binding when the document is loaded.
+window.addEventListener('load', function () {
+  var selectList = document.querySelectorAll('.select');
+
+  // Each custom widget needs to be initialized
+  selectList.forEach(function (select) {
+    var optionList = select.querySelectorAll('.option'),
+        selectedIndex = getIndex(select);
+
+    // We make our custom widget focusable
+    select.tabIndex = 0;
+
+    // We make the native widget no longer focusable
+    select.previousElementSibling.tabIndex = -1;
+
+    // We make sure that the default selected value is correctly displayed
+    updateValue(select, selectedIndex);
+
+    // Each time a user clicks on an option, we update the value accordingly
+    optionList.forEach(function (option, index) {
+      option.addEventListener('click', function (event) {
+        updateValue(select, index);
+      });
+    });
+
+    // Each time a user uses their keyboard on a focused widget, we update the value accordingly
+    select.addEventListener('keyup', function (event) {
+      var length = optionList.length,
+          index  = getIndex(select);
+
+      // When the user hits the down arrow, we jump to the next option
+      if (event.keyCode === 40 &amp;&amp; index &lt; length - 1) { index++; }
+
+      // When the user hits the up arrow, we jump to the previous option
+      if (event.keyCode === 38 &amp;&amp; index &gt; 0) { index--; }
+
+      updateValue(select, index);
+    });
+  });
+});</pre>
+
+<p>In the code above, it's worth noting the use of the <code><a href="/en-US/docs/Web/API/HTMLElement/tabIndex" title="/en-US/docs/Web/API/HTMLElement/tabIndex">tabIndex</a></code> property. Using this property is necessary to ensure that the native widget will never gain focus, and to make sure that our custom widget gains focus when the user uses his keyboard or his mouse.</p>
+
+<p>With that, we're done! Here's the result:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col" style="text-align: center;">Live example</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{EmbedLiveSample("Change_states",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_4")}}</td>
+  </tr>
+  <tr>
+   <td style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_4" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_4">Check out the source code</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>But wait a second, are we really done?</p>
+
+<h2 id="Make_it_accessible">Make it accessible</h2>
+
+<p>We have built something that works and though we're far from a fully-featured select box, it works nicely. But what we've done is nothing more than fiddle with the DOM. It has no real semantics, and even though it looks like a select box, from the browser's point of view it isn't one, so assistive technologies won't be able to understand it's a select box. In short, this pretty new select box isn't accessible!</p>
+
+<p>Fortunately, there is a solution and it's called <a href="/en-US/docs/Accessibility/ARIA" title="/en-US/docs/Accessibility/ARIA">ARIA</a>. ARIA stands for "Accessible Rich Internet Application", and it's <a href="http://www.w3.org/TR/wai-aria/" rel="external" title="http://www.w3.org/TR/wai-aria/">a W3C specification</a> specifically designed for what we are doing here: making web applications and custom widgets accessible. It's basically a set of attributes that extend HTML so that we can better describe roles, states and properties as though the element we've just devised was the native element it tries to pass for. Using these attributes is dead simple, so let's do it.</p>
+
+<h3 id="The_role_attribute">The <code>role</code> attribute</h3>
+
+<p>The key attribute used by <a href="/en-US/docs/Accessibility/ARIA" title="/en-US/docs/Accessibility/ARIA">ARIA</a> is the <a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques"><code>role</code></a> attribute. The <a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques"><code>role</code></a> attribute accepts a value that defines what an element is used for. Each role defines its own requirements and behaviors. In our example, we will use the <code><a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role">listbox</a></code> role. It's a "composite role", which means elements with that role expect to have children, each with a specific role (in this case, at least one child with the <code>option</code> role).</p>
+
+<p>It's also worth noting that ARIA defines roles that are applied by default to standard HTML markup. For example, the {{HTMLElement("table")}} element matches the role <code>grid</code>, and the {{HTMLElement("ul")}} element matches the role <code>list</code>. Because we use a {{HTMLElement("ul")}} element, we want to make sure the <code>listbox</code> role of our widget will supersede the <code>list</code> role of the {{HTMLElement("ul")}} element. To that end, we will use the role <code>presentation</code>. This role is designed to let us indicate that an element has no special meaning, and is used solely to present information. We will apply it to our {{HTMLElement("ul")}} element.</p>
+
+<p>To support the <code><a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role">listbox</a></code> role, we just have to update our HTML like this:</p>
+
+<pre class="brush: html">&lt;!-- We add the role="listbox" attribute to our top element --&gt;
+&lt;div class="select" role="listbox"&gt;
+  &lt;span class="value"&gt;Cherry&lt;/span&gt;
+  &lt;!-- We also add the role="presentation" to the ul element --&gt;
+  &lt;ul class="optList" role="presentation"&gt;
+    &lt;!-- And we add the role="option" attribute to all the li elements --&gt;
+    &lt;li role="option" class="option"&gt;Cherry&lt;/li&gt;
+    &lt;li role="option" class="option"&gt;Lemon&lt;/li&gt;
+    &lt;li role="option" class="option"&gt;Banana&lt;/li&gt;
+    &lt;li role="option" class="option"&gt;Strawberry&lt;/li&gt;
+    &lt;li role="option" class="option"&gt;Apple&lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/div&gt;</pre>
+
+<div class="note">
+<p><strong>Note:</strong> Including both the <code>role</code> attribute and a <code>class</code> attribute is only necessary if you want to support legacy browsers that do not support the <a href="/en-US/docs/CSS/Attribute_selectors" title="/en-US/docs/CSS/Attribute_selectors">CSS attribute selectors</a>.</p>
+</div>
+
+<h3 id="The_aria-selected_attribute">The <code>aria-selected</code> attribute</h3>
+
+<p>Using the <a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques"><code>role</code></a> attribute is not enough. <a href="/en-US/docs/Accessibility/ARIA" title="/en-US/docs/Accessibility/ARIA">ARIA</a> also provides many states and property attributes. The more and better you use them, the better your widget will be understood by assistive technologies. In our case, we will limit our usage to one attribute: <code>aria-selected</code>.</p>
+
+<p>The <code>aria-selected</code> attribute is used to mark which option is currently selected; this lets assistive technologies inform the user what the current selection is. We will use it dynamically with JavaScript to mark the selected option each time the user chooses one. To that end, we need to revise our <code>updateValue()</code> function:</p>
+
+<pre class="brush: js">function updateValue(select, index) {
+  var nativeWidget = select.previousElementSibling;
+  var value = select.querySelector('.value');
+  var optionList = select.querySelectorAll('.option');
+
+  // We make sure that all the options are not selected
+  optionList.forEach(function (other) {
+    other.setAttribute('aria-selected', 'false');
+  });
+
+  // We make sure the chosen option is selected
+  optionList[index].setAttribute('aria-selected', 'true');
+
+  nativeWidget.selectedIndex = index;
+  value.innerHTML = optionList[index].innerHTML;
+  highlightOption(select, optionList[index]);
+};</pre>
+
+<p>Here is the final result of all these changes (you'll get a better feel for this by trying it with an assistive technology such as <a href="http://www.nvda-project.org/" rel="external" title="http://www.nvda-project.org/">NVDA</a> or <a href="http://www.apple.com/accessibility/voiceover/" rel="external" title="http://www.apple.com/accessibility/voiceover/">VoiceOver</a>):</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col" style="text-align: center;">Live example</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{EmbedLiveSample("Change_states",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_5")}}</td>
+  </tr>
+  <tr>
+   <td style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_5" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_2">Check out the final source code</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Conclusion">Conclusion</h2>
+
+<p>We have seen all the basics of building a custom form widget, but as you can see it's not trivial to do, and often it's better and easier to rely on third-party libraries instead of coding them from scratch yourself (unless, of course, your goal is to build such a library).</p>
+
+<p>Here are a few libraries you should consider before coding your own:</p>
+
+<ul>
+ <li><a href="http://jqueryui.com/" rel="external" title="http://jqueryui.com/">jQuery UI</a></li>
+ <li><a href="https://github.com/marghoobsuleman/ms-Dropdown" rel="external" title="https://github.com/marghoobsuleman/ms-Dropdown">msDropDown</a></li>
+ <li><a href="http://www.emblematiq.com/lab/niceforms/" rel="external" title="http://www.emblematiq.com/lab/niceforms/">Nice Forms</a></li>
+ <li><a href="https://www.google.fr/search?q=HTML+custom+form+controls&amp;ie=utf-8&amp;oe=utf-8&amp;aq=t&amp;rls=org.mozilla:fr:official&amp;client=firefox-a" rel="external" title="https://www.google.fr/search?q=HTML+custom+form+controls&amp;ie=utf-8&amp;oe=utf-8&amp;aq=t&amp;rls=org.mozilla:fr:official&amp;client=firefox-a">And many more…</a></li>
+</ul>
+
+<p>If you want to move forward, the code in this example needs some improvement before it becomes generic and reusable. This is an exercise you can try to perform. Two hints to help you in this: the first argument for all our functions is the same, which means those functions need the same context. Building an object to share that context would be wise. Also, you need to make it feature-proof; that is, it needs to be able to work better with a variety of browsers whose compatibility with the Web standards they use vary. Have fun!</p>
+
+<p>{{PreviousMenuNext("Learn/HTML/Forms/Form_validation", "Learn/HTML/Forms/Sending_forms_through_JavaScript", "Learn/HTML/Forms")}}</p>
+
+<p> </p>
+
+<h2 id="In_this_module">In this module</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Your first HTML form</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">How to structure an HTML form</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">The native form widgets</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Sending form data</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Form data validation</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">How to build custom form widgets</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Sending forms through JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">HTML forms in legacy browsers</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Styling HTML forms</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Property compatibility table for form widgets</a></li>
+</ul>
+
+<p> </p>
diff --git a/files/es/learn/forms/how_to_structure_a_web_form/index.html b/files/es/learn/forms/how_to_structure_a_web_form/index.html
new file mode 100644
index 0000000000..e2a1a8efa9
--- /dev/null
+++ b/files/es/learn/forms/how_to_structure_a_web_form/index.html
@@ -0,0 +1,321 @@
+---
+title: Cómo estructurar un formulario HTML
+slug: Learn/Forms/How_to_structure_a_web_form
+translation_of: Learn/Forms/How_to_structure_a_web_form
+original_slug: Learn/HTML/Forms/How_to_structure_an_HTML_form
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}</div>
+
+<p class="summary">Una vez examinados los conceptos básicos, vamos a ver más en detalle los elementos que se utilizan para proporcionar estructura y significado a las diferentes partes de un formulario.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática y de <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">lenguajes HTML</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Entender cómo se estructuran los formularios HTML y se les proporciona semántica para dotarlos de criterios de usabilidad y accesibilidad.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>La flexibilidad que presentan los formularios los convierte en una de las estructuras más complejas en <a href="/es/docs/Learn/HTML" title="/en-US/docs/HTML">HTML</a>, puesto que puedes crear cualquier tipo de formulario básico a partir de los elementos y atributos destinados a esta función. El uso de una estructura correcta al crear un formulario HTML te ayudará a garantizar que el formulario presente las características de usabilidad y <a href="/es/docs/Learn/Accessibility">accesibilidad </a> adecuadas.</p>
+
+<h2 id="El_elemento_&lt;form>">El elemento &lt;form&gt;</h2>
+
+<p>El elemento {{HTMLElement ("form")}} define formalmente un formulario y los atributos que determinan el comportamiento del formulario. Cada vez que desees crear un formulario HTML, debes empezar utilizando este elemento y anidando todo el contenido dentro de él. Muchas tecnologías de asistencia y complementos del navegador pueden descubrir elementos {{HTMLElement ("form")}} e implementar códigos de apoyo (<em>hooks</em>) especiales para que sean más fáciles de usar.</p>
+
+<p>Ya lo vimos en el artículo anterior.</p>
+
+<div class="warning"><strong>Advertencia:</strong> Está estrictamente prohibido anidar un formulario dentro de otro formulario. Anidar formularios no es una buena idea porque puede ocasionar comportamientos impredecibles.</div>
+
+<p>Siempre es posible usar controles de formulario fuera de un elemento {{HTMLElement ("form")}}. Si la haces, por defecto ese control no tiene nada que ver con ningún formulario, a menos que lo asocies a algún formulario con el atributo <a href="/en-US/docs/Web/HTML/Attributes/form"><code>form</code></a>. Esto se introdujo para permitir vincular explícitamente un control a un formulario, incluso si este no está dentro de él.</p>
+
+<p>A continuación vamos a exponer los elementos estructurales que encontrarás en un formulario.</p>
+
+<h2 id="Los_elementos_&lt;fieldset>_y_&lt;legend>">Los elementos &lt;fieldset&gt; y &lt;legend&gt;</h2>
+
+<p>El elemento {{HTMLElement ("fieldset")}} es una forma cómoda de crear grupos de controles de formulario (también denominados <em>widgets</em>) que comparten el mismo propósito, con fines semánticos y de aplicación de estilo. Puedes etiquetar un elemento {{HTMLElement ("fieldset")}} incluyendo un elemento {{HTMLElement ("legend")}} justo debajo de la etiqueta de apertura {{HTMLElement ("fieldset")}}. El contenido textual del elemento {{HTMLElement ("legend")}} describe formalmente el propósito del elemento {{HTMLElement ("fieldset")}} que está incluido dentro.</p>
+
+<p>Muchas tecnologías de asistencia utilizarán el elemento {{HTMLElement ("legend")}} como si fuera una parte de la etiqueta de cada control dentro del elemento {{HTMLElement ("fieldset")}} correspondiente. Por ejemplo, algunos lectores de pantalla como <a href="http://www.freedomscientific.com/products/software/jaws/" rel="external" title="http://www.freedomscientific.com/products/fs/jaws-product-page.asp">Jaws</a> y <a href="http://www.nvda-project.org/" rel="external" title="http://www.nvda-project.org/">NVDA</a> leerán el contenido de la leyenda antes de decir la etiqueta de cada control.</p>
+
+<p>Un pequeño ejemplo:</p>
+
+<pre class="brush:html; notranslate">&lt;form&gt;
+  &lt;fieldset&gt;
+    &lt;legend&gt;Tamaño del zumo de fruta&lt;/legend&gt;
+    &lt;p&gt;
+      &lt;input type="radio" name="size" id="size_1" value="small"&gt;
+      &lt;label for="size_1"&gt;Pequeño&lt;/label&gt;
+    &lt;/p&gt;
+    &lt;p&gt;
+      &lt;input type="radio" name="size" id="size_2" value="medium"&gt;
+      &lt;label for="size_2"&gt;Mediano&lt;/label&gt;
+    &lt;/p&gt;
+    &lt;p&gt;
+      &lt;input type="radio" name="size" id="size_3" value="large"&gt;
+      &lt;label for="size_3"&gt;Grande&lt;/label&gt;
+    &lt;/p&gt;
+  &lt;/fieldset&gt;
+&lt;/form&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/fieldset-legend.html">fieldset-legend.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/fieldset-legend.html">consúltalo en vivo</a>).</p>
+</div>
+
+<p>Al leer el formulario anterior, un lector de pantalla dirá «Tamaño del zumo de fruta: pequeño» para el primer control de formulario, «Tamaño del zumo de fruta: mediano» para el segundo y «Tamaño del zumo de fruta: grande» para el tercero.</p>
+
+<p>El caso de uso que se muestra en este ejemplo es uno de los más importantes. Cada vez que tengas un conjunto de botones de opción, debes anidarlos dentro de un elemento {{HTMLElement ("fieldset")}}. Hay otros casos de uso y el elemento {{HTMLElement ("fieldset")}} también se puede usar en general para seccionar un formulario. Idealmente, los formularios largos deberían tener una extensión de varias páginas, pero si un formulario se alarga y ha de estar contenido en una sola página, colocar las diferentes secciones relacionadas dentro de diferentes conjuntos de campos mejora su usabilidad.</p>
+
+<p>Debido a la influencia que tiene sobre las tecnologías de asistencia, el elemento {{HTMLElement ("fieldset")}} es uno de los elementos clave para crear formularios accesibles. Sin embargo, no hay que abusar de él. Si es posible, cada vez que crees un formulario, intenta <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders">escuchar cómo lo interpreta un lector de pantalla</a>. Si suena raro, intenta mejorar la estructura del formulario.</p>
+
+<h2 id="El_elemento_&lt;label>">El elemento &lt;label&gt;</h2>
+
+<p>Como vimos en el artículo anterior, el elemento {{HTMLElement ("label")}} es la forma formal de definir una etiqueta para un control de un formulario HTML. Este es el elemento más importante si deseas crear formularios accesibles porque cuando se implementan correctamente, los lectores de pantalla leen la etiqueta de un elemento de formulario junto con las instrucciones relacionadas, y esto además resulta muy útil para los usuarios videntes. Tomemos este ejemplo que vimos en el artículo anterior:</p>
+
+<pre class="brush: html notranslate">&lt;label for="name"&gt;Nombre:&lt;/label&gt; &lt;input type="text" id="name" name="user_name"&gt;</pre>
+
+<p>Con la etiqueta <code>&lt;label&gt;</code> asociada correctamente con <code>&lt;input&gt;</code> por su atributo <code>for</code> (que contiene el atributo <code>id</code> del elemento <code>&lt;input&gt;</code>), un lector de pantalla leerá algo como «Nombre, editar texto».</p>
+
+<p>Hay otra forma de asociar un control de formulario con una etiqueta: asociarlo implícitamente anidando el control de formulario dentro de <code>&lt;label&gt;</code>.</p>
+
+<pre class="brush: html notranslate">&lt;label for="name"&gt;
+  Nombre: &lt;input type="text" id="name" name="user_name"&gt;
+&lt;/label&gt;</pre>
+
+<p>Incluso en estos casos, se aconseja establecer el atributo <code>for</code> para garantizar que todas las tecnologías de asistencia comprendan la relación entre la etiqueta y el control de formulario.</p>
+
+<p>Si no hay ninguna etiqueta, o si el control de formulario no está asociado implícita o explícitamente con alguna etiqueta, un lector de pantalla leerá algo así como «Editar texto en blanco», lo cual no es de mucha ayuda.</p>
+
+<h3 id="¡También_se_puede_hacer_clic_en_las_etiquetas!">¡También se puede hacer clic en las etiquetas!</h3>
+
+<p>Otra ventaja de configurar correctamente las etiquetas es que puedes hacer clic o pulsar en la etiqueta para activar el control de formulario correspondiente. Esto es útil para controles como entradas de texto, donde puedes hacer clic tanto en la etiqueta como en la entrada de texto para proporcionar el foco al control de formulario, pero es útil especialmente para botones de opción y casillas de verificación, porque la zona sensible de este control puede ser muy pequeña, y puede ser útil para facilitar su activación.</p>
+
+<p>Por ejemplo, al hacer clic en el texto de la etiqueta «Me gustan las cerezas» del ejemplo siguiente, cambiará el estado seleccionado de la casilla de verificación <em>taste_cherry</em>:</p>
+
+<pre class="brush:html; notranslate">&lt;form&gt;
+  &lt;p&gt;
+    &lt;input type="checkbox" id="taste_1" name="taste_cherry" value="cherry"&gt;
+    &lt;label for="taste_1"&gt;Me gustan las cerezas&lt;/label&gt;
+  &lt;/p&gt;
+  &lt;p&gt;
+    &lt;input type="checkbox" id="taste_2" name="taste_banana" value="banana"&gt;
+    &lt;label for="taste_2"&gt;Me gustan los plátanos&lt;/label&gt;
+  &lt;/p&gt;
+&lt;/form&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/checkbox-label.html">checkbox-label.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/checkbox-label.html">consúltalo en vivo</a>).</p>
+</div>
+
+<h3 id="Etiquetas_múltiples">Etiquetas múltiples</h3>
+
+<p>Estrictamente hablando, es posible poner varias etiquetas en un solo control de formulario, pero no suele ser una buena idea porque algunas tecnologías de asistencia pueden tener problemas para manejarlas. En caso de tener varias etiquetas, hay que anidar el control de formulario y sus etiquetas dentro de un único elemento {{htmlelement ("label")}}.</p>
+
+<p>Consideremos este ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Los campos obligatorios se marcan con un &lt;abbr title = "required"&gt;*&lt;/abbr&gt;.&lt;/p&gt;
+
+&lt;!-- Así que esto: --&gt;
+&lt;div&gt;
+  &lt;label for="username"&gt;Nombre:&lt;/label&gt;
+  &lt;input type="text" name="username"&gt;
+  &lt;label for="username"&gt;&lt;abbr title="required" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/label&gt;
+&lt;/div&gt;
+
+&lt;!-- sería mejor hacerlo así: --&gt;
+&lt;div&gt;
+  &lt;label for="username"&gt;
+    &lt;span&gt;Nombre:&lt;/span&gt;
+    &lt;input id="username" type="text" name="username"&gt;
+    &lt;abbr title="required" aria-label="required"&gt;*&lt;/abbr&gt;
+  &lt;/label&gt;
+&lt;/div&gt;
+
+&lt;!-- Pero probablemente lo mejor es esto: --&gt;
+&lt;div&gt;
+  &lt;label for="username"&gt;Nombre: &lt;abbr title="required" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/label&gt;
+  &lt;input id="username" type="text" name="username"&gt;
+&lt;/div&gt;</pre>
+
+<p>{{EmbedLiveSample("Etiquetas_múltiples", 120, 120)}}</p>
+
+<p>El párrafo de la parte superior establece una regla para los elementos que son obligatorios. La regla ha de incluirse <em>antes</em> de usarse para que tanto los usuarios videntes como los usuarios que utilizan tecnologías de asistencia y lectores de pantalla, sepan lo que significa antes de encontrar un elemento obligatorio. Pero si bien esto ayuda a informar a los usuarios de lo que significa un asterisco, no es posible confiar plenamente en ello. Cuando un lector de pantalla se encuentre con un asterisco pronunciará «estrella». Cuando un usuario vidente pase el ratón por encima, debería aparecer una etiqueta de «obligatorio», lo cual se logra con el uso del atributo <code>title</code>. Pero los títulos que se leen en voz alta dependen de la configuración del lector de pantalla, por lo que es más fiable incluir también el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code>, que los lectores de pantalla siempre leen.</p>
+
+<p>Las variantes anteriores aumentan en efectividad a medida que se avanza por ellas:</p>
+
+<ul>
+ <li>En el primer ejemplo, la etiqueta no se lee en absoluto con la entrada de texto; solo se obtiene «Editar texto en blanco», y además las etiquetas se leen por separado. Los múltiples elementos <code>&lt;label&gt;</code> confunden al lector de pantalla.</li>
+ <li>En el segundo ejemplo, las cosas son un poco más claras: la etiqueta que se lee junto con la entrada de texto es «Editar texto nombre estrella nombre obligatorio», pero las etiquetas aún se leen por separado. Las cosas continúan siendo un poco confusas, pero esta vez funciona algo mejor porque <code>&lt;input&gt;</code> tiene una etiqueta asociada.</li>
+ <li>El tercer ejemplo es el mejor: la etiqueta se lee en conjunto, y la etiqueta que se lee con la entrada es «Editar texto nombre requerido».</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Es posible que obtengas resultados ligeramente diferentes dependiendo de tu lector de pantalla. Esta prueba se hizo con VoiceOver (NVDA se comporta de manera similar). Nos encantaría conocer tus experiencias.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar este ejemplo en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/required-labels.html">required-labels.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/required-labels.html">o consultarlo en vivo</a>). No pruebes el ejemplo con las dos o tres versiones sin los comentarios porque los lectores de pantalla se confundirán si hay múltiples etiquetas y múltiples entradas con el mismo ID.</p>
+</div>
+
+<h2 id="Estructuras_HTML_comunes_que_se_utilizan_en_los_formularios">Estructuras HTML comunes que se utilizan en los formularios</h2>
+
+<p>Más allá de las estructuras específicas de los formularios web, es bueno recordar que el marcado de los formularios es solo HTML. Esto significa que puedes usar todo el poder del HTML para estructurar un formulario web.</p>
+
+<p>Como puedes ver en los ejemplos, es una práctica común delimitar una etiqueta y su control de formulario con un elemento {{HTMLElement ("li")}} dentro de una lista {{HTMLElement ("ul")}} o {{HTMLElement ("ol")}}. Los elementos {{HTMLElement ("p")}} y {{HTMLElement ("div")}} también se usan con frecuencia. Se recomiendan las listas para estructurar múltiples casillas de verificación o botones de opción.</p>
+
+<p>Además del elemento {{HTMLElement ("fieldset")}}, también es una práctica común usar títulos HTML (por ejemplo, {{htmlelement ("h1")}}, {{htmlelement ("h2")}}), y seccionar (por ejemplo, {{htmlelement ("section")}}), para estructurar formas complejas.</p>
+
+<p>Depende de ti, sobre todo, encontrar un estilo de codificación cómodo que dé como resultado formas con buena accesibilidad y usabilidad. Las secciones independientes con funciones diferentes deben estar contenidas en elementos {{htmlelement ("section")}} separados, con elementos {{htmlelement ("fieldset")}} para contener botones de opción.</p>
+
+<h3 id="Aprendizaje_activo_construir_una_estructura_de_formulario">Aprendizaje activo: construir una estructura de formulario</h3>
+
+<p>Pongamos en práctica estas ideas y creemos un formulario un poco más complicado: un formulario de pago. Este formulario contendrá una serie de tipos de control que quizás aún no comprendas. No te preocupes por esto por ahora; en el artículo siguiente descubrirás cómo funcionan (<a href="/es/docs/Learn/HTML/Forms/The_native_form_widgets">Los controles básicos de formulario originales</a>). Por ahora, lee con detenimiento las descripciones y sigue las instrucciones, y empieza a formarte una idea de qué elementos de delimitación se utilizan para estructurar el formulario y por qué.</p>
+
+<ol>
+ <li>Para comenzar, haz una copia local de nuestro <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">archivo de plantilla en blanco</a> y el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/payment-form.css">CSS de nuestro formulario de pago</a> en un nuevo directorio de tu ordenador.</li>
+ <li>Añade dentro del elemento HTML {{htmlelement ("head")}} la línea siguiente para aplicar el CSS al HTML:
+  <pre class="brush: html notranslate">&lt;link href="payment-form.css" rel="stylesheet"&gt;</pre>
+ </li>
+ <li>A continuación, añade el elemento externo {{htmlelement ("form")}} para crear tu formulario:
+  <pre class="brush: html notranslate">&lt;form&gt;
+
+&lt;/form&gt;</pre>
+ </li>
+ <li>Añade un encabezado y un párrafo dentro de las etiquetas <code>&lt;form&gt;</code>&gt; para informar a los usuarios cómo se marcan los campos obligatorios:
+  <pre class="brush: html notranslate">&lt;h1&gt;Forma de pago&lt;/h1&gt;
+&lt;p&gt;Los campos obligatorios van seguidos de &lt;strong&gt; &lt;abbr title = "required"&gt; * &lt;/abbr&gt; &lt;/strong&gt;.&lt;/p&gt;</pre>
+ </li>
+ <li>A continuación añadimos al formulario una sección de código más grande, justo debajo de nuestra entrada anterior. Aquí verás que delimitamos con un elemento {{htmlelement ("section")}} independiente los campos con la información de contacto. Además, hay un conjunto de dos botones de opción, cada uno de los cuales colocamos dentro de su elemento de lista ({{htmlelement ("li")}}) propio. También hay dos entradas de texto estándar {{htmlelement ("input")}} y sus elementos {{htmlelement ("label")}} asociados, cada uno anidado dentro de un elemento {{htmlelement ("p")}} y una entrada de texto para introducir una contraseña. Añade este código a tu formulario:
+  <pre class="brush: html notranslate">&lt;section&gt;
+    &lt;h2&gt;Información de contacto&lt;/h2&gt;
+    &lt;fieldset&gt;
+      &lt;legend&gt;Título&lt;/legend&gt;
+      &lt;ul&gt;
+          &lt;li&gt;
+            &lt;label for="title_1"&gt;
+              &lt;input type="radio" id="title_1" name="title" value="K" &gt;
+              Rey
+            &lt;/label&gt;
+          &lt;/li&gt;
+          &lt;li&gt;
+            &lt;label for="title_2"&gt;
+              &lt;input type="radio" id="title_2" name="title" value="Q"&gt;
+              Reina
+            &lt;/label&gt;
+          &lt;/li&gt;
+          &lt;li&gt;
+            &lt;label for="title_3"&gt;
+              &lt;input type="radio" id="title_3" name="title" value="J"&gt;
+              Bufón
+            &lt;/label&gt;
+          &lt;/li&gt;
+      &lt;/ul&gt;
+    &lt;/fieldset&gt;
+    &lt;p&gt;
+      &lt;label for="name"&gt;
+        &lt;span&gt;Nombre:&lt;/span&gt;
+        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
+      &lt;/label&gt;
+      &lt;input type="text" id="name" name="username"&gt;
+    &lt;/p&gt;
+    &lt;p&gt;
+      &lt;label for="mail"&gt;
+        &lt;Span&gt;Correo electrónico:&lt;/ span&gt;
+        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
+      &lt;/label&gt;
+      &lt;input type="email" id="mail" name="usermail"&gt;
+    &lt;/p&gt;
+    &lt;p&gt;
+      &lt;label for="pwd"&gt;
+        &lt;span&gt;Contraseña:&lt;/span&gt;
+        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
+      &lt;/label&gt;
+      &lt;input type="password" id="pwd" name="password"&gt;
+    &lt;/p&gt;
+&lt;/section&gt;</pre>
+ </li>
+ <li>La segunda <code>&lt;section&gt;</code> de nuestro formulario es la información de pago. Hay tres controles diferentes, junto con sus etiquetas, cada uno contenido dentro de un elemento <code>&lt;p&gt;</code>. El primero es un menú desplegable ({{htmlelement ("select")}}) para seleccionar el tipo de tarjeta de crédito. El segundo es un elemento <code>&lt;input&gt;</code> de tipo <code>tel</code>, para introducir un número de tarjeta de crédito. Si bien podríamos haber usado el tipo <code>number</code>, no queremos una interfaz de usuario con control de número. El último es un elemento <code>&lt;input&gt;</code> de tipo <code>date</code>, para introducir la fecha de caducidad de la tarjeta; aparecerá como un control de selección de fecha en navegadores compatibles, y como una entrada de texto normal en navegadores no compatibles. Estos tipos de entrada más nuevos volverán a aparecer en el artículo <a href="/en-US/docs/Learn/Forms/HTML5_input_types">Tipos de entrada HTML5</a>.<br>
+  <br>
+  Introduce los datos siguientes a continuación de la sección anterior:
+  <pre class="brush: html notranslate">&lt;section&gt;
+    &lt;h2&gt;Información de pago&lt;/h2&gt;
+    &lt;p&gt;
+      &lt;label for="card"&gt;
+        &lt;span&gt;Tipo de tarjeta:&lt;/span&gt;
+      &lt;/label&gt;
+      &lt;select id="card" name="usercard"&gt;
+        &lt;option value="visa"&gt;Visa&lt;/option&gt;
+        &lt;option value="mc"&gt;Mastercard&lt;/option&gt;
+        &lt;option value="amex"&gt;American Express&lt;/option&gt;
+      &lt;/select&gt;
+    &lt;/p&gt;
+    &lt;p&gt;
+      &lt;label for="number"&gt;
+        &lt;span&gt;Número de tarjeta:&lt;/span&gt;
+        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
+      &lt;/label&gt;
+      &lt;input type="tel" id="number" name="cardnumber"&gt;
+    &lt;/p&gt;
+    &lt;p&gt;
+      &lt;label for="date"&gt;
+        &lt;span&gt;Fecha de caducidad:&lt;/span&gt;
+        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
+        &lt;em&gt;el formato mm/aa&lt;/em&gt;
+      &lt;/label&gt;
+      &lt;input type="date" id="date" name="expiration"&gt;
+    &lt;/p&gt;
+&lt;/section&gt;</pre>
+ </li>
+ <li>La última sección que añadimos es mucho más simple y contiene solo un {{htmlelement ("button")}} de tipo <code>submit</code>, para enviar los datos del formulario. Añádelo al final de tu formulario:
+  <pre class="brush: html notranslate">&lt;p&gt; &lt;button type="submit"&gt;Validar el pago&lt;/button&gt; &lt;/p&gt;</pre>
+ </li>
+</ol>
+
+<p>Debajo puedes ver en acción el formulario terminado (también lo encontrarás en GitHub; consulta el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/payment-form.html">código fuente</a> de nuestro payment-form.html y <a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/payment-form.html">ejecútalo en vivo</a>):</p>
+
+<p>{{EmbedLiveSample("A_payment_form","100%",620, "", "/en-US/Learn/Forms/How_to_structure_a_web_form/Example")}}</p>
+
+<h2 id="¡Prueba_tus_habilidades!">¡Prueba tus habilidades!</h2>
+
+<p>Has llegado al final de este artículo pero ¿puedes recordar la información más importante? Puedes encontrar pruebas adicionales para comprobar que has comprendido la información antes de continuar — visita <a class="external external-icon" href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Forms/Test_your_skills:_Form_structure" rel="noopener">Prueba tus habilidades: Estructura de formularios</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Ahora tienes todos los conocimientos necesarios para estructurar adecuadamente tus formularios web. Expondremos muchas de las características que se presentan aquí en los artículos siguientes, y el próximo artículo analizará con más detalle el uso de todos los diferentes tipos de controles de formulario que vas a querer usar para recopilar la información de tus usuarios.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="http://www.alistapart.com/articles/sensibleforms/" rel="external" title="http://www.alistapart.com/articles/sensibleforms/">A List Apart: <em>Sensible Forms: A Form Usability Checklist</em></a></li>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Tu primer formulario HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">Los controles básicos de formulario originales</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/HTML5_input_types">Tipos de entrada HTML5</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Additional_form_controls">Controles de formulario adicionales</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/UI_pseudo-classes">Pseudoclasses UI</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Aplicar estilo a formularios HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Validación de datos en un formulario</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
+</ul>
+
+<h3 id="Temas_avanzados">Temas avanzados</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Enviar formularios con JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">Cómo crear controles de formulario personalizados</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">Formularios HTML en navegadores antiguos</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Cuestiones avanzadas de aplicación de estilo para formularios HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de los controles de formulario</a> según su código propietario</li>
+</ul>
diff --git a/files/es/learn/forms/html5_input_types/index.html b/files/es/learn/forms/html5_input_types/index.html
new file mode 100644
index 0000000000..7c62230c33
--- /dev/null
+++ b/files/es/learn/forms/html5_input_types/index.html
@@ -0,0 +1,277 @@
+---
+title: Tipos de input de HTML5
+slug: Learn/Forms/HTML5_input_types
+translation_of: Learn/Forms/HTML5_input_types
+original_slug: Learn/HTML/Forms/Tipos_input_HTML5
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Forms/Basic_native_form_controls", "Learn/Forms/Other_form_controls", "Learn/Forms")}}</div>
+
+<p class="summary">En el <a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">artículo anterior</a> vimos el elemento {{htmlelement("input")}} y los valores de su atributo <code>type</code>, disponibles desde los inicios de HTML. Ahora veremos en detalle la funcionalidad de los controles de formulario más recientes, incluyendo algunos tipos de input nuevos, los cuales fueron añadidos en HTML5 para permitir la recolección de tipos de datos específicos</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Requisitos previos:</th>
+   <td>Formación básica en informática, y una <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">comprensión básica de HTML</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Entender los valores de tipo input disponibles más recientes para crear controles de formulario nativos, y cómo implementarlos utilizando HTML.</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: La mayoría de las características discutidas en este artículo tienen un amplio soporte en todos los navegadores, anotaremos cualquier excepción. Si quieres más detalles referente al soporte de navegadores, deberías consultar nuestra <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Forms">referéncia de elementos de formulario HTML</a>, y en particular nuestra referéncia extensiva de <a href="/en-US/docs/Web/HTML/Element/input">Tipos de &lt;input&gt;</a>.</p>
+</div>
+
+<p>Debido a que la apariéncia de un control de formulario puede ser algo distinta con respecto a unas especificaciones del diseñador, los desarrolladores web a veces construyen sus propios controles de formulario personalizados. Cubrimos este aspecto en un tutorial avanzado: <a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_widgets">Cómo construir widgets de formulario personalizados</a>.</p>
+
+<h2 id="Campo_de_dirección_de_correo_electrónico">Campo de dirección de correo electrónico</h2>
+
+<p>Este tipo de campo se define utilizando el valor  <code>email</code> en el atributo {{htmlattrxref("type","input")}} del elemento &lt;input&gt;:</p>
+
+<pre class="brush: html notranslate">&lt;input type="email" id="email" name="email"&gt;</pre>
+
+<p>Cuando se utiliza este valor {{htmlattrxref("type","input")}} , se le obliga al usuario a escribir dentro del campo una dirección de correo electrónico válida. Cualquier otro contenido ocasiona que el navegador muestre un mensaje de error cuando se envía el formulario. Puedes verlo en acción en la siguiente captura de pantalla</p>
+
+<p><img alt='An invalid email input showing the message "Please enter an email address."' src="https://mdn.mozillademos.org/files/17027/email_address_invalid.png" style="display: block; height: 224px; margin: 0 auto; width: 369px;"></p>
+
+<p>Puedes utilizar también el atributo <a href="/en-US/docs/Web/HTML/Attributes/multiple"><code>multiple</code></a> en combinación con el tipo input<code>email</code> para permitir que sean introducidas varias direcciones de correo electrónico separadas por comas en el mismo input:</p>
+
+<pre class="brush: html notranslate">&lt;input type="email" id="email" name="email" multiple&gt;</pre>
+
+<p>En algunos dispositivos, en particular dispositivos táctiles con teclados dinámicos como los smart phones, debería presentarse un teclado virtual que es más adecuado para introducir direcciones de correo electrónico, incluyendo la tecla <code>@</code>. Mira como ejemplo la siguiente captura de pantalla del teclado de Firefox para Android:</p>
+
+<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17054/fx-android-email-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 324px; margin: 0 auto; width: 400px;"></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes encontrar ejemplos sobre los tipos de entrada de texto básicos en <a href="https://mdn.github.io/learning-area/html/forms/basic-input-examples/">Ejemplos input básicos</a> (Consulta también el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/basic-input-examples/index.html">código fuente</a>).</p>
+</div>
+
+<p>Mejorar la experiéncia del usuario para usuarios con estos dispositivos, es otra buena razón para utilizar estos tipos de input más recientes.</p>
+
+<h3 id="Validación_del_lado_cliente">Validación del lado cliente</h3>
+
+<p>Como puedes haber visto anteriormente, <code>email</code>, junto con otros tipos de <code>input</code> más recientes, proporciona la validación de errores <em>en el lado cliente</em> de forma predeterminada, realizados por el navegador antes de que los datos obtenidos se envíen al servidor. <em>Es</em> una ayuda útil guiar a los usuarios a rellenar un formulario de forma precisa y puede ahorrar tiempo: es útil saber de inmediato que tu dato no es correcto, en vez de tener que esperar el viaje de ida y vuelta al servidor.</p>
+
+<p>Pero <em>no debería ser considerado</em> una medida de seguridad exhaustiva! Tus aplicaciones siempre deben realizar comprobaciones de seguridad en cada dato, tanto en el <em>lado servidor</em> como en el lado cliente debido a que la validación en el lado cliente es muy fácil desactivarla, por lo que usuarios malintencionados pueden enviar fácilmente datos incorrectos al servidor. Lee <a href="/en-US/docs/Learn/Server-side/First_steps/Website_security">Seguridad en el sitio web</a> para tener una idea de lo que <em>podría</em> ocurrir; Implementar validación en el lado servidor está más allá del alcance de este módulo-guía, pero debería tenerlo en cuenta.</p>
+
+<p>Ten en cuenta que <code>a@b</code> es una dirección de correo electrónico válida de acuerdo a las restricciones proporcionadaas por defecto. Esto es debido a que el tipo de input <code>email</code>, permite por defecto direcciones de correo electrónico de una intranet. Para implementar un comportamiento diferente de validación puedes utilizar el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/pattern">pattern</a></code>, y también puedes utilizar mensajes de error personalizados; Hablaremos de cómo utilizar estas características en <a href="/en-US/docs/Learn/Forms/Form_validation">Validación de formularios en el lado cliente</a> en un artículo posterior.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si los datos introducidos no son una dirección de correo electrónico, habrá coincidéncia con la pseudo clase {{cssxref(':invalid')}}, y la propiedad {{domxref('validityState.typeMismatch')}} devolverá <code>true</code>.</p>
+</div>
+
+<h2 id="Campo_de_búsqueda">Campo de búsqueda</h2>
+
+<p>Los campos de búsqueda están destinados a ser utilizados para crear cajas de búsqueda en páginas y aplicaciones. Este tipo de campo se define utilizando el valor <code>search</code> en su atributo {{htmlattrxref("type","input")}}:</p>
+
+<pre class="brush: html notranslate">&lt;input type="search" id="search" name="search"&gt;</pre>
+
+<p>La diferéncia principal entre un campo <code>text</code> y un campo <code>search</code>, es la forma en que el navegador aplica estilo a su apariéncia. A menudo los campos <code>search</code> se muestran con bordes redondeados; y a veces también muestran una "Ⓧ", el cual despeja el campo de cualquier valor cuando se pulsa sobre él. Adicionalmente, en dispositivos con teclado dinámico, la tecla enter del teclado puede leer "<strong>search</strong>" o mostrar un icono de lupa.</p>
+
+<p>La captura de pantalla siguiente muestra un campo de búsqueda con contenido, en Firefox 71, Safari 13, y Chrome 79 en macOS, y Edge 18 y Chrome 79 en Windows 10. Ten en cuenta que el icono de reseteo sólo aparece si el campo tiene un valor y, aparte de Safari, sólo se muestra cuando el campo tiene el foco.</p>
+
+<p><img alt="Screenshots of search fields on several platforms." src="https://mdn.mozillademos.org/files/17028/search_focus.png" style="height: 179px; width: 549px;"></p>
+
+<p>Otra característica que vale la pena señalar es que se puede guardar los valores de un campo <code>search</code> automáticamente y reutilizarse en múltiples páginas del mismo sitio web para ofrecer autocompletado. Esta característica suele ocurrir de forma automática en la mayoría de navegadores modernos.</p>
+
+<h2 id="Campo_número_de_teléfono">Campo número de teléfono</h2>
+
+<p>Se puede crear un campo especial para introducir números de teléfono utilizando <code>tel</code> como valor del atributo {{htmlattrxref("type","input")}}:</p>
+
+<pre class="brush: html notranslate">&lt;input type="tel" id="tel" name="tel"&gt;</pre>
+
+<p>Cuando se accede desde un dispositivo táctil con teclados dinámicos, muchos de ellos mostrarán un teclado numérico cuando se encuentren con <code>type="tel"</code>, lo que significa que este tipo es útil no sólo para ser utilizado para números de teléfono, sino también cuando sea útil un teclado numérico.</p>
+
+<p>La siguiente captura de pantalla del teclado de Firefox para Android proporciona un ejemplo:</p>
+
+<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17056/fx-android-tel-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 276px; margin: 0px auto; width: 400px;"></p>
+
+<p>Debido a la gran variedad de formatos de número de teléfono existentes, este tipo de campo no cumple con ningún tipo de restricción sobre el valor introducido por el usuario. (Esto significa que puede incluir letras, etc...).</p>
+
+<p>Como mencionamos anteriormente, se puede utilizar el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/pattern">pattern</a></code> para que asuma restricciones, sobre el cuál aprenderemos en <a href="/en-US/docs/Learn/Forms/Form_validation">Validación de formulario en el lado cliente</a>.</p>
+
+<h2 id="Campo_URL">Campo URL</h2>
+
+<p>Se puede crear un tipo especial de campo para introducir URLs utilizando el valor <code>url</code> para el atributo {{htmlattrxref("type","input")}}:</p>
+
+<pre class="brush: html notranslate">&lt;input type="url" id="url" name="url"&gt;</pre>
+
+<p>Este tipo añade restricciones de validación en el campo. El navegador informará de un error si no se introdujo el protocolo (como <code>http:</code>), o si de algún modo el URL está mal formado. En dispositivos con teclados dinámicos a menudo mostrará por defecto algunas o todas las teclas como los dos puntos, el punto, y la barra inclinada.</p>
+
+<p>Mira el siguiente ejemplo tomado de Firefox para Android:</p>
+
+<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17057/fx-android-url-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 325px; margin: 0px auto; width: 400px;"></p>
+
+<div class="note"><strong>Nota:</strong> Solo porque el URL esté bien formado no significa necesariamente que la dirección al que hace referéncia exista!</div>
+
+<h2 id="Campo_numérico">Campo numérico</h2>
+
+<p>Se pueden crear controles para introducir números con el {{htmlattrxref("type","input")}} <code>number</code> de {{HTMLElement("input")}}. Este control se parece a un campo de texto pero solo permite números de punto flotante, y normalmente proporciona botones deslizadores para incrementar o reducir el valor del control. En dispositivos con teclados dinámicos generalmente se muestra el teclado numérico.</p>
+
+<p>La siguiente captura de pantalla tomada de Firefox para Android proporciona un ejemplo:</p>
+
+<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17055/fx-android-number-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 275px; margin: 0px auto; width: 400px;"></p>
+
+<p>Con el tipo de input <code>number</code>  puedes limitar los valores mínimo y máximo permitidos definiendo los atributos {{htmlattrxref("min","input")}} y  {{htmlattrxref("max","input")}}.</p>
+
+<p>También puedes utilizar el atributo <code>step</code> para cambiar el incremento y decremento causado por los botones deslizadores. Por defecto, el tipo de input number sólo valida si el número es un entero. Para permitir números decimales, especifica <code><a href="/en-US/docs/Web/HTML/Attributes/step">step="any"</a></code>. Si se omite, su valor por defecto es <code>1</code>, lo que significa que solo son válidos números enteros.</p>
+
+<p>Miremos algunos ejemplos. El primero de los siguientes crea un control numérico cuyo valor está restringido a cualquier valor entre <code>1</code> y <code>10</code>, y sus botones cambian su valor en incrementos o decrementos de <code>2</code>.</p>
+
+<pre class="brush: html notranslate">&lt;input type="number" name="age" id="age" min="1" max="10" step="2"&gt;</pre>
+
+<p>El segundo crea un control numérico cuyo valor está restringido a cualquier valor entre el <code>0</code> y <code>1</code> ambos inclusive, y sus botones cambian su valor en incrementos o decrementos de <code>0.01</code>.</p>
+
+<pre class="brush: html notranslate">&lt;input type="number" name="change" id="pennies" min="0" max="1" step="0.01"&gt;</pre>
+
+<p>El tipo de input <code>number</code> tiene sentido cuando esté limitado el rango de valores válidos, por ejemplo la edad de una persona o su altura. Si el rango es demasiado grande para que los cambios de incremento tengan sentido ( por ejemplo los códigos postales de USA, cuyo rango va de <code>00001</code> a <code>99999</code>), entonces sería una mejor opción utilizar el tipo <code>tel</code>: proporciona el teclado numérico mientras que omite el componente de interfaz de usuario de los deslizadores de número.</p>
+
+<div class="blockIndicator note">
+<p><strong>Ten en cuenta que</strong>: En versiones inferiores a la 10 de Internet Explorer no se soportan las entradas <code>number</code></p>
+</div>
+
+<h2 id="Slider_controls">Slider controls</h2>
+
+<p>Otra forma de tomar un número es usando un <strong>slider</strong>. Podrás observar cómo son bastantes parecidas a los sitios inmobiliarios, dónde quieres determinar un máximo de precio por propiedad y filtrar tu búsqueda en el. Observaremos un ejemplo en vivo.</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/range-example/index.html", '100%', 200)}}</p>
+
+<p>Usage-wise, sliders are less accurate than text fields. Therefore, they are used to pick a number whose <em>precise</em> value is not necessarily important.</p>
+
+<p>A slider is created using the {{HTMLElement("input")}} with its {{htmlattrxref("type","input")}} attribute set to the value <code>range</code>. The slider-thumb can be moved via mouse or touch, or with the arrows of the keypad.</p>
+
+<p>It's important to properly configure your slider. To that end, it's highly recommended that you set the <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code>, <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code>, and <code><a href="/en-US/docs/Web/HTML/Attributes/step">step</a></code> attributes which set the minimum, maximum and increment values, respectively.</p>
+
+<p>Let's look at the code behind the above example, so you can see how its done. First of all, the basic HTML:</p>
+
+<pre class="brush: html notranslate">&lt;label for="price"&gt;Choose a maximum house price: &lt;/label&gt;
+&lt;input type="range" name="price" id="price" min="50000" max="500000" step="100" value="250000"&gt;
+&lt;output class="price-output" for="price"&gt;&lt;/output&gt;</pre>
+
+<p>This example creates a slider whose value may range between <code>50000</code> and <code>500000</code>, which increments/decrements by 100 at a time. We've given it default value of <code>250000</code>, using the <code>value</code> attribute.</p>
+
+<p>One problem with sliders is that they don't offer any kind of visual feedback as to what the current value is. This is why we've included an {{htmlelement("output")}} element — to contain the current value (we'll also look at this element in the next article). You could display an input value or the output of a calculation inside any element, but <code>&lt;output&gt;</code> is special — like <code>&lt;label&gt;</code>, it can take a <code>for</code> attribute that allows you to associate it with the element or elements that the output value came from.</p>
+
+<p>To actually display the current value, and update it as it changed, you must use JavaScript, but this is relatively easy to do:</p>
+
+<pre class="brush: js notranslate">const price = document.querySelector('#price')
+const output = document.querySelector('.price-output')
+
+output.textContent = price.value
+
+price.addEventListener('input', function() {
+  output.textContent = price.value
+});</pre>
+
+<p>Here we store references to the <code>range</code> input and the <code>output</code> in two variables. Then we immediately set the <code>output</code>'s <code><a href="/en-US/docs/Web/API/Node/textContent">textContent</a></code> to the current <code>value</code> of the input. Finally, an event listener is set to ensure that whenever the range slider is moved, the <code>output</code>'s <code>textContent</code> is updated to the new value.</p>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: <code>range</code> inputs are not supported in versions of Internet Explorer below 10.</p>
+</div>
+
+<h2 id="Date_and_time_pickers">Date and time pickers</h2>
+
+<p>Gathering date and time values has traditionally been a nightmare for web developers. For good user experience, it is important to provide a calendar selection UI, enabling users to select dates without necessating context switching to a native calendar application or potentially entering them in differing formats that are hard to parse. The last minute of the previous millenium can be expressed in the following different ways, for example: 1999/12/31, 23:59 or 12/31/99T11:59PM.</p>
+
+<p>HTML date controls are available to handle this specific kind of data, providing calendar widgets and making the data uniform.</p>
+
+<p>A date and time control is created using the {{HTMLElement("input")}} element and an appropriate value for the {{htmlattrxref("type","input")}} attribute, depending on whether you wish to collect dates, times, or both. Here's a live example that falls back to {{htmlelement("select")}} elements in non-supporting browsers:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/datetime-local-picker-fallback/index.html", '100%', 200)}}</p>
+
+<p>Let's look at the different available types in brief. Note that the usage of these types is quite complex, especially considering browser support (see below); to find out the full details, follow the links below to the reference pages for each type, including detailed examples.</p>
+
+<h3 id="datetime-local"><code>datetime-local</code></h3>
+
+<p><code><a href="/en-US/docs/Web/HTML/Element/input/datetime-local">&lt;input type="datetime-local"&gt;</a></code> creates a widget to display and pick a date with time with no specific time zone information.</p>
+
+<pre class="brush: html notranslate">&lt;input type="datetime-local" name="datetime" id="datetime"&gt;</pre>
+
+<h3 id="month"><code>month</code></h3>
+
+<p><code><a href="/en-US/docs/Web/HTML/Element/input/month">&lt;input type="month"&gt;</a></code> creates a widget to display and pick a month with a year.</p>
+
+<pre class="brush: html notranslate">&lt;input type="month" name="month" id="month"&gt;</pre>
+
+<h3 id="time"><code>time</code></h3>
+
+<p><code><a href="/en-US/docs/Web/HTML/Element/input/time">&lt;input type="time"&gt;</a></code> creates a widget to display and pick a time value. While time may <em>display</em> in 12-hour format, the <em>value returned</em> is in 24-hour format.</p>
+
+<pre class="brush: html notranslate">&lt;input type="time" name="time" id="time"&gt;</pre>
+
+<h3 id="week"><code>week</code></h3>
+
+<p><code><a href="/en-US/docs/Web/HTML/Element/input/week">&lt;input type="week"&gt;</a></code> creates a widget to display and pick a week number and its year.</p>
+
+<p>Weeks start on Monday and run to Sunday. Additionally, the first week 1 of each year contains the first Thursday of that year—which may not include the first day of the year, or may include the last few days of the previous year.</p>
+
+<pre class="brush: html notranslate">&lt;input type="week" name="week" id="week"&gt;</pre>
+
+<h3 id="Constraining_datetime_values">Constraining date/time values</h3>
+
+<p>All date and time controls can be constrained using the <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code> and <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code> attributes, with further constraining possible via the <code><a href="/en-US/docs/Web/HTML/Attributes/step">step</a></code> attribute (whose value varies according to input type).</p>
+
+<pre class="brush: html notranslate">&lt;label for="myDate"&gt;When are you available this summer?&lt;/label&gt;
+&lt;input type="date" name="myDate" min="2013-06-01" max="2013-08-31" step="7" id="myDate"&gt;</pre>
+
+<h3 id="Browser_support_for_datetime_inputs">Browser support for date/time inputs</h3>
+
+<p>You should be warned that the date and time widgets don't have the best browser support. At the moment, Chrome, Edge, and Opera support them well, but there is no support in Internet Explorer, Safari has some mobile support (but no desktop support), and Firefox supports <code>time</code> and <code>date</code> only.</p>
+
+<p>The reference pages linked to above provide suggestions on how to program fallbacks for non-supporting browsers; another option is to consider using a JavaScript library to provide a date picker. Most modern frameworks have good components available to provide this functionality, and there are standalone libraries available to (see <a href="https://flatlogic.com/blog/best-javascript-date-picker-libraries/">Top date picker javascript plugins and libraries</a> for some suggestions).</p>
+
+<h2 id="Color_picker_control">Color picker control</h2>
+
+<p>Colors are always a bit difficult to handle. There are many ways to express them: RGB values (decimal or hexadecimal), HSL values, keywords, etc.</p>
+
+<p>A <code>color</code> control can be created using the {{HTMLElement("input")}} element with its {{htmlattrxref("type","input")}} attribute set to the value <code>color</code>:</p>
+
+<pre class="brush: html notranslate">&lt;input type="color" name="color" id="color"&gt;</pre>
+
+<p>When supported, clicking a color control will tend to display the operating system's default color picking functionality for you to actually make your choice with. The following screenshot taken on Firefox for macOS provides an example:</p>
+
+<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17058/fx-macos-color.jpg" style="border-style: solid; border-width: 1px; display: block; height: 412px; margin: 0px auto; width: 700px;"></p>
+
+<p>And here is a live example for you to try out:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/color-example/index.html", '100%', 200)}}</p>
+
+<p>The value returned is always a lowercase 6-value hexidecimal color.</p>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: <code>color</code> inputs are not supported in Internet Explorer.</p>
+</div>
+
+<h2 id="Summary">Summary</h2>
+
+<p>That brings us to the end of our tour of the HTML5 form input types. There are a few other control types that cannot be easily grouped together due to their very specific behaviors, but which are still essential to know about. We cover those in the next article.</p>
+
+<p>{{PreviousMenuNext("Learn/Forms/Basic_native_form_controls", "Learn/Forms/Other_form_controls", "Learn/Forms")}}</p>
+
+<h2 id="In_this_module">In this module</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Forms/Your_first_form">Your first form</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/How_to_structure_a_web_form">How to structure a web form</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">Basic native form controls</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/HTML5_input_types">The HTML5 input types</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Other_form_controls">Other form controls</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Styling_web_forms">Styling web forms</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Advanced form styling</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/UI_pseudo-classes">UI pseudo-classes</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Form_validation">Client-side form validation</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">Sending form data</a></li>
+</ul>
+
+<h3 id="Advanced_Topics">Advanced Topics</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_controls">How to build custom form controls</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Sending_forms_through_JavaScript">Sending forms through JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Property_compatibility_table_for_form_widgets">Property compatibility table for form widgets</a></li>
+</ul>
diff --git a/files/es/learn/forms/index.html b/files/es/learn/forms/index.html
new file mode 100644
index 0000000000..6413d9490a
--- /dev/null
+++ b/files/es/learn/forms/index.html
@@ -0,0 +1,119 @@
+---
+title: Formularios en HTML5
+slug: Learn/Forms
+tags:
+  - Forms
+  - HTML
+  - HTML5
+original_slug: HTML/HTML5/Forms_in_HTML5
+---
+<p>{{ gecko_minversion_header("2") }}</p>
+
+<p>Los elementos y atributos para formularios en HTML5 proveen un mayor grado de marcado semántico que en HTML4 y eliminan gran parte del tedioso trabajo de programar y diseñar que se necesitaba en HTML4. Las funcionalidades de los formularios en HTML5 brindan una experiencia mejor para los usuarios al permitir que los formularios tengan un comportamiento más consistente entre diferentes sitios web y al darle una devolución inmediata acerca de la información ingresada. También proveen esta experiencia a los usuarios que han deshabilitado javascript en sus navegadores.</p>
+
+<p>Este documento describe los elementos nuevos o que han cambiado que están disponibles en Gecko/Firefox.</p>
+
+<h3 id="El_elemento_&lt;input>">El elemento <code>&lt;input&gt;</code></h3>
+
+<p>El elemento <code>{{ HTMLElement("input") }}</code> tiene nuevos valores para el atributo {{ htmlattrxref("type", "input") }}.</p>
+
+<ul>
+ <li><span style="font-family: courier new;">search</span>: El elemento representa una caja de búsqueda. Los saltos de línea son quitados del valor ingresado pero no se modifica ninguna otra sintaxis.</li>
+ <li><span style="font-family: courier new;">tel</span>: El elemento representa un control para editar un número de teléfono, porque los números teléfonicos varían ampliamente en el mundo. Puedes usar atributos como {{ htmlattrxref("pattern", "input") }} y {{ htmlattrxref("maxlength", "input") }} para restringir los valores ingresados en la caja.</li>
+ <li><span style="font-family: courier new;">url</span>: El elemento representa un control para editar una <a class="external" href="http://es.wikipedia.org/URL" title="http://es.wikipedia.org/URL">URL</a>. Se quitan los saltos de línea y espacios en blanco antes y después del valor ingresados.</li>
+ <li>
+  <p><span style="font-family: courier new;">email</span>: El elemento representa una dirección de correo electrónico. Los saltos de línea se quitan automáticamente del valor ingresado. Puede ingresarse una direccón de correo no válida, pero el campo de ingreso sólo funcionará si la dirección ingresada satisface la producción ABNF <span style="font-family: courier new;"><code><code title="">1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )</code></code></span> donde <code title="">atext</code> está definida en RFC 5322, sección 3.2.3 y <code title="">ldh-str</code> está definida en RFC 1034, sección 3.5.</p>
+
+  <div class="note">Nota: si el atributo {{ htmlattrxref("multiple", "input") }} está agregado, pueden ingresarse muchas direcciones de correo electrónico en ese campo {{ HTMLElement("input") }}, como una lista separada por espacios, pero no está implementado actualmente en Firefox.</div>
+ </li>
+</ul>
+
+<p>El elemento {{ HTMLElement("input") }} también tiene nuevos atributos:</p>
+
+<ul>
+ <li>{{ htmlattrxref("list", "input") }}: El ID de un elemento {{ HTMLElement("datalist") }} cuyo contenido, los elementos {{ HTMLElement("option") }}, van a ser usados como ayudas y serán mostrados como propuestas en el área de sugerencias del campo input.</li>
+ <li>{{ htmlattrxref("pattern", "input") }}: Una expresión regular contra la que es verificado el valor del control, que puede ser usada con valores de {{ htmlattrxref("type", "input") }} de <code>text</code>, <code>tel</code>, <code>search</code>, <code>url</code> y <code>email</code>.</li>
+ <li>{{ htmlattrxref("formmethod", "input") }}: Una cadena que indica qué método HTTP (GET, POST, PUT o DELETE) debe ser usado cuando se envía; sobrescribe el {{ htmlattrxref("method", "form") }} del elemento {{ HTMLElement("form") }}, si se define. El {{ htmlattrxref("formmethod", "input") }} sólo se aplica cuando el {{ htmlattrxref("type", "input") }} es <span style="font-family: courier new;">image</span> o <span style="font-family: courier new;">submit</span>, y, para los métodos PUT y DELETE, sólo funcionará con un destino que esté en el mismo dominio (política del mismo origen).</li>
+</ul>
+
+<h3 id="El_elemento_&lt;form>">El elemento <code>&lt;form&gt;</code></h3>
+
+<p>El elemento {{ HTMLElement("form") }} tiene un nuevo atributo:</p>
+
+<ul>
+ <li>{{ htmlattrxref("novalidate", "form") }}: Este atributo previene que el formulario sea validado antes del envío.</li>
+</ul>
+
+<h3 id="El_elemento_&lt;datalist>">El elemento <code>&lt;datalist&gt; </code></h3>
+
+<p>El elemento {{ HTMLElement("datalist") }} representa la lista de elementos {{ HTMLElement("option") }} como sugerencias cuando se llena un campo {{ HTMLElement("input") }}.</p>
+
+<p>Puedes usar el atributo {{ htmlattrxref("list", "input") }} en un elemento {{ HTMLElement("input") }} para enlazar a un campo de ingreso específico con un elemento {{ HTMLElement("datalist") }} determinado.</p>
+
+<pre>&lt;label&gt;Superhéroe favorito&lt;/label&gt;
+&lt;input list="superheroes" name="list" /&gt;
+&lt;datalist id="superheroes"&gt;
+    &lt;option label="Iron Man" value="Iron Man"&gt;
+    &lt;option label="The Hulk" value="The Hulk"&gt;
+&lt;/datalist&gt;
+</pre>
+
+<h3 id="El_elemento_&lt;output>">El elemento <code>&lt;output&gt;</code></h3>
+
+<p>El elemento <code>{{ HTMLElement("output") }}</code> representa el resultado de un cálculo.</p>
+
+<p>Puedes usar el atributo {{ htmlattrxref("for", "output") }} para especificar una relación entre el elemento output y otros elementos en el documento que afectan el cálculo (por ejemplo, ingreso de datos o parámetros). El valor del atributo {{ htmlattrxref("for", "output") }} es una lista separada por espacios de IDs de otros elementos.</p>
+
+<h3 id="El_atributo_placeholder">El atributo placeholder</h3>
+
+<p>El atributo {{ htmlattrxref("placeholder", "input") }} en elementos <code>{{ HTMLElement("input") }}</code> y <code>{{ HTMLElement("textarea") }}</code> provee una ayuda a los usuarios acerca de qué debe ser ingresado en el campo. El texto introducido en el placeholder no debe contener «enters» o saltos de línea.</p>
+
+<pre>&lt;input type="email" id="user-email" placeholder="e.g. john.doe@mozilla.com" required/&gt;
+</pre>
+
+<h3 id="El_atributo_autofocus">El atributo autofocus</h3>
+
+<p>El atributo <strong>autofocus</strong> te permite especificar que una parte del formulario debe tener foco para ingresar información cuando se carga la página, a menos que el usuario lo cambie, por ejemplo al escribir en otro lugar. Sólo un elemento del formulario en un documento puede tener el atributo <strong>autofocus</strong>, que es de tipo boolean. Este atributo puede ser aplicado a los elementos <code>{{ HTMLElement("input") }}</code>, <code>{{ HTMLElement("button") }}</code>, <code>{{ HTMLElement("select") }}</code> y <code>{{ HTMLElement("textarea") }}</code>. La excepción es que <strong>autofocus</strong> no puede ser aplicado a un elemento <code>&lt;input&gt;</code> si el atributo {{ htmlattrxref("type", "input") }} <code>hidden</code> está seleccionado (esto quiere decir, no se puede enfocar automáticamente un elemento escondido).</p>
+
+<pre>&lt;input type="text" id="user" autofocus /&gt;
+</pre>
+
+<h3 id="La_propiedad_label.control_del_DOM">La propiedad label.control del DOM</h3>
+
+<p>La interface <a href="/en/DOM/HTMLLabelElement" title="en/DOM/HTMLLabelElement">HTMLLabelElement</a> DOM brinda una propiedad extra, sumadas a las propiedades que corresponden a los atributos del elemento <code>{{ HTMLElement("label") }}</code> de HTML. La propiedad <strong>control</strong> devuelve el controlador etiquetado, es decir el controlador para quien está hecha la etiqueta, que está determinado por el atributo {{ htmlattrxref("for", "label") }} (si está definido) o por el primer elemento controlador descendiente.</p>
+
+<h3 id="Validación_restringida">Validación restringida</h3>
+
+<p>El HTML5 brinda sintaxis y elementos de API para posibilitar la validación de formularios del lado del cliente. Aunque esta funcionalidad no reemplaza la validación del lado del servidor, que todavía es necesaria por seguridad e integridad de la información, la validación del lado del cliente puede brindar una experiencia de usuario mejor al darle al usuario una respuesta inmediata acerca de la información ingresada.</p>
+
+<h4 id="Sintaxis_de_HTML_para_la_validación_restringida">Sintaxis de HTML para la validación restringida</h4>
+
+<p>Los siguientes elementos de sintaxis de HTML5 pueden ser usados para restringir datos en el formulario.</p>
+
+<ul>
+ <li>El atributo {{ htmlattrxref("required", "input") }} en los elementos {{ HTMLElement("input") }}, {{ HTMLElement("select") }} y {{ HTMLElement("textarea") }} indica que se debe ingresar algún dato. (En el elemento {{ HTMLElement("input") }}, {{ htmlattrxref("required", "input") }} sólo se aplica con ciertos valores del atributo {{ htmlattrxref("type", "input") }}.)</li>
+ <li>El atributo {{ htmlattrxref("pattern", "input") }} en el elemento {{ HTMLElement("input") }} restringe el valor para que concuerde con una expresión regular específica.</li>
+ <li>Los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }} del elemento {{ HTMLElement("input") }} restringen los valores máximos y mínimos que pueden ser ingresados.</li>
+ <li>El atributo {{ htmlattrxref("step", "input") }} del elemento {{ HTMLElement("input") }} (cuando se usa en combinación con los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }}) restringe la granularidad de los valores ingresados. Un valor que no se corresponda con un valor permitido no será validado.</li>
+ <li>El atributo {{ htmlattrxref("maxlength", "input") }} de los elementos {{ HTMLElement("input") }} y {{ HTMLElement("textarea") }} restringe el máximo número de caracteres (en puntos de código unicode) que el usuario puede ingresar.</li>
+ <li>Los valores <code>url</code> y <code>email</code> para {{ htmlattrxref("type", "input") }} restringen el valor para una URL o dirección de correo válida respectivamente.</li>
+</ul>
+
+<p>Además, puedes prevenir la validación restringida especificando el atributo {{ htmlattrxref("novalidate", "form") }} en el elemento {{ HTMLElement("form") }}, o el atributo {{ htmlattrxref("formnovalidate", "button") }} en el elemento {{ HTMLElement("button") }} y en el elemento {{ HTMLElement("input") }} (cuando {{ htmlattrxref("type", "input") }} es <code>submit</code> o <code>image</code>). Estos atributos indican que el formulario no será validado cuando se envie.</p>
+
+<h4 id="API_de_validación_restringida">API de validación restringida</h4>
+
+<p>Las siguientes propiedades y métodos del DOM relacionadas con la validación restringida están disponibles para scripts del lado del cliente:</p>
+
+<ul>
+ <li>En objetos <a href="/en/DOM/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a>, el método <code>checkValidity()</code>, que devuelve verdadero si todos los elementos asociados del formulario que necesitan validación satisfacen las restricciones y falso si no lo hacen.</li>
+ <li>En <a href="/en/HTML/Content_categories#form-associated" title="en/HTML/Content Categories#form-associated">elementos asociados al formulario</a>:
+  <ul>
+   <li>la propiedad <code>willValidate</code>, que es falso si el elemento no satisface las restricciones.</li>
+   <li>la propiedad <code>validity</code>, que es un objeto <a href="/en/DOM/ValidityState_Interface" title="en/DOM/ValidityState Interface">ValidityState</a> que representa los estados de validación en que está el elemento (p.e., condiciones de restricción que han fallado o exitosas).</li>
+   <li>la propiedad <code>validationMessage</code>, que es un mensaje que contiene todas las fallas en las restricciones que pertenecen a ese elemento.</li>
+   <li>el método <code>checkValidity()</code>, que devuelve falso si el elemento falla en satisfacer alguna de las restricciones o verdadero si pasa lo contrario.</li>
+   <li>el método <code>setCustomValidity()</code>, que establece un mensaje de validación personalizado, permitiendo imponer y validad restricciones más allá de las que están predefinidas.</li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/learn/forms/property_compatibility_table_for_form_controls/index.html b/files/es/learn/forms/property_compatibility_table_for_form_controls/index.html
new file mode 100644
index 0000000000..a5c7202d69
--- /dev/null
+++ b/files/es/learn/forms/property_compatibility_table_for_form_controls/index.html
@@ -0,0 +1,2004 @@
+---
+title: Tabla de compatibilidad de propiedades CSS para controles de formulario
+slug: Learn/Forms/Property_compatibility_table_for_form_controls
+translation_of: Learn/Forms/Property_compatibility_table_for_form_controls
+original_slug: Learn/HTML/Forms/Property_compatibility_table_for_form_controls
+---
+<div>{{learnsidebar}}</div>
+
+<p class="summary">Las siguientes tablas de compatibilidad intentan resumir el estado del soporte de CSS para formularios HTML. Debido a la complejidad de los formularios CSS y HTML, estas tablas no se pueden considerar una referencia perfecta. Sin embargo, le darán una buena idea de lo que se puede y no se puede hacer, lo que le ayudará al aprender a hacer las cosas.</p>
+
+<h2 id="Cómo_leer_las_tablas">Cómo leer las tablas</h2>
+
+<h3 id="Valores">Valores</h3>
+
+<p>Para cada propiedad, hay cuatro valores posibles:</p>
+
+<dl>
+ <dt>Si</dt>
+ <dd>Existe un soporte razonablemente consistente para la propiedad en todos los navegadores. Es posible que aún enfrente efectos secundarios extraños en ciertos casos extremos.</dd>
+ <dt>Parcial</dt>
+ <dd>Si bien la propiedad funciona, con frecuencia puede enfrentar efectos secundarios extraños o inconsistencias. Probablemente debería evitar estas propiedades a menos que primero domine esos efectos secundarios.</dd>
+ <dt>No</dt>
+ <dd>La propiedad simplemente no funciona o es tan inconsistente que no es confiable.</dd>
+ <dt>n.a.</dt>
+ <dd>La propiedad no tiene ningún significado para este tipo de widget.</dd>
+</dl>
+
+<h3 id="Representación">Representación</h3>
+
+<p>Para cada propiedad hay dos representaciones posibles:</p>
+
+<dl>
+ <dt>N (Normal)</dt>
+ <dd>Indica que la propiedad se aplica tal cual</dd>
+ <dt>T (Retocada)</dt>
+ <dd>Indica que la propiedad se aplica con la regla adicional como se muestra a continuación:</dd>
+</dl>
+
+<pre class="brush: css notranslate">* {
+  /* Turn off the native look and feel */
+  -webkit-appearance: none;
+  appearance: none;
+
+/* for Internet Explorer */
+  background: none;
+}</pre>
+
+<h2 id="Tablas_de_compatibilidad">Tablas de compatibilidad</h2>
+
+<h3 id="Comportamientos_globales">Comportamientos globales</h3>
+
+<p>Algunos comportamientos son comunes a muchos navegadores a nivel global::</p>
+
+<dl>
+ <dt>{{cssxref("border")}}, {{cssxref("background")}}, {{cssxref("border-radius")}}, {{cssxref("height")}}</dt>
+ <dd>El uso de una de estas propiedades puede desactivar parcial o totalmente la apariencia nativa de los widgets en algunos navegadores. Tenga cuidado cuando los use.</dd>
+ <dt>{{cssxref("line-height")}}</dt>
+ <dd>Esta propiedad se admite de forma inconsistente en todos los navegadores y debe evitarla.</dd>
+ <dt>{{cssxref("text-decoration")}}</dt>
+ <dd>Esta propiedad no es compatible con el navegador Opera en widgets de formulario.</dd>
+ <dt>{{cssxref("text-overflow")}}</dt>
+ <dd>Opera, Safari, y IE9 no admiten esta propiedad en widgets de formulario.</dd>
+ <dt>{{cssxref("text-shadow")}}</dt>
+ <dd>Opera no admite {{cssxref("text-shadow")}} en widgets de formularios e IE9 no lo admite en absoluto.</dd>
+</dl>
+
+<h3 id="Text_fields">Text fields</h3>
+
+<p>See the <code>{{htmlelement("input/text", "text")}}</code>, <code>{{htmlelement("input/search", "search")}}</code>, and <code>{{htmlelement("input/password", "password")}}</code> input types.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields.</li>
+     <li>On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields.</li>
+     <li>On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields.</li>
+     <li>On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}<sup>[1]</sup></th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>If the {{cssxref("border-color")}} property is not set, some WebKit based browsers will apply the {{cssxref("color")}} property to the border as well as the font on <code>{{htmlelement("textarea")}}</code>s.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>See the note about {{cssxref("line-height")}}</td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td>See the note about Opera</td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 supports this property only on <code>{{htmlelement("textarea")}}</code>s, whereas Opera only supports it on single line text fields.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields. On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields. On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
+     <li>On Opera the {{cssxref("border-radius")}} property is applied only if an explicit border is set.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Buttons">Buttons</h3>
+
+<p>See the <code>{{htmlelement("input/button", "button")}}</code>,  <code>{{htmlelement("input/submit", "submit")}}</code>, and <code>{{htmlelement("input/reset", "reset")}}</code> input types and the <code>{{htmlelement("button")}}</code> element.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>This property is not applied on WebKit based browsers on Mac OSX or iOS.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>This property is not applied on WebKit based browsers on Mac OSX or iOS.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>See the note about {{cssxref("line-height")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>On Opera the {{cssxref("border-radius")}} property is applied only if an explicit border is set.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Number">Number</h3>
+
+<p>See the  <code>{{htmlelement("input/number", "number")}}</code> input type. There is no standard way to change the style of spinners used to change the value of the field, with the spinners on Safari being outside the field.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>On Opera, the spinners are zoomed in, which can hide the content of the field.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>On Opera, the spinners are zoomed in, which can hide the content of the field.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>See the note about {{cssxref("line-height")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td colspan="1" rowspan="3">
+    <p>Supported but there is too much inconsistency between browsers to be reliable.</p>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Check_boxes_and_radio_buttons">Check boxes and radio buttons</h3>
+
+<p>See the <code>{{htmlelement("input/checkbox", "checkbox")}}</code> and <code>{{htmlelement("input/radio", "radio")}}</code> input types.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Some browsers add extra margins and others stretch the widget.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Some browsers add extra margins and others stretch the widget.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Select_boxes_single_line">Select boxes (single line)</h3>
+
+<p>See the <code>{{htmlelement("select")}}</code>,  <code>{{htmlelement("optgroup")}}</code> and  <code>{{htmlelement("option")}}</code> elements.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>This property is okay on the <code>{{htmlelement("select")}}</code> element, but it cannot be the case on the <code>{{htmlelement("option")}}</code> or <code>{{htmlelement("optgroup")}}</code> elements.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[2]</sup></td>
+   <td>
+    <ol>
+     <li>The property is applied, but in an inconsistent way between browsers on Mac OSX.</li>
+     <li>The property is well applied on the <code>{{htmlelement("select")}}</code> element, but is inconsistently handled on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>On Mac OSX, WebKit based browsers do not support this property on native widgets and they, along with Opera, do not support it at all on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>On Mac OSX, WebKit based browsers do not support this property on native widgets and they, along with Opera, do not support it at all on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 does not support this property on <code>{{htmlelement("select")}}</code>, <code>{{htmlelement("option")}}</code>, and <code>{{htmlelement("optgroup")}}</code> elements; WebKit based browsers on Mac OSX do not support this property on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 on Windows 7 and WebKit based browsers on Mac OSX do not support this property on this widget.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Only Firefox provides full support for this property. Opera does not support this property at all and other browsers only support it on the <code>{{htmlelement("select")}}</code> element.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td>
+    <ol>
+     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
+   <td>
+    <ol>
+     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td colspan="1" rowspan="3">
+    <ol>
+     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Note Firefox does not provide any way to change the down arrow on the <code>{{htmlelement("select")}}</code> element.</p>
+
+<h3 id="Select_boxes_multiline">Select boxes (multiline)</h3>
+
+<p>See the <code>{{htmlelement("select")}}</code>, <code>{{htmlelement("optgroup")}}</code> and  <code>{{htmlelement("option")}}</code> elements and the <a href="/en-US/docs/Web/HTML/Attributes/size"><code>size</code> attribute</a>.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Opera does not support {{cssxref("padding-top")}} and {{cssxref("padding-bottom")}} on the <code>{{htmlelement("select")}}</code> element.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>See the note about {{cssxref("line-height")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 does not support this property on <code>{{htmlelement("select")}}</code>, <code>{{htmlelement("option")}}</code>, and <code>{{htmlelement("optgroup")}}</code> elements; WebKit based browsers on Mac OSX do not support this property on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 on Windows 7 and WebKit based browser on Mac OSX do not support this property on this widget.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Only supported by Firefox and IE9+.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>On Opera the {{cssxref("border-radius")}} property is applied only if an explicit border is set.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Datalist">Datalist</h3>
+
+<p>See the <code>{{htmlelement("datalist")}}</code> and <code>{{htmlelement("input")}}</code> elements and the <a href="/en-US/docs/Web/HTML/Attributes/list"><code>list</code> attribute</a>.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="File_picker">File picker</h3>
+
+<p>See the <code>{{htmlelement("input/file", "file")}}</code> input type.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Many browsers apply this property to the select button.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>It acts more or less like an extra left margin outside the widget.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Date_pickers">Date pickers</h3>
+
+<p>See the <code>{{htmlelement("input/date", "date")}}</code> and <code>{{htmlelement("input/time", "time")}}</code> input types. Many properties are supported, but there is too much inconstency between browsers to be reliable.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Color_pickers">Color pickers</h3>
+
+<p>See the <code>{{htmlelement("input/color", "color")}}</code> input type:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>Opera handles this like a select widget with the same restriction.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>Opera handles this like a select widget with the same restriction.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td colspan="1" rowspan="3">
+    <ol>
+     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Meters_and_progress">Meters and progress</h3>
+
+<p>See the <code>{{htmlelement("meter")}}</code> and <code>{{htmlelement("progress")}}</code> elements:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Chrome hides the <code>{{htmlelement("progress")}}</code> and <code>{{htmlelement("meter")}}</code> element when the {{cssxref("padding")}} property is applied on a tweaked element.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td colspan="1" rowspan="3">
+    <ol>
+     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Range">Range</h3>
+
+<p>See the <code>{{htmlelement("input/range", "range")}}</code> input type. There is no standard way to change the style of the range grip and Opera has no way to tweak the default rendering of the range widget.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td>
+    <ol>
+     <li>Chrome and Opera add some extra space around the widget, whereas Opera on Windows 7 stretches the range grip.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td>
+    <ol>
+     <li>The {{cssxref("padding")}} is applied, but has no visual effect.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td colspan="1" rowspan="3">
+    <ol>
+     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Image_buttons">Image buttons</h3>
+
+<p>See the <code>{{htmlelement("input/image", "image")}}</code> input type:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col" style="text-align: center;">N</th>
+   <th scope="col" style="text-align: center;">T</th>
+   <th scope="col">Note</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>CSS box model</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Text and font</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td style="text-align: center; vertical-align: top;">N.A.</td>
+   <td></td>
+  </tr>
+ </tbody>
+ <tbody>
+  <tr>
+   <th colspan="4" scope="col"><em>Border and background</em></th>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
+   <td colspan="1"></td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td colspan="1">
+    <ol>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
+   <td colspan="1">
+    <ol>
+     <li>IE9 does not support this property.</li>
+    </ol>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="See_also">See also</h2>
+
+<h3 id="Learning_path">Learning path</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Your first HTML form</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">How to structure an HTML form</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">The native form widgets</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/HTML5_input_types">HTML5 input types</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Additional_form_controls">Additional form controls</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/UI_pseudo-classes">UI pseudo-classes</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Styling HTML forms</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Form data validation</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Sending form data</a></li>
+</ul>
+
+<h3 id="Advanced_Topics">Advanced Topics</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Sending forms through JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">How to build custom form widgets</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">HTML forms in legacy browsers</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Property compatibility table for form widgets</a></li>
+</ul>
diff --git a/files/es/learn/forms/sending_and_retrieving_form_data/index.html b/files/es/learn/forms/sending_and_retrieving_form_data/index.html
new file mode 100644
index 0000000000..03fc91a7f1
--- /dev/null
+++ b/files/es/learn/forms/sending_and_retrieving_form_data/index.html
@@ -0,0 +1,329 @@
+---
+title: Sending form data
+slug: Learn/Forms/Sending_and_retrieving_form_data
+translation_of: Learn/Forms/Sending_and_retrieving_form_data
+original_slug: Learn/HTML/Forms/Sending_and_retrieving_form_data
+---
+<div>{{LearnSidebar}} {{PreviousMenuNext("Aprende / HTML / Formularios / The_native_form_widgets", "Aprender / html / Formularios / Form_validation", "Aprender / html / Forms")}}</div>
+
+<p class="summary">En este artículo se analiza lo que sucede cuando un usuario envía un formulario - ¿A dónde van los datos y cómo los manejamos cuando llegan allí? - También tenemos en cuenta algunos de los problemas de seguridad asociados con el envío de los datos del formulario.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Requisitos previos:</th>
+   <td>Conocimientos básicos de informática, una <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">comprensión de HTML</a> , y conocimientos básicos de <a href="/en-US/docs/Web/HTTP/Basics_of_HTTP">HTTP</a> y <a href="/en-US/docs/Learn/Server-side/First_steps">programación del lado del servidor</a> .</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Para entender lo que sucede cuando se envía los datos del formulario, incluyendo la obtención de una idea básica de cómo se procesan los datos en el servidor</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿A_dónde_van_los_datos">¿A dónde van los datos?</h2>
+
+<p>Aquí vamos a discutir lo que ocurre con los datos cuando se envía un formulario.</p>
+
+<h3 id="Sobre_la_arquitectura_cliente_servidor">Sobre la arquitectura cliente / servidor</h3>
+
+<p>La web se basa en una arquitectura cliente / servidor muy básica que se puede resumir de la siguiente manera: un cliente (normalmente un navegador Web) envía una petición a un servidor (la mayoría de las veces un servidor web como <a href="http://httpd.apache.org/" rel="external" title="http://www.apache.org/">Apache</a> , <a href="http://nginx.com/" rel="external" title="http://nginx.com/">Nginx</a> , <a href="http://www.iis.net/" rel="external" title="http://www.iis.net/">IIS</a> , <a href="http://tomcat.apache.org/" rel="external" title="http://tomcat.apache.org/">Tomcat</a> , etc.), utilizando el <a href="/en-US/docs/HTTP" title="/en-US/docs/HTTP">protocolo HTTP</a> . El servidor responde a la solicitud utilizando el mismo protocolo.</p>
+
+<p><img alt="Un esquema básico de la arquitectura cliente Web / servidor" src="/files/4291/client-server.png" style="display: block; height: 141px; margin: 0px auto; width: 400px;"></p>
+
+<p>En el lado del cliente, un formulario HTML no es más que una manera fácil de usar conveniente para configurar una petición HTTP para enviar datos a un servidor. Esto permite al usuario para proporcionar información a ser entregada en la petición HTTP.</p>
+
+<div class="note">
+<p><strong>Nota</strong> : Para tener una mejor idea de cómo funcionan las arquitecturas cliente-servidor, lea nuestra <a href="/en-US/docs/Learn/Server-side/First_steps">programación de páginas web del lado del servidor, módulo: primeros pasos</a>. En el lado del cliente: Debes definir como envías los datos.</p>
+</div>
+
+<p>El elemento {{HTMLElement ( "form")}} define cómo se enviarán los datos. Todos sus atributos están diseñados para que pueda configurar la solicitud que se enviará cuando un usuario pulsa un botón de envío. Los dos atributos más importantes son {{htmlattrxref ( "acción", "forma")}} y {{htmlattrxref ( "método", "forma")}}.</p>
+
+<h4 id="El_atributo_htmlattrxref_acción_forma.">El atributo {{htmlattrxref ( "acción", "forma")}}.</h4>
+
+<p>Este atributo define el lugar donde los datos se envian. Su valor debe ser una dirección URL válida. Si no se proporciona este atributo, los datos serán enviados a la dirección URL de la página que contiene el formulario.</p>
+
+<p>En este ejemplo, los datos se envían a una dirección URL absoluta - <code>http://foo.com</code>:</p>
+
+<pre class="brush: html">&lt;Acción del formulario = "http://foo.com"&gt;</pre>
+
+<p class="brush: html">Aquí, nosotros usamos una URL relativa - los datos se envían a una dirección URL diferente en el servidor:</p>
+
+<pre class="brush: html">&lt;Acción del formulario = "/ somewhere_else"&gt;</pre>
+
+<p class="brush: html">Cuando se especifica sin atributos, como abajo, el {{HTMLElement ( "form")}} los datos se envían a la misma página en que la "forma" está presente :</p>
+
+<pre class="brush: html">&lt;Form&gt;</pre>
+
+<p class="brush: html">Muchas páginas más antiguas utilizan la siguiente notación para indicar que los datos deben ser enviados a la misma página que contiene el formulario; Esto fue necesario porque hasta HTML5, el atributo {{htmlattrxref ( "acción", "form")}} fue requerido . Esto ya no es necesario.</p>
+
+<pre class="brush: html">&lt;Form action = "#"&gt;</pre>
+
+<div class="note">
+<p><strong>Nota:</strong> Es posible especificar una dirección URL que utiliza el protocolo HTTPS (HTTP seguro). Al hacer esto, los datos se cifran junto con el resto de la solicitud, incluso si el propio formulario está alojado en una página insegura se accede a través de HTTPS. Por otro lado, si el formulario está alojado en una página segura, pero se especifica una dirección URL HTTP insegura con el atributo {{htmlattrxref ( "acción", "form")}} , todos los navegadores mostrarán una advertencia de seguridad para el usuario cada vez  que intenten enviar datos, ya que estos no se pueden cifrar.</p>
+</div>
+
+<h4 id="El_atributo_htmlattrxref_método_form">El atributo {{htmlattrxref ( "método", "form")}}</h4>
+
+<p>Este atributo define cómo se envían los datos. El <a href="/en-US/docs/HTTP" title="/en-US/docs/HTTP">protocolo HTTP</a> proporciona varias formas de realizar una solicitud; Los datos del formulario HTML se pueden transmitir a través de un número de diferentes queridos, los más comunes de los cuales son el método <code>GET</code> y el método <code>POST</code>.</p>
+
+<p>Para entender la diferencia entre estos dos métodos, vamos a dar un paso atrás y examinar cómo funciona HTTP. Cada vez que desee llegar a un recurso en la Web, el navegador envía una petición a una URL. Una petición HTTP consta de dos partes: un encabezado que contiene un conjunto de metadatos mundial sobre las capacidades del navegador, y un cuerpo que puede contener la información necesaria paraque el servidor pueda procesar la petición específica.</p>
+
+<h5 id="El_método_GET">El método GET</h5>
+
+<p>El método <code>GET</code> es  utilizado por el navegador para pedir al servidor que se envíe de vuelta un recurso dado: "Hey servidor, quiero conseguir este recurso." En este caso, el navegador envía un cuerpo vacío. Debido a que el cuerpo está vacío, si un formulario se envía utilizando este método, los datos enviados al servidor se anexan a la URL.</p>
+
+<p>Considere la siguiente forma:</p>
+
+<pre class="brush: html">&lt;form action="http://foo.com" method="get"&gt;
+  &lt;div&gt;
+    &lt;label for="decir"&gt; ¿Qué saludo quiere decir? &lt;/label&gt;
+    &lt;input name="decir" id="decir" value="Hola"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="para"&gt; ¿A quién se lo quiere decir? &lt;/label&gt;
+    &lt;input name="para" value="mamá"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt; Botón enviar mis saludos &lt;/ button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Dado que el método <code>GET</code>ha conseguido el recurso, verá en la URL lo siguiente en la barra de direcciones del navegador <code>www.foo.com/?say=Hi&amp;to=Mom</code>  cuando se envía el formulario.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14685/url-parameters.png" style="display: block; margin: 0 auto;">Los datos se añaden a la URL como una serie de pares de nombre / valor. Después que la dirección web URL ha terminado, se incluye un signo de interrogación ( <code>?</code>) seguido de los pares de nombre / valor, cada uno separado por un signo ( <code>&amp;</code>). En este caso estamos pasando dos piezas de datos en el servidor:</p>
+
+<ul>
+ <li><code>say</code>, Que tiene un valor de <code>Hi</code></li>
+ <li><code>to</code>, Que tiene un valor de <code>Mom</code></li>
+</ul>
+
+<p>La solicitud HTTP se ve así:</p>
+
+<pre>GET /? = Decir Hola &amp; a = mamá HTTP / 1.1
+Anfitrión: foo.com</pre>
+
+<div class="note">
+<p><strong>Nota</strong> : Puede encontrar este ejemplo en GitHub - ver <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/get-method.html">llegar-method.html</a> ( <a href="https://mdn.github.io/learning-area/html/forms/sending-form-data/get-method.html">verlo en directo también</a> ).</p>
+</div>
+
+<h5 id="El_método_POST">El método POST</h5>
+
+<p>El <code>POST</code>método es un poco diferente. Es el método que el navegador utiliza para comunicarse con el servidor cuando se pide una respuesta que tenga en cuenta los datos proporcionados en el cuerpo de la petición HTTP: "Hey servidor, echa un vistazo a estos datos y envíame de vuelta un resultado apropiado." Si un formulario se envía utilizando este método, los datos se anexan al cuerpo de la petición HTTP.</p>
+
+<p>Veamos un ejemplo - se trata de algo similar a como se vió en el método <code>GET</code>del apartado anterior, pero con el {{htmlattrxref ( "método", "form")}} atributo establecido <code>post</code>.</p>
+
+<pre class="brush: html">&lt;Form action = "http://foo.com" method = "post"&gt;
+  &lt;Div&gt;
+    &lt;Label for = "dice"&gt; Lo saludo qué quiere decir? &lt;/ Label&gt;
+    &lt;Input name = "decir" id = "decir" value = "Hola"&gt;
+  &lt;/ Div&gt;
+  &lt;Div&gt;
+    &lt;Label for = "para"&gt; ¿Quién usted quiere decir que a? &lt;/ Label&gt;
+    &lt;Input name = "a" value = "mamá"&gt;
+  &lt;/ Div&gt;
+  &lt;Div&gt;
+    &lt;&gt; Botón enviar mis saludos &lt;/ botón&gt;
+  &lt;/ Div&gt;
+&lt;/ Form&gt;</pre>
+
+<p>Cuando el formulario se envía mediante el método <code>POST</code>, no se obtienen los datos adjuntos en la dirección URL, y la solicitud HTTP se parece a esto y los datos son incluidos en el cuerpo de la petición en su lugar:</p>
+
+<pre>POST / HTTP/1.1
+Anfitrión: foo.com
+Content-Type: application / x-www-form-urlencoded
+Content-Length: 13
+
+decir = Hi &amp; a = mamá</pre>
+
+<p>La cabecera <code>Content-Length</code> indica el tamaño del cuerpo, y la cabecera <code>Content-Type</code> indica el tipo de recurso que se envía al servidor. Discutiremos estas cabeceras más adelante.</p>
+
+<div class="note">
+<p><strong>Nota</strong> : Puede encontrar este ejemplo en GitHub - ver <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/post-method.html">post-method.html</a> ( <a href="https://mdn.github.io/learning-area/html/forms/sending-form-data/post-method.html">verlo en directo también</a> ).</p>
+</div>
+
+<h4 id="Visualización_de_peticiones_HTTP">Visualización de peticiones HTTP</h4>
+
+<p>Las peticiones HTTP nunca se muestran al usuario (si quieres verlos, es necesario utilizar herramientas como el <a href="/en-US/docs/Tools/Network_Monitor">Monitor de red Firefox</a> o las <a href="https://developers.google.com/chrome-developer-tools/" title="https://developers.google.com/chrome-developer-tools/">herramientas de desarrollo de Chrome</a> ). A modo de ejemplo, los datos del formulario se muestran a continuación en la pestaña de Chrome red:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14691/network-monitor.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
+
+<p>Lo único que se muestra al usuario es la dirección URL llamada. Como mencionamos anteriormente, con una petición<code>GET</code> del usuario,se verán los datos en su barra de direcciones, pero con una petición <code>POST</code> no será de esta manera. Esto puede ser muy importante por dos razones:</p>
+
+<ol>
+ <li>Si necesita enviar una contraseña (o cualquier otra pieza sensible de los datos), nunca utilice el método<code>GET</code> o se arriesga a mostrar en la barra de direcciones, lo que sería muy inseguro.</li>
+ <li>Si necesita enviar una gran cantidad de datos, el método <code>POSt</code> es preferible debido a que algunos navegadores limitan los tamaños de las direcciones URL. Además, muchos servidores limitan la longitud de las URL que aceptan.</li>
+</ol>
+
+<h3 id="En_el_lado_Servidor_la_recuperación_de_los_datos">En el lado  Servidor: la recuperación de los datos</h3>
+
+<p>Sea cual sea el método HTTP que elija, el servidor recibe una cadena que será analizada con el fin de obtener los datos como una lista de pares clave / valor. La forma de acceder a esta lista depende de la plataforma de desarrollo que use y de las estructuras específicas que pueda estar usando con él. La tecnología se utiliza también determina cómo se manejan claves duplicadas; A menudo,se da prioridad al valor recibido más recientemente para una clave dada .</p>
+
+<h4 id="Ejemplo_PHP_Raw">Ejemplo: PHP Raw</h4>
+
+<p><a href="http://php.net/">PHP</a> ofrece algunos objetos globales para acceder a los datos. Suponiendo que usted ha utilizado el método<code>POST</code>, el siguiente ejemplo sólo toma los datos y lo muestra al usuario. Por supuesto, lo que se hace con los datos depende de usted. Es posible visualizarlos, almacenarlos en una base de datos, enviarlos por correo electrónico, o procesarlos de alguna otra manera.</p>
+
+<pre class="brush: php">&lt;? Php
+  // La variable global $ _POST que permite acceder a los datos enviados con el método POST por su nombre
+  // Para acceder a los datos enviados con el método GET, puede usar $ _GET
+  $ = Decir htmlspecialchars ($ _POST [ 'decir']);
+  $ A = htmlspecialchars ($ _POST [ 'a']);
+
+  echo $ digamos, '', $ a;
+?&gt;</pre>
+
+<p>Este ejemplo muestra una página con los datos que enviamos. Esto se puede ver en acción en nuestro archivo ejemplo <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/php-example.html">php-example.html</a> - que contiene un ejemplo similar en forma como el que hemos visto antes, con un <code>method</code>con parámetro <code>post</code>y un <code>action</code> con parámetro <code>php-example.php</code> Cuando se envía, envía los datos del formulario al script <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/php-example.php">php-ejemplo.php</a> , que contiene el código de PHP que se ha visto en el bloque anterior. Cuando se ejecuta este código, la salida en el navegador es <code>Hi Mom</code>.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14693/php-result.png" style="display: block; margin: 0 auto;"></p>
+
+<div class="note">
+<p><strong>Nota</strong> : Este ejemplo no funcionará cuando se carga en un navegador localmente - los navegadores no pueden interpretar  código PHP, por lo que cuando se envía el formulario en el navegador sólo  se puede ofrecer la descarga del archivo PHP para usted. Para conseguir que funcione, es necesario ejecutar el ejemplo a través de un servidor PHP de algún tipo. Buenas opciones para probar PHP locales son <a href="https://www.mamp.info/en/downloads/">MAMP</a> (Mac y Windows) y <a href="http://ampps.com/download">AMPPS</a> (Mac, Windows, Linux).</p>
+</div>
+
+<h4 id="Ejemplo_Python">Ejemplo: Python</h4>
+
+<p>Este ejemplo muestra como se puede utilizar Python para hacer la misma cosa - mostrar los datos presentados en una página web. Se utiliza el <a href="http://flask.pocoo.org/">framework Flask</a> para la prestación de las plantillas, el manejo de la presentación de datos de formulario, etc (ver <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/python-example.py">python-example.py</a> ).</p>
+
+<pre class="line-numbers  language-html"><code class="language-html">from flask import Flask, render_template, request
+app = Flask(__name__)
+
+@app.route('/', methods=['GET', 'POST'])
+def form():
+    return render_template('form.html')
+
+@app.route('/hello', methods=['GET', 'POST'])
+def hello():
+    return render_template('greeting.html', say=request.form['say'], to=request.form['to'])
+
+if __name__ == "__main__":
+    app.run()</code></pre>
+
+<p>Las dos plantillas de referencia en el código anterior son los siguientes:</p>
+
+<ul>
+ <li><a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/templates/form.html">form.html</a> : La misma forma que hemos visto anteriormente en la {{anch ( "El método POST")}} sección, pero con el <code>action</code>conjunto a <code>\{{ url_for('hello') }}</code>. (Esta es una <a href="http://jinja.pocoo.org/docs/2.9/">Jinja2</a> plantilla, que es básicamente HTML, pero puede contener llamadas al código Python que ejecuta el servidor web que figura entre corchetes. <code>url_for('hello')</code>Básicamente está diciendo "redirigir a <code>/hello</code>cuando se envía el formulario").</li>
+ <li><a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/templates/greeting.html">greeting.html</a> :<span id="result_box" lang="es"><span>Esta plantilla solo contiene una línea que representa los dos bits de datos que se le pasan cuando se procesa</span></span>. Esto se hace a través de la función <code>hello()</code>que se ha visto anteriormente, y que se ejecuta cuando la URL<code>/hello</code> es accedida.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong> : Una vez más, este código no funcionará si sólo intenta cargarlo en un navegador directamente. Python funciona un poco diferente a PHP - Para ejecutar este código local que necesita para <a href="/en-US/docs/Learn/Server-side/Django/development_environment#Installing_Python_3">instalar Python / PIP</a> , a continuación, instalar el frasco utilizando <code>pip3 install flask</code>. En este punto, usted debe ser capaz de ejecutar el ejemplo utilizando <code>python3 python-example.py</code>, a continuación, deberá navegar a <code>localhost:5000</code>en su barra de direcciones.</p>
+</div>
+
+<h4 id="Otros_lenguajes_y_frameworks">Otros lenguajes y frameworks</h4>
+
+<p>Hay muchas otras tecnologías del lado del servidor que puede utilizar para el manejo de formularios, incluyendo <a href="/en-US/docs/" title="/en-US/docs/">Perl</a> , <a href="/en-US/docs/" title="/en-US/docs/">Java</a> , <a href="http://www.microsoft.com/net" title="http://www.microsoft.com/net">.Net</a> , <a href="/en-US/docs/" title="/en-US/docs/">Rubí</a> , etc. Sólo tiene que elegir el que más le guste. Dicho esto, vale la pena señalar que es muy raro de usar estas tecnologías directamente porque esto puede ser complicado. Es más común el uso de uno de los muchos marcos de trabajo para un manejo más fácil del código, tales como:</p>
+
+<ul>
+ <li><a href="http://symfony.com/" rel="external" title="http://symfony.com/">Symfony</a> para PHP</li>
+ <li><a href="/en-US/docs/Learn/Server-side/Django" rel="external" title="https://www.djangoproject.com/">Django</a> para Python (un poco más pesado que el <a href="http://flask.pocoo.org/">frasco</a> , pero con más herramientas y opciones).</li>
+ <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs">Express</a> de Node.js</li>
+ <li><a href="http://rubyonrails.org/" rel="external" title="http://rubyonrails.org/">Ruby on Rails</a> Ruby</li>
+ <li><a href="http://grails.org/" rel="external" title="http://grails.org/">Grails</a> para Java</li>
+ <li>etc.</li>
+</ul>
+
+<p>Vale la pena señalar que incluso el uso de estos marcos, trabajar con formularios no es necesariamente <em>fácil</em> . Pero es mucho más fácil que tratar de escribir toda la funcionalidad  a partir de cero, además, le ahorrará mucho tiempo.</p>
+
+<div class="note">
+<p><strong>Nota</strong> : Está más allá del alcance de este artículo para enseñarle cualquier lenguaje del lado del servidor o marcos de trabajo. Los enlaces de arriba le dará un poco de ayuda,en caso de que desee aprender.</p>
+</div>
+
+<h2 id="Un_caso_especial_el_envío_de_archivos">Un caso especial: el envío de archivos</h2>
+
+<p>El envío de archivos con formularios HTML es un caso especial. Los archivos son datos binarios - o considerados como tal - mientras que todos los demás datos son datos de texto. Debido a que HTTP es un protocolo de texto, existen requisitos especiales para el manejo de datos binarios.</p>
+
+<h3 id="El_htmlattrxref_enctype_form_atributo">El {{htmlattrxref ( "enctype", "form")}} atributo</h3>
+
+<p>Este atributo le permite especificar el valor de la cabecera <code>Content-Type</code> HTTP incluido en la solicitud que se genera cuando se envía el formulario. Esta cabecera es muy importante porque le dice al servidor qué tipo de datos se está enviando. Por defecto, su valor es <code>application/x-www-form-urlencoded</code>. En términos humanos, esto significa: "<span class="short_text" id="result_box" lang="es"><span>Estos son datos de formulario que han sido codificados dentro de los parámetros de la URL</span></span>."</p>
+
+<p>Si desea enviar archivos, es necesario tomar tres pasos adicionales:</p>
+
+<ul>
+ <li>Ajuste el {{htmlattrxref ( "método", "form")}} atributo <code>POST</code>porque el contenido del archivo no se puede poner dentro de los parámetros de URL.</li>
+ <li>Establecer el valor de {{htmlattrxref ( "enctype", "form")}} que <code>multipart/form-data</code>debido a que los datos se dividen en múltiples partes, una para cada archivo más uno para los datos de texto incluidos en el cuerpo del formulario (si también se introduce el texto en la formulario).</li>
+ <li>Incluir uno o más widgets <a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets#File_picker">selector de archivos</a> para permitir a los usuarios seleccionar el archivo (s) que será subido.</li>
+</ul>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: html">&lt;Form method = "post" enctype = "multipart / form-data"&gt;
+  &lt;Div&gt;
+    &lt;Label for = "archivo"&gt; ​​Elija un archivo &lt;/ label&gt;
+    &lt;Input type = "file" id = "file" name = "myFile"&gt;
+  &lt;/ Div&gt;
+  &lt;Div&gt;
+    &lt;&gt; Botón Enviar el archivo &lt;/ botón&gt;
+  &lt;/ Div&gt;
+&lt;/ Form&gt;</pre>
+
+<div class="note">
+<p><strong>Nota:</strong> Algunos navegadores son compatibles con la {{htmlattrxref ( "múltiple", "input")}} atributo en el elemento {{HTMLElement ( "input")}}, lo que permite elegir más de un archivo  para subir con un único elemento <code>&lt;input&gt;</code> . Cómo el servidor gestiona los archivos realmente depende de la tecnología utilizada en el servidor. Como se mencionó anteriormente, el uso de un marco le hará la vida mucho más fácil.</p>
+</div>
+
+<div class="warning">
+<p><strong>Advertencia:</strong> Muchos servidores están configurados con un límite de tamaño para los archivos y las peticiones HTTP con el fin de prevenir el abuso. Es importante comprobar este límite con el administrador del servidor antes de enviar un archivo.</p>
+</div>
+
+<h2 id="Precauciones_de_seguridad_comunes">Precauciones de seguridad comunes</h2>
+
+<p>Cada vez que envíe datos a un servidor, debe tener en cuenta la seguridad de sus formularios HTML que son con mucho, los vectores de ataque más comunes (en lugares donde ocurren los ataques contra servidores). Los problemas nunca vienen de los formulariosHTML mismos - sino que proceden de cómo el servidor maneja los datos.</p>
+
+<p><span id="result_box" lang="es"><span>Dependiendo de lo que estés haciendo, hay algunos problemas de seguridad muy conocidos con los que te enfrentarás</span></span>:</p>
+
+<h3 id="XSS_y_CSRF">XSS y CSRF</h3>
+
+<p>Cross-Site Scripting (XSS) y Cross-Site Request Falsification (CSRF) son tipos comunes de ataques que se producen cuando se muestran los datos enviados por un usuario y que son devueltos a otro usuario para otro uso.</p>
+
+<p>XSS permite a los atacantes inyectar secuencias de comandos del lado del cliente en páginas Web visitadas por otros usuarios. Una vulnerabilidad de secuencias de comandos entre sitios, puede ser utilizada por los atacantes para eludir los controles de acceso, como la <a href="/en-US/docs/JavaScript/Same_origin_policy_for_JavaScript" title="/ Es-ES / docs / JavaScript / Same_origin_policy_for_JavaScript">política del mismo origen</a> . El efecto de estos ataques pueden ir desde una pequeña molestia a un riesgo de seguridad.</p>
+
+<p>Los ataques CSRF son similares a los ataques XSS porque comienzan de la misma manera - mediante la inyección de comandos de cliente en páginas Web - pero su objetivo es diferente. Los atacantes CSRF tratan de escalar privilegios  de un usuario de mayores privilegios (por ejemplo, un administrador de sitio) para realizar una acción que no deberían ser capaces de hacer (por ejemplo, el envío de datos a un usuario no fiable).</p>
+
+<p>Los ataques XSS explotan la confianza depositada a un usuario de un sitio web, mientras que los ataques CSRF abusan de la confianza que un sitio web ofrece para sus usuarios.</p>
+
+<p>Para evitar estos ataques, siempre se deben comprobar los datos que un usuario envía a su servidor y (si es necesario mostrarlos) <span id="result_box" lang="es"><span>trate de no mostrar el contenido HTML provisto por el usuario</span></span>. En su lugar, se deben procesar los datos proporcionados por el usuario para no mostrarlos al pie de la letra. <span style="line-height: 1.5;">Casi todos los marcos de trabajo (<strong>frameworks</strong>) en el mercado hoy implementan un filtro mínimo que eliminan el código HTML {{HTMLElement ( "script")}}, {{HTMLElement ( "iframe")}} y {{HTMLElement ( "objeto")}} si fuesen enviados por cualquier usuario. Esto ayuda a mitigar el riesgo, pero no necesariamente lo erradica.</span></p>
+
+<h3 id="Inyección_SQL">Inyección SQL</h3>
+
+<p>La inyección de SQL es un tipo de ataque que intenta realizar acciones en una base de datos utilizada por el sitio web de destino. Esto normalmente implica el envío de una petición SQL con la esperanza de que el servidor la ejecutará (por lo general cuando el servidor de aplicaciones intenta almacenar los datos enviados por un usuario). Esto es en realidad <a href="https://www.owasp.org/index.php/Category:OWASP_Top_Ten_Project" rel="external" title="https://www.owasp.org/index.php/Category:OWASP_Top_Ten_Project">uno de los principales vectores de ataque contra los sitios web </a> .</p>
+
+<p>Las consecuencias pueden ser terribles, que van desde la pérdida de datos o hasta que los ataques  tomen el control de la infraestructura de todo el sitio web mediante el uso de una escalada de privilegios. Esta es una amenaza muy seria y nunca debe almacenar los datos enviados por un usuario sin realizar alguna sanitización (por ejemplo, mediante el uso <code><a href="http://www.php.net/manual/en/function.mysql-real-escape-string.php" rel="external" title="http://www.php.net/manual/en/function.mysql-real-escape-string.php">mysql_real_escape_string()</a></code>de una infraestructura de PHP / MySQL).</p>
+
+<h3 id="Inyección_de_cabecera_HTTP_y_la_inyección_de_correo_electrónico">Inyección de cabecera HTTP y la inyección de correo electrónico</h3>
+
+<p>Este tipo de ataques pueden ocurrir cuando su aplicación se basa cabeceras HTTP o mensajes de correo electrónico basado en la entrada de datos por un usuario en un formulario. Estos no dañan directamente su servidor o afectan a sus usuarios, pero son una puerta abierta a problemas más profundos tales como el secuestro de sesión o ataques de phishing.</p>
+
+<p>Estos ataques son en su mayoría en silencio, y pueden volver a su servidor en un <a href="http://en.wikipedia.org/wiki/Zombie_(computer_science)" rel="exernal" title="http://en.wikipedia.org/wiki/Zombie_(computer_science)">zombi</a> .</p>
+
+<h3 id="Sea_paranoico_Nunca_confíe_en_sus_usuarios">Sea paranoico: Nunca confíe en sus usuarios</h3>
+
+<p>Entonces, ¿cómo se lucha contra estas amenazas? Este es un tema mucho más allá de esta guía, pero hay algunas reglas a tener en cuenta. La regla más importante es: nunca vuelva a confiar en sus usuarios, incluyáse a sí mismo; incluso un usuario de confianza podría haber sido secuestrado.</p>
+
+<p>Todos los datos que vienen a su servidor deben comprobarse y ser desinfectados. Siempre. Sin excepción.</p>
+
+<ul>
+ <li>Escapar caracteres potencialmente peligrosos. Los caracteres específicos con los que debe tener cuidado variarán dependiendo del contexto en el que se utilizan los datos y la plataforma de servidores que emplean, pero todos los lenguajes del lado del servidor tienen funciones de este.</li>
+ <li>Limite la cantidad de entrada de datos para permitir sólo lo necesario.</li>
+ <li>Sandbox subido archivos (almacenarlos en un servidor diferente y permitir el acceso al archivo sólo a través de un subdominio diferente o incluso mejor a través de un nombre de dominio totalmente diferente).</li>
+</ul>
+
+<p>Debería evitar muchos o  la mayoría de estos problemas, si sigue estas tres reglas, pero siempre es una buena idea  obtener una revisión de seguridad realizada por una tercera parte competente. No asuma que usted ha visto todos los posibles problemas.</p>
+
+<div class="note">
+<p><strong>Nota</strong> : La <a href="/en-US/docs/Learn/Server-side/First_steps/Website_security">seguridad del sitio web</a> el artículo de nuestro <a href="/en-US/docs/Learn/Server-side">lado del servidor</a> tema de aprendizaje analiza las amenazas anteriores y las posibles soluciones con más detalle.</p>
+</div>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>Como se puede ver, el envío de los datos del formulario es fácil, pero asegurar una aplicación puede ser complicado. Sólo recuerde que un desarrollador de aplicaciones para usuario no es el que debe definir el modelo de seguridad de los datos. Sí, como veremos, es posible <a href="/en-US/docs/HTML/Forms/Data_form_validation" title="/ es-ES / docs / HTML / Formularios / Data_form_validation">realizar la validación de los datos del lado del cliente</a> , pero el servidor no puede confiar en esta validación porque no tiene manera de saber realmente lo que  sucede en el lado del cliente.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<p>Si desea obtener más información sobre la seguridad de una aplicación web, se puede excavar en estos recursos:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Server-side/First_steps">programación web del lado del servidor primeros pasos</a></li>
+ <li><a href="https://www.owasp.org/index.php/Main_Page" rel="external" title="https://www.owasp.org/index.php/Main_Page">El Proyecto Open Web Application Security (OWASP)</a></li>
+ <li><a href="http://shiflett.org/" rel="external" title="http://shiflett.org/">el blog de Chris Shiflett sobre Seguridad en PHP</a></li>
+</ul>
+
+<p>{{PreviousMenuNext ( "Aprende / html / Formularios / The_native_form_widgets", "Saber / html / Formularios / Form_validation", "Aprender / html / Forms")}}</p>
diff --git a/files/es/learn/forms/styling_web_forms/index.html b/files/es/learn/forms/styling_web_forms/index.html
new file mode 100644
index 0000000000..6af4b94bed
--- /dev/null
+++ b/files/es/learn/forms/styling_web_forms/index.html
@@ -0,0 +1,346 @@
+---
+title: Estilizando formularios HTML
+slug: Learn/Forms/Styling_web_forms
+translation_of: Learn/Forms/Styling_web_forms
+original_slug: Learn/HTML/Forms/Styling_HTML_forms
+---
+<p>En este artículo aprenderemos como utilizar <a href="/es/docs/Web/CSS">CSS</a> con formularios <a href="/es/docs/Web/HTML">HTML</a>  para hacerlos más atractivos. Aunque parezca extraño, esto es algo que puede llegar a ser complicado. Por razones históricas y técnicas, los widgets de formulario no suelen llevarse bien con CSS. Por este motivo, muchos desarrolladores prefieren <a href="https://developer.mozilla.org/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets">construir sus propios widgets</a> para tener el control de su aspecto en vez de utilizar los nativos. De todas formas, con los modernos navegadores, los diseñadores web <span style="line-height: 23.3333339691162px;">cada vez</span><span style="line-height: 1.5;"> tienen  más control sobre el diseño de los elementos de formulario. Vamos a profundizar en esto.</span></p>
+
+<h2 id="¿Porqué_es_tan_difícil_aplicar_estilos_a_formularios_con_CSS">¿Porqué es tan difícil aplicar estilos a formularios con CSS?</h2>
+
+<p>En los principios de la Web —allá por1995—se añadieron los controles de formulario en la <a href="http://www.ietf.org/rfc/rfc1866.txt">2ª especificación HTML.</a> Debido a la complejidad de los widgets de formulario, los implementadores prefirieron dejar que el sistema operativo subyacente se encargara de su manejo y presentación.</p>
+
+<p>Pocos años después,  se creó<span style="line-height: 23.3333339691162px;"> </span><span style="line-height: 1.5;">CSS y lo que era una necesidad técnica</span>— es decir, el uso de widgets nativos para implementar controles de formulario—empezó a requerir estilizado. Y en los primeros días de CSS, el estilizado de formularios no fué una prioridad.</p>
+
+<p>Por otra parte, como los usuarios estaban acostumbrados a la apariencia visual de sus plataformas respectivas, los fabricantes de navegadores fueron reacios a hacer que los controles de formularios pudieran recibir estilos.</p>
+
+<p>Hoy en día, ni siquiera uno solo de los navegadores actuales implementa <span style="line-height: 23.3333339691162px;">completamente</span><span style="line-height: 1.5;"> a CSS 2.1. Afortunadamente, con el tiempo, los fabricantes de navegadores han ido mejorado su soporte a CSS para los elementos de formulario e, incluso considerando que su usabilidad tiene mala reputación, actualmente, ya se puede usar CSS para estilizar </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Forms" style="line-height: 1.5;">formularios HTML.</a></p>
+
+<h3 id="No_todos_los_widgets_se_crean_igual_con_CSS">No todos los widgets se crean igual con CSS</h3>
+
+<p>Actualmente aun se encuentran dificultades cuando se utiliza CSS con formularios; estos problemas se pueden dividir en tres categorías.</p>
+
+<h4 id="El_bueno">El bueno</h4>
+
+<p>A algunos elementos se les puede dar estilo con pocos o ningún problema independientemente de la plataforma. Entre estos se incluyen los siguientes elementos estructurales:</p>
+
+<ol>
+ <li>{{HTMLElement("form")}}</li>
+ <li>{{HTMLElement("fieldset")}}</li>
+ <li>{{HTMLElement("label")}}</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/output">&lt;output&gt;</a></li>
+</ol>
+
+<p style="line-height: 23.3333339691162px;">Esto también incluye todos los campos de texto (tanto los de línea simple como los de línea múltiple) y los botones.</p>
+
+<ol style="line-height: 23.3333339691162px;">
+</ol>
+
+<p style="line-height: 18px; font-size: 1.28571428571429rem;">El malo</p>
+
+<p>Hay otros elementos a los que raramente se les puede aplicar estilos y pueden llegar a requerir  <span style="line-height: 23.3333339691162px;">técnicas</span><span style="line-height: 1.5;"> complejas y </span><span style="line-height: 1.5;">ocasionalmente necesitan conocimientos avanzados de CSS3.</span></p>
+
+<p>Entre estos se incluyen el elemento {{HTMLElement("legend")}} ; que no puede posicionarse adecuadamente en todas las plataformas.  Los elementos checkbox y los botones de radio no permiten que se le apliquen estilos directamente;  de todas formas, gracias a CSS3 esto puede soslayarse. Al contenido de  <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-placeholder">placeholder </a>no se le puede aplicar estilo de ninguna forma convencional; sin embargo, todos los navegadores que lo implementan  también implementan pseudo-elementos<span style="line-height: 23.3333339691162px;"> o </span><span style="line-height: 1.5;">pseud</span><span style="line-height: 1.5;">o-clases propi</span>etarias que permiten darles estilo<span style="line-height: 1.5;">.</span></p>
+
+<p><span style="line-height: 1.5;">Veremos como trabajar con estos casos específicos en el artículo </span><a href="/en-US/docs/Advanced_styling_for_HTML_forms" style="line-height: 23.3333339691162px;" title="/en-US/docs/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a><span style="line-height: 23.3333339691162px;">.</span></p>
+
+<h4 id="El_feo">El feo</h4>
+
+<p>En algunos elementos, simplemente no se puede utilizar CSS. Estos son todos los elementos avanzados de interface de usuario tales como los controles range, color, o date, e igualmente pasa con los widgets desplegables como <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select">select</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option">option</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/optgroup">optgropup </a>y <a href="/es/docs/HTML/Elemento/datalist">datalist</a>. Respecto al selector de archivos, es bien sabido que no puede aplicarse estilo en absoluto. Los nuevos elementos <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress">progress </a>y <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meter">meter </a>también caen dentro de esta categoría.</p>
+
+<p>El principal problema con todos estos widgets viene de que todos ellos tienen una estructura muy compleja y CSS no es lo suficientemente expresivo para estilizar cada una de sus sutiles partes. Si lo que se quiere es personalizar estos widgets se deberá recurrir a javaScript para construir un árbol DOM que te permita acceder a ellos. Para aprender como conseguirlo mirar en el artículo <a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets" style="line-height: 23.3333339691162px; text-decoration: underline;" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets"><span style="line-height: 23.3333339691162px;"><u>How to </u></span>build<span style="line-height: 23.3333339691162px;"><u> </u></span>custom<span style="line-height: 23.3333339691162px;"><u> </u></span>form<span style="line-height: 23.3333339691162px;"><u> </u></span>widgets</a>.</p>
+
+<h2 id="Estilizado_básico">Estilizado básico</h2>
+
+<p>Aplicar estilos a <a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/Forms/Styling_HTML_forms#El_bueno">elementos que son fáciles de estilizar</a> con CSS, no debería suponer ninguna dificultad ya que básicamente se comportan como cualquier otro elemento HTML. De todas formas, el agente de usuario de estilos para cada navegador puede mostrar pequeñas inconsistencias por lo que a continuación daremos algunos trucos para ayudar a aplicar estilos más cómodamente.</p>
+
+<h3 id="Campos_de_búsqueda">Campos de búsqueda</h3>
+
+<p>Las cajas de búsqueda son el único tipo de campo de texto que pueden ofrecer más dificultad al aplicar estilos. En los navegadores basados en webkit (Chrome, Safari, etc.) se debe lidiar con la propiedad -webkit-. Discutiremos esta propiedad más tarde en el artículo: <a href="/en-US/docs/Advanced_styling_for_HTML_forms" style="line-height: 23.3333339691162px; text-decoration: underline;" title="/en-US/docs/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a><span style="line-height: 23.3333339691162px;">.</span></p>
+
+<h4 id="Ejemplo">Ejemplo</h4>
+
+<pre class="brush: html">&lt;form&gt;
+  &lt;input type="search"&gt;
+&lt;/form&gt;
+</pre>
+
+<pre class="brush: css">input[type=search] {
+  border: 1px dotted #999;
+  border-radius: 0;
+
+  -webkit-appearance: none;
+}</pre>
+
+<p><img alt="This is a screenshot of a search filed on Chrome, with and without the use of -webkit-appearance" src="/files/4153/search-chrome-macos.png" style="border-style: solid; border-width: 1px; height: 107px; width: 179px;"></p>
+
+<p>En esta captura de pantalla pueden verse dos campos de búsqueda en Chrome, ambos campos tienen definido el borde como en nuestro ejemplo, pero el primero no utiliza -webkit- mientras que el segundo si lo hace con -webkit-appearance:none. Las diferencias son evidentes.</p>
+
+<h3 id="Fuentes_y_texto">Fuentes y texto</h3>
+
+<p>Las fuentes y capacidades de texto de CSS  se pueden utilizar sin problemas en cualquier widget (y sí, se puede utilizar <a href="/es/docs/Web/CSS/@font-face">@font-face</a> en formularios). De todas formas, el comportamiento de los navegadores no es siempre consistente. Por defecto, algunos widgets no heredan <a href="/es/docs/Web/CSS/font-family">font-family</a> ni <a href="/es/docs/Web/CSS/font-size">font-size</a> de sus antecesores. Y muchos navegadores utilizan la apariencia por defecto. Para mantener la coherencia de los formularios con el resto de elementos se deben añadir las siguientes reglas a la hoja de estilos:</p>
+
+<pre class="brush: css">button, input, select, textarea {
+  font-family : inherit;
+  font-size   : 100%;
+}</pre>
+
+<p>La siguiente captura de pantalla muestra estas incosistencias; a la izquierda la apariencia por defecto en Firefox sobre Mac OS X, usando las fuentes por defecto de la plataforma. A la derecha los mismos elementos aplicando nuestras reglas de armonización de fuentes.</p>
+
+<p><img alt="This is a screenshot of the main form widgets on Firefox on Mac OSX, with and without font harmonization" src="/files/4157/font-firefox-macos.png" style="border-style: solid; border-width: 1px; height: 234px; width: 420px;"></p>
+
+<p>Hay muchas controversia sobre si los formularios tienen mejor aspecto usando los estilos por defecto del sistema o usando estilos personalizados que coincidan con el resto del contenido. Como diseñador del sitio o aplicación Web esta decisión  es suya.</p>
+
+<h3 id="Modelo_de_cajas">Modelo de cajas</h3>
+
+<p>Todos los campos de texto tienen soporte completo para las propiedades relacionadas con el modelo de cajas de CSS (<a href="/es/docs/Web/CSS/width">width</a>, <a href="/es/docs/Web/CSS/height">height</a>, <a href="/es/docs/Web/CSS/padding_paspartu">padding</a>, margin y <a href="/es/docs/CSS/border">border</a>). Igual que antes, los navegadores se remiten a los estilos por defecto del sistema cuando muestran estos widgets. A cada cual te corresponde el como combinarlos dentro del resto de contenido. Si  se quieres mantener el aspecto nativo de los widgets, entonces hay que afrontar pequeñas inconsistencias de tamaño.</p>
+
+<p>Esto es porque cada widget tiene sus propias reglas para el orden, margen y padding. Por lo que si quieres darle el mismo tamaño a varios widgets diferentes se debe usar la propiedad box-sizing: </p>
+
+<pre class="brush: css">input, textarea, select, button {
+  width : 150px;
+  margin: 0;
+
+  -webkit-box-sizing: border-box; /* For legacy WebKit based browsers */
+     -moz-box-sizing: border-box; /* For legacy (Firefox &lt;29) Gecko based browsers */
+          box-sizing: border-box;
+}</pre>
+
+<p><img alt="This is a screenshot of the main form widgets on Chrome on Windows 7, with and without the use of box-sizing." src="/files/4161/size-chrome-win7.png" style="border-style: solid; border-width: 1px; height: 213px; width: 358px;"></p>
+
+<p>En la captura de pantalla de arriba, la columna la izquierda es sin utilizar box-sizing, mientras que la de la derecha usa esta propiedad con el valor border-box. Obsérvese cómo esto permite asegurar que todos los elementos ocupan la misma cantidad de espacio, independientemente de las reglas por defecto de la plataforma.</p>
+
+<h3 id="Posicionado">Posicionado</h3>
+
+<p>El posicionado de formularios HTML <span style="line-height: 23.3333339691162px;">no es </span><span style="line-height: 1.5;">generalmente  un problema; sin embargo, hay dos elementos a los que prestar una especial atención:</span></p>
+
+<h4 id="legend">legend</h4>
+
+<p>El elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/legend">legend </a>no tiene problemas de estilizado a excepción de las reglas de posición. En los navegadores el elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/legend">legend </a>se posiciona encima del borde superior de su antecesor <a href="/es/docs/HTML/Elemento/fieldset">fieldset</a>. No existe ninguna posibilidad de colocarlo dentro del flujo HTML más allá del borde superior. Sin embargo se puede posicionar de forma relativa o absoluta mediante la propiedad position. En cualquier caso sigue siendo parte del borde de fieldset.</p>
+
+<p>Debido a que el elemento legend es muy importante por razones de accesibilidad (esto es lo que leen las tecnologías de asistencia como parte de las etiquetas de cada elemento de formulario dentro del fieldset), bastante menudo se empareja con un título que se oculta pero siendo aun accesible, de la forma siguiente:</p>
+
+<h5 id="HTML">HTML</h5>
+
+<pre class="brush: html">&lt;fieldset&gt;
+  &lt;legend&gt;Hi!&lt;/legend&gt;
+  &lt;h1&gt;Hello&lt;/h1&gt;
+&lt;/fieldset&gt;</pre>
+
+<h5 id="CSS">CSS</h5>
+
+<pre class="brush: css">legend {
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+}</pre>
+
+<h4 id="textarea">textarea</h4>
+
+<p>Por defecto, todos los navegadores consideran el elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea">textarea </a>como un inline block alineado con la línea base del texto. Esto es algo que raramente es lo que en realidad se quiere. Para convertir este elemento de un inline-block a uno tipo block, se realiza bastante fácilmente utilizando la propiedad <a href="/es/docs/CSS/display">display</a>. Si lo que quieres es utilizarlo inline, es corriente cambiar la alineación vertical: </p>
+
+<pre class="brush: css">textarea {
+  vertical-align: top;
+}</pre>
+
+<h2 id="Ejemplo_2">Ejemplo</h2>
+
+<p>Vamos a ver un ejemplo de como aplicar estilo a un formulario HTML. Esto nos ayudará a tener las ideas más claras. A continuación construiremos el siguiente formulario de contacto de esta postal:</p>
+
+<p><img alt="This is what we want to achieve with HTML and CSS" src="/files/4149/screenshot.png" style="border-style: solid; border-width: 1px; height: 249px; width: 370px;"></p>
+
+<h3 id="HTML_2">HTML</h3>
+
+<p>El HTML  incluye poco más de lo que se utiliza en el primer artículo de <a href="/en-US/docs/HTML/Forms/My_first_HTML_form">esta guía</a>; apenas el título y algún ID más.</p>
+
+<pre class="brush: html">&lt;form&gt;
+  &lt;h1&gt;to: Mozilla&lt;/h1&gt;
+
+  &lt;div id="from"&gt;
+    &lt;label for="name"&gt;from:&lt;/label&gt;
+    &lt;input type="text" id="name" name="user_name"&gt;
+  &lt;/div&gt;
+
+  &lt;div id="reply"&gt;
+    &lt;label for="mail"&gt;reply:&lt;/label&gt;
+    &lt;input type="email" id="mail" name="user_email"&gt;
+  &lt;/div&gt;
+
+  &lt;div id="message"&gt;
+    &lt;label for="msg"&gt;Your message:&lt;/label&gt;
+    &lt;textarea id="msg" name="user_message"&gt;&lt;/textarea&gt;
+  &lt;/div&gt;
+
+  &lt;div class="button"&gt;
+    &lt;button type="submit"&gt;Send your message&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<h3 id="CSS_2">CSS</h3>
+
+<p>¿Aqui es donde empieza la diversión! Antes de empezar a codificar, necesitamos tres elementos adicionales:</p>
+
+<ol>
+ <li>El <a href="https://developer.mozilla.org/files/4151/background.jpg">fondo </a>de la postal</li>
+ <li>Una fuente tipográfica: <a href="http://www.fontsquirrel.com/fonts/Secret-Typewriter" rel="external" title="http://www.fontsquirrel.com/fonts/Secret-Typewriter">la "Secret Typewriter" de fontsquirrel.com</a></li>
+ <li>Una fuente manuscrita: <a href="http://www.fontsquirrel.com/fonts/Journal" rel="external" title="http://www.fontsquirrel.com/fonts/Journal">la "Journal" fde fontsquirrel.com</a></li>
+</ol>
+
+<p>Ahora podemos repasar el código. Primero preparamos las bases definiendo las reglas <span style="line-height: 23.3333339691162px;"> </span><a href="https://developer.mozilla.org/es/docs/Web/CSS/@font-face" style="line-height: 23.3333339691162px;" title="@font-face permite al autor especificar fuentes online para visualizar en sus páginas web. Al permitir a los autores proporcionar sus propias fuentes, @font-face elimina la necesidad de depender del numero limitado de fuentes de usuarios instaladas en sus computadoras."><code>@font-face</code></a> y los elementos básicos de <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/body" style="line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!"><code>&lt;body&gt;</code></a> y <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/form" style="line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!"><code>&lt;form&gt;</code></a><span style="line-height: 23.3333339691162px;"> </span></p>
+
+<pre class="brush: css">@font-face{
+  font-family : "handwriting";
+
+  src : url('journal.eot');
+  src : url('journal.eot?') format('eot'),
+        url('journal.woff') format('woff'),
+        url('journal.ttf') format('truetype');
+}
+
+@font-face{
+  font-family : "typewriter";
+
+  src : url('veteran_typewriter.eot');
+  src : url('veteran_typewriter.eot?') format('eot'),
+        url('veteran_typewriter.woff') format('woff'),
+        url('veteran_typewriter.ttf') format('truetype');
+}
+
+body {
+  font  : 21px sans-serif;
+
+  padding : 2em;
+  margin  : 0;
+
+  background : #222;
+}
+
+form {
+  position: relative;
+
+  width  : 740px;
+  height : 498px;
+  margin : 0 auto;
+
+  background: #FFF url(background.jpg);
+}</pre>
+
+<p>Ahora podemos posicionar los elementos, incluidos el título y los elementos del formulario.</p>
+
+<pre class="brush: css">h1 {
+  position : absolute;
+  left : 415px;
+  top  : 185px;
+
+  font : 1em "typewriter", sans-serif;
+}
+
+#from {
+  position: absolute;
+  left : 398px;
+  top  : 235px;
+}
+
+#reply {
+  position: absolute;
+  left : 390px;
+  top  : 285px;
+}
+
+#message {
+  position: absolute;
+  left : 20px;
+  top  : 70px;
+}</pre>
+
+<p>Aquí es donde empezamos a trabajar los propios elementos. Primero, nos aseguramos que los elementos <span style="line-height: 23.3333339691162px;"> </span><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/label" style="line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!"><code>&lt;label&gt;</code></a> reciben la fuente correcta.</p>
+
+<pre class="brush: css">label {
+  font : .8em "typewriter", sans-serif;
+}</pre>
+
+<p>Los campos de texto necesitan algunas reglas comunes. Dicho simplemente, le quitamos bordes y fondos y redefinimos el padding y margin.</p>
+
+<pre class="brush: css">input, textarea {
+  font    : .9em/1.5em "handwriting", sans-serif;
+
+  border  : none;
+  padding : 0 10px;
+  margin  : 0;
+  width   : 240px;
+
+  background: none;
+}</pre>
+
+<p>Cuando uno de estos campos recibe el foco, vamos a resaltarlo con un fondo transparente gris claro. Tome nota de que es importante añadir la propiedad <span style="line-height: 23.3333339691162px;"> </span><a class="new" href="https://developer.mozilla.org/es/docs/Web/CSS/outline" style="color: rgb(153, 0, 0); line-height: 23.3333339691162px;" title="The documentation about this has not yet been written; please consider contributing!"><code>outline</code></a><span style="line-height: 23.3333339691162px;"> </span> para quitar el resaltado de enfoque añadido por defecto por algunos navegadores.</p>
+
+<pre class="brush: css">input:focus, textarea:focus {
+  background   : rgba(0,0,0,.1);
+  border-radius: 5px;
+  outline      : none;
+}</pre>
+
+<p>Ahora que nuestros campos de texto están terminados, necesitamos ajustar como se muestran los campos de simple y múltiple línea para que coincidan, ya que lo normal es que por defecto no se vean igual.</p>
+
+<p>El campo de línea simple requiere de algunos trucos para que se vean bien en Internet Explorer. Internet Explorer no define la altura de los campos basándose en la altura natural de la fuente (lo cual es el comportamiento normal del resto de navegadores). Para corregir esto necesitamos añadir explícitamente la altura a los campos de la siguiente forma:</p>
+
+<pre class="brush: css">input {
+    height: 2.5em; /* for IE */
+    vertical-align: middle; /* This is optional but it makes legacy IEs look better */
+}</pre>
+
+<p>Los elementos <code style="color: rgb(153, 0, 0); line-height: 23.3333339691162px;"><a class="new" href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/textarea" style="color: rgb(153, 0, 0); line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!">&lt;textarea&gt;</a> </code>se muestran por defecto como bloques, Las dos cosas importantes aquí son las propiedades  <a class="new" href="https://developer.mozilla.org/es/docs/Web/CSS/resize" style="color: rgb(153, 0, 0); line-height: 19.0909080505371px;" title="The documentation about this has not yet been written; please consider contributing!"><code>resize</code></a><span style="line-height: 19.0909080505371px;"> y </span><code style="line-height: 19.0909080505371px;"><a href="https://developer.mozilla.org/es/docs/Web/CSS/overflow" style="line-height: 19.0909080505371px;" title="La propiedad CSS overflow  especifica: si recortar contenido, dibujar barras de desplazamiento o mostrar el contenido excedente en un elemento a nivel de bloque.">overflow</a>. </code>Ya que nuestro <code style="line-height: 19.0909080505371px;">diseño </code>es de tamaño fijo, utilizaremos la propiedad <code>resize</code> para impedir que el usuario pueda cambiar el tamaño de los campos multilínea. La propiedad <span style="line-height: 19.0909080505371px;"> </span><a href="https://developer.mozilla.org/es/docs/Web/CSS/overflow" style="line-height: 19.0909080505371px;" title="La propiedad CSS overflow  especifica: si recortar contenido, dibujar barras de desplazamiento o mostrar el contenido excedente en un elemento a nivel de bloque."><code>overflow</code></a><span style="line-height: 19.0909080505371px;"> </span> se utiliza para que el campo se muestre de forma más consistente a través de diversos navegadores; algunos de ellos ponen por defecto esta propiedad en <code>auto</code>, pero en nuestro caso, es mejor asegurarse de que todos estén en <code>auto.</code></p>
+
+<pre class="brush: css">textarea {
+  display : block;
+
+  padding : 10px;
+  margin  : 10px 0 0 -10px;
+  width   : 340px;
+  height  : 360px;
+
+  resize  : none;
+  overflow: auto;
+}</pre>
+
+<p>El elemento <code style="line-height: 19.0909080505371px;"><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/button" style="line-height: 19.0909080505371px;" title="This article hasn't been written yet. Please consider contributing!">&lt;button&gt;</a> </code>se acomoda muy bien a CSS; se puede hacer lo que se quiera con el, ¡incluso utilizando<code style="line-height: 19.0909080505371px;"> <a href="https://developer.mozilla.org/en-US/docs/CSS/Pseudo-elements">pseudo-elementos</a>!</code></p>
+
+<pre class="brush: css">button {
+  position     : absolute;
+  left         : 440px;
+  top          : 360px;
+
+  padding      : 5px;
+
+  font         : bold .6em sans-serif;
+  border       : 2px solid #333;
+  border-radius: 5px;
+  background   : none;
+
+  cursor       : pointer;
+
+-webkit-transform: rotate(-1.5deg);
+   -moz-transform: rotate(-1.5deg);
+    -ms-transform: rotate(-1.5deg);
+     -o-transform: rotate(-1.5deg);
+        transform: rotate(-1.5deg);
+}
+
+button:after {
+  content: " &gt;&gt;&gt;";
+}
+
+button:hover,
+button:focus {
+  outline   : none;
+  background: #000;
+  color   : #FFF;
+}</pre>
+
+<p>Y ¡listo! Sientase libre de probarlo usted mismo; como comprobará ¡esto funciona!</p>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>Como puede verse, mientras que queramos construir formularios solo con campos de texto y botones, es sencillo aplicarles estilos con CSS. Si desea saber más pequeños trucos de CSS que le hagan más fácil la vida al trabajar con formularios, echele un vistazo a la parte de formularios de <a href="http://necolas.github.com/normalize.css" rel="external" style="line-height: 19.0909080505371px;" title="http://necolas.github.com/normalize.css">the normalize.css project</a><span style="line-height: 19.0909080505371px;">.</span></p>
+
+<p><span style="line-height: 19.0909080505371px;">En el próximo artículo, veremos como manejar widgets de formulario de la categoría de "el malo" y "el feo".</span></p>
diff --git a/files/es/learn/forms/test_your_skills_colon__html5_controls/index.html b/files/es/learn/forms/test_your_skills_colon__html5_controls/index.html
new file mode 100644
index 0000000000..da67e807c8
--- /dev/null
+++ b/files/es/learn/forms/test_your_skills_colon__html5_controls/index.html
@@ -0,0 +1,76 @@
+---
+title: 'Prueba tus habilidades: controles HTML5'
+slug: Learn/Forms/Test_your_skills:_HTML5_controls
+tags:
+  - Aprendizaje
+  - Evaluación
+  - Formulário
+  - HTML5
+  - Principiante
+translation_of: Learn/Forms/Test_your_skills:_HTML5_controls
+original_slug: Learn/HTML/Forms/Prueba_tus_habilidades:_controles_HTML5
+---
+<div>{{learnsidebar}}</div>
+
+<p>El objetivo de esta prueba es evaluar si has comprendido nuestro artículo <a href="/en-US/docs/Learn/Forms/HTML5_input_types">The HTML5 input types</a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes intentar resolver esta prueba en los editores interactivos más abajo, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a> para trabajar en las tareas.<br>
+ <br>
+ Si te atascas, pide ayuda — mira la sección <a href="https://wiki.developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces#Evaluaci%C3%B3n_o_ayuda_adicional">Evaluación o ayuda adicional</a> al final de esta página.</p>
+</div>
+
+<h2 id="Controles_HTML5_1">Controles HTML5 1</h2>
+
+<p>Primero exploraremos algunos de los tipos nuevos de <code>input</code> en HTML5. Crea las etiquetas <code>input</code> apropiadas para que un usuario actualice sus detalles para:</p>
+
+<ol>
+ <li>Email</li>
+ <li>Website</li>
+ <li>Número de teléfono</li>
+ <li>Color favorito</li>
+</ol>
+
+<p>Intenta actualizar el código en vivo más abajo para retrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/html5-controls/html5-controls1.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="/en-US/docshttps://github.com/mdn/learning-area/blob/master/html/forms/tasks/html5-controls/html5-controls1-download.html">Descarga el código inicial de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Controles_HTML5_2">Controles HTML5 2</h2>
+
+<p>A continuación, queremos que implementes un control deslizante para permitir al usuario escoger el número máximo de personas para invitar a su fiesta.</p>
+
+<ol>
+ <li>Implemente un control deslizante básico que acompañe a la etiqueta provista.</li>
+ <li>Establezca un valor minimo de 1, uno máximo de 30 y un valor inicial de 10.</li>
+ <li>Crea un elemento de salida correspondiente para poner el valor actual del deslizador. Asígnale la clase invite-output, y asocialo semanticamente con le entrada. Si haces esto correctamente, el JavaScript incluido en la página automáticamente actualizará el valor cuando se deslice el control.</li>
+</ol>
+
+<p>Intenta actualizar el código en vivo más abajo para retrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/html5-controls/html5-controls2.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/html5-controls/html5-controls2-download.html">Descarga el código inicial de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
+
+<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
+
+<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
+
+<ol>
+ <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
+ <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
+  <ul>
+   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de controles HTML5 1".</li>
+   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
+   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
+   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
+  </ul>
+ </li>
+</ol>
diff --git a/files/es/learn/forms/test_your_skills_colon__other_controls/index.html b/files/es/learn/forms/test_your_skills_colon__other_controls/index.html
new file mode 100644
index 0000000000..4e3e8a0c45
--- /dev/null
+++ b/files/es/learn/forms/test_your_skills_colon__other_controls/index.html
@@ -0,0 +1,88 @@
+---
+title: 'Prueba tus habilidades: Otros controles'
+slug: Learn/Forms/Test_your_skills:_Other_controls
+translation_of: Learn/Forms/Test_your_skills:_Other_controls
+original_slug: Learn/HTML/Forms/Prueba_tus_habilidades:_Otros_controles
+---
+<div>{{learnsidebar}}</div>
+
+<p>El objetivo de esta pueba de habilidad es evaluar si has comprendido nuestro artículo <a href="/en-US/docs/Learn/Forms/Other_form_controls">Otros controles de formulario</a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes intentar resolver esta prueba en los editores interactivos más abajo, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a> para trabajar en las tareas.<br>
+ <br>
+ Si te atascas, pide ayuda — mira la sección <a href="https://wiki.developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces#Evaluaci%C3%B3n_o_ayuda_adicional">Evaluación o ayuda adicional</a> al final de esta página.</p>
+</div>
+
+<h2 id="Otros_controles_1">Otros controles 1</h2>
+
+<p>En nuestra primera evaluación de "Otros controles", te pediremos crear una entrada de texto de líneas múltiples.</p>
+
+<ol>
+ <li>Crea una entrada básica de texto de múltiples líneas.</li>
+ <li>Asócialo semánticamente con la etiqueta de "Comentario" asociado.</li>
+ <li>Define la entrada con 35 columnas y 10 filas de espacio en cual agregar comentarios.</li>
+ <li>Define para los comentatios una longitud máxima de 100 caracteres.</li>
+</ol>
+
+<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/other-controls/other-controls1.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/other-controls/other-controls1-download.html" rel="noopener">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Otros_controles_2">Otros controles 2</h2>
+
+<p>Ahora es tiempo de implementar un menú desplegable, para permitir al usuario escoger su comida favorita de las opciones entregadas.</p>
+
+<ol>
+ <li>Crea tu estructura de caja básica.</li>
+ <li>Asóciala semánticamente con la etiqueta de "comentarios" entregada.</li>
+ <li>Dentro de la lista, divide las opciones en 2 subgrupos - "principales" y "meriendas".</li>
+</ol>
+
+<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/other-controls/other-controls2.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/other-controls/other-controls2-download.html" rel="noopener">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Otros_controles_3">Otros controles 3</h2>
+
+<p>En la tarea final de esta evaluación, comenzaremos con la misma lista de opciones de comida. Sin embargo, esta vez queremos hacer las cosas de otra forma:</p>
+
+<ol>
+ <li>Crea una entrada de texto básica, que esté asociada semánticamente con la etiqueta entregada.</li>
+ <li>Coloca las opciones de comida en una lista que pueda ser asociada con una entrada de formulario.</li>
+ <li>Asocia la lista con tu entrada de texto, de forma que cuando escribas caracteres, cualquier opción de la lista que coincida con la secuencia de caracteres ingresada, aparezca en un listado desplegable como sugerencia de autocompletado.</li>
+</ol>
+
+<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/other-controls/other-controls3.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/other-controls/other-controls3-download.html" rel="noopener">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
+
+<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
+
+<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
+
+<ol>
+ <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
+ <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
+  <ul>
+   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de Otros controles 1".</li>
+   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
+   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
+   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
+  </ul>
+ </li>
+</ol>
diff --git a/files/es/learn/forms/your_first_form/index.html b/files/es/learn/forms/your_first_form/index.html
new file mode 100644
index 0000000000..8f0d8fe7c9
--- /dev/null
+++ b/files/es/learn/forms/your_first_form/index.html
@@ -0,0 +1,306 @@
+---
+title: Mi primer formulario HTML
+slug: Learn/Forms/Your_first_form
+tags:
+  - Ejemplo
+  - Guía
+  - HTML
+  - Principiante
+  - Web
+  - formulários
+translation_of: Learn/Forms/Your_first_form
+original_slug: Learn/HTML/Forms/Your_first_HTML_form
+---
+<div>{{LearnSidebar}}{{NextMenu("Learn/Forms/How_to_structure_a_web_form", "Learn/Forms")}}</div>
+
+<p class="summary">El primer artículo de nuestra serie te proporciona una primera experiencia de creación de un formulario web, que incluye diseñar un formulario sencillo con controles de formulario adecuados y otros elementos HTML, añadir un poco de estilo muy simple con CSS y describir cómo se envían los datos a un servidor. Ampliaremos cada uno de estos subtemas más adelante.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática y de <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">lenguaje HTML</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Familiarizarse con los formularios web, para qué se usan, cómo diseñarlos y qué elementos HTML básicos vas a necesitar para casos sencillos.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_son_los_formularios_web">¿Qué son los formularios web?</h2>
+
+<p>Los <strong>formularios web</strong> son uno de los principales puntos de interacción entre un usuario y un sitio web o aplicación. Los formularios permiten a los usuarios la introducción de datos, que generalmente se envían a un servidor web para su procesamiento y almacenamiento (consulta <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a> más adelante en el módulo), o se usan en el lado del cliente para provocar de alguna manera una actualización inmediata de la interfaz (por ejemplo, se añade otro elemento a una lista, o se muestra u oculta una función de interfaz de usuario).</p>
+
+<p>El HTML de un <strong>formulario web</strong> está compuesto por uno o más <strong>controles de formulario</strong> (a veces llamados <strong>widgets</strong>), además de algunos elementos adicionales que ayudan a estructurar el formulario general; a menudo se los conoce como <strong>formularios HTML</strong>. Los controles pueden ser campos de texto de una o varias líneas, cajas desplegables, botones, casillas de verificación o botones de opción, y se crean principalmente con el elemento {{htmlelement("input")}}, aunque hay algunos otros elementos que también hay que conocer.</p>
+
+<p>Los controles de formulario también se pueden programar para forzar la introducción de formatos o valores específicos (<strong>validación de formulario</strong>), y se combinan con etiquetas de texto que describen su propósito para los usuarios con y sin discapacidad visual.</p>
+
+<h2 id="Diseñar_tu_formulario">Diseñar tu formulario</h2>
+
+<p>Antes de comenzar a escribir código, siempre es mejor dar un paso atrás y tomarte el tiempo necesario para pensar en tu formulario. Diseñar una maqueta rápida te ayudará a definir el conjunto de datos adecuado que deseas pedirle al usuario que introduzca. Desde el punto de vista de la experiencia del usuario (UX), es importante recordar que cuanto más grande es tu formulario, más te arriesgas a frustrar a las personas y perder usuarios. Tiene que ser simple y conciso: solicita solo los datos que necesitas.</p>
+
+<p>Diseñar formularios es un paso importante cuando creas un sitio web o una aplicación. Va más allá del alcance de este artículo exponer la experiencia de usuario de los formularios, pero si deseas profundizar en ese tema, puedes leer los artículos siguientes:</p>
+
+<ul>
+ <li>Smashing Magazine tiene algunos <a href="https://www.smashingmagazine.com/2018/08/ux-html5-mobile-form-part-1/" rel="external" title="http://uxdesign.smashingmagazine.com/tag/forms/">artículos muy buenos sobre formularios UX</a>, incluido el artículo —antiguo pero relevante— <a href="https://www.smashingmagazine.com/2011/11/extensive-guide-web-form-usability/" rel="external" title="http://uxdesign.smashingmagazine.com/2011/11/08/extensive-guide-web-form-usability/">An Extensive Guide To Web Form Usability</a> [Amplia guía de usabilidad para formularios web].</li>
+ <li>UXMatters también es un recurso que da buenos consejos, desde <a href="http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php" rel="external" title="http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php"> buenas prácticas básicas</a> hasta cuestiones complejas como los <a href="http://www.uxmatters.com/mt/archives/2010/03/pagination-in-web-forms-evaluating-the-effectiveness-of-web-forms.php" title="http://www.uxmatters.com/mt/archives/2010/03/pagination-in-web-forms-evaluating-the-effectiveness-of-web-forms.php"> formularios de varias páginas</a>.</li>
+</ul>
+
+<p>En este artículo, vamos a crear un formulario de contacto sencillo. Hagamos un esbozo.</p>
+
+<p><img alt="Esbozo aproximado del formulario que vamos a construir" src="/files/4579/form-sketch-low.jpg" style="border-style: solid; border-width: 1px; display: block; height: 352px; margin: 0px auto; width: 400px;"></p>
+
+<p>Nuestro formulario va a tener tres campos de texto y un botón. Le pedimos al usuario su nombre, su correo electrónico y el mensaje que desea enviar. Al pulsar el botón sus datos se enviarán a un servidor web.</p>
+
+<h2 id="Aprendizaje_activo_La_implementación_de_nuestro_formulario_HTML">Aprendizaje activo: La implementación de nuestro formulario HTML</h2>
+
+<p>De acuerdo, intentemos crear el HTML para nuestro formulario. Vamos a utilizar los elementos HTML siguientes: {{HTMLelement("form")}}, {{HTMLelement("label")}}, {{HTMLelement("input")}}, {{HTMLelement("textarea")}} y {{HTMLelement("button")}}.</p>
+
+<p>Antes de continuar, haz una copia local de nuestra <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">plantilla HTML simple</a>: introduce aquí tu formulario HTML.</p>
+
+<h3 id="El_elemento_HTMLelementform">El elemento {{HTMLelement("form")}}</h3>
+
+<p>Todos los formularios comienzan con un elemento {{HTMLelement("form")}}, como este:</p>
+
+<pre class="brush:html; notranslate">&lt;form action="/my-handling-form-page" method="post"&gt;
+
+&lt;/form&gt;</pre>
+
+<p>Este elemento define formalmente un formulario. Es un elemento contenedor, como un elemento {{HTMLelement("section")}} o {{HTMLelement("footer")}}, pero específico para contener formularios; también admite algunos atributos específicos para la configuración de la forma en que se comporta el formulario. Todos sus atributos son opcionales, pero es una práctica estándar establecer siempre al menos los atributos <a href="/en-US/docs/Web/HTML/Attributes/action"><code>action</code></a> y <a href="/en-US/docs/Web/HTML/Attributes/method"><code>method</code></a>:</p>
+
+<ul>
+ <li>El atributo <code>action</code> define la ubicación (URL) donde se envían los datos que el formulario ha recopilado cuando se validan.</li>
+ <li>El atributo <code>method</code> define con qué método HTTP se envían los datos (generalmente <code>get</code> o <code>post</code>).</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Veremos cómo funcionan esos atributos en nuestro artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a> que encontrarás más adelante.</p>
+</div>
+
+<p>Por ahora, añade el elemento {{htmlelement("form")}} anterior a tu elemento HTML {{htmlelement("body")}}.</p>
+
+<h3 id="Los_elementos_HTMLelementlabel_HTMLelementinput_y_HTMLelementtextarea">Los elementos {{HTMLelement("label")}}, {{HTMLelement("input")}} y {{HTMLelement("textarea")}}</h3>
+
+<p>Nuestro formulario de contacto no es complejo: la parte para la entrada de datos contiene tres campos de texto, cada uno con su elemento {{HTMLelement("label")}} correspondiente:</p>
+
+<ul>
+ <li>El campo de entrada para el nombre es un {{HTMLelement("input/text", "campo de texto de una sola línea")}}.</li>
+ <li>El campo de entrada para el correo electrónico es una {{HTMLelement ("input/email", "entrada de datos de tipo correo electrónico")}}: un campo de texto de una sola línea que acepta solo direcciones de correo electrónico.</li>
+ <li>El campo de entrada para el mensaje es {{HTMLelement("textarea")}}; un campo de texto multilínea.</li>
+</ul>
+
+<p>En términos de código HTML, para implementar estos controles de formulario necesitamos algo como lo siguiente:</p>
+
+<pre class="brush:html; notranslate" dir="rtl">&lt;form action="/my-handling-form-page" method="post"&gt;
+ &lt;ul&gt;
+  &lt;li&gt;
+    &lt;label for="name"&gt;Nombre:&lt;/label&gt;
+    &lt;input type="text" id="name" name="user_name"&gt;
+  &lt;/li&gt;
+  &lt;li&gt;
+    &lt;label for="mail"&gt;Correo electrónico:&lt;/label&gt;
+    &lt;input type="email" id="mail" name="user_mail"&gt;
+  &lt;/li&gt;
+  &lt;li&gt;
+    &lt;label for="msg"&gt;Mensaje:&lt;/label&gt;
+    &lt;textarea id="msg" name="user_message"&gt;&lt;/textarea&gt;
+  &lt;/li&gt;
+ &lt;/ul&gt;
+&lt;/form&gt;</pre>
+
+<p>Actualiza el código de tu formulario para que se vea como el anterior.</p>
+
+<p>Los elementos {{HTMLelement("li")}} están ahí para estructurar nuestro código convenientemente y facilitar la aplicación de estilo (ver más adelante en el artículo). Por motivos de usabilidad y accesibilidad incluimos una etiqueta explícita para cada control de formulario. Ten en cuenta el uso del atributo <a href="/en-US/docs/Web/HTML/Attributes/for"> <code>for</code> </a> en todos los elementos {{HTMLelement("label")}}, que toma como valor el <a href="/en-US/docs/Web/HTML/Attributes/id"><code>id</code></a> del control de formulario con el que está asociado; así es como asocias un formulario con su etiqueta.</p>
+
+<p>Hacer esto presenta muchas ventajas porque la etiqueta está asociada al control del formulario y permite que los usuarios con ratón, panel táctil y dispositivos táctiles hagan clic en la etiqueta para activar el control correspondiente, y también proporciona accesibilidad con un nombre que los lectores de pantalla leen a sus usuarios. Encontrarás más detalles sobre las etiquetas de los formularios en <a href="/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario web</a>.</p>
+
+<p>En el elemento {{HTMLelement("input")}}, el atributo más importante es <code>type</code>. Este atributo es muy importante porque define la forma en que el elemento {{HTMLelement("input")}} aparece y se comporta. Encontrarás más información sobre esto en el artículo sobre <a href="/es/docs/Learn/HTML/Forms/The_native_form_widgets">Controles de formularios nativos básicos</a> más adelante.</p>
+
+<ul>
+ <li>En nuestro ejemplo sencillo, usamos el valor {{HTMLelement("input/text")}} para la primera entrada, el valor predeterminado para este atributo. Representa un campo de texto básico de una sola línea que acepta cualquier tipo de entrada de texto.</li>
+ <li>Para la segunda entrada, usamos el valor {{HTMLelement("input/email")}}, que define un campo de texto de una sola línea que solo acepta una dirección de correo electrónico. Esto convierte un campo de texto básico en una especie de campo «inteligente» que efectúa algunas comprobaciones de validación de los datos que el usuario escribe. También hace que aparezca un diseño de teclado más apropiado para introducir direcciones de correo electrónico (por ejemplo, con un símbolo @ por defecto) en dispositivos con teclados dinámicos, como teléfonos inteligentes. Encontrarás más información sobre la validación de formularios en el artículo de <a href="/es/docs/Learn/HTML/Forms/Validacion_formulario_datos">Validación de formularios por parte del cliente</a> más adelante.</li>
+</ul>
+
+<p>Por último, pero no por ello menos importante, ten en cuenta la sintaxis de <code>&lt;input&gt;</code> en contraposición con la de <code>&lt;textarea&gt;&lt;/textarea&gt;</code>. Esta es una de las rarezas del HTML. La etiqueta <code>&lt;input&gt;</code> es un elemento vacío, lo que significa que no necesita una etiqueta de cierre. El elemento {{HTMLElement("textarea")}} no es un elemento vacío, lo que significa que debe cerrarse con la etiqueta de cierre adecuada. Esto tiene un impacto en una característica específica de los formularios: el modo en que defines el valor predeterminado. Para definir el valor predeterminado de un elemento {{HTMLElement("input")}}, debes usar el atributo <a href="/en-US/docs/Web/HTML/Attributes/value"><code>value</code></a> de esta manera:</p>
+
+<pre class="brush:html; notranslate">&lt;input type="text" value="por defecto este elemento se llena con este texto"&gt;</pre>
+
+<p>Por otro lado, si deseas definir un valor predeterminado para un elemento {{HTMLElement("textarea")}}, lo colocas entre las etiquetas de apertura y cierre del elemento {{HTMLElement("textarea")}}, así:</p>
+
+<pre class="brush:html; notranslate">&lt;textarea&gt;
+Por defecto, este elemento contiene este texto
+&lt;/textarea&gt;</pre>
+
+<h3 id="El_elemento_HTMLelementbutton">El elemento {{HTMLelement("button")}}</h3>
+
+<p>El marcado de nuestro formulario está casi completo; solo necesitamos añadir un botón para permitir que el usuario envíe sus datos una vez que haya completado el formulario. Esto se hace con el elemento {{HTMLelement("button")}}; añade lo siguiente justo encima de la etiqueta de cierre <code>&lt;/form&gt;</code>:</p>
+
+<pre class="brush:html; notranslate">&lt;li class="button"&gt;
+  &lt;button type="submit"&gt;Envíe su mensaje&lt;/button&gt;
+&lt;/li&gt;</pre>
+
+<p>El elemento {{htmlelement("button")}} también acepta un atributo de <code>type</code>, que a su vez acepta uno de estos tres valores: <code>submit</code>, <code>reset</code> o <code>button</code>.</p>
+
+<ul>
+ <li>Un clic en un botón <code>submit</code> (el valor predeterminado) envía los datos del formulario a la página web definida por el atributo <code>action</code> del elemento {{HTMLelement("form")}}.</li>
+ <li>Un clic en un botón <code>reset</code> restablece de inmediato todos los controles de formulario a su valor predeterminado. Desde el punto de vista de UX, esto se considera una mala práctica, por lo que debes evitar usar este tipo de botones a menos que realmente tengas una buena razón para incluirlos.</li>
+ <li>Un clic en un botón <code>button</code> no hace... ¡nada! Eso suena tonto, pero es muy útil para crear botones personalizados: puedes definir su función con JavaScript.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: También puedes usar el elemento {{HTMLElement("input")}} con el atributo <code>type</code> correspondiente para generar un botón, por ejemplo <code>&lt;input type="submit"&gt;</code>. La ventaja principal del elemento {{HTMLelement("button")}} es que el elemento {{HTMLelement("input")}} solo permite texto sin formato en su etiqueta, mientras que el elemento {{HTMLelement("button")}} permite contenido HTML completo, lo que permite generar botones creativos más complejos.</p>
+</div>
+
+<h2 id="Aplicar_estilo_básico_a_un_formulario">Aplicar estilo básico a un formulario</h2>
+
+<p>Ahora que has terminado de escribir el código HTML de tu formulario, guárdalo y observa lo que ocurre en un navegador. Por ahora, se verá bastante feo.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si crees que no has escrito bien el código HTML, compáralo con nuestro ejemplo final: véase <a href="https://github.com/mdn/learning-area/blob/master/html/forms/your-first-HTML-form/first-form.html">first-form.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/your-first-HTML-form/first-form.html">ver en vivo</a>).</p>
+</div>
+
+<p>Resulta notablemente difícil aplicar estilo a los formularios. Está más allá del alcance de este artículo enseñarte cómo aplicar estilo a los formularios en detalle, por lo que por el momento solo vamos a exponer cómo añadir un poco de CSS para que se vea un poco bien.</p>
+
+<p>En primer lugar, añade un elemento {{htmlelement("style")}} a tu página, dentro de la cabecera del HTML. Debe quedar así:</p>
+
+<pre class="brush: html notranslate">&lt;style&gt;
+
+&lt;/style&gt;</pre>
+
+<p>Dentro de las etiquetas <code>style</code>, añade el código CSS siguiente:</p>
+
+<pre class="brush:css; notranslate">form {
+  /* Centrar el formulario en la página */
+  margin: 0 auto;
+  width: 400px;
+  /* Esquema del formulario */
+  padding: 1em;
+  border: 1px solid #CCC;
+  border-radius: 1em;
+}
+
+ul {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+form li + li {
+  margin-top: 1em;
+}
+
+label {
+  /* Tamaño y alineación uniforme */
+  display: inline-block;
+  width: 90px;
+  text-align: right;
+}
+
+input,
+textarea {
+  /* Para asegurarse de que todos los campos de texto tienen la misma configuración de letra
+     Por defecto, las áreas de texto tienen un tipo de letra monoespaciada */
+  font: 1em sans-serif;
+
+  /* Tamaño uniforme del campo de texto */
+  width: 300px;
+  box-sizing: border-box;
+
+  /* Hacer coincidir los bordes del campo del formulario */
+  border: 1px solid #999;
+}
+
+input:focus,
+textarea:focus {
+  /* Destacado adicional para elementos que tienen el cursor */
+  border-color: #000;
+}
+
+textarea {
+  /* Alinear los campos de texto multilínea con sus etiquetas */
+  vertical-align: top;
+
+  /* Proporcionar espacio para escribir texto */
+  height: 5em;
+}
+
+.button {
+  /* Alinear los botones con los campos de texto */
+  padding-left: 90px; /* mismo tamaño que los elementos de la etiqueta */
+}
+
+button {
+  /* Este margen adicional representa aproximadamente el mismo espacio que el espacio
+     entre las etiquetas y sus campos de texto */
+  margin-left: .5em;
+}</pre>
+
+<p>Guarda y vuelve a cargar, y observa que tu formulario presenta un aspecto mucho menos feo.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar nuestra versión en GitHub en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/your-first-HTML-form/first-form-styled.html">first-form-styled.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/your-first-HTML-form/first-form-styled.html">ver en vivo</a>).</p>
+</div>
+
+<h2 id="Enviar_los_datos_del_formulario_a_un_servidor_web">Enviar los datos del formulario a un servidor web</h2>
+
+<p>La última parte, y quizás la más complicada, es manejar los datos del formulario en el lado del servidor. El elemento {{HTMLelement("form")}} define dónde y cómo enviar los datos gracias a los atributos <a href="/en-US/docs/Web/HTML/Attributes/action"><code>action</code></a> y <a href="/en-US/docs/Web/HTML/Attributes/method"><code>method</code></a>.</p>
+
+<p>Proporcionamos un nombre (<a href="/en-US/docs/Web/HTML/Attributes/name"><code>name</code></a>) a cada control de formulario. Los nombres son importantes tanto en el lado del cliente como del servidor; le dicen al navegador qué nombre debe dar a cada dato y, en el lado del servidor, dejan que el servidor maneje cada dato por su nombre. Los datos del formulario se envían al servidor como pares de nombre/valor.</p>
+
+<p>Para poner nombre a los diversos datos que se introducen en un formulario, debes usar el atributo <code>name</code> en cada control de formulario que recopila un dato específico. Veamos de nuevo algunos de nuestros códigos de formulario:</p>
+
+<pre class="brush:html; notranslate">&lt;form action="/my-handling-form-page" method="post"&gt;
+ &lt;ul&gt;
+  &lt;li&gt;
+    &lt;label for="name"&gt;Nombre:&lt;/label&gt;
+    &lt;input type="text" id="name" name="user_name" /&gt;
+  &lt;/li&gt;
+  &lt;li&gt;
+    &lt;label for="mail"&gt;Correo electrónico:&lt;/label&gt;
+    &lt;input type="email" id="mail" name="user_email" /&gt;
+  &lt;/li&gt;
+  &lt;li&gt;
+    &lt;label for="msg"&gt;Mensaje:&lt;/label&gt;
+    &lt;textarea id="msg" name="user_message"&gt;&lt;/textarea&gt;
+  &lt;/li&gt;
+
+  ...
+</pre>
+
+<p>En nuestro ejemplo, el formulario envía tres datos denominados «<code>user_name</code>», «<code>user_email</code>» y «<code>user_message</code>». Esos datos se envían a la URL «<code>/my-handling-form-page</code>» utilizando el método <a href="/en-US/docs/Web/HTTP/Methods/POST"><code>post</code> de HTTP</a>.</p>
+
+<p>En el lado del servidor, la secuencia de comandos de la URL «<code>/my-handling-form-page</code>» recibe los datos como una lista de tres elementos clave/valor contenidos en la solicitud HTTP. La forma en que este script maneja esos datos depende de ti. Cada lenguaje de servidor (PHP, Python, Ruby, Java, C#, etc.) tiene su propio mecanismo de manipulación de datos de formulario. No profundizaremos sobre el tema en esta guía, pero si deseas obtener más información, proporcionamos algunos ejemplos en nuestro artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data"><span>Enviar los datos de un formulario</span></a> que encontrarás más adelante.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>¡Enhorabuena!, has creado tu primer formulario web. Debería verse así:</p>
+
+<p>{{ EmbedLiveSample('A_simple_form', '100%', '240', '', 'Learn/Forms/Your_first_form/Example') }}</p>
+
+<p>Pero esto es solo el comienzo: ahora ha llegado el momento de profundizar en el tema. Los formularios tienen mucho más potencial de lo que hemos visto aquí y los artículos siguientes de este módulo te ayudarán a dominarlo.</p>
+
+<p>{{NextMenu("Learn/Forms/How_to_structure_a_web_form", "Learn/Forms")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Forms/Your_first_form">Tu primer formulario</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/How_to_structure_a_web_form">Cómo estructurar un formulario web</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">Los controles de formulario básicos originales</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/HTML5_input_types">Los tipos de entrada en HTML5</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Other_form_controls">Otros controles de formulario</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Styling_web_forms">Aplicación de estilo a formularios web</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Aplicación de estilo a formularios avanzada</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/UI_pseudo-classes">Pseudoclases UI</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Form_validation">Validación del formulario del lado del cliente</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
+</ul>
+
+<h3 id="Temas_avanzados">Temas avanzados</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_controls">Cómo construir controles de formulario personalizados</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Sending_forms_through_JavaScript">Enviar formularios a través de JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad para las propiedades de los controles de formulario</a></li>
+</ul>
diff --git a/files/es/learn/front-end_web_developer/index.html b/files/es/learn/front-end_web_developer/index.html
new file mode 100644
index 0000000000..a6f82bb539
--- /dev/null
+++ b/files/es/learn/front-end_web_developer/index.html
@@ -0,0 +1,202 @@
+---
+title: Desarrollo web Front-end
+slug: Learn/Front-end_web_developer
+tags:
+  - Aprender
+  - CSS
+  - De lado del cliente
+  - Estándar Web
+  - Estándares web
+  - Front-end
+  - HTML
+  - Herramientas
+  - JavaScript
+  - Novato
+  - Principiante
+translation_of: Learn/Front-end_web_developer
+original_slug: Learn/Desarrollo_web_Front-end
+---
+<p>{{learnsidebar}}</p>
+
+<p>¡Bienvenido a la ruta de aprendizaje para desarrolladores de la interfaz de usuario web!</p>
+
+<p>Aquí se te proporciona un curso estructurado que te enseñará todo lo que necesitas saber para convertirte en un desarrollador de la interfaz de usuario web. Simplemente trabaja en cada sección, aprendiendo nuevas habilidades (o mejorando las existentes) sobre la marcha. Cada sección incluye desafíos y ejercicios para evaluar tu comprensión antes de seguir adelante.</p>
+
+<h2 id="Temas_tratados">Temas tratados</h2>
+
+<p>Los temas tratados son:</p>
+
+<ul>
+ <li>Configuración básica y conocimientos sobre cómo aprender</li>
+ <li>Estándares web y mejores prácticas (como accesibilidad y compatibilidad entre navegadores)</li>
+ <li>HTML, el lenguaje que da estructura y significado al contenido web</li>
+ <li>CSS, el lenguaje utilizado para aplicar estilo a las páginas web</li>
+ <li>JavaScript, el lenguaje programado por medio de <em>scripts</em> utilizado para crear funciones dinámicas en la web.</li>
+ <li>Herramientas que se utilizan para facilitar el desarrollo web moderno de lado del cliente.</li>
+</ul>
+
+<p>Puedes trabajar en las secciones en orden, pero cada una también es autónoma. Por ejemplo, si ya conoces HTML, puedes pasar a la sección CSS.</p>
+
+<h2 id="Prerrequisitos">Prerrequisitos</h2>
+
+<p>No necesitas conocimientos previos para empezar este curso. Todo lo que necesitas es una computadora que pueda ejecutar navegadores web modernos, una conexión a Internet y la voluntad de aprender.</p>
+
+<p>Si no estás seguro de si el desarrollo de la interfaz de usuario web es para ti, y/o deseas una breve introducción antes de comenzar un curso más largo y completo, consulta una {{web.link("/es/docs/Learn/Getting_started_with_the_web", "Introducción a la Web")}}.</p>
+
+<h2 id="Cómo_obtener_ayuda">Cómo obtener ayuda</h2>
+
+<p>Hemos tratado de hacer que el desarrollo de la interfaz de usuario web sea lo más cómodo posible, pero probablemente todavía quedes encallado porque no entiendes algo o porque algún código simplemente no funciona.</p>
+
+<p>No entres en pánico. Todos hemos encallado, sin importar que seamos desarrolladores web principiantes o profesionales. El artículo {{web.link("/es/docs/Learn/Learning_and_getting_help", "Aprender y obtener ayuda")}} te brinda una serie de consejos para buscar información y ayudarte a ti mismo. Si aún estás atascado, no dudes en publicar una pregunta en nuestro <a href="https://discourse.mozilla.org/c/mdn/learn/">Foro de discusión</a>.</p>
+
+<p>Empecemos. ¡Diviértete!</p>
+
+<h2 id="El_camino_del_aprendizaje">El camino del aprendizaje</h2>
+
+<h3 id="Primeros_pasos">Primeros pasos</h3>
+
+<p>Tiempo para completar: 1.5 a 2 horas</p>
+
+<h4 id="Prerrequisitos_2">Prerrequisitos</h4>
+
+<p>Nada excepto conocimientos básicos de informática.</p>
+
+<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante">¿Cómo sabré que estoy listo para seguir adelante?</h4>
+
+<p>No hay evaluaciones en esta parte del curso. Pero asegúrate de no saltarla. Es importante prepararte para trabajar en la resolución de los ejercicios más adelante en el curso.</p>
+
+<h4 id="Guías">Guías</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/Getting_started_with_the_web/Installing_basic_software", "Instalación de software básico")}}: configuración básica de las herramientas (lectura de 15 minutos)</li>
+ <li>{{web.link("/es/docs/Learn/Getting_started_with_the_web/The_web_and_web_standards", "Información básica sobre la web y los estándares web")}} (lectura de 45 minutos)</li>
+ <li>{{web.link("/es/docs/Learn/Learning_and_getting_help", "Aprender y obtener ayuda")}} (lectura de 45 minutos)</li>
+</ul>
+
+<h3 id="Semántica_y_estructura_con_HTML">Semántica y estructura con HTML</h3>
+
+<p>Tiempo para completar: 35 a 50 horas</p>
+
+<h4 id="Prerrequisitos_3">Prerrequisitos</h4>
+
+<p>Nada, excepto: conocimientos básicos de informática y un entorno de desarrollo web básico.</p>
+
+<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_2">¿Cómo sabré que estoy listo para seguir adelante?</h4>
+
+<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
+
+<h4 id="Módulos">Módulos</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML", "Introducción a HTML")}} (15 a 20 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Multimedia_and_embedding", "Multimedia e inserción")}} (15 a 20 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Tables", "tablas HTML")}} (5 a 10 horas de lectura/ejercicios)</li>
+</ul>
+
+<h3 id="Estilo_y_diseño_con_CSS">Estilo y diseño con CSS</h3>
+
+<p>Tiempo para completar: 90 a 120 horas</p>
+
+<h4 id="Prerrequisitos_4">Prerrequisitos</h4>
+
+<p>Es recomendable que tengas conocimientos básicos de HTML antes de comenzar a aprender CSS. Primero deberías estudiar {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML", "Introducción a HTML")}} por lo menos.</p>
+
+<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_3">¿Cómo sabré que estoy listo para seguir adelante?</h4>
+
+<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
+
+<h4 id="Módulos_2">Módulos</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/CSS/First_steps", "Primeros pasos de CSS" )}} (10 a 15 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/CSS/Building_blocks", "Bloques de construcción de CSS")}} (35 a 45 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/CSS/Styling_text", "Diseño de texto")}} (15 a 20 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/CSS/CSS_layout", "Diseño CSS")}} (30 a 40 horas de lectura/ejercicios)</li>
+</ul>
+
+<h4 id="Recursos_adicionales">Recursos adicionales</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Web/CSS/Layout_cookbook", "Libro de recetas de diseño CSS")}}</li>
+</ul>
+
+<h3 id="Interactividad_con_JavaScript">Interactividad con JavaScript</h3>
+
+<p>Tiempo para completar: 135 a 185 horas</p>
+
+<h4 id="Prerrequisitos_5">Prerrequisitos</h4>
+
+<p>Es recomendable que tengas conocimientos básicos de HTML antes de comenzar a aprender JavaScript. Primero deberías estudiar {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML", "Introducción a HTML")}} por lo menos.</p>
+
+<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_4">¿Cómo sabré que estoy listo para seguir adelante?</h4>
+
+<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
+
+<h4 id="Módulos_3">Módulos</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/JavaScript/First_steps", "Primeros pasos en JavaScript")}} (30 a 40 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/JavaScript/Building_blocks", "Bloques de construcción de JavaScript")}} (25 a 35 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/JavaScript/Objects", "Introducción a los objetos JavaScript")}} (25 a 35 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/JavaScript/Client-side_web_APIs", "API web del lado del cliente")}} (30 a 40 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/JavaScript/Asynchronous", "JavaScript asincrónico")}} (25 a 35 horas de lectura/ejercicios)</li>
+</ul>
+
+<h3 id="Formularios_web_—_Trabajar_con_datos_del_usuario">Formularios web — Trabajar con datos del usuario</h3>
+
+<p>Tiempo para completar: 40 a 50 horas</p>
+
+<h4 id="Prerrequisitos_6">Prerrequisitos</h4>
+
+<p>Los formularios requieren conocimientos de HTML, CSS y JavaScript. Dada la complejidad de trabajar con formularios, es un tema dedicado.</p>
+
+<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_5">¿Cómo sabré que estoy listo para seguir adelante?</h4>
+
+<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
+
+<h4 id="Módulos_4">Módulos</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/Forms", "Formularios web")}} (40 a 50 horas)</li>
+</ul>
+
+<h3 id="Hacer_que_la_web_funcione_para_todos">Hacer que la web funcione para todos</h3>
+
+<p>Tiempo para completar: 60 a 75 horas</p>
+
+<h4 id="Prerrequisitos_7">Prerrequisitos</h4>
+
+<p>Es una buena idea conocer HTML, CSS y JavaScript antes de trabajar en esta sección. Muchas de las técnicas y mejores prácticas se refieren a múltiples tecnologías.</p>
+
+<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_6">¿Cómo sabré que estoy listo para seguir adelante?</h4>
+
+<p>Las evaluaciones de cada módulo están diseñadas para comprobar tu conocimiento del tema. Completar las evaluaciones confirma que estás listo para pasar al siguiente módulo.</p>
+
+<h4 id="Módulos_5">Módulos</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/Tools_and_testing/Cross_browser_testing", "Pruebas en varios navegadores")}} (25 a 30 horas de lectura/ejercicios)</li>
+ <li>{{web.link("/es/docs/Learn/Accessibility", "Accesibilidad")}} (20 a 25 horas de lectura/ejercicios)</li>
+</ul>
+
+<h3 id="Herramientas_modernas">Herramientas modernas</h3>
+
+<p>Tiempo para completar: 55 a 90 horas</p>
+
+<h4 id="Prerrequisitos_8">Prerrequisitos</h4>
+
+<p>Es una buena idea conocer HTML, CSS y JavaScript antes de trabajar en esta sección, ya que las herramientas analizadas funcionan junto con muchas de estas tecnologías.</p>
+
+<h4 id="¿Cómo_sabré_que_estoy_listo_para_seguir_adelante_7">¿Cómo sabré que estoy listo para seguir adelante?</h4>
+
+<p>No hay artículos de evaluación específicos en este conjunto de módulos. Los tutoriales de casos de estudio al final del segundo y tercer módulo te preparan para comprender los conceptos básicos de las herramientas modernas.</p>
+
+<h4 id="Módulos_6">Módulos</h4>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/Tools_and_testing/GitHub", "Git y GitHub")}} (lectura de 5 horas)</li>
+ <li>{{web.link("/es/docs/Learn/Tools_and_testing/Understanding_client-side_tools", "Comprender las herramientas de desarrollo web del lado del cliente")}} (lectura de 20 a 25 horas)</li>
+ <li>
+  <p>{{web.link("/es/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks", "Comprender los marcos de JavaScript de lado del cliente")}} (30 a 60 horas de lectura/ejercicios)</p>
+ </li>
+</ul>
diff --git a/files/es/learn/getting_started_with_the_web/cómo_funciona_la_web/index.html b/files/es/learn/getting_started_with_the_web/cómo_funciona_la_web/index.html
deleted file mode 100644
index 546baf0309..0000000000
--- a/files/es/learn/getting_started_with_the_web/cómo_funciona_la_web/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: Cómo funciona la web
-slug: Learn/Getting_started_with_the_web/Cómo_funciona_la_Web
-tags:
-  - Cliente
-  - DNS
-  - HTTP
-  - IP
-  - Infraestructura
-  - Internet
-  - Principiante
-  - Protocolos
-  - Servidor
-  - TCP
-  - Web
-translation_of: Learn/Getting_started_with_the_web/How_the_Web_works
----
-<div>{{LearnSidebar()}}</div>
-
-<div>{{PreviousMenu("Learn/Getting_started_with_the_web/Publishing_your_website", "Learn/Getting_started_with_the_web")}}</div>
-
-<div class="summary">
-<p><em>Cómo funciona la web</em> proporciona una vista simplificada de lo que sucede cuando ves una página web en un navegador web de tu computador o teléfono.</p>
-</div>
-
-<p>Esta teoría no es esencial para escribir código web a corto plazo, pero en poco tiempo empezarás a beneficiarte realmente al entender lo que está sucediendo en el fondo.</p>
-
-<h2 id="Los_clientes_y_servidores">Los clientes y servidores</h2>
-
-<p>Las computadoras conectadas a la web se llaman <strong>clientes</strong> y <strong>servidores</strong>. Un diagrama simplificado de cómo interactúan se vería así:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/17299/Cliente-Servidor.png" style="height: 123px; width: 336px;"></p>
-
-<ul>
- <li>Los clientes son dispositivos de los usuarios conectados a Internet (por ejemplo, tu ordenador conectado a la red Wi-Fi o el teléfono conectado a la red de telefonía móvil) y el software que se encuentra disponible y permite acceder a Internet en dichos dispositivos (normalmente, un navegador web como Firefox o Chrome).</li>
- <li>Los servidores son computadores que almacenan páginas web, sitios o aplicaciones. Cuando un dispositivo cliente quiere acceder a una página web, una copia de la página web se descarga desde el servidor en el equipo cliente y se muestra en el navegador web del usuario.</li>
-</ul>
-
-<h2 id="Las_otras_partes_de_la_caja_de_herramientas">Las otras partes de la caja de herramientas</h2>
-
-<p>El cliente y el servidor que describimos anteriormente, no cuentan toda la historia. Hay muchas otras partes involucradas y vamos a describirlas a continuación.</p>
-
-<p>Por ahora, imaginemos que la web es un camino. En un extremo de la carretera, está el cliente, que es como tu casa. En el extremo opuesto del camino, está el servidor, que es una tienda en la que deseas comprar algo.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/9749/road.jpg" style="display: block; height: 427px; margin: 0px auto; width: 640px;"></p>
-
-<p>Además del cliente y el servidor, también tenemos que saludar a:</p>
-
-<ul>
- <li><strong>Tu conexión a Internet</strong>: permite enviar y recibir datos en la web. Básicamente es el recorrido entre tu casa y la tienda.</li>
- <li><strong>TCP/IP</strong>: <strong>Protocolo de Control de Transmisión</strong> y <strong>Protocolo de Internet</strong>, son los protocolos de comunicación que definen cómo deben viajar los datos a través de la web. Esto es, los medios de transporte que te permiten hacer un pedido, ir a la tienda y comprar los productos. En nuestro ejemplo, podría ser un coche, una bicicleta o tus propios pies.</li>
- <li><strong>DNS: </strong>los servidores del <strong>Sistema de Nombres de Dominio</strong> (DNS, por sus siglas en inglés), son como una libreta de direcciones de sitios web. Cuando escribes una dirección web en el navegador, el navegador busca los DNS antes de recuperar el sitio web. El navegador necesita averiguar en qué servidor vive el sitio web y así enviar los mensajes HTTP al lugar correcto (ver más abajo). Esto es como buscar la dirección de la tienda para que puedas llegar a ella.</li>
- <li><strong>HTTP: </strong><span class="st">el <strong>Protocolo de Transferencia de Hipertexto</strong></span> es un protocolo de aplicación que define un idioma para que los clientes y servidores se puedan comunicar. Esto es como el idioma que utilizas para ordenar tus compras.</li>
- <li><strong>Archivos componentes</strong>: un sitio web se compone de muchos archivos diferentes, que son como las diferentes partes de los productos que comprarás en la tienda. Estos archivos se dividen en dos tipos principales:
-  <ul>
-   <li><strong>Archivos de código</strong>: los sitios web se construyen principalmente con HTML, CSS y JavaScript, aunque te encontrarás con otras tecnologías más adelante.</li>
-   <li><strong>Recursos: </strong>este es un nombre colectivo para el resto de materiales que conforman un sitio web, como imágenes, música, video, documentos de Word, archivos PDF, etc.</li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Entonces_¿qué_sucede_exactamente">Entonces, ¿qué sucede exactamente?</h2>
-
-<p>Cuando escribes una dirección web en el navegador (usando nuestra analogía para ir a la tienda):</p>
-
-<ol>
- <li>El navegador va al servidor DNS y encuentra la dirección real del servidor donde el sitio web vive (encontrar la dirección de la tienda).</li>
- <li>El navegador envía un mensaje de petición HTTP al servidor, pidiéndole que envíe una copia de la página web para el cliente (ir a la tienda y hacer un pedido). Este mensaje y todos los datos enviados entre el cliente y el servidor, se envían a través de tu conexión a Internet usando TCP/IP.</li>
- <li>Siempre que el servidor apruebe la solicitud del cliente, el servidor enviará al cliente un mensaje «200 OK», que significa, «¡por supuesto que puedes ver ese sitio web! Aquí está.», y comenzará a enviar los archivos de la página web al navegador como una serie de pequeños trozos llamados <em>paquetes de datos</em> (la tienda te entrega tus productos y los llevas de regreso a casa).</li>
- <li>El navegador reúne los pequeños trozos, forma un sitio web completo y te lo muestra (llegas a casa con tus nuevas compras).</li>
-</ol>
-
-<h2 id="Explicación_de_los_DNS">Explicación de los DNS</h2>
-
-<p>Las direcciones webs reales no son las agradables y fácilmente recordables secuencias que tecleas en la barra de direcciones para encontrar tus sitios webs favoritos. En realidad, se trata de secuencias de números, algo como 63.245.217.105.</p>
-
-<p>Lo anterior se llama <a href="/es/docs/Glossary/IP_Address">dirección IP</a> y representa un lugar único en la web. Sin embargo, no es muy fácil de recordar, ¿verdad? Por eso se inventaron los servidores de nombres de dominio. Estos son servidores especiales que hacen coincidir una dirección web tecleada desde tu navegador («mozilla.org», por ejemplo) con la dirección real del sitio web (IP).</p>
-
-<p>Los sitios webs se pueden acceder directamente a través de sus direcciones IP. Intenta acceder a la página web de Mozilla escribiendo <strong><code>63.245.217.105</code></strong> en la barra de dirección de una nueva pestaña en tu navegador. Puedes encontrar la dirección IP de un sitio web escribiendo su dominio en una herramienta como <a href="https://ipinfo.info/html/ip_checker.php">IP Checker</a>.</p>
-
-<p><img alt="Un nombre de dominio es más que otra forma de una dirección IP" src="https://mdn.mozillademos.org/files/8405/dns-ip.png" style="height: 160px; width: 330px;"></p>
-
-<h2 id="Explicación_de_los_paquetes">Explicación de los paquetes</h2>
-
-<p>Anteriormente hemos utilizado el término <em><strong>paquetes</strong></em> para describir el formato en que los datos se envían desde el servidor al cliente. ¿Qué significa esto? Básicamente, que los datos se envían a través de la web como miles de trozos pequeños, permitiendo que muchos usuarios pueden descargar la misma página web al mismo tiempo. Si los sitios web fueran enviados como grandes trozos, sólo un usuario podría descargarlos a la vez, lo que volvería a la web muy ineficiente y poco divertida.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Learn/Common_questions/How_does_the_Internet_work">¿Cómo funciona Internet</a></li>
- <li><a href="https://dev.opera.com/articles/http-basic-introduction/">HTTP: Un protocolo de nivel de aplicación </a>(en inglés)</li>
- <li><a href="https://dev.opera.com/articles/http-lets-get-it-on/">HTTP: Trabajemos con él</a> (en inglés)</li>
- <li><a href="https://dev.opera.com/articles/http-response-codes/">Códigos de respuesta: HTTP</a>  (en inglés)</li>
-</ul>
-
-<h2 id="Crédito">Crédito</h2>
-
-<p>Foto de la calle: Street Composing, por <a href="https://www.flickr.com/photos/kdigga/">Kevin </a>D.</p>
-
-<p>{{PreviousMenu("Learn/Getting_started_with_the_web/Publishing_your_website", "Learn/Getting_started_with_the_web")}}</p>
diff --git a/files/es/learn/getting_started_with_the_web/dealing_with_files/index.html b/files/es/learn/getting_started_with_the_web/dealing_with_files/index.html
new file mode 100644
index 0000000000..85ca42d01c
--- /dev/null
+++ b/files/es/learn/getting_started_with_the_web/dealing_with_files/index.html
@@ -0,0 +1,121 @@
+---
+title: Manejo de archivos
+slug: Learn/Getting_started_with_the_web/Dealing_with_files
+tags:
+  - Archivos
+  - Guía
+  - HTML
+  - Novato
+  - Principiante
+  - Scripting
+  - Sitios Web
+  - l10n:priority
+  - teorias
+translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
+original_slug: Learn/Getting_started_with_the_web/Manejando_los_archivos
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web/HTML_basics", "Learn/Getting_started_with_the_web")}}</div>
+
+<div class="summary">
+<p>Un sitio web consta de muchos archivos: texto del contenido, código, hojas de estilo, contenido multimedia, etc. Cuando estás creando un sitio web, necesitas ensamblar estos archivos en una estructura sensible en tu computadora local, asegurarte de que puedan comunicarse entre sí y hacer que todo su contenido se vea bien antes de que eventualmente {{web.link("/es/Learn/Getting_started_with_the_web/Publishing_your_website", "los cargues en un servidor")}}. El <em>manejo de archivos</em> analiza algunos problemas que debes tener en cuenta, para que puedas configurar una estructura de archivos adecuada para tu sitio web.</p>
+</div>
+
+<h2 id="¿Dónde_debería_estar_tu_sitio_web_en_tu_computadora">¿Dónde debería estar tu sitio web en tu computadora?</h2>
+
+<p>Cuando estés trabajando en un sitio web localmente en tu computadora, debes mantener todos los archivos relacionados en un solo directorio que refleje la estructura de archivos del sitio web publicado en el servidor. Este directorio se puede ubicar en cualquier lugar que desees, pero debes colocarlo en algún lugar donde lo puedas encontrar fácilmente, tal vez en tu escritorio, en tu directorio de inicio o en la raíz de tu disco duro.</p>
+
+<ol>
+ <li>Elige un lugar para almacenar los proyectos de tus sitios web. Dentro del lugar elegido, crea un nuevo directorio llamado <code>proyectosweb</code> (o algo similar). Aquí es donde vivirán todos los proyectos de tus sitios web.</li>
+ <li>Dentro de este primer directorio, crea otro directorio para almacenar tu primer sitio web. Llámalo <code>pruebasitio</code> (o algo más imaginativo).</li>
+</ol>
+
+<h2 id="Una_acotación_sobre_la_envoltura_y_el_espaciado">Una acotación sobre la envoltura y el espaciado</h2>
+
+<p>Notarás que a lo largo de este artículo, te pedimos que nombres los directorios y archivos completamente en minúsculas sin espacios. Esto es porque:</p>
+
+<ol>
+ <li>Muchas computadoras, particularmente los servidores web, distinguen entre mayúsculas y minúsculas. Entonces, por ejemplo, si colocas una imagen en tu sitio web en <code>pruebasitio/MiImagen.jpg</code> y luego, en un archivo diferente intentas invocar la imagen como <code>pruebasitio/miimagen.jpg</code>, puede que no funcione.</li>
+ <li>Los navegadores, servidores web y lenguajes de programación no manejan los espacios de manera consistente. Por ejemplo, si usas espacios en tu nombre de archivo, algunos sistemas pueden tratar el nombre de archivo como dos nombres de archivo. Algunos servidores reemplazarán las áreas en tus nombres de archivo con "%20" (el código de caracteres para espacios en URI), lo cual provocará que todos tus enlaces se rompan. Es mejor separar las palabras con guiones, en lugar de guiones bajos: <code>mi-archivo.html</code> vs. <code>mi_archivo.html</code>.</li>
+</ol>
+
+<p>La respuesta corta es que debes usar un guión para los nombres de tus archivos. El motor de búsqueda de Google trata un guión como un separador de palabras, pero no considera un guión bajo de esa manera. Por estos motivos, es mejor adquirir el hábito de escribir los nombres de los directorios y archivos en minúsculas, sin espacios y con palabras separadas por guiones, al menos hasta que sepas lo que estás haciendo. De esa manera, tropezarás con menos problemas en el futuro.</p>
+
+<h2 id="¿Qué_estructura_debe_tener_tu_sitio_web">¿Qué estructura debe tener tu sitio web?</h2>
+
+<p>A continuación, veamos qué estructura debería tener tu sitio de prueba. Las cosas más comunes que tendrás en cualquier proyecto de sitio web que crees son un archivo de índice HTML y directorios para contener imágenes, archivos de estilo y archivos de script. Crea estos ahora:</p>
+
+<ol>
+ <li><code><strong>index.html</strong></code>: Este archivo generalmente tendrá el contenido de tu página de inicio, es decir, el texto y las imágenes que las personas ven cuando visitan tu sitio por primera vez. Usando tu editor de texto, crea un nuevo archivo llamado <code>index.html</code> y guárdalo dentro de tu directorio <code>pruebasitio</code>.</li>
+ <li>Directorio <strong><code>images</code></strong>: Este directorio contendrá todas las imágenes que utilices en tu sitio. Crea un directorio llamado <code>images</code>, dentro de tu directorio <code>pruebasitio</code>.</li>
+ <li>Directorio <strong><code>styles</code></strong>: Este directorio contendrá el código CSS que se utiliza para aplicar estilo al contenido (por ejemplo, configurar el texto y los colores de fondo). Crea un directorio llamado <code>styles</code>, dentro de tu directorio <code>pruebasitio</code>.</li>
+ <li>Directorio <strong><code>scripts</code></strong>: Este directorio contendrá todo el código JavaScript utilizado para agregar funcionalidad interactiva a tu sitio (por ejemplo, botones que cargan datos cuando se hace clic en ellos). Crea un directorio llamado <code>scripts</code>, dentro de tu directorio <code>pruebasitio</code>.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: En las computadoras con Windows, es posible que tengas problemas para ver los nombres de los archivos, porque de manera predeterminada, Windows tiene activada una opción llamada <strong>Ocultar extensiones para tipos de archivos conocidos</strong>. Generalmente, la puedes desactivar yendo al Explorador de Windows, seleccionando la opción <strong>Opciones de directorio...</strong>, desmarcando la casilla de verificación <strong>Ocultar extensiones para tipos de archivo conocidos</strong> y luego haciendo clic en <strong>Aceptar</strong>. Para obtener información más específica sobre tu versión de Windows, puedes buscar en la web.</p>
+</div>
+
+<h2 id="Rutas_de_archivo">Rutas de archivo</h2>
+
+<p>Para que los archivos se comuniquen entre sí, debes proporcionar una ruta de archivo entre ellos, básicamente una ruta, para que un archivo sepa dónde está otro. Para demostrarlo, insertaremos un poco de HTML en nuestro archivo <code>index.html</code> y haremos que muestre la imagen que elegiste en el artículo {{web.link("/es/docs/Learn/Getting_started_with_the_web/What_will_your_website_look_like#Imágenes", "¿Cómo se verá tu sitio web?")}}</p>
+
+<ol>
+ <li>Copia la imagen que elegiste anteriormente en tu directorio <code>images</code>.</li>
+ <li>Abre tu archivo <code>index.html</code> e inserta el siguiente código en el archivo exactamente como se muestra. Por ahora, no te preocupes por lo que significa todo esto; veremos las estructuras con más detalle más adelante en la serie.
+  <pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Mi página de prueba&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;img src="" alt="Mi imagen de prueba"&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+ </li>
+ <li>La línea <code>&lt;img src="" alt="Mi imagen de prueba"&gt;</code> es el código HTML que inserta una imagen en la página. Necesitamos decirle al HTML dónde está la imagen. La imagen está dentro del directorio <em>images</em>, que está en el mismo directorio que <code>index.html</code>. Para recorrer la estructura del archivo desde <code>index.html</code> hasta nuestra imagen, la ruta del archivo que necesitamos es <code>images/nombre-archivo-imagen</code>. Por ejemplo, nuestra imagen se llama <code>firefox-icon.png</code>, por lo que la ruta del archivo es <code>images/firefox-icon.png</code>.</li>
+ <li>Inserta la ruta del archivo en tu código HTML entre las comillas dobles del código <code>src=""</code>.</li>
+ <li>Guarda tu archivo HTML, luego cárgalo en tu navegador web (haz doble clic en el archivo). ¡Deberías ver tu nueva página web mostrando tu imagen!</li>
+</ol>
+
+<p><img alt="Una captura de pantalla del sitio web básico que muestra solo el logotipo de Firefox: un zorro en llamas envolviendo el mundo" src="https://mdn.mozillademos.org/files/9229/website-screenshot.png" style="display: block; height: 542px; margin: 0px auto; width: 690px;"></p>
+
+<p>Algunas reglas generales para las rutas de archivo:</p>
+
+<ul>
+ <li>Para vincular a un archivo destino en el mismo directorio que el archivo HTML de invocación, simplemente usa el nombre del archivo, p. ej. <code>mi-imagen.jpg</code>.</li>
+ <li>Para hacer referencia a un archivo en un subdirectorio, escribe el nombre del directorio delante de la ruta, más una barra inclinada, p. ej. <code>subdirectorio/mi-imagen.jpg</code>.</li>
+ <li>Para vincular a un archivo destino en el directorio <strong>arriba</strong> del archivo HTML que lo invoca, escribe dos puntos. Por ejemplo, si <code>index.html</code> estuviera dentro de un subdirectorio de <code>pruebasitio</code> y <code>mi-imagen.jpg</code> estuviera dentro de <code>pruebasitio</code>, puedes hacer referencia a <code>mi-imagen.jpg</code> desde <code>index.html</code> utilizando <code>../mi-imagen.jpg</code>.</li>
+ <li>Los puedes combinar tanto como desees, por ejemplo, <code>../subdirectorio/otro-subdirectorio/mi-imagen.jpg</code>.</li>
+</ul>
+
+<p>Por ahora, esto es todo lo que necesitas saber.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El sistema de archivos de Windows tiende a utilizar barras invertidas, no barras diagonales, p. ej. <code>C:\windows</code>. Esto no importa en HTML, incluso si estás desarrollando tu sitio web en Windows, debes usar barras diagonales en tu código.</p>
+</div>
+
+<h2 id="¿Qué_más_se_debería_hacer">¿Qué más se debería hacer?</h2>
+
+<p>Eso es todo por ahora. La estructura de tu directorio debería verse así:</p>
+
+<p><img alt="Una estructura de archivos en mac os x finder, que muestra un directorio de imágenes con una imagen, directorios de estilos y scripts vacíos, y un archivo index.html" src="https://mdn.mozillademos.org/files/9231/file-structure.png" style="display: block; height: 577px; margin: 0px auto; width: 929px;"></p>
+
+<p>{{PreviousMenuNext("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web/HTML_basics", "Learn/Getting_started_with_the_web")}}</p>
+
+
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li id="Instalacion_de_software_basico">{{web.link("/es/Learn/Getting_started_with_the_web/Instalacion_de_software_basico", "Instalación de software básico")}}</li>
+ <li id="Como_se_vera_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/What_will_your_website_look_like", "¿Cómo se verá tu sitio web?")}}</li>
+ <li id="Manejo_de_archivos">{{web.link("/es/Learn/Getting_started_with_the_web/Manejando_los_archivos", "Manejo de archivos")}}</li>
+ <li id="Conceptos_basicos_de_HTML">{{web.link("/es/Learn/Getting_started_with_the_web/HTML_basics", "Conceptos básicos de HTML")}}</li>
+ <li id="Conceptos_basicos_de_CSS">{{web.link("/es/Learn/Getting_started_with_the_web/CSS_basics", "Conceptos básicos de CSS")}}</li>
+ <li id="Conceptos_basicos_de_JavaScript">{{web.link("/es/Learn/Getting_started_with_the_web/JavaScript_basics", "Conceptos básicos de JavaScript")}}</li>
+ <li id="Publicar_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/Publishing_your_website", "Publicar tu sitio web")}}</li>
+ <li id="Como_funciona_la_web">{{web.link("/es/docs/Learn/Getting_started_with_the_web/Cómo_funciona_la_Web", "Cómo funciona la Web")}}</li>
+</ul>
diff --git a/files/es/learn/getting_started_with_the_web/how_the_web_works/index.html b/files/es/learn/getting_started_with_the_web/how_the_web_works/index.html
new file mode 100644
index 0000000000..ccf641f1e4
--- /dev/null
+++ b/files/es/learn/getting_started_with_the_web/how_the_web_works/index.html
@@ -0,0 +1,101 @@
+---
+title: Cómo funciona la web
+slug: Learn/Getting_started_with_the_web/How_the_Web_works
+tags:
+  - Cliente
+  - DNS
+  - HTTP
+  - IP
+  - Infraestructura
+  - Internet
+  - Principiante
+  - Protocolos
+  - Servidor
+  - TCP
+  - Web
+translation_of: Learn/Getting_started_with_the_web/How_the_Web_works
+original_slug: Learn/Getting_started_with_the_web/Cómo_funciona_la_Web
+---
+<div>{{LearnSidebar()}}</div>
+
+<div>{{PreviousMenu("Learn/Getting_started_with_the_web/Publishing_your_website", "Learn/Getting_started_with_the_web")}}</div>
+
+<div class="summary">
+<p><em>Cómo funciona la web</em> proporciona una vista simplificada de lo que sucede cuando ves una página web en un navegador web de tu computador o teléfono.</p>
+</div>
+
+<p>Esta teoría no es esencial para escribir código web a corto plazo, pero en poco tiempo empezarás a beneficiarte realmente al entender lo que está sucediendo en el fondo.</p>
+
+<h2 id="Los_clientes_y_servidores">Los clientes y servidores</h2>
+
+<p>Las computadoras conectadas a la web se llaman <strong>clientes</strong> y <strong>servidores</strong>. Un diagrama simplificado de cómo interactúan se vería así:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/17299/Cliente-Servidor.png" style="height: 123px; width: 336px;"></p>
+
+<ul>
+ <li>Los clientes son dispositivos de los usuarios conectados a Internet (por ejemplo, tu ordenador conectado a la red Wi-Fi o el teléfono conectado a la red de telefonía móvil) y el software que se encuentra disponible y permite acceder a Internet en dichos dispositivos (normalmente, un navegador web como Firefox o Chrome).</li>
+ <li>Los servidores son computadores que almacenan páginas web, sitios o aplicaciones. Cuando un dispositivo cliente quiere acceder a una página web, una copia de la página web se descarga desde el servidor en el equipo cliente y se muestra en el navegador web del usuario.</li>
+</ul>
+
+<h2 id="Las_otras_partes_de_la_caja_de_herramientas">Las otras partes de la caja de herramientas</h2>
+
+<p>El cliente y el servidor que describimos anteriormente, no cuentan toda la historia. Hay muchas otras partes involucradas y vamos a describirlas a continuación.</p>
+
+<p>Por ahora, imaginemos que la web es un camino. En un extremo de la carretera, está el cliente, que es como tu casa. En el extremo opuesto del camino, está el servidor, que es una tienda en la que deseas comprar algo.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/9749/road.jpg" style="display: block; height: 427px; margin: 0px auto; width: 640px;"></p>
+
+<p>Además del cliente y el servidor, también tenemos que saludar a:</p>
+
+<ul>
+ <li><strong>Tu conexión a Internet</strong>: permite enviar y recibir datos en la web. Básicamente es el recorrido entre tu casa y la tienda.</li>
+ <li><strong>TCP/IP</strong>: <strong>Protocolo de Control de Transmisión</strong> y <strong>Protocolo de Internet</strong>, son los protocolos de comunicación que definen cómo deben viajar los datos a través de la web. Esto es, los medios de transporte que te permiten hacer un pedido, ir a la tienda y comprar los productos. En nuestro ejemplo, podría ser un coche, una bicicleta o tus propios pies.</li>
+ <li><strong>DNS: </strong>los servidores del <strong>Sistema de Nombres de Dominio</strong> (DNS, por sus siglas en inglés), son como una libreta de direcciones de sitios web. Cuando escribes una dirección web en el navegador, el navegador busca los DNS antes de recuperar el sitio web. El navegador necesita averiguar en qué servidor vive el sitio web y así enviar los mensajes HTTP al lugar correcto (ver más abajo). Esto es como buscar la dirección de la tienda para que puedas llegar a ella.</li>
+ <li><strong>HTTP: </strong><span class="st">el <strong>Protocolo de Transferencia de Hipertexto</strong></span> es un protocolo de aplicación que define un idioma para que los clientes y servidores se puedan comunicar. Esto es como el idioma que utilizas para ordenar tus compras.</li>
+ <li><strong>Archivos componentes</strong>: un sitio web se compone de muchos archivos diferentes, que son como las diferentes partes de los productos que comprarás en la tienda. Estos archivos se dividen en dos tipos principales:
+  <ul>
+   <li><strong>Archivos de código</strong>: los sitios web se construyen principalmente con HTML, CSS y JavaScript, aunque te encontrarás con otras tecnologías más adelante.</li>
+   <li><strong>Recursos: </strong>este es un nombre colectivo para el resto de materiales que conforman un sitio web, como imágenes, música, video, documentos de Word, archivos PDF, etc.</li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Entonces_¿qué_sucede_exactamente">Entonces, ¿qué sucede exactamente?</h2>
+
+<p>Cuando escribes una dirección web en el navegador (usando nuestra analogía para ir a la tienda):</p>
+
+<ol>
+ <li>El navegador va al servidor DNS y encuentra la dirección real del servidor donde el sitio web vive (encontrar la dirección de la tienda).</li>
+ <li>El navegador envía un mensaje de petición HTTP al servidor, pidiéndole que envíe una copia de la página web para el cliente (ir a la tienda y hacer un pedido). Este mensaje y todos los datos enviados entre el cliente y el servidor, se envían a través de tu conexión a Internet usando TCP/IP.</li>
+ <li>Siempre que el servidor apruebe la solicitud del cliente, el servidor enviará al cliente un mensaje «200 OK», que significa, «¡por supuesto que puedes ver ese sitio web! Aquí está.», y comenzará a enviar los archivos de la página web al navegador como una serie de pequeños trozos llamados <em>paquetes de datos</em> (la tienda te entrega tus productos y los llevas de regreso a casa).</li>
+ <li>El navegador reúne los pequeños trozos, forma un sitio web completo y te lo muestra (llegas a casa con tus nuevas compras).</li>
+</ol>
+
+<h2 id="Explicación_de_los_DNS">Explicación de los DNS</h2>
+
+<p>Las direcciones webs reales no son las agradables y fácilmente recordables secuencias que tecleas en la barra de direcciones para encontrar tus sitios webs favoritos. En realidad, se trata de secuencias de números, algo como 63.245.217.105.</p>
+
+<p>Lo anterior se llama <a href="/es/docs/Glossary/IP_Address">dirección IP</a> y representa un lugar único en la web. Sin embargo, no es muy fácil de recordar, ¿verdad? Por eso se inventaron los servidores de nombres de dominio. Estos son servidores especiales que hacen coincidir una dirección web tecleada desde tu navegador («mozilla.org», por ejemplo) con la dirección real del sitio web (IP).</p>
+
+<p>Los sitios webs se pueden acceder directamente a través de sus direcciones IP. Intenta acceder a la página web de Mozilla escribiendo <strong><code>63.245.217.105</code></strong> en la barra de dirección de una nueva pestaña en tu navegador. Puedes encontrar la dirección IP de un sitio web escribiendo su dominio en una herramienta como <a href="https://ipinfo.info/html/ip_checker.php">IP Checker</a>.</p>
+
+<p><img alt="Un nombre de dominio es más que otra forma de una dirección IP" src="https://mdn.mozillademos.org/files/8405/dns-ip.png" style="height: 160px; width: 330px;"></p>
+
+<h2 id="Explicación_de_los_paquetes">Explicación de los paquetes</h2>
+
+<p>Anteriormente hemos utilizado el término <em><strong>paquetes</strong></em> para describir el formato en que los datos se envían desde el servidor al cliente. ¿Qué significa esto? Básicamente, que los datos se envían a través de la web como miles de trozos pequeños, permitiendo que muchos usuarios pueden descargar la misma página web al mismo tiempo. Si los sitios web fueran enviados como grandes trozos, sólo un usuario podría descargarlos a la vez, lo que volvería a la web muy ineficiente y poco divertida.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Learn/Common_questions/How_does_the_Internet_work">¿Cómo funciona Internet</a></li>
+ <li><a href="https://dev.opera.com/articles/http-basic-introduction/">HTTP: Un protocolo de nivel de aplicación </a>(en inglés)</li>
+ <li><a href="https://dev.opera.com/articles/http-lets-get-it-on/">HTTP: Trabajemos con él</a> (en inglés)</li>
+ <li><a href="https://dev.opera.com/articles/http-response-codes/">Códigos de respuesta: HTTP</a>  (en inglés)</li>
+</ul>
+
+<h2 id="Crédito">Crédito</h2>
+
+<p>Foto de la calle: Street Composing, por <a href="https://www.flickr.com/photos/kdigga/">Kevin </a>D.</p>
+
+<p>{{PreviousMenu("Learn/Getting_started_with_the_web/Publishing_your_website", "Learn/Getting_started_with_the_web")}}</p>
diff --git a/files/es/learn/getting_started_with_the_web/instalacion_de_software_basico/index.html b/files/es/learn/getting_started_with_the_web/instalacion_de_software_basico/index.html
deleted file mode 100644
index 84ffdcf666..0000000000
--- a/files/es/learn/getting_started_with_the_web/instalacion_de_software_basico/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: Instalación de software básico
-slug: Learn/Getting_started_with_the_web/Instalacion_de_software_basico
-tags:
-  - Aprender
-  - Configuración
-  - Herramientas
-  - Navegadores
-  - Novato
-  - Principiantes
-  - aprende
-  - buscador
-  - editor de textos
-  - instalar
-  - 'l10n:priority'
-translation_of: Learn/Getting_started_with_the_web/Installing_basic_software
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web")}}</div>
-
-<div class="summary">
-<p>La <em>Instalación de software básico</em>, te muestra las herramientas que necesitas para hacer el desarrollo web simple, y la forma de instalarlas correctamente.</p>
-</div>
-
-<h2 id="¿Qué_herramientas_usan_los_profesionales">¿Qué herramientas usan los profesionales?</h2>
-
-<ul>
- <li><strong>Una computadora</strong>. Tal vez esto suena obvio para algunas personas, pero habrá quien esté leyendo este artículo desde el móvil o una computadora de biblioteca. Para el desarrollo web serio, es mejor invertir en un equipo de escritorio o portátil con Windows, Mac o Linux.</li>
- <li><strong>Un editor de texto</strong>, para escribir código. Puedes usar un editor de texto libre (ej. <a href="http://brackets.io/">Brackets</a>, <a href="https://atom.io/">Atom</a>, <a href="https://notepad-plus-plus.org/">Notepad++</a>, <a href="https://www.sublimetext.com/">Sublime Text</a>, <a href="https://www.gnu.org/software/emacs/">GNU Emacs</a>, <a href="https://www.vim.org/">VIM</a>, <a href="https://code.visualstudio.com/">Visual Studio Code</a>, <a href="https://www.jetbrains.com/webstorm/">WebStorm</a>) o un editor híbrido (<a href="https://www.adobe.com/products/dreamweaver.html">Dreamweaver</a>). Los editores de documentos de oficina no son adecuados para esto, pues dependen de elementos ocultos que interfieren con los motores de renderizado usados por los navegadores.</li>
- <li><strong>Navegadores web</strong>, para probar el código. Actualmente los navegadores más usados son <a href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/">Opera</a>, <a href="https://www.apple.com/safari/">Safari</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>, <a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">Internet Explorer</a> y <a href="https://www.microsoft.com/en-us/windows/microsoft-edge">Microsoft Edge</a>. También debes comprobar cómo funciona tu web en dispositivos móviles y en cualquier navegador antiguo que tu público objetivo pueda estar usando aún (tal como IE 6–8.)</li>
- <li><strong>Un editor de gráficos o imágenes</strong>, como <a href="http://www.gimp.org/">GIMP</a>, <a href="http://www.getpaint.net/">Paint.NET</a> o <a href="https://www.adobe.com/products/photoshop.html">Photoshop</a>, para crear imágenes para tus páginas web.</li>
- <li><strong>Un sistema de control de versiones</strong>, para administrar archivos en servidores, colaborar en un proyecto con un equipo, compartir código y recursos, y evitar conflictos de edición. Hoy en día <a href="http://git-scm.com/">Git</a> es el sistema de control de versiones más popular y el servicio de alojamiento de código <a href="https://github.com/">GitHub</a>, basado en Git, también es muy popular.</li>
- <li><strong>Un programa de FTP</strong>, para cargar páginas web en un servidor para el público (Git está reemplazando cada vez más a FTP para ese fin). Hay un montón de estos programas disponibles incluyendo <a href="https://cyberduck.io/">Cyberduck</a>, <a href="http://fetchsoftworks.com/">Fetch</a> y <a href="https://filezilla-project.org/">FileZilla</a>.</li>
- <li><strong>Un sistema de automatización</strong>, como <a href="http://gruntjs.com/">Grunt</a> o <a href="http://gulpjs.com/">Gulp</a> para realizar tareas repetitivas de forma automática, por ejemplo minimización de código y ejecución de pruebas.</li>
- <li>Bibliotecas, marcos de desarrollo (<code>frameworks</code>), etc., para acelerar la escritura de funciones comunes. Una biblioteca tiende a ser un archivo JavaScript o CSS existente que proporciona una funcionalidad lista para usar para que la utilices en tu código. Un framework tiende a llevar esta idea más allá, ofreciendo un sistema completo con alguna sintaxis personalizada para que puedas escribir una aplicación web basada en él.</li>
- <li>¡Muchas más herramientas!</li>
-</ul>
-
-<h2 id="Ahora_mismo_¿qué_herramientas_necesitas_realmente">Ahora mismo: ¿qué herramientas necesitas realmente?</h2>
-
-<p>Esto parece una lista espeluznante pero, afortunadamente, puedes comenzar a trabajar en el desarrollo web sin saber nada de la mayoría de estas herramientas. En este artículo solo tendrás que configurar lo mínimo: un editor de texto y algunos navegadores web modernos.</p>
-
-<h3 id="Instalación_de_un_editor_de_texto">Instalación de un editor de texto</h3>
-
-<p>Probablemente ya tengas un editor de texto básico instalado en tu computadora. De manera predeterminada Windows incluye el {{Interwiki("wikipedia", "Bloc de notas")}} y OS X viene con {{Interwiki("wikipedia", "TextEdit")}}. Las <em>distros</em> (versiones) de Linux varían: Ubuntu viene con {{Interwiki("wikipedia", "Gedit")}}; distribuciones basadas en KDE suelen traer <a href="http://kate-editor.org/">Kate</a> o <a href="https://es.wikipedia.org/wiki/KWrite">Kwrite</a>.</p>
-
-<p>Para el desarrollo Web, probablemente hay cosas mejores que el Bloc de notas o TextEdit. Una recomendación puede ser empezar con <a href="http://brackets.io">Brackets</a>, un editor gratuito que ofrece vistas previas en vivo y sugerencias de código.</p>
-
-<h3 id="Instalación_de_navegadores_web_modernos">Instalación de navegadores web modernos</h3>
-
-<p>Por ahora, solo tendrás que instalar un par de navegadores web de escritorio para poner a prueba tu código. Selecciona tu sistema operativo y pulsa los enlaces pertinentes para descargar los instaladores de tus navegadores preferidos:</p>
-
-<ul>
- <li>Linux: <a href="https://www.mozilla.org/es-ES/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/es/">Opera</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>.</li>
- <li>Windows: <a href="https://www.mozilla.org/es-ES/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/es/">Opera</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>, <a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">Internet Explorer</a> (si tienes Windows 8 o superior, puedes instalar IE 10 o posterior, de lo contrario, deberías instalar un navegador alternativo).</li>
- <li>Mac: <a href="https://www.mozilla.org/es-ES/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/es/">Opera</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>, <a href="https://www.apple.com/safari/">Safari</a> (Safari de manera predeterminada viene con iOS y OS X)</li>
-</ul>
-
-<p>Antes de continuar, deberías instalar al menos dos de estos navegadores y tenerlos disponibles para pruebas.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Internet Explorer no es compatible con algunas funciones web modernas y es posible que no puedas ejecutar tu proyecto. Por lo general, no necesitas preocuparte por hacer que tus proyectos web sean compatibles con él, ya que muy pocas personas todavía lo usan; ciertamente, no te preocupes demasiado por él mientras aprendes. En ocasiones, es posible que te encuentres con un proyecto que requiera soporte.</p>
-</div>
-
-<h3 id="Instalación_de_un_servidor_web_local">Instalación de un servidor web local</h3>
-
-<p>Algunos ejemplos necesitarás ejecutarlos a través de un servidor web para que funcionen exitosamente. Puedes encontrar cómo hacer esto en {{web.link("/es/docs/Learn/Common_questions/set_up_a_local_testing_server", "¿Cómo se configura un servidor de prueba local?")}}</p>
-
-<p>{{NextMenu("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li id="Instalacion_de_software_basico">{{web.link("/es/Learn/Getting_started_with_the_web/Instalacion_de_software_basico", "Instalación de software básico")}}</li>
- <li id="Como_se_vera_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/What_will_your_website_look_like", "¿Cómo se verá tu sitio web?")}}</li>
- <li id="Manejo_de_archivos">{{web.link("/es/Learn/Getting_started_with_the_web/Manejando_los_archivos", "Manejo de archivos")}}</li>
- <li id="Conceptos_basicos_de_HTML">{{web.link("/es/Learn/Getting_started_with_the_web/HTML_basics", "Conceptos básicos de HTML")}}</li>
- <li id="Conceptos_basicos_de_CSS">{{web.link("/es/Learn/Getting_started_with_the_web/CSS_basics", "Conceptos básicos de CSS")}}</li>
- <li id="Conceptos_basicos_de_JavaScript">{{web.link("/es/Learn/Getting_started_with_the_web/JavaScript_basics", "Conceptos básicos de JavaScript")}}</li>
- <li id="Publicar_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/Publishing_your_website", "Publicar tu sitio web")}}</li>
- <li id="Como_funciona_la_web">{{web.link("/es/docs/Learn/Getting_started_with_the_web/Cómo_funciona_la_Web", "Cómo funciona la Web")}}</li>
-</ul>
diff --git a/files/es/learn/getting_started_with_the_web/installing_basic_software/index.html b/files/es/learn/getting_started_with_the_web/installing_basic_software/index.html
new file mode 100644
index 0000000000..7569624eaf
--- /dev/null
+++ b/files/es/learn/getting_started_with_the_web/installing_basic_software/index.html
@@ -0,0 +1,84 @@
+---
+title: Instalación de software básico
+slug: Learn/Getting_started_with_the_web/Installing_basic_software
+tags:
+  - Aprender
+  - Configuración
+  - Herramientas
+  - Navegadores
+  - Novato
+  - Principiantes
+  - aprende
+  - buscador
+  - editor de textos
+  - instalar
+  - l10n:priority
+translation_of: Learn/Getting_started_with_the_web/Installing_basic_software
+original_slug: Learn/Getting_started_with_the_web/Instalacion_de_software_basico
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web")}}</div>
+
+<div class="summary">
+<p>La <em>Instalación de software básico</em>, te muestra las herramientas que necesitas para hacer el desarrollo web simple, y la forma de instalarlas correctamente.</p>
+</div>
+
+<h2 id="¿Qué_herramientas_usan_los_profesionales">¿Qué herramientas usan los profesionales?</h2>
+
+<ul>
+ <li><strong>Una computadora</strong>. Tal vez esto suena obvio para algunas personas, pero habrá quien esté leyendo este artículo desde el móvil o una computadora de biblioteca. Para el desarrollo web serio, es mejor invertir en un equipo de escritorio o portátil con Windows, Mac o Linux.</li>
+ <li><strong>Un editor de texto</strong>, para escribir código. Puedes usar un editor de texto libre (ej. <a href="http://brackets.io/">Brackets</a>, <a href="https://atom.io/">Atom</a>, <a href="https://notepad-plus-plus.org/">Notepad++</a>, <a href="https://www.sublimetext.com/">Sublime Text</a>, <a href="https://www.gnu.org/software/emacs/">GNU Emacs</a>, <a href="https://www.vim.org/">VIM</a>, <a href="https://code.visualstudio.com/">Visual Studio Code</a>, <a href="https://www.jetbrains.com/webstorm/">WebStorm</a>) o un editor híbrido (<a href="https://www.adobe.com/products/dreamweaver.html">Dreamweaver</a>). Los editores de documentos de oficina no son adecuados para esto, pues dependen de elementos ocultos que interfieren con los motores de renderizado usados por los navegadores.</li>
+ <li><strong>Navegadores web</strong>, para probar el código. Actualmente los navegadores más usados son <a href="https://www.mozilla.org/en-US/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/">Opera</a>, <a href="https://www.apple.com/safari/">Safari</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>, <a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">Internet Explorer</a> y <a href="https://www.microsoft.com/en-us/windows/microsoft-edge">Microsoft Edge</a>. También debes comprobar cómo funciona tu web en dispositivos móviles y en cualquier navegador antiguo que tu público objetivo pueda estar usando aún (tal como IE 6–8.)</li>
+ <li><strong>Un editor de gráficos o imágenes</strong>, como <a href="http://www.gimp.org/">GIMP</a>, <a href="http://www.getpaint.net/">Paint.NET</a> o <a href="https://www.adobe.com/products/photoshop.html">Photoshop</a>, para crear imágenes para tus páginas web.</li>
+ <li><strong>Un sistema de control de versiones</strong>, para administrar archivos en servidores, colaborar en un proyecto con un equipo, compartir código y recursos, y evitar conflictos de edición. Hoy en día <a href="http://git-scm.com/">Git</a> es el sistema de control de versiones más popular y el servicio de alojamiento de código <a href="https://github.com/">GitHub</a>, basado en Git, también es muy popular.</li>
+ <li><strong>Un programa de FTP</strong>, para cargar páginas web en un servidor para el público (Git está reemplazando cada vez más a FTP para ese fin). Hay un montón de estos programas disponibles incluyendo <a href="https://cyberduck.io/">Cyberduck</a>, <a href="http://fetchsoftworks.com/">Fetch</a> y <a href="https://filezilla-project.org/">FileZilla</a>.</li>
+ <li><strong>Un sistema de automatización</strong>, como <a href="http://gruntjs.com/">Grunt</a> o <a href="http://gulpjs.com/">Gulp</a> para realizar tareas repetitivas de forma automática, por ejemplo minimización de código y ejecución de pruebas.</li>
+ <li>Bibliotecas, marcos de desarrollo (<code>frameworks</code>), etc., para acelerar la escritura de funciones comunes. Una biblioteca tiende a ser un archivo JavaScript o CSS existente que proporciona una funcionalidad lista para usar para que la utilices en tu código. Un framework tiende a llevar esta idea más allá, ofreciendo un sistema completo con alguna sintaxis personalizada para que puedas escribir una aplicación web basada en él.</li>
+ <li>¡Muchas más herramientas!</li>
+</ul>
+
+<h2 id="Ahora_mismo_¿qué_herramientas_necesitas_realmente">Ahora mismo: ¿qué herramientas necesitas realmente?</h2>
+
+<p>Esto parece una lista espeluznante pero, afortunadamente, puedes comenzar a trabajar en el desarrollo web sin saber nada de la mayoría de estas herramientas. En este artículo solo tendrás que configurar lo mínimo: un editor de texto y algunos navegadores web modernos.</p>
+
+<h3 id="Instalación_de_un_editor_de_texto">Instalación de un editor de texto</h3>
+
+<p>Probablemente ya tengas un editor de texto básico instalado en tu computadora. De manera predeterminada Windows incluye el {{Interwiki("wikipedia", "Bloc de notas")}} y OS X viene con {{Interwiki("wikipedia", "TextEdit")}}. Las <em>distros</em> (versiones) de Linux varían: Ubuntu viene con {{Interwiki("wikipedia", "Gedit")}}; distribuciones basadas en KDE suelen traer <a href="http://kate-editor.org/">Kate</a> o <a href="https://es.wikipedia.org/wiki/KWrite">Kwrite</a>.</p>
+
+<p>Para el desarrollo Web, probablemente hay cosas mejores que el Bloc de notas o TextEdit. Una recomendación puede ser empezar con <a href="http://brackets.io">Brackets</a>, un editor gratuito que ofrece vistas previas en vivo y sugerencias de código.</p>
+
+<h3 id="Instalación_de_navegadores_web_modernos">Instalación de navegadores web modernos</h3>
+
+<p>Por ahora, solo tendrás que instalar un par de navegadores web de escritorio para poner a prueba tu código. Selecciona tu sistema operativo y pulsa los enlaces pertinentes para descargar los instaladores de tus navegadores preferidos:</p>
+
+<ul>
+ <li>Linux: <a href="https://www.mozilla.org/es-ES/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/es/">Opera</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>.</li>
+ <li>Windows: <a href="https://www.mozilla.org/es-ES/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/es/">Opera</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>, <a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">Internet Explorer</a> (si tienes Windows 8 o superior, puedes instalar IE 10 o posterior, de lo contrario, deberías instalar un navegador alternativo).</li>
+ <li>Mac: <a href="https://www.mozilla.org/es-ES/firefox/new/">Firefox</a>, <a href="https://www.google.com/chrome/browser/">Chrome</a>, <a href="http://www.opera.com/es/">Opera</a>, <a href="https://vivaldi.com/es/">Vivaldi</a>, <a href="https://www.apple.com/safari/">Safari</a> (Safari de manera predeterminada viene con iOS y OS X)</li>
+</ul>
+
+<p>Antes de continuar, deberías instalar al menos dos de estos navegadores y tenerlos disponibles para pruebas.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Internet Explorer no es compatible con algunas funciones web modernas y es posible que no puedas ejecutar tu proyecto. Por lo general, no necesitas preocuparte por hacer que tus proyectos web sean compatibles con él, ya que muy pocas personas todavía lo usan; ciertamente, no te preocupes demasiado por él mientras aprendes. En ocasiones, es posible que te encuentres con un proyecto que requiera soporte.</p>
+</div>
+
+<h3 id="Instalación_de_un_servidor_web_local">Instalación de un servidor web local</h3>
+
+<p>Algunos ejemplos necesitarás ejecutarlos a través de un servidor web para que funcionen exitosamente. Puedes encontrar cómo hacer esto en {{web.link("/es/docs/Learn/Common_questions/set_up_a_local_testing_server", "¿Cómo se configura un servidor de prueba local?")}}</p>
+
+<p>{{NextMenu("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li id="Instalacion_de_software_basico">{{web.link("/es/Learn/Getting_started_with_the_web/Instalacion_de_software_basico", "Instalación de software básico")}}</li>
+ <li id="Como_se_vera_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/What_will_your_website_look_like", "¿Cómo se verá tu sitio web?")}}</li>
+ <li id="Manejo_de_archivos">{{web.link("/es/Learn/Getting_started_with_the_web/Manejando_los_archivos", "Manejo de archivos")}}</li>
+ <li id="Conceptos_basicos_de_HTML">{{web.link("/es/Learn/Getting_started_with_the_web/HTML_basics", "Conceptos básicos de HTML")}}</li>
+ <li id="Conceptos_basicos_de_CSS">{{web.link("/es/Learn/Getting_started_with_the_web/CSS_basics", "Conceptos básicos de CSS")}}</li>
+ <li id="Conceptos_basicos_de_JavaScript">{{web.link("/es/Learn/Getting_started_with_the_web/JavaScript_basics", "Conceptos básicos de JavaScript")}}</li>
+ <li id="Publicar_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/Publishing_your_website", "Publicar tu sitio web")}}</li>
+ <li id="Como_funciona_la_web">{{web.link("/es/docs/Learn/Getting_started_with_the_web/Cómo_funciona_la_Web", "Cómo funciona la Web")}}</li>
+</ul>
diff --git a/files/es/learn/getting_started_with_the_web/la_web_y_los_estandares_web/index.html b/files/es/learn/getting_started_with_the_web/la_web_y_los_estandares_web/index.html
deleted file mode 100644
index daf6e77d18..0000000000
--- a/files/es/learn/getting_started_with_the_web/la_web_y_los_estandares_web/index.html
+++ /dev/null
@@ -1,172 +0,0 @@
----
-title: La web y los estándares web
-slug: Learn/Getting_started_with_the_web/La_web_y_los_estandares_web
-tags:
-  - Estándares web
-  - Front-end
-  - Interfáz de Usuario
-  - Novato
-  - Principiante
-  - Web
-  - aprende
-translation_of: Learn/Getting_started_with_the_web/The_web_and_web_standards
----
-<p dir="ltr">{{learnsidebar}}</p>
-
-<p dir="ltr">Este artículo proporciona algunos antecedentes útiles sobre la Web — cómo surgió, qué son las tecnologías web estándar, cómo funcionan juntas, por qué "desarrollador web" es una gran carrera para elegir y qué tipos de mejores prácticas aprenderás a través de este curso.</p>
-
-<h2 dir="ltr" id="Breve_historia_de_la_web">Breve historia de la web</h2>
-
-<p dir="ltr">Mantendremos esto muy breve, ya que hay muchos artículos (más) detallados de la historia de la web, a los que enlazaremos más adelante (también intenta buscar "historia de la web" en tu motor de búsqueda favorito y ve lo que obtienes, si estás interesado en más detalles).</p>
-
-<p dir="ltr">A fines de la década de 1960, las fuerzas armadas de EE. UU. desarrollaron una red de comunicación llamada {{Glossary("Arpanet")}}. Esta se puede considerar una precursora de la Web, ya que trabajó en la {{interwiki("wikipedia", "conmutación de paquetes")}} y presentó la primera implementación de la {{interwiki("wikipedia", "Familia de protocolos de internet")}} TCP/IP. Estas dos tecnologías forman la base de la infraestructura sobre la que se construye Internet.</p>
-
-<p dir="ltr">En 1980, Tim Berners-Lee (a menudo denominado TimBL) escribió un programa de block de notas llamado ENQUIRE, que presentaba el concepto de enlaces entre diferentes nodos. ¿Te suena familiar?</p>
-
-<p dir="ltr">Avanzó rápidamente hasta 1989, y TimBL escribió <a href="https://www.w3.org/History/1989/proposal.html" rel="noopener">Gestión de la información: una propuesta</a> e hipertexto en el CERN; estas dos publicaciones juntas proporcionaron los antecedentes de cómo funcionaría la web. Recibieron una buena cantidad de interés, suficiente para convencer a los jefes de TimBL de que le permitieran seguir adelante y creara un sistema de hipertexto global.</p>
-
-<p dir="ltr">A finales de 1990, TimBL había creado todo lo necesario para ejecutar la primera versión de la web: {{web.link("/es/docs/Web/HTTP", "HTTP")}}, {{web.link("/es/docs/Web/HTML", "HTML")}}, el primer navegador web, que se llamaba {{interwiki("wikipedia", "WorldWideWeb")}}, un servidor HTTP y algunas páginas web para mirar.</p>
-
-<p dir="ltr">En los años siguientes, la web explotó, se lanzaron varios navegadores, se instalaron miles de servidores web y se crearon millones de páginas web. Bien, este es un muy sencillo resumen de lo que sucedió, pero les prometí un breve resumen.</p>
-
-<p dir="ltr">Un último dato importante para compartir es que en 1994, TimBL fundó el {{interwiki("wikipedia", "World Wide Web Consortium")}} (W3C), una organización que reúne a representantes de muchas empresas de tecnología diferentes para trabajar juntos en la creación de especificaciones de tecnología web. Después de eso, siguieron otras tecnologías como {{web.link("/es/docs/Web/CSS", "CSS")}} y {{web.link("/es/docs/Web/JavaScript", "JavaScript")}}, y la web comenzó a parecerse más a la web que conocemos hoy.</p>
-
-<h2 dir="ltr" id="Estándares_web">Estándares web</h2>
-
-<p dir="ltr"><strong>Los estándares web</strong> son las tecnologías que utilizamos para crear sitios web. Estos estándares existen como extensos documentos técnicos llamados <em>especificaciones</em>, que detallan exactamente cómo debería funcionar la tecnología. Estos documentos no son muy útiles para aprender a usar las tecnologías que describen (es por eso que tenemos sitios como <em>MDN Web Docs</em>), sino que están pensados ​​para que los utilicen los ingenieros de software para implementar esas tecnologías (generalmente en los navegadores web).</p>
-
-<p dir="ltr">Por ejemplo, el <a href="https://html.spec.whatwg.org/multipage/" rel="noopener">lleno de vida Estándar HTML</a> describe exactamente cómo se debe implementar HTML (todos los elementos HTML y sus APIs asociadas y otras tecnologías circundantes).</p>
-
-<p dir="ltr">Los estándares web son creados por organismos de estándares — instituciones que invitan a grupos de personas de diferentes compañías de tecnología a unirse y acordar cómo deberían funcionar las tecnologías de la mejor manera posible para cumplir con todos sus casos de uso. El W3C es el organismo de estándares web más conocido, pero hay otros como <a href="https://whatwg.org/" rel="noopener">WHATWG</a> (que fueron responsables de la modernización del lenguaje HTML), <a href="https://www.ecma-international.org/" rel="noopener">ECMA</a> (que publica el estándar para ECMAScript, en el que se basa JavaScript), <a href="https://www.khronos.org/" rel="noopener">Khronos</a> (que publica tecnologías para gráficos 3D, como WebGL) y otras.</p>
-
-<h3 dir="ltr" id="Estándares_abiertos">Estándares "abiertos"</h3>
-
-<p dir="ltr">Uno de los aspectos clave de los estándares web, que TimBL y el W3C acordaron desde el principio, es que la web (y las tecnologías web) deben ser libres tanto para contribuir como para usar, y no estar gravadas por patentes/licencias. Por lo tanto, cualquiera puede escribir el código para crear un sitio web de forma gratuita y cualquiera puede contribuir al proceso de creación de estándares, donde se escriben las especificaciones.</p>
-
-<p dir="ltr">Debido a que las tecnologías web se crean abiertamente, en colaboración entre muchas empresas diferentes, significa que ninguna empresa las puede controlar, lo cual es algo realmente bueno. No querrías que una sola empresa decidiera repentinamente poner toda la web detrás de un muro de pago, o lanzar una nueva versión de HTML que todos tienen que comprar para continuar creando sitios web, o peor aún, simplemente decidiendo que ya no están interesados, y simplemente apagarlas.</p>
-
-<p dir="ltr">Esto permite que la web siga siendo un recurso público de libre acceso.</p>
-
-<h3 dir="ltr" id="No_rompas_la_web">No rompas la web</h3>
-
-<p dir="ltr">Otra frase que escucharás sobre los estándares web abiertos es "no rompas la web" — la idea es que cualquier tecnología web nueva que se introduzca debe ser compatible con versiones anteriores (es decir, los sitios web antiguos seguirán funcionando) y compatibles con versiones posteriores (las tecnologías futuras a su vez serán compatibles con las que tenemos actualmente). A medida que avances en el material de aprendizaje que se presenta aquí, comenzarás a aprender cómo se hace posible esto con un trabajo de diseño e implementación muy inteligente.</p>
-
-<h2 id="Ser_desarrollador_web_es_bueno">Ser desarrollador web es bueno</h2>
-
-<p>La industria web es un mercado muy atractivo para ingresar si estás buscando trabajo. Las cifras publicadas recientemente dicen que actualmente hay alrededor de 19 millones de desarrolladores web en el mundo, y esa cifra se establecerá en más del doble en la próxima década. Y al mismo tiempo, hay una escasez de habilidades en la industria, entonces, ¿qué mejor momento para aprender sobre desarrollo web?</p>
-
-<p>Sin embargo, no todo es diversión y juegos — crear sitios web es una propuesta más complicada de lo que solía ser, y tendrás que dedicar algo de tiempo a estudiar todas las diferentes tecnologías que necesitas usar, todas las técnicas y las mejores prácticas que necesitas conocer y todos los patrones típicos que se te pedirá que implementes. Te tomará unos meses comenzar realmente a involucrarte en él, y luego deberás seguir aprendiendo para que tu conocimiento se mantenga actualizado con todas las nuevas herramientas y funciones que aparecen en la plataforma web, y seguir practicando y perfeccionando tu oficio.</p>
-
-<p><em>Lo único constante es el cambio.</em></p>
-
-<p>¿Esto suena difícil? No te preocupes: nuestro objetivo es brindarte todo lo que necesitas saber para comenzar, y las cosas serán más fáciles. Una vez que aceptes el cambio constante y la incertidumbre de la web, comenzarás a disfrutar. Como parte de la comunidad web, tendrás toda una red de contactos y material útil para ayudarte, y comenzarás a disfrutar de las posibilidades creativas que brinda.</p>
-
-<p>Ahora eres un creativo digital. Disfruta de la experiencia y el potencial de ganarte la vida.</p>
-
-<h2 id="Descripción_de_las_tecnologías_web_modernas">Descripción de las tecnologías web modernas</h2>
-
-<p>Hay una serie de tecnologías que debes aprender si deseas ser un desarrollador web front-end. En esta sección las describiremos brevemente. Para obtener una explicación más detallada de cómo funcionan juntas algunas de ellas, lee nuestro artículo {{web.link("/es/docs/Learn/Getting_started_with_the_web/How_the_Web_works", "Cómo funciona la web")}}.</p>
-
-<h3 id="Navegadores">Navegadores</h3>
-
-<p>Probablemente estés leyendo estas palabras dentro de un navegador web en este mismo momento (a menos que las hayas impreso o estés utilizando tecnología de asistencia, como un lector de pantalla para leerlas). Los navegadores web son los programas de software que la gente usa para consumir la web e incluyen <a href="https://www.mozilla.org/es-MX/firefox/" rel="noopener">Firefox</a>, <a href="https://www.google.com/intl/es-419/chrome/" rel="noopener">Chrome</a>, <a href="https://www.opera.com/es" rel="noopener">Opera</a>, <a href="https://www.apple.com/mx/safari/" rel="noopener">Safari</a> y <a href="https://www.microsoft.com/es-es/edge" rel="noopener">Edge</a>.</p>
-
-<h3 id="HTTP">HTTP</h3>
-
-<p>El Protocolo de transferencia de hipertexto, o {{web.link("/es/docs/Web/HTTP/Basics_of_HTTP", "HTTP")}}, es un protocolo de mensajería que permite a los navegadores web comunicarse con los servidores web (donde se almacenan los sitios web). Una conversación típica es algo así como</p>
-
-<pre class="brush: bash notranslate">"Hola servidor web. ¿Me puedes dar los archivos que necesito para renderizar bbc.co.uk"?
-
-"Seguro navegador web — aquí los tienes"
-
-[Descarga archivos y renderiza la página web]</pre>
-
-<p>La sintaxis real de los mensajes HTTP (llamados peticiones y respuestas) no es tan legible para los humanos, pero esto te da una idea básica.</p>
-
-<h3 id="HTML_CSS_y_JavaScript">HTML, CSS y JavaScript</h3>
-
-<p>{{web.link("/es/docs/Web/HTML", "HTML")}}, {{web.link("/es/docs/Web/CSS", "CSS")}} y {{web.link("/es/docs/Web/JavaScript", "JavaScript")}} son las tres tecnologías principales que utilizarás para crear un sitio web:</p>
-
-<ul>
- <li>
-  <p>El lenguaje de marcado de hipertexto, o <strong>HTML</strong>, es un lenguaje de marcado que consta de diferentes elementos en los que puedes ajustar (marcar) el contenido para darle significado (semántica) y estructura. El HTML simple se ve así:</p>
-
-  <pre class="brush: html notranslate"><code>&lt;h1&gt;Este es un encabezado de alto nivel&lt;/h1&gt;
-
-&lt;p&gt;Este es un párrafo de texto.&lt;/p&gt;
-
-&lt;img src="cat.jpg" alt="Una imagen de mi gato"&gt;</code></pre>
-
-  <p>Si adoptamos una analogía de la construcción de casas, HTML sería como los cimientos y las paredes de la casa, que le dan estructura y la mantienen unida.</p>
- </li>
- <li>
-  <p>Hojas de estilo en cascada (<strong>CSS</strong> por "<em>Cascading Style Sheets</em>") es un lenguaje basado en reglas que se utiliza para aplicar estilos a tu HTML, por ejemplo, establecer colores del texto y del fondo, agregar bordes, animar cosas o diseñar una página de cierta manera. Como un sencillo ejemplo, el siguiente código convertirá nuestro párrafo HTML en rojo:</p>
-
-  <pre class="notranslate">p  {
-  color: red;
-}</pre>
-
-  <p>En la analogía de la casa, CSS es como la pintura, el papel tapiz, las alfombras y los cuadros que usarías para hacer que la casa se vea bien.</p>
- </li>
- <li>
-  <p><strong>JavaScript</strong> es el lenguaje de programación que usamos para agregar interactividad a los sitios web, desde el cambio de estilo dinámico hasta la obtención de actualizaciones desde el servidor, pasando por gráficos complejos en 3D. El siguiente JavaScript simple almacenará en la memoria una referencia a nuestro párrafo y cambiará el texto dentro de él:</p>
-
-  <pre class="brush: js notranslate">let pElem = document.querySelector('p');
-pElem.textContent =  '¡Cambiamos el texto!';</pre>
-
-  <p>En la analogía de la casa, JavaScript es como la cocina, el televisor, el microondas o la secadora de pelo — las cosas que le dan a tu casa una útil funcionalidad.</p>
- </li>
-</ul>
-
-<h3 id="Herramientas">Herramientas</h3>
-
-<p>Una vez que hayas aprendido las tecnologías "sin procesar" que se pueden usar para crear páginas web (como HTML, CSS y JavaScript), pronto comenzarás a encontrar varias herramientas que puedes usar para hacer tu trabajo más fácil y/o más eficiente. Algunos ejemplos incluyen:</p>
-
-<ul>
- <li>Las {{web.link("/es/docs/Learn/Common_questions/What_are_browser_developer_tools", "herramientas de desarrollo")}} dentro de los navegadores modernos que se pueden usar para depurar tu código.</li>
- <li>{{web.link("/es/docs/Learn/Tools_and_testing/Cross_browser_testing", "Herramientas de prueba")}} que puedes usar para ejecutar pruebas y mostrar si tu código se está comportando como lo esperabas.</li>
- <li>Bibliotecas y marcos de desarrollo construidos sobre JavaScript que te permiten crear ciertos tipos de sitios web de manera mucho más rápida y efectiva.</li>
- <li>Las llamadas "Linternas" (<code>Linters</code> en inglés), que toman un conjunto de reglas, examinan tu código y resaltan los lugares donde no has seguido las reglas correctamente.</li>
- <li>Minificadores, que eliminan todos los espacios en blanco de tus archivos de código fuente para que sean más pequeños y, por lo tanto, se descarguen del servidor más rápidamente.</li>
-</ul>
-
-<h3 id="Marcos_de_desarrollo_y_lenguajes_de_lado_del_servidor">Marcos de desarrollo y lenguajes de lado del servidor</h3>
-
-<p>HTML, CSS y JavaScript son lenguajes de la interfaz del usuario ("<code>front-end</code>" o del lado del cliente), lo cual significa que los ejecuta el navegador para producir la interfaz del sitio web que los usuarios pueden utilizar.</p>
-
-<p>Hay otra clase de lenguajes llamados lenguajes de la interfaz de admiración ("<code>back-end</code>" o de lado del servidor), lo cual significa que se ejecutan en el servidor antes de que el resultado se envíe al navegador para que se muestre. Un uso típico de un lenguaje de lado del servidor es obtener algunos datos de una base de datos y generar algo de HTML para contener los datos, antes de enviar el HTML al navegador para mostrárselo al usuario.</p>
-
-<p>Los lenguajes de lado del servidor de ejemplo incluyen ASP.NET, Python, PHP y NodeJS.</p>
-
-<h2 id="Mejores_prácticas_web">Mejores prácticas web</h2>
-
-<p>Hemos hablado brevemente sobre las tecnologías que utilizarás para crear sitios web. Ahora analicemos las mejores prácticas que debes emplear para asegurarte de que estás utilizando esas tecnologías de la mejor manera posible.</p>
-
-<p>Al hacer desarrollo web, la principal causa de incertidumbre proviene del hecho de que no sabes qué combinación de tecnologías utilizará cada usuario para ver tu sitio web:</p>
-
-<ul>
- <li>El usuario 1 podría estar mirándolo en un iPhone, con una pantalla pequeña y estrecha.</li>
- <li>El usuario 2 puede estar mirándolo en una computadora portátil con Windows con un monitor de pantalla ancha adjunto.</li>
- <li>El usuario 3 puede ser ciego y usar un lector de pantalla para leerle la página web.</li>
- <li>El usuario 4 podría estar usando una máquina de escritorio realmente antigua que no puede ejecutar navegadores modernos.</li>
-</ul>
-
-<p>Debido a que no sabes exactamente qué usarán tus usuarios, debes diseñar a la defensiva — hacer que tu sitio web sea lo más flexible posible, de modo que todos los usuarios anteriores puedan hacer uso de él, incluso si no todos obtienen la misma experiencia. En resumen, estamos tratando de hacer que la web funcione para todos, tanto como sea posible.</p>
-
-<p>Encontrarás los siguientes conceptos en algún momento de tus estudios.</p>
-
-<ul>
- <li><strong>Compatibilidad entre navegadores</strong> — es la práctica de intentar asegurarte de que tu página web funcione en tantos dispositivos como sea posible. Esto incluye el uso de tecnologías compatibles con todos los navegadores, brindando mejores experiencias a los navegadores que pueden manejarlas (mejora progresiva) y/o escribiendo código para que vuelvas a una experiencia más simple pero aún utilizable en navegadores más antiguos (degradación elegante). También implica muchas pruebas para ver si algo falla en ciertos navegadores, y luego más trabajo para corregir esas fallas.</li>
- <li><strong>Diseño web receptivo</strong> — es la práctica de hacer que tu funcionalidad y diseños sean flexibles para que se puedan adaptar automáticamente a diferentes navegadores. Un ejemplo obvio es un sitio web que se presenta de una forma en un navegador de pantalla ancha en el escritorio, pero que se muestra como un diseño de una sola columna más compacto en los navegadores de teléfonos móviles. Intenta ajustar el ancho de la ventana de tu navegador ahora y ve qué sucede.</li>
- <li><strong>Rendimiento</strong> — significa hacer que los sitios web se carguen lo más rápido posible, pero también hacerlos intuitivos y fáciles de usar para que los usuarios no se sientan frustrados y vayan a otro lugar.</li>
- <li><strong>Accesibilidad</strong> — significa hacer que tus sitios web sean utilizables por la mayor cantidad posible de personas (los conceptos relacionados son diversidad e inclusión y diseño inclusivo). Esto incluye a personas con impedimentos visuales, auditivos, cognitivos o físicos. También va más allá de las personas con discapacidad — ¿qué pasa con los jóvenes o los ancianos, las personas de diferentes culturas, las personas que utilizan dispositivos móviles o las personas con conexiones de red lentas o poco fiables?</li>
- <li><strong>Internacionalización</strong> — significa hacer que los sitios web sean utilizables por personas de diferentes culturas, que hablan diferentes idiomas al tuyo. Hay consideraciones técnicas aquí (como alterar tu diseño para que aún funcione bien para idiomas de derecha a izquierda, o incluso verticales) y humanas (tal como usar un lenguaje simple, sin jerga para que las personas que tienen tu idioma ya que su segundo o tercer idioma es más probable que entienda tu texto).</li>
- <li><strong>Privacidad y seguridad</strong>. Estos dos conceptos están relacionados pero son diferentes. La privacidad se refiere a permitir que las personas realicen sus negocios de manera privada y no espiarlos o recopilar más datos de los estrictamente necesarios. La seguridad se refiere a la construcción de tu sitio web de una manera segura para que los usuarios malintencionados no puedan robar la información contenida en él o de tus usuarios.</li>
-</ul>
-
-<h2 dir="ltr" id="Ve_también">Ve también</h2>
-
-<ul dir="ltr">
- <li>{{interwiki("wikipedia", "Historia de la World Wide Web")}}</li>
- <li>{{web.link("/es/docs/Learn/Common_questions/How_does_the_Internet_work", "¿Cómo funciona la internet?")}}</li>
-</ul>
diff --git a/files/es/learn/getting_started_with_the_web/manejando_los_archivos/index.html b/files/es/learn/getting_started_with_the_web/manejando_los_archivos/index.html
deleted file mode 100644
index 0c7f8c4121..0000000000
--- a/files/es/learn/getting_started_with_the_web/manejando_los_archivos/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: Manejo de archivos
-slug: Learn/Getting_started_with_the_web/Manejando_los_archivos
-tags:
-  - Archivos
-  - Guía
-  - HTML
-  - Novato
-  - Principiante
-  - Scripting
-  - Sitios Web
-  - 'l10n:priority'
-  - teorias
-translation_of: Learn/Getting_started_with_the_web/Dealing_with_files
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web/HTML_basics", "Learn/Getting_started_with_the_web")}}</div>
-
-<div class="summary">
-<p>Un sitio web consta de muchos archivos: texto del contenido, código, hojas de estilo, contenido multimedia, etc. Cuando estás creando un sitio web, necesitas ensamblar estos archivos en una estructura sensible en tu computadora local, asegurarte de que puedan comunicarse entre sí y hacer que todo su contenido se vea bien antes de que eventualmente {{web.link("/es/Learn/Getting_started_with_the_web/Publishing_your_website", "los cargues en un servidor")}}. El <em>manejo de archivos</em> analiza algunos problemas que debes tener en cuenta, para que puedas configurar una estructura de archivos adecuada para tu sitio web.</p>
-</div>
-
-<h2 id="¿Dónde_debería_estar_tu_sitio_web_en_tu_computadora">¿Dónde debería estar tu sitio web en tu computadora?</h2>
-
-<p>Cuando estés trabajando en un sitio web localmente en tu computadora, debes mantener todos los archivos relacionados en un solo directorio que refleje la estructura de archivos del sitio web publicado en el servidor. Este directorio se puede ubicar en cualquier lugar que desees, pero debes colocarlo en algún lugar donde lo puedas encontrar fácilmente, tal vez en tu escritorio, en tu directorio de inicio o en la raíz de tu disco duro.</p>
-
-<ol>
- <li>Elige un lugar para almacenar los proyectos de tus sitios web. Dentro del lugar elegido, crea un nuevo directorio llamado <code>proyectosweb</code> (o algo similar). Aquí es donde vivirán todos los proyectos de tus sitios web.</li>
- <li>Dentro de este primer directorio, crea otro directorio para almacenar tu primer sitio web. Llámalo <code>pruebasitio</code> (o algo más imaginativo).</li>
-</ol>
-
-<h2 id="Una_acotación_sobre_la_envoltura_y_el_espaciado">Una acotación sobre la envoltura y el espaciado</h2>
-
-<p>Notarás que a lo largo de este artículo, te pedimos que nombres los directorios y archivos completamente en minúsculas sin espacios. Esto es porque:</p>
-
-<ol>
- <li>Muchas computadoras, particularmente los servidores web, distinguen entre mayúsculas y minúsculas. Entonces, por ejemplo, si colocas una imagen en tu sitio web en <code>pruebasitio/MiImagen.jpg</code> y luego, en un archivo diferente intentas invocar la imagen como <code>pruebasitio/miimagen.jpg</code>, puede que no funcione.</li>
- <li>Los navegadores, servidores web y lenguajes de programación no manejan los espacios de manera consistente. Por ejemplo, si usas espacios en tu nombre de archivo, algunos sistemas pueden tratar el nombre de archivo como dos nombres de archivo. Algunos servidores reemplazarán las áreas en tus nombres de archivo con "%20" (el código de caracteres para espacios en URI), lo cual provocará que todos tus enlaces se rompan. Es mejor separar las palabras con guiones, en lugar de guiones bajos: <code>mi-archivo.html</code> vs. <code>mi_archivo.html</code>.</li>
-</ol>
-
-<p>La respuesta corta es que debes usar un guión para los nombres de tus archivos. El motor de búsqueda de Google trata un guión como un separador de palabras, pero no considera un guión bajo de esa manera. Por estos motivos, es mejor adquirir el hábito de escribir los nombres de los directorios y archivos en minúsculas, sin espacios y con palabras separadas por guiones, al menos hasta que sepas lo que estás haciendo. De esa manera, tropezarás con menos problemas en el futuro.</p>
-
-<h2 id="¿Qué_estructura_debe_tener_tu_sitio_web">¿Qué estructura debe tener tu sitio web?</h2>
-
-<p>A continuación, veamos qué estructura debería tener tu sitio de prueba. Las cosas más comunes que tendrás en cualquier proyecto de sitio web que crees son un archivo de índice HTML y directorios para contener imágenes, archivos de estilo y archivos de script. Crea estos ahora:</p>
-
-<ol>
- <li><code><strong>index.html</strong></code>: Este archivo generalmente tendrá el contenido de tu página de inicio, es decir, el texto y las imágenes que las personas ven cuando visitan tu sitio por primera vez. Usando tu editor de texto, crea un nuevo archivo llamado <code>index.html</code> y guárdalo dentro de tu directorio <code>pruebasitio</code>.</li>
- <li>Directorio <strong><code>images</code></strong>: Este directorio contendrá todas las imágenes que utilices en tu sitio. Crea un directorio llamado <code>images</code>, dentro de tu directorio <code>pruebasitio</code>.</li>
- <li>Directorio <strong><code>styles</code></strong>: Este directorio contendrá el código CSS que se utiliza para aplicar estilo al contenido (por ejemplo, configurar el texto y los colores de fondo). Crea un directorio llamado <code>styles</code>, dentro de tu directorio <code>pruebasitio</code>.</li>
- <li>Directorio <strong><code>scripts</code></strong>: Este directorio contendrá todo el código JavaScript utilizado para agregar funcionalidad interactiva a tu sitio (por ejemplo, botones que cargan datos cuando se hace clic en ellos). Crea un directorio llamado <code>scripts</code>, dentro de tu directorio <code>pruebasitio</code>.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: En las computadoras con Windows, es posible que tengas problemas para ver los nombres de los archivos, porque de manera predeterminada, Windows tiene activada una opción llamada <strong>Ocultar extensiones para tipos de archivos conocidos</strong>. Generalmente, la puedes desactivar yendo al Explorador de Windows, seleccionando la opción <strong>Opciones de directorio...</strong>, desmarcando la casilla de verificación <strong>Ocultar extensiones para tipos de archivo conocidos</strong> y luego haciendo clic en <strong>Aceptar</strong>. Para obtener información más específica sobre tu versión de Windows, puedes buscar en la web.</p>
-</div>
-
-<h2 id="Rutas_de_archivo">Rutas de archivo</h2>
-
-<p>Para que los archivos se comuniquen entre sí, debes proporcionar una ruta de archivo entre ellos, básicamente una ruta, para que un archivo sepa dónde está otro. Para demostrarlo, insertaremos un poco de HTML en nuestro archivo <code>index.html</code> y haremos que muestre la imagen que elegiste en el artículo {{web.link("/es/docs/Learn/Getting_started_with_the_web/What_will_your_website_look_like#Imágenes", "¿Cómo se verá tu sitio web?")}}</p>
-
-<ol>
- <li>Copia la imagen que elegiste anteriormente en tu directorio <code>images</code>.</li>
- <li>Abre tu archivo <code>index.html</code> e inserta el siguiente código en el archivo exactamente como se muestra. Por ahora, no te preocupes por lo que significa todo esto; veremos las estructuras con más detalle más adelante en la serie.
-  <pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Mi página de prueba&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;img src="" alt="Mi imagen de prueba"&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
- </li>
- <li>La línea <code>&lt;img src="" alt="Mi imagen de prueba"&gt;</code> es el código HTML que inserta una imagen en la página. Necesitamos decirle al HTML dónde está la imagen. La imagen está dentro del directorio <em>images</em>, que está en el mismo directorio que <code>index.html</code>. Para recorrer la estructura del archivo desde <code>index.html</code> hasta nuestra imagen, la ruta del archivo que necesitamos es <code>images/nombre-archivo-imagen</code>. Por ejemplo, nuestra imagen se llama <code>firefox-icon.png</code>, por lo que la ruta del archivo es <code>images/firefox-icon.png</code>.</li>
- <li>Inserta la ruta del archivo en tu código HTML entre las comillas dobles del código <code>src=""</code>.</li>
- <li>Guarda tu archivo HTML, luego cárgalo en tu navegador web (haz doble clic en el archivo). ¡Deberías ver tu nueva página web mostrando tu imagen!</li>
-</ol>
-
-<p><img alt="Una captura de pantalla del sitio web básico que muestra solo el logotipo de Firefox: un zorro en llamas envolviendo el mundo" src="https://mdn.mozillademos.org/files/9229/website-screenshot.png" style="display: block; height: 542px; margin: 0px auto; width: 690px;"></p>
-
-<p>Algunas reglas generales para las rutas de archivo:</p>
-
-<ul>
- <li>Para vincular a un archivo destino en el mismo directorio que el archivo HTML de invocación, simplemente usa el nombre del archivo, p. ej. <code>mi-imagen.jpg</code>.</li>
- <li>Para hacer referencia a un archivo en un subdirectorio, escribe el nombre del directorio delante de la ruta, más una barra inclinada, p. ej. <code>subdirectorio/mi-imagen.jpg</code>.</li>
- <li>Para vincular a un archivo destino en el directorio <strong>arriba</strong> del archivo HTML que lo invoca, escribe dos puntos. Por ejemplo, si <code>index.html</code> estuviera dentro de un subdirectorio de <code>pruebasitio</code> y <code>mi-imagen.jpg</code> estuviera dentro de <code>pruebasitio</code>, puedes hacer referencia a <code>mi-imagen.jpg</code> desde <code>index.html</code> utilizando <code>../mi-imagen.jpg</code>.</li>
- <li>Los puedes combinar tanto como desees, por ejemplo, <code>../subdirectorio/otro-subdirectorio/mi-imagen.jpg</code>.</li>
-</ul>
-
-<p>Por ahora, esto es todo lo que necesitas saber.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El sistema de archivos de Windows tiende a utilizar barras invertidas, no barras diagonales, p. ej. <code>C:\windows</code>. Esto no importa en HTML, incluso si estás desarrollando tu sitio web en Windows, debes usar barras diagonales en tu código.</p>
-</div>
-
-<h2 id="¿Qué_más_se_debería_hacer">¿Qué más se debería hacer?</h2>
-
-<p>Eso es todo por ahora. La estructura de tu directorio debería verse así:</p>
-
-<p><img alt="Una estructura de archivos en mac os x finder, que muestra un directorio de imágenes con una imagen, directorios de estilos y scripts vacíos, y un archivo index.html" src="https://mdn.mozillademos.org/files/9231/file-structure.png" style="display: block; height: 577px; margin: 0px auto; width: 929px;"></p>
-
-<p>{{PreviousMenuNext("Learn/Getting_started_with_the_web/What_will_your_website_look_like", "Learn/Getting_started_with_the_web/HTML_basics", "Learn/Getting_started_with_the_web")}}</p>
-
-
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li id="Instalacion_de_software_basico">{{web.link("/es/Learn/Getting_started_with_the_web/Instalacion_de_software_basico", "Instalación de software básico")}}</li>
- <li id="Como_se_vera_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/What_will_your_website_look_like", "¿Cómo se verá tu sitio web?")}}</li>
- <li id="Manejo_de_archivos">{{web.link("/es/Learn/Getting_started_with_the_web/Manejando_los_archivos", "Manejo de archivos")}}</li>
- <li id="Conceptos_basicos_de_HTML">{{web.link("/es/Learn/Getting_started_with_the_web/HTML_basics", "Conceptos básicos de HTML")}}</li>
- <li id="Conceptos_basicos_de_CSS">{{web.link("/es/Learn/Getting_started_with_the_web/CSS_basics", "Conceptos básicos de CSS")}}</li>
- <li id="Conceptos_basicos_de_JavaScript">{{web.link("/es/Learn/Getting_started_with_the_web/JavaScript_basics", "Conceptos básicos de JavaScript")}}</li>
- <li id="Publicar_tu_sitio_web">{{web.link("/es/Learn/Getting_started_with_the_web/Publishing_your_website", "Publicar tu sitio web")}}</li>
- <li id="Como_funciona_la_web">{{web.link("/es/docs/Learn/Getting_started_with_the_web/Cómo_funciona_la_Web", "Cómo funciona la Web")}}</li>
-</ul>
diff --git a/files/es/learn/getting_started_with_the_web/the_web_and_web_standards/index.html b/files/es/learn/getting_started_with_the_web/the_web_and_web_standards/index.html
new file mode 100644
index 0000000000..67d6dc92cb
--- /dev/null
+++ b/files/es/learn/getting_started_with_the_web/the_web_and_web_standards/index.html
@@ -0,0 +1,173 @@
+---
+title: La web y los estándares web
+slug: Learn/Getting_started_with_the_web/The_web_and_web_standards
+tags:
+  - Estándares web
+  - Front-end
+  - Interfáz de Usuario
+  - Novato
+  - Principiante
+  - Web
+  - aprende
+translation_of: Learn/Getting_started_with_the_web/The_web_and_web_standards
+original_slug: Learn/Getting_started_with_the_web/La_web_y_los_estandares_web
+---
+<p dir="ltr">{{learnsidebar}}</p>
+
+<p dir="ltr">Este artículo proporciona algunos antecedentes útiles sobre la Web — cómo surgió, qué son las tecnologías web estándar, cómo funcionan juntas, por qué "desarrollador web" es una gran carrera para elegir y qué tipos de mejores prácticas aprenderás a través de este curso.</p>
+
+<h2 dir="ltr" id="Breve_historia_de_la_web">Breve historia de la web</h2>
+
+<p dir="ltr">Mantendremos esto muy breve, ya que hay muchos artículos (más) detallados de la historia de la web, a los que enlazaremos más adelante (también intenta buscar "historia de la web" en tu motor de búsqueda favorito y ve lo que obtienes, si estás interesado en más detalles).</p>
+
+<p dir="ltr">A fines de la década de 1960, las fuerzas armadas de EE. UU. desarrollaron una red de comunicación llamada {{Glossary("Arpanet")}}. Esta se puede considerar una precursora de la Web, ya que trabajó en la {{interwiki("wikipedia", "conmutación de paquetes")}} y presentó la primera implementación de la {{interwiki("wikipedia", "Familia de protocolos de internet")}} TCP/IP. Estas dos tecnologías forman la base de la infraestructura sobre la que se construye Internet.</p>
+
+<p dir="ltr">En 1980, Tim Berners-Lee (a menudo denominado TimBL) escribió un programa de block de notas llamado ENQUIRE, que presentaba el concepto de enlaces entre diferentes nodos. ¿Te suena familiar?</p>
+
+<p dir="ltr">Avanzó rápidamente hasta 1989, y TimBL escribió <a href="https://www.w3.org/History/1989/proposal.html" rel="noopener">Gestión de la información: una propuesta</a> e hipertexto en el CERN; estas dos publicaciones juntas proporcionaron los antecedentes de cómo funcionaría la web. Recibieron una buena cantidad de interés, suficiente para convencer a los jefes de TimBL de que le permitieran seguir adelante y creara un sistema de hipertexto global.</p>
+
+<p dir="ltr">A finales de 1990, TimBL había creado todo lo necesario para ejecutar la primera versión de la web: {{web.link("/es/docs/Web/HTTP", "HTTP")}}, {{web.link("/es/docs/Web/HTML", "HTML")}}, el primer navegador web, que se llamaba {{interwiki("wikipedia", "WorldWideWeb")}}, un servidor HTTP y algunas páginas web para mirar.</p>
+
+<p dir="ltr">En los años siguientes, la web explotó, se lanzaron varios navegadores, se instalaron miles de servidores web y se crearon millones de páginas web. Bien, este es un muy sencillo resumen de lo que sucedió, pero les prometí un breve resumen.</p>
+
+<p dir="ltr">Un último dato importante para compartir es que en 1994, TimBL fundó el {{interwiki("wikipedia", "World Wide Web Consortium")}} (W3C), una organización que reúne a representantes de muchas empresas de tecnología diferentes para trabajar juntos en la creación de especificaciones de tecnología web. Después de eso, siguieron otras tecnologías como {{web.link("/es/docs/Web/CSS", "CSS")}} y {{web.link("/es/docs/Web/JavaScript", "JavaScript")}}, y la web comenzó a parecerse más a la web que conocemos hoy.</p>
+
+<h2 dir="ltr" id="Estándares_web">Estándares web</h2>
+
+<p dir="ltr"><strong>Los estándares web</strong> son las tecnologías que utilizamos para crear sitios web. Estos estándares existen como extensos documentos técnicos llamados <em>especificaciones</em>, que detallan exactamente cómo debería funcionar la tecnología. Estos documentos no son muy útiles para aprender a usar las tecnologías que describen (es por eso que tenemos sitios como <em>MDN Web Docs</em>), sino que están pensados ​​para que los utilicen los ingenieros de software para implementar esas tecnologías (generalmente en los navegadores web).</p>
+
+<p dir="ltr">Por ejemplo, el <a href="https://html.spec.whatwg.org/multipage/" rel="noopener">lleno de vida Estándar HTML</a> describe exactamente cómo se debe implementar HTML (todos los elementos HTML y sus APIs asociadas y otras tecnologías circundantes).</p>
+
+<p dir="ltr">Los estándares web son creados por organismos de estándares — instituciones que invitan a grupos de personas de diferentes compañías de tecnología a unirse y acordar cómo deberían funcionar las tecnologías de la mejor manera posible para cumplir con todos sus casos de uso. El W3C es el organismo de estándares web más conocido, pero hay otros como <a href="https://whatwg.org/" rel="noopener">WHATWG</a> (que fueron responsables de la modernización del lenguaje HTML), <a href="https://www.ecma-international.org/" rel="noopener">ECMA</a> (que publica el estándar para ECMAScript, en el que se basa JavaScript), <a href="https://www.khronos.org/" rel="noopener">Khronos</a> (que publica tecnologías para gráficos 3D, como WebGL) y otras.</p>
+
+<h3 dir="ltr" id="Estándares_abiertos">Estándares "abiertos"</h3>
+
+<p dir="ltr">Uno de los aspectos clave de los estándares web, que TimBL y el W3C acordaron desde el principio, es que la web (y las tecnologías web) deben ser libres tanto para contribuir como para usar, y no estar gravadas por patentes/licencias. Por lo tanto, cualquiera puede escribir el código para crear un sitio web de forma gratuita y cualquiera puede contribuir al proceso de creación de estándares, donde se escriben las especificaciones.</p>
+
+<p dir="ltr">Debido a que las tecnologías web se crean abiertamente, en colaboración entre muchas empresas diferentes, significa que ninguna empresa las puede controlar, lo cual es algo realmente bueno. No querrías que una sola empresa decidiera repentinamente poner toda la web detrás de un muro de pago, o lanzar una nueva versión de HTML que todos tienen que comprar para continuar creando sitios web, o peor aún, simplemente decidiendo que ya no están interesados, y simplemente apagarlas.</p>
+
+<p dir="ltr">Esto permite que la web siga siendo un recurso público de libre acceso.</p>
+
+<h3 dir="ltr" id="No_rompas_la_web">No rompas la web</h3>
+
+<p dir="ltr">Otra frase que escucharás sobre los estándares web abiertos es "no rompas la web" — la idea es que cualquier tecnología web nueva que se introduzca debe ser compatible con versiones anteriores (es decir, los sitios web antiguos seguirán funcionando) y compatibles con versiones posteriores (las tecnologías futuras a su vez serán compatibles con las que tenemos actualmente). A medida que avances en el material de aprendizaje que se presenta aquí, comenzarás a aprender cómo se hace posible esto con un trabajo de diseño e implementación muy inteligente.</p>
+
+<h2 id="Ser_desarrollador_web_es_bueno">Ser desarrollador web es bueno</h2>
+
+<p>La industria web es un mercado muy atractivo para ingresar si estás buscando trabajo. Las cifras publicadas recientemente dicen que actualmente hay alrededor de 19 millones de desarrolladores web en el mundo, y esa cifra se establecerá en más del doble en la próxima década. Y al mismo tiempo, hay una escasez de habilidades en la industria, entonces, ¿qué mejor momento para aprender sobre desarrollo web?</p>
+
+<p>Sin embargo, no todo es diversión y juegos — crear sitios web es una propuesta más complicada de lo que solía ser, y tendrás que dedicar algo de tiempo a estudiar todas las diferentes tecnologías que necesitas usar, todas las técnicas y las mejores prácticas que necesitas conocer y todos los patrones típicos que se te pedirá que implementes. Te tomará unos meses comenzar realmente a involucrarte en él, y luego deberás seguir aprendiendo para que tu conocimiento se mantenga actualizado con todas las nuevas herramientas y funciones que aparecen en la plataforma web, y seguir practicando y perfeccionando tu oficio.</p>
+
+<p><em>Lo único constante es el cambio.</em></p>
+
+<p>¿Esto suena difícil? No te preocupes: nuestro objetivo es brindarte todo lo que necesitas saber para comenzar, y las cosas serán más fáciles. Una vez que aceptes el cambio constante y la incertidumbre de la web, comenzarás a disfrutar. Como parte de la comunidad web, tendrás toda una red de contactos y material útil para ayudarte, y comenzarás a disfrutar de las posibilidades creativas que brinda.</p>
+
+<p>Ahora eres un creativo digital. Disfruta de la experiencia y el potencial de ganarte la vida.</p>
+
+<h2 id="Descripción_de_las_tecnologías_web_modernas">Descripción de las tecnologías web modernas</h2>
+
+<p>Hay una serie de tecnologías que debes aprender si deseas ser un desarrollador web front-end. En esta sección las describiremos brevemente. Para obtener una explicación más detallada de cómo funcionan juntas algunas de ellas, lee nuestro artículo {{web.link("/es/docs/Learn/Getting_started_with_the_web/How_the_Web_works", "Cómo funciona la web")}}.</p>
+
+<h3 id="Navegadores">Navegadores</h3>
+
+<p>Probablemente estés leyendo estas palabras dentro de un navegador web en este mismo momento (a menos que las hayas impreso o estés utilizando tecnología de asistencia, como un lector de pantalla para leerlas). Los navegadores web son los programas de software que la gente usa para consumir la web e incluyen <a href="https://www.mozilla.org/es-MX/firefox/" rel="noopener">Firefox</a>, <a href="https://www.google.com/intl/es-419/chrome/" rel="noopener">Chrome</a>, <a href="https://www.opera.com/es" rel="noopener">Opera</a>, <a href="https://www.apple.com/mx/safari/" rel="noopener">Safari</a> y <a href="https://www.microsoft.com/es-es/edge" rel="noopener">Edge</a>.</p>
+
+<h3 id="HTTP">HTTP</h3>
+
+<p>El Protocolo de transferencia de hipertexto, o {{web.link("/es/docs/Web/HTTP/Basics_of_HTTP", "HTTP")}}, es un protocolo de mensajería que permite a los navegadores web comunicarse con los servidores web (donde se almacenan los sitios web). Una conversación típica es algo así como</p>
+
+<pre class="brush: bash notranslate">"Hola servidor web. ¿Me puedes dar los archivos que necesito para renderizar bbc.co.uk"?
+
+"Seguro navegador web — aquí los tienes"
+
+[Descarga archivos y renderiza la página web]</pre>
+
+<p>La sintaxis real de los mensajes HTTP (llamados peticiones y respuestas) no es tan legible para los humanos, pero esto te da una idea básica.</p>
+
+<h3 id="HTML_CSS_y_JavaScript">HTML, CSS y JavaScript</h3>
+
+<p>{{web.link("/es/docs/Web/HTML", "HTML")}}, {{web.link("/es/docs/Web/CSS", "CSS")}} y {{web.link("/es/docs/Web/JavaScript", "JavaScript")}} son las tres tecnologías principales que utilizarás para crear un sitio web:</p>
+
+<ul>
+ <li>
+  <p>El lenguaje de marcado de hipertexto, o <strong>HTML</strong>, es un lenguaje de marcado que consta de diferentes elementos en los que puedes ajustar (marcar) el contenido para darle significado (semántica) y estructura. El HTML simple se ve así:</p>
+
+  <pre class="brush: html notranslate"><code>&lt;h1&gt;Este es un encabezado de alto nivel&lt;/h1&gt;
+
+&lt;p&gt;Este es un párrafo de texto.&lt;/p&gt;
+
+&lt;img src="cat.jpg" alt="Una imagen de mi gato"&gt;</code></pre>
+
+  <p>Si adoptamos una analogía de la construcción de casas, HTML sería como los cimientos y las paredes de la casa, que le dan estructura y la mantienen unida.</p>
+ </li>
+ <li>
+  <p>Hojas de estilo en cascada (<strong>CSS</strong> por "<em>Cascading Style Sheets</em>") es un lenguaje basado en reglas que se utiliza para aplicar estilos a tu HTML, por ejemplo, establecer colores del texto y del fondo, agregar bordes, animar cosas o diseñar una página de cierta manera. Como un sencillo ejemplo, el siguiente código convertirá nuestro párrafo HTML en rojo:</p>
+
+  <pre class="notranslate">p  {
+  color: red;
+}</pre>
+
+  <p>En la analogía de la casa, CSS es como la pintura, el papel tapiz, las alfombras y los cuadros que usarías para hacer que la casa se vea bien.</p>
+ </li>
+ <li>
+  <p><strong>JavaScript</strong> es el lenguaje de programación que usamos para agregar interactividad a los sitios web, desde el cambio de estilo dinámico hasta la obtención de actualizaciones desde el servidor, pasando por gráficos complejos en 3D. El siguiente JavaScript simple almacenará en la memoria una referencia a nuestro párrafo y cambiará el texto dentro de él:</p>
+
+  <pre class="brush: js notranslate">let pElem = document.querySelector('p');
+pElem.textContent =  '¡Cambiamos el texto!';</pre>
+
+  <p>En la analogía de la casa, JavaScript es como la cocina, el televisor, el microondas o la secadora de pelo — las cosas que le dan a tu casa una útil funcionalidad.</p>
+ </li>
+</ul>
+
+<h3 id="Herramientas">Herramientas</h3>
+
+<p>Una vez que hayas aprendido las tecnologías "sin procesar" que se pueden usar para crear páginas web (como HTML, CSS y JavaScript), pronto comenzarás a encontrar varias herramientas que puedes usar para hacer tu trabajo más fácil y/o más eficiente. Algunos ejemplos incluyen:</p>
+
+<ul>
+ <li>Las {{web.link("/es/docs/Learn/Common_questions/What_are_browser_developer_tools", "herramientas de desarrollo")}} dentro de los navegadores modernos que se pueden usar para depurar tu código.</li>
+ <li>{{web.link("/es/docs/Learn/Tools_and_testing/Cross_browser_testing", "Herramientas de prueba")}} que puedes usar para ejecutar pruebas y mostrar si tu código se está comportando como lo esperabas.</li>
+ <li>Bibliotecas y marcos de desarrollo construidos sobre JavaScript que te permiten crear ciertos tipos de sitios web de manera mucho más rápida y efectiva.</li>
+ <li>Las llamadas "Linternas" (<code>Linters</code> en inglés), que toman un conjunto de reglas, examinan tu código y resaltan los lugares donde no has seguido las reglas correctamente.</li>
+ <li>Minificadores, que eliminan todos los espacios en blanco de tus archivos de código fuente para que sean más pequeños y, por lo tanto, se descarguen del servidor más rápidamente.</li>
+</ul>
+
+<h3 id="Marcos_de_desarrollo_y_lenguajes_de_lado_del_servidor">Marcos de desarrollo y lenguajes de lado del servidor</h3>
+
+<p>HTML, CSS y JavaScript son lenguajes de la interfaz del usuario ("<code>front-end</code>" o del lado del cliente), lo cual significa que los ejecuta el navegador para producir la interfaz del sitio web que los usuarios pueden utilizar.</p>
+
+<p>Hay otra clase de lenguajes llamados lenguajes de la interfaz de admiración ("<code>back-end</code>" o de lado del servidor), lo cual significa que se ejecutan en el servidor antes de que el resultado se envíe al navegador para que se muestre. Un uso típico de un lenguaje de lado del servidor es obtener algunos datos de una base de datos y generar algo de HTML para contener los datos, antes de enviar el HTML al navegador para mostrárselo al usuario.</p>
+
+<p>Los lenguajes de lado del servidor de ejemplo incluyen ASP.NET, Python, PHP y NodeJS.</p>
+
+<h2 id="Mejores_prácticas_web">Mejores prácticas web</h2>
+
+<p>Hemos hablado brevemente sobre las tecnologías que utilizarás para crear sitios web. Ahora analicemos las mejores prácticas que debes emplear para asegurarte de que estás utilizando esas tecnologías de la mejor manera posible.</p>
+
+<p>Al hacer desarrollo web, la principal causa de incertidumbre proviene del hecho de que no sabes qué combinación de tecnologías utilizará cada usuario para ver tu sitio web:</p>
+
+<ul>
+ <li>El usuario 1 podría estar mirándolo en un iPhone, con una pantalla pequeña y estrecha.</li>
+ <li>El usuario 2 puede estar mirándolo en una computadora portátil con Windows con un monitor de pantalla ancha adjunto.</li>
+ <li>El usuario 3 puede ser ciego y usar un lector de pantalla para leerle la página web.</li>
+ <li>El usuario 4 podría estar usando una máquina de escritorio realmente antigua que no puede ejecutar navegadores modernos.</li>
+</ul>
+
+<p>Debido a que no sabes exactamente qué usarán tus usuarios, debes diseñar a la defensiva — hacer que tu sitio web sea lo más flexible posible, de modo que todos los usuarios anteriores puedan hacer uso de él, incluso si no todos obtienen la misma experiencia. En resumen, estamos tratando de hacer que la web funcione para todos, tanto como sea posible.</p>
+
+<p>Encontrarás los siguientes conceptos en algún momento de tus estudios.</p>
+
+<ul>
+ <li><strong>Compatibilidad entre navegadores</strong> — es la práctica de intentar asegurarte de que tu página web funcione en tantos dispositivos como sea posible. Esto incluye el uso de tecnologías compatibles con todos los navegadores, brindando mejores experiencias a los navegadores que pueden manejarlas (mejora progresiva) y/o escribiendo código para que vuelvas a una experiencia más simple pero aún utilizable en navegadores más antiguos (degradación elegante). También implica muchas pruebas para ver si algo falla en ciertos navegadores, y luego más trabajo para corregir esas fallas.</li>
+ <li><strong>Diseño web receptivo</strong> — es la práctica de hacer que tu funcionalidad y diseños sean flexibles para que se puedan adaptar automáticamente a diferentes navegadores. Un ejemplo obvio es un sitio web que se presenta de una forma en un navegador de pantalla ancha en el escritorio, pero que se muestra como un diseño de una sola columna más compacto en los navegadores de teléfonos móviles. Intenta ajustar el ancho de la ventana de tu navegador ahora y ve qué sucede.</li>
+ <li><strong>Rendimiento</strong> — significa hacer que los sitios web se carguen lo más rápido posible, pero también hacerlos intuitivos y fáciles de usar para que los usuarios no se sientan frustrados y vayan a otro lugar.</li>
+ <li><strong>Accesibilidad</strong> — significa hacer que tus sitios web sean utilizables por la mayor cantidad posible de personas (los conceptos relacionados son diversidad e inclusión y diseño inclusivo). Esto incluye a personas con impedimentos visuales, auditivos, cognitivos o físicos. También va más allá de las personas con discapacidad — ¿qué pasa con los jóvenes o los ancianos, las personas de diferentes culturas, las personas que utilizan dispositivos móviles o las personas con conexiones de red lentas o poco fiables?</li>
+ <li><strong>Internacionalización</strong> — significa hacer que los sitios web sean utilizables por personas de diferentes culturas, que hablan diferentes idiomas al tuyo. Hay consideraciones técnicas aquí (como alterar tu diseño para que aún funcione bien para idiomas de derecha a izquierda, o incluso verticales) y humanas (tal como usar un lenguaje simple, sin jerga para que las personas que tienen tu idioma ya que su segundo o tercer idioma es más probable que entienda tu texto).</li>
+ <li><strong>Privacidad y seguridad</strong>. Estos dos conceptos están relacionados pero son diferentes. La privacidad se refiere a permitir que las personas realicen sus negocios de manera privada y no espiarlos o recopilar más datos de los estrictamente necesarios. La seguridad se refiere a la construcción de tu sitio web de una manera segura para que los usuarios malintencionados no puedan robar la información contenida en él o de tus usuarios.</li>
+</ul>
+
+<h2 dir="ltr" id="Ve_también">Ve también</h2>
+
+<ul dir="ltr">
+ <li>{{interwiki("wikipedia", "Historia de la World Wide Web")}}</li>
+ <li>{{web.link("/es/docs/Learn/Common_questions/How_does_the_Internet_work", "¿Cómo funciona la internet?")}}</li>
+</ul>
diff --git a/files/es/learn/herramientas_y_pruebas/cross_browser_testing/index.html b/files/es/learn/herramientas_y_pruebas/cross_browser_testing/index.html
deleted file mode 100644
index 73bd6299a1..0000000000
--- a/files/es/learn/herramientas_y_pruebas/cross_browser_testing/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: Cross browser testing
-slug: Learn/Herramientas_y_pruebas/Cross_browser_testing
-translation_of: Learn/Tools_and_testing/Cross_browser_testing
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">Este módulo se centra en probar proyectos web en diferentes navegadores. Nos fijamos en la identificación de su público objetivo (por ejemplo, qué usuarios, navegadores y dispositivos son los que más le preocupan?), cómo realizar las pruebas, los principales problemas a los que se enfrentará con los diferentes tipos de código y cómo mitigarlos, qué herramientas son las más útiles para ayudarle a probar y solucionar problemas, y cómo utilizar la automatización para acelerar las pruebas.</p>
-
-<h2 id="Prerequisitos">Prerequisitos</h2>
-
-<p>Debería aprender los conceptos básicos de los lenguajes <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a> y <a href="/en-US/docs/Learn/JavaScript">JavaScript</a> básicos antes de intentar utilizar las herramientas que se detallan aquí.</p>
-
-<h2 id="Guías">Guías</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Introduction">Introducción a la prueba de navegadores cruzados</a></dt>
- <dd>Este artículo comienza el módulo proporcionando una visión general del tema de la prueba de navegadores cruzados, respondiendo a preguntas como "¿qué es la prueba de navegadores cruzados? y "¿cuáles son los tipos de problemas más comunes que se encuentran?</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Testing_strategies">Estrategias para la realización de las pruebas</a></dt>
- <dd>
- <p>A continuación, profundizamos en la realización de pruebas, la identificación de un público objetivo (por ejemplo, qué navegadores, dispositivos y otros segmentos deben ser probados), estrategias de pruebas de baja fiabilidad (obtenga una gama de dispositivos y algunas máquinas virtuales y realice pruebas ad-hoc cuando sea necesario), estrategias de alta tecnología (automatización, uso de aplicaciones de pruebas dedicadas), y pruebas con grupos de usuarios.</p>
- </dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/HTML_and_CSS">Manejo de problemas comunes de HTML y CSS</a></dt>
- <dd>
- <p>Con el conjunto de escenas, ahora veremos específicamente los problemas comunes entre navegadores que encontrará en código HTML y CSS, y qué herramientas se pueden usar para evitar que ocurran problemas o para solucionarlos. Esto incluye el código de hilado, la entrega de prefijos CSS, el uso de herramientas de desarrollo de navegadores para localizar problemas, el uso de polifiltros para añadir soporte a los navegadores, la solución de problemas de diseño con capacidad de respuesta, y mucho más.</p>
- </dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/JavaScript">Manejo de problemas comunes de JavaScript</a></dt>
- <dd>
- <p>Ahora veremos los problemas comunes de JavaScript en todos los navegadores y cómo solucionarlos. Esto incluye información sobre el uso de herramientas de desarrollo del navegador para localizar y solucionar problemas, el uso de polifondos y bibliotecas para solucionar los problemas, el funcionamiento de las funciones modernas de JavaScript en navegadores antiguos, y mucho más.</p>
- </dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility">Manejo de problemas comunes de accesibilidad</a></dt>
- <dd>A continuación, nos centramos en la accesibilidad, proporcionando información sobre problemas comunes, cómo realizar pruebas sencillas y cómo utilizar las herramientas de auditoría/automatización para encontrar problemas de accesibilidad.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Feature_detection">Implementación de la detección de características</a></dt>
- <dd>La detección de funciones implica determinar si un navegador soporta un determinado bloque de código, y ejecutar un código diferente dependiendo de si lo hace (o no), de modo que el navegador siempre puede proporcionar una experiencia de trabajo en lugar de bloquearse/error en algunos navegadores. Este artículo detalla cómo escribir su propia detección de características simples, cómo usar una biblioteca para acelerar la implementación y características nativas para la detección de características como <code>@supports</code>.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Automated_testing">Introducción a las pruebas automatizadas</a></dt>
- <dd>La realización manual de pruebas en varios navegadores y dispositivos, varias veces al día, puede resultar tediosa y consumir mucho tiempo. Para manejar esto eficientemente, debe familiarizarse con las herramientas de automatización. En este artículo, analizamos lo que está disponible, cómo utilizar los corredores de tareas y los conceptos básicos de cómo utilizar las aplicaciones de automatización de pruebas de navegadores comerciales, como Sauce Labs y Browser Stack.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Your_own_automation_environment">Configuración de su propio entorno de automatización de pruebas</a></dt>
- <dd>En este artículo, le enseñaremos cómo instalar su propio entorno de automatización y ejecutar sus propias pruebas utilizando Selenium/WebDriver y una biblioteca de pruebas como Selenium-webdriver for Node. También veremos cómo integrar su entorno de pruebas local con aplicaciones comerciales como las que se comentaron en el artículo anterior.</dd>
-</dl>
diff --git a/files/es/learn/herramientas_y_pruebas/github/index.html b/files/es/learn/herramientas_y_pruebas/github/index.html
deleted file mode 100644
index 62646f1cc4..0000000000
--- a/files/es/learn/herramientas_y_pruebas/github/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: Git y GitHub
-slug: Learn/Herramientas_y_pruebas/GitHub
-tags:
-  - Aprender
-  - GitHub
-  - Principiante
-  - Web
-  - git
-translation_of: Learn/Tools_and_testing/GitHub
----
-<div>{{LearnSidebar}}</div>
-
-<p><font><font>Todos los desarrolladores utilizarán algún tipo de </font></font><strong><font><font>sistema de control de versiones</font></font></strong><font><font> ( </font></font><strong><font><font>VCS</font></font></strong><font><font> ), una herramienta que les permita colaborar con otros desarrolladores en un proyecto sin peligro de que sobrescriban el trabajo de los demás, y volver a las versiones anteriores de la base de código si existe un problema descubierto más tarde. </font><font>El VCS más popular (al menos entre los desarrolladores web) es </font></font><strong><font><font>Git</font></font></strong><font><font>, junto con </font></font><strong><font><font>GitHub</font></font></strong><font><font>, un sitio que proporciona alojamiento para tus repositorios y varias herramientas para trabajar con ellos. </font><font>Este módulo tiene como objetivo enseñarte lo que necesitas saber sobre ambos.</font></font></p>
-
-<h2 id="Introducción"><font><font>Introducción</font></font></h2>
-
-<p><font><font>Los VCS son esenciales para el desarrollo de software:</font></font></p>
-
-<ul>
- <li><font><font>Es raro que trabajes en un proyecto completamente por tu cuenta, y tan pronto como comiences a trabajar con otras personas, comenzarás a correr el riesgo de entrar en conflicto con el trabajo del otro, es decir, cuando ambos intentan actualizar simultáneamente la misma pieza de código. </font><font>Debes tener algún tipo de mecanismo para administrar las ocurrencias y, como resultado, evitar la pérdida de trabajo.</font></font></li>
- <li><font><font>Cuando trabajes en un proyecto por tu cuenta o con otros, querrás poder hacer una copia de seguridad del código en un lugar central, para que no se pierda si tu computadora se daña.</font></font></li>
- <li><font><font>También querrás poder volver a versiones anteriores si más tarde descubres un problema. </font><font>Es posible que hayas empezado a hacer esto en tu propio trabajo mediante la creación de diferentes versiones de un mismo archivo, por ejemplo </font></font><code>myCode.js</code><font><font>, </font></font><code>myCode_v2.js</code><font><font>, </font></font><code>myCode_v3.js</code><font><font>, </font></font><code>myCode_final.js</code><font><font>, </font></font><code>myCode_really_really_final.js</code><font><font>, etc, pero esto es muy propenso a errores y poco fiable.</font></font></li>
- <li><font><font>Los diferentes miembros del equipo generalmente querrán crear sus propias versiones separadas del código (llamadas </font></font><strong><font><font>ramas</font></font></strong><font><font> en Git), trabajar en una nueva característica en esa versión y luego fusionarla de manera controlada (en GitHub usamos </font></font><strong><font><font>solicitudes de extracción</font></font></strong><font><font>) con la versión maestra cuando hayan terminado con ella.</font></font></li>
-</ul>
-
-<p><font><font>Los VCS proporcionan herramientas para satisfacer las necesidades anteriores. </font></font><a href="https://git-scm.com/" rel="noopener"><font><font>Git</font></font></a><font><font> es un ejemplo de VCS, y </font></font><a href="https://github.com/" rel="noopener"><font><font>GitHub</font></font></a><font><font> es un sitio web + infraestructura que proporciona un servidor Git más una serie de herramientas realmente útiles para trabajar con repositorios git individuales o en equipo, como informar problemas con el código, herramientas de revisión, características de administración de proyectos tal como asignación de tareas, estados de tareas, y más.</font></font></p>
-
-<div class="blockIndicator note">
-<p><strong><font><font>Nota</font></font></strong><font><font>: Git en realidad es un </font><font>sistema de control de versiones </font></font><em><font><font>distribuido</font></font></em><font><font>, lo cual significa que se realiza una copia completa del repositorio que contiene la base de código en tu computadora (y en la de todos los demás). </font><font>Realizas cambios en tu propia copia, y luego empujas esos cambios nuevamente al servidor, donde un administrador decidirá si fusiona tus cambios con la copia maestra.</font></font></p>
-</div>
-
-<h3 id="¿Quieres_convertirte_en_un_desarrollador_web_front-end"><font><font>¿Quieres convertirte en un desarrollador web front-end?</font></font></h3>
-
-<p><font><font>Hemos preparado un curso que incluye toda la información esencial que necesitas para alcanzar tu objetivo.</font></font></p>
-
-<div class="in-page-callout webdev">
-<p><a class="cta primary" href="/docs/Learn/Front-end_web_developer">Comenzar</a></p>
-</div>
-
-<h2 id="Prerequisitos"><font><font>Prerequisitos</font></font></h2>
-
-<p><font><font>Para usar Git y GitHub, necesitas:</font></font></p>
-
-<ul>
- <li><font><font>Una computadora de escritorio con Git instalado (consulta la </font></font><a href="https://git-scm.com/downloads" rel="noopener"><font><font>página de descargas de Git</font></font></a><font><font>).</font></font></li>
- <li><font><font>Una herramienta para usar Git. </font><font>Dependiendo de cómo te guste trabajar, puedes usar un </font></font><a href="https://git-scm.com/downloads/guis/" rel="noopener"><font><font>cliente Git  con GUI</font></font></a><font><font> (te recomendamos GitHub Desktop, SourceTree o Git Kraken) o simplemente usar una ventana de la terminal. </font><font>De hecho, probablemente sea útil que conozcas al menos los conceptos básicos de los comandos de la terminal git, incluso si tienes la intención de usar una GUI.</font></font></li>
- <li><font><font>Una </font></font><a href="https://github.com/join" rel="noopener"><font><font>cuenta de GitHub</font></font></a><font><font>. </font><font>Si aún no tienes una, regístrate ahora usando el enlace provisto.</font></font></li>
-</ul>
-
-<p><font><font>En términos de conocimiento previo, no necesitas saber nada sobre desarrollo web, Git/GitHub o VCS para iniciar este módulo. </font><font>Sin embargo, se recomienda que conozcas algo de codificación para que tengas conocimientos informáticos razonables y algún código para almacenar en tus repositorios.</font></font></p>
-
-<p><font><font>También es preferible que tengas algunos conocimientos básicos de la terminal, por ejemplo, moverte entre directorios, crear archivos y modificar la variable del sistema </font></font><code>PATH</code><font><font>.</font></font></p>
-
-<div class="blockIndicator note">
-<p><strong><font><font>Nota</font></font></strong><font><font>: Github no es el único sitio/conjunto de herramientas que puedes usar con Git. </font><font>Hay otras alternativas, como </font></font><a href="https://about.gitlab.com/" rel="noopener"><font><font>GitLab,</font></font></a><font><font> que podrías probar, y también podrías intentar configurar tu propio servidor Git y usarlo en lugar de GitHub. </font><font>Solo nos hemos quedado con GitHub en este curso para proporcionar una forma única que funciona.</font></font></p>
-</div>
-
-<h2 id="Guías"><font><font>Guías</font></font></h2>
-
-<p><font><font>Ten en cuenta que los enlaces a continuación te llevan a recursos en sitios externos. </font><font>Eventualmente intentaremos tener nuestro propio curso Git/GitHub dedicado, pero por ahora, esto te ayudará a familiarizarte con el tema en cuestión.</font></font></p>
-
-<dl>
- <dt><a href="https://guides.github.com/activities/hello-world/" rel="noopener"><font><font>Hola mundo (de GitHub)</font></font></a></dt>
- <dd><font><font>Este es un buen lugar para comenzar: esta guía práctica te permite comenzar a usar GitHub, aprender los conceptos básicos de Git, como crear repositorios y ramas, realizar confirmaciones, abrir y fusionar solicitudes de extracción.</font></font></dd>
- <dt><a href="https://guides.github.com/introduction/git-handbook/" rel="noopener"><font><font>Manual de Git (en GitHub)</font></font></a></dt>
- <dd><font><font>Este Manual de Git profundiza un poco más, explicando qué es un VCS, qué es un repositorio, cómo funciona el modelo básico de GitHub, comandos y ejemplos de Git, y más.</font></font></dd>
- <dt><a href="https://guides.github.com/activities/forking/" rel="noopener"><font><font>Bifurcación de proyectos (de GitHub)</font></font></a></dt>
- <dd><font><font>Bifurcar proyectos es esencial cuando deseas contribuir al código de otra persona. </font><font>Esta guía explica cómo.</font></font></dd>
- <dt><a href="https://help.github.com/en/articles/about-pull-requests" rel="noopener"><font><font>Acerca de las solicitudes de extracción (de GitHub)</font></font></a></dt>
- <dd><font><font>Una útil guía para administrar las solicitudes de extracción, la forma en que los cambios de código sugeridos se entregan a los repositorios de las personas para su consideración.</font></font></dd>
- <dt><a href="https://guides.github.com/features/issues/" rel="noopener"><font><font>Dominando las incidencias (de GitHub)</font></font></a></dt>
- <dd><font><font>Las incidencias son como un foro para tu proyecto GitHub, donde las personas pueden hacer preguntas e informar problemas, y tú puede administrar las actualizaciones (por ejemplo, asignar personas para solucionar problemas, aclarar el problema, informar a las personas que las cosas están solucionadas). </font><font>Este artículo te brinda lo que necesitas saber sobre las incidencias.</font></font></dd>
-</dl>
-
-<div class="blockIndicator note">
-<p><strong><font><font>Nota</font></font></strong><font><font>: Hay </font></font><strong><font><font>mucho más</font></font></strong><font><font> que puedes hacer con Git y GitHub, pero creemos que lo anterior representa lo mínimo que necesitas saber para comenzar a usar Git de manera efectiva. </font><font>A medida que profundices en Git, comenzarás a darte cuenta de que es fácil equivocarse cuando comienzas a usar comandos más complicados. </font><font>No te preocupes, incluso los desarrolladores web profesionales encuentran a Git confuso a veces, y a menudo resuelven problemas buscando soluciones en la web, o consultando sitios como </font></font><a href="https://github.com/k88hudson/git-flight-rules/blob/master/README_es.md" rel="noopener"><font><font>Reglas de vuelo para Git</font></font></a><font><font> y </font></font><a href="https://dangitgit.com/es" rel="noopener"><font><font>Dangit, ¡git!</font></font></a></p>
-</div>
-
-<h2 id="Ve_también"><font><font>Ve también</font></font></h2>
-
-<ul>
- <li><a href="https://guides.github.com/introduction/flow/" rel="noopener"><font><font>Comprender el flujo de GitHub</font></font></a></li>
- <li><a href="https://git-scm.com/docs" rel="noopener"><font><font>Lista de comandos de Git</font></font></a></li>
- <li><a href="https://guides.github.com/features/mastering-markdown/" rel="noopener"><font><font>Reducción de dominio</font></font></a><font><font> (el formato de texto en el que escribe en relaciones públicas, comentarios de insidencias y archivos </font></font><code>.md</code><font><font>).</font></font></li>
- <li><a href="https://guides.github.com/features/pages/" rel="noopener"><font><font>Introducción a las páginas de GitHub</font></font></a><font><font> (cómo publicar demostraciones y sitios web en GitHub).</font></font></li>
- <li><a href="https://learngitbranching.js.org/" rel="noopener"><font><font>Aprende la ramificación de Git</font></font></a></li>
- <li><a href="https://github.com/k88hudson/git-flight-rules" rel="noopener"><font><font>Reglas de vuelo para Git</font></font></a><font><font> (un compendio muy útil de formas de lograr cosas específicas en Git, incluida la forma de corregir las cosas cuando te equivocaste).</font></font></li>
- <li>
-  <p><a href="https://dangitgit.com/" rel="noopener"><font><font>Dangit, git! </font></font></a><font><font>(otro compendio útil, específicamente de formas de corregir las cosas cuando te equivocaste).</font></font></p>
- </li>
-</ul>
diff --git a/files/es/learn/herramientas_y_pruebas/index.html b/files/es/learn/herramientas_y_pruebas/index.html
deleted file mode 100644
index a147c98f65..0000000000
--- a/files/es/learn/herramientas_y_pruebas/index.html
+++ /dev/null
@@ -1,58 +0,0 @@
----
-title: Herramientas y pruebas
-slug: Learn/Herramientas_y_pruebas
-tags:
-  - Accesibilidad
-  - Aprender
-  - Aterrizaje
-  - CSS
-  - CodificaciónDeSecuenciasDeComandos
-  - HTML
-  - Herramientas
-  - JavaScript
-  - Navegador cruzado
-  - Principiante
-  - Pruebas de usuario
-  - Tema
-  - Testing
-  - automatización
-translation_of: Learn/Tools_and_testing
----
-<div>
-<p>{{LearnSidebar}}</p>
-
-<p>Una vez que haya comenzado a sentirse cómodo programando con tecnologías web básicas (como HTML, CSS y JavaScript), y comience a adquirir más experiencia, leer más recursos y aprender más trucos y consejos, comenzará a encontrar todos tipo de herramientas, desde CSS y JavaScript ya enrollados, aplicaciones de prueba y automatización, y muchas más. A medida que sus proyectos web se vuelvan más grandes y complejos, querrá comenzar a aprovechar algunas de estas herramientas y elaborar planes de prueba confiables para su código. Esta parte del área de aprendizaje tiene como objetivo brindarle lo que necesita para comenzar y tomar decisiones informadas.</p>
-</div>
-
-<p class="summary"> </p>
-
-<p>{{LearnSidebar}}</p>
-
-<p>La industria de la web es un lugar emocionante para trabajar, pero no está exenta de complicaciones. Las tecnologías principales que utilizamos para crear sitios web son bastante estables ahora, pero se están agregando nuevas características todo el tiempo, y nuevas herramientas, que facilitan el trabajo con estas tecnologías y están construidas sobre estas tecnologías, aparecen constantemente. Además de eso, todavía tenemos que mantener la compatibilidad entre navegadores en la parte superior de nuestras mentes y asegurarnos de que nuestro código sigue las mejores prácticas que permiten que nuestros proyectos funcionen en diferentes navegadores y dispositivos que nuestros usuarios utilizan para navegar por la Web, y ser utilizable por personas con discapacidad.</p>
-
-<p>Determinar qué herramientas debería usar puede ser un proceso difícil, por lo que hemos escrito este conjunto de artículos para informarle qué tipos de herramientas están disponibles, qué pueden hacer por usted y cómo hacer uso de los favoritos actuales de la industria.</p>
-
-<p> </p>
-
-<div class="note">
-<p>Nota: Debido a que aparecen nuevas herramientas y las antiguas pasan de moda todo el tiempo, hemos redactado deliberadamente este material para que sea lo más neutral posible. Queremos enfocarnos ante todo en los tipos generales de tareas que estas herramientas lo ayudarán a lograr. y seguir prescribiendo herramientas específicas al mínimo. Obviamente, necesitamos mostrar el uso de las herramientas para demostrar técnicas específicas, pero ten en cuenta que no necesariamente recomendamos estas herramientas como la mejor o la única forma de hacer las cosas; en la mayoría de los casos, existen otras formas, pero queremos brindarte una idea clara. Metodología que funciona.</p>
-</div>
-
-<h2 id="Camino_de_aprendizaje">Camino de aprendizaje</h2>
-
-<p> </p>
-
-<p>Debería aprender los conceptos básicos de los lenguajes <a href="https://developer.mozilla.org/en-US/docs/Learn/HTML">HTML</a>, <a href="https://developer.mozilla.org/en-US/docs/Learn/CSS">CSS</a>, y <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript">JavaScript</a> antes de intentar usar las herramientas que se detallan aquí. Por ejemplo, deberá conocer los fundamentos de estos idiomas antes de comenzar a depurar problemas en códigos web complejos, o hacer un uso efectivo de las bibliotecas de JavaScript, o escribir pruebas y ejecutarlas en su código utilizando corredores de prueba, etc.</p>
-
-<p>Primero necesitas una base sólida.</p>
-
-<p> </p>
-
-<h2 id="Módulos">Módulos</h2>
-
-<dl>
- <dt><span class="tlid-translation translation"><span title="">Herramientas de desarrollo web en el mundo real (TBD)</span></span></dt>
- <dd>En este módulo, exploramos los diferentes tipos de herramientas de desarrollo web disponibles. Esto incluye la revisión de los tipos de tareas más comunes a las que se le puede pedir que resuelva, cómo pueden encajar en un flujo de trabajo y las mejores herramientas disponibles actualmente para llevar a cabo esas tareas.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing">Pruebas de navegadores cruzados</a></dt>
- <dd>Este módulo analiza específicamente el área de prueba de proyectos web en diferentes navegadores. Aquí vemos cómo identificar a su público objetivo (por ejemplo, qué usuarios, navegadores y dispositivos necesita preocuparse más), cómo realizar las pruebas, los principales problemas que enfrentará con los diferentes tipos de código y cómo solucionar o mitigue esos problemas, qué herramientas son más útiles para ayudarlo a probar y solucionar problemas, y cómo utilizar la automatización para acelerar las pruebas.</dd>
-</dl>
diff --git a/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/index.html b/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/index.html
deleted file mode 100644
index e9bdd36eca..0000000000
--- a/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: Entendiendo los frameworks de JavaScript del lado del cliente
-slug: Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks
-tags:
-  - Aprender
-  - Principiante
-translation_of: Learn/Tools_and_testing/Client-side_JavaScript_frameworks
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">Los frameworks de JavaScript son una parte esencial del desarrollo web front-end moderno, los cuales proveen a los desarrolladores herramientas probadas y testeadas para la creación de aplicaciones web interactivas y escalables. Muchas empresas modernas utilizan frameworks como parte estándar de sus herramientas, por lo que muchos trabajos de desarrollo front-end en la actualidad requieren experiencia en frameworks.</p>
-
-<p class="summary">Como aspirante a desarrollador front-end, puede resultar difícil saber por dónde empezar cuando se trata de aprender sobre frameworks; hay muchos frameworks diferentes para elegir, nuevas opciones surgen todo el tiempo. En su mayoría funcionan de forma similar, pero hacen algunas cosas de manera diferente, y hay algunas cosas específicas con las que se debe tener cuidado a la hora de usar frameworks.</p>
-
-<p class="summary">En esta serie de artículos, tenemos como objetivo brindarte un punto de partida cómodo que te sirva de ayuda para comenzar a aprender sobre frameworks. Nuestra intención no es enseñarte, de manera exhaustiva, todo lo que se necesita saber sobre React/ReactDOM, o Vue, o algún otro framework en específico; la documetación de los equipos de los frameworks (entre otros recursos) ya cumplen esta función. En su lugar, queremos brindarte respaldo y responder primero a preguntas más fundamentales como:</p>
-
-<ul>
- <li class="summary">¿Por qué debería hacer uso de un framework? ¿Qué problemas me resuelven estos?</li>
- <li class="summary">¿Qué preguntar a la hora de escoger un framework? ¿En verdad necesito usar un framework?</li>
- <li class="summary">¿Qué características tienen los frameworks? ¿Cómo funcionan en general y cómo se diferencian las maneras en que los frameworks implementan estas características?</li>
- <li class="summary">¿Cómo se relacionan con JavaScript "puro" o HTML?</li>
-</ul>
-
-<p class="summary">Después de esto, proveeremos algunos tutoriales que cubren los aspectos básicos de algunos de los diferentes frameworks que existen, de manera que puedas tener el contexto y la familiaridad suficientes para poder empezar a profundizar por tu propia cuenta. Queremos que avances y aprendas sobre los frameworks de manera pragmática, de forma tal que se tengan presente las buenas prácticas esenciales de la plataforma web, como lo es la accesibilidad.</p>
-
-<p class="summary"><strong><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Empieza ahora con "Introducción a los frameworks del lado del cliente"</a></strong></p>
-
-<h2 id="Prerrequisitos">Prerrequisitos</h2>
-
-<p>Antes de intentar aprender sobre los frameworks del lado del cliente, es recomendable que conozcamos los conceptos básicos de los principales lenguajes de la web: <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, y —especialmente— <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>.</p>
-
-<p>Como resultado, tu código será más consistente y profesional, por lo que podrás solucionar problemas con mayor confianza si comprende las características fundamentales de la plataforma web sobre las que se basan los frameworks.</p>
-
-<h2 id="Guías_introductorias">Guías introductorias</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">1. Introducción a los frameworks del lado del cliente</a></dt>
- <dd>Comenzamos nuestro estudio sobre los frameworks con una descripción general del área, repasando un poco de historia sobre JavaScript y los frameworks, por qué estos existen, y qué nos brindan; por donde empezar al momento de escoger un framework por aprender y qué alternativas existen a los frameworks del lado del cliente.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">2. Características principales de los frameworks</a></dt>
- <dd>Cada framework destacado de JavaScript tiene un enfoque diferente para actualizar el DOM, manejar los eventos del navegador, y brindarte una experiencia de desarrollo satisfactoria. En este artículo, exploraremos las características principales de "los cuatro grandes" frameworks, observando cómo estos tienden a operar desde un nivel alto, al igual que las diferencias entre ellos.</dd>
-</dl>
-
-<h2 id="Tutoriales_de_React">Tutoriales de React</h2>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Los tutoriales de React se probaron por última vez en mayo de 2020, con React/ReactDOM 16.13.1 y create-react-app 3.4.1.</p>
-
-<p>Si necesitas comparar tu código con nuestra versión, puedes encontrar una versión terminada de la muestra del código de la aplicación React en nuestro <a href="https://github.com/mdn/todo-react">repositorio todo-react</a>. Para una versión en vivo, consulta <a href="https://mdn.github.io/todo-react-build/">https://mdn.github.io/todo-react-build/</a>.</p>
-</div>
-
-<dl>
- <dt><a href="/es/docs/Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started">1. Primeros pasos en React</a></dt>
- <dd>En este artículo conoceremos React. Descubriremos algunos detalles sobre su trasfondo y casos de uso, configuraremos una cadena básica de herramientas para React en nuestra computadora local, crearemos y jugaremos con una aplicación inicial sencilla, mientras aprendemos —durante el proceso— un poco acerca de cómo funciona React.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">2. Comenzando con nuestra lista de tareas de React</a></dt>
- <dd>Digamos que se nos ha encomendado la tarea de crear una prueba de concepto (Proof of Concept — PoC) en React: una aplicación que permita a los usuarios agregar, editar y eliminar tareas en las que se quiera trabajar, pero que también permita marcar las tareas como completadas sin eliminarlas. Este artículo te guiará en la organización de la estructura y los estilos básicos del componente <code>App</code>, de manera que esté listo para la definición e interactividad de componentes individuales, los cuales agregaremos más adelante.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">3. Basando nuestra aplicación React en componentes</a></dt>
- <dd>Hasta este momento, nuestra aplicación no hace gran cosa. Antes de que podamos hacerla funcionar, tenemos que dividirla en componentes descriptivos y manejables. React no tiene reglas estrictas para lo que, se considera o no, un componente, ¡eso depende de ti! En este artículo, te mostraremos una forma raznoable de dividir nuestra aplicación en componentes.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">4. Interactividad en React: eventos y estado</a></dt>
- <dd>Habiendo elaborado nuestro plan de componentes, es hora de comenzar a actualizar nuestra aplicación, para que pase de ser una interfaz de usuario completamente estática a una que nos permita, realmente, interactuar y cambiar las cosas. Es eso mismo lo que haremos en este artículo, profundizando en los eventos y el estado a medida que avancemos.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">5. Interactividad en React: edición, filtrado, renderizado condicional</a></dt>
- <dd>A medida que nos acercamos al final de nuestro viaje en React (al menos por ahora), agregaremos los toques finales a las áreas principales de funcionalidad en nuestra aplicación de lista de tareas. Esto incluye permitir la edición de tareas existentes y el filtrado de la lista de tareas entre todas las tareas, las completadas, y las incompletas. A lo largo del capítulo, veremos la renderización condicional de la interfaz de usuario.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">6. Accesibilidad en React</a></dt>
- <dd>En el artículo final de nuestro tutorial, nos enfocaremos en la accesibilidad (broma intencional), incluyendo la gestión del enfoque en React, la cual puede mejorar la usabilidad y reducir la confusión para usuarios que navegan tanto, a través de lectores de pantalla, como solo del teclado.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">7. Recursos sobre React</a></dt>
- <dd>En nuestro artículo final, te brindamos una lista de recursos sobre React, los cuales podrás utilizar para avanzar más en tu aprendizaje.</dd>
-</dl>
-
-<h2 id="Tutoriales_de_Ember">Tutoriales de Ember</h2>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Los tutoriales de Ember se probaron por última vez en mayo de 2020, con Ember/Ember CLI versión 3.18.0.</p>
-
-<p>Si necesitas comparar tu código con nuestra versión, puedes encontrar una versión terminada de la muestra del código de la aplicación Ember en nuestro <a href="https://github.com/NullVoxPopuli/ember-todomvc-tutorial/tree/master/steps/00-finished-todomvc/todomvc">repositorio ember-todomvc-tutorial</a>. Para una versión en vivo, consulta <a href="https://nullvoxpopuli.github.io/ember-todomvc-tutorial/">https://nullvoxpopuli.github.io/ember-todomvc-tutorial/</a> (esto también incluye algunas características adicionales que no se cubren en este tutorial).</p>
-</div>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">1. Primeros pasos en Ember</a></dt>
- <dd>En nuestro primer artículo de Ember veremos cómo funciona Ember y para qué resulta útil, instalaremos la cadena de herramientas de Ember de manera local, crearemos una aplicación de muestra, y luego realizaremos una configuración inicial para prepararla para el desarrollo.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">2. Estructura de una aplicación Ember y cómo se basa en componentes</a></dt>
- <dd>En este artículo, continuaremos planificando la estructura de nuestra aplicación Ember TodoMVC, agregando el HTML necesario y luego dividiendo esa estructura HTML en componentes.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">3. Interactividad de Ember: eventos, clases, y estado</a></dt>
- <dd>En este punto, comenzaremos a agregar un poco de interactividad a nuestra aplicación, dándole la capacidad de agregar y mostrar nuevos elementos de tareas por hacer. A medida que avanzamos, veremos el uso de eventos en Ember, la creación de clases de componentes para contener código JavaScript que controle las funciones interactivas, y la configuración de un servicio para hacer seguimiento del estado de los datos de nuestra aplicación.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">4. Interactividad de Ember: funcionalidad del footer, renderizado condicional</a></dt>
- <dd>Ahora es momento de comenzar a abordar la funcionalidad del footer en nuestra aplicación. Aquí haremos que el contador de tareas pendientes se actualice de manera que muestre el número correcto de tareas pendientes por completar, y aplicaremos correctamente los estilos a las tareas completadas (es decir, aquellos donde la casilla de verificación ha sido marcada). También conectaremos nuestro botón "Borrar completados". A lo largo del capítulo, aprenderemos sobre el uso de la renderización condicional en nuestras plantillas.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">5. Enrutamiento en Ember</a></dt>
- <dd>En este artículo aprendemos sobre enrutamiento o el filtrado basado en URL, como a veces se lo denomina. Lo usaremos para proporcionar una URL única para cada una de las tres vistas de tareas: "Todas", "Activas" y "Completadas".</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">6. Recursos sobre y solución de problemas</a></dt>
- <dd>En nuestro artículo final sobre Ember, te proporcionamos una lista de recursos que puedes utilizar para avanzar más en tu aprendizaje, además de información útil para la solución problemas y otra información.</dd>
-</dl>
-
-<h2 id="Tutoriales_de_Vue">Tutoriales de Vue</h2>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Los tutoriales de Vue se probaron por última vez en mayo de 2020, con Vue 2.6.11.</p>
-
-<p>Si necesitas comparar tu código con nuestra versión, puedes encontrar una versión terminada de la muestra del código de la aplicación Vue en nuestro <a href="https://github.com/mdn/todo-vue">repositorio todo-vue</a>. Para una verisón en vivo, consulta <a href="https://mdn.github.io/todo-vue/dist/">https://mdn.github.io/todo-vue/dist/</a>.</p>
-</div>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">1. Primeros pasos en Vue</a></dt>
- <dd>A continuación, presentamos Vue, el tercero de nuestros frameworks. En este artículo, veremos un poco sobre el origen de Vue, aprenderemos cómo instalarlo y crear un nuevo proyecto, estudiaremos la estructura de alto nivel de todo el proyecto y de un componente individual, veremos cómo ejecutar el proyecto localmente y prepararlo para comenzar a construir nuestro ejemplo.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">2. Creando nuestro primer componente de Vue</a></dt>
- <dd>Ahora es momento de profundizar en Vue y crear nuestro propio componente personalizado: comenzaremos creando un componente para representar cada elemento en la lista de tareas. Durante el artículo, aprenderemos sobre algunos conceptos importantes, como llamar a componentes dentro de otros componentes, pasarles datos a través de props y guardar el estado de los datos.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">3. Renderizando una lista de componentes de Vue</a></dt>
- <dd><span class="author-d-1gg9uz65z1iz85zgdz68zmqkz84zo2qoxwoxz78zz83zz84zz69z2z80zgwxsgnz83zfkt5e5tz70zz68zmsnjz122zz71z">En este punto, tenemos un componente completamente funcional; ahora estamos listos para agregar varios componentes <code>ToDoItem</code> a nuestra aplicación. En este artículo, veremos cómo agregar un conjunto de datos de elementos de tareas a nuestro componente <code>App.vue</code>, el cual luego repasaremos en bucle, mostrando dentro de los componentes de <code>ToDoItem</code> mediante el uso de la directiva <code>v-for</code>. </span></dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">4. Agregar una nueva forma de tareas pendientes: eventos, métodos y modelos de Vue</a></dt>
- <dd>Ahora tenemos datos de muestra listos y un ciclo que toma cada bit de datos y lo renderiza dentro de un <code>ToDoItem</code> en nuestra aplicación. Lo que realmente necesitamos a continuación es la capacidad de permitirle a nuestros usuarios que introuduzcan sus propios elementos de tareas pendientes en la aplicación, y para ello, necesitaremos un <code>&lt;input&gt;</code> de texto, un evento para efectuar una vez se envíen los datos, un método por accionar al momento del envío para agregar los datos y volver a renderizar la lista, y un modelo para controlar los datos. Esto es lo que cubriremos en este artículo.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">5. Agregando estilos a los componentes de Vue con CSS</a></dt>
- <dd>Por fin ha llegado el momento de hacer que nuestra aplicación luzca un poco mejor. En este artículo, exploraremos las diferentes formas de agregar estilos a los componentes de Vue con CSS.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">6. Usando propiedades calculadas de Vue</a></dt>
- <dd>En este artículo, agregaremos un contador que muestre el número de tareas completadas, utilizando una función de Vue llamada propiedades calculadas. Estos funcionan de manera similar a los métodos, pero solo se vuelven a ejecutar cuando cambia una de sus dependencias.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">7. Renderización condicional en Vue: editando tareas existentes</a></dt>
- <dd>Ahora es momento de agregar una de las principales piezas de la funcionalidad que aún nos falta: la capacidad de editar tareas existentes. Para hacer esto, aprovecharemos las capacidades de renderizado condicional de Vue, es decir, <code>v-if</code> y <code>v-else</code>, los cuales nos permiten alternar entre la vista de una tarea existente y una vista de edición donde podremos actualizar las etiquetas de las tareas. También veremos cómo agregar funcionalidad para eliminar tareas.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">8. Gestión de enfoque con Vue refs</a></dt>
- <dd>Ya estamos cerca de terminar con Vue. La última funcionalidad a considerar es la gestión del enfoque, o dicho de otra manera, cómo podemos mejorar la accesibilidad de nuestra aplicación desde el teclado. Veremos el uso de Vue refs para manejar esto, una característica avanzada que nos permite tener acceso directo a los nodos DOM subyacentes debajo del DOM virtual, o acceso directo desde un componente a la estructura DOM interna de un componente interno.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">9. Recursos sobre Vue</a></dt>
- <dd>Ahora, completaremos nuestro estudio de Vue brindándote una lista de recursos que podrás utilizar para avanzar en tu aprendizaje, además de algunos otros consejos útiles.</dd>
-</dl>
-
-<h2 id="¿Cuales_frameworks_hemos_escogido">¿Cuales frameworks hemos escogido?</h2>
-
-<p>Hacemos pública nuestra serie inicial de artículos con guías enfocadas en tres de los principales frameworks que existen: React/ReactDOM, Ember, y Vue. Esto se debe a varias un razones:</p>
-
-<ul>
- <li>Son opciones populares que estarán disponibles por un largo tiempo. Al igual que con cualquier otra herramienta de software, es bueno apegarse a opciones que son desarrolladas de manera activa, lo que indica que, probablemente, no serán descontinuadas dentro de poco, lo que las convierte en complementos atractivos para mostrar como habilidades a la hora de buscar un trabajo.</li>
- <li>Tienen comunidades sólidas y una buena documentación. Es muy importante poder obtener ayuda al aprender un tema complejo, especialmente cuando recién se está comenzando.</li>
- <li>No contamos con los recursos para cubrir todos los frameworks modernos. Una lista así resultaría muy difícil de mantener actualizada, ya que todo el tiempo están surgiendo nuevos frameworks.</li>
- <li>Como principiante, tratar de escoger en qué concentrarte entre la gran cantidad de opciones disponibles es un gran problema. Por lo tanto, resulta útil mantener una lista corta.</li>
-</ul>
-
-<p>Queremos decir esto desde un principio: <strong>no</strong> hemos escogido los frameworks en los que nos estamos enfocando porque pensamos que son los mejores o porque los respaldamos de alguna manera. Simplemente, consideramos que obtienen una puntuación alta de acuerdo a los criterios anteriores.</p>
-
-<p>Ten en cuenta que esperábamos poder incluir más frameworks en la publicación inicial, pero que decidimos publicar el contenido y agregar, más adelante, otras guías, en lugar de retrasarlo más. Si tu framework favorito no se encuentra listado en este contenido y te gustaría ayudar a cambiar esto, ¡no dudes en discutirlo con nosotros! Puedes contactarnos a través de <a href="https://wiki.mozilla.org/Matrix">Matrix</a>, o <a href="https://discourse.mozilla.org/c/mdn">Discourse</a>, o enviarnos un correo electrónico a la <a href="mailto:mdn-admins@mozilla.org">lista mdn-admins</a>.</p>
diff --git a/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/react_getting_started/index.html b/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/react_getting_started/index.html
deleted file mode 100644
index 09c28f11a9..0000000000
--- a/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/react_getting_started/index.html
+++ /dev/null
@@ -1,476 +0,0 @@
----
-title: Primeros pasos en React
-slug: >-
-  Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started
-tags:
-  - Aprender
-  - Aprendiz
-  - Principiante
-translation_of: >-
-  Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</div>
-
-<p class="summary">En este artículo conoceremos React. Descubriremos algunos detalles sobre su trasfondo y casos de uso, configuraremos una cadena básica de herramientas para React en nuestra computadora local, crearemos y jugaremos con una aplicación inicial sencilla, mientras aprendemos —durante el proceso— un poco acerca de cómo funciona React.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>
-    <p>Familiaridad con los lenguajes <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, y <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>, conocimiento del <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">terminal/línea de comandos</a>.</p>
-
-    <p>React usa una sintaxis HTML-en-JavaScript llamada JSX (JavaScript y XML). Estar familiarizado con HTML y JavaScript te ayudará a aprender JSX, y a identificar —en una mejor manera— si los errores en tu aplicación están relacionados con JavaScript o con el más específico dominio de React.</p>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Configurar un entorno de desarrollo local para React, crear una aplicación inicial, y entender los aspectos básicos de su funcionamiento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Hola_React">Hola, React</h2>
-
-<p>Como su eslogan oficial señala, <a href="https://es.reactjs.org/">React</a> es una biblioteca para construir interfaces de usuario. React no es un <em>framework</em> — ni siquiera se limita a la web. React es utilizado con otras bibliotecas para renderizar en ciertos entornos. Por ejemplo, <a href="https://reactnative.dev/">React Native</a> puede usarse para desarrollar aplicaciones móviles; <a href="https://facebook.github.io/react-360/">React 360</a> permite crear aplicaciones de realidad virtual; además de otras posibilidades.</p>
-
-<p>Al desarrollar para la web, los desarrolladores usan React en conjunto con <a href="https://reactjs.org/docs/react-dom.html">ReactDOM</a>. React y ReactDOM son, a menudo, considerados al igual que —y utilizados para resolver los mismo problemas que— otros verdaderos frameworks de desarrollo web. Cuando nos referimos a React como un "framework", estamos trabajando con este significado coloquial.</p>
-
-<p>El objetivo principal de React es minimizar los errores que ocurren cuando los desarrolladores construyen interfaces de usuario. Esto lo hace mediante el uso de componentes — piezas de código lógicas y auto-contenidas que describen una parte de la interfaz del usuario. Estos componentes se pueden juntar para crear una interfaz de usuario completa, y React abstrae la mayor parte del trabajo de renderizado, permitiéndote enfocarte en el diseño de la interfaz.</p>
-
-<h2 id="Casos_de_uso">Casos de uso</h2>
-
-<p>A diferencia de los otros frameworks vistos en este módulo, React no impone reglas estrictas sobre convenciones de código u organización de archivos. Esto le permite a los equipos establecer las convenciones que funcionen mejor para ellos y adoptar React de la manera en que deseen. React puede manejar un solo botón, algunas piezas de una interfaz o la interfaz de usuario completa de una aplicación.</p>
-
-<p>Si bien React <em>puede</em> usarse para <a href="https://es.reactjs.org/docs/add-react-to-a-website.html">pequeñas piezas de una interfaz</a>, no resulta tan sencillo "introducirlo" en una aplicación como sería el caso de una biblioteca como jQuery —o incluso de un framework, como Vue—, por lo que viene a ser más abordable cuando construimos una aplicación completamente con React.</p>
-
-<p>Además, muchos de los beneficios de la experiencia del desarrollador de una aplicación React, como codificar interfaces con JSX, requieren un proceso de compilación. Agregar un compilador como Babel a un sitio web hace que el código se ejecute de manera lenta, por lo que los desarrolladores a menudo configuran dichas herramientas con un paso de compilación. Podrá decirse que React tiene un gran requisito de herramientas, pero se puede aprender.</p>
-
-<p>Este artículo se enfocará en el caso de uso de usar React para renderizar la interfaz de usuario completa de una aplicación, usando herramientas proporcionadas por la propia herramienta de Facebook <a href="https://create-react-app.dev/">create-react-app</a>.</p>
-
-<h2 id="¿Cómo_React_usa_JavaScript">¿Cómo React usa JavaScript?</h2>
-
-<p>React utiliza características modernas de JavaScript para muchos de sus patrones. El punto donde más se aleja de JavaScript se refleja en el uso de la sintaxis <a href="https://es.reactjs.org/docs/introducing-jsx.html">JSX</a>, la que, a su vez, amplía la sintaxis de JavaScript para que código similar a HTML pueda formar parte del mismo. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">const heading = &lt;h1&gt;Mozilla Developer Network&lt;/h1&gt;;</pre>
-
-<p>Esta constante "heading" se conoce como una <strong>expresión JSX</strong>. React puede usarla para representar la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/Heading_Elements">&lt;h1&gt;</a></code> en nuestra aplicación.</p>
-
-<p>Supongamos que, por razones semánticas, queremos envolver nuestro encabezado en una etiqueta <code><a href="/en-US/docs/Web/HTML/Element/header">&lt;header&gt;</a></code>. El enfoque JSX nos permite anidar nuestros elementos entre sí, tal como lo hacemos con HTML:</p>
-
-<pre class="brush: js notranslate">const header = (
-  &lt;header&gt;
-    &lt;h1&gt;Mozilla Developer Network&lt;/h1&gt;
-  &lt;/header&gt;
-);</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Los paréntesis en el fragmento anterior no son exclusivos de JSX y no tienen ningún efecto en la aplicación. Son una señal para ti (y tu computadora) de que las múltiples líneas de código que contiene forman parte de una misma expresión. También podríamos escribir la expresión del encabezado de esta manera:</p>
-
-<pre class="brush: js notranslate">const header = &lt;header&gt;
-    &lt;h1&gt;Mozilla Developer Network&lt;/h1&gt;
-&lt;/header&gt;</pre>
-
-<p>Sin embargo, esto luce un poco raro, ya que la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/header">&lt;header&gt;</a></code> que inicia la expresión no tiene sangría en la misma posición que su correspondiente etiqueta de cierre.</p>
-</div>
-
-<p>Por supuesto, tu navegador no puede leer JSX sin ayuda. Al compilarla (usando una herramienta como <a href="https://babeljs.io/">Babel</a> o <a href="https://parceljs.org/">Parcel</a>), nuestra expresión de encabezado se vería así:</p>
-
-<pre class="brush: js notranslate">const header = React.createElement("header", null,
-  React.createElement("h1", null, "Mozilla Developer Network")
-);</pre>
-
-<p>Es <em>posible</em> omitir el paso de la compilación y usar <code><a href="https://reactjs.org/docs/react-api.html#createelement">React.createElement()</a></code> para codificar la interfaz de usuario tú mismo. Sin embargo, al hacer esto, perderías el beneficio declarativo de JSX y tu código resultaría más difícil de leer. La compilación es un paso adicional en el proceso de desarrollo, pero muchos desarrolladores de la comunidad React piensan que la legibilidad de JSX vale la pena. Además, las herramientas populares hacen que la compilación de JSX a JavaScript sea parte de su proceso de configuración. No tendrás que configurar la compilación tú mismo, a menos que así lo quieras.</p>
-
-<p>Dado que JSX es una combinación de HTML y JavaScript, algunos desarrolladores lo encuentran intuitivo. Otros dicen que su naturaleza combinada lo hace confuso. Sin embargo, una vez que te sientas cómodo con JSX, te permitirá crear interfaces de usuario de forma más rápida e intuitiva, y permitirá que otros comprendan mejor tu base de código de un vistazo.</p>
-
-<p>Para leer más sobre JSX, consulta el artículo <a href="https://es.reactjs.org/docs/jsx-in-depth.html">JSX en profundidad</a> del equipo de React.</p>
-
-<h2 id="Configurando_tu_primera_aplicación_React">Configurando tu primera aplicación React</h2>
-
-<p>Hay muchas maneras de usar React, pero usaremos la herramienta create-react-app de la interfaz de línea de comandos (CLI, por sus siglas en inglés), como se mencionó anteriormente, la cual acelera el proceso de desarrollo de una aplicación React al instalar algunos paquetes y crear algunos archivos por ti, manejando las herramientas descritas anteriormente.</p>
-
-<p>Es posible <a href="https://es.reactjs.org/docs/add-react-to-a-website.html">agregar React a un sitio website sin usar create-react-app</a> copiando algunos elementos <code><a href="/en-US/docs/Web/HTML/Element/script">&lt;script&gt;</a></code> en un archivo HTML, pero la CLI de create-react-app es un punto de partida común para las aplicaciones React. Su uso te permitirá dedicar más tiempo a crear tu aplicación y menos a preocuparte por la configuración.</p>
-
-<h3 id="Requerimientos">Requerimientos</h3>
-
-<p>Para usar create-react-app, necesitas tener instalado <a href="https://nodejs.org/en/">Node.js</a>. Se recomienda utilizar la versión de soporte a largo plazo (LTS, por sus siglas en inglés). Node incluye npm (el administrador de paquetes de nodos), y npx (el ejecutor de paquetes de nodos).</p>
-
-<p>También puedes usar el administrador de paquetes Yarn como alternativa, pero asumiremos que estarás usando npm en estos tutoriales. Consulta <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management">Conceptos básicos de administración de paquetes</a> para obtener más información sobre npm y yarn.</p>
-
-<p>Si estás usando Windows, necesitarás instalar algún software para darle paridad con el terminal Unix/macOS, y así poder usar los comandos del terminal mencionados en este tutorial. <strong>Gitbash</strong> (el cual viene como parte del <a href="https://gitforwindows.org/">conjunto de herramientas git para Windows</a>) o el <strong><a href="https://docs.microsoft.com/en-us/windows/wsl/about">Subsistema de Windows para Linux</a></strong> (<strong>WSL</strong>, por sus siglas en inglés) son ambos adecuados. Consulte el <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">Curso intensivo de línea de comandos</a> para obtener más información sobre estos y sobre los comandos de terminal en general.</p>
-
-<p>También ten en cuenta que React y ReactDOM producen aplicaciones que solo funcionan en un conjunto bastante moderno de navegadores (IE9+ a través de algunos polyfills). Se recomienda el uso de un navegador moderno como Firefox, Safari o Chrome cuando trabajes con estos tutoriales.</p>
-
-<p>Además, consulta lo siguiente para obtener más información:</p>
-
-<ul>
- <li><a href="https://nodejs.org/en/knowledge/getting-started/npm/what-is-npm/">"¿Qué es npm?" en nodejs.org</a></li>
- <li><a href="https://blog.npmjs.org/post/162869356040/introducing-npx-an-npm-package-runner">"Introducing npx" en el blog de npm</a></li>
- <li><a href="https://create-react-app.dev/">La documentación de create-react-app</a></li>
-</ul>
-
-<h3 id="Inicializando_tu_aplicación">Inicializando tu aplicación</h3>
-
-<p>create-react-app recibe un argumento: el nombre que te gustaría darle a tu aplicación. create-react-app usa este nombre para crear una nueva carpeta, luego crea los archivos necesarios dentro de la misma. Asegúrate de <code>cd</code> al lugar donde te gustaría que se guarde tu aplicación en tu disco duro, luego ejecuta lo siguiente en tu terminal:</p>
-
-<pre class="brush: bash notranslate">npx create-react-app moz-todo-react</pre>
-
-<p>Esto crea una carpeta <code>moz-todo-react</code>, y hace varias cosas dentro de la misma:</p>
-
-<ul>
- <li>Instala algunos paquetes npm esenciales para la funcionalidad de la aplicación.</li>
- <li>Escribe scripts para iniciar y servir la aplicación.</li>
- <li>Crea una estructura de archivos y carpetas que definen la arquitectura básica de la aplicación.</li>
- <li>Inicializa la carpeta como un repositorio de git, si tienes git instalado en tu computadora.</li>
-</ul>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: si tienes instalado el administrador de paquetes yarn, create-react-app lo usará por defecto en lugar de npm. Si tienes ambos administradores de paquetes instalados y quieres, explícitamente, usar npm, puedes agregar el indicador <code>--use-npm</code> cuando ejecutes create-react-app:</p>
-
-<pre class="brush: bash notranslate">npx create-react-app moz-todo-react --use-npm</pre>
-</div>
-
-<p>create-react-app mostrará una serie de mensajes en tu terminal mientras opera, ¡lo cual es normal! Esto puede tardar unos minutos, por lo que ahora podría ser un buen momento para preparar una taza de té.</p>
-
-<p>Una vez completado el proceso, <code>cd</code> a la carpeta <code>moz-todo-react</code> y ejecuta el comando <code>npm start</code>. Los scripts instalados por create-react-app comenzarán a servirse en un servidor local en <code>localhost:3000</code> y abrirán la aplicación en una nueva pestaña del navegador. Tu navegador mostrará algo como esto:</p>
-
-<p><img alt="Screenshot of Firefox MacOS, open to localhost:3000, showing the default create-react-app application" src="https://mdn.mozillademos.org/files/17203/default-create-react-app.png" style="border-style: solid; border-width: 1px; height: 980px; width: 1600px;"></p>
-
-<h3 id="Estructura_de_la_aplicación">Estructura de la aplicación</h3>
-
-<p>create-react-app nos provee todo lo que necesitamos para desarrollar una aplicación React. Su estructura inicial de archivos luce así:</p>
-
-<pre class="notranslate">moz-todo-react
-├── README.md
-├── node_modules
-├── package.json
-├── package-lock.json
-├── .gitignore
-├── public
-│   ├── favicon.ico
-│   ├── index.html
-│   └── manifest.json
-└── src
-    ├── App.css
-    ├── App.js
-    ├── App.test.js
-    ├── index.css
-    ├── index.js
-    ├── logo.svg
-    └── serviceWorker.js</pre>
-
-<p>La carpeta <strong><code>src</code></strong> es donde pasaremos la mayor parte de nuestro tiempo, ya que es donde reside el código fuente de nuestra aplicación.</p>
-
-<p>La carpeta <strong><code>public</code></strong> contiene archivos que serán leidos por tu navegador mientras desarrollas la aplicación; el más importante de ellos es <code>index.html</code>. React introduce tu código en este archivo de manera que tu navegador pueda ejecutarlo. Hay alguno que otro marcado que ayuda a create-react-app a funcionar, así que ten cuidado de no editarlo a menos que sepas lo que estás haciendo. Deberías cambiar el texto dentro del elemento <code><a href="/en-US/docs/Web/HTML/Element/title">&lt;title&gt;</a></code> en este archivo para reflejar el título de tu aplicación. ¡Los títulos de página precisos son importantes para la accesibilidad!</p>
-
-<p>La carpeta <code>public</code> también será publicada cuando crees y despliegues una versión para producción de tu aplicación. No cubriremos el despliegue en este tutorial, pero deberías poder usar una solución similar a la descrita en nuestro tutorial <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Deployment">Despliegue de nuestra aplicación</a>.</p>
-
-<p>El archivo <code>package.json</code> contiene información sobre nuestro proyecto que Node.js/npm usa para mantenerlo organizado. Este archivo no es exclusivo de las aplicaciones React; create-react-app simplemente lo completa. No es necesario que entiendas este archivo en lo absoluto para completar este tutorial, sin embargo, si deseas obtener más información al respecto, puedes leer <a href="https://nodejs.org/en/knowledge/getting-started/npm/what-is-the-file-package-json/">What is the file `package.json`? en NodeJS.org</a>; también hablamos de ello en nuestro tutorial <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management">Conceptos básicos de administración de paquetes</a>.</p>
-
-<h2 id="Explorando_nuestro_primer_componente_React_—_&lt;App>">Explorando nuestro primer componente React — <code>&lt;App/&gt;</code></h2>
-
-<p>En React, un <strong>componente</strong> es un módulo reutilizable que representa una parte de nuestra aplicación. Estas partes pueden ser grandes o pequeñas, pero, generalmente, están bien definidas: tienen un propósito único y obvio.</p>
-
-<p>Abramos <code>src/App.js</code>, ya que nuestro navegador nos pide que lo editemos. Este archivo contiene nuestro primer componente —<code>App</code>—, y algunas otras líneas de código:</p>
-
-<pre class="brush: js notranslate">import React from 'react';
-import logo from './logo.svg';
-import './App.css';
-
-function App() {
-  return (
-    &lt;div className="App"&gt;
-      &lt;header className="App-header"&gt;
-        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
-        &lt;p&gt;
-          Edit &lt;code&gt;src/App.js&lt;/code&gt; and save to reload.
-        &lt;/p&gt;
-        &lt;a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        &gt;
-          Learn React
-        &lt;/a&gt;
-      &lt;/header&gt;
-    &lt;/div&gt;
-  );
-}
-export default App;</pre>
-
-<p>El archivo <code>App.js</code> se compone de tres partes principales: algunas declaraciones <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/import">import</a></code> en la parte superior, el componente <code>App</code> en el medio, y una declaración <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/export">export</a></code> en la parte inferior. La mayoría de los componentes de React siguen este patrón.</p>
-
-<h3 id="Declaraciones_import">Declaraciones <code>import</code></h3>
-
-<p>Las declaraciones <code>import</code> en la parte superior del archivo le permiten a <code>App.js</code> utilizar código que ha sido definido en otra parte. Revisemos estas declaraciones más detalladamente.</p>
-
-<pre class="brush: js notranslate">import React from 'react';
-import logo from './logo.svg';
-import './App.css';</pre>
-
-<p>La primera declaración importa la biblioteca React como tal. Dado que React convierte el JSX que escribimos en <code>React.createElement()</code>, todos los componentes de React deben importar el módulo <code>React</code>. Si omites este paso, tu aplicación producirá un error.</p>
-
-<p>La segunda declaración importa un logotipo de <code>'./logo.svg'</code>. Observa el uso de <code>./</code> al principio de la ruta y la extensión <code>.svg</code> al final — estos nos indican que el archivo es local y que no es un archivo JavaScript. De hecho, el archivo <code>logo.svg</code> reside en nuestra carpeta raíz.</p>
-
-<p>No hace falta proveer una ruta o extensión al importar el módulo <code>React</code>, ya que este no es un archivo local. En cambio, aparece como una dependencia en nuestro archivo <code>package.json</code>. ¡Ten cuidado con esta distinción mientras trabajas en esta lección!</p>
-
-<p>La tercera declaración importa el CSS relacionado con nuestro componente <code>App</code>. Observa que no hay nombre de variable ni de directiva <code>from</code>. Esta sintaxis de importación en particular no es propia de la sintaxis de módulos de JavaScript. Esta proviene de Webpack, la herramienta que create-react-app usa para agrupar todos nuestros archivos JavaScript y enviarlos al navegador.</p>
-
-<h3 id="El_componente_App">El componente <code>App</code></h3>
-
-<p>Después de las importaciones, tenemos una función llamada <code>App</code>. Mientras que una mayor parte de la comunidad JavaScript prefiere nombres tipo <em>camel-case</em> como <code>helloWorld</code>, los componentes de React usan nombres de variables tipo <em>pascal-case</em>, como <code>HelloWorld</code>, para dejar en claro que un determinado elemento JSX es un componente de React y no una etiqueta HTML normal. Si llegaras a cambiar el nombre de la función <code>App</code> por <code>app</code>, tu navegador te mostraría un error.</p>
-
-<p>Vamos a darle un vistazo más detallado a <code>App</code>.</p>
-
-<pre class="brush: js notranslate">function App() {
-  return (
-    &lt;div className="App"&gt;
-      &lt;header className="App-header"&gt;
-        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
-        &lt;p&gt;
-          Edit &lt;code&gt;src/App.js&lt;/code&gt; and save to reload.
-        &lt;/p&gt;
-        &lt;a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        &gt;
-          Learn React
-        &lt;/a&gt;
-      &lt;/header&gt;
-    &lt;/div&gt;
-  );
-}</pre>
-
-<p>La función <code>App</code> devuelve una expresión JSX. Esta expresión define lo que tu navegador presenta en última instancia al DOM.</p>
-
-<p>Algunos elementos de la expresión tienen atributos, los cuales se escriben igual que en HTML, siguiendo un patrón de <code>atributo="valor"</code>. En la línea 3, la etiqueta de apertura <code><a href="/en-US/docs/Web/HTML/Element/div">&lt;div&gt;</a></code> tiene un atributo <code>className</code>. Este es equivalente al atributo <code><a href="/en-US/docs/Web/HTML/Global_attributes/class">class</a></code> de HTML, pues dado que JSX es JavaScript, no podemos usar la palabra <code>class</code> —la cual está reservada—, lo que significa que JavaScript ya la usa para un propósito específico y causaría problemas en nuestro código. Algunos otros atributos HTML también se escriben de manera diferente en JSX (de como se escriben en HTML), por el mismo tipo de razón. Los revisaremos a medida que nos crucemos con estos.</p>
-
-<p>Tómate un momento para cambiar la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/p">&lt;p&gt;</a></code> en la línea 6 para que diga "¡Hola, mundo!", luego guarda los cambios. Notarás que este cambio se procesa inmediatamente en el servidor de desarrollo que se ejecuta en <code>http://localhost:3000</code> en tu navegador. Ahora elimina la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/a">&lt;a&gt;</a></code> y guarda los cambios; el enlace "Learn React" habrá desaparecido.</p>
-
-<p>Ahora, tu componente <code>App</code> debería lucir así:</p>
-
-<pre class="brush: js notranslate">function App() {
-  return (
-    &lt;div className="App"&gt;
-      &lt;header className="App-header"&gt;
-        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
-        &lt;p&gt;
-          ¡Hola, mundo!
-        &lt;/p&gt;
-      &lt;/header&gt;
-    &lt;/div&gt;
-  );
-}</pre>
-
-<h3 id="Declaraciones_export">Declaraciones <code>export</code></h3>
-
-<p>En la parte inferior del archivo <code>App.js</code>, la declaración <code>export default App</code> hace que nuestro componente <code>App</code> esté disponible para otros módulos.</p>
-
-<h2 id="Explorando_el_index">Explorando el index</h2>
-
-<p>Vamos a abrir el archivo <code>src/index.js</code>, ya que es en este donde el componente <code>App</code> está siendo utilizado. Este archivo es el punto de entrada para nuestra aplicación, e inicialmente luce así:</p>
-
-<pre class="brush: js notranslate">import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-import * as serviceWorker from './serviceWorker';
-
-ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));
-
-// If you want your app to work offline and load faster, you can change
-// unregister() to register() below. Note this comes with some pitfalls.
-// Learn more about service workers: https://bit.ly/CRA-PWA
-serviceWorker.unregister();</pre>
-
-<p>Al gual que <code>App.js</code>, el archivo comienza importando todos los módulos JS y otros activos que necesita para ejecutarse. <code>src/index.css</code> contiene estilos globales que se aplican a toda nuestra aplicación. Podemos ver que nuestro componente <code>App</code> también es importado acá; su importación es posible gracias a la declaración <code>export</code> en la parte inferior de <code>App.js</code>.</p>
-
-<p>En la línea 7, se invoca la función <code>ReactDOM.render()</code> de React con dos argumentos:</p>
-
-<ul>
- <li>El componente que queremos renderizar, <code>&lt;App /&gt;</code> en este caso.</li>
- <li>El elemento DOM dentro del cual queremos que se renderice el componente, en este caso, el elemento con un ID de <code>root</code>. Si miras dentro de <code>public/index.html</code>, verás que este es un elemento <code>&lt;div&gt;</code> justo dentro de <code>&lt;body&gt;</code>.</li>
-</ul>
-
-<p>Todo esto le indica a React que queremos renderizar nuestra aplicación React con el componente <code>App</code> como raíz, o primer componente.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: En JSX, los componentes de React y los elementos HTML deben tener, obligatoriamente, barras diagonales de cierre. Escribir solo <code>&lt;App&gt;</code> o solo <code>&lt;img&gt;</code> provocará un error.</p>
-</div>
-
-<p>Los <a href="/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers">Service workers</a> son interesantes piezas de código que ayudan al rendimiento de las aplicaciones y permiten que las funciones de tus aplicaciones web funcionen sin conexión, pero estas no están dentro del alcance de este artículo. Puedes eliminar la línea 5, así como las líneas 9 a 12.</p>
-
-<p>Finalmente, tu archivo <code>index.js</code> debería verse así:</p>
-
-<pre class="brush: js notranslate">import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-
-ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));</pre>
-
-<h2 id="Variables_y_props">Variables y props</h2>
-
-<p>A continuación, usaremos algunas de nuestras habilidades de JavaScript para lograr sentirnos un poco más cómodos editando componentes y trabajando con datos en React. Hablaremos sobre cómo se usan las variables dentro de JSX, e introduciremos props, que son una forma de pasar datos a un componente (al que luego se puede acceder usando variables).</p>
-
-<h3 id="Variables_en_JSX">Variables en JSX</h3>
-
-<p>De vuelta en <code>App.js</code>, enfoquémonos en la línea 9:</p>
-
-<pre class="brush: js notranslate">&lt;img src={logo} className="App-logo" alt="logo" /&gt;</pre>
-
-<p>Aquí, el valor del atributo <code>src</code> de la etiqueta <code>&lt;img /&gt;</code> está entre llaves. Así es como JSX reconoce las variables. Al encontrarse con <code>{logo}</code>, React sabrá que nos referimos a la importación del logotipo en la línea 2 de nuestra aplicación, y luego recuperará el archivo del logo y lo renderizará.</p>
-
-<p>Vamos a intentar crear una variable propia. Antes de la declaración return de <code>App</code>, agrega <code>const subject = "React";</code>. Tu componente <code>App</code> ahora debería verse así:</p>
-
-<pre class="brush: js notranslate">function App() {
-  const subject = "React";
-  return (
-    &lt;div className="App"&gt;
-      &lt;header className="App-header"&gt;
-        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
-        &lt;p&gt;
-          ¡Hola, mundo!
-        &lt;/p&gt;
-      &lt;/header&gt;
-    &lt;/div&gt;
-  );
-}</pre>
-
-<p>Cambia la línea 8, de manera que se use la variable <code>subject</code> en vez de la palabra "mundo", así:</p>
-
-<pre class="brush: js notranslate">function App() {
-  const subject = "React";
-  return (
-    &lt;div className="App"&gt;
-      &lt;header className="App-header"&gt;
-        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
-        &lt;p&gt;
-          ¡Hola, {subject}!
-        &lt;/p&gt;
-      &lt;/header&gt;
-    &lt;/div&gt;
-  );
-}</pre>
-
-<p>Al guardar, tu navegador debería mostrar "¡Hola, React!" en vez de "¡Hola, mundo!"</p>
-
-<p>Las variables son convenientes, pero la que acabamos de configurar no hace gran uso de las funciones de React. Es allí donde entran los props.</p>
-
-<h3 id="Props_de_componentes">Props de componentes</h3>
-
-<p>Un <strong>prop</strong> es cualquier dato que se pasa a un componente de React. Los props se escriben dentro de las llamadas a los componentes y utilizan la misma sintaxis que los atributos HTML: <code>prop="value"</code>. Abramos <code>index.js</code> y démosle a la llamada de nuestro <code>&lt;App/&gt;</code> su primer prop.</p>
-
-<p>Agrega un prop de <code>subject</code> a la llamada del componente <code>&lt;App /&gt;</code>, con un valor de <code>Clarice</code>. Al terminar, tu código debería verse similar a este:</p>
-
-<pre class="brush: js notranslate">ReactDOM.render(&lt;App subject="Clarice" /&gt;, document.getElementById('root'));</pre>
-
-<p>Volviendo a <code>App.js</code>, vamos a revisar nuevamente la función <code>App</code> como tal, la cual se lee así (acortando la declaración <code>return</code> por razones de brevedad):</p>
-
-<pre class="brush: js notranslate">function App() {
-  const subject = "React";
-  return (
-    // return statement
-  );
-}</pre>
-
-<p>Cambia la declaración de la función <code>App</code> de manera que tome <code>props</code> como un parámetro, y elimina la constante <code>subject</code>. Al igual que cualquier otro parámetro de una función, puedes pasar <code>props</code> a <code>console.log()</code> para imprimirlos en la consola de tu navegador. Continúa, haciendo esto antes de la declaración <code>return</code>, así:</p>
-
-<pre class="brush: js notranslate">function App(props) {
-  console.log(props);
-  return (
-    // return statement
-  );
-}</pre>
-
-<p>Guarda tu archivo y revisa la consola JavaScript de tu navegador. Deberías ver registrado algo como esto:</p>
-
-<pre class="brush: js notranslate">Object { subject: "Clarice" }</pre>
-
-<p>La propiedad <code>subject</code> del objeto corresponde al prop <code>subject</code> que agregamos a la llamada de nuestro componente <code>&lt;App /&gt;</code>, y la cadena <code>Clarice</code> corresponde a su valor. Los props de componentes en React siempre se recopilan en objetos de esta manera.</p>
-
-<p>Ahora que <code>subject</code> es uno de nuestros props, usémoslo en <code>App.js</code>. Cambia la constante <code>subject</code> de manera que, en vez de definirla como la cadena <code>React</code>, estés leyendo el valor de <code>props.subject</code>. También puedes eliminar <code>console.log()</code>, si así lo quieres.</p>
-
-<pre class="brush: js notranslate">function App(props) {
-  const subject = props.subject;
-  return (
-    // return statement
-  );
-}</pre>
-
-<p>Una vez guardes, la aplicación debería darte la bienvenida con un "¡Hola, Clarice!". Si regresas a <code>index.js</code>, editas el valor de <code>subject</code>, y guardas, el texto cambiará.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Esto nos lleva al final de nuestra introducción a React, la cual incluye cómo instalarlo de manera local, cómo crear una aplicación inicial, y cómo funcionan los conceptos básicos. En el próximo artículo comenzaremos a construir nuestra primera aplicación como tal: una lista de tareas pendientes. Sin embargo, antes de ello, recapitulemos algunas de las cosas que hemos aprendido.</p>
-
-<p>En React:</p>
-
-<ul>
- <li>Los componentes pueden importar los módulos que necesitan y deben exportarse a sí mismos al final de sus archivos.</li>
- <li>Las funciones de componentes se nombran con <code>PascalCase</code>.</li>
- <li>Puedes leer las variables JSX poniéndolas entre llaves, <code>{así}</code>.</li>
- <li>Algunos atributos JSX son diferentes a los atributos HTML, para evitar conflictos con las palabras reservadas de JavaScript. Por ejemplo, el atributo <code>class</code> de HTML se convierte en <code>className</code> en JSX. Ten en cuenta que los atributos de varias palabras se nombran con <code>camelCase</code>.</li>
- <li>Los props se escriben como atributos dentro de las llamadas de componentes y se pasan a los componentes.</li>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Introducción a los frameworks del lado del cliente</a></li>
- <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">Características principales de los frameworks</a></li>
- <li>React
-  <ul>
-   <li><a href="/es/docs/Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started">Primeros pasos en React</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">Comenzando con nuestra lista de tareas de React</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">Basando nuestra aplicación React en componentes</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">Interactividad de React: eventos y estado</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">Interactividad de React: edición, filtrado, renderizado condicional</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">Accesibilidad en React</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">Recursos sobre React</a></li>
-  </ul>
- </li>
- <li>Ember
-  <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">Primeros pasos en Ember</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Estructura de una aplicación Ember y cómo se basa en componentes</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">Interactividad de Ember: eventos, clases, y estado</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">Interactividad de Ember: funcionalidad del footer, renderizado condicional</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">Enrutamiento en Ember</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">Recursos sobre y solución de problemas</a></li>
-  </ul>
- </li>
- <li>Vue
-  <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">Primeros pasos en Vue</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">Creando nuestro primer componente de Vue</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">Renderizando una lista de componentes de Vue</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">Agregar una nueva forma de tareas pendientes: eventos, métodos y modelos de Vue</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">Agregando estilos a los componentes de Vue con CSS</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">Usando propiedades calculadas de Vue</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">Renderización condicional en Vue: editando tareas existentes</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">Gestión de enfoque con Vue refs</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">Recursos sobre Vue</a></li>
-  </ul>
- </li>
- <li>Svelte
-  <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started">Primeros pasos en Svelte</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_Todo_list_beginning">Comenzando con nuestra aplicación Svelte de lista de tareas</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_variables_props">Comportamiento dinámico en Svelte: trabajando con variables y props</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">Basando nuestra aplicación Svelte en componentes</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_reactivity_lifecycle_accessibility">Svelte avanzado: reactividad, ciclo de vida, accesibilidad</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores">Trabajando con Svelte stores</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript">Compatibilidad con TypeScript en Svelte</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_deployment_next">Implementación y próximos pasos</a></li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/vue_primeros_pasos/index.html b/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/vue_primeros_pasos/index.html
deleted file mode 100644
index ea24ac2a81..0000000000
--- a/files/es/learn/herramientas_y_pruebas/lado-del-cliente_javascript_frameworks/vue_primeros_pasos/index.html
+++ /dev/null
@@ -1,294 +0,0 @@
----
-title: Primeros pasos con Vue
-slug: >-
-  Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/Vue_primeros_pasos
-translation_of: Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</div>
-
-<p class="summary">Ahora vamos a introducir Vue, el tercero de nuestros frameworks. En este articulo vamos a ver un poco del background de Vue, aprenderemos cómo instalarlo y a crear un nuevo proyecto, estudiar la estructura de alto nivel de todo el proyecto y un componente individual, sabremos como correr el proyecto localmente, y tenerlo preparado para empezar a construir nuestro ejemplo.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Pre-requisitos:</th>
-   <td>
-    <p>Familiaridad con los motores de los lenguajes  <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, y  <a href="/en-US/docs/Learn/JavaScript">JavaScript</a> languages, conocimiento del <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">terminal/command line</a>.</p>
-
-    <p>Los componentes Vue son escritos como una combinacion de objectos Javascript que administran los datos de la app y una sintaxis de plantilla basada en HTML que se enlaza con la estructura DOM subyacente. Para la instalación, y para usar algunas de las caracteristicas mas avanzadas de Vue (como Componentes de archivos simples o renderizado de funciones), vas a necesitar un terminar con node + npm instalados.</p>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Configurar un entorno de desarrollo local de Vue, crear una app de inicio y entender los principios de su funcionamiento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Un_Vue_más_claro">Un Vue más claro</h2>
-
-<p>Vue es un framework moderno de Javascript que proveé facilidades muy utiles para el mejoramiento progresivo- al contrario de otros frameworks, puedes usar Vue para mejorar un HTML exstente. Esto permite usar Vue como un remplazo agregado para una libreria como <a href="https://wiki.developer.mozilla.org/en-US/docs/Glossary/jQuery">JQuery</a>.</p>
-
-<p>Habiendo dicho esto, tambien puedes usar Vue para escribir completamente una aplicación de una sola página(SPAs).This allows you to create markup managed entirely by Vue, which can improve developer experience and performance when dealing with complex applications. It also allows you to take advantage of libraries for client-side routing and state management when you need to. Additionally, Vue takes a "middle ground" approach to tooling like client-side routing and state management. While the Vue core team maintains suggested libraries for these functions, they are not directly bundled into Vue. This allows you to select a different routing/state management library if they better fit your application.</p>
-
-<p>In addition to allowing you to progressively integrate Vue into your applications, Vue also provides a progressive approach to writing markup. Like most frameworks, Vue lets you create reusable blocks of markup via components. Most of the time, Vue components are written using a special HTML template syntax. When you need more control than the HTML syntax allows, you can write JSX or plain JavaScript functions to define your  components.</p>
-
-<p>As you work through this tutorial, you might want to keep the <a href="https://vuejs.org/v2/guide/">Vue guide</a> and <a href="https://vuejs.org/v2/api/">API documentation</a> open in other tabs, so you can refer to them if you want more information on any sub topic.<br>
- For a good (but potentially biased) comparison between Vue and many of the other frameworks, see <a href="https://vuejs.org/v2/guide/comparison.html">Vue Docs: Comparison with Other Frameworks</a>.</p>
-
-<h2 id="Installation">Installation</h2>
-
-<p>To use Vue in an existing site, you can drop one of the following <code><a href="/en-US/docs/Web/HTML/Element/script">&lt;script&gt;</a></code> elements onto a page. This allows you to start using Vue on existing sites, which is why Vue prides itself on being a progressive framework. This is a great option when migrating an existing project using a library like JQuery to Vue. With this method, you can use a lot of the core features of Vue, such as the attributes, custom components, and data-management.</p>
-
-<ul>
- <li>
-  <p>Development Script (Unoptimized, but includes console warnings. Great for development</p>
-
-  <pre class="brush: html notranslate">&lt;script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"&gt;&lt;/script&gt;</pre>
- </li>
- <li>
-  <p>Production Script (Optimized version, minimal console warnings. It is recommended that you specify a version number when including Vue on your site so that any framework updates do not break your live site without you knowing.)</p>
-
-  <pre class="brush: html notranslate">&lt;script src="https://cdn.jsdelivr.net/npm/vue@2"&gt;&lt;/script&gt;</pre>
- </li>
-</ul>
-
-<p>However, this approach has some limitations. To build more complex apps, you’ll want to use the <a href="https://www.npmjs.com/package/vue">Vue NPM package</a>. This will let you use advanced features of Vue and take advantage of bundlers like WebPack. To make building apps with Vue easier, there is a CLI to streamline the development process. To use the npm package &amp; the CLI you will need:</p>
-
-<ol>
- <li>Node.js 8.11+ installed.</li>
- <li>npm or yarn.</li>
-</ol>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: If you don't have the above installed, find out <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line#Adding_powerups">more about installing npm and Node.js</a> here.</p>
-</div>
-
-<p>To install the CLI, run the following command in your terminal:</p>
-
-<pre class="brush: bash notranslate">npm install --global @vue/cli</pre>
-
-<p>Or if you'd prefer to use yarn:</p>
-
-<pre class="brush: bash notranslate">yarn global add @vue/cli</pre>
-
-<p>Once installed, to initialize a new project you can then open a terminal in the directory you want to create the project in, and run <code>vue create &lt;project-name&gt;</code>. The CLI will then give you a list of project configurations you can use. There are a few preset ones, and you can make your own. These options let you configure things like TypeScript, linting, vue-router, testing, and more.</p>
-
-<p>We’ll look at using this below.</p>
-
-<h2 id="Initializing_a_new_project">Initializing a new project</h2>
-
-<p>To explore various features of Vue, we will be building up a sample todo list app. We'll begin by using the Vue CLI to create a new app framework to build our app into. Follow the steps below:</p>
-
-<ol>
- <li>In terminal, <code>cd</code> to where you'd like to create your sample app, then run <code>vue create moz-todo-vue</code>.</li>
- <li>Use the arrow keys and <kbd>Enter</kbd> to select the "Manually select features" option.</li>
- <li>The first menu you’ll be presented with allows you to choose which features you want to include in your project. Make sure that "Babel" and "Linter / Formatter" are selected. If they are not, use the arrow keys and the space bar to toggle them on. Once they are selected, press <kbd>Enter</kbd> to proceed.</li>
- <li>Next you’ll select a config for the linter / formatter. Navigate to "Eslint with error prevention only" and hit <kbd>Enter</kbd> again. This will help us catch common errors, but not be overly opinionated.</li>
- <li>Next you are asked to configure what kind of automated linting we want. Select "Lint on save". This will check for errors when we save a file inside the project. Hit <kbd>Enter</kbd> to continue.</li>
- <li>Now, you will select how we want your config files to be managed. "In dedicated config files" will put your config settings for things like ESLint into their own, dedicated files. The other option, "In package.json", will put all of your config settings into the app's <code>package.json</code> file. Select "In dedicated config files" and push <kbd>Enter</kbd>.</li>
- <li>Finally, you are asked if you want to save this as a preset for future options. This is entirely up to you. If you like these settings over the existing presets and want to use them again, type <kbd>y</kbd> , otherwise type <kbd>n</kbd>.</li>
-</ol>
-
-<p>The CLI will now begin scaffolding out your project, and installing all of your dependencies.</p>
-
-<p>If you've never run the Vue CLI before, you'll get one more question — you'll be asked to choose a package manager. You can use the arrow keys to select which one you prefer. The Vue CLI will default to this package manager from now on. If you need to use a different package manager after this, you can pass in a flag <code>--packageManager=&lt;package-manager&gt;</code>, when you run <code>vue create</code>.  So if you wanted to create the <code>moz-todo-vue</code> project with npm and you'd previously chosen yarn, you’d run <code>vue create moz-todo-vue --packageManager=npm</code>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: We've not gone over all of the options here, but you can <a href="https://cli.vuejs.org">find more information on the CLI</a> in the Vue docs.</p>
-</div>
-
-<h2 id="Project_structure">Project structure</h2>
-
-<p>If everything went successfully, the CLI should have created a series of files and directories for your project. The most significant ones are as follows:</p>
-
-<ul>
- <li><code>.eslintrc.js</code>: This is a config file for <a href="https://eslint.org/">eslint</a>. You can use this to manage your linting rules.</li>
- <li><code>babel.config.js</code>: This is the config file for <a href="https://babeljs.io/">Babel</a>, which transforms modern JavaScript features being used in development code into older syntax that is more cross-browser compatible in production code. You can register additional babel plugins in this file.</li>
- <li><code>.browserslistrc</code>: This is a config for <a href="https://github.com/browserslist/browserslist">Browserslist</a>. You can use this to control which browsers your tooling optimizes for.</li>
- <li><code>public</code>: This directory contains static assets that are published, but not processed by <a href="https://webpack.js.org/">Webpack</a> during build (with one exception; <code>index.html</code> gets some processing).
-  <ul>
-   <li><code>favicon.ico</code>: This is the favicon for your app. Currently, it's the Vue logo.</li>
-   <li><code>index.html</code>: This is the template for your app. Your Vue app is run from this HTML page, and you can use lodash template syntax to interpolate values into it.
-    <div class="note"><strong>Note</strong>: this is not the template for managing the layout of your application — this template is for managing static HTML that sits outside of your Vue app. Editing this file typically only occurs in advanced use cases.</div>
-   </li>
-  </ul>
- </li>
- <li><code>src</code>: This directory contains the core of your Vue app.
-  <ul>
-   <li><code>main.js</code>: this is the entry point to your application. Currently, this file initializes your Vue application and signifies which HTML element in the <code>index.html</code> file your app should be attached to. This file is often where you register global components or additional Vue libraries.</li>
-   <li><code>App.vue</code>: this is the top-level component in your Vue app. See below for more explanation of Vue components.</li>
-   <li><code>components</code>: this directory is where you keep your components. Currently it just has one example component.</li>
-   <li><code>assets</code>: This directory is for storing static assets like CSS and images. Because these files are in the source directory, they can be processed by Webpack. This means you can use pre-processors like <a href="https://sass-lang.com/">Sass/SCSS</a> or <a href="https://stylus-lang.com/">Stylus</a>.</li>
-  </ul>
- </li>
-</ul>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: Depending on the options you select when creating a new project, there might be other directories present (for example, if you choose a router, you will also have a <code>views</code> directory).</p>
-</div>
-
-<h2 id=".vue_files_single_file_components">.vue files (single file components)</h2>
-
-<p>Like in many front-end frameworks, components are a central part of building apps in Vue. These components let you break a large application into discrete building blocks that can be created and managed separately, and transfer data between each other as required. These small blocks can help you reason about and test your code.</p>
-
-<p>While some frameworks encourage you to separate your template, logic, and styling code into separate files, Vue takes the opposite approach. Using <a href="https://vuejs.org/v2/guide/single-file-components.html">Single File Components</a>, Vue lets you group your templates, corresponding script, and CSS all together in a single file ending in <code>.vue</code>. These files are processed by a JS build tool (such as Webpack), which means you can take advantage of build-time tooling in your project. This allows you to use tools like Babel, TypeScript, SCSS and more to create more sophisticated components.</p>
-
-<p>As a bonus, projects created with the Vue CLI are configured to use <code>.vue</code> files with Webpack out of the box. In fact, if you look inside the <code>src</code> folder in the project we created with the CLI, you'll see your first <code>.vue</code> file: <code>App.vue</code>.</p>
-
-<p>Let's explore this now.</p>
-
-<h3 id="App.vue">App.vue</h3>
-
-<p>Open your <code>App.vue</code> file — you’ll see that it has three parts: <code>&lt;template&gt;</code>, <code>&lt;script&gt;</code>, and <code>&lt;style&gt;</code>, which contain the component’s template, scripting, and styling information. All Single File Components share this same basic structure.</p>
-
-<p><code>&lt;template&gt;</code> contains all the markup structure and display logic of your component. Your template can contain any valid HTML, as well as some Vue-specific syntax that we'll cover later.</p>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: By setting the <code>lang</code> attribute on the <code>&lt;template&gt;</code> tag, you can use Pug template syntax instead of standard HTML — <code>&lt;template lang="pug"&gt;</code>. We'll stick to standard HTML through this tutorial, but it is worth knowing that this is possible.</p>
-</div>
-
-<p><code>&lt;script&gt;</code> contains all of the non-display logic of your component. Most importantly, your <code>&lt;script&gt;</code> tag needs to have a default exported JS object. This object is where you locally register components, define component inputs (props), handle local state, define methods, and more. Your build step will process this object and transform it (with your template) into a Vue component with a <code>render()</code> function.</p>
-
-<p>In the case of <code>App.vue</code>, our default export sets the name of the component to <code>app</code> and registers the <code>HelloWorld</code> component by adding it into the <code>components</code> property. When you register a component in this way, you're registering it locally. Locally registered components can only be used inside the components that register them, so you need to import and register them in every component file that uses them. This can be useful for bundle splitting/tree shaking since not every page in your app necessarily needs every component.</p>
-
-<pre class="brush: js notranslate">import HelloWorld from './components/HelloWorld.vue';
-
-export default {
-  name: 'app',
-  components: {
-    //You can register components locally here.
-    HelloWorld
-  }
-};</pre>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: If you want to use <a href="https://www.typescriptlang.org/">TypeScript</a> syntax, you need to set the <code>lang</code> attribute on the <code>&lt;script&gt;</code> tag to signify to the compiler that you're using TypeScript — <code>&lt;script lang="ts"&gt;</code>.</p>
-</div>
-
-<p><code>&lt;style&gt;</code> is where you write your CSS for the component. If you add a <code>scoped</code> attribute — <code>&lt;style scoped&gt;</code> — Vue will scope the styles to the contents of your SFC. This works similar to CSS-in-JS solutions, but allows you to just write plain CSS.</p>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: If you select a CSS pre-processor when creating the project via the CLI, you can add a <code>lang</code> attribute to the <code>&lt;style&gt;</code> tag so that the contents can be processed by Webpack at build time. For example, <code>&lt;style lang="scss"&gt;</code> will allow you to use SCSS syntax in your styling information.</p>
-</div>
-
-<h2 id="Running_the_app_locally">Running the app locally</h2>
-
-<p>The Vue CLI comes with a built-in development server. This allows you to run your app locally so you can test it easily without needing to configure a server yourself. The CLI adds a <code>serve</code> command to the project’s <code>package.json</code> file as an npm script, so you can easily run it.</p>
-
-<p>In your terminal, try running <code>npm run serve</code> (or <code>yarn serve</code> if you prefer yarn). Your terminal should output something like the following:</p>
-
-<pre class="notranslate">INFO  Starting development server...
-98% after emitting CopyPlugin
-
- DONE  Compiled successfully in 18121ms
-
-  App running at:
-  - Local:   &lt;http://localhost:8080/&gt;
-  - Network: &lt;http://192.168.1.9:8080/&gt;
-
-  Note that the development build is not optimized.
-  To create a production build, run npm run build.</pre>
-
-<p>If you navigate to the “local” address in a new browser tab (this should be something like <code>http://localhost:8080</code> as stated above, but may vary based on your setup), you should see your app. Right now, it should contain a welcome message, a link to the Vue documentation, links to the plugins you added when you initialized the app with your CLI, and some other useful links to the Vue community and ecosystem.</p>
-
-<p><img alt="default vue app render, with vue logo, welcome message, and some documentation links" src="https://mdn.mozillademos.org/files/17240/vue-default-app.png" style="border-style: solid; border-width: 1px; height: 779px; width: 1600px;"></p>
-
-<h2 id="Making_a_couple_of_changes">Making a couple of changes</h2>
-
-<p>Let's make our first change to the app — we’ll delete the Vue logo. Open the <code>App.vue</code> file, and delete the <code><a href="/en-US/docs/Web/HTML/Element/img">&lt;img&gt;</a></code> element from the template section:</p>
-
-<pre class="brush: html notranslate"><span class="author-d-iz88z86z86za0dz67zz78zz78zz74zz68zjz80zz71z9iz90z8h7gz67ziz76zcz77zz80zz71zncfz69zz69ziaz82zz71zz72zhz77zz122zz90z14mcyd">&lt;img alt="Vue logo" src="./assets/logo.png"&gt;</span></pre>
-
-<p>If your server is still running, you should see the logo removed from the rendered site almost instantly. Let’s also remove the <code>HelloWorld</code> component from our template.</p>
-
-<p>First of all delete this line:</p>
-
-<pre class="brush: html notranslate">&lt;HelloWorld msg="Welcome to Your Vue.js App"/&gt;</pre>
-
-<p>If you save your <code>App.vue</code> file now, the rendered app will throw an error because we’ve registered the component but are not using it. We also need to remove the lines from inside the <code>&lt;script&gt;</code> element that import and register the component:</p>
-
-<p>Delete these lines now:</p>
-
-<pre class="brush: js notranslate">import HelloWorld from './components/HelloWorld.vue'</pre>
-
-<pre class="brush: js notranslate">components: {
-  HelloWorld
-}</pre>
-
-<p>Your rendered app should no longer show an error, just a blank page, as we currently have no visible content inside <code>&lt;template&gt;</code>.</p>
-
-<p>Let’s add a new <code>&lt;h1&gt;</code> inside <code>&lt;div id="app"&gt;</code>. Since we’re going to be creating a todo list app below, let's set our header text to "To-Do List". Add it like so:</p>
-
-<pre class="brush: html notranslate">&lt;template&gt;
-  &lt;div id="app"&gt;
-    &lt;h1&gt;To-Do List&lt;/h1&gt;
-  &lt;/div&gt;
-&lt;/template&gt;</pre>
-
-<p><code>App.vue</code> will now show our heading, as you'd expect.</p>
-
-<h2 id="Summary">Summary</h2>
-
-<p>Let's leave this here for now. We've learnt about some of the ideas behind Vue, created some scaffolding for our example app to live inside, inspected it, and made a few preliminary changes.</p>
-
-<p>With a basic introduction out of the way, we'll now go further and build up our sample app, a basic Todo list application that allows us to store a list of items, check them off when done, and filter the list by all, complete, and incomplete todos.</p>
-
-<p>In the next article we'll build our first custom component, and look at some important concepts such as passing props into it and saving its data state.</p>
-
-<p>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</p>
-
-<h2 id="In_this_module">In this module</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Introduction to client-side frameworks</a></li>
- <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">Framework main features</a></li>
- <li>React
-  <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started">Getting started with React</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">Beginning our React todo list</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">Componentizing our React app</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">React interactivity: Events and state</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">React interactivity: Editing, filtering, conditional rendering</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">Accessibility in React</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">React resources</a></li>
-  </ul>
- </li>
- <li>Ember
-  <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">Getting started with Ember</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Ember app structure and componentization</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">Ember interactivity: Events, classes and state</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">Ember Interactivity: Footer functionality, conditional rendering</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">Routing in Ember</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">Ember resources and troubleshooting</a></li>
-  </ul>
- </li>
- <li>Vue
-  <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">Getting started with Vue</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">Creating our first Vue component</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">Rendering a list of Vue components</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">Adding a new todo form: Vue events, methods, and models</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">Styling Vue components with CSS</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">Using Vue computed properties</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">Vue conditional rendering: editing existing todos</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">Focus management with Vue refs</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">Vue resources</a></li>
-  </ul>
- </li>
- <li>Svelte
-  <ul>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started">Getting started with Svelte</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_Todo_list_beginning">Starting our Svelte Todo list app</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_variables_props">Dynamic behavior in Svelte: working with variables and props</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">Componentizing our Svelte app</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_reactivity_lifecycle_accessibility">Advanced Svelte: Reactivity, lifecycle, accessibility</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores">Working with Svelte stores</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript">TypeScript support in Svelte</a></li>
-   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_deployment_next">Deployment and next steps</a></li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/learn/herramientas_y_pruebas/understanding_client-side_tools/index.html b/files/es/learn/herramientas_y_pruebas/understanding_client-side_tools/index.html
deleted file mode 100644
index 6221b0382f..0000000000
--- a/files/es/learn/herramientas_y_pruebas/understanding_client-side_tools/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Understanding client-side web development tools
-slug: Learn/Herramientas_y_pruebas/Understanding_client-side_tools
-tags:
-  - Aprender
-  - CSS
-  - Despliegue
-  - HTML
-  - Herramientas
-  - JavaScript
-  - Novatos
-  - Transformación
-  - client-side
-  - lado del cliente
-translation_of: Learn/Tools_and_testing/Understanding_client-side_tools
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">Las herramientas del lado del cliente (<em>client-side</em> en inglés) pueden ser intimidantes, pero esta serie de artículos tiene como propósito ilustrar el propósito de algunos de los tipos de herramientas <em>client-side</em>, explicar las herramientas que puedes integrar, cómo instalarlas usando administradores de paquetes y cómo controlarlas usando la línea de comandos. Terminanos esta sección dando un ejemplo de cadena de herramientas para mostrarte cómo puedes ser más productivo</p>
-
-<p class="summary"><strong><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Overview">Inicia ahora con nuestra "Introducción a las herraminetas <em>client-side</em>"</a></strong></p>
-
-<h2 id="Requisitos_previos">Requisitos previos</h2>
-
-<p>Debes aprender el núcleo básico de los lenguajes <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a> y <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>, antes de intentar usar las herramientas aquí descritas.</p>
-
-<div class="in-page-callout webdev">
-<h3 id="¿Quieres_convertirte_en_un_desarrollador_front-end">¿Quieres convertirte en un desarrollador <em>front-end</em>?</h3>
-
-<p>Tenemos un curso que incluye toda la información esencial que necesitas para lograr tu objetivo.</p>
-<a class="cta primary" href="/docs/Learn/Front-end_web_developer">Inicia ahora</a></div>
-
-<h2 id="Guías">Guías</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Overview">1. Introducción a las herramientas <em>client-side</em></a></dt>
- <dd>En este artículo damos una introducción a las herramientas modernas de la web, los tipos de herramientas disponibles, donde te las puedes encontrar en el cliclo de desarrollo de aplicaciones web y como buscar ayuda con las herramientas individuales.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">2. Introducción a la linea de comandos</a></dt>
- <dd>En tu proceso de desarrollo seguramente vas a requeria correr algunos comandos en la terminal (o "línea de comandos"). Este artículo da una introducción a la terminal, los comandos básicos que vas a necesitar para utilizarla, cómo integrar diferentes comandos y cómo agregar tu propia interfaz de línea de comandos (<em>command line interface</em> - CLI en inglés).</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management">3. Introducción al manejo de paquetes</a></dt>
- <dd>En este artículo exploramos los sistemas de administración de paquetes en detalle para entender cómo los podemos usar en nuestros proyectos, ya sea para instalar dependencias a nuestro proyecto, descargar actualizaciones y mucho más.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Introducing_complete_toolchain">4. Introduciendo una cadena de herramientas completa</a></dt>
- <dd>En los últimos dos artículos en esta serie vamos a solidificar tu conocimiento de las herramientas para el desarrollo web construyendo una cadena de herramients. Iniciaremos configurando un ambiente de desarrollo y colocando herramentas de transformación para desplegar nuestra aplicación en Netlify. En este artículo introducimos un estudio de caso, configuramos nuestro ambiente de desarrollo y configuramos herramientas de transformación de código.</dd>
- <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Deployment">5. Desplegando nuestra aplicación</a></dt>
- <dd>En el artículo final de esta serie, utilizamos nuestra cadena de herramientas que construimos en el artículo previo y la extendemos para desplegar nuestra aplicación muestra. Subimos nuestro código a GitHub, desplegamos usando Netlify e incluso te enseñamos a realizar una prueba en el proceso.</dd>
-</dl>
diff --git a/files/es/learn/html/como/index.html b/files/es/learn/html/como/index.html
deleted file mode 100644
index 095e5bc54e..0000000000
--- a/files/es/learn/html/como/index.html
+++ /dev/null
@@ -1,141 +0,0 @@
----
-title: Solución de problemas comunes de HTML
-slug: Learn/HTML/como
-tags:
-  - CodificacióndeSecuenciadeComandos
-  - HTML
-translation_of: Learn/HTML/Howto
----
-<p>{{LearnSidebar}}</p>
-
-<p class="summary">Los siguientes enlaces brindan soluciones puntuales a los problemas más comunes a los que te enfrentarás a diario en HTML.</p>
-
-<div class="column-container">
-<div class="column-half">
-<h3 id="Estructura_básica">Estructura básica</h3>
-
-<p>La principal aplicación de HTML es la estructuración del documento. Si eres nuevo en HTML debes empezar aquí.</p>
-
-<ul>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Getting_started#Anatomy_of_an_HTML_document">Cómo crear un documento HTML básico</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Divide_a_webpage_into_logical_sections">Cómo dividir una página web en secciones lógicas</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#The_basics_headings_and_paragraphs">Cómo establecer una estructura adecuada de encabezados y párrafos</a></li>
-</ul>
-
-<h3 id="Semántica_básica_textos">Semántica básica textos</h3>
-
-<p>HTML se especializa en suministrar información semántica del documento, así que HTML soluciona muchas dudas que puede tener sobre como transmitir su mensaje a través de un documento.</p>
-
-<ul>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Lists">Cómo crear una lista de elementos con HTML</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Cómo enfatizar o acentuar contenido</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Cómo indicar qué texto es importante</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Representing_computer_code">Cómo muestra el ordenador el codigo HTML</a></li>
- <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#Annotating_images_with_figures_and_figure_captions">Cómo comentar imagenes y gráficas</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations">Cómo marcar abreviaturas y hacerlas entendibles</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Quotations">Cómo añadir citas y referencias a sitios web</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Define_terms_with_HTML">Cómo definir términos con HTML</a></li>
-</ul>
-</div>
-
-<div class="column-half">
-<h3 id="Hipervínculos">Hipervínculos</h3>
-
-<p>Uno de las principales razones por las que HTML hace más fácil la navegación son los {{Glossary("hyperlink", "hipervínculos")}}, que pueden ser usados de diferentes formas:</p>
-
-<ul>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo crear un hipervínculo</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo crear una tabla de contenidos con HTML</a></li>
-</ul>
-
-<h3 id="Imágenes_y_multimedia">Imágenes y multimedia</h3>
-
-<ul>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo</a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#How_do_we_put_an_image_on_a_webpage"> añadir imagenes al sitio web</a></li>
- <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo</a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content"> añadir contenidos de video al sitio web</a></li>
-</ul>
-
-<h3 id="Scripts_y_estilización">Scripts y estilización</h3>
-
-<p>HTML únicamente define la estructura del documento. Para solucionar los problemas de presentación usamos {{glossary("CSS")}}, o usamos scripts para hacer la página interactiva.</p>
-
-<ul>
- <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_to_apply_your_CSS_to_your_HTML">Cómo usar CSS dentro de un sitio web</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Use_JavaScript_within_a_webpage">Cómo usar JavaScript dentro de un sitio web</a></li>
-</ul>
-
-<h3 id="Contenido_integrado">Contenido integrado</h3>
-
-<ul>
- <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies">Cómo integrar una página web dentro de otra</a></li>
- <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements">Cómo integrar contenido Flash </a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies">dentro de </a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements">una página web</a></li>
-</ul>
-</div>
-</div>
-
-<h2 id="Problemas_avanzados_o_raros">Problemas avanzados o raros</h2>
-
-<p>Más allá de lo basico, HTML es muy rico y ofrece características avanzadas para solucionar problemas complejos. Estos artículos te ayudarán a abordar estos casos menos comunes:</p>
-
-<div class="column-container">
-<div class="column-half">
-<h3 id="Formularios">Formularios</h3>
-
-<p>Los formularios son una estructura compleja en HTML para enviar datos desde una pagina web al servidor. Te animamos a que revises la <a href="/en-US/docs/Web/Guide/HTML/Forms">guia completa</a>. Aquí es por donde deberías empezar:</p>
-
-<ul>
- <li><a href="/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form">Cómo crear un formulario Web simple</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario Web</a></li>
-</ul>
-
-<h3 id="Información_tabular">Información tabular</h3>
-
-<p>Alguna información, llamada datos tabulares, necesita ser organizada en tablas mediante filas y columnas. Siendo ésta una de las estructuras más complejas de HTML, no es fácil dominarla:</p>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Create_a_data_spreadsheet">Cómo crear una tabla de datos</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Make_HTML_tables_accessible">Cómo hacer tablas HTML accesibles</a></li>
-</ul>
-
-<h3 id="Representación_de_datos">Representación de datos</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTMLHowto/Represent_numeric_values_with_HTML">Cómo representar valores numericos y de código con HTML -</a> <span class="tlid-translation translation" lang="es"><span title="">ver </span></span> <span class="tlid-translation translation" lang="es"><span title="">Superíndice y Subíndice, y Representación del código de la computadora.</span></span></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Associate_human_readable_content_with_arbitrary_computer_data_structures">Cómo usar atributos de datos</a></li>
-</ul>
-
-<h3 id="Rendimiento">Rendimiento</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Create_collapsible_content_with_HTML">Cómo crear páginas HTML de carga rápida</a></li>
-</ul>
-</div>
-
-<div class="column-half">
-<h3 id="Semántica_avanzada_de_texto">Semántica avanzada de texto</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Take_control_of_HTML_line_breaking">Cómo controlar el salto de línea en HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Mark_text_insertion_and_deletion">Cómo marcar cambios (agregar y remover textos)</a> -ver los elementos {{htmlelement("ins")}} y {{htmlelement("del")}}</li>
-</ul>
-
-<h3 id="Imágenes_y_multimedia_avanzada">Imágenes y multimedia avanzada</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">Cómo agregar una imagen receptiva a una página web</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web">Cómo agregar una imagen vectorial a una página web</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image">Cómo agregar un mapa de visitas sobre una imagen</a></li>
-</ul>
-
-<h3 id="Internacionalización">Internacionalización</h3>
-
-<p>HTML no es monolingüe. Éste <span class="tlid-translation translation" lang="es"><span title="">proporciona herramientas para manejar problemas comunes de internacionalización.</span></span></p>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Add_multiple_languages_into_a_single_webpage">Cómo agregar multiples lenguajes en una misma página web</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Display_time_and_date_with_HTML">Cómo mostrar hora y fecha con HTML </a></li>
-</ul>
-</div>
-</div>
-
-<p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> </p>
diff --git a/files/es/learn/html/como/usando_atributos_de_datos/index.html b/files/es/learn/html/como/usando_atributos_de_datos/index.html
deleted file mode 100644
index 7629974833..0000000000
--- a/files/es/learn/html/como/usando_atributos_de_datos/index.html
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: Uso de atributos de datos
-slug: Learn/HTML/como/Usando_atributos_de_datos
-translation_of: Learn/HTML/Howto/Use_data_attributes
----
-<div>{{LearnSidebar}}</div>
-
-<p><a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> está diseñado de forma tal que sea fácil extender los datos asociados a un elemento en particular sin necesidad de que tengan un significado definido. Los atributos <a href="/en-US/docs/Web/HTML/Global_attributes#attr-dataset"><code>data-* </code></a> permiten almacenar información adicional sobre un elemento HTML cualquiera sin tener que recurrir a artilugios tales como la utilización de atributos no estándar, propiedades adicionales en el DOM o {{domxref("Node.setUserData()")}}.</p>
-
-<h2 id="Sintaxis_HTML">Sintaxis HTML</h2>
-
-<p>La sintáxis es simple. Un atributo cualquiera cuyo nombre comience con <code>data-</code>es un atributo de datos. Supongamos que tenemos un artículo y deseamos almacenar información adicional que no tiene ninguna representación visual. En ese caso, alcanza con que hagamos uso de los atributos <code>data</code>:</p>
-
-<pre class="brush: html notranslate">&lt;article
-  id="electriccars"
-  data-columns="3"
-  data-index-number="12314"
-  data-parent="cars"&gt;
-...
-&lt;/article&gt;</pre>
-
-<h2 id="Acceso_a_través_de_JavaScript">Acceso a través de JavaScript</h2>
-
-<p>Leer los valores de estos atributos en <a href="/en-US/docs/Web/JavaScript">JavaScript</a> también es muy sencillo. Puede usar {{domxref("Element.getAttribute", "getAttribute()")}} con su nombre HTML completo para leerlos, pero el estándar define una forma más simple: un {{domxref("DOMStringMap")}} puede leer a través de una propiedad {{domxref("HTMLElement.dataset", "dataset")}}.</p>
-
-<p>Para obtener un atributo <code>data</code> a través del <code>dataset</code> del objeto, obtenga la propiedad por la parte del nombre del atributo despues de <code>data-</code> (tenga en cuenta que los guiones son convertidos en camelCase).</p>
-
-<pre class="brush: js notranslate">var article = document.getElementById('electriccars');
-
-article.dataset.columns // "3"
-article.dataset.indexNumber // "12314"
-article.dataset.parent // "cars"</pre>
-
-<p>Cada propiedad es una cadena y se puede leer y escribir. En el caso anterior, establecer <code>article.dataset.columns = 5</code> cambiaría ese atributo a <code>"5"</code>.</p>
-
-<h2 id="Acceso_a_través_de_CSS">Acceso a través de CSS</h2>
-
-<p>Tenga en cuenta que, debido a que los atributos de datos son atributos simples de HTML, incluso puede acceder a ellos desde <a href="/en-US/docs/Web/CSS">CSS</a>. Por ejemplo, para mostrar los <code>data-parent</code> en el artículo, puede usar el <a href="/en-US/docs/Web/CSS/content">contenido generado</a> en CSS con la función {{cssxref("attr")}}:</p>
-
-<pre class="brush: css notranslate">article::before {
-  content: attr(data-parent);
-}</pre>
-
-<p>También puede usar los <a href="/en-US/docs/Web/CSS/Attribute_selectors">selectores de atributos</a> en CSS para cambiar los estilos de acuerdo a las priopiedades de datos:</p>
-
-<pre class="brush: css notranslate">article[data-columns='3'] {
-  width: 400px;
-}
-article[data-columns='4'] {
-  width: 600px;
-}</pre>
-
-<p>Puede ver todo esto trabajando junto <a href="http://jsbin.com/ujiday/2/edit">en este ejemplo de JSBin</a>.</p>
-
-<p>Los atributos de datos también se pueden almacenar para que contengan información que cambia constantemente, como los puntajes en un juego. Usando los selectores de CSS y el acceso a JavaScript aquí, esto le permite crear algunos efectos ingeniosos sin tener que escribir sus propias rutinas de visualización. Consulte <a href="http://www.youtube.com/watch?v=On_WyUB1gOk">este screencast</a> para ver un ejemplo utilizando contenido generado y transacciones CSS (<a href="http://jsbin.com/atawaz/3/edit">Ejemplo JSBin</a>).</p>
-
-<p>Los valores de datos son cadenas de caracteres. Los valores numéricos deben ser citados en el selector para que el estilo surta efecto.</p>
-
-<h2 id="Problemas">Problemas</h2>
-
-<p>No almacene el contenido que debería ser visible y accesible en los atributos de datos, ya que las tecnologías de asistencia, no pueden acceder a ellos. Ademas, los rastreadores de búsqueda no pueden indexar los valores de los atributos de datos.</p>
-
-<p>Los principales problemas a considerar son el soporte y rendimiento en Internet Explorer. Internet Explorer 11 y superiores, proporcionan soporte para el estándar, pero todas las versiones anteriores <a href="http://caniuse.com/#feat=dataset">no son compatibles con <code>dataset</code></a>. Para admitir IE 10 e inferiores, debe acceder a los atributos de datos con {{domxref("Element.getAttribute", "getAttribute()")}} en su lugar. Ademas, el <a href="http://jsperf.com/data-dataset">rendimiento de lectura de los atributos de datos</a> en comparación con el almacenamiento de estos datos en un objeto JS normal es deficiente.</p>
-
-<p>Dicho esto, sin embargo, para metadatos asociados a elementos personalizados, son una gran solución.</p>
-
-<p>En Firefox 49.0.2 (y quizás versiones anteriores), los atributos de datos que exceden los 1022 caracteres no serán leídos por Javascript (EcmaScript 4).</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Este artículo es una adaptación de <a href="https://hacks.mozilla.org/2012/10/using-data-attributes-in-javascript-and-css/" title="https://hacks.mozilla.org/2012/10/using-data-attributes-in-javascript-and-css/">Usando atributos de datos en JavaScript y CSS en hacks.mozilla.org</a>.</li>
- <li>Los atributos personalizados también son compatibles en SVG 2; vea {{domxref("SVGElement.dataset")}} y {{SVGAttr("data-*")}} para más información.</li>
- <li><a href="http://www.sitepoint.com/use-html5-data-attributes/">Cómo utilizar atributos de datos HTML5</a></li>
-</ul>
diff --git a/files/es/learn/html/forms/como_crear_widgets_de_formularios_personalizados/index.html b/files/es/learn/html/forms/como_crear_widgets_de_formularios_personalizados/index.html
deleted file mode 100644
index 73ae6e6590..0000000000
--- a/files/es/learn/html/forms/como_crear_widgets_de_formularios_personalizados/index.html
+++ /dev/null
@@ -1,786 +0,0 @@
----
-title: Cómo crear widgets de formularios personalizados
-slug: Learn/HTML/Forms/como_crear_widgets_de_formularios_personalizados
-translation_of: Learn/Forms/How_to_build_custom_form_controls
----
-<div>{{LearnSidebar}}{{PreviousMenuNext("Learn/HTML/Forms/Form_validation", "Learn/HTML/Forms/Sending_forms_through_JavaScript", "Learn/HTML/Forms")}}</div>
-
-<p class="summary">Hay muchos casos donde los <a href="/en-US/docs/HTML/Forms/The_native_form_widgets" title="/en-US/docs/HTML/Forms/The_native_form_widgets">widgets de formularios HTML disponibles</a> simplemente no son suficientes. si desea <a href="/en-US/docs/Advanced_styling_for_HTML_forms" title="/en-US/docs/Advanced_styling_for_HTML_forms">establecer un estilo avanzado</a> en algunos widgets como el elemento {{HTMLElement("select")}} o si desea proporcionar comportamientos personalizados, no tiene más opción que crear sus propios widgets.</p>
-
-<p>En este aartículo, veremos cómo construir dicho widget. Para ello, trabajaremos con un ejemplo: Reconstruir el elemento {{HTMLElement("select")}}.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Nos enfocaremos en construir los widgets, no en cómo hacer que el código sea genérico y reutilizable; eso implicaría algún código JavaScript no trivial y manipulación del DOM en un contexto desconocido, y eso está fuera del alcance de este artículo.</p>
-</div>
-
-<h2 id="Diseño_estructura_y_semántica">Diseño, estructura, y semántica</h2>
-
-<p>Antes de crear un widget personalizado, debería iniciar por averiguar exactamente qué es lo que desea. Esto le ahorarrá tiempo considerable. En particular, es importante definir claramente todos los estados de su widget. Para hacer esto, es bueno comenzar con un widget existente, cuyos estados y comportamientos son bien conocidos, por lo que simplemente puede imitarlos tanto como sea posible.</p>
-
-<p>En nuestro ejemplo, reconstruiremos el elemento {{HTMLElement("select")}}. Este es el resultado que queremos lograr:</p>
-
-<p><img alt="The three states of a select box" src="/files/4481/custom-select.png" style="height: 135px; width: 366px;"></p>
-
-<p>Esta captura de pantall muestra los tres estados principales de nuestro widget: el estado normal (a la izquiera); el estado activo (en el centro) y el estado abierto (a la derecha).</p>
-
-<p>En términos de comportamiento, queremos que nuestro widget sea utilizable tanto con un ratón como con un teclado, al igual que cualquier widget nativo. Comencemos por definir cómo el widget llega a cada estado:</p>
-
-<dl>
- <dt>El widget está en su estado normal cuando:</dt>
- <dd>
- <ul>
-  <li>La página carga</li>
-  <li>El widget estaba activo y el usuario hace clic en cualquier lugar fuera del widget</li>
-  <li>El widget estaba activo y el usuario mueve el foco a otro widget usando el teclado</li>
- </ul>
-
- <div class="note">
- <p><strong>Nota:</strong> Mover el foco al rededor de la página generalmente se hace presionando la tecla de tabulación, pero este no es el estándar en todas partes. Por ejemplo, el ciclo a través de enlaces en una página se realiza en Safari de forma predeterminada usando la combinación <a href="http://www.456bereastreet.com/archive/200906/enabling_keyboard_navigation_in_mac_os_x_web_browsers/" title="http://www.456bereastreet.com/archive/200906/enabling_keyboard_navigation_in_mac_os_x_web_browsers/">combinación Opction+Tab</a>.</p>
- </div>
- </dd>
- <dt>El widget está en su estado activo cuando:</dt>
- <dd>
- <ul>
-  <li>El usuario hace clic en él</li>
-  <li>El usuario presiona la tecla tab y obtiene foco</li>
-  <li>El widget estaba en su estado abierto y el usuario hace clic en el widget.</li>
- </ul>
- </dd>
- <dt>El widget está en su estado abierto cuando:</dt>
- <dd>
- <ul>
-  <li>El widget está en cualquier otro estado diferente a abierto y el usuario hace clic en él.</li>
- </ul>
- </dd>
-</dl>
-
-<p>Una vez que sabemos cómo cambiar los estados, es importante definir cómo cambiar el valor del widget:</p>
-
-<dl>
- <dt>El valor cambia cuando:</dt>
- <dd>
- <ul>
-  <li>El usuario hace clic en una opción cuando el widget está en estado abierto</li>
-  <li>El usuario pulsa las teclas de flecha hacia arriba o hacia abajocuando el widget está en estado activo</li>
- </ul>
- </dd>
-</dl>
-
-<p>Finalmente, definamos cómo se comportarán las opciones del widget:</p>
-
-<ul>
- <li>Cuando se abre el widget, se resalta la opción seleccionada</li>
- <li>Cuando el ratón está sobre una opción, la opción se resalta y la opción resaltada anteriormente vuelve a su estado normal</li>
-</ul>
-
-<p>Para los fines de nuestro ejemplo, nos detendremos con eso; sin embargo, si eres un lector cuidadoso, notarás que faltan algunos comportamientos. Por ejemplo, ¿qué crees que sucederá si el usuario pulsa la tecla de tabulación mientras el widget está en estado abierto? La respuesta es ... nada. OK, el comportamiento correcto parece obvio, pero el hecho es que, como no está definido en nuestras especificaciones, es muy fácil pasar por alto este comportamiento. Esto es especialmente cierto en un entorno de equipo cuando las personas que diseñan el comportamiento del widget son diferentes de las que lo implementan.</p>
-
-<p>Otro ejemplo divertido: ¿qué pasará si el usuario pulsa las teclas de flecha hacia arriba o hacia abajo mientras el widget está en estado abierto? Este es un poco más complicado. Si considera que el estado activo y el estado abierto son completamente diferentes, la respuesta es nuevamente "no pasará nada" porque no definimos ninguna interacción de teclado para el estado abierto. Por otro lado, si considera que el estado activo y el estado abierto se superponen un poco, el valor puede cambiar pero la opción definitivamente no se resaltará en consecuencia, una vez más porque no definimos ninguna interacción del teclado sobre las opciones cuando el widget es en su estado abierto (solo hemos definido lo que debería suceder cuando se abre el widget, pero nada después de eso).</p>
-
-<p>En nuestro ejemplo, las especificaciones faltantes son obvias, así que las manejaremos, pero puede ser un problema real en widgets nuevos y exóticos, para los cuales nadie tiene la menor idea de cuál es el comportamiento correcto. Por lo tanto, siempre es bueno pasar tiempo en esta etapa de diseño, porque si defines un comportamiento deficiente u olvidas definir uno, será muy difícil redefinirlo una vez que los usuarios se hayan acostumbrado. Si tiene dudas, solicite las opiniones de los demás y, si tiene el presupuesto para ello, no dude en realizar las pruebas de usuario. Este proceso se llama Diseño UX. Si desea obtener más información sobre este tema, debe consultar los siguientes recursos útiles:</p>
-
-<ul>
- <li><a href="http://www.uxmatters.com/" rel="external" title="http://www.uxmatters.com/">UXMatters.com</a></li>
- <li><a href="http://uxdesign.com/" rel="external" title="http://uxdesign.com/">UXDesign.com</a></li>
- <li><a href="http://uxdesign.smashingmagazine.com/" rel="external" title="http://uxdesign.smashingmagazine.com/">The UX Design section of SmashingMagazine</a></li>
-</ul>
-
-<div class="note">
-<p><strong>Nota: </strong>Ademas, en la mayoría de los sistemas hay una forma de abrir el elemento {{HTMLElement("select")}} para ver todas las opciones disponibles (esto es lo mismo que hacer clic en el elemento {{HTMLElement("select")}} con un ratón). Esto se logra con Alt+Flecha abajo en Windows y no fué implementado en nuestro ejemplo —pero sería facil hacerlo, ya que el mecanismo ya se implementó para el evento <code>clic</code>.</p>
-</div>
-
-<h3 id="Definiendo_la_estructura_y_semántica_HTML">Definiendo la estructura y semántica HTML</h3>
-
-<p>Ahora que se ha decidido la funcionalidad básica del widget, es hora de comenzar a construir nuestro widget. El primer paso es definir su estructura HTML y darle una semántica básica. Esto es lo que necesitamos para reconstruir un elemento {{HTMLElement("select")}}:</p>
-
-<pre class="brush: html">&lt;!-- Este es nuestro contenedor principal para nuestro widget.
-     El atributo tabindex es lo que permite al usuario enforcar el widget.
-     Veremos más adelante que es mejor configurarlo a través de JavaScript. --&gt;
-&lt;div class="select" tabindex="0"&gt;
-
-  &lt;!-- Este contenedor será usado para mostrar el valor actual del widget --&gt;
-  &lt;span class="value"&gt;Cherry&lt;/span&gt;
-
-  &lt;!-- Este contenedor contedrá todas las opciones disponibles para nuestro widget.
-       Como es una lista, tiene sentido usar el elemento ul. --&gt;
-  &lt;ul class="optList"&gt;
-    &lt;!-- Cada opción solo contiene el valor que se mostrará, veremos más tarde
-         cómo manejar el valor real que será enviado con el formulario de datos --&gt;
-    &lt;li class="option"&gt;Cherry&lt;/li&gt;
-    &lt;li class="option"&gt;Lemon&lt;/li&gt;
-    &lt;li class="option"&gt;Banana&lt;/li&gt;
-    &lt;li class="option"&gt;Strawberry&lt;/li&gt;
-    &lt;li class="option"&gt;Apple&lt;/li&gt;
-  &lt;/ul&gt;
-
-&lt;/div&gt;</pre>
-
-<p>Tenga en cuanta el uso de nombres de clases; estos identifican cada parte relevante independientemente de los elementos HTML subyacentes reales utilizados. Esto es importante para garantizar que no vinculamos nuestro CSS y JavaScript a una estructura HTML sólida, de modo que podamos realizar cambios despues en la implementación sin romper el código que usa el widget. Pro ejemplo, si desea implementar el equivalente del elemento {{HTMLElement("optgroup")}}.</p>
-
-<h3 id="Creating_the_look_and_feel_using_CSS">Creating the look and feel using CSS</h3>
-
-<p>Now that we have a structure, we can start designing our widget. The whole point of building this custom widget is to be able to style this widget exactly as we want. To that end, we will split our CSS work into two parts: the first part will be the CSS rules absolutely necessary to have our widget behave like a {{HTMLElement("select")}} element, and the second part will consist of the fancy styles used to make it look the way we want.</p>
-
-<h4 id="Required_styles">Required styles</h4>
-
-<p>The required styles are those necessary to handle the three states of our widget.</p>
-
-<pre class="brush: css">.select {
-  /* This will create a positioning context for the list of options */
-  position: relative;
-
-  /* This will make our widget become part of the text flow and sizable at the same time */
-  display : inline-block;
-}</pre>
-
-<p>We need an extra class <code>active</code> to define the look and feel of our widget when it is in its active state. Because our widget is focusable, we double this custom style with the {{cssxref(":focus")}} pseudo-class in order to be sure they will behave the same.</p>
-
-<pre class="brush: css">.select.active,
-.select:focus {
-  outline: none;
-
-  /* This box-shadow property is not exactly required, however it's so important to be sure
-     the active state is visible that we use it as a default value, feel free to override it. */
-  box-shadow: 0 0 3px 1px #227755;
-}</pre>
-
-<p>Now, let's handle the list of options:</p>
-
-<pre class="brush: css">/* The .select selector here is syntactic sugar to be sure the classes we define are
-   the ones inside our widget. */
-.select .optList {
-  /* This will make sure our list of options will be displayed below the value
-     and out of the HTML flow */
-  position : absolute;
-  top      : 100%;
-  left     : 0;
-}</pre>
-
-<p>We need an extra class to handle when the list of options is hidden. This is necessary in order to manage the differences between the active state and the open state that do not exactly match.</p>
-
-<pre class="brush: css">.select .optList.hidden {
-  /* This is a simple way to hide the list in an accessible way,
-     we will talk more about accessibility in the end */
-  max-height: 0;
-  visibility: hidden;
-}</pre>
-
-<h4 id="Beautification">Beautification</h4>
-
-<p>So now that we have the basic functionality in place, the fun can start. The following is just an example of what is possible, and will match the screenshot at the beginning of this article. However, you should feel free to experiment and see what you can come up with.</p>
-
-<pre class="brush: css">.select {
-  /* All sizes will be expressed with the em value for accessibility reasons
-     (to make sure the widget remains resizable if the user uses the
-     browser's zoom in a text-only mode). The computations are made
-     assuming 1em == 16px which is the default value in most browsers.
-     If you are lost with px to em conversion, try http://riddle.pl/emcalc/ */
-  font-size   : 0.625em; /* this (10px) is the new font size context for em value in this context */
-  font-family : Verdana, Arial, sans-serif;
-
-  -moz-box-sizing : border-box;
-  box-sizing : border-box;
-
-  /* We need extra room for the down arrow we will add */
-  padding : .1em 2.5em .2em .5em; /* 1px 25px 2px 5px */
-  width   : 10em; /* 100px */
-
-  border        : .2em solid #000; /* 2px */
-  border-radius : .4em; /* 4px */
-  box-shadow    : 0 .1em .2em rgba(0,0,0,.45); /* 0 1px 2px */
-
-  /* The first declaration is for browsers that do not support linear gradients.
-     The second declaration is because WebKit based browsers haven't unprefixed it yet.
-     If you want to support legacy browsers, try http://www.colorzilla.com/gradient-editor/ */
-  background : #F0F0F0;
-  background : -webkit-linear-gradient(90deg, #E3E3E3, #fcfcfc 50%, #f0f0f0);
-  background : linear-gradient(0deg, #E3E3E3, #fcfcfc 50%, #f0f0f0);
-}
-
-.select .value {
-  /* Because the value can be wider than our widget, we have to make sure it will not
-     change the widget's width */
-  display  : inline-block;
-  width    : 100%;
-  overflow : hidden;
-
-  vertical-align: top;
-
-  /* And if the content overflows, it's better to have a nice ellipsis. */
-  white-space  : nowrap;
-  text-overflow: ellipsis;
-}</pre>
-
-<p>We don't need an extra element to design the down arrow; instead, we're using the {{cssxref(":after")}} pseudo-element. However, it could also be implemented using a simple background image on the <code>select</code> class.</p>
-
-<pre class="brush: css">.select:after {
-  content : "▼"; /* We use the unicode caracter U+25BC; see http://www.utf8-chartable.de */
-  position: absolute;
-  z-index : 1; /* This will be important to keep the arrow from overlapping the list of options */
-  top     : 0;
-  right   : 0;
-
-  -moz-box-sizing : border-box;
-  box-sizing : border-box;
-
-  height  : 100%;
-  width   : 2em;  /* 20px */
-  padding-top : .1em; /* 1px */
-
-  border-left  : .2em solid #000; /* 2px */
-  border-radius: 0 .1em .1em 0;  /* 0 1px 1px 0 */
-
-  background-color : #000;
-  color : #FFF;
-  text-align : center;
-}</pre>
-
-<p>Next, let's style the list of options:</p>
-
-<pre class="brush: css">.select .optList {
-  z-index : 2; /* We explicitly said the list of options will always overlap the down arrow */
-
-  /* this will reset the default style of the ul element */
-  list-style: none;
-  margin : 0;
-  padding: 0;
-
-  -moz-box-sizing : border-box;
-  box-sizing : border-box;
-
-  /* This will ensure that even if the values are smaller than the widget,
-     the list of options will be as large as the widget itself */
-  min-width : 100%;
-
-  /* In case the list is too long, its content will overflow vertically
-     (which will add a vertical scrollbar automatically) but never horizontally
-     (because we haven't set a width, the list will adjust its width automatically.
-     If it can't, the content will be truncated) */
-  max-height: 10em; /* 100px */
-  overflow-y: auto;
-  overflow-x: hidden;
-
-  border: .2em solid #000; /* 2px */
-  border-top-width : .1em; /* 1px */
-  border-radius: 0 0 .4em .4em; /* 0 0 4px 4px */
-
-  box-shadow: 0 .2em .4em rgba(0,0,0,.4); /* 0 2px 4px */
-  background: #f0f0f0;
-}</pre>
-
-<p>For the options, we need to add a <code>highlight</code> class to be able to identify the value the user will pick (or has picked).</p>
-
-<pre class="brush: css">.select .option {
-  padding: .2em .3em; /* 2px 3px */
-}
-
-.select .highlight {
-  background: #000;
-  color: #FFFFFF;
-}</pre>
-
-<p>So here's the result with our three states:</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col" style="text-align: center;">Basic state</th>
-   <th scope="col" style="text-align: center;">Active state</th>
-   <th scope="col" style="text-align: center;">Open state</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{EmbedLiveSample("Basic_state",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_1")}}</td>
-   <td>{{EmbedLiveSample("Active_state",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_1")}}</td>
-   <td>{{EmbedLiveSample("Open_state",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_1")}}</td>
-  </tr>
-  <tr>
-   <td colspan="3" style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_1" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_1">Check out the source code</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Bring_your_widget_to_life_with_JavaScript">Bring your widget to life with JavaScript</h2>
-
-<p>Now that our design and structure are ready, we can write the JavaScript code to make the widget actually work.</p>
-
-<div class="warning">
-<p><strong>Warning:</strong> The following code is educational and should not be used as-is. Among many things, as we'll see, it is not future-proof and it will not work on legacy browsers. It also has redundant parts that should be optimized in production code.</p>
-</div>
-
-<div class="note">
-<p><strong>Note:</strong> Creating reusable widgets is something that can be a bit tricky. The <a href="http://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html" rel="external" title="http://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html">W3C Web Component draft</a> is one of the answers to this specific issue. <a href="http://x-tags.org/" rel="external" title="http://x-tags.org/">The X-Tag project</a> is a test implementation of this specification; we encourage you to take a look at it.</p>
-</div>
-
-<h3 id="Why_isn't_it_working">Why isn't it working?</h3>
-
-<p>Before we start, it's important to remember something very important about JavaScript: inside a browser, <strong>it's an unreliable technology</strong>. When you are building custom widgets, you'll have to rely on JavaScript because it's a necessary thread to tie everything together. However, there are many cases in which JavaScript isn't able to run in the browser:</p>
-
-<ul>
- <li>The user has turned off JavaScript: This is the most unusual case ever; very few people turn off JavaScript nowadays.</li>
- <li>The script is not loading. This is one of the most common cases, especially in the mobile world where the network is not very reliable.</li>
- <li>The script is buggy. You should always consider this possibility.</li>
- <li>The script is in conflict with a third party script. This can happen with tracking scripts or any bookmarklets the user uses.</li>
- <li>The script is in conflict with, or is affected by, a browser extension (such as Firefox's <a href="https://addons.mozilla.org/fr/firefox/addon/noscript/" rel="external" title="https://addons.mozilla.org/fr/firefox/addon/noscript/">NoScript</a> extension or Chrome's <a href="https://chrome.google.com/webstore/detail/notscripts/odjhifogjcknibkahlpidmdajjpkkcfn" rel="external" title="https://chrome.google.com/webstore/detail/notscripts/odjhifogjcknibkahlpidmdajjpkkcfn">NotScripts</a> extension).</li>
- <li>The user is using a legacy browser, and one of the features you require is not supported. This will happen frequently when you make use of cutting-edge APIs.</li>
-</ul>
-
-<p>Because of these risks, it's really important to seriously consider what will happen if JavaScript isn't working. Dealing in detail with this issue is out of the scope of this article because it's closely linked to how you want to make your script generic and reusable, but we'll consider the basics of this in our example.</p>
-
-<p>In our example, if our JavaScript code isn't running, we'll fall back to displaying a standard {{HTMLElement("select")}} element. To achieve this, we need two things.</p>
-
-<p>First, we need to add a regular {{HTMLElement("select")}} element before each use of our custom widget. This is actually also required in order to be able to send data from our custom widget along with the rest of our form data; more about this later.</p>
-
-<pre class="brush: html">&lt;body class="no-widget"&gt;
-  &lt;form&gt;
-    &lt;select name="myFruit"&gt;
-      &lt;option&gt;Cherry&lt;/option&gt;
-      &lt;option&gt;Lemon&lt;/option&gt;
-      &lt;option&gt;Banana&lt;/option&gt;
-      &lt;option&gt;Strawberry&lt;/option&gt;
-      &lt;option&gt;Apple&lt;/option&gt;
-    &lt;/select&gt;
-
-    &lt;div class="select"&gt;
-      &lt;span class="value"&gt;Cherry&lt;/span&gt;
-      &lt;ul class="optList hidden"&gt;
-        &lt;li class="option"&gt;Cherry&lt;/li&gt;
-        &lt;li class="option"&gt;Lemon&lt;/li&gt;
-        &lt;li class="option"&gt;Banana&lt;/li&gt;
-        &lt;li class="option"&gt;Strawberry&lt;/li&gt;
-        &lt;li class="option"&gt;Apple&lt;/li&gt;
-      &lt;/ul&gt;
-    &lt;/div&gt;
-  &lt;/form&gt;
-
-&lt;/body&gt;</pre>
-
-<p>Second, we need two new classes to let us hide the unneeded element (that is, the "real" {{HTMLElement("select")}} element if our script isn't running, or the custom widget if it is running). Note that by default, our HTML code hides our custom widget.</p>
-
-<pre class="brush: css">.widget select,
-.no-widget .select {
-  /* This CSS selector basically says:
-     - either we have set the body class to "widget" and thus we hide the actual {{HTMLElement("select")}} element
-     - or we have not changed the body class, therefore the body class is still "no-widget",
-       so the elements whose class is "select" must be hidden */
-  position : absolute;
-  left     : -5000em;
-  height   : 0;
-  overflow : hidden;
-}</pre>
-
-<p>Now we just need a JavaScript switch to determine if the script is running or not. This switch is very simple: if at page load time our script is running, it will remove the <code>no-widget</code> class and add the <code>widget</code> class, thereby swapping the visibility of the {{HTMLElement("select")}} element and of the custom widget.</p>
-
-<pre class="brush: js">window.addEventListener("load", function () {
-  document.body.classList.remove("no-widget");
-  document.body.classList.add("widget");
-});</pre>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col" style="text-align: center;">Without JS</th>
-   <th scope="col" style="text-align: center;">With JS</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{EmbedLiveSample("No_JS",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_2")}}</td>
-   <td>{{EmbedLiveSample("JS",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_2")}}</td>
-  </tr>
-  <tr>
-   <td colspan="2" style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_2" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_2">Check out the source code</a></td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Note:</strong> If you really want to make your code generic and reusable, instead of doing a class switch it's far better to just add the widget class to hide the {{HTMLElement("select")}} elements, and to dynamically add the DOM tree representing the custom widget after every {{HTMLElement("select")}} element in the page.</p>
-</div>
-
-<h3 id="Making_the_job_easier">Making the job easier</h3>
-
-<p>In the code we are about to build, we will use the standard DOM API to do all the work we need. However, although DOM API support has gotten much better in browsers, there are always issues with legacy browsers (especially with good old Internet Explorer).</p>
-
-<p>If you want to avoid trouble with legacy browsers, there are two ways to do so: using a dedicated framework such as <a href="http://jquery.com/" rel="external" title="http://jquery.com/">jQuery</a>, <a href="https://github.com/julienw/dollardom" rel="external" title="https://github.com/julienw/dollardom">$dom</a>, <a href="http://prototypejs.org/" rel="external" title="http://prototypejs.org/">prototype</a>, <a href="http://dojotoolkit.org/" rel="external" title="http://dojotoolkit.org/">Dojo</a>, <a href="http://yuilibrary.com/" rel="external" title="http://yuilibrary.com/">YUI</a>, or the like, or by polyfilling the missing feature you want to use (which can easily be done through conditional loading, with the <a href="http://yepnopejs.com/" rel="external" title="http://yepnopejs.com/">yepnope</a> library for example).</p>
-
-<p>The features we plan to use are the following (ordered from the riskiest to the safest):</p>
-
-<ol>
- <li>{{domxref("element.classList","classList")}}</li>
- <li>{{domxref("EventTarget.addEventListener","addEventListener")}}</li>
- <li><code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach">forEach</a></code> (This is not DOM but modern JavaScript)</li>
- <li>{{domxref("element.querySelector","querySelector")}} and {{domxref("element.querySelectorAll","querySelectorAll")}}</li>
-</ol>
-
-<p>Beyond the availability of those specific features, there is still one issue remaining before starting. The object returned by the {{domxref("element.querySelectorAll","querySelectorAll()")}} function is a {{domxref("NodeList")}} rather than an <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array">Array</a></code>. This is important because <code>Array</code> objects support the <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach" title="/en-US/docs/JavaScript/Reference/Global_Objects/Array/forEach">forEach</a></code> function, but {{domxref("NodeList")}} doesn't. Because {{domxref("NodeList")}} really looks like an <code>Array</code> and because <code>forEach</code> is so convenient to use, we can easily add the support of <code>forEach</code> to {{domxref("NodeList")}} in order to make our life easier, like so:</p>
-
-<pre class="brush: js">NodeList.prototype.forEach = function (callback) {
-  Array.prototype.forEach.call(this, callback);
-}</pre>
-
-<p>We weren't kidding when we said it's easy to do.</p>
-
-<h3 id="Building_event_callbacks">Building event callbacks</h3>
-
-<p>The ground is ready, we can now start to define all the functions that will be used each time the user interacts with our widget.</p>
-
-<pre class="brush: js">// This function will be used each time we want to deactivate a custom widget
-// It takes one parameter
-// select : the DOM node with the `select` class to deactivate
-function deactivateSelect(select) {
-
-  // If the widget is not active there is nothing to do
-  if (!select.classList.contains('active')) return;
-
-  // We need to get the list of options for the custom widget
-  var optList = select.querySelector('.optList');
-
-  // We close the list of option
-  optList.classList.add('hidden');
-
-  // and we deactivate the custom widget itself
-  select.classList.remove('active');
-}
-
-// This function will be used each time the user wants to (de)activate the widget
-// It takes two parameters:
-// select : the DOM node with the `select` class to activate
-// selectList : the list of all the DOM nodes with the `select` class
-function activeSelect(select, selectList) {
-
-  // If the widget is already active there is nothing to do
-  if (select.classList.contains('active')) return;
-
-  // We have to turn off the active state on all custom widgets
-  // Because the deactivateSelect function fulfill all the requirement of the
-  // forEach callback function, we use it directly without using an intermediate
-  // anonymous function.
-  selectList.forEach(deactivateSelect);
-
-  // And we turn on the active state for this specific widget
-  select.classList.add('active');
-}
-
-// This function will be used each time the user wants to open/closed the list of options
-// It takes one parameter:
-// select : the DOM node with the list to toggle
-function toggleOptList(select) {
-
-  // The list is kept from the widget
-  var optList = select.querySelector('.optList');
-
-  // We change the class of the list to show/hide it
-  optList.classList.toggle('hidden');
-}
-
-// This function will be used each time we need to highlight an option
-// It takes two parameters:
-// select : the DOM node with the `select` class containing the option to highlight
-// option : the DOM node with the `option` class to highlight
-function highlightOption(select, option) {
-
-  // We get the list of all option available for our custom select element
-  var optionList = select.querySelectorAll('.option');
-
-  // We remove the highlight from all options
-  optionList.forEach(function (other) {
-    other.classList.remove('highlight');
-  });
-
-  // We highlight the right option
-  option.classList.add('highlight');
-};</pre>
-
-<p>That's all you need in order to handle the various states of the custom widget.</p>
-
-<p>Next, we bind these functions to the appropriate events:</p>
-
-<pre class="brush: js">// We handle the event binding when the document is loaded.
-window.addEventListener('load', function () {
-  var selectList = document.querySelectorAll('.select');
-
-  // Each custom widget needs to be initialized
-  selectList.forEach(function (select) {
-
-    // as well as all its `option` elements
-    var optionList = select.querySelectorAll('.option');
-
-    // Each time a user hovers their mouse over an option, we highlight the given option
-    optionList.forEach(function (option) {
-      option.addEventListener('mouseover', function () {
-        // Note: the `select` and `option` variable are closures
-        // available in the scope of our function call.
-        highlightOption(select, option);
-      });
-    });
-
-    // Each times the user click on a custom select element
-    select.addEventListener('click', function (event) {
-      // Note: the `select` variable is a closure
-      // available in the scope of our function call.
-
-      // We toggle the visibility of the list of options
-      toggleOptList(select);
-    });
-
-    // In case the widget gain focus
-    // The widget gains the focus each time the user clicks on it or each time
-    // they use the tabulation key to access the widget
-    select.addEventListener('focus', function (event) {
-      // Note: the `select` and `selectList` variable are closures
-      // available in the scope of our function call.
-
-      // We activate the widget
-      activeSelect(select, selectList);
-    });
-
-    // In case the widget loose focus
-    select.addEventListener('blur', function (event) {
-      // Note: the `select` variable is a closure
-      // available in the scope of our function call.
-
-      // We deactivate the widget
-      deactivateSelect(select);
-    });
-  });
-});</pre>
-
-<p>At that point, our widget will change state according to our design, but its value doesn't get updated yet. We'll handle that next.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col" style="text-align: center;">Live example</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{EmbedLiveSample("Change_states",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_3")}}</td>
-  </tr>
-  <tr>
-   <td style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_3" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_3">Check out the source code</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Handling_the_widget's_value">Handling the widget's value</h3>
-
-<p>Now that our widget is working, we have to add code to update its value according to user input and make it possible to send the value along with form data.</p>
-
-<p>The easiest way to do this is to use a native widget under the hood. Such a widget will keep track of the value with all the built-in controls provided by the browser, and the value will be sent as usual when a form is submitted. There's no point in reinventing the wheel when we can have all this done for us.</p>
-
-<p>As seen previously, we already use a native select widget as a fallback for accessibility reasons; we can simply synchronize its value with that of our custom widget:</p>
-
-<pre class="brush: js">// This function updates the displayed value and synchronizes it with the native widget.
-// It takes two parameters:
-// select : the DOM node with the class `select` containing the value to update
-// index  : the index of the value to be selected
-function updateValue(select, index) {
-  // We need to get the native widget for the given custom widget
-  // In our example, that native widget is a sibling of the custom widget
-  var nativeWidget = select.previousElementSibling;
-
-  // We also need  to get the value placeholder of our custom widget
-  var value = select.querySelector('.value');
-
-  // And we need the whole list of options
-  var optionList = select.querySelectorAll('.option');
-
-  // We set the selected index to the index of our choice
-  nativeWidget.selectedIndex = index;
-
-  // We update the value placeholder accordingly
-  value.innerHTML = optionList[index].innerHTML;
-
-  // And we highlight the corresponding option of our custom widget
-  highlightOption(select, optionList[index]);
-};
-
-// This function returns the current selected index in the native widget
-// It takes one parameter:
-// select : the DOM node with the class `select` related to the native widget
-function getIndex(select) {
-  // We need to access the native widget for the given custom widget
-  // In our example, that native widget is a sibling of the custom widget
-  var nativeWidget = select.previousElementSibling;
-
-  return nativeWidget.selectedIndex;
-};</pre>
-
-<p>With these two functions, we can bind the native widgets to the custom ones:</p>
-
-<pre class="brush: js">// We handle event binding when the document is loaded.
-window.addEventListener('load', function () {
-  var selectList = document.querySelectorAll('.select');
-
-  // Each custom widget needs to be initialized
-  selectList.forEach(function (select) {
-    var optionList = select.querySelectorAll('.option'),
-        selectedIndex = getIndex(select);
-
-    // We make our custom widget focusable
-    select.tabIndex = 0;
-
-    // We make the native widget no longer focusable
-    select.previousElementSibling.tabIndex = -1;
-
-    // We make sure that the default selected value is correctly displayed
-    updateValue(select, selectedIndex);
-
-    // Each time a user clicks on an option, we update the value accordingly
-    optionList.forEach(function (option, index) {
-      option.addEventListener('click', function (event) {
-        updateValue(select, index);
-      });
-    });
-
-    // Each time a user uses their keyboard on a focused widget, we update the value accordingly
-    select.addEventListener('keyup', function (event) {
-      var length = optionList.length,
-          index  = getIndex(select);
-
-      // When the user hits the down arrow, we jump to the next option
-      if (event.keyCode === 40 &amp;&amp; index &lt; length - 1) { index++; }
-
-      // When the user hits the up arrow, we jump to the previous option
-      if (event.keyCode === 38 &amp;&amp; index &gt; 0) { index--; }
-
-      updateValue(select, index);
-    });
-  });
-});</pre>
-
-<p>In the code above, it's worth noting the use of the <code><a href="/en-US/docs/Web/API/HTMLElement/tabIndex" title="/en-US/docs/Web/API/HTMLElement/tabIndex">tabIndex</a></code> property. Using this property is necessary to ensure that the native widget will never gain focus, and to make sure that our custom widget gains focus when the user uses his keyboard or his mouse.</p>
-
-<p>With that, we're done! Here's the result:</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col" style="text-align: center;">Live example</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{EmbedLiveSample("Change_states",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_4")}}</td>
-  </tr>
-  <tr>
-   <td style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_4" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_4">Check out the source code</a></td>
-  </tr>
- </tbody>
-</table>
-
-<p>But wait a second, are we really done?</p>
-
-<h2 id="Make_it_accessible">Make it accessible</h2>
-
-<p>We have built something that works and though we're far from a fully-featured select box, it works nicely. But what we've done is nothing more than fiddle with the DOM. It has no real semantics, and even though it looks like a select box, from the browser's point of view it isn't one, so assistive technologies won't be able to understand it's a select box. In short, this pretty new select box isn't accessible!</p>
-
-<p>Fortunately, there is a solution and it's called <a href="/en-US/docs/Accessibility/ARIA" title="/en-US/docs/Accessibility/ARIA">ARIA</a>. ARIA stands for "Accessible Rich Internet Application", and it's <a href="http://www.w3.org/TR/wai-aria/" rel="external" title="http://www.w3.org/TR/wai-aria/">a W3C specification</a> specifically designed for what we are doing here: making web applications and custom widgets accessible. It's basically a set of attributes that extend HTML so that we can better describe roles, states and properties as though the element we've just devised was the native element it tries to pass for. Using these attributes is dead simple, so let's do it.</p>
-
-<h3 id="The_role_attribute">The <code>role</code> attribute</h3>
-
-<p>The key attribute used by <a href="/en-US/docs/Accessibility/ARIA" title="/en-US/docs/Accessibility/ARIA">ARIA</a> is the <a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques"><code>role</code></a> attribute. The <a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques"><code>role</code></a> attribute accepts a value that defines what an element is used for. Each role defines its own requirements and behaviors. In our example, we will use the <code><a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role">listbox</a></code> role. It's a "composite role", which means elements with that role expect to have children, each with a specific role (in this case, at least one child with the <code>option</code> role).</p>
-
-<p>It's also worth noting that ARIA defines roles that are applied by default to standard HTML markup. For example, the {{HTMLElement("table")}} element matches the role <code>grid</code>, and the {{HTMLElement("ul")}} element matches the role <code>list</code>. Because we use a {{HTMLElement("ul")}} element, we want to make sure the <code>listbox</code> role of our widget will supersede the <code>list</code> role of the {{HTMLElement("ul")}} element. To that end, we will use the role <code>presentation</code>. This role is designed to let us indicate that an element has no special meaning, and is used solely to present information. We will apply it to our {{HTMLElement("ul")}} element.</p>
-
-<p>To support the <code><a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques/Using_the_listbox_role">listbox</a></code> role, we just have to update our HTML like this:</p>
-
-<pre class="brush: html">&lt;!-- We add the role="listbox" attribute to our top element --&gt;
-&lt;div class="select" role="listbox"&gt;
-  &lt;span class="value"&gt;Cherry&lt;/span&gt;
-  &lt;!-- We also add the role="presentation" to the ul element --&gt;
-  &lt;ul class="optList" role="presentation"&gt;
-    &lt;!-- And we add the role="option" attribute to all the li elements --&gt;
-    &lt;li role="option" class="option"&gt;Cherry&lt;/li&gt;
-    &lt;li role="option" class="option"&gt;Lemon&lt;/li&gt;
-    &lt;li role="option" class="option"&gt;Banana&lt;/li&gt;
-    &lt;li role="option" class="option"&gt;Strawberry&lt;/li&gt;
-    &lt;li role="option" class="option"&gt;Apple&lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/div&gt;</pre>
-
-<div class="note">
-<p><strong>Note:</strong> Including both the <code>role</code> attribute and a <code>class</code> attribute is only necessary if you want to support legacy browsers that do not support the <a href="/en-US/docs/CSS/Attribute_selectors" title="/en-US/docs/CSS/Attribute_selectors">CSS attribute selectors</a>.</p>
-</div>
-
-<h3 id="The_aria-selected_attribute">The <code>aria-selected</code> attribute</h3>
-
-<p>Using the <a href="/en-US/docs/Accessibility/ARIA/ARIA_Techniques" title="/en-US/docs/Accessibility/ARIA/ARIA_Techniques"><code>role</code></a> attribute is not enough. <a href="/en-US/docs/Accessibility/ARIA" title="/en-US/docs/Accessibility/ARIA">ARIA</a> also provides many states and property attributes. The more and better you use them, the better your widget will be understood by assistive technologies. In our case, we will limit our usage to one attribute: <code>aria-selected</code>.</p>
-
-<p>The <code>aria-selected</code> attribute is used to mark which option is currently selected; this lets assistive technologies inform the user what the current selection is. We will use it dynamically with JavaScript to mark the selected option each time the user chooses one. To that end, we need to revise our <code>updateValue()</code> function:</p>
-
-<pre class="brush: js">function updateValue(select, index) {
-  var nativeWidget = select.previousElementSibling;
-  var value = select.querySelector('.value');
-  var optionList = select.querySelectorAll('.option');
-
-  // We make sure that all the options are not selected
-  optionList.forEach(function (other) {
-    other.setAttribute('aria-selected', 'false');
-  });
-
-  // We make sure the chosen option is selected
-  optionList[index].setAttribute('aria-selected', 'true');
-
-  nativeWidget.selectedIndex = index;
-  value.innerHTML = optionList[index].innerHTML;
-  highlightOption(select, optionList[index]);
-};</pre>
-
-<p>Here is the final result of all these changes (you'll get a better feel for this by trying it with an assistive technology such as <a href="http://www.nvda-project.org/" rel="external" title="http://www.nvda-project.org/">NVDA</a> or <a href="http://www.apple.com/accessibility/voiceover/" rel="external" title="http://www.apple.com/accessibility/voiceover/">VoiceOver</a>):</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col" style="text-align: center;">Live example</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{EmbedLiveSample("Change_states",120,130, "", "HTML/Forms/How_to_build_custom_form_widgets/Example_5")}}</td>
-  </tr>
-  <tr>
-   <td style="text-align: center;"><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_5" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets/Example_2">Check out the final source code</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Conclusion">Conclusion</h2>
-
-<p>We have seen all the basics of building a custom form widget, but as you can see it's not trivial to do, and often it's better and easier to rely on third-party libraries instead of coding them from scratch yourself (unless, of course, your goal is to build such a library).</p>
-
-<p>Here are a few libraries you should consider before coding your own:</p>
-
-<ul>
- <li><a href="http://jqueryui.com/" rel="external" title="http://jqueryui.com/">jQuery UI</a></li>
- <li><a href="https://github.com/marghoobsuleman/ms-Dropdown" rel="external" title="https://github.com/marghoobsuleman/ms-Dropdown">msDropDown</a></li>
- <li><a href="http://www.emblematiq.com/lab/niceforms/" rel="external" title="http://www.emblematiq.com/lab/niceforms/">Nice Forms</a></li>
- <li><a href="https://www.google.fr/search?q=HTML+custom+form+controls&amp;ie=utf-8&amp;oe=utf-8&amp;aq=t&amp;rls=org.mozilla:fr:official&amp;client=firefox-a" rel="external" title="https://www.google.fr/search?q=HTML+custom+form+controls&amp;ie=utf-8&amp;oe=utf-8&amp;aq=t&amp;rls=org.mozilla:fr:official&amp;client=firefox-a">And many more…</a></li>
-</ul>
-
-<p>If you want to move forward, the code in this example needs some improvement before it becomes generic and reusable. This is an exercise you can try to perform. Two hints to help you in this: the first argument for all our functions is the same, which means those functions need the same context. Building an object to share that context would be wise. Also, you need to make it feature-proof; that is, it needs to be able to work better with a variety of browsers whose compatibility with the Web standards they use vary. Have fun!</p>
-
-<p>{{PreviousMenuNext("Learn/HTML/Forms/Form_validation", "Learn/HTML/Forms/Sending_forms_through_JavaScript", "Learn/HTML/Forms")}}</p>
-
-<p> </p>
-
-<h2 id="In_this_module">In this module</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Your first HTML form</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">How to structure an HTML form</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">The native form widgets</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Sending form data</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Form data validation</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">How to build custom form widgets</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Sending forms through JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">HTML forms in legacy browsers</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Styling HTML forms</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Property compatibility table for form widgets</a></li>
-</ul>
-
-<p> </p>
diff --git a/files/es/learn/html/forms/how_to_structure_an_html_form/index.html b/files/es/learn/html/forms/how_to_structure_an_html_form/index.html
deleted file mode 100644
index 45f58520d1..0000000000
--- a/files/es/learn/html/forms/how_to_structure_an_html_form/index.html
+++ /dev/null
@@ -1,320 +0,0 @@
----
-title: Cómo estructurar un formulario HTML
-slug: Learn/HTML/Forms/How_to_structure_an_HTML_form
-translation_of: Learn/Forms/How_to_structure_a_web_form
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}</div>
-
-<p class="summary">Una vez examinados los conceptos básicos, vamos a ver más en detalle los elementos que se utilizan para proporcionar estructura y significado a las diferentes partes de un formulario.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática y de <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">lenguajes HTML</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Entender cómo se estructuran los formularios HTML y se les proporciona semántica para dotarlos de criterios de usabilidad y accesibilidad.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>La flexibilidad que presentan los formularios los convierte en una de las estructuras más complejas en <a href="/es/docs/Learn/HTML" title="/en-US/docs/HTML">HTML</a>, puesto que puedes crear cualquier tipo de formulario básico a partir de los elementos y atributos destinados a esta función. El uso de una estructura correcta al crear un formulario HTML te ayudará a garantizar que el formulario presente las características de usabilidad y <a href="/es/docs/Learn/Accessibility">accesibilidad </a> adecuadas.</p>
-
-<h2 id="El_elemento_&lt;form>">El elemento &lt;form&gt;</h2>
-
-<p>El elemento {{HTMLElement ("form")}} define formalmente un formulario y los atributos que determinan el comportamiento del formulario. Cada vez que desees crear un formulario HTML, debes empezar utilizando este elemento y anidando todo el contenido dentro de él. Muchas tecnologías de asistencia y complementos del navegador pueden descubrir elementos {{HTMLElement ("form")}} e implementar códigos de apoyo (<em>hooks</em>) especiales para que sean más fáciles de usar.</p>
-
-<p>Ya lo vimos en el artículo anterior.</p>
-
-<div class="warning"><strong>Advertencia:</strong> Está estrictamente prohibido anidar un formulario dentro de otro formulario. Anidar formularios no es una buena idea porque puede ocasionar comportamientos impredecibles.</div>
-
-<p>Siempre es posible usar controles de formulario fuera de un elemento {{HTMLElement ("form")}}. Si la haces, por defecto ese control no tiene nada que ver con ningún formulario, a menos que lo asocies a algún formulario con el atributo <a href="/en-US/docs/Web/HTML/Attributes/form"><code>form</code></a>. Esto se introdujo para permitir vincular explícitamente un control a un formulario, incluso si este no está dentro de él.</p>
-
-<p>A continuación vamos a exponer los elementos estructurales que encontrarás en un formulario.</p>
-
-<h2 id="Los_elementos_&lt;fieldset>_y_&lt;legend>">Los elementos &lt;fieldset&gt; y &lt;legend&gt;</h2>
-
-<p>El elemento {{HTMLElement ("fieldset")}} es una forma cómoda de crear grupos de controles de formulario (también denominados <em>widgets</em>) que comparten el mismo propósito, con fines semánticos y de aplicación de estilo. Puedes etiquetar un elemento {{HTMLElement ("fieldset")}} incluyendo un elemento {{HTMLElement ("legend")}} justo debajo de la etiqueta de apertura {{HTMLElement ("fieldset")}}. El contenido textual del elemento {{HTMLElement ("legend")}} describe formalmente el propósito del elemento {{HTMLElement ("fieldset")}} que está incluido dentro.</p>
-
-<p>Muchas tecnologías de asistencia utilizarán el elemento {{HTMLElement ("legend")}} como si fuera una parte de la etiqueta de cada control dentro del elemento {{HTMLElement ("fieldset")}} correspondiente. Por ejemplo, algunos lectores de pantalla como <a href="http://www.freedomscientific.com/products/software/jaws/" rel="external" title="http://www.freedomscientific.com/products/fs/jaws-product-page.asp">Jaws</a> y <a href="http://www.nvda-project.org/" rel="external" title="http://www.nvda-project.org/">NVDA</a> leerán el contenido de la leyenda antes de decir la etiqueta de cada control.</p>
-
-<p>Un pequeño ejemplo:</p>
-
-<pre class="brush:html; notranslate">&lt;form&gt;
-  &lt;fieldset&gt;
-    &lt;legend&gt;Tamaño del zumo de fruta&lt;/legend&gt;
-    &lt;p&gt;
-      &lt;input type="radio" name="size" id="size_1" value="small"&gt;
-      &lt;label for="size_1"&gt;Pequeño&lt;/label&gt;
-    &lt;/p&gt;
-    &lt;p&gt;
-      &lt;input type="radio" name="size" id="size_2" value="medium"&gt;
-      &lt;label for="size_2"&gt;Mediano&lt;/label&gt;
-    &lt;/p&gt;
-    &lt;p&gt;
-      &lt;input type="radio" name="size" id="size_3" value="large"&gt;
-      &lt;label for="size_3"&gt;Grande&lt;/label&gt;
-    &lt;/p&gt;
-  &lt;/fieldset&gt;
-&lt;/form&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/fieldset-legend.html">fieldset-legend.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/fieldset-legend.html">consúltalo en vivo</a>).</p>
-</div>
-
-<p>Al leer el formulario anterior, un lector de pantalla dirá «Tamaño del zumo de fruta: pequeño» para el primer control de formulario, «Tamaño del zumo de fruta: mediano» para el segundo y «Tamaño del zumo de fruta: grande» para el tercero.</p>
-
-<p>El caso de uso que se muestra en este ejemplo es uno de los más importantes. Cada vez que tengas un conjunto de botones de opción, debes anidarlos dentro de un elemento {{HTMLElement ("fieldset")}}. Hay otros casos de uso y el elemento {{HTMLElement ("fieldset")}} también se puede usar en general para seccionar un formulario. Idealmente, los formularios largos deberían tener una extensión de varias páginas, pero si un formulario se alarga y ha de estar contenido en una sola página, colocar las diferentes secciones relacionadas dentro de diferentes conjuntos de campos mejora su usabilidad.</p>
-
-<p>Debido a la influencia que tiene sobre las tecnologías de asistencia, el elemento {{HTMLElement ("fieldset")}} es uno de los elementos clave para crear formularios accesibles. Sin embargo, no hay que abusar de él. Si es posible, cada vez que crees un formulario, intenta <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders">escuchar cómo lo interpreta un lector de pantalla</a>. Si suena raro, intenta mejorar la estructura del formulario.</p>
-
-<h2 id="El_elemento_&lt;label>">El elemento &lt;label&gt;</h2>
-
-<p>Como vimos en el artículo anterior, el elemento {{HTMLElement ("label")}} es la forma formal de definir una etiqueta para un control de un formulario HTML. Este es el elemento más importante si deseas crear formularios accesibles porque cuando se implementan correctamente, los lectores de pantalla leen la etiqueta de un elemento de formulario junto con las instrucciones relacionadas, y esto además resulta muy útil para los usuarios videntes. Tomemos este ejemplo que vimos en el artículo anterior:</p>
-
-<pre class="brush: html notranslate">&lt;label for="name"&gt;Nombre:&lt;/label&gt; &lt;input type="text" id="name" name="user_name"&gt;</pre>
-
-<p>Con la etiqueta <code>&lt;label&gt;</code> asociada correctamente con <code>&lt;input&gt;</code> por su atributo <code>for</code> (que contiene el atributo <code>id</code> del elemento <code>&lt;input&gt;</code>), un lector de pantalla leerá algo como «Nombre, editar texto».</p>
-
-<p>Hay otra forma de asociar un control de formulario con una etiqueta: asociarlo implícitamente anidando el control de formulario dentro de <code>&lt;label&gt;</code>.</p>
-
-<pre class="brush: html notranslate">&lt;label for="name"&gt;
-  Nombre: &lt;input type="text" id="name" name="user_name"&gt;
-&lt;/label&gt;</pre>
-
-<p>Incluso en estos casos, se aconseja establecer el atributo <code>for</code> para garantizar que todas las tecnologías de asistencia comprendan la relación entre la etiqueta y el control de formulario.</p>
-
-<p>Si no hay ninguna etiqueta, o si el control de formulario no está asociado implícita o explícitamente con alguna etiqueta, un lector de pantalla leerá algo así como «Editar texto en blanco», lo cual no es de mucha ayuda.</p>
-
-<h3 id="¡También_se_puede_hacer_clic_en_las_etiquetas!">¡También se puede hacer clic en las etiquetas!</h3>
-
-<p>Otra ventaja de configurar correctamente las etiquetas es que puedes hacer clic o pulsar en la etiqueta para activar el control de formulario correspondiente. Esto es útil para controles como entradas de texto, donde puedes hacer clic tanto en la etiqueta como en la entrada de texto para proporcionar el foco al control de formulario, pero es útil especialmente para botones de opción y casillas de verificación, porque la zona sensible de este control puede ser muy pequeña, y puede ser útil para facilitar su activación.</p>
-
-<p>Por ejemplo, al hacer clic en el texto de la etiqueta «Me gustan las cerezas» del ejemplo siguiente, cambiará el estado seleccionado de la casilla de verificación <em>taste_cherry</em>:</p>
-
-<pre class="brush:html; notranslate">&lt;form&gt;
-  &lt;p&gt;
-    &lt;input type="checkbox" id="taste_1" name="taste_cherry" value="cherry"&gt;
-    &lt;label for="taste_1"&gt;Me gustan las cerezas&lt;/label&gt;
-  &lt;/p&gt;
-  &lt;p&gt;
-    &lt;input type="checkbox" id="taste_2" name="taste_banana" value="banana"&gt;
-    &lt;label for="taste_2"&gt;Me gustan los plátanos&lt;/label&gt;
-  &lt;/p&gt;
-&lt;/form&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/checkbox-label.html">checkbox-label.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/checkbox-label.html">consúltalo en vivo</a>).</p>
-</div>
-
-<h3 id="Etiquetas_múltiples">Etiquetas múltiples</h3>
-
-<p>Estrictamente hablando, es posible poner varias etiquetas en un solo control de formulario, pero no suele ser una buena idea porque algunas tecnologías de asistencia pueden tener problemas para manejarlas. En caso de tener varias etiquetas, hay que anidar el control de formulario y sus etiquetas dentro de un único elemento {{htmlelement ("label")}}.</p>
-
-<p>Consideremos este ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Los campos obligatorios se marcan con un &lt;abbr title = "required"&gt;*&lt;/abbr&gt;.&lt;/p&gt;
-
-&lt;!-- Así que esto: --&gt;
-&lt;div&gt;
-  &lt;label for="username"&gt;Nombre:&lt;/label&gt;
-  &lt;input type="text" name="username"&gt;
-  &lt;label for="username"&gt;&lt;abbr title="required" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/label&gt;
-&lt;/div&gt;
-
-&lt;!-- sería mejor hacerlo así: --&gt;
-&lt;div&gt;
-  &lt;label for="username"&gt;
-    &lt;span&gt;Nombre:&lt;/span&gt;
-    &lt;input id="username" type="text" name="username"&gt;
-    &lt;abbr title="required" aria-label="required"&gt;*&lt;/abbr&gt;
-  &lt;/label&gt;
-&lt;/div&gt;
-
-&lt;!-- Pero probablemente lo mejor es esto: --&gt;
-&lt;div&gt;
-  &lt;label for="username"&gt;Nombre: &lt;abbr title="required" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/label&gt;
-  &lt;input id="username" type="text" name="username"&gt;
-&lt;/div&gt;</pre>
-
-<p>{{EmbedLiveSample("Etiquetas_múltiples", 120, 120)}}</p>
-
-<p>El párrafo de la parte superior establece una regla para los elementos que son obligatorios. La regla ha de incluirse <em>antes</em> de usarse para que tanto los usuarios videntes como los usuarios que utilizan tecnologías de asistencia y lectores de pantalla, sepan lo que significa antes de encontrar un elemento obligatorio. Pero si bien esto ayuda a informar a los usuarios de lo que significa un asterisco, no es posible confiar plenamente en ello. Cuando un lector de pantalla se encuentre con un asterisco pronunciará «estrella». Cuando un usuario vidente pase el ratón por encima, debería aparecer una etiqueta de «obligatorio», lo cual se logra con el uso del atributo <code>title</code>. Pero los títulos que se leen en voz alta dependen de la configuración del lector de pantalla, por lo que es más fiable incluir también el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code>, que los lectores de pantalla siempre leen.</p>
-
-<p>Las variantes anteriores aumentan en efectividad a medida que se avanza por ellas:</p>
-
-<ul>
- <li>En el primer ejemplo, la etiqueta no se lee en absoluto con la entrada de texto; solo se obtiene «Editar texto en blanco», y además las etiquetas se leen por separado. Los múltiples elementos <code>&lt;label&gt;</code> confunden al lector de pantalla.</li>
- <li>En el segundo ejemplo, las cosas son un poco más claras: la etiqueta que se lee junto con la entrada de texto es «Editar texto nombre estrella nombre obligatorio», pero las etiquetas aún se leen por separado. Las cosas continúan siendo un poco confusas, pero esta vez funciona algo mejor porque <code>&lt;input&gt;</code> tiene una etiqueta asociada.</li>
- <li>El tercer ejemplo es el mejor: la etiqueta se lee en conjunto, y la etiqueta que se lee con la entrada es «Editar texto nombre requerido».</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Es posible que obtengas resultados ligeramente diferentes dependiendo de tu lector de pantalla. Esta prueba se hizo con VoiceOver (NVDA se comporta de manera similar). Nos encantaría conocer tus experiencias.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/required-labels.html">required-labels.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/required-labels.html">o consultarlo en vivo</a>). No pruebes el ejemplo con las dos o tres versiones sin los comentarios porque los lectores de pantalla se confundirán si hay múltiples etiquetas y múltiples entradas con el mismo ID.</p>
-</div>
-
-<h2 id="Estructuras_HTML_comunes_que_se_utilizan_en_los_formularios">Estructuras HTML comunes que se utilizan en los formularios</h2>
-
-<p>Más allá de las estructuras específicas de los formularios web, es bueno recordar que el marcado de los formularios es solo HTML. Esto significa que puedes usar todo el poder del HTML para estructurar un formulario web.</p>
-
-<p>Como puedes ver en los ejemplos, es una práctica común delimitar una etiqueta y su control de formulario con un elemento {{HTMLElement ("li")}} dentro de una lista {{HTMLElement ("ul")}} o {{HTMLElement ("ol")}}. Los elementos {{HTMLElement ("p")}} y {{HTMLElement ("div")}} también se usan con frecuencia. Se recomiendan las listas para estructurar múltiples casillas de verificación o botones de opción.</p>
-
-<p>Además del elemento {{HTMLElement ("fieldset")}}, también es una práctica común usar títulos HTML (por ejemplo, {{htmlelement ("h1")}}, {{htmlelement ("h2")}}), y seccionar (por ejemplo, {{htmlelement ("section")}}), para estructurar formas complejas.</p>
-
-<p>Depende de ti, sobre todo, encontrar un estilo de codificación cómodo que dé como resultado formas con buena accesibilidad y usabilidad. Las secciones independientes con funciones diferentes deben estar contenidas en elementos {{htmlelement ("section")}} separados, con elementos {{htmlelement ("fieldset")}} para contener botones de opción.</p>
-
-<h3 id="Aprendizaje_activo_construir_una_estructura_de_formulario">Aprendizaje activo: construir una estructura de formulario</h3>
-
-<p>Pongamos en práctica estas ideas y creemos un formulario un poco más complicado: un formulario de pago. Este formulario contendrá una serie de tipos de control que quizás aún no comprendas. No te preocupes por esto por ahora; en el artículo siguiente descubrirás cómo funcionan (<a href="/es/docs/Learn/HTML/Forms/The_native_form_widgets">Los controles básicos de formulario originales</a>). Por ahora, lee con detenimiento las descripciones y sigue las instrucciones, y empieza a formarte una idea de qué elementos de delimitación se utilizan para estructurar el formulario y por qué.</p>
-
-<ol>
- <li>Para comenzar, haz una copia local de nuestro <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">archivo de plantilla en blanco</a> y el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/payment-form.css">CSS de nuestro formulario de pago</a> en un nuevo directorio de tu ordenador.</li>
- <li>Añade dentro del elemento HTML {{htmlelement ("head")}} la línea siguiente para aplicar el CSS al HTML:
-  <pre class="brush: html notranslate">&lt;link href="payment-form.css" rel="stylesheet"&gt;</pre>
- </li>
- <li>A continuación, añade el elemento externo {{htmlelement ("form")}} para crear tu formulario:
-  <pre class="brush: html notranslate">&lt;form&gt;
-
-&lt;/form&gt;</pre>
- </li>
- <li>Añade un encabezado y un párrafo dentro de las etiquetas <code>&lt;form&gt;</code>&gt; para informar a los usuarios cómo se marcan los campos obligatorios:
-  <pre class="brush: html notranslate">&lt;h1&gt;Forma de pago&lt;/h1&gt;
-&lt;p&gt;Los campos obligatorios van seguidos de &lt;strong&gt; &lt;abbr title = "required"&gt; * &lt;/abbr&gt; &lt;/strong&gt;.&lt;/p&gt;</pre>
- </li>
- <li>A continuación añadimos al formulario una sección de código más grande, justo debajo de nuestra entrada anterior. Aquí verás que delimitamos con un elemento {{htmlelement ("section")}} independiente los campos con la información de contacto. Además, hay un conjunto de dos botones de opción, cada uno de los cuales colocamos dentro de su elemento de lista ({{htmlelement ("li")}}) propio. También hay dos entradas de texto estándar {{htmlelement ("input")}} y sus elementos {{htmlelement ("label")}} asociados, cada uno anidado dentro de un elemento {{htmlelement ("p")}} y una entrada de texto para introducir una contraseña. Añade este código a tu formulario:
-  <pre class="brush: html notranslate">&lt;section&gt;
-    &lt;h2&gt;Información de contacto&lt;/h2&gt;
-    &lt;fieldset&gt;
-      &lt;legend&gt;Título&lt;/legend&gt;
-      &lt;ul&gt;
-          &lt;li&gt;
-            &lt;label for="title_1"&gt;
-              &lt;input type="radio" id="title_1" name="title" value="K" &gt;
-              Rey
-            &lt;/label&gt;
-          &lt;/li&gt;
-          &lt;li&gt;
-            &lt;label for="title_2"&gt;
-              &lt;input type="radio" id="title_2" name="title" value="Q"&gt;
-              Reina
-            &lt;/label&gt;
-          &lt;/li&gt;
-          &lt;li&gt;
-            &lt;label for="title_3"&gt;
-              &lt;input type="radio" id="title_3" name="title" value="J"&gt;
-              Bufón
-            &lt;/label&gt;
-          &lt;/li&gt;
-      &lt;/ul&gt;
-    &lt;/fieldset&gt;
-    &lt;p&gt;
-      &lt;label for="name"&gt;
-        &lt;span&gt;Nombre:&lt;/span&gt;
-        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
-      &lt;/label&gt;
-      &lt;input type="text" id="name" name="username"&gt;
-    &lt;/p&gt;
-    &lt;p&gt;
-      &lt;label for="mail"&gt;
-        &lt;Span&gt;Correo electrónico:&lt;/ span&gt;
-        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
-      &lt;/label&gt;
-      &lt;input type="email" id="mail" name="usermail"&gt;
-    &lt;/p&gt;
-    &lt;p&gt;
-      &lt;label for="pwd"&gt;
-        &lt;span&gt;Contraseña:&lt;/span&gt;
-        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
-      &lt;/label&gt;
-      &lt;input type="password" id="pwd" name="password"&gt;
-    &lt;/p&gt;
-&lt;/section&gt;</pre>
- </li>
- <li>La segunda <code>&lt;section&gt;</code> de nuestro formulario es la información de pago. Hay tres controles diferentes, junto con sus etiquetas, cada uno contenido dentro de un elemento <code>&lt;p&gt;</code>. El primero es un menú desplegable ({{htmlelement ("select")}}) para seleccionar el tipo de tarjeta de crédito. El segundo es un elemento <code>&lt;input&gt;</code> de tipo <code>tel</code>, para introducir un número de tarjeta de crédito. Si bien podríamos haber usado el tipo <code>number</code>, no queremos una interfaz de usuario con control de número. El último es un elemento <code>&lt;input&gt;</code> de tipo <code>date</code>, para introducir la fecha de caducidad de la tarjeta; aparecerá como un control de selección de fecha en navegadores compatibles, y como una entrada de texto normal en navegadores no compatibles. Estos tipos de entrada más nuevos volverán a aparecer en el artículo <a href="/en-US/docs/Learn/Forms/HTML5_input_types">Tipos de entrada HTML5</a>.<br>
-  <br>
-  Introduce los datos siguientes a continuación de la sección anterior:
-  <pre class="brush: html notranslate">&lt;section&gt;
-    &lt;h2&gt;Información de pago&lt;/h2&gt;
-    &lt;p&gt;
-      &lt;label for="card"&gt;
-        &lt;span&gt;Tipo de tarjeta:&lt;/span&gt;
-      &lt;/label&gt;
-      &lt;select id="card" name="usercard"&gt;
-        &lt;option value="visa"&gt;Visa&lt;/option&gt;
-        &lt;option value="mc"&gt;Mastercard&lt;/option&gt;
-        &lt;option value="amex"&gt;American Express&lt;/option&gt;
-      &lt;/select&gt;
-    &lt;/p&gt;
-    &lt;p&gt;
-      &lt;label for="number"&gt;
-        &lt;span&gt;Número de tarjeta:&lt;/span&gt;
-        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
-      &lt;/label&gt;
-      &lt;input type="tel" id="number" name="cardnumber"&gt;
-    &lt;/p&gt;
-    &lt;p&gt;
-      &lt;label for="date"&gt;
-        &lt;span&gt;Fecha de caducidad:&lt;/span&gt;
-        &lt;strong&gt;&lt;abbr title="required"&gt;*&lt;/abbr&gt;&lt;/strong&gt;
-        &lt;em&gt;el formato mm/aa&lt;/em&gt;
-      &lt;/label&gt;
-      &lt;input type="date" id="date" name="expiration"&gt;
-    &lt;/p&gt;
-&lt;/section&gt;</pre>
- </li>
- <li>La última sección que añadimos es mucho más simple y contiene solo un {{htmlelement ("button")}} de tipo <code>submit</code>, para enviar los datos del formulario. Añádelo al final de tu formulario:
-  <pre class="brush: html notranslate">&lt;p&gt; &lt;button type="submit"&gt;Validar el pago&lt;/button&gt; &lt;/p&gt;</pre>
- </li>
-</ol>
-
-<p>Debajo puedes ver en acción el formulario terminado (también lo encontrarás en GitHub; consulta el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/html-form-structure/payment-form.html">código fuente</a> de nuestro payment-form.html y <a href="https://mdn.github.io/learning-area/html/forms/html-form-structure/payment-form.html">ejecútalo en vivo</a>):</p>
-
-<p>{{EmbedLiveSample("A_payment_form","100%",620, "", "/en-US/Learn/Forms/How_to_structure_a_web_form/Example")}}</p>
-
-<h2 id="¡Prueba_tus_habilidades!">¡Prueba tus habilidades!</h2>
-
-<p>Has llegado al final de este artículo pero ¿puedes recordar la información más importante? Puedes encontrar pruebas adicionales para comprobar que has comprendido la información antes de continuar — visita <a class="external external-icon" href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Forms/Test_your_skills:_Form_structure" rel="noopener">Prueba tus habilidades: Estructura de formularios</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Ahora tienes todos los conocimientos necesarios para estructurar adecuadamente tus formularios web. Expondremos muchas de las características que se presentan aquí en los artículos siguientes, y el próximo artículo analizará con más detalle el uso de todos los diferentes tipos de controles de formulario que vas a querer usar para recopilar la información de tus usuarios.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="http://www.alistapart.com/articles/sensibleforms/" rel="external" title="http://www.alistapart.com/articles/sensibleforms/">A List Apart: <em>Sensible Forms: A Form Usability Checklist</em></a></li>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/Forms/Your_first_form", "Learn/Forms/Basic_native_form_controls", "Learn/Forms")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Tu primer formulario HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">Los controles básicos de formulario originales</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/HTML5_input_types">Tipos de entrada HTML5</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Additional_form_controls">Controles de formulario adicionales</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/UI_pseudo-classes">Pseudoclasses UI</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Aplicar estilo a formularios HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Validación de datos en un formulario</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
-</ul>
-
-<h3 id="Temas_avanzados">Temas avanzados</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Enviar formularios con JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">Cómo crear controles de formulario personalizados</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">Formularios HTML en navegadores antiguos</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Cuestiones avanzadas de aplicación de estilo para formularios HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de los controles de formulario</a> según su código propietario</li>
-</ul>
diff --git a/files/es/learn/html/forms/index.html b/files/es/learn/html/forms/index.html
deleted file mode 100644
index c607c7993a..0000000000
--- a/files/es/learn/html/forms/index.html
+++ /dev/null
@@ -1,366 +0,0 @@
----
-title: Formularios HTML
-slug: Learn/HTML/Forms
-tags:
-  - Featured
-  - Forms
-  - Formulario(2)
-  - Guide
-  - Guía
-  - HTML
-  - NeedsTranslation
-  - TopicStub
-  - Web
-translation_of: Learn/Forms
----
-<p><span class="seoSummary">Esta guía está constituida por una serie de artículos que te ayudarán a dominar los formularios en HTML.   </span>El formulario HTML  es una herramienta  cuya finalidad es interactuar con el usuario; sin embargo, debido a razones históricas y técnicas, no siempre resulta obvio como explotar su enorme potencial. En esta guía, cubriremos todos los aspectos de los formularios HTML, desde su estructura hasta su estilo, desde la manipulación de sus datos hasta los <em>widgets</em> personalizados. ¡Aprenderás a disfrutar de las grandes prestaciones que nos brindan!</p>
-
-<h2 id="Artículos">Artículos</h2>
-
-<ol>
- <li><a href="/en-US/docs/HTML/Forms/My_first_HTML_form" title="/en-US/docs/HTML/Forms/My_first_HTML_form">Mi primer formulario HTML</a></li>
- <li><a href="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form" title="/en-US/docs/HTML/Forms/How_to_structure_an_HTML_form"><span>Cómo estructurar un formulario HTML</span></a></li>
- <li><a href="/en-US/docs/HTML/Forms/The_native_form_widgets" title="/en-US/docs/HTML/Forms/The_native_form_widgets"><span>Los <em>widgets</em> nativos de formulario</span></a></li>
- <li>CSS para formularios HTML
-  <ol>
-   <li><a href="/en-US/docs/HTML/Forms/Styling_HTML_forms" title="/en-US/docs/HTML/Forms/Styling_HTML_forms"><span>Aplicando estilos a formularios HTML</span></a></li>
-   <li><a href="/en-US/docs/Web/Guide/HTML/Forms/Advanced_styling_for_HTML_forms" title="/en-US/docs/Advanced_styling_for_HTML_forms">Estilos avanzados para formularios HTML</a></li>
-   <li><a href="/en-US/docs/Property_compatibility_table_for_form_widgets" title="/en-US/docs/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de propiedades para <em>widgets</em> de formulario</a></li>
-  </ol>
- </li>
- <li><a href="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data"><span>Enviando y recibiendo datos</span></a></li>
- <li><a href="/en-US/docs/HTML/Forms/Data_form_validation" title="/en-US/docs/HTML/Forms/Data_form_validation">Validación de los datos del formulario</a></li>
- <li><a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets">Cómo crear un <em>widget</em> de formulario personalizado</a></li>
- <li><a href="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript" title="/en-US/docs/HTML/Forms/Sending_forms_through_JavaScript">Enviando formularios mediante JavaScript</a>
-  <ol>
-   <li><a href="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects" title="/en-US/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects">Usando el objeto FormData</a></li>
-  </ol>
- </li>
- <li><a href="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers" title="/en-US/docs/HTML/Forms/HTML_forms_in_legacy_browsers">Formularios HTML en navegadores antiguos</a></li>
-</ol>
-
-<h2 id="Documentación_HTML">Documentación HTML</h2>
-
-<h3 id="HTML_Elements">HTML Elements</h3>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Elemento</th>
-   <th scope="col">Interfaz DOM relacionada</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("button")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLButtonElement")}}</td>
-   <td style="vertical-align: top;">El elemento  <code>button</code> representa un boton clickeable.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("datalist")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLDataListElement")}}</td>
-   <td style="vertical-align: top;">El elemento <span style="font-family: courier new;">datalist</span> element contiene un conjunto de elementos{{ HTMLElement("option") }} que representan posibles opciones para el valor de otros elementos del formulario.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("fieldset")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLFieldSetElement")}}</td>
-   <td style="vertical-align: top;">El  <span style="font-family: courier new;">fieldset</span> se usa para agrupar distintos elementos dentro de un formulario.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("form")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLFormElement")}}</td>
-   <td style="vertical-align: top;">El elemento  <code>form </code>representa una seccion del documento html que contiene elementos interactivos a traves de los cuales se le permite al usuario enviar informacion hacia un servidor web.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("input")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLInputElement")}}</td>
-   <td style="vertical-align: top;">El elemento   <code>input</code> es usado para crear controles interactivos para los formularios.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("keygen")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLKeygenElement")}}</td>
-   <td style="vertical-align: top;">El elemento <code>keygen</code> existe para facilitar la generación de llaves u el envío de las llaves publicas como parte de un formulario HTML.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("label")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLLabelElement")}}</td>
-   <td style="vertical-align: top;">El  <code>label</code> determina un título para un item de la interfaz del usuario.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("legend")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLLegendElement")}}</td>
-   <td style="vertical-align: top;">El elemento <code>legend</code>  representa una etiqueta para el contenido del elemento {{ HTMLElement("fieldset") }} que lo contiene.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("meter")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLMeterElement")}}</td>
-   <td style="vertical-align: top;">EL elemento <code>meter</code>  representa un valor escalar dentro de un rango conocido, o un valor fraccional.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("optgroup")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLOptGroupElement")}}</td>
-   <td style="vertical-align: top;">
-    <p>El elemento <code>optgroup</code> crea un grupo de opciones dentro de un elemento {{ HTMLElement("select") }} .</p>
-   </td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("option")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLOptionElement")}}</td>
-   <td style="vertical-align: top;">El elemento<em> </em><code>option<em> </em></code>es usado para crear un control de opcion que representa un item dentro de alguno de los elementos {{ HTMLElement("select") }}, {{ HTMLElement("optgroup") }} o {{ HTMLElement("datalist") }} .</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("output")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLOutputElement")}}</td>
-   <td style="vertical-align: top;">El elemento <code>output</code> representa un resultado de un calculo.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("progress")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLProgressElement")}}</td>
-   <td style="vertical-align: top;">El elemento <code>progress</code> es usado para mostrar el progreso de la realización de una tarea.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("select")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLSelectElement")}}</td>
-   <td style="vertical-align: top;">El elemento <code>select</code> representa el control que presenta un menu de opciones.</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{HTMLElement("textarea")}}</td>
-   <td style="vertical-align: top;">{{domxref("HTMLTextAreaElement")}}</td>
-   <td style="vertical-align: top;">EL elemento <code>textarea</code> representa un campo multi-linea de edicion de text plano.</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota:</strong> Todos los elementos de formulario, al igual que el resto de elementos HTML, soportan la interfaz DOM {{domxref("HTMLElement")}}.</p>
-</div>
-
-<h3 id="HTML_Attributes">HTML Attributes</h3>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th>Nombre del atributo</th>
-   <th>Elementos</th>
-   <th>Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>accept</td>
-   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
-   <td>Lista de tipos que acepta el servidor, típicamente un tipo de fichero.</td>
-  </tr>
-  <tr>
-   <td style="white-space: nowrap;">accept-charset</td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>Lista de <em>charsets </em>(conjuntos de caracteres) aceptados.</td>
-  </tr>
-  <tr>
-   <td>action</td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>La URI del programa con el que procesar la información enviada a mediante el formulario.</td>
-  </tr>
-  <tr>
-   <td>autocomplete</td>
-   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
-   <td>Indica si los controles en este formulario serán o no autocompletados por el navegador</td>
-  </tr>
-  <tr>
-   <td>autofocus</td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>El elemento debería poseer el foco automáticamente tras cargar  la página.</td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <td>challenge</td>
-   <td>{{ HTMLElement("keygen") }}</td>
-   <td>Una cadena de comprobación que es enviada junto con la clave pública.</td>
-  </tr>
-  <tr>
-   <td>checked</td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Indica si el elemento debe estar seleccionado (checked) tras cargar la página.</td>
-  </tr>
-  <tr>
-   <td>cols</td>
-   <td>{{ HTMLElement("textarea") }}</td>
-   <td>Define el número de columnas en un elemento de tipo textarea.</td>
-  </tr>
-  <tr>
-   <td>data</td>
-   <td>{{ HTMLElement("object") }}</td>
-   <td>Especifica la URL del recurso.</td>
-  </tr>
-  <tr>
-   <td>dirname</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>disabled</td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica si el usuario puede o no interactuar con el elemento.</td>
-  </tr>
-  <tr>
-   <td>enctype</td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>Define el tipo de contenido del formulario cuando el método de envío es POST.</td>
-  </tr>
-  <tr>
-   <td>for</td>
-   <td>{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td>
-   <td>
-    <p>Establece una asociación con otros elementos</p>
-   </td>
-  </tr>
-  <tr>
-   <td>form</td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica el elemento <strong>form</strong> que contiene este elemento.</td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <td>high</td>
-   <td>{{ HTMLElement("meter") }}</td>
-   <td>Indicates the lower bound of the upper range.</td>
-  </tr>
-  <tr>
-   <td>keytype</td>
-   <td>{{ HTMLElement("keygen") }}</td>
-   <td>Especifica el tipo de clave generada.</td>
-  </tr>
-  <tr>
-   <td>list</td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Determina una lista de opciones predefinidas para sugerir al usuario.</td>
-  </tr>
-  <tr>
-   <td>low</td>
-   <td>{{ HTMLElement("meter") }}</td>
-   <td>Indicates the upper bound of the lower range.</td>
-  </tr>
-  <tr>
-   <td>max</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
-   <td>Indica el máximo valor permitido.</td>
-  </tr>
-  <tr>
-   <td>maxlength</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Define el máximo número de caracteres permitidos en el elemento.</td>
-  </tr>
-  <tr>
-   <td>method</td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>
-    <p>Define qué método HTTP se usará al enviar el formulario. puede ser <strong>GET</strong> (por defecto) o <strong>POST</strong></p>
-   </td>
-  </tr>
-  <tr>
-   <td>min</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td>
-   <td>Indica el mínimo valor permitido.</td>
-  </tr>
-  <tr>
-   <td>multiple</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
-   <td>Indica si mútiples valores pueden ser introducidos en un input de tipo email o file.</td>
-  </tr>
-  <tr>
-   <td>name</td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Especifica el nombre del elemento. Este nombre se usará asociado al dato que contiene al enviar al servidor el formulario.</td>
-  </tr>
-  <tr>
-   <td>novalidate</td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>Indica que el formulario no debería validarse al momento de ser enviado.</td>
-  </tr>
-  <tr>
-   <td>optimum</td>
-   <td>{{ HTMLElement("meter") }}</td>
-   <td>Indica el valor numérico óptimo.</td>
-  </tr>
-  <tr>
-   <td>pattern</td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Establece la expresión regular con la que validar el valor del elemento.</td>
-  </tr>
-  <tr>
-   <td>placeholder</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Proporciona una pista al usuario de lo que el campo debe contener. Se muestra cuando el campo está vacío.</td>
-  </tr>
-  <tr>
-   <td>readonly</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica si el elemento se puede o no editar.</td>
-  </tr>
-  <tr>
-   <td>required</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Cuando un campo del formulario es requerido, el usuario no puede dejarlo vacío.</td>
-  </tr>
-  <tr>
-   <td>rows</td>
-   <td>{{ HTMLElement("textarea") }}</td>
-   <td>Defines the number of rows in a textarea.</td>
-  </tr>
-  <tr>
-   <td>selected</td>
-   <td>{{ HTMLElement("option") }}</td>
-   <td>En una lista de selección, la opción con el atributo selected será la que está seleccionada por defecto</td>
-  </tr>
-  <tr>
-   <td>size</td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
-   <td>Defina la anchura del elemento (en píxeles). Si el elemento es de tipo <strong>text</strong> o <strong>password</strong> el ancho se referirá al número de caracteres.</td>
-  </tr>
-  <tr>
-   <td>src</td>
-   <td>{{ HTMLElement("img") }}</td>
-   <td>El URL del recurso</td>
-  </tr>
-  <tr>
-   <td>step</td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Determina el incremento de cada paso con el que se cubre un rango desde un valor mínimo hasta un valor máximo.</td>
-  </tr>
-  <tr>
-   <td>target</td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>type</td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}</td>
-   <td>Determina el tipo del elemento.</td>
-  </tr>
-  <tr>
-   <td>usemap</td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>value</td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
-   <td>Establece el valor actual del elemento.</td>
-  </tr>
-  <tr>
-   <td>wrap</td>
-   <td>{{ HTMLElement("textarea") }}</td>
-   <td>Cuando un texto tiene una longitud mayor que el ancho del elemento sobre el que se muestra, determina si el elemento debe simular saltos de línea para que todo el texto quede visible en el elemento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Referencia_a_la_normativa">Referencia a la normativa</h3>
-
-<ul>
- <li><a href="http://www.w3.org/html/wg/drafts/html/master/forms.html#forms" lang="en" rel="external" title="http://www.w3.org/TR/html5/forms.html">W3C HTML 5.1 Specification (Forms)</a></li>
- <li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms" rel="external" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#forms">WHATWG HTML Living Standard (Forms)</a></li>
-</ul>
diff --git a/files/es/learn/html/forms/property_compatibility_table_for_form_controls/index.html b/files/es/learn/html/forms/property_compatibility_table_for_form_controls/index.html
deleted file mode 100644
index 115b5580fe..0000000000
--- a/files/es/learn/html/forms/property_compatibility_table_for_form_controls/index.html
+++ /dev/null
@@ -1,2003 +0,0 @@
----
-title: Tabla de compatibilidad de propiedades CSS para controles de formulario
-slug: Learn/HTML/Forms/Property_compatibility_table_for_form_controls
-translation_of: Learn/Forms/Property_compatibility_table_for_form_controls
----
-<div>{{learnsidebar}}</div>
-
-<p class="summary">Las siguientes tablas de compatibilidad intentan resumir el estado del soporte de CSS para formularios HTML. Debido a la complejidad de los formularios CSS y HTML, estas tablas no se pueden considerar una referencia perfecta. Sin embargo, le darán una buena idea de lo que se puede y no se puede hacer, lo que le ayudará al aprender a hacer las cosas.</p>
-
-<h2 id="Cómo_leer_las_tablas">Cómo leer las tablas</h2>
-
-<h3 id="Valores">Valores</h3>
-
-<p>Para cada propiedad, hay cuatro valores posibles:</p>
-
-<dl>
- <dt>Si</dt>
- <dd>Existe un soporte razonablemente consistente para la propiedad en todos los navegadores. Es posible que aún enfrente efectos secundarios extraños en ciertos casos extremos.</dd>
- <dt>Parcial</dt>
- <dd>Si bien la propiedad funciona, con frecuencia puede enfrentar efectos secundarios extraños o inconsistencias. Probablemente debería evitar estas propiedades a menos que primero domine esos efectos secundarios.</dd>
- <dt>No</dt>
- <dd>La propiedad simplemente no funciona o es tan inconsistente que no es confiable.</dd>
- <dt>n.a.</dt>
- <dd>La propiedad no tiene ningún significado para este tipo de widget.</dd>
-</dl>
-
-<h3 id="Representación">Representación</h3>
-
-<p>Para cada propiedad hay dos representaciones posibles:</p>
-
-<dl>
- <dt>N (Normal)</dt>
- <dd>Indica que la propiedad se aplica tal cual</dd>
- <dt>T (Retocada)</dt>
- <dd>Indica que la propiedad se aplica con la regla adicional como se muestra a continuación:</dd>
-</dl>
-
-<pre class="brush: css notranslate">* {
-  /* Turn off the native look and feel */
-  -webkit-appearance: none;
-  appearance: none;
-
-/* for Internet Explorer */
-  background: none;
-}</pre>
-
-<h2 id="Tablas_de_compatibilidad">Tablas de compatibilidad</h2>
-
-<h3 id="Comportamientos_globales">Comportamientos globales</h3>
-
-<p>Algunos comportamientos son comunes a muchos navegadores a nivel global::</p>
-
-<dl>
- <dt>{{cssxref("border")}}, {{cssxref("background")}}, {{cssxref("border-radius")}}, {{cssxref("height")}}</dt>
- <dd>El uso de una de estas propiedades puede desactivar parcial o totalmente la apariencia nativa de los widgets en algunos navegadores. Tenga cuidado cuando los use.</dd>
- <dt>{{cssxref("line-height")}}</dt>
- <dd>Esta propiedad se admite de forma inconsistente en todos los navegadores y debe evitarla.</dd>
- <dt>{{cssxref("text-decoration")}}</dt>
- <dd>Esta propiedad no es compatible con el navegador Opera en widgets de formulario.</dd>
- <dt>{{cssxref("text-overflow")}}</dt>
- <dd>Opera, Safari, y IE9 no admiten esta propiedad en widgets de formulario.</dd>
- <dt>{{cssxref("text-shadow")}}</dt>
- <dd>Opera no admite {{cssxref("text-shadow")}} en widgets de formularios e IE9 no lo admite en absoluto.</dd>
-</dl>
-
-<h3 id="Text_fields">Text fields</h3>
-
-<p>See the <code>{{htmlelement("input/text", "text")}}</code>, <code>{{htmlelement("input/search", "search")}}</code>, and <code>{{htmlelement("input/password", "password")}}</code> input types.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields.</li>
-     <li>On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields.</li>
-     <li>On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields.</li>
-     <li>On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}<sup>[1]</sup></th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>If the {{cssxref("border-color")}} property is not set, some WebKit based browsers will apply the {{cssxref("color")}} property to the border as well as the font on <code>{{htmlelement("textarea")}}</code>s.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>See the note about {{cssxref("line-height")}}</td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td>See the note about Opera</td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 supports this property only on <code>{{htmlelement("textarea")}}</code>s, whereas Opera only supports it on single line text fields.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields. On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>WebKit browsers (mostly on Mac OSX and iOS) use the native look &amp; feel for the search fields. Therefore, it's required to use <code>-webkit-appearance:none</code> to be able to apply this property to search fields. On Windows 7, Internet Explorer 9 does not apply the border unless <code>background:none</code> is applied.</li>
-     <li>On Opera the {{cssxref("border-radius")}} property is applied only if an explicit border is set.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Buttons">Buttons</h3>
-
-<p>See the <code>{{htmlelement("input/button", "button")}}</code>,  <code>{{htmlelement("input/submit", "submit")}}</code>, and <code>{{htmlelement("input/reset", "reset")}}</code> input types and the <code>{{htmlelement("button")}}</code> element.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>This property is not applied on WebKit based browsers on Mac OSX or iOS.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>This property is not applied on WebKit based browsers on Mac OSX or iOS.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>See the note about {{cssxref("line-height")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>On Opera the {{cssxref("border-radius")}} property is applied only if an explicit border is set.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Number">Number</h3>
-
-<p>See the  <code>{{htmlelement("input/number", "number")}}</code> input type. There is no standard way to change the style of spinners used to change the value of the field, with the spinners on Safari being outside the field.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>On Opera, the spinners are zoomed in, which can hide the content of the field.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>On Opera, the spinners are zoomed in, which can hide the content of the field.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>See the note about {{cssxref("line-height")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td colspan="1" rowspan="3">
-    <p>Supported but there is too much inconsistency between browsers to be reliable.</p>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Check_boxes_and_radio_buttons">Check boxes and radio buttons</h3>
-
-<p>See the <code>{{htmlelement("input/checkbox", "checkbox")}}</code> and <code>{{htmlelement("input/radio", "radio")}}</code> input types.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Some browsers add extra margins and others stretch the widget.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Some browsers add extra margins and others stretch the widget.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Select_boxes_single_line">Select boxes (single line)</h3>
-
-<p>See the <code>{{htmlelement("select")}}</code>,  <code>{{htmlelement("optgroup")}}</code> and  <code>{{htmlelement("option")}}</code> elements.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>This property is okay on the <code>{{htmlelement("select")}}</code> element, but it cannot be the case on the <code>{{htmlelement("option")}}</code> or <code>{{htmlelement("optgroup")}}</code> elements.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[2]</sup></td>
-   <td>
-    <ol>
-     <li>The property is applied, but in an inconsistent way between browsers on Mac OSX.</li>
-     <li>The property is well applied on the <code>{{htmlelement("select")}}</code> element, but is inconsistently handled on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>On Mac OSX, WebKit based browsers do not support this property on native widgets and they, along with Opera, do not support it at all on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>On Mac OSX, WebKit based browsers do not support this property on native widgets and they, along with Opera, do not support it at all on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 does not support this property on <code>{{htmlelement("select")}}</code>, <code>{{htmlelement("option")}}</code>, and <code>{{htmlelement("optgroup")}}</code> elements; WebKit based browsers on Mac OSX do not support this property on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 on Windows 7 and WebKit based browsers on Mac OSX do not support this property on this widget.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Only Firefox provides full support for this property. Opera does not support this property at all and other browsers only support it on the <code>{{htmlelement("select")}}</code> element.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td>
-    <ol>
-     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1][2]</sup></td>
-   <td>
-    <ol>
-     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td colspan="1" rowspan="3">
-    <ol>
-     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Note Firefox does not provide any way to change the down arrow on the <code>{{htmlelement("select")}}</code> element.</p>
-
-<h3 id="Select_boxes_multiline">Select boxes (multiline)</h3>
-
-<p>See the <code>{{htmlelement("select")}}</code>, <code>{{htmlelement("optgroup")}}</code> and  <code>{{htmlelement("option")}}</code> elements and the <a href="/en-US/docs/Web/HTML/Attributes/size"><code>size</code> attribute</a>.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Opera does not support {{cssxref("padding-top")}} and {{cssxref("padding-bottom")}} on the <code>{{htmlelement("select")}}</code> element.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>See the note about {{cssxref("line-height")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 does not support this property on <code>{{htmlelement("select")}}</code>, <code>{{htmlelement("option")}}</code>, and <code>{{htmlelement("optgroup")}}</code> elements; WebKit based browsers on Mac OSX do not support this property on <code>{{htmlelement("option")}}</code> and <code>{{htmlelement("optgroup")}}</code> elements.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 on Windows 7 and WebKit based browser on Mac OSX do not support this property on this widget.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Only supported by Firefox and IE9+.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Most of the browsers only support this property on the <code>{{htmlelement("select")}}</code> element.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>On Opera the {{cssxref("border-radius")}} property is applied only if an explicit border is set.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Datalist">Datalist</h3>
-
-<p>See the <code>{{htmlelement("datalist")}}</code> and <code>{{htmlelement("input")}}</code> elements and the <a href="/en-US/docs/Web/HTML/Attributes/list"><code>list</code> attribute</a>.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="File_picker">File picker</h3>
-
-<p>See the <code>{{htmlelement("input/file", "file")}}</code> input type.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Many browsers apply this property to the select button.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>It acts more or less like an extra left margin outside the widget.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Date_pickers">Date pickers</h3>
-
-<p>See the <code>{{htmlelement("input/date", "date")}}</code> and <code>{{htmlelement("input/time", "time")}}</code> input types. Many properties are supported, but there is too much inconstency between browsers to be reliable.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Color_pickers">Color pickers</h3>
-
-<p>See the <code>{{htmlelement("input/color", "color")}}</code> input type:</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>Opera handles this like a select widget with the same restriction.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>Opera handles this like a select widget with the same restriction.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td colspan="1" rowspan="3">
-    <ol>
-     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Meters_and_progress">Meters and progress</h3>
-
-<p>See the <code>{{htmlelement("meter")}}</code> and <code>{{htmlelement("progress")}}</code> elements:</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Chrome hides the <code>{{htmlelement("progress")}}</code> and <code>{{htmlelement("meter")}}</code> element when the {{cssxref("padding")}} property is applied on a tweaked element.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td colspan="1" rowspan="3">
-    <ol>
-     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Range">Range</h3>
-
-<p>See the <code>{{htmlelement("input/range", "range")}}</code> input type. There is no standard way to change the style of the range grip and Opera has no way to tweak the default rendering of the range widget.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td>
-    <ol>
-     <li>Chrome and Opera add some extra space around the widget, whereas Opera on Windows 7 stretches the range grip.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td>
-    <ol>
-     <li>The {{cssxref("padding")}} is applied, but has no visual effect.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td colspan="1" rowspan="3">
-    <ol>
-     <li>Supported, but there is too much inconsistency between browsers to be reliable.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 153, 153); vertical-align: top;">No<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Image_buttons">Image buttons</h3>
-
-<p>See the <code>{{htmlelement("input/image", "image")}}</code> input type:</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col" style="text-align: center;">N</th>
-   <th scope="col" style="text-align: center;">T</th>
-   <th scope="col">Note</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>CSS box model</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("width")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("height")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("border")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("margin")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="vertical-align: top;">{{cssxref("padding")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Text and font</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("color")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("font")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("letter-spacing")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-align")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-decoration")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-indent")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-overflow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-shadow")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("text-transform")}}</th>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td style="text-align: center; vertical-align: top;">N.A.</td>
-   <td></td>
-  </tr>
- </tbody>
- <tbody>
-  <tr>
-   <th colspan="4" scope="col"><em>Border and background</em></th>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("background")}}</th>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td style="text-align: center; background-color: rgb(204, 255, 102); vertical-align: top;">Yes</td>
-   <td colspan="1"></td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("border-radius")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td colspan="1">
-    <ol>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row" style="white-space: nowrap; vertical-align: top;">{{cssxref("box-shadow")}}</th>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td style="text-align: center; background-color: rgb(255, 255, 102); vertical-align: top;">Partial<sup>[1]</sup></td>
-   <td colspan="1">
-    <ol>
-     <li>IE9 does not support this property.</li>
-    </ol>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="See_also">See also</h2>
-
-<h3 id="Learning_path">Learning path</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Your first HTML form</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">How to structure an HTML form</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">The native form widgets</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/HTML5_input_types">HTML5 input types</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Additional_form_controls">Additional form controls</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/UI_pseudo-classes">UI pseudo-classes</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Styling HTML forms</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Form data validation</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Sending form data</a></li>
-</ul>
-
-<h3 id="Advanced_Topics">Advanced Topics</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Sending forms through JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">How to build custom form widgets</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">HTML forms in legacy browsers</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Property compatibility table for form widgets</a></li>
-</ul>
diff --git a/files/es/learn/html/forms/prueba_tus_habilidades_colon__controles_html5/index.html b/files/es/learn/html/forms/prueba_tus_habilidades_colon__controles_html5/index.html
deleted file mode 100644
index b73c8d4442..0000000000
--- a/files/es/learn/html/forms/prueba_tus_habilidades_colon__controles_html5/index.html
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: 'Prueba tus habilidades: controles HTML5'
-slug: 'Learn/HTML/Forms/Prueba_tus_habilidades:_controles_HTML5'
-tags:
-  - Aprendizaje
-  - Evaluación
-  - Formulário
-  - HTML5
-  - Principiante
-translation_of: 'Learn/Forms/Test_your_skills:_HTML5_controls'
----
-<div>{{learnsidebar}}</div>
-
-<p>El objetivo de esta prueba es evaluar si has comprendido nuestro artículo <a href="/en-US/docs/Learn/Forms/HTML5_input_types">The HTML5 input types</a>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes intentar resolver esta prueba en los editores interactivos más abajo, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a> para trabajar en las tareas.<br>
- <br>
- Si te atascas, pide ayuda — mira la sección <a href="https://wiki.developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces#Evaluaci%C3%B3n_o_ayuda_adicional">Evaluación o ayuda adicional</a> al final de esta página.</p>
-</div>
-
-<h2 id="Controles_HTML5_1">Controles HTML5 1</h2>
-
-<p>Primero exploraremos algunos de los tipos nuevos de <code>input</code> en HTML5. Crea las etiquetas <code>input</code> apropiadas para que un usuario actualice sus detalles para:</p>
-
-<ol>
- <li>Email</li>
- <li>Website</li>
- <li>Número de teléfono</li>
- <li>Color favorito</li>
-</ol>
-
-<p>Intenta actualizar el código en vivo más abajo para retrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/html5-controls/html5-controls1.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="/en-US/docshttps://github.com/mdn/learning-area/blob/master/html/forms/tasks/html5-controls/html5-controls1-download.html">Descarga el código inicial de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Controles_HTML5_2">Controles HTML5 2</h2>
-
-<p>A continuación, queremos que implementes un control deslizante para permitir al usuario escoger el número máximo de personas para invitar a su fiesta.</p>
-
-<ol>
- <li>Implemente un control deslizante básico que acompañe a la etiqueta provista.</li>
- <li>Establezca un valor minimo de 1, uno máximo de 30 y un valor inicial de 10.</li>
- <li>Crea un elemento de salida correspondiente para poner el valor actual del deslizador. Asígnale la clase invite-output, y asocialo semanticamente con le entrada. Si haces esto correctamente, el JavaScript incluido en la página automáticamente actualizará el valor cuando se deslice el control.</li>
-</ol>
-
-<p>Intenta actualizar el código en vivo más abajo para retrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/html5-controls/html5-controls2.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/html5-controls/html5-controls2-download.html">Descarga el código inicial de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
-
-<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
-
-<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
-
-<ol>
- <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
- <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
-  <ul>
-   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de controles HTML5 1".</li>
-   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
-   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
-   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
-  </ul>
- </li>
-</ol>
diff --git a/files/es/learn/html/forms/prueba_tus_habilidades_colon__otros_controles/index.html b/files/es/learn/html/forms/prueba_tus_habilidades_colon__otros_controles/index.html
deleted file mode 100644
index 1496025a8d..0000000000
--- a/files/es/learn/html/forms/prueba_tus_habilidades_colon__otros_controles/index.html
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: 'Prueba tus habilidades: Otros controles'
-slug: 'Learn/HTML/Forms/Prueba_tus_habilidades:_Otros_controles'
-translation_of: 'Learn/Forms/Test_your_skills:_Other_controls'
----
-<div>{{learnsidebar}}</div>
-
-<p>El objetivo de esta pueba de habilidad es evaluar si has comprendido nuestro artículo <a href="/en-US/docs/Learn/Forms/Other_form_controls">Otros controles de formulario</a>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes intentar resolver esta prueba en los editores interactivos más abajo, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a> para trabajar en las tareas.<br>
- <br>
- Si te atascas, pide ayuda — mira la sección <a href="https://wiki.developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces#Evaluaci%C3%B3n_o_ayuda_adicional">Evaluación o ayuda adicional</a> al final de esta página.</p>
-</div>
-
-<h2 id="Otros_controles_1">Otros controles 1</h2>
-
-<p>En nuestra primera evaluación de "Otros controles", te pediremos crear una entrada de texto de líneas múltiples.</p>
-
-<ol>
- <li>Crea una entrada básica de texto de múltiples líneas.</li>
- <li>Asócialo semánticamente con la etiqueta de "Comentario" asociado.</li>
- <li>Define la entrada con 35 columnas y 10 filas de espacio en cual agregar comentarios.</li>
- <li>Define para los comentatios una longitud máxima de 100 caracteres.</li>
-</ol>
-
-<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/other-controls/other-controls1.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/other-controls/other-controls1-download.html" rel="noopener">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Otros_controles_2">Otros controles 2</h2>
-
-<p>Ahora es tiempo de implementar un menú desplegable, para permitir al usuario escoger su comida favorita de las opciones entregadas.</p>
-
-<ol>
- <li>Crea tu estructura de caja básica.</li>
- <li>Asóciala semánticamente con la etiqueta de "comentarios" entregada.</li>
- <li>Dentro de la lista, divide las opciones en 2 subgrupos - "principales" y "meriendas".</li>
-</ol>
-
-<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/other-controls/other-controls2.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/other-controls/other-controls2-download.html" rel="noopener">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Otros_controles_3">Otros controles 3</h2>
-
-<p>En la tarea final de esta evaluación, comenzaremos con la misma lista de opciones de comida. Sin embargo, esta vez queremos hacer las cosas de otra forma:</p>
-
-<ol>
- <li>Crea una entrada de texto básica, que esté asociada semánticamente con la etiqueta entregada.</li>
- <li>Coloca las opciones de comida en una lista que pueda ser asociada con una entrada de formulario.</li>
- <li>Asocia la lista con tu entrada de texto, de forma que cuando escribas caracteres, cualquier opción de la lista que coincida con la secuencia de caracteres ingresada, aparezca en un listado desplegable como sugerencia de autocompletado.</li>
-</ol>
-
-<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/tasks/other-controls/other-controls3.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/forms/tasks/other-controls/other-controls3-download.html" rel="noopener">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
-
-<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
-
-<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
-
-<ol>
- <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
- <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
-  <ul>
-   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de Otros controles 1".</li>
-   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
-   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
-   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
-  </ul>
- </li>
-</ol>
diff --git a/files/es/learn/html/forms/sending_and_retrieving_form_data/index.html b/files/es/learn/html/forms/sending_and_retrieving_form_data/index.html
deleted file mode 100644
index d6ca2161a4..0000000000
--- a/files/es/learn/html/forms/sending_and_retrieving_form_data/index.html
+++ /dev/null
@@ -1,328 +0,0 @@
----
-title: Sending form data
-slug: Learn/HTML/Forms/Sending_and_retrieving_form_data
-translation_of: Learn/Forms/Sending_and_retrieving_form_data
----
-<div>{{LearnSidebar}} {{PreviousMenuNext("Aprende / HTML / Formularios / The_native_form_widgets", "Aprender / html / Formularios / Form_validation", "Aprender / html / Forms")}}</div>
-
-<p class="summary">En este artículo se analiza lo que sucede cuando un usuario envía un formulario - ¿A dónde van los datos y cómo los manejamos cuando llegan allí? - También tenemos en cuenta algunos de los problemas de seguridad asociados con el envío de los datos del formulario.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Requisitos previos:</th>
-   <td>Conocimientos básicos de informática, una <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">comprensión de HTML</a> , y conocimientos básicos de <a href="/en-US/docs/Web/HTTP/Basics_of_HTTP">HTTP</a> y <a href="/en-US/docs/Learn/Server-side/First_steps">programación del lado del servidor</a> .</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Para entender lo que sucede cuando se envía los datos del formulario, incluyendo la obtención de una idea básica de cómo se procesan los datos en el servidor</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿A_dónde_van_los_datos">¿A dónde van los datos?</h2>
-
-<p>Aquí vamos a discutir lo que ocurre con los datos cuando se envía un formulario.</p>
-
-<h3 id="Sobre_la_arquitectura_cliente_servidor">Sobre la arquitectura cliente / servidor</h3>
-
-<p>La web se basa en una arquitectura cliente / servidor muy básica que se puede resumir de la siguiente manera: un cliente (normalmente un navegador Web) envía una petición a un servidor (la mayoría de las veces un servidor web como <a href="http://httpd.apache.org/" rel="external" title="http://www.apache.org/">Apache</a> , <a href="http://nginx.com/" rel="external" title="http://nginx.com/">Nginx</a> , <a href="http://www.iis.net/" rel="external" title="http://www.iis.net/">IIS</a> , <a href="http://tomcat.apache.org/" rel="external" title="http://tomcat.apache.org/">Tomcat</a> , etc.), utilizando el <a href="/en-US/docs/HTTP" title="/en-US/docs/HTTP">protocolo HTTP</a> . El servidor responde a la solicitud utilizando el mismo protocolo.</p>
-
-<p><img alt="Un esquema básico de la arquitectura cliente Web / servidor" src="/files/4291/client-server.png" style="display: block; height: 141px; margin: 0px auto; width: 400px;"></p>
-
-<p>En el lado del cliente, un formulario HTML no es más que una manera fácil de usar conveniente para configurar una petición HTTP para enviar datos a un servidor. Esto permite al usuario para proporcionar información a ser entregada en la petición HTTP.</p>
-
-<div class="note">
-<p><strong>Nota</strong> : Para tener una mejor idea de cómo funcionan las arquitecturas cliente-servidor, lea nuestra <a href="/en-US/docs/Learn/Server-side/First_steps">programación de páginas web del lado del servidor, módulo: primeros pasos</a>. En el lado del cliente: Debes definir como envías los datos.</p>
-</div>
-
-<p>El elemento {{HTMLElement ( "form")}} define cómo se enviarán los datos. Todos sus atributos están diseñados para que pueda configurar la solicitud que se enviará cuando un usuario pulsa un botón de envío. Los dos atributos más importantes son {{htmlattrxref ( "acción", "forma")}} y {{htmlattrxref ( "método", "forma")}}.</p>
-
-<h4 id="El_atributo_htmlattrxref_acción_forma.">El atributo {{htmlattrxref ( "acción", "forma")}}.</h4>
-
-<p>Este atributo define el lugar donde los datos se envian. Su valor debe ser una dirección URL válida. Si no se proporciona este atributo, los datos serán enviados a la dirección URL de la página que contiene el formulario.</p>
-
-<p>En este ejemplo, los datos se envían a una dirección URL absoluta - <code>http://foo.com</code>:</p>
-
-<pre class="brush: html">&lt;Acción del formulario = "http://foo.com"&gt;</pre>
-
-<p class="brush: html">Aquí, nosotros usamos una URL relativa - los datos se envían a una dirección URL diferente en el servidor:</p>
-
-<pre class="brush: html">&lt;Acción del formulario = "/ somewhere_else"&gt;</pre>
-
-<p class="brush: html">Cuando se especifica sin atributos, como abajo, el {{HTMLElement ( "form")}} los datos se envían a la misma página en que la "forma" está presente :</p>
-
-<pre class="brush: html">&lt;Form&gt;</pre>
-
-<p class="brush: html">Muchas páginas más antiguas utilizan la siguiente notación para indicar que los datos deben ser enviados a la misma página que contiene el formulario; Esto fue necesario porque hasta HTML5, el atributo {{htmlattrxref ( "acción", "form")}} fue requerido . Esto ya no es necesario.</p>
-
-<pre class="brush: html">&lt;Form action = "#"&gt;</pre>
-
-<div class="note">
-<p><strong>Nota:</strong> Es posible especificar una dirección URL que utiliza el protocolo HTTPS (HTTP seguro). Al hacer esto, los datos se cifran junto con el resto de la solicitud, incluso si el propio formulario está alojado en una página insegura se accede a través de HTTPS. Por otro lado, si el formulario está alojado en una página segura, pero se especifica una dirección URL HTTP insegura con el atributo {{htmlattrxref ( "acción", "form")}} , todos los navegadores mostrarán una advertencia de seguridad para el usuario cada vez  que intenten enviar datos, ya que estos no se pueden cifrar.</p>
-</div>
-
-<h4 id="El_atributo_htmlattrxref_método_form">El atributo {{htmlattrxref ( "método", "form")}}</h4>
-
-<p>Este atributo define cómo se envían los datos. El <a href="/en-US/docs/HTTP" title="/en-US/docs/HTTP">protocolo HTTP</a> proporciona varias formas de realizar una solicitud; Los datos del formulario HTML se pueden transmitir a través de un número de diferentes queridos, los más comunes de los cuales son el método <code>GET</code> y el método <code>POST</code>.</p>
-
-<p>Para entender la diferencia entre estos dos métodos, vamos a dar un paso atrás y examinar cómo funciona HTTP. Cada vez que desee llegar a un recurso en la Web, el navegador envía una petición a una URL. Una petición HTTP consta de dos partes: un encabezado que contiene un conjunto de metadatos mundial sobre las capacidades del navegador, y un cuerpo que puede contener la información necesaria paraque el servidor pueda procesar la petición específica.</p>
-
-<h5 id="El_método_GET">El método GET</h5>
-
-<p>El método <code>GET</code> es  utilizado por el navegador para pedir al servidor que se envíe de vuelta un recurso dado: "Hey servidor, quiero conseguir este recurso." En este caso, el navegador envía un cuerpo vacío. Debido a que el cuerpo está vacío, si un formulario se envía utilizando este método, los datos enviados al servidor se anexan a la URL.</p>
-
-<p>Considere la siguiente forma:</p>
-
-<pre class="brush: html">&lt;form action="http://foo.com" method="get"&gt;
-  &lt;div&gt;
-    &lt;label for="decir"&gt; ¿Qué saludo quiere decir? &lt;/label&gt;
-    &lt;input name="decir" id="decir" value="Hola"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="para"&gt; ¿A quién se lo quiere decir? &lt;/label&gt;
-    &lt;input name="para" value="mamá"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt; Botón enviar mis saludos &lt;/ button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Dado que el método <code>GET</code>ha conseguido el recurso, verá en la URL lo siguiente en la barra de direcciones del navegador <code>www.foo.com/?say=Hi&amp;to=Mom</code>  cuando se envía el formulario.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14685/url-parameters.png" style="display: block; margin: 0 auto;">Los datos se añaden a la URL como una serie de pares de nombre / valor. Después que la dirección web URL ha terminado, se incluye un signo de interrogación ( <code>?</code>) seguido de los pares de nombre / valor, cada uno separado por un signo ( <code>&amp;</code>). En este caso estamos pasando dos piezas de datos en el servidor:</p>
-
-<ul>
- <li><code>say</code>, Que tiene un valor de <code>Hi</code></li>
- <li><code>to</code>, Que tiene un valor de <code>Mom</code></li>
-</ul>
-
-<p>La solicitud HTTP se ve así:</p>
-
-<pre>GET /? = Decir Hola &amp; a = mamá HTTP / 1.1
-Anfitrión: foo.com</pre>
-
-<div class="note">
-<p><strong>Nota</strong> : Puede encontrar este ejemplo en GitHub - ver <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/get-method.html">llegar-method.html</a> ( <a href="https://mdn.github.io/learning-area/html/forms/sending-form-data/get-method.html">verlo en directo también</a> ).</p>
-</div>
-
-<h5 id="El_método_POST">El método POST</h5>
-
-<p>El <code>POST</code>método es un poco diferente. Es el método que el navegador utiliza para comunicarse con el servidor cuando se pide una respuesta que tenga en cuenta los datos proporcionados en el cuerpo de la petición HTTP: "Hey servidor, echa un vistazo a estos datos y envíame de vuelta un resultado apropiado." Si un formulario se envía utilizando este método, los datos se anexan al cuerpo de la petición HTTP.</p>
-
-<p>Veamos un ejemplo - se trata de algo similar a como se vió en el método <code>GET</code>del apartado anterior, pero con el {{htmlattrxref ( "método", "form")}} atributo establecido <code>post</code>.</p>
-
-<pre class="brush: html">&lt;Form action = "http://foo.com" method = "post"&gt;
-  &lt;Div&gt;
-    &lt;Label for = "dice"&gt; Lo saludo qué quiere decir? &lt;/ Label&gt;
-    &lt;Input name = "decir" id = "decir" value = "Hola"&gt;
-  &lt;/ Div&gt;
-  &lt;Div&gt;
-    &lt;Label for = "para"&gt; ¿Quién usted quiere decir que a? &lt;/ Label&gt;
-    &lt;Input name = "a" value = "mamá"&gt;
-  &lt;/ Div&gt;
-  &lt;Div&gt;
-    &lt;&gt; Botón enviar mis saludos &lt;/ botón&gt;
-  &lt;/ Div&gt;
-&lt;/ Form&gt;</pre>
-
-<p>Cuando el formulario se envía mediante el método <code>POST</code>, no se obtienen los datos adjuntos en la dirección URL, y la solicitud HTTP se parece a esto y los datos son incluidos en el cuerpo de la petición en su lugar:</p>
-
-<pre>POST / HTTP/1.1
-Anfitrión: foo.com
-Content-Type: application / x-www-form-urlencoded
-Content-Length: 13
-
-decir = Hi &amp; a = mamá</pre>
-
-<p>La cabecera <code>Content-Length</code> indica el tamaño del cuerpo, y la cabecera <code>Content-Type</code> indica el tipo de recurso que se envía al servidor. Discutiremos estas cabeceras más adelante.</p>
-
-<div class="note">
-<p><strong>Nota</strong> : Puede encontrar este ejemplo en GitHub - ver <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/post-method.html">post-method.html</a> ( <a href="https://mdn.github.io/learning-area/html/forms/sending-form-data/post-method.html">verlo en directo también</a> ).</p>
-</div>
-
-<h4 id="Visualización_de_peticiones_HTTP">Visualización de peticiones HTTP</h4>
-
-<p>Las peticiones HTTP nunca se muestran al usuario (si quieres verlos, es necesario utilizar herramientas como el <a href="/en-US/docs/Tools/Network_Monitor">Monitor de red Firefox</a> o las <a href="https://developers.google.com/chrome-developer-tools/" title="https://developers.google.com/chrome-developer-tools/">herramientas de desarrollo de Chrome</a> ). A modo de ejemplo, los datos del formulario se muestran a continuación en la pestaña de Chrome red:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14691/network-monitor.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
-
-<p>Lo único que se muestra al usuario es la dirección URL llamada. Como mencionamos anteriormente, con una petición<code>GET</code> del usuario,se verán los datos en su barra de direcciones, pero con una petición <code>POST</code> no será de esta manera. Esto puede ser muy importante por dos razones:</p>
-
-<ol>
- <li>Si necesita enviar una contraseña (o cualquier otra pieza sensible de los datos), nunca utilice el método<code>GET</code> o se arriesga a mostrar en la barra de direcciones, lo que sería muy inseguro.</li>
- <li>Si necesita enviar una gran cantidad de datos, el método <code>POSt</code> es preferible debido a que algunos navegadores limitan los tamaños de las direcciones URL. Además, muchos servidores limitan la longitud de las URL que aceptan.</li>
-</ol>
-
-<h3 id="En_el_lado_Servidor_la_recuperación_de_los_datos">En el lado  Servidor: la recuperación de los datos</h3>
-
-<p>Sea cual sea el método HTTP que elija, el servidor recibe una cadena que será analizada con el fin de obtener los datos como una lista de pares clave / valor. La forma de acceder a esta lista depende de la plataforma de desarrollo que use y de las estructuras específicas que pueda estar usando con él. La tecnología se utiliza también determina cómo se manejan claves duplicadas; A menudo,se da prioridad al valor recibido más recientemente para una clave dada .</p>
-
-<h4 id="Ejemplo_PHP_Raw">Ejemplo: PHP Raw</h4>
-
-<p><a href="http://php.net/">PHP</a> ofrece algunos objetos globales para acceder a los datos. Suponiendo que usted ha utilizado el método<code>POST</code>, el siguiente ejemplo sólo toma los datos y lo muestra al usuario. Por supuesto, lo que se hace con los datos depende de usted. Es posible visualizarlos, almacenarlos en una base de datos, enviarlos por correo electrónico, o procesarlos de alguna otra manera.</p>
-
-<pre class="brush: php">&lt;? Php
-  // La variable global $ _POST que permite acceder a los datos enviados con el método POST por su nombre
-  // Para acceder a los datos enviados con el método GET, puede usar $ _GET
-  $ = Decir htmlspecialchars ($ _POST [ 'decir']);
-  $ A = htmlspecialchars ($ _POST [ 'a']);
-
-  echo $ digamos, '', $ a;
-?&gt;</pre>
-
-<p>Este ejemplo muestra una página con los datos que enviamos. Esto se puede ver en acción en nuestro archivo ejemplo <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/php-example.html">php-example.html</a> - que contiene un ejemplo similar en forma como el que hemos visto antes, con un <code>method</code>con parámetro <code>post</code>y un <code>action</code> con parámetro <code>php-example.php</code> Cuando se envía, envía los datos del formulario al script <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/php-example.php">php-ejemplo.php</a> , que contiene el código de PHP que se ha visto en el bloque anterior. Cuando se ejecuta este código, la salida en el navegador es <code>Hi Mom</code>.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14693/php-result.png" style="display: block; margin: 0 auto;"></p>
-
-<div class="note">
-<p><strong>Nota</strong> : Este ejemplo no funcionará cuando se carga en un navegador localmente - los navegadores no pueden interpretar  código PHP, por lo que cuando se envía el formulario en el navegador sólo  se puede ofrecer la descarga del archivo PHP para usted. Para conseguir que funcione, es necesario ejecutar el ejemplo a través de un servidor PHP de algún tipo. Buenas opciones para probar PHP locales son <a href="https://www.mamp.info/en/downloads/">MAMP</a> (Mac y Windows) y <a href="http://ampps.com/download">AMPPS</a> (Mac, Windows, Linux).</p>
-</div>
-
-<h4 id="Ejemplo_Python">Ejemplo: Python</h4>
-
-<p>Este ejemplo muestra como se puede utilizar Python para hacer la misma cosa - mostrar los datos presentados en una página web. Se utiliza el <a href="http://flask.pocoo.org/">framework Flask</a> para la prestación de las plantillas, el manejo de la presentación de datos de formulario, etc (ver <a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/python-example.py">python-example.py</a> ).</p>
-
-<pre class="line-numbers  language-html"><code class="language-html">from flask import Flask, render_template, request
-app = Flask(__name__)
-
-@app.route('/', methods=['GET', 'POST'])
-def form():
-    return render_template('form.html')
-
-@app.route('/hello', methods=['GET', 'POST'])
-def hello():
-    return render_template('greeting.html', say=request.form['say'], to=request.form['to'])
-
-if __name__ == "__main__":
-    app.run()</code></pre>
-
-<p>Las dos plantillas de referencia en el código anterior son los siguientes:</p>
-
-<ul>
- <li><a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/templates/form.html">form.html</a> : La misma forma que hemos visto anteriormente en la {{anch ( "El método POST")}} sección, pero con el <code>action</code>conjunto a <code>\{{ url_for('hello') }}</code>. (Esta es una <a href="http://jinja.pocoo.org/docs/2.9/">Jinja2</a> plantilla, que es básicamente HTML, pero puede contener llamadas al código Python que ejecuta el servidor web que figura entre corchetes. <code>url_for('hello')</code>Básicamente está diciendo "redirigir a <code>/hello</code>cuando se envía el formulario").</li>
- <li><a href="https://github.com/mdn/learning-area/blob/master/html/forms/sending-form-data/templates/greeting.html">greeting.html</a> :<span id="result_box" lang="es"><span>Esta plantilla solo contiene una línea que representa los dos bits de datos que se le pasan cuando se procesa</span></span>. Esto se hace a través de la función <code>hello()</code>que se ha visto anteriormente, y que se ejecuta cuando la URL<code>/hello</code> es accedida.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong> : Una vez más, este código no funcionará si sólo intenta cargarlo en un navegador directamente. Python funciona un poco diferente a PHP - Para ejecutar este código local que necesita para <a href="/en-US/docs/Learn/Server-side/Django/development_environment#Installing_Python_3">instalar Python / PIP</a> , a continuación, instalar el frasco utilizando <code>pip3 install flask</code>. En este punto, usted debe ser capaz de ejecutar el ejemplo utilizando <code>python3 python-example.py</code>, a continuación, deberá navegar a <code>localhost:5000</code>en su barra de direcciones.</p>
-</div>
-
-<h4 id="Otros_lenguajes_y_frameworks">Otros lenguajes y frameworks</h4>
-
-<p>Hay muchas otras tecnologías del lado del servidor que puede utilizar para el manejo de formularios, incluyendo <a href="/en-US/docs/" title="/en-US/docs/">Perl</a> , <a href="/en-US/docs/" title="/en-US/docs/">Java</a> , <a href="http://www.microsoft.com/net" title="http://www.microsoft.com/net">.Net</a> , <a href="/en-US/docs/" title="/en-US/docs/">Rubí</a> , etc. Sólo tiene que elegir el que más le guste. Dicho esto, vale la pena señalar que es muy raro de usar estas tecnologías directamente porque esto puede ser complicado. Es más común el uso de uno de los muchos marcos de trabajo para un manejo más fácil del código, tales como:</p>
-
-<ul>
- <li><a href="http://symfony.com/" rel="external" title="http://symfony.com/">Symfony</a> para PHP</li>
- <li><a href="/en-US/docs/Learn/Server-side/Django" rel="external" title="https://www.djangoproject.com/">Django</a> para Python (un poco más pesado que el <a href="http://flask.pocoo.org/">frasco</a> , pero con más herramientas y opciones).</li>
- <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs">Express</a> de Node.js</li>
- <li><a href="http://rubyonrails.org/" rel="external" title="http://rubyonrails.org/">Ruby on Rails</a> Ruby</li>
- <li><a href="http://grails.org/" rel="external" title="http://grails.org/">Grails</a> para Java</li>
- <li>etc.</li>
-</ul>
-
-<p>Vale la pena señalar que incluso el uso de estos marcos, trabajar con formularios no es necesariamente <em>fácil</em> . Pero es mucho más fácil que tratar de escribir toda la funcionalidad  a partir de cero, además, le ahorrará mucho tiempo.</p>
-
-<div class="note">
-<p><strong>Nota</strong> : Está más allá del alcance de este artículo para enseñarle cualquier lenguaje del lado del servidor o marcos de trabajo. Los enlaces de arriba le dará un poco de ayuda,en caso de que desee aprender.</p>
-</div>
-
-<h2 id="Un_caso_especial_el_envío_de_archivos">Un caso especial: el envío de archivos</h2>
-
-<p>El envío de archivos con formularios HTML es un caso especial. Los archivos son datos binarios - o considerados como tal - mientras que todos los demás datos son datos de texto. Debido a que HTTP es un protocolo de texto, existen requisitos especiales para el manejo de datos binarios.</p>
-
-<h3 id="El_htmlattrxref_enctype_form_atributo">El {{htmlattrxref ( "enctype", "form")}} atributo</h3>
-
-<p>Este atributo le permite especificar el valor de la cabecera <code>Content-Type</code> HTTP incluido en la solicitud que se genera cuando se envía el formulario. Esta cabecera es muy importante porque le dice al servidor qué tipo de datos se está enviando. Por defecto, su valor es <code>application/x-www-form-urlencoded</code>. En términos humanos, esto significa: "<span class="short_text" id="result_box" lang="es"><span>Estos son datos de formulario que han sido codificados dentro de los parámetros de la URL</span></span>."</p>
-
-<p>Si desea enviar archivos, es necesario tomar tres pasos adicionales:</p>
-
-<ul>
- <li>Ajuste el {{htmlattrxref ( "método", "form")}} atributo <code>POST</code>porque el contenido del archivo no se puede poner dentro de los parámetros de URL.</li>
- <li>Establecer el valor de {{htmlattrxref ( "enctype", "form")}} que <code>multipart/form-data</code>debido a que los datos se dividen en múltiples partes, una para cada archivo más uno para los datos de texto incluidos en el cuerpo del formulario (si también se introduce el texto en la formulario).</li>
- <li>Incluir uno o más widgets <a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets#File_picker">selector de archivos</a> para permitir a los usuarios seleccionar el archivo (s) que será subido.</li>
-</ul>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: html">&lt;Form method = "post" enctype = "multipart / form-data"&gt;
-  &lt;Div&gt;
-    &lt;Label for = "archivo"&gt; ​​Elija un archivo &lt;/ label&gt;
-    &lt;Input type = "file" id = "file" name = "myFile"&gt;
-  &lt;/ Div&gt;
-  &lt;Div&gt;
-    &lt;&gt; Botón Enviar el archivo &lt;/ botón&gt;
-  &lt;/ Div&gt;
-&lt;/ Form&gt;</pre>
-
-<div class="note">
-<p><strong>Nota:</strong> Algunos navegadores son compatibles con la {{htmlattrxref ( "múltiple", "input")}} atributo en el elemento {{HTMLElement ( "input")}}, lo que permite elegir más de un archivo  para subir con un único elemento <code>&lt;input&gt;</code> . Cómo el servidor gestiona los archivos realmente depende de la tecnología utilizada en el servidor. Como se mencionó anteriormente, el uso de un marco le hará la vida mucho más fácil.</p>
-</div>
-
-<div class="warning">
-<p><strong>Advertencia:</strong> Muchos servidores están configurados con un límite de tamaño para los archivos y las peticiones HTTP con el fin de prevenir el abuso. Es importante comprobar este límite con el administrador del servidor antes de enviar un archivo.</p>
-</div>
-
-<h2 id="Precauciones_de_seguridad_comunes">Precauciones de seguridad comunes</h2>
-
-<p>Cada vez que envíe datos a un servidor, debe tener en cuenta la seguridad de sus formularios HTML que son con mucho, los vectores de ataque más comunes (en lugares donde ocurren los ataques contra servidores). Los problemas nunca vienen de los formulariosHTML mismos - sino que proceden de cómo el servidor maneja los datos.</p>
-
-<p><span id="result_box" lang="es"><span>Dependiendo de lo que estés haciendo, hay algunos problemas de seguridad muy conocidos con los que te enfrentarás</span></span>:</p>
-
-<h3 id="XSS_y_CSRF">XSS y CSRF</h3>
-
-<p>Cross-Site Scripting (XSS) y Cross-Site Request Falsification (CSRF) son tipos comunes de ataques que se producen cuando se muestran los datos enviados por un usuario y que son devueltos a otro usuario para otro uso.</p>
-
-<p>XSS permite a los atacantes inyectar secuencias de comandos del lado del cliente en páginas Web visitadas por otros usuarios. Una vulnerabilidad de secuencias de comandos entre sitios, puede ser utilizada por los atacantes para eludir los controles de acceso, como la <a href="/en-US/docs/JavaScript/Same_origin_policy_for_JavaScript" title="/ Es-ES / docs / JavaScript / Same_origin_policy_for_JavaScript">política del mismo origen</a> . El efecto de estos ataques pueden ir desde una pequeña molestia a un riesgo de seguridad.</p>
-
-<p>Los ataques CSRF son similares a los ataques XSS porque comienzan de la misma manera - mediante la inyección de comandos de cliente en páginas Web - pero su objetivo es diferente. Los atacantes CSRF tratan de escalar privilegios  de un usuario de mayores privilegios (por ejemplo, un administrador de sitio) para realizar una acción que no deberían ser capaces de hacer (por ejemplo, el envío de datos a un usuario no fiable).</p>
-
-<p>Los ataques XSS explotan la confianza depositada a un usuario de un sitio web, mientras que los ataques CSRF abusan de la confianza que un sitio web ofrece para sus usuarios.</p>
-
-<p>Para evitar estos ataques, siempre se deben comprobar los datos que un usuario envía a su servidor y (si es necesario mostrarlos) <span id="result_box" lang="es"><span>trate de no mostrar el contenido HTML provisto por el usuario</span></span>. En su lugar, se deben procesar los datos proporcionados por el usuario para no mostrarlos al pie de la letra. <span style="line-height: 1.5;">Casi todos los marcos de trabajo (<strong>frameworks</strong>) en el mercado hoy implementan un filtro mínimo que eliminan el código HTML {{HTMLElement ( "script")}}, {{HTMLElement ( "iframe")}} y {{HTMLElement ( "objeto")}} si fuesen enviados por cualquier usuario. Esto ayuda a mitigar el riesgo, pero no necesariamente lo erradica.</span></p>
-
-<h3 id="Inyección_SQL">Inyección SQL</h3>
-
-<p>La inyección de SQL es un tipo de ataque que intenta realizar acciones en una base de datos utilizada por el sitio web de destino. Esto normalmente implica el envío de una petición SQL con la esperanza de que el servidor la ejecutará (por lo general cuando el servidor de aplicaciones intenta almacenar los datos enviados por un usuario). Esto es en realidad <a href="https://www.owasp.org/index.php/Category:OWASP_Top_Ten_Project" rel="external" title="https://www.owasp.org/index.php/Category:OWASP_Top_Ten_Project">uno de los principales vectores de ataque contra los sitios web </a> .</p>
-
-<p>Las consecuencias pueden ser terribles, que van desde la pérdida de datos o hasta que los ataques  tomen el control de la infraestructura de todo el sitio web mediante el uso de una escalada de privilegios. Esta es una amenaza muy seria y nunca debe almacenar los datos enviados por un usuario sin realizar alguna sanitización (por ejemplo, mediante el uso <code><a href="http://www.php.net/manual/en/function.mysql-real-escape-string.php" rel="external" title="http://www.php.net/manual/en/function.mysql-real-escape-string.php">mysql_real_escape_string()</a></code>de una infraestructura de PHP / MySQL).</p>
-
-<h3 id="Inyección_de_cabecera_HTTP_y_la_inyección_de_correo_electrónico">Inyección de cabecera HTTP y la inyección de correo electrónico</h3>
-
-<p>Este tipo de ataques pueden ocurrir cuando su aplicación se basa cabeceras HTTP o mensajes de correo electrónico basado en la entrada de datos por un usuario en un formulario. Estos no dañan directamente su servidor o afectan a sus usuarios, pero son una puerta abierta a problemas más profundos tales como el secuestro de sesión o ataques de phishing.</p>
-
-<p>Estos ataques son en su mayoría en silencio, y pueden volver a su servidor en un <a href="http://en.wikipedia.org/wiki/Zombie_(computer_science)" rel="exernal" title="http://en.wikipedia.org/wiki/Zombie_(computer_science)">zombi</a> .</p>
-
-<h3 id="Sea_paranoico_Nunca_confíe_en_sus_usuarios">Sea paranoico: Nunca confíe en sus usuarios</h3>
-
-<p>Entonces, ¿cómo se lucha contra estas amenazas? Este es un tema mucho más allá de esta guía, pero hay algunas reglas a tener en cuenta. La regla más importante es: nunca vuelva a confiar en sus usuarios, incluyáse a sí mismo; incluso un usuario de confianza podría haber sido secuestrado.</p>
-
-<p>Todos los datos que vienen a su servidor deben comprobarse y ser desinfectados. Siempre. Sin excepción.</p>
-
-<ul>
- <li>Escapar caracteres potencialmente peligrosos. Los caracteres específicos con los que debe tener cuidado variarán dependiendo del contexto en el que se utilizan los datos y la plataforma de servidores que emplean, pero todos los lenguajes del lado del servidor tienen funciones de este.</li>
- <li>Limite la cantidad de entrada de datos para permitir sólo lo necesario.</li>
- <li>Sandbox subido archivos (almacenarlos en un servidor diferente y permitir el acceso al archivo sólo a través de un subdominio diferente o incluso mejor a través de un nombre de dominio totalmente diferente).</li>
-</ul>
-
-<p>Debería evitar muchos o  la mayoría de estos problemas, si sigue estas tres reglas, pero siempre es una buena idea  obtener una revisión de seguridad realizada por una tercera parte competente. No asuma que usted ha visto todos los posibles problemas.</p>
-
-<div class="note">
-<p><strong>Nota</strong> : La <a href="/en-US/docs/Learn/Server-side/First_steps/Website_security">seguridad del sitio web</a> el artículo de nuestro <a href="/en-US/docs/Learn/Server-side">lado del servidor</a> tema de aprendizaje analiza las amenazas anteriores y las posibles soluciones con más detalle.</p>
-</div>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>Como se puede ver, el envío de los datos del formulario es fácil, pero asegurar una aplicación puede ser complicado. Sólo recuerde que un desarrollador de aplicaciones para usuario no es el que debe definir el modelo de seguridad de los datos. Sí, como veremos, es posible <a href="/en-US/docs/HTML/Forms/Data_form_validation" title="/ es-ES / docs / HTML / Formularios / Data_form_validation">realizar la validación de los datos del lado del cliente</a> , pero el servidor no puede confiar en esta validación porque no tiene manera de saber realmente lo que  sucede en el lado del cliente.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<p>Si desea obtener más información sobre la seguridad de una aplicación web, se puede excavar en estos recursos:</p>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Server-side/First_steps">programación web del lado del servidor primeros pasos</a></li>
- <li><a href="https://www.owasp.org/index.php/Main_Page" rel="external" title="https://www.owasp.org/index.php/Main_Page">El Proyecto Open Web Application Security (OWASP)</a></li>
- <li><a href="http://shiflett.org/" rel="external" title="http://shiflett.org/">el blog de Chris Shiflett sobre Seguridad en PHP</a></li>
-</ul>
-
-<p>{{PreviousMenuNext ( "Aprende / html / Formularios / The_native_form_widgets", "Saber / html / Formularios / Form_validation", "Aprender / html / Forms")}}</p>
diff --git a/files/es/learn/html/forms/styling_html_forms/index.html b/files/es/learn/html/forms/styling_html_forms/index.html
deleted file mode 100644
index 26b4173ee8..0000000000
--- a/files/es/learn/html/forms/styling_html_forms/index.html
+++ /dev/null
@@ -1,345 +0,0 @@
----
-title: Estilizando formularios HTML
-slug: Learn/HTML/Forms/Styling_HTML_forms
-translation_of: Learn/Forms/Styling_web_forms
----
-<p>En este artículo aprenderemos como utilizar <a href="/es/docs/Web/CSS">CSS</a> con formularios <a href="/es/docs/Web/HTML">HTML</a>  para hacerlos más atractivos. Aunque parezca extraño, esto es algo que puede llegar a ser complicado. Por razones históricas y técnicas, los widgets de formulario no suelen llevarse bien con CSS. Por este motivo, muchos desarrolladores prefieren <a href="https://developer.mozilla.org/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets">construir sus propios widgets</a> para tener el control de su aspecto en vez de utilizar los nativos. De todas formas, con los modernos navegadores, los diseñadores web <span style="line-height: 23.3333339691162px;">cada vez</span><span style="line-height: 1.5;"> tienen  más control sobre el diseño de los elementos de formulario. Vamos a profundizar en esto.</span></p>
-
-<h2 id="¿Porqué_es_tan_difícil_aplicar_estilos_a_formularios_con_CSS">¿Porqué es tan difícil aplicar estilos a formularios con CSS?</h2>
-
-<p>En los principios de la Web —allá por1995—se añadieron los controles de formulario en la <a href="http://www.ietf.org/rfc/rfc1866.txt">2ª especificación HTML.</a> Debido a la complejidad de los widgets de formulario, los implementadores prefirieron dejar que el sistema operativo subyacente se encargara de su manejo y presentación.</p>
-
-<p>Pocos años después,  se creó<span style="line-height: 23.3333339691162px;"> </span><span style="line-height: 1.5;">CSS y lo que era una necesidad técnica</span>— es decir, el uso de widgets nativos para implementar controles de formulario—empezó a requerir estilizado. Y en los primeros días de CSS, el estilizado de formularios no fué una prioridad.</p>
-
-<p>Por otra parte, como los usuarios estaban acostumbrados a la apariencia visual de sus plataformas respectivas, los fabricantes de navegadores fueron reacios a hacer que los controles de formularios pudieran recibir estilos.</p>
-
-<p>Hoy en día, ni siquiera uno solo de los navegadores actuales implementa <span style="line-height: 23.3333339691162px;">completamente</span><span style="line-height: 1.5;"> a CSS 2.1. Afortunadamente, con el tiempo, los fabricantes de navegadores han ido mejorado su soporte a CSS para los elementos de formulario e, incluso considerando que su usabilidad tiene mala reputación, actualmente, ya se puede usar CSS para estilizar </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Forms" style="line-height: 1.5;">formularios HTML.</a></p>
-
-<h3 id="No_todos_los_widgets_se_crean_igual_con_CSS">No todos los widgets se crean igual con CSS</h3>
-
-<p>Actualmente aun se encuentran dificultades cuando se utiliza CSS con formularios; estos problemas se pueden dividir en tres categorías.</p>
-
-<h4 id="El_bueno">El bueno</h4>
-
-<p>A algunos elementos se les puede dar estilo con pocos o ningún problema independientemente de la plataforma. Entre estos se incluyen los siguientes elementos estructurales:</p>
-
-<ol>
- <li>{{HTMLElement("form")}}</li>
- <li>{{HTMLElement("fieldset")}}</li>
- <li>{{HTMLElement("label")}}</li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/output">&lt;output&gt;</a></li>
-</ol>
-
-<p style="line-height: 23.3333339691162px;">Esto también incluye todos los campos de texto (tanto los de línea simple como los de línea múltiple) y los botones.</p>
-
-<ol style="line-height: 23.3333339691162px;">
-</ol>
-
-<p style="line-height: 18px; font-size: 1.28571428571429rem;">El malo</p>
-
-<p>Hay otros elementos a los que raramente se les puede aplicar estilos y pueden llegar a requerir  <span style="line-height: 23.3333339691162px;">técnicas</span><span style="line-height: 1.5;"> complejas y </span><span style="line-height: 1.5;">ocasionalmente necesitan conocimientos avanzados de CSS3.</span></p>
-
-<p>Entre estos se incluyen el elemento {{HTMLElement("legend")}} ; que no puede posicionarse adecuadamente en todas las plataformas.  Los elementos checkbox y los botones de radio no permiten que se le apliquen estilos directamente;  de todas formas, gracias a CSS3 esto puede soslayarse. Al contenido de  <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-placeholder">placeholder </a>no se le puede aplicar estilo de ninguna forma convencional; sin embargo, todos los navegadores que lo implementan  también implementan pseudo-elementos<span style="line-height: 23.3333339691162px;"> o </span><span style="line-height: 1.5;">pseud</span><span style="line-height: 1.5;">o-clases propi</span>etarias que permiten darles estilo<span style="line-height: 1.5;">.</span></p>
-
-<p><span style="line-height: 1.5;">Veremos como trabajar con estos casos específicos en el artículo </span><a href="/en-US/docs/Advanced_styling_for_HTML_forms" style="line-height: 23.3333339691162px;" title="/en-US/docs/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a><span style="line-height: 23.3333339691162px;">.</span></p>
-
-<h4 id="El_feo">El feo</h4>
-
-<p>En algunos elementos, simplemente no se puede utilizar CSS. Estos son todos los elementos avanzados de interface de usuario tales como los controles range, color, o date, e igualmente pasa con los widgets desplegables como <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select">select</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option">option</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/optgroup">optgropup </a>y <a href="/es/docs/HTML/Elemento/datalist">datalist</a>. Respecto al selector de archivos, es bien sabido que no puede aplicarse estilo en absoluto. Los nuevos elementos <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress">progress </a>y <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meter">meter </a>también caen dentro de esta categoría.</p>
-
-<p>El principal problema con todos estos widgets viene de que todos ellos tienen una estructura muy compleja y CSS no es lo suficientemente expresivo para estilizar cada una de sus sutiles partes. Si lo que se quiere es personalizar estos widgets se deberá recurrir a javaScript para construir un árbol DOM que te permita acceder a ellos. Para aprender como conseguirlo mirar en el artículo <a href="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets" style="line-height: 23.3333339691162px; text-decoration: underline;" title="/en-US/docs/HTML/Forms/How_to_build_custom_form_widgets"><span style="line-height: 23.3333339691162px;"><u>How to </u></span>build<span style="line-height: 23.3333339691162px;"><u> </u></span>custom<span style="line-height: 23.3333339691162px;"><u> </u></span>form<span style="line-height: 23.3333339691162px;"><u> </u></span>widgets</a>.</p>
-
-<h2 id="Estilizado_básico">Estilizado básico</h2>
-
-<p>Aplicar estilos a <a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/Forms/Styling_HTML_forms#El_bueno">elementos que son fáciles de estilizar</a> con CSS, no debería suponer ninguna dificultad ya que básicamente se comportan como cualquier otro elemento HTML. De todas formas, el agente de usuario de estilos para cada navegador puede mostrar pequeñas inconsistencias por lo que a continuación daremos algunos trucos para ayudar a aplicar estilos más cómodamente.</p>
-
-<h3 id="Campos_de_búsqueda">Campos de búsqueda</h3>
-
-<p>Las cajas de búsqueda son el único tipo de campo de texto que pueden ofrecer más dificultad al aplicar estilos. En los navegadores basados en webkit (Chrome, Safari, etc.) se debe lidiar con la propiedad -webkit-. Discutiremos esta propiedad más tarde en el artículo: <a href="/en-US/docs/Advanced_styling_for_HTML_forms" style="line-height: 23.3333339691162px; text-decoration: underline;" title="/en-US/docs/Advanced_styling_for_HTML_forms">Advanced styling for HTML forms</a><span style="line-height: 23.3333339691162px;">.</span></p>
-
-<h4 id="Ejemplo">Ejemplo</h4>
-
-<pre class="brush: html">&lt;form&gt;
-  &lt;input type="search"&gt;
-&lt;/form&gt;
-</pre>
-
-<pre class="brush: css">input[type=search] {
-  border: 1px dotted #999;
-  border-radius: 0;
-
-  -webkit-appearance: none;
-}</pre>
-
-<p><img alt="This is a screenshot of a search filed on Chrome, with and without the use of -webkit-appearance" src="/files/4153/search-chrome-macos.png" style="border-style: solid; border-width: 1px; height: 107px; width: 179px;"></p>
-
-<p>En esta captura de pantalla pueden verse dos campos de búsqueda en Chrome, ambos campos tienen definido el borde como en nuestro ejemplo, pero el primero no utiliza -webkit- mientras que el segundo si lo hace con -webkit-appearance:none. Las diferencias son evidentes.</p>
-
-<h3 id="Fuentes_y_texto">Fuentes y texto</h3>
-
-<p>Las fuentes y capacidades de texto de CSS  se pueden utilizar sin problemas en cualquier widget (y sí, se puede utilizar <a href="/es/docs/Web/CSS/@font-face">@font-face</a> en formularios). De todas formas, el comportamiento de los navegadores no es siempre consistente. Por defecto, algunos widgets no heredan <a href="/es/docs/Web/CSS/font-family">font-family</a> ni <a href="/es/docs/Web/CSS/font-size">font-size</a> de sus antecesores. Y muchos navegadores utilizan la apariencia por defecto. Para mantener la coherencia de los formularios con el resto de elementos se deben añadir las siguientes reglas a la hoja de estilos:</p>
-
-<pre class="brush: css">button, input, select, textarea {
-  font-family : inherit;
-  font-size   : 100%;
-}</pre>
-
-<p>La siguiente captura de pantalla muestra estas incosistencias; a la izquierda la apariencia por defecto en Firefox sobre Mac OS X, usando las fuentes por defecto de la plataforma. A la derecha los mismos elementos aplicando nuestras reglas de armonización de fuentes.</p>
-
-<p><img alt="This is a screenshot of the main form widgets on Firefox on Mac OSX, with and without font harmonization" src="/files/4157/font-firefox-macos.png" style="border-style: solid; border-width: 1px; height: 234px; width: 420px;"></p>
-
-<p>Hay muchas controversia sobre si los formularios tienen mejor aspecto usando los estilos por defecto del sistema o usando estilos personalizados que coincidan con el resto del contenido. Como diseñador del sitio o aplicación Web esta decisión  es suya.</p>
-
-<h3 id="Modelo_de_cajas">Modelo de cajas</h3>
-
-<p>Todos los campos de texto tienen soporte completo para las propiedades relacionadas con el modelo de cajas de CSS (<a href="/es/docs/Web/CSS/width">width</a>, <a href="/es/docs/Web/CSS/height">height</a>, <a href="/es/docs/Web/CSS/padding_paspartu">padding</a>, margin y <a href="/es/docs/CSS/border">border</a>). Igual que antes, los navegadores se remiten a los estilos por defecto del sistema cuando muestran estos widgets. A cada cual te corresponde el como combinarlos dentro del resto de contenido. Si  se quieres mantener el aspecto nativo de los widgets, entonces hay que afrontar pequeñas inconsistencias de tamaño.</p>
-
-<p>Esto es porque cada widget tiene sus propias reglas para el orden, margen y padding. Por lo que si quieres darle el mismo tamaño a varios widgets diferentes se debe usar la propiedad box-sizing: </p>
-
-<pre class="brush: css">input, textarea, select, button {
-  width : 150px;
-  margin: 0;
-
-  -webkit-box-sizing: border-box; /* For legacy WebKit based browsers */
-     -moz-box-sizing: border-box; /* For legacy (Firefox &lt;29) Gecko based browsers */
-          box-sizing: border-box;
-}</pre>
-
-<p><img alt="This is a screenshot of the main form widgets on Chrome on Windows 7, with and without the use of box-sizing." src="/files/4161/size-chrome-win7.png" style="border-style: solid; border-width: 1px; height: 213px; width: 358px;"></p>
-
-<p>En la captura de pantalla de arriba, la columna la izquierda es sin utilizar box-sizing, mientras que la de la derecha usa esta propiedad con el valor border-box. Obsérvese cómo esto permite asegurar que todos los elementos ocupan la misma cantidad de espacio, independientemente de las reglas por defecto de la plataforma.</p>
-
-<h3 id="Posicionado">Posicionado</h3>
-
-<p>El posicionado de formularios HTML <span style="line-height: 23.3333339691162px;">no es </span><span style="line-height: 1.5;">generalmente  un problema; sin embargo, hay dos elementos a los que prestar una especial atención:</span></p>
-
-<h4 id="legend">legend</h4>
-
-<p>El elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/legend">legend </a>no tiene problemas de estilizado a excepción de las reglas de posición. En los navegadores el elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/legend">legend </a>se posiciona encima del borde superior de su antecesor <a href="/es/docs/HTML/Elemento/fieldset">fieldset</a>. No existe ninguna posibilidad de colocarlo dentro del flujo HTML más allá del borde superior. Sin embargo se puede posicionar de forma relativa o absoluta mediante la propiedad position. En cualquier caso sigue siendo parte del borde de fieldset.</p>
-
-<p>Debido a que el elemento legend es muy importante por razones de accesibilidad (esto es lo que leen las tecnologías de asistencia como parte de las etiquetas de cada elemento de formulario dentro del fieldset), bastante menudo se empareja con un título que se oculta pero siendo aun accesible, de la forma siguiente:</p>
-
-<h5 id="HTML">HTML</h5>
-
-<pre class="brush: html">&lt;fieldset&gt;
-  &lt;legend&gt;Hi!&lt;/legend&gt;
-  &lt;h1&gt;Hello&lt;/h1&gt;
-&lt;/fieldset&gt;</pre>
-
-<h5 id="CSS">CSS</h5>
-
-<pre class="brush: css">legend {
-  width: 1px;
-  height: 1px;
-  overflow: hidden;
-}</pre>
-
-<h4 id="textarea">textarea</h4>
-
-<p>Por defecto, todos los navegadores consideran el elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea">textarea </a>como un inline block alineado con la línea base del texto. Esto es algo que raramente es lo que en realidad se quiere. Para convertir este elemento de un inline-block a uno tipo block, se realiza bastante fácilmente utilizando la propiedad <a href="/es/docs/CSS/display">display</a>. Si lo que quieres es utilizarlo inline, es corriente cambiar la alineación vertical: </p>
-
-<pre class="brush: css">textarea {
-  vertical-align: top;
-}</pre>
-
-<h2 id="Ejemplo_2">Ejemplo</h2>
-
-<p>Vamos a ver un ejemplo de como aplicar estilo a un formulario HTML. Esto nos ayudará a tener las ideas más claras. A continuación construiremos el siguiente formulario de contacto de esta postal:</p>
-
-<p><img alt="This is what we want to achieve with HTML and CSS" src="/files/4149/screenshot.png" style="border-style: solid; border-width: 1px; height: 249px; width: 370px;"></p>
-
-<h3 id="HTML_2">HTML</h3>
-
-<p>El HTML  incluye poco más de lo que se utiliza en el primer artículo de <a href="/en-US/docs/HTML/Forms/My_first_HTML_form">esta guía</a>; apenas el título y algún ID más.</p>
-
-<pre class="brush: html">&lt;form&gt;
-  &lt;h1&gt;to: Mozilla&lt;/h1&gt;
-
-  &lt;div id="from"&gt;
-    &lt;label for="name"&gt;from:&lt;/label&gt;
-    &lt;input type="text" id="name" name="user_name"&gt;
-  &lt;/div&gt;
-
-  &lt;div id="reply"&gt;
-    &lt;label for="mail"&gt;reply:&lt;/label&gt;
-    &lt;input type="email" id="mail" name="user_email"&gt;
-  &lt;/div&gt;
-
-  &lt;div id="message"&gt;
-    &lt;label for="msg"&gt;Your message:&lt;/label&gt;
-    &lt;textarea id="msg" name="user_message"&gt;&lt;/textarea&gt;
-  &lt;/div&gt;
-
-  &lt;div class="button"&gt;
-    &lt;button type="submit"&gt;Send your message&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<h3 id="CSS_2">CSS</h3>
-
-<p>¿Aqui es donde empieza la diversión! Antes de empezar a codificar, necesitamos tres elementos adicionales:</p>
-
-<ol>
- <li>El <a href="https://developer.mozilla.org/files/4151/background.jpg">fondo </a>de la postal</li>
- <li>Una fuente tipográfica: <a href="http://www.fontsquirrel.com/fonts/Secret-Typewriter" rel="external" title="http://www.fontsquirrel.com/fonts/Secret-Typewriter">la "Secret Typewriter" de fontsquirrel.com</a></li>
- <li>Una fuente manuscrita: <a href="http://www.fontsquirrel.com/fonts/Journal" rel="external" title="http://www.fontsquirrel.com/fonts/Journal">la "Journal" fde fontsquirrel.com</a></li>
-</ol>
-
-<p>Ahora podemos repasar el código. Primero preparamos las bases definiendo las reglas <span style="line-height: 23.3333339691162px;"> </span><a href="https://developer.mozilla.org/es/docs/Web/CSS/@font-face" style="line-height: 23.3333339691162px;" title="@font-face permite al autor especificar fuentes online para visualizar en sus páginas web. Al permitir a los autores proporcionar sus propias fuentes, @font-face elimina la necesidad de depender del numero limitado de fuentes de usuarios instaladas en sus computadoras."><code>@font-face</code></a> y los elementos básicos de <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/body" style="line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!"><code>&lt;body&gt;</code></a> y <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/form" style="line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!"><code>&lt;form&gt;</code></a><span style="line-height: 23.3333339691162px;"> </span></p>
-
-<pre class="brush: css">@font-face{
-  font-family : "handwriting";
-
-  src : url('journal.eot');
-  src : url('journal.eot?') format('eot'),
-        url('journal.woff') format('woff'),
-        url('journal.ttf') format('truetype');
-}
-
-@font-face{
-  font-family : "typewriter";
-
-  src : url('veteran_typewriter.eot');
-  src : url('veteran_typewriter.eot?') format('eot'),
-        url('veteran_typewriter.woff') format('woff'),
-        url('veteran_typewriter.ttf') format('truetype');
-}
-
-body {
-  font  : 21px sans-serif;
-
-  padding : 2em;
-  margin  : 0;
-
-  background : #222;
-}
-
-form {
-  position: relative;
-
-  width  : 740px;
-  height : 498px;
-  margin : 0 auto;
-
-  background: #FFF url(background.jpg);
-}</pre>
-
-<p>Ahora podemos posicionar los elementos, incluidos el título y los elementos del formulario.</p>
-
-<pre class="brush: css">h1 {
-  position : absolute;
-  left : 415px;
-  top  : 185px;
-
-  font : 1em "typewriter", sans-serif;
-}
-
-#from {
-  position: absolute;
-  left : 398px;
-  top  : 235px;
-}
-
-#reply {
-  position: absolute;
-  left : 390px;
-  top  : 285px;
-}
-
-#message {
-  position: absolute;
-  left : 20px;
-  top  : 70px;
-}</pre>
-
-<p>Aquí es donde empezamos a trabajar los propios elementos. Primero, nos aseguramos que los elementos <span style="line-height: 23.3333339691162px;"> </span><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/label" style="line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!"><code>&lt;label&gt;</code></a> reciben la fuente correcta.</p>
-
-<pre class="brush: css">label {
-  font : .8em "typewriter", sans-serif;
-}</pre>
-
-<p>Los campos de texto necesitan algunas reglas comunes. Dicho simplemente, le quitamos bordes y fondos y redefinimos el padding y margin.</p>
-
-<pre class="brush: css">input, textarea {
-  font    : .9em/1.5em "handwriting", sans-serif;
-
-  border  : none;
-  padding : 0 10px;
-  margin  : 0;
-  width   : 240px;
-
-  background: none;
-}</pre>
-
-<p>Cuando uno de estos campos recibe el foco, vamos a resaltarlo con un fondo transparente gris claro. Tome nota de que es importante añadir la propiedad <span style="line-height: 23.3333339691162px;"> </span><a class="new" href="https://developer.mozilla.org/es/docs/Web/CSS/outline" style="color: rgb(153, 0, 0); line-height: 23.3333339691162px;" title="The documentation about this has not yet been written; please consider contributing!"><code>outline</code></a><span style="line-height: 23.3333339691162px;"> </span> para quitar el resaltado de enfoque añadido por defecto por algunos navegadores.</p>
-
-<pre class="brush: css">input:focus, textarea:focus {
-  background   : rgba(0,0,0,.1);
-  border-radius: 5px;
-  outline      : none;
-}</pre>
-
-<p>Ahora que nuestros campos de texto están terminados, necesitamos ajustar como se muestran los campos de simple y múltiple línea para que coincidan, ya que lo normal es que por defecto no se vean igual.</p>
-
-<p>El campo de línea simple requiere de algunos trucos para que se vean bien en Internet Explorer. Internet Explorer no define la altura de los campos basándose en la altura natural de la fuente (lo cual es el comportamiento normal del resto de navegadores). Para corregir esto necesitamos añadir explícitamente la altura a los campos de la siguiente forma:</p>
-
-<pre class="brush: css">input {
-    height: 2.5em; /* for IE */
-    vertical-align: middle; /* This is optional but it makes legacy IEs look better */
-}</pre>
-
-<p>Los elementos <code style="color: rgb(153, 0, 0); line-height: 23.3333339691162px;"><a class="new" href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/textarea" style="color: rgb(153, 0, 0); line-height: 23.3333339691162px;" title="This article hasn't been written yet. Please consider contributing!">&lt;textarea&gt;</a> </code>se muestran por defecto como bloques, Las dos cosas importantes aquí son las propiedades  <a class="new" href="https://developer.mozilla.org/es/docs/Web/CSS/resize" style="color: rgb(153, 0, 0); line-height: 19.0909080505371px;" title="The documentation about this has not yet been written; please consider contributing!"><code>resize</code></a><span style="line-height: 19.0909080505371px;"> y </span><code style="line-height: 19.0909080505371px;"><a href="https://developer.mozilla.org/es/docs/Web/CSS/overflow" style="line-height: 19.0909080505371px;" title="La propiedad CSS overflow  especifica: si recortar contenido, dibujar barras de desplazamiento o mostrar el contenido excedente en un elemento a nivel de bloque.">overflow</a>. </code>Ya que nuestro <code style="line-height: 19.0909080505371px;">diseño </code>es de tamaño fijo, utilizaremos la propiedad <code>resize</code> para impedir que el usuario pueda cambiar el tamaño de los campos multilínea. La propiedad <span style="line-height: 19.0909080505371px;"> </span><a href="https://developer.mozilla.org/es/docs/Web/CSS/overflow" style="line-height: 19.0909080505371px;" title="La propiedad CSS overflow  especifica: si recortar contenido, dibujar barras de desplazamiento o mostrar el contenido excedente en un elemento a nivel de bloque."><code>overflow</code></a><span style="line-height: 19.0909080505371px;"> </span> se utiliza para que el campo se muestre de forma más consistente a través de diversos navegadores; algunos de ellos ponen por defecto esta propiedad en <code>auto</code>, pero en nuestro caso, es mejor asegurarse de que todos estén en <code>auto.</code></p>
-
-<pre class="brush: css">textarea {
-  display : block;
-
-  padding : 10px;
-  margin  : 10px 0 0 -10px;
-  width   : 340px;
-  height  : 360px;
-
-  resize  : none;
-  overflow: auto;
-}</pre>
-
-<p>El elemento <code style="line-height: 19.0909080505371px;"><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/button" style="line-height: 19.0909080505371px;" title="This article hasn't been written yet. Please consider contributing!">&lt;button&gt;</a> </code>se acomoda muy bien a CSS; se puede hacer lo que se quiera con el, ¡incluso utilizando<code style="line-height: 19.0909080505371px;"> <a href="https://developer.mozilla.org/en-US/docs/CSS/Pseudo-elements">pseudo-elementos</a>!</code></p>
-
-<pre class="brush: css">button {
-  position     : absolute;
-  left         : 440px;
-  top          : 360px;
-
-  padding      : 5px;
-
-  font         : bold .6em sans-serif;
-  border       : 2px solid #333;
-  border-radius: 5px;
-  background   : none;
-
-  cursor       : pointer;
-
--webkit-transform: rotate(-1.5deg);
-   -moz-transform: rotate(-1.5deg);
-    -ms-transform: rotate(-1.5deg);
-     -o-transform: rotate(-1.5deg);
-        transform: rotate(-1.5deg);
-}
-
-button:after {
-  content: " &gt;&gt;&gt;";
-}
-
-button:hover,
-button:focus {
-  outline   : none;
-  background: #000;
-  color   : #FFF;
-}</pre>
-
-<p>Y ¡listo! Sientase libre de probarlo usted mismo; como comprobará ¡esto funciona!</p>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>Como puede verse, mientras que queramos construir formularios solo con campos de texto y botones, es sencillo aplicarles estilos con CSS. Si desea saber más pequeños trucos de CSS que le hagan más fácil la vida al trabajar con formularios, echele un vistazo a la parte de formularios de <a href="http://necolas.github.com/normalize.css" rel="external" style="line-height: 19.0909080505371px;" title="http://necolas.github.com/normalize.css">the normalize.css project</a><span style="line-height: 19.0909080505371px;">.</span></p>
-
-<p><span style="line-height: 19.0909080505371px;">En el próximo artículo, veremos como manejar widgets de formulario de la categoría de "el malo" y "el feo".</span></p>
diff --git a/files/es/learn/html/forms/the_native_form_widgets/index.html b/files/es/learn/html/forms/the_native_form_widgets/index.html
deleted file mode 100644
index c8a2651837..0000000000
--- a/files/es/learn/html/forms/the_native_form_widgets/index.html
+++ /dev/null
@@ -1,326 +0,0 @@
----
-title: Controles de formulario originales
-slug: Learn/HTML/Forms/The_native_form_widgets
-translation_of: Learn/Forms/Basic_native_form_controls
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Forms/How_to_structure_an_HTML_form", "Learn/Forms/HTML5_input_types", "Learn/Forms")}}</div>
-
-<p class="summary">En el <a href="/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">artículo anterior</a>, marcamos un ejemplo de formulario web funcional, presentamos algunos controles de formulario y elementos estructurales comunes, y nos centramos en las mejores prácticas de accesibilidad. A continuación, veremos con detalle las funciones de los diferentes controles de formulario, o <em>widgets</em>, y estudiaremos todas las diferentes opciones de que se dispone para la recopilación de diferentes tipos de datos. En este artículo en particular, veremos el conjunto original de controles de formulario, disponible en todos los navegadores desde los primeros días de la web.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática y de <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">lenguaje HTML</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender en detalle el conjunto original de controles de formulario originales disponibles en los navegadores para la recopilación de datos y su implementación con HTML.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Ya conoces algunos elementos de formulario, incluidos {{HTMLelement ('form')}}, {{HTMLelement ('fieldset')}}, {{HTMLelement ('legend')}}, {{HTMLelement ('textarea' )}}, {{HTMLelement ('label')}}, {{HTMLelement ('button')}} y {{HTMLelement ('input')}}. Este artículo expone:</p>
-
-<ul>
- <li>Los tipos de entrada comunes {{HTMLelement('input/button', 'button')}}, {{HTMLelement('input/checkbox', 'checkbox')}}, {{HTMLelement('input/file', 'file')}}, {{HTMLelement('input/hidden', 'hidden')}}, {{HTMLelement('input/image', 'image')}}, {{HTMLelement('input/password', 'password')}}, {{HTMLelement('input/radio', 'radio')}}, {{HTMLelement('input/reset', 'reset')}}, {{HTMLelement('input/submit', 'submit')}} y {{HTMLelement('input/text', 'text')}}.</li>
- <li>Algunos de los atributos que comunes para todos los controles de formulario.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Las características que se consideran en este artículo son compatibles con todos los navegadores, lo que no es el caso para todos los controles de formulario. En los próximos dos artículos vamos a exponer los controles de formulario que se han añadido a HTML5 más recientemente. Si quieres una referencia más avanzada, consulta nuestra <a href="/es/docs/Web/HTML/Elemento#Formularios">referencia a elementos de formulario HTML</a>, y en particular nuestra extensa referencia a <a href="/es/docs/Web/HTML/Elemento/input">tipos &lt;input&gt;</a>.</p>
-</div>
-
-<h2 id="Campos_de_entrada_de_texto">Campos de entrada de texto</h2>
-
-<p>Los campos de texto {{htmlelement ("input")}} son los controles de formulario más básicos. Son un modo muy cómodo de permitir al usuario introducir cualquier tipo de datos, y ya hemos visto algunos ejemplos sencillos.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Los campos de texto de los formularios HTML son controles de entrada de texto sencillos sin formato. Esto significa que no puedes usarlos para aplicar una <a href="/en-US/docs/Rich-Text_Editing_in_Mozilla" title="/en-US/docs/Rich-Text_Editing_in_Mozilla">edición enriquecida </a> (negrita, cursiva, etc.). Todos los controles de formulario que encuentres con texto enriquecido son controles de formulario personalizados creados con HTML, CSS y JavaScript.</p>
-</div>
-
-<p>Todos los controles de texto básicos comparten algunos comportamientos comunes:</p>
-
-<ul>
- <li>Se pueden marcar como {{htmlattrxref ("readonly","input")}} (el usuario no puede modificar el valor de entrada, pero este se envía con el resto de los datos del formulario) o {{htmlattrxref ("disabled","input")}} (el valor de entrada no se puede modificar y nunca se envía con el resto de los datos del formulario).</li>
- <li>Pueden tener un {{htmlattrxref ("placeholder","input")}}; se trata de un texto que aparece dentro de la caja de entrada de texto y que se usa para describir brevemente el propósito de la caja de texto.</li>
- <li>Pueden presentar una limitación de <a href="/en-US/docs/Web/HTML/Attributes/size">tamaño</a> (el tamaño físico de la caja de texto) y de la <a href="/en-US/docs/Web/HTML/Attributes/maxlength" title="/en-US/docs/HTML/Element/input#attr-maxlength">extensión máxima</a> (el número máximo de caracteres que se pueden poner en la caja de texto).</li>
- <li>Admiten <a href="/en-US/docs/HTML/Element/input#attr-spellcheck" title="/en-US/docs/HTML/Element/input#attr-spellcheck"> corrección ortográfica</a> (utilizando el atributo <a href="/en-US/docs/Web/HTML/Attributes/spellcheck"><code>spellcheck</code></a>), si el navegador la admite.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: El elemento {{htmlelement ("input")}} es único entre los elementos HTML porque puede tomar muchas formas diferentes según el valor de su atributo. Se utiliza para crear la mayoría de los tipos de controles de formulario, que incluyen campos de texto de una sola línea, controles para la fecha y la hora, controles sin introducción de texto, como casillas de verificación, botones de opción y selectores de color, y botones.</p>
-</div>
-
-<h3 id="Campos_de_texto_de_una_sola_línea">Campos de texto de una sola línea</h3>
-
-<p>Un campo de texto de una sola línea se crea utilizando un elemento {{HTMLElement ("input")}} cuyo valor de atributo {{htmlattrxref ("type","input")}} se establece en <code>text</code>, u omitiendo por completo el atributo {{htmlattrxref ( "type","input")}} (<code>text</code> es el valor predeterminado). El valor <code>text</code> de este atributo también es el valor alternativo si el navegador no reconoce el valor que has especificado para el atributo {{htmlattrxref ("type","input")}} (por ejemplo, si especificas <code>type="color"</code> y el navegador no está dotado en origen de un control de selección de colores).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar ejemplos de todos los tipos de campo de texto de una sola línea en GitHub en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/native-form-widgets/single-line-text-fields.html">single-line-text-fields.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/native-form-widgets/single-line-text-fields.html">o consultarlo en vivo</a>).</p>
-</div>
-
-<p>Aquí hay un ejemplo básico de campo de texto de una sola línea:</p>
-
-<pre class="brush: html notranslate">&lt;input type="text" id="comment" name="comment" value="I'm a text field"&gt;</pre>
-
-<p>Los campos de texto de una sola línea solo tienen una restricción verdadera: si escribes el texto con saltos de línea, el navegador elimina esos saltos de línea antes de enviar los datos al servidor.</p>
-
-<p><em>La captura de pantalla siguiente muestra los tipos de entrada de texto predeterminado, activo (con el foco) y deshabilitado en Firefox 71 y Safari en macOS y en Chrome 79 y Edge 18 en Windows 10.</em></p>
-
-<p><img alt="Captura de pantalla del atributo deshabilitado y predeterminado: estilo para  una entrada de texto activa (con el foco) en Firefox, Safari, Chrome y Edge." src="https://mdn.mozillademos.org/files/17021/disabled.png" style="height: 113px; width: 442px;"></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: HTML5 ha mejorado el campo de texto básico original de una sola línea al añadir valores especiales para el atributo {{htmlattrxref ("type", "input")}} que imponen restricciones de validación específicas y otras características, por ejemplo, específicas para introducir direcciones URL o números. Los expondremos en el artículo siguiente: <a href="/en-US/docs/Learn/Forms/HTML5_input_types">Los tipos de entrada en HTML5</a>.</p>
-</div>
-
-<h4 id="Campo_de_contraseña">Campo de contraseña</h4>
-
-<p>Uno de los tipos de entrada originales era el tipo de campo de texto <code>password</code>:</p>
-
-<pre class="brush: html notranslate">&lt;input type="password" id="pwd" name="pwd"&gt;</pre>
-
-<p>El valor de la contraseña no añade restricciones especiales al texto que se introduce, pero oculta el valor que se introduce en el campo (por ejemplo, con puntos o asteriscos) para impedir que otros puedan leerlo.</p>
-
-<p>Ten en cuenta que esto es solo una función de interfaz de usuario; a menos que envíes tu formulario en modo seguro, se enviará como texto plano, lo que es malo desde el punto de vista de la seguridad porque alguien con malas intenciones podría interceptar tus datos y robar tus contraseñas, datos de tarjetas de crédito o cualquier otra cosa que hayas enviado. La mejor manera de proteger a los usuarios de esto es alojar cualquier página que contenga formularios en una ubicación de conexión segura (es decir, en una dirección <code>https://</code>), de modo que los datos se cifren antes de enviarse.</p>
-
-<p>Los navegadores reconocen las implicaciones de seguridad de enviar datos de formulario por una conexión insegura y disponen de mensajes de advertencia para disuadir a los usuarios de usar formularios no seguros. Para obtener más información sobre las implementaciones de Firefox al respecto, consulta el artículo <a href="/es/docs/Seguridad/ContraseñasInseguras">Contraseñas inseguras</a>.</p>
-
-<h3 id="Contenido_oculto">Contenido oculto</h3>
-
-<p>Otro control de texto original es el tipo de entrada <code>hidden</code>. Se usa para crear un control de formulario que es invisible para el usuario, pero que aun así se envía al servidor junto con el resto de los datos del formulario una vez se transmiten; por ejemplo, es posible que desees enviar una marca de tiempo al servidor que indique cuándo se realizó un pedido. Al estar oculto, el usuario no puede ver ni editar su valor intencionadamente, el control nunca recibirá el foco y un lector de pantalla tampoco lo detectará.</p>
-
-<pre class="brush: html notranslate">&lt;input type="hidden" id="timestamp" name="timestamp" value="1286705410"&gt;
-</pre>
-
-<p>Si creas un elemento así, es necesario establecer sus atributos <code>name</code> y <code>value</code>. Su valor puede establecerse dinámicamente a través de JavaScript. El tipo de entrada oculta no debe tener ninguna etiqueta asociada.</p>
-
-<p>Otros tipos de entrada de texto, como {{HTMLElement ("input / search", "search")}}, {{HTMLElement ("input / url", "url")}} y {{HTMLElement ("input / tel" , "tel")}}, se añadieron con HTML5. Se tratarán en el próximo artículo: Tipos de entrada HTML5.</p>
-
-<h2 id="Elementos_de_selección_casillas_de_verificación_y_botones_de_opción">Elementos de selección: casillas de verificación y botones de opción</h2>
-
-<p>Los elementos de selección (o <em>checkable items</em>, en inglés) son controles cuyo estado puede cambiar cuando se hace clic en ellos o en sus etiquetas asociadas. Hay dos tipos de elementos de selección: las casillas de verificación (o <em>check boxes</em>) y los botones de opción (o <em>radio buttons</em>). Ambos usan el atributo <code>checked</code> para indicar si el control de formulario está seleccionado por defecto o no.</p>
-
-<p>Vale la pena señalar que estos controles no se comportan exactamente como otros controles de formulario. Para la mayoría de los controles de formulario, cuando se envía el formulario, se envían todos los controles que tienen un atributo <a href="/en-US/docs/Web/HTML/Attributes/name"><code>name</code></a>, incluso si en ellos no se ha introducido ningún valor. En el caso de elementos de selección, sus valores se envían solo si están seleccionados. Si no están seleccionados, no se envía nada, ni siquiera su nombre. Si están seleccionados pero no tienen ningún valor asignado, el nombre se envía con el valor <em>on.</em></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar los ejemplos de esta sección en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/forms/native-form-widgets/checkable-items.html">checkable-items.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/native-form-widgets/checkable-items.html">o consultarlos en vivo</a>).</p>
-</div>
-
-<p>Para una usabilidad/accesibilidad óptima, te recomendamos delimitar cada lista de elementos que estén relacionados entre sí dentro de un elemento {{htmlelement ("fieldset")}} con un elemento {{htmlelement ("legend")}} que proporcione una descripción general de la lista. Cada par individual de elementos {{htmlelement ("label")}}/{{htmlelement ("input")}} ha de estar contenido en un elemento de lista propio (o similar). El elemento {{htmlelement ('label')}} asociado se coloca en general inmediatamente después del botón de opción o la casilla de verificación, con las instrucciones para el grupo de botones de opción o casillas de verificación, que suelen ser el contenido del elemento {{htmlelement ("legend")}}. Observa las estructuras de ejemplo en los ejemplos asociados anteriores.</p>
-
-<h3 id="Casillas_de_verificación">Casillas de verificación</h3>
-
-<p>Las casillas de verificación se crean estableciendo el atributo <a href="/en-US/docs/Web/HTML/Attributes/type"><code>type</code></a> del elemento {{HTMLElement ("input")}} en el valor {{HTMLElement ("input / checkbox", "checkbox")}}.</p>
-
-<pre class="brush: html notranslate">&lt;input type="checkbox" id="carrots" name="carrots" value="carrots" checked&gt;
-</pre>
-
-<p>Al incluir el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/checked">checked</a></code>, la casilla de verificación se marca automáticamente cuando se carga la página. Al hacer clic en la casilla de verificación o en su etiqueta asociada, la casilla de verificación se activa o desactiva.</p>
-
-<p>Las capturas de pantalla siguientes muestran casillas de verificación predeterminadas, activas (con el foco) y deshabilitadas en Firefox 71 y Safari 13 en macOS y Chrome 79 y Edge 18 en Windows 10:</p>
-
-<p><img alt="Casillas de verificación predeterminadas, activas y deshabilitadas en Firefox 71 y Safari 13 en Mac y Chrome 79 y Edge 18 en Windows 10" src="https://mdn.mozillademos.org/files/17024/checkboxes.png" style="height: 203px; width: 293px;"></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Las casillas de verificación y los botones de opción con atributo <code><a href="/en-US/docs/Web/HTML/Attributes/checked">checked</a></code> al cargarse coinciden con la pseudoclase {{cssxref ('<code>:default</code>')}}, incluso aunque ya no estén seleccionadas. Las que están seleccionadas coinciden con la pseudoclase <code>{{cssxref(':checked')}}</code>.</p>
-</div>
-
-<p id="Radio_button">Debido a su naturaleza activa-inactiva, las casillas de verificación se consideran botones de conmutación, y muchos desarrolladores y diseñadores han ampliado el estilo de casilla de verificación predeterminado para crear botones que parecen interruptores de conmutación. Aquí puedes ver un <a href="https://mdn.github.io/learning-area/html/forms/toggle-switch-example/">ejemplo en acción</a> (observa también el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/toggle-switch-example/index.html">código fuente</a>).</p>
-
-<h3 id="Botón_de_opción">Botón de opción</h3>
-
-<p>Un botón de opción se crea estableciendo el atributo {{htmlattrxref ("type", "input")}} del elemento {{HTMLElement ("input")}} en el valor <code>radio</code>:</p>
-
-<pre class="brush: html notranslate">&lt;input type="radio" id="soup" name="meal" checked&gt;</pre>
-
-<p>Es posible asociar diversos botones de opción. Si comparten el mismo valor de atributo {{htmlattrxref ("name", "input")}}, se considera que están en el mismo grupo de botones. Solo un botón dentro de un grupo puede estar activado en cada momento. Esto significa que cuando uno de ellos se selecciona, todos los demás se deseleccionan automáticamente. Al enviar el formulario, solo se envía el valor del botón de opción seleccionado. Si ninguno de ellos está seleccionado, se considera que el conjunto completo de botones de opción está en un estado desconocido y no se envía ningún valor con el formulario. Cuando en un grupo de botones con el mismo nombre se selecciona uno de los botones de opción, no es posible deseleccionar todos los botones sin reiniciar el formulario.</p>
-
-<pre class="brush: html notranslate">&lt;fieldset&gt;
-  &lt;legend&gt;¿Cuál es tu comida favorita?&lt;/legend&gt;
-  &lt;ul&gt;
-    &lt;li&gt;
-      &lt;label for="soup"&gt;Sopa&lt;/label&gt;
-      &lt;input type="radio" id="soup" name="meal" value="soup" checked&gt;
-    &lt;/li&gt;
-    &lt;li&gt;
-      &lt;label for="curry"&gt;Curry&lt;/label&gt;
-      &lt;input type="radio" id="curry" name="meal" value="curry"&gt;
-    &lt;/li&gt;
-    &lt;li&gt;
-      &lt;label for="pizza"&gt;Pizza&lt;/label&gt;
-      &lt;input type="radio" id="pizza" name="meal" value="pizza"&gt;
-    &lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/fieldset&gt;</pre>
-
-<p>Las capturas de pantalla siguientes muestran botones de opción sin seleccionar y seleccionados, algunos con el foco y otros desactivados sin seleccionar y seleccionados, en Firefox 71 y Safari 13 en MacOS y Chrome 79 y Edge 18 en Windows 10.</p>
-
-<p><img alt="Botones de opción en Firefox 71 y Safari 13 en Mac y Chrome 79 y Edge 18 en Windows 10" src="https://mdn.mozillademos.org/files/17022/radios.png" style="height: 142px; width: 196px;"></p>
-
-<h2 id="Botones">Botones</h2>
-
-<p>El botón de opción no es realmente un botón, a pesar de su nombre; sigamos adelante y echemos un vistazo a los controles de formulario que son botones propiamente. Hay tres tipos de entrada según el tipo de botones que se utilicen:</p>
-
-<dl>
- <dt><code>submit</code></dt>
- <dd>Envía los datos del formulario al servidor. Para los elementos {{HTMLElement ("button")}}, omitir el atributo <code>type</code> (o introducir un valor de tipo no válido) da como resultado un botón de envío (<em>submit</em>).</dd>
- <dt><code>reset</code></dt>
- <dd>Restablece todos los controles de formulario a sus valores por defecto.</dd>
- <dt><code>button</code></dt>
- <dd>Botones que no tienen efecto automático, pero que se pueden personalizar con código JavaScript.</dd>
-</dl>
-
-<p>Además, el elemento {{htmlelement ("button")}} puede tomar un atributo <code>type</code> para imitar estos tres tipos de entrada. La diferencia principal entre los dos es que los elementos <code>&lt;button&gt;</code> propiamente admiten aplicación de estilo en mayor medida.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: El tipo de entrada <code>image</code> también se representa como un botón. También desarrollaremos este tema más adelante.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar los ejemplos de esta sección en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/forms/native-form-widgets/button-examples.html">button-examples.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/native-form-widgets/button-examples.html">o consultarlos en vivo</a>).</p>
-</div>
-
-<p>A continuación puedes encontrar ejemplos de cada tipo de botón <code>&lt;input&gt;</code>, junto con el tipo de botón equivalente.</p>
-
-<h3 id="enviar">enviar</h3>
-
-<pre class="brush: html notranslate">&lt;button type="submit"&gt;
-    Este es un &lt;strong&gt;botón de envío&lt;/strong&gt;
-&lt;/button&gt;
-
-&lt;input type="submit" value="Este es un botón de envío"&gt;</pre>
-
-<h3 id="reiniciar">reiniciar</h3>
-
-<pre class="brush: html notranslate">&lt;button type="reset"&gt;
-    Este es un &lt;strong&gt;botón de reinicio&lt;/strong&gt;
-&lt;/button&gt;
-
-&lt;input type="reset" value="Este es un botón de reinicio"&gt;</pre>
-
-<h3 id="anónimo">anónimo</h3>
-
-<pre class="brush: html notranslate">&lt;button type="button"&gt;
-    Este es un &lt;strong&gt;botón anónimo&lt;/strong&gt;
-&lt;/button&gt;
-
-&lt;input type="button" value="Este es un botón anónimo"&gt;</pre>
-
-<p>Los botones siempre se comportan igual, independientemente de su usas un elemento {{HTMLElement ("button")}} o un elemento {{HTMLElement ("input")}}. Sin embargo, como puedes ver en los ejemplos, los elementos {{HTMLElement ("button")}} te permiten usar HTML en tu contenido, que se inserta entre las etiquetas <code>&lt;button&gt;</code> de apertura y cierre. Los elementos {{HTMLElement ("input")}}, por otro lado, son elementos vacíos; el contenido que muestran está inserto en el atributo <code>value</code> y, por lo tanto, solo acepta contenido de texto sin formato.</p>
-
-<p>Los ejemplos siguientes muestran los tipos de entrada de botones predeterminados, activos y deshabilitados: en Firefox 71 y Safari 13 en macOS, y Chrome 79 y Edge 18 en Windows 10.</p>
-
-<p><img alt="Tipos de entrada de botones predeterminados, activos y deshabilitados en Firefox 71 y Safari 13 en Mac y Chrome 79 y Edge 18 en Windows 10" src="https://mdn.mozillademos.org/files/17023/buttons.png" style="height: 182px; width: 286px;"></p>
-
-<h3 id="Botón_de_imagen">Botón de imagen</h3>
-
-<p>El control <strong>botón de imagen</strong> se muestra exactamente como un elemento {{HTMLElement ("img")}}, excepto que cuando el usuario hace clic en él, se comporta como un botón de envío.</p>
-
-<p>Se crea un botón de imagen usando un elemento {{HTMLElement ("input")}} con su atributo {{htmlattrxref ("type","input")}} establecido en el valor <code>image</code>. Este elemento admite exactamente el mismo conjunto de atributos que el elemento {{HTMLElement ("img")}}, además de todos los atributos que admiten el resto de botones de formulario.</p>
-
-<pre class="brush: html notranslate">&lt;input type="image" alt="¡Púlsame!" src="my-img.png" width="80" height="30"&gt;</pre>
-
-<p>Si el botón de imagen se usa para enviar un formulario, este control no envía su valor; en lugar de ello se envían las coordenadas X e Y del clic que se ha hecho sobre la imagen (las coordenadas son relativas a la imagen, lo que significa que la esquina superior izquierda de la imagen representa la coordenada (0, 0)). Las coordenadas se envían como dos pares clave/valor:</p>
-
-<ul>
- <li>La clave del valor X es el valor del atributo {{htmlattrxref ("name","input")}} seguido de la cadena de caracteres «<em>.x</em>».</li>
- <li>La clave del valor Y es el valor del atributo {{htmlattrxref ("name","input")}} seguido de la cadena de caracteres «<em>.y</em>».</li>
-</ul>
-
-<p>Por ejemplo, cuando haces clic en las coordenadas (123, 456) de la imagen y se hace el envío por el método <code>get</code>, verás los valores añadidos a la URL de la manera siguiente:</p>
-
-<pre class="notranslate">http://foo.com?pos.x=123&amp;pos.y=456</pre>
-
-<p>Esta es una forma muy cómoda de construir un «mapa dinámico». La forma en que se envían y recuperan estos valores se detalla en el artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos del formulario</a>.</p>
-
-<h2 id="Selector_de_archivos">Selector de archivos</h2>
-
-<p>Hay un último tipo de <code>&lt;input&gt;</code> que nos llegó a principios del HTML: el tipo entrada de archivo. Los formularios pueden enviar archivos a un servidor (esta acción específica también se detalla en el artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos del formulario</a>). El control de selección de archivos se puede usar para elegir uno o más archivos para enviar.</p>
-
-<p>Para crear un <a href="/en-US/docs/Web/HTML/Element/input/file">control de selección de archivos</a>, utilizas el elemento {{HTMLElement ("input")}} con su atributo {{htmlattrxref ("type","input")}} establecido en <code>file</code>. Es posible restringir los tipos de archivos que se aceptan utilizando el atributo {{htmlattrxref ("accept","input")}}. Además, puedes permitir que el usuario elija más de un archivo añadiendo el atributo {{htmlattrxref ("multiple","input")}}.</p>
-
-<h4 id="Ejemplo">Ejemplo</h4>
-
-<p>En este ejemplo, se crea un control de selección de archivos que solicita archivos de imágenes gráficas. El usuario puede seleccionar múltiples archivos en este caso.</p>
-
-<pre class="brush: html notranslate">&lt;input type="file" name="file" id="file" accept="image/*" multiple&gt;</pre>
-
-<p>En algunos dispositivos móviles, el control de selección de archivos puede acceder a fotos, vídeos y audio capturados directamente por la cámara y el micrófono del dispositivo y añadir información de captura al atributo <code>accept</code> de la manera siguiente:</p>
-
-<pre class="notranslate">&lt;input type="file" accept="image/*;capture=camera"&gt;
-&lt;input type="file" accept="video/*;capture=camcorder"&gt;
-&lt;input type="file" accept="audio/*;capture=microphone"&gt;</pre>
-
-<h2 id="Atributos_comunes">Atributos comunes</h2>
-
-<p>Muchos de los elementos que se utilizan para definir controles de formulario tienen sus atributos específicos propios. Sin embargo, hay un conjunto de atributos que son comunes para todos los elementos de formulario. Ya has conocido algunos, pero a continuación encontrarás una lista de esos atributos comunes para referencias futuras:</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Nombre del atributo</th>
-   <th scope="col">Valor por defecto</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code><a href="/en-US/docs/Web/HTML/Attributes/autofocus">autofocus</a></code></td>
-   <td>false</td>
-   <td>Este atributo booleano te permite especificar que el elemento ha de tener el foco de entrada automáticamente cuando se carga la página. En un documento, solo un elemento asociado a un formulario puede tener este atributo especificado.</td>
-  </tr>
-  <tr>
-   <td><code><a href="/en-US/docs/Web/HTML/Attributes/disabled">disabled</a></code></td>
-   <td>false</td>
-   <td>Este atributo booleano indica que el usuario no puede interactuar con el elemento. Si no se especifica este atributo, el elemento hereda su configuración del elemento que lo contiene, por ejemplo, {{HTMLElement ("fieldset")}}. Si el elemento que lo contiene no tiene el atributo establecido en <code>disabled</code>, el elemento está habilitado.</td>
-  </tr>
-  <tr>
-   <td><code><a href="/en-US/docs/Web/HTML/Attributes/form">form</a></code></td>
-   <td></td>
-   <td>El elemento <code>&lt;form&gt;</code> con el que está asociado el control, que se usa cuando no está anidado dentro de ese formulario. El valor del atributo debe ser el atributo <code>id</code> de un elemento {{HTMLElement ("form")}} del mismo documento. Esto te permite asociar un formulario con un control de formulario que esté fuera de aquel, incluso si está dentro de un elemento de formulario diferente.</td>
-  </tr>
-  <tr>
-   <td><code><a href="/en-US/docs/Web/HTML/Attributes/name">name</a></code></td>
-   <td></td>
-   <td>El nombre del elemento; se envía con los datos del formulario.</td>
-  </tr>
-  <tr>
-   <td><code><a href="/en-US/docs/Web/HTML/Attributes/value">value</a></code></td>
-   <td></td>
-   <td>El valor inicial del elemento.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>Este artículo ha expuesto los tipos de entrada más antiguos: el conjunto original que se introdujo en los primeros días de HTML, que es compatible con todos los navegadores. En el artículo siguiente veremos los valores del atributo <code>type</code> que se han añadido en HTML5 más recientemente.</p>
-
-<p>{{PreviousMenuNext("Learn/Forms/How_to_structure_an_HTML_form", "Learn/Forms/HTML5_input_types", "Learn/Forms")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form">Tu primer formulario HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/The_native_form_widgets">Los controles básicos de formulario originales</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/HTML5_input_types">Tipos de entrada HTML5</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Additional_form_controls">Controles de formulario adicionales</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/UI_pseudo-classes">Pseudoclases UI</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Styling_HTML_forms">Aplicar estilo a formularios HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Validación de datos en un formulario</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
-</ul>
-
-<h3 id="Temas_avanzados">Temas avanzados</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript">Enviar formularios con JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_build_custom_form_widgets">Cómo crear widgets de formularios personalizados</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/HTML_forms_in_legacy_browsers">Formularios HTML en navegadores antiguos</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms">Cuestiones avanzadas de aplicación de estilo para formularios HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de los controles de formulario</a></li>
-</ul>
diff --git a/files/es/learn/html/forms/tipos_input_html5/index.html b/files/es/learn/html/forms/tipos_input_html5/index.html
deleted file mode 100644
index d463399e93..0000000000
--- a/files/es/learn/html/forms/tipos_input_html5/index.html
+++ /dev/null
@@ -1,276 +0,0 @@
----
-title: Tipos de input de HTML5
-slug: Learn/HTML/Forms/Tipos_input_HTML5
-translation_of: Learn/Forms/HTML5_input_types
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Forms/Basic_native_form_controls", "Learn/Forms/Other_form_controls", "Learn/Forms")}}</div>
-
-<p class="summary">En el <a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">artículo anterior</a> vimos el elemento {{htmlelement("input")}} y los valores de su atributo <code>type</code>, disponibles desde los inicios de HTML. Ahora veremos en detalle la funcionalidad de los controles de formulario más recientes, incluyendo algunos tipos de input nuevos, los cuales fueron añadidos en HTML5 para permitir la recolección de tipos de datos específicos</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Requisitos previos:</th>
-   <td>Formación básica en informática, y una <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML">comprensión básica de HTML</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Entender los valores de tipo input disponibles más recientes para crear controles de formulario nativos, y cómo implementarlos utilizando HTML.</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: La mayoría de las características discutidas en este artículo tienen un amplio soporte en todos los navegadores, anotaremos cualquier excepción. Si quieres más detalles referente al soporte de navegadores, deberías consultar nuestra <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element#Forms">referéncia de elementos de formulario HTML</a>, y en particular nuestra referéncia extensiva de <a href="/en-US/docs/Web/HTML/Element/input">Tipos de &lt;input&gt;</a>.</p>
-</div>
-
-<p>Debido a que la apariéncia de un control de formulario puede ser algo distinta con respecto a unas especificaciones del diseñador, los desarrolladores web a veces construyen sus propios controles de formulario personalizados. Cubrimos este aspecto en un tutorial avanzado: <a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_widgets">Cómo construir widgets de formulario personalizados</a>.</p>
-
-<h2 id="Campo_de_dirección_de_correo_electrónico">Campo de dirección de correo electrónico</h2>
-
-<p>Este tipo de campo se define utilizando el valor  <code>email</code> en el atributo {{htmlattrxref("type","input")}} del elemento &lt;input&gt;:</p>
-
-<pre class="brush: html notranslate">&lt;input type="email" id="email" name="email"&gt;</pre>
-
-<p>Cuando se utiliza este valor {{htmlattrxref("type","input")}} , se le obliga al usuario a escribir dentro del campo una dirección de correo electrónico válida. Cualquier otro contenido ocasiona que el navegador muestre un mensaje de error cuando se envía el formulario. Puedes verlo en acción en la siguiente captura de pantalla</p>
-
-<p><img alt='An invalid email input showing the message "Please enter an email address."' src="https://mdn.mozillademos.org/files/17027/email_address_invalid.png" style="display: block; height: 224px; margin: 0 auto; width: 369px;"></p>
-
-<p>Puedes utilizar también el atributo <a href="/en-US/docs/Web/HTML/Attributes/multiple"><code>multiple</code></a> en combinación con el tipo input<code>email</code> para permitir que sean introducidas varias direcciones de correo electrónico separadas por comas en el mismo input:</p>
-
-<pre class="brush: html notranslate">&lt;input type="email" id="email" name="email" multiple&gt;</pre>
-
-<p>En algunos dispositivos, en particular dispositivos táctiles con teclados dinámicos como los smart phones, debería presentarse un teclado virtual que es más adecuado para introducir direcciones de correo electrónico, incluyendo la tecla <code>@</code>. Mira como ejemplo la siguiente captura de pantalla del teclado de Firefox para Android:</p>
-
-<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17054/fx-android-email-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 324px; margin: 0 auto; width: 400px;"></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar ejemplos sobre los tipos de entrada de texto básicos en <a href="https://mdn.github.io/learning-area/html/forms/basic-input-examples/">Ejemplos input básicos</a> (Consulta también el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/basic-input-examples/index.html">código fuente</a>).</p>
-</div>
-
-<p>Mejorar la experiéncia del usuario para usuarios con estos dispositivos, es otra buena razón para utilizar estos tipos de input más recientes.</p>
-
-<h3 id="Validación_del_lado_cliente">Validación del lado cliente</h3>
-
-<p>Como puedes haber visto anteriormente, <code>email</code>, junto con otros tipos de <code>input</code> más recientes, proporciona la validación de errores <em>en el lado cliente</em> de forma predeterminada, realizados por el navegador antes de que los datos obtenidos se envíen al servidor. <em>Es</em> una ayuda útil guiar a los usuarios a rellenar un formulario de forma precisa y puede ahorrar tiempo: es útil saber de inmediato que tu dato no es correcto, en vez de tener que esperar el viaje de ida y vuelta al servidor.</p>
-
-<p>Pero <em>no debería ser considerado</em> una medida de seguridad exhaustiva! Tus aplicaciones siempre deben realizar comprobaciones de seguridad en cada dato, tanto en el <em>lado servidor</em> como en el lado cliente debido a que la validación en el lado cliente es muy fácil desactivarla, por lo que usuarios malintencionados pueden enviar fácilmente datos incorrectos al servidor. Lee <a href="/en-US/docs/Learn/Server-side/First_steps/Website_security">Seguridad en el sitio web</a> para tener una idea de lo que <em>podría</em> ocurrir; Implementar validación en el lado servidor está más allá del alcance de este módulo-guía, pero debería tenerlo en cuenta.</p>
-
-<p>Ten en cuenta que <code>a@b</code> es una dirección de correo electrónico válida de acuerdo a las restricciones proporcionadaas por defecto. Esto es debido a que el tipo de input <code>email</code>, permite por defecto direcciones de correo electrónico de una intranet. Para implementar un comportamiento diferente de validación puedes utilizar el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/pattern">pattern</a></code>, y también puedes utilizar mensajes de error personalizados; Hablaremos de cómo utilizar estas características en <a href="/en-US/docs/Learn/Forms/Form_validation">Validación de formularios en el lado cliente</a> en un artículo posterior.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si los datos introducidos no son una dirección de correo electrónico, habrá coincidéncia con la pseudo clase {{cssxref(':invalid')}}, y la propiedad {{domxref('validityState.typeMismatch')}} devolverá <code>true</code>.</p>
-</div>
-
-<h2 id="Campo_de_búsqueda">Campo de búsqueda</h2>
-
-<p>Los campos de búsqueda están destinados a ser utilizados para crear cajas de búsqueda en páginas y aplicaciones. Este tipo de campo se define utilizando el valor <code>search</code> en su atributo {{htmlattrxref("type","input")}}:</p>
-
-<pre class="brush: html notranslate">&lt;input type="search" id="search" name="search"&gt;</pre>
-
-<p>La diferéncia principal entre un campo <code>text</code> y un campo <code>search</code>, es la forma en que el navegador aplica estilo a su apariéncia. A menudo los campos <code>search</code> se muestran con bordes redondeados; y a veces también muestran una "Ⓧ", el cual despeja el campo de cualquier valor cuando se pulsa sobre él. Adicionalmente, en dispositivos con teclado dinámico, la tecla enter del teclado puede leer "<strong>search</strong>" o mostrar un icono de lupa.</p>
-
-<p>La captura de pantalla siguiente muestra un campo de búsqueda con contenido, en Firefox 71, Safari 13, y Chrome 79 en macOS, y Edge 18 y Chrome 79 en Windows 10. Ten en cuenta que el icono de reseteo sólo aparece si el campo tiene un valor y, aparte de Safari, sólo se muestra cuando el campo tiene el foco.</p>
-
-<p><img alt="Screenshots of search fields on several platforms." src="https://mdn.mozillademos.org/files/17028/search_focus.png" style="height: 179px; width: 549px;"></p>
-
-<p>Otra característica que vale la pena señalar es que se puede guardar los valores de un campo <code>search</code> automáticamente y reutilizarse en múltiples páginas del mismo sitio web para ofrecer autocompletado. Esta característica suele ocurrir de forma automática en la mayoría de navegadores modernos.</p>
-
-<h2 id="Campo_número_de_teléfono">Campo número de teléfono</h2>
-
-<p>Se puede crear un campo especial para introducir números de teléfono utilizando <code>tel</code> como valor del atributo {{htmlattrxref("type","input")}}:</p>
-
-<pre class="brush: html notranslate">&lt;input type="tel" id="tel" name="tel"&gt;</pre>
-
-<p>Cuando se accede desde un dispositivo táctil con teclados dinámicos, muchos de ellos mostrarán un teclado numérico cuando se encuentren con <code>type="tel"</code>, lo que significa que este tipo es útil no sólo para ser utilizado para números de teléfono, sino también cuando sea útil un teclado numérico.</p>
-
-<p>La siguiente captura de pantalla del teclado de Firefox para Android proporciona un ejemplo:</p>
-
-<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17056/fx-android-tel-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 276px; margin: 0px auto; width: 400px;"></p>
-
-<p>Debido a la gran variedad de formatos de número de teléfono existentes, este tipo de campo no cumple con ningún tipo de restricción sobre el valor introducido por el usuario. (Esto significa que puede incluir letras, etc...).</p>
-
-<p>Como mencionamos anteriormente, se puede utilizar el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/pattern">pattern</a></code> para que asuma restricciones, sobre el cuál aprenderemos en <a href="/en-US/docs/Learn/Forms/Form_validation">Validación de formulario en el lado cliente</a>.</p>
-
-<h2 id="Campo_URL">Campo URL</h2>
-
-<p>Se puede crear un tipo especial de campo para introducir URLs utilizando el valor <code>url</code> para el atributo {{htmlattrxref("type","input")}}:</p>
-
-<pre class="brush: html notranslate">&lt;input type="url" id="url" name="url"&gt;</pre>
-
-<p>Este tipo añade restricciones de validación en el campo. El navegador informará de un error si no se introdujo el protocolo (como <code>http:</code>), o si de algún modo el URL está mal formado. En dispositivos con teclados dinámicos a menudo mostrará por defecto algunas o todas las teclas como los dos puntos, el punto, y la barra inclinada.</p>
-
-<p>Mira el siguiente ejemplo tomado de Firefox para Android:</p>
-
-<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17057/fx-android-url-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 325px; margin: 0px auto; width: 400px;"></p>
-
-<div class="note"><strong>Nota:</strong> Solo porque el URL esté bien formado no significa necesariamente que la dirección al que hace referéncia exista!</div>
-
-<h2 id="Campo_numérico">Campo numérico</h2>
-
-<p>Se pueden crear controles para introducir números con el {{htmlattrxref("type","input")}} <code>number</code> de {{HTMLElement("input")}}. Este control se parece a un campo de texto pero solo permite números de punto flotante, y normalmente proporciona botones deslizadores para incrementar o reducir el valor del control. En dispositivos con teclados dinámicos generalmente se muestra el teclado numérico.</p>
-
-<p>La siguiente captura de pantalla tomada de Firefox para Android proporciona un ejemplo:</p>
-
-<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17055/fx-android-number-type-keyboard.jpg" style="border-style: solid; border-width: 1px; display: block; height: 275px; margin: 0px auto; width: 400px;"></p>
-
-<p>Con el tipo de input <code>number</code>  puedes limitar los valores mínimo y máximo permitidos definiendo los atributos {{htmlattrxref("min","input")}} y  {{htmlattrxref("max","input")}}.</p>
-
-<p>También puedes utilizar el atributo <code>step</code> para cambiar el incremento y decremento causado por los botones deslizadores. Por defecto, el tipo de input number sólo valida si el número es un entero. Para permitir números decimales, especifica <code><a href="/en-US/docs/Web/HTML/Attributes/step">step="any"</a></code>. Si se omite, su valor por defecto es <code>1</code>, lo que significa que solo son válidos números enteros.</p>
-
-<p>Miremos algunos ejemplos. El primero de los siguientes crea un control numérico cuyo valor está restringido a cualquier valor entre <code>1</code> y <code>10</code>, y sus botones cambian su valor en incrementos o decrementos de <code>2</code>.</p>
-
-<pre class="brush: html notranslate">&lt;input type="number" name="age" id="age" min="1" max="10" step="2"&gt;</pre>
-
-<p>El segundo crea un control numérico cuyo valor está restringido a cualquier valor entre el <code>0</code> y <code>1</code> ambos inclusive, y sus botones cambian su valor en incrementos o decrementos de <code>0.01</code>.</p>
-
-<pre class="brush: html notranslate">&lt;input type="number" name="change" id="pennies" min="0" max="1" step="0.01"&gt;</pre>
-
-<p>El tipo de input <code>number</code> tiene sentido cuando esté limitado el rango de valores válidos, por ejemplo la edad de una persona o su altura. Si el rango es demasiado grande para que los cambios de incremento tengan sentido ( por ejemplo los códigos postales de USA, cuyo rango va de <code>00001</code> a <code>99999</code>), entonces sería una mejor opción utilizar el tipo <code>tel</code>: proporciona el teclado numérico mientras que omite el componente de interfaz de usuario de los deslizadores de número.</p>
-
-<div class="blockIndicator note">
-<p><strong>Ten en cuenta que</strong>: En versiones inferiores a la 10 de Internet Explorer no se soportan las entradas <code>number</code></p>
-</div>
-
-<h2 id="Slider_controls">Slider controls</h2>
-
-<p>Otra forma de tomar un número es usando un <strong>slider</strong>. Podrás observar cómo son bastantes parecidas a los sitios inmobiliarios, dónde quieres determinar un máximo de precio por propiedad y filtrar tu búsqueda en el. Observaremos un ejemplo en vivo.</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/range-example/index.html", '100%', 200)}}</p>
-
-<p>Usage-wise, sliders are less accurate than text fields. Therefore, they are used to pick a number whose <em>precise</em> value is not necessarily important.</p>
-
-<p>A slider is created using the {{HTMLElement("input")}} with its {{htmlattrxref("type","input")}} attribute set to the value <code>range</code>. The slider-thumb can be moved via mouse or touch, or with the arrows of the keypad.</p>
-
-<p>It's important to properly configure your slider. To that end, it's highly recommended that you set the <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code>, <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code>, and <code><a href="/en-US/docs/Web/HTML/Attributes/step">step</a></code> attributes which set the minimum, maximum and increment values, respectively.</p>
-
-<p>Let's look at the code behind the above example, so you can see how its done. First of all, the basic HTML:</p>
-
-<pre class="brush: html notranslate">&lt;label for="price"&gt;Choose a maximum house price: &lt;/label&gt;
-&lt;input type="range" name="price" id="price" min="50000" max="500000" step="100" value="250000"&gt;
-&lt;output class="price-output" for="price"&gt;&lt;/output&gt;</pre>
-
-<p>This example creates a slider whose value may range between <code>50000</code> and <code>500000</code>, which increments/decrements by 100 at a time. We've given it default value of <code>250000</code>, using the <code>value</code> attribute.</p>
-
-<p>One problem with sliders is that they don't offer any kind of visual feedback as to what the current value is. This is why we've included an {{htmlelement("output")}} element — to contain the current value (we'll also look at this element in the next article). You could display an input value or the output of a calculation inside any element, but <code>&lt;output&gt;</code> is special — like <code>&lt;label&gt;</code>, it can take a <code>for</code> attribute that allows you to associate it with the element or elements that the output value came from.</p>
-
-<p>To actually display the current value, and update it as it changed, you must use JavaScript, but this is relatively easy to do:</p>
-
-<pre class="brush: js notranslate">const price = document.querySelector('#price')
-const output = document.querySelector('.price-output')
-
-output.textContent = price.value
-
-price.addEventListener('input', function() {
-  output.textContent = price.value
-});</pre>
-
-<p>Here we store references to the <code>range</code> input and the <code>output</code> in two variables. Then we immediately set the <code>output</code>'s <code><a href="/en-US/docs/Web/API/Node/textContent">textContent</a></code> to the current <code>value</code> of the input. Finally, an event listener is set to ensure that whenever the range slider is moved, the <code>output</code>'s <code>textContent</code> is updated to the new value.</p>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: <code>range</code> inputs are not supported in versions of Internet Explorer below 10.</p>
-</div>
-
-<h2 id="Date_and_time_pickers">Date and time pickers</h2>
-
-<p>Gathering date and time values has traditionally been a nightmare for web developers. For good user experience, it is important to provide a calendar selection UI, enabling users to select dates without necessating context switching to a native calendar application or potentially entering them in differing formats that are hard to parse. The last minute of the previous millenium can be expressed in the following different ways, for example: 1999/12/31, 23:59 or 12/31/99T11:59PM.</p>
-
-<p>HTML date controls are available to handle this specific kind of data, providing calendar widgets and making the data uniform.</p>
-
-<p>A date and time control is created using the {{HTMLElement("input")}} element and an appropriate value for the {{htmlattrxref("type","input")}} attribute, depending on whether you wish to collect dates, times, or both. Here's a live example that falls back to {{htmlelement("select")}} elements in non-supporting browsers:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/datetime-local-picker-fallback/index.html", '100%', 200)}}</p>
-
-<p>Let's look at the different available types in brief. Note that the usage of these types is quite complex, especially considering browser support (see below); to find out the full details, follow the links below to the reference pages for each type, including detailed examples.</p>
-
-<h3 id="datetime-local"><code>datetime-local</code></h3>
-
-<p><code><a href="/en-US/docs/Web/HTML/Element/input/datetime-local">&lt;input type="datetime-local"&gt;</a></code> creates a widget to display and pick a date with time with no specific time zone information.</p>
-
-<pre class="brush: html notranslate">&lt;input type="datetime-local" name="datetime" id="datetime"&gt;</pre>
-
-<h3 id="month"><code>month</code></h3>
-
-<p><code><a href="/en-US/docs/Web/HTML/Element/input/month">&lt;input type="month"&gt;</a></code> creates a widget to display and pick a month with a year.</p>
-
-<pre class="brush: html notranslate">&lt;input type="month" name="month" id="month"&gt;</pre>
-
-<h3 id="time"><code>time</code></h3>
-
-<p><code><a href="/en-US/docs/Web/HTML/Element/input/time">&lt;input type="time"&gt;</a></code> creates a widget to display and pick a time value. While time may <em>display</em> in 12-hour format, the <em>value returned</em> is in 24-hour format.</p>
-
-<pre class="brush: html notranslate">&lt;input type="time" name="time" id="time"&gt;</pre>
-
-<h3 id="week"><code>week</code></h3>
-
-<p><code><a href="/en-US/docs/Web/HTML/Element/input/week">&lt;input type="week"&gt;</a></code> creates a widget to display and pick a week number and its year.</p>
-
-<p>Weeks start on Monday and run to Sunday. Additionally, the first week 1 of each year contains the first Thursday of that year—which may not include the first day of the year, or may include the last few days of the previous year.</p>
-
-<pre class="brush: html notranslate">&lt;input type="week" name="week" id="week"&gt;</pre>
-
-<h3 id="Constraining_datetime_values">Constraining date/time values</h3>
-
-<p>All date and time controls can be constrained using the <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code> and <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code> attributes, with further constraining possible via the <code><a href="/en-US/docs/Web/HTML/Attributes/step">step</a></code> attribute (whose value varies according to input type).</p>
-
-<pre class="brush: html notranslate">&lt;label for="myDate"&gt;When are you available this summer?&lt;/label&gt;
-&lt;input type="date" name="myDate" min="2013-06-01" max="2013-08-31" step="7" id="myDate"&gt;</pre>
-
-<h3 id="Browser_support_for_datetime_inputs">Browser support for date/time inputs</h3>
-
-<p>You should be warned that the date and time widgets don't have the best browser support. At the moment, Chrome, Edge, and Opera support them well, but there is no support in Internet Explorer, Safari has some mobile support (but no desktop support), and Firefox supports <code>time</code> and <code>date</code> only.</p>
-
-<p>The reference pages linked to above provide suggestions on how to program fallbacks for non-supporting browsers; another option is to consider using a JavaScript library to provide a date picker. Most modern frameworks have good components available to provide this functionality, and there are standalone libraries available to (see <a href="https://flatlogic.com/blog/best-javascript-date-picker-libraries/">Top date picker javascript plugins and libraries</a> for some suggestions).</p>
-
-<h2 id="Color_picker_control">Color picker control</h2>
-
-<p>Colors are always a bit difficult to handle. There are many ways to express them: RGB values (decimal or hexadecimal), HSL values, keywords, etc.</p>
-
-<p>A <code>color</code> control can be created using the {{HTMLElement("input")}} element with its {{htmlattrxref("type","input")}} attribute set to the value <code>color</code>:</p>
-
-<pre class="brush: html notranslate">&lt;input type="color" name="color" id="color"&gt;</pre>
-
-<p>When supported, clicking a color control will tend to display the operating system's default color picking functionality for you to actually make your choice with. The following screenshot taken on Firefox for macOS provides an example:</p>
-
-<p><img alt="firefox for android email keyboard, with ampersand displayed by default." src="https://mdn.mozillademos.org/files/17058/fx-macos-color.jpg" style="border-style: solid; border-width: 1px; display: block; height: 412px; margin: 0px auto; width: 700px;"></p>
-
-<p>And here is a live example for you to try out:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/forms/color-example/index.html", '100%', 200)}}</p>
-
-<p>The value returned is always a lowercase 6-value hexidecimal color.</p>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: <code>color</code> inputs are not supported in Internet Explorer.</p>
-</div>
-
-<h2 id="Summary">Summary</h2>
-
-<p>That brings us to the end of our tour of the HTML5 form input types. There are a few other control types that cannot be easily grouped together due to their very specific behaviors, but which are still essential to know about. We cover those in the next article.</p>
-
-<p>{{PreviousMenuNext("Learn/Forms/Basic_native_form_controls", "Learn/Forms/Other_form_controls", "Learn/Forms")}}</p>
-
-<h2 id="In_this_module">In this module</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Forms/Your_first_form">Your first form</a></li>
- <li><a href="/en-US/docs/Learn/Forms/How_to_structure_a_web_form">How to structure a web form</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">Basic native form controls</a></li>
- <li><a href="/en-US/docs/Learn/Forms/HTML5_input_types">The HTML5 input types</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Other_form_controls">Other form controls</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Styling_web_forms">Styling web forms</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Advanced form styling</a></li>
- <li><a href="/en-US/docs/Learn/Forms/UI_pseudo-classes">UI pseudo-classes</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Form_validation">Client-side form validation</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">Sending form data</a></li>
-</ul>
-
-<h3 id="Advanced_Topics">Advanced Topics</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_controls">How to build custom form controls</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Sending_forms_through_JavaScript">Sending forms through JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Property_compatibility_table_for_form_widgets">Property compatibility table for form widgets</a></li>
-</ul>
diff --git a/files/es/learn/html/forms/validacion_formulario_datos/index.html b/files/es/learn/html/forms/validacion_formulario_datos/index.html
deleted file mode 100644
index e967b68973..0000000000
--- a/files/es/learn/html/forms/validacion_formulario_datos/index.html
+++ /dev/null
@@ -1,845 +0,0 @@
----
-title: Validación de formularios de datos
-slug: Learn/HTML/Forms/Validacion_formulario_datos
-tags:
-  - Ejemplo
-  - Guía
-  - HTML
-  - Intermedio
-  - JavaScript
-  - Web
-  - formulários
-translation_of: Learn/Forms/Form_validation
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Forms/UI_pseudo-classes", "Learn/Forms/Sending_and_retrieving_form_data", "Learn/HTML/Forms")}}</div>
-
-<p>Antes de enviar datos al servidor, es importante asegurarse de que se completan todos los controles de formulario requeridos, y en el formato correcto. Esto se denomina <strong>validación de formulario en el lado del cliente</strong> y ayuda a garantizar que los datos que se envían coinciden con los requisitos establecidos en los diversos controles de formulario. Este artículo te guiará por los conceptos básicos y ejemplos de validación de formularios en el lado del cliente.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, y entender cómo funcionan el <a href="/es/docs/Learn/HTML">HTML</a>, el <a href="/es/docs/Learn/CSS">CSS</a> y el <a href="/es/docs/Learn/JavaScript">JavaScript</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Entender qué es la validación de formularios en el lado del cliente, porqué es importante y cómo aplicar diversas técnicas para implementarla.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>La validación en el lado del cliente es una verificación inicial y una característica importante para garantizar una buena experiencia de usuario; mediante la detección de datos no válidos en el lado del cliente, el usuario puede corregirlos de inmediato. Si el servidor lo recibe y, a continuación, lo rechaza; se produce un retraso considerable en la comunicación entre el servidor y el cliente que insta al usuario a corregir sus datos.</p>
-
-<p>Sin embargo, ¡la validación en el lado del cliente <em>no debe considerarse </em> una medida de seguridad exhaustiva! Tus aplicaciones siempre deben realizar comprobaciones de seguridad de los datos enviados por el formulario <em>en el lado del servidor</em>, <strong>así como también</strong> en el lado del cliente, porque la validación en el lado del cliente es demasiado fácil de evitar, por lo que los usuarios malintencionados pueden enviar fácilmente datos incorrectos a tu servidor. Lee <a href="/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad en los sitios web</a> para ver qué <em>podría</em> suceder. Cómo implementar la validación en el lado del servidor está fuera del alcance de este módulo, pero debes tenerlo en cuenta.</p>
-
-<h2 id="¿Qué_es_la_validación_de_formularios">¿Qué es la validación de formularios?</h2>
-
-<p>Ve a cualquier sitio web popular que incluya un formulario de registro y observa que proporcionan comentarios cuando no introduces tus datos en el formato que se espera. Recibirás mensajes como:</p>
-
-<ul>
- <li>«Este campo es obligatorio» (No se puede dejar este campo en blanco).</li>
- <li>«Introduzca su número de teléfono en el formato xxx-xxxx» (Se requiere un formato de datos específico para que se considere válido).</li>
- <li>«Introduzca una dirección de correo electrónico válida» (los datos que introdujiste no están en el formato correcto).</li>
- <li>«Su contraseña debe tener entre 8 y 30 caracteres y contener una letra mayúscula, un símbolo y un número». (Se requiere un formato de datos muy específico para tus datos).</li>
-</ul>
-
-<p>Esto se llama <strong>validación de formulario</strong>. Cuando introduces los datos, el navegador y/o el servidor web verifican que estén en el formato correcto y dentro de las restricciones establecidas por la aplicación. La validación realizada en el navegador se denomina validación <strong>en el lado del cliente</strong>, mientras que la validación realizada en el servidor se denomina validación <strong>en el lado del servidor</strong>. En este capítulo nos centraremos en la validación en el lado del cliente.</p>
-
-<p>Si la información está en el formato correcto, la aplicación permite que los datos se envíen al servidor y (en general) que se guarden en una base de datos; si la información no está en el formato correcto, da al usuario un mensaje de error que explica lo que debe corregir y le permite volver a intentarlo.</p>
-
-<p>Queremos que completar formularios web sea lo más fácil posible. Entonces, ¿por qué insistimos en validar nuestros formularios? Hay tres razones principales:</p>
-
-<ul>
- <li><strong>Queremos obtener los datos correctos en el formato correcto.</strong> Nuestras aplicaciones no funcionarán correctamente si los datos de nuestros usuarios se almacenan en el formato incorrecto, son incorrectos o se omiten por completo.</li>
- <li><strong>Queremos proteger los datos de nuestros usuarios</strong>. Obligar a nuestros usuarios a introducir contraseñas seguras facilita proteger la información de su cuenta.</li>
- <li><strong>Queremos protegernos a nosotros mismo</strong>. Hay muchas formas en que los usuarios maliciosos puedan usar mal los formularios desprotegidos y dañar la aplicación (consulta <a href="/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad del sitio web</a>).</li>
-</ul>
-
-<div class="warning"><strong>Atención:</strong> No confíes nunca en los datos que se pasan al servidor desde el cliente. Incluso si tu formulario se valida correctamente y evita la introducción de datos con formato incorrecto en el lado del cliente, un usuario malintencionado puede alterar la petición de red.</div>
-
-<h2 id="Diferentes_tipos_de_validación_en_el_lado_del_cliente">Diferentes tipos de validación en el lado del cliente</h2>
-
-<p>Hay dos tipos diferentes de validación por parte del cliente que encontrarás en la web:</p>
-
-<ul>
- <li>La <strong>validación de formularios incorporada</strong> utiliza características de validación de formularios HTML5, que hemos visto en muchos lugares a lo largo de este módulo. Esta validación generalmente no requiere mucho JavaScript. La validación de formularios incorporada tiene un mejor rendimiento que JavaScript, pero no es tan personalizable como la validación con JavaScript.</li>
- <li>La <strong>validación con JavaScript</strong> se codifica utilizando JavaScript. Esta validación es completamente personalizable, pero debes crearlo todo (o usar una biblioteca).</li>
-</ul>
-
-<h2 id="Usar_la_validación_de_formulario_incorporada">Usar la validación de formulario incorporada</h2>
-
-<p>Una de las características más importantes de los <a href="/en-US/docs/Learn/Forms/HTML5_input_types">controles de formulario de HTML5</a> es la capacidad de validar la mayoría de los datos de usuario sin depender de JavaScript. Esto se realiza mediante el uso de atributos de validación en los elementos del formulario. Los hemos visto anteriormente en el curso, pero recapitulamos aquí:</p>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/HTML/Attributes/required">required</a></code>: Especifica si un campo de formulario debe completarse antes de que se pueda enviar el formulario.</li>
- <li><code><a href="/en-US/docs/Web/HTML/Attributes/minlength">minlength</a></code> y <code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code>: Especifican la longitud mínima y máxima de los datos de texto (cadenas).</li>
- <li><code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code> y <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code>: Especifican los valores mínimo y máximo de los tipos de entrada numéricos.</li>
- <li><code>type</code>: Especifica si los datos deben ser un número, una dirección de correo electrónico o algún otro tipo de preajuste específico. </li>
- <li><code><a href="/en-US/docs/Web/HTML/Attributes/pattern">pattern</a></code>: Especifica una <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresión regular</a> que define un patrón que los datos que se introduzcan deben seguir.</li>
-</ul>
-
-<p>Si los datos que se introducen en un campo de formulario siguen todas las reglas que especifican los atributos anteriores, se consideran válidos. Si no, se consideran no válidos.</p>
-
-<p>Cuando un elemento es válido, se cumplen los aspectos siguientes:</p>
-
-<ul>
- <li>El elemento coincide con la pseudoclase {{cssxref(":valid")}} de CSS, lo que te permite aplicar un estilo específico a los elementos válidos.</li>
- <li>Si el usuario intenta enviar los datos, el navegador envía el formulario siempre que no haya nada más que lo impida (por ejemplo, JavaScript).</li>
-</ul>
-
-<p>Cuando un elemento no es válido, se cumplen los aspectos siguientes:</p>
-
-<ul>
- <li>El elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS, y a veces con otras pseudoclases de interfaz de usuario (UI) –por ejemplo, {{cssxref(":out-of-range")}}– dependiendo del error, que te permite aplicar un estilo específico a elementos no válidos.</li>
- <li>Si el usuario intenta enviar los datos, el navegador bloquea el formulario y muestra un mensaje de error.</li>
-</ul>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Hay varios errores que evitan que el formulario se envíe, incluidos {{domxref('validityState.badInput', 'badInput')}}, {{domxref('validityState.patternMismatch','patternMismatch')}}, {{domxref('validityState.rangeOverflow','rangeOverflow')}} o {{domxref('validityState.rangeUnderflow','rangeUnderflow')}}, {{domxref('validityState.stepMismatch','stepMismatch')}}, {{domxref('validityState.tooLong','tooLong')}} o {{domxref('validityState.tooShort','tooShort')}}, {{domxref('validityState.typeMismatch','typeMismatch')}}, {{domxref('validityState.valueMissing','valueMissing')}} o {{domxref('validityState.customError','customError')}}.</p>
-</div>
-
-<h2 id="Ejemplos_de_validación_de_formularios_incorporados">Ejemplos de validación de formularios incorporados</h2>
-
-<p>En esta sección probaremos algunos de los atributos que hemos comentado antes.</p>
-
-<h3 id="Archivo_de_inicio_sencillo">Archivo de inicio sencillo</h3>
-
-<p>Vamos a empezar con un ejemplo sencillo: una entrada que te permite elegir si prefieres un plátano o una cereza. Este ejemplo implica una simple entrada ({{HTMLElement("input")}}) de texto con una etiqueta ({{htmlelement("label")}}) asociada y un botón de envío ({{htmlelement ("button")}}). Puedes encontrar el código fuente en GitHub en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-start.html">fruit-start.html</a> y el ejemplo en vivo a continuación.</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza?&lt;/label&gt;
-  &lt;input id="choose" name="i_like"&gt;
-  &lt;button&gt;Enviar&lt;/button&gt;
-&lt;/form&gt;</pre>
-
-<pre class="brush: css notranslate">input:invalid {
-  border: 2px dashed red;
-}
-
-input:valid {
-  border: 2px solid black;
-}</pre>
-
-<p>{{EmbedLiveSample("Archivo_de_inicio_sencillo", "100%", 80)}}</p>
-
-<p>Para empezar, haz una copia de <code>fruit-start.html</code> en un nuevo directorio de tu disco duro.</p>
-
-<h3 id="El_atributo_required">El atributo <code>required</code></h3>
-
-<p>La característica de validación de HTML5 más simple es el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/required">required</a></code>. Añade este atributo al elemento para que una entrada sea obligatoria. Cuando se establece este atributo, el elemento coincide con la pseudoclase de la interfaz de usuario {{cssxref(':required')}} y el formulario no se envía; muestra un mensaje de error al enviarlo si la entrada está vacía. Si está vacía, la entrada también se considera inválida, coincidiendo con la pseudoclase de interfaz de usuario {{cssxref(':invalid')}}.</p>
-
-<p>Añade un atributo <code>required</code> a tu entrada, como se muestra a continuación.</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza? (requerido) &lt;/label&gt;
-  &lt;input id="choose" name="i_like" <strong>required</strong>&gt;
-  &lt;button&gt;Enviar&lt;/button&gt;
-&lt;/form&gt;</pre>
-
-<p>Ten en cuenta el CSS que en el archivo de ejemplo se ha incluido:</p>
-
-<pre class="brush: css notranslate">input:invalid {
-  border: 2px dashed red;
-}
-
-input:invalid:required {
-  background-image: linear-gradient(to right, pink, lightgreen);
-}
-
-input:valid {
-  border: 2px solid black;
-}</pre>
-
-<p>Este CSS da un borde discontinuo rojo cuando la entrada no es válida, y un borde negro sólido más sutil cuando es válida. También añadimos un gradiente de fondo cuando la entrada es obligatoria <em>y</em> no válida. Prueba el nuevo comportamiento en el ejemplo siguiente:</p>
-
-<p>{{EmbedLiveSample("El_atributo_required", "100%", 80)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/fruit-required.html">fruit-validation.html</a> (consulta también el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-required.html">código fuente</a>).</p>
-</div>
-
-<p>Intenta enviar el formulario sin introducir ningún valor. Observa que la entrada no válida recibe el cursor, aparece un mensaje de error predeterminado («Complete este campo») y el formulario no se puede enviar.</p>
-
-<p>La presencia del atributo <code>required</code> en cualquier elemento que admite este atributo significa que el elemento coincide con la pseudoclase {{cssxref(':required')}}, tenga o no un valor. Si en el elemento {{HTMLElement("input")}} no se ha introducido ningún valor, <code>input</code> coincidirá con la pseudoclase {{cssxref(':invalid')}}.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Para una buena experiencia de usuario, indica al usuario que campos de formulario se requieren. No solo es una buena experiencia de usuario, sino que lo exigen las pautas de <a href="/es/docs/Learn/Accessibility">accesibilidad</a> de WCAG. Además, solo requiere que los usuarios introduzcan los datos que realmente necesitas: Por ejemplo, ¿por qué realmente necesitas saber el género o el tratamiento de alguien?</p>
-</div>
-
-<h3 id="Validación_de_una_expresión_regular">Validación de una expresión regular</h3>
-
-<p>Otra característica útil de validación es el atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a>, que espera una <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresión regular</a> como valor. Una expresión regular (<em>regex</em>) es un patrón que se puede usar para establecer combinaciones de caracteres en cadenas de texto, por lo que las expresiones regulares son ideales para la validación de formularios y sirven para una gran variedad de otros usos en JavaScript.</p>
-
-<p>Las expresiones regulares son bastante complejas y no vamos a exponerlas exhaustivamente en este artículo. A continuación hay algunos ejemplos para que te hagas una idea de cómo funcionan.</p>
-
-<ul>
- <li><code>a</code>: coincide con un carácter que es <code>a</code> (ni <code>b</code>, ni <code>aa</code>, etc.).</li>
- <li><code>abc</code>: coincide con <code>a</code>, seguido de <code>b</code>, seguido de <code>c</code>.</li>
- <li><code>ab?c</code>: coincide con <code>a</code>, seguida opcionalmente de una sola <code>b</code>, seguida de <code>c</code> (<code>ac</code> o <code>abc</code>).</li>
- <li><code>ab*c</code>: coincide con <code>a</code>, seguido opcionalmente de cualquier número de <code>b</code>, seguido de <code>c</code>. (<code>ac</code>, <code>abc</code>, <code>abbbbbc</code>, etc.)</li>
- <li><code>a|b</code>: coincide con un carácter que es <code>a</code> o <code>b</code>.</li>
- <li><code>abc|xyz</code>: coincide exactamente con <code>abc</code> o <code>xyz</code> (pero no con <code>abcxyz</code> <code>a</code> o <code>y</code>, y así sucesivamente).</li>
-</ul>
-
-<p>Hay muchas más posibilidades que no exponemos aquí. Para obtener una lista completa y muchos ejemplos, consulta nuestro documento de <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresiones regulares</a>.</p>
-
-<p>Implementemos un ejemplo. Actualiza tu HTML para añadir un atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a> como este:</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza?&lt;/label&gt;
-  &lt;input id="choose" name="i_like" required pattern="[Pp]látano|[Cc]ereza "&gt;
-  &lt;button&gt;Enviar&lt;/button&gt;
-&lt;/form&gt;
-</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">input:invalid {
-  border: 2px dashed red;
-}
-
-input:valid {
-  border: 2px solid black;
-}</pre>
-</div>
-
-<p>Esto nos da la siguiente actualización; pruébalo:</p>
-
-<p>{{EmbedLiveSample("Validación de una expresión regular", "100%", 80)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/fruit-pattern.html">fruit-pattern.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-pattern.html">código fuente</a>).</p>
-</div>
-
-<p>En este ejemplo, el elemento {{HTMLElement("input")}} acepta uno de los cuatro valores posibles: las cadenas «plátano», «Plátano», «cereza» o «Cereza». Las expresiones regulares distinguen entre mayúsculas y minúsculas, pero hemos hecho que admita versiones en mayúsculas y minúsculas utilizando un patrón «Aa» adicional anidado dentro de corchetes.</p>
-
-<p>En este punto, intenta cambiar el valor dentro del atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a> para que se vean iguales que algunos de los ejemplos vistos anteriormente, y observa que esto afecta a los valores que puedes añadir para que el valor de entrada sea válido. Intenta escribir algo por tu cuenta y mira cómo va. ¡Haz que estén relacionadas con la fruta siempre que sea posible para que tus ejemplos tengan sentido!</p>
-
-<p>Si un valor no vacío de {{HTMLElement("input")}} no coincide con el patrón de la expresión regular, <code>input</code> coincidirá con la pseudoclase {{cssxref(':invalid')}}.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Algunos tipos de elementos {{HTMLElement ("input")}} no necesitan validar una expresión regular con el atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a>. Especificar el tipo de correo electrónico (<code>email</code>), por ejemplo, valida el valor de las entradas con un patrón de dirección de correo electrónico bien formado o un patrón que coincida con una lista de direcciones de correo electrónico separadas por comas si tiene el atributo <a href="/en-US/docs/Web/HTML/Attributes/multiple"><code>multiple</code></a>.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: El elemento {{HTMLElement("textarea")}} no admite el atributo <a href="/en-US/docs/Web/HTML/Attributes/pattern"><code>pattern</code></a>.</p>
-</div>
-
-<h3 id="Restringir_la_longitud_de_tus_entradas">Restringir la longitud de tus entradas</h3>
-
-<p>Puedes restringir la longitud de los caracteres de todos los campos de texto creados por {{HTMLElement("input")}} o {{HTMLElement("textarea")}} utilizando los atributos <a href="/en-US/docs/Web/HTML/Attributes/minlength"><code>minlength</code></a> y <code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code>. Un campo no es válido si tiene un valor y ese valor tiene menos caracteres que el valor de longitud mínima (<a href="/en-US/docs/Web/HTML/Attributes/minlength"><code>minlength</code></a>), o más que el valor de longitud máxima (<code><a href="/en-US/docs/Web/HTML/Attributes/maxlength">maxlength</a></code>).</p>
-
-<p>Los navegadores a menudo no permiten que el usuario escriba un valor más largo de lo esperado en los campos de texto. Lo que otorga una mejor experiencia de usuario que <code>maxlength</code> es proporcionar comentarios de recuento de caracteres de manera accesible y permitirles editar su contenido a un tamaño más reducido. Un ejemplo de esto es el límite de caracteres de Twitter. JavaScript, incluidas las <a href="https://github.com/mimo84/bootstrap-maxlength">soluciones que utilizan <code>maxlength</code></a>, se puede utilizar para proporcionar esta funcionalidad.</p>
-
-<h3 id="Restringir_los_valores_de_tus_entradas">Restringir los valores de tus entradas</h3>
-
-<p>Los atributos <code><a href="/en-US/docs/Web/HTML/Attributes/min">min</a></code> y <code><a href="/en-US/docs/Web/HTML/Attributes/max">max</a></code> se pueden usar para proporcionar a los campos numéricos (es decir, <code><a href="/en-US/docs/Web/HTML/Element/input/number">&lt;input type="number"&gt;</a></code>) un rango de valores válidos. El campo no será válido si contiene un valor fuera de este rango.</p>
-
-<p>Veamos otro ejemplo. Crea una nueva copia del archivo <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-start.html">fruit-start.html</a>.</p>
-
-<p>Ahora elimina el contenido del elemento <code>&lt;body&gt;</code> y reemplázalo con lo siguiente:</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="choose"&gt;¿Prefieres un plátano o una cereza?&lt;/label&gt;
-    &lt;input type="text" id="choose" name="i_like" required minlength="6" maxlength="6"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="number"&gt;¿Cuántos te gustaría comer?&lt;/label&gt;
-    &lt;input type="number" id="number" name="amount" value="1" min="1" max="10"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<ul>
- <li>Aquí verás que le hemos dado al campo de <code>text</code> unos valores <code>minlength</code> y <code>maxlength</code> de seis, que es la misma longitud que tienen el plátano y la cereza.</li>
- <li>También le hemos dado al campo <code>number</code> un <code>min</code> de uno y un <code>max</code> de diez. Los números introducidos que queden fuera de este rango se mostrarán como no válidos; los usuarios no podrán usar las flechas de incremento/decremento para mover el valor fuera de este rango. Si el usuario introduce un número desde el teclado fuera de este rango, los datos no serán válidos. El número no es obligatorio, por lo que eliminar el valor aún dará como resultado un valor válido.</li>
-</ul>
-
-<div class="hidden">
-<pre class="brush: css notranslate">input:invalid {
-  border: 2px dashed red;
-}
-
-input:valid {
-  border: 2px solid black;
-}
-
-div {
-  margin-bottom: 10px;
-}</pre>
-</div>
-
-<p>Aquí está el ejemplo que se ejecuta en vivo:</p>
-
-<p>{{EmbedLiveSample("Restringir_los_valores_de_tus_entradas", "100%", 100)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/fruit-length.html">fruit-length.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-length.html">código fuente</a>).</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: <code>&lt;input type="number"&gt;</code> (y otros tipos, como <code>range</code> y <code>date</code>) también pueden tomar un atributo <a href="/en-US/docs/Web/HTML/Attributes/step"><code>step</code></a>, que especifica en qué incremento aumenta o disminuye el valor cuando se utilizan los controles de entrada (como el botones numéricos arriba y abajo). En el ejemplo anterior no hemos incluido un atributo <code>step</code>, por lo que el valor predeterminado es <code>1</code>. Esto significa que los valores de coma flotante, como 3.2, también se mostrarán como no válidos.</p>
-</div>
-
-<h3 id="Ejemplo_completo">Ejemplo completo</h3>
-
-<p>Aquí hay un ejemplo completo que muestra el uso de las funciones de validación integradas en HTML. En primer lugar, un poco de HTML:</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;p&gt;
-    &lt;fieldset&gt;
-      &lt;legend&gt;¿Tienes carné de conducir?&lt;abbr title="Este campo es obligatorio" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/legend&gt;
-      &lt;!-- Solo se puede seleccionar un botón de opción en un grupo con el mismo nombre,
-           y, por lo tanto, solo un botón de opción en un grupo con el mismo nombre que tiene marcado el atributo «requerido»
-           basta para hacer de una selección un requisito --&gt;
-      &lt;input type="radio" required name="driver" id="r1" value="yes"&gt;&lt;label for="r1"&gt;Sí&lt;/label&gt;
-      &lt;input type="radio" required name="driver" id="r2" value="no"&gt;&lt;label for="r2"&gt;No&lt;/label&gt;
-    &lt;/fieldset&gt;
-  &lt;/p&gt;
-  &lt;p&gt;
-    &lt;label for="n1"&gt;¿Qué edad tienes?&lt;/label&gt;
-    &lt;!-- El atributo pattern puede actuar como una alternativa para los navegadores que
-         no implementan el tipo de entrada de número, pero admiten el atributo pattern.
-         Ten en cuenta que los navegadores que admiten el atributo pattern lo harán
-         fallar silenciosamente cuando se use con un campo numérico.
-         Su uso aquí solo actúa como una alternativa --&gt;
-     &lt;input type="number" min="12" max="120" step="1" id="n1" name="age"
-           pattern="\d+"&gt;
-  &lt;/p&gt;
-  &lt;p&gt;
-    &lt;label for="t1"&gt;¿Cuál es tu fruta favorita?&lt;abbr title="Este campo es obligatorio" aria-label="required"&gt;*&lt;/abbr&gt;&lt;/label&gt;
-    &lt;input type="text" id="t1" name="fruit" list="l1" required
-           pattern="[Bb]anana|[Cc]herry|[Aa]pple|[Ss]trawberry|[Ll]emon|[Oo]range "&gt;
-    &lt;datalist id="l1"&gt;
-      &lt;option&gt;Plátano&lt;/option&gt;
-      &lt;option&gt;Cereza&lt;/option&gt;
-      &lt;option&gt;Manzana&lt;/option&gt;
-      &lt;option&gt;Fresa&lt;/option&gt;
-      &lt;option&gt;Limón&lt;/option&gt;
-      &lt;option&gt;Naranja&lt;/option&gt;
-     &lt;/datalist&gt;
-  &lt;/p&gt;
-  &lt;p&gt;
-    &lt;label for="t2"&gt;¿Cuál es tu dirección de correo electrónico? &lt;/label&gt;
-    &lt;input type="email" id="t2" name="email"&gt;
-  &lt;/p&gt;
-  &lt;p&gt;
-    &lt;label for="t3"&gt;Deja un mensaje&lt;/label&gt;
-    &lt;textarea id="t3" name="msg" maxlength="140" rows="5"&gt;&lt;/textarea&gt;
-  &lt;/p&gt;
-  &lt;p&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/p&gt;
-&lt;/form&gt;</pre>
-
-<p>Y ahora, algo de CSS para añadir estilo al HTML:</p>
-
-<pre class="brush: css notranslate">form {
-  font: 1em sans-serif;
-  max-width: 320px;
-}
-
-p &gt; label {
-  display: block;
-}
-
-input[type="text"],
-input[type="email"],
-input[type="number"],
-textarea,
-fieldset {
-  width : 100%;
-  border: 1px solid #333;
-  box-sizing: border-box;
-}
-
-input:invalid {
-  box-shadow: 0 0 5px 1px red;
-}
-
-input:focus:invalid {
-  box-shadow: none;
-}</pre>
-
-<p>Esto se traduce de la siguiente manera:</p>
-
-<p>{{EmbedLiveSample("Ejemplo_completo", "100%", 420)}}</p>
-
-<p>Consulta <a href="/es/docs/HTML/HTML5/Validacion_de_restricciones#Atributos_relacionados_con_validaciones">Atributos relacionados con la validación</a> para obtener una lista completa de los atributos que se pueden usar para restringir los valores de entrada y los tipos de entrada que los admiten.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/full-example.html">full-example.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/full-example.html">código fuente</a>).</p>
-</div>
-
-<h2 id="Validar_formularios_utilizando_JavaScript">Validar formularios utilizando JavaScript</h2>
-
-<p>Debes usar JavaScript si quieres controlar la apariencia de los mensajes de error nativos o tratar con navegadores heredados que no admiten la validación de formularios incorporados en HTML. En esta sección veremos las diferentes formas de hacer esto.</p>
-
-<h3 id="La_API_de_validación_de_restricciones">La API de validación de restricciones</h3>
-
-<p>La mayoría de los navegadores admiten la <a href="/en-US/docs/Web/API/Constraint_validation">API de validación de restricciones</a>, que consta de un conjunto de métodos y propiedades disponibles en las interfaces DOM de elementos de formulario siguientes:</p>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/API/HTMLButtonElement">HTMLButtonElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/button">&lt;button&gt;</a></code>)</li>
- <li><code><a href="/en-US/docs/Web/API/HTMLFieldSetElement">HTMLFieldSetElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/fieldset">&lt;fieldset&gt;</a></code>)</li>
- <li><code><a href="/en-US/docs/Web/API/HTMLInputElement">HTMLInputElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/input">&lt;input&gt;</a></code>)</li>
- <li><code><a href="/en-US/docs/Web/API/HTMLOutputElement">HTMLOutputElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/output">&lt;output&gt;</a></code>)</li>
- <li><code><a href="/en-US/docs/Web/API/HTMLSelectElement">HTMLSelectElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/select">&lt;select&gt;</a></code>)</li>
- <li><code><a href="/en-US/docs/Web/API/HTMLTextAreaElement">HTMLTextAreaElement</a></code> (representa un elemento <code><a href="/en-US/docs/Web/HTML/Element/textarea">&lt;textarea&gt;</a></code>)</li>
-</ul>
-
-<p id="Constraint_validation_API_properties">La API de validación de restricciones hace que las propiedades siguientes estén disponibles en los elementos anteriores.</p>
-
-<ul>
- <li><code>validationMessage</code>: Devuelve un mensaje localizado que describe las restricciones de validación que el control no satisface (si corresponde). Si el control no es candidato para la validación de restricciones (<code>willValidate</code> es <code>false</code>) o el valor del elemento satisface sus restricciones (es válido), esto devolverá una cadena vacía.</li>
- <li><code>validity</code>: Devuelve un objeto <code>ValidityState</code> que contiene varias propiedades que describen el estado de validez del elemento. Puedes encontrar todos los detalles de todas las propiedades disponibles en la página de referencia {{domxref("ValidityState")}}; a continuación se enumeran algunos de los más comunes:
-  <ul>
-   <li>{{domxref("ValidityState.patternMismatch", "patternMismatch")}}: Devuelve <code>true</code> si el valor no coincide con el {{htmlattrxref("pattern", "input")}} especificado, y <code>false</code> si coincide. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
-   <li>{{domxref("ValidityState.tooLong", "tooLong")}}: Devuelve <code>true</code> si el valor es mayor que la longitud máxima especificada por el atributo {{htmlattrxref("maxlength", "input")}}, o <code>false</code> si es menor o igual al máximo. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
-   <li>{{domxref("ValidityState.tooShort", "tooShort")}}: Devuelve <code>true</code> si el valor es menor que la longitud mínima especificada por el atributo {{htmlattrxref("minlength", "input")}}, o <code>false</code> si es mayor o igual al mínmo. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
-   <li>{{domxref("ValidityState.rangeOverflow", "rangeOverflow")}}: Devuelve <code>true</code> si el valor es mayor que el máximo especificado por el atributo {{htmlattrxref("max", "input")}}, o <code>false</code> si es menor o igual que el máximo. Si es verdadero, el elemento coincide con las pseudoclases {{cssxref(":invalid")}} y {{cssxref(":out-of-range")}} de CSS.</li>
-   <li>{{domxref("ValidityState.rangeUnderflow", "rangeUnderflow")}}: Devuelve <code>true</code> si el valor es menor que el mínimo especificado por el atributo {{htmlattrxref("min", "input")}}, o <code>false</code> si es mayor o igual que el mínimo. Si es verdadero, el elemento coincide con las pseudoclases {{cssxref(":invalid")}} y {{cssxref(":out-of-range")}} de CSS.</li>
-   <li>{{domxref("ValidityState.typeMismatch", "typeMismatch")}}: Devuelve <code>true</code> si el valor no está en la sintaxis requerida (cuando {{htmlattrxref("type", "input")}} es <code>email</code> o <code>url</code>), o <code>false</code> si la sintaxis es correcta. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
-   <li><code>valid</code>: Devuelve <code>true</code> si el elemento cumple con todas sus restricciones de validación y por lo tanto se considera válido, o <code>false</code> si falla alguna restricción. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":valid")}} de CSS; o con la pseudoclase {{cssxref(":invalid")}} de CSS de lo contrario.</li>
-   <li><code>valueMissing</code>: Devuelve <code>true</code> si el elemento tiene un atributo {{htmlattrxref("required", "input")}} pero no tiene valor, o <code>false</code> de lo contrario. Si es verdadero, el elemento coincide con la pseudoclase {{cssxref(":invalid")}} de CSS.</li>
-  </ul>
- </li>
- <li><code>willValidate</code>: Devuelve <code>true</code> si el elemento se valida cuando se envía el formulario; <code>false</code> de lo contrario.</li>
-</ul>
-
-<p id="Constraint_validation_API_methods">La API de validación de restricciones también pone a disposición los siguientes métodos en los elementos anteriores.</p>
-
-<ul>
- <li><code>checkValidity()</code>: Devuelve <code>true</code> si el valor del elemento no tiene problemas de validez; <code>false</code> en caso contrario. Si el elemento no es válido, este método también activa un <a href="/es/docs/Web/API/HTMLInputElement/invalid_event">evento <code>invalid</code></a> en el elemento.</li>
- <li><code>setCustomValidity(<em>message</em>)</code>: Añade un mensaje de error personalizado al elemento; si configuras un mensaje de error personalizado, el elemento se considera no válido y se muestra el error especificado. Esto te permite utilizar el código JavaScript para establecer un fallo de validación distinto de los ofrecidos por las restricciones estándar de validación de HTML5. El mensaje se muestra al usuario cuando se informa del problema.</li>
-</ul>
-
-<h4 id="Implementar_un_mensaje_de_error_personalizado">Implementar un mensaje de error personalizado</h4>
-
-<p>Como has visto en los ejemplos de restricciones de validación de HTML5 anteriores, cada vez que un usuario intenta enviar un formulario no válido, el navegador muestra un mensaje de error. La forma en que se muestra este mensaje depende del navegador.</p>
-
-<p>Estos mensajes automatizados tienen dos inconvenientes:</p>
-
-<ul>
- <li>No hay una forma estándar de cambiar su aspecto con CSS.</li>
- <li>Dependen de la configuración regional del navegador, lo que significa que puedes tener una página en un idioma pero un mensaje de error en otro idioma, como se ve en la siguiente captura de pantalla de Firefox.</li>
-</ul>
-
-<p><img alt="Ejemplo de un mensaje de error en francés en una página de Firefox en inglés" src="/files/4329/error-firefox-win7.png" style="height: 97px; width: 228px;"></p>
-
-<p>La personalización de estos mensajes de error es uno de los casos de uso más comunes de la <a href="/en-US/docs/Web/API/Constraint_validation" rel="external">API de validación de restricciones</a>. Veamos un ejemplo simple de cómo hacer esto.</p>
-
-<p>Comenzaremos con un HTML simple (siéntete libre de poner esto en un archivo HTML en blanco; usa una copia nueva de <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-start.html">fruit-start.html</a> como base, si lo deseas):</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;label for="mail"&gt;Me gustaría que me proporcionara una dirección de correo electrónico:&lt;label&gt;
-  &lt;input type="email" id="mail" name="mail"&gt;
-  &lt;button&gt;Enviar&lt;/button&gt;
-&lt;/form&gt;</pre>
-
-<p>Y añade a la página el JavaScript siguiente:</p>
-
-<pre class="brush: js notranslate">const email = document.getElementById("mail");
-
-email.addEventListener("input", function (event) {
-  if (email.validity.typeMismatch) {
-    email.setCustomValidity("¡Se esperaba una dirección de correo electrónico!");
-  } else {
-    email.setCustomValidity("");
-  }
-});</pre>
-
-<p>Aquí guardamos una referencia para la entrada de la dirección de correo electrónico, luego le añadimos un detector de eventos que ejecuta el código de <code>content</code> cada vez que el valor de la entrada cambia.</p>
-
-<p>Dentro del código que contiene, verificamos si la propiedad <code>validity.typeMismatch</code> de la entrada de la dirección de correo electrónico devuelve <code>true</code>, lo que significa que el valor que contiene no coincide con el patrón para una dirección de correo electrónico bien formada. Si es así, llamamos al método <a href="/es/docs/HTML/HTML5/Validacion_de_restricciones"><code>setCustomValidity()</code></a> con un mensaje personalizado. Esto hace que la entrada no sea válida, de modo que cuando intentas enviar el formulario, el envío falla y se muestra el mensaje de error personalizado.</p>
-
-<p>Si la propiedad <code>validity.typeMismatch</code> devuelve <code>false</code>, llamamos al método <code>setCustomValidity()</code> con una cadena vacía. Esto hace que la entrada sea válida, y el formulario se envía.</p>
-
-<p>Puedes probarlo a continuación:</p>
-
-<p>{{EmbedGHLiveSample("/en-US/learning-area/html/forms/form-validation/custom-error-message.html", '100%', 80)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puede encontrar este ejemplo vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/custom-error-message.html">custom-error-message.html</a> (véase también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/custom-error-message.html">código fuente</a>).</p>
-</div>
-
-<h4 id="Un_ejemplo_más_detallado">Un ejemplo más detallado</h4>
-
-<p>Ahora que hemos visto un ejemplo realmente sencillo, veamos cómo podemos usar esta API para construir una validación personalizada un poco más compleja.</p>
-
-<p>En primer lugar, el código HTML. Una vez más, siéntete libre de construir esto junto con nosotros:</p>
-
-<pre class="brush: html notranslate">&lt;form novalidate&gt;
-  &lt;p&gt;
-    &lt;label for="mail"&gt;
-      &lt;span&gt;Por favor, introduzca una dirección de correo electrónico: &lt;/span&gt;
-      &lt;input type="email" id="mail" name="mail" required minlength="8"&gt;
-      &lt;span class="error" aria-live="polite"&gt;&lt;/span&gt;
-    &lt;/label&gt;
-  &lt;/p&gt;
-  &lt;button&gt;Enviar&lt;/button&gt;
-&lt;/form&gt;</pre>
-
-<p>Este sencillo formulario usa el atributo <code><a href="/en-US/docs/Web/HTML/Attributes/novalidate">novalidate</a></code> para desactivar la validación automática del navegador; esto permite que nuestra secuencia de comandos tome control sobre la validación. Sin embargo, esto no deshabilita la compatibilidad para la API de validación de restricciones ni la aplicación de pseudoclases de CSS como {{cssxref(":valid")}}, etc. Eso significa que, aunque el navegador no verifica automáticamente la validez del formulario antes de enviar los datos, puedes hacerlo tú mismo y diseñar el formulario en consecuencia.</p>
-
-<p>Nuestra entrada para validar es <code><a href="/es/docs/Web/HTML/Elemento/input/email">&lt;input type="email"&gt;</a></code>, que es obligatoria y tiene una longitud mínima (<code>minlength</code>) de 8 caracteres. Vamos a verificar esto con nuestro propio código para que muestre un mensaje de error personalizado para cada elemento.</p>
-
-<p>Nuestro objetivo es mostrar los mensajes de error dentro de un elemento <code>&lt;span&gt;</code>. El atributo <a href="/en-US/docs/Accessibility/ARIA/ARIA_Live_Regions"><code>aria-live</code></a> se establece en ese <code>&lt;span&gt;</code> para asegurar que todo el mundo podrá ver nuestro mensaje de error personalizado, incluidos los usuarios de lectores de pantalla.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Un punto clave a tener en cuenta es que establecer el atributo <code>novalidate</code> en el formulario impide que el formulario muestre sus propios cuadros de diálogo de error, y nos permite mostrar los mensajes de error personalizados en el DOM de la manera que nosotros elijamos.</p>
-</div>
-
-<p>Ahora aplicaremos algo de CSS básico para mejorar ligeramente el aspecto del formulario y proporcionar algunos comentarios visuales cuando los datos de entrada no sean válidos:</p>
-
-<pre class="brush: css notranslate">body {
-  font: 1em sans-serif;
-  width: 200px;
-  padding: 0;
-  margin : 0 auto;
-}
-
-p * {
-  display: block;
-}
-
-input[type=email]{
-  -webkit-appearance: none;
-  appearance: none;
-
-  width: 100%;
-  border: 1px solid #333;
-  margin: 0;
-
-  font-family: inherit;
-  font-size: 90%;
-
-  box-sizing: border-box;
-}
-
-/* Este es nuestro diseño para los campos no válidos */
-input:invalid{
-  border-color: #900;
-  background-color: #FDD;
-}
-
-input:focus:invalid {
-  outline: none;
-}
-
-/* Este es el diseño para nuestros mensajes de error */
-.error {
-  width : 100%;
-  padding: 0;
-
-  font-size: 80%;
-  color: white;
-  background-color: #900;
-  border-radius: 0 0 5px 5px;
-
-  box-sizing: border-box;
-}
-
-.error.active {
-  padding: 0.3em;
-}</pre>
-
-<p>Vamos a ver el JavaScript que implementa la validación de error personalizada.</p>
-
-<pre class="brush: js notranslate">// Hay muchas formas de elegir un nodo DOM; aquí obtenemos el formulario y, a continuación, el campo de entrada
-// del correo electrónico, así como el elemento span en el que colocaremos el mensaje de error.
-const form  = document.getElementsByTagName('form')[0];
-
-const email = document.getElementById('mail');
-const emailError = document.querySelector('#mail + span.error');
-
-email.addEventListener('input', function (event) {
-  // Cada vez que el usuario escribe algo, verificamos si
-  // los campos del formulario son válidos.
-
-  if (email.validity.valid) {
-    // En caso de que haya un mensaje de error visible, si el campo
-    // es válido, eliminamos el mensaje de error.
-    emailError.innerHTML = ''; // Restablece el contenido del mensaje
-    emailError.className = 'error'; // Restablece el estado visual del mensaje
-  } else {
-    // Si todavía hay un error, muestra el error exacto
-    showError();
-  }
-});
-
-form.addEventListener('submit', function (event) {
-  // si el campo de correo electrónico es válido, dejamos que el formulario se envíe
-
-  if(!email.validity.valid) {
-    // Si no es así, mostramos un mensaje de error apropiado
-    showError();
-    // Luego evitamos que se envíe el formulario cancelando el evento
-    event.preventDefault();
-  }
-});
-
-function showError() {
-  if(email.validity.valueMissing) {
-    // Si el campo está vacío
-    // muestra el mensaje de error siguiente.
-    emailError.textContent = 'Debe introducir una dirección de correo electrónico.';
-  } else if(email.validity.typeMismatch) {
-    // Si el campo no contiene una dirección de correo electrónico
-    // muestra el mensaje de error siguiente.
-    emailError.textContent = 'El valor introducido debe ser una dirección de correo electrónico.';
-  } else if(email.validity.tooShort) {
-    // Si los datos son demasiado cortos
-    // muestra el mensaje de error siguiente.
-    emailError.textContent = 'El correo electrónico debe tener al menos ${ email.minLength } caracteres; ha introducido ${ email.value.length }.';
-  }
-
-  // Establece el estilo apropiado
-  emailError.className = 'error activo';
-}</pre>
-
-<p>Los comentarios explican las cosas bastante bien, pero de una manera muy breve:</p>
-
-<ul>
- <li>Cada vez que cambiamos el valor de la entrada, verificamos si contiene datos válidos. Si es así, eliminamos cualquier mensaje de error que se muestre. Si los datos no son válidos, ejecutamos <code>showError()</code> para mostrar el error correspondiente.</li>
- <li>Cada vez que intentamos enviar el formulario, verificamos nuevamente si los datos son válidos. Si es así, dejamos que envíe el formulario. Si no, ejecutamos <code>showError()</code> para mostrar el error correspondiente y detenemos el envío del formulario con <code><a href="/en-US/docs/Web/API/Event/preventDefault">preventDefault()</a></code>.</li>
- <li>La función <code>showError()</code> usa varias propiedades de la entrada <code>validity</code> para determinar cuál es el error y luego muestra un mensaje de error según corresponda.</li>
-</ul>
-
-<p>Este es el resultado:</p>
-
-<p>{{EmbedGHLiveSample("/en-US/learning-area/html/forms/form-validation/detailed-custom-validation.html", '100%', 150)}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes encontrar este ejemplo en vivo en GitHub como <a href="https://mdn.github.io/learning-area/html/forms/form-validation/detailed-custom-validation.html">detailed-custom-validation.html</a> (consulta también su <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/detailed-custom-validation.html">código fuente</a>).</p>
-</div>
-
-<p>La API de validación de restricciones te proporciona una herramienta poderosa para manejar la validación de formularios, y te permite tener un control enorme sobre la interfaz de usuario más allá de lo que puedas hacer solo con HTML y CSS.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Para obtener más información, consulta nuestra <a href="/es/docs/HTML/HTML5/Validacion_de_restricciones">guía de validación de restricciones</a> y la referencia de <a href="/en-US/docs/Web/API/Constraint_validation">API de validación de restricciones</a>.</p>
-</div>
-
-<h3 id="Validar_formularios_sin_una_API_incorporada">Validar formularios sin una API incorporada</h3>
-
-<p>En algunos casos, como la compatibilidad heredada del navegador o los <a href="/es/docs/Learn/HTML/Forms/como_crear_widgets_de_formularios_personalizados">controles personalizados</a>, no podrás o no querrás usar la API de validación de restricciones. Todavía puedes usar JavaScript para validar tu formulario, pero vas a tener que escribirlo.</p>
-
-<p>Antes de validar el formulario, hazte estas preguntas:</p>
-
-<dl>
- <dt>¿Qué tipo de validación debería realizar?</dt>
- <dd>Debes determinar cómo validar los datos: operaciones de cadena, conversión de tipos, expresiones regulares, etc. Tú decides.</dd>
- <dt>¿Qué debo hacer si el formulario no se valida?</dt>
- <dd>Esto es claramente un problema de la interfaz de usuario. Tienes que decidir cómo se comportará el formulario. ¿El formulario va a enviar los datos de todos modos? ¿Deberías resaltar los campos que dan error? ¿Deberías mostrar mensajes de error?</dd>
- <dt>¿Cómo puedo ayudar al usuario a corregir datos no válidos?</dt>
- <dd>Para reducir la frustración del usuario, es muy importante proporcionar tanta información útil como sea posible para guiarlo a fin de que corrija sus entradas de datos. Debes ofrecer sugerencias por adelantado para que sepan lo que se espera de ellos, así como mensajes de error claros. Si deseas profundizar en los requisitos de interfaz de usuario para la validación de formularios, aquí hay algunos artículos útiles que debes leer:
- <ul>
-  <li>SmashingMagazine: <a href="http://uxdesign.smashingmagazine.com/2012/06/27/form-field-validation-errors-only-approach/" rel="external">Form-Field Validation: The Errors-Only Approach</a> [Validación de campo de formulario: El enfoque de solo errores]</li>
-  <li>SmashingMagazine: <a href="http://www.smashingmagazine.com/2009/07/07/web-form-validation-best-practices-and-tutorials/" rel="external">Web Form Validation: Best Practices and Tutorials </a> [Validación de formularios web: Buenas prácticas y tutoriales]</li>
-  <li>Six Revision: <a href="http://sixrevisions.com/user-interface/best-practices-for-hints-and-validation-in-web-forms/" rel="external">Best Practices for Hints and Validation in Web Forms</a> [Buenas prácticas para sugerencias y validación de formularios web]</li>
-  <li>A List Apart: <a href="http://www.alistapart.com/articles/inline-validation-in-web-forms/" rel="external">Inline Validation in Web Forms</a> [Validación en línea de formularios web]</li>
- </ul>
- </dd>
-</dl>
-
-<h4 id="Un_ejemplo_que_no_usa_la_API_de_validación_de_restricciones">Un ejemplo que no usa la API de validación de restricciones</h4>
-
-<p>Para ilustrar esto, mostramos una versión simplificada del ejemplo anterior que funciona con navegadores con compatibilidad heredada.</p>
-
-<p>El HTML es casi el mismo; solo hemos eliminado las funciones de validación de HTML.</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;p&gt;
-    &lt;label for="mail"&gt;
-        &lt;span&gt;Por favor, introduzca una dirección de correo electrónico: &lt;/span&gt;
-        &lt;input type="text" class="mail" id="mail" name="mail"&gt;
-        &lt;span class="error" aria-live="polite"&gt;&lt;/span&gt;
-    &lt;/label&gt;
-  &lt;/p&gt;
-  &lt;!-- Algunos navegadores con compatibilidad heredada deben tener el atributo «type»
-       establecido explícitamente en el elemento «button» de «submit»--&gt;
-  &lt;button type="submit"&gt;Enviar&lt;/button&gt;
-&lt;/form&gt;</pre>
-
-<p>Del mismo modo, no es necesario cambiar mucho el CSS; acabamos de convertir la pseudoclase {{cssxref(":invalid")}} de CSS en una clase real y evitamos usar el selector de atributos que no funciona en Internet Explorer 6.</p>
-
-<pre class="brush: css notranslate">body {
-  font: 1em sans-serif;
-  width: 200px;
-  padding: 0;
-  margin : 0 auto;
-}
-
-form {
-  max-width: 200px;
-}
-
-p * {
-  display: block;
-}
-
-input.mail {
-  -webkit-appearance: none;
-
-  width: 100%;
-  border: 1px solid #333;
-  margin: 0;
-
-  font-family: inherit;
-  font-size: 90%;
-
-  box-sizing: border-box;
-}
-
-/* Este es nuestro diseño para los campos no válidos */
-input.invalid{
-  border-color: #900;
-  background-color: #FDD;
-}
-
-input:focus.invalid {
-  outline: none;
-}
-
-/* Este es el diseño para nuestros mensajes de error */
-.error {
-  width : 100%;
-  padding: 0;
-
-  font-size: 80%;
-  color: white;
-  background-color: #900;
-  border-radius: 0 0 5px 5px;
-  box-sizing: border-box;
-}
-
-.error.active {
-  padding: 0.3em;
-}</pre>
-
-<p>Los grandes cambios están en el código JavaScript, que necesita hacer mucho más trabajo pesado.</p>
-
-<pre class="brush: js notranslate">// Hay menos formas de elegir un nodo DOM con navegadores antiguos
-const form  = document.getElementsByTagName('form')[0];
-const email = document.getElementById('mail');
-
-// Lo siguiente es un truco para llegar al siguiente nodo de elementos hermanos en el DOM
-// Esto es peligroso porque puedes construir fácilmente un bucle infinito.
-// En los navegadores modernos es mejor usar element.nextElementSibling
-let error = email;
-while ((error = error.nextSibling).nodeType != 1);
-
-// según la especificación HTML5
-const emailRegExp = /^[a-zA-Z0-9.!#$%&amp;'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
-
-// Muchos navegadores antiguos no son compatibles con el método addEventListener.
-// Aquí hay una manera simple de manejar esto; está lejos de ser la única.
-function addEvent(element, event, callback) {
-  let previousEventCallBack = element["on"+event];
-  element["on"+event] = function (e) {
-    const output = callback(e);
-
-    // Una devolución de llamada que devuelve «false» detiene la cadena de devolución de llamada
-    // e interrumpe la ejecución de la devolución de llamada del evento.
-    if (output === false) return false;
-
-    if (typeof previousEventCallBack === 'function') {
-      output = previousEventCallBack(e);
-      if(output === false) return false;
-    }
-  }
-};
-
-// Ahora podemos reconstruir nuestra restricción de validación
-// Debido a que no confiamos en la pseudoclase de CSS, tenemos que
-// establecer explícitamente la clase valid/invalid en nuestro campo de correo electrónico
-addEvent(window, "load", function () {
-  // Aquí probamos si el campo está vacío (recuerda, el campo no es obligatorio)
-  // Si no es así, verificamos si su contenido es una dirección de correo electrónico con el formato correcto.
-  const test = email.value.length === 0 || emailRegExp.test(email.value);
-
-  email.className = test ? "valid" : "invalid";
-});
-
-// Esto define lo que sucede cuando el usuario escribe en el campo
-addEvent(email, "input", function () {
-  const test = email.value.length === 0 || emailRegExp.test(email.value);
-  if (test) {
-    email.className = "valid";
-    error.innerHTML = "";
-    error.className = "error";
-  } else {
-    email.className = "invalid";
-  }
-});
-
-// Esto define lo que sucede cuando el usuario intenta enviar los datos.
-addEvent(form, "submit", function () {
-  const test = email.value.length === 0 || emailRegExp.test(email.value);
-
-  if (!test) {
-    email.className = "invalid";
-    error.innerHTML = "I expect an e-mail, darling!";
-    error.className = "error active";
-
-    // Algunos navegadores antiguos no son compatibles con el método event.preventDefault ()
-    return false;
-  } else {
-    email.className = "valid";
-    error.innerHTML = "";
-    error.className = "error";
-  }
-});</pre>
-
-<p>El resultado es el siguiente:</p>
-
-<p>{{EmbedLiveSample("Validar_formularios_sin_una_API_incorporada", "100%", 130)}}</p>
-
-<p>Como puedes ver, no es tan difícil construir un sistema de validación por tu cuenta. La parte difícil es hacer que sea lo suficientemente genérico para que se pueda usar en diferentes plataformas y en cualquier forma. Hay muchas bibliotecas de archivos disponibles para realizar la validación de formularios, como por ejemplo <a href="http://rickharrison.github.com/validate.js/" rel="external">Validate.js</a></p>
-
-<p>.</p>
-
-<h2 id="Prueba_tus_habilidades!">Prueba tus habilidades!</h2>
-
-<p>Has llegado al final de este artículo pero ¿puedes recordar la información más importante?Puedes encontrar pruebas adicionales para comprovar que has comprendido la información antes de que continue — visita <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Forms/Test_your_skills:_Form_validation">Prueba tus habilidades: Validación de formularios</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>La validación de formularios en el lado del cliente a veces requiere JavaScript si deseas personalizar el estilo y los mensajes de error, pero <em>siempre</em> requiere que pienses cuidadosamente en el usuario. Recuerda que siempre debes ayudar a tus usuarios a corregir los datos que proporcionan. Para ese fin, asegúrate de:</p>
-
-<ul>
- <li>Mostrar mensajes de error explícitos.</li>
- <li>Ser permisivo con el formato de entrada.</li>
- <li>Señalar exactamente dónde se produce el error, especialmente en formularios extensos.</li>
-</ul>
-
-<p>Una vez que hayas verificado que el formulario se ha completado correctamente, puedes proceder a enviarlo. Vamos a exponer el <a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">envío de los datos del formulario</a> en el próximo artículo.</p>
-
-<p>{{PreviousMenuNext("Learn/Forms/UI_pseudo-classes", "Learn/Forms/Sending_and_retrieving_form_data", "Learn/HTML/Forms")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Forms/Your_first_form">Tu primer formulario</a></li>
- <li><a href="/en-US/docs/Learn/Forms/How_to_structure_a_web_form">Cómo estructurar un formulario web</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">Los controles de formulario básicos originales</a></li>
- <li><a href="/en-US/docs/Learn/Forms/HTML5_input_types">Los tipos de entrada en HTML5</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Other_form_controls">Otros controles de formulario</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Styling_web_forms">Aplicar estilo a formularios web</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Aplicación de estilo a formularios avanzada</a></li>
- <li><a href="/en-US/docs/Learn/Forms/UI_pseudo-classes">Pseudoclases UI</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Form_validation">Validación de formularios en el lado del cliente</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
-</ul>
-
-<h3 id="Temas_avanzados">Temas avanzados</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_controls">Cómo construir controles de formulario personalizados</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Sending_forms_through_JavaScript">Enviar formularios por JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad de propiedades para controles de formulario</a></li>
-</ul>
diff --git a/files/es/learn/html/forms/your_first_html_form/index.html b/files/es/learn/html/forms/your_first_html_form/index.html
deleted file mode 100644
index df9d73bc60..0000000000
--- a/files/es/learn/html/forms/your_first_html_form/index.html
+++ /dev/null
@@ -1,305 +0,0 @@
----
-title: Mi primer formulario HTML
-slug: Learn/HTML/Forms/Your_first_HTML_form
-tags:
-  - Ejemplo
-  - Guía
-  - HTML
-  - Principiante
-  - Web
-  - formulários
-translation_of: Learn/Forms/Your_first_form
----
-<div>{{LearnSidebar}}{{NextMenu("Learn/Forms/How_to_structure_a_web_form", "Learn/Forms")}}</div>
-
-<p class="summary">El primer artículo de nuestra serie te proporciona una primera experiencia de creación de un formulario web, que incluye diseñar un formulario sencillo con controles de formulario adecuados y otros elementos HTML, añadir un poco de estilo muy simple con CSS y describir cómo se envían los datos a un servidor. Ampliaremos cada uno de estos subtemas más adelante.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática y de <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">lenguaje HTML</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Familiarizarse con los formularios web, para qué se usan, cómo diseñarlos y qué elementos HTML básicos vas a necesitar para casos sencillos.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_son_los_formularios_web">¿Qué son los formularios web?</h2>
-
-<p>Los <strong>formularios web</strong> son uno de los principales puntos de interacción entre un usuario y un sitio web o aplicación. Los formularios permiten a los usuarios la introducción de datos, que generalmente se envían a un servidor web para su procesamiento y almacenamiento (consulta <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a> más adelante en el módulo), o se usan en el lado del cliente para provocar de alguna manera una actualización inmediata de la interfaz (por ejemplo, se añade otro elemento a una lista, o se muestra u oculta una función de interfaz de usuario).</p>
-
-<p>El HTML de un <strong>formulario web</strong> está compuesto por uno o más <strong>controles de formulario</strong> (a veces llamados <strong>widgets</strong>), además de algunos elementos adicionales que ayudan a estructurar el formulario general; a menudo se los conoce como <strong>formularios HTML</strong>. Los controles pueden ser campos de texto de una o varias líneas, cajas desplegables, botones, casillas de verificación o botones de opción, y se crean principalmente con el elemento {{htmlelement("input")}}, aunque hay algunos otros elementos que también hay que conocer.</p>
-
-<p>Los controles de formulario también se pueden programar para forzar la introducción de formatos o valores específicos (<strong>validación de formulario</strong>), y se combinan con etiquetas de texto que describen su propósito para los usuarios con y sin discapacidad visual.</p>
-
-<h2 id="Diseñar_tu_formulario">Diseñar tu formulario</h2>
-
-<p>Antes de comenzar a escribir código, siempre es mejor dar un paso atrás y tomarte el tiempo necesario para pensar en tu formulario. Diseñar una maqueta rápida te ayudará a definir el conjunto de datos adecuado que deseas pedirle al usuario que introduzca. Desde el punto de vista de la experiencia del usuario (UX), es importante recordar que cuanto más grande es tu formulario, más te arriesgas a frustrar a las personas y perder usuarios. Tiene que ser simple y conciso: solicita solo los datos que necesitas.</p>
-
-<p>Diseñar formularios es un paso importante cuando creas un sitio web o una aplicación. Va más allá del alcance de este artículo exponer la experiencia de usuario de los formularios, pero si deseas profundizar en ese tema, puedes leer los artículos siguientes:</p>
-
-<ul>
- <li>Smashing Magazine tiene algunos <a href="https://www.smashingmagazine.com/2018/08/ux-html5-mobile-form-part-1/" rel="external" title="http://uxdesign.smashingmagazine.com/tag/forms/">artículos muy buenos sobre formularios UX</a>, incluido el artículo —antiguo pero relevante— <a href="https://www.smashingmagazine.com/2011/11/extensive-guide-web-form-usability/" rel="external" title="http://uxdesign.smashingmagazine.com/2011/11/08/extensive-guide-web-form-usability/">An Extensive Guide To Web Form Usability</a> [Amplia guía de usabilidad para formularios web].</li>
- <li>UXMatters también es un recurso que da buenos consejos, desde <a href="http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php" rel="external" title="http://www.uxmatters.com/mt/archives/2012/05/7-basic-best-practices-for-buttons.php"> buenas prácticas básicas</a> hasta cuestiones complejas como los <a href="http://www.uxmatters.com/mt/archives/2010/03/pagination-in-web-forms-evaluating-the-effectiveness-of-web-forms.php" title="http://www.uxmatters.com/mt/archives/2010/03/pagination-in-web-forms-evaluating-the-effectiveness-of-web-forms.php"> formularios de varias páginas</a>.</li>
-</ul>
-
-<p>En este artículo, vamos a crear un formulario de contacto sencillo. Hagamos un esbozo.</p>
-
-<p><img alt="Esbozo aproximado del formulario que vamos a construir" src="/files/4579/form-sketch-low.jpg" style="border-style: solid; border-width: 1px; display: block; height: 352px; margin: 0px auto; width: 400px;"></p>
-
-<p>Nuestro formulario va a tener tres campos de texto y un botón. Le pedimos al usuario su nombre, su correo electrónico y el mensaje que desea enviar. Al pulsar el botón sus datos se enviarán a un servidor web.</p>
-
-<h2 id="Aprendizaje_activo_La_implementación_de_nuestro_formulario_HTML">Aprendizaje activo: La implementación de nuestro formulario HTML</h2>
-
-<p>De acuerdo, intentemos crear el HTML para nuestro formulario. Vamos a utilizar los elementos HTML siguientes: {{HTMLelement("form")}}, {{HTMLelement("label")}}, {{HTMLelement("input")}}, {{HTMLelement("textarea")}} y {{HTMLelement("button")}}.</p>
-
-<p>Antes de continuar, haz una copia local de nuestra <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">plantilla HTML simple</a>: introduce aquí tu formulario HTML.</p>
-
-<h3 id="El_elemento_HTMLelementform">El elemento {{HTMLelement("form")}}</h3>
-
-<p>Todos los formularios comienzan con un elemento {{HTMLelement("form")}}, como este:</p>
-
-<pre class="brush:html; notranslate">&lt;form action="/my-handling-form-page" method="post"&gt;
-
-&lt;/form&gt;</pre>
-
-<p>Este elemento define formalmente un formulario. Es un elemento contenedor, como un elemento {{HTMLelement("section")}} o {{HTMLelement("footer")}}, pero específico para contener formularios; también admite algunos atributos específicos para la configuración de la forma en que se comporta el formulario. Todos sus atributos son opcionales, pero es una práctica estándar establecer siempre al menos los atributos <a href="/en-US/docs/Web/HTML/Attributes/action"><code>action</code></a> y <a href="/en-US/docs/Web/HTML/Attributes/method"><code>method</code></a>:</p>
-
-<ul>
- <li>El atributo <code>action</code> define la ubicación (URL) donde se envían los datos que el formulario ha recopilado cuando se validan.</li>
- <li>El atributo <code>method</code> define con qué método HTTP se envían los datos (generalmente <code>get</code> o <code>post</code>).</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Veremos cómo funcionan esos atributos en nuestro artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a> que encontrarás más adelante.</p>
-</div>
-
-<p>Por ahora, añade el elemento {{htmlelement("form")}} anterior a tu elemento HTML {{htmlelement("body")}}.</p>
-
-<h3 id="Los_elementos_HTMLelementlabel_HTMLelementinput_y_HTMLelementtextarea">Los elementos {{HTMLelement("label")}}, {{HTMLelement("input")}} y {{HTMLelement("textarea")}}</h3>
-
-<p>Nuestro formulario de contacto no es complejo: la parte para la entrada de datos contiene tres campos de texto, cada uno con su elemento {{HTMLelement("label")}} correspondiente:</p>
-
-<ul>
- <li>El campo de entrada para el nombre es un {{HTMLelement("input/text", "campo de texto de una sola línea")}}.</li>
- <li>El campo de entrada para el correo electrónico es una {{HTMLelement ("input/email", "entrada de datos de tipo correo electrónico")}}: un campo de texto de una sola línea que acepta solo direcciones de correo electrónico.</li>
- <li>El campo de entrada para el mensaje es {{HTMLelement("textarea")}}; un campo de texto multilínea.</li>
-</ul>
-
-<p>En términos de código HTML, para implementar estos controles de formulario necesitamos algo como lo siguiente:</p>
-
-<pre class="brush:html; notranslate" dir="rtl">&lt;form action="/my-handling-form-page" method="post"&gt;
- &lt;ul&gt;
-  &lt;li&gt;
-    &lt;label for="name"&gt;Nombre:&lt;/label&gt;
-    &lt;input type="text" id="name" name="user_name"&gt;
-  &lt;/li&gt;
-  &lt;li&gt;
-    &lt;label for="mail"&gt;Correo electrónico:&lt;/label&gt;
-    &lt;input type="email" id="mail" name="user_mail"&gt;
-  &lt;/li&gt;
-  &lt;li&gt;
-    &lt;label for="msg"&gt;Mensaje:&lt;/label&gt;
-    &lt;textarea id="msg" name="user_message"&gt;&lt;/textarea&gt;
-  &lt;/li&gt;
- &lt;/ul&gt;
-&lt;/form&gt;</pre>
-
-<p>Actualiza el código de tu formulario para que se vea como el anterior.</p>
-
-<p>Los elementos {{HTMLelement("li")}} están ahí para estructurar nuestro código convenientemente y facilitar la aplicación de estilo (ver más adelante en el artículo). Por motivos de usabilidad y accesibilidad incluimos una etiqueta explícita para cada control de formulario. Ten en cuenta el uso del atributo <a href="/en-US/docs/Web/HTML/Attributes/for"> <code>for</code> </a> en todos los elementos {{HTMLelement("label")}}, que toma como valor el <a href="/en-US/docs/Web/HTML/Attributes/id"><code>id</code></a> del control de formulario con el que está asociado; así es como asocias un formulario con su etiqueta.</p>
-
-<p>Hacer esto presenta muchas ventajas porque la etiqueta está asociada al control del formulario y permite que los usuarios con ratón, panel táctil y dispositivos táctiles hagan clic en la etiqueta para activar el control correspondiente, y también proporciona accesibilidad con un nombre que los lectores de pantalla leen a sus usuarios. Encontrarás más detalles sobre las etiquetas de los formularios en <a href="/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario web</a>.</p>
-
-<p>En el elemento {{HTMLelement("input")}}, el atributo más importante es <code>type</code>. Este atributo es muy importante porque define la forma en que el elemento {{HTMLelement("input")}} aparece y se comporta. Encontrarás más información sobre esto en el artículo sobre <a href="/es/docs/Learn/HTML/Forms/The_native_form_widgets">Controles de formularios nativos básicos</a> más adelante.</p>
-
-<ul>
- <li>En nuestro ejemplo sencillo, usamos el valor {{HTMLelement("input/text")}} para la primera entrada, el valor predeterminado para este atributo. Representa un campo de texto básico de una sola línea que acepta cualquier tipo de entrada de texto.</li>
- <li>Para la segunda entrada, usamos el valor {{HTMLelement("input/email")}}, que define un campo de texto de una sola línea que solo acepta una dirección de correo electrónico. Esto convierte un campo de texto básico en una especie de campo «inteligente» que efectúa algunas comprobaciones de validación de los datos que el usuario escribe. También hace que aparezca un diseño de teclado más apropiado para introducir direcciones de correo electrónico (por ejemplo, con un símbolo @ por defecto) en dispositivos con teclados dinámicos, como teléfonos inteligentes. Encontrarás más información sobre la validación de formularios en el artículo de <a href="/es/docs/Learn/HTML/Forms/Validacion_formulario_datos">Validación de formularios por parte del cliente</a> más adelante.</li>
-</ul>
-
-<p>Por último, pero no por ello menos importante, ten en cuenta la sintaxis de <code>&lt;input&gt;</code> en contraposición con la de <code>&lt;textarea&gt;&lt;/textarea&gt;</code>. Esta es una de las rarezas del HTML. La etiqueta <code>&lt;input&gt;</code> es un elemento vacío, lo que significa que no necesita una etiqueta de cierre. El elemento {{HTMLElement("textarea")}} no es un elemento vacío, lo que significa que debe cerrarse con la etiqueta de cierre adecuada. Esto tiene un impacto en una característica específica de los formularios: el modo en que defines el valor predeterminado. Para definir el valor predeterminado de un elemento {{HTMLElement("input")}}, debes usar el atributo <a href="/en-US/docs/Web/HTML/Attributes/value"><code>value</code></a> de esta manera:</p>
-
-<pre class="brush:html; notranslate">&lt;input type="text" value="por defecto este elemento se llena con este texto"&gt;</pre>
-
-<p>Por otro lado, si deseas definir un valor predeterminado para un elemento {{HTMLElement("textarea")}}, lo colocas entre las etiquetas de apertura y cierre del elemento {{HTMLElement("textarea")}}, así:</p>
-
-<pre class="brush:html; notranslate">&lt;textarea&gt;
-Por defecto, este elemento contiene este texto
-&lt;/textarea&gt;</pre>
-
-<h3 id="El_elemento_HTMLelementbutton">El elemento {{HTMLelement("button")}}</h3>
-
-<p>El marcado de nuestro formulario está casi completo; solo necesitamos añadir un botón para permitir que el usuario envíe sus datos una vez que haya completado el formulario. Esto se hace con el elemento {{HTMLelement("button")}}; añade lo siguiente justo encima de la etiqueta de cierre <code>&lt;/form&gt;</code>:</p>
-
-<pre class="brush:html; notranslate">&lt;li class="button"&gt;
-  &lt;button type="submit"&gt;Envíe su mensaje&lt;/button&gt;
-&lt;/li&gt;</pre>
-
-<p>El elemento {{htmlelement("button")}} también acepta un atributo de <code>type</code>, que a su vez acepta uno de estos tres valores: <code>submit</code>, <code>reset</code> o <code>button</code>.</p>
-
-<ul>
- <li>Un clic en un botón <code>submit</code> (el valor predeterminado) envía los datos del formulario a la página web definida por el atributo <code>action</code> del elemento {{HTMLelement("form")}}.</li>
- <li>Un clic en un botón <code>reset</code> restablece de inmediato todos los controles de formulario a su valor predeterminado. Desde el punto de vista de UX, esto se considera una mala práctica, por lo que debes evitar usar este tipo de botones a menos que realmente tengas una buena razón para incluirlos.</li>
- <li>Un clic en un botón <code>button</code> no hace... ¡nada! Eso suena tonto, pero es muy útil para crear botones personalizados: puedes definir su función con JavaScript.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: También puedes usar el elemento {{HTMLElement("input")}} con el atributo <code>type</code> correspondiente para generar un botón, por ejemplo <code>&lt;input type="submit"&gt;</code>. La ventaja principal del elemento {{HTMLelement("button")}} es que el elemento {{HTMLelement("input")}} solo permite texto sin formato en su etiqueta, mientras que el elemento {{HTMLelement("button")}} permite contenido HTML completo, lo que permite generar botones creativos más complejos.</p>
-</div>
-
-<h2 id="Aplicar_estilo_básico_a_un_formulario">Aplicar estilo básico a un formulario</h2>
-
-<p>Ahora que has terminado de escribir el código HTML de tu formulario, guárdalo y observa lo que ocurre en un navegador. Por ahora, se verá bastante feo.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si crees que no has escrito bien el código HTML, compáralo con nuestro ejemplo final: véase <a href="https://github.com/mdn/learning-area/blob/master/html/forms/your-first-HTML-form/first-form.html">first-form.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/your-first-HTML-form/first-form.html">ver en vivo</a>).</p>
-</div>
-
-<p>Resulta notablemente difícil aplicar estilo a los formularios. Está más allá del alcance de este artículo enseñarte cómo aplicar estilo a los formularios en detalle, por lo que por el momento solo vamos a exponer cómo añadir un poco de CSS para que se vea un poco bien.</p>
-
-<p>En primer lugar, añade un elemento {{htmlelement("style")}} a tu página, dentro de la cabecera del HTML. Debe quedar así:</p>
-
-<pre class="brush: html notranslate">&lt;style&gt;
-
-&lt;/style&gt;</pre>
-
-<p>Dentro de las etiquetas <code>style</code>, añade el código CSS siguiente:</p>
-
-<pre class="brush:css; notranslate">form {
-  /* Centrar el formulario en la página */
-  margin: 0 auto;
-  width: 400px;
-  /* Esquema del formulario */
-  padding: 1em;
-  border: 1px solid #CCC;
-  border-radius: 1em;
-}
-
-ul {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-}
-
-form li + li {
-  margin-top: 1em;
-}
-
-label {
-  /* Tamaño y alineación uniforme */
-  display: inline-block;
-  width: 90px;
-  text-align: right;
-}
-
-input,
-textarea {
-  /* Para asegurarse de que todos los campos de texto tienen la misma configuración de letra
-     Por defecto, las áreas de texto tienen un tipo de letra monoespaciada */
-  font: 1em sans-serif;
-
-  /* Tamaño uniforme del campo de texto */
-  width: 300px;
-  box-sizing: border-box;
-
-  /* Hacer coincidir los bordes del campo del formulario */
-  border: 1px solid #999;
-}
-
-input:focus,
-textarea:focus {
-  /* Destacado adicional para elementos que tienen el cursor */
-  border-color: #000;
-}
-
-textarea {
-  /* Alinear los campos de texto multilínea con sus etiquetas */
-  vertical-align: top;
-
-  /* Proporcionar espacio para escribir texto */
-  height: 5em;
-}
-
-.button {
-  /* Alinear los botones con los campos de texto */
-  padding-left: 90px; /* mismo tamaño que los elementos de la etiqueta */
-}
-
-button {
-  /* Este margen adicional representa aproximadamente el mismo espacio que el espacio
-     entre las etiquetas y sus campos de texto */
-  margin-left: .5em;
-}</pre>
-
-<p>Guarda y vuelve a cargar, y observa que tu formulario presenta un aspecto mucho menos feo.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar nuestra versión en GitHub en <a href="https://github.com/mdn/learning-area/blob/master/html/forms/your-first-HTML-form/first-form-styled.html">first-form-styled.html</a> (<a href="https://mdn.github.io/learning-area/html/forms/your-first-HTML-form/first-form-styled.html">ver en vivo</a>).</p>
-</div>
-
-<h2 id="Enviar_los_datos_del_formulario_a_un_servidor_web">Enviar los datos del formulario a un servidor web</h2>
-
-<p>La última parte, y quizás la más complicada, es manejar los datos del formulario en el lado del servidor. El elemento {{HTMLelement("form")}} define dónde y cómo enviar los datos gracias a los atributos <a href="/en-US/docs/Web/HTML/Attributes/action"><code>action</code></a> y <a href="/en-US/docs/Web/HTML/Attributes/method"><code>method</code></a>.</p>
-
-<p>Proporcionamos un nombre (<a href="/en-US/docs/Web/HTML/Attributes/name"><code>name</code></a>) a cada control de formulario. Los nombres son importantes tanto en el lado del cliente como del servidor; le dicen al navegador qué nombre debe dar a cada dato y, en el lado del servidor, dejan que el servidor maneje cada dato por su nombre. Los datos del formulario se envían al servidor como pares de nombre/valor.</p>
-
-<p>Para poner nombre a los diversos datos que se introducen en un formulario, debes usar el atributo <code>name</code> en cada control de formulario que recopila un dato específico. Veamos de nuevo algunos de nuestros códigos de formulario:</p>
-
-<pre class="brush:html; notranslate">&lt;form action="/my-handling-form-page" method="post"&gt;
- &lt;ul&gt;
-  &lt;li&gt;
-    &lt;label for="name"&gt;Nombre:&lt;/label&gt;
-    &lt;input type="text" id="name" name="user_name" /&gt;
-  &lt;/li&gt;
-  &lt;li&gt;
-    &lt;label for="mail"&gt;Correo electrónico:&lt;/label&gt;
-    &lt;input type="email" id="mail" name="user_email" /&gt;
-  &lt;/li&gt;
-  &lt;li&gt;
-    &lt;label for="msg"&gt;Mensaje:&lt;/label&gt;
-    &lt;textarea id="msg" name="user_message"&gt;&lt;/textarea&gt;
-  &lt;/li&gt;
-
-  ...
-</pre>
-
-<p>En nuestro ejemplo, el formulario envía tres datos denominados «<code>user_name</code>», «<code>user_email</code>» y «<code>user_message</code>». Esos datos se envían a la URL «<code>/my-handling-form-page</code>» utilizando el método <a href="/en-US/docs/Web/HTTP/Methods/POST"><code>post</code> de HTTP</a>.</p>
-
-<p>En el lado del servidor, la secuencia de comandos de la URL «<code>/my-handling-form-page</code>» recibe los datos como una lista de tres elementos clave/valor contenidos en la solicitud HTTP. La forma en que este script maneja esos datos depende de ti. Cada lenguaje de servidor (PHP, Python, Ruby, Java, C#, etc.) tiene su propio mecanismo de manipulación de datos de formulario. No profundizaremos sobre el tema en esta guía, pero si deseas obtener más información, proporcionamos algunos ejemplos en nuestro artículo <a href="/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data" title="/en-US/docs/HTML/Forms/Sending_and_retrieving_form_data"><span>Enviar los datos de un formulario</span></a> que encontrarás más adelante.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>¡Enhorabuena!, has creado tu primer formulario web. Debería verse así:</p>
-
-<p>{{ EmbedLiveSample('A_simple_form', '100%', '240', '', 'Learn/Forms/Your_first_form/Example') }}</p>
-
-<p>Pero esto es solo el comienzo: ahora ha llegado el momento de profundizar en el tema. Los formularios tienen mucho más potencial de lo que hemos visto aquí y los artículos siguientes de este módulo te ayudarán a dominarlo.</p>
-
-<p>{{NextMenu("Learn/Forms/How_to_structure_a_web_form", "Learn/Forms")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Forms/Your_first_form">Tu primer formulario</a></li>
- <li><a href="/en-US/docs/Learn/Forms/How_to_structure_a_web_form">Cómo estructurar un formulario web</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Basic_native_form_controls">Los controles de formulario básicos originales</a></li>
- <li><a href="/en-US/docs/Learn/Forms/HTML5_input_types">Los tipos de entrada en HTML5</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Other_form_controls">Otros controles de formulario</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Styling_web_forms">Aplicación de estilo a formularios web</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Advanced_form_styling">Aplicación de estilo a formularios avanzada</a></li>
- <li><a href="/en-US/docs/Learn/Forms/UI_pseudo-classes">Pseudoclases UI</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Form_validation">Validación del formulario del lado del cliente</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Sending_and_retrieving_form_data">Enviar los datos de un formulario</a></li>
-</ul>
-
-<h3 id="Temas_avanzados">Temas avanzados</h3>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Forms/How_to_build_custom_form_controls">Cómo construir controles de formulario personalizados</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Sending_forms_through_JavaScript">Enviar formularios a través de JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/Forms/Property_compatibility_table_for_form_widgets">Tabla de compatibilidad para las propiedades de los controles de formulario</a></li>
-</ul>
diff --git a/files/es/learn/html/howto/author_fast-loading_html_pages/index.html b/files/es/learn/html/howto/author_fast-loading_html_pages/index.html
new file mode 100644
index 0000000000..221875140a
--- /dev/null
+++ b/files/es/learn/html/howto/author_fast-loading_html_pages/index.html
@@ -0,0 +1,54 @@
+---
+title: Consejos para la creación de páginas HTML de carga rápida
+slug: Learn/HTML/Howto/Author_fast-loading_HTML_pages
+tags:
+  - Consejos
+  - HTML
+  - Rapido
+  - Tips
+translation_of: Learn/HTML/Howto/Author_fast-loading_HTML_pages
+original_slug: Web/HTML/Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida
+---
+<h2 id="Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida">Consejos para la creación de páginas HTML de carga rápida</h2>
+
+<p>Estos consejos estan basados en conocimiento común y experimentación.</p>
+
+<p>Una página web optimizada no solo provee una mayor respuesta a su sitio por parte de los visitantes, sino que también reduce la carga en su servidores web y en su conexión de internet. Esto puede ser crucial para sitios con alto volumen o sitios que tienen un pico de trafico debido a circunstancias inucuales como noticias de ultima hora.</p>
+
+<p>Optimizar la carga de páginas no es solo para el contenido que será visto atraves de una estrecha conexión telefónica o dispositivos móviles. <span id="result_box" lang="es"><span class="hps">Es</span> <span class="hps">tan importante</span> <span class="hps">para el contenido</span> <span class="hps">de banda ancha</span> <span class="hps">y puede conducir a</span> <span class="hps">mejoras espectaculares</span> <span class="hps">incluso</span> <span class="hps">para sus</span> <span class="hps">visitantes con</span> <span class="hps">las conexiones más rápidas</span><span>.</span></span></p>
+
+<h3 id="Consejos">Consejos</h3>
+
+<h4 id="Reducir_el_peso_de_las_páginas_web">Reducir el peso de las páginas web</h4>
+
+<p>El peso de las páginas web es por mucho el factor más importante en el rendimiento de carga de una página.</p>
+
+<p>Reducir el peso de la página mediante la eliminación de espacios en blanco innecesarios y comentarios, comunmente se coonoce como minimalización, y al mover "inline-script" y "CSS" a un archivo externo, puede mejorar el rendimiento de la descarga con minimas necesidades de otros cambios en la estructura de la página.</p>
+
+<p>Herramientas como <a class="external external-icon" href="http://tidy.sourceforge.net/">HTML Tidy</a> pueden <span id="result_box" lang="es"><span class="hps">quitar</span> <span class="hps">automáticamente</span> <span class="hps">espacios en blanco</span> <span class="hps">y las líneas</span> <span class="hps">en blanco adicionales</span> <span class="hps">de</span> <span class="hps">código fuente HTML valido</span><span class="hps">. Otras herramientas pueden "comprimir"</span></span> JavaScript al reformatear el codigo fuente o <span id="result_box" lang="es"><span class="hps">por</span> <span class="alt-edited hps">ofuscación</span> <span class="hps">la fuente</span> <span class="hps">y la sustitución de</span> <span class="hps">los identificadores largos con versiones mas cortas.</span></span></p>
+
+<h3 id="Minimizar_el_número_de_archivos">Minimizar el número de archivos</h3>
+
+<p>Reducir el número de archivos referentes en una pagina web baja el número de conexiones <a href="https://developer.mozilla.org/en-US/docs/HTTP" title="en-US/docs/HTTP">HTTP</a> requeridas para bajar la página.</p>
+
+<p>Dependiendo de la configuración de cache de un navegador, puede enviar una petición <span id="result_box" lang="es"><span class="hps">"If</span><span>-Modified-Since"</span></span> al servidor web para cada "CSS", JavaScript o archivo de imágen, preguntando si el archivo ha sido modificado desde la ultima vez que fué descargado.</p>
+
+<p>Al reducir el número de archivos que son refereciados dentro de una página web, <span id="result_box" lang="es"><span class="hps">se reduce el</span> <span class="hps">tiempo necesario para que</span> <span class="hps">estas solicitudes</span> <span class="hps">se envíen</span><span>,</span> <span class="hps">y</span> <span class="hps">para que  sus</span> <span class="hps">respuestas</span> <span class="hps">que se reciban</span><span>.</span></span></p>
+
+<p>Si se usan muchas imágenes de fondo en sus "CSS", puedes reducir la cantidad de busquedas HTTP necesarias al combinar las imagenes en una, conocido como "image sprite". Luego solamente <span id="result_box" lang="es"><span class="hps">se aplica la</span> <span class="hps">misma imagen</span> <span class="hps">cada</span> <span class="hps">vez que lo necesite</span> <span class="hps">para un fondo,</span> <span class="hps">ajustando las coordenadas el eje (X / Y</span></span>) adecuadamente. Estas técnica trabaja mejor con elementos que tendrán dimensiones limitadas, no funcionará para todos los usos de imagenes de fondo, sin embargo, la menor cantidad de pedidos HTTP y el uso de una única imágen en caché puede reducir el timepo de carga de una página.</p>
+
+<p>Demasiado tiempo gastado en consultar la ultima modificación de los archivos referenciados puede demorar la pantalla inicial de una página web, <span id="result_box" lang="es"><span class="hps">ya que el</span> <span class="hps">explorador debe</span> <span class="hps">comprobar</span> <span class="hps">la fecha de modificación</span> <span class="hps">de cada</span> <span class="hps">archivo</span> <span class="hps">CSS o</span> <span class="hps">JavaScript</span><span>, antes de pintar la página.</span></span></p>
+
+<h3 id="Reducir_la_busqueda_de_dominios">Reducir la busqueda de dominios</h3>
+
+<p>Debido a que cada dominio separado cuesta tiempo en una busqeuda DNS, el tiempo de carga de la página crecerá junto con el número de dominios <span id="result_box" lang="es"><span class="hps">que aparecen en</span> <span class="hps">enlace</span> <span class="hps">CSS</span> <span class="atn hps">(</span><span>s</span><span>)</span>, <span class="hps"> JavaScript</span> <span class="hps">y</span> <span class="hps">recursos de</span> <span class="hps">imagen.</span></span></p>
+
+<p>Esto no puede ser siempre práctico; sin embargo <span id="result_box" lang="es"><span class="hps">siempre se debe</span> <span class="hps">tener cuidado de usar</span> <span class="hps">sólo el número</span> <span class="hps">mínimo necesario</span> <span class="hps">de los diferentes dominios</span> <span class="hps">en</span> <span class="hps">sus páginas</span></span>.</p>
+
+<h3 id="Reutilización_de_contenido_de_cache">Reutilización de contenido de cache</h3>
+
+<p><span id="result_box" lang="es"><span class="hps">Asegúrese de que cualquier</span> <span class="hps">contenido que se pueden</span> <span class="hps">almacenar en caché</span><span>,</span> <span class="hps">se almacena en caché</span><span>,</span> <span class="hps">y</span> <span class="hps">con</span> <span class="hps">fechas de caducidad</span> <span class="hps">correspondientes.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">En particular</span><span>,</span> <span class="hps">prestar atención a la</span> <span class="hps">cabecera</span></span> "<code>Last-Modified</code>". Permite el eficiente almacenamiento en cache de la página; <span id="result_box" lang="es"><span class="hps">por medio de</span> <span class="hps">esta cabecera</span><span>, la información</span> <span class="hps">se transmite al</span> <span class="hps">agente de usuario</span> <span class="hps">sobre el archivo</span> <span class="hps">que quiere</span> <span class="hps">cargar</span><span>,</span> <span class="hps">por ejemplo, </span></span><span id="result_box" lang="es"><span class="hps">como cuando</span> <span class="hps">fue</span> <span class="hps">modificada por última vez</span><span>.</span> <span class="hps">La mayoría de los</span> <span class="hps">servidores web</span> <span class="hps">añadirá automáticamente</span> <span class="hps">la</span> <span class="hps">cabecera Last-Modified</span> <span class="hps">para</span> <span class="hps">páginas estáticas</span> <span class="hps">(por ejemplo</span> <span class="hps">.html</span><span>,</span> <span class="hps">.css</span><span>)</span><span>,</span></span> <span id="result_box" lang="es"><span class="hps">basado en</span> <span class="hps">la</span> <span class="hps">fecha de última modificación</span> <span class="hps">almacenada en</span> <span class="hps">el sistema de archivos</span><span>.</span> <span class="hps">Con</span> <span class="hps">páginas dinámicas</span> <span class="hps">(por ejemplo,</span> <span class="hps">.php</span><span>,</span> <span class="hps">.aspx</span><span>)</span><span>,</span> <span class="hps">esto, por supuesto</span><span>,</span> <span class="hps">no se puede hacer</span><span>, y</span> <span class="hps">la cabecera</span> <span class="hps">no se envía</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span class="hps">Así</span><span>,</span> <span class="hps">en particular</span> <span class="hps">para las páginas</span> <span class="hps">que se generan</span> <span class="hps">de forma dinámica</span><span>,</span> <span class="hps">un poco de investigación</span> <span class="hps">sobre este tema es</span> <span class="hps">beneficioso.</span> <span class="hps">Puede ser</span> <span class="hps">un poco</span> <span class="hps">complicada, pero</span> <span class="hps">se ahorrará mucho</span> <span class="hps">en</span> <span class="hps">las solicitudes de página</span> <span class="hps">en las páginas</span> <span class="hps">que</span> <span class="hps">normalmente no serían</span> <span class="hps">cacheable</span><span>.</span></span></p>
diff --git a/files/es/learn/html/howto/index.html b/files/es/learn/html/howto/index.html
new file mode 100644
index 0000000000..4717432b11
--- /dev/null
+++ b/files/es/learn/html/howto/index.html
@@ -0,0 +1,142 @@
+---
+title: Solución de problemas comunes de HTML
+slug: Learn/HTML/Howto
+tags:
+  - CodificacióndeSecuenciadeComandos
+  - HTML
+translation_of: Learn/HTML/Howto
+original_slug: Learn/HTML/como
+---
+<p>{{LearnSidebar}}</p>
+
+<p class="summary">Los siguientes enlaces brindan soluciones puntuales a los problemas más comunes a los que te enfrentarás a diario en HTML.</p>
+
+<div class="column-container">
+<div class="column-half">
+<h3 id="Estructura_básica">Estructura básica</h3>
+
+<p>La principal aplicación de HTML es la estructuración del documento. Si eres nuevo en HTML debes empezar aquí.</p>
+
+<ul>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Getting_started#Anatomy_of_an_HTML_document">Cómo crear un documento HTML básico</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Divide_a_webpage_into_logical_sections">Cómo dividir una página web en secciones lógicas</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#The_basics_headings_and_paragraphs">Cómo establecer una estructura adecuada de encabezados y párrafos</a></li>
+</ul>
+
+<h3 id="Semántica_básica_textos">Semántica básica textos</h3>
+
+<p>HTML se especializa en suministrar información semántica del documento, así que HTML soluciona muchas dudas que puede tener sobre como transmitir su mensaje a través de un documento.</p>
+
+<ul>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Lists">Cómo crear una lista de elementos con HTML</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Cómo enfatizar o acentuar contenido</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Emphasis_and_importance">Cómo indicar qué texto es importante</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Representing_computer_code">Cómo muestra el ordenador el codigo HTML</a></li>
+ <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#Annotating_images_with_figures_and_figure_captions">Cómo comentar imagenes y gráficas</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Abbreviations">Cómo marcar abreviaturas y hacerlas entendibles</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting#Quotations">Cómo añadir citas y referencias a sitios web</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Define_terms_with_HTML">Cómo definir términos con HTML</a></li>
+</ul>
+</div>
+
+<div class="column-half">
+<h3 id="Hipervínculos">Hipervínculos</h3>
+
+<p>Uno de las principales razones por las que HTML hace más fácil la navegación son los {{Glossary("hyperlink", "hipervínculos")}}, que pueden ser usados de diferentes formas:</p>
+
+<ul>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo crear un hipervínculo</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo crear una tabla de contenidos con HTML</a></li>
+</ul>
+
+<h3 id="Imágenes_y_multimedia">Imágenes y multimedia</h3>
+
+<ul>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo</a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Images_in_HTML#How_do_we_put_an_image_on_a_webpage"> añadir imagenes al sitio web</a></li>
+ <li><a href="/en-US/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks#Active_learning_creating_a_navigation_menu">Cómo</a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content"> añadir contenidos de video al sitio web</a></li>
+</ul>
+
+<h3 id="Scripts_y_estilización">Scripts y estilización</h3>
+
+<p>HTML únicamente define la estructura del documento. Para solucionar los problemas de presentación usamos {{glossary("CSS")}}, o usamos scripts para hacer la página interactiva.</p>
+
+<ul>
+ <li><a href="/en-US/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_to_apply_your_CSS_to_your_HTML">Cómo usar CSS dentro de un sitio web</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Use_JavaScript_within_a_webpage">Cómo usar JavaScript dentro de un sitio web</a></li>
+</ul>
+
+<h3 id="Contenido_integrado">Contenido integrado</h3>
+
+<ul>
+ <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies">Cómo integrar una página web dentro de otra</a></li>
+ <li><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements">Cómo integrar contenido Flash </a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies">dentro de </a><a href="/en-US/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies#The_%3Cembed%3E_and_%3Cobject%3E_elements">una página web</a></li>
+</ul>
+</div>
+</div>
+
+<h2 id="Problemas_avanzados_o_raros">Problemas avanzados o raros</h2>
+
+<p>Más allá de lo basico, HTML es muy rico y ofrece características avanzadas para solucionar problemas complejos. Estos artículos te ayudarán a abordar estos casos menos comunes:</p>
+
+<div class="column-container">
+<div class="column-half">
+<h3 id="Formularios">Formularios</h3>
+
+<p>Los formularios son una estructura compleja en HTML para enviar datos desde una pagina web al servidor. Te animamos a que revises la <a href="/en-US/docs/Web/Guide/HTML/Forms">guia completa</a>. Aquí es por donde deberías empezar:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form">Cómo crear un formulario Web simple</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Forms/How_to_structure_an_HTML_form">Cómo estructurar un formulario Web</a></li>
+</ul>
+
+<h3 id="Información_tabular">Información tabular</h3>
+
+<p>Alguna información, llamada datos tabulares, necesita ser organizada en tablas mediante filas y columnas. Siendo ésta una de las estructuras más complejas de HTML, no es fácil dominarla:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Create_a_data_spreadsheet">Cómo crear una tabla de datos</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Make_HTML_tables_accessible">Cómo hacer tablas HTML accesibles</a></li>
+</ul>
+
+<h3 id="Representación_de_datos">Representación de datos</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTMLHowto/Represent_numeric_values_with_HTML">Cómo representar valores numericos y de código con HTML -</a> <span class="tlid-translation translation" lang="es"><span title="">ver </span></span> <span class="tlid-translation translation" lang="es"><span title="">Superíndice y Subíndice, y Representación del código de la computadora.</span></span></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Associate_human_readable_content_with_arbitrary_computer_data_structures">Cómo usar atributos de datos</a></li>
+</ul>
+
+<h3 id="Rendimiento">Rendimiento</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Create_collapsible_content_with_HTML">Cómo crear páginas HTML de carga rápida</a></li>
+</ul>
+</div>
+
+<div class="column-half">
+<h3 id="Semántica_avanzada_de_texto">Semántica avanzada de texto</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Take_control_of_HTML_line_breaking">Cómo controlar el salto de línea en HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Mark_text_insertion_and_deletion">Cómo marcar cambios (agregar y remover textos)</a> -ver los elementos {{htmlelement("ins")}} y {{htmlelement("del")}}</li>
+</ul>
+
+<h3 id="Imágenes_y_multimedia_avanzada">Imágenes y multimedia avanzada</h3>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images">Cómo agregar una imagen receptiva a una página web</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Adding_vector_graphics_to_the_Web">Cómo agregar una imagen vectorial a una página web</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Add_a_hit_map_on_top_of_an_image">Cómo agregar un mapa de visitas sobre una imagen</a></li>
+</ul>
+
+<h3 id="Internacionalización">Internacionalización</h3>
+
+<p>HTML no es monolingüe. Éste <span class="tlid-translation translation" lang="es"><span title="">proporciona herramientas para manejar problemas comunes de internacionalización.</span></span></p>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Add_multiple_languages_into_a_single_webpage">Cómo agregar multiples lenguajes en una misma página web</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Display_time_and_date_with_HTML">Cómo mostrar hora y fecha con HTML </a></li>
+</ul>
+</div>
+</div>
+
+<p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span> </p>
diff --git a/files/es/learn/html/howto/use_data_attributes/index.html b/files/es/learn/html/howto/use_data_attributes/index.html
new file mode 100644
index 0000000000..711d56f256
--- /dev/null
+++ b/files/es/learn/html/howto/use_data_attributes/index.html
@@ -0,0 +1,76 @@
+---
+title: Uso de atributos de datos
+slug: Learn/HTML/Howto/Use_data_attributes
+translation_of: Learn/HTML/Howto/Use_data_attributes
+original_slug: Learn/HTML/como/Usando_atributos_de_datos
+---
+<div>{{LearnSidebar}}</div>
+
+<p><a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> está diseñado de forma tal que sea fácil extender los datos asociados a un elemento en particular sin necesidad de que tengan un significado definido. Los atributos <a href="/en-US/docs/Web/HTML/Global_attributes#attr-dataset"><code>data-* </code></a> permiten almacenar información adicional sobre un elemento HTML cualquiera sin tener que recurrir a artilugios tales como la utilización de atributos no estándar, propiedades adicionales en el DOM o {{domxref("Node.setUserData()")}}.</p>
+
+<h2 id="Sintaxis_HTML">Sintaxis HTML</h2>
+
+<p>La sintáxis es simple. Un atributo cualquiera cuyo nombre comience con <code>data-</code>es un atributo de datos. Supongamos que tenemos un artículo y deseamos almacenar información adicional que no tiene ninguna representación visual. En ese caso, alcanza con que hagamos uso de los atributos <code>data</code>:</p>
+
+<pre class="brush: html notranslate">&lt;article
+  id="electriccars"
+  data-columns="3"
+  data-index-number="12314"
+  data-parent="cars"&gt;
+...
+&lt;/article&gt;</pre>
+
+<h2 id="Acceso_a_través_de_JavaScript">Acceso a través de JavaScript</h2>
+
+<p>Leer los valores de estos atributos en <a href="/en-US/docs/Web/JavaScript">JavaScript</a> también es muy sencillo. Puede usar {{domxref("Element.getAttribute", "getAttribute()")}} con su nombre HTML completo para leerlos, pero el estándar define una forma más simple: un {{domxref("DOMStringMap")}} puede leer a través de una propiedad {{domxref("HTMLElement.dataset", "dataset")}}.</p>
+
+<p>Para obtener un atributo <code>data</code> a través del <code>dataset</code> del objeto, obtenga la propiedad por la parte del nombre del atributo despues de <code>data-</code> (tenga en cuenta que los guiones son convertidos en camelCase).</p>
+
+<pre class="brush: js notranslate">var article = document.getElementById('electriccars');
+
+article.dataset.columns // "3"
+article.dataset.indexNumber // "12314"
+article.dataset.parent // "cars"</pre>
+
+<p>Cada propiedad es una cadena y se puede leer y escribir. En el caso anterior, establecer <code>article.dataset.columns = 5</code> cambiaría ese atributo a <code>"5"</code>.</p>
+
+<h2 id="Acceso_a_través_de_CSS">Acceso a través de CSS</h2>
+
+<p>Tenga en cuenta que, debido a que los atributos de datos son atributos simples de HTML, incluso puede acceder a ellos desde <a href="/en-US/docs/Web/CSS">CSS</a>. Por ejemplo, para mostrar los <code>data-parent</code> en el artículo, puede usar el <a href="/en-US/docs/Web/CSS/content">contenido generado</a> en CSS con la función {{cssxref("attr")}}:</p>
+
+<pre class="brush: css notranslate">article::before {
+  content: attr(data-parent);
+}</pre>
+
+<p>También puede usar los <a href="/en-US/docs/Web/CSS/Attribute_selectors">selectores de atributos</a> en CSS para cambiar los estilos de acuerdo a las priopiedades de datos:</p>
+
+<pre class="brush: css notranslate">article[data-columns='3'] {
+  width: 400px;
+}
+article[data-columns='4'] {
+  width: 600px;
+}</pre>
+
+<p>Puede ver todo esto trabajando junto <a href="http://jsbin.com/ujiday/2/edit">en este ejemplo de JSBin</a>.</p>
+
+<p>Los atributos de datos también se pueden almacenar para que contengan información que cambia constantemente, como los puntajes en un juego. Usando los selectores de CSS y el acceso a JavaScript aquí, esto le permite crear algunos efectos ingeniosos sin tener que escribir sus propias rutinas de visualización. Consulte <a href="http://www.youtube.com/watch?v=On_WyUB1gOk">este screencast</a> para ver un ejemplo utilizando contenido generado y transacciones CSS (<a href="http://jsbin.com/atawaz/3/edit">Ejemplo JSBin</a>).</p>
+
+<p>Los valores de datos son cadenas de caracteres. Los valores numéricos deben ser citados en el selector para que el estilo surta efecto.</p>
+
+<h2 id="Problemas">Problemas</h2>
+
+<p>No almacene el contenido que debería ser visible y accesible en los atributos de datos, ya que las tecnologías de asistencia, no pueden acceder a ellos. Ademas, los rastreadores de búsqueda no pueden indexar los valores de los atributos de datos.</p>
+
+<p>Los principales problemas a considerar son el soporte y rendimiento en Internet Explorer. Internet Explorer 11 y superiores, proporcionan soporte para el estándar, pero todas las versiones anteriores <a href="http://caniuse.com/#feat=dataset">no son compatibles con <code>dataset</code></a>. Para admitir IE 10 e inferiores, debe acceder a los atributos de datos con {{domxref("Element.getAttribute", "getAttribute()")}} en su lugar. Ademas, el <a href="http://jsperf.com/data-dataset">rendimiento de lectura de los atributos de datos</a> en comparación con el almacenamiento de estos datos en un objeto JS normal es deficiente.</p>
+
+<p>Dicho esto, sin embargo, para metadatos asociados a elementos personalizados, son una gran solución.</p>
+
+<p>En Firefox 49.0.2 (y quizás versiones anteriores), los atributos de datos que exceden los 1022 caracteres no serán leídos por Javascript (EcmaScript 4).</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Este artículo es una adaptación de <a href="https://hacks.mozilla.org/2012/10/using-data-attributes-in-javascript-and-css/" title="https://hacks.mozilla.org/2012/10/using-data-attributes-in-javascript-and-css/">Usando atributos de datos en JavaScript y CSS en hacks.mozilla.org</a>.</li>
+ <li>Los atributos personalizados también son compatibles en SVG 2; vea {{domxref("SVGElement.dataset")}} y {{SVGAttr("data-*")}} para más información.</li>
+ <li><a href="http://www.sitepoint.com/use-html5-data-attributes/">Cómo utilizar atributos de datos HTML5</a></li>
+</ul>
diff --git a/files/es/learn/html/introduccion_a_html/advanced_text_formatting/index.html b/files/es/learn/html/introduccion_a_html/advanced_text_formatting/index.html
deleted file mode 100644
index 7e96d3c6d7..0000000000
--- a/files/es/learn/html/introduccion_a_html/advanced_text_formatting/index.html
+++ /dev/null
@@ -1,695 +0,0 @@
----
-title: Formateo de texto avanzado
-slug: Learn/HTML/Introduccion_a_HTML/Advanced_text_formatting
-tags:
-  - CodingScripting
-  - Guía
-  - HTML
-  - Lista de descripción
-  - Novato
-  - Principiante
-  - Texto
-  - abreviatura
-  - aprende
-  - cita
-  - semántica
-translation_of: Learn/HTML/Introduction_to_HTML/Advanced_text_formatting
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">Hay muchos otros elementos en HTML para dar formato al texto, que no expusimos en el artículo {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}. Los elementos descritos en este artículo son menos conocidos, pero aún así es muy útil conocerlos (no obstante, no es una lista completa de ninguna manera). Aquí aprenderás cómo marcar citas, listas de descripción, código de computadora y otro texto relacionado, subíndices y superíndices, información de contacto y mucho más.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Estar familiarizado con HTML, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}. Aplicación de formato a texto en documentos HTML, según lo expuesto en la sección {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender a utilizar elementos HTML menos conocidos para marcar características semánticas avanzadas.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Listas_de_descripciones">Listas de descripciones</h2>
-
-<p>En los fundamentos del texto HTML, explicamos cómo {{web.link("/es/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Lists", "marcar listas básicas")}} en HTML, pero no mencionamos el tercer tipo de lista con la que te encontrarás ocasionalmente: <strong>listas de descripción</strong>. El propósito de estas listas es marcar un conjunto de elementos y sus descripciones asociadas, como términos y definiciones, o preguntas y respuestas. Veamos un ejemplo de un conjunto de términos y definiciones:</p>
-
-<pre class="brush: bash notranslate">soliloquio
-En las obras dramáticas, corresponde a cuando un personaje se habla a sí mismo para representar sus pensamientos o sentimientos internos y, en el proceso, transmitirlos a la audiencia (pero no a otros personajes).
-monólogo
-En las obras dramáticas, corresponde a cuando un personaje habla de sus pensamientos en voz alta para compartirlos con el público y cualquier otro personaje presente.
-aparte
-En las obras dramáticas, corresponde a cuando un personaje comparte un comentario solo con la audiencia para dar efecto cómico o dramático. Suele ser un sentimiento, un pensamiento o información adicional.</pre>
-
-<p>Las listas de descripción utilizan un contenedor diferente al de los otros tipos de listas — {{HTMLElement("dl")}} («<em><b>d</b>escription <b>l</b>ist</em>» o lista de descripciones); además, cada término está envuelto en un elemento {{HTMLElement("dt")}} («<em><b>d</b>escription <b>t</b>erm</em>» o término a describir), y cada descripción está envuelta en un elemento {{HTMLElement("dd")}} («<em><b>d</b>escription <b>d</b>efinition</em>» o definición de descripción). Para redondear esta información veamos un ejemplo:</p>
-
-<div id="listas-de-descripciones-ejemplo-activo-1">
-<pre class="brush: html notranslate">&lt;dl&gt;
-  &lt;dt&gt;soliloquio&lt;/dt&gt;
-  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje se habla a sí mismo para representar sus pensamientos o sentimientos internos y, en el proceso, transmitirlos a la audiencia (pero no a otros personajes).&lt;/dd&gt;
-  &lt;dt&gt;monólogo&lt;/dt&gt;
-  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje habla de sus pensamientos en voz alta para compartirlos con el público y cualquier otro personaje presente.&lt;/dd&gt;
-  &lt;dt&gt;aparte&lt;/dt&gt;
-  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje comparte un comentario solo con la audiencia para dar efecto cómico o dramático. Suele ser un sentimiento, un pensamiento o información adicional.&lt;/dd&gt;
-&lt;/dl&gt;</pre>
-</div>
-
-<p>Los estilos predeterminados del navegador mostrarán listas de descripciones con las descripciones sangradas un poco más que los términos.</p>
-
-<p>{{ EmbedLiveSample('listas-de-descripciones-ejemplo-activo-1', '100%', '285px', '', '', 'hide-codepen-jsfiddle') }}</p>
-
-<p>Ten en cuenta que un solo término puede tener múltiples descripciones, por ejemplo:</p>
-
-<div id="listas-de-descripciones-ejemplo-activo-2">
-<pre class="brush: html notranslate">&lt;dl&gt;
-  &lt;dt&gt;aparte&lt;/dt&gt;
-  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje comparte un comentario solo con la audiencia para dar efecto cómico o dramático. Suele ser un sentimiento, un pensamiento o información adicional.&lt;/dd&gt;
-  &lt;dd&gt;Si la obra es impresa, es una sección de contenido que se relaciona con el tema, pero no encaja directamente en el flujo principal de contenido, de modo que se presenta por separado (a menudo en una caja de texto en el margen).&lt;/dd&gt;
-&lt;/dl&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('listas-de-descripciones-ejemplo-activo-2', '100%', '193px', '', '', 'hide-codepen-jsfiddle') }}</p>
-
-<h3 id="Aprendizaje_activo_Marcar_un_conjunto_de_definiciones">Aprendizaje activo: Marcar un conjunto de definiciones</h3>
-
-<p>Es hora de practicar las listas de descripciones; agrega elementos al texto sin formato en el campo <em>Código editable</em> para que aparezca como una lista de descripción en el campo <em>Salida en vivo</em>. Puedes usar tus propios términos y descripciones si lo deseas.</p>
-
-<p>Si cometes un error, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente encallado, pulsa el botón <em>Mostrar solución</em> para ver una buena propuesta.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 100px; width: 95%"&gt;
-Tocino
-El pegamento que une al mundo.
-Huevos
-El pegamento que une el pastel.
-Café
-La bebida que hace que el mundo funcione por la mañana.
-Un color marrón claro.&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">const textarea = document.getElementById('code');
-const reset = document.getElementById('reset');
-const solution = document.getElementById('solution');
-const output = document.querySelector('.output');
-const code = textarea.value;
-const userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-const htmlSolution = '&lt;dl&gt;\n &lt;dt&gt;Tocino&lt;/dt&gt;\n &lt;dd&gt;El pegamento que une al mundo.&lt;/dd&gt;\n &lt;dt&gt;Huevos&lt;/dt&gt;\n &lt;dd&gt;El pegamento que une el pastel.&lt;/dd&gt;\n &lt;dt&gt;Café&lt;/dt&gt;\n &lt;dd&gt;La bebida que hace que el mundo funcione por la mañana.&lt;/dd&gt;\n &lt;dd&gt;Un color marrón claro.&lt;/dd&gt;\n&lt;/dl&gt;';
-const solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  const scrollPos = textarea.scrollTop;
-  const caretPos = textarea.selectionStart;
-
-  const front = (textarea.value).substring(0, caretPos);
-  const back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible', 700, 350, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h2 id="Citas">Citas</h2>
-
-<p>HTML también dispone de elementos para el marcado de citas; cual elemento utilices depende de si estás marcando la cita como un bloque o como un elemento en línea.</p>
-
-<h3 id="Cita_en_bloque_independiente_blockquote">Cita en bloque independiente (<em>blockquote</em>)</h3>
-
-<p>Si una sección de contenido a nivel de bloque (ya sea un párrafo, varios párrafos, una lista, etc.) se cita en otro lugar, debes envolverla dentro de un elemento {{HTMLElement("blockquote")}} para indicarlo, e incluye una URL que apunte a la fuente de la cita dentro de un atributo {{HTMLAttrxRef("cite", "blockquote")}}. Por ejemplo, el siguiente marcado tomado de la página del elemento <code>&lt;blockquote&gt;</code> de MDN:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;El &lt;strong&gt;elemento HTML &lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/strong&gt; (o &lt;em&gt;elemento HTML de cita
-en bloque independiente&lt;/em&gt;) indica que el texto al que delimita es una cita ampliada.&lt;/p&gt;</pre>
-
-<p>Para convertir esto en una cita en bloque independiente, simplemente harías lo siguiente:</p>
-
-<div id="blockquote-ejemplo-en-vivo">
-<pre class="brush: html notranslate">&lt;p&gt;A continuación se muestra una cita en bloque independiente...&lt;/p&gt;
-&lt;blockquote cite="https://developer.mozilla.org/es/docs/Web/HTML/Element/blockquote"&gt;
-  &lt;p&gt;El &lt;strong&gt;elemento HTML &lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/strong&gt; (o &lt;em&gt;elemento HTML de cita
-  en bloque independiente&lt;/em&gt;) indica que el texto al que delimita es una cita ampliada.&lt;/p&gt;
-&lt;/blockquote&gt;</pre>
-</div>
-
-<p>El estilo predeterminado del navegador lo mostrará como un párrafo con sangría, para indicar que se trata de una cita; el párrafo anterior a la cita sirve para demostrarlo.</p>
-
-<p>{{EmbedLiveSample('blockquote-ejemplo-en-vivo', '100%', '117px', '', '', 'hide-codepen-jsfiddle')}}</p>
-
-<h3 id="Citas_en_línea">Citas en línea</h3>
-
-<p>Las citas en línea funcionan exactamente de la misma manera, excepto que usan el elemento {{HTMLElement("q")}}. Por ejemplo, el siguiente fragmento de marcado contiene una cita <code>&lt;q&gt;</code> de la página MDN:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;El elemento de cita — &lt;code&gt;&amp;lt;q&amp;gt;&lt;/code&gt; — se &lt;q cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q"&gt;utiliza en
-para citas breves que no requieren saltos de párrafo.&lt;/q&gt;&lt;/p&gt;</pre>
-
-<p>El estilo predeterminado del navegador lo representará como texto normal entre comillas para indicar una cita, así:</p>
-
-<p>{{ EmbedLiveSample('Citas_en_línea', '100%', '78px', '', '', 'hide-codepen-jsfiddle')}}</p>
-
-<h3 id="Citas_2">Citas</h3>
-
-<p>El contenido del atributo {{HTMLAttrxRef("cite", "blockquote")}} suena útil, pero desafortunadamente los navegadores, lectores de pantalla, etc. no hacen mucho con él. No hay forma de hacer que el navegador muestre el contenido de <code>cite</code> sin escribir tu propia solución usando JavaScript o CSS. Si deseas que la fuente de la cita esté disponible en la página, lo debes hacer en el texto a través de un enlace o de alguna otra forma apropiada.</p>
-
-<p>Hay un elemento {{HTMLElement("cite")}}, pero está destinado a contener el título del recurso que se cita, p. ej. el nombre del libro. Sin embargo, no hay razón por la que no puedas vincular el texto dentro de <code>&lt;cite&gt;</code> a la fuente de la cita de alguna manera:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;De acuerdo con &lt;a href="https://developer.mozilla.org/es/docs/Web/HTML/Element/blockquote"&gt;
-&lt;cite&gt;página de citas en bloque independiente de MDN&lt;/cite&gt;&lt;/a&gt;:
-&lt;/p&gt;
-
-&lt;blockquote cite="https://developer.mozilla.org/es/docs/Web/HTML/Element/blockquote"&gt;
-  &lt;p&gt;El &lt;strong&gt;elemento HTML &lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/strong&gt; (o &lt;em&gt;elemento HTML de cita
-  en bloque independiente&lt;/em&gt;) indica que el texto al que delimita es una cita ampliada.&lt;/p&gt;
-&lt;/blockquote&gt;
-
-&lt;p&gt;El elemento de cita — &lt;code&gt;&amp;lt;q&amp;gt;&lt;/code&gt; — se &lt;q cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q"&gt;utiliza en
-citas breves que no requieren saltos de párrafo.&lt;/q&gt; -- &lt;a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q"&gt;
-&lt;cite&gt;página q de MDN&lt;/cite&gt;&lt;/a&gt;.&lt;/p&gt;</pre>
-
-<p>Las citas se escriben en cursiva de forma predeterminada.</p>
-
-<p>{{ EmbedLiveSample('Citas_2', '100%', '179px', '', '', 'hide-codepen-jsfiddle') }}</p>
-
-<h3 id="Aprendizaje_activo_¿Quién_dijo_eso">Aprendizaje activo: ¿Quién dijo eso?</h3>
-
-<p>¡Es hora de otro ejemplo de aprendizaje activo! En este ejemplo, nos gustaría que:</p>
-
-<ol>
- <li>Conviertas el párrafo del medio en una cita en bloque independiente, que incluya un atributo <code>cite</code>.</li>
- <li>Conviertas "La necesidad de eliminar el diálogo interno negativo" en el tercer párrafo en una cita en línea e incluya un atributo <code>cite</code>.</li>
- <li>Envuelvas el título de cada fuente en etiquetas <code>&lt;cite&gt;</code> y conviertas cada una en un enlace a esa fuente.</li>
-</ol>
-
-<p>Las fuentes de citación que necesitas son:</p>
-
-<ul>
- <li>http://www.brainyquote.com/quotes/authors/c/confucius.html para la citas de Confucio</li>
- <li>http://www.affirmationsforpositivethinking.com para "La necesidad de eliminar el diálogo interno negativo".</li>
-</ul>
-
-<p>Si cometes un error, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente encallado, pulsa el botón <em>Mostrar solución</em> para ver una buena propuesta.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_2">Código reproducible 2</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 150px; width: 95%"&gt;
-&lt;p&gt;Hola y bienvenido a mi página de motivación. Como dice el sitio de citas de Confucio:&lt;/p&gt;
-&lt;p&gt;No importa qué tan lento vayas siempre que no te detengas.&lt;/p&gt;
-&lt;p&gt;También me encanta el concepto de pensamiento positivo y La necesidad de eliminar el diálogo interno negativo (como se menciona en Afirmaciones para el pensamiento positivo).&lt;/p&gt;
-&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">const textarea = document.getElementById('code');
-const reset = document.getElementById('reset');
-const solution = document.getElementById('solution');
-const output = document.querySelector('.output');
-const code = textarea.value;
-const userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-const htmlSolution = '&lt;p&gt;Hola y bienvenido a mi página de motivación. Como dice &lt;a href="http://www.brainyquote.com/quotes/authors/c/confucius.html"&gt;&lt;cite&gt;el sitio de citas de Confucio:&lt;/cite&gt;&lt;/a&gt;:&lt;/p&gt;\n\n&lt;blockquote cite="http://www.brainyquote.com/quotes/authors/c/confucius.html"&gt;\n&lt;p&gt;No importa qué tan lento vayas siempre que no te detengas.&lt;/p&gt;\n&lt;/blockquote&gt;\n\n&lt;p&gt;También me encanta el concepto de pensamiento positivo y &lt;q cite="http://www.affirmationsforpositivethinking.com"&gt;La necesidad de eliminar el diálogo interno negativo&lt;/q&gt; (como se menciona en &lt;a href="http://www.affirmationsforpositivethinking.com"&gt;&lt;cite&gt;Afirmaciones para el pensamiento positivo&lt;/cite&gt;&lt;/a&gt;).&lt;/p&gt;';
-const solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  const scrollPos = textarea.scrollTop;
-  const caretPos = textarea.selectionStart;
-
-  const front = (textarea.value).substring(0, caretPos);
-  const back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_2', 700, 450, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h2 id="Abreviaturas">Abreviaturas</h2>
-
-<p>Otro elemento bastante común que encontrarás cuando busques en la Web es {{HTMLElement("abbr")}} — se usa para envolver una abreviatura o acrónimo, y proporcionar una expansión completa del término (incluida dentro de un atributo {{HTMLAttrxRef("title")}}. Veamos un par de ejemplos:</p>
-
-<div id="ejemplo-de-abreviaturas-en-vivo">
-<pre class="brush: html notranslate">&lt;p&gt;Usamos &lt;abbr title="Lenguaje de marcado de hipertexto"&gt;HTML&lt;/abbr&gt; para estructurar nuestros documentos web.&lt;/p&gt;
-
-&lt;p&gt;Creo que el &lt;abbr title="Reverendo""&gt;Rev.&lt;/abbr&gt; Green lo hizo en la cocina con la motosierra.&lt;/p&gt;</pre>
-</div>
-
-<p>Estos saldrán con un aspecto similar a este (la expansión aparecerá en una descripción emergente cuando se coloque el cursor sobre el término):</p>
-
-<p>{{EmbedLiveSample('ejemplo-de-abreviaturas-en-vivo', '100%', '94px', '', '', 'hide-codepen-jsfiddle')}}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Hay otro elemento, {{HTMLElement("acronym")}}, que básicamente hace lo mismo que <code>&lt;abbr&gt;</code>, y se diseñó específicamente para acrónimos en lugar de las abreviaturas. Sin embargo, este ha caído en desuso — no era compatible con los navegadores ni con <code>&lt;abbr&gt;</code>, y <code>&lt;abbr&gt;</code> tiene una función tan similar que se consideró inútil conservar ambos. Solo utiliza <code>&lt;abbr&gt;</code>.</p>
-</div>
-
-<h3 id="Aprendizaje_activo_Marcar_una_abreviatura">Aprendizaje activo: Marcar una abreviatura</h3>
-
-<p>Para esta simple tarea de aprendizaje activo, nos gustaría que simplemente marcaras una abreviatura. Puedes usar el ejemplo que encontrarás a continuación o reemplazarla por una de tu elección. </p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_3">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 50px; width: 95%"&gt;
-&lt;p&gt;La NASA sin duda hace un interesante trabajo.&lt;/p&gt;
-&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">const textarea = document.getElementById('code');
-const reset = document.getElementById('reset');
-const solution = document.getElementById('solution');
-const output = document.querySelector('.output');
-const code = textarea.value;
-const userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-const htmlSolution = '&lt;p&gt;La &lt;abbr title="Administración Nacional de Aeronáutica y del Espacio"&gt;NASA&lt;/abbr&gt; sin duda hace un interesante trabajo.&lt;/p&gt;';
-const solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  const scrollPos = textarea.scrollTop;
-  const caretPos = textarea.selectionStart;
-
-  const front = (textarea.value).substring(0, caretPos);
-  const back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_3', 700, 300, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h2 id="Marcar_la_información_de_contacto">Marcar la información de contacto</h2>
-
-<p>HTML tiene un elemento para marcar la información de contacto — {{HTMLElement("address")}}. Este simplemente envuelve tus datos de contacto, por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;address&gt;
-  &lt;p&gt;Chris Mills, Manchester, The Grim North, Reino Unido&lt;/p&gt;
-&lt;/address&gt;</pre>
-
-<p>También podrías incluir un marcado más complejo y otras formas de información de contacto, por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;address&gt;
-  &lt;p&gt;
-    Chris Mills&lt;br&gt;
-    Manchester&lt;br&gt;
-    The Grim North&lt;br&gt;
-    Reino Unido
-  &lt;/p&gt;
-
-  &lt;ul&gt;
-    &lt;li&gt;Tel: 01234 567 890&lt;/li&gt;
-    &lt;li&gt;Email: me@grim-north.co.uk&lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/address&gt;</pre>
-
-<p>Ten en cuenta que algo como esto también estaría bien, si la página vinculada contuviera la información de contacto:</p>
-
-<pre class="brush: html notranslate">&lt;address&gt;
-  &lt;p&gt;Página escrita por &lt;a href="../authors/chris-mills/"&gt;Chris Mills&lt;/a&gt;.&lt;/p&gt;
-&lt;/address&gt;</pre>
-
-<h2 id="Superíndice_y_subíndice">Superíndice y subíndice</h2>
-
-<p>En ocasiones, necesitarás utilizar superíndice y subíndice al marcar elementos como fechas, fórmulas químicas y ecuaciones matemáticas para que tengan el significado correcto. Los elementos {{HTMLElement("sup")}} y {{HTMLElement("sub")}} se ocupan de ello. Por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Nací el 25&lt;sup&gt;th&lt;/sup&gt; de mayo de 2001.&lt;/p&gt;
-&lt;p&gt;La fórmula química de la cafeína es C&lt;sub&gt;8&lt;/sub&gt;H&lt;sub&gt;10&lt;/sub&gt;N&lt;sub&gt;4&lt;/sub&gt;O&lt;sub&gt;2&lt;/sub&gt;.&lt;/p&gt;
-&lt;p&gt;If x&lt;sup&gt;2&lt;/sup&gt; es 9, x debe ser igual 3 o -3.&lt;/p&gt;</pre>
-
-<p>La salida de este código se ve así:</p>
-
-<p>{{ EmbedLiveSample('Superíndice_y_subíndice', '100%', '141px', '', '', 'hide-codepen-jsfiddle') }}</p>
-
-<h2 id="Representación_del_código_informático">Representación del código informático</h2>
-
-<p>Hay una serie de elementos disponibles para marcar código informático usando HTML:</p>
-
-<ul>
- <li>{{HTMLElement("code")}}: Para marcar fragmentos genéricos de código informático.</li>
- <li>{{HTMLElement("pre")}}: Para respetar los espacios en blanco (en general, en los bloques de código) — si utilizas la sangría o diversos espacios en blanco consecutivos dentro de un texto, los navegadores los ignorarán y no se mostrarán en la página. Sin embargo, si delimitas el texto con las etiquetas <code>&lt;pre&gt;&lt;/pre&gt;</code>, los espacios en blanco se representarán de forma idéntica a como se ven en tu editor de texto.</li>
- <li>{{HTMLElement("var")}}: Para marcar específicamente nombres de variables.</li>
- <li>{{HTMLElement("kbd")}}: Para marcar entradas de teclado (y de otro tipo) en el ordenador.</li>
- <li>{{HTMLElement("samp")}}: Para marcar la salida de un programa de ordenador.</li>
-</ul>
-
-<p>Veamos algunos ejemplos. Deberías intentar jugar con estos (intenta obtener una copia de nuestro archivo de ejemplo <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/advanced-text-formatting/other-semantics.html">other-semantics.html</a>):</p>
-
-<pre class="brush: html notranslate">&lt;pre&gt;&lt;code&gt;var para = document.querySelector('p');
-
-para.onclick = function() {
-  alert('¡Guau!, ¡deja de apretar!');
-}&lt;/code&gt;&lt;/pre&gt;
-
-&lt;p&gt;No debes utilizar elementos de presentación como &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; y &lt;code&gt;&amp;lt;center&amp;gt;&lt;/code&gt;.&lt;/p&gt;
-
-&lt;p&gt;En el ejemplo de JavaScript anterior, &lt;var&gt;para&lt;/var&gt; representa un elemento de párrafo.&lt;/p&gt;
-
-
-&lt;p&gt;Selecciona todo el texto con &lt;kbd&gt;Ctrl&lt;/kbd&gt;/&lt;kbd&gt;Cmd&lt;/kbd&gt; + &lt;kbd&gt;A&lt;/kbd&gt;.&lt;/p&gt;
-
-&lt;pre&gt;$ &lt;kbd&gt;ping mozilla.org&lt;/kbd&gt;
-&lt;samp&gt;PING mozilla.org (63.245.215.20): 56 bytes de datos
-64 bytes de 63.245.215.20: icmp_seq=0 ttl=40 time=158.233 ms&lt;/samp&gt;&lt;/pre&gt;</pre>
-
-<p>El código anterior se verá así:</p>
-
-<p>{{ EmbedLiveSample('Representación_del_código_informático','100%',300, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h2 id="Marcar_horas_y_fechas">Marcar horas y fechas</h2>
-
-<p>HTML también proporciona el elemento {{HTMLElement("time")}} para marcar horas y fechas en un formato legible por la máquina. Por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;time datetime="2016-01-20"&gt;20 Enero 2016&lt;/time&gt;
-</pre>
-
-<p>¿Por qué es útil esto? Bueno, hay muchas formas diferentes en que los humanos escriben las fechas. La fecha anterior se podría escribir como:</p>
-
-<ul>
- <li>20 Enero 2016</li>
- <li>20th January 2016</li>
- <li>Ene 20 2016</li>
- <li>20/01/16</li>
- <li>01/20/16</li>
- <li>El 20 del mes que viene</li>
- <li><span lang="fr">20e Janvier 2016</span></li>
- <li><span lang="ja">2016年1月20日</span></li>
- <li>... y así sucesivamente ...</li>
-</ul>
-
-<p>Pero estas diferentes formas no las pueden reconocer fácilmente las computadoras — ¿qué pasaría si quisieras tomar automáticamente las fechas de todos los eventos en una página e insertarlas en un calendario? El elemento {{HTMLElement("time")}} te permite adjuntar una fecha/hora inequívoca y legible por la máquina para este propósito.</p>
-
-<p>El ejemplo básico anterior solo proporciona una fecha simple legible por la máquina, pero hay muchas otras opciones que son posibles, por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;!-- Fecha simple estándar --&gt;
-&lt;time datetime="2016-01-20"&gt;20 Enero 2016&lt;/time&gt;
-&lt;!-- Solo año y mes --&gt;
-&lt;time datetime="2016-01"&gt;Enero 2016&lt;/time&gt;
-&lt;!-- Solo mes y día --&gt;
-&lt;time datetime="01-20"&gt;20 Enero 2016&lt;/time&gt;
-&lt;!-- Solo tiempo, horas y minutos --&gt;
-&lt;time datetime="19:30"&gt;19:30&lt;/time&gt;
-&lt;!-- ¡También puedes hacer segundos y milisegundos! --&gt;
-&lt;time datetime="19:30:01.856"&gt;19:30:01.856&lt;/time&gt;
-&lt;!-- Fecha y hora --&gt;
-&lt;time datetime="2016-01-20T19:30"&gt;7.30pm, 20 Enero 2016&lt;/time&gt;
-&lt;!-- Fecha y hora con desplazamiento de zona horaria --&gt;
-&lt;time datetime="2016-01-20T19:30+01:00"&gt;7.30pm, 20 Enero 2016 es 8.30pm en Francia&lt;/time&gt;
-&lt;!-- Llamar a un número de semana específico --&gt;
-&lt;time datetime="2016-W04"&gt;La cuarta semana de 2016&lt;/time&gt;
-</pre>
-
-<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
-
-<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Puedes encontrar más pruebas para verificar que has retenido esta información antes de continuar; consulta {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_Advanced_HTML_text", "Pon a prueba tus habilidades: Texto HTML avanzado")}}.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Esto marca el final de nuestro estudio de la semántica del texto HTML. Ten en cuenta que lo que has visto durante este curso no es una lista exhaustiva de elementos de texto HTML — quisimos tratar de cubrir los aspectos esenciales y algunos de los más comunes que verás en la naturaleza, o al menos podrían resultarte interesantes. Para encontrar muchos más elementos HTML, puedes echarle un vistazo a nuestra {{web.link("/es/docs/Web/HTML/Element", "referencia de elementos HTML")}} (la {{web.link("/es/docs/Web/HTML/Element#Inline_text_semantics", "La sección Semántica de texto en línea")}} sería un gran lugar para comenzar). En el próximo artículo veremos los elementos HTML que usarás para estructurar las diferentes partes de un documento HTML.</p>
-
-<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
-</ul>
diff --git a/files/es/learn/html/introduccion_a_html/creating_hyperlinks/index.html b/files/es/learn/html/introduccion_a_html/creating_hyperlinks/index.html
deleted file mode 100644
index 330bf0d7db..0000000000
--- a/files/es/learn/html/introduccion_a_html/creating_hyperlinks/index.html
+++ /dev/null
@@ -1,346 +0,0 @@
----
-title: Crear hipervínculos
-slug: Learn/HTML/Introduccion_a_HTML/Creating_hyperlinks
-tags:
-  - Aprender
-  - CodingScripting
-  - Guía
-  - HTML
-  - HTTP
-  - Novato
-  - Principiante
-  - Title
-  - URL
-  - enlace
-  - hiperenlaces
-  - hipervínculos
-  - href
-  - referencia absoluta
-  - referencia relativa
-  - título
-  - urls
-translation_of: Learn/HTML/Introduction_to_HTML/Creating_hyperlinks
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">Los hipervínculos (o enlaces) son elementos verdaderamente importantes — son los que hacen que la web sea <em><strong>web</strong></em>. Este artículo expone la sintaxis necesaria para crear un enlace, además contiene un catálogo de buenas prácticas para crearlos.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Estar familiarizado con HTML, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}. Aplicación de formato a texto en documentos HTML, según lo expuesto en la sección {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "fundamentos de texto HTML")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender a implementar un <em>hipervínculo</em> de forma efectiva y enlazar múltiples archivos.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_un_hipervínculo">¿Qué es un hipervínculo?</h2>
-
-<p>Los hipervínculos son una de las innovaciones más interesantes que ofrece la Web. Han formado parte de esta desde el principio, pero hacen que la web sea <em>web </em>: Los hipervínculos nos permiten vincular documentos a otros documentos o recursos, vincular a partes específicas de documentos o hacer que las aplicaciones estén disponibles en una dirección web. Prácticamente cualquier contenido web se puede convertir en un enlace que, al pulsarlo (activarlo), dirija el navegador a la dirección web a la que apunta el enlace ({{Glossary("URL")}}).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Una URL puede apuntar a archivos HTML, archivos de texto, imágenes, documentos de texto, archivos de audio o vídeo, y cualquier otra cosa que se pueda mostrar en la web. Si el navegador no sabe cómo manejar el archivo, te preguntará si lo quieres abrir (en cuyo caso la tarea de abrirlo y manejarlo se transferirá a la aplicación nativa instalada en el dispositivo) o si lo quieres descargar (en cuyo caso podrás ocuparte de él más tarde).</p>
-</div>
-
-<p>El sitio web de la BBC, por ejemplo, contiene una gran cantidad de enlaces que apuntan a multitud de noticias en diferentes zonas de el sitio (funcionalidad de navegación), zonas de acceso/registro (herramientas de usuario) y otras.</p>
-
-<p><img alt="Portada de bbc.co.uk, que muestra muchas noticias y la funcionalidad del menú de navegación" src="https://mdn.mozillademos.org/files/12405/bbc-homepage.png" style="display: block; margin: 0 auto;"></p>
-
-<h2 id="Anatomía_de_un_enlace">Anatomía de un enlace</h2>
-
-<p>Un enlace básico se crea incluyendo el texto (o cualquier otro contenido, ve {{anch("Convertir bloques de contenido en enlaces")}}), que queramos convertir en un enlace usando un elemento ancla {{HTMLElement("a")}}, dándole un atributo {{HTMLAttrxRef("href", "a")}} (también conocido como «<strong><em>Hypertext Reference</em></strong>», «<strong><em>target</em></strong>» u <strong>objetivo</strong>) que contendrá la dirección web hacia dónde queremos que apunte el enlace.</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Crea un enlace a
-&lt;a href="https://www.mozilla.org/es-ES/"&gt;la página de inicio de Mozilla&lt;/a&gt;.
-&lt;/p&gt;</pre>
-
-<p>Este código producirá el siguiente resultado:</p>
-
-<p>Crea un enlace a <a class="ignore-external" href="https://www.mozilla.org/es-ES/">la página de inicio de Mozilla</a>.</p>
-
-<h3 id="Añadir_información_de_asistencia_con_el_atributo_title">Añadir información de asistencia con el atributo <code>title</code></h3>
-
-<p>Otro atributo que posiblemente quieras agregar a tus enlaces es <code>title</code>. El título contiene información adicional sobre el enlace, como qué tipo de información contiene la página o cosas que debes tener en cuenta en el sitio web.</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Crea un enlace a
-&lt;a href="https://www.mozilla.org/es-ES/"
-   title="El mejor lugar para encontrar más información acerca de la misión de Mozilla
-          y cómo contribuir"&gt;la página de inicio de Mozilla&lt;/a&gt;.
-&lt;/p&gt;</pre>
-
-<p>Este código producirá el siguiente resultado (el título se mostrará al pasar el ratón sobre el texto del enlace):</p>
-
-<p>Crea un enlace a <a class="ignore-external" href="https://www.mozilla.org/es-ES/" title="El mejor lugar para encontrar más información sobre la misión de Mozilla y cómo contribuir">la página de inicio de Mozilla</a>.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El título de un enlace solo será visible al pasar el ratón por encima, lo cual significa que los usuarios que naveguen usando los controles de sus teclados, o pantallas táctiles, tendrán dificultades para acceder a la información proporcionada por el título. Si la información del título es verdaderamente importante para el uso de la página, deberemos presentar el título de manera que sea accesible a todos los usuarios, por ejemplo incluyéndola como parte del texto del enlace.</p>
-</div>
-
-<h3 id="Aprendizaje_activo_crea_tu_propio_ejemplo_de_enlace">Aprendizaje activo: crea tu propio ejemplo de enlace</h3>
-
-<p>Es momento del aprendizaje activo — crea un documento HTML con tu editor de código (nuestra <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">plantilla de aprendizaje</a> te hará la tarea más llevadera).</p>
-
-<ul>
- <li>En el cuerpo del HTML (<code>body</code>), añade uno o más párrafos o cualquier otro tipo de contenido de los que ya conoces.</li>
- <li>Convierte algún texto en enlaces.</li>
- <li>Incluye atributos de título (<code>title</code>).</li>
-</ul>
-
-<h3 id="Convertir_bloques_de_contenido_en_enlaces">Convertir bloques de contenido en enlaces</h3>
-
-<p>Como hemos mencionado anteriormente, puedes convertir cualquier contenido en un enlace, incluso {{web.link("/es/docs/Learn/HTML/Getting_started#Elementos_de_bloque_y_elementos_en_línea", "Elementos de bloque y elementos en línea")}}. Si quieres convertir una imagen en un enlace, simplemente usa el elemento {{HTMLElement("a")}} encerrando el elemento {{HTMLElement("img")}} entre <code>&lt;a&gt;</code> y <code>&lt;/a&gt;</code>.</p>
-
-<pre class="brush: html notranslate">&lt;a href="https://www.mozilla.org/es-ES/"&gt;
-  &lt;img src="mozilla-image.png" alt="Logotipo de Mozilla que dirige a la página inicial de Mozilla"&gt;
-&lt;/a&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Encontrarás mucho más sobre el manejo de imágenes en próximos artículos en esta web.</p>
-</div>
-
-<h2 id="Primer_acercamiento_a_URLs_y_rutas">Primer acercamiento a URLs y rutas</h2>
-
-<p>Para comprender completamente a dónde apuntan los enlaces, necesitas conocer las URLs y las rutas. En esta sección encontrarás la información que necesitas sobre el tema.</p>
-
-<p>Una localizadora uniforme de recursos (URL, de las iniciales en inglés de «<em>Uniform Resource Locator</em>») es simplemente una secuencia de caracteres de texto que definen donde está situado algo en la web. Por ejemplo, la página de Mozilla está ubicada en <code>https://www.mozilla.org/es-ES/</code>.</p>
-
-<p>Las URLs utilizan rutas para encontrar los archivos. Las rutas especifican dónde se encuentra el archivo que buscas dentro del sistema de archivos. Veamos un ejemplo de una estructura de directorios (ve el directorio <a href="https://github.com/mdn/learning-area/tree/master/html/introduction-to-html/creating-hyperlinks">creating-hyperlinks</a>).</p>
-
-<p><img alt="Una estructura de directorios simple. El directorio principal se llama creating-hyperlinks y contiene dos archivos llamados index.html y contacts.html, y dos directorios llamados projects y pdfs, que contiene un archivo index.html y un archivo project-brief.pdf, respectivamente" src="https://mdn.mozillademos.org/files/12409/simple-directory.png" style="display: block; margin: 0 auto;"></p>
-
-<p>Al directorio <strong>raíz</strong> de esta estructura de directorios lo hemos llamado <code>creating-hyperlinks</code>. Al trabajar en modo local en una web, habrá un directorio que contendrá toda la información. En nuestro ejemplo, dentro de la raíz, encontramos el archivo <code>index.html</code> y el archivo <code>contacts.html</code>. En una web real, <code>index.html</code> es el punto de entrada a la web, lo que se conoce como <em>página de inicio</em>.</p>
-
-<p>Observamos también dos directorios dentro de nuestro directorio raíz que son: <code>pdfs</code> y <code>projects</code>. Cada uno de ellos tiene archivos en su interior — un archivo PDF (<code>project-brief.pdf</code>) y un archivo <code>index.html</code>, respectivamente. Observa que es posible tener sin problemas dos archivos <code>index.html</code> en un proyecto siempre y cuando se encuentren alojados en ubicaciones diferentes de nuestra estructura de archivos — muchos sitios web lo hacen. El segundo <code>index.html</code> será la página de inicio para la información relativa a los proyectos.</p>
-
-<ul>
- <li>
-  <p><strong>En el mismo directorio</strong>: Si queremos incluir un hipervínculo dentro del archivo <code>index.html</code> (el <code>index.html</code> del nivel más alto) que apunte al archivo <code>contacts.html</code>, simplemente especificaremos el nombre del archivo al que hacemos referencia, porque se encuentra en el mismo directorio en el que se encuentra el archivo <code>index.html</code> desde donde lo queremos llamar. Por lo tanto, usamos la URL <code>contacts.html</code> — veamos el código:</p>
-
-  <pre class="brush: html notranslate">&lt;p&gt;¿Quieres contactar con un miembro específico del personal?
-Encuentra los detalles en nuestra &lt;a href="contacts.html"&gt;página de contactos&lt;/a&gt;.&lt;/p&gt;</pre>
- </li>
- <li>
-  <p><strong>Bajando por la estructura de subdirectorios</strong>: Si queremos incluir un hipervínculo dentro del archivo <code>index.html</code> (el <code>index.html</code> de nivel más alto) que apunta a <code>projects/index.html</code>, debemos bajar hasta el directorio <code>projects</code> antes de indicar al archivo al que queremos enlazar. Para ello especificamos el nombre del directorio y le añadimos una barra inclinada hacia adelante, y a continuación el nombre del archivo. Por lo tanto, utilizaremos la URL <code>projects/index.html</code>:</p>
-
-  <pre class="brush: html notranslate">&lt;p&gt;Visita mi &lt;a href="projects/index.html"&gt;página de inicio del proyecto&lt;/a&gt;.&lt;/p&gt;</pre>
- </li>
- <li>
-  <p><strong>Subiendo por nuestro sistema de directorios</strong>: Si ahora queremos incluir un hipervínculo dentro del archivo <code>projects/index.html</code> que apunte a <code>pdfs/project-brief.pdf</code>, hay que subir un nivel en nuestro sistema de directorios, para luego bajar al directorio <code>pdf</code>. Para «Subir un nivel» utilizamos los dos puntos — (<code>..</code>) — por lo que usamos la URL <code>../pdfs/project-brief.pdf</code>:</p>
-
-  <pre class="brush: html notranslate">&lt;p&gt;Un enlace a mi&lt;a href="../pdfs/project-brief.pdf"&gt;resumen del proyecto&lt;/a&gt;.&lt;/p&gt;</pre>
- </li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Podemos combinar más de una instancia de estas características y generar URLs más complejas, si es necesario, por ejemplo: <code>../../../ruta/compleja/a/mi/archivo.html</code>.</p>
-</div>
-
-<h3 id="Fragmentos_de_documento">Fragmentos de documento</h3>
-
-<p>Es posible apuntar hacia una parte concreta de un documento HTML en vez de a todo un documento. Para ello hay que asignar previamente un atributo {{HTMLAttrxRef("id")}} al elemento hacia el que apuntamos. Esto se debe hacer en el encabezado y quedará así:</p>
-
-<pre class="brush: html notranslate">&lt;h2 id="Dirección_de_envío"&gt;Dirección de envío&lt;/h2&gt;</pre>
-
-<p>Posteriormente para hacer referencia a este <code>id</code> concreto, lo añadiremos al final de la URL precedido por una almohadilla — veamos el ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;¿Quieres mandarnos una carta? Aquí tienes nuestra &lt;a href="contacts.html#Dirección_de_envío"&gt;Dirección de envío&lt;/a&gt;.&lt;/p&gt;</pre>
-
-<p>También podemos usar esta referencia a un fragmento de documento para apuntar hacia otra <em>parte del mismo documento</em>:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;La &lt;a href="#Dirección_de_envío"&gt;Dirección de envío de la empresa&lt;/a&gt; se encuentra al final de esta página.&lt;/p&gt;</pre>
-
-<h3 id="URLs_absolutas_y_relativas">URLs absolutas y relativas</h3>
-
-<p>Dos términos que encontrarás en la Web son <strong>URL absoluta</strong> y <strong>URL relativa:</strong></p>
-
-<p><strong>URL absoluta</strong>: Hace referencia a una dirección definida por su ubicación absoluta en la web, esta incluye el {{Glossary("protocol", "protocolo")}} y el {{Glossary("domain name", "nombre del dominio")}}. Por ejemplo, si subes una página de inicio <code>index.html</code> a un directorio llamado <code>projects</code> que se encuentra dentro de la raíz de un servidor web, y el dominio del sitio web es <code>http://www.example.com</code>, se podrá acceder a la página desde <code>http://www.example.com/projects/index.html</code> (o simplemente <code>http://www.example.com/projects/</code>, ya que la mayoría de los servidores web buscan la página de inicio <code>index.html</code> para cargarla por omisión si no se les especifica otra en la URL).</p>
-
-<p>Una URL absoluta siempre apuntará a la misma dirección, sin importar desde dónde se utilice.</p>
-
-<p>Una <strong>URL relativa</strong>: Hace referencia a una dirección que depende de la posición del archivo desde donde se utiliza — son las que vimos en la sección anterior. Por ejemplo, si desde un archivo ubicado en <code>http://www.example.com/projects/index.html</code> queremos enlazar hacia un archivo PDF ubicado en el mismo directorio, la URL sería simplemente el nombre del archivo (por ejemplo: <code>project-brief.pdf</code>) no necesitamos más información. Si el archivo PDF está situado en un subdirectorio dentro de <code>projects</code> llamado <code>pdfs</code>, la URL relativa es: <code>pdfs/project-brief.pdf</code> (la URL absoluta equivalente sería: <code>http://www.example.com/projects/pdfs/project-brief.pdf</code>).</p>
-
-<p>Una URL relativa hará referencia a diferentes direcciones según dónde se encuentre el archivo desde el cual se utiliza — por ejemplo, si movemos nuestro archivo <code>index.html</code> del directorio <code>projects</code> a la raíz del sitio web (el nivel más alto, no cualquiera de los otros directorios), la URL relativa <code>pdfs/project-brief.pdf</code> ahora hará referencia a <code>http://www.example.com/pdfs/project-brief.pdf</code>, en lugar de a <code>http://www.example.com/projects/pdfs/project-brief.pdf</code>.</p>
-
-<p>Por supuesto, la ubicación del archivo <code>pdfs/project-brief.pdf</code> y del directorio <code>pdfs</code> no cambian de repente cuando mueves el archivo <code>index.html</code>; esto hará que tus enlaces apunten a un sitio equivocado y no funcionarán correctamente al hacer clic en ellos. ¡Por lo tanto debes tener cuidado!</p>
-
-<h2 id="Buenas_prácticas_en_el_uso_de_los_enlaces">Buenas prácticas en el uso de los enlaces</h2>
-
-<p>Hay algunas buenas prácticas que debemos respetar cuando escribimos enlaces. Veamos cuáles son.</p>
-
-<ul>
-</ul>
-
-<h3 id="Redacción_clara_del_enlace">Redacción clara del enlace</h3>
-
-<p>Es fácil rellenar de enlaces una página, sin más. Pero esto no basta. Hay que lograr que nuestros enlaces sean <em>accesibles</em> para todo tipo de lectores, sin importar el contexto o las herramientas que prefieran. Por ejemplo:</p>
-
-<ul>
- <li>Los usuarios de lectores de pantalla suelen saltar de enlace a enlace en la página y los leen todos sin contexto.</li>
- <li>Los motores de búsqueda utilizan el texto de los enlaces para indizar los archivos buscados, por lo que es una buena idea incluir palabras clave al definir el texto de los enlaces para describir de forma efectiva el sitio al que apuntan.</li>
- <li>Los usuarios visuales suelen echar un vistazo rápido a la página y leen solo lo que les interesa, en lugar de leer todo el texto palabra por palabra, y sus miradas van directamente a las características destacadas de la página, como son los enlaces. Este tipo de usuarios encuentra útiles los textos descriptivos que estos contienen.</li>
-</ul>
-
-<p>Veamos un ejemplo concreto:</p>
-
-<p><em><strong>Buen</strong> texto en un enlace</em>: <a href="https://firefox.com">Descargar Firefox</a></p>
-
-<pre class="brush: html notranslate">&lt;p&gt;&lt;a href="https://firefox.com/"&gt;
-  Descargar Firefox
-&lt;/a&gt;&lt;/p&gt;</pre>
-
-<p><em><strong>Mal</strong> texto en un enlace</em>: <a href="https://firefox.com/">Pulsar aquí</a> para descargar Firefox</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;&lt;a href="https://firefox.com/"&gt;
-  Haz clic aquí
-&lt;/a&gt;
-para descargar Firefox&lt;/p&gt;
-</pre>
-
-<p>Otras indicaciones:</p>
-
-<ul>
- <li>No repetir la URL como parte del texto — Las URLs suenan horrible, y todavía suenan peor si las lee un lector de pantalla, letra por letra.</li>
- <li>No escribir «<em>link</em>» o «<em>link a</em>» o «enlace» o «enlace a» en el texto del enlace porque es redundante. Los lectores automáticos indican que hay un enlace al encontrarlo. Los usuarios también saben que hay un enlace, porque normalmente se suele cambiar el color del texto y se subraya (no hay que romper esta convención, porque los usuarios están acostumbrados a ella).</li>
- <li>Redacta la etiqueta del enlace de la manera más breve y concisa posible — los textos de enlace largos son especialmente molestos para los usuarios que utilizan lectores automáticos, porque tienen que escuchar todo el texto del enlace.</li>
- <li>Minimiza los casos en los que varias copias del mismo texto están vinculadas a diferentes lugares. Esto puede causar problemas a los usuarios de lectores de pantalla, si hay una lista de enlaces fuera de contexto que están etiquetados como "haz clic aquí", "haz clic aquí", "haz clic aquí".</li>
-</ul>
-
-<h3 id="Utiliza_enlaces_relativos_siempre_que_sea_posible">Utiliza enlaces relativos siempre que sea posible</h3>
-
-<p>A partir de las indicaciones anteriores podemos llegar a pensar que es mejor utilizar referencias absolutas en todos los casos; después de todo, estas no se rompen cuando la página se traslada como ocurre con las referencias relativas. Sin embargo, debes utilizar enlaces relativos siempre que sea posible cuando enlaces a otras ubicaciones dentro del <em>mismo sitio web</em>. Cuando vinculas a otro sitio web, deberás utilizar un vínculo absoluto.</p>
-
-<ul>
- <li>Primero, porque el código es mucho más fácil de leer — las URLs relativas suelen ser mucho más cortas que las absolutas, lo que hace que el código sea mucho más fácil de leer.</li>
- <li>Segundo, resulta más eficiente utilizar URLs relativas cuando sea posible. Cuando usas una URL absoluta, el navegador comienza buscando la ubicación real del servidor en el Sistema de nombres de dominio ({{Glossary("DNS")}}), consulta {{web.link("/es/docs/Learn/Getting_started_with_the_web/How_the_Web_works", "Cómo funciona la web")}} para obtener más información). Entonces va a ese servidor y busca el archivo solicitado. En cambio, con una URL relativa, el navegador simplemente busca el archivo solicitado en el mismo servidor. Si usas URLs absolutas donde las URLs relativas lo harían, constantemente estás haciendo que tu navegador haga un trabajo adicional, lo cual significa que funcionará de manera menos eficiente.</li>
-</ul>
-
-<h3 id="Indica_claramente_los_recursos_no_HTML">Indica claramente los recursos no HTML</h3>
-
-<p>Cuando damos referencias a recursos para descargarlos (como documentos en formato PDF o Word) o para reproducirlos (como archivos de audio o vídeo) o que tengan un efecto inesperado (una ventana emergente) hay que indicarlo para no confundir al usuario.</p>
-
-<p>Por ejemplo:</p>
-
-<ul>
- <li>Si tienes una conexión con poco ancho de banda, pulsas un enlace y comienza a descargar un archivo pesado de forma inesperada.</li>
- <li>Si no tienes instalado el reproductor Flash, pulsas un enlace y te conduce a una página que requiere Flash.</li>
-</ul>
-
-<p>Veamos algunos ejemplos, para ver qué texto puede ser aconsejable en estos casos:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;&lt;a href="http://www.example.com/large-report.pdf"&gt;
-  Descarga el informe de ventas (PDF, 10MB)
-&lt;/a&gt;&lt;/p&gt;
-
-&lt;p&gt;&lt;a href="http://www.example.com/video-stream/"&gt;
-  Reproduce el vídeo (el flujo de datos se abre en una pestaña independiente, calidad HD)
-&lt;/a&gt;&lt;/p&gt;
-
-&lt;p&gt;&lt;a href="http://www.example.com/car-game"&gt;
-  Juega al juego del automóvil (requiere Flash)
-&lt;/a&gt;&lt;/p&gt;</pre>
-
-<h3 id="Utiliza_el_atributo_download_al_enlazar_una_descarga">Utiliza el atributo <code>download</code> al enlazar una descarga</h3>
-
-<p>Si queremos hacer referencia a una descarga en lugar de a algo que abra el navegador, disponemos del atributo <code>download</code> para proporcionar un nombre predeterminado al archivo a guardar. Veamos un ejemplo con un enlace a la descarga de la versión para Windows de Firefox:</p>
-
-<pre class="brush: html notranslate">&lt;a href="https://download.mozilla.org/?product=firefox-latest-ssl&amp;os=win64&amp;lang=es-MX"
-   download="firefox-latest-64bit-installer.exe"&gt;
-  Descarga la última versión de Firefox para Windows (64 bits) (Español, es-MX)
-&lt;/a&gt;</pre>
-
-<h2 id="Aprendizaje_activo_crear_un_menú_de_navegación">Aprendizaje activo: crear un menú de navegación</h2>
-
-<p>Para este ejercicio, deberás crear lo que se conoce como <em>web multipágina</em>: un menú de navegación con enlaces a distintas páginas. Esta es una manera común de crear páginas web — usamos la misma estructura en todas las páginas, incluida la que contiene el menú de navegación. Cuando los usuarios pulsen los enlaces tendrán la sensación de que están en la misma página y que solo cambia el contenido mostrado.</p>
-
-<p>Tendrás que hacer copias locales, en el mismo directorio, de las cuatro siguientes páginas (revisa el directorio <a href="https://github.com/mdn/learning-area/tree/master/html/introduction-to-html/navigation-menu-start">navigation-menu-start</a> para el listado completo):</p>
-
-<ul>
- <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/index.html">index.html</a></li>
- <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/projects.html">projects.html</a></li>
- <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/pictures.html">pictures.html</a></li>
- <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/social.html">social.html</a></li>
-</ul>
-
-<p>A continuación:</p>
-
-<ol>
- <li>Añade una lista no ordenada en el lugar adecuado de la página, que contenga los nombres de las páginas a las que enlazas. Un menú de navegación normalmente es una lista de enlaces (<em>links</em>), por lo que esto es semánticamente correcto.</li>
- <li>Convierte cada nombre en un enlace a esa página.</li>
- <li>Copia el menú de navegación en cada una de las páginas.</li>
- <li>En cada página, elimina solo el enlace que hace referencia a sí mismo (es confuso y no tiene sentido que una página se llame a sí misma, y la falta del enlace actúa como recordatorio de la página en la que se está en cada momento).</li>
-</ol>
-
-<p>El ejercicio terminado debería crear una página como la siguiente:</p>
-
-<p><img alt="Un ejemplo de un menú de navegación HTML simple, con inicio, imágenes, proyectos y elementos del menú social" src="https://mdn.mozillademos.org/files/12411/navigation-example.png" style="display: block; margin: 0 auto;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si ahora encallas, o no estás seguro de haberlo conseguido, revisa el directorio <a href="https://github.com/mdn/learning-area/tree/master/html/introduction-to-html/navigation-menu-marked-up">navigation-menu-marked-up</a> para ver la respuesta correcta.</p>
-</div>
-
-<h2 id="Enlace_a_correo_electrónico">Enlace a correo electrónico</h2>
-
-<p>Es posible crear enlaces o botones que, cuando se pulsan, abren un nuevo correo saliente en lugar de enlazar a un recurso o página. Esto se consigue con el elemento ancla {{HTMLElement("a")}} y el elemento <code>mailto:</code> seguido del esquema de la URL.</p>
-
-<p>En su forma más básica, un enlace <code>mailto:</code> simplemente contiene la dirección de correo electrónico de los destinatarios. Por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;a href="mailto:nowhere@mozilla.org"&gt;Enviar correo electrónico a ninguna parte&lt;/a&gt;
-</pre>
-
-<p>Esto da como resultado un enlace que se ve así: <a href="mailto:nowhere@mozilla.org"> Enviar correo electrónico a ninguna parte</a>.</p>
-
-<p>De hecho, incluso el atributo con la dirección de correo electrónico es opcional. Si lo omites y tu ({{HTMLAttrxRef("href", "a")}} simplemente es "mailto:", aparecerá una nueva ventana de correo saliente en el gestor de correo sin la dirección del destinatario. Esto es útil cuando queremos compartir enlaces que los usuarios puedan pulsar para enviar un correo electrónico y elegir un destinatario posteriormente.</p>
-
-<h3 id="Especificar_detalles">Especificar detalles</h3>
-
-<p>Además de la dirección de correo electrónico, puedes proporcionar otra información. De hecho, puedes incluir cualquier campo estándar contenido en el encabezado de cualquier mensaje en la URL <code>mailto</code> que proporciones. Los más utilizados son el «<code>subject</code>» (asunto), «<code>cc</code>» (con copia a) o «<code>bcc</code>» (copia oculta), y «<code>body</code>» (cuerpo del mensaje, que no es realmente un campo de la cabecera, pero permite especificar un mensaje breve para el nuevo correo electrónico). Cada campo y su valor se especifican como un argumento de la consulta.</p>
-
-<p>Veamos un ejemplo que incluye estos campos:</p>
-
-<pre class="brush: html notranslate">&lt;a href="mailto:nowhere@mozilla.org?cc=name2@rapidtables.com&amp;bcc=name3@rapidtables.com&amp;subject=The%20subject%20of%20the%20email&amp;body=The%20body%20of%20the%20email"&gt;
-  Enviar un correo electrónico cc, bcc, asunto y cuerpo
-&lt;/a&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Los valores de cada campo deben tener la URL codificada, es decir, sin caracteres no imprimibles (caracteres invisibles, tabulaciones, retornos de carro y saltos de página) y espacios con codificación porcentual (%20) {{Interwiki("wikipedia", "Código porciento")}}. También hay que tener en cuenta el uso del signo de interrogación (?) para separar la URL principal de los valores de los campos, y el símbolo ampersand (&amp;) para separar cada campo dentro del enlace <code>mailto:</code>. Esta es la notación de consulta URL estándar. Lee {{web.link("/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data#The_GET_method", "el método GET")}} para comprender mejor qué notación de consulta URL se usa comúnmente.</p>
-</div>
-
-<p>A continuación otros ejemplos de utilización de enlaces <code>mailto</code>:</p>
-
-<ul>
- <li><a href="mailto:">mailto:</a></li>
- <li><a href="mailto:nowhere@mozilla.org">mailto:nowhere@mozilla.org</a></li>
- <li><a href="mailto:nowhere@mozilla.org,nobody@mozilla.org">mailto:nowhere@mozilla.org,nobody@mozilla.org</a></li>
- <li><a href="mailto:nowhere@mozilla.org?cc=nobody@mozilla.org">mailto:nowhere@mozilla.org?cc=nobody@mozilla.org</a></li>
- <li><a href="mailto:nowhere@mozilla.org?cc=nobody@mozilla.org&amp;subject=This%20is%20the%20subject">mailto:nowhere@mozilla.org?cc=nobody@mozilla.org&amp;subject=This%20is%20the%20subject</a></li>
-</ul>
-
-<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
-
-<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Encuentra más ejercicios con los que comprobar que has retenido esta información antes de seguir adelante; consulta {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_Links", "Pon a prueba tus habilidades: Enlaces")}}.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Eso es todo en cuanto a enlaces, ¡por ahora! Volveremos a ellos más tarde en este curso cuando comencemos a usar estilos. Lo siguiente en HTML, será aprender la semántica de texto para usar algunas características avanzadas/inusuales que nos serán utilidad — Formato de texto avanzado será la próxima parada.</p>
-
-<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
-</ul>
diff --git a/files/es/learn/html/introduccion_a_html/debugging_html/index.html b/files/es/learn/html/introduccion_a_html/debugging_html/index.html
deleted file mode 100644
index 114b93ff0f..0000000000
--- a/files/es/learn/html/introduccion_a_html/debugging_html/index.html
+++ /dev/null
@@ -1,171 +0,0 @@
----
-title: Depurar el HTML
-slug: Learn/HTML/Introduccion_a_HTML/Debugging_HTML
-tags:
-  - Error
-  - Guía
-  - HTML
-  - Principiante
-  - Validación
-  - Validador
-  - depurar
-  - programar
-translation_of: Learn/HTML/Introduction_to_HTML/Debugging_HTML
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">Escribir HTML es fácil, pero ¿qué pasa si algo va mal y desconocemos dónde está el error de codificación? En este artículo veremos varias herramientas que nos ayudarán a arreglar errores en HTML.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Estar familiarizado con los principios básicos de HTML, como los vistos en el apartado <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/iniciar">Empezar con el HTML</a>, <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/texto">Conocimientos básicos de aplicación de formato a textos con HTML</a> y <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/Creating_hyperlinks">Creación de hiperenlaces</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender el funcionamiento básico de las herramientas de depuración de problemas de código en HTML.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Depurar_no_debe_asustarnos">Depurar no debe asustarnos</h2>
-
-<p>Cuando escribimos cualquier tipo de código, normalmente todo va bien, hasta ese fatídico momento en el que ocurre un error, hemos hecho algo mal y el código no funciona, o no funciona del todo, no lo suficientemente bien. Por ejemplo, el dibujo siguiente muestra un error de {{glossary("compile","compilación")}} de un programa sencillo escrito en lenguaje <a href="https://www.rust-lang.org/">Rust</a>.</p>
-
-<p><img alt="A console window showing the result of trying to compile a rust program with a missing quote around a string in a print statement. The error message reported is error: unterminated double quote string." src="https://mdn.mozillademos.org/files/12435/error-message.png" style="display: block; height: 520px; margin: 0px auto; width: 711px;">En el ejemplo, el mensaje de error es fácilmente comprensible: "unterminated double quote string" (comillas sin cerrar en el texto). Si analizamos el listado de código, observamos que en <code>println!(Hello, world!");</code> faltan una comillas. Pero, los mensajes de error pueden complicarse con facilidad y su interpretación ser menos sencilla a medida que los programas aumentan en tamaño, e incluso casos sencillo pueden llegar a intimidar a alguien que no sabe nada de Rust.</p>
-
-<p>Sin embargo, la depuración no nos debe asustar; la clave para sentirnos cómodos con la escritura y la depuración de cualquier lenguaje o código es la familiaridad, tanto con el lenguaje como con las herramientas.</p>
-
-<h2 id="HTML_y_depuración">HTML y depuración</h2>
-
-<p>HTML no es tan complicado de entender como Rust; HTML no se compila por separado antes de que el navegador lo analice (se interpreta, no se compila). Y la sintaxis de los {{glossary("element","elementos")}} de HTML es mucho más sencilla de entender que la de cualquier lenguaje de programación real como Rust, {{glossary("JavaScript")}} o {{glossary("Python")}}. La forma en que los navegadores ejecutan HTML es más <strong>permisiva</strong> que la de los otros lenguajes, cosa que es buena y mala a la vez.</p>
-
-<h3 id="Código_permisivo">Código permisivo</h3>
-
-<p>¿Qué queremos decir con <em>permisivo</em>? Bien, normalmente cuando hacemos algo mal al codificar, suele haber dos tipos de error:</p>
-
-<ul>
- <li><strong>Errores sintácticos</strong>: Son errores de escritura en el código que impiden que el programa funcione, como el error en Rust de arriba. Suelen ser fáciles de arreglar si estamos familiarizados con las herramientas adecuadas y sabemos el significado de los mensajes de error.</li>
- <li><strong>Errores lógicos</strong>: En estos errores la sintaxis es correcta, pero el código no hace lo que debería, por lo que el programa funciona de forma incorrecta. Estos errores son, por lo general, más difíciles de solucionar que los sintácticos, porque no hay mensajes de error que nos avisen de ellos.</li>
-</ul>
-
-<p>HTML en sí mismo no suele producir errores sintácticos porque los navegadores son permisivos con ellos; o sea, el código se sigue ejecutando ¡aun si hay errores! Los navegadores disponen de reglas internas para saber cómo interpretar los errores de marcado incorrecto que encuentran, y seguirán funcionando aunque no produzcan el resultado esperado. Esto puede también ser un problema, por supuesto.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: La ejecución de HTML es permisiva porque cuando se creó la web por primera vez, se decidió que el hecho de permitir que la gente publicara su contenido era más importante que el hecho de que la sintaxis fuera totalmente correcta. La web no sería tan popular como lo es hoy en día si se hubiera sido más estricto desde el primer momento.</p>
-</div>
-
-<h3 id="Aprendizaje_activo_Estudio_del_código_permisivo">Aprendizaje activo: Estudio del código permisivo</h3>
-
-<p>Es hora de estudiar la naturaleza permisiva del código HTML por nosotros mismos.</p>
-
-<ol>
- <li>En primer lugar, hagamos una copia de nuestro <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/debugging-html/debug-example.html">ejemplo-demo a depurar</a> y guardémoslo de forma local. Está escrito para generar diversos errores que deberemos descubrir (se dice que el marcado de HTML está <strong>mal formado</strong>, en contraposición a un marcado <strong>bien formado</strong>).</li>
- <li>A continuación, abrámoslo en un navegador; veremos lo siguiente:<img alt="A simple HTML document with a title of HTML debugging examples, and some information about common HTML errors, such as unclosed elements, badly nested elements, and unclosed attributes. " src="https://mdn.mozillademos.org/files/12437/badly-formed-html.png" style="display: block; margin: 0 auto;"></li>
- <li>No parece que esté bien; veamos el código fuente para ver qué podemos hacer (solo mostramos el contenido del &lt;body&gt;):
-  <pre class="brush: html notranslate">&lt;h1&gt;HTML debugging examples&lt;/h1&gt;
-
-&lt;p&gt;What causes errors in HTML?
-
-&lt;ul&gt;
-  &lt;li&gt;Unclosed elements: If an element is &lt;strong&gt;not closed properly,
-      then its effect can spread to areas you didn't intend
-
-  &lt;li&gt;Badly nested elements: Nesting elements properly is also very important
-      for code behaving correctly. &lt;strong&gt;strong &lt;em&gt;strong emphasised?&lt;/strong&gt;
-      what is this?&lt;/em&gt;
-
-  &lt;li&gt;Unclosed attributes: Another common source of HTML problems. Let's
-      look at an example: &lt;a href="https://www.mozilla.org/&gt;link to Mozilla
-      homepage&lt;/a&gt;
-&lt;/ul&gt;</pre>
- </li>
- <li>Veamos qué problemas podemos descubrir:
-  <ul>
-   <li>El elemento {{htmlelement("p")}} y el {{htmlelement("li")}} no tienen etiquetas de cierre. Si comprobamos el resultado, no parece que haya generado un efecto grave en la representación del lenguaje de marcado, porque es fácil deducir que donde un elemento acaba, debería comenzar otro.</li>
-   <li>El primer elemento {{htmlelement("strong")}} no tiene etiqueta de cierre. Este resulta ser un poco más problemático porque no es fácil deducir dónde se supone que termina el elemento. De hecho, el énfasis fuerte se ha aplicado al resto del texto.</li>
-   <li>Esta sección está mal anidada: <code>&lt;strong&gt;strong &lt;em&gt;strong emphasised?&lt;/strong&gt; what is this?&lt;/em&gt;</code>. No es fácil de explicar la forma en que ha sido interpretado, debido al problema anterior.</li>
-   <li>Al valor del atributo {{htmlattrxref("href","a")}} le faltan las comillas de cierre. Esto parece haber causado el problema más grave: el enlace ha desaparecido totalmente.</li>
-  </ul>
- </li>
- <li>Ahora veamos lo que el navegador ha mostrado en contraposición al código fuente. Para ello podemos usar las herramientas de desarrollo del navegador. Si no estamos familiarizados con el uso de estas herramientas, echemos un vistazo rápido a <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">Descubrir las herramientas de desarrollo del navegador</a>, y luego continuaremos.</li>
- <li>En el inspector de objetos (DOM), puedes comprobar la apariencia de cada elemento: <img alt="The HTML inspector in Firefox, with our example's paragraph highlighted, showing the text &quot;What causes errors in HTML?&quot; Here you can see that the paragraph element has been closed by the browser." src="https://mdn.mozillademos.org/files/12439/html-inspector.png" style="display: block; margin: 0 auto;"></li>
- <li>Vamos a explorar nuestro código en detalle con el inspector de objetos DOM para ver cómo el navegador ha arreglado nuestros errores de código HTML (lo hemos hecho con Firefox; otros navegadores modernos deberían conducir al mismo resultado):
-  <ul>
-   <li>Se han añadido etiquetas de cierre a los párrafos y las líneas de las listas.</li>
-   <li>Al no estar claro el final del elemento <code>&lt;strong&gt;</code>, el navegador lo ha aplicado individualmente a todos los bloques de texto siguientes, a cada uno le ha añadido su etiqueta <code>strong</code> propia, desde donde está ¡hasta el final del documento!</li>
-   <li>El navegador ha arreglado el anidamiento incorrecto del modo siguiente:
-    <pre class="brush: html notranslate">&lt;strong&gt;strong
-  &lt;em&gt;strong emphasised?&lt;/em&gt;
-&lt;/strong&gt;
-&lt;em&gt; what is this?&lt;/em&gt;</pre>
-   </li>
-   <li>El enlace a cuyo atributo le faltan las comillas del final ha sido ignorado. La última lista la ha dejado como sigue:
-    <pre class="brush: html notranslate">&lt;li&gt;
-  &lt;strong&gt;Unclosed attributes: Another common source of HTML problems.
-  Let's look at an example: &lt;/strong&gt;
-&lt;/li&gt;</pre>
-   </li>
-  </ul>
- </li>
-</ol>
-
-<h3 id="Validación_HTML">Validación HTML</h3>
-
-<p>Con el ejemplo anterior podemos asegurarnos de que nuestro HTML está bien formado, pero ¿cómo? En el ejemplo siguiente podemos comprobar que es bastante fácil buscar entre las líneas y encontrar los errores en documentos pequeños; pero, ¿qué pasa cuando trabajamos con documentos HTML grandes y complejos?</p>
-
-<p>La mejor estrategia es comenzar por pasar tu página HTML por el <a href="https://validator.w3.org/">servicio de validación de etiquetas</a>; fue creado y está mantenido por el W3C, organización que se encarga de definir las especificaciones de HTML, CSS y otras tecnologías web. Esta página web toma un documento HTML como entrada, lo procesa, y genera un informe de dónde están los errores en el documento.</p>
-
-<p><img alt="The HTML validator homepage" src="https://mdn.mozillademos.org/files/12441/validator.png" style="display: block; margin: 0 auto;"></p>
-
-<p>Para validar el HTML, podemos proporcionar al validador una dirección web a la que apuntar, subirle un archivo HTML, o directamente introducirle el código HTML que queremos que revise.</p>
-
-<h3 id="Aprendizaje_activo_Validación_de_un_documento_HTML">Aprendizaje activo: Validación de un documento HTML</h3>
-
-<p align="left">Vamos a probar de validar nuestro <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/debugging-html/debug-example.html">documento ejemplo</a>.</p>
-
-<ol>
- <li>Primero, cargamos el <a href="https://validator.w3.org/">servicio de validación</a> en una pestaña del navegador, si no lo tenemos ya.</li>
- <li>Hacemos clic en la subpestaña <a href="https://validator.w3.org/#validate_by_input">Validate by Direct Input</a>.</li>
- <li>Copiamos el código del documento ejemplo (no solo el <code>body</code>) y lo pegamos en el cuadro de texto grande.</li>
- <li>Hacemos clic en el botón <em>Check</em>.</li>
-</ol>
-
-<p>Esto debería proporcionar una lista de errores y otras informaciones:</p>
-
-<p><img alt="A list of of HTML validation results from the W3C markup validation service" src="https://mdn.mozillademos.org/files/12443/validation-results.png" style="display: block; margin: 0 auto;"></p>
-
-<h4 id="Interpretación_de_los_mensajes_de_error">Interpretación de los mensajes de error</h4>
-
-<p>La lista de mensajes de error que nos presenta el validador suele ayudar, pero a veces, no resultan muy útiles; con un poco de práctica aprenderemos a interpretar la lista para arreglar nuestro código. Veamos los mensajes de error y su significado. Observamos que cada mensaje se presenta con un número de línea y de columna, para ayudar a localizar el error más fácilmente.</p>
-
-<ul>
- <li>"<span>Consider adding a </span><code>lang</code><span> attribute to the </span><code>html</code><span> start tag to declare the language of this document.": No se trata de un error, sino de una advertencia (warning). La <a class="external external-icon" href="https://www.w3.org/International/questions/qa-html-language-declarations" rel="noopener">recomendación</a> es definir siempre un idioma, y este "warning" explica cómo hacerlo..</span></li>
- <li>"End tag <code>li</code> implied, but there were open elements" (2 instancias): Estos mensajes indican que un elemento que ha sido abierto debe ser cerrado. La etiqueta de cierre se supone, pero no está ahí. La información de la línea/columna apunta a la primera línea después de donde debería estar la etiqueta de cierre; es una buena pista para ver qué pasa.</li>
- <li>"Unclosed element <code>strong</code>": Un elemento {{htmlelement("strong")}} no ha sido cerrado, y la línea/columna apunta directamente al lugar del error.</li>
- <li>"End tag <code>strong</code> violates nesting rules": Este apunta a elementos que están incorrectamente anidados, y la línea/columna nos indica donde están.</li>
- <li>"End of file reached when inside an attribute value. Ignoring tag": Esta es bastante enigmática; se refiere al hecho de que el valor de un atributo no ha sido bien construido, posiblemente cerca del final del archivo porque el final aparece dentro del valor del atributo. El hecho de que el navegador no muestre el enlace nos debería dar una buena pista de qué elemento es el erróneo.</li>
- <li>"End of file seen and there were open elements": Este es un poco ambiguo, pero básicamente se refiere al hecho de que hay elementos abiertos que necesitan ser cerrados adecuadamente. Los números de línea apuntan a las últimas líneas del archivo, y este mensaje de error viene con una línea de código que indica un ejemplo de un elemento abierto:
-  <pre class="notranslate">example: &lt;a href="https://www.mozilla.org/&gt;link to Mozilla homepage&lt;/a&gt; ↩ &lt;/ul&gt;↩ &lt;/body&gt;↩&lt;/html&gt;</pre>
-
-  <div class="note">
-  <p><strong>Nota</strong>: Un atributo al que le falten las comillas de cierre puede ser un elemento abierto, porque el resto del documento será interpretado como si fuera parte de este atributo.</p>
-  </div>
- </li>
- <li>Unclosed element <code>ul</code>: Este no ayuda mucho, porque el elemento {{htmlelement("ul")}} está cerrado correctamente. Este error se debe a que el elemento {{htmlelement("a")}} no ha sido cerrado, ya que faltan las comillas de cierre.</li>
-</ul>
-
-<p><span>No debemos preocuparnos si no podemos corregir todos los mensajes de error; es práctico tratar de arreglar unos pocos errores cada vez y volver a pasar el validador para ver los que quedan. A veces, al arreglar unos cuantos se arreglan automáticamente otros muchos; con frecuencia muchos errores los causa uno solo en un efecto dominó.</span></p>
-
-<p><span>Sabremos  que todos los errores están arreglados cuando veamos el mensaje siguiente: </span></p>
-
-<p><img alt='Banner that reads "The document validates according to the specified schema(s) and to additional constraints checked by the validator."' src="https://mdn.mozillademos.org/files/12445/valid-html-banner.png" style="display: block; margin: 0 auto;"></p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Pues hasta aquí una introducción al depurado de HTML, que nos proporcionará habilidades para cuando comencemos a depurar CSS, JavaScript y otros lenguajes más adelante en nuestros trabajos. Este apartado también constituye el final de la introducción al módulo de artículos de aprendizaje de HTML; ahora podemos hacer los test de prueba: el primero de los cuales está en el enlace siguiente.</p>
-
-<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}</p>
diff --git a/files/es/learn/html/introduccion_a_html/estructura/index.html b/files/es/learn/html/introduccion_a_html/estructura/index.html
deleted file mode 100644
index 1f5f1e315c..0000000000
--- a/files/es/learn/html/introduccion_a_html/estructura/index.html
+++ /dev/null
@@ -1,298 +0,0 @@
----
-title: Estructura web y documentación
-slug: Learn/HTML/Introduccion_a_HTML/estructura
-tags:
-  - CodingScripting
-  - Composición
-  - Diseño
-  - Formato
-  - Guía
-  - HTML
-  - Presentación
-  - Principiante
-  - Sitio
-  - Sitio Web
-  - bloques
-  - pagina
-  - programar
-  - semántica
-translation_of: Learn/HTML/Introduction_to_HTML/Document_and_website_structure
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">Además de definir partes individuales de tu página (como un párrafo o una imagen), {{Glossary("HTML")}} también dispone de elementos de bloque que se pueden utilizar para estructurar las distintas áreas de tu sito web (tal como el encabezado, el menú de navegación o la parte del contenido principal. En este artículo veras cómo planificar una estructura básica de página web y escribirás el HTML que representa esa estructura.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Estar familiarizado con HTML, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}. Aplicación de formato a texto en documentos HTML, según lo expuesto en la sección {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}. Funcionamiento de los hipervínculos, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender a estructurar tu documento usando atributos semánticos y construir la estructura de una página web sencilla.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Partes_básicas_de_un_documento">Partes básicas de un documento</h2>
-
-<p>Las páginas web pueden y se deben diferenciar las unas de las otras, pero todas tienden a contener elementos comunes parecidos, a menos que estén destinadas a mostrar un vídeo o un juego a pantalla completa, o que formen parte de un proyecto artístico concreto o, simplemente, que estén mal estructuradas; estos elementos comunes son:</p>
-
-<dl>
- <dt>encabezado:</dt>
- <dd>Normalmente formado por una gran franja que cruza la parte superior de la página con un <strong>gran título</strong>, un logotipo y quizás un lema. Esta parte suele permanecer invariable mientras navegas entre las páginas de un mismo sitio web.</dd>
- <dt>barra de navegación:</dt>
- <dd>Son los enlaces a las secciones principales del sitio web. Normalmente está formada por un menú con botones, enlaces o pestañas. Al igual que el <em>encabezado</em>, este contenido suele permanecer invariable en las diferentes páginas del sitio; tener un menú inconsistente en tu página web conducirá a los usuarios a la confusión y frustración. Muchos diseñadores web consideran que el menú de navegación forma parte del encabezado y que no posee un componente individual, aunque no es necesario que sea así; de hecho, algunos argumentan que tener ambos componentes por separado es mejor por motivos de {{web.link("/es/docs/Learn/Accessibility", "accesibilidad")}} porque los lectores de pantalla pueden leer mejor ambos elementos si están separados.</dd>
- <dt>contenido principal:</dt>
- <dd>Es la gran parte central de la página y contiene la mayor parte del contenido particular de una página web concreta; por ejemplo, el video que quieres ver, la narración que quieres leer, el mapa que quieres consultar, los titulares de las noticias, etc. ¡Esta es la parte que definitivamente debe variar mucho de una página a otra de tu sitio web!</dd>
- <dt>barra lateral:</dt>
- <dd>Suele incluir algún tipo de información adicional, enlaces, citas, publicidad, etc. Normalmente está relacionada con el contenido principal de la página (por ejemplo, en una página de noticias, la barra lateral podría contener la biografía del autor o enlaces a artículos relacionados), pero en otras ocasiones encontraras elementos recurrentes como un menú de navegación secundario.</dd>
- <dt>pie de página:</dt>
- <dd>Es la parte inferior de la página, que generalmente contiene la letra pequeña, el copyright o la información de contacto. Es el sitio donde se coloca la información común (al igual que en el encabezado), pero esta información no suele ser tan importante o es secundaria con respecto a la página en sí misma. El pie también se suele usar para propósitos {{Glossary("SEO")}}, e incluye enlaces de acceso rápido al contenido más popular.</dd>
-</dl>
-
-<p>Una página web «típica» se podría parecer a esta:</p>
-
-<p><img alt="Un ejemplo de estructura de sitio web simple con un encabezado principal, menú de navegación, contenido principal, barra lateral y pie de página." src="https://mdn.mozillademos.org/files/12417/sample-website.png" style="display: block; margin: 0 auto;"></p>
-
-<h2 id="HTML_para_dar_estructura_al_contenido">HTML para dar estructura al contenido</h2>
-
-<p>El ejemplo no es muy atractivo, pero puede servir para ilustrar un ejemplo de diseño de una página web típica. Puedes encontrar sitios con más columnas, algunas mucho más complejas, pero esta servirá para hacerte una idea general sobre el tema. Con el CSS adecuado podrás usar muchos más elementos para decorar las distintas secciones y conseguir que queden como deses, pero como se comentó anteriormente, necesitas respetar ciertas normas semánticas, y <em>utilizar el elemento adecuado para cada tipo de sección</em>.</p>
-
-<p>La parte visual no lo es todo. Utilizarás diferentes fuentes y colores para llamar la atención de los usuarios sin discapacidad visual de las partes más importantes del contenido, como el menú de navegación y sus enlaces correspondientes, pero ¿qué ocurre con los usuarios con discapacidad visual que no pueden distinguir los colores llamativos o el tamaño grande de las fuentes?</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Los daltónicos representan alrededor del <a href="http://www.color-blindness.com/2006/04/28/colorblind-population/">4% de la población mundial</a> (aproximadamente 1 de cada 12 hombres y 1 de cada 200 mujeres son daltónicos). Los invidentes y las personas con discapacidad visual representan aproximadamente el 4-5% de la población mundial (en 2012 había {{Interwiki("wikipedia", "Discapacidad visual")}} 285 millones de personas con alguna de estas características en el mundo, mientras que el total de la población estaba {{Interwiki("wikipedia", "World_human_population#/media/File:World_population_history.svg", "alrededor de los 7,000 millones")}}.</p>
-</div>
-
-<p>En tu código HTML puedes crear secciones de contenido basadas en su <em>funcionalidad</em> — puedes usar elementos que representen sin ambigüedad las diferentes secciones de contenido descritas, de forma que las tecnologías de accesibilidad y los lectores de pantalla puedan reconocer esos elementos y asistir en tareas como «encontrar el menú de navegación», o «encontrar el contenido principal». Como se mencionó anteriormente en el curso, hay una serie de {{web.link("/es/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Por_qué_necesitamos_estructura", "consecuencias por no usar la estructura de elementos y semántica adecuada para hacer el trabajo correctamente")}}.</p>
-
-<p>HTML dispone de etiquetas adecuadas que puedes usar para establecer estas secciones semánticas, por ejemplo:</p>
-
-<ul>
- <li><strong>encabezado</strong>: {{HTMLElement("header")}}.</li>
- <li><strong>menú de navegación </strong>: {{HTMLElement("nav")}}.</li>
- <li><strong>contenido principal</strong>: {{HTMLElement("main")}}, con varias subsecciones (además de la barra lateral) representadas por los elementos {{HTMLElement("article")}}, {{HTMLElement("section")}}, y {{HTMLElement("div")}}.</li>
- <li><strong>barra lateral</strong>: {{HTMLElement("aside")}}; a menudo colocada dentro de {{HTMLElement("main")}}.</li>
- <li><strong>pie de página</strong>: {{HTMLElement("footer")}}.</li>
-</ul>
-
-<h3 id="Aprendizaje_activo_El_código_del_ejemplo_anterior">Aprendizaje activo: El código del ejemplo anterior</h3>
-
-<p>El ejemplo de página web que se muestra arriba se consigue a partir del siguiente código (disponible en el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/document_and_website_structure/index.html">repositorio Github</a>). Observa el ejemplo anterior, y a continuación échale un vistazo al código de abajo para identificar las secciones marcadas en el ejemplo.</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-
-    &lt;title&gt;El título de mi página&lt;/title&gt;
-    &lt;link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Sonsie+One" rel="stylesheet" type="text/css"&gt;
-    &lt;link rel="stylesheet" href="style.css"&gt;
-
-    &lt;!-- las tres siguientes líneas son un truco para obtener elementos semánticos de HTML5 que funcionan en versiones de Internet Explorer antiguas --&gt;
-    &lt;!--[if lt IE 9]&gt;
-      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"&gt;&lt;/script&gt;
-    &lt;![endif]--&gt;
-  &lt;/head&gt;
-
-  &lt;body&gt;
-    &lt;!-- Aquí empieza el encabezado principal que se mantendrá en todas las páginas del sitio web --&gt;
-
-    &lt;header&gt;
-      &lt;h1&gt;Encabezado&lt;/h1&gt;
-    &lt;/header&gt;
-
-    &lt;nav&gt;
-      &lt;ul&gt;
-        &lt;li&gt;&lt;a href="#"&gt;Inicio&lt;/a&gt;&lt;/li&gt;
-        &lt;li&gt;&lt;a href="#"&gt;Nuestro equipo&lt;/a&gt;&lt;/li&gt;
-        &lt;li&gt;&lt;a href="#"&gt;Proyectos&lt;/a&gt;&lt;/li&gt;
-        &lt;li&gt;&lt;a href="#"&gt;Contacto&lt;/a&gt;&lt;/li&gt;
-      &lt;/ul&gt;
-
-       &lt;!-- Un formulario de búsqueda es una forma no-lineal de hacer búsquedas en un sitio web. --&gt;
-
-       &lt;form&gt;
-         &lt;input type="search" name="q" placeholder="Buscar"&gt;
-         &lt;input type="submit" value="¡Vamos!"&gt;
-       &lt;/form&gt;
-     &lt;/nav&gt;
-
-    &lt;!-- Aquí está el contenido principal de nuestra página --&gt;
-    &lt;main&gt;
-
-      &lt;!-- Contiene un artículo --&gt;
-      &lt;article&gt;
-        &lt;h2&gt;Título del artículo&lt;/h2&gt;
-
-        &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Donec a diam lectus. Set sit amet ipsum mauris. Maecenas congue ligula as quam viverra nec consectetur ant hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur.&lt;/p&gt;
-
-        &lt;h3&gt;Subsección&lt;/h3&gt;
-
-        &lt;p&gt;Donec ut librero sed accu vehicula ultricies a non tortor. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aenean ut gravida lorem. Ut turpis felis, pulvinar a semper sed, adipiscing id dolor.&lt;/p&gt;
-
-        &lt;p&gt;Pelientesque auctor nisi id magna consequat sagittis. Curabitur dapibus, enim sit amet elit pharetra tincidunt feugiat nist imperdiet. Ut convallis libero in urna ultrices accumsan. Donec sed odio eros.&lt;/p&gt;
-
-        &lt;h3&gt;Otra subsección&lt;/h3&gt;
-
-        &lt;p&gt;Donec viverra mi quis quam pulvinar at malesuada arcu rhoncus. Cum soclis natoque penatibus et manis dis parturient montes, nascetur ridiculus mus. In rutrum accumsan ultricies. Mauris vitae nisi at sem facilisis semper ac in est.&lt;/p&gt;
-
-        &lt;p&gt;Vivamus fermentum semper porta. Nunc diam velit, adipscing ut tristique vitae sagittis vel odio. Maecenas convallis ullamcorper ultricied. Curabitur ornare, ligula semper consectetur sagittis, nisi diam iaculis velit, is fringille sem nunc vet mi.&lt;/p&gt;
-      &lt;/article&gt;
-
-      &lt;!-- el contenido aparte también se puede anidar dentro del contenido principal --&gt;
-      &lt;aside&gt;
-        &lt;h2&gt;Relacionado&lt;/h2&gt;
-
-        &lt;ul&gt;
-          &lt;li&gt;&lt;a href="#"&gt;Oh, me gusta estar junto al mar&lt;/a&gt;&lt;/li&gt;
-          &lt;li&gt;&lt;a href="#"&gt;Oh, me gusta estar junto al mar&lt;/a&gt;&lt;/li&gt;
-          &lt;li&gt;&lt;a href="#"&gt;Aunque en el norte de Inglaterra&lt;/a&gt;&lt;/li&gt;
-          &lt;li&gt;&lt;a href="#"&gt;Nunca deja de llover&lt;/a&gt;&lt;/li&gt;
-          &lt;li&gt;&lt;a href="#"&gt;Oh, bueno...&lt;/a&gt;&lt;/li&gt;
-        &lt;/ul&gt;
-      &lt;/aside&gt;
-
-    &lt;/main&gt;
-
-    &lt;!-- Y aquí está nuestro pie de página principal que se utiliza en todas las páginas de nuestro sitio web --&gt;
-
-    &lt;footer&gt;
-      &lt;p&gt;©Copyright 2050 de nadie. Todos los derechos revertidos.&lt;/p&gt;
-    &lt;/footer&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>Tómate tu tiempo para revisar el código y comprenderlo — Los comentarios en el código también te ayudarán a entenderlo. No te pedimos que hagas mucho más en este artículo, porque la clave para entender el diseño del documento es escribir una estructura HTML conocida y posteriormente desarrollar su apariencia con CSS. Estudiaremos el diseño CSS como parte del tema CSS.</p>
-
-<h2 id="Elementos_de_diseño_HTML_en_detalle">Elementos de diseño HTML en detalle</h2>
-
-<p>Es bueno entender el significado global de todos los elementos definitorios de las secciones HTML en detalle; es algo en que trabajarás gradualmente a medida que comiences a tener más experiencia en el desarrollo web. En el enlace {{web.link("/es/docs/Web/HTML/Element", "referencia de elementos HTML")}} podemos entrar en un gran nivel de detalle. Por el momento, estas son las definiciones principales que deberíamos tratar de entender:</p>
-
-<ul>
- <li>{{HTMLElement('main')}} encierra el contenido particular a esta página. Utilizaremos <code>&lt;main&gt;</code> solamente una vez para cada página y lo situaremos directamente dentro del elemento {{HTMLElement('body')}}. Es mejor que no lo anidemos en otros elementos.</li>
- <li>{{HTMLElement('article')}} encuadra un bloque de contenido que tiene sentido por sí mismo aparte del resto de la página (por ejemplo una entrada en un blog).</li>
- <li>{{HTMLElement('section')}} es parecido al elemento <code>&lt;article&gt;</code>, pero se usa más para agrupar cada parte de la página que, por su funcionalidad, constituye una sección en sí misma (por ejemplo un minimapa o un conjunto de titulares y resúmenes). Se considera una buena práctica comenzar cada una de estas secciones con un título de encabezado ({{web.link("/es/Learn/HTML/Howto/Set_up_a_proper_title_hierarchy", "heading")}}); observa que podemos subdividir artículos (<code>&lt;article&gt;</code>) en distintas secciones (<code>&lt;section&gt;</code>), o también secciones en distintos artículos, dependiendo del contexto.</li>
- <li>{{HTMLElement('aside')}} incluye contenido que no está directamente relacionado con el contenido principal, pero que puede aportar información adicional relacionada indirectamente con él (resúmenes, biografías del autor, enlaces relacionados, etc.).</li>
- <li>{{HTMLElement('header')}} representa un grupo de contenido introductorio. Si este es «<em>hijo</em>» de un elemento {{HTMLElement('body')}}, se convertirá en el <strong>encabezado</strong> principal del sitio web, pero si es hijo de un elemento {{HTMLElement('article')}} o un elemento {{HTMLElement('section')}}, entonces simplemente será el <strong>encabezado</strong> particular de cada sección (por favor, no lo confundas con {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML#Añadir_un_título","títulos y encabezados")}}).</li>
- <li>{{HTMLElement('nav')}} contiene la funcionalidad de navegación principal de la página. Los enlaces secundarios, etc., no entrarán en la navegación.</li>
- <li>{{HTMLElement('footer')}} representa un grupo de contenido al final de una página.</li>
-</ul>
-
-<h3 id="Envolturas_no_semánticas">Envolturas no semánticas</h3>
-
-<p>A veces hay situaciones en las que no encuentras un elemento semántico adecuado para agrupar ciertos elementos o englobar cierto contenido. Podrías querer agrupar ciertos elementos para referirte a ellos como una entidad que comparta cierto {{Glossary("CSS")}} o {{Glossary("JavaScript")}}. Para casos como esos, HTML dispone del elemento {{HTMLElement("div")}} y del elemento {{HTMLElement("span")}}. Preferentemente estos elementos se deberán utilizar con sus atributos ({{HTMLAttrxRef('class')}}), para conferirles algún tipo de etiquetado que permita determinarlos con facilidad.</p>
-
-<p>{{HTMLElement("span")}} es un elemento no-semántico que se utiliza en el interior de una línea. Se utiliza cuando no se nos ocurre el uso de ningún otro elemento semántico de texto en el que incluir el contenido, o si no se desea añadir ningún significado específico. Por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;El rey volvió ebrio a su habitación alrededor de la 01:00, y sin duda la cerveza no le ayudaba
-cuando cruzó tambaleante la puerta &lt;span class="editor-note"&gt;[nota del editor: en este instante de la
-representación, deberían atenuarse las luces]&lt;/span&gt;.&lt;/p&gt;</pre>
-
-<p>En este caso, la nota del editor solo proporciona información extra para el director de la obra; se supone que estos elementos no incluyen contenido extra importante. Para los usuarios sin discapacidad visual, quizás debamos usar CSS para diferenciar sutilmente estas notas del texto principal.</p>
-
-<p>{{HTMLElement("div")}} es un elemento de bloque no-semántico; lo utilizaras cuando no se te ocurra el uso de otro elemento semántico mejor, o si no deseas añadir ningún significado concreto. Por ejemplo, imagina un carrito de compras que puedes pulsar en cualquier momento durante tu estancia en una tienda virtual:</p>
-
-<pre class="brush: html notranslate">&lt;div class="shopping-cart"&gt;
-  &lt;h2&gt;Carrito de compras&lt;/h2&gt;
-  &lt;ul&gt;
-    &lt;li&gt;
-      &lt;p&gt;&lt;a href=""&gt;&lt;strong&gt;Pendientes de plata&lt;/strong&gt;&lt;/a&gt;: $99.95.&lt;/p&gt;
-      &lt;img src="../products/3333-0985/" alt="Pendientes de plata"&gt;
-    &lt;/li&gt;
-    &lt;li&gt;
-      ...
-    &lt;/li&gt;
-  &lt;/ul&gt;
-  &lt;p&gt;Importe total: $237.89&lt;/p&gt;
-&lt;/div&gt;</pre>
-
-<p>Este no es un elemento lateral (<code>&lt;aside&gt;</code>) porque no necesariamente está relacionado con el contenido principal de la página (en realidad quieres que se pueda ver desde cualquier página). Ni siquiera se puede incluir en una sección (<code>&lt;section&gt;</code>) porque su contenido no forma parte del contenido principal de la página. Por lo tanto, un elemento <code>&lt;div&gt;</code> es el adecuado en este caso. Hemos incluido un <strong>encabezado</strong> para indicar a los lectores de pantalla donde van a encontrarlo.</p>
-
-<div class="warning">
-<p><strong>Atención</strong>: Los elementos <code>div</code> son tan prácticos y simples que es fácil usarlos en exceso. Como no conllevan valor semántico, enmarañan el código HTML. Debemos tener cuidado de usarlos solo cuando no halles una solución mejor y reducir su uso al mínimo, porque de otro modo complicarás el mantenimiento y actualización de los documentos.</p>
-</div>
-
-<h3 id="Saltos_de_línea_y_líneas_horizontales">Saltos de línea y líneas horizontales</h3>
-
-<p>Dos elementos que debes conocer y utilizarás ocasionalmente son {{HTMLElement("br")}} y {{HTMLElement("hr")}}:</p>
-
-<p>El elemento {{HTMLElement("br")}} genera un salto de línea en un párrafo; es la única manera de representar series de líneas cortas, como una dirección postal o un poema. Por ejemplo:</p>
-
-<div id="line-break-live-sample">
-<pre class="brush: html notranslate">&lt;p&gt;Había una vez un hombre llamado O'Dell&lt;br&gt;
-A quién le encantaba escribir HTML&lt;br&gt;
-Pero su estructura era mala, su semántica era triste&lt;br&gt;
-y su marcado no se interpretó muy bien.&lt;/p&gt;</pre>
-</div>
-
-<p>Sin el elemento {{HTMLElement("br")}}, todo el párrafo se habría presentado como una sola línea larga (como ya hemos dicho con anterioridad en este curso, {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started#Los_espacios_en_blanco_en_HTML", "HTML ignora la mayoría del espacio en blanco")}}); con estos elementos {{HTMLElement("br")}} en el código, las líneas quedan:</p>
-
-<p>{{EmbedLiveSample('line-break-live-sample', '100%', '125px', '', '', 'hide-codepen-jsfiddle')}}</p>
-
-<p>Los elementos {{HTMLElement("hr")}} generan una regla horizontal en el documento que denota un cambio en la temática del texto (como un cambio de tema o de escena). Visualmente tiene el aspecto de una línea horizontal. Por ejemplo:</p>
-
-<div id="Ejemplo_en_vivo_línea_horizontal">
-<pre class="brush: html notranslate">&lt;p&gt;Ron fue acorralado en una esquina por las bestias abisales que merodeaban. Asustado, pero decidido a proteger a sus amigos, levantó su varita y se preparó para la batalla, con la esperanza de que su llamada de socorro hubiera llegado a alguien.&lt;/p&gt;
-&lt;hr&gt;
-&lt;p&gt;Mientras tanto, Harry estaba sentado en su casa, mirando su declaración de regalías y pensando en cuándo saldría la próxima serie derivada, cuando de pronto voló por su ventana una carta de socorro y aterrizó en su regazo. La leyó vagamente y suspiró; "Será mejor que vuelva al trabajo entonces", reflexionó.&lt;/p&gt;</pre>
-</div>
-
-<p>Quedará así:</p>
-
-<p>{{EmbedLiveSample('Ejemplo_en_vivo_línea_horizontal', '100%', '185px', '', '', 'hide-codepen-jsfiddle')}}</p>
-
-<h2 id="Planificación_de_una_página_web_sencilla">Planificación de una página web sencilla</h2>
-
-<p>Una vez has planificado el contenido de una página web sencilla, el paso lógico siguiente es intentar trabajar en el contenido para todo el sitio web, las páginas que necesitas y la forma de disponer las conexiones entre ellas para producir la mejor experiencia de usuario a los visitantes. Esto se conoce con el nombre de ({{Glossary("Arquitectura de la información")}}). Una web grande y compleja necesitará mucha planificación, pero para una web sencilla compuesta por unas cuantas páginas, el proceso puede ser sencillo, ¡y divertido!.</p>
-
-<ol>
- <li>Ten en cuenta que habrá varios elementos comunes en muchas (si no en todas las) páginas, tal como el menú de navegación y el contenido del pie de página. Si la web está dedicada a un negocio, por ejemplo, sería una buena idea disponer de la información de contacto en el pie de página en todas las páginas. Anota lo que deseas tener en común en cada página. <img alt="las características comunes del sitio de viajes para ir en cada página: título y logotipo, contacto, derechos de autor, términos y condiciones, selección de idioma, política de accesibilidad" src="https://mdn.mozillademos.org/files/12423/common-features.png" style="border-style: solid; border-width: 1px; display: block; height: 375px; margin: 0px auto; width: 600px;"></li>
- <li>A continuación, esboza un esquema sencillo de cuál podría ser la estructura deseada de la apariencia de cada página (podría ser algo tan sencillo como el siguiente dibujo). Anota los bloques principales. <img alt="Un diagrama simple de una estructura de sitio de ejemplo, con un encabezado, un área de contenido principal, dos barras laterales opcionales y un pie de página" src="https://mdn.mozillademos.org/files/12429/site-structure.png" style="border-style: solid; border-width: 1px; display: block; height: 232px; margin: 0px auto; width: 600px;"></li>
- <li>Ahora, elabora una lista completa con todo el resto del contenido de tu sitio web que no sea común a todas las páginas. <img alt="Una larga lista de todas las funciones que podrías incluir en tu sitio de viajes, desde buscar, hasta ofertas especiales e información específica del país" src="https://mdn.mozillademos.org/files/12425/feature-list.png" style="border-style: solid; border-width: 1px; display: block; height: 1066px; margin: 0px auto; width: 600px;"></li>
- <li>A continuación, trata de ordenar todo este contenido por grupos, para hacerte una idea de las partes que podrían ir juntas en las diferentes páginas. Esto es muy similar a una técnica llamada {{Glossary("Clasificación de tarjetas")}}. <img alt="Los elementos que deberían aparecer en un sitio de vacaciones ordenados en 5 categorías: Búsqueda, Especiales, Información específica del país, Resultados de búsqueda y Compra cosas" src=" https://mdn.mozillademos.org/files/12421/card-sorting.png" style="border-style: solid; border-width: 1px; display: block; height: 579px; margin: 0px auto; width: 600px;"></li>
- <li>Ahora trata de esquematizar un mapa de tu sitio — dibuja un globo para cada página de tu sitio web y dibuja líneas que identifiquen el flujo de datos entre las distintas páginas. La página de inicio normalmente estará ubicada en el centro y enlazará con el resto de páginas; la mayoría de las páginas de una web sencilla estarán enlazadas desde el menú de navegación principal, aunque puede haber excepciones. También puedes incluir notas sobre cómo se pueden presentar las cosas. <img alt="Un mapa del sitio que muestra la página de inicio, la página del país, los resultados de búsqueda, la página de ofertas especiales, la página de pago y la página de compra" src="https://mdn.mozillademos.org/files/12427/site-map.png" style="border-style: solid; border-width: 1px; display: block; height: 872px; margin: 0px auto; width: 600px;"></li>
-</ol>
-
-<h3 id="Aprendizaje_activo_Creación_de_un_mapa_del_sitio_web">Aprendizaje activo: Creación de un mapa del sitio web</h3>
-
-<p>Intenta llevar a cabo el ejercicio anterior para crear tu propia página web. ¿Qué contenido le vas a dar a tu sitio web?</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Guarda este esquema para utilizarlo más adelante.</p>
-</div>
-
-<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
-
-<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Puedes encontrar una evaluación detallada que pruebe estas habilidades al final del módulo; consulta {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructurar el contenido de una página")}}. ¡Recuerda leer primero el siguiente artículo de la serie y no solo saltarlo!</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>En este punto, deberías tener una mejor idea sobre cómo estructurar una página/sitio web. En el último artículo de este módulo, se explica cómo depurar HTML.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines", "Uso de secciones y esquemas HTML")}}: Guía avanzada de elementos semánticos HTML5 y el algoritmo de esquema HTML5.</li>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
-</ul>
diff --git a/files/es/learn/html/introduccion_a_html/estructuración_de_una_página_de_contenido/index.html b/files/es/learn/html/introduccion_a_html/estructuración_de_una_página_de_contenido/index.html
deleted file mode 100644
index 686940212e..0000000000
--- a/files/es/learn/html/introduccion_a_html/estructuración_de_una_página_de_contenido/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: Estructuración de una Página de contenido
-slug: Learn/HTML/Introduccion_a_HTML/Estructuración_de_una_página_de_contenido
-tags:
-  - Aprendizaje
-  - Diseño
-  - Escribir Código
-  - Estructuración
-  - Evaluación
-  - HTML
-  - Principiante
-  - Prototipado
-  - semántica
-translation_of: Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenu("Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}} </div>
-
-<p class="summary"><span id="result_box" lang="es"><span>La estructuración de una página de contenido lista para su uso mediante CSS es una habilidad muy importante para dominar, por lo que en esta evaluación  verá  su capacidad para pensar en cómo  podría finalizar una página  buscando y eligiendo la semántica estructural adecuada para construir</span> <span>un diseño en la parte superior.</span></span></p>
-
-<div id="gt-res-content">
-<div dir="ltr" style="zoom: 1;"> </div>
-</div>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td><span id="result_box" lang="es"><span>Antes de intentar esta evaluación, usted debería haber trabajado ya en el resto del curso, con un énfasis particular en la </span></span><a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure">Estructura del Documento y del Sitio Web.</a><a href="https://developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/estructura">.</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td><span id="result_box" lang="es"><span>Probar el conocimiento de las estructuras de páginas web y cómo representar un prototipado de diseño prospectivo en el marcado.</span></span></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Punto_de_partida">Punto de partida</h2>
-
-<p>Para comenzar esta evaluación, debería tomar el  <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/structuring-a-page-of-content-start/assets.zip?raw=true"> archivo zip  que contiene todos los activos de inicio</a>. El archivo zip contiene:</p>
-
-<ul>
- <li>El HTML que necesitas para añadir marcado estructural.</li>
- <li>CSS para dar el estilo a tu marcado.</li>
- <li>Las imágenes que serán utilizadas en la página.</li>
-</ul>
-
-<p>Crée el ejemplo en su ordenador personal, o como alternativa utilize un sitio como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer su evaluación.</p>
-
-<h2 id="Breve_Proyecto">Breve Proyecto</h2>
-
-<p>Para este proyecto, su tarea es tomar el contenido de la página principal de un sitio web de observación de aves y añadir elementos estructurales a la misma para que pueda tener un diseño de página aplicado a ella. Necesita tener:</p>
-
-<ul>
- <li> Un encabezado que abarca todo el ancho del sitio que contiene el título principal de la página, el logotipo del sitio y el menú de navegación. El título y el logotipo aparecen lado a lado una vez que se aplica el estilo, y la navegación aparece debajo de esos dos elementos.</li>
- <li>  Un área de contenido principal que contiene dos columnas: un bloque principal para contener el texto de bienvenida y una barra lateral para contener miniaturas de imágenes.</li>
- <li>  Un pie de página que contiene información sobre derechos de autor y créditos.</li>
-</ul>
-
-<p>Debe agregar una presentación adecuada para:</p>
-
-<ul>
- <li>El encabezado</li>
- <li>El menú de navegación</li>
- <li>El contenido principal</li>
- <li>El texto de bienvenida</li>
- <li>La barra lateral de imágenes</li>
- <li>El pié de página</li>
-</ul>
-
-<p>También debería:</p>
-
-<ul>
- <li> Aplicar el CSS proporcionado a la página agregando otro elemento {{htmlelement ("link")}} justo debajo del existente que se proporciona al principio.</li>
-</ul>
-
-<h2 id="Consejos">Consejos</h2>
-
-<ul>
- <li>Utilize el <a href="https://validator.w3.org/">validador de HTML  W3C  </a> para validar su  HTML; Obtendrá puntos de bonificación si valida tanto como sea posible (la línea "googleapis" es una línea utilizada para importar fuentes personalizadas en la página del servicio Google Fonts, no se valida, así que no te preocupes. )</li>
- <li>No necesita saber CSS para hacer esta evaluación; Sólo tiene que poner el CSS proporcionado dentro de un elemento HTML.</li>
- <li>El CSS proporcionado está diseñado para que cuando se agreguen los elementos estructurales correctos al marcado, aparezcan verdes en la página representada.</li>
- <li>Si se está quedando atascado y no puede imaginar ni qué elementos poner ni donde ponerlos , a menudo ayuda a dibujar un diagrama de bloques simple del diseño de página, y escribir en los elementos que usted piensa que debe envolver cada bloque.</li>
-</ul>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>La siguiente captura de pantalla muestra un ejemplo de cómo podría verse la letra después de haber sido marcada.</p>
-
-<p><img alt='The finished example for the assessment; a simple webpage about birdwatching, including a heading of "Birdwatching", bird photos, and a welcome message' src="https://mdn.mozillademos.org/files/12449/example-page.png" style="display: block; margin: 0 auto;"></p>
-
-<h2 id="Evaluación">Evaluación</h2>
-
-<p>Si está siguiendo esta evaluación como parte de un curso organizado, debe ser capaz de dar su trabajo a su maestro / mentor para el marcado. Si usted está aprendiendo por si mismo, entonces  puede obtener la guía de marcado con bastante facilidad preguntando sobre ello en la lista de correo<a href="https://lists.mozilla.org/listinfo/dev-mdc">  dev-mdc</a> , o en el canal IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a>  en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Pruebe a hacer el ejercicio primero - ¡No hay nada que ganar por hacer trampa!</p>
-
-<p>{{PreviousMenu("Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}</p>
-
-<div class="s3gt_translate_tooltip" id="s3gt_translate_tooltip" style="position: absolute; left: 61px; top: 1812px; opacity: 0.7;">
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Reproducir"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copy text to Clipboard"> </div>
-</div>
diff --git a/files/es/learn/html/introduccion_a_html/index.html b/files/es/learn/html/introduccion_a_html/index.html
deleted file mode 100644
index 64c70649cb..0000000000
--- a/files/es/learn/html/introduccion_a_html/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Introducción a HTML
-slug: Learn/HTML/Introduccion_a_HTML
-tags:
-  - CodingScripting
-  - Enlaces
-  - Estructura
-  - HTML
-  - Introducción a HTML
-  - Texto
-  - semántica
-translation_of: Learn/HTML/Introduction_to_HTML
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">En su corazón, {{glossary("HTML")}} es un lenguaje muy sencillo compuesto de {{Glossary("Element", "elementos")}}, que se pueden aplicar a piezas de texto para darles un significado diferente en un documento (¿Esto es un párrafo? ¿Esto es una lista con viñetas? ¿Esto es parte de una tabla?), estructura un documento en secciones lógicas (¿Tiene una cabecera? ¿Tres columnas de contenido? ¿Un menú de navegación?), e incrusta contenido como imágenes y vídeos en una página. Este módulo introducirá los dos primeros de estos, e introduce conceptos fundamentales y la sintaxis que necesitas para entender HTML.</p>
-
-<div class="in-page-callout webdev">
-<h3 id="¿Quieres_transformarte_en_un_desarrollador_de_la_interfaz_de_usuario_web">¿Quieres transformarte en un desarrollador de la interfaz de usuario web?</h3>
-
-<p>Hemos elaborado un curso que incluye toda la información esencial que necesitas para trabajar hacia tu objetivo.</p>
-
-<p><a class="cta primary" href="/docs/Learn/Front-end_web_developer">Empieza aquí</a></p>
-</div>
-
-<h2 id="Prerrequisitos">Prerrequisitos</h2>
-
-<p>Antes de empezar este módulo, no necesitas conocimientos previos de HTML, pero deberías estar, por lo menos, familiarizado con el uso básico de computadoras, y usar la Web pasivamente (es decir, sólo revisándola y consumiendo el contenido). Debes tener configurado un entorno de trabajo básico (como se detalla en {{web.link("/es/docs/Learn/Getting_started_with_the_web/Installing_basic_software", "Instalación de software básico")}}), y comprender cómo crear y administrar archivos (como se detalla en {{web.link("/es/docs/Learn/Getting_started_with_the_web/Dealing_with_files", "Manejo de archivos")}}). Ambos son parte de nuestro módulo completo {{web.link("/es/docs/Learn/Getting_started_with_the_web", "Introducción a la web")}} para principiantes.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si estás trabajando en una computadora, tablet u otro dispositivo en donde no tengas la capacidad de crear tus propios archivos, podrías probar (en su mayoría) el código de los ejemplos en un programa para escribir código en línea como <a href="http://jsbin.com/">JSBin</a> o <a href="">Glitch</a>.</p>
-</div>
-
-<h2 id="Guías">Guías</h2>
-
-<p>Este módulo contiene los siguientes artículos, que te llevarán a través de toda la teoría básica de HTML, y te proporcionarán una amplia oportunidad de probar algunas habilidades.</p>
-
-<dl>
- <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started">Empezar con HTML</a></dt>
- <dd>Cubre las bases absolutas de HTML, para que puedas empezar — definimos elementos, atributos, y todas los otros términos importantes que puedas haber escuchado, y en donde encajan en el lenguaje. También mostramos cómo está estructurado un elemento HTML, cómo está estructurada una página HTML típica, y explica otras características importantes. <span id="result_box" lang="es">En el camino, vamos a tener un juego con algo de HTML, ¡para alimentar tu intereses!</span></dd>
- <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">¿Qué hay en la cabecera? Metadatos en HTML</a></dt>
- <dd>La cabecera de un documento HTML es la parte que <strong>no</strong> se muestra en el navegador web cuando se carga una página. Esta contiene información como el título ({{htmlelement("title")}}) de la página, enlaces a {{glossary("CSS")}} (si quieres estilizar tu contenido HTML con CSS), enlaces a favicons personalizados, y metadatos (que son los datos sobre el HTML, como quién lo escribió, y palabras clave que describen el documento).</dd>
- <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals">Fundamentos de texto HTML</a></dt>
- <dd>Uno de los principales trabajos de HTML es darle significado al texto (también conocido como <strong>semántica</strong>) para que el navegador sepa cómo mostrarlo correctamente. Este artículo trata cómo usar HTML para convertir un bloque de texto en una estructura de encabezados y párrafos, agregar énfasis o importancia a las palabras, crear listas y más.</dd>
- <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creando hipervínculos</a></dt>
- <dd>Los hipervínculos realmente son importantes — estos son los que hacen la Web. Este artículo muestra la sintaxis requerida para hacer un enlace, y explica las mejores prácticas sobre enlaces.</dd>
- <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">Formateo de texto avanzado</a></dt>
- <dd>Hay muchos otros elementos en HTML para formatear texto, que no hemos tratado en los artículos {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "fundamentos de texto HTML")}}. Los siguientes elementos son menos conocidos, pero sigue siendo útil conocerlos. Aquí aprenderás sobre el marcado de citas, listas de descripción, código de computadoras y otros textos relacionados, <span id="result_box" lang="es"><span> subíndices y superíndices, información de contacto, y mucho más</span>.</span></dd>
- <dt>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</dt>
- <dd>Así como definimos las partes individuales de tu página (como "un párrafo" o "una imagen"), HTML también se usa para definir las áreas de tu sitio web (como "la cabecera", "el menú de navegación", "la columna de contenido principal"). Este artículo trata sobre cómo planear una estructura básica del sitio web, y escribir el HTML para representar esa estructura.</dd>
- <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML">Depurar HTML</a></dt>
- <dd>Escribir HTML está bien, pero ¿Qué pasa si algo está mal, y no puedes encontrar en dónde está el error en el código? Este artículo introducirá algunas herramientas que te podrán ayudar.</dd>
-</dl>
-
-<h2 id="Evaluaciones">Evaluaciones</h2>
-
-<p>Las siguientes evaluaciones probarán tu entendimiento de las bases de HTML cubiertas en las guías anteriores.</p>
-
-<dl>
- <dt>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcando para una carta")}}</dt>
- <dd><span id="result_box" lang="es">Todos aprendemos a escribir una carta, tarde o temprano; ¡Este también es un ejemplo útil para poner a prueba nuestras habilidades de formato de texto! Así que en esta evaluación se te dará una carta a la cual le tendrás que dar un marcado HTML.</span></dd>
- <dt>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</dt>
- <dd>Esta evaluación prueba tu capacidad para usar HTML para estructurar el contenido de una sencilla página, esta tiene una cabecera, pie de página, menú de navegación, contenido principal, y una barra lateral.</dd>
-</dl>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<dl>
- <dt><a href="https://teach.mozilla.org/activities/web-lit-basics/">Bases de la alfabetización Web 1</a></dt>
- <dd>Un curso excelente de la fundación Mozilla que explora y pone a prueba muchas de las habilidades sobre las cuales hablamos en el módulo de <em>Introducción a HTML</em>. Los estudiantes se familiarizan con la lectura, escritura y participan de la web en este módulo de seis partes. Descubre los fundamentos de la web a través de la producción y colaboración.</dd>
-</dl>
-
-<div class="note">
-<h2 id="Retroalimentación">Retroalimentación</h2>
-
-<p>Ayúdanos a mejorar nuestras guías y tutoriales como esta respondiendo {{web.link("https://www.surveygizmo.com/s3/4871248/MDN-Guides-Survey", "nuestra encuesta aquí")}}.</p>
-</div>
diff --git a/files/es/learn/html/introduccion_a_html/iniciar/index.html b/files/es/learn/html/introduccion_a_html/iniciar/index.html
deleted file mode 100644
index c05aa6a9f0..0000000000
--- a/files/es/learn/html/introduccion_a_html/iniciar/index.html
+++ /dev/null
@@ -1,767 +0,0 @@
----
-title: Empezar con HTML
-slug: Learn/HTML/Introduccion_a_HTML/iniciar
-tags:
-  - Atributos
-  - Elemento
-  - Guía
-  - HTML
-  - Principiante
-  - comentários
-translation_of: Learn/HTML/Introduction_to_HTML/Getting_started
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">En este artículo vamos a exponer lo más básico del HTML. Para comenzar definiremos elementos, atributos y el resto de términos importantes que quizá ya te suenen y qué función cumplen dentro del lenguaje. También explica dónde encajan estos en HTML. Aprenderás cómo se estructuran los elementos HTML, cómo se estructura una página HTML típica y otras características básicas importantes del lenguaje. Por el camino, también iremos practicando con algo de HTML.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, {{web.link("/es/docs/Learn/Getting_started_with_the_web/Installing_basic_software", "tener instalado el software básico")}} y conocimientos básicos de cómo {{web.link("/es/docs/Learn/Getting_started_with_the_web/Dealing_with_files", "trabajar con archivos")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Familiarizarte con el lenguaje HTML, y adquirir algo de práctica escribiendo unos pocos elementos HTML.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_el_HTML">¿Qué es el HTML?</h2>
-
-<p>{{Glossary("HTML")}} ("<em>Hypertext Markup Language</em>") no es un lenguaje de programación. Es un <em>lenguaje de marcado</em> que le dice a los navegadores web cómo estructurar las páginas web que estás visitando. Puede ser tan complejo o tan simple como desee el desarrollador web. El HTML consiste en una serie de {{Glossary("Element", "elementos")}}, que puedes utilizar para encerrar, delimitar o <em>marcar</em> diferentes partes del contenido para hacer que aparezcan de una cierta manera, o actúen de determinada forma. Las {{Glossary("Tag", "etiquetas")}} que delimitan un fragmento de contenido pueden hacer que dicho contenido enlace con otra página, ponga una palabra en cursiva, etcétera. Por ejemplo, dada la siguiente línea de contenido:</p>
-
-<pre class="brush: bash notranslate">Mi gato es muy gruñón</pre>
-
-<p>Si queremos que la línea sea independiente de otras, podemos especificar que es un párrafo encerrándola con una etiqueta de elemento de párrafo ({{htmlelement("p")}}):</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Mi gato es muy gruñón&lt;/p&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Las etiquetas en HTML no distinguen entre mayúsculas y minúsculas. Así que se pueden escribir tanto en mayúsculas como en minúsculas. Por ejemplo, una etiqueta {{htmlelement("title")}} se puede escribir como <code>&lt;title&gt;</code>, <code>&lt;TITLE&gt;</code>, <code>&lt;Title&gt;</code>, <code>&lt;TiTle&gt;</code>, etc., y funcionará correctamente. La mejor práctica, sin embargo, es escribir todas las etiquetas en minúsculas para mantener la coherencia y legibilidad, entre otros motivos.</p>
-</div>
-
-<h2 id="Anatomía_de_un_elemento_HTML">Anatomía de un elemento HTML</h2>
-
-<p>Exploremos un poco el elemento párrafo:</p>
-
-<p><img alt="Anatomía de los elementos HTML" src="https://mdn.mozillademos.org/files/11913/htmlexp.png" style="display: block; height: 255px; margin: 0px auto; width: 821px;"></p>
-
-<p>Las principales partes de nuestro elemento son:</p>
-
-<ul>
- <li>La <strong>etiqueta de apertura</strong>: consiste en el nombre del elemento (en este caso, <code>p</code>), encerrado entre <strong>paréntesis angulares</strong> de apertura y cierre. Esta etiqueta de apertura marca dónde comienza el elemento o comienza a tener efecto. En este ejemplo, precede al comienzo del texto del párrafo.</li>
- <li>El <strong>contenido</strong>: Este es el contenido del elemento. En este ejemplo, es el texto del párrafo.</li>
- <li>La <strong>etiqueta de cierre</strong>: Es lo mismo que la etiqueta de apertura, excepto que incluye una barra diagonal antes del nombre del elemento. Esto indica dónde termina el elemento; en este caso, dónde finaliza el párrafo. No incluir una etiqueta de cierre es un error común de principiante, y puede conducir a extraños resultados.</li>
-</ul>
-
-<p>El <strong>elemento</strong> lo conforman la etiqueta de apertura, seguida del contenido, seguido de la etiqueta de cierre.</p>
-
-<h3 id="Aprendizaje_activo_crear_tu_primer_elemento_HTML">Aprendizaje activo: crear tu primer elemento HTML</h3>
-
-<p>Edita la siguiente línea en el área <em>Entrada</em> envolviéndola con las etiquetas <code>&lt;em&gt;</code> y <code>&lt;/em&gt;</code>. Para <em>abrir el elemento</em>, coloca la etiqueta de apertura <code>&lt;em&gt;</code> al principio de la línea. Para <em>cerrar el elemento</em>, coloca la etiqueta de cierre <code>&lt;/em&gt;</code> al final de la línea. ¡Obtienes una línea en cursiva! Puedes ver tus cambios actualizados automáticamente en la caja de texto de <em>Salida</em>.</p>
-
-<p>Si te equivocas, siempre puedes volver al código anterior mediante el botón <em>Restablecer</em>. Si te quedas realmente atascado, pulsa el botón <em>Mostrar la solución</em> para ver la solución.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="playable-code" style="min-height: 100px;width: 95%"&gt;
-  Este es mi texto.
-&lt;/textarea&gt;
-
-&lt;div class="controls"&gt;
-  &lt;input id="reset" type="button" value="Restablecer" /&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución" /&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: 'Open Sans Light',Helvetica,Arial,sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}
-</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution = '&lt;em&gt;Este es mi texto.&lt;/em&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="Elementos_anidados">Elementos anidados</h3>
-
-<p>Se pueden poner elementos dentro de otros elementos. Esto se llama <strong>anidamiento</strong>. Si quisiéramos decir que nuestro gato es <strong>muy</strong> gruñón, podríamos encerrar la palabra <em>muy</em> en un elemento {{htmlelement("strong")}} para que aparezca destacada.</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Mi gato es &lt;strong&gt;muy&lt;/strong&gt; gruñón.&lt;/p&gt;</pre>
-
-<p>Hay una forma correcta e incorrecta de anidar. En el ejemplo anterior, primero abrimos el elemento <code>p</code>, luego abrimos el elemento <code>strong</code>. Para un anidamiento adecuado, primero debemos cerrar el elemento <code>strong</code>, antes de cerrar el <code>p</code>.</p>
-
-<p>El siguiente es un ejemplo de la forma <em>incorrecta</em> de anidar:</p>
-
-<pre class="example-bad brush: html notranslate">&lt;p&gt;Mi gato es &lt;strong&gt;muy gruñón.&lt;/p&gt;&lt;/strong&gt;</pre>
-
-<p>Los elementos tienen que abrirse y cerrarse correctamente para que estén claramente dentro o fuera el uno del otro. Con el tipo de superposición en el ejemplo anterior, el navegador tiene que adivinar tu intención. Este tipo de adivinanzas puede producir resultados inesperados.</p>
-
-<h3 id="Elementos_de_bloque_y_elementos_en_línea">Elementos de bloque y elementos en línea</h3>
-
-<p>Hay dos categorías importantes de elementos en HTML — Estos son los elementos de bloque y los elementos en línea.</p>
-
-<ul>
- <li>Los elementos de bloque forman un bloque visible en la página. Aparecerán en una línea nueva después de cualquier contenido anterior. Cualquier contenido que vaya después también aparecerá en una línea nueva. Los elementos a nivel de bloque suelen ser elementos estructurales de la página. Por ejemplo, un elemento a nivel de bloque puede representar encabezados, párrafos, listas, menús de navegación o pies de página. Un elemento a nivel de bloque no estaría anidado dentro de un elemento en línea, pero podría estar anidado dentro de otro elemento a nivel de bloque.</li>
- <li>Los elementos en línea están contenidos dentro de elementos de bloque y delimitan solo pequeñas partes del contenido del documento; (no párrafos enteros o agrupaciones de contenido) Un elemento en línea no hará que aparezca una nueva línea en el documento. Suele utilizarse con texto. Por ejemplo es el caso de un elemento {{htmlelement("a")}} (hipervínculo) o elementos de énfasis como {{htmlelement("em")}} o {{htmlelement("strong")}}.</li>
-</ul>
-
-<p>Considera el siguiente ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;em&gt;primero&lt;/em&gt;&lt;em&gt;segundo&lt;/em&gt;&lt;em&gt;tercero&lt;/em&gt;
-
-&lt;p&gt;cuarto&lt;/p&gt;&lt;p&gt;quinto&lt;/p&gt;&lt;p&gt;sexto&lt;/p&gt;
-</pre>
-
-<p>{{htmlelement("em")}} es un elemento en línea. Así, como puedes observar, los tres primeros elementos se sitúan en la misma línea, uno tras otro sin espacio entre ellos. Por otro lado, {{htmlelement("p")}} es un elemento a nivel de bloque. Cada elemento <em>p</em> aparece en una nueva línea, con un espacio arriba y abajo. (El espaciado se debe al {{web.link("/es/docs/Learn/CSS/Introduction_to_CSS", "estilo CSS")}} predeterminado que el navegador aplica a los párrafos).</p>
-
-<p>{{ EmbedLiveSample('Elementos_de_bloque_y_elementos_en_línea', 700, 200, "", "") }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: HTML5 redefinió las categorías de elementos: consulta <a href="https://html.spec.whatwg.org/multipage/indices.html#element-content-categories">Categorías de contenido de elementos</a>. Si bien estas definiciones son más precisas y menos ambiguas que sus predecesoras, las nuevas definiciones son mucho más complicadas de entender que <em>block</em> e <em>inline </em>. Este artículo seguirá con estos dos términos.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Los términos «en bloque» (block) y «en línea» (inline), tal como se usan en este tema, no se deberían confundir con {{web.link("/es/docs/Learn/CSS/Introduction_to_CSS/Box_model#Types_of_CSS_boxes", "los tipos de casillas de CSS")}} que se conocen con el mismo nombre. Aunque de manera predeterminada están relacionados, el hecho de cambiar el tipo de aspecto visual del CSS no cambia la categoría del elemento ni afecta a aquellos elementos que pueda contener. Una de las razones por las que HTML5 abandonó el uso de estos términos fue para evitar este tipo de confusión.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar referencias útiles que incluyen listas de elementos de bloque y elementos en línea. Consulta {{web.link("/es/docs/Web/HTML/Block-level_elements", "Elementos en bloque")}} y {{web.link("/es/docs/Web/HTML/Elementos_en_línea", "Elementos en línea")}}.</p>
-</div>
-
-<h3 id="Elementos_vacíos">Elementos vacíos</h3>
-
-<p>No todos los elementos siguen el patrón de etiqueta de apertura, contenido y etiqueta de cierre. Algunos elementos consisten solo en una etiqueta única, que se utiliza generalmente para insertar/incrustar algo en el documento en el lugar donde se le quiere incluir. Por ejemplo, el elemento {{htmlelement("img")}} inserta una imagen en la página:</p>
-
-<pre class="brush: html notranslate">&lt;img src="https://raw.githubusercontent.com/mdn/beginner-html-site/gh-pages/images/firefox-icon.png"&gt;</pre>
-
-<p>Este texto mostrará lo siguiente en tu página:</p>
-
-<p>{{ EmbedLiveSample('Elementos_vacíos', 700, 300, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Los elementos vacíos en ocasiones también se llaman elementos <em>nulos</em> o <em>vanos</em> (<em>void elements</em>).</p>
-</div>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Los elementos también pueden tener atributos. Los atributos tienen este aspecto:</p>
-
-<p><img alt="atributo html" src="https://mdn.mozillademos.org/files/11915/htmlatributos.png" style="display: block; height: 156px; margin: 0px auto; width: 1287px;"></p>
-
-<p>Los atributos contienen información extra sobre el elemento que no se mostrará en el contenido. En este caso, el atributo <code>class</code> asigna al elemento un identificador que se puede utilizar para dotarlo de información de estilo.</p>
-
-<p>Un atributo debería tener:</p>
-
-<ul>
- <li>Un espacio entre este y el nombre del elemento. (Para un elemento con más de un atributo, los atributos también deben estar separados por espacios).</li>
- <li>El nombre del atributo, seguido por un signo igual.</li>
- <li>Un valor del atributo, rodeado de comillas de apertura y cierre.</li>
-</ul>
-
-<h3 id="Aprendizaje_activo_Añadir_atributos_a_un_elemento">Aprendizaje activo: Añadir atributos a un elemento</h3>
-
-<p>Otro ejemplo de un elemento es {{htmlelement("a")}}. Esto significa <em>ancla</em>. Una ancla puede convertir el texto que encierra en un hipervínculo. Las anclas pueden tener varios atributos, pero varios son como sigue:</p>
-
-<ul>
- <li><strong><code>href</code></strong>: El valor de este atributo indica la dirección web a la que se quiere que apunte el enlace, que será hacia donde nos lleve el navegador cuando se haga clic sobre el elemento. Por ejemplo, <code>href="https://www.mozilla.org/"</code>.</li>
- <li><strong><code>title</code></strong>: El atributo <code>title</code> añade información adicional sobre el enlace, como puede ser el título de la página que vinculas. Por ejemplo, <code>title="La página de inicio de Mozilla"</code>. Esta información aparecerá cuando se le pase el ratón por encima.</li>
- <li><strong><code>target</code></strong>: El atributo <code>target</code> especifica el contexto de navegación que va a usar para mostrar el enlace. Por ejemplo, <code>target="_blank"</code> abrirá el enlace en una nueva pestaña. Si quieres mostrar el enlace en la pestaña activa, simplemente omite este atributo.</li>
-</ul>
-
-<p>Edita la línea de abajo en el área de <em>Entrada</em> para convertirlo en un enlace a tu sitio web favorito.</p>
-
-<ol>
- <li>Añade el elemento <code>&lt;a&gt;</code>.</li>
- <li>Añade el atributo <code>href</code> y el atributo <code>title</code>.</li>
- <li>Especifica el atributo <code>target</code> para abrir el enlace en una nueva pestaña.</li>
-</ol>
-
-<p>Los cambios se actualizarán inmediatamente en la zona de <em>Salida</em>. Deberías ver un enlace que mostrará el contenido del atributo <code>title</code> cuando pases el ratón encima, y que te llevará a la dirección web indicada por el atributo <code>href</code> cuando hagas clic. Recuerda que debes incluir un espacio entre el nombre del elemento y cada atributo.</p>
-
-<p>Si te equivocas, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente atascado, pulsa el botón <em>Mostrar la solución</em> para ver la solución.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_2">Código reproducible 2</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 100px;width: 95%"&gt;
-  &amp;lt;p&amp;gt;Un enlace a mi sitio web favorito.&amp;lt;/p&amp;gt;
-&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution = '&lt;p&gt;Un enlace a mi &lt;a href="https://www.mozilla.org/" title="La página de inicio de Mozilla" target="_blank"&gt;sitio web favorito&lt;/a&gt;.&lt;/p&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_2', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="Atributos_booleanos">Atributos booleanos</h3>
-
-<p>En ocasiones puedes ver atributos escritos sin valor. Esto está permitido. Estos se denominan atributos booleanos. Los atributos booleanos solo pueden tener un valor, que generalmente es el mismo que el nombre del atributo. Por ejemplo, considera el atributo {{htmlattrxref("disabled", "input")}}, que puedes asignar a los elementos de entrada del formulario. (Usa esto para <em>deshabilitar</em> los elementos de entrada del formulario para que el usuario no pueda realizar entradas. Los elementos desactivados suelen tener una apariencia atenuada). Por ejemplo:</p>
-
-<pre class="brush: bash notranslate">&lt;input type="text" disabled="disabled"&gt;</pre>
-
-<p>De manera abreviada, también es posible escribirlo como se describe a continuación (además, se ha incluido un elemento de entrada de formulario no desactivado como referencia, para dar una idea más precisa de lo que sucede):</p>
-
-<pre class="brush: html notranslate">&lt;!-- el uso del atributo deshabilitado evita que el usuario final introduzca texto en el cuadro de entrada --&gt;
-&lt;input type="text" disabled&gt;
-
-&lt;!-- se permite la entrada de texto, ya que no contiene el atributo deshabilitado --&gt;
-&lt;input type="text"&gt;
-</pre>
-
-<p>Como referencia, el ejemplo anterior también incluye un elemento de entrada de formulario no deshabilitado. El HTML del ejemplo anterior produce este resultado:</p>
-
-<p>{{ EmbedLiveSample('Atributos_booleanos', 700, 100, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="Omitir_comillas_en_valores_de_atributos">Omitir comillas en valores de atributos</h3>
-
-<p>Cuando observas diferentes páginas web, puedes encontrarte con todo tipo de estilos de etiquetado extraños, que incluyen valores de atributos sin comillas. Esto se permite en ciertas circunstancias, pero interrumpirá la edición en otras. Por ejemplo, si volvemos a revisar el ejemplo del enlace, sería posible escribir una versión básica con solo el atributo <code>href</code>, así:</p>
-
-<pre class="brush: html notranslate">&lt;a href=https://www.mozilla.org/&gt;mi sitio web favorito&lt;/a&gt;</pre>
-
-<p>Sin embargo, las cosas no funcionarán cuando a este estilo se añada el atributo <code>title</code>:</p>
-
-<pre class="example-bad brush: html notranslate">&lt;a href=https://www.mozilla.org/ title=The Mozilla homepage&gt;mi sitio web favorito&lt;/a&gt;</pre>
-
-<p>En este punto el navegador interpretará mal el cambio y pensará que el atributo <code>title</code> corresponde a tres atributos: un atributo <code>title</code> con el valor <em>The</em> y dos atributos booleanos: <code>Mozilla</code> y <code>homepage</code>. ¡Obviamente, esta no es la intensión! Causará errores o comportamientos inesperados, como puedes ver en el ejemplo en vivo a continuación. ¡Intenta colocar el cursor sobre el enlace para ver el texto del título!</p>
-
-<p>{{ EmbedLiveSample('Omitir_comillas_en_valores_de_atributos', 700, 100, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<p>Incluye <strong>siempre</strong> las comillas de atributos. Evita tales problemas y da como resultado un código más legible.</p>
-
-<h3 id="¿Comillas_simples_o_dobles">¿Comillas simples o dobles?</h3>
-
-<p>En este artículo todos los atributos se han incluido en comillas dobles. Sin embargo, se pueden ver comillas simples en algún código HTML. Es una cuestión de estilo. Puedes elegir libremente cuál prefieres. Ambas líneas de código son equivalentes:</p>
-
-<pre class="brush: html notranslate">&lt;a href="http://www.ejemplo.com"&gt;Un enlace a mi ejemplo.&lt;/a&gt;
-
-&lt;a href='http://www.ejemplo.com'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
-
-<p>Asegúrate de no mezclar ambos tipos de comillas. El siguiente ejemplo muestra un tipo de mezcla de comillas que saldrá mal:</p>
-
-<pre class="example-bad brush: html notranslate">&lt;a href="http://www.ejemplo.com'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
-
-<p>Si utilizas un tipo de comillas en tu documento HTML, puedes incluir el otro tipo de comillas para tus valores de atributo sin que esto te cause problemas:</p>
-
-<pre class="brush: html notranslate">&lt;a href="http://www.ejemplo.com" title="¿A que es 'divertido'"&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
-
-<p>Sin embargo, si deseas anidar unas comillas dentro de otras del mismo tipo (ya sea simples o dobles), tendrás que utilizar entidades HTML para las comillas. Por ejemplo, el siguiente código no va a funcionar:</p>
-
-<pre class="example-bad brush: html notranslate">&lt;a href='http://www.ejemplo.com' title='¿A que es 'divertido'?'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
-
-<p>Así que tendrás que hacer esto:</p>
-
-<pre class="brush: html notranslate">&lt;a href='http://www.ejemplo.com' title='¿A que es &amp;apos;divertido&amp;apos;?'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
-
-<h2 id="Anatomía_de_un_documento_HTML">Anatomía de un documento HTML</h2>
-
-<p>Los elementos HTML no son muy útiles por sí mismos. Ahora veremos cómo combinar los elementos individuales para formar una página HTML completa:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Mi página de prueba&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;p&gt;Esta es mi página&lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>Aquí tenemos:</p>
-
-<ol>
- <li><code>&lt;!DOCTYPE html&gt;</code>: El elemento <em>doctype</em>. En sus inicios, cuando el HTML llevaba poco tiempo (alrededor de 1991-1992), los <em>doctypes</em> servían como enlaces al conjunto de reglas que la página HTML debía seguir para que fuera considerado buen HTML. Un elemento <em>doctype</em> de aquella época podía parecerse a esto:
-
-  <pre class="brush: bash notranslate">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;</pre>
-  En la actualidad se ignora y se considera un legado histórico que hay que incluir para que todo funcione correctamente. <code>&lt;!DOCTYPE html&gt;</code> es la secuencia de caracteres más corta que se acepta como elemento <em>doctype</em> válido. Eso es lo único que realmente necesitas saber.</li>
- <li><code>&lt;html&gt;&lt;/html&gt;</code>: El elemento <code>&lt;html&gt;</code>. Este elemento envuelve todo el contenido de la página. A veces se lo conoce como el elemento raíz.</li>
- <li><code>&lt;head&gt;&lt;/head&gt;</code>: El elemento <code>&lt;{{htmlelement("head")}}&gt;</code> (cabecera). Este elemento actúa como contenedor para todos los parámetros que quieras incluir en el documento HTML que <em>no serán</em> visibles a los visitantes de la página. Incluye cosas como palabras clave y la descripción de la página que quieras mostrar en los resultados de búsqueda, así como la hoja de estilo para formatear nuestro contenido, declaraciones de codificación de caracteres y más. Aprenderás más acerca de esto en el siguiente artículo de la serie.</li>
- <li><code>&lt;meta charset="utf-8"&gt;</code>: Este elemento establece que tu documento HTML usará la codificación UTF-8, que incluye la gran mayoría de caracteres de todos los idiomas humanos escritos. En resumen: puede gestionar cualquier contenido textual que pongas en tu documento. No hay razón para no configurar este valor y te puede ayudar a evitar problemas más adelante.</li>
- <li><code>&lt;title&gt;&lt;/title&gt;</code>: El elemento {{htmlelement("title")}}. Este establece el título de la página, que es el título que aparece en la pestaña del navegador en la que se carga la página. El título de la página también se utiliza para describir la página cuando se marca como favorita.</li>
- <li><code>&lt;body&gt;&lt;/body&gt;</code>: El elemento <code>&lt;body&gt;</code>. Contiene todo el contenido que quieres mostrar a los usuarios cuando visitan tu página, ya sea texto, imágenes, vídeos, juegos, pistas de audio reproducibles o cualquier otra cosa.</li>
-</ol>
-
-<h3 id="Aprendizaje_activo_Añadir_algunas_características_a_un_documento_HTML">Aprendizaje activo: Añadir algunas características a un documento HTML</h3>
-
-<p>Si quieres escribir algo de HTML en tu ordenador local para experimentar, puedes:</p>
-
-<ol>
- <li>Copiar el ejemplo de la página HTML del punto anterior.</li>
- <li>Crear un archivo nuevo en un editor de texto.</li>
- <li>Pegar el código en el nuevo archivo de texto.</li>
- <li>Guardar el archivo como <code>index.html</code>.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: También puedes encontrar esta plantilla básica de HTML en el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">repositorio GitHub del Área MDN Learning</a>.</p>
-</div>
-
-<p>Ahora puedes abrir este archivo en un navegador web para ver cómo se ve el código renderizado. Edita el código y actualiza el navegador para ver cuál es el resultado. En principio se verá algo así:</p>
-
-<p><img alt="Una sencilla página HTML que dice esta es mi página" src="https://mdn.mozillademos.org/files/12279/template-screenshot.png" style="display: block; height: 365px; margin: 0px auto; width: 595px;">En este ejercicio, puedes editar el código en tu ordenador como se indica arriba, o puedes editarlo en la ventana editable que tienes a continuación (la ventana editable representa solo el contenido del elemento {{htmlelement("body")}}, en este caso). Intenta reproducir los siguientes pasos:</p>
-
-<ul>
- <li>Justo debajo de la etiqueta de apertura {{htmlelement("body")}}, añade un título principal para el documento. Este deberá estar dentro de una etiqueta de apertura <code>&lt;h1&gt;</code> y una etiqueta de cierre <code>&lt;/h1&gt;</code>.</li>
- <li>Edita el contenido del párrafo e incluye algún texto sobre algo que te interese.</li>
- <li>Pon las palabras importantes dentro de etiquetas <code>&lt;strong&gt;</code> de apertura y <code>&lt;/strong&gt;</code> de cierre para que destaquen en negrita.</li>
- <li>Añade un enlace a tu párrafo, como se ha explicado {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started#Active_learning_Adding_attributes_to_an_element", "anteriormente en este mismo artículo")}}.</li>
- <li>Agrega una imagen a tu documento. Colócala debajo del párrafo, como {{web.link("/es/Learn/HTML/Introduction_to_HTML/Getting_started#Empty_elements", "se explicó anteriormente en el artículo")}}. Ganarás puntos extra si consigues enlazar a una imagen diferente (de tu propio ordenador o de cualquier otro lugar de la web).</li>
-</ul>
-
-<p>Si te equivocas, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente atascado, pulsa el botón <em>Mostrar la solución</em> para ver la solución.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_3">Código reproducible 3</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 100px;width: 95%"&gt;
-  &amp;lt;p&amp;gt;Esta es mi página&amp;lt;/p&amp;gt;
-&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h1 {
- color: blue;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-img {
-  max-width: 100%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution = '&lt;h1&gt;Un poco de música&lt;/h1&gt;&lt;p&gt;Realmente disfruto &lt;strong&gt;tocar la batería&lt;/strong&gt;. Uno de mis bateristas favoritos es Neal Peart, que toca en la banda &lt;a href="https://en.wikipedia.org/wiki/Rush_%28band%29" title="artículo de Wikipedia de"&gt;Rush&lt;/a&gt;.\ Mi álbum favorito de Rush actualmente es &lt;a href="http://www.deezer.com/album/942295"&gt;Fotografías de la película&lt;/a&gt;.&lt;/p&gt;\ &lt;img src="http://www.cygnus-x1.net/links/rush/images/albums/sectors/sector2-movingpictures-cover-s.jpg"&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_3', 700, 600, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="Los_espacios_en_blanco_en_HTML">Los espacios en blanco en HTML</h3>
-
-<p>En los ejemplos anteriores se han incluido espacios en blanco y saltos de línea en el código. Esto realmente no es necesario. Los dos siguientes fragmentos de código son equivalentes:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Los perros son tontos.&lt;/p&gt;
-
-&lt;p&gt;Los    perros        son
-         tontos.&lt;/p&gt;</pre>
-
-<p>No importa cuántos espacios en blanco se utilicen (incluye tanto caracteres de espacio como saltos de línea) el intérprete de HTML reduce cada secuencia de espacio en blanco a un único espacio al interpretar el código. Entonces, ¿por qué utilizar espacios en blanco? La respuesta está en la legibilidad.<br>
- <br>
- Es más fácil comprender lo que está sucediendo en tu código si lo tienes bien formateado. En nuestro HTML cada elemento anidado está sangrado dos espacios más con respecto al exterior. Depende de ti qué estilo de formato utilizas (cuántos espacios para cada nivel de sangría, por ejemplo) pero debes plantearte el uso de algún tipo de formato.</p>
-
-<h2 id="Referencias_a_entidades_Inclusión_de_caracteres_especiales_en_HTML">Referencias a entidades: Inclusión de caracteres especiales en HTML</h2>
-
-<p>En HTML, los caracteres <code>&lt;</code>, <code>&gt;</code>,<code>"</code>,<code>'</code> y <code>&amp;</code> son caracteres especiales. Forman parte de la sintaxis HTML. Entonces, ¿cómo incluye uno de estos caracteres especiales en tu texto? Por ejemplo, si deseas utilizar un signo comercial o menor que, y no hacer que se interprete como código.</p>
-
-<p>Haces esto con referencias de caracteres. Estos son códigos especiales que representan caracteres, para ser usados en estas circunstancias exactas. Cada referencia de caracter comienza con un signo de ampersand (&amp;) y finaliza con un punto y coma (;).</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracter literal</th>
-   <th scope="col">Equivalente de referencia de caracteres</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>&lt;</td>
-   <td>&amp;lt;</td>
-  </tr>
-  <tr>
-   <td>&gt;</td>
-   <td>&amp;gt;</td>
-  </tr>
-  <tr>
-   <td>"</td>
-   <td>&amp;quot;</td>
-  </tr>
-  <tr>
-   <td>'</td>
-   <td>&amp;apos;</td>
-  </tr>
-  <tr>
-   <td>&amp;</td>
-   <td>&amp;amp;</td>
-  </tr>
- </tbody>
-</table>
-
-<p>El equivalente de referencia de caracter podría recordarse fácilmente porque el texto que utiliza se puede ver como menor que para '&amp;lt;' , cita para ' &amp;quot; ' y de manera similar para otros. Para obtener más información sobre la referencia de entidad, consulta {{interwiki("wikipedia", "Anexo:Referencias a entidades de caracteres XML y HTML")}} en (Wikipedia).<br>
- <br>
- Considera los dos siguientes párrafos:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;En HTML, defines un párrafo con el elemento &lt;p&gt;.&lt;/p&gt;
-
-&lt;p&gt;En HTML, defines un párrafo con el elemento &amp;lt;p&amp;gt;.&lt;/p&gt;</pre>
-
-<p>En la salida en vivo de abajo, puedes ver que el primer párrafo salió mal. El navegador interpreta la segunda instancia de <code>&lt;p&gt;</code> como el inicio de un nuevo párrafo. El segundo párrafo se ve bien porque hemos remplazado <code>&lt;</code> y <code>&gt;</code> por sus referencias correspondientes.</p>
-
-<p>{{ EmbedLiveSample('Referencias_a_entidades_Inclusión_de_caracteres_especiales_en_HTML', 700, 200) }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: En la Wikipedia se puede localizar un listado de todas las referencias de entidades de caracteres HTML disponibles: {{interwiki("wikipedia", "Anexo:Referencias a entidades de caracteres XML y HTML")}}. Observa que no necesitas usar ninguna referencia de entidad más para ningún otro de estos símbolos porque los navegadores modernos gestionan estos símbolos correctamente siempre y cuando en tu HTML hayas {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "establecido la codificación de el juego de caracteres universal UTF-8", "#Specifying_your_document's_character_encoding")}}.</p>
-</div>
-
-<h2 id="Comentarios_HTML">Comentarios HTML</h2>
-
-<p>En HTML hay un mecanismo para escribir comentarios en el código. Los comentarios son ignorados por el navegador y, por tanto, son invisibles para el usuario. El propósito de los comentarios es permitirte incluir notas en el código para explicar tu lógica o codificación. Esto es muy útil si regresas a un código base después de estar ausente el tiempo suficiente como para no recordarlo por completo. Del mismo modo, los comentarios son invaluables ya que diferentes personas están realizando cambios y actualizaciones.</p>
-
-<p>Para convertir en un comentario una sección de contenido de tu archivo HTML, debes delimitarlo con los marcadores especiales <code>&lt;!--</code> y <code>--&gt;</code>. Por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;No soy un comentario&lt;/p&gt;
-
-&lt;!-- &lt;p&gt;¡Yo sí!&lt;/p&gt; --&gt;</pre>
-
-<p>Como puedes ver a continuación, el primer párrafo aparece, pero el segundo no.</p>
-
-<p>{{ EmbedLiveSample('Comentarios_HTML', 700, 100, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Has llegado al final del artículo. Espero que hayas disfrutado del recorrido los conceptos básicos del HTML.<br>
- En este punto ya deberías entender el lenguaje, cómo funciona en un nivel básico y deberías poder escribir algunos elementos y atributos. También deberías poder escribir algunos elementos y atributos. Los artículos posteriores de este módulo profundizan en algunos de los temas aquí presentados, además de presentar otros conceptos del lenguaje.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: En este punto, a medida que empieces a aprender más sobre HTML, es posible que también desees comenzar a explorar los conceptos básicos de las Hojas de estilo en cascada (<em>Cascading style sheets</em>) o {{web.link("/es/docs/Learn/CSS", "CSS")}}. CSS, es el lenguaje utilizado para estilizar páginas web. (por ejemplo, cambiar fuentes o colores, o alterar el diseño de la página) HTML y CSS funcionan bien juntos, como pronto descubrirás.</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Web/HTML/Applying_color", "Aplicación de color a elementos HTML mediante CSS")}}</li>
-</ul>
-
-<div>{{NextMenu("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<div></div>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started">Empezar con HTML</a></li>
- <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">¿Qué hay en la cabecera? Metadatos en HTML</a></li>
- <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals">Fundamentos de texto HTML</a></li>
- <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creando hipervínculos</a></li>
- <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">Formateo de texto avanzado</a></li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
- <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML">Depurar HTML</a></li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcando para una carta")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
-</ul>
diff --git a/files/es/learn/html/introduccion_a_html/marking_up_a_letter/index.html b/files/es/learn/html/introduccion_a_html/marking_up_a_letter/index.html
deleted file mode 100644
index e53bb01826..0000000000
--- a/files/es/learn/html/introduccion_a_html/marking_up_a_letter/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: Marcando una Carta
-slug: Learn/HTML/Introduccion_a_HTML/Marking_up_a_letter
-tags:
-  - Cabecera
-  - Codificación
-  - Enlaces
-  - Evaluación
-  - Principiante
-  - Texto
-translation_of: Learn/HTML/Introduction_to_HTML/Marking_up_a_letter
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">Todos aprendemos a escribir una carta más tarde o más temprano; es también práctico practicar con nuestras habilidades para dar forma a los textos. En esta prueba deberás demostrar tus habilidades para dar forma a textos, incluyendo enlaces, además pondremos a prueba tu familiaridad con algunos contenidos de encabezamiento <code>&lt;head&gt;</code> en HTML.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Antes de intentar este examen deberías haber trabajado los artículos <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Getting_started">Getting started with HTML</a>, <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">What's in the head? Metadata in HTML</a>, <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals">HTML text fundamentals</a>, <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creating hyperlinks</a>, y <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">Advanced text formatting</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivos:</th>
-   <td>Probar las habilidades básicas y avanzadas de formateo de texto e hyperlinks, y el conocimiento de los encabezamientos en HTML.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Punto_de_partida">Punto de partida</h2>
-
-<p>Para comenzar esta prueba, deberemos copiar <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/marking-up-a-letter-start/letter-text.txt">el texto que deberemos trabajar</a>, y el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/marking-up-a-letter-start/css.txt">CSS que necesitaremos incluir</a> en nuestro HTML. Crearemos un archivo nuevo <code>.html</code> usando nuestro editor de texto (o alternativamente usaremos otros como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer nuestra prueba).</p>
-
-<h2 id="Resumen_del_proyecto_a_desarrollar">Resumen del proyecto a desarrollar</h2>
-
-<p>En este proyecto tu tarea será publicar una carta que debe estar alojada en la intranet de una universidad. La carta es la respuesta de un compañero investigador a un posible estudiante de postgrado en relación a su deseo de trabajar en la universidad.</p>
-
-<p>Semánticas de bloque/estructurales:</p>
-
-<ul>
- <li>Estructura el documento completo incluyendo los elementos (doctype), {{htmlelement("html")}}, {{htmlelement("head")}} y {{htmlelement("body")}}.</li>
- <li>Incluye los elementos correspondientes de marcado en la carta tales como párrafos y títulos, a excepción de los siguientes. Hay un título principal (la línea que comienza por "Re:") y tres títulos secundarios.</li>
- <li>Las fechas de comienzo de los semestres, las materias y los bailes exóticos deben ser marcados con los correspondientes tipos de lista.</li>
- <li>Colocar las dos direcciones dentro de elementos {{htmlelement("address")}}. Cada línea de la dirección debe comenzar en una línea nueva, pero no en un párrafo nuevo.</li>
-</ul>
-
-<p>Semánticas intralínea:</p>
-
-<ul>
- <li>Los nombres de remitente y destinatario (también "Tel" e "Email") deben ser marcado con importancia (strong).</li>
- <li>Deberás usar los elementos apropiados en las cuatro fechas contenidas en el documento para que puedan ser leidas por los motores de lectura automática.</li>
- <li>La primera dirección y la primera fecha en la carta deben ser asignadas a un atributo de clase llamado "sender-column"; el código CSS lo añadirás posteriormente para que quede bien alineado, como debe ser en un formato de carta clásico.</li>
- <li>Deberás utilizar el elemento apropiado para los cinco acrónimos/abreviaciones contenidos en el texto principal, proporcionándoles las extensiones correspondientes.</li>
- <li>Marca apropiadamente los seis sub/superíndices.</li>
- <li>Los símbolos de los grados, los mayor que y los símbolos de multiplicar deben ser marcados usando las referencias correctas.</li>
- <li>Marca al menos dos palabras en el texto con fuerte importancia/énfasis.</li>
- <li>Hay dos lugares donde deberíamos añadir hyperlinks; añádelos con títulos. Como sitio donde apuntan simplemente usa: http://example.com.</li>
- <li>Marca con el elemento apropiado el lema de la universidad y la cita del autor.</li>
-</ul>
-
-<p>El encabezamiento del documento:</p>
-
-<ul>
- <li>El juego de caracteres del documento deberá ser utf-8 usando una etiqueta meta adecuada.</li>
- <li>El autor de la carta debe estar especificado con la etiqueta meta correspondiente.</li>
- <li>El CSS proporcionado deberá estar incluido dentro de la etiqueta adecuada.</li>
-</ul>
-
-<h2 id="Pistas_y_recomendaciones">Pistas y recomendaciones</h2>
-
-<ul>
- <li>Utiliza el <a href="https://validator.w3.org/">Validador de HTML W3C HTML</a> para validar tu HTML; recibirás puntos de bonificación si se valida.</li>
- <li>No necesitas conocer CSS para hacer este ejercicio; solo debes poner el CSS proporcionado en el elemento HTML adecuado.</li>
-</ul>
-
-<h2 id="Example">Example</h2>
-
-<p>The following screenshot shows an example of what the letter might look like after being marked up.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/12291/letter-screengrab.png" style="border: 1px solid black; display: block; margin: 0px auto;"></p>
-
-<h2 id="Evaluación">Evaluación</h2>
-
-<p>Si estás haciendo esta prueba como parte de un curso organizado, deberías entregar tu trabajo al profesor para que lo corrija. Si estás auto-aprendiendo puedes conseguir la guía de corrección fácilmente pidiendola en el <a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">Hilo del area de aprendizaje</a>, o en el canal IRC de <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Intenta hacerlo primero — no ganarás nada haciendo trampas.</p>
-
-<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Learn/HTML/Introduction_to_HTML")}}</p>
diff --git a/files/es/learn/html/introduccion_a_html/metados_en/index.html b/files/es/learn/html/introduccion_a_html/metados_en/index.html
deleted file mode 100644
index 6fc5f94ab0..0000000000
--- a/files/es/learn/html/introduccion_a_html/metados_en/index.html
+++ /dev/null
@@ -1,299 +0,0 @@
----
-title: ¿Qué hay en la cabecera? Metadatos en HTML
-slug: Learn/HTML/Introduccion_a_HTML/Metados_en
-tags:
-  - Cabecera
-  - CodingScripting
-  - Guía
-  - HTML
-  - Meta
-  - Metadatos
-  - Novato
-  - Principiante
-  - favicon
-  - head
-  - lang
-  - metadata
-translation_of: Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Getting_started", "Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">El elemento {{Glossary("Head", "head")}} de un documento HTML es la parte que no se muestra en el navegador cuando se carga la página. Contiene información como el título ({{htmlelement("title")}}) de la página, enlaces al {{Glossary("CSS")}} (si quieres aplicar estilo a tu contenido HTML con CSS), enlaces para personalizar <code>favicon</code>, y otros metadatos (datos sobre el HTML, como quién lo escribió y palabras claves importantes que describen el documento). En este artículo abarcaremos todo esto y más, para darte bases sólidas en el manejo del marcado y otro código que debería estar presente en tu cabecera.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Estar familiarizado con el HTML básico, que se expone en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con el HTML")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender acerca de la cabecera HTML {{Glossary("Head", "head")}}, cuál es su propósito, los elementos más importantes que puede contener, y qué efecto puede tener sobre el documento HTML.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_hay_en_la_cabecera_HTML">¿Qué hay en la cabecera HTML?</h2>
-
-<p>Vamos a revisar el {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started#Anatomy_of_an_HTML_document", "documento HTML que se revisó en el artículo anterior")}}:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Mi página de prueba&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;p&gt;Esta es mi página&lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>La cabecera HTML es el contenido del elemento {{htmlelement("head")}} — a diferencia del contenido del elemento {{htmlelement("body")}} (que sí se muestra en la página cuando se carga en el navegador), el contenido de la cabecera no se muestra en la página. Por el contrario, la función de la cabecera es contener los {{Glossary("Metadata", "metadatos")}} del documento. En el ejemplo anterior, la cabecera es bastante reducida:</p>
-
-<pre class="brush: html notranslate">&lt;head&gt;
-  &lt;meta charset="utf-8"&gt;
-  &lt;title&gt;Mi página de prueba&lt;/title&gt;
-&lt;/head&gt; </pre>
-
-<p>En páginas más grandes, sin embargo, la cabecera puede llegar a contener bastantes elementos. Prueba a ir a algunos de tus sitios web favoritos y comprueba el contenido de la cabecera usando las {{web.link("/es/docs/Learn/Common_questions/What_are_browser_developer_tools", "herramientas para el desarrollador")}}. Nuestro objetivo aquí no es mostrarte cómo usar todo lo que puedes incluir en la cabecera, sino enseñarte cómo usar los elementos principales que vas a incluir en la cabecera y que te familiarices con ellos. Empecemos.</p>
-
-<h2 id="Añadir_un_título">Añadir un título</h2>
-
-<p>Ya hemos visto el elemento {{htmlelement("title")}} en acción — se puede usar para poner un título al documento. Sin embargo, esto se puede confundir con el elemento {{htmlelement("h1")}}, que se utiliza para poner un encabezado de nivel superior al cuerpo de tu contenido — esto también se conoce como el título de la página. ¡Pero son cosas diferentes!</p>
-
-<ul>
- <li>El elemento {{htmlelement("h1")}} aparece en la página cuando se carga en el navegador — en general debería haber uno solo por página, para especificar el título del contenido de tu página (el título de tu historia, el título de la noticia, o de lo que sea apropiado según el uso que le des).</li>
- <li>El elemento {{htmlelement("title")}} es un metadato que representa el título de todo el documento HTML (no del contenido del documento).</li>
-</ul>
-
-<h3 id="Aprendizaje_activo_Análisis_de_un_ejemplo_sencillo">Aprendizaje activo: Análisis de un ejemplo sencillo</h3>
-
-<ol>
- <li>Para comenzar este aprendizaje activo, te proponemos ir a nuestro repositorio de GitHub y descargues una copia de nuestra página <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/title-example.html">title-example.html</a>. Lo puedes hacer de las siguientes maneras:
-
-  <ol>
-   <li>Copia y pega el código de la página en un archivo de texto nuevo en tu editor de código, luego guárdalo en un lugar conveniente.</li>
-   <li>Presiona el botón "Raw" en la página de GitHub, lo cual hace que aparezca el código sin procesar (posiblemente en una nueva pestaña del navegador). A continuación, en el menú de tu navegador elige <em>Archivo → Guardar página como...</em> y selecciona un lugar adecuado para guardar el archivo.</li>
-  </ol>
- </li>
- <li>Ahora abre el archivo en tu navegador. Deberías ver algo como esto:
-  <p><img alt="Una sencilla página web con el título configurado a &lt;title> element, y el &lt;h1> configurado a &lt;h1> element." src="https://mdn.mozillademos.org/files/12323/title-example.png" style="display: block; margin: 0 auto;">Ahora debería quedar claro dónde aparece el contenido de <code>&lt;h1&gt;</code> y dónde aparece el contenido de <code>&lt;title&gt;</code>.</p>
- </li>
- <li>También podrías probar a abrir el código en tu editor de código, editar el contenido de estos elementos y luego actualizar la página en tu navegador. Juega un poco con ello.</li>
-</ol>
-
-<p>El contenido del elemento <code>&lt;title&gt;</code> también se usa de otras formas. Por ejemplo, si intentas marcar la página como favorita (<strong>Marcadores → Marcar esta página</strong>, o el icono en forma de estrella de Firefox), verás que el nombre que se sugiere para el marcado es el contenido del elemento <code>&lt;title&gt;</code>.</p>
-
-<p><img alt="Se está marcando una página web en Firefox; el nombre del marcador se ha completado automáticamente con el contenido del elemento &lt;title>" src="https://mdn.mozillademos.org/files/12337/bookmark-example.png" style="display: block; margin: 0 auto;"></p>
-
-<p>El contenido de <code>&lt;title&gt;</code> también se usa en el resultado de las búsquedas, como verás a continuación.</p>
-
-<h2 id="Metadatos_el_elemento_&lt;meta>">Metadatos: el elemento &lt;meta&gt;</h2>
-
-<p>Los metadatos son datos que describen datos, y HTML tiene una forma «oficial» de introducir metadatos en un documento — el elemento {{htmlelement("meta")}}. Por supuesto, el resto de los elementos de los que hablaremos en este artículo también se podrían considerar metadatos. Hay muchos diferentes tipos de elementos <code>&lt;meta&gt;</code> que se pueden incluir en el &lt;head&gt; de tu página, pero no vamos a intentar explicarlos todos en esta etapa porque resultaría demasiado confuso. En lugar de ello vamos a explicar algunas cuestiones con las que seguramente te vas a encontrar, solo para que te hagas una idea.</p>
-
-<h3 id="La_codificación_de_caracteres_de_tu_documento">La codificación de caracteres de tu documento</h3>
-
-<p>El ejemplo que vimos arriba incluía esta línea:</p>
-
-<pre class="brush: html notranslate">&lt;meta charset="utf-8"&gt;</pre>
-
-<p>Este elemento simplemente especifica la codificación de caracteres del documento — es decir, el conjunto de caracteres que el documento puede usar. <code>utf-8</code> es un conjunto de caracteres universal que incluye casi todos los caracteres de casi cualquier idioma humano. Esto significa que tu página web podrá gestionar la visualización de cualquier idioma; por lo tanto, resulta una buena idea configurarlo en cada página web que crees. Por ejemplo, tu página podría gestionar inglés y japonés sin problemas:</p>
-
-<p><img alt="Una página web que contiene caracteres en inglés y japonés, con la codificación de caracteres establecida en universal o utf-8. Ambos idiomas se muestran bien." src=" https://mdn.mozillademos.org/files/12343/correct-encoding.png" style="display: block; margin: 0 auto;">Si configuras tu codificación de caracteres en <code>ISO-8859-1</code>, por ejemplo (el juego de caracteres para el alfabeto latino), la representación de tu página puede aparecer desordenada:</p>
-
-<p><img alt="una página web que contiene caracteres en inglés y japonés, con la codificación de caracteres configurada en latín. Los caracteres japoneses no se muestran correctamente" src="https://mdn.mozillademos.org/files/12341/bad-encoding.png" style="display: block; height: 365px; margin: 0px auto; width: 604px;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Algunos navegadores (Chrome, por ejemplo) automáticamente arreglan la codificación de caracteres incorrecta, de modo que según el navegador que uses, puede que no te topes con este problema. Aun así, deberías incluir una codificación de caracteres <code>utf-8</code> en tu página web para evitar que se presenten potenciales problemas con otros navegadores.</p>
-</div>
-
-<h3 id="Aprendizaje_activo_Experimenta_con_la_codificación_de_caracteres">Aprendizaje activo: Experimenta con la codificación de caracteres</h3>
-
-<p>Para probar esto, vuelve a visitar la plantilla HTML simple que obtuviste en la sección anterior sobre <code>&lt;title&gt;</code> (la página <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/title-example.html">title-example.html</a>) e intenta cambiar el valor de la propiedad <code>meta charset</code> por <code>ISO-8859-1</code> y añade el japonés a tu página. Este es el código que usamos:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Ejemplo en japonés: ご飯が熱い。&lt;/p&gt;</pre>
-
-<h3 id="Añadir_un_autor_y_descripción">Añadir un autor y descripción</h3>
-
-<p>Muchos elementos <code>&lt;meta&gt;</code> incluyen atributos <code>name</code> y <code>content</code>:</p>
-
-<ul>
- <li><code>name</code> especifica el tipo de metadato del que se trata; es decir, qué tipo de información contiene.</li>
- <li><code>content</code> especifica el contenido del metadato en sí.</li>
-</ul>
-
-<p>Dos de esos metadatos que resultan útiles de incluir en tu página definen al autor de la página y proporcionan una descripción concisa de la página. Veamos un ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;meta name="author" content="Chris Mills"&gt;
-&lt;meta name="description" content="El área de aprendizaje de MDN pretende
-proporcionar a los recién llegados a la web todo lo que deben
-saber para empezar a desarrollar páginas web y aplicaciones web."&gt;</pre>
-
-<p>Especificar un autor resulta ventajoso por diversos motivos: es útil saber quién escribió la página para poder ponerte en contacto con el autor si tienes preguntas sobre el contenido. Algunos sistemas de gestión de contenido tienen herramientas para extraer automáticamente la información del autor de la página y ponerla a disposición para tales fines.</p>
-
-<p>Especificar una descripción que incluya palabras clave relacionadas con el contenido de tu página resulta útil porque tiene el potencial de hacer que la página aparezca más arriba en las búsquedas relevantes que efectúan los motores de búsqueda (tales actividades se denominan optimizaciones del motor de búsqueda ({{web.link("/es/docs/Glossary/SEO", "Optimización de motores de búsqueda")}}) o {{Glossary("SEO")}}.)</p>
-
-<h3 id="Aprendizaje_activo_El_uso_de_la_descripción_en_los_motores_de_búsqueda">Aprendizaje activo: El uso de la descripción en los motores de búsqueda</h3>
-
-<p>La descripción también se usa en las páginas de resultados del motor de búsqueda. Repasemos un ejercicio para explorar esto:</p>
-
-<ol>
- <li>Ve a la página de inicio de <a href="https://developer.mozilla.org/es/">Mozilla Developer Network</a>.</li>
- <li>Observa el código fuente de la página (<kbd>Ctrl</kbd>+clic o clic con el botón derecho en la página y selecciona la opción del menú <strong>Ver código fuente de la página</strong>).</li>
- <li>Encuentra la etiqueta del metadato <strong>description</strong>. Se verá más o menos así (aunque puede cambiar con el tiempo):
-  <pre class="brush: html notranslate">&lt;meta name="description" content="The Mozilla Developer
-  Network (MDN) proporciona información sobre tecnologías
-  de código abierto que incluyen HTML, CSS y APIs tanto para sitios web como para aplicaciones HTML5.
-  También documenta productos Mozilla como el sistema operativo Firefox."&gt;</pre>
- </li>
- <li>Ahora busca "Mozilla Developer Network" en tu motor de búsqueda favorito (nosotros hemos utilizado Google). Observarás que efectivamente merece la pena que tener el contenido de la descripción <code>&lt;meta&gt;</code> y el elemento <code>&lt;title&gt;</code> que se utiliza en la búsqueda.
-  <p><img alt='Resultado de búsqueda en Yahoo para "Mozilla Developer Network"' src="https://mdn.mozillademos.org/files/16074/mdn-search-result.png" style="border-style: solid; border-width: 1px; display: block; height: 982px; margin: 0px auto; width: 1302px;"></p>
- </li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: En Google verás algunas subpáginas relevantes de MDN enumeradas debajo del enlace principal a la página principal de MDN (se trata de los llamados <strong>sitelinks</strong> y se pueden configurar con las <a href="http://www.google.com/webmasters/tools/">Herramientas de administrador de Google</a>), una forma de mejorar los resultados para tu sitio con el motor de búsqueda de Google.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Muchas características <code>&lt;meta&gt;</code> ya no se usan. Por ejemplo, los motores de búsqueda ignoran el elemento <code>&lt;meta&gt;</code> (<code>&lt;meta name="keywords" content="pon, tus, palabras clave, aquí"&gt;</code>), que se supone que facilita palabras clave para motores de búsqueda de forma que se determine la relevancia de esa página según diferentes términos de búsqueda, porque los <strong>spammers</strong> rellenaban la lista de palabras clave con cientos de palabras clave que sesgaban los resultados.</p>
-</div>
-
-<h3 id="Otros_tipos_de_metadatos">Otros tipos de metadatos</h3>
-
-<p>Al navegar por la web también puedes encontrar otros tipos de metadatos. Muchas de las funciones que verás en los sitios web son creaciones propietarias diseñadas para proporcionar a ciertos sitios (como los sitios de redes sociales) información específica que puedan usar.</p>
-
-<p>Por ejemplo, <a href="http://ogp.me/">Open Graph Data</a> es un protocolo de metadatos que Facebook inventó para proveer metadatos más ricos para los sitios web. En las fuentes de código de MDN, encontrarás esto:</p>
-
-<pre class="brush: html notranslate">&lt;meta property="og:image" content="https://developer.cdn.mozilla.net/static/img/opengraph-logo.dc4e08e2f6af.png"&gt;
-&lt;meta property="og:description" content="The Mozilla Developer Network (MDN) proporciona información
-sobre tecnologías Open Web, incluidas HTML, CSS y APIs para ambos sitios web
-y aplicaciones HTML5. También documenta productos Mozilla, como el sistema operativo Firefox."&gt;
-&lt;meta property="og:title" content="Mozilla Developer Network"&gt;</pre>
-
-<p>Un efecto de esto es que cuando desde Facebook enlazas a un MDN, el enlace aparece con una imagen y una descripción, lo que resulta en una experiencia más enriquecedora para los usuarios.</p>
-
-<p><img alt="Datos abiertos del protocolo de gráficos de la página de inicio de MDN como se muestra en Facebook, mostrando una imagen, título y descripción." src="https://mdn.mozillademos.org/files/12349/facebook-output.png" style="display: block; margin: 0 auto;"></p>
-
-<p>Twitter también tiene sus metadatos propios, las <a href="https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards">Twitter Cards</a>, que tienen un efecto similar cuando la URL del sitio se muestra en twitter.com. Por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;meta name="twitter:title" content="Mozilla Developer Network"&gt;</pre>
-
-<h2 id="Agregar_iconos_personalizados_a_tu_sitio">Agregar iconos personalizados a tu sitio</h2>
-
-<p>Para enriquecer un poco más el diseño de tu sitio puedes añadir en tus metadatos referencias a iconos personalizados, que se mostrarán en determinados contextos. El más común de ellos es el <strong>favicon</strong> (abreviatura de <strong><em>favorite icon</em></strong> —<strong>icono </strong>«<strong>favorito</strong>», referido al uso que se le da en las listas de «favoritos» o de marcadores («<strong>bookmarks</strong>»).</p>
-
-<p>El humilde <code>favicon</code> ha existido durante muchos años. Es el primer icono de este tipo: un icono cuadrado de 16 píxeles que se utiliza en varios lugares. Es posible que veas (según el navegador) <code>favicon</code>s que se muestran en la pestaña del navegador que contiene cada página abierta y junto a las páginas marcadas en el panel de marcadores.</p>
-
-<p>Para añadir un <code>favicon</code> a tu página:</p>
-
-<ol>
- <li>Guárdalo en el mismo directorio que la página <strong>index</strong> de tu sitio, en formato <code>.ico</code> (la mayoría de los buscadores admiten <code>favicon</code> en los formatos más comunes como <code>.gif</code> o <code>.png</code>, pero usar el formato <em>ICO</em> garantiza que funcionará hasta en Internet Explorer 6.)</li>
- <li>Añade la siguiente línea de referencia en el {{HTMLElement("head")}} de tu HTML:
-  <pre class="brush: html notranslate">&lt;link rel="shortcut icon" href="favicon.ico" type="image/x-icon"&gt;</pre>
- </li>
-</ol>
-
-<p>Los navegadores modernos usan <code>favicon</code>s en diversos lugares, como en la etiqueta de la página que está abierta y en el panel de favoritos cuando la añades a tu lista de páginas favoritas:</p>
-
-<p><img alt="El panel de marcadores de Firefox, que muestra un ejemplo marcado con un favicon junto a él." src="https://mdn.mozillademos.org/files/12351/bookmark-favicon.png" style="display: block; margin: 0 auto;"></p>
-
-<p>Hoy día hay un montón de otros tipos de iconos a tener presentes. Por ejemplo, los encontrarás en el código fuente de la página de inicio de MDN:</p>
-
-<pre class="brush: html notranslate">&lt;!-- iPad de tercera generación con pantalla de alta resolución: --&gt;
-&lt;link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://developer.cdn.mozilla.net/static/img/favicon144.a6e4162070f4.png"&gt;
-&lt;!-- iPhone con pantalla de alta resolución: --&gt;
-&lt;link rel="apple-touch-icon-precomposed" sizes="114x114" href="https://developer.cdn.mozilla.net/static/img/favicon114.0e9fabd44f85.png"&gt;
-&lt;!-- iPad de primera y segunda generación: --&gt;
-&lt;link rel="apple-touch-icon-precomposed" sizes="72x72" href="https://developer.cdn.mozilla.net/static/img/favicon72.8ff9d87c82a0.png"&gt;
-&lt;!-- Dispositivos iPhone sin pantalla Retina, iPod Touch y Android 2.1+: --&gt;
-&lt;link rel="apple-touch-icon-precomposed" href="https://developer.cdn.mozilla.net/static/img/favicon57.a2490b9a2d76.png"&gt;
-&lt;!-- favicon básico --&gt;
-&lt;link rel="shortcut icon" href="https://developer.cdn.mozilla.net/static/img/favicon32.e02854fdcf73.png"&gt;</pre>
-
-<p>Los comentarios explican para qué se usa cada icono (estos elementos abarcan situaciones como aportar un buen icono de alta resolución para usarlo cuando la página web se guarda en la página de inicio de un iPad).</p>
-
-<p>No te preocupes demasiado sobre la implementación de todos estos tipos de iconos por el momento; se trata de una característica bastante avanzada y no se espera que tengas conocimientos de ello para avanzar en el curso. El propósito principal aquí es darte a conocer estos elementos por si te los encuentras mientras examinas el código fuente de otros sitios web.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si tu sitio web utiliza una política de seguridad de contenido (<em>content security policy o CSP</em>) para mejorar la seguridad, la política afecta al <code>favicon</code>. Si te encuentras con problemas como que el <code>favicon</code> no se carga, comprueba que la respuesta a {{HTTPHeader("Content-Security-Policy")}} del <code>header</code> <a href="">Content-Security-Policy</a> para la <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/img-src"> directriz <code>img-src</code></a> en la cabecera no impide el acceso a este.</p>
-</div>
-
-<h2 id="Aplicar_CSS_y_JavaScript_a_HTML">Aplicar CSS y JavaScript a HTML</h2>
-
-<p>Prácticamente todos los sitios web usan {{Glossary("CSS")}} para darles un buen aspecto y {{Glossary("JavaScript")}} para añadir funcionalidades interactivas, como reproductores de vídeo, mapas, juegos y demás. La manera más habitual de añadir CSS y JavaScript a una página web es con los elementos <code>&lt;link&gt;</code> y el elemento <code>&lt;script&gt;</code>, respectivamente.</p>
-
-<ul>
- <li>
-  <p>El elemento {{HTMLElement("link")}} siempre debe ir dentro del {{HTMLElement("header")}} de tu documento. Este toma dos atributos, <code>rel="stylesheet"</code>, que indica que es la hoja de estilo del documento, y <code>href</code>, que contiene la ruta al archivo de la hoja de estilo:</p>
-
-  <pre class="brush: html notranslate">&lt;link rel="stylesheet" href="my-css-file.css"&gt;</pre>
- </li>
- <li>
-  <p>El elemento <code>&lt;script&gt;</code> también debería ir en el <code>head</code>, y debería incluir un atributo <code>src</code> con la ruta al JavaScript que quieres cargar, y <code>defer</code>, que básicamente le dice al navegador que cargue el JavaScript al mismo tiempo que el HTML de la página. Esto es útil porque hace que todo el HTML se cargue antes de ejecutar el JavaScript, para que no haya errores porque el JavaScript ha intentado acceder a un elemento HTML que todavía no existe. De hecho hay múltiples formas de gestionar la carga del JavaScript en una página, pero esta es «a prueba de bombas» para los navegadores modernos (para el resto de las formas, lee el artículo {{web.link("/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript#Script_loading_strategies", "Estrategias de carga de scripts")}}).</p>
-
-  <pre class="brush: html notranslate">&lt;script src="my-js-file.js"&gt;&lt;/script&gt;</pre>
-
-  <div class="blockIndicator note">
-  <p><strong>Nota</strong>: El elemento <code>&lt;script&gt;</code> puede parecer un elemento vacío pero no lo es, y por lo tanto necesita una etiqueta de cierre. En vez de apuntar a un archivo de <code>script</code> externo, también puedes colocar tu código dentro del elemento <code>&lt;script&gt;</code>.</p>
-  </div>
- </li>
-</ul>
-
-<h3 id="Aprendizaje_activo_aplicar_CSS_y_JavaScript_a_una_página">Aprendizaje activo: aplicar CSS y JavaScript a una página</h3>
-
-<ol>
- <li>Para iniciar este aprendizaje activo, haz una copia de nuestros archivos <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/meta-example.html">meta-example.html</a>, <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/script.js">script.js</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/style.css">style.css</a>, y guárdalos en un mismo directorio de tu ordenador. Asegúrate de que se guardan con los nombres y extensiones correctas.</li>
- <li>Abre el archivo HTML tanto en tu navegador como en tu editor de texto.</li>
- <li>Sigue la información facilitada anteriormente y añade los elementos <code>&lt;link&gt;</code> y <code>&lt;script&gt;</code> a tu HTML para aplicarle CSS y JavaScript.</li>
-</ol>
-
-<p>Si lo has hecho correctamente, al guardar tu HTML y actualizar tu navegador, deberías poder ver que las cosas han cambiado:</p>
-
-<p><img alt="Ejemplo que muestra una página con CSS y JavaScript aplicados. El CSS ha hecho que la página se vuelva verde, mientras que JavaScript ha agregado una lista dinámica a la página" src="https://mdn.mozillademos.org/files/12359/js-and-css.png" style="display: block; margin: 0 auto;"></p>
-
-<ul>
- <li>El JavaScript ha añadido una lista vacía a la página. Ahora, cuando haces clic en cualquier sitio de la lista, aparece un cuadro de diálogo que te solicita que introduzcas el texto para un nuevo elemento de la lista. Cuando pulsas el botón OK, se añade a la lista el elemento con el texto nuevo. Cuando haces clic a un elemento de la lista aparece un cuadro de diálogo que te permite cambiar el texto del elemento.</li>
- <li>El CSS ha pintado el fondo de verde y ha agrandado el texto. También ha aplicado estilo a algún contenido que el JavaScript ha añadido a la página (la barra roja con el borde negro es el estilo que el CSS ha aplicado a la lista generada con JavaScript).</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Si te encallas en este ejercicio y no logras ejecutar los archivos CSS/JS, comprueba tu página de ejemplo <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/css-and-js.html">css-and-js.html</a>.</p>
-</div>
-
-<h2 id="Establecer_el_idioma_principal_del_documento">Establecer el idioma principal del documento</h2>
-
-<p>Por último, merece la pena mencionar que puedes (y realmente deberías) especificar el idioma de tu página. Esto se puede hacer añadiendo el atributo {{web.link("/es/docs/Web/HTML/Global_attributes/lang", "lang")}} a la etiqueta de apertura del HTML (como se ve en el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/meta-example.html">meta-example.html</a> y se muestra abajo).</p>
-
-<pre class="brush: html notranslate">&lt;html lang="es-MX"&gt;</pre>
-
-<p>Esto resulta útil en muchos sentidos. Los motores de búsqueda indizarán tu documento HTML de modo más efectivo si estableces el idioma (permitiendo, por ejemplo, que aparezca correctamente en los resultados del idioma especificado), y resulta útil para que las personas con discapacidad visual que utilizan los lectores de pantalla (por ejemplo, la palabra «six» existe tanto en francés como en inglés, pero su pronunciación es diferente).</p>
-
-<p>También puedes establecer que las subsecciones de tu documento se reconozcan en diferentes idiomas. Por ejemplo, podemos establecer que nuestra sección de japonés se reconozca como japonés, de la siguiente manera:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Ejemplo Japonés: &lt;span lang="ja"&gt;ご飯が熱い。&lt;/span&gt;.&lt;/p&gt;</pre>
-
-<p>El estándar {{interwiki("wikipedia", "ISO_639-1")}} define estos códigos. Puedes encontrar más información sobre ello en <a href="https://www.w3.org/International/articles/language-tags/">Etiquetas de idioma en HTML y XML</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Esto marca el final de nuestra guía rápida del {{Glossary("head")}} de HTML — aún hay muchas más cosas que puedes hacer aquí, pero una guía exhaustiva puede ser aburrida y confusa a estas alturas, ¡y nosotros queremos darte una idea de las cuestiones más comunes con las que te encontrarás aquí por ahora! En el siguiente artículo veremos los fundamentos de texto de HTML.</p>
-
-<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Getting_started", "Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Creando hipervínculos")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
-</ul>
diff --git a/files/es/learn/html/introduccion_a_html/prueba_tus_habilidades_colon__enlaces/index.html b/files/es/learn/html/introduccion_a_html/prueba_tus_habilidades_colon__enlaces/index.html
deleted file mode 100644
index 0e8dc1bfaf..0000000000
--- a/files/es/learn/html/introduccion_a_html/prueba_tus_habilidades_colon__enlaces/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: 'Prueba tus habilidades: Enlaces'
-slug: 'Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces'
-translation_of: 'Learn/HTML/Introduction_to_HTML/Test_your_skills:_Links'
----
-<div>{{learnsidebar}}</div>
-
-<p>El objetivo de esta pueba de habilidad es evaluar si has comprendido nuestro artículo <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creando hipervínculos</a>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes intentar resolver esta prueba en los editores interactivos más abajo, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a> para trabajar en las tareas.<br>
- <br>
- Si te atascas, pide ayuda — mira la sección {{anch("Evaluación o ayuda adicional")}} al final de esta página.</p>
-</div>
-
-<h2 id="Enlaces_1">Enlaces 1</h2>
-
-<p>En esta tarea necesitamos tu ayuda para completar los enlaces en nuestra página de información sobre Ballenas:</p>
-
-<ul>
- <li>El primer enlace debería estar vinculado a una página llamada <code>whales.html</code>, que está en el mismo directorio que la página actual.</li>
- <li>También queremos agregarle un cuadro de información ("tooltip") cuando pase el puntero sobre el enlace, que le diga al usuario que la página incluye informacion sobre las Ballenas azules y las Ballenas blancas.</li>
- <li>El segundo enlace deberá convertirse en un vínculo que abra un correo electrónico en la aplicación de correo por defecto del usuario, con el destinatario "whales@example.com".</li>
- <li>Conseguirás un punto de bonificación si tambien configuras que la línea del asunto del correo electrónico tenga como texto predeterminado "Preguntas sobre Ballenas".</li>
-</ul>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> El primer enlace en el ejemplo tiene el atributo <code>target="_blank"</code> , así que cuando haces click en él, abre la página en una pestaña nueva. Esto no es estrictamente una buena práctica, pero lo hemos hecho aquí para que la página no se abra en el <code>&lt;iframe&gt;</code> incrustado, ¡eliminando el código de ejemplo en el proceso!</p>
-</div>
-
-<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/links/links1.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/links/links1-download.html">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Enlaces_2">Enlaces 2</h2>
-
-<p>En esta tarea queremos que completes los cuatro enlaces para que se dirijan al lugar apropiado:</p>
-
-<ul>
- <li>El primer enlace debería vincular a una imagen llamada <code>blue-whale.jpg</code>, que se encuentra en una carpeta llamada <code>blue</code> dentro de la carpeta actual.</li>
- <li>El segundo enlace debería vincular a una imagen llamada <code>narwhal.jpg</code>, que se encuentra en una carpeta llamada <code>narwhal</code>, que se encuentra en un nivel de carpetas sobre la carpeta actual.</li>
- <li>El tercer enlace deberia vincular al sitio de búsqueda de imágenes de Google del Reino Unido. La URL base es <code>https://www.google.co.uk</code>, y la búsqueda de imágenes se ubica en un subdirectorio llamado <code>imghp</code>.</li>
- <li>El cuarto enlace debería vincular al párrafo más al final de la página actual. Que tiene la ID <code>bottom</code>.</li>
-</ul>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> Los primeros tres enlaces en el ejemplo tienen el atributo <code>target="_blank"</code> especificado en ellos, abren la página enlazada en una nueva pestaña del navegador. Esto no es estrictamente una buena práctica, pero hemos hecho esto aquí para que las páginas no se abran dentro del <code>&lt;iframe&gt;</code> incrustado, ¡eliminando el código de ejemplo en el proceso!</p>
-</div>
-
-<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/links/links2.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/links/links2-download.html">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Enlaces_3">Enlaces 3</h2>
-
-<p>Los siguientes enlaces dirigen a una página informativa acerca de los Narvales, una dirección de correo electrónico de soporte, y un documento PDF cuyo tamaño es 4MB. En esta tarea queremos que:</p>
-
-<ul>
- <li>Tomes los párrafos existentes con enlaces pobremente escritos, y los reescribas para que tengan un buen texto de enlace.</li>
- <li>Agregues una advertencia a cualquier enlace que necesite una advertencia.</li>
-</ul>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> Los primeros tres enlaces en el ejemplo tienen el atributo <code>target="_blank"</code> especificado en ellos, abren la página enlazada en una nueva pestaña del navegador. Esto no es estrictamente una buena práctica, pero hemos hecho esto aquí para que las páginas no se abran dentro del <code>&lt;iframe&gt;</code> incrustado, ¡eliminando el código de ejemplo en el proceso!</p>
-</div>
-
-<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/links/links3.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/links/links3-download.html">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
-
-<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
-
-<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
-
-<ol>
- <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
- <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
-  <ul>
-   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de texto básico HTML 1".</li>
-   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
-   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
-   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
-  </ul>
- </li>
-</ol>
diff --git a/files/es/learn/html/introduccion_a_html/prueba_tus_habilidades_colon__texto_básico_html/index.html b/files/es/learn/html/introduccion_a_html/prueba_tus_habilidades_colon__texto_básico_html/index.html
deleted file mode 100644
index f35a083987..0000000000
--- a/files/es/learn/html/introduccion_a_html/prueba_tus_habilidades_colon__texto_básico_html/index.html
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: 'Prueba tus habilidades: Texto básico HTML'
-slug: 'Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Texto_básico_HTML'
-tags:
-  - Aprendizaje
-  - HTML
-  - Principiante
-  - Prueba tus habilidades
-  - Texto
-translation_of: 'Learn/HTML/Introduction_to_HTML/Test_your_skills:_HTML_text_basics'
----
-<div>{{learnsidebar}}</div>
-
-<p>El objetivo de esta prueba de habilidad es evaluar si has comprendido el artículo <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/texto">Fundamentos de texto en HTML</a>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> Puedes intentar resolverlo en los editores interactivos de más abajo, sin embargo puede ser muy úytil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a> para trabajar en las tareas.<br>
- <br>
- Si te atascas, entonces pídenos ayuda — busca en la sección {{anch("Assessment or further help")}} al final de esta página.</p>
-</div>
-
-<h2 id="Texto_básico_HTML_1">Texto básico HTML 1</h2>
-
-<p>En esta tarea queremos que etiquetes el HTML entregado utilizando elementos semánticos de encabezado y párrafo. Intenta actualizando el código más abajo para recrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/basic-text/basic-text1.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/basic-text/basic-text1-download.html">Descarga el punto de inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Texto_básico_HTML_2">Texto básico HTML 2</h2>
-
-<p>En esta tarea necesitamos que cambies la primera lista no marcada en una lista no ordenada, y la segunda en una lista ordenada.</p>
-
-<p>Intenta actualizando el código más abajo para recrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/basic-text/basic-text2.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/basic-text/basic-text2-download.html">Descarga el punto de inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Texto_básico_HTML_3">Texto básico HTML 3</h2>
-
-<p>En esta tarea se te entrega un párrafo, y tu objetivo es usar algunos elementos en línea para marcar algunas palabras con importancia, y otras con énfasis</p>
-
-<p>Intenta actualizando el código más abajo para recrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/basic-text/basic-text3.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/basic-text/basic-text3-download.html">Descarga el punto de inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
-
-<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
-
-<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
-
-<ol>
- <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
- <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a class="external external-icon" href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
-  <ul>
-   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de texto básico HTML 1".</li>
-   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
-   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
-   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
-  </ul>
- </li>
-</ol>
diff --git a/files/es/learn/html/introduccion_a_html/test_your_skills_colon__advanced_html_text/index.html b/files/es/learn/html/introduccion_a_html/test_your_skills_colon__advanced_html_text/index.html
deleted file mode 100644
index f29638eb81..0000000000
--- a/files/es/learn/html/introduccion_a_html/test_your_skills_colon__advanced_html_text/index.html
+++ /dev/null
@@ -1,67 +0,0 @@
----
-title: 'Pon a prueba tus habilidades: texto HTML avanzado'
-slug: 'Learn/HTML/Introduccion_a_HTML/Test_your_skills:_Advanced_HTML_text'
-translation_of: 'Learn/HTML/Introduction_to_HTML/Test_your_skills:_Advanced_HTML_text'
----
-<div>{{learnsidebar}}</div>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">El objetivo de esta prueba de habilidad es evaluar si ha entendido nuestras </span></span>  <u><a href="/es/docs//en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">formato de texto avanzado</a></u> articulo.</p>
-
-<div class="blockIndicator note">
-<p><strong>NOTA</strong>:<span class="tlid-translation translation" lang="es"><span title="">Puede probar soluciones en los editores interactivos a continuación;</span> <span title="">sin embargo, puede resultar útil descargar el código y utilizar una herramienta en línea como</span></span>  <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch </a><span class="tlid-translation translation" lang="es"><span title="">trabajar en las tareas.</span></span><br>
- <br>
- <span class="tlid-translation translation" lang="es"><span title="">Si se atasca, pídanos ayuda; consulte la</span></span> {{anch("Assessment or further help")}} section at the bottom of this page.</p>
-</div>
-
-<h2 id="Texto_HTML_avanzado_1"><span class="tlid-translation translation" lang="es"><span title="">Texto HTML avanzado 1</span></span></h2>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">En esta tarea, queremos que convierta los animales proporcionados y sus definiciones en una lista de descripción.</span><br>
- <br>
- <span title="">Intente actualizar el código en vivo a continuación para recrear el ejemplo terminado:</span></span></p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/advanced-text/advanced-text1.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="/es/docs/https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/advanced-text/advanced-text1-download.html">Descarga el puno de partida para esta tarea</a> to work in your own editor or in an online editor.</p>
-</div>
-
-<h2 id="Texto_HTML_avanzado_2"><span class="tlid-translation translation" lang="es"><span title="">Texto HTML avanzado 2</span></span></h2>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">En esta tarea, queremos que agregue algo de semántica al HTML proporcionado de la siguiente manera:</span></span></p>
-
-<ul>
- <li><span class="tlid-translation translation" lang="es"><span title="">Convierta el segundo párrafo en una cita a nivel de bloque e indique semánticamente que la cita se toma de</span></span> <a href="/en-US/docs/Learn/Accessibility">Accesibilidad</a>.</li>
- <li><span class="tlid-translation translation" lang="es"><span title="">Marque semánticamente "HTML" y "CSS" como acrónimos, proporcionando expansiones como información sobre herramientas.</span></span></li>
- <li><span class="tlid-translation translation" lang="es"><span title="">Asocia semánticamente fechas legibles por máquina con las fechas en el texto.</span></span></li>
- <li><span class="tlid-translation translation" lang="es"><span title="">Utilice subíndice y superíndice para proporcionar la semántica correcta para las fórmulas químicas y fechas, y hacer que se muestren correctamente.</span></span></li>
-</ul>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Intente actualizar el código en vivo a continuación para recrear el ejemplo terminado:</span></span></p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/advanced-text/advanced-text2.html", '100%', 700)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="/es/docs/https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/advanced-text/advanced-text2-download.html">Descarga el punto de partida para esta tarea </a><span class="tlid-translation translation" lang="es"><span title="">para trabajar en su propio editor o en un editor en línea.</span></span></p>
-</div>
-
-<h2 id="Evaluación_o_ayuda_adicional"><span class="tlid-translation translation" lang="es"><span title="">Evaluación o ayuda adicional</span></span></h2>
-
-<div class="text-wrap tlid-copy-target">
-<div class="result-shield-container tlid-copy-target"><span class="tlid-translation translation" lang="es"><span title="">Puede practicar estos ejemplos en los editores interactivos anteriores.</span><br>
-<br>
-<span title="">Si desea que se evalúe su trabajo, o está atascado y desea pedir ayuda:</span></span></div>
-
-<div class="result-shield-container tlid-copy-target"></div>
-</div>
-
-<ol>
- <li><span class="tlid-translation translation" lang="es"><span title="">Pon tu trabajo en un editor que se pueda compartir en línea, como</span></span>  <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a>. <span class="tlid-translation translation" lang="es"><span title="">Puede escribir el código usted mismo o utilizar los archivos de punto de inicio vinculados en las secciones anteriores.</span></span></li>
- <li><span class="tlid-translation translation" lang="es"><span title="">Escriba una publicación solicitando evaluación y / o ayuda en el</span></span>  <a class="external external-icon" href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. <span class="tlid-translation translation" lang="es"><span title="">Tu publicación debe incluir:</span></span>
-  <ul>
-   <li><span class="tlid-translation translation" lang="es"><span title="">Un título descriptivo como "Se busca evaluación para la prueba de habilidad de texto avanzado HTML 1".</span></span></li>
-   <li><span class="tlid-translation translation" lang="es"><span title="">Detalles de lo que ya ha probado y lo que le gustaría que hiciéramos, p. Ej.</span> <span title="">si está atascado y necesita ayuda, o quiere una evaluación.</span></span></li>
-   <li><span class="tlid-translation translation" lang="es"><span title="">Un enlace al ejemplo que desea evaluar o con el que necesita ayuda, en un editor que se puede compartir en línea (como se mencionó en el paso 1 anterior).</span> <span title="">Esta es una buena práctica para entrar: es muy difícil ayudar a alguien con un problema de codificación si no puede ver su código.</span></span></li>
-   <li><span class="tlid-translation translation" lang="es"><span title="">Un enlace a la página de la tarea o evaluación real, para que podamos encontrar la pregunta con la que desea ayuda.</span></span></li>
-  </ul>
- </li>
-</ol>
diff --git a/files/es/learn/html/introduccion_a_html/texto/index.html b/files/es/learn/html/introduccion_a_html/texto/index.html
deleted file mode 100644
index 912acb7dfe..0000000000
--- a/files/es/learn/html/introduccion_a_html/texto/index.html
+++ /dev/null
@@ -1,970 +0,0 @@
----
-title: Fundamentos de texto en HTML
-slug: Learn/HTML/Introduccion_a_HTML/texto
-tags:
-  - CodingScripting
-  - Encabezados
-  - Estructuras
-  - Guía
-  - HTML
-  - Introducción a HTML
-  - Novato
-  - Principiante
-  - Párrafos
-  - Texto
-  - aprende
-  - semántica
-translation_of: Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML")}}</div>
-
-<p class="summary">Una de las principales funciones de HTML es dar al texto estructura y significado (también conocido como {{Glossary("semantics", "semántica")}}), de forma que un navegador pueda mostrarlo correctamente. Este articulo explica la forma en que se puede usar {{Glossary("HTML")}} para estructurar una página de texto añadiendo encabezados y párrafos, enfatizando palabras, creando listas y más.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Estar familiarizado con el HTML básico, que se expone en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender a marcar una página de texto básica para darle estructura y significado, incluidos párrafos, encabezados, listas, efectos de énfasis y citas.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Conceptos_básicos_Encabezados_y_párrafos">Conceptos básicos: Encabezados y párrafos</h2>
-
-<p>La mayor parte del texto estructurado está compuesto por encabezados y párrafos, independientemente de si lees una historia, un periódico, un libro de texto, una revista, etc.</p>
-
-<p><img alt="Un ejemplo de la portada de un periódico, que muestra el uso de un encabezado, subtítulos y párrafos de nivel superior." src="https://mdn.mozillademos.org/files/12371/newspaper_small.jpg" style="display: block; margin: 0 auto;"></p>
-
-<p>El contenido estructurado simplifica la experiencia en la lectura y se disfruta más.</p>
-
-<p>En HTML, cada párrafo tiene que estar delimitado por un elemento {{HTMLElement("p")}}, como en este ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Soy un párrafo, ¡desde luego que lo soy!&lt;/p&gt;</pre>
-
-<p>Cada sección tiene que estar delimitada por un elemento de encabezado:</p>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Yo soy el título de la historia&lt;/h1&gt;</pre>
-
-<p>Hay seis elementos de encabezado: {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}} y {{HTMLElement("h6")}}. Cada elemento representa un nivel de contenido diferente en el documento; <code>&lt;h1&gt;</code> representa el título principal, <code>&lt;h2&gt;</code> representa el subtítulo, <code>&lt;h3&gt;</code> representa el subtítulo del subtítulo, y así sucesivamente.</p>
-
-<h3 id="Cómo_establecer_la_estructura_jerárquica">Cómo establecer la estructura jerárquica</h3>
-
-<p>Por ejemplo, en esta historia, <code>&lt;h1&gt;</code> representa el título de la historia, <code>&lt;h2&gt;</code> representará el título de cada capítulo y <code>&lt;h3&gt;</code> las diferentes secciones del capítulo, y así sucesivamente.</p>
-
-<pre class="brush: html notranslate">&lt;h1&gt;El agujero aplastante&lt;/h1&gt;
-
-&lt;p&gt;Por Chris Mills&lt;/p&gt;
-
-&lt;h2&gt;Capítulo 1: La oscura noche&lt;/h2&gt;
-
-&lt;p&gt;Era una noche oscura. En algún lugar, un búho ululó. La lluvia azotó el ...&lt;/p&gt;
-
-&lt;h2&gt;Capítulo 2: El silencio eterno&lt;/h2&gt;
-
-&lt;p&gt;Nuestro protagonista ni susurrar pudo al ver esa sombría figura ...&lt;/p&gt;
-
-&lt;h3&gt;El espectro habla&lt;/h3&gt;
-
-&lt;p&gt;Habían pasado varias horas más, cuando de repente el espectro se incorporó y exclamó: "¡Por favor, ten piedad de mi alma!"&lt;/p&gt;</pre>
-
-<p>Realmente es a tu elección lo que cada elemento involucrado represente, siempre y cuando la jerarquía tenga sentido. Solo es necesario que tengas en cuenta unas pocas buenas prácticas mientras creas la estructura:</p>
-
-<ul>
- <li>Preferentemente debes usar solo un <code>&lt;h1&gt;</code> por página; este es el nivel de título superior, y todos los demás se sitúan por debajo de él en la jerarquía.</li>
- <li>Asegúrate de que usas los títulos en el orden correcto en la jerarquía. No uses los <code>&lt;h3&gt;</code> para representar subtítulos, seguidos de los <code>&lt;h2&gt;</code> para representar los subtítulos de los subtítulos; eso no tiene sentido y provocará resultados extraños.</li>
- <li>De los seis niveles de títulos disponibles, debes procurar no usar más de tres por página, a menos que creas que es realmente necesario. Los documentos con muchos niveles (es decir, una jerarquía de títulos muy profunda) son de difícil manejo y navegación. En esos casos se recomienda, si es posible, separar el contenido en varias páginas.</li>
-</ul>
-
-<h3 id="¿Por_qué_necesitamos_estructura">¿Por qué necesitamos estructura?</h3>
-
-<p>Para responder a esta cuestión, echemos un vistazo a <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/html-text-formatting/text-start.html">text-start.html</a>; el apartado inicial de nuestro ejemplo en curso para este artículo (una buena receta de hummus). Debes guardar una copia de este archivo en tu ordenador porque después la necesitarás para los ejercicios prácticos. El cuerpo (<code>&lt;body&gt;</code>) de este documento incluye varios elementos de contenido que no están marcados de ninguna manera pero están separados por saltos de línea (se ha pulsado <strong>Intro</strong>/<strong>Retorno</strong> para continuar en la siguiente línea).</p>
-
-<p>Sin embargo, cuando abres el documento en tu navegador, verás que el texto aparece... ¡como una masa enorme!</p>
-
-<p><img alt="Una página web que muestra un muro de texto sin formato, porque no hay elementos en la página para estructurarlo." src="https://mdn.mozillademos.org/files/12972/text-no-formatting.png" style="display: block; height: 420px; margin: 0px auto; width: 594px;"></p>
-
-<p>Esto se debe a que no hay elementos que den estructura al contenido, por lo que el navegador no sabe qué es un encabezado y qué es un párrafo. Además:</p>
-
-<ul>
- <li>Los usuarios que miran una página web tienden a escanearla rápidamente para encontrar el contenido relevante que hay en ella y a menudo empiezan por leer los encabezados para comenzar. (Solemos <a href="http://www.nngroup.com/articles/how-long-do-users-stay-on-web-pages/">pasar muy poco tiempo en una página web</a>). Si no pueden ver nada útil en unos segundos, es probable que se sientan frustrados y se vayan a otro sitio.</li>
- <li>Los motores de búsqueda que indizan tu página consideran el contenido de los títulos como palabras clave importantes e influyen en la puntuación de búsqueda de la página. Sin encabezados, tu página tendrá un rendimiento bajo en términos de optimización de motores de búsqueda {{Glossary("SEO")}}.</li>
- <li>Las personas con discapacidad visual severa no suelen leer páginas web: en lugar de ello, las escuchan. Lo hacen con un software llamado {{interwiki("wikipedia", "Lector de pantalla")}}. Este software proporciona acceso rápido a un contenido textual dado. Entre las diversas técnicas que emplean, leen los encabezados para proporcionar un esquema del documento que permite a los usuarios encontrar rápidamente la información que quieren. Si no hay encabezados disponibles, se ven obligados a escuchar el documento entero. </li>
- <li>Para aplicar estilos al contenido con {{Glossary("CSS")}}, o para que haga cosas interesantes con {{Glossary("JavaScript")}}, necesitas tener elementos que delimiten el contenido relevante para que CSS/JavaScript se puedan focalizar en este efectivamente.</li>
-</ul>
-
-<p>Por lo tanto, debemos dar a nuestro contenido una estructura definida.</p>
-
-<h3 id="Aprendizaje_Activo_Dar_estructura_a_nuestro_contenido">Aprendizaje Activo: Dar estructura a nuestro contenido</h3>
-
-<p>Pasemos directamente a un ejemplo real. En el ejemplo de abajo, añade elementos al texto en bruto en el campo <em>Código editable</em> para que en el campo <em>Salida en vivo</em> aparezcan como un encabezado y dos párrafos.</p>
-
-<p>Si te equivocas, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si encallas, pulsa el botón <em>Mostrar solución</em> para ver la respuesta...</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 100px; width: 95%"&gt;Mi breve relato Soy estadístico y mi nombre es Trish.
-
-Mis piernas son de cartón y estoy casada con un pez.&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution = '&lt;h1&gt;Mi breve relato&lt;/h1&gt;\n&lt;p&gt;Soy estadístico y mi nombre es Trish.&lt;/p&gt;\n&lt;p&gt;Mis piernas son de cartón y estoy casada con un pez.&lt;/p&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="¿Por_qué_necesitamos_semántica">¿Por qué necesitamos semántica?</h3>
-
-<p>Contamos con la semántica para todo lo que nos rodea. Nos basamos en experiencias previas para conocer la función de cada objeto cotidiano; cuando miramos un objeto, sabemos cuál debe ser su función. Entonces, por ejemplo, esperamos que un semáforo en rojo signifique "alto" y que un semáforo en verde signifique "avance". Las cosas se pueden complicar muy rápidamente si se aplica la semántica incorrecta. (¿Algún país usa rojo para significar "avance"? Esperemos que no).</p>
-
-<p>De manera similar, debemos asegurarnos de que utilizamos los elementos adecuados y damos a nuestro contenido el significado y función correctos y la apariencia adecuada. En este mismo sentido, el elemento {{HTMLElement("h1")}} es un elemento semántico que da al texto al que delimita la función (o significado) de un <em>titular de primer nivel en tu página</em>.</p>
-
-<pre class="brush: html notranslate">&lt;h1&gt;Este es un titular de primer nivel&lt;/h1&gt;</pre>
-
-<p>De manera predeterminada, el navegador le asignará una fuente de gran tamaño para darle el aspecto de un titular (aunque se le podrá dar el estilo que se quisiera usando CSS). Lo más importante es que su valor semántico se va a usar de diferente manera, por ejemplo, por los motores de búsqueda y los lectores de pantalla (como se mencionó antes).</p>
-
-<p>Por otra parte, podrías hacer que cualquier elemento <em>parezca</em> un titular de primer rango. Considera lo siguiente:</p>
-
-<pre class="brush: html notranslate">&lt;span style="font-size: 32px; margin: 21px 0;"&gt;¿Es este un titular de primer rango?&lt;/span&gt;</pre>
-
-<p>Este es un elemento {{HTMLElement("span")}}. No tiene semántica. Se usa para delimitar contenido cuando se le quiere aplicar CSS (o tratarlo con JavaScript) sin proporcionarle ningún significado extra (encontrarás más información sobre este tipo de elemento más adelante en el curso). Hemos aplicado CSS a este elemento para que parezca un titular de primer nivel, pero al no tener valor semántico, no tiene ninguna de las ventajas añadidas que hemos descrito antes. Es una buena idea usar el elemento HTML apropiado para cada tarea.</p>
-
-<h2 id="Listas">Listas</h2>
-
-<p>Ahora volvamos nuestra atención hacia las listas. Las listas están en todos los aspectos de nuestra vida: desde la lista de compras a la lista de instrucciones que sigues inconscientemente para llegar a casa todos los días, o las listas de instrucciones que sigues en estos tutoriales. Las listas están en todos lados en la web también y hay tres diferentes tipos de las que nos vamos a ocupar.</p>
-
-<h3 id="Listas_no_ordenadas">Listas no ordenadas</h3>
-
-<p>Las listas no ordenadas se usan para marcar listas de artículos cuyo orden no es importante. Tomemos como ejemplo una lista de compras:</p>
-
-<pre class="brush: bash notranslate">leche
-huevos
-pan
-hummus</pre>
-
-<p>Cada lista desordenada comienza con un elemento {{HTMLElement("ul")}} («<em>unordered list</em>») que delimita todos los elementos de la lista:</p>
-
-<pre class="brush: html notranslate">&lt;ul&gt;
-leche
-huevos
-pan
-hummus
-&lt;/ul&gt;</pre>
-
-<p>El siguiente paso es delimitar cada artículo de la lista con un elemento {{HTMLElement("li")}} («<em>list item</em>»).</p>
-
-<pre class="brush: html notranslate">&lt;ul&gt;
-  &lt;li&gt;leche&lt;/li&gt;
-  &lt;li&gt;huevos&lt;/li&gt;
-  &lt;li&gt;pan&lt;/li&gt;
-  &lt;li&gt;hummus&lt;/li&gt;
-&lt;/ul&gt;</pre>
-
-<h4 id="Aprendizaje_activo_marcar_una_lista_no_ordenada">Aprendizaje activo: marcar una lista no ordenada</h4>
-
-<p>Edita el siguiente ejemplo para crear tu propia lista HTML no ordenada.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_2">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 100px; width: 95%"&gt;leche
-huevos
-pan
-hummus&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution = '&lt;ul&gt;\n&lt;li&gt;leche&lt;/li&gt;\n&lt;li&gt;huevos&lt;/li&gt;\n&lt;li&gt;pan&lt;/li&gt;\n&lt;li&gt;hummus&lt;/li&gt;\n&lt;/ul&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_2', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="Listas_ordenadas">Listas ordenadas</h3>
-
-<p>Las listas ordenadas son aquellas en las que el orden de los elementos <em>sí</em> importa. Tomemos como ejemplo una lista de instrucciones para seguir un itinerario:</p>
-
-<pre class="brush: bash notranslate">Conduce hasta el final de la calle
-Gira a la derecha
-Sigue derecho por las dos primeras glorietas
-Gira a la izquierda en la tercer glorieta
-El colegio está a la derecha, 300 metros más adelante</pre>
-
-<p>La estructura de marcado es la misma que para las listas no ordenadas, excepto que debes delimitar los elementos de la lista con una etiqueta {{HTMLElement("ol")}} («ordered list»), en lugar de <code>&lt;ul&gt;</code>:</p>
-
-<pre class="brush: html notranslate">&lt;ol&gt;
-  &lt;li&gt;Conduce hasta el final de la calle&lt;/li&gt;
-  &lt;li&gt;Gira a la derecha&lt;/li&gt;
-  &lt;li&gt;Sigue derecho por las dos primeras glorietas&lt;/li&gt;
-  &lt;li&gt;Gira a la izquierda en la tercer glorieta&lt;/li&gt;
-  &lt;li&gt;El colegio está a tu derecha, 300 metros más adelante&lt;/li&gt;
-&lt;/ol&gt;</pre>
-
-<h4 id="Aprendizaje_activo_Marcar_una_lista_ordenada">Aprendizaje activo: Marcar una lista ordenada</h4>
-
-<p>Edita el siguiente ejemplo para crear tu propia lista ordenada en HTML.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_3">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 200px; width: 95%"&gt;Conduce hasta el final de la calle
-Gira a la derecha
-Sigue derecho por las dos primeras glorietas
-Gira a la izquierda en la tercer glorieta
-La escuela está a tu derecha, 300 metros por más adelante&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution = '&lt;ol&gt;\n&lt;li&gt;Conduce hasta el final de la calle&lt;/li&gt;\n&lt;li&gt;Gira a la derecha&lt;/li&gt;\n&lt;li&gt;Sigue derecho por las dos primeras glorietas&lt;/li&gt;\n&lt;li&gt;Gira a la izquierda en la tercer glorieta&lt;/li&gt;\n&lt;li&gt;La escuela está a tu derecha, 300 metros más adelante&lt;/li&gt;\n&lt;/ol&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_3', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="Aprendizaje_activo_marcar_la_página_de_tu_receta">Aprendizaje activo: marcar la página de tu receta</h3>
-
-<p>Llegados a este punto del artículo, tienes toda la información necesaria para marcar la página de ejemplo con tu receta. Puedes escoger entre guardar una copia local del archivo inicial <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/html-text-formatting/text-start.html">text-start.html</a> y trabajar en él, o hacerlo sobre el ejemplo editable de abajo. Probablemente sea mejor trabajar en tu copia local porque podrás guardar tu progreso, mientras que si lo haces sobre el ejemplo editable, los cambios se perderán la próxima vez que cargues la página. Ambos métodos tienen pros y contras.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_4">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 200px; width: 95%"&gt;Receta rápida de hummus
-
-  Esta receta hace un hummus rápido y sabroso, sin ensuciar. Ha sido adaptada de varias recetas diferentes que he leído a lo largo de los años.
-
-  El hummus es una deliciosa pasta espesa que se usa mucho en platos griegos y del Medio Oriente. Es muy sabroso con ensalada, carne a las brasas y pan de pitta.
-
-  Ingredientes
-
-  1 lata (400g) de garbanzos (garbanzos)
-  175g de tahini
-  6 tomates secos
-  Medio pimiento rojo
-  Una pizca de pimienta de cayena
-  1 diente de ajo
-  Una pizca de aceite de oliva
-
-  Instrucciones
-
-  Retira la piel del ajo y pica en trozos grandes.
-  Retira todas las semillas y el tallo del pimiento y pica en trozos grandes.
-  Agrega todos los ingredientes en un procesador de alimentos.
-  Procesa todos los ingredientes en una pasta
-  Si deseas un hummus "grueso", procésalo corto tiempo
-  Si deseas un hummus "suave", procésalo por más tiempo
-
-  Para un sabor diferente, puedes intentar mezclar en una pequeña medida de limón y cilantro, ají, lima y chipotle, harissa y menta, o espinacas y queso feta. Pruébalo y confirma que esté en su punto.
-
-  Almacenamiento
-
-  Refrigera el hummus terminado en un recipiente sellado. Deberías poder usarlo durante aproximadamente una semana después de haberlo hecho. Si comienza a burbujear, definitivamente debes desecharlo.
-
-  El hummus es apto para congelar; debes descongelarlo y usarlo en un par de meses.&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution = '&lt;h1&gt;Receta rápida de hummus&lt;/h1&gt;\n\n&lt;p&gt;Esta receta hace un hummus rápido y sabroso, sin ensuciar. Ha sido adaptada de varias recetas diferentes que he leído a lo largo de los años.&lt;/p&gt;\n\n&lt;p&gt;El hummus es una deliciosa pasta espesa que se usa mucho en platos griegos y del Medio Oriente. Es muy sabroso con ensalada, carne a las brasas y pan de pitta.&lt;/p&gt;\n\n&lt;h2&gt;Ingredientes&lt;/h2&gt;\n\n&lt;ul&gt;\n&lt;li&gt;1 lata (400g) de garbanzos (garbanzos)&lt;/li&gt;\n&lt;li&gt;175g de tahini&lt;/li&gt;\n&lt;li&gt;6 tomates secos&lt;/li&gt;\n&lt;li&gt;Medio pimiento rojo&lt;/li&gt;\n&lt;li&gt;Una pizca de pimienta de cayena&lt;/li&gt;\n&lt;li&gt;1 diente de ajo&lt;/li&gt;\n&lt;li&gt;Una pizca de aceite de oliva&lt;/li&gt;\n&lt;/ul&gt;\n\n&lt;h2&gt;Instrucciones&lt;/h2&gt;\n\n&lt;ol&gt;\n &lt;li&gt;Retira la piel del ajo y pica en trozos grandes.&lt;/li&gt;\n&lt;li&gt;Retira todas las semillas y el tallo del pimiento, y pica en trozos grandes.&lt;/li&gt;\n&lt;li&gt;Agrega todos los ingredientes en un procesador de alimentos.&lt;/li&gt;\n&lt;li&gt;Procesa todos los ingredientes en una pasta.&lt;/li&gt;\n&lt;li&gt;Si deseas un hummus "grueso", procésalo corto tiempo.&lt;/li&gt;\n&lt;li&gt;Si deseas un hummus "suave", procésalo por más tiempo.&lt;/li&gt;\n&lt;/ol&gt;\n\n&lt;p&gt;Para un sabor diferente, puedes intentar mezclar una pequeña medida de limón y cilantro, ají, lima y chipotle, harissa y menta, o espinacas y queso feta. Pruébalo y confirma que esté en su punto.&lt;/p&gt;\n\n&lt;h2&gt;Almacenamiento&lt;/h2&gt;\n\n&lt;p&gt;Refrigera el hummus terminado en un recipiente sellado. Deberías poder usarlo durante aproximadamente una semana después de haberlo hecho. Si comienza a burbujear, definitivamente debes desecharlo.&lt;/p&gt;\n\n&lt;p&gt;El hummus es adecuado para congelar; debes descongelarlo y usarlo en un par de meses.&lt;/p&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_4', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<p>Si encallas, siempre puedes pulsar el botón <em>Mostrar solución</em> o comprobar el ejemplo completo <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/html-text-formatting/text-complete.html">text-complete.html</a> en nuestro repositorio de Github.</p>
-
-<h3 id="Listas_anidadas">Listas anidadas</h3>
-
-<p>Es perfectamente correcto anidar una lista dentro de otra. Posiblemente quieras tener subelementos bajo elementos de rango superior. Tomemos la segunda lista de nuestro ejemplo de la receta:</p>
-
-<pre class="brush: html notranslate">&lt;ol&gt;
-  &lt;li&gt;Pela el ajo y picarlo en trozos gruesos.&lt;/li&gt;
-  &lt;li&gt;Retira las semillas y el tallo del pimiento, y cortarlo en trozos gruesos.&lt;/li&gt;
-  &lt;li&gt;Mete todos los alimentos en un procesador de alimentos.&lt;/li&gt;
-  &lt;li&gt;Pica todos los ingredientes hasta conseguir una pasta.&lt;/li&gt;
-  &lt;li&gt;Si deseas un hummus "grueso", procésalo corto tiempo.&lt;/li&gt;
-  &lt;li&gt;Pica durante más tiempo si se desea obtener un hummus "suave".&lt;/li&gt;
-&lt;/ol&gt;</pre>
-
-<p>Puesto que los dos últimos elementos están estrechamente relacionados con el elemento anterior (se leen como subinstrucciones u opciones que encajan bajo ese elemento), puede tener sentido anidarlos dentro de su propia lista no ordenada e introducir esa lista bajo el cuarto elemento. Tendría el siguiente aspecto:</p>
-
-<pre class="brush: html notranslate">&lt;ol&gt;
-  &lt;li&gt;Pela el ajo y picarlo en trozos gruesos.&lt;/li&gt;
-  &lt;li&gt;Retira las semillas y el tallo del pimiento, y cortarlo en trozos gruesos.&lt;/li&gt;
-  &lt;li&gt;Mete todos los alimentos en un procesador de alimentos.&lt;/li&gt;
-  &lt;li&gt;Procesa todos los ingredientes hasta conseguir una pasta.
-    &lt;ul&gt;
-      &lt;li&gt;Si deseas un hummus "grueso", procésalo corto tiempo.&lt;/li&gt;
-      &lt;li&gt;Pica durante más tiempo si se desea obtener un hummus "suave".&lt;/li&gt;
-    &lt;/ul&gt;
-  &lt;/li&gt;
-&lt;/ol&gt;</pre>
-
-<p>Vuelve al ejemplo anterior y reescribe la lista de este modo.</p>
-
-<h2 id="Énfasis_e_importancia">Énfasis e importancia</h2>
-
-<p>En el lenguaje humano, a menudo enfatizamos ciertas palabras para alterar el significado de una frase, y a menudo queremos destacar ciertas palabras como importantes o diferentes en algún sentido. HTML nos dota de diversos elementos semánticos que nos permiten destacar contenido textual con tales efectos, y en esta sección veremos los más comunes.</p>
-
-<h3 id="Énfasis">Énfasis</h3>
-
-<p>Cuando queremos dar énfasis al lenguaje hablado, <em>acentuamos</em> ciertas palabras y así alteramos sutilmente el significado de lo que decimos. De manera similar, en el lenguaje escrito ponemos palabras en cursiva para destacarlas. Por ejemplo, las dos siguientes frases tienen diferente significado:</p>
-
-<p>Me alegro de que no llegues tarde.</p>
-
-<p>Me <em>alegro</em> de que no llegues <em>tarde</em>.</p>
-
-<p>La primera frase suena aliviada porque la persona no llega tarde. Por el contrario, la segunda suena sarcástica y un tanto pasivo-agresiva, expresa molestia porque la persona ha llegado algo tarde.</p>
-
-<p>En HTML usamos el elemento {{HTMLElement("em")}} («<em>emphasis</em>») para marcar estos casos. El documento logra entonces transmitir una lectura más interesante y además así lo reconocen los lectores de pantalla, que lo expresan con un diferente tono de voz. El navegador, de manera predeterminada, aplica el estilo de letra itálica, pero no debes utilizar esta etiqueta solamente para establecer el estilo de letra itálica. Para usar ese estilo, debes utilizar únicamente la etiqueta del elemento {{HTMLElement("span")}} y algo de CSS u otra etiqueta con el elemento {{HTMLElement("i")}} (ve abajo).</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Me &lt;em&gt;alegro&lt;/em&gt; de que no llegues &lt;em&gt;tarde&lt;/em&gt;.&lt;/p&gt;</pre>
-
-<h3 id="Importancia_fuerte">Importancia fuerte</h3>
-
-<p>Para enfatizar palabras importantes al hablar solemos acentuarlas, y al escribir lo hacemos en estilo <strong>negrita</strong>. Por ejemplo:</p>
-
-<p>Este líquido es <strong>altamente tóxico</strong>.</p>
-
-<p>Cuento contigo. <strong>¡No llegues tarde!</strong></p>
-
-<p>En HTML usamos el elemento {{HTMLElement("strong")}} (importancia fuerte) para marcar tales expresiones. El documento resulta entonces más útil, y de nuevo los lectores de pantalla reconocen estos elementos y el tono de voz cambia a uno más fuerte. El estilo negrita es el que aplican los navegadores por omisión, pero no debes usar esta etiqueta solamente para aplicar este estilo. Para hacer eso usa el elemento {{HTMLElement("span")}} y CSS, o un elemento  {{HTMLElement("b")}} (ve más abajo).</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Este líquido es &lt;strong&gt;altamente tóxico&lt;/strong&gt;.&lt;/p&gt;
-
-&lt;p&gt;Cuento contigo. &lt;strong&gt;¡No llegues tarde!&lt;/strong&gt;&lt;/p&gt;</pre>
-
-<p>Puedes anidar elementos de énfasis dentro de elementos de importancia y viceversa si lo deseas:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Este líquido es &lt;strong&gt;altamente tóxico&lt;/strong&gt; —
-si lo bebes, &lt;strong&gt;podrías &lt;em&gt;morir&lt;/em&gt;&lt;/strong&gt;.&lt;/p&gt;</pre>
-
-<h3 id="Aprendizaje_activo_¡Seamos_importantes!">Aprendizaje activo: ¡Seamos importantes!</h3>
-
-<p>En esta sección de aprendizaje activo te proporcionamos un ejemplo editable. Practica un poco añadiendo algo de <em><strong>énfasis</strong></em> e <strong><em>importancia</em></strong> a las palabras que creas que lo necesitan.</p>
-
-<div class="hidden">
-<h6 id="Código_reproducible_5">Código reproducible</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
-
-&lt;div class="output" style="min-height: 50px;"&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Código editable&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
-
-&lt;textarea id="code" class="input" style="min-height: 200px; width: 95%"&gt;&lt;h1&gt;Aviso importante&lt;/h1&gt;
-&lt;p&gt;El domingo 9 de enero de 2019, fue vista una pandilla de góticos
-  robando varios gnomos de jardín de un
-  centro comercial en el centro de Milwaukee. Todos ellos
-  vistiendo monos verdes y tontos sombreros, y
-  al parecer estaban pasando un buen rato. Si alguien
-   tiene alguna información sobre este incidente, por favor
-    póngase en contacto con la policía ahora.&lt;/p&gt;&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Restablecer"&gt;
-  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var output = document.querySelector('.output');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  output.innerHTML = textarea.value;
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = htmlSolution;
-  solution.value = 'Mostrar solución';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Mostrar solución') {
-    textarea.value = solutionEntry;
-    solution.value = 'Ocultar solución';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Mostrar solución';
-  }
-  updateCode();
-});
-
-var htmlSolution='&lt;h1&gt;Aviso importante&lt;/h1&gt;\n&lt;p&gt;El &lt;strong&gt;domingo 9 de enero de 2019&lt;/strong&gt;, fue vista una pandilla de &lt;em&gt;góticos&lt;/em&gt; robando &lt;strong&gt;varios &lt;em&gt;gnomos&lt;/em&gt; de jardín&lt;/strong&gt; de un centro comercial en el centro de &lt;strong&gt;Milwaukee&lt;/strong&gt;. Todos ellos vistiendo &lt;em&gt;monos verdes&lt;/em&gt; y &lt;em&gt;tontos sombreros&lt;/em&gt;, y al parecer estaban pasando un buen rato. Si alguien tiene &lt;strong&gt;alguna&lt;/strong&gt; información sobre este incidente, póngase en contacto con la policía &lt;strong&gt;ahora&lt;/strong&gt;.&lt;/p&gt;';
-var solutionEntry = htmlSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// captura la tecla de tabulación en el área de texto y en su lugar
-// hace que se escriba una tabulación en la posición del cursor
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
-
-textarea.onkeyup = function(){
-  // Solo queremos guardar el estado cuando se muestra el código de usuario,
-  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
-  if(solution.value === 'Mostrar solución') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_reproducible_5', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="Cursiva_negrita_subrayado...">Cursiva, negrita, subrayado...</h3>
-
-<p>Los elementos que hemos comentado hasta ahora tienen asociada una semántica clara. La situación con {{HTMLElement("b")}} (negrita o «<b>bold</b>»), {{HTMLElement("i")}} (cursiva o «<i>italic</i>») y{{HTMLElement("u")}} (subrayado o «<u>underline</u>») es algo más complicada. Surgieron para que las personas pudieran escribir textos en negrita, cursiva o subrayado en un tiempo en el que pocos navegadores o ninguno admitían el CSS. Elementos como estos, que solo afectan a la presentación y no a la semántica, se conocen como <strong>elementos de presentación</strong> y no se deberían usar porque, como hemos visto, la semántica es muy importante para la accesibilidad y el SEO, entre otros aspectos.</p>
-
-<p>HTML5 redefinió los elementos <code>&lt;b&gt;</code>, <code>&lt;i&gt;</code> y <code>&lt;u&gt;</code> con roles semánticos nuevos un tanto confusos.</p>
-
-<p>Esta es la regla de oro: el uso de <code>&lt;b&gt;</code>, <code>&lt;i&gt;</code> o <code>&lt;u&gt;</code> resulta adecuado cuando transmiten el significado que suele transmitir el uso tradicional de las negritas, itálicas o el subrayado, si no hay ningún otro elemento que resulte más adecuado. Sin embargo, siempre resulta crítico mantener una actitud orientada a la accesibilidad. El concepto de itálica no es demasiado útil para las personas que usan lectores de pantalla o para las personas que utilizan un sistema de escritura distinto del alfabeto latino.</p>
-
-<ul>
- <li>{{HTMLElement('i')}} se usa para transmitir el significado que tradicionalmente transmite la itálica: extranjerismos, clasificaciones taxonómicas, conceptos técnicos, un pensamiento...</li>
- <li>{{HTMLElement('b')}} se usa para transmitir el significado que tradicionalmente transmite la negrita: palabras clave, nombres de productos, frases principales...</li>
- <li>{{HTMLElement('u')}} se usa para transmitir el significado que tradicionalmente conlleva el subrayado: nombres propios, errores ortográficos...</li>
-</ul>
-
-<div class="note">
-<p>Una observación prudente acerca del subrayado: <strong>La gente suele asociar estrechamente el subrayado con los hipervínculos.</strong> Por ello en la web es mejor reservar el subrayado para los enlaces. Utiliza el elemento {{HTMLElement('u')}} cuando resulte apropiado semánticamente, pero considera usar CSS para cambiar el subrayado predeterminado por algo más adecuado en la web. El siguiente ejemplo ilustra cómo lo puedes hacer.</p>
-</div>
-
-<pre class="brush: html notranslate">&lt;!-- nombres científicos --&gt;
-&lt;p&gt;
-  El colibrí garganta de rubí (&lt;i&gt;Archilochus colubris&lt;/i&gt;)
-  es el colibrí más común en el este de América del Norte.
-&lt;/p&gt;
-
-&lt;!-- extranjerismos --&gt;
-&lt;p&gt;
-  El menú era un mar de palabras exóticas como &lt;i lang="uk-latn"&gt;vatrushka&lt;/i&gt;,
-  &lt;i lang="id"&gt;nasi goreng&lt;/i&gt; y &lt;i lang="fr"&gt;soupe à l'oignon&lt;/i&gt;.
-&lt;/p&gt;
-
-&lt;!-- un error ortográfico reconocido --&gt;
-&lt;p&gt;
-  Algún día aprenderé a <u>deletrear</u> mejor.
-&lt;/p&gt;
-
-&lt;!-- Palabras clave destacadas en una serie de instrucciones --&gt;
-&lt;ol&gt;
-  &lt;li&gt;
-    &lt;b&gt;Corta&lt;/b&gt; dos piezas de la hogaza de pan.
-  &lt;/li&gt;
-  &lt;li&gt;
-    &lt;b&gt;Inserta&lt;/b&gt; una rodaja de tomate y una hoja de
-    lechuga entre las rebanadas de pan.
-  &lt;/li&gt;
-&lt;/ol&gt;</pre>
-
-<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
-
-<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Encontrarás más ejercicios con los que comprobar que has retenido esta información antes de seguir adelante en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_HTML_text_basics", "Pon a prueba tus habilidades: Prueba de conocimientos básicos de HTML")}}.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>¡Eso es todo por ahora! Este artículo debería haberte dado una buena idea de cómo comenzar a marcar texto en HTML y te ha presentado algunos de los elementos más importantes en este ámbito. Hay muchos más elementos semánticos para desarrollar en esta área, y veremos muchos más en nuestro artículo {{web.link("/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}, más adelante en el curso. En el siguiente artículo, veremos en detalle cómo {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "crear hipervínculos")}}, posiblemente el más importante elemento en la web.</p>
-
-<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
- <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
-</ul>
diff --git a/files/es/learn/html/introduction_to_html/advanced_text_formatting/index.html b/files/es/learn/html/introduction_to_html/advanced_text_formatting/index.html
new file mode 100644
index 0000000000..49758ede67
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/advanced_text_formatting/index.html
@@ -0,0 +1,696 @@
+---
+title: Formateo de texto avanzado
+slug: Learn/HTML/Introduction_to_HTML/Advanced_text_formatting
+tags:
+  - CodingScripting
+  - Guía
+  - HTML
+  - Lista de descripción
+  - Novato
+  - Principiante
+  - Texto
+  - abreviatura
+  - aprende
+  - cita
+  - semántica
+translation_of: Learn/HTML/Introduction_to_HTML/Advanced_text_formatting
+original_slug: Learn/HTML/Introduccion_a_HTML/Advanced_text_formatting
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">Hay muchos otros elementos en HTML para dar formato al texto, que no expusimos en el artículo {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}. Los elementos descritos en este artículo son menos conocidos, pero aún así es muy útil conocerlos (no obstante, no es una lista completa de ninguna manera). Aquí aprenderás cómo marcar citas, listas de descripción, código de computadora y otro texto relacionado, subíndices y superíndices, información de contacto y mucho más.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Estar familiarizado con HTML, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}. Aplicación de formato a texto en documentos HTML, según lo expuesto en la sección {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender a utilizar elementos HTML menos conocidos para marcar características semánticas avanzadas.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Listas_de_descripciones">Listas de descripciones</h2>
+
+<p>En los fundamentos del texto HTML, explicamos cómo {{web.link("/es/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Lists", "marcar listas básicas")}} en HTML, pero no mencionamos el tercer tipo de lista con la que te encontrarás ocasionalmente: <strong>listas de descripción</strong>. El propósito de estas listas es marcar un conjunto de elementos y sus descripciones asociadas, como términos y definiciones, o preguntas y respuestas. Veamos un ejemplo de un conjunto de términos y definiciones:</p>
+
+<pre class="brush: bash notranslate">soliloquio
+En las obras dramáticas, corresponde a cuando un personaje se habla a sí mismo para representar sus pensamientos o sentimientos internos y, en el proceso, transmitirlos a la audiencia (pero no a otros personajes).
+monólogo
+En las obras dramáticas, corresponde a cuando un personaje habla de sus pensamientos en voz alta para compartirlos con el público y cualquier otro personaje presente.
+aparte
+En las obras dramáticas, corresponde a cuando un personaje comparte un comentario solo con la audiencia para dar efecto cómico o dramático. Suele ser un sentimiento, un pensamiento o información adicional.</pre>
+
+<p>Las listas de descripción utilizan un contenedor diferente al de los otros tipos de listas — {{HTMLElement("dl")}} («<em><b>d</b>escription <b>l</b>ist</em>» o lista de descripciones); además, cada término está envuelto en un elemento {{HTMLElement("dt")}} («<em><b>d</b>escription <b>t</b>erm</em>» o término a describir), y cada descripción está envuelta en un elemento {{HTMLElement("dd")}} («<em><b>d</b>escription <b>d</b>efinition</em>» o definición de descripción). Para redondear esta información veamos un ejemplo:</p>
+
+<div id="listas-de-descripciones-ejemplo-activo-1">
+<pre class="brush: html notranslate">&lt;dl&gt;
+  &lt;dt&gt;soliloquio&lt;/dt&gt;
+  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje se habla a sí mismo para representar sus pensamientos o sentimientos internos y, en el proceso, transmitirlos a la audiencia (pero no a otros personajes).&lt;/dd&gt;
+  &lt;dt&gt;monólogo&lt;/dt&gt;
+  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje habla de sus pensamientos en voz alta para compartirlos con el público y cualquier otro personaje presente.&lt;/dd&gt;
+  &lt;dt&gt;aparte&lt;/dt&gt;
+  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje comparte un comentario solo con la audiencia para dar efecto cómico o dramático. Suele ser un sentimiento, un pensamiento o información adicional.&lt;/dd&gt;
+&lt;/dl&gt;</pre>
+</div>
+
+<p>Los estilos predeterminados del navegador mostrarán listas de descripciones con las descripciones sangradas un poco más que los términos.</p>
+
+<p>{{ EmbedLiveSample('listas-de-descripciones-ejemplo-activo-1', '100%', '285px', '', '', 'hide-codepen-jsfiddle') }}</p>
+
+<p>Ten en cuenta que un solo término puede tener múltiples descripciones, por ejemplo:</p>
+
+<div id="listas-de-descripciones-ejemplo-activo-2">
+<pre class="brush: html notranslate">&lt;dl&gt;
+  &lt;dt&gt;aparte&lt;/dt&gt;
+  &lt;dd&gt;En las obras dramáticas, corresponde a cuando un personaje comparte un comentario solo con la audiencia para dar efecto cómico o dramático. Suele ser un sentimiento, un pensamiento o información adicional.&lt;/dd&gt;
+  &lt;dd&gt;Si la obra es impresa, es una sección de contenido que se relaciona con el tema, pero no encaja directamente en el flujo principal de contenido, de modo que se presenta por separado (a menudo en una caja de texto en el margen).&lt;/dd&gt;
+&lt;/dl&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('listas-de-descripciones-ejemplo-activo-2', '100%', '193px', '', '', 'hide-codepen-jsfiddle') }}</p>
+
+<h3 id="Aprendizaje_activo_Marcar_un_conjunto_de_definiciones">Aprendizaje activo: Marcar un conjunto de definiciones</h3>
+
+<p>Es hora de practicar las listas de descripciones; agrega elementos al texto sin formato en el campo <em>Código editable</em> para que aparezca como una lista de descripción en el campo <em>Salida en vivo</em>. Puedes usar tus propios términos y descripciones si lo deseas.</p>
+
+<p>Si cometes un error, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente encallado, pulsa el botón <em>Mostrar solución</em> para ver una buena propuesta.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 100px; width: 95%"&gt;
+Tocino
+El pegamento que une al mundo.
+Huevos
+El pegamento que une el pastel.
+Café
+La bebida que hace que el mundo funcione por la mañana.
+Un color marrón claro.&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">const textarea = document.getElementById('code');
+const reset = document.getElementById('reset');
+const solution = document.getElementById('solution');
+const output = document.querySelector('.output');
+const code = textarea.value;
+const userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+const htmlSolution = '&lt;dl&gt;\n &lt;dt&gt;Tocino&lt;/dt&gt;\n &lt;dd&gt;El pegamento que une al mundo.&lt;/dd&gt;\n &lt;dt&gt;Huevos&lt;/dt&gt;\n &lt;dd&gt;El pegamento que une el pastel.&lt;/dd&gt;\n &lt;dt&gt;Café&lt;/dt&gt;\n &lt;dd&gt;La bebida que hace que el mundo funcione por la mañana.&lt;/dd&gt;\n &lt;dd&gt;Un color marrón claro.&lt;/dd&gt;\n&lt;/dl&gt;';
+const solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  const scrollPos = textarea.scrollTop;
+  const caretPos = textarea.selectionStart;
+
+  const front = (textarea.value).substring(0, caretPos);
+  const back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible', 700, 350, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h2 id="Citas">Citas</h2>
+
+<p>HTML también dispone de elementos para el marcado de citas; cual elemento utilices depende de si estás marcando la cita como un bloque o como un elemento en línea.</p>
+
+<h3 id="Cita_en_bloque_independiente_blockquote">Cita en bloque independiente (<em>blockquote</em>)</h3>
+
+<p>Si una sección de contenido a nivel de bloque (ya sea un párrafo, varios párrafos, una lista, etc.) se cita en otro lugar, debes envolverla dentro de un elemento {{HTMLElement("blockquote")}} para indicarlo, e incluye una URL que apunte a la fuente de la cita dentro de un atributo {{HTMLAttrxRef("cite", "blockquote")}}. Por ejemplo, el siguiente marcado tomado de la página del elemento <code>&lt;blockquote&gt;</code> de MDN:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;El &lt;strong&gt;elemento HTML &lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/strong&gt; (o &lt;em&gt;elemento HTML de cita
+en bloque independiente&lt;/em&gt;) indica que el texto al que delimita es una cita ampliada.&lt;/p&gt;</pre>
+
+<p>Para convertir esto en una cita en bloque independiente, simplemente harías lo siguiente:</p>
+
+<div id="blockquote-ejemplo-en-vivo">
+<pre class="brush: html notranslate">&lt;p&gt;A continuación se muestra una cita en bloque independiente...&lt;/p&gt;
+&lt;blockquote cite="https://developer.mozilla.org/es/docs/Web/HTML/Element/blockquote"&gt;
+  &lt;p&gt;El &lt;strong&gt;elemento HTML &lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/strong&gt; (o &lt;em&gt;elemento HTML de cita
+  en bloque independiente&lt;/em&gt;) indica que el texto al que delimita es una cita ampliada.&lt;/p&gt;
+&lt;/blockquote&gt;</pre>
+</div>
+
+<p>El estilo predeterminado del navegador lo mostrará como un párrafo con sangría, para indicar que se trata de una cita; el párrafo anterior a la cita sirve para demostrarlo.</p>
+
+<p>{{EmbedLiveSample('blockquote-ejemplo-en-vivo', '100%', '117px', '', '', 'hide-codepen-jsfiddle')}}</p>
+
+<h3 id="Citas_en_línea">Citas en línea</h3>
+
+<p>Las citas en línea funcionan exactamente de la misma manera, excepto que usan el elemento {{HTMLElement("q")}}. Por ejemplo, el siguiente fragmento de marcado contiene una cita <code>&lt;q&gt;</code> de la página MDN:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;El elemento de cita — &lt;code&gt;&amp;lt;q&amp;gt;&lt;/code&gt; — se &lt;q cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q"&gt;utiliza en
+para citas breves que no requieren saltos de párrafo.&lt;/q&gt;&lt;/p&gt;</pre>
+
+<p>El estilo predeterminado del navegador lo representará como texto normal entre comillas para indicar una cita, así:</p>
+
+<p>{{ EmbedLiveSample('Citas_en_línea', '100%', '78px', '', '', 'hide-codepen-jsfiddle')}}</p>
+
+<h3 id="Citas_2">Citas</h3>
+
+<p>El contenido del atributo {{HTMLAttrxRef("cite", "blockquote")}} suena útil, pero desafortunadamente los navegadores, lectores de pantalla, etc. no hacen mucho con él. No hay forma de hacer que el navegador muestre el contenido de <code>cite</code> sin escribir tu propia solución usando JavaScript o CSS. Si deseas que la fuente de la cita esté disponible en la página, lo debes hacer en el texto a través de un enlace o de alguna otra forma apropiada.</p>
+
+<p>Hay un elemento {{HTMLElement("cite")}}, pero está destinado a contener el título del recurso que se cita, p. ej. el nombre del libro. Sin embargo, no hay razón por la que no puedas vincular el texto dentro de <code>&lt;cite&gt;</code> a la fuente de la cita de alguna manera:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;De acuerdo con &lt;a href="https://developer.mozilla.org/es/docs/Web/HTML/Element/blockquote"&gt;
+&lt;cite&gt;página de citas en bloque independiente de MDN&lt;/cite&gt;&lt;/a&gt;:
+&lt;/p&gt;
+
+&lt;blockquote cite="https://developer.mozilla.org/es/docs/Web/HTML/Element/blockquote"&gt;
+  &lt;p&gt;El &lt;strong&gt;elemento HTML &lt;code&gt;&amp;lt;blockquote&amp;gt;&lt;/code&gt;&lt;/strong&gt; (o &lt;em&gt;elemento HTML de cita
+  en bloque independiente&lt;/em&gt;) indica que el texto al que delimita es una cita ampliada.&lt;/p&gt;
+&lt;/blockquote&gt;
+
+&lt;p&gt;El elemento de cita — &lt;code&gt;&amp;lt;q&amp;gt;&lt;/code&gt; — se &lt;q cite="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q"&gt;utiliza en
+citas breves que no requieren saltos de párrafo.&lt;/q&gt; -- &lt;a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/q"&gt;
+&lt;cite&gt;página q de MDN&lt;/cite&gt;&lt;/a&gt;.&lt;/p&gt;</pre>
+
+<p>Las citas se escriben en cursiva de forma predeterminada.</p>
+
+<p>{{ EmbedLiveSample('Citas_2', '100%', '179px', '', '', 'hide-codepen-jsfiddle') }}</p>
+
+<h3 id="Aprendizaje_activo_¿Quién_dijo_eso">Aprendizaje activo: ¿Quién dijo eso?</h3>
+
+<p>¡Es hora de otro ejemplo de aprendizaje activo! En este ejemplo, nos gustaría que:</p>
+
+<ol>
+ <li>Conviertas el párrafo del medio en una cita en bloque independiente, que incluya un atributo <code>cite</code>.</li>
+ <li>Conviertas "La necesidad de eliminar el diálogo interno negativo" en el tercer párrafo en una cita en línea e incluya un atributo <code>cite</code>.</li>
+ <li>Envuelvas el título de cada fuente en etiquetas <code>&lt;cite&gt;</code> y conviertas cada una en un enlace a esa fuente.</li>
+</ol>
+
+<p>Las fuentes de citación que necesitas son:</p>
+
+<ul>
+ <li>http://www.brainyquote.com/quotes/authors/c/confucius.html para la citas de Confucio</li>
+ <li>http://www.affirmationsforpositivethinking.com para "La necesidad de eliminar el diálogo interno negativo".</li>
+</ul>
+
+<p>Si cometes un error, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente encallado, pulsa el botón <em>Mostrar solución</em> para ver una buena propuesta.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_2">Código reproducible 2</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 150px; width: 95%"&gt;
+&lt;p&gt;Hola y bienvenido a mi página de motivación. Como dice el sitio de citas de Confucio:&lt;/p&gt;
+&lt;p&gt;No importa qué tan lento vayas siempre que no te detengas.&lt;/p&gt;
+&lt;p&gt;También me encanta el concepto de pensamiento positivo y La necesidad de eliminar el diálogo interno negativo (como se menciona en Afirmaciones para el pensamiento positivo).&lt;/p&gt;
+&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">const textarea = document.getElementById('code');
+const reset = document.getElementById('reset');
+const solution = document.getElementById('solution');
+const output = document.querySelector('.output');
+const code = textarea.value;
+const userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+const htmlSolution = '&lt;p&gt;Hola y bienvenido a mi página de motivación. Como dice &lt;a href="http://www.brainyquote.com/quotes/authors/c/confucius.html"&gt;&lt;cite&gt;el sitio de citas de Confucio:&lt;/cite&gt;&lt;/a&gt;:&lt;/p&gt;\n\n&lt;blockquote cite="http://www.brainyquote.com/quotes/authors/c/confucius.html"&gt;\n&lt;p&gt;No importa qué tan lento vayas siempre que no te detengas.&lt;/p&gt;\n&lt;/blockquote&gt;\n\n&lt;p&gt;También me encanta el concepto de pensamiento positivo y &lt;q cite="http://www.affirmationsforpositivethinking.com"&gt;La necesidad de eliminar el diálogo interno negativo&lt;/q&gt; (como se menciona en &lt;a href="http://www.affirmationsforpositivethinking.com"&gt;&lt;cite&gt;Afirmaciones para el pensamiento positivo&lt;/cite&gt;&lt;/a&gt;).&lt;/p&gt;';
+const solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  const scrollPos = textarea.scrollTop;
+  const caretPos = textarea.selectionStart;
+
+  const front = (textarea.value).substring(0, caretPos);
+  const back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_2', 700, 450, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h2 id="Abreviaturas">Abreviaturas</h2>
+
+<p>Otro elemento bastante común que encontrarás cuando busques en la Web es {{HTMLElement("abbr")}} — se usa para envolver una abreviatura o acrónimo, y proporcionar una expansión completa del término (incluida dentro de un atributo {{HTMLAttrxRef("title")}}. Veamos un par de ejemplos:</p>
+
+<div id="ejemplo-de-abreviaturas-en-vivo">
+<pre class="brush: html notranslate">&lt;p&gt;Usamos &lt;abbr title="Lenguaje de marcado de hipertexto"&gt;HTML&lt;/abbr&gt; para estructurar nuestros documentos web.&lt;/p&gt;
+
+&lt;p&gt;Creo que el &lt;abbr title="Reverendo""&gt;Rev.&lt;/abbr&gt; Green lo hizo en la cocina con la motosierra.&lt;/p&gt;</pre>
+</div>
+
+<p>Estos saldrán con un aspecto similar a este (la expansión aparecerá en una descripción emergente cuando se coloque el cursor sobre el término):</p>
+
+<p>{{EmbedLiveSample('ejemplo-de-abreviaturas-en-vivo', '100%', '94px', '', '', 'hide-codepen-jsfiddle')}}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Hay otro elemento, {{HTMLElement("acronym")}}, que básicamente hace lo mismo que <code>&lt;abbr&gt;</code>, y se diseñó específicamente para acrónimos en lugar de las abreviaturas. Sin embargo, este ha caído en desuso — no era compatible con los navegadores ni con <code>&lt;abbr&gt;</code>, y <code>&lt;abbr&gt;</code> tiene una función tan similar que se consideró inútil conservar ambos. Solo utiliza <code>&lt;abbr&gt;</code>.</p>
+</div>
+
+<h3 id="Aprendizaje_activo_Marcar_una_abreviatura">Aprendizaje activo: Marcar una abreviatura</h3>
+
+<p>Para esta simple tarea de aprendizaje activo, nos gustaría que simplemente marcaras una abreviatura. Puedes usar el ejemplo que encontrarás a continuación o reemplazarla por una de tu elección. </p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_3">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 50px; width: 95%"&gt;
+&lt;p&gt;La NASA sin duda hace un interesante trabajo.&lt;/p&gt;
+&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">const textarea = document.getElementById('code');
+const reset = document.getElementById('reset');
+const solution = document.getElementById('solution');
+const output = document.querySelector('.output');
+const code = textarea.value;
+const userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+const htmlSolution = '&lt;p&gt;La &lt;abbr title="Administración Nacional de Aeronáutica y del Espacio"&gt;NASA&lt;/abbr&gt; sin duda hace un interesante trabajo.&lt;/p&gt;';
+const solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  const scrollPos = textarea.scrollTop;
+  const caretPos = textarea.selectionStart;
+
+  const front = (textarea.value).substring(0, caretPos);
+  const back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_3', 700, 300, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h2 id="Marcar_la_información_de_contacto">Marcar la información de contacto</h2>
+
+<p>HTML tiene un elemento para marcar la información de contacto — {{HTMLElement("address")}}. Este simplemente envuelve tus datos de contacto, por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;address&gt;
+  &lt;p&gt;Chris Mills, Manchester, The Grim North, Reino Unido&lt;/p&gt;
+&lt;/address&gt;</pre>
+
+<p>También podrías incluir un marcado más complejo y otras formas de información de contacto, por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;address&gt;
+  &lt;p&gt;
+    Chris Mills&lt;br&gt;
+    Manchester&lt;br&gt;
+    The Grim North&lt;br&gt;
+    Reino Unido
+  &lt;/p&gt;
+
+  &lt;ul&gt;
+    &lt;li&gt;Tel: 01234 567 890&lt;/li&gt;
+    &lt;li&gt;Email: me@grim-north.co.uk&lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/address&gt;</pre>
+
+<p>Ten en cuenta que algo como esto también estaría bien, si la página vinculada contuviera la información de contacto:</p>
+
+<pre class="brush: html notranslate">&lt;address&gt;
+  &lt;p&gt;Página escrita por &lt;a href="../authors/chris-mills/"&gt;Chris Mills&lt;/a&gt;.&lt;/p&gt;
+&lt;/address&gt;</pre>
+
+<h2 id="Superíndice_y_subíndice">Superíndice y subíndice</h2>
+
+<p>En ocasiones, necesitarás utilizar superíndice y subíndice al marcar elementos como fechas, fórmulas químicas y ecuaciones matemáticas para que tengan el significado correcto. Los elementos {{HTMLElement("sup")}} y {{HTMLElement("sub")}} se ocupan de ello. Por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Nací el 25&lt;sup&gt;th&lt;/sup&gt; de mayo de 2001.&lt;/p&gt;
+&lt;p&gt;La fórmula química de la cafeína es C&lt;sub&gt;8&lt;/sub&gt;H&lt;sub&gt;10&lt;/sub&gt;N&lt;sub&gt;4&lt;/sub&gt;O&lt;sub&gt;2&lt;/sub&gt;.&lt;/p&gt;
+&lt;p&gt;If x&lt;sup&gt;2&lt;/sup&gt; es 9, x debe ser igual 3 o -3.&lt;/p&gt;</pre>
+
+<p>La salida de este código se ve así:</p>
+
+<p>{{ EmbedLiveSample('Superíndice_y_subíndice', '100%', '141px', '', '', 'hide-codepen-jsfiddle') }}</p>
+
+<h2 id="Representación_del_código_informático">Representación del código informático</h2>
+
+<p>Hay una serie de elementos disponibles para marcar código informático usando HTML:</p>
+
+<ul>
+ <li>{{HTMLElement("code")}}: Para marcar fragmentos genéricos de código informático.</li>
+ <li>{{HTMLElement("pre")}}: Para respetar los espacios en blanco (en general, en los bloques de código) — si utilizas la sangría o diversos espacios en blanco consecutivos dentro de un texto, los navegadores los ignorarán y no se mostrarán en la página. Sin embargo, si delimitas el texto con las etiquetas <code>&lt;pre&gt;&lt;/pre&gt;</code>, los espacios en blanco se representarán de forma idéntica a como se ven en tu editor de texto.</li>
+ <li>{{HTMLElement("var")}}: Para marcar específicamente nombres de variables.</li>
+ <li>{{HTMLElement("kbd")}}: Para marcar entradas de teclado (y de otro tipo) en el ordenador.</li>
+ <li>{{HTMLElement("samp")}}: Para marcar la salida de un programa de ordenador.</li>
+</ul>
+
+<p>Veamos algunos ejemplos. Deberías intentar jugar con estos (intenta obtener una copia de nuestro archivo de ejemplo <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/advanced-text-formatting/other-semantics.html">other-semantics.html</a>):</p>
+
+<pre class="brush: html notranslate">&lt;pre&gt;&lt;code&gt;var para = document.querySelector('p');
+
+para.onclick = function() {
+  alert('¡Guau!, ¡deja de apretar!');
+}&lt;/code&gt;&lt;/pre&gt;
+
+&lt;p&gt;No debes utilizar elementos de presentación como &lt;code&gt;&amp;lt;font&amp;gt;&lt;/code&gt; y &lt;code&gt;&amp;lt;center&amp;gt;&lt;/code&gt;.&lt;/p&gt;
+
+&lt;p&gt;En el ejemplo de JavaScript anterior, &lt;var&gt;para&lt;/var&gt; representa un elemento de párrafo.&lt;/p&gt;
+
+
+&lt;p&gt;Selecciona todo el texto con &lt;kbd&gt;Ctrl&lt;/kbd&gt;/&lt;kbd&gt;Cmd&lt;/kbd&gt; + &lt;kbd&gt;A&lt;/kbd&gt;.&lt;/p&gt;
+
+&lt;pre&gt;$ &lt;kbd&gt;ping mozilla.org&lt;/kbd&gt;
+&lt;samp&gt;PING mozilla.org (63.245.215.20): 56 bytes de datos
+64 bytes de 63.245.215.20: icmp_seq=0 ttl=40 time=158.233 ms&lt;/samp&gt;&lt;/pre&gt;</pre>
+
+<p>El código anterior se verá así:</p>
+
+<p>{{ EmbedLiveSample('Representación_del_código_informático','100%',300, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h2 id="Marcar_horas_y_fechas">Marcar horas y fechas</h2>
+
+<p>HTML también proporciona el elemento {{HTMLElement("time")}} para marcar horas y fechas en un formato legible por la máquina. Por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;time datetime="2016-01-20"&gt;20 Enero 2016&lt;/time&gt;
+</pre>
+
+<p>¿Por qué es útil esto? Bueno, hay muchas formas diferentes en que los humanos escriben las fechas. La fecha anterior se podría escribir como:</p>
+
+<ul>
+ <li>20 Enero 2016</li>
+ <li>20th January 2016</li>
+ <li>Ene 20 2016</li>
+ <li>20/01/16</li>
+ <li>01/20/16</li>
+ <li>El 20 del mes que viene</li>
+ <li><span lang="fr">20e Janvier 2016</span></li>
+ <li><span lang="ja">2016年1月20日</span></li>
+ <li>... y así sucesivamente ...</li>
+</ul>
+
+<p>Pero estas diferentes formas no las pueden reconocer fácilmente las computadoras — ¿qué pasaría si quisieras tomar automáticamente las fechas de todos los eventos en una página e insertarlas en un calendario? El elemento {{HTMLElement("time")}} te permite adjuntar una fecha/hora inequívoca y legible por la máquina para este propósito.</p>
+
+<p>El ejemplo básico anterior solo proporciona una fecha simple legible por la máquina, pero hay muchas otras opciones que son posibles, por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;!-- Fecha simple estándar --&gt;
+&lt;time datetime="2016-01-20"&gt;20 Enero 2016&lt;/time&gt;
+&lt;!-- Solo año y mes --&gt;
+&lt;time datetime="2016-01"&gt;Enero 2016&lt;/time&gt;
+&lt;!-- Solo mes y día --&gt;
+&lt;time datetime="01-20"&gt;20 Enero 2016&lt;/time&gt;
+&lt;!-- Solo tiempo, horas y minutos --&gt;
+&lt;time datetime="19:30"&gt;19:30&lt;/time&gt;
+&lt;!-- ¡También puedes hacer segundos y milisegundos! --&gt;
+&lt;time datetime="19:30:01.856"&gt;19:30:01.856&lt;/time&gt;
+&lt;!-- Fecha y hora --&gt;
+&lt;time datetime="2016-01-20T19:30"&gt;7.30pm, 20 Enero 2016&lt;/time&gt;
+&lt;!-- Fecha y hora con desplazamiento de zona horaria --&gt;
+&lt;time datetime="2016-01-20T19:30+01:00"&gt;7.30pm, 20 Enero 2016 es 8.30pm en Francia&lt;/time&gt;
+&lt;!-- Llamar a un número de semana específico --&gt;
+&lt;time datetime="2016-W04"&gt;La cuarta semana de 2016&lt;/time&gt;
+</pre>
+
+<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
+
+<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Puedes encontrar más pruebas para verificar que has retenido esta información antes de continuar; consulta {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_Advanced_HTML_text", "Pon a prueba tus habilidades: Texto HTML avanzado")}}.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Esto marca el final de nuestro estudio de la semántica del texto HTML. Ten en cuenta que lo que has visto durante este curso no es una lista exhaustiva de elementos de texto HTML — quisimos tratar de cubrir los aspectos esenciales y algunos de los más comunes que verás en la naturaleza, o al menos podrían resultarte interesantes. Para encontrar muchos más elementos HTML, puedes echarle un vistazo a nuestra {{web.link("/es/docs/Web/HTML/Element", "referencia de elementos HTML")}} (la {{web.link("/es/docs/Web/HTML/Element#Inline_text_semantics", "La sección Semántica de texto en línea")}} sería un gran lugar para comenzar). En el próximo artículo veremos los elementos HTML que usarás para estructurar las diferentes partes de un documento HTML.</p>
+
+<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
+</ul>
diff --git a/files/es/learn/html/introduction_to_html/creating_hyperlinks/index.html b/files/es/learn/html/introduction_to_html/creating_hyperlinks/index.html
new file mode 100644
index 0000000000..6a1307c5e5
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/creating_hyperlinks/index.html
@@ -0,0 +1,347 @@
+---
+title: Crear hipervínculos
+slug: Learn/HTML/Introduction_to_HTML/Creating_hyperlinks
+tags:
+  - Aprender
+  - CodingScripting
+  - Guía
+  - HTML
+  - HTTP
+  - Novato
+  - Principiante
+  - Title
+  - URL
+  - enlace
+  - hiperenlaces
+  - hipervínculos
+  - href
+  - referencia absoluta
+  - referencia relativa
+  - título
+  - urls
+translation_of: Learn/HTML/Introduction_to_HTML/Creating_hyperlinks
+original_slug: Learn/HTML/Introduccion_a_HTML/Creating_hyperlinks
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">Los hipervínculos (o enlaces) son elementos verdaderamente importantes — son los que hacen que la web sea <em><strong>web</strong></em>. Este artículo expone la sintaxis necesaria para crear un enlace, además contiene un catálogo de buenas prácticas para crearlos.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Estar familiarizado con HTML, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}. Aplicación de formato a texto en documentos HTML, según lo expuesto en la sección {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "fundamentos de texto HTML")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender a implementar un <em>hipervínculo</em> de forma efectiva y enlazar múltiples archivos.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_un_hipervínculo">¿Qué es un hipervínculo?</h2>
+
+<p>Los hipervínculos son una de las innovaciones más interesantes que ofrece la Web. Han formado parte de esta desde el principio, pero hacen que la web sea <em>web </em>: Los hipervínculos nos permiten vincular documentos a otros documentos o recursos, vincular a partes específicas de documentos o hacer que las aplicaciones estén disponibles en una dirección web. Prácticamente cualquier contenido web se puede convertir en un enlace que, al pulsarlo (activarlo), dirija el navegador a la dirección web a la que apunta el enlace ({{Glossary("URL")}}).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Una URL puede apuntar a archivos HTML, archivos de texto, imágenes, documentos de texto, archivos de audio o vídeo, y cualquier otra cosa que se pueda mostrar en la web. Si el navegador no sabe cómo manejar el archivo, te preguntará si lo quieres abrir (en cuyo caso la tarea de abrirlo y manejarlo se transferirá a la aplicación nativa instalada en el dispositivo) o si lo quieres descargar (en cuyo caso podrás ocuparte de él más tarde).</p>
+</div>
+
+<p>El sitio web de la BBC, por ejemplo, contiene una gran cantidad de enlaces que apuntan a multitud de noticias en diferentes zonas de el sitio (funcionalidad de navegación), zonas de acceso/registro (herramientas de usuario) y otras.</p>
+
+<p><img alt="Portada de bbc.co.uk, que muestra muchas noticias y la funcionalidad del menú de navegación" src="https://mdn.mozillademos.org/files/12405/bbc-homepage.png" style="display: block; margin: 0 auto;"></p>
+
+<h2 id="Anatomía_de_un_enlace">Anatomía de un enlace</h2>
+
+<p>Un enlace básico se crea incluyendo el texto (o cualquier otro contenido, ve {{anch("Convertir bloques de contenido en enlaces")}}), que queramos convertir en un enlace usando un elemento ancla {{HTMLElement("a")}}, dándole un atributo {{HTMLAttrxRef("href", "a")}} (también conocido como «<strong><em>Hypertext Reference</em></strong>», «<strong><em>target</em></strong>» u <strong>objetivo</strong>) que contendrá la dirección web hacia dónde queremos que apunte el enlace.</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Crea un enlace a
+&lt;a href="https://www.mozilla.org/es-ES/"&gt;la página de inicio de Mozilla&lt;/a&gt;.
+&lt;/p&gt;</pre>
+
+<p>Este código producirá el siguiente resultado:</p>
+
+<p>Crea un enlace a <a class="ignore-external" href="https://www.mozilla.org/es-ES/">la página de inicio de Mozilla</a>.</p>
+
+<h3 id="Añadir_información_de_asistencia_con_el_atributo_title">Añadir información de asistencia con el atributo <code>title</code></h3>
+
+<p>Otro atributo que posiblemente quieras agregar a tus enlaces es <code>title</code>. El título contiene información adicional sobre el enlace, como qué tipo de información contiene la página o cosas que debes tener en cuenta en el sitio web.</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Crea un enlace a
+&lt;a href="https://www.mozilla.org/es-ES/"
+   title="El mejor lugar para encontrar más información acerca de la misión de Mozilla
+          y cómo contribuir"&gt;la página de inicio de Mozilla&lt;/a&gt;.
+&lt;/p&gt;</pre>
+
+<p>Este código producirá el siguiente resultado (el título se mostrará al pasar el ratón sobre el texto del enlace):</p>
+
+<p>Crea un enlace a <a class="ignore-external" href="https://www.mozilla.org/es-ES/" title="El mejor lugar para encontrar más información sobre la misión de Mozilla y cómo contribuir">la página de inicio de Mozilla</a>.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El título de un enlace solo será visible al pasar el ratón por encima, lo cual significa que los usuarios que naveguen usando los controles de sus teclados, o pantallas táctiles, tendrán dificultades para acceder a la información proporcionada por el título. Si la información del título es verdaderamente importante para el uso de la página, deberemos presentar el título de manera que sea accesible a todos los usuarios, por ejemplo incluyéndola como parte del texto del enlace.</p>
+</div>
+
+<h3 id="Aprendizaje_activo_crea_tu_propio_ejemplo_de_enlace">Aprendizaje activo: crea tu propio ejemplo de enlace</h3>
+
+<p>Es momento del aprendizaje activo — crea un documento HTML con tu editor de código (nuestra <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">plantilla de aprendizaje</a> te hará la tarea más llevadera).</p>
+
+<ul>
+ <li>En el cuerpo del HTML (<code>body</code>), añade uno o más párrafos o cualquier otro tipo de contenido de los que ya conoces.</li>
+ <li>Convierte algún texto en enlaces.</li>
+ <li>Incluye atributos de título (<code>title</code>).</li>
+</ul>
+
+<h3 id="Convertir_bloques_de_contenido_en_enlaces">Convertir bloques de contenido en enlaces</h3>
+
+<p>Como hemos mencionado anteriormente, puedes convertir cualquier contenido en un enlace, incluso {{web.link("/es/docs/Learn/HTML/Getting_started#Elementos_de_bloque_y_elementos_en_línea", "Elementos de bloque y elementos en línea")}}. Si quieres convertir una imagen en un enlace, simplemente usa el elemento {{HTMLElement("a")}} encerrando el elemento {{HTMLElement("img")}} entre <code>&lt;a&gt;</code> y <code>&lt;/a&gt;</code>.</p>
+
+<pre class="brush: html notranslate">&lt;a href="https://www.mozilla.org/es-ES/"&gt;
+  &lt;img src="mozilla-image.png" alt="Logotipo de Mozilla que dirige a la página inicial de Mozilla"&gt;
+&lt;/a&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Encontrarás mucho más sobre el manejo de imágenes en próximos artículos en esta web.</p>
+</div>
+
+<h2 id="Primer_acercamiento_a_URLs_y_rutas">Primer acercamiento a URLs y rutas</h2>
+
+<p>Para comprender completamente a dónde apuntan los enlaces, necesitas conocer las URLs y las rutas. En esta sección encontrarás la información que necesitas sobre el tema.</p>
+
+<p>Una localizadora uniforme de recursos (URL, de las iniciales en inglés de «<em>Uniform Resource Locator</em>») es simplemente una secuencia de caracteres de texto que definen donde está situado algo en la web. Por ejemplo, la página de Mozilla está ubicada en <code>https://www.mozilla.org/es-ES/</code>.</p>
+
+<p>Las URLs utilizan rutas para encontrar los archivos. Las rutas especifican dónde se encuentra el archivo que buscas dentro del sistema de archivos. Veamos un ejemplo de una estructura de directorios (ve el directorio <a href="https://github.com/mdn/learning-area/tree/master/html/introduction-to-html/creating-hyperlinks">creating-hyperlinks</a>).</p>
+
+<p><img alt="Una estructura de directorios simple. El directorio principal se llama creating-hyperlinks y contiene dos archivos llamados index.html y contacts.html, y dos directorios llamados projects y pdfs, que contiene un archivo index.html y un archivo project-brief.pdf, respectivamente" src="https://mdn.mozillademos.org/files/12409/simple-directory.png" style="display: block; margin: 0 auto;"></p>
+
+<p>Al directorio <strong>raíz</strong> de esta estructura de directorios lo hemos llamado <code>creating-hyperlinks</code>. Al trabajar en modo local en una web, habrá un directorio que contendrá toda la información. En nuestro ejemplo, dentro de la raíz, encontramos el archivo <code>index.html</code> y el archivo <code>contacts.html</code>. En una web real, <code>index.html</code> es el punto de entrada a la web, lo que se conoce como <em>página de inicio</em>.</p>
+
+<p>Observamos también dos directorios dentro de nuestro directorio raíz que son: <code>pdfs</code> y <code>projects</code>. Cada uno de ellos tiene archivos en su interior — un archivo PDF (<code>project-brief.pdf</code>) y un archivo <code>index.html</code>, respectivamente. Observa que es posible tener sin problemas dos archivos <code>index.html</code> en un proyecto siempre y cuando se encuentren alojados en ubicaciones diferentes de nuestra estructura de archivos — muchos sitios web lo hacen. El segundo <code>index.html</code> será la página de inicio para la información relativa a los proyectos.</p>
+
+<ul>
+ <li>
+  <p><strong>En el mismo directorio</strong>: Si queremos incluir un hipervínculo dentro del archivo <code>index.html</code> (el <code>index.html</code> del nivel más alto) que apunte al archivo <code>contacts.html</code>, simplemente especificaremos el nombre del archivo al que hacemos referencia, porque se encuentra en el mismo directorio en el que se encuentra el archivo <code>index.html</code> desde donde lo queremos llamar. Por lo tanto, usamos la URL <code>contacts.html</code> — veamos el código:</p>
+
+  <pre class="brush: html notranslate">&lt;p&gt;¿Quieres contactar con un miembro específico del personal?
+Encuentra los detalles en nuestra &lt;a href="contacts.html"&gt;página de contactos&lt;/a&gt;.&lt;/p&gt;</pre>
+ </li>
+ <li>
+  <p><strong>Bajando por la estructura de subdirectorios</strong>: Si queremos incluir un hipervínculo dentro del archivo <code>index.html</code> (el <code>index.html</code> de nivel más alto) que apunta a <code>projects/index.html</code>, debemos bajar hasta el directorio <code>projects</code> antes de indicar al archivo al que queremos enlazar. Para ello especificamos el nombre del directorio y le añadimos una barra inclinada hacia adelante, y a continuación el nombre del archivo. Por lo tanto, utilizaremos la URL <code>projects/index.html</code>:</p>
+
+  <pre class="brush: html notranslate">&lt;p&gt;Visita mi &lt;a href="projects/index.html"&gt;página de inicio del proyecto&lt;/a&gt;.&lt;/p&gt;</pre>
+ </li>
+ <li>
+  <p><strong>Subiendo por nuestro sistema de directorios</strong>: Si ahora queremos incluir un hipervínculo dentro del archivo <code>projects/index.html</code> que apunte a <code>pdfs/project-brief.pdf</code>, hay que subir un nivel en nuestro sistema de directorios, para luego bajar al directorio <code>pdf</code>. Para «Subir un nivel» utilizamos los dos puntos — (<code>..</code>) — por lo que usamos la URL <code>../pdfs/project-brief.pdf</code>:</p>
+
+  <pre class="brush: html notranslate">&lt;p&gt;Un enlace a mi&lt;a href="../pdfs/project-brief.pdf"&gt;resumen del proyecto&lt;/a&gt;.&lt;/p&gt;</pre>
+ </li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Podemos combinar más de una instancia de estas características y generar URLs más complejas, si es necesario, por ejemplo: <code>../../../ruta/compleja/a/mi/archivo.html</code>.</p>
+</div>
+
+<h3 id="Fragmentos_de_documento">Fragmentos de documento</h3>
+
+<p>Es posible apuntar hacia una parte concreta de un documento HTML en vez de a todo un documento. Para ello hay que asignar previamente un atributo {{HTMLAttrxRef("id")}} al elemento hacia el que apuntamos. Esto se debe hacer en el encabezado y quedará así:</p>
+
+<pre class="brush: html notranslate">&lt;h2 id="Dirección_de_envío"&gt;Dirección de envío&lt;/h2&gt;</pre>
+
+<p>Posteriormente para hacer referencia a este <code>id</code> concreto, lo añadiremos al final de la URL precedido por una almohadilla — veamos el ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;¿Quieres mandarnos una carta? Aquí tienes nuestra &lt;a href="contacts.html#Dirección_de_envío"&gt;Dirección de envío&lt;/a&gt;.&lt;/p&gt;</pre>
+
+<p>También podemos usar esta referencia a un fragmento de documento para apuntar hacia otra <em>parte del mismo documento</em>:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;La &lt;a href="#Dirección_de_envío"&gt;Dirección de envío de la empresa&lt;/a&gt; se encuentra al final de esta página.&lt;/p&gt;</pre>
+
+<h3 id="URLs_absolutas_y_relativas">URLs absolutas y relativas</h3>
+
+<p>Dos términos que encontrarás en la Web son <strong>URL absoluta</strong> y <strong>URL relativa:</strong></p>
+
+<p><strong>URL absoluta</strong>: Hace referencia a una dirección definida por su ubicación absoluta en la web, esta incluye el {{Glossary("protocol", "protocolo")}} y el {{Glossary("domain name", "nombre del dominio")}}. Por ejemplo, si subes una página de inicio <code>index.html</code> a un directorio llamado <code>projects</code> que se encuentra dentro de la raíz de un servidor web, y el dominio del sitio web es <code>http://www.example.com</code>, se podrá acceder a la página desde <code>http://www.example.com/projects/index.html</code> (o simplemente <code>http://www.example.com/projects/</code>, ya que la mayoría de los servidores web buscan la página de inicio <code>index.html</code> para cargarla por omisión si no se les especifica otra en la URL).</p>
+
+<p>Una URL absoluta siempre apuntará a la misma dirección, sin importar desde dónde se utilice.</p>
+
+<p>Una <strong>URL relativa</strong>: Hace referencia a una dirección que depende de la posición del archivo desde donde se utiliza — son las que vimos en la sección anterior. Por ejemplo, si desde un archivo ubicado en <code>http://www.example.com/projects/index.html</code> queremos enlazar hacia un archivo PDF ubicado en el mismo directorio, la URL sería simplemente el nombre del archivo (por ejemplo: <code>project-brief.pdf</code>) no necesitamos más información. Si el archivo PDF está situado en un subdirectorio dentro de <code>projects</code> llamado <code>pdfs</code>, la URL relativa es: <code>pdfs/project-brief.pdf</code> (la URL absoluta equivalente sería: <code>http://www.example.com/projects/pdfs/project-brief.pdf</code>).</p>
+
+<p>Una URL relativa hará referencia a diferentes direcciones según dónde se encuentre el archivo desde el cual se utiliza — por ejemplo, si movemos nuestro archivo <code>index.html</code> del directorio <code>projects</code> a la raíz del sitio web (el nivel más alto, no cualquiera de los otros directorios), la URL relativa <code>pdfs/project-brief.pdf</code> ahora hará referencia a <code>http://www.example.com/pdfs/project-brief.pdf</code>, en lugar de a <code>http://www.example.com/projects/pdfs/project-brief.pdf</code>.</p>
+
+<p>Por supuesto, la ubicación del archivo <code>pdfs/project-brief.pdf</code> y del directorio <code>pdfs</code> no cambian de repente cuando mueves el archivo <code>index.html</code>; esto hará que tus enlaces apunten a un sitio equivocado y no funcionarán correctamente al hacer clic en ellos. ¡Por lo tanto debes tener cuidado!</p>
+
+<h2 id="Buenas_prácticas_en_el_uso_de_los_enlaces">Buenas prácticas en el uso de los enlaces</h2>
+
+<p>Hay algunas buenas prácticas que debemos respetar cuando escribimos enlaces. Veamos cuáles son.</p>
+
+<ul>
+</ul>
+
+<h3 id="Redacción_clara_del_enlace">Redacción clara del enlace</h3>
+
+<p>Es fácil rellenar de enlaces una página, sin más. Pero esto no basta. Hay que lograr que nuestros enlaces sean <em>accesibles</em> para todo tipo de lectores, sin importar el contexto o las herramientas que prefieran. Por ejemplo:</p>
+
+<ul>
+ <li>Los usuarios de lectores de pantalla suelen saltar de enlace a enlace en la página y los leen todos sin contexto.</li>
+ <li>Los motores de búsqueda utilizan el texto de los enlaces para indizar los archivos buscados, por lo que es una buena idea incluir palabras clave al definir el texto de los enlaces para describir de forma efectiva el sitio al que apuntan.</li>
+ <li>Los usuarios visuales suelen echar un vistazo rápido a la página y leen solo lo que les interesa, en lugar de leer todo el texto palabra por palabra, y sus miradas van directamente a las características destacadas de la página, como son los enlaces. Este tipo de usuarios encuentra útiles los textos descriptivos que estos contienen.</li>
+</ul>
+
+<p>Veamos un ejemplo concreto:</p>
+
+<p><em><strong>Buen</strong> texto en un enlace</em>: <a href="https://firefox.com">Descargar Firefox</a></p>
+
+<pre class="brush: html notranslate">&lt;p&gt;&lt;a href="https://firefox.com/"&gt;
+  Descargar Firefox
+&lt;/a&gt;&lt;/p&gt;</pre>
+
+<p><em><strong>Mal</strong> texto en un enlace</em>: <a href="https://firefox.com/">Pulsar aquí</a> para descargar Firefox</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;&lt;a href="https://firefox.com/"&gt;
+  Haz clic aquí
+&lt;/a&gt;
+para descargar Firefox&lt;/p&gt;
+</pre>
+
+<p>Otras indicaciones:</p>
+
+<ul>
+ <li>No repetir la URL como parte del texto — Las URLs suenan horrible, y todavía suenan peor si las lee un lector de pantalla, letra por letra.</li>
+ <li>No escribir «<em>link</em>» o «<em>link a</em>» o «enlace» o «enlace a» en el texto del enlace porque es redundante. Los lectores automáticos indican que hay un enlace al encontrarlo. Los usuarios también saben que hay un enlace, porque normalmente se suele cambiar el color del texto y se subraya (no hay que romper esta convención, porque los usuarios están acostumbrados a ella).</li>
+ <li>Redacta la etiqueta del enlace de la manera más breve y concisa posible — los textos de enlace largos son especialmente molestos para los usuarios que utilizan lectores automáticos, porque tienen que escuchar todo el texto del enlace.</li>
+ <li>Minimiza los casos en los que varias copias del mismo texto están vinculadas a diferentes lugares. Esto puede causar problemas a los usuarios de lectores de pantalla, si hay una lista de enlaces fuera de contexto que están etiquetados como "haz clic aquí", "haz clic aquí", "haz clic aquí".</li>
+</ul>
+
+<h3 id="Utiliza_enlaces_relativos_siempre_que_sea_posible">Utiliza enlaces relativos siempre que sea posible</h3>
+
+<p>A partir de las indicaciones anteriores podemos llegar a pensar que es mejor utilizar referencias absolutas en todos los casos; después de todo, estas no se rompen cuando la página se traslada como ocurre con las referencias relativas. Sin embargo, debes utilizar enlaces relativos siempre que sea posible cuando enlaces a otras ubicaciones dentro del <em>mismo sitio web</em>. Cuando vinculas a otro sitio web, deberás utilizar un vínculo absoluto.</p>
+
+<ul>
+ <li>Primero, porque el código es mucho más fácil de leer — las URLs relativas suelen ser mucho más cortas que las absolutas, lo que hace que el código sea mucho más fácil de leer.</li>
+ <li>Segundo, resulta más eficiente utilizar URLs relativas cuando sea posible. Cuando usas una URL absoluta, el navegador comienza buscando la ubicación real del servidor en el Sistema de nombres de dominio ({{Glossary("DNS")}}), consulta {{web.link("/es/docs/Learn/Getting_started_with_the_web/How_the_Web_works", "Cómo funciona la web")}} para obtener más información). Entonces va a ese servidor y busca el archivo solicitado. En cambio, con una URL relativa, el navegador simplemente busca el archivo solicitado en el mismo servidor. Si usas URLs absolutas donde las URLs relativas lo harían, constantemente estás haciendo que tu navegador haga un trabajo adicional, lo cual significa que funcionará de manera menos eficiente.</li>
+</ul>
+
+<h3 id="Indica_claramente_los_recursos_no_HTML">Indica claramente los recursos no HTML</h3>
+
+<p>Cuando damos referencias a recursos para descargarlos (como documentos en formato PDF o Word) o para reproducirlos (como archivos de audio o vídeo) o que tengan un efecto inesperado (una ventana emergente) hay que indicarlo para no confundir al usuario.</p>
+
+<p>Por ejemplo:</p>
+
+<ul>
+ <li>Si tienes una conexión con poco ancho de banda, pulsas un enlace y comienza a descargar un archivo pesado de forma inesperada.</li>
+ <li>Si no tienes instalado el reproductor Flash, pulsas un enlace y te conduce a una página que requiere Flash.</li>
+</ul>
+
+<p>Veamos algunos ejemplos, para ver qué texto puede ser aconsejable en estos casos:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;&lt;a href="http://www.example.com/large-report.pdf"&gt;
+  Descarga el informe de ventas (PDF, 10MB)
+&lt;/a&gt;&lt;/p&gt;
+
+&lt;p&gt;&lt;a href="http://www.example.com/video-stream/"&gt;
+  Reproduce el vídeo (el flujo de datos se abre en una pestaña independiente, calidad HD)
+&lt;/a&gt;&lt;/p&gt;
+
+&lt;p&gt;&lt;a href="http://www.example.com/car-game"&gt;
+  Juega al juego del automóvil (requiere Flash)
+&lt;/a&gt;&lt;/p&gt;</pre>
+
+<h3 id="Utiliza_el_atributo_download_al_enlazar_una_descarga">Utiliza el atributo <code>download</code> al enlazar una descarga</h3>
+
+<p>Si queremos hacer referencia a una descarga en lugar de a algo que abra el navegador, disponemos del atributo <code>download</code> para proporcionar un nombre predeterminado al archivo a guardar. Veamos un ejemplo con un enlace a la descarga de la versión para Windows de Firefox:</p>
+
+<pre class="brush: html notranslate">&lt;a href="https://download.mozilla.org/?product=firefox-latest-ssl&amp;os=win64&amp;lang=es-MX"
+   download="firefox-latest-64bit-installer.exe"&gt;
+  Descarga la última versión de Firefox para Windows (64 bits) (Español, es-MX)
+&lt;/a&gt;</pre>
+
+<h2 id="Aprendizaje_activo_crear_un_menú_de_navegación">Aprendizaje activo: crear un menú de navegación</h2>
+
+<p>Para este ejercicio, deberás crear lo que se conoce como <em>web multipágina</em>: un menú de navegación con enlaces a distintas páginas. Esta es una manera común de crear páginas web — usamos la misma estructura en todas las páginas, incluida la que contiene el menú de navegación. Cuando los usuarios pulsen los enlaces tendrán la sensación de que están en la misma página y que solo cambia el contenido mostrado.</p>
+
+<p>Tendrás que hacer copias locales, en el mismo directorio, de las cuatro siguientes páginas (revisa el directorio <a href="https://github.com/mdn/learning-area/tree/master/html/introduction-to-html/navigation-menu-start">navigation-menu-start</a> para el listado completo):</p>
+
+<ul>
+ <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/index.html">index.html</a></li>
+ <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/projects.html">projects.html</a></li>
+ <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/pictures.html">pictures.html</a></li>
+ <li><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/navigation-menu-start/social.html">social.html</a></li>
+</ul>
+
+<p>A continuación:</p>
+
+<ol>
+ <li>Añade una lista no ordenada en el lugar adecuado de la página, que contenga los nombres de las páginas a las que enlazas. Un menú de navegación normalmente es una lista de enlaces (<em>links</em>), por lo que esto es semánticamente correcto.</li>
+ <li>Convierte cada nombre en un enlace a esa página.</li>
+ <li>Copia el menú de navegación en cada una de las páginas.</li>
+ <li>En cada página, elimina solo el enlace que hace referencia a sí mismo (es confuso y no tiene sentido que una página se llame a sí misma, y la falta del enlace actúa como recordatorio de la página en la que se está en cada momento).</li>
+</ol>
+
+<p>El ejercicio terminado debería crear una página como la siguiente:</p>
+
+<p><img alt="Un ejemplo de un menú de navegación HTML simple, con inicio, imágenes, proyectos y elementos del menú social" src="https://mdn.mozillademos.org/files/12411/navigation-example.png" style="display: block; margin: 0 auto;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si ahora encallas, o no estás seguro de haberlo conseguido, revisa el directorio <a href="https://github.com/mdn/learning-area/tree/master/html/introduction-to-html/navigation-menu-marked-up">navigation-menu-marked-up</a> para ver la respuesta correcta.</p>
+</div>
+
+<h2 id="Enlace_a_correo_electrónico">Enlace a correo electrónico</h2>
+
+<p>Es posible crear enlaces o botones que, cuando se pulsan, abren un nuevo correo saliente en lugar de enlazar a un recurso o página. Esto se consigue con el elemento ancla {{HTMLElement("a")}} y el elemento <code>mailto:</code> seguido del esquema de la URL.</p>
+
+<p>En su forma más básica, un enlace <code>mailto:</code> simplemente contiene la dirección de correo electrónico de los destinatarios. Por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;a href="mailto:nowhere@mozilla.org"&gt;Enviar correo electrónico a ninguna parte&lt;/a&gt;
+</pre>
+
+<p>Esto da como resultado un enlace que se ve así: <a href="mailto:nowhere@mozilla.org"> Enviar correo electrónico a ninguna parte</a>.</p>
+
+<p>De hecho, incluso el atributo con la dirección de correo electrónico es opcional. Si lo omites y tu ({{HTMLAttrxRef("href", "a")}} simplemente es "mailto:", aparecerá una nueva ventana de correo saliente en el gestor de correo sin la dirección del destinatario. Esto es útil cuando queremos compartir enlaces que los usuarios puedan pulsar para enviar un correo electrónico y elegir un destinatario posteriormente.</p>
+
+<h3 id="Especificar_detalles">Especificar detalles</h3>
+
+<p>Además de la dirección de correo electrónico, puedes proporcionar otra información. De hecho, puedes incluir cualquier campo estándar contenido en el encabezado de cualquier mensaje en la URL <code>mailto</code> que proporciones. Los más utilizados son el «<code>subject</code>» (asunto), «<code>cc</code>» (con copia a) o «<code>bcc</code>» (copia oculta), y «<code>body</code>» (cuerpo del mensaje, que no es realmente un campo de la cabecera, pero permite especificar un mensaje breve para el nuevo correo electrónico). Cada campo y su valor se especifican como un argumento de la consulta.</p>
+
+<p>Veamos un ejemplo que incluye estos campos:</p>
+
+<pre class="brush: html notranslate">&lt;a href="mailto:nowhere@mozilla.org?cc=name2@rapidtables.com&amp;bcc=name3@rapidtables.com&amp;subject=The%20subject%20of%20the%20email&amp;body=The%20body%20of%20the%20email"&gt;
+  Enviar un correo electrónico cc, bcc, asunto y cuerpo
+&lt;/a&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Los valores de cada campo deben tener la URL codificada, es decir, sin caracteres no imprimibles (caracteres invisibles, tabulaciones, retornos de carro y saltos de página) y espacios con codificación porcentual (%20) {{Interwiki("wikipedia", "Código porciento")}}. También hay que tener en cuenta el uso del signo de interrogación (?) para separar la URL principal de los valores de los campos, y el símbolo ampersand (&amp;) para separar cada campo dentro del enlace <code>mailto:</code>. Esta es la notación de consulta URL estándar. Lee {{web.link("/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data#The_GET_method", "el método GET")}} para comprender mejor qué notación de consulta URL se usa comúnmente.</p>
+</div>
+
+<p>A continuación otros ejemplos de utilización de enlaces <code>mailto</code>:</p>
+
+<ul>
+ <li><a href="mailto:">mailto:</a></li>
+ <li><a href="mailto:nowhere@mozilla.org">mailto:nowhere@mozilla.org</a></li>
+ <li><a href="mailto:nowhere@mozilla.org,nobody@mozilla.org">mailto:nowhere@mozilla.org,nobody@mozilla.org</a></li>
+ <li><a href="mailto:nowhere@mozilla.org?cc=nobody@mozilla.org">mailto:nowhere@mozilla.org?cc=nobody@mozilla.org</a></li>
+ <li><a href="mailto:nowhere@mozilla.org?cc=nobody@mozilla.org&amp;subject=This%20is%20the%20subject">mailto:nowhere@mozilla.org?cc=nobody@mozilla.org&amp;subject=This%20is%20the%20subject</a></li>
+</ul>
+
+<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
+
+<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Encuentra más ejercicios con los que comprobar que has retenido esta información antes de seguir adelante; consulta {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_Links", "Pon a prueba tus habilidades: Enlaces")}}.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Eso es todo en cuanto a enlaces, ¡por ahora! Volveremos a ellos más tarde en este curso cuando comencemos a usar estilos. Lo siguiente en HTML, será aprender la semántica de texto para usar algunas características avanzadas/inusuales que nos serán utilidad — Formato de texto avanzado será la próxima parada.</p>
+
+<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
+</ul>
diff --git a/files/es/learn/html/introduction_to_html/debugging_html/index.html b/files/es/learn/html/introduction_to_html/debugging_html/index.html
new file mode 100644
index 0000000000..d647a6db17
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/debugging_html/index.html
@@ -0,0 +1,172 @@
+---
+title: Depurar el HTML
+slug: Learn/HTML/Introduction_to_HTML/Debugging_HTML
+tags:
+  - Error
+  - Guía
+  - HTML
+  - Principiante
+  - Validación
+  - Validador
+  - depurar
+  - programar
+translation_of: Learn/HTML/Introduction_to_HTML/Debugging_HTML
+original_slug: Learn/HTML/Introduccion_a_HTML/Debugging_HTML
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">Escribir HTML es fácil, pero ¿qué pasa si algo va mal y desconocemos dónde está el error de codificación? En este artículo veremos varias herramientas que nos ayudarán a arreglar errores en HTML.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Estar familiarizado con los principios básicos de HTML, como los vistos en el apartado <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/iniciar">Empezar con el HTML</a>, <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/texto">Conocimientos básicos de aplicación de formato a textos con HTML</a> y <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/Creating_hyperlinks">Creación de hiperenlaces</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender el funcionamiento básico de las herramientas de depuración de problemas de código en HTML.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Depurar_no_debe_asustarnos">Depurar no debe asustarnos</h2>
+
+<p>Cuando escribimos cualquier tipo de código, normalmente todo va bien, hasta ese fatídico momento en el que ocurre un error, hemos hecho algo mal y el código no funciona, o no funciona del todo, no lo suficientemente bien. Por ejemplo, el dibujo siguiente muestra un error de {{glossary("compile","compilación")}} de un programa sencillo escrito en lenguaje <a href="https://www.rust-lang.org/">Rust</a>.</p>
+
+<p><img alt="A console window showing the result of trying to compile a rust program with a missing quote around a string in a print statement. The error message reported is error: unterminated double quote string." src="https://mdn.mozillademos.org/files/12435/error-message.png" style="display: block; height: 520px; margin: 0px auto; width: 711px;">En el ejemplo, el mensaje de error es fácilmente comprensible: "unterminated double quote string" (comillas sin cerrar en el texto). Si analizamos el listado de código, observamos que en <code>println!(Hello, world!");</code> faltan una comillas. Pero, los mensajes de error pueden complicarse con facilidad y su interpretación ser menos sencilla a medida que los programas aumentan en tamaño, e incluso casos sencillo pueden llegar a intimidar a alguien que no sabe nada de Rust.</p>
+
+<p>Sin embargo, la depuración no nos debe asustar; la clave para sentirnos cómodos con la escritura y la depuración de cualquier lenguaje o código es la familiaridad, tanto con el lenguaje como con las herramientas.</p>
+
+<h2 id="HTML_y_depuración">HTML y depuración</h2>
+
+<p>HTML no es tan complicado de entender como Rust; HTML no se compila por separado antes de que el navegador lo analice (se interpreta, no se compila). Y la sintaxis de los {{glossary("element","elementos")}} de HTML es mucho más sencilla de entender que la de cualquier lenguaje de programación real como Rust, {{glossary("JavaScript")}} o {{glossary("Python")}}. La forma en que los navegadores ejecutan HTML es más <strong>permisiva</strong> que la de los otros lenguajes, cosa que es buena y mala a la vez.</p>
+
+<h3 id="Código_permisivo">Código permisivo</h3>
+
+<p>¿Qué queremos decir con <em>permisivo</em>? Bien, normalmente cuando hacemos algo mal al codificar, suele haber dos tipos de error:</p>
+
+<ul>
+ <li><strong>Errores sintácticos</strong>: Son errores de escritura en el código que impiden que el programa funcione, como el error en Rust de arriba. Suelen ser fáciles de arreglar si estamos familiarizados con las herramientas adecuadas y sabemos el significado de los mensajes de error.</li>
+ <li><strong>Errores lógicos</strong>: En estos errores la sintaxis es correcta, pero el código no hace lo que debería, por lo que el programa funciona de forma incorrecta. Estos errores son, por lo general, más difíciles de solucionar que los sintácticos, porque no hay mensajes de error que nos avisen de ellos.</li>
+</ul>
+
+<p>HTML en sí mismo no suele producir errores sintácticos porque los navegadores son permisivos con ellos; o sea, el código se sigue ejecutando ¡aun si hay errores! Los navegadores disponen de reglas internas para saber cómo interpretar los errores de marcado incorrecto que encuentran, y seguirán funcionando aunque no produzcan el resultado esperado. Esto puede también ser un problema, por supuesto.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: La ejecución de HTML es permisiva porque cuando se creó la web por primera vez, se decidió que el hecho de permitir que la gente publicara su contenido era más importante que el hecho de que la sintaxis fuera totalmente correcta. La web no sería tan popular como lo es hoy en día si se hubiera sido más estricto desde el primer momento.</p>
+</div>
+
+<h3 id="Aprendizaje_activo_Estudio_del_código_permisivo">Aprendizaje activo: Estudio del código permisivo</h3>
+
+<p>Es hora de estudiar la naturaleza permisiva del código HTML por nosotros mismos.</p>
+
+<ol>
+ <li>En primer lugar, hagamos una copia de nuestro <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/debugging-html/debug-example.html">ejemplo-demo a depurar</a> y guardémoslo de forma local. Está escrito para generar diversos errores que deberemos descubrir (se dice que el marcado de HTML está <strong>mal formado</strong>, en contraposición a un marcado <strong>bien formado</strong>).</li>
+ <li>A continuación, abrámoslo en un navegador; veremos lo siguiente:<img alt="A simple HTML document with a title of HTML debugging examples, and some information about common HTML errors, such as unclosed elements, badly nested elements, and unclosed attributes. " src="https://mdn.mozillademos.org/files/12437/badly-formed-html.png" style="display: block; margin: 0 auto;"></li>
+ <li>No parece que esté bien; veamos el código fuente para ver qué podemos hacer (solo mostramos el contenido del &lt;body&gt;):
+  <pre class="brush: html notranslate">&lt;h1&gt;HTML debugging examples&lt;/h1&gt;
+
+&lt;p&gt;What causes errors in HTML?
+
+&lt;ul&gt;
+  &lt;li&gt;Unclosed elements: If an element is &lt;strong&gt;not closed properly,
+      then its effect can spread to areas you didn't intend
+
+  &lt;li&gt;Badly nested elements: Nesting elements properly is also very important
+      for code behaving correctly. &lt;strong&gt;strong &lt;em&gt;strong emphasised?&lt;/strong&gt;
+      what is this?&lt;/em&gt;
+
+  &lt;li&gt;Unclosed attributes: Another common source of HTML problems. Let's
+      look at an example: &lt;a href="https://www.mozilla.org/&gt;link to Mozilla
+      homepage&lt;/a&gt;
+&lt;/ul&gt;</pre>
+ </li>
+ <li>Veamos qué problemas podemos descubrir:
+  <ul>
+   <li>El elemento {{htmlelement("p")}} y el {{htmlelement("li")}} no tienen etiquetas de cierre. Si comprobamos el resultado, no parece que haya generado un efecto grave en la representación del lenguaje de marcado, porque es fácil deducir que donde un elemento acaba, debería comenzar otro.</li>
+   <li>El primer elemento {{htmlelement("strong")}} no tiene etiqueta de cierre. Este resulta ser un poco más problemático porque no es fácil deducir dónde se supone que termina el elemento. De hecho, el énfasis fuerte se ha aplicado al resto del texto.</li>
+   <li>Esta sección está mal anidada: <code>&lt;strong&gt;strong &lt;em&gt;strong emphasised?&lt;/strong&gt; what is this?&lt;/em&gt;</code>. No es fácil de explicar la forma en que ha sido interpretado, debido al problema anterior.</li>
+   <li>Al valor del atributo {{htmlattrxref("href","a")}} le faltan las comillas de cierre. Esto parece haber causado el problema más grave: el enlace ha desaparecido totalmente.</li>
+  </ul>
+ </li>
+ <li>Ahora veamos lo que el navegador ha mostrado en contraposición al código fuente. Para ello podemos usar las herramientas de desarrollo del navegador. Si no estamos familiarizados con el uso de estas herramientas, echemos un vistazo rápido a <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">Descubrir las herramientas de desarrollo del navegador</a>, y luego continuaremos.</li>
+ <li>En el inspector de objetos (DOM), puedes comprobar la apariencia de cada elemento: <img alt="The HTML inspector in Firefox, with our example's paragraph highlighted, showing the text &quot;What causes errors in HTML?&quot; Here you can see that the paragraph element has been closed by the browser." src="https://mdn.mozillademos.org/files/12439/html-inspector.png" style="display: block; margin: 0 auto;"></li>
+ <li>Vamos a explorar nuestro código en detalle con el inspector de objetos DOM para ver cómo el navegador ha arreglado nuestros errores de código HTML (lo hemos hecho con Firefox; otros navegadores modernos deberían conducir al mismo resultado):
+  <ul>
+   <li>Se han añadido etiquetas de cierre a los párrafos y las líneas de las listas.</li>
+   <li>Al no estar claro el final del elemento <code>&lt;strong&gt;</code>, el navegador lo ha aplicado individualmente a todos los bloques de texto siguientes, a cada uno le ha añadido su etiqueta <code>strong</code> propia, desde donde está ¡hasta el final del documento!</li>
+   <li>El navegador ha arreglado el anidamiento incorrecto del modo siguiente:
+    <pre class="brush: html notranslate">&lt;strong&gt;strong
+  &lt;em&gt;strong emphasised?&lt;/em&gt;
+&lt;/strong&gt;
+&lt;em&gt; what is this?&lt;/em&gt;</pre>
+   </li>
+   <li>El enlace a cuyo atributo le faltan las comillas del final ha sido ignorado. La última lista la ha dejado como sigue:
+    <pre class="brush: html notranslate">&lt;li&gt;
+  &lt;strong&gt;Unclosed attributes: Another common source of HTML problems.
+  Let's look at an example: &lt;/strong&gt;
+&lt;/li&gt;</pre>
+   </li>
+  </ul>
+ </li>
+</ol>
+
+<h3 id="Validación_HTML">Validación HTML</h3>
+
+<p>Con el ejemplo anterior podemos asegurarnos de que nuestro HTML está bien formado, pero ¿cómo? En el ejemplo siguiente podemos comprobar que es bastante fácil buscar entre las líneas y encontrar los errores en documentos pequeños; pero, ¿qué pasa cuando trabajamos con documentos HTML grandes y complejos?</p>
+
+<p>La mejor estrategia es comenzar por pasar tu página HTML por el <a href="https://validator.w3.org/">servicio de validación de etiquetas</a>; fue creado y está mantenido por el W3C, organización que se encarga de definir las especificaciones de HTML, CSS y otras tecnologías web. Esta página web toma un documento HTML como entrada, lo procesa, y genera un informe de dónde están los errores en el documento.</p>
+
+<p><img alt="The HTML validator homepage" src="https://mdn.mozillademos.org/files/12441/validator.png" style="display: block; margin: 0 auto;"></p>
+
+<p>Para validar el HTML, podemos proporcionar al validador una dirección web a la que apuntar, subirle un archivo HTML, o directamente introducirle el código HTML que queremos que revise.</p>
+
+<h3 id="Aprendizaje_activo_Validación_de_un_documento_HTML">Aprendizaje activo: Validación de un documento HTML</h3>
+
+<p align="left">Vamos a probar de validar nuestro <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/debugging-html/debug-example.html">documento ejemplo</a>.</p>
+
+<ol>
+ <li>Primero, cargamos el <a href="https://validator.w3.org/">servicio de validación</a> en una pestaña del navegador, si no lo tenemos ya.</li>
+ <li>Hacemos clic en la subpestaña <a href="https://validator.w3.org/#validate_by_input">Validate by Direct Input</a>.</li>
+ <li>Copiamos el código del documento ejemplo (no solo el <code>body</code>) y lo pegamos en el cuadro de texto grande.</li>
+ <li>Hacemos clic en el botón <em>Check</em>.</li>
+</ol>
+
+<p>Esto debería proporcionar una lista de errores y otras informaciones:</p>
+
+<p><img alt="A list of of HTML validation results from the W3C markup validation service" src="https://mdn.mozillademos.org/files/12443/validation-results.png" style="display: block; margin: 0 auto;"></p>
+
+<h4 id="Interpretación_de_los_mensajes_de_error">Interpretación de los mensajes de error</h4>
+
+<p>La lista de mensajes de error que nos presenta el validador suele ayudar, pero a veces, no resultan muy útiles; con un poco de práctica aprenderemos a interpretar la lista para arreglar nuestro código. Veamos los mensajes de error y su significado. Observamos que cada mensaje se presenta con un número de línea y de columna, para ayudar a localizar el error más fácilmente.</p>
+
+<ul>
+ <li>"<span>Consider adding a </span><code>lang</code><span> attribute to the </span><code>html</code><span> start tag to declare the language of this document.": No se trata de un error, sino de una advertencia (warning). La <a class="external external-icon" href="https://www.w3.org/International/questions/qa-html-language-declarations" rel="noopener">recomendación</a> es definir siempre un idioma, y este "warning" explica cómo hacerlo..</span></li>
+ <li>"End tag <code>li</code> implied, but there were open elements" (2 instancias): Estos mensajes indican que un elemento que ha sido abierto debe ser cerrado. La etiqueta de cierre se supone, pero no está ahí. La información de la línea/columna apunta a la primera línea después de donde debería estar la etiqueta de cierre; es una buena pista para ver qué pasa.</li>
+ <li>"Unclosed element <code>strong</code>": Un elemento {{htmlelement("strong")}} no ha sido cerrado, y la línea/columna apunta directamente al lugar del error.</li>
+ <li>"End tag <code>strong</code> violates nesting rules": Este apunta a elementos que están incorrectamente anidados, y la línea/columna nos indica donde están.</li>
+ <li>"End of file reached when inside an attribute value. Ignoring tag": Esta es bastante enigmática; se refiere al hecho de que el valor de un atributo no ha sido bien construido, posiblemente cerca del final del archivo porque el final aparece dentro del valor del atributo. El hecho de que el navegador no muestre el enlace nos debería dar una buena pista de qué elemento es el erróneo.</li>
+ <li>"End of file seen and there were open elements": Este es un poco ambiguo, pero básicamente se refiere al hecho de que hay elementos abiertos que necesitan ser cerrados adecuadamente. Los números de línea apuntan a las últimas líneas del archivo, y este mensaje de error viene con una línea de código que indica un ejemplo de un elemento abierto:
+  <pre class="notranslate">example: &lt;a href="https://www.mozilla.org/&gt;link to Mozilla homepage&lt;/a&gt; ↩ &lt;/ul&gt;↩ &lt;/body&gt;↩&lt;/html&gt;</pre>
+
+  <div class="note">
+  <p><strong>Nota</strong>: Un atributo al que le falten las comillas de cierre puede ser un elemento abierto, porque el resto del documento será interpretado como si fuera parte de este atributo.</p>
+  </div>
+ </li>
+ <li>Unclosed element <code>ul</code>: Este no ayuda mucho, porque el elemento {{htmlelement("ul")}} está cerrado correctamente. Este error se debe a que el elemento {{htmlelement("a")}} no ha sido cerrado, ya que faltan las comillas de cierre.</li>
+</ul>
+
+<p><span>No debemos preocuparnos si no podemos corregir todos los mensajes de error; es práctico tratar de arreglar unos pocos errores cada vez y volver a pasar el validador para ver los que quedan. A veces, al arreglar unos cuantos se arreglan automáticamente otros muchos; con frecuencia muchos errores los causa uno solo en un efecto dominó.</span></p>
+
+<p><span>Sabremos  que todos los errores están arreglados cuando veamos el mensaje siguiente: </span></p>
+
+<p><img alt='Banner that reads "The document validates according to the specified schema(s) and to additional constraints checked by the validator."' src="https://mdn.mozillademos.org/files/12445/valid-html-banner.png" style="display: block; margin: 0 auto;"></p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Pues hasta aquí una introducción al depurado de HTML, que nos proporcionará habilidades para cuando comencemos a depurar CSS, JavaScript y otros lenguajes más adelante en nuestros trabajos. Este apartado también constituye el final de la introducción al módulo de artículos de aprendizaje de HTML; ahora podemos hacer los test de prueba: el primero de los cuales está en el enlace siguiente.</p>
+
+<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}</p>
diff --git a/files/es/learn/html/introduction_to_html/document_and_website_structure/index.html b/files/es/learn/html/introduction_to_html/document_and_website_structure/index.html
new file mode 100644
index 0000000000..14d5394700
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/document_and_website_structure/index.html
@@ -0,0 +1,299 @@
+---
+title: Estructura web y documentación
+slug: Learn/HTML/Introduction_to_HTML/Document_and_website_structure
+tags:
+  - CodingScripting
+  - Composición
+  - Diseño
+  - Formato
+  - Guía
+  - HTML
+  - Presentación
+  - Principiante
+  - Sitio
+  - Sitio Web
+  - bloques
+  - pagina
+  - programar
+  - semántica
+translation_of: Learn/HTML/Introduction_to_HTML/Document_and_website_structure
+original_slug: Learn/HTML/Introduccion_a_HTML/estructura
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">Además de definir partes individuales de tu página (como un párrafo o una imagen), {{Glossary("HTML")}} también dispone de elementos de bloque que se pueden utilizar para estructurar las distintas áreas de tu sito web (tal como el encabezado, el menú de navegación o la parte del contenido principal. En este artículo veras cómo planificar una estructura básica de página web y escribirás el HTML que representa esa estructura.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Estar familiarizado con HTML, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}. Aplicación de formato a texto en documentos HTML, según lo expuesto en la sección {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}. Funcionamiento de los hipervínculos, cubierto en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender a estructurar tu documento usando atributos semánticos y construir la estructura de una página web sencilla.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Partes_básicas_de_un_documento">Partes básicas de un documento</h2>
+
+<p>Las páginas web pueden y se deben diferenciar las unas de las otras, pero todas tienden a contener elementos comunes parecidos, a menos que estén destinadas a mostrar un vídeo o un juego a pantalla completa, o que formen parte de un proyecto artístico concreto o, simplemente, que estén mal estructuradas; estos elementos comunes son:</p>
+
+<dl>
+ <dt>encabezado:</dt>
+ <dd>Normalmente formado por una gran franja que cruza la parte superior de la página con un <strong>gran título</strong>, un logotipo y quizás un lema. Esta parte suele permanecer invariable mientras navegas entre las páginas de un mismo sitio web.</dd>
+ <dt>barra de navegación:</dt>
+ <dd>Son los enlaces a las secciones principales del sitio web. Normalmente está formada por un menú con botones, enlaces o pestañas. Al igual que el <em>encabezado</em>, este contenido suele permanecer invariable en las diferentes páginas del sitio; tener un menú inconsistente en tu página web conducirá a los usuarios a la confusión y frustración. Muchos diseñadores web consideran que el menú de navegación forma parte del encabezado y que no posee un componente individual, aunque no es necesario que sea así; de hecho, algunos argumentan que tener ambos componentes por separado es mejor por motivos de {{web.link("/es/docs/Learn/Accessibility", "accesibilidad")}} porque los lectores de pantalla pueden leer mejor ambos elementos si están separados.</dd>
+ <dt>contenido principal:</dt>
+ <dd>Es la gran parte central de la página y contiene la mayor parte del contenido particular de una página web concreta; por ejemplo, el video que quieres ver, la narración que quieres leer, el mapa que quieres consultar, los titulares de las noticias, etc. ¡Esta es la parte que definitivamente debe variar mucho de una página a otra de tu sitio web!</dd>
+ <dt>barra lateral:</dt>
+ <dd>Suele incluir algún tipo de información adicional, enlaces, citas, publicidad, etc. Normalmente está relacionada con el contenido principal de la página (por ejemplo, en una página de noticias, la barra lateral podría contener la biografía del autor o enlaces a artículos relacionados), pero en otras ocasiones encontraras elementos recurrentes como un menú de navegación secundario.</dd>
+ <dt>pie de página:</dt>
+ <dd>Es la parte inferior de la página, que generalmente contiene la letra pequeña, el copyright o la información de contacto. Es el sitio donde se coloca la información común (al igual que en el encabezado), pero esta información no suele ser tan importante o es secundaria con respecto a la página en sí misma. El pie también se suele usar para propósitos {{Glossary("SEO")}}, e incluye enlaces de acceso rápido al contenido más popular.</dd>
+</dl>
+
+<p>Una página web «típica» se podría parecer a esta:</p>
+
+<p><img alt="Un ejemplo de estructura de sitio web simple con un encabezado principal, menú de navegación, contenido principal, barra lateral y pie de página." src="https://mdn.mozillademos.org/files/12417/sample-website.png" style="display: block; margin: 0 auto;"></p>
+
+<h2 id="HTML_para_dar_estructura_al_contenido">HTML para dar estructura al contenido</h2>
+
+<p>El ejemplo no es muy atractivo, pero puede servir para ilustrar un ejemplo de diseño de una página web típica. Puedes encontrar sitios con más columnas, algunas mucho más complejas, pero esta servirá para hacerte una idea general sobre el tema. Con el CSS adecuado podrás usar muchos más elementos para decorar las distintas secciones y conseguir que queden como deses, pero como se comentó anteriormente, necesitas respetar ciertas normas semánticas, y <em>utilizar el elemento adecuado para cada tipo de sección</em>.</p>
+
+<p>La parte visual no lo es todo. Utilizarás diferentes fuentes y colores para llamar la atención de los usuarios sin discapacidad visual de las partes más importantes del contenido, como el menú de navegación y sus enlaces correspondientes, pero ¿qué ocurre con los usuarios con discapacidad visual que no pueden distinguir los colores llamativos o el tamaño grande de las fuentes?</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Los daltónicos representan alrededor del <a href="http://www.color-blindness.com/2006/04/28/colorblind-population/">4% de la población mundial</a> (aproximadamente 1 de cada 12 hombres y 1 de cada 200 mujeres son daltónicos). Los invidentes y las personas con discapacidad visual representan aproximadamente el 4-5% de la población mundial (en 2012 había {{Interwiki("wikipedia", "Discapacidad visual")}} 285 millones de personas con alguna de estas características en el mundo, mientras que el total de la población estaba {{Interwiki("wikipedia", "World_human_population#/media/File:World_population_history.svg", "alrededor de los 7,000 millones")}}.</p>
+</div>
+
+<p>En tu código HTML puedes crear secciones de contenido basadas en su <em>funcionalidad</em> — puedes usar elementos que representen sin ambigüedad las diferentes secciones de contenido descritas, de forma que las tecnologías de accesibilidad y los lectores de pantalla puedan reconocer esos elementos y asistir en tareas como «encontrar el menú de navegación», o «encontrar el contenido principal». Como se mencionó anteriormente en el curso, hay una serie de {{web.link("/es/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals#Por_qué_necesitamos_estructura", "consecuencias por no usar la estructura de elementos y semántica adecuada para hacer el trabajo correctamente")}}.</p>
+
+<p>HTML dispone de etiquetas adecuadas que puedes usar para establecer estas secciones semánticas, por ejemplo:</p>
+
+<ul>
+ <li><strong>encabezado</strong>: {{HTMLElement("header")}}.</li>
+ <li><strong>menú de navegación </strong>: {{HTMLElement("nav")}}.</li>
+ <li><strong>contenido principal</strong>: {{HTMLElement("main")}}, con varias subsecciones (además de la barra lateral) representadas por los elementos {{HTMLElement("article")}}, {{HTMLElement("section")}}, y {{HTMLElement("div")}}.</li>
+ <li><strong>barra lateral</strong>: {{HTMLElement("aside")}}; a menudo colocada dentro de {{HTMLElement("main")}}.</li>
+ <li><strong>pie de página</strong>: {{HTMLElement("footer")}}.</li>
+</ul>
+
+<h3 id="Aprendizaje_activo_El_código_del_ejemplo_anterior">Aprendizaje activo: El código del ejemplo anterior</h3>
+
+<p>El ejemplo de página web que se muestra arriba se consigue a partir del siguiente código (disponible en el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/document_and_website_structure/index.html">repositorio Github</a>). Observa el ejemplo anterior, y a continuación échale un vistazo al código de abajo para identificar las secciones marcadas en el ejemplo.</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+
+    &lt;title&gt;El título de mi página&lt;/title&gt;
+    &lt;link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Sonsie+One" rel="stylesheet" type="text/css"&gt;
+    &lt;link rel="stylesheet" href="style.css"&gt;
+
+    &lt;!-- las tres siguientes líneas son un truco para obtener elementos semánticos de HTML5 que funcionan en versiones de Internet Explorer antiguas --&gt;
+    &lt;!--[if lt IE 9]&gt;
+      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"&gt;&lt;/script&gt;
+    &lt;![endif]--&gt;
+  &lt;/head&gt;
+
+  &lt;body&gt;
+    &lt;!-- Aquí empieza el encabezado principal que se mantendrá en todas las páginas del sitio web --&gt;
+
+    &lt;header&gt;
+      &lt;h1&gt;Encabezado&lt;/h1&gt;
+    &lt;/header&gt;
+
+    &lt;nav&gt;
+      &lt;ul&gt;
+        &lt;li&gt;&lt;a href="#"&gt;Inicio&lt;/a&gt;&lt;/li&gt;
+        &lt;li&gt;&lt;a href="#"&gt;Nuestro equipo&lt;/a&gt;&lt;/li&gt;
+        &lt;li&gt;&lt;a href="#"&gt;Proyectos&lt;/a&gt;&lt;/li&gt;
+        &lt;li&gt;&lt;a href="#"&gt;Contacto&lt;/a&gt;&lt;/li&gt;
+      &lt;/ul&gt;
+
+       &lt;!-- Un formulario de búsqueda es una forma no-lineal de hacer búsquedas en un sitio web. --&gt;
+
+       &lt;form&gt;
+         &lt;input type="search" name="q" placeholder="Buscar"&gt;
+         &lt;input type="submit" value="¡Vamos!"&gt;
+       &lt;/form&gt;
+     &lt;/nav&gt;
+
+    &lt;!-- Aquí está el contenido principal de nuestra página --&gt;
+    &lt;main&gt;
+
+      &lt;!-- Contiene un artículo --&gt;
+      &lt;article&gt;
+        &lt;h2&gt;Título del artículo&lt;/h2&gt;
+
+        &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Donec a diam lectus. Set sit amet ipsum mauris. Maecenas congue ligula as quam viverra nec consectetur ant hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur.&lt;/p&gt;
+
+        &lt;h3&gt;Subsección&lt;/h3&gt;
+
+        &lt;p&gt;Donec ut librero sed accu vehicula ultricies a non tortor. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aenean ut gravida lorem. Ut turpis felis, pulvinar a semper sed, adipiscing id dolor.&lt;/p&gt;
+
+        &lt;p&gt;Pelientesque auctor nisi id magna consequat sagittis. Curabitur dapibus, enim sit amet elit pharetra tincidunt feugiat nist imperdiet. Ut convallis libero in urna ultrices accumsan. Donec sed odio eros.&lt;/p&gt;
+
+        &lt;h3&gt;Otra subsección&lt;/h3&gt;
+
+        &lt;p&gt;Donec viverra mi quis quam pulvinar at malesuada arcu rhoncus. Cum soclis natoque penatibus et manis dis parturient montes, nascetur ridiculus mus. In rutrum accumsan ultricies. Mauris vitae nisi at sem facilisis semper ac in est.&lt;/p&gt;
+
+        &lt;p&gt;Vivamus fermentum semper porta. Nunc diam velit, adipscing ut tristique vitae sagittis vel odio. Maecenas convallis ullamcorper ultricied. Curabitur ornare, ligula semper consectetur sagittis, nisi diam iaculis velit, is fringille sem nunc vet mi.&lt;/p&gt;
+      &lt;/article&gt;
+
+      &lt;!-- el contenido aparte también se puede anidar dentro del contenido principal --&gt;
+      &lt;aside&gt;
+        &lt;h2&gt;Relacionado&lt;/h2&gt;
+
+        &lt;ul&gt;
+          &lt;li&gt;&lt;a href="#"&gt;Oh, me gusta estar junto al mar&lt;/a&gt;&lt;/li&gt;
+          &lt;li&gt;&lt;a href="#"&gt;Oh, me gusta estar junto al mar&lt;/a&gt;&lt;/li&gt;
+          &lt;li&gt;&lt;a href="#"&gt;Aunque en el norte de Inglaterra&lt;/a&gt;&lt;/li&gt;
+          &lt;li&gt;&lt;a href="#"&gt;Nunca deja de llover&lt;/a&gt;&lt;/li&gt;
+          &lt;li&gt;&lt;a href="#"&gt;Oh, bueno...&lt;/a&gt;&lt;/li&gt;
+        &lt;/ul&gt;
+      &lt;/aside&gt;
+
+    &lt;/main&gt;
+
+    &lt;!-- Y aquí está nuestro pie de página principal que se utiliza en todas las páginas de nuestro sitio web --&gt;
+
+    &lt;footer&gt;
+      &lt;p&gt;©Copyright 2050 de nadie. Todos los derechos revertidos.&lt;/p&gt;
+    &lt;/footer&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>Tómate tu tiempo para revisar el código y comprenderlo — Los comentarios en el código también te ayudarán a entenderlo. No te pedimos que hagas mucho más en este artículo, porque la clave para entender el diseño del documento es escribir una estructura HTML conocida y posteriormente desarrollar su apariencia con CSS. Estudiaremos el diseño CSS como parte del tema CSS.</p>
+
+<h2 id="Elementos_de_diseño_HTML_en_detalle">Elementos de diseño HTML en detalle</h2>
+
+<p>Es bueno entender el significado global de todos los elementos definitorios de las secciones HTML en detalle; es algo en que trabajarás gradualmente a medida que comiences a tener más experiencia en el desarrollo web. En el enlace {{web.link("/es/docs/Web/HTML/Element", "referencia de elementos HTML")}} podemos entrar en un gran nivel de detalle. Por el momento, estas son las definiciones principales que deberíamos tratar de entender:</p>
+
+<ul>
+ <li>{{HTMLElement('main')}} encierra el contenido particular a esta página. Utilizaremos <code>&lt;main&gt;</code> solamente una vez para cada página y lo situaremos directamente dentro del elemento {{HTMLElement('body')}}. Es mejor que no lo anidemos en otros elementos.</li>
+ <li>{{HTMLElement('article')}} encuadra un bloque de contenido que tiene sentido por sí mismo aparte del resto de la página (por ejemplo una entrada en un blog).</li>
+ <li>{{HTMLElement('section')}} es parecido al elemento <code>&lt;article&gt;</code>, pero se usa más para agrupar cada parte de la página que, por su funcionalidad, constituye una sección en sí misma (por ejemplo un minimapa o un conjunto de titulares y resúmenes). Se considera una buena práctica comenzar cada una de estas secciones con un título de encabezado ({{web.link("/es/Learn/HTML/Howto/Set_up_a_proper_title_hierarchy", "heading")}}); observa que podemos subdividir artículos (<code>&lt;article&gt;</code>) en distintas secciones (<code>&lt;section&gt;</code>), o también secciones en distintos artículos, dependiendo del contexto.</li>
+ <li>{{HTMLElement('aside')}} incluye contenido que no está directamente relacionado con el contenido principal, pero que puede aportar información adicional relacionada indirectamente con él (resúmenes, biografías del autor, enlaces relacionados, etc.).</li>
+ <li>{{HTMLElement('header')}} representa un grupo de contenido introductorio. Si este es «<em>hijo</em>» de un elemento {{HTMLElement('body')}}, se convertirá en el <strong>encabezado</strong> principal del sitio web, pero si es hijo de un elemento {{HTMLElement('article')}} o un elemento {{HTMLElement('section')}}, entonces simplemente será el <strong>encabezado</strong> particular de cada sección (por favor, no lo confundas con {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML#Añadir_un_título","títulos y encabezados")}}).</li>
+ <li>{{HTMLElement('nav')}} contiene la funcionalidad de navegación principal de la página. Los enlaces secundarios, etc., no entrarán en la navegación.</li>
+ <li>{{HTMLElement('footer')}} representa un grupo de contenido al final de una página.</li>
+</ul>
+
+<h3 id="Envolturas_no_semánticas">Envolturas no semánticas</h3>
+
+<p>A veces hay situaciones en las que no encuentras un elemento semántico adecuado para agrupar ciertos elementos o englobar cierto contenido. Podrías querer agrupar ciertos elementos para referirte a ellos como una entidad que comparta cierto {{Glossary("CSS")}} o {{Glossary("JavaScript")}}. Para casos como esos, HTML dispone del elemento {{HTMLElement("div")}} y del elemento {{HTMLElement("span")}}. Preferentemente estos elementos se deberán utilizar con sus atributos ({{HTMLAttrxRef('class')}}), para conferirles algún tipo de etiquetado que permita determinarlos con facilidad.</p>
+
+<p>{{HTMLElement("span")}} es un elemento no-semántico que se utiliza en el interior de una línea. Se utiliza cuando no se nos ocurre el uso de ningún otro elemento semántico de texto en el que incluir el contenido, o si no se desea añadir ningún significado específico. Por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;El rey volvió ebrio a su habitación alrededor de la 01:00, y sin duda la cerveza no le ayudaba
+cuando cruzó tambaleante la puerta &lt;span class="editor-note"&gt;[nota del editor: en este instante de la
+representación, deberían atenuarse las luces]&lt;/span&gt;.&lt;/p&gt;</pre>
+
+<p>En este caso, la nota del editor solo proporciona información extra para el director de la obra; se supone que estos elementos no incluyen contenido extra importante. Para los usuarios sin discapacidad visual, quizás debamos usar CSS para diferenciar sutilmente estas notas del texto principal.</p>
+
+<p>{{HTMLElement("div")}} es un elemento de bloque no-semántico; lo utilizaras cuando no se te ocurra el uso de otro elemento semántico mejor, o si no deseas añadir ningún significado concreto. Por ejemplo, imagina un carrito de compras que puedes pulsar en cualquier momento durante tu estancia en una tienda virtual:</p>
+
+<pre class="brush: html notranslate">&lt;div class="shopping-cart"&gt;
+  &lt;h2&gt;Carrito de compras&lt;/h2&gt;
+  &lt;ul&gt;
+    &lt;li&gt;
+      &lt;p&gt;&lt;a href=""&gt;&lt;strong&gt;Pendientes de plata&lt;/strong&gt;&lt;/a&gt;: $99.95.&lt;/p&gt;
+      &lt;img src="../products/3333-0985/" alt="Pendientes de plata"&gt;
+    &lt;/li&gt;
+    &lt;li&gt;
+      ...
+    &lt;/li&gt;
+  &lt;/ul&gt;
+  &lt;p&gt;Importe total: $237.89&lt;/p&gt;
+&lt;/div&gt;</pre>
+
+<p>Este no es un elemento lateral (<code>&lt;aside&gt;</code>) porque no necesariamente está relacionado con el contenido principal de la página (en realidad quieres que se pueda ver desde cualquier página). Ni siquiera se puede incluir en una sección (<code>&lt;section&gt;</code>) porque su contenido no forma parte del contenido principal de la página. Por lo tanto, un elemento <code>&lt;div&gt;</code> es el adecuado en este caso. Hemos incluido un <strong>encabezado</strong> para indicar a los lectores de pantalla donde van a encontrarlo.</p>
+
+<div class="warning">
+<p><strong>Atención</strong>: Los elementos <code>div</code> son tan prácticos y simples que es fácil usarlos en exceso. Como no conllevan valor semántico, enmarañan el código HTML. Debemos tener cuidado de usarlos solo cuando no halles una solución mejor y reducir su uso al mínimo, porque de otro modo complicarás el mantenimiento y actualización de los documentos.</p>
+</div>
+
+<h3 id="Saltos_de_línea_y_líneas_horizontales">Saltos de línea y líneas horizontales</h3>
+
+<p>Dos elementos que debes conocer y utilizarás ocasionalmente son {{HTMLElement("br")}} y {{HTMLElement("hr")}}:</p>
+
+<p>El elemento {{HTMLElement("br")}} genera un salto de línea en un párrafo; es la única manera de representar series de líneas cortas, como una dirección postal o un poema. Por ejemplo:</p>
+
+<div id="line-break-live-sample">
+<pre class="brush: html notranslate">&lt;p&gt;Había una vez un hombre llamado O'Dell&lt;br&gt;
+A quién le encantaba escribir HTML&lt;br&gt;
+Pero su estructura era mala, su semántica era triste&lt;br&gt;
+y su marcado no se interpretó muy bien.&lt;/p&gt;</pre>
+</div>
+
+<p>Sin el elemento {{HTMLElement("br")}}, todo el párrafo se habría presentado como una sola línea larga (como ya hemos dicho con anterioridad en este curso, {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started#Los_espacios_en_blanco_en_HTML", "HTML ignora la mayoría del espacio en blanco")}}); con estos elementos {{HTMLElement("br")}} en el código, las líneas quedan:</p>
+
+<p>{{EmbedLiveSample('line-break-live-sample', '100%', '125px', '', '', 'hide-codepen-jsfiddle')}}</p>
+
+<p>Los elementos {{HTMLElement("hr")}} generan una regla horizontal en el documento que denota un cambio en la temática del texto (como un cambio de tema o de escena). Visualmente tiene el aspecto de una línea horizontal. Por ejemplo:</p>
+
+<div id="Ejemplo_en_vivo_línea_horizontal">
+<pre class="brush: html notranslate">&lt;p&gt;Ron fue acorralado en una esquina por las bestias abisales que merodeaban. Asustado, pero decidido a proteger a sus amigos, levantó su varita y se preparó para la batalla, con la esperanza de que su llamada de socorro hubiera llegado a alguien.&lt;/p&gt;
+&lt;hr&gt;
+&lt;p&gt;Mientras tanto, Harry estaba sentado en su casa, mirando su declaración de regalías y pensando en cuándo saldría la próxima serie derivada, cuando de pronto voló por su ventana una carta de socorro y aterrizó en su regazo. La leyó vagamente y suspiró; "Será mejor que vuelva al trabajo entonces", reflexionó.&lt;/p&gt;</pre>
+</div>
+
+<p>Quedará así:</p>
+
+<p>{{EmbedLiveSample('Ejemplo_en_vivo_línea_horizontal', '100%', '185px', '', '', 'hide-codepen-jsfiddle')}}</p>
+
+<h2 id="Planificación_de_una_página_web_sencilla">Planificación de una página web sencilla</h2>
+
+<p>Una vez has planificado el contenido de una página web sencilla, el paso lógico siguiente es intentar trabajar en el contenido para todo el sitio web, las páginas que necesitas y la forma de disponer las conexiones entre ellas para producir la mejor experiencia de usuario a los visitantes. Esto se conoce con el nombre de ({{Glossary("Arquitectura de la información")}}). Una web grande y compleja necesitará mucha planificación, pero para una web sencilla compuesta por unas cuantas páginas, el proceso puede ser sencillo, ¡y divertido!.</p>
+
+<ol>
+ <li>Ten en cuenta que habrá varios elementos comunes en muchas (si no en todas las) páginas, tal como el menú de navegación y el contenido del pie de página. Si la web está dedicada a un negocio, por ejemplo, sería una buena idea disponer de la información de contacto en el pie de página en todas las páginas. Anota lo que deseas tener en común en cada página. <img alt="las características comunes del sitio de viajes para ir en cada página: título y logotipo, contacto, derechos de autor, términos y condiciones, selección de idioma, política de accesibilidad" src="https://mdn.mozillademos.org/files/12423/common-features.png" style="border-style: solid; border-width: 1px; display: block; height: 375px; margin: 0px auto; width: 600px;"></li>
+ <li>A continuación, esboza un esquema sencillo de cuál podría ser la estructura deseada de la apariencia de cada página (podría ser algo tan sencillo como el siguiente dibujo). Anota los bloques principales. <img alt="Un diagrama simple de una estructura de sitio de ejemplo, con un encabezado, un área de contenido principal, dos barras laterales opcionales y un pie de página" src="https://mdn.mozillademos.org/files/12429/site-structure.png" style="border-style: solid; border-width: 1px; display: block; height: 232px; margin: 0px auto; width: 600px;"></li>
+ <li>Ahora, elabora una lista completa con todo el resto del contenido de tu sitio web que no sea común a todas las páginas. <img alt="Una larga lista de todas las funciones que podrías incluir en tu sitio de viajes, desde buscar, hasta ofertas especiales e información específica del país" src="https://mdn.mozillademos.org/files/12425/feature-list.png" style="border-style: solid; border-width: 1px; display: block; height: 1066px; margin: 0px auto; width: 600px;"></li>
+ <li>A continuación, trata de ordenar todo este contenido por grupos, para hacerte una idea de las partes que podrían ir juntas en las diferentes páginas. Esto es muy similar a una técnica llamada {{Glossary("Clasificación de tarjetas")}}. <img alt="Los elementos que deberían aparecer en un sitio de vacaciones ordenados en 5 categorías: Búsqueda, Especiales, Información específica del país, Resultados de búsqueda y Compra cosas" src=" https://mdn.mozillademos.org/files/12421/card-sorting.png" style="border-style: solid; border-width: 1px; display: block; height: 579px; margin: 0px auto; width: 600px;"></li>
+ <li>Ahora trata de esquematizar un mapa de tu sitio — dibuja un globo para cada página de tu sitio web y dibuja líneas que identifiquen el flujo de datos entre las distintas páginas. La página de inicio normalmente estará ubicada en el centro y enlazará con el resto de páginas; la mayoría de las páginas de una web sencilla estarán enlazadas desde el menú de navegación principal, aunque puede haber excepciones. También puedes incluir notas sobre cómo se pueden presentar las cosas. <img alt="Un mapa del sitio que muestra la página de inicio, la página del país, los resultados de búsqueda, la página de ofertas especiales, la página de pago y la página de compra" src="https://mdn.mozillademos.org/files/12427/site-map.png" style="border-style: solid; border-width: 1px; display: block; height: 872px; margin: 0px auto; width: 600px;"></li>
+</ol>
+
+<h3 id="Aprendizaje_activo_Creación_de_un_mapa_del_sitio_web">Aprendizaje activo: Creación de un mapa del sitio web</h3>
+
+<p>Intenta llevar a cabo el ejercicio anterior para crear tu propia página web. ¿Qué contenido le vas a dar a tu sitio web?</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Guarda este esquema para utilizarlo más adelante.</p>
+</div>
+
+<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
+
+<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Puedes encontrar una evaluación detallada que pruebe estas habilidades al final del módulo; consulta {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructurar el contenido de una página")}}. ¡Recuerda leer primero el siguiente artículo de la serie y no solo saltarlo!</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>En este punto, deberías tener una mejor idea sobre cómo estructurar una página/sitio web. En el último artículo de este módulo, se explica cómo depurar HTML.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines", "Uso de secciones y esquemas HTML")}}: Guía avanzada de elementos semánticos HTML5 y el algoritmo de esquema HTML5.</li>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
+</ul>
diff --git a/files/es/learn/html/introduction_to_html/getting_started/index.html b/files/es/learn/html/introduction_to_html/getting_started/index.html
new file mode 100644
index 0000000000..331be30043
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/getting_started/index.html
@@ -0,0 +1,768 @@
+---
+title: Empezar con HTML
+slug: Learn/HTML/Introduction_to_HTML/Getting_started
+tags:
+  - Atributos
+  - Elemento
+  - Guía
+  - HTML
+  - Principiante
+  - comentários
+translation_of: Learn/HTML/Introduction_to_HTML/Getting_started
+original_slug: Learn/HTML/Introduccion_a_HTML/iniciar
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">En este artículo vamos a exponer lo más básico del HTML. Para comenzar definiremos elementos, atributos y el resto de términos importantes que quizá ya te suenen y qué función cumplen dentro del lenguaje. También explica dónde encajan estos en HTML. Aprenderás cómo se estructuran los elementos HTML, cómo se estructura una página HTML típica y otras características básicas importantes del lenguaje. Por el camino, también iremos practicando con algo de HTML.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, {{web.link("/es/docs/Learn/Getting_started_with_the_web/Installing_basic_software", "tener instalado el software básico")}} y conocimientos básicos de cómo {{web.link("/es/docs/Learn/Getting_started_with_the_web/Dealing_with_files", "trabajar con archivos")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Familiarizarte con el lenguaje HTML, y adquirir algo de práctica escribiendo unos pocos elementos HTML.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_el_HTML">¿Qué es el HTML?</h2>
+
+<p>{{Glossary("HTML")}} ("<em>Hypertext Markup Language</em>") no es un lenguaje de programación. Es un <em>lenguaje de marcado</em> que le dice a los navegadores web cómo estructurar las páginas web que estás visitando. Puede ser tan complejo o tan simple como desee el desarrollador web. El HTML consiste en una serie de {{Glossary("Element", "elementos")}}, que puedes utilizar para encerrar, delimitar o <em>marcar</em> diferentes partes del contenido para hacer que aparezcan de una cierta manera, o actúen de determinada forma. Las {{Glossary("Tag", "etiquetas")}} que delimitan un fragmento de contenido pueden hacer que dicho contenido enlace con otra página, ponga una palabra en cursiva, etcétera. Por ejemplo, dada la siguiente línea de contenido:</p>
+
+<pre class="brush: bash notranslate">Mi gato es muy gruñón</pre>
+
+<p>Si queremos que la línea sea independiente de otras, podemos especificar que es un párrafo encerrándola con una etiqueta de elemento de párrafo ({{htmlelement("p")}}):</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Mi gato es muy gruñón&lt;/p&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Las etiquetas en HTML no distinguen entre mayúsculas y minúsculas. Así que se pueden escribir tanto en mayúsculas como en minúsculas. Por ejemplo, una etiqueta {{htmlelement("title")}} se puede escribir como <code>&lt;title&gt;</code>, <code>&lt;TITLE&gt;</code>, <code>&lt;Title&gt;</code>, <code>&lt;TiTle&gt;</code>, etc., y funcionará correctamente. La mejor práctica, sin embargo, es escribir todas las etiquetas en minúsculas para mantener la coherencia y legibilidad, entre otros motivos.</p>
+</div>
+
+<h2 id="Anatomía_de_un_elemento_HTML">Anatomía de un elemento HTML</h2>
+
+<p>Exploremos un poco el elemento párrafo:</p>
+
+<p><img alt="Anatomía de los elementos HTML" src="https://mdn.mozillademos.org/files/11913/htmlexp.png" style="display: block; height: 255px; margin: 0px auto; width: 821px;"></p>
+
+<p>Las principales partes de nuestro elemento son:</p>
+
+<ul>
+ <li>La <strong>etiqueta de apertura</strong>: consiste en el nombre del elemento (en este caso, <code>p</code>), encerrado entre <strong>paréntesis angulares</strong> de apertura y cierre. Esta etiqueta de apertura marca dónde comienza el elemento o comienza a tener efecto. En este ejemplo, precede al comienzo del texto del párrafo.</li>
+ <li>El <strong>contenido</strong>: Este es el contenido del elemento. En este ejemplo, es el texto del párrafo.</li>
+ <li>La <strong>etiqueta de cierre</strong>: Es lo mismo que la etiqueta de apertura, excepto que incluye una barra diagonal antes del nombre del elemento. Esto indica dónde termina el elemento; en este caso, dónde finaliza el párrafo. No incluir una etiqueta de cierre es un error común de principiante, y puede conducir a extraños resultados.</li>
+</ul>
+
+<p>El <strong>elemento</strong> lo conforman la etiqueta de apertura, seguida del contenido, seguido de la etiqueta de cierre.</p>
+
+<h3 id="Aprendizaje_activo_crear_tu_primer_elemento_HTML">Aprendizaje activo: crear tu primer elemento HTML</h3>
+
+<p>Edita la siguiente línea en el área <em>Entrada</em> envolviéndola con las etiquetas <code>&lt;em&gt;</code> y <code>&lt;/em&gt;</code>. Para <em>abrir el elemento</em>, coloca la etiqueta de apertura <code>&lt;em&gt;</code> al principio de la línea. Para <em>cerrar el elemento</em>, coloca la etiqueta de cierre <code>&lt;/em&gt;</code> al final de la línea. ¡Obtienes una línea en cursiva! Puedes ver tus cambios actualizados automáticamente en la caja de texto de <em>Salida</em>.</p>
+
+<p>Si te equivocas, siempre puedes volver al código anterior mediante el botón <em>Restablecer</em>. Si te quedas realmente atascado, pulsa el botón <em>Mostrar la solución</em> para ver la solución.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="playable-code" style="min-height: 100px;width: 95%"&gt;
+  Este es mi texto.
+&lt;/textarea&gt;
+
+&lt;div class="controls"&gt;
+  &lt;input id="reset" type="button" value="Restablecer" /&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución" /&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: 'Open Sans Light',Helvetica,Arial,sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}
+</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution = '&lt;em&gt;Este es mi texto.&lt;/em&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="Elementos_anidados">Elementos anidados</h3>
+
+<p>Se pueden poner elementos dentro de otros elementos. Esto se llama <strong>anidamiento</strong>. Si quisiéramos decir que nuestro gato es <strong>muy</strong> gruñón, podríamos encerrar la palabra <em>muy</em> en un elemento {{htmlelement("strong")}} para que aparezca destacada.</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Mi gato es &lt;strong&gt;muy&lt;/strong&gt; gruñón.&lt;/p&gt;</pre>
+
+<p>Hay una forma correcta e incorrecta de anidar. En el ejemplo anterior, primero abrimos el elemento <code>p</code>, luego abrimos el elemento <code>strong</code>. Para un anidamiento adecuado, primero debemos cerrar el elemento <code>strong</code>, antes de cerrar el <code>p</code>.</p>
+
+<p>El siguiente es un ejemplo de la forma <em>incorrecta</em> de anidar:</p>
+
+<pre class="example-bad brush: html notranslate">&lt;p&gt;Mi gato es &lt;strong&gt;muy gruñón.&lt;/p&gt;&lt;/strong&gt;</pre>
+
+<p>Los elementos tienen que abrirse y cerrarse correctamente para que estén claramente dentro o fuera el uno del otro. Con el tipo de superposición en el ejemplo anterior, el navegador tiene que adivinar tu intención. Este tipo de adivinanzas puede producir resultados inesperados.</p>
+
+<h3 id="Elementos_de_bloque_y_elementos_en_línea">Elementos de bloque y elementos en línea</h3>
+
+<p>Hay dos categorías importantes de elementos en HTML — Estos son los elementos de bloque y los elementos en línea.</p>
+
+<ul>
+ <li>Los elementos de bloque forman un bloque visible en la página. Aparecerán en una línea nueva después de cualquier contenido anterior. Cualquier contenido que vaya después también aparecerá en una línea nueva. Los elementos a nivel de bloque suelen ser elementos estructurales de la página. Por ejemplo, un elemento a nivel de bloque puede representar encabezados, párrafos, listas, menús de navegación o pies de página. Un elemento a nivel de bloque no estaría anidado dentro de un elemento en línea, pero podría estar anidado dentro de otro elemento a nivel de bloque.</li>
+ <li>Los elementos en línea están contenidos dentro de elementos de bloque y delimitan solo pequeñas partes del contenido del documento; (no párrafos enteros o agrupaciones de contenido) Un elemento en línea no hará que aparezca una nueva línea en el documento. Suele utilizarse con texto. Por ejemplo es el caso de un elemento {{htmlelement("a")}} (hipervínculo) o elementos de énfasis como {{htmlelement("em")}} o {{htmlelement("strong")}}.</li>
+</ul>
+
+<p>Considera el siguiente ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;em&gt;primero&lt;/em&gt;&lt;em&gt;segundo&lt;/em&gt;&lt;em&gt;tercero&lt;/em&gt;
+
+&lt;p&gt;cuarto&lt;/p&gt;&lt;p&gt;quinto&lt;/p&gt;&lt;p&gt;sexto&lt;/p&gt;
+</pre>
+
+<p>{{htmlelement("em")}} es un elemento en línea. Así, como puedes observar, los tres primeros elementos se sitúan en la misma línea, uno tras otro sin espacio entre ellos. Por otro lado, {{htmlelement("p")}} es un elemento a nivel de bloque. Cada elemento <em>p</em> aparece en una nueva línea, con un espacio arriba y abajo. (El espaciado se debe al {{web.link("/es/docs/Learn/CSS/Introduction_to_CSS", "estilo CSS")}} predeterminado que el navegador aplica a los párrafos).</p>
+
+<p>{{ EmbedLiveSample('Elementos_de_bloque_y_elementos_en_línea', 700, 200, "", "") }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: HTML5 redefinió las categorías de elementos: consulta <a href="https://html.spec.whatwg.org/multipage/indices.html#element-content-categories">Categorías de contenido de elementos</a>. Si bien estas definiciones son más precisas y menos ambiguas que sus predecesoras, las nuevas definiciones son mucho más complicadas de entender que <em>block</em> e <em>inline </em>. Este artículo seguirá con estos dos términos.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Los términos «en bloque» (block) y «en línea» (inline), tal como se usan en este tema, no se deberían confundir con {{web.link("/es/docs/Learn/CSS/Introduction_to_CSS/Box_model#Types_of_CSS_boxes", "los tipos de casillas de CSS")}} que se conocen con el mismo nombre. Aunque de manera predeterminada están relacionados, el hecho de cambiar el tipo de aspecto visual del CSS no cambia la categoría del elemento ni afecta a aquellos elementos que pueda contener. Una de las razones por las que HTML5 abandonó el uso de estos términos fue para evitar este tipo de confusión.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar referencias útiles que incluyen listas de elementos de bloque y elementos en línea. Consulta {{web.link("/es/docs/Web/HTML/Block-level_elements", "Elementos en bloque")}} y {{web.link("/es/docs/Web/HTML/Elementos_en_línea", "Elementos en línea")}}.</p>
+</div>
+
+<h3 id="Elementos_vacíos">Elementos vacíos</h3>
+
+<p>No todos los elementos siguen el patrón de etiqueta de apertura, contenido y etiqueta de cierre. Algunos elementos consisten solo en una etiqueta única, que se utiliza generalmente para insertar/incrustar algo en el documento en el lugar donde se le quiere incluir. Por ejemplo, el elemento {{htmlelement("img")}} inserta una imagen en la página:</p>
+
+<pre class="brush: html notranslate">&lt;img src="https://raw.githubusercontent.com/mdn/beginner-html-site/gh-pages/images/firefox-icon.png"&gt;</pre>
+
+<p>Este texto mostrará lo siguiente en tu página:</p>
+
+<p>{{ EmbedLiveSample('Elementos_vacíos', 700, 300, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Los elementos vacíos en ocasiones también se llaman elementos <em>nulos</em> o <em>vanos</em> (<em>void elements</em>).</p>
+</div>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Los elementos también pueden tener atributos. Los atributos tienen este aspecto:</p>
+
+<p><img alt="atributo html" src="https://mdn.mozillademos.org/files/11915/htmlatributos.png" style="display: block; height: 156px; margin: 0px auto; width: 1287px;"></p>
+
+<p>Los atributos contienen información extra sobre el elemento que no se mostrará en el contenido. En este caso, el atributo <code>class</code> asigna al elemento un identificador que se puede utilizar para dotarlo de información de estilo.</p>
+
+<p>Un atributo debería tener:</p>
+
+<ul>
+ <li>Un espacio entre este y el nombre del elemento. (Para un elemento con más de un atributo, los atributos también deben estar separados por espacios).</li>
+ <li>El nombre del atributo, seguido por un signo igual.</li>
+ <li>Un valor del atributo, rodeado de comillas de apertura y cierre.</li>
+</ul>
+
+<h3 id="Aprendizaje_activo_Añadir_atributos_a_un_elemento">Aprendizaje activo: Añadir atributos a un elemento</h3>
+
+<p>Otro ejemplo de un elemento es {{htmlelement("a")}}. Esto significa <em>ancla</em>. Una ancla puede convertir el texto que encierra en un hipervínculo. Las anclas pueden tener varios atributos, pero varios son como sigue:</p>
+
+<ul>
+ <li><strong><code>href</code></strong>: El valor de este atributo indica la dirección web a la que se quiere que apunte el enlace, que será hacia donde nos lleve el navegador cuando se haga clic sobre el elemento. Por ejemplo, <code>href="https://www.mozilla.org/"</code>.</li>
+ <li><strong><code>title</code></strong>: El atributo <code>title</code> añade información adicional sobre el enlace, como puede ser el título de la página que vinculas. Por ejemplo, <code>title="La página de inicio de Mozilla"</code>. Esta información aparecerá cuando se le pase el ratón por encima.</li>
+ <li><strong><code>target</code></strong>: El atributo <code>target</code> especifica el contexto de navegación que va a usar para mostrar el enlace. Por ejemplo, <code>target="_blank"</code> abrirá el enlace en una nueva pestaña. Si quieres mostrar el enlace en la pestaña activa, simplemente omite este atributo.</li>
+</ul>
+
+<p>Edita la línea de abajo en el área de <em>Entrada</em> para convertirlo en un enlace a tu sitio web favorito.</p>
+
+<ol>
+ <li>Añade el elemento <code>&lt;a&gt;</code>.</li>
+ <li>Añade el atributo <code>href</code> y el atributo <code>title</code>.</li>
+ <li>Especifica el atributo <code>target</code> para abrir el enlace en una nueva pestaña.</li>
+</ol>
+
+<p>Los cambios se actualizarán inmediatamente en la zona de <em>Salida</em>. Deberías ver un enlace que mostrará el contenido del atributo <code>title</code> cuando pases el ratón encima, y que te llevará a la dirección web indicada por el atributo <code>href</code> cuando hagas clic. Recuerda que debes incluir un espacio entre el nombre del elemento y cada atributo.</p>
+
+<p>Si te equivocas, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente atascado, pulsa el botón <em>Mostrar la solución</em> para ver la solución.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_2">Código reproducible 2</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 100px;width: 95%"&gt;
+  &amp;lt;p&amp;gt;Un enlace a mi sitio web favorito.&amp;lt;/p&amp;gt;
+&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution = '&lt;p&gt;Un enlace a mi &lt;a href="https://www.mozilla.org/" title="La página de inicio de Mozilla" target="_blank"&gt;sitio web favorito&lt;/a&gt;.&lt;/p&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_2', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="Atributos_booleanos">Atributos booleanos</h3>
+
+<p>En ocasiones puedes ver atributos escritos sin valor. Esto está permitido. Estos se denominan atributos booleanos. Los atributos booleanos solo pueden tener un valor, que generalmente es el mismo que el nombre del atributo. Por ejemplo, considera el atributo {{htmlattrxref("disabled", "input")}}, que puedes asignar a los elementos de entrada del formulario. (Usa esto para <em>deshabilitar</em> los elementos de entrada del formulario para que el usuario no pueda realizar entradas. Los elementos desactivados suelen tener una apariencia atenuada). Por ejemplo:</p>
+
+<pre class="brush: bash notranslate">&lt;input type="text" disabled="disabled"&gt;</pre>
+
+<p>De manera abreviada, también es posible escribirlo como se describe a continuación (además, se ha incluido un elemento de entrada de formulario no desactivado como referencia, para dar una idea más precisa de lo que sucede):</p>
+
+<pre class="brush: html notranslate">&lt;!-- el uso del atributo deshabilitado evita que el usuario final introduzca texto en el cuadro de entrada --&gt;
+&lt;input type="text" disabled&gt;
+
+&lt;!-- se permite la entrada de texto, ya que no contiene el atributo deshabilitado --&gt;
+&lt;input type="text"&gt;
+</pre>
+
+<p>Como referencia, el ejemplo anterior también incluye un elemento de entrada de formulario no deshabilitado. El HTML del ejemplo anterior produce este resultado:</p>
+
+<p>{{ EmbedLiveSample('Atributos_booleanos', 700, 100, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="Omitir_comillas_en_valores_de_atributos">Omitir comillas en valores de atributos</h3>
+
+<p>Cuando observas diferentes páginas web, puedes encontrarte con todo tipo de estilos de etiquetado extraños, que incluyen valores de atributos sin comillas. Esto se permite en ciertas circunstancias, pero interrumpirá la edición en otras. Por ejemplo, si volvemos a revisar el ejemplo del enlace, sería posible escribir una versión básica con solo el atributo <code>href</code>, así:</p>
+
+<pre class="brush: html notranslate">&lt;a href=https://www.mozilla.org/&gt;mi sitio web favorito&lt;/a&gt;</pre>
+
+<p>Sin embargo, las cosas no funcionarán cuando a este estilo se añada el atributo <code>title</code>:</p>
+
+<pre class="example-bad brush: html notranslate">&lt;a href=https://www.mozilla.org/ title=The Mozilla homepage&gt;mi sitio web favorito&lt;/a&gt;</pre>
+
+<p>En este punto el navegador interpretará mal el cambio y pensará que el atributo <code>title</code> corresponde a tres atributos: un atributo <code>title</code> con el valor <em>The</em> y dos atributos booleanos: <code>Mozilla</code> y <code>homepage</code>. ¡Obviamente, esta no es la intensión! Causará errores o comportamientos inesperados, como puedes ver en el ejemplo en vivo a continuación. ¡Intenta colocar el cursor sobre el enlace para ver el texto del título!</p>
+
+<p>{{ EmbedLiveSample('Omitir_comillas_en_valores_de_atributos', 700, 100, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<p>Incluye <strong>siempre</strong> las comillas de atributos. Evita tales problemas y da como resultado un código más legible.</p>
+
+<h3 id="¿Comillas_simples_o_dobles">¿Comillas simples o dobles?</h3>
+
+<p>En este artículo todos los atributos se han incluido en comillas dobles. Sin embargo, se pueden ver comillas simples en algún código HTML. Es una cuestión de estilo. Puedes elegir libremente cuál prefieres. Ambas líneas de código son equivalentes:</p>
+
+<pre class="brush: html notranslate">&lt;a href="http://www.ejemplo.com"&gt;Un enlace a mi ejemplo.&lt;/a&gt;
+
+&lt;a href='http://www.ejemplo.com'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
+
+<p>Asegúrate de no mezclar ambos tipos de comillas. El siguiente ejemplo muestra un tipo de mezcla de comillas que saldrá mal:</p>
+
+<pre class="example-bad brush: html notranslate">&lt;a href="http://www.ejemplo.com'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
+
+<p>Si utilizas un tipo de comillas en tu documento HTML, puedes incluir el otro tipo de comillas para tus valores de atributo sin que esto te cause problemas:</p>
+
+<pre class="brush: html notranslate">&lt;a href="http://www.ejemplo.com" title="¿A que es 'divertido'"&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
+
+<p>Sin embargo, si deseas anidar unas comillas dentro de otras del mismo tipo (ya sea simples o dobles), tendrás que utilizar entidades HTML para las comillas. Por ejemplo, el siguiente código no va a funcionar:</p>
+
+<pre class="example-bad brush: html notranslate">&lt;a href='http://www.ejemplo.com' title='¿A que es 'divertido'?'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
+
+<p>Así que tendrás que hacer esto:</p>
+
+<pre class="brush: html notranslate">&lt;a href='http://www.ejemplo.com' title='¿A que es &amp;apos;divertido&amp;apos;?'&gt;Un enlace a mi ejemplo.&lt;/a&gt;</pre>
+
+<h2 id="Anatomía_de_un_documento_HTML">Anatomía de un documento HTML</h2>
+
+<p>Los elementos HTML no son muy útiles por sí mismos. Ahora veremos cómo combinar los elementos individuales para formar una página HTML completa:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Mi página de prueba&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;p&gt;Esta es mi página&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>Aquí tenemos:</p>
+
+<ol>
+ <li><code>&lt;!DOCTYPE html&gt;</code>: El elemento <em>doctype</em>. En sus inicios, cuando el HTML llevaba poco tiempo (alrededor de 1991-1992), los <em>doctypes</em> servían como enlaces al conjunto de reglas que la página HTML debía seguir para que fuera considerado buen HTML. Un elemento <em>doctype</em> de aquella época podía parecerse a esto:
+
+  <pre class="brush: bash notranslate">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;</pre>
+  En la actualidad se ignora y se considera un legado histórico que hay que incluir para que todo funcione correctamente. <code>&lt;!DOCTYPE html&gt;</code> es la secuencia de caracteres más corta que se acepta como elemento <em>doctype</em> válido. Eso es lo único que realmente necesitas saber.</li>
+ <li><code>&lt;html&gt;&lt;/html&gt;</code>: El elemento <code>&lt;html&gt;</code>. Este elemento envuelve todo el contenido de la página. A veces se lo conoce como el elemento raíz.</li>
+ <li><code>&lt;head&gt;&lt;/head&gt;</code>: El elemento <code>&lt;{{htmlelement("head")}}&gt;</code> (cabecera). Este elemento actúa como contenedor para todos los parámetros que quieras incluir en el documento HTML que <em>no serán</em> visibles a los visitantes de la página. Incluye cosas como palabras clave y la descripción de la página que quieras mostrar en los resultados de búsqueda, así como la hoja de estilo para formatear nuestro contenido, declaraciones de codificación de caracteres y más. Aprenderás más acerca de esto en el siguiente artículo de la serie.</li>
+ <li><code>&lt;meta charset="utf-8"&gt;</code>: Este elemento establece que tu documento HTML usará la codificación UTF-8, que incluye la gran mayoría de caracteres de todos los idiomas humanos escritos. En resumen: puede gestionar cualquier contenido textual que pongas en tu documento. No hay razón para no configurar este valor y te puede ayudar a evitar problemas más adelante.</li>
+ <li><code>&lt;title&gt;&lt;/title&gt;</code>: El elemento {{htmlelement("title")}}. Este establece el título de la página, que es el título que aparece en la pestaña del navegador en la que se carga la página. El título de la página también se utiliza para describir la página cuando se marca como favorita.</li>
+ <li><code>&lt;body&gt;&lt;/body&gt;</code>: El elemento <code>&lt;body&gt;</code>. Contiene todo el contenido que quieres mostrar a los usuarios cuando visitan tu página, ya sea texto, imágenes, vídeos, juegos, pistas de audio reproducibles o cualquier otra cosa.</li>
+</ol>
+
+<h3 id="Aprendizaje_activo_Añadir_algunas_características_a_un_documento_HTML">Aprendizaje activo: Añadir algunas características a un documento HTML</h3>
+
+<p>Si quieres escribir algo de HTML en tu ordenador local para experimentar, puedes:</p>
+
+<ol>
+ <li>Copiar el ejemplo de la página HTML del punto anterior.</li>
+ <li>Crear un archivo nuevo en un editor de texto.</li>
+ <li>Pegar el código en el nuevo archivo de texto.</li>
+ <li>Guardar el archivo como <code>index.html</code>.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: También puedes encontrar esta plantilla básica de HTML en el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/getting-started/index.html">repositorio GitHub del Área MDN Learning</a>.</p>
+</div>
+
+<p>Ahora puedes abrir este archivo en un navegador web para ver cómo se ve el código renderizado. Edita el código y actualiza el navegador para ver cuál es el resultado. En principio se verá algo así:</p>
+
+<p><img alt="Una sencilla página HTML que dice esta es mi página" src="https://mdn.mozillademos.org/files/12279/template-screenshot.png" style="display: block; height: 365px; margin: 0px auto; width: 595px;">En este ejercicio, puedes editar el código en tu ordenador como se indica arriba, o puedes editarlo en la ventana editable que tienes a continuación (la ventana editable representa solo el contenido del elemento {{htmlelement("body")}}, en este caso). Intenta reproducir los siguientes pasos:</p>
+
+<ul>
+ <li>Justo debajo de la etiqueta de apertura {{htmlelement("body")}}, añade un título principal para el documento. Este deberá estar dentro de una etiqueta de apertura <code>&lt;h1&gt;</code> y una etiqueta de cierre <code>&lt;/h1&gt;</code>.</li>
+ <li>Edita el contenido del párrafo e incluye algún texto sobre algo que te interese.</li>
+ <li>Pon las palabras importantes dentro de etiquetas <code>&lt;strong&gt;</code> de apertura y <code>&lt;/strong&gt;</code> de cierre para que destaquen en negrita.</li>
+ <li>Añade un enlace a tu párrafo, como se ha explicado {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started#Active_learning_Adding_attributes_to_an_element", "anteriormente en este mismo artículo")}}.</li>
+ <li>Agrega una imagen a tu documento. Colócala debajo del párrafo, como {{web.link("/es/Learn/HTML/Introduction_to_HTML/Getting_started#Empty_elements", "se explicó anteriormente en el artículo")}}. Ganarás puntos extra si consigues enlazar a una imagen diferente (de tu propio ordenador o de cualquier otro lugar de la web).</li>
+</ul>
+
+<p>Si te equivocas, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si te quedas realmente atascado, pulsa el botón <em>Mostrar la solución</em> para ver la solución.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_3">Código reproducible 3</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 100px;width: 95%"&gt;
+  &amp;lt;p&amp;gt;Esta es mi página&amp;lt;/p&amp;gt;
+&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h1 {
+ color: blue;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+img {
+  max-width: 100%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution = '&lt;h1&gt;Un poco de música&lt;/h1&gt;&lt;p&gt;Realmente disfruto &lt;strong&gt;tocar la batería&lt;/strong&gt;. Uno de mis bateristas favoritos es Neal Peart, que toca en la banda &lt;a href="https://en.wikipedia.org/wiki/Rush_%28band%29" title="artículo de Wikipedia de"&gt;Rush&lt;/a&gt;.\ Mi álbum favorito de Rush actualmente es &lt;a href="http://www.deezer.com/album/942295"&gt;Fotografías de la película&lt;/a&gt;.&lt;/p&gt;\ &lt;img src="http://www.cygnus-x1.net/links/rush/images/albums/sectors/sector2-movingpictures-cover-s.jpg"&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_3', 700, 600, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="Los_espacios_en_blanco_en_HTML">Los espacios en blanco en HTML</h3>
+
+<p>En los ejemplos anteriores se han incluido espacios en blanco y saltos de línea en el código. Esto realmente no es necesario. Los dos siguientes fragmentos de código son equivalentes:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Los perros son tontos.&lt;/p&gt;
+
+&lt;p&gt;Los    perros        son
+         tontos.&lt;/p&gt;</pre>
+
+<p>No importa cuántos espacios en blanco se utilicen (incluye tanto caracteres de espacio como saltos de línea) el intérprete de HTML reduce cada secuencia de espacio en blanco a un único espacio al interpretar el código. Entonces, ¿por qué utilizar espacios en blanco? La respuesta está en la legibilidad.<br>
+ <br>
+ Es más fácil comprender lo que está sucediendo en tu código si lo tienes bien formateado. En nuestro HTML cada elemento anidado está sangrado dos espacios más con respecto al exterior. Depende de ti qué estilo de formato utilizas (cuántos espacios para cada nivel de sangría, por ejemplo) pero debes plantearte el uso de algún tipo de formato.</p>
+
+<h2 id="Referencias_a_entidades_Inclusión_de_caracteres_especiales_en_HTML">Referencias a entidades: Inclusión de caracteres especiales en HTML</h2>
+
+<p>En HTML, los caracteres <code>&lt;</code>, <code>&gt;</code>,<code>"</code>,<code>'</code> y <code>&amp;</code> son caracteres especiales. Forman parte de la sintaxis HTML. Entonces, ¿cómo incluye uno de estos caracteres especiales en tu texto? Por ejemplo, si deseas utilizar un signo comercial o menor que, y no hacer que se interprete como código.</p>
+
+<p>Haces esto con referencias de caracteres. Estos son códigos especiales que representan caracteres, para ser usados en estas circunstancias exactas. Cada referencia de caracter comienza con un signo de ampersand (&amp;) y finaliza con un punto y coma (;).</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracter literal</th>
+   <th scope="col">Equivalente de referencia de caracteres</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>&lt;</td>
+   <td>&amp;lt;</td>
+  </tr>
+  <tr>
+   <td>&gt;</td>
+   <td>&amp;gt;</td>
+  </tr>
+  <tr>
+   <td>"</td>
+   <td>&amp;quot;</td>
+  </tr>
+  <tr>
+   <td>'</td>
+   <td>&amp;apos;</td>
+  </tr>
+  <tr>
+   <td>&amp;</td>
+   <td>&amp;amp;</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>El equivalente de referencia de caracter podría recordarse fácilmente porque el texto que utiliza se puede ver como menor que para '&amp;lt;' , cita para ' &amp;quot; ' y de manera similar para otros. Para obtener más información sobre la referencia de entidad, consulta {{interwiki("wikipedia", "Anexo:Referencias a entidades de caracteres XML y HTML")}} en (Wikipedia).<br>
+ <br>
+ Considera los dos siguientes párrafos:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;En HTML, defines un párrafo con el elemento &lt;p&gt;.&lt;/p&gt;
+
+&lt;p&gt;En HTML, defines un párrafo con el elemento &amp;lt;p&amp;gt;.&lt;/p&gt;</pre>
+
+<p>En la salida en vivo de abajo, puedes ver que el primer párrafo salió mal. El navegador interpreta la segunda instancia de <code>&lt;p&gt;</code> como el inicio de un nuevo párrafo. El segundo párrafo se ve bien porque hemos remplazado <code>&lt;</code> y <code>&gt;</code> por sus referencias correspondientes.</p>
+
+<p>{{ EmbedLiveSample('Referencias_a_entidades_Inclusión_de_caracteres_especiales_en_HTML', 700, 200) }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: En la Wikipedia se puede localizar un listado de todas las referencias de entidades de caracteres HTML disponibles: {{interwiki("wikipedia", "Anexo:Referencias a entidades de caracteres XML y HTML")}}. Observa que no necesitas usar ninguna referencia de entidad más para ningún otro de estos símbolos porque los navegadores modernos gestionan estos símbolos correctamente siempre y cuando en tu HTML hayas {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "establecido la codificación de el juego de caracteres universal UTF-8", "#Specifying_your_document's_character_encoding")}}.</p>
+</div>
+
+<h2 id="Comentarios_HTML">Comentarios HTML</h2>
+
+<p>En HTML hay un mecanismo para escribir comentarios en el código. Los comentarios son ignorados por el navegador y, por tanto, son invisibles para el usuario. El propósito de los comentarios es permitirte incluir notas en el código para explicar tu lógica o codificación. Esto es muy útil si regresas a un código base después de estar ausente el tiempo suficiente como para no recordarlo por completo. Del mismo modo, los comentarios son invaluables ya que diferentes personas están realizando cambios y actualizaciones.</p>
+
+<p>Para convertir en un comentario una sección de contenido de tu archivo HTML, debes delimitarlo con los marcadores especiales <code>&lt;!--</code> y <code>--&gt;</code>. Por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;No soy un comentario&lt;/p&gt;
+
+&lt;!-- &lt;p&gt;¡Yo sí!&lt;/p&gt; --&gt;</pre>
+
+<p>Como puedes ver a continuación, el primer párrafo aparece, pero el segundo no.</p>
+
+<p>{{ EmbedLiveSample('Comentarios_HTML', 700, 100, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Has llegado al final del artículo. Espero que hayas disfrutado del recorrido los conceptos básicos del HTML.<br>
+ En este punto ya deberías entender el lenguaje, cómo funciona en un nivel básico y deberías poder escribir algunos elementos y atributos. También deberías poder escribir algunos elementos y atributos. Los artículos posteriores de este módulo profundizan en algunos de los temas aquí presentados, además de presentar otros conceptos del lenguaje.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: En este punto, a medida que empieces a aprender más sobre HTML, es posible que también desees comenzar a explorar los conceptos básicos de las Hojas de estilo en cascada (<em>Cascading style sheets</em>) o {{web.link("/es/docs/Learn/CSS", "CSS")}}. CSS, es el lenguaje utilizado para estilizar páginas web. (por ejemplo, cambiar fuentes o colores, o alterar el diseño de la página) HTML y CSS funcionan bien juntos, como pronto descubrirás.</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Web/HTML/Applying_color", "Aplicación de color a elementos HTML mediante CSS")}}</li>
+</ul>
+
+<div>{{NextMenu("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<div></div>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started">Empezar con HTML</a></li>
+ <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">¿Qué hay en la cabecera? Metadatos en HTML</a></li>
+ <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals">Fundamentos de texto HTML</a></li>
+ <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creando hipervínculos</a></li>
+ <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">Formateo de texto avanzado</a></li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
+ <li><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML">Depurar HTML</a></li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcando para una carta")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
+</ul>
diff --git a/files/es/learn/html/introduction_to_html/html_text_fundamentals/index.html b/files/es/learn/html/introduction_to_html/html_text_fundamentals/index.html
new file mode 100644
index 0000000000..26c7cf3963
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/html_text_fundamentals/index.html
@@ -0,0 +1,971 @@
+---
+title: Fundamentos de texto en HTML
+slug: Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals
+tags:
+  - CodingScripting
+  - Encabezados
+  - Estructuras
+  - Guía
+  - HTML
+  - Introducción a HTML
+  - Novato
+  - Principiante
+  - Párrafos
+  - Texto
+  - aprende
+  - semántica
+translation_of: Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals
+original_slug: Learn/HTML/Introduccion_a_HTML/texto
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">Una de las principales funciones de HTML es dar al texto estructura y significado (también conocido como {{Glossary("semantics", "semántica")}}), de forma que un navegador pueda mostrarlo correctamente. Este articulo explica la forma en que se puede usar {{Glossary("HTML")}} para estructurar una página de texto añadiendo encabezados y párrafos, enfatizando palabras, creando listas y más.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Estar familiarizado con el HTML básico, que se expone en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender a marcar una página de texto básica para darle estructura y significado, incluidos párrafos, encabezados, listas, efectos de énfasis y citas.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Conceptos_básicos_Encabezados_y_párrafos">Conceptos básicos: Encabezados y párrafos</h2>
+
+<p>La mayor parte del texto estructurado está compuesto por encabezados y párrafos, independientemente de si lees una historia, un periódico, un libro de texto, una revista, etc.</p>
+
+<p><img alt="Un ejemplo de la portada de un periódico, que muestra el uso de un encabezado, subtítulos y párrafos de nivel superior." src="https://mdn.mozillademos.org/files/12371/newspaper_small.jpg" style="display: block; margin: 0 auto;"></p>
+
+<p>El contenido estructurado simplifica la experiencia en la lectura y se disfruta más.</p>
+
+<p>En HTML, cada párrafo tiene que estar delimitado por un elemento {{HTMLElement("p")}}, como en este ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Soy un párrafo, ¡desde luego que lo soy!&lt;/p&gt;</pre>
+
+<p>Cada sección tiene que estar delimitada por un elemento de encabezado:</p>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Yo soy el título de la historia&lt;/h1&gt;</pre>
+
+<p>Hay seis elementos de encabezado: {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}} y {{HTMLElement("h6")}}. Cada elemento representa un nivel de contenido diferente en el documento; <code>&lt;h1&gt;</code> representa el título principal, <code>&lt;h2&gt;</code> representa el subtítulo, <code>&lt;h3&gt;</code> representa el subtítulo del subtítulo, y así sucesivamente.</p>
+
+<h3 id="Cómo_establecer_la_estructura_jerárquica">Cómo establecer la estructura jerárquica</h3>
+
+<p>Por ejemplo, en esta historia, <code>&lt;h1&gt;</code> representa el título de la historia, <code>&lt;h2&gt;</code> representará el título de cada capítulo y <code>&lt;h3&gt;</code> las diferentes secciones del capítulo, y así sucesivamente.</p>
+
+<pre class="brush: html notranslate">&lt;h1&gt;El agujero aplastante&lt;/h1&gt;
+
+&lt;p&gt;Por Chris Mills&lt;/p&gt;
+
+&lt;h2&gt;Capítulo 1: La oscura noche&lt;/h2&gt;
+
+&lt;p&gt;Era una noche oscura. En algún lugar, un búho ululó. La lluvia azotó el ...&lt;/p&gt;
+
+&lt;h2&gt;Capítulo 2: El silencio eterno&lt;/h2&gt;
+
+&lt;p&gt;Nuestro protagonista ni susurrar pudo al ver esa sombría figura ...&lt;/p&gt;
+
+&lt;h3&gt;El espectro habla&lt;/h3&gt;
+
+&lt;p&gt;Habían pasado varias horas más, cuando de repente el espectro se incorporó y exclamó: "¡Por favor, ten piedad de mi alma!"&lt;/p&gt;</pre>
+
+<p>Realmente es a tu elección lo que cada elemento involucrado represente, siempre y cuando la jerarquía tenga sentido. Solo es necesario que tengas en cuenta unas pocas buenas prácticas mientras creas la estructura:</p>
+
+<ul>
+ <li>Preferentemente debes usar solo un <code>&lt;h1&gt;</code> por página; este es el nivel de título superior, y todos los demás se sitúan por debajo de él en la jerarquía.</li>
+ <li>Asegúrate de que usas los títulos en el orden correcto en la jerarquía. No uses los <code>&lt;h3&gt;</code> para representar subtítulos, seguidos de los <code>&lt;h2&gt;</code> para representar los subtítulos de los subtítulos; eso no tiene sentido y provocará resultados extraños.</li>
+ <li>De los seis niveles de títulos disponibles, debes procurar no usar más de tres por página, a menos que creas que es realmente necesario. Los documentos con muchos niveles (es decir, una jerarquía de títulos muy profunda) son de difícil manejo y navegación. En esos casos se recomienda, si es posible, separar el contenido en varias páginas.</li>
+</ul>
+
+<h3 id="¿Por_qué_necesitamos_estructura">¿Por qué necesitamos estructura?</h3>
+
+<p>Para responder a esta cuestión, echemos un vistazo a <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/html-text-formatting/text-start.html">text-start.html</a>; el apartado inicial de nuestro ejemplo en curso para este artículo (una buena receta de hummus). Debes guardar una copia de este archivo en tu ordenador porque después la necesitarás para los ejercicios prácticos. El cuerpo (<code>&lt;body&gt;</code>) de este documento incluye varios elementos de contenido que no están marcados de ninguna manera pero están separados por saltos de línea (se ha pulsado <strong>Intro</strong>/<strong>Retorno</strong> para continuar en la siguiente línea).</p>
+
+<p>Sin embargo, cuando abres el documento en tu navegador, verás que el texto aparece... ¡como una masa enorme!</p>
+
+<p><img alt="Una página web que muestra un muro de texto sin formato, porque no hay elementos en la página para estructurarlo." src="https://mdn.mozillademos.org/files/12972/text-no-formatting.png" style="display: block; height: 420px; margin: 0px auto; width: 594px;"></p>
+
+<p>Esto se debe a que no hay elementos que den estructura al contenido, por lo que el navegador no sabe qué es un encabezado y qué es un párrafo. Además:</p>
+
+<ul>
+ <li>Los usuarios que miran una página web tienden a escanearla rápidamente para encontrar el contenido relevante que hay en ella y a menudo empiezan por leer los encabezados para comenzar. (Solemos <a href="http://www.nngroup.com/articles/how-long-do-users-stay-on-web-pages/">pasar muy poco tiempo en una página web</a>). Si no pueden ver nada útil en unos segundos, es probable que se sientan frustrados y se vayan a otro sitio.</li>
+ <li>Los motores de búsqueda que indizan tu página consideran el contenido de los títulos como palabras clave importantes e influyen en la puntuación de búsqueda de la página. Sin encabezados, tu página tendrá un rendimiento bajo en términos de optimización de motores de búsqueda {{Glossary("SEO")}}.</li>
+ <li>Las personas con discapacidad visual severa no suelen leer páginas web: en lugar de ello, las escuchan. Lo hacen con un software llamado {{interwiki("wikipedia", "Lector de pantalla")}}. Este software proporciona acceso rápido a un contenido textual dado. Entre las diversas técnicas que emplean, leen los encabezados para proporcionar un esquema del documento que permite a los usuarios encontrar rápidamente la información que quieren. Si no hay encabezados disponibles, se ven obligados a escuchar el documento entero. </li>
+ <li>Para aplicar estilos al contenido con {{Glossary("CSS")}}, o para que haga cosas interesantes con {{Glossary("JavaScript")}}, necesitas tener elementos que delimiten el contenido relevante para que CSS/JavaScript se puedan focalizar en este efectivamente.</li>
+</ul>
+
+<p>Por lo tanto, debemos dar a nuestro contenido una estructura definida.</p>
+
+<h3 id="Aprendizaje_Activo_Dar_estructura_a_nuestro_contenido">Aprendizaje Activo: Dar estructura a nuestro contenido</h3>
+
+<p>Pasemos directamente a un ejemplo real. En el ejemplo de abajo, añade elementos al texto en bruto en el campo <em>Código editable</em> para que en el campo <em>Salida en vivo</em> aparezcan como un encabezado y dos párrafos.</p>
+
+<p>Si te equivocas, siempre puedes restablecer el código anterior pulsando el botón <em>Restablecer</em>. Si encallas, pulsa el botón <em>Mostrar solución</em> para ver la respuesta...</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 100px; width: 95%"&gt;Mi breve relato Soy estadístico y mi nombre es Trish.
+
+Mis piernas son de cartón y estoy casada con un pez.&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution = '&lt;h1&gt;Mi breve relato&lt;/h1&gt;\n&lt;p&gt;Soy estadístico y mi nombre es Trish.&lt;/p&gt;\n&lt;p&gt;Mis piernas son de cartón y estoy casada con un pez.&lt;/p&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="¿Por_qué_necesitamos_semántica">¿Por qué necesitamos semántica?</h3>
+
+<p>Contamos con la semántica para todo lo que nos rodea. Nos basamos en experiencias previas para conocer la función de cada objeto cotidiano; cuando miramos un objeto, sabemos cuál debe ser su función. Entonces, por ejemplo, esperamos que un semáforo en rojo signifique "alto" y que un semáforo en verde signifique "avance". Las cosas se pueden complicar muy rápidamente si se aplica la semántica incorrecta. (¿Algún país usa rojo para significar "avance"? Esperemos que no).</p>
+
+<p>De manera similar, debemos asegurarnos de que utilizamos los elementos adecuados y damos a nuestro contenido el significado y función correctos y la apariencia adecuada. En este mismo sentido, el elemento {{HTMLElement("h1")}} es un elemento semántico que da al texto al que delimita la función (o significado) de un <em>titular de primer nivel en tu página</em>.</p>
+
+<pre class="brush: html notranslate">&lt;h1&gt;Este es un titular de primer nivel&lt;/h1&gt;</pre>
+
+<p>De manera predeterminada, el navegador le asignará una fuente de gran tamaño para darle el aspecto de un titular (aunque se le podrá dar el estilo que se quisiera usando CSS). Lo más importante es que su valor semántico se va a usar de diferente manera, por ejemplo, por los motores de búsqueda y los lectores de pantalla (como se mencionó antes).</p>
+
+<p>Por otra parte, podrías hacer que cualquier elemento <em>parezca</em> un titular de primer rango. Considera lo siguiente:</p>
+
+<pre class="brush: html notranslate">&lt;span style="font-size: 32px; margin: 21px 0;"&gt;¿Es este un titular de primer rango?&lt;/span&gt;</pre>
+
+<p>Este es un elemento {{HTMLElement("span")}}. No tiene semántica. Se usa para delimitar contenido cuando se le quiere aplicar CSS (o tratarlo con JavaScript) sin proporcionarle ningún significado extra (encontrarás más información sobre este tipo de elemento más adelante en el curso). Hemos aplicado CSS a este elemento para que parezca un titular de primer nivel, pero al no tener valor semántico, no tiene ninguna de las ventajas añadidas que hemos descrito antes. Es una buena idea usar el elemento HTML apropiado para cada tarea.</p>
+
+<h2 id="Listas">Listas</h2>
+
+<p>Ahora volvamos nuestra atención hacia las listas. Las listas están en todos los aspectos de nuestra vida: desde la lista de compras a la lista de instrucciones que sigues inconscientemente para llegar a casa todos los días, o las listas de instrucciones que sigues en estos tutoriales. Las listas están en todos lados en la web también y hay tres diferentes tipos de las que nos vamos a ocupar.</p>
+
+<h3 id="Listas_no_ordenadas">Listas no ordenadas</h3>
+
+<p>Las listas no ordenadas se usan para marcar listas de artículos cuyo orden no es importante. Tomemos como ejemplo una lista de compras:</p>
+
+<pre class="brush: bash notranslate">leche
+huevos
+pan
+hummus</pre>
+
+<p>Cada lista desordenada comienza con un elemento {{HTMLElement("ul")}} («<em>unordered list</em>») que delimita todos los elementos de la lista:</p>
+
+<pre class="brush: html notranslate">&lt;ul&gt;
+leche
+huevos
+pan
+hummus
+&lt;/ul&gt;</pre>
+
+<p>El siguiente paso es delimitar cada artículo de la lista con un elemento {{HTMLElement("li")}} («<em>list item</em>»).</p>
+
+<pre class="brush: html notranslate">&lt;ul&gt;
+  &lt;li&gt;leche&lt;/li&gt;
+  &lt;li&gt;huevos&lt;/li&gt;
+  &lt;li&gt;pan&lt;/li&gt;
+  &lt;li&gt;hummus&lt;/li&gt;
+&lt;/ul&gt;</pre>
+
+<h4 id="Aprendizaje_activo_marcar_una_lista_no_ordenada">Aprendizaje activo: marcar una lista no ordenada</h4>
+
+<p>Edita el siguiente ejemplo para crear tu propia lista HTML no ordenada.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_2">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 100px; width: 95%"&gt;leche
+huevos
+pan
+hummus&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution = '&lt;ul&gt;\n&lt;li&gt;leche&lt;/li&gt;\n&lt;li&gt;huevos&lt;/li&gt;\n&lt;li&gt;pan&lt;/li&gt;\n&lt;li&gt;hummus&lt;/li&gt;\n&lt;/ul&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_2', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="Listas_ordenadas">Listas ordenadas</h3>
+
+<p>Las listas ordenadas son aquellas en las que el orden de los elementos <em>sí</em> importa. Tomemos como ejemplo una lista de instrucciones para seguir un itinerario:</p>
+
+<pre class="brush: bash notranslate">Conduce hasta el final de la calle
+Gira a la derecha
+Sigue derecho por las dos primeras glorietas
+Gira a la izquierda en la tercer glorieta
+El colegio está a la derecha, 300 metros más adelante</pre>
+
+<p>La estructura de marcado es la misma que para las listas no ordenadas, excepto que debes delimitar los elementos de la lista con una etiqueta {{HTMLElement("ol")}} («ordered list»), en lugar de <code>&lt;ul&gt;</code>:</p>
+
+<pre class="brush: html notranslate">&lt;ol&gt;
+  &lt;li&gt;Conduce hasta el final de la calle&lt;/li&gt;
+  &lt;li&gt;Gira a la derecha&lt;/li&gt;
+  &lt;li&gt;Sigue derecho por las dos primeras glorietas&lt;/li&gt;
+  &lt;li&gt;Gira a la izquierda en la tercer glorieta&lt;/li&gt;
+  &lt;li&gt;El colegio está a tu derecha, 300 metros más adelante&lt;/li&gt;
+&lt;/ol&gt;</pre>
+
+<h4 id="Aprendizaje_activo_Marcar_una_lista_ordenada">Aprendizaje activo: Marcar una lista ordenada</h4>
+
+<p>Edita el siguiente ejemplo para crear tu propia lista ordenada en HTML.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_3">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 200px; width: 95%"&gt;Conduce hasta el final de la calle
+Gira a la derecha
+Sigue derecho por las dos primeras glorietas
+Gira a la izquierda en la tercer glorieta
+La escuela está a tu derecha, 300 metros por más adelante&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution = '&lt;ol&gt;\n&lt;li&gt;Conduce hasta el final de la calle&lt;/li&gt;\n&lt;li&gt;Gira a la derecha&lt;/li&gt;\n&lt;li&gt;Sigue derecho por las dos primeras glorietas&lt;/li&gt;\n&lt;li&gt;Gira a la izquierda en la tercer glorieta&lt;/li&gt;\n&lt;li&gt;La escuela está a tu derecha, 300 metros más adelante&lt;/li&gt;\n&lt;/ol&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_3', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="Aprendizaje_activo_marcar_la_página_de_tu_receta">Aprendizaje activo: marcar la página de tu receta</h3>
+
+<p>Llegados a este punto del artículo, tienes toda la información necesaria para marcar la página de ejemplo con tu receta. Puedes escoger entre guardar una copia local del archivo inicial <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/html-text-formatting/text-start.html">text-start.html</a> y trabajar en él, o hacerlo sobre el ejemplo editable de abajo. Probablemente sea mejor trabajar en tu copia local porque podrás guardar tu progreso, mientras que si lo haces sobre el ejemplo editable, los cambios se perderán la próxima vez que cargues la página. Ambos métodos tienen pros y contras.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_4">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 200px; width: 95%"&gt;Receta rápida de hummus
+
+  Esta receta hace un hummus rápido y sabroso, sin ensuciar. Ha sido adaptada de varias recetas diferentes que he leído a lo largo de los años.
+
+  El hummus es una deliciosa pasta espesa que se usa mucho en platos griegos y del Medio Oriente. Es muy sabroso con ensalada, carne a las brasas y pan de pitta.
+
+  Ingredientes
+
+  1 lata (400g) de garbanzos (garbanzos)
+  175g de tahini
+  6 tomates secos
+  Medio pimiento rojo
+  Una pizca de pimienta de cayena
+  1 diente de ajo
+  Una pizca de aceite de oliva
+
+  Instrucciones
+
+  Retira la piel del ajo y pica en trozos grandes.
+  Retira todas las semillas y el tallo del pimiento y pica en trozos grandes.
+  Agrega todos los ingredientes en un procesador de alimentos.
+  Procesa todos los ingredientes en una pasta
+  Si deseas un hummus "grueso", procésalo corto tiempo
+  Si deseas un hummus "suave", procésalo por más tiempo
+
+  Para un sabor diferente, puedes intentar mezclar en una pequeña medida de limón y cilantro, ají, lima y chipotle, harissa y menta, o espinacas y queso feta. Pruébalo y confirma que esté en su punto.
+
+  Almacenamiento
+
+  Refrigera el hummus terminado en un recipiente sellado. Deberías poder usarlo durante aproximadamente una semana después de haberlo hecho. Si comienza a burbujear, definitivamente debes desecharlo.
+
+  El hummus es apto para congelar; debes descongelarlo y usarlo en un par de meses.&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution = '&lt;h1&gt;Receta rápida de hummus&lt;/h1&gt;\n\n&lt;p&gt;Esta receta hace un hummus rápido y sabroso, sin ensuciar. Ha sido adaptada de varias recetas diferentes que he leído a lo largo de los años.&lt;/p&gt;\n\n&lt;p&gt;El hummus es una deliciosa pasta espesa que se usa mucho en platos griegos y del Medio Oriente. Es muy sabroso con ensalada, carne a las brasas y pan de pitta.&lt;/p&gt;\n\n&lt;h2&gt;Ingredientes&lt;/h2&gt;\n\n&lt;ul&gt;\n&lt;li&gt;1 lata (400g) de garbanzos (garbanzos)&lt;/li&gt;\n&lt;li&gt;175g de tahini&lt;/li&gt;\n&lt;li&gt;6 tomates secos&lt;/li&gt;\n&lt;li&gt;Medio pimiento rojo&lt;/li&gt;\n&lt;li&gt;Una pizca de pimienta de cayena&lt;/li&gt;\n&lt;li&gt;1 diente de ajo&lt;/li&gt;\n&lt;li&gt;Una pizca de aceite de oliva&lt;/li&gt;\n&lt;/ul&gt;\n\n&lt;h2&gt;Instrucciones&lt;/h2&gt;\n\n&lt;ol&gt;\n &lt;li&gt;Retira la piel del ajo y pica en trozos grandes.&lt;/li&gt;\n&lt;li&gt;Retira todas las semillas y el tallo del pimiento, y pica en trozos grandes.&lt;/li&gt;\n&lt;li&gt;Agrega todos los ingredientes en un procesador de alimentos.&lt;/li&gt;\n&lt;li&gt;Procesa todos los ingredientes en una pasta.&lt;/li&gt;\n&lt;li&gt;Si deseas un hummus "grueso", procésalo corto tiempo.&lt;/li&gt;\n&lt;li&gt;Si deseas un hummus "suave", procésalo por más tiempo.&lt;/li&gt;\n&lt;/ol&gt;\n\n&lt;p&gt;Para un sabor diferente, puedes intentar mezclar una pequeña medida de limón y cilantro, ají, lima y chipotle, harissa y menta, o espinacas y queso feta. Pruébalo y confirma que esté en su punto.&lt;/p&gt;\n\n&lt;h2&gt;Almacenamiento&lt;/h2&gt;\n\n&lt;p&gt;Refrigera el hummus terminado en un recipiente sellado. Deberías poder usarlo durante aproximadamente una semana después de haberlo hecho. Si comienza a burbujear, definitivamente debes desecharlo.&lt;/p&gt;\n\n&lt;p&gt;El hummus es adecuado para congelar; debes descongelarlo y usarlo en un par de meses.&lt;/p&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_4', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<p>Si encallas, siempre puedes pulsar el botón <em>Mostrar solución</em> o comprobar el ejemplo completo <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/html-text-formatting/text-complete.html">text-complete.html</a> en nuestro repositorio de Github.</p>
+
+<h3 id="Listas_anidadas">Listas anidadas</h3>
+
+<p>Es perfectamente correcto anidar una lista dentro de otra. Posiblemente quieras tener subelementos bajo elementos de rango superior. Tomemos la segunda lista de nuestro ejemplo de la receta:</p>
+
+<pre class="brush: html notranslate">&lt;ol&gt;
+  &lt;li&gt;Pela el ajo y picarlo en trozos gruesos.&lt;/li&gt;
+  &lt;li&gt;Retira las semillas y el tallo del pimiento, y cortarlo en trozos gruesos.&lt;/li&gt;
+  &lt;li&gt;Mete todos los alimentos en un procesador de alimentos.&lt;/li&gt;
+  &lt;li&gt;Pica todos los ingredientes hasta conseguir una pasta.&lt;/li&gt;
+  &lt;li&gt;Si deseas un hummus "grueso", procésalo corto tiempo.&lt;/li&gt;
+  &lt;li&gt;Pica durante más tiempo si se desea obtener un hummus "suave".&lt;/li&gt;
+&lt;/ol&gt;</pre>
+
+<p>Puesto que los dos últimos elementos están estrechamente relacionados con el elemento anterior (se leen como subinstrucciones u opciones que encajan bajo ese elemento), puede tener sentido anidarlos dentro de su propia lista no ordenada e introducir esa lista bajo el cuarto elemento. Tendría el siguiente aspecto:</p>
+
+<pre class="brush: html notranslate">&lt;ol&gt;
+  &lt;li&gt;Pela el ajo y picarlo en trozos gruesos.&lt;/li&gt;
+  &lt;li&gt;Retira las semillas y el tallo del pimiento, y cortarlo en trozos gruesos.&lt;/li&gt;
+  &lt;li&gt;Mete todos los alimentos en un procesador de alimentos.&lt;/li&gt;
+  &lt;li&gt;Procesa todos los ingredientes hasta conseguir una pasta.
+    &lt;ul&gt;
+      &lt;li&gt;Si deseas un hummus "grueso", procésalo corto tiempo.&lt;/li&gt;
+      &lt;li&gt;Pica durante más tiempo si se desea obtener un hummus "suave".&lt;/li&gt;
+    &lt;/ul&gt;
+  &lt;/li&gt;
+&lt;/ol&gt;</pre>
+
+<p>Vuelve al ejemplo anterior y reescribe la lista de este modo.</p>
+
+<h2 id="Énfasis_e_importancia">Énfasis e importancia</h2>
+
+<p>En el lenguaje humano, a menudo enfatizamos ciertas palabras para alterar el significado de una frase, y a menudo queremos destacar ciertas palabras como importantes o diferentes en algún sentido. HTML nos dota de diversos elementos semánticos que nos permiten destacar contenido textual con tales efectos, y en esta sección veremos los más comunes.</p>
+
+<h3 id="Énfasis">Énfasis</h3>
+
+<p>Cuando queremos dar énfasis al lenguaje hablado, <em>acentuamos</em> ciertas palabras y así alteramos sutilmente el significado de lo que decimos. De manera similar, en el lenguaje escrito ponemos palabras en cursiva para destacarlas. Por ejemplo, las dos siguientes frases tienen diferente significado:</p>
+
+<p>Me alegro de que no llegues tarde.</p>
+
+<p>Me <em>alegro</em> de que no llegues <em>tarde</em>.</p>
+
+<p>La primera frase suena aliviada porque la persona no llega tarde. Por el contrario, la segunda suena sarcástica y un tanto pasivo-agresiva, expresa molestia porque la persona ha llegado algo tarde.</p>
+
+<p>En HTML usamos el elemento {{HTMLElement("em")}} («<em>emphasis</em>») para marcar estos casos. El documento logra entonces transmitir una lectura más interesante y además así lo reconocen los lectores de pantalla, que lo expresan con un diferente tono de voz. El navegador, de manera predeterminada, aplica el estilo de letra itálica, pero no debes utilizar esta etiqueta solamente para establecer el estilo de letra itálica. Para usar ese estilo, debes utilizar únicamente la etiqueta del elemento {{HTMLElement("span")}} y algo de CSS u otra etiqueta con el elemento {{HTMLElement("i")}} (ve abajo).</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Me &lt;em&gt;alegro&lt;/em&gt; de que no llegues &lt;em&gt;tarde&lt;/em&gt;.&lt;/p&gt;</pre>
+
+<h3 id="Importancia_fuerte">Importancia fuerte</h3>
+
+<p>Para enfatizar palabras importantes al hablar solemos acentuarlas, y al escribir lo hacemos en estilo <strong>negrita</strong>. Por ejemplo:</p>
+
+<p>Este líquido es <strong>altamente tóxico</strong>.</p>
+
+<p>Cuento contigo. <strong>¡No llegues tarde!</strong></p>
+
+<p>En HTML usamos el elemento {{HTMLElement("strong")}} (importancia fuerte) para marcar tales expresiones. El documento resulta entonces más útil, y de nuevo los lectores de pantalla reconocen estos elementos y el tono de voz cambia a uno más fuerte. El estilo negrita es el que aplican los navegadores por omisión, pero no debes usar esta etiqueta solamente para aplicar este estilo. Para hacer eso usa el elemento {{HTMLElement("span")}} y CSS, o un elemento  {{HTMLElement("b")}} (ve más abajo).</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Este líquido es &lt;strong&gt;altamente tóxico&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;p&gt;Cuento contigo. &lt;strong&gt;¡No llegues tarde!&lt;/strong&gt;&lt;/p&gt;</pre>
+
+<p>Puedes anidar elementos de énfasis dentro de elementos de importancia y viceversa si lo deseas:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Este líquido es &lt;strong&gt;altamente tóxico&lt;/strong&gt; —
+si lo bebes, &lt;strong&gt;podrías &lt;em&gt;morir&lt;/em&gt;&lt;/strong&gt;.&lt;/p&gt;</pre>
+
+<h3 id="Aprendizaje_activo_¡Seamos_importantes!">Aprendizaje activo: ¡Seamos importantes!</h3>
+
+<p>En esta sección de aprendizaje activo te proporcionamos un ejemplo editable. Practica un poco añadiendo algo de <em><strong>énfasis</strong></em> e <strong><em>importancia</em></strong> a las palabras que creas que lo necesitan.</p>
+
+<div class="hidden">
+<h6 id="Código_reproducible_5">Código reproducible</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Salida en vivo&lt;/h2&gt;
+
+&lt;div class="output" style="min-height: 50px;"&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Código editable&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Pulsa Esc para quitar el foco del área de código (Tab inserta un carácter de tabulación).&lt;/p&gt;
+
+&lt;textarea id="code" class="input" style="min-height: 200px; width: 95%"&gt;&lt;h1&gt;Aviso importante&lt;/h1&gt;
+&lt;p&gt;El domingo 9 de enero de 2019, fue vista una pandilla de góticos
+  robando varios gnomos de jardín de un
+  centro comercial en el centro de Milwaukee. Todos ellos
+  vistiendo monos verdes y tontos sombreros, y
+  al parecer estaban pasando un buen rato. Si alguien
+   tiene alguna información sobre este incidente, por favor
+    póngase en contacto con la policía ahora.&lt;/p&gt;&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Restablecer"&gt;
+  &lt;input id="solution" type="button" value="Mostrar solución"&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var output = document.querySelector('.output');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  output.innerHTML = textarea.value;
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = htmlSolution;
+  solution.value = 'Mostrar solución';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Mostrar solución') {
+    textarea.value = solutionEntry;
+    solution.value = 'Ocultar solución';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Mostrar solución';
+  }
+  updateCode();
+});
+
+var htmlSolution='&lt;h1&gt;Aviso importante&lt;/h1&gt;\n&lt;p&gt;El &lt;strong&gt;domingo 9 de enero de 2019&lt;/strong&gt;, fue vista una pandilla de &lt;em&gt;góticos&lt;/em&gt; robando &lt;strong&gt;varios &lt;em&gt;gnomos&lt;/em&gt; de jardín&lt;/strong&gt; de un centro comercial en el centro de &lt;strong&gt;Milwaukee&lt;/strong&gt;. Todos ellos vistiendo &lt;em&gt;monos verdes&lt;/em&gt; y &lt;em&gt;tontos sombreros&lt;/em&gt;, y al parecer estaban pasando un buen rato. Si alguien tiene &lt;strong&gt;alguna&lt;/strong&gt; información sobre este incidente, póngase en contacto con la policía &lt;strong&gt;ahora&lt;/strong&gt;.&lt;/p&gt;';
+var solutionEntry = htmlSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// captura la tecla de tabulación en el área de texto y en su lugar
+// hace que se escriba una tabulación en la posición del cursor
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Actualiza el userCode guardado cada vez que el usuario actualiza el código del área de texto
+
+textarea.onkeyup = function(){
+  // Solo queremos guardar el estado cuando se muestra el código de usuario,
+  // no es la solución, por lo que la solución no se guarda sobre el código del usuario
+  if(solution.value === 'Mostrar solución') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_reproducible_5', 700, 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="Cursiva_negrita_subrayado...">Cursiva, negrita, subrayado...</h3>
+
+<p>Los elementos que hemos comentado hasta ahora tienen asociada una semántica clara. La situación con {{HTMLElement("b")}} (negrita o «<b>bold</b>»), {{HTMLElement("i")}} (cursiva o «<i>italic</i>») y{{HTMLElement("u")}} (subrayado o «<u>underline</u>») es algo más complicada. Surgieron para que las personas pudieran escribir textos en negrita, cursiva o subrayado en un tiempo en el que pocos navegadores o ninguno admitían el CSS. Elementos como estos, que solo afectan a la presentación y no a la semántica, se conocen como <strong>elementos de presentación</strong> y no se deberían usar porque, como hemos visto, la semántica es muy importante para la accesibilidad y el SEO, entre otros aspectos.</p>
+
+<p>HTML5 redefinió los elementos <code>&lt;b&gt;</code>, <code>&lt;i&gt;</code> y <code>&lt;u&gt;</code> con roles semánticos nuevos un tanto confusos.</p>
+
+<p>Esta es la regla de oro: el uso de <code>&lt;b&gt;</code>, <code>&lt;i&gt;</code> o <code>&lt;u&gt;</code> resulta adecuado cuando transmiten el significado que suele transmitir el uso tradicional de las negritas, itálicas o el subrayado, si no hay ningún otro elemento que resulte más adecuado. Sin embargo, siempre resulta crítico mantener una actitud orientada a la accesibilidad. El concepto de itálica no es demasiado útil para las personas que usan lectores de pantalla o para las personas que utilizan un sistema de escritura distinto del alfabeto latino.</p>
+
+<ul>
+ <li>{{HTMLElement('i')}} se usa para transmitir el significado que tradicionalmente transmite la itálica: extranjerismos, clasificaciones taxonómicas, conceptos técnicos, un pensamiento...</li>
+ <li>{{HTMLElement('b')}} se usa para transmitir el significado que tradicionalmente transmite la negrita: palabras clave, nombres de productos, frases principales...</li>
+ <li>{{HTMLElement('u')}} se usa para transmitir el significado que tradicionalmente conlleva el subrayado: nombres propios, errores ortográficos...</li>
+</ul>
+
+<div class="note">
+<p>Una observación prudente acerca del subrayado: <strong>La gente suele asociar estrechamente el subrayado con los hipervínculos.</strong> Por ello en la web es mejor reservar el subrayado para los enlaces. Utiliza el elemento {{HTMLElement('u')}} cuando resulte apropiado semánticamente, pero considera usar CSS para cambiar el subrayado predeterminado por algo más adecuado en la web. El siguiente ejemplo ilustra cómo lo puedes hacer.</p>
+</div>
+
+<pre class="brush: html notranslate">&lt;!-- nombres científicos --&gt;
+&lt;p&gt;
+  El colibrí garganta de rubí (&lt;i&gt;Archilochus colubris&lt;/i&gt;)
+  es el colibrí más común en el este de América del Norte.
+&lt;/p&gt;
+
+&lt;!-- extranjerismos --&gt;
+&lt;p&gt;
+  El menú era un mar de palabras exóticas como &lt;i lang="uk-latn"&gt;vatrushka&lt;/i&gt;,
+  &lt;i lang="id"&gt;nasi goreng&lt;/i&gt; y &lt;i lang="fr"&gt;soupe à l'oignon&lt;/i&gt;.
+&lt;/p&gt;
+
+&lt;!-- un error ortográfico reconocido --&gt;
+&lt;p&gt;
+  Algún día aprenderé a <u>deletrear</u> mejor.
+&lt;/p&gt;
+
+&lt;!-- Palabras clave destacadas en una serie de instrucciones --&gt;
+&lt;ol&gt;
+  &lt;li&gt;
+    &lt;b&gt;Corta&lt;/b&gt; dos piezas de la hogaza de pan.
+  &lt;/li&gt;
+  &lt;li&gt;
+    &lt;b&gt;Inserta&lt;/b&gt; una rodaja de tomate y una hoja de
+    lechuga entre las rebanadas de pan.
+  &lt;/li&gt;
+&lt;/ol&gt;</pre>
+
+<h2 id="¡Pon_a_prueba_tus_habilidades!">¡Pon a prueba tus habilidades!</h2>
+
+<p>Has llegado al final de este artículo, pero ¿puedes recordar la información más importante? Encontrarás más ejercicios con los que comprobar que has retenido esta información antes de seguir adelante en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Test_your_skills:_HTML_text_basics", "Pon a prueba tus habilidades: Prueba de conocimientos básicos de HTML")}}.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>¡Eso es todo por ahora! Este artículo debería haberte dado una buena idea de cómo comenzar a marcar texto en HTML y te ha presentado algunos de los elementos más importantes en este ámbito. Hay muchos más elementos semánticos para desarrollar en esta área, y veremos muchos más en nuestro artículo {{web.link("/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}, más adelante en el curso. En el siguiente artículo, veremos en detalle cómo {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "crear hipervínculos")}}, posiblemente el más importante elemento en la web.</p>
+
+<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Learn/HTML/Introduction_to_HTML")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Crear hipervínculos")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
+</ul>
diff --git a/files/es/learn/html/introduction_to_html/index.html b/files/es/learn/html/introduction_to_html/index.html
new file mode 100644
index 0000000000..cbbb3806eb
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/index.html
@@ -0,0 +1,78 @@
+---
+title: Introducción a HTML
+slug: Learn/HTML/Introduction_to_HTML
+tags:
+  - CodingScripting
+  - Enlaces
+  - Estructura
+  - HTML
+  - Introducción a HTML
+  - Texto
+  - semántica
+translation_of: Learn/HTML/Introduction_to_HTML
+original_slug: Learn/HTML/Introduccion_a_HTML
+---
+<div>{{LearnSidebar}}</div>
+
+<p class="summary">En su corazón, {{glossary("HTML")}} es un lenguaje muy sencillo compuesto de {{Glossary("Element", "elementos")}}, que se pueden aplicar a piezas de texto para darles un significado diferente en un documento (¿Esto es un párrafo? ¿Esto es una lista con viñetas? ¿Esto es parte de una tabla?), estructura un documento en secciones lógicas (¿Tiene una cabecera? ¿Tres columnas de contenido? ¿Un menú de navegación?), e incrusta contenido como imágenes y vídeos en una página. Este módulo introducirá los dos primeros de estos, e introduce conceptos fundamentales y la sintaxis que necesitas para entender HTML.</p>
+
+<div class="in-page-callout webdev">
+<h3 id="¿Quieres_transformarte_en_un_desarrollador_de_la_interfaz_de_usuario_web">¿Quieres transformarte en un desarrollador de la interfaz de usuario web?</h3>
+
+<p>Hemos elaborado un curso que incluye toda la información esencial que necesitas para trabajar hacia tu objetivo.</p>
+
+<p><a class="cta primary" href="/docs/Learn/Front-end_web_developer">Empieza aquí</a></p>
+</div>
+
+<h2 id="Prerrequisitos">Prerrequisitos</h2>
+
+<p>Antes de empezar este módulo, no necesitas conocimientos previos de HTML, pero deberías estar, por lo menos, familiarizado con el uso básico de computadoras, y usar la Web pasivamente (es decir, sólo revisándola y consumiendo el contenido). Debes tener configurado un entorno de trabajo básico (como se detalla en {{web.link("/es/docs/Learn/Getting_started_with_the_web/Installing_basic_software", "Instalación de software básico")}}), y comprender cómo crear y administrar archivos (como se detalla en {{web.link("/es/docs/Learn/Getting_started_with_the_web/Dealing_with_files", "Manejo de archivos")}}). Ambos son parte de nuestro módulo completo {{web.link("/es/docs/Learn/Getting_started_with_the_web", "Introducción a la web")}} para principiantes.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si estás trabajando en una computadora, tablet u otro dispositivo en donde no tengas la capacidad de crear tus propios archivos, podrías probar (en su mayoría) el código de los ejemplos en un programa para escribir código en línea como <a href="http://jsbin.com/">JSBin</a> o <a href="">Glitch</a>.</p>
+</div>
+
+<h2 id="Guías">Guías</h2>
+
+<p>Este módulo contiene los siguientes artículos, que te llevarán a través de toda la teoría básica de HTML, y te proporcionarán una amplia oportunidad de probar algunas habilidades.</p>
+
+<dl>
+ <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started">Empezar con HTML</a></dt>
+ <dd>Cubre las bases absolutas de HTML, para que puedas empezar — definimos elementos, atributos, y todas los otros términos importantes que puedas haber escuchado, y en donde encajan en el lenguaje. También mostramos cómo está estructurado un elemento HTML, cómo está estructurada una página HTML típica, y explica otras características importantes. <span id="result_box" lang="es">En el camino, vamos a tener un juego con algo de HTML, ¡para alimentar tu intereses!</span></dd>
+ <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">¿Qué hay en la cabecera? Metadatos en HTML</a></dt>
+ <dd>La cabecera de un documento HTML es la parte que <strong>no</strong> se muestra en el navegador web cuando se carga una página. Esta contiene información como el título ({{htmlelement("title")}}) de la página, enlaces a {{glossary("CSS")}} (si quieres estilizar tu contenido HTML con CSS), enlaces a favicons personalizados, y metadatos (que son los datos sobre el HTML, como quién lo escribió, y palabras clave que describen el documento).</dd>
+ <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals">Fundamentos de texto HTML</a></dt>
+ <dd>Uno de los principales trabajos de HTML es darle significado al texto (también conocido como <strong>semántica</strong>) para que el navegador sepa cómo mostrarlo correctamente. Este artículo trata cómo usar HTML para convertir un bloque de texto en una estructura de encabezados y párrafos, agregar énfasis o importancia a las palabras, crear listas y más.</dd>
+ <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creando hipervínculos</a></dt>
+ <dd>Los hipervínculos realmente son importantes — estos son los que hacen la Web. Este artículo muestra la sintaxis requerida para hacer un enlace, y explica las mejores prácticas sobre enlaces.</dd>
+ <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">Formateo de texto avanzado</a></dt>
+ <dd>Hay muchos otros elementos en HTML para formatear texto, que no hemos tratado en los artículos {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "fundamentos de texto HTML")}}. Los siguientes elementos son menos conocidos, pero sigue siendo útil conocerlos. Aquí aprenderás sobre el marcado de citas, listas de descripción, código de computadoras y otros textos relacionados, <span id="result_box" lang="es"><span> subíndices y superíndices, información de contacto, y mucho más</span>.</span></dd>
+ <dt>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</dt>
+ <dd>Así como definimos las partes individuales de tu página (como "un párrafo" o "una imagen"), HTML también se usa para definir las áreas de tu sitio web (como "la cabecera", "el menú de navegación", "la columna de contenido principal"). Este artículo trata sobre cómo planear una estructura básica del sitio web, y escribir el HTML para representar esa estructura.</dd>
+ <dt><a href="/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML">Depurar HTML</a></dt>
+ <dd>Escribir HTML está bien, pero ¿Qué pasa si algo está mal, y no puedes encontrar en dónde está el error en el código? Este artículo introducirá algunas herramientas que te podrán ayudar.</dd>
+</dl>
+
+<h2 id="Evaluaciones">Evaluaciones</h2>
+
+<p>Las siguientes evaluaciones probarán tu entendimiento de las bases de HTML cubiertas en las guías anteriores.</p>
+
+<dl>
+ <dt>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcando para una carta")}}</dt>
+ <dd><span id="result_box" lang="es">Todos aprendemos a escribir una carta, tarde o temprano; ¡Este también es un ejemplo útil para poner a prueba nuestras habilidades de formato de texto! Así que en esta evaluación se te dará una carta a la cual le tendrás que dar un marcado HTML.</span></dd>
+ <dt>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</dt>
+ <dd>Esta evaluación prueba tu capacidad para usar HTML para estructurar el contenido de una sencilla página, esta tiene una cabecera, pie de página, menú de navegación, contenido principal, y una barra lateral.</dd>
+</dl>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<dl>
+ <dt><a href="https://teach.mozilla.org/activities/web-lit-basics/">Bases de la alfabetización Web 1</a></dt>
+ <dd>Un curso excelente de la fundación Mozilla que explora y pone a prueba muchas de las habilidades sobre las cuales hablamos en el módulo de <em>Introducción a HTML</em>. Los estudiantes se familiarizan con la lectura, escritura y participan de la web en este módulo de seis partes. Descubre los fundamentos de la web a través de la producción y colaboración.</dd>
+</dl>
+
+<div class="note">
+<h2 id="Retroalimentación">Retroalimentación</h2>
+
+<p>Ayúdanos a mejorar nuestras guías y tutoriales como esta respondiendo {{web.link("https://www.surveygizmo.com/s3/4871248/MDN-Guides-Survey", "nuestra encuesta aquí")}}.</p>
+</div>
diff --git a/files/es/learn/html/introduction_to_html/marking_up_a_letter/index.html b/files/es/learn/html/introduction_to_html/marking_up_a_letter/index.html
new file mode 100644
index 0000000000..5e1f868f5a
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/marking_up_a_letter/index.html
@@ -0,0 +1,89 @@
+---
+title: Marcando una Carta
+slug: Learn/HTML/Introduction_to_HTML/Marking_up_a_letter
+tags:
+  - Cabecera
+  - Codificación
+  - Enlaces
+  - Evaluación
+  - Principiante
+  - Texto
+translation_of: Learn/HTML/Introduction_to_HTML/Marking_up_a_letter
+original_slug: Learn/HTML/Introduccion_a_HTML/Marking_up_a_letter
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">Todos aprendemos a escribir una carta más tarde o más temprano; es también práctico practicar con nuestras habilidades para dar forma a los textos. En esta prueba deberás demostrar tus habilidades para dar forma a textos, incluyendo enlaces, además pondremos a prueba tu familiaridad con algunos contenidos de encabezamiento <code>&lt;head&gt;</code> en HTML.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Antes de intentar este examen deberías haber trabajado los artículos <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Getting_started">Getting started with HTML</a>, <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">What's in the head? Metadata in HTML</a>, <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals">HTML text fundamentals</a>, <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creating hyperlinks</a>, y <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">Advanced text formatting</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivos:</th>
+   <td>Probar las habilidades básicas y avanzadas de formateo de texto e hyperlinks, y el conocimiento de los encabezamientos en HTML.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Punto_de_partida">Punto de partida</h2>
+
+<p>Para comenzar esta prueba, deberemos copiar <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/marking-up-a-letter-start/letter-text.txt">el texto que deberemos trabajar</a>, y el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/marking-up-a-letter-start/css.txt">CSS que necesitaremos incluir</a> en nuestro HTML. Crearemos un archivo nuevo <code>.html</code> usando nuestro editor de texto (o alternativamente usaremos otros como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer nuestra prueba).</p>
+
+<h2 id="Resumen_del_proyecto_a_desarrollar">Resumen del proyecto a desarrollar</h2>
+
+<p>En este proyecto tu tarea será publicar una carta que debe estar alojada en la intranet de una universidad. La carta es la respuesta de un compañero investigador a un posible estudiante de postgrado en relación a su deseo de trabajar en la universidad.</p>
+
+<p>Semánticas de bloque/estructurales:</p>
+
+<ul>
+ <li>Estructura el documento completo incluyendo los elementos (doctype), {{htmlelement("html")}}, {{htmlelement("head")}} y {{htmlelement("body")}}.</li>
+ <li>Incluye los elementos correspondientes de marcado en la carta tales como párrafos y títulos, a excepción de los siguientes. Hay un título principal (la línea que comienza por "Re:") y tres títulos secundarios.</li>
+ <li>Las fechas de comienzo de los semestres, las materias y los bailes exóticos deben ser marcados con los correspondientes tipos de lista.</li>
+ <li>Colocar las dos direcciones dentro de elementos {{htmlelement("address")}}. Cada línea de la dirección debe comenzar en una línea nueva, pero no en un párrafo nuevo.</li>
+</ul>
+
+<p>Semánticas intralínea:</p>
+
+<ul>
+ <li>Los nombres de remitente y destinatario (también "Tel" e "Email") deben ser marcado con importancia (strong).</li>
+ <li>Deberás usar los elementos apropiados en las cuatro fechas contenidas en el documento para que puedan ser leidas por los motores de lectura automática.</li>
+ <li>La primera dirección y la primera fecha en la carta deben ser asignadas a un atributo de clase llamado "sender-column"; el código CSS lo añadirás posteriormente para que quede bien alineado, como debe ser en un formato de carta clásico.</li>
+ <li>Deberás utilizar el elemento apropiado para los cinco acrónimos/abreviaciones contenidos en el texto principal, proporcionándoles las extensiones correspondientes.</li>
+ <li>Marca apropiadamente los seis sub/superíndices.</li>
+ <li>Los símbolos de los grados, los mayor que y los símbolos de multiplicar deben ser marcados usando las referencias correctas.</li>
+ <li>Marca al menos dos palabras en el texto con fuerte importancia/énfasis.</li>
+ <li>Hay dos lugares donde deberíamos añadir hyperlinks; añádelos con títulos. Como sitio donde apuntan simplemente usa: http://example.com.</li>
+ <li>Marca con el elemento apropiado el lema de la universidad y la cita del autor.</li>
+</ul>
+
+<p>El encabezamiento del documento:</p>
+
+<ul>
+ <li>El juego de caracteres del documento deberá ser utf-8 usando una etiqueta meta adecuada.</li>
+ <li>El autor de la carta debe estar especificado con la etiqueta meta correspondiente.</li>
+ <li>El CSS proporcionado deberá estar incluido dentro de la etiqueta adecuada.</li>
+</ul>
+
+<h2 id="Pistas_y_recomendaciones">Pistas y recomendaciones</h2>
+
+<ul>
+ <li>Utiliza el <a href="https://validator.w3.org/">Validador de HTML W3C HTML</a> para validar tu HTML; recibirás puntos de bonificación si se valida.</li>
+ <li>No necesitas conocer CSS para hacer este ejercicio; solo debes poner el CSS proporcionado en el elemento HTML adecuado.</li>
+</ul>
+
+<h2 id="Example">Example</h2>
+
+<p>The following screenshot shows an example of what the letter might look like after being marked up.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12291/letter-screengrab.png" style="border: 1px solid black; display: block; margin: 0px auto;"></p>
+
+<h2 id="Evaluación">Evaluación</h2>
+
+<p>Si estás haciendo esta prueba como parte de un curso organizado, deberías entregar tu trabajo al profesor para que lo corrija. Si estás auto-aprendiendo puedes conseguir la guía de corrección fácilmente pidiendola en el <a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">Hilo del area de aprendizaje</a>, o en el canal IRC de <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Intenta hacerlo primero — no ganarás nada haciendo trampas.</p>
+
+<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Learn/HTML/Introduction_to_HTML")}}</p>
diff --git a/files/es/learn/html/introduction_to_html/structuring_a_page_of_content/index.html b/files/es/learn/html/introduction_to_html/structuring_a_page_of_content/index.html
new file mode 100644
index 0000000000..3e86e166dd
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/structuring_a_page_of_content/index.html
@@ -0,0 +1,106 @@
+---
+title: Estructuración de una Página de contenido
+slug: Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content
+tags:
+  - Aprendizaje
+  - Diseño
+  - Escribir Código
+  - Estructuración
+  - Evaluación
+  - HTML
+  - Principiante
+  - Prototipado
+  - semántica
+translation_of: Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content
+original_slug: Learn/HTML/Introduccion_a_HTML/Estructuración_de_una_página_de_contenido
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenu("Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}} </div>
+
+<p class="summary"><span id="result_box" lang="es"><span>La estructuración de una página de contenido lista para su uso mediante CSS es una habilidad muy importante para dominar, por lo que en esta evaluación  verá  su capacidad para pensar en cómo  podría finalizar una página  buscando y eligiendo la semántica estructural adecuada para construir</span> <span>un diseño en la parte superior.</span></span></p>
+
+<div id="gt-res-content">
+<div dir="ltr" style="zoom: 1;"> </div>
+</div>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td><span id="result_box" lang="es"><span>Antes de intentar esta evaluación, usted debería haber trabajado ya en el resto del curso, con un énfasis particular en la </span></span><a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure">Estructura del Documento y del Sitio Web.</a><a href="https://developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML/estructura">.</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td><span id="result_box" lang="es"><span>Probar el conocimiento de las estructuras de páginas web y cómo representar un prototipado de diseño prospectivo en el marcado.</span></span></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Punto_de_partida">Punto de partida</h2>
+
+<p>Para comenzar esta evaluación, debería tomar el  <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/structuring-a-page-of-content-start/assets.zip?raw=true"> archivo zip  que contiene todos los activos de inicio</a>. El archivo zip contiene:</p>
+
+<ul>
+ <li>El HTML que necesitas para añadir marcado estructural.</li>
+ <li>CSS para dar el estilo a tu marcado.</li>
+ <li>Las imágenes que serán utilizadas en la página.</li>
+</ul>
+
+<p>Crée el ejemplo en su ordenador personal, o como alternativa utilize un sitio como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer su evaluación.</p>
+
+<h2 id="Breve_Proyecto">Breve Proyecto</h2>
+
+<p>Para este proyecto, su tarea es tomar el contenido de la página principal de un sitio web de observación de aves y añadir elementos estructurales a la misma para que pueda tener un diseño de página aplicado a ella. Necesita tener:</p>
+
+<ul>
+ <li> Un encabezado que abarca todo el ancho del sitio que contiene el título principal de la página, el logotipo del sitio y el menú de navegación. El título y el logotipo aparecen lado a lado una vez que se aplica el estilo, y la navegación aparece debajo de esos dos elementos.</li>
+ <li>  Un área de contenido principal que contiene dos columnas: un bloque principal para contener el texto de bienvenida y una barra lateral para contener miniaturas de imágenes.</li>
+ <li>  Un pie de página que contiene información sobre derechos de autor y créditos.</li>
+</ul>
+
+<p>Debe agregar una presentación adecuada para:</p>
+
+<ul>
+ <li>El encabezado</li>
+ <li>El menú de navegación</li>
+ <li>El contenido principal</li>
+ <li>El texto de bienvenida</li>
+ <li>La barra lateral de imágenes</li>
+ <li>El pié de página</li>
+</ul>
+
+<p>También debería:</p>
+
+<ul>
+ <li> Aplicar el CSS proporcionado a la página agregando otro elemento {{htmlelement ("link")}} justo debajo del existente que se proporciona al principio.</li>
+</ul>
+
+<h2 id="Consejos">Consejos</h2>
+
+<ul>
+ <li>Utilize el <a href="https://validator.w3.org/">validador de HTML  W3C  </a> para validar su  HTML; Obtendrá puntos de bonificación si valida tanto como sea posible (la línea "googleapis" es una línea utilizada para importar fuentes personalizadas en la página del servicio Google Fonts, no se valida, así que no te preocupes. )</li>
+ <li>No necesita saber CSS para hacer esta evaluación; Sólo tiene que poner el CSS proporcionado dentro de un elemento HTML.</li>
+ <li>El CSS proporcionado está diseñado para que cuando se agreguen los elementos estructurales correctos al marcado, aparezcan verdes en la página representada.</li>
+ <li>Si se está quedando atascado y no puede imaginar ni qué elementos poner ni donde ponerlos , a menudo ayuda a dibujar un diagrama de bloques simple del diseño de página, y escribir en los elementos que usted piensa que debe envolver cada bloque.</li>
+</ul>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>La siguiente captura de pantalla muestra un ejemplo de cómo podría verse la letra después de haber sido marcada.</p>
+
+<p><img alt='The finished example for the assessment; a simple webpage about birdwatching, including a heading of "Birdwatching", bird photos, and a welcome message' src="https://mdn.mozillademos.org/files/12449/example-page.png" style="display: block; margin: 0 auto;"></p>
+
+<h2 id="Evaluación">Evaluación</h2>
+
+<p>Si está siguiendo esta evaluación como parte de un curso organizado, debe ser capaz de dar su trabajo a su maestro / mentor para el marcado. Si usted está aprendiendo por si mismo, entonces  puede obtener la guía de marcado con bastante facilidad preguntando sobre ello en la lista de correo<a href="https://lists.mozilla.org/listinfo/dev-mdc">  dev-mdc</a> , o en el canal IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a>  en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Pruebe a hacer el ejercicio primero - ¡No hay nada que ganar por hacer trampa!</p>
+
+<p>{{PreviousMenu("Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}</p>
+
+<div class="s3gt_translate_tooltip" id="s3gt_translate_tooltip" style="position: absolute; left: 61px; top: 1812px; opacity: 0.7;">
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Reproducir"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copy text to Clipboard"> </div>
+</div>
diff --git a/files/es/learn/html/introduction_to_html/test_your_skills_colon__advanced_html_text/index.html b/files/es/learn/html/introduction_to_html/test_your_skills_colon__advanced_html_text/index.html
new file mode 100644
index 0000000000..908d34bcc6
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/test_your_skills_colon__advanced_html_text/index.html
@@ -0,0 +1,68 @@
+---
+title: 'Pon a prueba tus habilidades: texto HTML avanzado'
+slug: Learn/HTML/Introduction_to_HTML/Test_your_skills:_Advanced_HTML_text
+translation_of: Learn/HTML/Introduction_to_HTML/Test_your_skills:_Advanced_HTML_text
+original_slug: Learn/HTML/Introduccion_a_HTML/Test_your_skills:_Advanced_HTML_text
+---
+<div>{{learnsidebar}}</div>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">El objetivo de esta prueba de habilidad es evaluar si ha entendido nuestras </span></span>  <u><a href="/es/docs//en-US/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting">formato de texto avanzado</a></u> articulo.</p>
+
+<div class="blockIndicator note">
+<p><strong>NOTA</strong>:<span class="tlid-translation translation" lang="es"><span title="">Puede probar soluciones en los editores interactivos a continuación;</span> <span title="">sin embargo, puede resultar útil descargar el código y utilizar una herramienta en línea como</span></span>  <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch </a><span class="tlid-translation translation" lang="es"><span title="">trabajar en las tareas.</span></span><br>
+ <br>
+ <span class="tlid-translation translation" lang="es"><span title="">Si se atasca, pídanos ayuda; consulte la</span></span> {{anch("Assessment or further help")}} section at the bottom of this page.</p>
+</div>
+
+<h2 id="Texto_HTML_avanzado_1"><span class="tlid-translation translation" lang="es"><span title="">Texto HTML avanzado 1</span></span></h2>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">En esta tarea, queremos que convierta los animales proporcionados y sus definiciones en una lista de descripción.</span><br>
+ <br>
+ <span title="">Intente actualizar el código en vivo a continuación para recrear el ejemplo terminado:</span></span></p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/advanced-text/advanced-text1.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="/es/docs/https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/advanced-text/advanced-text1-download.html">Descarga el puno de partida para esta tarea</a> to work in your own editor or in an online editor.</p>
+</div>
+
+<h2 id="Texto_HTML_avanzado_2"><span class="tlid-translation translation" lang="es"><span title="">Texto HTML avanzado 2</span></span></h2>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">En esta tarea, queremos que agregue algo de semántica al HTML proporcionado de la siguiente manera:</span></span></p>
+
+<ul>
+ <li><span class="tlid-translation translation" lang="es"><span title="">Convierta el segundo párrafo en una cita a nivel de bloque e indique semánticamente que la cita se toma de</span></span> <a href="/en-US/docs/Learn/Accessibility">Accesibilidad</a>.</li>
+ <li><span class="tlid-translation translation" lang="es"><span title="">Marque semánticamente "HTML" y "CSS" como acrónimos, proporcionando expansiones como información sobre herramientas.</span></span></li>
+ <li><span class="tlid-translation translation" lang="es"><span title="">Asocia semánticamente fechas legibles por máquina con las fechas en el texto.</span></span></li>
+ <li><span class="tlid-translation translation" lang="es"><span title="">Utilice subíndice y superíndice para proporcionar la semántica correcta para las fórmulas químicas y fechas, y hacer que se muestren correctamente.</span></span></li>
+</ul>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Intente actualizar el código en vivo a continuación para recrear el ejemplo terminado:</span></span></p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/advanced-text/advanced-text2.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="/es/docs/https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/advanced-text/advanced-text2-download.html">Descarga el punto de partida para esta tarea </a><span class="tlid-translation translation" lang="es"><span title="">para trabajar en su propio editor o en un editor en línea.</span></span></p>
+</div>
+
+<h2 id="Evaluación_o_ayuda_adicional"><span class="tlid-translation translation" lang="es"><span title="">Evaluación o ayuda adicional</span></span></h2>
+
+<div class="text-wrap tlid-copy-target">
+<div class="result-shield-container tlid-copy-target"><span class="tlid-translation translation" lang="es"><span title="">Puede practicar estos ejemplos en los editores interactivos anteriores.</span><br>
+<br>
+<span title="">Si desea que se evalúe su trabajo, o está atascado y desea pedir ayuda:</span></span></div>
+
+<div class="result-shield-container tlid-copy-target"></div>
+</div>
+
+<ol>
+ <li><span class="tlid-translation translation" lang="es"><span title="">Pon tu trabajo en un editor que se pueda compartir en línea, como</span></span>  <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a>. <span class="tlid-translation translation" lang="es"><span title="">Puede escribir el código usted mismo o utilizar los archivos de punto de inicio vinculados en las secciones anteriores.</span></span></li>
+ <li><span class="tlid-translation translation" lang="es"><span title="">Escriba una publicación solicitando evaluación y / o ayuda en el</span></span>  <a class="external external-icon" href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. <span class="tlid-translation translation" lang="es"><span title="">Tu publicación debe incluir:</span></span>
+  <ul>
+   <li><span class="tlid-translation translation" lang="es"><span title="">Un título descriptivo como "Se busca evaluación para la prueba de habilidad de texto avanzado HTML 1".</span></span></li>
+   <li><span class="tlid-translation translation" lang="es"><span title="">Detalles de lo que ya ha probado y lo que le gustaría que hiciéramos, p. Ej.</span> <span title="">si está atascado y necesita ayuda, o quiere una evaluación.</span></span></li>
+   <li><span class="tlid-translation translation" lang="es"><span title="">Un enlace al ejemplo que desea evaluar o con el que necesita ayuda, en un editor que se puede compartir en línea (como se mencionó en el paso 1 anterior).</span> <span title="">Esta es una buena práctica para entrar: es muy difícil ayudar a alguien con un problema de codificación si no puede ver su código.</span></span></li>
+   <li><span class="tlid-translation translation" lang="es"><span title="">Un enlace a la página de la tarea o evaluación real, para que podamos encontrar la pregunta con la que desea ayuda.</span></span></li>
+  </ul>
+ </li>
+</ol>
diff --git a/files/es/learn/html/introduction_to_html/test_your_skills_colon__html_text_basics/index.html b/files/es/learn/html/introduction_to_html/test_your_skills_colon__html_text_basics/index.html
new file mode 100644
index 0000000000..c84019c672
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/test_your_skills_colon__html_text_basics/index.html
@@ -0,0 +1,73 @@
+---
+title: 'Prueba tus habilidades: Texto básico HTML'
+slug: Learn/HTML/Introduction_to_HTML/Test_your_skills:_HTML_text_basics
+tags:
+  - Aprendizaje
+  - HTML
+  - Principiante
+  - Prueba tus habilidades
+  - Texto
+translation_of: Learn/HTML/Introduction_to_HTML/Test_your_skills:_HTML_text_basics
+original_slug: Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Texto_básico_HTML
+---
+<div>{{learnsidebar}}</div>
+
+<p>El objetivo de esta prueba de habilidad es evaluar si has comprendido el artículo <a href="/es/docs/Learn/HTML/Introduccion_a_HTML/texto">Fundamentos de texto en HTML</a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Puedes intentar resolverlo en los editores interactivos de más abajo, sin embargo puede ser muy úytil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a> para trabajar en las tareas.<br>
+ <br>
+ Si te atascas, entonces pídenos ayuda — busca en la sección {{anch("Assessment or further help")}} al final de esta página.</p>
+</div>
+
+<h2 id="Texto_básico_HTML_1">Texto básico HTML 1</h2>
+
+<p>En esta tarea queremos que etiquetes el HTML entregado utilizando elementos semánticos de encabezado y párrafo. Intenta actualizando el código más abajo para recrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/basic-text/basic-text1.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/basic-text/basic-text1-download.html">Descarga el punto de inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Texto_básico_HTML_2">Texto básico HTML 2</h2>
+
+<p>En esta tarea necesitamos que cambies la primera lista no marcada en una lista no ordenada, y la segunda en una lista ordenada.</p>
+
+<p>Intenta actualizando el código más abajo para recrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/basic-text/basic-text2.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/basic-text/basic-text2-download.html">Descarga el punto de inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Texto_básico_HTML_3">Texto básico HTML 3</h2>
+
+<p>En esta tarea se te entrega un párrafo, y tu objetivo es usar algunos elementos en línea para marcar algunas palabras con importancia, y otras con énfasis</p>
+
+<p>Intenta actualizando el código más abajo para recrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/basic-text/basic-text3.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/basic-text/basic-text3-download.html">Descarga el punto de inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
+
+<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
+
+<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
+
+<ol>
+ <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
+ <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a class="external external-icon" href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
+  <ul>
+   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de texto básico HTML 1".</li>
+   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
+   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
+   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
+  </ul>
+ </li>
+</ol>
diff --git a/files/es/learn/html/introduction_to_html/test_your_skills_colon__links/index.html b/files/es/learn/html/introduction_to_html/test_your_skills_colon__links/index.html
new file mode 100644
index 0000000000..20e3e0f363
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/test_your_skills_colon__links/index.html
@@ -0,0 +1,100 @@
+---
+title: 'Prueba tus habilidades: Enlaces'
+slug: Learn/HTML/Introduction_to_HTML/Test_your_skills:_Links
+translation_of: Learn/HTML/Introduction_to_HTML/Test_your_skills:_Links
+original_slug: Learn/HTML/Introduccion_a_HTML/Prueba_tus_habilidades:_Enlaces
+---
+<div>{{learnsidebar}}</div>
+
+<p>El objetivo de esta pueba de habilidad es evaluar si has comprendido nuestro artículo <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks">Creando hipervínculos</a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes intentar resolver esta prueba en los editores interactivos más abajo, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a> para trabajar en las tareas.<br>
+ <br>
+ Si te atascas, pide ayuda — mira la sección {{anch("Evaluación o ayuda adicional")}} al final de esta página.</p>
+</div>
+
+<h2 id="Enlaces_1">Enlaces 1</h2>
+
+<p>En esta tarea necesitamos tu ayuda para completar los enlaces en nuestra página de información sobre Ballenas:</p>
+
+<ul>
+ <li>El primer enlace debería estar vinculado a una página llamada <code>whales.html</code>, que está en el mismo directorio que la página actual.</li>
+ <li>También queremos agregarle un cuadro de información ("tooltip") cuando pase el puntero sobre el enlace, que le diga al usuario que la página incluye informacion sobre las Ballenas azules y las Ballenas blancas.</li>
+ <li>El segundo enlace deberá convertirse en un vínculo que abra un correo electrónico en la aplicación de correo por defecto del usuario, con el destinatario "whales@example.com".</li>
+ <li>Conseguirás un punto de bonificación si tambien configuras que la línea del asunto del correo electrónico tenga como texto predeterminado "Preguntas sobre Ballenas".</li>
+</ul>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> El primer enlace en el ejemplo tiene el atributo <code>target="_blank"</code> , así que cuando haces click en él, abre la página en una pestaña nueva. Esto no es estrictamente una buena práctica, pero lo hemos hecho aquí para que la página no se abra en el <code>&lt;iframe&gt;</code> incrustado, ¡eliminando el código de ejemplo en el proceso!</p>
+</div>
+
+<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/links/links1.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/links/links1-download.html">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Enlaces_2">Enlaces 2</h2>
+
+<p>En esta tarea queremos que completes los cuatro enlaces para que se dirijan al lugar apropiado:</p>
+
+<ul>
+ <li>El primer enlace debería vincular a una imagen llamada <code>blue-whale.jpg</code>, que se encuentra en una carpeta llamada <code>blue</code> dentro de la carpeta actual.</li>
+ <li>El segundo enlace debería vincular a una imagen llamada <code>narwhal.jpg</code>, que se encuentra en una carpeta llamada <code>narwhal</code>, que se encuentra en un nivel de carpetas sobre la carpeta actual.</li>
+ <li>El tercer enlace deberia vincular al sitio de búsqueda de imágenes de Google del Reino Unido. La URL base es <code>https://www.google.co.uk</code>, y la búsqueda de imágenes se ubica en un subdirectorio llamado <code>imghp</code>.</li>
+ <li>El cuarto enlace debería vincular al párrafo más al final de la página actual. Que tiene la ID <code>bottom</code>.</li>
+</ul>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Los primeros tres enlaces en el ejemplo tienen el atributo <code>target="_blank"</code> especificado en ellos, abren la página enlazada en una nueva pestaña del navegador. Esto no es estrictamente una buena práctica, pero hemos hecho esto aquí para que las páginas no se abran dentro del <code>&lt;iframe&gt;</code> incrustado, ¡eliminando el código de ejemplo en el proceso!</p>
+</div>
+
+<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/links/links2.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/links/links2-download.html">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Enlaces_3">Enlaces 3</h2>
+
+<p>Los siguientes enlaces dirigen a una página informativa acerca de los Narvales, una dirección de correo electrónico de soporte, y un documento PDF cuyo tamaño es 4MB. En esta tarea queremos que:</p>
+
+<ul>
+ <li>Tomes los párrafos existentes con enlaces pobremente escritos, y los reescribas para que tengan un buen texto de enlace.</li>
+ <li>Agregues una advertencia a cualquier enlace que necesite una advertencia.</li>
+</ul>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Los primeros tres enlaces en el ejemplo tienen el atributo <code>target="_blank"</code> especificado en ellos, abren la página enlazada en una nueva pestaña del navegador. Esto no es estrictamente una buena práctica, pero hemos hecho esto aquí para que las páginas no se abran dentro del <code>&lt;iframe&gt;</code> incrustado, ¡eliminando el código de ejemplo en el proceso!</p>
+</div>
+
+<p>Intenta actualizar el código en vivo más abajo para mostrar el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/introduction-to-html/tasks/links/links3.html", '100%', 700)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/tasks/links/links3-download.html">Descarga el inicio de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
+
+<p>Puedes practicar estos ejemplos en los editores interactivos que se encuentran más arriba.</p>
+
+<p>Si deseas que tu trabajo sea evaluado, o estás atorado y quieres solicitar ayuda:</p>
+
+<ol>
+ <li>Pon tu trabajo en un editor en línea con capacidad de compartir como <a href="https://codepen.io/" rel="noopener">CodePen</a>, <a href="https://jsfiddle.net/" rel="noopener">jsFiddle</a>, o <a href="https://glitch.com/" rel="noopener">Glitch</a>. Puedes escribir el código por ti mismo, o usar los archivos de punto de inicio enlazados en las secciones superiores.</li>
+ <li>Escribe una publicación solicitando evaluacion y/o ayuda en el <a href="https://discourse.mozilla.org/c/mdn/learn" rel="noopener">MDN Discourse forum Learning category</a>. Tu publicación debería incluir:
+  <ul>
+   <li>Un título descriptivo como "Solicito evaluacion para la prueba de habilidad de texto básico HTML 1".</li>
+   <li>Detalles de lo que ya has intentado, y que te gustaría que hiciéramos, por ejemplo, si estas atascado y necesitas ayuda, o quieres una evaluación.</li>
+   <li>Un enlace al ejemplo que quieres que sea evaluado o por el que necesitas ayuda en un  editor en linea con capacidad de compartir (como se mencionó en el paso 1 más arriba). Esta es una buena práctica  - Es muy dificil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
+   <li>Un enlace a la tarea o página de evaluacion actual, para que podamos encontrar la pregunta con la cual necesitas ayuda.</li>
+  </ul>
+ </li>
+</ol>
diff --git a/files/es/learn/html/introduction_to_html/the_head_metadata_in_html/index.html b/files/es/learn/html/introduction_to_html/the_head_metadata_in_html/index.html
new file mode 100644
index 0000000000..6dd14ce1e1
--- /dev/null
+++ b/files/es/learn/html/introduction_to_html/the_head_metadata_in_html/index.html
@@ -0,0 +1,300 @@
+---
+title: ¿Qué hay en la cabecera? Metadatos en HTML
+slug: Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML
+tags:
+  - Cabecera
+  - CodingScripting
+  - Guía
+  - HTML
+  - Meta
+  - Metadatos
+  - Novato
+  - Principiante
+  - favicon
+  - head
+  - lang
+  - metadata
+translation_of: Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML
+original_slug: Learn/HTML/Introduccion_a_HTML/Metados_en
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Getting_started", "Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML")}}</div>
+
+<p class="summary">El elemento {{Glossary("Head", "head")}} de un documento HTML es la parte que no se muestra en el navegador cuando se carga la página. Contiene información como el título ({{htmlelement("title")}}) de la página, enlaces al {{Glossary("CSS")}} (si quieres aplicar estilo a tu contenido HTML con CSS), enlaces para personalizar <code>favicon</code>, y otros metadatos (datos sobre el HTML, como quién lo escribió y palabras claves importantes que describen el documento). En este artículo abarcaremos todo esto y más, para darte bases sólidas en el manejo del marcado y otro código que debería estar presente en tu cabecera.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Estar familiarizado con el HTML básico, que se expone en {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con el HTML")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender acerca de la cabecera HTML {{Glossary("Head", "head")}}, cuál es su propósito, los elementos más importantes que puede contener, y qué efecto puede tener sobre el documento HTML.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_hay_en_la_cabecera_HTML">¿Qué hay en la cabecera HTML?</h2>
+
+<p>Vamos a revisar el {{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started#Anatomy_of_an_HTML_document", "documento HTML que se revisó en el artículo anterior")}}:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Mi página de prueba&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;p&gt;Esta es mi página&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>La cabecera HTML es el contenido del elemento {{htmlelement("head")}} — a diferencia del contenido del elemento {{htmlelement("body")}} (que sí se muestra en la página cuando se carga en el navegador), el contenido de la cabecera no se muestra en la página. Por el contrario, la función de la cabecera es contener los {{Glossary("Metadata", "metadatos")}} del documento. En el ejemplo anterior, la cabecera es bastante reducida:</p>
+
+<pre class="brush: html notranslate">&lt;head&gt;
+  &lt;meta charset="utf-8"&gt;
+  &lt;title&gt;Mi página de prueba&lt;/title&gt;
+&lt;/head&gt; </pre>
+
+<p>En páginas más grandes, sin embargo, la cabecera puede llegar a contener bastantes elementos. Prueba a ir a algunos de tus sitios web favoritos y comprueba el contenido de la cabecera usando las {{web.link("/es/docs/Learn/Common_questions/What_are_browser_developer_tools", "herramientas para el desarrollador")}}. Nuestro objetivo aquí no es mostrarte cómo usar todo lo que puedes incluir en la cabecera, sino enseñarte cómo usar los elementos principales que vas a incluir en la cabecera y que te familiarices con ellos. Empecemos.</p>
+
+<h2 id="Añadir_un_título">Añadir un título</h2>
+
+<p>Ya hemos visto el elemento {{htmlelement("title")}} en acción — se puede usar para poner un título al documento. Sin embargo, esto se puede confundir con el elemento {{htmlelement("h1")}}, que se utiliza para poner un encabezado de nivel superior al cuerpo de tu contenido — esto también se conoce como el título de la página. ¡Pero son cosas diferentes!</p>
+
+<ul>
+ <li>El elemento {{htmlelement("h1")}} aparece en la página cuando se carga en el navegador — en general debería haber uno solo por página, para especificar el título del contenido de tu página (el título de tu historia, el título de la noticia, o de lo que sea apropiado según el uso que le des).</li>
+ <li>El elemento {{htmlelement("title")}} es un metadato que representa el título de todo el documento HTML (no del contenido del documento).</li>
+</ul>
+
+<h3 id="Aprendizaje_activo_Análisis_de_un_ejemplo_sencillo">Aprendizaje activo: Análisis de un ejemplo sencillo</h3>
+
+<ol>
+ <li>Para comenzar este aprendizaje activo, te proponemos ir a nuestro repositorio de GitHub y descargues una copia de nuestra página <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/title-example.html">title-example.html</a>. Lo puedes hacer de las siguientes maneras:
+
+  <ol>
+   <li>Copia y pega el código de la página en un archivo de texto nuevo en tu editor de código, luego guárdalo en un lugar conveniente.</li>
+   <li>Presiona el botón "Raw" en la página de GitHub, lo cual hace que aparezca el código sin procesar (posiblemente en una nueva pestaña del navegador). A continuación, en el menú de tu navegador elige <em>Archivo → Guardar página como...</em> y selecciona un lugar adecuado para guardar el archivo.</li>
+  </ol>
+ </li>
+ <li>Ahora abre el archivo en tu navegador. Deberías ver algo como esto:
+  <p><img alt="Una sencilla página web con el título configurado a &lt;title> element, y el &lt;h1> configurado a &lt;h1> element." src="https://mdn.mozillademos.org/files/12323/title-example.png" style="display: block; margin: 0 auto;">Ahora debería quedar claro dónde aparece el contenido de <code>&lt;h1&gt;</code> y dónde aparece el contenido de <code>&lt;title&gt;</code>.</p>
+ </li>
+ <li>También podrías probar a abrir el código en tu editor de código, editar el contenido de estos elementos y luego actualizar la página en tu navegador. Juega un poco con ello.</li>
+</ol>
+
+<p>El contenido del elemento <code>&lt;title&gt;</code> también se usa de otras formas. Por ejemplo, si intentas marcar la página como favorita (<strong>Marcadores → Marcar esta página</strong>, o el icono en forma de estrella de Firefox), verás que el nombre que se sugiere para el marcado es el contenido del elemento <code>&lt;title&gt;</code>.</p>
+
+<p><img alt="Se está marcando una página web en Firefox; el nombre del marcador se ha completado automáticamente con el contenido del elemento &lt;title>" src="https://mdn.mozillademos.org/files/12337/bookmark-example.png" style="display: block; margin: 0 auto;"></p>
+
+<p>El contenido de <code>&lt;title&gt;</code> también se usa en el resultado de las búsquedas, como verás a continuación.</p>
+
+<h2 id="Metadatos_el_elemento_&lt;meta>">Metadatos: el elemento &lt;meta&gt;</h2>
+
+<p>Los metadatos son datos que describen datos, y HTML tiene una forma «oficial» de introducir metadatos en un documento — el elemento {{htmlelement("meta")}}. Por supuesto, el resto de los elementos de los que hablaremos en este artículo también se podrían considerar metadatos. Hay muchos diferentes tipos de elementos <code>&lt;meta&gt;</code> que se pueden incluir en el &lt;head&gt; de tu página, pero no vamos a intentar explicarlos todos en esta etapa porque resultaría demasiado confuso. En lugar de ello vamos a explicar algunas cuestiones con las que seguramente te vas a encontrar, solo para que te hagas una idea.</p>
+
+<h3 id="La_codificación_de_caracteres_de_tu_documento">La codificación de caracteres de tu documento</h3>
+
+<p>El ejemplo que vimos arriba incluía esta línea:</p>
+
+<pre class="brush: html notranslate">&lt;meta charset="utf-8"&gt;</pre>
+
+<p>Este elemento simplemente especifica la codificación de caracteres del documento — es decir, el conjunto de caracteres que el documento puede usar. <code>utf-8</code> es un conjunto de caracteres universal que incluye casi todos los caracteres de casi cualquier idioma humano. Esto significa que tu página web podrá gestionar la visualización de cualquier idioma; por lo tanto, resulta una buena idea configurarlo en cada página web que crees. Por ejemplo, tu página podría gestionar inglés y japonés sin problemas:</p>
+
+<p><img alt="Una página web que contiene caracteres en inglés y japonés, con la codificación de caracteres establecida en universal o utf-8. Ambos idiomas se muestran bien." src=" https://mdn.mozillademos.org/files/12343/correct-encoding.png" style="display: block; margin: 0 auto;">Si configuras tu codificación de caracteres en <code>ISO-8859-1</code>, por ejemplo (el juego de caracteres para el alfabeto latino), la representación de tu página puede aparecer desordenada:</p>
+
+<p><img alt="una página web que contiene caracteres en inglés y japonés, con la codificación de caracteres configurada en latín. Los caracteres japoneses no se muestran correctamente" src="https://mdn.mozillademos.org/files/12341/bad-encoding.png" style="display: block; height: 365px; margin: 0px auto; width: 604px;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Algunos navegadores (Chrome, por ejemplo) automáticamente arreglan la codificación de caracteres incorrecta, de modo que según el navegador que uses, puede que no te topes con este problema. Aun así, deberías incluir una codificación de caracteres <code>utf-8</code> en tu página web para evitar que se presenten potenciales problemas con otros navegadores.</p>
+</div>
+
+<h3 id="Aprendizaje_activo_Experimenta_con_la_codificación_de_caracteres">Aprendizaje activo: Experimenta con la codificación de caracteres</h3>
+
+<p>Para probar esto, vuelve a visitar la plantilla HTML simple que obtuviste en la sección anterior sobre <code>&lt;title&gt;</code> (la página <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/title-example.html">title-example.html</a>) e intenta cambiar el valor de la propiedad <code>meta charset</code> por <code>ISO-8859-1</code> y añade el japonés a tu página. Este es el código que usamos:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Ejemplo en japonés: ご飯が熱い。&lt;/p&gt;</pre>
+
+<h3 id="Añadir_un_autor_y_descripción">Añadir un autor y descripción</h3>
+
+<p>Muchos elementos <code>&lt;meta&gt;</code> incluyen atributos <code>name</code> y <code>content</code>:</p>
+
+<ul>
+ <li><code>name</code> especifica el tipo de metadato del que se trata; es decir, qué tipo de información contiene.</li>
+ <li><code>content</code> especifica el contenido del metadato en sí.</li>
+</ul>
+
+<p>Dos de esos metadatos que resultan útiles de incluir en tu página definen al autor de la página y proporcionan una descripción concisa de la página. Veamos un ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;meta name="author" content="Chris Mills"&gt;
+&lt;meta name="description" content="El área de aprendizaje de MDN pretende
+proporcionar a los recién llegados a la web todo lo que deben
+saber para empezar a desarrollar páginas web y aplicaciones web."&gt;</pre>
+
+<p>Especificar un autor resulta ventajoso por diversos motivos: es útil saber quién escribió la página para poder ponerte en contacto con el autor si tienes preguntas sobre el contenido. Algunos sistemas de gestión de contenido tienen herramientas para extraer automáticamente la información del autor de la página y ponerla a disposición para tales fines.</p>
+
+<p>Especificar una descripción que incluya palabras clave relacionadas con el contenido de tu página resulta útil porque tiene el potencial de hacer que la página aparezca más arriba en las búsquedas relevantes que efectúan los motores de búsqueda (tales actividades se denominan optimizaciones del motor de búsqueda ({{web.link("/es/docs/Glossary/SEO", "Optimización de motores de búsqueda")}}) o {{Glossary("SEO")}}.)</p>
+
+<h3 id="Aprendizaje_activo_El_uso_de_la_descripción_en_los_motores_de_búsqueda">Aprendizaje activo: El uso de la descripción en los motores de búsqueda</h3>
+
+<p>La descripción también se usa en las páginas de resultados del motor de búsqueda. Repasemos un ejercicio para explorar esto:</p>
+
+<ol>
+ <li>Ve a la página de inicio de <a href="https://developer.mozilla.org/es/">Mozilla Developer Network</a>.</li>
+ <li>Observa el código fuente de la página (<kbd>Ctrl</kbd>+clic o clic con el botón derecho en la página y selecciona la opción del menú <strong>Ver código fuente de la página</strong>).</li>
+ <li>Encuentra la etiqueta del metadato <strong>description</strong>. Se verá más o menos así (aunque puede cambiar con el tiempo):
+  <pre class="brush: html notranslate">&lt;meta name="description" content="The Mozilla Developer
+  Network (MDN) proporciona información sobre tecnologías
+  de código abierto que incluyen HTML, CSS y APIs tanto para sitios web como para aplicaciones HTML5.
+  También documenta productos Mozilla como el sistema operativo Firefox."&gt;</pre>
+ </li>
+ <li>Ahora busca "Mozilla Developer Network" en tu motor de búsqueda favorito (nosotros hemos utilizado Google). Observarás que efectivamente merece la pena que tener el contenido de la descripción <code>&lt;meta&gt;</code> y el elemento <code>&lt;title&gt;</code> que se utiliza en la búsqueda.
+  <p><img alt='Resultado de búsqueda en Yahoo para "Mozilla Developer Network"' src="https://mdn.mozillademos.org/files/16074/mdn-search-result.png" style="border-style: solid; border-width: 1px; display: block; height: 982px; margin: 0px auto; width: 1302px;"></p>
+ </li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: En Google verás algunas subpáginas relevantes de MDN enumeradas debajo del enlace principal a la página principal de MDN (se trata de los llamados <strong>sitelinks</strong> y se pueden configurar con las <a href="http://www.google.com/webmasters/tools/">Herramientas de administrador de Google</a>), una forma de mejorar los resultados para tu sitio con el motor de búsqueda de Google.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Muchas características <code>&lt;meta&gt;</code> ya no se usan. Por ejemplo, los motores de búsqueda ignoran el elemento <code>&lt;meta&gt;</code> (<code>&lt;meta name="keywords" content="pon, tus, palabras clave, aquí"&gt;</code>), que se supone que facilita palabras clave para motores de búsqueda de forma que se determine la relevancia de esa página según diferentes términos de búsqueda, porque los <strong>spammers</strong> rellenaban la lista de palabras clave con cientos de palabras clave que sesgaban los resultados.</p>
+</div>
+
+<h3 id="Otros_tipos_de_metadatos">Otros tipos de metadatos</h3>
+
+<p>Al navegar por la web también puedes encontrar otros tipos de metadatos. Muchas de las funciones que verás en los sitios web son creaciones propietarias diseñadas para proporcionar a ciertos sitios (como los sitios de redes sociales) información específica que puedan usar.</p>
+
+<p>Por ejemplo, <a href="http://ogp.me/">Open Graph Data</a> es un protocolo de metadatos que Facebook inventó para proveer metadatos más ricos para los sitios web. En las fuentes de código de MDN, encontrarás esto:</p>
+
+<pre class="brush: html notranslate">&lt;meta property="og:image" content="https://developer.cdn.mozilla.net/static/img/opengraph-logo.dc4e08e2f6af.png"&gt;
+&lt;meta property="og:description" content="The Mozilla Developer Network (MDN) proporciona información
+sobre tecnologías Open Web, incluidas HTML, CSS y APIs para ambos sitios web
+y aplicaciones HTML5. También documenta productos Mozilla, como el sistema operativo Firefox."&gt;
+&lt;meta property="og:title" content="Mozilla Developer Network"&gt;</pre>
+
+<p>Un efecto de esto es que cuando desde Facebook enlazas a un MDN, el enlace aparece con una imagen y una descripción, lo que resulta en una experiencia más enriquecedora para los usuarios.</p>
+
+<p><img alt="Datos abiertos del protocolo de gráficos de la página de inicio de MDN como se muestra en Facebook, mostrando una imagen, título y descripción." src="https://mdn.mozillademos.org/files/12349/facebook-output.png" style="display: block; margin: 0 auto;"></p>
+
+<p>Twitter también tiene sus metadatos propios, las <a href="https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards">Twitter Cards</a>, que tienen un efecto similar cuando la URL del sitio se muestra en twitter.com. Por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;meta name="twitter:title" content="Mozilla Developer Network"&gt;</pre>
+
+<h2 id="Agregar_iconos_personalizados_a_tu_sitio">Agregar iconos personalizados a tu sitio</h2>
+
+<p>Para enriquecer un poco más el diseño de tu sitio puedes añadir en tus metadatos referencias a iconos personalizados, que se mostrarán en determinados contextos. El más común de ellos es el <strong>favicon</strong> (abreviatura de <strong><em>favorite icon</em></strong> —<strong>icono </strong>«<strong>favorito</strong>», referido al uso que se le da en las listas de «favoritos» o de marcadores («<strong>bookmarks</strong>»).</p>
+
+<p>El humilde <code>favicon</code> ha existido durante muchos años. Es el primer icono de este tipo: un icono cuadrado de 16 píxeles que se utiliza en varios lugares. Es posible que veas (según el navegador) <code>favicon</code>s que se muestran en la pestaña del navegador que contiene cada página abierta y junto a las páginas marcadas en el panel de marcadores.</p>
+
+<p>Para añadir un <code>favicon</code> a tu página:</p>
+
+<ol>
+ <li>Guárdalo en el mismo directorio que la página <strong>index</strong> de tu sitio, en formato <code>.ico</code> (la mayoría de los buscadores admiten <code>favicon</code> en los formatos más comunes como <code>.gif</code> o <code>.png</code>, pero usar el formato <em>ICO</em> garantiza que funcionará hasta en Internet Explorer 6.)</li>
+ <li>Añade la siguiente línea de referencia en el {{HTMLElement("head")}} de tu HTML:
+  <pre class="brush: html notranslate">&lt;link rel="shortcut icon" href="favicon.ico" type="image/x-icon"&gt;</pre>
+ </li>
+</ol>
+
+<p>Los navegadores modernos usan <code>favicon</code>s en diversos lugares, como en la etiqueta de la página que está abierta y en el panel de favoritos cuando la añades a tu lista de páginas favoritas:</p>
+
+<p><img alt="El panel de marcadores de Firefox, que muestra un ejemplo marcado con un favicon junto a él." src="https://mdn.mozillademos.org/files/12351/bookmark-favicon.png" style="display: block; margin: 0 auto;"></p>
+
+<p>Hoy día hay un montón de otros tipos de iconos a tener presentes. Por ejemplo, los encontrarás en el código fuente de la página de inicio de MDN:</p>
+
+<pre class="brush: html notranslate">&lt;!-- iPad de tercera generación con pantalla de alta resolución: --&gt;
+&lt;link rel="apple-touch-icon-precomposed" sizes="144x144" href="https://developer.cdn.mozilla.net/static/img/favicon144.a6e4162070f4.png"&gt;
+&lt;!-- iPhone con pantalla de alta resolución: --&gt;
+&lt;link rel="apple-touch-icon-precomposed" sizes="114x114" href="https://developer.cdn.mozilla.net/static/img/favicon114.0e9fabd44f85.png"&gt;
+&lt;!-- iPad de primera y segunda generación: --&gt;
+&lt;link rel="apple-touch-icon-precomposed" sizes="72x72" href="https://developer.cdn.mozilla.net/static/img/favicon72.8ff9d87c82a0.png"&gt;
+&lt;!-- Dispositivos iPhone sin pantalla Retina, iPod Touch y Android 2.1+: --&gt;
+&lt;link rel="apple-touch-icon-precomposed" href="https://developer.cdn.mozilla.net/static/img/favicon57.a2490b9a2d76.png"&gt;
+&lt;!-- favicon básico --&gt;
+&lt;link rel="shortcut icon" href="https://developer.cdn.mozilla.net/static/img/favicon32.e02854fdcf73.png"&gt;</pre>
+
+<p>Los comentarios explican para qué se usa cada icono (estos elementos abarcan situaciones como aportar un buen icono de alta resolución para usarlo cuando la página web se guarda en la página de inicio de un iPad).</p>
+
+<p>No te preocupes demasiado sobre la implementación de todos estos tipos de iconos por el momento; se trata de una característica bastante avanzada y no se espera que tengas conocimientos de ello para avanzar en el curso. El propósito principal aquí es darte a conocer estos elementos por si te los encuentras mientras examinas el código fuente de otros sitios web.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si tu sitio web utiliza una política de seguridad de contenido (<em>content security policy o CSP</em>) para mejorar la seguridad, la política afecta al <code>favicon</code>. Si te encuentras con problemas como que el <code>favicon</code> no se carga, comprueba que la respuesta a {{HTTPHeader("Content-Security-Policy")}} del <code>header</code> <a href="">Content-Security-Policy</a> para la <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/img-src"> directriz <code>img-src</code></a> en la cabecera no impide el acceso a este.</p>
+</div>
+
+<h2 id="Aplicar_CSS_y_JavaScript_a_HTML">Aplicar CSS y JavaScript a HTML</h2>
+
+<p>Prácticamente todos los sitios web usan {{Glossary("CSS")}} para darles un buen aspecto y {{Glossary("JavaScript")}} para añadir funcionalidades interactivas, como reproductores de vídeo, mapas, juegos y demás. La manera más habitual de añadir CSS y JavaScript a una página web es con los elementos <code>&lt;link&gt;</code> y el elemento <code>&lt;script&gt;</code>, respectivamente.</p>
+
+<ul>
+ <li>
+  <p>El elemento {{HTMLElement("link")}} siempre debe ir dentro del {{HTMLElement("header")}} de tu documento. Este toma dos atributos, <code>rel="stylesheet"</code>, que indica que es la hoja de estilo del documento, y <code>href</code>, que contiene la ruta al archivo de la hoja de estilo:</p>
+
+  <pre class="brush: html notranslate">&lt;link rel="stylesheet" href="my-css-file.css"&gt;</pre>
+ </li>
+ <li>
+  <p>El elemento <code>&lt;script&gt;</code> también debería ir en el <code>head</code>, y debería incluir un atributo <code>src</code> con la ruta al JavaScript que quieres cargar, y <code>defer</code>, que básicamente le dice al navegador que cargue el JavaScript al mismo tiempo que el HTML de la página. Esto es útil porque hace que todo el HTML se cargue antes de ejecutar el JavaScript, para que no haya errores porque el JavaScript ha intentado acceder a un elemento HTML que todavía no existe. De hecho hay múltiples formas de gestionar la carga del JavaScript en una página, pero esta es «a prueba de bombas» para los navegadores modernos (para el resto de las formas, lee el artículo {{web.link("/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript#Script_loading_strategies", "Estrategias de carga de scripts")}}).</p>
+
+  <pre class="brush: html notranslate">&lt;script src="my-js-file.js"&gt;&lt;/script&gt;</pre>
+
+  <div class="blockIndicator note">
+  <p><strong>Nota</strong>: El elemento <code>&lt;script&gt;</code> puede parecer un elemento vacío pero no lo es, y por lo tanto necesita una etiqueta de cierre. En vez de apuntar a un archivo de <code>script</code> externo, también puedes colocar tu código dentro del elemento <code>&lt;script&gt;</code>.</p>
+  </div>
+ </li>
+</ul>
+
+<h3 id="Aprendizaje_activo_aplicar_CSS_y_JavaScript_a_una_página">Aprendizaje activo: aplicar CSS y JavaScript a una página</h3>
+
+<ol>
+ <li>Para iniciar este aprendizaje activo, haz una copia de nuestros archivos <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/meta-example.html">meta-example.html</a>, <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/script.js">script.js</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/style.css">style.css</a>, y guárdalos en un mismo directorio de tu ordenador. Asegúrate de que se guardan con los nombres y extensiones correctas.</li>
+ <li>Abre el archivo HTML tanto en tu navegador como en tu editor de texto.</li>
+ <li>Sigue la información facilitada anteriormente y añade los elementos <code>&lt;link&gt;</code> y <code>&lt;script&gt;</code> a tu HTML para aplicarle CSS y JavaScript.</li>
+</ol>
+
+<p>Si lo has hecho correctamente, al guardar tu HTML y actualizar tu navegador, deberías poder ver que las cosas han cambiado:</p>
+
+<p><img alt="Ejemplo que muestra una página con CSS y JavaScript aplicados. El CSS ha hecho que la página se vuelva verde, mientras que JavaScript ha agregado una lista dinámica a la página" src="https://mdn.mozillademos.org/files/12359/js-and-css.png" style="display: block; margin: 0 auto;"></p>
+
+<ul>
+ <li>El JavaScript ha añadido una lista vacía a la página. Ahora, cuando haces clic en cualquier sitio de la lista, aparece un cuadro de diálogo que te solicita que introduzcas el texto para un nuevo elemento de la lista. Cuando pulsas el botón OK, se añade a la lista el elemento con el texto nuevo. Cuando haces clic a un elemento de la lista aparece un cuadro de diálogo que te permite cambiar el texto del elemento.</li>
+ <li>El CSS ha pintado el fondo de verde y ha agrandado el texto. También ha aplicado estilo a algún contenido que el JavaScript ha añadido a la página (la barra roja con el borde negro es el estilo que el CSS ha aplicado a la lista generada con JavaScript).</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Si te encallas en este ejercicio y no logras ejecutar los archivos CSS/JS, comprueba tu página de ejemplo <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/css-and-js.html">css-and-js.html</a>.</p>
+</div>
+
+<h2 id="Establecer_el_idioma_principal_del_documento">Establecer el idioma principal del documento</h2>
+
+<p>Por último, merece la pena mencionar que puedes (y realmente deberías) especificar el idioma de tu página. Esto se puede hacer añadiendo el atributo {{web.link("/es/docs/Web/HTML/Global_attributes/lang", "lang")}} a la etiqueta de apertura del HTML (como se ve en el <a href="https://github.com/mdn/learning-area/blob/master/html/introduction-to-html/the-html-head/meta-example.html">meta-example.html</a> y se muestra abajo).</p>
+
+<pre class="brush: html notranslate">&lt;html lang="es-MX"&gt;</pre>
+
+<p>Esto resulta útil en muchos sentidos. Los motores de búsqueda indizarán tu documento HTML de modo más efectivo si estableces el idioma (permitiendo, por ejemplo, que aparezca correctamente en los resultados del idioma especificado), y resulta útil para que las personas con discapacidad visual que utilizan los lectores de pantalla (por ejemplo, la palabra «six» existe tanto en francés como en inglés, pero su pronunciación es diferente).</p>
+
+<p>También puedes establecer que las subsecciones de tu documento se reconozcan en diferentes idiomas. Por ejemplo, podemos establecer que nuestra sección de japonés se reconozca como japonés, de la siguiente manera:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Ejemplo Japonés: &lt;span lang="ja"&gt;ご飯が熱い。&lt;/span&gt;.&lt;/p&gt;</pre>
+
+<p>El estándar {{interwiki("wikipedia", "ISO_639-1")}} define estos códigos. Puedes encontrar más información sobre ello en <a href="https://www.w3.org/International/articles/language-tags/">Etiquetas de idioma en HTML y XML</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Esto marca el final de nuestra guía rápida del {{Glossary("head")}} de HTML — aún hay muchas más cosas que puedes hacer aquí, pero una guía exhaustiva puede ser aburrida y confusa a estas alturas, ¡y nosotros queremos darte una idea de las cuestiones más comunes con las que te encontrarás aquí por ahora! En el siguiente artículo veremos los fundamentos de texto de HTML.</p>
+
+<p>{{PreviousMenuNext("Learn/HTML/Introduction_to_HTML/Getting_started", "Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Learn/HTML/Introduction_to_HTML")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Getting_started", "Empezar con HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML", "¿Qué hay en el «head»? Metadatos en HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/HTML_text_fundamentals", "Fundamentos de texto HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Creating_hyperlinks", "Creando hipervínculos")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Advanced_text_formatting", "Formateo de texto avanzado")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure", "Estructura web y documentación")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Debugging_HTML", "Depurar HTML")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Marcado para una carta")}}</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Introduction_to_HTML/Structuring_a_page_of_content", "Estructuración del contenido de una página")}}</li>
+</ul>
diff --git a/files/es/learn/html/tablas/conceptos_básicos_de_las_tablas_html/index.html b/files/es/learn/html/tablas/conceptos_básicos_de_las_tablas_html/index.html
deleted file mode 100644
index 7259adf427..0000000000
--- a/files/es/learn/html/tablas/conceptos_básicos_de_las_tablas_html/index.html
+++ /dev/null
@@ -1,563 +0,0 @@
----
-title: Conceptos básicos de las tablas HTML
-slug: Learn/HTML/Tablas/Conceptos_básicos_de_las_tablas_HTML
-translation_of: Learn/HTML/Tables/Basics
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</div>
-
-<p class="summary">Este artículo te ayudará a comenzar con las tablas HTML. Vamos a exponer conceptos básicos como filas y celdas, encabezados, celdas que abarcan múltiples columnas y filas, y la forma de agrupar todas las celdas de una columna para aplicarles estilo.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conceptos básicos de HTML (ver <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Adquirir conocimientos básicos de las tablas HTML.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_una_tabla">¿Qué es una tabla?</h2>
-
-<p>Una tabla es un conjunto estructurado de datos distribuidos en filas y columnas (<strong>datos tabulados</strong>). Una tabla permite buscar con rapidez y facilidad valores entre diferentes tipos de datos que indiquen algún tipo de conexión. Por ejemplo, una persona y su edad, o un día de la semana o el horario de una piscina municipal.</p>
-
-<p><img alt="Una tabla de datos de ejemplo que muestra los nombres y las edades de algunas personas: Chris 38, Dennis 45, Sarah 29, Karen 47." src="https://mdn.mozillademos.org/files/14583/numbers-table.png" style="display: block; height: 156px; margin: 0px auto; width: 350px;"></p>
-
-<p><img alt="Una tabla de datos que muestra unos horarios de clases natación" src="https://mdn.mozillademos.org/files/14587/swimming-timetable.png" style="display: block; height: 301px; margin: 0px auto; width: 794px;"></p>
-
-<p>Las tablas se utilizan con mucha frecuencia en la sociedad desde hace años, como lo demuestra este documento censal de los EUA de 1800:</p>
-
-<p><img alt="Un pergamino muy antiguo; cuesta un poco leer los datos, pero muestra con claridad que las tablas de datos ya se utilizaban en 1800." src="https://mdn.mozillademos.org/files/14585/1800-census.jpg" style="display: block; height: 505px; margin: 0px auto; width: 800px;"></p>
-
-<p>Por lo tanto, no es de extrañar que los creadores de HTML proporcionen un medio con el que estructurar y presentar datos en tablas en la web.</p>
-
-<h3 id="¿Cómo_funciona_una_tabla">¿Cómo funciona una tabla?</h3>
-
-<p>El aspecto básico de una tabla es que es un elemento rígido. Es fácil interpretar la información haciendo asociaciones visuales entre los encabezados de las filas y las columnas. Por ejemplo, observa la tabla siguiente y busca un gigante de gas joviano con 62 lunas. Puedes encontrar la respuesta asociando los encabezados de la fila y la columna correspondientes.</p>
-
-<table>
- <caption>Datos sobre los planetas de nuestro sistema solar (datos planetarios tomados de la hoja técnica sobre datos planetarios de la NASA (<a href="http://nssdc.gsfc.nasa.gov/planetary/factsheet/">Nasa's Planetary Fact Sheet - Metric</a>).</caption>
- <thead>
-  <tr>
-   <td colspan="2"></td>
-   <th scope="col">Nombre</th>
-   <th scope="col">Masa (10<sup>24</sup> kg)</th>
-   <th scope="col">Diámetro (km)</th>
-   <th scope="col">Densidad (kg/m<sup>3</sup>)</th>
-   <th scope="col">Gravedad (m/s<sup>2</sup>)</th>
-   <th scope="col">Duración del día (horas)</th>
-   <th scope="col">Distancia del Sol (10<sup>6</sup>km)</th>
-   <th scope="col">Temperatura media (°C)</th>
-   <th scope="col">Número de lunas</th>
-   <th scope="col">Observaciones</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="2" rowspan="4" scope="rowgroup">Planetas terrestres</th>
-   <th scope="row">Mercurio</th>
-   <td>0,330</td>
-   <td>4.879</td>
-   <td>5.427</td>
-   <td>3,7</td>
-   <td>4.222,6</td>
-   <td>57,9</td>
-   <td>167</td>
-   <td>0</td>
-   <td>El más cercano al Sol</td>
-  </tr>
-  <tr>
-   <th scope="row">Venus</th>
-   <td>4,87</td>
-   <td>12.104</td>
-   <td>5.243</td>
-   <td>8,9</td>
-   <td>2.802,0</td>
-   <td>108,2</td>
-   <td>464</td>
-   <td>0</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row">La Tierra</th>
-   <td>5,97</td>
-   <td>12.756</td>
-   <td>5.514</td>
-   <td>9,8</td>
-   <td>24,0</td>
-   <td>149,6</td>
-   <td>15</td>
-   <td>1</td>
-   <td>Nuestro planeta</td>
-  </tr>
-  <tr>
-   <th scope="row">Marte</th>
-   <td>0,642</td>
-   <td>6.792</td>
-   <td>3.933</td>
-   <td>3,7</td>
-   <td>24,7</td>
-   <td>227,9</td>
-   <td>-65</td>
-   <td>2</td>
-   <td>El planeta rojo</td>
-  </tr>
-  <tr>
-   <th rowspan="4" scope="rowgroup">Planetas jovianos</th>
-   <th rowspan="2" scope="rowgroup">Los gigantes de gas</th>
-   <th scope="row">Júpiter</th>
-   <td>1.898</td>
-   <td>142.984</td>
-   <td>1.326</td>
-   <td>23,1</td>
-   <td>9,9</td>
-   <td>778,6</td>
-   <td>-110</td>
-   <td>67</td>
-   <td>El planeta más grande</td>
-  </tr>
-  <tr>
-   <th scope="row">Saturno</th>
-   <td>568</td>
-   <td>120.536</td>
-   <td>687</td>
-   <td>9,0</td>
-   <td>10,7</td>
-   <td>1.433,5</td>
-   <td>-140</td>
-   <td>62</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th rowspan="2" scope="rowgroup">Los gigantes de hielo</th>
-   <th scope="row">Urano</th>
-   <td>86,8</td>
-   <td>51.118</td>
-   <td>1.271</td>
-   <td>8,7</td>
-   <td>17,2</td>
-   <td>2.872,5</td>
-   <td>-195</td>
-   <td>27</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th scope="row">Neptuno</th>
-   <td>102</td>
-   <td>49.528</td>
-   <td>1.638</td>
-   <td>11,0</td>
-   <td>16,1</td>
-   <td>4.495,1</td>
-   <td>-200</td>
-   <td>14</td>
-   <td></td>
-  </tr>
-  <tr>
-   <th colspan="2" scope="rowgroup">Planetas enanos</th>
-   <th scope="row">Plutón</th>
-   <td>0,0146</td>
-   <td>2.370</td>
-   <td>2.095</td>
-   <td>0,7</td>
-   <td>153,3</td>
-   <td>5.906,4</td>
-   <td>-225</td>
-   <td>5</td>
-   <td>Desclasificado como planeta en 2006, pero aún es una <a href="http://www.usatoday.com/story/tech/2014/10/02/pluto-planet-solar-system/16578959/">cuestión polémica</a>.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Cuando se hace correctamente, incluso las personas ciegas pueden interpretar los datos de una tabla HTML. Una tabla HTML bien hecha debe mejorar la experiencia de los usuarios videntes e invidentes por igual.</p>
-
-<h3 id="Dar_estilo_a_las_tablas">Dar estilo a las tablas</h3>
-
-<p>También puedes <a href="https://mdn.github.io/learning-area/html/tables/assessment-finished/planets-data.html">echar un vistazo al ejemplo vivo</a> en GitHub. Observarás que la tabla que encontrarás allí tiene un aspecto más legible; esto se debe a que la tabla que ves en esta página tiene un estilo mínimo, mientras que en la de la versión de GitHub se ha aplicado un CSS más significativo.</p>
-
-<p>No te hagas ilusiones; para que las tablas sean efectivas en la web, debes proporcionar cierta información de estilo con <a href="/es/docs/Learn/CSS">CSS</a>, así como una buena estructura sólida con HTML. En este módulo nos centramos en la parte HTML; para averiguar sobre la parte del CSS debes visitar nuestro artículo <a href="/es/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a>.</p>
-
-<p>En este módulo no nos vamos a centrar en el CSS, sino que te vamos a proporcionar una hoja de estilo de CSS que dará a tus tablas algo más de legibilidad de la que se obtiene por defecto si no se proporciona ningún estilo. Puedes encontrar la hoja de estilo <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">aquí</a>, así como también una <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/blank-template.html">plantilla HTML</a> para aplicar la hoja de estilo (te darán un buen punto de partida para experimentar con las tablas HTML).</p>
-
-<h3 id="¿Cuándo_no_debes_usar_tablas_HTML">¿Cuándo no debes usar tablas HTML?</h3>
-
-<p>Las tablas HTML están pensadas para utilizarse con datos tabulados. Por desgracia, mucha gente utiliza las tablas HTML para hacer compaginaciones de páginas web. Por ejemplo, una fila para contener la cabecera, una fila para contener las columnas de contenido, una fila para contener el pie de página, etc. Puede encontrar más detalles y un ejemplo en <a href="/es/docs/Learn/Accessibility/HTML#Page_layouts">Diseños de página</a> en nuestro <a href="/es/docs/Learn/Accessibility">Módulo de aprendizaje de accesibilidad</a>. Se solía hacer este uso de las tablas porque la compatibilidad CSS entre navegadores solía ser terrible. Los diseños de tablas son mucho menos comunes hoy en día, pero aún se pueden ver en algunos rincones de la web.</p>
-
-<p>En resumen, es una mala idea usar tablas para el diseño en lugar de las <a href="/es/docs/Learn/CSS/CSS_layout">técnicas de diseño CSS</a>. Las razones principales son las siguientes:</p>
-
-<ol>
- <li><strong>Las tablas de diseño reducen la accesibilidad para los usuarios con discapacidad visual</strong>: Los <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders">lectores de pantalla</a> que utilizan las personas con visibilidad reducida interpretan las etiquetas de una página HTML y leen su contenido para el usuario. Puesto que las tablas no son la herramienta adecuada para el diseño y el marcado es más complejo que con las técnicas de diseño CSS, la salida de los lectores de pantalla será confusa para estos usuarios.</li>
- <li><strong>Las tablas generan estructuras incorrectas</strong>: Como ya se mencionó, los diseños de tabla suelen involucrar estructuras de marcado más complejas que las técnicas de diseño. Esto puede dificultar la escritura, el mantenimiento y la depuración del código.</li>
- <li><strong>Las tablas no tienen respuesta adaptativa automática</strong>: Cuando usas contenedores de diseño adecuados (tales como {{HTMLElement ("header")}}, {{HTMLElement ("section")}}, {{HTMLElement ("article")}} o {{HTMLElement ("div")}}), su ancho predeterminado es el 100% de su elemento padre. En cambio, las tablas se dimensionan de forma predeterminada según su contenido, por lo que se necesitan medidas adicionales para que el diseño de la tabla funcione de manera efectiva en todos los dispositivos.</li>
-</ol>
-
-<h2 id="Aprendizaje_activo_Crea_tu_primera_tabla">Aprendizaje activo: Crea tu primera tabla</h2>
-
-<p>Ya hemos hablado bastante sobre la teoría de las tablas, así que veamos un ejemplo práctico y construyamos una tabla simple.</p>
-
-<ol>
- <li>En primer lugar, haz una copia local de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/blank-template.html">blank-template.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">minimal-table.css</a> en un directorio nuevo de tu ordenador.</li>
- <li>El contenido de cada tabla está delimitado entre estas dos etiquetas: <strong><code><a href="/en-US/docs/Web/HTML/Element/table">&lt;table&gt;&lt;/table&gt;</a></code></strong>. Añádelas al cuerpo de tu código HTML.</li>
- <li>El contenedor más pequeño dentro de una tabla es una celda, que se crea con un elemento <strong><code><a href="/en-US/docs/Web/HTML/Element/td">&lt;td&gt;</a></code></strong> ('td' significa 'table data', <em>datos de tabla</em>). Añade lo siguiente dentro de tus etiquetas de tabla:
-  <pre class="brush: html notranslate">&lt;td&gt;Hola, soy tu primera celda.&lt;/td&gt;</pre>
- </li>
- <li>Si quieres una fila de cuatro celdas, tienes que copiar estas etiquetas tres veces. Actualiza el contenido de la tabla para que se vea así:
-  <pre class="brush: html notranslate">&lt;td&gt;Hola, soy tu primera celda.&lt;/td&gt;
-&lt;td&gt;Soy tu segunda celda.&lt;/td&gt;
-&lt;td&gt;Soy tu tercera celda.&lt;/td&gt;
-&lt;td&gt;Soy tu cuarta celda.&lt;/td&gt;</pre>
- </li>
-</ol>
-
-<p>Como verás, las celdas no se colocan una debajo de la otra, sino que se alinean automáticamente entre sí en la misma fila. Cada elemento &lt;td&gt; crea una sola celda, y juntas forman la primera fila. Cada celda que agregamos hace crecer la fila.</p>
-
-<p>Para detener el crecimiento de esta fila y comenzar a colocar las celdas posteriores en una segunda fila, necesitamos usar el elemento <strong><code><a href="/en-US/docs/Web/HTML/Element/tr">&lt;tr&gt;</a></code></strong> ('tr' significa 'table raw', <em>fila de tabla</em>). Vamos a verlo en detalle.</p>
-
-<ol>
- <li>Coloca las cuatro celdas que has creado dentro de las etiquetas <code>&lt;tr&gt;</code>, de esta forma:
-
-  <pre class="brush: html notranslate">&lt;tr&gt;
-  &lt;td&gt;Hola, soy tu primera celda.&lt;/td&gt;
-  &lt;td&gt;Soy tu segunda celda.&lt;/td&gt;
-  &lt;td&gt;Soy tu tercera celda.&lt;/td&gt;
-  &lt;td&gt;Soy tu cuarta celda.&lt;/td&gt;
-&lt;/tr&gt;</pre>
- </li>
- <li>Ahora que has hecho una fila, intenta hacer una o dos más: cada fila debe estar delimitada por un elemento <code>&lt;tr&gt;</code> adicional, con cada celda contenida en un <code>&lt;td&gt;</code>.</li>
-</ol>
-
-<p>Esto debería dar como resultado una tabla similar a la siguiente:</p>
-
-<table>
- <tbody>
-  <tr>
-   <td>Hola, soy tu primera celda.</td>
-   <td>Soy tu segunda celda.</td>
-   <td>Soy tu tercera celda.</td>
-   <td>Soy tu cuarta celda.</td>
-  </tr>
-  <tr>
-   <td>Segunda fila, primera celda.</td>
-   <td>Celda 2.</td>
-   <td>Celda 3.</td>
-   <td>Celda 4.</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: También puedes encontrar esto en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/simple-table.html">simple-table.html</a> (consúltalo <a href="http://mdn.github.io/learning-area/html/tables/basic/simple-table.html">en vivo</a>).</p>
-</div>
-
-<h2 id="Añadir_encabezados_con_elementos_&lt;th>">Añadir encabezados con elementos &lt;th&gt;</h2>
-
-<p>Ahora nos vamos a centrar en los encabezados de tabla: celdas especiales que van al comienzo de una fila o columna y definen el tipo de datos que contiene esa fila o columna (por ejemplo, observa las celdas «Propietario» y «Edad» en el primer ejemplo que se muestra en este artículo). Para ilustrar por qué son útiles, echa un vistazo al ejemplo de tabla siguiente. En primer lugar, el código fuente:</p>
-
-<pre class="brush: html notranslate">&lt;table&gt;
-  &lt;tr&gt;
-    &lt;td&gt;&amp;nbsp;&lt;/td&gt;
-    &lt;td&gt;Knocky&lt;/td&gt;
-    &lt;td&gt;Flor&lt;/td&gt;
-    &lt;td&gt;Ella&lt;/td&gt;
-    &lt;td&gt;Juan&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Raza&lt;/td&gt;
-    &lt;td&gt;Jack Russell&lt;/td&gt;
-    &lt;td&gt;Caniche&lt;/td&gt;
-    &lt;td&gt;Perro callejero&lt;/td&gt;
-    &lt;td&gt;Cocker Spaniel&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Edad&lt;/td&gt;
-    &lt;td&gt;16&lt;/td&gt;
-    &lt;td&gt;9&lt;/td&gt;
-    &lt;td&gt;10&lt;/td&gt;
-    &lt;td&gt;5&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Propietario&lt;/td&gt;
-    &lt;td&gt;Suegra&lt;/td&gt;
-    &lt;td&gt;Yo&lt;/td&gt;
-    &lt;td&gt;Yo&lt;/td&gt;
-    &lt;td&gt;Cuñada&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Hábitos alimentarios&lt;/td&gt;
-    &lt;td&gt;Come las sobras de todos&lt;/td&gt;
-
-&lt;td&gt;Mordisquea la comida&lt;/td&gt;
-    &lt;td&gt;Come en abundancia&lt;/td&gt;
-
-&lt;td&gt;Come hasta que revienta&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;</pre>
-
-<p>Ahora observa la tabla representada:</p>
-
-<table>
- <tbody>
-  <tr>
-   <td></td>
-   <td>Knocky</td>
-   <td>Flor</td>
-   <td>Ella</td>
-   <td>Juan</td>
-  </tr>
-  <tr>
-   <td>Raza</td>
-   <td>Jack Russell</td>
-   <td>Caniche</td>
-   <td>Perro callejero</td>
-   <td>Cocker Spaniel</td>
-  </tr>
-  <tr>
-   <td>Edad</td>
-   <td>16</td>
-   <td>9</td>
-   <td>10</td>
-   <td>5</td>
-  </tr>
-  <tr>
-   <td>Propietario</td>
-   <td>Suegra</td>
-   <td>Yo</td>
-   <td>Yo</td>
-   <td>Cuñada</td>
-  </tr>
-  <tr>
-   <td>Hábitos alimentarios</td>
-   <td>Come las sobras de todos</td>
-   <td>Mordisquea la comida</td>
-   <td>Come en abundancia</td>
-   <td>Come hasta que revienta</td>
-  </tr>
- </tbody>
-</table>
-
-<p>El problema aquí es que, si bien puedes distinguir lo que sucede, no es tan fácil cruzar datos de referencia. Sería mucho mejor si los encabezados de las columnas y las filas se destacasen de alguna manera.</p>
-
-<h3 id="Aprendizaje_activo_encabezados_de_tabla">Aprendizaje activo: encabezados de tabla</h3>
-
-<p>Intentemos mejorar esta tabla.</p>
-
-<ol>
- <li>Primero, haz una copia local de nuestros archivos <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/dogs-table.html">dogs-table.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">minimal-table.css</a> en un directorio nuevo de tu ordenador. El HTML contiene el mismo ejemplo sobre perros que viste arriba.</li>
- <li>Para reconocer los encabezados de la tabla como encabezados, tanto visual como semánticamente, puedes usar el elemento <strong><code><a href="/en-US/docs/Web/HTML/Element/th">&lt;th&gt;</a></code></strong> ('th' significa 'table header', <em>encabezado de tabla</em>). Funciona exactamente igual que un <code>&lt;td&gt;</code>, excepto que denota un encabezado, no una celda normal. Entra en el código HTML, y cambiar todos los elementos <code>&lt;td&gt;</code> que delimitan los encabezados de tabla por elementos <code>&lt;th&gt;</code>.</li>
- <li>Guarda tu HTML y cárgalo en un navegador. Los encabezados deberían verse como tal.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar nuestro ejemplo terminado en <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/dogs-table-fixed.html">dogs-table-fixed.html</a> en GitHub (<a href="http://mdn.github.io/learning-area/html/tables/basic/dogs-table-fixed.html">o consultarlo en vivo</a>).</p>
-</div>
-
-<h3 id="¿Por_qué_son_útiles_los_encabezados">¿Por qué son útiles los encabezados?</h3>
-
-<p>Ya hemos respondido parcialmente a esta pregunta: es más fácil encontrar los datos que buscas cuando los encabezados se destacan con claridad, y el diseño suele presentar un aspecto mejor.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Los encabezados de las tablas vienen con un estilo predeterminado: están en negrita y centrados (incluso si no añades tu estilo propio a la tabla) para que destaquen.</p>
-</div>
-
-<p>Los encabezados de tabla también presentan otra ventaja: junto con el atributo de <code>scope</code> (que veremos en el próximo artículo), mejoran la accesibilidad de las tablas porque asocian cada encabezado con todos los datos de la misma fila o columna. Así que los lectores de pantalla pueden leer una fila o columna de datos a la vez, lo cual es bastante útil.</p>
-
-<h2 id="Celdas_que_abarcan_varias_filas_y_columnas">Celdas que abarcan varias filas y columnas</h2>
-
-<p>A veces queremos que las celdas abarquen varias filas o columnas. Toma el ejemplo siguiente, que muestra los nombres de algunos animales comunes. En algunos casos, queremos mostrar los nombres de los machos y las hembras junto al nombre del animal. A veces no lo queremos, y en tales casos queremos que el nombre del animal abarque toda la tabla.</p>
-
-<p>El marcado inicial se ve así:</p>
-
-<pre class="brush: html notranslate">&lt;table&gt;
-  &lt;tr&gt;
-    &lt;th&gt;Animales&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;th&gt;Hipopótamo&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;th&gt;Caballo&lt;/th&gt;
-    &lt;td&gt;Yegua&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Semental&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-
-&lt;th&gt;Cocodrilo&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-
-&lt;th&gt;Pollo&lt;/th&gt;
-
-&lt;td&gt;Gallina&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Gallo&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;</pre>
-
-<p>Pero la salida no nos da exactamente lo que queremos:</p>
-
-<table>
- <tbody>
-  <tr>
-   <th>Animales</th>
-  </tr>
-  <tr>
-   <th>Hipopótamo</th>
-  </tr>
-  <tr>
-   <th>Caballo</th>
-   <td>Yegua</td>
-  </tr>
-  <tr>
-   <td>Semental</td>
-  </tr>
-  <tr>
-   <th>Cocodrilo</th>
-  </tr>
-  <tr>
-   <th>Pollo</th>
-   <td>Gallina</td>
-  </tr>
-  <tr>
-   <td>Gallo</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Necesitamos una forma de hacer que «Animales», «Hipopótamo» y «Cocodrilo» se extiendan dos columnas más allá, y «Caballo» y «Pollo» se extiendan dos filas más abajo. Por fortuna, los encabezados de tabla y las celdas tienen los atributos <code>colspan</code> y <code>rowspan</code>, que nos permiten hacer exactamente esas cosas. Ambos aceptan un valor numérico sin unidades, que es igual al número de filas o columnas que desea abarcar. Por ejemplo, <code>colspan="2"</code> extiende una celda dos columnas más allá.</p>
-
-<p>Usemos <code>colspan</code> y <code>rowspan</code> para mejorar esta tabla.</p>
-
-<ol>
- <li>Primero, haz una copia local de nuestros archivos <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/animals-table.html">animals-table.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">minimal-table.css</a> en un directorio nuevo de tu ordenador. El HTML contiene el mismo ejemplo sobre perros que viste arriba.</li>
- <li>Luego, usa <code>colspan</code> para extender las celdas «Animales», «Hipopótamo» y «Cocodrilo» dos columnas más allá.</li>
- <li>Por último, usa <code>rowspan</code> para extender las celdas de «Caballo» y «Pollo» dos filas más abajo.</li>
- <li>Guarda tu código y ábrelo en un navegador para ver la mejora.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar nuestro ejemplo terminado en <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/animals-table-fixed.html">animals-table-fixed.html</a> en GitHub (<a href="http://mdn.github.io/learning-area/html/tables/basic/animals-table-fixed.html">o consultarlo en vivo</a>).</p>
-</div>
-
-<table id="tabular" style="background-color: white;">
-</table>
-
-<h2 id="Proporcionar_un_estilo_común_a_las_columnas.">Proporcionar un estilo común a las columnas.</h2>
-
-<p>Hay una última característica de la que queremos hablar en este artículo antes de continuar. El HTML tiene un método para definir información de estilo para una columna completa de datos en un solo lugar: los elementos <strong><code><a href="/es/docs/Web/HTML/Elemento/col">&lt;col&gt;</a></code></strong> y <strong><code><a href="/es/docs/Web/HTML/Elemento/colgroup">&lt;colgroup&gt;</a></code></strong>. Estos atributos existen porque especificar el estilo de las columnas puede resultar enojoso e ineficiente; en general hay que especificar la información de estilo en <em>cada</em> <code>&lt;td&gt;</code> o <code>&lt;th&gt;</code> de la columna, o utilizar un selector complejo como {{cssxref(":nth-child()")}}.</p>
-
-<p>Tomemos el ejemplo sencillo siguiente:</p>
-
-<pre class="brush: html notranslate">&lt;table&gt;
-  &lt;tr&gt;
-
-&lt;th&gt;Dato 1&lt;/th&gt;
-    &lt;th style="background-color: yellow"&gt;Dato 2&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Calcuta&lt;/td&gt;
-    &lt;td style="background-color: yellow"&gt;Pizza&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Robots&lt;/td&gt;
-    &lt;td style="background-color: yellow"&gt;Jazz&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;</pre>
-
-<p>Esto nos da el resultado siguiente:</p>
-
-<table>
- <tbody>
-  <tr>
-   <th>Dato 1</th>
-   <th style="background-color: yellow;">Dato 2</th>
-  </tr>
-  <tr>
-   <td>Calcuta</td>
-   <td style="background-color: yellow;">Naranja</td>
-  </tr>
-  <tr>
-   <td>Robots</td>
-   <td style="background-color: yellow;">Jazz</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Esto no es ideal, porque hay que repetir la información de estilo en las tres celdas de la columna (en un proyecto real probablemente habría definida una clase <code>class</code> en las tres celdas y el estilo se especificaría en una hoja de estilo por separado). En vez de hacer esto, podemos especificar la información una sola vez, con un elemento <code>&lt;col&gt;</code>. Los elementos <code>&lt;col&gt;</code> se especifican dentro de un contenedor <code>&lt;colgroup&gt;</code> justo debajo de la etiqueta de apertura <code>&lt;table&gt;</code>. Podríamos crear el mismo efecto que vemos arriba especificando nuestra tabla de la manera siguiente:</p>
-
-<pre class="brush: html notranslate">&lt;table&gt;
-  &lt;colgroup&gt;
-    &lt;col&gt;
-    &lt;col style="background-color: yellow"&gt;
-  &lt;/colgroup&gt;
-  &lt;tr&gt;
-
-&lt;th&gt;Dato 1&lt;/th&gt;
-
-&lt;th&gt;Dato 2&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Calcuta&lt;/td&gt;
-    &lt;td&gt;Pizza&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Robots&lt;/td&gt;
-    &lt;td&gt;Jazz&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;</pre>
-
-<p>En efecto, definimos dos tipos de «columnas de estilo», una que especifica la información para la aplicación de estilo en cada columna. No aplicamos estilo a la primera columna, sino que aún tenemos que incluir un elemento <code>&lt;col&gt;</code> en blanco; de lo contrario, el estilo también se aplicaría a la primera columna.</p>
-
-<p>Si quisiéramos aplicar la información de estilo a ambas columnas, podríamos incluir un elemento <code>&lt;col&gt;</code> con un atributo <code>span</code>, como este:</p>
-
-<pre class="brush: html notranslate">&lt;colgroup&gt;
-  &lt;col style="background-color: yellow" span="2"&gt;
-&lt;/colgroup&gt;</pre>
-
-<p>Al igual que <code>colspan</code> y <code>rowspan</code>, <code>span</code> toma un valor numérico sin unidades que especifica el número de columnas a las que se desea aplicar el estilo.</p>
-
-<h3 id="Aprendizaje_activo_colgroup_y_col">Aprendizaje activo: colgroup y col</h3>
-
-<p>Ahora es el momento de intentarlo tú mismo.</p>
-
-<p>A continuación puedes ver el horario de una profesora de idiomas. El viernes tiene que enseñar holandés todo el día, pero también enseña alemán durante unas horas los martes y los jueves, y quiere resaltar las columnas que contienen los días que da clase.</p>
-
-<p>{{EmbedGHLiveSample("learning-area/html/tables/basic/timetable-fixed.html", '100%', 320)}}</p>
-
-<p>Recrea la tabla a partir de los pasos siguientes.</p>
-
-<ol>
- <li>Primero, haz una copia local de nuestro archivo <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable.html">timetable.html</a> en un directorio nuevo de tu ordenador. El HTML contiene la misma tabla que viste arriba, menos la información de estilo de las columnas.</li>
- <li>Añade un elemento <code>&lt;colgroup&gt;</code> en la parte superior de la tabla, justo debajo de la etiqueta <code>&lt;table&gt;</code>, en la que puedes añadir tus elementos <code>&lt;col&gt;</code> (consulta los pasos restantes a continuación).</li>
- <li>Las dos primeras columnas deben dejarse sin estilo.</li>
- <li>Añade un color de fondo a la tercera columna. El valor para tu atributo de <code>style</code> es <code>background-color:#97DB9A;</code></li>
- <li>Establece un ancho distinto para la cuarta columna. El valor de tu atributo de <code>style</code> es <code>width: 42px;</code></li>
- <li>Añade un color de fondo a la quinta columna. El valor para tu atributo de <code>style</code> es <code>background-color:#97DB9A;</code></li>
- <li>Añade un color de fondo diferente más un borde a la sexta columna, para indicar que este es un día especial porque da clases de un idioma diferente. Los valores para tu atributo de <code>style</code> son <code>background-color:#DCC48E; border:4px solid #C1437A;</code></li>
- <li>Los últimos dos días los tiene libres, así que no establezcas ningún color de fondo, pero sí un valor para el ancho; el valor para el atributo de <code>style</code> es <code>width: 42px;</code></li>
-</ol>
-
-<p>Mira cómo sigue en el ejemplo. Si te encallas o quieres verificar tu trabajo, puedes encontrar nuestra versión en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable-fixed.html">timetable-fixed.html</a> (o también puedes consultarlo <a href="http://mdn.github.io/learning-area/html/tables/basic/timetable-fixed.html">en vivo</a>).</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Con esto casi hemos abarcado todos los conceptos básicos de las tablas HTML. En el próximo artículo, veremos algunas características un poco más avanzadas de las tablas y comenzaremos a pensar acerca de su accesibilidad para las personas con discapacidad visual.</p>
-
-<div>{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</div>
-
-<div>
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Tables/Basics">Conceptos básicos de las tablas en HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Tables/Advanced">Funciones avanzadas de las tablas HTML y accesibilidad</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Tables/Structuring_planet_data">Estructuración de datos planetarios</a></li>
-</ul>
-</div>
diff --git a/files/es/learn/html/tablas/funciones_avanzadas_de_las_tablas_html_y_accesibilidad/index.html b/files/es/learn/html/tablas/funciones_avanzadas_de_las_tablas_html_y_accesibilidad/index.html
deleted file mode 100644
index a74817c5d4..0000000000
--- a/files/es/learn/html/tablas/funciones_avanzadas_de_las_tablas_html_y_accesibilidad/index.html
+++ /dev/null
@@ -1,471 +0,0 @@
----
-title: Funciones avanzadas de las tablas HTML y accesibilidad
-slug: Learn/HTML/Tablas/Funciones_avanzadas_de_las_tablas_HTML_y_accesibilidad
-translation_of: Learn/HTML/Tables/Advanced
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/HTML/Tables/Basics", "Learn/HTML/Tables/Structuring_planet_data", "Learn/HTML/Tables")}}</div>
-
-<p class="summary">En el segundo artículo de este módulo, analizamos algunas características más avanzadas de las tablas HTML, como los subtítulos/resúmenes, la agrupación de filas en las secciones del encabezado, el cuerpo y el pie de página; y también analizamos la accesibilidad de las tablas para usuarios con discapacidad visual.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conceptos básicos de HTML (ver <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Aprender las características más avanzadas de las tablas HTML y la accesibilidad de las tablas.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Añadir_un_subtítulo_a_tu_tabla_con_&lt;caption>">Añadir un subtítulo a tu tabla con &lt;caption&gt;</h2>
-
-<p>Puedes dar un título a tu tabla colocándolo dentro de un elemento {{htmlelement ("caption")}} y anidándolo dentro del elemento {{htmlelement ("table")}}. Debes ponerlo justo debajo de la etiqueta de apertura <code>&lt;table&gt;</code>.</p>
-
-<pre class="brush: html notranslate">&lt;table&gt;
-  &lt;caption&gt;Dinosaurios en el período Jurásico&lt;/caption&gt;
-
-  ...
-&lt;/table&gt;</pre>
-
-<p>Como puedes deducir a partir del breve ejemplo anterior, el título debe contener una descripción del contenido de la tabla. Esto es útil para todos los lectores que deseen descubrir de un vistazo si la tabla les resulta útil mientras ojean la página, pero es útil especialmente para usuarios ciegos. En lugar de que un lector de pantalla lea el contenido de muchas celdas solo para averiguar de qué trata la tabla, el lector puede contar con el título para luego decidir si leer la tabla con mayor detalle.</p>
-
-<p>Los subtítulos se colocan directamente debajo de la etiqueta <code>&lt;table&gt;</code>.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El atributo {{htmlattrxref("summary","table")}} también se puede usar en el elemento <code>table</code> para proporcionar una descripción; los lectores de pantalla también lo leen. Sin embargo, recomendamos usar el elemento <code>caption</code>, porque {{htmlattrxref("summary","table")}} está {{glossary("obsoleto")}} conforme a la especificación HTML5 y porque los usuarios sin discapacidad visual no pueden leerlo (no aparece en la página).</p>
-</div>
-
-<h3 id="Aprendizaje_activo_Añadir_un_subtítulo">Aprendizaje activo: Añadir un subtítulo</h3>
-
-<p>Vamos a probarlo con un ejemplo del artículo anterior.</p>
-
-<ol>
- <li>Abre el ejemplo del horario de clases de la profesora de idiomas del final de <a href="/es/docs/Learn/HTML/Tablas/Conceptos_b%C3%A1sicos_de_las_tablas_HTML#Aprendizaje_activo_colgroup_y_col"> conocimientos básicos de las tablas HTML</a>, o haz una copia local de nuestro archivo <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable-fixed.html">timetable-fixed.html</a>.</li>
- <li>Añade un título adecuado a la tabla.</li>
- <li>Guarda tu código, ábrelo en un navegador y observa qué aspecto presenta.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar nuestra versión en GitHub: consulta <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/timetable-caption.html">timetable-caption.html</a> (<a href="http://mdn.github.io/learning-area/html/tables/advanced/timetable-caption.html">mirar en vivo</a>).</p>
-</div>
-
-<h2 id="Añadir_estructura_con_&lt;thead>_&lt;tfoot>_y_&lt;tbody>">Añadir estructura con &lt;thead&gt;, &lt;tfoot&gt; y &lt;tbody&gt;</h2>
-
-<p>A medida que la estructura de las tablas se vuelve más compleja, es útil darles una estructura más definida. Una forma clara de hacerlo es con {{htmlelement ("thead")}}, {{htmlelement ("tfoot")}} y {{htmlelement ("tbody")}}, que te permiten marcar un encabezado, un pie de página y una sección del cuerpo de la tabla.</p>
-
-<p>Estos elementos no mejoran las características de accesibilidad de la tabla para los usuarios de lectores de pantalla ni su aspecto visual en sí. Sin embargo, son muy útiles para la aplicación de estilo y la compaginación, porque actúan como soportes útiles para añadir CSS a tu tabla. Como ejemplos interesantes, en el caso de una tabla extensa, puedes hacer que el encabezado y el pie de página se repitan en cada página impresa, y también que el cuerpo de la tabla se muestre en una sola página y desplazarte por los contenidos arriba y abajo con la barra de desplazamiento.</p>
-
-<p>Para utilizarlos:</p>
-
-<ul>
- <li>El elemento <code>&lt;thead&gt;</code> debe delimitar el encabezado de la tabla; esta suele ser la primera fila, que contiene los encabezados de las columnas, pero no siempre es así. Si utilizas los elementos {{htmlelement ("col")}}/{{htmlelement ("colgroup")}}, el encabezado de la tabla debe estar justo debajo.</li>
- <li>El elemento <code>&lt;tfoot&gt;</code> delimita la parte de la tabla correspondiente al pie de página; esta podría ser una fila final con elementos en las filas anteriores. Puedes incluir el pie de página de la tabla justo en la parte inferior de la tabla, donde esperarías que esté, o justo debajo del encabezado (y el navegador lo mostrará aun así en la parte inferior de la tabla).</li>
- <li>El elemento <code>&lt;tbody&gt;</code> delimita las otras partes del contenido de la tabla que no están en el encabezado o en el pie de página de la tabla. Aparecerá debajo del encabezado de la tabla o, a veces, en el pie de página, según cómo hayas decidido estructurarlo.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: <code>&lt;tbody&gt;</code> se incluye siempre en todas las tablas de forma implícita si no lo especificas en tu código. Para comprobarlo, abre uno de tus ejemplos anteriores que no incluya <code>&lt;tbody&gt;</code> y mira el código HTML en las <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">herramientas de desarrollo de tu navegador</a>; verás que el navegador ha añadido esta etiqueta. Quizás te preguntes por qué deberías molestarte en incluirlo. Debes hacerlo para tener más control sobre la estructura y el estilo de la tabla.</p>
-</div>
-
-<h3 id="Aprendizaje_activo_Añadir_estructura_a_la_tabla">Aprendizaje activo: Añadir estructura a la tabla</h3>
-
-<p>Pongamos en acción estos elementos nuevos.</p>
-
-<ol>
- <li>En primer lugar, haz una copia local de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/spending-record.html">spending-record.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/minimal-table.css">minimal-table.css</a> en una carpeta nueva de tu ordenador.</li>
- <li>Intenta abrirlo en un navegador: observarás que se ve bien, pero podría mejorarse. La fila «SUM», que contiene una suma de las cantidades gastadas, parece estar en el lugar equivocado, y faltan algunos detalles del código.</li>
- <li>Coloca la fila de encabezados dentro de un elemento <code>&lt;thead&gt;</code>, la fila «SUM» dentro de un elemento <code>&lt;tfoot&gt;</code>, y el resto del contenido dentro de un elemento <code>&lt;tbody&gt;</code>.</li>
- <li>Guarda y actualiza, y observa que añadir el elemento <code>&lt;tfoot&gt;</code> ha provocado que la fila «SUM» pase al final de la tabla.</li>
- <li>Luego, añade un atributo {{htmlattrxref ("colspan", "td")}} para que la celda «SUM» abarque las primeras cuatro columnas, de modo que el número aparezca en la parte inferior de la columna «Costes».</li>
- <li>Vamos a añadir un estilo adicional sencillo a la tabla para que veas cuán útiles son estos elementos para aplicar CSS. Dentro del encabezado del documento HTML hay un elemento {{htmlelement ("style")}} vacío. Añade a este elemento las líneas de código CSS siguientes:
-  <pre class="brush: css notranslate">tbody {
-  font-size: 95%;
-  font-style: italic;
-}
-
-tfoot {
-  font-weight: bold;
-}
-</pre>
- </li>
- <li>Guarda, actualiza, y échale un vistazo al resultado. Si los elementos <code>&lt;tbody&gt;</code> y <code>&lt;tfoot&gt;</code> no estuvieran en su lugar, tendrías que escribir selectores/reglas mucho más complicados para obtener la misma aplicación de estilo.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: No esperamos que comprendas completamente el CSS en este momento. Aprenderás más sobre el tema cuando llegues a nuestros módulos CSS (<a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a> es un buen lugar para comenzar; también tenemos un artículo específico sobre <a href="/es/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a>).</p>
-</div>
-
-<p>Tu tabla final debería tener un aspecto similar al siguiente:</p>
-
-<div class="hidden">
-<h6 id="Hidden_example">Hidden example</h6>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt; Mi historial de gastos &lt;/title&gt;
-    &lt;style&gt;
-
-        html {
-          font-family: sans-serif;
-        }
-
-          table {
-          border-collapse: collapse;
-          border: 4px solid rgb(200,200,200);
-          letter-spacing: 1px;
-          font-size: 0.8rem;
-        }
-
-        td, th {
-          border: 2px solid rgb(190,190,190);
-          padding: 10px 20px;
-        }
-
-        th {
-          background-color: rgb(235,235,235);
-        }
-
-        td {
-          text-align: center;
-        }
-
-        tr:nth-child(even) td {
-          background-color: rgb(250,250,250);
-        }
-
-        tr:nth-child(odd) td {
-          background-color: rgb(245,245,245);
-        }
-
-        caption {
-          padding: 10px;
-        }
-
-        tbody {
-          font-size: 90%;
-          font-style: italic;
-        }
-
-        tfoot {
-          font-weight: bold;
-        }
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-      &lt;table&gt;
-
-&lt;caption&gt; Cómo elegí gastar mi dinero &lt;/caption&gt;
-        &lt;thead&gt;
-          &lt;tr&gt;
-            &lt;th&gt; Compra &lt;/th&gt;
-
-&lt;th&gt; Ubicación &lt;/th&gt;
-            &lt;th&gt; Fecha &lt;/th&gt;
-            &lt;th&gt; Revisión &lt;/th&gt;
-
-&lt;th&gt; Coste (€) &lt;/th&gt;
-          &lt;/tr&gt;
-        &lt;/thead&gt;
-        &lt;tfoot&gt;
-          &lt;tr&gt;
-            &lt;td colspan="4"&gt;SUM&lt;/td&gt;
-            &lt;td&gt;118&lt;/td&gt;
-          &lt;/tr&gt;
-        &lt;/tfoot&gt;
-        &lt;tbody&gt;
-          &lt;tr&gt;
-            &lt;td&gt; Corte de pelo &lt;/td&gt;
-
-&lt;td&gt; Peluquería &lt;/td&gt;
-            &lt;td&gt;12/09&lt;/td&gt;
-
-&lt;td&gt; Gran idea &lt;/td&gt;
-            &lt;td&gt;30&lt;/td&gt;
-          &lt;/tr&gt;
-          &lt;tr&gt;
-
-&lt;td&gt; Lasaña &lt;/td&gt;
-
-&lt;td&gt; Restaurante &lt;/td&gt;
-            &lt;td&gt;12/09&lt;/td&gt;
-            &lt;td&gt; Arrepentimiento &lt;/td&gt;
-            &lt;td&gt;18&lt;/td&gt;
-          &lt;/tr&gt;
-          &lt;tr&gt;
-
-&lt;td&gt; Zapatos &lt;/td&gt;
-            &lt;td&gt; Zapatería &lt;/td&gt;
-            &lt;td&gt;13/09&lt;/td&gt;
-
-&lt;td&gt; Mucho arrepentimiento &lt;/td&gt;
-            &lt;td&gt;65&lt;/td&gt;
-          &lt;/tr&gt;
-          &lt;tr&gt;
-            &lt;td&gt; Pasta de dientes &lt;/td&gt;
-            &lt;td&gt; Supermercado &lt;/td&gt;
-            &lt;td&gt;13/09&lt;/td&gt;
-
-&lt;td&gt; Bien &lt;/td&gt;
-            &lt;td&gt;5&lt;/td&gt;
-          &lt;/tr&gt;
-        &lt;/tbody&gt;
-    &lt;/table&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Hidden_example', '100%', 300, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: También puedes encontrarlo en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/spending-record-finished.html">spending-record-finished.html</a> (o consultarlo también <a href="http://mdn.github.io/learning-area/html/tables/advanced/spending-record-finished.html">en vivo</a>).</p>
-</div>
-
-<h2 id="Anidar_tablas">Anidar tablas</h2>
-
-<p>Es posible anidar una tabla dentro de otra, siempre que incluyas la estructura completa, incluido el elemento <code>&lt;table&gt;</code>. Por lo general, esto no se recomienda, porque se obtiene un marcado más confuso y menos accesible para los usuarios que usan lectores de pantalla, y además, en muchos casos sería posible sencillamente insertar celdas/filas/columnas adicionales en la tabla. Sin embargo, a veces es necesario, por ejemplo, si deseas importar contenido de forma sencilla desde otras fuentes.</p>
-
-<p>El marcado siguiente muestra una tabla anidada simple:</p>
-
-<pre class="brush: html notranslate">&lt;table id="tabla1"&gt;
-  &lt;tr&gt;
-    &lt;th&gt;título1&lt;/th&gt;
-    &lt;th&gt;título2&lt;/th&gt;
-    &lt;th&gt;título3&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td id="nested"&gt;
-      &lt;table id="tabla2"&gt;
-        &lt;tr&gt;
-          &lt;td&gt;celda1&lt;/td&gt;
-          &lt;td&gt;celda2&lt;/td&gt;
-          &lt;td&gt;celda3&lt;/td&gt;
-        &lt;/tr&gt;
-      &lt;/table&gt;
-    &lt;/td&gt;
-    &lt;td&gt;celda2&lt;/td&gt;
-    &lt;td&gt;celda3&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;celda4&lt;/td&gt;
-    &lt;td&gt;celda5&lt;/td&gt;
-    &lt;td&gt;celda6&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;</pre>
-
-<p>La salida se verá así:</p>
-
-<table id="table1">
- <tbody>
-  <tr>
-   <th>título1</th>
-   <th>título2</th>
-   <th>título3</th>
-  </tr>
-  <tr>
-   <td id="nested">
-    <table id="table2">
-     <tbody>
-      <tr>
-       <td>celda1</td>
-       <td>celda2</td>
-       <td>celda3</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-   <td>celda2</td>
-   <td>celda3</td>
-  </tr>
-  <tr>
-   <td>celda4</td>
-   <td>celda5</td>
-   <td>celda6</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Tablas_para_usuarios_con_discapacidad_visual">Tablas para usuarios con discapacidad visual</h2>
-
-<p>Repasemos brevemente cómo usamos las tablas de datos. Una tabla puede ser una herramienta útil porque nos proporciona un acceso rápido a unos datos y nos permite buscar entre valores diferentes. Por ejemplo, echa un vistazo a la tabla siguiente para saber cuántos anillos se vendieron en Gante en agosto pasado. Para comprender la información que contiene la tabla, establecemos asociaciones visuales entre los datos de la tabla y sus encabezados de columna y/o fila.</p>
-
-<table>
- <caption>Artículos vendidos en agosto de 2016</caption>
- <tbody>
-  <tr>
-   <td></td>
-   <td></td>
-   <th colspan="3" scope="colgroup">Ropa</th>
-   <th colspan="2" scope="colgroup">Accesorios</th>
-  </tr>
-  <tr>
-   <td></td>
-   <td></td>
-   <th scope="col">Pantalones</th>
-   <th scope="col">Faldas</th>
-   <th scope="col">Vestidos</th>
-   <th scope="col">Pulseras</th>
-   <th scope="col">Anillos</th>
-  </tr>
-  <tr>
-   <th rowspan="3" scope="rowgroup">Bélgica</th>
-   <th scope="row">Amberes</th>
-   <td>56</td>
-   <td>22</td>
-   <td>43</td>
-   <td>72</td>
-   <td>23</td>
-  </tr>
-  <tr>
-   <th scope="row">Gante</th>
-   <td>46</td>
-   <td>18</td>
-   <td>50</td>
-   <td>61</td>
-   <td>15</td>
-  </tr>
-  <tr>
-   <th scope="row">Bruselas</th>
-   <td>51</td>
-   <td>27</td>
-   <td>38</td>
-   <td>69</td>
-   <td>28</td>
-  </tr>
-  <tr>
-   <th rowspan="2" scope="rowgroup">Los países bajos</th>
-   <th scope="row">Ámsterdam</th>
-   <td>89</td>
-   <td>34</td>
-   <td>69</td>
-   <td>85</td>
-   <td>38</td>
-  </tr>
-  <tr>
-   <th scope="row">Utrecht</th>
-   <td>80</td>
-   <td>12</td>
-   <td>43</td>
-   <td>36</td>
-   <td>19</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Pero, ¿y si no puedes hacer esas asociaciones visuales? ¿Cómo podrías leer una tabla como la anterior? Las personas con discapacidad visual a menudo usan un lector de pantalla que les lee la información de las páginas web. Esto no resulta un problema cuando lees un texto sin formato, pero interpretar una tabla puede ser un gran desafío para una persona ciega. Sin embargo, con el marcado adecuado podemos reemplazar las asociaciones visuales por otras asociaciones de tipo programático.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Hay en torno a 253 millones de personas con discapacidad visual según los<a href="https://www.who.int/es/news-room/fact-sheets/detail/blindness-and-visual-impairment" title="datos de la OMS sobre la discapacidad visual"> datos de la OMS de 2017</a>.</p>
-</div>
-
-<p>Esta sección del artículo proporciona técnicas adicionales para conferir a las tablas la mayor accesibilidad posible.</p>
-
-<h3 class="attTitle" id="Usar_encabezados_de_columna_y_fila">Usar encabezados de columna y fila</h3>
-
-<p>Los lectores de pantalla identificarán todos los encabezados y los usarán para hacer asociaciones programáticas entre esos encabezados y las celdas con las que se relacionan. La combinación de encabezados por columna y fila identificará e interpretará los datos de cada celda para que los usuarios que usan lectores de pantalla puedan interpretar la tabla de manera similar a como lo hace un usuario sin discapacidad visual.</p>
-
-<p>Ya expusimos los encabezados en nuestro artículo anterior; consulta <a href="/es/docs/Learn/HTML/Tablas/Conceptos_b%C3%A1sicos_de_las_tablas_HTML#A%C3%B1adir_encabezados_con_elementos_%3Cth%3E">Añadir encabezados con elementos &lt;th&gt;</a>.</p>
-
-<h3 class="attTitle" id="El_atributo_scope">El atributo scope</h3>
-
-<p>Un nuevo tema para este artículo es el atributo {{htmlattrxref ("scope", "th")}}, que se puede añadir al elemento <code>&lt;th&gt;</code> para indicar a los lectores de pantalla exactamente para qué celdas es el encabezado. Volviendo a nuestro ejemplo anterior de registro de gastos, podrías definir los encabezados de columna inequívocamente como encabezados de columna de este modo:</p>
-
-<pre class="brush: html notranslate">&lt;thead&gt;
-  &lt;tr&gt;
-    &lt;th scope="col"&gt;Compra&lt;/th&gt;
-    &lt;th scope="col"&gt;Ubicación&lt;/th&gt;
-    &lt;th scope="col"&gt;Fecha&lt;/th&gt;
-    &lt;th scope="col"&gt;Revisión&lt;/th&gt;
-    &lt;th scope="col"&gt;Coste (€)&lt;/th&gt;
-  &lt;/tr&gt;
-&lt;/thead&gt;</pre>
-
-<p>Y también cada fila podría tener un encabezado definido de esta manera (si añadimos encabezados de fila y encabezados de columna):</p>
-
-<pre class="brush: html notranslate">&lt;tr&gt;
-  &lt;th scope="row"&gt;Corte de pelo&lt;/th&gt;
-
-&lt;td&gt;Peluquería&lt;/td&gt;
-  &lt;td&gt;12/09&lt;/td&gt;
-
-&lt;td&gt;Gran idea&lt;/td&gt;
-  &lt;td&gt;30&lt;/td&gt;
-&lt;/tr&gt;</pre>
-
-<p>Los lectores de pantalla reconocerán el marcado estructurado de esta manera y permitirán a tus usuarios, por ejemplo, leer toda la columna o fila a la vez.</p>
-
-<p>El atributo <code>scope</code> tiene dos valores posibles más: <code>colgroup</code> y <code>rowgroup</code>. Se utilizan para encabezados que se encuentran sobre la parte superior de varias columnas o filas. Si vuelves a echar un vistazo a la tabla «Artículos vendidos en agosto de 2016» al comienzo de esta sección, verás que la celda «Ropa» se encuentra encima de las celdas «Pantalones», «Faldas» y «Vestidos» Todas estas celdas deben estar marcadas como encabezados (<code>&lt;th&gt;</code>), pero «Ropa» es un encabezado que está por encima y define los otros tres subencabezados. Por lo tanto, «Ropa» debería incluir un atributo <code>scope="colgroup"</code>, mientras que los demás tendrían un atributo <code>scope="col"</code>.</p>
-
-<h3 class="attTitle" id="Los_atributos_de_id_y_encabezados">Los atributos de id y encabezados</h3>
-
-<p>Una alternativa al uso del atributo <code>scope</code> es usar los atributos {{htmlattrxref ("id")}} y {{htmlattrxref ("headers", "td")}} para crear asociaciones entre encabezados y celdas. La forma en que se usan es la siguiente:</p>
-
-<ol>
- <li>Añades un <code>id</code> único a cada elemento <code>&lt;th&gt;</code>.</li>
- <li>Añades un atributo <code>headers</code> a cada elemento <code>&lt;td&gt;</code>. Cada atributo <code>headers</code> debe contener una lista de los <code>id</code> de todos los elementos <code>&lt;th&gt;</code> que actúan como encabezado de esa celda, separados por espacios.</li>
-</ol>
-
-<p>Esto le da a tu tabla HTML una definición explícita de la posición de cada celda en la tabla definida por los encabezados de cada columna y fila de la que forma parte, como en una hoja de cálculo. Para que funcione bien, la tabla necesita tanto encabezados de columna como encabezados de fila.</p>
-
-<p>Volviendo a nuestro ejemplo de gastos, los dos fragmentos anteriores podrían reescribirse así:</p>
-
-<pre class="brush: html notranslate">&lt;thead&gt;
-  &lt;tr&gt;
-    &lt;th id="purchase"&gt;Compra&lt;/th&gt;
-    &lt;th id="location"&gt;Ubicación&lt;/th&gt;
-    &lt;th id="date"&gt;Fecha&lt;/th&gt;
-    &lt;th id="evaluation"&gt;Revisión&lt;/th&gt;
-    &lt;th id="cost"&gt;Coste (€)&lt;/th&gt;
-  &lt;/tr&gt;
-&lt;/thead&gt;
-&lt;tbody&gt;
-&lt;tr&gt;
-  &lt;th id="haircut"&gt;Corte de pelo&lt;/th&gt;
-  &lt;td headers="location haircut"&gt;Peluquería&lt;/td&gt;
-  &lt;td headers="date haircut"&gt;12/09&lt;/td&gt;
-  &lt;td headers="evaluation haircut"&gt;Gran idea&lt;/td&gt;
-  &lt;td headers="cost haircut"&gt;30&lt;/td&gt;
-&lt;/tr&gt;
-
-  ...
-
-&lt;/tbody&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Este método crea asociaciones muy precisas entre los encabezados y las celdas de datos, pero utiliza <strong>un montón</strong> más de código de marcado y no permite errores. El enfoque <code>scope</code> suele bastar para la mayoría de las tablas.</p>
-</div>
-
-<h3 id="Aprendizaje_activo_jugar_con_scope_y_headers">Aprendizaje activo: jugar con scope y headers</h3>
-
-<ol>
- <li>Para este ejercicio final, te proponemos que primero hagas copias locales de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold.html">items-sold.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/minimal-table.css">minimal-table.css</a> en un directorio nuevo.</li>
- <li>Ahora intenta añadir los atributos <code>scope</code> adecuados para hacer que esta tabla sea más accesible.</li>
- <li>Por último, haz otra copia de los archivos originales, y esta vez añade accesibilidad a la tabla utilizando los atributos <code>id</code> y <code>headers</code>.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes verificar tu trabajo con nuestros ejemplos terminados: consulta <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-scope.html">items-sold-scope.html</a> (<a href="http://mdn.github.io/learning-area/html/tables/advanced/items-sold-scope.html">consúltalo en vivo</a>) y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-headers.html">items-sold-headers.html</a> (<a href="http://mdn.github.io/learning-area/html/tables/advanced/items-sold-headers.html">consúltalo en vivo</a>).</p>
-</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Podrías aprender algo más sobre las tablas en HTML, pero en realidad te hemos proporcionado toda la información que necesitas saber en este momento. En este punto, es posible que desees ir y aprender sobre la aplicación de estilo a tablas HTML: consulta <a href="/es/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a>.</p>
-
-<div>{{PreviousMenuNext("Learn/HTML/Tables/Basics", "Learn/HTML/Tables/Structuring_planet_data", "Learn/HTML/Tables")}}</div>
-
-<div>
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Tables/Basics">Conceptos básicos de las tablas en HTML</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Tables/Advanced">Funciones avanzadas de las tablas HTML y accesibilidad</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Tables/Structuring_planet_data">Estructuración de datos planetarios </a></li>
-</ul>
-</div>
diff --git a/files/es/learn/html/tablas/index.html b/files/es/learn/html/tablas/index.html
deleted file mode 100644
index 7d04eb0cbf..0000000000
--- a/files/es/learn/html/tablas/index.html
+++ /dev/null
@@ -1,34 +0,0 @@
----
-title: Tablas HTML
-slug: Learn/HTML/Tablas
-translation_of: Learn/HTML/Tables
----
-<div>{{LearnSidebar}}</div>
-
-<p class="summary">Una tarea muy común en HTML es la estructuración de datos, y para esto hay múltiples elementos y atributos. Esto unido a un poco de CSS, hace que en HTML sea sencillo mostrar tablas con información sobre tu horario escolar, los horarios de una piscina local o las estadisticas de tu equipo de dinosaurios o fútbol preferido. Este módulo te guiará en todo lo que necesitas saber sobre la estructuración tabular de datos en HTML.</p>
-
-<h2 id="Requisitos_previos">Requisitos previos</h2>
-
-<p>Antes de comenzar este módulo, deberías de saber las cosas básicas de HTML — ver <a href="https://developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si estas trabjando en un ordenador/tableta/otro dispositivo en el que no puedes crear tus propios archivos, puedes probar la mayoría de ejemplos online en webs como <a href="http://jsbin.com/">JSBin</a> o <a href="https://thimble.mozilla.org/">Thimble</a>.</p>
-</div>
-
-<h2 id="Guías">Guías</h2>
-
-<p>Este módulo contiene los siguientes artículos:</p>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/HTML/Tables/Basics">Comenzando con tablas HTML</a></dt>
- <dd>Este artículo te introduce en las tablas HTML , cubriendo las cosas más basicas como las líneas y las celdas, encabezados, crear celdas de multiples líneas y columnas, y como agrupar todas las celdas en una columna con fines estilisticos.</dd>
- <dt><a href="/en-US/docs/Learn/HTML/Tables/Advanced">Características avanzadas y accesibilidad en tablas HTML</a></dt>
- <dd>En el segundo artículo de este módulo, veremos algunas características avanzadas de las tablas HTML — como subtítulos/resumenes y agrupar líneas en la cabeza, cuerpo y pie de la tabla — además de realizar tablas accesibles para aquellos usuarios con problemas de visión.</dd>
-</dl>
-
-<h2 id="Evaluación">Evaluación</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Learn/HTML/Tables/Structuring_planet_data">Estructurar datos planetarios</a></dt>
- <dd>En nuestra evaluación, te proporcionamos datos sobre los planetas de nuestro sistemas solar y tu los estructurarás en una tabla HTML.</dd>
-</dl>
diff --git a/files/es/learn/html/tablas/structuring_planet_data/index.html b/files/es/learn/html/tablas/structuring_planet_data/index.html
deleted file mode 100644
index e9868bb95a..0000000000
--- a/files/es/learn/html/tablas/structuring_planet_data/index.html
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: 'Evaluación: Estructurando datos planetarios'
-slug: Learn/HTML/Tablas/Structuring_planet_data
-translation_of: Learn/HTML/Tables/Structuring_planet_data
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</div>
-
-<p class="summary">En nuestra evaluación te proporcionamos datos sobre los planetas de nuestro sistema solar y tu los estructurarás en una tabla HTML.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Requisitos previos:</th>
-   <td>Antes de comenzar esta evaluación deberías de haber leído los artículos de este módulo.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprobar si has comprendido las tablas HTML y las características asociadas.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Punto_de_incio">Punto de incio</h2>
-
-<p>Para comenzar esta evaluación, crea una copia local de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/blank-template.html">blank-template.html</a>, <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/minimal-table.css">minimal-table.css</a>, y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/planets-data.txt">planets-data.txt</a> en una nueva carpeta de tu ordenador.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Como alternativa, puedes usar una web como <a class="external external-icon" href="https://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para realizar tu evaluación. Puedes pegar el HTML, CSS y JavaScript en uno de estos editores online. Si el editor online que estas usando no tiene paneles separados para JavaScript/CSS, sientete libre de ponerlos en línea dentro del mismo HTML mediante el uso de <code>&lt;script&gt;</code>/<code>&lt;style&gt;</code>.</p>
-</div>
-
-<h2 id="Resumen_del_proyecto">Resumen del proyecto</h2>
-
-<p>Estás trabajando en la escuela; tus estudiantes están estudiando los planetas de nuestro sistema solar y quieres proporcionarles una forma sencilla de seguir los datos para buscar hechos sobre los planetas. Una tabla HTML sería ideal — tienes que coger los datos que tienes disponibles y convertirlos en una tabla siguiendo los pasos de abajo.</p>
-
-<p>La tabla finalizada debería de verse así:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14609/assessment-table.png" style="display: block; margin: 0 auto;"></p>
-
-<p>También puedes ver el ejemplo <a href="https://mdn.github.io/learning-area/html/tables/assessment-finished/planets-data.html">aquí</a> (no mires el código fuente — ¡no hagas trampas!)</p>
-
-<ul>
-</ul>
-
-<h2 id="Pasos_para_completarlo">Pasos para completarlo</h2>
-
-<p>Los siguientes pasos describen lo que necesitas para completar el ejemplo de la tabla. Todos los datos que necesitarás están en el archivo <code>planets-data.txt</code>.<font face="consolas, Liberation Mono, courier, monospace"> </font>Si tienes problemas para visualizar los datos, mira el ejemplo de arriba o intentalo dibujando un diagrama.</p>
-
-<ol>
- <li>Abre tu copia de <code>blank-template.html</code>, y comienza la tabla dándole un contenedor exterior, una cabecera y un cuerpo. No necesitas un pie de tabla en este ejemplo.</li>
- <li>Añade el subtítulo proporcionado a tu tabla.</li>
- <li>Añade una línea a la cabecera que contenga todos los encabezados de columna.</li>
- <li>Crea todas las líneas con su contenido, asegurandote marcar como cabecera aquellas celdas que lo sean.</li>
- <li>Asegurate de que el contenido esta insertado en las celdas correctas — en los datos del .txt, cada línea del planeta esta al lado de su planeta asociado.</li>
- <li>Añade atributos para que las líneas y columnas del encabezado no se puedan confundir con las líneas, columnas o grupos de líneas a las que encabezan.</li>
- <li>Añade un borde negro alrededor de la columna que contiene los nombres de los planetas y sus encabezados.</li>
-</ol>
-
-<h2 id="Pistas_y_consejos">Pistas y consejos</h2>
-
-<ul>
- <li>La primera celda de la línea de enbezado tiene que estar en blanco y unir dos columnas.</li>
- <li>Los encabezados de la filas agrupadas (p. ej. <em>Jovian planets</em>) que están a la izquierda de los encabezados de nombres de planetas (p. ej. <em>Saturn</em>) son algo complicados de resolver — asegurate de que cada uno agrupa el número correcto de líneas y columnas</li>
- <li>Una manera de asociar encabezados con sus líneas/columnas es mucha más fácil que la otra.</li>
-</ul>
-
-<h2 id="Evaluación">Evaluación</h2>
-
-<p>Si estas siguiendo esta evaluación como parte de un curso organizado, deberías de ser capaz de entregar tu trabajo a tu profesor(a)/mentor para ver la puntuación. Si estas aprendiendo por tu cuenta, puedes obtener la guía de puntuación preguntando en <a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">Learning Area Discourse thread</a> o en el canal IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Intenta hacer el ejercicio primero  — ¡haciendo trampas no aprenderás nada!</p>
-
-<p>{{PreviousMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</p>
diff --git a/files/es/learn/html/tables/advanced/index.html b/files/es/learn/html/tables/advanced/index.html
new file mode 100644
index 0000000000..6c008ab50b
--- /dev/null
+++ b/files/es/learn/html/tables/advanced/index.html
@@ -0,0 +1,472 @@
+---
+title: Funciones avanzadas de las tablas HTML y accesibilidad
+slug: Learn/HTML/Tables/Advanced
+translation_of: Learn/HTML/Tables/Advanced
+original_slug: Learn/HTML/Tablas/Funciones_avanzadas_de_las_tablas_HTML_y_accesibilidad
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/HTML/Tables/Basics", "Learn/HTML/Tables/Structuring_planet_data", "Learn/HTML/Tables")}}</div>
+
+<p class="summary">En el segundo artículo de este módulo, analizamos algunas características más avanzadas de las tablas HTML, como los subtítulos/resúmenes, la agrupación de filas en las secciones del encabezado, el cuerpo y el pie de página; y también analizamos la accesibilidad de las tablas para usuarios con discapacidad visual.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conceptos básicos de HTML (ver <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Aprender las características más avanzadas de las tablas HTML y la accesibilidad de las tablas.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Añadir_un_subtítulo_a_tu_tabla_con_&lt;caption>">Añadir un subtítulo a tu tabla con &lt;caption&gt;</h2>
+
+<p>Puedes dar un título a tu tabla colocándolo dentro de un elemento {{htmlelement ("caption")}} y anidándolo dentro del elemento {{htmlelement ("table")}}. Debes ponerlo justo debajo de la etiqueta de apertura <code>&lt;table&gt;</code>.</p>
+
+<pre class="brush: html notranslate">&lt;table&gt;
+  &lt;caption&gt;Dinosaurios en el período Jurásico&lt;/caption&gt;
+
+  ...
+&lt;/table&gt;</pre>
+
+<p>Como puedes deducir a partir del breve ejemplo anterior, el título debe contener una descripción del contenido de la tabla. Esto es útil para todos los lectores que deseen descubrir de un vistazo si la tabla les resulta útil mientras ojean la página, pero es útil especialmente para usuarios ciegos. En lugar de que un lector de pantalla lea el contenido de muchas celdas solo para averiguar de qué trata la tabla, el lector puede contar con el título para luego decidir si leer la tabla con mayor detalle.</p>
+
+<p>Los subtítulos se colocan directamente debajo de la etiqueta <code>&lt;table&gt;</code>.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El atributo {{htmlattrxref("summary","table")}} también se puede usar en el elemento <code>table</code> para proporcionar una descripción; los lectores de pantalla también lo leen. Sin embargo, recomendamos usar el elemento <code>caption</code>, porque {{htmlattrxref("summary","table")}} está {{glossary("obsoleto")}} conforme a la especificación HTML5 y porque los usuarios sin discapacidad visual no pueden leerlo (no aparece en la página).</p>
+</div>
+
+<h3 id="Aprendizaje_activo_Añadir_un_subtítulo">Aprendizaje activo: Añadir un subtítulo</h3>
+
+<p>Vamos a probarlo con un ejemplo del artículo anterior.</p>
+
+<ol>
+ <li>Abre el ejemplo del horario de clases de la profesora de idiomas del final de <a href="/es/docs/Learn/HTML/Tablas/Conceptos_b%C3%A1sicos_de_las_tablas_HTML#Aprendizaje_activo_colgroup_y_col"> conocimientos básicos de las tablas HTML</a>, o haz una copia local de nuestro archivo <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable-fixed.html">timetable-fixed.html</a>.</li>
+ <li>Añade un título adecuado a la tabla.</li>
+ <li>Guarda tu código, ábrelo en un navegador y observa qué aspecto presenta.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar nuestra versión en GitHub: consulta <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/timetable-caption.html">timetable-caption.html</a> (<a href="http://mdn.github.io/learning-area/html/tables/advanced/timetable-caption.html">mirar en vivo</a>).</p>
+</div>
+
+<h2 id="Añadir_estructura_con_&lt;thead>_&lt;tfoot>_y_&lt;tbody>">Añadir estructura con &lt;thead&gt;, &lt;tfoot&gt; y &lt;tbody&gt;</h2>
+
+<p>A medida que la estructura de las tablas se vuelve más compleja, es útil darles una estructura más definida. Una forma clara de hacerlo es con {{htmlelement ("thead")}}, {{htmlelement ("tfoot")}} y {{htmlelement ("tbody")}}, que te permiten marcar un encabezado, un pie de página y una sección del cuerpo de la tabla.</p>
+
+<p>Estos elementos no mejoran las características de accesibilidad de la tabla para los usuarios de lectores de pantalla ni su aspecto visual en sí. Sin embargo, son muy útiles para la aplicación de estilo y la compaginación, porque actúan como soportes útiles para añadir CSS a tu tabla. Como ejemplos interesantes, en el caso de una tabla extensa, puedes hacer que el encabezado y el pie de página se repitan en cada página impresa, y también que el cuerpo de la tabla se muestre en una sola página y desplazarte por los contenidos arriba y abajo con la barra de desplazamiento.</p>
+
+<p>Para utilizarlos:</p>
+
+<ul>
+ <li>El elemento <code>&lt;thead&gt;</code> debe delimitar el encabezado de la tabla; esta suele ser la primera fila, que contiene los encabezados de las columnas, pero no siempre es así. Si utilizas los elementos {{htmlelement ("col")}}/{{htmlelement ("colgroup")}}, el encabezado de la tabla debe estar justo debajo.</li>
+ <li>El elemento <code>&lt;tfoot&gt;</code> delimita la parte de la tabla correspondiente al pie de página; esta podría ser una fila final con elementos en las filas anteriores. Puedes incluir el pie de página de la tabla justo en la parte inferior de la tabla, donde esperarías que esté, o justo debajo del encabezado (y el navegador lo mostrará aun así en la parte inferior de la tabla).</li>
+ <li>El elemento <code>&lt;tbody&gt;</code> delimita las otras partes del contenido de la tabla que no están en el encabezado o en el pie de página de la tabla. Aparecerá debajo del encabezado de la tabla o, a veces, en el pie de página, según cómo hayas decidido estructurarlo.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: <code>&lt;tbody&gt;</code> se incluye siempre en todas las tablas de forma implícita si no lo especificas en tu código. Para comprobarlo, abre uno de tus ejemplos anteriores que no incluya <code>&lt;tbody&gt;</code> y mira el código HTML en las <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">herramientas de desarrollo de tu navegador</a>; verás que el navegador ha añadido esta etiqueta. Quizás te preguntes por qué deberías molestarte en incluirlo. Debes hacerlo para tener más control sobre la estructura y el estilo de la tabla.</p>
+</div>
+
+<h3 id="Aprendizaje_activo_Añadir_estructura_a_la_tabla">Aprendizaje activo: Añadir estructura a la tabla</h3>
+
+<p>Pongamos en acción estos elementos nuevos.</p>
+
+<ol>
+ <li>En primer lugar, haz una copia local de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/spending-record.html">spending-record.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/minimal-table.css">minimal-table.css</a> en una carpeta nueva de tu ordenador.</li>
+ <li>Intenta abrirlo en un navegador: observarás que se ve bien, pero podría mejorarse. La fila «SUM», que contiene una suma de las cantidades gastadas, parece estar en el lugar equivocado, y faltan algunos detalles del código.</li>
+ <li>Coloca la fila de encabezados dentro de un elemento <code>&lt;thead&gt;</code>, la fila «SUM» dentro de un elemento <code>&lt;tfoot&gt;</code>, y el resto del contenido dentro de un elemento <code>&lt;tbody&gt;</code>.</li>
+ <li>Guarda y actualiza, y observa que añadir el elemento <code>&lt;tfoot&gt;</code> ha provocado que la fila «SUM» pase al final de la tabla.</li>
+ <li>Luego, añade un atributo {{htmlattrxref ("colspan", "td")}} para que la celda «SUM» abarque las primeras cuatro columnas, de modo que el número aparezca en la parte inferior de la columna «Costes».</li>
+ <li>Vamos a añadir un estilo adicional sencillo a la tabla para que veas cuán útiles son estos elementos para aplicar CSS. Dentro del encabezado del documento HTML hay un elemento {{htmlelement ("style")}} vacío. Añade a este elemento las líneas de código CSS siguientes:
+  <pre class="brush: css notranslate">tbody {
+  font-size: 95%;
+  font-style: italic;
+}
+
+tfoot {
+  font-weight: bold;
+}
+</pre>
+ </li>
+ <li>Guarda, actualiza, y échale un vistazo al resultado. Si los elementos <code>&lt;tbody&gt;</code> y <code>&lt;tfoot&gt;</code> no estuvieran en su lugar, tendrías que escribir selectores/reglas mucho más complicados para obtener la misma aplicación de estilo.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: No esperamos que comprendas completamente el CSS en este momento. Aprenderás más sobre el tema cuando llegues a nuestros módulos CSS (<a href="/es/docs/Learn/CSS/First_steps">Introducción al CSS</a> es un buen lugar para comenzar; también tenemos un artículo específico sobre <a href="/es/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a>).</p>
+</div>
+
+<p>Tu tabla final debería tener un aspecto similar al siguiente:</p>
+
+<div class="hidden">
+<h6 id="Hidden_example">Hidden example</h6>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt; Mi historial de gastos &lt;/title&gt;
+    &lt;style&gt;
+
+        html {
+          font-family: sans-serif;
+        }
+
+          table {
+          border-collapse: collapse;
+          border: 4px solid rgb(200,200,200);
+          letter-spacing: 1px;
+          font-size: 0.8rem;
+        }
+
+        td, th {
+          border: 2px solid rgb(190,190,190);
+          padding: 10px 20px;
+        }
+
+        th {
+          background-color: rgb(235,235,235);
+        }
+
+        td {
+          text-align: center;
+        }
+
+        tr:nth-child(even) td {
+          background-color: rgb(250,250,250);
+        }
+
+        tr:nth-child(odd) td {
+          background-color: rgb(245,245,245);
+        }
+
+        caption {
+          padding: 10px;
+        }
+
+        tbody {
+          font-size: 90%;
+          font-style: italic;
+        }
+
+        tfoot {
+          font-weight: bold;
+        }
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+      &lt;table&gt;
+
+&lt;caption&gt; Cómo elegí gastar mi dinero &lt;/caption&gt;
+        &lt;thead&gt;
+          &lt;tr&gt;
+            &lt;th&gt; Compra &lt;/th&gt;
+
+&lt;th&gt; Ubicación &lt;/th&gt;
+            &lt;th&gt; Fecha &lt;/th&gt;
+            &lt;th&gt; Revisión &lt;/th&gt;
+
+&lt;th&gt; Coste (€) &lt;/th&gt;
+          &lt;/tr&gt;
+        &lt;/thead&gt;
+        &lt;tfoot&gt;
+          &lt;tr&gt;
+            &lt;td colspan="4"&gt;SUM&lt;/td&gt;
+            &lt;td&gt;118&lt;/td&gt;
+          &lt;/tr&gt;
+        &lt;/tfoot&gt;
+        &lt;tbody&gt;
+          &lt;tr&gt;
+            &lt;td&gt; Corte de pelo &lt;/td&gt;
+
+&lt;td&gt; Peluquería &lt;/td&gt;
+            &lt;td&gt;12/09&lt;/td&gt;
+
+&lt;td&gt; Gran idea &lt;/td&gt;
+            &lt;td&gt;30&lt;/td&gt;
+          &lt;/tr&gt;
+          &lt;tr&gt;
+
+&lt;td&gt; Lasaña &lt;/td&gt;
+
+&lt;td&gt; Restaurante &lt;/td&gt;
+            &lt;td&gt;12/09&lt;/td&gt;
+            &lt;td&gt; Arrepentimiento &lt;/td&gt;
+            &lt;td&gt;18&lt;/td&gt;
+          &lt;/tr&gt;
+          &lt;tr&gt;
+
+&lt;td&gt; Zapatos &lt;/td&gt;
+            &lt;td&gt; Zapatería &lt;/td&gt;
+            &lt;td&gt;13/09&lt;/td&gt;
+
+&lt;td&gt; Mucho arrepentimiento &lt;/td&gt;
+            &lt;td&gt;65&lt;/td&gt;
+          &lt;/tr&gt;
+          &lt;tr&gt;
+            &lt;td&gt; Pasta de dientes &lt;/td&gt;
+            &lt;td&gt; Supermercado &lt;/td&gt;
+            &lt;td&gt;13/09&lt;/td&gt;
+
+&lt;td&gt; Bien &lt;/td&gt;
+            &lt;td&gt;5&lt;/td&gt;
+          &lt;/tr&gt;
+        &lt;/tbody&gt;
+    &lt;/table&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Hidden_example', '100%', 300, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: También puedes encontrarlo en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/spending-record-finished.html">spending-record-finished.html</a> (o consultarlo también <a href="http://mdn.github.io/learning-area/html/tables/advanced/spending-record-finished.html">en vivo</a>).</p>
+</div>
+
+<h2 id="Anidar_tablas">Anidar tablas</h2>
+
+<p>Es posible anidar una tabla dentro de otra, siempre que incluyas la estructura completa, incluido el elemento <code>&lt;table&gt;</code>. Por lo general, esto no se recomienda, porque se obtiene un marcado más confuso y menos accesible para los usuarios que usan lectores de pantalla, y además, en muchos casos sería posible sencillamente insertar celdas/filas/columnas adicionales en la tabla. Sin embargo, a veces es necesario, por ejemplo, si deseas importar contenido de forma sencilla desde otras fuentes.</p>
+
+<p>El marcado siguiente muestra una tabla anidada simple:</p>
+
+<pre class="brush: html notranslate">&lt;table id="tabla1"&gt;
+  &lt;tr&gt;
+    &lt;th&gt;título1&lt;/th&gt;
+    &lt;th&gt;título2&lt;/th&gt;
+    &lt;th&gt;título3&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td id="nested"&gt;
+      &lt;table id="tabla2"&gt;
+        &lt;tr&gt;
+          &lt;td&gt;celda1&lt;/td&gt;
+          &lt;td&gt;celda2&lt;/td&gt;
+          &lt;td&gt;celda3&lt;/td&gt;
+        &lt;/tr&gt;
+      &lt;/table&gt;
+    &lt;/td&gt;
+    &lt;td&gt;celda2&lt;/td&gt;
+    &lt;td&gt;celda3&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;celda4&lt;/td&gt;
+    &lt;td&gt;celda5&lt;/td&gt;
+    &lt;td&gt;celda6&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;</pre>
+
+<p>La salida se verá así:</p>
+
+<table id="table1">
+ <tbody>
+  <tr>
+   <th>título1</th>
+   <th>título2</th>
+   <th>título3</th>
+  </tr>
+  <tr>
+   <td id="nested">
+    <table id="table2">
+     <tbody>
+      <tr>
+       <td>celda1</td>
+       <td>celda2</td>
+       <td>celda3</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+   <td>celda2</td>
+   <td>celda3</td>
+  </tr>
+  <tr>
+   <td>celda4</td>
+   <td>celda5</td>
+   <td>celda6</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Tablas_para_usuarios_con_discapacidad_visual">Tablas para usuarios con discapacidad visual</h2>
+
+<p>Repasemos brevemente cómo usamos las tablas de datos. Una tabla puede ser una herramienta útil porque nos proporciona un acceso rápido a unos datos y nos permite buscar entre valores diferentes. Por ejemplo, echa un vistazo a la tabla siguiente para saber cuántos anillos se vendieron en Gante en agosto pasado. Para comprender la información que contiene la tabla, establecemos asociaciones visuales entre los datos de la tabla y sus encabezados de columna y/o fila.</p>
+
+<table>
+ <caption>Artículos vendidos en agosto de 2016</caption>
+ <tbody>
+  <tr>
+   <td></td>
+   <td></td>
+   <th colspan="3" scope="colgroup">Ropa</th>
+   <th colspan="2" scope="colgroup">Accesorios</th>
+  </tr>
+  <tr>
+   <td></td>
+   <td></td>
+   <th scope="col">Pantalones</th>
+   <th scope="col">Faldas</th>
+   <th scope="col">Vestidos</th>
+   <th scope="col">Pulseras</th>
+   <th scope="col">Anillos</th>
+  </tr>
+  <tr>
+   <th rowspan="3" scope="rowgroup">Bélgica</th>
+   <th scope="row">Amberes</th>
+   <td>56</td>
+   <td>22</td>
+   <td>43</td>
+   <td>72</td>
+   <td>23</td>
+  </tr>
+  <tr>
+   <th scope="row">Gante</th>
+   <td>46</td>
+   <td>18</td>
+   <td>50</td>
+   <td>61</td>
+   <td>15</td>
+  </tr>
+  <tr>
+   <th scope="row">Bruselas</th>
+   <td>51</td>
+   <td>27</td>
+   <td>38</td>
+   <td>69</td>
+   <td>28</td>
+  </tr>
+  <tr>
+   <th rowspan="2" scope="rowgroup">Los países bajos</th>
+   <th scope="row">Ámsterdam</th>
+   <td>89</td>
+   <td>34</td>
+   <td>69</td>
+   <td>85</td>
+   <td>38</td>
+  </tr>
+  <tr>
+   <th scope="row">Utrecht</th>
+   <td>80</td>
+   <td>12</td>
+   <td>43</td>
+   <td>36</td>
+   <td>19</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Pero, ¿y si no puedes hacer esas asociaciones visuales? ¿Cómo podrías leer una tabla como la anterior? Las personas con discapacidad visual a menudo usan un lector de pantalla que les lee la información de las páginas web. Esto no resulta un problema cuando lees un texto sin formato, pero interpretar una tabla puede ser un gran desafío para una persona ciega. Sin embargo, con el marcado adecuado podemos reemplazar las asociaciones visuales por otras asociaciones de tipo programático.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Hay en torno a 253 millones de personas con discapacidad visual según los<a href="https://www.who.int/es/news-room/fact-sheets/detail/blindness-and-visual-impairment" title="datos de la OMS sobre la discapacidad visual"> datos de la OMS de 2017</a>.</p>
+</div>
+
+<p>Esta sección del artículo proporciona técnicas adicionales para conferir a las tablas la mayor accesibilidad posible.</p>
+
+<h3 class="attTitle" id="Usar_encabezados_de_columna_y_fila">Usar encabezados de columna y fila</h3>
+
+<p>Los lectores de pantalla identificarán todos los encabezados y los usarán para hacer asociaciones programáticas entre esos encabezados y las celdas con las que se relacionan. La combinación de encabezados por columna y fila identificará e interpretará los datos de cada celda para que los usuarios que usan lectores de pantalla puedan interpretar la tabla de manera similar a como lo hace un usuario sin discapacidad visual.</p>
+
+<p>Ya expusimos los encabezados en nuestro artículo anterior; consulta <a href="/es/docs/Learn/HTML/Tablas/Conceptos_b%C3%A1sicos_de_las_tablas_HTML#A%C3%B1adir_encabezados_con_elementos_%3Cth%3E">Añadir encabezados con elementos &lt;th&gt;</a>.</p>
+
+<h3 class="attTitle" id="El_atributo_scope">El atributo scope</h3>
+
+<p>Un nuevo tema para este artículo es el atributo {{htmlattrxref ("scope", "th")}}, que se puede añadir al elemento <code>&lt;th&gt;</code> para indicar a los lectores de pantalla exactamente para qué celdas es el encabezado. Volviendo a nuestro ejemplo anterior de registro de gastos, podrías definir los encabezados de columna inequívocamente como encabezados de columna de este modo:</p>
+
+<pre class="brush: html notranslate">&lt;thead&gt;
+  &lt;tr&gt;
+    &lt;th scope="col"&gt;Compra&lt;/th&gt;
+    &lt;th scope="col"&gt;Ubicación&lt;/th&gt;
+    &lt;th scope="col"&gt;Fecha&lt;/th&gt;
+    &lt;th scope="col"&gt;Revisión&lt;/th&gt;
+    &lt;th scope="col"&gt;Coste (€)&lt;/th&gt;
+  &lt;/tr&gt;
+&lt;/thead&gt;</pre>
+
+<p>Y también cada fila podría tener un encabezado definido de esta manera (si añadimos encabezados de fila y encabezados de columna):</p>
+
+<pre class="brush: html notranslate">&lt;tr&gt;
+  &lt;th scope="row"&gt;Corte de pelo&lt;/th&gt;
+
+&lt;td&gt;Peluquería&lt;/td&gt;
+  &lt;td&gt;12/09&lt;/td&gt;
+
+&lt;td&gt;Gran idea&lt;/td&gt;
+  &lt;td&gt;30&lt;/td&gt;
+&lt;/tr&gt;</pre>
+
+<p>Los lectores de pantalla reconocerán el marcado estructurado de esta manera y permitirán a tus usuarios, por ejemplo, leer toda la columna o fila a la vez.</p>
+
+<p>El atributo <code>scope</code> tiene dos valores posibles más: <code>colgroup</code> y <code>rowgroup</code>. Se utilizan para encabezados que se encuentran sobre la parte superior de varias columnas o filas. Si vuelves a echar un vistazo a la tabla «Artículos vendidos en agosto de 2016» al comienzo de esta sección, verás que la celda «Ropa» se encuentra encima de las celdas «Pantalones», «Faldas» y «Vestidos» Todas estas celdas deben estar marcadas como encabezados (<code>&lt;th&gt;</code>), pero «Ropa» es un encabezado que está por encima y define los otros tres subencabezados. Por lo tanto, «Ropa» debería incluir un atributo <code>scope="colgroup"</code>, mientras que los demás tendrían un atributo <code>scope="col"</code>.</p>
+
+<h3 class="attTitle" id="Los_atributos_de_id_y_encabezados">Los atributos de id y encabezados</h3>
+
+<p>Una alternativa al uso del atributo <code>scope</code> es usar los atributos {{htmlattrxref ("id")}} y {{htmlattrxref ("headers", "td")}} para crear asociaciones entre encabezados y celdas. La forma en que se usan es la siguiente:</p>
+
+<ol>
+ <li>Añades un <code>id</code> único a cada elemento <code>&lt;th&gt;</code>.</li>
+ <li>Añades un atributo <code>headers</code> a cada elemento <code>&lt;td&gt;</code>. Cada atributo <code>headers</code> debe contener una lista de los <code>id</code> de todos los elementos <code>&lt;th&gt;</code> que actúan como encabezado de esa celda, separados por espacios.</li>
+</ol>
+
+<p>Esto le da a tu tabla HTML una definición explícita de la posición de cada celda en la tabla definida por los encabezados de cada columna y fila de la que forma parte, como en una hoja de cálculo. Para que funcione bien, la tabla necesita tanto encabezados de columna como encabezados de fila.</p>
+
+<p>Volviendo a nuestro ejemplo de gastos, los dos fragmentos anteriores podrían reescribirse así:</p>
+
+<pre class="brush: html notranslate">&lt;thead&gt;
+  &lt;tr&gt;
+    &lt;th id="purchase"&gt;Compra&lt;/th&gt;
+    &lt;th id="location"&gt;Ubicación&lt;/th&gt;
+    &lt;th id="date"&gt;Fecha&lt;/th&gt;
+    &lt;th id="evaluation"&gt;Revisión&lt;/th&gt;
+    &lt;th id="cost"&gt;Coste (€)&lt;/th&gt;
+  &lt;/tr&gt;
+&lt;/thead&gt;
+&lt;tbody&gt;
+&lt;tr&gt;
+  &lt;th id="haircut"&gt;Corte de pelo&lt;/th&gt;
+  &lt;td headers="location haircut"&gt;Peluquería&lt;/td&gt;
+  &lt;td headers="date haircut"&gt;12/09&lt;/td&gt;
+  &lt;td headers="evaluation haircut"&gt;Gran idea&lt;/td&gt;
+  &lt;td headers="cost haircut"&gt;30&lt;/td&gt;
+&lt;/tr&gt;
+
+  ...
+
+&lt;/tbody&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Este método crea asociaciones muy precisas entre los encabezados y las celdas de datos, pero utiliza <strong>un montón</strong> más de código de marcado y no permite errores. El enfoque <code>scope</code> suele bastar para la mayoría de las tablas.</p>
+</div>
+
+<h3 id="Aprendizaje_activo_jugar_con_scope_y_headers">Aprendizaje activo: jugar con scope y headers</h3>
+
+<ol>
+ <li>Para este ejercicio final, te proponemos que primero hagas copias locales de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold.html">items-sold.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/minimal-table.css">minimal-table.css</a> en un directorio nuevo.</li>
+ <li>Ahora intenta añadir los atributos <code>scope</code> adecuados para hacer que esta tabla sea más accesible.</li>
+ <li>Por último, haz otra copia de los archivos originales, y esta vez añade accesibilidad a la tabla utilizando los atributos <code>id</code> y <code>headers</code>.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes verificar tu trabajo con nuestros ejemplos terminados: consulta <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-scope.html">items-sold-scope.html</a> (<a href="http://mdn.github.io/learning-area/html/tables/advanced/items-sold-scope.html">consúltalo en vivo</a>) y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/advanced/items-sold-headers.html">items-sold-headers.html</a> (<a href="http://mdn.github.io/learning-area/html/tables/advanced/items-sold-headers.html">consúltalo en vivo</a>).</p>
+</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Podrías aprender algo más sobre las tablas en HTML, pero en realidad te hemos proporcionado toda la información que necesitas saber en este momento. En este punto, es posible que desees ir y aprender sobre la aplicación de estilo a tablas HTML: consulta <a href="/es/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a>.</p>
+
+<div>{{PreviousMenuNext("Learn/HTML/Tables/Basics", "Learn/HTML/Tables/Structuring_planet_data", "Learn/HTML/Tables")}}</div>
+
+<div>
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Tables/Basics">Conceptos básicos de las tablas en HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Tables/Advanced">Funciones avanzadas de las tablas HTML y accesibilidad</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Tables/Structuring_planet_data">Estructuración de datos planetarios </a></li>
+</ul>
+</div>
diff --git a/files/es/learn/html/tables/basics/index.html b/files/es/learn/html/tables/basics/index.html
new file mode 100644
index 0000000000..c7af02ac17
--- /dev/null
+++ b/files/es/learn/html/tables/basics/index.html
@@ -0,0 +1,564 @@
+---
+title: Conceptos básicos de las tablas HTML
+slug: Learn/HTML/Tables/Basics
+translation_of: Learn/HTML/Tables/Basics
+original_slug: Learn/HTML/Tablas/Conceptos_básicos_de_las_tablas_HTML
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</div>
+
+<p class="summary">Este artículo te ayudará a comenzar con las tablas HTML. Vamos a exponer conceptos básicos como filas y celdas, encabezados, celdas que abarcan múltiples columnas y filas, y la forma de agrupar todas las celdas de una columna para aplicarles estilo.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conceptos básicos de HTML (ver <a href="/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción al HTML</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Adquirir conocimientos básicos de las tablas HTML.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_una_tabla">¿Qué es una tabla?</h2>
+
+<p>Una tabla es un conjunto estructurado de datos distribuidos en filas y columnas (<strong>datos tabulados</strong>). Una tabla permite buscar con rapidez y facilidad valores entre diferentes tipos de datos que indiquen algún tipo de conexión. Por ejemplo, una persona y su edad, o un día de la semana o el horario de una piscina municipal.</p>
+
+<p><img alt="Una tabla de datos de ejemplo que muestra los nombres y las edades de algunas personas: Chris 38, Dennis 45, Sarah 29, Karen 47." src="https://mdn.mozillademos.org/files/14583/numbers-table.png" style="display: block; height: 156px; margin: 0px auto; width: 350px;"></p>
+
+<p><img alt="Una tabla de datos que muestra unos horarios de clases natación" src="https://mdn.mozillademos.org/files/14587/swimming-timetable.png" style="display: block; height: 301px; margin: 0px auto; width: 794px;"></p>
+
+<p>Las tablas se utilizan con mucha frecuencia en la sociedad desde hace años, como lo demuestra este documento censal de los EUA de 1800:</p>
+
+<p><img alt="Un pergamino muy antiguo; cuesta un poco leer los datos, pero muestra con claridad que las tablas de datos ya se utilizaban en 1800." src="https://mdn.mozillademos.org/files/14585/1800-census.jpg" style="display: block; height: 505px; margin: 0px auto; width: 800px;"></p>
+
+<p>Por lo tanto, no es de extrañar que los creadores de HTML proporcionen un medio con el que estructurar y presentar datos en tablas en la web.</p>
+
+<h3 id="¿Cómo_funciona_una_tabla">¿Cómo funciona una tabla?</h3>
+
+<p>El aspecto básico de una tabla es que es un elemento rígido. Es fácil interpretar la información haciendo asociaciones visuales entre los encabezados de las filas y las columnas. Por ejemplo, observa la tabla siguiente y busca un gigante de gas joviano con 62 lunas. Puedes encontrar la respuesta asociando los encabezados de la fila y la columna correspondientes.</p>
+
+<table>
+ <caption>Datos sobre los planetas de nuestro sistema solar (datos planetarios tomados de la hoja técnica sobre datos planetarios de la NASA (<a href="http://nssdc.gsfc.nasa.gov/planetary/factsheet/">Nasa's Planetary Fact Sheet - Metric</a>).</caption>
+ <thead>
+  <tr>
+   <td colspan="2"></td>
+   <th scope="col">Nombre</th>
+   <th scope="col">Masa (10<sup>24</sup> kg)</th>
+   <th scope="col">Diámetro (km)</th>
+   <th scope="col">Densidad (kg/m<sup>3</sup>)</th>
+   <th scope="col">Gravedad (m/s<sup>2</sup>)</th>
+   <th scope="col">Duración del día (horas)</th>
+   <th scope="col">Distancia del Sol (10<sup>6</sup>km)</th>
+   <th scope="col">Temperatura media (°C)</th>
+   <th scope="col">Número de lunas</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="2" rowspan="4" scope="rowgroup">Planetas terrestres</th>
+   <th scope="row">Mercurio</th>
+   <td>0,330</td>
+   <td>4.879</td>
+   <td>5.427</td>
+   <td>3,7</td>
+   <td>4.222,6</td>
+   <td>57,9</td>
+   <td>167</td>
+   <td>0</td>
+   <td>El más cercano al Sol</td>
+  </tr>
+  <tr>
+   <th scope="row">Venus</th>
+   <td>4,87</td>
+   <td>12.104</td>
+   <td>5.243</td>
+   <td>8,9</td>
+   <td>2.802,0</td>
+   <td>108,2</td>
+   <td>464</td>
+   <td>0</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row">La Tierra</th>
+   <td>5,97</td>
+   <td>12.756</td>
+   <td>5.514</td>
+   <td>9,8</td>
+   <td>24,0</td>
+   <td>149,6</td>
+   <td>15</td>
+   <td>1</td>
+   <td>Nuestro planeta</td>
+  </tr>
+  <tr>
+   <th scope="row">Marte</th>
+   <td>0,642</td>
+   <td>6.792</td>
+   <td>3.933</td>
+   <td>3,7</td>
+   <td>24,7</td>
+   <td>227,9</td>
+   <td>-65</td>
+   <td>2</td>
+   <td>El planeta rojo</td>
+  </tr>
+  <tr>
+   <th rowspan="4" scope="rowgroup">Planetas jovianos</th>
+   <th rowspan="2" scope="rowgroup">Los gigantes de gas</th>
+   <th scope="row">Júpiter</th>
+   <td>1.898</td>
+   <td>142.984</td>
+   <td>1.326</td>
+   <td>23,1</td>
+   <td>9,9</td>
+   <td>778,6</td>
+   <td>-110</td>
+   <td>67</td>
+   <td>El planeta más grande</td>
+  </tr>
+  <tr>
+   <th scope="row">Saturno</th>
+   <td>568</td>
+   <td>120.536</td>
+   <td>687</td>
+   <td>9,0</td>
+   <td>10,7</td>
+   <td>1.433,5</td>
+   <td>-140</td>
+   <td>62</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th rowspan="2" scope="rowgroup">Los gigantes de hielo</th>
+   <th scope="row">Urano</th>
+   <td>86,8</td>
+   <td>51.118</td>
+   <td>1.271</td>
+   <td>8,7</td>
+   <td>17,2</td>
+   <td>2.872,5</td>
+   <td>-195</td>
+   <td>27</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th scope="row">Neptuno</th>
+   <td>102</td>
+   <td>49.528</td>
+   <td>1.638</td>
+   <td>11,0</td>
+   <td>16,1</td>
+   <td>4.495,1</td>
+   <td>-200</td>
+   <td>14</td>
+   <td></td>
+  </tr>
+  <tr>
+   <th colspan="2" scope="rowgroup">Planetas enanos</th>
+   <th scope="row">Plutón</th>
+   <td>0,0146</td>
+   <td>2.370</td>
+   <td>2.095</td>
+   <td>0,7</td>
+   <td>153,3</td>
+   <td>5.906,4</td>
+   <td>-225</td>
+   <td>5</td>
+   <td>Desclasificado como planeta en 2006, pero aún es una <a href="http://www.usatoday.com/story/tech/2014/10/02/pluto-planet-solar-system/16578959/">cuestión polémica</a>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Cuando se hace correctamente, incluso las personas ciegas pueden interpretar los datos de una tabla HTML. Una tabla HTML bien hecha debe mejorar la experiencia de los usuarios videntes e invidentes por igual.</p>
+
+<h3 id="Dar_estilo_a_las_tablas">Dar estilo a las tablas</h3>
+
+<p>También puedes <a href="https://mdn.github.io/learning-area/html/tables/assessment-finished/planets-data.html">echar un vistazo al ejemplo vivo</a> en GitHub. Observarás que la tabla que encontrarás allí tiene un aspecto más legible; esto se debe a que la tabla que ves en esta página tiene un estilo mínimo, mientras que en la de la versión de GitHub se ha aplicado un CSS más significativo.</p>
+
+<p>No te hagas ilusiones; para que las tablas sean efectivas en la web, debes proporcionar cierta información de estilo con <a href="/es/docs/Learn/CSS">CSS</a>, así como una buena estructura sólida con HTML. En este módulo nos centramos en la parte HTML; para averiguar sobre la parte del CSS debes visitar nuestro artículo <a href="/es/docs/Learn/CSS/Building_blocks/Styling_tables">Aplicar estilo a las tablas</a>.</p>
+
+<p>En este módulo no nos vamos a centrar en el CSS, sino que te vamos a proporcionar una hoja de estilo de CSS que dará a tus tablas algo más de legibilidad de la que se obtiene por defecto si no se proporciona ningún estilo. Puedes encontrar la hoja de estilo <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">aquí</a>, así como también una <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/blank-template.html">plantilla HTML</a> para aplicar la hoja de estilo (te darán un buen punto de partida para experimentar con las tablas HTML).</p>
+
+<h3 id="¿Cuándo_no_debes_usar_tablas_HTML">¿Cuándo no debes usar tablas HTML?</h3>
+
+<p>Las tablas HTML están pensadas para utilizarse con datos tabulados. Por desgracia, mucha gente utiliza las tablas HTML para hacer compaginaciones de páginas web. Por ejemplo, una fila para contener la cabecera, una fila para contener las columnas de contenido, una fila para contener el pie de página, etc. Puede encontrar más detalles y un ejemplo en <a href="/es/docs/Learn/Accessibility/HTML#Page_layouts">Diseños de página</a> en nuestro <a href="/es/docs/Learn/Accessibility">Módulo de aprendizaje de accesibilidad</a>. Se solía hacer este uso de las tablas porque la compatibilidad CSS entre navegadores solía ser terrible. Los diseños de tablas son mucho menos comunes hoy en día, pero aún se pueden ver en algunos rincones de la web.</p>
+
+<p>En resumen, es una mala idea usar tablas para el diseño en lugar de las <a href="/es/docs/Learn/CSS/CSS_layout">técnicas de diseño CSS</a>. Las razones principales son las siguientes:</p>
+
+<ol>
+ <li><strong>Las tablas de diseño reducen la accesibilidad para los usuarios con discapacidad visual</strong>: Los <a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders">lectores de pantalla</a> que utilizan las personas con visibilidad reducida interpretan las etiquetas de una página HTML y leen su contenido para el usuario. Puesto que las tablas no son la herramienta adecuada para el diseño y el marcado es más complejo que con las técnicas de diseño CSS, la salida de los lectores de pantalla será confusa para estos usuarios.</li>
+ <li><strong>Las tablas generan estructuras incorrectas</strong>: Como ya se mencionó, los diseños de tabla suelen involucrar estructuras de marcado más complejas que las técnicas de diseño. Esto puede dificultar la escritura, el mantenimiento y la depuración del código.</li>
+ <li><strong>Las tablas no tienen respuesta adaptativa automática</strong>: Cuando usas contenedores de diseño adecuados (tales como {{HTMLElement ("header")}}, {{HTMLElement ("section")}}, {{HTMLElement ("article")}} o {{HTMLElement ("div")}}), su ancho predeterminado es el 100% de su elemento padre. En cambio, las tablas se dimensionan de forma predeterminada según su contenido, por lo que se necesitan medidas adicionales para que el diseño de la tabla funcione de manera efectiva en todos los dispositivos.</li>
+</ol>
+
+<h2 id="Aprendizaje_activo_Crea_tu_primera_tabla">Aprendizaje activo: Crea tu primera tabla</h2>
+
+<p>Ya hemos hablado bastante sobre la teoría de las tablas, así que veamos un ejemplo práctico y construyamos una tabla simple.</p>
+
+<ol>
+ <li>En primer lugar, haz una copia local de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/blank-template.html">blank-template.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">minimal-table.css</a> en un directorio nuevo de tu ordenador.</li>
+ <li>El contenido de cada tabla está delimitado entre estas dos etiquetas: <strong><code><a href="/en-US/docs/Web/HTML/Element/table">&lt;table&gt;&lt;/table&gt;</a></code></strong>. Añádelas al cuerpo de tu código HTML.</li>
+ <li>El contenedor más pequeño dentro de una tabla es una celda, que se crea con un elemento <strong><code><a href="/en-US/docs/Web/HTML/Element/td">&lt;td&gt;</a></code></strong> ('td' significa 'table data', <em>datos de tabla</em>). Añade lo siguiente dentro de tus etiquetas de tabla:
+  <pre class="brush: html notranslate">&lt;td&gt;Hola, soy tu primera celda.&lt;/td&gt;</pre>
+ </li>
+ <li>Si quieres una fila de cuatro celdas, tienes que copiar estas etiquetas tres veces. Actualiza el contenido de la tabla para que se vea así:
+  <pre class="brush: html notranslate">&lt;td&gt;Hola, soy tu primera celda.&lt;/td&gt;
+&lt;td&gt;Soy tu segunda celda.&lt;/td&gt;
+&lt;td&gt;Soy tu tercera celda.&lt;/td&gt;
+&lt;td&gt;Soy tu cuarta celda.&lt;/td&gt;</pre>
+ </li>
+</ol>
+
+<p>Como verás, las celdas no se colocan una debajo de la otra, sino que se alinean automáticamente entre sí en la misma fila. Cada elemento &lt;td&gt; crea una sola celda, y juntas forman la primera fila. Cada celda que agregamos hace crecer la fila.</p>
+
+<p>Para detener el crecimiento de esta fila y comenzar a colocar las celdas posteriores en una segunda fila, necesitamos usar el elemento <strong><code><a href="/en-US/docs/Web/HTML/Element/tr">&lt;tr&gt;</a></code></strong> ('tr' significa 'table raw', <em>fila de tabla</em>). Vamos a verlo en detalle.</p>
+
+<ol>
+ <li>Coloca las cuatro celdas que has creado dentro de las etiquetas <code>&lt;tr&gt;</code>, de esta forma:
+
+  <pre class="brush: html notranslate">&lt;tr&gt;
+  &lt;td&gt;Hola, soy tu primera celda.&lt;/td&gt;
+  &lt;td&gt;Soy tu segunda celda.&lt;/td&gt;
+  &lt;td&gt;Soy tu tercera celda.&lt;/td&gt;
+  &lt;td&gt;Soy tu cuarta celda.&lt;/td&gt;
+&lt;/tr&gt;</pre>
+ </li>
+ <li>Ahora que has hecho una fila, intenta hacer una o dos más: cada fila debe estar delimitada por un elemento <code>&lt;tr&gt;</code> adicional, con cada celda contenida en un <code>&lt;td&gt;</code>.</li>
+</ol>
+
+<p>Esto debería dar como resultado una tabla similar a la siguiente:</p>
+
+<table>
+ <tbody>
+  <tr>
+   <td>Hola, soy tu primera celda.</td>
+   <td>Soy tu segunda celda.</td>
+   <td>Soy tu tercera celda.</td>
+   <td>Soy tu cuarta celda.</td>
+  </tr>
+  <tr>
+   <td>Segunda fila, primera celda.</td>
+   <td>Celda 2.</td>
+   <td>Celda 3.</td>
+   <td>Celda 4.</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: También puedes encontrar esto en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/simple-table.html">simple-table.html</a> (consúltalo <a href="http://mdn.github.io/learning-area/html/tables/basic/simple-table.html">en vivo</a>).</p>
+</div>
+
+<h2 id="Añadir_encabezados_con_elementos_&lt;th>">Añadir encabezados con elementos &lt;th&gt;</h2>
+
+<p>Ahora nos vamos a centrar en los encabezados de tabla: celdas especiales que van al comienzo de una fila o columna y definen el tipo de datos que contiene esa fila o columna (por ejemplo, observa las celdas «Propietario» y «Edad» en el primer ejemplo que se muestra en este artículo). Para ilustrar por qué son útiles, echa un vistazo al ejemplo de tabla siguiente. En primer lugar, el código fuente:</p>
+
+<pre class="brush: html notranslate">&lt;table&gt;
+  &lt;tr&gt;
+    &lt;td&gt;&amp;nbsp;&lt;/td&gt;
+    &lt;td&gt;Knocky&lt;/td&gt;
+    &lt;td&gt;Flor&lt;/td&gt;
+    &lt;td&gt;Ella&lt;/td&gt;
+    &lt;td&gt;Juan&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Raza&lt;/td&gt;
+    &lt;td&gt;Jack Russell&lt;/td&gt;
+    &lt;td&gt;Caniche&lt;/td&gt;
+    &lt;td&gt;Perro callejero&lt;/td&gt;
+    &lt;td&gt;Cocker Spaniel&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Edad&lt;/td&gt;
+    &lt;td&gt;16&lt;/td&gt;
+    &lt;td&gt;9&lt;/td&gt;
+    &lt;td&gt;10&lt;/td&gt;
+    &lt;td&gt;5&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Propietario&lt;/td&gt;
+    &lt;td&gt;Suegra&lt;/td&gt;
+    &lt;td&gt;Yo&lt;/td&gt;
+    &lt;td&gt;Yo&lt;/td&gt;
+    &lt;td&gt;Cuñada&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Hábitos alimentarios&lt;/td&gt;
+    &lt;td&gt;Come las sobras de todos&lt;/td&gt;
+
+&lt;td&gt;Mordisquea la comida&lt;/td&gt;
+    &lt;td&gt;Come en abundancia&lt;/td&gt;
+
+&lt;td&gt;Come hasta que revienta&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;</pre>
+
+<p>Ahora observa la tabla representada:</p>
+
+<table>
+ <tbody>
+  <tr>
+   <td></td>
+   <td>Knocky</td>
+   <td>Flor</td>
+   <td>Ella</td>
+   <td>Juan</td>
+  </tr>
+  <tr>
+   <td>Raza</td>
+   <td>Jack Russell</td>
+   <td>Caniche</td>
+   <td>Perro callejero</td>
+   <td>Cocker Spaniel</td>
+  </tr>
+  <tr>
+   <td>Edad</td>
+   <td>16</td>
+   <td>9</td>
+   <td>10</td>
+   <td>5</td>
+  </tr>
+  <tr>
+   <td>Propietario</td>
+   <td>Suegra</td>
+   <td>Yo</td>
+   <td>Yo</td>
+   <td>Cuñada</td>
+  </tr>
+  <tr>
+   <td>Hábitos alimentarios</td>
+   <td>Come las sobras de todos</td>
+   <td>Mordisquea la comida</td>
+   <td>Come en abundancia</td>
+   <td>Come hasta que revienta</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>El problema aquí es que, si bien puedes distinguir lo que sucede, no es tan fácil cruzar datos de referencia. Sería mucho mejor si los encabezados de las columnas y las filas se destacasen de alguna manera.</p>
+
+<h3 id="Aprendizaje_activo_encabezados_de_tabla">Aprendizaje activo: encabezados de tabla</h3>
+
+<p>Intentemos mejorar esta tabla.</p>
+
+<ol>
+ <li>Primero, haz una copia local de nuestros archivos <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/dogs-table.html">dogs-table.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">minimal-table.css</a> en un directorio nuevo de tu ordenador. El HTML contiene el mismo ejemplo sobre perros que viste arriba.</li>
+ <li>Para reconocer los encabezados de la tabla como encabezados, tanto visual como semánticamente, puedes usar el elemento <strong><code><a href="/en-US/docs/Web/HTML/Element/th">&lt;th&gt;</a></code></strong> ('th' significa 'table header', <em>encabezado de tabla</em>). Funciona exactamente igual que un <code>&lt;td&gt;</code>, excepto que denota un encabezado, no una celda normal. Entra en el código HTML, y cambiar todos los elementos <code>&lt;td&gt;</code> que delimitan los encabezados de tabla por elementos <code>&lt;th&gt;</code>.</li>
+ <li>Guarda tu HTML y cárgalo en un navegador. Los encabezados deberían verse como tal.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar nuestro ejemplo terminado en <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/dogs-table-fixed.html">dogs-table-fixed.html</a> en GitHub (<a href="http://mdn.github.io/learning-area/html/tables/basic/dogs-table-fixed.html">o consultarlo en vivo</a>).</p>
+</div>
+
+<h3 id="¿Por_qué_son_útiles_los_encabezados">¿Por qué son útiles los encabezados?</h3>
+
+<p>Ya hemos respondido parcialmente a esta pregunta: es más fácil encontrar los datos que buscas cuando los encabezados se destacan con claridad, y el diseño suele presentar un aspecto mejor.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Los encabezados de las tablas vienen con un estilo predeterminado: están en negrita y centrados (incluso si no añades tu estilo propio a la tabla) para que destaquen.</p>
+</div>
+
+<p>Los encabezados de tabla también presentan otra ventaja: junto con el atributo de <code>scope</code> (que veremos en el próximo artículo), mejoran la accesibilidad de las tablas porque asocian cada encabezado con todos los datos de la misma fila o columna. Así que los lectores de pantalla pueden leer una fila o columna de datos a la vez, lo cual es bastante útil.</p>
+
+<h2 id="Celdas_que_abarcan_varias_filas_y_columnas">Celdas que abarcan varias filas y columnas</h2>
+
+<p>A veces queremos que las celdas abarquen varias filas o columnas. Toma el ejemplo siguiente, que muestra los nombres de algunos animales comunes. En algunos casos, queremos mostrar los nombres de los machos y las hembras junto al nombre del animal. A veces no lo queremos, y en tales casos queremos que el nombre del animal abarque toda la tabla.</p>
+
+<p>El marcado inicial se ve así:</p>
+
+<pre class="brush: html notranslate">&lt;table&gt;
+  &lt;tr&gt;
+    &lt;th&gt;Animales&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;th&gt;Hipopótamo&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;th&gt;Caballo&lt;/th&gt;
+    &lt;td&gt;Yegua&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Semental&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+
+&lt;th&gt;Cocodrilo&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+
+&lt;th&gt;Pollo&lt;/th&gt;
+
+&lt;td&gt;Gallina&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Gallo&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;</pre>
+
+<p>Pero la salida no nos da exactamente lo que queremos:</p>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Animales</th>
+  </tr>
+  <tr>
+   <th>Hipopótamo</th>
+  </tr>
+  <tr>
+   <th>Caballo</th>
+   <td>Yegua</td>
+  </tr>
+  <tr>
+   <td>Semental</td>
+  </tr>
+  <tr>
+   <th>Cocodrilo</th>
+  </tr>
+  <tr>
+   <th>Pollo</th>
+   <td>Gallina</td>
+  </tr>
+  <tr>
+   <td>Gallo</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Necesitamos una forma de hacer que «Animales», «Hipopótamo» y «Cocodrilo» se extiendan dos columnas más allá, y «Caballo» y «Pollo» se extiendan dos filas más abajo. Por fortuna, los encabezados de tabla y las celdas tienen los atributos <code>colspan</code> y <code>rowspan</code>, que nos permiten hacer exactamente esas cosas. Ambos aceptan un valor numérico sin unidades, que es igual al número de filas o columnas que desea abarcar. Por ejemplo, <code>colspan="2"</code> extiende una celda dos columnas más allá.</p>
+
+<p>Usemos <code>colspan</code> y <code>rowspan</code> para mejorar esta tabla.</p>
+
+<ol>
+ <li>Primero, haz una copia local de nuestros archivos <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/animals-table.html">animals-table.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">minimal-table.css</a> en un directorio nuevo de tu ordenador. El HTML contiene el mismo ejemplo sobre perros que viste arriba.</li>
+ <li>Luego, usa <code>colspan</code> para extender las celdas «Animales», «Hipopótamo» y «Cocodrilo» dos columnas más allá.</li>
+ <li>Por último, usa <code>rowspan</code> para extender las celdas de «Caballo» y «Pollo» dos filas más abajo.</li>
+ <li>Guarda tu código y ábrelo en un navegador para ver la mejora.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar nuestro ejemplo terminado en <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/animals-table-fixed.html">animals-table-fixed.html</a> en GitHub (<a href="http://mdn.github.io/learning-area/html/tables/basic/animals-table-fixed.html">o consultarlo en vivo</a>).</p>
+</div>
+
+<table id="tabular" style="background-color: white;">
+</table>
+
+<h2 id="Proporcionar_un_estilo_común_a_las_columnas.">Proporcionar un estilo común a las columnas.</h2>
+
+<p>Hay una última característica de la que queremos hablar en este artículo antes de continuar. El HTML tiene un método para definir información de estilo para una columna completa de datos en un solo lugar: los elementos <strong><code><a href="/es/docs/Web/HTML/Elemento/col">&lt;col&gt;</a></code></strong> y <strong><code><a href="/es/docs/Web/HTML/Elemento/colgroup">&lt;colgroup&gt;</a></code></strong>. Estos atributos existen porque especificar el estilo de las columnas puede resultar enojoso e ineficiente; en general hay que especificar la información de estilo en <em>cada</em> <code>&lt;td&gt;</code> o <code>&lt;th&gt;</code> de la columna, o utilizar un selector complejo como {{cssxref(":nth-child()")}}.</p>
+
+<p>Tomemos el ejemplo sencillo siguiente:</p>
+
+<pre class="brush: html notranslate">&lt;table&gt;
+  &lt;tr&gt;
+
+&lt;th&gt;Dato 1&lt;/th&gt;
+    &lt;th style="background-color: yellow"&gt;Dato 2&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Calcuta&lt;/td&gt;
+    &lt;td style="background-color: yellow"&gt;Pizza&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Robots&lt;/td&gt;
+    &lt;td style="background-color: yellow"&gt;Jazz&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;</pre>
+
+<p>Esto nos da el resultado siguiente:</p>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Dato 1</th>
+   <th style="background-color: yellow;">Dato 2</th>
+  </tr>
+  <tr>
+   <td>Calcuta</td>
+   <td style="background-color: yellow;">Naranja</td>
+  </tr>
+  <tr>
+   <td>Robots</td>
+   <td style="background-color: yellow;">Jazz</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Esto no es ideal, porque hay que repetir la información de estilo en las tres celdas de la columna (en un proyecto real probablemente habría definida una clase <code>class</code> en las tres celdas y el estilo se especificaría en una hoja de estilo por separado). En vez de hacer esto, podemos especificar la información una sola vez, con un elemento <code>&lt;col&gt;</code>. Los elementos <code>&lt;col&gt;</code> se especifican dentro de un contenedor <code>&lt;colgroup&gt;</code> justo debajo de la etiqueta de apertura <code>&lt;table&gt;</code>. Podríamos crear el mismo efecto que vemos arriba especificando nuestra tabla de la manera siguiente:</p>
+
+<pre class="brush: html notranslate">&lt;table&gt;
+  &lt;colgroup&gt;
+    &lt;col&gt;
+    &lt;col style="background-color: yellow"&gt;
+  &lt;/colgroup&gt;
+  &lt;tr&gt;
+
+&lt;th&gt;Dato 1&lt;/th&gt;
+
+&lt;th&gt;Dato 2&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Calcuta&lt;/td&gt;
+    &lt;td&gt;Pizza&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Robots&lt;/td&gt;
+    &lt;td&gt;Jazz&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;</pre>
+
+<p>En efecto, definimos dos tipos de «columnas de estilo», una que especifica la información para la aplicación de estilo en cada columna. No aplicamos estilo a la primera columna, sino que aún tenemos que incluir un elemento <code>&lt;col&gt;</code> en blanco; de lo contrario, el estilo también se aplicaría a la primera columna.</p>
+
+<p>Si quisiéramos aplicar la información de estilo a ambas columnas, podríamos incluir un elemento <code>&lt;col&gt;</code> con un atributo <code>span</code>, como este:</p>
+
+<pre class="brush: html notranslate">&lt;colgroup&gt;
+  &lt;col style="background-color: yellow" span="2"&gt;
+&lt;/colgroup&gt;</pre>
+
+<p>Al igual que <code>colspan</code> y <code>rowspan</code>, <code>span</code> toma un valor numérico sin unidades que especifica el número de columnas a las que se desea aplicar el estilo.</p>
+
+<h3 id="Aprendizaje_activo_colgroup_y_col">Aprendizaje activo: colgroup y col</h3>
+
+<p>Ahora es el momento de intentarlo tú mismo.</p>
+
+<p>A continuación puedes ver el horario de una profesora de idiomas. El viernes tiene que enseñar holandés todo el día, pero también enseña alemán durante unas horas los martes y los jueves, y quiere resaltar las columnas que contienen los días que da clase.</p>
+
+<p>{{EmbedGHLiveSample("learning-area/html/tables/basic/timetable-fixed.html", '100%', 320)}}</p>
+
+<p>Recrea la tabla a partir de los pasos siguientes.</p>
+
+<ol>
+ <li>Primero, haz una copia local de nuestro archivo <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable.html">timetable.html</a> en un directorio nuevo de tu ordenador. El HTML contiene la misma tabla que viste arriba, menos la información de estilo de las columnas.</li>
+ <li>Añade un elemento <code>&lt;colgroup&gt;</code> en la parte superior de la tabla, justo debajo de la etiqueta <code>&lt;table&gt;</code>, en la que puedes añadir tus elementos <code>&lt;col&gt;</code> (consulta los pasos restantes a continuación).</li>
+ <li>Las dos primeras columnas deben dejarse sin estilo.</li>
+ <li>Añade un color de fondo a la tercera columna. El valor para tu atributo de <code>style</code> es <code>background-color:#97DB9A;</code></li>
+ <li>Establece un ancho distinto para la cuarta columna. El valor de tu atributo de <code>style</code> es <code>width: 42px;</code></li>
+ <li>Añade un color de fondo a la quinta columna. El valor para tu atributo de <code>style</code> es <code>background-color:#97DB9A;</code></li>
+ <li>Añade un color de fondo diferente más un borde a la sexta columna, para indicar que este es un día especial porque da clases de un idioma diferente. Los valores para tu atributo de <code>style</code> son <code>background-color:#DCC48E; border:4px solid #C1437A;</code></li>
+ <li>Los últimos dos días los tiene libres, así que no establezcas ningún color de fondo, pero sí un valor para el ancho; el valor para el atributo de <code>style</code> es <code>width: 42px;</code></li>
+</ol>
+
+<p>Mira cómo sigue en el ejemplo. Si te encallas o quieres verificar tu trabajo, puedes encontrar nuestra versión en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/timetable-fixed.html">timetable-fixed.html</a> (o también puedes consultarlo <a href="http://mdn.github.io/learning-area/html/tables/basic/timetable-fixed.html">en vivo</a>).</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Con esto casi hemos abarcado todos los conceptos básicos de las tablas HTML. En el próximo artículo, veremos algunas características un poco más avanzadas de las tablas y comenzaremos a pensar acerca de su accesibilidad para las personas con discapacidad visual.</p>
+
+<div>{{NextMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</div>
+
+<div>
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Tables/Basics">Conceptos básicos de las tablas en HTML</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Tables/Advanced">Funciones avanzadas de las tablas HTML y accesibilidad</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Tables/Structuring_planet_data">Estructuración de datos planetarios</a></li>
+</ul>
+</div>
diff --git a/files/es/learn/html/tables/index.html b/files/es/learn/html/tables/index.html
new file mode 100644
index 0000000000..39ef075b20
--- /dev/null
+++ b/files/es/learn/html/tables/index.html
@@ -0,0 +1,35 @@
+---
+title: Tablas HTML
+slug: Learn/HTML/Tables
+translation_of: Learn/HTML/Tables
+original_slug: Learn/HTML/Tablas
+---
+<div>{{LearnSidebar}}</div>
+
+<p class="summary">Una tarea muy común en HTML es la estructuración de datos, y para esto hay múltiples elementos y atributos. Esto unido a un poco de CSS, hace que en HTML sea sencillo mostrar tablas con información sobre tu horario escolar, los horarios de una piscina local o las estadisticas de tu equipo de dinosaurios o fútbol preferido. Este módulo te guiará en todo lo que necesitas saber sobre la estructuración tabular de datos en HTML.</p>
+
+<h2 id="Requisitos_previos">Requisitos previos</h2>
+
+<p>Antes de comenzar este módulo, deberías de saber las cosas básicas de HTML — ver <a href="https://developer.mozilla.org/es/docs/Learn/HTML/Introduccion_a_HTML">Introducción a HTML</a>.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si estas trabjando en un ordenador/tableta/otro dispositivo en el que no puedes crear tus propios archivos, puedes probar la mayoría de ejemplos online en webs como <a href="http://jsbin.com/">JSBin</a> o <a href="https://thimble.mozilla.org/">Thimble</a>.</p>
+</div>
+
+<h2 id="Guías">Guías</h2>
+
+<p>Este módulo contiene los siguientes artículos:</p>
+
+<dl>
+ <dt><a href="/en-US/docs/Learn/HTML/Tables/Basics">Comenzando con tablas HTML</a></dt>
+ <dd>Este artículo te introduce en las tablas HTML , cubriendo las cosas más basicas como las líneas y las celdas, encabezados, crear celdas de multiples líneas y columnas, y como agrupar todas las celdas en una columna con fines estilisticos.</dd>
+ <dt><a href="/en-US/docs/Learn/HTML/Tables/Advanced">Características avanzadas y accesibilidad en tablas HTML</a></dt>
+ <dd>En el segundo artículo de este módulo, veremos algunas características avanzadas de las tablas HTML — como subtítulos/resumenes y agrupar líneas en la cabeza, cuerpo y pie de la tabla — además de realizar tablas accesibles para aquellos usuarios con problemas de visión.</dd>
+</dl>
+
+<h2 id="Evaluación">Evaluación</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Learn/HTML/Tables/Structuring_planet_data">Estructurar datos planetarios</a></dt>
+ <dd>En nuestra evaluación, te proporcionamos datos sobre los planetas de nuestro sistemas solar y tu los estructurarás en una tabla HTML.</dd>
+</dl>
diff --git a/files/es/learn/html/tables/structuring_planet_data/index.html b/files/es/learn/html/tables/structuring_planet_data/index.html
new file mode 100644
index 0000000000..8d8e219fa9
--- /dev/null
+++ b/files/es/learn/html/tables/structuring_planet_data/index.html
@@ -0,0 +1,73 @@
+---
+title: 'Evaluación: Estructurando datos planetarios'
+slug: Learn/HTML/Tables/Structuring_planet_data
+translation_of: Learn/HTML/Tables/Structuring_planet_data
+original_slug: Learn/HTML/Tablas/Structuring_planet_data
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</div>
+
+<p class="summary">En nuestra evaluación te proporcionamos datos sobre los planetas de nuestro sistema solar y tu los estructurarás en una tabla HTML.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Requisitos previos:</th>
+   <td>Antes de comenzar esta evaluación deberías de haber leído los artículos de este módulo.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprobar si has comprendido las tablas HTML y las características asociadas.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Punto_de_incio">Punto de incio</h2>
+
+<p>Para comenzar esta evaluación, crea una copia local de <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/blank-template.html">blank-template.html</a>, <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/minimal-table.css">minimal-table.css</a>, y <a href="https://github.com/mdn/learning-area/blob/master/html/tables/assessment-start/planets-data.txt">planets-data.txt</a> en una nueva carpeta de tu ordenador.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Como alternativa, puedes usar una web como <a class="external external-icon" href="https://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para realizar tu evaluación. Puedes pegar el HTML, CSS y JavaScript en uno de estos editores online. Si el editor online que estas usando no tiene paneles separados para JavaScript/CSS, sientete libre de ponerlos en línea dentro del mismo HTML mediante el uso de <code>&lt;script&gt;</code>/<code>&lt;style&gt;</code>.</p>
+</div>
+
+<h2 id="Resumen_del_proyecto">Resumen del proyecto</h2>
+
+<p>Estás trabajando en la escuela; tus estudiantes están estudiando los planetas de nuestro sistema solar y quieres proporcionarles una forma sencilla de seguir los datos para buscar hechos sobre los planetas. Una tabla HTML sería ideal — tienes que coger los datos que tienes disponibles y convertirlos en una tabla siguiendo los pasos de abajo.</p>
+
+<p>La tabla finalizada debería de verse así:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14609/assessment-table.png" style="display: block; margin: 0 auto;"></p>
+
+<p>También puedes ver el ejemplo <a href="https://mdn.github.io/learning-area/html/tables/assessment-finished/planets-data.html">aquí</a> (no mires el código fuente — ¡no hagas trampas!)</p>
+
+<ul>
+</ul>
+
+<h2 id="Pasos_para_completarlo">Pasos para completarlo</h2>
+
+<p>Los siguientes pasos describen lo que necesitas para completar el ejemplo de la tabla. Todos los datos que necesitarás están en el archivo <code>planets-data.txt</code>.<font face="consolas, Liberation Mono, courier, monospace"> </font>Si tienes problemas para visualizar los datos, mira el ejemplo de arriba o intentalo dibujando un diagrama.</p>
+
+<ol>
+ <li>Abre tu copia de <code>blank-template.html</code>, y comienza la tabla dándole un contenedor exterior, una cabecera y un cuerpo. No necesitas un pie de tabla en este ejemplo.</li>
+ <li>Añade el subtítulo proporcionado a tu tabla.</li>
+ <li>Añade una línea a la cabecera que contenga todos los encabezados de columna.</li>
+ <li>Crea todas las líneas con su contenido, asegurandote marcar como cabecera aquellas celdas que lo sean.</li>
+ <li>Asegurate de que el contenido esta insertado en las celdas correctas — en los datos del .txt, cada línea del planeta esta al lado de su planeta asociado.</li>
+ <li>Añade atributos para que las líneas y columnas del encabezado no se puedan confundir con las líneas, columnas o grupos de líneas a las que encabezan.</li>
+ <li>Añade un borde negro alrededor de la columna que contiene los nombres de los planetas y sus encabezados.</li>
+</ol>
+
+<h2 id="Pistas_y_consejos">Pistas y consejos</h2>
+
+<ul>
+ <li>La primera celda de la línea de enbezado tiene que estar en blanco y unir dos columnas.</li>
+ <li>Los encabezados de la filas agrupadas (p. ej. <em>Jovian planets</em>) que están a la izquierda de los encabezados de nombres de planetas (p. ej. <em>Saturn</em>) son algo complicados de resolver — asegurate de que cada uno agrupa el número correcto de líneas y columnas</li>
+ <li>Una manera de asociar encabezados con sus líneas/columnas es mucha más fácil que la otra.</li>
+</ul>
+
+<h2 id="Evaluación">Evaluación</h2>
+
+<p>Si estas siguiendo esta evaluación como parte de un curso organizado, deberías de ser capaz de entregar tu trabajo a tu profesor(a)/mentor para ver la puntuación. Si estas aprendiendo por tu cuenta, puedes obtener la guía de puntuación preguntando en <a href="https://discourse.mozilla-community.org/t/learning-web-development-marking-guides-and-questions/16294">Learning Area Discourse thread</a> o en el canal IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Intenta hacer el ejercicio primero  — ¡haciendo trampas no aprenderás nada!</p>
+
+<p>{{PreviousMenu("Learn/HTML/Tables/Advanced", "Learn/HTML/Tables")}}</p>
diff --git a/files/es/learn/javascript/building_blocks/bucle_codigo/index.html b/files/es/learn/javascript/building_blocks/bucle_codigo/index.html
deleted file mode 100644
index e26509afc5..0000000000
--- a/files/es/learn/javascript/building_blocks/bucle_codigo/index.html
+++ /dev/null
@@ -1,923 +0,0 @@
----
-title: Bucles
-slug: Learn/JavaScript/Building_blocks/Bucle_codigo
-translation_of: Learn/JavaScript/Building_blocks/Looping_code
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/conditionals","Learn/JavaScript/Building_blocks/Functions", "Learn/JavaScript/Building_blocks")}}</div>
-
-<p class="summary">Los lenguajes de programación son muy útiles para completar rápidamente tareas repetitivas, desde múltimples cálculos básicos hasta cualquier otra situación en donde tengas un montón de elementos de trabajo similares que completar. Aquí vamos a ver las estructuras de bucles disponibles en JavaScript que pueden manejar tales necesidades.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>Conocimientos básicos de computación, entendimiento básico de HTML y CSS, <a href="/en-US/docs/Learn/JavaScript/First_steps">JavaScript first steps</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Entender cómo usar bucles en JavaScript.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Mantente_en_el_Bucle">Mantente en el Bucle</h2>
-
-<p>Bucles, bucles, bucles. Además de ser conocidos como un cereal de desayuno popular, montañas rusas y producción músical, también son un concepto muy importante en programación. Los bucles de programación están relacionados con todo lo referente a hacer una misma cosa una y otra vez — que se denomina como <strong>iteración </strong>en el idioma de programación.</p>
-
-<p>Consideremos el caso de un agricultor que se asegura de tener suficiente comida para alimentar a su familia durante la semana. Podría usar el siguiente bucle para lograr esto:</p>
-
-<p><br>
- <img alt="" src="https://mdn.mozillademos.org/files/13755/loop_js-02-farm.png" style="display: block; margin: 0 auto;"></p>
-
-<p>Un bucle cuenta con una o más de las siguientes características:</p>
-
-<ul>
- <li> Un <strong>contador,</strong> que se inicia con un determinado valor — este será el valor del punto inicial del bucle ("Inicio: No tengo comida",mirar arriba).</li>
- <li>Una <strong>condicion de salida</strong>, que será el criterio bajo el cual, el bucle se romperá — normalmente un contador que alcanza un determinado valor. Aquí se ilustra como "¿Tengo suficiente comida?", arriba. Digamos que son necesarias 10 porciones de comida para alimentar a su familia.</li>
- <li>Un <strong>iterador, </strong>que generalmente incrementa el valor del contador en una cantidad pequeña a cada paso del bucle, hasta que alcanza la condición de salida. No hemos ilustrado esto de manera explícita arriba, pero podríamos pensar que el granjero está recolectando 2 porciones de comida cada hora. Después de cada hora, la cantidad de comida recolectada se incrementa en dos, y comprueba si tiene suficiente comida. Si alcanza los 10 puntos (la condición de salida), puede parar la recolecta e irse para casa.</li>
-</ul>
-
-<p>En {{glossary("pseudocódigo")}},esto se vería como sigue:</p>
-
-<pre class="notranslate">bucle(comida = 0; comidaNecesaria = 10) {
-  if (comida = comidaNecesaria) {
-    salida bucle;
-    // Tenemos suficiente comida; vamonos para casa
-  } else {
-    comida += 2; // Pasar una hora recogiendo 2 más de comida
-    // Comenzar el bucle de nuevo
-  }
-}</pre>
-
-<p>Así que la cantidad necesaria de comida se establece en 10, y la cantidad incial del granjero en 0. En cada iteración del bucle comprobamos si la cantidad de comida del granjero es mayor o igual a la cantidad que necesita. Si lo es, podemos salir del bucle. Si no, el granjero se pasará una hora más recogiendo dos porciones de comida, y el bucle arrancará de nuevo.</p>
-
-<h3 id="¿Por_qué_molestarse">¿Por qué molestarse?</h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">En este punto, probablemente entiendas los conceptos de alto nivel que hay detrás de los bucles,</span></span> pero probablemente estés pensando "OK, fantástico, pero ¿cómo me ayuda esto a escribir un mejor codigo JavaScript?". Como dijimos antes, <strong>los bucles tienen que ver con hacer lo mismo una y otra vez</strong>, lo cual es bueno para <strong>completar rápidamente tareas repetitivas</strong>.</p>
-
-<p>Muchas veces, el código será ligeramente diferente en cada iteracción sucesiva del bucle, lo que significa que puedes completar una carga completa de tareas que son similares, pero ligeramente diferentes — si tienes muchos calculos diferentes que hacer, quieres hacer cada uno de ellos, ¡no el mismo una y otra vez!</p>
-
-<p>Vamos a ver un ejemplo para ilustrar perfectamente por qué los bucles son tan útiles. Digamos que queremos dibujar 100 círculos aleatorios en un elemento {{htmlelement("canvas")}} (presiona el botón <em>Update</em> para ejecutar el ejemplo una y otra vez y ver diferentes configuraciones aleatorias):</p>
-
-<div class="hidden">
-<h6 id="Hidden_code">Hidden code</h6>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Random canvas circles&lt;/title&gt;
-    &lt;style&gt;
-      html {
-        width: 100%;
-        height: inherit;
-        background: #ddd;
-      }
-
-      canvas {
-        display: block;
-      }
-
-      body {
-        margin: 0;
-      }
-
-      button {
-        position: absolute;
-        top: 5px;
-        left: 5px;
-      }
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-
-  &lt;button&gt;Update&lt;/button&gt;
-
-  &lt;canvas&gt;&lt;/canvas&gt;
-
-
-    &lt;script&gt;
-    var btn = document.querySelector('button');
-    var canvas = document.querySelector('canvas');
-    var ctx = canvas.getContext('2d');
-
-    var WIDTH = document.documentElement.clientWidth;
-    var HEIGHT = document.documentElement.clientHeight;
-
-    canvas.width = WIDTH;
-    canvas.height = HEIGHT;
-
-    function random(number) {
-      return Math.floor(Math.random()*number);
-    }
-
-    function draw() {
-      ctx.clearRect(0,0,WIDTH,HEIGHT);
-      for (var i = 0; i &lt; 100; i++) {
-        ctx.beginPath();
-        ctx.fillStyle = 'rgba(255,0,0,0.5)';
-        ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI);
-        ctx.fill();
-      }
-    }
-
-    btn.addEventListener('click',draw);
-
-    &lt;/script&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Hidden_code', '100%', 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<p>No tienes que entender todo el código por ahora, pero vamos a echar un vistazo a la parte de código que dibuja los 100 círculos:</p>
-
-<pre class="brush: js notranslate">for (var i = 0; i &lt; 100; i++) {
-  ctx.beginPath();
-  ctx.fillStyle = 'rgba(255,0,0,0.5)';
-  ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI);
-  ctx.fill();
-}</pre>
-
-<p>Debes quedarte con la idea básica.  — utilizamos un bucle para ejecutar 100 iteracciones de este código, cada una de las cuales dibuja un círculo en una posición aleatoria de la página. La cantidad de código necesario sería el mismo si dibujáramos 100, 1000, o 10,000 círculos. Solo necesitamos cambiar un número.</p>
-
-<p>Si no usáramos un bucle aquí, tendríamos que repetir el siguiente código por cada círculo que quisiéramos dibujar:</p>
-
-<pre class="brush: js notranslate">ctx.beginPath();
-ctx.fillStyle = 'rgba(255,0,0,0.5)';
-ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI);
-ctx.fill();</pre>
-
-<p>Esto sería muy aburrido y difícil de mantener de forma rápida. Los bucles son realmente lo mejor.</p>
-
-<h2 id="El_bucle_estándar_for">El bucle estándar <code>for</code></h2>
-
-<p>Exploremos algunos constructores de bucles específicos. El primero, que usarás la mayoría de las veces, es el bucle <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/for">for</a> - este tiene la siguiente sintaxis:</p>
-
-<pre class="notranslate">for (inicializador; condición de salida; expresión final) {
-  // código a ejecutar
-}</pre>
-
-<p>Aquí tenemos:</p>
-
-<ol>
- <li>La palabra reservada <code>for</code>, seguida por algunos paréntesis.</li>
- <li>Dentro de los paréntesis tenemos tres ítems, separados por punto y coma (;):
-  <ol>
-   <li>Un <strong>inicializador</strong> - Este es usualmente una variable con un número asignado, que aumenta el número de veces que el bucle ha sijo ejecutado. También se le llama <strong>contador</strong> o <strong>variable de conteo</strong>.</li>
-   <li>Una <strong>condición de salida</strong> - como se mencionó previamente, ésta define cuando el bucle debería detenerse. Generalmente es una expresión que contiene un operador de comparación, una prueba para verificar ue la condición de término o salida ha sido cumplida.</li>
-   <li>Una <strong>expresión final</strong> - que es siempre evaluada o ejecutada cada vez que el bucle ha completado una iteración. Usualmente sirve para modificar al contador (incrementando su valor o algunas veces disminuyendolo), para aproximarse a la condición de salida.</li>
-  </ol>
- </li>
- <li>Algunos corchetes curvos que contienen un bloque de código - este código se ejecutará cada vez que se repita el bucle.</li>
-</ol>
-
-<p>Observa un ejemplo real para poder entender esto más claramente.</p>
-
-<pre class="brush: js notranslate">var cats = ['Bill', 'Jeff', 'Pete', 'Biggles', 'Jasmin'];
-var info = 'My cats are called ';
-var para = document.querySelector('p');
-
-for (var i = 0; i &lt; cats.length; i++) {
-  info += cats[i] + ', ';
-}
-
-para.textContent = info;</pre>
-
-<p>Esto nos da el siguiente resultado:</p>
-
-<div class="hidden">
-<h6 id="Hidden_code_2">Hidden code 2</h6>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Basic for loop example&lt;/title&gt;
-    &lt;style&gt;
-
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-
-  &lt;p&gt;&lt;/p&gt;
-
-
-    &lt;script&gt;
-    var cats = ['Bill', 'Jeff', 'Pete', 'Biggles', 'Jasmin'];
-    var info = 'My cats are called ';
-    var para = document.querySelector('p');
-
-    for (var i = 0; i &lt; cats.length; i++) {
-      info += cats[i] + ', ';
-    }
-
-    para.textContent = info;
-
-    &lt;/script&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Hidden_code_2', '100%', 60, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes encontrar este <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/basic-for.html">ejemplo de código en GitHub</a> también (además puedes <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/basic-for.html">verlo ejecutar en vivo</a>).</p>
-</div>
-
-<p>Esto muestra un bucle siendo usado para iterar sobre los elementos de un arreglo (matriz), y hacer algo con cada uno de ellos - un patrón muy común en JavaScript. Aquí:</p>
-
-<ol>
- <li>El iterador, <code>i</code>, inicia en <code>0</code> (<code>var i = 0</code>).</li>
- <li>Se le ha dicho que debe ejecutarse hasta que no sea menor que la longitud del arreglo <code>cats</code>. Esto es importante  - la condición de salida muestra la condicion bajo la cual el bucle seguirá iterando. Así, en este caso, mientras <code>i &lt; cats.length</code> sea verdadero, el bucle seguirá ejecutándose.</li>
- <li>Dentro del bucle, concatenamos el elemento del bucle actual (<code>cats[i]</code> es <code>cats[lo que sea i en ese momento]</code>) junto con una coma y un espacio, al final de la variable <code>info</code>. Así:
-  <ol>
-   <li>Durante la primera ejecución,  <code>i = 0</code>, así <code>cats[0] + ', '</code> se concatenará con la información ("Bill, ").</li>
-   <li>Durante la segunda ejecución, <code>i = 1</code>, así <code>cats[1] + ', '</code> agregará el siguiente nombre ("Jeff, ").</li>
-   <li>Y así sucesivamente. Después de cada vez que se ejecute el bucle, se incrementará en 1 el valod de i (<code>i++</code>), entonces el proceso comenzará de nuevo.</li>
-  </ol>
- </li>
- <li>Cuando <code>i</code> sea igual a <code>cats.length</code>, el bucle se detendrá, y el navegador se moverá al siguiente segmento de código bajo el bucle.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Hemos programado la condición de salidad como <code>i &lt; cats.length</code>, y no como <code>i &lt;= cats.length</code>, porque los computadores cuentan desde 0, no 1 - inicializamos la variable i en 0, para llegar a <code>i = 4</code> (el índice del último elemento del arreglo). <code>cats.length</code> responde 5, ya que existen 5 elementos en el arreglo, pero no queremos que i = 5, dado que respondería <code>undefined</code> para el último elemento (no existe un elemento en el arreglo con un índice 5). for the last item (there is no array item with an index of 5). Por ello, queremos llegar a 1 menos que <code>cats.length</code> (<code>i &lt;</code>), que no es lo mismo que <code>cats.length</code> (<code>i &lt;=</code>).</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Un error común con la condición de salida es utilizar el comparador "igual a" (<code>===</code>) en vez de "menor o igual a" (<code>&lt;=</code>). Si queremos que nuestro bucle se ejecute hasta que  <code>i = 5</code>, la condición de salida debería ser <code>i &lt;= cats.length</code>. Si la declaramos <code>i === cats.length</code>, el bucle no debería ejecutarse , porque <code>i</code> no es igual a <code>5</code> en la primera iteración del bucle, por lo que debería detenerse inmediatamente.</p>
-</div>
-
-<p>Un pequeño problema que se presenta es que la frase de salida final no está muy bien formada:</p>
-
-<blockquote>
-<p>My cats are called Bill, Jeff, Pete, Biggles, Jasmin,</p>
-</blockquote>
-
-<p>Idealmente querríamos cambiar la concatenacion al final de la última iteracion del bucle, así no tendríamos una coma en el final de la frase. Bueno, no hay problema - podemos insertar un condicional dentro de nuestro bucle para solucionar este caso especial:</p>
-
-<pre class="brush: js notranslate">for (var i = 0; i &lt; cats.length; i++) {
-  if (i === cats.length - 1) {
-    info += 'and ' + cats[i] + '.';
-  } else {
-    info += cats[i] + ', ';
-  }
-}</pre>
-
-<div class="note">
-<p><strong>Note</strong>: You can find this <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/basic-for-improved.html">example code on GitHub</a> too (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/basic-for-improved.html">see it running live</a>).</p>
-</div>
-
-<div class="warning">
-<p><strong>Importante</strong>: Con <code>for</code> - como con todos los bucles - debes estar seguro de que el inicializador es repetido hasta que eventualemtne alcance la condición de salida. Si no, el bucle seguirá repitiéndose indefinidamente, y puede que el navegador lo fuerce a detenerse o se interrumpa. Esto se denomina <strong>bucle infinito</strong>.</p>
-</div>
-
-<h2 id="Salir_de_un_bucle_con_break">Salir de un bucle con <code>break</code></h2>
-
-<p>Si deseas salir de un bucle antes de que se hayan completado todas las iteraciones, puedes usar la declaración <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/break">break</a>. Ya la vimos en el artículo previo cuando revisamos la declaración <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/switch">switch</a> - cuando un caso en una declaración <code>switch</code> coincide con la expresión de entrada, la declaración <code>break</code> inmediatamente sale de la declaración <code>switch</code> y avanza al código que se encuentra después.</p>
-
-<p>Ocurre lo mismo con los bucles - una declaración <code>break</code> saldrá inmediatamente del bucle y hará que el navegador siga con el código que sigue después.</p>
-
-<p>Digamos que queremos buscar a través de un arreglo de contactos y números telefónicos y retornar sólo el número que queríamos encontrar. primero, un simple HTML -  un {{htmlelement("input")}} de texto que nos permita ingresar un nombre para buscar, un elemento {{htmlelement("button")}} para enviar la búsqueda, y un elemento {{htmlelement("p")}} para mostrar el resultado:</p>
-
-<pre class="brush: html notranslate">&lt;label for="search"&gt;Search by contact name: &lt;/label&gt;
-&lt;input id="search" type="text"&gt;
-&lt;button&gt;Search&lt;/button&gt;
-
-&lt;p&gt;&lt;/p&gt;</pre>
-
-<p>Ahora en el JavaScript:</p>
-
-<pre class="brush: js notranslate">var contacts = ['Chris:2232322', 'Sarah:3453456', 'Bill:7654322', 'Mary:9998769', 'Dianne:9384975'];
-var para = document.querySelector('p');
-var input = document.querySelector('input');
-var btn = document.querySelector('button');
-
-btn.addEventListener('click', function() {
-  var searchName = input.value;
-  input.value = '';
-  input.focus();
-  for (var i = 0; i &lt; contacts.length; i++) {
-    var splitContact = contacts[i].split(':');
-    if (splitContact[0] === searchName) {
-      para.textContent = splitContact[0] + '\'s number is ' + splitContact[1] + '.';
-      break;
-    } else {
-      para.textContent = 'Contact not found.';
-    }
-  }
-});</pre>
-
-<div class="hidden">
-<h6 id="Hidden_code_3">Hidden code 3</h6>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Simple contact search example&lt;/title&gt;
-    &lt;style&gt;
-
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-
-  &lt;label for="search"&gt;Search by contact name: &lt;/label&gt;
-  &lt;input id="search" type="text"&gt;
-  &lt;button&gt;Search&lt;/button&gt;
-
-  &lt;p&gt;&lt;/p&gt;
-
-
-    &lt;script&gt;
-    var contacts = ['Chris:2232322', 'Sarah:3453456', 'Bill:7654322', 'Mary:9998769', 'Dianne:9384975'];
-    var para = document.querySelector('p');
-    var input = document.querySelector('input');
-    var btn = document.querySelector('button');
-
-    btn.addEventListener('click', function() {
-      var searchName = input.value;
-      input.value = '';
-      input.focus();
-      for (var i = 0; i &lt; contacts.length; i++) {
-        var splitContact = contacts[i].split(':');
-        if (splitContact[0] === searchName) {
-          para.textContent = splitContact[0] + '\'s number is ' + splitContact[1] + '.';
-          break;
-        } else {
-          para.textContent = 'Contact not found.';
-        }
-      }
-    });
-    &lt;/script&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Hidden_code_3', '100%', 100, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<ol>
- <li>First of all we have some variable definitions — we have an array of contact information, with each item being a string containing a name and phone number separated by a colon.</li>
- <li>Next, we attach an event listener to the button (<code>btn</code>), so that when it is pressed, some code is run to perform the search and return the results.</li>
- <li>We store the value entered into the text input in a variable called <code>searchName</code>, before then emptying the text input and focusing it again, ready for the next search.</li>
- <li>Now onto the interesting part, the for loop:
-  <ol>
-   <li>We start the counter at <code>0</code>, run the loop until the counter is no longer less than <code>contacts.length</code>, and increment <code>i</code> by 1 after each iteration of the loop.</li>
-   <li>Inside the loop we first split the current contact (<code>contacts[i]</code>) at the colon character, and store the resulting two values in an array called <code>splitContact</code>.</li>
-   <li>We then use a conditional statement to test whether <code>splitContact[0]</code> (the contact's name) is equal to the inputted <code>searchName</code>. If it is, we enter a string into the paragraph to report what the contact's number is, and use <code>break</code> to end the loop.</li>
-  </ol>
- </li>
- <li>If the contact name does not match the entered search, the paragraph text is set to "Contact not found.", and the loop continues iterating.</li>
-</ol>
-
-<div class="note">
-<p>Note: You can view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/contact-search.html">full source code on GitHub</a> too (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/contact-search.html">see it running live</a>).</p>
-</div>
-
-<h2 id="Skipping_iterations_with_continue">Skipping iterations with continue</h2>
-
-<p>The <a href="/en-US/docs/Web/JavaScript/Reference/Statements/continue">continue</a> statement works in a similar manner to <code>break</code>, but instead of breaking out of the loop entirely, it skips to the next iteration of the loop. Let's look at another example that takes a number as an input, and returns only the numbers that are squares of integers (whole numbers).</p>
-
-<p>The HTML is basically the same as the last example — a simple text input, and a paragraph for output. The JavaScript is mostly the same too, although the loop itself is a bit different:</p>
-
-<pre class="brush: js notranslate">var num = input.value;
-
-for (var i = 1; i &lt;= num; i++) {
-  var sqRoot = Math.sqrt(i);
-  if (Math.floor(sqRoot) !== sqRoot) {
-    continue;
-  }
-
-  para.textContent += i + ' ';
-}</pre>
-
-<p>Here's the output:</p>
-
-<div class="hidden">
-<h6 id="Hidden_code_4">Hidden code 4</h6>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Integer squares generator&lt;/title&gt;
-    &lt;style&gt;
-
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-
-  &lt;label for="number"&gt;Enter number: &lt;/label&gt;
-  &lt;input id="number" type="text"&gt;
-  &lt;button&gt;Generate integer squares&lt;/button&gt;
-
-  &lt;p&gt;Output: &lt;/p&gt;
-
-
-    &lt;script&gt;
-    var para = document.querySelector('p');
-    var input = document.querySelector('input');
-    var btn = document.querySelector('button');
-
-    btn.addEventListener('click', function() {
-      para.textContent = 'Output: ';
-      var num = input.value;
-      input.value = '';
-      input.focus();
-      for (var i = 1; i &lt;= num; i++) {
-        var sqRoot = Math.sqrt(i);
-        if (Math.floor(sqRoot) !== sqRoot) {
-          continue;
-        }
-
-        para.textContent += i + ' ';
-      }
-    });
-    &lt;/script&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Hidden_code_4', '100%', 100, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<ol>
- <li>In this case, the input should be a number (<code>num</code>). The <code>for</code> loop is given a counter starting at 1 (as we are not interested in 0 in this case), an exit condition that says the loop will stop when the counter becomes bigger than the input <code>num</code>, and an iterator that adds 1 to the counter each time.</li>
- <li>Inside the loop, we find the square root of each number using <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt">Math.sqrt(i)</a>, then check whether the square root is an integer by testing whether it is the same as itself when it has been rounded down to the nearest integer (this is what <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor">Math.floor()</a> does to the number it is passed).</li>
- <li>If the square root and the rounded down square root do not equal one another (<code>!==</code>), it means that the square root is not an integer, so we are not interested in it. In such a case, we use the <code>continue</code> statement to skip on to the next loop iteration without recording the number anywhere.</li>
- <li>If the square root IS an integer, we skip past the if block entirely so the <code>continue</code> statement is not executed; instead, we concatenate the current <code>i</code> value plus a space on to the end of the paragraph content.</li>
-</ol>
-
-<div class="note">
-<p><strong>Note</strong>: You can view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/integer-squares.html">full source code on GitHub</a> too (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/integer-squares.html">see it running live</a>).</p>
-</div>
-
-<h2 id="while_and_do_..._while">while and do ... while</h2>
-
-<p><code>for</code> is not the only type of loop available in JavaScript. There are actually many others and, while you don't need to understand all of these now, it is worth having a look at the structure of a couple of others so that you can recognize the same features at work in a slightly different way.</p>
-
-<p>First, let's have a look at the <a href="/en-US/docs/Web/JavaScript/Reference/Statements/while">while</a> loop. This loop's syntax looks like so:</p>
-
-<pre class="notranslate">initializer
-while (exit-condition) {
-  // code to run
-
-  final-expression
-}</pre>
-
-<p>This works in a very similar way to the for loop, except that the initializer variable is set before the loop, and the final-expression is included inside the loop after the code to run — rather than these two items being included inside the parentheses. The exit-condition is included inside the parentheses, which are preceded by the <code>while</code> keyword rather than <code>for</code>.</p>
-
-<p>The same three items are still present, and they are still defined in the same order as they are in the for loop — this makes sense, as you still have to have an initializer defined before you can check whether it has reached the exit-condition; the final-condition is then run after the code inside the loop has run (an iteration has been completed), which will only happen if the exit-condition has still not been reached.</p>
-
-<p>Let's have a look again at our cats list example, but rewritten to use a while loop:</p>
-
-<pre class="brush: js notranslate">var i = 0;
-
-while (i &lt; cats.length) {
-  if (i === cats.length - 1) {
-    info += 'and ' + cats[i] + '.';
-  } else {
-    info += cats[i] + ', ';
-  }
-
-  i++;
-}</pre>
-
-<div class="note">
-<p><strong>Note</strong>: This still works just the same as expected — have a look at it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/while.html">running live on GitHub</a> (also view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/while.html">full source code</a>).</p>
-</div>
-
-<p>The <a href="/en-US/docs/Web/JavaScript/Reference/Statements/do...while">do...while</a> loop is very similar, but provides a variation on the while structure:</p>
-
-<pre class="notranslate">initializer
-do {
-  // code to run
-
-  final-expression
-} while (exit-condition)</pre>
-
-<p>In this case, the initializer again comes first, before the loop starts. The <code>do</code> keyword directly precedes the curly braces containing the code to run and the final-expression.</p>
-
-<p>The differentiator here is that the exit-condition comes after everything else, wrapped in parentheses and preceded by a <code>while</code> keyword. In a <code>do...while</code> loop, the code inside the curly braces is always run once before the check is made to see if it should be executed again (in while and for, the check comes first, so the code might never be executed).</p>
-
-<p>Let's rewrite our cat listing example again to use a <code>do...while</code> loop:</p>
-
-<pre class="brush: js notranslate">var i = 0;
-
-do {
-  if (i === cats.length - 1) {
-    info += 'and ' + cats[i] + '.';
-  } else {
-    info += cats[i] + ', ';
-  }
-
-  i++;
-} while (i &lt; cats.length);</pre>
-
-<div class="note">
-<p><strong>Note</strong>: Again, this works just the same as expected — have a look at it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/do-while.html">running live on GitHub</a> (also view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/do-while.html">full source code</a>).</p>
-</div>
-
-<div class="warning">
-<p><strong>Important</strong>: With while and do...while — as with all loops — you must make sure that the initializer is iterated so that it eventually reaches the exit condition. If not, the loop will go on forever, and either the browser will force it to stop, or it will crash. This is called an <strong>infinite loop</strong>.</p>
-</div>
-
-<h2 id="Active_learning_Launch_countdown!">Active learning: Launch countdown!</h2>
-
-<p>In this exercise, we want you to print out a simple launch countdown to the output box, from 10 down to Blast off. Specifically, we want you to:</p>
-
-<ul>
- <li>Loop from 10 down to 0. We've provided you with an initializer — <code>var i = 10;</code>.</li>
- <li>For each iteration, create a new paragraph and append it to the output <code>&lt;div&gt;</code>, which we've selected using <code>var output = document.querySelector('.output');</code>. In comments, we've provided you with three code lines that need to be used somewhere inside the loop:
-  <ul>
-   <li><code>var para = document.createElement('p');</code> — creates a new paragraph.</li>
-   <li><code>output.appendChild(para);</code> — appends the paragraph to the output <code>&lt;div&gt;</code>.</li>
-   <li><code>para.textContent =</code> — makes the text inside the paragraph equal to whatever you put on the right hand side, after the equals sign.</li>
-  </ul>
- </li>
- <li>Different iteration numbers require different text to be put in the paragraph for that iteration (you'll need a conditional statement and multiple <code>para.textContent =</code> lines):
-  <ul>
-   <li>If the number is 10, print "Countdown 10" to the paragraph.</li>
-   <li>If the number is 0, print "Blast off!" to the paragraph.</li>
-   <li>For any other number, print just the number to the paragraph.</li>
-  </ul>
- </li>
- <li>Remember to include an iterator! However, in this example we are counting down after each iteration, not up, so you <strong>don't</strong> want <code>i++</code> — how do you iterate downwards?</li>
-</ul>
-
-<p>If you make a mistake, you can always reset the example with the "Reset" button. If you get really stuck, press "Show solution" to see a solution.</p>
-
-<div class="hidden">
-<h6 id="Active_learning">Active learning</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Live output&lt;/h2&gt;
-&lt;div class="output" style="height: 410px;overflow: auto;"&gt;
-
-&lt;/div&gt;
-
-&lt;h2&gt;Editable code&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Press Esc to move focus away from the code area (Tab inserts a tab character).&lt;/p&gt;
-&lt;textarea id="code" class="playable-code" style="height: 300px;width: 95%"&gt;
-var output = document.querySelector('.output');
-output.innerHTML = '';
-
-// var i = 10;
-
-// var para = document.createElement('p');
-// para.textContent = ;
-// output.appendChild(para);
-&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Reset"&gt;
-  &lt;input id="solution" type="button" value="Show solution"&gt;
-&lt;/div&gt;
-</pre>
-
-<p class="brush: js"></p>
-
-<p class="brush: js"></p>
-
-<p class="brush: js"></p>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<p class="brush: js"></p>
-
-<p class="brush: js"></p>
-
-<p class="brush: js"></p>
-
-<p class="brush: js"></p>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  eval(textarea.value);
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = jsSolution;
-  solution.value = 'Show solution';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Show solution') {
-    textarea.value = solutionEntry;
-    solution.value = 'Hide solution';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Show solution';
-  }
-  updateCode();
-});
-
-var jsSolution = 'var output = document.querySelector(\'.output\');\noutput.innerHTML = \'\';\n\nvar i = 10;\n\nwhile(i &gt;= 0) {\n var para = document.createElement(\'p\');\n if(i === 10) {\n para.textContent = \'Countdown \' + i;\n } else if(i === 0) {\n  para.textContent = \'Blast off!\';\n } else {\n para.textContent = i;\n }\n\n output.appendChild(para);\n\n i--;\n}';
-var solutionEntry = jsSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// stop tab key tabbing out of textarea and
-// make it write a tab at the caret position instead
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Update the saved userCode every time the user updates the text area code
-
-textarea.onkeyup = function(){
-  // We only want to save the state when the user code is being shown,
-  // not the solution, so that solution is not saved over the user code
-  if(solution.value === 'Show solution') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-
-<p class="brush: js"></p>
-</div>
-
-<p>{{ EmbedLiveSample('Active_learning', '100%', 880, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h2 id="Active_learning_Filling_in_a_guest_list">Active learning: Filling in a guest list</h2>
-
-<p>In this exercise, we want you to take a list of names stored in an array, and put them into a guest list. But it's not quite that easy — we don't want to let Phil and Lola in because they are greedy and rude, and always eat all the food! We have two lists, one for guests to admit, and one for guests to refuse.</p>
-
-<p>Specifically, we want you to:</p>
-
-<ul>
- <li>Write a loop that will iterate from 0 to the length of the <code>people</code> array. You'll need to start with an initializer of  <code>var i = 0;</code>, but what exit condition do you need?</li>
- <li>During each loop iteration, check if the current array item is equal to "Phil" or "Lola" using a conditional statement:
-  <ul>
-   <li>If it is, concatenate the array item to the end of the <code>refused</code> paragraph's <code>textContent</code>, followed by a comma and a space.</li>
-   <li>If it isn't, concatenate the array item to the end of the <code>admitted</code> paragraph's <code>textContent</code>, followed by a comma and a space.</li>
-  </ul>
- </li>
-</ul>
-
-<p>We've already provided you with:</p>
-
-<ul>
- <li><code>var i = 0;</code> — Your initializer.</li>
- <li><code>refused.textContent +=</code> — the beginnings of a line that will concatenate something on to the end of <code>refused.textContent</code>.</li>
- <li><code>admitted.textContent +=</code> — the beginnings of a line that will concatenate something on to the end of <code>admitted.textContent</code>.</li>
-</ul>
-
-<p>Extra bonus question — after completing the above tasks successfully, you will be left with two lists of names, separated by commas, but they will be untidy — there will be a comma at the end of each one. Can you work out how to write lines that slice the last comma off in each case, and add a full stop to the end? Have a look at the <a href="/en-US/docs/Learn/JavaScript/First_steps/Useful_string_methods">Useful string methods</a> article for help.</p>
-
-<p>If you make a mistake, you can always reset the example with the "Reset" button. If you get really stuck, press "Show solution" to see a solution.</p>
-
-<div class="hidden">
-<h6 id="Active_learning_2">Active learning 2</h6>
-
-<pre class="brush: html notranslate">&lt;h2&gt;Live output&lt;/h2&gt;
-&lt;div class="output" style="height: 100px;overflow: auto;"&gt;
-  &lt;p class="admitted"&gt;Admit: &lt;/p&gt;
-  &lt;p class="refused"&gt;Refuse: &lt;/p&gt;
-&lt;/div&gt;
-
-&lt;h2&gt;Editable code&lt;/h2&gt;
-&lt;p class="a11y-label"&gt;Press Esc to move focus away from the code area (Tab inserts a tab character).&lt;/p&gt;
-&lt;textarea id="code" class="playable-code" style="height: 400px;width: 95%"&gt;
-var people = ['Chris', 'Anne', 'Colin', 'Terri', 'Phil', 'Lola', 'Sam', 'Kay', 'Bruce'];
-
-var admitted = document.querySelector('.admitted');
-var refused = document.querySelector('.refused');
-admitted.textContent = 'Admit: ';
-refused.textContent = 'Refuse: '
-
-// var i = 0;
-
-// refused.textContent += ;
-// admitted.textContent += ;
-
-&lt;/textarea&gt;
-
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="reset" type="button" value="Reset"&gt;
-  &lt;input id="solution" type="button" value="Show solution"&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css notranslate">html {
-  font-family: sans-serif;
-}
-
-h2 {
-  font-size: 16px;
-}
-
-.a11y-label {
-  margin: 0;
-  text-align: right;
-  font-size: 0.7rem;
-  width: 98%;
-}
-
-body {
-  margin: 10px;
-  background: #f5f9fa;
-}</pre>
-
-<pre class="brush: js notranslate">var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var solution = document.getElementById('solution');
-var code = textarea.value;
-var userEntry = textarea.value;
-
-function updateCode() {
-  eval(textarea.value);
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  userEntry = textarea.value;
-  solutionEntry = jsSolution;
-  solution.value = 'Show solution';
-  updateCode();
-});
-
-solution.addEventListener('click', function() {
-  if(solution.value === 'Show solution') {
-    textarea.value = solutionEntry;
-    solution.value = 'Hide solution';
-  } else {
-    textarea.value = userEntry;
-    solution.value = 'Show solution';
-  }
-  updateCode();
-});
-
-var jsSolution = 'var people = [\'Chris\', \'Anne\', \'Colin\', \'Terri\', \'Phil\', \'Lola\', \'Sam\', \'Kay\', \'Bruce\'];\n\nvar admitted = document.querySelector(\'.admitted\');\nvar refused = document.querySelector(\'.refused\');\n\nadmitted.textContent = \'Admit: \';\nrefused.textContent = \'Refuse: \'\nvar i = 0;\n\ndo {\n if(people[i] === \'Phil\' || people[i] === \'Lola\') {\n refused.textContent += people[i] + \', \';\n } else {\n admitted.textContent += people[i] + \', \';\n }\n i++;\n} while(i &lt; people.length);\n\nrefused.textContent = refused.textContent.slice(0,refused.textContent.length-2) + \'.\';\nadmitted.textContent = admitted.textContent.slice(0,admitted.textContent.length-2) + \'.\';';
-var solutionEntry = jsSolution;
-
-textarea.addEventListener('input', updateCode);
-window.addEventListener('load', updateCode);
-
-// stop tab key tabbing out of textarea and
-// make it write a tab at the caret position instead
-
-textarea.onkeydown = function(e){
-  if (e.keyCode === 9) {
-    e.preventDefault();
-    insertAtCaret('\t');
-  }
-
-  if (e.keyCode === 27) {
-    textarea.blur();
-  }
-};
-
-function insertAtCaret(text) {
-  var scrollPos = textarea.scrollTop;
-  var caretPos = textarea.selectionStart;
-
-  var front = (textarea.value).substring(0, caretPos);
-  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
-  textarea.value = front + text + back;
-  caretPos = caretPos + text.length;
-  textarea.selectionStart = caretPos;
-  textarea.selectionEnd = caretPos;
-  textarea.focus();
-  textarea.scrollTop = scrollPos;
-}
-
-// Update the saved userCode every time the user updates the text area code
-
-textarea.onkeyup = function(){
-  // We only want to save the state when the user code is being shown,
-  // not the solution, so that solution is not saved over the user code
-  if(solution.value === 'Show solution') {
-    userEntry = textarea.value;
-  } else {
-    solutionEntry = textarea.value;
-  }
-
-  updateCode();
-};</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Active_learning_2', '100%', 680, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h2 id="Which_loop_type_should_you_use">Which loop type should you use?</h2>
-
-<p>For basic uses, <code>for</code>, <code>while</code>, and <code>do...while</code> loops are largely interchangeable. They can all be used to solve the same problems, and which one you use will largely depend on your personal preference — which one you find easiest to remember or most intuitive. Let's have a look at them again.</p>
-
-<p>First <code>for</code>:</p>
-
-<pre class="notranslate">for (initializer; exit-condition; final-expression) {
-  // code to run
-}</pre>
-
-<p><code>while</code>:</p>
-
-<pre class="notranslate">initializer
-while (exit-condition) {
-  // code to run
-
-  final-expression
-}</pre>
-
-<p>and finally <code>do...while</code>:</p>
-
-<pre class="notranslate">initializer
-do {
-  // code to run
-
-  final-expression
-} while (exit-condition)</pre>
-
-<p>We would recommend <code>for</code>, at least to begin with, as it is probably the easiest for remembering everything — the initializer, exit-condition, and final-expression all have to go neatly into the parentheses, so it is easy to see where they are and check that you aren't missing them.</p>
-
-<div class="note">
-<p><strong>Note</strong>: There are other loop types/features too, which are useful in advanced/specialized situations and beyond the scope of this article. If you want to go further with your loop learning, read our advanced <a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration">Loops and iteration guide</a>.</p>
-</div>
-
-<h2 id="Conclusion">Conclusion</h2>
-
-<p>This article has revealed to you the basic concepts behind, and different options available when, looping code in JavaScript. You should now be clear on why loops are a good mechanism for dealing with repetitive code, and be raring to use them in your own examples!</p>
-
-<p>If there is anything you didn't understand, feel free to read through the article again, or <a href="/en-US/Learn#Contact_us">contact us</a> to ask for help.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration">Loops and iteration in detail</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for">for statement reference</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/while">while</a> and <a href="/en-US/docs/Web/JavaScript/Reference/Statements/do...while">do...while</a> references</li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/break">break</a> and <a href="/en-US/docs/Web/JavaScript/Reference/Statements/continue">continue</a> references</li>
- <li>
-  <p class="entry-title"><a href="https://www.impressivewebs.com/javascript-for-loop/">What’s the Best Way to Write a JavaScript For Loop?</a> — some advanced loop best practices</p>
- </li>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/conditionals","Learn/JavaScript/Building_blocks/Functions", "Learn/JavaScript/Building_blocks")}}</p>
-
-<h2 id="In_this_module">In this module</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
-</ul>
-&lt;gdiv&gt;&lt;/gdiv&gt;
diff --git a/files/es/learn/javascript/building_blocks/build_your_own_function/index.html b/files/es/learn/javascript/building_blocks/build_your_own_function/index.html
new file mode 100644
index 0000000000..052ddb8b78
--- /dev/null
+++ b/files/es/learn/javascript/building_blocks/build_your_own_function/index.html
@@ -0,0 +1,253 @@
+---
+title: Construye tu propia función
+slug: Learn/JavaScript/Building_blocks/Build_your_own_function
+tags:
+  - Aprender
+  - Artículo
+  - Construir
+  - Funciones
+  - Guía
+  - JavaScript
+  - Principiante
+  - Tutorial
+translation_of: Learn/JavaScript/Building_blocks/Build_your_own_function
+original_slug: Learn/JavaScript/Building_blocks/Construyendo_tu_propia_funcion
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Functions","Learn/JavaScript/Building_blocks/Return_values", "Learn/JavaScript/Building_blocks")}}</div>
+
+<p class="summary">Con la mayor parte de la teoría esencial tratada en el artículo anterior, este artículo proporciona experiencia práctica. Aquí obtendrás práctica construyendo tu propia función personalizada. En el camino, también explicaremos algunos detalles útiles sobre cómo tratar las funciones.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisites:</th>
+   <td>Conocimientos básicos de computación, una comprensión básica de HTML y CSS, <a href="/en-US/docs/Learn/JavaScript/First_steps">JavaScript first steps</a>, <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objective:</th>
+   <td>Para proporcionar algo de práctica en la construcción de una función personalizada, y explicar algunos detalles asociados más útiles.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Aprendizaje_activo_construyamos_una_función.">Aprendizaje activo: construyamos una función.</h2>
+
+<p>La función personalizada que vamos a construir se llamará <code>displayMessage()</code>. Mostrará un cuadro de mensaje personalizado en una página web y actuará como un reemplazo personalizado para la función de <a href="/en-US/docs/Web/API/Window/alert">alert()</a> incorporada de un navegador. Hemos visto esto antes, pero solo refresquemos nuestros recuerdos. Escriba lo siguiente en la consola de JavaScript de su navegador, en la página que desee:</p>
+
+<pre class="brush: js">alert('This is a message');</pre>
+
+<p>La función <code>alert</code> tiene un argumento — el string que se muestra en la alerta. Prueba a variar el string para cambiar el mensaje.</p>
+
+<p>La función <code>alert</code> es limitada: pueder cambiar el mensaje, pero no puedes cambiar de manera sencilla nada más, como el color, icono o cualquier otra cosa. Construiremos uno que resultará ser más divertido.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Este ejemplo debería funcionar bien en todos los navegadores modernos, pero el estilo puede parecer un poco divertido en los navegadores un poco más antiguos. Te recomendamos que hagas este ejercicio en un navegador moderno como Firefox, Opera o Chrome.</p>
+</div>
+
+<h2 id="La_función_básica">La función básica</h2>
+
+<p>Para empezar, vamos a poner juntos una función básica.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Para las convenciones de nombres de las funciones, debes seguir las mismas reglas que <a href="/en-US/Learn/JavaScript/First_steps/Variables#An_aside_on_variable_naming_rules">convecion de nombres de variables</a>. Esto está bien, ya que puede distinguirlos: los nombres de las funciones aparecen entre paréntesis después de ellos y las variables no.</p>
+</div>
+
+<ol>
+ <li>Comience accediendo al archivo <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/functions/function-start.html">function-start.html</a> y haciendo una copia local. Verás que el HTML es simple  — el body unicamente tiene un botón. También hemos propocionado algunos estilos básicos de CSS para customizar el mensaje y un elemento  {{htmlelement("script")}} vacío para poner nuestro JavaScript dentro.</li>
+ <li>Luego añade lo siguiente dentro del elemento <code>&lt;script&gt;</code>:
+  <pre class="brush: js">function displayMessage() {
+
+}</pre>
+  Comenzamos con la palabra clave función, lo que significa que estamos definiendo una función. A esto le sigue el nombre que queremos darle a nuestra función, un conjunto de paréntesis y un conjunto de llaves. Todos los parámetros que queremos darle a nuestra función van dentro de los paréntesis, y el código que se ejecuta cuando llamamos a la función va dentro de las llaves.</li>
+ <li>Finalmente, agregue el siguiente código dentro de las llaves:
+  <pre class="brush: js">let html = document.querySelector('html');
+
+let panel = document.createElement('div');
+panel.setAttribute('class', 'msgBox');
+html.appendChild(panel);
+
+let msg = document.createElement('p');
+msg.textContent = 'This is a message box';
+panel.appendChild(msg);
+
+let closeBtn = document.createElement('button');
+closeBtn.textContent = 'x';
+panel.appendChild(closeBtn);
+
+closeBtn.onclick = function() {
+  panel.parentNode.removeChild(panel);
+}</pre>
+ </li>
+</ol>
+
+<p>Esto es un montón de código por el que pasar, así que lo guiaremos paso a paso.</p>
+
+<p>La primera línea usa un función DOM API llamada {{domxref("document.querySelector()")}} para seleccionar el elemento {{htmlelement("html")}} y guardar una referencia a él en una variable llamada <code>html</code>, por lo que podemos hacer cosas para más adelante:</p>
+
+<pre class="brush: js">let html = document.querySelector('html');</pre>
+
+<p>La siguiente sección usa otra función del DOM API llamada {{domxref("Document.createElement()")}} para crear un elemento {{htmlelement("div")}} y guardar una referencia a él en una variable llamada <code>panel</code>. Este elemento será el contenedor exterior de nuestro cuadro de mensaje.</p>
+
+<p>Entonces usamos otra función del API DOM llamada {{domxref("Element.setAttribute()")}} para configurar un atributo a <code>class</code> en nuestro panel con un valor de <code>msgBox</code>. Esto es para facilitar el estilo del elemento. — Si echas un vistazo al CSS en la página, verás que estamos utilizando un selector de clases<code>.msgBox</code> para dar estilo al al contenedor del mensaje.</p>
+
+<p>Finalmente, llamamos a una función del DOM llamada {{domxref("Node.appendChild()")}} en la variable <code>html</code> que hemos guardado anteriormente, que anida un elemento dentro del otro como hijo de él. Hemos especificado el panel <code>&lt;div&gt;</code> como el hijo que queremos añadir dentro del elemento <code>&lt;html&gt;</code>. Debemos hacer esto ya que el elemento que creamos no aparecerá en la página por sí solo — tenemos que especificar donde ponerlo.</p>
+
+<pre class="brush: js">let panel = document.createElement('div');
+panel.setAttribute('class', 'msgBox');
+html.appendChild(panel);</pre>
+
+<p>Las siguientes dos secciones hacen uso de las mismas funciones <code>createElement()</code> y <code>appendChild()</code> que ya vimos para crear dos nuevos elementos — un {{htmlelement("p")}} y un {{htmlelement("button")}} — e insertarlo en la página como un hijo del panel <code>&lt;div&gt;</code>. Usamos su propiedad  {{domxref("Node.textContent")}} — que representa el contenido de texto de un elemento: para insertar un mensaje dentro del párrafo y una 'x' dentro del botón. Este botón será lo que necesita hacer clic / activar cuando el usuario quiera cerrar el cuadro de mensaje.</p>
+
+<pre class="brush: js">let msg = document.createElement('p');
+msg.textContent = 'This is a message box';
+panel.appendChild(msg);
+
+let closeBtn = document.createElement('button');
+closeBtn.textContent = 'x';
+panel.appendChild(closeBtn);</pre>
+
+<p>Finalmente, usamos el manejador de evento {{domxref("GlobalEventHandlers.onclick")}} para hacerlo de modo que cuando se haga clic en el botón, se ejecute algún código para eliminar todo el panel de la página, para cerrar el cuadro de mensaje.</p>
+
+<p>Brevemente, el handler <code>onclick</code> es una propiedad disponible en el botón (o, de hecho, en cualquier elemento de la página) que se puede configurar en una función para especificar qué código ejecutar cuando se hace clic en el botón. Aprenderás mucho más sobre esto en nuestro artículo de eventos posteriores. Estamos haciendo el handler <code>onclick</code> igual que una función anónima, que contiene el código para ejecutar cuando se ha hecho click en el botón. La línea dentro de la función usa la función del DOM API {{domxref("Node.removeChild()")}}  para especificar que queremos eliminar un elemento secundario específico del elemento HTML— en este caso el panel <code>&lt;div&gt;</code>.</p>
+
+<pre class="brush: js">closeBtn.onclick = function() {
+  panel.parentNode.removeChild(panel);
+}</pre>
+
+<p>Básicamente, todo este bloque de código está generando un bloque de HTML que se ve así, y lo está insertando en la página:</p>
+
+<pre class="brush: html">&lt;div class="msgBox"&gt;
+  &lt;p&gt;This is a message box&lt;/p&gt;
+  &lt;button&gt;x&lt;/button&gt;
+&lt;/div&gt;</pre>
+
+<p>Fue un montón de código con el que trabajar: ¡no te preocupes demasiado si no recuerdas exactamente cómo funciona todo ahora! La parte principal en la que queremos centrarnos aquí es la estructura y el uso de la función, pero queríamos mostrar algo interesante para este ejemplo.</p>
+
+<h2 id="Llamando_a_la_función">Llamando a la función</h2>
+
+<p>Ahora tienes la definición de tu función escrita en tu elemento &lt;script&gt; bien, pero no hará nada tal como está.</p>
+
+<ol>
+ <li>Intente incluir la siguiente línea debajo de su función para llamarla:
+  <pre class="brush: js">displayMessage();</pre>
+  Esta línea invoca la función, haciéndola correr inmediatamente. Cuando guarde el código y lo vuelva a cargar en el navegador, verá que el pequeño cuadro de mensaje aparece inmediatamente, solo una vez. Después de todo, solo lo llamamos una vez.</li>
+ <li>
+  <p>Ahora abra las herramientas de desarrollo de su navegador en la página de ejemplo, vaya a la consola de JavaScript y escriba la línea nuevamente allí, ¡verá que aparece nuevamente! Así que esto es divertido: ahora tenemos una función reutilizable que podemos llamar en cualquier momento que queramos.</p>
+
+  <p>Pero probablemente queremos que aparezca en respuesta a las acciones del usuario y del sistema. En una aplicación real, tal cuadro de mensaje probablemente se llamará en respuesta a la disponibilidad de nuevos datos, a un error, al usuario que intenta eliminar su perfil ("¿está seguro de esto?"), O al usuario que agrega un nuevo contacto y la operación completando con éxito ... etc.</p>
+
+  <p>En esta demostración, obtendremos el cuadro de mensaje que aparecerá cuando el usuario haga clic en el botón.</p>
+ </li>
+ <li>Elimina la línea anterior que agregaste.</li>
+ <li>A continuación, seleccionaremos el botón y guardaremos una referencia a él en una variable. Agregue la siguiente línea a su código, encima de la definición de la función:
+  <pre class="brush: js">let btn = document.querySelector('button');</pre>
+ </li>
+ <li>Finalmente, agregue la siguiente línea debajo de la anterior:
+  <pre class="brush: js">btn.onclick = displayMessage;</pre>
+  De una forma similar que nuestra línea dentro de la función <code>closeBtn.onclick...</code>, aquí estamos llamando a algún código en respuesta a un botón al hacer clic. Pero en este caso, en lugar de llamar a una función anónima que contiene algún código, estamos llamando directamente a nuestro nombre de función.</li>
+ <li>Intente guardar y actualizar la página: ahora debería ver aparecer el cuadro de mensaje cuando hace clic en el botón.</li>
+</ol>
+
+<p>Quizás te estés preguntando por qué no hemos incluido los paréntesis después del nombre de la función. Esto se debe a que no queremos llamar a la función inmediatamente, solo después de hacer clic en el botón. Si intentas cambiar la línea a</p>
+
+<pre class="brush: js">btn.onclick = displayMessage();</pre>
+
+<p>y al guardar y volver a cargar, verás que aparece el cuadro de mensaje sin hacer clic en el botón. Los paréntesis en este contexto a veces se denominan "operador de invocación de función". Solo los utiliza cuando desea ejecutar la función inmediatamente en el ámbito actual. Del mismo modo, el código dentro de la función anónima no se ejecuta inmediatamente, ya que está dentro del alcance de la función.</p>
+
+<p>Si has intentado el último experimento, asegúrate de deshacer el último cambio antes de continuar.</p>
+
+<h2 id="Mejora_de_la_función_con_parámetros.">Mejora de la función con parámetros.</h2>
+
+<p>Tal como está, la función aún no es muy útil, no queremos mostrar el mismo mensaje predeterminado cada vez. Mejoremos nuestra función agregando algunos parámetros, permitiéndonos llamarla con algunas opciones diferentes.</p>
+
+<ol>
+ <li>En primer lugar, actualice la primera línea de la función:
+  <pre class="brush: js">function displayMessage() {</pre>
+  to this:
+
+  <pre class="brush: js">function displayMessage(msgText, msgType) {</pre>
+  Ahora, cuando llamamos a la función, podemos proporcionar dos valores variables dentro de los paréntesis para especificar el mensaje que se mostrará en el cuadro de mensaje y el tipo de mensaje que es.</li>
+ <li>Para utilizar el primer parámetro, actualiza la siguiente línea dentro de su función:
+  <pre class="brush: js">msg.textContent = 'This is a message box';</pre>
+  to
+
+  <pre class="brush: js">msg.textContent = msgText;</pre>
+ </li>
+ <li>Por último, pero no menos importante, ahora necesita actualizar su llamada de función para incluir un texto de mensaje actualizado. Cambia la siguiente línea:
+  <pre class="brush: js">btn.onclick = displayMessage;</pre>
+  to this block:
+
+  <pre class="brush: js">btn.onclick = function() {
+  displayMessage('Woo, this is a different message!');
+};</pre>
+  Si queremos especificar parámetros dentro de paréntesis para la función a la que estamos llamando, no podemos llamarla directamente, necesitamos colocarla dentro de una función anónima para que no esté en el ámbito inmediato y, por lo tanto, no se llame de inmediato. Ahora no se llamará hasta que se haga clic en el botón.</li>
+ <li>Vuelva a cargar e intenta el código nuevamente y verás que aún funciona bien, ¡excepto que ahora también puede variar el mensaje dentro del parámetro para obtener diferentes mensajes mostrados en el cuadro!</li>
+</ol>
+
+<h3 id="Un_parámetro_más_complejo.">Un parámetro más complejo.</h3>
+
+<p>En el siguiente parámetro. Este va a implicar un poco más de trabajo: lo configuraremos de modo que, dependiendo de la configuración del parámetro msgType, la función mostrará un icono diferente y un color de fondo diferente.</p>
+
+<ol>
+ <li>En primer lugar, descargue los iconos necesarios para este ejercicio (<a href="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/functions/icons/warning.png">warning</a> y <a href="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/functions/icons/chat.png">chat</a>) de GitHub. Guárdalos en una nueva carpeta llamada <code>icons</code> en la misma localización que tu HTML.
+
+  <div class="note"><strong>Nota</strong>: los iconos <a href="https://www.iconfinder.com/icons/1031466/alarm_alert_error_warning_icon">warning</a> y <a href="https://www.iconfinder.com/icons/1031441/chat_message_text_icon">chat</a> que se encuentran en iconfinder.com, han sido diseñados por <a href="https://www.iconfinder.com/nazarr">Nazarrudin Ansyari</a>. Gracias!</div>
+ </li>
+ <li>A continuación, encuentra el CSS dentro de tu archivo HTML. Haremos algunos cambios para dar paso a los iconos. Primero, actualiza el ancho de .msgBox desde:
+  <pre class="brush: css">width: 200px;</pre>
+  to
+
+  <pre class="brush: css">width: 242px;</pre>
+ </li>
+ <li>Luego, añade las siguientes líneas dentro de la regla<code>.msgBox p { ... }</code>:
+  <pre class="brush: css">padding-left: 82px;
+background-position: 25px center;
+background-repeat: no-repeat;</pre>
+ </li>
+ <li>Ahora necesitamos añadir código a la función <code>displayMessage()</code> para manejar la visualización de los iconos. Agrega el siguiente bloque justo encima de la llave de cierre (<code>}</code>) de tu función :
+  <pre class="brush: js">if (msgType === 'warning') {
+  msg.style.backgroundImage = 'url(icons/warning.png)';
+  panel.style.backgroundColor = 'red';
+} else if (msgType === 'chat') {
+  msg.style.backgroundImage = 'url(icons/chat.png)';
+  panel.style.backgroundColor = 'aqua';
+} else {
+  msg.style.paddingLeft = '20px';
+}</pre>
+ </li>
+ <li>Aquí, si el parámetro <code>msgType</code> se establece como <code>'warning'</code>, se muestra el icono de advertencia y el color de fondo del panel se establece en rojo. Si se establece en <code>'chat'</code>, se muestra el icono de chat y el color de fondo del panel se establece en azul aguamarina. Si el parámetro <code>msgType</code> no está configurado en absoluto (o en algo diferente), entonces la parte <code>else { ... }</code> del código entra en juego, y al párrafo simplemente se le da un relleno predeterminado y ningún icono, sin el conjunto de colores del panel de fondo ya sea. Esto proporciona un estado predeterminado si no se proporciona ningún parámetro <code>msgType</code> , lo que significa que es un parámetro opcional.</li>
+ <li>Vamos a probar nuestra función actualizada , prueba a actualizar la llamada a <code>displayMessage()</code> con esto:
+  <pre class="brush: js">displayMessage('Woo, this is a different message!');</pre>
+  to one of these:
+
+  <pre class="brush: js">displayMessage('Your inbox is almost full — delete some mails', 'warning');
+displayMessage('Brian: Hi there, how are you today?','chat');</pre>
+  Puedes ver cuán útil se está volviendo nuestra (ahora no tan) poca función.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Si estas teniendo problemas con el ejemplo, sientente libre para coger el ejemplo para trabajar con él, <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/functions/function-stage-4.html">finished version on GitHub</a> (<a href="http://mdn.github.io/learning-area/javascript/building-blocks/functions/function-stage-4.html">see it running live</a> también), o pídenos ayuda.</p>
+</div>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>¡Felicidades por llegar al final! Este artículo lo llevó a través de todo el proceso de creación de una función personalizada y práctica, que con un poco más de trabajo podría trasplantarse en un proyecto real. En el siguiente artículo resumiremos las funciones explicando otro concepto esencial relacionado: valores de retorno.</p>
+
+<ul>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Functions","Learn/JavaScript/Building_blocks/Return_values", "Learn/JavaScript/Building_blocks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
+</ul>
diff --git a/files/es/learn/javascript/building_blocks/construyendo_tu_propia_funcion/index.html b/files/es/learn/javascript/building_blocks/construyendo_tu_propia_funcion/index.html
deleted file mode 100644
index 5f9bcc7c8b..0000000000
--- a/files/es/learn/javascript/building_blocks/construyendo_tu_propia_funcion/index.html
+++ /dev/null
@@ -1,252 +0,0 @@
----
-title: Construye tu propia función
-slug: Learn/JavaScript/Building_blocks/Construyendo_tu_propia_funcion
-tags:
-  - Aprender
-  - Artículo
-  - Construir
-  - Funciones
-  - Guía
-  - JavaScript
-  - Principiante
-  - Tutorial
-translation_of: Learn/JavaScript/Building_blocks/Build_your_own_function
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Functions","Learn/JavaScript/Building_blocks/Return_values", "Learn/JavaScript/Building_blocks")}}</div>
-
-<p class="summary">Con la mayor parte de la teoría esencial tratada en el artículo anterior, este artículo proporciona experiencia práctica. Aquí obtendrás práctica construyendo tu propia función personalizada. En el camino, también explicaremos algunos detalles útiles sobre cómo tratar las funciones.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisites:</th>
-   <td>Conocimientos básicos de computación, una comprensión básica de HTML y CSS, <a href="/en-US/docs/Learn/JavaScript/First_steps">JavaScript first steps</a>, <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objective:</th>
-   <td>Para proporcionar algo de práctica en la construcción de una función personalizada, y explicar algunos detalles asociados más útiles.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Aprendizaje_activo_construyamos_una_función.">Aprendizaje activo: construyamos una función.</h2>
-
-<p>La función personalizada que vamos a construir se llamará <code>displayMessage()</code>. Mostrará un cuadro de mensaje personalizado en una página web y actuará como un reemplazo personalizado para la función de <a href="/en-US/docs/Web/API/Window/alert">alert()</a> incorporada de un navegador. Hemos visto esto antes, pero solo refresquemos nuestros recuerdos. Escriba lo siguiente en la consola de JavaScript de su navegador, en la página que desee:</p>
-
-<pre class="brush: js">alert('This is a message');</pre>
-
-<p>La función <code>alert</code> tiene un argumento — el string que se muestra en la alerta. Prueba a variar el string para cambiar el mensaje.</p>
-
-<p>La función <code>alert</code> es limitada: pueder cambiar el mensaje, pero no puedes cambiar de manera sencilla nada más, como el color, icono o cualquier otra cosa. Construiremos uno que resultará ser más divertido.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Este ejemplo debería funcionar bien en todos los navegadores modernos, pero el estilo puede parecer un poco divertido en los navegadores un poco más antiguos. Te recomendamos que hagas este ejercicio en un navegador moderno como Firefox, Opera o Chrome.</p>
-</div>
-
-<h2 id="La_función_básica">La función básica</h2>
-
-<p>Para empezar, vamos a poner juntos una función básica.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Para las convenciones de nombres de las funciones, debes seguir las mismas reglas que <a href="/en-US/Learn/JavaScript/First_steps/Variables#An_aside_on_variable_naming_rules">convecion de nombres de variables</a>. Esto está bien, ya que puede distinguirlos: los nombres de las funciones aparecen entre paréntesis después de ellos y las variables no.</p>
-</div>
-
-<ol>
- <li>Comience accediendo al archivo <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/functions/function-start.html">function-start.html</a> y haciendo una copia local. Verás que el HTML es simple  — el body unicamente tiene un botón. También hemos propocionado algunos estilos básicos de CSS para customizar el mensaje y un elemento  {{htmlelement("script")}} vacío para poner nuestro JavaScript dentro.</li>
- <li>Luego añade lo siguiente dentro del elemento <code>&lt;script&gt;</code>:
-  <pre class="brush: js">function displayMessage() {
-
-}</pre>
-  Comenzamos con la palabra clave función, lo que significa que estamos definiendo una función. A esto le sigue el nombre que queremos darle a nuestra función, un conjunto de paréntesis y un conjunto de llaves. Todos los parámetros que queremos darle a nuestra función van dentro de los paréntesis, y el código que se ejecuta cuando llamamos a la función va dentro de las llaves.</li>
- <li>Finalmente, agregue el siguiente código dentro de las llaves:
-  <pre class="brush: js">let html = document.querySelector('html');
-
-let panel = document.createElement('div');
-panel.setAttribute('class', 'msgBox');
-html.appendChild(panel);
-
-let msg = document.createElement('p');
-msg.textContent = 'This is a message box';
-panel.appendChild(msg);
-
-let closeBtn = document.createElement('button');
-closeBtn.textContent = 'x';
-panel.appendChild(closeBtn);
-
-closeBtn.onclick = function() {
-  panel.parentNode.removeChild(panel);
-}</pre>
- </li>
-</ol>
-
-<p>Esto es un montón de código por el que pasar, así que lo guiaremos paso a paso.</p>
-
-<p>La primera línea usa un función DOM API llamada {{domxref("document.querySelector()")}} para seleccionar el elemento {{htmlelement("html")}} y guardar una referencia a él en una variable llamada <code>html</code>, por lo que podemos hacer cosas para más adelante:</p>
-
-<pre class="brush: js">let html = document.querySelector('html');</pre>
-
-<p>La siguiente sección usa otra función del DOM API llamada {{domxref("Document.createElement()")}} para crear un elemento {{htmlelement("div")}} y guardar una referencia a él en una variable llamada <code>panel</code>. Este elemento será el contenedor exterior de nuestro cuadro de mensaje.</p>
-
-<p>Entonces usamos otra función del API DOM llamada {{domxref("Element.setAttribute()")}} para configurar un atributo a <code>class</code> en nuestro panel con un valor de <code>msgBox</code>. Esto es para facilitar el estilo del elemento. — Si echas un vistazo al CSS en la página, verás que estamos utilizando un selector de clases<code>.msgBox</code> para dar estilo al al contenedor del mensaje.</p>
-
-<p>Finalmente, llamamos a una función del DOM llamada {{domxref("Node.appendChild()")}} en la variable <code>html</code> que hemos guardado anteriormente, que anida un elemento dentro del otro como hijo de él. Hemos especificado el panel <code>&lt;div&gt;</code> como el hijo que queremos añadir dentro del elemento <code>&lt;html&gt;</code>. Debemos hacer esto ya que el elemento que creamos no aparecerá en la página por sí solo — tenemos que especificar donde ponerlo.</p>
-
-<pre class="brush: js">let panel = document.createElement('div');
-panel.setAttribute('class', 'msgBox');
-html.appendChild(panel);</pre>
-
-<p>Las siguientes dos secciones hacen uso de las mismas funciones <code>createElement()</code> y <code>appendChild()</code> que ya vimos para crear dos nuevos elementos — un {{htmlelement("p")}} y un {{htmlelement("button")}} — e insertarlo en la página como un hijo del panel <code>&lt;div&gt;</code>. Usamos su propiedad  {{domxref("Node.textContent")}} — que representa el contenido de texto de un elemento: para insertar un mensaje dentro del párrafo y una 'x' dentro del botón. Este botón será lo que necesita hacer clic / activar cuando el usuario quiera cerrar el cuadro de mensaje.</p>
-
-<pre class="brush: js">let msg = document.createElement('p');
-msg.textContent = 'This is a message box';
-panel.appendChild(msg);
-
-let closeBtn = document.createElement('button');
-closeBtn.textContent = 'x';
-panel.appendChild(closeBtn);</pre>
-
-<p>Finalmente, usamos el manejador de evento {{domxref("GlobalEventHandlers.onclick")}} para hacerlo de modo que cuando se haga clic en el botón, se ejecute algún código para eliminar todo el panel de la página, para cerrar el cuadro de mensaje.</p>
-
-<p>Brevemente, el handler <code>onclick</code> es una propiedad disponible en el botón (o, de hecho, en cualquier elemento de la página) que se puede configurar en una función para especificar qué código ejecutar cuando se hace clic en el botón. Aprenderás mucho más sobre esto en nuestro artículo de eventos posteriores. Estamos haciendo el handler <code>onclick</code> igual que una función anónima, que contiene el código para ejecutar cuando se ha hecho click en el botón. La línea dentro de la función usa la función del DOM API {{domxref("Node.removeChild()")}}  para especificar que queremos eliminar un elemento secundario específico del elemento HTML— en este caso el panel <code>&lt;div&gt;</code>.</p>
-
-<pre class="brush: js">closeBtn.onclick = function() {
-  panel.parentNode.removeChild(panel);
-}</pre>
-
-<p>Básicamente, todo este bloque de código está generando un bloque de HTML que se ve así, y lo está insertando en la página:</p>
-
-<pre class="brush: html">&lt;div class="msgBox"&gt;
-  &lt;p&gt;This is a message box&lt;/p&gt;
-  &lt;button&gt;x&lt;/button&gt;
-&lt;/div&gt;</pre>
-
-<p>Fue un montón de código con el que trabajar: ¡no te preocupes demasiado si no recuerdas exactamente cómo funciona todo ahora! La parte principal en la que queremos centrarnos aquí es la estructura y el uso de la función, pero queríamos mostrar algo interesante para este ejemplo.</p>
-
-<h2 id="Llamando_a_la_función">Llamando a la función</h2>
-
-<p>Ahora tienes la definición de tu función escrita en tu elemento &lt;script&gt; bien, pero no hará nada tal como está.</p>
-
-<ol>
- <li>Intente incluir la siguiente línea debajo de su función para llamarla:
-  <pre class="brush: js">displayMessage();</pre>
-  Esta línea invoca la función, haciéndola correr inmediatamente. Cuando guarde el código y lo vuelva a cargar en el navegador, verá que el pequeño cuadro de mensaje aparece inmediatamente, solo una vez. Después de todo, solo lo llamamos una vez.</li>
- <li>
-  <p>Ahora abra las herramientas de desarrollo de su navegador en la página de ejemplo, vaya a la consola de JavaScript y escriba la línea nuevamente allí, ¡verá que aparece nuevamente! Así que esto es divertido: ahora tenemos una función reutilizable que podemos llamar en cualquier momento que queramos.</p>
-
-  <p>Pero probablemente queremos que aparezca en respuesta a las acciones del usuario y del sistema. En una aplicación real, tal cuadro de mensaje probablemente se llamará en respuesta a la disponibilidad de nuevos datos, a un error, al usuario que intenta eliminar su perfil ("¿está seguro de esto?"), O al usuario que agrega un nuevo contacto y la operación completando con éxito ... etc.</p>
-
-  <p>En esta demostración, obtendremos el cuadro de mensaje que aparecerá cuando el usuario haga clic en el botón.</p>
- </li>
- <li>Elimina la línea anterior que agregaste.</li>
- <li>A continuación, seleccionaremos el botón y guardaremos una referencia a él en una variable. Agregue la siguiente línea a su código, encima de la definición de la función:
-  <pre class="brush: js">let btn = document.querySelector('button');</pre>
- </li>
- <li>Finalmente, agregue la siguiente línea debajo de la anterior:
-  <pre class="brush: js">btn.onclick = displayMessage;</pre>
-  De una forma similar que nuestra línea dentro de la función <code>closeBtn.onclick...</code>, aquí estamos llamando a algún código en respuesta a un botón al hacer clic. Pero en este caso, en lugar de llamar a una función anónima que contiene algún código, estamos llamando directamente a nuestro nombre de función.</li>
- <li>Intente guardar y actualizar la página: ahora debería ver aparecer el cuadro de mensaje cuando hace clic en el botón.</li>
-</ol>
-
-<p>Quizás te estés preguntando por qué no hemos incluido los paréntesis después del nombre de la función. Esto se debe a que no queremos llamar a la función inmediatamente, solo después de hacer clic en el botón. Si intentas cambiar la línea a</p>
-
-<pre class="brush: js">btn.onclick = displayMessage();</pre>
-
-<p>y al guardar y volver a cargar, verás que aparece el cuadro de mensaje sin hacer clic en el botón. Los paréntesis en este contexto a veces se denominan "operador de invocación de función". Solo los utiliza cuando desea ejecutar la función inmediatamente en el ámbito actual. Del mismo modo, el código dentro de la función anónima no se ejecuta inmediatamente, ya que está dentro del alcance de la función.</p>
-
-<p>Si has intentado el último experimento, asegúrate de deshacer el último cambio antes de continuar.</p>
-
-<h2 id="Mejora_de_la_función_con_parámetros.">Mejora de la función con parámetros.</h2>
-
-<p>Tal como está, la función aún no es muy útil, no queremos mostrar el mismo mensaje predeterminado cada vez. Mejoremos nuestra función agregando algunos parámetros, permitiéndonos llamarla con algunas opciones diferentes.</p>
-
-<ol>
- <li>En primer lugar, actualice la primera línea de la función:
-  <pre class="brush: js">function displayMessage() {</pre>
-  to this:
-
-  <pre class="brush: js">function displayMessage(msgText, msgType) {</pre>
-  Ahora, cuando llamamos a la función, podemos proporcionar dos valores variables dentro de los paréntesis para especificar el mensaje que se mostrará en el cuadro de mensaje y el tipo de mensaje que es.</li>
- <li>Para utilizar el primer parámetro, actualiza la siguiente línea dentro de su función:
-  <pre class="brush: js">msg.textContent = 'This is a message box';</pre>
-  to
-
-  <pre class="brush: js">msg.textContent = msgText;</pre>
- </li>
- <li>Por último, pero no menos importante, ahora necesita actualizar su llamada de función para incluir un texto de mensaje actualizado. Cambia la siguiente línea:
-  <pre class="brush: js">btn.onclick = displayMessage;</pre>
-  to this block:
-
-  <pre class="brush: js">btn.onclick = function() {
-  displayMessage('Woo, this is a different message!');
-};</pre>
-  Si queremos especificar parámetros dentro de paréntesis para la función a la que estamos llamando, no podemos llamarla directamente, necesitamos colocarla dentro de una función anónima para que no esté en el ámbito inmediato y, por lo tanto, no se llame de inmediato. Ahora no se llamará hasta que se haga clic en el botón.</li>
- <li>Vuelva a cargar e intenta el código nuevamente y verás que aún funciona bien, ¡excepto que ahora también puede variar el mensaje dentro del parámetro para obtener diferentes mensajes mostrados en el cuadro!</li>
-</ol>
-
-<h3 id="Un_parámetro_más_complejo.">Un parámetro más complejo.</h3>
-
-<p>En el siguiente parámetro. Este va a implicar un poco más de trabajo: lo configuraremos de modo que, dependiendo de la configuración del parámetro msgType, la función mostrará un icono diferente y un color de fondo diferente.</p>
-
-<ol>
- <li>En primer lugar, descargue los iconos necesarios para este ejercicio (<a href="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/functions/icons/warning.png">warning</a> y <a href="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/functions/icons/chat.png">chat</a>) de GitHub. Guárdalos en una nueva carpeta llamada <code>icons</code> en la misma localización que tu HTML.
-
-  <div class="note"><strong>Nota</strong>: los iconos <a href="https://www.iconfinder.com/icons/1031466/alarm_alert_error_warning_icon">warning</a> y <a href="https://www.iconfinder.com/icons/1031441/chat_message_text_icon">chat</a> que se encuentran en iconfinder.com, han sido diseñados por <a href="https://www.iconfinder.com/nazarr">Nazarrudin Ansyari</a>. Gracias!</div>
- </li>
- <li>A continuación, encuentra el CSS dentro de tu archivo HTML. Haremos algunos cambios para dar paso a los iconos. Primero, actualiza el ancho de .msgBox desde:
-  <pre class="brush: css">width: 200px;</pre>
-  to
-
-  <pre class="brush: css">width: 242px;</pre>
- </li>
- <li>Luego, añade las siguientes líneas dentro de la regla<code>.msgBox p { ... }</code>:
-  <pre class="brush: css">padding-left: 82px;
-background-position: 25px center;
-background-repeat: no-repeat;</pre>
- </li>
- <li>Ahora necesitamos añadir código a la función <code>displayMessage()</code> para manejar la visualización de los iconos. Agrega el siguiente bloque justo encima de la llave de cierre (<code>}</code>) de tu función :
-  <pre class="brush: js">if (msgType === 'warning') {
-  msg.style.backgroundImage = 'url(icons/warning.png)';
-  panel.style.backgroundColor = 'red';
-} else if (msgType === 'chat') {
-  msg.style.backgroundImage = 'url(icons/chat.png)';
-  panel.style.backgroundColor = 'aqua';
-} else {
-  msg.style.paddingLeft = '20px';
-}</pre>
- </li>
- <li>Aquí, si el parámetro <code>msgType</code> se establece como <code>'warning'</code>, se muestra el icono de advertencia y el color de fondo del panel se establece en rojo. Si se establece en <code>'chat'</code>, se muestra el icono de chat y el color de fondo del panel se establece en azul aguamarina. Si el parámetro <code>msgType</code> no está configurado en absoluto (o en algo diferente), entonces la parte <code>else { ... }</code> del código entra en juego, y al párrafo simplemente se le da un relleno predeterminado y ningún icono, sin el conjunto de colores del panel de fondo ya sea. Esto proporciona un estado predeterminado si no se proporciona ningún parámetro <code>msgType</code> , lo que significa que es un parámetro opcional.</li>
- <li>Vamos a probar nuestra función actualizada , prueba a actualizar la llamada a <code>displayMessage()</code> con esto:
-  <pre class="brush: js">displayMessage('Woo, this is a different message!');</pre>
-  to one of these:
-
-  <pre class="brush: js">displayMessage('Your inbox is almost full — delete some mails', 'warning');
-displayMessage('Brian: Hi there, how are you today?','chat');</pre>
-  Puedes ver cuán útil se está volviendo nuestra (ahora no tan) poca función.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Si estas teniendo problemas con el ejemplo, sientente libre para coger el ejemplo para trabajar con él, <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/functions/function-stage-4.html">finished version on GitHub</a> (<a href="http://mdn.github.io/learning-area/javascript/building-blocks/functions/function-stage-4.html">see it running live</a> también), o pídenos ayuda.</p>
-</div>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>¡Felicidades por llegar al final! Este artículo lo llevó a través de todo el proceso de creación de una función personalizada y práctica, que con un poco más de trabajo podría trasplantarse en un proyecto real. En el siguiente artículo resumiremos las funciones explicando otro concepto esencial relacionado: valores de retorno.</p>
-
-<ul>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Functions","Learn/JavaScript/Building_blocks/Return_values", "Learn/JavaScript/Building_blocks")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
-</ul>
diff --git a/files/es/learn/javascript/building_blocks/eventos/index.html b/files/es/learn/javascript/building_blocks/eventos/index.html
deleted file mode 100644
index 7bdb81768a..0000000000
--- a/files/es/learn/javascript/building_blocks/eventos/index.html
+++ /dev/null
@@ -1,578 +0,0 @@
----
-title: Introducción a eventos
-slug: Learn/JavaScript/Building_blocks/Eventos
-translation_of: Learn/JavaScript/Building_blocks/Events
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Return_values","Learn/JavaScript/Building_blocks/Image_gallery", "Learn/JavaScript/Building_blocks")}}</div>
-
-<p class="summary">Los eventos son acciones u ocurrencias que suceden en el sistema que está programando y que el sistema le informa para que pueda responder de alguna manera si lo desea. Por ejemplo, si el usuario hace clic en un botón en una página web, es posible que desee responder a esa acción mostrando un cuadro de información. En este artículo, discutiremos algunos conceptos importantes que rodean los eventos y veremos cómo funcionan en los navegadores. Este no será un estudio exhaustivo; solo lo que necesitas saber en esta etapa.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, entendimiento básico de HTML y CSS, <a href="https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps">Primeros pasos con JavaScript</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender la teoría fundamental de los eventos, cómo funcionan en los navegadores y cómo los eventos pueden diferir en distintos entornos de programación.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Una_serie_de_eventos_afortunados">Una serie de eventos afortunados</h2>
-
-<p>Como se mencionó anteriormente, los <strong>eventos</strong> son acciones u ocurrencias que suceden en el sistema que está programando — el sistema disparará una señal de algún tipo cuando un evento ocurra y también proporcionará un mecanismo por el cual se puede tomar algún tipo de acción automáticamente (p.e., ejecutando algún código) cuando se produce el evento. Por ejemplo, en un aeropuerto cuando la pista está despejada para que despegue un avión, se comunica una señal al piloto y, como resultado, comienzan a pilotar el avión.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14077/MDN-mozilla-events-runway.png" style="display: block; margin: 0px auto;"></p>
-
-<p>En el caso de la Web, los eventos se desencadenan dentro de la ventana del navegador y tienden a estar unidos a un elemento específico que reside en ella — podría ser un solo elemento, un conjunto de elementos, el documento HTML cargado en la pestaña actual o toda la ventana del navegador. Hay muchos tipos diferentes de eventos que pueden ocurrir, por ejemplo:</p>
-
-<ul>
- <li>El usuario hace clic con el mouse sobre un elemento determinado o coloca el cursor sobre un elemento determinado.</li>
- <li>El usuario presiona una tecla en el teclado.</li>
- <li>El usuario cambia el tamaño o cierra la ventana del navegador.</li>
- <li>Una página web termina de cargar.</li>
- <li>Un formulario se envía</li>
- <li>Un video se reproduce, pausa o finaliza la reproducción.</li>
- <li>Un error ocurre.</li>
-</ul>
-
-<p>Se deducirá de esto (y echar un vistazo a MDN <a href="https://developer.mozilla.org/es/docs/Web/Events">Referencia de eventos</a>) que hay <strong>muchos</strong> eventos a los que se puede responder.</p>
-
-<p>Cada evento disponible tiene un <strong>controlador de eventos</strong>, que es un bloque de código (generalmente una función JavaScript definida por el usuario) que se ejecutará cuando se active el evento. Cuando dicho bloque de código se define para ejecutarse en respuesta a un disparo de evento, decimos que estamos <strong>registrando un controlador de eventos</strong>. Tenga en cuenta que los controladores de eventos a veces se llaman <strong>oyentes de eventos</strong> — son bastante intercambiables para nuestros propósitos, aunque estrictamente hablando, trabajan juntos. El oyente escucha si ocurre el evento y el controlador es el código que se ejecuta en respuesta a que ocurra.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Es útil tener en cuenta que los eventos web no son parte del lenguaje central de JavaScript: se definen como parte de las API integradas en el navegador.</p>
-</div>
-
-<h3 id="Un_ejemplo_simple">Un ejemplo simple</h3>
-
-<p>Veamos un ejemplo simple para explicar lo que queremos decir aquí. Ya has visto eventos y controladores de eventos en muchos de los ejemplos de este curso, pero vamos a recapitular solo para consolidar nuestro conocimiento. En el siguiente ejemplo, tenemos un solo {{htmlelement ("button")}}, que cuando se presiona, hará que el fondo cambie a un color aleatorio:</p>
-
-<pre class="brush: html notranslate">&lt;button&gt;Cambiar color&lt;/button&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">button { margin: 10px };</pre>
-</div>
-
-<p>El JavaScript se ve así:</p>
-
-<pre class="brush: js notranslate">const btn = document.querySelector('button');
-
-function random(number) {
-  return Math.floor(Math.random() * (number+1));
-}
-
-btn.onclick = function() {
-  const rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-  document.body.style.backgroundColor = rndCol;
-}</pre>
-
-<p>En este código, almacenamos una referencia al botón dentro de una variable llamada <code>btn</code>, usando la función {{domxref ("Document.querySelector ()")}}. También definimos una función que devuelve un número aleatorio. La tercera parte del código es el controlador de eventos. La variable <code>btn</code> apunta a un elemento <code>&lt;button&gt;</code>, y este tipo de objeto tiene una serie de eventos que pueden activarse y, por lo tanto, los controladores de eventos están disponibles. Estamos escuchando el disparo del evento "click", estableciendo la propiedad del controlador de eventos <code>onclick</code> para que sea igual a una función anónima que contiene código que generó un color RGB aleatorio y establece el <code>&lt;body&gt;</code> color de fondo igual a este.</p>
-
-<p>Este código ahora se ejecutará cada vez que se active el evento "click" en el elemento <code>&lt;button&gt;</code>, es decir, cada vez que un usuario haga clic en él.</p>
-
-<p>El resultado de ejemplo es el siguiente:</p>
-
-<p>{{ EmbedLiveSample('A_simple_example', '100%', 200, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<h3 id="No_son_solo_páginas_web">No son solo páginas web</h3>
-
-<p>Otra cosa que vale la pena mencionar en este punto es que los eventos no son particulares de JavaScript — la mayoría de los lenguajes de programación tienen algún tipo de modelo de eventos, y la forma en que funciona a menudo diferirá de la forma en que funciona en JavaScript. De hecho, el modelo de eventos en JavaScript para páginas web difiere del modelo de eventos para JavaScript, ya que se utiliza en otros entornos.</p>
-
-<p>Por ejemplo, <a href="/en-US/docs/Learn/Server-side/Express_Nodejs">Node.js</a> es un entorno en tiempo de ejecución de JavaScript muy popular que permite a los desarrolladores usar JavaScript para crear aplicaciones de red y del lado del servidor. El <a href="https://nodejs.org/docs/latest-v5.x/api/events.html">modelo de eventos de Node.js</a> se basa en que los oyentes (<em>listeners</em>) escuchen eventos y los emisores (<em>emitters</em>) emitan eventos periódicamente — no suena tan diferentes, pero el código es bastante diferente, haciendo uso de funciones como <code>on()</code> para registrar un oyente de eventos, y <code>once()</code> para registrar un oyente de eventos que anula el registro después de que se haya ejecutado una vez. The <a href="https://nodejs.org/docs/latest-v8.x/api/http.html#http_event_connect">documentos de eventos de conexión HTTP</a> proporcionan un buen ejemplo de uso.</p>
-
-<p>Como otro ejemplo, ahora también puede usar JavaScript para crear complementos de navegadores — mejoras de funcionalidad del navegador — utilizando una tecnología llamada <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a>. El modelo de eventos es similar al modelo de eventos web, pero un poco diferente — las propiedades de los oyentes de eventos se escriben en <em>camel-case</em> (ej. <code>onMessage</code> en lugar de <code>onmessage</code>), y deben combinarse con la función <code>addListener</code>. Consulte la página <a href="/en-US/Add-ons/WebExtensions/API/runtime/onMessage#Examples">runtime.onMessage </a>para ver un ejemplo.</p>
-
-<p>No necesita comprender nada sobre otros entornos en esta etapa de su aprendizaje; solo queríamos dejar en claro que los eventos pueden diferir en diferentes entornos de programación.</p>
-
-<h2 id="Diferentes_formas_de_uso_de_eventos">Diferentes formas de uso de eventos</h2>
-
-<p>Hay muchas maneras distintas en las que puedes agregar event listeners a los sitios web, que se ejecutara cuando el evento asociado se dispare. En esta sección, revisaremos los diferentes mecanismos y discutiremos cuales deberias usar..</p>
-
-<h3 id="Propiedades_de_manejadores_de_eventos">Propiedades de manejadores de eventos</h3>
-
-<p>Estas son las propiedades que existen, que contienen codigo de manejadores de eventos(Event Handler)  que vemos frecuentemente durante el curso.. Volviendo al ejemplo de arriba:</p>
-
-<pre class="brush: js notranslate">var btn = document.querySelector('button');
-
-btn.onclick = function() {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-  document.body.style.backgroundColor = rndCol;
-}</pre>
-
-<p>La propiedad <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onclick">onclick</a></code> es la propiedad del manejador de eventos que está siendo usada en esta situación. Es escencialmente una propiedad como cualquier otra disponible en el botón (por ejemplo: <code><a href="/en-US/docs/Web/API/Node/textContent">btn.textContent</a></code>, or <code><a href="/en-US/docs/Web/API/HTMLElement/style">btn.style</a></code>), pero es de un tipo especial — cuando lo configura para ser igual a algún código, ese código se ejecutará cuando el evento se dispare en el botón.</p>
-
-<p>You could also set the handler property to be equal to a named function name (like we saw in <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a>). The following would work just the same:</p>
-
-<pre class="brush: js notranslate">var btn = document.querySelector('button');
-
-function bgChange() {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-  document.body.style.backgroundColor = rndCol;
-}
-
-btn.onclick = bgChange;</pre>
-
-<p>There are many different event handler properties available. Let's do an experiment.</p>
-
-<p>First of all, make a local copy of <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-eventhandlerproperty.html">random-color-eventhandlerproperty.html</a>, and open it in your browser. It's just a copy of the simple random color example we've been playing with already in this article. Now try changing <code>btn.onclick</code> to the following different values in turn, and observing the results in the example:</p>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onfocus">btn.onfocus</a></code> and <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onblur">btn.onblur</a></code> — The color will change when the button is focused and unfocused (try pressing tab to tab on to the button and off again). These are often used to display information about how to fill in form fields when they are focused, or display an error message if a form field has just been filled in with an incorrect value.</li>
- <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/ondblclick">btn.ondblclick</a></code> — The color will change only when it is double-clicked.</li>
- <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeypress">window.onkeypress</a></code>, <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">window.onkeydown</a></code>, <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">window.onkeyup</a></code> — The color will change when a key is pressed on the keyboard. <code>keypress</code> refers to a general press (button down and then up), while <code>keydown</code> and <code>keyup</code> refer to just the key down and key up parts of the keystroke, respectively. Note that it doesn't work if you try to register this event handler on the button itself — we've had to register it on the <a href="/en-US/docs/Web/API/Window">window</a> object, which represents the entire browser window.</li>
- <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onmouseover">btn.onmouseover</a></code> and <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onmouseout">btn.onmouseout</a></code> — The color will change when the mouse pointer is moved so it begins hovering over the button, or when it stops hovering over the button and moves off of it, respectively.</li>
-</ul>
-
-<p>Some events are very general and available nearly anywhere (for example an <code>onclick</code> handler can be registered on nearly any element), whereas some are more specific and only useful in certain situations (for example it makes sense to use <a href="/en-US/docs/Web/API/GlobalEventHandlers/GlobalEventHandlers.onplay">onplay</a> only on specific elements, such as {{htmlelement("video")}}).</p>
-
-<h3 id="Inline_event_handlers_—_dont_use_these">Inline event handlers — don't use these</h3>
-
-<p>You might also see a pattern like this in your code:</p>
-
-<pre class="brush: html notranslate">&lt;button onclick="bgChange()"&gt;Press me&lt;/button&gt;
-</pre>
-
-<pre class="brush: js notranslate">function bgChange() {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-  document.body.style.backgroundColor = rndCol;
-}</pre>
-
-<div class="note">
-<p><strong>Note</strong>: You can find the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-eventhandlerattributes.html">full source code</a> for this example on GitHub (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/random-color-eventhandlerattributes.html">see it running live</a>).</p>
-</div>
-
-<p>The earliest method of registering event handlers found on the Web involved <strong>event handler HTML attributes</strong> (aka <strong>inline event handlers</strong>) like the one shown above — the attribute value is literally the JavaScript code you want to run when the event occurs. The above example invokes a function defined inside a {{htmlelement("script")}} element on the same page, but you could also insert JavaScript directly inside the attribute, for example:</p>
-
-<pre class="brush: html notranslate">&lt;button onclick="alert('Hello, this is my old-fashioned event handler!');"&gt;Press me&lt;/button&gt;</pre>
-
-<p>You'll find HTML attribute equivalents for many of the event handler properties; however, you shouldn't use these — they are considered bad practice. It might seem easy to use an event handler attribute if you are just doing something really quick, but they very quickly become unmanageable and inefficient.</p>
-
-<p>For a start, it is not a good idea to mix up your HTML and your JavaScript, as it becomes hard to parse — keeping your JavaScript all in one place is better; if it is in a separate file you can apply it to multiple HTML documents.</p>
-
-<p>Even in a single file, inline event handlers are not a good idea. One button is OK, but what if you had 100 buttons? You'd have to add 100 attributes to the file; it would very quickly turn into a maintenance nightmare. With JavaScript, you could easily add an event handler function to all the buttons on the page no matter how many there were, using something like this:</p>
-
-<pre class="brush: js notranslate">var buttons = document.querySelectorAll('button');
-
-for (var i = 0; i &lt; buttons.length; i++) {
-  buttons[i].onclick = bgChange;
-}</pre>
-
-<p class="brush: js">Note that another option here would be to use the <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach">forEach()</a></code> built-in method available on all Array objects:</p>
-
-<pre class="brush: js notranslate">buttons.forEach(function(button) {
-  button.onclick = bgChange;
-});</pre>
-
-<div class="note">
-<p><strong>Note</strong>: Separating your programming logic from your content also makes your site more friendly to search engines.</p>
-</div>
-
-<h3 id="addEventListener_and_removeEventListener">addEventListener() and removeEventListener()</h3>
-
-<p>The newest type of event mechanism is defined in the <a href="https://www.w3.org/TR/DOM-Level-2-Events/">Document Object Model (DOM) Level 2 Events</a> Specification, which provides browsers with a new function — <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code>. This functions in a similar way to the event handler properties, but the syntax is obviously different. We could rewrite our random color example to look like this:</p>
-
-<pre class="brush: js notranslate">var btn = document.querySelector('button');
-
-function bgChange() {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-  document.body.style.backgroundColor = rndCol;
-}
-
-btn.addEventListener('click', bgChange);</pre>
-
-<div class="note">
-<p><strong>Note</strong>: You can find the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-addeventlistener.html">full source code</a> for this example on GitHub (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/random-color-addeventlistener.html">see it running live</a>).</p>
-</div>
-
-<p>Inside the <code>addEventListener()</code> function, we specify two parameters — the name of the event we want to register this handler for, and the code that comprises the handler function we want to run in response to it. Note that it is perfectly appropriate to put all the code inside the <code>addEventListener()</code> function, in an anonymous function, like this:</p>
-
-<pre class="brush: js notranslate">btn.addEventListener('click', function() {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-  document.body.style.backgroundColor = rndCol;
-});</pre>
-
-<p>This mechanism has some advantages over the older mechanisms discussed earlier. For a start, there is a counterpart function, <code><a href="/en-US/docs/Web/API/EventTarget/removeEventListener">removeEventListener()</a></code>, which removes a previously added listener. For example, this would remove the listener set in the first code block in this section:</p>
-
-<pre class="brush: js notranslate">btn.removeEventListener('click', bgChange);</pre>
-
-<p>This isn't significant for simple, small programs, but for larger, more complex programs it can improve efficiency to clean up old unused event handlers. Plus, for example, this allows you to have the same button performing different actions in different circumstances — all you've got to do is add/remove event handlers as appropriate.</p>
-
-<p>Second, you can also register multiple handlers for the same listener. The following two handlers would not be applied:</p>
-
-<pre class="brush: js notranslate">myElement.onclick = functionA;
-myElement.onclick = functionB;</pre>
-
-<p>As the second line would overwrite the value of <code>onclick</code> set by the first. This would work, however:</p>
-
-<pre class="brush: js notranslate">myElement.addEventListener('click', functionA);
-myElement.addEventListener('click', functionB);</pre>
-
-<p>Both functions would now run when the element is clicked.</p>
-
-<p>In addition, there are a number of other powerful features and options available with this event mechanism. These are a little out of scope for this article, but if you want to read up on them, have a look at the <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> and <code><a href="/en-US/docs/Web/API/EventTarget/removeEventListener">removeEventListener()</a></code> reference pages.</p>
-
-<h3 id="What_mechanism_should_I_use">What mechanism should I use?</h3>
-
-<p>Of the three mechanisms, you definitely shouldn't use the HTML event handler attributes — these are outdated, and bad practice, as mentioned above.</p>
-
-<p>The other two are relatively interchangeable, at least for simple uses:</p>
-
-<ul>
- <li>Event handler properties have less power and options, but better cross-browser compatibility (being supported as far back as Internet Explorer 8). You should probably start with these as you are learning.</li>
- <li>DOM Level 2 Events (<code>addEventListener()</code>, etc.) are more powerful, but can also become more complex and are less well supported (supported as far back as Internet Explorer 9). You should also experiment with these, and aim to use them where possible.</li>
-</ul>
-
-<p>The main advantages of the third mechanism are that you can remove event handler code if needed, using <code>removeEventListener()</code>, and you can add multiple listeners of the same type to elements if required. For example, you can call <code>addEventListener('click', function() { ... })</code> on an element multiple times, with different functions specified in the second argument. This is impossible with event handler properties because any subsequent attempts to set a property will overwrite earlier ones, e.g.:</p>
-
-<pre class="brush: js notranslate">element.onclick = function1;
-element.onclick = function2;
-etc.</pre>
-
-<div class="note">
-<p><strong>Note</strong>: If you are called upon to support browsers older than Internet Explorer 8 in your work, you may run into difficulties, as such ancient browsers use different event models from newer browsers. But never fear, most JavaScript libraries (for example <code>jQuery</code>) have built-in functions that abstract away cross-browser differences. Don't worry about this too much at this stage in your learning journey.</p>
-</div>
-
-<h2 id="Other_event_concepts">Other event concepts</h2>
-
-<p>In this section, we will briefly cover some advanced concepts that are relevant to events. It is not important to understand these fully at this point, but it might serve to explain some code patterns you'll likely come across from time to time.</p>
-
-<h3 id="Event_objects">Event objects</h3>
-
-<p>Sometimes inside an event handler function, you might see a parameter specified with a name such as <code>event</code>, <code>evt</code>, or simply <code>e</code>. This is called the <strong>event object</strong>, and it is automatically passed to event handlers to provide extra features and information. For example, let's rewrite our random color example again slightly:</p>
-
-<pre class="brush: js notranslate">function bgChange(e) {
-  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-  e.target.style.backgroundColor = rndCol;
-  console.log(e);
-}
-
-btn.addEventListener('click', bgChange);</pre>
-
-<div class="note">
-<p><strong>Note</strong>: You can find the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-eventobject.html">full source code</a> for this example on GitHub (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/random-color-eventobject.html">see it running live</a>).</p>
-</div>
-
-<p>Here you can see that we are including an event object, <strong>e</strong>, in the function, and in the function setting a background color style on <code>e.target</code> — which is the button itself. The <code>target</code> property of the event object is always a reference to the element that the event has just occurred upon. So in this example, we are setting a random background color on the button, not the page.</p>
-
-<div class="note">
-<p><strong>Note</strong>: You can use any name you like for the event object — you just need to choose a name that you can then use to reference it inside the event handler function. <code>e</code>/<code>evt</code>/<code>event</code> are most commonly used by developers because they are short and easy to remember. It's always good to stick to a standard.</p>
-</div>
-
-<p><code>e.target</code> is incredibly useful when you want to set the same event handler on multiple elements and do something to all of them when an event occurs on them. You might, for example, have a set of 16 tiles that disappear when they are clicked on. It is useful to always be able to just set the thing to disappear as <code>e.target</code>, rather than having to select it in some more difficult way. In the following example (see <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/useful-eventtarget.html">useful-eventtarget.html</a> for the full source code; also see it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/useful-eventtarget.html">running live</a> here), we create 16 {{htmlelement("div")}} elements using JavaScript. We then select all of them using {{domxref("document.querySelectorAll()")}}, then loop through each one, adding an <code>onclick</code> handler to each that makes it so that a random color is applied to each one when clicked:</p>
-
-<pre class="brush: js notranslate">var divs = document.querySelectorAll('div');
-
-for (var i = 0; i &lt; divs.length; i++) {
-  divs[i].onclick = function(e) {
-    e.target.style.backgroundColor = bgChange();
-  }
-}</pre>
-
-<p>The output is as follows (try clicking around on it — have fun):</p>
-
-<div class="hidden">
-<h6 id="Hidden_example">Hidden example</h6>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Useful event target example&lt;/title&gt;
-    &lt;style&gt;
-      div {
-        height: 100px;
-        width: 25%;
-        float: left;
-      }
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;script&gt;
-      for (var i = 1; i &lt;= 16; i++) {
-        var myDiv = document.createElement('div');
-        myDiv.style.backgroundColor = "red";
-        document.body.appendChild(myDiv);
-      }
-
-      function random(number) {
-        return Math.floor(Math.random()*number);
-      }
-
-      function bgChange() {
-        var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
-        return rndCol;
-      }
-
-      var divs = document.querySelectorAll('div');
-
-      for (var i = 0; i &lt; divs.length; i++) {
-        divs[i].onclick = function(e) {
-          e.target.style.backgroundColor = bgChange();
-        }
-      }
-    &lt;/script&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Hidden_example', '100%', 400, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<p>Most event handlers you'll encounter just have a standard set of properties and functions (methods) available on the event object (see the {{domxref("Event")}} object reference for a full list). Some more advanced handlers, however, add specialist properties containing extra data that they need to function. The <a href="/en-US/docs/Web/API/MediaRecorder_API">Media Recorder API</a>, for example, has a <code>dataavailable</code> event, which fires when some audio or video has been recorded and is available for doing something with (for example saving it, or playing it back). The corresponding <a href="/en-US/docs/Web/API/MediaRecorder/ondataavailable">ondataavailable</a> handler's event object has a <code>data</code> property available containing the recorded audio or video data to allow you to access it and do something with it.</p>
-
-<h3 id="Preventing_default_behavior">Preventing default behavior</h3>
-
-<p>Sometimes, you'll come across a situation where you want to stop an event doing what it does by default. The most common example is that of a web form, for example, a custom registration form. When you fill in the details and press the submit button, the natural behaviour is for the data to be submitted to a specified page on the server for processing, and the browser to be redirected to a "success message" page of some kind (or the same page, if another is not specified.)</p>
-
-<p>The trouble comes when the user has not submitted the data correctly — as a developer, you'll want to stop the submission to the server and give them an error message telling them what's wrong and what needs to be done to put things right. Some browsers support automatic form data validation features, but since many don't, you are advised to not rely on those and implement your own validation checks. Let's look at a simple example.</p>
-
-<p>First, a simple HTML form that requires you to enter your first and last name:</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="fname"&gt;First name: &lt;/label&gt;
-    &lt;input id="fname" type="text"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="lname"&gt;Last name: &lt;/label&gt;
-    &lt;input id="lname" type="text"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-     &lt;input id="submit" type="submit"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;
-&lt;p&gt;&lt;/p&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">div {
-  margin-bottom: 10px;
-}
-</pre>
-</div>
-
-<p>Now some JavaScript — here we implement a very simple check inside an <a href="/en-US/docs/Web/API/GlobalEventHandlers/onsubmit">onsubmit</a> event handler (the submit event is fired on a form when it is submitted) that tests whether the text fields are empty. If they are, we call the <code><a href="/en-US/docs/Web/API/Event/preventDefault">preventDefault()</a></code> function on the event object — which stops the form submission — and then display an error message in the paragraph below our form to tell the user what's wrong:</p>
-
-<pre class="brush: js notranslate">var form = document.querySelector('form');
-var fname = document.getElementById('fname');
-var lname = document.getElementById('lname');
-var submit = document.getElementById('submit');
-var para = document.querySelector('p');
-
-form.onsubmit = function(e) {
-  if (fname.value === '' || lname.value === '') {
-    e.preventDefault();
-    para.textContent = 'You need to fill in both names!';
-  }
-}</pre>
-
-<p>Obviously, this is pretty weak form validation — it wouldn't stop the user validating the form with spaces or numbers entered into the fields, for example — but it is ok for example purposes. The output is as follows:</p>
-
-<p>{{ EmbedLiveSample('Preventing_default_behavior', '100%', 140, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<div class="note">
-<p><strong>Note</strong>: for the full source code, see <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/preventdefault-validation.html">preventdefault-validation.html</a> (also see it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/preventdefault-validation.html">running live</a> here.)</p>
-</div>
-
-<h3 id="Event_bubbling_and_capture">Event bubbling and capture</h3>
-
-<p>The final subject to cover here is something that you'll not come across often, but it can be a real pain if you don't understand it. Event bubbling and capture are two mechanisms that describe what happens when two handlers of the same event type are activated on one element. Let's look at an example to make this easier — open up the <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/show-video-box.html">show-video-box.html</a> example in a new tab (and the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/show-video-box.html">source code</a> in another tab.) It is also available live below:</p>
-
-<div class="hidden">
-<h6 id="Hidden_video_example">Hidden video example</h6>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="utf-8"&gt;
-    &lt;title&gt;Show video box example&lt;/title&gt;
-    &lt;style&gt;
-      div {
-        position: absolute;
-        top: 50%;
-        transform: translate(-50%,-50%);
-        width: 480px;
-        height: 380px;
-        border-radius: 10px;
-        background-color: #eee;
-        background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.1));
-      }
-
-      .hidden {
-        left: -50%;
-      }
-
-      .showing {
-        left: 50%;
-      }
-
-      div video {
-        display: block;
-        width: 400px;
-        margin: 40px auto;
-      }
-
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;button&gt;Display video&lt;/button&gt;
-
-    &lt;div class="hidden"&gt;
-      &lt;video&gt;
-        &lt;source src="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/events/rabbit320.mp4" type="video/mp4"&gt;
-        &lt;source src="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/events/rabbit320.webm" type="video/webm"&gt;
-        &lt;p&gt;Your browser doesn't support HTML5 video. Here is a &lt;a href="rabbit320.mp4"&gt;link to the video&lt;/a&gt; instead.&lt;/p&gt;
-      &lt;/video&gt;
-    &lt;/div&gt;
-
-    &lt;script&gt;
-
-      var btn = document.querySelector('button');
-      var videoBox = document.querySelector('div');
-      var video = document.querySelector('video');
-
-      btn.onclick = function() {
-        displayVideo();
-      }
-
-      function displayVideo() {
-        if(videoBox.getAttribute('class') === 'hidden') {
-          videoBox.setAttribute('class','showing');
-        }
-      }
-
-      videoBox.addEventListener('click',function() {
-        videoBox.setAttribute('class','hidden');
-      });
-
-      video.addEventListener('click',function() {
-        video.play();
-      });
-
-    &lt;/script&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Hidden_video_example', '100%', 500, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<p>This is a pretty simple example that shows and hides a {{htmlelement("div")}} with a {{htmlelement("video")}} element inside it:</p>
-
-<pre class="brush: html notranslate">&lt;button&gt;Display video&lt;/button&gt;
-
-&lt;div class="hidden"&gt;
-  &lt;video&gt;
-    &lt;source src="rabbit320.mp4" type="video/mp4"&gt;
-    &lt;source src="rabbit320.webm" type="video/webm"&gt;
-    &lt;p&gt;Your browser doesn't support HTML5 video. Here is a &lt;a href="rabbit320.mp4"&gt;link to the video&lt;/a&gt; instead.&lt;/p&gt;
-  &lt;/video&gt;
-&lt;/div&gt;</pre>
-
-<p>When the {{htmlelement("button")}} is clicked, the video is displayed, by changing the class attribute on the <code>&lt;div&gt;</code> from <code>hidden</code> to <code>showing</code> (the example's CSS contains these two classes, which position the box off the screen and on the screen, respectively):</p>
-
-<pre class="brush: js notranslate">btn.onclick = function() {
-  videoBox.setAttribute('class', 'showing');
-}</pre>
-
-<p>We then add a couple more <code>onclick</code> event handlers — the first one to the <code>&lt;div&gt;</code> and the second one to the <code>&lt;video&gt;</code>. The idea is that when the area of the <code>&lt;div&gt;</code> outside the video is clicked, the box should be hidden again; when the video itself is clicked, the video should start to play.</p>
-
-<pre class="brush: js notranslate">videoBox.onclick = function() {
-  videoBox.setAttribute('class', 'hidden');
-};
-
-video.onclick = function() {
-  video.play();
-};</pre>
-
-<p>But there's a problem — currently, when you click the video it starts to play, but it causes the <code>&lt;div&gt;</code> to also be hidden at the same time. This is because the video is inside the <code>&lt;div&gt;</code> — it is part of it — so clicking on the video actually runs <em>both</em> the above event handlers.</p>
-
-<h4 id="Bubbling_and_capturing_explained">Bubbling and capturing explained</h4>
-
-<p>When an event is fired on an element that has parent elements (e.g. the {{htmlelement("video")}} in our case), modern browsers run two different phases — the <strong>capturing</strong> phase and the <strong>bubbling</strong> phase.</p>
-
-<p>In the <strong>capturing</strong> phase:</p>
-
-<ul>
- <li>The browser checks to see if the element's outer-most ancestor ({{htmlelement("html")}}) has an <code>onclick</code> event handler registered on it in the capturing phase, and runs it if so.</li>
- <li>Then it moves on to the next element inside <code>&lt;html&gt;</code> and does the same thing, then the next one, and so on until it reaches the element that was actually clicked on.</li>
-</ul>
-
-<p>In the <strong>bubbling</strong> phase, the exact opposite occurs:</p>
-
-<ul>
- <li>The browser checks to see if the element that was actually clicked on has an <code>onclick</code> event handler registered on it in the bubbling phase, and runs it if so.</li>
- <li>Then it moves on to the next immediate ancestor element and does the same thing, then the next one, and so on until it reaches the <code>&lt;html&gt;</code> element.</li>
-</ul>
-
-<p><a href="https://mdn.mozillademos.org/files/14075/bubbling-capturing.png"><img alt="" src="https://mdn.mozillademos.org/files/14075/bubbling-capturing.png" style="display: block; height: 452px; margin: 0px auto; width: 960px;"></a></p>
-
-<p>(Click on image for bigger diagram)</p>
-
-<p>In modern browsers, by default, all event handlers are registered in the bubbling phase. So in our current example, when you click the video, the click event bubbles from the <code>&lt;video&gt;</code> element outwards to the <code>&lt;html&gt;</code> element. Along the way:</p>
-
-<ul>
- <li>It finds the <code>video.onclick...</code> handler and runs it, so the video first starts playing.</li>
- <li>It then finds the <code>videoBox.onclick...</code> handler and runs it, so the video is hidden as well.</li>
-</ul>
-
-<h4 id="Fixing_the_problem_with_stopPropagation">Fixing the problem with stopPropagation()</h4>
-
-<p>This is annoying behavior, but there is a way to fix it! The standard event object has a function available on it called <code><a href="/en-US/docs/Web/API/Event/stopPropagation">stopPropagation()</a></code>, which when invoked on a handler's event object makes it so that handler is run, but the event doesn't bubble any further up the chain, so no more handlers will be run.</p>
-
-<p>We can, therefore, fix our current problem by changing the second handler function in the previous code block to this:</p>
-
-<pre class="brush: js notranslate">video.onclick = function(e) {
-  e.stopPropagation();
-  video.play();
-};</pre>
-
-<p>You can try making a local copy of the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/show-video-box.html">show-video-box.html source code</a> and having a go at fixing it yourself, or looking at the fixed result in <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/show-video-box-fixed.html">show-video-box-fixed.html</a> (also see the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/show-video-box-fixed.html">source code</a> here).</p>
-
-<div class="note">
-<p><strong>Note</strong>: Why bother with both capturing and bubbling? Well, in the bad old days when browsers were much less cross-compatible than they are now, Netscape only used event capturing, and Internet Explorer used only event bubbling. When the W3C decided to try to standardize the behavior and reach a consensus, they ended up with this system that included both, which is the one modern browsers implemented.</p>
-</div>
-
-<div class="note">
-<p><strong>Note</strong>: As mentioned above, by default all event handlers are registered in the bubbling phase, and this makes more sense most of the time. If you really want to register an event in the capturing phase instead, you can do so by registering your handler using <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code>, and setting the optional third property to <code>true</code>.</p>
-</div>
-
-<h4 id="Event_delegation">Event delegation</h4>
-
-<p>Bubbling also allows us to take advantage of <strong>event delegation</strong> — this concept relies on the fact that if you want some code to run when you click on any one of a large number of child elements, you can set the event listener on their parent and have events that happen on them bubble up to their parent rather than having to set the event listener on every child individually. Remember earlier that we said bubbling involves checking the element the event is fired on for an event handler first, then moving up to the element's parent, etc.?</p>
-
-<p>A good example is a series of list items — if you want each one of them to pop up a message when clicked, you can set the <code>click</code> event listener on the parent <code>&lt;ul&gt;</code>, and events will bubble from the list items to the <code>&lt;ul&gt;</code>.</p>
-
-<p>This concept is explained further on David Walsh's blog, with multiple examples — see <a href="https://davidwalsh.name/event-delegate">How JavaScript Event Delegation Works</a>.</p>
-
-<h2 id="Conclusion">Conclusion</h2>
-
-<p>You should now know all you need to know about web events at this early stage. As mentioned above, events are not really part of the core JavaScript — they are defined in browser Web APIs.</p>
-
-<p>Also, it is important to understand that the different contexts in which JavaScript is used tend to have different event models — from Web APIs to other areas such as browser WebExtensions and Node.js (server-side JavaScript). We are not expecting you to understand all these areas now, but it certainly helps to understand the basics of events as you forge ahead with learning web development.</p>
-
-<p>If there is anything you didn't understand, feel free to read through the article again, or <a href="/en-US/Learn#Contact_us">contact us</a> to ask for help.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="http://www.quirksmode.org/js/events_order.html">Event order</a> (discussion of capturing and bubbling) — an excellently detailed piece by Peter-Paul Koch.</li>
- <li><a href="http://www.quirksmode.org/js/events_access.html">Event accessing</a> (discussion of the event object) — another excellently detailed piece by Peter-Paul Koch.</li>
- <li><a href="/en-US/docs/Web/Events">Event reference</a></li>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Return_values","Learn/JavaScript/Building_blocks/Image_gallery", "Learn/JavaScript/Building_blocks")}}</p>
-
-<h2 id="In_this_module">In this module</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
-</ul>
diff --git a/files/es/learn/javascript/building_blocks/events/index.html b/files/es/learn/javascript/building_blocks/events/index.html
new file mode 100644
index 0000000000..5fc7ee8df5
--- /dev/null
+++ b/files/es/learn/javascript/building_blocks/events/index.html
@@ -0,0 +1,579 @@
+---
+title: Introducción a eventos
+slug: Learn/JavaScript/Building_blocks/Events
+translation_of: Learn/JavaScript/Building_blocks/Events
+original_slug: Learn/JavaScript/Building_blocks/Eventos
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Return_values","Learn/JavaScript/Building_blocks/Image_gallery", "Learn/JavaScript/Building_blocks")}}</div>
+
+<p class="summary">Los eventos son acciones u ocurrencias que suceden en el sistema que está programando y que el sistema le informa para que pueda responder de alguna manera si lo desea. Por ejemplo, si el usuario hace clic en un botón en una página web, es posible que desee responder a esa acción mostrando un cuadro de información. En este artículo, discutiremos algunos conceptos importantes que rodean los eventos y veremos cómo funcionan en los navegadores. Este no será un estudio exhaustivo; solo lo que necesitas saber en esta etapa.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, entendimiento básico de HTML y CSS, <a href="https://developer.mozilla.org/es/docs/Learn/JavaScript/First_steps">Primeros pasos con JavaScript</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender la teoría fundamental de los eventos, cómo funcionan en los navegadores y cómo los eventos pueden diferir en distintos entornos de programación.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Una_serie_de_eventos_afortunados">Una serie de eventos afortunados</h2>
+
+<p>Como se mencionó anteriormente, los <strong>eventos</strong> son acciones u ocurrencias que suceden en el sistema que está programando — el sistema disparará una señal de algún tipo cuando un evento ocurra y también proporcionará un mecanismo por el cual se puede tomar algún tipo de acción automáticamente (p.e., ejecutando algún código) cuando se produce el evento. Por ejemplo, en un aeropuerto cuando la pista está despejada para que despegue un avión, se comunica una señal al piloto y, como resultado, comienzan a pilotar el avión.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14077/MDN-mozilla-events-runway.png" style="display: block; margin: 0px auto;"></p>
+
+<p>En el caso de la Web, los eventos se desencadenan dentro de la ventana del navegador y tienden a estar unidos a un elemento específico que reside en ella — podría ser un solo elemento, un conjunto de elementos, el documento HTML cargado en la pestaña actual o toda la ventana del navegador. Hay muchos tipos diferentes de eventos que pueden ocurrir, por ejemplo:</p>
+
+<ul>
+ <li>El usuario hace clic con el mouse sobre un elemento determinado o coloca el cursor sobre un elemento determinado.</li>
+ <li>El usuario presiona una tecla en el teclado.</li>
+ <li>El usuario cambia el tamaño o cierra la ventana del navegador.</li>
+ <li>Una página web termina de cargar.</li>
+ <li>Un formulario se envía</li>
+ <li>Un video se reproduce, pausa o finaliza la reproducción.</li>
+ <li>Un error ocurre.</li>
+</ul>
+
+<p>Se deducirá de esto (y echar un vistazo a MDN <a href="https://developer.mozilla.org/es/docs/Web/Events">Referencia de eventos</a>) que hay <strong>muchos</strong> eventos a los que se puede responder.</p>
+
+<p>Cada evento disponible tiene un <strong>controlador de eventos</strong>, que es un bloque de código (generalmente una función JavaScript definida por el usuario) que se ejecutará cuando se active el evento. Cuando dicho bloque de código se define para ejecutarse en respuesta a un disparo de evento, decimos que estamos <strong>registrando un controlador de eventos</strong>. Tenga en cuenta que los controladores de eventos a veces se llaman <strong>oyentes de eventos</strong> — son bastante intercambiables para nuestros propósitos, aunque estrictamente hablando, trabajan juntos. El oyente escucha si ocurre el evento y el controlador es el código que se ejecuta en respuesta a que ocurra.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Es útil tener en cuenta que los eventos web no son parte del lenguaje central de JavaScript: se definen como parte de las API integradas en el navegador.</p>
+</div>
+
+<h3 id="Un_ejemplo_simple">Un ejemplo simple</h3>
+
+<p>Veamos un ejemplo simple para explicar lo que queremos decir aquí. Ya has visto eventos y controladores de eventos en muchos de los ejemplos de este curso, pero vamos a recapitular solo para consolidar nuestro conocimiento. En el siguiente ejemplo, tenemos un solo {{htmlelement ("button")}}, que cuando se presiona, hará que el fondo cambie a un color aleatorio:</p>
+
+<pre class="brush: html notranslate">&lt;button&gt;Cambiar color&lt;/button&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">button { margin: 10px };</pre>
+</div>
+
+<p>El JavaScript se ve así:</p>
+
+<pre class="brush: js notranslate">const btn = document.querySelector('button');
+
+function random(number) {
+  return Math.floor(Math.random() * (number+1));
+}
+
+btn.onclick = function() {
+  const rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+  document.body.style.backgroundColor = rndCol;
+}</pre>
+
+<p>En este código, almacenamos una referencia al botón dentro de una variable llamada <code>btn</code>, usando la función {{domxref ("Document.querySelector ()")}}. También definimos una función que devuelve un número aleatorio. La tercera parte del código es el controlador de eventos. La variable <code>btn</code> apunta a un elemento <code>&lt;button&gt;</code>, y este tipo de objeto tiene una serie de eventos que pueden activarse y, por lo tanto, los controladores de eventos están disponibles. Estamos escuchando el disparo del evento "click", estableciendo la propiedad del controlador de eventos <code>onclick</code> para que sea igual a una función anónima que contiene código que generó un color RGB aleatorio y establece el <code>&lt;body&gt;</code> color de fondo igual a este.</p>
+
+<p>Este código ahora se ejecutará cada vez que se active el evento "click" en el elemento <code>&lt;button&gt;</code>, es decir, cada vez que un usuario haga clic en él.</p>
+
+<p>El resultado de ejemplo es el siguiente:</p>
+
+<p>{{ EmbedLiveSample('A_simple_example', '100%', 200, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h3 id="No_son_solo_páginas_web">No son solo páginas web</h3>
+
+<p>Otra cosa que vale la pena mencionar en este punto es que los eventos no son particulares de JavaScript — la mayoría de los lenguajes de programación tienen algún tipo de modelo de eventos, y la forma en que funciona a menudo diferirá de la forma en que funciona en JavaScript. De hecho, el modelo de eventos en JavaScript para páginas web difiere del modelo de eventos para JavaScript, ya que se utiliza en otros entornos.</p>
+
+<p>Por ejemplo, <a href="/en-US/docs/Learn/Server-side/Express_Nodejs">Node.js</a> es un entorno en tiempo de ejecución de JavaScript muy popular que permite a los desarrolladores usar JavaScript para crear aplicaciones de red y del lado del servidor. El <a href="https://nodejs.org/docs/latest-v5.x/api/events.html">modelo de eventos de Node.js</a> se basa en que los oyentes (<em>listeners</em>) escuchen eventos y los emisores (<em>emitters</em>) emitan eventos periódicamente — no suena tan diferentes, pero el código es bastante diferente, haciendo uso de funciones como <code>on()</code> para registrar un oyente de eventos, y <code>once()</code> para registrar un oyente de eventos que anula el registro después de que se haya ejecutado una vez. The <a href="https://nodejs.org/docs/latest-v8.x/api/http.html#http_event_connect">documentos de eventos de conexión HTTP</a> proporcionan un buen ejemplo de uso.</p>
+
+<p>Como otro ejemplo, ahora también puede usar JavaScript para crear complementos de navegadores — mejoras de funcionalidad del navegador — utilizando una tecnología llamada <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a>. El modelo de eventos es similar al modelo de eventos web, pero un poco diferente — las propiedades de los oyentes de eventos se escriben en <em>camel-case</em> (ej. <code>onMessage</code> en lugar de <code>onmessage</code>), y deben combinarse con la función <code>addListener</code>. Consulte la página <a href="/en-US/Add-ons/WebExtensions/API/runtime/onMessage#Examples">runtime.onMessage </a>para ver un ejemplo.</p>
+
+<p>No necesita comprender nada sobre otros entornos en esta etapa de su aprendizaje; solo queríamos dejar en claro que los eventos pueden diferir en diferentes entornos de programación.</p>
+
+<h2 id="Diferentes_formas_de_uso_de_eventos">Diferentes formas de uso de eventos</h2>
+
+<p>Hay muchas maneras distintas en las que puedes agregar event listeners a los sitios web, que se ejecutara cuando el evento asociado se dispare. En esta sección, revisaremos los diferentes mecanismos y discutiremos cuales deberias usar..</p>
+
+<h3 id="Propiedades_de_manejadores_de_eventos">Propiedades de manejadores de eventos</h3>
+
+<p>Estas son las propiedades que existen, que contienen codigo de manejadores de eventos(Event Handler)  que vemos frecuentemente durante el curso.. Volviendo al ejemplo de arriba:</p>
+
+<pre class="brush: js notranslate">var btn = document.querySelector('button');
+
+btn.onclick = function() {
+  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+  document.body.style.backgroundColor = rndCol;
+}</pre>
+
+<p>La propiedad <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onclick">onclick</a></code> es la propiedad del manejador de eventos que está siendo usada en esta situación. Es escencialmente una propiedad como cualquier otra disponible en el botón (por ejemplo: <code><a href="/en-US/docs/Web/API/Node/textContent">btn.textContent</a></code>, or <code><a href="/en-US/docs/Web/API/HTMLElement/style">btn.style</a></code>), pero es de un tipo especial — cuando lo configura para ser igual a algún código, ese código se ejecutará cuando el evento se dispare en el botón.</p>
+
+<p>You could also set the handler property to be equal to a named function name (like we saw in <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a>). The following would work just the same:</p>
+
+<pre class="brush: js notranslate">var btn = document.querySelector('button');
+
+function bgChange() {
+  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+  document.body.style.backgroundColor = rndCol;
+}
+
+btn.onclick = bgChange;</pre>
+
+<p>There are many different event handler properties available. Let's do an experiment.</p>
+
+<p>First of all, make a local copy of <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-eventhandlerproperty.html">random-color-eventhandlerproperty.html</a>, and open it in your browser. It's just a copy of the simple random color example we've been playing with already in this article. Now try changing <code>btn.onclick</code> to the following different values in turn, and observing the results in the example:</p>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onfocus">btn.onfocus</a></code> and <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onblur">btn.onblur</a></code> — The color will change when the button is focused and unfocused (try pressing tab to tab on to the button and off again). These are often used to display information about how to fill in form fields when they are focused, or display an error message if a form field has just been filled in with an incorrect value.</li>
+ <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/ondblclick">btn.ondblclick</a></code> — The color will change only when it is double-clicked.</li>
+ <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeypress">window.onkeypress</a></code>, <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">window.onkeydown</a></code>, <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">window.onkeyup</a></code> — The color will change when a key is pressed on the keyboard. <code>keypress</code> refers to a general press (button down and then up), while <code>keydown</code> and <code>keyup</code> refer to just the key down and key up parts of the keystroke, respectively. Note that it doesn't work if you try to register this event handler on the button itself — we've had to register it on the <a href="/en-US/docs/Web/API/Window">window</a> object, which represents the entire browser window.</li>
+ <li><code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onmouseover">btn.onmouseover</a></code> and <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onmouseout">btn.onmouseout</a></code> — The color will change when the mouse pointer is moved so it begins hovering over the button, or when it stops hovering over the button and moves off of it, respectively.</li>
+</ul>
+
+<p>Some events are very general and available nearly anywhere (for example an <code>onclick</code> handler can be registered on nearly any element), whereas some are more specific and only useful in certain situations (for example it makes sense to use <a href="/en-US/docs/Web/API/GlobalEventHandlers/GlobalEventHandlers.onplay">onplay</a> only on specific elements, such as {{htmlelement("video")}}).</p>
+
+<h3 id="Inline_event_handlers_—_dont_use_these">Inline event handlers — don't use these</h3>
+
+<p>You might also see a pattern like this in your code:</p>
+
+<pre class="brush: html notranslate">&lt;button onclick="bgChange()"&gt;Press me&lt;/button&gt;
+</pre>
+
+<pre class="brush: js notranslate">function bgChange() {
+  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+  document.body.style.backgroundColor = rndCol;
+}</pre>
+
+<div class="note">
+<p><strong>Note</strong>: You can find the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-eventhandlerattributes.html">full source code</a> for this example on GitHub (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/random-color-eventhandlerattributes.html">see it running live</a>).</p>
+</div>
+
+<p>The earliest method of registering event handlers found on the Web involved <strong>event handler HTML attributes</strong> (aka <strong>inline event handlers</strong>) like the one shown above — the attribute value is literally the JavaScript code you want to run when the event occurs. The above example invokes a function defined inside a {{htmlelement("script")}} element on the same page, but you could also insert JavaScript directly inside the attribute, for example:</p>
+
+<pre class="brush: html notranslate">&lt;button onclick="alert('Hello, this is my old-fashioned event handler!');"&gt;Press me&lt;/button&gt;</pre>
+
+<p>You'll find HTML attribute equivalents for many of the event handler properties; however, you shouldn't use these — they are considered bad practice. It might seem easy to use an event handler attribute if you are just doing something really quick, but they very quickly become unmanageable and inefficient.</p>
+
+<p>For a start, it is not a good idea to mix up your HTML and your JavaScript, as it becomes hard to parse — keeping your JavaScript all in one place is better; if it is in a separate file you can apply it to multiple HTML documents.</p>
+
+<p>Even in a single file, inline event handlers are not a good idea. One button is OK, but what if you had 100 buttons? You'd have to add 100 attributes to the file; it would very quickly turn into a maintenance nightmare. With JavaScript, you could easily add an event handler function to all the buttons on the page no matter how many there were, using something like this:</p>
+
+<pre class="brush: js notranslate">var buttons = document.querySelectorAll('button');
+
+for (var i = 0; i &lt; buttons.length; i++) {
+  buttons[i].onclick = bgChange;
+}</pre>
+
+<p class="brush: js">Note that another option here would be to use the <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach">forEach()</a></code> built-in method available on all Array objects:</p>
+
+<pre class="brush: js notranslate">buttons.forEach(function(button) {
+  button.onclick = bgChange;
+});</pre>
+
+<div class="note">
+<p><strong>Note</strong>: Separating your programming logic from your content also makes your site more friendly to search engines.</p>
+</div>
+
+<h3 id="addEventListener_and_removeEventListener">addEventListener() and removeEventListener()</h3>
+
+<p>The newest type of event mechanism is defined in the <a href="https://www.w3.org/TR/DOM-Level-2-Events/">Document Object Model (DOM) Level 2 Events</a> Specification, which provides browsers with a new function — <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code>. This functions in a similar way to the event handler properties, but the syntax is obviously different. We could rewrite our random color example to look like this:</p>
+
+<pre class="brush: js notranslate">var btn = document.querySelector('button');
+
+function bgChange() {
+  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+  document.body.style.backgroundColor = rndCol;
+}
+
+btn.addEventListener('click', bgChange);</pre>
+
+<div class="note">
+<p><strong>Note</strong>: You can find the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-addeventlistener.html">full source code</a> for this example on GitHub (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/random-color-addeventlistener.html">see it running live</a>).</p>
+</div>
+
+<p>Inside the <code>addEventListener()</code> function, we specify two parameters — the name of the event we want to register this handler for, and the code that comprises the handler function we want to run in response to it. Note that it is perfectly appropriate to put all the code inside the <code>addEventListener()</code> function, in an anonymous function, like this:</p>
+
+<pre class="brush: js notranslate">btn.addEventListener('click', function() {
+  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+  document.body.style.backgroundColor = rndCol;
+});</pre>
+
+<p>This mechanism has some advantages over the older mechanisms discussed earlier. For a start, there is a counterpart function, <code><a href="/en-US/docs/Web/API/EventTarget/removeEventListener">removeEventListener()</a></code>, which removes a previously added listener. For example, this would remove the listener set in the first code block in this section:</p>
+
+<pre class="brush: js notranslate">btn.removeEventListener('click', bgChange);</pre>
+
+<p>This isn't significant for simple, small programs, but for larger, more complex programs it can improve efficiency to clean up old unused event handlers. Plus, for example, this allows you to have the same button performing different actions in different circumstances — all you've got to do is add/remove event handlers as appropriate.</p>
+
+<p>Second, you can also register multiple handlers for the same listener. The following two handlers would not be applied:</p>
+
+<pre class="brush: js notranslate">myElement.onclick = functionA;
+myElement.onclick = functionB;</pre>
+
+<p>As the second line would overwrite the value of <code>onclick</code> set by the first. This would work, however:</p>
+
+<pre class="brush: js notranslate">myElement.addEventListener('click', functionA);
+myElement.addEventListener('click', functionB);</pre>
+
+<p>Both functions would now run when the element is clicked.</p>
+
+<p>In addition, there are a number of other powerful features and options available with this event mechanism. These are a little out of scope for this article, but if you want to read up on them, have a look at the <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> and <code><a href="/en-US/docs/Web/API/EventTarget/removeEventListener">removeEventListener()</a></code> reference pages.</p>
+
+<h3 id="What_mechanism_should_I_use">What mechanism should I use?</h3>
+
+<p>Of the three mechanisms, you definitely shouldn't use the HTML event handler attributes — these are outdated, and bad practice, as mentioned above.</p>
+
+<p>The other two are relatively interchangeable, at least for simple uses:</p>
+
+<ul>
+ <li>Event handler properties have less power and options, but better cross-browser compatibility (being supported as far back as Internet Explorer 8). You should probably start with these as you are learning.</li>
+ <li>DOM Level 2 Events (<code>addEventListener()</code>, etc.) are more powerful, but can also become more complex and are less well supported (supported as far back as Internet Explorer 9). You should also experiment with these, and aim to use them where possible.</li>
+</ul>
+
+<p>The main advantages of the third mechanism are that you can remove event handler code if needed, using <code>removeEventListener()</code>, and you can add multiple listeners of the same type to elements if required. For example, you can call <code>addEventListener('click', function() { ... })</code> on an element multiple times, with different functions specified in the second argument. This is impossible with event handler properties because any subsequent attempts to set a property will overwrite earlier ones, e.g.:</p>
+
+<pre class="brush: js notranslate">element.onclick = function1;
+element.onclick = function2;
+etc.</pre>
+
+<div class="note">
+<p><strong>Note</strong>: If you are called upon to support browsers older than Internet Explorer 8 in your work, you may run into difficulties, as such ancient browsers use different event models from newer browsers. But never fear, most JavaScript libraries (for example <code>jQuery</code>) have built-in functions that abstract away cross-browser differences. Don't worry about this too much at this stage in your learning journey.</p>
+</div>
+
+<h2 id="Other_event_concepts">Other event concepts</h2>
+
+<p>In this section, we will briefly cover some advanced concepts that are relevant to events. It is not important to understand these fully at this point, but it might serve to explain some code patterns you'll likely come across from time to time.</p>
+
+<h3 id="Event_objects">Event objects</h3>
+
+<p>Sometimes inside an event handler function, you might see a parameter specified with a name such as <code>event</code>, <code>evt</code>, or simply <code>e</code>. This is called the <strong>event object</strong>, and it is automatically passed to event handlers to provide extra features and information. For example, let's rewrite our random color example again slightly:</p>
+
+<pre class="brush: js notranslate">function bgChange(e) {
+  var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+  e.target.style.backgroundColor = rndCol;
+  console.log(e);
+}
+
+btn.addEventListener('click', bgChange);</pre>
+
+<div class="note">
+<p><strong>Note</strong>: You can find the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/random-color-eventobject.html">full source code</a> for this example on GitHub (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/random-color-eventobject.html">see it running live</a>).</p>
+</div>
+
+<p>Here you can see that we are including an event object, <strong>e</strong>, in the function, and in the function setting a background color style on <code>e.target</code> — which is the button itself. The <code>target</code> property of the event object is always a reference to the element that the event has just occurred upon. So in this example, we are setting a random background color on the button, not the page.</p>
+
+<div class="note">
+<p><strong>Note</strong>: You can use any name you like for the event object — you just need to choose a name that you can then use to reference it inside the event handler function. <code>e</code>/<code>evt</code>/<code>event</code> are most commonly used by developers because they are short and easy to remember. It's always good to stick to a standard.</p>
+</div>
+
+<p><code>e.target</code> is incredibly useful when you want to set the same event handler on multiple elements and do something to all of them when an event occurs on them. You might, for example, have a set of 16 tiles that disappear when they are clicked on. It is useful to always be able to just set the thing to disappear as <code>e.target</code>, rather than having to select it in some more difficult way. In the following example (see <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/useful-eventtarget.html">useful-eventtarget.html</a> for the full source code; also see it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/useful-eventtarget.html">running live</a> here), we create 16 {{htmlelement("div")}} elements using JavaScript. We then select all of them using {{domxref("document.querySelectorAll()")}}, then loop through each one, adding an <code>onclick</code> handler to each that makes it so that a random color is applied to each one when clicked:</p>
+
+<pre class="brush: js notranslate">var divs = document.querySelectorAll('div');
+
+for (var i = 0; i &lt; divs.length; i++) {
+  divs[i].onclick = function(e) {
+    e.target.style.backgroundColor = bgChange();
+  }
+}</pre>
+
+<p>The output is as follows (try clicking around on it — have fun):</p>
+
+<div class="hidden">
+<h6 id="Hidden_example">Hidden example</h6>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Useful event target example&lt;/title&gt;
+    &lt;style&gt;
+      div {
+        height: 100px;
+        width: 25%;
+        float: left;
+      }
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;script&gt;
+      for (var i = 1; i &lt;= 16; i++) {
+        var myDiv = document.createElement('div');
+        myDiv.style.backgroundColor = "red";
+        document.body.appendChild(myDiv);
+      }
+
+      function random(number) {
+        return Math.floor(Math.random()*number);
+      }
+
+      function bgChange() {
+        var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')';
+        return rndCol;
+      }
+
+      var divs = document.querySelectorAll('div');
+
+      for (var i = 0; i &lt; divs.length; i++) {
+        divs[i].onclick = function(e) {
+          e.target.style.backgroundColor = bgChange();
+        }
+      }
+    &lt;/script&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Hidden_example', '100%', 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<p>Most event handlers you'll encounter just have a standard set of properties and functions (methods) available on the event object (see the {{domxref("Event")}} object reference for a full list). Some more advanced handlers, however, add specialist properties containing extra data that they need to function. The <a href="/en-US/docs/Web/API/MediaRecorder_API">Media Recorder API</a>, for example, has a <code>dataavailable</code> event, which fires when some audio or video has been recorded and is available for doing something with (for example saving it, or playing it back). The corresponding <a href="/en-US/docs/Web/API/MediaRecorder/ondataavailable">ondataavailable</a> handler's event object has a <code>data</code> property available containing the recorded audio or video data to allow you to access it and do something with it.</p>
+
+<h3 id="Preventing_default_behavior">Preventing default behavior</h3>
+
+<p>Sometimes, you'll come across a situation where you want to stop an event doing what it does by default. The most common example is that of a web form, for example, a custom registration form. When you fill in the details and press the submit button, the natural behaviour is for the data to be submitted to a specified page on the server for processing, and the browser to be redirected to a "success message" page of some kind (or the same page, if another is not specified.)</p>
+
+<p>The trouble comes when the user has not submitted the data correctly — as a developer, you'll want to stop the submission to the server and give them an error message telling them what's wrong and what needs to be done to put things right. Some browsers support automatic form data validation features, but since many don't, you are advised to not rely on those and implement your own validation checks. Let's look at a simple example.</p>
+
+<p>First, a simple HTML form that requires you to enter your first and last name:</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="fname"&gt;First name: &lt;/label&gt;
+    &lt;input id="fname" type="text"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="lname"&gt;Last name: &lt;/label&gt;
+    &lt;input id="lname" type="text"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+     &lt;input id="submit" type="submit"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;
+&lt;p&gt;&lt;/p&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">div {
+  margin-bottom: 10px;
+}
+</pre>
+</div>
+
+<p>Now some JavaScript — here we implement a very simple check inside an <a href="/en-US/docs/Web/API/GlobalEventHandlers/onsubmit">onsubmit</a> event handler (the submit event is fired on a form when it is submitted) that tests whether the text fields are empty. If they are, we call the <code><a href="/en-US/docs/Web/API/Event/preventDefault">preventDefault()</a></code> function on the event object — which stops the form submission — and then display an error message in the paragraph below our form to tell the user what's wrong:</p>
+
+<pre class="brush: js notranslate">var form = document.querySelector('form');
+var fname = document.getElementById('fname');
+var lname = document.getElementById('lname');
+var submit = document.getElementById('submit');
+var para = document.querySelector('p');
+
+form.onsubmit = function(e) {
+  if (fname.value === '' || lname.value === '') {
+    e.preventDefault();
+    para.textContent = 'You need to fill in both names!';
+  }
+}</pre>
+
+<p>Obviously, this is pretty weak form validation — it wouldn't stop the user validating the form with spaces or numbers entered into the fields, for example — but it is ok for example purposes. The output is as follows:</p>
+
+<p>{{ EmbedLiveSample('Preventing_default_behavior', '100%', 140, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<div class="note">
+<p><strong>Note</strong>: for the full source code, see <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/preventdefault-validation.html">preventdefault-validation.html</a> (also see it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/preventdefault-validation.html">running live</a> here.)</p>
+</div>
+
+<h3 id="Event_bubbling_and_capture">Event bubbling and capture</h3>
+
+<p>The final subject to cover here is something that you'll not come across often, but it can be a real pain if you don't understand it. Event bubbling and capture are two mechanisms that describe what happens when two handlers of the same event type are activated on one element. Let's look at an example to make this easier — open up the <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/show-video-box.html">show-video-box.html</a> example in a new tab (and the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/show-video-box.html">source code</a> in another tab.) It is also available live below:</p>
+
+<div class="hidden">
+<h6 id="Hidden_video_example">Hidden video example</h6>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Show video box example&lt;/title&gt;
+    &lt;style&gt;
+      div {
+        position: absolute;
+        top: 50%;
+        transform: translate(-50%,-50%);
+        width: 480px;
+        height: 380px;
+        border-radius: 10px;
+        background-color: #eee;
+        background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.1));
+      }
+
+      .hidden {
+        left: -50%;
+      }
+
+      .showing {
+        left: 50%;
+      }
+
+      div video {
+        display: block;
+        width: 400px;
+        margin: 40px auto;
+      }
+
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;button&gt;Display video&lt;/button&gt;
+
+    &lt;div class="hidden"&gt;
+      &lt;video&gt;
+        &lt;source src="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/events/rabbit320.mp4" type="video/mp4"&gt;
+        &lt;source src="https://raw.githubusercontent.com/mdn/learning-area/master/javascript/building-blocks/events/rabbit320.webm" type="video/webm"&gt;
+        &lt;p&gt;Your browser doesn't support HTML5 video. Here is a &lt;a href="rabbit320.mp4"&gt;link to the video&lt;/a&gt; instead.&lt;/p&gt;
+      &lt;/video&gt;
+    &lt;/div&gt;
+
+    &lt;script&gt;
+
+      var btn = document.querySelector('button');
+      var videoBox = document.querySelector('div');
+      var video = document.querySelector('video');
+
+      btn.onclick = function() {
+        displayVideo();
+      }
+
+      function displayVideo() {
+        if(videoBox.getAttribute('class') === 'hidden') {
+          videoBox.setAttribute('class','showing');
+        }
+      }
+
+      videoBox.addEventListener('click',function() {
+        videoBox.setAttribute('class','hidden');
+      });
+
+      video.addEventListener('click',function() {
+        video.play();
+      });
+
+    &lt;/script&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Hidden_video_example', '100%', 500, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<p>This is a pretty simple example that shows and hides a {{htmlelement("div")}} with a {{htmlelement("video")}} element inside it:</p>
+
+<pre class="brush: html notranslate">&lt;button&gt;Display video&lt;/button&gt;
+
+&lt;div class="hidden"&gt;
+  &lt;video&gt;
+    &lt;source src="rabbit320.mp4" type="video/mp4"&gt;
+    &lt;source src="rabbit320.webm" type="video/webm"&gt;
+    &lt;p&gt;Your browser doesn't support HTML5 video. Here is a &lt;a href="rabbit320.mp4"&gt;link to the video&lt;/a&gt; instead.&lt;/p&gt;
+  &lt;/video&gt;
+&lt;/div&gt;</pre>
+
+<p>When the {{htmlelement("button")}} is clicked, the video is displayed, by changing the class attribute on the <code>&lt;div&gt;</code> from <code>hidden</code> to <code>showing</code> (the example's CSS contains these two classes, which position the box off the screen and on the screen, respectively):</p>
+
+<pre class="brush: js notranslate">btn.onclick = function() {
+  videoBox.setAttribute('class', 'showing');
+}</pre>
+
+<p>We then add a couple more <code>onclick</code> event handlers — the first one to the <code>&lt;div&gt;</code> and the second one to the <code>&lt;video&gt;</code>. The idea is that when the area of the <code>&lt;div&gt;</code> outside the video is clicked, the box should be hidden again; when the video itself is clicked, the video should start to play.</p>
+
+<pre class="brush: js notranslate">videoBox.onclick = function() {
+  videoBox.setAttribute('class', 'hidden');
+};
+
+video.onclick = function() {
+  video.play();
+};</pre>
+
+<p>But there's a problem — currently, when you click the video it starts to play, but it causes the <code>&lt;div&gt;</code> to also be hidden at the same time. This is because the video is inside the <code>&lt;div&gt;</code> — it is part of it — so clicking on the video actually runs <em>both</em> the above event handlers.</p>
+
+<h4 id="Bubbling_and_capturing_explained">Bubbling and capturing explained</h4>
+
+<p>When an event is fired on an element that has parent elements (e.g. the {{htmlelement("video")}} in our case), modern browsers run two different phases — the <strong>capturing</strong> phase and the <strong>bubbling</strong> phase.</p>
+
+<p>In the <strong>capturing</strong> phase:</p>
+
+<ul>
+ <li>The browser checks to see if the element's outer-most ancestor ({{htmlelement("html")}}) has an <code>onclick</code> event handler registered on it in the capturing phase, and runs it if so.</li>
+ <li>Then it moves on to the next element inside <code>&lt;html&gt;</code> and does the same thing, then the next one, and so on until it reaches the element that was actually clicked on.</li>
+</ul>
+
+<p>In the <strong>bubbling</strong> phase, the exact opposite occurs:</p>
+
+<ul>
+ <li>The browser checks to see if the element that was actually clicked on has an <code>onclick</code> event handler registered on it in the bubbling phase, and runs it if so.</li>
+ <li>Then it moves on to the next immediate ancestor element and does the same thing, then the next one, and so on until it reaches the <code>&lt;html&gt;</code> element.</li>
+</ul>
+
+<p><a href="https://mdn.mozillademos.org/files/14075/bubbling-capturing.png"><img alt="" src="https://mdn.mozillademos.org/files/14075/bubbling-capturing.png" style="display: block; height: 452px; margin: 0px auto; width: 960px;"></a></p>
+
+<p>(Click on image for bigger diagram)</p>
+
+<p>In modern browsers, by default, all event handlers are registered in the bubbling phase. So in our current example, when you click the video, the click event bubbles from the <code>&lt;video&gt;</code> element outwards to the <code>&lt;html&gt;</code> element. Along the way:</p>
+
+<ul>
+ <li>It finds the <code>video.onclick...</code> handler and runs it, so the video first starts playing.</li>
+ <li>It then finds the <code>videoBox.onclick...</code> handler and runs it, so the video is hidden as well.</li>
+</ul>
+
+<h4 id="Fixing_the_problem_with_stopPropagation">Fixing the problem with stopPropagation()</h4>
+
+<p>This is annoying behavior, but there is a way to fix it! The standard event object has a function available on it called <code><a href="/en-US/docs/Web/API/Event/stopPropagation">stopPropagation()</a></code>, which when invoked on a handler's event object makes it so that handler is run, but the event doesn't bubble any further up the chain, so no more handlers will be run.</p>
+
+<p>We can, therefore, fix our current problem by changing the second handler function in the previous code block to this:</p>
+
+<pre class="brush: js notranslate">video.onclick = function(e) {
+  e.stopPropagation();
+  video.play();
+};</pre>
+
+<p>You can try making a local copy of the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/show-video-box.html">show-video-box.html source code</a> and having a go at fixing it yourself, or looking at the fixed result in <a href="http://mdn.github.io/learning-area/javascript/building-blocks/events/show-video-box-fixed.html">show-video-box-fixed.html</a> (also see the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/events/show-video-box-fixed.html">source code</a> here).</p>
+
+<div class="note">
+<p><strong>Note</strong>: Why bother with both capturing and bubbling? Well, in the bad old days when browsers were much less cross-compatible than they are now, Netscape only used event capturing, and Internet Explorer used only event bubbling. When the W3C decided to try to standardize the behavior and reach a consensus, they ended up with this system that included both, which is the one modern browsers implemented.</p>
+</div>
+
+<div class="note">
+<p><strong>Note</strong>: As mentioned above, by default all event handlers are registered in the bubbling phase, and this makes more sense most of the time. If you really want to register an event in the capturing phase instead, you can do so by registering your handler using <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code>, and setting the optional third property to <code>true</code>.</p>
+</div>
+
+<h4 id="Event_delegation">Event delegation</h4>
+
+<p>Bubbling also allows us to take advantage of <strong>event delegation</strong> — this concept relies on the fact that if you want some code to run when you click on any one of a large number of child elements, you can set the event listener on their parent and have events that happen on them bubble up to their parent rather than having to set the event listener on every child individually. Remember earlier that we said bubbling involves checking the element the event is fired on for an event handler first, then moving up to the element's parent, etc.?</p>
+
+<p>A good example is a series of list items — if you want each one of them to pop up a message when clicked, you can set the <code>click</code> event listener on the parent <code>&lt;ul&gt;</code>, and events will bubble from the list items to the <code>&lt;ul&gt;</code>.</p>
+
+<p>This concept is explained further on David Walsh's blog, with multiple examples — see <a href="https://davidwalsh.name/event-delegate">How JavaScript Event Delegation Works</a>.</p>
+
+<h2 id="Conclusion">Conclusion</h2>
+
+<p>You should now know all you need to know about web events at this early stage. As mentioned above, events are not really part of the core JavaScript — they are defined in browser Web APIs.</p>
+
+<p>Also, it is important to understand that the different contexts in which JavaScript is used tend to have different event models — from Web APIs to other areas such as browser WebExtensions and Node.js (server-side JavaScript). We are not expecting you to understand all these areas now, but it certainly helps to understand the basics of events as you forge ahead with learning web development.</p>
+
+<p>If there is anything you didn't understand, feel free to read through the article again, or <a href="/en-US/Learn#Contact_us">contact us</a> to ask for help.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="http://www.quirksmode.org/js/events_order.html">Event order</a> (discussion of capturing and bubbling) — an excellently detailed piece by Peter-Paul Koch.</li>
+ <li><a href="http://www.quirksmode.org/js/events_access.html">Event accessing</a> (discussion of the event object) — another excellently detailed piece by Peter-Paul Koch.</li>
+ <li><a href="/en-US/docs/Web/Events">Event reference</a></li>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/Return_values","Learn/JavaScript/Building_blocks/Image_gallery", "Learn/JavaScript/Building_blocks")}}</p>
+
+<h2 id="In_this_module">In this module</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
+</ul>
diff --git a/files/es/learn/javascript/building_blocks/galeria_de_imagenes/index.html b/files/es/learn/javascript/building_blocks/galeria_de_imagenes/index.html
deleted file mode 100644
index 205f1a11aa..0000000000
--- a/files/es/learn/javascript/building_blocks/galeria_de_imagenes/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Galería de imágenes
-slug: Learn/JavaScript/Building_blocks/Galeria_de_imagenes
-translation_of: Learn/JavaScript/Building_blocks/Image_gallery
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenu("Learn/JavaScript/Building_blocks/Events", "Learn/JavaScript/Building_blocks")}}</div>
-
-<p class="summary"><span class="tlid-translation translation" lang="es"><span title="">Ahora que hemos analizado los bloques de construcción fundamentales de JavaScript, pongamos a prueba tu conocimiento de bucles, funciones, condicionales y eventos, creando un elemento que comumente vemos en muchos sitios web, una </span> <span title="">Galería de imágenes "motorizada" por JavaScript .</span></span></p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>Antes de intentar esta evaluación deberías de haber trabajado con todos los artículos en éste módulo.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Evaluar la comprensión de los bucles, funciones, condicionales y eventos de JavaScript..</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Punto_de_partida">Punto de partida</h2>
-
-<p>Para realizar esta evaluación, debería descárgarse <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/gallery/gallery-start.zip?raw=true">archivoZip</a> para el ejemplo, descomprímalo en algún lugar de su computadora y haga el ejercicio localmente para empezar.</p>
-
-<p>Opcionalmente, puedes usar un sitio como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a href="https://glitch.com/">Glitch</a> para realizar tu evaluación. Puede pegar el HTML, CSS y JavaScript dentro de uno de estos editores online. <span class="tlid-translation translation" lang="es"><span title="">Si el editor en línea que está utilizando no tiene paneles JavaScript / CSS separados, siéntase libre de ponerlos en línea &lt;script&gt; / &lt;style&gt; elementos dentro de la página HTML.</span></span></p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Si se atascascas con algo, entonces pregúntenos para ayudarlo — vea la sección de {{anch("evaluación o ayuda adicional")}} al final de esta página.</p>
-</div>
-
-<h2 id="Resumen_del_proyecto">Resumen del proyecto</h2>
-
-<p>Ha sido provisto con algún contenido de HTML, CSS e imágenes, también algunas líneas de código en JavaScript; necesitas escribir las líneas de código en JavaScript necesatio para transformarse en un programa funcional. El  HTML body luce así:</p>
-
-<pre class="brush: html">&lt;h1&gt;Image gallery example&lt;/h1&gt;
-
-&lt;div class="full-img"&gt;
-  &lt;img class="displayed-img" src="images/pic1.jpg"&gt;
-  &lt;div class="overlay"&gt;&lt;/div&gt;
-  &lt;button class="dark"&gt;Darken&lt;/button&gt;
-&lt;/div&gt;
-
-&lt;div class="thumb-bar"&gt;
-
-&lt;/div&gt;</pre>
-
-<p>El ejemplo se ve así:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13787/gallery.png" style="display: block; margin: 0 auto;"></p>
-
-<ul>
-</ul>
-
-<p>Las partes más interesantes del archivo example's CSS :</p>
-
-<ul>
- <li>It absolutely positions the three elements inside the <code>full-img &lt;div&gt;</code> — the <code>&lt;img&gt;</code> in which the full-sized image is displayed, an empty <code>&lt;div&gt;</code> that is sized to be the same size as the <code>&lt;img&gt;</code> and put right over the top of it (this is used to apply a darkening effect to the image via a semi-transparent background color), and a <code>&lt;button&gt;</code> that is used to control the darkening effect.</li>
- <li>It sets the width of any images inside the <code>thumb-bar &lt;div&gt;</code> (so-called "thumbnail" images) to 20%, and floats them to the left so they sit next to one another on a line.</li>
-</ul>
-
-<p>Your JavaScript needs to:</p>
-
-<ul>
- <li>Loop through all the images, and for each one insert an <code>&lt;img&gt;</code> element inside the <code>thumb-bar &lt;div&gt;</code> that embeds that image in the page.</li>
- <li>Attach an <code>onclick</code> handler to each <code>&lt;img&gt;</code> inside the <code>thumb-bar &lt;div&gt;</code> so that when they are clicked, the corresponding image is displayed in the <code>displayed-img &lt;img&gt;</code> element.</li>
- <li>Attach an <code>onclick</code> handler to the <code>&lt;button&gt;</code> so that when it is clicked, a darken effect is applied to the full-size image. When it is clicked again, the darken effect is removed again.</li>
-</ul>
-
-<p>To give you more of an idea, have a look at the <a href="http://mdn.github.io/learning-area/javascript/building-blocks/gallery/">finished example</a> (no peeking at the source code!)</p>
-
-<h2 id="Steps_to_complete">Steps to complete</h2>
-
-<p>The following sections describe what you need to do.</p>
-
-<h3 id="Looping_through_the_images">Looping through the images</h3>
-
-<p>We've already provided you with lines that store a reference to the <code>thumb-bar &lt;div&gt;</code> inside a constant called <code>thumbBar</code>, create a new <code>&lt;img&gt;</code> element, set its <code>src</code> attribute to a placeholder value <code>xxx</code>, and append this new <code>&lt;img&gt;</code> element inside <code>thumbBar</code>.</p>
-
-<p>You need to:</p>
-
-<ol>
- <li>Put the section of code below the "Looping through images" comment inside a loop that loops through all 5 images — you just need to loop through five numbers, one representing each image.</li>
- <li>In each loop iteration, replace the <code>xxx</code> placeholder value with a string that will equal the path to the image in each case. We are setting the value of the <code>src</code> attribute to this value in each case. Bear in mind that in each case, the image is inside the images directory and its name is <code>pic1.jpg</code>, <code>pic2.jpg</code>, etc.</li>
-</ol>
-
-<h3 id="Adding_an_onclick_handler_to_each_thumbnail_image">Adding an onclick handler to each thumbnail image</h3>
-
-<p>In each loop iteration, you need to add an <code>onclick</code> handler to the current <code>newImage</code> — this handler should find the value of the <code>src</code> attribute of the current image. Set the <code>src</code> attribute value of the <code>displayed-img &lt;img&gt;</code> to the <code>src</code> value passed in as a parameter.</p>
-
-<h3 id="Writing_a_handler_that_runs_the_darkenlighten_button">Writing a handler that runs the darken/lighten button</h3>
-
-<p>That just leaves our darken/lighten <code>&lt;button&gt;</code> — we've already provided a line that stores a reference to the <code>&lt;button&gt;</code> in a constant called <code>btn</code>. You need to add an <code>onclick</code> handler that:</p>
-
-<ol>
- <li>Checks the current class name set on the <code>&lt;button&gt;</code> — you can again achieve this by using <code>getAttribute()</code>.</li>
- <li>If the class name is <code>"dark"</code>, changes the <code>&lt;button&gt;</code> class to <code>"light"</code> (using <code><a href="/en-US/docs/Web/API/Element/setAttribute">setAttribute()</a></code>), its text content to "Lighten", and the {{cssxref("background-color")}} of the overlay <code>&lt;div&gt;</code> to <code>"rgba(0,0,0,0.5)"</code>.</li>
- <li>If the class name not <code>"dark"</code>, changes the <code>&lt;button&gt;</code> class to <code>"dark"</code>, its text content back to "Darken", and the {{cssxref("background-color")}} of the overlay <code>&lt;div&gt;</code> to <code>"rgba(0,0,0,0)"</code>.</li>
-</ol>
-
-<p>The following lines provide a basis for achieving the changes stipulated in points 2 and 3 above.</p>
-
-<pre class="brush: js">btn.setAttribute('class', xxx);
-btn.textContent = xxx;
-overlay.style.backgroundColor = xxx;</pre>
-
-<h2 id="Hints_and_tips">Hints and tips</h2>
-
-<ul>
- <li>You don't need to edit the HTML or CSS in any way.</li>
-</ul>
-
-<h2 id="Assessment_or_further_help">Assessment or further help</h2>
-
-<p>If you would like your work assessed, or are stuck and want to ask for help:</p>
-
-<ol>
- <li>Put your work into an online shareable editor such as <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, or <a href="https://glitch.com/">Glitch</a>.</li>
- <li>Write a post asking for assessment and/or help at the <a href="https://discourse.mozilla.org/c/mdn/learn">MDN Discourse forum Learning category</a>. Your post should include:
-  <ul>
-   <li>A descriptive title such as "Assessment wanted for Image gallery".</li>
-   <li>Details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment.</li>
-   <li>A link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). This is a good practice to get into — it's very hard to help someone with a coding problem if you can't see their code.</li>
-   <li>A link to the actual task or assessment page, so we can find the question you want help with.</li>
-  </ul>
- </li>
-</ol>
-
-<p>{{PreviousMenu("Learn/JavaScript/Building_blocks/Events", "Learn/JavaScript/Building_blocks")}}</p>
-
-<h2 id="In_this_module">In this module</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
-</ul>
diff --git a/files/es/learn/javascript/building_blocks/image_gallery/index.html b/files/es/learn/javascript/building_blocks/image_gallery/index.html
new file mode 100644
index 0000000000..a4bad1842e
--- /dev/null
+++ b/files/es/learn/javascript/building_blocks/image_gallery/index.html
@@ -0,0 +1,145 @@
+---
+title: Galería de imágenes
+slug: Learn/JavaScript/Building_blocks/Image_gallery
+translation_of: Learn/JavaScript/Building_blocks/Image_gallery
+original_slug: Learn/JavaScript/Building_blocks/Galeria_de_imagenes
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenu("Learn/JavaScript/Building_blocks/Events", "Learn/JavaScript/Building_blocks")}}</div>
+
+<p class="summary"><span class="tlid-translation translation" lang="es"><span title="">Ahora que hemos analizado los bloques de construcción fundamentales de JavaScript, pongamos a prueba tu conocimiento de bucles, funciones, condicionales y eventos, creando un elemento que comumente vemos en muchos sitios web, una </span> <span title="">Galería de imágenes "motorizada" por JavaScript .</span></span></p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>Antes de intentar esta evaluación deberías de haber trabajado con todos los artículos en éste módulo.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Evaluar la comprensión de los bucles, funciones, condicionales y eventos de JavaScript..</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Punto_de_partida">Punto de partida</h2>
+
+<p>Para realizar esta evaluación, debería descárgarse <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/gallery/gallery-start.zip?raw=true">archivoZip</a> para el ejemplo, descomprímalo en algún lugar de su computadora y haga el ejercicio localmente para empezar.</p>
+
+<p>Opcionalmente, puedes usar un sitio como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a href="https://glitch.com/">Glitch</a> para realizar tu evaluación. Puede pegar el HTML, CSS y JavaScript dentro de uno de estos editores online. <span class="tlid-translation translation" lang="es"><span title="">Si el editor en línea que está utilizando no tiene paneles JavaScript / CSS separados, siéntase libre de ponerlos en línea &lt;script&gt; / &lt;style&gt; elementos dentro de la página HTML.</span></span></p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Si se atascascas con algo, entonces pregúntenos para ayudarlo — vea la sección de {{anch("evaluación o ayuda adicional")}} al final de esta página.</p>
+</div>
+
+<h2 id="Resumen_del_proyecto">Resumen del proyecto</h2>
+
+<p>Ha sido provisto con algún contenido de HTML, CSS e imágenes, también algunas líneas de código en JavaScript; necesitas escribir las líneas de código en JavaScript necesatio para transformarse en un programa funcional. El  HTML body luce así:</p>
+
+<pre class="brush: html">&lt;h1&gt;Image gallery example&lt;/h1&gt;
+
+&lt;div class="full-img"&gt;
+  &lt;img class="displayed-img" src="images/pic1.jpg"&gt;
+  &lt;div class="overlay"&gt;&lt;/div&gt;
+  &lt;button class="dark"&gt;Darken&lt;/button&gt;
+&lt;/div&gt;
+
+&lt;div class="thumb-bar"&gt;
+
+&lt;/div&gt;</pre>
+
+<p>El ejemplo se ve así:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13787/gallery.png" style="display: block; margin: 0 auto;"></p>
+
+<ul>
+</ul>
+
+<p>Las partes más interesantes del archivo example's CSS :</p>
+
+<ul>
+ <li>It absolutely positions the three elements inside the <code>full-img &lt;div&gt;</code> — the <code>&lt;img&gt;</code> in which the full-sized image is displayed, an empty <code>&lt;div&gt;</code> that is sized to be the same size as the <code>&lt;img&gt;</code> and put right over the top of it (this is used to apply a darkening effect to the image via a semi-transparent background color), and a <code>&lt;button&gt;</code> that is used to control the darkening effect.</li>
+ <li>It sets the width of any images inside the <code>thumb-bar &lt;div&gt;</code> (so-called "thumbnail" images) to 20%, and floats them to the left so they sit next to one another on a line.</li>
+</ul>
+
+<p>Your JavaScript needs to:</p>
+
+<ul>
+ <li>Loop through all the images, and for each one insert an <code>&lt;img&gt;</code> element inside the <code>thumb-bar &lt;div&gt;</code> that embeds that image in the page.</li>
+ <li>Attach an <code>onclick</code> handler to each <code>&lt;img&gt;</code> inside the <code>thumb-bar &lt;div&gt;</code> so that when they are clicked, the corresponding image is displayed in the <code>displayed-img &lt;img&gt;</code> element.</li>
+ <li>Attach an <code>onclick</code> handler to the <code>&lt;button&gt;</code> so that when it is clicked, a darken effect is applied to the full-size image. When it is clicked again, the darken effect is removed again.</li>
+</ul>
+
+<p>To give you more of an idea, have a look at the <a href="http://mdn.github.io/learning-area/javascript/building-blocks/gallery/">finished example</a> (no peeking at the source code!)</p>
+
+<h2 id="Steps_to_complete">Steps to complete</h2>
+
+<p>The following sections describe what you need to do.</p>
+
+<h3 id="Looping_through_the_images">Looping through the images</h3>
+
+<p>We've already provided you with lines that store a reference to the <code>thumb-bar &lt;div&gt;</code> inside a constant called <code>thumbBar</code>, create a new <code>&lt;img&gt;</code> element, set its <code>src</code> attribute to a placeholder value <code>xxx</code>, and append this new <code>&lt;img&gt;</code> element inside <code>thumbBar</code>.</p>
+
+<p>You need to:</p>
+
+<ol>
+ <li>Put the section of code below the "Looping through images" comment inside a loop that loops through all 5 images — you just need to loop through five numbers, one representing each image.</li>
+ <li>In each loop iteration, replace the <code>xxx</code> placeholder value with a string that will equal the path to the image in each case. We are setting the value of the <code>src</code> attribute to this value in each case. Bear in mind that in each case, the image is inside the images directory and its name is <code>pic1.jpg</code>, <code>pic2.jpg</code>, etc.</li>
+</ol>
+
+<h3 id="Adding_an_onclick_handler_to_each_thumbnail_image">Adding an onclick handler to each thumbnail image</h3>
+
+<p>In each loop iteration, you need to add an <code>onclick</code> handler to the current <code>newImage</code> — this handler should find the value of the <code>src</code> attribute of the current image. Set the <code>src</code> attribute value of the <code>displayed-img &lt;img&gt;</code> to the <code>src</code> value passed in as a parameter.</p>
+
+<h3 id="Writing_a_handler_that_runs_the_darkenlighten_button">Writing a handler that runs the darken/lighten button</h3>
+
+<p>That just leaves our darken/lighten <code>&lt;button&gt;</code> — we've already provided a line that stores a reference to the <code>&lt;button&gt;</code> in a constant called <code>btn</code>. You need to add an <code>onclick</code> handler that:</p>
+
+<ol>
+ <li>Checks the current class name set on the <code>&lt;button&gt;</code> — you can again achieve this by using <code>getAttribute()</code>.</li>
+ <li>If the class name is <code>"dark"</code>, changes the <code>&lt;button&gt;</code> class to <code>"light"</code> (using <code><a href="/en-US/docs/Web/API/Element/setAttribute">setAttribute()</a></code>), its text content to "Lighten", and the {{cssxref("background-color")}} of the overlay <code>&lt;div&gt;</code> to <code>"rgba(0,0,0,0.5)"</code>.</li>
+ <li>If the class name not <code>"dark"</code>, changes the <code>&lt;button&gt;</code> class to <code>"dark"</code>, its text content back to "Darken", and the {{cssxref("background-color")}} of the overlay <code>&lt;div&gt;</code> to <code>"rgba(0,0,0,0)"</code>.</li>
+</ol>
+
+<p>The following lines provide a basis for achieving the changes stipulated in points 2 and 3 above.</p>
+
+<pre class="brush: js">btn.setAttribute('class', xxx);
+btn.textContent = xxx;
+overlay.style.backgroundColor = xxx;</pre>
+
+<h2 id="Hints_and_tips">Hints and tips</h2>
+
+<ul>
+ <li>You don't need to edit the HTML or CSS in any way.</li>
+</ul>
+
+<h2 id="Assessment_or_further_help">Assessment or further help</h2>
+
+<p>If you would like your work assessed, or are stuck and want to ask for help:</p>
+
+<ol>
+ <li>Put your work into an online shareable editor such as <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, or <a href="https://glitch.com/">Glitch</a>.</li>
+ <li>Write a post asking for assessment and/or help at the <a href="https://discourse.mozilla.org/c/mdn/learn">MDN Discourse forum Learning category</a>. Your post should include:
+  <ul>
+   <li>A descriptive title such as "Assessment wanted for Image gallery".</li>
+   <li>Details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment.</li>
+   <li>A link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). This is a good practice to get into — it's very hard to help someone with a coding problem if you can't see their code.</li>
+   <li>A link to the actual task or assessment page, so we can find the question you want help with.</li>
+  </ul>
+ </li>
+</ol>
+
+<p>{{PreviousMenu("Learn/JavaScript/Building_blocks/Events", "Learn/JavaScript/Building_blocks")}}</p>
+
+<h2 id="In_this_module">In this module</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
+</ul>
diff --git a/files/es/learn/javascript/building_blocks/looping_code/index.html b/files/es/learn/javascript/building_blocks/looping_code/index.html
new file mode 100644
index 0000000000..c1386a16ed
--- /dev/null
+++ b/files/es/learn/javascript/building_blocks/looping_code/index.html
@@ -0,0 +1,924 @@
+---
+title: Bucles
+slug: Learn/JavaScript/Building_blocks/Looping_code
+translation_of: Learn/JavaScript/Building_blocks/Looping_code
+original_slug: Learn/JavaScript/Building_blocks/Bucle_codigo
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/conditionals","Learn/JavaScript/Building_blocks/Functions", "Learn/JavaScript/Building_blocks")}}</div>
+
+<p class="summary">Los lenguajes de programación son muy útiles para completar rápidamente tareas repetitivas, desde múltimples cálculos básicos hasta cualquier otra situación en donde tengas un montón de elementos de trabajo similares que completar. Aquí vamos a ver las estructuras de bucles disponibles en JavaScript que pueden manejar tales necesidades.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>Conocimientos básicos de computación, entendimiento básico de HTML y CSS, <a href="/en-US/docs/Learn/JavaScript/First_steps">JavaScript first steps</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Entender cómo usar bucles en JavaScript.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Mantente_en_el_Bucle">Mantente en el Bucle</h2>
+
+<p>Bucles, bucles, bucles. Además de ser conocidos como un cereal de desayuno popular, montañas rusas y producción músical, también son un concepto muy importante en programación. Los bucles de programación están relacionados con todo lo referente a hacer una misma cosa una y otra vez — que se denomina como <strong>iteración </strong>en el idioma de programación.</p>
+
+<p>Consideremos el caso de un agricultor que se asegura de tener suficiente comida para alimentar a su familia durante la semana. Podría usar el siguiente bucle para lograr esto:</p>
+
+<p><br>
+ <img alt="" src="https://mdn.mozillademos.org/files/13755/loop_js-02-farm.png" style="display: block; margin: 0 auto;"></p>
+
+<p>Un bucle cuenta con una o más de las siguientes características:</p>
+
+<ul>
+ <li> Un <strong>contador,</strong> que se inicia con un determinado valor — este será el valor del punto inicial del bucle ("Inicio: No tengo comida",mirar arriba).</li>
+ <li>Una <strong>condicion de salida</strong>, que será el criterio bajo el cual, el bucle se romperá — normalmente un contador que alcanza un determinado valor. Aquí se ilustra como "¿Tengo suficiente comida?", arriba. Digamos que son necesarias 10 porciones de comida para alimentar a su familia.</li>
+ <li>Un <strong>iterador, </strong>que generalmente incrementa el valor del contador en una cantidad pequeña a cada paso del bucle, hasta que alcanza la condición de salida. No hemos ilustrado esto de manera explícita arriba, pero podríamos pensar que el granjero está recolectando 2 porciones de comida cada hora. Después de cada hora, la cantidad de comida recolectada se incrementa en dos, y comprueba si tiene suficiente comida. Si alcanza los 10 puntos (la condición de salida), puede parar la recolecta e irse para casa.</li>
+</ul>
+
+<p>En {{glossary("pseudocódigo")}},esto se vería como sigue:</p>
+
+<pre class="notranslate">bucle(comida = 0; comidaNecesaria = 10) {
+  if (comida = comidaNecesaria) {
+    salida bucle;
+    // Tenemos suficiente comida; vamonos para casa
+  } else {
+    comida += 2; // Pasar una hora recogiendo 2 más de comida
+    // Comenzar el bucle de nuevo
+  }
+}</pre>
+
+<p>Así que la cantidad necesaria de comida se establece en 10, y la cantidad incial del granjero en 0. En cada iteración del bucle comprobamos si la cantidad de comida del granjero es mayor o igual a la cantidad que necesita. Si lo es, podemos salir del bucle. Si no, el granjero se pasará una hora más recogiendo dos porciones de comida, y el bucle arrancará de nuevo.</p>
+
+<h3 id="¿Por_qué_molestarse">¿Por qué molestarse?</h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">En este punto, probablemente entiendas los conceptos de alto nivel que hay detrás de los bucles,</span></span> pero probablemente estés pensando "OK, fantástico, pero ¿cómo me ayuda esto a escribir un mejor codigo JavaScript?". Como dijimos antes, <strong>los bucles tienen que ver con hacer lo mismo una y otra vez</strong>, lo cual es bueno para <strong>completar rápidamente tareas repetitivas</strong>.</p>
+
+<p>Muchas veces, el código será ligeramente diferente en cada iteracción sucesiva del bucle, lo que significa que puedes completar una carga completa de tareas que son similares, pero ligeramente diferentes — si tienes muchos calculos diferentes que hacer, quieres hacer cada uno de ellos, ¡no el mismo una y otra vez!</p>
+
+<p>Vamos a ver un ejemplo para ilustrar perfectamente por qué los bucles son tan útiles. Digamos que queremos dibujar 100 círculos aleatorios en un elemento {{htmlelement("canvas")}} (presiona el botón <em>Update</em> para ejecutar el ejemplo una y otra vez y ver diferentes configuraciones aleatorias):</p>
+
+<div class="hidden">
+<h6 id="Hidden_code">Hidden code</h6>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Random canvas circles&lt;/title&gt;
+    &lt;style&gt;
+      html {
+        width: 100%;
+        height: inherit;
+        background: #ddd;
+      }
+
+      canvas {
+        display: block;
+      }
+
+      body {
+        margin: 0;
+      }
+
+      button {
+        position: absolute;
+        top: 5px;
+        left: 5px;
+      }
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+
+  &lt;button&gt;Update&lt;/button&gt;
+
+  &lt;canvas&gt;&lt;/canvas&gt;
+
+
+    &lt;script&gt;
+    var btn = document.querySelector('button');
+    var canvas = document.querySelector('canvas');
+    var ctx = canvas.getContext('2d');
+
+    var WIDTH = document.documentElement.clientWidth;
+    var HEIGHT = document.documentElement.clientHeight;
+
+    canvas.width = WIDTH;
+    canvas.height = HEIGHT;
+
+    function random(number) {
+      return Math.floor(Math.random()*number);
+    }
+
+    function draw() {
+      ctx.clearRect(0,0,WIDTH,HEIGHT);
+      for (var i = 0; i &lt; 100; i++) {
+        ctx.beginPath();
+        ctx.fillStyle = 'rgba(255,0,0,0.5)';
+        ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI);
+        ctx.fill();
+      }
+    }
+
+    btn.addEventListener('click',draw);
+
+    &lt;/script&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Hidden_code', '100%', 400, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<p>No tienes que entender todo el código por ahora, pero vamos a echar un vistazo a la parte de código que dibuja los 100 círculos:</p>
+
+<pre class="brush: js notranslate">for (var i = 0; i &lt; 100; i++) {
+  ctx.beginPath();
+  ctx.fillStyle = 'rgba(255,0,0,0.5)';
+  ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI);
+  ctx.fill();
+}</pre>
+
+<p>Debes quedarte con la idea básica.  — utilizamos un bucle para ejecutar 100 iteracciones de este código, cada una de las cuales dibuja un círculo en una posición aleatoria de la página. La cantidad de código necesario sería el mismo si dibujáramos 100, 1000, o 10,000 círculos. Solo necesitamos cambiar un número.</p>
+
+<p>Si no usáramos un bucle aquí, tendríamos que repetir el siguiente código por cada círculo que quisiéramos dibujar:</p>
+
+<pre class="brush: js notranslate">ctx.beginPath();
+ctx.fillStyle = 'rgba(255,0,0,0.5)';
+ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI);
+ctx.fill();</pre>
+
+<p>Esto sería muy aburrido y difícil de mantener de forma rápida. Los bucles son realmente lo mejor.</p>
+
+<h2 id="El_bucle_estándar_for">El bucle estándar <code>for</code></h2>
+
+<p>Exploremos algunos constructores de bucles específicos. El primero, que usarás la mayoría de las veces, es el bucle <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/for">for</a> - este tiene la siguiente sintaxis:</p>
+
+<pre class="notranslate">for (inicializador; condición de salida; expresión final) {
+  // código a ejecutar
+}</pre>
+
+<p>Aquí tenemos:</p>
+
+<ol>
+ <li>La palabra reservada <code>for</code>, seguida por algunos paréntesis.</li>
+ <li>Dentro de los paréntesis tenemos tres ítems, separados por punto y coma (;):
+  <ol>
+   <li>Un <strong>inicializador</strong> - Este es usualmente una variable con un número asignado, que aumenta el número de veces que el bucle ha sijo ejecutado. También se le llama <strong>contador</strong> o <strong>variable de conteo</strong>.</li>
+   <li>Una <strong>condición de salida</strong> - como se mencionó previamente, ésta define cuando el bucle debería detenerse. Generalmente es una expresión que contiene un operador de comparación, una prueba para verificar ue la condición de término o salida ha sido cumplida.</li>
+   <li>Una <strong>expresión final</strong> - que es siempre evaluada o ejecutada cada vez que el bucle ha completado una iteración. Usualmente sirve para modificar al contador (incrementando su valor o algunas veces disminuyendolo), para aproximarse a la condición de salida.</li>
+  </ol>
+ </li>
+ <li>Algunos corchetes curvos que contienen un bloque de código - este código se ejecutará cada vez que se repita el bucle.</li>
+</ol>
+
+<p>Observa un ejemplo real para poder entender esto más claramente.</p>
+
+<pre class="brush: js notranslate">var cats = ['Bill', 'Jeff', 'Pete', 'Biggles', 'Jasmin'];
+var info = 'My cats are called ';
+var para = document.querySelector('p');
+
+for (var i = 0; i &lt; cats.length; i++) {
+  info += cats[i] + ', ';
+}
+
+para.textContent = info;</pre>
+
+<p>Esto nos da el siguiente resultado:</p>
+
+<div class="hidden">
+<h6 id="Hidden_code_2">Hidden code 2</h6>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Basic for loop example&lt;/title&gt;
+    &lt;style&gt;
+
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+
+  &lt;p&gt;&lt;/p&gt;
+
+
+    &lt;script&gt;
+    var cats = ['Bill', 'Jeff', 'Pete', 'Biggles', 'Jasmin'];
+    var info = 'My cats are called ';
+    var para = document.querySelector('p');
+
+    for (var i = 0; i &lt; cats.length; i++) {
+      info += cats[i] + ', ';
+    }
+
+    para.textContent = info;
+
+    &lt;/script&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Hidden_code_2', '100%', 60, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes encontrar este <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/basic-for.html">ejemplo de código en GitHub</a> también (además puedes <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/basic-for.html">verlo ejecutar en vivo</a>).</p>
+</div>
+
+<p>Esto muestra un bucle siendo usado para iterar sobre los elementos de un arreglo (matriz), y hacer algo con cada uno de ellos - un patrón muy común en JavaScript. Aquí:</p>
+
+<ol>
+ <li>El iterador, <code>i</code>, inicia en <code>0</code> (<code>var i = 0</code>).</li>
+ <li>Se le ha dicho que debe ejecutarse hasta que no sea menor que la longitud del arreglo <code>cats</code>. Esto es importante  - la condición de salida muestra la condicion bajo la cual el bucle seguirá iterando. Así, en este caso, mientras <code>i &lt; cats.length</code> sea verdadero, el bucle seguirá ejecutándose.</li>
+ <li>Dentro del bucle, concatenamos el elemento del bucle actual (<code>cats[i]</code> es <code>cats[lo que sea i en ese momento]</code>) junto con una coma y un espacio, al final de la variable <code>info</code>. Así:
+  <ol>
+   <li>Durante la primera ejecución,  <code>i = 0</code>, así <code>cats[0] + ', '</code> se concatenará con la información ("Bill, ").</li>
+   <li>Durante la segunda ejecución, <code>i = 1</code>, así <code>cats[1] + ', '</code> agregará el siguiente nombre ("Jeff, ").</li>
+   <li>Y así sucesivamente. Después de cada vez que se ejecute el bucle, se incrementará en 1 el valod de i (<code>i++</code>), entonces el proceso comenzará de nuevo.</li>
+  </ol>
+ </li>
+ <li>Cuando <code>i</code> sea igual a <code>cats.length</code>, el bucle se detendrá, y el navegador se moverá al siguiente segmento de código bajo el bucle.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Hemos programado la condición de salidad como <code>i &lt; cats.length</code>, y no como <code>i &lt;= cats.length</code>, porque los computadores cuentan desde 0, no 1 - inicializamos la variable i en 0, para llegar a <code>i = 4</code> (el índice del último elemento del arreglo). <code>cats.length</code> responde 5, ya que existen 5 elementos en el arreglo, pero no queremos que i = 5, dado que respondería <code>undefined</code> para el último elemento (no existe un elemento en el arreglo con un índice 5). for the last item (there is no array item with an index of 5). Por ello, queremos llegar a 1 menos que <code>cats.length</code> (<code>i &lt;</code>), que no es lo mismo que <code>cats.length</code> (<code>i &lt;=</code>).</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Un error común con la condición de salida es utilizar el comparador "igual a" (<code>===</code>) en vez de "menor o igual a" (<code>&lt;=</code>). Si queremos que nuestro bucle se ejecute hasta que  <code>i = 5</code>, la condición de salida debería ser <code>i &lt;= cats.length</code>. Si la declaramos <code>i === cats.length</code>, el bucle no debería ejecutarse , porque <code>i</code> no es igual a <code>5</code> en la primera iteración del bucle, por lo que debería detenerse inmediatamente.</p>
+</div>
+
+<p>Un pequeño problema que se presenta es que la frase de salida final no está muy bien formada:</p>
+
+<blockquote>
+<p>My cats are called Bill, Jeff, Pete, Biggles, Jasmin,</p>
+</blockquote>
+
+<p>Idealmente querríamos cambiar la concatenacion al final de la última iteracion del bucle, así no tendríamos una coma en el final de la frase. Bueno, no hay problema - podemos insertar un condicional dentro de nuestro bucle para solucionar este caso especial:</p>
+
+<pre class="brush: js notranslate">for (var i = 0; i &lt; cats.length; i++) {
+  if (i === cats.length - 1) {
+    info += 'and ' + cats[i] + '.';
+  } else {
+    info += cats[i] + ', ';
+  }
+}</pre>
+
+<div class="note">
+<p><strong>Note</strong>: You can find this <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/basic-for-improved.html">example code on GitHub</a> too (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/basic-for-improved.html">see it running live</a>).</p>
+</div>
+
+<div class="warning">
+<p><strong>Importante</strong>: Con <code>for</code> - como con todos los bucles - debes estar seguro de que el inicializador es repetido hasta que eventualemtne alcance la condición de salida. Si no, el bucle seguirá repitiéndose indefinidamente, y puede que el navegador lo fuerce a detenerse o se interrumpa. Esto se denomina <strong>bucle infinito</strong>.</p>
+</div>
+
+<h2 id="Salir_de_un_bucle_con_break">Salir de un bucle con <code>break</code></h2>
+
+<p>Si deseas salir de un bucle antes de que se hayan completado todas las iteraciones, puedes usar la declaración <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/break">break</a>. Ya la vimos en el artículo previo cuando revisamos la declaración <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/switch">switch</a> - cuando un caso en una declaración <code>switch</code> coincide con la expresión de entrada, la declaración <code>break</code> inmediatamente sale de la declaración <code>switch</code> y avanza al código que se encuentra después.</p>
+
+<p>Ocurre lo mismo con los bucles - una declaración <code>break</code> saldrá inmediatamente del bucle y hará que el navegador siga con el código que sigue después.</p>
+
+<p>Digamos que queremos buscar a través de un arreglo de contactos y números telefónicos y retornar sólo el número que queríamos encontrar. primero, un simple HTML -  un {{htmlelement("input")}} de texto que nos permita ingresar un nombre para buscar, un elemento {{htmlelement("button")}} para enviar la búsqueda, y un elemento {{htmlelement("p")}} para mostrar el resultado:</p>
+
+<pre class="brush: html notranslate">&lt;label for="search"&gt;Search by contact name: &lt;/label&gt;
+&lt;input id="search" type="text"&gt;
+&lt;button&gt;Search&lt;/button&gt;
+
+&lt;p&gt;&lt;/p&gt;</pre>
+
+<p>Ahora en el JavaScript:</p>
+
+<pre class="brush: js notranslate">var contacts = ['Chris:2232322', 'Sarah:3453456', 'Bill:7654322', 'Mary:9998769', 'Dianne:9384975'];
+var para = document.querySelector('p');
+var input = document.querySelector('input');
+var btn = document.querySelector('button');
+
+btn.addEventListener('click', function() {
+  var searchName = input.value;
+  input.value = '';
+  input.focus();
+  for (var i = 0; i &lt; contacts.length; i++) {
+    var splitContact = contacts[i].split(':');
+    if (splitContact[0] === searchName) {
+      para.textContent = splitContact[0] + '\'s number is ' + splitContact[1] + '.';
+      break;
+    } else {
+      para.textContent = 'Contact not found.';
+    }
+  }
+});</pre>
+
+<div class="hidden">
+<h6 id="Hidden_code_3">Hidden code 3</h6>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Simple contact search example&lt;/title&gt;
+    &lt;style&gt;
+
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+
+  &lt;label for="search"&gt;Search by contact name: &lt;/label&gt;
+  &lt;input id="search" type="text"&gt;
+  &lt;button&gt;Search&lt;/button&gt;
+
+  &lt;p&gt;&lt;/p&gt;
+
+
+    &lt;script&gt;
+    var contacts = ['Chris:2232322', 'Sarah:3453456', 'Bill:7654322', 'Mary:9998769', 'Dianne:9384975'];
+    var para = document.querySelector('p');
+    var input = document.querySelector('input');
+    var btn = document.querySelector('button');
+
+    btn.addEventListener('click', function() {
+      var searchName = input.value;
+      input.value = '';
+      input.focus();
+      for (var i = 0; i &lt; contacts.length; i++) {
+        var splitContact = contacts[i].split(':');
+        if (splitContact[0] === searchName) {
+          para.textContent = splitContact[0] + '\'s number is ' + splitContact[1] + '.';
+          break;
+        } else {
+          para.textContent = 'Contact not found.';
+        }
+      }
+    });
+    &lt;/script&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Hidden_code_3', '100%', 100, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<ol>
+ <li>First of all we have some variable definitions — we have an array of contact information, with each item being a string containing a name and phone number separated by a colon.</li>
+ <li>Next, we attach an event listener to the button (<code>btn</code>), so that when it is pressed, some code is run to perform the search and return the results.</li>
+ <li>We store the value entered into the text input in a variable called <code>searchName</code>, before then emptying the text input and focusing it again, ready for the next search.</li>
+ <li>Now onto the interesting part, the for loop:
+  <ol>
+   <li>We start the counter at <code>0</code>, run the loop until the counter is no longer less than <code>contacts.length</code>, and increment <code>i</code> by 1 after each iteration of the loop.</li>
+   <li>Inside the loop we first split the current contact (<code>contacts[i]</code>) at the colon character, and store the resulting two values in an array called <code>splitContact</code>.</li>
+   <li>We then use a conditional statement to test whether <code>splitContact[0]</code> (the contact's name) is equal to the inputted <code>searchName</code>. If it is, we enter a string into the paragraph to report what the contact's number is, and use <code>break</code> to end the loop.</li>
+  </ol>
+ </li>
+ <li>If the contact name does not match the entered search, the paragraph text is set to "Contact not found.", and the loop continues iterating.</li>
+</ol>
+
+<div class="note">
+<p>Note: You can view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/contact-search.html">full source code on GitHub</a> too (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/contact-search.html">see it running live</a>).</p>
+</div>
+
+<h2 id="Skipping_iterations_with_continue">Skipping iterations with continue</h2>
+
+<p>The <a href="/en-US/docs/Web/JavaScript/Reference/Statements/continue">continue</a> statement works in a similar manner to <code>break</code>, but instead of breaking out of the loop entirely, it skips to the next iteration of the loop. Let's look at another example that takes a number as an input, and returns only the numbers that are squares of integers (whole numbers).</p>
+
+<p>The HTML is basically the same as the last example — a simple text input, and a paragraph for output. The JavaScript is mostly the same too, although the loop itself is a bit different:</p>
+
+<pre class="brush: js notranslate">var num = input.value;
+
+for (var i = 1; i &lt;= num; i++) {
+  var sqRoot = Math.sqrt(i);
+  if (Math.floor(sqRoot) !== sqRoot) {
+    continue;
+  }
+
+  para.textContent += i + ' ';
+}</pre>
+
+<p>Here's the output:</p>
+
+<div class="hidden">
+<h6 id="Hidden_code_4">Hidden code 4</h6>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;title&gt;Integer squares generator&lt;/title&gt;
+    &lt;style&gt;
+
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+
+  &lt;label for="number"&gt;Enter number: &lt;/label&gt;
+  &lt;input id="number" type="text"&gt;
+  &lt;button&gt;Generate integer squares&lt;/button&gt;
+
+  &lt;p&gt;Output: &lt;/p&gt;
+
+
+    &lt;script&gt;
+    var para = document.querySelector('p');
+    var input = document.querySelector('input');
+    var btn = document.querySelector('button');
+
+    btn.addEventListener('click', function() {
+      para.textContent = 'Output: ';
+      var num = input.value;
+      input.value = '';
+      input.focus();
+      for (var i = 1; i &lt;= num; i++) {
+        var sqRoot = Math.sqrt(i);
+        if (Math.floor(sqRoot) !== sqRoot) {
+          continue;
+        }
+
+        para.textContent += i + ' ';
+      }
+    });
+    &lt;/script&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Hidden_code_4', '100%', 100, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<ol>
+ <li>In this case, the input should be a number (<code>num</code>). The <code>for</code> loop is given a counter starting at 1 (as we are not interested in 0 in this case), an exit condition that says the loop will stop when the counter becomes bigger than the input <code>num</code>, and an iterator that adds 1 to the counter each time.</li>
+ <li>Inside the loop, we find the square root of each number using <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sqrt">Math.sqrt(i)</a>, then check whether the square root is an integer by testing whether it is the same as itself when it has been rounded down to the nearest integer (this is what <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor">Math.floor()</a> does to the number it is passed).</li>
+ <li>If the square root and the rounded down square root do not equal one another (<code>!==</code>), it means that the square root is not an integer, so we are not interested in it. In such a case, we use the <code>continue</code> statement to skip on to the next loop iteration without recording the number anywhere.</li>
+ <li>If the square root IS an integer, we skip past the if block entirely so the <code>continue</code> statement is not executed; instead, we concatenate the current <code>i</code> value plus a space on to the end of the paragraph content.</li>
+</ol>
+
+<div class="note">
+<p><strong>Note</strong>: You can view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/integer-squares.html">full source code on GitHub</a> too (also <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/integer-squares.html">see it running live</a>).</p>
+</div>
+
+<h2 id="while_and_do_..._while">while and do ... while</h2>
+
+<p><code>for</code> is not the only type of loop available in JavaScript. There are actually many others and, while you don't need to understand all of these now, it is worth having a look at the structure of a couple of others so that you can recognize the same features at work in a slightly different way.</p>
+
+<p>First, let's have a look at the <a href="/en-US/docs/Web/JavaScript/Reference/Statements/while">while</a> loop. This loop's syntax looks like so:</p>
+
+<pre class="notranslate">initializer
+while (exit-condition) {
+  // code to run
+
+  final-expression
+}</pre>
+
+<p>This works in a very similar way to the for loop, except that the initializer variable is set before the loop, and the final-expression is included inside the loop after the code to run — rather than these two items being included inside the parentheses. The exit-condition is included inside the parentheses, which are preceded by the <code>while</code> keyword rather than <code>for</code>.</p>
+
+<p>The same three items are still present, and they are still defined in the same order as they are in the for loop — this makes sense, as you still have to have an initializer defined before you can check whether it has reached the exit-condition; the final-condition is then run after the code inside the loop has run (an iteration has been completed), which will only happen if the exit-condition has still not been reached.</p>
+
+<p>Let's have a look again at our cats list example, but rewritten to use a while loop:</p>
+
+<pre class="brush: js notranslate">var i = 0;
+
+while (i &lt; cats.length) {
+  if (i === cats.length - 1) {
+    info += 'and ' + cats[i] + '.';
+  } else {
+    info += cats[i] + ', ';
+  }
+
+  i++;
+}</pre>
+
+<div class="note">
+<p><strong>Note</strong>: This still works just the same as expected — have a look at it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/while.html">running live on GitHub</a> (also view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/while.html">full source code</a>).</p>
+</div>
+
+<p>The <a href="/en-US/docs/Web/JavaScript/Reference/Statements/do...while">do...while</a> loop is very similar, but provides a variation on the while structure:</p>
+
+<pre class="notranslate">initializer
+do {
+  // code to run
+
+  final-expression
+} while (exit-condition)</pre>
+
+<p>In this case, the initializer again comes first, before the loop starts. The <code>do</code> keyword directly precedes the curly braces containing the code to run and the final-expression.</p>
+
+<p>The differentiator here is that the exit-condition comes after everything else, wrapped in parentheses and preceded by a <code>while</code> keyword. In a <code>do...while</code> loop, the code inside the curly braces is always run once before the check is made to see if it should be executed again (in while and for, the check comes first, so the code might never be executed).</p>
+
+<p>Let's rewrite our cat listing example again to use a <code>do...while</code> loop:</p>
+
+<pre class="brush: js notranslate">var i = 0;
+
+do {
+  if (i === cats.length - 1) {
+    info += 'and ' + cats[i] + '.';
+  } else {
+    info += cats[i] + ', ';
+  }
+
+  i++;
+} while (i &lt; cats.length);</pre>
+
+<div class="note">
+<p><strong>Note</strong>: Again, this works just the same as expected — have a look at it <a href="http://mdn.github.io/learning-area/javascript/building-blocks/loops/do-while.html">running live on GitHub</a> (also view the <a href="https://github.com/mdn/learning-area/blob/master/javascript/building-blocks/loops/do-while.html">full source code</a>).</p>
+</div>
+
+<div class="warning">
+<p><strong>Important</strong>: With while and do...while — as with all loops — you must make sure that the initializer is iterated so that it eventually reaches the exit condition. If not, the loop will go on forever, and either the browser will force it to stop, or it will crash. This is called an <strong>infinite loop</strong>.</p>
+</div>
+
+<h2 id="Active_learning_Launch_countdown!">Active learning: Launch countdown!</h2>
+
+<p>In this exercise, we want you to print out a simple launch countdown to the output box, from 10 down to Blast off. Specifically, we want you to:</p>
+
+<ul>
+ <li>Loop from 10 down to 0. We've provided you with an initializer — <code>var i = 10;</code>.</li>
+ <li>For each iteration, create a new paragraph and append it to the output <code>&lt;div&gt;</code>, which we've selected using <code>var output = document.querySelector('.output');</code>. In comments, we've provided you with three code lines that need to be used somewhere inside the loop:
+  <ul>
+   <li><code>var para = document.createElement('p');</code> — creates a new paragraph.</li>
+   <li><code>output.appendChild(para);</code> — appends the paragraph to the output <code>&lt;div&gt;</code>.</li>
+   <li><code>para.textContent =</code> — makes the text inside the paragraph equal to whatever you put on the right hand side, after the equals sign.</li>
+  </ul>
+ </li>
+ <li>Different iteration numbers require different text to be put in the paragraph for that iteration (you'll need a conditional statement and multiple <code>para.textContent =</code> lines):
+  <ul>
+   <li>If the number is 10, print "Countdown 10" to the paragraph.</li>
+   <li>If the number is 0, print "Blast off!" to the paragraph.</li>
+   <li>For any other number, print just the number to the paragraph.</li>
+  </ul>
+ </li>
+ <li>Remember to include an iterator! However, in this example we are counting down after each iteration, not up, so you <strong>don't</strong> want <code>i++</code> — how do you iterate downwards?</li>
+</ul>
+
+<p>If you make a mistake, you can always reset the example with the "Reset" button. If you get really stuck, press "Show solution" to see a solution.</p>
+
+<div class="hidden">
+<h6 id="Active_learning">Active learning</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Live output&lt;/h2&gt;
+&lt;div class="output" style="height: 410px;overflow: auto;"&gt;
+
+&lt;/div&gt;
+
+&lt;h2&gt;Editable code&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Press Esc to move focus away from the code area (Tab inserts a tab character).&lt;/p&gt;
+&lt;textarea id="code" class="playable-code" style="height: 300px;width: 95%"&gt;
+var output = document.querySelector('.output');
+output.innerHTML = '';
+
+// var i = 10;
+
+// var para = document.createElement('p');
+// para.textContent = ;
+// output.appendChild(para);
+&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Reset"&gt;
+  &lt;input id="solution" type="button" value="Show solution"&gt;
+&lt;/div&gt;
+</pre>
+
+<p class="brush: js"></p>
+
+<p class="brush: js"></p>
+
+<p class="brush: js"></p>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<p class="brush: js"></p>
+
+<p class="brush: js"></p>
+
+<p class="brush: js"></p>
+
+<p class="brush: js"></p>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  eval(textarea.value);
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = jsSolution;
+  solution.value = 'Show solution';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Show solution') {
+    textarea.value = solutionEntry;
+    solution.value = 'Hide solution';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Show solution';
+  }
+  updateCode();
+});
+
+var jsSolution = 'var output = document.querySelector(\'.output\');\noutput.innerHTML = \'\';\n\nvar i = 10;\n\nwhile(i &gt;= 0) {\n var para = document.createElement(\'p\');\n if(i === 10) {\n para.textContent = \'Countdown \' + i;\n } else if(i === 0) {\n  para.textContent = \'Blast off!\';\n } else {\n para.textContent = i;\n }\n\n output.appendChild(para);\n\n i--;\n}';
+var solutionEntry = jsSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// stop tab key tabbing out of textarea and
+// make it write a tab at the caret position instead
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Update the saved userCode every time the user updates the text area code
+
+textarea.onkeyup = function(){
+  // We only want to save the state when the user code is being shown,
+  // not the solution, so that solution is not saved over the user code
+  if(solution.value === 'Show solution') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+
+<p class="brush: js"></p>
+</div>
+
+<p>{{ EmbedLiveSample('Active_learning', '100%', 880, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h2 id="Active_learning_Filling_in_a_guest_list">Active learning: Filling in a guest list</h2>
+
+<p>In this exercise, we want you to take a list of names stored in an array, and put them into a guest list. But it's not quite that easy — we don't want to let Phil and Lola in because they are greedy and rude, and always eat all the food! We have two lists, one for guests to admit, and one for guests to refuse.</p>
+
+<p>Specifically, we want you to:</p>
+
+<ul>
+ <li>Write a loop that will iterate from 0 to the length of the <code>people</code> array. You'll need to start with an initializer of  <code>var i = 0;</code>, but what exit condition do you need?</li>
+ <li>During each loop iteration, check if the current array item is equal to "Phil" or "Lola" using a conditional statement:
+  <ul>
+   <li>If it is, concatenate the array item to the end of the <code>refused</code> paragraph's <code>textContent</code>, followed by a comma and a space.</li>
+   <li>If it isn't, concatenate the array item to the end of the <code>admitted</code> paragraph's <code>textContent</code>, followed by a comma and a space.</li>
+  </ul>
+ </li>
+</ul>
+
+<p>We've already provided you with:</p>
+
+<ul>
+ <li><code>var i = 0;</code> — Your initializer.</li>
+ <li><code>refused.textContent +=</code> — the beginnings of a line that will concatenate something on to the end of <code>refused.textContent</code>.</li>
+ <li><code>admitted.textContent +=</code> — the beginnings of a line that will concatenate something on to the end of <code>admitted.textContent</code>.</li>
+</ul>
+
+<p>Extra bonus question — after completing the above tasks successfully, you will be left with two lists of names, separated by commas, but they will be untidy — there will be a comma at the end of each one. Can you work out how to write lines that slice the last comma off in each case, and add a full stop to the end? Have a look at the <a href="/en-US/docs/Learn/JavaScript/First_steps/Useful_string_methods">Useful string methods</a> article for help.</p>
+
+<p>If you make a mistake, you can always reset the example with the "Reset" button. If you get really stuck, press "Show solution" to see a solution.</p>
+
+<div class="hidden">
+<h6 id="Active_learning_2">Active learning 2</h6>
+
+<pre class="brush: html notranslate">&lt;h2&gt;Live output&lt;/h2&gt;
+&lt;div class="output" style="height: 100px;overflow: auto;"&gt;
+  &lt;p class="admitted"&gt;Admit: &lt;/p&gt;
+  &lt;p class="refused"&gt;Refuse: &lt;/p&gt;
+&lt;/div&gt;
+
+&lt;h2&gt;Editable code&lt;/h2&gt;
+&lt;p class="a11y-label"&gt;Press Esc to move focus away from the code area (Tab inserts a tab character).&lt;/p&gt;
+&lt;textarea id="code" class="playable-code" style="height: 400px;width: 95%"&gt;
+var people = ['Chris', 'Anne', 'Colin', 'Terri', 'Phil', 'Lola', 'Sam', 'Kay', 'Bruce'];
+
+var admitted = document.querySelector('.admitted');
+var refused = document.querySelector('.refused');
+admitted.textContent = 'Admit: ';
+refused.textContent = 'Refuse: '
+
+// var i = 0;
+
+// refused.textContent += ;
+// admitted.textContent += ;
+
+&lt;/textarea&gt;
+
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="reset" type="button" value="Reset"&gt;
+  &lt;input id="solution" type="button" value="Show solution"&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css notranslate">html {
+  font-family: sans-serif;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+.a11y-label {
+  margin: 0;
+  text-align: right;
+  font-size: 0.7rem;
+  width: 98%;
+}
+
+body {
+  margin: 10px;
+  background: #f5f9fa;
+}</pre>
+
+<pre class="brush: js notranslate">var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var solution = document.getElementById('solution');
+var code = textarea.value;
+var userEntry = textarea.value;
+
+function updateCode() {
+  eval(textarea.value);
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  userEntry = textarea.value;
+  solutionEntry = jsSolution;
+  solution.value = 'Show solution';
+  updateCode();
+});
+
+solution.addEventListener('click', function() {
+  if(solution.value === 'Show solution') {
+    textarea.value = solutionEntry;
+    solution.value = 'Hide solution';
+  } else {
+    textarea.value = userEntry;
+    solution.value = 'Show solution';
+  }
+  updateCode();
+});
+
+var jsSolution = 'var people = [\'Chris\', \'Anne\', \'Colin\', \'Terri\', \'Phil\', \'Lola\', \'Sam\', \'Kay\', \'Bruce\'];\n\nvar admitted = document.querySelector(\'.admitted\');\nvar refused = document.querySelector(\'.refused\');\n\nadmitted.textContent = \'Admit: \';\nrefused.textContent = \'Refuse: \'\nvar i = 0;\n\ndo {\n if(people[i] === \'Phil\' || people[i] === \'Lola\') {\n refused.textContent += people[i] + \', \';\n } else {\n admitted.textContent += people[i] + \', \';\n }\n i++;\n} while(i &lt; people.length);\n\nrefused.textContent = refused.textContent.slice(0,refused.textContent.length-2) + \'.\';\nadmitted.textContent = admitted.textContent.slice(0,admitted.textContent.length-2) + \'.\';';
+var solutionEntry = jsSolution;
+
+textarea.addEventListener('input', updateCode);
+window.addEventListener('load', updateCode);
+
+// stop tab key tabbing out of textarea and
+// make it write a tab at the caret position instead
+
+textarea.onkeydown = function(e){
+  if (e.keyCode === 9) {
+    e.preventDefault();
+    insertAtCaret('\t');
+  }
+
+  if (e.keyCode === 27) {
+    textarea.blur();
+  }
+};
+
+function insertAtCaret(text) {
+  var scrollPos = textarea.scrollTop;
+  var caretPos = textarea.selectionStart;
+
+  var front = (textarea.value).substring(0, caretPos);
+  var back = (textarea.value).substring(textarea.selectionEnd, textarea.value.length);
+  textarea.value = front + text + back;
+  caretPos = caretPos + text.length;
+  textarea.selectionStart = caretPos;
+  textarea.selectionEnd = caretPos;
+  textarea.focus();
+  textarea.scrollTop = scrollPos;
+}
+
+// Update the saved userCode every time the user updates the text area code
+
+textarea.onkeyup = function(){
+  // We only want to save the state when the user code is being shown,
+  // not the solution, so that solution is not saved over the user code
+  if(solution.value === 'Show solution') {
+    userEntry = textarea.value;
+  } else {
+    solutionEntry = textarea.value;
+  }
+
+  updateCode();
+};</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Active_learning_2', '100%', 680, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<h2 id="Which_loop_type_should_you_use">Which loop type should you use?</h2>
+
+<p>For basic uses, <code>for</code>, <code>while</code>, and <code>do...while</code> loops are largely interchangeable. They can all be used to solve the same problems, and which one you use will largely depend on your personal preference — which one you find easiest to remember or most intuitive. Let's have a look at them again.</p>
+
+<p>First <code>for</code>:</p>
+
+<pre class="notranslate">for (initializer; exit-condition; final-expression) {
+  // code to run
+}</pre>
+
+<p><code>while</code>:</p>
+
+<pre class="notranslate">initializer
+while (exit-condition) {
+  // code to run
+
+  final-expression
+}</pre>
+
+<p>and finally <code>do...while</code>:</p>
+
+<pre class="notranslate">initializer
+do {
+  // code to run
+
+  final-expression
+} while (exit-condition)</pre>
+
+<p>We would recommend <code>for</code>, at least to begin with, as it is probably the easiest for remembering everything — the initializer, exit-condition, and final-expression all have to go neatly into the parentheses, so it is easy to see where they are and check that you aren't missing them.</p>
+
+<div class="note">
+<p><strong>Note</strong>: There are other loop types/features too, which are useful in advanced/specialized situations and beyond the scope of this article. If you want to go further with your loop learning, read our advanced <a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration">Loops and iteration guide</a>.</p>
+</div>
+
+<h2 id="Conclusion">Conclusion</h2>
+
+<p>This article has revealed to you the basic concepts behind, and different options available when, looping code in JavaScript. You should now be clear on why loops are a good mechanism for dealing with repetitive code, and be raring to use them in your own examples!</p>
+
+<p>If there is anything you didn't understand, feel free to read through the article again, or <a href="/en-US/Learn#Contact_us">contact us</a> to ask for help.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration">Loops and iteration in detail</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for">for statement reference</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/while">while</a> and <a href="/en-US/docs/Web/JavaScript/Reference/Statements/do...while">do...while</a> references</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/break">break</a> and <a href="/en-US/docs/Web/JavaScript/Reference/Statements/continue">continue</a> references</li>
+ <li>
+  <p class="entry-title"><a href="https://www.impressivewebs.com/javascript-for-loop/">What’s the Best Way to Write a JavaScript For Loop?</a> — some advanced loop best practices</p>
+ </li>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/JavaScript/Building_blocks/conditionals","Learn/JavaScript/Building_blocks/Functions", "Learn/JavaScript/Building_blocks")}}</p>
+
+<h2 id="In_this_module">In this module</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/conditionals">Making decisions in your code — conditionals</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code">Looping code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions">Functions — reusable blocks of code</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Build_your_own_function">Build your own function</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Return_values">Function return values</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introduction to events</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Building_blocks/Image_gallery">Image gallery</a></li>
+</ul>
+&lt;gdiv&gt;&lt;/gdiv&gt;
diff --git a/files/es/learn/javascript/client-side_web_apis/introducción/index.html b/files/es/learn/javascript/client-side_web_apis/introducción/index.html
deleted file mode 100644
index fc73d4ebc9..0000000000
--- a/files/es/learn/javascript/client-side_web_apis/introducción/index.html
+++ /dev/null
@@ -1,274 +0,0 @@
----
-title: Introducción a las APIs web
-slug: Learn/JavaScript/Client-side_web_APIs/Introducción
-translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/JavaScript/Client-side_web_APIs/Manipulating_documents", "Learn/JavaScript/Client-side_web_APIs")}}</div>
-
-<p class="summary">En primer lugar empezaremos echando un vistazo a las APIS desde un nivel superior — ¿qué son, cómo funcionan, cómo usarlas en el código, y cómo están estructuradas?. También echaremos un vistazo a cuáles son los principales tipos de APIs, y para qué se usan.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Pre requisitos:</th>
-   <td>Conocimientos básicos de informática, principios básicos de <a href="/es/docs/Learn/HTML">HTML</a>, <a href="/es/docs/Learn/CSS">CSS</a> y JavaScript (ver <a href="/es/docs/Learn/JavaScript/First_steps">primeros pasos</a>, <a href="/es/docs/Learn/JavaScript/Building_blocks">bloques de construcción</a>, <a href="/es/docs/Learn/JavaScript/Objects">objetos JavaScript</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Familiarizarse con las APIs, saber qué pueden hacer y cómo usarlas en tu código.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_son_las_APIs">¿Qué son las APIs?</h2>
-
-<p>Las Interfaces de Programacion de Aplicaciones (APIs por sus siglas en inglés) son construcciones disponibles en los lenguajes de programación que permiten a los desarrolladores crear funcionalidades complejas de una manera simple. Estas abstraen el código más complejo para proveer una sintaxis más fácil de usar en su lugar.</p>
-
-<p>Como ejemplo, piensa en el suministro de electricidad de tu casa, apartamento, o cualquier otro edificio. Si quieres usar un electrodoméstico, simplemente lo conectas en un enchufe y funciona. No intentas conectarlo directamente a la fuente de alimentación — hacerlo sería muy ineficiente y, si no eres electricista, dificil y peligroso.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14317/plug-socket.png" style="display: block; height: 472px; margin: 0px auto; width: 700px;"></p>
-
-<p><em>Fuente de la imagen: <a href="https://www.flickr.com/photos/easy-pics/9518184890/in/photostream/lightbox/">Overloaded plug socket</a> por <a href="https://www.flickr.com/photos/easy-pics/">The Clear Communication People</a>, en Flickr.</em></p>
-
-<p>De la misma manera, si quisieras programar gráficos 3D, sería mucho más facil hacerlo usando una API escrita en un lenguaje de alto nivel como JavaScript o Python, en lugar de intentar escribir código de bajo nivel (por ejemplo: C o C++) que controle directamente la GPU del equipo u otras funciones gráficas.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Consulta también la <a href="/es/docs/Glossary/API">entrada API en el glosario</a> para una descripción más detallada.</p>
-</div>
-
-<h3 id="APIs_en_JavaScript_del_lado_cliente">APIs en JavaScript del lado cliente</h3>
-
-<p>JavaScript del lado cliente, particularmente, tiene muchas APIs disponibles — estas <span id="result_box" lang="es"><span>no son parte del lenguaje en sí, sino que están construidas sobre el núcleo de este lenguaje de programación, proporcionándote superpoderes adicionales para usar en tu código.</span> <span>Por lo general, se dividen en dos categorías:</span></span></p>
-
-<ul>
- <li><span id="result_box" lang="es"><span><strong>Las APIs de navegador</strong> están integradas en tu navegador web y pueden exponer datos del navegador y del entorno informático circundante y hacer cosas complejas y útiles con él.</span> <span>Por ejemplo, la API de Geolocalización proporciona algunas construcciones simples de JavaScript para obtener datos de ubicación con los que, por ejemplo, trazar tu ubicación en un mapa de Google.</span> Realmente, el navegador está haciendo uso<span> de códigos de bajo nivel complejos en segundo plano (por ejemplo, C++) para comunicarse con el hardware GPS del dispositivo (o lo que esté disponible para determinar los datos de posición), recuperar datos de posición y devolverlos al entorno del navegador para su uso</span> <span>en tu código.</span> <span>Pero una vez más, la API se encarga de abstraer esta complejidad.</span></span></li>
- <li><strong>Las APIs de terceros </strong>no están incluídas por defecto en el navegador, y por lo general es necesario obtener el código e información desde algún lugar de la Web. Por ejemplo, <a href="https://dev.twitter.com/overview/documentation">la API de Twitter</a> permite hacer cosas como mostrar tus últimos tweets en un sitio web. Proporciona un conjunto especial de construcciones que puedes usar para consultar el servicio de Twitter y devolver información específica.</li>
-</ul>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13508/browser.png" style="display: block; height: 511px; margin: 0px auto; width: 815px;"></p>
-
-<h3 id="Relacion_entre_JavaScript_APIs_y_otras_herramientas_de_JavaScript">Relacion entre JavaScript, APIs, y otras herramientas de JavaScript</h3>
-
-<p><span id="result_box" lang="es"><span>Anteriormente hablamos sobre qué son las APIs de JavaScript del lado cliente y cómo se relacionan con este lenguaje.</span> <span>Recapitulemos ahora para dejarlo claro, y veamos también dónde encajan otras herramientas de JavaScript:</span></span></p>
-
-<ul>
- <li>JavaScript — Un lenguaje de scripts de alto nivel incorporado en los navegadores que permite implementar interactividad en páginas web / apps. <span id="result_box" lang="es"><span>Ten en cuenta que JavaScript también está disponible en otros entornos de programación, como <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/Introduction">Node</a>.</span></span></li>
- <li>APIs de navegador — Construcciones integradas en el navegador creadas con el lenguaje JavaScript y que permiten implementar funcionalidad mucho más fácilmente.</li>
- <li>APIs de terceros — <span id="result_box" lang="es"><span>Construcciones integradas en plataformas de terceros (por ejemplo Twitter, Facebook) que permiten usar algunas de las funcionalidades de esa plataforma en tus páginas web (como por ejemplo mostrar tus últimos Tweets en tu página web).</span></span></li>
- <li>Librerías JavaScript — Por lo general uno o más archivos JavaScript que contienen <a href="/es/docs/Learn/JavaScript/Building_blocks/Functions#Custom_functions">funciones personalizadas</a> que puedes añadir a tu página web para acelerar o habilitar la escritura de funcionalidades comunes. Por ejemplo jQuery, Mootools y React.</li>
- <li>Frameworks JavaScript — <span id="result_box" lang="es"><span>El siguiente paso a las librerías, los frameworks JavaScript (como Angular y Ember) suelen ser paquetes de HTML, CSS, JavaScript y otras tecnologías que se instalan y luego se usan para escribir una aplicación web completa desde cero.</span> <span>La diferencia clave entre una librería y un framework es la "Inversión del control".</span> <span>Cuando se llama a un método desde una librería, el desarrollador tiene el control.</span> <span>Con un framework el control se invierte: el framework llama al código del desarrollador.</span></span></li>
-</ul>
-
-<h2 id="¿Qué_pueden_hacer_las_APIs"><span class="short_text" id="result_box" lang="es"><span>¿Qué pueden hacer las APIs?</span></span></h2>
-
-<p><span id="result_box" lang="es"><span>Hay una gran cantidad de APIs disponibles en los navegadores modernos que te permiten hacer una gran variedad de cosas en tu código.</span> <span>Puedes verlo echando un vistazo al</span></span> <a href="https://developer.mozilla.org/es/docs/Web/API">índice de APIs de MDN</a>.</p>
-
-<h3 id="APIs_de_navegador_más_comunes">APIs de navegador más comunes</h3>
-
-<p><span id="result_box" lang="es"><span>En particular, las categorías más comunes de APIs de navegador más usadas (y que trataremos con mayor detalle en este módulo) son:</span></span></p>
-
-<ul>
- <li><strong>APIs para manipular documentos</strong> cargados en el navegador. El ejemplo más obvio es la <a href="https://developer.mozilla.org/es/docs/Web/API/Document_Object_Model">API DOM (Document Object Model)</a>, que permite manipular HTML y CSS — crear, eliminar y modificar HTML, aplicar estilos dinámicos a una página, etc. Cada vez que se muestra una ventana emergente en una página, o un nuevo contenido, por ejemplo, es el DOM en acción. Más información sobre este tipo de APIs en <a href="/es/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">Manipulando documentos</a>.</li>
- <li><strong>APIs que obtienen datos del servidor,</strong> comunmente usadas para actualizar pequeñas secciones de una página web. Este aparente pequeño detalle tiene un gran impacto en el performance y en el comportamiento de los sitios. — Sí solo necesitas actualizar un Stock de artículos o una lista de tiendas disponibles, al utilizar APIs para obtener datos desde el servidor lo lograrás sin tener que volver a cargar toda la página o aplicación logrando que estas tengan una sensación de rapidez y agilidad. Las APIs hacen esto posible gracias a que incluyen <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest" title="XMLHttpRequest is an API that provides client functionality for transferring data between a client and a server. It provides an easy way to retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just a part of the page without disrupting what the user is doing."><code>XMLHttpRequest</code></a> y la <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch API</a>. Tambièn puede encontrar el termino Ajax que describe esta técnica. Más información sobre este tipo de APIs en <a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">Fetching data from the server</a>.</li>
- <li><strong>Las APIs para dibujar y manipular graficos</strong> ya son soportadas por la mayoría de navegadores. Las más populares son <a href="/en-US/docs/Web/API/Canvas_API">Canvas</a> y <a href="/en-US/docs/Web/API/WebGL_API">WebGL</a>, que permiten actualizar la información de cada uno de los píxeles contenidos en un {{htmlelement("canvas")}} HTML, para crear escenas 2D y 3D. Por ejemplo, se pueden dibujar formas como rectángulos o círculos, importar una imagen en el canvas y aplicarle filtros como sepia o escala de grises usando la API de Canvas, o crear una escena compleja 3D con iluminación y texturas usando WebGL. Estas APIs, a menudo se combinan con apis para crear bucles de animación (como {{domxref("window.requestAnimationFrame()")}}) y otras veces para hacer que se actualicen constantemente escenas de dibujos animados o videojuegos.</li>
- <li><strong><a href="https://developer.mozilla.org/en-US/Apps/Fundamentals/Audio_and_video_delivery">APIS de audio y vídeo</a></strong> como {{domxref("HTMLMediaElement")}}, la <a href="/en-US/docs/Web/API/Web_Audio_API">Web Audio API</a>, y <a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a> te permitirán hacer cosas realmente interesantes con elementos multimedia: crear una interfaz personalizada para los controles de reproducción de audio y vídeo, mostrar pistas de texto con subtítulos junto con el vídeo, capturar vídeo de la cámara web para ser manipulado en un canvas (ver más arriba) o mostrado en el ordenador de otra persona en una videoconferencia, añadir efectos a las pistas de audio (como ganancia, distorsión, retardo, etc).</li>
- <li><strong>Las APIs de dispositivos</strong> son básicamente APIs para manipular y recuperar información de dispositivos modernos de hardware de forma que sean útiles para aplicaciones web. Ya hemos hablado de la API de geolocalización, que accede a la información de ubicación del dispositivo, de forma que te pueda localizar en un mapa. Otros ejemplos incluyen indicar al usuario de que una actulización útil está disponible en una aplicación web mediante notificaciones de sistema (ver <a href="/en-US/docs/Web/API/Notifications_API">Notifications API</a>) o la vibración de hardware (ver <a href="/en-US/docs/Web/API/Vibration_API">Vibration API</a>).</li>
- <li>Las <strong>APIS de almacenamiento en el lado del cliente</strong> se están popularizando en los navegadores. La habilidad de almacenar información en el lado del cliente es muy útil para hacer aplicaciones que salven su estado entre carga de páginas, e incluso trabajar cuando el dispositivo está fuera de línea. Hay varias opciones disponibles, por ejemplo el almacenamiento en pares de clave/valor con <a href="/en-US/docs/Web/API/Web_Storage_API" style="font-size: 1rem; letter-spacing: -0.00278rem;">Web Storage API</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, y una forma más compleja de almacenar datos tabulados mediante la </span><a href="/en-US/docs/Web/API/IndexedDB_API" style="font-size: 1rem; letter-spacing: -0.00278rem;">IndexedDB API</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span></li>
-</ul>
-
-<h3 id="APIs_populares_de_terceros">APIs populares de terceros</h3>
-
-<p>Existe una gran variedad de APIs de terceros, algunas de las más populares de las que querrás hacer uso en algún momento son:</p>
-
-<ul>
- <li>La <a href="https://dev.twitter.com/overview/documentation">API de Twitter</a>, que te permite hacer cosas como mostrar tus ultimos tweets en tu sitio web.</li>
- <li>La <a href="https://developers.google.com/maps/">API de Google Maps</a> permite hacer todo tipo de cosas con mapas en tus páginas web (incluso hace funcionar Google Maps). Actualmente, existe todo un conjunto de apis que te permiten realizar una gran variedad de tareas, como se puede ver en <a href="https://developers.google.com/maps/documentation/api-picker">Google Maps API Picker</a>.</li>
- <li>El <a href="https://developers.facebook.com/docs/">conjunto de APIs de Facebook</a> te permite usar partes del ecosistema de facebook para mejorar tu aplicación, por ejemplo aportando la posiblidad de identificación mediante el login de Facebook, aceptar pagos en la aplicación, desplegar campañas de anuncios para un target concreto, etc.</li>
- <li>La <a href="https://developers.google.com/youtube/">YouTube API</a>, te permite integrar videos de Youtube en tu sitio, buscar en Youtube, construir listas de reproducción y más.</li>
- <li>La <a href="https://www.twilio.com/">Twilio API</a>, provee de un framework para crear la funcionalidad de llamadas y videollamadas en tus aplicaciones, enviar SMS o MMS y más.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: puedes encontrar información de una gran cantidad de APIs de terceros en el <a href="http://www.programmableweb.com/category/all/apis">Programmable Web API directory</a>.</p>
-</div>
-
-<h2 id="¿Cómo_funcionan_las_APIs">¿Cómo funcionan las APIs?</h2>
-
-<p>Las distintas APIs de JavaScript funcionan de forma ligeramente diferente, pero generalmente tienen características similares y una forma parecida en cómo trabajan.</p>
-
-<h3 id="Están_basadas_en_objetos">Están basadas en objetos</h3>
-
-<p>Las APIs interactúan con tu código usando uno o más <a href="/en-US/docs/Learn/JavaScript/Objects">Objetos JavaScript,</a> que sirven como contenedores para los datos que usa la API (contenidos en las propiedades del objeto), y la funcionalidad que la API provee (contenida en los métodos del objeto).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: si no estás familiarizado en cómo trabajar con objetos, deberías volver atrás y revisar el módulo de <a href="/en-US/docs/Learn/JavaScript/Objects">objetos JavaScript </a>antes de seguir.</p>
-</div>
-
-<p>Volvamos al ejemplo de la API de Geolocalización, que es una API muy simple que consiste en unos pocos objetos sencillos:</p>
-
-<ul>
- <li>{{domxref("Geolocation")}}, que contiene tres métodos para controlar la recuperación de los datos geográficos.</li>
- <li>{{domxref("Position")}}, que representa la posición de un dispositivo en un momento dado — esto contiene un objeto {{domxref("Coordinates")}} que contiene la información de la posición actual, además de una marca de tiempo con el momento exacto.</li>
- <li>{{domxref("Coordinates")}}, que contiene una gran cantidad de datos útiles sobre la posición del dispositivo, incluyendo latitud y longitud, altitud, velocidad, dirección de movimiento y más.</li>
-</ul>
-
-<p>¿Cómo interactúan estos objetos? Si miras a nuestro ejemplo <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/introduction/maps-example.html">maps-example.html</a> (<a href="http://mdn.github.io/learning-area/javascript/apis/introduction/maps-example.html">ver también en vivo</a>), encontrarás el siguiente código:</p>
-
-<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) {
-  var latlng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
-  var myOptions = {
-    zoom: 8,
-    center: latlng,
-    mapTypeId: google.maps.MapTypeId.TERRAIN,
-    disableDefaultUI: true
-  }
-  var map = new google.maps.Map(document.querySelector("#map_canvas"), myOptions);
-});</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: cuando cargues por primera vez el ejemplo de arriba, se te mostrará un mensaje preguntando si deseas compartir tu localización con esta aplicación (ver la sección {{anch("They have additional security mechanisms where appropriate")}} que se encuentra más adelante en este artículo). Deberás estar de acuerdo con esto para poder ver tu localización en el mapa. Si aún así sigues sin ver tu localización, tal vez debas establecer los permisos manualmente; lo puedes hacer de varias formas dependiendo del navegador que estés usando; por ejemplo en Firefox debes ir a  &gt; <em>Tools</em> &gt; <em>Page Info</em> &gt; <em>Permissions</em>, y cambiar la configuración para <em>Share Location</em>; en Chrome ve a <em>Settings</em> &gt; <em>Privacy</em> &gt; <em>Show advanced settings</em> &gt; <em>Content settings</em> y cambia las opciones para <em>Location</em>.</p>
-</div>
-
-<p>Primero queremos usar el método {{domxref("Geolocation.getCurrentPosition()")}} para retornar la posición actuali de nuestro dispositivo. El objeto {{domxref("Geolocation")}} del navegador es accedido llamando a la propiedad {{domxref("Navigator.geolocation")}}, así que comenzaremos haciendo:</p>
-
-<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) { ... });</pre>
-
-<p>Lo que es equivalente a hacer algo como:</p>
-
-<pre class="brush: js">var myGeo = navigator.geolocation;
-myGeo.getCurrentPosition(function(position) { ... });</pre>
-
-<p>Pero podemos usar la sintaxis con punto para concatener nuestros accesos a propiedades/métodos reduciendo el número de líneas que tenemos que escribir.</p>
-
-<p>El método {{domxref("Geolocation.getCurrentPosition()")}} solamente tiene un parámetroobligatorio, que es una función anónima que se ejecutará cuando se recupere correctamente la ubicación del dispositivo. Esta función tiene un parámetro, que contiene un objeto<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> {{domxref("Position")}} con la representación de los datos de la posición actual.</span></p>
-
-<div class="note">
-<p><strong>Nota</strong>: una función que es tomada por otra función como argumento es conocida con el nombre de <a href="/en-US/docs/Glossary/Callback_function">callback function</a>.</p>
-</div>
-
-<p>Este patrón de invocar una función solamente cuando una operación ha sido completada es muy común en las APIs de Javascript — asegurando que una operación ha sido completada antes de intentar usar los datos que retorna en otra operación. Estas operaciones se llaman <strong><a href="/en-US/docs/Glossary/Asynchronous">operaciones asíncronas</a></strong>. Puesto que obtener la posición actual del dispositivo recae en un componente externo (el GPS del dispositivo u otro hardware de geolocalización), no podemos asegurar que se haga a tiempo para usar inmediatamente los datos. Por tanto, algo así no funcionará:</p>
-
-<pre class="brush: js example-bad">var position = navigator.geolocation.getCurrentPosition();
-var myLatitude = position.coords.latitude;</pre>
-
-<p>Si la primera línea no ha retornado todavía su resultado, la segunda línea lanzará un error puesto que los datos de posición no estarán disponibles. Por esa razón, las APIs que tienen operaciones asíncronas se diseñan para usar<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> {{glossary("callback function")}}s, o el sistema más moderno de </span><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" style="font-size: 1rem; letter-spacing: -0.00278rem;">Promises</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, que se ha introducido en ECMAScript 6 y se está usando mucho en las APIs más nuevas.</span></p>
-
-<p>Vamos a combinar la API de geolocalización con una API de terceros — la API de Google Maps — que se usa para dibujar la localización retornada por <code>getCurrentPosition()</code> en un mapa de Google. Haremos disponible esta API en nuestra página vinculándonos a ella — encontrarás esta línea en el HTML:</p>
-
-<pre class="brush: html">&lt;script type="text/javascript" src="https://maps.google.com/maps/api/js?key=AIzaSyDDuGt0E5IEGkcE6ZfrKfUtE9Ko_de66pA"&gt;&lt;/script&gt;</pre>
-
-<p>Para usar la API, primero creamos una instancia del objeto <code>LatLng</code> usando el constructor <code>google.maps.LatLng()</code>, que toma los valores de nuestra {{domxref("Coordinates.latitude")}} y {{domxref("Coordinates.longitude")}} geolocalizada como parámetros:</p>
-
-<pre class="brush: js">var latlng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);</pre>
-
-<p>Este objeto quedará establecido como el valor de la propiedad<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">center</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> de un objeto de opciones que hemos llamado </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">myOptions</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">. Entonces crearemos una instancia de objeto para representar nuestro mapa llamando al constructor de </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">google.maps.Map()</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, pasándole sus dos parámetros — una referencia al elemento {{htmlelement("div")}} donde queremos presentar el mapa (con ID </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">map_canvas</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">), y el objeto de opciones que acabamos de definir.</span></p>
-
-<pre class="brush: js">var myOptions = {
-  zoom: 8,
-  center: latlng,
-  mapTypeId: google.maps.MapTypeId.TERRAIN,
-  disableDefaultUI: true
-}
-
-var map = new google.maps.Map(document.querySelector("#map_canvas"), myOptions);</pre>
-
-<p>Una vez hecho, veremos dibujado nuestro mapa.</p>
-
-<p>Este último bloque de código muestra dos patrones habituales que veremos en muchas APIs. Primero, los objetos de las APIs habitualmente disponen de constructores, que son invocados para crear instancias de esos objetos que que habitualmente usaremos en nuestros programas. Segundo, los objetos de las APIs a menudo ofrecen múltiples opciones que pueden ser adaptadas para obtener exactamente lo que queremos en nuestro programa. Los constructores de las APIs habitualmente aceptan un objeto de opciones como parámetro, que es donde se deben establecer dichas opciones.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: no te preocupes si no entiendes todos los detalles de este ejemplo inmediantamente. Los repasaremos usando APIs de terceros con más detalle en un artículo futuro.</p>
-</div>
-
-<h3 id="Tienen_puntos_de_acceso_reconocibles">Tienen puntos de acceso reconocibles</h3>
-
-<p>Cuando uses una API, debes estar seguro que conoces dónde están los puntos de acceso para ella. En la API de Geolocalización esto es bastante sencillo  — es la propiedad {{domxref("Navigator.geolocation")}}, que retorna el objeto del navegador {{domxref("Geolocation")}} que contiene todos los métodos útiles de geolocalización disponibles en su interior.</p>
-
-<p>La API del Modelo de Objetos del Navegador (DOM) tiene un punto de acceso todavía más simple — sus características las podemos encontrar colgando del objeto {{domxref("Document")}}, o una instancia de un elemento HTML que queremos modificar de alguna forma, por ejemplo:</p>
-
-<pre class="brush: js">var em = document.createElement('em'); // crear un nuevo elemento em
-var para = document.querySelector('p'); // referencia a un elemento p existente
-em.textContent = 'Hello there!'; // dar al em algo de contenido textual
-para.appendChild(em); // ubicar el em dentro del párrafo</pre>
-
-<p>Otras APIs tienen puntos de acceso ligeramente más complejos, que a menudo implican crear un contexto específico para escribir el código de la API. Por ejemplo, el objeto de contexto de la API Canvas se crea obteniendo una referencia al elemento<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> {{htmlelement("canvas")}} en el que quieres dibujar, y a continuación invocando su método {{domxref("HTMLCanvasElement.getContext()")}}:</span></p>
-
-<pre class="brush: js">var canvas = document.querySelector('canvas');
-var ctx = canvas.getContext('2d');</pre>
-
-<p>Cualquier cosa que queramos hacerle al canvas, se conseguirá llamando a las propiedades y métodos del objeto de contexto (que es una instancia de {{domxref("CanvasRenderingContext2D")}}), por ejemplo:</p>
-
-<pre class="brush: js">Ball.prototype.draw = function() {
-  ctx.beginPath();
-  ctx.fillStyle = this.color;
-  ctx.arc(this.x, this.y, this.size, 0, 2 * Math.PI);
-  ctx.fill();
-};</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: puedes ver este código en acción en nuetro <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/introduction/bouncing-balls.html">bouncing balls demo</a> (y también verlo <a href="http://mdn.github.io/learning-area/javascript/apis/introduction/bouncing-balls.html">funcionando</a>).</p>
-</div>
-
-<h3 id="Usan_eventos_para_manejar_cambios_en_su_estado">Usan eventos para manejar cambios en su estado</h3>
-
-<p>Ya hemos discutido anteriormente los eventos en este curso, en nuestro artículo de <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introducción a los eventos</a> — este artículo detalla qué son los eventos del lado del cliente y cómo se usan en el código. Si no estás familiarizado en cómo se trabaja con la API de eventos del lado del cliente, deberías ir a consultar este artículo antes de continuar.</p>
-
-<p>Algunas APIs web no contienen eventos, pero algunas otras sí contienen un buen número de ellos. Las propiedades para manejarlos, que nos permiten ejecutar funciones cuando los eventos se producen, generalmente se listan en nuestro material de referencia en secciones de "Manejadores de Eventos" separadas. Como ejemplo simple, instancias del objeto <code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> (cada uno representa una petición HTTP al servidor para recuperar un nuevo recurso de algún tipo) tienen un número de eventos disponibles, por ejemplo el evento <code>load</code> que es disparado cuando una respuesta ha sido retornada satisfactoriamente conteniendo el recurso solicitado, y ahora está disponible.</p>
-
-<p>El siguiente código aporta un ejemplo simple de cómo se debe usar esto:</p>
-
-
-
-<pre class="brush: js">var requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';
-var request = new XMLHttpRequest();
-request.open('GET', requestURL);
-request.responseType = 'json';
-request.send();
-
-request.onload = function() {
-  var superHeroes = request.response;
-  populateHeader(superHeroes);
-  showHeroes(superHeroes);
-}</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: puedes ver este código en acción en nuestro ejemplo <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/introduction/ajax.html">ajax.html</a> (<a href="http://mdn.github.io/learning-area/javascript/apis/introduction/ajax.html">verlo en vivo</a>).</p>
-</div>
-
-<p>Las primeras cinco líneas especifican la licalización del recurso que queremos recuperar, se crea una nueva instancia del objeto con la petición usando el constructor <code>XMLHttpRequest()</code>, se abre una petición HTTP <code>GET</code> para recuperar el recurso especificado, se indica que la respuesta debería ser enviada en formato JSON, y finalmente se envía la petición.</p>
-
-<p>El manejador <code>onload</code> especifica entonces qué hacer con la respuesta. Ya sabemos que la respuesta será retornada satisfactoriamente y estará disponible tras producirse el evento load (a menos que haya sucedido un error), así que salvamos la respuesta que contiene el código JSON retornado en la variable <code style="font-size: 1rem; letter-spacing: -0.00278rem;">superHeroes</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, luego lo pasamos a dos funciones diferentes para un procesado posterior.</span></p>
-
-<h3 id="Tienen_mecanismos_adicionales_de_seguridad_donde_sea_necesario">Tienen mecanismos adicionales de seguridad donde sea necesario</h3>
-
-<p>Las características de las WebAPI están sujetas a las mismas consideraciones de seguridad que JavaScript y otras tecnologías web (por ejemplo <a href="/en-US/docs/Web/Security/Same-origin_policy">same-origin policy</a>), pero a veces tienen mecanismos adicionales de seguridad. Por ejemplo, algunas de las WebAPIs más modernas solamente funcionan en páginas servidas mediante HTTPS debido a que transmiten información potencialmente sensible (algunos ejemplos son <a href="/en-US/docs/Web/API/Service_Worker_API">Service Workers</a> y <a href="/en-US/docs/Web/API/Push_API">Push</a>).</p>
-
-<p>Además, algunas WebAPIs solicitarán permiso al usuario para ser activadas cuando se produzcan las llamadas desde el código. Como ejemplo, habrás observado un cuadro de diálogo como éste al probar nuestro ejemplo anterior de <a href="/en-US/docs/Web/API/Geolocation">Geolocalización</a>:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14313/location-permission.png" style="border-style: solid; border-width: 1px; display: block; height: 188px; margin: 0px auto; width: 413px;"></p>
-
-<p>La <a href="/en-US/docs/Web/API/Notifications_API">Notifications API</a> solicita los permisos de una forma parecida:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14315/notification-permission.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
-
-<p>Estos diálogos solicitando permiso se muestran al usuario por motivos de seguridad — si no estuvieran, los sitios podrían rastrear la localización sin que el usuario lo supiera o bombardearlo con un montón de notificaciones molestas.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>En este punto, deberías tener ya una buena idea de los que son las APIs, cómo trabajan y qué puedes hacer con ellas en tu código JavaScript. Seguramente estarás con ganas de comenzar a hacer cosas divertidas con algunas APIs específicas, así que ¡vamos allá! A continuación veremos cómo manipular documentos con el Modelo de Objetos del Documento (DOM).</p>
-
-<p>{{NextMenu("Learn/JavaScript/Client-side_web_APIs/Manipulating_documents", "Learn/JavaScript/Client-side_web_APIs")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">Introducción a las APIs web</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">Manipulando documentos</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">Recuperando información del servidor</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Third_party_APIs">APIs de terceros</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">Dibujando gráficos</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs">APIs de vídeo y audio</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage">Almacenamiento en el lado del cliente</a></li>
-</ul>
diff --git a/files/es/learn/javascript/client-side_web_apis/introduction/index.html b/files/es/learn/javascript/client-side_web_apis/introduction/index.html
new file mode 100644
index 0000000000..931a5d1328
--- /dev/null
+++ b/files/es/learn/javascript/client-side_web_apis/introduction/index.html
@@ -0,0 +1,275 @@
+---
+title: Introducción a las APIs web
+slug: Learn/JavaScript/Client-side_web_APIs/Introduction
+translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction
+original_slug: Learn/JavaScript/Client-side_web_APIs/Introducción
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/JavaScript/Client-side_web_APIs/Manipulating_documents", "Learn/JavaScript/Client-side_web_APIs")}}</div>
+
+<p class="summary">En primer lugar empezaremos echando un vistazo a las APIS desde un nivel superior — ¿qué son, cómo funcionan, cómo usarlas en el código, y cómo están estructuradas?. También echaremos un vistazo a cuáles son los principales tipos de APIs, y para qué se usan.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Pre requisitos:</th>
+   <td>Conocimientos básicos de informática, principios básicos de <a href="/es/docs/Learn/HTML">HTML</a>, <a href="/es/docs/Learn/CSS">CSS</a> y JavaScript (ver <a href="/es/docs/Learn/JavaScript/First_steps">primeros pasos</a>, <a href="/es/docs/Learn/JavaScript/Building_blocks">bloques de construcción</a>, <a href="/es/docs/Learn/JavaScript/Objects">objetos JavaScript</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Familiarizarse con las APIs, saber qué pueden hacer y cómo usarlas en tu código.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_son_las_APIs">¿Qué son las APIs?</h2>
+
+<p>Las Interfaces de Programacion de Aplicaciones (APIs por sus siglas en inglés) son construcciones disponibles en los lenguajes de programación que permiten a los desarrolladores crear funcionalidades complejas de una manera simple. Estas abstraen el código más complejo para proveer una sintaxis más fácil de usar en su lugar.</p>
+
+<p>Como ejemplo, piensa en el suministro de electricidad de tu casa, apartamento, o cualquier otro edificio. Si quieres usar un electrodoméstico, simplemente lo conectas en un enchufe y funciona. No intentas conectarlo directamente a la fuente de alimentación — hacerlo sería muy ineficiente y, si no eres electricista, dificil y peligroso.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14317/plug-socket.png" style="display: block; height: 472px; margin: 0px auto; width: 700px;"></p>
+
+<p><em>Fuente de la imagen: <a href="https://www.flickr.com/photos/easy-pics/9518184890/in/photostream/lightbox/">Overloaded plug socket</a> por <a href="https://www.flickr.com/photos/easy-pics/">The Clear Communication People</a>, en Flickr.</em></p>
+
+<p>De la misma manera, si quisieras programar gráficos 3D, sería mucho más facil hacerlo usando una API escrita en un lenguaje de alto nivel como JavaScript o Python, en lugar de intentar escribir código de bajo nivel (por ejemplo: C o C++) que controle directamente la GPU del equipo u otras funciones gráficas.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Consulta también la <a href="/es/docs/Glossary/API">entrada API en el glosario</a> para una descripción más detallada.</p>
+</div>
+
+<h3 id="APIs_en_JavaScript_del_lado_cliente">APIs en JavaScript del lado cliente</h3>
+
+<p>JavaScript del lado cliente, particularmente, tiene muchas APIs disponibles — estas <span id="result_box" lang="es"><span>no son parte del lenguaje en sí, sino que están construidas sobre el núcleo de este lenguaje de programación, proporcionándote superpoderes adicionales para usar en tu código.</span> <span>Por lo general, se dividen en dos categorías:</span></span></p>
+
+<ul>
+ <li><span id="result_box" lang="es"><span><strong>Las APIs de navegador</strong> están integradas en tu navegador web y pueden exponer datos del navegador y del entorno informático circundante y hacer cosas complejas y útiles con él.</span> <span>Por ejemplo, la API de Geolocalización proporciona algunas construcciones simples de JavaScript para obtener datos de ubicación con los que, por ejemplo, trazar tu ubicación en un mapa de Google.</span> Realmente, el navegador está haciendo uso<span> de códigos de bajo nivel complejos en segundo plano (por ejemplo, C++) para comunicarse con el hardware GPS del dispositivo (o lo que esté disponible para determinar los datos de posición), recuperar datos de posición y devolverlos al entorno del navegador para su uso</span> <span>en tu código.</span> <span>Pero una vez más, la API se encarga de abstraer esta complejidad.</span></span></li>
+ <li><strong>Las APIs de terceros </strong>no están incluídas por defecto en el navegador, y por lo general es necesario obtener el código e información desde algún lugar de la Web. Por ejemplo, <a href="https://dev.twitter.com/overview/documentation">la API de Twitter</a> permite hacer cosas como mostrar tus últimos tweets en un sitio web. Proporciona un conjunto especial de construcciones que puedes usar para consultar el servicio de Twitter y devolver información específica.</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13508/browser.png" style="display: block; height: 511px; margin: 0px auto; width: 815px;"></p>
+
+<h3 id="Relacion_entre_JavaScript_APIs_y_otras_herramientas_de_JavaScript">Relacion entre JavaScript, APIs, y otras herramientas de JavaScript</h3>
+
+<p><span id="result_box" lang="es"><span>Anteriormente hablamos sobre qué son las APIs de JavaScript del lado cliente y cómo se relacionan con este lenguaje.</span> <span>Recapitulemos ahora para dejarlo claro, y veamos también dónde encajan otras herramientas de JavaScript:</span></span></p>
+
+<ul>
+ <li>JavaScript — Un lenguaje de scripts de alto nivel incorporado en los navegadores que permite implementar interactividad en páginas web / apps. <span id="result_box" lang="es"><span>Ten en cuenta que JavaScript también está disponible en otros entornos de programación, como <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/Introduction">Node</a>.</span></span></li>
+ <li>APIs de navegador — Construcciones integradas en el navegador creadas con el lenguaje JavaScript y que permiten implementar funcionalidad mucho más fácilmente.</li>
+ <li>APIs de terceros — <span id="result_box" lang="es"><span>Construcciones integradas en plataformas de terceros (por ejemplo Twitter, Facebook) que permiten usar algunas de las funcionalidades de esa plataforma en tus páginas web (como por ejemplo mostrar tus últimos Tweets en tu página web).</span></span></li>
+ <li>Librerías JavaScript — Por lo general uno o más archivos JavaScript que contienen <a href="/es/docs/Learn/JavaScript/Building_blocks/Functions#Custom_functions">funciones personalizadas</a> que puedes añadir a tu página web para acelerar o habilitar la escritura de funcionalidades comunes. Por ejemplo jQuery, Mootools y React.</li>
+ <li>Frameworks JavaScript — <span id="result_box" lang="es"><span>El siguiente paso a las librerías, los frameworks JavaScript (como Angular y Ember) suelen ser paquetes de HTML, CSS, JavaScript y otras tecnologías que se instalan y luego se usan para escribir una aplicación web completa desde cero.</span> <span>La diferencia clave entre una librería y un framework es la "Inversión del control".</span> <span>Cuando se llama a un método desde una librería, el desarrollador tiene el control.</span> <span>Con un framework el control se invierte: el framework llama al código del desarrollador.</span></span></li>
+</ul>
+
+<h2 id="¿Qué_pueden_hacer_las_APIs"><span class="short_text" id="result_box" lang="es"><span>¿Qué pueden hacer las APIs?</span></span></h2>
+
+<p><span id="result_box" lang="es"><span>Hay una gran cantidad de APIs disponibles en los navegadores modernos que te permiten hacer una gran variedad de cosas en tu código.</span> <span>Puedes verlo echando un vistazo al</span></span> <a href="https://developer.mozilla.org/es/docs/Web/API">índice de APIs de MDN</a>.</p>
+
+<h3 id="APIs_de_navegador_más_comunes">APIs de navegador más comunes</h3>
+
+<p><span id="result_box" lang="es"><span>En particular, las categorías más comunes de APIs de navegador más usadas (y que trataremos con mayor detalle en este módulo) son:</span></span></p>
+
+<ul>
+ <li><strong>APIs para manipular documentos</strong> cargados en el navegador. El ejemplo más obvio es la <a href="https://developer.mozilla.org/es/docs/Web/API/Document_Object_Model">API DOM (Document Object Model)</a>, que permite manipular HTML y CSS — crear, eliminar y modificar HTML, aplicar estilos dinámicos a una página, etc. Cada vez que se muestra una ventana emergente en una página, o un nuevo contenido, por ejemplo, es el DOM en acción. Más información sobre este tipo de APIs en <a href="/es/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">Manipulando documentos</a>.</li>
+ <li><strong>APIs que obtienen datos del servidor,</strong> comunmente usadas para actualizar pequeñas secciones de una página web. Este aparente pequeño detalle tiene un gran impacto en el performance y en el comportamiento de los sitios. — Sí solo necesitas actualizar un Stock de artículos o una lista de tiendas disponibles, al utilizar APIs para obtener datos desde el servidor lo lograrás sin tener que volver a cargar toda la página o aplicación logrando que estas tengan una sensación de rapidez y agilidad. Las APIs hacen esto posible gracias a que incluyen <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest" title="XMLHttpRequest is an API that provides client functionality for transferring data between a client and a server. It provides an easy way to retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just a part of the page without disrupting what the user is doing."><code>XMLHttpRequest</code></a> y la <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch API</a>. Tambièn puede encontrar el termino Ajax que describe esta técnica. Más información sobre este tipo de APIs en <a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">Fetching data from the server</a>.</li>
+ <li><strong>Las APIs para dibujar y manipular graficos</strong> ya son soportadas por la mayoría de navegadores. Las más populares son <a href="/en-US/docs/Web/API/Canvas_API">Canvas</a> y <a href="/en-US/docs/Web/API/WebGL_API">WebGL</a>, que permiten actualizar la información de cada uno de los píxeles contenidos en un {{htmlelement("canvas")}} HTML, para crear escenas 2D y 3D. Por ejemplo, se pueden dibujar formas como rectángulos o círculos, importar una imagen en el canvas y aplicarle filtros como sepia o escala de grises usando la API de Canvas, o crear una escena compleja 3D con iluminación y texturas usando WebGL. Estas APIs, a menudo se combinan con apis para crear bucles de animación (como {{domxref("window.requestAnimationFrame()")}}) y otras veces para hacer que se actualicen constantemente escenas de dibujos animados o videojuegos.</li>
+ <li><strong><a href="https://developer.mozilla.org/en-US/Apps/Fundamentals/Audio_and_video_delivery">APIS de audio y vídeo</a></strong> como {{domxref("HTMLMediaElement")}}, la <a href="/en-US/docs/Web/API/Web_Audio_API">Web Audio API</a>, y <a href="/en-US/docs/Web/API/WebRTC_API">WebRTC</a> te permitirán hacer cosas realmente interesantes con elementos multimedia: crear una interfaz personalizada para los controles de reproducción de audio y vídeo, mostrar pistas de texto con subtítulos junto con el vídeo, capturar vídeo de la cámara web para ser manipulado en un canvas (ver más arriba) o mostrado en el ordenador de otra persona en una videoconferencia, añadir efectos a las pistas de audio (como ganancia, distorsión, retardo, etc).</li>
+ <li><strong>Las APIs de dispositivos</strong> son básicamente APIs para manipular y recuperar información de dispositivos modernos de hardware de forma que sean útiles para aplicaciones web. Ya hemos hablado de la API de geolocalización, que accede a la información de ubicación del dispositivo, de forma que te pueda localizar en un mapa. Otros ejemplos incluyen indicar al usuario de que una actulización útil está disponible en una aplicación web mediante notificaciones de sistema (ver <a href="/en-US/docs/Web/API/Notifications_API">Notifications API</a>) o la vibración de hardware (ver <a href="/en-US/docs/Web/API/Vibration_API">Vibration API</a>).</li>
+ <li>Las <strong>APIS de almacenamiento en el lado del cliente</strong> se están popularizando en los navegadores. La habilidad de almacenar información en el lado del cliente es muy útil para hacer aplicaciones que salven su estado entre carga de páginas, e incluso trabajar cuando el dispositivo está fuera de línea. Hay varias opciones disponibles, por ejemplo el almacenamiento en pares de clave/valor con <a href="/en-US/docs/Web/API/Web_Storage_API" style="font-size: 1rem; letter-spacing: -0.00278rem;">Web Storage API</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, y una forma más compleja de almacenar datos tabulados mediante la </span><a href="/en-US/docs/Web/API/IndexedDB_API" style="font-size: 1rem; letter-spacing: -0.00278rem;">IndexedDB API</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">.</span></li>
+</ul>
+
+<h3 id="APIs_populares_de_terceros">APIs populares de terceros</h3>
+
+<p>Existe una gran variedad de APIs de terceros, algunas de las más populares de las que querrás hacer uso en algún momento son:</p>
+
+<ul>
+ <li>La <a href="https://dev.twitter.com/overview/documentation">API de Twitter</a>, que te permite hacer cosas como mostrar tus ultimos tweets en tu sitio web.</li>
+ <li>La <a href="https://developers.google.com/maps/">API de Google Maps</a> permite hacer todo tipo de cosas con mapas en tus páginas web (incluso hace funcionar Google Maps). Actualmente, existe todo un conjunto de apis que te permiten realizar una gran variedad de tareas, como se puede ver en <a href="https://developers.google.com/maps/documentation/api-picker">Google Maps API Picker</a>.</li>
+ <li>El <a href="https://developers.facebook.com/docs/">conjunto de APIs de Facebook</a> te permite usar partes del ecosistema de facebook para mejorar tu aplicación, por ejemplo aportando la posiblidad de identificación mediante el login de Facebook, aceptar pagos en la aplicación, desplegar campañas de anuncios para un target concreto, etc.</li>
+ <li>La <a href="https://developers.google.com/youtube/">YouTube API</a>, te permite integrar videos de Youtube en tu sitio, buscar en Youtube, construir listas de reproducción y más.</li>
+ <li>La <a href="https://www.twilio.com/">Twilio API</a>, provee de un framework para crear la funcionalidad de llamadas y videollamadas en tus aplicaciones, enviar SMS o MMS y más.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: puedes encontrar información de una gran cantidad de APIs de terceros en el <a href="http://www.programmableweb.com/category/all/apis">Programmable Web API directory</a>.</p>
+</div>
+
+<h2 id="¿Cómo_funcionan_las_APIs">¿Cómo funcionan las APIs?</h2>
+
+<p>Las distintas APIs de JavaScript funcionan de forma ligeramente diferente, pero generalmente tienen características similares y una forma parecida en cómo trabajan.</p>
+
+<h3 id="Están_basadas_en_objetos">Están basadas en objetos</h3>
+
+<p>Las APIs interactúan con tu código usando uno o más <a href="/en-US/docs/Learn/JavaScript/Objects">Objetos JavaScript,</a> que sirven como contenedores para los datos que usa la API (contenidos en las propiedades del objeto), y la funcionalidad que la API provee (contenida en los métodos del objeto).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: si no estás familiarizado en cómo trabajar con objetos, deberías volver atrás y revisar el módulo de <a href="/en-US/docs/Learn/JavaScript/Objects">objetos JavaScript </a>antes de seguir.</p>
+</div>
+
+<p>Volvamos al ejemplo de la API de Geolocalización, que es una API muy simple que consiste en unos pocos objetos sencillos:</p>
+
+<ul>
+ <li>{{domxref("Geolocation")}}, que contiene tres métodos para controlar la recuperación de los datos geográficos.</li>
+ <li>{{domxref("Position")}}, que representa la posición de un dispositivo en un momento dado — esto contiene un objeto {{domxref("Coordinates")}} que contiene la información de la posición actual, además de una marca de tiempo con el momento exacto.</li>
+ <li>{{domxref("Coordinates")}}, que contiene una gran cantidad de datos útiles sobre la posición del dispositivo, incluyendo latitud y longitud, altitud, velocidad, dirección de movimiento y más.</li>
+</ul>
+
+<p>¿Cómo interactúan estos objetos? Si miras a nuestro ejemplo <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/introduction/maps-example.html">maps-example.html</a> (<a href="http://mdn.github.io/learning-area/javascript/apis/introduction/maps-example.html">ver también en vivo</a>), encontrarás el siguiente código:</p>
+
+<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) {
+  var latlng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
+  var myOptions = {
+    zoom: 8,
+    center: latlng,
+    mapTypeId: google.maps.MapTypeId.TERRAIN,
+    disableDefaultUI: true
+  }
+  var map = new google.maps.Map(document.querySelector("#map_canvas"), myOptions);
+});</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: cuando cargues por primera vez el ejemplo de arriba, se te mostrará un mensaje preguntando si deseas compartir tu localización con esta aplicación (ver la sección {{anch("They have additional security mechanisms where appropriate")}} que se encuentra más adelante en este artículo). Deberás estar de acuerdo con esto para poder ver tu localización en el mapa. Si aún así sigues sin ver tu localización, tal vez debas establecer los permisos manualmente; lo puedes hacer de varias formas dependiendo del navegador que estés usando; por ejemplo en Firefox debes ir a  &gt; <em>Tools</em> &gt; <em>Page Info</em> &gt; <em>Permissions</em>, y cambiar la configuración para <em>Share Location</em>; en Chrome ve a <em>Settings</em> &gt; <em>Privacy</em> &gt; <em>Show advanced settings</em> &gt; <em>Content settings</em> y cambia las opciones para <em>Location</em>.</p>
+</div>
+
+<p>Primero queremos usar el método {{domxref("Geolocation.getCurrentPosition()")}} para retornar la posición actuali de nuestro dispositivo. El objeto {{domxref("Geolocation")}} del navegador es accedido llamando a la propiedad {{domxref("Navigator.geolocation")}}, así que comenzaremos haciendo:</p>
+
+<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) { ... });</pre>
+
+<p>Lo que es equivalente a hacer algo como:</p>
+
+<pre class="brush: js">var myGeo = navigator.geolocation;
+myGeo.getCurrentPosition(function(position) { ... });</pre>
+
+<p>Pero podemos usar la sintaxis con punto para concatener nuestros accesos a propiedades/métodos reduciendo el número de líneas que tenemos que escribir.</p>
+
+<p>El método {{domxref("Geolocation.getCurrentPosition()")}} solamente tiene un parámetroobligatorio, que es una función anónima que se ejecutará cuando se recupere correctamente la ubicación del dispositivo. Esta función tiene un parámetro, que contiene un objeto<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> {{domxref("Position")}} con la representación de los datos de la posición actual.</span></p>
+
+<div class="note">
+<p><strong>Nota</strong>: una función que es tomada por otra función como argumento es conocida con el nombre de <a href="/en-US/docs/Glossary/Callback_function">callback function</a>.</p>
+</div>
+
+<p>Este patrón de invocar una función solamente cuando una operación ha sido completada es muy común en las APIs de Javascript — asegurando que una operación ha sido completada antes de intentar usar los datos que retorna en otra operación. Estas operaciones se llaman <strong><a href="/en-US/docs/Glossary/Asynchronous">operaciones asíncronas</a></strong>. Puesto que obtener la posición actual del dispositivo recae en un componente externo (el GPS del dispositivo u otro hardware de geolocalización), no podemos asegurar que se haga a tiempo para usar inmediatamente los datos. Por tanto, algo así no funcionará:</p>
+
+<pre class="brush: js example-bad">var position = navigator.geolocation.getCurrentPosition();
+var myLatitude = position.coords.latitude;</pre>
+
+<p>Si la primera línea no ha retornado todavía su resultado, la segunda línea lanzará un error puesto que los datos de posición no estarán disponibles. Por esa razón, las APIs que tienen operaciones asíncronas se diseñan para usar<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> {{glossary("callback function")}}s, o el sistema más moderno de </span><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" style="font-size: 1rem; letter-spacing: -0.00278rem;">Promises</a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, que se ha introducido en ECMAScript 6 y se está usando mucho en las APIs más nuevas.</span></p>
+
+<p>Vamos a combinar la API de geolocalización con una API de terceros — la API de Google Maps — que se usa para dibujar la localización retornada por <code>getCurrentPosition()</code> en un mapa de Google. Haremos disponible esta API en nuestra página vinculándonos a ella — encontrarás esta línea en el HTML:</p>
+
+<pre class="brush: html">&lt;script type="text/javascript" src="https://maps.google.com/maps/api/js?key=AIzaSyDDuGt0E5IEGkcE6ZfrKfUtE9Ko_de66pA"&gt;&lt;/script&gt;</pre>
+
+<p>Para usar la API, primero creamos una instancia del objeto <code>LatLng</code> usando el constructor <code>google.maps.LatLng()</code>, que toma los valores de nuestra {{domxref("Coordinates.latitude")}} y {{domxref("Coordinates.longitude")}} geolocalizada como parámetros:</p>
+
+<pre class="brush: js">var latlng = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);</pre>
+
+<p>Este objeto quedará establecido como el valor de la propiedad<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">center</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> de un objeto de opciones que hemos llamado </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">myOptions</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">. Entonces crearemos una instancia de objeto para representar nuestro mapa llamando al constructor de </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">google.maps.Map()</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, pasándole sus dos parámetros — una referencia al elemento {{htmlelement("div")}} donde queremos presentar el mapa (con ID </span><code style="font-size: 1rem; letter-spacing: -0.00278rem;">map_canvas</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">), y el objeto de opciones que acabamos de definir.</span></p>
+
+<pre class="brush: js">var myOptions = {
+  zoom: 8,
+  center: latlng,
+  mapTypeId: google.maps.MapTypeId.TERRAIN,
+  disableDefaultUI: true
+}
+
+var map = new google.maps.Map(document.querySelector("#map_canvas"), myOptions);</pre>
+
+<p>Una vez hecho, veremos dibujado nuestro mapa.</p>
+
+<p>Este último bloque de código muestra dos patrones habituales que veremos en muchas APIs. Primero, los objetos de las APIs habitualmente disponen de constructores, que son invocados para crear instancias de esos objetos que que habitualmente usaremos en nuestros programas. Segundo, los objetos de las APIs a menudo ofrecen múltiples opciones que pueden ser adaptadas para obtener exactamente lo que queremos en nuestro programa. Los constructores de las APIs habitualmente aceptan un objeto de opciones como parámetro, que es donde se deben establecer dichas opciones.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: no te preocupes si no entiendes todos los detalles de este ejemplo inmediantamente. Los repasaremos usando APIs de terceros con más detalle en un artículo futuro.</p>
+</div>
+
+<h3 id="Tienen_puntos_de_acceso_reconocibles">Tienen puntos de acceso reconocibles</h3>
+
+<p>Cuando uses una API, debes estar seguro que conoces dónde están los puntos de acceso para ella. En la API de Geolocalización esto es bastante sencillo  — es la propiedad {{domxref("Navigator.geolocation")}}, que retorna el objeto del navegador {{domxref("Geolocation")}} que contiene todos los métodos útiles de geolocalización disponibles en su interior.</p>
+
+<p>La API del Modelo de Objetos del Navegador (DOM) tiene un punto de acceso todavía más simple — sus características las podemos encontrar colgando del objeto {{domxref("Document")}}, o una instancia de un elemento HTML que queremos modificar de alguna forma, por ejemplo:</p>
+
+<pre class="brush: js">var em = document.createElement('em'); // crear un nuevo elemento em
+var para = document.querySelector('p'); // referencia a un elemento p existente
+em.textContent = 'Hello there!'; // dar al em algo de contenido textual
+para.appendChild(em); // ubicar el em dentro del párrafo</pre>
+
+<p>Otras APIs tienen puntos de acceso ligeramente más complejos, que a menudo implican crear un contexto específico para escribir el código de la API. Por ejemplo, el objeto de contexto de la API Canvas se crea obteniendo una referencia al elemento<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> {{htmlelement("canvas")}} en el que quieres dibujar, y a continuación invocando su método {{domxref("HTMLCanvasElement.getContext()")}}:</span></p>
+
+<pre class="brush: js">var canvas = document.querySelector('canvas');
+var ctx = canvas.getContext('2d');</pre>
+
+<p>Cualquier cosa que queramos hacerle al canvas, se conseguirá llamando a las propiedades y métodos del objeto de contexto (que es una instancia de {{domxref("CanvasRenderingContext2D")}}), por ejemplo:</p>
+
+<pre class="brush: js">Ball.prototype.draw = function() {
+  ctx.beginPath();
+  ctx.fillStyle = this.color;
+  ctx.arc(this.x, this.y, this.size, 0, 2 * Math.PI);
+  ctx.fill();
+};</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: puedes ver este código en acción en nuetro <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/introduction/bouncing-balls.html">bouncing balls demo</a> (y también verlo <a href="http://mdn.github.io/learning-area/javascript/apis/introduction/bouncing-balls.html">funcionando</a>).</p>
+</div>
+
+<h3 id="Usan_eventos_para_manejar_cambios_en_su_estado">Usan eventos para manejar cambios en su estado</h3>
+
+<p>Ya hemos discutido anteriormente los eventos en este curso, en nuestro artículo de <a href="/en-US/docs/Learn/JavaScript/Building_blocks/Events">Introducción a los eventos</a> — este artículo detalla qué son los eventos del lado del cliente y cómo se usan en el código. Si no estás familiarizado en cómo se trabaja con la API de eventos del lado del cliente, deberías ir a consultar este artículo antes de continuar.</p>
+
+<p>Algunas APIs web no contienen eventos, pero algunas otras sí contienen un buen número de ellos. Las propiedades para manejarlos, que nos permiten ejecutar funciones cuando los eventos se producen, generalmente se listan en nuestro material de referencia en secciones de "Manejadores de Eventos" separadas. Como ejemplo simple, instancias del objeto <code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> (cada uno representa una petición HTTP al servidor para recuperar un nuevo recurso de algún tipo) tienen un número de eventos disponibles, por ejemplo el evento <code>load</code> que es disparado cuando una respuesta ha sido retornada satisfactoriamente conteniendo el recurso solicitado, y ahora está disponible.</p>
+
+<p>El siguiente código aporta un ejemplo simple de cómo se debe usar esto:</p>
+
+
+
+<pre class="brush: js">var requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';
+var request = new XMLHttpRequest();
+request.open('GET', requestURL);
+request.responseType = 'json';
+request.send();
+
+request.onload = function() {
+  var superHeroes = request.response;
+  populateHeader(superHeroes);
+  showHeroes(superHeroes);
+}</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: puedes ver este código en acción en nuestro ejemplo <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/introduction/ajax.html">ajax.html</a> (<a href="http://mdn.github.io/learning-area/javascript/apis/introduction/ajax.html">verlo en vivo</a>).</p>
+</div>
+
+<p>Las primeras cinco líneas especifican la licalización del recurso que queremos recuperar, se crea una nueva instancia del objeto con la petición usando el constructor <code>XMLHttpRequest()</code>, se abre una petición HTTP <code>GET</code> para recuperar el recurso especificado, se indica que la respuesta debería ser enviada en formato JSON, y finalmente se envía la petición.</p>
+
+<p>El manejador <code>onload</code> especifica entonces qué hacer con la respuesta. Ya sabemos que la respuesta será retornada satisfactoriamente y estará disponible tras producirse el evento load (a menos que haya sucedido un error), así que salvamos la respuesta que contiene el código JSON retornado en la variable <code style="font-size: 1rem; letter-spacing: -0.00278rem;">superHeroes</code><span style="font-size: 1rem; letter-spacing: -0.00278rem;">, luego lo pasamos a dos funciones diferentes para un procesado posterior.</span></p>
+
+<h3 id="Tienen_mecanismos_adicionales_de_seguridad_donde_sea_necesario">Tienen mecanismos adicionales de seguridad donde sea necesario</h3>
+
+<p>Las características de las WebAPI están sujetas a las mismas consideraciones de seguridad que JavaScript y otras tecnologías web (por ejemplo <a href="/en-US/docs/Web/Security/Same-origin_policy">same-origin policy</a>), pero a veces tienen mecanismos adicionales de seguridad. Por ejemplo, algunas de las WebAPIs más modernas solamente funcionan en páginas servidas mediante HTTPS debido a que transmiten información potencialmente sensible (algunos ejemplos son <a href="/en-US/docs/Web/API/Service_Worker_API">Service Workers</a> y <a href="/en-US/docs/Web/API/Push_API">Push</a>).</p>
+
+<p>Además, algunas WebAPIs solicitarán permiso al usuario para ser activadas cuando se produzcan las llamadas desde el código. Como ejemplo, habrás observado un cuadro de diálogo como éste al probar nuestro ejemplo anterior de <a href="/en-US/docs/Web/API/Geolocation">Geolocalización</a>:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14313/location-permission.png" style="border-style: solid; border-width: 1px; display: block; height: 188px; margin: 0px auto; width: 413px;"></p>
+
+<p>La <a href="/en-US/docs/Web/API/Notifications_API">Notifications API</a> solicita los permisos de una forma parecida:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14315/notification-permission.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
+
+<p>Estos diálogos solicitando permiso se muestran al usuario por motivos de seguridad — si no estuvieran, los sitios podrían rastrear la localización sin que el usuario lo supiera o bombardearlo con un montón de notificaciones molestas.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>En este punto, deberías tener ya una buena idea de los que son las APIs, cómo trabajan y qué puedes hacer con ellas en tu código JavaScript. Seguramente estarás con ganas de comenzar a hacer cosas divertidas con algunas APIs específicas, así que ¡vamos allá! A continuación veremos cómo manipular documentos con el Modelo de Objetos del Documento (DOM).</p>
+
+<p>{{NextMenu("Learn/JavaScript/Client-side_web_APIs/Manipulating_documents", "Learn/JavaScript/Client-side_web_APIs")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">Introducción a las APIs web</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">Manipulando documentos</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">Recuperando información del servidor</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Third_party_APIs">APIs de terceros</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">Dibujando gráficos</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs">APIs de vídeo y audio</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage">Almacenamiento en el lado del cliente</a></li>
+</ul>
diff --git a/files/es/learn/javascript/first_steps/generador_de_historias_absurdas/index.html b/files/es/learn/javascript/first_steps/generador_de_historias_absurdas/index.html
deleted file mode 100644
index 58bb8e688a..0000000000
--- a/files/es/learn/javascript/first_steps/generador_de_historias_absurdas/index.html
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: Generador de historias absurdas
-slug: Learn/JavaScript/First_steps/Generador_de_historias_absurdas
-tags:
-  - Arreglos
-  - Cadenas
-  - JavaScript
-  - Numeros
-  - Principiante
-translation_of: Learn/JavaScript/First_steps/Silly_story_generator
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenu("Learn/JavaScript/First_steps/Arrays", "Learn/JavaScript/First_steps")}}</div>
-
-<p class="summary"></p>
-
-<p class="summary">En esta evaluación, deberás tomar parte del conocimiento que has aprendido en los artículos de este módulo y aplicarlo a la creación de una aplicación divertida que genere historias aleatorias. ¡Que te diviertas!</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Antes de intentar esta evaluación, deberías haber revisado todos los artículos de este módulo.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Probar la comprensión de los fundamentos de JavaScript, como variables, números, operadores, cadenas y matrices</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Punto_de_partida">Punto de partida</h2>
-
-<p>Para iniciar esta evaluación, debe:</p>
-
-<ul>
- <li>Vaya y <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/assessment-start/index.html">tome el archivo HTML</a> para el ejemplo y guarde una copia local de este como <code>index.html</code> en un directorio nuevo en algún lugar de su computadora. Esto también tiene el CSS para estilizar el ejemplo que contiene.</li>
- <li>Vaya a la <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/assessment-start/raw-text.txt">página que contiene el texto sin procesar</a> y manténgalo abierto en una pestaña separada del navegador en algún lugar. Lo necesitarás más tarde.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Alternativamente, puede usar un sitio como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer su evaluación. Puede pegar el HTML, CSS y JavaScript en uno de estos editores en línea. Si el editor en línea que está utilizando no tiene un panel de JavaScript separado, no dude en colocarlo en línea en un elemento <code>&lt;script&gt;</code> dentro de la página HTML.</p>
-</div>
-
-<h2 id="Resumen_del_proyecto">Resumen del proyecto</h2>
-
-<p>Se le han proporcionado algunos HTML / CSS en bruto y algunas cadenas de texto y funciones de JavaScript; necesita escribir el JavaScript necesario para convertir esto en un programa de trabajo, que hace lo siguiente:</p>
-
-<ul>
- <li>Genera una historia tonta cuando se presiona el botón "Generar historia aleatoria".</li>
- <li>Reemplaza el nombre predeterminado "Bob" en la historia con un nombre personalizado, solo si se ingresa un nombre personalizado en el campo de texto "Ingresar nombre personalizado" antes de presionar el botón Generar.</li>
- <li>Convierte las cantidades y unidades de peso y temperatura predeterminadas de los EE. UU. En la historia en equivalentes del Reino Unido del botón de opción del Reino Unido, antes de presionar el botón de generar.</li>
- <li>Generará otra historia tonta al azar si presionas el botón otra vez (y otra vez ...)</li>
-</ul>
-
-<p>La siguiente captura de pantalla muestra un ejemplo de lo que debería producir el programa terminado:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/16178/Screen_Shot_2018-09-19_at_10.01.38_AM.png" style="border-style: solid; border-width: 1px; display: block; height: 404px; margin: 0px auto; width: 500px;"></p>
-
-<p>Para darle más idea, eche un vistazo al ejemplo final (¡no mire el código fuente!)</p>
-
-<h2 id="Etapas_para_completar">Etapas para completar</h2>
-
-<p>En las siguientes secciones se describe lo que hay que hacer.</p>
-
-<p>Configuración básica:</p>
-
-<ol>
- <li>Crear un nuevo archivo llamado <code>main.js</code>, en el mismo directorio que tu archivo <code>index.html</code>.</li>
- <li>Aplicar el archivo JavaScript externo a tu HTML insertando un elemento {{htmlelement("script")}} en tu HTML haciendo referencia a <code>main.js</code>. Póngalo justo antes de la etiquette de cierra <code>&lt;/body&gt;</code>.</li>
-</ol>
-
-<p>Variables y funciones iniciales:</p>
-
-<ol>
- <li>en el archivo de texto sin procesar, copia todo el código bajo el encabezado "1. COMPLETE VARIABLE AND FUNCTION DEFINITIONS" y pégalo en la parte superior del archivo main.js. Esto te dará tres variables que almacenan las referencias al campo de texto "Enter custom name" (<code>customName</code>), el botón "Generate random story" (<code>randomize</code>), y el elemento {{htmlelement("p")}} al fondo del cuerpo HTML en el que la historia será copiada en (<code>story</code>), respectivamente. Además, obtendrás una funcion llamada <code>randomValueFromArray()</code> que toma un array, y devuelve uno de los items guardados dentro del array al azar.</li>
- <li>Ahora observa la segunda sección del archivo de texto sin procesar — "2. RAW TEXT STRINGS". Esta contiene cadenas de texto que actuarán como entrada en nuestro programa. Nos gustaría que mantengas estas variables internas dentro del archivo <code>main.js</code>:
-  <ol>
-   <li>Almacena la primera, la más larga, cadena de texto dentro de una variable llamada <code>storyText</code>.</li>
-   <li>Almacena el primer conjunto de tres cadenas dentro de un array llamado <code>insertX</code>.</li>
-   <li>Almacena el segundo conjunto de tres cadenas dentro de un array llamado <code>insertY</code>.</li>
-   <li>Almacena el tercer conjunto de tres cadenas dentro de un array llamado <code>insertZ</code>.</li>
-  </ol>
- </li>
-</ol>
-
-<p>Colocar el controlador de evento y la función incompleta:</p>
-
-<ol>
- <li>Ahora regresa al archivo de texto sin procesar.</li>
- <li>Copia el código encontrado bajo el encabezado "3. EVENT LISTENER AND PARTIAL FUNCTION DEFINITION" y pégalo al fondo de tu archivo <code>main.js</code> . Esto:
-  <ul>
-   <li>Añade un detector de eventos a la variable <code>randomize</code>, de manera que cuando al botón que esta representa se le haya dado un click, la función <code>result()</code> funcione.</li>
-   <li>Añade una definición de la función parcialmente completada <code>result()</code> a tu código. Por el resto de la evaluación, deberás llenar en líneas dentro de esta función para completarla y hacer que trabaje adecuadamente.</li>
-  </ul>
- </li>
-</ol>
-
-<p>Completando la función <code>result()</code>:</p>
-
-<ol>
- <li>Crear una nueva variable llamada <code>newStory</code>, y establezca su valor igual a <code>storyText</code>. Esto es necesario para que podamos crear una nueva historia aleatoria cada vez que se presiona el botón y se ejecuta la función. Si hiciéramos cambios directamente en <code>storyText</code>, solo podríamos generar una nueva historia una vez.</li>
- <li>Crear tres nuevas variables llamadas <code>xItem</code>, <code>yItem</code>, y <code>zItem</code>, y tienes que igualar cada variable llamando a <code>randomValueFromArray()</code> en sus tres matrices (el resultado en cada caso será un elemento aleatorio de cada matriz en la que se llama). Por ejemplo, puede llamar a la función y hacer que devuelva una cadena aleatoria de  <code>insertX</code> escribiendo <code>randomValueFromArray(insertX)</code>.</li>
- <li>A continuación, queremos reemplazar los tres marcadores de posición en la cadena <code>newStory</code> — <code>:insertx:</code>, <code>:inserty:</code>, y <code>:insertz:</code> — con las cadenas almacenadas en <code>xItem</code>, <code>yItem</code>, y <code>zItem</code>. Hay un método de string en particular que lo ayudará aquí: en cada caso, haga que la llamada al método sea igual a <code>newStory</code> de modo que cada vez que se llame, <code>newStory</code> se iguale a sí mismo, pero con sustituciones. Entonces, cada vez que se presiona el botón, estos marcadores de posición se reemplazan con una cadena absurda aleatoria. Como sugerencia adicional, el método en cuestión solo reemplaza la primera instancia de la subcadena que encuentra, por lo que es posible que deba realizar una de las llamadas dos veces.</li>
- <li>Dentro del primer bloque <code>if</code>, agregue otra llamada al método de reemplazo de cadena para reemplazar el nombre 'Bob' que se encuentra en la cadena <code>newStory</code> con la variable de <code>name</code>. En este bloque estamos diciendo "Si se ingresó un valor en la entrada de texto <code>customName</code>  reemplace a Bob en la historia con ese nombre personalizado."</li>
- <li>Dentro del segundo bloque <code>if</code>, se esta verificando si se ha seleccionado el botón de opción <code>uk</code>  Si es así, queremos convertir los valores de peso y temperatura en la historia de libras and Fahrenheit a stones and grados centígrados. Lo que debe hacer es lo siguiente:
-  <ol>
-   <li>Busque las fórmulas para convertir libras a stone, and Fahrenheit en grados centígrados.</li>
-   <li>Dentro de la línea que define la variable de <code>weight</code>, reemplace 300 con un cálculo que convierta 300 libras en stones. Concatenar <code>'stone'</code> al final del resultado de la llamada <code>Math.round()</code>.</li>
-   <li>Al lado de la línea que define la variable de <code>temperature</code>, reemplace 94 con un cálculo que convierta 94 Fahrenheit en centígrados. Concatenar <code>'centigrade'</code> al final del resultado de la llamada <code>Math.round()</code>.</li>
-   <li>Justo debajo de las dos definiciones de variables, agregue dos líneas de reemplazo de cadena más que reemplacen '94 fahrenheit 'con el contenido de la variable de <code>temperature</code>, y  '300 libras' con el contenido de la variable de <code>weight</code>.</li>
-  </ol>
- </li>
- <li>Finalmente, en la penúltima línea de la función, haga que la propiedad <code>textContent</code> de la variable de la <code>story</code> (que hace referencia al párrafo) sea igual a <code>newStory</code>.</li>
-</ol>
-
-<h2 id="Claves_y_pistas">Claves y pistas</h2>
-
-<ul>
- <li>No necesitas modificar el HTML, salvo para incrustar el JavaScript a tu HTML.</li>
- <li>Si no estás seguro si el JavaScript está siendo aplicado adecuadamente a tu HTML, intenta remover temporalmente todo el codigo del archivo JavaScript, agregar una instruccion simple que sabes que tendrá un efecto obvio, luego guarda y actualiza. El siguiente ejemplo cambia el fondo de {{htmlelement("html")}} - así la ventana se verá completamente roja si el JavaScript está siendo aplicado adecuadamente.:
-  <pre class="brush: js notranslate">document.querySelector('html').style.backgroundColor = 'red';</pre>
- </li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/round">Math.round()</a> es un método JavaScript integrado que simplemente redondea el resultado de un cálculo al número entero más cercano.</li>
- <li>Hay tres casos de cadenas que deben reemplazarse. Puede repetir el método <code>replace()</code> varias veces o puede utilizar expresiones regulares. Por ejemplo, <code>let text = 'I am the biggest lover, I love my love'; text.replace(/love/g,'like');</code> Reemplazará todas las instancias de 'love' a 'like'. Recuerde, las cuerdas son inmutables.</li>
-</ul>
-
-<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
-
-<p>Si está siguiendo esta evaluación como parte de un curso organizado, debería poder entregar su trabajo a su profesor/mentor para que lo califique. Si está aprendiendo por ti mismo, puede obtener la guía de calificación con bastante facilidad preguntando en el hilo de <a href="https://discourse.mozilla.org/t/silly-story-generator-assessment/24686">discussion thread for this exercise</a>, o en el canal de IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Pruebe el ejercicio primero: ¡no se gana nada haciendo trampa!</p>
-
-<p>{{PreviousMenu("Learn/JavaScript/First_steps/Arrays", "Learn/JavaScript/First_steps")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Qu%C3%A9_es_JavaScript">¿Qué es JavaScript?</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Un primer acercamiento a JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/What_went_wrong">What went wrong? Corrigiendo JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Variables">Almacenando la información que necesitas - Variables</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Matem%C3%A1ticas">Matemáticas básicas en JavaScript — números y operadores</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejando el texto - cadenas en JavaScript</a></li>
- <li><a href="/es/docs/Glossary/Arreglos">Métodos útiles con cadenas</a></li>
- <li><a href="/es/docs/Glossary/Arreglos">Arreglos (matrices)</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/First_steps/Silly_story_generator">Evaluación: Generador de hisorias alocadas</a></li>
-</ul>
diff --git a/files/es/learn/javascript/first_steps/matemáticas/index.html b/files/es/learn/javascript/first_steps/matemáticas/index.html
deleted file mode 100644
index d9117ed211..0000000000
--- a/files/es/learn/javascript/first_steps/matemáticas/index.html
+++ /dev/null
@@ -1,443 +0,0 @@
----
-title: Matemáticas básicas en JavaScript — números y operadores
-slug: Learn/JavaScript/First_steps/Matemáticas
-tags:
-  - Aprender
-  - Artículo
-  - Guía
-  - JavaScript
-  - Matemáticas
-  - Math
-  - Novato
-  - Operadores
-  - Principiante
-  - incremento
-  - 'l10n:priority'
-  - modulo
-translation_of: Learn/JavaScript/First_steps/Math
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/JavaScript/First_steps/Variables", "Learn/JavaScript/First_steps/Strings", "Learn/JavaScript/First_steps")}}</div>
-
-<p class="summary">En este punto del curso, hablaremos de matemáticas en JavaScript — cómo  podemos usar {{Glossary("Operator","operadores")}} y otras características para manipular con éxito números y conseguir lo que nos hayamos propuesto.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>Conocimientos básicos de ordenadores, comprensión básica de  HTML y CSS, comprensión básica de lo que es JavaScript.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Familiarizarse con las matemáticas básicas de JavaScript.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Todos_aman_las_matemáticas">Todos aman las matemáticas</h2>
-
-<p>Vale, tal vez no. A algunos nos gustan, otros las odiamos desde que aprendimos en la escuela las tablas de multipicar y las divisiones complicadas, y algunos estamos a mitad entre ambas posturas. Pero ninguno podemos negar que las matemáticas son una parte fundamental de la vida que nos afecta. Y esto es especialmente cierto cuando aprendemos JavaScript (o cualquier otro lenguaje similar) — en la medida en que ello pasa por procesar números, calcular nuevos valores, etc., no te puede sorprender comprobar que JavaScript dispone de un completo conjunto de funciones matemáticas.</p>
-
-<p>En este artículo se trata solo aquella parte básica que necesitas conocer por ahora.</p>
-
-<h3 id="Tipos_de_números">Tipos de números</h3>
-
-<p>En programación, incluso el simple sistema numérico decimal que todos conocemos tan bien, es más complicado de lo que podrías pensar. Usamos diferentes términos para describir diferentes tipos de números decimales, por ejemplo:</p>
-
-<ul>
- <li><strong>Enteros son números sin parte decimal</strong>, e.g. 10, 400 o -5.</li>
- <li><strong>Números con coma flotante </strong>(floats): tienen punto decimal y parte decimal, por ejemplo,12.5 y 56.7786543.</li>
- <li><strong>Doubles</strong>: son un tipo específico de números de coma flotante que tienen una mayor precisión que los numeros de coma flotante comunes (lo que significa que son más precisos en cuanto a la cantidad de decimales que poseen).</li>
-</ul>
-
-<p>¡Incluso tenemos distintos tipos de sistemas numéricos! El decimal es base 10 (quiere decir que utiliza 0-9 en cada columna), pero también tenemos cosas como:</p>
-
-<ul>
- <li><strong>Binario</strong> — El lenguaje de computadora de nivel más bajo; 0s y 1s.</li>
- <li><strong>Octal</strong> — De base 8, utiliza de 0–7 en cada columna.</li>
- <li><strong>Hexadecimal</strong> — De base 16, utiliza de 0–9 y luego de a–f en cada columna. Puedes haber encontrado estos números antes, cuando colocabas <a href="/es/Learn/CSS/Introduction_to_CSS/Values_and_units#Hexadecimal_values">colores en CSS</a>.</li>
-</ul>
-
-<p><strong>Antes de que comiences a preouparte de que tu cerebro se derrita, ¡detente un momento!</strong> Para empezar, sólo vamos a apegarnos a los números decimales durante todo este curso; pocas veces te verás en la necesidad de comenzar a pensar sobre los otros tipos, si es que lo haces.</p>
-
-<p>La segunda parte de las buenas noticias es que, a diferencia de otros lenguajes de programación, JavaScript sólo tiene un tipo de dato para los números, adivinaste, {{jsxref("Number")}}. Esto significa que, sin importar el tipo de número con el que estés lidiando en Javascript, los manejas siempre de la misma manera.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: En realidad, JavaScript tiene un segundo tipo de número, {{Glossary("BigInt")}}, que se utiliza para números enteros muy, muy grandes. Pero para los propósitos de este curso, solo nos preocuparemos por los valores numéricos.</p>
-</div>
-
-<h3 id="Para_mí_todo_son_números.">Para mí, todo son números.</h3>
-
-<p>Juguemos un poco con algunos números para ponernos al día con la sintaxis básica que necesitamos. Coloca los comandos listados abajo en la <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">consola JavaScript de tus herramientas para desarrolladores</a>, o utiliza la sencilla consola integrada que verás abajo si lo prefieres.</p>
-
-<p><strong><a href="https://mdn.github.io/learning-area/javascript/introduction-to-js-1/variables/">Abrir en una ventana nueva</a></strong></p>
-
-<ol>
- <li>Primero que todo, declara un par de variables e inicializalas con un entero y un flotante, respectivamente, luego escribe los nombres de esas variables para chequear que todo esté en orden:
-  <pre class="brush: js notranslate">var myInt = 5;
-var myFloat = 6.667;
-myInt;
-myFloat;</pre>
- </li>
- <li>Los valores numéricos están escritos sin comillas - Trata de declarar e inicializar un par de variables más que contengan números antes de continuar.</li>
- <li>Ahora chequea que nuestras variables originales sean del mismo tipo. Hay un operador llamado {{jsxref("Operators/typeof", "typeof")}} en JavaScript hace esto. Digita las dos lineas siguientes:
-  <pre class="brush: js notranslate">typeof myInt;
-typeof myFloat;</pre>
-  Obtendrás <code>"number"</code> en ambos casos — esto hace las cosas mucho más fáciles que si diferentes números tuvieran difetentes tipos, y tuvimos que lidiar con ellos de diferentes maneras. Uf !</li>
-</ol>
-
-<h2 id="Operadores_Aritméticos">Operadores Aritméticos</h2>
-
-<p>Los operadores aritméticos son operadores básicos que usamos para hacer sumas:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Operador</th>
-   <th scope="col">Nombre</th>
-   <th scope="col">Propósito</th>
-   <th scope="col">Ejemplo</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>+</code></td>
-   <td>Adición</td>
-   <td>Suma dos números juntos.</td>
-   <td><code>6 + 9</code></td>
-  </tr>
-  <tr>
-   <td><code>-</code></td>
-   <td>Resta</td>
-   <td>Resta el numero de la derecha del de la izquierda.</td>
-   <td><code>20 - 15</code></td>
-  </tr>
-  <tr>
-   <td><code>*</code></td>
-   <td>Multiplicación</td>
-   <td>Multiplica dos números juntos.</td>
-   <td><code>3 * 7</code></td>
-  </tr>
-  <tr>
-   <td><code>/</code></td>
-   <td>División</td>
-   <td>Divide el número de la izquierda por el de la derecha.</td>
-   <td><code>10 / 5</code></td>
-  </tr>
-  <tr>
-   <td><code>%</code></td>
-   <td>Sobrante (también llamado módulo)</td>
-   <td>
-    <p>Retorna el restante después de dividir el número de la izquierda en porciones enteras del de la derecha.</p>
-   </td>
-   <td><code>8 % 3</code> (retorna 2, como tres está dos veces en 8, quedando 2 restantes.)</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: A veces verás números involucrados en sumas referidas como {{Glossary("Operand", "operands")}}.</p>
-</div>
-
-<p>Probablemente no necesitemos enseñarte matemáticas básicas, pero nos gustaría probar tu entendimiento de la sintaxis involucrada. Intenta entrar los ejemplos de abajo en tu <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">consola JavaScript de tus herramientas para desarrolladores</a>, o usa la sencilla consola incorporada que se vio anteriormente, si lo prefieres, para familiarizarte con la sintaxis.</p>
-
-<ol>
- <li>Primero, trata entrando un ejemplo simple por tu cuenta, como
-  <pre class="brush: js notranslate">10 + 7
-9 * 8
-60 % 3</pre>
- </li>
- <li>Puedes tratar declarando e inicializando algunos números en variables, y probar usándolos en la suma - Las variables se comportarán exactamente como los valores que tienen para los fines de la suma. Por ejemplo:
-  <pre class="brush: js notranslate">var num1 = 10;
-var num2 = 50;
-9 * num1;
-num2 / num1;</pre>
- </li>
- <li>Por último, trate entrando algunas expresiones complejas, como:
-  <pre class="brush: js notranslate">5 + 10 * 3;
-num2 % 9 * num1;
-num2 + num1 / 8 + 2;</pre>
- </li>
-</ol>
-
-<p>Es posible que parte de este último conjunto de sumas no te dé el resultado que esperabas; La siguiente sección bien podría dar la respuesta del por qué.</p>
-
-<h3 id="Precedencia_de_Operadores">Precedencia de Operadores</h3>
-
-<p>Veamos el último ejemplo de arriba, asumiendo que num2 tiene el valor 50 y num1 tiene el valor 10 (como se indicó anteriormente):</p>
-
-<pre class="brush: js notranslate">num2 + num1 / 8 + 2;</pre>
-
-<p>Como un ser humano, puedes leer esto como "50 más 10 es igual a 60", luego "8 más 2 es igual a 10", y finalmente "60 dividido por 10 es igual a 6".</p>
-
-<p>Pero el navegador hace "10 dividido por 8 es igual a 1.25", luego "50 más 1.25 más 2 es igual a 53.25".</p>
-
-<p>Esto es debido a la <strong>precedencia de operadores</strong> — algunos operadores son aplicados antes de otros cuando se calcula el resultado de una suma (referida como una expresión, en programación).  La precedencia de operadores en JavaScript es la misma que en las matemáticas de la escuela  — La multiplicación y la división se resuelven siempre primero, luego la suma y resta (la suma siempre se evalua de izquierda a derecha).</p>
-
-<p>Si quieres alterar la precedencia de operación, puedes colocar paréntesis alrededor de las partes que quieras explícitamente evaluar primero. Para obtener un resultado de 6, podríamos hacer esto:</p>
-
-<pre class="brush: js notranslate">(num2 + num1) / (8 + 2);</pre>
-
-<p>Pruébalo y verás.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Una completa lista de todos los operadores de JavaScript y sus precedencias pueden encontrarse en <a href="/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operator_precedence">Expresiones y operadores</a>.</p>
-</div>
-
-<h2 id="Operadores_de_incremento_y_decremento">Operadores de incremento y decremento</h2>
-
-<p>Algunas veces necesitarás repetidamente sumar o restar uno de/a una variable numérica. Esto puede hacerse convenientemente usando los operadores de incremento (<code>++</code>) y decremento (<code>--</code>). Usamos <code>++</code> en nuestro juego "Adivina el número" en nuestro artículo <a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Un primer acercamiento a JavaScrip</a><a href="/es/docs/Learn/JavaScript/Introduction_to_JavaScript_1/A_first_splash">t</a>, cuando agregamos 1 a nuestra variable <code>guessCount</code> para mantener una pista de cuantas respuestas le quedan al usuario por turno.</p>
-
-<pre class="brush: js notranslate">guessCount++;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Son muy comunmente usadas en <a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration">ciclos</a>, que aprenderás más adelante en el curso. Por ejemplo, Digamos que quieras recorrer una lista de precios, y agregar impuestos a cada uno. Usaría un ciclo para recorrer cada valor y realizar el cálculo necesario para agregar el impuesto a las ventas en cada caso. El incrementador es usado para mover al próximo valor cuando es necesario. Damos un simple ejemplo En realidad, proporcionamos un ejemplo simple que muestra cómo se hace esto: ¡pruébalo en vivo y mira el código fuente para ver si puedes detectar los incrementadores! Veremos los ciclos en detalle más adelante en el curso..</p>
-</div>
-
-<p>Trata jugando con eso en tu consola. Para empezar, nota que no puedes aplicar esto directamente a un número, sin operar en él mismo. Lo siguiente retorna un error:</p>
-
-<pre class="brush: js notranslate">3++;</pre>
-
-<p>Asì, puedes solo incrementar una variable existente. Prueba esto:</p>
-
-<pre class="brush: js notranslate">var num1 = 4;
-num1++;</pre>
-
-<p>Ok, la extrañeza número 2! Cuando hagas esto, verás que se devuelve un valor de 4; esto se debe a que el navegador devuelve el valor actual y luego incrementa la variable. Puedes ver que se ha incrementado si devuelves el valor variable nuevamente:</p>
-
-<pre class="brush: js notranslate">num1;</pre>
-
-<p>Lo mismo funciona con <code>--</code> : intenta lo siguiente:</p>
-
-<pre class="brush: js notranslate">var num2 = 6;
-num2--;
-num2;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes hacer que el navegador lo haga al revés: aumentar / disminuir la variable y luego devolver el valor, colocando el operador al comienzo de la variable en lugar del final. Prueba los ejemplos anteriores otra vez, pero esta vez usa <code>++num1</code> y<code>--num2</code>.</p>
-</div>
-
-<h2 id="Operadores_de_asignación">Operadores de asignación</h2>
-
-<p>Los operadores de asignación son operadores que asignan un valor a una variable. Ya usamos el más básico, <code>=</code>, muchas veces — simplemente asigna a la variable de la izquierda, el valor de la derecha:</p>
-
-<pre class="brush: js notranslate">var x = 3; // x contiene el valor 3
-var y = 4; // y contiene el valor 4
-x = y; // x ahora contiene el mismo valor de y... 4</pre>
-
-<p>Pero hay algunos tipos más complejos, que proporcionan atajos útiles para mantener tu código más ordenado y más eficiente. Los más comunes se enumeran a continuación.:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Operador</th>
-   <th scope="col">Nombre</th>
-   <th scope="col">Propósito</th>
-   <th scope="col">_Ejemplo</th>
-   <th scope="col">__Atajo_de__</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>+=</code></td>
-   <td>Adición asignación</td>
-   <td>Suma el valor de la derecha al valor de la variable de la  izquierda y returna el nuevo valor</td>
-   <td><code>x = 3;<br>
-    x += 4;</code></td>
-   <td><code>x = 3;<br>
-    x = x + 4;</code></td>
-  </tr>
-  <tr>
-   <td><code>-=</code></td>
-   <td>Resta asignación</td>
-   <td>
-    <p>Resta el valor de la derecha, del valor de la variable de la izquierda y retorna el nuevo valor.</p>
-   </td>
-   <td><code>x = 6;<br>
-    x -= 3;</code></td>
-   <td><code>x = 6;<br>
-    x = x - 3;</code></td>
-  </tr>
-  <tr>
-   <td><code>*=</code></td>
-   <td>Multiplicación asignación</td>
-   <td>
-    <p>Multiplica el valor de la variable en la izquierda por el valor en la derecha y retorna el nuevo valor.</p>
-   </td>
-   <td><code>x = 2;<br>
-    x *= 3;</code></td>
-   <td><code>x = 2;<br>
-    x = x * 3;</code></td>
-  </tr>
-  <tr>
-   <td><code>/=</code></td>
-   <td>División asignación</td>
-   <td>
-    <p>Divide el valor de la variable en la izquierda por el valor de la derecha y retorna el nuevo valor.</p>
-   </td>
-   <td><code>x = 10;<br>
-    x /= 5;</code></td>
-   <td><code>x = 10;<br>
-    x = x / 5;</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Intenta digitar algunos de estos ejemplos en tu consola, para darte una idea de cómo funcionan. Mira si puedes preguntar los valores que tenían antes de ingresarlos en la segunda línea, en cada caso.</p>
-
-<p>Ten en cuenta que puedes usar otras variables en el lado derecho de cada expresión, por ejemplo:</p>
-
-<pre class="brush: js notranslate">var x = 3; // x contiene el valor 3
-var y = 4; // y contiene el valor 4
-x *= y; // x ahora contiene el valor 12</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Hay una cantidad de <a href="/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Assignment_operators">otros operadores de asignación disponibles</a>, pero estos son los básicos que debes aprender por ahora.</p>
-</div>
-
-<h2 id="Aprendizaje_activo_dimensionando_una_caja_canvas">Aprendizaje activo: dimensionando una caja canvas</h2>
-
-<p>En este ejercicio vamos a hacer que completes algunos números y operadores para manipular el tamaño de una caja. El cuadro se dibuja utilizando una API de navegador llamada {{domxref("Canvas API", "", "", "true")}}. No hay necesidad de preocuparse por cómo funciona esto, solo concentrarse en las matemáticas por ahora. El ancho y el alto del cuadro (en píxeles) están definidos por las variables x e y, a las que inicialmente se les asigna un valor de 50.</p>
-
-<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/maths/editable_canvas.html", '100%', 520)}}</p>
-
-<p><strong><a href="https://mdn.github.io/learning-area/javascript/introduction-to-js-1/maths/editable_canvas.html">Abrir en una nueva ventana</a></strong></p>
-
-<p>En el cuadro de código editable anterior, hay dos líneas marcadas claramente con un comentario que nos gustaría que actualices para hacer que el cuadro crezca/se reduzca a ciertos tamaños, utilizando ciertos operadores y/o valores en cada caso. Intenta lo siguiente:</p>
-
-<ul>
- <li>Cambia la línea que calcula x, para que el recuadro tenga un ancho de 50px, y que el 50 se calcule utilizando los números 43 y 7, y un operador aritmético.</li>
- <li>Cambia la línea que calcula y, para que la casilla tenga 75px de altura y que el 75 se calcule utilizando los números 25 y 3, y un operador aritmético.</li>
- <li>Cambia la línea que calcula x, para que el recuadro tenga un ancho de 250px, y que el 250 se calcule utilizando dos números y el operador del resto (módulo).</li>
- <li>Cambia la línea que calcula y, para que el cuadro tenga 150px de altura, y que el 150 se calcule utilizando tres números, y los operadores de resta y división.</li>
- <li>Cambia la línea que calcula x, para que el cuadro tenga 200px de ancho y que el 200 se calcule utilizando el número 4 y un operador de asignación.</li>
- <li>Cambia la línea que calcula y, para que el cuadro tenga 200px de altura y que el 200 se calcule utilizando los números 50 y 3, el operador de multiplicación y el operador de asignación de suma.</li>
-</ul>
-
-<p>No te preocupes si arruinas totalmente el código. Siempre puedes presionar el botón Restablecer para que las cosas vuelvan a funcionar. Después de haber respondido correctamente a todas las preguntas anteriores, siéntete libre de jugar con el código un poco más, o establece desafíos para tus amigos/compañeros de clase..</p>
-
-<h2 id="Operadores_de_comparación">Operadores de comparación</h2>
-
-<p>A veces querremos ejecutar pruebas de verdadero/falso, y luego actuaremos de acuerdo con el resultado de esa prueba. Para ello, utilizamos <strong>operadores de comparación</strong>.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Operador</th>
-   <th scope="col">Nombre</th>
-   <th scope="col">Propósito</th>
-   <th scope="col">Ejemplo</th>
-  </tr>
-  <tr>
-   <td><code>===</code></td>
-   <td>Igual estricto</td>
-   <td>Comprueba si los valores izquierdo y derecho son idénticos entre sí</td>
-   <td><code>5 === 2 + 4</code></td>
-  </tr>
-  <tr>
-   <td><code>!==</code></td>
-   <td>Igual no-estricto</td>
-   <td>Comprueba si los valores izquierdo y derecho <strong>no</strong> son idénticos entre sí</td>
-   <td><code>5 !== 2 + 3</code></td>
-  </tr>
-  <tr>
-   <td><code>&lt;</code></td>
-   <td>Menor que</td>
-   <td>Comprueba si el valor izquierdo es menor que el derecho.</td>
-   <td><code>10 &lt; 6</code></td>
-  </tr>
-  <tr>
-   <td><code>&gt;</code></td>
-   <td>Mayor que</td>
-   <td>Comprueba si el valor izquierdo es mayor que el derecho.</td>
-   <td><code>10 &gt; 20</code></td>
-  </tr>
-  <tr>
-   <td>&lt;=</td>
-   <td>Menor o igual a</td>
-   <td>Comprueba si el valor izquierdo es menor o igual que el derecho.</td>
-   <td><code>3 &lt;= 2</code></td>
-  </tr>
-  <tr>
-   <td>&gt;=</td>
-   <td>Mayor o igual a</td>
-   <td>Comprueba si el valor izquierdo es mayor o igual que el derecho..</td>
-   <td><code>5 &gt;= 4</code></td>
-  </tr>
- </thead>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: Es posible que algunas personas utilicen == y != en sus pruebas de igualdad y no igualdad. Estos son operadores válidos en JavaScript, pero difieren de === /! ==: la prueba anterior indica si los valores son iguales. pero el tipo de datos puede ser diferente, mientras que las últimas versiones estrictas prueban si el valor y el tipo de datos son los mismos. Las versiones estrictas tienden a reducir el número de errores que no se detectan, por lo que te recomendamos que los utilices.</p>
-</div>
-
-<p>Si intentas ingresar algunos de estos valores en una consola, verás que todos devuelven valores verdaderos/falsos, esos booleanos que mencionamos en el artículo anterior. Son muy útiles ya que nos permiten tomar decisiones en nuestro código; se usan cada vez que queremos hacer una elección de algún tipo, por ejemplo.:</p>
-
-<ul>
- <li>Mostrar la etiqueta de texto correcta en un botón dependiendo de si una función está activada o desactivada.</li>
- <li>Mostrar un mensaje sobre un juego si ha terminado, o un mensaje de victoria si el juego ha sido ganado.</li>
- <li>Mostrando el saludo estacional correcto dependiendo de la temporada de vacaciones.</li>
- <li>Acercar o alejar un mapa según el nivel de zoom seleccionado.</li>
-</ul>
-
-<p>Veremos cómo codificar dicha lógica cuando veamos declaraciones condicionales en un artículo futuro. Por ahora, veamos un ejemplo rápido:</p>
-
-<pre class="brush: html notranslate">&lt;button&gt;Iniciar máquina&lt;/button&gt;
-&lt;p&gt;La máquina se detuvo.&lt;/p&gt;
-</pre>
-
-<pre class="brush: js notranslate">var btn = document.querySelector('button');
-var txt = document.querySelector('p');
-
-btn.addEventListener('click', updateBtn);
-
-function updateBtn() {
-  if (btn.textContent === 'Iniciar máquina') {
-    btn.textContent = 'Detener máquina';
-    txt.textContent = 'La máquina se inició!';
-  } else {
-    btn.textContent = 'Iniciar máquina';
-    txt.textContent = 'La máquina se detuvo.';
-  }
-}</pre>
-
-<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/maths/conditional.html", '100%', 100)}}</p>
-
-<p><strong><a href="https://mdn.github.io/learning-area/javascript/introduction-to-js-1/maths/conditional.html">Abrir en una nueva ventana</a></strong></p>
-
-<p>Puede ver el operador de igualdad utilizado justo dentro de la función <code>updateBtn().</code> En este caso, no estamos probando si dos expresiones matemáticas tienen el mismo valor (estamos comprobando si el contenido de texto de un botón contiene una cadena determinada), pero sigue siendo el mismo principio. Si el botón está actualmente diciendo "Iniciar máquina" cuando se presiona, cambiamos su etiqueta a "Detener máquina" y actualizamos la etiqueta según corresponda. Si el botón está actualmente diciendo "Detener máquina" cuando se presiona, volvemos a cambiar la pantalla.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Un control de este tipo que intercambia entre dos estados generalmente se conoce como <strong>conmutador</strong>. Conmuta entre un estado y otro — Luces on, luces off, etc.</p>
-</div>
-
-<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
-
-<p>Llegaste al final de este artículo, pero ¿puédes recordar la información más importante? Puedes encontrar algunas pruebas para verificar que has comprendido esta información antes de seguir avanzando — Ve <a href="/es/docs/Learn/JavaScript/First_steps/Test_your_skills:_Math">¡Pon a prueba tus habilidades!: Matemáticas</a>.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>En este artículo hemos cubierto la información fundamental que necesitas saber sobre los números en JavaScript, por ahora. Verás los números usados una y otra vez, a lo largo de tu aprendizaje de JavaScript, por lo que es una buena idea hacer esto ahora. Si eres una de esas personas que no disfruta de las matemáticas, puedes sentirte cómodo por el hecho de que este capítulo fue bastante breve.</p>
-
-<p>En el siguiente artículo, exploraremos el texto y cómo JavaScript nos permite manipularlo.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si disfrutas de las matemáticas y quieres leer más sobre cómo se implementa en JavaScript, puedes encontrar muchos más detalles en la sección principal de JavaScript de MDN. Los mejores lugares para iniciar con artículos sobre <a href="/es/docs/Web/JavaScript/Guide/Numbers_and_dates">Numero y fechas</a> y <a href="/es/docs/Web/JavaScript/Guide/Expressions_and_Operators">Expresiones y operadores</a>.</p>
-</div>
-
-<p>{{PreviousMenuNext("Learn/JavaScript/First_steps/Variables", "Learn/JavaScript/First_steps/Strings", "Learn/JavaScript/First_steps")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/What_is_JavaScript">¿Qué es JavaScript?</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Un primer acercamiento a JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/What_went_wrong">¿Qué salió mal? Corrigiendo JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Variables">Guardando la información que necesitas— Variables</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Matem%C3%A1ticas">Matemáticas básicas en JavaScript — números y operadores</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejo de texto — cadenas en JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Useful_string_methods">Métodos útiles para el manejo de cadenas</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Arrays">Arreglos</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Silly_story_generator" rel="nofollow">Evaluaciones: Generador de historias absurdas</a></li>
-</ul>
diff --git a/files/es/learn/javascript/first_steps/math/index.html b/files/es/learn/javascript/first_steps/math/index.html
new file mode 100644
index 0000000000..9533ac05d8
--- /dev/null
+++ b/files/es/learn/javascript/first_steps/math/index.html
@@ -0,0 +1,444 @@
+---
+title: Matemáticas básicas en JavaScript — números y operadores
+slug: Learn/JavaScript/First_steps/Math
+tags:
+  - Aprender
+  - Artículo
+  - Guía
+  - JavaScript
+  - Matemáticas
+  - Math
+  - Novato
+  - Operadores
+  - Principiante
+  - incremento
+  - l10n:priority
+  - modulo
+translation_of: Learn/JavaScript/First_steps/Math
+original_slug: Learn/JavaScript/First_steps/Matemáticas
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/JavaScript/First_steps/Variables", "Learn/JavaScript/First_steps/Strings", "Learn/JavaScript/First_steps")}}</div>
+
+<p class="summary">En este punto del curso, hablaremos de matemáticas en JavaScript — cómo  podemos usar {{Glossary("Operator","operadores")}} y otras características para manipular con éxito números y conseguir lo que nos hayamos propuesto.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>Conocimientos básicos de ordenadores, comprensión básica de  HTML y CSS, comprensión básica de lo que es JavaScript.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Familiarizarse con las matemáticas básicas de JavaScript.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Todos_aman_las_matemáticas">Todos aman las matemáticas</h2>
+
+<p>Vale, tal vez no. A algunos nos gustan, otros las odiamos desde que aprendimos en la escuela las tablas de multipicar y las divisiones complicadas, y algunos estamos a mitad entre ambas posturas. Pero ninguno podemos negar que las matemáticas son una parte fundamental de la vida que nos afecta. Y esto es especialmente cierto cuando aprendemos JavaScript (o cualquier otro lenguaje similar) — en la medida en que ello pasa por procesar números, calcular nuevos valores, etc., no te puede sorprender comprobar que JavaScript dispone de un completo conjunto de funciones matemáticas.</p>
+
+<p>En este artículo se trata solo aquella parte básica que necesitas conocer por ahora.</p>
+
+<h3 id="Tipos_de_números">Tipos de números</h3>
+
+<p>En programación, incluso el simple sistema numérico decimal que todos conocemos tan bien, es más complicado de lo que podrías pensar. Usamos diferentes términos para describir diferentes tipos de números decimales, por ejemplo:</p>
+
+<ul>
+ <li><strong>Enteros son números sin parte decimal</strong>, e.g. 10, 400 o -5.</li>
+ <li><strong>Números con coma flotante </strong>(floats): tienen punto decimal y parte decimal, por ejemplo,12.5 y 56.7786543.</li>
+ <li><strong>Doubles</strong>: son un tipo específico de números de coma flotante que tienen una mayor precisión que los numeros de coma flotante comunes (lo que significa que son más precisos en cuanto a la cantidad de decimales que poseen).</li>
+</ul>
+
+<p>¡Incluso tenemos distintos tipos de sistemas numéricos! El decimal es base 10 (quiere decir que utiliza 0-9 en cada columna), pero también tenemos cosas como:</p>
+
+<ul>
+ <li><strong>Binario</strong> — El lenguaje de computadora de nivel más bajo; 0s y 1s.</li>
+ <li><strong>Octal</strong> — De base 8, utiliza de 0–7 en cada columna.</li>
+ <li><strong>Hexadecimal</strong> — De base 16, utiliza de 0–9 y luego de a–f en cada columna. Puedes haber encontrado estos números antes, cuando colocabas <a href="/es/Learn/CSS/Introduction_to_CSS/Values_and_units#Hexadecimal_values">colores en CSS</a>.</li>
+</ul>
+
+<p><strong>Antes de que comiences a preouparte de que tu cerebro se derrita, ¡detente un momento!</strong> Para empezar, sólo vamos a apegarnos a los números decimales durante todo este curso; pocas veces te verás en la necesidad de comenzar a pensar sobre los otros tipos, si es que lo haces.</p>
+
+<p>La segunda parte de las buenas noticias es que, a diferencia de otros lenguajes de programación, JavaScript sólo tiene un tipo de dato para los números, adivinaste, {{jsxref("Number")}}. Esto significa que, sin importar el tipo de número con el que estés lidiando en Javascript, los manejas siempre de la misma manera.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: En realidad, JavaScript tiene un segundo tipo de número, {{Glossary("BigInt")}}, que se utiliza para números enteros muy, muy grandes. Pero para los propósitos de este curso, solo nos preocuparemos por los valores numéricos.</p>
+</div>
+
+<h3 id="Para_mí_todo_son_números.">Para mí, todo son números.</h3>
+
+<p>Juguemos un poco con algunos números para ponernos al día con la sintaxis básica que necesitamos. Coloca los comandos listados abajo en la <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">consola JavaScript de tus herramientas para desarrolladores</a>, o utiliza la sencilla consola integrada que verás abajo si lo prefieres.</p>
+
+<p><strong><a href="https://mdn.github.io/learning-area/javascript/introduction-to-js-1/variables/">Abrir en una ventana nueva</a></strong></p>
+
+<ol>
+ <li>Primero que todo, declara un par de variables e inicializalas con un entero y un flotante, respectivamente, luego escribe los nombres de esas variables para chequear que todo esté en orden:
+  <pre class="brush: js notranslate">var myInt = 5;
+var myFloat = 6.667;
+myInt;
+myFloat;</pre>
+ </li>
+ <li>Los valores numéricos están escritos sin comillas - Trata de declarar e inicializar un par de variables más que contengan números antes de continuar.</li>
+ <li>Ahora chequea que nuestras variables originales sean del mismo tipo. Hay un operador llamado {{jsxref("Operators/typeof", "typeof")}} en JavaScript hace esto. Digita las dos lineas siguientes:
+  <pre class="brush: js notranslate">typeof myInt;
+typeof myFloat;</pre>
+  Obtendrás <code>"number"</code> en ambos casos — esto hace las cosas mucho más fáciles que si diferentes números tuvieran difetentes tipos, y tuvimos que lidiar con ellos de diferentes maneras. Uf !</li>
+</ol>
+
+<h2 id="Operadores_Aritméticos">Operadores Aritméticos</h2>
+
+<p>Los operadores aritméticos son operadores básicos que usamos para hacer sumas:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Operador</th>
+   <th scope="col">Nombre</th>
+   <th scope="col">Propósito</th>
+   <th scope="col">Ejemplo</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>+</code></td>
+   <td>Adición</td>
+   <td>Suma dos números juntos.</td>
+   <td><code>6 + 9</code></td>
+  </tr>
+  <tr>
+   <td><code>-</code></td>
+   <td>Resta</td>
+   <td>Resta el numero de la derecha del de la izquierda.</td>
+   <td><code>20 - 15</code></td>
+  </tr>
+  <tr>
+   <td><code>*</code></td>
+   <td>Multiplicación</td>
+   <td>Multiplica dos números juntos.</td>
+   <td><code>3 * 7</code></td>
+  </tr>
+  <tr>
+   <td><code>/</code></td>
+   <td>División</td>
+   <td>Divide el número de la izquierda por el de la derecha.</td>
+   <td><code>10 / 5</code></td>
+  </tr>
+  <tr>
+   <td><code>%</code></td>
+   <td>Sobrante (también llamado módulo)</td>
+   <td>
+    <p>Retorna el restante después de dividir el número de la izquierda en porciones enteras del de la derecha.</p>
+   </td>
+   <td><code>8 % 3</code> (retorna 2, como tres está dos veces en 8, quedando 2 restantes.)</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: A veces verás números involucrados en sumas referidas como {{Glossary("Operand", "operands")}}.</p>
+</div>
+
+<p>Probablemente no necesitemos enseñarte matemáticas básicas, pero nos gustaría probar tu entendimiento de la sintaxis involucrada. Intenta entrar los ejemplos de abajo en tu <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">consola JavaScript de tus herramientas para desarrolladores</a>, o usa la sencilla consola incorporada que se vio anteriormente, si lo prefieres, para familiarizarte con la sintaxis.</p>
+
+<ol>
+ <li>Primero, trata entrando un ejemplo simple por tu cuenta, como
+  <pre class="brush: js notranslate">10 + 7
+9 * 8
+60 % 3</pre>
+ </li>
+ <li>Puedes tratar declarando e inicializando algunos números en variables, y probar usándolos en la suma - Las variables se comportarán exactamente como los valores que tienen para los fines de la suma. Por ejemplo:
+  <pre class="brush: js notranslate">var num1 = 10;
+var num2 = 50;
+9 * num1;
+num2 / num1;</pre>
+ </li>
+ <li>Por último, trate entrando algunas expresiones complejas, como:
+  <pre class="brush: js notranslate">5 + 10 * 3;
+num2 % 9 * num1;
+num2 + num1 / 8 + 2;</pre>
+ </li>
+</ol>
+
+<p>Es posible que parte de este último conjunto de sumas no te dé el resultado que esperabas; La siguiente sección bien podría dar la respuesta del por qué.</p>
+
+<h3 id="Precedencia_de_Operadores">Precedencia de Operadores</h3>
+
+<p>Veamos el último ejemplo de arriba, asumiendo que num2 tiene el valor 50 y num1 tiene el valor 10 (como se indicó anteriormente):</p>
+
+<pre class="brush: js notranslate">num2 + num1 / 8 + 2;</pre>
+
+<p>Como un ser humano, puedes leer esto como "50 más 10 es igual a 60", luego "8 más 2 es igual a 10", y finalmente "60 dividido por 10 es igual a 6".</p>
+
+<p>Pero el navegador hace "10 dividido por 8 es igual a 1.25", luego "50 más 1.25 más 2 es igual a 53.25".</p>
+
+<p>Esto es debido a la <strong>precedencia de operadores</strong> — algunos operadores son aplicados antes de otros cuando se calcula el resultado de una suma (referida como una expresión, en programación).  La precedencia de operadores en JavaScript es la misma que en las matemáticas de la escuela  — La multiplicación y la división se resuelven siempre primero, luego la suma y resta (la suma siempre se evalua de izquierda a derecha).</p>
+
+<p>Si quieres alterar la precedencia de operación, puedes colocar paréntesis alrededor de las partes que quieras explícitamente evaluar primero. Para obtener un resultado de 6, podríamos hacer esto:</p>
+
+<pre class="brush: js notranslate">(num2 + num1) / (8 + 2);</pre>
+
+<p>Pruébalo y verás.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Una completa lista de todos los operadores de JavaScript y sus precedencias pueden encontrarse en <a href="/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Operator_precedence">Expresiones y operadores</a>.</p>
+</div>
+
+<h2 id="Operadores_de_incremento_y_decremento">Operadores de incremento y decremento</h2>
+
+<p>Algunas veces necesitarás repetidamente sumar o restar uno de/a una variable numérica. Esto puede hacerse convenientemente usando los operadores de incremento (<code>++</code>) y decremento (<code>--</code>). Usamos <code>++</code> en nuestro juego "Adivina el número" en nuestro artículo <a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Un primer acercamiento a JavaScrip</a><a href="/es/docs/Learn/JavaScript/Introduction_to_JavaScript_1/A_first_splash">t</a>, cuando agregamos 1 a nuestra variable <code>guessCount</code> para mantener una pista de cuantas respuestas le quedan al usuario por turno.</p>
+
+<pre class="brush: js notranslate">guessCount++;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Son muy comunmente usadas en <a href="/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration">ciclos</a>, que aprenderás más adelante en el curso. Por ejemplo, Digamos que quieras recorrer una lista de precios, y agregar impuestos a cada uno. Usaría un ciclo para recorrer cada valor y realizar el cálculo necesario para agregar el impuesto a las ventas en cada caso. El incrementador es usado para mover al próximo valor cuando es necesario. Damos un simple ejemplo En realidad, proporcionamos un ejemplo simple que muestra cómo se hace esto: ¡pruébalo en vivo y mira el código fuente para ver si puedes detectar los incrementadores! Veremos los ciclos en detalle más adelante en el curso..</p>
+</div>
+
+<p>Trata jugando con eso en tu consola. Para empezar, nota que no puedes aplicar esto directamente a un número, sin operar en él mismo. Lo siguiente retorna un error:</p>
+
+<pre class="brush: js notranslate">3++;</pre>
+
+<p>Asì, puedes solo incrementar una variable existente. Prueba esto:</p>
+
+<pre class="brush: js notranslate">var num1 = 4;
+num1++;</pre>
+
+<p>Ok, la extrañeza número 2! Cuando hagas esto, verás que se devuelve un valor de 4; esto se debe a que el navegador devuelve el valor actual y luego incrementa la variable. Puedes ver que se ha incrementado si devuelves el valor variable nuevamente:</p>
+
+<pre class="brush: js notranslate">num1;</pre>
+
+<p>Lo mismo funciona con <code>--</code> : intenta lo siguiente:</p>
+
+<pre class="brush: js notranslate">var num2 = 6;
+num2--;
+num2;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes hacer que el navegador lo haga al revés: aumentar / disminuir la variable y luego devolver el valor, colocando el operador al comienzo de la variable en lugar del final. Prueba los ejemplos anteriores otra vez, pero esta vez usa <code>++num1</code> y<code>--num2</code>.</p>
+</div>
+
+<h2 id="Operadores_de_asignación">Operadores de asignación</h2>
+
+<p>Los operadores de asignación son operadores que asignan un valor a una variable. Ya usamos el más básico, <code>=</code>, muchas veces — simplemente asigna a la variable de la izquierda, el valor de la derecha:</p>
+
+<pre class="brush: js notranslate">var x = 3; // x contiene el valor 3
+var y = 4; // y contiene el valor 4
+x = y; // x ahora contiene el mismo valor de y... 4</pre>
+
+<p>Pero hay algunos tipos más complejos, que proporcionan atajos útiles para mantener tu código más ordenado y más eficiente. Los más comunes se enumeran a continuación.:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Operador</th>
+   <th scope="col">Nombre</th>
+   <th scope="col">Propósito</th>
+   <th scope="col">_Ejemplo</th>
+   <th scope="col">__Atajo_de__</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>+=</code></td>
+   <td>Adición asignación</td>
+   <td>Suma el valor de la derecha al valor de la variable de la  izquierda y returna el nuevo valor</td>
+   <td><code>x = 3;<br>
+    x += 4;</code></td>
+   <td><code>x = 3;<br>
+    x = x + 4;</code></td>
+  </tr>
+  <tr>
+   <td><code>-=</code></td>
+   <td>Resta asignación</td>
+   <td>
+    <p>Resta el valor de la derecha, del valor de la variable de la izquierda y retorna el nuevo valor.</p>
+   </td>
+   <td><code>x = 6;<br>
+    x -= 3;</code></td>
+   <td><code>x = 6;<br>
+    x = x - 3;</code></td>
+  </tr>
+  <tr>
+   <td><code>*=</code></td>
+   <td>Multiplicación asignación</td>
+   <td>
+    <p>Multiplica el valor de la variable en la izquierda por el valor en la derecha y retorna el nuevo valor.</p>
+   </td>
+   <td><code>x = 2;<br>
+    x *= 3;</code></td>
+   <td><code>x = 2;<br>
+    x = x * 3;</code></td>
+  </tr>
+  <tr>
+   <td><code>/=</code></td>
+   <td>División asignación</td>
+   <td>
+    <p>Divide el valor de la variable en la izquierda por el valor de la derecha y retorna el nuevo valor.</p>
+   </td>
+   <td><code>x = 10;<br>
+    x /= 5;</code></td>
+   <td><code>x = 10;<br>
+    x = x / 5;</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Intenta digitar algunos de estos ejemplos en tu consola, para darte una idea de cómo funcionan. Mira si puedes preguntar los valores que tenían antes de ingresarlos en la segunda línea, en cada caso.</p>
+
+<p>Ten en cuenta que puedes usar otras variables en el lado derecho de cada expresión, por ejemplo:</p>
+
+<pre class="brush: js notranslate">var x = 3; // x contiene el valor 3
+var y = 4; // y contiene el valor 4
+x *= y; // x ahora contiene el valor 12</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Hay una cantidad de <a href="/es/docs/Web/JavaScript/Guide/Expressions_and_Operators#Assignment_operators">otros operadores de asignación disponibles</a>, pero estos son los básicos que debes aprender por ahora.</p>
+</div>
+
+<h2 id="Aprendizaje_activo_dimensionando_una_caja_canvas">Aprendizaje activo: dimensionando una caja canvas</h2>
+
+<p>En este ejercicio vamos a hacer que completes algunos números y operadores para manipular el tamaño de una caja. El cuadro se dibuja utilizando una API de navegador llamada {{domxref("Canvas API", "", "", "true")}}. No hay necesidad de preocuparse por cómo funciona esto, solo concentrarse en las matemáticas por ahora. El ancho y el alto del cuadro (en píxeles) están definidos por las variables x e y, a las que inicialmente se les asigna un valor de 50.</p>
+
+<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/maths/editable_canvas.html", '100%', 520)}}</p>
+
+<p><strong><a href="https://mdn.github.io/learning-area/javascript/introduction-to-js-1/maths/editable_canvas.html">Abrir en una nueva ventana</a></strong></p>
+
+<p>En el cuadro de código editable anterior, hay dos líneas marcadas claramente con un comentario que nos gustaría que actualices para hacer que el cuadro crezca/se reduzca a ciertos tamaños, utilizando ciertos operadores y/o valores en cada caso. Intenta lo siguiente:</p>
+
+<ul>
+ <li>Cambia la línea que calcula x, para que el recuadro tenga un ancho de 50px, y que el 50 se calcule utilizando los números 43 y 7, y un operador aritmético.</li>
+ <li>Cambia la línea que calcula y, para que la casilla tenga 75px de altura y que el 75 se calcule utilizando los números 25 y 3, y un operador aritmético.</li>
+ <li>Cambia la línea que calcula x, para que el recuadro tenga un ancho de 250px, y que el 250 se calcule utilizando dos números y el operador del resto (módulo).</li>
+ <li>Cambia la línea que calcula y, para que el cuadro tenga 150px de altura, y que el 150 se calcule utilizando tres números, y los operadores de resta y división.</li>
+ <li>Cambia la línea que calcula x, para que el cuadro tenga 200px de ancho y que el 200 se calcule utilizando el número 4 y un operador de asignación.</li>
+ <li>Cambia la línea que calcula y, para que el cuadro tenga 200px de altura y que el 200 se calcule utilizando los números 50 y 3, el operador de multiplicación y el operador de asignación de suma.</li>
+</ul>
+
+<p>No te preocupes si arruinas totalmente el código. Siempre puedes presionar el botón Restablecer para que las cosas vuelvan a funcionar. Después de haber respondido correctamente a todas las preguntas anteriores, siéntete libre de jugar con el código un poco más, o establece desafíos para tus amigos/compañeros de clase..</p>
+
+<h2 id="Operadores_de_comparación">Operadores de comparación</h2>
+
+<p>A veces querremos ejecutar pruebas de verdadero/falso, y luego actuaremos de acuerdo con el resultado de esa prueba. Para ello, utilizamos <strong>operadores de comparación</strong>.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Operador</th>
+   <th scope="col">Nombre</th>
+   <th scope="col">Propósito</th>
+   <th scope="col">Ejemplo</th>
+  </tr>
+  <tr>
+   <td><code>===</code></td>
+   <td>Igual estricto</td>
+   <td>Comprueba si los valores izquierdo y derecho son idénticos entre sí</td>
+   <td><code>5 === 2 + 4</code></td>
+  </tr>
+  <tr>
+   <td><code>!==</code></td>
+   <td>Igual no-estricto</td>
+   <td>Comprueba si los valores izquierdo y derecho <strong>no</strong> son idénticos entre sí</td>
+   <td><code>5 !== 2 + 3</code></td>
+  </tr>
+  <tr>
+   <td><code>&lt;</code></td>
+   <td>Menor que</td>
+   <td>Comprueba si el valor izquierdo es menor que el derecho.</td>
+   <td><code>10 &lt; 6</code></td>
+  </tr>
+  <tr>
+   <td><code>&gt;</code></td>
+   <td>Mayor que</td>
+   <td>Comprueba si el valor izquierdo es mayor que el derecho.</td>
+   <td><code>10 &gt; 20</code></td>
+  </tr>
+  <tr>
+   <td>&lt;=</td>
+   <td>Menor o igual a</td>
+   <td>Comprueba si el valor izquierdo es menor o igual que el derecho.</td>
+   <td><code>3 &lt;= 2</code></td>
+  </tr>
+  <tr>
+   <td>&gt;=</td>
+   <td>Mayor o igual a</td>
+   <td>Comprueba si el valor izquierdo es mayor o igual que el derecho..</td>
+   <td><code>5 &gt;= 4</code></td>
+  </tr>
+ </thead>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: Es posible que algunas personas utilicen == y != en sus pruebas de igualdad y no igualdad. Estos son operadores válidos en JavaScript, pero difieren de === /! ==: la prueba anterior indica si los valores son iguales. pero el tipo de datos puede ser diferente, mientras que las últimas versiones estrictas prueban si el valor y el tipo de datos son los mismos. Las versiones estrictas tienden a reducir el número de errores que no se detectan, por lo que te recomendamos que los utilices.</p>
+</div>
+
+<p>Si intentas ingresar algunos de estos valores en una consola, verás que todos devuelven valores verdaderos/falsos, esos booleanos que mencionamos en el artículo anterior. Son muy útiles ya que nos permiten tomar decisiones en nuestro código; se usan cada vez que queremos hacer una elección de algún tipo, por ejemplo.:</p>
+
+<ul>
+ <li>Mostrar la etiqueta de texto correcta en un botón dependiendo de si una función está activada o desactivada.</li>
+ <li>Mostrar un mensaje sobre un juego si ha terminado, o un mensaje de victoria si el juego ha sido ganado.</li>
+ <li>Mostrando el saludo estacional correcto dependiendo de la temporada de vacaciones.</li>
+ <li>Acercar o alejar un mapa según el nivel de zoom seleccionado.</li>
+</ul>
+
+<p>Veremos cómo codificar dicha lógica cuando veamos declaraciones condicionales en un artículo futuro. Por ahora, veamos un ejemplo rápido:</p>
+
+<pre class="brush: html notranslate">&lt;button&gt;Iniciar máquina&lt;/button&gt;
+&lt;p&gt;La máquina se detuvo.&lt;/p&gt;
+</pre>
+
+<pre class="brush: js notranslate">var btn = document.querySelector('button');
+var txt = document.querySelector('p');
+
+btn.addEventListener('click', updateBtn);
+
+function updateBtn() {
+  if (btn.textContent === 'Iniciar máquina') {
+    btn.textContent = 'Detener máquina';
+    txt.textContent = 'La máquina se inició!';
+  } else {
+    btn.textContent = 'Iniciar máquina';
+    txt.textContent = 'La máquina se detuvo.';
+  }
+}</pre>
+
+<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/maths/conditional.html", '100%', 100)}}</p>
+
+<p><strong><a href="https://mdn.github.io/learning-area/javascript/introduction-to-js-1/maths/conditional.html">Abrir en una nueva ventana</a></strong></p>
+
+<p>Puede ver el operador de igualdad utilizado justo dentro de la función <code>updateBtn().</code> En este caso, no estamos probando si dos expresiones matemáticas tienen el mismo valor (estamos comprobando si el contenido de texto de un botón contiene una cadena determinada), pero sigue siendo el mismo principio. Si el botón está actualmente diciendo "Iniciar máquina" cuando se presiona, cambiamos su etiqueta a "Detener máquina" y actualizamos la etiqueta según corresponda. Si el botón está actualmente diciendo "Detener máquina" cuando se presiona, volvemos a cambiar la pantalla.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Un control de este tipo que intercambia entre dos estados generalmente se conoce como <strong>conmutador</strong>. Conmuta entre un estado y otro — Luces on, luces off, etc.</p>
+</div>
+
+<h2 id="Pon_a_prueba_tus_habilidades">Pon a prueba tus habilidades</h2>
+
+<p>Llegaste al final de este artículo, pero ¿puédes recordar la información más importante? Puedes encontrar algunas pruebas para verificar que has comprendido esta información antes de seguir avanzando — Ve <a href="/es/docs/Learn/JavaScript/First_steps/Test_your_skills:_Math">¡Pon a prueba tus habilidades!: Matemáticas</a>.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>En este artículo hemos cubierto la información fundamental que necesitas saber sobre los números en JavaScript, por ahora. Verás los números usados una y otra vez, a lo largo de tu aprendizaje de JavaScript, por lo que es una buena idea hacer esto ahora. Si eres una de esas personas que no disfruta de las matemáticas, puedes sentirte cómodo por el hecho de que este capítulo fue bastante breve.</p>
+
+<p>En el siguiente artículo, exploraremos el texto y cómo JavaScript nos permite manipularlo.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si disfrutas de las matemáticas y quieres leer más sobre cómo se implementa en JavaScript, puedes encontrar muchos más detalles en la sección principal de JavaScript de MDN. Los mejores lugares para iniciar con artículos sobre <a href="/es/docs/Web/JavaScript/Guide/Numbers_and_dates">Numero y fechas</a> y <a href="/es/docs/Web/JavaScript/Guide/Expressions_and_Operators">Expresiones y operadores</a>.</p>
+</div>
+
+<p>{{PreviousMenuNext("Learn/JavaScript/First_steps/Variables", "Learn/JavaScript/First_steps/Strings", "Learn/JavaScript/First_steps")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/What_is_JavaScript">¿Qué es JavaScript?</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Un primer acercamiento a JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/What_went_wrong">¿Qué salió mal? Corrigiendo JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Variables">Guardando la información que necesitas— Variables</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Matem%C3%A1ticas">Matemáticas básicas en JavaScript — números y operadores</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejo de texto — cadenas en JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Useful_string_methods">Métodos útiles para el manejo de cadenas</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Arrays">Arreglos</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Silly_story_generator" rel="nofollow">Evaluaciones: Generador de historias absurdas</a></li>
+</ul>
diff --git a/files/es/learn/javascript/first_steps/prueba_tus_habilidades_colon__strings/index.html b/files/es/learn/javascript/first_steps/prueba_tus_habilidades_colon__strings/index.html
deleted file mode 100644
index f919ac1ee3..0000000000
--- a/files/es/learn/javascript/first_steps/prueba_tus_habilidades_colon__strings/index.html
+++ /dev/null
@@ -1,122 +0,0 @@
----
-title: 'Prueba tus habilidades: Strings'
-slug: 'Learn/JavaScript/First_steps/Prueba_tus_habilidades:_Strings'
-tags:
-  - Cadenas
-  - JavaScript
-  - Novato
-  - Principiante
-  - Prueba tus habilidades
-  - aprende
-  - strings
-translation_of: 'Learn/JavaScript/First_steps/Test_your_skills:_Strings'
----
-<div>{{learnsidebar}}</div>
-
-<p>El objetivo de esta prueba de habilidad es evaluar si has entendido nuestros artículos <a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejo de texto — cadenas en JavaScript</a> y <a href="/es/docs/Learn/JavaScript/First_steps/Useful_string_methods">Métodos de cadena útiles</a>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puedes probar las soluciones en los editores interactivos a continuación, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a> para trabajar en las tareas.<br>
- <br>
- Si te quedas atascado, pídenos ayuda — consulta la sección {{anch("Evaluación o ayuda adicional")}} en la parte inferior de esta página.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: En los siguientes ejemplos, si hay un error en tu código, se mostrará en el panel de resultados de la página, para ayudarte a intentar averiguar la respuesta (o en la consola JavaScript del navegador, en el caso de la versión descargable).</p>
-</div>
-
-<h2 id="Cadenas_1">Cadenas 1</h2>
-
-<p>En nuestra primera tarea de cadenas, comenzaremos con algo pequeño. Ya tienes la mitad de una cita famosa dentro de una variable llamada <code>quoteStart</code>; nos gustaría que:</p>
-
-<ol>
- <li>Busques la otra mitad de la cita y la agregues al ejemplo dentro de una variable llamada <code>quoteEnd</code>.</li>
- <li>Concatenes las dos cadenas para hacer una sola cadena que contenga la cita completa. Guardes el resultado dentro de una variable llamada <code>finalQuote</code>.</li>
-</ol>
-
-<p>Verás que obtienes un error en este punto. ¿Puedes solucionar el problema con <code>quoteStart</code> para que la cita completa se muestre correctamente?</p>
-
-<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings1.html", '100%', 400)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings1-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Cadenas_2">Cadenas 2</h2>
-
-<p>En esta tarea, se te proporcionan dos variables, <code>quote</code> y <code>substring</code>, que contienen dos cadenas. Nos gustaría que:</p>
-
-<ol>
- <li>Recuperes la longitud de la cita y la guardes en una variable llamada <code>quoteLength</code>.</li>
- <li>Busques la posición del índice donde aparece <code>substring</code> en <code>quote</code>, y almacenes ese valor en una variable llamada <code>index</code>.</li>
- <li>Uses una combinación de las variables que tienes y las propiedades/métodos de cadena disponibles para recortar la cita original a "No me gustan los huevos verdes y el jamón", y la guardes en una variable llamada <code>revisedQuote</code>.</li>
-</ol>
-
-<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings2.html", '100%', 400)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings2-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Cadenas_3">Cadenas 3</h2>
-
-<p>En la siguiente tarea de cadenas, se te da la misma cita con la que terminaste en la tarea anterior, ¡pero está algo rota! Queremos que la arregles y actualices, así:</p>
-
-<ol>
- <li>Cambia la letra mayúscula para corregir con mayúscula inicial la oración (todo en minúsculas, excepto la primera letra mayúscula). Almacena la nueva cita en una variable llamada <code>fixedQuote</code>.</li>
- <li>En <code>fixedQuote</code>, reemplaza "huevos verdes con jamón" con otro alimento que realmente no te guste.</li>
- <li>Hay una pequeña solución más por hacer: agrega un punto al final de la cita y guarda la versión final en una variable llamada <code>finalQuote</code>.</li>
-</ol>
-
-<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings3.html", '100%', 400)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings3-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Cadenas_4">Cadenas 4</h2>
-
-<p>En la tarea de cadena final, te hemos dado el nombre de un teorema, dos valores numéricos y una cadena incompleta (los bits que se deben agregar están marcados con asteriscos (<code>*</code>)). Queremos que cambies el valor de la cadena de la siguiente manera:</p>
-
-<ol>
- <li>Cámbiala de un literal de cadena normal a una plantilla literal.</li>
- <li>Reemplaza los cuatro asteriscos con cuatro marcadores de posición en la plantilla literal. Estos deben ser:
-  <ol>
-   <li>El nombre del teorema.</li>
-   <li>Los dos valores numéricos que tenemos.</li>
-   <li>La longitud de la hipotenusa de un triángulo rectángulo, dado que las longitudes de los otros dos lados son iguales a los dos valores que tenemos. Deberás buscar cómo calcular esto a partir de lo que tienes. Haz el cálculo dentro del marcador de posición.</li>
-  </ol>
- </li>
-</ol>
-
-<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
-
-<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings4.html", '100%', 400)}}</p>
-
-<div class="blockIndicator note">
-<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings4-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
-</div>
-
-<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
-
-<p>Puedes practicar estos ejemplos en los editores interactivos anteriores.</p>
-
-<p>Si deseas que se evalúe tu trabajo o estás atascado y deseas pedir ayuda:</p>
-
-<ol>
- <li>Coloca tu trabajo en un editor que se pueda compartir en línea, como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a> o <a href="https://glitch.com/">Glitch</a>. Puedes escribir el código tú mismo o utilizar los archivos de punto de partida vinculados en las secciones anteriores.</li>
- <li>Escribe una publicación solicitando evaluación y/o ayuda en la <a href="https://discourse.mozilla.org/c/mdn/learn">categoría de aprendizaje del foro de discusión de MDN</a>. Tu publicación debe incluir:
-  <ul>
-   <li>Un título descriptivo como "Se busca evaluación para la prueba de habilidad de Cadenas 1".</li>
-   <li>Detalles de lo que ya has probado y lo que te gustaría que hiciéramos, p. ej. si estás atascado y necesitas ayuda, o quiere una evaluación.</li>
-   <li>Un enlace al ejemplo que deseas evaluar o con el que necesitas ayuda, en un editor que se pueda compartir en línea (como se mencionó en el paso 1 anterior). Esta es una buena práctica para entrar — es muy difícil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
-   <li>Un enlace a la página de la tarea o evaluación real, para que podamos encontrar la pregunta con la que deseas ayuda.</li>
-  </ul>
- </li>
-</ol>
diff --git a/files/es/learn/javascript/first_steps/qué_es_javascript/index.html b/files/es/learn/javascript/first_steps/qué_es_javascript/index.html
deleted file mode 100644
index bd845c8681..0000000000
--- a/files/es/learn/javascript/first_steps/qué_es_javascript/index.html
+++ /dev/null
@@ -1,436 +0,0 @@
----
-title: ¿Qué es JavaScript?
-slug: Learn/JavaScript/First_steps/Qué_es_JavaScript
-tags:
-  - APIs
-  - Aprender
-  - Artículo
-  - Añadir JavaScript
-  - Curso
-  - Dinámico
-  - En línea
-  - Gestores de JavaScript en linea
-  - JavaScript
-  - Navegador
-  - Núcleo
-  - Principiante
-  - comentários
-  - externo
-translation_of: Learn/JavaScript/First_steps/What_is_JavaScript
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/JavaScript/First_steps/A_first_splash", "Learn/JavaScript/First_steps")}}</div>
-
-<p class="summary">¡Bienvenido al curso de JavaScript para principiantes de MDN! En este artículo veremos JavaScript desde un alto nivel, respondiendo preguntas como "¿Qué es?" y "¿Qué puedes hacer con él?", y asegúrate de estar cómodo con el propósito de JavaScript.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerrequisitos:</th>
-   <td>Conocimientos básicos de informática, conocimientos básicos de HTML y CSS.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Familiarizarte con lo que es JavaScript, lo que puede hacer y cómo encaja en un sitio web.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Una_definición_de_alto_nivel">Una definición de alto nivel</h2>
-
-<p>JavaScript es un lenguaje de programación o de secuencias de comandos que te permite implementar funciones complejas en páginas web, cada vez que una página web hace algo más que sentarse allí y mostrar información estática para que la veas, muestra oportunas actualizaciones de contenido, mapas interactivos, animación de Gráficos 2D/3D, desplazamiento de máquinas reproductoras de vídeo, etc., puedes apostar que probablemente JavaScript está involucrado. Es la tercera capa del pastel de las tecnologías web estándar, dos de las cuales (<a href="/es/docs/Learn/HTML">HTML</a> y <a href="/es/docs/Learn/CSS">CSS</a>) hemos cubierto con mucho más detalle en otras partes del Área de aprendizaje.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13502/cake.png" style="display: block; margin: 0 auto;"></p>
-
-<ul>
- <li>{{Glossary("HTML")}} es el lenguaje de marcado que usamos para estructurar y dar significado a nuestro contenido web, por ejemplo, definiendo párrafos, encabezados y tablas de datos, o insertando imágenes y videos en la página.</li>
- <li>{{Glossary("CSS")}} es un lenguaje de reglas de estilo que usamos para aplicar estilo a nuestro contenido HTML, por ejemplo, establecer colores de fondo y tipos de letra, y distribuir nuestro contenido en múltiples columnas.</li>
- <li>{{Glossary("JavaScript")}} es un lenguaje de secuencias de comandos que te permite crear contenido de actualización dinámica, controlar multimedia, animar imágenes y prácticamente todo lo demás. (Está bien, no todo, pero es sorprendente lo que puedes lograr con unas pocas líneas de código JavaScript).</li>
-</ul>
-
-<p>Las tres capas se superponen muy bien. Tomemos una etiqueta de texto simple como ejemplo. Podemos marcarla usando HTML para darle estructura y propósito:</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Player 1: Chris&lt;/p&gt;</pre>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13422/just-html.png" style="height: 28px; width: 108px;"></p>
-
-<p>Luego, podemos agregar algo de CSS a la mezcla para que se vea bien:</p>
-
-<pre class="brush: css notranslate">p {
-  font-family: 'helvetica neue', helvetica, sans-serif;
-  letter-spacing: 1px;
-  text-transform: uppercase;
-  text-align: center;
-  border: 2px solid rgba(0,0,200,0.6);
-  background: rgba(0,0,200,0.3);
-  color: rgba(0,0,200,0.6);
-  box-shadow: 1px 1px 2px rgba(0,0,200,0.4);
-  border-radius: 10px;
-  padding: 3px 10px;
-  display: inline-block;
-  cursor: pointer;
-}</pre>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13424/html-and-css.png" style="height: 48px; width: 187px;"></p>
-
-<p>Y finalmente, podemos agregar algo de JavaScript para implementar un comportamiento dinámico:</p>
-
-<pre class="brush: js notranslate">const para = document.querySelector('p');
-
-para.addEventListener('click', updateName);
-
-function updateName() {
-  let name = prompt('Enter a new name');
-  para.textContent = 'Player 1: ' + name;
-}
-</pre>
-
-<p>{{ EmbedLiveSample('A_high-level_definition', '100%', 80, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<p>Intenta hacer clic en esta última versión de la etiqueta de texto para ver qué sucede (ten en cuenta también que puedes encontrar esta demostración en GitHub — ¡consulta el <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/javascript-label.html">código fuente</a> o <a href="http://mdn.github.io/learning-area/javascript/introduction-to-js-1/what-is-js/javascript-label.html">ejecútalo en vivo</a>)!</p>
-
-<p>JavaScript puede hacer mucho más que eso — exploremos qué con más detalle.</p>
-
-<h2 id="Entonces_¿qué_puede_hacer_realmente">Entonces, ¿qué puede hacer realmente?</h2>
-
-<p>El núcleo del lenguaje JavaScript de lado del cliente consta de algunas características de programación comunes que te permiten hacer cosas como:</p>
-
-<ul>
- <li>Almacenar valores útiles dentro de variables. En el ejemplo anterior, por ejemplo, pedimos que ingreses un nuevo nombre y luego almacenamos ese nombre en una variable llamada <code>name</code>.</li>
- <li>Operaciones sobre fragmentos de texto (conocidas como "cadenas" (<code>strings</code>) en programación). En el ejemplo anterior, tomamos la cadena "<code>Player1</code>:" y la unimos a la variable <code>name</code> para crear la etiqueta de texto completa, p. ej. ''<code>Player1: Chris</code>".</li>
- <li>Y ejecuta código en respuesta a ciertos eventos que ocurren en una página web. Usamos un evento {{Event("click")}} en nuestro ejemplo anterior para detectar cuándo se hace clic en el botón y luego ejecutar el código que actualiza la etiqueta de texto.</li>
- <li>¡Y mucho más!</li>
-</ul>
-
-<p>Sin embargo, lo que aún es más emocionante es la funcionalidad construida sobre el lenguaje JavaScript de lado del cliente. Las denominadas <strong>interfaces de programación de aplicaciones</strong> (<strong>API</strong>) te proporcionan superpoderes adicionales para utilizar en tu código JavaScript.</p>
-
-<p>Las API son conjuntos de bloques de construcción de código listos para usar que permiten a un desarrollador implementar programas que de otro modo serían difíciles o imposibles de implementar. Hacen lo mismo para la programación que los kits de muebles prefabricados para la construcción de viviendas — es mucho más fácil tomar paneles precortados y atornillarlos para hacer una estantería que elaborar el diseño tú mismo, que ir y encontrar la madera correcta, cortar todos los paneles del tamaño y la forma correctos, buscar los tornillos del tamaño correcto y <em>luego</em> júntalos para hacer una estantería.</p>
-
-<p>Generalmente se dividen en dos categorías.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13508/browser.png" style="display: block; height: 511px; margin: 0px auto; width: 815px;"></p>
-
-<p>Las <strong>APIs del navegador</strong> están integradas en tu navegador web y pueden exponer datos del entorno informático circundante o realizar tareas complejas y útiles. Por ejemplo:</p>
-
-<ul>
- <li>La {{domxref("Document_Object_Model", " API del DOM (<code>Document Object Model</code>)")}} te permite manipular HTML y CSS, crear, eliminar y cambiar el HTML, aplicar dinámicamente nuevos estilos a tu página, etc. Cada vez que ves aparecer una ventana emergente en una página, o se muestra algún nuevo contenido (como vimos anteriormente en nuestra sencilla demostración), por ejemplo, ese es el DOM en acción.</li>
- <li>La {{domxref("Geolocalization", "API de Geolocalización")}} recupera información geográfica. Así es como <a href="https://www.google.com/maps">Google Maps</a> puede encontrar tu ubicación y trazarla en un mapa.</li>
- <li>Las APIs {{domxref("Canvas_API", "Canvas")}} y {{domxref("WebGL_API", "WebGL")}} te permiten crear gráficos animados en 2D y 3D. Las personas están haciendo cosas increíbles con estas tecnologías web — consulta <a href="https://www.chromeexperiments.com">Experimentos de Chrome</a> y <a href="http://webglsamples.org/">webglsamples</a>.</li>
- <li><a href="https://developer.mozilla.org/es/Apps/Fundamentals/Audio_and_video_delivery">APIs de audio y video</a> como {{domxref("HTMLMediaElement")}} y {{domxref("WebRTC API", "WebRTC")}} te permiten hacer cosas realmente interesantes con multimedia, como reproducir audio y video directamente en una página web, o tomar video de tu cámara web y mostrarlo en la computadora de otra persona (prueba nuestra sencilla <a href="http://chrisdavidmills.github.io/snapshot/">demostración instantánea</a> para hacerte una idea).</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Muchas de las demostraciones anteriores no funcionarán en un navegador antiguo — al experimentar, es una buena idea utilizar un navegador moderno como Firefox, Chrome, Edge u Opera para ejecutar tu código. Deberás considerar las <a href="/es/docs/Learn/Tools_and_testing/Cross_browser_testing">pruebas en varios navegadores</a> con más detalle cuando estés más cerca de entregar el código de producción (es decir, código real que usarán los clientes reales).</p>
-</div>
-
-<p>Las <strong>APIs de terceros</strong> no están integradas en el navegador de forma predeterminada y, por lo general, debes obtener su código e información de algún lugar de la Web. Por ejemplo:</p>
-
-<ul>
- <li>La <a href="https://dev.twitter.com/overview/documentation">API de Twitter</a> te permite hacer cosas como mostrar tus últimos tweets en tu sitio web.</li>
- <li>La <a href="https://developers.google.com/maps/">API de Google Maps</a> y la <a href="https://wiki.openstreetmap.org/wiki/API">API de OpenStreetMap</a> te permiten insertar mapas personalizados en tu sitio web y otras funciones similares.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: estas APIs son avanzadas y no cubriremos ninguna de ellas en este módulo. Puedes obtener más información sobre estas en nuestro <a href="/es/docs/Learn/JavaScript/Client-side_web_APIs">módulo de APIs web de lado del cliente</a>.</p>
-</div>
-
-<p>¡También hay mucho más disponible! Sin embargo, no te emociones demasiado todavía. No podrás crear el próximo Facebook, Google Maps o Instagram después de estudiar JavaScript durante 24 horas — hay muchos conceptos básicos que cubrir primero. Y es por eso que estás aquí — ¡sigamos adelante!</p>
-
-<h2 id="¿Qué_está_haciendo_JavaScript_en_tu_página">¿Qué está haciendo JavaScript en tu página?</h2>
-
-<p>Aquí, de hecho, comenzaremos a ver algo de código y, mientras lo hacemos, exploraremos lo que realmente sucede cuando ejecutas JavaScript en tu página.</p>
-
-<p>Recapitulemos brevemente sobre la historia de lo que sucede cuando cargas una página web en un navegador (de lo que hablamos por primera vez en nuestro artículo <a href="/es/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_does_CSS_actually_work">Cómo funciona CSS</a>). Cuando cargas una página web en tu navegador, estás ejecutando tu código (HTML, CSS y JavaScript) dentro de un entorno de ejecución (la pestaña del navegador). Esto es como una fábrica que toma materias primas (el código) y genera un producto (la página web).</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13504/execution.png" style="display: block; margin: 0 auto;"></p>
-
-<p>Un uso muy común de JavaScript es modificar dinámicamente HTML y CSS para actualizar una interfaz de usuario, a través de la API del modelo de objetos del documento (como se mencionó anteriormente). Ten en cuenta que el código de tus documentos web generalmente se cargan y ejecutan en el orden en que aparece en la página. Si JavaScript se carga e intenta ejecutarse antes de que se hayan cargado el HTML y el CSS al que afecta, pueden producirse errores. Aprenderás formas de evitar esto más adelante en el artículo, en la sección <a href="/es/docs/Learn/JavaScript/First_steps/What_is_JavaScript#Script_loading_strategies">Estrategias de carga de scripts</a>.</p>
-
-<h3 id="Seguridad_del_navegador">Seguridad del navegador</h3>
-
-<p>Cada pestaña del navegador tiene su propio depósito separado para ejecutar código (estos depósitos se denominan "entornos de ejecución" en términos técnicos) — esto significa que, en la mayoría de los casos, el código de cada pestaña se ejecuta de forma completamente independiente y el código de una pestaña no puede afectar el código en otra pestaña, o en otro sitio web. Esta es una buena medida de seguridad — si este no fuera el caso, los piratas podrían comenzar a escribir código para robar información de otros sitios web y otras cosas muy malas.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Existen formas de enviar código y datos entre diferentes sitios web/pestañas de manera segura, pero estas son técnicas avanzadas que no cubriremos en este curso.</p>
-</div>
-
-<h3 id="Orden_de_ejecución_de_JavaScript">Orden de ejecución de JavaScript</h3>
-
-<p>Cuando el navegador encuentra un bloque de JavaScript, generalmente lo ejecuta en orden, de arriba a abajo. Esto significa que debes tener cuidado con el orden en el que colocas las cosas. Por ejemplo, volvamos al bloque de JavaScript que vimos en nuestro primer ejemplo:</p>
-
-<pre class="brush: js notranslate">const para = document.querySelector('p');
-
-para.addEventListener('click', updateName);
-
-function updateName() {
-  let name = prompt('Enter a new name');
-  para.textContent = 'Player 1: ' + name;
-}</pre>
-
-<p>Aquí seleccionamos un párrafo de texto (línea 1), luego adjuntamos un detector de eventos (línea 3) de modo que cuando se hace clic en el párrafo, el bloque de código <code>updateName()</code> (líneas 5-8) se ejecuta. El bloque de código <code>updateName()</code> (estos tipos de bloques de código reutilizables se denominan "funciones") pide al usuario un nuevo nombre y luego inserta ese nombre en el párrafo para actualizar la pantalla.</p>
-
-<p>Si cambiaras el orden de las dos primeras líneas de código, ya no funcionaría — en su lugar, obtendrías un error en la <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">consola del desarrollador del navegador</a> — <code>TypeError: para is undefined</code>. Esto significa que el objeto <code>para</code> aún no existe, por lo que no podemos agregarle un detector de eventos.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Este es un error muy común; debes tener cuidado de que los objetos a los que se hace referencia en tu código existan antes de intentar hacer algo con ellos.</p>
-</div>
-
-<h3 id="Código_interpretado_versus_compilado">Código interpretado versus compilado</h3>
-
-<p>Es posible que escuches los términos <strong>interpretados</strong> y <strong>compilados</strong> en el contexto de la programación. En los lenguajes interpretados, el código se ejecuta de arriba a abajo y el resultado de ejecutar el código se devuelve inmediatamente. No tienes que transformar el código en una forma diferente antes de que el navegador lo ejecute. El código se recibe en su forma de texto amigable para el programador y se procesa directamente desde allí.</p>
-
-<p>Los lenguajes compilados, por otro lado, se transforman (compilan) a código máquina antes de que sean ejecutados por la computadora. Por ejemplo, C/C++ se compila a código máquina que luego ejecuta la computadora. El programa se ejecuta desde un formato binario, que se generó a partir del código fuente del programa original.</p>
-
-<p>JavaScript es un lenguaje de programación interpretado ligero. El navegador web recibe el código JavaScript en su forma de texto original y ejecuta el script a partir de ahí. Desde un punto de vista técnico, la mayoría de los intérpretes de JavaScript modernos utilizan una técnica llamada <strong>compilación en tiempo real</strong> para mejorar el rendimiento; el código fuente de JavaScript se compila en un formato binario más rápido mientras se usa el script, de modo que se pueda ejecutar lo más rápido posible. Sin embargo, JavaScript todavía se considera un lenguaje interpretado, ya que la compilación se maneja en el entorno de ejecución, en lugar de antes.</p>
-
-<p>Ambos tipos de lenguaje tienen ventajas, pero no las abordaremos ahora.</p>
-
-<h3 id="Código_de_lado_del_servidor_versus_de_lado_del_cliente">Código de lado del servidor versus de lado del cliente</h3>
-
-<p>También puedes escuchar los términos código <strong>de lado del servidor</strong> y <strong>de lado del cliente</strong>, especialmente en el contexto del desarrollo web. El código de lado del cliente es un código que se ejecuta en la computadora del usuario — cuando se ve una página web, el código de lado del cliente de la página se descarga, luego se ejecuta y se muestra en el navegador. En este módulo estamos hablando explícitamente de <strong>JavaScript de lado del cliente</strong>.</p>
-
-<p>El código de lado del servidor, por otro lado, se ejecuta en el servidor, luego sus resultados se descargan y se muestran en el navegador. Ejemplos de lenguajes web populares de lado del servidor incluyen a ¡PHP, Python, Ruby, ASP.NET y... JavaScript! JavaScript también se puede utilizar como lenguaje de lado del servidor, por ejemplo, en el popular entorno Node.js — puedes obtener más información sobre JavaScript de lado del servidor en nuestro tema <a href="/es/docs/Learn/Server-side">Sitios web dinámicos — Programación de lado del servidor</a>.</p>
-
-<h3 id="Código_dinámico_versus_estático">Código dinámico versus estático</h3>
-
-<p>La palabra <strong>dinámico</strong> se usa para describir tanto a JavaScript de lado del cliente como a los lenguajes de lado del servidor — se refiere a la capacidad de actualizar la visualización de una página web/aplicación para mostrar diferentes cosas en diferentes circunstancias, generando contenido nuevo según sea necesario. El código de lado del servidor genera dinámicamente nuevo contenido en el servidor, p. ej. extraer datos de una base de datos, mientras que JavaScript de lado del cliente genera dinámicamente nuevo contenido dentro del navegador del cliente, p. ej. creando una nueva tabla HTML, llenándola con los datos solicitados al servidor y luego mostrando la tabla en una página web que se muestra al usuario. El significado es ligeramente diferente en los dos contextos, pero relacionado, y ambos enfoques (de lado del servidor y de lado del cliente) generalmente funcionan juntos.</p>
-
-<p>Una página web sin contenido que se actualiza dinámicamente se denomina <strong>estática</strong> — simplemente muestra el mismo contenido todo el tiempo.</p>
-
-<h2 id="¿Cómo_agregas_JavaScript_a_tu_página">¿Cómo agregas JavaScript a tu página?</h2>
-
-<p>JavaScript se aplica a tu página HTML de manera similar a CSS. Mientras que CSS usa elementos {{htmlelement("link")}} para aplicar hojas de estilo externas y elementos {{htmlelement("style")}} para aplicar hojas de estilo internas a HTML, JavaScript solo necesita un amigo en el mundo de HTML: el elemento {htmlelement("script")}}. Aprendamos cómo funciona esto.</p>
-
-<h3 id="JavaScript_interno">JavaScript interno</h3>
-
-<ol>
- <li>En primer lugar, haz una copia local de nuestro archivo de ejemplo <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/apply-javascript.html">apply-javascript.html</a>. Guárdalo en un directorio en algún lugar accesible.</li>
- <li>Abre el archivo en tu navegador web y en tu editor de texto. Verás que el HTML crea una página web simple que contiene un botón en el que se puede hacer clic.</li>
- <li>A continuación, ve a tu editor de texto y agrega lo siguiente en tu <code>head</code>, justo antes de tu etiqueta de cierre <code>&lt;/head&gt;</code>:
-  <pre class="brush: html notranslate">&lt;script&gt;
-
-  // JavaScript va aquí
-
-&lt;/script&gt;</pre>
- </li>
- <li>Ahora agregaremos algo de JavaScript dentro de nuestro elemento {{htmlelement("script")}} para que la página haga algo más interesante — agrega el siguiente código justo debajo de la línea "// El código JavaScript va aquí":
-  <pre class="brush: js notranslate">document.addEventListener("DOMContentLoaded", function() {
-  function createParagraph() {
-    let para = document.createElement('p');
-    para.textContent = 'You clicked the button!';
-    document.body.appendChild(para);
-  }
-
-  const buttons = document.querySelectorAll('button');
-
-  for(let i = 0; i &lt; buttons.length ; i++) {
-    buttons[i].addEventListener('click', createParagraph);
-  }
-});</pre>
- </li>
- <li>Guarda tu archivo y actualiza el navegador — ahora deberías ver que cuando haces clic en el botón, se genera un nuevo párrafo y se coloca debajo.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Si tu ejemplo no parece funcionar, sigue los pasos nuevamente y verifica que hiciste todo bien. ¿Guardaste tu copia local del código de inicio como un archivo <code>.html</code>? ¿Agregaste tu elemento {{htmlelement("script")}} justo antes de la etiqueta <code>&lt;/head&gt;</code>? ¿Ingresaste el JavaScript exactamente como se muestra? <strong>JavaScript distingue entre mayúsculas y minúsculas y es muy exigente, por lo que debes ingresar la sintaxis exactamente como se muestra; de lo contrario, es posible que no funcione.</strong></p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes ver esta versión en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/apply-javascript-internal.html">apply-javascript-internal.html</a> o (<a href="http://mdn.github.io/learning-area/javascript/introduction-to-js-1/what-is-js/apply-javascript-internal.html">verla en vivo también</a>).</p>
-</div>
-
-<h3 id="JavaScript_externo">JavaScript externo</h3>
-
-<p>Esto funciona muy bien, pero ¿y si quisiéramos poner nuestro JavaScript en un archivo externo? Exploremos esto ahora.</p>
-
-<ol>
- <li>Primero, crea un nuevo archivo en el mismo directorio que tu archivo HTML del ejemplo. Como nombre ponle <code>script.js</code>; asegúrate de que el nombre tenga la extensión <code>.js</code>, ya que así es como se reconoce como JavaScript.</li>
- <li>Reemplaza tu elemento {{htmlelement("script")}} actual con lo siguiente:
-  <pre class="brush: html notranslate">&lt;script src="script.js" defer&gt;&lt;/script&gt;</pre>
- </li>
- <li>Dentro de <code>script.js</code>, agrega el siguiente script:
-  <pre class="brush: js notranslate">function createParagraph() {
-  let para = document.createElement('p');
-  para.textContent = 'You clicked the button!';
-  document.body.appendChild(para);
-}
-
-const buttons = document.querySelectorAll('button');
-
-for(let i = 0; i &lt; buttons.length ; i++) {
-  buttons[i].addEventListener('click', createParagraph);
-}</pre>
- </li>
- <li>Guarda y actualiza tu navegador, ¡y deberías ver lo mismo! Funciona igual, pero ahora tenemos nuestro JavaScript en un archivo externo. Por lo general, esto es bueno en términos de organización de tu código y para hacerlo reutilizable en varios archivos HTML. Además, el HTML es más fácil de leer sin grandes trozos de script en él.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes ver esta versión en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/apply-javascript-external.html">apply-javascript-external.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/script.js">script.js</a> (<a href="http://mdn.github.io/learning-area/javascript/introduction-to-js-1/what-is-js/apply-javascript-external.html">verla en vivo también</a>).</p>
-</div>
-
-<h3 id="Controladores_de_JavaScript_en_línea">Controladores de JavaScript en línea</h3>
-
-<p>Ten en cuenta que a veces te encontrarás con fragmentos de código JavaScript real dentro de HTML. Podría verse algo similar a esto:</p>
-
-<div id="inline_js_example">
-<pre class="brush: js example-bad notranslate">function createParagraph() {
-  let para = document.createElement('p');
-  para.textContent = 'You clicked the button!';
-  document.body.appendChild(para);
-}</pre>
-
-<pre class="brush: html example-bad notranslate">&lt;button onclick="createParagraph()"&gt;Click me!&lt;/button&gt;</pre>
-</div>
-
-<p>Puedes probar esta versión de nuestra demostración a continuación.</p>
-
-<p>{{ EmbedLiveSample('inline_js_example', '100%', 150, "", "", "hide-codepen-jsfiddle") }}</p>
-
-<p>Esta demostración tiene exactamente la misma funcionalidad que en las dos secciones anteriores, excepto que el elemento {{htmlelement("button")}} incluye un controlador <code>onclick</code> en línea para que la función se ejecute cuando se presiona el botón .</p>
-
-<p><strong>Sin embargo, no hagas esto</strong>. Es una mala práctica contaminar tu HTML con JavaScript, y es ineficiente; tendrías que incluir el atributo <code>onclick="createParagraph()"</code> en cada botón al que desees que se aplique JavaScript.</p>
-
-<p>El uso de una construcción de JavaScript pura te permite seleccionar todos los botones usando una instrucción. El código que usamos anteriormente para cumplir este propósito se ve así:</p>
-
-<pre class="brush: js notranslate">const buttons = document.querySelectorAll('button');
-
-for(let i = 0; i &lt; buttons.length ; i++) {
-  buttons[i].addEventListener('click', createParagraph);
-}</pre>
-
-<p>Esto puede ser un poco más largo que el atributo <code>onclick</code>, pero funcionará para todos los botones, sin importar cuántos haya en la página, ni cuántos se agreguen o eliminen. No es necesario cambiar el JavaScript.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Intenta editar tu versión de <code>apply-javascript.html</code> y agrega algunos botones más en el archivo. Cuando la vuelvas a cargar, deberías encontrar que todos los botones al hacer clic crearán un párrafo. Limpio, ¿eh?</p>
-</div>
-
-<h3 id="Estrategias_para_la_carga_de_scripts">Estrategias para la carga de scripts</h3>
-
-<p>Hay una serie de problemas relacionados con la carga de los scripts en el momento adecuado. ¡Nada es tan simple como parece! Un problema común es que todo el HTML de una página se carga en el orden en que aparece. Si estás utilizando JavaScript para manipular elementos en la página (o exactamente, el <a href="/es/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents#The_document_object_model">Modelo de objetos del documento</a>), tu código no funcionará si el JavaScript se carga y procesa antes que el HTML que estás intentando haga algo.</p>
-
-<p>En los ejemplos de código anteriores, en los ejemplos internos y externos, JavaScript se carga y se ejecuta en el encabezado del documento, antes de analizar el cuerpo HTML. Esto podría causar un error, por lo que hemos utilizado algunas construcciones para solucionarlo.</p>
-
-<p>En el ejemplo interno, puedes ver esta estructura alrededor del código:</p>
-
-<pre class="brush: js notranslate">document.addEventListener("DOMContentLoaded", function() {
-  ...
-});</pre>
-
-<p>Este es un detector de eventos, que escucha el evento "DOMContentLoaded" del navegador, lo cual significa que el cuerpo HTML está completamente cargado y analizado. El JavaScript dentro de este bloque no se ejecutará hasta que se active ese evento, por lo que se evita el error (<a href="/es/docs/Learn/JavaScript/Building_blocks/Events">aprenderás sobre los eventos</a> más adelante en el curso).</p>
-
-<p>En el ejemplo externo, usamos una función de JavaScript más moderno para resolver el problema, el atributo <code>defer</code>, que le dice al navegador que continúe descargando el contenido HTML una vez que se ha alcanzado la etiqueta del elemento <code>&lt;script&gt;</code>.</p>
-
-<pre class="brush: js notranslate">&lt;script src="script.js" defer&gt;&lt;/script&gt;</pre>
-
-<p>En este caso, tanto el script como el HTML se cargarán simultáneamente y el código funcionará.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: En el caso externo, no necesitamos usar el evento <code>DOMContentLoaded</code> porque el atributo <code>defer</code> nos resolvió el problema. No usamos la solución <code>defer</code> para el ejemplo interno de JavaScript porque <code>defer</code> solo funciona para scripts externos.</p>
-</div>
-
-<p>Una solución pasada de moda a este problema solía ser colocar tu elemento <code>script</code> justo en la parte inferior del cuerpo (por ejemplo, justo antes de la etiqueta <code>&lt;/body&gt;</code>), para que se cargara después de haber procesado todo el HTML. El problema con esta solución es que la carga/procesamiento del script está completamente bloqueado hasta que se haya cargado el DOM HTML. En sitios muy grandes con mucho JavaScript, esto puede causar un importante problema de rendimiento y ralentizar tu sitio.</p>
-
-<h4 id="async_y_defer"><code>async</code> y <code>defer</code></h4>
-
-<p>En realidad, hay dos modernas características que podemos usar para evitar el problema del bloqueo de <code>script</code>: <code>async</code> y <code>defer</code> (que vimos anteriormente). Veamos la diferencia entre estas dos.</p>
-
-<p>Los scripts cargados con el atributo <code>async</code> (ve más abajo) descargarán el <code>script</code> sin bloquear el renderizado de la página y lo ejecutará tan pronto como el <code>script</code> se termine de descargar. No tienes garantía de que los <code>script</code>s se ejecuten en un orden específico, solo que no detendrán la visualización del resto de la página. Es mejor usar <code>async</code> cuando los <code>script</code>s de la página se ejecutan de forma independiente y no dependen de ningún otro <code>script</code> de la página.</p>
-
-<p>Por ejemplo, si tienes los siguientes elementos <code>script</code>:</p>
-
-<pre class="brush: html notranslate">&lt;script async src="js/vendor/jquery.js"&gt;&lt;/script&gt;
-
-&lt;script async src="js/script2.js"&gt;&lt;/script&gt;
-
-&lt;script async src="js/script3.js"&gt;&lt;/script&gt;</pre>
-
-<p>No puedes confiar en el orden en que se cargarán los <code>script</code>s. <code>jquery.js</code> se puede cargar antes o después de <code>script2.js</code> y <code>script3.js</code> y si este es el caso, cualquier función en esos <code>script</code>s dependiendo de <code>jquery</code> producirá un error porque <code>jquery</code> no se definirá en el momento en que se ejecute el <code>script</code>.</p>
-
-<p><code>async</code> se debe usar cuando tienes un montón de <code>script</code>s en segundo plano para cargar, y solo deseas ponerlos en su lugar lo antes posible. Por ejemplo, tal vez tengas algunos archivos de datos del juego para cargar, que serán necesarios cuando el juego realmente comience, pero por ahora solo deseas continuar mostrando la introducción del juego, los títulos y el lobby, sin que se bloqueen al cargar el <code>script</code>.</p>
-
-<p>Los <code>script</code>s cargados con el atributo <code>defer</code> (ve a continuación) se ejecutarán en el orden en que aparecen en la página y los ejecutará tan pronto como se descarguen el <code>script</code> y el contenido:</p>
-
-<pre class="brush: html notranslate">&lt;script defer src="js/vendor/jquery.js"&gt;&lt;/script&gt;
-
-&lt;script defer src="js/script2.js"&gt;&lt;/script&gt;
-
-&lt;script defer src="js/script3.js"&gt;&lt;/script&gt;</pre>
-
-<p>Todos los <code>script</code>s con el atributo <code>defer</code> se cargarán en el orden en que aparecen en la página. Entonces, en el segundo ejemplo, podemos estar seguros de que <code>jquery.js</code> se cargará antes que <code>script2.js</code> y <code>script3.js</code> y que <code>script2.js</code> se cargará antes de <code>script3.js</code>. No se ejecutarán hasta que se haya cargado todo el contenido de la página, lo cual es útil si tus <code>script</code>s dependen de que el DOM esté en su lugar (por ejemplo, modifican uno o más elementos de la página).</p>
-
-<p>Para resumir:</p>
-
-<ul>
- <li><code>async</code> y <code>defer</code> indican al navegador que descargue los <code>script</code>s en un hilo separado, mientras que el resto de la página (el DOM, etc.) se descarga, por lo que los <code>script</code>s no bloquean la carga de la página.</li>
- <li>Si tus <code>script</code>s se deben ejecutar inmediatamente y no tienen ninguna dependencia, utiliza <code>async</code>.</li>
- <li>Si tus <code>script</code>s necesitan esperar a ser procesados y dependen de otros <code>script</code>s y/o del DOM en su lugar, cárgalos usando <code>defer</code>y coloca tus elementos <code>&lt;script&gt;</code> correspondientes en el orden que desees que el navegador los ejecute.</li>
-</ul>
-
-<h2 id="Comentarios">Comentarios</h2>
-
-<p>Al igual que con HTML y CSS, es posible escribir comentarios en tu código JavaScript que el navegador ignorará y que existen simplemente para proporcionar instrucciones a tus compañeros desarrolladores sobre cómo funciona el código (y a ti, si regresas a tu código después de seis meses y no puedes recordar lo que hiciste). Los comentarios son muy útiles y deberías utilizarlos con frecuencia, especialmente para aplicaciones grandes. Hay dos tipos:</p>
-
-<ul>
- <li>Un comentario de una sola línea se escribe después de una doble barra inclinada (//), p. ej.
-  <pre class="brush: js notranslate">// soy un comentario</pre>
- </li>
- <li>Se escribe un comentario de varias líneas entre las cadenas /* y */, p. ej.
-  <pre class="brush: js notranslate">/*
-  Yo también soy
-  un comentario
-*/</pre>
- </li>
-</ul>
-
-<p>Entonces, por ejemplo, podríamos anotar el JavaScript de nuestra última demostración con comentarios como este:</p>
-
-<pre class="brush: js notranslate">// Función: crea un nuevo párrafo y lo agrega al final del cuerpo HTML.
-
-function createParagraph() {
-  let para = document.createElement('p');
-  para.textContent = 'You clicked the button!';
-  document.body.appendChild(para);
-}
-
-/*
-  1. Obtiene referencias de todos los botones de la página en un formato de arreglo.
-  2. Recorre todos los botones y agrega un detector de eventos 'click' a cada uno.
-
-  Cuando se presione cualquier botón, se ejecutará la función createParagraph().
-*/
-
-const buttons = document.querySelectorAll('button');
-
-for (let i = 0; i &lt; buttons.length ; i++) {
-  buttons[i].addEventListener('click', createParagraph);
-}</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: En general, más comentarios suelen ser mejor que menos, pero debes tener cuidado si agregas muchos comentarios para explicar qué son las variables (los nombres de tus variables tal vez deberían ser más intuitivos), o para explicar operaciones muy simples (tal vez tu código sea demasiado complicado).</p>
-</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Así que ahí tienes, tu primer paso en el mundo de JavaScript. Comenzamos solo con teoría, para comenzar a acostumbrarte a por qué usarías JavaScript y qué tipo de cosas puedes hacer con él. En el camino, viste algunos ejemplos de código y aprendiste cómo encaja JavaScript con el resto del código en tu sitio web, entre otras cosas.</p>
-
-<p>JavaScript puede parecer un poco abrumador en este momento, pero no te preocupes — en este curso, te guiaremos en pasos simples que tendrán sentido en el futuro. En el próximo artículo, <a href="/es/docs/Learn/JavaScript/Introduction_to_JavaScript_1/A_first_splash">nos sumergiremos directamente en lo práctico</a>, lo que te permitirá comenzar directamente y crear tus propios ejemplos de JavaScript.</p>
-
-<ul>
-</ul>
-
-<p>{{NextMenu("Learn/JavaScript/First_steps/A_first_splash", "Learn/JavaScript/First_steps")}}</p>
-
-<h2 id="En_este_modulo">En este modulo</h2>
-
-<ul>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/What_is_JavaScript">¿Qué es JavaScript?</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Primer contacto con JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/What_went_wrong">¿Qué salió mal? Solución de problemas de JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Variables">Almacenamiento de la información que necesita — Variables</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Math">Matemáticas básicas en JavaScript — números y operadores</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejo de texto — cadenas en JavaScript</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Useful_string_methods">Métodos de cadena útiles</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Arrays">Arreglos</a></li>
- <li><a href="/es/docs/Learn/JavaScript/First_steps/Silly_story_generator">Evaluación: Generador de historias tontas</a></li>
-</ul>
diff --git a/files/es/learn/javascript/first_steps/silly_story_generator/index.html b/files/es/learn/javascript/first_steps/silly_story_generator/index.html
new file mode 100644
index 0000000000..c3b7d16dfe
--- /dev/null
+++ b/files/es/learn/javascript/first_steps/silly_story_generator/index.html
@@ -0,0 +1,148 @@
+---
+title: Generador de historias absurdas
+slug: Learn/JavaScript/First_steps/Silly_story_generator
+tags:
+  - Arreglos
+  - Cadenas
+  - JavaScript
+  - Numeros
+  - Principiante
+translation_of: Learn/JavaScript/First_steps/Silly_story_generator
+original_slug: Learn/JavaScript/First_steps/Generador_de_historias_absurdas
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenu("Learn/JavaScript/First_steps/Arrays", "Learn/JavaScript/First_steps")}}</div>
+
+<p class="summary"></p>
+
+<p class="summary">En esta evaluación, deberás tomar parte del conocimiento que has aprendido en los artículos de este módulo y aplicarlo a la creación de una aplicación divertida que genere historias aleatorias. ¡Que te diviertas!</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Antes de intentar esta evaluación, deberías haber revisado todos los artículos de este módulo.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Probar la comprensión de los fundamentos de JavaScript, como variables, números, operadores, cadenas y matrices</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Punto_de_partida">Punto de partida</h2>
+
+<p>Para iniciar esta evaluación, debe:</p>
+
+<ul>
+ <li>Vaya y <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/assessment-start/index.html">tome el archivo HTML</a> para el ejemplo y guarde una copia local de este como <code>index.html</code> en un directorio nuevo en algún lugar de su computadora. Esto también tiene el CSS para estilizar el ejemplo que contiene.</li>
+ <li>Vaya a la <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/assessment-start/raw-text.txt">página que contiene el texto sin procesar</a> y manténgalo abierto en una pestaña separada del navegador en algún lugar. Lo necesitarás más tarde.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Alternativamente, puede usar un sitio como <a class="external external-icon" href="http://jsbin.com/">JSBin</a> o <a class="external external-icon" href="https://thimble.mozilla.org/">Thimble</a> para hacer su evaluación. Puede pegar el HTML, CSS y JavaScript en uno de estos editores en línea. Si el editor en línea que está utilizando no tiene un panel de JavaScript separado, no dude en colocarlo en línea en un elemento <code>&lt;script&gt;</code> dentro de la página HTML.</p>
+</div>
+
+<h2 id="Resumen_del_proyecto">Resumen del proyecto</h2>
+
+<p>Se le han proporcionado algunos HTML / CSS en bruto y algunas cadenas de texto y funciones de JavaScript; necesita escribir el JavaScript necesario para convertir esto en un programa de trabajo, que hace lo siguiente:</p>
+
+<ul>
+ <li>Genera una historia tonta cuando se presiona el botón "Generar historia aleatoria".</li>
+ <li>Reemplaza el nombre predeterminado "Bob" en la historia con un nombre personalizado, solo si se ingresa un nombre personalizado en el campo de texto "Ingresar nombre personalizado" antes de presionar el botón Generar.</li>
+ <li>Convierte las cantidades y unidades de peso y temperatura predeterminadas de los EE. UU. En la historia en equivalentes del Reino Unido del botón de opción del Reino Unido, antes de presionar el botón de generar.</li>
+ <li>Generará otra historia tonta al azar si presionas el botón otra vez (y otra vez ...)</li>
+</ul>
+
+<p>La siguiente captura de pantalla muestra un ejemplo de lo que debería producir el programa terminado:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/16178/Screen_Shot_2018-09-19_at_10.01.38_AM.png" style="border-style: solid; border-width: 1px; display: block; height: 404px; margin: 0px auto; width: 500px;"></p>
+
+<p>Para darle más idea, eche un vistazo al ejemplo final (¡no mire el código fuente!)</p>
+
+<h2 id="Etapas_para_completar">Etapas para completar</h2>
+
+<p>En las siguientes secciones se describe lo que hay que hacer.</p>
+
+<p>Configuración básica:</p>
+
+<ol>
+ <li>Crear un nuevo archivo llamado <code>main.js</code>, en el mismo directorio que tu archivo <code>index.html</code>.</li>
+ <li>Aplicar el archivo JavaScript externo a tu HTML insertando un elemento {{htmlelement("script")}} en tu HTML haciendo referencia a <code>main.js</code>. Póngalo justo antes de la etiquette de cierra <code>&lt;/body&gt;</code>.</li>
+</ol>
+
+<p>Variables y funciones iniciales:</p>
+
+<ol>
+ <li>en el archivo de texto sin procesar, copia todo el código bajo el encabezado "1. COMPLETE VARIABLE AND FUNCTION DEFINITIONS" y pégalo en la parte superior del archivo main.js. Esto te dará tres variables que almacenan las referencias al campo de texto "Enter custom name" (<code>customName</code>), el botón "Generate random story" (<code>randomize</code>), y el elemento {{htmlelement("p")}} al fondo del cuerpo HTML en el que la historia será copiada en (<code>story</code>), respectivamente. Además, obtendrás una funcion llamada <code>randomValueFromArray()</code> que toma un array, y devuelve uno de los items guardados dentro del array al azar.</li>
+ <li>Ahora observa la segunda sección del archivo de texto sin procesar — "2. RAW TEXT STRINGS". Esta contiene cadenas de texto que actuarán como entrada en nuestro programa. Nos gustaría que mantengas estas variables internas dentro del archivo <code>main.js</code>:
+  <ol>
+   <li>Almacena la primera, la más larga, cadena de texto dentro de una variable llamada <code>storyText</code>.</li>
+   <li>Almacena el primer conjunto de tres cadenas dentro de un array llamado <code>insertX</code>.</li>
+   <li>Almacena el segundo conjunto de tres cadenas dentro de un array llamado <code>insertY</code>.</li>
+   <li>Almacena el tercer conjunto de tres cadenas dentro de un array llamado <code>insertZ</code>.</li>
+  </ol>
+ </li>
+</ol>
+
+<p>Colocar el controlador de evento y la función incompleta:</p>
+
+<ol>
+ <li>Ahora regresa al archivo de texto sin procesar.</li>
+ <li>Copia el código encontrado bajo el encabezado "3. EVENT LISTENER AND PARTIAL FUNCTION DEFINITION" y pégalo al fondo de tu archivo <code>main.js</code> . Esto:
+  <ul>
+   <li>Añade un detector de eventos a la variable <code>randomize</code>, de manera que cuando al botón que esta representa se le haya dado un click, la función <code>result()</code> funcione.</li>
+   <li>Añade una definición de la función parcialmente completada <code>result()</code> a tu código. Por el resto de la evaluación, deberás llenar en líneas dentro de esta función para completarla y hacer que trabaje adecuadamente.</li>
+  </ul>
+ </li>
+</ol>
+
+<p>Completando la función <code>result()</code>:</p>
+
+<ol>
+ <li>Crear una nueva variable llamada <code>newStory</code>, y establezca su valor igual a <code>storyText</code>. Esto es necesario para que podamos crear una nueva historia aleatoria cada vez que se presiona el botón y se ejecuta la función. Si hiciéramos cambios directamente en <code>storyText</code>, solo podríamos generar una nueva historia una vez.</li>
+ <li>Crear tres nuevas variables llamadas <code>xItem</code>, <code>yItem</code>, y <code>zItem</code>, y tienes que igualar cada variable llamando a <code>randomValueFromArray()</code> en sus tres matrices (el resultado en cada caso será un elemento aleatorio de cada matriz en la que se llama). Por ejemplo, puede llamar a la función y hacer que devuelva una cadena aleatoria de  <code>insertX</code> escribiendo <code>randomValueFromArray(insertX)</code>.</li>
+ <li>A continuación, queremos reemplazar los tres marcadores de posición en la cadena <code>newStory</code> — <code>:insertx:</code>, <code>:inserty:</code>, y <code>:insertz:</code> — con las cadenas almacenadas en <code>xItem</code>, <code>yItem</code>, y <code>zItem</code>. Hay un método de string en particular que lo ayudará aquí: en cada caso, haga que la llamada al método sea igual a <code>newStory</code> de modo que cada vez que se llame, <code>newStory</code> se iguale a sí mismo, pero con sustituciones. Entonces, cada vez que se presiona el botón, estos marcadores de posición se reemplazan con una cadena absurda aleatoria. Como sugerencia adicional, el método en cuestión solo reemplaza la primera instancia de la subcadena que encuentra, por lo que es posible que deba realizar una de las llamadas dos veces.</li>
+ <li>Dentro del primer bloque <code>if</code>, agregue otra llamada al método de reemplazo de cadena para reemplazar el nombre 'Bob' que se encuentra en la cadena <code>newStory</code> con la variable de <code>name</code>. En este bloque estamos diciendo "Si se ingresó un valor en la entrada de texto <code>customName</code>  reemplace a Bob en la historia con ese nombre personalizado."</li>
+ <li>Dentro del segundo bloque <code>if</code>, se esta verificando si se ha seleccionado el botón de opción <code>uk</code>  Si es así, queremos convertir los valores de peso y temperatura en la historia de libras and Fahrenheit a stones and grados centígrados. Lo que debe hacer es lo siguiente:
+  <ol>
+   <li>Busque las fórmulas para convertir libras a stone, and Fahrenheit en grados centígrados.</li>
+   <li>Dentro de la línea que define la variable de <code>weight</code>, reemplace 300 con un cálculo que convierta 300 libras en stones. Concatenar <code>'stone'</code> al final del resultado de la llamada <code>Math.round()</code>.</li>
+   <li>Al lado de la línea que define la variable de <code>temperature</code>, reemplace 94 con un cálculo que convierta 94 Fahrenheit en centígrados. Concatenar <code>'centigrade'</code> al final del resultado de la llamada <code>Math.round()</code>.</li>
+   <li>Justo debajo de las dos definiciones de variables, agregue dos líneas de reemplazo de cadena más que reemplacen '94 fahrenheit 'con el contenido de la variable de <code>temperature</code>, y  '300 libras' con el contenido de la variable de <code>weight</code>.</li>
+  </ol>
+ </li>
+ <li>Finalmente, en la penúltima línea de la función, haga que la propiedad <code>textContent</code> de la variable de la <code>story</code> (que hace referencia al párrafo) sea igual a <code>newStory</code>.</li>
+</ol>
+
+<h2 id="Claves_y_pistas">Claves y pistas</h2>
+
+<ul>
+ <li>No necesitas modificar el HTML, salvo para incrustar el JavaScript a tu HTML.</li>
+ <li>Si no estás seguro si el JavaScript está siendo aplicado adecuadamente a tu HTML, intenta remover temporalmente todo el codigo del archivo JavaScript, agregar una instruccion simple que sabes que tendrá un efecto obvio, luego guarda y actualiza. El siguiente ejemplo cambia el fondo de {{htmlelement("html")}} - así la ventana se verá completamente roja si el JavaScript está siendo aplicado adecuadamente.:
+  <pre class="brush: js notranslate">document.querySelector('html').style.backgroundColor = 'red';</pre>
+ </li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/round">Math.round()</a> es un método JavaScript integrado que simplemente redondea el resultado de un cálculo al número entero más cercano.</li>
+ <li>Hay tres casos de cadenas que deben reemplazarse. Puede repetir el método <code>replace()</code> varias veces o puede utilizar expresiones regulares. Por ejemplo, <code>let text = 'I am the biggest lover, I love my love'; text.replace(/love/g,'like');</code> Reemplazará todas las instancias de 'love' a 'like'. Recuerde, las cuerdas son inmutables.</li>
+</ul>
+
+<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
+
+<p>Si está siguiendo esta evaluación como parte de un curso organizado, debería poder entregar su trabajo a su profesor/mentor para que lo califique. Si está aprendiendo por ti mismo, puede obtener la guía de calificación con bastante facilidad preguntando en el hilo de <a href="https://discourse.mozilla.org/t/silly-story-generator-assessment/24686">discussion thread for this exercise</a>, o en el canal de IRC <a href="irc://irc.mozilla.org/mdn">#mdn</a> en <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>. Pruebe el ejercicio primero: ¡no se gana nada haciendo trampa!</p>
+
+<p>{{PreviousMenu("Learn/JavaScript/First_steps/Arrays", "Learn/JavaScript/First_steps")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Qu%C3%A9_es_JavaScript">¿Qué es JavaScript?</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Un primer acercamiento a JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/What_went_wrong">What went wrong? Corrigiendo JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Variables">Almacenando la información que necesitas - Variables</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Matem%C3%A1ticas">Matemáticas básicas en JavaScript — números y operadores</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejando el texto - cadenas en JavaScript</a></li>
+ <li><a href="/es/docs/Glossary/Arreglos">Métodos útiles con cadenas</a></li>
+ <li><a href="/es/docs/Glossary/Arreglos">Arreglos (matrices)</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/First_steps/Silly_story_generator">Evaluación: Generador de hisorias alocadas</a></li>
+</ul>
diff --git a/files/es/learn/javascript/first_steps/test_your_skills_colon__strings/index.html b/files/es/learn/javascript/first_steps/test_your_skills_colon__strings/index.html
new file mode 100644
index 0000000000..05bd91d296
--- /dev/null
+++ b/files/es/learn/javascript/first_steps/test_your_skills_colon__strings/index.html
@@ -0,0 +1,123 @@
+---
+title: 'Prueba tus habilidades: Strings'
+slug: Learn/JavaScript/First_steps/Test_your_skills:_Strings
+tags:
+  - Cadenas
+  - JavaScript
+  - Novato
+  - Principiante
+  - Prueba tus habilidades
+  - aprende
+  - strings
+translation_of: Learn/JavaScript/First_steps/Test_your_skills:_Strings
+original_slug: Learn/JavaScript/First_steps/Prueba_tus_habilidades:_Strings
+---
+<div>{{learnsidebar}}</div>
+
+<p>El objetivo de esta prueba de habilidad es evaluar si has entendido nuestros artículos <a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejo de texto — cadenas en JavaScript</a> y <a href="/es/docs/Learn/JavaScript/First_steps/Useful_string_methods">Métodos de cadena útiles</a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puedes probar las soluciones en los editores interactivos a continuación, sin embargo, puede ser útil descargar el código y usar una herramienta en línea como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a>, o <a href="https://glitch.com/">Glitch</a> para trabajar en las tareas.<br>
+ <br>
+ Si te quedas atascado, pídenos ayuda — consulta la sección {{anch("Evaluación o ayuda adicional")}} en la parte inferior de esta página.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: En los siguientes ejemplos, si hay un error en tu código, se mostrará en el panel de resultados de la página, para ayudarte a intentar averiguar la respuesta (o en la consola JavaScript del navegador, en el caso de la versión descargable).</p>
+</div>
+
+<h2 id="Cadenas_1">Cadenas 1</h2>
+
+<p>En nuestra primera tarea de cadenas, comenzaremos con algo pequeño. Ya tienes la mitad de una cita famosa dentro de una variable llamada <code>quoteStart</code>; nos gustaría que:</p>
+
+<ol>
+ <li>Busques la otra mitad de la cita y la agregues al ejemplo dentro de una variable llamada <code>quoteEnd</code>.</li>
+ <li>Concatenes las dos cadenas para hacer una sola cadena que contenga la cita completa. Guardes el resultado dentro de una variable llamada <code>finalQuote</code>.</li>
+</ol>
+
+<p>Verás que obtienes un error en este punto. ¿Puedes solucionar el problema con <code>quoteStart</code> para que la cita completa se muestre correctamente?</p>
+
+<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings1.html", '100%', 400)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings1-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Cadenas_2">Cadenas 2</h2>
+
+<p>En esta tarea, se te proporcionan dos variables, <code>quote</code> y <code>substring</code>, que contienen dos cadenas. Nos gustaría que:</p>
+
+<ol>
+ <li>Recuperes la longitud de la cita y la guardes en una variable llamada <code>quoteLength</code>.</li>
+ <li>Busques la posición del índice donde aparece <code>substring</code> en <code>quote</code>, y almacenes ese valor en una variable llamada <code>index</code>.</li>
+ <li>Uses una combinación de las variables que tienes y las propiedades/métodos de cadena disponibles para recortar la cita original a "No me gustan los huevos verdes y el jamón", y la guardes en una variable llamada <code>revisedQuote</code>.</li>
+</ol>
+
+<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings2.html", '100%', 400)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings2-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Cadenas_3">Cadenas 3</h2>
+
+<p>En la siguiente tarea de cadenas, se te da la misma cita con la que terminaste en la tarea anterior, ¡pero está algo rota! Queremos que la arregles y actualices, así:</p>
+
+<ol>
+ <li>Cambia la letra mayúscula para corregir con mayúscula inicial la oración (todo en minúsculas, excepto la primera letra mayúscula). Almacena la nueva cita en una variable llamada <code>fixedQuote</code>.</li>
+ <li>En <code>fixedQuote</code>, reemplaza "huevos verdes con jamón" con otro alimento que realmente no te guste.</li>
+ <li>Hay una pequeña solución más por hacer: agrega un punto al final de la cita y guarda la versión final en una variable llamada <code>finalQuote</code>.</li>
+</ol>
+
+<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings3.html", '100%', 400)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings3-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Cadenas_4">Cadenas 4</h2>
+
+<p>En la tarea de cadena final, te hemos dado el nombre de un teorema, dos valores numéricos y una cadena incompleta (los bits que se deben agregar están marcados con asteriscos (<code>*</code>)). Queremos que cambies el valor de la cadena de la siguiente manera:</p>
+
+<ol>
+ <li>Cámbiala de un literal de cadena normal a una plantilla literal.</li>
+ <li>Reemplaza los cuatro asteriscos con cuatro marcadores de posición en la plantilla literal. Estos deben ser:
+  <ol>
+   <li>El nombre del teorema.</li>
+   <li>Los dos valores numéricos que tenemos.</li>
+   <li>La longitud de la hipotenusa de un triángulo rectángulo, dado que las longitudes de los otros dos lados son iguales a los dos valores que tenemos. Deberás buscar cómo calcular esto a partir de lo que tienes. Haz el cálculo dentro del marcador de posición.</li>
+  </ol>
+ </li>
+</ol>
+
+<p>Intenta actualizar el código en vivo a continuación para recrear el ejemplo terminado:</p>
+
+<p>{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/tasks/strings/strings4.html", '100%', 400)}}</p>
+
+<div class="blockIndicator note">
+<p><a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/tasks/strings/strings4-download.html">Descarga el punto de partida de esta tarea</a> para trabajar en tu propio editor o en un editor en línea.</p>
+</div>
+
+<h2 id="Evaluación_o_ayuda_adicional">Evaluación o ayuda adicional</h2>
+
+<p>Puedes practicar estos ejemplos en los editores interactivos anteriores.</p>
+
+<p>Si deseas que se evalúe tu trabajo o estás atascado y deseas pedir ayuda:</p>
+
+<ol>
+ <li>Coloca tu trabajo en un editor que se pueda compartir en línea, como <a href="https://codepen.io/">CodePen</a>, <a href="https://jsfiddle.net/">jsFiddle</a> o <a href="https://glitch.com/">Glitch</a>. Puedes escribir el código tú mismo o utilizar los archivos de punto de partida vinculados en las secciones anteriores.</li>
+ <li>Escribe una publicación solicitando evaluación y/o ayuda en la <a href="https://discourse.mozilla.org/c/mdn/learn">categoría de aprendizaje del foro de discusión de MDN</a>. Tu publicación debe incluir:
+  <ul>
+   <li>Un título descriptivo como "Se busca evaluación para la prueba de habilidad de Cadenas 1".</li>
+   <li>Detalles de lo que ya has probado y lo que te gustaría que hiciéramos, p. ej. si estás atascado y necesitas ayuda, o quiere una evaluación.</li>
+   <li>Un enlace al ejemplo que deseas evaluar o con el que necesitas ayuda, en un editor que se pueda compartir en línea (como se mencionó en el paso 1 anterior). Esta es una buena práctica para entrar — es muy difícil ayudar a alguien con un problema de codificación si no puedes ver su código.</li>
+   <li>Un enlace a la página de la tarea o evaluación real, para que podamos encontrar la pregunta con la que deseas ayuda.</li>
+  </ul>
+ </li>
+</ol>
diff --git a/files/es/learn/javascript/first_steps/what_is_javascript/index.html b/files/es/learn/javascript/first_steps/what_is_javascript/index.html
new file mode 100644
index 0000000000..f26d6116ea
--- /dev/null
+++ b/files/es/learn/javascript/first_steps/what_is_javascript/index.html
@@ -0,0 +1,437 @@
+---
+title: ¿Qué es JavaScript?
+slug: Learn/JavaScript/First_steps/What_is_JavaScript
+tags:
+  - APIs
+  - Aprender
+  - Artículo
+  - Añadir JavaScript
+  - Curso
+  - Dinámico
+  - En línea
+  - Gestores de JavaScript en linea
+  - JavaScript
+  - Navegador
+  - Núcleo
+  - Principiante
+  - comentários
+  - externo
+translation_of: Learn/JavaScript/First_steps/What_is_JavaScript
+original_slug: Learn/JavaScript/First_steps/Qué_es_JavaScript
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/JavaScript/First_steps/A_first_splash", "Learn/JavaScript/First_steps")}}</div>
+
+<p class="summary">¡Bienvenido al curso de JavaScript para principiantes de MDN! En este artículo veremos JavaScript desde un alto nivel, respondiendo preguntas como "¿Qué es?" y "¿Qué puedes hacer con él?", y asegúrate de estar cómodo con el propósito de JavaScript.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>Conocimientos básicos de informática, conocimientos básicos de HTML y CSS.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Familiarizarte con lo que es JavaScript, lo que puede hacer y cómo encaja en un sitio web.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Una_definición_de_alto_nivel">Una definición de alto nivel</h2>
+
+<p>JavaScript es un lenguaje de programación o de secuencias de comandos que te permite implementar funciones complejas en páginas web, cada vez que una página web hace algo más que sentarse allí y mostrar información estática para que la veas, muestra oportunas actualizaciones de contenido, mapas interactivos, animación de Gráficos 2D/3D, desplazamiento de máquinas reproductoras de vídeo, etc., puedes apostar que probablemente JavaScript está involucrado. Es la tercera capa del pastel de las tecnologías web estándar, dos de las cuales (<a href="/es/docs/Learn/HTML">HTML</a> y <a href="/es/docs/Learn/CSS">CSS</a>) hemos cubierto con mucho más detalle en otras partes del Área de aprendizaje.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13502/cake.png" style="display: block; margin: 0 auto;"></p>
+
+<ul>
+ <li>{{Glossary("HTML")}} es el lenguaje de marcado que usamos para estructurar y dar significado a nuestro contenido web, por ejemplo, definiendo párrafos, encabezados y tablas de datos, o insertando imágenes y videos en la página.</li>
+ <li>{{Glossary("CSS")}} es un lenguaje de reglas de estilo que usamos para aplicar estilo a nuestro contenido HTML, por ejemplo, establecer colores de fondo y tipos de letra, y distribuir nuestro contenido en múltiples columnas.</li>
+ <li>{{Glossary("JavaScript")}} es un lenguaje de secuencias de comandos que te permite crear contenido de actualización dinámica, controlar multimedia, animar imágenes y prácticamente todo lo demás. (Está bien, no todo, pero es sorprendente lo que puedes lograr con unas pocas líneas de código JavaScript).</li>
+</ul>
+
+<p>Las tres capas se superponen muy bien. Tomemos una etiqueta de texto simple como ejemplo. Podemos marcarla usando HTML para darle estructura y propósito:</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Player 1: Chris&lt;/p&gt;</pre>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13422/just-html.png" style="height: 28px; width: 108px;"></p>
+
+<p>Luego, podemos agregar algo de CSS a la mezcla para que se vea bien:</p>
+
+<pre class="brush: css notranslate">p {
+  font-family: 'helvetica neue', helvetica, sans-serif;
+  letter-spacing: 1px;
+  text-transform: uppercase;
+  text-align: center;
+  border: 2px solid rgba(0,0,200,0.6);
+  background: rgba(0,0,200,0.3);
+  color: rgba(0,0,200,0.6);
+  box-shadow: 1px 1px 2px rgba(0,0,200,0.4);
+  border-radius: 10px;
+  padding: 3px 10px;
+  display: inline-block;
+  cursor: pointer;
+}</pre>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13424/html-and-css.png" style="height: 48px; width: 187px;"></p>
+
+<p>Y finalmente, podemos agregar algo de JavaScript para implementar un comportamiento dinámico:</p>
+
+<pre class="brush: js notranslate">const para = document.querySelector('p');
+
+para.addEventListener('click', updateName);
+
+function updateName() {
+  let name = prompt('Enter a new name');
+  para.textContent = 'Player 1: ' + name;
+}
+</pre>
+
+<p>{{ EmbedLiveSample('A_high-level_definition', '100%', 80, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<p>Intenta hacer clic en esta última versión de la etiqueta de texto para ver qué sucede (ten en cuenta también que puedes encontrar esta demostración en GitHub — ¡consulta el <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/javascript-label.html">código fuente</a> o <a href="http://mdn.github.io/learning-area/javascript/introduction-to-js-1/what-is-js/javascript-label.html">ejecútalo en vivo</a>)!</p>
+
+<p>JavaScript puede hacer mucho más que eso — exploremos qué con más detalle.</p>
+
+<h2 id="Entonces_¿qué_puede_hacer_realmente">Entonces, ¿qué puede hacer realmente?</h2>
+
+<p>El núcleo del lenguaje JavaScript de lado del cliente consta de algunas características de programación comunes que te permiten hacer cosas como:</p>
+
+<ul>
+ <li>Almacenar valores útiles dentro de variables. En el ejemplo anterior, por ejemplo, pedimos que ingreses un nuevo nombre y luego almacenamos ese nombre en una variable llamada <code>name</code>.</li>
+ <li>Operaciones sobre fragmentos de texto (conocidas como "cadenas" (<code>strings</code>) en programación). En el ejemplo anterior, tomamos la cadena "<code>Player1</code>:" y la unimos a la variable <code>name</code> para crear la etiqueta de texto completa, p. ej. ''<code>Player1: Chris</code>".</li>
+ <li>Y ejecuta código en respuesta a ciertos eventos que ocurren en una página web. Usamos un evento {{Event("click")}} en nuestro ejemplo anterior para detectar cuándo se hace clic en el botón y luego ejecutar el código que actualiza la etiqueta de texto.</li>
+ <li>¡Y mucho más!</li>
+</ul>
+
+<p>Sin embargo, lo que aún es más emocionante es la funcionalidad construida sobre el lenguaje JavaScript de lado del cliente. Las denominadas <strong>interfaces de programación de aplicaciones</strong> (<strong>API</strong>) te proporcionan superpoderes adicionales para utilizar en tu código JavaScript.</p>
+
+<p>Las API son conjuntos de bloques de construcción de código listos para usar que permiten a un desarrollador implementar programas que de otro modo serían difíciles o imposibles de implementar. Hacen lo mismo para la programación que los kits de muebles prefabricados para la construcción de viviendas — es mucho más fácil tomar paneles precortados y atornillarlos para hacer una estantería que elaborar el diseño tú mismo, que ir y encontrar la madera correcta, cortar todos los paneles del tamaño y la forma correctos, buscar los tornillos del tamaño correcto y <em>luego</em> júntalos para hacer una estantería.</p>
+
+<p>Generalmente se dividen en dos categorías.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13508/browser.png" style="display: block; height: 511px; margin: 0px auto; width: 815px;"></p>
+
+<p>Las <strong>APIs del navegador</strong> están integradas en tu navegador web y pueden exponer datos del entorno informático circundante o realizar tareas complejas y útiles. Por ejemplo:</p>
+
+<ul>
+ <li>La {{domxref("Document_Object_Model", " API del DOM (<code>Document Object Model</code>)")}} te permite manipular HTML y CSS, crear, eliminar y cambiar el HTML, aplicar dinámicamente nuevos estilos a tu página, etc. Cada vez que ves aparecer una ventana emergente en una página, o se muestra algún nuevo contenido (como vimos anteriormente en nuestra sencilla demostración), por ejemplo, ese es el DOM en acción.</li>
+ <li>La {{domxref("Geolocalization", "API de Geolocalización")}} recupera información geográfica. Así es como <a href="https://www.google.com/maps">Google Maps</a> puede encontrar tu ubicación y trazarla en un mapa.</li>
+ <li>Las APIs {{domxref("Canvas_API", "Canvas")}} y {{domxref("WebGL_API", "WebGL")}} te permiten crear gráficos animados en 2D y 3D. Las personas están haciendo cosas increíbles con estas tecnologías web — consulta <a href="https://www.chromeexperiments.com">Experimentos de Chrome</a> y <a href="http://webglsamples.org/">webglsamples</a>.</li>
+ <li><a href="https://developer.mozilla.org/es/Apps/Fundamentals/Audio_and_video_delivery">APIs de audio y video</a> como {{domxref("HTMLMediaElement")}} y {{domxref("WebRTC API", "WebRTC")}} te permiten hacer cosas realmente interesantes con multimedia, como reproducir audio y video directamente en una página web, o tomar video de tu cámara web y mostrarlo en la computadora de otra persona (prueba nuestra sencilla <a href="http://chrisdavidmills.github.io/snapshot/">demostración instantánea</a> para hacerte una idea).</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Muchas de las demostraciones anteriores no funcionarán en un navegador antiguo — al experimentar, es una buena idea utilizar un navegador moderno como Firefox, Chrome, Edge u Opera para ejecutar tu código. Deberás considerar las <a href="/es/docs/Learn/Tools_and_testing/Cross_browser_testing">pruebas en varios navegadores</a> con más detalle cuando estés más cerca de entregar el código de producción (es decir, código real que usarán los clientes reales).</p>
+</div>
+
+<p>Las <strong>APIs de terceros</strong> no están integradas en el navegador de forma predeterminada y, por lo general, debes obtener su código e información de algún lugar de la Web. Por ejemplo:</p>
+
+<ul>
+ <li>La <a href="https://dev.twitter.com/overview/documentation">API de Twitter</a> te permite hacer cosas como mostrar tus últimos tweets en tu sitio web.</li>
+ <li>La <a href="https://developers.google.com/maps/">API de Google Maps</a> y la <a href="https://wiki.openstreetmap.org/wiki/API">API de OpenStreetMap</a> te permiten insertar mapas personalizados en tu sitio web y otras funciones similares.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: estas APIs son avanzadas y no cubriremos ninguna de ellas en este módulo. Puedes obtener más información sobre estas en nuestro <a href="/es/docs/Learn/JavaScript/Client-side_web_APIs">módulo de APIs web de lado del cliente</a>.</p>
+</div>
+
+<p>¡También hay mucho más disponible! Sin embargo, no te emociones demasiado todavía. No podrás crear el próximo Facebook, Google Maps o Instagram después de estudiar JavaScript durante 24 horas — hay muchos conceptos básicos que cubrir primero. Y es por eso que estás aquí — ¡sigamos adelante!</p>
+
+<h2 id="¿Qué_está_haciendo_JavaScript_en_tu_página">¿Qué está haciendo JavaScript en tu página?</h2>
+
+<p>Aquí, de hecho, comenzaremos a ver algo de código y, mientras lo hacemos, exploraremos lo que realmente sucede cuando ejecutas JavaScript en tu página.</p>
+
+<p>Recapitulemos brevemente sobre la historia de lo que sucede cuando cargas una página web en un navegador (de lo que hablamos por primera vez en nuestro artículo <a href="/es/Learn/CSS/Introduction_to_CSS/How_CSS_works#How_does_CSS_actually_work">Cómo funciona CSS</a>). Cuando cargas una página web en tu navegador, estás ejecutando tu código (HTML, CSS y JavaScript) dentro de un entorno de ejecución (la pestaña del navegador). Esto es como una fábrica que toma materias primas (el código) y genera un producto (la página web).</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13504/execution.png" style="display: block; margin: 0 auto;"></p>
+
+<p>Un uso muy común de JavaScript es modificar dinámicamente HTML y CSS para actualizar una interfaz de usuario, a través de la API del modelo de objetos del documento (como se mencionó anteriormente). Ten en cuenta que el código de tus documentos web generalmente se cargan y ejecutan en el orden en que aparece en la página. Si JavaScript se carga e intenta ejecutarse antes de que se hayan cargado el HTML y el CSS al que afecta, pueden producirse errores. Aprenderás formas de evitar esto más adelante en el artículo, en la sección <a href="/es/docs/Learn/JavaScript/First_steps/What_is_JavaScript#Script_loading_strategies">Estrategias de carga de scripts</a>.</p>
+
+<h3 id="Seguridad_del_navegador">Seguridad del navegador</h3>
+
+<p>Cada pestaña del navegador tiene su propio depósito separado para ejecutar código (estos depósitos se denominan "entornos de ejecución" en términos técnicos) — esto significa que, en la mayoría de los casos, el código de cada pestaña se ejecuta de forma completamente independiente y el código de una pestaña no puede afectar el código en otra pestaña, o en otro sitio web. Esta es una buena medida de seguridad — si este no fuera el caso, los piratas podrían comenzar a escribir código para robar información de otros sitios web y otras cosas muy malas.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Existen formas de enviar código y datos entre diferentes sitios web/pestañas de manera segura, pero estas son técnicas avanzadas que no cubriremos en este curso.</p>
+</div>
+
+<h3 id="Orden_de_ejecución_de_JavaScript">Orden de ejecución de JavaScript</h3>
+
+<p>Cuando el navegador encuentra un bloque de JavaScript, generalmente lo ejecuta en orden, de arriba a abajo. Esto significa que debes tener cuidado con el orden en el que colocas las cosas. Por ejemplo, volvamos al bloque de JavaScript que vimos en nuestro primer ejemplo:</p>
+
+<pre class="brush: js notranslate">const para = document.querySelector('p');
+
+para.addEventListener('click', updateName);
+
+function updateName() {
+  let name = prompt('Enter a new name');
+  para.textContent = 'Player 1: ' + name;
+}</pre>
+
+<p>Aquí seleccionamos un párrafo de texto (línea 1), luego adjuntamos un detector de eventos (línea 3) de modo que cuando se hace clic en el párrafo, el bloque de código <code>updateName()</code> (líneas 5-8) se ejecuta. El bloque de código <code>updateName()</code> (estos tipos de bloques de código reutilizables se denominan "funciones") pide al usuario un nuevo nombre y luego inserta ese nombre en el párrafo para actualizar la pantalla.</p>
+
+<p>Si cambiaras el orden de las dos primeras líneas de código, ya no funcionaría — en su lugar, obtendrías un error en la <a href="/es/docs/Learn/Common_questions/What_are_browser_developer_tools">consola del desarrollador del navegador</a> — <code>TypeError: para is undefined</code>. Esto significa que el objeto <code>para</code> aún no existe, por lo que no podemos agregarle un detector de eventos.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Este es un error muy común; debes tener cuidado de que los objetos a los que se hace referencia en tu código existan antes de intentar hacer algo con ellos.</p>
+</div>
+
+<h3 id="Código_interpretado_versus_compilado">Código interpretado versus compilado</h3>
+
+<p>Es posible que escuches los términos <strong>interpretados</strong> y <strong>compilados</strong> en el contexto de la programación. En los lenguajes interpretados, el código se ejecuta de arriba a abajo y el resultado de ejecutar el código se devuelve inmediatamente. No tienes que transformar el código en una forma diferente antes de que el navegador lo ejecute. El código se recibe en su forma de texto amigable para el programador y se procesa directamente desde allí.</p>
+
+<p>Los lenguajes compilados, por otro lado, se transforman (compilan) a código máquina antes de que sean ejecutados por la computadora. Por ejemplo, C/C++ se compila a código máquina que luego ejecuta la computadora. El programa se ejecuta desde un formato binario, que se generó a partir del código fuente del programa original.</p>
+
+<p>JavaScript es un lenguaje de programación interpretado ligero. El navegador web recibe el código JavaScript en su forma de texto original y ejecuta el script a partir de ahí. Desde un punto de vista técnico, la mayoría de los intérpretes de JavaScript modernos utilizan una técnica llamada <strong>compilación en tiempo real</strong> para mejorar el rendimiento; el código fuente de JavaScript se compila en un formato binario más rápido mientras se usa el script, de modo que se pueda ejecutar lo más rápido posible. Sin embargo, JavaScript todavía se considera un lenguaje interpretado, ya que la compilación se maneja en el entorno de ejecución, en lugar de antes.</p>
+
+<p>Ambos tipos de lenguaje tienen ventajas, pero no las abordaremos ahora.</p>
+
+<h3 id="Código_de_lado_del_servidor_versus_de_lado_del_cliente">Código de lado del servidor versus de lado del cliente</h3>
+
+<p>También puedes escuchar los términos código <strong>de lado del servidor</strong> y <strong>de lado del cliente</strong>, especialmente en el contexto del desarrollo web. El código de lado del cliente es un código que se ejecuta en la computadora del usuario — cuando se ve una página web, el código de lado del cliente de la página se descarga, luego se ejecuta y se muestra en el navegador. En este módulo estamos hablando explícitamente de <strong>JavaScript de lado del cliente</strong>.</p>
+
+<p>El código de lado del servidor, por otro lado, se ejecuta en el servidor, luego sus resultados se descargan y se muestran en el navegador. Ejemplos de lenguajes web populares de lado del servidor incluyen a ¡PHP, Python, Ruby, ASP.NET y... JavaScript! JavaScript también se puede utilizar como lenguaje de lado del servidor, por ejemplo, en el popular entorno Node.js — puedes obtener más información sobre JavaScript de lado del servidor en nuestro tema <a href="/es/docs/Learn/Server-side">Sitios web dinámicos — Programación de lado del servidor</a>.</p>
+
+<h3 id="Código_dinámico_versus_estático">Código dinámico versus estático</h3>
+
+<p>La palabra <strong>dinámico</strong> se usa para describir tanto a JavaScript de lado del cliente como a los lenguajes de lado del servidor — se refiere a la capacidad de actualizar la visualización de una página web/aplicación para mostrar diferentes cosas en diferentes circunstancias, generando contenido nuevo según sea necesario. El código de lado del servidor genera dinámicamente nuevo contenido en el servidor, p. ej. extraer datos de una base de datos, mientras que JavaScript de lado del cliente genera dinámicamente nuevo contenido dentro del navegador del cliente, p. ej. creando una nueva tabla HTML, llenándola con los datos solicitados al servidor y luego mostrando la tabla en una página web que se muestra al usuario. El significado es ligeramente diferente en los dos contextos, pero relacionado, y ambos enfoques (de lado del servidor y de lado del cliente) generalmente funcionan juntos.</p>
+
+<p>Una página web sin contenido que se actualiza dinámicamente se denomina <strong>estática</strong> — simplemente muestra el mismo contenido todo el tiempo.</p>
+
+<h2 id="¿Cómo_agregas_JavaScript_a_tu_página">¿Cómo agregas JavaScript a tu página?</h2>
+
+<p>JavaScript se aplica a tu página HTML de manera similar a CSS. Mientras que CSS usa elementos {{htmlelement("link")}} para aplicar hojas de estilo externas y elementos {{htmlelement("style")}} para aplicar hojas de estilo internas a HTML, JavaScript solo necesita un amigo en el mundo de HTML: el elemento {htmlelement("script")}}. Aprendamos cómo funciona esto.</p>
+
+<h3 id="JavaScript_interno">JavaScript interno</h3>
+
+<ol>
+ <li>En primer lugar, haz una copia local de nuestro archivo de ejemplo <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/apply-javascript.html">apply-javascript.html</a>. Guárdalo en un directorio en algún lugar accesible.</li>
+ <li>Abre el archivo en tu navegador web y en tu editor de texto. Verás que el HTML crea una página web simple que contiene un botón en el que se puede hacer clic.</li>
+ <li>A continuación, ve a tu editor de texto y agrega lo siguiente en tu <code>head</code>, justo antes de tu etiqueta de cierre <code>&lt;/head&gt;</code>:
+  <pre class="brush: html notranslate">&lt;script&gt;
+
+  // JavaScript va aquí
+
+&lt;/script&gt;</pre>
+ </li>
+ <li>Ahora agregaremos algo de JavaScript dentro de nuestro elemento {{htmlelement("script")}} para que la página haga algo más interesante — agrega el siguiente código justo debajo de la línea "// El código JavaScript va aquí":
+  <pre class="brush: js notranslate">document.addEventListener("DOMContentLoaded", function() {
+  function createParagraph() {
+    let para = document.createElement('p');
+    para.textContent = 'You clicked the button!';
+    document.body.appendChild(para);
+  }
+
+  const buttons = document.querySelectorAll('button');
+
+  for(let i = 0; i &lt; buttons.length ; i++) {
+    buttons[i].addEventListener('click', createParagraph);
+  }
+});</pre>
+ </li>
+ <li>Guarda tu archivo y actualiza el navegador — ahora deberías ver que cuando haces clic en el botón, se genera un nuevo párrafo y se coloca debajo.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Si tu ejemplo no parece funcionar, sigue los pasos nuevamente y verifica que hiciste todo bien. ¿Guardaste tu copia local del código de inicio como un archivo <code>.html</code>? ¿Agregaste tu elemento {{htmlelement("script")}} justo antes de la etiqueta <code>&lt;/head&gt;</code>? ¿Ingresaste el JavaScript exactamente como se muestra? <strong>JavaScript distingue entre mayúsculas y minúsculas y es muy exigente, por lo que debes ingresar la sintaxis exactamente como se muestra; de lo contrario, es posible que no funcione.</strong></p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes ver esta versión en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/apply-javascript-internal.html">apply-javascript-internal.html</a> o (<a href="http://mdn.github.io/learning-area/javascript/introduction-to-js-1/what-is-js/apply-javascript-internal.html">verla en vivo también</a>).</p>
+</div>
+
+<h3 id="JavaScript_externo">JavaScript externo</h3>
+
+<p>Esto funciona muy bien, pero ¿y si quisiéramos poner nuestro JavaScript en un archivo externo? Exploremos esto ahora.</p>
+
+<ol>
+ <li>Primero, crea un nuevo archivo en el mismo directorio que tu archivo HTML del ejemplo. Como nombre ponle <code>script.js</code>; asegúrate de que el nombre tenga la extensión <code>.js</code>, ya que así es como se reconoce como JavaScript.</li>
+ <li>Reemplaza tu elemento {{htmlelement("script")}} actual con lo siguiente:
+  <pre class="brush: html notranslate">&lt;script src="script.js" defer&gt;&lt;/script&gt;</pre>
+ </li>
+ <li>Dentro de <code>script.js</code>, agrega el siguiente script:
+  <pre class="brush: js notranslate">function createParagraph() {
+  let para = document.createElement('p');
+  para.textContent = 'You clicked the button!';
+  document.body.appendChild(para);
+}
+
+const buttons = document.querySelectorAll('button');
+
+for(let i = 0; i &lt; buttons.length ; i++) {
+  buttons[i].addEventListener('click', createParagraph);
+}</pre>
+ </li>
+ <li>Guarda y actualiza tu navegador, ¡y deberías ver lo mismo! Funciona igual, pero ahora tenemos nuestro JavaScript en un archivo externo. Por lo general, esto es bueno en términos de organización de tu código y para hacerlo reutilizable en varios archivos HTML. Además, el HTML es más fácil de leer sin grandes trozos de script en él.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes ver esta versión en GitHub como <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/apply-javascript-external.html">apply-javascript-external.html</a> y <a href="https://github.com/mdn/learning-area/blob/master/javascript/introduction-to-js-1/what-is-js/script.js">script.js</a> (<a href="http://mdn.github.io/learning-area/javascript/introduction-to-js-1/what-is-js/apply-javascript-external.html">verla en vivo también</a>).</p>
+</div>
+
+<h3 id="Controladores_de_JavaScript_en_línea">Controladores de JavaScript en línea</h3>
+
+<p>Ten en cuenta que a veces te encontrarás con fragmentos de código JavaScript real dentro de HTML. Podría verse algo similar a esto:</p>
+
+<div id="inline_js_example">
+<pre class="brush: js example-bad notranslate">function createParagraph() {
+  let para = document.createElement('p');
+  para.textContent = 'You clicked the button!';
+  document.body.appendChild(para);
+}</pre>
+
+<pre class="brush: html example-bad notranslate">&lt;button onclick="createParagraph()"&gt;Click me!&lt;/button&gt;</pre>
+</div>
+
+<p>Puedes probar esta versión de nuestra demostración a continuación.</p>
+
+<p>{{ EmbedLiveSample('inline_js_example', '100%', 150, "", "", "hide-codepen-jsfiddle") }}</p>
+
+<p>Esta demostración tiene exactamente la misma funcionalidad que en las dos secciones anteriores, excepto que el elemento {{htmlelement("button")}} incluye un controlador <code>onclick</code> en línea para que la función se ejecute cuando se presiona el botón .</p>
+
+<p><strong>Sin embargo, no hagas esto</strong>. Es una mala práctica contaminar tu HTML con JavaScript, y es ineficiente; tendrías que incluir el atributo <code>onclick="createParagraph()"</code> en cada botón al que desees que se aplique JavaScript.</p>
+
+<p>El uso de una construcción de JavaScript pura te permite seleccionar todos los botones usando una instrucción. El código que usamos anteriormente para cumplir este propósito se ve así:</p>
+
+<pre class="brush: js notranslate">const buttons = document.querySelectorAll('button');
+
+for(let i = 0; i &lt; buttons.length ; i++) {
+  buttons[i].addEventListener('click', createParagraph);
+}</pre>
+
+<p>Esto puede ser un poco más largo que el atributo <code>onclick</code>, pero funcionará para todos los botones, sin importar cuántos haya en la página, ni cuántos se agreguen o eliminen. No es necesario cambiar el JavaScript.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Intenta editar tu versión de <code>apply-javascript.html</code> y agrega algunos botones más en el archivo. Cuando la vuelvas a cargar, deberías encontrar que todos los botones al hacer clic crearán un párrafo. Limpio, ¿eh?</p>
+</div>
+
+<h3 id="Estrategias_para_la_carga_de_scripts">Estrategias para la carga de scripts</h3>
+
+<p>Hay una serie de problemas relacionados con la carga de los scripts en el momento adecuado. ¡Nada es tan simple como parece! Un problema común es que todo el HTML de una página se carga en el orden en que aparece. Si estás utilizando JavaScript para manipular elementos en la página (o exactamente, el <a href="/es/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents#The_document_object_model">Modelo de objetos del documento</a>), tu código no funcionará si el JavaScript se carga y procesa antes que el HTML que estás intentando haga algo.</p>
+
+<p>En los ejemplos de código anteriores, en los ejemplos internos y externos, JavaScript se carga y se ejecuta en el encabezado del documento, antes de analizar el cuerpo HTML. Esto podría causar un error, por lo que hemos utilizado algunas construcciones para solucionarlo.</p>
+
+<p>En el ejemplo interno, puedes ver esta estructura alrededor del código:</p>
+
+<pre class="brush: js notranslate">document.addEventListener("DOMContentLoaded", function() {
+  ...
+});</pre>
+
+<p>Este es un detector de eventos, que escucha el evento "DOMContentLoaded" del navegador, lo cual significa que el cuerpo HTML está completamente cargado y analizado. El JavaScript dentro de este bloque no se ejecutará hasta que se active ese evento, por lo que se evita el error (<a href="/es/docs/Learn/JavaScript/Building_blocks/Events">aprenderás sobre los eventos</a> más adelante en el curso).</p>
+
+<p>En el ejemplo externo, usamos una función de JavaScript más moderno para resolver el problema, el atributo <code>defer</code>, que le dice al navegador que continúe descargando el contenido HTML una vez que se ha alcanzado la etiqueta del elemento <code>&lt;script&gt;</code>.</p>
+
+<pre class="brush: js notranslate">&lt;script src="script.js" defer&gt;&lt;/script&gt;</pre>
+
+<p>En este caso, tanto el script como el HTML se cargarán simultáneamente y el código funcionará.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: En el caso externo, no necesitamos usar el evento <code>DOMContentLoaded</code> porque el atributo <code>defer</code> nos resolvió el problema. No usamos la solución <code>defer</code> para el ejemplo interno de JavaScript porque <code>defer</code> solo funciona para scripts externos.</p>
+</div>
+
+<p>Una solución pasada de moda a este problema solía ser colocar tu elemento <code>script</code> justo en la parte inferior del cuerpo (por ejemplo, justo antes de la etiqueta <code>&lt;/body&gt;</code>), para que se cargara después de haber procesado todo el HTML. El problema con esta solución es que la carga/procesamiento del script está completamente bloqueado hasta que se haya cargado el DOM HTML. En sitios muy grandes con mucho JavaScript, esto puede causar un importante problema de rendimiento y ralentizar tu sitio.</p>
+
+<h4 id="async_y_defer"><code>async</code> y <code>defer</code></h4>
+
+<p>En realidad, hay dos modernas características que podemos usar para evitar el problema del bloqueo de <code>script</code>: <code>async</code> y <code>defer</code> (que vimos anteriormente). Veamos la diferencia entre estas dos.</p>
+
+<p>Los scripts cargados con el atributo <code>async</code> (ve más abajo) descargarán el <code>script</code> sin bloquear el renderizado de la página y lo ejecutará tan pronto como el <code>script</code> se termine de descargar. No tienes garantía de que los <code>script</code>s se ejecuten en un orden específico, solo que no detendrán la visualización del resto de la página. Es mejor usar <code>async</code> cuando los <code>script</code>s de la página se ejecutan de forma independiente y no dependen de ningún otro <code>script</code> de la página.</p>
+
+<p>Por ejemplo, si tienes los siguientes elementos <code>script</code>:</p>
+
+<pre class="brush: html notranslate">&lt;script async src="js/vendor/jquery.js"&gt;&lt;/script&gt;
+
+&lt;script async src="js/script2.js"&gt;&lt;/script&gt;
+
+&lt;script async src="js/script3.js"&gt;&lt;/script&gt;</pre>
+
+<p>No puedes confiar en el orden en que se cargarán los <code>script</code>s. <code>jquery.js</code> se puede cargar antes o después de <code>script2.js</code> y <code>script3.js</code> y si este es el caso, cualquier función en esos <code>script</code>s dependiendo de <code>jquery</code> producirá un error porque <code>jquery</code> no se definirá en el momento en que se ejecute el <code>script</code>.</p>
+
+<p><code>async</code> se debe usar cuando tienes un montón de <code>script</code>s en segundo plano para cargar, y solo deseas ponerlos en su lugar lo antes posible. Por ejemplo, tal vez tengas algunos archivos de datos del juego para cargar, que serán necesarios cuando el juego realmente comience, pero por ahora solo deseas continuar mostrando la introducción del juego, los títulos y el lobby, sin que se bloqueen al cargar el <code>script</code>.</p>
+
+<p>Los <code>script</code>s cargados con el atributo <code>defer</code> (ve a continuación) se ejecutarán en el orden en que aparecen en la página y los ejecutará tan pronto como se descarguen el <code>script</code> y el contenido:</p>
+
+<pre class="brush: html notranslate">&lt;script defer src="js/vendor/jquery.js"&gt;&lt;/script&gt;
+
+&lt;script defer src="js/script2.js"&gt;&lt;/script&gt;
+
+&lt;script defer src="js/script3.js"&gt;&lt;/script&gt;</pre>
+
+<p>Todos los <code>script</code>s con el atributo <code>defer</code> se cargarán en el orden en que aparecen en la página. Entonces, en el segundo ejemplo, podemos estar seguros de que <code>jquery.js</code> se cargará antes que <code>script2.js</code> y <code>script3.js</code> y que <code>script2.js</code> se cargará antes de <code>script3.js</code>. No se ejecutarán hasta que se haya cargado todo el contenido de la página, lo cual es útil si tus <code>script</code>s dependen de que el DOM esté en su lugar (por ejemplo, modifican uno o más elementos de la página).</p>
+
+<p>Para resumir:</p>
+
+<ul>
+ <li><code>async</code> y <code>defer</code> indican al navegador que descargue los <code>script</code>s en un hilo separado, mientras que el resto de la página (el DOM, etc.) se descarga, por lo que los <code>script</code>s no bloquean la carga de la página.</li>
+ <li>Si tus <code>script</code>s se deben ejecutar inmediatamente y no tienen ninguna dependencia, utiliza <code>async</code>.</li>
+ <li>Si tus <code>script</code>s necesitan esperar a ser procesados y dependen de otros <code>script</code>s y/o del DOM en su lugar, cárgalos usando <code>defer</code>y coloca tus elementos <code>&lt;script&gt;</code> correspondientes en el orden que desees que el navegador los ejecute.</li>
+</ul>
+
+<h2 id="Comentarios">Comentarios</h2>
+
+<p>Al igual que con HTML y CSS, es posible escribir comentarios en tu código JavaScript que el navegador ignorará y que existen simplemente para proporcionar instrucciones a tus compañeros desarrolladores sobre cómo funciona el código (y a ti, si regresas a tu código después de seis meses y no puedes recordar lo que hiciste). Los comentarios son muy útiles y deberías utilizarlos con frecuencia, especialmente para aplicaciones grandes. Hay dos tipos:</p>
+
+<ul>
+ <li>Un comentario de una sola línea se escribe después de una doble barra inclinada (//), p. ej.
+  <pre class="brush: js notranslate">// soy un comentario</pre>
+ </li>
+ <li>Se escribe un comentario de varias líneas entre las cadenas /* y */, p. ej.
+  <pre class="brush: js notranslate">/*
+  Yo también soy
+  un comentario
+*/</pre>
+ </li>
+</ul>
+
+<p>Entonces, por ejemplo, podríamos anotar el JavaScript de nuestra última demostración con comentarios como este:</p>
+
+<pre class="brush: js notranslate">// Función: crea un nuevo párrafo y lo agrega al final del cuerpo HTML.
+
+function createParagraph() {
+  let para = document.createElement('p');
+  para.textContent = 'You clicked the button!';
+  document.body.appendChild(para);
+}
+
+/*
+  1. Obtiene referencias de todos los botones de la página en un formato de arreglo.
+  2. Recorre todos los botones y agrega un detector de eventos 'click' a cada uno.
+
+  Cuando se presione cualquier botón, se ejecutará la función createParagraph().
+*/
+
+const buttons = document.querySelectorAll('button');
+
+for (let i = 0; i &lt; buttons.length ; i++) {
+  buttons[i].addEventListener('click', createParagraph);
+}</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: En general, más comentarios suelen ser mejor que menos, pero debes tener cuidado si agregas muchos comentarios para explicar qué son las variables (los nombres de tus variables tal vez deberían ser más intuitivos), o para explicar operaciones muy simples (tal vez tu código sea demasiado complicado).</p>
+</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Así que ahí tienes, tu primer paso en el mundo de JavaScript. Comenzamos solo con teoría, para comenzar a acostumbrarte a por qué usarías JavaScript y qué tipo de cosas puedes hacer con él. En el camino, viste algunos ejemplos de código y aprendiste cómo encaja JavaScript con el resto del código en tu sitio web, entre otras cosas.</p>
+
+<p>JavaScript puede parecer un poco abrumador en este momento, pero no te preocupes — en este curso, te guiaremos en pasos simples que tendrán sentido en el futuro. En el próximo artículo, <a href="/es/docs/Learn/JavaScript/Introduction_to_JavaScript_1/A_first_splash">nos sumergiremos directamente en lo práctico</a>, lo que te permitirá comenzar directamente y crear tus propios ejemplos de JavaScript.</p>
+
+<ul>
+</ul>
+
+<p>{{NextMenu("Learn/JavaScript/First_steps/A_first_splash", "Learn/JavaScript/First_steps")}}</p>
+
+<h2 id="En_este_modulo">En este modulo</h2>
+
+<ul>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/What_is_JavaScript">¿Qué es JavaScript?</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/A_first_splash">Primer contacto con JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/What_went_wrong">¿Qué salió mal? Solución de problemas de JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Variables">Almacenamiento de la información que necesita — Variables</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Math">Matemáticas básicas en JavaScript — números y operadores</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Strings">Manejo de texto — cadenas en JavaScript</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Useful_string_methods">Métodos de cadena útiles</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Arrays">Arreglos</a></li>
+ <li><a href="/es/docs/Learn/JavaScript/First_steps/Silly_story_generator">Evaluación: Generador de historias tontas</a></li>
+</ul>
diff --git a/files/es/learn/javascript/objects/ejercicio_práctico_de_construcción_de_objetos/index.html b/files/es/learn/javascript/objects/ejercicio_práctico_de_construcción_de_objetos/index.html
deleted file mode 100644
index 6dfaaf0d08..0000000000
--- a/files/es/learn/javascript/objects/ejercicio_práctico_de_construcción_de_objetos/index.html
+++ /dev/null
@@ -1,301 +0,0 @@
----
-title: Ejercicio práctico de construcción de objetos
-slug: Learn/JavaScript/Objects/Ejercicio_práctico_de_construcción_de_objetos
-translation_of: Learn/JavaScript/Objects/Object_building_practice
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/JavaScript/Objects/JSON", "Learn/JavaScript/Objects/Adding_bouncing_balls_features", "Learn/JavaScript/Objects")}}</div>
-
-<p class="summary">En los artículos anteriores se explicó lo fundamental de la teoría de los objetos en JavaScript asi como su sintaxis, para que Usted tenga un punto de partida sólido. En éste artículo, desarrollaremos un ejercicio práctico para ganar experiencia en la programación de objetos en JavaScript, con un resultado divertido y colorido.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Pre-requisitos:</th>
-   <td>Conocimientos básicos de computadores. Entendimiento básico de HTML y CSS. Familiaridad con los conceptos básicos de JavaScript (vea <a href="/es/docs/Learn/JavaScript/First_steps">Primeros Pasos con JavaScript</a> y <a href="/es/docs/Learn/JavaScript/Building_blocks">Elementos básicos de JavaScript</a>)  y OOJS (vea <a href="/es/docs/Learn/JavaScript/Objects/Basics">Conceptos básicos de los objetos JavaScript</a>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivos:</th>
-   <td>Ganar experiencia en el uso de objetos y el uso de programación orientada a objetos en un contexto realista.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Lanzemos_algunas_pelotas">Lanzemos algunas pelotas</h2>
-
-<p>Es éste artículo escribiremos un programa demo del juego clásico de pelotas que rebotan para mostrar la gran útilidad de los objetos en JavaScript. En éste demo las pelotas rebotaran en la pantalla y cambiaran de color cuando choquen unas con otras. Así, al final del ejemplo tendremos algo como esto:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13865/bouncing-balls.png" style="display: block; height: 614px; margin: 0px auto; width: 800px;"></p>
-
-<ol>
-</ol>
-
-<p>En este ejemplo se utilizará <a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">Canvas API</a> para dibujar las pelotas en la pantalla y la API <a href="/en-US/docs/Web/API/window/requestAnimationFrame">requestAnimationFrame</a> para animar todo el contenido de la pantalla. No es necesario que conozca estas funciones previamente. Esperamos que al final de este artículo, quizás pueda estar interesado en explorar su uso y capacidades más en detalle. Durante este desarrollo usaremos objetos y algunas técnicas para hacer que las pelotas puedan rebotar en los bordes y comprobar cuando choquen entre ellas (ésto se conoce como <strong>detección de colisiones</strong>). </p>
-
-<h2 id="Primeros_pasos">Primeros pasos</h2>
-
-<p>Para comenzar haga una copia en su computador de los archivos:  <code><a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/index.html">index.html</a></code>, <code><a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/style.css">style.css</a></code>, y <code><a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/main.js">main.js</a></code>. Estos contienen:</p>
-
-<ol>
- <li>Un documento HTML sencillo con un elemento &lt;h1&gt;, un elemento &lt;canvas&gt; en el que podamos dibujar los gráficos y otros elementos para aplicar los estilos CSS y el código JavaScript. </li>
- <li>Algunos estilos sencillos que servirán para ubicar el elemento <code>&lt;h1&gt;</code>, ocultar la barra de desplazamiento y los margenes del borde de la página (para que luzca mejor).</li>
- <li>Un archivo JavaScript que sirve para definir el elemento <code>&lt;canvas&gt;</code> y las funciones que vamos a usar.</li>
-</ol>
-
-<p>La primera parte del script es:</p>
-
-<pre class="brush: js">var canvas = document.querySelector('canvas');
-
-var ctx = canvas.getContext('2d');
-
-var width = canvas.width = window.innerWidth;
-var height = canvas.height = window.innerHeight;</pre>
-
-<p>Este script obtiene una referencia del elemento <code>&lt;canvas&gt;</code>, luego llama al método <code><a href="/en-US/docs/Web/API/HTMLCanvasElement/getContext">getContext()</a></code> para definir un contexto en el cual se pueda comenzar a dibujar. La resultado de la variable  (<code>ctx</code>) es el objeto que representa directamente el área de dibujo del <code>&lt;canvas&gt;</code> y permite dibujar elementos 2D en él. </p>
-
-<p>A continuación se da valor a las variables <code>width</code> and <code>height</code> que corresponden al ancho y alto del elemento <em>canvas</em> (representado por las propiedades <code>canvas.width</code> y <code>canvas.height</code>), de manera que el alto y ancho coincidan con el alto y ancho del navegador (<em>viewport</em>)  cuyos valores se obtienen directamente de las propiedades <em>window.innerWidth </em>y <em>window.innerHeight</em>.</p>
-
-<p>Puede ver que en el código se encadenan varias asignaciones, para obtener valores más rápidamente. Esto se puede hacer.</p>
-
-<p>La última parte del script, es la siguiente:</p>
-
-<pre class="brush: js">function random(min, max) {
-  var num = Math.floor(Math.random() * (max - min + 1)) + min;
-  return num;
-}</pre>
-
-<p>Esta función recibe dos números como argumentos de entrada (valor mínimo y maximo) y devuelve un número aleatorio entre ellos.</p>
-
-<h2 id="Modelando_una_pelota_en_nuestro_programa">Modelando una pelota en nuestro programa</h2>
-
-<p>Nuestro programa tendrá montones de pelotas rebotando por toda la pantalla. Ya que todas las pelotas tendrán el mismo comportamiento, tiene sentido representarlas con un objeto. Empezamos definiendo un constructor para el objeto pelota (<em>Ball</em>), en nuestro código.</p>
-
-<pre class="brush: js">function Ball(x, y, velX, velY, color, size) {
-  this.x = x; //posición horizontal
-  this.y = y; //posición vertical
-  this.velX = velX; //velocidad horizontal
-  this.velY = velY; //velocidad vertical
-  this.color = color; //color
-  this.size = size; //tamaño
-}</pre>
-
-<p>Aquí incluimos algunos parámetros que serán las propiedades que cada pelota necesita para funcionar en nuestro programa: </p>
-
-<ul>
- <li>las coordenadas  <code>x</code> e <code>y</code>— correspondientes a la posición horizontal y vertical de la pelota. Estas pueden variar entre un valor 0 (el la esquina superior izquierda) hasta el valor del ancho y alto del navegador ( esquina inferior derecha).</li>
- <li>velocidad horizontal y vertical (<code>velX</code> y <code>velY</code>) — cada pelota tiene una velocidad vertical y horizontal; en la parte práctica, estos valores se añadirán a las coordenadas x e y cuando animemos el movimiento de las pelotas, así en cada incremento de visualización de <em>frame</em>, se desplazarán esta cantidad.</li>
- <li><code>color</code> — cada pelota posee un color.</li>
- <li><code>size</code> — cada pelota tiene un tamaño, este será su radio en pixels.</li>
-</ul>
-
-<p>Con esto se resuelven las propiedades del objeto, ¿Pero qué hacemos con los métodos? Ya que queremos que las pelotas realicen algo en nuestro programa. </p>
-
-<h3 id="Dibujando_las_pelotas">Dibujando las pelotas</h3>
-
-<p>Para dibujar, añadiremos el siguiente método <code>draw()</code> al prototipo del objeto <code>Ball():</code></p>
-
-<pre class="brush: js">Ball.prototype.draw = function() {
-  ctx.beginPath();
-  ctx.fillStyle = this.color;
-  ctx.arc(this.x, this.y, this.size, 0, 2 * Math.PI);
-  ctx.fill();
-}</pre>
-
-<p>Con esta función cada objeto pelota <code>Ball()</code> puede dibujarse en la pantalla utilizando el contexto 2D definido anteriormente (<code>ctx</code>)  </p>
-
-<ul>
- <li>Primero usamos <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/beginPath">beginPath()</a></code> para declarar que empezaremos a dibujar una forma en el <em>canvas</em>.</li>
- <li>A continuación usamos el <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/fillStyle">fillStyle</a></code> para definir el color de la forma. Haremos que coincida con la propiedad <code>color.</code></li>
- <li>A continuación con el método <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/arc">arc()</a></code> se traza un arco. Sus parámetros son:
-  <ul>
-   <li>La posición <code>x</code> e <code>y</code> del centro del arco. Corresponderán a las coordenadas  del centro de la pelota.</li>
-   <li>El radio del arco - que vendrá dado por la propiedad de tamaño <code>size</code> de la pelota.</li>
-   <li>Los últimos dos parámetros especifican el comienzo y final del arco en radianes. En este caso se especifican 0 y <code>2*PI</code> . Que corresponden a 0 y 360 grados. Esto es un circulo completo. Si se quisiese especificar únicamente medio círculo, 180 grados, se especificaría <code>PI</code>.</li>
-  </ul>
- </li>
- <li>Por último con el método <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/fill">fill()</a></code> se finaliza el dibujo, y rellena el área de la curva especificada, según se indico con el <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/fillStyle">fillStyle</a></code>. </li>
-</ul>
-
-<p>Ya se puede empezar a testear el objeto.</p>
-
-<ol>
- <li>Guarde el código hasta ahora, y cargue el archivo HTML en un navegador.</li>
- <li>Abra la consola de JavaScript en el navegador, y refresque la página, para que el tamaño del <em>canvas</em> modifique sus dimensiones adaptándose al <em>viewport</em> con la consola abierta. </li>
- <li>Teclee lo siguiente en la consola para crear una nueva pelota.
-  <pre class="brush: js">var testBall = new Ball(50, 100, 4, 4, 'blue', 10);</pre>
- </li>
- <li>Pruebe a llamar a las variables miembro:
-  <pre class="brush: js">testBall.x
-testBall.size
-testBall.color
-testBall.draw()</pre>
- </li>
- <li>Al teclear la última línea, debería ver que la pelota se dibuja en alguna parte del <em>canvas</em>. </li>
-</ol>
-
-<h3 id="Actualizando_los_datos_de_la_pelota">Actualizando los datos de la pelota</h3>
-
-<p>Ahora podemos dibujar una pelota en una posición dada, pero para empezar a moverla, se necesita una función de actualización de algún tipo. Podemos añadir el código a continuación, al final del archivo de JavaScript, para añidir un método de actualización <code>update()</code> en el prototipo de la clase <code>Ball()</code></p>
-
-<pre class="brush: js">Ball.prototype.update = function() {
-  if ((this.x + this.size) &gt;= width) {
-    this.velX = -(this.velX);
-  }
-
-  if ((this.x - this.size) &lt;= 0) {
-    this.velX = -(this.velX);
-  }
-
-  if ((this.y + this.size) &gt;= height) {
-    this.velY = -(this.velY);
-  }
-
-  if ((this.y - this.size) &lt;= 0) {
-    this.velY = -(this.velY);
-  }
-
-  this.x += this.velX;
-  this.y += this.velY;
-}</pre>
-
-<p>Las cuatro primeras partes de la función verifican si la pelota a alcanzado el borde del <em>canvas</em>. Si es así, se invierte la dirección de la velocidad, para que la pelota se mueva en la dirección contraria. Así, si la pelota va hacia arriba, (<code>velY</code> positiva) , entonces la velocidad vertical es cambiada, para que se mueva hacia abajo (<code>velY</code> negativa).</p>
-
-<p>Los cuatro posibles casos son: </p>
-
-<ul>
- <li>Verificar si la coordenada <code>x</code> es mayor que el ancho del <em>canvas</em> (la pelota está saliendo por el borde derecho).</li>
- <li>Verificar si la coordenada <code>x</code> es menor que la coordenada 0 (la pelota está saliendo por el borde izquierdo)</li>
- <li>Verificar si la coordenada <code>y</code> es mayor que la altura del <em>canvas</em> (la pelota está saliendo por el borde inferior).</li>
- <li>Verificar si la coordenada <code>y</code> es menor que la coordenada 0 ( la pelota está saliendo por el borde superior).</li>
-</ul>
-
-<p>En cada caso, se ha tenido en cuenta el tamaño (<code>size</code>) de la pelota en los cálculos, ya que las coordenadas <code>x</code> e <code>y</code> corresponden al centro de la pelota, pero lo que queremos ver es el borde de la pelota cuando choca con el perímetro del <em>canvas</em> — que la pelota rebote, cuando está a medio camino fuera de el —.</p>
-
-<p>Las dos últimas líneas de código, suman  la velocidad en x (<code>velX</code>) al valor de la coordenada <code>x</code>  , y el valor de la velocidad en y (<code>velY</code>)  a la coordenada <code>y</code> —  con esto se consigue el efecto de que la pelota se mueva cada vez que este método es llamado. </p>
-
-<p>Llegados a este punto: ¡continuemos, con las animaciones!</p>
-
-<h2 id="Animando_las_pelotas">Animando las pelotas</h2>
-
-<p>Hagamos esto divertido! Ahora vamos a empezar a añadir pelotas al canvas, y animándolas.</p>
-
-<p>1. Primero, necesitamos algún sitio donde guardas las pelotas. El siguiente arreglo hará esta función — añádela al final de tu código. </p>
-
-<pre class="brush: js" dir="rtl">var balls = [];</pre>
-
-<p>Todos los programas que generan animaciones normalmente tienen un bucle de animación, que sirve para actualizar los datos del programa, para entonces generar la imagen correspondiente; esta es la estrategia básica para la mayor parte de juegos y programas similares. </p>
-
-<p>2. Añadamos las siguientes instrucciones al final del código: </p>
-
-<pre class="brush: js">function loop() {
-  ctx.fillStyle = 'rgba(0, 0, 0, 0.25)';
-  ctx.fillRect(0, 0, width, height);
-
-  while (balls.length &lt; 25) {
-    var size = random(10,20);
-    var ball = new Ball(
-      // la posición de las pelotas, se dibujará al menos siempre
-      // como mínimo a un ancho de la pelota de distancia al borde del
-      // canvas, para evitar errores en el dibujo
-      random(0 + size,width - size),
-      random(0 + size,height - size),
-      random(-7,7),
-      random(-7,7),
-      'rgb(' + random(0,255) + ',' + random(0,255) + ',' + random(0,255) +')',
-      size
-    );
-    balls.push(ball);
-  }
-
-  for (var i = 0; i &lt; balls.length; i++) {
-    balls[i].draw();
-    balls[i].update();
-  }
-
-  requestAnimationFrame(loop);
-}</pre>
-
-<p>Nuestra función de bucle: <code>loop()</code>, hace lo siguiente: </p>
-
-<ul>
- <li>Define el color de relleno del canvas como negro semi-transparente, entonces dibuja un rectángulo en todo el ancho y alto del canvas, usando <code>fillRect()</code>, (los cuatro parámetros definen las coordenadas de origen, el ancho y el alto del rectángulo). Esto es para cubrir el dibujo del instante anterior antes de actualizar el nuevo dibujo. Si no se realiza este paso, resultará en las imágenes se irán apilando y veremos una especie de serpientes según se mueven por el canvas en vez de las pelotas moviéndose!  El color de relleno se define como semitransparente, <code>rgba(0,0,0,0.25)</code>, lo que nos permite que podamos intuir algunos de los dibujos de instantes anteriores, con lo que podremos recrear un poco el efecto de estelas detrás de las pelotas, según se mueven. Pruebe a variar este número para ver como resulta el efecto.   </li>
- <li>Se crea una nueva instancia de la pelota <code>Ball()</code> usando un número aleatorio mediante la función  <code>random()</code>, entonces se añade este elemento al final del arreglo de las pelotas,  <code>push()</code>,  pero unicamente si el número de pelotas es menor que 25. Así cuando tengamos 25 pelotas en la pantalla, no crearemos nuevas pelotas. Pruebe a variar el número de pelotas en el código: <code>balls.length &lt; 25</code>. Dependiendo de la capacidad de procesamiento del navegador, un número de pelotas muy alto podría ralentizar significativamente la animación. ¡asi que cuidado! </li>
- <li>Se recorre el  bucle por todo el conjunto de pelotas <code>balls</code> y se ejecuta el método para dibujar, <code>draw()</code>, cada una de las pelotas, y actualizar sus datos, <code>update()</code>, en cada una de ellas, así se conservarán las nuevas posiciones y velocidades para el siguiente intervalo de animación.</li>
- <li>Se ejecuta la función de nuevo mediante el método <code>requestAnimationFrame()</code> - cuando este método está continuamente ejecutándose y llama a la misma función, esto ejecutará la función de animación un determinado número de veces por segundo para crear una animación fluida. Esto se realiza normalmente de forma recursiva — lo que quiere decir que la función se llama a sí misma cada vez que se ejecuta, de esa manera se ejecutará una y otra vez de forma continua. </li>
-</ul>
-
-<p>3. Por último, pero no menos importante, añadimos la siguiente línea, al final del código.-- es necesario llamar a la función inicialmente para que la animación comience. </p>
-
-<pre class="brush: js">loop();</pre>
-
-<p>Eso es todo para la parte básica — pruebe a guardar el código y refrescar el navegador para comprobar si aparecen las pelotas rebotando!</p>
-
-<h2 id="Añadiendo_la_detección_de_colisiones">Añadiendo la detección de colisiones</h2>
-
-<p>Ahora, un poco de diversión, añadamos la detección de colisiones a nuestro código. Así las pelotas, sabrán cuando chocan unas contra otras.</p>
-
-<ol>
- <li>El primer paso, será añadir el código a continuación a continuación de donde se definió el método  <code>update()</code>. (en código de <code>Ball.prototype.update</code>)
-
-  <pre class="brush: js">Ball.prototype.collisionDetect = function() {
-  for (var j = 0; j &lt; balls.length; j++) {
-    if (!(this === balls[j])) {
-      var dx = this.x - balls[j].x;
-      var dy = this.y - balls[j].y;
-      var distance = Math.sqrt(dx * dx + dy * dy);
-
-      if (distance &lt; this.size + balls[j].size) {
-        balls[j].color = this.color = 'rgb(' + random(0, 255) + ',' + random(0, 255) + ',' + random(0, 255) +')';
-      }
-    }
-  }
-}</pre>
-
-  <p>Esta función es un poco complicada, así que no hay que preocuparse mucho si de momento no se comprende del todo.  </p>
-
-  <ul>
-   <li>Para cada pelota, necesitamos comprobar si chocará con cada una de las otras pelotas. Para esto, en un bucle <code>for</code> para recorrer todas las pelotas.</li>
-   <li>Dentro del bucle, usamos un <code>if</code>  para comprobar si la pelota que estamos mirando en ese ciclo del bucle <code>for</code> es la pelota que estamos mirando. No queremos mirar si una pelota ha chocado consigo misma. Para esto miramos si la pelota actual (es decir la pelota que está invocando al método que resuelve la detección de colisiones) es la misma que la indicada por el bucle. Usamos un operador <code>!</code> para indicar una negación en la comparación, así que el código dentro de la condición  solo se ejecuta si estamos mirando dos pelotas distintas.</li>
-   <li>Usamos un algoritmo común para comprobar la colisión de los dos pelotas. Básicamente miramos si el área de dos círculos se superponen.  Esto se explica mejor en el enlace <a href="/en-US/docs/Games/Techniques/2D_collision_detection">detección de colision 2D</a>.</li>
-   <li>En este caso, únicamente se define la propiedad de <code>color</code> para las dos pelotas, cambiándolas a un nuevo color aleatorio. Se podría haber hecho cosas más complicadas, como que las pelotas rebotasen una con la otra de forma realista, pero esto habría supuesto un desarrollo más complejo. Para desarrollar esos efectos de simulación física, los desarrolladores tienden a usar librerías de física como <a href="http://wellcaffeinated.net/PhysicsJS/">PhysicsJS</a>, <a href="http://brm.io/matter-js/">matter.js</a>, <a href="http://phaser.io/">Phaser</a>, etc.</li>
-  </ul>
- </li>
- <li>También es necesario llamar este método en cada instante de la animación. <code>balls[i].update();</code> en la línea:
-  <pre class="brush: js">balls[i].collisionDetect();</pre>
- </li>
- <li>Guardar y refrescar la demo de nuevo y podrá ver como las pelotas cambian de color cuando chocan entre ellas.</li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: Si tiene problemas para hacer funcionar este ejemplo, puede comparar su código JavaScript, con el código de la <a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/main-finished.js">version_final</a> (y también ver como funciona al <a href="http://mdn.github.io/learning-area/javascript/oojs/bouncing-balls/index-finished.html">ejecutarla</a>).</p>
-</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Esperamos que se haya divertido escribiendo su propio mundo de pelotas que chocan aleatoriamente, usando objetos y programación orientada a objetos. Esto debería haberle dado una práctica útil y haber sido un buen ejemplo. </p>
-
-<h2 id="Lea_también">Lea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Canvas tutorial</a> — una guia de principiante para usar el canvas 2D.</li>
- <li><a href="/en-US/docs/Web/API/window/requestAnimationFrame">requestAnimationFrame()</a></li>
- <li><a href="/en-US/docs/Games/Techniques/2D_collision_detection">2D detección de colisiones</a></li>
- <li><a href="/en-US/docs/Games/Techniques/3D_collision_detection">3D detección de colisiones</a></li>
- <li><a href="/en-US/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript">2D juego de ruptura usando sólo JavaScript</a> — un gran tutorial para principiantes sobre como construir un juego 2D.</li>
- <li><a href="/en-US/docs/Games/Tutorials/2D_breakout_game_Phaser">2D juego de ruptura usando Phaser</a> — explica los conceptos fundamentales para construir un juego 2D usando una librería de juegos de JavaScript. </li>
-</ul>
-
-<p>{{PreviousMenuNext("Learn/JavaScript/Objects/JSON", "Learn/JavaScript/Objects/Adding_bouncing_balls_features", "Learn/JavaScript/Objects")}}</p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/JavaScript/Objects/Basics">Conceptos básicos de los objetos JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Objects/Object-oriented_JS">JavaScript orientado a objetos para principiantes</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Objects/Object_prototypes">Prototipos de objetos</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Objects/Inheritance">Herencia en JavaScript</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Objects/JSON">Trabajando con datos JSON</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Objects/Object_building_practice">Ejercicio práctico de construcción de objetos</a></li>
- <li><a href="/en-US/docs/Learn/JavaScript/Objects/Adding_bouncing_balls_features">Añadiendo características a nuestra demo de bouncing balls</a></li>
-</ul>
diff --git a/files/es/learn/javascript/objects/object_building_practice/index.html b/files/es/learn/javascript/objects/object_building_practice/index.html
new file mode 100644
index 0000000000..6814a34289
--- /dev/null
+++ b/files/es/learn/javascript/objects/object_building_practice/index.html
@@ -0,0 +1,302 @@
+---
+title: Ejercicio práctico de construcción de objetos
+slug: Learn/JavaScript/Objects/Object_building_practice
+translation_of: Learn/JavaScript/Objects/Object_building_practice
+original_slug: Learn/JavaScript/Objects/Ejercicio_práctico_de_construcción_de_objetos
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/JavaScript/Objects/JSON", "Learn/JavaScript/Objects/Adding_bouncing_balls_features", "Learn/JavaScript/Objects")}}</div>
+
+<p class="summary">En los artículos anteriores se explicó lo fundamental de la teoría de los objetos en JavaScript asi como su sintaxis, para que Usted tenga un punto de partida sólido. En éste artículo, desarrollaremos un ejercicio práctico para ganar experiencia en la programación de objetos en JavaScript, con un resultado divertido y colorido.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Pre-requisitos:</th>
+   <td>Conocimientos básicos de computadores. Entendimiento básico de HTML y CSS. Familiaridad con los conceptos básicos de JavaScript (vea <a href="/es/docs/Learn/JavaScript/First_steps">Primeros Pasos con JavaScript</a> y <a href="/es/docs/Learn/JavaScript/Building_blocks">Elementos básicos de JavaScript</a>)  y OOJS (vea <a href="/es/docs/Learn/JavaScript/Objects/Basics">Conceptos básicos de los objetos JavaScript</a>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivos:</th>
+   <td>Ganar experiencia en el uso de objetos y el uso de programación orientada a objetos en un contexto realista.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Lanzemos_algunas_pelotas">Lanzemos algunas pelotas</h2>
+
+<p>Es éste artículo escribiremos un programa demo del juego clásico de pelotas que rebotan para mostrar la gran útilidad de los objetos en JavaScript. En éste demo las pelotas rebotaran en la pantalla y cambiaran de color cuando choquen unas con otras. Así, al final del ejemplo tendremos algo como esto:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13865/bouncing-balls.png" style="display: block; height: 614px; margin: 0px auto; width: 800px;"></p>
+
+<ol>
+</ol>
+
+<p>En este ejemplo se utilizará <a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">Canvas API</a> para dibujar las pelotas en la pantalla y la API <a href="/en-US/docs/Web/API/window/requestAnimationFrame">requestAnimationFrame</a> para animar todo el contenido de la pantalla. No es necesario que conozca estas funciones previamente. Esperamos que al final de este artículo, quizás pueda estar interesado en explorar su uso y capacidades más en detalle. Durante este desarrollo usaremos objetos y algunas técnicas para hacer que las pelotas puedan rebotar en los bordes y comprobar cuando choquen entre ellas (ésto se conoce como <strong>detección de colisiones</strong>). </p>
+
+<h2 id="Primeros_pasos">Primeros pasos</h2>
+
+<p>Para comenzar haga una copia en su computador de los archivos:  <code><a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/index.html">index.html</a></code>, <code><a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/style.css">style.css</a></code>, y <code><a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/main.js">main.js</a></code>. Estos contienen:</p>
+
+<ol>
+ <li>Un documento HTML sencillo con un elemento &lt;h1&gt;, un elemento &lt;canvas&gt; en el que podamos dibujar los gráficos y otros elementos para aplicar los estilos CSS y el código JavaScript. </li>
+ <li>Algunos estilos sencillos que servirán para ubicar el elemento <code>&lt;h1&gt;</code>, ocultar la barra de desplazamiento y los margenes del borde de la página (para que luzca mejor).</li>
+ <li>Un archivo JavaScript que sirve para definir el elemento <code>&lt;canvas&gt;</code> y las funciones que vamos a usar.</li>
+</ol>
+
+<p>La primera parte del script es:</p>
+
+<pre class="brush: js">var canvas = document.querySelector('canvas');
+
+var ctx = canvas.getContext('2d');
+
+var width = canvas.width = window.innerWidth;
+var height = canvas.height = window.innerHeight;</pre>
+
+<p>Este script obtiene una referencia del elemento <code>&lt;canvas&gt;</code>, luego llama al método <code><a href="/en-US/docs/Web/API/HTMLCanvasElement/getContext">getContext()</a></code> para definir un contexto en el cual se pueda comenzar a dibujar. La resultado de la variable  (<code>ctx</code>) es el objeto que representa directamente el área de dibujo del <code>&lt;canvas&gt;</code> y permite dibujar elementos 2D en él. </p>
+
+<p>A continuación se da valor a las variables <code>width</code> and <code>height</code> que corresponden al ancho y alto del elemento <em>canvas</em> (representado por las propiedades <code>canvas.width</code> y <code>canvas.height</code>), de manera que el alto y ancho coincidan con el alto y ancho del navegador (<em>viewport</em>)  cuyos valores se obtienen directamente de las propiedades <em>window.innerWidth </em>y <em>window.innerHeight</em>.</p>
+
+<p>Puede ver que en el código se encadenan varias asignaciones, para obtener valores más rápidamente. Esto se puede hacer.</p>
+
+<p>La última parte del script, es la siguiente:</p>
+
+<pre class="brush: js">function random(min, max) {
+  var num = Math.floor(Math.random() * (max - min + 1)) + min;
+  return num;
+}</pre>
+
+<p>Esta función recibe dos números como argumentos de entrada (valor mínimo y maximo) y devuelve un número aleatorio entre ellos.</p>
+
+<h2 id="Modelando_una_pelota_en_nuestro_programa">Modelando una pelota en nuestro programa</h2>
+
+<p>Nuestro programa tendrá montones de pelotas rebotando por toda la pantalla. Ya que todas las pelotas tendrán el mismo comportamiento, tiene sentido representarlas con un objeto. Empezamos definiendo un constructor para el objeto pelota (<em>Ball</em>), en nuestro código.</p>
+
+<pre class="brush: js">function Ball(x, y, velX, velY, color, size) {
+  this.x = x; //posición horizontal
+  this.y = y; //posición vertical
+  this.velX = velX; //velocidad horizontal
+  this.velY = velY; //velocidad vertical
+  this.color = color; //color
+  this.size = size; //tamaño
+}</pre>
+
+<p>Aquí incluimos algunos parámetros que serán las propiedades que cada pelota necesita para funcionar en nuestro programa: </p>
+
+<ul>
+ <li>las coordenadas  <code>x</code> e <code>y</code>— correspondientes a la posición horizontal y vertical de la pelota. Estas pueden variar entre un valor 0 (el la esquina superior izquierda) hasta el valor del ancho y alto del navegador ( esquina inferior derecha).</li>
+ <li>velocidad horizontal y vertical (<code>velX</code> y <code>velY</code>) — cada pelota tiene una velocidad vertical y horizontal; en la parte práctica, estos valores se añadirán a las coordenadas x e y cuando animemos el movimiento de las pelotas, así en cada incremento de visualización de <em>frame</em>, se desplazarán esta cantidad.</li>
+ <li><code>color</code> — cada pelota posee un color.</li>
+ <li><code>size</code> — cada pelota tiene un tamaño, este será su radio en pixels.</li>
+</ul>
+
+<p>Con esto se resuelven las propiedades del objeto, ¿Pero qué hacemos con los métodos? Ya que queremos que las pelotas realicen algo en nuestro programa. </p>
+
+<h3 id="Dibujando_las_pelotas">Dibujando las pelotas</h3>
+
+<p>Para dibujar, añadiremos el siguiente método <code>draw()</code> al prototipo del objeto <code>Ball():</code></p>
+
+<pre class="brush: js">Ball.prototype.draw = function() {
+  ctx.beginPath();
+  ctx.fillStyle = this.color;
+  ctx.arc(this.x, this.y, this.size, 0, 2 * Math.PI);
+  ctx.fill();
+}</pre>
+
+<p>Con esta función cada objeto pelota <code>Ball()</code> puede dibujarse en la pantalla utilizando el contexto 2D definido anteriormente (<code>ctx</code>)  </p>
+
+<ul>
+ <li>Primero usamos <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/beginPath">beginPath()</a></code> para declarar que empezaremos a dibujar una forma en el <em>canvas</em>.</li>
+ <li>A continuación usamos el <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/fillStyle">fillStyle</a></code> para definir el color de la forma. Haremos que coincida con la propiedad <code>color.</code></li>
+ <li>A continuación con el método <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/arc">arc()</a></code> se traza un arco. Sus parámetros son:
+  <ul>
+   <li>La posición <code>x</code> e <code>y</code> del centro del arco. Corresponderán a las coordenadas  del centro de la pelota.</li>
+   <li>El radio del arco - que vendrá dado por la propiedad de tamaño <code>size</code> de la pelota.</li>
+   <li>Los últimos dos parámetros especifican el comienzo y final del arco en radianes. En este caso se especifican 0 y <code>2*PI</code> . Que corresponden a 0 y 360 grados. Esto es un circulo completo. Si se quisiese especificar únicamente medio círculo, 180 grados, se especificaría <code>PI</code>.</li>
+  </ul>
+ </li>
+ <li>Por último con el método <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/fill">fill()</a></code> se finaliza el dibujo, y rellena el área de la curva especificada, según se indico con el <code><a href="/en-US/docs/Web/API/CanvasRenderingContext2D/fillStyle">fillStyle</a></code>. </li>
+</ul>
+
+<p>Ya se puede empezar a testear el objeto.</p>
+
+<ol>
+ <li>Guarde el código hasta ahora, y cargue el archivo HTML en un navegador.</li>
+ <li>Abra la consola de JavaScript en el navegador, y refresque la página, para que el tamaño del <em>canvas</em> modifique sus dimensiones adaptándose al <em>viewport</em> con la consola abierta. </li>
+ <li>Teclee lo siguiente en la consola para crear una nueva pelota.
+  <pre class="brush: js">var testBall = new Ball(50, 100, 4, 4, 'blue', 10);</pre>
+ </li>
+ <li>Pruebe a llamar a las variables miembro:
+  <pre class="brush: js">testBall.x
+testBall.size
+testBall.color
+testBall.draw()</pre>
+ </li>
+ <li>Al teclear la última línea, debería ver que la pelota se dibuja en alguna parte del <em>canvas</em>. </li>
+</ol>
+
+<h3 id="Actualizando_los_datos_de_la_pelota">Actualizando los datos de la pelota</h3>
+
+<p>Ahora podemos dibujar una pelota en una posición dada, pero para empezar a moverla, se necesita una función de actualización de algún tipo. Podemos añadir el código a continuación, al final del archivo de JavaScript, para añidir un método de actualización <code>update()</code> en el prototipo de la clase <code>Ball()</code></p>
+
+<pre class="brush: js">Ball.prototype.update = function() {
+  if ((this.x + this.size) &gt;= width) {
+    this.velX = -(this.velX);
+  }
+
+  if ((this.x - this.size) &lt;= 0) {
+    this.velX = -(this.velX);
+  }
+
+  if ((this.y + this.size) &gt;= height) {
+    this.velY = -(this.velY);
+  }
+
+  if ((this.y - this.size) &lt;= 0) {
+    this.velY = -(this.velY);
+  }
+
+  this.x += this.velX;
+  this.y += this.velY;
+}</pre>
+
+<p>Las cuatro primeras partes de la función verifican si la pelota a alcanzado el borde del <em>canvas</em>. Si es así, se invierte la dirección de la velocidad, para que la pelota se mueva en la dirección contraria. Así, si la pelota va hacia arriba, (<code>velY</code> positiva) , entonces la velocidad vertical es cambiada, para que se mueva hacia abajo (<code>velY</code> negativa).</p>
+
+<p>Los cuatro posibles casos son: </p>
+
+<ul>
+ <li>Verificar si la coordenada <code>x</code> es mayor que el ancho del <em>canvas</em> (la pelota está saliendo por el borde derecho).</li>
+ <li>Verificar si la coordenada <code>x</code> es menor que la coordenada 0 (la pelota está saliendo por el borde izquierdo)</li>
+ <li>Verificar si la coordenada <code>y</code> es mayor que la altura del <em>canvas</em> (la pelota está saliendo por el borde inferior).</li>
+ <li>Verificar si la coordenada <code>y</code> es menor que la coordenada 0 ( la pelota está saliendo por el borde superior).</li>
+</ul>
+
+<p>En cada caso, se ha tenido en cuenta el tamaño (<code>size</code>) de la pelota en los cálculos, ya que las coordenadas <code>x</code> e <code>y</code> corresponden al centro de la pelota, pero lo que queremos ver es el borde de la pelota cuando choca con el perímetro del <em>canvas</em> — que la pelota rebote, cuando está a medio camino fuera de el —.</p>
+
+<p>Las dos últimas líneas de código, suman  la velocidad en x (<code>velX</code>) al valor de la coordenada <code>x</code>  , y el valor de la velocidad en y (<code>velY</code>)  a la coordenada <code>y</code> —  con esto se consigue el efecto de que la pelota se mueva cada vez que este método es llamado. </p>
+
+<p>Llegados a este punto: ¡continuemos, con las animaciones!</p>
+
+<h2 id="Animando_las_pelotas">Animando las pelotas</h2>
+
+<p>Hagamos esto divertido! Ahora vamos a empezar a añadir pelotas al canvas, y animándolas.</p>
+
+<p>1. Primero, necesitamos algún sitio donde guardas las pelotas. El siguiente arreglo hará esta función — añádela al final de tu código. </p>
+
+<pre class="brush: js" dir="rtl">var balls = [];</pre>
+
+<p>Todos los programas que generan animaciones normalmente tienen un bucle de animación, que sirve para actualizar los datos del programa, para entonces generar la imagen correspondiente; esta es la estrategia básica para la mayor parte de juegos y programas similares. </p>
+
+<p>2. Añadamos las siguientes instrucciones al final del código: </p>
+
+<pre class="brush: js">function loop() {
+  ctx.fillStyle = 'rgba(0, 0, 0, 0.25)';
+  ctx.fillRect(0, 0, width, height);
+
+  while (balls.length &lt; 25) {
+    var size = random(10,20);
+    var ball = new Ball(
+      // la posición de las pelotas, se dibujará al menos siempre
+      // como mínimo a un ancho de la pelota de distancia al borde del
+      // canvas, para evitar errores en el dibujo
+      random(0 + size,width - size),
+      random(0 + size,height - size),
+      random(-7,7),
+      random(-7,7),
+      'rgb(' + random(0,255) + ',' + random(0,255) + ',' + random(0,255) +')',
+      size
+    );
+    balls.push(ball);
+  }
+
+  for (var i = 0; i &lt; balls.length; i++) {
+    balls[i].draw();
+    balls[i].update();
+  }
+
+  requestAnimationFrame(loop);
+}</pre>
+
+<p>Nuestra función de bucle: <code>loop()</code>, hace lo siguiente: </p>
+
+<ul>
+ <li>Define el color de relleno del canvas como negro semi-transparente, entonces dibuja un rectángulo en todo el ancho y alto del canvas, usando <code>fillRect()</code>, (los cuatro parámetros definen las coordenadas de origen, el ancho y el alto del rectángulo). Esto es para cubrir el dibujo del instante anterior antes de actualizar el nuevo dibujo. Si no se realiza este paso, resultará en las imágenes se irán apilando y veremos una especie de serpientes según se mueven por el canvas en vez de las pelotas moviéndose!  El color de relleno se define como semitransparente, <code>rgba(0,0,0,0.25)</code>, lo que nos permite que podamos intuir algunos de los dibujos de instantes anteriores, con lo que podremos recrear un poco el efecto de estelas detrás de las pelotas, según se mueven. Pruebe a variar este número para ver como resulta el efecto.   </li>
+ <li>Se crea una nueva instancia de la pelota <code>Ball()</code> usando un número aleatorio mediante la función  <code>random()</code>, entonces se añade este elemento al final del arreglo de las pelotas,  <code>push()</code>,  pero unicamente si el número de pelotas es menor que 25. Así cuando tengamos 25 pelotas en la pantalla, no crearemos nuevas pelotas. Pruebe a variar el número de pelotas en el código: <code>balls.length &lt; 25</code>. Dependiendo de la capacidad de procesamiento del navegador, un número de pelotas muy alto podría ralentizar significativamente la animación. ¡asi que cuidado! </li>
+ <li>Se recorre el  bucle por todo el conjunto de pelotas <code>balls</code> y se ejecuta el método para dibujar, <code>draw()</code>, cada una de las pelotas, y actualizar sus datos, <code>update()</code>, en cada una de ellas, así se conservarán las nuevas posiciones y velocidades para el siguiente intervalo de animación.</li>
+ <li>Se ejecuta la función de nuevo mediante el método <code>requestAnimationFrame()</code> - cuando este método está continuamente ejecutándose y llama a la misma función, esto ejecutará la función de animación un determinado número de veces por segundo para crear una animación fluida. Esto se realiza normalmente de forma recursiva — lo que quiere decir que la función se llama a sí misma cada vez que se ejecuta, de esa manera se ejecutará una y otra vez de forma continua. </li>
+</ul>
+
+<p>3. Por último, pero no menos importante, añadimos la siguiente línea, al final del código.-- es necesario llamar a la función inicialmente para que la animación comience. </p>
+
+<pre class="brush: js">loop();</pre>
+
+<p>Eso es todo para la parte básica — pruebe a guardar el código y refrescar el navegador para comprobar si aparecen las pelotas rebotando!</p>
+
+<h2 id="Añadiendo_la_detección_de_colisiones">Añadiendo la detección de colisiones</h2>
+
+<p>Ahora, un poco de diversión, añadamos la detección de colisiones a nuestro código. Así las pelotas, sabrán cuando chocan unas contra otras.</p>
+
+<ol>
+ <li>El primer paso, será añadir el código a continuación a continuación de donde se definió el método  <code>update()</code>. (en código de <code>Ball.prototype.update</code>)
+
+  <pre class="brush: js">Ball.prototype.collisionDetect = function() {
+  for (var j = 0; j &lt; balls.length; j++) {
+    if (!(this === balls[j])) {
+      var dx = this.x - balls[j].x;
+      var dy = this.y - balls[j].y;
+      var distance = Math.sqrt(dx * dx + dy * dy);
+
+      if (distance &lt; this.size + balls[j].size) {
+        balls[j].color = this.color = 'rgb(' + random(0, 255) + ',' + random(0, 255) + ',' + random(0, 255) +')';
+      }
+    }
+  }
+}</pre>
+
+  <p>Esta función es un poco complicada, así que no hay que preocuparse mucho si de momento no se comprende del todo.  </p>
+
+  <ul>
+   <li>Para cada pelota, necesitamos comprobar si chocará con cada una de las otras pelotas. Para esto, en un bucle <code>for</code> para recorrer todas las pelotas.</li>
+   <li>Dentro del bucle, usamos un <code>if</code>  para comprobar si la pelota que estamos mirando en ese ciclo del bucle <code>for</code> es la pelota que estamos mirando. No queremos mirar si una pelota ha chocado consigo misma. Para esto miramos si la pelota actual (es decir la pelota que está invocando al método que resuelve la detección de colisiones) es la misma que la indicada por el bucle. Usamos un operador <code>!</code> para indicar una negación en la comparación, así que el código dentro de la condición  solo se ejecuta si estamos mirando dos pelotas distintas.</li>
+   <li>Usamos un algoritmo común para comprobar la colisión de los dos pelotas. Básicamente miramos si el área de dos círculos se superponen.  Esto se explica mejor en el enlace <a href="/en-US/docs/Games/Techniques/2D_collision_detection">detección de colision 2D</a>.</li>
+   <li>En este caso, únicamente se define la propiedad de <code>color</code> para las dos pelotas, cambiándolas a un nuevo color aleatorio. Se podría haber hecho cosas más complicadas, como que las pelotas rebotasen una con la otra de forma realista, pero esto habría supuesto un desarrollo más complejo. Para desarrollar esos efectos de simulación física, los desarrolladores tienden a usar librerías de física como <a href="http://wellcaffeinated.net/PhysicsJS/">PhysicsJS</a>, <a href="http://brm.io/matter-js/">matter.js</a>, <a href="http://phaser.io/">Phaser</a>, etc.</li>
+  </ul>
+ </li>
+ <li>También es necesario llamar este método en cada instante de la animación. <code>balls[i].update();</code> en la línea:
+  <pre class="brush: js">balls[i].collisionDetect();</pre>
+ </li>
+ <li>Guardar y refrescar la demo de nuevo y podrá ver como las pelotas cambian de color cuando chocan entre ellas.</li>
+</ol>
+
+<div class="note">
+<p><strong>Nota</strong>: Si tiene problemas para hacer funcionar este ejemplo, puede comparar su código JavaScript, con el código de la <a href="https://github.com/mdn/learning-area/blob/master/javascript/oojs/bouncing-balls/main-finished.js">version_final</a> (y también ver como funciona al <a href="http://mdn.github.io/learning-area/javascript/oojs/bouncing-balls/index-finished.html">ejecutarla</a>).</p>
+</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Esperamos que se haya divertido escribiendo su propio mundo de pelotas que chocan aleatoriamente, usando objetos y programación orientada a objetos. Esto debería haberle dado una práctica útil y haber sido un buen ejemplo. </p>
+
+<h2 id="Lea_también">Lea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Canvas tutorial</a> — una guia de principiante para usar el canvas 2D.</li>
+ <li><a href="/en-US/docs/Web/API/window/requestAnimationFrame">requestAnimationFrame()</a></li>
+ <li><a href="/en-US/docs/Games/Techniques/2D_collision_detection">2D detección de colisiones</a></li>
+ <li><a href="/en-US/docs/Games/Techniques/3D_collision_detection">3D detección de colisiones</a></li>
+ <li><a href="/en-US/docs/Games/Tutorials/2D_Breakout_game_pure_JavaScript">2D juego de ruptura usando sólo JavaScript</a> — un gran tutorial para principiantes sobre como construir un juego 2D.</li>
+ <li><a href="/en-US/docs/Games/Tutorials/2D_breakout_game_Phaser">2D juego de ruptura usando Phaser</a> — explica los conceptos fundamentales para construir un juego 2D usando una librería de juegos de JavaScript. </li>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/JavaScript/Objects/JSON", "Learn/JavaScript/Objects/Adding_bouncing_balls_features", "Learn/JavaScript/Objects")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/JavaScript/Objects/Basics">Conceptos básicos de los objetos JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Objects/Object-oriented_JS">JavaScript orientado a objetos para principiantes</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Objects/Object_prototypes">Prototipos de objetos</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Objects/Inheritance">Herencia en JavaScript</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Objects/JSON">Trabajando con datos JSON</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Objects/Object_building_practice">Ejercicio práctico de construcción de objetos</a></li>
+ <li><a href="/en-US/docs/Learn/JavaScript/Objects/Adding_bouncing_balls_features">Añadiendo características a nuestra demo de bouncing balls</a></li>
+</ul>
diff --git a/files/es/learn/learning_and_getting_help/index.html b/files/es/learn/learning_and_getting_help/index.html
new file mode 100644
index 0000000000..e78bcbff0c
--- /dev/null
+++ b/files/es/learn/learning_and_getting_help/index.html
@@ -0,0 +1,322 @@
+---
+title: Aprender y obtener ayuda
+slug: Learn/Learning_and_getting_help
+tags:
+  - Aprender
+  - Desarrollo web
+  - Principiante
+  - conseguir ayuda
+  - obtener ayuda
+translation_of: Learn/Learning_and_getting_help
+original_slug: Learn/Aprender_y_obtener_ayuda
+---
+<p>{{learnsidebar}}</p>
+
+<p>Es genial que dediques algo de tiempo a aprender un nuevo conjunto de habilidades, pero puedes emplear algunas buenas prácticas que harán que tu aprendizaje sea más efectivo. También hay momentos en los que te atascarás y te sentirás frustrado, incluso los desarrolladores web profesionales se sienten así regularmente, y vale la pena conocer las formas más efectivas de tratar de obtener ayuda para que puedas progresar en tu trabajo. Este artículo proporciona algunos consejos y sugerencias en ambas áreas que te ayudarán a obtener más provecho del aprendizaje del desarrollo web, así como una lectura adicional para que puedas obtener más información sobre cada subtema si lo deseas.</p>
+
+<h2 id="Aprendizaje_efectivo">Aprendizaje efectivo</h2>
+
+<p>Sigamos adelante y pensemos en un aprendizaje efectivo.</p>
+
+<h3 id="Diferentes_métodos_de_aprendizaje">Diferentes métodos de aprendizaje</h3>
+
+<p>Es interesante considerar que hay dos formas principales en las que tu cerebro aprende cosas — el aprendizaje <strong>enfocado</strong> y el aprendizaje <strong>difuso</strong>:</p>
+
+<ul>
+ <li>El aprendizaje enfocado es lo que tradicionalmente podrías asociar con las materias académicas. Te concentras profundamente en un tema de bajo nivel y resuelves los problemas específicos demostrando que eres muy capaz. Estás enfocado en una área estrecha.</li>
+ <li>El aprendizaje difuso tiene más que ver con el pensamiento de alto nivel en un área más amplia. Dejas que tu mente divague más y aparentemente haces conexiones aleatorias entre diferentes cosas. Este es más el tipo de pensamiento que llevas a cabo mientras estás en la ducha o durante un descanso para tomar café.</li>
+</ul>
+
+<p>A partir de los estudios que los neurocientíficos han realizado sobre la actividad cerebral, hemos descubierto que realmente no se puede participar en ambas formas de aprendizaje, o de pensamiento simultáneamente. Entonces, ¿cuál debes elegir? Puedes pensar que el aprendizaje enfocado es mejor para estudiar, pero en realidad, <strong>ambos</strong> son muy importantes.</p>
+
+<p>El pensamiento enfocado es excelente para concentrarte mucho en temas específicos, profundizar en la resolución de problemas y mejorar tu dominio de las técnicas requeridas, fortaleciendo las vías neuronales en tu cerebro donde se almacena esa información. Sin embargo, no es muy bueno para entender "el panorama general" y desbloquear nuevas vías neuronales cuando intentas comprender nuevos temas o resolver nuevos problemas que no has encontrado antes.</p>
+
+<p>Para eso, necesitas un pensamiento difuso. Esto es lo opuesto al enfoque — dejas que tu cerebro divague por el paisaje más amplio, buscando conexiones que no tenías antes, tocando cosas nuevas (o nuevas combinaciones de cosas) en las que luego puedes concentrarte para fortalecerlas y empezar a entender realmente lo que significan.</p>
+
+<p>Es por eso que generalmente es bueno leer primero un material introductorio para obtener una comprensión de alto nivel de un área, antes de saltar a los detalles específicos.</p>
+
+<p>También es la razón por la que, a veces, puedes quedar realmente atrapado en un problema, pero luego averiguar la respuesta cuando vas a tomar un café (o a caminar). Podrías:</p>
+
+<ol>
+ <li>Saber cómo solucionar el problema A con la herramienta A.</li>
+ <li>Saber cómo solucionar el problema B con la herramienta B.</li>
+ <li>No saber cómo solucionar el problema C.</li>
+</ol>
+
+<p>Supongamos que te enfocas en el problema C por un tiempo y te frustras porque no puedes encontrar la solución para resolverlo. Pero luego, después de caminar para tomar un poco de aire fresco, es posible que descubras que, mientras tu mente divaga, de repente estableces una conexión entre la herramienta A y la herramienta B, ¡y te das cuenta de que las puedes usar juntas para solucionar el problema C! No siempre es así de simple, pero también es sorprendente cuántas veces sucede. Esto también resalta la importancia de tomar descansos regulares cuando estás estudiando frente a la computadora.</p>
+
+<h3 id="Diferentes_materiales_de_aprendizaje">Diferentes materiales de aprendizaje</h3>
+
+<p>También vale la pena mirar los diferentes tipos de materiales de aprendizaje disponibles, para ver cuáles son los más efectivos para que aprendas.</p>
+
+<h4 id="Artículos_textuales">Artículos textuales</h4>
+
+<p>Encontrarás muchos artículos escritos en la web para enseñarte sobre diseño web. Como la mayor parte de este curso, por ejemplo. Algunos de los artículos serán tutoriales, para enseñarte una determinada técnica o concepto importante (como "<em>aprender a crear un reproductor de video</em>" o "<em>Aprender el modelo de cajas CSS</em>"), y algunos de los artículos serán material de referencia, para permitirte recordar detalles que hayas olvidado (como "<em>¿cuál es la sintaxis de la propiedad <code>background</code> de CSS</em>"?)</p>
+
+<p>MDN Web Docs es muy bueno para ambos tipos — el área en la que te encuentras actualmente es excelente para aprender técnicas y conceptos, y también tenemos varias secciones de referencia gigantes que te permiten buscar cualquier sintaxis que no puedas recordar.</p>
+
+<p>También hay varios otros recursos excelentes en la web, algunos de los cuales mencionaremos a continuación.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: el texto anterior debería haberte proporcionado un dato importante: <em>¡no se espera que recuerdes todo!</em> Los desarrolladores web profesionales todo el tiempo usan herramientas como <em>MDN Web Docs</em> para buscar cosas que han olvidado. Como descubrirás a lo largo de estas líneas, aprender desarrollo web tiene más que ver con la resolución de problemas y patrones de aprendizaje que con el aprendizaje de muchas sintaxis.</p>
+</div>
+
+<h4 id="Videos">Videos</h4>
+
+<p>También hay una serie de sitios que tienen contenido de aprendizaje de video en ellos. YouTube es obvio, con canales como <a href="https://www.youtube.com/channel/UC7TizprGknbDalbHplROtag" rel="noopener">Mozilla Layout Land</a>, <a href="https://www.youtube.com/MozillaDeveloper" rel="noopener">MozillaDeveloper</a> y <a href="https://www.youtube.com/user/ChromeDevelopers/" rel="noopener">Google ChromeDevelopers</a> que proporcionan muchos útiles videos. Muchas personas prefieren artículos textuales para un aprendizaje más profundo y material de referencia, y videos para explicaciones rápidas de conceptos y nuevas características, pero realmente depende de ti lo que prefieras aprender. Aquí no hay una respuesta correcta e incorrecta.</p>
+
+<h4 id="Código_de_juegos_interactivos">Código de juegos interactivos</h4>
+
+<p>Posiblemente seas el tipo de persona que prefiere instrucciones mínimas y preferirías saltar directamente y comenzar a jugar con el código. Este también es un enfoque razonable, y algunos sitios de aprendizaje tienden a favorecerlo. <a href="https://www.codecademy.com/" rel="noopener">Codecademy,</a> por ejemplo, es un sitio de aprendizaje donde los tutoriales consisten principalmente en editores de códigos interactivos en los que debes escribir directamente el código y ver si se logró el resultado deseado.</p>
+
+<p>Muchas páginas de referencia de documentos web de MDN también proporcionan ejemplos interactivos, donde puedes modificar el código y ver cómo cambia el resultado en vivo. Y tampoco hay nada de malo en crear tus propios ejemplos de código en tu computadora o en un editor de código en línea como <a href="https://jsbin.com/?html,css,js,output" rel="noopener">JSBin</a>, <a href="https://codepen.io/" rel="noopener">Codepen</a> o <a href="https://glitch.com/" rel="noopener">Glitch</a>. De hecho, ¡te invitarán a usarlos como parte de este curso cuando estés aprendiendo!</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Los editores de código en línea también son realmente útiles para compartir el código que has escrito, por ejemplo, si estás colaborando en el aprendizaje con otra persona que no se encuentra en la misma ubicación o se lo envías a alguien para pedir ayuda con eso. Puedes compartir la dirección web del ejemplo con ellos para que puedan verlo y ayudarte.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Es posible que prefieras un método de aprendizaje sobre los demás, pero, de manera realista, probablemente terminarás con un enfoque híbrido. Y probablemente se te ocurran otros métodos además de los tres que cubrimos anteriormente.</p>
+</div>
+
+<h3 id="Haz_un_plan">Haz un plan</h3>
+
+<p>Es una buena idea crear un plan para ayudarte a lograr lo que quieres conseguir a través de tu aprendizaje.</p>
+
+<h4 id="Una_declaración_de_objetivos">Una declaración de objetivos</h4>
+
+<p>Suena tonto, pero ¿por qué no comenzar con una sola oración que diga lo que quieres lograr? Los siguientes tienen diferentes ámbitos, pero todos son realistas y alcanzables:</p>
+
+<ul>
+ <li>Quiero convertirme en un desarrollador web profesional dentro de dos años.</li>
+ <li>Quiero aprender lo suficiente como para crear un sitio web para mi club de tenis amateur local.</li>
+ <li>Quiero aprender HTML y CSS para poder ampliar mi rol de trabajo para encargarme de actualizar el contenido del sitio web de nuestra empresa.</li>
+</ul>
+
+<p>Los siguientes no son tan razonables:</p>
+
+<ul>
+ <li>Quiero pasar de ser un principiante completamente novato a ser un desarrollador web senior en tres meses.</li>
+ <li>Quiero comenzar mi propia empresa y construir una red social que supere a Facebook en dos años.</li>
+</ul>
+
+<h4 id="¿Qué_necesitas_para_llegar_allí">¿Qué necesitas para llegar allí?</h4>
+
+<p>Una vez que hayas descrito tu objetivo, es una buena idea investigar qué necesitarás para lograrlo. Por ejemplo:</p>
+
+<p>Materiales que necesito:</p>
+
+<ul>
+ <li>Un ordenador</li>
+ <li>Acceso a Internet</li>
+ <li>Bolígrafos y papel</li>
+</ul>
+
+<p>Conocimiento que necesito:</p>
+
+<ul>
+ <li>Cómo usar HTML, CSS, JavaScript y las herramientas asociadas y las mejores prácticas para crear sitios web y aplicaciones web (¡definitivamente te podemos ayudar con esto!).</li>
+ <li>Cómo obtener un dominio, alojamiento y usarlos para poner un sitio web o una aplicación en línea.</li>
+ <li>Cómo dirigir una pequeña empresa.</li>
+ <li>Cómo publicitar tu negocio y atraer clientes.</li>
+</ul>
+
+<h4 id="¿Cuánto_tiempo_y_dinero_costará">¿Cuánto tiempo y dinero costará?</h4>
+
+<p>Calcula el tiempo y el costo para obtener estas cosas. Si necesitas trabajar para ganar dinero para comprar los materiales requeridos, entonces deberás tener en cuenta el tiempo para hacerlo. Una vez que tengas un estimado del tiempo, puedes comenzar a elaborar un plan para tu vida.</p>
+
+<h4 id="¿Cuántas_horas_por_semana_necesitas_invertir">¿Cuántas horas por semana necesitas invertir?</h4>
+
+<p>Una vez que sepas lo que necesitas hacer y cuánto tiempo crees que te llevará, puedes comenzar a escribir un plan a seguir para lograr tu objetivo. Puede ser tan simple como:</p>
+
+<p>"Me llevará 500 horas aprender lo que necesito saber, y tengo un año para hacerlo, así que si asumo 2 semanas de vacaciones, tendré que trabajar en esto durante 10 horas por semana. Estoy gratis por las tardes y fines de semana, así que planearé mi tiempo en torno a eso".</p>
+
+<p>La cantidad de tiempo que puedes dedicar a esto, por supuesto, depende de cuáles sean tus circunstancias. Si estás en la escuela, entonces tienes mucho más tiempo libre que si tienes un trabajo y niños que mantener. Todavía es posible lograr tus objetivos, pero debes ser realista sobre la rapidez con que puedes lograrlo.</p>
+
+<p>Si estás haciendo un curso colegial o universitario para aprender desarrollo web, entonces la mayor parte de esta planificación la haces tú, ¡qué suerte!</p>
+
+<p>Cuando hayas elaborado un horario semanal, debes mantener un registro de lo que logras hacer cada semana en una simple hoja de cálculo o incluso en un cuaderno.</p>
+
+<p>Además, sería una buena idea tener algunos objetivos secundarios resueltos que te permitan realizar fácilmente un seguimiento de dónde te encuentras, por ejemplo:</p>
+
+<ul>
+ <li>Conceptos básicos de HTML y CSS aprendidos en verano</li>
+ <li>Conceptos básicos de JavaScript aprendidos en Diciembre</li>
+ <li>Ejemplo de proyecto del sitio web creado para el próximo mes de abril</li>
+ <li>etc.</li>
+</ul>
+
+<p>Sigue pensando en cuánto progreso estás haciendo y ajusta tu plan si es necesario.</p>
+
+<h3 id="Mantente_motivado">Mantente motivado</h3>
+
+<p>Es difícil mantenerte motivado, especialmente si estás tratando de aprender una habilidad compleja como la programación o el desarrollo web. Lo que sigue son algunos consejos para mantenerte motivado y seguir trabajando:</p>
+
+<ul>
+ <li><strong>Intenta que tu entorno de trabajo sea lo más productivo posible</strong>. Intenta conseguir un escritorio y una silla cómodos para trabajar, asegúrate de tener suficiente luz para ver lo que estás haciendo e intenta incluir cosas que te ayuden a concentrarte (por ejemplo, música suave, fragancias, cualquier otra cosa que necesites). No intentes trabajar en una habitación con distracciones, por ejemplo, un televisor encendido, ¡con tus amigos mirando fútbol! Además, deja tu teléfono móvil fuera de la habitación; la mayoría de las personas que lo tenemos nos distraemos mucho con el teléfono, por lo que debes dejarlo en otro lugar.</li>
+ <li><strong>Tómate descansos regulares</strong>. No es bueno para tu motivación seguir trabajando durante horas sin descanso, especialmente si te resulta difícil o te estás quedando atrapado en un problema. Eso solo conduce a la frustración — a menudo, es mejor tomar un descanso, muévete un poco, luego relájate con una bebida antes de volver al trabajo, y como dijimos anteriormente, el aprendizaje difuso que haces en ese momento a menudo puede ayudarte para encontrar una solución al problema que estabas enfrentando. Además, físicamente es malo trabajar durante demasiado tiempo sin un descanso — mirar un monitor durante demasiado tiempo puede lastimar los ojos, y permanecer sentado demasiado tiempo puede ser malo para la espalda o las piernas. Recomendamos tomar un descanso de 15 minutos cada hora a 90 minutos.</li>
+ <li><strong>Come, haz ejercicio y duerme</strong>. Come saludablemente, haz ejercicio regularmente y asegúrate de dormir lo suficiente. Esto suena obvio, pero es fácil olvidar cuando realmente te dedicas a la codificación. Incluye estos ingredientes esenciales en tu horario y asegúrate de no estar haciendo tu tiempo de aprendizaje en lugar de estas cosas.</li>
+ <li><strong>Regálate recompensas</strong> . Es cierto que <em>todo trabajo y nada de juego hacen que Jack sea un niño aburrido</em>. Debes tratar de programar cosas divertidas para hacer después de cada sesión de aprendizaje, que solo tendrás cuando hayas terminado y completado el aprendizaje. Si realmente te gustan los juegos, por ejemplo, hay algo bastante motivador en decir "no jugaré esta noche a menos que termine mis 5 horas de aprendizaje". Ahora, todo lo que necesitas es fuerza de voluntad. ¡Buena suerte!</li>
+ <li><strong>Coaprendizaje y demostración</strong>. Esta no será una opción para todos, pero si es posible, trata de aprender junto con otros. Una vez más, esto es más fácil si estás haciendo un curso universitario sobre desarrollo web, pero ¿tal vez podrías convencer a un amigo para que aprenda junto contigo? o encontrar una reunión local o un grupo de intercambio de habilidades. Es realmente útil y motivador tener a alguien con quien discutir ideas y pedir ayuda, y también debes tomarte el tiempo para demostrar tu trabajo. Esas palabras de agradecimiento te estimularán.</li>
+</ul>
+
+<h3 id="Resolución_de_problemas_eficaz">Resolución de problemas eficaz</h3>
+
+<p>No hay una única forma efectiva de resolver todos los problemas (y aprender todo) lo relacionado con el diseño y desarrollo web, pero hay algunos consejos generales que te servirán en la mayoría de los casos.</p>
+
+<h4 id="Romper_las_cosas_en_trozos">Romper las cosas en trozos</h4>
+
+<p>Para empezar, cuando intentas implementar algo específico y parece realmente difícil entenderlo, debes tratar de dividirlo en múltiples problemas o fragmentos más pequeños.</p>
+
+<p>Por ejemplo, si estás considerando la tarea de "Crear un sitio web simple de dos columnas", la puedes desglosar de la siguiente manera:</p>
+
+<ul>
+ <li>Crea la estructura HTML</li>
+ <li>Resuelve la tipografía básica del sitio</li>
+ <li>Elabora un esquema de color básico</li>
+ <li>Implementa un diseño de alto nivel: encabezado, menú de navegación horizontal, área de contenido principal con columnas principales y laterales y pie de página.</li>
+ <li>Implementa un menú de navegación horizontal.</li>
+ <li>etc.</li>
+</ul>
+
+<p>Luego, podrías desglosarlo aún más, por ejemplo, "Implementar menú de navegación horizontal" podría escribirse como:</p>
+
+<ul>
+ <li>Haz una lista de los elementos del menú situados horizontalmente en una línea.</li>
+ <li>Elimina los valores predeterminados innecesarios, como el espaciado de las listas y viñetas.</li>
+ <li>Estiliza el cursor/enfoque/estados activos de los elementos del menú adecuadamente.</li>
+ <li>Haz los elementos del menú igualmente espaciados a lo largo de la línea.</li>
+ <li>Da a los elementos del menú suficiente espacio vertical.</li>
+ <li>Asegúrate de que el texto esté centrado dentro de cada elemento del menú</li>
+ <li>etc.</li>
+</ul>
+
+<p>Cada uno de estos problemas no parece tan difícil de resolver como el gran problema que tuviste inicialmente. ¡Ahora solo tienes que empezar a resolverlos todos!</p>
+
+<h4 id="Aprende_y_reconoce_los_patrones">Aprende y reconoce los patrones</h4>
+
+<p>Como dijimos antes, el diseño/programación web se trata principalmente de resolución de problemas y patrones. Una vez que hayas escrito lo que necesitarás hacer para resolver un problema específico, puedes comenzar a descubrir qué características tecnológicas usar para resolverlo. Por ejemplo, los desarrolladores web profesionales han creado muchos menús de navegación horizontal, por lo que inmediatamente comenzarás a pensar en una solución como esta:</p>
+
+<p>Un menú de navegación generalmente se crea a partir de una lista de enlaces, algo así como:</p>
+
+<pre class="brush: html notranslate">&lt;ul&gt;
+  &lt;li&gt;Primer elemento del menú&lt;/li&gt;
+  &lt;li&gt;Segundo elemento del menú&lt;/li&gt;
+  &lt;li&gt;Tercer elemento del menú&lt;/li&gt;
+  &lt;li&gt;etc.&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
+<p>Para hacer que todos los elementos se asienten horizontalmente en una línea, la forma moderna más fácil es usar flexbox:</p>
+
+<pre class="notranslate">ul {
+  display: flex;
+}</pre>
+
+<p>Para eliminar el espacio innecesario y las viñetas, podemos hacer esto:</p>
+
+<pre class="notranslate">ul {
+  list-style-type: none;
+  padding: 0;
+}</pre>
+
+<p>etc.</p>
+
+<p>Si realmente eres un principiante en el desarrollo web, tendrás que estudiar y buscar en la web y encontrar soluciones para tales problemas. Si eres un desarrollador web profesional, probablemente recordarás la última vez que resolviste un problema similar, y solo tendrás que buscar algunos bits de la sintaxis que olvidaste desde entonces.</p>
+
+<p>Cuando encuentres soluciones a tales problemas, vale la pena escribir notas sobre lo que hiciste y mantener algunos ejemplos de código mínimos en un directorio en algún lugar para que puedas mirar hacia atrás en el trabajo anterior.</p>
+
+<p>Además, la web tiene {{web.link("/es/docs/Learn/Common_questions/What_are_browser_developer_tools", "herramientas de desarrollo")}} que te permiten ver el código utilizado para crear cualquier sitio en la web, si no tienes una solución a mano, un buen método de investigación es encontrar sitios web con características similares en la naturaleza y averiguar cómo lo hicieron.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Observa cómo hablamos antes sobre el problema que estamos tratando de resolver primero, y la tecnología utilizada para resolverlo, en segundo lugar. Esta, casi siempre es la mejor manera de hacerlo — no comiences con una tecnología nueva y genial que desees usar, e intenta adaptarla a tu caso de uso.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: La solución más sencilla suele ser la mejor.</p>
+</div>
+
+<h3 id="Practica">Practica</h3>
+
+<p>Cuanto más practiques la resolución de un problema, más fuertes serán las vías neuronales de tu cerebro en esa área y más fácil será recordar los detalles y la lógica de ese problema en particular.</p>
+
+<p>Sigue jugando con el código y practica más. Si se te acaban los problemas por resolver, busca algunas pruebas en línea, realiza algunos cursos más o pregunta a tus amigos y familiares (o escuela, o iglesia local) si hay algo que les gustaría que construyeras para ellos.</p>
+
+<h2 dir="ltr" id="Obtener_ayuda">Obtener ayuda</h2>
+
+<p dir="ltr">El desarrollo web requiere que aprendas un complejo conjunto de habilidades — a veces estarás atascado y necesitarás ayuda. Como dijimos antes, incluso los desarrolladores profesionales regularmente necesitan ayuda para resolver problemas.</p>
+
+<p dir="ltr">Hay una variedad de formas de obtener ayuda, y la siguiente información son algunos consejos para hacerlo de manera más efectiva.</p>
+
+<h3 dir="ltr" id="Búsquedas_web_efectivas">Búsquedas web efectivas</h3>
+
+<p dir="ltr">Una habilidad importante para aprender es el arte de las búsquedas web efectivas — ¿qué términos de búsqueda necesitas usar en tu motor de búsqueda favorito para encontrar los artículos que necesitas?</p>
+
+<p dir="ltr">A menudo es bastante obvio qué buscar. Por ejemplo:</p>
+
+<ul dir="ltr">
+ <li>Si deseas obtener más información sobre el diseño web receptivo, puedes buscar "diseño web receptivo".</li>
+ <li>Si deseas obtener más información sobre una característica tecnológica específica, como el elemento HTML <code>&lt;video&gt;</code>, el <code>background-color</code> o las propiedades <code>opacity</code> de CSS, o el método <code>Date.setTime()</code> de JavaScript, debes buscar el nombre de la característica.</li>
+ <li>Si estás buscando información más específica, puedes agregar otras palabras clave como modificadores, por ejemplo, "atributo de reproducción automática de elementos &lt;video&gt;" o "Parámetros Date.setTime".</li>
+</ul>
+
+<p dir="ltr">Si deseas buscar algo que tenga palabras de moda menos obvias, debes pensar en qué es más probable que te devuelva lo que deseas.</p>
+
+<ul dir="ltr">
+ <li>Ejecuta el código después de cumplir varias promesas</li>
+ <li>Reproduce una transmisión de video desde una cámara web en el navegador</li>
+ <li>Crea un degradado lineal en el fondo de tu elemento</li>
+</ul>
+
+<h4 id="Mensajes_de_error">Mensajes de error</h4>
+
+<p>Si tienes un problema con algún código y aparece un mensaje de error específico, a menudo es una buena idea copiar el mensaje de error en tu motor de búsqueda y utilizarlo como término de búsqueda. Si otras personas han tenido el mismo problema, es probable que haya algunos artículos o publicaciones de blog al respecto en lugares como MDN o Stack Overflow.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: <a href="https://stackoverflow.com/">Stack Overflow</a> es un sitio web realmente útil; básicamente es una enorme base de datos de preguntas y respuestas seleccionadas sobre diversas tecnologías y técnicas relacionadas. Probablemente encontrarás una respuesta que responda a tu pregunta. Si no, puedes hacer una pregunta y ver si alguien puede ayudarte.</p>
+</div>
+
+<h4 id="Prueba_en_el_navegador">Prueba en el navegador</h4>
+
+<p dir="ltr">A menudo es una buena idea ver si tu problema está afectando a todos los navegadores, o si solo ocurre en uno o en un pequeño número de navegadores. Si solo afecta a un navegador, por ejemplo, puedes usar ese navegador para limitar la búsqueda. Las búsquedas de ejemplo podrían verse así:</p>
+
+<ul dir="ltr">
+ <li>La reproducción de &lt;video&gt; no funciona en el navegador iOS.</li>
+ <li>Firefox no parece admitir la API de Beetlejuice.</li>
+</ul>
+
+<h3 dir="ltr" id="Usa_MDN">Usa MDN</h3>
+
+<p dir="ltr">El sitio en el que ya estás tiene una gran cantidad de información disponible, tanto material de referencia para buscar la sintaxis del código como guías/tutoriales para aprender técnicas.</p>
+
+<p dir="ltr">Hemos proporcionado la mayoría de las respuestas a las preguntas que tendrás sobre los fundamentos del desarrollo web en esta parte de MDN. Si estás atascado, es bueno volver a leer los artículos asociados para ver si te perdiste algo.</p>
+
+<p dir="ltr">Si no estás seguro de qué artículo leer, intenta buscar en MDN algunas palabras clave relacionadas (como se indicó anteriormente), o intenta una búsqueda web general. Para buscar en MDN, puedes usar la funcionalidad de búsqueda incorporada del sitio o mejor aún, usar tu motor de búsqueda favorito y poner "mdn" delante del término de búsqueda, por ejemplo, "diseño web receptivo mdn" o "backgrounf-color mdn".</p>
+
+<h3 dir="ltr" id="Otros_recursos_en_línea">Otros recursos en línea</h3>
+
+<p>Ya mencionamos Stack Overflow, pero hay otros recursos en línea que pueden ayudar.</p>
+
+<p>Es bueno encontrar una comunidad de la que formar parte, y obtendrás mucho respeto si intentas ayudar a otros a responder sus preguntas y también a hacer las tuyas. Otros buenos ejemplos incluyen:</p>
+
+<ul dir="ltr">
+ <li><a href="https://discourse.mozilla.org/c/mdn" rel="noopener">Discurso MDN</a></li>
+ <li><a href="https://www.sitepoint.com/community/" rel="noopener">Foros de Sitepoint</a></li>
+ <li><a href="https://www.webdeveloper.com/" rel="noopener">Foros de webdeveloper.com</a></li>
+</ul>
+
+<p dir="ltr">Sin embargo, también tiene sentido encontrar grupos útiles en sitios de redes sociales como Twitter o Facebook. Busca grupos que discutan los temas de desarrollo web que te interesen y únete. Sigue a las personas en Twitter que sabes que son influyentes, inteligentes o simplemente parecen compartir muchos consejos útiles.</p>
+
+<h3 dir="ltr" id="Encuentros_físicos">Encuentros físicos</h3>
+
+<p dir="ltr">Por último, deberías intentar asistir a algunas reuniones físicas para conocer a otras personas de ideas afines, especialmente aquellas que atienden a principiantes. <a href="https://www.meetup.com/find/tech/" rel="noopener">meetup.com</a> es un buen lugar para encontrar reuniones físicas locales, y también puedes probar tu prensa local o lo que hay en los sitios.</p>
+
+<p dir="ltr">También puedes intentar asistir a conferencias web completas. Si bien estas pueden ser costosas, puedes intentar ofrecerte como voluntario con ellos, y muchas conferencias ofrecen boletos de tarifa reducida, por ejemplo, boletos de estudiante o diversidad.</p>
+
+<h2 dir="ltr" id="Ve_también">Ve también</h2>
+
+<ul dir="ltr">
+ <li><a href="https://www.coursera.org/learn/learning-how-to-learn" rel="noopener">Coursera: aprende a aprender</a></li>
+ <li><a href="https://www.freecodecamp.org/" rel="noopener">Freecodecamp</a></li>
+ <li><a href="https://www.codecademy.com/" rel="noopener">Codecademy</a></li>
+</ul>
diff --git a/files/es/learn/server-side/configuring_server_mime_types/index.html b/files/es/learn/server-side/configuring_server_mime_types/index.html
new file mode 100644
index 0000000000..f8144877ba
--- /dev/null
+++ b/files/es/learn/server-side/configuring_server_mime_types/index.html
@@ -0,0 +1,82 @@
+---
+title: Configurar correctamente los tipos MIME del servidor
+slug: Learn/Server-side/Configuring_server_MIME_types
+tags:
+  - Desarrollo_Web
+  - Estándares_Web
+  - Seguridad
+  - Todas_las_Categorías
+translation_of: Learn/Server-side/Configuring_server_MIME_types
+original_slug: Configurar_correctamente_los_tipos_MIME_del_servidor
+---
+<p>
+</p>
+<h3 id="Introduccion" name="Introduccion"> Introduccion </h3>
+<p>Por omisión, muchos servidores web estan configurados para reportar un tipo MIME de <code>texto/plano</code> ó <code>aplicacion/de fuente de octeto</code> para tipos de contenidos desconocidos. A medida son desarrollados nuevos tipos de contenidos, los administradores de red pueden equivocarse al añadirlos a la configuración del servidor web, y esta es la principal causa de problemas para usuarios de navegadores basados en Gecko, el cual respeta los tipos MIME tal y como son reportados por los servidores y las aplicaciones web.
+</p>
+<h3 id=".C2.BFQue_son_los_tipos_de_MIME.3F" name=".C2.BFQue_son_los_tipos_de_MIME.3F"> ¿Que son los tipos de MIME? </h3>
+<p>Los tipos de <abbr>MIME</abbr> describen el tipo de medio del contenido, sea del correo electrónico o el utilizado en los servidores o aplicaciones web, y tiene como proposito ayudar a guiar al navegador web acerca de como ha de ser procesado y mostrado el contenido. Ejemplos de tipos de MIME son:
+</p>
+<ul><li> <code>texto/html</code> para páginas web normales
+</li><li> <code>texto/plano</code> para texto común
+</li><li> <code>Aplicacion/de fuente octeto</code> que significa "descarga este archivo"
+</li><li> <code>Aplicacion/x-java-applet</code> para uso de applets de Java
+</li><li> <code>Aplicacion/pdf</code> para documentos de Adobe<sup>®</sup> PDF.
+</li></ul>
+<h3 id="Informaci.C3.B3n_T.C3.A9cnica" name="Informaci.C3.B3n_T.C3.A9cnica"> Información Técnica </h3>
+<p>MIME está actualmente definida en RFCs <a class="external" href="http://www.isi.edu/in-notes/rfc2045.txt">2045</a>, <a class="external" href="http://www.isi.edu/in-notes/rfc2046.txt">2046</a>, <a class="external" href="http://www.isi.edu/in-notes/rfc2047.txt">2047</a>, <a class="external" href="http://www.isi.edu/in-notes/rfc2048.txt">2048</a>, y <a class="external" href="http://www.isi.edu/in-notes/rfc2049.txt">2049</a> y los valores registrados para los tipos MIME estan disponibles en <a class="external" href="http://www.iana.org/assignments/media-types/index.html">IANA | MIME Media Types</a>. La <a class="external" href="http://www.w3.org/Protocols/HTTP/1.1/spec.html">HTTP specification</a> define un superconjunto de MIME el cual es utilizado para describir los tipos de medios usados en la red.
+</p>
+<h3 id=".C2.BFPor_qu.C3.A9_son_importantes_los_tipos_correctos_de_MIME.3F" name=".C2.BFPor_qu.C3.A9_son_importantes_los_tipos_correctos_de_MIME.3F"> ¿Por qué son importantes los tipos correctos de MIME? </h3>
+<p><img align="right" alt="Example of an incorrect MIME type result">
+Si el servidor de red o la aplicación informan un tipo incorrecto de MIME para el contenido, un navegador de red no tiene forma de saberlo, <i>de acuerdo a la especificación HTTP</i>, más si tenemos en cuenta que el autor especificó el contenido para ser procesado y mostrado en una forma diferente que la impuesta por el tipo MIME informado.
+</p><p>Otros navegadores de red, tal como el Microsoft<sup>®</sup> Internet Explorer, intentan determinar el tipo adecuado de MIME en servidores mal configurados, <i><a class="external" href="http://support.microsoft.com/default.aspx?sd=msdn&amp;scid=kb;en-us;293336">suponiendo</a></i> el tipo adecuado de MIME que debería ser. Esto protege a muchos administradores de red de sus propios errores, pues el Internet Explorer continúa procesando el contenido aunque, por ejemplo, una imagen haya sido informada como texto plano.
+</p>
+<h3 id=".C2.BFPor_qu.C3.A9_los_navegadores_no_deber.C3.ADan_suponer_tipos_MIME.3F" name=".C2.BFPor_qu.C3.A9_los_navegadores_no_deber.C3.ADan_suponer_tipos_MIME.3F"> ¿Por qué los navegadores no deberían suponer tipos MIME? </h3>
+<p>A parte de la violación de la especificación HTTP, es una mala estrategia para los navegadores suponer tipos MIME por las siguientes razones:
+</p>
+<h4 id="P.C3.A9rdida_del_control" name="P.C3.A9rdida_del_control"> Pérdida del control </h4>
+<p>Si el navegador ignora el tipo MIME reportado, los administradores de red y los autores dejarán de tener el control sobre cómo sus contenidos serán procesados.
+</p><p>Por ejemplo, un sitio de red orientado para desarrolladores de red puede enviar determinados ejemplos de documentos HTML como enteros <code>text/html</code> ó como <code>text/plain</code> para lograr documentos con enteros procesados y motrados como HTML ó como código fuente. Si el navegador supone el tipo MIME, esta posibilidad dejará de estar disponible para el autor.
+</p>
+<h4 id="Seguridad" name="Seguridad"> Seguridad </h4>
+<p>Algunos tipos de contenidos, tales como programas ejecutables, son inherentemente inseguros. Por este motivo, esos tipos MIME son generalmente restringidos en términos de qué acciones tomará el navegador de red al recibirlos. Por ejemplo, un programa ejecutable no debería ser ejecutado en la computadora de un usuario, y en su lugar debería aparecer un cuadro de diálogo <b>para preguntar al usuario</b> si desea descargar el archivo.
+</p><p>La suposición de tipos MIME ha llevado a fallas de seguridad en Internet Explorer, debido a autores maliciosos que reportaban el tipo MIME de un archivo peligroso como si fuera uno seguro, evitando así el cuadro de diálogo de descarga normal. El Internet Explorer suponía entonces que se trataba de un programa ejecutable y los corría en la computadora del usuario.
+</p>
+<h3 id="C.C3.B3mo_determinar_el_tipo_MIME_enviado_a_un_servidor" name="C.C3.B3mo_determinar_el_tipo_MIME_enviado_a_un_servidor"> Cómo determinar el tipo MIME enviado a un servidor </h3>
+<p>En Firefox, cargar el archivo y usar Herramientas | Información de página. Puede también usar <a class="external" href="http://www.rexswain.com/httpview.html">Rex Swain's HTTP Viewer</a> ó <a class="external" href="http://livehttpheaders.mozdev.org/">Live HTTP Headers</a> para ver los encabezados completos y contenido de cualquier archivo enviado desde un servidor de red.
+</p><p>De acuerdo a los estándares, una <code>meta</code> etiqueta que brinda el tipo MIME tal como <code><span class="nowiki">&lt;meta http-equiv="Content-Type" content="text/html"&gt;</span></code> debería ser ignorado si hay una <code>Content-Type</code> línea en el encabezado. En vez de buscar esta línea en la fuente HTML, use las técnicas anteriores para determinar el tipo MIME enviado por un servidor.
+</p>
+<h3 id="C.C3.B3mo_determinar_el_tipo_correcto_de_MIME_para_su_contenido" name="C.C3.B3mo_determinar_el_tipo_correcto_de_MIME_para_su_contenido"> Cómo determinar el tipo correcto de MIME para su contenido </h3>
+<p>Hay ciertos pasos los cuales pueden llevar a derminar el correcto tipo de valor MIME a ser usado para su contenido.
+</p>
+<ol><li> Si su contenido fue creado usando la aplicación de software del vendedor, lea la documentación del vendedor para ver qué tipos MIME debería n ser informados para los diferentes tipos de medios.
+</li><li> Mire en el <a class="external" href="http://www.iana.org/assignments/media-types/index.html">IANA | Registro de Tipos de medios MIME</a> que contiene todos los tipos MIME registrados.
+</li><li> Si el tipo de medio es mostrado usando un plug-in en Netscape Gecko, instale el plug-in y luego mire en Ayuda-&gt;Acerca en le Menú Plug-in para ver qué tipos MIME están asociados con el tipo de medio.
+</li><li> Buscar la extensión del archivo en <a class="external" href="http://filext.com/">FILExt</a> para ver qué tipos MIME están asociados con esa expresión.
+</li></ol>
+<h3 id="C.C3.B3mo_configurar_su_servidor_para_enviar_los_tipos_MIME_correctos" name="C.C3.B3mo_configurar_su_servidor_para_enviar_los_tipos_MIME_correctos"> Cómo configurar su servidor para enviar los tipos MIME correctos </h3>
+<ul><li> Si está usando un servidor de red Apache, simplemente copie esto <a href="es/Sample_.htaccess_file">sample .htaccess file</a> en el directorio que contiene los archivos que quiere enviar con los tipos correctos MIME. Si tiene un subdirectorio entero de archivos, sólo ubique el archivo en el directorio principal; No necesita ubicarlo en cada subdirectorio.
+</li><li> Si usa Microsoft IIS, vea <a class="external" href="http://www.microsoft.com/technet/prodtechnol/windows2000serv/technologies/iis/maintain/featusability/mimeiis.mspx">este artículo</a> en Microsoft TechNet.
+</li><li> Si utiliza un servidor script para generar contenido, puede generalmente agregar una línea cerca del principio de su script. Puede servir contenido otro que HTML desde Perl, PHP, ASP, ó Java — sólo cambie el tipo MIME adecuado.
+<ul><li> Para Perl CGI, debería tener la línea <code>print "Content-Type: text/html\n\n";</code> antes que cualquier otras líneas de salida. Si utiliza el módulo CGI, puede utilizar la línea <code>print $cgi-&gt;header('text/html');</code> en lugar de, donde <code>$cgi</code> es su referencia para la instancia CGI.
+</li><li> Para PHP, debería tener la línea <code>header('Content-Type: text/html');</code> antes que cualquier otras líneas de salida.
+</li><li> Para ASP, debería tener la línea <code>response.ContentType = "text/html";</code> antes que cualquier otras líneas de salida.
+</li><li> Para un servlet Java, debería tener la línea <code>response.setContentType("text/html");</code> al principio de su <code>doGet</code> ó <code>doPost</code> método, donde <code>response</code> es una referencia a <code>HttpServletResponse</code>.
+</li></ul>
+</li></ul>
+<h3 id="Enlaces_Relacionados" name="Enlaces_Relacionados"> Enlaces Relacionados </h3>
+<ul><li><a href="es/Tipo_MIME_incorrecto_en_archivos_CSS">Tipo MIME incorrecto en archivos CSS</a>
+</li><li><a class="external" href="http://www.iana.org/assignments/media-types/index.html">IANA | MIME Media Types</a>
+</li><li><a class="external" href="http://www.w3.org/Protocols/HTTP/1.1/spec.html">Hypertext Transfer Protocol — HTTP/1.0</a>
+</li><li><a class="external" href="http://support.microsoft.com/default.aspx?sd=msdn&amp;scid=kb;en-us;293336">Microsoft - 293336 - INFO: WebCast: MIME Type Handling in Microsoft Internet Explorer</a>
+</li><li><a class="external" href="http://msdn.microsoft.com/workshop/networking/moniker/overview/appendix_a.asp">Microsoft - Appendix A: MIME Type Detection in Internet Explorer</a>
+</li><li><a class="external" href="http://www.microsoft.com/windows/ie/downloads/critical/q290108/">Microsoft - Security Update, March 29, 2001</a>
+</li><li><a class="external" href="http://www.microsoft.com/windows/ie/downloads/critical/Q313675/">Microsoft - Security Update, December 13, 2001</a>
+</li></ul>
+<div class="originaldocinfo">
+<h3 id="Informaci.C3.B3n_del_Documento_Original" name="Informaci.C3.B3n_del_Documento_Original"> Información del Documento Original </h3>
+<ul><li> Autor: Bob Clary
+</li><li> Fecha de la última modificación: 20 Feb 2003
+</li></ul>
+</div>
+{{ languages( { "en": "en/Properly_Configuring_Server_MIME_Types" } ) }}
diff --git a/files/es/learn/server-side/django/introducción/index.html b/files/es/learn/server-side/django/introducción/index.html
deleted file mode 100644
index 484b311a2c..0000000000
--- a/files/es/learn/server-side/django/introducción/index.html
+++ /dev/null
@@ -1,282 +0,0 @@
----
-title: Introducción a Django
-slug: Learn/Server-side/Django/Introducción
-tags:
-  - Aprendizaje
-  - CodigoScript
-  - Principiante
-  - Programación lado servidor
-  - Python
-  - django
-  - introducción
-translation_of: Learn/Server-side/Django/Introduction
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/Server-side/Django/development_environment", "Learn/Server-side/Django")}}</div>
-
-<p class="summary">En este primer artículo de Django responderemos la pregunta ¿Qué es Django? y daremos una visión general de lo que hace que este framework sea tan especial. Vamos a delinear las características principales, incluidas algunas de las funcionalidades avanzadas que no tendremos tiempo de cubrir con detalle en este módulo.  Tambien mostraremos algunos de los componentes principales de una aplicación de Django. (aunque en este momento no cuentes con un entorno de desarrollo en el cual probarlo).</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Pre requisitos:</th>
-   <td>Conocimientos basicos en informatica. Una comprensión general de <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/First_steps">programación del lado del servidor</a>, y en particular de los mecanimos de <a href="/en-US/docs/Learn/Server-side/First_steps/Client-Server_overview">interacciones cliente-servidor en los sitios web</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivos:</th>
-   <td>Familiarizarse con lo que es Django, que funcionalidad proporciona y los componentes principales de una aplicación Django.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_Django">¿Qué es Django?</h2>
-
-<p>Django es un framework web de alto nivel que permite el desarrollo rápido de sitios web seguros y mantenibles. Desarrollado por programadores experimentados, Django se encarga de gran parte de las complicaciones del desarrollo web, por lo que puedes concentrarte en escribir tu aplicación sin necesidad de reinventar la rueda. Es gratuito y de código abierto, tiene una comunidad próspera y activa, una gran documentación y muchas opciones de soporte gratuito y de pago.</p>
-
-<p>Django te ayuda a escribir software que es:</p>
-
-<dl>
- <dt>Completo</dt>
- <dd>Django sigue la filosofía "Baterías incluidas" y provee casi todo lo que los desarrolladores quisieran que tenga "de fábrica". Porque todo lo que necesitas es parte de un único "producto", todo funciona a la perfección, sigue principios de diseño consistentes y tiene una amplia y<a href="https://docs.djangoproject.com/en/1.10/"> actualizada documentación</a>.</dd>
- <dt>Versátil</dt>
- <dd>Django puede ser (y ha sido) usado para construir casi cualquier tipo de sitio web — desde sistemas manejadores de contenidos y wikis, hasta redes sociales y sitios de noticias. Puede funcionar con cualquier framework en el lado del cliente, y puede devolver contenido en casi cualquier formato (incluyendo HTML, RSS feeds, JSON, XML, etc). ¡El sitio que estás leyendo actualmente está basado en Django!<br>
- <br>
- Internamente, mientras ofrece opciones para casi cualquier funcionalidad que desees (distintos motores de base de datos , motores de plantillas, etc.), también puede ser extendido para usar otros componentes si es necesario.</dd>
- <dt>Seguro</dt>
- <dd>Django ayuda a los desarrolladores evitar varios errores comunes de seguridad al proveer un framework que ha sido diseñado para "hacer lo correcto" para proteger el sitio web automáticamente. Por ejemplo, Django, proporciona una manera segura de administrar cuentas de usuario y contraseñas, evitando así errores comunes como colocar informaciones de sesión en cookies donde es vulnerable (en lugar de eso las cookies solo contienen una clave y los datos se almacenan en la base de datos) o se almacenan directamente las contraseñas en un hash de contraseñas.<br>
-  <br>
- <em>Un hash de contraseña es un valor de longitud fija creado al enviar la contraseña a una <a href="https://en.wikipedia.org/wiki/Cryptographic_hash_function">cryptographic hash function</a>. Django puede validar si la contraseña ingresada es correcta enviándola a través de una función hash y comparando la salida con el valor hash almacenado. Sin embargo debido a la naturaleza "unidireccional" de la función, incluso si un valor hash almacenado se ve comprometido es difícil para un atacante resolver la contraseña original.</em><br>
- <br>
- Django permite protección contra algunas vulnerabilidades de forma predeterminada, incluida la inyección SQL, scripts entre sitios, falsificación de solicitudes entre sitios y clickjacking (consulte <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/First_steps/Website_security">Seguridad de sitios web</a> para obtener más detalles sobre dichos ataques).</dd>
- <dt>Escalable</dt>
- <dd>Django usa un componente basado en la arquitectura “<a href="https://en.wikipedia.org/wiki/Shared_nothing_architecture">shared-nothing</a>” (cada parte de la arquitectura es independiente de las otras, y por lo tanto puede ser reemplazado o cambiado si es necesario). Teniendo en cuenta una clara separación entre las diferentes partes significa que puede escalar para aumentar el tráfico al agregar hardware en cualquier nivel: servidores de cache, servidores de bases de datos o servidores de aplicación. Algunos de los sitios más concurridos han escalado a Django para satisfacer sus demandas (por ejemplo, Instagram y Disqus, por nombrar solo dos).</dd>
- <dt>Mantenible</dt>
- <dd>El código de Django está escrito usando principios y patrones de diseño para fomentar la creación de código mantenible y reutilizable. En particular, utiliza el principio No te repitas "Don't Repeat Yourself" (DRY) para que no exista una duplicación innecesaria, reduciendo la cantidad de código. Django también promueve la agrupación de la funcionalidad relacionada en "aplicaciones" reutilizables y en un nivel más bajo, agrupa código relacionado en módulos (siguiendo el patrón <a href="/en-US/Apps/Fundamentals/Modern_web_app_architecture/MVC_architecture">Model View Controller (MVC)</a>).</dd>
- <dt>Portable</dt>
- <dd>Django está escrito en Python, el cual se ejecuta en muchas plataformas. Lo que significa que no está sujeto a ninguna plataforma en particular, y puede ejecutar sus aplicaciones en muchas distribuciones de Linux, Windows y Mac OS X. Además, Django cuenta con el respaldo de muchos proveedores de alojamiento web, y que a menudo proporcionan una infraestructura específica y documentación para el alojamiento de sitios de Django.</dd>
-</dl>
-
-<h2 id="¿De_dónde_vino">¿De dónde vino?</h2>
-
-<p>Django fue desarrollado inicialmente entre 2003 y 2005 por un equipo que era responsable de crear y mantener sitios web de periódicos. Después de crear varios sitios, el equipo empezó a tener en cuenta y reutilizar muchos códigos y patrones de diseño comunes. Este código común se convirtió en un framework web genérico, que fue de código abierto, conocido como proyecto "Django" en julio de 2005.</p>
-
-<p>Django ha continuado creciendo y mejorando desde su primer hito, el lanzamiento de la versión (1.0) en septiembre de 2008, hasta el reciente lanzamiento de la versión 1.11 (2017). Cada lanzamiento ha añadido nuevas funcionalidades y solucionado errores, que van desde soporte de nuevos tipos de bases de datos, motores de plantillas, caching, hasta la adición de funciones genéricas y clases de visualización (que reducen la cantidad de código que los desarrolladores tiene que escribir para numerosas tareas de programación).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Consulte las <span style="line-height: 1.5;"><a href="https://docs.djangoproject.com/en/1.10/releases/">notas de lanzamiento</a></span><span style="line-height: 1.5;"> en el sitio web de Django para ver qué ha cambiado en las versiones recientes y cúanto trabajo se lleva a cabo para mejorar Django.</span></p>
-</div>
-
-<p>Django es ahora un próspero proyecto colaborativo de código abierto, con miles de usuarios y contribuidores. Mientras que todavía presenta algunas características que reflejan su origen, Django ha evolucionado en un framework versátil que es capaz de desarrollar cualquier tipo de sitio web.</p>
-
-<h2 id="¿Qué_tan_Popular_es_Django">¿Qué tan Popular es Django?</h2>
-
-<p>No hay una medida de popularidad definitiva y disponible de inmediato de "frameworks de lado servidor" (aunque sitios como <a href="http://hotframeworks.com/">Hot Frameworks</a> intentan evaluar la popularidad usando mecanismos como contar el número de proyectos en Github y preguntas en StackOverflow de cada plataforma). Una pregunta mejor es si Django es lo "suficientemente popular" para evitar los problemas de las plataformas menos populares. ¿Continúa evolucionando? ¿Puedes conseguir la ayuda que necesitas? ¿Hay alguna posibilidad de que consigas un trabajo pagado si aprendes Django?</p>
-
-<p>De acuerdo con el número de sitios que usan Django, el número de gente que contribuye al código base, y el número de gente que proporciona soporte tanto libre como pagado, podemos entonces decir que sí, !Django es un framework popular!</p>
-
-<p>Los sitios de alto nivel que usan Django incluyen: Disqus, Instagram, Knight Foundation, MacArthur Foundation, Mozilla, National Geographic, Open Knowledge Foundation, Pinterest y Open Stack (fuente: <a href="https://www.djangoproject.com/">Página de inicio de Django</a>).</p>
-
-<h2 id="¿Es_Django_dogmático">¿Es Django dogmático?</h2>
-
-<p>Los frameworks web frecuentemente se refieren a sí mismos como "dogmáticos" ("<em>opinionated</em>") o "no dogmáticos" ("<em>unopinionated</em>").</p>
-
-<p>Los frameworks dogmáticos son aquellos que opinan acerca de la "manera correcta" de gestionar cualquier tarea en particular. Ofrecen soporte para el desarrollo rápido en un <em>dominio en particular</em> (resolver problemas de un tipo en particular) porque la manera correcta de hacer cualquier cosa está generalmente bien comprendida y bien documentada.</p>
-
-<p>Sin embargo pueden ser menos flexibles para resolver problemas fuera de su dominio principal, y tienden a ofrecer menos opciones para elegir qué componentes y enfoques pueden usarse.</p>
-
-<p>Los framewoks no dogmáticos, por contra, tienen muchas menos restricciones sobre el modo mejor de unir componentes para alcanzar un objetivo, o incluso qué componentes deberían usarse. Hacen más fácil para los desarrolladores usar las herramientas más adecuadas para completar una tarea en particular, si bien al coste de que necesitas encontrar esos componentes por tí mismo.</p>
-
-<p>Django es "dogmático pero no del todo" y por tanto entrega "lo mejor de ambos mundos". Proporciona un conjunto de componentes para gestionar la mayoría de las tareas de desarrollo web y una (o dos) maneras preferidas de usarlos. Sin embargo, la arquitectura desacoplada de Django implica que puedes normalmente escoger y seleccionar de entre numerosas opciones diferentes o añadir soporte para otras completamente nuevas, si lo deseas.</p>
-
-<h2 id="¿Qué_pinta_tiene_el_código_de_Django">¿Qué pinta tiene el código de Django?</h2>
-
-<p>En un sitio web tradicional basado en datos, una aplicación web espera peticiones HTTP del explorador web (o de otro cliente). Cuando se recibe una petición la aplicación elabora lo que se necesita basándose en la URL y posiblemente en la información incluida en los datos <code>POST</code> o <code>GET</code>. Dependiendo de qué se necesita quizás pueda entonces leer o escribir información desde una base de datos o realizar otras tareas requeridas para satisfacer la petición. La aplicación devolverá a continuación una respuesta al explorador web, con frecuencia creando dinámicamente una página HTML para que el explorador la presente insertando los datos recuperados en marcadores de posición dentro de una plantilla HTML.</p>
-
-<p>Las aplicaciones web de Django normalmente agrupan el código que gestiona cada uno de estos pasos en ficheros separados:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13931/basic-django.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
-
-<ul>
- <li><strong>URLs: </strong>Aunque es posible procesar peticiones de cada URL individual vía una función individual, es mucho más sostenible escribir una función de visualización separada para cada recurso. Se usa un mapeador URL para redirigir las peticiones HTTP a la vista apropiada basándose en la URL de la petición. El mapeador URL se usa para redirigir las peticiones HTTP a la vista apropiada basándose en la URL de la petición. El mapeador URL puede también emparejar patrones de cadenas o dígitos específicos que aparecen en una URL y los pasan a la función de visualización como datos.</li>
- <li><strong>Vista (View):</strong> Una vista es una función de gestión de peticiones que recibe peticiones HTTP y devuelve respuestas HTTP. Las vistas acceden a los datos que necesitan para satisfacer las peticiones por medio de <em>modelos</em>, y delegan el formateo de la respuesta a las <em>plantillas</em> (<em>"templates"</em>).</li>
- <li><strong>Modelos (Models):</strong> Los Modelos son objetos de Python que definen la estructura de los datos de una aplicación y proporcionan mecanismos para gestionar (añadir, modificar y borrar) y consultar registros en la base de datos.</li>
- <li><strong>Plantillas (Templates):</strong> una plantilla (template) es un fichero de texto que define la estructura o diagrama de otro fichero (tal como una página HTML), con marcadores de posición que se utilizan para representar el contenido real. Una <em>vista</em> puede crear dinámicamente una página usando una plantilla, rellenandola con datos de un <em>modelo</em>. Una plantilla se puede usar para definir la estructura de cualquier tipo de fichero; ¡no tiene porqué ser HTML!</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Django se refiere a este tipo de organización como arquitectura Modelo Vista Plantilla "Model View Template (MVT)". Tiene muchas similaridades con la arquitectura más familiar <a href="/en-US/docs/Web/Apps/Fundamentals/Modern_web_app_architecture/MVC_architecture">Model View Controller</a>. </p>
-</div>
-
-<ul>
-</ul>
-
-<p>Las secciones de más abajo te darán una idea de la pinta que tienen estas partes principales de una aplicación Django (entraremos en más detalles más adelante en el curso, una vez que hallamos configurado un entorno de desarrollo).</p>
-
-<h3 id="Enviar_la_petición_a_la_vista_correcta_urls.py">Enviar la petición a la vista correcta (urls.py)</h3>
-
-<p>Un mapeador URL está normalmente almacenado en un fichero llamado <strong>urls.py</strong>. En el ejemplo más abajo el mapeador (<code>urlpatterns</code>) define una lista de mapeos entre <em>patrones</em> URL específicos y sus correspondientes funciones de visualización. Si se recibe una Petición HTTP que tiene una URL que empareja un patrón específico (ej. <code>r'^$'</code>, más abajo) se realizará una llamada y se pasará la petición a la función de visualización asociada (ej.  <code>views.index</code>).</p>
-
-<pre>urlpatterns = [
-    <strong>url(r'^$', views.index),</strong>
-    url(r'^([0-9]+)/$', views.best),
-]
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Un poco de Python:</p>
-
-<ul>
- <li>El objeto <code>urlpatterns</code> es una lista de funciones <code>url()</code>. En Python, las listas se definen usando using corchetes. Los elementos se separan con comas y pueden tener una <a href="https://docs.python.org/2/faq/design.html#why-does-python-allow-commas-at-the-end-of-lists-and-tuples">coma colgante opcional</a>. Por ejemplo: <code>[item1, item2, item3,]</code>.</li>
- <li>La extraña sintaxis de los patrones se conoce como <em>"expresión regular"</em>. ¡Hablaremos sobre ellas en un artículo posterior!.</li>
- <li>El segundo argumento de <code>url()</code> es otra función a la que se llamará cuando se encuentre un patrón que coincida. La notación <code>views.index</code> indica que la función se llama <code>index()</code> y se puede encontrar en un módulo llamado <code>views</code> (es decir, dentro del fichero llamado <code>views.py</code>).</li>
-</ul>
-</div>
-
-<h3 id="Manejar_la_petición_views.py">Manejar la petición (views.py)</h3>
-
-<p>Las vistas son el corazón de la aplicación web, recibiendo peticiones HTTP de los clientes web y devolviendo respuestas HTTP. Entre éstas, organizan los otros recursos del framework para acceder a las bases de datos, consolidar plantillas, etc.</p>
-
-<p>El ejemplo más abajo muestra una mínima función de visualización <code>index()</code>, que podría ser llamada por nuestro mapeador de URL de la sección anterior. Al igual que todas las funciones de visualización, recibe un objeto <code>HttpRequest</code> como parámetro (<code>request</code>) y devuelve un objeto <code>HttpResponse</code>. En este caso no hacemos nada con la petición y nuestra respuesta simplemente devuelve una cadena insertada de forma fija en el código. Te mostraremos una petición que hace algo más interesante en la siguiente sección.</p>
-
-<pre class="brush: python">## fichero: views.py (funciones de visualizacion de Django)
-from django.http import HttpResponse
-
-def index(request):
-    # Obtener un HttpRequest - el parametro peticion
-    # Realizar operaciones usando la infomracion de la peticion.
-    # Devolver una HttpResponse
-    return HttpResponse('!Hola desde Django!')
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Un poco de Python:</p>
-
-<ul>
- <li><a href="https://docs.python.org/3/tutorial/modules.html">Módulos Python</a> son "bibliotecas" de funciones, almacenadas en ficheros separados, que podríamos querer usar en nuestro código. Aquí importamos sólo el objeto <code>HttpResponse</code> desde el módulo  <code>django.http</code> de manera que podamos usarlo en nuestra vista: <code>from django.http import HttpResponse</code>. Hay también otras formas de importar algunos o todos los objetos de un módulo.</li>
- <li>Las funciones se declaran usando la plabra clave <code>def</code> tal como se muestra arriba, con parámetros con nombre listados entre paréntesis después del nombre de la función; la línea entera termina con dos puntos. Fíjate como las líneas siguientes están todas ellas <strong>indentadas</strong>. La indentación es importante, ya que especifica que las líneas de código están dentro de ese bloque en particular (la indentación obligatoria es una característica clave de Python, y es una razón por la que el código de Python es tan fácil de leer.</li>
-</ul>
-</div>
-
-<ul>
-</ul>
-
-<p>Las vistas se almacenan normalmente en un fichero llamado <strong>views.py</strong>.</p>
-
-<h3 id="Definir_modelos_de_datos_models.py">Definir modelos de datos (models.py)</h3>
-
-<p>Las aplicaciones web Django manejan y consultan datos a través de objetos Python referidos como modelos. Los modelos definen la estructura de los datos almacenados, incluyendo los <em>tipos</em> de campos y posiblemente también su tamaño máximo, los valores por defecto, la lista de selección de opciones, texto de ayuda para documentación, etiquetas de texto para formularios, etc. La definición del modelo es independiente de la base de datos subyacente — puedes elegir una entre varias como parte de la configuración de tu proyecto. Una vez que has seleccionado qué base de datos quieres usar, no necesitas en absoluto comunicarte con ella directamente — sólo hay que escribir la estructura de la base y otro código y Django se encarga por tí de todo el trabajo sucio de comunicarse con la base de datos.</p>
-
-<p>El fragmento de código de más abajo muestra un modelo de Django muy simple para un objeto <code>Team</code>. La clase <code>Team</code> deriva de la clase de django <code>models.Model</code>. Define el nombre de un equipo y su nivel como campos de tipo carácter y especifica un número máximo de caracteres que pueden ser almacenados en cada registro. El <code>team_level</code> puede ser un valor de entre varios, de manera que lo definimos como un campo de opciones y proporcionamos un mapeo entre opciones para mostrar y datos para almacenar, junto con un valor por defecto.</p>
-
-<pre class="brush: python"># filename: models.py
-
-from django.db import models
-
-class Team(models.Model):
-    team_name = models.CharField(max_length=40)
-
-    TEAM_LEVELS = (
-        ('U09', 'Under 09s'),
-        ('U10', 'Under 10s'),
-        ('U11', 'Under 11s'),
-        ...  #list other team levels
-    )
-    team_level = models.CharField(max_length=3,choices=TEAM_LEVELS,default='U11')
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Un poco de Python:</p>
-
-<ul>
- <li>Python soporta "programación orientada a objetos", un estilo de programación donde organizamos nuestro código en objetos, que incluyen datos relacionados y funciones para operar con los datos. Los objetos también pueden heredarse/extenderse/derivarse de otros objetos, permitiendo que se comparta un comportamiento común entre objetos relacionados. En Python usamos la palabra clave <code>class</code> para definir el "prototipo" de un objeto. Podemos crear múltiples <em>instancias</em> específicas de ese tipo de objeto basado en el modelo especificado en la clase.<br>
-  Así por ejemplo, aquí tenemos una clase <code>Team</code>, que deriva de la clase <code>Model</code>. Esto significa que es un modelo y que contendrá los métodos de un modelo, pero también podemos darle características especializadas propias. En nuestro modelo definimos los campos de nuestra base que necesitaremos para almacenar nuestros datos, dándoles nombres específicos. Django usa estas definiciones, incluídos los nombres de los campos para crear la base subyacente.</li>
-</ul>
-</div>
-
-<h3 id="Consultar_datos_views.py">Consultar datos (views.py)</h3>
-
-<p>El modelo de Django proporciona una API de consulta simple para buscar en la base de datos. Esta puede buscar concidencias contra varios campos al mismo tiempo usando diferentes criterios (ej. exacto, insensible a las mayúsculas, mayor que, etc.), y puede soportar sentencias complejas (por ejemplo, puedes especificar que se busque equipos U11 que tengan un nombre de equipo que empiece por "Fr" o termine con "al").</p>
-
-<p>El fragmento de código de más abajo muestra una función de visualización (manejador de recursos) para presentar en pantalla todos nuestros equipos U09. La línea en negrilla muestra como podemos usar la API de consulta del modelo para filtrar todos los registros donde el campo <code>team_level</code> tenga exactamente el texto 'U09' (fíjate como este criterio se pasa como argumento a la función<code> filter()</code> con el nombre del campo y tipo de coincidencia separados por un doble guion bajo: <strong>team_level__exact</strong>).</p>
-
-<pre class="brush: python">## filename: views.py
-
-from django.shortcuts import render
-from .models import Team
-
-def index(request):
-    <strong>list_teams = Team.objects.filter(team_level__exact="U09")</strong>
-    context = {'youngest_teams': list_teams}
-    return render(request, '/best/index.html', context)
-</pre>
-
-<dl>
-</dl>
-
-<p>Esta función utiliza la función <code>render()</code> para crear la <code>HttpResponse</code> que se envía de vuelta al explorador. Esta función es un <em>atajo</em>; crea un fichero HTML mediante la combinación de una plantilla HTML específica y algunos datos para insertar en ella (proporcionados en la variable "<code>context</code>"). En la siguiente sección mostramos como la plantilla tiene los datos insertados en ella para crear el HTML.</p>
-
-<h3 id="Renderización_de_los_datos_plantillas_HTML">Renderización de los datos (plantillas HTML)</h3>
-
-<p>Los sistemas de plantillas permiten especificar la estructura de un documento de salida usando marcadores de posición para los datos que serán rellenados cuando se genere la página. Las plantillas se usan con frecuencia para crear HTML, también pueden crear otros tipos de documentos. Django soporta de fábrica tanto su sistema de plantillas nativo como otra biblioteca Python popular llamada <strong>Jinja2</strong> (y se puede hacer que soporte otros sistemas si hace falta).</p>
-
-<p>El fragmento de código de más abajo muestra el aspecto que podría tener la plantilla HTML llamada por la función <code>render()</code> de la sección anterior. Esta plantilla ha sido escrita bajo la suposición de que cuando sea renderizada tendrá acceso a una variable tipo lista llamada <code>youngest_teams</code> (contenida en la variable <code>context</code> dentro de la función <code>render()</code> de más arriba). Dentro del esqueleto HTML tenemos una expresión que primero comprueba que existe la variable <code>youngest_teams</code>, y luego itera sobre ella en un bucle <code>for</code>. En cada iteración la plantilla presenta cada valor del campo <code>team_name</code> del equipo en un elemento {{htmlelement("li")}}.</p>
-
-<pre class="brush: python">## filename: best/templates/best/index.html
-
-&lt;!DOCTYPE html&gt;
-&lt;html lang="en"&gt;
-&lt;body&gt;
-
- {% if youngest_teams %}
-    &lt;ul&gt;
-    {% for team in youngest_teams %}
-        &lt;li&gt;\{\{ team.team_name \}\}&lt;/li&gt;
-    {% endfor %}
-    &lt;/ul&gt;
-{% else %}
-    &lt;p&gt;No teams are available.&lt;/p&gt;
-{% endif %}
-
-&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<h2 id="¿Qué_más_puedes_hacer">¿Qué más puedes hacer?</h2>
-
-<p>Las secciones prededentes muestran las principales características que usarás en casi todas las aplicaciones web: mapeo de URLs, vistas, modelos y plantillas. Sólo unas pocas de las otras cosas que Django proporciona y que incluyen:</p>
-
-<ul>
- <li><strong>Formularios</strong>: Los formularios HTML se usan para recolectar datos de los usuarios para su procesamiento en el servidor. Django simplifica la creación, validación y procesamiento de los formularios.</li>
- <li><strong>Autenticación y permisos de los usuarios</strong>: Django incluye un sistema robusto de autenticación y permisos que ha sido construido con la seguridad en mente.</li>
- <li><strong>Cacheo</strong>: La creación dinámica de contenido es mucho más intensiva computacionalmente (y lenta) que un servico de contenido estático. Django proporciona un cacheo flexible de forma que puedes almacenar todo o parte de una página renderizada para que no sea re-renderizada nada más que cuando sea necesario.</li>
- <li><strong>Sitio de Administracion</strong>: el sitio de administración de Django está incluido por defecto cuando creas una app usando el esqueleto básico. Esto hace que sea trivialmente fácil proporcionar una página de adminsitración para que los administradores puedan crear, editar y visualizar cualquiera de los modelos de datos de su sitio.</li>
- <li><strong>Serialización de datos</strong>: Django hace fácil el serializar y servir tus datos como XML o JSON. Esto puede ser útil cuando se está creando un servicio web (un sitio web que sólo sirve datos para ser consumidos por otras aplicaciones o sitios, y que no presenta en pantalla nada por sí mismo), o cuando se crea un sitio web en el que el código del lado cliente maneja toda la renderización de los datos.</li>
-</ul>
-
-<h2 id="Sumario">Sumario</h2>
-
-<p>¡Felicidades, has completado el primer paso en tu viaje por Django! Deberías ahora ser consciente de los principales beneficios de Django, algo de su historia y a groso modo la pinta que tienen cada una de las partes principales de una de sus apps. Deberías también haber aprendido unas pocas cosas acerca del lenguaje de programación Python, incluyendo la sintaxis para las listas, funciones y clases.</p>
-
-<p>Has visto ya algo de código real de Django más arriba, pero a diferencia del código de lado cliente, necesitas configurar un entorno de desarrollo para hacerlo funcionar. Ese será nuestro siguiente paso.</p>
-
-<div>{{NextMenu("Learn/Server-side/Django/development_environment", "Learn/Server-side/Django")}}
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Introducci%C3%B3n">Introducción a Django</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/development_environment">Puesta en marcha de un entorno de desarrollo de Django</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Tutorial_local_library_website">Tutorial de Django: Sitio web "Biblioteca Local"</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/skeleton_website">Tutorial de Django Parte 2: Creación del esqueleto de un sitio web</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Models">Tutorial de Django Parte 3: Uso de modelos</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Admin_site">Tutorial de Django Parte 4: Sitio de Administración de Django</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Home_page">Tutorial de Django Parte 5: Creación de tu página de inicio</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Generic_views">Tutorial de Django Parte 6: Listas genéricas y vistas de detalle</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Sessions">Tutorial de Django Parte 7: Framework de sesiones</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Authentication">Tutorial de Django Parte 8: Autenticación y permisos de Usuario</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Forms">Tutorial de Django Parte 9: Trabajo con formularios</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Testing">Tutorial de Django Parte 10: Probando una aplicación web Django</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Deployment">Tutorial de Django Parte 11: Desplegando Django a producción</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/web_application_security">Seguridad de las aplicaciones web Django</a></li>
- <li><a href="/es/docs/Learn/Server-side/Django/django_assessment_blog">DIY Django mini blog</a></li>
-</ul>
-</div>
diff --git a/files/es/learn/server-side/django/introduction/index.html b/files/es/learn/server-side/django/introduction/index.html
new file mode 100644
index 0000000000..a1571a1d00
--- /dev/null
+++ b/files/es/learn/server-side/django/introduction/index.html
@@ -0,0 +1,283 @@
+---
+title: Introducción a Django
+slug: Learn/Server-side/Django/Introduction
+tags:
+  - Aprendizaje
+  - CodigoScript
+  - Principiante
+  - Programación lado servidor
+  - Python
+  - django
+  - introducción
+translation_of: Learn/Server-side/Django/Introduction
+original_slug: Learn/Server-side/Django/Introducción
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/Server-side/Django/development_environment", "Learn/Server-side/Django")}}</div>
+
+<p class="summary">En este primer artículo de Django responderemos la pregunta ¿Qué es Django? y daremos una visión general de lo que hace que este framework sea tan especial. Vamos a delinear las características principales, incluidas algunas de las funcionalidades avanzadas que no tendremos tiempo de cubrir con detalle en este módulo.  Tambien mostraremos algunos de los componentes principales de una aplicación de Django. (aunque en este momento no cuentes con un entorno de desarrollo en el cual probarlo).</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Pre requisitos:</th>
+   <td>Conocimientos basicos en informatica. Una comprensión general de <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/First_steps">programación del lado del servidor</a>, y en particular de los mecanimos de <a href="/en-US/docs/Learn/Server-side/First_steps/Client-Server_overview">interacciones cliente-servidor en los sitios web</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivos:</th>
+   <td>Familiarizarse con lo que es Django, que funcionalidad proporciona y los componentes principales de una aplicación Django.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_Django">¿Qué es Django?</h2>
+
+<p>Django es un framework web de alto nivel que permite el desarrollo rápido de sitios web seguros y mantenibles. Desarrollado por programadores experimentados, Django se encarga de gran parte de las complicaciones del desarrollo web, por lo que puedes concentrarte en escribir tu aplicación sin necesidad de reinventar la rueda. Es gratuito y de código abierto, tiene una comunidad próspera y activa, una gran documentación y muchas opciones de soporte gratuito y de pago.</p>
+
+<p>Django te ayuda a escribir software que es:</p>
+
+<dl>
+ <dt>Completo</dt>
+ <dd>Django sigue la filosofía "Baterías incluidas" y provee casi todo lo que los desarrolladores quisieran que tenga "de fábrica". Porque todo lo que necesitas es parte de un único "producto", todo funciona a la perfección, sigue principios de diseño consistentes y tiene una amplia y<a href="https://docs.djangoproject.com/en/1.10/"> actualizada documentación</a>.</dd>
+ <dt>Versátil</dt>
+ <dd>Django puede ser (y ha sido) usado para construir casi cualquier tipo de sitio web — desde sistemas manejadores de contenidos y wikis, hasta redes sociales y sitios de noticias. Puede funcionar con cualquier framework en el lado del cliente, y puede devolver contenido en casi cualquier formato (incluyendo HTML, RSS feeds, JSON, XML, etc). ¡El sitio que estás leyendo actualmente está basado en Django!<br>
+ <br>
+ Internamente, mientras ofrece opciones para casi cualquier funcionalidad que desees (distintos motores de base de datos , motores de plantillas, etc.), también puede ser extendido para usar otros componentes si es necesario.</dd>
+ <dt>Seguro</dt>
+ <dd>Django ayuda a los desarrolladores evitar varios errores comunes de seguridad al proveer un framework que ha sido diseñado para "hacer lo correcto" para proteger el sitio web automáticamente. Por ejemplo, Django, proporciona una manera segura de administrar cuentas de usuario y contraseñas, evitando así errores comunes como colocar informaciones de sesión en cookies donde es vulnerable (en lugar de eso las cookies solo contienen una clave y los datos se almacenan en la base de datos) o se almacenan directamente las contraseñas en un hash de contraseñas.<br>
+  <br>
+ <em>Un hash de contraseña es un valor de longitud fija creado al enviar la contraseña a una <a href="https://en.wikipedia.org/wiki/Cryptographic_hash_function">cryptographic hash function</a>. Django puede validar si la contraseña ingresada es correcta enviándola a través de una función hash y comparando la salida con el valor hash almacenado. Sin embargo debido a la naturaleza "unidireccional" de la función, incluso si un valor hash almacenado se ve comprometido es difícil para un atacante resolver la contraseña original.</em><br>
+ <br>
+ Django permite protección contra algunas vulnerabilidades de forma predeterminada, incluida la inyección SQL, scripts entre sitios, falsificación de solicitudes entre sitios y clickjacking (consulte <a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/First_steps/Website_security">Seguridad de sitios web</a> para obtener más detalles sobre dichos ataques).</dd>
+ <dt>Escalable</dt>
+ <dd>Django usa un componente basado en la arquitectura “<a href="https://en.wikipedia.org/wiki/Shared_nothing_architecture">shared-nothing</a>” (cada parte de la arquitectura es independiente de las otras, y por lo tanto puede ser reemplazado o cambiado si es necesario). Teniendo en cuenta una clara separación entre las diferentes partes significa que puede escalar para aumentar el tráfico al agregar hardware en cualquier nivel: servidores de cache, servidores de bases de datos o servidores de aplicación. Algunos de los sitios más concurridos han escalado a Django para satisfacer sus demandas (por ejemplo, Instagram y Disqus, por nombrar solo dos).</dd>
+ <dt>Mantenible</dt>
+ <dd>El código de Django está escrito usando principios y patrones de diseño para fomentar la creación de código mantenible y reutilizable. En particular, utiliza el principio No te repitas "Don't Repeat Yourself" (DRY) para que no exista una duplicación innecesaria, reduciendo la cantidad de código. Django también promueve la agrupación de la funcionalidad relacionada en "aplicaciones" reutilizables y en un nivel más bajo, agrupa código relacionado en módulos (siguiendo el patrón <a href="/en-US/Apps/Fundamentals/Modern_web_app_architecture/MVC_architecture">Model View Controller (MVC)</a>).</dd>
+ <dt>Portable</dt>
+ <dd>Django está escrito en Python, el cual se ejecuta en muchas plataformas. Lo que significa que no está sujeto a ninguna plataforma en particular, y puede ejecutar sus aplicaciones en muchas distribuciones de Linux, Windows y Mac OS X. Además, Django cuenta con el respaldo de muchos proveedores de alojamiento web, y que a menudo proporcionan una infraestructura específica y documentación para el alojamiento de sitios de Django.</dd>
+</dl>
+
+<h2 id="¿De_dónde_vino">¿De dónde vino?</h2>
+
+<p>Django fue desarrollado inicialmente entre 2003 y 2005 por un equipo que era responsable de crear y mantener sitios web de periódicos. Después de crear varios sitios, el equipo empezó a tener en cuenta y reutilizar muchos códigos y patrones de diseño comunes. Este código común se convirtió en un framework web genérico, que fue de código abierto, conocido como proyecto "Django" en julio de 2005.</p>
+
+<p>Django ha continuado creciendo y mejorando desde su primer hito, el lanzamiento de la versión (1.0) en septiembre de 2008, hasta el reciente lanzamiento de la versión 1.11 (2017). Cada lanzamiento ha añadido nuevas funcionalidades y solucionado errores, que van desde soporte de nuevos tipos de bases de datos, motores de plantillas, caching, hasta la adición de funciones genéricas y clases de visualización (que reducen la cantidad de código que los desarrolladores tiene que escribir para numerosas tareas de programación).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Consulte las <span style="line-height: 1.5;"><a href="https://docs.djangoproject.com/en/1.10/releases/">notas de lanzamiento</a></span><span style="line-height: 1.5;"> en el sitio web de Django para ver qué ha cambiado en las versiones recientes y cúanto trabajo se lleva a cabo para mejorar Django.</span></p>
+</div>
+
+<p>Django es ahora un próspero proyecto colaborativo de código abierto, con miles de usuarios y contribuidores. Mientras que todavía presenta algunas características que reflejan su origen, Django ha evolucionado en un framework versátil que es capaz de desarrollar cualquier tipo de sitio web.</p>
+
+<h2 id="¿Qué_tan_Popular_es_Django">¿Qué tan Popular es Django?</h2>
+
+<p>No hay una medida de popularidad definitiva y disponible de inmediato de "frameworks de lado servidor" (aunque sitios como <a href="http://hotframeworks.com/">Hot Frameworks</a> intentan evaluar la popularidad usando mecanismos como contar el número de proyectos en Github y preguntas en StackOverflow de cada plataforma). Una pregunta mejor es si Django es lo "suficientemente popular" para evitar los problemas de las plataformas menos populares. ¿Continúa evolucionando? ¿Puedes conseguir la ayuda que necesitas? ¿Hay alguna posibilidad de que consigas un trabajo pagado si aprendes Django?</p>
+
+<p>De acuerdo con el número de sitios que usan Django, el número de gente que contribuye al código base, y el número de gente que proporciona soporte tanto libre como pagado, podemos entonces decir que sí, !Django es un framework popular!</p>
+
+<p>Los sitios de alto nivel que usan Django incluyen: Disqus, Instagram, Knight Foundation, MacArthur Foundation, Mozilla, National Geographic, Open Knowledge Foundation, Pinterest y Open Stack (fuente: <a href="https://www.djangoproject.com/">Página de inicio de Django</a>).</p>
+
+<h2 id="¿Es_Django_dogmático">¿Es Django dogmático?</h2>
+
+<p>Los frameworks web frecuentemente se refieren a sí mismos como "dogmáticos" ("<em>opinionated</em>") o "no dogmáticos" ("<em>unopinionated</em>").</p>
+
+<p>Los frameworks dogmáticos son aquellos que opinan acerca de la "manera correcta" de gestionar cualquier tarea en particular. Ofrecen soporte para el desarrollo rápido en un <em>dominio en particular</em> (resolver problemas de un tipo en particular) porque la manera correcta de hacer cualquier cosa está generalmente bien comprendida y bien documentada.</p>
+
+<p>Sin embargo pueden ser menos flexibles para resolver problemas fuera de su dominio principal, y tienden a ofrecer menos opciones para elegir qué componentes y enfoques pueden usarse.</p>
+
+<p>Los framewoks no dogmáticos, por contra, tienen muchas menos restricciones sobre el modo mejor de unir componentes para alcanzar un objetivo, o incluso qué componentes deberían usarse. Hacen más fácil para los desarrolladores usar las herramientas más adecuadas para completar una tarea en particular, si bien al coste de que necesitas encontrar esos componentes por tí mismo.</p>
+
+<p>Django es "dogmático pero no del todo" y por tanto entrega "lo mejor de ambos mundos". Proporciona un conjunto de componentes para gestionar la mayoría de las tareas de desarrollo web y una (o dos) maneras preferidas de usarlos. Sin embargo, la arquitectura desacoplada de Django implica que puedes normalmente escoger y seleccionar de entre numerosas opciones diferentes o añadir soporte para otras completamente nuevas, si lo deseas.</p>
+
+<h2 id="¿Qué_pinta_tiene_el_código_de_Django">¿Qué pinta tiene el código de Django?</h2>
+
+<p>En un sitio web tradicional basado en datos, una aplicación web espera peticiones HTTP del explorador web (o de otro cliente). Cuando se recibe una petición la aplicación elabora lo que se necesita basándose en la URL y posiblemente en la información incluida en los datos <code>POST</code> o <code>GET</code>. Dependiendo de qué se necesita quizás pueda entonces leer o escribir información desde una base de datos o realizar otras tareas requeridas para satisfacer la petición. La aplicación devolverá a continuación una respuesta al explorador web, con frecuencia creando dinámicamente una página HTML para que el explorador la presente insertando los datos recuperados en marcadores de posición dentro de una plantilla HTML.</p>
+
+<p>Las aplicaciones web de Django normalmente agrupan el código que gestiona cada uno de estos pasos en ficheros separados:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13931/basic-django.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
+
+<ul>
+ <li><strong>URLs: </strong>Aunque es posible procesar peticiones de cada URL individual vía una función individual, es mucho más sostenible escribir una función de visualización separada para cada recurso. Se usa un mapeador URL para redirigir las peticiones HTTP a la vista apropiada basándose en la URL de la petición. El mapeador URL se usa para redirigir las peticiones HTTP a la vista apropiada basándose en la URL de la petición. El mapeador URL puede también emparejar patrones de cadenas o dígitos específicos que aparecen en una URL y los pasan a la función de visualización como datos.</li>
+ <li><strong>Vista (View):</strong> Una vista es una función de gestión de peticiones que recibe peticiones HTTP y devuelve respuestas HTTP. Las vistas acceden a los datos que necesitan para satisfacer las peticiones por medio de <em>modelos</em>, y delegan el formateo de la respuesta a las <em>plantillas</em> (<em>"templates"</em>).</li>
+ <li><strong>Modelos (Models):</strong> Los Modelos son objetos de Python que definen la estructura de los datos de una aplicación y proporcionan mecanismos para gestionar (añadir, modificar y borrar) y consultar registros en la base de datos.</li>
+ <li><strong>Plantillas (Templates):</strong> una plantilla (template) es un fichero de texto que define la estructura o diagrama de otro fichero (tal como una página HTML), con marcadores de posición que se utilizan para representar el contenido real. Una <em>vista</em> puede crear dinámicamente una página usando una plantilla, rellenandola con datos de un <em>modelo</em>. Una plantilla se puede usar para definir la estructura de cualquier tipo de fichero; ¡no tiene porqué ser HTML!</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Django se refiere a este tipo de organización como arquitectura Modelo Vista Plantilla "Model View Template (MVT)". Tiene muchas similaridades con la arquitectura más familiar <a href="/en-US/docs/Web/Apps/Fundamentals/Modern_web_app_architecture/MVC_architecture">Model View Controller</a>. </p>
+</div>
+
+<ul>
+</ul>
+
+<p>Las secciones de más abajo te darán una idea de la pinta que tienen estas partes principales de una aplicación Django (entraremos en más detalles más adelante en el curso, una vez que hallamos configurado un entorno de desarrollo).</p>
+
+<h3 id="Enviar_la_petición_a_la_vista_correcta_urls.py">Enviar la petición a la vista correcta (urls.py)</h3>
+
+<p>Un mapeador URL está normalmente almacenado en un fichero llamado <strong>urls.py</strong>. En el ejemplo más abajo el mapeador (<code>urlpatterns</code>) define una lista de mapeos entre <em>patrones</em> URL específicos y sus correspondientes funciones de visualización. Si se recibe una Petición HTTP que tiene una URL que empareja un patrón específico (ej. <code>r'^$'</code>, más abajo) se realizará una llamada y se pasará la petición a la función de visualización asociada (ej.  <code>views.index</code>).</p>
+
+<pre>urlpatterns = [
+    <strong>url(r'^$', views.index),</strong>
+    url(r'^([0-9]+)/$', views.best),
+]
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Un poco de Python:</p>
+
+<ul>
+ <li>El objeto <code>urlpatterns</code> es una lista de funciones <code>url()</code>. En Python, las listas se definen usando using corchetes. Los elementos se separan con comas y pueden tener una <a href="https://docs.python.org/2/faq/design.html#why-does-python-allow-commas-at-the-end-of-lists-and-tuples">coma colgante opcional</a>. Por ejemplo: <code>[item1, item2, item3,]</code>.</li>
+ <li>La extraña sintaxis de los patrones se conoce como <em>"expresión regular"</em>. ¡Hablaremos sobre ellas en un artículo posterior!.</li>
+ <li>El segundo argumento de <code>url()</code> es otra función a la que se llamará cuando se encuentre un patrón que coincida. La notación <code>views.index</code> indica que la función se llama <code>index()</code> y se puede encontrar en un módulo llamado <code>views</code> (es decir, dentro del fichero llamado <code>views.py</code>).</li>
+</ul>
+</div>
+
+<h3 id="Manejar_la_petición_views.py">Manejar la petición (views.py)</h3>
+
+<p>Las vistas son el corazón de la aplicación web, recibiendo peticiones HTTP de los clientes web y devolviendo respuestas HTTP. Entre éstas, organizan los otros recursos del framework para acceder a las bases de datos, consolidar plantillas, etc.</p>
+
+<p>El ejemplo más abajo muestra una mínima función de visualización <code>index()</code>, que podría ser llamada por nuestro mapeador de URL de la sección anterior. Al igual que todas las funciones de visualización, recibe un objeto <code>HttpRequest</code> como parámetro (<code>request</code>) y devuelve un objeto <code>HttpResponse</code>. En este caso no hacemos nada con la petición y nuestra respuesta simplemente devuelve una cadena insertada de forma fija en el código. Te mostraremos una petición que hace algo más interesante en la siguiente sección.</p>
+
+<pre class="brush: python">## fichero: views.py (funciones de visualizacion de Django)
+from django.http import HttpResponse
+
+def index(request):
+    # Obtener un HttpRequest - el parametro peticion
+    # Realizar operaciones usando la infomracion de la peticion.
+    # Devolver una HttpResponse
+    return HttpResponse('!Hola desde Django!')
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Un poco de Python:</p>
+
+<ul>
+ <li><a href="https://docs.python.org/3/tutorial/modules.html">Módulos Python</a> son "bibliotecas" de funciones, almacenadas en ficheros separados, que podríamos querer usar en nuestro código. Aquí importamos sólo el objeto <code>HttpResponse</code> desde el módulo  <code>django.http</code> de manera que podamos usarlo en nuestra vista: <code>from django.http import HttpResponse</code>. Hay también otras formas de importar algunos o todos los objetos de un módulo.</li>
+ <li>Las funciones se declaran usando la plabra clave <code>def</code> tal como se muestra arriba, con parámetros con nombre listados entre paréntesis después del nombre de la función; la línea entera termina con dos puntos. Fíjate como las líneas siguientes están todas ellas <strong>indentadas</strong>. La indentación es importante, ya que especifica que las líneas de código están dentro de ese bloque en particular (la indentación obligatoria es una característica clave de Python, y es una razón por la que el código de Python es tan fácil de leer.</li>
+</ul>
+</div>
+
+<ul>
+</ul>
+
+<p>Las vistas se almacenan normalmente en un fichero llamado <strong>views.py</strong>.</p>
+
+<h3 id="Definir_modelos_de_datos_models.py">Definir modelos de datos (models.py)</h3>
+
+<p>Las aplicaciones web Django manejan y consultan datos a través de objetos Python referidos como modelos. Los modelos definen la estructura de los datos almacenados, incluyendo los <em>tipos</em> de campos y posiblemente también su tamaño máximo, los valores por defecto, la lista de selección de opciones, texto de ayuda para documentación, etiquetas de texto para formularios, etc. La definición del modelo es independiente de la base de datos subyacente — puedes elegir una entre varias como parte de la configuración de tu proyecto. Una vez que has seleccionado qué base de datos quieres usar, no necesitas en absoluto comunicarte con ella directamente — sólo hay que escribir la estructura de la base y otro código y Django se encarga por tí de todo el trabajo sucio de comunicarse con la base de datos.</p>
+
+<p>El fragmento de código de más abajo muestra un modelo de Django muy simple para un objeto <code>Team</code>. La clase <code>Team</code> deriva de la clase de django <code>models.Model</code>. Define el nombre de un equipo y su nivel como campos de tipo carácter y especifica un número máximo de caracteres que pueden ser almacenados en cada registro. El <code>team_level</code> puede ser un valor de entre varios, de manera que lo definimos como un campo de opciones y proporcionamos un mapeo entre opciones para mostrar y datos para almacenar, junto con un valor por defecto.</p>
+
+<pre class="brush: python"># filename: models.py
+
+from django.db import models
+
+class Team(models.Model):
+    team_name = models.CharField(max_length=40)
+
+    TEAM_LEVELS = (
+        ('U09', 'Under 09s'),
+        ('U10', 'Under 10s'),
+        ('U11', 'Under 11s'),
+        ...  #list other team levels
+    )
+    team_level = models.CharField(max_length=3,choices=TEAM_LEVELS,default='U11')
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Un poco de Python:</p>
+
+<ul>
+ <li>Python soporta "programación orientada a objetos", un estilo de programación donde organizamos nuestro código en objetos, que incluyen datos relacionados y funciones para operar con los datos. Los objetos también pueden heredarse/extenderse/derivarse de otros objetos, permitiendo que se comparta un comportamiento común entre objetos relacionados. En Python usamos la palabra clave <code>class</code> para definir el "prototipo" de un objeto. Podemos crear múltiples <em>instancias</em> específicas de ese tipo de objeto basado en el modelo especificado en la clase.<br>
+  Así por ejemplo, aquí tenemos una clase <code>Team</code>, que deriva de la clase <code>Model</code>. Esto significa que es un modelo y que contendrá los métodos de un modelo, pero también podemos darle características especializadas propias. En nuestro modelo definimos los campos de nuestra base que necesitaremos para almacenar nuestros datos, dándoles nombres específicos. Django usa estas definiciones, incluídos los nombres de los campos para crear la base subyacente.</li>
+</ul>
+</div>
+
+<h3 id="Consultar_datos_views.py">Consultar datos (views.py)</h3>
+
+<p>El modelo de Django proporciona una API de consulta simple para buscar en la base de datos. Esta puede buscar concidencias contra varios campos al mismo tiempo usando diferentes criterios (ej. exacto, insensible a las mayúsculas, mayor que, etc.), y puede soportar sentencias complejas (por ejemplo, puedes especificar que se busque equipos U11 que tengan un nombre de equipo que empiece por "Fr" o termine con "al").</p>
+
+<p>El fragmento de código de más abajo muestra una función de visualización (manejador de recursos) para presentar en pantalla todos nuestros equipos U09. La línea en negrilla muestra como podemos usar la API de consulta del modelo para filtrar todos los registros donde el campo <code>team_level</code> tenga exactamente el texto 'U09' (fíjate como este criterio se pasa como argumento a la función<code> filter()</code> con el nombre del campo y tipo de coincidencia separados por un doble guion bajo: <strong>team_level__exact</strong>).</p>
+
+<pre class="brush: python">## filename: views.py
+
+from django.shortcuts import render
+from .models import Team
+
+def index(request):
+    <strong>list_teams = Team.objects.filter(team_level__exact="U09")</strong>
+    context = {'youngest_teams': list_teams}
+    return render(request, '/best/index.html', context)
+</pre>
+
+<dl>
+</dl>
+
+<p>Esta función utiliza la función <code>render()</code> para crear la <code>HttpResponse</code> que se envía de vuelta al explorador. Esta función es un <em>atajo</em>; crea un fichero HTML mediante la combinación de una plantilla HTML específica y algunos datos para insertar en ella (proporcionados en la variable "<code>context</code>"). En la siguiente sección mostramos como la plantilla tiene los datos insertados en ella para crear el HTML.</p>
+
+<h3 id="Renderización_de_los_datos_plantillas_HTML">Renderización de los datos (plantillas HTML)</h3>
+
+<p>Los sistemas de plantillas permiten especificar la estructura de un documento de salida usando marcadores de posición para los datos que serán rellenados cuando se genere la página. Las plantillas se usan con frecuencia para crear HTML, también pueden crear otros tipos de documentos. Django soporta de fábrica tanto su sistema de plantillas nativo como otra biblioteca Python popular llamada <strong>Jinja2</strong> (y se puede hacer que soporte otros sistemas si hace falta).</p>
+
+<p>El fragmento de código de más abajo muestra el aspecto que podría tener la plantilla HTML llamada por la función <code>render()</code> de la sección anterior. Esta plantilla ha sido escrita bajo la suposición de que cuando sea renderizada tendrá acceso a una variable tipo lista llamada <code>youngest_teams</code> (contenida en la variable <code>context</code> dentro de la función <code>render()</code> de más arriba). Dentro del esqueleto HTML tenemos una expresión que primero comprueba que existe la variable <code>youngest_teams</code>, y luego itera sobre ella en un bucle <code>for</code>. En cada iteración la plantilla presenta cada valor del campo <code>team_name</code> del equipo en un elemento {{htmlelement("li")}}.</p>
+
+<pre class="brush: python">## filename: best/templates/best/index.html
+
+&lt;!DOCTYPE html&gt;
+&lt;html lang="en"&gt;
+&lt;body&gt;
+
+ {% if youngest_teams %}
+    &lt;ul&gt;
+    {% for team in youngest_teams %}
+        &lt;li&gt;\{\{ team.team_name \}\}&lt;/li&gt;
+    {% endfor %}
+    &lt;/ul&gt;
+{% else %}
+    &lt;p&gt;No teams are available.&lt;/p&gt;
+{% endif %}
+
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<h2 id="¿Qué_más_puedes_hacer">¿Qué más puedes hacer?</h2>
+
+<p>Las secciones prededentes muestran las principales características que usarás en casi todas las aplicaciones web: mapeo de URLs, vistas, modelos y plantillas. Sólo unas pocas de las otras cosas que Django proporciona y que incluyen:</p>
+
+<ul>
+ <li><strong>Formularios</strong>: Los formularios HTML se usan para recolectar datos de los usuarios para su procesamiento en el servidor. Django simplifica la creación, validación y procesamiento de los formularios.</li>
+ <li><strong>Autenticación y permisos de los usuarios</strong>: Django incluye un sistema robusto de autenticación y permisos que ha sido construido con la seguridad en mente.</li>
+ <li><strong>Cacheo</strong>: La creación dinámica de contenido es mucho más intensiva computacionalmente (y lenta) que un servico de contenido estático. Django proporciona un cacheo flexible de forma que puedes almacenar todo o parte de una página renderizada para que no sea re-renderizada nada más que cuando sea necesario.</li>
+ <li><strong>Sitio de Administracion</strong>: el sitio de administración de Django está incluido por defecto cuando creas una app usando el esqueleto básico. Esto hace que sea trivialmente fácil proporcionar una página de adminsitración para que los administradores puedan crear, editar y visualizar cualquiera de los modelos de datos de su sitio.</li>
+ <li><strong>Serialización de datos</strong>: Django hace fácil el serializar y servir tus datos como XML o JSON. Esto puede ser útil cuando se está creando un servicio web (un sitio web que sólo sirve datos para ser consumidos por otras aplicaciones o sitios, y que no presenta en pantalla nada por sí mismo), o cuando se crea un sitio web en el que el código del lado cliente maneja toda la renderización de los datos.</li>
+</ul>
+
+<h2 id="Sumario">Sumario</h2>
+
+<p>¡Felicidades, has completado el primer paso en tu viaje por Django! Deberías ahora ser consciente de los principales beneficios de Django, algo de su historia y a groso modo la pinta que tienen cada una de las partes principales de una de sus apps. Deberías también haber aprendido unas pocas cosas acerca del lenguaje de programación Python, incluyendo la sintaxis para las listas, funciones y clases.</p>
+
+<p>Has visto ya algo de código real de Django más arriba, pero a diferencia del código de lado cliente, necesitas configurar un entorno de desarrollo para hacerlo funcionar. Ese será nuestro siguiente paso.</p>
+
+<div>{{NextMenu("Learn/Server-side/Django/development_environment", "Learn/Server-side/Django")}}
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Introducci%C3%B3n">Introducción a Django</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/development_environment">Puesta en marcha de un entorno de desarrollo de Django</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Tutorial_local_library_website">Tutorial de Django: Sitio web "Biblioteca Local"</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/skeleton_website">Tutorial de Django Parte 2: Creación del esqueleto de un sitio web</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Models">Tutorial de Django Parte 3: Uso de modelos</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Admin_site">Tutorial de Django Parte 4: Sitio de Administración de Django</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Home_page">Tutorial de Django Parte 5: Creación de tu página de inicio</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Generic_views">Tutorial de Django Parte 6: Listas genéricas y vistas de detalle</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Sessions">Tutorial de Django Parte 7: Framework de sesiones</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Authentication">Tutorial de Django Parte 8: Autenticación y permisos de Usuario</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Forms">Tutorial de Django Parte 9: Trabajo con formularios</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Testing">Tutorial de Django Parte 10: Probando una aplicación web Django</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/Deployment">Tutorial de Django Parte 11: Desplegando Django a producción</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Django/web_application_security">Seguridad de las aplicaciones web Django</a></li>
+ <li><a href="/es/docs/Learn/Server-side/Django/django_assessment_blog">DIY Django mini blog</a></li>
+</ul>
+</div>
diff --git a/files/es/learn/server-side/first_steps/client-server_overview/index.html b/files/es/learn/server-side/first_steps/client-server_overview/index.html
new file mode 100644
index 0000000000..db0a949c2d
--- /dev/null
+++ b/files/es/learn/server-side/first_steps/client-server_overview/index.html
@@ -0,0 +1,335 @@
+---
+title: Visión General Cliente-Servidor
+slug: Learn/Server-side/First_steps/Client-Server_overview
+tags:
+  - Aprendizaje
+  - Codificación de scripts
+  - Guía
+  - Principiante
+  - Programación lado servidor
+  - Servidor
+  - introducción
+translation_of: Learn/Server-side/First_steps/Client-Server_overview
+original_slug: Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Server-side/First_steps/Introduction", "Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</div>
+
+<p class="summary">Ahora que conoces el propósito y los beneficios potenciales de la programación de lado-servidor vamos a examinar en detalle lo que ocurre cuando un servidor recibe una "petición dinámica" desde un explorador web. Ya que el código de lado servidor de la mayoría de los sitios web gestiona peticiones y respuestas de formas similares, este artículo te ayudará a entender lo que necesitas hacer para escribir la mayor parte de tu propio código.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>Conocimientos básicos de computación. Noción básica de lo que es un servidor.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Comprender lo que son las interacciones cliente-servidor en un sitio web dinámico, y en particular que operaciones necesita realizar el código de lado servidor.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>No hay código real en el debate porque ¡todavía no hemos seleccionado el framework web que usaremos para escribir nuestro código! Sin embargo este debate sí que es muy relevante incluso ahora, porque el comportamiento descrito debería ser implementado por tu código de lado servidor independientemente de qué lenguaje de programación o framework web hayas seleccionado.</p>
+
+<h2 id="Servidores_Web_y_HTTP_(iniciación)">Servidores Web y HTTP (iniciación)</h2>
+
+<p>Los exploradores web se comunican con los <a href="https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_web_server">servidores web</a> usando el Protocolo de Transferencia de HyperTexto (<strong>H</strong>yper<strong>T</strong>ext<strong>T</strong>ransfer <strong>P</strong>rotocol <a href="/en-US/docs/Web/HTTP">HTTP</a>). Cuando pinchas en un enlace sobre una página web, envías un formulario o ejecutas una búsqueda, el explorador envía una petición (<em>Request) </em>HTTP al servidor.</p>
+
+<p>Esta petición incluye:</p>
+
+<ul>
+ <li>Una URL que identifica el servidor de destino y un recurso (ej. un fichero HTML, un punto de datos particular en el servidor, o una herramienta a ejecutar).</li>
+ <li>Un método que define la acción requerida (por ejemplo, obtener un fichero o salvar o actualizar algunos datos). Los diferentes métodos/verbos y sus acciones asociadas se listan debajo:
+  <ul>
+   <li><code>GET</code>: Obtener un recurso específico (ej. un fichero HTML que contiene información acerca de un producto  o una lista de productos).</li>
+   <li><code>POST</code>: Crear un nuevo recurso (ej. añadir un nuevo artículo a una wiki, añadir un nuevo contacto a una base de datos). </li>
+   <li><code>HEAD</code>: Obtener la información de los metadatos sobre un recurso específico sin obtener el cuerpo entero tal como haría <code>GET</code>. Podrías, por ejemplo, usar una petición <code>HEAD</code> para encontrar la última vez que un  recurso fue actualizado, y a continuación usar la petición <code>GET</code> (más "cara") para descargar el recurso sólo si éste ha cambiado. </li>
+   <li><code>PUT</code>: Actualizar un recurso existente (o crear uno nuevo si no existe).</li>
+   <li><code>DELETE</code>: Borrar el recurso específico.</li>
+   <li><code>TRACE</code>, <code>OPTIONS</code>, <code>CONNECT</code>, <code>PATCH</code>: Estos verbos son para tareas menos comunes/avanzadas, por lo que no los trataremos aquí.</li>
+  </ul>
+ </li>
+ <li>Se puede codificar información adicional con la petición (por ejemplo, datos de un formulario HTML). La información puede ser codificada como:
+  <ul>
+   <li>Parámetros URL: Las peticiones <code>GET</code> codifican los datos en la URL enviada al servidor añadiendo al final pares nombre/valor — por ejemplo, <code>http://mysite.com<strong>?name=Fred&amp;age=11</strong></code>. Siempre encontrarás un signo de interrogación(<code>?</code>) separando los parámetros URL del resto de la misma, un signo igual (<code>=</code>) separando cada nombre de su valor asociado y un ampersand (<code>&amp;</code>) separando cada par. Los parámetros URL son inherentemente "inseguros" ya que pueden ser modificados por los usuarios y ser enviados de nuevo. Como consecuencia los parámetros URL/peticiones <code>GET</code> no se usan para peticiones de actualización de datos en el servidor.</li>
+   <li>Datos <code>POST</code>. Las peticiones <code>POST</code> añaden nuevos recursos, cuyos datos están codificados dentro del cuerpo de la petición.</li>
+   <li>Cookies de lado cliente. Los Cookies contienen datos de sesión acerca del cliente, incluyendo las claves que el servidor puede usar para determinar su estado de incio de sesión y los permisos/accesos a los recursos.</li>
+  </ul>
+ </li>
+</ul>
+
+<p>Los servidores web esperan los mensajes de petición de los clientes, los procesan cuando llegan y responden al explorador web con un mensaje de respuesta HTTP. La respuesta contiene un <a href="/en-US/docs/Web/HTTP/Status">código de estado de respuesta HTTP</a> que indica si la petición ha tenido éxito o no (ej. "<code>200 OK</code>" para indicar éxito, "<code>404 Not Found</code>" si el resurso no ha podido ser encontrado,  "<code>403 Forbidden</code>" si el usuario no está autorizado a acceder al recurso, etc). El cuerpo de la respuesta de éxito a una petición <code>GET</code> contendría el recurso solicitado.</p>
+
+<p>Cuando se devuelve una página HTML es renderizada por el explorador web. Como parte del procesamiento el explorador puede descubrir enlaces a otros recursos (ej. una página HTML normalmente referencia las páginas JavaScript y CSS), y enviará peticiones HTTP separadas para descargar estos ficheros.</p>
+
+<p>Los sitios web tanto estáticos como dinámicos (abordados en las secciones siguientes) usan exactamente los mismos protocolos/patrones de comunicación.</p>
+
+<h3 id="Ejemplo_de_peticiónrespuesta_GET">Ejemplo de petición/respuesta GET</h3>
+
+<p>Puedes realizar una petición <code>GET</code> simplemente pinchando sobre un enlace o buscando en un sitio (como la página inicial de un motor de búsquedas). Por ejemplo, la petición HTTP que se envía cuando realizas una búsqueda en MDN del término "visión general cliente servidor" se parecerá mucho al texto que se muestra más abajo (no será idéntica porque algunas partes del mensaje dependen de tu explorador/configuración).</p>
+
+<div class="note">
+<p>El formato de los mensajes HTTP está definido en el "estándard web" (<a href="http://www.rfc-editor.org/rfc/rfc7230.txt">RFC7230</a>). No necesitas conocer este nivel de detalle, pero al menos ¡ahora sabes de donde viene todo esto!</p>
+</div>
+
+<h4 id="La_petición">La petición</h4>
+
+<p>Cada linea de la petición contiene información sobre ella. La primera parte se llama <strong>cabecera</strong> o <strong>header</strong>, y contiene información útil sobre la petición, de la misma manera que un <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">HTML head</a> contiene información útil sobre un documento (pero no el contenido mismo, que está en el cuerpo):</p>
+
+<pre>GET https://developer.mozilla.org/en-US/search?q=client+server+overview&amp;topic=apps&amp;topic=html&amp;topic=css&amp;topic=js&amp;topic=api&amp;topic=webdev HTTP/1.1
+Host: developer.mozilla.org
+Connection: keep-alive
+Pragma: no-cache
+Cache-Control: no-cache
+Upgrade-Insecure-Requests: 1
+User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
+Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
+Referer: https://developer.mozilla.org/en-US/
+Accept-Encoding: gzip, deflate, sdch, br
+<code>Accept-Charset: ISO-8859-1,UTF-8;q=0.7,*;q=0.7</code>
+Accept-Language: en-US,en;q=0.8,es;q=0.6
+Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; csrftoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT; dwf_section_edit=False; dwf_sg_task_completion=False; _gat=1; _ga=GA1.2.1688886003.1471911953; ffo=true
+</pre>
+
+<p>La primera y segunda líneas contienen la mayoría de la información de la que hemos hablado arriba:</p>
+
+<ul>
+ <li>El tipo de petición (<code>GET</code>).</li>
+ <li>La URL del recurso de destino (<code>/en-US/search</code>).</li>
+ <li>Los parámetros URL (<code>q=client%2Bserver%2Boverview&amp;topic=apps&amp;topic=html&amp;topic=css&amp;topic=js&amp;topic=api&amp;topic=webdev</code>).</li>
+ <li>El destino/host del sitio web (developer.mozilla.org).</li>
+ <li>El final de la primera linea también incluye una cadena corta que identifica la versión del protocolo utilizado (<code>HTTP/1.1</code>).</li>
+</ul>
+
+<p>La última linea contiene información sobre los cookies del lado cliente — puedes ver que en este caso el cookie incluye un id para gestionar las sesiones (<code>Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; ...</code>).</p>
+
+<p>Las líneas restantes contienen información sobre el explorador web usado y la clase de respuestas que puede manejar. Por ejemplo, puedes ver aquí que:</p>
+
+<ul>
+ <li>Mi explorador (<code>User-Agent</code>) es Mozilla Firefox (<code>Mozilla/5.0</code>).</li>
+ <li>Puede aceptar información comprimida gzip (<code>Accept-Encoding: gzip</code>).</li>
+ <li>Puede aceptar el conjunto de caracteres especificado (<code>Accept-Charset: ISO-8859-1,UTF-8;q=0.7,*;q=0.7</code>) y los idiomas (<code>Accept-Language: de,en;q=0.7,en-us;q=0.3</code>).</li>
+ <li>La linea <code>Referer</code> indica la dirección de la página web que contenía el enlace a este recurso (es decir, el origen de la petición, <code>https://developer.mozilla.org/en-US/</code>).</li>
+</ul>
+
+<p>Las peticiones HTTP también pueden tener un cuerpo, pero está vacío en este caso.</p>
+
+<h4 id="La_respuesta">La respuesta</h4>
+
+<p>La primera parte de la respuesta a esta petición se muestra abajo. La cabecera o header contiene información como la siguiente:</p>
+
+<ul>
+ <li>La primera linea incluye el código de respuesta <code>200 OK</code>, que nos dice que la petición ha tenido éxito.</li>
+ <li>Podemos ver que la respuesta está formateada (<code>Content-Type</code>) en modo <code>text/html</code>.</li>
+ <li>Podemos ver que usa también el conjunto de caracteres UTF-8 (<code>Content-Type: text/html; charset=utf-8</code>).</li>
+ <li>La cabecera también nos dice lo grande que es (<code>Content-Length: 41823</code>).</li>
+</ul>
+
+<p>Al final del mensaje vemos el contenido del <strong>cuerpo</strong> (<strong>body</strong>) — que contiene el HTML real devuelto por la respuesta.</p>
+
+<pre class="brush: html">HTTP/1.1 200 OK
+Server: Apache
+X-Backend-Server: developer1.webapp.scl3.mozilla.com
+Vary: Accept,Cookie, Accept-Encoding
+Content-Type: text/html; charset=utf-8
+Date: Wed, 07 Sep 2016 00:11:31 GMT
+Keep-Alive: timeout=5, max=999
+Connection: Keep-Alive
+X-Frame-Options: DENY
+Allow: GET
+X-Cache-Info: caching
+Content-Length: 41823
+
+
+
+&lt;!DOCTYPE html&gt;
+&lt;html lang="en-US" dir="ltr" class="redesign no-js"  data-ffo-opensanslight=false data-ffo-opensans=false &gt;
+&lt;head prefix="og: http://ogp.me/ns#"&gt;
+  &lt;meta charset="utf-8"&gt;
+  &lt;meta http-equiv="X-UA-Compatible" content="IE=Edge"&gt;
+  &lt;script&gt;(function(d) { d.className = d.className.replace(/\bno-js/, ''); })(document.documentElement);&lt;/script&gt;
+  ...
+</pre>
+
+<p>El resto de la cabecera de la respuesta incluye información sobre la respuesta (ej. cuándo se generó), el servidor, y cómo espera el explorador manejar la página (ej. la linea <code>X-Frame-Options: DENY</code> le dice que al explorador que no está permitido incrustar esta página en un {{htmlelement("iframe")}} en otro sitio).</p>
+
+<h3 id="Ejemplo_de_peticiónrespuesta_POST">Ejemplo de petición/respuesta POST</h3>
+
+<p>Un HTTP <code>POST</code> se realiza cuando se envía un formulario que contiene información para ser guardada en el servidor.</p>
+
+<h4 id="La_petición_2">La petición</h4>
+
+<p>El texto de abajo muestra la petición HTTP realizada cuando un usuario envía al sitio los detalles de un nuevo perfil. El formato de la petición es casi el mismo que en la petición <code>GET</code> del ejemplo mostrado previamente, aunque la primera linea identifica esta petición como <code>POST</code>. </p>
+
+<pre class="brush: html">POST https://developer.mozilla.org/en-US/profiles/hamishwillee/edit HTTP/1.1
+Host: developer.mozilla.org
+Connection: keep-alive
+Content-Length: 432
+Pragma: no-cache
+Cache-Control: no-cache
+Origin: https://developer.mozilla.org
+Upgrade-Insecure-Requests: 1
+User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
+Content-Type: application/x-www-form-urlencoded
+Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
+Referer: https://developer.mozilla.org/en-US/profiles/hamishwillee/edit
+Accept-Encoding: gzip, deflate, br
+Accept-Language: en-US,en;q=0.8,es;q=0.6
+Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; _gat=1; csrftoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT; dwf_section_edit=False; dwf_sg_task_completion=False; _ga=GA1.2.1688886003.1471911953; ffo=true
+
+csrfmiddlewaretoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT&amp;user-username=hamishwillee&amp;user-fullname=Hamish+Willee&amp;user-title=&amp;user-organization=&amp;user-location=Australia&amp;user-locale=en-US&amp;user-timezone=Australia%2FMelbourne&amp;user-irc_nickname=&amp;user-interests=&amp;user-expertise=&amp;user-twitter_url=&amp;user-stackoverflow_url=&amp;user-linkedin_url=&amp;user-mozillians_url=&amp;user-facebook_url=</pre>
+
+<p>La principal diferencia es que la URL no tiene parámetros. Como puedes ver, la información del formulario se codifica en el cuerpo de la petición (por ejemplo, el nombre completo del nuevo usuario se establece usando: <code>&amp;user-fullname=Hamish+Willee</code>).</p>
+
+<h4 id="La_respuesta_2">La respuesta</h4>
+
+<p>La respuesta a la petición se muestra abajo. El código de estado "<code>302 Found</code>" le dice al explorador que el POST ha tenido éxito, y que debe realizar una segunda petición HTTP para cargar la página especificada en el campo <code>Location</code>. La información es de lo contrario similar a la respuesta a una petición <code>GET</code>.</p>
+
+<pre class="brush: html">HTTP/1.1 302 FOUND
+Server: Apache
+X-Backend-Server: developer3.webapp.scl3.mozilla.com
+Vary: Cookie
+Vary: Accept-Encoding
+Content-Type: text/html; charset=utf-8
+Date: Wed, 07 Sep 2016 00:38:13 GMT
+Location: https://developer.mozilla.org/en-US/profiles/hamishwillee
+Keep-Alive: timeout=5, max=1000
+Connection: Keep-Alive
+X-Frame-Options: DENY
+X-Cache-Info: not cacheable; request wasn't a GET or HEAD
+Content-Length: 0
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Las repuestas y las peticiones HTTP mostradas en estos ejemplos fueron capturadas usando la aplicación <a href="https://www.telerik.com/download/fiddler">Fiddler</a>, pero puedes obtener información similar usando sniffers web (ej. <a href="http://web-sniffer.net/">http://web-sniffer.net/</a>) o usando extensiones del explorador como <a href="https://addons.mozilla.org/en-US/firefox/addon/httpfox/">HttpFox</a>. Puedes probarlo por tí mismo. Usa una de las herramientas enlazadas, y a continuación navega a través de un sitio y edita información del perfil para ver las diferentes peticiones y respuestas. La mayoría de los exploradores modernos también tienen herramientas que monitorizan las peticiciones de red (Por ejemplo, la herramienta <a href="/en-US/docs/Tools/Network_Monitor">Network Monitor</a> en Firefox).</p>
+</div>
+
+<h2 id="Sitios_estáticos">Sitios estáticos</h2>
+
+<p>Un <em>sitio estático</em> es aquél que devuelve desde el servidor el mismo contenido establecido de forma fija en el código cada vez que se solicita una página en particular. De manera que si por ejemplo tienes una página sobre un producto en <code>/static/myproduct1.html</code> , a todos los usuarios se les devolverá la misma página. Si añades otro producto similar a tu sitio necesitarás añadir otra página (ej. <code>myproduct2.html</code>) etc... Esto puede llegar a ser realmente muy poco eficiente — ¿qué sucede cuando alcanzas miles de páginas de productos? Repetirías un montón de código a lo largo de cada página (la plantilla básica de la página, la estructura, etc), y si quisieras cambiar cualquier cosa de la estructura de la página — como añadir una nueva sección de "productos relacionados" por ejemplo — tendrías que cambiar cada página individualmente. </p>
+
+<div class="note">
+<p><strong>Nota</strong>: Los sitios estáticos son excelentes cuando tienes un pequeño número de páginas y quieres enviar el mismo contenido a todos los usuarios. Sin embargo pueden tener un coste de mantenimiento significante a medida que es número de páginas se hace grande.</p>
+</div>
+
+<p>Recapitulemos cómo funciona ésto, mirando otra vez el diagrama de la arquitectura de un sitio estático que vimos en el anterior artículo.</p>
+
+<p><img alt="A simplified diagram of a static web server." src="https://mdn.mozillademos.org/files/13841/Basic%20Static%20App%20Server.png"></p>
+
+<p>Cuando un usuario quiere navegar a una página, el explorador envía una petición HTTP <code>GET</code> especificando la URL de su página HTML. El servidor recupera el documento solicitado de su sistema de ficheros y devuelve una respuesta HTTP conteniendo el documento y un <a href="/en-US/docs/Web/HTTP/Status">código de estado de respuesta HTTP</a> "<code>200 OK</code>" (indicando éxito). El servidor podría devolver un código de estado diferente, por ejemplo "<code>404 Not Found</code>" si el fichero no está presente en el servidor, o "<code>301 Moved Permanently</code>" si el fichero existe pero ha sido redirigido a una localización diferente.</p>
+
+<p>El servidor de un sitio estático sólo tendrá que procesar peticiones GET, ya que el servidor no almacena ningún dato modificable. Tampoco cambia sus respuestas basádonse en los datos de la petición HTTP (ej. parámetros URL o cookies). </p>
+
+<p>Entendiendo cómo funcionan los sitios estáticos es útil sin embargo cuando se aprende programación de lado servidor, porque los sitios dinámicos gestionan las peticiones de ficheros estáticos (CSS, JavaScript, imágenes estáticas, etc.) exactamente de la misma forma.</p>
+
+<h2 id="Sitios_dinámicos">Sitios dinámicos</h2>
+
+<p>Un <em>sitio dinámico</em> es aquél que puede generar y devolver contenido basándose en la URL y los datos específicos de la petición (en vez de devolver siempre para una URL en particular el mismo fichero especificado en el código de forma fija). Usando el ejemplo de un sitio de productos, el servidor almacenaría "datos" del producto en una base de datos en vez de ficheros HTML individuales. Cuando se reciba una petición HTTP <code>GET</code> para un producto, el servidor determina el ID del mismo, extrae los datos de la base y construye la página HTML de la respuesta insertando los datos dentro de la plantilla HTML. Esto tiene una ventaja primordial sobre un sitio estático: </p>
+
+<p>Usar una base de datos permite que la información del producto se almacene de forma eficiente y que se pueda ampliar, modificar y buscar fácilmente.</p>
+
+<p>Usar plantillas HTML hace que sea muy fácil cambiar la estructura HTML, porque sólo se necesita hacer en un sólo lugar, en una única plantilla y no a lo largo de miles de páginas estáticas.</p>
+
+<h3 id="Anatomía_de_una_petición_dinámica">Anatomía de una petición dinámica</h3>
+
+<p>Esta sección proporciona una visión general paso a paso de un ciclo de petición y respuesta HTTP "dinámicas", construyendo con más detalle lo que vimos en el último artículo. Para "hacer cosas reales" usaremos el contexto del sitio web de un manager de equipos deportivos donde un entrenador puede seleccionar el nombre y tamaño de su equipo en un formulario HTML y obtener de vuelta una sugerencia de "mejor alineación" para el próximo partido. </p>
+
+<p>El diagrama de abajo muestra los elementos principales del sitio web del "entrenador del equipo", junto con etiquetas numeradas de la secuencia de operaciones cuando el entrenador accede a su lista de "mejor equipo". Las partes del sitio que lo hacen dinámico son las <em>Aplicaciones Web</em> (que es como llamaremos al código del lado servidor que procesa las peticiones HTTP y devuelve respuestas HTTP), la <em>Base de Datos</em>, que contiene la información sobre los jugadores, equipos, entrenadores y sus relaciones, y las <em>Plantillas HTML</em>.</p>
+
+<p><img alt="This is a diagram of a simple web server with step numbers for each of step of the client-server interaction." src="https://mdn.mozillademos.org/files/13829/Web%20Application%20with%20HTML%20and%20Steps.png" style="height: 584px; width: 1226px;"></p>
+
+<p>Después de que el entrenador envíe el formulario con el nombre del equipo y el número de jugadores, la secuencia de operaciones es la siguiente:</p>
+
+<ol>
+ <li>El explorador web crea una petición HTTP <code>GET</code> al servidor usando la URL base del recurso (<code>/best</code>) y codifica el equipo y número de jugadores como parámetros URL (ej. <code>/best?team=my_team_name&amp;show=11)</code> o formando parte de un patrón URL (ej. <code>/best/my_team_name/11/</code>). Se usa una petición <code>GET</code> porque la petición sólo recoge datos (no modifica ninguno).</li>
+ <li>El S<em>ervidor Web</em> detecta que la petición es "dinámica" y la reenvía a la <em>Aplicación</em> para que la procese (el servidor web determina como manejar diferentes URLs basándose en reglas de emparejamiento de patrones definidas en su configuración).</li>
+ <li>La <em>Aplicación Web</em> identifica que la intención de la petición es obtener la "lista del mejor equipo" basándose en la URL (<code>/best/</code>) y encuentra el nombre del equipo y el número de jugadores requeridos a partir de la URL. La <em>Aplicación Web</em> obtiene entonces la información solicitada de la base de datos (usando parámetros "internos" adicionales que definen qué jugadores son los "mejores", y posiblemente también obteniendo la identidad del entrenador que ha iniciado sesión a partir de un cookie del lado cliente).</li>
+ <li>La <em>Aplicación Web</em> crea dinámicamente una página HTML por medio de colocar los datos (de la <em>base</em>) en marcadores de posición dentro de la plantilla HTML.</li>
+ <li>La <em>Aplicación Web</em> devuelve el HTML generado al explorador web (via el <em>Servidor Web</em>), junto con un código de estado HTTP de 200 ("éxito"). Si algo impide que se pueda devolver el HTML entonces la <em>Aplicación Web</em> devolverá otro código — por ejemplo "404" para indicar que el equipo no existe.</li>
+ <li>El Explorador Web comenzará a continuación a procesar el HTML devuelto, enviando peticiones separadas para obtener cualquier otro fichero CSS o JavaScript que sea referenciado (ver paso 7).</li>
+ <li>El Servidor Web carga ficheros estáticos del sistema de ficheros y los devuelve al explorador directamente (de nuevo, la gestión correcta de los ficheros está basada en las reglas de configuración y de emparejamiento de patrones URL).</li>
+</ol>
+
+<p>La operación de actualizar un registro de la base de datos se gestionaría de forma similar, excepto que, como para cualquier actualización de la base de datos, la petición HTTP desde el explorador debería ser codificada como petición <code>POST</code>. </p>
+
+<h3 id="Realización_de_otros_trabajos">Realización de otros trabajos</h3>
+
+<p>La misión de una <em>Aplicación Web</em> es recibir peticiones HTTP y devolver respuestas HTTP. Mientras que interactuar con la base datos para obtener o actualizar información son tareas muy comunes, el código puede hacer otras cosas al mismo tiempo, o no interactuar con una base de datos en absoluto.</p>
+
+<p>Un buen ejemplo de una tarea adicional que una <em> Aplicación Web</em> podría realizar sería el envío de un correo electrónico a los usuarios para confirmar su registro en el sitio. El sito podría también realizar logging u otras operaciones.</p>
+
+<h3 id="Devolución_de_alguna_otra_cosa_distinta_a_HTML">Devolución de alguna otra cosa distinta a HTML</h3>
+
+<p>El código lado servidor de un sitio web no tiene que devolver fragmentos/ficheros HTML en la respuesta. Puede en vez de eso crear dinámicamente y devolver otros tipos de ficheros (texto, PDF, CSV, etc.) o incluso datos (jSON, XML, etc.).</p>
+
+<p>La idea de devolver datos a un explorador web de forma que pueda actualizar su propio contenido dinámicamente ({{glossary("AJAX")}}) ha estado dando vueltas durante bastante tiempo. Más recientemente han llegado a ser muy populares las "apps de una sola página", donde el sitio web entero está escrito con un solo fichero HTML que es actualizado dinámicamente cuando se necesita. Los sitios web creados usando este estilo de aplicación transfieren una gran parte del coste computacional desde el servidor al explorador web, y pueden dar como resultado sitios web que se comportan mucho más como aplicaciones nativas (con una respuesta rápida "highly responsive", etc.).</p>
+
+<h2 id="Los_frameworks_Web_simplifican_la_programación_de_lado_servidor">Los frameworks Web simplifican la programación de lado servidor</h2>
+
+<p>Los frameworks de lado servidor hacen mucho más fácil escribir código para gestionar las operaciones descritas más arriba.</p>
+
+<p>Una de las operaciones más importantes que realizan es proporcionar mecanismos simples para mapear las URLs de diferentes recursos/páginas a funciones para su gestión específicas. Esto hace más fácil mantener separado el código asociado con cada recurso. Esto tiene también beneficios en términos de mantenimiento, ya que puedes cambiar la URL usada para entregar una característica particular en un sitio, sin tener que cambiar la función de gestión.</p>
+
+<p>Por ejemplo, considera el siguiente código Django (Python) que mapea dos patrones URL a dos funciones de visualización. El primer patrón asegura que una petición HTTP con una URL de  <code>/best</code> sea pasada a la función llamada <code>index()</code> en el módulo <code>views</code>. En cambio, una petición que tiene el patrón "<code>/best/junior</code>", se pasará a la función de visualización <code>junior()</code>.</p>
+
+<pre class="brush: python"># file: best/urls.py
+#
+
+from django.conf.urls import url
+
+from . import views
+
+urlpatterns = [
+    # example: /best/
+    url(r'^$', views.index),
+    # example: /best/junior/
+    url(r'^junior/$', views.junior),
+]</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: El primer parámetro en las funciones <code>url()</code> puede parecer un poco extraño (ej. <code>r'^junior/$'</code>) porque usan una técnica de emparejamiento de patrones llamada "expresiones regulares" ("regular expressions", RegEx, o RE). No necesitas saber cómo funcionan las expresiones regulares en este momento, tan sólo que nos permiten emparejar patrones en el URL (en vez de los valores insertados en el código de forma fija que veíamos más arriba) y los usan como parámetros en nuestras funciones de visualización. Como ejemplo, una RegEx simple podría decir "empareja una simple letra mayúscula, seguida de entre 4 y 7 letras minúsculas."</p>
+</div>
+
+<p>El framework web también hace fácil a una función de visualización extraer información de la base de datos. La estructura de nuestros datos está definida en modelos, que son las clases Python que definen los campos que serán almacenados en la base de datos subyacente. Si tenemos un modelo llamado <em>Team</em> con un campo de "<em>team_type</em>" podemos usar un query de sintaxis simple para recuperar todos los equipos que son de un tipo particular.</p>
+
+<p>Los ejemplos de abajo recuperan una lista de todos los equipos que tienen el <code>team_type</code> de "junior" exacto (teniendo en cuenta la capitalización, mayúsculas o minúsculas) — nota de formato: el nombre del campo (<code>team_type</code>) seguido de un guión bajo doble, y a continuación el tipo de emparejamiento a usar (en este caso <code>exact</code>). Hay muchos otros tipos de emparejamiento y podemos encadenarlos fácilmente. Podemos controlar el orden y número de resultados que se devuelven. </p>
+
+<pre class="brush: python">#best/views.py
+
+from django.shortcuts import render
+
+from .models import Team
+
+
+def junior(request):
+    list_teams = Team.objects.filter(team_type__exact="junior")
+    context = {'list': list_teams}
+    return render(request, 'best/index.html', context)
+</pre>
+
+<p>Después de que la función <code>junior()</code> obtenga la lista de equipos junior, llama a la función <code>render()</code>, pasándole el <code>HttpRequest</code> original,  una plantilla HTML, y un objeto "contexto" que define la información a ser incluida en la plantilla. La función <code>render()</code> es una función de conveniencia que genera HTML usando un contexto y una plantilla HTML, y devuelve un objeto <code>HttpResponse</code>.</p>
+
+<p>Obviamente los frameworks web pueden ayudarte con un monton de otras tareas. Debatiremos sobre un montón más de beneficios y opciones de frameworks web en el próximo artículo.</p>
+
+<h2 id="Sumario">Sumario</h2>
+
+<p>En este punto deberías tener una buena visión general de las operaciones que el código de lado servidor tiene que realizar, y conocer algunas de las formas en que un framework web de lado servidor las puede hacer más fáciles.</p>
+
+<p>En el módulo siguiente te ayudaremos a elegir el mejor Framework Web para tu primer sitio.</p>
+
+<p>{{PreviousMenuNext("Learn/Server-side/First_steps/Introduction", "Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</p>
+
+<p> </p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Server-side/First_steps/Introduction">Introducción al lado servidor</a></li>
+ <li><a href="/en-US/docs/Learn/Server-side/First_steps/Client-Server_overview">Visión general Cliente-Servidor</a></li>
+ <li><a href="/en-US/docs/Learn/Server-side/First_steps/Web_frameworks">Frameworks Web de lado servidor</a></li>
+ <li><a href="/en-US/docs/Learn/Server-side/First_steps/Website_security">Seguridad Web</a></li>
+</ul>
+
+<p> </p>
diff --git a/files/es/learn/server-side/first_steps/index.html b/files/es/learn/server-side/first_steps/index.html
new file mode 100644
index 0000000000..d7893b51d3
--- /dev/null
+++ b/files/es/learn/server-side/first_steps/index.html
@@ -0,0 +1,48 @@
+---
+title: Primeros Pasos en la Programación de Lado-Servidor
+slug: Learn/Server-side/First_steps
+tags:
+  - Aprendizaje
+  - Aterrizaje
+  - Codificación de scripts
+  - Guía
+  - Principiante
+  - Programación lado servidor
+  - introducción
+translation_of: Learn/Server-side/First_steps
+original_slug: Learn/Server-side/Primeros_pasos
+---
+<div>{{LearnSidebar}}</div>
+
+<p>En este, nuestro módulo sobre programación de Lado-Servidor, contestaremos a unas pocas preguntas fundamentales - "¿Qué es?", "¿En qué se diferencia de la programación de Lado-Cliente?" y "¿Porqué es tan útil?". Proporcionaremos un vistazo de algunos de los "web-frameworks" de lado-servidor más populares, junto con indicaciones de cómo seleccionar el framework más adecuado para crear tu primer sitio. Finalmente proporcionaremos un artículo introductorio de alto nivel sobre seguridad en el servidor web. </p>
+
+<h2 id="Prerequisitos">Prerequisitos</h2>
+
+<p>Antes de comenzar este módulo no necesitas tener ningún conocimiento de programación de sitios web de lado-servidor, y tampoco de ningún otro tipo de programación.</p>
+
+<p>Necesitarás entender "cómo funciona la web". Te recomendamos que leas primero los siguientes temas:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Common_questions/What_is_a_web_server">Qué es un servidor web</a></li>
+ <li><a href="/en-US/docs/Learn/Common_questions/What_software_do_I_need">¿Qué software necesito para construir un sitio web?</a></li>
+ <li><a href="/en-US/docs/Learn/Common_questions/Upload_files_to_a_web_server">¿Cómo se suben los ficheros a un servidor web?</a></li>
+</ul>
+
+<p>Con este conocimiento básico estarás listo para recorrer el camino a través de los módulos de esta sección.</p>
+
+<h2 id="Guías">Guías</h2>
+
+<dl>
+ <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Introducci%C3%B3n">Introducción al lado servidor</a></dt>
+ <dd>¡Bienvenidos al curso MDN de programación para principiantes de lado servidor! En este primer artículo enfocamos la programación de Lado-Servidor desde un nivel alto, respondiendo a preguntas tales como "¿qué es?", "¿en qué se diferencia de la programación de Lado-Cliente?" y "¿porqué es tan útil?". Después de leer este artículo entenderás el poder adicional para los sitios web <span style='background-color: transparent; color: #333333; display: inline !important; float: none; font-family: "Open Sans",arial,x-locale-body,sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; white-space: normal;'>disponible </span>a través de la codificación lado-servidor.</dd>
+ <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a></dt>
+ <dd>Ahora que conoces el propósito y beneficios potenciales de la programación lado-servidor examinaremos en detalle qué pasa cuando un servidor recibe una "petición dinámica" desde un explorador web. Como el código de lado-servidor de la mayoría de sitios web gestiona las peticiones y las respuestas de forma similar, ésto te ayudará entender qué necesitas hacer cuando escribes tu propio código.</dd>
+ <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Web_frameworks">Web frameworks de lado-servidor</a></dt>
+ <dd>El anterior artículo te mostró lo que necesita una aplicación web de lado servidor para responder a las peticiones de un explorador web. Ahora te mostraremos cómo los web frameworks pueden simplificar estas tareas y ayudarte a seleccionar el framework correcto para tu primera aplicación web de lado servidor.</dd>
+ <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad de Sitios Web</a></dt>
+ <dd>La seguridad de los sitios web requiere vigilancia en todos los aspectos del diseño y uso del sitio . Este artículo introductorio no te convertirá en un gurú de la seguridad de sitios web, pero te ayudará a entender los primeros pasos importantes que deber dar para robustecer tu aplicación web contra las amenazas más comunes.</dd>
+</dl>
+
+<h2 id="Evaluaciones">Evaluaciones</h2>
+
+<p>Este módulo "visión general" no hace ninguna evaluación ya que no te hemos enseñado ningún código todavía. Esperamos que en este punto tengas una comprensión de qué clase de funcionalidad puedes distribuir usando programación de lado servidor y habrás tomado una decisión sobre el web framework de lado servidor que usarás para crear tu primer sitio. </p>
diff --git a/files/es/learn/server-side/first_steps/introduction/index.html b/files/es/learn/server-side/first_steps/introduction/index.html
new file mode 100644
index 0000000000..32d5f3363b
--- /dev/null
+++ b/files/es/learn/server-side/first_steps/introduction/index.html
@@ -0,0 +1,193 @@
+---
+title: Introducción al lado servidor
+slug: Learn/Server-side/First_steps/Introduction
+tags:
+  - Aprendizaje
+  - Codificación de scripts
+  - Guía
+  - Principiante
+  - Programación lado servidor
+  - Servidor
+  - introducción
+translation_of: Learn/Server-side/First_steps/Introduction
+original_slug: Learn/Server-side/Primeros_pasos/Introducción
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}</div>
+
+<p class="summary">¡Bienvenidos al curso MDN de programación para principiantes de lado servidor! En este primer artículo enfocamos la programación de Lado-Servidor desde un nivel alto, respondiendo a preguntas tales como "¿qué es?", "¿en qué se diferencia de la programación de Lado-Cliente?" y "¿porqué es tan útil?". Después de leer este artículo entenderás el poder adicional para los sitios web disponible a través de la codificación lado-servidor.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>Nociones básicas de computación. Entender lo que es un servidor web.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Familiarizarse con lo que es la programación de lado servidor, qué puede hacer y en qué se diferencia de la programación de lado cliente.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>La mayoría de los grandes sitios web usan código de lado servidor para presentar, cuando se necesitan, diferentes datos, generalmente extraidos de una base de datos almacenada en un servidor y enviada al cliente para ser presentada mediante algún código (ej, HTML y JavaScript). Quizá el beneficio más significativo de la codificación de lado servidor es que te permite confeccionar el contenido del sitio web para usuarios individuales. Los sitios dinámicos pueden resaltar contenido que es más relevante basándose en las preferencias del usuario y sus hábitos. Puede hacer también que los sitios sean más fáciles de usar al almacenar las preferencias personales y la información - por ejemplo reusando los detalles de la tarjeta de crédito guardados para agilizar los pagos siguientes. Puede incluso permitir la interacción con los usuarios fuera del sitio, enviando notificaciones y actualizaciones via email o a traves de otros canales. Todas estas capacidades permite un mayor compromiso con los usuarios. </p>
+
+<p>En el mundo moderno del desarrollo web, el aprendizaje sobre desarrollo de lado servidor es altamente recomendable.</p>
+
+<h2 id="¿Qué_es_la_programación_de_sitios_web_de_lado_servidor">¿Qué es la programación de sitios web de lado servidor?</h2>
+
+<p>Los exploradores web se comunican con los <a href="/es-ES/docs/Learn/Common_questions/What_is_a_web_server">servidores web</a> usando el Protocolo de Transporte de Hyper Texto (HyperText Transport Protocol ({{glossary("HTTP")}}). Cuando pinchas en un enlace en una página web, envías un formulario o ejecutas una búsqueda, se envía una peticion HTTP desde tu explorador web al servidor web de destino. La petición incluye un URL que identifica el recurso afectado, un método que define la acción requerida (por ejemplo, obtener, borrar o publicar el recurso), y puede incluir información adicional codificada en parámetros en el URL (los pares campo-valor enviados en una cadena de consulta (<a href="https://en.wikipedia.org/wiki/Query_string">query string</a>), como datos POST (datos enviados mediate el método POST de HTTP,  <a href="/es/docs/Web/HTTP/Methods/POST">HTTP POST method</a>), o en {{glossary("Cookie", "associated cookies")}}.</p>
+
+<p>Los servidores web esperan los mensajes de petición de los clientes, los procesan cuando llegan y responden al explorador web con un mensaje de respuesta HTTP. La repuesta contiene una línea de estado indicando si la petición ha tenido éxito o no (ej, "HTTP/1.1 200 OK" en caso de éxito). El cuerpo de una respuesta exitosa a una petición podría contener el resurso solicitado (ej, una nueva página HTML, o una imagen, etc...), que el explorador web podría presetar en pantalla.</p>
+
+<h3 id="Sitios_Estáticos">Sitios Estáticos</h3>
+
+<p>El diagrama de abajo muestra una arquitectura de servidor web básica correspondiente a un <em>sitio estático</em> (un sitio estático es aquél que devuelve desde el servidor el mismo contenido insertado en el código "hard coded" siempre que se solicita un recurso en particular). Cuando un usuario quiere navegar a una página, el explorador envía una petición HTTP "GET" especificando su URL. El servidor recupera de su sistema de ficheros el documento solicitado y devuelve una respuesta HTTP que contiene el documento y un <a href="/es/docs/Web/HTTP/Status#Successful_responses">estado de éxito "success status</a>" (normalmente 200 OK). Si el fichero no puede ser recuperado por alguna razón, se devuelve un estado de error (ver <a href="/es/docs/Web/HTTP/Status#Client_error_responses">respuestas de error del cliente</a> and <a href="/es/docs/Web/HTTP/Status#Server_error_responses">respuestas de error del servidor</a>).</p>
+
+<p><img alt="A simplified diagram of a static web server." src="https://mdn.mozillademos.org/files/13841/Basic%20Static%20App%20Server.png" style="height: 223px; width: 800px;"></p>
+
+<h3 id="Sitios_Dinámicos">Sitios Dinámicos</h3>
+
+<p>Un sitio dinámico es aquél en que algun contenido de la respuesta está generado <em>dinámicamente</em> sólo cuando se necesita. En un sitio web dinámico las páginas HTML se crean normalmente insertando datos desde una base en variables dentro de plantillas HTML (esta es una forma mucho más eficiente de almacenar gran cantidad de contenido que la que usan los sitios web estáticos). Un sitio dinámico puede devolver datos diferentes para un URL basados en la información proporcionada por el usuario o sus preferencias almacenadas y puede realizar otras operaciones como parte de la devolución de respuesta (ej, enviar notificaciones).</p>
+
+<p>La mayor parte del código para soportar un sitio web dinámico debe correr en el servidor. La creación de este código se conoce como "programación de lado-servidor" (o algunas veces "back-end scripting").</p>
+
+<p>El diagrama de abajo muestra una arquitectura simple para un<em>sitio web dinámico.</em> Como en el diagrama previo, los exploradores web envían peticiones HTTP al servidor, el servidor procesa a continuación las peticiones y devuelve las respuestas HTTP apropiadas. Las peticiones de recursos <em>estáticos</em> son gestionadas de la misma manera que para los <em>sitios estáticos</em> (los recursos estáticos son cualquier fichero que no cambia - generalmente: CSS, JavaScript, Imágenes, ficheros PDF creados previamente, etc...)</p>
+
+<p><img alt="A simplified diagram of a web server that uses server-side programming to get information from a database and construct HTML from templates. This is the same diagram as is in the Client-Server overview." src="https://mdn.mozillademos.org/files/13839/Web%20Application%20with%20HTML%20and%20Steps.png"></p>
+
+<p>Las peticiones de recursos dinámicos, por el contrario, son reenviadas (2) al código del lado-servidor (mostrado en el diagrama como <em>Web Application</em>). Para las "peticiones dinámicas" el servidor interpreta la petición, lee de la base de datos la información requerida (3), combina los datos recuperados con las plantillas HTML (4), y envía de vuelta una respuesta que contiene el HTML generado (5,6). </p>
+
+<div>
+<h2 id="¿Son_iguales_la_programación_del_lado-servidor_y_lado-cliente">¿Son iguales la programación del lado-servidor y lado-cliente?</h2>
+</div>
+
+<p>Prestemos ahora nuestra atención al código involucrado en la programación de lado-servidor y lado-cliente. En cada caso, el código es significativamente diferente:</p>
+
+<ul>
+ <li>Tienen diferentes propósitos y preocupaciones.</li>
+ <li>Por lo general no usan los mismos lenguajes de programación (siendo la excepción el JavaScript, que puede usarse tanto en lado servidor como en lado cliente).</li>
+ <li>Se ejecutan entornos de diferentes sistemas operativos.</li>
+</ul>
+
+<p>El código que se ejecuta en el explorador se conoce como código de lado-cliente, y su principal preocupación es la mejora de la apariencia y el comportamiento de una página web entregada. Esto incluye la selección y estilo de los componentes UI, la creación de layouts, navegación, validación de formularios, etc. Por otro lado, la programación de sitios web de lado servidor en su mayor parte implica la elección de <em>qué contenido</em> se ha de devolver al explorador como respuesta a sus peticiones. El código de lado-servidor gestiona tareas como la validación de los datos enviados y las peticiones, usando bases de datos para almacenar y recuperar datos, y enviando los datos correctos al cliente según se requiera.</p>
+
+<p>El código del lado cliente está escrito usando <a href="/es/docs/Learn/HTML">HTML</a>, <a href="/es/docs/Learn/CSS">CSS</a>, y <a href="/es/docs/Learn/JavaScript">JavaScript</a> — es ejecutado dentro del explorador web y tiene poco o ningún acceso al sistema operativo subyacente (incluyendo un acceso limitado al sistema de ficheros).</p>
+
+<p>Los desarrolladores web no pueden controlar qué explorador web usará cada usuario para visualizar un sitio web — los exploradores web proporcionan niveles de compatibilidad inconsistentes con las características de codificación lado cliente, y parte del reto de la programación de lado cliente es gestionar con dignidad las diferencias de soporte entre exploradores.</p>
+
+<div>El código del lado servidor puede escribirse en cualquier número de lenguajes de programación — ejemplos de lenguajes de programación populares incluyen PHP, Python, Ruby, C# y NodeJS(JavaScript). El código del lado servidor tiene acceso completo al sistema operativo del servidor y el desarrollador puede elegir qué lenguaje de programación (y qué versión específica) desea usar.</div>
+
+<div>Los desarrolladores generalmente escriben su código usando web frameworks. Los web framworks son colecciones de funciones, objetos, reglas y otras construcciones de código diseñadas para resolver problemas comunes, acelerar el desarrollo y simplificar los diferentes tipos de tareas que se han de abordar en un dominio en particular.</div>
+
+<div>De nuevo, mientras que, tanto el código lado cliente y el lado servidor usan frameworks, los dominios son muy diferentes, y por lo tanto también lo son los frameworks. Los frameworks del lado cliente simplifican los diseños y las tareas de presentación mientras que los del lado servidor proporcionan un montón de funcionalidades "comunes" que tendría que haber implementado uno mismo (ej, soporte para las sesiones, soporte para los usuarios y autenticación, acceso fácil a la base de datos, librerías de plantillas, etc...).</div>
+
+<div class="note">
+<p>Nota: Los frameworks del lado cliente se usan con frecuencia para acelerar el desarrollo del código del lado cliente, pero también se puede elegir escribir todo el código a mano; de hecho, escribir el código a mano puede ser más rápido y más eficiente si sólo se necesita una UI para sitio web pequeña y simple. Por contra, casi nunca se consideraría escribir el componente del lado servidor de una aplicación web ("web app") sin un framework — implementar una característica vital como un servidor HTTP es realmente difícil de hacer de la nada en un lenguaje como, por ejemplo, Python, pero los  web frameworks de Python como Django proporcionan uno  listo para usar, junto con otras herramientas muy útiles.</p>
+</div>
+
+<h2 id="¿Qué_se_puede_hacer_en_el_lado-servidor">¿Qué se puede hacer en el lado-servidor?</h2>
+
+<p>La programación del lado-servidor es muy útil porque nos permite distribuir <em>eficientemente</em> información a medida para usuarios individuales y por lo tanto crear una experiencia de usuario mucho mejor.</p>
+
+<p>Compañías como Amazon utilizan la programación del lado-servidor para construir resultados de búsquedas de productos, hacer sugerencias sobre productos escogidos basados en las preferencias del cliente y sus hábitos de compra previos, simplificar las adquisiciones, etc. Los bancos usan la programación del lado-servidor para almacenar la información sobre las cuentas y permitir ver y realizar transacciones sólo a los usuarios autorizados. Otros servicios como Facebook, Twitter, Instagram y Wikipedia usan la programación de lado-servidor para destacar, compartir y controlar el acceso al contenido interesante.</p>
+
+<p>Algunos de los usos y beneficios comunes de la programación de lado-servidor se lista debajo. Notarás que hay algo de solapamiento.</p>
+
+<h3 id="Almacenaje_y_distribución_eficiente_de_información">Almacenaje y distribución eficiente de información</h3>
+
+<p>Imagina cuántos productos están disponibles en Amazon, e imagina cuántas entradas se han escrito en Facebook. Crear una página estática separada para cada producto o entrada sería completamente ineficiente.</p>
+
+<p>La programación de lado-servidor nos permite por el contrario almacenar la información en una base de datos y construir dinámicamente y devolver ficheros HTML y de otros tipos (ej, PDFs, imágenes, etc.). También es posible devolver simplemente datos ({{glossary("JSON")}}, {{glossary("XML")}}, etc.) para presentar mediante los web frameworks adecuados del lado-cliente (esto reduce la carga de procesamiento del servidor y la cantidad de datos que se necesitan enviar).</p>
+
+<p>El servidor no se limita a enviar información de las bases de datos, y podría además devolver el resultado de herramientas de software o datos de servicios de comunicación. El contenido puede incluso ser dirigido por el tipo de dispositivo cliente que lo está recibiendo.</p>
+
+<p>Debido a que la información está en una base de datos, puede también ser compartida y actualizada con otros sistemas de negocio (por ejemplo, cuando se venden los productos online o en una tienda, la tienda debería actualizar su base de datos de inventario.</p>
+
+<div class="note">
+<p>Nota: Tu imaginación no tiene que trabajar duro para ver el beneficio de la codificación de lado-servidor para el almacenaje y distribución de información:</p>
+
+<ol>
+ <li>Vete a <a href="https://www.amazon.com">Amazon</a> o a cualquier otro sitio de comercio electrónico "e-commerce".</li>
+ <li>Busca por un número de palabras clave y nota como la estructura de la página no cambia, incluso aunque cambien los resultados. </li>
+ <li>Abre dos o tres productos diferentes. Fíjate de nuevo como tienen una estructura y diseño común, pero el contenido para los diferentes productos ha sido extraido de la base de datos.</li>
+</ol>
+
+<p>Para un término de búsqueda común (digamos "pez") puedes ver literalmente millones de valores retornados. Usar una base de datos permite que éstos sean almacenados y compartidos de forma eficiente, y permite que la presentación de la información esté controlada en un solo sitio.</p>
+</div>
+
+<h3 id="Experiencia_de_usuario_personalizada">Experiencia de usuario personalizada</h3>
+
+<p>Los servidores pueden almacenar y usar la información acerca de los clientes para proporcionar una experiencia de usuario conveniente y dirigida. Por ejemplo, muchos usuarios almacenan tarjetas de crédito de forma que los detalles no tienen que ser introducidos de nuevo. Sitios como Google Maps usan la localización de tu casa y la actual para proporcionar una información sobre la ruta a seguir y resaltar los negocios locales en los resultados de búsqueda.</p>
+
+<p>Un análisis profundo de los hábitos del usuario se puede usar para anticipar sus intereses y personalizar las respuestas y notificaciones futuras, proporcionando, por ejemplo, una lista de las localizaciones visitadas o populares que querrías buscar en un mapa.</p>
+
+<div class="note">
+<p>Nota: Vete a <a href="https://maps.google.com/">Google Maps</a> como usuario anónimo, selecciona el botón Direcciones, e introduce los puntos de partida y destino de un viaje. Ahora inicia sesión en el sistema con tu cuenta de Google, si tienes una (en el panel de abajo aparece información acerca de este proceso donde seleccionas direcciones). El sitio web te permitirá ahora seleccionar las localizaciones de casa y trabajo como puntos de partida y destino (o almacenar estos detalles si no lo has hecho así).</p>
+</div>
+
+<h3 id="Acceso_controlado_al_contenido">Acceso controlado al contenido </h3>
+
+<p>La programación de lado-servidor permite a los sitios restringir el acceso a usuarios autorizados y servir sólo la información que se le permite ver al usuario.</p>
+
+<p>Ejemplos del mundo real incluyen:</p>
+
+<ul>
+ <li>Redes sociales como Facebook permiten a los usuarios controlar totalmente sus propios datos pero permitiendo sólo a sus amigos ver o comentar sobre ellos. El usuario determina quien puede ver sus datos, y por extensión, los datos de quienes aparecen en sus notificaciones — autorización es una parte central de la experiencia de usuario!</li>
+ <li>
+  <p>El sitio en el que te encuentras ahora controla el acceso al contenido: los artículos son visibles a todos, pero sólo los usuarios que se han identificado pueden editar el contenido. Para comprobar ésto, pincha en el botón Edit en la parte superior de esta página — si te has identificado iniciando sesión se te mostrará la vista de edición; si no has iniciado sesión serás enviado a una página de registro.</p>
+ </li>
+</ul>
+
+<div class="note">
+<p>Nota: Considera otros ejemplos reales donde el acceso al contenido está controlado. Por ejemplo, ¿qué puedes ver si vas al sitio online de tu banco? Inicia sesión con tu cuenta — ¿qué información adicional puedes ver y modificar? ¿Qué información puedes ver y sólo el banco puede cambiar?</p>
+</div>
+
+<h3 id="Almacenar_información_de_sesiónestado">Almacenar información de sesión/estado</h3>
+
+<p>La programación de lado-servidor permite a los desarrolladores hacer uso de las sesiones — es básicamente un mecanismo que permite al servidor almacenar información sobre el usuario actual del sitio u enviar diferentes respuestas basadas en esa información. Esto permite, por ejemplo, que un sitio sepa que un usuario ha iniciado sesión previamente y presente enlaces a sus correos, o a su historial de órdenes, o quizá guardar el estado de un simple juego de forma que el usuario pueda volver al sitio de nuevo y retomar el juego donde lo dejó.</p>
+
+<div class="note">
+<p>Nota: Visita el sitio de un periódico que tenga un modelo de subscripción y abre un puñado de pestañas (ej, <a href="http://www.theage.com.au/">The Age</a>). Continua visitando el sitio durante unos pocos días/horas. En algún momento serás finalmente redirigido a las páginas que explican cómo suscribirte y se te impedirá el acceso a los artículos. Esta información es un ejemplo de información de sesión almacenada en cookies.</p>
+</div>
+
+<h3 id="Notificaciones_y_comunicación">Notificaciones y comunicación</h3>
+
+<p>Los servidores pueden enviar notificaciones de tipo general o específicas de usuario a través del propio sitio web o vía correo electrónico, SMS, mensajería instanténea, conversaciones de video u otros servicios de comunicación.</p>
+
+<p>Unos pocos ejemplos incluyen:</p>
+
+<ul>
+ <li>Facebook y Twitter envían mensajes de correoy SMS para notificarte de nuevas comunicaciones.</li>
+ <li>Amazon envía con regularidad emails que sugieren productos similares a aquellos comprados o vistos anteriormente y en los que podrías estar interesado.</li>
+ <li>Un servidor web podría enviar mensajes de aviso a los administradores del sistema alertandoles de memoria baja en el servidor o de actividades de usuario sospechosas.</li>
+</ul>
+
+<div class="note">
+<p>Nota: El tipo de notificación más común es una "confirmación de registro". Elige uno cualquiera de los grandes sitios en que estés interesado (Google, Amazon, Instagram, etc.) y crea una cuenta nueva usando tu dirección de correo. En breve recibirás un email de confirmación de registro, o solicitando un acuse de recibo para activar la cuenta.</p>
+</div>
+
+<h3 id="Análisis_de_datos">Análisis de datos</h3>
+
+<p>Un sitio web puede recolectar un montón de datos acerca de los usuarios: qué es lo que buscan, qué compran, qué recomiendan, cuánto tiempo permanecen en cada página. La programación de lado-servidor puede utilizarse para refinar las respuestas basándose en el análisis de estos datos.</p>
+
+<p>Por ejemplo, Amazon y Google anuncian ambos productos basados en búsquedas previas (y adquisiciones).</p>
+
+<div class="note">
+<p>Nota: Si eres usuario de Facebook vete a tu muro y hecha un ojo a la ristra de entradas. Fíjate como algunas de las entradas no están en orden numérico - en particular las entradas con más "me-gusta" están con frecuencia en lugares más altos de la lista que las entradas más recientes. Echa un ojo también a qué clase de anuncios te están mostrando — podrías ver anuncios de cosas que has mirado en otros sitios. El algoritmo de Facebook para resaltar contenido y anuncios puede ser un poco misterioso, pero está claro que lo que hace depende de lo que te gusta y de tus hábitos de visualización!</p>
+</div>
+
+<h2 id="Sumario">Sumario</h2>
+
+<p>Felicidades, has alcanzado el final de primer artículo sobre programación de lado-servidor. </p>
+
+<p>Ahora ya has aprendido que el código de lado-servidor se ejecuta en un servidor web y que su papel principal es controlar <em>qué </em>información se envía al usuario (mientras que el código de lado-cliente gestiona principalmente la estructura y presentación  de esos datos al usuario).</p>
+
+<p>También deberías comprender que es útil porque nos permite crear sitios web que distribuyen <em>de forma eficiente</em> información seleccionada dirigida a usuarios individuales y tener una buena idea de algunas de las cosas que podrías ser capaz de hacer cuando seas un programador de lado-servidor.</p>
+
+<p>Finalmente, deberías comprender que el código de lado-servidor se puede escribir en un gran número de lenguajes de programación y que deberías usar un web framework para hacer más fácil el proceso completo.</p>
+
+<p>En un artículo futuro te ayudaremos a escoger el mejor web framework para tu primer sitio; Aunque a continuación te llevaremos a través de las principales interacciones cliente-servidor en un poco más de detalle.</p>
+
+<p>{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}</p>
diff --git a/files/es/learn/server-side/first_steps/web_frameworks/index.html b/files/es/learn/server-side/first_steps/web_frameworks/index.html
new file mode 100644
index 0000000000..6e23f8586d
--- /dev/null
+++ b/files/es/learn/server-side/first_steps/web_frameworks/index.html
@@ -0,0 +1,307 @@
+---
+title: Frameworks Web de lado servidor
+slug: Learn/Server-side/First_steps/Web_frameworks
+tags:
+  - Aprendizaje
+  - Codificación de scripts
+  - Frameworks web
+  - Guía
+  - Principiante
+  - Programación lado servidor
+  - Servidor
+  - introducción
+translation_of: Learn/Server-side/First_steps/Web_frameworks
+original_slug: Learn/Server-side/Primeros_pasos/Web_frameworks
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps/Website_security", "Learn/Server-side/First_steps")}}</div>
+
+<p class="summary">El artículo anterior te mostró que pinta tiene la comunicación entre los clientes web y los servidores, la naturaleza de las peticiones y respuestas HTTP, y lo que necesita hacer una aplicación web de lado servidor para responder a las peticiones de un explorador web. Con este conocimiento en nuestra mochila, es hora de explorar cómo los frameworks web pueden simplificar estas tareas, y darte una idea de cómo escogerías un framework para tu primera aplicación web de lado servidor.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerequisitos:</th>
+   <td>
+    <p>Conocimientos de computación básicos. Comprensión de alto nivel de cómo gestiona y responde a las peticiones HTTP el código de lado servidor (ver <a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a>).</p>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>
+    <p>Entender cómo los frameworks web pueden simplificar el desarrollo/mantenimiento de código de lado servidor y conseguir que los lectores piensen sobre la elección del framework para su propio desarrollo.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Las siguientes secciones ilustran algunos puntos usando fragmentos de código tomados de frameworks web reales. No te preocupes si no todo tiene sentido ahora; te pondremos a trabajar sobre el código en nuestros módulos de framework específicos.</p>
+
+<h2 id="Visión_general">Visión general</h2>
+
+<p>Los frameworks de lado servidor (es decir, "los frameworks de aplicaciones web") son frameworks software que hacen más fácil escribir, mantener y escalar aplicaciones web. Proporcionan herramientas y bibliotecas que simplifican tareas comunes de desarrollo web, incluyendo enrutado de URLs a los manejadores apropiados, interactuación con bases de datos, soporte de sesiones y autorizaciones de usuario, formateado de la salida (ej, HTML, JSON, XML), y mejora de la seguridad contra los ataques web.</p>
+
+<p>La sección siguiente proporciona un poco más detalle sobre cómo los frameworks web pueden facilitar el desarrollo de aplicaciones web. Explicaremos a continuación algunos de los criterios que puedes usar para elegir un framework web, y luego hacer una lista de algunas de tus opciones.</p>
+
+<h2 id="¿Qué_puede_hacer_por_tí_un_framework_web">¿Qué puede hacer por tí un framework web?</h2>
+
+<p>Los frameworks web proporcionan herramientas y bibliotecas para simplificar operaciones comunes de desarrollo web. No <em>tienes</em> que usar un framework web de lado servidor, pero se recomienda encarecidamente — te hará la vida mucho más fácil.</p>
+
+<p>Esta sección debate algo de la funcionalidad que proporcionan con frecuencia los frameworks web (!no todo framework proporcionará necesariamente todas estas caracteríticas!)</p>
+
+<h3 id="Trabajar_directamente_con_peticiones_y_respuestas_HTTP">Trabajar directamente con peticiones y respuestas HTTP</h3>
+
+<p>Como vimos en el último artículo, los servidores web y los exploradores se comunican vía el protocolo HTTP — los servidores esperan las peticiones HTTP del explorador y devuelven información en respuestas HTTP. Los frameworks web te permiten escribir sintaxis simplificada que generará el código de lado servidor para trabajar con estas peticiones y respuestas. Esto significa que tendrás un trabajo más fácil, interacción más fácil, código de más alto nivel en vez de primitivas de red de bajo nivel.</p>
+
+<p>El ejemplo de más abajo muestra cómo funciona ésto en el framework web Django (Python). Cada función de visualización "view" (un manejador de peticiones) recibe un objeto <code>HttpRequest</code> que contiene información de petición, y se le pide devolver un objeto <code>HttpResponse</code> con la salida formateada (en este caso una cadena de texto).</p>
+
+<pre class="brush: python"># Django view function
+from django.http import HttpResponse
+
+def index(request):
+    # Get an HttpRequest (request)
+    # perform operations using information from the request.
+    # Return HttpResponse
+    return HttpResponse('Output string to return')
+</pre>
+
+<h3 id="Enrutado_de_peticiones_al_manejador_adecuado">Enrutado de peticiones al manejador adecuado</h3>
+
+<p>La mayoría de sitios proporcionan un gran número de recursos diferentes, accesibles a través de distintas URLs. La gestión de todo esto en una sola función sería difiicil de mantener, de manera que los frameworks web proporcionan mecanismos simples para mapear patrones URL a funciones de gestión específicas. Esta aproximación tiene también beneficios en términos de mantenimiento, porque puedes cambiar el URL que se usa para entregar una característica en particular sin tener que cambiar el código subyacente.</p>
+
+<p>Diferentes frameworks usan diferentes mencanismos para el mapeo. Por ejemplo, el framework web Flask (Python) añade rutas a las funciones de visualización usando un "decorador".</p>
+
+<pre class="brush: python">@app.route("/")
+def hello():
+    return "Hello World!"</pre>
+
+<p>Por el contrario Django espera que los desarrolladores definan una lista de mapeos URL entre un patrón URL y una función de visualización.</p>
+
+<pre class="brush: python">urlpatterns = [
+    url(r'^$', views.index),
+    # example: /best/myteamname/5/
+    url(r'^(?P&lt;team_name&gt;\w.+?)/(?P&lt;team_number&gt;[0-9]+)/$', views.best),
+]
+</pre>
+
+<h3 id="Fácil_acceso_a_los_datos_en_la_petición">Fácil acceso a los datos en la petición</h3>
+
+<p>Los datos pueden codificarse en una petición HTTP de muchas maneras. Una petición <code>GET</code> para recuperar ficheros o datos de un servidor puede codificar los datos que se necesitan en parámetros URL o dentro de una estructura URL. Una petición <code>POST</code> para actualizar un recurso en el servidor puede en cambio incluir la información de actualización como "datos POST" dentro del cuerpo de la petición. La petición HTTP puede también incluir información sobre la sesión o usuario actual en un cookie de lado cliente.</p>
+
+<p>Los frameworks web proporcionan mecanismos apropiados del lenguaje de programación para acceder a esta información. Por ejemplo, el objeto <code>HttpRequest</code>  que pasa Django a toda función de visualización contiene métodos y propiedades para acceder a la URL de destino, el tipo de petición (ej. HTTP <code>GET</code>), parámetros <code>GET</code>  o <code>POST</code>, cookie y datos de session, etc. Django puede también pasar información codificada en la estructura de la URL definiendo "patrones de captura" en el mapeador URL (mira el último fragmento de código de la sección de arriba).</p>
+
+<h3 id="Abstraer_y_simplificar_el_acceso_a_bases_de_datos">Abstraer y simplificar el acceso a bases de datos</h3>
+
+<p>Los sitios web utilizan bases de datos para almacenar información tanto para ser compartida con los usuarios como sobre los propios usuarios. Los frameworks web proporcionan frecuentemente una capa de base de datos que abstrae las operaciones de lectura, escritura, consulta y borrado de la base. Nos referimos a esta capa de abstracción como Mapeador de Objetos Relacionados (Object-Relational Mapper, ORM).</p>
+
+<p>Usar un ORM tiene dos beneficios:</p>
+
+<ul>
+ <li>Puedes reemplazar la base de datos subyacente sin tener necesariamente que cambiar el código que la usa: Esto permite a los desarrolladores optimizar las características de las diferentes bases de datos en función de su uso.</li>
+ <li>la validación básica de datos puede implementarse dentro del framework. Esto hace más fácil y seguro comprobar que los datos se almacenan en el campo correcto de la base, que tienen el formato adecuado (ej. una dirección de correo electrónico), y que no son maliciosos de ninguna manera (los craqueadores utilizan ciertos patrones de código para hacer cosas malas como borrar registros de las bases de datos).</li>
+</ul>
+
+<p>Por ejemplo, el framework web de Django proporciona un ORM, y utiliza la referencia del objeto usado para definir la estructura de un registro similar al <em>modelo</em>. El modelo especifica los <em>tipos</em> de campos que se almacenarán, lo que puede proporcionar una validación a nivel de campo sobre qué información se puede guardar (ej. un campo de email sólo permitiría direcciones válidas de correo electrónico). Las definiciones de campos pueden también especificar su tamaño máximo, etiquetas de texto para los formularios, etc. El modelo no establece ninguna información sobre la base de datos subyacente ya que ese es un ajuste de configuración que se puede cambiar de forma separada de nuestro código.</p>
+
+<p>El primer fragmento de código más abajo muestra un modelo de Django muy simple para un objeto <code>Team</code>. Éste almacena el nombre y nivel del equipo como campos de caracteres y especifica el número máximo de éstos que pueden almacenarse en cada registro. El <code>team_level</code> es un campo de selección, de manera que proporcionamos un mapeo entre las opciones a mostrar en pantalla y los datos a almacenar, junto con un valor por defecto.</p>
+
+<pre class="brush: python">#best/models.py
+
+from django.db import models
+
+class Team(models.Model):
+    team_name = models.CharField(max_length=40)
+
+    TEAM_LEVELS = (
+        ('U09', 'Under 09s'),
+        ('U10', 'Under 10s'),
+        ('U11, 'Under 11s'),
+        ...  #list our other teams
+    )
+    team_level = models.CharField(max_length=3,choices=TEAM_LEVELS,default='U11')
+</pre>
+
+<p>El modelo de Django proporciona una API de consulta simple para buscar en la base de datos. Ésta puede comprobar coincidencias contra un gran número de campos al mismo tiempo usando diferentes criterios (ej. exacto, insensible a las mayúsculas, mayor que, etc.), y puede soportar sentencias complejas (por ejemplo, puedes especificar una búsqueda de equipos U11 que tengan un nombre de equipo que empiece por "Fr" or finalice con "al").</p>
+
+<p>El segundo fragmento de código muestra una función de visualización (manejador de recurso) para mostrar en pantalla todos nuestros equipos U09. En este caso especificamos que queremos filtrar todos los registros donde el campo <code>team_level</code> tenga exactamente el texto 'U09' (fíjate debajo cómo este criterio se pasa como argumento a la función <code>filter()</code> con el nombre de campo y tipo de coincidencia separados por guiones bajos dobles: <strong>team_level__exact</strong>).</p>
+
+<pre class="brush: python">#best/views.py
+
+from django.shortcuts import render
+from .models import Team
+
+def youngest(request):
+    <strong>list_teams = Team.objects.filter(team_level__exact="U09")</strong>
+    context = {'youngest_teams': list_teams}
+    return render(request, 'best/index.html', context)
+</pre>
+
+<dl>
+</dl>
+
+<h3 id="Renderización_de_datos">Renderización de datos</h3>
+
+<p>Los frameworks web proporcionan con frecuencia sistemas de plantillas. Éstas te permiten especificar la estructura de un documento de salida, usando marcadores de posición para los datos que serán añadidos cuando se genere la página. Las plantillas se usan con frecuencia para crear HTML, pero también pueden crear otros tipos de documentos.</p>
+
+<p>Los frameworks web proporcionan con frecuencia un mecanismo para facilitar la generación de otros formatos a partir de los datos almacenados, incluyendo {{glossary("JSON")}} y {{glossary("XML")}}.</p>
+
+<p>Por ejemplo, el sistema de plantillas de Django te permite especificar variables usando una sintaxis de "llaves dobles" (ej. <code>{</code><code>{ <em>variable_name</em> </code><code>}</code><code>}</code>),  que serán reemplazadas por valores pasados desde la función de visualización cuando la página sea renderizada. El sistema de plantillas también proporciona soporte para expresiones (con la sintaxis: <code>{% <em>expression</em> %}</code>), que permite a las plantillas realizar operaciones simples como iterar sobre la lista de valores pasados a la misma.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Muchos otros sistemas de plantillas usan una sintaxis similar, ej.: Jinja2 (Python), Handlebars (JavaScript), Moustache (JavaScript), etc.</p>
+</div>
+
+<p>El fragmento de código de abajo muestra como hacer este trabajo. Continuando el ejemplo del "equipo más joven" de la sección anterior, la "view" pasa a la plantilla HTML una variable tipo lista llamada <code>youngest_teams</code>. Dentro del esqueleto HTML tenemos una expresión que primero comprueba que la variable <code>youngest_teams</code> existe, y luego itera sobre ella en un bucle <code>for</code>. En cada iteración la plantilla presenta en pantalla el valor del <code>team_name</code>  del equipo de uno de los elementos de la lista.</p>
+
+<pre class="brush: html">#best/templates/best/index.html
+
+&lt;!DOCTYPE html&gt;
+&lt;html lang="en"&gt;
+&lt;body&gt;
+
+ {% if youngest_teams %}
+    &lt;ul&gt;
+    {% for team in youngest_teams %}
+        &lt;li&gt;\{\{ team.team_name \}\}&lt;/li&gt;
+    {% endfor %}
+    &lt;/ul&gt;
+{% else %}
+    &lt;p&gt;No teams are available.&lt;/p&gt;
+{% endif %}
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Como_escoger_un_framework_web">Como escoger un framework web</h2>
+
+<p>Existen muchos frameworks web para casi todos los lenguajes de programación que quieras usar (listamos unos pocos de los frameworks más populares en la sección siguiente). Con tantas opciones, llega a ser difícil deducir qué framework proporciona el mejor punto de partida para tu nueva aplicación web. </p>
+
+<p>Algunos de los factores que pueden afectar tu decisión son:</p>
+
+<ul>
+ <li><strong>Esfuerzo en el aprendizaje:</strong> El esfuerzo en el aprendizaje de un framework web depende de lo familiarizado que estés con el lenguaje de programación subyacente, la consistencia de su API, la calidad de su documentación, y el tamaño y actividad de su comunidad. Si estás partiendo de una nula experiencia en programación, considera entonces Django (es uno de los más fáciles de aprender basándose en los criterios anteriores). Si formas parte de un equipo de desarrolladores que tienen ya una experiencia significante con un framework web o lenguaje de programación en particular tiene sentido entonces que sigas fiel a él.</li>
+ <li><strong>Productividad:</strong> Productividad es una medida de cuán rápido puedes crear nuevas características una vez que te familiarices con el framework, incluidos tanto el esfuerzo para escribir como para mantener el código (ya que puedes escribir nuevas características mientras se rompen las antiguas). Muchos de los factores que afectan a la productividad son similares a los de el "Esfuerzo para aprender" — ej. documentación, comunidad, experiencia en programación, etc. — otros factores incluyen:
+  <ul>
+   <li><em>Propósito/Origen del framework</em>: Algunos frameworks web fueron creados inicialmente para resolver ciertos tipos de problemas, y se mantienen <em>mejor</em> en la creación de apllicaciones web con problemática similar. Por ejemplo, Django fue creado para soportar el desarrollo de un sitio web de un periódico, por lo que es bueno para blogs y otros sitios que impliquen la publicación de cosas. Por contra, Flask es un framework de peso mucho más ligero y es fantástico en la creación de aplicaciones web que se ejecuten en dispositivos embebidos.</li>
+   <li><em>Dogmático versus No Dogmático</em>:  Un framework dogmático es aquél en el que hay recomendaciones sobre el "mejor" método de resolver un problema en particular. Los frameworks dogmáticos tienden a ser más productivos cuando estás tratando de resolver problemas comunes, porque te llevan en la dirección correcta, sin embargo son menos flexibles a veces.</li>
+   <li><em>Con baterías incluidas versus Hazlo tu mismo</em>: Aalgunos frameworks web incluyen herramientas/bibliotecas que abordan por defecto todos los problemas que sus desarrolladores pueden pensar, mientras que los frameworks más ligeros esperan que los desarrolladores web escojan y elijan las soluciones a sus problemas en bibliotecas separadas (Django es un ejemplo del primero, mientras que Flask es un ejemplo de un framework mucho más ligero). Los frameworks que incluyen todo son con frecuencia más fáciles para empezar con ellos porque ya tienes todo lo que necesitas, y las probabilidades son altas de que esté bien integrado y bien documentado. Sin embargo si un framework más pequeño tiene todo lo que puedas necesitar funcionará en entornos mas constreñidos y tendrán un subconjunto de cosas más pequeñas y más fáciles de aprender.</li>
+   <li><em>Si el framework potencia o no buenas prácticas de desarrollo</em>: Por ejemplo, un framework que promueve una arquitectura <a href="/en-US/docs/Web/Apps/Fundamentals/Modern_web_app_architecture/MVC_architecture">Modelo-View-Controlador</a> para separar el código en funciones lógicas resultará más mantenible que uno que no tiene espectativas en los desarrolladores. Similarmente, el diseño del framework puede tener un gran impacto en cómo de fácil sea probar y reusar el código.</li>
+  </ul>
+ </li>
+ <li><strong>Desempeño del framework/lenguaje de programación: </strong>Normalmente la "velocidad" no es el factor más grande en la selección porque, incluso, con tiempos de ejecución relativamente lentos como Python, son más que suficientemente buenos para sitios de tamaño medio ejecutándose en hardware moderado. Los beneficios percibidos en velocidad de otro lenguaje, ej. C++ o JavaScript, pueden verse compensados por los costes de aprendizaje y mantenimiento.</li>
+ <li><strong>Soporte de Cache:</strong> A medida que tu sitio web adquiere más éxito puedes encontrarte que no sea capaz de soportar el número de peticiones que recibe cuando acceden los usuarios. En este punto puedes considerar añadir soporte de cache. La cache es una optimización en la que almacenas todo o parte de una petición web de manera que no tiene que ser recalculada en subsiguientes peticiones. Devolver una respuesta cacheada es más rápido que calcular una la primera vez. El cacheo puede implementarse en tu código o en el servidor (ver <a href="https://en.wikipedia.org/wiki/Reverse_proxy">proxy inverso</a>). Los frameworks web tienen diferentes niveles de soporte para definir qué contenido debe ser cacheado.</li>
+ <li><strong>Escalabilidad:</strong> Una vez que tu sitio tenga un éxito fabuloso agotarás los beneficios del cacheo e incluso alcanzarás los límites del <em>escalado vertical </em>(ejecutar tu aplicación en un hardware más potente). En este punto podrás necesitar <em>escalar horizontalmente</em> (compartir la carga distribuyendo tu sitio a lo largo de un número de servidores web o bases de datos) o escalar "geográficamente" porque algunos de tus clientes están localizados muy lejos de tu servidor. El framework web que elijas puede marcar una gran diferencia en cómo de fácil sea escalar tu sitio.</li>
+ <li><strong>Seguridad web:</strong> Algunos frameworks web proporcionan mejor soporte para manejar ataques web comunes. Django por ejemplo desinfecta todas las entradas de los usuarios de las plantillas HTML de manera que el posible código JavaScript introducido por el usuario no pueda ejecutarse. Otros frameworks proporcionan protección similar, pero no siempre está habilitada por defecto.</li>
+</ul>
+
+<p>Hay muchos otros posibles factores, incluyendo licenciamiento, si el framework está bajo desarrollo activo o no, etc.</p>
+
+<p>Si eres un completo principiante en la programación probablemente escogerás tu framework basándote en la "facilidad de aprendizaje". Además de la "facilidad de uso" del lenguaje mismo, la alta calidad de la documentación/tutoriales y una comunidad activa que ayuda a nuevos usuarios son tus recursos más valiosos. Nosotros hemos escogido <a href="https://www.djangoproject.com/">Django</a> (Python) y <a href="http://expressjs.com/">Express</a> (Node/JavaScript) para escribir nuestros ejemplos de más adelante en el curso, principalmente porque son fáciles de aprender y tienen un buen soporte.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Vayamos a los sitios principales de <a href="https://www.djangoproject.com/">Django</a> (Python) y <a href="http://expressjs.com/">Express</a> (Node/JavaScript) y comprobemos su documentación y su comunidad.</p>
+
+<ol>
+ <li>Navega a los sitios principales (enlazados abajo)
+  <ul>
+   <li>Pincha en los enlaces de los menus de Documentación (cosas que se llaman como "Documentación, Guía, Referencia API, Primeros Pasos".</li>
+   <li>¿Puedes ver temas que te muestran como configurar enrutado URL, plantillas y bases de datos/modelos?</li>
+   <li>¿Son los documentos suficientemente claros?</li>
+  </ul>
+ </li>
+ <li>Navega a las listas de correo de cada sitio (accesible desde los enlaces de Comunidad).
+  <ul>
+   <li>¿Cuántas preguntas se han realizado en unos pocos días recientes?</li>
+   <li>¿Cuántas tienen respuestas?</li>
+   <li>¿Tienen una comunidad activa?</li>
+  </ul>
+ </li>
+</ol>
+</div>
+
+<h2 id="¿Unos_pocos_frameworks_web_buenos">¿Unos pocos frameworks web buenos?</h2>
+
+<p>Avancemos ahora, y debatamos unos pocos frameworks web específicos de lado servidor.</p>
+
+<p>Los frameworks de lado servidor de más abajo representan unos pocos de los más populares disponibles en el momento de escribir este artículo. Todos ellos tienen todo lo que necesitas para ser productivo — son de código abierto, están bajo desarrollo activo, tienen comunidades entusiastas creando documentación y ayudando a los usuarios en paneles de debate, y se usan en un gran número de sitios web de perfil alto. Hay muchos otros frameworks de lado servidor fantásticos que puedes descubrir usando una búsqueda básica en internet. </p>
+
+<div class="note">
+<p><strong>Nota</strong>: ¡Las descripciones vienen (parcialmente) de los sitios web de los frameworks!</p>
+</div>
+
+<h3 id="Django_(Python)">Django (Python)</h3>
+
+<p><a href="https://www.djangoproject.com/">Django</a> es un Framework Web Python de alto nivel que promueve el desarrollo rápido y limpio y el diseño pragmático. Construido por desarrolladores experimentados, tiene en cuenta muchos de los problemas del desarrollo web, de manera que puedes focalizarte en escribir el código de tu app sin necesidad de reinventar la rueda. Es gratis y de código abierto.</p>
+
+<p>Django sigue la filosofía de "Baterias incluidas" y proporciona casi todo lo que la mayoría de desarrolladores querría hacer "de fábrica". Como todo está incluido, todo funciona en conjunto, sigue principios de diseño consistentes y tiene una extensa documentación actualizada. Es también veloz, seguro y muy escalable. Al estar basado en Python, el código de Django es fácil de leer y de mantener.</p>
+
+<p>Entre los sitios populares que usan Django (según su página web) se incluyen: Disqus, Instagram, Knight Foundation, MacArthur Foundation, Mozilla, National Geographic, Open Knowledge Foundation, Pinterest, Open Stack.</p>
+
+<h3 id="Flask_(Python)">Flask (Python)</h3>
+
+<p><a href="http://flask.pocoo.org/">Flask</a> es un microframework para Python. </p>
+
+<p>A pesar de ser minimalista, Flask puede crear sitios web "de fábrica". Contiene un servidor de desarrollo y depurador, e incluye soporte para plantillas <a href="https://github.com/pallets/jinja">Jinja2</a>, cookies seguros, <a href="https://en.wikipedia.org/wiki/Unit_testing">prueba de unidades</a>, y distribución de peticiones <a href="http://www.restapitutorial.com/lessons/restfulresourcenaming.html">RESTful</a>. Tiene  buena documentación y una comunidad activa. </p>
+
+<p>Flask se ha vuelto extremadamente popular, particularmente entre desarrolladores que necesitan proporcionar servicios web en sistemas pequeños, y con recursos escasos (ej. ejecutar un servidor web en una  <a href="https://www.raspberrypi.org/">Raspberry Pi</a>, <a href="http://blogtarkin.com/drone-definitions-learning-the-drone-lingo/">Controladores de Drones</a>, etc.)</p>
+
+<h3 id="Express_(Node.jsJavaScript)">Express (Node.js/JavaScript)</h3>
+
+<p><a href="http://expressjs.com/">Express</a> es un framework web veloz, no dogmático, flexible y minimalista para <a href="https://nodejs.org/en/">Node.js</a> (Node es un entorno sin explorador web para ejecutar JavaScript). Proporciona un conjunto de características robusto para aplicaciones web y móviles y entrega valiosos métodos de utilidades HTTP y <a href="/en-US/docs/Glossary/Middleware">middleware</a>.</p>
+
+<p>Express es extremadamente popular, en parte porque facilita la migración de programadores web de JavaScript de lado cliente a desarrollo de lado servidor, y en parte porque es eficiente con los recursos (el entorno de node subyacente usa multitarea ligera dentro de un thread en vez de expandirse en procesos separados para cada nueva petición web).</p>
+
+<p>Debido a que Express es un framework web minimalista no incorpora cada componente que querrías usar (por ejemplo, el acceso a bases de datos y el soporte de usuarios y sesiones se proporciona a través de bibliotecas independientes). Hay muchos componentes independientes excelentes, !pero algunas veces puede ser difícil deducir cuál es el mejor para un propósito en particular!</p>
+
+<p>Muchos frameworks populares y completamente equipados (incluyendo ambos tipos de frameworks de lado servidor y de lado cliente) están basados en Express, como <a href="http://feathersjs.com/">Feathers</a>, <a href="https://www.itemsapi.com/">ItemsAPI</a>, <a href="http://keystonejs.com/">KeystoneJS</a>, <a href="http://krakenjs.com/">Kraken</a>, <a href="http://lean-stack.io/">LEAN-STACK</a>, <a href="http://loopback.io/">LoopBack</a>, <a href="http://mean.io/">MEAN</a>, and <a href="http://sailsjs.org/">Sails</a>.</p>
+
+<p>Un montón de compañías de perfil alto usan Express, como: Uber, Accenture, IBM, etc. (a<a href="http://expressjs.com/en/resources/companies-using-express.html">quí</a> tienes una lista).</p>
+
+<h3 id="Ruby_on_Rails_(Ruby)">Ruby on Rails (Ruby)</h3>
+
+<p><a href="http://rubyonrails.org/">Rails</a> (normalmente referenciado como "Ruby on Rails") es un framework web escrito para el lenguaje de programación Ruby.</p>
+
+<p>Rails sigue una filosofía de diseño muy similar a Django. Como Django proporciona mecanismos estándard para el enrutado de URLs, acceso a datos de bases, generación de plantillas y formateo de datos como {{glossary("JSON")}} o {{glossary("XML")}}. Promueve de forma similar el uso de patrones de diseño como DRY ("dont repeat yourself", no te repitas — escribir el código una única vez si es posible), MVC (model-view-controller) y numerosos otros.</p>
+
+<p>Hay por supuesto muchas diferencias debido a decisiones específicas de diseño y la naturaleza de los lenguajes.</p>
+
+<p>Rails se usa en sitios de perfil alto, como:<strong> </strong><a href="https://basecamp.com/">Basecamp</a>, <a href="https://github.com/">GitHub</a>, <a href="https://shopify.com/">Shopify</a>, <a href="https://airbnb.com/">Airbnb</a>, <a href="https://twitch.tv/">Twitch</a>, <a href="https://soundcloud.com/">SoundCloud</a>, <a href="https://hulu.com/">Hulu</a>, <a href="https://zendesk.com/">Zendesk</a>, <a href="https://square.com/">Square</a>, <a href="https://highrisehq.com/">Highrise</a>.</p>
+
+<h3 id="ASP.NET">ASP.NET</h3>
+
+<p><a href="http://www.asp.net/">ASP.NET</a> es un framework web de código abierto desarrollado por Microsoft para construir aplicaciones y servicios modernos. Con ASP.NET puedes crear rápidamente sitios web basados en HTML, CSS, y JavaScript, escalarlos para ser usados por milllones de usuarios y añadir fácilmente capacidades complejas como APIs web, formularios sobre datos o comunicaciones en tiempo real.</p>
+
+<p>Uno de los diferenciadores de ASP.NET es que está construido sobre el <a href="https://en.wikipedia.org/wiki/Common_Language_Runtime">Common Language Runtime</a> (CLR), permitiendo a los programadores escribir código ASP.NET usando cualquier lenguaje .NET soportado (C#, Visual Basic, etc.). Como muchos productos Microsoft se beneficia de herramientas excelentes (frecuentemente gratuitas), y una comunidad de desarrolladores activa, y documentación bien escrita.</p>
+
+<p>ASP.NET se usa por Microsoft, Xbox.com, Stack Overflow, y muchos otros.</p>
+
+<h3 id="Mojolicious_(Perl)">Mojolicious (Perl)</h3>
+
+<p><a href="http://mojolicious.org/">Mojolicious</a> es un framework web de nueva generación para el lenguaje de programación Perl.</p>
+
+<p>Hace tiempo en los primeros días de la Web, mucha gente aprendió Perl gracias a una magnífica biblioteca llamada <a href="https://metacpan.org/module/CGI">CGI</a>. Era lo suficientemente simple para empezar sin saber mucho sobre el lenguaje y lo suficientemente potente para mantenerte en marcha. Mojolicious implementa esta idea usando el último grito de las tecnologías.</p>
+
+<p>Algunas de las caracteríticas que proporciona Mojolicious son: <strong>Framework Web en tiempo real</strong>, para crecer fácilmente desde prototipos de un solo fichero hasta aplicaciones web MVC bien estructuradas; rutas RESTful, plugins, comandos, plantillas especificas de Perl, negociación de contenidos, gestión de sesiones, validación de formatos, framework de pruebas, servidor de ficheros estáticos, detección de CGI/<a href="http://plackperl.org">PSGI</a>, soporte Unicode de primera clase; Implementación  cliente/servidor completamente equipada de HTTP y WebSocket con IPv6, TLS, SNI, IDNA, HTTP/SOCKS5 proxy, UNIX domain socket, Comet (long polling), keep-alive, connection pooling, timeout, cookie, y soporte de compresión multipart y gzip; parseadores JSON y HTML/XML y generadores con soporte de selector CSS; Muy limpio, portable y API orientada a objetos y Perl puro sin magia oculta; Código fresco basado en años de experiencia, gratis y de código abierto.</p>
+
+<h2 id="Sumario">Sumario</h2>
+
+<p>Este artículo ha mostrado que los frameworks web pueden hacer fácil el desarrollo y mantenimiento del código de lado servidor. También ha proporcionado una visión general de alto nivel de unos pocos frameworks más populares y debatido los criterios para elegir el framework para una aplicación web. Deberías tener en este momento una idea de cómo elegir un framework web para tu propio desarrollo de lado servidor. Si no, no te preocupes — más tarde a lo largo del curso te daremos tutoriales detallados de Django y Express para darte algo de experiencia de funcionamiento real con un framework web.</p>
+
+<p>Para el próximo artículo de este módulo cambiaremos de dirección ligeramente y consideraremos la seguridad web.</p>
+
+<p>{{PreviousMenuNext("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps/Website_security", "Learn/Server-side/First_steps")}}</p>
+
+<p> </p>
+
+<h2 id="En_este_modulo">En este modulo</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Introducci%C3%B3n">Introducción al lado servidor </a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Web_frameworks">Frameworks web de lado servidor</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad de sitios Web</a></li>
+</ul>
+
+<p> </p>
diff --git a/files/es/learn/server-side/first_steps/website_security/index.html b/files/es/learn/server-side/first_steps/website_security/index.html
new file mode 100644
index 0000000000..92ed22736a
--- /dev/null
+++ b/files/es/learn/server-side/first_steps/website_security/index.html
@@ -0,0 +1,178 @@
+---
+title: Seguridad de Sitios Web
+slug: Learn/Server-side/First_steps/Website_security
+tags:
+  - Aprendizaje
+  - Codificación de scripts
+  - Guía
+  - Principiante
+  - Programación de lado servidor
+  - Seguridad
+  - Seguridad Web
+  - Seguridad de sitios Web
+  - introducción
+translation_of: Learn/Server-side/First_steps/Website_security
+original_slug: Learn/Server-side/Primeros_pasos/seguridad_sitios_web
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenu("Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</div>
+
+<p class="summary">La Seguridad web require vigilancia en todos los aspectos del diseño y uso de un sitio web. Este artículo introductorio no te hará un gurú de la seguridad en sitios web, pero te ayudará a entender de donde vienen las amenazas y qué puedes hacer para fortalecer tu aplicación web contra los ataques más comunes.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Pre-requisitos:</th>
+   <td>Conocimientos de computación básicos.</td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Entender las amenazas más comunes para la seguridad de una aplicación web y lo que puedes hacer para reducir el riesgo de que tu sitio sea hackeado.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="¿Qué_es_la_seguridad_de_sitios_web">¿Qué es la seguridad de sitios web?</h2>
+
+<p>¡Internet es un sitio peligroso! Con mucha frecuencia escuchamos sobre sitios web que dejan de estar disponibles debido a ataques de denegación de servicio, o presentan información modificada (y con frecuencia dañada) en sus páginas de inicio. En otros casos de alto nivel, millones de contraseñas, direcciones de correo electrónico y detalles de tarjetas de crédito han sido filtrados al dominio público, exponiendo a los usuarios del sitio web tanto a bochorno personal como a riesgo finaciero.</p>
+
+<p>El propósito de la seguridad web es prevenir ataques de esta (o de cualquier otra) clase. Mas formalmente, <em>la seguridad es la acción/práctica de proteger sitios web del acceso, uso, modificación, destrucción o interrupción, no autorizados</em>.</p>
+
+<p>La seguridad de sitios web eficaz requiere de esfuerzos de diseño a lo largo de la totalidad del sitio web: en tu aplicación web, en la configuración del servidor web, en tus políticas para crear y renovar contraseñas, y en el código del lado cliente. Al mismo tiempo que todo esto suena muy inquietante, la buena noticia es que si estás usando un framework web de lado servidor, es casi seguro que habilitará por defecto mecanismos de defensa robustos y bien pensados contra gran cantidad de los ataques más comunes. Otros ataques pueden mitigarse por medio de la configuración de tu servidor web, por ejemplo habilitando HTTPS. Finalmente, hay herramientas de escaneado de vulnerabilidades disponibles públicamente que pueden ayudarte a averiguar si has cometido algún error obvio.</p>
+
+<p>El resto de este artículo proporciona más detalle sobre unas pocas amenazas comunes y algunos de los pasos simples que puedes dar para proterger tu sitio.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Este es un tema de introducción, diseñado para ayudarte a pensar sobre la seguridad de sitios web. No pretende ser exhaustivo.</p>
+</div>
+
+<h2 id="Amenazas_contra_la_seguridad_de_sitios_web">Amenazas contra la seguridad de sitios web</h2>
+
+<p>Esta sección lista sólo algunas pocas de las amenazas más comunes para los sitios web y cómo son mitigadas. A medida que vayas leyendo, fíjate cómo las amenazas tienen éxito cuando la aplicación web, ¡o confía o <em>no es lo suficientemente paranoica</em> acerca de los datos que vienen del explorador web!</p>
+
+<h3 id="Cross-Site_Scripting_XSS">Cross-Site Scripting (XSS)</h3>
+
+<p>XSS es un término que se usa para describir una clase de ataques que permiten al atacante inyectar scripts de lado cliente, <em>a través </em>del sitio web, hasta los exploradores de otros usuarios. Como el código inyectado va del servidor del sitio al explorador, se supone de confianza, y de aquí que pueda hacer cosas como enviar al atacante la cookie de autorización al sitio del usuario. Una vez que el atacante tiene la cookie pueden iniciar sesión en el sitio como si fuera el verdadero usuario y hacer cualquier cosa que pueda hacer éste. Dependiendo de que sitio sea, esto podría incluir acceso a los detalles de su tarjeta de crédito, ver detalles de contactos o cambiar contraseñas, etc.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Las vulnerabilidades XSS han sido históricamente más comunes que las de cualquier otro tipo.</p>
+</div>
+
+<p>Hay dos aproximaciones principales para conseguir que el sitio devuelva scripts inyectados al explorador — se conocen como vulnerabilidades XSS <em>reflejadas</em> y <em>persistentes</em>.</p>
+
+<ul>
+ <li>Una vulnerabilidad XSS <em>reflejada</em> ocurre cuando contenido del usuario que se pasa al servidor se devuelve <em>inmediatamente y sin modificar</em> par que los muestre el explorador — ¡cualquier script en el contenido original del usuario se ejecutará cuando se cargue una nueva página!<br>
+  Por ejemplo, considera una función de búsqueda en un sitio donde los términos de búsqueda están codificados como parámetros URL y estos términos se presentan junto con los resultados. Un atacante puede construir un enlace de búsqueda que contenga un script malicioso como parámetro (ej. <code>http://mysite.com?q=beer&lt;script%20src="http://evilsite.com/tricky.js"&gt;&lt;/script&gt;</code>) y enviarlo como enlace en un correo electrónico a otro usuario: Si el destinatario pincha en este "enlace interesante", el script se ejecutará cuando se muestren en pantalla los resultados de la búsqueda. Como discutimos arriba, ésto da al atacante toda la información que necesita para entrar en el sitio como si fuera el usuario destinatario — realizando compras potencialmente como si fuera el usuario o compartiendo su información de contactos.</li>
+ <li>Una vulnerabilidad <em>XSS persistente</em> es aquella en la que el script malicioso se <em>almacena</em> en el sitio web y luego más tarde se vuelve a presentar en pantalla sin modificar para que otros usuarios lo ejecuten involuntariamente. Por ejemplo, un foro de discusión que accepta comentarios que contengan HTML sin modificar, podría almacenar un script malicioso de un atacante. Cuando se muestren los comentarios se ejecutará el script y enviará al atacante la información requerida para acceder a la cuenta del usuario. Esta clase de ataque es extremadamente popular y muy potente, porque el atacante no tiene que tener ninguna relación directa con las víctimas.<br>
+  <br>
+  Si bien los datos <code>POST</code> o <code>GET</code> son las fuentes más comunes de vulnerabilidades, cualquier dato del explorador es vulnerable potencialmente (incluyendo los datos de cookies renderizados por el explorador, o los ficheros de los usuarios que éste sube o que se muestran).</li>
+</ul>
+
+<p>La mejor defensa contra las vulnerabilidades XSS es eliminar o deshabilitar cualquier etiqueta que pueda contener instrucciones para ejecutar código. En el caso del HTML ésto incluye etiquetas como <code>&lt;script&gt;</code>, <code>&lt;object&gt;</code>, <code>&lt;embed&gt;</code>, y <code>&lt;link&gt;</code>.</p>
+
+<div>
+<p>El proceso de modificar los datos del usuario de manera que no puedan utilizarse para ejecutar scripts o que afecten de otra forma la ejecución del código del servidor, se conoce como "desinfección de entrada" (input sanitization). Muchos frameworks web desinfectan automáticamente la entrada del usuario desde formularios HTML, por defecto.</p>
+</div>
+
+<h3 id="Inyección_SQL">Inyección SQL</h3>
+
+<p>Las vulnerabilidades de Inyección SQL habilitan que usuarios maliciosos ejecuten código SQL arbitrario en una base de datos, permitiendo que se pueda acceder a los datos, se puedan modificar o borrar, independientemente de los permisos del usuario. Un ataque de inyección con éxito, podría falsificar identidades, crear nuevas identidades con derechos de administración, acceder a todos los datos en el servidor o destruir/modificar los datos para hacerlos inutilizables.</p>
+
+<p>Esta vulnerabilidad está presente si la entrada del usuario que se pasa a la sentencia SQL subyacente puede cambiar el significado de la misma. Por ejemplo, considera el código de abajo, que pretende listar todos los usuarios con un nombre en particular (<code>userName</code>) que ha sido suministrado en un formulario HTML:</p>
+
+<pre class="brush: sql">statement = "SELECT * FROM users WHERE name = '" + <strong>userName</strong> + "';"</pre>
+
+<p>Si el usuario introduce su nombre real, la cosa funciona como se pretende. Sin embargo un usuario malicioso podría cambiar completamente el comportamiento de esta sentencia SQL a la nueva sentencia de abajo, simplemente especificando para <code>userName</code> el texto de abajo en "<strong>negrilla</strong>". La sentencia modificada crea una sentencia SQL válida que borra la tabla  <code>users</code> y selecciona todos los datos de la tabla <code>userinfo</code>  (revelando la información de todos los usuarios). Esto funciona por que la primera parte del texto inyectado (<code>a';</code>) completa la sentencia original (' es el símbolo para indicar una cadena literal en SQL).</p>
+
+<pre class="brush: sql">SELECT * FROM users WHERE name = '<strong>a';DROP TABLE users; SELECT * FROM userinfo WHERE 't' = 't</strong>';
+</pre>
+
+<p>La manera de evitar esta clase de ataque es asegurar que cualquier dato de usuario que se pasa a un query SQL no puede cambiar la naturaleza del mismo. Una forma de hacer ésto es <a href="https://en.wikipedia.org/wiki/Escape_character">eludir ('escape')</a> todos los caracteres en la entrada de usuario que tengan un significado especial en SQL.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: La sentencia SQL trata el caracer ' como el principio y el final de una cadena de texto. Colocando el caracter barra invertida \ delante, "eludimos" el símbolo (\'), y le decimos a SQL que lo trate como un caracter de texto (como parte de la misma cadena).</p>
+</div>
+
+<p>En la sentencia de abajo eludimos el carácter '. SQL interpretará ahora como "nombre" la cadena de texto completa mostrada en negrilla (!un nombre muy raro desde luego, pero no dañino¡)</p>
+
+<pre class="brush: sql">SELECT * FROM users WHERE name = '<strong>a\';DROP TABLE users; SELECT * FROM userinfo WHERE \'t\' = \'t'</strong>;
+
+</pre>
+
+<p>Los frameworks web con frecuencia tienen cuidado de hacer por tí la elusión de caracteres. Django, por ejemplo se asegura que cualquier dato de usuario que se pasa a los conjuntos de queries (modelo de queries) está corregido.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Esta sección se sustenta aquí en la información de <a href="https://en.wikipedia.org/wiki/SQL_injection">Wikipedia</a>.</p>
+</div>
+
+<h3 id="Cross_Site_Request_Forgery_CSRF">Cross Site Request Forgery (CSRF)</h3>
+
+<p>Los ataques de CSRF permiten que un usuario malicioso ejecute acciones usando las credenciales de otro usuario sin el conocimiento o consentimiento de éste.</p>
+
+<p>Este tipo de ataque se explica mejor con un ejemplo. John es un usuario malicioso que sabe que un sitio en particular permite a los usuarios que han iniciado sesión enviar dinero a una cuenta específica usando una petición HTTP <code>POST</code> que incluye el nombre de la cuenta y una cantidad de dinero. John construye un formulario que incluye los detalles de su banco y una cantidad de dinero como campos ocultos, y lo envía por correo electrónico a otros usuarios del sitio (con el botón de <em>Enviar</em> camuflado como enlace a un sitio "hazte rico rápidamente").</p>
+
+<p>Si el usuario pincha el botón de enviar, se envía al servidor una petición HTTP <code>POST</code> que contiene los detalles de la transacción y <em>todos los cookies de lado-cliente que el explorador asocia con el sitio</em> (añadir cookies asociados con el sitio es un comportamiento normal de los exploradores). El servidor comprobará los cookies, y los usará para determinar si el usuario ha iniciado sesión o no y si tiene permiso para hacer la transacción.</p>
+
+<p>El resultado es que cualquier usuario que pinche en el botón <em>Enviar</em> mientras tiene la sesión iniciada en el sitio comercial hará la transacción. ¡John se hará rico!</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El truco aquí es que John no necesita tener acceso a los cookies del usuario (o acceso a sus credenciales) — El explorador del usuario almacena esta información, y la incluye automáticamente en todas las peticiones al servidor asociado.</p>
+</div>
+
+<p>Una manera de prevenir este tipo de ataque por parte del servidor es requerir que la petción <code>POST</code> incluya una palabra secreta específica del usuario generada por el sitio (la palabra secreta podría proporcionarla el servidor cuando envía el formulario web que se usa para hacer transferencias). Esta aproximación evita que John pueda crear su propio formulario, porque necesitaría conocer la palabra secreta que el servidor ha proporcionado para el usuario. Incluso si conociera esta palabra y creara un formulario para un usuario en particular, no podría usar el mismo formulario para atacar a todos los usuarios.</p>
+
+<p>Los frameworks web incluyen con frecuencia tales mecanismos de prevención de CSRF.</p>
+
+<h3 id="Otras_amenazas">Otras amenazas</h3>
+
+<p>Otros ataques/vulnerabilidades incluyen:</p>
+
+<ul>
+ <li><a href="https://www.owasp.org/index.php/Clickjacking">Clickjacking</a>. En este tipo de ataque, el usuario malicioso secuestra las pulsaciones de ratón dirigidas a un sitio visible por encima de los demás y las redirige a una página escondida por debajo. Esta técnica se usaría, por ejemplo, para presentar un sitio bancario legítimo pero capturar las credenciales de inicio de sesión en un {{htmlelement("iframe")}} invisible controlado por el atacante. Alternativamente podría usarse para conseguir que el usuario pinchara sobre un botón en un sitio visible, pero al hacerlo realmente estuviera sin advertirlo pinchando en otro botón completamente diferente. Como defensa, tu sitio puede protegerse de ser embebido en un iframe de otro sitio configurando las cabeceras HTTP apropiadamente.</li>
+ <li><a href="/en-US/docs/Glossary/Distributed_Denial_of_Service">Denegación de Servicio, (Denial of Service</a>, DoS). DoS se consigue normalmente inundando el sitio objetivo con peticiones espúreas de manera que se interrumpa el acceso a los usuarios legítimos. Las peticiones pueden simplemente ser numerosas, o consumir individualmente gran cantidad de recursos (ej. lecturas lentas, subidas de grandes ficheros, etc.) Las defensas contra DoS normalmente trabajan mediante la indentificación y el bloqueo de tráfico "malo" permitiendo sin embargo que atraviesen los mensajes legítimos. Estas defensas se encuentran típicamente dentro o antes del servidor (no son parte de la aplicación web misma).</li>
+ <li><a href="https://en.wikipedia.org/wiki/Directory_traversal_attack">Salto de Directorios</a>/Revelación de Ficheros. En este tipo de ataque un usuario malicioso intenta acceder a partes del sistema de ficheros del servidor web a los que no debería tener acceso. Esta vulnerabilidad ocurre cuando el usuario es capaz de pasar nombres de fichero que incluyen caracteres del sistema de navegación (ej. <code>../../</code>). La solución es desinfectar la entrada antes de usarla.</li>
+ <li><a href="https://en.wikipedia.org/wiki/File_inclusion_vulnerability">Inclusión de Ficheros</a>. En este ataque un usuario es capaz de especificar, para mostrar o ejecutar, un fichero "no intencionado para ello" en los datos que le pasa al servidor. Una vez ha sido cargado este fichero podría ejecutarse en el servidor web o en el lado cliente (llevando a un ataque XSS). La solución es desinfectar la entrada antes de usarla.</li>
+ <li><a href="https://www.owasp.org/index.php/Command_Injection">Inyección de Comandos</a>. Los ataques de inyección de comandos permiten a un usuario malicioso ejecutar comandos del sistema arbitrarios en el sistema operativo del host. La solución es desinfectar la entrada de usuario antes de que pueda ser usada en llamadas al sistema.</li>
+</ul>
+
+<p>Hay muchas más. Para un lisado completo ver <a href="https://en.wikipedia.org/wiki/Category:Web_security_exploits">Category:Web security exploits</a> (Wikipedia) y <a href="https://www.owasp.org/index.php/Category:Attack">Category:Attack</a> (Open Web Application Security Project).</p>
+
+<h2 id="Unos_cuantos_mensajes_clave">Unos cuantos mensajes clave</h2>
+
+<p>Casi todos los exploits de las secciones anteriores tienen éxito cuando la aplicación web confía en los datos que vienen del explorador. Sea lo que sea que hagas para mejorar la seguridad de tu sitio web, deberías desinfectar todos los datos originados por el usuario antes de ser mostrados en el explorador, usados en queries SQL o pasados en una llamada al sistema operativo o fichero de sistema.</p>
+
+<div class="warning">
+<p>Importante: La lección más importante que debes aprender acerca de la seguridad de sitios web es <strong>nunca confíes en los datos del explorador web</strong>. Esto incluye los datos en parámetros URL de las peticiones<code>GET</code>, datos <code>POST</code>, cabeceras HTTP y cookies, ficheros subidos por los usuarios, etc. Comprueba siempre y desinfecta todos los datos entrantes. Siempre asume lo peor.</p>
+</div>
+
+<p>Otras cuantas medidas concretas que puedes tomar son:</p>
+
+<ul>
+ <li>Usar una gestión de contraseñas más efectiva. Fomentar las contraseñas fuertes y que se cambien con regularidad. Considerar para tu sitio web la autenticación de dos factores, de manera que, además de la contraseña, el usuario tenga que introducir algún otro código de autenticación (normalmente alguno que se distribuye mediante algún hardware que sólo tiene el usuario, como un código en un mensaje de texto enviado a su teléfono móvil).</li>
+ <li>Configurar tu servidor web para usar <a href="/en-US/docs/Glossary/https">HTTPS</a> y <a href="/en-US/docs/Web/Security/HTTP_strict_transport_security">HTTP Strict Transport Security</a> (HSTS). HTTPS encripta los datos enviados entre el cliente y el servidor. Esto asegura que las credenciales de incio de sesión, cookies, datos <code>POST</code> e información de cabecera permanecen menos disponibles a los atacantes.</li>
+ <li>Seguir la pista a las amenazas más populares (<a href="/en-US/docs/">aquí puedes acceder a la lista actual OWASP</a>) y atacar las vulnerabilidades más comunes primero.</li>
+ <li>Usar herramientas de <a href="https://www.owasp.org/index.php/Category:Vulnerability_Scanning_Tools">escanéo de vulnerabilidade</a><a href="https://www.owasp.org/index.php/Category:Vulnerability_Scanning_Tools">s</a> para realizar pruebas automáticas de seguridad en tu sitio (más adelante, si tu sitio web llega a ser super exitoso puedes también encontrar bugs por medio de ofrecer recompensas por encontrar bugs <a href="https://www.mozilla.org/en-US/security/bug-bounty/faq-webapp/">como hace Mozilla aquí</a>).</li>
+ <li>Almacena y muestra sólo los datos que necesiten serlo. Por ejemplo, si tus usuarios deben almacenar información sensible como los detalles de las tarjetas de crédito, sólo muestra lo suficiente del número de tarjeta de manera que pueda ser identificada por el usuario, y no suficiente para que pueda ser copiado por el atacante y usado en otro sitio. El patrón más común hoy en día es mostrar sólo los 4 últimos dígitos del número de la tarjeta de crédito.</li>
+</ul>
+
+<p>Los frameworks web pueden ayudar a mitigar muchas de las vulnerabilidades más comunes.</p>
+
+<h2 id="Sumario">Sumario</h2>
+
+<p>Este artículo ha explicado el concepto de seguridad en sitios web y algunas de las amanazas más comunes contra las que tu sitio debería empezar a protegerse. Lo más importante que deberías entender es que ¡una aplicación web no puede confiar en ningún dato que provenga de explorador web! Todos los datos de usuario deberían ser desinfectados antes de ser mostrados, o usados en queries SQL o llamadas a ficheros de sistema.</p>
+
+<p>Hemos llegado al final de <a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos">este módulo</a>, tratando tus primeros pasos en la programación de lado servidor de un sitio web. Esperamos que hayas disfrutado del aprendizaje de los conceptos fundamentales y estés listo para seleccionar un framework web y empezar a programar.</p>
+
+<p>{{PreviousMenu("Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</p>
+
+
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Introducci%C3%B3n">Introducción al lado servidor</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Web_frameworks">Frameworks web de lado servidor</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad de sitios web</a></li>
+</ul>
diff --git a/files/es/learn/server-side/primeros_pasos/index.html b/files/es/learn/server-side/primeros_pasos/index.html
deleted file mode 100644
index 19a5454b4b..0000000000
--- a/files/es/learn/server-side/primeros_pasos/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: Primeros Pasos en la Programación de Lado-Servidor
-slug: Learn/Server-side/Primeros_pasos
-tags:
-  - Aprendizaje
-  - Aterrizaje
-  - Codificación de scripts
-  - Guía
-  - Principiante
-  - Programación lado servidor
-  - introducción
-translation_of: Learn/Server-side/First_steps
----
-<div>{{LearnSidebar}}</div>
-
-<p>En este, nuestro módulo sobre programación de Lado-Servidor, contestaremos a unas pocas preguntas fundamentales - "¿Qué es?", "¿En qué se diferencia de la programación de Lado-Cliente?" y "¿Porqué es tan útil?". Proporcionaremos un vistazo de algunos de los "web-frameworks" de lado-servidor más populares, junto con indicaciones de cómo seleccionar el framework más adecuado para crear tu primer sitio. Finalmente proporcionaremos un artículo introductorio de alto nivel sobre seguridad en el servidor web. </p>
-
-<h2 id="Prerequisitos">Prerequisitos</h2>
-
-<p>Antes de comenzar este módulo no necesitas tener ningún conocimiento de programación de sitios web de lado-servidor, y tampoco de ningún otro tipo de programación.</p>
-
-<p>Necesitarás entender "cómo funciona la web". Te recomendamos que leas primero los siguientes temas:</p>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Common_questions/What_is_a_web_server">Qué es un servidor web</a></li>
- <li><a href="/en-US/docs/Learn/Common_questions/What_software_do_I_need">¿Qué software necesito para construir un sitio web?</a></li>
- <li><a href="/en-US/docs/Learn/Common_questions/Upload_files_to_a_web_server">¿Cómo se suben los ficheros a un servidor web?</a></li>
-</ul>
-
-<p>Con este conocimiento básico estarás listo para recorrer el camino a través de los módulos de esta sección.</p>
-
-<h2 id="Guías">Guías</h2>
-
-<dl>
- <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Introducci%C3%B3n">Introducción al lado servidor</a></dt>
- <dd>¡Bienvenidos al curso MDN de programación para principiantes de lado servidor! En este primer artículo enfocamos la programación de Lado-Servidor desde un nivel alto, respondiendo a preguntas tales como "¿qué es?", "¿en qué se diferencia de la programación de Lado-Cliente?" y "¿porqué es tan útil?". Después de leer este artículo entenderás el poder adicional para los sitios web <span style='background-color: transparent; color: #333333; display: inline !important; float: none; font-family: "Open Sans",arial,x-locale-body,sans-serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; white-space: normal;'>disponible </span>a través de la codificación lado-servidor.</dd>
- <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a></dt>
- <dd>Ahora que conoces el propósito y beneficios potenciales de la programación lado-servidor examinaremos en detalle qué pasa cuando un servidor recibe una "petición dinámica" desde un explorador web. Como el código de lado-servidor de la mayoría de sitios web gestiona las peticiones y las respuestas de forma similar, ésto te ayudará entender qué necesitas hacer cuando escribes tu propio código.</dd>
- <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Web_frameworks">Web frameworks de lado-servidor</a></dt>
- <dd>El anterior artículo te mostró lo que necesita una aplicación web de lado servidor para responder a las peticiones de un explorador web. Ahora te mostraremos cómo los web frameworks pueden simplificar estas tareas y ayudarte a seleccionar el framework correcto para tu primera aplicación web de lado servidor.</dd>
- <dt><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad de Sitios Web</a></dt>
- <dd>La seguridad de los sitios web requiere vigilancia en todos los aspectos del diseño y uso del sitio . Este artículo introductorio no te convertirá en un gurú de la seguridad de sitios web, pero te ayudará a entender los primeros pasos importantes que deber dar para robustecer tu aplicación web contra las amenazas más comunes.</dd>
-</dl>
-
-<h2 id="Evaluaciones">Evaluaciones</h2>
-
-<p>Este módulo "visión general" no hace ninguna evaluación ya que no te hemos enseñado ningún código todavía. Esperamos que en este punto tengas una comprensión de qué clase de funcionalidad puedes distribuir usando programación de lado servidor y habrás tomado una decisión sobre el web framework de lado servidor que usarás para crear tu primer sitio. </p>
diff --git a/files/es/learn/server-side/primeros_pasos/introducción/index.html b/files/es/learn/server-side/primeros_pasos/introducción/index.html
deleted file mode 100644
index 0b0d2da59e..0000000000
--- a/files/es/learn/server-side/primeros_pasos/introducción/index.html
+++ /dev/null
@@ -1,192 +0,0 @@
----
-title: Introducción al lado servidor
-slug: Learn/Server-side/Primeros_pasos/Introducción
-tags:
-  - Aprendizaje
-  - Codificación de scripts
-  - Guía
-  - Principiante
-  - Programación lado servidor
-  - Servidor
-  - introducción
-translation_of: Learn/Server-side/First_steps/Introduction
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}</div>
-
-<p class="summary">¡Bienvenidos al curso MDN de programación para principiantes de lado servidor! En este primer artículo enfocamos la programación de Lado-Servidor desde un nivel alto, respondiendo a preguntas tales como "¿qué es?", "¿en qué se diferencia de la programación de Lado-Cliente?" y "¿porqué es tan útil?". Después de leer este artículo entenderás el poder adicional para los sitios web disponible a través de la codificación lado-servidor.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>Nociones básicas de computación. Entender lo que es un servidor web.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Familiarizarse con lo que es la programación de lado servidor, qué puede hacer y en qué se diferencia de la programación de lado cliente.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>La mayoría de los grandes sitios web usan código de lado servidor para presentar, cuando se necesitan, diferentes datos, generalmente extraidos de una base de datos almacenada en un servidor y enviada al cliente para ser presentada mediante algún código (ej, HTML y JavaScript). Quizá el beneficio más significativo de la codificación de lado servidor es que te permite confeccionar el contenido del sitio web para usuarios individuales. Los sitios dinámicos pueden resaltar contenido que es más relevante basándose en las preferencias del usuario y sus hábitos. Puede hacer también que los sitios sean más fáciles de usar al almacenar las preferencias personales y la información - por ejemplo reusando los detalles de la tarjeta de crédito guardados para agilizar los pagos siguientes. Puede incluso permitir la interacción con los usuarios fuera del sitio, enviando notificaciones y actualizaciones via email o a traves de otros canales. Todas estas capacidades permite un mayor compromiso con los usuarios. </p>
-
-<p>En el mundo moderno del desarrollo web, el aprendizaje sobre desarrollo de lado servidor es altamente recomendable.</p>
-
-<h2 id="¿Qué_es_la_programación_de_sitios_web_de_lado_servidor">¿Qué es la programación de sitios web de lado servidor?</h2>
-
-<p>Los exploradores web se comunican con los <a href="/es-ES/docs/Learn/Common_questions/What_is_a_web_server">servidores web</a> usando el Protocolo de Transporte de Hyper Texto (HyperText Transport Protocol ({{glossary("HTTP")}}). Cuando pinchas en un enlace en una página web, envías un formulario o ejecutas una búsqueda, se envía una peticion HTTP desde tu explorador web al servidor web de destino. La petición incluye un URL que identifica el recurso afectado, un método que define la acción requerida (por ejemplo, obtener, borrar o publicar el recurso), y puede incluir información adicional codificada en parámetros en el URL (los pares campo-valor enviados en una cadena de consulta (<a href="https://en.wikipedia.org/wiki/Query_string">query string</a>), como datos POST (datos enviados mediate el método POST de HTTP,  <a href="/es/docs/Web/HTTP/Methods/POST">HTTP POST method</a>), o en {{glossary("Cookie", "associated cookies")}}.</p>
-
-<p>Los servidores web esperan los mensajes de petición de los clientes, los procesan cuando llegan y responden al explorador web con un mensaje de respuesta HTTP. La repuesta contiene una línea de estado indicando si la petición ha tenido éxito o no (ej, "HTTP/1.1 200 OK" en caso de éxito). El cuerpo de una respuesta exitosa a una petición podría contener el resurso solicitado (ej, una nueva página HTML, o una imagen, etc...), que el explorador web podría presetar en pantalla.</p>
-
-<h3 id="Sitios_Estáticos">Sitios Estáticos</h3>
-
-<p>El diagrama de abajo muestra una arquitectura de servidor web básica correspondiente a un <em>sitio estático</em> (un sitio estático es aquél que devuelve desde el servidor el mismo contenido insertado en el código "hard coded" siempre que se solicita un recurso en particular). Cuando un usuario quiere navegar a una página, el explorador envía una petición HTTP "GET" especificando su URL. El servidor recupera de su sistema de ficheros el documento solicitado y devuelve una respuesta HTTP que contiene el documento y un <a href="/es/docs/Web/HTTP/Status#Successful_responses">estado de éxito "success status</a>" (normalmente 200 OK). Si el fichero no puede ser recuperado por alguna razón, se devuelve un estado de error (ver <a href="/es/docs/Web/HTTP/Status#Client_error_responses">respuestas de error del cliente</a> and <a href="/es/docs/Web/HTTP/Status#Server_error_responses">respuestas de error del servidor</a>).</p>
-
-<p><img alt="A simplified diagram of a static web server." src="https://mdn.mozillademos.org/files/13841/Basic%20Static%20App%20Server.png" style="height: 223px; width: 800px;"></p>
-
-<h3 id="Sitios_Dinámicos">Sitios Dinámicos</h3>
-
-<p>Un sitio dinámico es aquél en que algun contenido de la respuesta está generado <em>dinámicamente</em> sólo cuando se necesita. En un sitio web dinámico las páginas HTML se crean normalmente insertando datos desde una base en variables dentro de plantillas HTML (esta es una forma mucho más eficiente de almacenar gran cantidad de contenido que la que usan los sitios web estáticos). Un sitio dinámico puede devolver datos diferentes para un URL basados en la información proporcionada por el usuario o sus preferencias almacenadas y puede realizar otras operaciones como parte de la devolución de respuesta (ej, enviar notificaciones).</p>
-
-<p>La mayor parte del código para soportar un sitio web dinámico debe correr en el servidor. La creación de este código se conoce como "programación de lado-servidor" (o algunas veces "back-end scripting").</p>
-
-<p>El diagrama de abajo muestra una arquitectura simple para un<em>sitio web dinámico.</em> Como en el diagrama previo, los exploradores web envían peticiones HTTP al servidor, el servidor procesa a continuación las peticiones y devuelve las respuestas HTTP apropiadas. Las peticiones de recursos <em>estáticos</em> son gestionadas de la misma manera que para los <em>sitios estáticos</em> (los recursos estáticos son cualquier fichero que no cambia - generalmente: CSS, JavaScript, Imágenes, ficheros PDF creados previamente, etc...)</p>
-
-<p><img alt="A simplified diagram of a web server that uses server-side programming to get information from a database and construct HTML from templates. This is the same diagram as is in the Client-Server overview." src="https://mdn.mozillademos.org/files/13839/Web%20Application%20with%20HTML%20and%20Steps.png"></p>
-
-<p>Las peticiones de recursos dinámicos, por el contrario, son reenviadas (2) al código del lado-servidor (mostrado en el diagrama como <em>Web Application</em>). Para las "peticiones dinámicas" el servidor interpreta la petición, lee de la base de datos la información requerida (3), combina los datos recuperados con las plantillas HTML (4), y envía de vuelta una respuesta que contiene el HTML generado (5,6). </p>
-
-<div>
-<h2 id="¿Son_iguales_la_programación_del_lado-servidor_y_lado-cliente">¿Son iguales la programación del lado-servidor y lado-cliente?</h2>
-</div>
-
-<p>Prestemos ahora nuestra atención al código involucrado en la programación de lado-servidor y lado-cliente. En cada caso, el código es significativamente diferente:</p>
-
-<ul>
- <li>Tienen diferentes propósitos y preocupaciones.</li>
- <li>Por lo general no usan los mismos lenguajes de programación (siendo la excepción el JavaScript, que puede usarse tanto en lado servidor como en lado cliente).</li>
- <li>Se ejecutan entornos de diferentes sistemas operativos.</li>
-</ul>
-
-<p>El código que se ejecuta en el explorador se conoce como código de lado-cliente, y su principal preocupación es la mejora de la apariencia y el comportamiento de una página web entregada. Esto incluye la selección y estilo de los componentes UI, la creación de layouts, navegación, validación de formularios, etc. Por otro lado, la programación de sitios web de lado servidor en su mayor parte implica la elección de <em>qué contenido</em> se ha de devolver al explorador como respuesta a sus peticiones. El código de lado-servidor gestiona tareas como la validación de los datos enviados y las peticiones, usando bases de datos para almacenar y recuperar datos, y enviando los datos correctos al cliente según se requiera.</p>
-
-<p>El código del lado cliente está escrito usando <a href="/es/docs/Learn/HTML">HTML</a>, <a href="/es/docs/Learn/CSS">CSS</a>, y <a href="/es/docs/Learn/JavaScript">JavaScript</a> — es ejecutado dentro del explorador web y tiene poco o ningún acceso al sistema operativo subyacente (incluyendo un acceso limitado al sistema de ficheros).</p>
-
-<p>Los desarrolladores web no pueden controlar qué explorador web usará cada usuario para visualizar un sitio web — los exploradores web proporcionan niveles de compatibilidad inconsistentes con las características de codificación lado cliente, y parte del reto de la programación de lado cliente es gestionar con dignidad las diferencias de soporte entre exploradores.</p>
-
-<div>El código del lado servidor puede escribirse en cualquier número de lenguajes de programación — ejemplos de lenguajes de programación populares incluyen PHP, Python, Ruby, C# y NodeJS(JavaScript). El código del lado servidor tiene acceso completo al sistema operativo del servidor y el desarrollador puede elegir qué lenguaje de programación (y qué versión específica) desea usar.</div>
-
-<div>Los desarrolladores generalmente escriben su código usando web frameworks. Los web framworks son colecciones de funciones, objetos, reglas y otras construcciones de código diseñadas para resolver problemas comunes, acelerar el desarrollo y simplificar los diferentes tipos de tareas que se han de abordar en un dominio en particular.</div>
-
-<div>De nuevo, mientras que, tanto el código lado cliente y el lado servidor usan frameworks, los dominios son muy diferentes, y por lo tanto también lo son los frameworks. Los frameworks del lado cliente simplifican los diseños y las tareas de presentación mientras que los del lado servidor proporcionan un montón de funcionalidades "comunes" que tendría que haber implementado uno mismo (ej, soporte para las sesiones, soporte para los usuarios y autenticación, acceso fácil a la base de datos, librerías de plantillas, etc...).</div>
-
-<div class="note">
-<p>Nota: Los frameworks del lado cliente se usan con frecuencia para acelerar el desarrollo del código del lado cliente, pero también se puede elegir escribir todo el código a mano; de hecho, escribir el código a mano puede ser más rápido y más eficiente si sólo se necesita una UI para sitio web pequeña y simple. Por contra, casi nunca se consideraría escribir el componente del lado servidor de una aplicación web ("web app") sin un framework — implementar una característica vital como un servidor HTTP es realmente difícil de hacer de la nada en un lenguaje como, por ejemplo, Python, pero los  web frameworks de Python como Django proporcionan uno  listo para usar, junto con otras herramientas muy útiles.</p>
-</div>
-
-<h2 id="¿Qué_se_puede_hacer_en_el_lado-servidor">¿Qué se puede hacer en el lado-servidor?</h2>
-
-<p>La programación del lado-servidor es muy útil porque nos permite distribuir <em>eficientemente</em> información a medida para usuarios individuales y por lo tanto crear una experiencia de usuario mucho mejor.</p>
-
-<p>Compañías como Amazon utilizan la programación del lado-servidor para construir resultados de búsquedas de productos, hacer sugerencias sobre productos escogidos basados en las preferencias del cliente y sus hábitos de compra previos, simplificar las adquisiciones, etc. Los bancos usan la programación del lado-servidor para almacenar la información sobre las cuentas y permitir ver y realizar transacciones sólo a los usuarios autorizados. Otros servicios como Facebook, Twitter, Instagram y Wikipedia usan la programación de lado-servidor para destacar, compartir y controlar el acceso al contenido interesante.</p>
-
-<p>Algunos de los usos y beneficios comunes de la programación de lado-servidor se lista debajo. Notarás que hay algo de solapamiento.</p>
-
-<h3 id="Almacenaje_y_distribución_eficiente_de_información">Almacenaje y distribución eficiente de información</h3>
-
-<p>Imagina cuántos productos están disponibles en Amazon, e imagina cuántas entradas se han escrito en Facebook. Crear una página estática separada para cada producto o entrada sería completamente ineficiente.</p>
-
-<p>La programación de lado-servidor nos permite por el contrario almacenar la información en una base de datos y construir dinámicamente y devolver ficheros HTML y de otros tipos (ej, PDFs, imágenes, etc.). También es posible devolver simplemente datos ({{glossary("JSON")}}, {{glossary("XML")}}, etc.) para presentar mediante los web frameworks adecuados del lado-cliente (esto reduce la carga de procesamiento del servidor y la cantidad de datos que se necesitan enviar).</p>
-
-<p>El servidor no se limita a enviar información de las bases de datos, y podría además devolver el resultado de herramientas de software o datos de servicios de comunicación. El contenido puede incluso ser dirigido por el tipo de dispositivo cliente que lo está recibiendo.</p>
-
-<p>Debido a que la información está en una base de datos, puede también ser compartida y actualizada con otros sistemas de negocio (por ejemplo, cuando se venden los productos online o en una tienda, la tienda debería actualizar su base de datos de inventario.</p>
-
-<div class="note">
-<p>Nota: Tu imaginación no tiene que trabajar duro para ver el beneficio de la codificación de lado-servidor para el almacenaje y distribución de información:</p>
-
-<ol>
- <li>Vete a <a href="https://www.amazon.com">Amazon</a> o a cualquier otro sitio de comercio electrónico "e-commerce".</li>
- <li>Busca por un número de palabras clave y nota como la estructura de la página no cambia, incluso aunque cambien los resultados. </li>
- <li>Abre dos o tres productos diferentes. Fíjate de nuevo como tienen una estructura y diseño común, pero el contenido para los diferentes productos ha sido extraido de la base de datos.</li>
-</ol>
-
-<p>Para un término de búsqueda común (digamos "pez") puedes ver literalmente millones de valores retornados. Usar una base de datos permite que éstos sean almacenados y compartidos de forma eficiente, y permite que la presentación de la información esté controlada en un solo sitio.</p>
-</div>
-
-<h3 id="Experiencia_de_usuario_personalizada">Experiencia de usuario personalizada</h3>
-
-<p>Los servidores pueden almacenar y usar la información acerca de los clientes para proporcionar una experiencia de usuario conveniente y dirigida. Por ejemplo, muchos usuarios almacenan tarjetas de crédito de forma que los detalles no tienen que ser introducidos de nuevo. Sitios como Google Maps usan la localización de tu casa y la actual para proporcionar una información sobre la ruta a seguir y resaltar los negocios locales en los resultados de búsqueda.</p>
-
-<p>Un análisis profundo de los hábitos del usuario se puede usar para anticipar sus intereses y personalizar las respuestas y notificaciones futuras, proporcionando, por ejemplo, una lista de las localizaciones visitadas o populares que querrías buscar en un mapa.</p>
-
-<div class="note">
-<p>Nota: Vete a <a href="https://maps.google.com/">Google Maps</a> como usuario anónimo, selecciona el botón Direcciones, e introduce los puntos de partida y destino de un viaje. Ahora inicia sesión en el sistema con tu cuenta de Google, si tienes una (en el panel de abajo aparece información acerca de este proceso donde seleccionas direcciones). El sitio web te permitirá ahora seleccionar las localizaciones de casa y trabajo como puntos de partida y destino (o almacenar estos detalles si no lo has hecho así).</p>
-</div>
-
-<h3 id="Acceso_controlado_al_contenido">Acceso controlado al contenido </h3>
-
-<p>La programación de lado-servidor permite a los sitios restringir el acceso a usuarios autorizados y servir sólo la información que se le permite ver al usuario.</p>
-
-<p>Ejemplos del mundo real incluyen:</p>
-
-<ul>
- <li>Redes sociales como Facebook permiten a los usuarios controlar totalmente sus propios datos pero permitiendo sólo a sus amigos ver o comentar sobre ellos. El usuario determina quien puede ver sus datos, y por extensión, los datos de quienes aparecen en sus notificaciones — autorización es una parte central de la experiencia de usuario!</li>
- <li>
-  <p>El sitio en el que te encuentras ahora controla el acceso al contenido: los artículos son visibles a todos, pero sólo los usuarios que se han identificado pueden editar el contenido. Para comprobar ésto, pincha en el botón Edit en la parte superior de esta página — si te has identificado iniciando sesión se te mostrará la vista de edición; si no has iniciado sesión serás enviado a una página de registro.</p>
- </li>
-</ul>
-
-<div class="note">
-<p>Nota: Considera otros ejemplos reales donde el acceso al contenido está controlado. Por ejemplo, ¿qué puedes ver si vas al sitio online de tu banco? Inicia sesión con tu cuenta — ¿qué información adicional puedes ver y modificar? ¿Qué información puedes ver y sólo el banco puede cambiar?</p>
-</div>
-
-<h3 id="Almacenar_información_de_sesiónestado">Almacenar información de sesión/estado</h3>
-
-<p>La programación de lado-servidor permite a los desarrolladores hacer uso de las sesiones — es básicamente un mecanismo que permite al servidor almacenar información sobre el usuario actual del sitio u enviar diferentes respuestas basadas en esa información. Esto permite, por ejemplo, que un sitio sepa que un usuario ha iniciado sesión previamente y presente enlaces a sus correos, o a su historial de órdenes, o quizá guardar el estado de un simple juego de forma que el usuario pueda volver al sitio de nuevo y retomar el juego donde lo dejó.</p>
-
-<div class="note">
-<p>Nota: Visita el sitio de un periódico que tenga un modelo de subscripción y abre un puñado de pestañas (ej, <a href="http://www.theage.com.au/">The Age</a>). Continua visitando el sitio durante unos pocos días/horas. En algún momento serás finalmente redirigido a las páginas que explican cómo suscribirte y se te impedirá el acceso a los artículos. Esta información es un ejemplo de información de sesión almacenada en cookies.</p>
-</div>
-
-<h3 id="Notificaciones_y_comunicación">Notificaciones y comunicación</h3>
-
-<p>Los servidores pueden enviar notificaciones de tipo general o específicas de usuario a través del propio sitio web o vía correo electrónico, SMS, mensajería instanténea, conversaciones de video u otros servicios de comunicación.</p>
-
-<p>Unos pocos ejemplos incluyen:</p>
-
-<ul>
- <li>Facebook y Twitter envían mensajes de correoy SMS para notificarte de nuevas comunicaciones.</li>
- <li>Amazon envía con regularidad emails que sugieren productos similares a aquellos comprados o vistos anteriormente y en los que podrías estar interesado.</li>
- <li>Un servidor web podría enviar mensajes de aviso a los administradores del sistema alertandoles de memoria baja en el servidor o de actividades de usuario sospechosas.</li>
-</ul>
-
-<div class="note">
-<p>Nota: El tipo de notificación más común es una "confirmación de registro". Elige uno cualquiera de los grandes sitios en que estés interesado (Google, Amazon, Instagram, etc.) y crea una cuenta nueva usando tu dirección de correo. En breve recibirás un email de confirmación de registro, o solicitando un acuse de recibo para activar la cuenta.</p>
-</div>
-
-<h3 id="Análisis_de_datos">Análisis de datos</h3>
-
-<p>Un sitio web puede recolectar un montón de datos acerca de los usuarios: qué es lo que buscan, qué compran, qué recomiendan, cuánto tiempo permanecen en cada página. La programación de lado-servidor puede utilizarse para refinar las respuestas basándose en el análisis de estos datos.</p>
-
-<p>Por ejemplo, Amazon y Google anuncian ambos productos basados en búsquedas previas (y adquisiciones).</p>
-
-<div class="note">
-<p>Nota: Si eres usuario de Facebook vete a tu muro y hecha un ojo a la ristra de entradas. Fíjate como algunas de las entradas no están en orden numérico - en particular las entradas con más "me-gusta" están con frecuencia en lugares más altos de la lista que las entradas más recientes. Echa un ojo también a qué clase de anuncios te están mostrando — podrías ver anuncios de cosas que has mirado en otros sitios. El algoritmo de Facebook para resaltar contenido y anuncios puede ser un poco misterioso, pero está claro que lo que hace depende de lo que te gusta y de tus hábitos de visualización!</p>
-</div>
-
-<h2 id="Sumario">Sumario</h2>
-
-<p>Felicidades, has alcanzado el final de primer artículo sobre programación de lado-servidor. </p>
-
-<p>Ahora ya has aprendido que el código de lado-servidor se ejecuta en un servidor web y que su papel principal es controlar <em>qué </em>información se envía al usuario (mientras que el código de lado-cliente gestiona principalmente la estructura y presentación  de esos datos al usuario).</p>
-
-<p>También deberías comprender que es útil porque nos permite crear sitios web que distribuyen <em>de forma eficiente</em> información seleccionada dirigida a usuarios individuales y tener una buena idea de algunas de las cosas que podrías ser capaz de hacer cuando seas un programador de lado-servidor.</p>
-
-<p>Finalmente, deberías comprender que el código de lado-servidor se puede escribir en un gran número de lenguajes de programación y que deberías usar un web framework para hacer más fácil el proceso completo.</p>
-
-<p>En un artículo futuro te ayudaremos a escoger el mejor web framework para tu primer sitio; Aunque a continuación te llevaremos a través de las principales interacciones cliente-servidor en un poco más de detalle.</p>
-
-<p>{{NextMenu("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps")}}</p>
diff --git a/files/es/learn/server-side/primeros_pasos/seguridad_sitios_web/index.html b/files/es/learn/server-side/primeros_pasos/seguridad_sitios_web/index.html
deleted file mode 100644
index c2630fc050..0000000000
--- a/files/es/learn/server-side/primeros_pasos/seguridad_sitios_web/index.html
+++ /dev/null
@@ -1,177 +0,0 @@
----
-title: Seguridad de Sitios Web
-slug: Learn/Server-side/Primeros_pasos/seguridad_sitios_web
-tags:
-  - Aprendizaje
-  - Codificación de scripts
-  - Guía
-  - Principiante
-  - Programación de lado servidor
-  - Seguridad
-  - Seguridad Web
-  - Seguridad de sitios Web
-  - introducción
-translation_of: Learn/Server-side/First_steps/Website_security
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenu("Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</div>
-
-<p class="summary">La Seguridad web require vigilancia en todos los aspectos del diseño y uso de un sitio web. Este artículo introductorio no te hará un gurú de la seguridad en sitios web, pero te ayudará a entender de donde vienen las amenazas y qué puedes hacer para fortalecer tu aplicación web contra los ataques más comunes.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Pre-requisitos:</th>
-   <td>Conocimientos de computación básicos.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Entender las amenazas más comunes para la seguridad de una aplicación web y lo que puedes hacer para reducir el riesgo de que tu sitio sea hackeado.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="¿Qué_es_la_seguridad_de_sitios_web">¿Qué es la seguridad de sitios web?</h2>
-
-<p>¡Internet es un sitio peligroso! Con mucha frecuencia escuchamos sobre sitios web que dejan de estar disponibles debido a ataques de denegación de servicio, o presentan información modificada (y con frecuencia dañada) en sus páginas de inicio. En otros casos de alto nivel, millones de contraseñas, direcciones de correo electrónico y detalles de tarjetas de crédito han sido filtrados al dominio público, exponiendo a los usuarios del sitio web tanto a bochorno personal como a riesgo finaciero.</p>
-
-<p>El propósito de la seguridad web es prevenir ataques de esta (o de cualquier otra) clase. Mas formalmente, <em>la seguridad es la acción/práctica de proteger sitios web del acceso, uso, modificación, destrucción o interrupción, no autorizados</em>.</p>
-
-<p>La seguridad de sitios web eficaz requiere de esfuerzos de diseño a lo largo de la totalidad del sitio web: en tu aplicación web, en la configuración del servidor web, en tus políticas para crear y renovar contraseñas, y en el código del lado cliente. Al mismo tiempo que todo esto suena muy inquietante, la buena noticia es que si estás usando un framework web de lado servidor, es casi seguro que habilitará por defecto mecanismos de defensa robustos y bien pensados contra gran cantidad de los ataques más comunes. Otros ataques pueden mitigarse por medio de la configuración de tu servidor web, por ejemplo habilitando HTTPS. Finalmente, hay herramientas de escaneado de vulnerabilidades disponibles públicamente que pueden ayudarte a averiguar si has cometido algún error obvio.</p>
-
-<p>El resto de este artículo proporciona más detalle sobre unas pocas amenazas comunes y algunos de los pasos simples que puedes dar para proterger tu sitio.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Este es un tema de introducción, diseñado para ayudarte a pensar sobre la seguridad de sitios web. No pretende ser exhaustivo.</p>
-</div>
-
-<h2 id="Amenazas_contra_la_seguridad_de_sitios_web">Amenazas contra la seguridad de sitios web</h2>
-
-<p>Esta sección lista sólo algunas pocas de las amenazas más comunes para los sitios web y cómo son mitigadas. A medida que vayas leyendo, fíjate cómo las amenazas tienen éxito cuando la aplicación web, ¡o confía o <em>no es lo suficientemente paranoica</em> acerca de los datos que vienen del explorador web!</p>
-
-<h3 id="Cross-Site_Scripting_XSS">Cross-Site Scripting (XSS)</h3>
-
-<p>XSS es un término que se usa para describir una clase de ataques que permiten al atacante inyectar scripts de lado cliente, <em>a través </em>del sitio web, hasta los exploradores de otros usuarios. Como el código inyectado va del servidor del sitio al explorador, se supone de confianza, y de aquí que pueda hacer cosas como enviar al atacante la cookie de autorización al sitio del usuario. Una vez que el atacante tiene la cookie pueden iniciar sesión en el sitio como si fuera el verdadero usuario y hacer cualquier cosa que pueda hacer éste. Dependiendo de que sitio sea, esto podría incluir acceso a los detalles de su tarjeta de crédito, ver detalles de contactos o cambiar contraseñas, etc.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Las vulnerabilidades XSS han sido históricamente más comunes que las de cualquier otro tipo.</p>
-</div>
-
-<p>Hay dos aproximaciones principales para conseguir que el sitio devuelva scripts inyectados al explorador — se conocen como vulnerabilidades XSS <em>reflejadas</em> y <em>persistentes</em>.</p>
-
-<ul>
- <li>Una vulnerabilidad XSS <em>reflejada</em> ocurre cuando contenido del usuario que se pasa al servidor se devuelve <em>inmediatamente y sin modificar</em> par que los muestre el explorador — ¡cualquier script en el contenido original del usuario se ejecutará cuando se cargue una nueva página!<br>
-  Por ejemplo, considera una función de búsqueda en un sitio donde los términos de búsqueda están codificados como parámetros URL y estos términos se presentan junto con los resultados. Un atacante puede construir un enlace de búsqueda que contenga un script malicioso como parámetro (ej. <code>http://mysite.com?q=beer&lt;script%20src="http://evilsite.com/tricky.js"&gt;&lt;/script&gt;</code>) y enviarlo como enlace en un correo electrónico a otro usuario: Si el destinatario pincha en este "enlace interesante", el script se ejecutará cuando se muestren en pantalla los resultados de la búsqueda. Como discutimos arriba, ésto da al atacante toda la información que necesita para entrar en el sitio como si fuera el usuario destinatario — realizando compras potencialmente como si fuera el usuario o compartiendo su información de contactos.</li>
- <li>Una vulnerabilidad <em>XSS persistente</em> es aquella en la que el script malicioso se <em>almacena</em> en el sitio web y luego más tarde se vuelve a presentar en pantalla sin modificar para que otros usuarios lo ejecuten involuntariamente. Por ejemplo, un foro de discusión que accepta comentarios que contengan HTML sin modificar, podría almacenar un script malicioso de un atacante. Cuando se muestren los comentarios se ejecutará el script y enviará al atacante la información requerida para acceder a la cuenta del usuario. Esta clase de ataque es extremadamente popular y muy potente, porque el atacante no tiene que tener ninguna relación directa con las víctimas.<br>
-  <br>
-  Si bien los datos <code>POST</code> o <code>GET</code> son las fuentes más comunes de vulnerabilidades, cualquier dato del explorador es vulnerable potencialmente (incluyendo los datos de cookies renderizados por el explorador, o los ficheros de los usuarios que éste sube o que se muestran).</li>
-</ul>
-
-<p>La mejor defensa contra las vulnerabilidades XSS es eliminar o deshabilitar cualquier etiqueta que pueda contener instrucciones para ejecutar código. En el caso del HTML ésto incluye etiquetas como <code>&lt;script&gt;</code>, <code>&lt;object&gt;</code>, <code>&lt;embed&gt;</code>, y <code>&lt;link&gt;</code>.</p>
-
-<div>
-<p>El proceso de modificar los datos del usuario de manera que no puedan utilizarse para ejecutar scripts o que afecten de otra forma la ejecución del código del servidor, se conoce como "desinfección de entrada" (input sanitization). Muchos frameworks web desinfectan automáticamente la entrada del usuario desde formularios HTML, por defecto.</p>
-</div>
-
-<h3 id="Inyección_SQL">Inyección SQL</h3>
-
-<p>Las vulnerabilidades de Inyección SQL habilitan que usuarios maliciosos ejecuten código SQL arbitrario en una base de datos, permitiendo que se pueda acceder a los datos, se puedan modificar o borrar, independientemente de los permisos del usuario. Un ataque de inyección con éxito, podría falsificar identidades, crear nuevas identidades con derechos de administración, acceder a todos los datos en el servidor o destruir/modificar los datos para hacerlos inutilizables.</p>
-
-<p>Esta vulnerabilidad está presente si la entrada del usuario que se pasa a la sentencia SQL subyacente puede cambiar el significado de la misma. Por ejemplo, considera el código de abajo, que pretende listar todos los usuarios con un nombre en particular (<code>userName</code>) que ha sido suministrado en un formulario HTML:</p>
-
-<pre class="brush: sql">statement = "SELECT * FROM users WHERE name = '" + <strong>userName</strong> + "';"</pre>
-
-<p>Si el usuario introduce su nombre real, la cosa funciona como se pretende. Sin embargo un usuario malicioso podría cambiar completamente el comportamiento de esta sentencia SQL a la nueva sentencia de abajo, simplemente especificando para <code>userName</code> el texto de abajo en "<strong>negrilla</strong>". La sentencia modificada crea una sentencia SQL válida que borra la tabla  <code>users</code> y selecciona todos los datos de la tabla <code>userinfo</code>  (revelando la información de todos los usuarios). Esto funciona por que la primera parte del texto inyectado (<code>a';</code>) completa la sentencia original (' es el símbolo para indicar una cadena literal en SQL).</p>
-
-<pre class="brush: sql">SELECT * FROM users WHERE name = '<strong>a';DROP TABLE users; SELECT * FROM userinfo WHERE 't' = 't</strong>';
-</pre>
-
-<p>La manera de evitar esta clase de ataque es asegurar que cualquier dato de usuario que se pasa a un query SQL no puede cambiar la naturaleza del mismo. Una forma de hacer ésto es <a href="https://en.wikipedia.org/wiki/Escape_character">eludir ('escape')</a> todos los caracteres en la entrada de usuario que tengan un significado especial en SQL.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: La sentencia SQL trata el caracer ' como el principio y el final de una cadena de texto. Colocando el caracter barra invertida \ delante, "eludimos" el símbolo (\'), y le decimos a SQL que lo trate como un caracter de texto (como parte de la misma cadena).</p>
-</div>
-
-<p>En la sentencia de abajo eludimos el carácter '. SQL interpretará ahora como "nombre" la cadena de texto completa mostrada en negrilla (!un nombre muy raro desde luego, pero no dañino¡)</p>
-
-<pre class="brush: sql">SELECT * FROM users WHERE name = '<strong>a\';DROP TABLE users; SELECT * FROM userinfo WHERE \'t\' = \'t'</strong>;
-
-</pre>
-
-<p>Los frameworks web con frecuencia tienen cuidado de hacer por tí la elusión de caracteres. Django, por ejemplo se asegura que cualquier dato de usuario que se pasa a los conjuntos de queries (modelo de queries) está corregido.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Esta sección se sustenta aquí en la información de <a href="https://en.wikipedia.org/wiki/SQL_injection">Wikipedia</a>.</p>
-</div>
-
-<h3 id="Cross_Site_Request_Forgery_CSRF">Cross Site Request Forgery (CSRF)</h3>
-
-<p>Los ataques de CSRF permiten que un usuario malicioso ejecute acciones usando las credenciales de otro usuario sin el conocimiento o consentimiento de éste.</p>
-
-<p>Este tipo de ataque se explica mejor con un ejemplo. John es un usuario malicioso que sabe que un sitio en particular permite a los usuarios que han iniciado sesión enviar dinero a una cuenta específica usando una petición HTTP <code>POST</code> que incluye el nombre de la cuenta y una cantidad de dinero. John construye un formulario que incluye los detalles de su banco y una cantidad de dinero como campos ocultos, y lo envía por correo electrónico a otros usuarios del sitio (con el botón de <em>Enviar</em> camuflado como enlace a un sitio "hazte rico rápidamente").</p>
-
-<p>Si el usuario pincha el botón de enviar, se envía al servidor una petición HTTP <code>POST</code> que contiene los detalles de la transacción y <em>todos los cookies de lado-cliente que el explorador asocia con el sitio</em> (añadir cookies asociados con el sitio es un comportamiento normal de los exploradores). El servidor comprobará los cookies, y los usará para determinar si el usuario ha iniciado sesión o no y si tiene permiso para hacer la transacción.</p>
-
-<p>El resultado es que cualquier usuario que pinche en el botón <em>Enviar</em> mientras tiene la sesión iniciada en el sitio comercial hará la transacción. ¡John se hará rico!</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El truco aquí es que John no necesita tener acceso a los cookies del usuario (o acceso a sus credenciales) — El explorador del usuario almacena esta información, y la incluye automáticamente en todas las peticiones al servidor asociado.</p>
-</div>
-
-<p>Una manera de prevenir este tipo de ataque por parte del servidor es requerir que la petción <code>POST</code> incluya una palabra secreta específica del usuario generada por el sitio (la palabra secreta podría proporcionarla el servidor cuando envía el formulario web que se usa para hacer transferencias). Esta aproximación evita que John pueda crear su propio formulario, porque necesitaría conocer la palabra secreta que el servidor ha proporcionado para el usuario. Incluso si conociera esta palabra y creara un formulario para un usuario en particular, no podría usar el mismo formulario para atacar a todos los usuarios.</p>
-
-<p>Los frameworks web incluyen con frecuencia tales mecanismos de prevención de CSRF.</p>
-
-<h3 id="Otras_amenazas">Otras amenazas</h3>
-
-<p>Otros ataques/vulnerabilidades incluyen:</p>
-
-<ul>
- <li><a href="https://www.owasp.org/index.php/Clickjacking">Clickjacking</a>. En este tipo de ataque, el usuario malicioso secuestra las pulsaciones de ratón dirigidas a un sitio visible por encima de los demás y las redirige a una página escondida por debajo. Esta técnica se usaría, por ejemplo, para presentar un sitio bancario legítimo pero capturar las credenciales de inicio de sesión en un {{htmlelement("iframe")}} invisible controlado por el atacante. Alternativamente podría usarse para conseguir que el usuario pinchara sobre un botón en un sitio visible, pero al hacerlo realmente estuviera sin advertirlo pinchando en otro botón completamente diferente. Como defensa, tu sitio puede protegerse de ser embebido en un iframe de otro sitio configurando las cabeceras HTTP apropiadamente.</li>
- <li><a href="/en-US/docs/Glossary/Distributed_Denial_of_Service">Denegación de Servicio, (Denial of Service</a>, DoS). DoS se consigue normalmente inundando el sitio objetivo con peticiones espúreas de manera que se interrumpa el acceso a los usuarios legítimos. Las peticiones pueden simplemente ser numerosas, o consumir individualmente gran cantidad de recursos (ej. lecturas lentas, subidas de grandes ficheros, etc.) Las defensas contra DoS normalmente trabajan mediante la indentificación y el bloqueo de tráfico "malo" permitiendo sin embargo que atraviesen los mensajes legítimos. Estas defensas se encuentran típicamente dentro o antes del servidor (no son parte de la aplicación web misma).</li>
- <li><a href="https://en.wikipedia.org/wiki/Directory_traversal_attack">Salto de Directorios</a>/Revelación de Ficheros. En este tipo de ataque un usuario malicioso intenta acceder a partes del sistema de ficheros del servidor web a los que no debería tener acceso. Esta vulnerabilidad ocurre cuando el usuario es capaz de pasar nombres de fichero que incluyen caracteres del sistema de navegación (ej. <code>../../</code>). La solución es desinfectar la entrada antes de usarla.</li>
- <li><a href="https://en.wikipedia.org/wiki/File_inclusion_vulnerability">Inclusión de Ficheros</a>. En este ataque un usuario es capaz de especificar, para mostrar o ejecutar, un fichero "no intencionado para ello" en los datos que le pasa al servidor. Una vez ha sido cargado este fichero podría ejecutarse en el servidor web o en el lado cliente (llevando a un ataque XSS). La solución es desinfectar la entrada antes de usarla.</li>
- <li><a href="https://www.owasp.org/index.php/Command_Injection">Inyección de Comandos</a>. Los ataques de inyección de comandos permiten a un usuario malicioso ejecutar comandos del sistema arbitrarios en el sistema operativo del host. La solución es desinfectar la entrada de usuario antes de que pueda ser usada en llamadas al sistema.</li>
-</ul>
-
-<p>Hay muchas más. Para un lisado completo ver <a href="https://en.wikipedia.org/wiki/Category:Web_security_exploits">Category:Web security exploits</a> (Wikipedia) y <a href="https://www.owasp.org/index.php/Category:Attack">Category:Attack</a> (Open Web Application Security Project).</p>
-
-<h2 id="Unos_cuantos_mensajes_clave">Unos cuantos mensajes clave</h2>
-
-<p>Casi todos los exploits de las secciones anteriores tienen éxito cuando la aplicación web confía en los datos que vienen del explorador. Sea lo que sea que hagas para mejorar la seguridad de tu sitio web, deberías desinfectar todos los datos originados por el usuario antes de ser mostrados en el explorador, usados en queries SQL o pasados en una llamada al sistema operativo o fichero de sistema.</p>
-
-<div class="warning">
-<p>Importante: La lección más importante que debes aprender acerca de la seguridad de sitios web es <strong>nunca confíes en los datos del explorador web</strong>. Esto incluye los datos en parámetros URL de las peticiones<code>GET</code>, datos <code>POST</code>, cabeceras HTTP y cookies, ficheros subidos por los usuarios, etc. Comprueba siempre y desinfecta todos los datos entrantes. Siempre asume lo peor.</p>
-</div>
-
-<p>Otras cuantas medidas concretas que puedes tomar son:</p>
-
-<ul>
- <li>Usar una gestión de contraseñas más efectiva. Fomentar las contraseñas fuertes y que se cambien con regularidad. Considerar para tu sitio web la autenticación de dos factores, de manera que, además de la contraseña, el usuario tenga que introducir algún otro código de autenticación (normalmente alguno que se distribuye mediante algún hardware que sólo tiene el usuario, como un código en un mensaje de texto enviado a su teléfono móvil).</li>
- <li>Configurar tu servidor web para usar <a href="/en-US/docs/Glossary/https">HTTPS</a> y <a href="/en-US/docs/Web/Security/HTTP_strict_transport_security">HTTP Strict Transport Security</a> (HSTS). HTTPS encripta los datos enviados entre el cliente y el servidor. Esto asegura que las credenciales de incio de sesión, cookies, datos <code>POST</code> e información de cabecera permanecen menos disponibles a los atacantes.</li>
- <li>Seguir la pista a las amenazas más populares (<a href="/en-US/docs/">aquí puedes acceder a la lista actual OWASP</a>) y atacar las vulnerabilidades más comunes primero.</li>
- <li>Usar herramientas de <a href="https://www.owasp.org/index.php/Category:Vulnerability_Scanning_Tools">escanéo de vulnerabilidade</a><a href="https://www.owasp.org/index.php/Category:Vulnerability_Scanning_Tools">s</a> para realizar pruebas automáticas de seguridad en tu sitio (más adelante, si tu sitio web llega a ser super exitoso puedes también encontrar bugs por medio de ofrecer recompensas por encontrar bugs <a href="https://www.mozilla.org/en-US/security/bug-bounty/faq-webapp/">como hace Mozilla aquí</a>).</li>
- <li>Almacena y muestra sólo los datos que necesiten serlo. Por ejemplo, si tus usuarios deben almacenar información sensible como los detalles de las tarjetas de crédito, sólo muestra lo suficiente del número de tarjeta de manera que pueda ser identificada por el usuario, y no suficiente para que pueda ser copiado por el atacante y usado en otro sitio. El patrón más común hoy en día es mostrar sólo los 4 últimos dígitos del número de la tarjeta de crédito.</li>
-</ul>
-
-<p>Los frameworks web pueden ayudar a mitigar muchas de las vulnerabilidades más comunes.</p>
-
-<h2 id="Sumario">Sumario</h2>
-
-<p>Este artículo ha explicado el concepto de seguridad en sitios web y algunas de las amanazas más comunes contra las que tu sitio debería empezar a protegerse. Lo más importante que deberías entender es que ¡una aplicación web no puede confiar en ningún dato que provenga de explorador web! Todos los datos de usuario deberían ser desinfectados antes de ser mostrados, o usados en queries SQL o llamadas a ficheros de sistema.</p>
-
-<p>Hemos llegado al final de <a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos">este módulo</a>, tratando tus primeros pasos en la programación de lado servidor de un sitio web. Esperamos que hayas disfrutado del aprendizaje de los conceptos fundamentales y estés listo para seleccionar un framework web y empezar a programar.</p>
-
-<p>{{PreviousMenu("Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</p>
-
-
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Introducci%C3%B3n">Introducción al lado servidor</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Web_frameworks">Frameworks web de lado servidor</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad de sitios web</a></li>
-</ul>
diff --git a/files/es/learn/server-side/primeros_pasos/vision_general_cliente_servidor/index.html b/files/es/learn/server-side/primeros_pasos/vision_general_cliente_servidor/index.html
deleted file mode 100644
index 05ce1f9451..0000000000
--- a/files/es/learn/server-side/primeros_pasos/vision_general_cliente_servidor/index.html
+++ /dev/null
@@ -1,334 +0,0 @@
----
-title: Visión General Cliente-Servidor
-slug: Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor
-tags:
-  - Aprendizaje
-  - Codificación de scripts
-  - Guía
-  - Principiante
-  - Programación lado servidor
-  - Servidor
-  - introducción
-translation_of: Learn/Server-side/First_steps/Client-Server_overview
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Server-side/First_steps/Introduction", "Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</div>
-
-<p class="summary">Ahora que conoces el propósito y los beneficios potenciales de la programación de lado-servidor vamos a examinar en detalle lo que ocurre cuando un servidor recibe una "petición dinámica" desde un explorador web. Ya que el código de lado servidor de la mayoría de los sitios web gestiona peticiones y respuestas de formas similares, este artículo te ayudará a entender lo que necesitas hacer para escribir la mayor parte de tu propio código.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>Conocimientos básicos de computación. Noción básica de lo que es un servidor.</td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>Comprender lo que son las interacciones cliente-servidor en un sitio web dinámico, y en particular que operaciones necesita realizar el código de lado servidor.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>No hay código real en el debate porque ¡todavía no hemos seleccionado el framework web que usaremos para escribir nuestro código! Sin embargo este debate sí que es muy relevante incluso ahora, porque el comportamiento descrito debería ser implementado por tu código de lado servidor independientemente de qué lenguaje de programación o framework web hayas seleccionado.</p>
-
-<h2 id="Servidores_Web_y_HTTP_(iniciación)">Servidores Web y HTTP (iniciación)</h2>
-
-<p>Los exploradores web se comunican con los <a href="https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_web_server">servidores web</a> usando el Protocolo de Transferencia de HyperTexto (<strong>H</strong>yper<strong>T</strong>ext<strong>T</strong>ransfer <strong>P</strong>rotocol <a href="/en-US/docs/Web/HTTP">HTTP</a>). Cuando pinchas en un enlace sobre una página web, envías un formulario o ejecutas una búsqueda, el explorador envía una petición (<em>Request) </em>HTTP al servidor.</p>
-
-<p>Esta petición incluye:</p>
-
-<ul>
- <li>Una URL que identifica el servidor de destino y un recurso (ej. un fichero HTML, un punto de datos particular en el servidor, o una herramienta a ejecutar).</li>
- <li>Un método que define la acción requerida (por ejemplo, obtener un fichero o salvar o actualizar algunos datos). Los diferentes métodos/verbos y sus acciones asociadas se listan debajo:
-  <ul>
-   <li><code>GET</code>: Obtener un recurso específico (ej. un fichero HTML que contiene información acerca de un producto  o una lista de productos).</li>
-   <li><code>POST</code>: Crear un nuevo recurso (ej. añadir un nuevo artículo a una wiki, añadir un nuevo contacto a una base de datos). </li>
-   <li><code>HEAD</code>: Obtener la información de los metadatos sobre un recurso específico sin obtener el cuerpo entero tal como haría <code>GET</code>. Podrías, por ejemplo, usar una petición <code>HEAD</code> para encontrar la última vez que un  recurso fue actualizado, y a continuación usar la petición <code>GET</code> (más "cara") para descargar el recurso sólo si éste ha cambiado. </li>
-   <li><code>PUT</code>: Actualizar un recurso existente (o crear uno nuevo si no existe).</li>
-   <li><code>DELETE</code>: Borrar el recurso específico.</li>
-   <li><code>TRACE</code>, <code>OPTIONS</code>, <code>CONNECT</code>, <code>PATCH</code>: Estos verbos son para tareas menos comunes/avanzadas, por lo que no los trataremos aquí.</li>
-  </ul>
- </li>
- <li>Se puede codificar información adicional con la petición (por ejemplo, datos de un formulario HTML). La información puede ser codificada como:
-  <ul>
-   <li>Parámetros URL: Las peticiones <code>GET</code> codifican los datos en la URL enviada al servidor añadiendo al final pares nombre/valor — por ejemplo, <code>http://mysite.com<strong>?name=Fred&amp;age=11</strong></code>. Siempre encontrarás un signo de interrogación(<code>?</code>) separando los parámetros URL del resto de la misma, un signo igual (<code>=</code>) separando cada nombre de su valor asociado y un ampersand (<code>&amp;</code>) separando cada par. Los parámetros URL son inherentemente "inseguros" ya que pueden ser modificados por los usuarios y ser enviados de nuevo. Como consecuencia los parámetros URL/peticiones <code>GET</code> no se usan para peticiones de actualización de datos en el servidor.</li>
-   <li>Datos <code>POST</code>. Las peticiones <code>POST</code> añaden nuevos recursos, cuyos datos están codificados dentro del cuerpo de la petición.</li>
-   <li>Cookies de lado cliente. Los Cookies contienen datos de sesión acerca del cliente, incluyendo las claves que el servidor puede usar para determinar su estado de incio de sesión y los permisos/accesos a los recursos.</li>
-  </ul>
- </li>
-</ul>
-
-<p>Los servidores web esperan los mensajes de petición de los clientes, los procesan cuando llegan y responden al explorador web con un mensaje de respuesta HTTP. La respuesta contiene un <a href="/en-US/docs/Web/HTTP/Status">código de estado de respuesta HTTP</a> que indica si la petición ha tenido éxito o no (ej. "<code>200 OK</code>" para indicar éxito, "<code>404 Not Found</code>" si el resurso no ha podido ser encontrado,  "<code>403 Forbidden</code>" si el usuario no está autorizado a acceder al recurso, etc). El cuerpo de la respuesta de éxito a una petición <code>GET</code> contendría el recurso solicitado.</p>
-
-<p>Cuando se devuelve una página HTML es renderizada por el explorador web. Como parte del procesamiento el explorador puede descubrir enlaces a otros recursos (ej. una página HTML normalmente referencia las páginas JavaScript y CSS), y enviará peticiones HTTP separadas para descargar estos ficheros.</p>
-
-<p>Los sitios web tanto estáticos como dinámicos (abordados en las secciones siguientes) usan exactamente los mismos protocolos/patrones de comunicación.</p>
-
-<h3 id="Ejemplo_de_peticiónrespuesta_GET">Ejemplo de petición/respuesta GET</h3>
-
-<p>Puedes realizar una petición <code>GET</code> simplemente pinchando sobre un enlace o buscando en un sitio (como la página inicial de un motor de búsquedas). Por ejemplo, la petición HTTP que se envía cuando realizas una búsqueda en MDN del término "visión general cliente servidor" se parecerá mucho al texto que se muestra más abajo (no será idéntica porque algunas partes del mensaje dependen de tu explorador/configuración).</p>
-
-<div class="note">
-<p>El formato de los mensajes HTTP está definido en el "estándard web" (<a href="http://www.rfc-editor.org/rfc/rfc7230.txt">RFC7230</a>). No necesitas conocer este nivel de detalle, pero al menos ¡ahora sabes de donde viene todo esto!</p>
-</div>
-
-<h4 id="La_petición">La petición</h4>
-
-<p>Cada linea de la petición contiene información sobre ella. La primera parte se llama <strong>cabecera</strong> o <strong>header</strong>, y contiene información útil sobre la petición, de la misma manera que un <a href="/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML">HTML head</a> contiene información útil sobre un documento (pero no el contenido mismo, que está en el cuerpo):</p>
-
-<pre>GET https://developer.mozilla.org/en-US/search?q=client+server+overview&amp;topic=apps&amp;topic=html&amp;topic=css&amp;topic=js&amp;topic=api&amp;topic=webdev HTTP/1.1
-Host: developer.mozilla.org
-Connection: keep-alive
-Pragma: no-cache
-Cache-Control: no-cache
-Upgrade-Insecure-Requests: 1
-User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
-Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
-Referer: https://developer.mozilla.org/en-US/
-Accept-Encoding: gzip, deflate, sdch, br
-<code>Accept-Charset: ISO-8859-1,UTF-8;q=0.7,*;q=0.7</code>
-Accept-Language: en-US,en;q=0.8,es;q=0.6
-Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; csrftoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT; dwf_section_edit=False; dwf_sg_task_completion=False; _gat=1; _ga=GA1.2.1688886003.1471911953; ffo=true
-</pre>
-
-<p>La primera y segunda líneas contienen la mayoría de la información de la que hemos hablado arriba:</p>
-
-<ul>
- <li>El tipo de petición (<code>GET</code>).</li>
- <li>La URL del recurso de destino (<code>/en-US/search</code>).</li>
- <li>Los parámetros URL (<code>q=client%2Bserver%2Boverview&amp;topic=apps&amp;topic=html&amp;topic=css&amp;topic=js&amp;topic=api&amp;topic=webdev</code>).</li>
- <li>El destino/host del sitio web (developer.mozilla.org).</li>
- <li>El final de la primera linea también incluye una cadena corta que identifica la versión del protocolo utilizado (<code>HTTP/1.1</code>).</li>
-</ul>
-
-<p>La última linea contiene información sobre los cookies del lado cliente — puedes ver que en este caso el cookie incluye un id para gestionar las sesiones (<code>Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; ...</code>).</p>
-
-<p>Las líneas restantes contienen información sobre el explorador web usado y la clase de respuestas que puede manejar. Por ejemplo, puedes ver aquí que:</p>
-
-<ul>
- <li>Mi explorador (<code>User-Agent</code>) es Mozilla Firefox (<code>Mozilla/5.0</code>).</li>
- <li>Puede aceptar información comprimida gzip (<code>Accept-Encoding: gzip</code>).</li>
- <li>Puede aceptar el conjunto de caracteres especificado (<code>Accept-Charset: ISO-8859-1,UTF-8;q=0.7,*;q=0.7</code>) y los idiomas (<code>Accept-Language: de,en;q=0.7,en-us;q=0.3</code>).</li>
- <li>La linea <code>Referer</code> indica la dirección de la página web que contenía el enlace a este recurso (es decir, el origen de la petición, <code>https://developer.mozilla.org/en-US/</code>).</li>
-</ul>
-
-<p>Las peticiones HTTP también pueden tener un cuerpo, pero está vacío en este caso.</p>
-
-<h4 id="La_respuesta">La respuesta</h4>
-
-<p>La primera parte de la respuesta a esta petición se muestra abajo. La cabecera o header contiene información como la siguiente:</p>
-
-<ul>
- <li>La primera linea incluye el código de respuesta <code>200 OK</code>, que nos dice que la petición ha tenido éxito.</li>
- <li>Podemos ver que la respuesta está formateada (<code>Content-Type</code>) en modo <code>text/html</code>.</li>
- <li>Podemos ver que usa también el conjunto de caracteres UTF-8 (<code>Content-Type: text/html; charset=utf-8</code>).</li>
- <li>La cabecera también nos dice lo grande que es (<code>Content-Length: 41823</code>).</li>
-</ul>
-
-<p>Al final del mensaje vemos el contenido del <strong>cuerpo</strong> (<strong>body</strong>) — que contiene el HTML real devuelto por la respuesta.</p>
-
-<pre class="brush: html">HTTP/1.1 200 OK
-Server: Apache
-X-Backend-Server: developer1.webapp.scl3.mozilla.com
-Vary: Accept,Cookie, Accept-Encoding
-Content-Type: text/html; charset=utf-8
-Date: Wed, 07 Sep 2016 00:11:31 GMT
-Keep-Alive: timeout=5, max=999
-Connection: Keep-Alive
-X-Frame-Options: DENY
-Allow: GET
-X-Cache-Info: caching
-Content-Length: 41823
-
-
-
-&lt;!DOCTYPE html&gt;
-&lt;html lang="en-US" dir="ltr" class="redesign no-js"  data-ffo-opensanslight=false data-ffo-opensans=false &gt;
-&lt;head prefix="og: http://ogp.me/ns#"&gt;
-  &lt;meta charset="utf-8"&gt;
-  &lt;meta http-equiv="X-UA-Compatible" content="IE=Edge"&gt;
-  &lt;script&gt;(function(d) { d.className = d.className.replace(/\bno-js/, ''); })(document.documentElement);&lt;/script&gt;
-  ...
-</pre>
-
-<p>El resto de la cabecera de la respuesta incluye información sobre la respuesta (ej. cuándo se generó), el servidor, y cómo espera el explorador manejar la página (ej. la linea <code>X-Frame-Options: DENY</code> le dice que al explorador que no está permitido incrustar esta página en un {{htmlelement("iframe")}} en otro sitio).</p>
-
-<h3 id="Ejemplo_de_peticiónrespuesta_POST">Ejemplo de petición/respuesta POST</h3>
-
-<p>Un HTTP <code>POST</code> se realiza cuando se envía un formulario que contiene información para ser guardada en el servidor.</p>
-
-<h4 id="La_petición_2">La petición</h4>
-
-<p>El texto de abajo muestra la petición HTTP realizada cuando un usuario envía al sitio los detalles de un nuevo perfil. El formato de la petición es casi el mismo que en la petición <code>GET</code> del ejemplo mostrado previamente, aunque la primera linea identifica esta petición como <code>POST</code>. </p>
-
-<pre class="brush: html">POST https://developer.mozilla.org/en-US/profiles/hamishwillee/edit HTTP/1.1
-Host: developer.mozilla.org
-Connection: keep-alive
-Content-Length: 432
-Pragma: no-cache
-Cache-Control: no-cache
-Origin: https://developer.mozilla.org
-Upgrade-Insecure-Requests: 1
-User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
-Content-Type: application/x-www-form-urlencoded
-Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
-Referer: https://developer.mozilla.org/en-US/profiles/hamishwillee/edit
-Accept-Encoding: gzip, deflate, br
-Accept-Language: en-US,en;q=0.8,es;q=0.6
-Cookie: sessionid=6ynxs23n521lu21b1t136rhbv7ezngie; _gat=1; csrftoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT; dwf_section_edit=False; dwf_sg_task_completion=False; _ga=GA1.2.1688886003.1471911953; ffo=true
-
-csrfmiddlewaretoken=zIPUJsAZv6pcgCBJSCj1zU6pQZbfMUAT&amp;user-username=hamishwillee&amp;user-fullname=Hamish+Willee&amp;user-title=&amp;user-organization=&amp;user-location=Australia&amp;user-locale=en-US&amp;user-timezone=Australia%2FMelbourne&amp;user-irc_nickname=&amp;user-interests=&amp;user-expertise=&amp;user-twitter_url=&amp;user-stackoverflow_url=&amp;user-linkedin_url=&amp;user-mozillians_url=&amp;user-facebook_url=</pre>
-
-<p>La principal diferencia es que la URL no tiene parámetros. Como puedes ver, la información del formulario se codifica en el cuerpo de la petición (por ejemplo, el nombre completo del nuevo usuario se establece usando: <code>&amp;user-fullname=Hamish+Willee</code>).</p>
-
-<h4 id="La_respuesta_2">La respuesta</h4>
-
-<p>La respuesta a la petición se muestra abajo. El código de estado "<code>302 Found</code>" le dice al explorador que el POST ha tenido éxito, y que debe realizar una segunda petición HTTP para cargar la página especificada en el campo <code>Location</code>. La información es de lo contrario similar a la respuesta a una petición <code>GET</code>.</p>
-
-<pre class="brush: html">HTTP/1.1 302 FOUND
-Server: Apache
-X-Backend-Server: developer3.webapp.scl3.mozilla.com
-Vary: Cookie
-Vary: Accept-Encoding
-Content-Type: text/html; charset=utf-8
-Date: Wed, 07 Sep 2016 00:38:13 GMT
-Location: https://developer.mozilla.org/en-US/profiles/hamishwillee
-Keep-Alive: timeout=5, max=1000
-Connection: Keep-Alive
-X-Frame-Options: DENY
-X-Cache-Info: not cacheable; request wasn't a GET or HEAD
-Content-Length: 0
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Las repuestas y las peticiones HTTP mostradas en estos ejemplos fueron capturadas usando la aplicación <a href="https://www.telerik.com/download/fiddler">Fiddler</a>, pero puedes obtener información similar usando sniffers web (ej. <a href="http://web-sniffer.net/">http://web-sniffer.net/</a>) o usando extensiones del explorador como <a href="https://addons.mozilla.org/en-US/firefox/addon/httpfox/">HttpFox</a>. Puedes probarlo por tí mismo. Usa una de las herramientas enlazadas, y a continuación navega a través de un sitio y edita información del perfil para ver las diferentes peticiones y respuestas. La mayoría de los exploradores modernos también tienen herramientas que monitorizan las peticiciones de red (Por ejemplo, la herramienta <a href="/en-US/docs/Tools/Network_Monitor">Network Monitor</a> en Firefox).</p>
-</div>
-
-<h2 id="Sitios_estáticos">Sitios estáticos</h2>
-
-<p>Un <em>sitio estático</em> es aquél que devuelve desde el servidor el mismo contenido establecido de forma fija en el código cada vez que se solicita una página en particular. De manera que si por ejemplo tienes una página sobre un producto en <code>/static/myproduct1.html</code> , a todos los usuarios se les devolverá la misma página. Si añades otro producto similar a tu sitio necesitarás añadir otra página (ej. <code>myproduct2.html</code>) etc... Esto puede llegar a ser realmente muy poco eficiente — ¿qué sucede cuando alcanzas miles de páginas de productos? Repetirías un montón de código a lo largo de cada página (la plantilla básica de la página, la estructura, etc), y si quisieras cambiar cualquier cosa de la estructura de la página — como añadir una nueva sección de "productos relacionados" por ejemplo — tendrías que cambiar cada página individualmente. </p>
-
-<div class="note">
-<p><strong>Nota</strong>: Los sitios estáticos son excelentes cuando tienes un pequeño número de páginas y quieres enviar el mismo contenido a todos los usuarios. Sin embargo pueden tener un coste de mantenimiento significante a medida que es número de páginas se hace grande.</p>
-</div>
-
-<p>Recapitulemos cómo funciona ésto, mirando otra vez el diagrama de la arquitectura de un sitio estático que vimos en el anterior artículo.</p>
-
-<p><img alt="A simplified diagram of a static web server." src="https://mdn.mozillademos.org/files/13841/Basic%20Static%20App%20Server.png"></p>
-
-<p>Cuando un usuario quiere navegar a una página, el explorador envía una petición HTTP <code>GET</code> especificando la URL de su página HTML. El servidor recupera el documento solicitado de su sistema de ficheros y devuelve una respuesta HTTP conteniendo el documento y un <a href="/en-US/docs/Web/HTTP/Status">código de estado de respuesta HTTP</a> "<code>200 OK</code>" (indicando éxito). El servidor podría devolver un código de estado diferente, por ejemplo "<code>404 Not Found</code>" si el fichero no está presente en el servidor, o "<code>301 Moved Permanently</code>" si el fichero existe pero ha sido redirigido a una localización diferente.</p>
-
-<p>El servidor de un sitio estático sólo tendrá que procesar peticiones GET, ya que el servidor no almacena ningún dato modificable. Tampoco cambia sus respuestas basádonse en los datos de la petición HTTP (ej. parámetros URL o cookies). </p>
-
-<p>Entendiendo cómo funcionan los sitios estáticos es útil sin embargo cuando se aprende programación de lado servidor, porque los sitios dinámicos gestionan las peticiones de ficheros estáticos (CSS, JavaScript, imágenes estáticas, etc.) exactamente de la misma forma.</p>
-
-<h2 id="Sitios_dinámicos">Sitios dinámicos</h2>
-
-<p>Un <em>sitio dinámico</em> es aquél que puede generar y devolver contenido basándose en la URL y los datos específicos de la petición (en vez de devolver siempre para una URL en particular el mismo fichero especificado en el código de forma fija). Usando el ejemplo de un sitio de productos, el servidor almacenaría "datos" del producto en una base de datos en vez de ficheros HTML individuales. Cuando se reciba una petición HTTP <code>GET</code> para un producto, el servidor determina el ID del mismo, extrae los datos de la base y construye la página HTML de la respuesta insertando los datos dentro de la plantilla HTML. Esto tiene una ventaja primordial sobre un sitio estático: </p>
-
-<p>Usar una base de datos permite que la información del producto se almacene de forma eficiente y que se pueda ampliar, modificar y buscar fácilmente.</p>
-
-<p>Usar plantillas HTML hace que sea muy fácil cambiar la estructura HTML, porque sólo se necesita hacer en un sólo lugar, en una única plantilla y no a lo largo de miles de páginas estáticas.</p>
-
-<h3 id="Anatomía_de_una_petición_dinámica">Anatomía de una petición dinámica</h3>
-
-<p>Esta sección proporciona una visión general paso a paso de un ciclo de petición y respuesta HTTP "dinámicas", construyendo con más detalle lo que vimos en el último artículo. Para "hacer cosas reales" usaremos el contexto del sitio web de un manager de equipos deportivos donde un entrenador puede seleccionar el nombre y tamaño de su equipo en un formulario HTML y obtener de vuelta una sugerencia de "mejor alineación" para el próximo partido. </p>
-
-<p>El diagrama de abajo muestra los elementos principales del sitio web del "entrenador del equipo", junto con etiquetas numeradas de la secuencia de operaciones cuando el entrenador accede a su lista de "mejor equipo". Las partes del sitio que lo hacen dinámico son las <em>Aplicaciones Web</em> (que es como llamaremos al código del lado servidor que procesa las peticiones HTTP y devuelve respuestas HTTP), la <em>Base de Datos</em>, que contiene la información sobre los jugadores, equipos, entrenadores y sus relaciones, y las <em>Plantillas HTML</em>.</p>
-
-<p><img alt="This is a diagram of a simple web server with step numbers for each of step of the client-server interaction." src="https://mdn.mozillademos.org/files/13829/Web%20Application%20with%20HTML%20and%20Steps.png" style="height: 584px; width: 1226px;"></p>
-
-<p>Después de que el entrenador envíe el formulario con el nombre del equipo y el número de jugadores, la secuencia de operaciones es la siguiente:</p>
-
-<ol>
- <li>El explorador web crea una petición HTTP <code>GET</code> al servidor usando la URL base del recurso (<code>/best</code>) y codifica el equipo y número de jugadores como parámetros URL (ej. <code>/best?team=my_team_name&amp;show=11)</code> o formando parte de un patrón URL (ej. <code>/best/my_team_name/11/</code>). Se usa una petición <code>GET</code> porque la petición sólo recoge datos (no modifica ninguno).</li>
- <li>El S<em>ervidor Web</em> detecta que la petición es "dinámica" y la reenvía a la <em>Aplicación</em> para que la procese (el servidor web determina como manejar diferentes URLs basándose en reglas de emparejamiento de patrones definidas en su configuración).</li>
- <li>La <em>Aplicación Web</em> identifica que la intención de la petición es obtener la "lista del mejor equipo" basándose en la URL (<code>/best/</code>) y encuentra el nombre del equipo y el número de jugadores requeridos a partir de la URL. La <em>Aplicación Web</em> obtiene entonces la información solicitada de la base de datos (usando parámetros "internos" adicionales que definen qué jugadores son los "mejores", y posiblemente también obteniendo la identidad del entrenador que ha iniciado sesión a partir de un cookie del lado cliente).</li>
- <li>La <em>Aplicación Web</em> crea dinámicamente una página HTML por medio de colocar los datos (de la <em>base</em>) en marcadores de posición dentro de la plantilla HTML.</li>
- <li>La <em>Aplicación Web</em> devuelve el HTML generado al explorador web (via el <em>Servidor Web</em>), junto con un código de estado HTTP de 200 ("éxito"). Si algo impide que se pueda devolver el HTML entonces la <em>Aplicación Web</em> devolverá otro código — por ejemplo "404" para indicar que el equipo no existe.</li>
- <li>El Explorador Web comenzará a continuación a procesar el HTML devuelto, enviando peticiones separadas para obtener cualquier otro fichero CSS o JavaScript que sea referenciado (ver paso 7).</li>
- <li>El Servidor Web carga ficheros estáticos del sistema de ficheros y los devuelve al explorador directamente (de nuevo, la gestión correcta de los ficheros está basada en las reglas de configuración y de emparejamiento de patrones URL).</li>
-</ol>
-
-<p>La operación de actualizar un registro de la base de datos se gestionaría de forma similar, excepto que, como para cualquier actualización de la base de datos, la petición HTTP desde el explorador debería ser codificada como petición <code>POST</code>. </p>
-
-<h3 id="Realización_de_otros_trabajos">Realización de otros trabajos</h3>
-
-<p>La misión de una <em>Aplicación Web</em> es recibir peticiones HTTP y devolver respuestas HTTP. Mientras que interactuar con la base datos para obtener o actualizar información son tareas muy comunes, el código puede hacer otras cosas al mismo tiempo, o no interactuar con una base de datos en absoluto.</p>
-
-<p>Un buen ejemplo de una tarea adicional que una <em> Aplicación Web</em> podría realizar sería el envío de un correo electrónico a los usuarios para confirmar su registro en el sitio. El sito podría también realizar logging u otras operaciones.</p>
-
-<h3 id="Devolución_de_alguna_otra_cosa_distinta_a_HTML">Devolución de alguna otra cosa distinta a HTML</h3>
-
-<p>El código lado servidor de un sitio web no tiene que devolver fragmentos/ficheros HTML en la respuesta. Puede en vez de eso crear dinámicamente y devolver otros tipos de ficheros (texto, PDF, CSV, etc.) o incluso datos (jSON, XML, etc.).</p>
-
-<p>La idea de devolver datos a un explorador web de forma que pueda actualizar su propio contenido dinámicamente ({{glossary("AJAX")}}) ha estado dando vueltas durante bastante tiempo. Más recientemente han llegado a ser muy populares las "apps de una sola página", donde el sitio web entero está escrito con un solo fichero HTML que es actualizado dinámicamente cuando se necesita. Los sitios web creados usando este estilo de aplicación transfieren una gran parte del coste computacional desde el servidor al explorador web, y pueden dar como resultado sitios web que se comportan mucho más como aplicaciones nativas (con una respuesta rápida "highly responsive", etc.).</p>
-
-<h2 id="Los_frameworks_Web_simplifican_la_programación_de_lado_servidor">Los frameworks Web simplifican la programación de lado servidor</h2>
-
-<p>Los frameworks de lado servidor hacen mucho más fácil escribir código para gestionar las operaciones descritas más arriba.</p>
-
-<p>Una de las operaciones más importantes que realizan es proporcionar mecanismos simples para mapear las URLs de diferentes recursos/páginas a funciones para su gestión específicas. Esto hace más fácil mantener separado el código asociado con cada recurso. Esto tiene también beneficios en términos de mantenimiento, ya que puedes cambiar la URL usada para entregar una característica particular en un sitio, sin tener que cambiar la función de gestión.</p>
-
-<p>Por ejemplo, considera el siguiente código Django (Python) que mapea dos patrones URL a dos funciones de visualización. El primer patrón asegura que una petición HTTP con una URL de  <code>/best</code> sea pasada a la función llamada <code>index()</code> en el módulo <code>views</code>. En cambio, una petición que tiene el patrón "<code>/best/junior</code>", se pasará a la función de visualización <code>junior()</code>.</p>
-
-<pre class="brush: python"># file: best/urls.py
-#
-
-from django.conf.urls import url
-
-from . import views
-
-urlpatterns = [
-    # example: /best/
-    url(r'^$', views.index),
-    # example: /best/junior/
-    url(r'^junior/$', views.junior),
-]</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: El primer parámetro en las funciones <code>url()</code> puede parecer un poco extraño (ej. <code>r'^junior/$'</code>) porque usan una técnica de emparejamiento de patrones llamada "expresiones regulares" ("regular expressions", RegEx, o RE). No necesitas saber cómo funcionan las expresiones regulares en este momento, tan sólo que nos permiten emparejar patrones en el URL (en vez de los valores insertados en el código de forma fija que veíamos más arriba) y los usan como parámetros en nuestras funciones de visualización. Como ejemplo, una RegEx simple podría decir "empareja una simple letra mayúscula, seguida de entre 4 y 7 letras minúsculas."</p>
-</div>
-
-<p>El framework web también hace fácil a una función de visualización extraer información de la base de datos. La estructura de nuestros datos está definida en modelos, que son las clases Python que definen los campos que serán almacenados en la base de datos subyacente. Si tenemos un modelo llamado <em>Team</em> con un campo de "<em>team_type</em>" podemos usar un query de sintaxis simple para recuperar todos los equipos que son de un tipo particular.</p>
-
-<p>Los ejemplos de abajo recuperan una lista de todos los equipos que tienen el <code>team_type</code> de "junior" exacto (teniendo en cuenta la capitalización, mayúsculas o minúsculas) — nota de formato: el nombre del campo (<code>team_type</code>) seguido de un guión bajo doble, y a continuación el tipo de emparejamiento a usar (en este caso <code>exact</code>). Hay muchos otros tipos de emparejamiento y podemos encadenarlos fácilmente. Podemos controlar el orden y número de resultados que se devuelven. </p>
-
-<pre class="brush: python">#best/views.py
-
-from django.shortcuts import render
-
-from .models import Team
-
-
-def junior(request):
-    list_teams = Team.objects.filter(team_type__exact="junior")
-    context = {'list': list_teams}
-    return render(request, 'best/index.html', context)
-</pre>
-
-<p>Después de que la función <code>junior()</code> obtenga la lista de equipos junior, llama a la función <code>render()</code>, pasándole el <code>HttpRequest</code> original,  una plantilla HTML, y un objeto "contexto" que define la información a ser incluida en la plantilla. La función <code>render()</code> es una función de conveniencia que genera HTML usando un contexto y una plantilla HTML, y devuelve un objeto <code>HttpResponse</code>.</p>
-
-<p>Obviamente los frameworks web pueden ayudarte con un monton de otras tareas. Debatiremos sobre un montón más de beneficios y opciones de frameworks web en el próximo artículo.</p>
-
-<h2 id="Sumario">Sumario</h2>
-
-<p>En este punto deberías tener una buena visión general de las operaciones que el código de lado servidor tiene que realizar, y conocer algunas de las formas en que un framework web de lado servidor las puede hacer más fáciles.</p>
-
-<p>En el módulo siguiente te ayudaremos a elegir el mejor Framework Web para tu primer sitio.</p>
-
-<p>{{PreviousMenuNext("Learn/Server-side/First_steps/Introduction", "Learn/Server-side/First_steps/Web_frameworks", "Learn/Server-side/First_steps")}}</p>
-
-<p> </p>
-
-<h2 id="En_este_módulo">En este módulo</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Server-side/First_steps/Introduction">Introducción al lado servidor</a></li>
- <li><a href="/en-US/docs/Learn/Server-side/First_steps/Client-Server_overview">Visión general Cliente-Servidor</a></li>
- <li><a href="/en-US/docs/Learn/Server-side/First_steps/Web_frameworks">Frameworks Web de lado servidor</a></li>
- <li><a href="/en-US/docs/Learn/Server-side/First_steps/Website_security">Seguridad Web</a></li>
-</ul>
-
-<p> </p>
diff --git a/files/es/learn/server-side/primeros_pasos/web_frameworks/index.html b/files/es/learn/server-side/primeros_pasos/web_frameworks/index.html
deleted file mode 100644
index 8c381a772e..0000000000
--- a/files/es/learn/server-side/primeros_pasos/web_frameworks/index.html
+++ /dev/null
@@ -1,306 +0,0 @@
----
-title: Frameworks Web de lado servidor
-slug: Learn/Server-side/Primeros_pasos/Web_frameworks
-tags:
-  - Aprendizaje
-  - Codificación de scripts
-  - Frameworks web
-  - Guía
-  - Principiante
-  - Programación lado servidor
-  - Servidor
-  - introducción
-translation_of: Learn/Server-side/First_steps/Web_frameworks
----
-<div>{{LearnSidebar}}</div>
-
-<div>{{PreviousMenuNext("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps/Website_security", "Learn/Server-side/First_steps")}}</div>
-
-<p class="summary">El artículo anterior te mostró que pinta tiene la comunicación entre los clientes web y los servidores, la naturaleza de las peticiones y respuestas HTTP, y lo que necesita hacer una aplicación web de lado servidor para responder a las peticiones de un explorador web. Con este conocimiento en nuestra mochila, es hora de explorar cómo los frameworks web pueden simplificar estas tareas, y darte una idea de cómo escogerías un framework para tu primera aplicación web de lado servidor.</p>
-
-<table class="learn-box standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Prerequisitos:</th>
-   <td>
-    <p>Conocimientos de computación básicos. Comprensión de alto nivel de cómo gestiona y responde a las peticiones HTTP el código de lado servidor (ver <a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a>).</p>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Objetivo:</th>
-   <td>
-    <p>Entender cómo los frameworks web pueden simplificar el desarrollo/mantenimiento de código de lado servidor y conseguir que los lectores piensen sobre la elección del framework para su propio desarrollo.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>Las siguientes secciones ilustran algunos puntos usando fragmentos de código tomados de frameworks web reales. No te preocupes si no todo tiene sentido ahora; te pondremos a trabajar sobre el código en nuestros módulos de framework específicos.</p>
-
-<h2 id="Visión_general">Visión general</h2>
-
-<p>Los frameworks de lado servidor (es decir, "los frameworks de aplicaciones web") son frameworks software que hacen más fácil escribir, mantener y escalar aplicaciones web. Proporcionan herramientas y bibliotecas que simplifican tareas comunes de desarrollo web, incluyendo enrutado de URLs a los manejadores apropiados, interactuación con bases de datos, soporte de sesiones y autorizaciones de usuario, formateado de la salida (ej, HTML, JSON, XML), y mejora de la seguridad contra los ataques web.</p>
-
-<p>La sección siguiente proporciona un poco más detalle sobre cómo los frameworks web pueden facilitar el desarrollo de aplicaciones web. Explicaremos a continuación algunos de los criterios que puedes usar para elegir un framework web, y luego hacer una lista de algunas de tus opciones.</p>
-
-<h2 id="¿Qué_puede_hacer_por_tí_un_framework_web">¿Qué puede hacer por tí un framework web?</h2>
-
-<p>Los frameworks web proporcionan herramientas y bibliotecas para simplificar operaciones comunes de desarrollo web. No <em>tienes</em> que usar un framework web de lado servidor, pero se recomienda encarecidamente — te hará la vida mucho más fácil.</p>
-
-<p>Esta sección debate algo de la funcionalidad que proporcionan con frecuencia los frameworks web (!no todo framework proporcionará necesariamente todas estas caracteríticas!)</p>
-
-<h3 id="Trabajar_directamente_con_peticiones_y_respuestas_HTTP">Trabajar directamente con peticiones y respuestas HTTP</h3>
-
-<p>Como vimos en el último artículo, los servidores web y los exploradores se comunican vía el protocolo HTTP — los servidores esperan las peticiones HTTP del explorador y devuelven información en respuestas HTTP. Los frameworks web te permiten escribir sintaxis simplificada que generará el código de lado servidor para trabajar con estas peticiones y respuestas. Esto significa que tendrás un trabajo más fácil, interacción más fácil, código de más alto nivel en vez de primitivas de red de bajo nivel.</p>
-
-<p>El ejemplo de más abajo muestra cómo funciona ésto en el framework web Django (Python). Cada función de visualización "view" (un manejador de peticiones) recibe un objeto <code>HttpRequest</code> que contiene información de petición, y se le pide devolver un objeto <code>HttpResponse</code> con la salida formateada (en este caso una cadena de texto).</p>
-
-<pre class="brush: python"># Django view function
-from django.http import HttpResponse
-
-def index(request):
-    # Get an HttpRequest (request)
-    # perform operations using information from the request.
-    # Return HttpResponse
-    return HttpResponse('Output string to return')
-</pre>
-
-<h3 id="Enrutado_de_peticiones_al_manejador_adecuado">Enrutado de peticiones al manejador adecuado</h3>
-
-<p>La mayoría de sitios proporcionan un gran número de recursos diferentes, accesibles a través de distintas URLs. La gestión de todo esto en una sola función sería difiicil de mantener, de manera que los frameworks web proporcionan mecanismos simples para mapear patrones URL a funciones de gestión específicas. Esta aproximación tiene también beneficios en términos de mantenimiento, porque puedes cambiar el URL que se usa para entregar una característica en particular sin tener que cambiar el código subyacente.</p>
-
-<p>Diferentes frameworks usan diferentes mencanismos para el mapeo. Por ejemplo, el framework web Flask (Python) añade rutas a las funciones de visualización usando un "decorador".</p>
-
-<pre class="brush: python">@app.route("/")
-def hello():
-    return "Hello World!"</pre>
-
-<p>Por el contrario Django espera que los desarrolladores definan una lista de mapeos URL entre un patrón URL y una función de visualización.</p>
-
-<pre class="brush: python">urlpatterns = [
-    url(r'^$', views.index),
-    # example: /best/myteamname/5/
-    url(r'^(?P&lt;team_name&gt;\w.+?)/(?P&lt;team_number&gt;[0-9]+)/$', views.best),
-]
-</pre>
-
-<h3 id="Fácil_acceso_a_los_datos_en_la_petición">Fácil acceso a los datos en la petición</h3>
-
-<p>Los datos pueden codificarse en una petición HTTP de muchas maneras. Una petición <code>GET</code> para recuperar ficheros o datos de un servidor puede codificar los datos que se necesitan en parámetros URL o dentro de una estructura URL. Una petición <code>POST</code> para actualizar un recurso en el servidor puede en cambio incluir la información de actualización como "datos POST" dentro del cuerpo de la petición. La petición HTTP puede también incluir información sobre la sesión o usuario actual en un cookie de lado cliente.</p>
-
-<p>Los frameworks web proporcionan mecanismos apropiados del lenguaje de programación para acceder a esta información. Por ejemplo, el objeto <code>HttpRequest</code>  que pasa Django a toda función de visualización contiene métodos y propiedades para acceder a la URL de destino, el tipo de petición (ej. HTTP <code>GET</code>), parámetros <code>GET</code>  o <code>POST</code>, cookie y datos de session, etc. Django puede también pasar información codificada en la estructura de la URL definiendo "patrones de captura" en el mapeador URL (mira el último fragmento de código de la sección de arriba).</p>
-
-<h3 id="Abstraer_y_simplificar_el_acceso_a_bases_de_datos">Abstraer y simplificar el acceso a bases de datos</h3>
-
-<p>Los sitios web utilizan bases de datos para almacenar información tanto para ser compartida con los usuarios como sobre los propios usuarios. Los frameworks web proporcionan frecuentemente una capa de base de datos que abstrae las operaciones de lectura, escritura, consulta y borrado de la base. Nos referimos a esta capa de abstracción como Mapeador de Objetos Relacionados (Object-Relational Mapper, ORM).</p>
-
-<p>Usar un ORM tiene dos beneficios:</p>
-
-<ul>
- <li>Puedes reemplazar la base de datos subyacente sin tener necesariamente que cambiar el código que la usa: Esto permite a los desarrolladores optimizar las características de las diferentes bases de datos en función de su uso.</li>
- <li>la validación básica de datos puede implementarse dentro del framework. Esto hace más fácil y seguro comprobar que los datos se almacenan en el campo correcto de la base, que tienen el formato adecuado (ej. una dirección de correo electrónico), y que no son maliciosos de ninguna manera (los craqueadores utilizan ciertos patrones de código para hacer cosas malas como borrar registros de las bases de datos).</li>
-</ul>
-
-<p>Por ejemplo, el framework web de Django proporciona un ORM, y utiliza la referencia del objeto usado para definir la estructura de un registro similar al <em>modelo</em>. El modelo especifica los <em>tipos</em> de campos que se almacenarán, lo que puede proporcionar una validación a nivel de campo sobre qué información se puede guardar (ej. un campo de email sólo permitiría direcciones válidas de correo electrónico). Las definiciones de campos pueden también especificar su tamaño máximo, etiquetas de texto para los formularios, etc. El modelo no establece ninguna información sobre la base de datos subyacente ya que ese es un ajuste de configuración que se puede cambiar de forma separada de nuestro código.</p>
-
-<p>El primer fragmento de código más abajo muestra un modelo de Django muy simple para un objeto <code>Team</code>. Éste almacena el nombre y nivel del equipo como campos de caracteres y especifica el número máximo de éstos que pueden almacenarse en cada registro. El <code>team_level</code> es un campo de selección, de manera que proporcionamos un mapeo entre las opciones a mostrar en pantalla y los datos a almacenar, junto con un valor por defecto.</p>
-
-<pre class="brush: python">#best/models.py
-
-from django.db import models
-
-class Team(models.Model):
-    team_name = models.CharField(max_length=40)
-
-    TEAM_LEVELS = (
-        ('U09', 'Under 09s'),
-        ('U10', 'Under 10s'),
-        ('U11, 'Under 11s'),
-        ...  #list our other teams
-    )
-    team_level = models.CharField(max_length=3,choices=TEAM_LEVELS,default='U11')
-</pre>
-
-<p>El modelo de Django proporciona una API de consulta simple para buscar en la base de datos. Ésta puede comprobar coincidencias contra un gran número de campos al mismo tiempo usando diferentes criterios (ej. exacto, insensible a las mayúsculas, mayor que, etc.), y puede soportar sentencias complejas (por ejemplo, puedes especificar una búsqueda de equipos U11 que tengan un nombre de equipo que empiece por "Fr" or finalice con "al").</p>
-
-<p>El segundo fragmento de código muestra una función de visualización (manejador de recurso) para mostrar en pantalla todos nuestros equipos U09. En este caso especificamos que queremos filtrar todos los registros donde el campo <code>team_level</code> tenga exactamente el texto 'U09' (fíjate debajo cómo este criterio se pasa como argumento a la función <code>filter()</code> con el nombre de campo y tipo de coincidencia separados por guiones bajos dobles: <strong>team_level__exact</strong>).</p>
-
-<pre class="brush: python">#best/views.py
-
-from django.shortcuts import render
-from .models import Team
-
-def youngest(request):
-    <strong>list_teams = Team.objects.filter(team_level__exact="U09")</strong>
-    context = {'youngest_teams': list_teams}
-    return render(request, 'best/index.html', context)
-</pre>
-
-<dl>
-</dl>
-
-<h3 id="Renderización_de_datos">Renderización de datos</h3>
-
-<p>Los frameworks web proporcionan con frecuencia sistemas de plantillas. Éstas te permiten especificar la estructura de un documento de salida, usando marcadores de posición para los datos que serán añadidos cuando se genere la página. Las plantillas se usan con frecuencia para crear HTML, pero también pueden crear otros tipos de documentos.</p>
-
-<p>Los frameworks web proporcionan con frecuencia un mecanismo para facilitar la generación de otros formatos a partir de los datos almacenados, incluyendo {{glossary("JSON")}} y {{glossary("XML")}}.</p>
-
-<p>Por ejemplo, el sistema de plantillas de Django te permite especificar variables usando una sintaxis de "llaves dobles" (ej. <code>{</code><code>{ <em>variable_name</em> </code><code>}</code><code>}</code>),  que serán reemplazadas por valores pasados desde la función de visualización cuando la página sea renderizada. El sistema de plantillas también proporciona soporte para expresiones (con la sintaxis: <code>{% <em>expression</em> %}</code>), que permite a las plantillas realizar operaciones simples como iterar sobre la lista de valores pasados a la misma.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Muchos otros sistemas de plantillas usan una sintaxis similar, ej.: Jinja2 (Python), Handlebars (JavaScript), Moustache (JavaScript), etc.</p>
-</div>
-
-<p>El fragmento de código de abajo muestra como hacer este trabajo. Continuando el ejemplo del "equipo más joven" de la sección anterior, la "view" pasa a la plantilla HTML una variable tipo lista llamada <code>youngest_teams</code>. Dentro del esqueleto HTML tenemos una expresión que primero comprueba que la variable <code>youngest_teams</code> existe, y luego itera sobre ella en un bucle <code>for</code>. En cada iteración la plantilla presenta en pantalla el valor del <code>team_name</code>  del equipo de uno de los elementos de la lista.</p>
-
-<pre class="brush: html">#best/templates/best/index.html
-
-&lt;!DOCTYPE html&gt;
-&lt;html lang="en"&gt;
-&lt;body&gt;
-
- {% if youngest_teams %}
-    &lt;ul&gt;
-    {% for team in youngest_teams %}
-        &lt;li&gt;\{\{ team.team_name \}\}&lt;/li&gt;
-    {% endfor %}
-    &lt;/ul&gt;
-{% else %}
-    &lt;p&gt;No teams are available.&lt;/p&gt;
-{% endif %}
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h2 id="Como_escoger_un_framework_web">Como escoger un framework web</h2>
-
-<p>Existen muchos frameworks web para casi todos los lenguajes de programación que quieras usar (listamos unos pocos de los frameworks más populares en la sección siguiente). Con tantas opciones, llega a ser difícil deducir qué framework proporciona el mejor punto de partida para tu nueva aplicación web. </p>
-
-<p>Algunos de los factores que pueden afectar tu decisión son:</p>
-
-<ul>
- <li><strong>Esfuerzo en el aprendizaje:</strong> El esfuerzo en el aprendizaje de un framework web depende de lo familiarizado que estés con el lenguaje de programación subyacente, la consistencia de su API, la calidad de su documentación, y el tamaño y actividad de su comunidad. Si estás partiendo de una nula experiencia en programación, considera entonces Django (es uno de los más fáciles de aprender basándose en los criterios anteriores). Si formas parte de un equipo de desarrolladores que tienen ya una experiencia significante con un framework web o lenguaje de programación en particular tiene sentido entonces que sigas fiel a él.</li>
- <li><strong>Productividad:</strong> Productividad es una medida de cuán rápido puedes crear nuevas características una vez que te familiarices con el framework, incluidos tanto el esfuerzo para escribir como para mantener el código (ya que puedes escribir nuevas características mientras se rompen las antiguas). Muchos de los factores que afectan a la productividad son similares a los de el "Esfuerzo para aprender" — ej. documentación, comunidad, experiencia en programación, etc. — otros factores incluyen:
-  <ul>
-   <li><em>Propósito/Origen del framework</em>: Algunos frameworks web fueron creados inicialmente para resolver ciertos tipos de problemas, y se mantienen <em>mejor</em> en la creación de apllicaciones web con problemática similar. Por ejemplo, Django fue creado para soportar el desarrollo de un sitio web de un periódico, por lo que es bueno para blogs y otros sitios que impliquen la publicación de cosas. Por contra, Flask es un framework de peso mucho más ligero y es fantástico en la creación de aplicaciones web que se ejecuten en dispositivos embebidos.</li>
-   <li><em>Dogmático versus No Dogmático</em>:  Un framework dogmático es aquél en el que hay recomendaciones sobre el "mejor" método de resolver un problema en particular. Los frameworks dogmáticos tienden a ser más productivos cuando estás tratando de resolver problemas comunes, porque te llevan en la dirección correcta, sin embargo son menos flexibles a veces.</li>
-   <li><em>Con baterías incluidas versus Hazlo tu mismo</em>: Aalgunos frameworks web incluyen herramientas/bibliotecas que abordan por defecto todos los problemas que sus desarrolladores pueden pensar, mientras que los frameworks más ligeros esperan que los desarrolladores web escojan y elijan las soluciones a sus problemas en bibliotecas separadas (Django es un ejemplo del primero, mientras que Flask es un ejemplo de un framework mucho más ligero). Los frameworks que incluyen todo son con frecuencia más fáciles para empezar con ellos porque ya tienes todo lo que necesitas, y las probabilidades son altas de que esté bien integrado y bien documentado. Sin embargo si un framework más pequeño tiene todo lo que puedas necesitar funcionará en entornos mas constreñidos y tendrán un subconjunto de cosas más pequeñas y más fáciles de aprender.</li>
-   <li><em>Si el framework potencia o no buenas prácticas de desarrollo</em>: Por ejemplo, un framework que promueve una arquitectura <a href="/en-US/docs/Web/Apps/Fundamentals/Modern_web_app_architecture/MVC_architecture">Modelo-View-Controlador</a> para separar el código en funciones lógicas resultará más mantenible que uno que no tiene espectativas en los desarrolladores. Similarmente, el diseño del framework puede tener un gran impacto en cómo de fácil sea probar y reusar el código.</li>
-  </ul>
- </li>
- <li><strong>Desempeño del framework/lenguaje de programación: </strong>Normalmente la "velocidad" no es el factor más grande en la selección porque, incluso, con tiempos de ejecución relativamente lentos como Python, son más que suficientemente buenos para sitios de tamaño medio ejecutándose en hardware moderado. Los beneficios percibidos en velocidad de otro lenguaje, ej. C++ o JavaScript, pueden verse compensados por los costes de aprendizaje y mantenimiento.</li>
- <li><strong>Soporte de Cache:</strong> A medida que tu sitio web adquiere más éxito puedes encontrarte que no sea capaz de soportar el número de peticiones que recibe cuando acceden los usuarios. En este punto puedes considerar añadir soporte de cache. La cache es una optimización en la que almacenas todo o parte de una petición web de manera que no tiene que ser recalculada en subsiguientes peticiones. Devolver una respuesta cacheada es más rápido que calcular una la primera vez. El cacheo puede implementarse en tu código o en el servidor (ver <a href="https://en.wikipedia.org/wiki/Reverse_proxy">proxy inverso</a>). Los frameworks web tienen diferentes niveles de soporte para definir qué contenido debe ser cacheado.</li>
- <li><strong>Escalabilidad:</strong> Una vez que tu sitio tenga un éxito fabuloso agotarás los beneficios del cacheo e incluso alcanzarás los límites del <em>escalado vertical </em>(ejecutar tu aplicación en un hardware más potente). En este punto podrás necesitar <em>escalar horizontalmente</em> (compartir la carga distribuyendo tu sitio a lo largo de un número de servidores web o bases de datos) o escalar "geográficamente" porque algunos de tus clientes están localizados muy lejos de tu servidor. El framework web que elijas puede marcar una gran diferencia en cómo de fácil sea escalar tu sitio.</li>
- <li><strong>Seguridad web:</strong> Algunos frameworks web proporcionan mejor soporte para manejar ataques web comunes. Django por ejemplo desinfecta todas las entradas de los usuarios de las plantillas HTML de manera que el posible código JavaScript introducido por el usuario no pueda ejecutarse. Otros frameworks proporcionan protección similar, pero no siempre está habilitada por defecto.</li>
-</ul>
-
-<p>Hay muchos otros posibles factores, incluyendo licenciamiento, si el framework está bajo desarrollo activo o no, etc.</p>
-
-<p>Si eres un completo principiante en la programación probablemente escogerás tu framework basándote en la "facilidad de aprendizaje". Además de la "facilidad de uso" del lenguaje mismo, la alta calidad de la documentación/tutoriales y una comunidad activa que ayuda a nuevos usuarios son tus recursos más valiosos. Nosotros hemos escogido <a href="https://www.djangoproject.com/">Django</a> (Python) y <a href="http://expressjs.com/">Express</a> (Node/JavaScript) para escribir nuestros ejemplos de más adelante en el curso, principalmente porque son fáciles de aprender y tienen un buen soporte.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Vayamos a los sitios principales de <a href="https://www.djangoproject.com/">Django</a> (Python) y <a href="http://expressjs.com/">Express</a> (Node/JavaScript) y comprobemos su documentación y su comunidad.</p>
-
-<ol>
- <li>Navega a los sitios principales (enlazados abajo)
-  <ul>
-   <li>Pincha en los enlaces de los menus de Documentación (cosas que se llaman como "Documentación, Guía, Referencia API, Primeros Pasos".</li>
-   <li>¿Puedes ver temas que te muestran como configurar enrutado URL, plantillas y bases de datos/modelos?</li>
-   <li>¿Son los documentos suficientemente claros?</li>
-  </ul>
- </li>
- <li>Navega a las listas de correo de cada sitio (accesible desde los enlaces de Comunidad).
-  <ul>
-   <li>¿Cuántas preguntas se han realizado en unos pocos días recientes?</li>
-   <li>¿Cuántas tienen respuestas?</li>
-   <li>¿Tienen una comunidad activa?</li>
-  </ul>
- </li>
-</ol>
-</div>
-
-<h2 id="¿Unos_pocos_frameworks_web_buenos">¿Unos pocos frameworks web buenos?</h2>
-
-<p>Avancemos ahora, y debatamos unos pocos frameworks web específicos de lado servidor.</p>
-
-<p>Los frameworks de lado servidor de más abajo representan unos pocos de los más populares disponibles en el momento de escribir este artículo. Todos ellos tienen todo lo que necesitas para ser productivo — son de código abierto, están bajo desarrollo activo, tienen comunidades entusiastas creando documentación y ayudando a los usuarios en paneles de debate, y se usan en un gran número de sitios web de perfil alto. Hay muchos otros frameworks de lado servidor fantásticos que puedes descubrir usando una búsqueda básica en internet. </p>
-
-<div class="note">
-<p><strong>Nota</strong>: ¡Las descripciones vienen (parcialmente) de los sitios web de los frameworks!</p>
-</div>
-
-<h3 id="Django_(Python)">Django (Python)</h3>
-
-<p><a href="https://www.djangoproject.com/">Django</a> es un Framework Web Python de alto nivel que promueve el desarrollo rápido y limpio y el diseño pragmático. Construido por desarrolladores experimentados, tiene en cuenta muchos de los problemas del desarrollo web, de manera que puedes focalizarte en escribir el código de tu app sin necesidad de reinventar la rueda. Es gratis y de código abierto.</p>
-
-<p>Django sigue la filosofía de "Baterias incluidas" y proporciona casi todo lo que la mayoría de desarrolladores querría hacer "de fábrica". Como todo está incluido, todo funciona en conjunto, sigue principios de diseño consistentes y tiene una extensa documentación actualizada. Es también veloz, seguro y muy escalable. Al estar basado en Python, el código de Django es fácil de leer y de mantener.</p>
-
-<p>Entre los sitios populares que usan Django (según su página web) se incluyen: Disqus, Instagram, Knight Foundation, MacArthur Foundation, Mozilla, National Geographic, Open Knowledge Foundation, Pinterest, Open Stack.</p>
-
-<h3 id="Flask_(Python)">Flask (Python)</h3>
-
-<p><a href="http://flask.pocoo.org/">Flask</a> es un microframework para Python. </p>
-
-<p>A pesar de ser minimalista, Flask puede crear sitios web "de fábrica". Contiene un servidor de desarrollo y depurador, e incluye soporte para plantillas <a href="https://github.com/pallets/jinja">Jinja2</a>, cookies seguros, <a href="https://en.wikipedia.org/wiki/Unit_testing">prueba de unidades</a>, y distribución de peticiones <a href="http://www.restapitutorial.com/lessons/restfulresourcenaming.html">RESTful</a>. Tiene  buena documentación y una comunidad activa. </p>
-
-<p>Flask se ha vuelto extremadamente popular, particularmente entre desarrolladores que necesitan proporcionar servicios web en sistemas pequeños, y con recursos escasos (ej. ejecutar un servidor web en una  <a href="https://www.raspberrypi.org/">Raspberry Pi</a>, <a href="http://blogtarkin.com/drone-definitions-learning-the-drone-lingo/">Controladores de Drones</a>, etc.)</p>
-
-<h3 id="Express_(Node.jsJavaScript)">Express (Node.js/JavaScript)</h3>
-
-<p><a href="http://expressjs.com/">Express</a> es un framework web veloz, no dogmático, flexible y minimalista para <a href="https://nodejs.org/en/">Node.js</a> (Node es un entorno sin explorador web para ejecutar JavaScript). Proporciona un conjunto de características robusto para aplicaciones web y móviles y entrega valiosos métodos de utilidades HTTP y <a href="/en-US/docs/Glossary/Middleware">middleware</a>.</p>
-
-<p>Express es extremadamente popular, en parte porque facilita la migración de programadores web de JavaScript de lado cliente a desarrollo de lado servidor, y en parte porque es eficiente con los recursos (el entorno de node subyacente usa multitarea ligera dentro de un thread en vez de expandirse en procesos separados para cada nueva petición web).</p>
-
-<p>Debido a que Express es un framework web minimalista no incorpora cada componente que querrías usar (por ejemplo, el acceso a bases de datos y el soporte de usuarios y sesiones se proporciona a través de bibliotecas independientes). Hay muchos componentes independientes excelentes, !pero algunas veces puede ser difícil deducir cuál es el mejor para un propósito en particular!</p>
-
-<p>Muchos frameworks populares y completamente equipados (incluyendo ambos tipos de frameworks de lado servidor y de lado cliente) están basados en Express, como <a href="http://feathersjs.com/">Feathers</a>, <a href="https://www.itemsapi.com/">ItemsAPI</a>, <a href="http://keystonejs.com/">KeystoneJS</a>, <a href="http://krakenjs.com/">Kraken</a>, <a href="http://lean-stack.io/">LEAN-STACK</a>, <a href="http://loopback.io/">LoopBack</a>, <a href="http://mean.io/">MEAN</a>, and <a href="http://sailsjs.org/">Sails</a>.</p>
-
-<p>Un montón de compañías de perfil alto usan Express, como: Uber, Accenture, IBM, etc. (a<a href="http://expressjs.com/en/resources/companies-using-express.html">quí</a> tienes una lista).</p>
-
-<h3 id="Ruby_on_Rails_(Ruby)">Ruby on Rails (Ruby)</h3>
-
-<p><a href="http://rubyonrails.org/">Rails</a> (normalmente referenciado como "Ruby on Rails") es un framework web escrito para el lenguaje de programación Ruby.</p>
-
-<p>Rails sigue una filosofía de diseño muy similar a Django. Como Django proporciona mecanismos estándard para el enrutado de URLs, acceso a datos de bases, generación de plantillas y formateo de datos como {{glossary("JSON")}} o {{glossary("XML")}}. Promueve de forma similar el uso de patrones de diseño como DRY ("dont repeat yourself", no te repitas — escribir el código una única vez si es posible), MVC (model-view-controller) y numerosos otros.</p>
-
-<p>Hay por supuesto muchas diferencias debido a decisiones específicas de diseño y la naturaleza de los lenguajes.</p>
-
-<p>Rails se usa en sitios de perfil alto, como:<strong> </strong><a href="https://basecamp.com/">Basecamp</a>, <a href="https://github.com/">GitHub</a>, <a href="https://shopify.com/">Shopify</a>, <a href="https://airbnb.com/">Airbnb</a>, <a href="https://twitch.tv/">Twitch</a>, <a href="https://soundcloud.com/">SoundCloud</a>, <a href="https://hulu.com/">Hulu</a>, <a href="https://zendesk.com/">Zendesk</a>, <a href="https://square.com/">Square</a>, <a href="https://highrisehq.com/">Highrise</a>.</p>
-
-<h3 id="ASP.NET">ASP.NET</h3>
-
-<p><a href="http://www.asp.net/">ASP.NET</a> es un framework web de código abierto desarrollado por Microsoft para construir aplicaciones y servicios modernos. Con ASP.NET puedes crear rápidamente sitios web basados en HTML, CSS, y JavaScript, escalarlos para ser usados por milllones de usuarios y añadir fácilmente capacidades complejas como APIs web, formularios sobre datos o comunicaciones en tiempo real.</p>
-
-<p>Uno de los diferenciadores de ASP.NET es que está construido sobre el <a href="https://en.wikipedia.org/wiki/Common_Language_Runtime">Common Language Runtime</a> (CLR), permitiendo a los programadores escribir código ASP.NET usando cualquier lenguaje .NET soportado (C#, Visual Basic, etc.). Como muchos productos Microsoft se beneficia de herramientas excelentes (frecuentemente gratuitas), y una comunidad de desarrolladores activa, y documentación bien escrita.</p>
-
-<p>ASP.NET se usa por Microsoft, Xbox.com, Stack Overflow, y muchos otros.</p>
-
-<h3 id="Mojolicious_(Perl)">Mojolicious (Perl)</h3>
-
-<p><a href="http://mojolicious.org/">Mojolicious</a> es un framework web de nueva generación para el lenguaje de programación Perl.</p>
-
-<p>Hace tiempo en los primeros días de la Web, mucha gente aprendió Perl gracias a una magnífica biblioteca llamada <a href="https://metacpan.org/module/CGI">CGI</a>. Era lo suficientemente simple para empezar sin saber mucho sobre el lenguaje y lo suficientemente potente para mantenerte en marcha. Mojolicious implementa esta idea usando el último grito de las tecnologías.</p>
-
-<p>Algunas de las caracteríticas que proporciona Mojolicious son: <strong>Framework Web en tiempo real</strong>, para crecer fácilmente desde prototipos de un solo fichero hasta aplicaciones web MVC bien estructuradas; rutas RESTful, plugins, comandos, plantillas especificas de Perl, negociación de contenidos, gestión de sesiones, validación de formatos, framework de pruebas, servidor de ficheros estáticos, detección de CGI/<a href="http://plackperl.org">PSGI</a>, soporte Unicode de primera clase; Implementación  cliente/servidor completamente equipada de HTTP y WebSocket con IPv6, TLS, SNI, IDNA, HTTP/SOCKS5 proxy, UNIX domain socket, Comet (long polling), keep-alive, connection pooling, timeout, cookie, y soporte de compresión multipart y gzip; parseadores JSON y HTML/XML y generadores con soporte de selector CSS; Muy limpio, portable y API orientada a objetos y Perl puro sin magia oculta; Código fresco basado en años de experiencia, gratis y de código abierto.</p>
-
-<h2 id="Sumario">Sumario</h2>
-
-<p>Este artículo ha mostrado que los frameworks web pueden hacer fácil el desarrollo y mantenimiento del código de lado servidor. También ha proporcionado una visión general de alto nivel de unos pocos frameworks más populares y debatido los criterios para elegir el framework para una aplicación web. Deberías tener en este momento una idea de cómo elegir un framework web para tu propio desarrollo de lado servidor. Si no, no te preocupes — más tarde a lo largo del curso te daremos tutoriales detallados de Django y Express para darte algo de experiencia de funcionamiento real con un framework web.</p>
-
-<p>Para el próximo artículo de este módulo cambiaremos de dirección ligeramente y consideraremos la seguridad web.</p>
-
-<p>{{PreviousMenuNext("Learn/Server-side/First_steps/Client-Server_overview", "Learn/Server-side/First_steps/Website_security", "Learn/Server-side/First_steps")}}</p>
-
-<p> </p>
-
-<h2 id="En_este_modulo">En este modulo</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Introducci%C3%B3n">Introducción al lado servidor </a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">Visión general Cliente-Servidor</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/Web_frameworks">Frameworks web de lado servidor</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos/seguridad_sitios_web">Seguridad de sitios Web</a></li>
-</ul>
-
-<p> </p>
diff --git a/files/es/learn/tools_and_testing/client-side_javascript_frameworks/index.html b/files/es/learn/tools_and_testing/client-side_javascript_frameworks/index.html
new file mode 100644
index 0000000000..81a3a24914
--- /dev/null
+++ b/files/es/learn/tools_and_testing/client-side_javascript_frameworks/index.html
@@ -0,0 +1,134 @@
+---
+title: Entendiendo los frameworks de JavaScript del lado del cliente
+slug: Learn/Tools_and_testing/Client-side_JavaScript_frameworks
+tags:
+  - Aprender
+  - Principiante
+translation_of: Learn/Tools_and_testing/Client-side_JavaScript_frameworks
+original_slug: Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks
+---
+<div>{{LearnSidebar}}</div>
+
+<p class="summary">Los frameworks de JavaScript son una parte esencial del desarrollo web front-end moderno, los cuales proveen a los desarrolladores herramientas probadas y testeadas para la creación de aplicaciones web interactivas y escalables. Muchas empresas modernas utilizan frameworks como parte estándar de sus herramientas, por lo que muchos trabajos de desarrollo front-end en la actualidad requieren experiencia en frameworks.</p>
+
+<p class="summary">Como aspirante a desarrollador front-end, puede resultar difícil saber por dónde empezar cuando se trata de aprender sobre frameworks; hay muchos frameworks diferentes para elegir, nuevas opciones surgen todo el tiempo. En su mayoría funcionan de forma similar, pero hacen algunas cosas de manera diferente, y hay algunas cosas específicas con las que se debe tener cuidado a la hora de usar frameworks.</p>
+
+<p class="summary">En esta serie de artículos, tenemos como objetivo brindarte un punto de partida cómodo que te sirva de ayuda para comenzar a aprender sobre frameworks. Nuestra intención no es enseñarte, de manera exhaustiva, todo lo que se necesita saber sobre React/ReactDOM, o Vue, o algún otro framework en específico; la documetación de los equipos de los frameworks (entre otros recursos) ya cumplen esta función. En su lugar, queremos brindarte respaldo y responder primero a preguntas más fundamentales como:</p>
+
+<ul>
+ <li class="summary">¿Por qué debería hacer uso de un framework? ¿Qué problemas me resuelven estos?</li>
+ <li class="summary">¿Qué preguntar a la hora de escoger un framework? ¿En verdad necesito usar un framework?</li>
+ <li class="summary">¿Qué características tienen los frameworks? ¿Cómo funcionan en general y cómo se diferencian las maneras en que los frameworks implementan estas características?</li>
+ <li class="summary">¿Cómo se relacionan con JavaScript "puro" o HTML?</li>
+</ul>
+
+<p class="summary">Después de esto, proveeremos algunos tutoriales que cubren los aspectos básicos de algunos de los diferentes frameworks que existen, de manera que puedas tener el contexto y la familiaridad suficientes para poder empezar a profundizar por tu propia cuenta. Queremos que avances y aprendas sobre los frameworks de manera pragmática, de forma tal que se tengan presente las buenas prácticas esenciales de la plataforma web, como lo es la accesibilidad.</p>
+
+<p class="summary"><strong><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Empieza ahora con "Introducción a los frameworks del lado del cliente"</a></strong></p>
+
+<h2 id="Prerrequisitos">Prerrequisitos</h2>
+
+<p>Antes de intentar aprender sobre los frameworks del lado del cliente, es recomendable que conozcamos los conceptos básicos de los principales lenguajes de la web: <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, y —especialmente— <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>.</p>
+
+<p>Como resultado, tu código será más consistente y profesional, por lo que podrás solucionar problemas con mayor confianza si comprende las características fundamentales de la plataforma web sobre las que se basan los frameworks.</p>
+
+<h2 id="Guías_introductorias">Guías introductorias</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">1. Introducción a los frameworks del lado del cliente</a></dt>
+ <dd>Comenzamos nuestro estudio sobre los frameworks con una descripción general del área, repasando un poco de historia sobre JavaScript y los frameworks, por qué estos existen, y qué nos brindan; por donde empezar al momento de escoger un framework por aprender y qué alternativas existen a los frameworks del lado del cliente.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">2. Características principales de los frameworks</a></dt>
+ <dd>Cada framework destacado de JavaScript tiene un enfoque diferente para actualizar el DOM, manejar los eventos del navegador, y brindarte una experiencia de desarrollo satisfactoria. En este artículo, exploraremos las características principales de "los cuatro grandes" frameworks, observando cómo estos tienden a operar desde un nivel alto, al igual que las diferencias entre ellos.</dd>
+</dl>
+
+<h2 id="Tutoriales_de_React">Tutoriales de React</h2>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Los tutoriales de React se probaron por última vez en mayo de 2020, con React/ReactDOM 16.13.1 y create-react-app 3.4.1.</p>
+
+<p>Si necesitas comparar tu código con nuestra versión, puedes encontrar una versión terminada de la muestra del código de la aplicación React en nuestro <a href="https://github.com/mdn/todo-react">repositorio todo-react</a>. Para una versión en vivo, consulta <a href="https://mdn.github.io/todo-react-build/">https://mdn.github.io/todo-react-build/</a>.</p>
+</div>
+
+<dl>
+ <dt><a href="/es/docs/Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started">1. Primeros pasos en React</a></dt>
+ <dd>En este artículo conoceremos React. Descubriremos algunos detalles sobre su trasfondo y casos de uso, configuraremos una cadena básica de herramientas para React en nuestra computadora local, crearemos y jugaremos con una aplicación inicial sencilla, mientras aprendemos —durante el proceso— un poco acerca de cómo funciona React.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">2. Comenzando con nuestra lista de tareas de React</a></dt>
+ <dd>Digamos que se nos ha encomendado la tarea de crear una prueba de concepto (Proof of Concept — PoC) en React: una aplicación que permita a los usuarios agregar, editar y eliminar tareas en las que se quiera trabajar, pero que también permita marcar las tareas como completadas sin eliminarlas. Este artículo te guiará en la organización de la estructura y los estilos básicos del componente <code>App</code>, de manera que esté listo para la definición e interactividad de componentes individuales, los cuales agregaremos más adelante.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">3. Basando nuestra aplicación React en componentes</a></dt>
+ <dd>Hasta este momento, nuestra aplicación no hace gran cosa. Antes de que podamos hacerla funcionar, tenemos que dividirla en componentes descriptivos y manejables. React no tiene reglas estrictas para lo que, se considera o no, un componente, ¡eso depende de ti! En este artículo, te mostraremos una forma raznoable de dividir nuestra aplicación en componentes.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">4. Interactividad en React: eventos y estado</a></dt>
+ <dd>Habiendo elaborado nuestro plan de componentes, es hora de comenzar a actualizar nuestra aplicación, para que pase de ser una interfaz de usuario completamente estática a una que nos permita, realmente, interactuar y cambiar las cosas. Es eso mismo lo que haremos en este artículo, profundizando en los eventos y el estado a medida que avancemos.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">5. Interactividad en React: edición, filtrado, renderizado condicional</a></dt>
+ <dd>A medida que nos acercamos al final de nuestro viaje en React (al menos por ahora), agregaremos los toques finales a las áreas principales de funcionalidad en nuestra aplicación de lista de tareas. Esto incluye permitir la edición de tareas existentes y el filtrado de la lista de tareas entre todas las tareas, las completadas, y las incompletas. A lo largo del capítulo, veremos la renderización condicional de la interfaz de usuario.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">6. Accesibilidad en React</a></dt>
+ <dd>En el artículo final de nuestro tutorial, nos enfocaremos en la accesibilidad (broma intencional), incluyendo la gestión del enfoque en React, la cual puede mejorar la usabilidad y reducir la confusión para usuarios que navegan tanto, a través de lectores de pantalla, como solo del teclado.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">7. Recursos sobre React</a></dt>
+ <dd>En nuestro artículo final, te brindamos una lista de recursos sobre React, los cuales podrás utilizar para avanzar más en tu aprendizaje.</dd>
+</dl>
+
+<h2 id="Tutoriales_de_Ember">Tutoriales de Ember</h2>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Los tutoriales de Ember se probaron por última vez en mayo de 2020, con Ember/Ember CLI versión 3.18.0.</p>
+
+<p>Si necesitas comparar tu código con nuestra versión, puedes encontrar una versión terminada de la muestra del código de la aplicación Ember en nuestro <a href="https://github.com/NullVoxPopuli/ember-todomvc-tutorial/tree/master/steps/00-finished-todomvc/todomvc">repositorio ember-todomvc-tutorial</a>. Para una versión en vivo, consulta <a href="https://nullvoxpopuli.github.io/ember-todomvc-tutorial/">https://nullvoxpopuli.github.io/ember-todomvc-tutorial/</a> (esto también incluye algunas características adicionales que no se cubren en este tutorial).</p>
+</div>
+
+<dl>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">1. Primeros pasos en Ember</a></dt>
+ <dd>En nuestro primer artículo de Ember veremos cómo funciona Ember y para qué resulta útil, instalaremos la cadena de herramientas de Ember de manera local, crearemos una aplicación de muestra, y luego realizaremos una configuración inicial para prepararla para el desarrollo.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">2. Estructura de una aplicación Ember y cómo se basa en componentes</a></dt>
+ <dd>En este artículo, continuaremos planificando la estructura de nuestra aplicación Ember TodoMVC, agregando el HTML necesario y luego dividiendo esa estructura HTML en componentes.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">3. Interactividad de Ember: eventos, clases, y estado</a></dt>
+ <dd>En este punto, comenzaremos a agregar un poco de interactividad a nuestra aplicación, dándole la capacidad de agregar y mostrar nuevos elementos de tareas por hacer. A medida que avanzamos, veremos el uso de eventos en Ember, la creación de clases de componentes para contener código JavaScript que controle las funciones interactivas, y la configuración de un servicio para hacer seguimiento del estado de los datos de nuestra aplicación.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">4. Interactividad de Ember: funcionalidad del footer, renderizado condicional</a></dt>
+ <dd>Ahora es momento de comenzar a abordar la funcionalidad del footer en nuestra aplicación. Aquí haremos que el contador de tareas pendientes se actualice de manera que muestre el número correcto de tareas pendientes por completar, y aplicaremos correctamente los estilos a las tareas completadas (es decir, aquellos donde la casilla de verificación ha sido marcada). También conectaremos nuestro botón "Borrar completados". A lo largo del capítulo, aprenderemos sobre el uso de la renderización condicional en nuestras plantillas.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">5. Enrutamiento en Ember</a></dt>
+ <dd>En este artículo aprendemos sobre enrutamiento o el filtrado basado en URL, como a veces se lo denomina. Lo usaremos para proporcionar una URL única para cada una de las tres vistas de tareas: "Todas", "Activas" y "Completadas".</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">6. Recursos sobre y solución de problemas</a></dt>
+ <dd>En nuestro artículo final sobre Ember, te proporcionamos una lista de recursos que puedes utilizar para avanzar más en tu aprendizaje, además de información útil para la solución problemas y otra información.</dd>
+</dl>
+
+<h2 id="Tutoriales_de_Vue">Tutoriales de Vue</h2>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Los tutoriales de Vue se probaron por última vez en mayo de 2020, con Vue 2.6.11.</p>
+
+<p>Si necesitas comparar tu código con nuestra versión, puedes encontrar una versión terminada de la muestra del código de la aplicación Vue en nuestro <a href="https://github.com/mdn/todo-vue">repositorio todo-vue</a>. Para una verisón en vivo, consulta <a href="https://mdn.github.io/todo-vue/dist/">https://mdn.github.io/todo-vue/dist/</a>.</p>
+</div>
+
+<dl>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">1. Primeros pasos en Vue</a></dt>
+ <dd>A continuación, presentamos Vue, el tercero de nuestros frameworks. En este artículo, veremos un poco sobre el origen de Vue, aprenderemos cómo instalarlo y crear un nuevo proyecto, estudiaremos la estructura de alto nivel de todo el proyecto y de un componente individual, veremos cómo ejecutar el proyecto localmente y prepararlo para comenzar a construir nuestro ejemplo.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">2. Creando nuestro primer componente de Vue</a></dt>
+ <dd>Ahora es momento de profundizar en Vue y crear nuestro propio componente personalizado: comenzaremos creando un componente para representar cada elemento en la lista de tareas. Durante el artículo, aprenderemos sobre algunos conceptos importantes, como llamar a componentes dentro de otros componentes, pasarles datos a través de props y guardar el estado de los datos.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">3. Renderizando una lista de componentes de Vue</a></dt>
+ <dd><span class="author-d-1gg9uz65z1iz85zgdz68zmqkz84zo2qoxwoxz78zz83zz84zz69z2z80zgwxsgnz83zfkt5e5tz70zz68zmsnjz122zz71z">En este punto, tenemos un componente completamente funcional; ahora estamos listos para agregar varios componentes <code>ToDoItem</code> a nuestra aplicación. En este artículo, veremos cómo agregar un conjunto de datos de elementos de tareas a nuestro componente <code>App.vue</code>, el cual luego repasaremos en bucle, mostrando dentro de los componentes de <code>ToDoItem</code> mediante el uso de la directiva <code>v-for</code>. </span></dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">4. Agregar una nueva forma de tareas pendientes: eventos, métodos y modelos de Vue</a></dt>
+ <dd>Ahora tenemos datos de muestra listos y un ciclo que toma cada bit de datos y lo renderiza dentro de un <code>ToDoItem</code> en nuestra aplicación. Lo que realmente necesitamos a continuación es la capacidad de permitirle a nuestros usuarios que introuduzcan sus propios elementos de tareas pendientes en la aplicación, y para ello, necesitaremos un <code>&lt;input&gt;</code> de texto, un evento para efectuar una vez se envíen los datos, un método por accionar al momento del envío para agregar los datos y volver a renderizar la lista, y un modelo para controlar los datos. Esto es lo que cubriremos en este artículo.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">5. Agregando estilos a los componentes de Vue con CSS</a></dt>
+ <dd>Por fin ha llegado el momento de hacer que nuestra aplicación luzca un poco mejor. En este artículo, exploraremos las diferentes formas de agregar estilos a los componentes de Vue con CSS.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">6. Usando propiedades calculadas de Vue</a></dt>
+ <dd>En este artículo, agregaremos un contador que muestre el número de tareas completadas, utilizando una función de Vue llamada propiedades calculadas. Estos funcionan de manera similar a los métodos, pero solo se vuelven a ejecutar cuando cambia una de sus dependencias.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">7. Renderización condicional en Vue: editando tareas existentes</a></dt>
+ <dd>Ahora es momento de agregar una de las principales piezas de la funcionalidad que aún nos falta: la capacidad de editar tareas existentes. Para hacer esto, aprovecharemos las capacidades de renderizado condicional de Vue, es decir, <code>v-if</code> y <code>v-else</code>, los cuales nos permiten alternar entre la vista de una tarea existente y una vista de edición donde podremos actualizar las etiquetas de las tareas. También veremos cómo agregar funcionalidad para eliminar tareas.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">8. Gestión de enfoque con Vue refs</a></dt>
+ <dd>Ya estamos cerca de terminar con Vue. La última funcionalidad a considerar es la gestión del enfoque, o dicho de otra manera, cómo podemos mejorar la accesibilidad de nuestra aplicación desde el teclado. Veremos el uso de Vue refs para manejar esto, una característica avanzada que nos permite tener acceso directo a los nodos DOM subyacentes debajo del DOM virtual, o acceso directo desde un componente a la estructura DOM interna de un componente interno.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">9. Recursos sobre Vue</a></dt>
+ <dd>Ahora, completaremos nuestro estudio de Vue brindándote una lista de recursos que podrás utilizar para avanzar en tu aprendizaje, además de algunos otros consejos útiles.</dd>
+</dl>
+
+<h2 id="¿Cuales_frameworks_hemos_escogido">¿Cuales frameworks hemos escogido?</h2>
+
+<p>Hacemos pública nuestra serie inicial de artículos con guías enfocadas en tres de los principales frameworks que existen: React/ReactDOM, Ember, y Vue. Esto se debe a varias un razones:</p>
+
+<ul>
+ <li>Son opciones populares que estarán disponibles por un largo tiempo. Al igual que con cualquier otra herramienta de software, es bueno apegarse a opciones que son desarrolladas de manera activa, lo que indica que, probablemente, no serán descontinuadas dentro de poco, lo que las convierte en complementos atractivos para mostrar como habilidades a la hora de buscar un trabajo.</li>
+ <li>Tienen comunidades sólidas y una buena documentación. Es muy importante poder obtener ayuda al aprender un tema complejo, especialmente cuando recién se está comenzando.</li>
+ <li>No contamos con los recursos para cubrir todos los frameworks modernos. Una lista así resultaría muy difícil de mantener actualizada, ya que todo el tiempo están surgiendo nuevos frameworks.</li>
+ <li>Como principiante, tratar de escoger en qué concentrarte entre la gran cantidad de opciones disponibles es un gran problema. Por lo tanto, resulta útil mantener una lista corta.</li>
+</ul>
+
+<p>Queremos decir esto desde un principio: <strong>no</strong> hemos escogido los frameworks en los que nos estamos enfocando porque pensamos que son los mejores o porque los respaldamos de alguna manera. Simplemente, consideramos que obtienen una puntuación alta de acuerdo a los criterios anteriores.</p>
+
+<p>Ten en cuenta que esperábamos poder incluir más frameworks en la publicación inicial, pero que decidimos publicar el contenido y agregar, más adelante, otras guías, en lugar de retrasarlo más. Si tu framework favorito no se encuentra listado en este contenido y te gustaría ayudar a cambiar esto, ¡no dudes en discutirlo con nosotros! Puedes contactarnos a través de <a href="https://wiki.mozilla.org/Matrix">Matrix</a>, o <a href="https://discourse.mozilla.org/c/mdn">Discourse</a>, o enviarnos un correo electrónico a la <a href="mailto:mdn-admins@mozilla.org">lista mdn-admins</a>.</p>
diff --git a/files/es/learn/tools_and_testing/client-side_javascript_frameworks/react_getting_started/index.html b/files/es/learn/tools_and_testing/client-side_javascript_frameworks/react_getting_started/index.html
new file mode 100644
index 0000000000..121d2684d1
--- /dev/null
+++ b/files/es/learn/tools_and_testing/client-side_javascript_frameworks/react_getting_started/index.html
@@ -0,0 +1,478 @@
+---
+title: Primeros pasos en React
+slug: >-
+  Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started
+tags:
+  - Aprender
+  - Aprendiz
+  - Principiante
+translation_of: >-
+  Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started
+original_slug: >-
+  Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</div>
+
+<p class="summary">En este artículo conoceremos React. Descubriremos algunos detalles sobre su trasfondo y casos de uso, configuraremos una cadena básica de herramientas para React en nuestra computadora local, crearemos y jugaremos con una aplicación inicial sencilla, mientras aprendemos —durante el proceso— un poco acerca de cómo funciona React.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Prerrequisitos:</th>
+   <td>
+    <p>Familiaridad con los lenguajes <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, y <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>, conocimiento del <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">terminal/línea de comandos</a>.</p>
+
+    <p>React usa una sintaxis HTML-en-JavaScript llamada JSX (JavaScript y XML). Estar familiarizado con HTML y JavaScript te ayudará a aprender JSX, y a identificar —en una mejor manera— si los errores en tu aplicación están relacionados con JavaScript o con el más específico dominio de React.</p>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Configurar un entorno de desarrollo local para React, crear una aplicación inicial, y entender los aspectos básicos de su funcionamiento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Hola_React">Hola, React</h2>
+
+<p>Como su eslogan oficial señala, <a href="https://es.reactjs.org/">React</a> es una biblioteca para construir interfaces de usuario. React no es un <em>framework</em> — ni siquiera se limita a la web. React es utilizado con otras bibliotecas para renderizar en ciertos entornos. Por ejemplo, <a href="https://reactnative.dev/">React Native</a> puede usarse para desarrollar aplicaciones móviles; <a href="https://facebook.github.io/react-360/">React 360</a> permite crear aplicaciones de realidad virtual; además de otras posibilidades.</p>
+
+<p>Al desarrollar para la web, los desarrolladores usan React en conjunto con <a href="https://reactjs.org/docs/react-dom.html">ReactDOM</a>. React y ReactDOM son, a menudo, considerados al igual que —y utilizados para resolver los mismo problemas que— otros verdaderos frameworks de desarrollo web. Cuando nos referimos a React como un "framework", estamos trabajando con este significado coloquial.</p>
+
+<p>El objetivo principal de React es minimizar los errores que ocurren cuando los desarrolladores construyen interfaces de usuario. Esto lo hace mediante el uso de componentes — piezas de código lógicas y auto-contenidas que describen una parte de la interfaz del usuario. Estos componentes se pueden juntar para crear una interfaz de usuario completa, y React abstrae la mayor parte del trabajo de renderizado, permitiéndote enfocarte en el diseño de la interfaz.</p>
+
+<h2 id="Casos_de_uso">Casos de uso</h2>
+
+<p>A diferencia de los otros frameworks vistos en este módulo, React no impone reglas estrictas sobre convenciones de código u organización de archivos. Esto le permite a los equipos establecer las convenciones que funcionen mejor para ellos y adoptar React de la manera en que deseen. React puede manejar un solo botón, algunas piezas de una interfaz o la interfaz de usuario completa de una aplicación.</p>
+
+<p>Si bien React <em>puede</em> usarse para <a href="https://es.reactjs.org/docs/add-react-to-a-website.html">pequeñas piezas de una interfaz</a>, no resulta tan sencillo "introducirlo" en una aplicación como sería el caso de una biblioteca como jQuery —o incluso de un framework, como Vue—, por lo que viene a ser más abordable cuando construimos una aplicación completamente con React.</p>
+
+<p>Además, muchos de los beneficios de la experiencia del desarrollador de una aplicación React, como codificar interfaces con JSX, requieren un proceso de compilación. Agregar un compilador como Babel a un sitio web hace que el código se ejecute de manera lenta, por lo que los desarrolladores a menudo configuran dichas herramientas con un paso de compilación. Podrá decirse que React tiene un gran requisito de herramientas, pero se puede aprender.</p>
+
+<p>Este artículo se enfocará en el caso de uso de usar React para renderizar la interfaz de usuario completa de una aplicación, usando herramientas proporcionadas por la propia herramienta de Facebook <a href="https://create-react-app.dev/">create-react-app</a>.</p>
+
+<h2 id="¿Cómo_React_usa_JavaScript">¿Cómo React usa JavaScript?</h2>
+
+<p>React utiliza características modernas de JavaScript para muchos de sus patrones. El punto donde más se aleja de JavaScript se refleja en el uso de la sintaxis <a href="https://es.reactjs.org/docs/introducing-jsx.html">JSX</a>, la que, a su vez, amplía la sintaxis de JavaScript para que código similar a HTML pueda formar parte del mismo. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">const heading = &lt;h1&gt;Mozilla Developer Network&lt;/h1&gt;;</pre>
+
+<p>Esta constante "heading" se conoce como una <strong>expresión JSX</strong>. React puede usarla para representar la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/Heading_Elements">&lt;h1&gt;</a></code> en nuestra aplicación.</p>
+
+<p>Supongamos que, por razones semánticas, queremos envolver nuestro encabezado en una etiqueta <code><a href="/en-US/docs/Web/HTML/Element/header">&lt;header&gt;</a></code>. El enfoque JSX nos permite anidar nuestros elementos entre sí, tal como lo hacemos con HTML:</p>
+
+<pre class="brush: js notranslate">const header = (
+  &lt;header&gt;
+    &lt;h1&gt;Mozilla Developer Network&lt;/h1&gt;
+  &lt;/header&gt;
+);</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Los paréntesis en el fragmento anterior no son exclusivos de JSX y no tienen ningún efecto en la aplicación. Son una señal para ti (y tu computadora) de que las múltiples líneas de código que contiene forman parte de una misma expresión. También podríamos escribir la expresión del encabezado de esta manera:</p>
+
+<pre class="brush: js notranslate">const header = &lt;header&gt;
+    &lt;h1&gt;Mozilla Developer Network&lt;/h1&gt;
+&lt;/header&gt;</pre>
+
+<p>Sin embargo, esto luce un poco raro, ya que la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/header">&lt;header&gt;</a></code> que inicia la expresión no tiene sangría en la misma posición que su correspondiente etiqueta de cierre.</p>
+</div>
+
+<p>Por supuesto, tu navegador no puede leer JSX sin ayuda. Al compilarla (usando una herramienta como <a href="https://babeljs.io/">Babel</a> o <a href="https://parceljs.org/">Parcel</a>), nuestra expresión de encabezado se vería así:</p>
+
+<pre class="brush: js notranslate">const header = React.createElement("header", null,
+  React.createElement("h1", null, "Mozilla Developer Network")
+);</pre>
+
+<p>Es <em>posible</em> omitir el paso de la compilación y usar <code><a href="https://reactjs.org/docs/react-api.html#createelement">React.createElement()</a></code> para codificar la interfaz de usuario tú mismo. Sin embargo, al hacer esto, perderías el beneficio declarativo de JSX y tu código resultaría más difícil de leer. La compilación es un paso adicional en el proceso de desarrollo, pero muchos desarrolladores de la comunidad React piensan que la legibilidad de JSX vale la pena. Además, las herramientas populares hacen que la compilación de JSX a JavaScript sea parte de su proceso de configuración. No tendrás que configurar la compilación tú mismo, a menos que así lo quieras.</p>
+
+<p>Dado que JSX es una combinación de HTML y JavaScript, algunos desarrolladores lo encuentran intuitivo. Otros dicen que su naturaleza combinada lo hace confuso. Sin embargo, una vez que te sientas cómodo con JSX, te permitirá crear interfaces de usuario de forma más rápida e intuitiva, y permitirá que otros comprendan mejor tu base de código de un vistazo.</p>
+
+<p>Para leer más sobre JSX, consulta el artículo <a href="https://es.reactjs.org/docs/jsx-in-depth.html">JSX en profundidad</a> del equipo de React.</p>
+
+<h2 id="Configurando_tu_primera_aplicación_React">Configurando tu primera aplicación React</h2>
+
+<p>Hay muchas maneras de usar React, pero usaremos la herramienta create-react-app de la interfaz de línea de comandos (CLI, por sus siglas en inglés), como se mencionó anteriormente, la cual acelera el proceso de desarrollo de una aplicación React al instalar algunos paquetes y crear algunos archivos por ti, manejando las herramientas descritas anteriormente.</p>
+
+<p>Es posible <a href="https://es.reactjs.org/docs/add-react-to-a-website.html">agregar React a un sitio website sin usar create-react-app</a> copiando algunos elementos <code><a href="/en-US/docs/Web/HTML/Element/script">&lt;script&gt;</a></code> en un archivo HTML, pero la CLI de create-react-app es un punto de partida común para las aplicaciones React. Su uso te permitirá dedicar más tiempo a crear tu aplicación y menos a preocuparte por la configuración.</p>
+
+<h3 id="Requerimientos">Requerimientos</h3>
+
+<p>Para usar create-react-app, necesitas tener instalado <a href="https://nodejs.org/en/">Node.js</a>. Se recomienda utilizar la versión de soporte a largo plazo (LTS, por sus siglas en inglés). Node incluye npm (el administrador de paquetes de nodos), y npx (el ejecutor de paquetes de nodos).</p>
+
+<p>También puedes usar el administrador de paquetes Yarn como alternativa, pero asumiremos que estarás usando npm en estos tutoriales. Consulta <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management">Conceptos básicos de administración de paquetes</a> para obtener más información sobre npm y yarn.</p>
+
+<p>Si estás usando Windows, necesitarás instalar algún software para darle paridad con el terminal Unix/macOS, y así poder usar los comandos del terminal mencionados en este tutorial. <strong>Gitbash</strong> (el cual viene como parte del <a href="https://gitforwindows.org/">conjunto de herramientas git para Windows</a>) o el <strong><a href="https://docs.microsoft.com/en-us/windows/wsl/about">Subsistema de Windows para Linux</a></strong> (<strong>WSL</strong>, por sus siglas en inglés) son ambos adecuados. Consulte el <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">Curso intensivo de línea de comandos</a> para obtener más información sobre estos y sobre los comandos de terminal en general.</p>
+
+<p>También ten en cuenta que React y ReactDOM producen aplicaciones que solo funcionan en un conjunto bastante moderno de navegadores (IE9+ a través de algunos polyfills). Se recomienda el uso de un navegador moderno como Firefox, Safari o Chrome cuando trabajes con estos tutoriales.</p>
+
+<p>Además, consulta lo siguiente para obtener más información:</p>
+
+<ul>
+ <li><a href="https://nodejs.org/en/knowledge/getting-started/npm/what-is-npm/">"¿Qué es npm?" en nodejs.org</a></li>
+ <li><a href="https://blog.npmjs.org/post/162869356040/introducing-npx-an-npm-package-runner">"Introducing npx" en el blog de npm</a></li>
+ <li><a href="https://create-react-app.dev/">La documentación de create-react-app</a></li>
+</ul>
+
+<h3 id="Inicializando_tu_aplicación">Inicializando tu aplicación</h3>
+
+<p>create-react-app recibe un argumento: el nombre que te gustaría darle a tu aplicación. create-react-app usa este nombre para crear una nueva carpeta, luego crea los archivos necesarios dentro de la misma. Asegúrate de <code>cd</code> al lugar donde te gustaría que se guarde tu aplicación en tu disco duro, luego ejecuta lo siguiente en tu terminal:</p>
+
+<pre class="brush: bash notranslate">npx create-react-app moz-todo-react</pre>
+
+<p>Esto crea una carpeta <code>moz-todo-react</code>, y hace varias cosas dentro de la misma:</p>
+
+<ul>
+ <li>Instala algunos paquetes npm esenciales para la funcionalidad de la aplicación.</li>
+ <li>Escribe scripts para iniciar y servir la aplicación.</li>
+ <li>Crea una estructura de archivos y carpetas que definen la arquitectura básica de la aplicación.</li>
+ <li>Inicializa la carpeta como un repositorio de git, si tienes git instalado en tu computadora.</li>
+</ul>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: si tienes instalado el administrador de paquetes yarn, create-react-app lo usará por defecto en lugar de npm. Si tienes ambos administradores de paquetes instalados y quieres, explícitamente, usar npm, puedes agregar el indicador <code>--use-npm</code> cuando ejecutes create-react-app:</p>
+
+<pre class="brush: bash notranslate">npx create-react-app moz-todo-react --use-npm</pre>
+</div>
+
+<p>create-react-app mostrará una serie de mensajes en tu terminal mientras opera, ¡lo cual es normal! Esto puede tardar unos minutos, por lo que ahora podría ser un buen momento para preparar una taza de té.</p>
+
+<p>Una vez completado el proceso, <code>cd</code> a la carpeta <code>moz-todo-react</code> y ejecuta el comando <code>npm start</code>. Los scripts instalados por create-react-app comenzarán a servirse en un servidor local en <code>localhost:3000</code> y abrirán la aplicación en una nueva pestaña del navegador. Tu navegador mostrará algo como esto:</p>
+
+<p><img alt="Screenshot of Firefox MacOS, open to localhost:3000, showing the default create-react-app application" src="https://mdn.mozillademos.org/files/17203/default-create-react-app.png" style="border-style: solid; border-width: 1px; height: 980px; width: 1600px;"></p>
+
+<h3 id="Estructura_de_la_aplicación">Estructura de la aplicación</h3>
+
+<p>create-react-app nos provee todo lo que necesitamos para desarrollar una aplicación React. Su estructura inicial de archivos luce así:</p>
+
+<pre class="notranslate">moz-todo-react
+├── README.md
+├── node_modules
+├── package.json
+├── package-lock.json
+├── .gitignore
+├── public
+│   ├── favicon.ico
+│   ├── index.html
+│   └── manifest.json
+└── src
+    ├── App.css
+    ├── App.js
+    ├── App.test.js
+    ├── index.css
+    ├── index.js
+    ├── logo.svg
+    └── serviceWorker.js</pre>
+
+<p>La carpeta <strong><code>src</code></strong> es donde pasaremos la mayor parte de nuestro tiempo, ya que es donde reside el código fuente de nuestra aplicación.</p>
+
+<p>La carpeta <strong><code>public</code></strong> contiene archivos que serán leidos por tu navegador mientras desarrollas la aplicación; el más importante de ellos es <code>index.html</code>. React introduce tu código en este archivo de manera que tu navegador pueda ejecutarlo. Hay alguno que otro marcado que ayuda a create-react-app a funcionar, así que ten cuidado de no editarlo a menos que sepas lo que estás haciendo. Deberías cambiar el texto dentro del elemento <code><a href="/en-US/docs/Web/HTML/Element/title">&lt;title&gt;</a></code> en este archivo para reflejar el título de tu aplicación. ¡Los títulos de página precisos son importantes para la accesibilidad!</p>
+
+<p>La carpeta <code>public</code> también será publicada cuando crees y despliegues una versión para producción de tu aplicación. No cubriremos el despliegue en este tutorial, pero deberías poder usar una solución similar a la descrita en nuestro tutorial <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Deployment">Despliegue de nuestra aplicación</a>.</p>
+
+<p>El archivo <code>package.json</code> contiene información sobre nuestro proyecto que Node.js/npm usa para mantenerlo organizado. Este archivo no es exclusivo de las aplicaciones React; create-react-app simplemente lo completa. No es necesario que entiendas este archivo en lo absoluto para completar este tutorial, sin embargo, si deseas obtener más información al respecto, puedes leer <a href="https://nodejs.org/en/knowledge/getting-started/npm/what-is-the-file-package-json/">What is the file `package.json`? en NodeJS.org</a>; también hablamos de ello en nuestro tutorial <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management">Conceptos básicos de administración de paquetes</a>.</p>
+
+<h2 id="Explorando_nuestro_primer_componente_React_—_&lt;App>">Explorando nuestro primer componente React — <code>&lt;App/&gt;</code></h2>
+
+<p>En React, un <strong>componente</strong> es un módulo reutilizable que representa una parte de nuestra aplicación. Estas partes pueden ser grandes o pequeñas, pero, generalmente, están bien definidas: tienen un propósito único y obvio.</p>
+
+<p>Abramos <code>src/App.js</code>, ya que nuestro navegador nos pide que lo editemos. Este archivo contiene nuestro primer componente —<code>App</code>—, y algunas otras líneas de código:</p>
+
+<pre class="brush: js notranslate">import React from 'react';
+import logo from './logo.svg';
+import './App.css';
+
+function App() {
+  return (
+    &lt;div className="App"&gt;
+      &lt;header className="App-header"&gt;
+        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
+        &lt;p&gt;
+          Edit &lt;code&gt;src/App.js&lt;/code&gt; and save to reload.
+        &lt;/p&gt;
+        &lt;a
+          className="App-link"
+          href="https://reactjs.org"
+          target="_blank"
+          rel="noopener noreferrer"
+        &gt;
+          Learn React
+        &lt;/a&gt;
+      &lt;/header&gt;
+    &lt;/div&gt;
+  );
+}
+export default App;</pre>
+
+<p>El archivo <code>App.js</code> se compone de tres partes principales: algunas declaraciones <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/import">import</a></code> en la parte superior, el componente <code>App</code> en el medio, y una declaración <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/export">export</a></code> en la parte inferior. La mayoría de los componentes de React siguen este patrón.</p>
+
+<h3 id="Declaraciones_import">Declaraciones <code>import</code></h3>
+
+<p>Las declaraciones <code>import</code> en la parte superior del archivo le permiten a <code>App.js</code> utilizar código que ha sido definido en otra parte. Revisemos estas declaraciones más detalladamente.</p>
+
+<pre class="brush: js notranslate">import React from 'react';
+import logo from './logo.svg';
+import './App.css';</pre>
+
+<p>La primera declaración importa la biblioteca React como tal. Dado que React convierte el JSX que escribimos en <code>React.createElement()</code>, todos los componentes de React deben importar el módulo <code>React</code>. Si omites este paso, tu aplicación producirá un error.</p>
+
+<p>La segunda declaración importa un logotipo de <code>'./logo.svg'</code>. Observa el uso de <code>./</code> al principio de la ruta y la extensión <code>.svg</code> al final — estos nos indican que el archivo es local y que no es un archivo JavaScript. De hecho, el archivo <code>logo.svg</code> reside en nuestra carpeta raíz.</p>
+
+<p>No hace falta proveer una ruta o extensión al importar el módulo <code>React</code>, ya que este no es un archivo local. En cambio, aparece como una dependencia en nuestro archivo <code>package.json</code>. ¡Ten cuidado con esta distinción mientras trabajas en esta lección!</p>
+
+<p>La tercera declaración importa el CSS relacionado con nuestro componente <code>App</code>. Observa que no hay nombre de variable ni de directiva <code>from</code>. Esta sintaxis de importación en particular no es propia de la sintaxis de módulos de JavaScript. Esta proviene de Webpack, la herramienta que create-react-app usa para agrupar todos nuestros archivos JavaScript y enviarlos al navegador.</p>
+
+<h3 id="El_componente_App">El componente <code>App</code></h3>
+
+<p>Después de las importaciones, tenemos una función llamada <code>App</code>. Mientras que una mayor parte de la comunidad JavaScript prefiere nombres tipo <em>camel-case</em> como <code>helloWorld</code>, los componentes de React usan nombres de variables tipo <em>pascal-case</em>, como <code>HelloWorld</code>, para dejar en claro que un determinado elemento JSX es un componente de React y no una etiqueta HTML normal. Si llegaras a cambiar el nombre de la función <code>App</code> por <code>app</code>, tu navegador te mostraría un error.</p>
+
+<p>Vamos a darle un vistazo más detallado a <code>App</code>.</p>
+
+<pre class="brush: js notranslate">function App() {
+  return (
+    &lt;div className="App"&gt;
+      &lt;header className="App-header"&gt;
+        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
+        &lt;p&gt;
+          Edit &lt;code&gt;src/App.js&lt;/code&gt; and save to reload.
+        &lt;/p&gt;
+        &lt;a
+          className="App-link"
+          href="https://reactjs.org"
+          target="_blank"
+          rel="noopener noreferrer"
+        &gt;
+          Learn React
+        &lt;/a&gt;
+      &lt;/header&gt;
+    &lt;/div&gt;
+  );
+}</pre>
+
+<p>La función <code>App</code> devuelve una expresión JSX. Esta expresión define lo que tu navegador presenta en última instancia al DOM.</p>
+
+<p>Algunos elementos de la expresión tienen atributos, los cuales se escriben igual que en HTML, siguiendo un patrón de <code>atributo="valor"</code>. En la línea 3, la etiqueta de apertura <code><a href="/en-US/docs/Web/HTML/Element/div">&lt;div&gt;</a></code> tiene un atributo <code>className</code>. Este es equivalente al atributo <code><a href="/en-US/docs/Web/HTML/Global_attributes/class">class</a></code> de HTML, pues dado que JSX es JavaScript, no podemos usar la palabra <code>class</code> —la cual está reservada—, lo que significa que JavaScript ya la usa para un propósito específico y causaría problemas en nuestro código. Algunos otros atributos HTML también se escriben de manera diferente en JSX (de como se escriben en HTML), por el mismo tipo de razón. Los revisaremos a medida que nos crucemos con estos.</p>
+
+<p>Tómate un momento para cambiar la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/p">&lt;p&gt;</a></code> en la línea 6 para que diga "¡Hola, mundo!", luego guarda los cambios. Notarás que este cambio se procesa inmediatamente en el servidor de desarrollo que se ejecuta en <code>http://localhost:3000</code> en tu navegador. Ahora elimina la etiqueta <code><a href="/en-US/docs/Web/HTML/Element/a">&lt;a&gt;</a></code> y guarda los cambios; el enlace "Learn React" habrá desaparecido.</p>
+
+<p>Ahora, tu componente <code>App</code> debería lucir así:</p>
+
+<pre class="brush: js notranslate">function App() {
+  return (
+    &lt;div className="App"&gt;
+      &lt;header className="App-header"&gt;
+        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
+        &lt;p&gt;
+          ¡Hola, mundo!
+        &lt;/p&gt;
+      &lt;/header&gt;
+    &lt;/div&gt;
+  );
+}</pre>
+
+<h3 id="Declaraciones_export">Declaraciones <code>export</code></h3>
+
+<p>En la parte inferior del archivo <code>App.js</code>, la declaración <code>export default App</code> hace que nuestro componente <code>App</code> esté disponible para otros módulos.</p>
+
+<h2 id="Explorando_el_index">Explorando el index</h2>
+
+<p>Vamos a abrir el archivo <code>src/index.js</code>, ya que es en este donde el componente <code>App</code> está siendo utilizado. Este archivo es el punto de entrada para nuestra aplicación, e inicialmente luce así:</p>
+
+<pre class="brush: js notranslate">import React from 'react';
+import ReactDOM from 'react-dom';
+import './index.css';
+import App from './App';
+import * as serviceWorker from './serviceWorker';
+
+ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));
+
+// If you want your app to work offline and load faster, you can change
+// unregister() to register() below. Note this comes with some pitfalls.
+// Learn more about service workers: https://bit.ly/CRA-PWA
+serviceWorker.unregister();</pre>
+
+<p>Al gual que <code>App.js</code>, el archivo comienza importando todos los módulos JS y otros activos que necesita para ejecutarse. <code>src/index.css</code> contiene estilos globales que se aplican a toda nuestra aplicación. Podemos ver que nuestro componente <code>App</code> también es importado acá; su importación es posible gracias a la declaración <code>export</code> en la parte inferior de <code>App.js</code>.</p>
+
+<p>En la línea 7, se invoca la función <code>ReactDOM.render()</code> de React con dos argumentos:</p>
+
+<ul>
+ <li>El componente que queremos renderizar, <code>&lt;App /&gt;</code> en este caso.</li>
+ <li>El elemento DOM dentro del cual queremos que se renderice el componente, en este caso, el elemento con un ID de <code>root</code>. Si miras dentro de <code>public/index.html</code>, verás que este es un elemento <code>&lt;div&gt;</code> justo dentro de <code>&lt;body&gt;</code>.</li>
+</ul>
+
+<p>Todo esto le indica a React que queremos renderizar nuestra aplicación React con el componente <code>App</code> como raíz, o primer componente.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: En JSX, los componentes de React y los elementos HTML deben tener, obligatoriamente, barras diagonales de cierre. Escribir solo <code>&lt;App&gt;</code> o solo <code>&lt;img&gt;</code> provocará un error.</p>
+</div>
+
+<p>Los <a href="/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers">Service workers</a> son interesantes piezas de código que ayudan al rendimiento de las aplicaciones y permiten que las funciones de tus aplicaciones web funcionen sin conexión, pero estas no están dentro del alcance de este artículo. Puedes eliminar la línea 5, así como las líneas 9 a 12.</p>
+
+<p>Finalmente, tu archivo <code>index.js</code> debería verse así:</p>
+
+<pre class="brush: js notranslate">import React from 'react';
+import ReactDOM from 'react-dom';
+import './index.css';
+import App from './App';
+
+ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));</pre>
+
+<h2 id="Variables_y_props">Variables y props</h2>
+
+<p>A continuación, usaremos algunas de nuestras habilidades de JavaScript para lograr sentirnos un poco más cómodos editando componentes y trabajando con datos en React. Hablaremos sobre cómo se usan las variables dentro de JSX, e introduciremos props, que son una forma de pasar datos a un componente (al que luego se puede acceder usando variables).</p>
+
+<h3 id="Variables_en_JSX">Variables en JSX</h3>
+
+<p>De vuelta en <code>App.js</code>, enfoquémonos en la línea 9:</p>
+
+<pre class="brush: js notranslate">&lt;img src={logo} className="App-logo" alt="logo" /&gt;</pre>
+
+<p>Aquí, el valor del atributo <code>src</code> de la etiqueta <code>&lt;img /&gt;</code> está entre llaves. Así es como JSX reconoce las variables. Al encontrarse con <code>{logo}</code>, React sabrá que nos referimos a la importación del logotipo en la línea 2 de nuestra aplicación, y luego recuperará el archivo del logo y lo renderizará.</p>
+
+<p>Vamos a intentar crear una variable propia. Antes de la declaración return de <code>App</code>, agrega <code>const subject = "React";</code>. Tu componente <code>App</code> ahora debería verse así:</p>
+
+<pre class="brush: js notranslate">function App() {
+  const subject = "React";
+  return (
+    &lt;div className="App"&gt;
+      &lt;header className="App-header"&gt;
+        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
+        &lt;p&gt;
+          ¡Hola, mundo!
+        &lt;/p&gt;
+      &lt;/header&gt;
+    &lt;/div&gt;
+  );
+}</pre>
+
+<p>Cambia la línea 8, de manera que se use la variable <code>subject</code> en vez de la palabra "mundo", así:</p>
+
+<pre class="brush: js notranslate">function App() {
+  const subject = "React";
+  return (
+    &lt;div className="App"&gt;
+      &lt;header className="App-header"&gt;
+        &lt;img src={logo} className="App-logo" alt="logo" /&gt;
+        &lt;p&gt;
+          ¡Hola, {subject}!
+        &lt;/p&gt;
+      &lt;/header&gt;
+    &lt;/div&gt;
+  );
+}</pre>
+
+<p>Al guardar, tu navegador debería mostrar "¡Hola, React!" en vez de "¡Hola, mundo!"</p>
+
+<p>Las variables son convenientes, pero la que acabamos de configurar no hace gran uso de las funciones de React. Es allí donde entran los props.</p>
+
+<h3 id="Props_de_componentes">Props de componentes</h3>
+
+<p>Un <strong>prop</strong> es cualquier dato que se pasa a un componente de React. Los props se escriben dentro de las llamadas a los componentes y utilizan la misma sintaxis que los atributos HTML: <code>prop="value"</code>. Abramos <code>index.js</code> y démosle a la llamada de nuestro <code>&lt;App/&gt;</code> su primer prop.</p>
+
+<p>Agrega un prop de <code>subject</code> a la llamada del componente <code>&lt;App /&gt;</code>, con un valor de <code>Clarice</code>. Al terminar, tu código debería verse similar a este:</p>
+
+<pre class="brush: js notranslate">ReactDOM.render(&lt;App subject="Clarice" /&gt;, document.getElementById('root'));</pre>
+
+<p>Volviendo a <code>App.js</code>, vamos a revisar nuevamente la función <code>App</code> como tal, la cual se lee así (acortando la declaración <code>return</code> por razones de brevedad):</p>
+
+<pre class="brush: js notranslate">function App() {
+  const subject = "React";
+  return (
+    // return statement
+  );
+}</pre>
+
+<p>Cambia la declaración de la función <code>App</code> de manera que tome <code>props</code> como un parámetro, y elimina la constante <code>subject</code>. Al igual que cualquier otro parámetro de una función, puedes pasar <code>props</code> a <code>console.log()</code> para imprimirlos en la consola de tu navegador. Continúa, haciendo esto antes de la declaración <code>return</code>, así:</p>
+
+<pre class="brush: js notranslate">function App(props) {
+  console.log(props);
+  return (
+    // return statement
+  );
+}</pre>
+
+<p>Guarda tu archivo y revisa la consola JavaScript de tu navegador. Deberías ver registrado algo como esto:</p>
+
+<pre class="brush: js notranslate">Object { subject: "Clarice" }</pre>
+
+<p>La propiedad <code>subject</code> del objeto corresponde al prop <code>subject</code> que agregamos a la llamada de nuestro componente <code>&lt;App /&gt;</code>, y la cadena <code>Clarice</code> corresponde a su valor. Los props de componentes en React siempre se recopilan en objetos de esta manera.</p>
+
+<p>Ahora que <code>subject</code> es uno de nuestros props, usémoslo en <code>App.js</code>. Cambia la constante <code>subject</code> de manera que, en vez de definirla como la cadena <code>React</code>, estés leyendo el valor de <code>props.subject</code>. También puedes eliminar <code>console.log()</code>, si así lo quieres.</p>
+
+<pre class="brush: js notranslate">function App(props) {
+  const subject = props.subject;
+  return (
+    // return statement
+  );
+}</pre>
+
+<p>Una vez guardes, la aplicación debería darte la bienvenida con un "¡Hola, Clarice!". Si regresas a <code>index.js</code>, editas el valor de <code>subject</code>, y guardas, el texto cambiará.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Esto nos lleva al final de nuestra introducción a React, la cual incluye cómo instalarlo de manera local, cómo crear una aplicación inicial, y cómo funcionan los conceptos básicos. En el próximo artículo comenzaremos a construir nuestra primera aplicación como tal: una lista de tareas pendientes. Sin embargo, antes de ello, recapitulemos algunas de las cosas que hemos aprendido.</p>
+
+<p>En React:</p>
+
+<ul>
+ <li>Los componentes pueden importar los módulos que necesitan y deben exportarse a sí mismos al final de sus archivos.</li>
+ <li>Las funciones de componentes se nombran con <code>PascalCase</code>.</li>
+ <li>Puedes leer las variables JSX poniéndolas entre llaves, <code>{así}</code>.</li>
+ <li>Algunos atributos JSX son diferentes a los atributos HTML, para evitar conflictos con las palabras reservadas de JavaScript. Por ejemplo, el atributo <code>class</code> de HTML se convierte en <code>className</code> en JSX. Ten en cuenta que los atributos de varias palabras se nombran con <code>camelCase</code>.</li>
+ <li>Los props se escriben como atributos dentro de las llamadas de componentes y se pasan a los componentes.</li>
+</ul>
+
+<p>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</p>
+
+<h2 id="En_este_módulo">En este módulo</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Introducción a los frameworks del lado del cliente</a></li>
+ <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">Características principales de los frameworks</a></li>
+ <li>React
+  <ul>
+   <li><a href="/es/docs/Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/React_getting_started">Primeros pasos en React</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">Comenzando con nuestra lista de tareas de React</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">Basando nuestra aplicación React en componentes</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">Interactividad de React: eventos y estado</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">Interactividad de React: edición, filtrado, renderizado condicional</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">Accesibilidad en React</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">Recursos sobre React</a></li>
+  </ul>
+ </li>
+ <li>Ember
+  <ul>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">Primeros pasos en Ember</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Estructura de una aplicación Ember y cómo se basa en componentes</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">Interactividad de Ember: eventos, clases, y estado</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">Interactividad de Ember: funcionalidad del footer, renderizado condicional</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">Enrutamiento en Ember</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">Recursos sobre y solución de problemas</a></li>
+  </ul>
+ </li>
+ <li>Vue
+  <ul>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">Primeros pasos en Vue</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">Creando nuestro primer componente de Vue</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">Renderizando una lista de componentes de Vue</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">Agregar una nueva forma de tareas pendientes: eventos, métodos y modelos de Vue</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">Agregando estilos a los componentes de Vue con CSS</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">Usando propiedades calculadas de Vue</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">Renderización condicional en Vue: editando tareas existentes</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">Gestión de enfoque con Vue refs</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">Recursos sobre Vue</a></li>
+  </ul>
+ </li>
+ <li>Svelte
+  <ul>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started">Primeros pasos en Svelte</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_Todo_list_beginning">Comenzando con nuestra aplicación Svelte de lista de tareas</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_variables_props">Comportamiento dinámico en Svelte: trabajando con variables y props</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">Basando nuestra aplicación Svelte en componentes</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_reactivity_lifecycle_accessibility">Svelte avanzado: reactividad, ciclo de vida, accesibilidad</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores">Trabajando con Svelte stores</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript">Compatibilidad con TypeScript en Svelte</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_deployment_next">Implementación y próximos pasos</a></li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/learn/tools_and_testing/client-side_javascript_frameworks/vue_getting_started/index.html b/files/es/learn/tools_and_testing/client-side_javascript_frameworks/vue_getting_started/index.html
new file mode 100644
index 0000000000..1e5640d9e3
--- /dev/null
+++ b/files/es/learn/tools_and_testing/client-side_javascript_frameworks/vue_getting_started/index.html
@@ -0,0 +1,295 @@
+---
+title: Primeros pasos con Vue
+slug: Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started
+translation_of: Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started
+original_slug: >-
+  Learn/Herramientas_y_pruebas/Lado-del-cliente_JavaScript_frameworks/Vue_primeros_pasos
+---
+<div>{{LearnSidebar}}</div>
+
+<div>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</div>
+
+<p class="summary">Ahora vamos a introducir Vue, el tercero de nuestros frameworks. En este articulo vamos a ver un poco del background de Vue, aprenderemos cómo instalarlo y a crear un nuevo proyecto, estudiar la estructura de alto nivel de todo el proyecto y un componente individual, sabremos como correr el proyecto localmente, y tenerlo preparado para empezar a construir nuestro ejemplo.</p>
+
+<table class="learn-box standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Pre-requisitos:</th>
+   <td>
+    <p>Familiaridad con los motores de los lenguajes  <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, y  <a href="/en-US/docs/Learn/JavaScript">JavaScript</a> languages, conocimiento del <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">terminal/command line</a>.</p>
+
+    <p>Los componentes Vue son escritos como una combinacion de objectos Javascript que administran los datos de la app y una sintaxis de plantilla basada en HTML que se enlaza con la estructura DOM subyacente. Para la instalación, y para usar algunas de las caracteristicas mas avanzadas de Vue (como Componentes de archivos simples o renderizado de funciones), vas a necesitar un terminar con node + npm instalados.</p>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Objetivo:</th>
+   <td>Configurar un entorno de desarrollo local de Vue, crear una app de inicio y entender los principios de su funcionamiento.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Un_Vue_más_claro">Un Vue más claro</h2>
+
+<p>Vue es un framework moderno de Javascript que proveé facilidades muy utiles para el mejoramiento progresivo- al contrario de otros frameworks, puedes usar Vue para mejorar un HTML exstente. Esto permite usar Vue como un remplazo agregado para una libreria como <a href="https://wiki.developer.mozilla.org/en-US/docs/Glossary/jQuery">JQuery</a>.</p>
+
+<p>Habiendo dicho esto, tambien puedes usar Vue para escribir completamente una aplicación de una sola página(SPAs).This allows you to create markup managed entirely by Vue, which can improve developer experience and performance when dealing with complex applications. It also allows you to take advantage of libraries for client-side routing and state management when you need to. Additionally, Vue takes a "middle ground" approach to tooling like client-side routing and state management. While the Vue core team maintains suggested libraries for these functions, they are not directly bundled into Vue. This allows you to select a different routing/state management library if they better fit your application.</p>
+
+<p>In addition to allowing you to progressively integrate Vue into your applications, Vue also provides a progressive approach to writing markup. Like most frameworks, Vue lets you create reusable blocks of markup via components. Most of the time, Vue components are written using a special HTML template syntax. When you need more control than the HTML syntax allows, you can write JSX or plain JavaScript functions to define your  components.</p>
+
+<p>As you work through this tutorial, you might want to keep the <a href="https://vuejs.org/v2/guide/">Vue guide</a> and <a href="https://vuejs.org/v2/api/">API documentation</a> open in other tabs, so you can refer to them if you want more information on any sub topic.<br>
+ For a good (but potentially biased) comparison between Vue and many of the other frameworks, see <a href="https://vuejs.org/v2/guide/comparison.html">Vue Docs: Comparison with Other Frameworks</a>.</p>
+
+<h2 id="Installation">Installation</h2>
+
+<p>To use Vue in an existing site, you can drop one of the following <code><a href="/en-US/docs/Web/HTML/Element/script">&lt;script&gt;</a></code> elements onto a page. This allows you to start using Vue on existing sites, which is why Vue prides itself on being a progressive framework. This is a great option when migrating an existing project using a library like JQuery to Vue. With this method, you can use a lot of the core features of Vue, such as the attributes, custom components, and data-management.</p>
+
+<ul>
+ <li>
+  <p>Development Script (Unoptimized, but includes console warnings. Great for development</p>
+
+  <pre class="brush: html notranslate">&lt;script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"&gt;&lt;/script&gt;</pre>
+ </li>
+ <li>
+  <p>Production Script (Optimized version, minimal console warnings. It is recommended that you specify a version number when including Vue on your site so that any framework updates do not break your live site without you knowing.)</p>
+
+  <pre class="brush: html notranslate">&lt;script src="https://cdn.jsdelivr.net/npm/vue@2"&gt;&lt;/script&gt;</pre>
+ </li>
+</ul>
+
+<p>However, this approach has some limitations. To build more complex apps, you’ll want to use the <a href="https://www.npmjs.com/package/vue">Vue NPM package</a>. This will let you use advanced features of Vue and take advantage of bundlers like WebPack. To make building apps with Vue easier, there is a CLI to streamline the development process. To use the npm package &amp; the CLI you will need:</p>
+
+<ol>
+ <li>Node.js 8.11+ installed.</li>
+ <li>npm or yarn.</li>
+</ol>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: If you don't have the above installed, find out <a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line#Adding_powerups">more about installing npm and Node.js</a> here.</p>
+</div>
+
+<p>To install the CLI, run the following command in your terminal:</p>
+
+<pre class="brush: bash notranslate">npm install --global @vue/cli</pre>
+
+<p>Or if you'd prefer to use yarn:</p>
+
+<pre class="brush: bash notranslate">yarn global add @vue/cli</pre>
+
+<p>Once installed, to initialize a new project you can then open a terminal in the directory you want to create the project in, and run <code>vue create &lt;project-name&gt;</code>. The CLI will then give you a list of project configurations you can use. There are a few preset ones, and you can make your own. These options let you configure things like TypeScript, linting, vue-router, testing, and more.</p>
+
+<p>We’ll look at using this below.</p>
+
+<h2 id="Initializing_a_new_project">Initializing a new project</h2>
+
+<p>To explore various features of Vue, we will be building up a sample todo list app. We'll begin by using the Vue CLI to create a new app framework to build our app into. Follow the steps below:</p>
+
+<ol>
+ <li>In terminal, <code>cd</code> to where you'd like to create your sample app, then run <code>vue create moz-todo-vue</code>.</li>
+ <li>Use the arrow keys and <kbd>Enter</kbd> to select the "Manually select features" option.</li>
+ <li>The first menu you’ll be presented with allows you to choose which features you want to include in your project. Make sure that "Babel" and "Linter / Formatter" are selected. If they are not, use the arrow keys and the space bar to toggle them on. Once they are selected, press <kbd>Enter</kbd> to proceed.</li>
+ <li>Next you’ll select a config for the linter / formatter. Navigate to "Eslint with error prevention only" and hit <kbd>Enter</kbd> again. This will help us catch common errors, but not be overly opinionated.</li>
+ <li>Next you are asked to configure what kind of automated linting we want. Select "Lint on save". This will check for errors when we save a file inside the project. Hit <kbd>Enter</kbd> to continue.</li>
+ <li>Now, you will select how we want your config files to be managed. "In dedicated config files" will put your config settings for things like ESLint into their own, dedicated files. The other option, "In package.json", will put all of your config settings into the app's <code>package.json</code> file. Select "In dedicated config files" and push <kbd>Enter</kbd>.</li>
+ <li>Finally, you are asked if you want to save this as a preset for future options. This is entirely up to you. If you like these settings over the existing presets and want to use them again, type <kbd>y</kbd> , otherwise type <kbd>n</kbd>.</li>
+</ol>
+
+<p>The CLI will now begin scaffolding out your project, and installing all of your dependencies.</p>
+
+<p>If you've never run the Vue CLI before, you'll get one more question — you'll be asked to choose a package manager. You can use the arrow keys to select which one you prefer. The Vue CLI will default to this package manager from now on. If you need to use a different package manager after this, you can pass in a flag <code>--packageManager=&lt;package-manager&gt;</code>, when you run <code>vue create</code>.  So if you wanted to create the <code>moz-todo-vue</code> project with npm and you'd previously chosen yarn, you’d run <code>vue create moz-todo-vue --packageManager=npm</code>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: We've not gone over all of the options here, but you can <a href="https://cli.vuejs.org">find more information on the CLI</a> in the Vue docs.</p>
+</div>
+
+<h2 id="Project_structure">Project structure</h2>
+
+<p>If everything went successfully, the CLI should have created a series of files and directories for your project. The most significant ones are as follows:</p>
+
+<ul>
+ <li><code>.eslintrc.js</code>: This is a config file for <a href="https://eslint.org/">eslint</a>. You can use this to manage your linting rules.</li>
+ <li><code>babel.config.js</code>: This is the config file for <a href="https://babeljs.io/">Babel</a>, which transforms modern JavaScript features being used in development code into older syntax that is more cross-browser compatible in production code. You can register additional babel plugins in this file.</li>
+ <li><code>.browserslistrc</code>: This is a config for <a href="https://github.com/browserslist/browserslist">Browserslist</a>. You can use this to control which browsers your tooling optimizes for.</li>
+ <li><code>public</code>: This directory contains static assets that are published, but not processed by <a href="https://webpack.js.org/">Webpack</a> during build (with one exception; <code>index.html</code> gets some processing).
+  <ul>
+   <li><code>favicon.ico</code>: This is the favicon for your app. Currently, it's the Vue logo.</li>
+   <li><code>index.html</code>: This is the template for your app. Your Vue app is run from this HTML page, and you can use lodash template syntax to interpolate values into it.
+    <div class="note"><strong>Note</strong>: this is not the template for managing the layout of your application — this template is for managing static HTML that sits outside of your Vue app. Editing this file typically only occurs in advanced use cases.</div>
+   </li>
+  </ul>
+ </li>
+ <li><code>src</code>: This directory contains the core of your Vue app.
+  <ul>
+   <li><code>main.js</code>: this is the entry point to your application. Currently, this file initializes your Vue application and signifies which HTML element in the <code>index.html</code> file your app should be attached to. This file is often where you register global components or additional Vue libraries.</li>
+   <li><code>App.vue</code>: this is the top-level component in your Vue app. See below for more explanation of Vue components.</li>
+   <li><code>components</code>: this directory is where you keep your components. Currently it just has one example component.</li>
+   <li><code>assets</code>: This directory is for storing static assets like CSS and images. Because these files are in the source directory, they can be processed by Webpack. This means you can use pre-processors like <a href="https://sass-lang.com/">Sass/SCSS</a> or <a href="https://stylus-lang.com/">Stylus</a>.</li>
+  </ul>
+ </li>
+</ul>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: Depending on the options you select when creating a new project, there might be other directories present (for example, if you choose a router, you will also have a <code>views</code> directory).</p>
+</div>
+
+<h2 id=".vue_files_single_file_components">.vue files (single file components)</h2>
+
+<p>Like in many front-end frameworks, components are a central part of building apps in Vue. These components let you break a large application into discrete building blocks that can be created and managed separately, and transfer data between each other as required. These small blocks can help you reason about and test your code.</p>
+
+<p>While some frameworks encourage you to separate your template, logic, and styling code into separate files, Vue takes the opposite approach. Using <a href="https://vuejs.org/v2/guide/single-file-components.html">Single File Components</a>, Vue lets you group your templates, corresponding script, and CSS all together in a single file ending in <code>.vue</code>. These files are processed by a JS build tool (such as Webpack), which means you can take advantage of build-time tooling in your project. This allows you to use tools like Babel, TypeScript, SCSS and more to create more sophisticated components.</p>
+
+<p>As a bonus, projects created with the Vue CLI are configured to use <code>.vue</code> files with Webpack out of the box. In fact, if you look inside the <code>src</code> folder in the project we created with the CLI, you'll see your first <code>.vue</code> file: <code>App.vue</code>.</p>
+
+<p>Let's explore this now.</p>
+
+<h3 id="App.vue">App.vue</h3>
+
+<p>Open your <code>App.vue</code> file — you’ll see that it has three parts: <code>&lt;template&gt;</code>, <code>&lt;script&gt;</code>, and <code>&lt;style&gt;</code>, which contain the component’s template, scripting, and styling information. All Single File Components share this same basic structure.</p>
+
+<p><code>&lt;template&gt;</code> contains all the markup structure and display logic of your component. Your template can contain any valid HTML, as well as some Vue-specific syntax that we'll cover later.</p>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: By setting the <code>lang</code> attribute on the <code>&lt;template&gt;</code> tag, you can use Pug template syntax instead of standard HTML — <code>&lt;template lang="pug"&gt;</code>. We'll stick to standard HTML through this tutorial, but it is worth knowing that this is possible.</p>
+</div>
+
+<p><code>&lt;script&gt;</code> contains all of the non-display logic of your component. Most importantly, your <code>&lt;script&gt;</code> tag needs to have a default exported JS object. This object is where you locally register components, define component inputs (props), handle local state, define methods, and more. Your build step will process this object and transform it (with your template) into a Vue component with a <code>render()</code> function.</p>
+
+<p>In the case of <code>App.vue</code>, our default export sets the name of the component to <code>app</code> and registers the <code>HelloWorld</code> component by adding it into the <code>components</code> property. When you register a component in this way, you're registering it locally. Locally registered components can only be used inside the components that register them, so you need to import and register them in every component file that uses them. This can be useful for bundle splitting/tree shaking since not every page in your app necessarily needs every component.</p>
+
+<pre class="brush: js notranslate">import HelloWorld from './components/HelloWorld.vue';
+
+export default {
+  name: 'app',
+  components: {
+    //You can register components locally here.
+    HelloWorld
+  }
+};</pre>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: If you want to use <a href="https://www.typescriptlang.org/">TypeScript</a> syntax, you need to set the <code>lang</code> attribute on the <code>&lt;script&gt;</code> tag to signify to the compiler that you're using TypeScript — <code>&lt;script lang="ts"&gt;</code>.</p>
+</div>
+
+<p><code>&lt;style&gt;</code> is where you write your CSS for the component. If you add a <code>scoped</code> attribute — <code>&lt;style scoped&gt;</code> — Vue will scope the styles to the contents of your SFC. This works similar to CSS-in-JS solutions, but allows you to just write plain CSS.</p>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: If you select a CSS pre-processor when creating the project via the CLI, you can add a <code>lang</code> attribute to the <code>&lt;style&gt;</code> tag so that the contents can be processed by Webpack at build time. For example, <code>&lt;style lang="scss"&gt;</code> will allow you to use SCSS syntax in your styling information.</p>
+</div>
+
+<h2 id="Running_the_app_locally">Running the app locally</h2>
+
+<p>The Vue CLI comes with a built-in development server. This allows you to run your app locally so you can test it easily without needing to configure a server yourself. The CLI adds a <code>serve</code> command to the project’s <code>package.json</code> file as an npm script, so you can easily run it.</p>
+
+<p>In your terminal, try running <code>npm run serve</code> (or <code>yarn serve</code> if you prefer yarn). Your terminal should output something like the following:</p>
+
+<pre class="notranslate">INFO  Starting development server...
+98% after emitting CopyPlugin
+
+ DONE  Compiled successfully in 18121ms
+
+  App running at:
+  - Local:   &lt;http://localhost:8080/&gt;
+  - Network: &lt;http://192.168.1.9:8080/&gt;
+
+  Note that the development build is not optimized.
+  To create a production build, run npm run build.</pre>
+
+<p>If you navigate to the “local” address in a new browser tab (this should be something like <code>http://localhost:8080</code> as stated above, but may vary based on your setup), you should see your app. Right now, it should contain a welcome message, a link to the Vue documentation, links to the plugins you added when you initialized the app with your CLI, and some other useful links to the Vue community and ecosystem.</p>
+
+<p><img alt="default vue app render, with vue logo, welcome message, and some documentation links" src="https://mdn.mozillademos.org/files/17240/vue-default-app.png" style="border-style: solid; border-width: 1px; height: 779px; width: 1600px;"></p>
+
+<h2 id="Making_a_couple_of_changes">Making a couple of changes</h2>
+
+<p>Let's make our first change to the app — we’ll delete the Vue logo. Open the <code>App.vue</code> file, and delete the <code><a href="/en-US/docs/Web/HTML/Element/img">&lt;img&gt;</a></code> element from the template section:</p>
+
+<pre class="brush: html notranslate"><span class="author-d-iz88z86z86za0dz67zz78zz78zz74zz68zjz80zz71z9iz90z8h7gz67ziz76zcz77zz80zz71zncfz69zz69ziaz82zz71zz72zhz77zz122zz90z14mcyd">&lt;img alt="Vue logo" src="./assets/logo.png"&gt;</span></pre>
+
+<p>If your server is still running, you should see the logo removed from the rendered site almost instantly. Let’s also remove the <code>HelloWorld</code> component from our template.</p>
+
+<p>First of all delete this line:</p>
+
+<pre class="brush: html notranslate">&lt;HelloWorld msg="Welcome to Your Vue.js App"/&gt;</pre>
+
+<p>If you save your <code>App.vue</code> file now, the rendered app will throw an error because we’ve registered the component but are not using it. We also need to remove the lines from inside the <code>&lt;script&gt;</code> element that import and register the component:</p>
+
+<p>Delete these lines now:</p>
+
+<pre class="brush: js notranslate">import HelloWorld from './components/HelloWorld.vue'</pre>
+
+<pre class="brush: js notranslate">components: {
+  HelloWorld
+}</pre>
+
+<p>Your rendered app should no longer show an error, just a blank page, as we currently have no visible content inside <code>&lt;template&gt;</code>.</p>
+
+<p>Let’s add a new <code>&lt;h1&gt;</code> inside <code>&lt;div id="app"&gt;</code>. Since we’re going to be creating a todo list app below, let's set our header text to "To-Do List". Add it like so:</p>
+
+<pre class="brush: html notranslate">&lt;template&gt;
+  &lt;div id="app"&gt;
+    &lt;h1&gt;To-Do List&lt;/h1&gt;
+  &lt;/div&gt;
+&lt;/template&gt;</pre>
+
+<p><code>App.vue</code> will now show our heading, as you'd expect.</p>
+
+<h2 id="Summary">Summary</h2>
+
+<p>Let's leave this here for now. We've learnt about some of the ideas behind Vue, created some scaffolding for our example app to live inside, inspected it, and made a few preliminary changes.</p>
+
+<p>With a basic introduction out of the way, we'll now go further and build up our sample app, a basic Todo list application that allows us to store a list of items, check them off when done, and filter the list by all, complete, and incomplete todos.</p>
+
+<p>In the next article we'll build our first custom component, and look at some important concepts such as passing props into it and saving its data state.</p>
+
+<p>{{PreviousMenuNext("Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources","Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component", "Learn/Tools_and_testing/Client-side_JavaScript_frameworks")}}</p>
+
+<h2 id="In_this_module">In this module</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction">Introduction to client-side frameworks</a></li>
+ <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Main_features">Framework main features</a></li>
+ <li>React
+  <ul>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started">Getting started with React</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_todo_list_beginning">Beginning our React todo list</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_components">Componentizing our React app</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state">React interactivity: Events and state</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_filtering_conditional_rendering">React interactivity: Editing, filtering, conditional rendering</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_accessibility">Accessibility in React</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_resources">React resources</a></li>
+  </ul>
+ </li>
+ <li>Ember
+  <ul>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_getting_started">Getting started with Ember</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_structure_componentization">Ember app structure and componentization</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_interactivity_events_state">Ember interactivity: Events, classes and state</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_conditional_footer">Ember Interactivity: Footer functionality, conditional rendering</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_routing">Routing in Ember</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Ember_resources">Ember resources and troubleshooting</a></li>
+  </ul>
+ </li>
+ <li>Vue
+  <ul>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_getting_started">Getting started with Vue</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_first_component">Creating our first Vue component</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_rendering_lists">Rendering a list of Vue components</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_methods_events_models">Adding a new todo form: Vue events, methods, and models</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_styling">Styling Vue components with CSS</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_computed_properties">Using Vue computed properties</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_conditional_rendering">Vue conditional rendering: editing existing todos</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_refs_focus_management">Focus management with Vue refs</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Vue_resources">Vue resources</a></li>
+  </ul>
+ </li>
+ <li>Svelte
+  <ul>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started">Getting started with Svelte</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_Todo_list_beginning">Starting our Svelte Todo list app</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_variables_props">Dynamic behavior in Svelte: working with variables and props</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_components">Componentizing our Svelte app</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_reactivity_lifecycle_accessibility">Advanced Svelte: Reactivity, lifecycle, accessibility</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores">Working with Svelte stores</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_TypeScript">TypeScript support in Svelte</a></li>
+   <li><a href="/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_deployment_next">Deployment and next steps</a></li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/learn/tools_and_testing/cross_browser_testing/index.html b/files/es/learn/tools_and_testing/cross_browser_testing/index.html
new file mode 100644
index 0000000000..f9f0a26a7c
--- /dev/null
+++ b/files/es/learn/tools_and_testing/cross_browser_testing/index.html
@@ -0,0 +1,40 @@
+---
+title: Cross browser testing
+slug: Learn/Tools_and_testing/Cross_browser_testing
+translation_of: Learn/Tools_and_testing/Cross_browser_testing
+original_slug: Learn/Herramientas_y_pruebas/Cross_browser_testing
+---
+<div>{{LearnSidebar}}</div>
+
+<p class="summary">Este módulo se centra en probar proyectos web en diferentes navegadores. Nos fijamos en la identificación de su público objetivo (por ejemplo, qué usuarios, navegadores y dispositivos son los que más le preocupan?), cómo realizar las pruebas, los principales problemas a los que se enfrentará con los diferentes tipos de código y cómo mitigarlos, qué herramientas son las más útiles para ayudarle a probar y solucionar problemas, y cómo utilizar la automatización para acelerar las pruebas.</p>
+
+<h2 id="Prerequisitos">Prerequisitos</h2>
+
+<p>Debería aprender los conceptos básicos de los lenguajes <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a> y <a href="/en-US/docs/Learn/JavaScript">JavaScript</a> básicos antes de intentar utilizar las herramientas que se detallan aquí.</p>
+
+<h2 id="Guías">Guías</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Introduction">Introducción a la prueba de navegadores cruzados</a></dt>
+ <dd>Este artículo comienza el módulo proporcionando una visión general del tema de la prueba de navegadores cruzados, respondiendo a preguntas como "¿qué es la prueba de navegadores cruzados? y "¿cuáles son los tipos de problemas más comunes que se encuentran?</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Testing_strategies">Estrategias para la realización de las pruebas</a></dt>
+ <dd>
+ <p>A continuación, profundizamos en la realización de pruebas, la identificación de un público objetivo (por ejemplo, qué navegadores, dispositivos y otros segmentos deben ser probados), estrategias de pruebas de baja fiabilidad (obtenga una gama de dispositivos y algunas máquinas virtuales y realice pruebas ad-hoc cuando sea necesario), estrategias de alta tecnología (automatización, uso de aplicaciones de pruebas dedicadas), y pruebas con grupos de usuarios.</p>
+ </dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/HTML_and_CSS">Manejo de problemas comunes de HTML y CSS</a></dt>
+ <dd>
+ <p>Con el conjunto de escenas, ahora veremos específicamente los problemas comunes entre navegadores que encontrará en código HTML y CSS, y qué herramientas se pueden usar para evitar que ocurran problemas o para solucionarlos. Esto incluye el código de hilado, la entrega de prefijos CSS, el uso de herramientas de desarrollo de navegadores para localizar problemas, el uso de polifiltros para añadir soporte a los navegadores, la solución de problemas de diseño con capacidad de respuesta, y mucho más.</p>
+ </dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/JavaScript">Manejo de problemas comunes de JavaScript</a></dt>
+ <dd>
+ <p>Ahora veremos los problemas comunes de JavaScript en todos los navegadores y cómo solucionarlos. Esto incluye información sobre el uso de herramientas de desarrollo del navegador para localizar y solucionar problemas, el uso de polifondos y bibliotecas para solucionar los problemas, el funcionamiento de las funciones modernas de JavaScript en navegadores antiguos, y mucho más.</p>
+ </dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility">Manejo de problemas comunes de accesibilidad</a></dt>
+ <dd>A continuación, nos centramos en la accesibilidad, proporcionando información sobre problemas comunes, cómo realizar pruebas sencillas y cómo utilizar las herramientas de auditoría/automatización para encontrar problemas de accesibilidad.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Feature_detection">Implementación de la detección de características</a></dt>
+ <dd>La detección de funciones implica determinar si un navegador soporta un determinado bloque de código, y ejecutar un código diferente dependiendo de si lo hace (o no), de modo que el navegador siempre puede proporcionar una experiencia de trabajo en lugar de bloquearse/error en algunos navegadores. Este artículo detalla cómo escribir su propia detección de características simples, cómo usar una biblioteca para acelerar la implementación y características nativas para la detección de características como <code>@supports</code>.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Automated_testing">Introducción a las pruebas automatizadas</a></dt>
+ <dd>La realización manual de pruebas en varios navegadores y dispositivos, varias veces al día, puede resultar tediosa y consumir mucho tiempo. Para manejar esto eficientemente, debe familiarizarse con las herramientas de automatización. En este artículo, analizamos lo que está disponible, cómo utilizar los corredores de tareas y los conceptos básicos de cómo utilizar las aplicaciones de automatización de pruebas de navegadores comerciales, como Sauce Labs y Browser Stack.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Your_own_automation_environment">Configuración de su propio entorno de automatización de pruebas</a></dt>
+ <dd>En este artículo, le enseñaremos cómo instalar su propio entorno de automatización y ejecutar sus propias pruebas utilizando Selenium/WebDriver y una biblioteca de pruebas como Selenium-webdriver for Node. También veremos cómo integrar su entorno de pruebas local con aplicaciones comerciales como las que se comentaron en el artículo anterior.</dd>
+</dl>
diff --git a/files/es/learn/tools_and_testing/github/index.html b/files/es/learn/tools_and_testing/github/index.html
new file mode 100644
index 0000000000..77d02cf0de
--- /dev/null
+++ b/files/es/learn/tools_and_testing/github/index.html
@@ -0,0 +1,93 @@
+---
+title: Git y GitHub
+slug: Learn/Tools_and_testing/GitHub
+tags:
+  - Aprender
+  - GitHub
+  - Principiante
+  - Web
+  - git
+translation_of: Learn/Tools_and_testing/GitHub
+original_slug: Learn/Herramientas_y_pruebas/GitHub
+---
+<div>{{LearnSidebar}}</div>
+
+<p><font><font>Todos los desarrolladores utilizarán algún tipo de </font></font><strong><font><font>sistema de control de versiones</font></font></strong><font><font> ( </font></font><strong><font><font>VCS</font></font></strong><font><font> ), una herramienta que les permita colaborar con otros desarrolladores en un proyecto sin peligro de que sobrescriban el trabajo de los demás, y volver a las versiones anteriores de la base de código si existe un problema descubierto más tarde. </font><font>El VCS más popular (al menos entre los desarrolladores web) es </font></font><strong><font><font>Git</font></font></strong><font><font>, junto con </font></font><strong><font><font>GitHub</font></font></strong><font><font>, un sitio que proporciona alojamiento para tus repositorios y varias herramientas para trabajar con ellos. </font><font>Este módulo tiene como objetivo enseñarte lo que necesitas saber sobre ambos.</font></font></p>
+
+<h2 id="Introducción"><font><font>Introducción</font></font></h2>
+
+<p><font><font>Los VCS son esenciales para el desarrollo de software:</font></font></p>
+
+<ul>
+ <li><font><font>Es raro que trabajes en un proyecto completamente por tu cuenta, y tan pronto como comiences a trabajar con otras personas, comenzarás a correr el riesgo de entrar en conflicto con el trabajo del otro, es decir, cuando ambos intentan actualizar simultáneamente la misma pieza de código. </font><font>Debes tener algún tipo de mecanismo para administrar las ocurrencias y, como resultado, evitar la pérdida de trabajo.</font></font></li>
+ <li><font><font>Cuando trabajes en un proyecto por tu cuenta o con otros, querrás poder hacer una copia de seguridad del código en un lugar central, para que no se pierda si tu computadora se daña.</font></font></li>
+ <li><font><font>También querrás poder volver a versiones anteriores si más tarde descubres un problema. </font><font>Es posible que hayas empezado a hacer esto en tu propio trabajo mediante la creación de diferentes versiones de un mismo archivo, por ejemplo </font></font><code>myCode.js</code><font><font>, </font></font><code>myCode_v2.js</code><font><font>, </font></font><code>myCode_v3.js</code><font><font>, </font></font><code>myCode_final.js</code><font><font>, </font></font><code>myCode_really_really_final.js</code><font><font>, etc, pero esto es muy propenso a errores y poco fiable.</font></font></li>
+ <li><font><font>Los diferentes miembros del equipo generalmente querrán crear sus propias versiones separadas del código (llamadas </font></font><strong><font><font>ramas</font></font></strong><font><font> en Git), trabajar en una nueva característica en esa versión y luego fusionarla de manera controlada (en GitHub usamos </font></font><strong><font><font>solicitudes de extracción</font></font></strong><font><font>) con la versión maestra cuando hayan terminado con ella.</font></font></li>
+</ul>
+
+<p><font><font>Los VCS proporcionan herramientas para satisfacer las necesidades anteriores. </font></font><a href="https://git-scm.com/" rel="noopener"><font><font>Git</font></font></a><font><font> es un ejemplo de VCS, y </font></font><a href="https://github.com/" rel="noopener"><font><font>GitHub</font></font></a><font><font> es un sitio web + infraestructura que proporciona un servidor Git más una serie de herramientas realmente útiles para trabajar con repositorios git individuales o en equipo, como informar problemas con el código, herramientas de revisión, características de administración de proyectos tal como asignación de tareas, estados de tareas, y más.</font></font></p>
+
+<div class="blockIndicator note">
+<p><strong><font><font>Nota</font></font></strong><font><font>: Git en realidad es un </font><font>sistema de control de versiones </font></font><em><font><font>distribuido</font></font></em><font><font>, lo cual significa que se realiza una copia completa del repositorio que contiene la base de código en tu computadora (y en la de todos los demás). </font><font>Realizas cambios en tu propia copia, y luego empujas esos cambios nuevamente al servidor, donde un administrador decidirá si fusiona tus cambios con la copia maestra.</font></font></p>
+</div>
+
+<h3 id="¿Quieres_convertirte_en_un_desarrollador_web_front-end"><font><font>¿Quieres convertirte en un desarrollador web front-end?</font></font></h3>
+
+<p><font><font>Hemos preparado un curso que incluye toda la información esencial que necesitas para alcanzar tu objetivo.</font></font></p>
+
+<div class="in-page-callout webdev">
+<p><a class="cta primary" href="/docs/Learn/Front-end_web_developer">Comenzar</a></p>
+</div>
+
+<h2 id="Prerequisitos"><font><font>Prerequisitos</font></font></h2>
+
+<p><font><font>Para usar Git y GitHub, necesitas:</font></font></p>
+
+<ul>
+ <li><font><font>Una computadora de escritorio con Git instalado (consulta la </font></font><a href="https://git-scm.com/downloads" rel="noopener"><font><font>página de descargas de Git</font></font></a><font><font>).</font></font></li>
+ <li><font><font>Una herramienta para usar Git. </font><font>Dependiendo de cómo te guste trabajar, puedes usar un </font></font><a href="https://git-scm.com/downloads/guis/" rel="noopener"><font><font>cliente Git  con GUI</font></font></a><font><font> (te recomendamos GitHub Desktop, SourceTree o Git Kraken) o simplemente usar una ventana de la terminal. </font><font>De hecho, probablemente sea útil que conozcas al menos los conceptos básicos de los comandos de la terminal git, incluso si tienes la intención de usar una GUI.</font></font></li>
+ <li><font><font>Una </font></font><a href="https://github.com/join" rel="noopener"><font><font>cuenta de GitHub</font></font></a><font><font>. </font><font>Si aún no tienes una, regístrate ahora usando el enlace provisto.</font></font></li>
+</ul>
+
+<p><font><font>En términos de conocimiento previo, no necesitas saber nada sobre desarrollo web, Git/GitHub o VCS para iniciar este módulo. </font><font>Sin embargo, se recomienda que conozcas algo de codificación para que tengas conocimientos informáticos razonables y algún código para almacenar en tus repositorios.</font></font></p>
+
+<p><font><font>También es preferible que tengas algunos conocimientos básicos de la terminal, por ejemplo, moverte entre directorios, crear archivos y modificar la variable del sistema </font></font><code>PATH</code><font><font>.</font></font></p>
+
+<div class="blockIndicator note">
+<p><strong><font><font>Nota</font></font></strong><font><font>: Github no es el único sitio/conjunto de herramientas que puedes usar con Git. </font><font>Hay otras alternativas, como </font></font><a href="https://about.gitlab.com/" rel="noopener"><font><font>GitLab,</font></font></a><font><font> que podrías probar, y también podrías intentar configurar tu propio servidor Git y usarlo en lugar de GitHub. </font><font>Solo nos hemos quedado con GitHub en este curso para proporcionar una forma única que funciona.</font></font></p>
+</div>
+
+<h2 id="Guías"><font><font>Guías</font></font></h2>
+
+<p><font><font>Ten en cuenta que los enlaces a continuación te llevan a recursos en sitios externos. </font><font>Eventualmente intentaremos tener nuestro propio curso Git/GitHub dedicado, pero por ahora, esto te ayudará a familiarizarte con el tema en cuestión.</font></font></p>
+
+<dl>
+ <dt><a href="https://guides.github.com/activities/hello-world/" rel="noopener"><font><font>Hola mundo (de GitHub)</font></font></a></dt>
+ <dd><font><font>Este es un buen lugar para comenzar: esta guía práctica te permite comenzar a usar GitHub, aprender los conceptos básicos de Git, como crear repositorios y ramas, realizar confirmaciones, abrir y fusionar solicitudes de extracción.</font></font></dd>
+ <dt><a href="https://guides.github.com/introduction/git-handbook/" rel="noopener"><font><font>Manual de Git (en GitHub)</font></font></a></dt>
+ <dd><font><font>Este Manual de Git profundiza un poco más, explicando qué es un VCS, qué es un repositorio, cómo funciona el modelo básico de GitHub, comandos y ejemplos de Git, y más.</font></font></dd>
+ <dt><a href="https://guides.github.com/activities/forking/" rel="noopener"><font><font>Bifurcación de proyectos (de GitHub)</font></font></a></dt>
+ <dd><font><font>Bifurcar proyectos es esencial cuando deseas contribuir al código de otra persona. </font><font>Esta guía explica cómo.</font></font></dd>
+ <dt><a href="https://help.github.com/en/articles/about-pull-requests" rel="noopener"><font><font>Acerca de las solicitudes de extracción (de GitHub)</font></font></a></dt>
+ <dd><font><font>Una útil guía para administrar las solicitudes de extracción, la forma en que los cambios de código sugeridos se entregan a los repositorios de las personas para su consideración.</font></font></dd>
+ <dt><a href="https://guides.github.com/features/issues/" rel="noopener"><font><font>Dominando las incidencias (de GitHub)</font></font></a></dt>
+ <dd><font><font>Las incidencias son como un foro para tu proyecto GitHub, donde las personas pueden hacer preguntas e informar problemas, y tú puede administrar las actualizaciones (por ejemplo, asignar personas para solucionar problemas, aclarar el problema, informar a las personas que las cosas están solucionadas). </font><font>Este artículo te brinda lo que necesitas saber sobre las incidencias.</font></font></dd>
+</dl>
+
+<div class="blockIndicator note">
+<p><strong><font><font>Nota</font></font></strong><font><font>: Hay </font></font><strong><font><font>mucho más</font></font></strong><font><font> que puedes hacer con Git y GitHub, pero creemos que lo anterior representa lo mínimo que necesitas saber para comenzar a usar Git de manera efectiva. </font><font>A medida que profundices en Git, comenzarás a darte cuenta de que es fácil equivocarse cuando comienzas a usar comandos más complicados. </font><font>No te preocupes, incluso los desarrolladores web profesionales encuentran a Git confuso a veces, y a menudo resuelven problemas buscando soluciones en la web, o consultando sitios como </font></font><a href="https://github.com/k88hudson/git-flight-rules/blob/master/README_es.md" rel="noopener"><font><font>Reglas de vuelo para Git</font></font></a><font><font> y </font></font><a href="https://dangitgit.com/es" rel="noopener"><font><font>Dangit, ¡git!</font></font></a></p>
+</div>
+
+<h2 id="Ve_también"><font><font>Ve también</font></font></h2>
+
+<ul>
+ <li><a href="https://guides.github.com/introduction/flow/" rel="noopener"><font><font>Comprender el flujo de GitHub</font></font></a></li>
+ <li><a href="https://git-scm.com/docs" rel="noopener"><font><font>Lista de comandos de Git</font></font></a></li>
+ <li><a href="https://guides.github.com/features/mastering-markdown/" rel="noopener"><font><font>Reducción de dominio</font></font></a><font><font> (el formato de texto en el que escribe en relaciones públicas, comentarios de insidencias y archivos </font></font><code>.md</code><font><font>).</font></font></li>
+ <li><a href="https://guides.github.com/features/pages/" rel="noopener"><font><font>Introducción a las páginas de GitHub</font></font></a><font><font> (cómo publicar demostraciones y sitios web en GitHub).</font></font></li>
+ <li><a href="https://learngitbranching.js.org/" rel="noopener"><font><font>Aprende la ramificación de Git</font></font></a></li>
+ <li><a href="https://github.com/k88hudson/git-flight-rules" rel="noopener"><font><font>Reglas de vuelo para Git</font></font></a><font><font> (un compendio muy útil de formas de lograr cosas específicas en Git, incluida la forma de corregir las cosas cuando te equivocaste).</font></font></li>
+ <li>
+  <p><a href="https://dangitgit.com/" rel="noopener"><font><font>Dangit, git! </font></font></a><font><font>(otro compendio útil, específicamente de formas de corregir las cosas cuando te equivocaste).</font></font></p>
+ </li>
+</ul>
diff --git a/files/es/learn/tools_and_testing/index.html b/files/es/learn/tools_and_testing/index.html
new file mode 100644
index 0000000000..5c15d17096
--- /dev/null
+++ b/files/es/learn/tools_and_testing/index.html
@@ -0,0 +1,59 @@
+---
+title: Herramientas y pruebas
+slug: Learn/Tools_and_testing
+tags:
+  - Accesibilidad
+  - Aprender
+  - Aterrizaje
+  - CSS
+  - CodificaciónDeSecuenciasDeComandos
+  - HTML
+  - Herramientas
+  - JavaScript
+  - Navegador cruzado
+  - Principiante
+  - Pruebas de usuario
+  - Tema
+  - Testing
+  - automatización
+translation_of: Learn/Tools_and_testing
+original_slug: Learn/Herramientas_y_pruebas
+---
+<div>
+<p>{{LearnSidebar}}</p>
+
+<p>Una vez que haya comenzado a sentirse cómodo programando con tecnologías web básicas (como HTML, CSS y JavaScript), y comience a adquirir más experiencia, leer más recursos y aprender más trucos y consejos, comenzará a encontrar todos tipo de herramientas, desde CSS y JavaScript ya enrollados, aplicaciones de prueba y automatización, y muchas más. A medida que sus proyectos web se vuelvan más grandes y complejos, querrá comenzar a aprovechar algunas de estas herramientas y elaborar planes de prueba confiables para su código. Esta parte del área de aprendizaje tiene como objetivo brindarle lo que necesita para comenzar y tomar decisiones informadas.</p>
+</div>
+
+<p class="summary"> </p>
+
+<p>{{LearnSidebar}}</p>
+
+<p>La industria de la web es un lugar emocionante para trabajar, pero no está exenta de complicaciones. Las tecnologías principales que utilizamos para crear sitios web son bastante estables ahora, pero se están agregando nuevas características todo el tiempo, y nuevas herramientas, que facilitan el trabajo con estas tecnologías y están construidas sobre estas tecnologías, aparecen constantemente. Además de eso, todavía tenemos que mantener la compatibilidad entre navegadores en la parte superior de nuestras mentes y asegurarnos de que nuestro código sigue las mejores prácticas que permiten que nuestros proyectos funcionen en diferentes navegadores y dispositivos que nuestros usuarios utilizan para navegar por la Web, y ser utilizable por personas con discapacidad.</p>
+
+<p>Determinar qué herramientas debería usar puede ser un proceso difícil, por lo que hemos escrito este conjunto de artículos para informarle qué tipos de herramientas están disponibles, qué pueden hacer por usted y cómo hacer uso de los favoritos actuales de la industria.</p>
+
+<p> </p>
+
+<div class="note">
+<p>Nota: Debido a que aparecen nuevas herramientas y las antiguas pasan de moda todo el tiempo, hemos redactado deliberadamente este material para que sea lo más neutral posible. Queremos enfocarnos ante todo en los tipos generales de tareas que estas herramientas lo ayudarán a lograr. y seguir prescribiendo herramientas específicas al mínimo. Obviamente, necesitamos mostrar el uso de las herramientas para demostrar técnicas específicas, pero ten en cuenta que no necesariamente recomendamos estas herramientas como la mejor o la única forma de hacer las cosas; en la mayoría de los casos, existen otras formas, pero queremos brindarte una idea clara. Metodología que funciona.</p>
+</div>
+
+<h2 id="Camino_de_aprendizaje">Camino de aprendizaje</h2>
+
+<p> </p>
+
+<p>Debería aprender los conceptos básicos de los lenguajes <a href="https://developer.mozilla.org/en-US/docs/Learn/HTML">HTML</a>, <a href="https://developer.mozilla.org/en-US/docs/Learn/CSS">CSS</a>, y <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript">JavaScript</a> antes de intentar usar las herramientas que se detallan aquí. Por ejemplo, deberá conocer los fundamentos de estos idiomas antes de comenzar a depurar problemas en códigos web complejos, o hacer un uso efectivo de las bibliotecas de JavaScript, o escribir pruebas y ejecutarlas en su código utilizando corredores de prueba, etc.</p>
+
+<p>Primero necesitas una base sólida.</p>
+
+<p> </p>
+
+<h2 id="Módulos">Módulos</h2>
+
+<dl>
+ <dt><span class="tlid-translation translation"><span title="">Herramientas de desarrollo web en el mundo real (TBD)</span></span></dt>
+ <dd>En este módulo, exploramos los diferentes tipos de herramientas de desarrollo web disponibles. Esto incluye la revisión de los tipos de tareas más comunes a las que se le puede pedir que resuelva, cómo pueden encajar en un flujo de trabajo y las mejores herramientas disponibles actualmente para llevar a cabo esas tareas.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing">Pruebas de navegadores cruzados</a></dt>
+ <dd>Este módulo analiza específicamente el área de prueba de proyectos web en diferentes navegadores. Aquí vemos cómo identificar a su público objetivo (por ejemplo, qué usuarios, navegadores y dispositivos necesita preocuparse más), cómo realizar las pruebas, los principales problemas que enfrentará con los diferentes tipos de código y cómo solucionar o mitigue esos problemas, qué herramientas son más útiles para ayudarlo a probar y solucionar problemas, y cómo utilizar la automatización para acelerar las pruebas.</dd>
+</dl>
diff --git a/files/es/learn/tools_and_testing/understanding_client-side_tools/index.html b/files/es/learn/tools_and_testing/understanding_client-side_tools/index.html
new file mode 100644
index 0000000000..a18738e8a6
--- /dev/null
+++ b/files/es/learn/tools_and_testing/understanding_client-side_tools/index.html
@@ -0,0 +1,47 @@
+---
+title: Understanding client-side web development tools
+slug: Learn/Tools_and_testing/Understanding_client-side_tools
+tags:
+  - Aprender
+  - CSS
+  - Despliegue
+  - HTML
+  - Herramientas
+  - JavaScript
+  - Novatos
+  - Transformación
+  - client-side
+  - lado del cliente
+translation_of: Learn/Tools_and_testing/Understanding_client-side_tools
+original_slug: Learn/Herramientas_y_pruebas/Understanding_client-side_tools
+---
+<div>{{LearnSidebar}}</div>
+
+<p class="summary">Las herramientas del lado del cliente (<em>client-side</em> en inglés) pueden ser intimidantes, pero esta serie de artículos tiene como propósito ilustrar el propósito de algunos de los tipos de herramientas <em>client-side</em>, explicar las herramientas que puedes integrar, cómo instalarlas usando administradores de paquetes y cómo controlarlas usando la línea de comandos. Terminanos esta sección dando un ejemplo de cadena de herramientas para mostrarte cómo puedes ser más productivo</p>
+
+<p class="summary"><strong><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Overview">Inicia ahora con nuestra "Introducción a las herraminetas <em>client-side</em>"</a></strong></p>
+
+<h2 id="Requisitos_previos">Requisitos previos</h2>
+
+<p>Debes aprender el núcleo básico de los lenguajes <a href="/en-US/docs/Learn/HTML">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a> y <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>, antes de intentar usar las herramientas aquí descritas.</p>
+
+<div class="in-page-callout webdev">
+<h3 id="¿Quieres_convertirte_en_un_desarrollador_front-end">¿Quieres convertirte en un desarrollador <em>front-end</em>?</h3>
+
+<p>Tenemos un curso que incluye toda la información esencial que necesitas para lograr tu objetivo.</p>
+<a class="cta primary" href="/docs/Learn/Front-end_web_developer">Inicia ahora</a></div>
+
+<h2 id="Guías">Guías</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Overview">1. Introducción a las herramientas <em>client-side</em></a></dt>
+ <dd>En este artículo damos una introducción a las herramientas modernas de la web, los tipos de herramientas disponibles, donde te las puedes encontrar en el cliclo de desarrollo de aplicaciones web y como buscar ayuda con las herramientas individuales.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Command_line">2. Introducción a la linea de comandos</a></dt>
+ <dd>En tu proceso de desarrollo seguramente vas a requeria correr algunos comandos en la terminal (o "línea de comandos"). Este artículo da una introducción a la terminal, los comandos básicos que vas a necesitar para utilizarla, cómo integrar diferentes comandos y cómo agregar tu propia interfaz de línea de comandos (<em>command line interface</em> - CLI en inglés).</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Package_management">3. Introducción al manejo de paquetes</a></dt>
+ <dd>En este artículo exploramos los sistemas de administración de paquetes en detalle para entender cómo los podemos usar en nuestros proyectos, ya sea para instalar dependencias a nuestro proyecto, descargar actualizaciones y mucho más.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Introducing_complete_toolchain">4. Introduciendo una cadena de herramientas completa</a></dt>
+ <dd>En los últimos dos artículos en esta serie vamos a solidificar tu conocimiento de las herramientas para el desarrollo web construyendo una cadena de herramients. Iniciaremos configurando un ambiente de desarrollo y colocando herramentas de transformación para desplegar nuestra aplicación en Netlify. En este artículo introducimos un estudio de caso, configuramos nuestro ambiente de desarrollo y configuramos herramientas de transformación de código.</dd>
+ <dt><a href="/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Deployment">5. Desplegando nuestra aplicación</a></dt>
+ <dd>En el artículo final de esta serie, utilizamos nuestra cadena de herramientas que construimos en el artículo previo y la extendemos para desplegar nuestra aplicación muestra. Subimos nuestro código a GitHub, desplegamos usando Netlify e incluso te enseñamos a realizar una prueba en el proceso.</dd>
+</dl>
diff --git a/files/es/learn/using_github_pages/index.html b/files/es/learn/using_github_pages/index.html
deleted file mode 100644
index 81a7138430..0000000000
--- a/files/es/learn/using_github_pages/index.html
+++ /dev/null
@@ -1,103 +0,0 @@
----
-title: ¿Cómo se utiliza Github pages?
-slug: Learn/Using_Github_pages
-translation_of: Learn/Common_questions/Using_Github_pages
----
-<p class="summary"><a href="https://github.com/">GitHub</a> es un sitio "social coding". Te permite subir repositorios de código para almacenarlo en el <strong>sistema de control de versiones</strong> <a href="http://git-scm.com/">Git</a>. Tu puedes colaborar en proyectos de código, y el sistema es código abierto por defecto, lo que significa que cualquiera en el mundo puede encontrar tu código en GitHub, usarlo, aprender de el, y mejorarlo. ¡Tú puedes hacer eso con el código de otras personas tambien! Este artículo provee una guía básica para publicar contenido usando la característica gh-pages de Github.</p>
-
-<h2 id="Publicando_contenido">Publicando contenido</h2>
-
-<p>Github es una comunidad muy importante y útil para involucrarse, y Git/GitHub es un <a href="http://git-scm.com/book/en/v2/Getting-Started-About-Version-Control">sistema de control de versiones</a> muy popular — la mayoría de las empresas de tecnología ahora lo utilizan en su flujo de trabajo. GitHub tiene una característica muy útil llamada <a href="https://pages.github.com/">GitHub pages</a>, que te permite publicar el código del sitio en vivo en la Web.</p>
-
-<h3 id="Configuración_básica_de_Github"><span class="short_text" id="result_box" lang="es"><span class="hps">Configuración básica</span> de <span class="hps">Github</span></span></h3>
-
-<ol>
- <li>Primero que todo, <a href="http://git-scm.com/downloads">instala Git</a> en tu máquina. <span id="result_box" lang="es"><span class="hps">Este es el</span> <span class="hps">software del sistema</span> <span class="hps">de control de versiones</span> <span class="hps">subyacente en el que</span> <span class="hps">GitHub</span> <span class="hps">funciona</span><span>.</span></span></li>
- <li>Seguido, <a href="https://github.com/join">Regístrate para una cuenta de GitHub</a>. Es simple y fácil.</li>
- <li>Una vez te hayas registrado, inicia sesión en <a href="https://github.com">github.com</a> con tu nombre de usuario y contraseña.</li>
-</ol>
-
-<h3 id="Preparando_tu_código_para_subirlo">Preparando tu código para subirlo</h3>
-
-<p>Tú puedes almacenar cualquier código que tu quieras en un repositorio de Github, pero para usar la característica páginas de Github con pleno efecto, tu código debe estar estructurado como un sitio web típico, por ejemplo que el punto de entrada primario sea un archivo HTML llamado<code> index.html</code>.</p>
-
-<p>La otra cosa que necesitas hacer <span id="result_box" lang="es"><span class="hps">antes de seguir adelante</span> <span class="hps">es</span> <span class="hps">inicializar</span> <span class="hps">el directorio de</span> <span class="hps">código como</span> <span class="hps">un repositorio</span> <span class="hps">Git</span></span>. para hacer esto:</p>
-
-<ol>
- <li>Apunta la línea de comandos a tu directorio <code>test-site</code> (<span id="result_box" lang="es"><span class="hps">o como se</span> <span class="hps">llame</span> <span class="hps">el directorio que contiene</span> tu<span class="hps"> sitio web</span></span>). Para esto, usa el comando <code>cd</code> (Es decir "<em>cambio de</em> <em>d</em>irectorio"). Esto es lo que deberías digitar si has puesto tu sitio web en un directorio llamado <code>test-site</code> en tu escritorio:
-
-  <pre class="brush: bash">cd Desktop/test-site</pre>
- </li>
- <li>Cuando la línea comandos está apuntando hacia el interior del directorio de tu sitio web, digita el siguiente comando, que le dice a la herramienta <code>git</code> para convertir el directorio en un repositorio git:</li>
- <li>
-  <pre class="brush: bash">git init</pre>
- </li>
-</ol>
-
-<h4 id="An_aside_on_command_line_interfaces">An aside on command line interfaces</h4>
-
-<p>La mejor manera de subir tu código a Github es mediante la linea de comandos — esta es una ventana donde tú escribe <span id="result_box" lang="es"><span class="hps">comandos</span> <span class="hps">para hacer cosas como</span> <span class="hps">crear</span> <span class="hps">archivos y ejecutar programas</span></span>, en lugar de hacer clic dentro de una interfaz de usuario. Se verá algo como esto:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/9483/command-line.png" style="display: block; height: 478px; margin: 0px auto; width: 697px;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Tú también podrías considerar una <a href="http://git-scm.com/downloads/guis">interfaz gráfica de usuario de Git</a> para hacer el mismo trabajo, si te sientes incómodo con la linea de comandos.</p>
-</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Cada sistema operativo</span> <span class="hps">viene con</span> <span class="hps">una herramienta de línea</span> <span class="hps">de comandos</span><span>:</span></span></p>
-
-<ul>
- <li><strong>Windows</strong>: <strong>Command Prompt</strong> se puede acceder pulsando la tecla Windows, tipeando <em>Command Prompt</em>, Y elegirlo de la lista que aparece. Nota que Windows tiene sus propias convenciones de comando diferentes de Linux y OS X, así que los comandos abajo pueden variar en su máquina.</li>
- <li><strong>OS X</strong>: <strong>Terminal</strong> se puede encontrar en <em>Aplicaciones &gt; Utilidades</em>.</li>
- <li><strong>Linux</strong>: Por lo general, puede extraer una terminal con <em>Ctrl + Alt + T</em>. <span class="short_text" id="result_box" lang="es"><span class="hps">Si</span> <span class="hps">eso no funciona</span></span>, busca <strong>Terminal</strong> en una barra de aplicaciones o menú.</li>
-</ul>
-
-<p><span class="short_text" id="result_box" lang="es"><span class="hps">Esto puede</span> <span class="hps">parecer un poco</span> espantoso<span class="hps"> al principio</span></span>, pero no te preocupes — que pronto conseguiras la <span id="result_box" lang="es"><span class="hps">caída de</span> <span class="hps">los conceptos básicos</span></span>. Tú<span id="result_box" lang="es"><span class="hps"> le dices a</span> <span class="hps">la computadora que </span><span class="hps">haga algo en la</span> <span class="hps">terminal, digitando</span> <span class="hps">un comando y</span> <span class="hps">oprimiendo la tecla Enter</span><span>,</span> <span class="hps">como se ha visto</span> <span class="hps">anteriormente.</span></span></p>
-
-<h3 id="Creando_un_repositorio_para_tu_código">Creando un repositorio para tu código</h3>
-
-<ol>
- <li>
-  <p><span id="result_box" lang="es"><span class="hps">A continuación</span></span>, tu necesitas crear un nuevo repositorio para colocar tus archivos en el. Has clic en el signo más (+) en la parte superior derecha de la página de inicio de GitHub, luego escoge <em>Nuevo Repositorio</em>.</p>
- </li>
- <li><span class="short_text" id="result_box" lang="es"><span class="hps">En esta página,</span></span> en la caja <em>Nombre del Repositorio</em>, digita el nombre para tu repositorio de código, por ejemplo <em>my-repository</em>.</li>
- <li>También llena una descripción <span class="short_text" id="result_box" lang="es"><span class="hps">para decir lo que</span> tu <span class="hps">repositorio</span> <span class="hps">va a</span> <span class="hps">contener</span></span>. Tu pantalla debe mostrar algo como esto:<br>
-  <img alt="" src="https://mdn.mozillademos.org/files/12143/create-new-repo.png" style="display: block; height: 548px; margin: 0px auto; width: 800px;"></li>
- <li>Has Clic en <em>Crear repositorio</em>; Esto debería llevarte a la siguiente página: <br>
-  <img alt="" src="https://mdn.mozillademos.org/files/12141/github-repo.png" style="display: block; height: 520px; margin: 0px auto; width: 800px;"></li>
-</ol>
-
-<h3 id="Subiendo_tus_archivos_a_GitHub">Subiendo tus archivos a GitHub</h3>
-
-<ol>
- <li>En la página actual, tú estás interesado en la sección <em>…o empujar un repositorio existente desde la línea de comandos</em>. Tú deberias ver dos lineas de código listado en esta sección. <span class="short_text" id="result_box" lang="es"><span class="hps">Copia</span> <span class="hps">la totalidad de la</span> <span class="hps">primera</span> <span class="hps">línea</span></span>, pégala en la línea de comandos, presiona la tecla Enter. El comando debería mostrarte algo como esto:
-
-  <pre class="copyable-terminal-content js-zeroclipboard-target"><span class="user-select-contain">git remote add origin <span class="js-live-clone-url">https://github.com/chrisdavidmills/my-repository.git</span></span></pre>
- </li>
- <li><span id="result_box" lang="es"><span class="hps">A continuación</span></span>, digita los siguientes dos comandos, presionando Enter despues de cada uno. Estos preparán el código para subirlo a GitHub, y pida a GIt que administre estos archivos.
-  <pre class="brush: bash">git add --all
-git commit -m 'adding my files to my repository'</pre>
- </li>
- <li>Por último,<span class="short_text" id="result_box" lang="es"><span class="hps"> empuja el</span> <span class="hps">código</span> <span class="hps">hasta</span></span> GitHub yendo a la página de GitHub en la que estas e ingresando en la terminal el segundo de los dos comandos que vimos <em>…o empuje un repositorio existente desde la sección de línea de comandos</em>:
-  <pre class="brush: bash">git push -u origin master</pre>
- </li>
- <li>Ahora necesitas crear la rama gh-pages de tu repositorio; actualiza la página actual <span id="result_box" lang="es"><span class="hps">y verá</span> <span class="hps">una página</span> del <span class="hps">repositorio</span> <span class="hps">algo así como</span> <span class="hps">la de abajo.</span></span> Tú necesitas presionar el boton que dice <em>Branch: <strong>master</strong></em>, digita <em>gh-pages</em> en el campo de texto, luego presiona el boton azul que dice <em>Create branch: gh-pages</em>. Esto crea una rama de código especial llamada gh-pages que es publicada en una ubicación especial. La URL toma la forma <em>username.github.io/my-repository-name</em>, asi en mi caso de ejemplo, la URL debería ser <em>https://chrisdavidmills.github.io/my-repository</em>. La página mostrada es la página index.html.<br>
-  <img alt="" src="https://mdn.mozillademos.org/files/12145/repo-site.png" style="display: block; margin: 0px auto;"></li>
- <li>Navega tu dirección web de GitHub pages en un nuevo ta del navegador, y tu deberias ver tu sitio en linea! Mandalo <span id="result_box" lang="es"><span class="hps">por correo electrónico a</span> <span class="hps">tus</span> <span class="hps">amigos</span> <span class="hps">y muestra tu</span> <span class="hps">dominio</span><span>.</span></span></li>
-</ol>
-
-<div class="note">
-<p><strong>Nota</strong>: <span class="short_text" id="result_box" lang="es"><span class="hps">Si te atascas</span></span>, la <a href="https://pages.github.com/">página de inicio de GitHub Pages</a> <span class="short_text" id="result_box" lang="es"><span class="hps">también</span> <span class="hps">es</span> <span class="hps">muy</span> <span class="hps">útil</span></span>.</p>
-</div>
-
-<h3 id="Un_mayor_conocimiento_de_GitHub"><span class="short_text" id="result_box" lang="es"><span class="hps">Un mayor conocimiento</span> <span class="hps">de GitHub</span></span></h3>
-
-<p><span id="result_box" lang="es"><span>Si deseas realizar más cambios en su sitio de prueba y cargarlos en GitHub, simplemente tendrás que realizar el cambio en tus archivos como antes.</span> <span>A continuación, debes introducir los siguientes comandos (pulsando Intro después de cada uno) para empujar los cambios a GitHub</span></span>:</p>
-
-<pre>git add --all
-git commit -m 'another commit'
-git push</pre>
-
-<p>Puedes reemplazar <em>otro commit</em> con un mensaje más adecuado para describir qué cambio acaba de hacer.</p>
-
-<p>Apenas hemos arañado la superficie de Git.Para obtener más información, comience con el <a href="https://help.github.com/index.html">sitio de ayuda de GitHub</a>.</p>
diff --git a/files/es/localización/index.html b/files/es/localización/index.html
deleted file mode 100644
index def1406446..0000000000
--- a/files/es/localización/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
----
-title: Localización
-slug: Localización
-tags:
-  - Localización
-translation_of: Glossary/Localization
----
-<p>  </p>
-<div> <p>La <strong>localización</strong> es el proceso de traducción de interfaces de usuario de un lenguaje a otro y adaptación para que una cultura extranjera lo comprenda. Estos recursos tratan sobre cómo hacer aplicaciones/extensiones de Mozilla localizables.</p>
-</div>
-<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Documentaci.C3.B3n"><a href="/Special:Tags" title="Site Tags">Documentación</a></h4> <dl> <dt><a class="external" href="http://www.proyectonave.es/docs/extensiones" title="http://www.proyectonave.es/docs/extensiones">Sistema de traducción de extensiones para NAVE</a></dt> <dd><small>"Este documento tiene como principal objetivo fomentar la traducción de extensiones mediante un sistema escalable que, aunque inicialmente puede ser complicado de entender, al final, se minimiza el tiempo total empleado en generar un paquete de idioma con la traducción." </small></dd> </dl> <dl> <dt><a class="external" href="http://www.proyectonave.es/docs/instaladores" title="http://www.proyectonave.es/docs/instaladores">Creación de instaladores</a></dt> <dd><small>Este documento explica cómo hacer instaladores de productos Mozilla 100% es-ES a partir del correspondiente instalador original en-US y los paquetes de idioma es-ES más, en algunos casos, archivos adicionales de personalización es-ES.</small></dd> </dl> <dl> <dt><a href="/es/Escribir_código_localizable" title="es/Escribir_código_localizable">Escribir código localizable</a></dt> <dd><small>Esta página te explica las buenas prácticas y directrices al tratar con código UI en relación a la localización. Está dirigido a desarrolladores de Mozilla y sus extensiones.</small></dd> </dl> <dl> <dt><a class="external" href="http://kb.mozillazine.org/Localize_extension_descriptions">Localizando las descripciones de las extensiones</a></dt> <dd><small>Para localizar la descripción de una extensión (secuencia que muestra arriba y abajo el nombre de la extensión en ventanas de extensiones), necesitas utilizar una clave especial para anular la descripción especificada en su archivo install.rdf. Este artículo contiene instrucciones de cómo modificar esta tecla de preferencia.</small></dd> </dl> <p><span class="alllinks"><a href="/Special:Tags" title="Site Tags">Ver todo...</a></span></p> </td> <td> <h4 id="Comunidad">Comunidad</h4> <ul> <li><a class="external" href="http://www.proyectonave.es/" title="http://www.proyectonave.es/">El proyecto NAVE</a></li> <li><a class="external" href="http://www.babelzilla.org/forum/index.php?showforum=38">Babelzilla</a></li> <li><a class="external" href="http://www.mozillaes.org/index.php?option=com_forum&amp;Itemid=122&amp;page=viewforum&amp;f=13">Foro sobre traducciones en MozillaES</a></li> <li><a class="external" href="http://www.mozilla-hispano.org/foro/viewforum.php?f=7&amp;sid=f1ffba39f7bdd70f5f54283be1ab23ac" title="http://www.mozilla-hispano.org/foro/viewforum.php?f=7&amp;sid=f1ffba39f7bdd70f5f54283be1ab23ac">Foro sobre traducciones en Mozilla Hispano</a></li> </ul> <ul> <li>En la comunidad Mozilla... en ingles</li> </ul> <p>{{ DiscussionList("dev-l10n", "mozilla.dev.l10n") }}</p> <ul> <li> <ul> <li><a class="external" href="http://www.mozilla.org/projects/l10n/">Proyecto de localización de Mozilla</a></li> </ul> </li> </ul> <p><span class="alllinks"><a href="/es/Localización/Comunidad" title="es/Localización/Comunidad">Ver todo...</a></span></p> <h3 id="Herramientas">Herramientas</h3> <ul> <li><a class="external" href="http://kbabel.kde.org/">KBabel</a></li> <li><a class="external" href="http://wiki.mozilla.org/L10n:MozillaTranslator" title="http://wiki.mozilla.org/L10n:MozillaTranslator">MozillaTranslator</a></li> <li><a class="external" href="http://www.mozilla.org/projects/l10n/mlp_tools.html">Herramientas para la localización (en)</a></li> </ul> <p><span class="alllinks"><a href="/Special:Tags" title="Site Tags">Ver todo...</a></span></p> <h4 id="Temas_Relacionados">Temas Relacionados</h4> <dl> <dd><a href="/es/Extensiones" title="es/Extensiones">Extensiones</a>, <a href="/es/Desarrollando_Mozilla" title="es/Desarrollando_Mozilla">Desarrollando Mozilla</a>, <a href="/es/XUL" title="es/XUL">XUL</a></dd> </dl> </td> </tr> </tbody>
-</table>
-<p><span class="comment">Categorías</span></p>
-<p><span class="comment">Interwiki Language Links</span></p>
-<p>  </p>
-<p>{{ languages( { "de": "de/Lokalisierung", "en": "en/Localization", "fr": "fr/Localisation", "it": "it/Localization", "ja": "ja/Localization", "pl": "pl/Lokalizacja", "pt": "pt/Localiza\u00e7\u00e3o", "zh-tw": "zh_tw/\u672c\u5730\u5316" } ) }}</p>
diff --git a/files/es/localizar_con_narro/index.html b/files/es/localizar_con_narro/index.html
deleted file mode 100644
index 7be6efca8b..0000000000
--- a/files/es/localizar_con_narro/index.html
+++ /dev/null
@@ -1,62 +0,0 @@
----
-title: Localizar con Narro
-slug: Localizar_con_Narro
-tags:
-  - 'Localization:Tools'
-  - l10n
-  - narro
----
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Narro es una práctica herramienta web de traducción que está disponible para los localizadores de los proyectos de Mozilla. Con Narro puedes traducir las aplicaciones de Mozilla en linea y exportando los archivos en ficheros .ZIP o generando archivos .XPI (paquete de idioma) los cuales pueden ser instalados localmente para ser probados. Después de la creación de un proyecto Narro utiliza la “Memoria de traducción” (MT) de tus traducciones para aprovechar el contenido ya traducido.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">La función MT te permite centrarte en las nuevas cadenas sin traducir y no enfocandote en la re-traducción de las cadenas de las versiones previamente traducidas.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Este documento te guiará por el proceso de la creación de una nueva localización y proyecto en Narro. Usando Firefox como ejemplo, vamos a cubrir la forma en como iniciar un proyecto en Narro, como usar Narro para traducir la aplicación y como exportar tus traducciones para pruebas localmente en Firefox.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para aprender acerca de las actualizaciones y cambios del proyecto Narro vista el </span><a class=" external" href="http://narro-project.blogspot.com/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">proyecto Narro</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y el sitio de la </span><a class=" link-https" href="https://l10n.mozilla-community.org/narro/projects.php?l=bg"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">herramienta basada en web.</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> A continuación encontrarás que son un requisito previo para localizar en Narro.</span></p>
-<p> </p>
-<h2 id="Registrándose_en_Narro">Registrándose en Narro</h2>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Antes de hacer cualquier otra cosa en Narro, es necesario configurar tu cuenta de usuario. Al hacer clic en el enlace en la esquina superior derecha de la página de inicio Narro te llevará a donde puedas registrar tu cuenta de usuario. Una vez que hayas registrado y conectado, podrás ver todos los diferentes lugares disponibles para trabajar en en el menú desplegable en la esquina superior derecha.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para nuestros ejemplos, vamos a llamar a nuestra nueva localización  X-prueba. Realiza los siguientes pasos para configurar tu nueva localización.</span></p>
-<p><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Alternativamente, si tu localización no existe, ponte en contacto con tu </span><a class=" link-https" href="https://wiki.mozilla.org/Category:L10n_Teams"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">comunidad l10n</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y pregunta acerca de cómo puedes participar!</span></p>
-<ol> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Contacta con los administradores de l10n Mozilla l10n utilizando la </span><a href="/es/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">lista de distribución dev-l10n</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> para preguntar si  tu localización ya existe.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Si no existe, envía un correo electrónico a  </span><a href="/es/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">dev-l10n lista de correo</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y solicita al administrador de Narro para iniciar una nueva localización en Narro para tu localización. En tu mensaje, por favor proporciona la siguiente información:</span> <ul> <li style="list-style-type: disc; font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">       tu nombre de usuario.</span></li> <li style="list-style-type: disc; font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">       tu idioma.</span></li> <li style="list-style-type: disc; font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">       un regalo. Los productos recién horneados son siempre un buen regalo ;).</span></li> </ul> Alternativamente, si tu localización no existe, ponte en contacto con tu comunidad l10n y pregunta acerca de cómo puedes participar!</li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Después de hacer esto, debes recibir los derechos de mantenimiento (es decir, exportación, importación y permisos de aprobación) para la nueva localización.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Después de recibir estos derechos, salir y entrar de nuevo para activarlos.</span></li>
-</ol>
-<p><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">La imagen de abajo es la pantalla que verá una vez que se conecte a activar sus derechos de mantenimiento.</span></p>
-<p><a href="/@api/deki/files/5836/=manage_a_locale.png"><img alt="" class="internal default" src="/@api/deki/files/5836/=manage_a_locale.png" style="width: 1053px; height: 576px;"></a></p>
-<p> </p>
-<h2 id="Importar">Importar</h2>
-<div class="note">Nota: Si ya te has unido a algún proyecto de localización existente, puedes saltarte este paso. Es decir, a menos que estés interesado en aprender acerca de cómo funciona la utilidad de importación, en tal caso continua con este paso..</div>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Cuenta de usuario creada: Listo. Proyecto de localización creada por el administrador global: Listo. Activado los derechos de mantenimiento para tu nueva localización: Listo. ¡Felicidades, ya estás listo para importar los archivos fuentes del proyecto Firefox!. La utilidad de importación ubicada en la pestaña Import de tu proyecto Firefox, te dará varias opciones para la importación de archivos para la traducción. ¡Lo bueno de esta utilidad es que es completamente automática!. Tú solo tienes que importar manualmente los archivos fuentes y luego nunca más tienes que preocuparte por hacer esto. La utilidad de importación importa los archivos cada noche, de modo que si tu cadena fué agregada o modificada durante el día la seguirás viendo en tu lista de no traducidos hasta el día siguiente.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Ahora vamos a repasar cómo configurar la utilidad de importación en tu proyecto.</span></p>
-<p> </p>
-<ol> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> Verás una lista de enlaces de proyectos inactivos con varios nombres (</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Firefox Aurora</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">, </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Firefox Release</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">, etc.) Hazle clic en el enlace del proyecto que tu quieras activar. En este caso le hacemos clic en </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Firefox Aurora</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Por defecto, está tomada la pestaña de descripción del proyecto. Navega a la etiqueta </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Import </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">para encontrar la utilidad de importación.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Una vez ahí, encontarás estas secciones de importación:</span> <ul> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Texts.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para importar los archivos fuentes (por ejemplo desde en-US).</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Translations.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para la importación de proyectos ya existentes</span>.</li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Options.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Casillas de verificación para configurar la importación</span>.</li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Operation log.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Descripción de la función de Importación que está siendo ejecutada.</span></li> </ul> </li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Por ahora nos vamos a centrar solo en las secciones </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Texts </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">y</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> Options. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En la sección </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Texts </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">verás la localización por defecto con los archivos fuente actualizados cada noche por tu proyecto. Asegurate de que las casillas de verificación en </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Options </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">están destiqueadas para esta importación.</span></li> <li>C<span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">lic en el botón </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Import. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">El </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Operation log </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">mostrará un mensaje una vez que la importación haya sido completada satisfactoriamente.</span></li>
-</ol>
-<p><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En la imágen de abajo es lo que deberás ver cuando se complete la importación.</span></p>
-<p><a href="/@api/deki/files/5828/=Import.png"><img alt="" class="internal default" src="/@api/deki/files/5828/=Import.png" style="width: 984px; height: 532px;"></a></p>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">¡¡Ahora ya estás listo para comenzar a traducir tu proyecto!!</span></p>
-<p> </p>
-<h2 id="Traducción">Traducción</h2>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Con la nueva localización entablecida en Narro, tu puedes ahora iniciar la traducción en linea. Una forma rápida de iniciar es hacer clic en la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Translate </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">y te llevará a una pantalla con un conjunto de contenido sin traducir. Las nuevas importaciones de Firefox Aurora (como Firefox 7) contiene 5,671 cadenas en Inglés.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Irónicamente, la primera vez que comienzas a traducir podrás ver las primeras entradas algunos de los archivos </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">region.properties </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">ese archivo </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: italic; font-variant: normal; text-decoration: none; vertical-align: baseline;">no debe ser traducido</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> usando Narro. Encontrarás algunas de esas entradas a medida que avanza en la traducción. Una buena guía para ayudarte a distinguir entre las cadenas traducibles y lo no-traducibles es ver si la cadena puede ser categorizada como uno de los siguientes:</span></p>
-<ul> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Si es el nombre de un producto, no se traduce.</span></li> <li>C<span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">ualquier cadena con código puro (ej. %s), no se traduce.</span></li>
-</ul>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Cualquier cadena que no caiga dentro de esas dos categorias es traducible. Avanzar con las cadenas traducibles para iniciar la traducción.</span></p>
-<p><a href="/@api/deki/files/5832/=Texts.png"><img alt="" class="internal default" src="/@api/deki/files/5832/=Texts.png" style="width: 1106px; height: 608px;"></a></p>
-<p><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para el ejemplo de este documento empezaremos a buscar las cadenas de dos diferentes tipos de archivos (los archivos DTD y archivos property). Vamos a hacer cambios a las cadenas de modo que podrás ver el cambio en la interfaz de usuario.</span></p>
-<h3 id="Ejemplo_1_Los_archivos_DTD_searchbar.dtd">Ejemplo 1: Los archivos DTD, "searchbar.dtd"</h3>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Narro te permite buscar cadenas en particular. Para este ejemplo buscaremos el archivo DTD (a menudo se llama una entidad) llamado </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">searchbar.dtd </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">que contiene la cadena </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines... </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Tu puedes </span><span style="font-size: 12pt; font-family: Arial; color: #333333; background-color: #f5f5f5; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">encontrar fácilmente esta cadena en la interfaz de usuario del navegador al hacer clic en el menú desplegable en el cuadro de búsqueda en la esquina superior derecha de tu navegador. Echa un vistazo a la imagen de abajo. En la parte inferior de la lista de botones de búsqueda que aparece podrás ver </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines...</span></p>
-<p><a href="/@api/deki/files/5837/=Add_%25252525S.png"><img alt="" class="internal default" src="/@api/deki/files/5837/=Add_%25252525S.png"></a></p>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Así es como podrás usar Narro para traducir el elemento </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines...</span></p>
-<p dir="ltr" style="text-indent: 36pt; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">1. Navega en la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Translate </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">dentro del proyecto Firefox Aurora.</span></p>
-<p dir="ltr" style="text-indent: 36pt; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">2. Ingresa la cadena “Manage Search Engines... ” en el campo </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Search for</span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y da clic en </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Search.</span></p>
-<p><br> <span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Después de ingresar en la cadena y haciendo clic en “Search”, Narro te muestra la cadena que estabas buscando.</span></p>
-<p><a href="/@api/deki/files/5833/=Manage_Search_Engines.png"><img alt="" class="internal default" src="/@api/deki/files/5833/=Manage_Search_Engines.png" style="width: 1109px; height: 250px;"></a></p>
-<p style="margin-left: 40px;"><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">3. Clic en el cuadro de texto debajo del resultado de búsqueda. Esto ampliará el cuadro de texto y lo resaltará en verde para mostrar el registro activo.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">4. Entra en la traducción y presiona el botón save.</span></p>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En el ejemplo de abajo verás el elemento  </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines... </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">que ha sido traducido a </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">MANAGE SEARCH ENGINES</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Verás también debajo del ícono de guardado que existen dos cadenas adicionales. Estos son mostrados desde una traducción anterior y desde otras traducciones que miembros de tu comunidad pueden haber proporcionado. Los botones verdes y rojos a la derecha te permiten aprobar o eliminar una traducción de la entrada activa. Una traducción aprobada es introducida en la memoria de traducción. No recomendamos aprobar traducciones hasta que estén en su estado final. Para nuestro ejemplo guardas la cadena haciendo clic en el ícono de guardado verde que está a la derecha.</span></p>
-<p><a href="/@api/deki/files/5831/=approved_translation.png"><img alt="" class="internal default" src="/@api/deki/files/5831/=approved_translation.png" style="width: 1109px; height: 345px;"></a></p>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">A medida que traduces estos tipos de archivos DTD, puedes exportar periódicamente un archivo .xpi (también conocido como paquete de idioma) que puedes instalar en Firefox. Hablaremos sobre como hacerlo en una sección posterior de este manual. La próxima vez que instales el paquete de idioma de prueba, verás la cadena  "MANAGE SEARCH ENGINES"  traducida en la interfaz de tu versión local de Firefox.</span></p>
-<h3 id="Ejemplo_2_Los_Archivos_Property_search.properties">Ejemplo 2: Los Archivos Property, "search.properties"</h3>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Los archivos Properties search.properties contienen la cadena </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Add %S. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Puedes encontrar facilmente esta cadena en la interfaz del navegador visitando un sitio web que procea de un plugin de búsqueda (como </span><a href="../"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">http://developer.mozilla.org/</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">) y haciendo clic en el menú desplegable  en la caja de búsqueda en la esquina superior derecha del navegador. Dale un vistazo a la imagen de abajo. Ahí verás el </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Add %S, </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">donde </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">%S </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">es reemplazado por el nombre del sitio.</span></p>
-<p><a href="/@api/deki/files/5837/=Add_%25252525S.png"><img alt="" class="internal default" src="/@api/deki/files/5837/=Add_%25252525S.png"></a></p>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Traducir las cadenas de los archivos Property es exactamente lo mismo que traducir los archivos DTD. Pero este ejemplo en particular simplemente se refiere a los pasos del ejemplo uno, reemplazando la cadena  “Administar motores de búsqueda...” con el “Add %S” . Al igual que con el archivo DTD tu puedes exportar periodicamente un archivo .xpi que puedes instalar en Firefox para ver tus cadenas traducidas guardadas. </span></p>
-<h2 id="Exportando_un_paquete_de_idioma_.xpi">Exportando un paquete de idioma .xpi</h2>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Felicidades! ahora que ya has traducido y guardado varias cadenas, vamos a exportar esas cadenas traducidas para que veas tus traducciones en tu navegador Firefox Aurora.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">La utilidad de exportación en la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">te dá algunas opciones diferentes para la exportación. Algunas opciones son para probar tus traducciones, otras son para que tu traducción final aprobadas que serán incorporadas en la próxima versión de Firefox. Para nuestro ejemplo, nos vamos a concentrar en exportar tu traducción paquete de idioma .xpi</span></p>
-<ol> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Ir a la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En la siguiente imágen se ilustra lo que verás cuando estés en esta pestaña</span> <p> </p> <p><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><a href="/@api/deki/files/5834/=export.png"><img alt="" class="internal default" src="/@api/deki/files/5834/=export.png" style="width: 1076px; height: 291px;"></a></span></p> </li> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Seleccionar la opción </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Approved suggestion </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">del menú desplegable </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export translations using</span></li> <li>C<span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">lic en el botón </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export.</span></li> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Una vez la barra de estado esté completa, verás que te aparecen los enlaces .zip, .html, y .xpi. Dale clic en el enlace .xpi para guardarlo en tu disco.</span></li>
-</ol>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">El paquete de idioma .xpi es construido cada vez que tu exportas tu traducción. Todas las cadenas no traducidas son exportadas en en-US  como parte de tu paquete de idioma. Esto te permitirá que vayas probando el progreso de tu trabajo sobre la marcha.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Cuando exportas archivos, la estructura del código fuente de Mozilla se conserva. En cualquier momento durante la traducción, puedes exportar el paquete en-US.zip por si quieres ver la estructura del código fuente de Firefox de los archivos con cadenas en-US.</span></p>
-<div class="warning">Aviso: No usar el comando <code>hg push</code> ya que esto es sólo para pruebas locales.</div>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para saber como probar tu reciente paquete de idioma exportado, visita el tema </span><a href="../en/Create_a_new_localization#Testing_your_language_pack"><span style="font-size: 11pt; font-family: Courier New; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">Testing your language pack</span></a><span style="font-size: 11pt; font-family: Courier New; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">  </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">en la wiki de</span><a href="../en/Create_a_new_localization"><span style="font-size: 11pt; font-family: Courier New; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">Create a new localization</span></a></p>
-<p> </p>
-<h2 id="Exportación_Final">Exportación Final</h2>
-<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Una vez que has completado tu traducción, </span><a class=" link-https" href="https://wiki.mozilla.org/L10n:Becoming_an_Official_Localization#Preparation"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">revísala y pruébala</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y será el momento para hacer la exportación final (en formato .zip) para enviarlo a Mozilla. Para hacer esto envía un email a la </span><a class=" external" href="http://mailto:dev-l10n@lists.mozilla.org/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">lista de correo dev-l10n </span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">o al administrador global de Narro pidiendo asistencia. </span></p>
-<div class="note">Por favor ten en cuenta que el Mozilla l10n-drivers ha producido el <a class=" link-https" href="https://l10n-stage-sj.mozilla.org/dashboard/"><span style="font-size: 12pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">l10n dashboard</span></a> para seguir el progreso de todas las localizaciones de Mozilla. Esto está basado en una poderosa herramienta llamada<a href="../en/Compare-locales"><span style="font-size: 12pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">Compare-Locales</span></a>. Si tu eliges utilizar Narro para tu localización, sé conciente de que narro invalida el dashboard de seguimiento de presición  del proyecto debido a la forma en que Narro maneja las cadenas y las exporta.</div>
diff --git a/files/es/mdn/at_ten/index.html b/files/es/mdn/at_ten/index.html
new file mode 100644
index 0000000000..a5735ff01c
--- /dev/null
+++ b/files/es/mdn/at_ten/index.html
@@ -0,0 +1,40 @@
+---
+title: MDN en 10
+slug: MDN/At_ten
+tags:
+  - MDN
+translation_of: MDN_at_ten
+original_slug: MDN_en_diez
+---
+<div class="summary">Celebra 10 años documentando tu Web.</div>
+
+<div class="column-container">
+<div class="column-8">
+<h2 id="La_historia_de_MDN_(Mozilla_Developers_Network)">La historia de MDN (Mozilla Developers Network)</h2>
+
+<p>A principios de 2005 , un grupo pequeño de idealistas se propuso a crear una nueva, libre, comunidad en línea de recursos para todos los desarrolladores Web. Su brillante pero poco excentrica idea se convirtió en la actual Mozilla Developer Network (MDN) - el principal recurso para todas las tecnologías Web abiertas. Diez años más tarde, nuestra comunidad mundial es más grande que nunca, y juntos todavía estamos creando documentación , código de ejemplo y recursos de aprendizaje para todas las tecnologías Web abiertas, incluyendo CSS , HTML , JavaScript y todo lo demás que hace que la web abierta tan poderoso como lo es.</p>
+
+<p><a class="learnmore" href="/en-US/docs/MDN_at_ten/History_of_MDN">Aprende más<span class="offscreen">about the history</span></a></p>
+
+
+<h2 id="Contribuyendo_a_MDN">Contribuyendo a MDN</h2>
+
+<p>Por diez años, la comunidad MDN ha estado documentando la Web abierta. Desde la reparación de los errores tipográficos simples hasta escribir suites completas de una nueva API, todo el mundo tiene algo que ofrecer y ninguna contribución es demasiado grande o demasiado pequeño. Contamos con más de 90.000 páginas de contenido que se han escrito o traducidos por miembros de nuestra destacada comunidad de Mozillians . Tú puedes ser uno de ellos.</p>
+
+<p><a class="learnmore" href="/en-US/docs/MDN_at_ten/Contributing_to_MDN">Aprende más<span class="offscreen">about contributing</span></a></p>
+
+<p> </p>
+
+<p> </p>
+</div>
+
+<div class="column-4">{{TenthCampaignQuote}}</div>
+
+<h2 id="Subnav">Subnav</h2>
+
+<ol>
+ <li><a href="/en-US/docs/MDN_at_ten/">MDN en 10</a></li>
+ <li><a href="/en-US/docs/MDN_at_ten/History_of_MDN">La historia de MDN</a></li>
+ <li><a href="/en-US/docs/MDN_at_ten/Contributing_to_MDN">Contribuyendo a MDN</a></li>
+</ol>
+</div>
diff --git a/files/es/mdn/comunidad/index.html b/files/es/mdn/comunidad/index.html
deleted file mode 100644
index fd3abc7f28..0000000000
--- a/files/es/mdn/comunidad/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: Únete a la comunidad de MDN web docs
-slug: MDN/Comunidad
-tags:
-  - Comunidad
-  - Documentación
-  - Guía
-  - Proyecto MDC
-translation_of: MDN/Community
----
-<div>{{MDNSidebar}}</div>
-
-<div>{{IncludeSubnav("/es/docs/MDN")}}</div>
-
-<div class="summary">
-<p>La documentación de la web de MDN (MDN web docs) es más que un wiki: Es una comunidad de desarrolladores que trabajan unidos para hacer que MDN sea un excelente recurso para todos los desarrolladores que usen cualquier tecnología de la Open Web.</p>
-</div>
-
-<p>Nos gustaría mucho que contribuyeras a MDN, pero nos encantaría si además de contribuir participaras en la comunidad de MDN. Aquí te explicamos cómo ponerte en contacto en tres sencillos pasos:</p>
-
-<ol>
- <li><a href="/es/docs/MDN/Contribute/Howto/Crear_cuenta_MDN">Crear cuenta MDN</a>.</li>
- <li><a href="/en-US/docs/MDN/Community/Conversations">Join in conversations (aun no disponible en español)</a>.</li>
- <li><a href="/es/docs/Project:MDN/Contribuyendo/Siga_lo_que_está_pasando">Siga lo que está pasando</a>.</li>
-</ol>
-
-<h2 id="Cómo_funciona_la_comunidad">Cómo funciona la comunidad</h2>
-
-<p>Aquí encontraras más artículos que describen a la comunidad de MDN.</p>
-
-<div class="row topicpage-table">
-<div class="section">
-<dl>
- <dt class="landingPageList"><a href="/en-US/docs/MDN/Community/Roles">Community roles</a></dt>
- <dd class="landingPageList">No disponible en español por el momento.</dd>
- <dt class="landingPageList"><a href="/en-US/docs/MDN/Community/Doc_sprints">Doc sprints</a></dt>
- <dd class="landingPageList">No disponible en español por el momento</dd>
- <dt class="landingPageList"><a href="/es/docs/Project:MDN/Contribuyendo/Siga_lo_que_está_pasando">Siga lo que está pasando</a></dt>
- <dd class="landingPageList">MDN es auspiciado por <a class="external" href="https://wiki.mozilla.org/MDN"> La comunidad de la red de desarrolladores de Mozilla</a>. Aquí encontraras algunas maneras por las cuales compartimos información acerca de lo que estamos haciendo.</dd>
-</dl>
-
-<dl>
-</dl>
-</div>
-
-<div class="section">
-<dl>
- <dt class="landingPageList"><a href="/en-US/docs/MDN/Community/Conversations">MDN community conversations</a></dt>
- <dd class="landingPageList">no disponible en español por el momento</dd>
- <dt class="landingPageList"><a href="/es/docs/MDN/Contribute/Community">Trabajar con nuestra comunidad</a></dt>
- <dd class="landingPageList">Una gran parte de contribuir a la documentación de MDN en cualquier aspecto es saber cómo trabajar dentro de la comunidad MDN. Este artículo te ofrece tips para ayudarte a aprovechar las interacciones con otros colaboradores y con los equipos de desarrolladores.</dd>
-</dl>
-</div>
-</div>
diff --git a/files/es/mdn/contribute/community/index.html b/files/es/mdn/contribute/community/index.html
deleted file mode 100644
index a80a67a1b4..0000000000
--- a/files/es/mdn/contribute/community/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: Trabajando con nuestra comunidad
-slug: MDN/Contribute/Community
-tags:
-  - Comunidad
-  - Guía
-  - MDN Meta
-translation_of: MDN/Community/Working_in_community
----
-<div>{{MDNSidebar}}</div>
-
-<p>Lo más importante para contribuir a la documentacion de MDN en cualquier escala es saber trabajar como parte de una comunidad. Este artículo brinda tips que te ayudarán a sacarle el máximo partido a tus interacciones con documentadores y el equipo de desarrolladores.</p>
-
-<h2 id="Reglas_generales_de_comportamiento.">Reglas generales de comportamiento.</h2>
-
-<p>Aquí encontraras algunas reglas generales de conducta para cuando trabajes en la comunidad Mozilla.</p>
-
-<ul>
- <li>¡Se cortés! Incluso cuando no estés acuerdo, todos tenemos la misma misión: el mejoramiento de la Web.</li>
- <li>Pide, no exijas. Es mucho más probable que las personas sean útiles y receptivas cuando solicita ayuda cortésmente en lugar de exigirla. Si bien el trabajo de documentación es importante, y nuestra comunidad de desarrolladores lo sabe, el instinto humano tiende a hacer que las personas sean agresivas y difíciles si no las tratas con el debido respeto.</li>
- <li>Equilibra tu necesidad de información con la urgencia de la documentación y el tiempo que los demás participantes en tu discusión dedican a ayudarte. No sigas presionando para obtener más y más detalles si no es terriblemente urgente y necesario, hasta el punto de volver locos a los demás involucrados en la conversación.</li>
- <li>Ten en cuenta que tu solicitud toma un tiempo valioso de las personas con las que estás contactando, así que asegúrate de aprovechar bien su tiempo.</li>
- <li>Se consciente de las diferencias culturales. Mozilla es un equipo multinacional y multicultural, así que cuando hables con alguien cuya cultura sea  o pueda ser, diferente a la tuya, ten en cuenta eso mientras se comuniquen.</li>
- <li>Inicia una conversacion nueva en vez de entrometerte en una existente. No pongas tus preguntas en una conversación sin relacion solo porque la gente con la que necesitas hablar está prestándole atención; mientras que esto podría ser conveniente para ti, esto puede molestar a las personas con las que intentas hablar, dando lugar a una experiencia lejos de ser ideal.</li>
- <li>Evita {{interwiki("wikipedia", "bikeshedding")}} (trivialidad). No permitas que tu entusiasmo se transforme en una molesta pedanteria, esto hace las conversaciones desenfocadas y engorrosas.</li>
-</ul>
-
-<h2 id="Se_cortés">Se cortés</h2>
-
-<p>Siempre se diplomático y respetuoso cuando te comuniques con los demás.</p>
-
-<h3 id="Señalando_errores_cortésmente">Señalando errores cortésmente</h3>
-
-<p>Si tu propósito al contactar a alguien es pedirle que haga algo diferente o señalar un error que ha estado cometiendo (especialmente si lo hace repetidamente), comienza tu mensaje con un comentario positivo. Esto suaviza el golpe, por así decirlo, y demuestra que estás tratando de ayudar, en lugar de convertirte en 'el malo de la película'.</p>
-
-<p>Por ejemplo, si un colaborador nuevo ha estado creando muchas páginas sin etiquetas y te gustaría señalar este problema, tu mensaje podría verse así (las cosas que necesita cambiar para cada caso están subrayadas) :</p>
-
-<blockquote>
-<p>Hola, <u>MrBigglesworth</u>, he notado sus contribuciones <u>a la documentación de la API de Wormhole</u>, ¡y es fantástico contar con su ayuda! Me gusta especialmente <u>la forma en que equilibraste tu nivel de detalle con la legibilidad</u>. Dicho esto, sin embargo, podría hacer que estos artículos sean aún mejores y más útiles si <u>agrega las etiquetas correctas a las páginas</u> sobre la marcha.</p>
-
-<p><u>Consulte la guía de etiquetado de MDN (https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Tag) para obtener más detalles.</u></p>
-
-<p>Gracias de nuevo y espero sus futuras contribuciones.</p>
-</blockquote>
-
-<h2 id="Intercambiando_conocimiento">Intercambiando conocimiento</h2>
-
-<p>Al participar en el proyecto MDN, es útil saber lo que está pasando e interactuar con otros los demas miembros de nuestra comunidad. Al hacer esto, puedes compartir ideas, actualizaciones de estado y más. Además contamos con recursos y herramientas para ayudarte a saber que se está haciendo y por quiénes.</p>
-
-<h3 id="Canales_de_comunicación">Canales de comunicación</h3>
-
-<p>Existen varias formas en las que puedes participar con los miembros de la comunidad, ya sea con documentadores o desarrolladores, cada uno de los cuales tiene sus propias reglas de comportamiento.</p>
-
-<h4 id="Discourse_en_Inglés">Discourse (en Inglés)</h4>
-
-<p>El foro <a href="https://discourse.mozilla.org/c/mdn">MDN Discourse </a>es un buen lugar para hacer preguntas generales sobre la contribución a MDN y empezar discusiones.</p>
-
-<h4 id="Chat_en_Inglés">Chat (en Inglés)</h4>
-
-<p>Utiliza el sistema de chat Matrix para contactar con personas en tiempo real. Los miembros del personal de MDN están disponibles en la sala de <a href="https://chat.mozilla.org/#/room/#mdn:mozilla.org">MDN Web Docs </a> y están activos durante los días laborales en Europa y América del Norte. Explora las otras salas de chat para encontrar personas involucradas en temas que te interesen.</p>
-
-<h4 id="GitHub_en_Inglés">GitHub (en Inglés)</h4>
-
-<p>Si encuentras un problema en MDN, o deseas hacer una pregunta, ¡puedes presentar un problema en nuestro <a href="https://github.com/mdn/sprints/issues">repo de GitHub</a>! Luego serán evaluados y procesados en algún momento en el futuro.</p>
-
-<h4 id="Bugzilla">Bugzilla</h4>
-
-<p>Cuando escribes documentacion para cubrir los cambios implementados como consecuencia de un error en Bugzilla, podrás interactuar en ocasiones con las personas involucradas en estos errores. ¡Asegurate de tener <a href="https://bugzilla.mozilla.org/page.cgi?id=etiquette.html" title="https://bugzilla.mozilla.org/page.cgi?id=etiquette.html">guía de comportamiento Bugzilla</a> en mente todo el tiempo!</p>
-
-<h4 id="Email">Email</h4>
-
-<p>En ocasiones, el intercambio de correo electrónico privado entre tú y una o más personas es el camino a seguir, si tienes su dirección de correo electronico.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Como regla general, si alguien a publicado su email en los documentos sobre la tecnología que estás documentando, te ha dado su correo, o es un correo muy conocido, un correo es un buen medio para realizar el "primer contacto". Si tienes que buscarlo, probablemente deberías intentar obtener permiso para Discourse o una lista de correo primero, a menos que hayas agotado todos los demás recursos para ponerte en contacto.</p>
-</div>
-
-<h3 id="Estado_del_contenido">Estado del contenido</h3>
-
-<p>Tenemos varias herramientas útiles que te proporcionan información sobre el estado de la documentación.</p>
-
-<dl>
- <dt><a href="/dashboards/revisions">Tablero de revisión</a></dt>
- <dd>Esta es una herramienta fantástica para la revisión de los cambios realizados  en el contenido de MDN. Puedes ver el historial, seleccionar un rango de tiempo para ver, y filtrar por cosas como la configuración regional, nombre del contribuyente, y tema. Una vez que estés viendo la serie de revisiones, puedes ver los cambios realizados en cada una de ellas, abrir rápidamente la pagina, ver el historial completo o revertir cambios  (si tienes los permisos).</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/MDN/Doc_status/Overview">Visión general del estado de la documentación</a></dt>
- <dd>Nuestra pagina de <a href="https://developer.mozilla.org/en-US/docs/MDN/Doc_status/Overview">vista del estado de documentación</a> provee una lista de todas las áreas de MDN que se han configurado para el seguimiento de estado, con información de algunas páginas y los diferentes trabajos que se necesitan. Haz click en un área en particular y mira un listado de los contenidos que necesitan trabajo, como páginas que no tienen etiquetas, o etiquetas que requieren cierto trabajo. Puedes ver una lista de páginas que no se han actualizado hace mucho tiempo, están desactualizados, o una lista de los errores encontrados y cómo han afectado a la documentación en esa área.</dd>
- <dt><a href="/en-US/docs/MDN/Plans">Los planes del proyecto de documentación</a></dt>
- <dd>Tenemos una serie de proyectos de escritura que se encuentran en etapa de planificación, o son grandes y se encuentran en curso, para los que se han escrito los documentos de planificación y así tener un registro de lo que tenemos que hacer.</dd>
- <dt><a href="https://tree.taiga.io/project/viya-mdn-durable-team">MDN Taiga (en Inglés)</a></dt>
- <dd>Los redactores del personal de MDN utilizan una herramienta llamada Taiga para gestionar proyectos de documentación actuales y futuros. Puedes echar un vistazo para ver lo que estamos haciendo y cómo va, también puedes ver qué proyectos nos gustaría que sucedan pronto. Algunos de ellos serán asumidos por escritores del personal, ¡pero no dudes en hacerte cargo de uno si lo deseas! Para obtener más información sobre los procesos ágiles que sigue el equipo de MDN, consulta nuestra página de procesos en la <a href="https://wiki.mozilla.org/Engagement/MDN_Durable_Team/Processes"> wiki de Mozilla.</a></dd>
-</dl>
-
-<h2 id="La_comunidad_de_desarrollo">La comunidad de desarrollo</h2>
-
-<p>Posiblemente las relaciones más importantes para desarrollar y mantener, como miembro de la comunidad de la escritura MDN, son las que mantengas  con los desarrolladores. Ellos crean el software que estamos desarrollando, pero también son la fuente más útil de información que tenemos. Es crucial que mantengamos buenas relaciones con los desarrolladores, ¡así es más probable que respondan a tus preguntas de forma rápida, precisa y adecuada!</p>
-
-<p>Además, representas a la comunidad de escritura MDN. Por favor, ayuda a asegurar que mantengamos nuestra excelente relación de trabajo con el equipo de desarrollo haciendo que cada interacción que tengan con el equipo de escritura sea la mejor posible.</p>
-
-<p>En una nota relacionada, una gran manera de encontrar a la persona adecuada para hablar es mirar la <a href="https://wiki.mozilla.org/Modules">lista de propietarios del módulo</a>.</p>
-
-<h2 id="La_comunidad_de_escritura">La comunidad de escritura</h2>
-
-<p>La comunidad de la escritura es grande. Mientras que el número de contribuyentes frecuentes o de gran escala es relativamente pequeño, hay muchas docenas o cientos de personas que contribuyen al menos de vez en cuando. Afortunadamente, se trata de personas impresionantes, con un amor genuino por la Web, Mozilla, y/o la documentación, además, la interacción con ellos es casi siempre bastante fácil.</p>
-
-<p>Mira el articulo <a href="/en-US/docs/MDN/Community" title="/en-US/docs/Project:MDN/Contributing/Join_the_community">Únete a la comunidad</a> para mas información acerca de la comunidad MDN.</p>
-
-<p> El lugar donde más frecuentemente podrás interactuar directamente con otros escritores es en el foro <a href="https://discourse.mozilla.org/c/mdn">Discourse.</a></p>
-
-<p><span id="result_box" lang="es"><span>Teniendo en cuenta la</span></span> {{anch("Guía general de comportamiento")}} , usted notará que las cosas salen bien por lo general.</p>
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Project:MDN/Contributing" title="/en-US/docs/Project:MDN/Contributing">Contribuyendo con MDN</a></li>
- <li><a href="/en-US/docs/Project:MDN/Contributing/Join_the_community" title="/en-US/docs/Project:MDN/Contributing/Join_the_community">Comunidad MDN</a></li>
- <li><a href="http://matt.might.net/articles/how-to-email/" title="http://matt.might.net/articles/how-to-email/">Cómo enviar y respoder un email</a></li>
- <li><a href="http://blog.gerv.net/2012/10/how-to-be-a-mozillia/">Cómo ser un Mozillian</a></li>
-</ul>
diff --git a/files/es/mdn/contribute/howto/crear_cuenta_mdn/index.html b/files/es/mdn/contribute/howto/crear_cuenta_mdn/index.html
deleted file mode 100644
index 8e254f6ac0..0000000000
--- a/files/es/mdn/contribute/howto/crear_cuenta_mdn/index.html
+++ /dev/null
@@ -1,32 +0,0 @@
----
-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/plantilla_propiedad/index.html b/files/es/mdn/contribute/howto/document_a_css_property/plantilla_propiedad/index.html
deleted file mode 100644
index a0bdd5267f..0000000000
--- a/files/es/mdn/contribute/howto/document_a_css_property/plantilla_propiedad/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-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/etiquetas_paginas_javascript/index.html b/files/es/mdn/contribute/howto/etiquetas_paginas_javascript/index.html
deleted file mode 100644
index 42edc03ff0..0000000000
--- a/files/es/mdn/contribute/howto/etiquetas_paginas_javascript/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-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/remover_macros_experimentales/index.html b/files/es/mdn/contribute/howto/remover_macros_experimentales/index.html
deleted file mode 100644
index 25ee6439cd..0000000000
--- a/files/es/mdn/contribute/howto/remover_macros_experimentales/index.html
+++ /dev/null
@@ -1,48 +0,0 @@
----
-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
deleted file mode 100644
index 454da031a0..0000000000
--- a/files/es/mdn/contribute/howto/revision_editorial/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-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
deleted file mode 100644
index e1fc2d5d5a..0000000000
--- a/files/es/mdn/contribute/howto/revision_tecnica/index.html
+++ /dev/null
@@ -1,44 +0,0 @@
----
-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
deleted file mode 100644
index 26f62b04a2..0000000000
--- a/files/es/mdn/contribute/howto/set_the_summary_for_a_page/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-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/usar_barras_laterales_de_navegación/index.html b/files/es/mdn/contribute/howto/usar_barras_laterales_de_navegación/index.html
deleted file mode 100644
index 4ba8e4e4e4..0000000000
--- a/files/es/mdn/contribute/howto/usar_barras_laterales_de_navegación/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-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_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
deleted file mode 100644
index 05d72dd7f7..0000000000
--- a/files/es/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-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>
diff --git a/files/es/mdn/contribute/procesos/index.html b/files/es/mdn/contribute/procesos/index.html
deleted file mode 100644
index a408f11fb7..0000000000
--- a/files/es/mdn/contribute/procesos/index.html
+++ /dev/null
@@ -1,14 +0,0 @@
----
-title: Procesos de documentación
-slug: MDN/Contribute/Procesos
-tags:
-  - Landing
-  - MDN Meta
-  - Procesos
-translation_of: MDN/Contribute/Processes
----
-<div>{{MDNSidebar}}</div><div>{{IncludeSubnav("/es/docs/MDN")}}</div>
-
-<p>El proyecto de Documentación MDN es enorme; hay un sinfín de teconologías que cubrimos a través de la asistencia de cientos de colaboradores de todo el mundo. Para ayudarnos a llevar orden al caos, tenemos procesos estandarizados para seguir cuando se trabaja en tareas específicas relacionadas con la documentación. Aquí encontrarás guías para estos procesos.</p>
-
-<p>{{LandingPageListSubPages()}}</p>
diff --git a/files/es/mdn/contribute/processes/index.html b/files/es/mdn/contribute/processes/index.html
new file mode 100644
index 0000000000..ab80694054
--- /dev/null
+++ b/files/es/mdn/contribute/processes/index.html
@@ -0,0 +1,15 @@
+---
+title: Procesos de documentación
+slug: MDN/Contribute/Processes
+tags:
+  - Landing
+  - MDN Meta
+  - Procesos
+translation_of: MDN/Contribute/Processes
+original_slug: MDN/Contribute/Procesos
+---
+<div>{{MDNSidebar}}</div><div>{{IncludeSubnav("/es/docs/MDN")}}</div>
+
+<p>El proyecto de Documentación MDN es enorme; hay un sinfín de teconologías que cubrimos a través de la asistencia de cientos de colaboradores de todo el mundo. Para ayudarnos a llevar orden al caos, tenemos procesos estandarizados para seguir cuando se trabaja en tareas específicas relacionadas con la documentación. Aquí encontrarás guías para estos procesos.</p>
+
+<p>{{LandingPageListSubPages()}}</p>
diff --git a/files/es/mdn/contribute/tareas/index.html b/files/es/mdn/contribute/tareas/index.html
deleted file mode 100644
index 225d69bf1d..0000000000
--- a/files/es/mdn/contribute/tareas/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Cosas para hacer en MDN
-slug: MDN/Contribute/Tareas
-translation_of: MDN/Contribute/Getting_started
-translation_of_original: MDN/Contribute/Tasks
----
-<div>{{MDNSidebar}}</div><p>¿Estás buscando formas de ayudar a mejorar MDN? Hay muchas formas de ayudar: desde corregir errores tipográficos hasta escribir nuevo contenido, o incluso ayudar a desarrollar la plataforma <a href="/en-US/docs/Project:MDN/Kuma">Kuma</a> en la que se construye el sitio web. La <a href="/en-US/docs/Project:MDN/Contributing">guía para el contribuyente de MDN</a> cubre todas las formas en las que puedes ayudar y cómo hacerlo. Más abajo, encontrarás listas de tareas más específicas que faltan hacer.</p>
-<p>Hay un montón de cosas que puedes hacer para ayudar en MDN. Tenemos una guía para las tareas que puedes llevar a cabo como parte de nuestro artículo <a href="/en-US/docs/MDN/Getting_started#Possible_task_types">Comenzando en MDN</a>. Entre las posibles formas de ayudar se encuentran:</p>
-<ul>
- <li><a href="/es/docs/MDN/Contribute/revisi%C3%B3n_art%C3%ADtulos">Revisar el contenido para mayor precisión</a> (técnica o editorial)</li>
- <li><a href="/en-US/docs/MDN/Contribute/Howto/Tag">Actualizar etiquetas en las páginas</a> para mejorar los resultados de búsqueda y generación de la lista de contenidos</li>
- <li><a href="/en-US/docs/MDN/User_guide/Writing#Adding_a_new_page">Escribir nuevos artículos</a></li>
- <li><a href="/en-US/docs/MDN/User_guide/Writing#Editing_an_existing_page">Actualizar articulos existentes</a> con nueva información, o corregir errores en la información existente</li>
- <li><a href="/en-US/docs/MDN/Contribute/Howto/Convert_code_samples_to_be_live">Convertir los ejemplos existentes para usarlos en el sistema de muestra en vivo</a></li>
- <li><a href="/en-US/docs/MDN/Contribute/Editor/Live_samples">Agregar nuevos códigos de muestra en vivo para que la gente pueda ver el código en acción</a></li>
- <li><a href="/en-US/docs/Project:MDN/Kuma/Contributing">Ayudar a desarrollar la plataforma Kuma en la que se ejecuta MDN </a></li>
-</ul>
-<p>Para más ideas acerca de cosas en las que puedes colaborar con MDN, vé nuestras <a href="/en-US/docs/MDN/Contribute/Howto">Guías de cómo hacerlo</a>. Puedes encontrar listas de páginas categorizadasque necesitan de tu ayuda en nuestra sección de  <a href="/en-US/docs/MDN/Doc_status/Overview">Estado de la Documentación</a>.</p>
diff --git a/files/es/mdn/guidelines/content_blocks/index.html b/files/es/mdn/guidelines/content_blocks/index.html
deleted file mode 100644
index 7791d33e06..0000000000
--- a/files/es/mdn/guidelines/content_blocks/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: Bloques de contenido
-slug: MDN/Guidelines/Content_blocks
-tags:
-  - MDN
-  - Meta
-translation_of: MDN/Guidelines/CSS_style_guide
-translation_of_original: MDN/Structures/Content_blocks
----
-<div>{{MDNSidebar}}</div><div class="summary">
- <p>This pages lists reusable content blocks.</p>
-</div>
-<h2 id="Grilla_de_tarjetas">Grilla de tarjetas</h2>
-<p>Permite tener un par de tarjetas cercanas entre sí para llamar a contenidos específicos o para llamar a una acción. La clase CSS es: <code>.card-grid </code>(L 751 - 824 in CustomCSS).</p>
-<ul class="card-grid">
- <li><span>Refetencia CSS</span>
-  <p>Una <a href="/en-US/docs/Web/CSS/Reference" title="en-US/docs/CSS/CSS_Reference">referencia exhaustiva</a> para <u>desarrolladores Web expertos</u> describiendo cada propiedad y concepto de CSS.</p>
- </li>
- <li><span>Tutorial CSS</span>
-  <p>Una <a href="/en-US/docs/CSS/Getting_Started" title="en-US/docs/CSS/Getting_Started">introduccion paso a paso</a> para ayudar a los <u>principiantes</u>. Presenta todos los fundamentos necesarios.</p>
- </li>
- <li><span>CSS3 Demos</span>
-  <p>A <a href="/en-US/demos/tag/tech:css3" title="https://developer.mozilla.org/en-US/demos/tag/tech:css3">collection of demos</a> showing the <u>latest CSS technologies</u> in action: a boost for the creativity.</p>
- </li>
-</ul>
-<h2 id="Dos_columnas">Dos columnas</h2>
-<p>Dos columnas separadas con un borde gris. Normalmente usadas en páginas de destino. Clase de CSS: <code>.topicpage-table</code> (L 830 - 837 &amp; 82-93 in CustomCSS).</p>
-<div class="row topicpage-table">
- <div class="section">
-  Columna 1</div>
- <div class="section">
-  Columna 2</div>
-</div>
-<p> </p>
-<h2 id="Columnas_con_la_misma_altura">Columnas con la misma altura</h2>
-<p>Se usa en la página de destino de <a href="/en-US/Firefox_OS">Firefox OS</a> para envolver las columnas que deberían tener el mismo alto. Clase de CSS: <code>.equalColumnHeights</code> (L 25 - 38 in CustomCSS).</p>
-<div class="equalColumnHeights">
- <div class="zone-callout">
-  Un Texo<br>
-  y nueva linea<br>
-   </div>
- <div class="zone-callout">
-  Otro texto<br>
-  <br>
-  aquí</div>
-</div>
-<p> </p>
diff --git a/files/es/mdn/guidelines/convenciones_y_definiciones/index.html b/files/es/mdn/guidelines/convenciones_y_definiciones/index.html
deleted file mode 100644
index c96e4b7ab2..0000000000
--- a/files/es/mdn/guidelines/convenciones_y_definiciones/index.html
+++ /dev/null
@@ -1,201 +0,0 @@
----
-title: MDN convenciones y definiciones
-slug: MDN/Guidelines/Convenciones_y_definiciones
-tags:
-  - Directrices
-  - Documentación
-  - Guía
-  - MDN
-  - Meta MDN
-translation_of: MDN/Guidelines/Conventions_definitions
----
-<div>{{MDNSidebar}}{{IncludeSubnav("/es/docs/MDN")}}</div>
-
-<p class="summary">Este artículo define algunas convenciones y definiciones que se usan comúnmente en MDN, que pueden no ser obvias para algunas personas cuando las encuentran en la documentación.</p>
-
-<h2 id="Definiciones">Definiciones</h2>
-
-<h3 id="Desaprobado_y_obsoleto">Desaprobado y obsoleto</h3>
-
-<p><strong>D</strong><strong>esaprobado</strong> y <strong>obsoleto</strong> son términos comunes asociados con tecnologías y especificaciones, pero ¿qué significan?</p>
-
-<dl>
- <dt>Desaprobado</dt>
- <dd>En MDN, el término <strong>desaprobado</strong> se usa para marcar una API o tecnología que ya no se recomienda, pero que aún está implementada y puede funcionar. Recientemente, la hemos actualizado a la definición utilizada en nuestro <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md#status-information">proyecto de datos de compatibilidad del navegador</a>, que esa "característica ya no se recomienda. Es posible que se elimine en el futuro o que solo se conserve por motivos de compatibilidad. Evita el uso de esta funcionalidad."</dd>
- <dt>Obsoleto</dt>
- <dd>En MDN, el término <strong>obsoleto</strong> se utiliza para marcar una API o tecnología que no solo ya no se recomienda, sino que ya no se implementa en los navegadores. Sin embargo, esto fue confuso — es similar a desaprobado, y la distinción no es muy útil (aún no debes usarlo en un sitio de producción). Por lo tanto, ya no la usamos, y cualquier instancia con la que te encuentres se debe eliminar/reemplazar por desaprobada.</dd>
-</dl>
-
-<h3 id="Experimental">Experimental</h3>
-
-<p><strong>Experimental</strong> puede significar diferentes cosas según el contexto en el que lo escuches o lo leas. Cuando una tecnología se describe como experimental en MDN, significa que la tecnología es incipiente e inmadura, y actualmente está en proceso de ser agregada a la plataforma web (o considerada para agregarla).</p>
-
-<p>Uno o ambos de estos serán ciertos:</p>
-
-<ul>
- <li>Está implementado y habilitado de forma predeterminada en menos de dos de los principales navegadores modernos.</li>
- <li>Su especificación definitoria no es estable y es probable que cambie significativamente. Por lo tanto, su sintaxis y comportamiento están sujetos a cambios en futuras versiones de navegadores a medida que cambie la especificación.</li>
-</ul>
-
-<p>Si una o ambas de estas definiciones es cierta, entonces debes pensar detenidamente antes de comenzar a usar esa tecnología en cualquier tipo de proyecto de producción (es decir, no solo en una demostración o experimento). Consulta también la definición de experimental en nuestro <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md#status-information">proyecto de datos de compatibilidad del navegador</a>.</p>
-
-<p>Por el contrario, un elemento ya no es experimental cuando:</p>
-
-<ul>
- <li>Está implementado en dos o más navegadores principales; o</li>
- <li>Su especificación definitoria es estable y es poco probable que cambie.</li>
-</ul>
-
-<p>El <em>or</em> es importante aquí — por lo general, si una tecnología es compatible con varios navegadores importantes, la especificación será estable, pero no siempre es así. Y algunas tecnologías tendrán una especificación estable y se usarán bien, pero no tendrán soporte nativo en los navegadores (<a href="/es/docs/Related/IMSC">IMSC</a>, por ejemplo).</p>
-
-<h3 id="Páginas_archivadas">Páginas archivadas</h3>
-
-<p>Las páginas archivadas son páginas que se almacenan en el <a href="/es/docs/Archive">Archivo de contenido obsoleto</a> de MDN. Estas páginas contienen información lo suficientemente desactualizada como para que ya no sea directamente útil para nadie.</p>
-
-<p>Por lo general, estas se refieren a proyectos de Mozilla que han sido descontinuados y ya no se debe confiar en ellos. Pero no las eliminamos simplemente porque forman un registro histórico útil, y algunos de los patrones o ideas contenidos en ellos podrían ser útiles para trabajos futuros. Un buen ejemplo es el <a href="/es/docs/Archive/B2G_OS">proyecto B2G (Firefox OS)</a>.</p>
-
-<h4 id="¿Cuándo_se_debe_archivar_una_página">¿Cuándo se debe archivar una página?</h4>
-
-<p>Una página se debe archivar si se ajusta a la descripción anterior. Para archivar una página, debes utilizar la "función Mover página" (<em>Avanzado &gt; Mover este artículo</em>) para mover la página al árbol de páginas de archivo (/es/docs/Archive). Es posible que no tengas los permisos para usar esta función, y antes de comenzar a archivar páginas, primero debas discutirlo con la comunidad MDN; habla con nosotros en nuestro <a href="https://discourse.mozilla.org/c/mdn">Foro de discusión</a>.</p>
-
-<h3 id="Páginas_eliminadas">Páginas eliminadas</h3>
-
-<p>Las páginas eliminadas son páginas que se eliminaron explícitamente de MDN — consulta, por ejemplo, la interfaz <a href="/es/docs/Web/API/SharedKeyframeList"><code>SharedKeyframeList</code></a> y el constructor <a href="/es/docs/Web/API/SharedKeyframeList/SharedKeyframeList"><code>SharedKeyframeList()</code></a>. Estas páginas contienen información que ya no es útil de ninguna manera y/o puede ser incorrecta hasta el punto en que mantenerla disponible puede ser confuso o malo para la gente.</p>
-
-<p>Estas pueden ser:</p>
-
-<ul>
- <li>Páginas de referencia para funciones de API que se eliminaron de la especificación antes de que se implementaran en cualquier navegador.</li>
- <li>Artículos que cubren técnicas que luego se demostró que eran malas prácticas y fueron reemplazadas por mejores técnicas.</li>
- <li>Artículos que contienen información que luego fue reemplazada por otros artículos de mejor calidad.</li>
- <li>Artículos que contienen contenido inapropiado para MDN.</li>
- <li>Traducciones antiguas, desactualizadas y difíciles de arreglar, lo que significa que la versión en inglés es preferible y comenzar una nueva traducción sería una opción más fácil.</li>
-</ul>
-
-<h4 id="¿Cuándo_se_debe_eliminar_una_página">¿Cuándo se debe eliminar una página?</h4>
-
-<p>Se debe eliminar una página si se ajusta a la descripción anterior. Para eliminar una página, debes utilizar la función "Eliminar esta página" (<em>Avanzado&gt; Eliminar esta página</em>) para eliminar la página. Probablemente no tengas los permisos para usar esta función, y cuando pienses en eliminar páginas, primero debes discutirlo con la comunidad de MDN; habla con nosotros en nuestro <a href="https://discourse.mozilla.org/c/mdn">Foro de discusión</a>.</p>
-
-<h3 id="Cuando_documentar_nuevas_tecnologías">Cuando documentar nuevas tecnologías</h3>
-
-<p>En MDN, buscamos constantemente documentar nuevas tecnologías de estándares web según corresponda. Intentamos lograr un equilibrio entre publicar la documentación lo suficientemente temprano para que los desarrolladores puedan aprender sobre las nuevas funciones tan pronto como lo necesiten y publicarla lo suficientemente tarde para que la tecnología sea madura y estable para que los documentos no necesiten actualizaciones constantes o rápida eliminación.</p>
-
-<p>En general, nuestra definición de lo más temprano que consideraremos para documentar una nueva tecnología es:</p>
-
-<p><em>"Cuando la función está en una pista de estándares y se implementa en algún lugar."</em></p>
-
-<p>Definitivamente deberías considerar documentar una nueva tecnología si:</p>
-
-<ul>
- <li>Se especifica en un documento de especificación publicado bajo una organización de estándares confiable (como W3C, WHATWG, Khronos, IETF, etc.), que ha alcanzado un nivel razonable de estabilidad (por ejemplo, un borrador de trabajo del W3C o una recomendación candidata, o la especificación está buscando ser bastante estable a juzgar por el flujo de asuntos presentados en su contra).</li>
- <li>Se implementa de manera consistente en al menos un navegador, y otros desarrolladores de navegadores muestran signos de interés (como un boleto activo o un proceso de "intención de implementar" en vigor).</li>
-</ul>
-
-<p>Deberías tener más cuidado al documentar una nueva tecnología (pero deberías considerarla si tiene sentido) si:</p>
-
-<ul>
- <li>No tiene una especificación, o la especificación es una nota aproximada que parece estar sujeta a cambios.</li>
- <li>Uno o cero navegadores lo implementan actualmente, y los navegadores que no lo admiten no muestran signos de interés en implementarlo (puedes evaluar esto preguntando a los ingenieros que trabajan en esos navegadores, buscando rastreadores de errores del navegador y listas de correo, etc.).</li>
-</ul>
-
-<p>No debes considerar documentar una nueva tecnología si:</p>
-
-<ul>
- <li>No es una tecnología expuesta a la web y/o es completamente propietaria.</li>
- <li>Ya muestra signos de estar obsoleto o reemplazado por una característica similar.</li>
-</ul>
-
-<h2 id="Convenciones">Convenciones</h2>
-
-<h3 id="Cuando_se_elimina_algo_de_la_especificación">Cuando se elimina algo de la especificación</h3>
-
-<p>A veces, durante el desarrollo de una nueva especificación, o en el transcurso de la evolución de los estándares como HTML, se agregan nuevos elementos, métodos, propiedades, etc. a la especificación, permanecen allí por un tiempo y luego se eliminan nuevamente. A veces, esto sucede muy rápido y, a veces, estos nuevos elementos permanecen en la especificación durante meses o incluso años antes de ser eliminados. Esto puede hacer que sea complicado decidir cómo manejar la eliminación del artículo de la especificación. Aquí hay algunas pautas que te ayudarán a decidir qué hacer.</p>
-
-<div class="note">
-<p>Para los propósitos de esta discusión, la palabra "elemento" se usa para significar cualquier cosa que pueda ser parte de una especificación: un elemento o un atributo de un elemento, una interfaz o cualquier método individual, propiedad u otro miembro de una interfaz, etcétera.</p>
-</div>
-
-<ul>
- <li>Si el elemento <em>nunca</em> se implementó en una versión de lanzamiento de <em>cualquier</em> navegador, incluso detrás de una preferencia o marca, simplemente elimina cualquier referencia al elemento de la documentación.
-
-  <ul>
-   <li>Si el elemento tiene páginas de documentación que describen solo ese elemento (como {{domxref("RTCPeerConnection.close()")}}), elimina esa página. Si el elemento eliminado es una interfaz, esto significa eliminar también las subpáginas que describen las propiedades y los métodos de esa interfaz.</li>
-   <li>Elimina el elemento de cualquier lista de propiedades, atributos, métodos, etc. Para los métodos de una interfaz, eso significa eliminarlo de la sección "Métodos" en la página de descripción general de la interfaz, por ejemplo.</li>
-   <li>Busca en el texto de la página de descripción general para esa interfaz, elemento, etc., cualquier referencia al elemento eliminado. Elimina esas referencias, asegurándote de no dejar extraños problemas gramaticales u otros problemas con el texto. Esto puede significar no solo borrar palabras, sino reescribir una oración o párrafo para que tenga más sentido. También puede significar eliminar secciones enteras de contenido si la descripción del uso del elemento es extensa.</li>
-   <li>Del mismo modo, busca cualquier discusión sobre el tema en las guías y tutoriales sobre la API o tecnología relevante. Elimina esas referencias, asegurándote de no dejar extraños problemas gramaticales u otros problemas con el texto. Esto puede significar no solo borrar palabras, sino reescribir una oración o párrafo para que tenga más sentido. También puede significar eliminar secciones enteras de contenido si la descripción del uso del elemento es extensa.</li>
-   <li>Busca en MDN referencias al elemento eliminado, en caso de que haya discusiones en otro lugar. Es poco probable que las haya, ya que si nunca se implementó, es poco probable que se discuta ampliamente. Elimina también esas menciones.</li>
-   <li>Si el <a href="https://github.com/mdn/browser-compat-data">repositorio de datos de compatibilidad del navegador</a> contienen datos de los elementos eliminados, elimina esos objetos del código JSON y envía una SE con ese cambio, explicando por qué en el mensaje de confirmación y la descripción de la SE. Ten cuidado de no romper la sintaxis JSON mientras haces esto.</li>
-  </ul>
- </li>
- <li>Si el elemento se implementó en cualquier versión de lanzamiento de uno o más navegadores, pero <em>solo</em> detrás de una preferencia o marca, no elimines el elemento de la documentación inmediatamente. En su lugar, marca el artículo como obsoleto de la siguiente manera:
-  <ul>
-   <li>Si el elemento tiene páginas de documentación que describen solo ese elemento (como {{domxref("RTCPeerConnection.close()")}}), agrega la macro {{TemplateLink("deprecated_header")}} en la parte superior de la página y agrega la etiqueta {{tag("Deprecated")}} a la lista de etiquetas de la página.</li>
-   <li>En la página de descripción general del elemento, la interfaz o la API, busca la lista de elementos que incluyan el elemento que se ha eliminado de la especificación y agrega la macro {{TemplateLink("deprecated_inline")}} después del nombre del elemento en esa lista.</li>
-   <li>Busca en el texto informativo de la página de descripción general de esa interfaz, elemento, etc., cualquier referencia al elemento eliminado. Agrega cuadros de advertencia en los lugares apropiados con texto del tipo "[lo que sea] se ha eliminado de la especificación y pronto se eliminará de los navegadores. Consulta [enlace a la página] para conocer una nueva forma de hacer esto."</li>
-   <li>Del mismo modo, busca cualquier discusión sobre el tema en las guías y tutoriales sobre la API o tecnología relevante. Agrega advertencias similares.</li>
-   <li>Busca en MDN referencias al elemento eliminado, en caso de que haya discusiones en otro lugar. Agrega también cuadros de advertencia similares allí.</li>
-   <li>En algún momento en el futuro, se puede tomar la decisión de eliminar el elemento de la documentación; Normalmente no hacemos esto, pero si el artículo no se utilizó o no fue interesante, podemos decidir hacerlo.</li>
-   <li>Actualiza cualquier entrada relevante en el <a href="https://github.com/mdn/browser-compat-data">repositorio de datos de compatibilidad del navegador</a> para reflejar la obsolescencia de los elementos afectados.</li>
-  </ul>
- </li>
- <li>Si el elemento se implementó en una o más versiones de publicaciones de navegadores, sin que sea necesario cambiar una preferencia o una marca, marca el elemento como obsoleto, de la siguiente manera:
-  <ul>
-   <li>Si el elemento tiene páginas de documentación que describen solo ese elemento (como {{domxref("RTCPeerConnection.close()")}}), agrega la macro {{TemplateLink("deprecated_header")}} en la parte superior de la página y agrega la etiqueta {{tag("Deprecated")}} a la lista de etiquetas de la página.</li>
-   <li>En la página de descripción general del elemento, la interfaz o la API, busca la lista de elementos que incluyan el elemento que se ha eliminado de la especificación y agrega la macro {{TemplateLink("deprecated_inline")}} después del nombre del elemento en esa lista.</li>
-   <li>Busca en el texto informativo de la página de descripción general de esa interfaz, elemento, etc., cualquier referencia al elemento eliminado. Agrega recuadros de advertencia en los lugares apropiados con texto del tipo "[lo que sea] se ha eliminado de la especificación y está obsoleto. Es posible que se elimine de los navegadores en el futuro, por lo que no debes usarlo. Consulta [enlace a la página] para conocer una nueva forma de hacer esto."</li>
-   <li>Del mismo modo, busca cualquier discusión sobre el tema en las guías y tutoriales sobre la API o tecnología relevante. Agrega advertencias similares.</li>
-   <li>Busca en MDN referencias al elemento eliminado, en caso de que haya discusiones en otro lugar. Agrega también cuadros de advertencia similares allí.</li>
-   <li>Es poco probable que estos elementos se eliminen de la documentación pronto, si es que alguna vez lo hacen. Sin embargo, es posible que parte o todo el material se mueva a la sección <a href="/es/docs/Archive">Archivo</a> del sitio.</li>
-   <li>Actualiza todas las entradas relevantes en el <a href="https://github.com/mdn/browser-compat-data">repositorio de datos de compatibilidad del navegador</a> para reflejar la obsolescencia de los elementos afectados.</li>
-  </ul>
- </li>
-</ul>
-
-<p>Utiliza el sentido común con la redacción de los mensajes de advertencia y otros cambios en el texto sugeridos por las pautas anteriores. Los diferentes elementos requerirán una redacción y un manejo diferentes de la situación. En caso de duda, no dudes en pedir consejo en la <a href="https://chat.mozilla.org/#/room/#mdn:mozilla.org">sala del chat de Docs Web de MDN</a> en <a href="https://wiki.mozilla.org/Matrix">Matrix</a>, o en el <a href="https://discourse.mozilla.org/c/mdn">foro de debate de Docs Web de MDN</a>.</p>
-
-<h3 id="Copiar_contenido_dentro_de_MDN">Copiar contenido dentro de MDN</h3>
-
-<p>A veces, necesitas reutilizar el mismo texto en varias páginas (o deseas usar el contenido de una página como plantilla para otra página). Tienes tres opciones:</p>
-
-<ul>
- <li>Si deseas copiar una página completa:
-  <ol>
-   <li>Mientras visualizas la página que deseas copiar, en el menú <strong>Avanzado</strong> (engrane), elige <a href="/es/docs/MDN/Contribute/Creating_and_editing_pages#Clone_of_an_existing_page"><strong>Clona esta página</strong></a>. Esto abre la interfaz de usuario del editor para una nueva página, con el contenido de la página clonada ya poblada.</li>
-   <li>Introduce un <strong>título</strong> y un <strong><code>slug</code></strong> nuevo para la página clonada.</li>
-   <li>Edita el contenido de la página según sea necesario y guárdalo como usualmente lo haces.</li>
-  </ol>
- </li>
- <li>Si deseas copiar solo una parte de una página, <strong>no solo visites la página y la copies</strong>. Esto introduce bits adicionales de HTML no deseados en la página destino, y alguien tendrá que limpiar eso, tú u otro editor. Nadie quiere eso. Para copiar parte de una página MDN a otra página:
-  <ol>
-   <li>En la página fuente, haz clic en el botón <strong>Editar</strong> en la página de fuente.</li>
-   <li><strong>Copia el contenido que deseas reutilizar desde la interfaz de usuario del editor.</strong></li>
-   <li>Haz clic en <strong>Descartar</strong> para salir de la interfaz de usuario del editor de esa página.</li>
-   <li>Abre la interfaz de usuario del editor de la página donde deseas pegar.</li>
-   <li>Pega el contenido del portapapeles.</li>
-  </ol>
-
-  <div class="note"><strong>Usuarios de Chrome:</strong> Chrome generalmente no incluye las clases aplicadas al contenido al copiar y pegar documentos en nuestro editor. Debes revisar el contenido después de hacer esto y volver a aplicar los estilos perdidos. Checa las tablas, cuadros de sintaxis, resaltado de sintaxis y secciones ocultas de contenido en particular.</div>
- </li>
- <li>A veces, literalmente, deseas utilizar el mismo contenido en muchas páginas. En este caso, es mejor que coloques el contenido en una página y luego uses la macro {{TemplateLink("Page")}} para trasladar el material de una página a otra. De esta forma, siempre que se actualice el texto de la página fuente, la página de destino también se actualizará (es decir, esto sucederá en una actualización forzada o cuando la página destino pase por una reconstrucción programada).</li>
-</ul>
-
-<h4 id="Copiar_contenido_de_otro_lugar">Copiar contenido de otro lugar</h4>
-
-<p>A menudo, hay contenido útil sobre un tema en algún lugar de la web además de MDN. Sin embargo, copiar dicho contenido puede plantear dificultades, tanto legales como técnicas.</p>
-
-<p>En el nivel técnico, los motores de búsqueda suelen penalizar a un sitio en su clasificación por reproducir contenido disponible en otros lugares. Por lo tanto, es preferible tener contenido original en MDN, para mejorar la clasificación del contenido de MDN en los motores de búsqueda. Puedes vincular al contenido existente de MDN.</p>
-
-<p>A nivel legal, debes estar autorizado para contribuir con el contenido, y debes tener licencia y atribución de una manera que sea compatible con <a href="/es/docs/MDN/About#Copyrights_and_licenses">licencia de MDN</a>.</p>
-
-<ul>
- <li><strong>Si creaste el contenido existente</strong> (para tus propios fines y no como trabajo por encargo) y estás dispuesto a contribuir a MDN con la licencia de MDN, este es el caso más fácil y estás libre de contribuir con el contenido.</li>
- <li><strong>Si los derechos de autor del contenido pertenecen a otra persona</strong>, debes tener licencia y atribuir de manera compatible con la licencia de MDN. A menudo, no es fácil para alguien que no es abogado determinar qué licencias son compatibles. Para estar seguro, comunícate con un miembro del <a href="https://wiki.mozilla.org/MDN#Staff_Team">equipo de personal de MDN</a>, quien puede consultar al equipo legal de Mozilla para obtener orientación si es necesario .</li>
-</ul>
-
-<h4 id="Cómo_comunicar_un_conflicto_de_especificaciones">Cómo comunicar un conflicto de especificaciones</h4>
-
-<p>Ten en cuenta que a veces (pero rara vez) hay un conflicto entre diferentes versiones de especificaciones (generalmente W3C versus WHATWG), p. ej. una versión puede tener una característica listada como obsoleta, mientras que la otra no. En tales casos, considera cuál es la realidad, es decir, qué están haciendo los navegadores, y escribe una nota "importante" para resumir ese último estado. Por ejemplo, a enero de 2019, el atributo global <a href="/es/docs/Web/HTML/Global_attributes/inputmode"><code>inputmode</code></a> tiene un conflicto, que se resumió al igual que:</p>
-
-<div class="blockIndicator warning">
-<p><strong>Conflicto de especificaciones</strong>: La <a href="https://html.spec.whatwg.org/multipage/interaction.html#attr-inputmode">lista de especificaciones de WHATWG <code>inputmode</code></a>, y los navegadores modernos están trabajando para admitirlo. Sin embargo, la <a href="https://www.w3.org/TR/html52/index.html#contents">especificación W3C HTML 5.2</a> ya no la incluye (es decir, la marca como desaprobada). Debes considerar que la definición del WHATWG es correcta, hasta que se logre un consenso.</p>
-</div>
diff --git a/files/es/mdn/guidelines/conventions_definitions/index.html b/files/es/mdn/guidelines/conventions_definitions/index.html
new file mode 100644
index 0000000000..b18eee9d73
--- /dev/null
+++ b/files/es/mdn/guidelines/conventions_definitions/index.html
@@ -0,0 +1,202 @@
+---
+title: MDN convenciones y definiciones
+slug: MDN/Guidelines/Conventions_definitions
+tags:
+  - Directrices
+  - Documentación
+  - Guía
+  - MDN
+  - Meta MDN
+translation_of: MDN/Guidelines/Conventions_definitions
+original_slug: MDN/Guidelines/Convenciones_y_definiciones
+---
+<div>{{MDNSidebar}}{{IncludeSubnav("/es/docs/MDN")}}</div>
+
+<p class="summary">Este artículo define algunas convenciones y definiciones que se usan comúnmente en MDN, que pueden no ser obvias para algunas personas cuando las encuentran en la documentación.</p>
+
+<h2 id="Definiciones">Definiciones</h2>
+
+<h3 id="Desaprobado_y_obsoleto">Desaprobado y obsoleto</h3>
+
+<p><strong>D</strong><strong>esaprobado</strong> y <strong>obsoleto</strong> son términos comunes asociados con tecnologías y especificaciones, pero ¿qué significan?</p>
+
+<dl>
+ <dt>Desaprobado</dt>
+ <dd>En MDN, el término <strong>desaprobado</strong> se usa para marcar una API o tecnología que ya no se recomienda, pero que aún está implementada y puede funcionar. Recientemente, la hemos actualizado a la definición utilizada en nuestro <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md#status-information">proyecto de datos de compatibilidad del navegador</a>, que esa "característica ya no se recomienda. Es posible que se elimine en el futuro o que solo se conserve por motivos de compatibilidad. Evita el uso de esta funcionalidad."</dd>
+ <dt>Obsoleto</dt>
+ <dd>En MDN, el término <strong>obsoleto</strong> se utiliza para marcar una API o tecnología que no solo ya no se recomienda, sino que ya no se implementa en los navegadores. Sin embargo, esto fue confuso — es similar a desaprobado, y la distinción no es muy útil (aún no debes usarlo en un sitio de producción). Por lo tanto, ya no la usamos, y cualquier instancia con la que te encuentres se debe eliminar/reemplazar por desaprobada.</dd>
+</dl>
+
+<h3 id="Experimental">Experimental</h3>
+
+<p><strong>Experimental</strong> puede significar diferentes cosas según el contexto en el que lo escuches o lo leas. Cuando una tecnología se describe como experimental en MDN, significa que la tecnología es incipiente e inmadura, y actualmente está en proceso de ser agregada a la plataforma web (o considerada para agregarla).</p>
+
+<p>Uno o ambos de estos serán ciertos:</p>
+
+<ul>
+ <li>Está implementado y habilitado de forma predeterminada en menos de dos de los principales navegadores modernos.</li>
+ <li>Su especificación definitoria no es estable y es probable que cambie significativamente. Por lo tanto, su sintaxis y comportamiento están sujetos a cambios en futuras versiones de navegadores a medida que cambie la especificación.</li>
+</ul>
+
+<p>Si una o ambas de estas definiciones es cierta, entonces debes pensar detenidamente antes de comenzar a usar esa tecnología en cualquier tipo de proyecto de producción (es decir, no solo en una demostración o experimento). Consulta también la definición de experimental en nuestro <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md#status-information">proyecto de datos de compatibilidad del navegador</a>.</p>
+
+<p>Por el contrario, un elemento ya no es experimental cuando:</p>
+
+<ul>
+ <li>Está implementado en dos o más navegadores principales; o</li>
+ <li>Su especificación definitoria es estable y es poco probable que cambie.</li>
+</ul>
+
+<p>El <em>or</em> es importante aquí — por lo general, si una tecnología es compatible con varios navegadores importantes, la especificación será estable, pero no siempre es así. Y algunas tecnologías tendrán una especificación estable y se usarán bien, pero no tendrán soporte nativo en los navegadores (<a href="/es/docs/Related/IMSC">IMSC</a>, por ejemplo).</p>
+
+<h3 id="Páginas_archivadas">Páginas archivadas</h3>
+
+<p>Las páginas archivadas son páginas que se almacenan en el <a href="/es/docs/Archive">Archivo de contenido obsoleto</a> de MDN. Estas páginas contienen información lo suficientemente desactualizada como para que ya no sea directamente útil para nadie.</p>
+
+<p>Por lo general, estas se refieren a proyectos de Mozilla que han sido descontinuados y ya no se debe confiar en ellos. Pero no las eliminamos simplemente porque forman un registro histórico útil, y algunos de los patrones o ideas contenidos en ellos podrían ser útiles para trabajos futuros. Un buen ejemplo es el <a href="/es/docs/Archive/B2G_OS">proyecto B2G (Firefox OS)</a>.</p>
+
+<h4 id="¿Cuándo_se_debe_archivar_una_página">¿Cuándo se debe archivar una página?</h4>
+
+<p>Una página se debe archivar si se ajusta a la descripción anterior. Para archivar una página, debes utilizar la "función Mover página" (<em>Avanzado &gt; Mover este artículo</em>) para mover la página al árbol de páginas de archivo (/es/docs/Archive). Es posible que no tengas los permisos para usar esta función, y antes de comenzar a archivar páginas, primero debas discutirlo con la comunidad MDN; habla con nosotros en nuestro <a href="https://discourse.mozilla.org/c/mdn">Foro de discusión</a>.</p>
+
+<h3 id="Páginas_eliminadas">Páginas eliminadas</h3>
+
+<p>Las páginas eliminadas son páginas que se eliminaron explícitamente de MDN — consulta, por ejemplo, la interfaz <a href="/es/docs/Web/API/SharedKeyframeList"><code>SharedKeyframeList</code></a> y el constructor <a href="/es/docs/Web/API/SharedKeyframeList/SharedKeyframeList"><code>SharedKeyframeList()</code></a>. Estas páginas contienen información que ya no es útil de ninguna manera y/o puede ser incorrecta hasta el punto en que mantenerla disponible puede ser confuso o malo para la gente.</p>
+
+<p>Estas pueden ser:</p>
+
+<ul>
+ <li>Páginas de referencia para funciones de API que se eliminaron de la especificación antes de que se implementaran en cualquier navegador.</li>
+ <li>Artículos que cubren técnicas que luego se demostró que eran malas prácticas y fueron reemplazadas por mejores técnicas.</li>
+ <li>Artículos que contienen información que luego fue reemplazada por otros artículos de mejor calidad.</li>
+ <li>Artículos que contienen contenido inapropiado para MDN.</li>
+ <li>Traducciones antiguas, desactualizadas y difíciles de arreglar, lo que significa que la versión en inglés es preferible y comenzar una nueva traducción sería una opción más fácil.</li>
+</ul>
+
+<h4 id="¿Cuándo_se_debe_eliminar_una_página">¿Cuándo se debe eliminar una página?</h4>
+
+<p>Se debe eliminar una página si se ajusta a la descripción anterior. Para eliminar una página, debes utilizar la función "Eliminar esta página" (<em>Avanzado&gt; Eliminar esta página</em>) para eliminar la página. Probablemente no tengas los permisos para usar esta función, y cuando pienses en eliminar páginas, primero debes discutirlo con la comunidad de MDN; habla con nosotros en nuestro <a href="https://discourse.mozilla.org/c/mdn">Foro de discusión</a>.</p>
+
+<h3 id="Cuando_documentar_nuevas_tecnologías">Cuando documentar nuevas tecnologías</h3>
+
+<p>En MDN, buscamos constantemente documentar nuevas tecnologías de estándares web según corresponda. Intentamos lograr un equilibrio entre publicar la documentación lo suficientemente temprano para que los desarrolladores puedan aprender sobre las nuevas funciones tan pronto como lo necesiten y publicarla lo suficientemente tarde para que la tecnología sea madura y estable para que los documentos no necesiten actualizaciones constantes o rápida eliminación.</p>
+
+<p>En general, nuestra definición de lo más temprano que consideraremos para documentar una nueva tecnología es:</p>
+
+<p><em>"Cuando la función está en una pista de estándares y se implementa en algún lugar."</em></p>
+
+<p>Definitivamente deberías considerar documentar una nueva tecnología si:</p>
+
+<ul>
+ <li>Se especifica en un documento de especificación publicado bajo una organización de estándares confiable (como W3C, WHATWG, Khronos, IETF, etc.), que ha alcanzado un nivel razonable de estabilidad (por ejemplo, un borrador de trabajo del W3C o una recomendación candidata, o la especificación está buscando ser bastante estable a juzgar por el flujo de asuntos presentados en su contra).</li>
+ <li>Se implementa de manera consistente en al menos un navegador, y otros desarrolladores de navegadores muestran signos de interés (como un boleto activo o un proceso de "intención de implementar" en vigor).</li>
+</ul>
+
+<p>Deberías tener más cuidado al documentar una nueva tecnología (pero deberías considerarla si tiene sentido) si:</p>
+
+<ul>
+ <li>No tiene una especificación, o la especificación es una nota aproximada que parece estar sujeta a cambios.</li>
+ <li>Uno o cero navegadores lo implementan actualmente, y los navegadores que no lo admiten no muestran signos de interés en implementarlo (puedes evaluar esto preguntando a los ingenieros que trabajan en esos navegadores, buscando rastreadores de errores del navegador y listas de correo, etc.).</li>
+</ul>
+
+<p>No debes considerar documentar una nueva tecnología si:</p>
+
+<ul>
+ <li>No es una tecnología expuesta a la web y/o es completamente propietaria.</li>
+ <li>Ya muestra signos de estar obsoleto o reemplazado por una característica similar.</li>
+</ul>
+
+<h2 id="Convenciones">Convenciones</h2>
+
+<h3 id="Cuando_se_elimina_algo_de_la_especificación">Cuando se elimina algo de la especificación</h3>
+
+<p>A veces, durante el desarrollo de una nueva especificación, o en el transcurso de la evolución de los estándares como HTML, se agregan nuevos elementos, métodos, propiedades, etc. a la especificación, permanecen allí por un tiempo y luego se eliminan nuevamente. A veces, esto sucede muy rápido y, a veces, estos nuevos elementos permanecen en la especificación durante meses o incluso años antes de ser eliminados. Esto puede hacer que sea complicado decidir cómo manejar la eliminación del artículo de la especificación. Aquí hay algunas pautas que te ayudarán a decidir qué hacer.</p>
+
+<div class="note">
+<p>Para los propósitos de esta discusión, la palabra "elemento" se usa para significar cualquier cosa que pueda ser parte de una especificación: un elemento o un atributo de un elemento, una interfaz o cualquier método individual, propiedad u otro miembro de una interfaz, etcétera.</p>
+</div>
+
+<ul>
+ <li>Si el elemento <em>nunca</em> se implementó en una versión de lanzamiento de <em>cualquier</em> navegador, incluso detrás de una preferencia o marca, simplemente elimina cualquier referencia al elemento de la documentación.
+
+  <ul>
+   <li>Si el elemento tiene páginas de documentación que describen solo ese elemento (como {{domxref("RTCPeerConnection.close()")}}), elimina esa página. Si el elemento eliminado es una interfaz, esto significa eliminar también las subpáginas que describen las propiedades y los métodos de esa interfaz.</li>
+   <li>Elimina el elemento de cualquier lista de propiedades, atributos, métodos, etc. Para los métodos de una interfaz, eso significa eliminarlo de la sección "Métodos" en la página de descripción general de la interfaz, por ejemplo.</li>
+   <li>Busca en el texto de la página de descripción general para esa interfaz, elemento, etc., cualquier referencia al elemento eliminado. Elimina esas referencias, asegurándote de no dejar extraños problemas gramaticales u otros problemas con el texto. Esto puede significar no solo borrar palabras, sino reescribir una oración o párrafo para que tenga más sentido. También puede significar eliminar secciones enteras de contenido si la descripción del uso del elemento es extensa.</li>
+   <li>Del mismo modo, busca cualquier discusión sobre el tema en las guías y tutoriales sobre la API o tecnología relevante. Elimina esas referencias, asegurándote de no dejar extraños problemas gramaticales u otros problemas con el texto. Esto puede significar no solo borrar palabras, sino reescribir una oración o párrafo para que tenga más sentido. También puede significar eliminar secciones enteras de contenido si la descripción del uso del elemento es extensa.</li>
+   <li>Busca en MDN referencias al elemento eliminado, en caso de que haya discusiones en otro lugar. Es poco probable que las haya, ya que si nunca se implementó, es poco probable que se discuta ampliamente. Elimina también esas menciones.</li>
+   <li>Si el <a href="https://github.com/mdn/browser-compat-data">repositorio de datos de compatibilidad del navegador</a> contienen datos de los elementos eliminados, elimina esos objetos del código JSON y envía una SE con ese cambio, explicando por qué en el mensaje de confirmación y la descripción de la SE. Ten cuidado de no romper la sintaxis JSON mientras haces esto.</li>
+  </ul>
+ </li>
+ <li>Si el elemento se implementó en cualquier versión de lanzamiento de uno o más navegadores, pero <em>solo</em> detrás de una preferencia o marca, no elimines el elemento de la documentación inmediatamente. En su lugar, marca el artículo como obsoleto de la siguiente manera:
+  <ul>
+   <li>Si el elemento tiene páginas de documentación que describen solo ese elemento (como {{domxref("RTCPeerConnection.close()")}}), agrega la macro {{TemplateLink("deprecated_header")}} en la parte superior de la página y agrega la etiqueta {{tag("Deprecated")}} a la lista de etiquetas de la página.</li>
+   <li>En la página de descripción general del elemento, la interfaz o la API, busca la lista de elementos que incluyan el elemento que se ha eliminado de la especificación y agrega la macro {{TemplateLink("deprecated_inline")}} después del nombre del elemento en esa lista.</li>
+   <li>Busca en el texto informativo de la página de descripción general de esa interfaz, elemento, etc., cualquier referencia al elemento eliminado. Agrega cuadros de advertencia en los lugares apropiados con texto del tipo "[lo que sea] se ha eliminado de la especificación y pronto se eliminará de los navegadores. Consulta [enlace a la página] para conocer una nueva forma de hacer esto."</li>
+   <li>Del mismo modo, busca cualquier discusión sobre el tema en las guías y tutoriales sobre la API o tecnología relevante. Agrega advertencias similares.</li>
+   <li>Busca en MDN referencias al elemento eliminado, en caso de que haya discusiones en otro lugar. Agrega también cuadros de advertencia similares allí.</li>
+   <li>En algún momento en el futuro, se puede tomar la decisión de eliminar el elemento de la documentación; Normalmente no hacemos esto, pero si el artículo no se utilizó o no fue interesante, podemos decidir hacerlo.</li>
+   <li>Actualiza cualquier entrada relevante en el <a href="https://github.com/mdn/browser-compat-data">repositorio de datos de compatibilidad del navegador</a> para reflejar la obsolescencia de los elementos afectados.</li>
+  </ul>
+ </li>
+ <li>Si el elemento se implementó en una o más versiones de publicaciones de navegadores, sin que sea necesario cambiar una preferencia o una marca, marca el elemento como obsoleto, de la siguiente manera:
+  <ul>
+   <li>Si el elemento tiene páginas de documentación que describen solo ese elemento (como {{domxref("RTCPeerConnection.close()")}}), agrega la macro {{TemplateLink("deprecated_header")}} en la parte superior de la página y agrega la etiqueta {{tag("Deprecated")}} a la lista de etiquetas de la página.</li>
+   <li>En la página de descripción general del elemento, la interfaz o la API, busca la lista de elementos que incluyan el elemento que se ha eliminado de la especificación y agrega la macro {{TemplateLink("deprecated_inline")}} después del nombre del elemento en esa lista.</li>
+   <li>Busca en el texto informativo de la página de descripción general de esa interfaz, elemento, etc., cualquier referencia al elemento eliminado. Agrega recuadros de advertencia en los lugares apropiados con texto del tipo "[lo que sea] se ha eliminado de la especificación y está obsoleto. Es posible que se elimine de los navegadores en el futuro, por lo que no debes usarlo. Consulta [enlace a la página] para conocer una nueva forma de hacer esto."</li>
+   <li>Del mismo modo, busca cualquier discusión sobre el tema en las guías y tutoriales sobre la API o tecnología relevante. Agrega advertencias similares.</li>
+   <li>Busca en MDN referencias al elemento eliminado, en caso de que haya discusiones en otro lugar. Agrega también cuadros de advertencia similares allí.</li>
+   <li>Es poco probable que estos elementos se eliminen de la documentación pronto, si es que alguna vez lo hacen. Sin embargo, es posible que parte o todo el material se mueva a la sección <a href="/es/docs/Archive">Archivo</a> del sitio.</li>
+   <li>Actualiza todas las entradas relevantes en el <a href="https://github.com/mdn/browser-compat-data">repositorio de datos de compatibilidad del navegador</a> para reflejar la obsolescencia de los elementos afectados.</li>
+  </ul>
+ </li>
+</ul>
+
+<p>Utiliza el sentido común con la redacción de los mensajes de advertencia y otros cambios en el texto sugeridos por las pautas anteriores. Los diferentes elementos requerirán una redacción y un manejo diferentes de la situación. En caso de duda, no dudes en pedir consejo en la <a href="https://chat.mozilla.org/#/room/#mdn:mozilla.org">sala del chat de Docs Web de MDN</a> en <a href="https://wiki.mozilla.org/Matrix">Matrix</a>, o en el <a href="https://discourse.mozilla.org/c/mdn">foro de debate de Docs Web de MDN</a>.</p>
+
+<h3 id="Copiar_contenido_dentro_de_MDN">Copiar contenido dentro de MDN</h3>
+
+<p>A veces, necesitas reutilizar el mismo texto en varias páginas (o deseas usar el contenido de una página como plantilla para otra página). Tienes tres opciones:</p>
+
+<ul>
+ <li>Si deseas copiar una página completa:
+  <ol>
+   <li>Mientras visualizas la página que deseas copiar, en el menú <strong>Avanzado</strong> (engrane), elige <a href="/es/docs/MDN/Contribute/Creating_and_editing_pages#Clone_of_an_existing_page"><strong>Clona esta página</strong></a>. Esto abre la interfaz de usuario del editor para una nueva página, con el contenido de la página clonada ya poblada.</li>
+   <li>Introduce un <strong>título</strong> y un <strong><code>slug</code></strong> nuevo para la página clonada.</li>
+   <li>Edita el contenido de la página según sea necesario y guárdalo como usualmente lo haces.</li>
+  </ol>
+ </li>
+ <li>Si deseas copiar solo una parte de una página, <strong>no solo visites la página y la copies</strong>. Esto introduce bits adicionales de HTML no deseados en la página destino, y alguien tendrá que limpiar eso, tú u otro editor. Nadie quiere eso. Para copiar parte de una página MDN a otra página:
+  <ol>
+   <li>En la página fuente, haz clic en el botón <strong>Editar</strong> en la página de fuente.</li>
+   <li><strong>Copia el contenido que deseas reutilizar desde la interfaz de usuario del editor.</strong></li>
+   <li>Haz clic en <strong>Descartar</strong> para salir de la interfaz de usuario del editor de esa página.</li>
+   <li>Abre la interfaz de usuario del editor de la página donde deseas pegar.</li>
+   <li>Pega el contenido del portapapeles.</li>
+  </ol>
+
+  <div class="note"><strong>Usuarios de Chrome:</strong> Chrome generalmente no incluye las clases aplicadas al contenido al copiar y pegar documentos en nuestro editor. Debes revisar el contenido después de hacer esto y volver a aplicar los estilos perdidos. Checa las tablas, cuadros de sintaxis, resaltado de sintaxis y secciones ocultas de contenido en particular.</div>
+ </li>
+ <li>A veces, literalmente, deseas utilizar el mismo contenido en muchas páginas. En este caso, es mejor que coloques el contenido en una página y luego uses la macro {{TemplateLink("Page")}} para trasladar el material de una página a otra. De esta forma, siempre que se actualice el texto de la página fuente, la página de destino también se actualizará (es decir, esto sucederá en una actualización forzada o cuando la página destino pase por una reconstrucción programada).</li>
+</ul>
+
+<h4 id="Copiar_contenido_de_otro_lugar">Copiar contenido de otro lugar</h4>
+
+<p>A menudo, hay contenido útil sobre un tema en algún lugar de la web además de MDN. Sin embargo, copiar dicho contenido puede plantear dificultades, tanto legales como técnicas.</p>
+
+<p>En el nivel técnico, los motores de búsqueda suelen penalizar a un sitio en su clasificación por reproducir contenido disponible en otros lugares. Por lo tanto, es preferible tener contenido original en MDN, para mejorar la clasificación del contenido de MDN en los motores de búsqueda. Puedes vincular al contenido existente de MDN.</p>
+
+<p>A nivel legal, debes estar autorizado para contribuir con el contenido, y debes tener licencia y atribución de una manera que sea compatible con <a href="/es/docs/MDN/About#Copyrights_and_licenses">licencia de MDN</a>.</p>
+
+<ul>
+ <li><strong>Si creaste el contenido existente</strong> (para tus propios fines y no como trabajo por encargo) y estás dispuesto a contribuir a MDN con la licencia de MDN, este es el caso más fácil y estás libre de contribuir con el contenido.</li>
+ <li><strong>Si los derechos de autor del contenido pertenecen a otra persona</strong>, debes tener licencia y atribuir de manera compatible con la licencia de MDN. A menudo, no es fácil para alguien que no es abogado determinar qué licencias son compatibles. Para estar seguro, comunícate con un miembro del <a href="https://wiki.mozilla.org/MDN#Staff_Team">equipo de personal de MDN</a>, quien puede consultar al equipo legal de Mozilla para obtener orientación si es necesario .</li>
+</ul>
+
+<h4 id="Cómo_comunicar_un_conflicto_de_especificaciones">Cómo comunicar un conflicto de especificaciones</h4>
+
+<p>Ten en cuenta que a veces (pero rara vez) hay un conflicto entre diferentes versiones de especificaciones (generalmente W3C versus WHATWG), p. ej. una versión puede tener una característica listada como obsoleta, mientras que la otra no. En tales casos, considera cuál es la realidad, es decir, qué están haciendo los navegadores, y escribe una nota "importante" para resumir ese último estado. Por ejemplo, a enero de 2019, el atributo global <a href="/es/docs/Web/HTML/Global_attributes/inputmode"><code>inputmode</code></a> tiene un conflicto, que se resumió al igual que:</p>
+
+<div class="blockIndicator warning">
+<p><strong>Conflicto de especificaciones</strong>: La <a href="https://html.spec.whatwg.org/multipage/interaction.html#attr-inputmode">lista de especificaciones de WHATWG <code>inputmode</code></a>, y los navegadores modernos están trabajando para admitirlo. Sin embargo, la <a href="https://www.w3.org/TR/html52/index.html#contents">especificación W3C HTML 5.2</a> ya no la incluye (es decir, la marca como desaprobada). Debes considerar que la definición del WHATWG es correcta, hasta que se logre un consenso.</p>
+</div>
diff --git a/files/es/mdn/guidelines/css_style_guide/index.html b/files/es/mdn/guidelines/css_style_guide/index.html
new file mode 100644
index 0000000000..17e58b0086
--- /dev/null
+++ b/files/es/mdn/guidelines/css_style_guide/index.html
@@ -0,0 +1,48 @@
+---
+title: Bloques de contenido
+slug: MDN/Guidelines/CSS_style_guide
+tags:
+  - MDN
+  - Meta
+translation_of: MDN/Guidelines/CSS_style_guide
+translation_of_original: MDN/Structures/Content_blocks
+original_slug: MDN/Guidelines/Content_blocks
+---
+<div>{{MDNSidebar}}</div><div class="summary">
+ <p>This pages lists reusable content blocks.</p>
+</div>
+<h2 id="Grilla_de_tarjetas">Grilla de tarjetas</h2>
+<p>Permite tener un par de tarjetas cercanas entre sí para llamar a contenidos específicos o para llamar a una acción. La clase CSS es: <code>.card-grid </code>(L 751 - 824 in CustomCSS).</p>
+<ul class="card-grid">
+ <li><span>Refetencia CSS</span>
+  <p>Una <a href="/en-US/docs/Web/CSS/Reference" title="en-US/docs/CSS/CSS_Reference">referencia exhaustiva</a> para <u>desarrolladores Web expertos</u> describiendo cada propiedad y concepto de CSS.</p>
+ </li>
+ <li><span>Tutorial CSS</span>
+  <p>Una <a href="/en-US/docs/CSS/Getting_Started" title="en-US/docs/CSS/Getting_Started">introduccion paso a paso</a> para ayudar a los <u>principiantes</u>. Presenta todos los fundamentos necesarios.</p>
+ </li>
+ <li><span>CSS3 Demos</span>
+  <p>A <a href="/en-US/demos/tag/tech:css3" title="https://developer.mozilla.org/en-US/demos/tag/tech:css3">collection of demos</a> showing the <u>latest CSS technologies</u> in action: a boost for the creativity.</p>
+ </li>
+</ul>
+<h2 id="Dos_columnas">Dos columnas</h2>
+<p>Dos columnas separadas con un borde gris. Normalmente usadas en páginas de destino. Clase de CSS: <code>.topicpage-table</code> (L 830 - 837 &amp; 82-93 in CustomCSS).</p>
+<div class="row topicpage-table">
+ <div class="section">
+  Columna 1</div>
+ <div class="section">
+  Columna 2</div>
+</div>
+<p> </p>
+<h2 id="Columnas_con_la_misma_altura">Columnas con la misma altura</h2>
+<p>Se usa en la página de destino de <a href="/en-US/Firefox_OS">Firefox OS</a> para envolver las columnas que deberían tener el mismo alto. Clase de CSS: <code>.equalColumnHeights</code> (L 25 - 38 in CustomCSS).</p>
+<div class="equalColumnHeights">
+ <div class="zone-callout">
+  Un Texo<br>
+  y nueva linea<br>
+   </div>
+ <div class="zone-callout">
+  Otro texto<br>
+  <br>
+  aquí</div>
+</div>
+<p> </p>
diff --git a/files/es/mdn/guidelines/project_colon_guía_de_estilo/index.html b/files/es/mdn/guidelines/project_colon_guía_de_estilo/index.html
deleted file mode 100644
index 40bffd16ca..0000000000
--- a/files/es/mdn/guidelines/project_colon_guía_de_estilo/index.html
+++ /dev/null
@@ -1,146 +0,0 @@
----
-title: Guía de estilo
-slug: 'MDN/Guidelines/Project:Guía_de_estilo'
-tags:
-  - Proyecto_MDC
-  - Todas_las_Categorías
-translation_of: MDN/Guidelines/Writing_style_guide
----
-<div>{{MDNSidebar}}</div>
-
-<p><span class="seoSummary">Para mostrar la documentación de forma organizada, estandarizada y fácil de leer, la guía de estilos de MDN describe cómo debe organizarse, escribirse y formatearse el texto. Se trata de pautas más que de reglas estrictas.</span> Interesa más el contenido que el formato, así que no te sientas obligado a aprenderte la guía de estilos antes de colaborar. No te enojes ni te sorprendas si después un voluntario edita tu trabajo para que quede de acuerdo con esta guía.</p>
-
-<p>Los aspectos lingüísticos de esta guía se refieren principalmente a la documentación en idioma inglés.Se pueden (y se anima a) crear guías de estilo en otros idiomas. Estas deben publicarse como subpáginas de la página del equipo de localización.</p>
-
-<p>Si buscas especificaciones de cómo debe estructurarse un determinado tipo de página, mira la <a href="https://developer.mozilla.org/en-US/docs/MDN/Contribute/Content/Layout" style="line-height: 1.5;">guía de diseño de MDN</a>.</p>
-
-<p>Aquí se enumeran los usos y costumbres recomendados a la hora de editar los artículos de este wiki. Si ves que falta contenido o crees que deberíamos mejorar o corregir algo, por favor coméntalo en la página de discusión.</p>
-
-<h2 id="Uso_de_may.C3.BAsculas_en_el_nombre_de_las_p.C3.A1ginas_y_los_encabezados" name="Uso_de_may.C3.BAsculas_en_el_nombre_de_las_p.C3.A1ginas_y_los_encabezados">Uso de mayúsculas en el nombre de las páginas y los encabezados</h2>
-
-<ul>
- <li>Cuando escribas los nombres de las páginas y de los encabezados, recuerda que sólo debe empezar con mayúscula la primera palabra de la frase.
-  <ul>
-   <li><font color="green"><strong>Correcto</strong></font>: "Guía de estilo"</li>
-   <li><font color="red"><strong>Incorrecto</strong></font>: "Guía de Estilo"</li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Infinitivos_y_gerundios" name="Infinitivos_y_gerundios">Infinitivos y gerundios</h2>
-
-<ul>
- <li>En inglés, una práctica muy habitual es la de utilizar verbos acabados en "-ing" en los títulos: "Configuring Firefox", por ejemplo. En estos casos la traducción correcta al español consiste en utilizar el infinitivo del verbo y no el gerundio.
-  <ul>
-   <li><font color="green"><strong>Correcto</strong></font>: Configurar Firefox</li>
-   <li><font color="red"><strong>Incorrecto</strong></font>: Configurando Firefox</li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Siglas_y_abreviaturas" name="Siglas_y_abreviaturas">Siglas y abreviaturas</h2>
-
-<h3 id="Capitalizaci.C3.B3n_y_espaciado" name="Capitalizaci.C3.B3n_y_espaciado">Mayúsculas y espacios</h3>
-
-<ul>
- <li>Escribe las siglas en mayúsculas y sin puntos.
-  <ul>
-   <li><font color="green"><strong>Correcto</strong></font>: XUL</li>
-   <li><font color="red"><strong>Incorrecto</strong></font>: X.U.L.; Xul</li>
-  </ul>
- </li>
-</ul>
-
-<h3 id="Expansi.C3.B3n" name="Expansi.C3.B3n">Expansión</h3>
-
-<ul>
- <li>Siempre que sea posible, cuando uses siglas deberás expandirlas, es decir, explicar su significado. Recuerda que esto es necesario sólo la primera vez que dicha sigla aparezca en tu artículo.
-  <ul>
-   <li><font color="green"><strong>Correcto</strong></font>: "SVG (Gráficos vectoriales escalables) es un lenguaje de marcado XML..."</li>
-   <li><font color="red"><strong>Incorrecto</strong></font>: "SVG es un lenguaje de marcado XML..."</li>
-  </ul>
- </li>
-</ul>
-
-<ul>
- <li>También existe la opción de usar el elemento abbr:
-  <ul>
-   <li>El siguiente código: <span class="nowiki">&lt;abbr title='Gráficos vectoriales escalables'&gt;SVG&lt;/abbr&gt;</span></li>
-   <li>Se muestra de la siguiente forma: <abbr title="Gráficos vectoriales escalables">SVG</abbr></li>
-  </ul>
- </li>
-</ul>
-
-<h3 id="Plurales" name="Plurales">Plurales</h3>
-
-<ul>
- <li>Para indicar el plural de una sigla usas "s".
-  <ul>
-   <li><font color="green"><strong>Correcto</strong></font>: CD-ROMs</li>
-   <li><font color="red"><strong>Incorrecto</strong></font>: CD-ROM's</li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="N.C3.BAmeros" name="N.C3.BAmeros">Números</h2>
-
-<h3 id="Fechas" name="Fechas">Fechas</h3>
-
-<ul>
- <li>Para las fechas usa el formato: día mes año.
-  <ul>
-   <li><font color="green"><strong>Correcto</strong></font>: 1 de enero de 2006</li>
-   <li><font color="red"><strong>Incorrecto</strong></font>: 01/02/06</li>
-  </ul>
- </li>
-</ul>
-
-<h3 id="Cantidades" name="Cantidades">Cantidades</h3>
-
-<ul>
- <li>Usa coma para separar los decimales y punto para indicar miles:
-  <ul>
-   <li><font color="green"><strong>Correcto</strong></font>: 1,5 GB son 1.536 MB</li>
-   <li><font color="red"><strong>Incorrecto</strong></font>: 1.5 GB son 1536 MB</li>
-  </ul>
- </li>
-</ul>
-
-<p>Esta regla tiene una excepción: en un documento que trate del lenguaje 'X', las cantidades deben expresarse del modo definido por ese lenguaje.</p>
-
-<h2 id="Usted.2C_t.C3.BA.2C_y_yo" name="Usted.2C_t.C3.BA.2C_y_yo">Usted, tú y yo</h2>
-
-<h3 id="El_tuteo" name="El_tuteo">El tuteo</h3>
-
-<p>Este es un problema complejo, puede que no exista la solución perfecta a gusto de todos. Pero sería interesante ponernos de acuerdo.</p>
-
-<p>Por lo pronto, hemos decidido usar el tú y evitar regionalismos en nuestras traducciones. Te invitamos a comentar tus opiniones en nuestra lista de correo. </p>
-
-<h3 id="La_1ª_persona">La 1ª persona</h3>
-
-<p>Salvo rarísimas excepciones, nunca debe usarse.</p>
-
-<ul>
- <li><font color="green"><strong>Correcto</strong></font>: es recomendable...</li>
- <li><font color="red"><strong>Incorrecto</strong></font>: te recomiendo...</li>
-</ul>
-
-<h2 id="Otras_guías_de_estilo_recomendadas">Otras guías de estilo recomendadas</h2>
-
-<p>Si tienes dudas sobre usos y estilos que no sean tratados en este documento, te recomendamos consultar:</p>
-
-<ul>
- <li><a class="external" href="http://usuario.cicese.mx/~mechevar/manual/">Manual de estilo del CICESE</a> Sobre como escribir documentación técnica.</li>
- <li><a class="external" href="http://es.wikipedia.org/wiki/Manual_de_estilo">Manual de estilo de Wikipedia</a> Sobre como escribir en un wiki.</li>
-</ul>
-
-<p>Los traductores también deberían consultar <a href="/Project:en/Writer%27s_guide">Writer's guide</a> para conocer el estilo usado en la edición inglesa.</p>
-
-<h2 id="Diccionarios_recomendados" name="Diccionarios_recomendados">Diccionarios recomendados</h2>
-
-<p>Si tienes dudas sobre gramática y ortografía, puedes visitar:</p>
-
-<ul>
- <li><a class="external" href="http://www.rae.es/rae.html"><abbr title="Real Academia Española">Diccionario de la Real Academia Española</abbr></a></li>
- <li><a class="external" href="http://www.rae.es/rae.html" title="http://www.rae.es/rae.html">Diccionario Panhispánico de Dudas</a></li>
-</ul>
diff --git a/files/es/mdn/guidelines/writing_style_guide/index.html b/files/es/mdn/guidelines/writing_style_guide/index.html
new file mode 100644
index 0000000000..7f9255a324
--- /dev/null
+++ b/files/es/mdn/guidelines/writing_style_guide/index.html
@@ -0,0 +1,147 @@
+---
+title: Guía de estilo
+slug: MDN/Guidelines/Writing_style_guide
+tags:
+  - Proyecto_MDC
+  - Todas_las_Categorías
+translation_of: MDN/Guidelines/Writing_style_guide
+original_slug: MDN/Guidelines/Project:Guía_de_estilo
+---
+<div>{{MDNSidebar}}</div>
+
+<p><span class="seoSummary">Para mostrar la documentación de forma organizada, estandarizada y fácil de leer, la guía de estilos de MDN describe cómo debe organizarse, escribirse y formatearse el texto. Se trata de pautas más que de reglas estrictas.</span> Interesa más el contenido que el formato, así que no te sientas obligado a aprenderte la guía de estilos antes de colaborar. No te enojes ni te sorprendas si después un voluntario edita tu trabajo para que quede de acuerdo con esta guía.</p>
+
+<p>Los aspectos lingüísticos de esta guía se refieren principalmente a la documentación en idioma inglés.Se pueden (y se anima a) crear guías de estilo en otros idiomas. Estas deben publicarse como subpáginas de la página del equipo de localización.</p>
+
+<p>Si buscas especificaciones de cómo debe estructurarse un determinado tipo de página, mira la <a href="https://developer.mozilla.org/en-US/docs/MDN/Contribute/Content/Layout" style="line-height: 1.5;">guía de diseño de MDN</a>.</p>
+
+<p>Aquí se enumeran los usos y costumbres recomendados a la hora de editar los artículos de este wiki. Si ves que falta contenido o crees que deberíamos mejorar o corregir algo, por favor coméntalo en la página de discusión.</p>
+
+<h2 id="Uso_de_may.C3.BAsculas_en_el_nombre_de_las_p.C3.A1ginas_y_los_encabezados" name="Uso_de_may.C3.BAsculas_en_el_nombre_de_las_p.C3.A1ginas_y_los_encabezados">Uso de mayúsculas en el nombre de las páginas y los encabezados</h2>
+
+<ul>
+ <li>Cuando escribas los nombres de las páginas y de los encabezados, recuerda que sólo debe empezar con mayúscula la primera palabra de la frase.
+  <ul>
+   <li><font color="green"><strong>Correcto</strong></font>: "Guía de estilo"</li>
+   <li><font color="red"><strong>Incorrecto</strong></font>: "Guía de Estilo"</li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Infinitivos_y_gerundios" name="Infinitivos_y_gerundios">Infinitivos y gerundios</h2>
+
+<ul>
+ <li>En inglés, una práctica muy habitual es la de utilizar verbos acabados en "-ing" en los títulos: "Configuring Firefox", por ejemplo. En estos casos la traducción correcta al español consiste en utilizar el infinitivo del verbo y no el gerundio.
+  <ul>
+   <li><font color="green"><strong>Correcto</strong></font>: Configurar Firefox</li>
+   <li><font color="red"><strong>Incorrecto</strong></font>: Configurando Firefox</li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Siglas_y_abreviaturas" name="Siglas_y_abreviaturas">Siglas y abreviaturas</h2>
+
+<h3 id="Capitalizaci.C3.B3n_y_espaciado" name="Capitalizaci.C3.B3n_y_espaciado">Mayúsculas y espacios</h3>
+
+<ul>
+ <li>Escribe las siglas en mayúsculas y sin puntos.
+  <ul>
+   <li><font color="green"><strong>Correcto</strong></font>: XUL</li>
+   <li><font color="red"><strong>Incorrecto</strong></font>: X.U.L.; Xul</li>
+  </ul>
+ </li>
+</ul>
+
+<h3 id="Expansi.C3.B3n" name="Expansi.C3.B3n">Expansión</h3>
+
+<ul>
+ <li>Siempre que sea posible, cuando uses siglas deberás expandirlas, es decir, explicar su significado. Recuerda que esto es necesario sólo la primera vez que dicha sigla aparezca en tu artículo.
+  <ul>
+   <li><font color="green"><strong>Correcto</strong></font>: "SVG (Gráficos vectoriales escalables) es un lenguaje de marcado XML..."</li>
+   <li><font color="red"><strong>Incorrecto</strong></font>: "SVG es un lenguaje de marcado XML..."</li>
+  </ul>
+ </li>
+</ul>
+
+<ul>
+ <li>También existe la opción de usar el elemento abbr:
+  <ul>
+   <li>El siguiente código: <span class="nowiki">&lt;abbr title='Gráficos vectoriales escalables'&gt;SVG&lt;/abbr&gt;</span></li>
+   <li>Se muestra de la siguiente forma: <abbr title="Gráficos vectoriales escalables">SVG</abbr></li>
+  </ul>
+ </li>
+</ul>
+
+<h3 id="Plurales" name="Plurales">Plurales</h3>
+
+<ul>
+ <li>Para indicar el plural de una sigla usas "s".
+  <ul>
+   <li><font color="green"><strong>Correcto</strong></font>: CD-ROMs</li>
+   <li><font color="red"><strong>Incorrecto</strong></font>: CD-ROM's</li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="N.C3.BAmeros" name="N.C3.BAmeros">Números</h2>
+
+<h3 id="Fechas" name="Fechas">Fechas</h3>
+
+<ul>
+ <li>Para las fechas usa el formato: día mes año.
+  <ul>
+   <li><font color="green"><strong>Correcto</strong></font>: 1 de enero de 2006</li>
+   <li><font color="red"><strong>Incorrecto</strong></font>: 01/02/06</li>
+  </ul>
+ </li>
+</ul>
+
+<h3 id="Cantidades" name="Cantidades">Cantidades</h3>
+
+<ul>
+ <li>Usa coma para separar los decimales y punto para indicar miles:
+  <ul>
+   <li><font color="green"><strong>Correcto</strong></font>: 1,5 GB son 1.536 MB</li>
+   <li><font color="red"><strong>Incorrecto</strong></font>: 1.5 GB son 1536 MB</li>
+  </ul>
+ </li>
+</ul>
+
+<p>Esta regla tiene una excepción: en un documento que trate del lenguaje 'X', las cantidades deben expresarse del modo definido por ese lenguaje.</p>
+
+<h2 id="Usted.2C_t.C3.BA.2C_y_yo" name="Usted.2C_t.C3.BA.2C_y_yo">Usted, tú y yo</h2>
+
+<h3 id="El_tuteo" name="El_tuteo">El tuteo</h3>
+
+<p>Este es un problema complejo, puede que no exista la solución perfecta a gusto de todos. Pero sería interesante ponernos de acuerdo.</p>
+
+<p>Por lo pronto, hemos decidido usar el tú y evitar regionalismos en nuestras traducciones. Te invitamos a comentar tus opiniones en nuestra lista de correo. </p>
+
+<h3 id="La_1ª_persona">La 1ª persona</h3>
+
+<p>Salvo rarísimas excepciones, nunca debe usarse.</p>
+
+<ul>
+ <li><font color="green"><strong>Correcto</strong></font>: es recomendable...</li>
+ <li><font color="red"><strong>Incorrecto</strong></font>: te recomiendo...</li>
+</ul>
+
+<h2 id="Otras_guías_de_estilo_recomendadas">Otras guías de estilo recomendadas</h2>
+
+<p>Si tienes dudas sobre usos y estilos que no sean tratados en este documento, te recomendamos consultar:</p>
+
+<ul>
+ <li><a class="external" href="http://usuario.cicese.mx/~mechevar/manual/">Manual de estilo del CICESE</a> Sobre como escribir documentación técnica.</li>
+ <li><a class="external" href="http://es.wikipedia.org/wiki/Manual_de_estilo">Manual de estilo de Wikipedia</a> Sobre como escribir en un wiki.</li>
+</ul>
+
+<p>Los traductores también deberían consultar <a href="/Project:en/Writer%27s_guide">Writer's guide</a> para conocer el estilo usado en la edición inglesa.</p>
+
+<h2 id="Diccionarios_recomendados" name="Diccionarios_recomendados">Diccionarios recomendados</h2>
+
+<p>Si tienes dudas sobre gramática y ortografía, puedes visitar:</p>
+
+<ul>
+ <li><a class="external" href="http://www.rae.es/rae.html"><abbr title="Real Academia Española">Diccionario de la Real Academia Española</abbr></a></li>
+ <li><a class="external" href="http://www.rae.es/rae.html" title="http://www.rae.es/rae.html">Diccionario Panhispánico de Dudas</a></li>
+</ul>
diff --git a/files/es/mdn/kuma/contributing/getting_started/index.html b/files/es/mdn/kuma/contributing/getting_started/index.html
deleted file mode 100644
index afe0ce3b5a..0000000000
--- a/files/es/mdn/kuma/contributing/getting_started/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
----
-title: Primeros pasos
-slug: MDN/Kuma/Contributing/Getting_started
-translation_of: MDN/Kuma
-translation_of_original: MDN/Kuma/Contributing/Getting_started
----
-<div>{{MDNSidebar}}</div><p>Por favor, consulte los <a href="https://github.com/mozilla/kuma/blob/master/docs/installation-vagrant.rst" title="https://github.com/mozilla/kuma/blob/master/docs/installation-vagrant.rst">Documentos de Instalacion de Kuma en GitHub</a> hasta que podamos redactar una mejor guía de "Primeros pasos".</p>
-<h2 id="Solución_de_problemas">Solución de problemas</h2>
-<p>A veces las cosas se ponen mal y la configuración de la prueba Kuma en el equipo deja de funcionar correctamente. Aquí ofrecemos algunas sugerencias sobre qué hacer para tratar de conseguir que funcione de nuevo.</p>
-<h3 id="Reprovision">Reprovision</h3>
-<p>La primera cosa a intentar es destruir y reconstruir su máquina virtual Kuma. Abra una terminal, pasar a la <code>kuma</code> directorio del proyecto y ejecute el siguiente comando:</p>
-<pre>vagrant destroy &amp;&amp; vagrant provision</pre>
-<p>Si desea mantener la base de datos que ya tiene, asegúrese de hacer una copia de seguridad y restaurar después de reaprovisionamiento.</p>
-<h3 id="Vuelva_a_descargar_la_imagen_de_la_VM">Vuelva a descargar la imagen de la VM</h3>
-<p>Si le preocupa que la imagen de VM es mala o no está actualizada, puede forzar el vagrant para descargar una nueva mediante el comando siguiente::</p>
-<pre>vagrant box remove kuma-ubuntu</pre>
diff --git a/files/es/mdn/kuma/contributing/index.html b/files/es/mdn/kuma/contributing/index.html
deleted file mode 100644
index 9fc477a01b..0000000000
--- a/files/es/mdn/kuma/contributing/index.html
+++ /dev/null
@@ -1,50 +0,0 @@
----
-title: Contribuir a Kuma
-slug: MDN/Kuma/Contributing
-translation_of: MDN/Kuma
-translation_of_original: MDN/Kuma/Contributing
----
-<div>{{MDNSidebar}}</div><p>Si desea contribuir al proyecto de Kuma para ayudarnos a construir una gran plataforma wiki y para hacer que el sitio de Mozilla Developer Network aun mejor, los documentos aquí deberían ayudarle a unirse en el esfuerzo.</p>
-<div class="row topicpage-table">
- <div class="section">
-  <h2 class="Documentation" id="Documentation" name="Documentation">Contribuir a Kuma</h2>
-  <dl>
-   <dt>
-    <a href="/en-US/docs/Project:MDN/Kuma/Contributing/Getting_started" title="/en-US/docs/Project:About">Cómo empezar con Kuma</a></dt>
-   <dd>
-    Cómo bifurcar Kuma desde Github y configurar el entorno de desarrollo.</dd>
-   <dt>
-    <a href="/en-US/docs/Project:MDN/Kuma/Contributing/Help_wanted" title="/en-US/docs/Project:MDN/Kuma/Contributing/Help_wanted">Se busca ayuda</a></dt>
-   <dd>
-    Tenemos un montón de fallos registrados en Kuma. Este artículo se enumeran algunos, nos encantaría ver colaboradores que ayudan con.</dd>
-  </dl>
-  <h2 class="Tools" id="Tools" name="Tools">Herramientas y tareas</h2>
-  <dl>
-   <dt>
-    <a href="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936" title="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936">Errores</a></dt>
-   <dd>
-    Una lista de errores Kuma; siéntase libre de mirar a través de ellos y encontrar algo que te gustaría para arreglar. Este enlace le exige que inicie sesión en Bugzilla.</dd>
-   <dt>
-    <a href="https://bugzilla.mozilla.org/form.mdn" title="https://bugzilla.mozilla.org/enter_bug.cgi?product=Mozilla%20Developer%20Network">Notificar un error</a></dt>
-   <dd>
-    Si usted ha tenido un problema con Kuma, o tiene alguna idea para una manera de hacerlo mejor; usted puede presentar un error</dd>
-   <dt>
-    <a href="/en-US/docs/Project:MDN/Kuma/Changelog" title="/en-US/docs/Project:MDN/Kuma/Changelog">Cambio de registro</a></dt>
-   <dd>
-    Una lista de reciente de modificaciones impulsadas; este es un gran lugar para buscar, para ver lo que ha pasado recientemente.</dd>
-  </dl>
-  <p> </p>
- </div>
- <div class="section">
-  <h2 class="Community" id="Community" name="Community">MDN comunidad de desarrolladores</h2>
-  <p><span style="display: none;"> </span>Si desea hablar con nuestros desarrolladores, o incluso mejor, para ayudar a construir y mejorar la plataforma de Kuma, !únase a nuestra comunidad de desarrolladores!</p>
-  <ul>
-   <li>Únase a la conversación en el IRC: <a href="irc://irc.mozilla.org/mdndev" title="irc://irc.mozilla.org/mdndev">#mdndev</a></li>
-   <li>Lea el foro de desarrolladores MDN: {{DiscussionList("dev-mdn", "mozilla.dev.mdn")}}</li>
-  </ul>
-  <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p>
- </div>
-</div>
-<p><span class="alllinks"><a href="/en-US/docs/tag/MDC_Project" title="MDN project pages">Ver todos ...</a></span></p>
-<div id="cke_pastebin" style="position: absolute; top: 672px; width: 1px; height: 1px; overflow: hidden; left: -1000px;">
-  </div>
diff --git a/files/es/mdn/kuma/index.html b/files/es/mdn/kuma/index.html
deleted file mode 100644
index b7b0de4fd9..0000000000
--- a/files/es/mdn/kuma/index.html
+++ /dev/null
@@ -1,55 +0,0 @@
----
-title: Kuma
-slug: MDN/Kuma
-translation_of: MDN/Kuma
----
-<div>{{MDNSidebar}}</div>
-
-<p>Kuma es la plataforma wiki que impulsa Mozilla Developer Network. Es una plataforma open source escrita en <a href="http://www.python.org/" title="http://www.python.org/">Python</a> usando el framework <a href="https://www.djangoproject.com/" title="https://www.djangoproject.com/">Django</a>.</p>
-
-<div class="row topicpage-table">
-<div class="section">
-<h2 class="Documentation" id="Documentation" name="Documentation">Documentación de Kuma</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Project:MDN/Kuma/API" title="/en-US/docs/Project:About">The Kuma API</a></dt>
- <dd>Kuma provee una API simple que te permite acceder a la información sobre las páginas e incluso para poner nuevo contenido en las páginas.</dd>
- <dt><a href="/en-US/docs/Project:Introduction_to_KumaScript" title="/en-US/docs/Project:Introduction_to_KumaScript">Introducción a KumaScript</a>:</dt>
- <dd>...el lenguaje de plantillas de Kuma.</dd>
- <dt><a href="/en-US/docs/Project:MDN/Kuma/KumaScript_guide" title="/en-US/docs/Project:MDN/Kuma/KumaScript_guide">Usando KumaScript y las plantillas</a></dt>
- <dd>Una guía de cómo usar las plantillas KumaScript en el contenido del artículo.</dd>
- <dt><a href="/en-US/docs/Project:MDN/Kuma/KumaScript_reference" title="/en-US/docs/Project:MDN/Kuma/KumaScript_reference">Referencia KumaScript</a></dt>
- <dd>Una referencia a KumaScript.</dd>
- <dt><a href="/en-US/docs/Project:MDN/Kuma/Contributing" style="line-height: 1.5; font-weight: bold;" title="/en-US/docs/Project:MDN/Kuma/Contributing">Contribuyendo a Kuma</a></dt>
- <dd>Una guía para forkear Kuma y contribuir al proyecto.</dd>
-</dl>
-
-<p>Artículos antiguos para clasificar:</p>
-
-<ul>
- <li><a href="/en-US/docs/Project:Getting_started_with_Kuma" title="/en-US/docs/Project:Getting_started_with_Kuma">Iniciando con Kuma</a>: información sobre la plataforma; diferencias entre Kuma y la plataforma Mindtouch Deki.</li>
- <li><a href="/en-US/docs/Project:MDC_editor_guide" title="/en-US/docs/Project:MDC_editor_guide">La interfaz de edición de MDN</a>: atajos de teclado; Descripción de los componentes de la interfaz y las funciones.</li>
-</ul>
-
-<p><span class="alllinks"><a href="/en-US/docs/tag/Kuma" title="MDN project pages">Ver todos...</a></span></p>
-</div>
-
-<div class="section">
-<h2 id="Herramientas_y_tareas">Herramientas y tareas</h2>
-
-<dl>
- <dt><a href="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936" title="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936">Bugs</a></dt>
- <dd>Una lista de los bugs de Kuma. Sientase libre para buscar lo que quiera y lo que quieras arreglas! <em>Este link requiere que entres en Bugzilla con su respectiva cuenta.</em></dd>
- <dt><a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Mozilla%20Developer%20Network" title="https://bugzilla.mozilla.org/enter_bug.cgi?product=Mozilla%20Developer%20Network">Reportar un bug</a></dt>
- <dd>Si usted tiene un problema con Kuma, o tiene una idea para hacerlo mejor, <span style="color: #545454; font-family: arial,sans-serif; font-size: small; line-height: 18.200000762939453px;">¡</span><span style="line-height: 1.5;">tú puedes reportar un bug!</span></dd>
- <dt><a href="/en-US/docs/Project:MDN/Kuma/Changelog" title="/en-US/docs/Project:MDN/Kuma/Changelog">Cambios</a></dt>
- <dd>Una lista de los cambios recientes; este es un buen lugar para ver qué ha pasado recientemente.</dd>
- <dt><a href="http://mzl.la/mdn_whats_deployed">¿Qué ha sido implementado?</a></dt>
- <dd>Un tablero de estado de qué ha sido implementado al servidor de producción.</dd>
- <dt><a href="https://mdn.kanbanery.com/projects/32137/board/?key=0383ba5f05e165e0eb19d8476654fe9775ce2ca7" title="https://mdn.kanbanery.com/projects/32137/board/?key=0383ba5f05e165e0eb19d8476654fe9775ce2ca7">Kanban board</a></dt>
- <dd>The Kanban board used for managing ongoing work on the Kuma project.</dd>
- <dt><a href="/en-US/docs/Project:MDN/ServerCharts">Server Monitoring</a></dt>
- <dd>Some of our New Relic charts</dd>
-</dl>
-</div>
-</div>
diff --git a/files/es/mdn/structures/compatibility_tables/index.html b/files/es/mdn/structures/compatibility_tables/index.html
new file mode 100644
index 0000000000..73c3ef2464
--- /dev/null
+++ b/files/es/mdn/structures/compatibility_tables/index.html
@@ -0,0 +1,477 @@
+---
+title: >-
+  Tablas de compatibilidad y repositorio de datos de compatibilidad del
+  navegador (DCN)
+slug: MDN/Structures/Compatibility_tables
+tags:
+  - Estructuras
+  - Guía
+  - Meta MDN
+  - compatibilidad con el navegador
+  - tablas de compatibilidad
+translation_of: MDN/Structures/Compatibility_tables
+original_slug: MDN/Structures/Tablas_de_compatibilidad
+---
+<div>{{MDNSidebar}}</div>
+
+<p class="summary"><span class="seoSummary">MDN tiene un formato estándar para tablas de compatibilidad para nuestra documentación web abierta; es decir, documentación de tecnologías como DOM, HTML, CSS, JavaScript, SVG, etc., que se comparte en todos los navegadores.</span> Este artículo es una guía de "introducción" sobre cómo agregar y mantener la base de datos a partir de la cual se generan las tablas de compatibilidad, además de cómo integrar las tablas en artículos.</p>
+
+<p class="summary">Para obtener documentación más avanzada, así como los últimos cambios en los procesos y los esquemas JSON utilizados para representar los datos, échale un vistazo al repositorio de datos de la <a href="https://github.com/mdn/browser-compat-data/blob/master/docs/contributing.md">guía para colaboradores</a>, así como a la <a href="https://github.com/mdn/browser-compat-data/blob/master/docs/data-guidelines.md">guía de directrices de datos</a>.</p>
+
+<p class="summary">Si tienes preguntas o descubres problemas, compártelos con nosotros en el <a href="https://discourse.mozilla-community.org/c/mdn">foro de discusión de MDN</a>.</p>
+
+<h2 id="Cómo_acceder_al_repositorio_de_datos">Cómo acceder al repositorio de datos</h2>
+
+<p>Los datos se almacenan en un repositorio de GitHub; consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>. Para acceder a él, necesitas tener una cuenta de GitHub, bifurcar el repositorio de compatibilidad de datos del navegador en tu propia cuenta y luego clonar tu bifurcación en tu máquina local.</p>
+
+<h2 id="Preparándose_para_agregar_los_datos">Preparándose para agregar los datos</h2>
+
+<p>Antes de agregar algunos datos nuevos, te debes asegurar de que tu bifurcación esté actualizada con el repositorio principal (contiene el mismo contenido), crea una nueva rama dentro de tu bifurcación para contener tus adiciones, luego ingresa esa rama en tu clon local para que puedas empezar a trabajar dentro de ella:</p>
+
+<p>Veamos la siguiente sencilla forma de asegurarte de que tu bifurcación esté actualizada:</p>
+
+<h3 id="Agregar_el_repositorio_principal_de_datos_de_compatibilidad_del_navegador_como_remoto">Agregar el repositorio principal de datos de compatibilidad del navegador como remoto</h3>
+
+<p>Ve al clon local de tu bifurcación en tu terminal/línea de comandos, y agrega un control remoto que apunte al repositorio principal (<code>upstream</code>) de esa manera (solo necesitas hacer esto una vez):</p>
+
+<pre class="brush: bash notranslate">git remote add upstream https://github.com/mdn/browser-compat-data.git</pre>
+
+<p>Si no estás seguro de haber hecho esto, puedes verificar qué controles remotos tiene tu repositorio usando</p>
+
+<pre class="brush: bash notranslate">git remote -v</pre>
+
+<h3 id="Actualiza_tu_bifurcación_con_el_contenido_del_remoto">Actualiza tu bifurcación con el contenido del remoto</h3>
+
+<p>Ahora, siempre que desees actualizar tu bifurcación, lo puedes hacer mediante:</p>
+
+<ol>
+ <li>
+  <p>Asegúrate de que estas en la rama <code>master</code>:</p>
+
+  <pre class="brush: bash notranslate">git checkout master</pre>
+ </li>
+ <li>
+  <p>obtén el contenido actualizado del repositorio utilizando lo siguiente:</p>
+
+  <pre class="brush: bash notranslate">git fetch upstream</pre>
+ </li>
+ <li>
+  <p>rebasa el contenido de tu <code>master</code> con el contenido del repositorio principal:</p>
+
+  <pre class="brush: bash notranslate">git rebase upstream/master</pre>
+ </li>
+ <li>
+  <p>empuja estas actualizaciones a tu bifurcación remota usando lo siguiente:</p>
+
+  <pre class="brush: bash notranslate">git push</pre>
+ </li>
+</ol>
+
+<h3 id="Crea_una_nueva_rama_para_hacer_tu_trabajo">Crea una nueva rama para hacer tu trabajo</h3>
+
+<p>A continuación, ve a tu bifurcación remota (estará en <code>https://github.com/<em>tu-nombre-de-usuario</em>/browser-compat-data</code>) y crea una nueva rama para almacenar tus cambios para esta adición de datos. Esto lo puedes hacer mediante:</p>
+
+<ol>
+ <li>Un clic en el botón "Rama: Master".</li>
+ <li>Ingresa un nuevo nombre para la rama en el campo de texto "Buscar o crear una rama...".</li>
+ <li>Presiona el botón resultante "Crear rama <em>nombre-de-rama</em> desde Master".</li>
+</ol>
+
+<p>Por ejemplo, si quisieras agregar datos para la API WebVR, crearías una rama llamada algo así como "webvr".</p>
+
+<h3 id="Cambia_a_la_nueva_rama">Cambia a la nueva rama</h3>
+
+<p>En este punto, regresa a tu terminal/línea de comando y actualiza el clon local de tu bifurcación para incluir tu nueva rama usando el siguiente comando:</p>
+
+<pre class="brush: bash notranslate">git pull</pre>
+
+<p>Ahora cambia a tu nueva rama usando esto:</p>
+
+<pre class="brush: bash notranslate">git checkout <em>nombre-de-rama</em></pre>
+
+<p>¡Ahora debería estar listo para comenzar a agregar tus datos!</p>
+
+<h2 id="Añadir_los_datos">Añadir los datos</h2>
+
+<p>Para agregar los datos, debes crear un nuevo archivo o archivos para almacenar tus datos de compatibilidad. Los archivos que necesitas crear difieren, según la tecnología en la que estés trabajando:</p>
+
+<ul>
+ <li><strong><a href="/es/docs/Web/HTML">HTML</a>:</strong> Un archivo por elemento HTML, contenido en <a href="https://github.com/mdn/browser-compat-data/tree/master/html/elements">browser-compat-data/html/elements</a>. El archivo se debe denominar con el nombre del elemento, todo en minúsculas, p. ej. <code>div.json</code>.</li>
+ <li><strong><a href="/es/docs/Web/CSS">CSS</a>:</strong>Un archivo por propiedad CSS o selector, contenido en el directorio apropiado (consulta <a href="https://github.com/mdn/browser-compat-data/tree/master/css">browser-compat-data/css</a>). El archivo debe tener el nombre de la función, todo en minúsculas, p. ej. <code>background-color.json</code> o <code>hover.json</code>.</li>
+ <li><strong><a href="/es/docs/Web/JavaScript">JS</a>:</strong> Un archivo por objeto JS, contenido en <a href="https://github.com/mdn/browser-compat-data/tree/master/javascript/builtins">browser-compat-data/javascript/builtins</a>. El archivo se debe denominar con el nombre exacto del objeto, conservando la envoltura, p. ej. <code>Date.json</code> o <code>InternalError.json</code>.</li>
+ <li><strong><a href="/es/docs/Web/API">APIs</a>:</strong> Un archivo por interfaz contenida en la API, ponlo en <a href="https://github.com/mdn/browser-compat-data/tree/master/api">browser-compat-data/api</a>. Cada archivo se debe denominar con el nombre exacto de la interfaz, conservando la envoltura, p. ej. La API de WebVR tiene <code>VRDisplay.json</code>, <code>VRDisplayCapabilities.json</code>, etc.</li>
+</ul>
+
+<p>Cada archivo que crees debe seguir el patrón definido en el esquema contenido en nuestro repositorio; puedes ver la <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md">descripción detallada del esquema aquí</a>.</p>
+
+<h3 id="Estructura_básica_de_datos_de_compatibilidad">Estructura básica de datos de compatibilidad</h3>
+
+<p>Veamos un ejemplo. Los archivos JSON de propiedades CSS, por ejemplo, necesitan la siguiente estructura básica:</p>
+
+<pre class="brush: json notranslate">{
+  "css": {
+    "properties": {
+      "border-width": {
+        "__compat": {
+          ...
+        }
+      }
+    }
+  }
+}</pre>
+
+<p>Tienes el objeto <code>css</code>, dentro del cual hay un objeto <code>properties</code>. Dentro del objeto <code>properties</code>, necesitas un miembro para cada una de las características específicas para las que deseas definir los datos de compatibilidad. Cada uno de estos miembros tiene un miembro <code>__compat</code>, dentro del cual van los datos reales.</p>
+
+<p>Los datos anteriores se encuentran en el archivo: <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/border-width.json">border-width.json</a> compáralo con la <a href="/es/docs/Web/CSS/border-width#Browser_compatibility">tabla de soporte de <code>border-width</code> representada en MDN</a>.</p>
+
+<p>Otros tipos de características funcionan de la misma manera, pero con diferentes nombres de objeto:</p>
+
+<ul>
+ <li>Los selectores de CSS funcionan básicamente de la misma manera que las propiedades de CSS, excepto que la estructura del objeto de nivel superior es <code>css.selectors</code> en lugar de <code>css.properties</code>. Consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/css/selectors/cue.json">cue.json</a> para ver un ejemplo.</li>
+ <li>Los datos HTML funcionan básicamente de la misma manera, excepto que la estructura del objeto de nivel superior es <code>html.elements</code>. Consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/html/elements/article.json">article.json</a> para ver un ejemplo.</li>
+ <li>La estructura del objeto de nivel superior para los objetos incorporados de JS es <code>javascript.builtins</code>; consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/builtins/Array.json">Array.json</a> para ver un ejemplo.</li>
+</ul>
+
+<div>
+<p>En páginas HTML, CSS y JS, normalmente solo necesitarás una función. Las interfaces de API funcionan de forma ligeramente diferente — siempre tienen varias subcaracterísticas (consulta {{anch("Sub-features", "Subcaracterísticas")}}, a continuación).</p>
+
+<h3 id="Estructura_básica_dentro_de_una_característica">Estructura básica dentro de una característica</h3>
+
+<p>Dentro de un miembro de función <code>__compat</code>, debes incluir los siguientes miembros:</p>
+
+<ul>
+ <li><code>mdn_url</code>: contiene la URL de la página de referencia para esta característica en MDN. Ten en cuenta que esto se debe escribir sin el directorio de configuración regional dentro, p. ej. <code>/docs/...</code> no <code>/en-US/docs/...</code>. Esto lo agrega la macro cuando los datos se colocan en la página, con fines de localización.</li>
+ <li><code>support</code>: contiene miembros que representan la información de soporte del navegador para esta característica en todos los diferentes navegadores que queremos informar.</li>
+ <li><code>status</code>: contiene miembros que informan sobre el estado de seguimiento de estándares de esta característica.</li>
+</ul>
+
+<p>Los nombres de los miembros del navegador se definen en el esquema (consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md#browser-identifiers">identificadores del navegador</a>). Debes utilizar la lista completa de identificadores definidos actualmente. Si deseas agregar otro navegador, habla con nosotros primero, ya que esto podría tener un impacto de gran alcance y no se debe hacer sin pensarlo detenidamente.</p>
+
+<p>En un archivo de datos de compatibilidad del navegador básico, solo necesitarás incluir "<code>version_added</code>" dentro de los miembros del identificador del navegador (cubriremos {{anch("Advanced cases", "Casos avanzados")}} más adelante). Los diferentes valores que posiblemente quieras incluir son los siguientes:</p>
+
+<ul>
+ <li>Un número de versión: Si conoces la versión exacta en la que un navegador comenzó a admitir tu característica, usa una cadena que represente el número, p. ej. <code>"47"</code>.</li>
+ <li><code>true</code>: Si un navegador admite una característica, pero no conoces el número de versión exacto, utiliza el valor <code>true</code>.</li>
+ <li><code>false</code>: Si un navegador no admite una característica, utiliza el valor <code>false</code>.</li>
+ <li><code>null</code>: Si no sabes si un navegador admite una característica o no, utiliza el valor <code>null</code>.</li>
+</ul>
+
+<p>Dentro del miembro <code>status</code>, incluirás tres submiembros:</p>
+
+<ul>
+ <li><code>experimental</code>: Se debe establecer en <code>true</code> si la característica es <a href="/es/docs/MDN/Contribute/Guidelines/Conventions_definitions#Experimental">experimental</a> o <code>false</code> en caso contrario.</li>
+ <li><code>standard_track</code>: Esto se debe establecer en <code>true</code> si una característica está en algún tipo de pista de estándares (comúnmente W3C/WHATWG, pero también hay otros esfuerzos de estándares como Khronos, TC39, etc.) o <code>false</code> de lo contrario.</li>
+ <li><code>deprecated</code>: Se debe establecer en <code>true</code> si la característica está <a href="/es/docs/MDN/Contribute/Guidelines/Conventions_definitions#Deprecated_and_obsolete">desaprobada</a> o <code>false</code> en caso contrario.</li>
+</ul>
+
+<p>Los datos de características de <a href="/es/docs/Web/CSS/border-width#Browser_compatibility"><code>border-width</code></a> (consulta también <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/border-width.json">border-width.json</a>) se muestra a continuación como ejemplo:</p>
+
+<pre class="brush: json notranslate">"__compat": {
+  "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/border-width",
+  "support": {
+    "chrome": {
+      "version_added": "1"
+    },
+    "webview_android": {
+      "version_added": "2"
+    },
+    "edge": {
+      "version_added": true
+    },
+    "edge_mobile": {
+      "version_added": true
+    },
+    "firefox": {
+      "version_added": "1"
+    },
+    "firefox_android": {
+      "version_added": "1"
+    },
+    "ie": {
+      "version_added": "4"
+    },
+    "ie_mobile": {
+      "version_added": "6"
+    },
+    "opera": {
+      "version_added": "3.5"
+    },
+    "opera_android": {
+      "version_added": "11"
+    },
+    "safari": {
+      "version_added": "1"
+    },
+    "safari_ios": {
+      "version_added": "3"
+    }
+  },
+  "status": {
+    "experimental": false,
+    "standard_track": true,
+    "deprecated": false
+  }
+}</pre>
+
+<h4 id="Agrega_una_descripción">Agrega una descripción</h4>
+
+<p>Hay un cuarto miembro, opcional, que puede ir dentro del miembro <code>__compat</code> — <code>description</code>. Este se puede utilizar para incluir una descripción legible por humanos de la característica. Únicamente lo debes incluir si es difícil ver cuál es la característica al mirar los datos. Por ejemplo, puede que no sea tan obvio lo que es un constructor al mirar la estructura de datos, por lo que puedes incluir una descripción como esta:</p>
+
+<pre class="brush: json notranslate">{
+  "api": {
+    "AbortController": {
+      "__compat": {
+        ...
+      },
+      "AbortController": {
+        "__compat": {
+          "mdn_url": "https://developer.mozilla.org/docs/Web/API/AbortController/AbortController",
+          "description": "&lt;code&gt;AbortController()&lt;/code&gt; constructor",
+          "support": {
+            ...
+          }
+        }
+      }
+
+      ... etc.
+    }
+  }
+}</pre>
+
+<h3 id="Subcaracterísticas">Subcaracterísticas</h3>
+
+<p>En una página donde la tabla de compatibilidad tiene más de una fila, necesitarás varias subcaracterísticas dentro de cada característica para definir la información de cada fila. Esto puede suceder, por ejemplo, cuando tienes el soporte básico para una característica almacenada en una fila, pero luego la característica también tiene una nueva propiedad o tipo de valor que se agregó mucho más tarde en la vida de la especificación y solo se admite en una par de navegadores.</p>
+
+<p>Como ejemplo, consulta los <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/background-color.json">datos de compatibilidad</a> y la <a href="/es/docs/Web/CSS/background-color">página MDN correspondiente</a> para la propiedad <code>background-color</code>. El soporte básico existe dentro del objeto <code>__compat</code> como se explicó anteriormente, luego tienes una fila adicional para el soporte de los navegadores para "canal alfa para valores hexadecimales", que contiene tu propio objeto <code>__compat</code>.</p>
+
+<pre class="brush: json notranslate">{
+  "css": {
+    "properties": {
+      "background-color": {
+        "__compat": {
+          ...
+        },
+        "alpha_ch_for_hex": {
+          "__compat": {
+            ...
+          },
+        }
+      }
+    }
+  }
+}</pre>
+
+<p>Para una API, tienes los dos niveles superiores definidos como <code>api.<em>nombre-de-la-interfaz</em></code>, luego un <code>__compat</code> de nivel superior para definir la compatibilidad general del navegador de la interfaz, luego una subfunción para cada uno de los métodos, propiedades y constructores contenidos dentro de la interfaz. La estructura básica se ve así:</p>
+
+<pre class="brush: json notranslate">{
+  "api": {
+    "VRDisplay": {
+      "__compat": {
+        ...
+      },
+      "cancelAnimationFrame": {
+        "__compat": {
+          ...
+        }
+      },
+      "capabilities": {
+        "__compat": {
+          ...
+        }
+      },
+
+      ... etc.
+
+    }
+  }
+}</pre>
+
+<p>Consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/api/VRDisplay.json">VRDisplay.json</a> para ver un ejemplo completo.</p>
+</div>
+
+<h2 id="Agregar_datos_casos_avanzados">Agregar datos: casos avanzados</h2>
+
+<p>Hay algunas características avanzadas que querrás incluir en los datos de compatibilidad del navegador. El objetivo de esta sección es enumerar los más comunes, proporcionando un ejemplo de cada uno para mostrar cómo los puedes implementar en tus propios datos de compatibilidad.</p>
+
+<h3 id="Incluyendo_una_nota_a_pie_de_página">Incluyendo una nota a pie de página</h3>
+
+<p>A menudo, las tablas de compatibilidad incluirán notas a pie de página relacionadas con ciertas entradas que explican detalles útiles o comportamientos extraños que los desarrolladores encontrarán útiles. Como ejemplo, la entrada de Chrome para Android para {{domxref("VRDisplay.capabilities")}} (consulta también <a href="https://github.com/mdn/browser-compat-data/blob/master/api/VRDisplay.json">VRDisplay.json</a>) (en el momento de escribir este artículo) tenía una nota al pie de página "Actualmente solo es compatible con Google Daydream". Para incluir esto en los datos de capacidades, agregamos un submiembro "<code>notes</code>" dentro del submiembro "chrome_android" relevante; se vería así:</p>
+
+<pre class="brush: json notranslate">"chrome_android": {
+  "version_added": true,
+  "notes": "Currently supported only by Google Daydream."
+}</pre>
+
+<h3 id="Incluyendo_un_prefijo_de_proveedor">Incluyendo un prefijo de proveedor</h3>
+
+<p>Si una característica es compatible con un prefijo de proveedor en uno o más navegadores, querrás dejarlo en claro en los datos de compatibilidad del navegador. imagina que tienes una característica que es compatible con un prefijo <code>-moz-</code> en Firefox. Para especificar esto en los datos de compatibilidad, debes agregar un submiembro "<code>prefix</code>" dentro del submiembro "firefox" relevante. Y se vería así:</p>
+
+<pre class="brush: json notranslate">"firefox": {
+  "version_added": true,
+  "prefix": "-moz-"
+}</pre>
+
+<h3 id="Incluyendo_preferencias_o_banderas_del_navegador">Incluyendo preferencias o banderas del navegador</h3>
+
+<p>Algunas características pueden ser compatibles con un navegador, pero son experimentales y están desactivadas de forma predeterminada. Si un usuario quiere jugar con esta característica, debe activarla usando una preferencia/bandera.</p>
+
+<p>Para representar esto en los datos de compatibilidad, debes agregar el submiembro "<code>flags</code>" dentro del submiembro del identificador del navegador relevante. El valor de "<code>flags</code>" es un arreglo de objetos, cada uno de los cuales contiene tres miembros:</p>
+
+<ul>
+ <li><code>type</code>: Qué tipo de bandera o preferencia es. El valor más común es "<code>preference</code>", que se establece dentro del navegador (por ejemplo, usando <code>about: config</code> en Firefox, o <code>chrome://flags</code> en Chrome), pero a veces también puedes usar un valor de "<code>compile_flag</code>", que es un conjunto de preferencias cuando se construye la compilación del navegador.</li>
+ <li><code>name</code>: Esta es una cadena que representa el nombre de la preferencia que necesita tener un valor establecido. Por ejemplo, "Habilitar funciones experimentales de la plataforma web" es una preferencia que existe en Chrome, que se encuentra en <code>chrome://flags</code>.</li>
+ <li><code>value_to_set</code>: Esta es una cadena que representa el valor que se debe establecer en la preferencia, por ejemplo, "<code>true</code>".</li>
+</ul>
+
+<p>Entonces, para agregar una preferencia/bandera al soporte de Chrome para una característica, harías algo como esto:</p>
+
+<pre class="brush: json notranslate">"chrome": {
+  "version_added": "50",
+  "flags": [
+    {
+      "type": "preference",
+      "name": "Enable Experimental Web Platform Features",
+      "value_to_set": "true"
+    }
+  ]
+},</pre>
+
+<p>Si una característica está detrás de dos o más banderas, puedes agregar objetos adicionales al arreglo "<code>flags</code>", como en este caso, por ejemplo:</p>
+
+<pre class="brush: json notranslate">"firefox": {
+  "version_added": "57",
+  "flags": [
+    {
+      "type": "preference",
+      "name": "dom.streams.enabled",
+      "value_to_set": "true"
+    },
+    {
+      "type": "preference",
+      "name": "javascript.options.streams",
+      "value_to_set": "true"
+    }
+  ]
+},</pre>
+
+<h3 id="Incluyendo_una_versión_donde_se_eliminó_el_soporte">Incluyendo una versión donde se eliminó el soporte</h3>
+
+<p>A veces, una característica se agregará en una determinada versión del navegador, pero luego se eliminará nuevamente cuando la característica esté obsoleta. Esto se puede representar fácilmente usando el submiembro "<code>version_removed</code>", que toma como valor una cadena que representa el número de versión en el que se eliminó. Por ejemplo:</p>
+
+<pre class="brush: json notranslate">"firefox": {
+  "version_added": "35",
+  "version_removed": "47",
+},</pre>
+
+<h3 id="Incluyendo_múltiples_puntos_de_soporte_para_la_misma_entrada_del_navegador">Incluyendo múltiples puntos de soporte para la misma entrada del navegador</h3>
+
+<p>A veces, querrás agregar varios puntos de datos de soporte para el mismo navegador dentro de la misma característica.</p>
+
+<p>Como ejemplo, la propiedad {{cssxref("text-align-last")}} (ve también <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/text-align-last.json">text-align-last.json</a>) se agregó a Chrome en la versión 35, compatible con una pref.</p>
+
+<p>El soporte mencionado anteriormente se eliminó en la versión 47; también en la versión 47, se agregó soporte para <code>text-align-last</code> habilitado de manera predeterminada.</p>
+
+<p>Para incluir estos dos puntos de datos, puedes hacer que el valor del submiembro "<code>chrome</code>" sea un arreglo que contenga dos objetos de información de soporte, en lugar de un solo objeto de información de soporte:</p>
+
+<pre class="brush: json notranslate">"chrome": [
+  {
+    "version_added": "47"
+  },
+  {
+    "version_added": "35",
+    "version_removed": "47",
+    "flags": [
+      {
+        "type": "preference",
+        "name": "Enable Experimental Web Platform Features",
+        "value_to_set": "true"
+      }
+    ]
+  }
+],</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong> Debes colocar el punto de soporte más actual o importante primero en el arreglo — esto hace que los datos sean más fáciles de leer para las personas que solo desean escanearlos para obtener la información más reciente.</p>
+</div>
+
+<h3 id="Incluyendo_un_nombre_alternativo">Incluyendo un nombre alternativo</h3>
+
+<p>Ocasionalmente, los navegadores admitirán una característica con un nombre diferente al definido en su especificación. Esto se podría deber, por ejemplo, a que un navegador agregó soporte experimental para una característica antes, y luego el nombre cambió antes de que se estabilizara la especificación.</p>
+
+<p>Para incluir un caso de este tipo en los datos de compatibilidad del navegador, puedes incluir un punto de información de soporte que especifique el nombre alternativo dentro de un miembro "<code>alternative_name</code>".</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong> Es posible que el nombre alternativo no sea un alias exacto — posiblemente tenga un comportamiento diferente al de la versión estándar.</p>
+</div>
+
+<p>Veamos un ejemplo. La propiedad {{cssxref("border-top-right-radius")}} (consulta también <a href="https://github.com/mdn/browser-compat-data/blob/2a0cc3f6bb17aa4345441bed47a059dffd847793/css/properties/border-top-right-radius.json">border-top-right-radius.json</a>) era compatible con Firefox:</p>
+
+<ul>
+ <li>Desde la versión 4 en adelante con el nombre estándar <code>border-top-right-radius</code>.</li>
+ <li>A partir de la versión 49 con un prefijo <code>-webkit-</code>, por motivos de compatibilidad con el navegador.</li>
+ <li>Desde la versión 1 en adelante con el nombre alternativo <code>-moz-border-radius-topright</code>. La compatibilidad con este alias se eliminó en la versión 12.</li>
+</ul>
+
+<p>Para representar esto en los datos, usamos el siguiente JSON:</p>
+
+<pre class="brush: json notranslate">"firefox": [
+  {
+    "version_added": "4",
+    "notes": "Antes de Firefox 50.0, los estilos de borde de las esquinas redondeadas siempre se representaban como si <code>border-style</code> fuera sólido. Esto se ha solucionado en Firefox 50.0."
+  },
+  {
+    "prefix": "-webkit-",
+    "version_added": "49",
+    "notes": "De Firefox 44 a 48, el prefijo <code>-webkit-</code> estaba disponible con la preferencia <code>layout.css.prefixes.webkit</code>. A partir de Firefox 49, la preferencia predeterminada es &lt;code&gt;true&lt;/code&gt;."
+  },
+  {
+    "alternative_name": "-moz-border-radius-topright",
+    "version_added": "1",
+    "version_removed": "12"
+  }
+],</pre>
+
+<h2 id="Empujar_un_cambio_de_nuevo_al_repositorio_principal">Empujar un cambio de nuevo al repositorio principal</h2>
+
+<p>Una vez que hayas terminado de agregar tus datos de compatibilidad, primero debes probarlos usando los siguientes comandos:</p>
+
+<ul>
+ <li><code>npm run lint</code> — prueba todos los datos de compatibilidad para asegurarse de que el JSON sea válido y esté escrito en el estilo correcto, por ejemplo, sangría correcta, sin comas, etc. Imprimirá una larga lista de nombres de archivos y resultados de pruebas; si se encuentra un error, el linter arrojará un error en el archivo en el que se encuentra, brindándote útil información de depuración como número de línea, mensaje de error, etc.</li>
+ <li><code>npm run show-errors</code> — valida el JSON con el esquema de datos y resalta errores como el uso de números de versión de navegador no válidos.</li>
+</ul>
+
+<p>Si se ve bien, debes confirmarlo y volver a colocarlo en tu bifurcación remota en GitHub. Lo puedes hacer fácilmente en tu terminal con comandos como estos:</p>
+
+<pre class="brush: bash notranslate">git add .
+git commit -m 'adding compat data for <em>nombre-de-la-característica</em>'
+git push</pre>
+
+<p>Ahora ve a tu bifurcación remota (es decir, <code>https://github.com/<em>tu-nombre-de-usuario</em>/browser-compat-data</code>) y deberías ver información sobre tu inserción en la parte superior de la lista de archivos (debajo de "Tus ramas enviadas recientemente"). Puedes crear una solicitud de extracción (iniciando el proceso de enviarla al repositorio principal) presionando el botón "Comparar y solicitud de extracción" y luego siguiendo las sencillas instrucciones en la siguiente pantalla.</p>
+
+<p>En este punto, solo tienes que esperar. Un revisor examinará tu solicitud de extracción y la fusionará con el repositorio principal, O solicitará que realices cambios. Si se necesitan cambios, realiza los cambios y envíalos nuevamente hasta que se acepte la SE.</p>
+
+<h2 id="Insertar_los_datos_en_páginas_MDN">Insertar los datos en páginas MDN</h2>
+
+<p>Una vez que tus nuevos datos se hayan incluido en el repositorio principal, puedes comenzar a generar dinámicamente tablas de compatibilidad del navegador basadas en esos datos en las páginas MDN usando la macro {{TemplateLink("Compat")}}. Esta toma un solo parámetro, la notación de puntos requerida para recorrer los datos JSON y encontrar el objeto que representa la característica para la que deseas generar la tabla de compatibilidad.</p>
+
+<p>Por encima de la llamada a la macro, para ayudar a otros colaboradores a encontrar su camino, debes agregar un texto oculto que solo sea visible a los colaboradores de MDN en el modo de edición:</p>
+
+<pre class="brush: html notranslate">&lt;div class="hidden"&gt;
+La tabla de compatibilidad de esta página se genera a partir de datos estructurados.
+Si deseas contribuir con los datos, consulta
+&lt;a href="https://github.com/mdn/browser-compat-data"&gt;https://github.com/mdn/browser-compat-data&lt;/a&gt;
+y envíanos una solicitud de extracción.
+&lt;/div&gt;</pre>
+
+<p>Por ejemplo, en la página de encabezado HTTP {{HTTPHeader("Accept-Charset")}}, la llamada a la macro se ve así: <code>\{{Compat("http.headers.Accept-Charset")}}</code>. Si observas el <a href="https://github.com/mdn/browser-compat-data/blob/master/http/headers/accept-charset.json">accept-charset.json</a> en el repositorio, verás cómo esto se refleja en los datos JSON.</p>
+
+<p>Otro ejemplo, la tabla de compatibilidad para la propiedad {{domxref("VRDisplay.capabilities")}} se genera usando <code>\{{Compat("api.VRDisplay.capabilities")}}</code>. La llamada a la macro genera la siguiente tabla (y el correspondiente conjunto de notas):</p>
+
+<hr>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("api.VRDisplay.capabilities")}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong> Los nombres de archivo a menudo coinciden con las etiquetas dadas a las interfaces dentro de las estructuras JSON, pero no siempre es así. Cuando las llamadas a macro generan las tablas, recorren todos los archivos hasta encontrar el JSON relevante para usar, por lo que los nombres de archivo no son críticos. Dicho esto, siempre debes nombrarlos de la manera más intuitiva posible.</p>
+</div>
diff --git a/files/es/mdn/structures/ejemplos_ejecutables/index.html b/files/es/mdn/structures/ejemplos_ejecutables/index.html
deleted file mode 100644
index f5743b558e..0000000000
--- a/files/es/mdn/structures/ejemplos_ejecutables/index.html
+++ /dev/null
@@ -1,243 +0,0 @@
----
-title: Ejemplos ejecutables
-slug: MDN/Structures/Ejemplos_ejecutables
-translation_of: MDN/Structures/Live_samples
----
-<div>{{MDNSidebar}}</div><p><span class="seoSummary">MDN puede convertir ejemplos de código de los artículos a ejemplos ejecutables que el lector puede ver en acción. Estos ejemplos ejecutables pueden contener HTML, CSS, y JavaScript en cualquier combinación. Ten en cuenta que</span> los ejemplos "ejecutables" <em>no son interactivos</em>; sin embargo, aseguran que el output coincida exactamente con el código de ejemplo, porque es generado por este.</p>
-
-<h2 id="Como_funciona_el_sistema_de_ejemplos_ejecutables">Como funciona el sistema de ejemplos ejecutables</h2>
-
-<p>El sistema de ejemplos ejecutables agrupa el código, lo une en un archivo HTML, procesa el HTML y entonces despliega el output en un {{HTMLElement("iframe")}}. Por lo tanto un ejemplo ejecutable consiste de dos partes:</p>
-
-<ul>
- <li>Un grupo de bloques de código</li>
- <li>La macro que (crea el frame o el link que) despliega el resultado de los bloques de código</li>
-</ul>
-
-<p>Un "grupo" de bloques de código, en este contexto, es identificado por el ID de un header o de un bloque de contenido (tal como un {{HTMLElement("div")}}).</p>
-
-<ul>
- <li>Si el ID pertenece a un bloque de contenido, el grupo incluye todos los bloques de código que se encuentren entre las etiquetas de apertura y cierre del bloque de contenido de cuyo ID se usa.</li>
- <li>Si el ID pertenece a un header, el grupo incluye todos los bloques de código que estén bajo el header y antes del siguiente header en el mismo nivel. Ten en cuenta que se usan todos los códigos de bloque bajo sub-headers del header especificado; si este no es el efecto que deseas, mejor usa un ID de un bloque de contenido.</li>
-</ul>
-
-<p>La macro usa un URL especial para extraer el código de ejemplo: <code>http://<em>url-de-la-pagina</em>$ejemplos/<em>grupo-id</em></code>, donde grupo-id es el ID del header o del bloque de contenido donde se localiza el código. El frame resultante (o página) es sandboxed (entorno de pruebas), seguro, y  técnicamente puede hacer cualquier cosa que funcione en la Web. Por supuesto, desde el punto de vista práctico, el código debe contribuir al tema de la página que lo contiene; cosas al azar ejecutándose en MDN serán removidas por la comunidad de editores.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> <strong>Debes</strong> usar el macro para presentar el output del ejemplo ejecutable. El editor de MDN quitará cualquier uso directo del elemento <code>&lt;iframe&gt;</code> por motivos de seguridad.</p>
-</div>
-
-<p>Cada bloque {{HTMLElement("pre")}} que contiene código para el ejemplo tiene una clase que indica si es código HTML, CSS, o JavaScript; estas son "brush: html", "brush: css", y "brush: js". Las clases deben estar en los bloques de código correspondientes para que el wiki pueda usarlos correctamente; afortunadamente, son agregadas automáticamente cuando usas  la herramienta Syntax Highlighter de la barra de herramientas del editor.</p>
-
-<p>El sistema de ejemplos ejecutables tiene muchas opciones disponibles, trataremos de ponerlas en terminos simples analizándolas de a poco.</p>
-
-<h3 id="Macro_de_ejemplos_ejecutables">Macro de ejemplos ejecutables</h3>
-
-<p>Hay dos macros que puedes usar para desplegar ejemplos ejecutables:</p>
-
-<ul>
- <li><span class="templateLink"><code><a href="/en-US/docs/Template:EmbedLiveSample">EmbedLiveSample</a></code></span> despliega el ejemplo ejecutable en un frame embebido dentro de la misma página</li>
- <li><span class="templateLink"><code><a href="/en-US/docs/Template:LiveSampleLink">LiveSampleLink</a></code></span> crea un link que abre el ejemplo ejecutable en una página nueva</li>
-</ul>
-
-<p>En muchos casos, tienes la posibilidad de agregar la macro <span class="templateLink"><code><a href="/en-US/docs/Template:EmbedLiveSample">EmbedLiveSample</a></code></span> o la <span class="templateLink"><code><a href="/en-US/docs/Template:LiveSampleLink">LiveSampleLink</a></code></span> con ¡poco o nada de trabajo adicional! Mientras el ejemplo pueda ser identificado por un ID de un header o esté en un bloque de contenido con un ID que puedas usar, simplemente agregar la macro será suficiente.</p>
-
-<h4 id="Macro_EmbedLiveSample">Macro EmbedLiveSample</h4>
-
-<pre class="syntaxbox notranslate"> \{{EmbedLiveSample(<em>ID_del_bloque</em>, <em>longitud</em>, altura, <em>URL_de_captura_de_pantalla</em>, <em>pagina_slug</em>)}}</pre>
-
-<dl>
- <dt>ID_del_bloque</dt>
- <dd>Requerido: El ID del header o del bloque de contenido de donde se tomará el código. La mejor forma de asegurarte que tienes el ID correcto es revisar el URL de la sección en la tabla de contenidos de la página.</dd>
- <dt>longitud</dt>
- <dd>La longitud del {{HTMLElement("iframe")}} que se creará, especificada en <code>px</code>. Esto es opcional; una longitud razonable se usará si omites esto. Ten en cuenta que si quieres usar una longitud específica, <em>debes</em> especificar el parámetro de altura también.</dd>
- <dt>altura</dt>
- <dd>La altura del {{HTMLElement("iframe")}} que se creará, especificada en <code>px</code>. Esto es opcional; una altura razonable se usará si omites esto. Ten en cuenta que si quieres usar una altura específica, <em>debes</em> especificar el parámetro de longitud también.</dd>
- <dt>URL_de_captura_de_pantalla</dt>
- <dd>La URL de una captura de pantalla que muestre como se debe ver el ejemplo ejecutable. Esto es opcional, pero puede ser útil para nuevas tecnologías que pueden no funcionar en el navegador del usuario, para que puedan ver como se vería el ejemplo si fuera soportado por su navegador. Si incluyes este parámetro, la captura de pantalla se muestra junto al ejemplo ejectutable, con encabezados apropiados.</dd>
- <dt>pagina_slug</dt>
- <dd>El slug (nombre con "_" reemplazando los espacios) de la página que contiene el ejemplo; esto es opcional, y si se omite, el ejemplo es extraido de la misma página donde se usa la macro.</dd>
-</dl>
-
-<ol>
-</ol>
-
-<h4 id="Macro_LiveSampleLink">Macro LiveSampleLink</h4>
-
-<pre class="syntaxbox notranslate"> \{{LiveSampleLink(<em>ID_del_bloque</em>, <em>texto_del_enlace</em>)}}</pre>
-
-<dl>
- <dt>ID_del_bloque</dt>
- <dd>Requerido: El ID del encabezado o del bloque de contenido de donde se tomará el código. La mejor forma de asegurarte que tienes el ID correcto es revisar el URL de la sección en la tabla de contenidos de la página.</dd>
- <dt>texto_de_enlace</dt>
- <dd>Una cadena de texto para mostrar en el enlace.</dd>
-</dl>
-
-<h2 id="Usando_el_sistema_de_ejemplos_ejecutables">Usando el sistema de ejemplos ejecutables</h2>
-
-<p>La sección de abajo describe algunos de los casos de uso más comunes para el sistema de ejemplos ejecutables.</p>
-
-<p>En todos estos casos, para ver los resultados del ejemplo ejecutable, debes hacer clic en <strong>Guardar Cambios</strong> en el editor (lo que te saca del modo edición). Debido a la reflexiba, naturaleza tipo <a href="http://www.imdb.com/title/tt1375666/?ref_=nv_sr_1"><em>Inception</em></a> de los ejemplos ejecutables, la funcionalidad de <strong>Previsualizar Cambios</strong> <em>no</em> permite desplegar los ejemplos ejecutables.</p>
-
-<h3 id="Convirtiendo_snippets_trozos_de_código_en_ejemplos_ejecutables">Convirtiendo snippets (trozos de código) en ejemplos ejecutables</h3>
-
-<p>Un uso común es tomar snippets existentes que ya se muestran en MDN y convertirlos ejemplos ejecutables.</p>
-
-<h4 id="Preparar_el_código">Preparar el código</h4>
-
-<p>El primer paso es agregar snippets o asegurarse que los existentes están listos para ser usados como ejemplos ejecutables, en términos de contenido y marcadores. Los snippets, juntos, deben comprender un ejemplo completo y ejecutable. Por ejemplo, si el snippet existente solo muestra CSS, debes agregar el snippet de HTML para que el CSS funcione.</p>
-
-<p>Cada pieza de código debe estar en un bloque {{HTMLElement("pre")}}, con un bloque separado para cada lenguaje, propiamente marcado con el lenguaje correspondiente. La mayoría de las veces, esto ya se hizo, pero vale la pena volver revisar para asegurarse que cada pieza de código está estructurado con la sintaxis correcta. A la derecha del ícono <strong>PRE</strong> en la barra de tareas hay un menú desplegable (herramienta: Syntax Highlighter) con varios lenguajes para los que MDN hace distinción de sintaxis. Establecer el lenguaje para la distinción de sintaxis del bloque también lo correlaciona con un lenguaje para los propósitos del sistema de ejemplos ejecutables.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Puedes tener más de un bloque para cada lenguaje; todos son concatenados juntos. Esto te permite tener una parte de código, seguida de una explicación de como funciona, luego otra parte de código, etc. Esto hace aun más fácil producir tutoriales y utilizar ejemplo ejecutables intercalados con texto que los explique.</p>
-</div>
-
-<p>Así que asegurate que la distinción de sintaxis de los bloques {{HTMLElement("pre")}} para tu código HTML, CSS, y/o JavaScript estén cada uno configurado para el lenguaje correcto, y estarás bien.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Al pegar contenido en MDN, se conciente que si pegas contenido formateado (incluyendo, por ejemplo, distinción de sintaxis en código copeado de otro sitio) puedes estar trayendo formatos o clases que no quieres y no necesitas. Ten cuidado de no hacer esto; si es necesario, revisa tu edición en modo fuente y elimina estos formatos y clases innecesarios (o revísalo antes de pegarlo, o usa la opción "Pegar como texto plano").</p>
-</div>
-
-<h4 id="Insertar_la_macro_de_ejemplo_ejecutable">Insertar la macro de ejemplo ejecutable</h4>
-
-<p>Una vez que el código está en su lugar y propiamente configurado para identificar cada bloque de lenguaje, necesitas insertar la macro que crea el frame.</p>
-
-<ol>
- <li>Haz clic en el botón <strong>Insert Live Code Sample iFrame</strong> en la barra de herramientas; luce así: <img alt="" src="https://mdn.mozillademos.org/files/5383/insert-live-sample-btn.png" style="height: 18px; width: 19px;">. Esto abre un cuadro de diálogo para configurar el frame de tu ejemplo ejecutable:                         <img alt="" src="https://mdn.mozillademos.org/files/5385/sample-finder.png" style="height: 358px; width: 405px;"></li>
- <li>Bajo <strong>Document</strong>, ingresa el título del artículo que contiene el ejemplo que deseas desplegar. Por default, es el artículo que estás editando, pero puedes escoger un artículo en otra parte de MDN. Esto hace posible reusar ejemplos en múltiples páginas si es necesario. (Si escribes un texto nuevo en este campo, aparecerá un menú de coincidencias parciales; selecciona el título de la página que desees.)</li>
- <li>En el menú <strong>Sections in Document</strong>, selecciona la sección en el artículo que contiene los bloques de código del ejemplo que quieres desplegar.</li>
- <li>Haz clic en el botón <strong>OK</strong> para generar e insertar la macro que crea el frame del ejemplo. La macro luce algo así:<br>
-  <strong>\{{ EmbedLiveSample('Live_sample_demo') }}</strong></li>
-</ol>
-
-<h3 id="Agregando_un_nuevo_ejemplo_ejecutable">Agregando un nuevo ejemplo ejecutable</h3>
-
-<p>Si estás escribiendo una página nueva, y quieres insertar código que deseas mostrar como ejemplo ejecutable, ¡aun más del trabajo puede ser realizado por el editor para ti!</p>
-
-<ol>
- <li>Haz clic el botón <strong>Insert Code Sample Template</strong> en la barra de herramientas, luce así: <img alt="" src="/files/4265/live-sample-button.png" style="height: 19px; width: 21px;">. Esto presenta un simple cuadro de diálogo pidiéndote que nombres a tu ejemplo ejecutable:<br>
-  <img alt="" src="https://mdn.mozillademos.org/files/5387/insert-live-sample-template.png" style="height: 155px; width: 251px;"></li>
- <li>Ingresa el nombre del ejemplo; esto es usado como el header para el ejemplo. Asegúrate que tu título sea coherente con la pagína que escribes.</li>
- <li>Haz clic en <strong>OK</strong>. Se creó un header nuevo con el título que elegiste, con sub-headers y bloques de código vacios para HTML, CSS y JavaScript.</li>
- <li>Elimina cualquier sub-header y bloque de código que no necesites.</li>
- <li>Ingresa el código que compone tu ejemplo en los bloques de código apropiados.</li>
- <li><a href="#conventions">Revisar convenciones</a></li>
-</ol>
-
-<h3 id="Usando_el_Buscador_de_Ejemplos">Usando el Buscador de Ejemplos</h3>
-
-<p>Como se mencionó arriba, el buscador de Ejemplos se activa haciendo clic en el ícono<strong> Insert Live Code Sample iFrame</strong>. Desafortunadamente el Buscador de Ejemplos puede producir un macro que NO es usable sin editarse antes. Hay dos áreas problemáticas que deben revisarse con cuidado y editarse si es necesario.</p>
-
-<ol>
- <li>Campo <strong>Document</strong>. Este campo buscará mientras escribes y presentará una lista de documentos que encajan con tu búsqueda. Pero la lista presentada NO incluirá sub-páginas. Por ejemplo, digamos que estás trabajando en la sub-página <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style/negative">Negative </a>de la página principal <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style">@counter-style</a>. El Buscador de Ejemplos no encontrará Negative pero si la página principal @counter-style. Cuando se selecciona @counter-style el fondo cambia a color verde. Lee debajo el problema que esto crea.</li>
- <li><strong>Sections in Document</strong>. El menú desplegable Sections in Document puede no mostrar la sección que necesitas. Selecciona cualquiera, digamos Examples, y puede arreglarse con una simple edición.</li>
-</ol>
-
-<p>Esto es lo que el Buscador de Ejemplos produce:</p>
-
-<pre class="notranslate"><code>\{{ EmbedLiveSample('Examples', '', '', '', 'Web/CSS/@counter-style') }}</code></pre>
-
-<p>Esta macro no funcionará. El ID_de_bloque es Examples y debería ser Example en este caso (revisa la fuente del ID de esta sección para verificar cual ID_de_bloque necesitas usar). Igualmente pagina_slug es @counter-style y debería ser @counter-style/negative. Estas correcciones puede hacerse directamente en la página activando la edición.</p>
-
-<p>Después de editar la macro ahora luce así:</p>
-
-<pre class="notranslate"><code>\{{ EmbedLiveSample('Example', '', '', '', 'Web/CSS/@counter-style/negative') }}</code></pre>
-
-<p>Esta macro editada funcionará correctamente. Si la macro funciona correctamente verás el botón <strong>Open in CodePen</strong>. Una miniatura del ejemplo deberá aparecer encima del botón Open in CodePen. Si el botón está ahí pero no hay miniatura, espera unos minutos. Puede tormar un tiempo para que el servidor la genere.</p>
-
-<h2 id="Live_sample_demo" name="Live_sample_demo">Encontrando ejemplos que necesitan actualización</h2>
-
-<p>Al buscar ejemplos existentes que actualizar, hay tres tipos principales de actualización que deseas hacer:</p>
-
-<ul>
- <li>Convertir un snippet no ejecutable en un ejemplo ejecutable.</li>
- <li>Corregir bugs en un ejemplo ejecutable existente.</li>
- <li>Mejorar un ejemplo ejecutable existente, o actualizar un ejemplo basándose en cambios tecnológicos.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong><strong>:</strong> Si encuentras artículos que necesitan ser actualizados para usar el sistema de ejemplos ejecutables, por favor agrega a la página la etiqueta "NeedsLiveSample".</p>
-</div>
-
-<h3 id="Encontrando_ejemplos_que_necesitan_convertirse_a_ejemplos_ejecutables">Encontrando ejemplos que necesitan convertirse a ejemplos ejecutables</h3>
-
-<p>MDN tiene montontes de ejemplos viejos que aun no usan el sistema de ejemplos ejecutables. Nuestra meta es actualizar la mayoría o todos para que sean ejemplos ejecutables.Esto aumentará la consistencia y la usabilidad. Es casi seguro que te encontrarás muchos de estos mientras usas MDN en el día a día; sin embargo, ¿cómo puedes encontrarlos si los buscas específicamente para actualizarlos? Desafortunadamente, no hay un modo fácil de hacer eso. Pero hay algunos consejos que te ayudarán a rastrearlos:</p>
-
-<ul>
- <li>Empieza por darle un vistazo a esto <a href="/en-US/docs/tag/NeedsLiveSample" title="/en-US/docs/tag/NeedsLiveSamples">lista de páginas etiquetadas con "NeedsLiveSample"</a>. Estas son las páginas que los usuarios han marcadado como que necesitan actualizarse. Deberías agregar esta etiqueta tu mismo, si ves una página que necesita ser actualizada para usar ejemplos ejecutables pero no tienes tiempo de arreglarla enseguida.</li>
- <li>Navega por ligas de documentación que es probable que incluyan ejemplos, como <a href="/en-US/docs/Web/JavaScript/Guide" title="/en-US/docs/Web/JavaScript/Guide">JavaScript Guide</a>, <a href="/en-US/docs/Web/HTML" title="/en-US/docs/Web/HTML">HTML documentation</a>, y <a href="/en-US/docs/Web/CSS/Reference" title="/en-US/docs/Web/CSS/Reference">CSS reference</a>.</li>
- <li>Busca término como "<a href="/en-US/search?q=example" title="/en-US/search?q=example">example</a>" o "<a href="/en-US/search?q=sample" title="/en-US/search?q=sample">sample</a>" y revisar los resultados para páginas que actualizar.</li>
-</ul>
-
-<h2 id="Live_sample_demo" name="Live_sample_demo">Demo de ejemplo ejecutable</h2>
-
-<p>Esta sección es el resultado de usar la plantilla de ejemplo ejecutable no solo para crear el encabezado principal ("Live sample demo"), sino los sub-encabezador para nuestro contenido HTML, CSS y JavaScript. No estás limitado a un bloque para cada uno; además, no necesitan estar en algún orden partícular. ¡Mix and match!</p>
-
-<p>Puedes eliminar cualquiera de estos que desees; si no necesitas scripts, elimina el encabezado y su bloque {{HTMLElement("pre")}}. También puedes eliminar el encabezado de un bloque de código ("HTML", "CSS", o "JavaScript"), ya que estos no son usados por la macro de ejemplo ejecutable.</p>
-
-<p>Ahora que se ha insertado la plantilla, podemos agregar algo de código, e incluso algún texto explicativo.</p>
-
-<h3 id="HTML">HTML</h3>
-
-<p>Este HTML crea un parágrafo y algunos bloques para ayudarnos a posicionar y formatear un mensaje.</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;Un simple ejemplo de sistema de ejemplo ejecutable en accion.&lt;/p&gt;
-&lt;div class="box"&gt;
-  &lt;div id="item"&gt;¡Hola mundo!&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<p>El código CSS formatea el contenedor así como el mensaje.</p>
-
-<pre class="brush: css notranslate">.box {
-  width: 200px;
-  height: 100 px;
-  border-radius: 6px;
-  background-color: #ffaabb;
-}
-
-#item {
-  width: 100%;
-  font-weight: bold;
-  text-align: center;
-  font-size: 2em;
-}
-</pre>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<p>Este código es muy simple. Todo lo que hace es agregar un manejador de evento al texto "¡Hola mundo!" que hace aparecer una alerta cuando se le hace clic.</p>
-
-<pre class="brush: js notranslate">var el = document.getElementById('item');
-el.onclick = function() {
-  alert('¡Owww, deja de picarme!');
-}
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>Aquí el resultado de ejecutar los bloques de código de arriba vía<code> \{{EmbedLiveSample('Live_sample_demo')}}</code>:</p>
-
-<p>{{EmbedLiveSample('Live_sample_demo')}}</p>
-
-<p>Aquí un enlace que resulta de llamar los bloques de código vía <code>\{{LiveSampleLink('Live_sample_demo', 'Live sample demo link')}}</code>:</p>
-
-<p>{{LiveSampleLink('Live_sample_demo', 'Live sample demo link')}}</p>
-
-<h2 id="Convenciones_acerca_de_los_ejemplos_ejecutables"><a id="conventions" name="conventions">Convenciones acerca de los ejemplos ejecutables</a></h2>
-
-<div class="note">
-<p><strong>Nota:</strong> Esto es actual (Feb. 2016) en discusión en la lista de emails dev-mdc (ver <a href="https://groups.google.com/forum/#!topic/mozilla.dev.mdc/49oqJAHFnWQ">this thread</a>). Cualquier entrada es bienvenida. Si esta nota persiste después de unos meses (Apr. 2016), por favor contactar al autor del primer email en este hilo para actualizar esta página.</p>
-</div>
-
-<dl>
- <dt>Orden de los bloques de código</dt>
- <dd>Al agregar un ejemplo ejecutable, los bloques de código deben ser organizados para que el primero corresponda al lenguaje principal (si hay uno). Por ejemplo, al agregar un ejemplo ejecutable para una referencia HTML, el primer bloque debe ser HTML, al agregar un ejemplo ejecutable para una referencia CSS, debe ser el de CSS y así.</dd>
- <dt>Nombrando los encabezados</dt>
- <dd>Cuando no hay ambigüedad (p.ej. el ejemplo está bajo una sección "Ejemplos"), los encabezados deben ser directos con el único nombre del lenguaje correspondiente: HTML, CSS, JavaScript, SVG, etc. (ver arriba). No deben usarse encabezados como "contenido HTML" o "contenido JavaScript". Sin embargo si un encabezado tan corto hace que el contenido no sea claro, uno puede usar un título más elaborado.</dd>
- <dt>Usando un bloque "Result"</dt>
- <dd>Después de los diferentes bloques de código, favor de usar un último bloque "Result" antes de usar macro <code>EmbedLiveSample</code> (ver arriba). De este modo, se hace más clara la semántica del ejemplo tanto para el lector como para cualquier herramienta que analice la página (p.ej. screen reader, web crawler).</dd>
-</dl>
diff --git a/files/es/mdn/structures/live_samples/index.html b/files/es/mdn/structures/live_samples/index.html
new file mode 100644
index 0000000000..c3f02940d8
--- /dev/null
+++ b/files/es/mdn/structures/live_samples/index.html
@@ -0,0 +1,244 @@
+---
+title: Ejemplos ejecutables
+slug: MDN/Structures/Live_samples
+translation_of: MDN/Structures/Live_samples
+original_slug: MDN/Structures/Ejemplos_ejecutables
+---
+<div>{{MDNSidebar}}</div><p><span class="seoSummary">MDN puede convertir ejemplos de código de los artículos a ejemplos ejecutables que el lector puede ver en acción. Estos ejemplos ejecutables pueden contener HTML, CSS, y JavaScript en cualquier combinación. Ten en cuenta que</span> los ejemplos "ejecutables" <em>no son interactivos</em>; sin embargo, aseguran que el output coincida exactamente con el código de ejemplo, porque es generado por este.</p>
+
+<h2 id="Como_funciona_el_sistema_de_ejemplos_ejecutables">Como funciona el sistema de ejemplos ejecutables</h2>
+
+<p>El sistema de ejemplos ejecutables agrupa el código, lo une en un archivo HTML, procesa el HTML y entonces despliega el output en un {{HTMLElement("iframe")}}. Por lo tanto un ejemplo ejecutable consiste de dos partes:</p>
+
+<ul>
+ <li>Un grupo de bloques de código</li>
+ <li>La macro que (crea el frame o el link que) despliega el resultado de los bloques de código</li>
+</ul>
+
+<p>Un "grupo" de bloques de código, en este contexto, es identificado por el ID de un header o de un bloque de contenido (tal como un {{HTMLElement("div")}}).</p>
+
+<ul>
+ <li>Si el ID pertenece a un bloque de contenido, el grupo incluye todos los bloques de código que se encuentren entre las etiquetas de apertura y cierre del bloque de contenido de cuyo ID se usa.</li>
+ <li>Si el ID pertenece a un header, el grupo incluye todos los bloques de código que estén bajo el header y antes del siguiente header en el mismo nivel. Ten en cuenta que se usan todos los códigos de bloque bajo sub-headers del header especificado; si este no es el efecto que deseas, mejor usa un ID de un bloque de contenido.</li>
+</ul>
+
+<p>La macro usa un URL especial para extraer el código de ejemplo: <code>http://<em>url-de-la-pagina</em>$ejemplos/<em>grupo-id</em></code>, donde grupo-id es el ID del header o del bloque de contenido donde se localiza el código. El frame resultante (o página) es sandboxed (entorno de pruebas), seguro, y  técnicamente puede hacer cualquier cosa que funcione en la Web. Por supuesto, desde el punto de vista práctico, el código debe contribuir al tema de la página que lo contiene; cosas al azar ejecutándose en MDN serán removidas por la comunidad de editores.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> <strong>Debes</strong> usar el macro para presentar el output del ejemplo ejecutable. El editor de MDN quitará cualquier uso directo del elemento <code>&lt;iframe&gt;</code> por motivos de seguridad.</p>
+</div>
+
+<p>Cada bloque {{HTMLElement("pre")}} que contiene código para el ejemplo tiene una clase que indica si es código HTML, CSS, o JavaScript; estas son "brush: html", "brush: css", y "brush: js". Las clases deben estar en los bloques de código correspondientes para que el wiki pueda usarlos correctamente; afortunadamente, son agregadas automáticamente cuando usas  la herramienta Syntax Highlighter de la barra de herramientas del editor.</p>
+
+<p>El sistema de ejemplos ejecutables tiene muchas opciones disponibles, trataremos de ponerlas en terminos simples analizándolas de a poco.</p>
+
+<h3 id="Macro_de_ejemplos_ejecutables">Macro de ejemplos ejecutables</h3>
+
+<p>Hay dos macros que puedes usar para desplegar ejemplos ejecutables:</p>
+
+<ul>
+ <li><span class="templateLink"><code><a href="/en-US/docs/Template:EmbedLiveSample">EmbedLiveSample</a></code></span> despliega el ejemplo ejecutable en un frame embebido dentro de la misma página</li>
+ <li><span class="templateLink"><code><a href="/en-US/docs/Template:LiveSampleLink">LiveSampleLink</a></code></span> crea un link que abre el ejemplo ejecutable en una página nueva</li>
+</ul>
+
+<p>En muchos casos, tienes la posibilidad de agregar la macro <span class="templateLink"><code><a href="/en-US/docs/Template:EmbedLiveSample">EmbedLiveSample</a></code></span> o la <span class="templateLink"><code><a href="/en-US/docs/Template:LiveSampleLink">LiveSampleLink</a></code></span> con ¡poco o nada de trabajo adicional! Mientras el ejemplo pueda ser identificado por un ID de un header o esté en un bloque de contenido con un ID que puedas usar, simplemente agregar la macro será suficiente.</p>
+
+<h4 id="Macro_EmbedLiveSample">Macro EmbedLiveSample</h4>
+
+<pre class="syntaxbox notranslate"> \{{EmbedLiveSample(<em>ID_del_bloque</em>, <em>longitud</em>, altura, <em>URL_de_captura_de_pantalla</em>, <em>pagina_slug</em>)}}</pre>
+
+<dl>
+ <dt>ID_del_bloque</dt>
+ <dd>Requerido: El ID del header o del bloque de contenido de donde se tomará el código. La mejor forma de asegurarte que tienes el ID correcto es revisar el URL de la sección en la tabla de contenidos de la página.</dd>
+ <dt>longitud</dt>
+ <dd>La longitud del {{HTMLElement("iframe")}} que se creará, especificada en <code>px</code>. Esto es opcional; una longitud razonable se usará si omites esto. Ten en cuenta que si quieres usar una longitud específica, <em>debes</em> especificar el parámetro de altura también.</dd>
+ <dt>altura</dt>
+ <dd>La altura del {{HTMLElement("iframe")}} que se creará, especificada en <code>px</code>. Esto es opcional; una altura razonable se usará si omites esto. Ten en cuenta que si quieres usar una altura específica, <em>debes</em> especificar el parámetro de longitud también.</dd>
+ <dt>URL_de_captura_de_pantalla</dt>
+ <dd>La URL de una captura de pantalla que muestre como se debe ver el ejemplo ejecutable. Esto es opcional, pero puede ser útil para nuevas tecnologías que pueden no funcionar en el navegador del usuario, para que puedan ver como se vería el ejemplo si fuera soportado por su navegador. Si incluyes este parámetro, la captura de pantalla se muestra junto al ejemplo ejectutable, con encabezados apropiados.</dd>
+ <dt>pagina_slug</dt>
+ <dd>El slug (nombre con "_" reemplazando los espacios) de la página que contiene el ejemplo; esto es opcional, y si se omite, el ejemplo es extraido de la misma página donde se usa la macro.</dd>
+</dl>
+
+<ol>
+</ol>
+
+<h4 id="Macro_LiveSampleLink">Macro LiveSampleLink</h4>
+
+<pre class="syntaxbox notranslate"> \{{LiveSampleLink(<em>ID_del_bloque</em>, <em>texto_del_enlace</em>)}}</pre>
+
+<dl>
+ <dt>ID_del_bloque</dt>
+ <dd>Requerido: El ID del encabezado o del bloque de contenido de donde se tomará el código. La mejor forma de asegurarte que tienes el ID correcto es revisar el URL de la sección en la tabla de contenidos de la página.</dd>
+ <dt>texto_de_enlace</dt>
+ <dd>Una cadena de texto para mostrar en el enlace.</dd>
+</dl>
+
+<h2 id="Usando_el_sistema_de_ejemplos_ejecutables">Usando el sistema de ejemplos ejecutables</h2>
+
+<p>La sección de abajo describe algunos de los casos de uso más comunes para el sistema de ejemplos ejecutables.</p>
+
+<p>En todos estos casos, para ver los resultados del ejemplo ejecutable, debes hacer clic en <strong>Guardar Cambios</strong> en el editor (lo que te saca del modo edición). Debido a la reflexiba, naturaleza tipo <a href="http://www.imdb.com/title/tt1375666/?ref_=nv_sr_1"><em>Inception</em></a> de los ejemplos ejecutables, la funcionalidad de <strong>Previsualizar Cambios</strong> <em>no</em> permite desplegar los ejemplos ejecutables.</p>
+
+<h3 id="Convirtiendo_snippets_trozos_de_código_en_ejemplos_ejecutables">Convirtiendo snippets (trozos de código) en ejemplos ejecutables</h3>
+
+<p>Un uso común es tomar snippets existentes que ya se muestran en MDN y convertirlos ejemplos ejecutables.</p>
+
+<h4 id="Preparar_el_código">Preparar el código</h4>
+
+<p>El primer paso es agregar snippets o asegurarse que los existentes están listos para ser usados como ejemplos ejecutables, en términos de contenido y marcadores. Los snippets, juntos, deben comprender un ejemplo completo y ejecutable. Por ejemplo, si el snippet existente solo muestra CSS, debes agregar el snippet de HTML para que el CSS funcione.</p>
+
+<p>Cada pieza de código debe estar en un bloque {{HTMLElement("pre")}}, con un bloque separado para cada lenguaje, propiamente marcado con el lenguaje correspondiente. La mayoría de las veces, esto ya se hizo, pero vale la pena volver revisar para asegurarse que cada pieza de código está estructurado con la sintaxis correcta. A la derecha del ícono <strong>PRE</strong> en la barra de tareas hay un menú desplegable (herramienta: Syntax Highlighter) con varios lenguajes para los que MDN hace distinción de sintaxis. Establecer el lenguaje para la distinción de sintaxis del bloque también lo correlaciona con un lenguaje para los propósitos del sistema de ejemplos ejecutables.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Puedes tener más de un bloque para cada lenguaje; todos son concatenados juntos. Esto te permite tener una parte de código, seguida de una explicación de como funciona, luego otra parte de código, etc. Esto hace aun más fácil producir tutoriales y utilizar ejemplo ejecutables intercalados con texto que los explique.</p>
+</div>
+
+<p>Así que asegurate que la distinción de sintaxis de los bloques {{HTMLElement("pre")}} para tu código HTML, CSS, y/o JavaScript estén cada uno configurado para el lenguaje correcto, y estarás bien.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Al pegar contenido en MDN, se conciente que si pegas contenido formateado (incluyendo, por ejemplo, distinción de sintaxis en código copeado de otro sitio) puedes estar trayendo formatos o clases que no quieres y no necesitas. Ten cuidado de no hacer esto; si es necesario, revisa tu edición en modo fuente y elimina estos formatos y clases innecesarios (o revísalo antes de pegarlo, o usa la opción "Pegar como texto plano").</p>
+</div>
+
+<h4 id="Insertar_la_macro_de_ejemplo_ejecutable">Insertar la macro de ejemplo ejecutable</h4>
+
+<p>Una vez que el código está en su lugar y propiamente configurado para identificar cada bloque de lenguaje, necesitas insertar la macro que crea el frame.</p>
+
+<ol>
+ <li>Haz clic en el botón <strong>Insert Live Code Sample iFrame</strong> en la barra de herramientas; luce así: <img alt="" src="https://mdn.mozillademos.org/files/5383/insert-live-sample-btn.png" style="height: 18px; width: 19px;">. Esto abre un cuadro de diálogo para configurar el frame de tu ejemplo ejecutable:                         <img alt="" src="https://mdn.mozillademos.org/files/5385/sample-finder.png" style="height: 358px; width: 405px;"></li>
+ <li>Bajo <strong>Document</strong>, ingresa el título del artículo que contiene el ejemplo que deseas desplegar. Por default, es el artículo que estás editando, pero puedes escoger un artículo en otra parte de MDN. Esto hace posible reusar ejemplos en múltiples páginas si es necesario. (Si escribes un texto nuevo en este campo, aparecerá un menú de coincidencias parciales; selecciona el título de la página que desees.)</li>
+ <li>En el menú <strong>Sections in Document</strong>, selecciona la sección en el artículo que contiene los bloques de código del ejemplo que quieres desplegar.</li>
+ <li>Haz clic en el botón <strong>OK</strong> para generar e insertar la macro que crea el frame del ejemplo. La macro luce algo así:<br>
+  <strong>\{{ EmbedLiveSample('Live_sample_demo') }}</strong></li>
+</ol>
+
+<h3 id="Agregando_un_nuevo_ejemplo_ejecutable">Agregando un nuevo ejemplo ejecutable</h3>
+
+<p>Si estás escribiendo una página nueva, y quieres insertar código que deseas mostrar como ejemplo ejecutable, ¡aun más del trabajo puede ser realizado por el editor para ti!</p>
+
+<ol>
+ <li>Haz clic el botón <strong>Insert Code Sample Template</strong> en la barra de herramientas, luce así: <img alt="" src="/files/4265/live-sample-button.png" style="height: 19px; width: 21px;">. Esto presenta un simple cuadro de diálogo pidiéndote que nombres a tu ejemplo ejecutable:<br>
+  <img alt="" src="https://mdn.mozillademos.org/files/5387/insert-live-sample-template.png" style="height: 155px; width: 251px;"></li>
+ <li>Ingresa el nombre del ejemplo; esto es usado como el header para el ejemplo. Asegúrate que tu título sea coherente con la pagína que escribes.</li>
+ <li>Haz clic en <strong>OK</strong>. Se creó un header nuevo con el título que elegiste, con sub-headers y bloques de código vacios para HTML, CSS y JavaScript.</li>
+ <li>Elimina cualquier sub-header y bloque de código que no necesites.</li>
+ <li>Ingresa el código que compone tu ejemplo en los bloques de código apropiados.</li>
+ <li><a href="#conventions">Revisar convenciones</a></li>
+</ol>
+
+<h3 id="Usando_el_Buscador_de_Ejemplos">Usando el Buscador de Ejemplos</h3>
+
+<p>Como se mencionó arriba, el buscador de Ejemplos se activa haciendo clic en el ícono<strong> Insert Live Code Sample iFrame</strong>. Desafortunadamente el Buscador de Ejemplos puede producir un macro que NO es usable sin editarse antes. Hay dos áreas problemáticas que deben revisarse con cuidado y editarse si es necesario.</p>
+
+<ol>
+ <li>Campo <strong>Document</strong>. Este campo buscará mientras escribes y presentará una lista de documentos que encajan con tu búsqueda. Pero la lista presentada NO incluirá sub-páginas. Por ejemplo, digamos que estás trabajando en la sub-página <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style/negative">Negative </a>de la página principal <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style">@counter-style</a>. El Buscador de Ejemplos no encontrará Negative pero si la página principal @counter-style. Cuando se selecciona @counter-style el fondo cambia a color verde. Lee debajo el problema que esto crea.</li>
+ <li><strong>Sections in Document</strong>. El menú desplegable Sections in Document puede no mostrar la sección que necesitas. Selecciona cualquiera, digamos Examples, y puede arreglarse con una simple edición.</li>
+</ol>
+
+<p>Esto es lo que el Buscador de Ejemplos produce:</p>
+
+<pre class="notranslate"><code>\{{ EmbedLiveSample('Examples', '', '', '', 'Web/CSS/@counter-style') }}</code></pre>
+
+<p>Esta macro no funcionará. El ID_de_bloque es Examples y debería ser Example en este caso (revisa la fuente del ID de esta sección para verificar cual ID_de_bloque necesitas usar). Igualmente pagina_slug es @counter-style y debería ser @counter-style/negative. Estas correcciones puede hacerse directamente en la página activando la edición.</p>
+
+<p>Después de editar la macro ahora luce así:</p>
+
+<pre class="notranslate"><code>\{{ EmbedLiveSample('Example', '', '', '', 'Web/CSS/@counter-style/negative') }}</code></pre>
+
+<p>Esta macro editada funcionará correctamente. Si la macro funciona correctamente verás el botón <strong>Open in CodePen</strong>. Una miniatura del ejemplo deberá aparecer encima del botón Open in CodePen. Si el botón está ahí pero no hay miniatura, espera unos minutos. Puede tormar un tiempo para que el servidor la genere.</p>
+
+<h2 id="Live_sample_demo" name="Live_sample_demo">Encontrando ejemplos que necesitan actualización</h2>
+
+<p>Al buscar ejemplos existentes que actualizar, hay tres tipos principales de actualización que deseas hacer:</p>
+
+<ul>
+ <li>Convertir un snippet no ejecutable en un ejemplo ejecutable.</li>
+ <li>Corregir bugs en un ejemplo ejecutable existente.</li>
+ <li>Mejorar un ejemplo ejecutable existente, o actualizar un ejemplo basándose en cambios tecnológicos.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong><strong>:</strong> Si encuentras artículos que necesitan ser actualizados para usar el sistema de ejemplos ejecutables, por favor agrega a la página la etiqueta "NeedsLiveSample".</p>
+</div>
+
+<h3 id="Encontrando_ejemplos_que_necesitan_convertirse_a_ejemplos_ejecutables">Encontrando ejemplos que necesitan convertirse a ejemplos ejecutables</h3>
+
+<p>MDN tiene montontes de ejemplos viejos que aun no usan el sistema de ejemplos ejecutables. Nuestra meta es actualizar la mayoría o todos para que sean ejemplos ejecutables.Esto aumentará la consistencia y la usabilidad. Es casi seguro que te encontrarás muchos de estos mientras usas MDN en el día a día; sin embargo, ¿cómo puedes encontrarlos si los buscas específicamente para actualizarlos? Desafortunadamente, no hay un modo fácil de hacer eso. Pero hay algunos consejos que te ayudarán a rastrearlos:</p>
+
+<ul>
+ <li>Empieza por darle un vistazo a esto <a href="/en-US/docs/tag/NeedsLiveSample" title="/en-US/docs/tag/NeedsLiveSamples">lista de páginas etiquetadas con "NeedsLiveSample"</a>. Estas son las páginas que los usuarios han marcadado como que necesitan actualizarse. Deberías agregar esta etiqueta tu mismo, si ves una página que necesita ser actualizada para usar ejemplos ejecutables pero no tienes tiempo de arreglarla enseguida.</li>
+ <li>Navega por ligas de documentación que es probable que incluyan ejemplos, como <a href="/en-US/docs/Web/JavaScript/Guide" title="/en-US/docs/Web/JavaScript/Guide">JavaScript Guide</a>, <a href="/en-US/docs/Web/HTML" title="/en-US/docs/Web/HTML">HTML documentation</a>, y <a href="/en-US/docs/Web/CSS/Reference" title="/en-US/docs/Web/CSS/Reference">CSS reference</a>.</li>
+ <li>Busca término como "<a href="/en-US/search?q=example" title="/en-US/search?q=example">example</a>" o "<a href="/en-US/search?q=sample" title="/en-US/search?q=sample">sample</a>" y revisar los resultados para páginas que actualizar.</li>
+</ul>
+
+<h2 id="Live_sample_demo" name="Live_sample_demo">Demo de ejemplo ejecutable</h2>
+
+<p>Esta sección es el resultado de usar la plantilla de ejemplo ejecutable no solo para crear el encabezado principal ("Live sample demo"), sino los sub-encabezador para nuestro contenido HTML, CSS y JavaScript. No estás limitado a un bloque para cada uno; además, no necesitan estar en algún orden partícular. ¡Mix and match!</p>
+
+<p>Puedes eliminar cualquiera de estos que desees; si no necesitas scripts, elimina el encabezado y su bloque {{HTMLElement("pre")}}. También puedes eliminar el encabezado de un bloque de código ("HTML", "CSS", o "JavaScript"), ya que estos no son usados por la macro de ejemplo ejecutable.</p>
+
+<p>Ahora que se ha insertado la plantilla, podemos agregar algo de código, e incluso algún texto explicativo.</p>
+
+<h3 id="HTML">HTML</h3>
+
+<p>Este HTML crea un parágrafo y algunos bloques para ayudarnos a posicionar y formatear un mensaje.</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;Un simple ejemplo de sistema de ejemplo ejecutable en accion.&lt;/p&gt;
+&lt;div class="box"&gt;
+  &lt;div id="item"&gt;¡Hola mundo!&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<p>El código CSS formatea el contenedor así como el mensaje.</p>
+
+<pre class="brush: css notranslate">.box {
+  width: 200px;
+  height: 100 px;
+  border-radius: 6px;
+  background-color: #ffaabb;
+}
+
+#item {
+  width: 100%;
+  font-weight: bold;
+  text-align: center;
+  font-size: 2em;
+}
+</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<p>Este código es muy simple. Todo lo que hace es agregar un manejador de evento al texto "¡Hola mundo!" que hace aparecer una alerta cuando se le hace clic.</p>
+
+<pre class="brush: js notranslate">var el = document.getElementById('item');
+el.onclick = function() {
+  alert('¡Owww, deja de picarme!');
+}
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>Aquí el resultado de ejecutar los bloques de código de arriba vía<code> \{{EmbedLiveSample('Live_sample_demo')}}</code>:</p>
+
+<p>{{EmbedLiveSample('Live_sample_demo')}}</p>
+
+<p>Aquí un enlace que resulta de llamar los bloques de código vía <code>\{{LiveSampleLink('Live_sample_demo', 'Live sample demo link')}}</code>:</p>
+
+<p>{{LiveSampleLink('Live_sample_demo', 'Live sample demo link')}}</p>
+
+<h2 id="Convenciones_acerca_de_los_ejemplos_ejecutables"><a id="conventions" name="conventions">Convenciones acerca de los ejemplos ejecutables</a></h2>
+
+<div class="note">
+<p><strong>Nota:</strong> Esto es actual (Feb. 2016) en discusión en la lista de emails dev-mdc (ver <a href="https://groups.google.com/forum/#!topic/mozilla.dev.mdc/49oqJAHFnWQ">this thread</a>). Cualquier entrada es bienvenida. Si esta nota persiste después de unos meses (Apr. 2016), por favor contactar al autor del primer email en este hilo para actualizar esta página.</p>
+</div>
+
+<dl>
+ <dt>Orden de los bloques de código</dt>
+ <dd>Al agregar un ejemplo ejecutable, los bloques de código deben ser organizados para que el primero corresponda al lenguaje principal (si hay uno). Por ejemplo, al agregar un ejemplo ejecutable para una referencia HTML, el primer bloque debe ser HTML, al agregar un ejemplo ejecutable para una referencia CSS, debe ser el de CSS y así.</dd>
+ <dt>Nombrando los encabezados</dt>
+ <dd>Cuando no hay ambigüedad (p.ej. el ejemplo está bajo una sección "Ejemplos"), los encabezados deben ser directos con el único nombre del lenguaje correspondiente: HTML, CSS, JavaScript, SVG, etc. (ver arriba). No deben usarse encabezados como "contenido HTML" o "contenido JavaScript". Sin embargo si un encabezado tan corto hace que el contenido no sea claro, uno puede usar un título más elaborado.</dd>
+ <dt>Usando un bloque "Result"</dt>
+ <dd>Después de los diferentes bloques de código, favor de usar un último bloque "Result" antes de usar macro <code>EmbedLiveSample</code> (ver arriba). De este modo, se hace más clara la semántica del ejemplo tanto para el lector como para cualquier herramienta que analice la página (p.ej. screen reader, web crawler).</dd>
+</dl>
diff --git a/files/es/mdn/structures/macros/other/index.html b/files/es/mdn/structures/macros/other/index.html
new file mode 100644
index 0000000000..c703a2f9cf
--- /dev/null
+++ b/files/es/mdn/structures/macros/other/index.html
@@ -0,0 +1,182 @@
+---
+title: Otras macros
+slug: MDN/Structures/Macros/Other
+tags:
+  - Macros
+  - Referencia
+translation_of: MDN/Structures/Macros/Other
+original_slug: MDN/Structures/Macros/Otras
+---
+<div>{{MDNSidebar}}</div>
+
+<p>A diferencia de las macros enumeradas en {{web.link("/es/docs/MDN/Contribute/Structures/Macros/Commonly-used_macros", "Macros usadas comúnmente")}}, las macros documentadas en este artículo se usan con poca frecuencia o solo en contextos específicos, o están en desuso.</p>
+
+<h2 id="Contextos_especiales">Contextos especiales</h2>
+
+<p>Estas macros se utilizan solo con contextos particulares, como una referencia de API específica.</p>
+
+<ul>
+ <li>{{TemplateLink("jsapixref")}} enlaza a una página en la {{web.link("/es/docs/SpiderMonkey/JSAPI_Reference", "Referencia de JSAPI")}}.</li>
+ <li>{{TemplateLink("XPCOMxref")}} enlaza a una página en la referencia de XPCOM. Puedes especificar el nombre de una función, clase, componente o interfaz XPCOM (aunque para esta última, en su lugar, debes usar {{TemplateLink("interface")}}). Esta macro encontrará la página y creará un enlace a ella, donde sea que esté en el subárbol de la referencia de XPCOM.</li>
+ <li>{{TemplateLink("npapi")}} enlaza a la {{web.link("/es/docs/Gecko_Plugin_API_Reference", "Referencia de la API del complemento Gecko")}}.</li>
+ <li>{{TemplateLink("interface")}} se puede usar cuando se vincula a interfaces XPCOM.<br>
+  Ejemplo: <code>\{{interface ("nsIIOService")}}</code> da como resultado: {{Interface("nsIIOService")}}.</li>
+ <li>{{TemplateLink("ifmethod")}} e {{TemplateLink("ifattribute")}} te permiten crear un enlace a un método o atributo (respectivamente) en particular en una interfaz de Mozilla que se ha creado usando nuestro {{web.link("/es/docs/MDN/Contribute/Howto/Write_interface_reference_documentation", "formato estándar para la documentación de la interfaz")}}. Por ejemplo, <code>\{\{ifmethod("nsIAutoCompleteSearch", "stopSearch")\}\}</code> aparece como {{ifmethod("nsIAutoCompleteSearch", "stopSearch")}}. Ten en cuenta que para {{TemplateLink("ifattribute")}}, <code>id="..."</code> se debe agregar explícitamente en el destino, ya que los atributos no tienen encabezados.</li>
+ <li>{{TemplateLink("Interwiki")}} facilita la creación de enlaces Interwiki. Actualmente admite enlaces a Wikipedia y Wikimo. El primer parámetro es el nombre de la wiki ("wikipedia" o "wikimo") y el segundo es la ruta del artículo. Por ejemplo, <code>\{\{interwiki("wikipedia", "Firefox")\}\}</code> aparece como {{Interwiki("wikipedia", "Firefox")}}. Esta plantilla automáticamente detecta el idioma de la página y lo dirige al mismo idioma en Wikipedia, por ejemplo.</li>
+ <li>{{TemplateLink("RFC")}} crea un enlace al RFC especificado, dado su número. La sintaxis es simplemente: <code>\{\{RFC(número)\}\}</code>. Por ejemplo, <code>\{\{RFC(2616)\}\}</code> se convierte en {{RFC(2616)}}.</li>
+</ul>
+
+<h3 id="Componentes_de_la_página_destino">Componentes de la página destino</h3>
+
+<p>Tenemos una variedad de macros que se pueden utilizar para generar automáticamente el contenido de las páginas destino. Aquí están.</p>
+
+<h4 id="Listas_de_subpáginas">Listas de subpáginas</h4>
+
+<ul>
+ <li>{{TemplateLink("ListSubpages")}} genera una lista desordenada de enlaces a todos los hijos inmediatos de la página actual; útil para generar automáticamente tablas de contenido para conjuntos de documentación.</li>
+ <li>{{TemplateLink("LandingPageListSubpages")}} genera una lista de definición de dos columnas de todas las subpáginas inmediatas de la página actual, con sus títulos como {{HTMLElement("dt")}} y su resumen SEO como {{HTMLElement("dd")}}. Esto facilita la generación automática de páginas destino razonablemente atractivas.</li>
+ <li>{{TemplateLink("NavListWithPrioritizedPages")}} genera una lista ordenada formateada correctamente para su uso en una zona de barra de navegación lateral (o enlaces rápidos). Como entrada, puedes especificar cero o más enlaces amigables de página que se deben sacar de la lista principal y, en su lugar, insertarse en la parte superior de la lista, en el orden dado. Todas las páginas restantes se colocan alfabéticamente en la lista. Se incluye un nivel de subpáginas.</li>
+ <li>{{TemplateLink("APIListAlpha")}} crea una lista de las subpáginas de la página actual, formateada como una lista de términos de la API, dividida por la primera letra. Hay tres parámetros. El primero es 0 si deseas incluir todas las subpáginas de nivel superior o 1 para omitir las subpáginas con "." en sus nombres. El segundo y el tercero te permiten agregar texto para mostrar como parte del nombre en cada enlace. Esto se puede usar para agregar "&lt;" y "&gt;" para los enlaces de elementos, o para agregar "()" al final de las listas de nombres de métodos.</li>
+ <li>{{TemplateLink("SubpagesWithSummaries")}} construye una lista de definiciones de todos los hijos inmediatos de la página actual. No se ha realizado ningún otro formateo. Puedes obtener una lista de dos columnas preparada para usar como página destino de varias columnas mediante {{TemplateLink("LandingPageListSubpages")}}.</li>
+</ul>
+
+<h3 id="Enlaces_rápidos">Enlaces rápidos</h3>
+
+<p>Tenemos algunas macros diseñadas específicamente para crear {{web.link("/es/docs/MDN/Contribute/Style_guide/Quicklinks", "enlaces rápidos")}}:</p>
+
+<ul>
+ <li>La macro {{TemplateLink("MakeSimpleQuicklinks")}} crea una lista plana de enlaces en el cuadro de enlaces rápidos. Simplemente dale un conjunto de rutas a las páginas destino como argumentos de entrada. El texto de cada enlace es el título de la página y cada enlace tiene una información sobre herramientas derivada del resumen de la página.</li>
+ <li>{{TemplateLink("QuickLinksWithSubpages")}} crea un conjunto de enlaces rápidos compuestos por las páginas debajo de la página actual (o la página especificada, si se proporciona una). En total, se generan hasta dos niveles de profundidad.</li>
+</ul>
+
+<h2 id="Usadas_con_poca_frecuencia">Usadas con poca frecuencia</h2>
+
+<ul>
+ <li id="Template.3Aoutdated">{{TemplateLink("outdated")}} se puede usar para marcar páginas que se sabe que están (o que podrían estar) horriblemente desactualizadas. La plantilla va seguida de un parámetro opcional, que se puede utilizar para proporcionar detalles. Por ejemplo: <code>\{\{outdated("Se actualizó por última vez en 1999")\}\}</code> te da esto: {{outdated("Se actualizó por última vez en 1999.")}}</li>
+ <li>{{TemplateLink("disambig")}} se usa en las pocas páginas de desambiguación que tenemos. No utilices esta macro en las páginas de desambiguación del glosario; en su lugar, utiliza la macro {{TemplateLink("GlossaryDisambiguation")}}.</li>
+ <li>{{TemplateLink("block-title")}} se puede utilizar para crear texto en negrita que visualmente sirve como título para un bloque en una página, no aparece en la tabla de contenido generada automáticamente y puede actuar como un enlace para apuntar tal como lo hacen los encabezados. La sintaxis es: <code>\{\{block-title(<em>título</em>)\}\}</code>, donde <code><em>título</em></code> es lo que quieras que se muestre. <code><em>título</em></code> también sirve como destino para los enlaces a la sección que estás titulando. {{TemplateLink("block-title")}} está diseñado para usarse en titulación {{anch("Plantilla: nota al margen")}}, tablas, imágenes y bloques de código, particularmente en lugares a los que te referirás en el artículo más de una vez o en lugares no cercanos al artículo en sí mismo.</li>
+ <li>{{TemplateLink("ref")}} y {{TemplateLink("endnote")}} se pueden utilizar para implementar notas a pie de página en los artículos. El "número" de la nota al pie se crea usando <code>\{\{ref("algo")\}\}</code>, dónde <code><em>algo</em></code> debería ser una palabra descriptiva adecuada para todo lo que se menciona en la nota al pie. Luego, al final del documento, inserta <code>\{\{endnote("algo")\}\} Blah blah, texto para la primera nota al pie</code> para crear una lista numerada para la información de las notas al pie.</li>
+ <li>{{TemplateLink("ReleaseChannelInfo")}} se utiliza para crear el encabezado estándar en la parte superior de las páginas de "Firefox X para desarrolladores" para un determinado canal; se necesitan cuatro parámetros: la versión de Firefox, la versión de Gecko, una cadena que indica una fecha de lanzamiento prevista y el nombre del canal en el que se puede descargar el lanzamiento actualmente.</li>
+ <li>{{TemplateLink("InsertFeedLinkList")}} genera una lista de enlaces de una fuente RSS. Sus parámetros configuran la salida de manera significativa:
+  <ul>
+   <li>URL para el canal</li>
+   <li>Número máximo de entradas para incluir en la salida</li>
+   <li>El nivel de encabezado que se usará para el nombre del canal o 0 para dejar ese encabezado</li>
+   <li>Nombre de la clase que se utilizará al crear la lista; esto se aplicará al elemento {{HTMLElement("ul")}}.</li>
+   <li>Tipo de lista; este es un valor entero. 0 produce una lista de viñetas simple, mientras que 1 genera un encabezado para el título de la página seguido de un párrafo con una línea de autor.</li>
+   <li>El nivel de título que se utilizará para los elementos de la lista cuando se utilice el tipo de lista 1.</li>
+  </ul>
+ </li>
+</ul>
+
+<h3 id="Transclusión">Transclusión</h3>
+
+<p>La <strong>transclusión</strong> es la incorporación de parte o la totalidad de una página en otra. Ten cuidado al utilizar esta macro, para asegurarte de que el contenido transcluido tenga sentido en el contexto de la página en la que está incorporado.</p>
+
+<p>{{TemplateLink("page")}} te permite incrustar parte o la totalidad de una página específica en un documento. Acepta cinco parámetros:</p>
+
+<ol>
+ <li>La URI de la página que se va a transcluir. Por ejemplo, "/es/docs/Project:MDN/About".</li>
+ <li>El nombre de la sección dentro de la página que se va a incluir. Esto se puede especificar como la cadena de título o como el ID de un bloque a copiar. Si no se especifica, se transcluye todo el artículo. {{optional_inline}}</li>
+ <li>El número de revisión de la versión de la página que se va a incluir. Esta función no está implementada actualmente, pero permitiría incluir texto de versiones específicas de un artículo. {{unimplemented_inline}}</li>
+ <li>Un valor booleano que indica si se muestra o no el encabezado de la sección de nivel superior que se está transcluyendo. Esto es útil si deseas especificar tu propio título. El valor predeterminado es falso, lo cual significa que el encabezado no se incluye de forma predeterminada. {{optional_inline}}</li>
+ <li>El nivel de título que se utilizará como nivel de título superior. Esto ajusta el primer nivel descubierto más externo del contenido transcluido al número especificado, y todos los demás encabezados correspondientemente. Esto te permite incluir contenido que tiene sus propios títulos, pero ajustarlos para que coincidan con el nivel de título en el que los estás incluyendo. Si no especificas este valor, los títulos no se ajustan. {{unimplemented_inline}}</li>
+</ol>
+
+<h4 id="Ejemplo_sin_título">Ejemplo sin título</h4>
+
+<p>\{{Page("/es/docs/MDN/About", "Acerca de Mozilla")}}</p>
+
+<p>Resultado:</p>
+
+<p>{{Page("/es/docs/MDN/About", "Acerca de Mozilla")}}</p>
+
+<h4 id="Ejemplo_con_encabezado">Ejemplo con encabezado</h4>
+
+<p>\{{Page("/es/docs/MDN/About", "Acerca de Mozilla", 0, 1)}}</p>
+
+<p>Resultado:</p>
+
+<p>{{Page("/es/docs/MDN/About", "Acerca de Mozilla", 0, 1)}}</p>
+
+<h3 id="Creando_nuevas_insignias">Creando nuevas insignias</h3>
+
+<p>También tenemos insignias que no tienen iconos con burbujas. La plantilla genérica para esto es {{TemplateLink("SimpleBadge")}}, que acepta tres parámetros:</p>
+
+<ol>
+ <li>Texto para mostrar en la insignia.</li>
+ <li>Nombre de una clase CSS que se utilizará como fondo de la insignia.</li>
+ <li>(Opcional) Texto para mostrar en una información sobre herramientas al pasar el cursor sobre la insignia.</li>
+</ol>
+
+<h2 id="Desaprobado">Desaprobado</h2>
+
+<p>Estas macros han sido reemplazadas por otras formas de hacer lo mismo y ya no se deberían usar. Si los encuentras en artículos existentes, reemplázalos.</p>
+
+<h3 id="Enlaces">Enlaces</h3>
+
+<ul>
+ <li>La macro {{TemplateLink("anch")}} inserta un enlace a un ancla. <code class="nowiki">\{\{anch("top")\}\}</code> produce <code class="nowiki">&lt;a href="#top"&gt;top&lt;/a&gt;</code> ({{anch("top")}}). También puedes agregar un segundo parámetro que contiene texto de reemplazo para mostrar como texto del enlace. \{{anch("Otras insignias", "puedes usar otras insignias")}} produce este resultado: {{anch("Otras insignias", "puedes usar otras insignias")}}. La idea era crear una plantilla que permitiera vincular fácilmente a otras secciones de un documento. <strong>Reemplazo</strong>: usa el botón de la barra de herramientas de anclaje en la interfaz del editor. <em>Esto realmente no es un "reemplazo" y existe cierta discusión sobre si esto está realmente desaprobado en este momento</em>.</li>
+ <li>La macro {{TemplateLink("SectionOnPage")}} crea una frase que enlaza tanto con el nombre de una sección como con el artículo que contiene esa sección. Por ejemplo, <code>\{{SectionOnPage("/es/docs/Mozilla/Firefox/Releases/21", "Cambios para desarrolladores web")}}</code> genera lo siguiente: <em>{{SectionOnPage("/es/docs/Mozilla/Firefox/Releases/21", "Cambios para desarrolladores web")}}</em>.</li>
+ <li>La macro {{TemplateLink("manch")}} inserta un enlace a un método dentro de la interfaz actual; esto está destinado únicamente para su uso en las páginas de documentación de la interfaz. <code>\{\{manch("foo")\}\}</code> produce <code>&lt;code&gt;&lt;a href="ruta/actual#foo"&gt;foo()&lt;/a&gt;&lt;/code&gt;</code> ({{manch("foo")}}).</li>
+ <li>La macro {{TemplateLink("Link")}} inserta un enlace a la página especificada en MDN, usando el título de la página como la cadena visible para hacer clic, y la información sobre herramientas extraída del resumen SEO de la página.</li>
+ <li>La macro {{TemplateLink("LinkItem")}} inserta un enlace a una URL especificada, con el texto indicado como la cadena visible para hacer clic. El enlace automáticamente recoge como información sobre herramientas el resumen de la página destino. Esto difiere de {{TemplateLink("Link")}} en que debe especificar el título.</li>
+ <li>La macro {{TemplateLink("LinkItemDL")}} inserta un enlace a una URL especificada, con el texto indicado como {{HTMLElement("dt")}} que también es el enlace. El elemento {{HTMLElement("dd")}} contiene el resumen de la página especificada.</li>
+ <li>{{TemplateLink("funcref")}} crea enlaces a funciones globales (generalmente de C++) documentadas en páginas de nivel superior. Sin embargo, estas páginas ya no se crean en el nivel superior de MDN.</li>
+ <li>{{TemplateLink("Pref")}} inserta un enlace a la entrada en {{web.link("/es/docs/Mozilla/Preferences/Preference_reference", "Referencia de preferencia")}} para la preferencia especificada.</li>
+ <li>{{TemplateLink("spec")}} inserta un enlace a una especificación. <strong>Reemplazo</strong>: utiliza {{TemplateLink("spec2")}} o {{TemplateLink ("SpecName")}} en su lugar.</li>
+ <li>{{TemplateLink("source")}} te permite vincular a un archivo de código fuente de Mozilla sin tener que escribir una URL MXR larga usando esta sintaxis: <code>\{\{source("browser/Makefile.in")\}\}</code>. Esto te da: {{source("browser/Makefile.in")}}. El texto del enlace es la ruta proporcionada; si deseas un texto diferente, proporciona un segundo parámetro, así: <code>\{\{source("browser/Makefile.in", "the browser/Makefile.in")\}\}</code> , que produce {{source("browser/Makefile.in", "the browser/Makefile.in")}}. Ten en cuenta que el enlace será a la última versión del archivo en código de última generación.</li>
+ <li>{{TemplateLink("source_cvs")}} funciona igual que {{TemplateLink("source")}}, excepto que enlaza con {{web.link("/es/docs/Developer_Guide/Source_Code/CVS", "repositorio CVS")}} en lugar del más nuevo {{web.link("/es/docs/mozilla-central", "mozilla-central")}} uno.</li>
+ <li>{{TemplateLink("LXRSearch")}} se puede utilizar para crear una URL de búsqueda LXR.</li>
+</ul>
+
+<h3 id="Ejemplos_de_código">Ejemplos de código</h3>
+
+<p>Las siguientes macros se usaron antes de la implementación del {{web.link("/es/docs/MDN/Contribute/Structures/Live_samples", "sistema de ejemplo en vivo")}} integrado en Kuma, y se deben reemplazar por usos de {{TemplateLink("EmbedLiveSample")}} o {{TemplateLink("LiveSampleLink")}}.</p>
+
+<ul>
+ <li>{{TemplateLink("LiveSample")}} te permite crear un botón que se vincule a un archivo de ejemplo; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en las páginas de referencia cuando se vinculan a páginas de muestra independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
+ <li>{{TemplateLink("CSSLiveSample")}} te permite crear un botón que se vincule a una muestra en la Referencia CSS; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en las páginas de referencia de CSS cuando se vinculan a páginas de ejemplo independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
+ <li>{{TemplateLink("DOMLiveSample")}} te permite crear un botón que se vincule a una ejemplo en la Referencia DOM; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estas se utilizaron en las páginas de referencia DOM al vincular a páginas de ejemplos independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
+ <li>{{TemplateLink("HTMLLiveSample")}} te permite crear un botón que enlace a una ejemplo en la Referencia HTML; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en páginas de referencia HTML al vincular a páginas de ejemplos independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
+ <li>{{TemplateLink("SVGLiveSample")}} te permite crear un botón que se vincule a un ejemplo en la Referencia DOM; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en las páginas de referencia SVG al vincular a páginas de ejemplos independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
+ <li>{{TemplateLink("JSFiddleLink")}} te permite crear fácilmente un botón que enlace a un ejemplo en el <a class="external" href="http://jsfiddle.net" title="http://jsfiddle.net/">sitio web jsFiddle</a>. Estos <strong>NO</strong> se deben usar para reemplazar los ejemplos en línea o los ejemplos cargados por MDC, sino para ofrecer acceso a ejemplos secundarios con los que los lectores pueden experimentar. La plantilla acepta un parámetro, la etiqueta de identificación del elemento jsFiddle a vincular.</li>
+</ul>
+
+<h3 id="Organizacional">Organizacional</h3>
+
+<ul>
+ <li>{{TemplateLink("LockedPage")}} inserta una barra de marcas en la página que proporciona una explicación de por qué una página está bloqueada. Esta macro está obsoleta porque Kuma no admite el bloqueo de páginas.</li>
+ <li>{{TemplateLInk("jsapi_ref_header")}} se utilizó para crear rutas de navegación para la JSAPI referenciada; esto ahora lo hace Kuma, no una macro.</li>
+</ul>
+
+<h3 id="Formateo">Formateo</h3>
+
+<ul>
+ <li>{{TemplateLink("Note")}} inserta un bloque de "nota" con un formato especial en el texto del artículo. Esto tiene la intención de resaltar un hecho interesante o importante. <strong>Reemplazo</strong>: Usa el estilo <code>Note box</code> en la barra de herramientas del Editor.</li>
+ <li>{{TemplateLink("warning")}} inserta un bloque de "advertencia" con un formato especial. {{TemplateLink("WarningStart")}} y {{TemplateLink("WarningEnd")}} definen el inicio y el final del bloque de advertencia que debe contener otras llamadas de macro. <strong>Reemplazo</strong>: Usa el estilo <code>Warning box</code> en la barra de herramientas del Editor.</li>
+</ul>
+
+<h3 id="Indicadores_de_versión">Indicadores de versión</h3>
+
+<p>Las siguientes macros están en desuso porque esta información debería estar contenida en el artículo de la tabla de compatibilidad de navegadores.</p>
+
+<ul>
+ <li>{{TemplateLink("gecko_minversion_header")}} indica la versión mínima de Gecko para una función.</li>
+ <li>{{TemplateLink("Gecko")}} inserta el texto "Gecko <em>número de versión</em>" en el texto, pero agrega una información sobre herramientas que, cuando el usuario pasa el mouse sobre él, muestra las versiones correspondientes de Firefox, Thunderbird y SeaMonkey.</li>
+ <li>{{TemplateLink("fx_minversion_header")}} y {{TemplateLink("fx_minversion_section")}} indican la versión mínima de Firefox para una función.</li>
+ <li>{{TemplateLink("tb_minversion_header")}}, {{TemplateLink("tb_minversion_section")}} y {{TemplateLink("tb_minversion_inline")}} indican la versión mínima de Thunderbird para una función.</li>
+ <li>{{TemplateLink("js_minversion_header")}} y {{TemplateLink("js_minversion_inline")}} indican la versión mínima de JavaScript para una función.</li>
+ <li>{{TemplateLink("MobileOnlyHeader")}} inserta un cuadro de encabezado "Disponible solo para Firefox móvil". {{TemplateLink("MobileOnlyInline")}} inserta un indicador en línea. Estos indican la versión de Gecko a partir de la cual la interfaz solo está disponible para dispositivos móviles.</li>
+ <li>{{TemplateLink("dom_level")}} indica la versión mínima del DOM para una función.</li>
+ <li>{{TemplateLink("renamed_inline")}} inserta una marca "renombrada" en línea para indicar que se ha cambiado el nombre de una API.</li>
+ <li>{{TemplateLink("unimplemented_inline")}} inserta una marca en línea de "no implementado" para evitar el uso de, por ejemplo, una función, método o propiedad que aún no está implementada. <strong>Reemplazo</strong>: Utiliza la tabla de compatibilidad de navegadores para indicar esta información.</li>
+ <li>{{TemplateLink("unimplemented_inline_webkit")}} inserta una marca de "no implementado" en línea para evitar el uso de, por ejemplo, una función, método o propiedad que aún no está implementada. <strong>Reemplazo</strong>: Utiliza la tabla de compatibilidad de navegadores para indicar esta información.</li>
+ <li>{{TemplateLink("gecko_callout_heading")}} incluye un cuadro de llamada específico de la versión de Gecko.</li>
+ <li>{{TemplateLink("fx_minversion_note")}} crea una nota sobre una versión mínima de Firefox; {{TemplateLink("GeckoMinVersionNoteStart")}} y {{TemplateLink("GeckoMinVersionNoteEnd")}} se pueden usar para envolver texto dentro de un cuadro etiquetado como perteneciente a una versión dada de Gecko y posteriores; especifica la versión como el único parámetro "<code>start</code>" de la macro.</li>
+ <li>{{TemplateLink("tb_minversion_note")}} crea una nota sobre una versión mínima de Thunderbird.</li>
+ <li>{{TemplateLink("js_minversion_note")}} crea una nota sobre una versión mínima de JavaScript.</li>
+ <li>
+  <p>{{TemplateLink("h1_gecko_minversion")}}, {{TemplateLink("h2_gecko_minversion")}} y {{TemplateLink("h3_gecko_minversion")}} te permiten insertar encabezados (h1, h2 y h3) que se incluyen a la derecha al final de la línea, una insignia que indica la versión de Gecko (y las versiones correspondientes de la aplicación) a la que se aplica la sección.</p>
+ </li>
+</ul>
diff --git a/files/es/mdn/structures/macros/otras/index.html b/files/es/mdn/structures/macros/otras/index.html
deleted file mode 100644
index 532bc07fdc..0000000000
--- a/files/es/mdn/structures/macros/otras/index.html
+++ /dev/null
@@ -1,181 +0,0 @@
----
-title: Otras macros
-slug: MDN/Structures/Macros/Otras
-tags:
-  - Macros
-  - Referencia
-translation_of: MDN/Structures/Macros/Other
----
-<div>{{MDNSidebar}}</div>
-
-<p>A diferencia de las macros enumeradas en {{web.link("/es/docs/MDN/Contribute/Structures/Macros/Commonly-used_macros", "Macros usadas comúnmente")}}, las macros documentadas en este artículo se usan con poca frecuencia o solo en contextos específicos, o están en desuso.</p>
-
-<h2 id="Contextos_especiales">Contextos especiales</h2>
-
-<p>Estas macros se utilizan solo con contextos particulares, como una referencia de API específica.</p>
-
-<ul>
- <li>{{TemplateLink("jsapixref")}} enlaza a una página en la {{web.link("/es/docs/SpiderMonkey/JSAPI_Reference", "Referencia de JSAPI")}}.</li>
- <li>{{TemplateLink("XPCOMxref")}} enlaza a una página en la referencia de XPCOM. Puedes especificar el nombre de una función, clase, componente o interfaz XPCOM (aunque para esta última, en su lugar, debes usar {{TemplateLink("interface")}}). Esta macro encontrará la página y creará un enlace a ella, donde sea que esté en el subárbol de la referencia de XPCOM.</li>
- <li>{{TemplateLink("npapi")}} enlaza a la {{web.link("/es/docs/Gecko_Plugin_API_Reference", "Referencia de la API del complemento Gecko")}}.</li>
- <li>{{TemplateLink("interface")}} se puede usar cuando se vincula a interfaces XPCOM.<br>
-  Ejemplo: <code>\{{interface ("nsIIOService")}}</code> da como resultado: {{Interface("nsIIOService")}}.</li>
- <li>{{TemplateLink("ifmethod")}} e {{TemplateLink("ifattribute")}} te permiten crear un enlace a un método o atributo (respectivamente) en particular en una interfaz de Mozilla que se ha creado usando nuestro {{web.link("/es/docs/MDN/Contribute/Howto/Write_interface_reference_documentation", "formato estándar para la documentación de la interfaz")}}. Por ejemplo, <code>\{\{ifmethod("nsIAutoCompleteSearch", "stopSearch")\}\}</code> aparece como {{ifmethod("nsIAutoCompleteSearch", "stopSearch")}}. Ten en cuenta que para {{TemplateLink("ifattribute")}}, <code>id="..."</code> se debe agregar explícitamente en el destino, ya que los atributos no tienen encabezados.</li>
- <li>{{TemplateLink("Interwiki")}} facilita la creación de enlaces Interwiki. Actualmente admite enlaces a Wikipedia y Wikimo. El primer parámetro es el nombre de la wiki ("wikipedia" o "wikimo") y el segundo es la ruta del artículo. Por ejemplo, <code>\{\{interwiki("wikipedia", "Firefox")\}\}</code> aparece como {{Interwiki("wikipedia", "Firefox")}}. Esta plantilla automáticamente detecta el idioma de la página y lo dirige al mismo idioma en Wikipedia, por ejemplo.</li>
- <li>{{TemplateLink("RFC")}} crea un enlace al RFC especificado, dado su número. La sintaxis es simplemente: <code>\{\{RFC(número)\}\}</code>. Por ejemplo, <code>\{\{RFC(2616)\}\}</code> se convierte en {{RFC(2616)}}.</li>
-</ul>
-
-<h3 id="Componentes_de_la_página_destino">Componentes de la página destino</h3>
-
-<p>Tenemos una variedad de macros que se pueden utilizar para generar automáticamente el contenido de las páginas destino. Aquí están.</p>
-
-<h4 id="Listas_de_subpáginas">Listas de subpáginas</h4>
-
-<ul>
- <li>{{TemplateLink("ListSubpages")}} genera una lista desordenada de enlaces a todos los hijos inmediatos de la página actual; útil para generar automáticamente tablas de contenido para conjuntos de documentación.</li>
- <li>{{TemplateLink("LandingPageListSubpages")}} genera una lista de definición de dos columnas de todas las subpáginas inmediatas de la página actual, con sus títulos como {{HTMLElement("dt")}} y su resumen SEO como {{HTMLElement("dd")}}. Esto facilita la generación automática de páginas destino razonablemente atractivas.</li>
- <li>{{TemplateLink("NavListWithPrioritizedPages")}} genera una lista ordenada formateada correctamente para su uso en una zona de barra de navegación lateral (o enlaces rápidos). Como entrada, puedes especificar cero o más enlaces amigables de página que se deben sacar de la lista principal y, en su lugar, insertarse en la parte superior de la lista, en el orden dado. Todas las páginas restantes se colocan alfabéticamente en la lista. Se incluye un nivel de subpáginas.</li>
- <li>{{TemplateLink("APIListAlpha")}} crea una lista de las subpáginas de la página actual, formateada como una lista de términos de la API, dividida por la primera letra. Hay tres parámetros. El primero es 0 si deseas incluir todas las subpáginas de nivel superior o 1 para omitir las subpáginas con "." en sus nombres. El segundo y el tercero te permiten agregar texto para mostrar como parte del nombre en cada enlace. Esto se puede usar para agregar "&lt;" y "&gt;" para los enlaces de elementos, o para agregar "()" al final de las listas de nombres de métodos.</li>
- <li>{{TemplateLink("SubpagesWithSummaries")}} construye una lista de definiciones de todos los hijos inmediatos de la página actual. No se ha realizado ningún otro formateo. Puedes obtener una lista de dos columnas preparada para usar como página destino de varias columnas mediante {{TemplateLink("LandingPageListSubpages")}}.</li>
-</ul>
-
-<h3 id="Enlaces_rápidos">Enlaces rápidos</h3>
-
-<p>Tenemos algunas macros diseñadas específicamente para crear {{web.link("/es/docs/MDN/Contribute/Style_guide/Quicklinks", "enlaces rápidos")}}:</p>
-
-<ul>
- <li>La macro {{TemplateLink("MakeSimpleQuicklinks")}} crea una lista plana de enlaces en el cuadro de enlaces rápidos. Simplemente dale un conjunto de rutas a las páginas destino como argumentos de entrada. El texto de cada enlace es el título de la página y cada enlace tiene una información sobre herramientas derivada del resumen de la página.</li>
- <li>{{TemplateLink("QuickLinksWithSubpages")}} crea un conjunto de enlaces rápidos compuestos por las páginas debajo de la página actual (o la página especificada, si se proporciona una). En total, se generan hasta dos niveles de profundidad.</li>
-</ul>
-
-<h2 id="Usadas_con_poca_frecuencia">Usadas con poca frecuencia</h2>
-
-<ul>
- <li id="Template.3Aoutdated">{{TemplateLink("outdated")}} se puede usar para marcar páginas que se sabe que están (o que podrían estar) horriblemente desactualizadas. La plantilla va seguida de un parámetro opcional, que se puede utilizar para proporcionar detalles. Por ejemplo: <code>\{\{outdated("Se actualizó por última vez en 1999")\}\}</code> te da esto: {{outdated("Se actualizó por última vez en 1999.")}}</li>
- <li>{{TemplateLink("disambig")}} se usa en las pocas páginas de desambiguación que tenemos. No utilices esta macro en las páginas de desambiguación del glosario; en su lugar, utiliza la macro {{TemplateLink("GlossaryDisambiguation")}}.</li>
- <li>{{TemplateLink("block-title")}} se puede utilizar para crear texto en negrita que visualmente sirve como título para un bloque en una página, no aparece en la tabla de contenido generada automáticamente y puede actuar como un enlace para apuntar tal como lo hacen los encabezados. La sintaxis es: <code>\{\{block-title(<em>título</em>)\}\}</code>, donde <code><em>título</em></code> es lo que quieras que se muestre. <code><em>título</em></code> también sirve como destino para los enlaces a la sección que estás titulando. {{TemplateLink("block-title")}} está diseñado para usarse en titulación {{anch("Plantilla: nota al margen")}}, tablas, imágenes y bloques de código, particularmente en lugares a los que te referirás en el artículo más de una vez o en lugares no cercanos al artículo en sí mismo.</li>
- <li>{{TemplateLink("ref")}} y {{TemplateLink("endnote")}} se pueden utilizar para implementar notas a pie de página en los artículos. El "número" de la nota al pie se crea usando <code>\{\{ref("algo")\}\}</code>, dónde <code><em>algo</em></code> debería ser una palabra descriptiva adecuada para todo lo que se menciona en la nota al pie. Luego, al final del documento, inserta <code>\{\{endnote("algo")\}\} Blah blah, texto para la primera nota al pie</code> para crear una lista numerada para la información de las notas al pie.</li>
- <li>{{TemplateLink("ReleaseChannelInfo")}} se utiliza para crear el encabezado estándar en la parte superior de las páginas de "Firefox X para desarrolladores" para un determinado canal; se necesitan cuatro parámetros: la versión de Firefox, la versión de Gecko, una cadena que indica una fecha de lanzamiento prevista y el nombre del canal en el que se puede descargar el lanzamiento actualmente.</li>
- <li>{{TemplateLink("InsertFeedLinkList")}} genera una lista de enlaces de una fuente RSS. Sus parámetros configuran la salida de manera significativa:
-  <ul>
-   <li>URL para el canal</li>
-   <li>Número máximo de entradas para incluir en la salida</li>
-   <li>El nivel de encabezado que se usará para el nombre del canal o 0 para dejar ese encabezado</li>
-   <li>Nombre de la clase que se utilizará al crear la lista; esto se aplicará al elemento {{HTMLElement("ul")}}.</li>
-   <li>Tipo de lista; este es un valor entero. 0 produce una lista de viñetas simple, mientras que 1 genera un encabezado para el título de la página seguido de un párrafo con una línea de autor.</li>
-   <li>El nivel de título que se utilizará para los elementos de la lista cuando se utilice el tipo de lista 1.</li>
-  </ul>
- </li>
-</ul>
-
-<h3 id="Transclusión">Transclusión</h3>
-
-<p>La <strong>transclusión</strong> es la incorporación de parte o la totalidad de una página en otra. Ten cuidado al utilizar esta macro, para asegurarte de que el contenido transcluido tenga sentido en el contexto de la página en la que está incorporado.</p>
-
-<p>{{TemplateLink("page")}} te permite incrustar parte o la totalidad de una página específica en un documento. Acepta cinco parámetros:</p>
-
-<ol>
- <li>La URI de la página que se va a transcluir. Por ejemplo, "/es/docs/Project:MDN/About".</li>
- <li>El nombre de la sección dentro de la página que se va a incluir. Esto se puede especificar como la cadena de título o como el ID de un bloque a copiar. Si no se especifica, se transcluye todo el artículo. {{optional_inline}}</li>
- <li>El número de revisión de la versión de la página que se va a incluir. Esta función no está implementada actualmente, pero permitiría incluir texto de versiones específicas de un artículo. {{unimplemented_inline}}</li>
- <li>Un valor booleano que indica si se muestra o no el encabezado de la sección de nivel superior que se está transcluyendo. Esto es útil si deseas especificar tu propio título. El valor predeterminado es falso, lo cual significa que el encabezado no se incluye de forma predeterminada. {{optional_inline}}</li>
- <li>El nivel de título que se utilizará como nivel de título superior. Esto ajusta el primer nivel descubierto más externo del contenido transcluido al número especificado, y todos los demás encabezados correspondientemente. Esto te permite incluir contenido que tiene sus propios títulos, pero ajustarlos para que coincidan con el nivel de título en el que los estás incluyendo. Si no especificas este valor, los títulos no se ajustan. {{unimplemented_inline}}</li>
-</ol>
-
-<h4 id="Ejemplo_sin_título">Ejemplo sin título</h4>
-
-<p>\{{Page("/es/docs/MDN/About", "Acerca de Mozilla")}}</p>
-
-<p>Resultado:</p>
-
-<p>{{Page("/es/docs/MDN/About", "Acerca de Mozilla")}}</p>
-
-<h4 id="Ejemplo_con_encabezado">Ejemplo con encabezado</h4>
-
-<p>\{{Page("/es/docs/MDN/About", "Acerca de Mozilla", 0, 1)}}</p>
-
-<p>Resultado:</p>
-
-<p>{{Page("/es/docs/MDN/About", "Acerca de Mozilla", 0, 1)}}</p>
-
-<h3 id="Creando_nuevas_insignias">Creando nuevas insignias</h3>
-
-<p>También tenemos insignias que no tienen iconos con burbujas. La plantilla genérica para esto es {{TemplateLink("SimpleBadge")}}, que acepta tres parámetros:</p>
-
-<ol>
- <li>Texto para mostrar en la insignia.</li>
- <li>Nombre de una clase CSS que se utilizará como fondo de la insignia.</li>
- <li>(Opcional) Texto para mostrar en una información sobre herramientas al pasar el cursor sobre la insignia.</li>
-</ol>
-
-<h2 id="Desaprobado">Desaprobado</h2>
-
-<p>Estas macros han sido reemplazadas por otras formas de hacer lo mismo y ya no se deberían usar. Si los encuentras en artículos existentes, reemplázalos.</p>
-
-<h3 id="Enlaces">Enlaces</h3>
-
-<ul>
- <li>La macro {{TemplateLink("anch")}} inserta un enlace a un ancla. <code class="nowiki">\{\{anch("top")\}\}</code> produce <code class="nowiki">&lt;a href="#top"&gt;top&lt;/a&gt;</code> ({{anch("top")}}). También puedes agregar un segundo parámetro que contiene texto de reemplazo para mostrar como texto del enlace. \{{anch("Otras insignias", "puedes usar otras insignias")}} produce este resultado: {{anch("Otras insignias", "puedes usar otras insignias")}}. La idea era crear una plantilla que permitiera vincular fácilmente a otras secciones de un documento. <strong>Reemplazo</strong>: usa el botón de la barra de herramientas de anclaje en la interfaz del editor. <em>Esto realmente no es un "reemplazo" y existe cierta discusión sobre si esto está realmente desaprobado en este momento</em>.</li>
- <li>La macro {{TemplateLink("SectionOnPage")}} crea una frase que enlaza tanto con el nombre de una sección como con el artículo que contiene esa sección. Por ejemplo, <code>\{{SectionOnPage("/es/docs/Mozilla/Firefox/Releases/21", "Cambios para desarrolladores web")}}</code> genera lo siguiente: <em>{{SectionOnPage("/es/docs/Mozilla/Firefox/Releases/21", "Cambios para desarrolladores web")}}</em>.</li>
- <li>La macro {{TemplateLink("manch")}} inserta un enlace a un método dentro de la interfaz actual; esto está destinado únicamente para su uso en las páginas de documentación de la interfaz. <code>\{\{manch("foo")\}\}</code> produce <code>&lt;code&gt;&lt;a href="ruta/actual#foo"&gt;foo()&lt;/a&gt;&lt;/code&gt;</code> ({{manch("foo")}}).</li>
- <li>La macro {{TemplateLink("Link")}} inserta un enlace a la página especificada en MDN, usando el título de la página como la cadena visible para hacer clic, y la información sobre herramientas extraída del resumen SEO de la página.</li>
- <li>La macro {{TemplateLink("LinkItem")}} inserta un enlace a una URL especificada, con el texto indicado como la cadena visible para hacer clic. El enlace automáticamente recoge como información sobre herramientas el resumen de la página destino. Esto difiere de {{TemplateLink("Link")}} en que debe especificar el título.</li>
- <li>La macro {{TemplateLink("LinkItemDL")}} inserta un enlace a una URL especificada, con el texto indicado como {{HTMLElement("dt")}} que también es el enlace. El elemento {{HTMLElement("dd")}} contiene el resumen de la página especificada.</li>
- <li>{{TemplateLink("funcref")}} crea enlaces a funciones globales (generalmente de C++) documentadas en páginas de nivel superior. Sin embargo, estas páginas ya no se crean en el nivel superior de MDN.</li>
- <li>{{TemplateLink("Pref")}} inserta un enlace a la entrada en {{web.link("/es/docs/Mozilla/Preferences/Preference_reference", "Referencia de preferencia")}} para la preferencia especificada.</li>
- <li>{{TemplateLink("spec")}} inserta un enlace a una especificación. <strong>Reemplazo</strong>: utiliza {{TemplateLink("spec2")}} o {{TemplateLink ("SpecName")}} en su lugar.</li>
- <li>{{TemplateLink("source")}} te permite vincular a un archivo de código fuente de Mozilla sin tener que escribir una URL MXR larga usando esta sintaxis: <code>\{\{source("browser/Makefile.in")\}\}</code>. Esto te da: {{source("browser/Makefile.in")}}. El texto del enlace es la ruta proporcionada; si deseas un texto diferente, proporciona un segundo parámetro, así: <code>\{\{source("browser/Makefile.in", "the browser/Makefile.in")\}\}</code> , que produce {{source("browser/Makefile.in", "the browser/Makefile.in")}}. Ten en cuenta que el enlace será a la última versión del archivo en código de última generación.</li>
- <li>{{TemplateLink("source_cvs")}} funciona igual que {{TemplateLink("source")}}, excepto que enlaza con {{web.link("/es/docs/Developer_Guide/Source_Code/CVS", "repositorio CVS")}} en lugar del más nuevo {{web.link("/es/docs/mozilla-central", "mozilla-central")}} uno.</li>
- <li>{{TemplateLink("LXRSearch")}} se puede utilizar para crear una URL de búsqueda LXR.</li>
-</ul>
-
-<h3 id="Ejemplos_de_código">Ejemplos de código</h3>
-
-<p>Las siguientes macros se usaron antes de la implementación del {{web.link("/es/docs/MDN/Contribute/Structures/Live_samples", "sistema de ejemplo en vivo")}} integrado en Kuma, y se deben reemplazar por usos de {{TemplateLink("EmbedLiveSample")}} o {{TemplateLink("LiveSampleLink")}}.</p>
-
-<ul>
- <li>{{TemplateLink("LiveSample")}} te permite crear un botón que se vincule a un archivo de ejemplo; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en las páginas de referencia cuando se vinculan a páginas de muestra independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
- <li>{{TemplateLink("CSSLiveSample")}} te permite crear un botón que se vincule a una muestra en la Referencia CSS; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en las páginas de referencia de CSS cuando se vinculan a páginas de ejemplo independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
- <li>{{TemplateLink("DOMLiveSample")}} te permite crear un botón que se vincule a una ejemplo en la Referencia DOM; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estas se utilizaron en las páginas de referencia DOM al vincular a páginas de ejemplos independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
- <li>{{TemplateLink("HTMLLiveSample")}} te permite crear un botón que enlace a una ejemplo en la Referencia HTML; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en páginas de referencia HTML al vincular a páginas de ejemplos independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
- <li>{{TemplateLink("SVGLiveSample")}} te permite crear un botón que se vincule a un ejemplo en la Referencia DOM; estos ejemplos se enviaron a <a class="link-mailto" href="mailto:eshepherd@mozilla.com" title="mailto:eshepherd@mozilla.com">Eric Shepherd</a> para su carga. Estos se utilizaron en las páginas de referencia SVG al vincular a páginas de ejemplos independientes y en vivo. La plantilla acepta un parámetro, el nombre del archivo HTML al que enlazar.</li>
- <li>{{TemplateLink("JSFiddleLink")}} te permite crear fácilmente un botón que enlace a un ejemplo en el <a class="external" href="http://jsfiddle.net" title="http://jsfiddle.net/">sitio web jsFiddle</a>. Estos <strong>NO</strong> se deben usar para reemplazar los ejemplos en línea o los ejemplos cargados por MDC, sino para ofrecer acceso a ejemplos secundarios con los que los lectores pueden experimentar. La plantilla acepta un parámetro, la etiqueta de identificación del elemento jsFiddle a vincular.</li>
-</ul>
-
-<h3 id="Organizacional">Organizacional</h3>
-
-<ul>
- <li>{{TemplateLink("LockedPage")}} inserta una barra de marcas en la página que proporciona una explicación de por qué una página está bloqueada. Esta macro está obsoleta porque Kuma no admite el bloqueo de páginas.</li>
- <li>{{TemplateLInk("jsapi_ref_header")}} se utilizó para crear rutas de navegación para la JSAPI referenciada; esto ahora lo hace Kuma, no una macro.</li>
-</ul>
-
-<h3 id="Formateo">Formateo</h3>
-
-<ul>
- <li>{{TemplateLink("Note")}} inserta un bloque de "nota" con un formato especial en el texto del artículo. Esto tiene la intención de resaltar un hecho interesante o importante. <strong>Reemplazo</strong>: Usa el estilo <code>Note box</code> en la barra de herramientas del Editor.</li>
- <li>{{TemplateLink("warning")}} inserta un bloque de "advertencia" con un formato especial. {{TemplateLink("WarningStart")}} y {{TemplateLink("WarningEnd")}} definen el inicio y el final del bloque de advertencia que debe contener otras llamadas de macro. <strong>Reemplazo</strong>: Usa el estilo <code>Warning box</code> en la barra de herramientas del Editor.</li>
-</ul>
-
-<h3 id="Indicadores_de_versión">Indicadores de versión</h3>
-
-<p>Las siguientes macros están en desuso porque esta información debería estar contenida en el artículo de la tabla de compatibilidad de navegadores.</p>
-
-<ul>
- <li>{{TemplateLink("gecko_minversion_header")}} indica la versión mínima de Gecko para una función.</li>
- <li>{{TemplateLink("Gecko")}} inserta el texto "Gecko <em>número de versión</em>" en el texto, pero agrega una información sobre herramientas que, cuando el usuario pasa el mouse sobre él, muestra las versiones correspondientes de Firefox, Thunderbird y SeaMonkey.</li>
- <li>{{TemplateLink("fx_minversion_header")}} y {{TemplateLink("fx_minversion_section")}} indican la versión mínima de Firefox para una función.</li>
- <li>{{TemplateLink("tb_minversion_header")}}, {{TemplateLink("tb_minversion_section")}} y {{TemplateLink("tb_minversion_inline")}} indican la versión mínima de Thunderbird para una función.</li>
- <li>{{TemplateLink("js_minversion_header")}} y {{TemplateLink("js_minversion_inline")}} indican la versión mínima de JavaScript para una función.</li>
- <li>{{TemplateLink("MobileOnlyHeader")}} inserta un cuadro de encabezado "Disponible solo para Firefox móvil". {{TemplateLink("MobileOnlyInline")}} inserta un indicador en línea. Estos indican la versión de Gecko a partir de la cual la interfaz solo está disponible para dispositivos móviles.</li>
- <li>{{TemplateLink("dom_level")}} indica la versión mínima del DOM para una función.</li>
- <li>{{TemplateLink("renamed_inline")}} inserta una marca "renombrada" en línea para indicar que se ha cambiado el nombre de una API.</li>
- <li>{{TemplateLink("unimplemented_inline")}} inserta una marca en línea de "no implementado" para evitar el uso de, por ejemplo, una función, método o propiedad que aún no está implementada. <strong>Reemplazo</strong>: Utiliza la tabla de compatibilidad de navegadores para indicar esta información.</li>
- <li>{{TemplateLink("unimplemented_inline_webkit")}} inserta una marca de "no implementado" en línea para evitar el uso de, por ejemplo, una función, método o propiedad que aún no está implementada. <strong>Reemplazo</strong>: Utiliza la tabla de compatibilidad de navegadores para indicar esta información.</li>
- <li>{{TemplateLink("gecko_callout_heading")}} incluye un cuadro de llamada específico de la versión de Gecko.</li>
- <li>{{TemplateLink("fx_minversion_note")}} crea una nota sobre una versión mínima de Firefox; {{TemplateLink("GeckoMinVersionNoteStart")}} y {{TemplateLink("GeckoMinVersionNoteEnd")}} se pueden usar para envolver texto dentro de un cuadro etiquetado como perteneciente a una versión dada de Gecko y posteriores; especifica la versión como el único parámetro "<code>start</code>" de la macro.</li>
- <li>{{TemplateLink("tb_minversion_note")}} crea una nota sobre una versión mínima de Thunderbird.</li>
- <li>{{TemplateLink("js_minversion_note")}} crea una nota sobre una versión mínima de JavaScript.</li>
- <li>
-  <p>{{TemplateLink("h1_gecko_minversion")}}, {{TemplateLink("h2_gecko_minversion")}} y {{TemplateLink("h3_gecko_minversion")}} te permiten insertar encabezados (h1, h2 y h3) que se incluyen a la derecha al final de la línea, una insignia que indica la versión de Gecko (y las versiones correspondientes de la aplicación) a la que se aplica la sección.</p>
- </li>
-</ul>
diff --git a/files/es/mdn/structures/tablas_de_compatibilidad/index.html b/files/es/mdn/structures/tablas_de_compatibilidad/index.html
deleted file mode 100644
index cd9a5097d2..0000000000
--- a/files/es/mdn/structures/tablas_de_compatibilidad/index.html
+++ /dev/null
@@ -1,476 +0,0 @@
----
-title: >-
-  Tablas de compatibilidad y repositorio de datos de compatibilidad del
-  navegador (DCN)
-slug: MDN/Structures/Tablas_de_compatibilidad
-tags:
-  - Estructuras
-  - Guía
-  - Meta MDN
-  - compatibilidad con el navegador
-  - tablas de compatibilidad
-translation_of: MDN/Structures/Compatibility_tables
----
-<div>{{MDNSidebar}}</div>
-
-<p class="summary"><span class="seoSummary">MDN tiene un formato estándar para tablas de compatibilidad para nuestra documentación web abierta; es decir, documentación de tecnologías como DOM, HTML, CSS, JavaScript, SVG, etc., que se comparte en todos los navegadores.</span> Este artículo es una guía de "introducción" sobre cómo agregar y mantener la base de datos a partir de la cual se generan las tablas de compatibilidad, además de cómo integrar las tablas en artículos.</p>
-
-<p class="summary">Para obtener documentación más avanzada, así como los últimos cambios en los procesos y los esquemas JSON utilizados para representar los datos, échale un vistazo al repositorio de datos de la <a href="https://github.com/mdn/browser-compat-data/blob/master/docs/contributing.md">guía para colaboradores</a>, así como a la <a href="https://github.com/mdn/browser-compat-data/blob/master/docs/data-guidelines.md">guía de directrices de datos</a>.</p>
-
-<p class="summary">Si tienes preguntas o descubres problemas, compártelos con nosotros en el <a href="https://discourse.mozilla-community.org/c/mdn">foro de discusión de MDN</a>.</p>
-
-<h2 id="Cómo_acceder_al_repositorio_de_datos">Cómo acceder al repositorio de datos</h2>
-
-<p>Los datos se almacenan en un repositorio de GitHub; consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>. Para acceder a él, necesitas tener una cuenta de GitHub, bifurcar el repositorio de compatibilidad de datos del navegador en tu propia cuenta y luego clonar tu bifurcación en tu máquina local.</p>
-
-<h2 id="Preparándose_para_agregar_los_datos">Preparándose para agregar los datos</h2>
-
-<p>Antes de agregar algunos datos nuevos, te debes asegurar de que tu bifurcación esté actualizada con el repositorio principal (contiene el mismo contenido), crea una nueva rama dentro de tu bifurcación para contener tus adiciones, luego ingresa esa rama en tu clon local para que puedas empezar a trabajar dentro de ella:</p>
-
-<p>Veamos la siguiente sencilla forma de asegurarte de que tu bifurcación esté actualizada:</p>
-
-<h3 id="Agregar_el_repositorio_principal_de_datos_de_compatibilidad_del_navegador_como_remoto">Agregar el repositorio principal de datos de compatibilidad del navegador como remoto</h3>
-
-<p>Ve al clon local de tu bifurcación en tu terminal/línea de comandos, y agrega un control remoto que apunte al repositorio principal (<code>upstream</code>) de esa manera (solo necesitas hacer esto una vez):</p>
-
-<pre class="brush: bash notranslate">git remote add upstream https://github.com/mdn/browser-compat-data.git</pre>
-
-<p>Si no estás seguro de haber hecho esto, puedes verificar qué controles remotos tiene tu repositorio usando</p>
-
-<pre class="brush: bash notranslate">git remote -v</pre>
-
-<h3 id="Actualiza_tu_bifurcación_con_el_contenido_del_remoto">Actualiza tu bifurcación con el contenido del remoto</h3>
-
-<p>Ahora, siempre que desees actualizar tu bifurcación, lo puedes hacer mediante:</p>
-
-<ol>
- <li>
-  <p>Asegúrate de que estas en la rama <code>master</code>:</p>
-
-  <pre class="brush: bash notranslate">git checkout master</pre>
- </li>
- <li>
-  <p>obtén el contenido actualizado del repositorio utilizando lo siguiente:</p>
-
-  <pre class="brush: bash notranslate">git fetch upstream</pre>
- </li>
- <li>
-  <p>rebasa el contenido de tu <code>master</code> con el contenido del repositorio principal:</p>
-
-  <pre class="brush: bash notranslate">git rebase upstream/master</pre>
- </li>
- <li>
-  <p>empuja estas actualizaciones a tu bifurcación remota usando lo siguiente:</p>
-
-  <pre class="brush: bash notranslate">git push</pre>
- </li>
-</ol>
-
-<h3 id="Crea_una_nueva_rama_para_hacer_tu_trabajo">Crea una nueva rama para hacer tu trabajo</h3>
-
-<p>A continuación, ve a tu bifurcación remota (estará en <code>https://github.com/<em>tu-nombre-de-usuario</em>/browser-compat-data</code>) y crea una nueva rama para almacenar tus cambios para esta adición de datos. Esto lo puedes hacer mediante:</p>
-
-<ol>
- <li>Un clic en el botón "Rama: Master".</li>
- <li>Ingresa un nuevo nombre para la rama en el campo de texto "Buscar o crear una rama...".</li>
- <li>Presiona el botón resultante "Crear rama <em>nombre-de-rama</em> desde Master".</li>
-</ol>
-
-<p>Por ejemplo, si quisieras agregar datos para la API WebVR, crearías una rama llamada algo así como "webvr".</p>
-
-<h3 id="Cambia_a_la_nueva_rama">Cambia a la nueva rama</h3>
-
-<p>En este punto, regresa a tu terminal/línea de comando y actualiza el clon local de tu bifurcación para incluir tu nueva rama usando el siguiente comando:</p>
-
-<pre class="brush: bash notranslate">git pull</pre>
-
-<p>Ahora cambia a tu nueva rama usando esto:</p>
-
-<pre class="brush: bash notranslate">git checkout <em>nombre-de-rama</em></pre>
-
-<p>¡Ahora debería estar listo para comenzar a agregar tus datos!</p>
-
-<h2 id="Añadir_los_datos">Añadir los datos</h2>
-
-<p>Para agregar los datos, debes crear un nuevo archivo o archivos para almacenar tus datos de compatibilidad. Los archivos que necesitas crear difieren, según la tecnología en la que estés trabajando:</p>
-
-<ul>
- <li><strong><a href="/es/docs/Web/HTML">HTML</a>:</strong> Un archivo por elemento HTML, contenido en <a href="https://github.com/mdn/browser-compat-data/tree/master/html/elements">browser-compat-data/html/elements</a>. El archivo se debe denominar con el nombre del elemento, todo en minúsculas, p. ej. <code>div.json</code>.</li>
- <li><strong><a href="/es/docs/Web/CSS">CSS</a>:</strong>Un archivo por propiedad CSS o selector, contenido en el directorio apropiado (consulta <a href="https://github.com/mdn/browser-compat-data/tree/master/css">browser-compat-data/css</a>). El archivo debe tener el nombre de la función, todo en minúsculas, p. ej. <code>background-color.json</code> o <code>hover.json</code>.</li>
- <li><strong><a href="/es/docs/Web/JavaScript">JS</a>:</strong> Un archivo por objeto JS, contenido en <a href="https://github.com/mdn/browser-compat-data/tree/master/javascript/builtins">browser-compat-data/javascript/builtins</a>. El archivo se debe denominar con el nombre exacto del objeto, conservando la envoltura, p. ej. <code>Date.json</code> o <code>InternalError.json</code>.</li>
- <li><strong><a href="/es/docs/Web/API">APIs</a>:</strong> Un archivo por interfaz contenida en la API, ponlo en <a href="https://github.com/mdn/browser-compat-data/tree/master/api">browser-compat-data/api</a>. Cada archivo se debe denominar con el nombre exacto de la interfaz, conservando la envoltura, p. ej. La API de WebVR tiene <code>VRDisplay.json</code>, <code>VRDisplayCapabilities.json</code>, etc.</li>
-</ul>
-
-<p>Cada archivo que crees debe seguir el patrón definido en el esquema contenido en nuestro repositorio; puedes ver la <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md">descripción detallada del esquema aquí</a>.</p>
-
-<h3 id="Estructura_básica_de_datos_de_compatibilidad">Estructura básica de datos de compatibilidad</h3>
-
-<p>Veamos un ejemplo. Los archivos JSON de propiedades CSS, por ejemplo, necesitan la siguiente estructura básica:</p>
-
-<pre class="brush: json notranslate">{
-  "css": {
-    "properties": {
-      "border-width": {
-        "__compat": {
-          ...
-        }
-      }
-    }
-  }
-}</pre>
-
-<p>Tienes el objeto <code>css</code>, dentro del cual hay un objeto <code>properties</code>. Dentro del objeto <code>properties</code>, necesitas un miembro para cada una de las características específicas para las que deseas definir los datos de compatibilidad. Cada uno de estos miembros tiene un miembro <code>__compat</code>, dentro del cual van los datos reales.</p>
-
-<p>Los datos anteriores se encuentran en el archivo: <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/border-width.json">border-width.json</a> compáralo con la <a href="/es/docs/Web/CSS/border-width#Browser_compatibility">tabla de soporte de <code>border-width</code> representada en MDN</a>.</p>
-
-<p>Otros tipos de características funcionan de la misma manera, pero con diferentes nombres de objeto:</p>
-
-<ul>
- <li>Los selectores de CSS funcionan básicamente de la misma manera que las propiedades de CSS, excepto que la estructura del objeto de nivel superior es <code>css.selectors</code> en lugar de <code>css.properties</code>. Consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/css/selectors/cue.json">cue.json</a> para ver un ejemplo.</li>
- <li>Los datos HTML funcionan básicamente de la misma manera, excepto que la estructura del objeto de nivel superior es <code>html.elements</code>. Consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/html/elements/article.json">article.json</a> para ver un ejemplo.</li>
- <li>La estructura del objeto de nivel superior para los objetos incorporados de JS es <code>javascript.builtins</code>; consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/builtins/Array.json">Array.json</a> para ver un ejemplo.</li>
-</ul>
-
-<div>
-<p>En páginas HTML, CSS y JS, normalmente solo necesitarás una función. Las interfaces de API funcionan de forma ligeramente diferente — siempre tienen varias subcaracterísticas (consulta {{anch("Sub-features", "Subcaracterísticas")}}, a continuación).</p>
-
-<h3 id="Estructura_básica_dentro_de_una_característica">Estructura básica dentro de una característica</h3>
-
-<p>Dentro de un miembro de función <code>__compat</code>, debes incluir los siguientes miembros:</p>
-
-<ul>
- <li><code>mdn_url</code>: contiene la URL de la página de referencia para esta característica en MDN. Ten en cuenta que esto se debe escribir sin el directorio de configuración regional dentro, p. ej. <code>/docs/...</code> no <code>/en-US/docs/...</code>. Esto lo agrega la macro cuando los datos se colocan en la página, con fines de localización.</li>
- <li><code>support</code>: contiene miembros que representan la información de soporte del navegador para esta característica en todos los diferentes navegadores que queremos informar.</li>
- <li><code>status</code>: contiene miembros que informan sobre el estado de seguimiento de estándares de esta característica.</li>
-</ul>
-
-<p>Los nombres de los miembros del navegador se definen en el esquema (consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/schemas/compat-data-schema.md#browser-identifiers">identificadores del navegador</a>). Debes utilizar la lista completa de identificadores definidos actualmente. Si deseas agregar otro navegador, habla con nosotros primero, ya que esto podría tener un impacto de gran alcance y no se debe hacer sin pensarlo detenidamente.</p>
-
-<p>En un archivo de datos de compatibilidad del navegador básico, solo necesitarás incluir "<code>version_added</code>" dentro de los miembros del identificador del navegador (cubriremos {{anch("Advanced cases", "Casos avanzados")}} más adelante). Los diferentes valores que posiblemente quieras incluir son los siguientes:</p>
-
-<ul>
- <li>Un número de versión: Si conoces la versión exacta en la que un navegador comenzó a admitir tu característica, usa una cadena que represente el número, p. ej. <code>"47"</code>.</li>
- <li><code>true</code>: Si un navegador admite una característica, pero no conoces el número de versión exacto, utiliza el valor <code>true</code>.</li>
- <li><code>false</code>: Si un navegador no admite una característica, utiliza el valor <code>false</code>.</li>
- <li><code>null</code>: Si no sabes si un navegador admite una característica o no, utiliza el valor <code>null</code>.</li>
-</ul>
-
-<p>Dentro del miembro <code>status</code>, incluirás tres submiembros:</p>
-
-<ul>
- <li><code>experimental</code>: Se debe establecer en <code>true</code> si la característica es <a href="/es/docs/MDN/Contribute/Guidelines/Conventions_definitions#Experimental">experimental</a> o <code>false</code> en caso contrario.</li>
- <li><code>standard_track</code>: Esto se debe establecer en <code>true</code> si una característica está en algún tipo de pista de estándares (comúnmente W3C/WHATWG, pero también hay otros esfuerzos de estándares como Khronos, TC39, etc.) o <code>false</code> de lo contrario.</li>
- <li><code>deprecated</code>: Se debe establecer en <code>true</code> si la característica está <a href="/es/docs/MDN/Contribute/Guidelines/Conventions_definitions#Deprecated_and_obsolete">desaprobada</a> o <code>false</code> en caso contrario.</li>
-</ul>
-
-<p>Los datos de características de <a href="/es/docs/Web/CSS/border-width#Browser_compatibility"><code>border-width</code></a> (consulta también <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/border-width.json">border-width.json</a>) se muestra a continuación como ejemplo:</p>
-
-<pre class="brush: json notranslate">"__compat": {
-  "mdn_url": "https://developer.mozilla.org/docs/Web/CSS/border-width",
-  "support": {
-    "chrome": {
-      "version_added": "1"
-    },
-    "webview_android": {
-      "version_added": "2"
-    },
-    "edge": {
-      "version_added": true
-    },
-    "edge_mobile": {
-      "version_added": true
-    },
-    "firefox": {
-      "version_added": "1"
-    },
-    "firefox_android": {
-      "version_added": "1"
-    },
-    "ie": {
-      "version_added": "4"
-    },
-    "ie_mobile": {
-      "version_added": "6"
-    },
-    "opera": {
-      "version_added": "3.5"
-    },
-    "opera_android": {
-      "version_added": "11"
-    },
-    "safari": {
-      "version_added": "1"
-    },
-    "safari_ios": {
-      "version_added": "3"
-    }
-  },
-  "status": {
-    "experimental": false,
-    "standard_track": true,
-    "deprecated": false
-  }
-}</pre>
-
-<h4 id="Agrega_una_descripción">Agrega una descripción</h4>
-
-<p>Hay un cuarto miembro, opcional, que puede ir dentro del miembro <code>__compat</code> — <code>description</code>. Este se puede utilizar para incluir una descripción legible por humanos de la característica. Únicamente lo debes incluir si es difícil ver cuál es la característica al mirar los datos. Por ejemplo, puede que no sea tan obvio lo que es un constructor al mirar la estructura de datos, por lo que puedes incluir una descripción como esta:</p>
-
-<pre class="brush: json notranslate">{
-  "api": {
-    "AbortController": {
-      "__compat": {
-        ...
-      },
-      "AbortController": {
-        "__compat": {
-          "mdn_url": "https://developer.mozilla.org/docs/Web/API/AbortController/AbortController",
-          "description": "&lt;code&gt;AbortController()&lt;/code&gt; constructor",
-          "support": {
-            ...
-          }
-        }
-      }
-
-      ... etc.
-    }
-  }
-}</pre>
-
-<h3 id="Subcaracterísticas">Subcaracterísticas</h3>
-
-<p>En una página donde la tabla de compatibilidad tiene más de una fila, necesitarás varias subcaracterísticas dentro de cada característica para definir la información de cada fila. Esto puede suceder, por ejemplo, cuando tienes el soporte básico para una característica almacenada en una fila, pero luego la característica también tiene una nueva propiedad o tipo de valor que se agregó mucho más tarde en la vida de la especificación y solo se admite en una par de navegadores.</p>
-
-<p>Como ejemplo, consulta los <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/background-color.json">datos de compatibilidad</a> y la <a href="/es/docs/Web/CSS/background-color">página MDN correspondiente</a> para la propiedad <code>background-color</code>. El soporte básico existe dentro del objeto <code>__compat</code> como se explicó anteriormente, luego tienes una fila adicional para el soporte de los navegadores para "canal alfa para valores hexadecimales", que contiene tu propio objeto <code>__compat</code>.</p>
-
-<pre class="brush: json notranslate">{
-  "css": {
-    "properties": {
-      "background-color": {
-        "__compat": {
-          ...
-        },
-        "alpha_ch_for_hex": {
-          "__compat": {
-            ...
-          },
-        }
-      }
-    }
-  }
-}</pre>
-
-<p>Para una API, tienes los dos niveles superiores definidos como <code>api.<em>nombre-de-la-interfaz</em></code>, luego un <code>__compat</code> de nivel superior para definir la compatibilidad general del navegador de la interfaz, luego una subfunción para cada uno de los métodos, propiedades y constructores contenidos dentro de la interfaz. La estructura básica se ve así:</p>
-
-<pre class="brush: json notranslate">{
-  "api": {
-    "VRDisplay": {
-      "__compat": {
-        ...
-      },
-      "cancelAnimationFrame": {
-        "__compat": {
-          ...
-        }
-      },
-      "capabilities": {
-        "__compat": {
-          ...
-        }
-      },
-
-      ... etc.
-
-    }
-  }
-}</pre>
-
-<p>Consulta <a href="https://github.com/mdn/browser-compat-data/blob/master/api/VRDisplay.json">VRDisplay.json</a> para ver un ejemplo completo.</p>
-</div>
-
-<h2 id="Agregar_datos_casos_avanzados">Agregar datos: casos avanzados</h2>
-
-<p>Hay algunas características avanzadas que querrás incluir en los datos de compatibilidad del navegador. El objetivo de esta sección es enumerar los más comunes, proporcionando un ejemplo de cada uno para mostrar cómo los puedes implementar en tus propios datos de compatibilidad.</p>
-
-<h3 id="Incluyendo_una_nota_a_pie_de_página">Incluyendo una nota a pie de página</h3>
-
-<p>A menudo, las tablas de compatibilidad incluirán notas a pie de página relacionadas con ciertas entradas que explican detalles útiles o comportamientos extraños que los desarrolladores encontrarán útiles. Como ejemplo, la entrada de Chrome para Android para {{domxref("VRDisplay.capabilities")}} (consulta también <a href="https://github.com/mdn/browser-compat-data/blob/master/api/VRDisplay.json">VRDisplay.json</a>) (en el momento de escribir este artículo) tenía una nota al pie de página "Actualmente solo es compatible con Google Daydream". Para incluir esto en los datos de capacidades, agregamos un submiembro "<code>notes</code>" dentro del submiembro "chrome_android" relevante; se vería así:</p>
-
-<pre class="brush: json notranslate">"chrome_android": {
-  "version_added": true,
-  "notes": "Currently supported only by Google Daydream."
-}</pre>
-
-<h3 id="Incluyendo_un_prefijo_de_proveedor">Incluyendo un prefijo de proveedor</h3>
-
-<p>Si una característica es compatible con un prefijo de proveedor en uno o más navegadores, querrás dejarlo en claro en los datos de compatibilidad del navegador. imagina que tienes una característica que es compatible con un prefijo <code>-moz-</code> en Firefox. Para especificar esto en los datos de compatibilidad, debes agregar un submiembro "<code>prefix</code>" dentro del submiembro "firefox" relevante. Y se vería así:</p>
-
-<pre class="brush: json notranslate">"firefox": {
-  "version_added": true,
-  "prefix": "-moz-"
-}</pre>
-
-<h3 id="Incluyendo_preferencias_o_banderas_del_navegador">Incluyendo preferencias o banderas del navegador</h3>
-
-<p>Algunas características pueden ser compatibles con un navegador, pero son experimentales y están desactivadas de forma predeterminada. Si un usuario quiere jugar con esta característica, debe activarla usando una preferencia/bandera.</p>
-
-<p>Para representar esto en los datos de compatibilidad, debes agregar el submiembro "<code>flags</code>" dentro del submiembro del identificador del navegador relevante. El valor de "<code>flags</code>" es un arreglo de objetos, cada uno de los cuales contiene tres miembros:</p>
-
-<ul>
- <li><code>type</code>: Qué tipo de bandera o preferencia es. El valor más común es "<code>preference</code>", que se establece dentro del navegador (por ejemplo, usando <code>about: config</code> en Firefox, o <code>chrome://flags</code> en Chrome), pero a veces también puedes usar un valor de "<code>compile_flag</code>", que es un conjunto de preferencias cuando se construye la compilación del navegador.</li>
- <li><code>name</code>: Esta es una cadena que representa el nombre de la preferencia que necesita tener un valor establecido. Por ejemplo, "Habilitar funciones experimentales de la plataforma web" es una preferencia que existe en Chrome, que se encuentra en <code>chrome://flags</code>.</li>
- <li><code>value_to_set</code>: Esta es una cadena que representa el valor que se debe establecer en la preferencia, por ejemplo, "<code>true</code>".</li>
-</ul>
-
-<p>Entonces, para agregar una preferencia/bandera al soporte de Chrome para una característica, harías algo como esto:</p>
-
-<pre class="brush: json notranslate">"chrome": {
-  "version_added": "50",
-  "flags": [
-    {
-      "type": "preference",
-      "name": "Enable Experimental Web Platform Features",
-      "value_to_set": "true"
-    }
-  ]
-},</pre>
-
-<p>Si una característica está detrás de dos o más banderas, puedes agregar objetos adicionales al arreglo "<code>flags</code>", como en este caso, por ejemplo:</p>
-
-<pre class="brush: json notranslate">"firefox": {
-  "version_added": "57",
-  "flags": [
-    {
-      "type": "preference",
-      "name": "dom.streams.enabled",
-      "value_to_set": "true"
-    },
-    {
-      "type": "preference",
-      "name": "javascript.options.streams",
-      "value_to_set": "true"
-    }
-  ]
-},</pre>
-
-<h3 id="Incluyendo_una_versión_donde_se_eliminó_el_soporte">Incluyendo una versión donde se eliminó el soporte</h3>
-
-<p>A veces, una característica se agregará en una determinada versión del navegador, pero luego se eliminará nuevamente cuando la característica esté obsoleta. Esto se puede representar fácilmente usando el submiembro "<code>version_removed</code>", que toma como valor una cadena que representa el número de versión en el que se eliminó. Por ejemplo:</p>
-
-<pre class="brush: json notranslate">"firefox": {
-  "version_added": "35",
-  "version_removed": "47",
-},</pre>
-
-<h3 id="Incluyendo_múltiples_puntos_de_soporte_para_la_misma_entrada_del_navegador">Incluyendo múltiples puntos de soporte para la misma entrada del navegador</h3>
-
-<p>A veces, querrás agregar varios puntos de datos de soporte para el mismo navegador dentro de la misma característica.</p>
-
-<p>Como ejemplo, la propiedad {{cssxref("text-align-last")}} (ve también <a href="https://github.com/mdn/browser-compat-data/blob/master/css/properties/text-align-last.json">text-align-last.json</a>) se agregó a Chrome en la versión 35, compatible con una pref.</p>
-
-<p>El soporte mencionado anteriormente se eliminó en la versión 47; también en la versión 47, se agregó soporte para <code>text-align-last</code> habilitado de manera predeterminada.</p>
-
-<p>Para incluir estos dos puntos de datos, puedes hacer que el valor del submiembro "<code>chrome</code>" sea un arreglo que contenga dos objetos de información de soporte, en lugar de un solo objeto de información de soporte:</p>
-
-<pre class="brush: json notranslate">"chrome": [
-  {
-    "version_added": "47"
-  },
-  {
-    "version_added": "35",
-    "version_removed": "47",
-    "flags": [
-      {
-        "type": "preference",
-        "name": "Enable Experimental Web Platform Features",
-        "value_to_set": "true"
-      }
-    ]
-  }
-],</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong> Debes colocar el punto de soporte más actual o importante primero en el arreglo — esto hace que los datos sean más fáciles de leer para las personas que solo desean escanearlos para obtener la información más reciente.</p>
-</div>
-
-<h3 id="Incluyendo_un_nombre_alternativo">Incluyendo un nombre alternativo</h3>
-
-<p>Ocasionalmente, los navegadores admitirán una característica con un nombre diferente al definido en su especificación. Esto se podría deber, por ejemplo, a que un navegador agregó soporte experimental para una característica antes, y luego el nombre cambió antes de que se estabilizara la especificación.</p>
-
-<p>Para incluir un caso de este tipo en los datos de compatibilidad del navegador, puedes incluir un punto de información de soporte que especifique el nombre alternativo dentro de un miembro "<code>alternative_name</code>".</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong> Es posible que el nombre alternativo no sea un alias exacto — posiblemente tenga un comportamiento diferente al de la versión estándar.</p>
-</div>
-
-<p>Veamos un ejemplo. La propiedad {{cssxref("border-top-right-radius")}} (consulta también <a href="https://github.com/mdn/browser-compat-data/blob/2a0cc3f6bb17aa4345441bed47a059dffd847793/css/properties/border-top-right-radius.json">border-top-right-radius.json</a>) era compatible con Firefox:</p>
-
-<ul>
- <li>Desde la versión 4 en adelante con el nombre estándar <code>border-top-right-radius</code>.</li>
- <li>A partir de la versión 49 con un prefijo <code>-webkit-</code>, por motivos de compatibilidad con el navegador.</li>
- <li>Desde la versión 1 en adelante con el nombre alternativo <code>-moz-border-radius-topright</code>. La compatibilidad con este alias se eliminó en la versión 12.</li>
-</ul>
-
-<p>Para representar esto en los datos, usamos el siguiente JSON:</p>
-
-<pre class="brush: json notranslate">"firefox": [
-  {
-    "version_added": "4",
-    "notes": "Antes de Firefox 50.0, los estilos de borde de las esquinas redondeadas siempre se representaban como si <code>border-style</code> fuera sólido. Esto se ha solucionado en Firefox 50.0."
-  },
-  {
-    "prefix": "-webkit-",
-    "version_added": "49",
-    "notes": "De Firefox 44 a 48, el prefijo <code>-webkit-</code> estaba disponible con la preferencia <code>layout.css.prefixes.webkit</code>. A partir de Firefox 49, la preferencia predeterminada es &lt;code&gt;true&lt;/code&gt;."
-  },
-  {
-    "alternative_name": "-moz-border-radius-topright",
-    "version_added": "1",
-    "version_removed": "12"
-  }
-],</pre>
-
-<h2 id="Empujar_un_cambio_de_nuevo_al_repositorio_principal">Empujar un cambio de nuevo al repositorio principal</h2>
-
-<p>Una vez que hayas terminado de agregar tus datos de compatibilidad, primero debes probarlos usando los siguientes comandos:</p>
-
-<ul>
- <li><code>npm run lint</code> — prueba todos los datos de compatibilidad para asegurarse de que el JSON sea válido y esté escrito en el estilo correcto, por ejemplo, sangría correcta, sin comas, etc. Imprimirá una larga lista de nombres de archivos y resultados de pruebas; si se encuentra un error, el linter arrojará un error en el archivo en el que se encuentra, brindándote útil información de depuración como número de línea, mensaje de error, etc.</li>
- <li><code>npm run show-errors</code> — valida el JSON con el esquema de datos y resalta errores como el uso de números de versión de navegador no válidos.</li>
-</ul>
-
-<p>Si se ve bien, debes confirmarlo y volver a colocarlo en tu bifurcación remota en GitHub. Lo puedes hacer fácilmente en tu terminal con comandos como estos:</p>
-
-<pre class="brush: bash notranslate">git add .
-git commit -m 'adding compat data for <em>nombre-de-la-característica</em>'
-git push</pre>
-
-<p>Ahora ve a tu bifurcación remota (es decir, <code>https://github.com/<em>tu-nombre-de-usuario</em>/browser-compat-data</code>) y deberías ver información sobre tu inserción en la parte superior de la lista de archivos (debajo de "Tus ramas enviadas recientemente"). Puedes crear una solicitud de extracción (iniciando el proceso de enviarla al repositorio principal) presionando el botón "Comparar y solicitud de extracción" y luego siguiendo las sencillas instrucciones en la siguiente pantalla.</p>
-
-<p>En este punto, solo tienes que esperar. Un revisor examinará tu solicitud de extracción y la fusionará con el repositorio principal, O solicitará que realices cambios. Si se necesitan cambios, realiza los cambios y envíalos nuevamente hasta que se acepte la SE.</p>
-
-<h2 id="Insertar_los_datos_en_páginas_MDN">Insertar los datos en páginas MDN</h2>
-
-<p>Una vez que tus nuevos datos se hayan incluido en el repositorio principal, puedes comenzar a generar dinámicamente tablas de compatibilidad del navegador basadas en esos datos en las páginas MDN usando la macro {{TemplateLink("Compat")}}. Esta toma un solo parámetro, la notación de puntos requerida para recorrer los datos JSON y encontrar el objeto que representa la característica para la que deseas generar la tabla de compatibilidad.</p>
-
-<p>Por encima de la llamada a la macro, para ayudar a otros colaboradores a encontrar su camino, debes agregar un texto oculto que solo sea visible a los colaboradores de MDN en el modo de edición:</p>
-
-<pre class="brush: html notranslate">&lt;div class="hidden"&gt;
-La tabla de compatibilidad de esta página se genera a partir de datos estructurados.
-Si deseas contribuir con los datos, consulta
-&lt;a href="https://github.com/mdn/browser-compat-data"&gt;https://github.com/mdn/browser-compat-data&lt;/a&gt;
-y envíanos una solicitud de extracción.
-&lt;/div&gt;</pre>
-
-<p>Por ejemplo, en la página de encabezado HTTP {{HTTPHeader("Accept-Charset")}}, la llamada a la macro se ve así: <code>\{{Compat("http.headers.Accept-Charset")}}</code>. Si observas el <a href="https://github.com/mdn/browser-compat-data/blob/master/http/headers/accept-charset.json">accept-charset.json</a> en el repositorio, verás cómo esto se refleja en los datos JSON.</p>
-
-<p>Otro ejemplo, la tabla de compatibilidad para la propiedad {{domxref("VRDisplay.capabilities")}} se genera usando <code>\{{Compat("api.VRDisplay.capabilities")}}</code>. La llamada a la macro genera la siguiente tabla (y el correspondiente conjunto de notas):</p>
-
-<hr>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("api.VRDisplay.capabilities")}}</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong> Los nombres de archivo a menudo coinciden con las etiquetas dadas a las interfaces dentro de las estructuras JSON, pero no siempre es así. Cuando las llamadas a macro generan las tablas, recorren todos los archivos hasta encontrar el JSON relevante para usar, por lo que los nombres de archivo no son críticos. Dicho esto, siempre debes nombrarlos de la manera más intuitiva posible.</p>
-</div>
diff --git a/files/es/mdn/tools/introduction_to_kumascript/index.html b/files/es/mdn/tools/introduction_to_kumascript/index.html
deleted file mode 100644
index ed060eecd8..0000000000
--- a/files/es/mdn/tools/introduction_to_kumascript/index.html
+++ /dev/null
@@ -1,683 +0,0 @@
----
-title: Introducción a KumaScript
-slug: MDN/Tools/Introduction_to_KumaScript
-translation_of: MDN/Tools/KumaScript
----
-<div>{{MDNSidebar}}</div>
-
-<div>{{draft}}</div>
-
-<h2 id="Vistazo_general">Vistazo general</h2>
-
-<p>En el verano de 2012, MDN  cambió a una nueva plataforma wiki llamada <a class="link-https" href="https://wiki.mozilla.org/MDN/Kuma" title="https://wiki.mozilla.org/MDN/Kuma">Kuma</a>. Esta reemplaza el lenguaje de plantilla <a class="external" href="http://developer.mindtouch.com/en/docs/DekiScript" title="http://developer.mindtouch.com/en/docs/DekiScript">DekiScript</a> con un nuevo sistema llamado <a class="link-https" href="https://github.com/mozilla/kumascript" title="https://github.com/mozilla/kumascript">KumaScript</a>. KumaScript se alimenta de JavaScript del lado del servidor, usando <a class="external" href="http://nodejs.org/" title="http://nodejs.org/">Node.js</a>. Este artículo provee informaciónde cómo usar KumaScript y cómo actualizar scripts migrados parcialmente desde MindTouch.</p>
-
-<p>Para detalles y preguntas frecuentes sobre KumaScript, mira el <a href="https://vreplay.mozilla.com/replay/showRecordDetails.html?sortBy=date&amp;viewCount=1&amp;currentPage=1&amp;groupBy=combo&amp;roomFilter=&amp;usernameFilter=&amp;searchFilter=&amp;usernameFullFilter=&amp;myManager=-1&amp;adminManager=0&amp;webCast=0&amp;command=&amp;recId=1082&amp;auxMessage=&amp;auxMessage1=&amp;lang=en&amp;langChanged=&amp;tenantFilter=&amp;securityTab=" style="line-height: 1.5;">KumaScript Fireside Chat</a> del equipo de desarrolladores<span style="line-height: 1.5;"> MDN</span><span style="line-height: 1.5;">.</span></p>
-
-<p><span style="">¿Qué es KumaScript?</span></p>
-
-<ul>
- <li>Una forma de reutilizar y localizar contenido que aparece repetidamente entre los documentos (por ejemplo, rótulos de compatibilidad, navegación de secciones, carteles de advertencia).</li>
- <li>Una manera de construir documentos sacados de otros documentos.</li>
- <li>Una manera de buscar e incluir contenido de otros sitios web y servicios (por ejemplo, Bugzilla).</li>
-</ul>
-
-<h3 id="¿Qué_no_es_KumaScript">¿Qué no es KumaScript?</h3>
-
-<ul>
- <li>KumaScript no soporta scripts interactivos del tipo que pueden aceptar las incripciones por formulario.</li>
- <li>KumaScript no tiene acceso a bases de datos, archivos, ni a cualquier otra forma de guardar información persistentemente.</li>
- <li>KumaScript no soporta la personalización basada en el usuario que tiene la sesión abierta.</li>
- <li>KumaScript no tiene acceso a información de usuario, sólo al contenido y a los metadatos de una wiki que se esté visualizando.</li>
-</ul>
-
-<h2 id="Aspectos_básicos">Aspectos básicos</h2>
-
-<p>KumaScript funciona permitiendo a <em>wiki de confianza</em> escribir <a class="link-https" href="https://github.com/visionmedia/ejs" title="https://github.com/visionmedia/ejs">plantillas JavaScript ensambladas</a>. Estas plantillas pueden ser invocadas en el contenido del documento por cualquier editor <em>wiki</em> mediante el uso de <a class="link-https" href="/en-US/docs/KumaTests/hello_test?raw=1" title="/en-US/docs/KumaTests/hello_test?raw=1">macros</a>.</p>
-
-<table style="display: block;">
- <tbody>
-  <tr>
-   <td>
-    <p>Una <a class="link-https" href="/en-US/docs/Template:hello" title="/en-US/docs/Template:hello">plantilla</a> se vé así:</p>
-   </td>
-   <td>
-    <p>Una <a class="link-https" href="/en-US/docs/KumaTests/hello_test?raw=1" title="/en-US/docs/KumaTests/hello_test?raw=1">macro</a> se vé así:</p>
-   </td>
-   <td>
-    <p>El <a class="link-https" href="/en-US/docs/KumaTests/hello_test" title="/en-US/docs/KumaTests/hello_test">resultado de una macro</a> sale así:</p>
-   </td>
-  </tr>
-  <tr>
-   <td>
-    <pre class="notranslate">
-&lt;% for (var i = 0; i &lt; $0; i++) { %&gt;
-Hello #&lt;%= i %&gt;
-&lt;% } %&gt;</pre>
-   </td>
-   <td>
-    <pre class="notranslate">
-\{{ hello("3") }}
-</pre>
-   </td>
-   <td>
-    <pre class="notranslate">
-Hello #0
-Hello #1
-Hello #2</pre>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Sintaxis_de_una_macro">Sintaxis de una macro</h3>
-
-<p>Las plantillas KumaScript se invocan en el contenido del documento con macros, como esta:</p>
-
-<pre class="notranslate">\{{ templateName("arg0", "arg1", ..., "argN") }}
-</pre>
-
-<p>La sintaxis de una Macro se compone de estas reglas:</p>
-
-<ul>
- <li>Las Macros comienzan y terminan con los caracteres <code>\{{</code> y <code>}}</code>.</li>
- <li>La primera parte de la macro es el nombre de la plantilla. Esta corresponde a una wiki en <code>/en-US/docs/Template:{name}</code>. Editar y crear estas páginas requiere un permiso especial que los administradores pueden otorgar a editores de confianza.</li>
- <li>Una plantilla puede aceptar parámetros, y esta lista de parámetroa comienza y termina con paréntesis.</li>
- <li>En una plantilla, los parámetros ingresados están disponibles dentro de la macro como las variables <code>$0</code>, <code>$1</code>, <code>$2</code>, y así sucesivamente.</li>
- <li>Todos los parámetros no numéricos deber ir entre comillas. Los números pueden quedar sin ellas.</li>
- <li>La lista completa de parámetros también está disponible en una plantilla como la variable <code>arguments</code>.</li>
-</ul>
-
-<h4 id="Usando_JSON_parámetro_de_macro">Usando JSON parámetro de macro</h4>
-
-<p>Hay una característica semi-experimental disponible para las macros. Puedes proveerlas de un objeto JSON como primero y único parámetro, así:</p>
-
-<pre class="notranslate">\{{ templateName({ "Alpha":"one", "Beta":["a","b","c"], "Foo":"http:\/\/mozilla.org\/" }) }}
-</pre>
-
-<p>Los datos de esta macro estarán disponibles en un código de plantilla como un objeto en el argumento <code>$0</code> (por ejemplo, <code>$0.Alpha</code>, <code>$0.Beta</code>, <code>$0.Foo</code>). Esto también te permite expresar estructuras de datos complejos en los parámetros de macro que son difíciles o imposibles de hacer con una simple lista de parámetros.</p>
-
-<p>Nota que el estilo de este parámetro es muy complejo. Se debe adherir exactamente a la <a href="http://json.org/" title="http://json.org/">sintaxis JSON</a>, que tiene algunas exigencias escurridizas que son fáciles de pasar por alto (por ejemplo, todas las barras (/) llevan escapes). Cuando haya dudas, <a href="http://jsonlint.com/" title="http://jsonlint.com/">intenta ejecutar tu JSON con un validador</a>.</p>
-
-<h4 id="Cómo_escribir">Cómo escribir "\{{"</h4>
-
-<p>Como la secuencia de caracteres "<code>\{{</code>" se usa para indicar el comienzo de una macro, puede ser un problema si justo quieres usar "<code>\{{</code>" and "<code>}}</code>" como texto de una página. Probablemente dará un mensaje de error <code>DocumentParsingError</code>.</p>
-
-<p>En este caso, puedes escapar la primer llave con una barra invertida, así: <code>\\{</code></p>
-
-<h3 id="Sintaxis_de_la_plantilla">Sintaxis de la plantilla</h3>
-
-<p>Las plantillas KumaScript son procesadas por un <a class="link-https" href="https://github.com/visionmedia/ejs" title="https://github.com/visionmedia/ejs">motor de plantillas JavaScript ensamblado</a> con estas simples reglas:</p>
-
-<ul>
- <li>La mayoría del texto es tratado como salida e incluido en el flujo de salida.</li>
- <li>Las expresiones y variables JavaScript pueden insertarse en el flujo de salida con estos bloques:
-  <ul>
-   <li><code>&lt;%= expr %&gt;</code> — el valor de la expresión JavaScript es escapado por el HTML antes de incluirse en la salida (por ejemplo, caracteres como <code>&lt;</code> y <code>&gt;</code>  se convierten en <code>&amp;lt;</code> y <code>&amp;gt;</code>).</li>
-   <li><code>&lt;%- expr %&gt;</code> — el valor de una expresión JavaScript es incluído en la salida pero sin escape. (usa esto si quieres construir etiquetas HTML o usar los resultados de otra plantilla que puedan incluir etiquetas HTML.)</li>
-   <li>Es un error incluir punto y coma dentro de los bloques.</li>
-  </ul>
- </li>
- <li>Cualquier cosa dentro de un bloque <code>&lt;% %&gt;</code>  se interpreta como JavaScript. Esto puede incluir bucles, condiciones, etc.</li>
- <li>No hay nada dentro de un bloque <code>&lt;% %&gt;</code> que pueda contribuir al flujo de salida. Pero puedes hacer la transición desde el modo JS al modo de salida usando <code>&lt;% %&gt; </code>—Por ejemplo:
-  <pre class="notranslate">&lt;% for (var i = 0; i &lt; $0; i++) { %&gt;
-Hello #&lt;%= i %&gt;
-&lt;% } %&gt;
-</pre>
-
-  <p>Nota como el JS está contenido entre <code>&lt;% ... %&gt;</code>, y la salida va en el espacio entre <code>%&gt; ... &lt;%</code>. El bucle <em>for</em> en JS puede comenzar en un bloque <code>&lt;% %&gt;</code> , luego el flujo de salida, y terminar en un segundo bloque JS <code>&lt;% %&gt;</code>.</p>
- </li>
- <li>For more details on EJS syntax, <a class="link-https" href="https://github.com/visionmedia/ejs" title="https://github.com/visionmedia/ejs">check out the upstream module documentation</a>.</li>
-</ul>
-
-<h2 id="Características_avanzadas">Características avanzadas</h2>
-
-<p>Más allá de los aspectos básicos, el sistema KumaScript ofrece algunas características avanzadas.</p>
-
-<h3 id="Variables_de_entorno">Variables de entorno</h3>
-
-<p>Cuando la wiki hace una llamada al servicio KumaScript, <a class="link-https" href="https://github.com/mozilla/kuma/blob/master/apps/wiki/kumascript.py#L130" title="https://github.com/mozilla/kuma/blob/master/apps/wiki/views.py#L537">pasa por una part del contexto del documento actual</a> que KumaScript pone a disposición de las plantillas como variables:</p>
-
-<dl>
- <dt><code>env.path</code></dt>
- <dd>La ruta del documento wiki actual</dd>
- <dt><code>env.url</code></dt>
- <dd>La URL completa del documento wiki actual</dd>
- <dt><code>env.id</code></dt>
- <dd>Un ID único corto para el documento wiki actual</dd>
- <dt><code>env.files</code></dt>
- <dd>Un arreglo de archivos adjuntos para el documento wiki actual. Cada objeto en el arreglo se describe como {{ anch("File objects") }} debajo</dd>
- <dt><code>env.review_tags</code></dt>
- <dd>Un arreglo con las etiquetas de revisión del artículo ("technical", "editorial", etc.)</dd>
- <dt><code>env.locale</code></dt>
- <dd>El sitio del documento wiki actual</dd>
- <dt><code>env.title</code></dt>
- <dd>El título del documento wiki actual</dd>
- <dt><code>env.slug</code></dt>
- <dd>Una URL amigable del documento wiki actual</dd>
- <dt><code>env.tags</code></dt>
- <dd>Una lista de nombers de etiquetas para el documento wiki actual</dd>
- <dt><code>env.modified</code></dt>
- <dd>El último timestamp modificado para el documento wiki actual</dd>
- <dt><code>env.cache_control</code></dt>
- <dd><code>El encabezado Cache-Control</code> henviado en la solicitud para el documento wiki actual, útil para decidir si invalidar los caches</dd>
-</dl>
-
-<h4 id="Objetos_de_archivos">Objetos de archivos</h4>
-
-<p>Cada objeto de archivo tiene los siguientes campos:</p>
-
-<dl>
- <dt><code>title</code></dt>
- <dd>El título del archivo adjunto</dd>
- <dt><code>description</code></dt>
- <dd>Una descripción textual de la revisión actual del archivo</dd>
- <dt><code>filename</code></dt>
- <dd>El nombre del archivo</dd>
- <dt><code>size</code></dt>
- <dd>El tamaños del archivo en bytes</dd>
- <dt><code>author</code></dt>
- <dd>El nombre de usuario de la persona que subió el archivo</dd>
- <dt><code>mime</code></dt>
- <dd>El tipo MIME del archivo</dd>
- <dt><code>url</code></dt>
- <dd>La URL en la que se puede encontrar el archivo</dd>
-</dl>
-
-<h4 id="Trabajando_con_listas">Trabajando con listas</h4>
-
-<p>Las variables <code>env.tags</code> y <code>env.review_tags</code> devuelven colecciones de etiqutas. Puedes trabajar con estas de varias maneras, por supuesto, pero aquí se dan un par de sugerencias.</p>
-
-<h5 id="Buscar_si_se_colocó_una_etiqueta_específica">Buscar si se colocó una etiqueta específica</h5>
-
-<p>Se puede buscar si una etiqueta específica existe en una página, así:</p>
-
-<pre class="brush: js notranslate">if (env.tags.indexOf("tag") != −1) {
-  // The page has the tag "tag"
-}
-</pre>
-
-<h5 id="Iterar_recorrer_todas_las_etiquetas_de_la_página">Iterar (recorrer) todas las etiquetas de la página</h5>
-
-<p>Se pueden recorrer todas las etiquetas de la página, así:</p>
-
-<pre class="brush: js notranslate">env.tag.forEach(function(tag) {
-  // haz cualquier cosa que necesites, tal como:
-  if (tag.indexOf("a") == 0) {
-    // esta etiqueta empieza con "a" - woohoo!
-  }
-});</pre>
-
-<h3 id="APIs_y_Módulos">APIs y Módulos</h3>
-
-<p>KumaScript ofrece algunas APIs de utilidad incorporadas, como también la capacidad para definir nuevas APIs en módulos editables como documentos wiki.</p>
-
-<h4 id="Métodos_incorporados">Métodos incorporados</h4>
-
-<p>Es probable que esta documentación mantenida manualmente quede desactualizada con respecto al código. Teniendo en cuanta eso, <a class="link-https" href="https://github.com/mozilla/kumascript/blob/master/lib/kumascript/api.js#L208" title="https://github.com/mozilla/kumascript/blob/master/lib/kumascript/api.js#L208">siempre puedes verificar el último estado de las APIs incorporadas en la fuente de KumaScript</a>. Pero hay una selección de métodos útiles expuestos a plantillas:</p>
-
-<dl>
- <dt><code>md5(string)</code></dt>
- <dd>Devuelve un resumen de hexadecimal MD5 de determinada cadena.</dd>
- <dt><code>template("name", ["arg0", "arg1", ..., "argN"])</code></dt>
- <dd>Ejecuta y devuelve el resultado de las plantillas mencionadas con la lista de parámetros provistos.</dd>
- <dd>Utilizado en plantillas así: <code>&lt;%- template("warning", ["foo", "bar", "baz"]) %&gt;</code>.</dd>
- <dd>Esta es una función JavaScript. Así que, si uno de los parámetroses una variable arg como $2, no lo pongas entre comillas. Así: <code>&lt;%- template("warning", [$1, $2, "baz"]) %&gt;</code>. Si necesitas llamar otra plantilla desde el interior de un bloque e código, no uses <code>&lt;%</code> ... <code>%&gt;</code>. Ejemplo: <code>myvar = "&lt;li&gt;" + template("LXRSearch", ["ident", "i", $1]) + "&lt;/li&gt;";</code></dd>
- <dt><code>require(name)</code></dt>
- <dd>Carga otra plantilla como un módulo. Cualquier resultadu es ignorado. Devuelce cualquier cosa asignada a <code>module.exports</code> en la plantilla.</dd>
- <dd>Utilizado en plantillas así: <code>&lt;% var my_module = require('MyModule'); %&gt;</code>.</dd>
- <dt><code>cacheFn(key, timeout, function_to_cache)</code></dt>
- <dd>Usando la key y duración de entrada de caché proporcionadas, cachea los resultados de la función proporcionada. Prioriza el valor de <code>env.cache_control</code> para invalidar el cache en <code>no-cache</code>, que puede ser enviado por un usuario logueado  que tipee shift-refresh.</dd>
- <dt><code>request</code></dt>
- <dd>Acceso al <a class="link-https" href="https://github.com/mikeal/request" title="https://github.com/mikeal/request"><code>mikeal/request</code></a>, una librería para hacer consultas HTTP. Usar este módulo en las plantillas KumaScriptno es muy amigable, así que quizá desees envolver uso en APIs de módulo que simplifiquen las cosas.</dd>
-</dl>
-
-<h4 id="Módulos_de_API_incorporados">Módulos de API incorporados</h4>
-
-<p>Sólo hay una API incorporada por el momento, en el espacio de nombres <code>kuma</code>:</p>
-
-<dl>
- <dt><code>kuma.htmlEscape(string)</code></dt>
- <dd>Escapa los caracteres <code>&amp;, &lt;, &gt;, "</code> a <code>&amp;amp, &amp;lt;, &amp;gt;, &amp;quot;</code>, respectivamente.</dd>
- <dt> </dt>
- <dt><code>kuma.include(path)</code></dt>
- <dd>Incluye contenido de la página en la ruta proporcionada. Cacheo pesado.</dd>
-</dl>
-
-<dl>
- <dt><code>kuma.pageExists(path)</code></dt>
- <dd>Indica si existe la página en la ruta proporcionada. Cacheo pesado.</dd>
-</dl>
-
-<h4 id="Creando_módulos">Creando módulos</h4>
-
-<p>Usando el mátodo incorporado <code>require()</code>, puedes cargar una plantilla como módulo para compartir variables y métodos comunes entre plantillas. Un módulo puede definirse como una plantilla de la siguiente manera:</p>
-
-<pre class="notranslate">&lt;%
-module.exports = {
-    add: function (a, b) {
-        return a + b;
-    }
-}
-%&gt;
-</pre>
-
-<p>Asumiendo que esta plantilla está guardada como <code>/en-US/docs/Template:MathLib</code>, puedes utilizarla en otra plantilla, así:</p>
-
-<pre class="notranslate">&lt;%
-var math_lib = require("MathLib");
-%&gt;
-El resultado de 2 + 2 = &lt;%= math_lib.add(2, 2) %&gt;
-</pre>
-
-<p>Y, el resultado de esta plantilla será:</p>
-
-<pre class="notranslate">el resultado de 2 + 2 = 4
-</pre>
-
-<h4 id="Módulos_cargados_automáticamente">Módulos cargados automáticamente</h4>
-
-<p>Hay un grupo de módulos editables como plantillas wiki que se cargan automáticamente y quedan disponibles para cada plantilla. Este grupo está definido en el archivo de configuración para el servicio KumaScript. Cualquier cambio a este requiere un bug IT para editar la configuración y el reinicio del servicio.</p>
-
-<p>Para la mayor parte, estos intentos de proveer sustitutos para stand-ins for legacy DekiScript features to ease template migration. But, going forward, these can be used to share common variables and methods between templates:</p>
-
-<ul>
- <li><code>mdn.*</code> - <a class="link-https" href="/en-US/docs/Template:MDN:Common" title="/en-US/docs/Template:MDN:Common">Template:MDN:Common</a></li>
- <li><code>Culture.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Culture" title="/en-US/docs/Template:DekiScript:Culture">Template:DekiScript:Culture</a></li>
- <li><code>Date.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Date" title="/en-US/docs/Template:DekiScript:Date">Template:DekiScript:Date</a></li>
- <li><code>Json.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Json" title="/en-US/docs/Template:DekiScript:Json">Template:DekiScript:Json</a></li>
- <li><code>List.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:List" title="/en-US/docs/Template:DekiScript:List">Template:DekiScript:List</a></li>
- <li><code>Map.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Map" title="/en-US/docs/Template:DekiScript:Map">Template:DekiScript:Map</a></li>
- <li><code>Meta.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Meta" title="/en-US/docs/Template:DekiScript:Meta">Template:DekiScript:Meta</a></li>
- <li><code>Num.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Num" title="/en-US/docs/Template:DekiScript:Num">Template:DekiScript:Num</a></li>
- <li><code>Page.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Page" title="/en-US/docs/Template:DekiScript:Page">Template:DekiScript:Page</a></li>
- <li><code>String.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:String" title="/en-US/docs/Template:DekiScript:String">Template:DekiScript:String</a></li>
- <li><code>Uri.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Uri" title="/en-US/docs/Template:DekiScript:Uri">Template:DekiScript:Uri</a></li>
- <li><code>Web.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Web" title="/en-US/docs/Template:DekiScript:Web">Template:DekiScript:Web</a></li>
- <li><code>Wiki.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Wiki" title="/en-US/docs/Template:DekiScript:Wiki">Template:DekiScript:Wiki</a></li>
- <li><code>Xml.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Xml" title="/en-US/docs/Template:DekiScript:Xml">Template:DekiScript:Xml</a></li>
-</ul>
-
-<p>The best way to see the current state and offerings of these modules is to <a class="link-https" href="/en-US/docs/tag/dekiscript" title="/en-US/docs/tag/dekiscript">take a look at their source directly</a>.</p>
-
-<p><strong>Note:</strong> You might notice that the DekiScript modules use a built-in method named <code>buildAPI()</code>, like so:</p>
-
-<pre class="notranslate">&lt;% module.exports = buildAPI({
-    StartsWith: function (str, sub_str) {
-        return (''+str).indexOf(sub_str) === 0;
-    }
-}); %&gt;
-</pre>
-
-<p>The reason for this is because DekiScript is case-insensitive when it comes to references to API methods, whereas JavaScript is strict about uppercase and lowercase in references. So, <code>buildAPI()</code> is a hack to try to cover common case variations in DekiScript calls found in legacy templates.</p>
-
-<p>With that in mind, please do not use <code>buildAPI()</code> in new modules.</p>
-
-<h2 id="Tips_and_caveats">Tips and caveats</h2>
-
-<h3 id="Debugging">Debugging</h3>
-
-<p>A useful tip when debugging. You can use the <code>log.debug()</code> method to output text to the scripting messages area at the top of the page that's running your template. Note that you need to be really sure to remove these when you're done debugging, as they're visible to all users! To use it, just do something like this:</p>
-
-<pre class="notranslate">&lt;%- log.debug("Some text goes here"); %&gt;
-</pre>
-
-<p>You can, of course, create more complex output using script code if it's helpful.</p>
-
-<h3 id="Limitations_of_content_migration_from_MindTouch">Limitations of content migration from MindTouch</h3>
-
-<p>When we make the move to Kuma, we will migrate content from the old MindTouch-based wiki to the new Kuma-based one. This script will do some basic work to attempt to convert scripts. But, there are many common code patterns that migration can't fix.</p>
-
-<p>So, this means that we'll need human intervention to carry template scripts over the rest of the way to being functional.</p>
-
-<p>To find templates in need of review and repair, <a class="link-https" href="/en-US/docs/needs-review/template" title="/en-US/docs/needs-review/template">check here</a>: <a class="link-https" href="/en-US/docs/needs-review/template" rel="freelink">/en...eview/template</a>.</p>
-
-<p>To find examples of templates that have already been repaired, <a class="link-https" href="/en-US/docs/tag/ks-fixed" title="/en-US/docs/tag/ks-fixed">check here</a>: <a class="link-https" href="/en-US/docs/tag/ks-fixed" rel="freelink">/en...s/tag/ks-fixed</a>.</p>
-
-<p>Check the <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=714804">template usage stats bug</a> file attachments to help prioritize templates to fix. If you know your way around <code>gzip</code> and <code>grep</code>, <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=591545" title="https://bugzilla.mozilla.org/attachment.cgi?id=591545">this attachment</a> (a 1.5MB tab-delimited file listing template/document pairs) can help tell you what templates are used on which pages.</p>
-
-<p>As you repair templates, please uncheck the "Template" review checkbox and add the tag "ks-fixed", which will keep the above lists accurate.</p>
-
-<p>You can also find templates in need of repair by simply browsing through wiki content and spotting where content looks garbled with code or otherwise incorrect. Editing the page should show you the name of a macro that's in need of help. You may also see scripting errors on pages, which should offer editing links to the templates causing issues.</p>
-
-<h3 id="Keyword_Shortcut_for_quick_template_editing">Keyword Shortcut for quick template editing</h3>
-
-<p>If you spend time editing a lot of KumaScript templates (e.g., to fix partly-migrated legacy DekiScript templates), you may find this keyword shortcut bookmark handy:</p>
-
-<table style="width: 100%;">
- <tbody>
-  <tr>
-   <th>Name</th>
-   <td><code>edit mdn template</code></td>
-  </tr>
-  <tr>
-   <th>Location</th>
-   <td><code><a class="link-https" href="/en-US/docs/Template:%s$edit" rel="freelink">/en...mplate:%s$edit</a></code></td>
-  </tr>
-  <tr>
-   <th>Keyword</th>
-   <td><code>te</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Armed with this bookmarklet, you can copy the name of a template, open a new tab, and type "te [Ctrl-V][Return]" to start editing the template. This helps when a template is misbehaving, yet not badly enough to cause a scripting error message.</p>
-
-<h3 id="Changing_Locale_Identifiers">Changing Locale Identifiers</h3>
-
-<p>The identifiers for various locales have changed from MindTouch to Kuma:</p>
-
-<ul>
- <li><code>en</code> -&gt; <code>en-US</code></li>
- <li><code>cn</code> -&gt; <code>zh-CN</code></li>
- <li><code>zh_cn</code> -&gt; <code>zh-CN</code></li>
- <li><code>zh_tw</code> -&gt; <code>zh-TW</code></li>
- <li><code>pt</code> -&gt; <code>pt-PT</code></li>
-</ul>
-
-<p>This list should not change in the future, assuming we've not missed any. These locale identifier changes become significant in legacy DekiWIki templates.</p>
-
-<h3 id="URL_pattern_changes">URL pattern changes</h3>
-
-<p>The URL pattern for all wiki documents has changed:</p>
-
-<ul>
- <li><code>/{locale}/{slug}</code> -&gt; <code>/{locale}/docs/{slug}</code></li>
-</ul>
-
-<p>So, for example:</p>
-
-<ul>
- <li><code>/en/JavaScript</code> -&gt; <code>/en-US/docs/JavaScript</code></li>
- <li><code>/de/JavaScript</code> -&gt; <code>/de/docs/JavaScript</code></li>
- <li><code>/ja/JavaScript</code> -&gt; <code>/ja/docs/JavaScript</code></li>
-</ul>
-
-<p>To avoid breaking links, there is an attempt to automatically redirect requests to the legacy-style URLs to new-style URLs. But, efforts should be made to change links to the new-style URLs whenever possible.</p>
-
-<h3 id="Differences_from_DekiScript">Differences from DekiScript</h3>
-
-<p>It's useful to note a few changes from templates in DekiScript, in case you encounter these in migrated content:</p>
-
-<ul>
- <li>No more <code>&lt;span class="script"&gt;</code></li>
- <li>No more <code>template.</code> nor <code>wiki.template</code> prefixing</li>
- <li>No more <code>template({name}[, arguments])</code> syntax</li>
- <li>Arguments must be quoted - e.g., <code>bug(123456)</code> becomes <code>bug("123456")</code> - unless you are calling the template from within another template, and the argument is one of the passed-in args like <code>$1</code> in this example: <code>template("LXRSearch", ["ident", "i", $1])</code>.</li>
-</ul>
-
-<h3 id="Caching">Caching</h3>
-
-<p>KumaScript templates are heavily cached to improve performance. For the most part, this works great to serve up content that doesn't change very often. But, as a logged in user, you have two options to force a page to be regenerated, in case you notice issues with scripting:</p>
-
-<ul>
- <li>Hit Refresh in your browser. This causes KumaScript to invalidate its cache for the content on the current page by issuing a request with a <code>Cache-Control: max-age=0</code> header.</li>
- <li>Hit Shift-Refresh in your browser. This causes KumaScript to invalidate cache for the current page, as well as for any templates or content used by the current page by issuing a request with a <code>Cache-Control: no-cache</code> header.</li>
-</ul>
-
-<h2 id="Cookbook">Cookbook</h2>
-
-<p>This section will list examples of common patterns for templates used on MDN, including samples of legacy DekiScript templates and their new KumaScript equivalents.</p>
-
-<h3 id="Force_templates_used_on_a_page_to_be_reloaded">Force templates used on a page to be reloaded</h3>
-
-<p>It bears repeating: To force templates used on a page to be reloaded after editing, hit Shift-Reload. Just using Reload by itself will cause the page contents to be regenerated, but using cached templates and included content. A Shift-Reload is necessary to invalidate caches beyond just the content of the page itself.</p>
-
-<h3 id="Recovering_from_Unknown_Error">Recovering from "Unknown Error"</h3>
-
-<p>Sometimes, you'll see a scripting message like this when you load a page:</p>
-
-<pre class="notranslate">Kumascript service failed unexpectedly: &lt;class 'httplib.BadStatusLine'&gt;</pre>
-
-<p>This is probably a temporary failure of the KumaScript service. If you Refresh the page, the error may disappear. If that doesn't work, try a Shift-Refresh. If, after a few tries, the error persists - <a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=mozilla.org&amp;format=itrequest">file an IT bug</a> for Mozilla Developer Network to ask for an investigation.</p>
-
-<h3 id="Broken_wiki.languages_macros">Broken wiki.languages() macros</h3>
-
-<p>On some pages, you'll see a scripting error like this:</p>
-
-<pre class="notranslate">Syntax error at line 436, column 461: Expected valid JSON object as the parameter of the preceding macro but...
-</pre>
-
-<p>If you edit the page, you'll probably see a macro like this at the bottom of the page:</p>
-
-<pre class="notranslate">\{{ wiki.languages({ "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/JavaScript_概要", ... }) }}
-</pre>
-
-<p>To fix the problem, just delete the macro. Or, replace the curly braces on either side with HTML comments <code>&lt;!-- --&gt;</code> to preserve the information, like so:</p>
-
-<pre class="notranslate">&lt;!-- wiki.languages({ "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/JavaScript_概要", ... }) --&gt;
-</pre>
-
-<p>Because Kuma supports localization differently, these macros aren't actually needed any more. But, they've been left intact in case we need to revisit the relationships between localized pages. Unfortunately, it seems like migration has failed to convert some of them properly.</p>
-
-<h3 id="Unconverted_inline_script_blocks">Unconverted inline script blocks</h3>
-
-<p>Occasionally, you'll find some text like this at the bottom of a page, or even somewhere in the middle:</p>
-
-<pre class="notranslate">ottoPreviousNext("JSGChapters");
-wiki.languages({
-  "fr": "fr/Guide_JavaScript_1.5/Expressions_rationnelles",
-  "ja": "ja/Core_JavaScript_1.5_Guide/Regular_Expressions"
-});
-</pre>
-
-<p>This is a script block that didn't get converted to a KumaScript macro during migration. It happens, unfortunately. If you switch to HTML source editing mode, you'll see this, a <code>&lt;pre class="script"&gt;</code> element:</p>
-
-<pre class="notranslate">&lt;pre class="script" style="font-size: 16px;"&gt;
-ottoPreviousNext(&amp;quot;JSGChapters&amp;quot;);
-wiki.languages({
-  &amp;quot;fr&amp;quot;: &amp;quot;fr/Guide_JavaScript_1.5/Expressions_rationnelles&amp;quot;,
- &amp;nbsp;&amp;quot;ja&amp;quot;: &amp;quot;ja/Core_JavaScript_1.5_Guide/Regular_Expressions&amp;quot;
-});
-&lt;/pre&gt;
-</pre>
-
-<p>This is an inline script - previously allowed by DekiScript, no longer supported by KumaScript.</p>
-
-<p>For this particular example, common to the JavaScript Guide, you can fix it by removing the wiki.languages part (see <a href="/en-US/docs/Project:Introduction_to_KumaScript#Broken_wiki.languages()_macros" title="Project:Introduction_to_KumaScript#Broken_wiki.languages()_macros">previous section</a>) and change the ottoPreviousNext() into a macro like so:</p>
-
-<pre class="notranslate">\{{ ottoPreviousNext("JSGChapters") }}
-</pre>
-
-<p>If you see a block of code that's more complex than the above, you will need to create a new template, move the code there, and replace the code in its previous spot with a macro calling the new template.</p>
-
-<h3 id="Finding_the_Current_Pages_Language">Finding the Current Page's Language</h3>
-
-<p>In KumaScript, the locale of the current document is exposed as an environment variable:</p>
-
-<pre class="notranslate">var lang = env.locale;
-</pre>
-
-<p>In legacy DekiScript templates, coming up with the locale was a bit harder. You'll see chunks of code like this:</p>
-
-<pre class="notranslate">/* accepts as input one required parameter: MathML element to create an xref to */
-var u = uri.parts(Page.uri);
-var lang = string.tolower(u.path[0]);
-if (string.contains(lang, "project") || string.contains(lang, "Project")) {
-  lang = string.substr(lang, 8);
-}
-/* fall back to page.language on a user page */
-else if (string.StartsWith(lang, "user:")) {
-  lang = page.language;
-}
-</pre>
-
-<p>Please replace code like the above with the new KumaScript example. The <code>env.locale</code> variable should be reliable and defined for every document.</p>
-
-<h3 id="Reading_the_contents_of_a_page_attachment">Reading the contents of a page attachment</h3>
-
-<p>You can read the contents of an attached file by using the <code>mdn.getFileContent()</code> function, like this:</p>
-
-<pre class="notranslate">&lt;%
-  var contents = mdn.getFileContent(fileUrl);
-  ... do stuff with the contents ...
-%&gt;
-</pre>
-
-<p>or</p>
-
-<pre class="notranslate">&lt;%-mdn.getFileContent(fileObject)%&gt;
-</pre>
-
-<p>In other words, you may specify either the URL of the file to read or as a file object. The file objects for a page can be accessed through the array <code>env.files</code>. So, for example, to embed the contents of the first file attached to the article, you can do this:</p>
-
-<pre class="notranslate">&lt;%-mdn.getFileContent(env.files[0])%&gt;
-</pre>
-
-<div class="note"><strong>Note:</strong> You probably don't want to try to embed the contents of a non-text file this way, as the raw contents would be injected as text. This is meant to let you access the contents of text attachments.</div>
-
-<p>If the file isn't found, an empty string is returned. There is currently no way to tell the difference between an empty file and a nonexistent one. But if you're putting empty files on the wiki, you're doing it wrong.</p>
-
-<h3 id="Localizing_template_content">Localizing template content</h3>
-
-<p>Templates cannot be translated like other wiki pages. KumaScript only looks for templates in the en-US locale (i.e., <code>/en-US/docs/Template:{name}</code>), and does not look for templates that have been translated to another locale (i.e., <code>/fr/docs/Template:{name}</code>).</p>
-
-<p>So the main way to output content tailored to the current document locale is to pivot on the value of <code>env.locale</code>. There are many ways to do this, but a few patterns are common in the conversion of legacy DekiScript templates:</p>
-
-<h4 id="Ifelse_blocks_in_KumaScript">If/else blocks in KumaScript</h4>
-
-<p>The KumaScript equivalent of this can be achieved with simple if/else blocks, like so:</p>
-
-<pre class="notranslate">&lt;% if ("fr" == env.locale) { %&gt;
-&lt;%- template("CSSRef") %&gt; « &lt;a title="Référence_CSS/Extensions_Mozilla" href="/fr/docs/Référence_CSS/Extensions_Mozilla"&gt;Référence CSS:Extensions Mozilla&lt;/a&gt;
-&lt;% } else if ("ja" == env.locale) { %&gt;
-&lt;%- template("CSSRef") %&gt; « &lt;a title="CSS_Reference/Mozilla_Extensions" href="/ja/docs/CSS_Reference/Mozilla_Extensions"&gt;CSS リファレンス:Mozilla 拡張仕様&lt;/a&gt;
-&lt;% } else if ("pl" == env.locale) { %&gt;
-&lt;%- template("CSSRef") %&gt; « &lt;a title="Dokumentacja_CSS/Rozszerzenia_Mozilli" href="/pl/docs/Dokumentacja_CSS/Rozszerzenia_Mozilli"&gt;Dokumentacja CSS:Rozszerzenia Mozilli&lt;/a&gt;
-&lt;% } else if ("de" == env.locale) { %&gt;
-&lt;%- template("CSSRef") %&gt; « &lt;a title="CSS_Referenz/Mozilla_CSS_Erweiterungen" href="/de/docs/CSS_Referenz/Mozilla_CSS_Erweiterungen"&gt;CSS Referenz: Mozilla Erweiterungen&lt;/a&gt;
-&lt;% } else { %&gt;
-&lt;%- template("CSSRef") %&gt; « &lt;a title="CSS_Reference/Mozilla_Extensions" href="/en-US/docs/CSS_Reference/Mozilla_Extensions"&gt;CSS Reference:Mozilla Extensions&lt;/a&gt;
-&lt;% } %&gt;
-</pre>
-
-<h5 id="Legacy_DekiScript"><strong>Legacy DekiScript</strong></h5>
-
-<p>A similar way this was done in DekiScript was using <code>&lt;span&gt;</code>'s with <code>lang="{locale}"</code> attributes, like so:</p>
-
-<pre class="notranslate">&lt;p&gt;&lt;span lang="*" class="lang lang-*"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="en/CSS_Reference/Mozilla_Extensions" href="/en/CSS_Reference/Mozilla_Extensions"&gt;CSS Reference:Mozilla Extensions&lt;/a&gt;&lt;/span&gt;
-&lt;span lang="en" class="lang lang-en"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="en/CSS_Reference/Mozilla_Extensions" href="/en/CSS_Reference/Mozilla_Extensions"&gt;CSS Reference:Mozilla Extensions&lt;/a&gt;
-&lt;span lang="fr" class="lang lang-fr"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="fr/Référence_CSS/Extensions_Mozilla" href="/fr/Référence_CSS/Extensions_Mozilla"&gt;Référence CSS:Extensions Mozilla&lt;/a&gt;&lt;/span&gt;
-&lt;span lang="ja" class="lang lang-ja"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="ja/CSS_Reference/Mozilla_Extensions" href="/ja/CSS_Reference/Mozilla_Extensions"&gt;CSS リファレンス:Mozilla 拡張仕様&lt;/a&gt;&lt;/span&gt;
-&lt;span lang="pl" class="lang lang-pl"&gt; &lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="pl/Dokumentacja_CSS/Rozszerzenia_Mozilli" href="/pl/Dokumentacja_CSS/Rozszerzenia_Mozilli"&gt;Dokumentacja CSS:Rozszerzenia Mozilli&lt;/a&gt;&lt;/span&gt;
-&lt;span lang="de" class="lang lang-de"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="de/CSS_Referenz/Mozilla_CSS_Erweiterungen" href="/de/CSS_Referenz/Mozilla_CSS_Erweiterungen"&gt;CSS Referenz: Mozilla Erweiterungen&lt;/a&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
-</pre>
-
-<p>This is no longer supported. If you encounter templates built using the legacy DekiScript approach, revise them to use the new KumaScript pattern.</p>
-
-<p>Depending on what text editor is your favorite, you may be able to copy &amp; paste from the browser-based editor and attack this pattern with a series of search/replace regexes to get you most of the way there.</p>
-
-<p>My favorite editor is MacVim, and a series of regexes like this does the bulk of the work with just a little manual clean up following:</p>
-
-<pre class="notranslate">%s#&lt;span#^M&lt;span#g
-%s#&lt;span lang="\(.*\)" .*&gt;#&lt;% } else if ("\1" == env.locale) { %&gt;#g
-%s#&lt;span class="script"&gt;template.Cssxref(#&lt;%- template("Cssxref", [#
-%s#)&lt;/span&gt; &lt;/span&gt;#]) %&gt;
-</pre>
-
-<p>Your mileage may vary, and patterns change slightly from template to template. That's why the migration script was unable to just handle this automatically, after all.</p>
-
-<h4 id="String_variables_and_switch">String variables and switch</h4>
-
-<p>Rather than switch between full chunks of markup, you can define a set of strings, switch them based on locale, and then use them to fill in placeholders in a single chunk of markup:</p>
-
-<pre class="notranslate">&lt;%
-var s_title = 'Firefox for Developers';
-switch (env.locale) {
-    case 'de':
-        s_title = "Firefox für Entwickler";
-        break;
-    case 'fr':
-        s_title = "Firefox pour les développeurs";
-        break;
-    case 'es':
-        s_title = "Firefox para desarrolladores";
-        break;
-};
-%&gt;
-&lt;span class="title"&gt;&lt;%= s_title %&gt;&lt;/span&gt;
-</pre>
-
-<p>You'll see examples of this in legacy DekiScript templates. For the most part, this pattern should work as-is, but you may need to adjust the expected values of locales (e.g., <code>en</code>, <code>cn</code>, <code>pt</code> become <code>en-US</code>, <code>zh-CN</code>, <code>pt-PT</code> respectively).</p>
-
-<h4 id="Use_mdn.localString">Use <code>mdn.localString()</code></h4>
-
-<p>A recent addition to the <code>Template:MDN:Common</code> module is <code>mdn.localString()</code>, used like this:</p>
-
-<pre class="notranslate">&lt;%
-var s_title = mdn.localString({
-  "en-US": "Firefox for Developers",
-  "de": "Firefox für Entwickler",
-  "es": "Firefox para desarrolladores"
-});
-%&gt;
-&lt;span class="title"&gt;&lt;%= s_title %&gt;&lt;/span&gt;
-</pre>
-
-<p>This is more concise than the switch statement, and may be a better choice where a single string is concerned. However, if many strings need to be translated (e.g., as in <a class="link-https" href="/en-US/docs/Template:CSSRef" title="/en-US/docs/Template:CSSRef">CSSRef</a>), a switch statement might help keep all the strings grouped by locale and more easily translated that way.</p>
-
-<p>When the object does not have the appropriate locale, the value of "en-US" is used as the initial value.</p>
-
-<h4 id="Before_and_after_examples">Before and after examples</h4>
-
-<p>Carriage returns added here and there for clarity.</p>
-
-<pre class="notranslate">// Before: DOM0() template Dekiscript
-&lt;p&gt;&lt;span class="lang lang-en" lang="en"&gt;DOM Level 0. Not part of any standard. &lt;/span&gt;
-&lt;span class="lang lang-es" lang="es"&gt;DOM Nivel 0. No es parte de ninguna norma. &lt;/span&gt;
-&lt;span class="lang lang-*" lang="*"&gt;DOM Level 0. Not part of any standard. &lt;/span&gt;
-&lt;span class="lang lang-fr" lang="fr"&gt;DOM Level 0. Ne fait partie d'aucune spécification. &lt;/span&gt;
-&lt;span class="lang lang-ja" lang="ja"&gt;DOM Level 0。どの標準にも属しません。 &lt;/span&gt;
-&lt;span class="lang lang-pl" lang="pl"&gt;DOM Level 0. Nie jest częścią żadnego standardu. &lt;/span&gt;
-&lt;span class="lang lang-zh-cn" lang="zh-cn"&gt;DOM Level 0 不属于任何标准.&lt;/span&gt;&lt;/p&gt;
-
-// After: Kumascript version
-&lt;% if ("fr" == env.locale) { %&gt;
-&lt;p&gt;DOM Level 0. Ne fait partie d'aucune spécification.&lt;/p&gt;
-&lt;% } else if ("ja" == env.locale) { %&gt;
-&lt;p&gt;DOM Level 0。どの標準にも属しません。 &lt;/p&gt;
-&lt;% } else if ("pl" == env.locale) { %&gt;
-&lt;p&gt;DOM Level 0. Nie jest częścią żadnego standardu.&lt;/p&gt;
-&lt;% } else if ("es" == env.locale) { %&gt;
-&lt;p&gt;DOM Nivel 0. No es parte de ninguna norma.&lt;/p&gt;
-&lt;% } else if ("zh-CN" == env.locale) { %&gt;
-&lt;p&gt;DOM Level 0 不属于任何标准.&lt;/p&gt;
-&lt;% } else { %&gt;
-&lt;p&gt;DOM Level 0. Not part of any standard.&lt;/p&gt;
-&lt;% } %&gt;</pre>
-
-<pre class="notranslate">// From ReleaseChannelInfo() template
-// Before:
-web.html("&lt;p&gt;Firefox " + $0 + ", based on Gecko " + $1 + ", will ship in " + $2 + ".
- This article provides information about the changes in this release that will
- affect developers. Nightly builds of what will become Firefox " + $0 + " are "
-  + web.link(url, "currently available") + " on the " + string.ToUpperFirst($3)
-  + " channel.&lt;/p&gt;");
-
-// After:
-&lt;p&gt;Firefox &lt;%= $0 %&gt;, based on Gecko &lt;%= $1 %&gt;, will ship in &lt;%= $2 %&gt;. This
- article provides information about the changes in this release that will
- affect developers. Nightly builds of what will become Firefox &lt;%= $0 %&gt;
- are &lt;%- web.link(url, "currently available")%&gt;  on the
- &lt;%= string.ToUpperFirst($3) %&gt; channel.&lt;/p&gt;</pre>
-
-<pre class="notranslate">// Before: old Dekiscript snippet
-if ($1 &amp;&amp; string.length($1)) {
-  optionsText = optionsText + "&lt;li&gt;" + LXRSearch("ident", "i", $1) + "&lt;/li&gt;";
-}
-
-// After: new Kumascript. Quote parameters to template() unless it is an arg variable (like $1).
-if ($1 &amp;&amp; string.length($1)) {
-    optionsText = optionsText + "&lt;li&gt;" + template("LXRSearch", ["ident", "i", $1]) + "&lt;/li&gt;";
-}
-
-// Note that template() within &lt;% ... %&gt; outputs nothing directly. If you want to call another
-// template and display its output, use &lt;%= %&gt; or &lt;%- %&gt; like this:
-&lt;%- template("LXRSearch", ["ident", "i", $1]) %&gt;</pre>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Project:Getting_started_with_Kuma" title="Getting started with Kuma">Getting started with Kuma</a></li>
- <li><a href="/en-US/docs/Project:KumaScript_reference" title="Project:en/KumaScript reference">KumaScript reference</a></li>
- <li><a class="link-https" href="https://wiki.mozilla.org/MDN/Kuma" title="https://wiki.mozilla.org/MDN/Kuma">Kuma wiki</a></li>
-</ul>
diff --git a/files/es/mdn/tools/kumascript/index.html b/files/es/mdn/tools/kumascript/index.html
new file mode 100644
index 0000000000..cac2778065
--- /dev/null
+++ b/files/es/mdn/tools/kumascript/index.html
@@ -0,0 +1,684 @@
+---
+title: Introducción a KumaScript
+slug: MDN/Tools/KumaScript
+translation_of: MDN/Tools/KumaScript
+original_slug: MDN/Tools/Introduction_to_KumaScript
+---
+<div>{{MDNSidebar}}</div>
+
+<div>{{draft}}</div>
+
+<h2 id="Vistazo_general">Vistazo general</h2>
+
+<p>En el verano de 2012, MDN  cambió a una nueva plataforma wiki llamada <a class="link-https" href="https://wiki.mozilla.org/MDN/Kuma" title="https://wiki.mozilla.org/MDN/Kuma">Kuma</a>. Esta reemplaza el lenguaje de plantilla <a class="external" href="http://developer.mindtouch.com/en/docs/DekiScript" title="http://developer.mindtouch.com/en/docs/DekiScript">DekiScript</a> con un nuevo sistema llamado <a class="link-https" href="https://github.com/mozilla/kumascript" title="https://github.com/mozilla/kumascript">KumaScript</a>. KumaScript se alimenta de JavaScript del lado del servidor, usando <a class="external" href="http://nodejs.org/" title="http://nodejs.org/">Node.js</a>. Este artículo provee informaciónde cómo usar KumaScript y cómo actualizar scripts migrados parcialmente desde MindTouch.</p>
+
+<p>Para detalles y preguntas frecuentes sobre KumaScript, mira el <a href="https://vreplay.mozilla.com/replay/showRecordDetails.html?sortBy=date&amp;viewCount=1&amp;currentPage=1&amp;groupBy=combo&amp;roomFilter=&amp;usernameFilter=&amp;searchFilter=&amp;usernameFullFilter=&amp;myManager=-1&amp;adminManager=0&amp;webCast=0&amp;command=&amp;recId=1082&amp;auxMessage=&amp;auxMessage1=&amp;lang=en&amp;langChanged=&amp;tenantFilter=&amp;securityTab=" style="line-height: 1.5;">KumaScript Fireside Chat</a> del equipo de desarrolladores<span style="line-height: 1.5;"> MDN</span><span style="line-height: 1.5;">.</span></p>
+
+<p><span style="">¿Qué es KumaScript?</span></p>
+
+<ul>
+ <li>Una forma de reutilizar y localizar contenido que aparece repetidamente entre los documentos (por ejemplo, rótulos de compatibilidad, navegación de secciones, carteles de advertencia).</li>
+ <li>Una manera de construir documentos sacados de otros documentos.</li>
+ <li>Una manera de buscar e incluir contenido de otros sitios web y servicios (por ejemplo, Bugzilla).</li>
+</ul>
+
+<h3 id="¿Qué_no_es_KumaScript">¿Qué no es KumaScript?</h3>
+
+<ul>
+ <li>KumaScript no soporta scripts interactivos del tipo que pueden aceptar las incripciones por formulario.</li>
+ <li>KumaScript no tiene acceso a bases de datos, archivos, ni a cualquier otra forma de guardar información persistentemente.</li>
+ <li>KumaScript no soporta la personalización basada en el usuario que tiene la sesión abierta.</li>
+ <li>KumaScript no tiene acceso a información de usuario, sólo al contenido y a los metadatos de una wiki que se esté visualizando.</li>
+</ul>
+
+<h2 id="Aspectos_básicos">Aspectos básicos</h2>
+
+<p>KumaScript funciona permitiendo a <em>wiki de confianza</em> escribir <a class="link-https" href="https://github.com/visionmedia/ejs" title="https://github.com/visionmedia/ejs">plantillas JavaScript ensambladas</a>. Estas plantillas pueden ser invocadas en el contenido del documento por cualquier editor <em>wiki</em> mediante el uso de <a class="link-https" href="/en-US/docs/KumaTests/hello_test?raw=1" title="/en-US/docs/KumaTests/hello_test?raw=1">macros</a>.</p>
+
+<table style="display: block;">
+ <tbody>
+  <tr>
+   <td>
+    <p>Una <a class="link-https" href="/en-US/docs/Template:hello" title="/en-US/docs/Template:hello">plantilla</a> se vé así:</p>
+   </td>
+   <td>
+    <p>Una <a class="link-https" href="/en-US/docs/KumaTests/hello_test?raw=1" title="/en-US/docs/KumaTests/hello_test?raw=1">macro</a> se vé así:</p>
+   </td>
+   <td>
+    <p>El <a class="link-https" href="/en-US/docs/KumaTests/hello_test" title="/en-US/docs/KumaTests/hello_test">resultado de una macro</a> sale así:</p>
+   </td>
+  </tr>
+  <tr>
+   <td>
+    <pre class="notranslate">
+&lt;% for (var i = 0; i &lt; $0; i++) { %&gt;
+Hello #&lt;%= i %&gt;
+&lt;% } %&gt;</pre>
+   </td>
+   <td>
+    <pre class="notranslate">
+\{{ hello("3") }}
+</pre>
+   </td>
+   <td>
+    <pre class="notranslate">
+Hello #0
+Hello #1
+Hello #2</pre>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Sintaxis_de_una_macro">Sintaxis de una macro</h3>
+
+<p>Las plantillas KumaScript se invocan en el contenido del documento con macros, como esta:</p>
+
+<pre class="notranslate">\{{ templateName("arg0", "arg1", ..., "argN") }}
+</pre>
+
+<p>La sintaxis de una Macro se compone de estas reglas:</p>
+
+<ul>
+ <li>Las Macros comienzan y terminan con los caracteres <code>\{{</code> y <code>}}</code>.</li>
+ <li>La primera parte de la macro es el nombre de la plantilla. Esta corresponde a una wiki en <code>/en-US/docs/Template:{name}</code>. Editar y crear estas páginas requiere un permiso especial que los administradores pueden otorgar a editores de confianza.</li>
+ <li>Una plantilla puede aceptar parámetros, y esta lista de parámetroa comienza y termina con paréntesis.</li>
+ <li>En una plantilla, los parámetros ingresados están disponibles dentro de la macro como las variables <code>$0</code>, <code>$1</code>, <code>$2</code>, y así sucesivamente.</li>
+ <li>Todos los parámetros no numéricos deber ir entre comillas. Los números pueden quedar sin ellas.</li>
+ <li>La lista completa de parámetros también está disponible en una plantilla como la variable <code>arguments</code>.</li>
+</ul>
+
+<h4 id="Usando_JSON_parámetro_de_macro">Usando JSON parámetro de macro</h4>
+
+<p>Hay una característica semi-experimental disponible para las macros. Puedes proveerlas de un objeto JSON como primero y único parámetro, así:</p>
+
+<pre class="notranslate">\{{ templateName({ "Alpha":"one", "Beta":["a","b","c"], "Foo":"http:\/\/mozilla.org\/" }) }}
+</pre>
+
+<p>Los datos de esta macro estarán disponibles en un código de plantilla como un objeto en el argumento <code>$0</code> (por ejemplo, <code>$0.Alpha</code>, <code>$0.Beta</code>, <code>$0.Foo</code>). Esto también te permite expresar estructuras de datos complejos en los parámetros de macro que son difíciles o imposibles de hacer con una simple lista de parámetros.</p>
+
+<p>Nota que el estilo de este parámetro es muy complejo. Se debe adherir exactamente a la <a href="http://json.org/" title="http://json.org/">sintaxis JSON</a>, que tiene algunas exigencias escurridizas que son fáciles de pasar por alto (por ejemplo, todas las barras (/) llevan escapes). Cuando haya dudas, <a href="http://jsonlint.com/" title="http://jsonlint.com/">intenta ejecutar tu JSON con un validador</a>.</p>
+
+<h4 id="Cómo_escribir">Cómo escribir "\{{"</h4>
+
+<p>Como la secuencia de caracteres "<code>\{{</code>" se usa para indicar el comienzo de una macro, puede ser un problema si justo quieres usar "<code>\{{</code>" and "<code>}}</code>" como texto de una página. Probablemente dará un mensaje de error <code>DocumentParsingError</code>.</p>
+
+<p>En este caso, puedes escapar la primer llave con una barra invertida, así: <code>\\{</code></p>
+
+<h3 id="Sintaxis_de_la_plantilla">Sintaxis de la plantilla</h3>
+
+<p>Las plantillas KumaScript son procesadas por un <a class="link-https" href="https://github.com/visionmedia/ejs" title="https://github.com/visionmedia/ejs">motor de plantillas JavaScript ensamblado</a> con estas simples reglas:</p>
+
+<ul>
+ <li>La mayoría del texto es tratado como salida e incluido en el flujo de salida.</li>
+ <li>Las expresiones y variables JavaScript pueden insertarse en el flujo de salida con estos bloques:
+  <ul>
+   <li><code>&lt;%= expr %&gt;</code> — el valor de la expresión JavaScript es escapado por el HTML antes de incluirse en la salida (por ejemplo, caracteres como <code>&lt;</code> y <code>&gt;</code>  se convierten en <code>&amp;lt;</code> y <code>&amp;gt;</code>).</li>
+   <li><code>&lt;%- expr %&gt;</code> — el valor de una expresión JavaScript es incluído en la salida pero sin escape. (usa esto si quieres construir etiquetas HTML o usar los resultados de otra plantilla que puedan incluir etiquetas HTML.)</li>
+   <li>Es un error incluir punto y coma dentro de los bloques.</li>
+  </ul>
+ </li>
+ <li>Cualquier cosa dentro de un bloque <code>&lt;% %&gt;</code>  se interpreta como JavaScript. Esto puede incluir bucles, condiciones, etc.</li>
+ <li>No hay nada dentro de un bloque <code>&lt;% %&gt;</code> que pueda contribuir al flujo de salida. Pero puedes hacer la transición desde el modo JS al modo de salida usando <code>&lt;% %&gt; </code>—Por ejemplo:
+  <pre class="notranslate">&lt;% for (var i = 0; i &lt; $0; i++) { %&gt;
+Hello #&lt;%= i %&gt;
+&lt;% } %&gt;
+</pre>
+
+  <p>Nota como el JS está contenido entre <code>&lt;% ... %&gt;</code>, y la salida va en el espacio entre <code>%&gt; ... &lt;%</code>. El bucle <em>for</em> en JS puede comenzar en un bloque <code>&lt;% %&gt;</code> , luego el flujo de salida, y terminar en un segundo bloque JS <code>&lt;% %&gt;</code>.</p>
+ </li>
+ <li>For more details on EJS syntax, <a class="link-https" href="https://github.com/visionmedia/ejs" title="https://github.com/visionmedia/ejs">check out the upstream module documentation</a>.</li>
+</ul>
+
+<h2 id="Características_avanzadas">Características avanzadas</h2>
+
+<p>Más allá de los aspectos básicos, el sistema KumaScript ofrece algunas características avanzadas.</p>
+
+<h3 id="Variables_de_entorno">Variables de entorno</h3>
+
+<p>Cuando la wiki hace una llamada al servicio KumaScript, <a class="link-https" href="https://github.com/mozilla/kuma/blob/master/apps/wiki/kumascript.py#L130" title="https://github.com/mozilla/kuma/blob/master/apps/wiki/views.py#L537">pasa por una part del contexto del documento actual</a> que KumaScript pone a disposición de las plantillas como variables:</p>
+
+<dl>
+ <dt><code>env.path</code></dt>
+ <dd>La ruta del documento wiki actual</dd>
+ <dt><code>env.url</code></dt>
+ <dd>La URL completa del documento wiki actual</dd>
+ <dt><code>env.id</code></dt>
+ <dd>Un ID único corto para el documento wiki actual</dd>
+ <dt><code>env.files</code></dt>
+ <dd>Un arreglo de archivos adjuntos para el documento wiki actual. Cada objeto en el arreglo se describe como {{ anch("File objects") }} debajo</dd>
+ <dt><code>env.review_tags</code></dt>
+ <dd>Un arreglo con las etiquetas de revisión del artículo ("technical", "editorial", etc.)</dd>
+ <dt><code>env.locale</code></dt>
+ <dd>El sitio del documento wiki actual</dd>
+ <dt><code>env.title</code></dt>
+ <dd>El título del documento wiki actual</dd>
+ <dt><code>env.slug</code></dt>
+ <dd>Una URL amigable del documento wiki actual</dd>
+ <dt><code>env.tags</code></dt>
+ <dd>Una lista de nombers de etiquetas para el documento wiki actual</dd>
+ <dt><code>env.modified</code></dt>
+ <dd>El último timestamp modificado para el documento wiki actual</dd>
+ <dt><code>env.cache_control</code></dt>
+ <dd><code>El encabezado Cache-Control</code> henviado en la solicitud para el documento wiki actual, útil para decidir si invalidar los caches</dd>
+</dl>
+
+<h4 id="Objetos_de_archivos">Objetos de archivos</h4>
+
+<p>Cada objeto de archivo tiene los siguientes campos:</p>
+
+<dl>
+ <dt><code>title</code></dt>
+ <dd>El título del archivo adjunto</dd>
+ <dt><code>description</code></dt>
+ <dd>Una descripción textual de la revisión actual del archivo</dd>
+ <dt><code>filename</code></dt>
+ <dd>El nombre del archivo</dd>
+ <dt><code>size</code></dt>
+ <dd>El tamaños del archivo en bytes</dd>
+ <dt><code>author</code></dt>
+ <dd>El nombre de usuario de la persona que subió el archivo</dd>
+ <dt><code>mime</code></dt>
+ <dd>El tipo MIME del archivo</dd>
+ <dt><code>url</code></dt>
+ <dd>La URL en la que se puede encontrar el archivo</dd>
+</dl>
+
+<h4 id="Trabajando_con_listas">Trabajando con listas</h4>
+
+<p>Las variables <code>env.tags</code> y <code>env.review_tags</code> devuelven colecciones de etiqutas. Puedes trabajar con estas de varias maneras, por supuesto, pero aquí se dan un par de sugerencias.</p>
+
+<h5 id="Buscar_si_se_colocó_una_etiqueta_específica">Buscar si se colocó una etiqueta específica</h5>
+
+<p>Se puede buscar si una etiqueta específica existe en una página, así:</p>
+
+<pre class="brush: js notranslate">if (env.tags.indexOf("tag") != −1) {
+  // The page has the tag "tag"
+}
+</pre>
+
+<h5 id="Iterar_recorrer_todas_las_etiquetas_de_la_página">Iterar (recorrer) todas las etiquetas de la página</h5>
+
+<p>Se pueden recorrer todas las etiquetas de la página, así:</p>
+
+<pre class="brush: js notranslate">env.tag.forEach(function(tag) {
+  // haz cualquier cosa que necesites, tal como:
+  if (tag.indexOf("a") == 0) {
+    // esta etiqueta empieza con "a" - woohoo!
+  }
+});</pre>
+
+<h3 id="APIs_y_Módulos">APIs y Módulos</h3>
+
+<p>KumaScript ofrece algunas APIs de utilidad incorporadas, como también la capacidad para definir nuevas APIs en módulos editables como documentos wiki.</p>
+
+<h4 id="Métodos_incorporados">Métodos incorporados</h4>
+
+<p>Es probable que esta documentación mantenida manualmente quede desactualizada con respecto al código. Teniendo en cuanta eso, <a class="link-https" href="https://github.com/mozilla/kumascript/blob/master/lib/kumascript/api.js#L208" title="https://github.com/mozilla/kumascript/blob/master/lib/kumascript/api.js#L208">siempre puedes verificar el último estado de las APIs incorporadas en la fuente de KumaScript</a>. Pero hay una selección de métodos útiles expuestos a plantillas:</p>
+
+<dl>
+ <dt><code>md5(string)</code></dt>
+ <dd>Devuelve un resumen de hexadecimal MD5 de determinada cadena.</dd>
+ <dt><code>template("name", ["arg0", "arg1", ..., "argN"])</code></dt>
+ <dd>Ejecuta y devuelve el resultado de las plantillas mencionadas con la lista de parámetros provistos.</dd>
+ <dd>Utilizado en plantillas así: <code>&lt;%- template("warning", ["foo", "bar", "baz"]) %&gt;</code>.</dd>
+ <dd>Esta es una función JavaScript. Así que, si uno de los parámetroses una variable arg como $2, no lo pongas entre comillas. Así: <code>&lt;%- template("warning", [$1, $2, "baz"]) %&gt;</code>. Si necesitas llamar otra plantilla desde el interior de un bloque e código, no uses <code>&lt;%</code> ... <code>%&gt;</code>. Ejemplo: <code>myvar = "&lt;li&gt;" + template("LXRSearch", ["ident", "i", $1]) + "&lt;/li&gt;";</code></dd>
+ <dt><code>require(name)</code></dt>
+ <dd>Carga otra plantilla como un módulo. Cualquier resultadu es ignorado. Devuelce cualquier cosa asignada a <code>module.exports</code> en la plantilla.</dd>
+ <dd>Utilizado en plantillas así: <code>&lt;% var my_module = require('MyModule'); %&gt;</code>.</dd>
+ <dt><code>cacheFn(key, timeout, function_to_cache)</code></dt>
+ <dd>Usando la key y duración de entrada de caché proporcionadas, cachea los resultados de la función proporcionada. Prioriza el valor de <code>env.cache_control</code> para invalidar el cache en <code>no-cache</code>, que puede ser enviado por un usuario logueado  que tipee shift-refresh.</dd>
+ <dt><code>request</code></dt>
+ <dd>Acceso al <a class="link-https" href="https://github.com/mikeal/request" title="https://github.com/mikeal/request"><code>mikeal/request</code></a>, una librería para hacer consultas HTTP. Usar este módulo en las plantillas KumaScriptno es muy amigable, así que quizá desees envolver uso en APIs de módulo que simplifiquen las cosas.</dd>
+</dl>
+
+<h4 id="Módulos_de_API_incorporados">Módulos de API incorporados</h4>
+
+<p>Sólo hay una API incorporada por el momento, en el espacio de nombres <code>kuma</code>:</p>
+
+<dl>
+ <dt><code>kuma.htmlEscape(string)</code></dt>
+ <dd>Escapa los caracteres <code>&amp;, &lt;, &gt;, "</code> a <code>&amp;amp, &amp;lt;, &amp;gt;, &amp;quot;</code>, respectivamente.</dd>
+ <dt> </dt>
+ <dt><code>kuma.include(path)</code></dt>
+ <dd>Incluye contenido de la página en la ruta proporcionada. Cacheo pesado.</dd>
+</dl>
+
+<dl>
+ <dt><code>kuma.pageExists(path)</code></dt>
+ <dd>Indica si existe la página en la ruta proporcionada. Cacheo pesado.</dd>
+</dl>
+
+<h4 id="Creando_módulos">Creando módulos</h4>
+
+<p>Usando el mátodo incorporado <code>require()</code>, puedes cargar una plantilla como módulo para compartir variables y métodos comunes entre plantillas. Un módulo puede definirse como una plantilla de la siguiente manera:</p>
+
+<pre class="notranslate">&lt;%
+module.exports = {
+    add: function (a, b) {
+        return a + b;
+    }
+}
+%&gt;
+</pre>
+
+<p>Asumiendo que esta plantilla está guardada como <code>/en-US/docs/Template:MathLib</code>, puedes utilizarla en otra plantilla, así:</p>
+
+<pre class="notranslate">&lt;%
+var math_lib = require("MathLib");
+%&gt;
+El resultado de 2 + 2 = &lt;%= math_lib.add(2, 2) %&gt;
+</pre>
+
+<p>Y, el resultado de esta plantilla será:</p>
+
+<pre class="notranslate">el resultado de 2 + 2 = 4
+</pre>
+
+<h4 id="Módulos_cargados_automáticamente">Módulos cargados automáticamente</h4>
+
+<p>Hay un grupo de módulos editables como plantillas wiki que se cargan automáticamente y quedan disponibles para cada plantilla. Este grupo está definido en el archivo de configuración para el servicio KumaScript. Cualquier cambio a este requiere un bug IT para editar la configuración y el reinicio del servicio.</p>
+
+<p>Para la mayor parte, estos intentos de proveer sustitutos para stand-ins for legacy DekiScript features to ease template migration. But, going forward, these can be used to share common variables and methods between templates:</p>
+
+<ul>
+ <li><code>mdn.*</code> - <a class="link-https" href="/en-US/docs/Template:MDN:Common" title="/en-US/docs/Template:MDN:Common">Template:MDN:Common</a></li>
+ <li><code>Culture.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Culture" title="/en-US/docs/Template:DekiScript:Culture">Template:DekiScript:Culture</a></li>
+ <li><code>Date.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Date" title="/en-US/docs/Template:DekiScript:Date">Template:DekiScript:Date</a></li>
+ <li><code>Json.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Json" title="/en-US/docs/Template:DekiScript:Json">Template:DekiScript:Json</a></li>
+ <li><code>List.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:List" title="/en-US/docs/Template:DekiScript:List">Template:DekiScript:List</a></li>
+ <li><code>Map.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Map" title="/en-US/docs/Template:DekiScript:Map">Template:DekiScript:Map</a></li>
+ <li><code>Meta.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Meta" title="/en-US/docs/Template:DekiScript:Meta">Template:DekiScript:Meta</a></li>
+ <li><code>Num.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Num" title="/en-US/docs/Template:DekiScript:Num">Template:DekiScript:Num</a></li>
+ <li><code>Page.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Page" title="/en-US/docs/Template:DekiScript:Page">Template:DekiScript:Page</a></li>
+ <li><code>String.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:String" title="/en-US/docs/Template:DekiScript:String">Template:DekiScript:String</a></li>
+ <li><code>Uri.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Uri" title="/en-US/docs/Template:DekiScript:Uri">Template:DekiScript:Uri</a></li>
+ <li><code>Web.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Web" title="/en-US/docs/Template:DekiScript:Web">Template:DekiScript:Web</a></li>
+ <li><code>Wiki.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Wiki" title="/en-US/docs/Template:DekiScript:Wiki">Template:DekiScript:Wiki</a></li>
+ <li><code>Xml.*</code> - <a class="link-https" href="/en-US/docs/Template:DekiScript:Xml" title="/en-US/docs/Template:DekiScript:Xml">Template:DekiScript:Xml</a></li>
+</ul>
+
+<p>The best way to see the current state and offerings of these modules is to <a class="link-https" href="/en-US/docs/tag/dekiscript" title="/en-US/docs/tag/dekiscript">take a look at their source directly</a>.</p>
+
+<p><strong>Note:</strong> You might notice that the DekiScript modules use a built-in method named <code>buildAPI()</code>, like so:</p>
+
+<pre class="notranslate">&lt;% module.exports = buildAPI({
+    StartsWith: function (str, sub_str) {
+        return (''+str).indexOf(sub_str) === 0;
+    }
+}); %&gt;
+</pre>
+
+<p>The reason for this is because DekiScript is case-insensitive when it comes to references to API methods, whereas JavaScript is strict about uppercase and lowercase in references. So, <code>buildAPI()</code> is a hack to try to cover common case variations in DekiScript calls found in legacy templates.</p>
+
+<p>With that in mind, please do not use <code>buildAPI()</code> in new modules.</p>
+
+<h2 id="Tips_and_caveats">Tips and caveats</h2>
+
+<h3 id="Debugging">Debugging</h3>
+
+<p>A useful tip when debugging. You can use the <code>log.debug()</code> method to output text to the scripting messages area at the top of the page that's running your template. Note that you need to be really sure to remove these when you're done debugging, as they're visible to all users! To use it, just do something like this:</p>
+
+<pre class="notranslate">&lt;%- log.debug("Some text goes here"); %&gt;
+</pre>
+
+<p>You can, of course, create more complex output using script code if it's helpful.</p>
+
+<h3 id="Limitations_of_content_migration_from_MindTouch">Limitations of content migration from MindTouch</h3>
+
+<p>When we make the move to Kuma, we will migrate content from the old MindTouch-based wiki to the new Kuma-based one. This script will do some basic work to attempt to convert scripts. But, there are many common code patterns that migration can't fix.</p>
+
+<p>So, this means that we'll need human intervention to carry template scripts over the rest of the way to being functional.</p>
+
+<p>To find templates in need of review and repair, <a class="link-https" href="/en-US/docs/needs-review/template" title="/en-US/docs/needs-review/template">check here</a>: <a class="link-https" href="/en-US/docs/needs-review/template" rel="freelink">/en...eview/template</a>.</p>
+
+<p>To find examples of templates that have already been repaired, <a class="link-https" href="/en-US/docs/tag/ks-fixed" title="/en-US/docs/tag/ks-fixed">check here</a>: <a class="link-https" href="/en-US/docs/tag/ks-fixed" rel="freelink">/en...s/tag/ks-fixed</a>.</p>
+
+<p>Check the <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=714804">template usage stats bug</a> file attachments to help prioritize templates to fix. If you know your way around <code>gzip</code> and <code>grep</code>, <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=591545" title="https://bugzilla.mozilla.org/attachment.cgi?id=591545">this attachment</a> (a 1.5MB tab-delimited file listing template/document pairs) can help tell you what templates are used on which pages.</p>
+
+<p>As you repair templates, please uncheck the "Template" review checkbox and add the tag "ks-fixed", which will keep the above lists accurate.</p>
+
+<p>You can also find templates in need of repair by simply browsing through wiki content and spotting where content looks garbled with code or otherwise incorrect. Editing the page should show you the name of a macro that's in need of help. You may also see scripting errors on pages, which should offer editing links to the templates causing issues.</p>
+
+<h3 id="Keyword_Shortcut_for_quick_template_editing">Keyword Shortcut for quick template editing</h3>
+
+<p>If you spend time editing a lot of KumaScript templates (e.g., to fix partly-migrated legacy DekiScript templates), you may find this keyword shortcut bookmark handy:</p>
+
+<table style="width: 100%;">
+ <tbody>
+  <tr>
+   <th>Name</th>
+   <td><code>edit mdn template</code></td>
+  </tr>
+  <tr>
+   <th>Location</th>
+   <td><code><a class="link-https" href="/en-US/docs/Template:%s$edit" rel="freelink">/en...mplate:%s$edit</a></code></td>
+  </tr>
+  <tr>
+   <th>Keyword</th>
+   <td><code>te</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Armed with this bookmarklet, you can copy the name of a template, open a new tab, and type "te [Ctrl-V][Return]" to start editing the template. This helps when a template is misbehaving, yet not badly enough to cause a scripting error message.</p>
+
+<h3 id="Changing_Locale_Identifiers">Changing Locale Identifiers</h3>
+
+<p>The identifiers for various locales have changed from MindTouch to Kuma:</p>
+
+<ul>
+ <li><code>en</code> -&gt; <code>en-US</code></li>
+ <li><code>cn</code> -&gt; <code>zh-CN</code></li>
+ <li><code>zh_cn</code> -&gt; <code>zh-CN</code></li>
+ <li><code>zh_tw</code> -&gt; <code>zh-TW</code></li>
+ <li><code>pt</code> -&gt; <code>pt-PT</code></li>
+</ul>
+
+<p>This list should not change in the future, assuming we've not missed any. These locale identifier changes become significant in legacy DekiWIki templates.</p>
+
+<h3 id="URL_pattern_changes">URL pattern changes</h3>
+
+<p>The URL pattern for all wiki documents has changed:</p>
+
+<ul>
+ <li><code>/{locale}/{slug}</code> -&gt; <code>/{locale}/docs/{slug}</code></li>
+</ul>
+
+<p>So, for example:</p>
+
+<ul>
+ <li><code>/en/JavaScript</code> -&gt; <code>/en-US/docs/JavaScript</code></li>
+ <li><code>/de/JavaScript</code> -&gt; <code>/de/docs/JavaScript</code></li>
+ <li><code>/ja/JavaScript</code> -&gt; <code>/ja/docs/JavaScript</code></li>
+</ul>
+
+<p>To avoid breaking links, there is an attempt to automatically redirect requests to the legacy-style URLs to new-style URLs. But, efforts should be made to change links to the new-style URLs whenever possible.</p>
+
+<h3 id="Differences_from_DekiScript">Differences from DekiScript</h3>
+
+<p>It's useful to note a few changes from templates in DekiScript, in case you encounter these in migrated content:</p>
+
+<ul>
+ <li>No more <code>&lt;span class="script"&gt;</code></li>
+ <li>No more <code>template.</code> nor <code>wiki.template</code> prefixing</li>
+ <li>No more <code>template({name}[, arguments])</code> syntax</li>
+ <li>Arguments must be quoted - e.g., <code>bug(123456)</code> becomes <code>bug("123456")</code> - unless you are calling the template from within another template, and the argument is one of the passed-in args like <code>$1</code> in this example: <code>template("LXRSearch", ["ident", "i", $1])</code>.</li>
+</ul>
+
+<h3 id="Caching">Caching</h3>
+
+<p>KumaScript templates are heavily cached to improve performance. For the most part, this works great to serve up content that doesn't change very often. But, as a logged in user, you have two options to force a page to be regenerated, in case you notice issues with scripting:</p>
+
+<ul>
+ <li>Hit Refresh in your browser. This causes KumaScript to invalidate its cache for the content on the current page by issuing a request with a <code>Cache-Control: max-age=0</code> header.</li>
+ <li>Hit Shift-Refresh in your browser. This causes KumaScript to invalidate cache for the current page, as well as for any templates or content used by the current page by issuing a request with a <code>Cache-Control: no-cache</code> header.</li>
+</ul>
+
+<h2 id="Cookbook">Cookbook</h2>
+
+<p>This section will list examples of common patterns for templates used on MDN, including samples of legacy DekiScript templates and their new KumaScript equivalents.</p>
+
+<h3 id="Force_templates_used_on_a_page_to_be_reloaded">Force templates used on a page to be reloaded</h3>
+
+<p>It bears repeating: To force templates used on a page to be reloaded after editing, hit Shift-Reload. Just using Reload by itself will cause the page contents to be regenerated, but using cached templates and included content. A Shift-Reload is necessary to invalidate caches beyond just the content of the page itself.</p>
+
+<h3 id="Recovering_from_Unknown_Error">Recovering from "Unknown Error"</h3>
+
+<p>Sometimes, you'll see a scripting message like this when you load a page:</p>
+
+<pre class="notranslate">Kumascript service failed unexpectedly: &lt;class 'httplib.BadStatusLine'&gt;</pre>
+
+<p>This is probably a temporary failure of the KumaScript service. If you Refresh the page, the error may disappear. If that doesn't work, try a Shift-Refresh. If, after a few tries, the error persists - <a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=mozilla.org&amp;format=itrequest">file an IT bug</a> for Mozilla Developer Network to ask for an investigation.</p>
+
+<h3 id="Broken_wiki.languages_macros">Broken wiki.languages() macros</h3>
+
+<p>On some pages, you'll see a scripting error like this:</p>
+
+<pre class="notranslate">Syntax error at line 436, column 461: Expected valid JSON object as the parameter of the preceding macro but...
+</pre>
+
+<p>If you edit the page, you'll probably see a macro like this at the bottom of the page:</p>
+
+<pre class="notranslate">\{{ wiki.languages({ "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/JavaScript_概要", ... }) }}
+</pre>
+
+<p>To fix the problem, just delete the macro. Or, replace the curly braces on either side with HTML comments <code>&lt;!-- --&gt;</code> to preserve the information, like so:</p>
+
+<pre class="notranslate">&lt;!-- wiki.languages({ "zh-tw": "zh_tw/Core_JavaScript_1.5_教學/JavaScript_概要", ... }) --&gt;
+</pre>
+
+<p>Because Kuma supports localization differently, these macros aren't actually needed any more. But, they've been left intact in case we need to revisit the relationships between localized pages. Unfortunately, it seems like migration has failed to convert some of them properly.</p>
+
+<h3 id="Unconverted_inline_script_blocks">Unconverted inline script blocks</h3>
+
+<p>Occasionally, you'll find some text like this at the bottom of a page, or even somewhere in the middle:</p>
+
+<pre class="notranslate">ottoPreviousNext("JSGChapters");
+wiki.languages({
+  "fr": "fr/Guide_JavaScript_1.5/Expressions_rationnelles",
+  "ja": "ja/Core_JavaScript_1.5_Guide/Regular_Expressions"
+});
+</pre>
+
+<p>This is a script block that didn't get converted to a KumaScript macro during migration. It happens, unfortunately. If you switch to HTML source editing mode, you'll see this, a <code>&lt;pre class="script"&gt;</code> element:</p>
+
+<pre class="notranslate">&lt;pre class="script" style="font-size: 16px;"&gt;
+ottoPreviousNext(&amp;quot;JSGChapters&amp;quot;);
+wiki.languages({
+  &amp;quot;fr&amp;quot;: &amp;quot;fr/Guide_JavaScript_1.5/Expressions_rationnelles&amp;quot;,
+ &amp;nbsp;&amp;quot;ja&amp;quot;: &amp;quot;ja/Core_JavaScript_1.5_Guide/Regular_Expressions&amp;quot;
+});
+&lt;/pre&gt;
+</pre>
+
+<p>This is an inline script - previously allowed by DekiScript, no longer supported by KumaScript.</p>
+
+<p>For this particular example, common to the JavaScript Guide, you can fix it by removing the wiki.languages part (see <a href="/en-US/docs/Project:Introduction_to_KumaScript#Broken_wiki.languages()_macros" title="Project:Introduction_to_KumaScript#Broken_wiki.languages()_macros">previous section</a>) and change the ottoPreviousNext() into a macro like so:</p>
+
+<pre class="notranslate">\{{ ottoPreviousNext("JSGChapters") }}
+</pre>
+
+<p>If you see a block of code that's more complex than the above, you will need to create a new template, move the code there, and replace the code in its previous spot with a macro calling the new template.</p>
+
+<h3 id="Finding_the_Current_Pages_Language">Finding the Current Page's Language</h3>
+
+<p>In KumaScript, the locale of the current document is exposed as an environment variable:</p>
+
+<pre class="notranslate">var lang = env.locale;
+</pre>
+
+<p>In legacy DekiScript templates, coming up with the locale was a bit harder. You'll see chunks of code like this:</p>
+
+<pre class="notranslate">/* accepts as input one required parameter: MathML element to create an xref to */
+var u = uri.parts(Page.uri);
+var lang = string.tolower(u.path[0]);
+if (string.contains(lang, "project") || string.contains(lang, "Project")) {
+  lang = string.substr(lang, 8);
+}
+/* fall back to page.language on a user page */
+else if (string.StartsWith(lang, "user:")) {
+  lang = page.language;
+}
+</pre>
+
+<p>Please replace code like the above with the new KumaScript example. The <code>env.locale</code> variable should be reliable and defined for every document.</p>
+
+<h3 id="Reading_the_contents_of_a_page_attachment">Reading the contents of a page attachment</h3>
+
+<p>You can read the contents of an attached file by using the <code>mdn.getFileContent()</code> function, like this:</p>
+
+<pre class="notranslate">&lt;%
+  var contents = mdn.getFileContent(fileUrl);
+  ... do stuff with the contents ...
+%&gt;
+</pre>
+
+<p>or</p>
+
+<pre class="notranslate">&lt;%-mdn.getFileContent(fileObject)%&gt;
+</pre>
+
+<p>In other words, you may specify either the URL of the file to read or as a file object. The file objects for a page can be accessed through the array <code>env.files</code>. So, for example, to embed the contents of the first file attached to the article, you can do this:</p>
+
+<pre class="notranslate">&lt;%-mdn.getFileContent(env.files[0])%&gt;
+</pre>
+
+<div class="note"><strong>Note:</strong> You probably don't want to try to embed the contents of a non-text file this way, as the raw contents would be injected as text. This is meant to let you access the contents of text attachments.</div>
+
+<p>If the file isn't found, an empty string is returned. There is currently no way to tell the difference between an empty file and a nonexistent one. But if you're putting empty files on the wiki, you're doing it wrong.</p>
+
+<h3 id="Localizing_template_content">Localizing template content</h3>
+
+<p>Templates cannot be translated like other wiki pages. KumaScript only looks for templates in the en-US locale (i.e., <code>/en-US/docs/Template:{name}</code>), and does not look for templates that have been translated to another locale (i.e., <code>/fr/docs/Template:{name}</code>).</p>
+
+<p>So the main way to output content tailored to the current document locale is to pivot on the value of <code>env.locale</code>. There are many ways to do this, but a few patterns are common in the conversion of legacy DekiScript templates:</p>
+
+<h4 id="Ifelse_blocks_in_KumaScript">If/else blocks in KumaScript</h4>
+
+<p>The KumaScript equivalent of this can be achieved with simple if/else blocks, like so:</p>
+
+<pre class="notranslate">&lt;% if ("fr" == env.locale) { %&gt;
+&lt;%- template("CSSRef") %&gt; « &lt;a title="Référence_CSS/Extensions_Mozilla" href="/fr/docs/Référence_CSS/Extensions_Mozilla"&gt;Référence CSS:Extensions Mozilla&lt;/a&gt;
+&lt;% } else if ("ja" == env.locale) { %&gt;
+&lt;%- template("CSSRef") %&gt; « &lt;a title="CSS_Reference/Mozilla_Extensions" href="/ja/docs/CSS_Reference/Mozilla_Extensions"&gt;CSS リファレンス:Mozilla 拡張仕様&lt;/a&gt;
+&lt;% } else if ("pl" == env.locale) { %&gt;
+&lt;%- template("CSSRef") %&gt; « &lt;a title="Dokumentacja_CSS/Rozszerzenia_Mozilli" href="/pl/docs/Dokumentacja_CSS/Rozszerzenia_Mozilli"&gt;Dokumentacja CSS:Rozszerzenia Mozilli&lt;/a&gt;
+&lt;% } else if ("de" == env.locale) { %&gt;
+&lt;%- template("CSSRef") %&gt; « &lt;a title="CSS_Referenz/Mozilla_CSS_Erweiterungen" href="/de/docs/CSS_Referenz/Mozilla_CSS_Erweiterungen"&gt;CSS Referenz: Mozilla Erweiterungen&lt;/a&gt;
+&lt;% } else { %&gt;
+&lt;%- template("CSSRef") %&gt; « &lt;a title="CSS_Reference/Mozilla_Extensions" href="/en-US/docs/CSS_Reference/Mozilla_Extensions"&gt;CSS Reference:Mozilla Extensions&lt;/a&gt;
+&lt;% } %&gt;
+</pre>
+
+<h5 id="Legacy_DekiScript"><strong>Legacy DekiScript</strong></h5>
+
+<p>A similar way this was done in DekiScript was using <code>&lt;span&gt;</code>'s with <code>lang="{locale}"</code> attributes, like so:</p>
+
+<pre class="notranslate">&lt;p&gt;&lt;span lang="*" class="lang lang-*"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="en/CSS_Reference/Mozilla_Extensions" href="/en/CSS_Reference/Mozilla_Extensions"&gt;CSS Reference:Mozilla Extensions&lt;/a&gt;&lt;/span&gt;
+&lt;span lang="en" class="lang lang-en"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="en/CSS_Reference/Mozilla_Extensions" href="/en/CSS_Reference/Mozilla_Extensions"&gt;CSS Reference:Mozilla Extensions&lt;/a&gt;
+&lt;span lang="fr" class="lang lang-fr"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="fr/Référence_CSS/Extensions_Mozilla" href="/fr/Référence_CSS/Extensions_Mozilla"&gt;Référence CSS:Extensions Mozilla&lt;/a&gt;&lt;/span&gt;
+&lt;span lang="ja" class="lang lang-ja"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="ja/CSS_Reference/Mozilla_Extensions" href="/ja/CSS_Reference/Mozilla_Extensions"&gt;CSS リファレンス:Mozilla 拡張仕様&lt;/a&gt;&lt;/span&gt;
+&lt;span lang="pl" class="lang lang-pl"&gt; &lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="pl/Dokumentacja_CSS/Rozszerzenia_Mozilli" href="/pl/Dokumentacja_CSS/Rozszerzenia_Mozilli"&gt;Dokumentacja CSS:Rozszerzenia Mozilli&lt;/a&gt;&lt;/span&gt;
+&lt;span lang="de" class="lang lang-de"&gt;&lt;span class="script"&gt;CSSRef()&lt;/span&gt; « &lt;a title="de/CSS_Referenz/Mozilla_CSS_Erweiterungen" href="/de/CSS_Referenz/Mozilla_CSS_Erweiterungen"&gt;CSS Referenz: Mozilla Erweiterungen&lt;/a&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
+</pre>
+
+<p>This is no longer supported. If you encounter templates built using the legacy DekiScript approach, revise them to use the new KumaScript pattern.</p>
+
+<p>Depending on what text editor is your favorite, you may be able to copy &amp; paste from the browser-based editor and attack this pattern with a series of search/replace regexes to get you most of the way there.</p>
+
+<p>My favorite editor is MacVim, and a series of regexes like this does the bulk of the work with just a little manual clean up following:</p>
+
+<pre class="notranslate">%s#&lt;span#^M&lt;span#g
+%s#&lt;span lang="\(.*\)" .*&gt;#&lt;% } else if ("\1" == env.locale) { %&gt;#g
+%s#&lt;span class="script"&gt;template.Cssxref(#&lt;%- template("Cssxref", [#
+%s#)&lt;/span&gt; &lt;/span&gt;#]) %&gt;
+</pre>
+
+<p>Your mileage may vary, and patterns change slightly from template to template. That's why the migration script was unable to just handle this automatically, after all.</p>
+
+<h4 id="String_variables_and_switch">String variables and switch</h4>
+
+<p>Rather than switch between full chunks of markup, you can define a set of strings, switch them based on locale, and then use them to fill in placeholders in a single chunk of markup:</p>
+
+<pre class="notranslate">&lt;%
+var s_title = 'Firefox for Developers';
+switch (env.locale) {
+    case 'de':
+        s_title = "Firefox für Entwickler";
+        break;
+    case 'fr':
+        s_title = "Firefox pour les développeurs";
+        break;
+    case 'es':
+        s_title = "Firefox para desarrolladores";
+        break;
+};
+%&gt;
+&lt;span class="title"&gt;&lt;%= s_title %&gt;&lt;/span&gt;
+</pre>
+
+<p>You'll see examples of this in legacy DekiScript templates. For the most part, this pattern should work as-is, but you may need to adjust the expected values of locales (e.g., <code>en</code>, <code>cn</code>, <code>pt</code> become <code>en-US</code>, <code>zh-CN</code>, <code>pt-PT</code> respectively).</p>
+
+<h4 id="Use_mdn.localString">Use <code>mdn.localString()</code></h4>
+
+<p>A recent addition to the <code>Template:MDN:Common</code> module is <code>mdn.localString()</code>, used like this:</p>
+
+<pre class="notranslate">&lt;%
+var s_title = mdn.localString({
+  "en-US": "Firefox for Developers",
+  "de": "Firefox für Entwickler",
+  "es": "Firefox para desarrolladores"
+});
+%&gt;
+&lt;span class="title"&gt;&lt;%= s_title %&gt;&lt;/span&gt;
+</pre>
+
+<p>This is more concise than the switch statement, and may be a better choice where a single string is concerned. However, if many strings need to be translated (e.g., as in <a class="link-https" href="/en-US/docs/Template:CSSRef" title="/en-US/docs/Template:CSSRef">CSSRef</a>), a switch statement might help keep all the strings grouped by locale and more easily translated that way.</p>
+
+<p>When the object does not have the appropriate locale, the value of "en-US" is used as the initial value.</p>
+
+<h4 id="Before_and_after_examples">Before and after examples</h4>
+
+<p>Carriage returns added here and there for clarity.</p>
+
+<pre class="notranslate">// Before: DOM0() template Dekiscript
+&lt;p&gt;&lt;span class="lang lang-en" lang="en"&gt;DOM Level 0. Not part of any standard. &lt;/span&gt;
+&lt;span class="lang lang-es" lang="es"&gt;DOM Nivel 0. No es parte de ninguna norma. &lt;/span&gt;
+&lt;span class="lang lang-*" lang="*"&gt;DOM Level 0. Not part of any standard. &lt;/span&gt;
+&lt;span class="lang lang-fr" lang="fr"&gt;DOM Level 0. Ne fait partie d'aucune spécification. &lt;/span&gt;
+&lt;span class="lang lang-ja" lang="ja"&gt;DOM Level 0。どの標準にも属しません。 &lt;/span&gt;
+&lt;span class="lang lang-pl" lang="pl"&gt;DOM Level 0. Nie jest częścią żadnego standardu. &lt;/span&gt;
+&lt;span class="lang lang-zh-cn" lang="zh-cn"&gt;DOM Level 0 不属于任何标准.&lt;/span&gt;&lt;/p&gt;
+
+// After: Kumascript version
+&lt;% if ("fr" == env.locale) { %&gt;
+&lt;p&gt;DOM Level 0. Ne fait partie d'aucune spécification.&lt;/p&gt;
+&lt;% } else if ("ja" == env.locale) { %&gt;
+&lt;p&gt;DOM Level 0。どの標準にも属しません。 &lt;/p&gt;
+&lt;% } else if ("pl" == env.locale) { %&gt;
+&lt;p&gt;DOM Level 0. Nie jest częścią żadnego standardu.&lt;/p&gt;
+&lt;% } else if ("es" == env.locale) { %&gt;
+&lt;p&gt;DOM Nivel 0. No es parte de ninguna norma.&lt;/p&gt;
+&lt;% } else if ("zh-CN" == env.locale) { %&gt;
+&lt;p&gt;DOM Level 0 不属于任何标准.&lt;/p&gt;
+&lt;% } else { %&gt;
+&lt;p&gt;DOM Level 0. Not part of any standard.&lt;/p&gt;
+&lt;% } %&gt;</pre>
+
+<pre class="notranslate">// From ReleaseChannelInfo() template
+// Before:
+web.html("&lt;p&gt;Firefox " + $0 + ", based on Gecko " + $1 + ", will ship in " + $2 + ".
+ This article provides information about the changes in this release that will
+ affect developers. Nightly builds of what will become Firefox " + $0 + " are "
+  + web.link(url, "currently available") + " on the " + string.ToUpperFirst($3)
+  + " channel.&lt;/p&gt;");
+
+// After:
+&lt;p&gt;Firefox &lt;%= $0 %&gt;, based on Gecko &lt;%= $1 %&gt;, will ship in &lt;%= $2 %&gt;. This
+ article provides information about the changes in this release that will
+ affect developers. Nightly builds of what will become Firefox &lt;%= $0 %&gt;
+ are &lt;%- web.link(url, "currently available")%&gt;  on the
+ &lt;%= string.ToUpperFirst($3) %&gt; channel.&lt;/p&gt;</pre>
+
+<pre class="notranslate">// Before: old Dekiscript snippet
+if ($1 &amp;&amp; string.length($1)) {
+  optionsText = optionsText + "&lt;li&gt;" + LXRSearch("ident", "i", $1) + "&lt;/li&gt;";
+}
+
+// After: new Kumascript. Quote parameters to template() unless it is an arg variable (like $1).
+if ($1 &amp;&amp; string.length($1)) {
+    optionsText = optionsText + "&lt;li&gt;" + template("LXRSearch", ["ident", "i", $1]) + "&lt;/li&gt;";
+}
+
+// Note that template() within &lt;% ... %&gt; outputs nothing directly. If you want to call another
+// template and display its output, use &lt;%= %&gt; or &lt;%- %&gt; like this:
+&lt;%- template("LXRSearch", ["ident", "i", $1]) %&gt;</pre>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Project:Getting_started_with_Kuma" title="Getting started with Kuma">Getting started with Kuma</a></li>
+ <li><a href="/en-US/docs/Project:KumaScript_reference" title="Project:en/KumaScript reference">KumaScript reference</a></li>
+ <li><a class="link-https" href="https://wiki.mozilla.org/MDN/Kuma" title="https://wiki.mozilla.org/MDN/Kuma">Kuma wiki</a></li>
+</ul>
diff --git a/files/es/mdn/tools/page_regeneration/index.html b/files/es/mdn/tools/page_regeneration/index.html
deleted file mode 100644
index cdc6fbd699..0000000000
--- a/files/es/mdn/tools/page_regeneration/index.html
+++ /dev/null
@@ -1,32 +0,0 @@
----
-title: Renderizado de páginas en MDN
-slug: MDN/Tools/Page_regeneration
-translation_of: MDN/Tools/Page_regeneration
----
-<div>{{MDNSidebar}}</div>
-
-<p>El sitio MDN almacena en caché las páginas para que el usuario obtenga un mejor rendimiento. Como resultado, los cambios que guarde en una página podrían no aparecer la próxima vez que vuelva a cargar la página. A menudo, pero no siempre, aparece un banner en la página que indica que hay una actualización de la página en proceso. Puede hacer una "recarga forzada" (Shift + F5) en su navegador para volver a cargar la página desde el servidor, pero esto puede no tener efecto si la actualización en el servidor no se ha completado.</p>
-
-<p>Algunas páginas (especialmente las páginas de destino) usan macros para generar y actualizar automáticamente su contenido. Para las páginas de destino, esto asegura que los nuevos artículos se enumeren automáticamente en la página, sin que un escritor tenga que agregarlos manualmente. Esta es útil para los contribuyentes de mucho tiempo, y ayuda a los recién llegados a evitar que su trabajo se pierda en la confusión porque no sabían cómo vincular sus artículos en la jerarquía del sitio.</p>
-
-<p>Esto también se puede usar cuando se transmite contenido de una página a otras páginas (usando, por ejemplo, la macro {{TemplateLink ("Página")}}).</p>
-
-<p>Debido a que el caché de MDN almacena el contenido renderizado para mejorar el rendimiento, los cambios realizados en el material de origen (como salida de macro o páginas transcluidas) no se reflejan automáticamente en la página. Si espera cambios frecuentes en dichos materiales de origen, puede considerar habilitar la regeneración automática de su página.</p>
-
-<p>Siga los siguientes pasos para habilitar la regeneración automática:</p>
-
-<ol>
- <li>Cambia el idioma del editor a inglés.</li>
- <li>Haga clic en el botón <em><strong>Edit</strong> </em>en la página para ingresar al modo de edición.</li>
- <li>Debajo del título de la página, haga clic en <em><strong>Edit page title and properties</strong></em> ubicados cerca del título de la página. Aparecen los campos de metadatos de la página.</li>
- <li>Establezca un valor para <em><strong>Rendering max age</strong></em> . Este valor determina la cada cuánto tiempo se reconstruye la página en caché, incluida la ejecución de sus macros. Por lo general, usamos 4 u 8 por defecto. Para una tecnología cuya documentación está cambiando rápidamente, puede elegir un número más bajo.</li>
- <li>Guarda tus cambios en la página. Es una buena práctica hacer un comentario de revisión que describa lo que hiciste, como "Establecer la Rendering max age en 4 horas".</li>
-</ol>
-
-<p>La página se regenerará automáticamente en el horario que especificó.</p>
-
-<div class="note">
-<p>Nota: La opción <em>Edit page title and properties</em> no está disponible al crear una nueva página; tendrás que volver a abrir el editor después de tu primer guardado.</p>
-
-<p>La opción <em>Edit page title and properties</em> no está disponible de momento en otros idiomas que no sean inglés.</p>
-</div>
diff --git a/files/es/mdn/tools/template_editing/index.html b/files/es/mdn/tools/template_editing/index.html
deleted file mode 100644
index 0edab22e95..0000000000
--- a/files/es/mdn/tools/template_editing/index.html
+++ /dev/null
@@ -1,14 +0,0 @@
----
-title: Edición de plantillas
-slug: MDN/Tools/Template_editing
-tags:
-  - Guía
-  - Herramientas
-  - MDN Meta
-  - Privilegios
-  - Roles(2)
-translation_of: MDN/Tools/Template_editing
----
-<div>{{MDNSidebar}}</div><p>En MDN, las plantillas escritas en <a href="/en-US/docs/MDN/Contribute/Tools/KumaScript">KumaScript</a> son usadas para automatizar la generación de contenido y la personalización de las páginas. Cada plantilla es un archivo separado <a href="https://github.com/mozilla/kumascript/tree/master/macros">del directorio de macros del repositorio GitHub KumaScript</a>.</p>
-
-<p><span class="seoSummary">Cualquiera que edite páginas wiki de MDN puede invocar plantillas utilizando <a href="/en-US/docs/MDN/Contribute/Structures/Macros">macros</a> en los artículos MDN.  Cuaquiera puede crear y editar plantillas vía <a href="https://github.com/mozilla/kumascript">el repositorio GitHub KumaScript GitHub</a> usando prácticas open-source estándar (bifurcando el repositorio, creando una rama, haciendo tus cambios, y enviando una petición de incorporación de cambios para revisión). </span>Ten en cuenta que enviar una petición de incorporación de cambios es actualmente la única forma de actualizar cadenas traducidas en las plantillas que las contienen.</p>
diff --git a/files/es/mdn/user_guide/index.html b/files/es/mdn/user_guide/index.html
deleted file mode 100644
index 7703e98dd1..0000000000
--- a/files/es/mdn/user_guide/index.html
+++ /dev/null
@@ -1,14 +0,0 @@
----
-title: MDN user guide
-slug: MDN/User_guide
-tags:
-  - Documentation
-  - Landing
-  - MDN
-  - NeedsTranslation
-  - TopicStub
-translation_of: MDN/Tools
-translation_of_original: MDN/User_guide
----
-<div>{{MDNSidebar}}</div><p>The Mozilla Developer Network site is an advanced system for finding, reading, and contributing to documentation and sample code for Web developers (as well as for Firefox and Firefox OS developers). The MDN user guide provides articles detailing how to use MDN to find the documentation you need, and, if you wish, how to help make the material better, more expansive, and more complete.</p>
-<p>{{SubpagesWithSummaries}}</p>
diff --git a/files/es/mdn/yari/index.html b/files/es/mdn/yari/index.html
new file mode 100644
index 0000000000..894f384fc1
--- /dev/null
+++ b/files/es/mdn/yari/index.html
@@ -0,0 +1,56 @@
+---
+title: Kuma
+slug: MDN/Yari
+translation_of: MDN/Kuma
+original_slug: MDN/Kuma
+---
+<div>{{MDNSidebar}}</div>
+
+<p>Kuma es la plataforma wiki que impulsa Mozilla Developer Network. Es una plataforma open source escrita en <a href="http://www.python.org/" title="http://www.python.org/">Python</a> usando el framework <a href="https://www.djangoproject.com/" title="https://www.djangoproject.com/">Django</a>.</p>
+
+<div class="row topicpage-table">
+<div class="section">
+<h2 class="Documentation" id="Documentation" name="Documentation">Documentación de Kuma</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Project:MDN/Kuma/API" title="/en-US/docs/Project:About">The Kuma API</a></dt>
+ <dd>Kuma provee una API simple que te permite acceder a la información sobre las páginas e incluso para poner nuevo contenido en las páginas.</dd>
+ <dt><a href="/en-US/docs/Project:Introduction_to_KumaScript" title="/en-US/docs/Project:Introduction_to_KumaScript">Introducción a KumaScript</a>:</dt>
+ <dd>...el lenguaje de plantillas de Kuma.</dd>
+ <dt><a href="/en-US/docs/Project:MDN/Kuma/KumaScript_guide" title="/en-US/docs/Project:MDN/Kuma/KumaScript_guide">Usando KumaScript y las plantillas</a></dt>
+ <dd>Una guía de cómo usar las plantillas KumaScript en el contenido del artículo.</dd>
+ <dt><a href="/en-US/docs/Project:MDN/Kuma/KumaScript_reference" title="/en-US/docs/Project:MDN/Kuma/KumaScript_reference">Referencia KumaScript</a></dt>
+ <dd>Una referencia a KumaScript.</dd>
+ <dt><a href="/en-US/docs/Project:MDN/Kuma/Contributing" style="line-height: 1.5; font-weight: bold;" title="/en-US/docs/Project:MDN/Kuma/Contributing">Contribuyendo a Kuma</a></dt>
+ <dd>Una guía para forkear Kuma y contribuir al proyecto.</dd>
+</dl>
+
+<p>Artículos antiguos para clasificar:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Project:Getting_started_with_Kuma" title="/en-US/docs/Project:Getting_started_with_Kuma">Iniciando con Kuma</a>: información sobre la plataforma; diferencias entre Kuma y la plataforma Mindtouch Deki.</li>
+ <li><a href="/en-US/docs/Project:MDC_editor_guide" title="/en-US/docs/Project:MDC_editor_guide">La interfaz de edición de MDN</a>: atajos de teclado; Descripción de los componentes de la interfaz y las funciones.</li>
+</ul>
+
+<p><span class="alllinks"><a href="/en-US/docs/tag/Kuma" title="MDN project pages">Ver todos...</a></span></p>
+</div>
+
+<div class="section">
+<h2 id="Herramientas_y_tareas">Herramientas y tareas</h2>
+
+<dl>
+ <dt><a href="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936" title="https://bugzilla.mozilla.org/buglist.cgi?cmdtype=dorem&amp;remaction=run&amp;namedcmd=mdn-backlog&amp;sharer_id=416309&amp;list_id=6206936">Bugs</a></dt>
+ <dd>Una lista de los bugs de Kuma. Sientase libre para buscar lo que quiera y lo que quieras arreglas! <em>Este link requiere que entres en Bugzilla con su respectiva cuenta.</em></dd>
+ <dt><a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Mozilla%20Developer%20Network" title="https://bugzilla.mozilla.org/enter_bug.cgi?product=Mozilla%20Developer%20Network">Reportar un bug</a></dt>
+ <dd>Si usted tiene un problema con Kuma, o tiene una idea para hacerlo mejor, <span style="color: #545454; font-family: arial,sans-serif; font-size: small; line-height: 18.200000762939453px;">¡</span><span style="line-height: 1.5;">tú puedes reportar un bug!</span></dd>
+ <dt><a href="/en-US/docs/Project:MDN/Kuma/Changelog" title="/en-US/docs/Project:MDN/Kuma/Changelog">Cambios</a></dt>
+ <dd>Una lista de los cambios recientes; este es un buen lugar para ver qué ha pasado recientemente.</dd>
+ <dt><a href="http://mzl.la/mdn_whats_deployed">¿Qué ha sido implementado?</a></dt>
+ <dd>Un tablero de estado de qué ha sido implementado al servidor de producción.</dd>
+ <dt><a href="https://mdn.kanbanery.com/projects/32137/board/?key=0383ba5f05e165e0eb19d8476654fe9775ce2ca7" title="https://mdn.kanbanery.com/projects/32137/board/?key=0383ba5f05e165e0eb19d8476654fe9775ce2ca7">Kanban board</a></dt>
+ <dd>The Kanban board used for managing ongoing work on the Kuma project.</dd>
+ <dt><a href="/en-US/docs/Project:MDN/ServerCharts">Server Monitoring</a></dt>
+ <dd>Some of our New Relic charts</dd>
+</dl>
+</div>
+</div>
diff --git a/files/es/mdn_en_diez/index.html b/files/es/mdn_en_diez/index.html
deleted file mode 100644
index 0e48e9e6ba..0000000000
--- a/files/es/mdn_en_diez/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: MDN en 10
-slug: MDN_en_diez
-tags:
-  - MDN
-translation_of: MDN_at_ten
----
-<div class="summary">Celebra 10 años documentando tu Web.</div>
-
-<div class="column-container">
-<div class="column-8">
-<h2 id="La_historia_de_MDN_(Mozilla_Developers_Network)">La historia de MDN (Mozilla Developers Network)</h2>
-
-<p>A principios de 2005 , un grupo pequeño de idealistas se propuso a crear una nueva, libre, comunidad en línea de recursos para todos los desarrolladores Web. Su brillante pero poco excentrica idea se convirtió en la actual Mozilla Developer Network (MDN) - el principal recurso para todas las tecnologías Web abiertas. Diez años más tarde, nuestra comunidad mundial es más grande que nunca, y juntos todavía estamos creando documentación , código de ejemplo y recursos de aprendizaje para todas las tecnologías Web abiertas, incluyendo CSS , HTML , JavaScript y todo lo demás que hace que la web abierta tan poderoso como lo es.</p>
-
-<p><a class="learnmore" href="/en-US/docs/MDN_at_ten/History_of_MDN">Aprende más<span class="offscreen">about the history</span></a></p>
-
-
-<h2 id="Contribuyendo_a_MDN">Contribuyendo a MDN</h2>
-
-<p>Por diez años, la comunidad MDN ha estado documentando la Web abierta. Desde la reparación de los errores tipográficos simples hasta escribir suites completas de una nueva API, todo el mundo tiene algo que ofrecer y ninguna contribución es demasiado grande o demasiado pequeño. Contamos con más de 90.000 páginas de contenido que se han escrito o traducidos por miembros de nuestra destacada comunidad de Mozillians . Tú puedes ser uno de ellos.</p>
-
-<p><a class="learnmore" href="/en-US/docs/MDN_at_ten/Contributing_to_MDN">Aprende más<span class="offscreen">about contributing</span></a></p>
-
-<p> </p>
-
-<p> </p>
-</div>
-
-<div class="column-4">{{TenthCampaignQuote}}</div>
-
-<h2 id="Subnav">Subnav</h2>
-
-<ol>
- <li><a href="/en-US/docs/MDN_at_ten/">MDN en 10</a></li>
- <li><a href="/en-US/docs/MDN_at_ten/History_of_MDN">La historia de MDN</a></li>
- <li><a href="/en-US/docs/MDN_at_ten/Contributing_to_MDN">Contribuyendo a MDN</a></li>
-</ol>
-</div>
diff --git a/files/es/mejoras_dom_en_firefox_3/index.html b/files/es/mejoras_dom_en_firefox_3/index.html
deleted file mode 100644
index dcc39ab4a6..0000000000
--- a/files/es/mejoras_dom_en_firefox_3/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: Mejoras DOM en Firefox 3
-slug: Mejoras_DOM_en_Firefox_3
-tags:
-  - DOM
-  - Firefox 3
-  - Todas_las_Categorías
-translation_of: Mozilla/Firefox/Releases/3/DOM_improvements
----
-<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Firefox 3 ofrece una serie de mejoras sobre el <a href="es/DOM">Modelo de Objetos del Documento (DOM)</a>, especialmente en lo que se refiere a la implementación de extensiones de DOM añadidas por otros navegadores. Este artículo proporciona una lista de estas mejoras, además de enlaces a documentación más detallada.</p>
-
-<ul>
- <li>Ahora se implementan las extensiones de DOM <code><a href="es/DOM/element.clientTop">clientTop</a></code> y <code><a href="es/DOM/element.clientLeft">clientLeft</a></code> de Internet Explorer.</li>
- <li>La propiedad <code><a href="es/DOM/window.fullScreen">window.fullScreen</a></code> ahora es siempre exacta, sin importar donde sea leída, incluso en el contenido. Previamente devolvía <code>false</code> erróneamente ({{ Bug(127013) }}).</li>
- <li>Ahora se implementan las extensiones de DOM <code><a href="es/DOM/element.getClientRects">getClientRects</a></code> y <code><a href="es/DOM/element.getBoundingClientRect">getBoundingClientRect</a></code> ({{ Bug(174397) }}).</li>
- <li>Se implementa la extensión de DOM <code><a href="es/DOM/document.elementFromPoint">elementFromPoint</a></code> de Internet Explorer ({{ Bug(199692) }}).</li>
- <li>Ahora se implementan las extensiones de DOM <code><a href="es/DOM/element.oncut">oncut</a></code>, <code><a href="es/DOM/element.oncopy">oncopy</a></code>, <code><a href="es/DOM/element.onpaste">onpaste</a></code>, <code><a href="es/DOM/element.onbeforecut">onbeforecut</a></code>, <code><a href="es/DOM/element.onbeforepaste">onbeforecopy</a></code> y <code><a href="es/DOM/element.onbeforepaste">onbeforepaste</a></code> de Internet Explorer ({{ Bug(280959) }}).</li>
- <li>Se han añadido capturadores para <code>Node.nodePrincipal</code>, <code>Node.baseURIObject</code>, y <code><a href="es/DOM/document.documentURIObject">document.documentURIObject</a></code> sólo para código con privilegios. El código Chrome no debe tocar (recuperar o fijar) estas propiedades en objetos de contenido sin envoltorios (por ejemplo, sobre un <code>wrappedJSObject</code> de un <code><a href="es/XPCNativeWrapper">XPCNativeWrapper</a></code>), ver {{ Bug(324464) }} para más detalles.</li>
-</ul>
-
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
-
-<ul>
- <li><a href="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
- <li><a href="es/Mejoras_CSS_en_Firefox_3">Mejoras CSS en Firefox 3</a></li>
- <li><a href="es/DOM">DOM</a></li>
-</ul>
-
-<p> </p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "en": "en/DOM_improvements_in_Firefox_3", "fr": "fr/Am\u00e9liorations_DOM_dans_Firefox_3", "ja": "ja/DOM_improvements_in_Firefox_3", "pl": "pl/Poprawki_DOM_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/mejoras_svg_en_firefox_3/index.html b/files/es/mejoras_svg_en_firefox_3/index.html
deleted file mode 100644
index 701a6640f8..0000000000
--- a/files/es/mejoras_svg_en_firefox_3/index.html
+++ /dev/null
@@ -1,62 +0,0 @@
----
-title: Mejoras SVG en Firefox 3
-slug: Mejoras_SVG_en_Firefox_3
-tags:
-  - Firefox 3
-  - SVG
-  - Todas_las_Categorías
-translation_of: Mozilla/Firefox/Releases/3/SVG_improvements
----
-<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Firefox 3 ofrece una mejor implementación de <a href="es/SVG">Gráficos Vectoriales Escalables (SVG)</a> en comparación con versiones anteriores de Firefox. Aunque estas características están documentadas en otros sitios, este artículo puede servir como una lista que indique fácilmente qué características se han añadido en Firefox 3.</p>
-
-<ul>
- <li>Se ha implementado el elemento <code>foreignObject</code> ({{ Bug(326966) }}). Vea la <a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">especificación</a> o <a class="external" href="http://weblogs.mozillazine.org/roc/archives/2006/06/the_future_is_now.html">este artículo</a> para más detalles.</li>
- <li>Implementado el elemento <code>pattern</code> (<a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">especificación</a>).</li>
- <li>Implementado el elemento <code>mask</code> (<a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">especificación</a>).</li>
- <li>Implementados nuevos filtros (<a class="external" href="http://www.w3.org/TR/SVG11/filters.html">especificación</a>):
-  <ul>
-   <li><code>filter</code></li>
-   <li><code>feDistantLight</code></li>
-   <li><code>fePointLight</code></li>
-   <li><code>feSpotLight</code></li>
-   <li><code>feBlend</code></li>
-   <li><code>feColorMatrix</code></li>
-   <li><code>feConvolveMatrix</code></li>
-   <li><code>feComponentTransfer</code>, <code>feFuncR</code>, <code>feFuncG</code>, <code>feFuncB</code>, <code>feFuncA</code></li>
-   <li><code>feComposite</code></li>
-   <li><code>feConvolveMatrix</code></li>
-   <li><code>feDiffuseLighting</code></li>
-   <li><code>feDistantLight</code></li>
-   <li><code>feFlood</code></li>
-   <li><code>feGaussianBlur</code></li>
-   <li><code>feMerge</code>, <code>feMergeNode</code></li>
-   <li><code>feMorphology</code></li>
-   <li><code>feOffset</code></li>
-   <li><code>fePointLight</code></li>
-   <li><code>feSpecularLighting</code></li>
-   <li><code>feTurbulence</code></li>
-   <li><code>feTile</code></li>
-  </ul>
- </li>
- <li>Se han arreglado varios fallos en la manipulación del elemento <code>&lt;a&gt;</code> en SVG; ver {{ Bug(267664) }}, {{ Bug(268135) }}, {{ Bug(316248) }}, {{ Bug(317270) }} y {{ Bug(320724) }}.</li>
- <li>Se han implementado los métodos de DOM en SVG <code>getNumberOfChars()</code>, <code>getComputedTextLength()</code>, <code>getSubStringLength()</code>, <code>getStartPositionOfChar()</code>, <code>getEndPositionOfChar()</code>, <code>getRotationOfChar()</code> y <code>getCharNumAtPosition()</code>.</li>
- <li>Implementación del atributo <code>xml:space</code> (<a class="external" href="http://www.w3.org/TR/SVG/text.html#WhiteSpace">especificación</a>).</li>
- <li>Se ha implementado el comportamiento por defecto de <code>fill</code>/<code>stroke</code> (<a class="external" href="http://www.w3.org/TR/SVG/painting.html#SpecifyingPaint">especificación</a>).</li>
- <li>Se implementan ya las unidades <code>em</code> y <code>ex</code> para indicar longitudes ({{ Bug(305859) }}).</li>
-</ul>
-
-<h3 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h3>
-
-<ul>
- <li><a href="es/SVG">SVG</a></li>
- <li><a href="es/SVG_en_Firefox">SVG en Firefox</a></li>
- <li><a href="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
-</ul>
-
-<p> </p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "en": "en/SVG_improvements_in_Firefox_3", "fr": "fr/Am\u00e9liorations_SVG_dans_Firefox_3", "ja": "ja/SVG_improvements_in_Firefox_3", "pl": "pl/Poprawki_SVG_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/mejoras_xul_en_firefox_3/index.html b/files/es/mejoras_xul_en_firefox_3/index.html
deleted file mode 100644
index e649db326a..0000000000
--- a/files/es/mejoras_xul_en_firefox_3/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: Mejoras XUL en Firefox 3
-slug: Mejoras_XUL_en_Firefox_3
-tags:
-  - Firefox 3
-  - Todas_las_Categorías
-  - XUL
-translation_of: Mozilla/Firefox/Releases/3/XUL_improvements_in_Firefox_3
----
-<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Firefox 3 proporciona varios nuevos elementos <a href="/es/XUL" title="es/XUL">XUL</a>, además de mejoras en los elementos existentes. Aún que este material se documenta en detalle en otro lugar, este artículo ofrece una buena lista de estas mejoras así como enlaces a la documentación detallada.</p>
-
-<p> </p>
-
-<h3 id="Los_nuevos_elementos" name="Los_nuevos_elementos">Los nuevos elementos</h3>
-
-<ul>
- <li><a href="/es/Tutorial_de_XUL/Controles_numéricos" title="es/Tutorial_de_XUL/Controles_numéricos">Los controles numéricos</a>:
-
-  <ul>
-   <li>El elemento <code><a href="/es/XUL/scale" title="es/XUL/scale">&lt;scale&gt;</a></code> permite crear escalas deslizantes que dejan al usuario seleccionar cualquier valor dentro de un rango especificado. Este control podría utilizarse, por ejemplo, para crear un control de volumen.</li>
-   <li>El valor <code>number</code> para el atributo <code>type</code> de cajas de texto (<code>textbox</code>) crea una caja de texto donde sólo se pueden introducir números. Además, aparecen botones de flecha en un lateral que permiten incrementar o disminuir los valores. {{ interwiki('wikimo', 'XUL:Specs:NumberBox', 'Más información sobre cajas de texto numérico') }}. {{ Bug(345510) }}</li>
-   <li>El elemento <code><a href="/es/XUL/spinbuttons" title="es/XUL/spinbuttons">&lt;spinbuttons&gt;</a></code>, que puede usarse para crear controles con la ayuda de vínculos XBL. {{ Bug(155053) }}</li>
-   <li>Los controles, <code><a href="/es/XUL/datepicker" title="es/XUL/datepicker">&lt;datepicker&gt;</a></code> y <code><a href="/es/XUL/timepicker" title="es/XUL/timepicker">&lt;timepicker&gt;</a></code> sirven para permitir entradas de fecha y hora. El seleccionador de fecha está disponible en varios estilos según el atributo <code>type</code> y permite entradas vía cajas de texto o de un calendario. {{ interwiki('wikimo', 'XUL:Specs:DateTimePickers', 'Más información sobre seleccionadores de fecha (en)') }} <a href="/es/XUL/datepicker" title="es/XUL/datepicker">Referencia de seleccionadores de fecha</a> <a href="/es/XUL/timepicker" title="es/XUL/timepicker">Referencia de seleccionadores de hora</a></li>
-  </ul>
- </li>
- <li>Hay una <a href="/es/XUL/Guía_de_popup" title="es/XUL/Guía_de_popup">guía</a> sobre menús y elementos emergentes que describe las nuevas funciones disponibles.
-  <ul>
-   <li>El elemento <code><a href="/es/XUL/dropmarker" title="es/XUL/dropmarker">&lt;dropmarker&gt;</a></code> es útil para crear, con vínculos XBL, controles de estilo de menú. ({{ Bug(348614) }})</li>
-   <li>El elemento <code><a href="/es/XUL/panel" title="es/XUL/panel">&lt;panel&gt;</a></code> está diseñado para elementos emergentes que no son menús. Pueden albergar cualquier tipo de contenido. Para menús se debería utilizar el elemento &lt;menupopup&gt;. Los menús permiten la navegación mediante el teclado y apertura/cierre de sub-menús.</li>
-  </ul>
- </li>
-</ul>
-
-<p> </p>
-
-<h3 id="Las_mejoras" name="Las_mejoras">Las mejoras</h3>
-
-<h4 id="en_los_.C3.A1rboles" name="en_los_.C3.A1rboles">en los árboles</h4>
-
-<ul>
- <li>Los árboles pueden desplazarse horizontalmente ahora. Si las columnas no caben dentro del ancho disponible, aparece una barra de desplazamiento horizontal. Esto ocurre si el ancho de las columnas especificado suma más que el espacio disponible. Ver {{ Bug(212789) }} para más detalles.</li>
- <li>Un nuevo estilo de selección permite seleccionar celdas individualmente, en lugar de filas enteras. Para usar este estilo de selección, se fijará el atributo <code>seltype</code> de los árboles como <code>cell</code>. ({{ Bug(296040) }})</li>
- <li>Los árboles admiten la edición de celdas individuales. Cuando el usuario hace doble clic en una celda, aparece un campo de texto donde puede editar los contenidos de la celda. Ver {{ interwiki('wikimo', 'XUL:Tree', 'estas notas') }} para más detalles. ({{ Bug(201499) }})</li>
- <li>Los elementos &lt;treecol&gt; admiten ahora un atributo <code>overflow</code>, que puede definirse como verdadero para permitir que el texto de las celdas de esa columna se expanda a las celdas vecinas vacías, si el texto es demasiado largo para caber en esa única celda.</li>
-</ul>
-
-<h4 id="de_los_men.C3.BAs" name="de_los_men.C3.BAs">de los menús</h4>
-
-<ul>
- <li>El atributo <code>image</code> se usa ahora consistentemente para definir imágenes.</li>
- <li>Las listas de menú lanzan el evento <code>select</code> cuando se selecciona un elemento.</li>
- <li>Las propiedades <code>inputField</code> y <code>editable</code> han sido añadidas a la lista de menú.</li>
- <li>El elemento &lt;menu&gt; tiene métodos para añadir, insertar y eliminar elementos de menú. ({{ Bug(372552) }})</li>
- <li>Los elementos <code>&lt;menu&gt;</code>, <code>&lt;menuitem&gt;</code> y <code>&lt;menuseparator&gt;</code>:
-  <ul>
-   <li>tienen la propiedad <code>selected</code>, de sólo lectura, que indica si el elemento está seleccionado en una &lt;menulist&gt;.</li>
-   <li>tienen la propiedad <code>control</code>, de sólo lectura, que devuelve la &lt;menulist&gt; rodeada.</li>
-   <li>admiten las propiedades <code>accessKey</code>, <code>disabled</code>, <code>crop</code>, <code>image</code> y <code>label</code> que definen el atributo correspondiente.</li>
-  </ul>
- </li>
- <li>La propiedad <code>editor</code> permite obtener la interfaz {{ Interface("nsIEditor") }} interna para el campo de texto de un elemento <code>menulist</code> modificable.</li>
- <li>Los menús pueden mostrarse transparentes en las plataformas que lo permiten. ({{ Bug(70798) }})</li>
-</ul>
-
-<h4 id="en_las_cajas_de_texto" name="en_las_cajas_de_texto">en las cajas de texto</h4>
-
-<ul>
- <li>Definir el atributo <code>spellcheck</code> de una <a href="/es/XUL/textbox" title="es/XUL/textbox">caja de texto</a> a '<code>true</code>' activará la comprobación ortográfica integrada en esa caja de texto. ({{ Bug(346787) }})</li>
- <li>La <code>&lt;textbox&gt;</code> tiene el método <code>reset()</code> para reiniciar el valor de una caja de texto a su valor predeterminado. La propiedad <code>defaultValue</code> se usará para obtener y modificar el valor por defecto de la caja de texto. ({{ Bug(312867) }})</li>
- <li>Se ofrece la propiedad <code>editor</code> que permite obtener la interfaz {{ Interface("nsIEditor") }} interna del campo de texto.({{ Bug(312867) }})</li>
- <li>La <code><a href="/es/XUL/textbox" title="es/XUL/textbox">caja de texto</a></code> admite el atributo <code>newlines</code> que especifica cómo se tratarán los saltos de linea en el texto pegado. {{ Bug(253481) }}. Los posibles valores son:
-  <ul>
-   <li><code>pasteintact</code> - pega todo tal cual está</li>
-   <li><code>pastetofirst</code> - (valor por defecto) pega sólo hasta el primer salto de linea</li>
-   <li><code>replacewithspaces</code> - reemplaza los saltos de linea por espacios</li>
-   <li><code>replacewithcommas</code> - reemplaza los saltos de linea con comas</li>
-   <li><code>strip</code> - elimina todos los saltos de linea</li>
-   <li><code>stripsurroundingwhitespace</code> - elimina todos los saltos de linea y los espacios vacíos cercanos</li>
-  </ul>
- </li>
-</ul>
-
-<h3 id="Otras_mejoras" name="Otras_mejoras">Otras mejoras</h3>
-
-<ul>
- <li>El atributo <code>type</code> de un <code>&lt;button&gt;</code> se fijará a <code>repeat</code> para crear botones que ejecuten el evento asociado mientras se mantiene pulsado con el ratón.</li>
- <li>El atributo <code><a href="/es/XUL/Atributos/buttondisabledaccept" title="es/XUL/Atributos/buttondisabledaccept">buttondisabledaccept</a></code> puede usarse en el elemento <code>&lt;dialog&gt;</code> para tener el botón aceptar (OK) inicialmente desactivado.</li>
- <li>El elemento <code>&lt;titlebar&gt;</code> admite el atributo <code>allowevents</code> que permite pasar eventos a los hijos de la barra de título.</li>
- <li>El <code>&lt;splitter&gt;</code> admite el valor adicional <code>'both'</code> para el atributo <code>collapse</code>, que indica que el separador puede colapsar elementos en ambos lados cuando se arrastra. El atributo <code>substate</code> se fijará a antes o después cuando uno es colapsado. ({{ Bug(337955) }})</li>
- <li>El elemento <code>&lt;richlistbox&gt;</code> permite selección múltiple. Se fijará el atributo <code>seltype</code> a <code>'multiple'</code> para activarlo.</li>
- <li>El elemento <code>&lt;radio&gt;</code> tiene un atributo <code>group</code> que puede definir la (id) identificación de un elemento <code>&lt;radiogroup&gt;</code> al cual pertenece el botón de selección. Esto permite organizar los botones de selección, de una manera que quizás no sea conveniente, al colocarlos dentro de un grupo de selección.</li>
- <li>Los métodos <code>openPopup()</code> y <code>openPopupAtScreen()</code> son admitidos por menús, paneles y títulos emergentes. Estos métodos deberían utilizarse en lugar de <code>showPopup()</code> que ha generado confusiones en su uso.</li>
- <li>Se ha mejorado la gestión del elemento &lt;key&gt; (tecla) para los usuarios de teclados no latino. Ver el evento de tecla de Gecko.</li>
- <li>En Mac OS X, los atributos 'activetitlebarcolor' y 'inactivetitlebarcolor' de los elementos raiz (&lt;window&gt;, &lt;dialog&gt;, &lt;prefwindow&gt; and &lt;wizard&gt;) son accesibles para personalizar el color de la barra de títulos de la pantalla.</li>
-</ul>
-
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
-
-<ul>
- <li><a href="/es/XUL" title="es/XUL">XUL</a></li>
-</ul>
-
-<p> </p>
-
-<p> </p>
-
-<p>{{ languages( { "en": "en/XUL_improvements_in_Firefox_3", "fr": "fr/Am\u00e9liorations_XUL_dans_Firefox_3", "ja": "ja/XUL_improvements_in_Firefox_3", "pl": "pl/Poprawki_XUL_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/migrar_aplicaciones_desde_internet_explorer_a_mozilla/index.html b/files/es/migrar_aplicaciones_desde_internet_explorer_a_mozilla/index.html
deleted file mode 100644
index 39b9197fd1..0000000000
--- a/files/es/migrar_aplicaciones_desde_internet_explorer_a_mozilla/index.html
+++ /dev/null
@@ -1,1067 +0,0 @@
----
-title: Migrar aplicaciones desde Internet Explorer a Mozilla
-slug: Migrar_aplicaciones_desde_Internet_Explorer_a_Mozilla
-tags:
-  - Desarrollo_Web
-  - Todas_las_Categorías
----
-<h3 id="Introducci.C3.B3n" name="Introducci.C3.B3n">Introducción</h3>
-<p>Cuando Netscape comenzó con el navegador Mozilla, lo hizo con la decisión consciente de soportar los estándares del W3C. Como resultado, Mozilla no es totalmente compatible hacia atrás con el código heredado de Netscape Navigator 4.x ni de Microsoft Internet Explorer. Por ejemplo, Mozilla no soporta la etiqueta <code>&lt;layer&gt;</code> como se verá más adelante. Los navegadores como Internet Explorer 4 fueron construidos antes de la concepción de los estándares del W3C heredando muchos de sus extraños comportamientos. En este articulo se describirán las idiosincrasias de Mozilla que hacen que haya una fuerte compatibilidad del HTML hacia atrás con Internet Explorer y otros navegadores antiguos.</p>
-<p>También se repasarán las tecnologías no estandarizadas soportadas por Mozilla, como el XMLHttpRequest y la edición de texto enriquecido, dado que existen sus equivalentes existentes en el W3C y que se incluyen en:</p>
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/html401/">HTML 4.01</a>, <a class="external" href="http://www.w3.org/TR/xhtml1/">XHTML 1.0</a> y <a class="external" href="http://www.w3.org/TR/xhtml11/">XHTML 1.1</a></li>
- <li>Hojas de estilo en cascada (CSS): <a class="external" href="http://www.w3.org/TR/REC-CSS1">CSS nivel 1</a>, <a class="external" href="http://www.w3.org/TR/CSS21/">CSS nivel 2.1</a> y parte del <a class="external" href="http://www.w3.org/Style/CSS/current-work.html">CSS nivel 3</a></li>
- <li>Modelo de objetos de documento (DOM): <a class="external" href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/">DOM nivel 1</a>, <a class="external" href="http://www.w3.org/DOM/DOMTR#dom2">DOM nivel 2</a> y parte del <a class="external" href="http://www.w3.org/DOM/DOMTR#dom3">DOM nivel 3</a></li>
- <li>Lenguaje de etiquetado matemático (MathML): <a class="external" href="http://www.w3.org/Math/">MathML versión 2.0</a></li>
- <li>Lenguaje de etiquetado ampliable (XML): <a class="external" href="http://www.w3.org/TR/REC-xml">XML 1.0</a>, <a class="external" href="http://www.w3.org/TR/REC-xml-names/">Espacios de nombres en XML</a>, <a class="external" href="http://www.w3.org/TR/xml-stylesheet/">Asociando hojas de estilos con documentos XML 1.0</a>, <a class="external" href="http://lists.w3.org/Archives/Public/www-xml-linking-comments/2001AprJ%20un/att-0074/01-NOTE-FIXptr-20010425.htm">Fragment Identifier for XML</a></li>
- <li>Transformaciones XSL: <a class="external" href="http://www.w3.org/TR/xslt">XSLT 1.0</a></li>
- <li>Lenguaje XPath: <a class="external" href="http://www.w3.org/TR/xpath">XPath 1.0</a></li>
- <li>Resource Description Framework (Infraestructura para la descripción de recursos): <a class="external" href="http://www.w3.org/RDF/">RDF</a></li>
- <li>Simple Object Access Protocol (Protocolo simple de acceso a objetos): <a class="external" href="http://www.w3.org/TR/soap">SOAP 1.1</a></li>
- <li>ECMA-262, revision 3 (JavaScript 1.5): <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMA-262</a></li>
-</ul>
-<h3 id="Trucos_generales_para_la_programaci.C3.B3n_multinavegador" name="Trucos_generales_para_la_programaci.C3.B3n_multinavegador">Trucos generales para la programación multinavegador</h3>
-<p>Pese a la existencia de los estándares web, los diferentes navegadores se comportan de manera distinta (de hecho, el mismo navegador puede comportarse de modo diferente dependiendo de la plataforma). Muchos navegadores, como Internet Explorer, también soportan el APIs anterior al W3C y nunca se han esforzado en añadir soporte para los navegadores compatibles con el W3C.</p>
-<p>Antes de enumerar las diferencias entre Mozilla e Internet Explorer, sería conveniente cubrir algunas formas básicas en las que se pueden crear aplicaciones web ampliables a las que añadir soporte para nuevos navegadores más tarde.</p>
-<p>Dado que los diferentes navegadores utilizan a veces diferentes APIs para una misma funcionalidad, es muy posible que encuentres múltiples bloques <code>if() else()</code> a lo largo y ancho del código para diferenciar el navegador que está ejecutando el documento. El siguiente código muestra un bloque diseñado para Internet Explorer:</p>
-<pre>. . .
-
-var elm;
-
-if (ns4)
-  elm = document.layers["myID"];
-else if (ie4)
-  elm = document.all["myID"]
-</pre>
-<p>El anterior código no es ampliable por lo que si quieres soportar un nuevo navegador, deberás actualizar ese bloque de código en toda la aplicación web.</p>
-<p>La forma más fácil de evitar la recodificación del documento para un nuevo navegador es abstraer la funcionalidad. En lugar de utilizar múltiples bloques <code>if() else()</code>, puedes incrementar la eficiencia tomando tareas comunes y abstrayéndolas en sus propias funciones. Esto no sólo hace al código más legible sino que simplifica el proceso añadir soporte para nuevos clientes.</p>
-<pre>var elm = getElmById("myID");
-
-function getElmById(aID){
-  var element = null;
-
-  if (isMozilla || isIE5)
-    element = document.getElementById(aID);
-  else if (isNetscape4)
-    element = document.layers[aID];
-  else if (isIE4)
-    element = document.all[aID];
-
-  return element;
-}
-</pre>
-<p>El código de arriba sigue arrastrando el problema del <em>browser sniffing</em> o el proceso de detección para saber qué navegador está utilizando el usuario. El browser sniffing es detectado generalmente gracias al parámetro <em>useragent</em>, como:</p>
-<pre>Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.5) Gecko/20031016
-</pre>
-<p>Mientras que la utilización del parámetro <em>useragent</em> para detectar el navegador proporciona información detallada del navegador en uso, el código que maneja esos parámetros genera errores con frecuencia cuando son publicadas nuevas versiones de los mismos, por lo que hay que cambiar el código.</p>
-<p>Si el tipo de navegador no importa (supongamos que se ha bloquado el acceso a la aplicación web a navegadores no soportados), <strong>será mucho mejor y más fiable detectar las capacidades del navegador o el soporte de objetos en particular</strong>. Generalmente se puede hacer esto probando la funcionalidad requerida en JavaScript, por ejemplo, en lugar de:</p>
-<pre>if (isMozilla || isIE5)
-</pre>
-<p>Se debería de usar:</p>
-<pre>if (document.getElementById)
-</pre>
-<p>Esto permitiría a otros navegadores que soportan ese método estandar del W3C (tales como Opera o Safari) funcionar sin ningún cambio.</p>
-<p>La detección del agente de usuario sin embargo tiene sentido cuando es importante acertar, como cuando estás verificando que un navegador coincide con los requerimientos de versión de la aplicación web o estás intentando sortear un fallo de programación.</p>
-<p>JavaScript también permite sentencias condicionales en línea, lo que ayuda a la legibilidad:</p>
-<pre>var foo = (condicion) ? condicionEsTrue : condicionEsFalse;
-</pre>
-<p>Por ejemplo, para obtener un elemento se debería usar:</p>
-<pre>
-function getElement(aID){
-  return (document.getElementById) ? document.getElementById(aID)
-                                   : document.all[aID];
-}
-</pre>
-<h3 id="Diferencias_entre_Mozilla_e_Internet_Explorer" name="Diferencias_entre_Mozilla_e_Internet_Explorer">Diferencias entre Mozilla e Internet Explorer</h3>
-<p>Primero se discutirán las diferencias en la forma en la que se comporta el HTML en Mozilla y en Internet Explorer.</p>
-<h4 id="T.C3.ADtulos_emergentes" name="T.C3.ADtulos_emergentes">Títulos emergentes</h4>
-<p>Los títulos emergentes son pequeños textos descriptivos que aparecen normalmente cuando se deja el cursor del ratón un cierto tiempo sobre un elemento.</p>
-<p>Los navegadores antiguos introdujeron los títulos emergentes en el HTML mostrándolos en enlaces y usando el valor del atributo <code>alt</code> como contenido del título. La última especificación de W3C para HTML creó el atributo <code>title</code>, pensado para contener una descripción detallada del enlace. Los navegadores modernos utilizan el atributo <code>title</code> para mostrar títulos emergentes y Mozilla sólo muestra dichos títulos basándose en el ese atributo y no en el atributo <code>alt</code>.</p>
-<h4 id="Entidades" name="Entidades">Entidades</h4>
-<p>El marcado HTML puede contener varias entidades definidas por el <a class="external" href="http://www.w3.org/TR/REC-html40/sgml/entities.html">departamento de estándares web del W3C</a>. Se pueden referenciar entidades a través de su referencia numérica o alfabética. Por ejemplo, puedes referenciar el carácter de espacio en blanco #160 con <code>&amp;#160</code> o con su referencia alfabética correspondiente <code>&amp;nbsp;</code>.</p>
-<p>Algunos navegadores antiguos, como Internet Explorer, son tan fulleros que permiten usar entidades reemplazando el carácter <code>;</code> (punto y coma) al final con contenido normal de texto.</p>
-<pre>&amp;nbsp Foo
-&amp;nbsp&amp;nbsp Foo
-</pre>
-<p>Internet Explorer visualizará los <code>&amp;nbsp</code> mostrados anteriormente como espacios en blanco, pese a que va en contra de la especificación del W3C. El navegador no analizará un <code>&amp;nbsp</code> si va inmediatamente seguido por más caracteres. Por ejemplo:</p>
-<pre>&amp;nbsp12345
-</pre>
-<p>Este código no funcionará en Mozilla, dado que va en contra de los estándares del W3C. Es mejor usar la forma correcta (<code>&amp;nbsp;</code>) para evitar discrepancias entre navegadores.</p>
-<h3 id="Diferencias_en_el_DOM" name="Diferencias_en_el_DOM">Diferencias en el DOM</h3>
-<p>El Modelo de Objetos de Documento (DOM) es <strong>la estructura en árbol que contiene los elementos del documento</strong>. Se puede manipular a través de las APIs de JavaScript, las cuales han sido estandarizadas por el W3C. Sin embargo, antes de la estandarización del W3C, Netscape 4 e Internet Explorer 4 implementaron las APIs de modo similar. Mozilla implementa las APIs heredadas sólo si han sido aceptadas por los estándares del W3C.</p>
-<h4 id="Accediendo_a_los_elementos" name="Accediendo_a_los_elementos">Accediendo a los elementos</h4>
-<p>Para referenciar un elemento usando una técnicas multinavegador, debe de usarse <code>document.getElementById(id)</code>, que funciona tanto en Internet Explorer versión 5.0 y superiores, en navegadores basados en Mozilla y en otros navegadores compatibles con el W3C y es parte de la especificación DOM nivel 1.</p>
-<p>Mozilla no soporta el acceso a elementos a través de <code>document.elementName</code>, ni siquiera a través del nombre del elemento; algo que Internet Explorer permite (llamado también <em>global namespace polluting</em>). Mozilla tampoco soporta el método <code>document.layers</code> de Netscape ni el <code>document.all</code> de Internet Explorer. Mientras que <code>document.getElementById</code> permite referenciar un único elemento, puedes usar <code>document.layers</code> y <code>document.all</code> para obtener una lista de todos los elementos del documento con un nombre determinado, como todos los elementos <code>&lt;div&gt;</code>.</p>
-<p>El método del DOM nivel 1 del W3C que permite referenciar a todos los elementos con el mismo nombre de etiqueta es <code>getElementsByTagName()</code>. Este método devuelve un vector en JavaScript y puede ser invocado desde el elemento <code>document</code> o desde otros nodos para buscar sólo en su sub-árbol. Para obtener un vector con todos los elementos del árbol del DOM, se puede utilizar <code>getElementsByTagName("*")</code>.</p>
-<p>Los métodos del DOM nivel 1, como muestra la tabla 1, son usados comúnmente para mover un elemento a una posición en particular y cambiar su visibilidad (menús, animaciones, etc...). Netscape 4 usaba la etiqueta <code>&lt;layer&gt;</code>(algo que Mozilla no soporta) como un elemento que podía posicionarse en cualquier lugar. En Mozilla se puede posicionar cualquier elemento utilizando la etiqueta <code>&lt;div&gt;</code>, algo que Internet Explorer también utiliza y que está presente en la especificación HTML.</p>
-<table class="standard-table">
- <caption>
-  Tabla 1. Métodos usados para acceder a elementos</caption>
- <tbody>
-  <tr>
-   <th>Método</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>document.getElementById( unId )</td>
-   <td>Devuelve una referencia al elemento cuyo atributo id coincide con el pasado como parámetro.</td>
-  </tr>
-  <tr>
-   <td>document.getElementsByTagName( unNombre )</td>
-   <td>Devuelve un vector de elementos cuyo nombre de etiqueta coincide con el pasado como parámetro.</td>
-  </tr>
- </tbody>
-</table>
-<h4 id="Recorrer_el_DOM" name="Recorrer_el_DOM">Recorrer el DOM</h4>
-<p>Mozilla soporta las APIs del DOM del W3C que permiten recorrer el árbol del DOM a través de JavaScript (véase la tabla 2). Las APIs están disponibles para cada nodo del documento y permiten recorrer el árbol en cualquier dirección. Internet Explorer también soporta estas APIs y además sus APIs heredadas para recorrer el árbol del DOM, tales como la propiedad <code>children</code>.</p>
-<table class="standard-table">
- <caption>
-  Tabla 2. Métodos usados para recorrer el DOM</caption>
- <tbody>
-  <tr>
-   <th>Propiedad/Método</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>childNodes</td>
-   <td>Devuelve un vector con todos los nodos hijos del elemento.</td>
-  </tr>
-  <tr>
-   <td>firstChild</td>
-   <td>Devuelve el primer nodo hijo del elemento.</td>
-  </tr>
-  <tr>
-   <td>getAttribute( nombre )</td>
-   <td>Devuelve el valor del atributo cuyo nombre se pasa como parámetro.</td>
-  </tr>
-  <tr>
-   <td>hasAttribute( nombre )</td>
-   <td>Devuelve un valor booleano que indica si el nodo actual tiene un atributo definido con el nombre especificado.</td>
-  </tr>
-  <tr>
-   <td>hasChildNodes()</td>
-   <td>Devuelve un valor booleano que indica si el nodo actual tiene al menos un elemento hijo.</td>
-  </tr>
-  <tr>
-   <td>lastChild</td>
-   <td>Devuelve el último nodo hijo del elemento.</td>
-  </tr>
-  <tr>
-   <td>nextSibling</td>
-   <td>Devuelve el nodo que sigue inmediatamente al actual.</td>
-  </tr>
-  <tr>
-   <td>nodeName</td>
-   <td>Devuelve el nombre del nodo actual como una cadena de texto.</td>
-  </tr>
-  <tr>
-   <td>nodeType</td>
-   <td>Devuelve un valor numérico que indica el tipo del nodo actual.
-    <table>
-     <tbody>
-      <tr>
-       <th>Valor</th>
-       <th>Descripción</th>
-      </tr>
-      <tr>
-       <td>1</td>
-       <td>Nodo elemento</td>
-      </tr>
-      <tr>
-       <td>2</td>
-       <td>Nodo atributo</td>
-      </tr>
-      <tr>
-       <td>3</td>
-       <td>Nodo de texto</td>
-      </tr>
-      <tr>
-       <td>4</td>
-       <td>Nodo de sección CDATA</td>
-      </tr>
-      <tr>
-       <td>5</td>
-       <td>Nodo de referencia a entidad</td>
-      </tr>
-      <tr>
-       <td>6</td>
-       <td>Nodo entidad</td>
-      </tr>
-      <tr>
-       <td>7</td>
-       <td>Nodo de instrucción de proceso</td>
-      </tr>
-      <tr>
-       <td>8</td>
-       <td>Nodo comentario</td>
-      </tr>
-      <tr>
-       <td>9</td>
-       <td>Nodo documento</td>
-      </tr>
-      <tr>
-       <td>10</td>
-       <td>Nodo tipo de documento</td>
-      </tr>
-      <tr>
-       <td>11</td>
-       <td>Nodo fragmento de documento</td>
-      </tr>
-      <tr>
-       <td>12</td>
-       <td>Nodo anotación</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-  </tr>
-  <tr>
-   <td>nodeValue</td>
-   <td>Devuelve el valor del nodo actual. Para aquellos nodos que contentan texto, tales como los nodos de texto o los nodos comentario, se devolverá su valor alfabético. Para nodos atributo, se devolverá el valor de su atributo. Para el resto de nodos, se devolverá <code>null</code>.</td>
-  </tr>
-  <tr>
-   <td>ownerDocument</td>
-   <td>Devuelve el objeto <code>document</code> que contiene al nodo actual.</td>
-  </tr>
-  <tr>
-   <td>parentNode</td>
-   <td>Devuelve el nodo padre del nodo actual.</td>
-  </tr>
-  <tr>
-   <td>previousSibling</td>
-   <td>Devuelve el nodo inmediatamente anterior al nodo actual.</td>
-  </tr>
-  <tr>
-   <td>removeAttribute( nombre)</td>
-   <td>Elimina el atributo especificado del nodo actual.</td>
-  </tr>
-  <tr>
-   <td>setAttribute( nombre, valor )</td>
-   <td>Establece el valor de un atributo.</td>
-  </tr>
- </tbody>
-</table>
-<p>Internet Explorer se comporta de un modo no estándar donde muchas de estas APIs ignorarán los nodos de texto en blanco que son generados, por ejemplo, mediante caracteres de nueva línea. Mozilla no las ignora por lo que a veces se necesita distinguir a estos nodos. Cada nodo posee la propiedad <code>nodeType</code> que especifica el tipo de nodo. Por ejemplo, un nodo elemento es de tipo 1 mientras que un nodo de texto es de tipo 3, un nodo comentario es de tipo 8, etc... La mejor forma de procesar sólo los nodos elemento es iterar todos los nodos hijos y procesar sólo aquellos cuya propiedad nodeType sea igual a 1:</p>
-<pre>HTML:
-  &lt;div id="foo"&gt;
-    &lt;span&gt;Test&lt;/span&gt;
-  &lt;/div&gt;
-
-JavaScript:
-  var myDiv = document.getElementById("foo");
-  var myChildren = myXMLDoc.childNodes;
-  for (var i = 0; i &lt; myChildren.length; i++) {
-    if (myChildren[i].nodeType == 1){
-      // Nodo elemento
-    };
-  };
-</pre>
-<h4 id="Generar_y_manejar_contenidos" name="Generar_y_manejar_contenidos">Generar y manejar contenidos</h4>
-<p>Mozilla soporta los métodos heredados para añadir contenido al DOM dinámicamente, tales como <code>document.write</code>, <code>document.open</code> y <code>document.close</code>. Mozilla también soporta el método de Internet Explorer <code>innerHTML</code> el cual puede ser llamado desde casi cualquier nodo. Sin embargo no soporta el método <code>outerHTML</code> (que añade marcado alrededor de un elemento y no tiene un equivalente estándar) ni <code>innerText</code> (el cual establece el valor alfabético de su nodo y que puede usarse en Mozilla usando <code>textContent</code>).</p>
-<p>Internet Explorer tiene varios métodos de manejo de contenidos que no son estándares y no son soportados en Mozilla, incluyendo obtener valores, insertar texto e insertar elementos adyacentes a un nodo tales como <code>getAdjacentElement</code> y <code>insertAdjacentHTML</code>. La tabla 3 muestra cómo el manipulan contenidos tanto Mozilla como el estándar del W3C, siendo todos ellos métodos aplicables a cualquier nodo del DOM.</p>
-<table class="standard-table">
- <caption>
-  Tabla 3. Métodos usados por Mozilla para manipular contenidos</caption>
- <tbody>
-  <tr>
-   <th>Método</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>appendChild( nodo )</td>
-   <td>Crea un nuevo nodo hijo. Devuelve una referencia al nuevo nodo hijo.</td>
-  </tr>
-  <tr>
-   <td>cloneNode( profundidad )</td>
-   <td>Crea y devuelve una copia del nodo sobre el que se hace la llamada. Si <em>profundidad</em> es true, copia el sub-árbol completo del nodo.</td>
-  </tr>
-  <tr>
-   <td>createElement( tipo )</td>
-   <td>Crea y devuelve un nuevo nodo huérfano de tipo igual al especificado por <em>tipo</em>.</td>
-  </tr>
-  <tr>
-   <td>createTextNode( valor )</td>
-   <td>Crea y devuelve un nuevo nodo de texto huérfano asignándole el valor especificado por <em>valor</em>.</td>
-  </tr>
-  <tr>
-   <td>insertBefore( nuevoNodo, nodoHijo )</td>
-   <td>Inserta el nodo <em>nuevoNodo</em> antes de <em>nodoHijo</em>, el cual debe ser un hijo del nodo actual.</td>
-  </tr>
-  <tr>
-   <td>removeChild( nodoHijo )</td>
-   <td>Elimina el nodo <em>nodoHijo</em> y devuelve una referencia a él.</td>
-  </tr>
-  <tr>
-   <td>replaceChild( nuevoNodo, nodoHijo )</td>
-   <td>Reemplaza el nodo <em>nodoHijo</em> con el nodo <em>nuevoNodo</em> y devuelve una referencia al nodo eliminado.</td>
-  </tr>
- </tbody>
-</table>
-<h4 id="Fragmentos_de_documento" name="Fragmentos_de_documento">Fragmentos de documento</h4>
-<p>Por razones de eficiencia, pueden crearse documentos en memoria en lugar de trabajar con el DOM de un documento existente. El núcleo del DOM nivel 1 introdujo los fragmentos de documento, que son documentos ligeros que contienen un subconjunto de las interfaces de un documento normal. Por ejemplo, <code>getElementById</code> no existe pero <code>appendChild</code> sí. Además se pueden anexar fácilmente fragmentos de documento a los ya existentes.</p>
-<p>Mozilla crea fragmentos de documento a través de <code>document.createDocumentFragment()</code>, el cual devuelve un fragmento de documento vacío.</p>
-<p>Sin embargo, la implementación de Internet Explorer para los fragmentos de documentos no es compatible con el estándar del W3C y simplemente devuelve un documento normal.</p>
-<h3 id="Diferencias_en_JavaScript" name="Diferencias_en_JavaScript">Diferencias en JavaScript</h3>
-<p><span class="comment">Buscar traducción adecuada para hooks DOM. "timing related" traducido como "duración de la ejecución"</span></p>
-<p>Por lo general, la mayoría de las diferencias entre Mozilla e Internet Explorer son las de JavaScript. Sin embargo, los problemas normalmente residen en las APIs que un navegador muestra a JavaScript, tales como hooks de DOM. A nivel del núcleo, los dos navegadores no poseen grandes diferencias. Los problemas se encuentran frecuentemente en la duración de la ejecución.</p>
-<h4 id="Diferencias_en_las_fechas_de_JavaScript" name="Diferencias_en_las_fechas_de_JavaScript">Diferencias en las fechas de JavaScript</h4>
-<p>La única diferencia en el objeto <code>Date</code> es el método <code>getYear</code>. Para la especificación ECMAScript (que es la que sigue JavaScript), el método no es compatible con el efecto 2000 y al ejecutar <code>new Date().getYear()</code> en 2004 se obtendrá un valor igual a "104". Para la especificación ECMAScript, <code>getYear</code> devuelve el año menos 1900 lo cual devolvía "98" para 1998. <code>getYear</code> quedó obsoleto en la versión 3 de ECMAScript y fue reemplazado por <code>getFullYear</code>. Internet Explorer cambió la implementación de <code>getYear</code> para que funcionara como <code>getFullYear</code> y fuese así compatible con el efecto 2000, mientras que Mozilla mantuvo el comportamiento estándar.</p>
-<h4 id="Diferencias_de_ejecuci.C3.B3n_en_JavaScript" name="Diferencias_de_ejecuci.C3.B3n_en_JavaScript">Diferencias de ejecución en JavaScript</h4>
-<p>Diferentes navegadores ejecutarán JavaScript de modo distinto. Por ejemplo, el siguiento código asume que el nodo <code>div</code> ya existe en el DOM en el momento en el que el bloque <code>script</code> se ejecuta:</p>
-<pre>...
-&lt;div id="foo"&gt;Cargando...&lt;/div&gt;
-
-&lt;script&gt;
-  document.getElementById("foo").innerHTML = "Cargado.";
-&lt;/script&gt;
-</pre>
-<p>Sin embargo esto no está garantizado. Para asegurarnos de que todos los elementos existen se debería usar el manejador de evento <code>onload</code> en la etiqueta <code>&lt;body&gt;</code>:</p>
-<pre>&lt;body onload="doFinish();"&gt;
-
-&lt;div id="foo"&gt;Cargando...&lt;/div&gt;
-
-&lt;script&gt;
-  function doFinish() {
-    var element = document.getElementById("foo");
-    element.innerHTML = "Cargado.";
-  }
-&lt;/script&gt;
-...
-</pre>
-<p>Tales problemas relativos a la duración de la ejecución están también relacionados con el hardware; los sistemas más lentos pueden mostar fallos que los más rápidos no provocan. Un ejemplo en concreto se puede encontrar en <code>window.open</code>, el cual abre una nueva ventana:</p>
-<pre>&lt;script&gt;
-  function doOpenWindow(){
-    var myWindow = window.open("about:blank");
-    myWindow.location.href = "http://www.ibm.com";
-  }
-&lt;/script&gt;
-</pre>
-<p>El problema con el código es que <code>window.open</code> es asíncrono lo que implica que no se bloquee la ejecución de JavaScript hasta que la ventana haya terminado de cargarse. Por tanto, se puede ejecutar la línea siguiente a la línea <code>window.open</code> antes de que la nueva ventana haya terminado de cargarse. Se puede lidiar con esto poniendo un manejador <code>onload</code> en la nueva ventana y luego llamar desde ahí a la ventana padre (usando <code>window.opener</code>).</p>
-<h4 id="Diferencias_en_la_generaci.C3.B3n_HTML_de_JavaScript" name="Diferencias_en_la_generaci.C3.B3n_HTML_de_JavaScript">Diferencias en la generación HTML de JavaScript</h4>
-<p>JavaScript puede generar, a través de <code>document.write</code>, código HTML al vuelo a partir de una cadena de texto. El principal problema es cuando JavaScript está embebido dentro del documento HTML (es decir, dentro de la etiqueta <code>&lt;script&gt;</code>) y genera HTML que contiene una etiqueta <code>&lt;script&gt;</code>. Si el documento está en modo estricto de visualización, entonces se analizará la etiqueta <code>&lt;/script&gt;</code> que se halla dentro de la cadena como la etiqueta de cierre de la etiqueta <code>&lt;script&gt;</code> que la contiene. El siguiente código ilustra mejor esto:</p>
-<pre>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
-...
-&lt;script&gt;
-  document.write("&lt;script type='text\/javascript'&gt;alert('Hola');&lt;\/script&gt;")
-&lt;/script&gt;
-</pre>
-<p>Dado que la página está en modo estricto, el analizador de Mozilla verá el primer <code>&lt;script&gt;</code> y lo analizará hasta que encuentre la etiqueta de cierre correspondiente, que será cuando encuentre el primer <code>&lt;/script&gt;</code>. Se hace así porque el analizador no tiene conocimiento de la existencia de JavaScript (o cualquier otro lenguaje) cuando está en modo estricto. En modo quirks, el analizador conoce de la existencia de JavaScript cuando trabaja (algo que lo ralentiza). Internet Explorer siempre funciona en modo quirks porque no soporta el auténtico XHTML. Para hacer que esto funcione en modo estricto en Mozilla se puede separar la cadena en dos partes:</p>
-<pre>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
-...
-&lt;script&gt;
-  document.write("&lt;script type='text\/javascript'&gt;alert('Hola');&lt;/" + "script&gt;")
-&lt;/script&gt;
-</pre>
-<h4 id="Depurando_JavaScript" name="Depurando_JavaScript">Depurando JavaScript</h4>
-<p>Mozilla proporciona varias formas de depurar los fallos relacionados con JavaScript encontrados en las aplicaciones creadas para Internet Explorer. La primera herramienta es la consola integrada de JavaScript, mostrada en la figura 1, donde los errores y los avisos quedan registrados. Puedes acceder a ella en Mozilla yendo al menú <strong>Herramientas -&gt; Desarrollo web -&gt; Consola JavaScript</strong>, en Firefox 2.0 (el navegador ligero de Mozilla) en <strong>Herramientas -&gt; Consola de errores</strong>.</p>
-<p>Figura 1. Consola JavaScript</p>
-<p><img alt="Javascript Console"></p>
-<p>La consola JavaScript puede mostrar el registro completo o sólo los errores, avisos o mensajes. El mensaje de error de la figura 1 dice que en aol.com, la línea 95 ha intentado acceder a una variable no definida llamada is_ns70. Al hacer clic en el enlace se abrira el visualizador de código interno de Mozilla con la línea en cuestión resaltada.</p>
-<p>La consola además permite evaluar JavaScript. Para probar la sintaxis de JavaScript introducida, se puede escribir <code>1+1</code> en el campo de entrada y pulsar <strong>Evaluar</strong>, como muestra la figura 2.</p>
-<p>Figure 2. Evaluación en la consola de JavaScript</p>
-<p><img alt="JavaScript Console evaluating"></p>
-<p>El motor de JavaScript en Mozilla tiene integrado el soporte para la depuración convirtiéndose así en una potente herramienta para los desarrolladores de JavaScript. Venkman, mostrado en la figura 3, es un potente depurador multinavegador para JavaScript que se integra con Mozilla. Generalmente es empaquetado con los lanzamientos de Mozilla y puede ser encontrado en <strong>Herramientas -&gt; Desarrollo web -&gt; Depurador Javascript</strong>. En Firefox, el navegador no viene incluido. En lugar de eso, se puede descargar e instalar desde la <a class="external" href="http://www.mozilla.org/projects/venkman/">página del proyecto Venkman</a>. Además se pueden encontrar tutoriales en la página de desarrollo, ubicada en la <a class="external" href="http://www.hacksrus.com/%7Eginda/venkman/">página de desarrollo de Venkman</a>.</p>
-<p>Figura 3. Depurador de JavaScript de Mozilla</p>
-<p><img alt="Mozilla's JavaScript debugger"></p>
-<p>El depurador de JavaScript puede depurar el código JavaScript que se ejecuta en la ventana del navegador de Mozilla. Soporta características estándar de depuración tales como puntos de interrupciones, revisión de la pila de llamadas e inspección de variables/objetos. Todas las caracterísitcas son accesibles a través de la interfaz de usuario y a través de la consola interactiva del depurador. Con la consola, se puede ejecutar código JavaScript arbitrario del mismo ámbito en el que JavaScript está siendo depurado.</p>
-<h3 id="Diferencias_en_CSS" name="Diferencias_en_CSS">Diferencias en CSS</h3>
-<p>Todos los productos basados en Mozilla poseen un fuerte soporte para CSS (hojas de estilo en cascada), en comparación con Internet Explorer y el resto de navegadores, ya que soportan la mayoría de CSS 1, CSS 2.1 y parte de CSS 3.</p>
-<p>Para la mayoría de los problemas que se mostrarán a continuación, Mozilla mostrará un aviso o un error en la consola JavaScript. Se aconseja comprobar la consola JavaScript si se encuentran problemas relacionados con CSS.</p>
-<h4 id="Tipos_MIME_.28cuando_no_se_aplican_a_los_ficheros_CSS.29" name="Tipos_MIME_.28cuando_no_se_aplican_a_los_ficheros_CSS.29">Tipos MIME (cuando no se aplican a los ficheros CSS)</h4>
-<p>El problema más común relacionado con CSS ocurre cuando las definiciones CSS que se hallan dentro de los ficheros CSS referenciados no se aplican. Esto generalmente se debe a que el servidor envía un tipo MIME incorrecto para el fichero CSS. La especificación CSS dice que los ficheros CSS deberían ser servidos con el tipo MIME <code>text/css</code>. Mozilla respetará esto y sólo cargará los ficheros CSS con ese tipo MIME si la página web está en modo estricto de estándares. Internet Explorer siempre cargará el fichero CSS sin importar el tipo MIME con el que haya sido servido. Se considera que las páginas web están en modo estricto de estándares cuando comienzan con un doctype (tipo de documento) estricto. Para solventar este problema, se puede optar por hacer que el servidor envíe el tipo MIME correcto o eliminando el doctype. Se explicarán más a fondo los doctypes en la siguiente sección.</p>
-<h4 id="CSS_y_las_unidades" name="CSS_y_las_unidades">CSS y las unidades</h4>
-<p>Muchas aplicaciones web no usan unidades en sus hojas CSS, especialmente cuando se usa JavaScript para establecer el CSS. Mozilla permite esto sólo si la página no se visualiza en modo estricto. Dado que Internet Explorer no soporta el auténtico XHTML, no se preocupa por saber si se han especificado o no las unidades. Si la página está en modo estricto de estándares y no se usan unidades entonces Mozilla ignorará dicho estilo.</p>
-<pre class="eval">&lt;DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-  "<span class="nowiki">http://www.w3.org/TR/html4/strict.dtd</span>"&gt;
-&lt;html&gt;
-  &lt;head&gt;
-   &lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
-   &lt;title&gt;CSS y unidades - Ejemplo&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    // funciona en modo estricto
-    &lt;div style="width: 40<span class="boldcode">px</span>; border: 1px solid black;"&gt;
-      Text
-    &lt;/div&gt;
-</pre>
-<pre class="eval">    // peta en modo estricto
-    &lt;div style="width: 40; border: 1px solid black;"&gt;
-      Text
-    &lt;/div&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-<p>Debido a que el ejemplo de antes tiene un doctype estricto, la página se visualizará en modo estricto de estándares. El primer div tendrá una anchura de 40px dado que se han usado unidades, pero el segundo div no tendrá anchura definida y se le asignará aquella por defecto (100%). Pasaría lo mismo si se estableciese la anchura a través de JavaScript.</p>
-<h4 id="JavaScript_y_CSS" name="JavaScript_y_CSS">JavaScript y CSS</h4>
-<p>Dado que Mozilla soporta los estándares CSS, también soporta el estándar DOM de CSS para poder establecer el estilo CSS a través de JavaScript. Se puede acceder a, eliminar y cambiar cualquier regla CSS de un elemento a través de su miembro <code>style</code>:</p>
-<pre>&lt;div id="myDiv" style="border: 1px solid black;"&gt;
-  Text
-&lt;/div&gt;
-
-&lt;script&gt;
-  var myElm = document.getElementById("myDiv");
-  myElm.style.width = "40px";
-&lt;/script&gt;
-</pre>
-<p>Igualmente se puede acceder a cada atributo CSS de la misma forma. De nuevo, si la página web está en modo estricto, se debe establecer una unidad o, en caso contrario, Mozilla ignorará el comando. Cuando se consulte un valor, digamos <code>.style.width</code>, Mozilla e Internet Explorer devolverán una cadena de texto incluyendo la unidad. Se puede convertir dicha cadena en un número a través de <code>parseFloat("40px")</code>.</p>
-<h4 id="Diferencias_en_la_propiedad_CSS_overflow" name="Diferencias_en_la_propiedad_CSS_overflow">Diferencias en la propiedad CSS overflow</h4>
-<p>Con CSS, se introduce el concepto de overflow que permite definir cómo se maneja el rebasamiento, por ejemplo, cuando la altura del contenido de un <code>div</code> es mayor que la altura del propio <code>div</code>. El estándar CSS indica que en caso de rebosamiento, si no se ha establecido dicho comportamiento, el contenido del <code>div</code> debe de rebosar.</p>
-<p>Sin embargo, Internet Explorer no cumple esto y alargará el <code>div</code> más allá de su altura hasta que pueda albergar correctamente su contenido. Más abajo hay un ejemplo que muestra esta diferencia:</p>
-<pre>&lt;div style="height: 100px; border: 1px solid black;"&gt;
-  &lt;div style="height: 150px; border: 1px solid red; margin: 10px;"&gt;
-    a
-  &lt;/div&gt;
-&lt;/div&gt;
-</pre>
-<p>Como se puede apreciar en la figura 4, Mozilla reacciona como especifican los estándares del W3C. Dichos estándares dicen que, en este caso, el <code>div</code> interior debería rebosar por la parte inferior dado que su contenido es más alto que el de su padre. Si se prefiere utilizar el comportamiento de Internet Explorer, simplemente no habría que especificar ninguna altura para el elemento exterior.</p>
-<p>Figura 4. Rebosamiento DIV</p>
-<p><img alt="DIV Overflow"></p>
-<h4 id="Diferencias_con_la_pseudoclase_:hover" name="Diferencias_con_la_pseudoclase_:hover">Diferencias con la pseudoclase :hover</h4>
-<p>El comportamiento no estándar de la pseudoclase CSS :hover ocurre en un gran número de sitios web. Generalmente se manifiesta por sí mismo cambiando el estilo de texto cuando el cursor del ratón se sitúa sobre un elemento en Mozilla, pero no en Internet Explorer. Esto es así porque el selector CSS <code>a:hover</code> en Internet Explorer coincide con <code>&lt;a href=""&gt;...&lt;/a&gt;</code> pero no con <code>&lt;a name=""&gt;...&lt;/a&gt;</code>, el cual establece los anclajes en HTML. El cambio de texto ocurre porque los autores encapsulan áreas con el etiquetado de anclajes:</p>
-<pre>CSS:
-  a:hover {color: green;}
-
-HTML:
-  &lt;a href="foo.com"&gt;Este texto debería volverse verde cuando el cursor del ratón se sitúe sobre él.&lt;/a&gt;
-
-  &lt;a name="anchor-name"&gt;
-    Este texto debería cambiar el color cuando fuese sobrevolado con el cursor pero no ocurre en Internet Explorer.
-  &lt;/a&gt;
-</pre>
-<p>Mozilla sigue la especificación CSS correctamente y cambiará el color a verde en este ejemplo. Se pueden utilizar dos formas para que Mozilla se comporte como Internet Explorer y no cambie el color del texto cuando éste sea sobrevolado:</p>
-<ul>
- <li>Primero, se puede cambiar la regla CSS para que sea <code>a:link:hover {color: green;}</code>, lo que provocará que sólo se cambie el color si un elemento es un enlace (tiene un atributo <code>href</code>).</li>
- <li>Alternativamente, es posible cambiar el marcado y cerrar la <code>&lt; a/&gt;</code> abierta antes de que empiece el texto; el anclaje continuará funcionando de este modo.</li>
-</ul>
-<h3 id="Modo_quirks_vs._modo_est.C3.A1ndar" name="Modo_quirks_vs._modo_est.C3.A1ndar">Modo quirks vs. modo estándar</h3>
-<p>Los antiguos navegadores, como Internet Explorer 4, visualizaban los documentos bajo ciertas condiciones con el llamado modo quirks (modo chapucero). Aunque Mozilla apunta a convertirse en un navegador respetuoso con los estándares, posee 3 modos que permiten soportar las antiguas páginas creadas para comportarse de ese modo tan peculiar. El contenido de la página y la forma en la que nos es enviada determinan el modo que Mozilla debe de utilizar. Mozilla muestra dicho modo en <strong>Ver -&gt; Información de página</strong> (o <code>Ctrl+I</code>) y Firefox lo hace en <strong>Herramientas -&gt; Información de la página</strong>. El modo en el que una página es visualizada depende de su doctype.</p>
-<p>Los doctypes (contracción inglesa para las declaraciones de tipos de documento) tiene este aspecto:</p>
-<p><code>&lt;!DOCTYPE HTML PUBLIC <span style="color: blue;">"-//W3C//DTD HTML 4.01 Transitional//EN"</span> <span style="color: green;">"<span class="nowiki">http://www.w3.org/TR/html4/loose.dtd</span>"</span>&gt;</code></p>
-<p>La parte azul es llamada identificador público, la verde es el identificador de sistema que es un URI.</p>
-<h4 id="Modo_est.C3.A1ndar" name="Modo_est.C3.A1ndar">Modo estándar</h4>
-<p>El modo estándar es el modo de visualización más estricto: visualizará las páginas según las especificaciones HTML y CSS del W3C y no permitirá ninguna chapuza. Mozilla lo usa bajo las siguientes condiciones:</p>
-<ul>
- <li>Cuando una página es enviada con un tipo MIME igual a <code>text/xml</code> o cualquier otro tipo MIME XML o XHTML.</li>
- <li>Con cualquier doctype "DOCTYPE HTML SYSTEM" (por ejemplo, <code>&lt;!DOCTYPE HTML SYSTEM "<span class="nowiki">http://www.w3.org/TR/REC-html40/strict.dtd</span>"&gt;</code>), exceptuando el doctype de IBM</li>
- <li>Cuando se especifique un doctype desconocido o éste no esté asociado a un DTD.</li>
-</ul>
-<h4 id="Modo_casi_est.C3.A1ndar" name="Modo_casi_est.C3.A1ndar">Modo <em>casi</em> estándar</h4>
-<p>Mozilla introdujo el modo <em>casi</em> estándar por una razón: una sección en la especificación CSS 2 daba al traste con los diseños que se basaban en la maquetación con tablas que contenían pequeñas imágenes. El usuario, en lugar de ver una imagen completa, veía cada imagen separada con un pequeño espacio en blanco. La antigua página de IBM mostrada en la figura 5 es un ejemplo de ello.</p>
-<p>Figura 5. Hueco en imágenes</p>
-<p><img alt="Image Gap"></p>
-<p>El modo <em>casi</em> estándar se comporta de modo muy parecido al modo estándar exceptuando el problema del hueco en imágenes. Este problema ocurre frecuentemente en páginas diseñadas acorde a los estándares y hace que se muestren incorrectamente.</p>
-<p>Mozilla utiliza el modo <em>casi</em> estándar bajo las siguientes condiciones:</p>
-<ul>
- <li>Ante cualquier doctype de tipo "loose" (obsoleto), por ejemplo <code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"&gt;</code>, <code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<span class="nowiki">http://www.w3.org/TR/html4/loose.dtd</span>"&gt;</code></li>
- <li>Para el doctype de IBM (<code>&lt;!DOCTYPE html SYSTEM "<span class="nowiki">http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd</span>"&gt;</code>)</li>
-</ul>
-<p>Para más información, véase el <a href="/es/Im%C3%A1genes,_tablas_y_huecos_misteriosos" title="es/Imágenes,_tablas_y_huecos_misteriosos">problema de los huecos con imágenes</a></p>
-<h4 id="Modo_quirks" name="Modo_quirks">Modo quirks</h4>
-<p>Actualmente, el web está plagado de sitios con HTML no válido, además de marcado que sólo funciona gracias a fallos de ciertos navegadores. Los antiguos navegadores de Netscape, cuando eran los amos del mercado, tenían fallos. Cuando desembarcó Internet Explorer, plagió esos mismos fallos para poder visualizar correctamente las páginas de aquella época. Más tarde cuando los nuevos navegadores llegaron al mercado, la mayoría de estos fallos originales, usualmente llamados <strong>quirks</strong>, fueron mantenidos por razones de compatibilidad hacia atrás. Mozilla soporta muchos de estos fallos cuando visualiza páginas en modo quirks. Nótese que debido a estos quirks, las páginas se visualizan más lentamente que si estuvieran escritas para respetar los estándares. La mayoría de las páginas web son visualizadas utilizando este modo.</p>
-<p>Mozilla utiliza este modo cuando encuentra las siguientes condiciones:</p>
-<ul>
- <li>Cuando no se ha especificado un doctype.</li>
- <li>Cuando se ha especificado un doctype sin su identificador de sistema (por ejemplo, &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt;&lt;/code&gt;)</li>
-</ul>
-<p>Para más información, véase <a href="/es/Mozilla_Quirks_Mode_Behavior" title="es/Mozilla_Quirks_Mode_Behavior">Mozilla Quirks Mode Behavior</a> and <a href="/es/Mozilla's_DOCTYPE_sniffing" title="es/Mozilla's_DOCTYPE_sniffing">Mozilla's DOCTYPE sniffing</a>.</p>
-<h3 id="Diferencias_en_eventos" name="Diferencias_en_eventos">Diferencias en eventos</h3>
-<p>Mozilla e Internet Explorer son prácticamente incompatibles en cuanto al manejo de eventos se refiere. El modelo de eventos de Mozilla sigue al del W3C y al de Netscape. En Internet Explorer, si una función es llamada desde un evento, se puede acceder al objeto <code>event</code> a través de <code>window.event</code>. En cambio Mozilla pasa un objeto <code>event</code> a los manejadores de eventos. Éstos deben de pasar específicamente el objeto a la función llamada a través de un argumento. A continuación se muestra un ejemplo multiplataforma de manejador de evento:</p>
-<pre>&lt;div onclick="handleEvent(event);"&gt;Click me!&lt;/div&gt;
-
-&lt;script&gt;
-  function handleEvent(evento) {
-    // if evento es null, significa que es el modelo de eventos de IE
-    // así que se utiliza window.event
-    var miEvento = evento ? evento : window.event;
-  }
-&lt;/script&gt;
-</pre>
-<p>A veces, esto no funciona ya que Internet Explorer <em>coge</em> el parámetro <code>evento</code>, identificándolo como no nulo, lo que en el códico provoca que no se pueda asignar window.event. La solución consiste en comprobar la propiedad window.event:</p>
-<pre>&lt;div onclick="handleEvent(event);"&gt;Click me!&lt;/div&gt;
-
-&lt;script&gt;
-  function handleEvent(aEvent) {
-    var myEvent = window.event ? window.event : aEvent;
-  }
-&lt;/script&gt;
-</pre>
-<p>Las propiedades y funciones que el objeto <code>event</code> muestra son nombradas con frecuencia de forma diferente entre Mozilla e Internet Explorer, como muestra la tabla 4:</p>
-<table class="standard-table">
- <caption>
-  Tabla 4. Diferencias entre las propiedades de eventos entre Mozilla e Internet Explorer</caption>
- <tbody>
-  <tr>
-   <th>Nombre en Internet Explorer</th>
-   <th>Nombre en Mozilla</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>altKey</td>
-   <td>altKey</td>
-   <td>Propiedad booleana que indica si la tecla <code>alt</code> estaba pulsada durante el evento.</td>
-  </tr>
-  <tr>
-   <td>cancelBubble</td>
-   <td>stopPropagation()</td>
-   <td>Usado para evitar que el evento sea propagado hacia los elementos ancestros en el árbol.</td>
-  </tr>
-  <tr>
-   <td>clientX</td>
-   <td>clientX</td>
-   <td>Coordenada X del evento, relativa al viewport.</td>
-  </tr>
-  <tr>
-   <td>clientY</td>
-   <td>clientY</td>
-   <td>Coordenada Y del evento, relativa al viewport.</td>
-  </tr>
-  <tr>
-   <td>ctrlKey</td>
-   <td>ctrlKey</td>
-   <td>Propiedad booleana que indica si la tecla <code>Ctrl</code> estaba pulsada durante el evento.</td>
-  </tr>
-  <tr>
-   <td>fromElement</td>
-   <td>relatedTarget</td>
-   <td>Para eventos de ratón, es el elemento desde el que partió el cursor del ratón.</td>
-  </tr>
-  <tr>
-   <td>keyCode</td>
-   <td>keyCode</td>
-   <td>Para eventos de teclado, es el número que representa a la tecla que estaba pulsada. 0 para los eventos de ratón.</td>
-  </tr>
-  <tr>
-   <td>returnValue</td>
-   <td>preventDefault()</td>
-   <td>Usado para evitar que se ejecute la acción por defecto del evento.</td>
-  </tr>
-  <tr>
-   <td>screenX</td>
-   <td>screenX</td>
-   <td>Coordenada X del evento, relativa a la pantalla.</td>
-  </tr>
-  <tr>
-   <td>screenY</td>
-   <td>screenY</td>
-   <td>Coordenada Y del evento, relativa a la pantalla.</td>
-  </tr>
-  <tr>
-   <td>shiftKey</td>
-   <td>shiftKey</td>
-   <td>Propiedad booleana que indica si la tecla <code>shift</code> estaba pulsada durante el evento.</td>
-  </tr>
-  <tr>
-   <td>srcElement</td>
-   <td>target</td>
-   <td>El elemento que provocó el evento.</td>
-  </tr>
-  <tr>
-   <td>toElement</td>
-   <td>currentTarget</td>
-   <td>Para eventos de ratón, es el elemento al que el ratón se dirigió cuando terminó el mismo.</td>
-  </tr>
-  <tr>
-   <td>type</td>
-   <td>type</td>
-   <td>Devuelve el nombre del evento.</td>
-  </tr>
- </tbody>
-</table>
-<h4 id="A.C3.B1adir_manejadores_de_eventos" name="A.C3.B1adir_manejadores_de_eventos">Añadir manejadores de eventos</h4>
-<p>Mozilla posee dos formas de añadir eventos a través de JavaScript. El primero, soportado por todos los navegadores, consiste en establecer propiedades de eventos directamente en los objetos. Para asignar un manejador de evento al evento <code>click</code> hay que pasar una referencia a dicha función manejadora a la propiedad <code>onclick</code> del objeto.</p>
-<pre>&lt;div id="myDiv"&gt;Click me!&lt;/div&gt;
-
-&lt;script&gt;
-  function handleEvent(aEvent) {
-    // if aEvent is null, means the Internet Explorer event model,
-    // so get window.event.
-    var myEvent = aEvent ? aEvent : window.event;
-  }
-
-  function onPageLoad(){
-    document.getElementById("myDiv").onclick = handleEvent;
-  }
-&lt;/script&gt;
-</pre>
-<p>Mozilla soporta al 100% la forma estándar del W3C para añadir <em>escuchadores</em> a los nodos del DOM: usando los métodos <code>addEventListener()</code> y <code>removeEventListener()</code>; y además con el beneplácito de poder añadir múltiples escuchadores para un mismo tipo de evento. Ambos métodos necesitan tres parámetros: el tipo de evento, una referencia a la función y un valor booleano que indica si el escuchador debe de capturar los eventos en su fase <em>captura</em>. Si el booleano es puesto a false, sólo capturará los eventos en la fase <em>burbuja</em>. Los eventos del W3C tienen tres fases: captura, objetivo y burbuja. Cada objeto <code>event</code> tiene un atributo <code>eventPhase</code> que indica la fase en la que se encuentra el evento mediante un número de base 0. Cuando se provoca un evento, éste comienza en el elemento más externamente situado del DOM, o sea, en el elemento superior del árbol DOM. Luego va atravesando el DOM usando el camino más corto hacia el objetivo. Estamos en la fase de <strong>captura</strong>. Cuando el evento alcanza al objetivo, el evento está en la fase <strong>objetivo</strong>. Tras alcanzar el objetivo, regresa por el árbol hasta alcanzar de nuevo el nodo más exteriormente situado. Esta es la fase <strong>burbuja</strong>. El modelo de eventos de Internet Explorer sólo tiene la fase burbuja por lo que estableciendo el tercer parámetro a false se conseguirá un comportamiento igual al de Internet Explorer.</p>
-<pre>&lt;div id="myDiv"&gt;Click me!&lt;/div&gt;
-
-&lt;script&gt;
-
-  function handleEvent(aEvent) {
-    // if aEvent is null, it is the Internet Explorer event model,
-    // so get window.event.
-    var myEvent = aEvent ? aEvent : window.event;
-  }
-
-  function onPageLoad() {
-    var element = document.getElementById("myDiv");
-    element.addEventListener("click", handleEvent, false);
-  }
-&lt;/script&gt;
-</pre>
-<p>Una ventaja de <code>addEventListener()</code> y <code>removeEventListener()</code> sobre asignar las propiedades es que se pueden tener múltiples escuchadores de eventos para el mismo evento, cada cual llamando a una función diferente. Así, para eliminar un escuchador de evento se necesita que los tres parámetros sean los mismos que se usaron para añadir el escuchador.</p>
-<p>Mozilla no soporta el método de Internet Explorer de convertir etiquetas &lt;script&gt; en manejadores de eventos, la cual amplía a &lt;script&gt; con los atributos <code>for</code> y <code>event</code> (véase tabla 5). Tampoco suporta los métodos <code>attachEvent</code> ni <code>detachEvent</code>. En vez de eso, se deberían de usar los métodos <code>addEventListener</code> y <code>removeEventListener</code>. Internet Explorer no soporta la especificación de eventos del W3C.</p>
-<table class="standard-table">
- <caption>
-  Tabla 5. Diferencias en los métodos de eventos entre Mozilla e Internet Explorer</caption>
- <tbody>
-  <tr>
-   <th>Método de Internet Explorer</th>
-   <th>Método de Mozilla</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>attachEvent(tipoEvento, referenciaFuncion)</td>
-   <td>addEventListener(tipoEvento, referenciaFuncion, usarCaptura)</td>
-   <td>Añade un manejador de evento a un elemento del DOM</td>
-  </tr>
-  <tr>
-   <td>detachEvent(tipoEvento, referenciaFuncion)</td>
-   <td>removeEventListener(tipoEvento, referenciaFuncion, usarCaptura)</td>
-   <td>Elimina un manejador de evento a un elemento del DOM</td>
-  </tr>
- </tbody>
-</table>
-<h3 id="Edici.C3.B3n_de_texto_enriquecido" name="Edici.C3.B3n_de_texto_enriquecido">Edición de texto enriquecido</h3>
-<p>Aunque Mozilla está orgulloso de ser el navegador más compatible con los estándares del W3C, sigue soportando funcionalidades no estándar, tales como <code>innerHTML</code> o <a href="/es/Midas" title="es/Midas">editores de texto enriquecido</a>, al no existir los equivalentes del W3C.</p>
-<p>Con Mozilla 1.3 se introdujo una implementación de la característica <a href="/es/Rich-Text_Editing_in_Mozilla/Class_xbDesignMode" title="es/Rich-Text_Editing_in_Mozilla/Class_xbDesignMode">designMode</a> de Internet Explorer, la cual convierte a un documento HTML en un editor de texto enriquecido.</p>
-<p>Una vez se ha cambiado al editor, los comandos pueden ser ejecutados en el documento a través del comando <code>execCommand</code>. Mozilla no soporta el atributo <code>contentEditable</code> de Internet Explorer para hacer editable cualquier control. Se puede usar un <code>iframe</code> para crear un editor de texto enriquecido.</p>
-<h4 id="Diferencias_en_el_texto_enriquecido" name="Diferencias_en_el_texto_enriquecido">Diferencias en el texto enriquecido</h4>
-<p>Mozilla soporta el método estándar del W3C para acceder al objeto <code>document</code> del iframe a través de <code>IFrameElmRef.contentDocument</code> mientras que Internet Explorer lo hace a través de <code>document.frames{{ mediawiki.external('\"IframeName\"') }}</code> y luego accede al <code>document</code> resultante.</p>
-<pre>&lt;script&gt;
-function getIFrameDocument(aID) {
-  var rv = null;
-
-  // if contentDocument existe, entonces es compatible con el W3C (Mozilla)
-  if (document.getElementById(aID).contentDocument){
-    rv = document.getElementById(aID).contentDocument;
-  } else {
-    // IE
-    rv = document.frames[aID].document;
-  }
-  return rv;
-}
-&lt;/script&gt;
-</pre>
-<p>Otra diferencia entre Mozilla e Internet Explorer es el HTML que crea el editor de texto enriquecido. Por defecto, Mozilla usa CSS para generar marcado. Sin embargo, Mozilla permite alternar entre el modo HTML y CSS usando el comando <code>useCSS</code> del execCommand cambiándolo entre true y false. Internet Explorer siempre usa el marcado HTML.</p>
-<pre>Mozilla (CSS):
-  &lt;span style="color: blue;"&gt;Azul&lt;/span&gt;
-
-Mozilla (HTML):
-  &lt;font color="blue"&gt;Azul&lt;/font&gt;
-
-Internet Explorer:
-  &lt;FONT color="blue"&gt;Azul&lt;/FONT&gt;
-</pre>
-<p>Más abajo hay una lista de comandos soportados por execCommand en Mozilla:</p>
-<table class="standard-table">
- <caption>
-  Tabla 6. Comandos del editor de texto enriquecido.</caption>
- <tbody>
-  <tr>
-   <th>Nombre</th>
-   <th>Descripción</th>
-   <th>Argumentos</th>
-  </tr>
-  <tr>
-   <td>bold</td>
-   <td>Alterna el modo en negrita de la selección.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>createlink</td>
-   <td>Genera un enlace HTML a partir del texto seleccionado.</td>
-   <td>URL a usar para el enlace</td>
-  </tr>
-  <tr>
-   <td>delete</td>
-   <td>Borra la selección.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>fontname</td>
-   <td>Cambia la fuente del texto seleccionado.</td>
-   <td>Nombre de la fuente (por ejemplo, Arial)</td>
-  </tr>
-  <tr>
-   <td>fontsize</td>
-   <td>Cambia el tamaño del texto seleccionado.</td>
-   <td>Tamaño de la fuente</td>
-  </tr>
-  <tr>
-   <td>fontcolor</td>
-   <td>Cambia el color de la fuente del texto seleccionado.</td>
-   <td>Color a usar</td>
-  </tr>
-  <tr>
-   <td>indent</td>
-   <td>Indenta el bloque donde el se encuentra el cursor.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>inserthorizontalrule</td>
-   <td>Inserta un elemento &lt;hr&gt; en la posición del cursor.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>insertimage</td>
-   <td>Inserta una imagen en la posición del cursor.</td>
-   <td>URL de la imagen</td>
-  </tr>
-  <tr>
-   <td>insertorderedlist</td>
-   <td>Inserta un elemento de lista ordeanda (&lt;ol&gt;) en la posición del cursor.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>insertunorderedlist</td>
-   <td>Inserta un elemento de lista no ordenada (&lt;ul&gt;) en la posición del cursor.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>italic</td>
-   <td>Alterna el modo en cursiva de la selección.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>justifycenter</td>
-   <td>Centra el contenido de la línea actual.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>justifyleft</td>
-   <td>Alinea el contenido de la línea actual a la izquierda.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>justifyright</td>
-   <td>Alinea el contenido de la línea actual a la derecha.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>outdent</td>
-   <td>Elimina la indentación del bloque donde se halla el cursor.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>redo</td>
-   <td>Rehace el anterior comando deshecho.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>removeformat</td>
-   <td>Elimina todo el formato de la selección.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>selectall</td>
-   <td>Selecciona todo el texto del editor.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>strikethrough</td>
-   <td>Alterna el modo tachado del texto seleccionado.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>subscript</td>
-   <td>Convierte la selección actual a subíndice.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>superscript</td>
-   <td>Convierte la selección actual a superíndice.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>underline</td>
-   <td>Alterna el modo subrayado del texto seleccionado.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>undo</td>
-   <td>Deshace el último comando ejecutado.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>unlink</td>
-   <td>Elimina toda la información sobre enlaces de la selección.</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>useCSS</td>
-   <td>Alterna el uso de CSS en el marcado generado.</td>
-   <td>Valor booleano</td>
-  </tr>
- </tbody>
-</table>
-<p>Para más información, véase <a href="/es/Rich-Text_Editing_in_Mozilla" title="es/Rich-Text_Editing_in_Mozilla">Rich-Text Editing in Mozilla</a></p>
-<h3 id="Diferencias_en_XML" name="Diferencias_en_XML">Diferencias en XML</h3>
-<p>Mozilla posee un fuerte soporte para XML y todas sus tecnologías relacionadas, tales como XSLT y servicios web. Además soporta algunas extensiones no estándar de Internet Explorer, tales como XMLHttpRequest.</p>
-<h4 id="C.C3.B3mo_manejar_XMLs" name="C.C3.B3mo_manejar_XMLs">Cómo manejar XMLs</h4>
-<p>Al igual que ocurre con el estándar HTML, Mozilla soporta la especificación del DOM para XML del W3C, la cual permite manipular prácticamente cualquier aspecto de cualquier documento XML. Las diferencias entre el DOM para XML de Internet Explorer y Mozilla son provocadas por el comportamiento no estándar de Internet Explorer. Probablemente la diferencia más común es cómo ambos manejan los espacios en blanco en los nodos de texto. Con frecuencia cuando se genera un XML, contiene espacios en blanco entre los nodos XML. Internet Explorer, cuando usa <code>XMLNode.childNodes[]</code> no contendrá estos nodos de espacios en blanco. En Mozilla, estos nodos se incluirán en el vector.</p>
-<pre>XML:
-  &lt;?xml version="1.0"?&gt;
-  &lt;myXMLdoc xmlns:myns="http://myfoo.com"&gt;
-    &lt;myns:foo&gt;bar&lt;/myns:foo&gt;
-  &lt;/myXMLdoc&gt;
-
-JavaScript:
-  var myXMLDoc = getXMLDocument().documentElement;
-  alert(myXMLDoc.childNodes.length);
-</pre>
-<p>La primera línea de JavaScript carga el documento XML y accede a su elemento ráiz (<code>myXMLDoc</code>) recuperando el <code>documentElement</code>. La segunda línea simplemente muestra el número de nodos hijos. Para la especificación del W3C, los espacios en blanco y los retornos de carro se unen bajo un nodo de texto si uno es seguido del otro. Para Mozilla, el nodo <code>myXMLdoc</code> tiene tres hijos: un nodo de texto que contiene un retorno de carro y dos espacios, el nodo <code>myns:foo</code>, y otro nodo de texto con un retorno de carro. No obstante, Internet Explorer no obedece esto y devolverá "1" para el anterior código, considerando sólamente el nodo <code>myns:foo</code> Por elli, para recorrer los nodos hijos y desechar los nodos de texto se deben distinguir tales nodos del resto.</p>
-<p>Como se mencionó antes, cada nodo tiene un atributo <code>nodeType</code> que representa el tipo de nodo. Por ejemplo, un nodo elemento tiene tipo 1 mientras que un nodo documento posee tipo 9. Para distinguir los nodos de texto se deben buscar los nodos de tipo 3 (nodos de texto) y los de tipo 8 (nodos comentario).</p>
-<pre>XML:
-  &lt;?xml version="1.0"?&gt;
-  &lt;myXMLdoc xmlns:myns="http://myfoo.com"&gt;
-    &lt;myns:foo&gt;bar&lt;/myns:foo&gt;
-  &lt;/myXMLdoc&gt;
-
-JavaScript:
-  var myXMLDoc = getXMLDocument().documentElement;
-  var myChildren = myXMLDoc.childNodes;
-
-  for (var run = 0; run &lt; myChildren.length; run++){
-    if ( (myChildren[run].nodeType != 3) &amp;&amp;
-          myChildren[run].nodeType != 8) ){
-      // not a text or comment node
-    };
-  };
-</pre>
-<h4 id="Islas_de_datos_XML" name="Islas_de_datos_XML">Islas de datos XML</h4>
-<p>Internet Explorer posee una peculiaridad no estándar llamada <em>islas de datos XML (XML data islands)</em>, que permite incrustar XML dentro de un documento HTML usando la etiqueta HTML no estándar <code>&lt;xml&gt;</code>. Mozilla no soporta las islas de datos XML y las maneja como etiquetas HTML desconocidas. Se puede obtener la misma funcionalidad utilizando XHTML, sin embargo, debido a que el soporte de Internet Explorer para XHTML es débil, esto no es generalmente una opción.</p>
-<p>Una solución multiplataforma es usar analizadores DOM que generan, a partir de un documento XML serializado, el documento XML analizado. Mozilla usa la clase <code>DOMParser</code> la cual toma una cadena serializada crea un documento XML a partir de ella. En Internet Explorer se puede obtener la misma funcionalidad usando ActiveX. El nuevo <code>Microsoft.XMLDOM</code> genera y posee el método un método llamado <code>loadXML</code> que acepta una cadena de texto y genera un documento a partir de ella. El siguiente código muestra su funcionamiento:</p>
-<p> </p>
-<pre>Isla de datos XML para IE
-  ..
-  &lt;xml id="xmldataisland"&gt;
-    &lt;foo&gt;bar&lt;/foo&gt;
-  &lt;/xml&gt;
-
-Solución multiplataforma:
-  var xmlString = "&lt;xml id=\"xmldataisland\"&gt;&lt;foo&gt;bar&lt;/foo&gt;&lt;/xml&gt;";
-
-  var myDocument;
-
-  if (document.implementation.createDocument){
-    // Mozilla, create a new DOMParser
-    var parser = new DOMParser();
-    myDocument = parser.parseFromString(xmlString, "text/xml");
-  } else if (window.ActiveXObject){
-    // Internet Explorer, create a new XML document using ActiveX
-    // and use loadXML as a DOM parser.
-    myDocument = new ActiveXObject("Microsoft.XMLDOM");
-    myDocument.async="false";
-
-    myDocument.loadXML(xmlString);
-  }
-</pre>
-<h4 id="Peticiones_HTTP_para_XML" name="Peticiones_HTTP_para_XML">Peticiones HTTP para XML</h4>
-<p>Internet Explorer permite el envío y recuperación de ficheros XML usando la clase de MSXML <code>XMLHTTP</code>, instanciada a través de ActiveX usando <code>new ActiveXObject("Msxml2.XMLHTTP")</code> o <code>new ActiveXObject("Microsoft.XMLHTTP")</code>. Dado que no hay un método estándar para hacer esto, Mozilla proporciona la misma funcionalidad en el objeto global <code>XMLHttpRequest</code> de JavaScript. El objeto genera peticiones asíncronas de modo predeterminado.</p>
-<p>Tras instanciar el objeto usando <code>new XMLHttpRequest()</code> se puede usar el método <code>open</code> para especificar qué tipo de petición (GET o POST) se quiere usar, qué fichero se va a cargar y si será una petición asíncrona o no. Si la llamada es asíncrona, será necesario facilitar al miembro <code>onload</code> una referencia a una función que será invocada una vez la petición ha sido completada.</p>
-<p>Petición síncrona:</p>
-<pre class="eval">  var myXMLHTTPRequest = new XMLHttpRequest();
-  myXMLHTTPRequest.open("GET", "data.xml", false);
-
-  myXMLHTTPRequest.send(null);
-
-  var myXMLDocument = myXMLHTTPRequest.responseXML;
-</pre>
-<p>Petición asíncrona:</p>
-<pre class="eval">  var myXMLHTTPRequest;
-
-  function <span class="boldcode">xmlLoaded</span>() {
-    var myXMLDocument = myXMLHTTPRequest.responseXML;
-  }
-
-  function loadXML(){
-    myXMLHTTPRequest = new XMLHttpRequest();
-
-    myXMLHTTPRequest.open("GET", "data.xml", true);
-
-    myXMLHTTPRequest.onload = <span class="boldcode">xmlLoaded</span>;
-
-    myXMLHTTPRequest.send(null);
-  }
-</pre>
-<p>La tabla 7 muestra una lista de métodos y propiedades disponibles para el objeto <code>XMLHttpRequest</code> de Mozilla.</p>
-<table class="standard-table">
- <caption>
-  Tabla 7. Métodos y propiedades XMLHttpRequest</caption>
- <tbody>
-  <tr>
-   <th>Nombre</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>void abort()</td>
-   <td>Detiene la petición si ésta aún está en curso.</td>
-  </tr>
-  <tr>
-   <td>string getAllResponseHeaders()</td>
-   <td>Devuelve todas las cabeceras de respuesta como una única cadena.</td>
-  </tr>
-  <tr>
-   <td>string getResponseHeader(string headerName)</td>
-   <td>Devuelve el valor de la cabecera especificada.</td>
-  </tr>
-  <tr>
-   <td>functionRef onerror</td>
-   <td>La función que se le asigne será invocada cuando ocurran errores durante una petición.</td>
-  </tr>
-  <tr>
-   <td>functionRef onload</td>
-   <td>La función que se le asigne será invocada cuando la petición se complete con éxito y se haya recibido una respuesta. Se usa con las peticiones asíncronas.</td>
-  </tr>
-  <tr>
-   <td>void open (string HTTP_Method, string URL)<br>
-    <br>
-    void open (string HTTP_Method, string URL, boolean async, string userName, string password)</td>
-   <td>Inicializa la petición para la URL especificada, usando tanto GET o POST como el método HTTP. Para enviar la petición, es necesario llamar al método <code>send()</code> tras la inicialización. Si <code>async</code> se establece a false, la petición será síncrona. De modo predeterminado es asíncrona. Opcionalmente se puede especificar un nombre de usuario y contraseña por si la necesita la URL facilitada. Initializes the request for the specified URL, using either GET or POST as the HTTP method. To send the request, call the <code>send()</code> method after initialization. If <code>async</code> is false, the request is synchronous, else it defaults to asynchronous. Optionally, you can specify a username and password for the given URL needed.</td>
-  </tr>
-  <tr>
-   <td>int readyState</td>
-   <td>Estado de la petición. Valores posibles:
-    <table>
-     <tbody>
-      <tr>
-       <th>Valor</th>
-       <th>Descripción</th>
-      </tr>
-      <tr>
-       <td>0</td>
-       <td>UNINITIALIZED - open() aún no ha sido llamado.</td>
-      </tr>
-      <tr>
-       <td>1</td>
-       <td>LOADING - send() aún no ha sido llamado.</td>
-      </tr>
-      <tr>
-       <td>2</td>
-       <td>LOADED - send() ha sido llamado y las cabeceras y el estado están disponibles.</td>
-      </tr>
-      <tr>
-       <td>3</td>
-       <td>INTERACTIVE - Descargando. responseText contiene datos parciales.</td>
-      </tr>
-      <tr>
-       <td>4</td>
-       <td>COMPLETED - Todas las operaciones han sido completadas.</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-  </tr>
-  <tr>
-   <td>string responseText</td>
-   <td>Cadena que contiene la respuesta.</td>
-  </tr>
-  <tr>
-   <td>DOMDocument responseXML</td>
-   <td>Documento DOM que contiene la respuesta.</td>
-  </tr>
-  <tr>
-   <td>void send(variant body)</td>
-   <td>Realiza la petición. Si <code>body</code> está definido, será enviado como el cuerpo de la petición POST. <code>body</code> puede ser un documento XML o una cadena conteniendo un XML serializado.</td>
-  </tr>
-  <tr>
-   <td>void setRequestHeader (string headerName, string headerValue)</td>
-   <td>Establece una cabecera de petición HTTP para usarla en la petición HTTP. Ha de ser llamada tras invocar al método <code>open()</code>.</td>
-  </tr>
-  <tr>
-   <td>string status</td>
-   <td>El código de estado de la respuesta HTTP.</td>
-  </tr>
- </tbody>
-</table>
-<h4 id="Diferencias_en_XSLT" name="Diferencias_en_XSLT">Diferencias en XSLT</h4>
-<p>Mozilla soporta las transformaciones XSL 1.0 (XSLT). Además permite a JavaScript realizar tanto transformaciones XSLT como consultas XPath sobre un documento.</p>
-<p>Mozilla necesita que se le pase el fichero XML y XSLT que contiene la hoja de estilos con un tipo MIME XML (<code>text/xml</code> o <code>application/xml</code>). Este es el motivo más común por el cual los XSLT no funcionan en Mozilla pero sí en Internet Explorer. En ese sentido, Mozilla es estricto.</p>
-<p>Internet Explorer 5.0 y 5.5 soportan el borrador de XSLT, el cual es sustancialmente diferente a la recomendación final 1.0. La forma más fácil de distinguir la versión en la que ha sido escrito un fichero XSLT es mirando su espacio de nombres. El espacio de nombres para la recomendación 1.0 es <code><span class="nowiki">http://www.w3.org/1999/XSL/Transform</span></code> mientras que el espacio de nombres del borrador es <code><span class="nowiki">http://www.w3.org/TR/WD-xsl</span></code>. Internet Explorer 6 soporta el borrador por razones de compatibilidad hacia atrás. Mozilla no soporta dicho borrador, sólo la recomendación final.</p>
-<p>Si el XSLT necesita distinguir el navegador, se puede consultar la propiedad de sistema "xsl:vendor". El motor XSLT de Mozilla devolverá "Transformiix" mientras que Internet Explorer devolverá "Microsoft".</p>
-<pre>&lt;xsl:if test="system-property('xsl:vendor') = 'Transformiix'"&gt;
-  &lt;!-- Marcado específico de Mozilla --&gt;
-&lt;/xsl:if&gt;
-&lt;xsl:if test="system-property('xsl:vendor') = 'Microsoft'"&gt;
-  &lt;!-- Marcado específico de Internet Explorer --&gt;
-&lt;/xsl:if&gt;
-</pre>
-<p>Mozilla también proporciona una interfaz de JavaScript para XSLT, permitiendo a un sitio web completar transformaciones XSLT en memoria. Esto puede hacerse usando el objeto global de JavaScript <code>XSLTProcessor</code>. <code>XSLTProcessor</code> necesita que se carge el XML y los ficheros XSLT ya que necesita sus documentos DOM. El documento XSLT importado por <code>XSLTProcessor</code> permite manipular los parámetros XSLT. <code>XSLTProcessor</code> puede generar un documento independiente utilizando <code>transformToDocument()</code> o puede crear un fragmento de documento utilizando <code>transformToFragment()</code> para poder ser anexado fácilmente a otro documento DOM. Más abajo se muestra un ejemplo:</p>
-<pre>var xslStylesheet;
-var xsltProcessor = new XSLTProcessor();
-
-// carga el fichero XSLT example1.xsl
-var myXMLHTTPRequest = new XMLHttpRequest();
-myXMLHTTPRequest.open("GET", "example1.xsl", false);
-myXMLHTTPRequest.send(null);
-
-// obtiene el documento XML y lo importa
-xslStylesheet = myXMLHTTPRequest.responseXML;
-
-xsltProcessor.importStylesheet(xslStylesheet);
-
-// carga el fichero xml example1.xml
-myXMLHTTPRequest = new XMLHttpRequest();
-myXMLHTTPRequest.open("GET", "example1.xml", false);
-myXMLHTTPRequest.send(null);
-
-var xmlSource = myXMLHTTPRequest.responseXML;
-
-var resultDocument = xsltProcessor.transformToDocument(xmlSource);
-</pre>
-<p>Tras crear un objeto <code>XSLTProcessor</code>, hay que cargar el fichero XSLT a través de <code>XMLHttpRequest</code>. El miembro <code>responseXML</code> del XMLHttpRequest contiene el documento XML del fichero XSLT, el cuas es pasado a <code>importStylesheet</code>. Luego hay que usar de nuevo <code>XMLHttpRequest</code> para cargar el documento XML que va a ser transformado. Ese documento es entonces pasado al método <code>transformToDocument</code> de <code>XSLTProcessor</code>. La tabla 8 muestra una lista con los métodos de <code>XSLTProcessor</code>.</p>
-<table class="standard-table">
- <caption>
-  Tabla 8. Métodos de XSLTProcessor</caption>
- <tbody>
-  <tr>
-   <th>Método</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>void importStylesheet(Node styleSheet)</td>
-   <td>Importa la hoja de estilo XSLT. El argumento <code>styleSheet</code> es el nodo ráiz del documento DOM de la hoja de estilos XSLT.</td>
-  </tr>
-  <tr>
-   <td>DocumentFragment transformToFragment(Node source, Document owner)</td>
-   <td>Transforma el nodo <code>source</code> aplicando la hoja de estilos importada con el método <code>importStylesheet</code> y genera un DocumentFragment. <code>owner</code> especifica a qué documento DOM debe anexarse el DocumentFragment, haciéndolo compatible con ese documento DOM.</td>
-  </tr>
-  <tr>
-   <td>Document transformToDocument(Node source)</td>
-   <td>Transforma el nodo <code>source</code> aplicando la hoja de estilos importada a través del método <code>importStylesheet</code> y devuelve un documento DOM independiente.</td>
-  </tr>
-  <tr>
-   <td>void setParameter(String namespaceURI, String localName, Variant value)</td>
-   <td>Establece un parámetro en la hoja de estilos XSLT importada.</td>
-  </tr>
-  <tr>
-   <td>Variant getParameter(String namespaceURI, String localName)</td>
-   <td>Obtiene el valor de un parámetro en la hoja de estilos XSLT importada.</td>
-  </tr>
-  <tr>
-   <td>void removeParameter(String namespaceURI, String localName)</td>
-   <td>Elimina todos los parámetros establecidos para la hoja de estilos XSLT importada y establece sus valores a los predeterminados para el XSLT.</td>
-  </tr>
-  <tr>
-   <td>void clearParameters()</td>
-   <td>Elimina todos los parámetros establecidos y establece sus valores a los predeterminados en la hoja de estilos XSLT.</td>
-  </tr>
-  <tr>
-   <td>void reset()</td>
-   <td>Elimina todos los parámetros y hojas de estilos.</td>
-  </tr>
- </tbody>
-</table>
-<div class="originaldocinfo">
- <h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3>
- <ul>
-  <li>Author(s): Doron Rosenberg, IBM Corporation</li>
-  <li>Published: 26 Jul 2005</li>
-  <li>Link: <a class="external" href="http://www.ibm.com/developerworks/web/library/wa-ie2mozgd/" rel="freelink">http://www.ibm.com/developerworks/we...y/wa-ie2mozgd/</a></li>
- </ul>
-</div>
-<p> </p>
diff --git a/files/es/modo_casi_estándar_de_gecko/index.html b/files/es/modo_casi_estándar_de_gecko/index.html
deleted file mode 100644
index 4a0f6c1c38..0000000000
--- a/files/es/modo_casi_estándar_de_gecko/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Modo casi estándar de Gecko
-slug: Modo_casi_estándar_de_Gecko
-tags:
-  - Desarrollo_Web
-  - Estándares_Web
-  - Gecko
-  - HTML
-  - Todas_las_Categorías
----
-<p> </p>
-<p> </p>
-<p>A partir de Mozilla 1.0.1 y 1.1 beta, hay un nuevo modo de renderizado llamado "casi estándar". Este modo se añade a los ya tradicionales y modo "estándar".</p>
-<p>El modo de renderizado "casi estándar" es exactamente igual que el "modo estándar", en todo excepto en un detalle, la disposición de las imágenes dentro de las tablas se maneja tal y como se hace en el modo "Quirks" de Gecko, que es bastante comparable con la de otros navegadores, tales como Internet Explorer. Esto implica que los diseños basados en tablas con imágenes troceadas tienen más probabilidades de mostrarse correctamente en los navegadores basados en Gecko que utilicen el motor de renderizado de Mozilla 1.0.1 o posterior, tanto en el modo "Quirks" como en el "casi estándar". Léase el artículo "<a href="es/Im%c3%a1genes%2c_tablas_y_huecos_misteriosos">Imágenes, tablas y huecos misteriosos</a>" para una explicación detallada de cómo son tratados estos diseños en el modo "estándar".</p>
-<p>Salvo esta diferencia, el modo "casi estándar" y el "estándar" son exactamente iguales en términos de maquetación y otros comportamientos.</p>
-<h3 id="Activando_el_modo_.22casi_est.C3.A1ndar.22" name="Activando_el_modo_.22casi_est.C3.A1ndar.22">Activando el modo "casi estándar"</h3>
-<p>Los DOCTYPEs que activan el modo "casi estándar" son los que contienen:</p>
-<ul>
- <li>El identificador público "<code>-//W3C//DTD XHTML 1.0 Transitional//EN</code>"</li>
- <li>El identificador público "<code>-//W3C//DTD XHTML 1.0 Frameset//EN</code>"</li>
- <li>El identificador público "<code>-//W3C//DTD HTML 4.01 Transitional//EN</code>", con un identificador de sistema</li>
- <li>El identificador público "<code>-//W3C//DTD HTML 4.01 Frameset//EN</code>", con un identificador de sistema</li>
- <li>The IBM system DOCTYPE "<code><span class="nowiki">http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd</span></code>"</li>
-</ul>
-<p>Un DOCTYPE completo contiene un identificador público y un identificador de sistema. Al hablar sobre los DOCTYPEs, mucha gente se refiere a ellos como "con URI" o "sin URI". El URI es el identificador de sistema. Por ejemplo, considere el DOCTYPE siguiente:</p>
-<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
-			"http://www.w3.org/TR/html4/loose.dtd"&gt;</pre>
-<p>Tiene dos partes:</p>
-<ul>
- <li>El identificador público: "<code>-//W3C//DTD HTML 4.01 Transitional//EN</code>"</li>
- <li>El identificador de sistema: "<code><span class="nowiki">http://www.w3.org/TR/html4/loose.dtd</span></code>"</li>
-</ul>
-<p>Así, cualquier DOCTYPE HTML 4.01 transicional o Frameset con un URI (identificador de sistema) activará el modo "casi estándar", como cualquier DOCTYPE XHTML 1.0 transicional o Frameset, con o sin URI. Los Autores sin relación con IBM no deben preocuparse por su DOCTYPE a medida, también activará el modo "casi estándar".</p>
-<h3 id="Recomendaciones" name="Recomendaciones">Recomendaciones</h3>
-<ul>
- <li>Los autores que están procurando migrar al código válido usando HTML 4,01 o XHTML 1,0, y que todavía utilizan conceptos de diseño con tablas e imágenes, deben asegurarse de utilizar un DOCTYPE que active el modo "casi estándar".</li>
-</ul>
-<h3 id="M.C3.A1s_en_MDC" name="M.C3.A1s_en_MDC">Más en MDC</h3>
-<ul>
- <li><a href="es/Im%c3%a1genes%2c_tablas_y_huecos_misteriosos">Imágenes, tablas y huecos misteriosos</a></li>
-</ul>
-<h3 id="Enlaces_relacionados" name="Enlaces_relacionados">Enlaces relacionados</h3>
-<ul>
- <li><a href="es/Selecci%c3%b3n_de_modo_en_Mozilla">Selección de modo en Mozilla</a></li>
- <li><span class="comment">no sé si publicar esta sección: &lt;div class="originaldocinfo"&gt; == Original Document Information == * Author(s): Eric A. Meyer, Netscape Communications * Last Updated Date: Published 08 Nov 2002 * Cop</span></li>
-</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/anatomia_de_una_webextension/index.html b/files/es/mozilla/add-ons/webextensions/anatomia_de_una_webextension/index.html
deleted file mode 100644
index 685e282bf9..0000000000
--- a/files/es/mozilla/add-ons/webextensions/anatomia_de_una_webextension/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: Anatomía de una extension
-slug: Mozilla/Add-ons/WebExtensions/Anatomia_de_una_WebExtension
-tags:
-  - WebExtensions
-translation_of: Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension
----
-<div>{{AddonSidebar}}</div>
-
-<p>Una extensión se compone de una colección de archivos, empaquetados para su distribución e instalación. En este artículo vamos a repasar rápidamente los archivos que deben estar presentes en una extensión.</p>
-
-<p>Toda extensión debe contener un archivo llamado <a href="/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#manifest.json">"manifest.json"</a>. Este puede tener enlaces a otros tipos de archivos:</p>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Scripts_en_segundo_plano">Páginas en segundo plano</a>: implementan la lógica de larga ejecución.</li>
- <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Scripts_de_contenido">Scripts de contenido</a>: interactúan con las páginas web (note que esto no es lo mismo que JavaScript en un elemento {{HTMLElement("script")}} dentro de una página).</li>
- <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Acciones_del_navegador_2">Archivos de acción del navegador</a>: implementan los botones de la barra de herramientas.</li>
- <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Acciones_de_las_páginas">Archivos de acción de la página: </a>Implementan botones en la barra de direcciones.</li>
- <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Opciones_de_las_páginas">Páginas de opciones</a>: Definen una IU para que los usuarios vean y cambien las configuraciones de la extensión.</li>
- <li>
-  <div id="gt-res-content">
-  <div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr"><span id="result_box" lang="es"><span><a href="/es/Add-ons/WebExtensions/user_interface/Sidebars">archivos de la barra lateral</a>: agregue una barra lateral al navegador.</span></span></div>
-  </div>
- </li>
- <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Recursos_web_accesibles">Recursos Web accesibles</a>: Hace posible que el contenido empaquetado acceda a páginas web y scripts.</li>
-</ul>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13669/webextension-anatomy.png" style="display: block; height: 581px; margin-left: auto; margin-right: auto; width: 600px;"></p>
-
-<h2 id="manifest.json">manifest.json</h2>
-
-<p>Este es el único archivo que debe estar presente en toda WebExtension. Este contiene los metadatos básicos acerca de la extensión, como su nombre, versión, y los permisos que esta requiere. También provee los enlaces a otros archivos de la extensión.</p>
-
-<p>Mira la página de referencia <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest.json</a> para ver todos los detalles.</p>
-
-<h2 id="Scripts_en_segundo_plano">Scripts en segundo plano</h2>
-
-<p>Las extensiones a menudo necesitan mantener estados de larga duración, o ejecutar operaciones a largo plazo, independientemente del tiempo de vida de una página web en particular o las ventanas del navegador. Para eso son los scripts en segundo plano.</p>
-
-<p>Los scripts en segundo plano son cargados cuando la extensión es cargada y se mantienen cargados hasta que la extensión es deshabilitada o desinstalada. Tu puedes usar cualquier <a href="/es/Add-ons/WebExtensions/API">API de WebExtensions</a> en el script, siempre y cuando hayas solicitado el <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permiso</a> necesario.</p>
-
-<h3 id="Especificando_los_scripts_en_segundo_plano">Especificando los scripts en segundo plano</h3>
-
-<p>Puedes incluir un script en segundo plano usando la propiedad <code>background</code> en "manifest.json":</p>
-
-<pre class="brush: json">// manifest.json
-
-"background": {
-  "scripts": ["background-script.js"]
-}</pre>
-
-<p>Puedes especificar múltiples scripts en segundo plano: si lo haces, ellos se ejecutarán en el mismo contexto, justo como son cargados múltiples scripts en una página web.</p>
-
-<h3 id="Entorno_del_script_en_segundo_plano">Entorno del script en segundo plano</h3>
-
-<h4 id="APIs_del_DOM">APIs del DOM</h4>
-
-<p>Los scripts en segundo plano se ejecuta en el contexto de páginas especiales llamadas páginas en segundo plano. Esto le da un variable global <code><a href="/es/docs/Web/API/Window">window</a></code>, junto con todas las APIs estándar del DOM que proporciona.</p>
-
-<p>No necesitas proveer tu propia página en segundo plano. Si incluyes un script en segundo plano, una página en segundo plano vacía se creará para ti.</p>
-
-<p>Sin embargo, puedes escoger y proveer tu página en segundo plano como un archivo HTML separado:</p>
-
-<pre class="brush: json">// manifest.json
-
-"background": {
-  "page": "background-page.html"
-}</pre>
-
-<h4 id="APIs_de_WebExtension">APIs de WebExtension</h4>
-
-<p>Los scripts en segundo plano pueden usar cualquier <a href="/es/Add-ons/WebExtensions/API">API de WebExtension</a> en el script, siempre que tu extensión tenga los <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permisos</a> necesarios.</p>
-
-<h4 id="Acceso_de_origen_cruzado">Acceso de origen cruzado</h4>
-
-<p>Los scripts en segundo plano pueden hacer peticiones XHR a cualquier host para los cuales tienen <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permisos del host</a>.</p>
-
-<h4 id="Acciones_del_navegador">Acciones del navegador</h4>
-
-<p>Si tu extensión define una acción del navegador, y esa acción del navegador no tiene ventanas emergentes, entonces puedes escuchar los eventos "clic" del botón en el navegador empleando el objeto <code><a href="/es/Add-ons/WebExtensions/API/browserAction#onClicked">onClicked</a></code> de las acciones del navegador:</p>
-
-<pre class="brush: js">browser.browserAction.onClicked.addListener(handleClick);</pre>
-
-<h4 id="Contenido_web">Contenido web</h4>
-
-<p>Los scripts en segundo plano no tienen acceso directo a las páginas web. Sin embargo, pueden cargar <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">scripts de contenido</a> en páginas web, y <a href="/en-US/Add-ons/WebExtensions/Content_scripts#Communicating_with_background_scripts">comunicarse con esos scripts empleando la API de paso de mensajes</a>.</p>
-
-<h4 id="Políticas_de_segurdiad_para_el_contendio">Políticas de segurdiad para el contendio</h4>
-
-<p>Los scripts de segundo plano están restringidos de algunas operaciones dañinas, como el uso de <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval">eval()</a></code>, a través de la  Política de Seguridad del Contenido. Vea la <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_Security_Policy">Política de Segurdiad del Contenido </a>para más detalles sobre esto.</p>
-
-<h2 id="Scripts_de_contenido">Scripts de contenido</h2>
-
-<p>Usa los scripts de contenido para acceder y manipular páginas web. Los scripts de contenido son cargados dentro de las páginas web y ejecutados en el contexto particular de esa página.</p>
-
-<p>Los scripts de contenido son scripts provistos por la extensión los cuales se ejecutan en el contexto de la página web; estos difieren de los scripts que son cargados por la página misma, incluye aquellos que son proporcionados en los elementos {{HTMLElement("script")}} dentro de la página.</p>
-
-<p>Los scripts de contenido pueden ver y manipular el DOM de las páginas, igual que los scripts cargados normalmente por la página.</p>
-
-<p>A diferencia de los scripts normales, ellos pueden:</p>
-
-<ul>
- <li>Realizar peticiones XHR de dominio cruzado</li>
- <li>Usar un pequeño subconjunto de las <a href="/es/docs/Mozilla/Add-ons/WebExtensions/API">APIs de WebExtension</a></li>
- <li>Intercambiar mensajes con sus scripts en segundo plano, y por esta vía, tener acceso indirecto a todas las APIs de WebExtension.</li>
-</ul>
-
-<p>Los scripts de contenido no pueden acceder directamente a los scripts normales de una página web, pero pueden intercambiar mensajes con ellos usando la API estándar <code><a href="/es/docs/Web/API/Window/postMessage">window.postMessage()</a></code>.</p>
-
-<p>Generalmente, cuando hablamos acerca de scripts de contenido, nos referimos a JavaScript, pero tu puedes inyectar CSS dentro de las páginas web empleando el mismo mecanismo.</p>
-
-<p>Mira el artículo <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">scripts de contenido</a> para aprender más.</p>
-
-<h2 id="Recursos_web_accesibles">Recursos web accesibles</h2>
-
-<p>Los recursos web accesibles son recursos como imágenes, HTML, CSS y JavaScript que tu puedes incluir en la extensión y los quieres hacer accesible a los scripts en segundo plano y los scripts de las páginas. Los recursos que son hechos accesibles desde la web pueden ser referenciados desde scripts de páginas web y scripts de contenido mediante un esquema especial de URI.</p>
-
-<p>Por ejemplo, si un script de contenido quiere insertar algunas imágenes dentro de páginas web, tu puedes incluirlos en la extensión y hacerlos accesibles desde la web. El script de contenido creará y añadirá las etiquetas <code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img">img</a></code> que referencia a las imágenes mediante el atributo <code>src</code>.</p>
-
-<p>Para aprender más, vea la documentación para la el parámetro <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources">web_accessible_resource</a> del manifest.json.</p>
diff --git a/files/es/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html b/files/es/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html
new file mode 100644
index 0000000000..20abaa7585
--- /dev/null
+++ b/files/es/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html
@@ -0,0 +1,121 @@
+---
+title: Anatomía de una extension
+slug: Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension
+tags:
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension
+original_slug: Mozilla/Add-ons/WebExtensions/Anatomia_de_una_WebExtension
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Una extensión se compone de una colección de archivos, empaquetados para su distribución e instalación. En este artículo vamos a repasar rápidamente los archivos que deben estar presentes en una extensión.</p>
+
+<p>Toda extensión debe contener un archivo llamado <a href="/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#manifest.json">"manifest.json"</a>. Este puede tener enlaces a otros tipos de archivos:</p>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Scripts_en_segundo_plano">Páginas en segundo plano</a>: implementan la lógica de larga ejecución.</li>
+ <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Scripts_de_contenido">Scripts de contenido</a>: interactúan con las páginas web (note que esto no es lo mismo que JavaScript en un elemento {{HTMLElement("script")}} dentro de una página).</li>
+ <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Acciones_del_navegador_2">Archivos de acción del navegador</a>: implementan los botones de la barra de herramientas.</li>
+ <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Acciones_de_las_páginas">Archivos de acción de la página: </a>Implementan botones en la barra de direcciones.</li>
+ <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Opciones_de_las_páginas">Páginas de opciones</a>: Definen una IU para que los usuarios vean y cambien las configuraciones de la extensión.</li>
+ <li>
+  <div id="gt-res-content">
+  <div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr"><span id="result_box" lang="es"><span><a href="/es/Add-ons/WebExtensions/user_interface/Sidebars">archivos de la barra lateral</a>: agregue una barra lateral al navegador.</span></span></div>
+  </div>
+ </li>
+ <li><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Recursos_web_accesibles">Recursos Web accesibles</a>: Hace posible que el contenido empaquetado acceda a páginas web y scripts.</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13669/webextension-anatomy.png" style="display: block; height: 581px; margin-left: auto; margin-right: auto; width: 600px;"></p>
+
+<h2 id="manifest.json">manifest.json</h2>
+
+<p>Este es el único archivo que debe estar presente en toda WebExtension. Este contiene los metadatos básicos acerca de la extensión, como su nombre, versión, y los permisos que esta requiere. También provee los enlaces a otros archivos de la extensión.</p>
+
+<p>Mira la página de referencia <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest.json</a> para ver todos los detalles.</p>
+
+<h2 id="Scripts_en_segundo_plano">Scripts en segundo plano</h2>
+
+<p>Las extensiones a menudo necesitan mantener estados de larga duración, o ejecutar operaciones a largo plazo, independientemente del tiempo de vida de una página web en particular o las ventanas del navegador. Para eso son los scripts en segundo plano.</p>
+
+<p>Los scripts en segundo plano son cargados cuando la extensión es cargada y se mantienen cargados hasta que la extensión es deshabilitada o desinstalada. Tu puedes usar cualquier <a href="/es/Add-ons/WebExtensions/API">API de WebExtensions</a> en el script, siempre y cuando hayas solicitado el <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permiso</a> necesario.</p>
+
+<h3 id="Especificando_los_scripts_en_segundo_plano">Especificando los scripts en segundo plano</h3>
+
+<p>Puedes incluir un script en segundo plano usando la propiedad <code>background</code> en "manifest.json":</p>
+
+<pre class="brush: json">// manifest.json
+
+"background": {
+  "scripts": ["background-script.js"]
+}</pre>
+
+<p>Puedes especificar múltiples scripts en segundo plano: si lo haces, ellos se ejecutarán en el mismo contexto, justo como son cargados múltiples scripts en una página web.</p>
+
+<h3 id="Entorno_del_script_en_segundo_plano">Entorno del script en segundo plano</h3>
+
+<h4 id="APIs_del_DOM">APIs del DOM</h4>
+
+<p>Los scripts en segundo plano se ejecuta en el contexto de páginas especiales llamadas páginas en segundo plano. Esto le da un variable global <code><a href="/es/docs/Web/API/Window">window</a></code>, junto con todas las APIs estándar del DOM que proporciona.</p>
+
+<p>No necesitas proveer tu propia página en segundo plano. Si incluyes un script en segundo plano, una página en segundo plano vacía se creará para ti.</p>
+
+<p>Sin embargo, puedes escoger y proveer tu página en segundo plano como un archivo HTML separado:</p>
+
+<pre class="brush: json">// manifest.json
+
+"background": {
+  "page": "background-page.html"
+}</pre>
+
+<h4 id="APIs_de_WebExtension">APIs de WebExtension</h4>
+
+<p>Los scripts en segundo plano pueden usar cualquier <a href="/es/Add-ons/WebExtensions/API">API de WebExtension</a> en el script, siempre que tu extensión tenga los <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permisos</a> necesarios.</p>
+
+<h4 id="Acceso_de_origen_cruzado">Acceso de origen cruzado</h4>
+
+<p>Los scripts en segundo plano pueden hacer peticiones XHR a cualquier host para los cuales tienen <a href="/es/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permisos del host</a>.</p>
+
+<h4 id="Acciones_del_navegador">Acciones del navegador</h4>
+
+<p>Si tu extensión define una acción del navegador, y esa acción del navegador no tiene ventanas emergentes, entonces puedes escuchar los eventos "clic" del botón en el navegador empleando el objeto <code><a href="/es/Add-ons/WebExtensions/API/browserAction#onClicked">onClicked</a></code> de las acciones del navegador:</p>
+
+<pre class="brush: js">browser.browserAction.onClicked.addListener(handleClick);</pre>
+
+<h4 id="Contenido_web">Contenido web</h4>
+
+<p>Los scripts en segundo plano no tienen acceso directo a las páginas web. Sin embargo, pueden cargar <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">scripts de contenido</a> en páginas web, y <a href="/en-US/Add-ons/WebExtensions/Content_scripts#Communicating_with_background_scripts">comunicarse con esos scripts empleando la API de paso de mensajes</a>.</p>
+
+<h4 id="Políticas_de_segurdiad_para_el_contendio">Políticas de segurdiad para el contendio</h4>
+
+<p>Los scripts de segundo plano están restringidos de algunas operaciones dañinas, como el uso de <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval">eval()</a></code>, a través de la  Política de Seguridad del Contenido. Vea la <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_Security_Policy">Política de Segurdiad del Contenido </a>para más detalles sobre esto.</p>
+
+<h2 id="Scripts_de_contenido">Scripts de contenido</h2>
+
+<p>Usa los scripts de contenido para acceder y manipular páginas web. Los scripts de contenido son cargados dentro de las páginas web y ejecutados en el contexto particular de esa página.</p>
+
+<p>Los scripts de contenido son scripts provistos por la extensión los cuales se ejecutan en el contexto de la página web; estos difieren de los scripts que son cargados por la página misma, incluye aquellos que son proporcionados en los elementos {{HTMLElement("script")}} dentro de la página.</p>
+
+<p>Los scripts de contenido pueden ver y manipular el DOM de las páginas, igual que los scripts cargados normalmente por la página.</p>
+
+<p>A diferencia de los scripts normales, ellos pueden:</p>
+
+<ul>
+ <li>Realizar peticiones XHR de dominio cruzado</li>
+ <li>Usar un pequeño subconjunto de las <a href="/es/docs/Mozilla/Add-ons/WebExtensions/API">APIs de WebExtension</a></li>
+ <li>Intercambiar mensajes con sus scripts en segundo plano, y por esta vía, tener acceso indirecto a todas las APIs de WebExtension.</li>
+</ul>
+
+<p>Los scripts de contenido no pueden acceder directamente a los scripts normales de una página web, pero pueden intercambiar mensajes con ellos usando la API estándar <code><a href="/es/docs/Web/API/Window/postMessage">window.postMessage()</a></code>.</p>
+
+<p>Generalmente, cuando hablamos acerca de scripts de contenido, nos referimos a JavaScript, pero tu puedes inyectar CSS dentro de las páginas web empleando el mismo mecanismo.</p>
+
+<p>Mira el artículo <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">scripts de contenido</a> para aprender más.</p>
+
+<h2 id="Recursos_web_accesibles">Recursos web accesibles</h2>
+
+<p>Los recursos web accesibles son recursos como imágenes, HTML, CSS y JavaScript que tu puedes incluir en la extensión y los quieres hacer accesible a los scripts en segundo plano y los scripts de las páginas. Los recursos que son hechos accesibles desde la web pueden ser referenciados desde scripts de páginas web y scripts de contenido mediante un esquema especial de URI.</p>
+
+<p>Por ejemplo, si un script de contenido quiere insertar algunas imágenes dentro de páginas web, tu puedes incluirlos en la extensión y hacerlos accesibles desde la web. El script de contenido creará y añadirá las etiquetas <code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img">img</a></code> que referencia a las imágenes mediante el atributo <code>src</code>.</p>
+
+<p>Para aprender más, vea la documentación para la el parámetro <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources">web_accessible_resource</a> del manifest.json.</p>
diff --git a/files/es/mozilla/add-ons/webextensions/depuración/index.html b/files/es/mozilla/add-ons/webextensions/depuración/index.html
deleted file mode 100644
index c24f9d07f5..0000000000
--- a/files/es/mozilla/add-ons/webextensions/depuración/index.html
+++ /dev/null
@@ -1,189 +0,0 @@
----
-title: Depuración
-slug: Mozilla/Add-ons/WebExtensions/Depuración
-tags:
-  - WebExtensions
-translation_of: Mozilla/Add-ons/WebExtensions/Debugging
----
-<div>{{AddonSidebar}}</div>
-
-<div class="note">
-<p>Las técnicas descritas aquí funcionan en Firefox 50 y versiones sucesivas. Si necesitas usar una versión anterior de Firefox, por favor ve al artículo <a href="/en-US/Add-ons/WebExtensions/Debugging_(before_Firefox_50)">debugging extensions using WebExtension APIs before Firefox 50</a>.</p>
-</div>
-
-<p>Este artículo explica cómo se pueden usar las herramientas de desarrollo de Firefox para depurar extensiones creadas con las WebExtension APIs.</p>
-
-<p>Una WebExtension puede consistir en varias partes distintas — scripts en segundo plano, popups, options pages, content scripts — y se tendrá que usar un proceso ligeramente distinto para depurar cada parte. Así, cada parte tendrá una sección principal en este artículo, y el objetivo es que esas secciones se puedan leer de forma independiente. Empezaremos presentando el Depurador de Add-on, que será usado para depurar la mayoría de las partes de un complemento.</p>
-
-<ul>
-</ul>
-
-<h2 class="western" id="El_Depurador_de_Add-on">El Depurador de Add-on</h2>
-
-<p>Para la mayor parte de este artículo utilizaremos el Depurador de Add-on. Para abrir el Depurador de Add-on:</p>
-
-<ul>
- <li>
-  <p style="margin-bottom: 0cm;">abrir Firefox</p>
- </li>
- <li>
-  <p style="margin-bottom: 0cm;">escribir "about:debugging" en la barra de direcciones</p>
- </li>
- <li>
-  <p style="margin-bottom: 0cm;">marcar la casilla en la que pone "Activar depuración de complementos"</p>
- </li>
- <li>
-  <p style="margin-bottom: 0cm;">hacer click en el botón "Depurar" al lado del complemento</p>
- </li>
- <li>
-  <p>hacer click en "Aceptar" en el cuadro de alerta</p>
- </li>
-</ul>
-
-<p>Se abrirá entonces una nueva ventana. La ventana principal de Firefox se pondrá en primer plano, así que se tendrá que hacer click en la nueva ventana para que aparezca en primer plano.</p>
-
-<p>{{EmbedYouTube("HMozipAjrYA")}}</p>
-
-<p>Esta nueva ventana se llama "Herramientas de desarrollo" y contiene las herramientas de depuración que se usarán. La interfaz tiene varias pestañas en la parte de arriba que permiten moverse por las herramientas disponibles:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13861/toolbox-tabs.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;"></p>
-
-<p>En este artículo usaremos tres herramientas de depuración:</p>
-
-<ul>
- <li>
-  <p style="margin-bottom: 0cm;"><a href="https://developer.mozilla.org/es/docs/Tools/Web_Console">La Consola</a>: muestra mensajes registrados por la extensión así como mensajes de error registrados por el navegador mientras ejecuta la extensión. También proporciona una línea de comandos, habilitando la ejecución de JavaScript en el contexto de la extensión.</p>
- </li>
- <li>
-  <p style="margin-bottom: 0cm;"><a href="https://developer.mozilla.org/es/docs/Tools/Debugger">El Depurador</a>: habilita el uso de breakpoints y watchpoints en el código JavaScript de la extensión, y examina y modifica su estado interno.</p>
- </li>
- <li>
-  <p><a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector">El Inspector</a>: habilita la revisión y modificación del HTML y CSS usado para construir las páginas de la extensión.</p>
- </li>
-</ul>
-
-<h2 class="western" id="Depurando_scripts_en_segundo_plano">Depurando scripts en segundo plano</h2>
-
-<div class="note">
-<p>Los ejemplos de esta sección usan la extensión de ejemplo "notify-link-clicks-l10n". Para explorar las opciones, se puede encontrar este ejemplo en el repositorio <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a>.</p>
-</div>
-
-<p>Los <a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Scripts_en_segundo_plano">scripts en segundo plano</a> permanecen cargados durante el tiempo de vida de la extensión. Se cargan dentro de una “página en segundo plano” invisible: por defecto, es un documento HTML vacío, pero se puede especificar contenido HTML propio usando la palabra clave <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/background">"background"</a> en “manifest.json”.</p>
-
-<p>Se pueden depurar scripts en segundo plano usando el <a href="/en-US/Add-ons/WebExtensions/Debugging_(Firefox_50_onwards)#The_Add-on_Debugger">Depurador de Add-ons</a>.</p>
-
-<p>En la Consola del Depurador de Add-ons se puede ver un registro de las salidas, incluidas las llamadas a <code><a href="/en-US/docs/Web/API/Console/log">console.log()</a></code> desde los propios scripts en segundo plano y cualquier error que el navegador encuentre al ejecutarlos. Es importante mencionar que la consola muestra todos los errores detectados por el navegador, no sólo los errores relacionados con el código de la extensión.</p>
-
-<p>Por ejemplo, la extensión de ejemplo <a href="https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n">notify-link-clicks-i18n</a> registra un mensaje de su script en segundo plano cuando recibe un mensaje de uno de sus otros scripts:</p>
-
-<p>{{EmbedYouTube("WDQsBU-rpN0")}}</p>
-
-<p>Usando la línea de comandos de la Consola, se pueden acceder y modificar los objetos creados por los scripts en segundo plano.</p>
-
-<p>Por ejemplo, aquí se hace un allamada a la función <code>notify()</code> definida en el script en segundo plano de la extensión:</p>
-
-<p>{{EmbedYouTube("g-Qgf8Mc2wg")}}</p>
-
-<p>Si se mira la ventana del Depurador, se pueden ver todos los scripts en segundo plano de la extensión. Se pueden definir breakpoints, ver el código paso a paso y hacer <a href="https://developer.mozilla.org/es/docs/Tools/Debugger">todo lo que es posible hacer en un depurador</a>.</p>
-
-<p>{{EmbedYouTube("MNeaz2jdmzY")}}</p>
-
-<p>Si se pulsa la tecla de Escape mientras se está en el Depurador, la ventana de Herramientas de desarrollo se dividirá en dos, con la parte de abajo ocupada ahora por la Consola. Ahora, mientras se esté en un breakpoint, se puede modificar el estado del programa usando la consola. Ver <a href="/en-US/docs/Tools/Web_Console/Split_console">Dividir la Consola</a> para más información.</p>
-
-<h2 class="western" id="Depurando_páginas_de_opciones">Depurando páginas de opciones</h2>
-
-<p>Las <font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#P%C3%A1gina_de_opciones">páginas de opciones</a></u></span></font> son páginas HTML que pueden ser proporcionadas por la persona que desarrolle la extensión y contienen opciones para la misma. Se muestran normalmente en un iframe en el Add-ons Manager (para ver el Add-ons Manager, visita la página "about:addons").</p>
-
-<p>Para depurar páginas de opciones:</p>
-
-<ul>
- <li>
-  <p style="margin-bottom: 0cm;">abrir el <font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging#The_Add-on_Debugger">Depurador de Add-on</a></u></span></font> para la add-on en cuestión</p>
- </li>
- <li>
-  <p>abrir la página de opciones de la add-on.</p>
- </li>
-</ul>
-
-<p>Cualquier archivo fuente en JavaScript que incluya será listado en el Depurador:</p>
-
-<p>{{EmbedYouTube("BUMG-M8tFF4")}}</p>
-
-<div class="note">
-<p>Este vídeo usa el ejemplo de WebExtension <font color="#000080"><span lang="zxx"><u><a href="https://github.com/mdn/webextensions-examples/tree/master/favourite-colourbeastify">favourite-colour</a></u></span></font>.</p>
-</div>
-
-<p>También se verá cualquier mensaje registrado por el código en la Consola del Depurador de Add-on.</p>
-
-<p>También se puede usar el Depurador de Add-on para depurar el código HTML y CSS de la página. Pero primero se necesita dirigir las herramientas al iframe que alberga la página de opciones. Para hacer esto: abre la página de opciones, haz clic en el icono indicado en la captura de pantalla mostrada a continuación y selecciona la página de opciones del menú desplegable:</p>
-
-<p class="western" style="margin-bottom: 0cm; line-height: 100%;"><img alt="" src="https://mdn.mozillademos.org/files/13863/toolbox-iframe.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;">Ahora al cambiar a la pestaña Inspector se podrá examinar y editar el HTML y CSS para la página:</p>
-
-<p class="western" style="margin-bottom: 0cm; line-height: 100%;"> </p>
-
-<p>{{EmbedYouTube("-2m3ubFAU94")}}</p>
-
-<h2 class="western" id="Depurando_ventanas_emergentes">Depurando ventanas emergentes</h2>
-
-<p><font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/user_interface/Popups">Las ventanas emergentes</a></u></span></font> son cuadros de diálogo unidos a acciones del navegador o de la página. Se especifican usando un documento HTML que puede incluir fuentes CSS y JavaScript para determinar el estilo y el funcionamiento. Cuando la ventana emergente es visible, se puede usar el <a href="/en-US/Add-ons/WebExtensions/Debugging_(Firefox_50_onwards)#The_Add-on_Debugger">Depurador de Add-on</a> para depurar su código.</p>
-
-<p>Un problema con las ventanas emergentes es que si una ventana emergente está abierta y se hace clic fuera de ella, esta se cierra y su código se descarga. Obviamente, esto hace que sea imposible depurarlas. Para eliminar este comportamiento, se debe hacer clic en el botón del Depurador de Add-on destacado en la captura de pantalla mostrada a continuación:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13877/toolbox-popup.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;"></p>
-
-<p class="western" style="margin-bottom: 0cm; line-height: 100%;">Ahora, al abrir una ventana emergente esta continuará abierta hasta que se pulse Escape.</p>
-
-<p class="western" style="margin-bottom: 0cm; line-height: 100%;"> </p>
-
-<div class="note">
-<p>Es importante señalar que esta opción está disponible para ventanas emergentes desarrolladas para el navegador, como el menú de hamburguesa (<img style="height: 20px; width: 22px;"> ), así como a ventanas emergentes propias de la add-on.</p>
-
-<p>También es importante notar que el cambio es persistente, incluso aunque el navegador se reinicie. Estamos trabajando en solucionar esto en el <font color="#000080"><span lang="zxx"><u><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1251658">bug 1251658</a></u></span></font>, pero hasta entonces puede ser mejor permitir de nuevo la ocultación automática<strong> </strong>volviendo a hacer clic en el botón antes de cerrar la Caja de Herramientas del Navegador.</p>
-
-<p>Internamente, este botón simplemente cambia la preferencia <code class="western">ui.popup.disable_autohide</code>, lo que se puede hacer manualmente usando about:config.</p>
-</div>
-
-<p>Cuando la ventana emergente está abierta, sus fuentes de JavaScript se listarán en el Depurador. Se pueden colocar breakpoints y modificar el estado interno del programa:</p>
-
-<p>{{EmbedYouTube("hzwnR8qoz2I")}}</p>
-
-<div class="note">
-<p>Este vídeo usa la extensión de ejemplo <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">beastify</a>.</p>
-</div>
-
-<p>También se puede usar el Depurador de Add-on para depurar el código HTML y CSS de la ventana emergente. Pero primero se necesita dirigir las herramientas al documento de la ventana emergente. Para hacer esto: abre la ventana emergente, haz clic en el icono indicado en la captura de pantalla mostrada a continuación y selecciona la página de la ventana emergente del menú desplegable:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13863/toolbox-iframe.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;"></p>
-
-<p>Ahora al cambiar a Inspector se podrán examinar y editar el HTML y el CSS de la ventana emergente:</p>
-
-<p>{{EmbedYouTube("6lvdm7jaq7Y")}}</p>
-
-<h2 class="western" id="Depurando_scripts_de_contenido">Depurando scripts de contenido</h2>
-
-<p>Se puede usar el Depurador de Add-on para depurar páginas en segundo plano, páginas de opciones y ventanas emergentes. Sin embargo, no se puede usar para depurar scripts de contenido. Esto es debido a que, en <font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/es/Firefox/Multiprocess_Firefox">Firefox multiproceso</a></u></span></font>, los scripts de contenido se ejecutan en un proceso distinto del de otras partes de la add-on.</p>
-
-<p>Para depurar scripts de contenido adjuntos a una página web, se deben usar las herramientas de desarrollo web normales para esa página:</p>
-
-<ul>
- <li>
-  <p style="margin-bottom: 0cm;">selecciona “Alternar herramientas” del submenú Desarrollador Web en el menú Firefox (o el menú de herramientas si se muestra la barra de menú o se está utilizando Mac OS X)</p>
- </li>
- <li>
-  <p>o presiona el método abreviado del teclado <kbd>CtrlShiftI</kbd> (<kbd>CommandOptionI</kbd> en OS X).</p>
- </li>
-</ul>
-
-<p>{{EmbedYouTube("f46hMLELyaI")}}</p>
-
-<p>Por defecto, las herramientas se muestran al pie de la pestaña de desarrollo, para reflejar que están relacionadas con esa pestaña. Cualquier salida de las instrucciones <code class="western"><a>console.log()</a></code> de los scripts de contenido será mostrada allí. También se verán los scripts de contenido listados en el Depurador, donde se podrán colocar breakpoints, avanzar en el código, etc.</p>
-
-<p>{{EmbedYouTube("Hx3GU_fEPeo")}}</p>
-
-<div class="note">
-<p>Este video usa el ejemplo <font color="#000080"><span lang="zxx"><u><a href="https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n">notify-link-clicks-i18n</a></u></span></font> de WebExtension.</p>
-</div>
-
-<div class="note">
-<p style="line-height: 120%;">Si la pestaña de Herramientas de Desarrollo no estaba abierta cuando el scripts de contenido se introdujo, puede ocurrir que el scripts de contenido no aparezca en el panel de depuración. Si esto ocurre, recargar la página que contiene la pestaña de Herramientas de Desarrollo debería solucionar el problema.</p>
-</div>
diff --git a/files/es/mozilla/add-ons/webextensions/packaging_and_installation/index.html b/files/es/mozilla/add-ons/webextensions/packaging_and_installation/index.html
deleted file mode 100644
index 7718e990f3..0000000000
--- a/files/es/mozilla/add-ons/webextensions/packaging_and_installation/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: Empaquetado e Instalación
-slug: Mozilla/Add-ons/WebExtensions/Packaging_and_installation
-translation_of: Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox
-translation_of_original: Mozilla/Add-ons/WebExtensions/Packaging_and_installation
----
-<h2 id="Empaquetando_tu_extensión">Empaquetando tu extensión</h2>
-
-<div class="note">
-<p>Mozilla actualmente esta considerando implementar una aplicación con interfaz visual para empaquetar y cargar extensiones. Mira el <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1185460">Bug 1185460</a> para más información. Hasta entonces, sigue los pasos que aparecen a continuación.</p>
-</div>
-
-<p>Las extensiones para Firefox son empaquetadas como archivos XPI, los cuales son solamente archivos ZIP, con extensión "xpi".</p>
-
-<p>Un truco es que el archivo ZIP debe ser un archivo que contenga los archivos de la extensión y no la carpeta que los contiene.</p>
-
-<h3 id="Windows">Windows</h3>
-
-<ol>
- <li>Abre la carpeta que contiene los archivos de tu extensión.</li>
- <li>Selecciona todos los archivos.</li>
- <li>Con clic derecho elige Enviar a  → Carpeta comprimida (zip).</li>
- <li>Cambia el nombre del archivo resultante de <code>something.zip</code> a <code>something.xpi</code>.</li>
-</ol>
-
-<p><img alt="Screenshot of the Windows Explorer context menu showing Send to compressed (zipped) folder" src="https://mdn.mozillademos.org/files/11717/pUF1vnr.png" style="height: 641px; width: 904px;"></p>
-
-<h3 id="Mac_OS_X">Mac OS X</h3>
-
-<ol>
- <li>Abre la carpeta que contiene los archivos de tu extensión.</li>
- <li>Selecciona todos los archivos.</li>
- <li>Con clic derecho elige Comprimir <em>n</em> elementos.</li>
- <li>Cambia el nombre del archivo resultante de <code>something.zip</code> a <code>something.xpi</code>.</li>
-</ol>
-
-<p><img alt="Screenshot of the Finder context menu showing the Compress 15 Items option" src="https://mdn.mozillademos.org/files/11715/Screen%20Shot%202015-10-08%20at%2016.19.02.png" style="height: 460px; width: 850px;"></p>
-
-<h3 id="Linux_Mac_OS_X_Terminal">Linux / Mac OS X Terminal</h3>
-
-<ol>
- <li><code>cd path/to/my-extension/</code></li>
- <li><code>zip -r ../my-extension.xpi *</code></li>
-</ol>
-
-<h2 id="Instalando_tu_extensión">Instalando tu extensión</h2>
-
-<ol>
- <li>Navega a <code>about:addons</code></li>
- <li>Arrastra y suelta el XPI dentro de la página, o abre el menú de opciones y escoge "Instalar complemento desde archivo..."</li>
- <li>Da clic en "Instalar" en el diálogo que aparecerá</li>
-</ol>
-
-<h2 id="Instalando_tu_extensión_en_Firefox_OS">Instalando tu extensión en Firefox OS</h2>
-
-<p>Tu puedes instalar tu extensión desde WebIDE en un escritorio conectado vía USB o Wifi. Abre <code>path/to/my-extension/ como una Aplicación empaquetada en WebIDE.</code></p>
-
-<p><code>Cuando la validación de manifest.json es correcta podrás instalar y ejecutar tu extensión en el dispositivo con Firefox OS conectado.</code></p>
-
-<p><code>Para instalar extensiones debe tener habilitada la opción en Configuración-&gt;Complementos del dispositivo con Firefox OS.</code></p>
-
-<h2 id="Resolución_de_problemas">Resolución de problemas</h2>
-
-<p>Aquí están algunos de los problemas más comunes que podrías encontrarte:</p>
-
-<h3 id="Este_complemento_no_puede_ser_instalado_porque_no_ha_sido_verificado.">"Este complemento no puede ser instalado porque no ha sido verificado."</h3>
-
-<ul>
- <li>Asegúrate que estás usando <a href="https://nightly.mozilla.org/">Nightly</a> y la preferencia <code>xpinstall.signatures.required</code> está en <code>false</code> en <code>about:config</code>.</li>
- <li>Aprende más acerca de <a href="/en-US/docs/Mozilla/Add-ons/Distribution">la firma de complementos y su distribución</a>.</li>
-</ul>
-
-<h3 id="Este_complemento_no_puede_ser_instalado_porque_para_estar_corrupto.">"Este complemento no puede ser instalado porque para estar corrupto."</h3>
-
-<ul>
- <li>Asegúrate que has comprimido los archivos directamente, <em>no la carpeta que contiene</em> los archivos de tu extensión. Tu archivo manifest.json debe estar en la carpeta raíz del archivo ZIP.</li>
- <li>Asegúrate que estás usando la versión <a href="https://nightly.mozilla.org/">Nightly</a> de Firefox.</li>
-</ul>
-
-<h3 id="No_pasa_nada">No pasa nada</h3>
-
-<ul>
- <li>Asegúrate que tu archivo actualmente termina en <code>.xpi</code>, existen algunos <em>sistemas operativos que le gusta ocultar</em> las extensiones de los archivos.
-
-  <ul>
-   <li>En Windows, comprueba con Vista → Mostrar / Ocultar: Extensiones de los archivos.</li>
-   <li>En Mac OS X, comprueba con Archivo → Obtener información → Nombre y Extensión.</li>
-  </ul>
- </li>
- <li>Es posible que te hayas perdido u ocultado el diálogo de instalación. Mira si un icono parecido a una pieza de rompecabezas está al lado del botón Atrás en Nightly. Has clic sobre él para trae nuevamente el diálogo de instalación.</li>
-</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/porting_from_google_chrome/index.html b/files/es/mozilla/add-ons/webextensions/porting_from_google_chrome/index.html
deleted file mode 100644
index 58959678f4..0000000000
--- a/files/es/mozilla/add-ons/webextensions/porting_from_google_chrome/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: Conversión de extensiones de Google Chrome
-slug: Mozilla/Add-ons/WebExtensions/Porting_from_Google_Chrome
-tags:
-  - WebExtensions
-translation_of: Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension
----
-<div>{{AddonSidebar}}</div>
-
-<p>Las extensiones programadas con API de WebExtensions están diseñadas para ser compatibles entre navegadores diferentes: en buena medida, esta tecnología es compatible directamente con la <a class="external external-icon" href="https://developer.chrome.com/extensions">API de extensiones</a> admitida por Google Chrome y Opera. En la mayoría de los casos, las extensiones creadas para estos navegadores se ejecutarán en Firefox con solo unas pocas modificaciones. Casi todas las <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API">API de extensiones</a> se admiten a través de funciones de devolución de llamada bajo el espacio de nombres <code>chrome</code>, al igual que Chrome. Las únicas API que no se admiten bajo el espacio de nombres <code>chrome</code> son aquellas que son deliberadamente incompatibles con Chrome. En esos casos contados, la página de documentación de la API manifestará expresamente que se admite solo en el espacio de nombres <code>browser</code>. El proceso de conversión de extensiones de Chrome u Opera es el siguiente:</p>
-
-<ol>
- <li>Revise su utilización de funciones de manifest.json y API de WebExtensions con respecto a la <a href="/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">referencia de incompatibilidades con Chrome</a>. Si está empleando funciones o API que aún no se admiten en Firefox, es posible que no pueda convertir su extensión por el momento. Mozilla ofrece un servicio que puede ayudar a automatizar este paso: <a href="https://www.extensiontest.com/">https://www.extensiontest.com/</a>.</li>
- <li><a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Instale su extensión en Firefox</a> y póngala a prueba.</li>
- <li>Si experimenta problemas, póngase en contacto con nosotros a través de la <a class="external external-icon" href="https://mail.mozilla.org/listinfo/dev-addons">lista de correo «dev-addons»</a> o el <a href="irc://irc.mozilla.org/webextensions">canal #webextensions</a> en <a class="external external-icon" href="https://wiki.mozilla.org/IRC">IRC</a>.</li>
- <li><a href="/en-US/Add-ons/WebExtensions/Publishing_your_WebExtension">Envíe su complemento a AMO para su firma y distribución</a>.</li>
-</ol>
-
-<p>Si dependía de la opción de consola de Chrome para cargar extensiones no empaquetadas, eche un vistazo a la herramienta <a href="/en-US/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a>, la cual automatiza la instalación temporal en Firefox para permitir el desarrollo.</p>
-
-<ul>
-</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/prerequisites/index.html b/files/es/mozilla/add-ons/webextensions/prerequisites/index.html
new file mode 100644
index 0000000000..78cff72dcd
--- /dev/null
+++ b/files/es/mozilla/add-ons/webextensions/prerequisites/index.html
@@ -0,0 +1,18 @@
+---
+title: Prerequisitos
+slug: Mozilla/Add-ons/WebExtensions/Prerequisites
+translation_of: Mozilla/Add-ons/WebExtensions/Prerequisites
+original_slug: Mozilla/Add-ons/WebExtensions/Prerequisitos
+---
+<p>Para desarrollar usando las APIs de WebExtension, debes seguir algunos pasos antes de comenzar.</p>
+
+<ul>
+ <li>Descarga, instala, y ejecuta <a href="https://www.mozilla.org/es-ES/firefox/developer/">Firefox para Desarrolladores</a> o <a class="external text" href="https://nightly.mozilla.org/" rel="nofollow">Firefox Nightly</a>. Usa Nightly si quieres tener los últimos cambios.</li>
+ <li>Ve a la preferencia que controla la instalación de complementos no firmados. Nota que esta preferencia solo está disponible en Firefox para Desarrolladores y Firefox Nightly.
+  <ul>
+   <li>Escribe <code>about:config</code> dentro de la barra de direcciones de Firefox</li>
+   <li>En el campo de búsqueda escribe <code>xpinstall.signatures.required</code></li>
+   <li>Has doble clic sobre la preferencia, o clic derecho y escoge Modificar, para cambiarla a <code>false</code>.</li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/prerequisitos/index.html b/files/es/mozilla/add-ons/webextensions/prerequisitos/index.html
deleted file mode 100644
index d022940dab..0000000000
--- a/files/es/mozilla/add-ons/webextensions/prerequisitos/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Prerequisitos
-slug: Mozilla/Add-ons/WebExtensions/Prerequisitos
-translation_of: Mozilla/Add-ons/WebExtensions/Prerequisites
----
-<p>Para desarrollar usando las APIs de WebExtension, debes seguir algunos pasos antes de comenzar.</p>
-
-<ul>
- <li>Descarga, instala, y ejecuta <a href="https://www.mozilla.org/es-ES/firefox/developer/">Firefox para Desarrolladores</a> o <a class="external text" href="https://nightly.mozilla.org/" rel="nofollow">Firefox Nightly</a>. Usa Nightly si quieres tener los últimos cambios.</li>
- <li>Ve a la preferencia que controla la instalación de complementos no firmados. Nota que esta preferencia solo está disponible en Firefox para Desarrolladores y Firefox Nightly.
-  <ul>
-   <li>Escribe <code>about:config</code> dentro de la barra de direcciones de Firefox</li>
-   <li>En el campo de búsqueda escribe <code>xpinstall.signatures.required</code></li>
-   <li>Has doble clic sobre la preferencia, o clic derecho y escoge Modificar, para cambiarla a <code>false</code>.</li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/publishing_your_webextension/index.html b/files/es/mozilla/add-ons/webextensions/publishing_your_webextension/index.html
deleted file mode 100644
index ef81cd0468..0000000000
--- a/files/es/mozilla/add-ons/webextensions/publishing_your_webextension/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: Publicando tu extensión
-slug: Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension
-tags:
-  - AMO
-  - Addons
-  - WebExtensions
-translation_of: Mozilla/Add-ons/WebExtensions/Package_your_extension_
----
-<div>{{AddonSidebar}}</div>
-
-<p>Una vez que hayas acabado de modificar y testear tu extensión, es probable que quieras compartirla con el resto del mundo. Mozilla tiene una web: <a class="external external-icon" href="https://addons.mozilla.org">addons.mozilla.org</a> (comunmente abreviada como AMO), en la que los desarrolladores pueden publicar sus complementos y los usuarios pueden encontrarlos. Publicando tu extension en AMO, puedes participar en nuestra comunidad de usuarios y creadores, y encontrar una audiencia para tu extension.</p>
-
-<p>No tienes por que publicar tu extension en AMO.  De todas maneras, aunque no quieras publicarla, tendrás que enviarla a AMO para que pueda ser revisada y firmada. Las versiones oficiales de Firefox no aceptan complementos que no estén firmados por AMO.</p>
-
-<p>En resumen, este es el proceso para publicar una extensión:</p>
-
-<ol>
- <li><a href="#1._Zip_up_your_extension's_files">Comprime los archivos de tu extension en un zip</a></li>
- <li><a href="#2._Create_an_account_on_addons.mozilla.org">Crea una cuenta en AMO</a></li>
- <li><a href="#3._Upload_your_zip">Sube tu zip a AMO para firmarlo y revisarlo y selecciona una opción</a></li>
- <li><a href="#4._Fix_review_problems">Soluciona los problemas encontrados en la revisión</a></li>
- <li><a href="#5._Publish_your_extension">Si seleccionas no publicar la extension en AMO, puedes obtener la extension firmada y publicala por tu cuenta</a></li>
-</ol>
-
-<p>Cuando estés listo para lanzar una nueva versión de tu extensión, puedes actualizarla visitando la página de la extensión en <a class="external external-icon" href="https://addons.mozilla.org">addons.mozilla.org</a>, y subiendo ahí la nueva versión. Ten en cuenta que tendrás que actualizar la página de la extensión para que AMO reconozca que es una actualización de la extensión, y no una extensión completamente nueva.</p>
-
-<p>Si seleccionas publicar tu extensión en AMO, Firefox buscará las actualizaciones automaticamente. Si seleccionas publicarla por tu cuenta, tendrás que incluir la clave <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> en tu manifest.json, con el atributo <code>update_url</code> apuntando a un <a href="/en-US/Add-ons/Updates">update manifest file</a>.</p>
-
-<div class="pull-aside">
-<div class="moreinfo">
-<p>Las extensiones empaquetadas de Firefox son "archivos XPI", que son simplemente un .ZIP con otra extensión</p>
-
-<p>No tienes que usar la extensión .XPI para subirla a AMO.</p>
-</div>
-</div>
-
-<h2 id="1._Comprime_los_archivos_en_un_zip">1. Comprime los archivos en un zip</h2>
-
-<p>En este punto tu extensión consistirá en una carpeta que contiene un manifest.json y otros archivos que necesite (scripts, iconos, documentos HTML, etc.). Necesitarás comprimir todos en un sólo .zip para poder subirlos a AMO.</p>
-
-<p>Es importante saber que el .zip deber crearse seleccionando<strong> todos los archivos de la extensión, no su carpeta contenedora</strong>.</p>
-
-<h3 id="Windows">Windows</h3>
-
-<ol>
- <li>Abre la carpeta que contenga los archivos de tu extensión.</li>
- <li>Selecciona todos los archivos (CTRL+E o CTRL+A, depende del idioma).</li>
- <li>Click derecho en Enviar a → Carpeta comprimida (en zip).</li>
-</ol>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/11949/install-windows.png" style="display: block; height: 576px; margin-left: auto; margin-right: auto; width: 800px;"></p>
-
-<h3 id="Mac_OS_X">Mac OS X</h3>
-
-<ol>
- <li>Abre la carpeta que contenga los archivos de tu extensión.</li>
- <li>Selecciona todos los archivos.</li>
- <li>Click derecho y selecciona Comprimir <em>n</em> Items.</li>
-</ol>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/11951/install-osx.png" style="display: block; height: 449px; margin-left: auto; margin-right: auto; width: 800px;"></p>
-
-<div class="pull-aside">
-<div class="moreinfo">Ver <a href="http://www.info-zip.org/mans/zip.html">http://www.info-zip.org/mans/zip.html</a>.</div>
-</div>
-
-<h3 id="Linux_Mac_OS_X_Terminal">Linux / Mac OS X Terminal</h3>
-
-<ol>
- <li><code>cd path/to/my-extension/</code></li>
- <li><code>zip -r -FS ../my-extension.zip *</code></li>
-</ol>
-
-<div style=""> </div>
-
-<h2 id="2._Crea_una_cuenta_en_addons.mozilla.org">2. Crea una cuenta en addons.mozilla.org</h2>
-
-<p>Visita <a href="https://addons.mozilla.org/">https://addons.mozilla.org/</a>. Si ya tienes una <a href="https://support.mozilla.org/en-US/kb/access-mozilla-services-firefox-accounts">Cuenta Firefox</a>, puedes utilizarla para iniciar sesión. Si no, haz click en "Registrar" y se te exigirá crear una cuenta.</p>
-
-<h2 id="3._Sube_tu_zip">3. Sube tu zip</h2>
-
-<p>A continuación, sube la extensión comprimida a AMO para poder revisarla y firmarla, y selecciona si quieres publicarla en AMO o no. Hay un <a href="https://developer.mozilla.org/en-US/Add-ons/Distribution/Submitting_an_add-on">tutorial</a> disponible para guiarte durante el proceso de envío. Sería conveniente que también veas <a href="https://developer.mozilla.org/es/Add-ons/Distribution#Enviando_a_AMO">Enviando a AMO</a> para más detalles sobre el proceso.</p>
-
-<div class="note">
-<p>Ten en cuenta que una vez que hayas subido la extensión a AMO no podrás actualizarla para usar el Add-on SDK o técnicas XUL/XPCOM. Si decides cambiar a una de estas plataformas, tendrás que enviar la extensión de nuevo como si de una nueva extensión se tratase.</p>
-
-<p>En otras palabras: portar a partir de sistemas de extensiones heredadas para usar APIs WebExtension es un camino de ida.</p>
-
-<p>Antes de subirla, asegurate de que el ZIP contiene sólo los archivos necesarios para la extensión.</p>
-</div>
-
-<h2 id="4._Soluciona_los_problemas_detectados_en_la_revisión">4. Soluciona los problemas detectados en la revisión</h2>
-
-<p>En cuanto subas la aplicación, el servidor AMO realizará varios tests básicos y te notificará inmediatamente de cualquier problema. Los problemas se dividen en dos categorías: "errors" y "warnings". Si tienes errores, tienes que arreglarlos y reenviar la extensión. Si sólo tienes avisos, conviene solucionarlos, pero no es obligatorio. Puedes continuar.</p>
-
-<p>Si el comprobador automático no detecta ningún error, la extensión pasará por una revisión más exhaustiva. Serás contactado con los resultados de la revisión. En caso de tener errores tendrás que solucionarlos e intentarlo de nuevo.</p>
-
-<p>Si has selccionado que la extensión esté hosteada en AMO, este es el final del proceso de publicación. AMO firmará la extensión y la publicará, tras esto los usuarios ya podrán descargarla e instalarla.</p>
-
-<h2 id="5._Publica_tu_extensión">5. Publica tu extensión</h2>
-
-<p>Si seleccionas no publicarla en AMO, obten la extensión firmada y públicala por tu cuenta.</p>
-
-<p> </p>
diff --git a/files/es/mozilla/add-ons/webextensions/que_son_las_webextensions/index.html b/files/es/mozilla/add-ons/webextensions/que_son_las_webextensions/index.html
deleted file mode 100644
index eca9f0ff30..0000000000
--- a/files/es/mozilla/add-ons/webextensions/que_son_las_webextensions/index.html
+++ /dev/null
@@ -1,59 +0,0 @@
----
-title: ¿Qué son las extensiones?
-slug: Mozilla/Add-ons/WebExtensions/Que_son_las_WebExtensions
-tags:
-  - WebExtensions
-  - extensiones
-translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
----
-<div>{{AddonSidebar}}</div>
-
-<p>Una extensión agrega características y funciones a un explorador. Se ha creado utilizando tecnologías basadas en Web conocidas: HTML, CSS y JavaScript. Puede aprovechar las mismas API Web que JavaScript en una página web, pero una extensión también tiene acceso a su propio conjunto de APIs de JavaScript. Esto significa que puede hacer mucho más en una extensión de lo que puede con el código en una página web. Estos son sólo algunos ejemplos de las cosas que puedes hacer:</p>
-
-<p><strong>Mejore o complemente un sitio</strong>: Use un Add-on para ofrecer funciones adicionales en el navegador o información de su sitio Web. Permita a los usuarios recopilar detalles de las páginas que visitan para mejorar el servicio que ofrecen.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/15808/Amazon_add_on.png"></p>
-
-<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/amazon-browser-bar/">El asistente de Amazon para Firefox</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/onenote-clipper/">OneNote Web Clipper</a> y <a href="https://addons.mozilla.org/en-US/firefox/addon/grammarly-1/">Grammarly para Firefox</a></p>
-
-<p><strong>Permita que los usuarios demuestren su personalidad</strong>: Las extensiones del navegador pueden manipular el contenido de las páginas; por ejemplo, permite a los usuarios agregar su logo favorito o imágen como un fondo de pantalla acada página que visitan. Las extensiones permiten también al usuario actualizar el aspecto de la IU de Firefox, de la misma manera que lo hacen los <a href="https://developer.mozilla.org/es/docs/Temas/Theme_concepts">complementos de temas</a>.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/15809/MyWeb_New_Tab_add_on.png" style="height: 398px; width: 540px;"></p>
-
-<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/myweb-new-tab/">MyWeb New Tab</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/tabliss/">Tabliss</a> y <a href="https://addons.mozilla.org/en-US/firefox/addon/vivaldifox/">VivaldiFox</a></p>
-
-<p><strong>Agregar o quitar contenido de las páginas web</strong>: es posible que desee ayudar a los usuarios a bloquear los anuncios intrusivos de las páginas web, proporcionar acceso a una guía de viajes siempre que un país o ciudad se menciona en una página web, o reformatear el contenido de la página para ofrecer una experiencia de lectura consistente. Con la capacidad de acceder y actualizar tanto HTML como CSS de una página, las extensiones pueden ayudar a los usuarios a ver la Web de la manera que quieren.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/15807/ublock_origin_add_on.png" style="height: 480px; width: 640px;"></p>
-
-<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/ublock-origin/">Origen uBlock</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/reader/">Lector</a> y <a href="https://addons.mozilla.org/en-US/firefox/addon/toolbox-google-play-store/">Caja de Herramientas para Google Play Store™</a></p>
-
-<p><strong>Agregar herramientas y nuevas funciones de navegación</strong>: añada nuevas funciones a un taskboard o genere imágenes de código QR a partir de URLs, hipervínculos o texto de página. Con opciones de interfaz de usuario flexibles y la potencia de las <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions">APIs de WebExtensions</a>, puede añadir fácilmente nuevas funcionalidades a un navegador. Usted puede realzar casi cualquier característica o funcionalidad de sitios web, no tiene que ser su web.</p>
-
-<p><strong><img alt="" src="https://mdn.mozillademos.org/files/15806/QR_Code_Image_Generator_add_on.png"></strong></p>
-
-<p><strong>Ejemplos: <a href="https://addons.mozilla.org/en-US/firefox/addon/qr-code-image-generator/">QR Code Image Generator</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/swimlanes-for-trello/">Swimlanes for Trello</a>, y <a href="https://addons.mozilla.org/en-US/firefox/addon/tomato-clock/">Tomato Clock</a></strong></p>
-
-<p><strong>Juegos</strong>: ofrecer juegos de ordenador tradicionales, con características de juego fuera de línea, pero también explorar nuevas posibilidades de juego, por ejemplo, mediante la incorporación de gameplay en la navegación cotidiana.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/15805/Asteroids_in_Popup_add_on%20.png" style="height: 438px; width: 700px;"></p>
-
-<p>Ejemplos: <a href="https://addons.mozilla.org/en-US/firefox/addon/asteroids-in-popup/">Asteroids in Popup</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/solitaire-card-game-new-tab/">Solitaire Card Game New Tab</a>, and <a href="https://addons.mozilla.org/en-US/firefox/addon/2048-prime/">2048 Prime</a>.</p>
-
-<p><strong>Agregar herramientas de desarrollo</strong>: puede proporcionar herramientas de desarrollo web como su negocio o ha desarrollado una técnica útil o un enfoque para el desarrollo web que desea compartir. De cualquier manera, puede mejorar las herramientas de desarrollo de Firefox incorporadas añadiendo una nueva ficha a la barra de herramientas del desarrollador.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/15804/aXe_Developer_Tools_add_on.png" style="height: 261px; width: 700px;"></p>
-
-<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/web-developer/">Web Developer</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/react-devtools/">Web React Developer Tools</a>, and <a href="https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/">aXe Developer Tools</a></p>
-
-<p>Las extensiones para Firefox se construyen utilizando las <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions">APIs de WebExtensions</a>, un sistema multi-navegador para desarrollar extensiones. En gran medida, la API es compatible con la <a class="external external-icon" href="https://developer.chrome.com/extensions">extension API</a> soportada por Google Chrome y Opera. Extensiones escritas para estos navegadores en la mayoría de los casos se ejecutan en Firefox o Microsoft Edge con sólo unos pocos <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension">cambios</a>. La API es también totalmente compatible con los <a href="https://developer.mozilla.org/en-US/Firefox/Multiprocess_Firefox">multiprocesos de Firefox</a>.</p>
-
-<p>Si tiene ideas o preguntas, o necesita ayuda para migrar un Add-on heredado a las APIs de WebExtensions, puede comunicarse con nosotros en el<a class="external external-icon" href="https://mail.mozilla.org/listinfo/dev-addons">dev-addons mailing list</a> o en <a href="irc://irc.mozilla.org/extdev">#extdev</a> en <a class="external external-icon" href="https://wiki.mozilla.org/IRC">IRC</a>.</p>
-
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-
-<ul>
- <li>Para recorrer el desarrollo de una simple extensión, vea <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Tu_primera_WebExtension">Tu primera extensión</a>.</li>
- <li>Aprende sobre la estructura de una extensión en <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Anatomia_de_una_WebExtension">anatomía de una extensión</a>.</li>
- <li>Pruebe algunos ejemplos de extensiones en <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Examples">Extensiones de ejemplo</a>.</li>
-</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/tu_primera_webextension/index.html b/files/es/mozilla/add-ons/webextensions/tu_primera_webextension/index.html
deleted file mode 100644
index d444b69f88..0000000000
--- a/files/es/mozilla/add-ons/webextensions/tu_primera_webextension/index.html
+++ /dev/null
@@ -1,160 +0,0 @@
----
-title: Tu primera extensión
-slug: Mozilla/Add-ons/WebExtensions/Tu_primera_WebExtension
-tags:
-  - Guía
-  - WebExtension
-translation_of: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension
----
-<div>{{AddonSidebar}}</div>
-
-<div class="blockIndicator note">
-<p>Si estás familiarizado/a con los conceptos básicos de las extensiones de navegador, omite esta sección y ve a <a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">cómo se ponen juntos los archivos</a>. Entonces, usa la <a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions#Reference">documentación de referencia</a> para empezar a construir tu extensión. Visita el <a href="https://extensionworkshop.com/?utm_source=developer.mozilla.org&amp;utm_medium=documentation&amp;utm_campaign=your-first-extension">Firefox Extension Workshop</a> para aprender más sobre el flujo de trabajo para probar y publicar extensiones para Firefox.</p>
-</div>
-
-<p>En este artículo abordaremos la creación de una extensión para Firefox, desde el comienzo hasta el final. La extensión solo agrega un borde rojo a cualquiera de las páginas cargadas desde "mozilla.org" o cualquiera de sus subdominios.</p>
-
-<p>El código fuente de este ejemplo se encuentra en GitHub: <a href="https://github.com/mdn/webextensions-examples/tree/master/borderify">https://github.com/mdn/webextensions-examples/tree/master/borderify</a>.</p>
-
-<p>Primero, necesitas tener instalado Firefox versión 45 o superior.</p>
-
-<h2 id="Escribiendo_la_extensión">Escribiendo la extensión</h2>
-
-<p>Crea una nuevo directorio y navega a él. Por ejemplo, en tu línea de comandos/terminal se hace de esta manera:</p>
-
-<pre class="brush: bash notranslate">mkdir borderify
-cd borderify</pre>
-
-<h3 id="manifest.json">manifest.json</h3>
-
-<p>Ahora crearemos un archivo  nuevo llamado "manifest.json" directamente en la carpeta "borderify". Añádale el siguiente contenido:</p>
-
-<pre class="brush: json notranslate">{
-
-  "manifest_version": 2,
-  "name": "Borderify",
-  "version": "1.0",
-
-  "description": "Agrega un borde rojo a todas las páginas web de mozilla.org.",
-
-  "icons": {
-    "48": "icons/border-48.png"
-  },
-
-  "content_scripts": [
-    {
-      "matches": ["*://*.mozilla.org/*"],
-      "js": ["borderify.js"]
-    }
-  ]
-
-}</pre>
-
-<ul>
- <li>Los primeros 3 parámetros:<code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/manifest_version">manifest_version</a></code>, <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/name">name</a></code>, y <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/version">version</a></code>, son obligatorios, y contienen metadatos básicos para la extensión.</li>
- <li><code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/description">description</a></code> es opcional, pero se recomienda: Se muestra en el Administrador de Add-ons.</li>
- <li><code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/icons">icons</a></code> es opcional, pero recomendado: permite especificar un ícono para la extensión, se mostrará en el Administrador de Add-ons.</li>
-</ul>
-
-<p>El parámetro más interesante aquí es <code><a href="/es/Add-ons/WebExtensions/manifest.json/content_scripts">content_scripts</a></code>, el cual le dice a Firefox que cargue el script en las páginas Web, cuyas URL coincidan con un patrón especifico. En este caso, le estamos pidiendo a Firefox que cargue el script llamado "borderify.js" en todas las paginas HTTP o HTTPS cargadas desde "mozilla.org" o cualquiera de sus subdominios.</p>
-
-<ul>
- <li><a href="/es/Add-ons/WebExtensions/Content_scripts">Aprenda más acerca de los scripts contenidos.</a></li>
- <li><a href="/es/Add-ons/WebExtensions/Match_patterns">Aprenda más acerca de los patrones coincidentes</a>.</li>
-</ul>
-
-<div class="warning">
-<p><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID#When_do_you_need_an_Add-on_ID">En algunas situaciones usted necesita especificar un ID para su extensión</a>. Si necesita especificar un ID para el complemento, incluya el parámetro <code><a href="/es/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> en el <code>manifest.json</code> y configure la propiedad <code>gecko.id</code>:</p>
-
-<pre class="brush: json notranslate">"applications": {
-  "gecko": {
-    "id": "borderify@example.com"
-  }
-}</pre>
-</div>
-
-<h3 id="iconsborder-48.png">icons/border-48.png</h3>
-
-<p>La extensión debería tener un ícono. Este se mostrará junto al listado de extensiones en el Administrador de Add-ons. Nuestro manifest.json promete que tendremos un ícono  en el directorio "icons/border-48.png".</p>
-
-<p>Crea el directorio "icons" dentro de la carpeta "borderify". Almacena ahí el icono y nómbralo "border-48.png". Puedes utilizar <a href="https://github.com/mdn/webextensions-examples/blob/master/borderify/icons/border-48.png">el de nuestro ejemplo</a>, el cual se obtuvo a partir del Google Material Design iconset, y es utilizado bajo los términos de la licencia <a href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-ShareAlike</a>.</p>
-
-<p>Si eliges emplear tu propio icono, este debe ser de 48x48 pixeles. También puedes aplicar un icono de 96x96 pixeles, para resoluciones mayores, y si haces esto, se especifica como la propiedad <code>96</code> en el objeto icons del manifest.json:</p>
-
-<pre class="brush: json notranslate">"icons": {
-  "48": "icons/border-48.png",
-  "96": "icons/border-96.png"
-}</pre>
-
-<p>Alternativamente, puedes aplicar un archivo SVG ahí, y este se escalará apropiadamente. (Aunque: si usas SVG y tu icono incluye texto, puedes usar la herramienta "convert to path" del editor SVG para aplanar el texto, de modo que se escalone con un tamaño/posición coherente).</p>
-
-<ul>
- <li><a href="/es/Add-ons/WebExtensions/manifest.json/icons">Aprender mas acerca de la especificación de iconos.</a></li>
-</ul>
-
-<h3 id="borderify.js">borderify.js</h3>
-
-<p>Finalmente, crea un archivo de nombre "borderify.js" directamente en el directorio "borderify". Y déjale el siguiente contenido:</p>
-
-<pre class="brush: js notranslate">document.body.style.border = "5px solid red";</pre>
-
-<p>Este script se cargara en las páginas que coincidan con el patrón dado en el parámetro <code>content_scripts</code> del archivo manifest.json. El script tiene acceso directo al documento, de la misma manera que los scripts cargados por la propia página.</p>
-
-<ul>
- <li><a href="/es/Add-ons/WebExtensions/Content_scripts">Aprender más acerca de los scripts de contenido.</a></li>
-</ul>
-
-<h2 id="Probándolo">Probándolo</h2>
-
-<p>Primero, verifica que tienes todos los archivos en su lugar:</p>
-
-<pre class="notranslate">borderify/
-    icons/
-        border-48.png
-    borderify.js
-    manifest.json</pre>
-
-<h3 id="Instalación">Instalación</h3>
-
-<p>Abre "about:debugging" en Firefox, da click en "Cargar complemento temporal" y selecciona cualquier archivo en el directorio de la extensión:</p>
-
-<p>{{EmbedYouTube("cer9EUKegG4")}}</p>
-
-<p>La extensión se encontrará instalada, y lo estará hasta que reinicies Firefox.</p>
-
-<p>Alternativamente, puede ejecuturar la extensión desde la línea de comandos utilizando la herramienta <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a>.</p>
-
-<h3 id="Probando">Probando</h3>
-
-<p>Ahora pruebe visitando una página bajo "mozilla.org", y usted verá el borde rojo alrededor de la página:</p>
-
-<p>{{EmbedYouTube("rxBQl2Z9IBQ")}}</p>
-
-<div class="note">
-<p>No lo intentes en addons.mozilla.org! Los scripts de contenido están actualmente bloqueados en ese dominio.</p>
-</div>
-
-<p>Experimenta un poco. Edita el contenido del script para cambiar el color del borde, o haz algo más en el contenido de la página. Si actualizas el script de contenido, recarga los archivos de la extensión haciendo clic en el botón "Recargar" en about:debugging. Podrás ver los cambios en el momento:</p>
-
-<p>{{EmbedYouTube("NuajE60jfGY")}}</p>
-
-<ul>
- <li><a href="/es/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Aprende más sobre cómo recargar las extensiones</a></li>
-</ul>
-
-<h2 id="Empaquetar_y_publicar">Empaquetar y publicar</h2>
-
-<p>Para que otras personas puedan utilizar tu extensión, necesitas empaquetarlo y enviarlo a Mozilla para que lo firmen. Para que aprendas más sobre eso, mira <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension">"Publicando tu extension"</a>.</p>
-
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-
-<p>Ahora que tienes una idea acerca del proceso de desarrollo de una WebExtension para Firefox, continúa con:</p>
-
-<ul>
- <li><a href="/es/Add-ons/WebExtensions/Your_second_WebExtension">escribe una extensión más compleja</a></li>
- <li><a href="/es/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">leer más acerca de la anatomía de una extensión</a></li>
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Examples">explora los ejemplos de extensiones</a></li>
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/What_next_">encuentra lo que necesitas para desarrollar, probar y publicar tu extensión</a></li>
- <li><a href="/es/Add-ons/WebExtensions/API">leer acerca de las APIs de JavaScript disponibles para las extensiones.</a></li>
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/What_next_#Continue_your_learning_experience">lleva tu aprendizaje más lejos</a></li>
-</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/tutorial/index.html b/files/es/mozilla/add-ons/webextensions/tutorial/index.html
deleted file mode 100644
index 559320eca0..0000000000
--- a/files/es/mozilla/add-ons/webextensions/tutorial/index.html
+++ /dev/null
@@ -1,459 +0,0 @@
----
-title: Tu segunda extensión
-slug: Mozilla/Add-ons/WebExtensions/Tutorial
-tags:
-  - WebExtensions
-translation_of: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension
----
-<div>{{AddonSidebar}}</div>
-
-<p>Si ya ha visto el artículo <a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Tu_primera_WebExtension">tu primer extensión</a>, ya posee una idea de como escribir una extensión. En este artículo se escribirá una extensión ligeramente más compleja para demostrar un par de cosas más de las APIs.</p>
-
-<p>La extensión añade un nuevo botón a la barra de herramientas de Firefox. Cuando el usuario da clic sobre el botón, mostraremos una ventana emergente que permite escoger un animal. Una vez que un animal sea escogido, reemplazaremos todas las imágenes en la página actual con la imagen del animal seleccionado.</p>
-
-<p>Para implementar esto, haremos lo siguiente:</p>
-
-<ul>
- <li><strong>Definir una <a href="/es/Add-ons/WebExtensions/user_interface/Browser_action">acción del navegador</a>, que será el botón añadido a la barra de herramientas de Firefox</strong>.<br>
-  Para el botón vamos a proporcionar:
-  <ul>
-   <li>un icono, llamado "beasts-32.png"</li>
-   <li>una ventana emergente para abrir cuando el botón sea presionado. La  ventana emergente incluye HTML, CSS y JavaScript.</li>
-  </ul>
- </li>
- <li><strong>Define un ícono para la extensión,</strong> llamado "beasts-48.png". Este será mostrado en el Administrador de Complementos.</li>
- <li><strong>Escribe un script de contenido, "beastify.js" que será inyectado dentro de las páginas web.</strong><br>
-  Este es el código que modificará las páginas web.</li>
- <li><strong>Empaqueta algunas imágenes de animales, para reemplazar las imágnes de la página web</strong>.<br>
-  Nosotros haremos las imágenes "recursos web accesibles" para que la página web pueda referenciarlos.</li>
-</ul>
-
-<p>Tu puedes notar que la estructura general de la extensión luce como esto:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13671/Untitled-1.png" style="display: block; height: 1200px; margin-left: auto; margin-right: auto; width: 860px;"></p>
-
-<p>Esta es una extensión simple, pero muestra muchos de los principales conceptos de la API WebExtensions:</p>
-
-<ul>
- <li>Adicionando un botón a la barra de herramientas</li>
- <li>Definiendo un panel emergente usando HTML, CSS y JavaScript</li>
- <li>Inyectando scripts de contenido dentro de las páginas web</li>
- <li>Comunicándonos entre los scripts de contenido y el resto de la extensión</li>
- <li>Empaquetando recursos con tu extensión que pueden ser usados por las páginas web</li>
-</ul>
-
-<p>Tu puedes encontrar el <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">código fuente completo de la extensión en GitHub</a>.</p>
-
-<p>Para escribir una extensión, necesitará de Firefox 45 o más reciente.</p>
-
-<h2 id="Escribiendo_la_extensión">Escribiendo la extensión</h2>
-
-<p>Crea una carpeta nueva y navega hacia ella:</p>
-
-<pre class="brush: bash">mkdir beastify
-cd beastify</pre>
-
-<h3 id="manifest.json">manifest.json</h3>
-
-<p>Ahora crea un archivo llamado "manifest.json", y agrega el siguiente contenido:</p>
-
-<pre class="brush: json">{
-
-  "manifest_version": 2,
-  "name": "Beastify",
-  "version": "1.0",
-
-  "description": "Agrega un icono de acción navegación a la barra de herramientas. Haga clic en el botón para elegir una bestia. El contenido del cuerpo de la pestaña activa se sustituye por una imagen de la bestia elegida. Consulte https://developer.mozilla.org/es/Add-ons/WebExtensions/Examples#beastify",
-  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/beastify",
-  "icons": {
-    "48": "icons/beasts-48.png"
-  },
-
-  "permissions": [
-    "activeTab"
-  ],
-
-  "browser_action": {
-    "default_icon": "icons/beasts-32.png",
-    "default_title": "Bestificar",
-    "default_popup": "popup/choose_beast.html"
-  },
-
-  "web_accessible_resources": [
-    "beasts/frog.jpg",
-    "beasts/turtle.jpg",
-    "beasts/snake.jpg"
-  ]
-
-}
-</pre>
-
-<ul>
- <li>Las tres primeras llaves: <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/manifest_version">manifest_version</a></code> , <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/name">name</a></code> , y <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/version">version</a></code> , son obligatorias y contienen los metadatos básicos para la extensión.</li>
- <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/description">description</a></code> y <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/homepage_url">homepage_url</a></code> son opcionales, pero recomendadas: proporcionan información útil acerca de la extensión.</li>
- <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/icons">icons</a></code> es opcional, pero recomedada: permite la especificación de un ícono para la extensión, que será mostrada en el Administrador de Complementos.</li>
- <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissions</a></code> lista los permisos que la extensión necesita. Aquí solo se pide el permiso de <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/permissions#activeTab_permission"><code>activeTab</code> permission</a>.</li>
- <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> especifica el botón de la barra de herramientas.  Nosotros proveemos tres piezas de información aquí:
-  <ul>
-   <li><code>default_icon</code> es obligatorio y enlaza al icono para el botón</li>
-   <li><code>default_title</code> es opcional y será mostrado como descripción</li>
-   <li><code>default_popup</code> es usado su tu quieres una ventana emergente que será mostrada cuando el usuario de clic en el botón. Lo hacemos y hemos incluido esta llave que apunta a un archivo HTML de la extensión.</li>
-  </ul>
- </li>
- <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources">web_accessible_resources</a></code> lista los archivos que queremos hacer accesibles a las páginas web. Como la extensión reemplaza imágenes en una página con imágenes que hemos empaquetado, necesitamos hacer estas imágenes accesibles a la página.</li>
-</ul>
-
-<p>Nota que todas las rutas dadas son relativas a manifest.json.</p>
-
-<h3 id="El_ícono">El ícono</h3>
-
-<p>La extensión debería tener un íncono. Éste, será mostrado junto a la lista de complementos en el Administrador de Complementos (Pude abrirlo introduciendo en la URL "about:addons"). El manifest.json promete que se posee un ícono para la barra de herramientas en "icons/beasts-48.png".</p>
-
-<p>Cree el directorio "icons" y guarde un ícono ahí y nómbrelo como "beasts-48.png".  Puede utilizar <a href="https://github.com/mdn/webextensions-examples/blob/master/beastify/icons/beasts-48.png">uno de nuestro ejemplo</a>, el cual ha sido tomado del  <a href="https://www.iconfinder.com/iconsets/free-retina-icon-set">conjuto de íconos Aha-Soft’s Free Retina</a>, que es utilizado bajo el término de su propia <a href="http://www.aha-soft.com/free-icons/free-retina-icon-set/">licencia</a>.</p>
-
-<p>Si elige proporcionar su propio ícono, debería ser de 48x48 pixeles. También puede proporcionar un ícono de 96x96 pixeles, para pantallas de altas resoluciones y, si usted hace esto, deberá especificarlo como la propiedad <code>96</code> del objeto <code>icons</code> en el manifest.json:</p>
-
-<pre class="brush: json line-numbers  language-json"><code class="language-json"><span class="key token">"icons":</span> <span class="punctuation token">{</span>
-  <span class="key token">"48":</span> <span class="string token">"icons/beasts-48.png"</span><span class="punctuation token">,</span>
-  <span class="key token">"96":</span> <span class="string token">"icons/beasts-96.png"</span>
-<span class="punctuation token">}</span></code></pre>
-
-<h3 id="El_botón_de_la_barra_de_herramientas">El botón de la barra de herramientas</h3>
-
-<p>El botón de la barra de herramientas necesita un ícono, y nuestro manifest.json promete eso y nos gustaría tener un ícono para la barra de herramientas en "icons/beasts-32.png".</p>
-
-<p>Guarde un ícono llamado "beasts-32.png" en el directorio "icons". Tu podrías usar <a href="https://github.com/mdn/webextensions-examples/blob/master/beastify/icons/beasts-32.png">uno de nuestros ejemplos</a>, los cuales son tomados desde el sitio <a href="http://www.iconbeast.com/free">IconBeast Lite icon set</a> y empleados bajo sus términos de <a href="http://www.iconbeast.com/faq/">licencia</a>.</p>
-
-<p>Si tu no provees una ventana emergente, entonces el evento clic es disparado hacia tu extensión cuando el usuario de clic sobre el botón. Si provees una ventana emergente entonces el evento clic no se disparará, pero en cambio, se muestra la ventana emergente. Nosotros queremos una ventana emergente, así que vamos a crearla.</p>
-
-<h3 id="La_ventana_emergente">La ventana emergente</h3>
-
-<p>La función de la ventana emergente es habilitada si el usuario escoge una de los tres animales.</p>
-
-<p>Crea una nueva carpeta llamada "popup" bajo la carpeta raíz de la extensión . Esta será donde pondremos el código para la ventana emergente. La carpeta "popup" contendrá estos tres archivos:</p>
-
-<ul>
- <li><strong><code>choose_beast.html</code></strong> define el contenido del panel</li>
- <li><strong><code>choose_beast.css</code></strong> los estilos CSS para el contenido</li>
- <li><strong><code>choose_beast.js</code></strong> maneja las opciones del usuario ejecutando un script de contenido en la pestaña activa</li>
-</ul>
-
-<h4 id="choose_beast.html">choose_beast.html</h4>
-
-<p>El archivo HTML luce así:</p>
-
-<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="doctype token">&lt;!DOCTYPE html&gt;</span>
-
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>meta</span> <span class="attr-name token">charset</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>utf-8<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>link</span> <span class="attr-name token">rel</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>stylesheet<span class="punctuation token">"</span></span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>choose_beast.css<span class="punctuation token">"</span></span><span class="punctuation token">/&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
-
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>popup-content<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button beast<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Frog<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button beast<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Turtle<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button beast<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Snake<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button reset<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Reset<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>error-content<span class="punctuation token">"</span></span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>hidden<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Can't beastify this web page.<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Try a different page.<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>script</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>choose_beast.js<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>script</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
-
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<p>Tenemos un elemento <code>&lt;div&gt;</code> con un ID <code>"popup-content"</code> que contiene un elemento para cada elección de animal. Además, tenemos otro <code>&lt;div&gt;</code> con un ID <code>"error-content"</code> y una clase <code>"hidden"</code>, que usaremos en el case de que surja algún problema al inicializar la ventana emergente.</p>
-
-<p>Note que referenciamos los archivos CSS y JS en el HTML como lo haríamos si se tratase de una página web.</p>
-
-<h4 id="choose_beast.css">choose_beast.css</h4>
-
-<p>El CSS ajusta el tamaño de la ventana emergente, se asegura que las tres posibles opciones llenen el espacio y les da un poco de estilo básico. Además oculta los elementos con <code>class="hidden"</code>: esto significa que nuestro <code>"error-content"</code> <code>&lt;div&gt;</code> estará oculto por defecto.</p>
-
-<pre class="brush: css line-numbers language-css"><code class="language-css"><span class="selector token">html, body</span> <span class="punctuation token">{</span>
-  <span class="property token">width</span><span class="punctuation token">:</span> <span class="number token">100</span><span class="token unit">px</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.hidden</span></span> <span class="punctuation token">{</span>
-  <span class="property token">display</span><span class="punctuation token">:</span> none<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.button</span></span> <span class="punctuation token">{</span>
-  <span class="property token">margin</span><span class="punctuation token">:</span> <span class="number token">3</span><span class="token unit">%</span> auto<span class="punctuation token">;</span>
-  <span class="property token">padding</span><span class="punctuation token">:</span> <span class="number token">4</span><span class="token unit">px</span><span class="punctuation token">;</span>
-  <span class="property token">text-align</span><span class="punctuation token">:</span> center<span class="punctuation token">;</span>
-  <span class="property token">font-size</span><span class="punctuation token">:</span> <span class="number token">1.5</span><span class="token unit">em</span><span class="punctuation token">;</span>
-  <span class="property token">cursor</span><span class="punctuation token">:</span> pointer<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.beast</span><span class="pseudo-class token">:hover</span></span> <span class="punctuation token">{</span>
-  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#CFF2F2</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.beast</span></span> <span class="punctuation token">{</span>
-  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#E5F2F2</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.reset</span></span> <span class="punctuation token">{</span>
-  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#FBFBC9</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token"><span class="class token">.reset</span><span class="pseudo-class token">:hover</span></span> <span class="punctuation token">{</span>
-  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#EAEA9D</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<h4 id="choose_beast.js">choose_beast.js</h4>
-
-<p>Aquí está el JavaScript para la ventana emergente:</p>
-
-<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="comment token">/**
- * CSS para ocultar toda la página
- * Excepto los elementos que pertenecen a la clase "beastify-image".
- */</span>
-<span class="keyword token">const</span> hidePage <span class="operator token">=</span> <span class="template-string token"><span class="string token">`body &gt; :not(.beastify-image) {
-                    display: none;
-                  }`</span></span><span class="punctuation token">;</span>
-
-<span class="comment token">/**
- * Esucha los clicks en los botones y envía el mensaje apropiado
- * al script de contenido de la página.
- */</span>
-<span class="keyword token">function</span> <span class="function token">listenForClicks</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  document<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">"click"</span><span class="punctuation token">,</span> <span class="punctuation token">(</span><span class="parameter token">e</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
-
-    <span class="comment token">/**
-     * Recibe el nombre de una bestia y obtiene la URL de la imagen correspondiente.
-     */</span>
-    <span class="keyword token">function</span> <span class="function token">beastNameToURL</span><span class="punctuation token">(</span><span class="parameter token">beastName</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      <span class="keyword token">switch</span> <span class="punctuation token">(</span>beastName<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">case</span> <span class="string token">"Frog"</span><span class="punctuation token">:</span>
-          <span class="keyword token">return</span> browser<span class="punctuation token">.</span>extension<span class="punctuation token">.</span><span class="function token">getURL</span><span class="punctuation token">(</span><span class="string token">"beasts/frog.jpg"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">case</span> <span class="string token">"Snake"</span><span class="punctuation token">:</span>
-          <span class="keyword token">return</span> browser<span class="punctuation token">.</span>extension<span class="punctuation token">.</span><span class="function token">getURL</span><span class="punctuation token">(</span><span class="string token">"beasts/snake.jpg"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="keyword token">case</span> <span class="string token">"Turtle"</span><span class="punctuation token">:</span>
-          <span class="keyword token">return</span> browser<span class="punctuation token">.</span>extension<span class="punctuation token">.</span><span class="function token">getURL</span><span class="punctuation token">(</span><span class="string token">"beasts/turtle.jpg"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-      <span class="punctuation token">}</span>
-    <span class="punctuation token">}</span>
-
-    <span class="comment token">/**
-     * Inserta dentro de la pestaña activa el CSS que oculta la página
-     * luego toma la URL de la imagen y
-     * envía un mensaje "beastify" al script de contenido de la pestaña activa.
-     */</span>
-    <span class="keyword token">function</span> <span class="function token">beastify</span><span class="punctuation token">(</span><span class="parameter token">tabs</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">insertCSS</span><span class="punctuation token">(</span><span class="punctuation token">{</span>code<span class="punctuation token">:</span> hidePage<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
-        <span class="keyword token">let</span> url <span class="operator token">=</span> <span class="function token">beastNameToURL</span><span class="punctuation token">(</span>e<span class="punctuation token">.</span>target<span class="punctuation token">.</span>textContent<span class="punctuation token">)</span><span class="punctuation token">;</span>
-        browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">sendMessage</span><span class="punctuation token">(</span>tabs<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span>id<span class="punctuation token">,</span> <span class="punctuation token">{</span>
-          command<span class="punctuation token">:</span> <span class="string token">"beastify"</span><span class="punctuation token">,</span>
-          beastURL<span class="punctuation token">:</span> url
-        <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-      <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-
-    <span class="comment token">/**
-     * Remueve el CSS que oculta la página y
-     * envía un mensaje de "reset" al script de contenido de la pestaña activa.
-     */</span>
-    <span class="keyword token">function</span> <span class="function token">reset</span><span class="punctuation token">(</span><span class="parameter token">tabs</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">removeCSS</span><span class="punctuation token">(</span><span class="punctuation token">{</span>code<span class="punctuation token">:</span> hidePage<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
-        browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">sendMessage</span><span class="punctuation token">(</span>tabs<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span>id<span class="punctuation token">,</span> <span class="punctuation token">{</span>
-          command<span class="punctuation token">:</span> <span class="string token">"reset"</span><span class="punctuation token">,</span>
-        <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-      <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-
-    <span class="comment token">/**
-     * Imprime el error en consola.
-     */</span>
-    <span class="keyword token">function</span> <span class="function token">reportError</span><span class="punctuation token">(</span><span class="parameter token">error</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="template-string token"><span class="string token">`Could not beastify: </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>error<span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-
-    <span class="comment token">/**
-     * Toma la pestaña activa y
-     * llama a "beastify()" o "reset()" según corresponda.
-     */</span>
-    <span class="keyword token">if</span> <span class="punctuation token">(</span>e<span class="punctuation token">.</span>target<span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">contains</span><span class="punctuation token">(</span><span class="string token">"beast"</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">query</span><span class="punctuation token">(</span><span class="punctuation token">{</span>active<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">,</span> currentWindow<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">}</span><span class="punctuation token">)</span>
-        <span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>beastify<span class="punctuation token">)</span>
-        <span class="punctuation token">.</span><span class="function token">catch</span><span class="punctuation token">(</span>reportError<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>e<span class="punctuation token">.</span>target<span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">contains</span><span class="punctuation token">(</span><span class="string token">"reset"</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">query</span><span class="punctuation token">(</span><span class="punctuation token">{</span>active<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">,</span> currentWindow<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">}</span><span class="punctuation token">)</span>
-        <span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>reset<span class="punctuation token">)</span>
-        <span class="punctuation token">.</span><span class="function token">catch</span><span class="punctuation token">(</span>reportError<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-  <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="comment token">/**
- * Si hubo algún error al ejecutar el script,
- * Despliega un popup con el mensaje de error y oculta la UI normal.
- */</span>
-<span class="keyword token">function</span> <span class="function token">reportExecuteScriptError</span><span class="punctuation token">(</span><span class="parameter token">error</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">"#popup-content"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span><span class="string token">"hidden"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">"#error-content"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">remove</span><span class="punctuation token">(</span><span class="string token">"hidden"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="template-string token"><span class="string token">`Failed to execute beastify content script: </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>error<span class="punctuation token">.</span>message<span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="comment token">/**
- * Cuando se carga la ventana emergente, inyecta el script de contenido en la pestaña activa,
- * y agrega un manejador de eventos.
- * Si no es posible inyectar el script, se ocupa de manejar el error.
- */</span>
-browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">executeScript</span><span class="punctuation token">(</span><span class="punctuation token">{</span>file<span class="punctuation token">:</span> <span class="string token">"/content_scripts/beastify.js"</span><span class="punctuation token">}</span><span class="punctuation token">)</span>
-<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>listenForClicks<span class="punctuation token">)</span>
-<span class="punctuation token">.</span><span class="function token">catch</span><span class="punctuation token">(</span>reportExecuteScriptError<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Empecemos por la linea 96. La ventana emergente ejecuta un script de contenido en la pestaña activa tan pronto como se termina de cargar, usando la API <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/executeScript">browser.tabs.executeScript()</a></code>. Si la ejecución del script de contenido es exitosa, este quedará cargado en la página hasta que sea cerrada la pestaña o hasta que el usuario navegue hacia una página distinta.</p>
-
-<div class="blockIndicator note">
-<p>Un motivo común por el cual el llamado a <code>browser.tabs.executeScript()</code> puede fallar, es porque no es posible ejecutar scripts de contenido en todas las páginas, por ejemplo, en páginas de navegador privilegiadas como about:debugging, o páginas del dominio <a href="https://addons.mozilla.org/">addons.mozilla.org</a>, no es posible hacerlo.</p>
-</div>
-
-<p>Si la ejecución falla, <code>reportExecuteScriptError()</code> ocultará el <code>&lt;div&gt;</code> <code>"popup-content"</code>, mostrará el <code>&lt;div&gt;</code> <code>"error-content"</code>, y reportará el error en la consola.</p>
-
-<p>Si la ejecución del script de contenido es exitosa, se llamará a <code>listenForClicks()</code>, que atiende los eventos que se generan al cliquear en la ventana emergente.</p>
-
-<ul>
- <li>Si el clic se produjo en el botón con <code>class="beast"</code>, se llama a <code>beastify()</code>.</li>
- <li>Si el clic se produjo en el botón con <code>class="reset"</code>, se llama a  <code>reset()</code>.</li>
-</ul>
-
-<p>La función <code>beastify()</code> hace tres cosas:</p>
-
-<ul>
- <li>map the button clicked to a URL pointing to an image of a particular beast</li>
- <li>Oculta todo el contenido de la página al insertar CSS con la API <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs/insertCSS">browser.tabs.insertCSS()</a></code></li>
- <li>Envía un mensaje "beastify" al script de contenido usando la API <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/sendMessage">browser.tabs.sendMessage()</a></code>, solicitándole "bestificar" la página, y enviándole la URL de la imagen.</li>
-</ul>
-
-<p>La función <code>reset()</code> deshace lo hecho por <code>beastify()</code>:</p>
-
-<ul>
- <li>Remueve el CSS que agregó, usando la API <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs/removeCSS">browser.tabs.removeCSS()</a></code></li>
- <li>Envía un mensaje de "reset" al script de contenido, solicitándole que resetee la página</li>
-</ul>
-
-<h3 id="El_script_de_contenido">El script de contenido</h3>
-
-<p>Crea una carpeta nueva bajo la raíz del complemento llamada "content_scripts" y crea un nuevo archivo en ella llamado "beastify.js", con el contenido siguiente:</p>
-
-<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="comment token">/**
-   * Revisa e inicializa una variable de guardia.
-   * Si este script de contenido es insertado más de una vez
-   * en la misma página, dejará de ejecutarse.
-   */</span>
-  <span class="keyword token">if</span> <span class="punctuation token">(</span>window<span class="punctuation token">.</span>hasRun<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">return</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  window<span class="punctuation token">.</span>hasRun <span class="operator token">=</span> <span class="boolean token">true</span><span class="punctuation token">;</span>
-
-<span class="comment token">/**
-* Recibe la URL de la imagen, remueve las que se hayan agregado antes,
-* crea un nodo IMG que apunt hacia la imagen
-* e inserta ese nodo en el documento.
-*/</span>
-  <span class="keyword token">function</span> <span class="function token">insertBeast</span><span class="punctuation token">(</span><span class="parameter token">beastURL</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="function token">removeExistingBeasts</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="keyword token">let</span> beastImage <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">"img"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    beastImage<span class="punctuation token">.</span><span class="function token">setAttribute</span><span class="punctuation token">(</span><span class="string token">"src"</span><span class="punctuation token">,</span> beastURL<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    beastImage<span class="punctuation token">.</span>style<span class="punctuation token">.</span>height <span class="operator token">=</span> <span class="string token">"100vh"</span><span class="punctuation token">;</span>
-    beastImage<span class="punctuation token">.</span>className <span class="operator token">=</span> <span class="string token">"beastify-image"</span><span class="punctuation token">;</span>
-    document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>beastImage<span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-
-  <span class="comment token">/**
-   * Remueve todas las bestias de la página.
-   */</span>
-  <span class="keyword token">function</span> <span class="function token">removeExistingBeasts</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">let</span> existingBeasts <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelectorAll</span><span class="punctuation token">(</span><span class="string token">".beastify-image"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">let</span> beast <span class="keyword token">of</span> existingBeasts<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      beast<span class="punctuation token">.</span><span class="function token">remove</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-  <span class="punctuation token">}</span>
-
-  <span class="comment token">/**
-   * Atiende mensajes del script de segundo plano.
-   * Llama a "beastify()" o "reset()".
-  */</span>
-  browser<span class="punctuation token">.</span>runtime<span class="punctuation token">.</span>onMessage<span class="punctuation token">.</span><span class="function token">addListener</span><span class="punctuation token">(</span><span class="punctuation token">(</span><span class="parameter token">message</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
-    <span class="keyword token">if</span> <span class="punctuation token">(</span>message<span class="punctuation token">.</span>command <span class="operator token">===</span> <span class="string token">"beastify"</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      <span class="function token">insertBeast</span><span class="punctuation token">(</span>message<span class="punctuation token">.</span>beastURL<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>message<span class="punctuation token">.</span>command <span class="operator token">===</span> <span class="string token">"reset"</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      <span class="function token">removeExistingBeasts</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-  <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Lo primero que hace el script de contenido es revisar la variable global <code>window.hasRun</code>: si está inicializada termina su ejecución, sino, la inicializa y continúa. La razón por la que hacemos esto es porque cada vez que el usuario abre la ventana emergente, se vuelve a ejecutar el script de contenido en la pestaña activa, por lo que podríamos tener múltiples instancias del script ejecutandose en una sola pestaña. Si esto sucede, necesitamos asegurarnos de que sea sólo la primera instancia la que vaya a realizar cambios.</p>
-
-<p>Luego, en la linea 40, donde el script de contenido atiende mensajes provenientes de la ventana emergente (usando la API <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/runtime/onMessage">browser.runtime.onMessage</a></code>), vemos que ésta puede enviar dos mensajes diferentes: "beastify" y "reset".</p>
-
-<ul>
- <li>si el mensaje es "beastify", esperamos que contenga la URL de la imagen. Removemos el contenido que ha sido agregado por el anterior llamado a "beastify", y luego construimos y  añadimos un elemento <code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img">&lt;img&gt;</a></code> cuyo atributo <code>src</code> contiene la URL de la imagen.</li>
- <li>si el mensaje es "reset", simplemente removemos cualquier imagen que haya sido agregada antes.</li>
-</ul>
-
-<h3 id="Las_bestias">Las bestias</h3>
-
-<p>Finalmente, necesitamos incluir las imágenes de los animales.</p>
-
-<p>Crea una carpeta nueva llamada "beasts", y adiciona tres imágenes en ella, con su nombre apropiado. Tu puedes obtener estas imágenes desde el <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify/beasts">repositorio en GitHub</a>, o desde aquí:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/11459/frog.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"><img alt="" src="https://mdn.mozillademos.org/files/11461/snake.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"><img alt="" src="https://mdn.mozillademos.org/files/11463/turtle.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"></p>
-
-<h2 id="Probándolo">Probándolo</h2>
-
-<p>Primero, comprueba nuevamente que tienes todos los archivos necesarios en el lugar adecuado:</p>
-
-<pre class="line-numbers  language-html"><code class="language-html">beastify/
-
-    beasts/
-        frog.jpg
-        snake.jpg
-        turtle.jpg
-
-    content_scripts/
-        beastify.js
-
-    icons/
-        beasts-32.png
-        beasts-48.png
-
-    popup/
-        choose_beast.css
-        choose_beast.html
-        choose_beast.js
-
-    manifest.json</code></pre>
-
-<p>Comenzando con Firefox 45, pueden instalar temporalmente una extensión desde el disco.</p>
-
-<p>Abre "about:debugging" en Firefox, de clic en "Cargar complemento temporalmente", y seleccione el archivo manifest.json. Entonces, debería de ver el ícono de la extensión aparecer en la barra de herramientas de Firefox:</p>
-
-<p>{{EmbedYouTube("sAM78GU4P34")}}</p>
-
-<p>Abra una página web, luego haga clic sobre el ícono, seleccione una bestia, y vea cómo cambia la página web:</p>
-
-<p>{{EmbedYouTube("YMQXyAQSiE8")}}</p>
-
-<h2 id="Desarrollo_desde_la_línea_de_comandos">Desarrollo desde la línea de comandos</h2>
-
-<div id="gt-res-content">
-<div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr">
-<div id="tts_button"> </div>
-
-<p><span id="result_box" lang="es"><span>Puede automatizar el paso de instalación temporal mediante la herramienta <a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a>.</span> <span>Pruebe esto</span></span>:</p>
-</div>
-</div>
-
-<pre class="brush: bash line-numbers  language-bash"><code class="language-bash">cd beastify
-web-ext run</code></pre>
-
-<p> </p>
diff --git a/files/es/mozilla/add-ons/webextensions/user_interface/accion_navegador/index.html b/files/es/mozilla/add-ons/webextensions/user_interface/accion_navegador/index.html
deleted file mode 100644
index 55ce89a9c7..0000000000
--- a/files/es/mozilla/add-ons/webextensions/user_interface/accion_navegador/index.html
+++ /dev/null
@@ -1,50 +0,0 @@
----
-title: Botón de la Barra de Herramientas
-slug: Mozilla/Add-ons/WebExtensions/user_interface/Accion_navegador
-tags:
-  - WebExtension
-translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action
----
-<div>{{AddonSidebar}}</div>
-
-<p>Generalmente referidas como <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">acciones de navegador</a>, esta opción de interfaz de usuario corresponde a un botón agregado a la barra de herramientas del navegador. Los usuarios pueden hacer click en el botón para interactuar con tu extensión.<br>
- <img alt="" src="https://mdn.mozillademos.org/files/15751/browser-action.png" style="display: block; height: 182px; margin-left: auto; margin-right: auto; width: 350px;"></p>
-
-<p>El botón de la barra de herramientas (acción de navegador) es muy parecido al botón de la barra de direcciones (acción de página). Para conocer las diferencias y obtener consejo en cuándo usar qué tipo de botón, te recomendamos ver <a href="/en-US/Add-ons/WebExtensions/user_interface/Page_actions#Page_actions_and_browser_actions">Acciones de página y acciones de navegador</a>.</p>
-
-<h2 id="Especificando_la_acción_de_navegador">Especificando la acción de navegador</h2>
-
-<p>Puedes definir las propiedades de la acción de navegador utilizando la llave <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> del archivo manifest.json:</p>
-
-<pre class="brush: json line-numbers  language-json"><code class="language-json"><span class="key token">"browser_action":</span> <span class="punctuation token">{</span>
-  <span class="key token">"default_icon":</span> <span class="punctuation token">{</span>
-    <span class="key token">"19":</span> <span class="string token">"button/geo-19.png"</span><span class="punctuation token">,</span>
-    <span class="key token">"38":</span> <span class="string token">"button/geo-38.png"</span>
-  <span class="punctuation token">}</span><span class="punctuation token">,</span>
-  <span class="key token">"default_title":</span> <span class="string token">"Whereami?"</span>
-<span class="punctuation token">}</span></code></pre>
-
-<p>El único campo obligatorio es <code>default_icon</code>.</p>
-
-<p>Existen dos formas de especificar una acción de navegador: con o sin una <a href="/en-US/Add-ons/WebExtensions/Popups">ventana emergente</a>. Si no especificas una ventana emergente, se le entregará un evento a la extensión cada vez que el usuario haga click en el botón. El evento es escuchable usando <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/BrowserAction/onClicked" title="Fired when a browser action icon is clicked. This event will not fire if the browser action has a popup."><code>browserAction.onClicked</code></a>:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">browser<span class="punctuation token">.</span>browserAction<span class="punctuation token">.</span>onClicked<span class="punctuation token">.</span><span class="function token">addListener</span><span class="punctuation token">(</span>handleClick<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>En cambio, si especificas una ventana emergente, el evento de click no es despachado al hacer click en el botón: en su lugar, la ventana emergente es mostrada. El usuario podrá interactuar con la ventana emergente, la cual se cerrará automáticamente cada vez que el usuario haga click fuera de ella. Te recomendamos revisar el artículo de <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Popups">ventanas emergentes</a> para conocer más detalles sobre la creación y administración de éstas.</p>
-
-<p>Cabe destacar que tu extensión puede tener solamente una acción de navegador.</p>
-
-<p>Puedes cambiar cualquier propiedad de la acción de navegador de forma programática, utilizando la API <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">browserAction</a></code>.</p>
-
-<h2 id="Íconos">Íconos</h2>
-
-<p>Para más detalles sobre cómo crear íconos para usarlos en tu acción de navegador, revisa <a href="https://design.firefox.com/photon/visuals/iconography.html">Iconografía</a> en la documentación del <a href="https://design.firefox.com/photon/index.html">Sistema de Diseño Photon</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El repositorio de GitHub <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a> contiene dos ejemplos de extensiones que implementan acciones de navegador:</p>
-
-<ul>
- <li><a href="https://github.com/mdn/webextensions-examples/blob/master/bookmark-it/">bookmark-it</a> usa una acción de navegador sin una ventana emergente.</li>
- <li><a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">beastify</a> usa una acción de navegador con una ventana emergente.</li>
-</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/user_interface/browser_action/index.html b/files/es/mozilla/add-ons/webextensions/user_interface/browser_action/index.html
new file mode 100644
index 0000000000..852314f536
--- /dev/null
+++ b/files/es/mozilla/add-ons/webextensions/user_interface/browser_action/index.html
@@ -0,0 +1,51 @@
+---
+title: Botón de la Barra de Herramientas
+slug: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action
+tags:
+  - WebExtension
+translation_of: Mozilla/Add-ons/WebExtensions/user_interface/Browser_action
+original_slug: Mozilla/Add-ons/WebExtensions/user_interface/Accion_navegador
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Generalmente referidas como <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">acciones de navegador</a>, esta opción de interfaz de usuario corresponde a un botón agregado a la barra de herramientas del navegador. Los usuarios pueden hacer click en el botón para interactuar con tu extensión.<br>
+ <img alt="" src="https://mdn.mozillademos.org/files/15751/browser-action.png" style="display: block; height: 182px; margin-left: auto; margin-right: auto; width: 350px;"></p>
+
+<p>El botón de la barra de herramientas (acción de navegador) es muy parecido al botón de la barra de direcciones (acción de página). Para conocer las diferencias y obtener consejo en cuándo usar qué tipo de botón, te recomendamos ver <a href="/en-US/Add-ons/WebExtensions/user_interface/Page_actions#Page_actions_and_browser_actions">Acciones de página y acciones de navegador</a>.</p>
+
+<h2 id="Especificando_la_acción_de_navegador">Especificando la acción de navegador</h2>
+
+<p>Puedes definir las propiedades de la acción de navegador utilizando la llave <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> del archivo manifest.json:</p>
+
+<pre class="brush: json line-numbers  language-json"><code class="language-json"><span class="key token">"browser_action":</span> <span class="punctuation token">{</span>
+  <span class="key token">"default_icon":</span> <span class="punctuation token">{</span>
+    <span class="key token">"19":</span> <span class="string token">"button/geo-19.png"</span><span class="punctuation token">,</span>
+    <span class="key token">"38":</span> <span class="string token">"button/geo-38.png"</span>
+  <span class="punctuation token">}</span><span class="punctuation token">,</span>
+  <span class="key token">"default_title":</span> <span class="string token">"Whereami?"</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p>El único campo obligatorio es <code>default_icon</code>.</p>
+
+<p>Existen dos formas de especificar una acción de navegador: con o sin una <a href="/en-US/Add-ons/WebExtensions/Popups">ventana emergente</a>. Si no especificas una ventana emergente, se le entregará un evento a la extensión cada vez que el usuario haga click en el botón. El evento es escuchable usando <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/BrowserAction/onClicked" title="Fired when a browser action icon is clicked. This event will not fire if the browser action has a popup."><code>browserAction.onClicked</code></a>:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">browser<span class="punctuation token">.</span>browserAction<span class="punctuation token">.</span>onClicked<span class="punctuation token">.</span><span class="function token">addListener</span><span class="punctuation token">(</span>handleClick<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>En cambio, si especificas una ventana emergente, el evento de click no es despachado al hacer click en el botón: en su lugar, la ventana emergente es mostrada. El usuario podrá interactuar con la ventana emergente, la cual se cerrará automáticamente cada vez que el usuario haga click fuera de ella. Te recomendamos revisar el artículo de <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Popups">ventanas emergentes</a> para conocer más detalles sobre la creación y administración de éstas.</p>
+
+<p>Cabe destacar que tu extensión puede tener solamente una acción de navegador.</p>
+
+<p>Puedes cambiar cualquier propiedad de la acción de navegador de forma programática, utilizando la API <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">browserAction</a></code>.</p>
+
+<h2 id="Íconos">Íconos</h2>
+
+<p>Para más detalles sobre cómo crear íconos para usarlos en tu acción de navegador, revisa <a href="https://design.firefox.com/photon/visuals/iconography.html">Iconografía</a> en la documentación del <a href="https://design.firefox.com/photon/index.html">Sistema de Diseño Photon</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El repositorio de GitHub <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a> contiene dos ejemplos de extensiones que implementan acciones de navegador:</p>
+
+<ul>
+ <li><a href="https://github.com/mdn/webextensions-examples/blob/master/bookmark-it/">bookmark-it</a> usa una acción de navegador sin una ventana emergente.</li>
+ <li><a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">beastify</a> usa una acción de navegador con una ventana emergente.</li>
+</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/what_are_webextensions/index.html b/files/es/mozilla/add-ons/webextensions/what_are_webextensions/index.html
new file mode 100644
index 0000000000..558aae636e
--- /dev/null
+++ b/files/es/mozilla/add-ons/webextensions/what_are_webextensions/index.html
@@ -0,0 +1,60 @@
+---
+title: ¿Qué son las extensiones?
+slug: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
+tags:
+  - WebExtensions
+  - extensiones
+translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
+original_slug: Mozilla/Add-ons/WebExtensions/Que_son_las_WebExtensions
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Una extensión agrega características y funciones a un explorador. Se ha creado utilizando tecnologías basadas en Web conocidas: HTML, CSS y JavaScript. Puede aprovechar las mismas API Web que JavaScript en una página web, pero una extensión también tiene acceso a su propio conjunto de APIs de JavaScript. Esto significa que puede hacer mucho más en una extensión de lo que puede con el código en una página web. Estos son sólo algunos ejemplos de las cosas que puedes hacer:</p>
+
+<p><strong>Mejore o complemente un sitio</strong>: Use un Add-on para ofrecer funciones adicionales en el navegador o información de su sitio Web. Permita a los usuarios recopilar detalles de las páginas que visitan para mejorar el servicio que ofrecen.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15808/Amazon_add_on.png"></p>
+
+<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/amazon-browser-bar/">El asistente de Amazon para Firefox</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/onenote-clipper/">OneNote Web Clipper</a> y <a href="https://addons.mozilla.org/en-US/firefox/addon/grammarly-1/">Grammarly para Firefox</a></p>
+
+<p><strong>Permita que los usuarios demuestren su personalidad</strong>: Las extensiones del navegador pueden manipular el contenido de las páginas; por ejemplo, permite a los usuarios agregar su logo favorito o imágen como un fondo de pantalla acada página que visitan. Las extensiones permiten también al usuario actualizar el aspecto de la IU de Firefox, de la misma manera que lo hacen los <a href="https://developer.mozilla.org/es/docs/Temas/Theme_concepts">complementos de temas</a>.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15809/MyWeb_New_Tab_add_on.png" style="height: 398px; width: 540px;"></p>
+
+<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/myweb-new-tab/">MyWeb New Tab</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/tabliss/">Tabliss</a> y <a href="https://addons.mozilla.org/en-US/firefox/addon/vivaldifox/">VivaldiFox</a></p>
+
+<p><strong>Agregar o quitar contenido de las páginas web</strong>: es posible que desee ayudar a los usuarios a bloquear los anuncios intrusivos de las páginas web, proporcionar acceso a una guía de viajes siempre que un país o ciudad se menciona en una página web, o reformatear el contenido de la página para ofrecer una experiencia de lectura consistente. Con la capacidad de acceder y actualizar tanto HTML como CSS de una página, las extensiones pueden ayudar a los usuarios a ver la Web de la manera que quieren.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15807/ublock_origin_add_on.png" style="height: 480px; width: 640px;"></p>
+
+<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/ublock-origin/">Origen uBlock</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/reader/">Lector</a> y <a href="https://addons.mozilla.org/en-US/firefox/addon/toolbox-google-play-store/">Caja de Herramientas para Google Play Store™</a></p>
+
+<p><strong>Agregar herramientas y nuevas funciones de navegación</strong>: añada nuevas funciones a un taskboard o genere imágenes de código QR a partir de URLs, hipervínculos o texto de página. Con opciones de interfaz de usuario flexibles y la potencia de las <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions">APIs de WebExtensions</a>, puede añadir fácilmente nuevas funcionalidades a un navegador. Usted puede realzar casi cualquier característica o funcionalidad de sitios web, no tiene que ser su web.</p>
+
+<p><strong><img alt="" src="https://mdn.mozillademos.org/files/15806/QR_Code_Image_Generator_add_on.png"></strong></p>
+
+<p><strong>Ejemplos: <a href="https://addons.mozilla.org/en-US/firefox/addon/qr-code-image-generator/">QR Code Image Generator</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/swimlanes-for-trello/">Swimlanes for Trello</a>, y <a href="https://addons.mozilla.org/en-US/firefox/addon/tomato-clock/">Tomato Clock</a></strong></p>
+
+<p><strong>Juegos</strong>: ofrecer juegos de ordenador tradicionales, con características de juego fuera de línea, pero también explorar nuevas posibilidades de juego, por ejemplo, mediante la incorporación de gameplay en la navegación cotidiana.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15805/Asteroids_in_Popup_add_on%20.png" style="height: 438px; width: 700px;"></p>
+
+<p>Ejemplos: <a href="https://addons.mozilla.org/en-US/firefox/addon/asteroids-in-popup/">Asteroids in Popup</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/solitaire-card-game-new-tab/">Solitaire Card Game New Tab</a>, and <a href="https://addons.mozilla.org/en-US/firefox/addon/2048-prime/">2048 Prime</a>.</p>
+
+<p><strong>Agregar herramientas de desarrollo</strong>: puede proporcionar herramientas de desarrollo web como su negocio o ha desarrollado una técnica útil o un enfoque para el desarrollo web que desea compartir. De cualquier manera, puede mejorar las herramientas de desarrollo de Firefox incorporadas añadiendo una nueva ficha a la barra de herramientas del desarrollador.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15804/aXe_Developer_Tools_add_on.png" style="height: 261px; width: 700px;"></p>
+
+<p><strong>Ejemplos:</strong> <a href="https://addons.mozilla.org/en-US/firefox/addon/web-developer/">Web Developer</a>, <a href="https://addons.mozilla.org/en-US/firefox/addon/react-devtools/">Web React Developer Tools</a>, and <a href="https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/">aXe Developer Tools</a></p>
+
+<p>Las extensiones para Firefox se construyen utilizando las <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions">APIs de WebExtensions</a>, un sistema multi-navegador para desarrollar extensiones. En gran medida, la API es compatible con la <a class="external external-icon" href="https://developer.chrome.com/extensions">extension API</a> soportada por Google Chrome y Opera. Extensiones escritas para estos navegadores en la mayoría de los casos se ejecutan en Firefox o Microsoft Edge con sólo unos pocos <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension">cambios</a>. La API es también totalmente compatible con los <a href="https://developer.mozilla.org/en-US/Firefox/Multiprocess_Firefox">multiprocesos de Firefox</a>.</p>
+
+<p>Si tiene ideas o preguntas, o necesita ayuda para migrar un Add-on heredado a las APIs de WebExtensions, puede comunicarse con nosotros en el<a class="external external-icon" href="https://mail.mozilla.org/listinfo/dev-addons">dev-addons mailing list</a> o en <a href="irc://irc.mozilla.org/extdev">#extdev</a> en <a class="external external-icon" href="https://wiki.mozilla.org/IRC">IRC</a>.</p>
+
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+
+<ul>
+ <li>Para recorrer el desarrollo de una simple extensión, vea <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Tu_primera_WebExtension">Tu primera extensión</a>.</li>
+ <li>Aprende sobre la estructura de una extensión en <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Anatomia_de_una_WebExtension">anatomía de una extensión</a>.</li>
+ <li>Pruebe algunos ejemplos de extensiones en <a href="https://developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Examples">Extensiones de ejemplo</a>.</li>
+</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/your_first_webextension/index.html b/files/es/mozilla/add-ons/webextensions/your_first_webextension/index.html
new file mode 100644
index 0000000000..1a2ad67967
--- /dev/null
+++ b/files/es/mozilla/add-ons/webextensions/your_first_webextension/index.html
@@ -0,0 +1,161 @@
+---
+title: Tu primera extensión
+slug: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension
+tags:
+  - Guía
+  - WebExtension
+translation_of: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension
+original_slug: Mozilla/Add-ons/WebExtensions/Tu_primera_WebExtension
+---
+<div>{{AddonSidebar}}</div>
+
+<div class="blockIndicator note">
+<p>Si estás familiarizado/a con los conceptos básicos de las extensiones de navegador, omite esta sección y ve a <a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">cómo se ponen juntos los archivos</a>. Entonces, usa la <a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions#Reference">documentación de referencia</a> para empezar a construir tu extensión. Visita el <a href="https://extensionworkshop.com/?utm_source=developer.mozilla.org&amp;utm_medium=documentation&amp;utm_campaign=your-first-extension">Firefox Extension Workshop</a> para aprender más sobre el flujo de trabajo para probar y publicar extensiones para Firefox.</p>
+</div>
+
+<p>En este artículo abordaremos la creación de una extensión para Firefox, desde el comienzo hasta el final. La extensión solo agrega un borde rojo a cualquiera de las páginas cargadas desde "mozilla.org" o cualquiera de sus subdominios.</p>
+
+<p>El código fuente de este ejemplo se encuentra en GitHub: <a href="https://github.com/mdn/webextensions-examples/tree/master/borderify">https://github.com/mdn/webextensions-examples/tree/master/borderify</a>.</p>
+
+<p>Primero, necesitas tener instalado Firefox versión 45 o superior.</p>
+
+<h2 id="Escribiendo_la_extensión">Escribiendo la extensión</h2>
+
+<p>Crea una nuevo directorio y navega a él. Por ejemplo, en tu línea de comandos/terminal se hace de esta manera:</p>
+
+<pre class="brush: bash notranslate">mkdir borderify
+cd borderify</pre>
+
+<h3 id="manifest.json">manifest.json</h3>
+
+<p>Ahora crearemos un archivo  nuevo llamado "manifest.json" directamente en la carpeta "borderify". Añádale el siguiente contenido:</p>
+
+<pre class="brush: json notranslate">{
+
+  "manifest_version": 2,
+  "name": "Borderify",
+  "version": "1.0",
+
+  "description": "Agrega un borde rojo a todas las páginas web de mozilla.org.",
+
+  "icons": {
+    "48": "icons/border-48.png"
+  },
+
+  "content_scripts": [
+    {
+      "matches": ["*://*.mozilla.org/*"],
+      "js": ["borderify.js"]
+    }
+  ]
+
+}</pre>
+
+<ul>
+ <li>Los primeros 3 parámetros:<code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/manifest_version">manifest_version</a></code>, <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/name">name</a></code>, y <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/version">version</a></code>, son obligatorios, y contienen metadatos básicos para la extensión.</li>
+ <li><code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/description">description</a></code> es opcional, pero se recomienda: Se muestra en el Administrador de Add-ons.</li>
+ <li><code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/icons">icons</a></code> es opcional, pero recomendado: permite especificar un ícono para la extensión, se mostrará en el Administrador de Add-ons.</li>
+</ul>
+
+<p>El parámetro más interesante aquí es <code><a href="/es/Add-ons/WebExtensions/manifest.json/content_scripts">content_scripts</a></code>, el cual le dice a Firefox que cargue el script en las páginas Web, cuyas URL coincidan con un patrón especifico. En este caso, le estamos pidiendo a Firefox que cargue el script llamado "borderify.js" en todas las paginas HTTP o HTTPS cargadas desde "mozilla.org" o cualquiera de sus subdominios.</p>
+
+<ul>
+ <li><a href="/es/Add-ons/WebExtensions/Content_scripts">Aprenda más acerca de los scripts contenidos.</a></li>
+ <li><a href="/es/Add-ons/WebExtensions/Match_patterns">Aprenda más acerca de los patrones coincidentes</a>.</li>
+</ul>
+
+<div class="warning">
+<p><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/WebExtensions_and_the_Add-on_ID#When_do_you_need_an_Add-on_ID">En algunas situaciones usted necesita especificar un ID para su extensión</a>. Si necesita especificar un ID para el complemento, incluya el parámetro <code><a href="/es/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> en el <code>manifest.json</code> y configure la propiedad <code>gecko.id</code>:</p>
+
+<pre class="brush: json notranslate">"applications": {
+  "gecko": {
+    "id": "borderify@example.com"
+  }
+}</pre>
+</div>
+
+<h3 id="iconsborder-48.png">icons/border-48.png</h3>
+
+<p>La extensión debería tener un ícono. Este se mostrará junto al listado de extensiones en el Administrador de Add-ons. Nuestro manifest.json promete que tendremos un ícono  en el directorio "icons/border-48.png".</p>
+
+<p>Crea el directorio "icons" dentro de la carpeta "borderify". Almacena ahí el icono y nómbralo "border-48.png". Puedes utilizar <a href="https://github.com/mdn/webextensions-examples/blob/master/borderify/icons/border-48.png">el de nuestro ejemplo</a>, el cual se obtuvo a partir del Google Material Design iconset, y es utilizado bajo los términos de la licencia <a href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons Attribution-ShareAlike</a>.</p>
+
+<p>Si eliges emplear tu propio icono, este debe ser de 48x48 pixeles. También puedes aplicar un icono de 96x96 pixeles, para resoluciones mayores, y si haces esto, se especifica como la propiedad <code>96</code> en el objeto icons del manifest.json:</p>
+
+<pre class="brush: json notranslate">"icons": {
+  "48": "icons/border-48.png",
+  "96": "icons/border-96.png"
+}</pre>
+
+<p>Alternativamente, puedes aplicar un archivo SVG ahí, y este se escalará apropiadamente. (Aunque: si usas SVG y tu icono incluye texto, puedes usar la herramienta "convert to path" del editor SVG para aplanar el texto, de modo que se escalone con un tamaño/posición coherente).</p>
+
+<ul>
+ <li><a href="/es/Add-ons/WebExtensions/manifest.json/icons">Aprender mas acerca de la especificación de iconos.</a></li>
+</ul>
+
+<h3 id="borderify.js">borderify.js</h3>
+
+<p>Finalmente, crea un archivo de nombre "borderify.js" directamente en el directorio "borderify". Y déjale el siguiente contenido:</p>
+
+<pre class="brush: js notranslate">document.body.style.border = "5px solid red";</pre>
+
+<p>Este script se cargara en las páginas que coincidan con el patrón dado en el parámetro <code>content_scripts</code> del archivo manifest.json. El script tiene acceso directo al documento, de la misma manera que los scripts cargados por la propia página.</p>
+
+<ul>
+ <li><a href="/es/Add-ons/WebExtensions/Content_scripts">Aprender más acerca de los scripts de contenido.</a></li>
+</ul>
+
+<h2 id="Probándolo">Probándolo</h2>
+
+<p>Primero, verifica que tienes todos los archivos en su lugar:</p>
+
+<pre class="notranslate">borderify/
+    icons/
+        border-48.png
+    borderify.js
+    manifest.json</pre>
+
+<h3 id="Instalación">Instalación</h3>
+
+<p>Abre "about:debugging" en Firefox, da click en "Cargar complemento temporal" y selecciona cualquier archivo en el directorio de la extensión:</p>
+
+<p>{{EmbedYouTube("cer9EUKegG4")}}</p>
+
+<p>La extensión se encontrará instalada, y lo estará hasta que reinicies Firefox.</p>
+
+<p>Alternativamente, puede ejecuturar la extensión desde la línea de comandos utilizando la herramienta <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a>.</p>
+
+<h3 id="Probando">Probando</h3>
+
+<p>Ahora pruebe visitando una página bajo "mozilla.org", y usted verá el borde rojo alrededor de la página:</p>
+
+<p>{{EmbedYouTube("rxBQl2Z9IBQ")}}</p>
+
+<div class="note">
+<p>No lo intentes en addons.mozilla.org! Los scripts de contenido están actualmente bloqueados en ese dominio.</p>
+</div>
+
+<p>Experimenta un poco. Edita el contenido del script para cambiar el color del borde, o haz algo más en el contenido de la página. Si actualizas el script de contenido, recarga los archivos de la extensión haciendo clic en el botón "Recargar" en about:debugging. Podrás ver los cambios en el momento:</p>
+
+<p>{{EmbedYouTube("NuajE60jfGY")}}</p>
+
+<ul>
+ <li><a href="/es/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Aprende más sobre cómo recargar las extensiones</a></li>
+</ul>
+
+<h2 id="Empaquetar_y_publicar">Empaquetar y publicar</h2>
+
+<p>Para que otras personas puedan utilizar tu extensión, necesitas empaquetarlo y enviarlo a Mozilla para que lo firmen. Para que aprendas más sobre eso, mira <a href="/es/docs/Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension">"Publicando tu extension"</a>.</p>
+
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+
+<p>Ahora que tienes una idea acerca del proceso de desarrollo de una WebExtension para Firefox, continúa con:</p>
+
+<ul>
+ <li><a href="/es/Add-ons/WebExtensions/Your_second_WebExtension">escribe una extensión más compleja</a></li>
+ <li><a href="/es/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">leer más acerca de la anatomía de una extensión</a></li>
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/Examples">explora los ejemplos de extensiones</a></li>
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/What_next_">encuentra lo que necesitas para desarrollar, probar y publicar tu extensión</a></li>
+ <li><a href="/es/Add-ons/WebExtensions/API">leer acerca de las APIs de JavaScript disponibles para las extensiones.</a></li>
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Mozilla/Add-ons/WebExtensions/What_next_#Continue_your_learning_experience">lleva tu aprendizaje más lejos</a></li>
+</ul>
diff --git a/files/es/mozilla/add-ons/webextensions/your_second_webextension/index.html b/files/es/mozilla/add-ons/webextensions/your_second_webextension/index.html
new file mode 100644
index 0000000000..44fe75923e
--- /dev/null
+++ b/files/es/mozilla/add-ons/webextensions/your_second_webextension/index.html
@@ -0,0 +1,460 @@
+---
+title: Tu segunda extensión
+slug: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension
+tags:
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension
+original_slug: Mozilla/Add-ons/WebExtensions/Tutorial
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Si ya ha visto el artículo <a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Tu_primera_WebExtension">tu primer extensión</a>, ya posee una idea de como escribir una extensión. En este artículo se escribirá una extensión ligeramente más compleja para demostrar un par de cosas más de las APIs.</p>
+
+<p>La extensión añade un nuevo botón a la barra de herramientas de Firefox. Cuando el usuario da clic sobre el botón, mostraremos una ventana emergente que permite escoger un animal. Una vez que un animal sea escogido, reemplazaremos todas las imágenes en la página actual con la imagen del animal seleccionado.</p>
+
+<p>Para implementar esto, haremos lo siguiente:</p>
+
+<ul>
+ <li><strong>Definir una <a href="/es/Add-ons/WebExtensions/user_interface/Browser_action">acción del navegador</a>, que será el botón añadido a la barra de herramientas de Firefox</strong>.<br>
+  Para el botón vamos a proporcionar:
+  <ul>
+   <li>un icono, llamado "beasts-32.png"</li>
+   <li>una ventana emergente para abrir cuando el botón sea presionado. La  ventana emergente incluye HTML, CSS y JavaScript.</li>
+  </ul>
+ </li>
+ <li><strong>Define un ícono para la extensión,</strong> llamado "beasts-48.png". Este será mostrado en el Administrador de Complementos.</li>
+ <li><strong>Escribe un script de contenido, "beastify.js" que será inyectado dentro de las páginas web.</strong><br>
+  Este es el código que modificará las páginas web.</li>
+ <li><strong>Empaqueta algunas imágenes de animales, para reemplazar las imágnes de la página web</strong>.<br>
+  Nosotros haremos las imágenes "recursos web accesibles" para que la página web pueda referenciarlos.</li>
+</ul>
+
+<p>Tu puedes notar que la estructura general de la extensión luce como esto:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13671/Untitled-1.png" style="display: block; height: 1200px; margin-left: auto; margin-right: auto; width: 860px;"></p>
+
+<p>Esta es una extensión simple, pero muestra muchos de los principales conceptos de la API WebExtensions:</p>
+
+<ul>
+ <li>Adicionando un botón a la barra de herramientas</li>
+ <li>Definiendo un panel emergente usando HTML, CSS y JavaScript</li>
+ <li>Inyectando scripts de contenido dentro de las páginas web</li>
+ <li>Comunicándonos entre los scripts de contenido y el resto de la extensión</li>
+ <li>Empaquetando recursos con tu extensión que pueden ser usados por las páginas web</li>
+</ul>
+
+<p>Tu puedes encontrar el <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">código fuente completo de la extensión en GitHub</a>.</p>
+
+<p>Para escribir una extensión, necesitará de Firefox 45 o más reciente.</p>
+
+<h2 id="Escribiendo_la_extensión">Escribiendo la extensión</h2>
+
+<p>Crea una carpeta nueva y navega hacia ella:</p>
+
+<pre class="brush: bash">mkdir beastify
+cd beastify</pre>
+
+<h3 id="manifest.json">manifest.json</h3>
+
+<p>Ahora crea un archivo llamado "manifest.json", y agrega el siguiente contenido:</p>
+
+<pre class="brush: json">{
+
+  "manifest_version": 2,
+  "name": "Beastify",
+  "version": "1.0",
+
+  "description": "Agrega un icono de acción navegación a la barra de herramientas. Haga clic en el botón para elegir una bestia. El contenido del cuerpo de la pestaña activa se sustituye por una imagen de la bestia elegida. Consulte https://developer.mozilla.org/es/Add-ons/WebExtensions/Examples#beastify",
+  "homepage_url": "https://github.com/mdn/webextensions-examples/tree/master/beastify",
+  "icons": {
+    "48": "icons/beasts-48.png"
+  },
+
+  "permissions": [
+    "activeTab"
+  ],
+
+  "browser_action": {
+    "default_icon": "icons/beasts-32.png",
+    "default_title": "Bestificar",
+    "default_popup": "popup/choose_beast.html"
+  },
+
+  "web_accessible_resources": [
+    "beasts/frog.jpg",
+    "beasts/turtle.jpg",
+    "beasts/snake.jpg"
+  ]
+
+}
+</pre>
+
+<ul>
+ <li>Las tres primeras llaves: <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/manifest_version">manifest_version</a></code> , <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/name">name</a></code> , y <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/version">version</a></code> , son obligatorias y contienen los metadatos básicos para la extensión.</li>
+ <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/description">description</a></code> y <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/homepage_url">homepage_url</a></code> son opcionales, pero recomendadas: proporcionan información útil acerca de la extensión.</li>
+ <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/icons">icons</a></code> es opcional, pero recomedada: permite la especificación de un ícono para la extensión, que será mostrada en el Administrador de Complementos.</li>
+ <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissions</a></code> lista los permisos que la extensión necesita. Aquí solo se pide el permiso de <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/permissions#activeTab_permission"><code>activeTab</code> permission</a>.</li>
+ <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> especifica el botón de la barra de herramientas.  Nosotros proveemos tres piezas de información aquí:
+  <ul>
+   <li><code>default_icon</code> es obligatorio y enlaza al icono para el botón</li>
+   <li><code>default_title</code> es opcional y será mostrado como descripción</li>
+   <li><code>default_popup</code> es usado su tu quieres una ventana emergente que será mostrada cuando el usuario de clic en el botón. Lo hacemos y hemos incluido esta llave que apunta a un archivo HTML de la extensión.</li>
+  </ul>
+ </li>
+ <li><code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/web_accessible_resources">web_accessible_resources</a></code> lista los archivos que queremos hacer accesibles a las páginas web. Como la extensión reemplaza imágenes en una página con imágenes que hemos empaquetado, necesitamos hacer estas imágenes accesibles a la página.</li>
+</ul>
+
+<p>Nota que todas las rutas dadas son relativas a manifest.json.</p>
+
+<h3 id="El_ícono">El ícono</h3>
+
+<p>La extensión debería tener un íncono. Éste, será mostrado junto a la lista de complementos en el Administrador de Complementos (Pude abrirlo introduciendo en la URL "about:addons"). El manifest.json promete que se posee un ícono para la barra de herramientas en "icons/beasts-48.png".</p>
+
+<p>Cree el directorio "icons" y guarde un ícono ahí y nómbrelo como "beasts-48.png".  Puede utilizar <a href="https://github.com/mdn/webextensions-examples/blob/master/beastify/icons/beasts-48.png">uno de nuestro ejemplo</a>, el cual ha sido tomado del  <a href="https://www.iconfinder.com/iconsets/free-retina-icon-set">conjuto de íconos Aha-Soft’s Free Retina</a>, que es utilizado bajo el término de su propia <a href="http://www.aha-soft.com/free-icons/free-retina-icon-set/">licencia</a>.</p>
+
+<p>Si elige proporcionar su propio ícono, debería ser de 48x48 pixeles. También puede proporcionar un ícono de 96x96 pixeles, para pantallas de altas resoluciones y, si usted hace esto, deberá especificarlo como la propiedad <code>96</code> del objeto <code>icons</code> en el manifest.json:</p>
+
+<pre class="brush: json line-numbers  language-json"><code class="language-json"><span class="key token">"icons":</span> <span class="punctuation token">{</span>
+  <span class="key token">"48":</span> <span class="string token">"icons/beasts-48.png"</span><span class="punctuation token">,</span>
+  <span class="key token">"96":</span> <span class="string token">"icons/beasts-96.png"</span>
+<span class="punctuation token">}</span></code></pre>
+
+<h3 id="El_botón_de_la_barra_de_herramientas">El botón de la barra de herramientas</h3>
+
+<p>El botón de la barra de herramientas necesita un ícono, y nuestro manifest.json promete eso y nos gustaría tener un ícono para la barra de herramientas en "icons/beasts-32.png".</p>
+
+<p>Guarde un ícono llamado "beasts-32.png" en el directorio "icons". Tu podrías usar <a href="https://github.com/mdn/webextensions-examples/blob/master/beastify/icons/beasts-32.png">uno de nuestros ejemplos</a>, los cuales son tomados desde el sitio <a href="http://www.iconbeast.com/free">IconBeast Lite icon set</a> y empleados bajo sus términos de <a href="http://www.iconbeast.com/faq/">licencia</a>.</p>
+
+<p>Si tu no provees una ventana emergente, entonces el evento clic es disparado hacia tu extensión cuando el usuario de clic sobre el botón. Si provees una ventana emergente entonces el evento clic no se disparará, pero en cambio, se muestra la ventana emergente. Nosotros queremos una ventana emergente, así que vamos a crearla.</p>
+
+<h3 id="La_ventana_emergente">La ventana emergente</h3>
+
+<p>La función de la ventana emergente es habilitada si el usuario escoge una de los tres animales.</p>
+
+<p>Crea una nueva carpeta llamada "popup" bajo la carpeta raíz de la extensión . Esta será donde pondremos el código para la ventana emergente. La carpeta "popup" contendrá estos tres archivos:</p>
+
+<ul>
+ <li><strong><code>choose_beast.html</code></strong> define el contenido del panel</li>
+ <li><strong><code>choose_beast.css</code></strong> los estilos CSS para el contenido</li>
+ <li><strong><code>choose_beast.js</code></strong> maneja las opciones del usuario ejecutando un script de contenido en la pestaña activa</li>
+</ul>
+
+<h4 id="choose_beast.html">choose_beast.html</h4>
+
+<p>El archivo HTML luce así:</p>
+
+<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="doctype token">&lt;!DOCTYPE html&gt;</span>
+
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>meta</span> <span class="attr-name token">charset</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>utf-8<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>link</span> <span class="attr-name token">rel</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>stylesheet<span class="punctuation token">"</span></span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>choose_beast.css<span class="punctuation token">"</span></span><span class="punctuation token">/&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
+
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>popup-content<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button beast<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Frog<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button beast<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Turtle<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button beast<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Snake<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button reset<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>Reset<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>error-content<span class="punctuation token">"</span></span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>hidden<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Can't beastify this web page.<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Try a different page.<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>script</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>choose_beast.js<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>script</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
+
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p>Tenemos un elemento <code>&lt;div&gt;</code> con un ID <code>"popup-content"</code> que contiene un elemento para cada elección de animal. Además, tenemos otro <code>&lt;div&gt;</code> con un ID <code>"error-content"</code> y una clase <code>"hidden"</code>, que usaremos en el case de que surja algún problema al inicializar la ventana emergente.</p>
+
+<p>Note que referenciamos los archivos CSS y JS en el HTML como lo haríamos si se tratase de una página web.</p>
+
+<h4 id="choose_beast.css">choose_beast.css</h4>
+
+<p>El CSS ajusta el tamaño de la ventana emergente, se asegura que las tres posibles opciones llenen el espacio y les da un poco de estilo básico. Además oculta los elementos con <code>class="hidden"</code>: esto significa que nuestro <code>"error-content"</code> <code>&lt;div&gt;</code> estará oculto por defecto.</p>
+
+<pre class="brush: css line-numbers language-css"><code class="language-css"><span class="selector token">html, body</span> <span class="punctuation token">{</span>
+  <span class="property token">width</span><span class="punctuation token">:</span> <span class="number token">100</span><span class="token unit">px</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token"><span class="class token">.hidden</span></span> <span class="punctuation token">{</span>
+  <span class="property token">display</span><span class="punctuation token">:</span> none<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token"><span class="class token">.button</span></span> <span class="punctuation token">{</span>
+  <span class="property token">margin</span><span class="punctuation token">:</span> <span class="number token">3</span><span class="token unit">%</span> auto<span class="punctuation token">;</span>
+  <span class="property token">padding</span><span class="punctuation token">:</span> <span class="number token">4</span><span class="token unit">px</span><span class="punctuation token">;</span>
+  <span class="property token">text-align</span><span class="punctuation token">:</span> center<span class="punctuation token">;</span>
+  <span class="property token">font-size</span><span class="punctuation token">:</span> <span class="number token">1.5</span><span class="token unit">em</span><span class="punctuation token">;</span>
+  <span class="property token">cursor</span><span class="punctuation token">:</span> pointer<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token"><span class="class token">.beast</span><span class="pseudo-class token">:hover</span></span> <span class="punctuation token">{</span>
+  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#CFF2F2</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token"><span class="class token">.beast</span></span> <span class="punctuation token">{</span>
+  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#E5F2F2</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token"><span class="class token">.reset</span></span> <span class="punctuation token">{</span>
+  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#FBFBC9</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token"><span class="class token">.reset</span><span class="pseudo-class token">:hover</span></span> <span class="punctuation token">{</span>
+  <span class="property token">background-color</span><span class="punctuation token">:</span> <span class="hexcode token">#EAEA9D</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<h4 id="choose_beast.js">choose_beast.js</h4>
+
+<p>Aquí está el JavaScript para la ventana emergente:</p>
+
+<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="comment token">/**
+ * CSS para ocultar toda la página
+ * Excepto los elementos que pertenecen a la clase "beastify-image".
+ */</span>
+<span class="keyword token">const</span> hidePage <span class="operator token">=</span> <span class="template-string token"><span class="string token">`body &gt; :not(.beastify-image) {
+                    display: none;
+                  }`</span></span><span class="punctuation token">;</span>
+
+<span class="comment token">/**
+ * Esucha los clicks en los botones y envía el mensaje apropiado
+ * al script de contenido de la página.
+ */</span>
+<span class="keyword token">function</span> <span class="function token">listenForClicks</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  document<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">"click"</span><span class="punctuation token">,</span> <span class="punctuation token">(</span><span class="parameter token">e</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
+
+    <span class="comment token">/**
+     * Recibe el nombre de una bestia y obtiene la URL de la imagen correspondiente.
+     */</span>
+    <span class="keyword token">function</span> <span class="function token">beastNameToURL</span><span class="punctuation token">(</span><span class="parameter token">beastName</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      <span class="keyword token">switch</span> <span class="punctuation token">(</span>beastName<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">case</span> <span class="string token">"Frog"</span><span class="punctuation token">:</span>
+          <span class="keyword token">return</span> browser<span class="punctuation token">.</span>extension<span class="punctuation token">.</span><span class="function token">getURL</span><span class="punctuation token">(</span><span class="string token">"beasts/frog.jpg"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">case</span> <span class="string token">"Snake"</span><span class="punctuation token">:</span>
+          <span class="keyword token">return</span> browser<span class="punctuation token">.</span>extension<span class="punctuation token">.</span><span class="function token">getURL</span><span class="punctuation token">(</span><span class="string token">"beasts/snake.jpg"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="keyword token">case</span> <span class="string token">"Turtle"</span><span class="punctuation token">:</span>
+          <span class="keyword token">return</span> browser<span class="punctuation token">.</span>extension<span class="punctuation token">.</span><span class="function token">getURL</span><span class="punctuation token">(</span><span class="string token">"beasts/turtle.jpg"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+      <span class="punctuation token">}</span>
+    <span class="punctuation token">}</span>
+
+    <span class="comment token">/**
+     * Inserta dentro de la pestaña activa el CSS que oculta la página
+     * luego toma la URL de la imagen y
+     * envía un mensaje "beastify" al script de contenido de la pestaña activa.
+     */</span>
+    <span class="keyword token">function</span> <span class="function token">beastify</span><span class="punctuation token">(</span><span class="parameter token">tabs</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">insertCSS</span><span class="punctuation token">(</span><span class="punctuation token">{</span>code<span class="punctuation token">:</span> hidePage<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
+        <span class="keyword token">let</span> url <span class="operator token">=</span> <span class="function token">beastNameToURL</span><span class="punctuation token">(</span>e<span class="punctuation token">.</span>target<span class="punctuation token">.</span>textContent<span class="punctuation token">)</span><span class="punctuation token">;</span>
+        browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">sendMessage</span><span class="punctuation token">(</span>tabs<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span>id<span class="punctuation token">,</span> <span class="punctuation token">{</span>
+          command<span class="punctuation token">:</span> <span class="string token">"beastify"</span><span class="punctuation token">,</span>
+          beastURL<span class="punctuation token">:</span> url
+        <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+      <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+
+    <span class="comment token">/**
+     * Remueve el CSS que oculta la página y
+     * envía un mensaje de "reset" al script de contenido de la pestaña activa.
+     */</span>
+    <span class="keyword token">function</span> <span class="function token">reset</span><span class="punctuation token">(</span><span class="parameter token">tabs</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">removeCSS</span><span class="punctuation token">(</span><span class="punctuation token">{</span>code<span class="punctuation token">:</span> hidePage<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
+        browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">sendMessage</span><span class="punctuation token">(</span>tabs<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span>id<span class="punctuation token">,</span> <span class="punctuation token">{</span>
+          command<span class="punctuation token">:</span> <span class="string token">"reset"</span><span class="punctuation token">,</span>
+        <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+      <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+
+    <span class="comment token">/**
+     * Imprime el error en consola.
+     */</span>
+    <span class="keyword token">function</span> <span class="function token">reportError</span><span class="punctuation token">(</span><span class="parameter token">error</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="template-string token"><span class="string token">`Could not beastify: </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>error<span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+
+    <span class="comment token">/**
+     * Toma la pestaña activa y
+     * llama a "beastify()" o "reset()" según corresponda.
+     */</span>
+    <span class="keyword token">if</span> <span class="punctuation token">(</span>e<span class="punctuation token">.</span>target<span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">contains</span><span class="punctuation token">(</span><span class="string token">"beast"</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">query</span><span class="punctuation token">(</span><span class="punctuation token">{</span>active<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">,</span> currentWindow<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">}</span><span class="punctuation token">)</span>
+        <span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>beastify<span class="punctuation token">)</span>
+        <span class="punctuation token">.</span><span class="function token">catch</span><span class="punctuation token">(</span>reportError<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>e<span class="punctuation token">.</span>target<span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">contains</span><span class="punctuation token">(</span><span class="string token">"reset"</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">query</span><span class="punctuation token">(</span><span class="punctuation token">{</span>active<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">,</span> currentWindow<span class="punctuation token">:</span> <span class="boolean token">true</span><span class="punctuation token">}</span><span class="punctuation token">)</span>
+        <span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>reset<span class="punctuation token">)</span>
+        <span class="punctuation token">.</span><span class="function token">catch</span><span class="punctuation token">(</span>reportError<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+  <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="comment token">/**
+ * Si hubo algún error al ejecutar el script,
+ * Despliega un popup con el mensaje de error y oculta la UI normal.
+ */</span>
+<span class="keyword token">function</span> <span class="function token">reportExecuteScriptError</span><span class="punctuation token">(</span><span class="parameter token">error</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">"#popup-content"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span><span class="string token">"hidden"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">"#error-content"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>classList<span class="punctuation token">.</span><span class="function token">remove</span><span class="punctuation token">(</span><span class="string token">"hidden"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="template-string token"><span class="string token">`Failed to execute beastify content script: </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>error<span class="punctuation token">.</span>message<span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="comment token">/**
+ * Cuando se carga la ventana emergente, inyecta el script de contenido en la pestaña activa,
+ * y agrega un manejador de eventos.
+ * Si no es posible inyectar el script, se ocupa de manejar el error.
+ */</span>
+browser<span class="punctuation token">.</span>tabs<span class="punctuation token">.</span><span class="function token">executeScript</span><span class="punctuation token">(</span><span class="punctuation token">{</span>file<span class="punctuation token">:</span> <span class="string token">"/content_scripts/beastify.js"</span><span class="punctuation token">}</span><span class="punctuation token">)</span>
+<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>listenForClicks<span class="punctuation token">)</span>
+<span class="punctuation token">.</span><span class="function token">catch</span><span class="punctuation token">(</span>reportExecuteScriptError<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Empecemos por la linea 96. La ventana emergente ejecuta un script de contenido en la pestaña activa tan pronto como se termina de cargar, usando la API <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/executeScript">browser.tabs.executeScript()</a></code>. Si la ejecución del script de contenido es exitosa, este quedará cargado en la página hasta que sea cerrada la pestaña o hasta que el usuario navegue hacia una página distinta.</p>
+
+<div class="blockIndicator note">
+<p>Un motivo común por el cual el llamado a <code>browser.tabs.executeScript()</code> puede fallar, es porque no es posible ejecutar scripts de contenido en todas las páginas, por ejemplo, en páginas de navegador privilegiadas como about:debugging, o páginas del dominio <a href="https://addons.mozilla.org/">addons.mozilla.org</a>, no es posible hacerlo.</p>
+</div>
+
+<p>Si la ejecución falla, <code>reportExecuteScriptError()</code> ocultará el <code>&lt;div&gt;</code> <code>"popup-content"</code>, mostrará el <code>&lt;div&gt;</code> <code>"error-content"</code>, y reportará el error en la consola.</p>
+
+<p>Si la ejecución del script de contenido es exitosa, se llamará a <code>listenForClicks()</code>, que atiende los eventos que se generan al cliquear en la ventana emergente.</p>
+
+<ul>
+ <li>Si el clic se produjo en el botón con <code>class="beast"</code>, se llama a <code>beastify()</code>.</li>
+ <li>Si el clic se produjo en el botón con <code>class="reset"</code>, se llama a  <code>reset()</code>.</li>
+</ul>
+
+<p>La función <code>beastify()</code> hace tres cosas:</p>
+
+<ul>
+ <li>map the button clicked to a URL pointing to an image of a particular beast</li>
+ <li>Oculta todo el contenido de la página al insertar CSS con la API <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs/insertCSS">browser.tabs.insertCSS()</a></code></li>
+ <li>Envía un mensaje "beastify" al script de contenido usando la API <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/sendMessage">browser.tabs.sendMessage()</a></code>, solicitándole "bestificar" la página, y enviándole la URL de la imagen.</li>
+</ul>
+
+<p>La función <code>reset()</code> deshace lo hecho por <code>beastify()</code>:</p>
+
+<ul>
+ <li>Remueve el CSS que agregó, usando la API <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/tabs/removeCSS">browser.tabs.removeCSS()</a></code></li>
+ <li>Envía un mensaje de "reset" al script de contenido, solicitándole que resetee la página</li>
+</ul>
+
+<h3 id="El_script_de_contenido">El script de contenido</h3>
+
+<p>Crea una carpeta nueva bajo la raíz del complemento llamada "content_scripts" y crea un nuevo archivo en ella llamado "beastify.js", con el contenido siguiente:</p>
+
+<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="comment token">/**
+   * Revisa e inicializa una variable de guardia.
+   * Si este script de contenido es insertado más de una vez
+   * en la misma página, dejará de ejecutarse.
+   */</span>
+  <span class="keyword token">if</span> <span class="punctuation token">(</span>window<span class="punctuation token">.</span>hasRun<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">return</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  window<span class="punctuation token">.</span>hasRun <span class="operator token">=</span> <span class="boolean token">true</span><span class="punctuation token">;</span>
+
+<span class="comment token">/**
+* Recibe la URL de la imagen, remueve las que se hayan agregado antes,
+* crea un nodo IMG que apunt hacia la imagen
+* e inserta ese nodo en el documento.
+*/</span>
+  <span class="keyword token">function</span> <span class="function token">insertBeast</span><span class="punctuation token">(</span><span class="parameter token">beastURL</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="function token">removeExistingBeasts</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="keyword token">let</span> beastImage <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">"img"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    beastImage<span class="punctuation token">.</span><span class="function token">setAttribute</span><span class="punctuation token">(</span><span class="string token">"src"</span><span class="punctuation token">,</span> beastURL<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    beastImage<span class="punctuation token">.</span>style<span class="punctuation token">.</span>height <span class="operator token">=</span> <span class="string token">"100vh"</span><span class="punctuation token">;</span>
+    beastImage<span class="punctuation token">.</span>className <span class="operator token">=</span> <span class="string token">"beastify-image"</span><span class="punctuation token">;</span>
+    document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>beastImage<span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+
+  <span class="comment token">/**
+   * Remueve todas las bestias de la página.
+   */</span>
+  <span class="keyword token">function</span> <span class="function token">removeExistingBeasts</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">let</span> existingBeasts <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelectorAll</span><span class="punctuation token">(</span><span class="string token">".beastify-image"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">let</span> beast <span class="keyword token">of</span> existingBeasts<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      beast<span class="punctuation token">.</span><span class="function token">remove</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+  <span class="punctuation token">}</span>
+
+  <span class="comment token">/**
+   * Atiende mensajes del script de segundo plano.
+   * Llama a "beastify()" o "reset()".
+  */</span>
+  browser<span class="punctuation token">.</span>runtime<span class="punctuation token">.</span>onMessage<span class="punctuation token">.</span><span class="function token">addListener</span><span class="punctuation token">(</span><span class="punctuation token">(</span><span class="parameter token">message</span><span class="punctuation token">)</span> <span class="operator token">=&gt;</span> <span class="punctuation token">{</span>
+    <span class="keyword token">if</span> <span class="punctuation token">(</span>message<span class="punctuation token">.</span>command <span class="operator token">===</span> <span class="string token">"beastify"</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      <span class="function token">insertBeast</span><span class="punctuation token">(</span>message<span class="punctuation token">.</span>beastURL<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>message<span class="punctuation token">.</span>command <span class="operator token">===</span> <span class="string token">"reset"</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      <span class="function token">removeExistingBeasts</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+  <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Lo primero que hace el script de contenido es revisar la variable global <code>window.hasRun</code>: si está inicializada termina su ejecución, sino, la inicializa y continúa. La razón por la que hacemos esto es porque cada vez que el usuario abre la ventana emergente, se vuelve a ejecutar el script de contenido en la pestaña activa, por lo que podríamos tener múltiples instancias del script ejecutandose en una sola pestaña. Si esto sucede, necesitamos asegurarnos de que sea sólo la primera instancia la que vaya a realizar cambios.</p>
+
+<p>Luego, en la linea 40, donde el script de contenido atiende mensajes provenientes de la ventana emergente (usando la API <code><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API/runtime/onMessage">browser.runtime.onMessage</a></code>), vemos que ésta puede enviar dos mensajes diferentes: "beastify" y "reset".</p>
+
+<ul>
+ <li>si el mensaje es "beastify", esperamos que contenga la URL de la imagen. Removemos el contenido que ha sido agregado por el anterior llamado a "beastify", y luego construimos y  añadimos un elemento <code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img">&lt;img&gt;</a></code> cuyo atributo <code>src</code> contiene la URL de la imagen.</li>
+ <li>si el mensaje es "reset", simplemente removemos cualquier imagen que haya sido agregada antes.</li>
+</ul>
+
+<h3 id="Las_bestias">Las bestias</h3>
+
+<p>Finalmente, necesitamos incluir las imágenes de los animales.</p>
+
+<p>Crea una carpeta nueva llamada "beasts", y adiciona tres imágenes en ella, con su nombre apropiado. Tu puedes obtener estas imágenes desde el <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify/beasts">repositorio en GitHub</a>, o desde aquí:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11459/frog.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"><img alt="" src="https://mdn.mozillademos.org/files/11461/snake.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"><img alt="" src="https://mdn.mozillademos.org/files/11463/turtle.jpg" style="display: inline-block; height: 200px; margin: 20px; width: 200px;"></p>
+
+<h2 id="Probándolo">Probándolo</h2>
+
+<p>Primero, comprueba nuevamente que tienes todos los archivos necesarios en el lugar adecuado:</p>
+
+<pre class="line-numbers  language-html"><code class="language-html">beastify/
+
+    beasts/
+        frog.jpg
+        snake.jpg
+        turtle.jpg
+
+    content_scripts/
+        beastify.js
+
+    icons/
+        beasts-32.png
+        beasts-48.png
+
+    popup/
+        choose_beast.css
+        choose_beast.html
+        choose_beast.js
+
+    manifest.json</code></pre>
+
+<p>Comenzando con Firefox 45, pueden instalar temporalmente una extensión desde el disco.</p>
+
+<p>Abre "about:debugging" en Firefox, de clic en "Cargar complemento temporalmente", y seleccione el archivo manifest.json. Entonces, debería de ver el ícono de la extensión aparecer en la barra de herramientas de Firefox:</p>
+
+<p>{{EmbedYouTube("sAM78GU4P34")}}</p>
+
+<p>Abra una página web, luego haga clic sobre el ícono, seleccione una bestia, y vea cómo cambia la página web:</p>
+
+<p>{{EmbedYouTube("YMQXyAQSiE8")}}</p>
+
+<h2 id="Desarrollo_desde_la_línea_de_comandos">Desarrollo desde la línea de comandos</h2>
+
+<div id="gt-res-content">
+<div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr">
+<div id="tts_button"> </div>
+
+<p><span id="result_box" lang="es"><span>Puede automatizar el paso de instalación temporal mediante la herramienta <a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a>.</span> <span>Pruebe esto</span></span>:</p>
+</div>
+</div>
+
+<pre class="brush: bash line-numbers  language-bash"><code class="language-bash">cd beastify
+web-ext run</code></pre>
+
+<p> </p>
diff --git a/files/es/mozilla/developer_guide/build_instructions/index.html b/files/es/mozilla/developer_guide/build_instructions/index.html
new file mode 100644
index 0000000000..afb282fee8
--- /dev/null
+++ b/files/es/mozilla/developer_guide/build_instructions/index.html
@@ -0,0 +1,74 @@
+---
+title: Compilar e instalar
+slug: Mozilla/Developer_guide/Build_Instructions
+tags:
+  - Documentación_de_compilado
+translation_of: Mozilla/Developer_guide/Build_Instructions
+translation_of_original: Build_and_Install
+original_slug: Compilar_e_instalar
+---
+<p><span class="comment">NOTE: Do not make substantive changes to this document without consulting Benjamin Smedberg &lt;<a class="link-mailto" href="mailto:benjamin@smedbergs.us" rel="freelink">benjamin@smedbergs.us</a>&gt; or one of the build-config peers.</span></p>
+<div class="note">
+ <strong>NOTA</strong>: No comience a compilar sin antes <a href="/es/Configurar_las_opciones_de_compilaci%C3%B3n" title="es/Configurar_las_opciones_de_compilación">configurar las opciones de compilación</a>!</div>
+<h3 id="Compilando" name="Compilando">Compilando</h3>
+<p>Debes usar GNU make para verificar y compilar Mozilla, no se acepta otro programa "make". En Windows, Mac OS X, y GNU/Linux usa "make" para ejecutar GNU make; en la mayoría de los unix-no GNU debes usar "gmake".</p>
+<p>Una vez que verificaste el código, asegúrate de configurar la aplicación como se describe en las opciones de configuración.</p>
+<p>Para Windows, Mac OS X, y GNU/Linux, asegúrate de estar en el nivel superior del directorio fuente ("mozilla") cuando llames el comando <code>make</code>:</p>
+<pre class="eval">$ make -f client.mk build
+</pre>
+<p>Para la mayoría de los unix no-GNU:</p>
+<pre class="eval">$ gmake -f client.mk build
+</pre>
+<p>Si quieres configurar y compilar de forma manual, cd a tu objdir, ejecuta el programa de configuración, y luego ejecuta make/gmake. El programa de configuración tomará las opciones de tu archivo .mozconfig.</p>
+<h3 id="Ejecutando_tu_compilaci.C3.B3n_nueva" name="Ejecutando_tu_compilaci.C3.B3n_nueva">Ejecutando tu compilación nueva</h3>
+<p>Es posible ejecutar la compilación nueva directamente desde el directorio en donde fue creada. De todas formas, el directorio de compilación tal vez contenga symlinks dentro del árbol; debes ejecutar la instalación/packaging para generar una compilación que puede ser movida o compartida.</p>
+<h4 id="Windows_y_Linux" name="Windows_y_Linux">Windows y Linux</h4>
+<p>En sistemas no-macintosh, el producto final se puede hallar en <em>objdir</em>/dist/bin. En plataformas POSIX (BDS, GNU/LINUX, Solaris), debes ejecutar el archivo "mozilla" o "firefox", no el binario "mozilla-bin" o "firefox-bin".</p>
+<h4 id="Mac_OS_X" name="Mac_OS_X">Mac OS X</h4>
+<p>En Macintosh, el sistema de compilado genera una aplicación en <em>objdir</em>/dist/<em>AppName</em>.app por ejemplo, <em>objdir</em>/dist/Minefield.app.</p>
+<p>Fijate que cuando compilas con <code>--enable-debug</code>, la aplicación se ubica en <em>objdir</em>/dist/<em>AppName</em>Debug.app, por ejemplo <em>objdir</em>/dist/MinefieldDebug.app.</p>
+<p>Puedes ejecutar la aplicación, ya sea abriendo la aplicación via Finder o con la línea de comando:</p>
+<pre class="eval">$ objdir/dist/AppName[Debug].app/Contents/MacOS/appname
+</pre>
+<p>Para el ejemplo:</p>
+<pre class="eval">$ objdir/dist/MinefieldDebug.app/Contents/MacOS/firefox
+</pre>
+<h3 id="Instalando_tu_compilaci.C3.B3n" name="Instalando_tu_compilaci.C3.B3n">Instalando tu compilación</h3>
+<p>En plataformas POSIX, puedes instalar ejecutando <em>gmake install</em>. Pero es mejor que sigas los pasos siguientes para crear un tar, luego descomprime el tar.</p>
+<p>Para la mayoria de las aplicaciones, crea el tar dentro del directorio específico de la aplicación:</p>
+<ul>
+ <li>Firefox: <code>$ make -C objdir/browser/installer</code></li>
+ <li>Thunderbird: <code>$ make -C objdir/mail/installer</code></li>
+ <li>SeaMonkey: <code>$ make -C objdir/xpinstall/packager</code></li>
+</ul>
+<p><em>Ejemplo real:</em> Si usas un .mozconfig <a href="/es/Configurar_las_opciones_de_compilaci%C3%B3n#Firefox_est.C3.A1tico_optimizado" title="es/Configurar_las_opciones_de_compilación#Firefox_est.C3.A1tico_optimizado"> Firefox estático optimizado</a></p>
+<ul>
+ <li>Firefox: <code>$ make -C ff-opt-static/browser/installer</code></li>
+</ul>
+<p>Esto generará un archivo <code>firefox-2.0.0.3.en-US.linux-i686.tar.gz</code> dentro del directorio <code>ff-opt-static/dist</code>, el cual puedes descomprimir donde desees.</p>
+<p>Para hacer un instalador para Windows, crea el destino del instalador en el directorio superior</p>
+<ul>
+ <li>Firefox: <code>$ make -C objdir/browser/installer installer</code></li>
+ <li>Thunderbird: <code>$ make -C objdir/mail/installer installer</code></li>
+ <li>SeaMonkey: <code>$ make -C objdir/xpinstall/packager installer</code></li>
+</ul>
+<p><em>NOTA:</em> Para crear el instalador lo más comprimido posible, para Firefox y Thunderbird con el sistema basado en Cygwin, debes instalar algunos programas adicionales.</p>
+<ul>
+ <li><a class="external" href="http://www.7-zip.org/">7-zip</a></li>
+ <li><a class="external" href="http://upx.sourceforge.net/">UPX</a> (para usuarios de Windows el paquete está disponible en <a class="external" href="http://cygwin.com/">Cygwin</a> (Categoría utilitarios). No usen la versión DOS, no funcionará)</li>
+</ul>
+<p>Ambos programas se deben encontrar en el PATH. También MOZ_INSTALLER_USE_7ZIP debe ser exportado a tu entorno. Si usas el sistema MozillaBuild, ambos se instalarán automaticamente.</p>
+<p> </p>
+<div class="originaldocinfo">
+ <h2 id="Informaci.C3.B3n_del_documento" name="Informaci.C3.B3n_del_documento">Información del documento</h2>
+ <ul>
+  <li>Traductor: <a class="external" href="http://developer.mozilla.org/es/docs/Usuario_Discusi%C3%B3n:Blank_zero">Blank zero</a></li>
+  <li>Ultima modificación: 10-may-2007</li>
+  <li>Fuente: <a class="external" href="http://developer.mozilla.org/en/docs/index.php?title=Build_and_Install">Build and Install</a></li>
+ </ul>
+ <h3 id="Informaci.C3.B3n_sobre_el_documento_original" name="Informaci.C3.B3n_sobre_el_documento_original">Información sobre el documento original</h3>
+ <ul>
+  <li>Autor: Benjamin Smedberg</li>
+ </ul>
+</div>
+<p>{{ languages( { "en": "en/Build_and_Install", "fr": "fr/Compilation_et_installation", "ja": "ja/Build_and_Install", "zh-cn": "cn/\u7f16\u8bd1\u4e0e\u5b89\u88c5" } ) }}</p>
diff --git a/files/es/mozilla/developer_guide/mozilla_build_faq/index.html b/files/es/mozilla/developer_guide/mozilla_build_faq/index.html
new file mode 100644
index 0000000000..131d4c368f
--- /dev/null
+++ b/files/es/mozilla/developer_guide/mozilla_build_faq/index.html
@@ -0,0 +1,344 @@
+---
+title: Preguntas frecuentes sobre la compilación de Mozilla
+slug: Mozilla/Developer_guide/Mozilla_build_FAQ
+tags:
+  - Documentación_de_compilado
+  - NecesitaRevisiónGramatical
+translation_of: Mozilla/Developer_guide/Mozilla_build_FAQ
+original_slug: Mozilla/Developer_guide/Preguntas_frecuentes_sobre_la_compilación_de_Mozilla
+---
+<p>Mira también:</p>
+
+<ul>
+ <li><a href="/es/Debugging_Mozilla_on_Windows_FAQ" title="es/Debugging_Mozilla_on_Windows_FAQ">Debugging Mozilla on Windows FAQ</a>: Consejos para depurar Mozilla en Windows</li>
+</ul>
+
+<h3 id="Preguntas_Generales" name="Preguntas_Generales">Preguntas Generales</h3>
+
+<dl>
+ <dt id="platform">Que plataformas soportan Mozilla?</dt>
+ <dd>Hay varios niveles o grados de "soporte" para Mozilla:
+ <p>Grado-1 son las plataformas en las cuales se centra el desarrollo. Los problemas en estas plataformas son considerados primordiales. También son las plataformas que se muestran en <a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=SeaMonkey">SeaMonkey tinderbox page</a>.</p>
+
+ <p>Las Grado-1 son:</p>
+
+ <ul>
+  <li>linux/x86 (gcc)</li>
+  <li>win32/x86 (msvc)</li>
+  <li>OS X (gcc)</li>
+ </ul>
+
+ <p>Grado-2 son las plataformas en las que hay algunos desarrolladores y contribuyentes activos, pero que la mayor parte del desarrollo no se centra en los problemas. Nos referimos a estas plataformas como los Puertos y la mayoría se encuentran en <a class="external" href="http://tinderbox.mozilla.org/SeaMonkey-Ports/">SeaMonkey-Ports tinderbox page</a>.</p>
+
+ <p>Estas son:</p>
+
+ <ul>
+  <li>aix 4.3 (aCC)</li>
+  <li>beos 5.0.3 (gcc)</li>
+  <li>bsdi 4.x (gcc)</li>
+  <li>hpux 10.x,11.x (HP cc)</li>
+  <li>irix 6.x/gcc (gcc/MIPSpro)</li>
+  <li>linux/ppc (gcc)</li>
+  <li>os/2 (gcc)</li>
+  <li>osf1 5.x (Compaq cc)</li>
+  <li>solaris (sparc &amp; x86) 2.6+ (gcc/Forte)</li>
+ </ul>
+
+ <p>Grado-3 son aquellas en las que casi no hay desarrollo activo por la mayor parte de los desarrolladores pero que hay algunas soluciones contribuidas por terceros.</p>
+
+ <p>Las Grado-3 son:</p>
+
+ <ul>
+  <li>freebsd (gcc)</li>
+  <li>linux/alpha (gcc)</li>
+  <li>netbsd (gcc)</li>
+  <li>openvms (?)</li>
+  <li>ps2linux (gcc)</li>
+  <li>qnx 6 (gcc)</li>
+  <li>win32/x86 (gcc)</li>
+ </ul>
+
+ <p>Las demás plataformas "no son soportadas" por Mozilla. En realidad "no soportada" quiere decir que no hay gente trabajando activamente en eso y que no son una prioridad.</p>
+
+ <p>La mayoría de los desarrolladores no tienen acceso a las plataformas que no sean Grado-1; así que cualquier bug reportado en una plataforma que no sea Grado-1,debería poseer bastante información para ayudar al responsable del bug a determinar la causa y brindar una solución apropiada. Si puedes proporcionar un parche y/o verificar que el parche del desarrollador funciona en tu plataforma, puedes ayudar a muchos a verificar y arreglar sus bugs.</p>
+
+ <p> </p>
+ </dd>
+ <dt>Qué tipo de sistema de compilación usa Mozilla?</dt>
+ <dd>Mozilla usa para todas las plataformas una delgada capa de configuración GNU sobre el legado de sistema de makefile recursivo de Netscape. Como la mayoría de los proyectos configure-based, utiliza GNU autoconf para generar el script de configuración. GNU make se utiliza para manejar el proceso de compilado.
+ <p> </p>
+ </dd>
+ <dt>Por qué usa GNU?</dt>
+ <dd>GNU make ha sido exportado a muchos sistemas. Esto hace que exportar Mozilla a esos sistemas sea un poco más fácil. Utilizando las características de make, que son soportadas por el programa nativo make en 10 plataformas diferentes, se logra que el sistema de compilado no sea innecesariamente complicado.
+ <p> </p>
+ </dd>
+ <dt>Funciona otra versión de make?</dt>
+ <dd>No. El makefiles Mozilla utilza características propias de GNU make que, obviamente, sólo funcionan con GNU make.
+ <p> </p>
+ </dd>
+ <dt>Por qué no usa automake?</dt>
+ <dd>Parte del legado de Netscape involucra utilizar el make de GNU. Tiene características para incluir un conjunto de reglas comunes desde un puñado de archivos en cada Makefile que necesite usarlas. También, hoy en día el método de generación de librerías de Mozilla no funciona bien con libtool.
+ <p> </p>
+ </dd>
+ <dt>Qué les sucedió a nmake y al sistema de compilado CodeWarrior?</dt>
+ <dd>Ya no existen. El soporte para nmake se dejó durante la distribución de Mozilla 1.2a. El sistema mac cfm se abandonó con el soporte para OS9 poco después de la liberación de Mozilla 1.3
+ <p> </p>
+ </dd>
+ <dt>Por qué no ant, tmake, scons o <em>inserte su sistema favorito aquí</em>?</dt>
+ <dd>Principalmente porque nadie los utiliza en Mozilla. Cuando Mozilla empezó a ser de código abierto, sólo contenia el legado de Netscape. Autoconf se integró en una rama y se mantuvo en paralelo durante 6 meses antes de convertirse en el sistema standard para unix.
+ <p> </p>
+ </dd>
+ <dt>Si deseo utilizar mi sistema favorito,¿ lo empezarìan a usar en Mozilla?. No quiero perder mi tiempo si no lo van a usar.</dt>
+ <dd>No hay garantías de que cualquier código escrito para Mozilla sea aceptado en árbol por defecto. Todo sistema que se desee utilizar debe demostrar ser mejor que el sistema actual. Velocidad, flexibilidad, portabilidad y la capacidad de que un gran grupo de desarrolladores- que tiene 3 años o más de experiencia- pueda cambiarlo facilmente, son los principales factores que deciden el cambio. Si hablas en serio y vas a realizar mucho trabajo, contacta a <a href="/User:Benjamin_Smedberg" title="User:Benjamin_Smedberg">User:Benjamin Smedberg</a> para discutir los detalles.
+ <p> </p>
+ </dd>
+ <dt>Por qué Mozilla no soporta autoconf 2.5x?</dt>
+ <dd>Simplemente porque autoconf 2.5x no ofrece nada para que los esfuerzos por actualizar valgan la pena. Autoconf 2.5x no es compatible con 2.13 y las restricciones adicionales hechas en las nuevas versiones de autoconf requirirían reescribir gran parte del código- sistema de compilado de Mozilla.
+ <p>Algunas características de 2.13, como la posibilidad de pasar argumentos adicionales para sub-configuración, no están disponibles en 2.5x. Varios han preguntado por estas características en las listas de correos de autoconf y no han obtenido respuestas favorables. No es conveniente reescribir las configuraciones para subprojectos de Mozilla (NSPR &amp; LDPA).</p>
+
+ <p> </p>
+ </dd>
+ <dt>Por qué NSS no usa aurtoconf?</dt>
+ <dd>El projecto NSS también es utilizado fuera de Mozilla, y los miembros del mismo creen que cambiar a autoconf no vale la pena. Mira {{ Bug(52990) }} para más detalles.
+ <p> </p>
+ </dd>
+ <dt>Puedo compilar múltiples proyectos basados en Mozilla desde un único árbol-fuente?</dt>
+ <dd>Sí!, cada projecto debe ser compilado en su propio objdir.
+ <p> </p>
+ </dd>
+ <dt>Qué es un objdir?</dt>
+ <dd>Un objdir se refiere a crear los archivos de salida en un directorio distinto al que se encuentran las fuentes. Es un estándar en la mayoría de los proyectos basados en configuración. Te permite, desde un único árbol-fuente, compilar para múltiples configuraciones, incluyendo varias plataformas si trabajas en un sistema de archivos de red. También elimina la corrupción de tu árbol-fuente, de esta manera sabes que los archivos en el árbol no han sido modificados en el proceso de compilado.
+ <p>Si ejecutas configure manualmente, puedes usar el método estàndar de crear un directorio vacío en cualquier parte de la unidad, y luego entrar a ese directorio y ejecutar path/to/mozilla/configure.</p>
+
+ <pre class="eval">mkdir obj-debug
+cd obj-debug
+../mozilla/configure
+</pre>
+
+ <p>Si usas client.mk, puedes agregar lo siguiente al .mozconfig:</p>
+
+ <pre class="eval">mk_add_options MOZ_OBJDIR=/path/to/objdir
+</pre>
+
+ <p> </p>
+ </dd>
+ <dt>Puedo multi-compilar Mozilla?</dt>
+ <dd>Sí, mira el documento <a class="external" href="http://www.mozilla.org/build/cross-compiling.html">Cross-Compiling Mozilla</a>. No soporta <a class="external" href="http://www.vmlinux.org/joachim/mirror/www.objsw.com/CrossGCC/FAQ-4.html#ss4.9">Canadian Cross-Compiling</a>.
+ <p> </p>
+ </dd>
+ <dt>Cómo puedo compilar sólo ciertos archivos para pruebas, en lugar de compilar todo el árbol, mientras modifico el código?</dt>
+ <dd>Entra en el directorio objdir, luego vè al directorio especifico que deseas compilar (la estructura del objdir coincide con la estructura de los directorios de las fuentes), y tipea "make". Sólo funciona si encuentras un directorio que tenga un Makefile (el equivalente en el árbol fuente tandrá "Makefile.in". Si quieres algo más especifico que eso puedes probar con "make &lt;nombrearchivo&gt;.obj". Mira <a href="/es/Incremental_Build" title="es/Incremental_Build">Incremental Build</a>.
+ <p> </p>
+ </dd>
+ <dt>Funcionan las compilaciones paralelas (make -j) en Mozilla?</dt>
+ <dd>Sí, mira <a class="external" href="http://www.gnu.org/software/make/manual/html_node/Parallel.html">GNU Make Parallel Execution</a> para su uso óptimo.
+ <p>Si obtienes errores de compilación al utilizar aquello (sobre todo cuando usas -j en lugar de -jN), prueba reduciendo el número de paralelismo disminuyendo el valor de N (o, si usaste paralelismo ilimitado, agrega un número pequeño N a -j)</p>
+
+ <p>La compilación en paralelo con -j4 y -j8 parece funcionar.</p>
+
+ <p> </p>
+ </dd>
+ <dt>Cómo fuerzo al sistema de compilación para aceptar cualquier cambio hecho a mi archivo .mozconfig?</dt>
+ <dd>Toca cualquiera de los scripts de configuración en el árbol. No hay dependencia sobre el archivo mozconfig; el archivo puede encontrarse donde sea a tráves de la variable de entorno MOZCONFIG.
+ <p> </p>
+ </dd>
+ <dt>error: file '../../toolkit/locales/en-US/chrome/necko/contents.rdf' doesn't exist at ../../config/make-jars.pl line 418, &lt;STDIN&gt; line 9.</dt>
+ <dd>Estás tratando de compilar Firefox sin seguir las intrucciones sobre cómo <a href="/es/Configurar_las_opciones_de_compilaci%C3%B3n" title="es/Configurar_las_opciones_de_compilación">Configurar las opciones de compilación</a>. En particular, tu mozconfig <strong>debe</strong> contener el mozconfig por defecto de Firefox:
+ <pre class="eval">. $topsrcdir/browser/config/mozconfig
+# add your custom additional options here
+</pre>
+
+ <p> </p>
+ </dd>
+ <dt>Initial cvs checkout fails with the message: <code>cvs {{ mediawiki.external('checkout aborted') }}: *PANIC* administration files missing</code></dt>
+ <dd>No puedes crear un árbol CVS debajo de un directorio llamado "CVS". Es una característica/bug de CVS. CVS espera encontrar cierta administración de archivos debajo del directorio CVS y no funciona si no la encuentra.
+ <p> </p>
+ </dd>
+ <dt>Error: ../coreconf/rules.mk:406: target `c' doesn't match the target pattern</dt>
+ <dd>Necesitas make 3.80 y no otras versiones como 3.81
+ <ul>
+  <li>make 3.80 ya no está disponible en el instlador de Cygwin, así que lo deberás encontrar por ti mismo. Puedes buscarlo en google como make-3.80-1.tar.bz2, también está disponble<a class="external" href="http://cygwin.paracoda.com/release/make/make-3.80-1.tar.bz2">aquí</a>.</li>
+ </ul>
+
+ <p> </p>
+ </dd>
+</dl>
+
+<h3 id="Preguntas_espec.C3.ADficas_sobre_Mac" name="Preguntas_espec.C3.ADficas_sobre_Mac">Preguntas específicas sobre Mac</h3>
+
+<p> </p>
+
+<dl>
+ <dt>Puede compilar una aplicación Mozilla como un binario universal?</dt>
+ <dd>Sí, mira <a href="/es/Mac_OS_X_Universal_Binaries" title="es/Mac_OS_X_Universal_Binaries">Mac OS X Universal Binaries</a>.
+ <p> </p>
+ </dd>
+ <dt>Cómo puedo usar distcc para ayudar a compilar?</dt>
+ <dd>TBA.
+ <p> </p>
+ </dd>
+ <dt>Mozilla compila UFS?</dt>
+ <dd>Sí, ha sido arreglado desde {{ Bug(157036) }}.
+ <p> </p>
+ </dd>
+ <dt>Mozilla corre sobre UFS?</dt>
+ <dd>Sí.
+ <p> </p>
+ </dd>
+ <dt>Puedo usar CodeWarrior para compilar Mach-O?</dt>
+ <dd>No, CodeWarrior murió. Mira {{ Bug(119589) }}.
+ <p> </p>
+ </dd>
+ <dt>Luego de re-compilar, ej. layout. Cómo hago que mi FirefoxDebug.app refleje el cambio?</dt>
+ <dd>make -C browser/app.</dd>
+</dl>
+
+<p>Para errores comunes en Mac y consejos adicionales sobre solución de problemas. Mira <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Mac_OS_X#Soluci.C3.B3n_de_problemas" title="es/Requerimientos_para_la_compilación_en_Mac_OS_X#Soluci.C3.B3n_de_problemas">solución de problemas</a> en <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Mac_OS_X" title="es/Requerimientos_para_la_compilación_en_Mac_OS_X">Requerimientos para la compilación en Mac OS X</a>.</p>
+
+<h3 id="Preguntas_sobre_Win32" name="Preguntas_sobre_Win32">Preguntas sobre Win32</h3>
+
+<p> </p>
+
+<dl>
+ <dt>Existe un archivo de proyecto Microsoft Visual Studio para compilar Mozilla?</dt>
+ <dd>No. Debes usar cygwin y GNU make.
+ <p> </p>
+ </dd>
+ <dt>Puedo correr los comandos para compilar desde cmd.exe?</dt>
+ <dd>Sí. Make llama la subshell cygwin /bin/sh para ejecutar el comando, así que no hay problema sobre cual shell uses para llamar a make.
+ <p> </p>
+ </dd>
+ <dt>Qué versión del paquete de autoconf de cygwin debo usar?</dt>
+ <dd>Debido a las incompatibilidades entre autonconf 2.1x y 2.5x, la gente de cygwin escribió un script (wrapper) que determinará qué versión necesitará tu script de configuración y llamará a esa versión. Necesitarás los paquetes autoconf(-wrapper) y autoconf estable. Mira <a class="external" href="http://cygwin.com/ml/cygwin-announce/2001/msg00177.html" rel="freelink">http://cygwin.com/ml/cygwin-announce.../msg00177.html</a> para más detalles
+ <p> </p>
+ </dd>
+ <dt>Las herramientas de Microsoft (CL, LINK, RC) tiran error <em>File not found</em></dt>
+ <dd>Las variables de entorno INCLUDE y LIB son usadas por las herramientas de Microsoft Visual C++. Comúnmente están configuradas en vcvars32.bat. Tal vez necesites o no MFC y ATL, dependiendo de qué modulos estés compilando. Debajo hay paths que funcionan si Visual C++ está instalado en "C:\msvs"
+ <pre class="eval">set INCLUDE=C:\msvs\VC\Include;C:\msvs\VC\ATLMFC\Include
+set LIB=C:\msvs\VC\Lib;C:\msvs\VC98\ATLMFC\Lib
+</pre>
+
+ <p> </p>
+ </dd>
+ <dt>cvs update: authorization failed: server XXXX rejected access -- used empty password; try "cvs login" with a real password</dt>
+ <dd>Estás mezclando wincvs y cygwin cvs. Usa uno o el otro.
+ <p> </p>
+ </dd>
+ <dt>cvs {{ mediawiki.external('checkout aborted') }}: cannot rename file CVS/Entries.Backup to CVS/Entries: Permission denied</dt>
+ <dd>En cygwin 1.3.13, ntsec está activada. ntsec es un intento de cygwin por obtener una estructura de permiso mas similar a UNIX sobre características de seguridad que Windows NT. El mensaje de error indica que hay una discrepancia de mapeo entre los permisos de unix listados en el archivo de cygwin /etc/password y los usados por Windows NT. Puedes agregar "nontsec" a tu variable de entorno CYGWIN. Para arreglarlo de forma adecuada deberías solucionar el problema de mapeo.
+ <p> </p>
+ </dd>
+ <dt>Al descomprimir, no se encuentra un archivo .dtd</dt>
+ <dd>Probablemente usaste Winzip para descomprimir los archivos. No hagas eso. Por defecto, Winzip no extrae los archivos sin longitud (0 bytes). Usa otro utilitario.
+ <p> </p>
+ </dd>
+ <dt>nsinstall u otro programa nativo win32 no encuentra un archivo</dt>
+ <dd>Revisa tu tabla de subida. Ejecuta el comando de montura, deberia devovler algo como esto:
+ <pre class="eval">c: on /cygdrive/c type user (binmode,noumount)
+e: on /cygdrive/e type user (binmode,noumount)
+c:\cygwin on / type system (binmode)
+c:\cygwin\bin on /usr/bin type system (binmode)
+c:\cygwin\lib on /usr/lib type system (binmode)
+</pre>
+
+ <p>El sistema de compilado espera que las particiones del disco hayan sido montadas usando /cygdrive como prefijo de la unidad. Si C: o E: no usan /cygwin como prefijo de unidad no podrás compilar Mozilla en esas unidades. Debes montar la unidad manualmente usando:</p>
+
+ <pre class="eval">mount -s "e:\" /cygdrive/e
+</pre>
+
+ <p>Si tu árbol fuente está debajo de tu $HOME, el modo de montura debería ser binmode (finales de líneas estilo Unix), de otro modo fallará al compilar. Si el árbol está fuera de tu $HOME, no importa el modo de montura siempre y cuando tu editor reconozca finales de linea estilo Unix.</p>
+ </dd>
+ <dt>No such file or directory errors from lines in your mozconfig</dt>
+ <dd>This can be caused by your mozconfig file having Windows-style line endings. Convert them to UNIX-style and the error should go away.</dd>
+ <dt>xpidl.exe cae con una violación de acceso</dt>
+ <dd>Usualmente ocurre por una discordancia entre tu compilador y tus librerías glib y/o libIDL.
+ <p>Si compilas con Visual Studio .NET, debes enlazar con las version de VC7 de las DLL glib y libIDL. Para Visual Studio .NET 2003, usa las versiones VC7.1. Para Visual Studio 2005, usa VC8.</p>
+
+ <p>El directorio que contenga esas versiones de librerías para tu compilador debe estar en tu PATH antes que cualquier otra versión de las mismas librerías. Los archivos .dll y lib deben ser ejecutable o cygwin no los cargará.</p>
+
+ <p>Mira los <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Windows/Compiladores_Microsoft_gratuitos" title="es/Requerimientos_para_la_compilación_en_Windows/Compiladores_Microsoft_gratuitos">Requerimientos para la compilación en Windows</a> sobre más consejos para compilar con VC7 o superior.</p>
+
+ <p>También en {{ Bug(242870) }} se encuentran disponibles algunas librerías estáticas que pueden ser usadas en lugar de las librerías específicas del compilador.</p>
+
+ <p>Si compilas con VC6, debes asegurarte que no estás usando las librerías de VC7 a la hora de compilar o ejecutar.</p>
+ </dd>
+ <dt>configure: error: the midl major version, , does not match the compiler suite version, &lt;Visual C++ nro de versión&gt; -- lo mismo para el linker</dt>
+ <dd>TLa herramienta cygwin "link.exe" para enlazar no reconoce el objeto enlazador de la suite del compilador Microsoft, o no se encuentra midl. Asegúrate que las herramientas de Microsoft se encuentran antes que cygwin en el PATH (Mira <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Windows#Configurar_el_entorno" title="es/Requerimientos_para_la_compilación_en_Windows#Configurar_el_entorno">las intrucciones</a>), o renombra o quita el archivo /bin/link.exe. Nota que cygwin tal vez modifique el path cuando arranque su shell, asi que también mira <code>export</code>.</dd>
+ <dt>configure: error: installation or configuration problem: C compiler cannot create executables.</dt>
+ <dd>Prueba asegurándote que la variable PATH incluya todos los directorios necesarios. Si usas MS Visual Studio, ejecuta vcvars32.bat (que configura las variables PATH, LIB, y INCLUDE). Si tu entorno ha cambiado, tal vez debas eliminar el archivo config.cache (en el directorio mozilla o directorio objeto) y luego volver a compilar.</dd>
+ <dt>build error: ../coreconf/rules.mk:365: target `c' doesn't match the target pattern</dt>
+ <dd>Has usado make 3.81 del instalador cygwin. Debes usar make 3.80. Por favor lee <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Windows#make" title="es/Requerimientos_para_la_compilación_en_Windows#make">las instrucciones</a>.</dd>
+ <dt>fatal error LNK1112: module machine type 'IA64' conflicts with target machine type 'X86'</dt>
+ <dd>Prueba cambiando el orden de los directorios en las variables PATH, LIB e INCLUDE. Cambia cualquier directorio que incluya cerca del final: "win64" o "IA64" (o "AMD64").</dd>
+ <dt>LINK : fatal error LNK1104: cannot open file 'atlthunk.lib'</dt>
+ <dd>De acuerdo con <a class="external" href="http://forums.microsoft.com/msdn/ShowPost.aspx?PostID=64509">this Microsoft forum thread</a>, hay una versión diferente de Active Template Library (ATL) para  Platform Software Development Kit -libre- (PSDK),  que para Visual Studio. La ATL en el PSDK no soporta código 32-bits, sólo 64-bits; mientras que Visual Studio soporta ambas y no requiere atlthunk.lib. Aparentemente el archivo atlthunk.lib no está disponible y no se pudo compilar desde <a href="/es/Windows_Build_Prerequisites/Free_Microsoft_Compilers" title="es/Windows_Build_Prerequisites/Free_Microsoft_Compilers">freely available tools</a>, incluyendo las herramientas Visual C++ y Visual Studio Express. De todos modos puedes actualizar a la versión full de Visual Studio y utilizar la versión de ATL del mismo, o puedes trabajar en el problema cambiando algunos códigos en atlbase.h (en \include\atl debajo del directorio PSDK). Ejemplo:
+ <pre class="eval">--- atlbase.h.old       2006-06-08 08:20:26.671875000 -0400
++++ atlbase.h   2006-06-08 08:13:26.578125000 -0400
+@@ -283,7 +283,7 @@
+         }
+ };
+ #pragma pack(pop)
+-
++/*
+ PVOID __stdcall __AllocStdCallThunk(VOID);
+ VOID  __stdcall __FreeStdCallThunk(PVOID);
+
+@@ -291,6 +291,11 @@
+ #define FreeStdCallThunk(p) __FreeStdCallThunk(p)
+
+ #pragma comment(lib, "atlthunk.lib")
++*/
++
++// workaround for not having atlthunk.lib in PSDK or VC++ 2005 Express Edition
++#define AllocStdCallThunk() HeapAlloc(GetProcessHeap(),0,sizeof(_stdcallthunk))
++#define FreeStdCallThunk(p) HeapFree(GetProcessHeap(), 0, p)
+
+ #elif defined (_M_AMD64)
+ #pragma pack(push,2)
+</pre>
+
+ <p>También hubo que borrar el directorio objeto y volver a compilar desde el principio, de modo que el compilador tome el cambio.</p>
+ </dd>
+ <dt>Compilar o generar un ejecutable con cygwin y VS6.0 termina en FIND: Parameter format not correct</dt>
+ <dd>Hay una confusión entre System32 "find" y /usr/bin/find de cygwin. Lo que queremos es el find de cygwin. Es causado por el orden del path. Algunas posibles soluciones serían:
+ <ul>
+  <li>Renombrar temporalmente system32/find.exe</li>
+  <li>Asegurarse que en la entrada del path esté primero cygwin que system32</li>
+ </ul>
+ </dd>
+ <dt>Empaqueté Firefox a través del instalador:<code> make -C ${OBJ_DIR}/browser/installer installer</code> sin problemas. Al ejecutar pide el archivo perdido mozz.dll; la instalación falla.</dt>
+ <dd>Tanto Firefox como Thunderbird,deberían compilarse con las etiquetas --enable-static --disable-shared</dd>
+ <dt>shlibsign.exe - Entry Point Not Found; El procedimiento CERT_GetFirstEmailAddress no ha sido localizado en la librería nss3.dll.</dt>
+ <dd>Tal vez tengas muchos nss3.dll en tu máquina y en tu path. Haz una búsqueda para todas las copias de este archivo. Mueve todas las copias que se encuentren dentro del árbol de Firefox durante la compilación y vuelve a colocarlos cuando se termine la compilación.</dd>
+</dl>
+
+<h3 id="Preguntas_sobre_Mingw32" name="Preguntas_sobre_Mingw32">Preguntas sobre Mingw32</h3>
+
+<ul>
+ <li>Si la compilación o la configuración fallan debido a que se perdió w32api, agrega el directorio /include de mingw32 al final de la variable de entorno INCLUDE. Las librerías o binarios mingw32 no deberían ser necesarios, sólo los headers.</li>
+</ul>
+
+<h3 id="Preguntas_sobre_Unix" name="Preguntas_sobre_Unix">Preguntas sobre Unix</h3>
+
+<dl>
+ <dt>Galeon necesita libgtksuperwin.so pero no tengo ese archivo en mi Mozilla gtk2, dónde está?</dt>
+ <dd>Sólo Mozilla gtk1 compila libgtksuperwin.so. Si deseas usar galeon con compilación gtk2, debes usar galeon2.
+ <p> </p>
+ </dd>
+ <dt>Por qué la configuración dice que necesito libIDL &gt;= 0.6.3 cuando tengo instalado libIDL 0.8.x?</dt>
+ <dd>libIdl 0.8.x sólo puede ser usado compilando con gtk2. Por defecto, Mozilla compila con gtk1. Para usar libIDl 0.8.x y gtk2 debes especificar --enable-default-toolkit=gtk2 en la línea de comando de laconfiguración o  .mozconfig. NOTA: Esto es viejo y ha sido arreglado en Mozilla 1.8</dd>
+ <dt>Cómo compilo en Solaris 10 x86 (SeaMonkey)?</dt>
+ <dd>Tuve que hacer lo siguiente para conseguir un entorno que funcione:</dd>
+ <dd>1. instalar forte (Gratis desde Sun)</dd>
+ <dd>2. Instalar gmake (desde blastwave)</dd>
+ <dd>3. mv /usr/ucb/cc /usr/ucb/cc.hold</dd>
+ <dd>4. CFLAGS="-xlibmil"; exporta CFLAGS</dd>
+ <dd>5. CXXFLAGS="-xlibmil -xlibmopt -features=tmplife -norunpath"; exporta CXXFLAGS</dd>
+ <dd>6. LDFLAGS='-R$ORIGIN -R/usr/sfw/lib -R/opt/sfw/lib -R/usr/local/lib -R/opt/csw/lib'; exporta LDFLAGS</dd>
+ <dd>7. PATH=$PATH:/opt/SUNWspro/bin:/opt/csw/bin:/opt/csw/sbin:/usr/ucb/bin:/usr/ccs/bin; exporta PATH</dd>
+ <dd>8. LD_LIBRARY_PATH=/opt/SUNWspro/lib:$LD_LIBRARY_PATH; exporta LD_LIBRARY_PATH</dd>
+ <dd>9. Crear un archivo mozconfig y compilar normalmente.</dd>
+ <dd>10. La generación del paquete (tar y gzip) falló, así que simplemente lo cree manualmente con los archivos resultantes en el directorio dist.</dd>
+ <dt>libxpcom_core.so: cannot restore segment prot after reloc: Permission denied&lt;/dt&gt;</dt>
+ <dd>Probablemente estés usando Fedora Core 5, o alguna otra distribución de Linux que tiene activado SELinux. Para arreglarlo, utiliza el comando 'chcon -t chcon -t texrel_shlib_t lib*' en el directorio dist/bin.&lt;/dd&gt;</dd>
+</dl>
diff --git a/files/es/mozilla/developer_guide/preguntas_frecuentes_sobre_la_compilación_de_mozilla/index.html b/files/es/mozilla/developer_guide/preguntas_frecuentes_sobre_la_compilación_de_mozilla/index.html
deleted file mode 100644
index 6e0c380577..0000000000
--- a/files/es/mozilla/developer_guide/preguntas_frecuentes_sobre_la_compilación_de_mozilla/index.html
+++ /dev/null
@@ -1,343 +0,0 @@
----
-title: Preguntas frecuentes sobre la compilación de Mozilla
-slug: Mozilla/Developer_guide/Preguntas_frecuentes_sobre_la_compilación_de_Mozilla
-tags:
-  - Documentación_de_compilado
-  - NecesitaRevisiónGramatical
-translation_of: Mozilla/Developer_guide/Mozilla_build_FAQ
----
-<p>Mira también:</p>
-
-<ul>
- <li><a href="/es/Debugging_Mozilla_on_Windows_FAQ" title="es/Debugging_Mozilla_on_Windows_FAQ">Debugging Mozilla on Windows FAQ</a>: Consejos para depurar Mozilla en Windows</li>
-</ul>
-
-<h3 id="Preguntas_Generales" name="Preguntas_Generales">Preguntas Generales</h3>
-
-<dl>
- <dt id="platform">Que plataformas soportan Mozilla?</dt>
- <dd>Hay varios niveles o grados de "soporte" para Mozilla:
- <p>Grado-1 son las plataformas en las cuales se centra el desarrollo. Los problemas en estas plataformas son considerados primordiales. También son las plataformas que se muestran en <a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi?tree=SeaMonkey">SeaMonkey tinderbox page</a>.</p>
-
- <p>Las Grado-1 son:</p>
-
- <ul>
-  <li>linux/x86 (gcc)</li>
-  <li>win32/x86 (msvc)</li>
-  <li>OS X (gcc)</li>
- </ul>
-
- <p>Grado-2 son las plataformas en las que hay algunos desarrolladores y contribuyentes activos, pero que la mayor parte del desarrollo no se centra en los problemas. Nos referimos a estas plataformas como los Puertos y la mayoría se encuentran en <a class="external" href="http://tinderbox.mozilla.org/SeaMonkey-Ports/">SeaMonkey-Ports tinderbox page</a>.</p>
-
- <p>Estas son:</p>
-
- <ul>
-  <li>aix 4.3 (aCC)</li>
-  <li>beos 5.0.3 (gcc)</li>
-  <li>bsdi 4.x (gcc)</li>
-  <li>hpux 10.x,11.x (HP cc)</li>
-  <li>irix 6.x/gcc (gcc/MIPSpro)</li>
-  <li>linux/ppc (gcc)</li>
-  <li>os/2 (gcc)</li>
-  <li>osf1 5.x (Compaq cc)</li>
-  <li>solaris (sparc &amp; x86) 2.6+ (gcc/Forte)</li>
- </ul>
-
- <p>Grado-3 son aquellas en las que casi no hay desarrollo activo por la mayor parte de los desarrolladores pero que hay algunas soluciones contribuidas por terceros.</p>
-
- <p>Las Grado-3 son:</p>
-
- <ul>
-  <li>freebsd (gcc)</li>
-  <li>linux/alpha (gcc)</li>
-  <li>netbsd (gcc)</li>
-  <li>openvms (?)</li>
-  <li>ps2linux (gcc)</li>
-  <li>qnx 6 (gcc)</li>
-  <li>win32/x86 (gcc)</li>
- </ul>
-
- <p>Las demás plataformas "no son soportadas" por Mozilla. En realidad "no soportada" quiere decir que no hay gente trabajando activamente en eso y que no son una prioridad.</p>
-
- <p>La mayoría de los desarrolladores no tienen acceso a las plataformas que no sean Grado-1; así que cualquier bug reportado en una plataforma que no sea Grado-1,debería poseer bastante información para ayudar al responsable del bug a determinar la causa y brindar una solución apropiada. Si puedes proporcionar un parche y/o verificar que el parche del desarrollador funciona en tu plataforma, puedes ayudar a muchos a verificar y arreglar sus bugs.</p>
-
- <p> </p>
- </dd>
- <dt>Qué tipo de sistema de compilación usa Mozilla?</dt>
- <dd>Mozilla usa para todas las plataformas una delgada capa de configuración GNU sobre el legado de sistema de makefile recursivo de Netscape. Como la mayoría de los proyectos configure-based, utiliza GNU autoconf para generar el script de configuración. GNU make se utiliza para manejar el proceso de compilado.
- <p> </p>
- </dd>
- <dt>Por qué usa GNU?</dt>
- <dd>GNU make ha sido exportado a muchos sistemas. Esto hace que exportar Mozilla a esos sistemas sea un poco más fácil. Utilizando las características de make, que son soportadas por el programa nativo make en 10 plataformas diferentes, se logra que el sistema de compilado no sea innecesariamente complicado.
- <p> </p>
- </dd>
- <dt>Funciona otra versión de make?</dt>
- <dd>No. El makefiles Mozilla utilza características propias de GNU make que, obviamente, sólo funcionan con GNU make.
- <p> </p>
- </dd>
- <dt>Por qué no usa automake?</dt>
- <dd>Parte del legado de Netscape involucra utilizar el make de GNU. Tiene características para incluir un conjunto de reglas comunes desde un puñado de archivos en cada Makefile que necesite usarlas. También, hoy en día el método de generación de librerías de Mozilla no funciona bien con libtool.
- <p> </p>
- </dd>
- <dt>Qué les sucedió a nmake y al sistema de compilado CodeWarrior?</dt>
- <dd>Ya no existen. El soporte para nmake se dejó durante la distribución de Mozilla 1.2a. El sistema mac cfm se abandonó con el soporte para OS9 poco después de la liberación de Mozilla 1.3
- <p> </p>
- </dd>
- <dt>Por qué no ant, tmake, scons o <em>inserte su sistema favorito aquí</em>?</dt>
- <dd>Principalmente porque nadie los utiliza en Mozilla. Cuando Mozilla empezó a ser de código abierto, sólo contenia el legado de Netscape. Autoconf se integró en una rama y se mantuvo en paralelo durante 6 meses antes de convertirse en el sistema standard para unix.
- <p> </p>
- </dd>
- <dt>Si deseo utilizar mi sistema favorito,¿ lo empezarìan a usar en Mozilla?. No quiero perder mi tiempo si no lo van a usar.</dt>
- <dd>No hay garantías de que cualquier código escrito para Mozilla sea aceptado en árbol por defecto. Todo sistema que se desee utilizar debe demostrar ser mejor que el sistema actual. Velocidad, flexibilidad, portabilidad y la capacidad de que un gran grupo de desarrolladores- que tiene 3 años o más de experiencia- pueda cambiarlo facilmente, son los principales factores que deciden el cambio. Si hablas en serio y vas a realizar mucho trabajo, contacta a <a href="/User:Benjamin_Smedberg" title="User:Benjamin_Smedberg">User:Benjamin Smedberg</a> para discutir los detalles.
- <p> </p>
- </dd>
- <dt>Por qué Mozilla no soporta autoconf 2.5x?</dt>
- <dd>Simplemente porque autoconf 2.5x no ofrece nada para que los esfuerzos por actualizar valgan la pena. Autoconf 2.5x no es compatible con 2.13 y las restricciones adicionales hechas en las nuevas versiones de autoconf requirirían reescribir gran parte del código- sistema de compilado de Mozilla.
- <p>Algunas características de 2.13, como la posibilidad de pasar argumentos adicionales para sub-configuración, no están disponibles en 2.5x. Varios han preguntado por estas características en las listas de correos de autoconf y no han obtenido respuestas favorables. No es conveniente reescribir las configuraciones para subprojectos de Mozilla (NSPR &amp; LDPA).</p>
-
- <p> </p>
- </dd>
- <dt>Por qué NSS no usa aurtoconf?</dt>
- <dd>El projecto NSS también es utilizado fuera de Mozilla, y los miembros del mismo creen que cambiar a autoconf no vale la pena. Mira {{ Bug(52990) }} para más detalles.
- <p> </p>
- </dd>
- <dt>Puedo compilar múltiples proyectos basados en Mozilla desde un único árbol-fuente?</dt>
- <dd>Sí!, cada projecto debe ser compilado en su propio objdir.
- <p> </p>
- </dd>
- <dt>Qué es un objdir?</dt>
- <dd>Un objdir se refiere a crear los archivos de salida en un directorio distinto al que se encuentran las fuentes. Es un estándar en la mayoría de los proyectos basados en configuración. Te permite, desde un único árbol-fuente, compilar para múltiples configuraciones, incluyendo varias plataformas si trabajas en un sistema de archivos de red. También elimina la corrupción de tu árbol-fuente, de esta manera sabes que los archivos en el árbol no han sido modificados en el proceso de compilado.
- <p>Si ejecutas configure manualmente, puedes usar el método estàndar de crear un directorio vacío en cualquier parte de la unidad, y luego entrar a ese directorio y ejecutar path/to/mozilla/configure.</p>
-
- <pre class="eval">mkdir obj-debug
-cd obj-debug
-../mozilla/configure
-</pre>
-
- <p>Si usas client.mk, puedes agregar lo siguiente al .mozconfig:</p>
-
- <pre class="eval">mk_add_options MOZ_OBJDIR=/path/to/objdir
-</pre>
-
- <p> </p>
- </dd>
- <dt>Puedo multi-compilar Mozilla?</dt>
- <dd>Sí, mira el documento <a class="external" href="http://www.mozilla.org/build/cross-compiling.html">Cross-Compiling Mozilla</a>. No soporta <a class="external" href="http://www.vmlinux.org/joachim/mirror/www.objsw.com/CrossGCC/FAQ-4.html#ss4.9">Canadian Cross-Compiling</a>.
- <p> </p>
- </dd>
- <dt>Cómo puedo compilar sólo ciertos archivos para pruebas, en lugar de compilar todo el árbol, mientras modifico el código?</dt>
- <dd>Entra en el directorio objdir, luego vè al directorio especifico que deseas compilar (la estructura del objdir coincide con la estructura de los directorios de las fuentes), y tipea "make". Sólo funciona si encuentras un directorio que tenga un Makefile (el equivalente en el árbol fuente tandrá "Makefile.in". Si quieres algo más especifico que eso puedes probar con "make &lt;nombrearchivo&gt;.obj". Mira <a href="/es/Incremental_Build" title="es/Incremental_Build">Incremental Build</a>.
- <p> </p>
- </dd>
- <dt>Funcionan las compilaciones paralelas (make -j) en Mozilla?</dt>
- <dd>Sí, mira <a class="external" href="http://www.gnu.org/software/make/manual/html_node/Parallel.html">GNU Make Parallel Execution</a> para su uso óptimo.
- <p>Si obtienes errores de compilación al utilizar aquello (sobre todo cuando usas -j en lugar de -jN), prueba reduciendo el número de paralelismo disminuyendo el valor de N (o, si usaste paralelismo ilimitado, agrega un número pequeño N a -j)</p>
-
- <p>La compilación en paralelo con -j4 y -j8 parece funcionar.</p>
-
- <p> </p>
- </dd>
- <dt>Cómo fuerzo al sistema de compilación para aceptar cualquier cambio hecho a mi archivo .mozconfig?</dt>
- <dd>Toca cualquiera de los scripts de configuración en el árbol. No hay dependencia sobre el archivo mozconfig; el archivo puede encontrarse donde sea a tráves de la variable de entorno MOZCONFIG.
- <p> </p>
- </dd>
- <dt>error: file '../../toolkit/locales/en-US/chrome/necko/contents.rdf' doesn't exist at ../../config/make-jars.pl line 418, &lt;STDIN&gt; line 9.</dt>
- <dd>Estás tratando de compilar Firefox sin seguir las intrucciones sobre cómo <a href="/es/Configurar_las_opciones_de_compilaci%C3%B3n" title="es/Configurar_las_opciones_de_compilación">Configurar las opciones de compilación</a>. En particular, tu mozconfig <strong>debe</strong> contener el mozconfig por defecto de Firefox:
- <pre class="eval">. $topsrcdir/browser/config/mozconfig
-# add your custom additional options here
-</pre>
-
- <p> </p>
- </dd>
- <dt>Initial cvs checkout fails with the message: <code>cvs {{ mediawiki.external('checkout aborted') }}: *PANIC* administration files missing</code></dt>
- <dd>No puedes crear un árbol CVS debajo de un directorio llamado "CVS". Es una característica/bug de CVS. CVS espera encontrar cierta administración de archivos debajo del directorio CVS y no funciona si no la encuentra.
- <p> </p>
- </dd>
- <dt>Error: ../coreconf/rules.mk:406: target `c' doesn't match the target pattern</dt>
- <dd>Necesitas make 3.80 y no otras versiones como 3.81
- <ul>
-  <li>make 3.80 ya no está disponible en el instlador de Cygwin, así que lo deberás encontrar por ti mismo. Puedes buscarlo en google como make-3.80-1.tar.bz2, también está disponble<a class="external" href="http://cygwin.paracoda.com/release/make/make-3.80-1.tar.bz2">aquí</a>.</li>
- </ul>
-
- <p> </p>
- </dd>
-</dl>
-
-<h3 id="Preguntas_espec.C3.ADficas_sobre_Mac" name="Preguntas_espec.C3.ADficas_sobre_Mac">Preguntas específicas sobre Mac</h3>
-
-<p> </p>
-
-<dl>
- <dt>Puede compilar una aplicación Mozilla como un binario universal?</dt>
- <dd>Sí, mira <a href="/es/Mac_OS_X_Universal_Binaries" title="es/Mac_OS_X_Universal_Binaries">Mac OS X Universal Binaries</a>.
- <p> </p>
- </dd>
- <dt>Cómo puedo usar distcc para ayudar a compilar?</dt>
- <dd>TBA.
- <p> </p>
- </dd>
- <dt>Mozilla compila UFS?</dt>
- <dd>Sí, ha sido arreglado desde {{ Bug(157036) }}.
- <p> </p>
- </dd>
- <dt>Mozilla corre sobre UFS?</dt>
- <dd>Sí.
- <p> </p>
- </dd>
- <dt>Puedo usar CodeWarrior para compilar Mach-O?</dt>
- <dd>No, CodeWarrior murió. Mira {{ Bug(119589) }}.
- <p> </p>
- </dd>
- <dt>Luego de re-compilar, ej. layout. Cómo hago que mi FirefoxDebug.app refleje el cambio?</dt>
- <dd>make -C browser/app.</dd>
-</dl>
-
-<p>Para errores comunes en Mac y consejos adicionales sobre solución de problemas. Mira <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Mac_OS_X#Soluci.C3.B3n_de_problemas" title="es/Requerimientos_para_la_compilación_en_Mac_OS_X#Soluci.C3.B3n_de_problemas">solución de problemas</a> en <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Mac_OS_X" title="es/Requerimientos_para_la_compilación_en_Mac_OS_X">Requerimientos para la compilación en Mac OS X</a>.</p>
-
-<h3 id="Preguntas_sobre_Win32" name="Preguntas_sobre_Win32">Preguntas sobre Win32</h3>
-
-<p> </p>
-
-<dl>
- <dt>Existe un archivo de proyecto Microsoft Visual Studio para compilar Mozilla?</dt>
- <dd>No. Debes usar cygwin y GNU make.
- <p> </p>
- </dd>
- <dt>Puedo correr los comandos para compilar desde cmd.exe?</dt>
- <dd>Sí. Make llama la subshell cygwin /bin/sh para ejecutar el comando, así que no hay problema sobre cual shell uses para llamar a make.
- <p> </p>
- </dd>
- <dt>Qué versión del paquete de autoconf de cygwin debo usar?</dt>
- <dd>Debido a las incompatibilidades entre autonconf 2.1x y 2.5x, la gente de cygwin escribió un script (wrapper) que determinará qué versión necesitará tu script de configuración y llamará a esa versión. Necesitarás los paquetes autoconf(-wrapper) y autoconf estable. Mira <a class="external" href="http://cygwin.com/ml/cygwin-announce/2001/msg00177.html" rel="freelink">http://cygwin.com/ml/cygwin-announce.../msg00177.html</a> para más detalles
- <p> </p>
- </dd>
- <dt>Las herramientas de Microsoft (CL, LINK, RC) tiran error <em>File not found</em></dt>
- <dd>Las variables de entorno INCLUDE y LIB son usadas por las herramientas de Microsoft Visual C++. Comúnmente están configuradas en vcvars32.bat. Tal vez necesites o no MFC y ATL, dependiendo de qué modulos estés compilando. Debajo hay paths que funcionan si Visual C++ está instalado en "C:\msvs"
- <pre class="eval">set INCLUDE=C:\msvs\VC\Include;C:\msvs\VC\ATLMFC\Include
-set LIB=C:\msvs\VC\Lib;C:\msvs\VC98\ATLMFC\Lib
-</pre>
-
- <p> </p>
- </dd>
- <dt>cvs update: authorization failed: server XXXX rejected access -- used empty password; try "cvs login" with a real password</dt>
- <dd>Estás mezclando wincvs y cygwin cvs. Usa uno o el otro.
- <p> </p>
- </dd>
- <dt>cvs {{ mediawiki.external('checkout aborted') }}: cannot rename file CVS/Entries.Backup to CVS/Entries: Permission denied</dt>
- <dd>En cygwin 1.3.13, ntsec está activada. ntsec es un intento de cygwin por obtener una estructura de permiso mas similar a UNIX sobre características de seguridad que Windows NT. El mensaje de error indica que hay una discrepancia de mapeo entre los permisos de unix listados en el archivo de cygwin /etc/password y los usados por Windows NT. Puedes agregar "nontsec" a tu variable de entorno CYGWIN. Para arreglarlo de forma adecuada deberías solucionar el problema de mapeo.
- <p> </p>
- </dd>
- <dt>Al descomprimir, no se encuentra un archivo .dtd</dt>
- <dd>Probablemente usaste Winzip para descomprimir los archivos. No hagas eso. Por defecto, Winzip no extrae los archivos sin longitud (0 bytes). Usa otro utilitario.
- <p> </p>
- </dd>
- <dt>nsinstall u otro programa nativo win32 no encuentra un archivo</dt>
- <dd>Revisa tu tabla de subida. Ejecuta el comando de montura, deberia devovler algo como esto:
- <pre class="eval">c: on /cygdrive/c type user (binmode,noumount)
-e: on /cygdrive/e type user (binmode,noumount)
-c:\cygwin on / type system (binmode)
-c:\cygwin\bin on /usr/bin type system (binmode)
-c:\cygwin\lib on /usr/lib type system (binmode)
-</pre>
-
- <p>El sistema de compilado espera que las particiones del disco hayan sido montadas usando /cygdrive como prefijo de la unidad. Si C: o E: no usan /cygwin como prefijo de unidad no podrás compilar Mozilla en esas unidades. Debes montar la unidad manualmente usando:</p>
-
- <pre class="eval">mount -s "e:\" /cygdrive/e
-</pre>
-
- <p>Si tu árbol fuente está debajo de tu $HOME, el modo de montura debería ser binmode (finales de líneas estilo Unix), de otro modo fallará al compilar. Si el árbol está fuera de tu $HOME, no importa el modo de montura siempre y cuando tu editor reconozca finales de linea estilo Unix.</p>
- </dd>
- <dt>No such file or directory errors from lines in your mozconfig</dt>
- <dd>This can be caused by your mozconfig file having Windows-style line endings. Convert them to UNIX-style and the error should go away.</dd>
- <dt>xpidl.exe cae con una violación de acceso</dt>
- <dd>Usualmente ocurre por una discordancia entre tu compilador y tus librerías glib y/o libIDL.
- <p>Si compilas con Visual Studio .NET, debes enlazar con las version de VC7 de las DLL glib y libIDL. Para Visual Studio .NET 2003, usa las versiones VC7.1. Para Visual Studio 2005, usa VC8.</p>
-
- <p>El directorio que contenga esas versiones de librerías para tu compilador debe estar en tu PATH antes que cualquier otra versión de las mismas librerías. Los archivos .dll y lib deben ser ejecutable o cygwin no los cargará.</p>
-
- <p>Mira los <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Windows/Compiladores_Microsoft_gratuitos" title="es/Requerimientos_para_la_compilación_en_Windows/Compiladores_Microsoft_gratuitos">Requerimientos para la compilación en Windows</a> sobre más consejos para compilar con VC7 o superior.</p>
-
- <p>También en {{ Bug(242870) }} se encuentran disponibles algunas librerías estáticas que pueden ser usadas en lugar de las librerías específicas del compilador.</p>
-
- <p>Si compilas con VC6, debes asegurarte que no estás usando las librerías de VC7 a la hora de compilar o ejecutar.</p>
- </dd>
- <dt>configure: error: the midl major version, , does not match the compiler suite version, &lt;Visual C++ nro de versión&gt; -- lo mismo para el linker</dt>
- <dd>TLa herramienta cygwin "link.exe" para enlazar no reconoce el objeto enlazador de la suite del compilador Microsoft, o no se encuentra midl. Asegúrate que las herramientas de Microsoft se encuentran antes que cygwin en el PATH (Mira <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Windows#Configurar_el_entorno" title="es/Requerimientos_para_la_compilación_en_Windows#Configurar_el_entorno">las intrucciones</a>), o renombra o quita el archivo /bin/link.exe. Nota que cygwin tal vez modifique el path cuando arranque su shell, asi que también mira <code>export</code>.</dd>
- <dt>configure: error: installation or configuration problem: C compiler cannot create executables.</dt>
- <dd>Prueba asegurándote que la variable PATH incluya todos los directorios necesarios. Si usas MS Visual Studio, ejecuta vcvars32.bat (que configura las variables PATH, LIB, y INCLUDE). Si tu entorno ha cambiado, tal vez debas eliminar el archivo config.cache (en el directorio mozilla o directorio objeto) y luego volver a compilar.</dd>
- <dt>build error: ../coreconf/rules.mk:365: target `c' doesn't match the target pattern</dt>
- <dd>Has usado make 3.81 del instalador cygwin. Debes usar make 3.80. Por favor lee <a href="/es/Requerimientos_para_la_compilaci%C3%B3n_en_Windows#make" title="es/Requerimientos_para_la_compilación_en_Windows#make">las instrucciones</a>.</dd>
- <dt>fatal error LNK1112: module machine type 'IA64' conflicts with target machine type 'X86'</dt>
- <dd>Prueba cambiando el orden de los directorios en las variables PATH, LIB e INCLUDE. Cambia cualquier directorio que incluya cerca del final: "win64" o "IA64" (o "AMD64").</dd>
- <dt>LINK : fatal error LNK1104: cannot open file 'atlthunk.lib'</dt>
- <dd>De acuerdo con <a class="external" href="http://forums.microsoft.com/msdn/ShowPost.aspx?PostID=64509">this Microsoft forum thread</a>, hay una versión diferente de Active Template Library (ATL) para  Platform Software Development Kit -libre- (PSDK),  que para Visual Studio. La ATL en el PSDK no soporta código 32-bits, sólo 64-bits; mientras que Visual Studio soporta ambas y no requiere atlthunk.lib. Aparentemente el archivo atlthunk.lib no está disponible y no se pudo compilar desde <a href="/es/Windows_Build_Prerequisites/Free_Microsoft_Compilers" title="es/Windows_Build_Prerequisites/Free_Microsoft_Compilers">freely available tools</a>, incluyendo las herramientas Visual C++ y Visual Studio Express. De todos modos puedes actualizar a la versión full de Visual Studio y utilizar la versión de ATL del mismo, o puedes trabajar en el problema cambiando algunos códigos en atlbase.h (en \include\atl debajo del directorio PSDK). Ejemplo:
- <pre class="eval">--- atlbase.h.old       2006-06-08 08:20:26.671875000 -0400
-+++ atlbase.h   2006-06-08 08:13:26.578125000 -0400
-@@ -283,7 +283,7 @@
-         }
- };
- #pragma pack(pop)
--
-+/*
- PVOID __stdcall __AllocStdCallThunk(VOID);
- VOID  __stdcall __FreeStdCallThunk(PVOID);
-
-@@ -291,6 +291,11 @@
- #define FreeStdCallThunk(p) __FreeStdCallThunk(p)
-
- #pragma comment(lib, "atlthunk.lib")
-+*/
-+
-+// workaround for not having atlthunk.lib in PSDK or VC++ 2005 Express Edition
-+#define AllocStdCallThunk() HeapAlloc(GetProcessHeap(),0,sizeof(_stdcallthunk))
-+#define FreeStdCallThunk(p) HeapFree(GetProcessHeap(), 0, p)
-
- #elif defined (_M_AMD64)
- #pragma pack(push,2)
-</pre>
-
- <p>También hubo que borrar el directorio objeto y volver a compilar desde el principio, de modo que el compilador tome el cambio.</p>
- </dd>
- <dt>Compilar o generar un ejecutable con cygwin y VS6.0 termina en FIND: Parameter format not correct</dt>
- <dd>Hay una confusión entre System32 "find" y /usr/bin/find de cygwin. Lo que queremos es el find de cygwin. Es causado por el orden del path. Algunas posibles soluciones serían:
- <ul>
-  <li>Renombrar temporalmente system32/find.exe</li>
-  <li>Asegurarse que en la entrada del path esté primero cygwin que system32</li>
- </ul>
- </dd>
- <dt>Empaqueté Firefox a través del instalador:<code> make -C ${OBJ_DIR}/browser/installer installer</code> sin problemas. Al ejecutar pide el archivo perdido mozz.dll; la instalación falla.</dt>
- <dd>Tanto Firefox como Thunderbird,deberían compilarse con las etiquetas --enable-static --disable-shared</dd>
- <dt>shlibsign.exe - Entry Point Not Found; El procedimiento CERT_GetFirstEmailAddress no ha sido localizado en la librería nss3.dll.</dt>
- <dd>Tal vez tengas muchos nss3.dll en tu máquina y en tu path. Haz una búsqueda para todas las copias de este archivo. Mueve todas las copias que se encuentren dentro del árbol de Firefox durante la compilación y vuelve a colocarlos cuando se termine la compilación.</dd>
-</dl>
-
-<h3 id="Preguntas_sobre_Mingw32" name="Preguntas_sobre_Mingw32">Preguntas sobre Mingw32</h3>
-
-<ul>
- <li>Si la compilación o la configuración fallan debido a que se perdió w32api, agrega el directorio /include de mingw32 al final de la variable de entorno INCLUDE. Las librerías o binarios mingw32 no deberían ser necesarios, sólo los headers.</li>
-</ul>
-
-<h3 id="Preguntas_sobre_Unix" name="Preguntas_sobre_Unix">Preguntas sobre Unix</h3>
-
-<dl>
- <dt>Galeon necesita libgtksuperwin.so pero no tengo ese archivo en mi Mozilla gtk2, dónde está?</dt>
- <dd>Sólo Mozilla gtk1 compila libgtksuperwin.so. Si deseas usar galeon con compilación gtk2, debes usar galeon2.
- <p> </p>
- </dd>
- <dt>Por qué la configuración dice que necesito libIDL &gt;= 0.6.3 cuando tengo instalado libIDL 0.8.x?</dt>
- <dd>libIdl 0.8.x sólo puede ser usado compilando con gtk2. Por defecto, Mozilla compila con gtk1. Para usar libIDl 0.8.x y gtk2 debes especificar --enable-default-toolkit=gtk2 en la línea de comando de laconfiguración o  .mozconfig. NOTA: Esto es viejo y ha sido arreglado en Mozilla 1.8</dd>
- <dt>Cómo compilo en Solaris 10 x86 (SeaMonkey)?</dt>
- <dd>Tuve que hacer lo siguiente para conseguir un entorno que funcione:</dd>
- <dd>1. instalar forte (Gratis desde Sun)</dd>
- <dd>2. Instalar gmake (desde blastwave)</dd>
- <dd>3. mv /usr/ucb/cc /usr/ucb/cc.hold</dd>
- <dd>4. CFLAGS="-xlibmil"; exporta CFLAGS</dd>
- <dd>5. CXXFLAGS="-xlibmil -xlibmopt -features=tmplife -norunpath"; exporta CXXFLAGS</dd>
- <dd>6. LDFLAGS='-R$ORIGIN -R/usr/sfw/lib -R/opt/sfw/lib -R/usr/local/lib -R/opt/csw/lib'; exporta LDFLAGS</dd>
- <dd>7. PATH=$PATH:/opt/SUNWspro/bin:/opt/csw/bin:/opt/csw/sbin:/usr/ucb/bin:/usr/ccs/bin; exporta PATH</dd>
- <dd>8. LD_LIBRARY_PATH=/opt/SUNWspro/lib:$LD_LIBRARY_PATH; exporta LD_LIBRARY_PATH</dd>
- <dd>9. Crear un archivo mozconfig y compilar normalmente.</dd>
- <dd>10. La generación del paquete (tar y gzip) falló, así que simplemente lo cree manualmente con los archivos resultantes en el directorio dist.</dd>
- <dt>libxpcom_core.so: cannot restore segment prot after reloc: Permission denied&lt;/dt&gt;</dt>
- <dd>Probablemente estés usando Fedora Core 5, o alguna otra distribución de Linux que tiene activado SELinux. Para arreglarlo, utiliza el comando 'chcon -t chcon -t texrel_shlib_t lib*' en el directorio dist/bin.&lt;/dd&gt;</dd>
-</dl>
diff --git a/files/es/mozilla/developer_guide/source_code/cvs/index.html b/files/es/mozilla/developer_guide/source_code/cvs/index.html
new file mode 100644
index 0000000000..06e73631d4
--- /dev/null
+++ b/files/es/mozilla/developer_guide/source_code/cvs/index.html
@@ -0,0 +1,150 @@
+---
+title: Código fuente de Mozilla (CVS)
+slug: Mozilla/Developer_guide/Source_Code/CVS
+tags:
+  - Documentación_de_compilado
+translation_of: Mozilla/Developer_guide/Source_Code/CVS
+original_slug: Mozilla/Developer_guide/Source_Code/Código_fuente_de_Mozilla_(CVS)
+---
+<p> </p>
+<p>Aquellos que desarrollan de forma muy activa pueden comprobar el último código fuente utilizando CVS. Si vas a realizar parches y arreglos este es el método más adecuado, porque te permite ver los últimos cambios y unirlos con los tuyos.</p>
+<p>Si quieres compilar el producto para su publicación, es mejor <a href="es/Descargar_el_c%c3%b3digo_fuente_de_Mozilla">Descargar el código fuente de Mozilla</a> en un archivo tar.</p>
+<h3 id="Gu.C3.ADa_r.C3.A1pida" name="Gu.C3.ADa_r.C3.A1pida">Guía rápida</h3>
+<p><span class="comment">I seem to not be editing this page in what others on this development site deem appropriate. So, if you are going to just remove this section, can you please be so kind as to suggest an alternate title of a new page that I can put this information on? Thanks, Jeff Carr</span></p>
+<p>Los pasos básicos para descargar la rama (inestable) del código fuente de Firefox son:</p>
+<pre class="eval">cvs -d <a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot co mozilla/client.mk
+cd mozilla
+make -f client.mk checkout MOZ_CO_PROJECT=browser
+</pre>
+<h3 id="Comenzando" name="Comenzando">Comenzando</h3>
+<p>CVS significa "Concurrent Versioning System". Para conocer más sobre CVS en general visita <a class="external" href="http://ximbiot.com/cvs/manual/">ximbiot.com</a>, o lee el <a class="external" href="http://ximbiot.com/cvs/cvshome/docs/blandy.html">tutorial</a>.</p>
+<p>Cualquiera puede descargar ("check out") el código fuente vía CVS, pero solo ciertas personas pueden subir cambios ("check in" o "commit"). Esas personas son los <a class="external" href="http://www.mozilla.org/owners.html">dueños de módulos</a> y sus delegados. Lee nuestro documento sobre <a class="external" href="http://www.mozilla.org/hacking/">mejorar mozilla</a> para saber como puedes tener la habilidad de enviar cambios. Quizá quieras leer tambien acerca de <a class="external" href="http://www.mozilla.org/cvs-ssh-faq.html">como usar SSH para conectar al CVS</a>.</p>
+<h4 id="Requisitos" name="Requisitos">Requisitos</h4>
+<p>Para descargar el código fuente, necesitas <a class="external" href="http://www.nongnu.org/cvs/">CVS</a> versión 1.11 o posterior. La versión 1.12.13 no funciona con el servidor CVS, y el resultado es que el programa se cuelga, sin embargo la versión 1.12.9 parece funcioanr. Además, debes usar <a class="external" href="http://www.gnu.org/software/make/">GNU make</a> para descargar y compilar Mozilla. No se acepta ningún otro programa "make". En windows, mac y sistemas GNU habituales (como GNU/Linux), usa "make" para ejecutar GNU make; en la mayoría de los sistemas UNIX no GNU (como por ejemplo Solaris), usa "gmake".</p>
+<h3 id="Configuraci.C3.B3n_de_cliente_CVS" name="Configuraci.C3.B3n_de_cliente_CVS">Configuración de cliente CVS</h3>
+<p>El "cvsroot" (cadena de identificación del repositorio) que se utiliza para acceder a CVS Mozilla de forma anónima es:</p>
+<pre class="eval"><a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot
+</pre>
+<p>Si usas una interface CVS gráfica, utiliza los siguientes datos del servidor:</p>
+<ul>
+ <li><b>host</b> (servidor): "cvs-mirror.mozilla.org"</li>
+ <li><b>repository path</b> (ruta del repositorio): "/cvsroot"</li>
+ <li><b>user</b> (usuario): "anonymous"</li>
+ <li><b>connection type</b> (tipo de conexión): pserver</li>
+ <li><b>port</b> (puerto): default (2401)</li>
+</ul>
+<h3 id="Elegir_un_proyecto_para_descargar" name="Elegir_un_proyecto_para_descargar">Elegir un proyecto para descargar</h3>
+<p>Ya que se usa el mismo código para compilar distintas aplicaciones debes elegir qué aplicación quieres descargar en la línea de comandos usando la variable <code>MOZ_CO_PROJECT</code>. esta información debe proporcionarse cuando se necesite para la descarga del código fuente actual (lee la <a href="#Checkout">sección</a> apropiada sobre la <a href="#Checkout_2">descarga</a> más abajo, dependiendo de la rama que quieras descargar). Las posibles opciones incluyen:</p>
+<dl>
+ <dt>
+  browser </dt>
+ <dd>
+  El navegador "Firefox".</dd>
+ <dt>
+  mail </dt>
+ <dd>
+  El cliente de correo/noticias "Thunderbird".</dd>
+ <dt>
+  suite </dt>
+ <dd>
+  La suite traditional "Mozilla" SeaMonkey con navegador, correo/noticias, editor web, y otras aplicaciones.</dd>
+ <dt>
+  minimo </dt>
+ <dd>
+  El navegador para pequeños dispositivos.</dd>
+ <dt>
+  composer </dt>
+ <dd>
+  El editor HTML.</dd>
+ <dt>
+  calendar </dt>
+ <dd>
+  La aplicación de calendario "Sunbird".</dd>
+ <dt>
+  xulrunner </dt>
+ <dd>
+  El interprete de nueva generación para aplicaciones XUL.</dd>
+ <dt>
+  camino </dt>
+ <dd>
+  El navegador nativos para Macintosh, "Camino".</dd>
+ <dt>
+  tamarin </dt>
+ <dd>
+  La máquina virtual Adobe Ecmascript.</dd>
+ <dt>
+  all </dt>
+ <dd>
+  Descarga todos los códigos fuente de todos los proyectos de arriba, además de código útil adicional</dd>
+</dl>
+<p>Se pueden especificar varios proyectos con comas: <code>MOZ_CO_PROJECT=suite,browser,xulrunner</code>.</p>
+<p><b>Ten en cuenta</b> que si estas usando un archivo &lt;tt&gt;<a href="es/Configurar_las_opciones_de_compilaci%c3%b3n#Usando_un_archivo_de_configuraci.C3.B3n_.mozconfig">.mozconfig</a>&lt;/tt&gt; personalizado, debes especificar también el <code>MOZ_CO_PROJECT</code> allí, en vez de hacerlo en la línea de comandos.</p>
+<h3 id="Descargar_el_c.C3.B3digo_de_una_rama_nueva" name="Descargar_el_c.C3.B3digo_de_una_rama_nueva">Descargar el código de una rama nueva</h3>
+<h4 id="Comprueba_el_Tinderbox" name="Comprueba_el_Tinderbox">Comprueba el Tinderbox</h4>
+<p>Antes de descargar una rama, debes comprobar siempre el <a href="es/Tinderbox">Tinderbox</a> apropiado para asegurarte que el código base no esta roto. Si hay tinderboxes en rojo, normalmente es recomendable esperar hasta que estén en verde antes de descargar una rama.</p>
+<h4 id="Rama_HEAD" name="Rama_HEAD">Rama HEAD</h4>
+<p>Para descargar una rama nuevo desde cero, toma el archivo <code>client.mk</code> que es el que contiene las instruciones que se usarán para descargar el resto de la rama:</p>
+<pre class="eval">$ cvs -d <a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot co mozilla/client.mk
+</pre>
+<p>Nota: Si ya tienes un archivo <a href="es/Configurar_las_opciones_de_compilaci%c3%b3n#Usando_un_archivo_de_configuraci.C3.B3n_.mozconfig">.mozconfig</a>, quizá necesites descargar los siguientes archivos:</p>
+<dl>
+ <dt>
+  Firefox </dt>
+ <dd>
+  <pre>cvs -d :pserver:anonymous@cvs-mirror.mozilla.org:/cvsroot co mozilla/browser/config/mozconfig</pre>
+ </dd>
+ <dt>
+  Thunderbird </dt>
+ <dd>
+  <pre>cvs -d :pserver:anonymous@cvs-mirror.mozilla.org:/cvsroot co mozilla/mail/config/mozconfig</pre>
+ </dd>
+</dl>
+<h4 id="Rama_espec.C3.ADfica" name="Rama_espec.C3.ADfica">Rama específica</h4>
+<p>Si quieres descargar el código de alguna <a class="external" href="http://ximbiot.com/cvs/wiki/index.php?title=CVS--Concurrent_Versions_System_v1.12.12.1:_Branching_and_merging">rama CVS</a> específica, usa:</p>
+<pre class="eval">$ cvs -d <a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot co -r RAMA mozilla/client.mk
+</pre>
+<p>Por ejemplo, para descargar la rama en desarrollo de Firefox 2.0, reemplaza RAMA por MOZILLA_1_8_BRANCH. Para ver las ramas disponibles en Mozilla, mira las <a href="es/Etiquetas_CVS">Etiquetas CVS</a>.</p>
+<p>Para información sobre como descargar los archivos <code>.mozconfig</code> de un proyecto específico, lee la <a href="#_Rama_HEAD">sección anterior</a> (Por supuesto aplicable a otras ramas diferentes de HEAD también).</p>
+<h4 id="Descargar" name="Descargar">Descargar</h4>
+<p>Después de elegir la rama correspondiente, ejecuta:</p>
+<pre class="eval">$ cd mozilla
+$ make -f client.mk checkout MOZ_CO_PROJECT=<i>opción,opción</i>
+</pre>
+<p>Cómo se mencionó arriba, si ya tienes especificado la rama en un archivo .mozconfig personalizado, no necesitas hacerlo en la línea de comando.</p>
+<div class="note">
+ Utiliza siempre <code>client.mk</code> para descargar las fuentes Mozilla: no descargues directamente el módulo <code>mozilla/</code>, se descargían varios subprojectos como NSS, NSPR y LDAP C SDK, pero el desarrollo habitual de mozilla se da en el tronco (trunk).</div>
+<h4 id="Fecha_espec.C3.ADfica" name="Fecha_espec.C3.ADfica">Fecha específica</h4>
+<p>Si quieres descargar el código de alguna fecha en particular utiliza la variable MOZ_CO_DATE. Por ejemplo &lt;tt&gt;MOZ_CO_DATE="20 Oct 2006 17:00 PDT"&lt;/tt&gt;</p>
+<p>También se puede agregar en el .mozconfig, o escribir en la línea de comandos:</p>
+<pre class="eval">$ cd mozilla
+$ make -f client.mk checkout MOZ_CO_DATE="20 Oct 2006 17:00 PDT" MOZ_CO_PROJECT=<i>option,option</i>
+</pre>
+<h3 id="Cambiar_el_.C3.A1rbol_de_c.C3.B3digo_a_una_rama_diferente" name="Cambiar_el_.C3.A1rbol_de_c.C3.B3digo_a_una_rama_diferente">Cambiar el árbol de código a una rama diferente</h3>
+<h4 id="Branch_HEAD" name="Branch_HEAD">Branch HEAD</h4>
+<p>Para actualizar el árbol de código (ya sea la rama HEAD o cualquier otra) a la última versión, primero ejecuta:</p>
+<pre class="eval">$ cd mozilla
+$ cvs up -A client.mk
+</pre>
+<p>La opción -a elimina cualquier información "pegada a la rama", actualizaría la rama HEAD.</p>
+<h4 id="Rama_espec.C3.ADfica_2" name="Rama_espec.C3.ADfica_2">Rama específica</h4>
+<p>Para actualizar el árbol de código de una rama especifica descargado con anterioridad usa:</p>
+<pre class="eval">$ cd mozilla
+$ cvs up -r RAMA client.mk
+</pre>
+<p>Reemplaza RAMA con la etiqueta de la rama que desees actualizar.</p>
+<h3 id="Actualizar_el_.C3.A1rbol_de_c.C3.B3digo" name="Actualizar_el_.C3.A1rbol_de_c.C3.B3digo">Actualizar el árbol de código</h3>
+<p>Para actualizar el árbol de código simplemente haz lo siguiente:</p>
+<pre class="eval">$ make -f client.mk checkout MOZ_CO_PROJECT=<i>opción,opción</i>
+</pre>
+<p>Igual que siempre, si tienes un .mozconfig personalizado con MOZ_CO_PROJECT definido, no necesitas repetirlo en la línea de comando.</p>
+<h3 id="Creando_un_archivo_Diff" name="Creando_un_archivo_Diff">Creando un archivo Diff</h3>
+<p>Para crear un diff de un archivo local para aplicar en el archivo actual en reposición, usa:</p>
+<pre class="eval">$ cvs diff -u8p NOMBREDEARCHIVO
+</pre>
+<p>Mira <a href="es/Crear_un_parche">Crear un parche</a> para más información.</p>
+<h3 id="Convertir_el_.C3.A1rbol_de_c.C3.B3digo_descargado" name="Convertir_el_.C3.A1rbol_de_c.C3.B3digo_descargado">Convertir el árbol de código descargado</h3>
+<p>Los árboles descargados desde mozilla.org (<a href="es/Descargar_el_c%c3%b3digo_fuente_de_Mozilla">tarballs con el código fuente</a>) ya poseen información CVS, cómo una descarga normal. Puedes actualizarlo como cualquier otro árbol al la última versión, sin ninguna acción en especial. Para ver cómo actualizar un árbol, mira la sección anterior</p>
+<p><span class="comment">interwiki link</span></p>
+<div class="noinclude">
+  </div>
+<p>{{ languages( { "en": "en/Mozilla_Source_Code_(CVS)", "fr": "fr/Obtenir_le_code_source_de_Mozilla_via_CVS", "ja": "ja/Mozilla_Source_Code_(CVS)", "zh-cn": "cn/\u901a\u8fc7CVS\u83b7\u53d6\u6e90\u7801" } ) }}</p>
diff --git a/files/es/mozilla/developer_guide/source_code/código_fuente_de_mozilla_(cvs)/index.html b/files/es/mozilla/developer_guide/source_code/código_fuente_de_mozilla_(cvs)/index.html
deleted file mode 100644
index 248231aee9..0000000000
--- a/files/es/mozilla/developer_guide/source_code/código_fuente_de_mozilla_(cvs)/index.html
+++ /dev/null
@@ -1,149 +0,0 @@
----
-title: Código fuente de Mozilla (CVS)
-slug: Mozilla/Developer_guide/Source_Code/Código_fuente_de_Mozilla_(CVS)
-tags:
-  - Documentación_de_compilado
-translation_of: Mozilla/Developer_guide/Source_Code/CVS
----
-<p> </p>
-<p>Aquellos que desarrollan de forma muy activa pueden comprobar el último código fuente utilizando CVS. Si vas a realizar parches y arreglos este es el método más adecuado, porque te permite ver los últimos cambios y unirlos con los tuyos.</p>
-<p>Si quieres compilar el producto para su publicación, es mejor <a href="es/Descargar_el_c%c3%b3digo_fuente_de_Mozilla">Descargar el código fuente de Mozilla</a> en un archivo tar.</p>
-<h3 id="Gu.C3.ADa_r.C3.A1pida" name="Gu.C3.ADa_r.C3.A1pida">Guía rápida</h3>
-<p><span class="comment">I seem to not be editing this page in what others on this development site deem appropriate. So, if you are going to just remove this section, can you please be so kind as to suggest an alternate title of a new page that I can put this information on? Thanks, Jeff Carr</span></p>
-<p>Los pasos básicos para descargar la rama (inestable) del código fuente de Firefox son:</p>
-<pre class="eval">cvs -d <a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot co mozilla/client.mk
-cd mozilla
-make -f client.mk checkout MOZ_CO_PROJECT=browser
-</pre>
-<h3 id="Comenzando" name="Comenzando">Comenzando</h3>
-<p>CVS significa "Concurrent Versioning System". Para conocer más sobre CVS en general visita <a class="external" href="http://ximbiot.com/cvs/manual/">ximbiot.com</a>, o lee el <a class="external" href="http://ximbiot.com/cvs/cvshome/docs/blandy.html">tutorial</a>.</p>
-<p>Cualquiera puede descargar ("check out") el código fuente vía CVS, pero solo ciertas personas pueden subir cambios ("check in" o "commit"). Esas personas son los <a class="external" href="http://www.mozilla.org/owners.html">dueños de módulos</a> y sus delegados. Lee nuestro documento sobre <a class="external" href="http://www.mozilla.org/hacking/">mejorar mozilla</a> para saber como puedes tener la habilidad de enviar cambios. Quizá quieras leer tambien acerca de <a class="external" href="http://www.mozilla.org/cvs-ssh-faq.html">como usar SSH para conectar al CVS</a>.</p>
-<h4 id="Requisitos" name="Requisitos">Requisitos</h4>
-<p>Para descargar el código fuente, necesitas <a class="external" href="http://www.nongnu.org/cvs/">CVS</a> versión 1.11 o posterior. La versión 1.12.13 no funciona con el servidor CVS, y el resultado es que el programa se cuelga, sin embargo la versión 1.12.9 parece funcioanr. Además, debes usar <a class="external" href="http://www.gnu.org/software/make/">GNU make</a> para descargar y compilar Mozilla. No se acepta ningún otro programa "make". En windows, mac y sistemas GNU habituales (como GNU/Linux), usa "make" para ejecutar GNU make; en la mayoría de los sistemas UNIX no GNU (como por ejemplo Solaris), usa "gmake".</p>
-<h3 id="Configuraci.C3.B3n_de_cliente_CVS" name="Configuraci.C3.B3n_de_cliente_CVS">Configuración de cliente CVS</h3>
-<p>El "cvsroot" (cadena de identificación del repositorio) que se utiliza para acceder a CVS Mozilla de forma anónima es:</p>
-<pre class="eval"><a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot
-</pre>
-<p>Si usas una interface CVS gráfica, utiliza los siguientes datos del servidor:</p>
-<ul>
- <li><b>host</b> (servidor): "cvs-mirror.mozilla.org"</li>
- <li><b>repository path</b> (ruta del repositorio): "/cvsroot"</li>
- <li><b>user</b> (usuario): "anonymous"</li>
- <li><b>connection type</b> (tipo de conexión): pserver</li>
- <li><b>port</b> (puerto): default (2401)</li>
-</ul>
-<h3 id="Elegir_un_proyecto_para_descargar" name="Elegir_un_proyecto_para_descargar">Elegir un proyecto para descargar</h3>
-<p>Ya que se usa el mismo código para compilar distintas aplicaciones debes elegir qué aplicación quieres descargar en la línea de comandos usando la variable <code>MOZ_CO_PROJECT</code>. esta información debe proporcionarse cuando se necesite para la descarga del código fuente actual (lee la <a href="#Checkout">sección</a> apropiada sobre la <a href="#Checkout_2">descarga</a> más abajo, dependiendo de la rama que quieras descargar). Las posibles opciones incluyen:</p>
-<dl>
- <dt>
-  browser </dt>
- <dd>
-  El navegador "Firefox".</dd>
- <dt>
-  mail </dt>
- <dd>
-  El cliente de correo/noticias "Thunderbird".</dd>
- <dt>
-  suite </dt>
- <dd>
-  La suite traditional "Mozilla" SeaMonkey con navegador, correo/noticias, editor web, y otras aplicaciones.</dd>
- <dt>
-  minimo </dt>
- <dd>
-  El navegador para pequeños dispositivos.</dd>
- <dt>
-  composer </dt>
- <dd>
-  El editor HTML.</dd>
- <dt>
-  calendar </dt>
- <dd>
-  La aplicación de calendario "Sunbird".</dd>
- <dt>
-  xulrunner </dt>
- <dd>
-  El interprete de nueva generación para aplicaciones XUL.</dd>
- <dt>
-  camino </dt>
- <dd>
-  El navegador nativos para Macintosh, "Camino".</dd>
- <dt>
-  tamarin </dt>
- <dd>
-  La máquina virtual Adobe Ecmascript.</dd>
- <dt>
-  all </dt>
- <dd>
-  Descarga todos los códigos fuente de todos los proyectos de arriba, además de código útil adicional</dd>
-</dl>
-<p>Se pueden especificar varios proyectos con comas: <code>MOZ_CO_PROJECT=suite,browser,xulrunner</code>.</p>
-<p><b>Ten en cuenta</b> que si estas usando un archivo &lt;tt&gt;<a href="es/Configurar_las_opciones_de_compilaci%c3%b3n#Usando_un_archivo_de_configuraci.C3.B3n_.mozconfig">.mozconfig</a>&lt;/tt&gt; personalizado, debes especificar también el <code>MOZ_CO_PROJECT</code> allí, en vez de hacerlo en la línea de comandos.</p>
-<h3 id="Descargar_el_c.C3.B3digo_de_una_rama_nueva" name="Descargar_el_c.C3.B3digo_de_una_rama_nueva">Descargar el código de una rama nueva</h3>
-<h4 id="Comprueba_el_Tinderbox" name="Comprueba_el_Tinderbox">Comprueba el Tinderbox</h4>
-<p>Antes de descargar una rama, debes comprobar siempre el <a href="es/Tinderbox">Tinderbox</a> apropiado para asegurarte que el código base no esta roto. Si hay tinderboxes en rojo, normalmente es recomendable esperar hasta que estén en verde antes de descargar una rama.</p>
-<h4 id="Rama_HEAD" name="Rama_HEAD">Rama HEAD</h4>
-<p>Para descargar una rama nuevo desde cero, toma el archivo <code>client.mk</code> que es el que contiene las instruciones que se usarán para descargar el resto de la rama:</p>
-<pre class="eval">$ cvs -d <a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot co mozilla/client.mk
-</pre>
-<p>Nota: Si ya tienes un archivo <a href="es/Configurar_las_opciones_de_compilaci%c3%b3n#Usando_un_archivo_de_configuraci.C3.B3n_.mozconfig">.mozconfig</a>, quizá necesites descargar los siguientes archivos:</p>
-<dl>
- <dt>
-  Firefox </dt>
- <dd>
-  <pre>cvs -d :pserver:anonymous@cvs-mirror.mozilla.org:/cvsroot co mozilla/browser/config/mozconfig</pre>
- </dd>
- <dt>
-  Thunderbird </dt>
- <dd>
-  <pre>cvs -d :pserver:anonymous@cvs-mirror.mozilla.org:/cvsroot co mozilla/mail/config/mozconfig</pre>
- </dd>
-</dl>
-<h4 id="Rama_espec.C3.ADfica" name="Rama_espec.C3.ADfica">Rama específica</h4>
-<p>Si quieres descargar el código de alguna <a class="external" href="http://ximbiot.com/cvs/wiki/index.php?title=CVS--Concurrent_Versions_System_v1.12.12.1:_Branching_and_merging">rama CVS</a> específica, usa:</p>
-<pre class="eval">$ cvs -d <a class="link-mailto" href="mailto::pserver:anonymous@cvs-mirror.mozilla.org" rel="freelink">:pserver:anonymous@cvs-mirror.mozilla.org</a>:/cvsroot co -r RAMA mozilla/client.mk
-</pre>
-<p>Por ejemplo, para descargar la rama en desarrollo de Firefox 2.0, reemplaza RAMA por MOZILLA_1_8_BRANCH. Para ver las ramas disponibles en Mozilla, mira las <a href="es/Etiquetas_CVS">Etiquetas CVS</a>.</p>
-<p>Para información sobre como descargar los archivos <code>.mozconfig</code> de un proyecto específico, lee la <a href="#_Rama_HEAD">sección anterior</a> (Por supuesto aplicable a otras ramas diferentes de HEAD también).</p>
-<h4 id="Descargar" name="Descargar">Descargar</h4>
-<p>Después de elegir la rama correspondiente, ejecuta:</p>
-<pre class="eval">$ cd mozilla
-$ make -f client.mk checkout MOZ_CO_PROJECT=<i>opción,opción</i>
-</pre>
-<p>Cómo se mencionó arriba, si ya tienes especificado la rama en un archivo .mozconfig personalizado, no necesitas hacerlo en la línea de comando.</p>
-<div class="note">
- Utiliza siempre <code>client.mk</code> para descargar las fuentes Mozilla: no descargues directamente el módulo <code>mozilla/</code>, se descargían varios subprojectos como NSS, NSPR y LDAP C SDK, pero el desarrollo habitual de mozilla se da en el tronco (trunk).</div>
-<h4 id="Fecha_espec.C3.ADfica" name="Fecha_espec.C3.ADfica">Fecha específica</h4>
-<p>Si quieres descargar el código de alguna fecha en particular utiliza la variable MOZ_CO_DATE. Por ejemplo &lt;tt&gt;MOZ_CO_DATE="20 Oct 2006 17:00 PDT"&lt;/tt&gt;</p>
-<p>También se puede agregar en el .mozconfig, o escribir en la línea de comandos:</p>
-<pre class="eval">$ cd mozilla
-$ make -f client.mk checkout MOZ_CO_DATE="20 Oct 2006 17:00 PDT" MOZ_CO_PROJECT=<i>option,option</i>
-</pre>
-<h3 id="Cambiar_el_.C3.A1rbol_de_c.C3.B3digo_a_una_rama_diferente" name="Cambiar_el_.C3.A1rbol_de_c.C3.B3digo_a_una_rama_diferente">Cambiar el árbol de código a una rama diferente</h3>
-<h4 id="Branch_HEAD" name="Branch_HEAD">Branch HEAD</h4>
-<p>Para actualizar el árbol de código (ya sea la rama HEAD o cualquier otra) a la última versión, primero ejecuta:</p>
-<pre class="eval">$ cd mozilla
-$ cvs up -A client.mk
-</pre>
-<p>La opción -a elimina cualquier información "pegada a la rama", actualizaría la rama HEAD.</p>
-<h4 id="Rama_espec.C3.ADfica_2" name="Rama_espec.C3.ADfica_2">Rama específica</h4>
-<p>Para actualizar el árbol de código de una rama especifica descargado con anterioridad usa:</p>
-<pre class="eval">$ cd mozilla
-$ cvs up -r RAMA client.mk
-</pre>
-<p>Reemplaza RAMA con la etiqueta de la rama que desees actualizar.</p>
-<h3 id="Actualizar_el_.C3.A1rbol_de_c.C3.B3digo" name="Actualizar_el_.C3.A1rbol_de_c.C3.B3digo">Actualizar el árbol de código</h3>
-<p>Para actualizar el árbol de código simplemente haz lo siguiente:</p>
-<pre class="eval">$ make -f client.mk checkout MOZ_CO_PROJECT=<i>opción,opción</i>
-</pre>
-<p>Igual que siempre, si tienes un .mozconfig personalizado con MOZ_CO_PROJECT definido, no necesitas repetirlo en la línea de comando.</p>
-<h3 id="Creando_un_archivo_Diff" name="Creando_un_archivo_Diff">Creando un archivo Diff</h3>
-<p>Para crear un diff de un archivo local para aplicar en el archivo actual en reposición, usa:</p>
-<pre class="eval">$ cvs diff -u8p NOMBREDEARCHIVO
-</pre>
-<p>Mira <a href="es/Crear_un_parche">Crear un parche</a> para más información.</p>
-<h3 id="Convertir_el_.C3.A1rbol_de_c.C3.B3digo_descargado" name="Convertir_el_.C3.A1rbol_de_c.C3.B3digo_descargado">Convertir el árbol de código descargado</h3>
-<p>Los árboles descargados desde mozilla.org (<a href="es/Descargar_el_c%c3%b3digo_fuente_de_Mozilla">tarballs con el código fuente</a>) ya poseen información CVS, cómo una descarga normal. Puedes actualizarlo como cualquier otro árbol al la última versión, sin ninguna acción en especial. Para ver cómo actualizar un árbol, mira la sección anterior</p>
-<p><span class="comment">interwiki link</span></p>
-<div class="noinclude">
-  </div>
-<p>{{ languages( { "en": "en/Mozilla_Source_Code_(CVS)", "fr": "fr/Obtenir_le_code_source_de_Mozilla_via_CVS", "ja": "ja/Mozilla_Source_Code_(CVS)", "zh-cn": "cn/\u901a\u8fc7CVS\u83b7\u53d6\u6e90\u7801" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/1.5/index.html b/files/es/mozilla/firefox/releases/1.5/index.html
new file mode 100644
index 0000000000..c79ae70942
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/1.5/index.html
@@ -0,0 +1,165 @@
+---
+title: Firefox 1.5 para Desarrolladores
+slug: Mozilla/Firefox/Releases/1.5
+tags:
+  - CSS
+  - Complementos
+  - DOM
+  - Desarrollo_Web
+  - Estándares_Web
+  - HTML
+  - JavaScript
+  - RDF
+  - SVG
+  - Servicios_Web_XML
+  - Todas_las_Categorías
+  - XML
+  - XSLT
+  - XUL
+  - extensiones
+translation_of: Mozilla/Firefox/Releases/1.5
+original_slug: Firefox_1.5_para_Desarrolladores
+---
+<div>{{FirefoxSidebar}}</div><h3 id="Firefox_1.5" name="Firefox_1.5">Firefox 1.5</h3>
+
+<p>Se ha lanzado Firefox 1.5 y ya se puede descargar <strong><a class="external" href="http://www.mozilla.com/firefox/">descarga</a></strong>. Este programa esta basado en el motor de <a href="es/Gecko">Gecko</a> 1.8, esta nueva versión del navegador mejora su ya magnífico soporte a los estándares web y proporciona nuevas capacidades que hacen posible una nueva generación de aplicaciones web. Algunas de las nuevas características de Firefox 1.5 son: soporte de CSS2 y CSS3 mejorado, APIs para programar gráficos en 2D por medio de <code>&lt;canvas&gt;</code>, o gráficos vectoriales con <a href="es/SVG">SVG</a> 1.1, <a href="es/XForms">XForms</a> y eventos XML, así como muchas mejoras en DHTML, JavaScript y DOM.</p>
+
+<p><strong>Firefox 1.5</strong> ya puede descargarse en el siguiente link: - <a class="external" href="http://www.mozilla.com/firefox/" rel="freelink">http://www.mozilla.com/firefox/</a></p>
+
+<h3 id="Herramientas_para_desarrolladores" name="Herramientas_para_desarrolladores">Herramientas para desarrolladores</h3>
+
+<p>Firefox 1.5 dispone de diversas herramientas y extensiones de gran utilidad para los desarrolladores.</p>
+
+<ul>
+ <li><a href="es/DOM_Inspector">DOM Inspector</a>, una herramienta que permite a los desarrolladores inspeccionar y modificar documentos sin tener que editar el documento directamente. DOM Inspector está disponible como una opción en la Instalación personalizada de Firefox 1.5 bajo Herramientas para desarrolladores.</li>
+ <li>Consola JavaScript, una herramienta para escribir y testear código JavaScript a la vez que sirve para ver los errores JavaScript y de CSS en una página.</li>
+ <li>Ver código fuente de la página, con sombreado de código y opciones de búsqueda.</li>
+ <li><a class="link-https" href="https://addons.mozilla.org/extensions/showlist.php?application=firefox&amp;category=Developer%20Tools">Extensiones para el navegador</a> incluyendo <a href="es/Web_Developer_Firefox_Extension_(external)">Web Developer toolbar</a>, <a href="es/Live_HTTP_Headers_(external)">Live HTTP Headers</a>, <a href="es/HTML_Validator_(external)">HTML Validator</a> y muchas más.</li>
+</ul>
+
+<p><strong>Nota:</strong> Algunas extensiones no soportan actualmente Firefox 1.5, y serán automáticamente desactivadas.</p>
+
+<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
+
+<p>Algunas de las nuevas características en Firefox 1.5:</p>
+
+<h4 id="Desarrolladores_de_sitios_web_y_aplicaciones" name="Desarrolladores_de_sitios_web_y_aplicaciones">Desarrolladores de sitios web y aplicaciones</h4>
+
+<dl>
+ <dt><a href="es/SVG_en_HTML_Introducci%c3%b3n">Introducción a SVG en HTML </a></dt>
+ <dd>Aprenda cómo usar SVG en sus páginas XHTML y a manipular imágenes con JavaScript y CSS de forma similar a como haría un script para XHTML. Vea también <a href="es/SVG_en_Firefox_1.5">SVG en Firefox 1.5</a> para saber más sobre el estado y los problemas de la implementación de SVG en Firefox 1.5.</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/Dibujar_gr%c3%a1ficos_con_Canvas">Dibujar gráficos con Canvas</a> </dt>
+ <dd>Aprenda acerca de la nueva etiqueta <code>&lt;canvas&gt;</code> y cómo dibujar gráficos y otros objetos en Firefox.</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/Columnas_con_CSS-3">Columnas con CSS-3</a> </dt>
+ <dd>Aprenda sobre el soporte a la disposición automática de texto en multi-columnas según lo propuesto en CSS3.</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/El_cache_de_Firefox_1.5">El cache de Firefox 1.5</a> </dt>
+ <dd>Aprenda acerca de <code>bfcache</code> y cómo aumenta la velocidad de la navegación en páginas ya visitadas.</dd>
+</dl>
+
+<h4 id="XUL_y_Desarrolladores_de_Extensi.C3.B3n" name="XUL_y_Desarrolladores_de_Extensi.C3.B3n">XUL y Desarrolladores de Extensión</h4>
+
+<dl>
+ <dt><a href="es/Creando_una_extensi%c3%b3n">Creando una extensión</a> </dt>
+ <dd>Este tutorial te llevará a través de los pasos necesarios para construir una extensión para Firefox muy básica. Ver también <a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">otro tutorial en la base de conocimiento MozillaZine</a>, el cual demuestra las nuevas características del Administrador de Extensión en 1.5, que hace la creación de una nueva extensión incluso mas fácil.</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/XPCNativeWrapper">XPCNativeWrapper</a> </dt>
+ <dd><code>XPCNativeWrapper</code> es una forma de envolver un objeto cuyo <a href="es/Safely_accessing_content_DOM_from_chrome">acceso es seguro desde un código privilegiado</a>. Puede ser usado en todas las versiones de Firefox, a pesar que su funcionamiento ha cambiado con la versión 1.5 (Gecko 1.8).</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/Preferencias_del_Sistema">Preferencias del Sistema</a> </dt>
+ <dd>Aprenda acerca de los nuevos widgets, que te permiten crear ventanas de Opciones mas fácilmente y usando menos código JavaScript.</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/Caracteres_Internacionales_en_XUL_JavaScript">Caracteres Internacionales en XUL JavaScript</a> </dt>
+ <dd>Ahora los archivos XUL JavaScript pueden contener caracteres no-ASCII.</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/Cambios_en_el_API_tree">Cambios en el API tree</a> </dt>
+ <dd>Las interfaces para acceder a los elementos <code>&lt;tree&gt;</code> han cambiado.</dd>
+</dl>
+
+<dl>
+ <dt><a href="es/Cambios_en_XUL_en_Firefox_1.5">Cambios en XUL en Firefox 1.5</a> </dt>
+ <dd>Un resumen de los cambios en Xul. Vea también <a href="es/Adaptando_las_aplicaciones_XUL_a_Firefox_1.5">Adaptando las aplicaciones XUL a Firefox 1.5</a>.</dd>
+</dl>
+
+<dl>
+ <dt>Cambios referentes a la red </dt>
+ <dd> </dd>
+</dl>
+
+<ul>
+ <li>Certificate prompts can now be overridden on a per-channel basis. This works by setting an interface requestor as an <a href="es/NsIChannel">nsIChannel</a>'s notificationCallbacks and giving out an interface for <a href="es/NsIBadCertListener">nsIBadCertListener</a>.</li>
+ <li>nsIWebBrowserPersist's listeners can now implement <a href="es/NsIInterfaceRequestor">nsIInterfaceRequestor</a>::GetInterface and will get an opportunity to provide all interfaces that channels might ask for, including <a href="es/NsIProgressEventSink">nsIProgressEventSink</a> (not too useful, redundant with <a href="es/NsIWebProgressListener">nsIWebProgressListener</a>). Useful interfaces here include <a href="es/NsIChannelEventSink">nsIChannelEventSink</a> and <a href="es/NsIBadCertListener">nsIBadCertListener</a>.</li>
+ <li>Extensions or other necko consumers, including XMLHttpRequest, can set a Cookie header explicitly, and necko will not replace it. Stored cookies will be merged with the explicitly set header, in a way that the explicit header will override the stored cookies</li>
+</ul>
+
+<h3 id="Nuevas_caracter.C3.ADsticas_para_el_usuario_final" name="Nuevas_caracter.C3.ADsticas_para_el_usuario_final">Nuevas características para el usuario final</h3>
+
+<h4 id="Experiencia_de_usuario" name="Experiencia_de_usuario">Experiencia de usuario</h4>
+
+<ul>
+ <li><strong>Navegación más rápida</strong> con un rendimiento mejorado usando los botones de vuelta atrás y adelante.</li>
+ <li><strong>Reordenación de las pestañas del navegador al pulsar y soltar.</strong></li>
+ <li><strong>Answers.com ha sido añadida a la lista de buscadores</strong> para permitir búsquedas en su diccionario.</li>
+ <li><strong>Mejoras en la usabilidad</strong> incluyendo descripciones en la páginas erróneas, opciones del menú rediseñadas, RSS discovery, y "Modo Seguro".</li>
+ <li><strong>Mejor soporte para la accesibilidad</strong> incluyendo accesibilidad para DHTML.</li>
+ <li><strong>Ayudante para notificar sitios webs rotos</strong> para reportar los sitio web que no estan funcionando con Firefox.</li>
+ <li><strong>Mejor soporte para Mac OS X</strong> (10.2 y posterior) incluyendo la migración del perfil desde Safari e Internet Explorer para Mac.</li>
+</ul>
+
+<h4 id="Seguridad_y_privacidad" name="Seguridad_y_privacidad">Seguridad y privacidad</h4>
+
+<ul>
+ <li><strong>Actualización automática</strong> para racionalizar to streamline product upgrades. Notification of an update is more prominent, and updates to Firefox may now be half a megabyte or smaller. Updating extensions has also improved.</li>
+ <li><strong>Bloqueo de ventanas emergentes mejorado.</strong></li>
+ <li><strong>Limpieza de datos privados</strong> proporciona un modo fácil y cómodo de eliminar nuestros datos personales desde un menú o con atajos de teclado.</li>
+</ul>
+
+<h3 id="Soporte_a_los_est.C3.A1ndares_Web" name="Soporte_a_los_est.C3.A1ndares_Web">Soporte a los estándares Web</h3>
+
+<p>Firefox es lider de la industria en el soporte a los estandares Web con constantes implementaciones multiplataforma para:</p>
+
+<ul>
+ <li>Lenguaje para el Formato de HiperTextos (<a href="es/HTML">HTML</a>) y lenguaje extensible de marcado de hipertexto (<a href="es/XHTML">XHTML</a>): <a class="external" href="http://www.w3.org/TR/html401/">HTML 4.01</a> y <a class="external" href="http://www.w3.org/TR/xhtml1/">XHTML 1.0/1.1</a></li>
+ <li>Hojas de Estilo en Cascada (<a href="es/CSS">CSS</a>): <a class="external" href="http://www.w3.org/TR/REC-CSS1">CSS Level 1</a>, <a class="external" href="http://www.w3.org/TR/REC-CSS2">CSS Level 2</a> y partes de <a class="external" href="http://www.w3.org/Style/CSS/current-work.html">CSS Level 3</a></li>
+ <li>Modelo de Objetos de Documento (<a href="es/DOM">DOM</a>): <a class="external" href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/">DOM Level 1</a>, <a class="external" href="http://www.w3.org/DOM/DOMTR#dom2">DOM Level 2</a> and parts of <a class="external" href="http://www.w3.org/DOM/DOMTR#dom3">DOM Level 3</a></li>
+ <li>Mathematical Markup Language: <a class="external" href="http://www.w3.org/Math/">MathML Version 2.0</a></li>
+ <li>Lenguaje Extensible de Marcas (<a href="es/XML">XML</a>): <a class="external" href="http://www.w3.org/TR/REC-xml">XML 1.0</a>, <a class="external" href="http://www.w3.org/TR/REC-xml-names/">Namespaces in XML</a>, <a class="external" href="http://www.w3.org/TR/xml-stylesheet/">Associating Style Sheets with XML Documents 1.0</a>, <a class="external" href="http://lists.w3.org/Archives/Public/www-xml-linking-comments/2001AprJun/att-0074/01-NOTE-FIXptr-20010425.htm">Fragment Identifier for XML</a></li>
+ <li>XSL Transformations (<a href="es/XSLT">XSLT</a>): <a class="external" href="http://www.w3.org/TR/xslt">XSLT 1.0</a></li>
+ <li>XML Path Language (<a href="es/XPath">XPath</a>): <a class="external" href="http://www.w3.org/TR/xpath">XPath 1.0</a></li>
+ <li>Resource Description Framework (<a href="es/RDF">RDF</a>): <a class="external" href="http://www.w3.org/RDF/">RDF</a></li>
+ <li>Simple Object Access Protocol (SOAP): <a class="external" href="http://www.w3.org/TR/SOAP/">SOAP 1.1</a></li>
+ <li><a href="es/JavaScript">JavaScript</a> 1.6, based on <a href="es/ECMA-262">ECMA-262</a>, revision 3: <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMA-262</a></li>
+</ul>
+
+<p>Firefox 1.5 soporta: los siguientes protocolos para transporte de datos (HTTP, FTP, SSL, TLS, y otros), caracteres multilingües (Unicode), múltiples formatos gráficos (GIF, JPEG, PNG, SVG, y otros) y la última versión del lenguaje para scripts más popular del mundo, <a href="es/Novedades_en_JavaScript_1.6">JavaScript 1.6</a>.</p>
+
+<h3 id="Cambios_desde_Firefox_1.0" name="Cambios_desde_Firefox_1.0">Cambios desde Firefox 1.0</h3>
+
+<p>Muchos cambios han sido introducido en Firefox desde su lanzamiento el 9 de noviembre de 2004. Firefox ha sido mejorado con muchas nuevas características y correciones de bugs. Las release-notes de Deer Park y Firefox son unas excelentes fuentes la información sobre los cambios en cada lanzamiento de Firefox.</p>
+
+<ul>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5-comprehensive.html">What's new in Firefox 1.5 (comprehensive)</a></li>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5rc3.html">What's new in Firefox 1.5 RC 3</a></li>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5rc2.html">What's new in Firefox 1.5 RC 2</a></li>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5rc1.html">What's new in Firefox 1.5 RC 1</a></li>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5b2.html">What's new in Firefox 1.5 Beta 2</a></li>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5b1.html">What's new in Firefox 1.5 Beta 1</a></li>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5a2.html">What's new in Deer Park Alpha 2</a></li>
+ <li><a class="external" href="http://www.squarefree.com/burningedge/releases/1.5a1.html">What's new in Deer Park Alpha 1</a></li>
+</ul>
diff --git a/files/es/mozilla/firefox/releases/19/index.html b/files/es/mozilla/firefox/releases/19/index.html
new file mode 100644
index 0000000000..c5ebfd438a
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/19/index.html
@@ -0,0 +1,67 @@
+---
+title: Firefox 19 para Desarrolladores
+slug: Mozilla/Firefox/Releases/19
+translation_of: Mozilla/Firefox/Releases/19
+original_slug: Firefox_19_para_desarrolladores
+---
+<div>{{FirefoxSidebar}}</div>
+
+<p>
+ </p><p>Quieres ayudar a documentar Firefox 19? Visita la <a class="external" href="http://beta.elchi3.de/doctracker/#list=fx&amp;version=19.0">lista de bugs que necesitan ser revisados</a> e inicia!</p>
+<p></p>
+
+<h2 id="Cambios_para_desarrolladores">Cambios para desarrolladores</h2>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<ul>
+ <li>Los objetos <code style="font-size: 14px;"><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Map" title="/en-US/docs/JavaScript/Reference/Global_Objects/Map">Map</a> y</code> <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Set" title="/en-US/docs/JavaScript/Reference/Global_Objects/Set">Set</a></code> pasaron de tener un método <code>size()</code> a tener una propiedad <code>size</code> ({{bug("807001")}})</li>
+ <li>Los objetos <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Map" style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;" title="/en-US/docs/JavaScript/Reference/Global_Objects/Map">Map</a> and <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Set" title="/en-US/docs/JavaScript/Reference/Global_Objects/Set">Set</a></code> ahora tienen un método clear(). ({{bug("805003")}})</li>
+</ul>
+
+<h3 id="CSS">CSS</h3>
+
+<ul>
+ <li>Support for the viewport-relative {{cssxref("&lt;length&gt;")}} units, <code>vh</code>, <code>vw</code>, <code>vmin</code>, and <code>vmax</code>, has landed ({{bug("503720")}})</li>
+ <li>CSS Flexbox has been unprefixed, but remains disabled by default ({{bug("801098")}}).</li>
+ <li>The <code>-moz-initial</code> value has been unprefixed ({{bug("806068")}}). <code>-moz-initial</code> will be kept for a while as an alias; however, authors are strongly encouraged to switch over to <code>initial</code>.</li>
+ <li>The CSS {{ cssxref("text-transform")}} property now supports the <code>full-width</code> keyword, which allows a more seamless inclusion of Latin characters in text using ideographic fixed-width characters, like Chinese or Japanese ({{bug("774560")}}).</li>
+ <li>The CSS {{ cssxref("page-break-inside")}} has been implemented ({{bug("685012")}}).</li>
+ <li>The CSS {{ cssxref("calc", "calc()")}} function can now be used on <code>&lt;color-stop&gt;</code> (on {{cssxref("&lt;gradient&gt;")}}).</li>
+ <li>The CSS {{ cssxref("@page") }} at-rule is now supported ({{bug("115199")}}). Note that the pseudo-classes {{cssxref(":first")}}, {{cssxref(":right")}}, and {{cssxref(":left")}} are not yet implemented.</li>
+ <li>The {{ cssxref(":-moz-placeholder") }} pseudo-class is replaced by the {{ cssxref("::-moz-placeholder") }} pseudo-<em>element</em> ({{ bug("737786") }}).</li>
+</ul>
+
+<h3 id="DOM">DOM</h3>
+
+<ul>
+ <li>The {{ domxref("element.getElementsByTagName") }} method will now return <code>HTMLCollection</code> ({{bug("799464")}}).</li>
+ <li>The {{domxref("File")}} <code>mozLastModifiedDate</code> property has been implemented. ({{bug("793955")}})</li>
+ <li>The {{domxref("CanvasRenderingContext2D")}} <code>isPointInStroke</code> method has been implemented ({{bug("803124")}}).</li>
+</ul>
+
+<h3 id="XForms">XForms</h3>
+
+<p>Support for <a href="/en-US/docs/XForms" title="/en-US/docs/XForms">XForms</a> has been <a href="http://www.philipp-wagner.com/blog/2011/07/the-future-of-mozilla-xforms/" title="http://www.philipp-wagner.com/blog/2011/07/the-future-of-mozilla-xforms/"><strong>removed</strong></a> in Firefox 19.</p>
+
+<h2 id="Changes_for_add-on_and_Mozilla_developers">Changes for add-on and Mozilla developers</h2>
+
+<div class="note">
+<p><strong>Note:</strong> A key change in Firefox 19 is that <a href="/en-US/docs/XPCOM_API_Reference/nsresult" title="/en-US/docs/XPCOM_API_Reference/nsresult"><code>nsresult</code></a> is now strongly typed. This will help make it easier to detect bugs that are caused by mishandling of return values, but may cause existing code to break if it's making incorrect assumptions in this regard.</p>
+</div>
+
+<ul>
+ <li><code>getBrowserSelection()</code> now returns the selected text in a text input field. As a result, <code>gContextMenu.isTextSelected</code> will be <code>true</code> when the user selects text in a text input field that is not a password field. ({{bug("565717")}})</li>
+ <li><a href="/en/Mozilla/JavaScript_code_modules/Dict.jsm" title="en/Mozilla/JavaScript_code_modules/Dict.jsm">Dict.jsm</a>: <a href="/en/Mozilla/JavaScript_code_modules/Dict.jsm#Creating_a_dictionary" title="en/Mozilla/JavaScript_code_modules/Dict.jsm#Creating_a_dictionary"><code>Dict()</code></a> now takes a JSON String. <a href="/en/Mozilla/JavaScript_code_modules/Dict.jsm#toJSON()" title="en/Mozilla/JavaScript_code_modules/Dict.jsm#toJSON()"><code>Dict.toJSON()</code></a> was added, and it returns a JSON String. ({{bug("727967")}})</li>
+</ul>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="http://www.mozilla.org/en-US/firefox/19.0beta/releasenotes/">Firefox 19 Beta Release Notes</a></li>
+ <li><a href="/en-US/docs/Site_Compatibility_for_Firefox_19">Site Compatibility for Firefox 19</a></li>
+</ul>
+
+<h3 id="Older_versions">Older versions</h3>
+
+<p>{{Firefox_for_developers('18')}}</p>
diff --git a/files/es/mozilla/firefox/releases/2/adding_feed_readers_to_firefox/index.html b/files/es/mozilla/firefox/releases/2/adding_feed_readers_to_firefox/index.html
new file mode 100644
index 0000000000..75693c99a7
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/2/adding_feed_readers_to_firefox/index.html
@@ -0,0 +1,52 @@
+---
+title: Añadir lectores de canales a Firefox
+slug: Mozilla/Firefox/Releases/2/Adding_feed_readers_to_Firefox
+tags:
+  - RSS
+  - Todas_las_Categorías
+translation_of: Mozilla/Firefox/Releases/2/Adding_feed_readers_to_Firefox
+original_slug: Añadir_lectores_de_canales_a_Firefox
+---
+<div>{{FirefoxSidebar}}</div><p>A partir de Firefox 2, Firefox permite seleccionar diferentes lectores de canales RSS o Atom para usarlos cuando se trata de leer un canal. Este artículo proporciona información sobre cómo añadir lectores adicionales no admitidos por defecto.</p>
+
+<h2 id="A.C3.B1adir_un_nuevo_lector_de_canales_basado_en_la_web" name="A.C3.B1adir_un_nuevo_lector_de_canales_basado_en_la_web">Añadir un nuevo lector de canales basado en la web</h2>
+
+<p>Para añadir un nuevo lector de canales basado en la web, todo lo que tiene que hacer es añadir tres nuevas preferencias:</p>
+
+<dl>
+ <dt><code>browser.contentHandlers.types.<em>número</em>.title</code></dt>
+ <dd>El nombre del lector de canales.</dd>
+ <dt><code>browser.contentHandlers.types.<em>número</em>.type</code></dt>
+ <dd>Para un lector de canales, en este caso sería "application/vnd.mozilla.maybe.feed".</dd>
+ <dt><code>browser.contentHandlers.types.<em>número</em>.uri</code></dt>
+ <dd>La URI del lector de canales. Utilice "%s" donde se deba insertar la URL del canal.</dd>
+</dl>
+
+<p><code><em>número</em></code> debe ser reemplazado con el siguiente número único más alto que no haya sido usado aún. Por ejemplo, si desea añadir un nuevo lector de canales llamado "Lector Sencillo", y ya están definidos manejadores de contenido con los números 0 al 4, debe sustituir <code><em>número</em></code> por 5, como sigue:</p>
+
+<ul>
+ <li><code>browser.contentHandlers.types.5.title</code>: Lector Sencillo</li>
+ <li><code>browser.contentHandlers.types.5.type</code>: application/vnd.mozilla.maybe.feed</li>
+ <li><code>browser.contentHandlers.types.5.uri</code>: <span class="nowiki">http://www.urllectorsencillo.com?feed=%s</span></li>
+</ul>
+
+<p>Puede añadir estas preferencias manualmente, visitando about:config, o puede programarlo, si una extensión desea instalar un nuevo lector de canales.</p>
+
+<h3 id="A.C3.B1adir_un_lector_de_canales_desde_una_aplicaci.C3.B3n_web" name="A.C3.B1adir_un_lector_de_canales_desde_una_aplicaci.C3.B3n_web">Añadir un lector de canales desde una aplicación web</h3>
+
+<p>El código JavaScript en la web puede añadir un lector de canales fácilmente, usando la función <code>navigator.registerContentHandler()</code>, de esta manera:</p>
+
+<pre>navigator.registerContentHandler("application/vnd.mozilla.maybe.feed",
+                                 "http://www.urllectorsencillo.com?feed=%s",
+                                 "Lector Sencillo");
+</pre>
+
+<h2 id="A.C3.B1adir_una_nueva_aplicaci.C3.B3n_lectora_de_canales" name="A.C3.B1adir_una_nueva_aplicaci.C3.B3n_lectora_de_canales">Añadir una nueva aplicación lectora de canales</h2>
+
+<p>La manera más sencilla de hacer esto es simplemente usar la interfaz de usuario disponible, usando el panel Canales en la ventana de preferencias (u opciones, dependiendo de su plataforma).</p>
+
+<p>También se puede hacer programáticamente mediante una extensión, lo cual se hace estableciendo el valor de la opción <code>browser.feeds.handlers.application</code> a la ruta de la aplicación a usar para leer los canales.</p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "en": "en/Adding_feed_readers_to_Firefox", "ja": "ja/Adding_feed_readers_to_Firefox", "zh-tw": "zh_tw/\u65b0\u589e\u6d88\u606f\u4f86\u6e90\u95b1\u8b80\u5de5\u5177" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/2/index.html b/files/es/mozilla/firefox/releases/2/index.html
new file mode 100644
index 0000000000..75aa69c5f6
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/2/index.html
@@ -0,0 +1,158 @@
+---
+title: Firefox 2 para desarrolladores
+slug: Mozilla/Firefox/Releases/2
+tags:
+  - CSS
+  - Complementos
+  - DOM
+  - Desarrollo_Web
+  - Estándares_Web
+  - HTML
+  - JavaScript
+  - RDF
+  - SVG
+  - Servicios_Web_XML
+  - Todas_las_Categorías
+  - XML
+  - XSLT
+  - XUL
+  - extensiones
+translation_of: Mozilla/Firefox/Releases/2
+original_slug: Firefox_2_para_desarrolladores
+---
+<div>{{FirefoxSidebar}}</div><h2 id="Nuevas_caracter.C3.ADsticas_para_desarrolladores_en_Firefox_2" name="Nuevas_caracter.C3.ADsticas_para_desarrolladores_en_Firefox_2">Nuevas características para desarrolladores en Firefox 2</h2>
+
+<p>Firefox 2 aporta gran cantidad de funcionalidades nuevas, este artículo proporciona enlaces que describen estas nuevas capacidades.</p>
+
+<h3 id="Para_desarrolladores_de_sitios_y_aplicaciones_web." name="Para_desarrolladores_de_sitios_y_aplicaciones_web.">Para desarrolladores de sitios y aplicaciones web.</h3>
+
+<dl>
+ <dt><a class="external" href="http://wiki.mozilla.org/Microsummaries">MicroResúmenes <small>(en)</small></a></dt>
+ <dd>Son breves recopilaciones actualizables de la información más importante en una página Web. Pueden ser proporcionados por los desarrolladores del sitio o por terceros. Cuando se añade a marcadores una página con esta funcionalidad, los usuarios pueden escoger que se muestre este microresúmen en vez del típico título estático.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Como_crear_un_Microresumen" title="es/Como_crear_un_Microresumen">Cómo crear un Microresumen</a></dt>
+ <dd>Tutorial sobre cómo crear un generador de microresúmenes.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Marcado_XML_en_los_microres%C3%BAmenes" title="es/Marcado_XML_en_los_microresúmenes">Marcado XML en los microresúmenes</a></dt>
+ <dd>Una guía de referencia sobre el marcado XML usado para crear microresúmenes.</dd>
+</dl>
+
+<dl>
+ <dt><a class="external" href="http://opensearch.a9.com/">Soporte OpenSearch</a></dt>
+ <dd>Firefox 2 admite el formato de búsqueda OpenSearch.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Creaci%C3%B3n_de_plugins_MozSearch" title="es/Creación_de_plugins_MozSearch">Creación de plugins MozSearch</a></dt>
+ <dd>Firefox 2 soporta MozSearch, un plugin de búsqueda basado en OpenSearch, pero previsto sólo para uso interno.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Permitir_sugerencias_en_los_plugins_de_b%C3%BAsqueda" title="es/Permitir_sugerencias_en_los_plugins_de_búsqueda">Permitir sugerencias en los plugins de búsqueda</a></dt>
+ <dd>Cómo hacer que su plugin MozSearch ofrezca sugerencias de búsqueda en una ventana emergente cuando usamos la barra de búsqueda.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Novedades_en_JavaScript_1.7" title="es/Novedades_en_JavaScript_1.7">Novedades en JavaScript 1.7</a></dt>
+ <dd>Firefox 2 soporta JavaScript 1.7, que incluye nuevas características como <code>let</code>, asignación desestructurada, generadores e iteradores, y "array comprehensions".</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/DOM/Almacenamiento" title="es/DOM/Almacenamiento">WHATWG Sesiones del lado cliente y el almacenamiento continuo (Almacenamiento DOM)</a></dt>
+ <dd>Las sesiones del lado cliente y el almacenamiento continuo permiten que las aplicaciones web puedan almacenar datos estructurados en el lado del cliente.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/SVG_en_Firefox" title="es/SVG_en_Firefox">SVG en Firefox</a></dt>
+ <dd>Firefox 2 mejora el soporte a Gráficos Vectoriales Escalables (SVG), implementando el elemento <code>&lt;textPath&gt;</code> y aumentando el número de atributos soportados.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Control_de_la_correcci%C3%B3n_ortogr%C3%A1fica_en_formularios_HTML" title="es/Control_de_la_corrección_ortográfica_en_formularios_HTML">Control de la corrección ortográfica en formularios HTML</a></dt>
+ <dd>Firefox 2 incluye soporte para la revisión ortográfica en línea de los campos y áreas de texto. Este artículo describe cómo escribir HTML para activar o desactivar la revisión ortográfica en los elementos del formulario de manera individual.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Seguridad_en_Firefox_2" title="es/Seguridad_en_Firefox_2">Seguridad en Firefox 2</a></dt>
+ <dd>Firefox 2 cambia los protocolos de seguridad que están activos por defecto.</dd>
+</dl>
+
+<h3 id="Para_desarrolladores_XUL_y_de_extensiones" name="Para_desarrolladores_XUL_y_de_extensiones">Para desarrolladores XUL y de extensiones</h3>
+
+<dl>
+ <dt><a href="/es/API_de_restauraci%C3%B3n_de_sesi%C3%B3n" title="es/API_de_restauración_de_sesión">API de restauración de sesión</a></dt>
+ <dd>Aporta métodos para poder guardar y restaurar entre sesiones en Firefox.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/API_de_acceso_a_canales" title="es/API_de_acceso_a_canales">API de acceso a canales</a></dt>
+ <dd>API que permite al desarrollador tener acceso y parsear canales Atom y RSS.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/SAX" title="es/SAX">SAX</a></dt>
+ <dd>API de <abbr title="análisis sintáctico">parseo</abbr> basado en eventos XML.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Instalaci%C3%B3n_de_motores_de_b%C3%BAsqueda_desde_p%C3%A1ginas_web" title="es/Instalación_de_motores_de_búsqueda_desde_páginas_web">Instalación de motores de búsqueda desde páginas web</a></dt>
+ <dd>Un código JavaScript puede indicarle a Firefox cómo instalar el plugin de un nuevo motor de búsqueda escrito en formato Sherlock u OpenSearch.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/A%C3%B1adir_datos_para_la_protecci%C3%B3n_anti-phishing" title="es/Añadir_datos_para_la_protección_anti-phishing">Añadir datos para la protección anti-phishing</a></dt>
+ <dd>Es posible aumentar la protección anti-phishing de Firefox añadiendo datos adicionales del proveedor para un sistema de navegación seguro.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/A%C3%B1adir_lectores_de_canales_a_Firefox" title="es/Añadir_lectores_de_canales_a_Firefox">Añadir lectores de canales a Firefox</a></dt>
+ <dd>Puedes añadir más lectores de canales a Firefox, ya sean webs o aplicaciones.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Almacenamiento" title="es/Almacenamiento">Almacenamiento</a></dt>
+ <dd>Firefox 2 presenta mozStorage, una arquitectura de base de datos basada en sqlite.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Cambios_del_tema_en_Firefox_2" title="es/Cambios_del_tema_en_Firefox_2">Cambios del tema en Firefox 2</a></dt>
+ <dd>Comenta los cambios necesarios para actualizar temas existentes para que funcionen en Firefox 2.</dd>
+</dl>
+
+<h2 id="Nuevas_caracter.C3.ADsticas_para_usuarios_finales" name="Nuevas_caracter.C3.ADsticas_para_usuarios_finales">Nuevas características para usuarios finales</h2>
+
+<p>Firefox 2.0 proporciona una versión mejorada de la limpia interfaz que ofrecía en versiones anteriores. Con mejoras de seguridad para que tu experiencia en línea sea más segura y práctica que nunca.</p>
+
+<h3 id="Experiencia_de_usuario" name="Experiencia_de_usuario">Experiencia de usuario</h3>
+
+<ul>
+ <li>La <strong>corrección ortográfica de las áreas de texto</strong> permite rellenar formularios Web con tranquilidad.</li>
+ <li>Los <strong>microresúmenes</strong> permiten crear marcadores que muestren información extraída de las páginas que enlazan. Pueden ser actualizados automáticamente; esto es muy útil para seguir el curso de una acción, o datos cambiantes.</li>
+ <li>El <strong>Administrador de extensiones</strong> ha sido mejorado.</li>
+ <li>El <strong>Administrador de motores de búsqueda</strong> permite que estos puedan ser recolocados y/o suprimidos en la barra de búsqueda.</li>
+ <li><strong>Navegación con pestañas mejorada</strong>. Se incluye un botón de cierre en cada pestaña. Firefox cambia su modo de decidir qué pestaña mostrar cuando cerramos la pestaña actual. Se simplifican la preferencias de las pestañas.</li>
+ <li>La <strong>detección automática de motores de búsqueda</strong> permite a los motores ofrecer plugins para la barra de búsqueda de Firefox y ofrecerse a instalarlos para ti.</li>
+ <li>Con las <strong>sugerencias de búsqueda</strong> los motores de búsqueda pueden sugerir términos basándose en lo que se escribió en búsquedas anteriores.</li>
+</ul>
+
+<h3 id="Seguridad_y_privacidad" name="Seguridad_y_privacidad">Seguridad y privacidad</h3>
+
+<ul>
+ <li><strong>Anti-phishing</strong> para avisar a los usuarios cuando visitan un sitio web sospechoso.</li>
+</ul>
+
+<h3 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h3>
+
+<ul>
+ <li><a href="/es/Firefox_1.5_para_Desarrolladores" title="es/Firefox_1.5_para_Desarrolladores">Firefox 1.5 para Desarrolladores</a></li>
+</ul>
+
+<p><span class="comment">Categorías</span></p>
+
+<p><span class="comment">Interwiki links</span></p>
+
+<p>{{ languages( { "ca": "ca/Firefox_2_per_a_desenvolupadors", "en": "en/Firefox_2_for_developers", "fr": "fr/Firefox_2_pour_les_d\u00e9veloppeurs", "it": "it/Firefox_2.0_per_Sviluppatori", "ja": "ja/Firefox_2_for_developers", "ko": "ko/Firefox_2_for_developers", "pl": "pl/Firefox_2_dla_programist\u00f3w", "pt": "pt/Firefox_2_para_desenvolvedores", "zh-tw": "zh_tw/Firefox_2_\u6280\u8853\u6587\u4ef6" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/2/security_changes/index.html b/files/es/mozilla/firefox/releases/2/security_changes/index.html
new file mode 100644
index 0000000000..54ca7c208a
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/2/security_changes/index.html
@@ -0,0 +1,14 @@
+---
+title: Seguridad en Firefox 2
+slug: Mozilla/Firefox/Releases/2/Security_changes
+tags:
+  - Seguridad
+  - Todas_las_Categorías
+translation_of: Mozilla/Firefox/Releases/2/Security_changes
+original_slug: Seguridad_en_Firefox_2
+---
+<div>{{FirefoxSidebar}}</div><p><a href="es/Firefox_2">Firefox 2</a> tiene tanto SSLv2 como la débil "exportación" de juegos de claves desactivados por defecto, en favor de SSLv3. Esto proporciona mejoras en la seguridad.</p>
+
+<p>Los métodos preferidos de encriptación son <code>TLS_DHE_DSS_WITH_3DES_EDE_CBC_SHA</code> y <code>TLS_RSA_WITH_3DES_EDE_CBC_SHA</code>. Algunos sevidores se refieren a ellos como <code>SSL_DHE_DSS_WITH_3DES_EDE_CBC_SHA</code> y <code>SSL_RSA_WITH_3DES_EDE_CBC_SHA</code>.</p>
+
+<p>Si el soporte SSLv2 tuviera que ser activado, puede hacerse cambiando en las preferencias de usuario el valor <code>security.ssl2.*</code> deseado a <code>true</code>.</p>
diff --git a/files/es/mozilla/firefox/releases/3.5/index.html b/files/es/mozilla/firefox/releases/3.5/index.html
new file mode 100644
index 0000000000..4b64f3bb91
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3.5/index.html
@@ -0,0 +1,232 @@
+---
+title: Firefox 3.5 para desarrolladores
+slug: Mozilla/Firefox/Releases/3.5
+translation_of: Mozilla/Firefox/Releases/3.5
+original_slug: Firefox_3.5_para_desarrolladores
+---
+<div>{{FirefoxSidebar}}</div><p>Firefox 3.5 implementa nuevas funcionalidades, además de agregar y mejorar el funcionamiento de una amplia variedad de estándares web. Este artículo ofrece una extensa lista con enlaces a artículos que explican estas grandes mejoras.</p>
+
+<h2 id="Nuevas_funcionalidades_para_desarrolladores_en_Firefox_3.5">Nuevas funcionalidades para desarrolladores en Firefox 3.5</h2>
+
+<h3 id="Para_desarrolladores_de_sitios_y_aplicaciones_web">Para desarrolladores de sitios y aplicaciones web</h3>
+
+<h4 id="Funciones_de_HTML_5">Funciones de HTML 5</h4>
+
+<dl>
+ <dt><a href="/Es/Usar_audio_y_v%C3%ADdeo_en_Firefox" title="Es/Usar audio y video en Firefox">Usar audio y video en Firefox</a></dt>
+ <dd>Firefox 3.5 implementa los elementos  <a href="/en-US/docs/HTML/Element/Audio" title="HTML/Element/Audio"><code>audio</code></a> y <a href="/en-US/docs/HTML/Element/Video" title="HTML/Element/Video"><code>video</code></a> de HTML 5.</dd>
+ <dt><a href="/en-US/docs/Offline_resources_in_Firefox" title="Offline resources in Firefox">Recursos sin conexión en Firefox</a></dt>
+ <dd>Firefox 3.5 implementa de forma completa la especificación para recursos sin conexión de HTML 5.</dd>
+ <dt><a href="/en-US/docs/DragDrop/Drag_and_Drop" title="DragDrop/Drag and Drop">Arrastrar y soltar (Drag and drop</a>)</dt>
+ <dd>La API para arrastrar y soltar de HTML 5 permite que el usuario pueda arrastrar y soltar objetos entre sitios web. También permite una API más simple para el uso por parte de las extensiones o aplicaciones basadas en la plataforma Mozilla.</dd>
+</dl>
+
+<h4 id="Nuevas_características_de_CSS_implementadas">Nuevas características de CSS implementadas</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/CSS/@font-face" title="CSS/@font-face">Tipografías descargables</a></dt>
+ <dd>La nueva regla {{cssxref("@font-face")}} permite a las páginas web disponer de tipografías descargables, para que los sitios web puedan ser visualizados como el autor lo pretende.</dd>
+ <dt><a href="/en-US/docs/CSS/Media_queries" title="CSS/Media queries">Pedidos de CSS según el medio</a></dt>
+ <dd>Firefox 3.5 implementa esta característica que permite al autor del sitio web tener más control sobre el archivo CSS que cada dispositivo va a recibir según las características del mismo.</dd>
+ <dt>{{cssxref(":before")}} y {{cssxref(":after")}} actualizados a CSS 2.1</dt>
+ <dd>Los pseudo-elementos <code>:before</code> y <code>:after</code> han sido actualizados para implementar por completo las características de CSS 2.1, añadiendo la posibilidad de usar <code>position</code>, <code>float</code>, <code>list-style-*</code> y algunas propiedades de <code>display</code>.</dd>
+ <dt><a href="/en-US/docs/CSS/opacity" title="CSS/Opacity"><code>opacity</code></a></dt>
+ <dd>La extensión al CSS <code>-moz-opacity</code> fue eliminada para implementar la propiedad estandar <code>opacity</code>.</dd>
+ <dt><a href="/en-US/docs/CSS/text-shadow" title="CSS/Text-shadow"><code>text-shadow</code></a></dt>
+ <dd>La propiedad <code>text-shadow</code>, que permite especificar efectos de sombra para textos y decoraciones del texto, está implementada.</dd>
+ <dt><a href="/en-US/docs/CSS/Word-wrap" title="CSS/Word-wrap"><code>word-wrap</code></a></dt>
+ <dd>Esta propiedad permite especificar cuando las líneas deben o no ser cortadas entre palabras para prevenir el overflow cuando una línea que no puede ser cortada es demasiado larga para entrar en una sola línea.</dd>
+ <dt><a href="/en-US/docs/CSS/-moz-box-shadow" title="CSS/-moz-box-shadow"><code>-moz-box-shadow</code></a></dt>
+ <dt><a href="/en-US/docs/CSS/-moz-border-image" title="CSS/-moz-border-image"><code>-moz-border-image</code></a></dt>
+ <dt><a href="/en-US/docs/CSS/-moz-column-rule" title="CSS/-moz-column-rule"><code>-moz-column-rule</code></a></dt>
+ <dt><a href="/en-US/docs/CSS/-moz-column-rule-width" title="CSS/-moz-column-rule-width"><code>-moz-column-rule-width</code></a></dt>
+ <dt><a href="/en-US/docs/CSS/-moz-column-rule-style" title="CSS/-moz-column-rule-style"><code>-moz-column-rule-style</code></a></dt>
+ <dt><a href="/en-US/docs/CSS/-moz-column-rule-color" title="CSS/-moz-column-rule-color"><code>-moz-column-rule-color</code></a></dt>
+ <dd>Firefox 3.5 añade la posibilidad de usar estas extensiones al CSS de Mozilla.</dd>
+ <dt><a href="/en-US/docs/CSS/color#Mozilla_Specific_Colors" title="CSS/color#Mozilla Specific Colors">The <code>-moz-nativehyperlinktext</code> color value</a></dt>
+ <dd>Este nuevo valor del color representa el predefinido por el sistema del usuario para los hipervínculos.</dd>
+ <dt>Las nuevas propiedades <a href="/en-US/docs/CSS/-moz-window-shadow" title="CSS/-moz-window-shadow"><code>-moz-window-shadow</code></a> y <a href="/en-US/docs/CSS/:-moz-system-metric(mac-graphite-theme)" title="CSS/:-moz-system-metric(mac-graphite-theme)"><code>-moz-system-metric(mac-graphite-theme)</code></a></dt>
+ <dd>Estas nuevas propiedades de CSS fueron añadidas para facilitar la creación de temas.</dd>
+ <dt>Nuevos valores para <a href="/en-US/docs/CSS/-moz-appearance" title="CSS/-moz-appearance"><code>-moz-appearance</code></a></dt>
+ <dd>Los valores <code>-moz-win-glass</code> y <code>-moz-mac-unified-toolbar</code> se agregaron a <code>-moz-appearance</code>.</dd>
+ <dt><a href="/en-US/docs/CSS/Using_CSS_transforms" title="CSS/Using CSS transforms">Usar transformaciones CSS</a></dt>
+ <dd>Firefox 3.5 implementa las transformaciones CSS.  Mirá <a href="/en-US/docs/CSS/-moz-transform" title="CSS/-moz-transform"><code>-moz-transform</code></a> y <a href="/en-US/docs/CSS/-moz-transform-origin" title="CSS/-moz-transform-origin"><code>-moz-transform-origin</code></a> para saber más detalles.</dd>
+ <dt><a href="/en-US/docs/CSS/:nth-child" title="CSS/:nth-child"><code>:nth-child</code></a></dt>
+ <dt><code><a href="/en-US/docs/CSS/:nth-last-child" title="CSS/:nth-last-child">:nth-last-child</a></code></dt>
+ <dt><code><a href="/en-US/docs/CSS/:nth-of-type" title="CSS/:nth-of-type">:nth-of-type</a></code></dt>
+ <dt><code><a href="/en-US/docs/CSS/:nth-last-of-type" title="CSS/:nth-last-of-type">:nth-last-of-type</a></code></dt>
+ <dt><code><a href="/en-US/docs/CSS/:first-of-type" title="CSS/:first-of-type">:first-of-type</a></code></dt>
+ <dt><code><a href="/en-US/docs/CSS/:nth-last-of-type" title="CSS/:nth-last-of-type">:last-of-type</a></code></dt>
+ <dt><a href="/en-US/docs/CSS/:only-of-type" title="CSS/:only-of-type"><code>:only-of-type</code></a></dt>
+ <dd>Estos selectores pueden ser usados en Firefox 3.5.</dd>
+</dl>
+
+<h4 id="Nuevas_funcionalidades_del_DOM">Nuevas funcionalidades del DOM</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/DOM/Storage#localStorage" title="DOM/Storage#localStorage">localStorage</a></dt>
+ <dd>Firefox 3.5 implementa el uso de la propiedad <code>localStorage</code> del Web Storage, que permite que las aplicaciones web guarden datos en la computadora del cliente.</dd>
+ <dt><a href="/en-US/docs/Using_web_workers" title="Using DOM workers">Usar DOM workers</a></dt>
+ <dd>Firefox 3.5 implementa los trabajadores (workers) del DOM lo que permite el multi-threading en las aplicaciones web.</dd>
+ <dt><a href="/en-US/docs/Using_geolocation" title="Using geolocation">Usar geolocalización</a></dt>
+ <dd>Firefox 3.5 implementa la API de geolocalización, que permite que las aplicaciones web obtengan información sobre la ubicación actual del usuario si unu proveedor de ese servicio está instalado y habilitado.</dd>
+ <dt><a href="/en-US/docs/Using_native_JSON" title="Using JSON in Firefox">Usar JSON en Firefox</a></dt>
+ <dd>Posibilidad de usar <a href="/en-US/docs/JSON" title="JSON">JSON</a> en el DOM.</dd>
+ <dt><a href="/en-US/docs/DOM/Locating_DOM_elements_using_selectors" title="DOM/Locating DOM elements using selectors">Localizar elementos del DOM con selectores</a></dt>
+ <dd>El API de selectores permite pedirle a un documento que localice los elementos que coincidan con una regla seleccionada.</dd>
+ <dt><a href="/en-US/docs/DOM/NodeIterator" title="DOM/NodeIterator">El objeto <code>NodeIterator</code></a></dt>
+ <dd>El objeto <code>NodeIterator</code> permite recorrer la lista de nodos en un árbol del DOM.</dd>
+ <dt><a href="/en-US/docs/Gecko-Specific_DOM_Events#MozAfterPaint" title="Gecko-Specific DOM Events#MozAfterPaint">El evento MozAfterPaint</a></dt>
+ <dd>Este nuevo evento del DOM es lanzado después de actualizar partes de una ventana.</dd>
+ <dt><a href="/en-US/docs/Gecko-Specific_DOM_Events#MozMousePixelScroll" title="Gecko-Specific DOM Events#MozMousePixelScroll">El evento MozMousePixelScroll</a></dt>
+ <dd>Este nuevo evento del DOM permite detectar el desplazamiento con la rueda del ratón/mouse en lugar de los eventos basados en la línea de desplazamiento.</dd>
+</dl>
+
+<h4 id="Nuevas_funcionalidades_JavaScript">Nuevas funcionalidades JavaScript</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/New_in_JavaScript_1.8.1" title="New in JavaScript 1.8.1">Nuevo en JavaScript 1.8.1</a></dt>
+ <dd>Una introducción a todos los cambios de JavaScript 1.8.1.</dd>
+ <dt><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/GetPrototypeOf" title="JavaScript/ Reference/Global Objects/Object/GetPrototypeOf"><code>Object.getPrototypeOf()</code></a></dt>
+ <dd>Este nuevo método retorna el prototipo de un objeto especificado.</dd>
+ <dt><a href="/en-US/docs/Using_native_JSON" title="Using JSON in Firefox">Uso de JSON nativo</a></dt>
+ <dd>Firefox 3.5 tiene soporte para <a href="/en-US/docs/JSON" title="JSON">JSON</a> nativo.</dd>
+ <dt>Nuevos métodos trim en el objeto String</dt>
+ <dd>El objeto <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String" title="JavaScript/ Reference/Global Objects/String"><code>String</code></a> tiene ahora los métodos <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String/Trim" rel="internal"><code>trim()</code></a>, <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String/TrimLeft" rel="internal"><code>trimLeft()</code></a>, y <a href="/en-US/docs/JavaScript/Reference/Global_Objects/String/TrimRight" rel="internal"><code>trimRight()</code></a> .</dd>
+</dl>
+
+<h4 id="Networking">Networking</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/HTTP_access_control" title="HTTP access control">Controles de acceso cross-site para HTTP</a></dt>
+ <dd>En Firefox 3.5, es ahora posible en las peticiones HTTP, incluyendo aquellas hechas por <a href="/en-US/docs/XMLHttpRequest" title="XMLHttpRequest"><code>XMLHttpRequest</code></a>, trabajar entre dominios si el servidor lo permite.</dd>
+ <dt><a href="/en-US/docs/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress" title="Using XMLHttpRequest#Monitoring progress">Eventos de progreso para </a><code><a href="/en-US/docs/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress" title="Using XMLHttpRequest#Monitoring progress">XMLHttpRequest</a></code></dt>
+ <dd>Ahora se ofrecen eventos de progreso para que las extensiones puedan monitorizar el progreso de las peticiones.</dd>
+ <dt>Soporte <code>XMLHttpRequest</code> síncrono mejorado</dt>
+ <dd><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=340345" title="https://bugzilla.mozilla.org/show_bug.cgi?id=340345">DOM Timeout</a> y <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=333198" title="https://bugzilla.mozilla.org/show_bug.cgi?id=333198">Input Events</a> son ahora soportados durante un <code>XMLHttpRequest</code> síncrono.</dd>
+ <dt><a href="/en-US/docs/Controlling_DNS_prefetching" title="Controlling DNS prefetching">Control de prefetch de DNS</a></dt>
+ <dd>Firefox 3.5 ofrece prefetch de DNS, por el que resuelve nombres de dominio con anticipación para links incluidos en la página actual, para ahorrar tiempo cuando los enlaces son realmente clickados. Este artículo describe cómo puedes optimizar tu sitio web para desactivar el prefetch, o ajustar cómo opera el prefetch.</dd>
+</dl>
+
+<h4 id="Nuevas_funcionalidades_Canvas">Nuevas funcionalidades Canvas</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing text using a canvas">API de texto HTML 5 para elementos <code>canvas</code></a></dt>
+ <dd>Los elementos Canvas ahora soportan la API de texto HTML 5.</dd>
+ <dt><a href="/en-US/docs/Canvas_tutorial/Applying_styles_and_colors#Shadows" title="Canvas tutorial/Applying styles and colors#Shadows">Efectos de sombra en un <code>canvas</code></a></dt>
+ <dd>Los efectos de sombra de Canvas son ahora soportados.</dd>
+ <dt><a href="/en-US/docs/HTML/Canvas/Pixel_manipulation_with_canvas#Creating_an_ImageData_object" title="HTML/Canvas/Pixel manipulation with canvas#Creating an ImageData object"><code>createImageData()</code></a></dt>
+ <dd>El método canvas <code>createImageData()</code> es ahora soportado, permitiendo al código crear específicamente un objeto <code>ImageData</code> en lugar de necesitar que sea hecho automáticamente. Esto puede mejorar el rendimiento de otros métodos <code>ImageData</code> evitando que deban crear el objeto.</dd>
+ <dt>Atributo <code>moz-opaque</code></dt>
+ <dd>Añadido el atributo DOM <code>moz-opaque</code>, que permite al canvas saber si la translucencia será un factor. Si el canvas sabe que no hay translucencia, el rendimiento de pintado puede ser optimizado.</dd>
+</dl>
+
+<h4 id="Nuevas_funcionalidades_SVG">Nuevas funcionalidades SVG</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/Applying_SVG_effects_to_HTML_content" title="Applying SVG effects to HTML content">Aplicar efectos SVG al contenido HTML</a></dt>
+ <dd>Ahora puedes aplicar efectos SVG a contenido HTML y XHTML; este artículo describe cómo.</dd>
+</dl>
+
+<h4 id="Otras_nuevas_funcionalidades">Otras nuevas funcionalidades</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/ICC_color_correction_in_Firefox" title="ICC color correction in Firefox">Corrección de color ICC en Firefox</a></dt>
+ <dd>Firefox 3.5 ahora soporta corrección de color ICC para imágenes etiquetadas.</dd>
+ <dt>El atributo <code>defer</code> es ahora soportado en elementos <a href="/en-US/docs/HTML/Element/Script" title="HTML/Element/script"><code>script</code></a></dt>
+ <dd>Este atributo indica al navegador que <em>puede</em> escoger continuar parseando y renderizando la página sin esperar a que el script termine de ejecutarse.</dd>
+</dl>
+
+<h3 id="Otras_mejoras">Otras mejoras</h3>
+
+<ul>
+ <li>La propiedad de los nodosde texto <code><a href="/en-US/docs/DOM/Text.wholeText" rel="internal">wholeText</a></code> y el método <code><a href="/en-US/docs/DOM/Text.replaceWholeText" rel="internal">replaceWholeText()</a></code> han sido implementados.</li>
+ <li>La propiedad <code><a href="/en-US/docs/DOM/Element.children" rel="internal">element.children</a></code> ha sido añadida. Retorna una <em>colección</em> de elementos hijo del elemento dado.</li>
+ <li> La propiedad {{domxref("element.contentEditable")}} es ahora soportada, para soportar elementos editables.</li>
+ <li>La API Element Traversal es ahora soportada por el objeto DOM <a href="/en-US/docs/DOM/element" rel="internal">Element</a>.</li>
+ <li>Los nodos de documento HTML pueden ser ahora clonados  usando <a href="/en-US/docs/DOM/Node.cloneNode" title="DOM/Node.cloneNode"><code>cloneNode()</code></a>.</li>
+ <li>El método no estándar <code>getBoxObjectFor()</code> ha sido eliminado. Deberías usar <a href="/en-US/docs/DOM/element.getBoundingClientRect" title="DOM/Element.getBoundingClientRect"><code>getBoundingClientRect()</code></a> en su lugar.</li>
+ <li>Los eventos DOM ya despachados pueden ser ahora re-despachados. Esto hace que Firefox 3.5 pase el test 30 de Acid 3.</li>
+ <li>Se han hecho mejoras en el manejo de rango DOM 2.</li>
+ <li>En ámbito no-chrome, los objetos capturados en excepciones son ahora el objeto realmente lanzado en lugar de un wrapper <a href="/en-US/docs/XPConnect" title="XPConnect">XPConnect</a> que contiene el objeto lanzado.</li>
+ <li>Las referencias ID de SVG ahora son vivas.</li>
+ <li>Los filtros SVG ahora funcionan para <code>foreignObject</code>.</li>
+ <li>El método <code>GetSVGDocument()</code> ha sido añadido a los elementos <a href="/en-US/docs/HTML/Element/object" title="HTML/Element/Object"><code>object</code></a> y <a href="/en-US/docs/HTML/Element/iframe" title="HTML/Element/Iframe"><code>iframe</code></a> por compatibilidad.</li>
+ <li>El setting implícito de propiedades en inicializadores de objeto y array ya no ejecuta los setters JavaScript. Ver el post <a href="/web-tech/2009/04/29/object-and-array-initializers-should-not-invoke-setters-when-evaluated" title="web-tech/2009/04/29/object-and-array-initializers-should-not-invoke-setters-when-evaluated">Object and array initializers should not invoke setters when evaluated</a> para más detalles.</li>
+ <li>La variable <code>gDownloadLastDir.path</code> ha sido renombrada a <code>gDownloadLastDir.file</code> porque se refiere a un {{interface("nsIFile")}}, no a una ruta.</li>
+ <li>La variable <code>gDownloadLastDirPath</code> ha sido renombrada a <code>gDownloadLastDirFile</code> porque se refiere a un {{interface("nsIFile")}}, not a una ruta.</li>
+ <li>A partir de Firefox 3.5, no puedes usar <code>data:</code> bindings en los chrome packages que tienen automatización <code>XPCNativeWrapper</code>.</li>
+</ul>
+
+<h3 id="For_XUL_and_add-on_developers">For XUL and add-on developers</h3>
+
+<p>If you're an extension developer, you should start by reading <a href="/en-US/docs/Updating_extensions_for_Firefox_3.5" title="Updating extensions for Firefox 3.5">Updating extensions for Firefox 3.5</a>, which offers a helpful overview of what changes may affect your extension.</p>
+
+<h4 id="New_components_and_functionality">New components and functionality</h4>
+
+<dl>
+ <dt><a href="/en-US/docs/Supporting_private_browsing_mode" title="Supporting private browsing mode">Supporting private browsing mode</a></dt>
+ <dd>Firefox 3.5 offers Private Browsing mode, which doesn't record the user's activities.  Extensions may support private browsing following the guidelines offered by this article.</dd>
+ <dt><a href="/en-US/docs/Security_changes_in_Firefox_3.5" title="Security changes in Firefox 3.5">Security changes in Firefox 3.5</a></dt>
+ <dd>This article covers security-related changes in Firefox 3.5.</dd>
+ <dt><a href="/en-US/docs/Theme_changes_in_Firefox_3.5" title="Theme changes in Firefox 3.5">Theme changes in Firefox 3.5</a></dt>
+ <dd>This article covers theme-related changes in Firefox 3.5.</dd>
+ <dt><a href="/en-US/docs/Monitoring_WiFi_access_points" title="Monitoring WiFi access points">Monitoring WiFi access points</a></dt>
+ <dd>Code with UniversalXPConnect privileges can now monitor the list of available access points, getting information on their SSIDs, MAC addresses, and signal strength.  This can be used in tandem with Geolocation to offer WiFi-based location service.</dd>
+</dl>
+
+<h4 id="Notable_changes_and_improvements">Notable changes and improvements</h4>
+
+<ul>
+ <li>The XUL <code><a href="../../../../en/XUL/textbox" rel="internal">textbox</a></code> widget now offers a <code><a href="../../../../en/XUL/Attribute/textbox.type" rel="internal">search</a></code> type, for use as search fields.</li>
+ <li>In order to support dragging and dropping tabs between windows, the <a href="/en-US/docs/XUL/browser" title="XUL/Browser"><code>browser</code></a> widget now has a <a href="/en-US/docs/XUL/Method/SwapDocShells" title="XUL/Method/SwapDocShells"><code>swapDocShells()</code></a> method.</li>
+ <li>Added the <a href="/en-US/docs/XUL/Attribute/Panel.level" title="XUL/Attribute/panel.level"><code>level</code></a> attribute to the <a href="/en-US/docs/XUL/panel" title="XUL/Panel"><code>panel</code></a> element; this specifies whether panels appear on top of other applications, or just on top of the window the panel is contained within.</li>
+ <li>XUL elements now support the <code>clientXXX</code> and <code>scrollXXX</code> properties.</li>
+ <li><a href="/en-US/docs/XUL/keyset" title="XUL/Keyset"><code>keyset</code></a>s now include a <code>disabled</code> attribute.</li>
+ <li>In addition, <code>keyset</code>s can now be removed using the node's <a href="/en-US/docs/DOM/Node.removeChild" title="DOM/Node.removeChild"><code>removeChild()</code></a> method.</li>
+ <li><span class="lang lang-en"><code><a href="../../../../en/mozIStorageStatement" rel="internal">mozIStorageStatement</a></code> </span> had the <code>initialize()</code> method removed; consumers should use the <span class="lang lang-en"><code><a href="../../../../en/mozIStorageConnection#createStatement%28%29" rel="internal">createStatement()</a></code> </span> method instead to get a new statement object.</li>
+ <li>The <a href="/en-US/docs/Storage" title="Storage">Storage</a> API now offers support for asynchronous requests.</li>
+ <li>The <a href="/en-US/docs/nsICookie2" title="NsICookie2"><code>nsICookie2</code></a> interface now exposes the time at which cookies were created in its new <code>creationTime</code> attribute.</li>
+ <li>Added a flag to <code><a href="../../../../en/nsIProtocolHandler" rel="internal">nsIProtocolHandler</a></code> (<code>URI_IS_LOCAL_RESOURCE</code>) that is checked during chrome registration to make sure a protocol is allowed to be registered.</li>
+ <li>Firefox now looks for plugins in <code>/usr/lib/mozilla/plugins</code> on Linux, as well as the previously supported locations.</li>
+ <li>The plugin API has been updated to include support for private browsing mode; you may now use <a href="/en-US/docs/NPN_GetValue" title="NPN GetValue"><code>NPN_GetValue()</code></a> to query the state of private browsing mode using the variable <code>NPNVprivateModeBool</code>.</li>
+</ul>
+
+<h2 id="New_features_for_end_users">New features for end users</h2>
+
+<h3 id="User_experience">User experience</h3>
+
+<dl>
+ <dt>Location aware browsing</dt>
+ <dd>If you choose, you may allow Firefox 3.5 to share information about your current location with web sites.  Firefox 3.5 can use information about the network you're connected to to share your location. Of course, it asks for your permission before doing so, to ensure your privacy.</dd>
+ <dt>Open audio and video support</dt>
+ <dd>Firefox 3.5 supports embedded video and audio using the open Ogg format, as well as WAV for audio. No plugins, no confusing error messages about needing to install something or other that turns out not to be available on your platform anyway.</dd>
+ <dt>Local data storage</dt>
+ <dd>Web applications can now use Web Storage's local storage capabilities to store data on your computer.  This is great for anything from site preferences to more complex data.</dd>
+</dl>
+
+<h3 id="Security_and_privacy">Security and privacy</h3>
+
+<dl>
+ <dt>Private Browsing</dt>
+ <dd>Need to use someone else's computer? Switch on Private Browsing mode and nothing will be recorded about your session, including cookies, history, and any other potentially private information.</dd>
+ <dt>Better privacy controls</dt>
+ <dd>The Privacy preference pane has been completely redesigned to offer users more control over their private information. Users can choose to retain or discard anything including history information, cookies, downloads, and form field information.  In addition, users can specify whether or not to include history and/or bookmarks in the location bar's automated suggestions, so you can keep private web addresses from popping up unexpectedly while typing in the location bar.</dd>
+</dl>
+
+<h3 id="Performance">Performance</h3>
+
+<dl>
+ <dt>Faster JavaScript performance</dt>
+ <dd>JavaScript, the "J" in "AJAX," is sped up dramatically in Firefox 3.5 with the new TraceMonkey JavaScript engine.  Web applications are much faster than in Firefox 3.</dd>
+ <dt>Faster page rendering</dt>
+ <dd>Web content draws faster in Firefox 3.5, thanks to technologies such as "speculative parsing." Your users don't need to know what it means, other than "it makes things draw faster."</dd>
+</dl>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Firefox_3_for_developers" title="Firefox 3 for developers">Firefox 3 for developers</a></li>
+ <li><a href="/en-US/docs/Firefox_2_for_developers" title="Firefox 2 for developers">Firefox 2 for developers</a></li>
+ <li><a href="/en-US/docs/Firefox_1.5_for_developers" title="Firefox 1.5 for developers">Firefox 1.5 for developers</a></li>
+</ul>
diff --git a/files/es/mozilla/firefox/releases/3/dom_improvements/index.html b/files/es/mozilla/firefox/releases/3/dom_improvements/index.html
new file mode 100644
index 0000000000..025f0676a1
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/dom_improvements/index.html
@@ -0,0 +1,36 @@
+---
+title: Mejoras DOM en Firefox 3
+slug: Mozilla/Firefox/Releases/3/DOM_improvements
+tags:
+  - DOM
+  - Firefox 3
+  - Todas_las_Categorías
+translation_of: Mozilla/Firefox/Releases/3/DOM_improvements
+original_slug: Mejoras_DOM_en_Firefox_3
+---
+<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Firefox 3 ofrece una serie de mejoras sobre el <a href="es/DOM">Modelo de Objetos del Documento (DOM)</a>, especialmente en lo que se refiere a la implementación de extensiones de DOM añadidas por otros navegadores. Este artículo proporciona una lista de estas mejoras, además de enlaces a documentación más detallada.</p>
+
+<ul>
+ <li>Ahora se implementan las extensiones de DOM <code><a href="es/DOM/element.clientTop">clientTop</a></code> y <code><a href="es/DOM/element.clientLeft">clientLeft</a></code> de Internet Explorer.</li>
+ <li>La propiedad <code><a href="es/DOM/window.fullScreen">window.fullScreen</a></code> ahora es siempre exacta, sin importar donde sea leída, incluso en el contenido. Previamente devolvía <code>false</code> erróneamente ({{ Bug(127013) }}).</li>
+ <li>Ahora se implementan las extensiones de DOM <code><a href="es/DOM/element.getClientRects">getClientRects</a></code> y <code><a href="es/DOM/element.getBoundingClientRect">getBoundingClientRect</a></code> ({{ Bug(174397) }}).</li>
+ <li>Se implementa la extensión de DOM <code><a href="es/DOM/document.elementFromPoint">elementFromPoint</a></code> de Internet Explorer ({{ Bug(199692) }}).</li>
+ <li>Ahora se implementan las extensiones de DOM <code><a href="es/DOM/element.oncut">oncut</a></code>, <code><a href="es/DOM/element.oncopy">oncopy</a></code>, <code><a href="es/DOM/element.onpaste">onpaste</a></code>, <code><a href="es/DOM/element.onbeforecut">onbeforecut</a></code>, <code><a href="es/DOM/element.onbeforepaste">onbeforecopy</a></code> y <code><a href="es/DOM/element.onbeforepaste">onbeforepaste</a></code> de Internet Explorer ({{ Bug(280959) }}).</li>
+ <li>Se han añadido capturadores para <code>Node.nodePrincipal</code>, <code>Node.baseURIObject</code>, y <code><a href="es/DOM/document.documentURIObject">document.documentURIObject</a></code> sólo para código con privilegios. El código Chrome no debe tocar (recuperar o fijar) estas propiedades en objetos de contenido sin envoltorios (por ejemplo, sobre un <code>wrappedJSObject</code> de un <code><a href="es/XPCNativeWrapper">XPCNativeWrapper</a></code>), ver {{ Bug(324464) }} para más detalles.</li>
+</ul>
+
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
+
+<ul>
+ <li><a href="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
+ <li><a href="es/Mejoras_CSS_en_Firefox_3">Mejoras CSS en Firefox 3</a></li>
+ <li><a href="es/DOM">DOM</a></li>
+</ul>
+
+<p> </p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "en": "en/DOM_improvements_in_Firefox_3", "fr": "fr/Am\u00e9liorations_DOM_dans_Firefox_3", "ja": "ja/DOM_improvements_in_Firefox_3", "pl": "pl/Poprawki_DOM_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/3/full_page_zoom/index.html b/files/es/mozilla/firefox/releases/3/full_page_zoom/index.html
new file mode 100644
index 0000000000..dee3e1f3ab
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/full_page_zoom/index.html
@@ -0,0 +1,47 @@
+---
+title: Zoom a página completa
+slug: Mozilla/Firefox/Releases/3/Full_page_zoom
+translation_of: Mozilla/Firefox/Releases/3/Full_page_zoom
+original_slug: Zoom_a_página_completa
+---
+<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }} {{ Gecko_minversion_header(1.9) }}</p>
+
+<p>El zoom a página completa (o sólo zoom completo) es una nueva característica que probablemente estará con <a href="es/Firefox_3_para_desarrolladores">Firefox 3</a>. Puedes verla en funcionamiento en las actuales "trunk builds" desde Gecko 1.9a7. Mientras no exista aún UI puedes usar JavaScript y la interface <a href="es/XPCOM">XPCOM</a> <a class="external" href="http://www.xulplanet.com/references/xpcomref/ifaces/nsIMarkupDocumentViewer.html">nsIMarkupDocumentViewer</a>.</p>
+
+<h3 id="Ejemplo_.28xul:browser.29" name="Ejemplo_.28xul:browser.29">Ejemplo (xul:browser)</h3>
+
+<p>El siguiente ejemplo demuestra su uso para la ventana de navegación que posea actualmente el foco. Este es el típico uso para una extensión de Firefox.</p>
+
+<pre>var zoom = 1.5;
+var docViewer = getBrowser().mCurrentBrowser.markupDocumentViewer;
+docViewer.fullZoom = zoom;
+</pre>
+
+<h3 id="Ejemplo_.28xul:iframe.29" name="Ejemplo_.28xul:iframe.29">Ejemplo (xul:iframe)</h3>
+
+<p>Puedes usar la característica de zoom completo incluso para un xul:iframe. Sin embargo, dado que un iframe no posee ninguna propiedad markupDocumentViewer, debemos primero obtenerla:</p>
+
+<pre>var zoom = 1.5;
+var iframe = document.getElementById("authorFrame");
+var contViewer = iframe.docShell.contentViewer;
+var docViewer = contViewer.QueryInterface(Components.interfaces.nsIMarkupDocumentViewer);
+docViewer.fullZoom = zoom;
+</pre>
+
+<h3 id="Referenc.C3.ADas" name="Referenc.C3.ADas">Referencías</h3>
+
+<ul>
+ <li>Extensión Page zoom de Ted Mielczarek <a class="external" href="http://ted.mielczarek.org/code/mozilla/fullpagezoom.xpi">fullpagezoom.xpi</a> para los últimos releases nocturnos de Firefox 3.0</li>
+ <li>El <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=4821">bug en bugzilla</a> sobre zoom completo (fullZoom).</li>
+ <li>La documentación de la interface <a class="external" href="http://www.xulplanet.com/references/xpcomref/ifaces/nsIMarkupDocumentViewer.html">nsIMarkupDocumentViewer</a> (actualmente no menciona zoom completo).</li>
+</ul>
+
+<p> </p>
+
+<div class="noinclude"> </div>
+
+<p> </p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "fr": "fr/Zoom_pleine_page", "ja": "ja/Full_page_zoom", "en": "en/Full_page_zoom" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/3/index.html b/files/es/mozilla/firefox/releases/3/index.html
new file mode 100644
index 0000000000..a46efa65b3
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/index.html
@@ -0,0 +1,284 @@
+---
+title: Firefox 3 para desarrolladores
+slug: Mozilla/Firefox/Releases/3
+tags:
+  - Firefox 3
+translation_of: Mozilla/Firefox/Releases/3
+original_slug: Firefox_3_para_desarrolladores
+---
+<div>{{FirefoxSidebar}}</div><p>Si eres un desarrollador que intenta ponerse al día con todas las nuevas características de Firefox 3, este es el lugar perfecto para empezar. Este artículo proporciona una lista de nuevos artículos que tratan sobre las características añadidas a Firefox 3. Aunque no cubre necesariamente todos los pequeños cambios, te ayudará a conocer mejor las mejoras más importantes.</p>
+
+<p> </p>
+
+<h3 id="Caracter.C3.ADsticas_nuevas_para_desarrolladores_en_Firefox_3" name="Caracter.C3.ADsticas_nuevas_para_desarrolladores_en_Firefox_3">Características nuevas para desarrolladores en Firefox 3</h3>
+
+<h4 id="Para_desarrolladores_de_sitios_y_aplicaciones_web" name="Para_desarrolladores_de_sitios_y_aplicaciones_web">Para desarrolladores de sitios y aplicaciones web</h4>
+
+<dl>
+ <dt><a href="/es/Actualizar_aplicaciones_web_para_Firefox_3" title="es/Actualizar_aplicaciones_web_para_Firefox_3">Actualizar aplicaciones web para Firefox 3</a></dt>
+ <dd>Información sobre los cambios que se podrían necesitar para realizar un sitio o aplicación web y sacarle mayor ventaja a las nuevas características de Firefox 3.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Eventos_online_y_offline" title="es/Eventos_online_y_offline">Eventos online y offline</a></dt>
+ <dd>Firefox 3 implementa los eventos conectado y desconectado definidos por WHATWG, que permiten a aplicaciones y extensiones descubrir si una conexión activa de internet es disponible, además de detectar cuando hay conexión o desconexión.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/DOM/window.navigator.registerProtocolHandler" title="es/DOM/window.navigator.registerProtocolHandler">Manipuladores de protocolo web</a></dt>
+ <dd>Ahora se puede registrar una aplicación web como manipulador de protocolo con el método <code>navigator.registerProtocolHandler()</code>.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Dibujar_texto_usando_canvas" title="es/Dibujar_texto_usando_canvas">Dibujar texto usando canvas</a></dt>
+ <dd>Ahora se puede dibujar texto en canvas con una API no estándar implementada por Firefox 3.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Tutorial_de_Canvas/Transformaciones#Transformaciones" title="es/Tutorial_de_Canvas/Transformaciones#Transformaciones">Gestión de transformaciones en canvas</a></dt>
+ <dd>Firefox 3 administra los métodos <code>transform()</code> y <code>setTransform()</code> en canvases (lienzos).</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/El_uso_de_microformatos" title="es/El_uso_de_microformatos">El uso de microformatos</a></dt>
+ <dd>Firefox 3 tiene APIs que permiten trabajar con microformatos.</dd>
+</dl>
+
+<p><span class="comment">;<a href="/es/Hojas_de_estilo_alternativas">Hojas de estilo alternativas</a> :Firefox 3 implementa modelos alternativos de hojas de estilo API de objeto CSS.</span></p>
+
+<dl>
+ <dt><a href="/es/Eventos_arrastrar_y_soltar" title="es/Eventos_arrastrar_y_soltar">Eventos arrastrar y soltar</a></dt>
+ <dd>Firefox 3 implementa nuevos eventos que se envían al nodo de origen cuando la operación de arrastre comienza y termina.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Gestión_del_foco_en_HTML" title="es/Gestión_del_foco_en_HTML">Gestión del foco en HTML</a></dt>
+ <dd>Se han implementado los atributos <code>activeElement</code> y <code>hasFocus</code> de la nueva especificación HTML 5.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Recursos_en_modo_desconectado_en_Firefox" title="es/Recursos_en_modo_desconectado_en_Firefox">Recursos en modo desconectado en Firefox</a></dt>
+ <dd>Firefox 3 permite ahora que las aplicaciones web soliciten que recursos puedan ser puestos en cache para ser ejecutados en modo desconectado.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Mejoras_CSS_en_Firefox_3" title="es/Mejoras_CSS_en_Firefox_3">Mejoras CSS en Firefox 3</a></dt>
+ <dd>Firefox 3 ofrece un número de mejoras en su implementación de CSS.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Mejoras_DOM_en_Firefox_3" title="es/Mejoras_DOM_en_Firefox_3">Mejoras DOM en Firefox 3</a></dt>
+ <dd>Firefox 3 ofrece mejoras en la implementación de DOM, incluyendo la gestión de varias extensiones de Internet Explorer al DOM.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Novedades_en_JavaScript_1.8" title="es/Novedades_en_JavaScript_1.8">Implementación de JavaScript 1.8</a></dt>
+ <dd>Firefox 3 ofrece JavaScript 1.8.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/EXSLT" title="es/EXSLT">Implementación de EXSLT</a></dt>
+ <dd>Firefox 3 permite la utilización de una parte importante de las extensiones <a href="/es/EXSLT" title="es/EXSLT">EXSLT</a> y <a href="/es/XSLT" title="es/XSLT">XSLT</a>.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Mejoras_SVG_en_Firefox_3" title="es/Mejoras_SVG_en_Firefox_3">Mejoras SVG en Firefox 3</a></dt>
+ <dd>La implementación a SVG en Firefox 3 ha sido mejorada de manera significante, con muchos nuevos filtros, elementos, atributos y otras mejoras.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Gráficos_PNG_animados" title="es/Gráficos_PNG_animados">Gráficos PNG animados</a></dt>
+ <dd>Firefox 3 administra las imágenes animadas en formato PNG (APNG).</dd>
+</dl>
+
+<h4 id="Para_desarrolladores_de_XUL_y_de_extensiones" name="Para_desarrolladores_de_XUL_y_de_extensiones">Para desarrolladores de XUL y de extensiones</h4>
+
+<h5 id="Cambios_y_mejoras_notables" name="Cambios_y_mejoras_notables">Cambios y mejoras notables</h5>
+
+<dl>
+ <dt><a href="/es/Actualizar_extensiones_para_Firefox_3" title="es/Actualizar_extensiones_para_Firefox_3">Actualizar extensiones para Firefox 3</a></dt>
+ <dd>Una guía con las cosas que hay que hacer para poner al día una extensión para que trabaje con Firefox 3.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Mejoras_XUL_en_Firefox_3" title="es/Mejoras_XUL_en_Firefox_3">Mejoras XUL en Firefox 3</a></dt>
+ <dd>Firefox 3 ofrece varios nuevos elementos XUL, incluyendo escaleras deslizables, selectores de hora y fecha, y botones de incremento.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Plantillas_en_Firefox_3" title="es/Plantillas_en_Firefox_3">Plantillas en Firefox 3</a></dt>
+ <dd>Las plantillas han sido notablemente mejoradas en Firefox 3. Las mejoras más importantes es la posibilidad de usar procesadores de solicitud personalizada para permitir el uso de otras fuentes de datos que RDF.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Versionado,_actualización_y_compatibilidad_de_extensiones#Asegurando_las_actualizaciones" title="es/Versionado,_actualización_y_compatibilidad_de_extensiones#Asegurando_las_actualizaciones">Asegurando las actualizaciones</a></dt>
+ <dd>Para proporcionar actualizaciones más seguras de los complementos a los usuarios, ahora los complementos requieren proporcionar un método seguro para obtener las actualizaciones antes de ser instaladas. Los complementos alojados en <a class="external" href="http://addons.mozilla.org">AMO</a> lo proporcionan automáticamente.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Migrar_y_usar_el_catálogo" title="es/Migrar_y_usar_el_catálogo">Migrar y usar el catálogo</a></dt>
+ <dd>Un artículo sobre como migrar una extensión existente para utilizar el API de catálogo.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Mejoras_en_el_administrador_de_descargas_en_Firefox_3" title="es/Mejoras_en_el_administrador_de_descargas_en_Firefox_3">Mejoras en el gestor de descargas en Firefox 3</a></dt>
+ <dd>El administrador de descargas de Firefox 3 contiene nuevas y mejoradas APIs, incluyendo la implementación de múltiples escuchas de progreso.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Uso_de_nsILoginManager" title="es/Uso_de_nsILoginManager">Uso de nsILoginManager</a></dt>
+ <dd>El administrador de contraseñas ha sido reemplazado por el nuevo Login Manager.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/XBL/Referencia_de_XBL_1.0/Elementos#binding" title="es/XBL/Referencia_de_XBL_1.0/Elementos#binding">Integración de los vínculos XBL</a></dt>
+ <dd>Ya es posible utilizar el protocolo URL <code>data:</code> para integrar directamente los vínculos XBL en lugar de tener que colocarlos en un archivo XML por separado.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Traducir_las_descripciones_de_las_extensiones" title="es/Traducir_las_descripciones_de_las_extensiones">Traducir las descripciones de las extensiones</a></dt>
+ <dd>Firefox 3 ofrece un nuevo método localizando add-on metadata. Esto permite que los detalles localizados estén disponibles tan pronto como los add-on han sido descargados, al igual que cuando el add-on sea desinstalado.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Localización_y_Plurales" title="es/Localización_y_Plurales">Localización y plurales</a></dt>
+ <dd>Firefox 3 dispone del nuevo módulo PluralForm, el cual sirve para ayudar a poner correctamente en plural las palabras según el idioma local.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Cambios_en_los_temas_de_Firefox_3" title="es/Cambios_en_los_temas_de_Firefox_3">Cambios en los temas de Firefox 3</a></dt>
+ <dd>Notas e información para quienes quisiera crear temas para Firefox 3.</dd>
+</dl>
+
+<h5 id="Nuevos_componentes_y_funcionalidades" name="Nuevos_componentes_y_funcionalidades">Nuevos componentes y funcionalidades</h5>
+
+<dl>
+ <dt><a href="/es/FUEL" title="es/FUEL">Biblioteca FUEL</a></dt>
+ <dd>FUEL sirve para facilitar la productividad de los desarrolladores de extensiones, reduciendo algunas formalidades de XPCOM y colocando algunas ideas "modernas" en JavaScript.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Catálogo" title="es/Catálogo">Catálogo</a></dt>
+ <dd>Las APIS del historial y de los marcadores han sido remplazadas completamente por la nueva API del <a href="/es/Catálogo" title="es/Catálogo">Catálogo</a>.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/nsIIdleService" title="es/nsIIdleService">Servicio idle</a></dt>
+ <dd>Firefox 3 ofrece la nueva interfaz {{ Interface("nsIIdleService") }}, la cual permite a las extensiones determinar cuánto tiempo ha pasado desde que el usuario pulso una tecla o movió el ratón por última vez.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/El_convertidor_ZIP" title="es/El_convertidor_ZIP">El convertidor ZIP</a></dt>
+ <dd>La nueva interfaz <code>nsIZipWriter</code> permite a las extensiones crear archivos ZIP.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Zoom_a_página_completa" title="es/Zoom_a_página_completa">Zoom a página completa</a></dt>
+ <dd>Firefox 3 mejora la experiencia de usuario ofreciendo zoom a página completa además de zoom de solo texto.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/El_colector_de_ciclo_XPCOM" title="es/El_colector_de_ciclo_XPCOM">El colector de ciclo XPCOM</a></dt>
+ <dd>El código XPCOM puede beneficiarse del colector de ciclo, el cual ayuda a asegurar que la memoria no utilizada es liberada y evitar fugas de memoria.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/El_administrador_de_hilos" title="es/El_administrador_de_hilos">El administrador de hilos</a></dt>
+ <dd>Firefox 3 proporciona la nueva interfaz {{ Interface("nsIThreadManager") }}, así como otras nuevas interfaces para hilos y eventos de hilos, los cuales proporcionan una manera apropiada de crear y administrar hilos en tu código.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Módulos_JavaScript" title="es/Módulos_JavaScript">Módulos JavaScript</a></dt>
+ <dd>Firefox 3 ofrece un nuevo mecanismo de código compartido que te permite crear módulos facilmente en JavaScript que pueden ser cargados por extensiones y aplicaciones para su uso, muy parecido a las librerías compartidas.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/NsIJSON" title="es/NsIJSON">La interfaz nsIJSON</a></dt>
+ <dd>Firefox 3 ofrece la nueva interface {{ Interface("nsIJSON") }}, which offers high-performance encoding and decoding of JSON strings.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/NsIParentalControlsService" title="es/NsIParentalControlsService">La interfaz nsIParentalControlsService</a></dt>
+ <dd>Ahora Firefox 3 implementa las características del control parental de Microsoft Windows Vista, y permite al cñodigo interactuar con él.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Usar_las_preferencias_de_contenido" title="es/Usar_las_preferencias_de_contenido">Usar las preferencias de contenido</a></dt>
+ <dd>Firefox 3 incluye un nuevo servicio para obtener y fijar configuraciones especificas para cada sitio web que pueden usar tanto las extensiones como el código principal para llevar un registro de las preferencias de usuarios en sitios individuales.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/es/Vigilancia_de_plugins" title="es/Vigilancia_de_plugins">Vigilancia de plugins</a></dt>
+ <dd>Está disponible un nuevo componente del sistema de plugins para controlar el tiempo que les toma a los plugins (como por ejemplo: Macromedia Flash) ejecutar sus llamadas.</dd>
+</dl>
+
+<h3 id="Bugs_ya_solucionados" name="Bugs_ya_solucionados">Bugs ya solucionados</h3>
+
+<dl>
+ <dt><a href="/es/Bugs_importantes_solucionados_en_Firefox_3" title="es/Bugs_importantes_solucionados_en_Firefox_3">Bugs importantes solucionados en Firefox 3</a></dt>
+</dl>
+
+<h3 id="Nuevas_caracter.C3.ADsticas_para_el_usuario_final" name="Nuevas_caracter.C3.ADsticas_para_el_usuario_final">Nuevas características para el usuario final</h3>
+
+<h4 id="Mejoras_para_el_usuario" name="Mejoras_para_el_usuario">Mejoras para el usuario</h4>
+
+<ul>
+ <li><strong>Gestión más sencilla de contraseñas.</strong> En la parte superior de la ventana del navegador aparece una barra de información que permitirá guardar las contraseñas después de iniciar la sesión.</li>
+ <li><strong>Instalación simplificada de complementos.</strong> Ahora, instalar extensiones de terceros se hace en menos pasos porque se ha eliminado el filtro de los sitios de confianza para la descarga de complementos.</li>
+ <li><strong>Nuevo administrador de descargas.</strong> El administrador de descargas facilita el acceso a los archivos descargados.</li>
+ <li><strong>Reanudar descargas.</strong> Podemos reanudar las descargas al reiniciar el navegador o la conexión a la red.</li>
+ <li><strong>Vista a pantalla completa.</strong> Podemos aumentar o reducir el tamaño de todo el contenido de la página desde el menú Ver o con los atajos de teclado. Estas modificaciones de tamaño se aplicarán tanto al texto como a las imágenes.</li>
+ <li><strong>Desplazamiento y menú rápido de pestañas.</strong> Las pestañas son más fáciles de identificar gracias a su nueva característica de desplazamiento y menú rápido.</li>
+ <li><strong>Guardar lo que estamos haciendo.</strong> En Firefox 3, una ventana emergente nos preguntará si queremos guardar las pestañas abiertas antes de cerrar.</li>
+ <li><strong>Comportamiento de la opción "Abrir en pestañas".</strong> Al abrir una carpeta de marcadores en pestañas, las pestañas nuevas no sustituyen a las que están abiertas sino que se suman a ellas.</li>
+ <li><strong>Barra de direcciones y de búsquedas más simples de dimensionar.</strong> Modificar el tamaño de la barra de dirección y de búsquedas se hace fácilmente con el icono que aparece entre ellas.</li>
+ <li><strong>Mejoras en la selección de texto.</strong> Podemos seleccionar varias secciones de texto con la tecla Control 'Ctrl' (Comando en Macintosh), un doble clic y arrastrar lo hará palabra por palabra y un triple clic agarrará un párrafo entero.</li>
+ <li><strong>Barra de búsqueda.</strong> La barra de búsqueda funciona también sobre la selección actual.</li>
+ <li><strong>Administración de plugins.</strong> El usuario puede deshabilitar el o los plugins que desea en el administrador de complementos.</li>
+ <li><strong>Integración con Windows Vista.</strong> Los menús de Firefox se muestran utilizando el tema nativo de Vista.</li>
+ <li><strong>Integración con Mac OS X.</strong> Firefox 3 utiliza el corrector ortográfico de Mac OS X y permite usar <a class="external" href="http://growl.info/">Growl</a> para la notificación de descargas completadas y actualizaciones disponibles.</li>
+ <li><strong>Botón estrella.</strong> El nuevo botón con forma de estrella en la barra de direcciones añade un marcador nuevo con un solo clic, un segundo clic permite ordenar y etiquetarlo.</li>
+ <li><strong>Etiquetas.</strong> Permiten clasificar los marcadores por temas asignándoles palabras clave.</li>
+ <li><strong>Barra de búsqueda local y autocompletado.</strong> Sirve para buscar una página en el historial y los marcadores. Lo iconos, marcadores y etiquetas permiten ver la ubicación de los resultados mostrados.</li>
+ <li><strong>Carpeta de marcadores inteligentes.</strong> La carpeta de marcadores inteligentes de Firefox permite acceder rápidamente a los últimos sitios etiquetados o añadidos a marcadores, así como las páginas visitadas con frecuencia.</li>
+ <li><strong>Administrador de marcadores e historial.</strong> La creación de un único administrador para los marcadores y el historial permite buscar en ambos con múltiples vistas y carpetas inteligentes para almacenar búsquedas frecuentes.</li>
+ <li><strong>Administradores de protocolos Web.</strong> Las aplicaciones web, como los proveedores de correo electrónico, se pueden utilizar en vez de aplicaciones de escritorio para administrar los enlaces <code>mailto:</code> de otras webs. También se prestan gestiones similares para otros protocolos. (Aviso: las aplicaciones Web deben estar registradas en Firefox para que funcione).</li>
+ <li><strong>Acciones de descarga fáciles de usar.</strong> El nuevo panel de preferencias de aplicaciones proporciona una interfaz de usuario mejorada para configurar los administradores de varios tipos de archivos y esquemas de protocolo.</li>
+ <li><strong>Apariencia y entorno mejorados.</strong> La gestión gráfica y de las fuentes ha sido mejorada para que las páginas web se vean con más calidad, incluidas la nitidez del texto y la mayor compatibilidad con fuentes complejas. Además, gracias a este nuevo aspecto de Firefox, los usuarios de Mac y Linux (Gnome) lo encontrarán más parecido a una aplicación nativa de su propio sistema.</li>
+ <li><strong>Gestión del color.</strong> Al establecer la preferencia <code>gfx.color_management.enabled</code> en <code>about:config</code>, haremos que Firefox utilice los perfiles de color integrados en las imágenes para que se adapten a la configuración de nuestra pantalla.</li>
+ <li><strong>Funcionamiento en modo desconectado.</strong> Las aplicaciones Web pueden beneficiarse de nuevas características que permiten utilizarlas sin estar conectado a Internet.</li>
+</ul>
+
+<h4 id="Seguridad_y_privacidad" name="Seguridad_y_privacidad">Seguridad y privacidad</h4>
+
+<ul>
+ <li><strong>Información con un clic.</strong> ¿Quiere tener más información sobre el sitio Web que estás visitando? Haciendo clic en el icono del sitio en la barra de direcciones veremos a quién pertenece. La información de identificación se muestra de forma clara y es más fácil de entender que nunca.</li>
+ <li><strong>Protección contra malware.</strong> Firefox 3 avisa cuando se entra en una Web que instala virus, spyware, troyanos, u otro software peligroso (conocido como malware). Puede ver un ejemplo <a class="link-https" href="https://www.mozilla.com/firefox/its-an-attack.html">aquí</a>.</li>
+ <li><strong>Protección mejorada contra páginas Web que intentan suplantar tu identidad.</strong> Cuando visite una página sospechosa de suplantación se mostrará en su lugar una página especial con una advertencia. Puede ver un ejemplo <a class="link-https" href="https://www.mozilla.com/firefox/its-a-trap.html">aquí</a>.</li>
+ <li><strong>Mensajes de error SSL fáciles de entender.</strong> Ahora cuando aparezca un mensaje de error por certificado SSL incorrecto comprenderá más fácil en qué consiste el problema.</li>
+ <li><strong>Protección contra complementos desactualizados.</strong> Firefox 3 comprueba automáticamente los plugins y complementos, deshabilitando las versiones más antiguas y peligrosas.</li>
+ <li><strong>Actualizaciones seguras de complementos.</strong> Se ha mejorado la seguridad en la actualización de complementos al obligarlos a proporcionar un mecanismo seguro de actualización.</li>
+ <li><strong>Integración con antivirus.</strong> Firefox 3 envía un informe al antivirus cuando se descargan archivos ejecutables.</li>
+ <li><strong>Compatible con el control paterno de Windows Vista.</strong> Firefox 3 es compatible con la función para deshabilitar la descarga de archivos del control paterno de Vista.</li>
+</ul>
+
+<h4 id="Rendimiento" name="Rendimiento">Rendimiento</h4>
+
+<ul>
+ <li><strong>Fiabilidad.</strong> Firefox 3 almacena marcadores, historial, cookies, y preferencias usando un formato transaccional de base de datos seguro. Es decir, tus datos no se perderán aunque tengas una caída del sistema.</li>
+ <li><strong>Velocidad.</strong> Se ha mejorado el rendimiento de Firefox 3 al sustituir totalmente la parte del software que controla el aspecto gráfico, así como el modo de gestionar los formatos de página.</li>
+ <li><strong>Reducción de consumo de memoria.</strong> Firefox 3 es más eficaz que nunca gracias a la corrección de unos 300 fallos de fuga de memoria y nuevas características que ayudan a localizar y eliminar automáticamente los bloques con fuga de memoria.</li>
+</ul>
+
+<h3 id="Lecturas_relacionadas" name="Lecturas_relacionadas">Lecturas relacionadas</h3>
+
+<ul>
+ <li><a href="/es/Actualizar_extensiones_para_Firefox_3" title="es/Actualizar_extensiones_para_Firefox_3">Actualizar extensiones para Firefox 3</a></li>
+ <li><a href="/es/Actualizar_aplicaciones_web_para_Firefox_3" title="es/Actualizar_aplicaciones_web_para_Firefox_3">Actualizar aplicaciones web para Firefox 3</a></li>
+ <li><a href="/es/Firefox_2_para_desarrolladores" title="es/Firefox_2_para_desarrolladores">Firefox 2 para desarrolladores</a></li>
+ <li><a href="/es/Firefox_1.5_para_Desarrolladores" title="es/Firefox_1.5_para_Desarrolladores">Firefox 1.5 para Desarrolladores</a></li>
+</ul>
+
+<p> </p>
+
+<p>{{ languages( { "en": "en/Firefox_3_for_developers", "fr": "fr/Firefox_3_pour_les_d\u00e9veloppeurs", "ja": "ja/Firefox_3_for_developers", "ko": "ko/Firefox_3_for_developers", "pl": "pl/Firefox_3_dla_programist\u00f3w", "pt": "pt/Firefox_3_para_desenvolvedores", "zh-tw": "zh_tw/Firefox_3_for_developers" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/3/notable_bugs_fixed/index.html b/files/es/mozilla/firefox/releases/3/notable_bugs_fixed/index.html
new file mode 100644
index 0000000000..51660068f7
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/notable_bugs_fixed/index.html
@@ -0,0 +1,40 @@
+---
+title: Bugs importantes solucionados en Firefox 3
+slug: Mozilla/Firefox/Releases/3/Notable_bugs_fixed
+tags:
+  - Firefox 3
+translation_of: Mozilla/Firefox/Releases/3/Notable_bugs_fixed
+original_slug: Bugs_importantes_solucionados_en_Firefox_3
+---
+<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Este artículo es una lista de correcciones importantes de errores en Firefox 3 que no resultan obvios en la documentación.</p>
+
+<ul>
+ <li>Si ocurre un error mientras se analiza un overlay, el overlay no se aplica. Los errores del análisis se registran en la consola de errores. ({{ Bug(335755) }})</li>
+ <li>Error corregido en el que los elementos '<code>&lt;menupopup&gt;</code>' pueden colocarse dentro de un contenedor cuando se adjuntan en un elemento menú o de tipo menú. ({{ Bug(345896) }})</li>
+ <li>La propiedad '<code>dlgType</code>' de botones funciona correctamente. ({{ Bug(308591) }})</li>
+ <li>El argumento '<code>canBubble</code>' de <a href="es/DOM/event.initEvent">event.initEvent</a> funciona correctamente de manera que los eventos pueden ser llamados sin que se hagan recurrentes. ({{ Bug(330190) }})</li>
+ <li>El evento '<code>DOMAttrModified</code>' maneja correctamente atributos con nombres con espacio. ({{ Bug(362391) }})</li>
+ <li>Las instrucciones de procesamiento XML, tal como '<code>&lt;?xml-stylesheet ?&gt;</code>', se han agregado al DOM de documentos XUL. Lo que significa que no está garantizado que <a href="es/DOM/document.firstChild">document.firstChild</a> sea el elemento raíz, en su lugar utiliza <a href="es/DOM/document.documentElement">document.documentElement</a>. Por otro lado las instrucciones de procesamiento '<code>&lt;?xml-stylesheet ?&gt;</code>' y '<code>&lt;?xul-overlay ?&gt;</code>' ya no tienen efecto fuera del prólogo del documento. ({{ Bug(319654) }})</li>
+ <li>Las funciones '<code>getElementsByAttributeNS()</code>' se han añadido a los elementos y documentos XUL. ({{ Bug(239976) }})</li>
+ <li>Los escuchadores de eventos se mantienen cuando se mueve o se quita un elemento de un documento XUL. ({{ Bug(286619) }})</li>
+ <li>Los eventos de mutación se disparan para documentos no mostrados. ({{ Bug(201236) }})</li>
+ <li>Corregidos varios problemas con elementos de dibujo en orden equivocado. ({{ Bug(317375) }})</li>
+ <li>Se ha corregido <code><a href="es/DOM/element.getElementsByTagName">getElementsByTagName()</a></code> para que funcione correctamente en sub-árboles que tienen elementos con prefijos en los nombres de las etiquetas. ({{ Bug(206053) }}).</li>
+ <li>Los eventos '<code>DOMNodeInserted</code>' y '<code>DOMNodeRemoved</code>' se aplican correctamente a los nodos apropiados ({{ Bug(367164) }}).</li>
+ <li>La expresión '<code>\d</code>', uno de los caracteres especiales usados en expresiones regulares, ha sido corregida para que concuerde sólo con dígitos del alfabeto latino (equivalente a <code>{{ mediawiki.external('0-9') }}</code>). ({{ Bug(378738) }})</li>
+ <li>La categoría 'image-sniffing-services' permite que un descodificador de imágenes implementado como una extensión, descodifique correctamente imágenes enviadas con un tipo MIME incorrecto. ({{ Bug(391667) }})</li>
+</ul>
+
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
+
+<ul>
+ <li><a href="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
+</ul>
+
+<p> </p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "en": "en/Notable_bugs_fixed_in_Firefox_3", "fr": "fr/Bugs_importants_corrig\u00e9s_dans_Firefox_3", "ja": "ja/Notable_bugs_fixed_in_Firefox_3", "pl": "pl/Istotne_b\u0142\u0119dy_poprawione_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/3/svg_improvements/index.html b/files/es/mozilla/firefox/releases/3/svg_improvements/index.html
new file mode 100644
index 0000000000..66be9d4961
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/svg_improvements/index.html
@@ -0,0 +1,63 @@
+---
+title: Mejoras SVG en Firefox 3
+slug: Mozilla/Firefox/Releases/3/SVG_improvements
+tags:
+  - Firefox 3
+  - SVG
+  - Todas_las_Categorías
+translation_of: Mozilla/Firefox/Releases/3/SVG_improvements
+original_slug: Mejoras_SVG_en_Firefox_3
+---
+<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Firefox 3 ofrece una mejor implementación de <a href="es/SVG">Gráficos Vectoriales Escalables (SVG)</a> en comparación con versiones anteriores de Firefox. Aunque estas características están documentadas en otros sitios, este artículo puede servir como una lista que indique fácilmente qué características se han añadido en Firefox 3.</p>
+
+<ul>
+ <li>Se ha implementado el elemento <code>foreignObject</code> ({{ Bug(326966) }}). Vea la <a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">especificación</a> o <a class="external" href="http://weblogs.mozillazine.org/roc/archives/2006/06/the_future_is_now.html">este artículo</a> para más detalles.</li>
+ <li>Implementado el elemento <code>pattern</code> (<a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">especificación</a>).</li>
+ <li>Implementado el elemento <code>mask</code> (<a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">especificación</a>).</li>
+ <li>Implementados nuevos filtros (<a class="external" href="http://www.w3.org/TR/SVG11/filters.html">especificación</a>):
+  <ul>
+   <li><code>filter</code></li>
+   <li><code>feDistantLight</code></li>
+   <li><code>fePointLight</code></li>
+   <li><code>feSpotLight</code></li>
+   <li><code>feBlend</code></li>
+   <li><code>feColorMatrix</code></li>
+   <li><code>feConvolveMatrix</code></li>
+   <li><code>feComponentTransfer</code>, <code>feFuncR</code>, <code>feFuncG</code>, <code>feFuncB</code>, <code>feFuncA</code></li>
+   <li><code>feComposite</code></li>
+   <li><code>feConvolveMatrix</code></li>
+   <li><code>feDiffuseLighting</code></li>
+   <li><code>feDistantLight</code></li>
+   <li><code>feFlood</code></li>
+   <li><code>feGaussianBlur</code></li>
+   <li><code>feMerge</code>, <code>feMergeNode</code></li>
+   <li><code>feMorphology</code></li>
+   <li><code>feOffset</code></li>
+   <li><code>fePointLight</code></li>
+   <li><code>feSpecularLighting</code></li>
+   <li><code>feTurbulence</code></li>
+   <li><code>feTile</code></li>
+  </ul>
+ </li>
+ <li>Se han arreglado varios fallos en la manipulación del elemento <code>&lt;a&gt;</code> en SVG; ver {{ Bug(267664) }}, {{ Bug(268135) }}, {{ Bug(316248) }}, {{ Bug(317270) }} y {{ Bug(320724) }}.</li>
+ <li>Se han implementado los métodos de DOM en SVG <code>getNumberOfChars()</code>, <code>getComputedTextLength()</code>, <code>getSubStringLength()</code>, <code>getStartPositionOfChar()</code>, <code>getEndPositionOfChar()</code>, <code>getRotationOfChar()</code> y <code>getCharNumAtPosition()</code>.</li>
+ <li>Implementación del atributo <code>xml:space</code> (<a class="external" href="http://www.w3.org/TR/SVG/text.html#WhiteSpace">especificación</a>).</li>
+ <li>Se ha implementado el comportamiento por defecto de <code>fill</code>/<code>stroke</code> (<a class="external" href="http://www.w3.org/TR/SVG/painting.html#SpecifyingPaint">especificación</a>).</li>
+ <li>Se implementan ya las unidades <code>em</code> y <code>ex</code> para indicar longitudes ({{ Bug(305859) }}).</li>
+</ul>
+
+<h3 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h3>
+
+<ul>
+ <li><a href="es/SVG">SVG</a></li>
+ <li><a href="es/SVG_en_Firefox">SVG en Firefox</a></li>
+ <li><a href="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
+</ul>
+
+<p> </p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "en": "en/SVG_improvements_in_Firefox_3", "fr": "fr/Am\u00e9liorations_SVG_dans_Firefox_3", "ja": "ja/SVG_improvements_in_Firefox_3", "pl": "pl/Poprawki_SVG_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/3/templates/index.html b/files/es/mozilla/firefox/releases/3/templates/index.html
new file mode 100644
index 0000000000..1cba453e1e
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/templates/index.html
@@ -0,0 +1,28 @@
+---
+title: Plantillas en Firefox 3
+slug: Mozilla/Firefox/Releases/3/Templates
+tags:
+  - Firefox 3
+translation_of: Mozilla/Firefox/Releases/3/Templates
+original_slug: Plantillas_en_Firefox_3
+---
+<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Las plantillas se han mejorado enormemente en Firefox 3. La mejora más importante permite el uso de <a href="/es/Cómo_implementar_un_componente_procesador_de_consultas_XUL" title="es/Cómo_implementar_un_componente_procesador_de_consultas_XUL">procesador de consultas personalizado</a> para manejar otro tipo de fuentes de datos además de RDF. Esto es posible gracias a la nueva sintaxis de consultas. También se incluyen soporte para SQL (<a href="/es/Almacenamiento" title="es/Almacenamiento">mozStorage</a>) y fuentes de datos XML. Ya {{ interwiki('wikimo', 'XUL:Template_Features_in_1.9', 'está disponible') }} una descripción completa de las nuevas características para plantillas. ({{ Bug(285631) }})</p>
+
+<h3 id="Otras_mejoras" name="Otras_mejoras">Otras mejoras</h3>
+
+<ul>
+ <li>Se han añadido condiciones relacionales para que los resultados encontrados cumplan la norma con una mayor exactitud. Esto permite, por ejemplo, que se encuentren resultados que empiecen o terminen con determinados hilos, o que son antes o después otros valores.</li>
+ <li>Se ha incluido una bandera, <code>dont-recurse</code>, para evitar que se repitan resultados generados tan solo a un nivel.</li>
+ <li>Se han añadido APIs al editor de plantillas para recuperar un objeto de resultado que representa un dato externo.</li>
+ <li>Se ha mejorado el servicio tipo XUL <a href="/es/XUL/Guía_de_plantillas/Ordenar_resultados" title="es/XUL/Guía_de_plantillas/Ordenar_resultados">clasificando</a> mejor tanto el árbol de contenido como el de sin contenido. También permite clasificar contenidos de plantillas no editables.({{ Bug(335122) }})</li>
+</ul>
+
+<h3 id="V.C3.A9ase_tambi.C3.A9n" name="V.C3.A9ase_tambi.C3.A9n">Véase también</h3>
+
+<ul>
+ <li><a href="/es/Firefox_3_para_desarrolladores" title="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
+</ul>
+
+<p>{{ languages( { "en": "en/Templates_in_Firefox_3", "fr": "fr/Templates_dans_Firefox_3", "ja": "ja/Templates_in_Firefox_3" } ) }}</p>
diff --git a/files/es/mozilla/firefox/releases/3/updating_extensions/index.html b/files/es/mozilla/firefox/releases/3/updating_extensions/index.html
new file mode 100644
index 0000000000..4c50f8aabc
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/updating_extensions/index.html
@@ -0,0 +1,162 @@
+---
+title: Actualizar extensiones para Firefox 3
+slug: Mozilla/Firefox/Releases/3/Updating_extensions
+tags:
+  - Firefox 3
+translation_of: Mozilla/Firefox/Releases/3/Updating_extensions
+original_slug: Actualizar_extensiones_para_Firefox_3
+---
+<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Este artículo ofrece información que será de utilidad para desarrolladores que deseen actualizar sus extensiones, para que éstas funcionen correctamente con Firefox 3.<br>
+ <br>
+ Antes de continuar, queremos sugerirte algo: si el único cambio que requiere tu extensión es modificar el campo maxVersion en el manifiesto de instalación, la extensión está disponible en el servidor <a class="link-https" href="https://addons.mozilla.org/es-ES/firefox/" title="https://addons.mozilla.org/es-ES/firefox/">addons.mozilla.org</a> y ¡no necesitarás actualizar tu extensión a una nueva versión! Simplemente usa el Panel de Control para desarrolladores en AMO para modificar <code>maxVersion</code>. De esta manera, puedes evitar el trabajo de tener que volver a revisar tu extensión.</p>
+
+<p> </p>
+
+<h3 id="1er_paso:_Actualiza_el_manifiesto_de_instalaci.C3.B3n" name="1er_paso:_Actualiza_el_manifiesto_de_instalaci.C3.B3n">Paso 1: Actualiza el manifiesto de instalación</h3>
+
+<p>El primer paso —y para la mayoría de las extensiones, el único que será necesario— es actualizar el archivo <code>install.rdf</code> dentro del <a href="/es/Manifiesto_de_instalaci%C3%B3n" title="es/Manifiesto_de_instalación">manifiesto de instalación</a> para indicar la compatibilidad con Firefox 3.</p>
+
+<p>Sólo debes buscar la línea que indica la máxima versión compatible de Firefox, lo que para Firefox 2, probablemente sea:</p>
+
+<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;2.0.*&lt;/em:maxVersion&gt;</span>
+</pre>
+
+<p>Cámbiala para indicar compatibilidad con Firefox 3:</p>
+
+<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;3.0.*&lt;/em:maxVersion&gt;</span>
+</pre>
+
+<p>A continuación, reinstala la extensión.</p>
+
+<p>Recuerda que en Firefox 3 no necesitas incluir el ".0" extra en el número de la versión. Por lo tanto, en lugar de escribir "3.0.0.*", sólo necesitas usar "3.0.*".</p>
+
+<p>Ha habido (y continuará habiendo) una serie de cambios en las APIs, lo que muy probablemente averiará algunas extensiones. Aún estamos trabajando para confeccionar una lista completa de estos cambios.</p>
+
+<p>Si tu extensión todavía usa un script <code><a href='\"es/Install.js\"'>Install.js</a></code> en vez de un <a href='\"es/Manifiesto_de_instalaci%c3%b3n\"'>manifiesto de instalación</a>, necesitas hacer la transición a un manifiesto de instalación lo más pronto posible. Firefox 3 no implementará el script <code>install.js</code> en documentos XPI.</p>
+
+<h4 id="A.C3.B1ade_descripciones_al_manifiesto_de_instalaci.C3.B3n" name="A.C3.B1ade_descripciones_al_manifiesto_de_instalaci.C3.B3n">Agregar localizaciones al manifiesto de instalación</h4>
+
+<p>Firefox 3 cuenta con tres nuevas propiedades en el manifiesto de instalación para especificar descripciones de localización. Los métodos antiguos todavía funcionan. Sin embargo, los nuevos permiten que Firefox escoja la localización, aún cuando la extensión esté deshabilitada o pendiente de instalación. Visita <a href="/es/Traducir_las_descripciones_de_las_extensiones" title="es/Traducir_las_descripciones_de_las_extensiones">Localizar las_descripciones_de_las_extensiones</a> para más detalles.</p>
+
+<h3 id="2do_paso:_Aseg.C3.BArese_de_proveer_actualizaciones_seguras" name="2do_paso:_Aseg.C3.BArese_de_proveer_actualizaciones_seguras">Paso 2: Asegúrate de suministrar actualizaciones seguras</h3>
+
+<p>Si suministras extensiones por tu propia cuenta y no usas un proveedor de hosting seguro como <a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a>, debes asegurarte de suministrar algún método seguro para la actualización de tus extensiones. Esto puede hacerse de dos formas: puedes usar un hosting con servicio de SSL o bien, puedes usar claves criptográficas para firmar la información de actualización. Lee <a href="/es/Versionado,_actualizaci%C3%B3n_y_compatibilidad_de_extensiones" title="es/Versionado,_actualización_y_compatibilidad_de_extensiones">Cómo hacer actualizaciones seguras</a> para más información.</p>
+
+<h3 id="3er_paso:_Resolviendo_problemas_con_APIs_cambiados" name="3er_paso:_Resolviendo_problemas_con_APIs_cambiados">Paso 3: Debes estar al tanto de los cambios en las APIs</h3>
+
+<p>Muchas APIs han sido modificadas de forma significativa. Los cambios más importantes, que seguramente afectarán a muchas extensiones son:</p>
+
+<h4 id="DOM" name="DOM">DOM</h4>
+
+<p>Los nodos de documentos externos deberán copiarse idénticamente usando <code><a href="../../../../en/DOM/document.importNode" rel="internal">importNode()</a></code> (o adoptarlos usando <code><a href="../../../../en/DOM/document.adoptNode" rel="internal">adoptNode()</a></code>) antes de poder insertarlos en el documento actual. Para más información acerca de cuestiones relacionadas con <code><a href="../../../../en/DOM/element.ownerDocument" rel="internal">ownerDocument</a></code>, visita <a class="external" href="http://www.w3.org/DOM/faq.html#ownerdoc" rel="external nofollow" title="http://www.w3.org/DOM/faq.html#ownerdoc">W3C DOM FAQ</a>.</p>
+
+<p>Actualmente, Firefox no exige hacerlo aunque sí lo hizo durante algún tiempo, durante el desarrollo de Firefox 3. Lo que ocurrió fue que muchos sitios sufrían averías cuando esta política era obligatoria. Nuestra recomendación para los desarrolladores web es que corrijan su código para cumplir con esta regla y así lograr una mejor compatibilidad a futuro.</p>
+
+<h4 id="Enlaces_e_Historia" name="Enlaces_e_Historia">Marcadores e Historial</h4>
+
+<p>Si de alguna forma tu extensión tiene acceso a Marcadores o Historial, necesitarás un gran esfuerzo para hacer que sea compatible con Firefox 3. Las APIs antiguas que daban acceso a esta información han sido reemplazadas por la nueva arquitectura <a href="/es/Cat%C3%A1logo" title="es/Catálogo">Catálogo (Biblioteca)</a>. Visita la <a href="/es/Lugares/Gu%C3%ADa_para_migraci%C3%B3n_con_lugares" title="es/Lugares/Guía_para_migración_con_lugares">Guía para la migración a Catálogo (Biblioteca)</a> para más detalles acerca de cómo actualizar tus extensiones para el uso de las APIs de Catálogo (Biblioteca).</p>
+
+<h4 id="Control_de_descargas" name="Control_de_descargas"><span><span>Administrador de descargas</span></span></h4>
+
+<p>La API del Administrador de descargas ha cambiado ligeramente debido a la transición del almacén de datos RDF al uso de la API <a href="/es/Almacenamiento" title="es/Almacenamiento">Almacenamiento</a>. Esto debería ser una transición sencilla y fácil. Además , se ha modificado la API que controla los procesos de descarga para permitir varios receptores del administrador de descargas. Visita {{ Interface("nsIDownloadManager") }}, {{ Interface("nsIDownloadProgressListener") }} y <a href="../../../../en/Monitoring_downloads" rel="internal">Controlar descargas</a> para más información.</p>
+
+<h4 id="Control_de_contrase.C3.B1a" name="Control_de_contrase.C3.B1a">Administrador de contraseñas</h4>
+
+<p>Si tu extensión tiene acceso a información de inicio de sesión de usuario en el Administrador de contraseñas, deberás actualizarla para poder utilizar la nueva API para el Administrador de inicio de sesión.</p>
+
+<ul>
+ <li>El artículo <a class="new" href="../../../../es/Using_nsILoginManager" rel="internal">Utilizar nsILoginManager</a> incluye ejemplos y hasta una demostración de cómo debes escribir extensiones que funcionen tanto con el Administrador de contraseñas como con el Administrador de inicio de sesión, de manera que ambos funcionen con Firefox 3 y versiones anteriores.</li>
+ <li><code><a href="/en/nsILoginInfo" title="en/nsILoginInfo">nsILoginInfo</a></code></li>
+ <li><code><a href="/en/nsILoginManager" title="en/nsILoginManager">nsILoginManager</a></code></li>
+</ul>
+
+<p style="text-align: left;">También puedes sobrescribir el almacén del administrador de contraseñas interno si quieres ofrecer tu propia implementación del almacén de contraseñas en la extensión. Visita <a class="new" href="../../../../es/Creating_a_Login_Manager_storage_module" rel="internal">Crear un módulo de almacenamiento para el Administrador de inicio de sesión</a> para más detalles</p>
+
+<h4 id="Ventanas_emergentes_(Menús_Menús_contextuales_Tooltips_y_Paneles)"><span><span>Ventanas emergentes (Menús, Menús contextuales, Tooltips y Paneles)</span></span></h4>
+
+<p>En Firefox 3, se ha modificado sustancialmente el sistema XUL de ventanas emergentes. El sistema de ventanas emergentes ahora contempla menús principales, menús contextuales y paneles. Se ha creado una guía para <a class="new" href="../../../../es/XUL/PopupGuide" rel="internal">Utilizar Ventanas emergentes</a> que detalla cómo funciona este sistema. Algo que debes tener en cuenta, es que se desaconseja el uso de <code>popup.<span class="lang lang-en"><a href="../../../../en/XUL/Method/showPopup" rel="internal">showPopup</a></span></code> en favor de los nuevos <code>popup.<span class="lang lang-en"><a href="../../../../en/XUL/Method/openPopup" rel="internal">openPopup</a></span></code> y <code>popup.<span class="lang lang-en"><a href="../../../../en/XUL/Method/openPopupAtScreen" rel="internal">openPopupAtScreen</a></span></code>.</p>
+
+<div id="section_10">
+<h4 class="editable" id="Autocompletar"><span><span>Autocompletar</span> </span></h4>
+</div>
+
+<p>El método <code><a class="new" href="../../../../es/NsIAutoCompleteController#handleEnter.28.29" rel="internal">handleEnter()</a></code> de la interfaz <span class="lang lang-es"><code><a class="new" href="../../../../es/nsIAutoCompleteController" rel="internal">nsIAutoCompleteController</a></code></span> ha cambiado para aceptar un argumento que indique si el texto ha sido seleccionado desde una ventana emergente para Autocompletar o bien, por el usuario que ha pulsado la tecla Entrar (Enter) después de ingresar texto.</p>
+
+<h4 id="DOMParser" name="DOMParser">DOMParser</h4>
+
+<ul>
+ <li>Cuando se inicia una instancia de <code>DOMParser</code>, ésta hereda el código de la llamada principal, además de los códigos <code>documentURI</code> y <code>baseURI</code> de la ventana del constructor de donde proviene.</li>
+ <li>Si el llamante tiene privilegios UniversalXPConnect, puede pasar parámetros a <code>new DOMParser()</code>. Si se pasan menos de tres parámetros, los parámetros restantes se pasarán con el valor <code>null</code> de forma predeterminada.
+  <ul>
+   <li>El primer parámetro es el principal que se debe utilizar y por esto, se sobrescribe el valor principal predeterminado generalmente heredado.</li>
+   <li>El segundo parámetro es el <code>documentURI</code> que se debe utilizar.</li>
+   <li>El tercer parámetro es el <code>baseURI</code> que se debe utilizar.</li>
+  </ul>
+ </li>
+ <li>Si inicias un <code>DOMParser</code> usando una instrucción como <code>createInstance()</code> y no llamas al método <code>init()</code> de <code>DOMParser</code>, al intentar iniciar la operación de análisis, se creará e iniciará automáticamente un <code>DOMParser</code> con un principal nulo y punteros <code>null</code> para <code>documentURI</code> y <code>baseURI</code>.</li>
+</ul>
+
+<h4 id="Interfaces_removidas" name="Interfaces_removidas">Interfaces eliminadas</h4>
+
+<p>Las siguientes interfaces han sido eliminadas en Gecko 1.9, el motor de renderizado de Firefox 3. Si tu extensión utiliza cualquiera de estas interfaces, deberás actualizar tu código:</p>
+
+<ul>
+ <li><code>nsIDOMPaintListener</code></li>
+ <li><code>nsIDOMScrollListener</code></li>
+ <li><code>nsIDOMMutationListener</code></li>
+ <li><code>nsIDOMPageTransitionListener</code></li>
+ <li><code>nsICloseAllWindows</code> (Lee el {{ Bug(386200) }})</li>
+</ul>
+
+<h3 id="4to_paso:_Buscar_cambios_importantes_a_chrome" name="4to_paso:_Buscar_cambios_importantes_a_chrome">Paso 4: Comprueba los cambios importantes en el chrome</h3>
+
+<p>Se ha producido un cambio menor en el chrome que puede requerir cambios en tu código. Se ha añadido un nuevo <code>vbox</code> llamado "browser-bottombox", que integra la barra de búsqueda y la barra de estado en la parte inferior de la ventana del navegador. Aunque esto no afecta la apariencia de la pantalla, puede que afecte tu extensión si el chrome se superpone, en relación a los elementos descriptos.</p>
+
+<p>Por ejemplo, si has superpuesto algún elemento del chrome antes de la barra de estado de la siguiente manera:</p>
+
+<pre>&lt;window id="main-window"&gt;
+  &lt;something insertbefore="status-bar" /&gt;
+&lt;/window&gt;
+</pre>
+
+<p>Debes cambiar tu código a algo que se parezca a:</p>
+
+<pre>&lt;vbox id="browser-bottombox"&gt;
+  &lt;something insertbefore="status-bar" /&gt;
+&lt;/vbox&gt;
+</pre>
+
+<p>O bien, emplear la siguiente técnica para hacer que la superposición funcione en Firefox 2 y Firefox 3 por igual:</p>
+
+<pre>&lt;window id="main-window"&gt;
+  &lt;vbox id="browser-bottombox" insertbefore="status-bar"&gt;
+    &lt;something insertbefore="status-bar" /&gt;
+  &lt;vbox&gt;
+&lt;/window&gt;
+</pre>
+
+<p>{{ Note("Este cambio es efectivo para Firefox 3 beta 4 y la prebeta 4.") }}</p>
+
+<h4 id="Otros_cambios" name="Otros_cambios">Otros cambios</h4>
+
+<p><em>Añade aquí cambios sencillos que debas realizar cuando actualizas tu extensión para que funcione con Firefox 3</em><em>.</em></p>
+
+<ul>
+ <li>Por razones de seguridad, se ha dejado de implementar <code><a class="external" rel="freelink">chrome://browser/base/utilityOverlay.js</a></code>. Si lo estabas usando, deberás cambiarlo por <code><a class="external" rel="freelink">chrome://browser/content/utilityOverlay.js</a></code>.</li>
+ <li>Para implementar <span class="lang lang-es"><code><a class="new" href="../../../../es/nsIAboutModule" rel="internal">nsIAboutModule</a></code></span> ahora debes incluir el método <code>getURIFlags</code>. Visita <span class="lang lang-en"><a class="external" href="http://mxr.mozilla.org/mozilla-central/source/netwerk/protocol/about/public/nsIAboutModule.idl" rel="external nofollow" title="http://mxr.mozilla.org/mozilla-central/source/netwerk/protocol/about/public/nsIAboutModule.idl">nsIAboutModule.idl</a></span> para consultar la documentación. Esto afecta a las extensiones que brinden nuevas URIs del tipo <code>about:</code>. ( <span class="lang lang-*"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=337746" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=337746">bug 337746</a> </span>)</li>
+ <li>El elemento <span class="lang lang-*"><a href="../../../../en/XUL/tabbrowser" rel="internal">tabbrowser</a></span> ya no forma parte del "conjunto de herramientas" ( <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=339964" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=339964">bug 339964</a> </span>). Esto significa que este elemento ya no está disponible en aplicaciones y extensiones XUL. Este elemento sigue siendo parte de la ventana principal de Firefox (browser.xul).</li>
+ <li>Es necesario documentar los cambios en <a class="new" href="../../../../es/NsISupports_proxies" rel="internal">nsISupports proxies</a> <a class="external" href="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/78236a4b312a2de4/939240fc3f5123a8?lnk=st&amp;rnum=1#939240fc3f5123a8" rel="external nofollow" title="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/78236a4b312a2de4/939240fc3f5123a8?lnk=st&amp;rnum=1#939240fc3f5123a8">[1]</a> y posiblemente, también aquellos relacionados con el procesamiento de interfaces.</li>
+ <li>Si utilizas instrucciones de proceso XML, como por ejemplo <code>&lt;?xml-stylesheet ?&gt;</code> en tus archivos XUL, ten en cuenta los cambios descriptos en el <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=319654" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=319654">bug 319654</a> </span>:
+  <ol>
+   <li>Se han añadido los XML PIs al DOM del documento XUL. Esto significa que no se garantiza que <span class="lang lang-*"><code><a href="../../../../en/DOM/document.firstChild" rel="internal">document.firstChild</a></code></span> sea el elemento raíz. Si necesitas hacer referencia al documento raíz en tu script, usa <span class="lang lang-*"><code><a href="../../../../en/DOM/document.documentElement" rel="internal">document.documentElement</a></code></span> en su lugar.</li>
+   <li>Las instrucciones de procesamiento <code>&lt;?xml-stylesheet ?&gt;</code> y <code>&lt;?xul-overlay ?&gt;</code> ahora no tienen efecto fuera del prólogo del documento.</li>
+  </ol>
+ </li>
+ <li>Cuando se carga contenido web (es decir, se carga la página en el navegador) no se inicia <code>window.addEventListener("load", myFunc, true)</code>. Esto ocurre debido a que el <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=296639" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=296639">bug 296639</a> </span>cambia la forma de comunicación entre las ventanas internas y externas. Para corregir esto en forma sencilla, emplea <code>gBrowser.addEventListener("load", myFunc, true)</code>, según se describe <a class="new" href="../../../../es/Code_snippets/Tabbed_browser#Detecting_page_load" rel="internal">aquí</a>. Además, funciona también para Firefox 2.</li>
+ <li><code>content.window.getSelection()</code> ofrece un objeto (que puede ser convertido en cadena con <code>toString()</code>). Se desaconseja el uso de <code>content.document.getSelection()</code> que devuelve una cadena.</li>
+ <li>A partir de Firefox 2, se desaconsejó el uso de <code>event.preventBubble()</code> y actualmente, ha desaparecido en Firefox 3. En su lugar, usa <a class="new" href="../../../../es/DOM/event.stopPropagation" rel="internal"><code>event.stopPropagation()</code></a>, que también funciona en Firefox 2.</li>
+ <li>Los contadores de tiempo que se inician usando <code>setTimeout()</code> ahora están bloqueados por las ventanas en modo 'modal' gracias a la corrección hecha en el <span class="lang lang-es"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=52209" rel="external nofollow" title="https://bugzilla.mozilla.org/show_bug.cgi?id=52209">bug 52209</a> </span>. En su lugar, podrías usar <code>nsITimer</code>.</li>
+ <li>Si en tu extensión necesitas permitir una fuente no fiable (un sitio web, por ejemplo) para acceder al chrome de la extensión, debes usar el nuevo flag <a class="new" href="../../../../es/Chrome_Registration#contentaccessible" rel="internal"><code>contentaccessible</code> flag</a>.</li>
+</ul>
diff --git a/files/es/mozilla/firefox/releases/3/updating_web_applications/index.html b/files/es/mozilla/firefox/releases/3/updating_web_applications/index.html
new file mode 100644
index 0000000000..868d25f47b
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/updating_web_applications/index.html
@@ -0,0 +1,88 @@
+---
+title: Actualizar aplicaciones web para Firefox 3
+slug: Mozilla/Firefox/Releases/3/Updating_web_applications
+tags:
+  - Firefox 3
+translation_of: Mozilla/Firefox/Releases/3/Updating_web_applications
+original_slug: Actualizar_aplicaciones_web_para_Firefox_3
+---
+<div>{{FirefoxSidebar}}</div>
+
+<p>{{ Fx_minversion_header(3) }} Existen varios cambios en el próximo Firefox 3 que pueden afectar tu sitio web o aplicación web, así como nuevas características que se pueden aprovechar. Este artículo servirá como punto de partida para actualizar el contenido web de modo que se pueda aprovechar Firefox 3 al máximo.</p>
+
+<h3 id="DOM_changes" name="DOM_changes">Cambios DOM</h3>
+
+
+<p></p><p>Nodes from external documents should be cloned using <a href="/es/docs/Web/API/Document/importNode" title="Crea una copia de un nodo desde un documento externo para ser insertado en el documento actual."><code>document.importNode()</code></a> (or adopted using <a href="/es/docs/Web/API/Document/adoptNode" title="Adopta un nodo extreno. El nodo y sub subnodos son quitados del documento en que se encuentra  y su nuevo  ownerDocument se cambia por el actual. El nodo puede entoces ser insertado en el documento actual."><code>document.adoptNode()</code></a>) before they
+    can be inserted into the current document. For more on the <a href="/es/docs/Web/API/Node/ownerDocument" title="La propiedad de lectura Nodo.ownerDocument devuelve el objecto Document de más alto nivel/jerarquia para ese nodo."><code>Node.ownerDocument</code></a> issues, see the
+    <a class="external" href="http://www.w3.org/DOM/faq.html#ownerdoc" rel="noopener">W3C DOM FAQ</a>.</p>
+
+    <p>Firefox doesn't currently enforce this rule (it did for a while during the development of Firefox 3, but too many
+    sites break when this rule is enforced). We encourage Web developers to fix their code to follow this rule for
+    improved future compatibility.</p><p></p>
+
+<h3 id="HTML_changes" name="HTML_changes">Cambios HTML</h3>
+
+<h4 id="Changes_to_character_set_inheritance" name="Changes_to_character_set_inheritance">Cambios en el conjunto de caracteres de herencia</h4>
+
+<p>Firefox 3 cierra un fallo en la seguridad en frames e iframes que les permitía heredar el conjunto de caracteres de donde eran derivadas. Esto podría causar problemas en ciertos casos. Ahora, las frames están solamente permitidas a heredar el conjunto de caracteres si ambos frames y el conjunto de caracteres fue cargado del mismo servidor. Si tienes páginas que asumen que las frames fueron cargadas de otro servidor heredará el mismo conjunto de caracteres, deberías actualizar los HTML de las frames para indicar el conjunto de caracteres específicamente.</p>
+
+<h4 id="Cambios_en_el_elemento_SCRIPT">Cambios en el elemento SCRIPT</h4>
+
+<p>Ahora hay que cerrar el elemento <span style="font-family: Courier New;"><span class="nowiki">&lt;script&gt;</span></span> en <span style="font-family: Courier New;"><code>text/html</code></span> con <span style="font-family: Courier New;"><span class="nowiki">&lt;/script&gt;</span></span> en los documentos de HTML 4, incluso si no hay contenido dentro. En las versiones previas de Firefox, bastaba con hacer:</p>
+
+<pre class="eval">&lt;script ...   /&gt;
+</pre>
+
+<p>Ahora se deben cumplir las especificaciones de HTML (si se trata de un HTML), y por lo tanto se deben cerrar, así:</p>
+
+<pre class="eval">&lt;script ...&gt;&lt;/script&gt;
+</pre>
+
+<p>Esto mejora tanto la compatibilidad como la seguridad.</p>
+
+<h3 id="Cambios_en_CSS" name="Cambios_en_CSS">Cambios en CSS</h3>
+
+<h4 id="Cambio_al_tama.C3.B1o_de_fuente_basado_en_unidades_em.2C_ex" name="Cambio_al_tama.C3.B1o_de_fuente_basado_en_unidades_em.2C_ex">Cambio al tamaño de fuente basado en unidades em, ex</h4>
+
+<p>Los valores de fuente en unidades em y ex solían ser afectadas por el tamaño mínimo de fuente utilizado por el usuario: si una fuente se desplegaba más grande debido al tamaño mínimo, el ajuste de las unidades em y ex para el tamaño de fuente basados en esta se incrementarían de forma acorde. Esto era inconsistente con la forma en que las fuentes basadas en porcentaje se comportaban.</p>
+
+<p>Los valores del tamaño de fuente en unidades em y ex ahora están basadas en un "tamaño de fuente intencionado" que no se ve afectado por el tamaño mínimo de fuente del usuario. En otras palabras, los tamaños de la fuente se calculan de acuerdo a las intenciones del diseñador y se ajustan al tamaño mínimo de fuente después de ello.</p>
+
+<p>Ver {{ Bug(322943) }} para una demostración (se debe ver con un tamaño mínimo de fuente 6 para detectar la diferencia: las dos cajas en cascada se comportan diferente en Firefox 2, porque el tamaño de fuente basado en em "retorna" el tamaño mínimo de fuente.</p>
+
+<h3 id="Cambios_de_seguridad" name="Cambios_de_seguridad">Cambios de seguridad</h3>
+
+<h4 id="Acceso_Chrome" name="Acceso_Chrome">Acceso Chrome</h4>
+
+<p>En versiones anteriores de Firefox, cualquier página web podía cargar scripts o imágenes <span style="font-family: Courier New;"><code><a class="external" rel="freelink">chrome://</a></code></span> usando el protocolo chrome. Entre otras cosas, esto hizo posible que algunos sitios no detectaran la presencia de complementos,  lo cual podía ser usado para traspasar la seguridad del usuario saltando los complementos que agregaban medidas de seguridad al buscador.</p>
+
+<p>Firefox 3 solo permite contenido web para acceder a los elementos en los espacios del <span style="font-family: Courier New;"><code><a class="external" rel="freelink">chrome://browser/</a></code> </span>y en espacio <span style="font-family: Courier New;"><a class="external" rel="freelink">chrome://toolkit/</a></span>. Estos archivos pretenden ser accesibles por el contenido web. Ahora cualquier otro contenido chrome es bloqueado para el sitio web.</p>
+
+<p>Hay, sin embargo, métodos para ciertas extensiones que puden ser accedidos por la web. Se puede especificar una bandera en su archivo<span style="font-family: Courier New;"> chrome.manifest </span>de esta manera:</p>
+
+<pre class="eval">content mypackage location/ contentaccessible=yes
+</pre>
+
+<p>Esto no debería ser algo que se haga muy seguido, pero está disponible para aquellos casos raros en los que es necesario. Debe tomarse en cuenta que es posible que Firefox alerte al usuario que su extensión utiliza una bandera en el <span style="font-family: Courier New;">contentaccessible </span>de alguna manera, ya que consituye un riesgo potencial en la seguridad.</p>
+
+<div class="note"><strong>Nota:</strong> Ya que Firefox 2 no entiende la bandera <code>contentaccessible</code> (ignorará la instrucción completa de que contiene la bandera), si se desea que el complemento sea compatible con Firefox 2 y Firefox 3, hay que hacer algo como esto:
+
+<pre class="eval">content mypackage location/
+content mypackage location/ contentaccessible=yes
+</pre>
+</div>
+
+<h4 id="Campos_para_subir_archivos">Campos para subir archivos</h4>
+
+<p>En versiones anteriores de Firefox, había casos en los que cuando el usuario seleccionaba un archivo para subir, la aplicación web podía ver la ruta completa del archivo. Esta pertinencia de privacidad ha sido resuelta en Firefox 3; ahora la aplicación web solo mostrará el nombre del archivo.</p>
+
+<h3 id="Cambios_en_JavaScript" name="Cambios_en_JavaScript">Cambios en JavaScript</h3>
+
+<p>Firefox 3 soporta <span style="color: #008080;"><a href="../../../../../en/New_in_JavaScript_1.8" rel="internal">JavaScript 1.8</a></span>. Un cambio importante que quizás requiera actualizaciones en los sitios web o en las aplicaciones, es que los <span style="font-family: Courier New;">Script </span>obsoletos y no-estandar no son soportados. Esto no es la etiqueta <span style="font-family: Courier New;"><code><span class="nowiki">&lt;script&gt;</span></code></span>, pero un objeto de JavaScript que nunca fue estandarizado. De cualquier manera es muy improbable que se use, así que probablemente no surgan problemas.</p>
+
+<h3 id="Vea_tambien" name="Vea_tambien">Vea también</h3>
+
+<ul>
+ <li><a href="/es/Firefox_3_for_developers" title="es/Firefox_3_for_developers">Firefox 3 para desarrolladores</a> <a href="/es/New_in_JavaScript_1.8" title="es/New_in_JavaScript_1.8">Nuevo en  JavaScript 1.8</a> <a href="/es/Updating_extensions_for_Firefox_3" title="es/Updating_extensions_for_Firefox_3">Actualizando extensiones para Firefox 3</a></li>
+</ul>
diff --git a/files/es/mozilla/firefox/releases/3/xul_improvements_in_firefox_3/index.html b/files/es/mozilla/firefox/releases/3/xul_improvements_in_firefox_3/index.html
new file mode 100644
index 0000000000..172b327b44
--- /dev/null
+++ b/files/es/mozilla/firefox/releases/3/xul_improvements_in_firefox_3/index.html
@@ -0,0 +1,110 @@
+---
+title: Mejoras XUL en Firefox 3
+slug: Mozilla/Firefox/Releases/3/XUL_improvements_in_Firefox_3
+tags:
+  - Firefox 3
+  - Todas_las_Categorías
+  - XUL
+translation_of: Mozilla/Firefox/Releases/3/XUL_improvements_in_Firefox_3
+original_slug: Mejoras_XUL_en_Firefox_3
+---
+<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Firefox 3 proporciona varios nuevos elementos <a href="/es/XUL" title="es/XUL">XUL</a>, además de mejoras en los elementos existentes. Aún que este material se documenta en detalle en otro lugar, este artículo ofrece una buena lista de estas mejoras así como enlaces a la documentación detallada.</p>
+
+<p> </p>
+
+<h3 id="Los_nuevos_elementos" name="Los_nuevos_elementos">Los nuevos elementos</h3>
+
+<ul>
+ <li><a href="/es/Tutorial_de_XUL/Controles_numéricos" title="es/Tutorial_de_XUL/Controles_numéricos">Los controles numéricos</a>:
+
+  <ul>
+   <li>El elemento <code><a href="/es/XUL/scale" title="es/XUL/scale">&lt;scale&gt;</a></code> permite crear escalas deslizantes que dejan al usuario seleccionar cualquier valor dentro de un rango especificado. Este control podría utilizarse, por ejemplo, para crear un control de volumen.</li>
+   <li>El valor <code>number</code> para el atributo <code>type</code> de cajas de texto (<code>textbox</code>) crea una caja de texto donde sólo se pueden introducir números. Además, aparecen botones de flecha en un lateral que permiten incrementar o disminuir los valores. {{ interwiki('wikimo', 'XUL:Specs:NumberBox', 'Más información sobre cajas de texto numérico') }}. {{ Bug(345510) }}</li>
+   <li>El elemento <code><a href="/es/XUL/spinbuttons" title="es/XUL/spinbuttons">&lt;spinbuttons&gt;</a></code>, que puede usarse para crear controles con la ayuda de vínculos XBL. {{ Bug(155053) }}</li>
+   <li>Los controles, <code><a href="/es/XUL/datepicker" title="es/XUL/datepicker">&lt;datepicker&gt;</a></code> y <code><a href="/es/XUL/timepicker" title="es/XUL/timepicker">&lt;timepicker&gt;</a></code> sirven para permitir entradas de fecha y hora. El seleccionador de fecha está disponible en varios estilos según el atributo <code>type</code> y permite entradas vía cajas de texto o de un calendario. {{ interwiki('wikimo', 'XUL:Specs:DateTimePickers', 'Más información sobre seleccionadores de fecha (en)') }} <a href="/es/XUL/datepicker" title="es/XUL/datepicker">Referencia de seleccionadores de fecha</a> <a href="/es/XUL/timepicker" title="es/XUL/timepicker">Referencia de seleccionadores de hora</a></li>
+  </ul>
+ </li>
+ <li>Hay una <a href="/es/XUL/Guía_de_popup" title="es/XUL/Guía_de_popup">guía</a> sobre menús y elementos emergentes que describe las nuevas funciones disponibles.
+  <ul>
+   <li>El elemento <code><a href="/es/XUL/dropmarker" title="es/XUL/dropmarker">&lt;dropmarker&gt;</a></code> es útil para crear, con vínculos XBL, controles de estilo de menú. ({{ Bug(348614) }})</li>
+   <li>El elemento <code><a href="/es/XUL/panel" title="es/XUL/panel">&lt;panel&gt;</a></code> está diseñado para elementos emergentes que no son menús. Pueden albergar cualquier tipo de contenido. Para menús se debería utilizar el elemento &lt;menupopup&gt;. Los menús permiten la navegación mediante el teclado y apertura/cierre de sub-menús.</li>
+  </ul>
+ </li>
+</ul>
+
+<p> </p>
+
+<h3 id="Las_mejoras" name="Las_mejoras">Las mejoras</h3>
+
+<h4 id="en_los_.C3.A1rboles" name="en_los_.C3.A1rboles">en los árboles</h4>
+
+<ul>
+ <li>Los árboles pueden desplazarse horizontalmente ahora. Si las columnas no caben dentro del ancho disponible, aparece una barra de desplazamiento horizontal. Esto ocurre si el ancho de las columnas especificado suma más que el espacio disponible. Ver {{ Bug(212789) }} para más detalles.</li>
+ <li>Un nuevo estilo de selección permite seleccionar celdas individualmente, en lugar de filas enteras. Para usar este estilo de selección, se fijará el atributo <code>seltype</code> de los árboles como <code>cell</code>. ({{ Bug(296040) }})</li>
+ <li>Los árboles admiten la edición de celdas individuales. Cuando el usuario hace doble clic en una celda, aparece un campo de texto donde puede editar los contenidos de la celda. Ver {{ interwiki('wikimo', 'XUL:Tree', 'estas notas') }} para más detalles. ({{ Bug(201499) }})</li>
+ <li>Los elementos &lt;treecol&gt; admiten ahora un atributo <code>overflow</code>, que puede definirse como verdadero para permitir que el texto de las celdas de esa columna se expanda a las celdas vecinas vacías, si el texto es demasiado largo para caber en esa única celda.</li>
+</ul>
+
+<h4 id="de_los_men.C3.BAs" name="de_los_men.C3.BAs">de los menús</h4>
+
+<ul>
+ <li>El atributo <code>image</code> se usa ahora consistentemente para definir imágenes.</li>
+ <li>Las listas de menú lanzan el evento <code>select</code> cuando se selecciona un elemento.</li>
+ <li>Las propiedades <code>inputField</code> y <code>editable</code> han sido añadidas a la lista de menú.</li>
+ <li>El elemento &lt;menu&gt; tiene métodos para añadir, insertar y eliminar elementos de menú. ({{ Bug(372552) }})</li>
+ <li>Los elementos <code>&lt;menu&gt;</code>, <code>&lt;menuitem&gt;</code> y <code>&lt;menuseparator&gt;</code>:
+  <ul>
+   <li>tienen la propiedad <code>selected</code>, de sólo lectura, que indica si el elemento está seleccionado en una &lt;menulist&gt;.</li>
+   <li>tienen la propiedad <code>control</code>, de sólo lectura, que devuelve la &lt;menulist&gt; rodeada.</li>
+   <li>admiten las propiedades <code>accessKey</code>, <code>disabled</code>, <code>crop</code>, <code>image</code> y <code>label</code> que definen el atributo correspondiente.</li>
+  </ul>
+ </li>
+ <li>La propiedad <code>editor</code> permite obtener la interfaz {{ Interface("nsIEditor") }} interna para el campo de texto de un elemento <code>menulist</code> modificable.</li>
+ <li>Los menús pueden mostrarse transparentes en las plataformas que lo permiten. ({{ Bug(70798) }})</li>
+</ul>
+
+<h4 id="en_las_cajas_de_texto" name="en_las_cajas_de_texto">en las cajas de texto</h4>
+
+<ul>
+ <li>Definir el atributo <code>spellcheck</code> de una <a href="/es/XUL/textbox" title="es/XUL/textbox">caja de texto</a> a '<code>true</code>' activará la comprobación ortográfica integrada en esa caja de texto. ({{ Bug(346787) }})</li>
+ <li>La <code>&lt;textbox&gt;</code> tiene el método <code>reset()</code> para reiniciar el valor de una caja de texto a su valor predeterminado. La propiedad <code>defaultValue</code> se usará para obtener y modificar el valor por defecto de la caja de texto. ({{ Bug(312867) }})</li>
+ <li>Se ofrece la propiedad <code>editor</code> que permite obtener la interfaz {{ Interface("nsIEditor") }} interna del campo de texto.({{ Bug(312867) }})</li>
+ <li>La <code><a href="/es/XUL/textbox" title="es/XUL/textbox">caja de texto</a></code> admite el atributo <code>newlines</code> que especifica cómo se tratarán los saltos de linea en el texto pegado. {{ Bug(253481) }}. Los posibles valores son:
+  <ul>
+   <li><code>pasteintact</code> - pega todo tal cual está</li>
+   <li><code>pastetofirst</code> - (valor por defecto) pega sólo hasta el primer salto de linea</li>
+   <li><code>replacewithspaces</code> - reemplaza los saltos de linea por espacios</li>
+   <li><code>replacewithcommas</code> - reemplaza los saltos de linea con comas</li>
+   <li><code>strip</code> - elimina todos los saltos de linea</li>
+   <li><code>stripsurroundingwhitespace</code> - elimina todos los saltos de linea y los espacios vacíos cercanos</li>
+  </ul>
+ </li>
+</ul>
+
+<h3 id="Otras_mejoras" name="Otras_mejoras">Otras mejoras</h3>
+
+<ul>
+ <li>El atributo <code>type</code> de un <code>&lt;button&gt;</code> se fijará a <code>repeat</code> para crear botones que ejecuten el evento asociado mientras se mantiene pulsado con el ratón.</li>
+ <li>El atributo <code><a href="/es/XUL/Atributos/buttondisabledaccept" title="es/XUL/Atributos/buttondisabledaccept">buttondisabledaccept</a></code> puede usarse en el elemento <code>&lt;dialog&gt;</code> para tener el botón aceptar (OK) inicialmente desactivado.</li>
+ <li>El elemento <code>&lt;titlebar&gt;</code> admite el atributo <code>allowevents</code> que permite pasar eventos a los hijos de la barra de título.</li>
+ <li>El <code>&lt;splitter&gt;</code> admite el valor adicional <code>'both'</code> para el atributo <code>collapse</code>, que indica que el separador puede colapsar elementos en ambos lados cuando se arrastra. El atributo <code>substate</code> se fijará a antes o después cuando uno es colapsado. ({{ Bug(337955) }})</li>
+ <li>El elemento <code>&lt;richlistbox&gt;</code> permite selección múltiple. Se fijará el atributo <code>seltype</code> a <code>'multiple'</code> para activarlo.</li>
+ <li>El elemento <code>&lt;radio&gt;</code> tiene un atributo <code>group</code> que puede definir la (id) identificación de un elemento <code>&lt;radiogroup&gt;</code> al cual pertenece el botón de selección. Esto permite organizar los botones de selección, de una manera que quizás no sea conveniente, al colocarlos dentro de un grupo de selección.</li>
+ <li>Los métodos <code>openPopup()</code> y <code>openPopupAtScreen()</code> son admitidos por menús, paneles y títulos emergentes. Estos métodos deberían utilizarse en lugar de <code>showPopup()</code> que ha generado confusiones en su uso.</li>
+ <li>Se ha mejorado la gestión del elemento &lt;key&gt; (tecla) para los usuarios de teclados no latino. Ver el evento de tecla de Gecko.</li>
+ <li>En Mac OS X, los atributos 'activetitlebarcolor' y 'inactivetitlebarcolor' de los elementos raiz (&lt;window&gt;, &lt;dialog&gt;, &lt;prefwindow&gt; and &lt;wizard&gt;) son accesibles para personalizar el color de la barra de títulos de la pantalla.</li>
+</ul>
+
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
+
+<ul>
+ <li><a href="/es/XUL" title="es/XUL">XUL</a></li>
+</ul>
+
+<p> </p>
+
+<p> </p>
+
+<p>{{ languages( { "en": "en/XUL_improvements_in_Firefox_3", "fr": "fr/Am\u00e9liorations_XUL_dans_Firefox_3", "ja": "ja/XUL_improvements_in_Firefox_3", "pl": "pl/Poprawki_XUL_w_Firefoksie_3" } ) }}</p>
diff --git a/files/es/módulos_javascript/index.html b/files/es/módulos_javascript/index.html
deleted file mode 100644
index c301b061ca..0000000000
--- a/files/es/módulos_javascript/index.html
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Módulos JavaScript
-slug: Módulos_JavaScript
-tags:
-  - Firefox 3
-  - JavaScript
-  - Todas_las_Categorías
-  - XPConnect
----
-<p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Firefox 3 introduce el método <code><a href="es/Components.utils.import">Components.utils.import()</a></code> , que provee una sencilla forma de importar código JavaScript desde un módulo externo. Existe información sobre cómo configurar y <a href="es/Usando_m%c3%b3dulos_de_c%c3%b3digo_JavaScript">usar módulos JavaScript</a>. Los Módulos de JavaScript pueden también ser usados para <a href="es/Trabajar_con_ventanas_desde_c%c3%b3digo_chrome#Usando_m.C3.B3dulos_de_c.C3.B3digo_JavaScript">compartir datos</a> en extensiones.</p>
-
-<p>Además de ofrecer este método para importar módulos, Firefox incluye dos módulos por defecto:</p>
-
-<dl>
- <dt>XPCOMUtils</dt>
- <dd>El módulo <a href="es/XPCOMUtils.jsm">XPCOMUtils.jsm</a> provee facilidades para componentes de JavaScript cargados mediante el cargador de componentes de JavaScript.</dd>
- <dt>JSON</dt>
- <dd>El módulo <a href="es/JSON.jsm">JSON.jsm</a> provee facilidades para manipular datos JSON.</dd>
- <dt>PluralForm</dt>
- <dd>El módulo <a href="es/Localizaci%c3%b3n_y_Plurales">PluralForm.jsm</a> provee herramientas para pluralizar correctamente palabras en múltiples localizaciones.</dd>
-</dl>
diff --git a/files/es/nsdirectoryservice/index.html b/files/es/nsdirectoryservice/index.html
deleted file mode 100644
index 37eb6d6505..0000000000
--- a/files/es/nsdirectoryservice/index.html
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: nsDirectoryService
-slug: nsDirectoryService
----
-<h3 id="Resumen" name="Resumen">Resumen</h3>
-<p>El servicio de directorio XPCOM devuelve las ubicaciones de directorios "bien conocidos" en los sistemas operativos de una forma independiente. Por ejemplo puede indicarle la ruta del directorio temporal del sistema, el directorio de trabajo actual, etc.</p>
-<pre class="eval"> ClassID:    f00152d0-b40b-11d3-8c9c-000064657374
- ContractID: @mozilla.org/file/directory_service;1
-</pre>
-<h3 id="Interfaces_soportados" name="Interfaces_soportados">Interfaces soportados</h3>
-<p><code><a href="es/NsIProperties">nsIProperties</a></code>, <code><a href="es/NsIDirectoryService">nsIDirectoryService</a></code></p>
diff --git a/files/es/orphaned/actualizar_extensiones_para_firefox_3/actualizar_extensiones_para_firefox_3/index.html b/files/es/orphaned/actualizar_extensiones_para_firefox_3/actualizar_extensiones_para_firefox_3/index.html
new file mode 100644
index 0000000000..f4c2d0d435
--- /dev/null
+++ b/files/es/orphaned/actualizar_extensiones_para_firefox_3/actualizar_extensiones_para_firefox_3/index.html
@@ -0,0 +1,231 @@
+---
+title: Actualizar extensiones para Firefox 3
+slug: >-
+  orphaned/Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3
+tags:
+  - Firefox 3
+original_slug: Actualizar_extensiones_para_Firefox_3/Actualizar_extensiones_para_Firefox_3
+---
+<div><section class="Quick_links" id="Quick_Links">
+  <ol>
+    <li class="toggle">
+        <details>
+            <summary>Notas de la Versión para Desarrolladores de Firefox</summary>
+            <ol>
+              <li><a href="/es/docs/Mozilla/Firefox/Releases">Notas de la Versión para Desarrolladores de Firefox</a></li>
+            </ol>
+        </details>
+    </li>
+    <li class="toggle">
+        <details>
+            <summary>Complementos</summary>
+            <ol>
+              <li><a href="/es/Add-ons/WebExtensions">Extensiones del navegador</a></li>
+              <li><a href="/es/Add-ons/Themes">Temas</a></li>
+            </ol>
+        </details>
+    </li>
+    <li class="toggle">
+        <details>
+            <summary>Firefox por dentro</summary>
+            <ol>
+              <li><a href="/es/docs/Mozilla/">Proyecto Mozilla (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/Gecko">Gecko</a></li>
+              <li><a href="/es/docs/Mozilla/Firefox/Headless_mode">Headless mode</a></li>
+              <li><a href="/es/docs/Mozilla/JavaScript_code_modules">Modulos de código JavaScript (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/js-ctypes">JS-ctypes (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/MathML_Project">Proyecto MathML</a></li>
+              <li><a href="/es/docs/Mozilla/MFBT">MFBT (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/Projects">Proyectos Mozilla (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/Preferences">Sistema de Preferencias (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/WebIDL_bindings">Ataduras WebIDL (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/Tech/XPCOM">XPCOM</a></li>
+              <li><a href="/es/docs/Mozilla/Tech/XUL">XUL</a></li>
+            </ol>
+        </details>
+    </li>
+    <li class="toggle">
+        <details>
+            <summary>Crear y contribuir</summary>
+            <ol>
+              <li><a href="/es/docs/Mozilla/Developer_guide/Build_Instructions">Instrucciones para la compilación</a></li>
+              <li><a href="/es/docs/Mozilla/Developer_guide/Build_Instructions/Configuring_Build_Options">Configurar las opciones de compilación</a></li>
+              <li><a href="/es/docs/Mozilla/Developer_guide/Build_Instructions/How_Mozilla_s_build_system_works">Cómo funciona el sistema de compilación (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/Developer_guide/Source_Code/Mercurial">Código fuente de Mozilla</a></li>
+              <li><a href="/es/docs/Mozilla/Localization">Localización</a></li>
+              <li><a href="/es/docs/Mozilla/Mercurial">Mercurial (Inglés)</a></li>
+              <li><a href="/es/docs/Mozilla/QA">Garantía de Calidad</a></li>
+              <li><a href="/es/docs/Mozilla/Using_Mozilla_code_in_other_projects">Usar Mozilla en otros proyectos (Inglés)</a></li>
+            </ol>
+        </details>
+    </li>
+  </ol>
+</section></div>
+
+<p> Este artículo ofrece información que será de utilidad para desarrolladores que deseen actualizar sus extensiones, con el propósito de que éstas funcionen correctamente con Firefox 3.</p>
+
+<p>Antes de continuar, queremos sugerirte algo: si el único cambio que requiere tu extensión es un empuje al campo <code>maxVersion</code> en el manifiesto de instalación, y la extensión está disponible en el servidor <a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a>, ¡no necesitas actualizar tu extensión a una nueva versión! Simplemente usa el Panel de Control para desarrolladores en AMO para ajustar <code>maxVersion</code>. De esta manera, puedes evitar el trabajo de tener que volver a revisar tu extensión.</p>
+
+<h3 id="Paso_1_Actualiza_el_manifiesto_de_instalaci.C3.B3n" name="Paso_1:_Actualiza_el_manifiesto_de_instalaci.C3.B3n">Paso 1: Actualiza el manifiesto de instalación</h3>
+
+<p>El primer paso <span style='font-family: "Times New Roman"; font-size: 12pt;'>—</span>y para muchas extensiones, el único que será necesario<span style='font-family: "Times New Roman"; font-size: 12pt;'>—</span> es actualizar el archivo <code>install.rdf</code> dentro del manifiesto <a href="/es/Manifiesto_de_instalaci%C3%B3n" title="es/Manifiesto_de_instalación">install manifest</a> para indicar la compatibilidad con Firefox 3.</p>
+
+<p>Simplemente encuentra la línea que indica el número de la versión máxima compatible de Firefox, lo que para Firefox 2 es algo como:</p>
+
+<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;2.0.*&lt;/em:maxVersion&gt;</span>
+</pre>
+
+<p>Cámbiala para indicar compatibilidad con Firefox 3:</p>
+
+<pre class="eval"> <span class="nowiki">&lt;em:maxVersion&gt;3.0.*&lt;/em:maxVersion&gt;</span>
+</pre>
+
+<p>A continuación, reinstala la extensión.</p>
+
+<p>Recuerda que en Firefox 3 no necesitas incluir el ".0" extra en el número de versión, con lo que, en lugar de usar "3.0.0.*", sólo necesitas usar "3.0.*".</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Ten en cuenta que actualmente, se esperan muchos cambios en Firefox 3. Estos cambios podrían romper algunas extensiones, por lo que no deberías ofrecer una nueva versión con <code>maxVersion</code> <code>3.0.*</code> a los usuarios, hasta que salgan las versiones RC (release candidate). Durante el periodo Beta, deberías usar <code>maxVersion</code> <code>3.0b5</code>.</p>
+</div>
+
+<p>Ha habido (y continuará habiendo) una serie de cambios en la API que muy probablemente romperá algunas extensiones. Aún estamos trabajando para hacer una lista de todos estos cambios.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Si tu extensión aún usa un script <code><a href='\"es/Install.js\"'>Install.js</a></code> en lugar de un <a href='\"es/Install_Manifests\"'>install manifest</a>, necesitas hacer la transición a un manifiesto de instalación ahora. Firefox 3 ya no implementa scripts <code>install.js</code> en archivos XPI.</p>
+</div>
+
+<h4 id="Agregar_localizaciones_al_manifiesto_de_instalaci.C3.B3n" name="Agregar_localizaciones_al_manifiesto_de_instalaci.C3.B3n">Agregar localizaciones al manifiesto de instalación</h4>
+
+<p>Firefox 3 tiene tres nuevas propiedades en el manifiesto de instalación para especificar descripciones de localización. Los métodos antiguos aún funcionan. Sin embargo, los nuevos permiten que Firefox escoja la localización aún cuando la extensión esté deshabilitada o pendiente de instalación. Visita <a href="/es/Localizing_extension_descriptions" title="es/Localizing_extension_descriptions">Localizing extension descriptions</a> para más detalles.</p>
+
+<h3 id="Paso_2_Aseg.C3.BArate_de_suministrar_actualizaciones_seguras" name="Paso_2:_Aseg.C3.BArate_de_suministrar_actualizaciones_seguras">Paso 2: Asegúrate de suministrar actualizaciones seguras</h3>
+
+<p>Si tienes la extensión en tu propio servidor y no en un servidor seguro como <a class="link-https" href="https://addons.mozilla.org">addons.mozilla.org</a>, debes suministrar un método para la descarga segura de la extensión. Esto puede hacerse manteniendo un servidor SSl, o usando claves criptográficas para firmar la información de la extensión. Lee <a href="/es/Extension_Versioning,_Update_and_Compatibility#Securing_Updates" title="es/Extension_Versioning,_Update_and_Compatibility#Securing_Updates">Securing Updates</a> para más información.</p>
+
+<h3 id="Paso_3_Manejate_con_los_cambios_en_los_API" name="Paso_3:_Manejate_con_los_cambios_en_los_API">Paso 3: Debes estar al tanto de los cambios en las API</h3>
+
+<p>Muchas API han sido modificadas de forma significativa. Los cambios más importantes, que seguramente afectarán a muchas extensiones son:</p>
+
+<h4 id="DOM" name="DOM">DOM</h4>
+
+
+<p>Nodes from external documents should be cloned using <a href="/es/docs/Web/API/Document/importNode" title="Crea una copia de un nodo desde un documento externo para ser insertado en el documento actual."><code>document.importNode()</code></a> (or adopted using <a href="/es/docs/Web/API/Document/adoptNode" title="Adopta un nodo extreno. El nodo y sub subnodos son quitados del documento en que se encuentra  y su nuevo  ownerDocument se cambia por el actual. El nodo puede entoces ser insertado en el documento actual."><code>document.adoptNode()</code></a>) before they
+    can be inserted into the current document. For more on the <a href="/es/docs/Web/API/Node/ownerDocument" title="La propiedad de lectura Nodo.ownerDocument devuelve el objecto Document de más alto nivel/jerarquia para ese nodo."><code>Node.ownerDocument</code></a> issues, see the
+    <a class="external" href="http://www.w3.org/DOM/faq.html#ownerdoc" rel="noopener">W3C DOM FAQ</a>.</p>
+
+    <p>Firefox doesn't currently enforce this rule (it did for a while during the development of Firefox 3, but too many
+    sites break when this rule is enforced). We encourage Web developers to fix their code to follow this rule for
+    improved future compatibility.</p>
+
+<h4 id="Marcadores__Historial" name="Marcadores_&amp;_Historial">Marcadores e Historial</h4>
+
+<p>Si tu extensión accede a los marcadores o al historial de alguna forma, necesitarás un gran esfuerzo para hacerla compatible con Firefox 3. Los API antiguos que accedian a esta información, han sido reemplazados por la nueva arquitectura <a href="/es/Cat%C3%A1logo" title="es/Catálogo">Catálogo</a>. Ver <a href="/es/Gu%C3%ADa_para_la_migraci%C3%B3n_a_cat%C3%A1logo" title="es/Guía_para_la_migración_a_catálogo">Guía para la migración a catálogo</a> para más detalles de cómo actualizar tus extensiones en el uso de las API de catálogo.</p>
+
+<h4 id="Administrador_de_descargas" name="Administrador_de_descargas">Administrador de descargas</h4>
+
+<p>El API del administrador de descargas ha cambiado ligeramente debido a la transición desde el uso del almacén de datos RDF al uso del API <a href="/es/Storage" title="es/Storage">Storage</a>. Esto debería ser una transición pequeña y fácil. Adicionalmente, el API para vigilar los procesos de descarga ha cambiado para que maneje varias escuchas de descarga. Ver <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadManager" title="">nsIDownloadManager</a></code>, <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIDownloadProgressListener" title="">nsIDownloadProgressListener</a></code>, y <a href="/es/Vigilar_descargas" title="es/Vigilar_descargas">Monitoring downloads</a> para más información.</p>
+
+<h4 id="Administrador_de_contrase.C3.B1as" name="Administrador_de_contrase.C3.B1as">Administrador de contraseñas</h4>
+
+<p>Si tu extensión accede a información de identidad de usuario del Administrador de Contraseñas, necesitará ser actualizada para usar el nuevo API Administrador de Contraseñas.</p>
+
+<ul>
+ <li>El artículo <a href="/es/Using_nsILoginManager" title="es/Using_nsILoginManager">Using nsILoginManager</a> incluye ejemplos, que incluyen una demostración de cómo debes escribir extensiones que trabajen tanto con el Administrador de Contraseñas (Password Manager) como con el Administrador de Registro (Login Manager) para que ambos trabajen con Firefox 3 y versiones anteriores.</li>
+ <li><code><a href="/es/NsILoginInfo" title="es/NsILoginInfo">nsILoginInfo</a></code></li>
+ <li><code><a href="/es/NsILoginManager" title="es/NsILoginManager">nsILoginManager</a></code></li>
+</ul>
+
+<p>También puedes sobre-escribir el almacén del administrador de contraseñas interno si quieres ofrecer tu propio almacén en tu extensión. Ver <a href="/es/Creating_a_Login_Manager_storage_module" title="es/Creating_a_Login_Manager_storage_module">Creating a Login Manager storage module</a> para más detalles.</p>
+
+<h4 id="Ventanas_emergentes_.28Men.C3.BAs.2C_Men.C3.BAs_contextuales.2C_Tooltips_y_Paneles.29" name="Ventanas_emergentes_.28Men.C3.BAs.2C_Men.C3.BAs_contextuales.2C_Tooltips_y_Paneles.29">Ventanas emergentes (Menús, Menús contextuales, Tooltips y Paneles)</h4>
+
+<p>En Firefox 3, se ha modificado sustancialmente el sistema XUL de ventanas emergentes. El sistema de ventanas emergentes, contempla ahora, menús, menús contextuales y paneles. Se ha creado una guía a <a href="/es/XUL/PopupGuide" title="es/XUL/PopupGuide">using Popups</a>, detallando cómo funciona este sistema. Una cosa a tener en cuenta, es que se desaconseja el uso de <code>popup.<span id="m-showPopup"><code><a href="https://developer.mozilla.org/es/docs/Mozilla/Tech/XUL/Method/showPopup">showPopup</a></code></span></code> en favor de los nuevos <code>popup.<span id="m-openPopup"><code><a href="https://developer.mozilla.org/es/docs/Mozilla/Tech/XUL/Method/openPopup">openPopup</a></code></span></code> y <code>popup.<span id="m-openPopupAtScreen"><code><a href="https://developer.mozilla.org/es/docs/Mozilla/Tech/XUL/Method/openPopupAtScreen">openPopupAtScreen</a></code></span></code>.</p>
+
+<h4 id="Autocompletado" name="Autocompletado">Autocompletado</h4>
+
+<p>El método <code><a href="/es/NsIAutoCompleteController#handleEnter.28.29" title="es/NsIAutoCompleteController#handleEnter.28.29">handleEnter()</a></code> del interfaz <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAutoCompleteController" title="">nsIAutoCompleteController</a></code> ha cambiado para aceptar un argumento que indique si el texto ha sido seleccionado en una ventana de Autocompletado o por que el usuario ha pulsado Intro después de teclear algún texto.</p>
+
+<h4 id="Analizador_del_DOM_.28DOMParser.29" name="Analizador_del_DOM_.28DOMParser.29">Analizador del DOM (DOMParser)</h4>
+
+<ul>
+ <li>Cuando se inicia una instancia del <code>DOMParser</code>, se hereda el código de la llamada principal y los códigos <code>documentURI</code> y <code>baseURI</code> de la ventana del constructor de donde viene.</li>
+ <li>Si elllamante tiene privilegios UniversalXPConnect, puede pasar parámetros a <code>new DOMParser()</code>. Si se pasan menos de tres parámetros, los parámetros restantes se pasarán con el valor <code>null</code>.
+  <ul>
+   <li>El primer parámetro es el principal a usar; esto sobre-escribe el valor heredado del principal.</li>
+   <li>El segundo parámetro es la <code>documentURI</code> a usar.</li>
+   <li>El tercer parámetro es la <code>baseURI</code> a usar.</li>
+  </ul>
+ </li>
+ <li>Si inicias un <code>DOMParser</code> usando un contrato como <code>createInstance()</code>, y no llamas al método <code>init()</code> de <code>DOMParser</code>, al intentar iniciar la operación de análisis, se creará automáticamente una <code>DOMParser</code> con un principal nulo y un puntero <code>null</code> a <code>documentURI</code> y <code>baseURI</code>.</li>
+</ul>
+
+<h4 id="Interfaces_eliminados" name="Interfaces_eliminados">Interfaces eliminados</h4>
+
+<p>Los siguientes interfaces han sido eliminados en Gecko 1.9, que es el motor de Firefox 3. Si tu extensión hace uso de cualquiera de estos interfaces, necesitas actualizar tu código:</p>
+
+<ul>
+ <li><code>nsIDOMPaintListener</code></li>
+ <li><code>nsIDOMScrollListener</code></li>
+ <li><code>nsIDOMMutationListener</code></li>
+ <li><code>nsIDOMPageTransitionListener</code></li>
+ <li><code>nsICloseAllWindows</code> (see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=386200" title='FIXED: SeaMonkey only: no "view cert button" in untrusted cert error dialog'>error 386200</a>)</li>
+</ul>
+
+<h3 id="Paso_4_Comprueba_los_cambios_importantes_en_el_chrome" name="Paso_4:_Comprueba_los_cambios_importantes_en_el_chrome">Paso 4: Comprueba los cambios importantes en el chrome</h3>
+
+<p>Ha habido un cambio pequeño en el chrome que puede requerir cambis en tu código. Se ha añadido un nuevo <code>vbox</code> llamado "browser-bottombox", que integra la barra de búsqueda y la barra de estado en la parte baja de la ventana del navegador. Aunque esto no afecta a la apariencia de la pantalla, puede que afecte a tu extensión si está hace uso de los elementos descritos.</p>
+
+<p>Por ejemplo, si has recubierto algún elemento del chrome antes de la barra de estado de esta manera:</p>
+
+<pre>&lt;window id="main-window"&gt;
+  &lt;something insertbefore="status-bar" /&gt;
+&lt;/window&gt;
+</pre>
+
+<p>Debes cambiar tu código a algo como:</p>
+
+<pre>&lt;vbox id="browser-bottombox"&gt;
+  &lt;something insertbefore="status-bar" /&gt;
+&lt;/vbox&gt;
+</pre>
+
+<p>O usar la siguiente técnica para hacer que el recubrimiento funciones tanto en Firefox 2 como Firefox 3:</p>
+
+<pre>&lt;window id="main-window"&gt;
+  &lt;vbox id="browser-bottombox" insertbefore="status-bar"&gt;
+    &lt;something insertbefore="status-bar" /&gt;
+  &lt;vbox&gt;
+&lt;/window&gt;
+</pre>
+
+<div class="note">
+<p><strong>Nota:</strong> Este cambio es efectivo a partir de Firefox 3 beta 4.</p>
+</div>
+
+<h3 id="Otros_cambios" name="Otros_cambios">Otros cambios</h3>
+
+<p><em>Añade los cambios sencillos que tengas que realizar al actualizar tu extensión para que funciones con Firefox 3.</em></p>
+
+<ul>
+ <li><code><a class="external" rel="freelink">chrome://browser/base/utilityOverlay.js</a></code> ya no está implementado por razones de seguridad. Si estabas usando esto, debes cambiarlo a <code><a class="external" rel="freelink">chrome://browser/content/utilityOverlay.js</a></code>.</li>
+ <li>Las implementaciones de <code><a href="/es/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAboutModule" title="">nsIAboutModule</a></code> ahora requieren implementar el método <code>getURIFlags</code>. Ver <a href="https://dxr.mozilla.org/mozilla-central/source/netwerk/protocol/about/public/nsIAboutModule.idl" rel="custom">nsIAboutModule.idl</a> para más información. Esto afecta a las extensiones que ofezcan nuevas URI del tipo <code>about:</code>. (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=337746" title='FIXED: [FIX]Move "safe about" hardcoding out of security manager'>error 337746</a>)</li>
+ <li>El elemento <code><a href="/es/docs/Mozilla/Tech/XUL/tabbrowser" title="tabbrowser">tabbrowser</a></code> ya no forma parte de "toolkit" (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=339964" title="FIXED: move tabbrowser.xml out of mozilla/toolkit and into mozilla/browser">error 339964</a>). Esto significa que este elemento ya no está visible en las aplicaciones o extensiones XUL. Este elmento sigue siendo parte de la ventana principal de Firefox (browser.xul).</li>
+ <li>Cambios en <a href="/es/NsISupports_proxies" title="es/NsISupports_proxies">nsISupports proxies</a></li>
+</ul>
+
+<p>Es necesario documentar los interfaces a y los relacionados con sus hilos.</p>
+
+<ul>
+ <li>Si usas instrucciones de proceso XML, tales como <code>&lt;?xml-stylesheet ?&gt;</code> en tus archivos XUL, ten en cuenta los cambios expuestos en <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=319654" title="FIXED: Processing instructions in XUL are not added to the content model">error 319654</a>:
+
+  <ol>
+   <li>Se añade al DOM del documento XUL, los XML PIs. Esto significa que <a href="/es/docs/Web/API/Document/firstChild" title="La documentación acerca de este tema no ha sido escrita todavía . ¡Por favor  considera contribuir !"><code>document.firstChild</code></a> no tiene garantía de ser el elemento raiz. Si necesitas referenciar el documento raiz en tu script, usa <a href="/es/docs/Web/API/Document/documentElement" title="Solo-lectura"><code>document.documentElement</code></a> en su lugar.</li>
+   <li>Las instrucciones de proceso <code>&lt;?xml-stylesheet ?&gt;</code> y <code>&lt;?xul-overlay ?&gt;</code> no tienen ahora efecto fuera del prologo del documento.</li>
+  </ol>
+ </li>
+ <li>Cuando se carga contenido web (se carga la página en el navegador) no se inicia <code>window.addEventListener("load", myFunc, true)</code>. Esto ocurre por que <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=296639" title="FIXED: Split windows into an inner and outer object">error 296639</a> cambia la forma de comunicación entre las ventanas internas y externas. La forma fácil de corregir esto, es usar <code>gBrowser.addEventListener("load", myFunc, true)</code>, según se describe <a href="/es/Code_snippets/Tabbed_browser#Detecting_page_load" title="es/Code_snippets/Tabbed_browser#Detecting_page_load">aquí</a> y que funciona también en Firefox 2.</li>
+ <li><code>content.window.getSelection()</code> ofrece un objeto (que puede ser convertido en cadena con <code>toString()</code>), mientras que se desaconseja el uso de <code>content.document.getSelection()</code> que devuelve una cadena</li>
+ <li>Se desaconseja, a partir de Firefox 2, el uso de <code>event.preventBubble()</code> y por tanto ha desaparecido en Firefox 3. En su lugar, usa <a href="/es/DOM/event.stopPropagation" title="es/DOM/event.stopPropagation"><code>event.stopPropagation()</code></a>, que también funciona en Firefox 2.</li>
+ <li>Los contadores de tiempo que se inician usando <code>setTimeout()</code>, ahora están bloqueados por las ventanas en modo 'modal' por el ajuste hecho por <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=52209" title="FIXED: JS timers can fire while a modal dialog is open">error 52209</a>. En su lugar, deberías usar <code>nsITimer</code>.</li>
+ <li>Si tu extensión necesita permitir una fuente no fiable (por ejemplo un sitio web) para acceder al chrome de la extensión, debes usar el nuevo flag <a href="/es/Chrome_Registration#contentaccessible" title="es/Chrome_Registration#contentaccessible"><code>contentaccessible</code> flag</a>.</li>
+</ul>
diff --git a/files/es/orphaned/actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_mozilla/index.html b/files/es/orphaned/actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_mozilla/index.html
new file mode 100644
index 0000000000..37200af055
--- /dev/null
+++ b/files/es/orphaned/actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_mozilla/index.html
@@ -0,0 +1,56 @@
+---
+title: Actualizar una extensión para que soporte múltiples aplicaciones de Mozilla
+slug: >-
+  orphaned/Actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_Mozilla
+tags:
+  - Complementos
+  - Todas_las_Categorías
+  - extensiones
+original_slug: Actualizar_una_extensión_para_que_soporte_múltiples_aplicaciones_de_Mozilla
+---
+<p> </p>
+<p>Este artículo muestra cómo coger una extensión existente y actualizarla para que pueda ser utilizada en otras aplicaciones de Mozilla. Utilizaremos como base la extensión de visualización de stocks creada en los artículos anteriores de esta serie, actualizándola para que pueda ser utilizada en Thunderbird y Sunbird (las anteriores versiones sólo funcionaban en Firefox).</p>
+<p>Si aún no has creado una extensión o te gustaría refrescar la memoria, echa una ojeada a los anteriores artículos de la serie:</p>
+<ul> <li><a href="/es/Crear_una_extensi%C3%B3n_en_la_barra_de_estado" title="es/Crear_una_extensión_en_la_barra_de_estado">Crear una extensión en la barra de estado</a></li> <li><a href="/es/Crear_una_extensi%C3%B3n_din%C3%A1mica_en_la_barra_de_estado" title="es/Crear_una_extensión_dinámica_en_la_barra_de_estado">Crear una extensión dinámica en la barra de estado</a></li> <li><a href="/es/A%C3%B1adir_preferencias_a_una_extensi%C3%B3n" title="es/Añadir_preferencias_a_una_extensión">Añadir preferencias a una extensión</a></li> <li><a href="/es/Traducir_una_extensi%C3%B3n" title="es/Traducir_una_extensión">Traducir una extensión</a></li>
+</ul>
+<h2 id="Descargar_el_ejemplo">Descargar el ejemplo</h2>
+<p>Puedes descargar el código de ejemplo de este artículo para que puedas compararlo con el artículo o para utilizarlo como base para tu propia extensión.</p>
+<ul> <li><a class="external" href="http://developer.mozilla.org/samples/extension-samples/stockwatcher-multiapp.zip">Descargar el ejemplo</a></li>
+</ul>
+<h2 id="Actualizar_el_manifiesto_de_instalaci.C3.B3n">Actualizar el manifiesto de instalación</h2>
+<p>El primer paso es revisar el <a href="/es/Manifiesto_de_instalaci%C3%B3n" title="es/Manifiesto_de_instalación">manifiesto de instalación</a> para indicar que puede ser instalado en Thunderbird y Sunbird. Esto se hace añadiendo nuevas etiquetas <code>&lt;targetApplication&gt;</code> al fichero <code>install.rdf</code>, como esta:</p>
+<pre>    &lt;!-- Describe las versiones de Thunderbird soportadas --&gt;
+
+    &lt;em:targetApplication&gt;
+      &lt;Description&gt;
+        &lt;em:id&gt;{3550f703-e582-4d05-9a08-453d09bdfdc6}&lt;/em:id&gt;
+        &lt;em:minVersion&gt;1.5&lt;/em:minVersion&gt;
+        &lt;em:maxVersion&gt;2.0.0.*&lt;/em:maxVersion&gt;
+      &lt;/Description&gt;
+    &lt;/em:targetApplication&gt;
+
+    &lt;!-- Describe las versiones de Sunbird soportadas --&gt;
+
+    &lt;em:targetApplication&gt;
+      &lt;Description&gt;
+        &lt;em:id&gt;	{718e30fb-e89b-41dd-9da7-e25a45638b28}&lt;/em:id&gt;
+        &lt;em:minVersion&gt;0.2&lt;/em:minVersion&gt;
+        &lt;em:maxVersion&gt;0.4.*&lt;/em:maxVersion&gt;
+      &lt;/Description&gt;
+    &lt;/em:targetApplication&gt;
+</pre>
+<p>Estos dos bloques indican que la extensión soporta las versiones de la 1.5 a la 2.0.0.x de Thunderbird y las de la 0.2 a la 0.4.x de Sunbird.</p>
+<p>Después de introducir este código, puedes instalar la extensión en Firefox, Thunderbird o Sundbird, aunque no obtendrás ningún efecto ni en Thunderbird ni en Sunbird.</p>
+<p>Esto pasa porque no hay nada que le diga a esas dos aplicaciones qué hacer con el chrome proporcionado por la extensión. Ahí es donde el <a href="/es/Manifiesto_chrome" title="es/Manifiesto_chrome">manifiesto chrome</a> entra en acción.</p>
+<h2 id="Actualizar_el_manifiesto_chrome">Actualizar el manifiesto chrome</h2>
+<p>¿Recuerdas el <a href="/es/Crear_una_extensi%C3%B3n_en_la_barra_de_estado" title="es/Crear_una_extensión_en_la_barra_de_estado">primer artículo de la serie</a> cuando creamos nuestro manifiesto chrome, el cual no hemos tocado desde entonces? Es hora de tocarlo. Como podrás (o no) recordar, dicho fichero le dice a la aplicación sobre qué código XUL necesita la interfaz de tu extensión ser mezclada.</p>
+<p>Para Firefox, sobrecargamos el <code>browser.xul</code>, que describe la ventana del navegador de Firefox. Necesitamos añadir líneas al manifiesto para Thunderbird y Sunbird, así:</p>
+<pre># Thunderbird
+overlay chrome://messenger/content/messenger.xul chrome://stockwatcher2/content/stockwatcher2.xul
+
+# Sunbird
+
+overlay chrome://calendar/content/calendar.xul chrome://stockwatcher2/content/stockwatcher2.xul
+</pre>
+<p>Estas líneas provocan que la ventana principal con la lista de mensajes de Thunderbird y la ventana principal en Sundbird sean el objetivo de la sobrecarga que aplicaremos en el fichero <code>stockwatcher2.xul</code>.</p>
+<p>Con estos dos simples giros, esta extensión funcionará en las tres aplicaciones y lo harà exactamente de la misma forma en todas ellas.</p>
diff --git a/files/es/orphaned/code_snippets/index.html b/files/es/orphaned/code_snippets/index.html
new file mode 100644
index 0000000000..df85e46756
--- /dev/null
+++ b/files/es/orphaned/code_snippets/index.html
@@ -0,0 +1,6 @@
+---
+title: Code snippets
+slug: orphaned/Code_snippets
+original_slug: Code_snippets
+---
+This page was auto-generated because a user created a sub-page to this page.
diff --git a/files/es/orphaned/code_snippets/pestañas_del_navegador/index.html b/files/es/orphaned/code_snippets/pestañas_del_navegador/index.html
new file mode 100644
index 0000000000..cbb4016861
--- /dev/null
+++ b/files/es/orphaned/code_snippets/pestañas_del_navegador/index.html
@@ -0,0 +1,14 @@
+---
+title: Pestañas del navegador
+slug: orphaned/Code_snippets/Pestañas_del_navegador
+tags:
+  - Add-ons
+  - extensiones
+  - fragmentos de código
+  - pestañas
+original_slug: Code_snippets/Pestañas_del_navegador
+---
+<p>Aquí encontrará un conjunto de fragmentos de código útiles que lo ayudarán a trabajar con las pestañas del navegador Firefox. Los comentarios generalmente indican dónde debe insertar su propio código.</p>
+<p>Cada fragmento normalmente incluye algún código para ejecutarse al inicio, esto se implementa mejor usando un <a href="/en/Extension_Frequently_Asked_Questions#Why_doesn.27t_my_script_run_properly.3F" title="en/Extension_Frequently_Asked_Questions#Why_doesn.27t_my_script_run_properly.3F">"listener" al cargar la página</a>. Estos fragmentos asumen que son ejecutados en un contexto de una ventana de navegador. Si quiere trabajar con pestañas de una ventana que no es un navegador, necesita tener referencia a una primero, mire <a href="/en/Working_with_windows_in_chrome_code" title="en/Working_with_windows_in_chrome_code">Trabajando con ventanas en código chrome</a> para más detalles.</p>
+<h3 id="Getting_access_to_the_browser">Múltiples significados para la palabra "browser"</h3>
+<p>La palabra 'browser' es usada de varias maneras. Of course the entire application Firefox is called "a browser". Within the Firefox browser are tabs and inside each tab is a browser, both in the common sense of a web page browser and the XUL sense of a {{ XULElem("browser") }} element. Furthermore another meaning of 'browser' in this document and in some Firefox source is "the tabbrowser element" in a Firefox XUL window.</p>
diff --git a/files/es/orphaned/creación_de_componentes_xpcom/interior_del_componente/index.html b/files/es/orphaned/creación_de_componentes_xpcom/interior_del_componente/index.html
new file mode 100644
index 0000000000..c53b748bc7
--- /dev/null
+++ b/files/es/orphaned/creación_de_componentes_xpcom/interior_del_componente/index.html
@@ -0,0 +1,217 @@
+---
+title: Interior del Componente
+slug: orphaned/Creación_de_Componentes_XPCOM/Interior_del_Componente
+tags:
+  - Todas_las_Categorías
+  - XPCOM
+original_slug: Creación_de_Componentes_XPCOM/Interior_del_Componente
+---
+<p></p><div class="prevnext" style="text-align: right;">
+    <p><a href="/es/docs/Creación_de_Componentes_XPCOM:Using_XPCOM_Components" style="float: left;">« Anterior</a><a href="/es/docs/Creación_de_Componentes_XPCOM:Creating_the_Component_Code">Siguiente  »</a></p>
+</div> En el capítulo anterior describimos los componentes desde una perspectiva de un cliente de los componentes XPCOM, en este capútulo abordamos los componentes desde la perspectiva del desarrollador del programa. Léelo para ver como se implementan generalmente los componentes en XPCOM, o puedes brincarte al siguiente capítulo, donde el tutorial del componente WebLock te lleva paso a paso através del proceso de creación del componente. <span class="comment">XXX mediawiki...</span><span class="comment">XXX sucks</span><p></p>
+
+<h3 id="Creaci.C3.B3n_de_Componentes_en_C.2B.2B" name="Creaci.C3.B3n_de_Componentes_en_C.2B.2B">Creación de Componentes en C++</h3>
+
+<p>Empecemos por examinar como se escriben en C++ los componentes XPCOM. El tipo más común de componente es el escrito en C++ y compilado en una biblioteca compartida (una <abbr title="Dynamic Link Library">DLL</abbr> en un sistema Windows o una <abbr title="Dynamic Shared Object">DSO</abbr> en Unix).</p>
+
+<p>La imagen de abajo muestra la relación básica entre una biblioteca que contiene la implementación del código del componente que escribiste y la plataforma XPCOM en sí misma. En este diagrama, la superficie más externa del módulo es la biblioteca compartida en la que se define un componente.</p>
+
+<p><span id="Un_Componente_en_la_Plataforma_XPCOM"><a id="Un_Componente_en_la_Plataforma_XPCOM"></a><strong>Un Componente en la Plataforma XPCOM</strong></span></p>
+
+<p><img alt="Image:component-internals-framework.png"></p>
+
+<p>Cuando construyes un componente o un módulo y lo compilas dentro de una biblioteca, debe exportar un método llamado <code>NSGetModule</code>. Esta función <code>NSGetModule</code> es el punto de acceso a la biblioteca. Es llamado durante el registro y el desregistro del componente y cuando XPCOM quiere descubrir qué interfaces o clases implementa el módulo/biblioteca. En este capítulo abordaremos todo este proceso.</p>
+
+<p>Como ilustra <a href="#Un_Componente_en_la_Plataforma_XPCOM">Un Componente en la Plataforma XPCOM</a>, además del punto de acceso <code>NSGetModule</code>, están las interfaces <code>nsIModule</code> y <code>nsIFactory</code> que controlan la creación actual del componente y también las partes XPCOM glue y cadenas, que discutiremos un poco a detalle en la siguiente sección (Ve <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Interior_del_Componente#XPCOM_Glue">XPCOM Glue</a>). Estas nos darán utilidades para desarrollo fácil más adelante como son punteros inteligentes, soporte de módulos genéricos e implementaciones simples de cadenas. La parte más larga y posiblemente la más compleja de un componente es el código específico del componente en sí mismo.</p>
+
+<div class="side-note">
+<p><span id="%C2%BFPero_D%C3%B3nde_Est%C3%A1n_los_Componentes?"><a id="%C2%BFPero_D%C3%B3nde_Est%C3%A1n_los_Componentes?"></a><strong>¿Pero Dónde Están los Componentes?</strong></span></p>
+
+<p>Los componentes residen en módulos y esos módulos son definidos en bibliotecas compartidas típicamente situadas en el directorio<em>components</em> de una aplicación XPCOM.</p>
+
+<p>Un conjunto de bibliotecas son almacenadas por defecto en este directorio components es lo que hay en una típica instalación de Gecko, dando la funcionalidad que consiste en trabajo en red, layout, composición, una interfaz de usuario multiplataforma y otros.</p>
+
+<p>Otra vista aún más básica de esta relación de componentes a archivos e interfaces que los definen se muestra en <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Creaci%c3%b3n_del_C%c3%b3digo_del_Componente">Vista de Papel Cebolla de la creación del Componente XPCOM</a> en el próximo capítulo. El componente es una abstracción situada entre el módulo actual en el que se implementa y los objetos que el código de su factoría crea para que uso de los clientes.</p>
+</div>
+
+<h3 id="Inicializaci.C3.B3n_de_XPCOM" name="Inicializaci.C3.B3n_de_XPCOM">Inicialización de XPCOM</h3>
+
+<p>Para entender porqué y cuándo tu biblioteca de componentes es llamada, es importante entender el proceso de inicialización de XPCOM. Cuando inicia una aplicación, la aplicación puede<em>inicializar</em> XPCOM. La secuencia de eventos que lanza esta inicialización de XPCOM pueden ser lanzados por una ccioón del usuario o por el inicio de la aplicación en sí misma. Un buscador web que tiene embebido Gecko, por ejemplo, puede inicializar XPCOM al inicio atravéz de APIs embebidas. Otra aplicación puede este inicio hasta que XPCOM se necesite por primera vez. En otro caso, la secuencia de inicialización dentro de XPCOM es la misma.</p>
+
+<p>XPCOM inicia cuando la aplicación hace una llamada para inicializarlo. Los parámetros pasados a esta llamada de inicialización te permiten configurar algunos aspectos de XPCOM, incluyendo la personalización de la ubicación de directorios específicos. El propósito principal del API en este punto es cambiar que directorio<em>components</em> inspecciona cuando busca componentes XPCOM. Así es como se usa el API, por ejemplo, en el<em>Gecko Runtime Environment</em> (GRE).</p>
+
+<div class="side-note">
+<p><span id="Inicializaci%C3%B3n_de_XPCOM"><a id="Inicializaci%C3%B3n_de_XPCOM"></a><strong>Inicialización de XPCOM</strong></span></p>
+
+<p>Los seis pasos básicos para arrancar XPCOM son los siguientes:</p>
+
+<ol>
+ <li>La aplicación inicia XPCOM.</li>
+ <li>XPCOM envía una notificación que inicia el arranque.</li>
+ <li>XPCOM encuentra y procesa el<em>manifiesto del componente</em> (ve <a href="#Manifiestos_de_Componentes">Manifiestos de Componentes</a> abajo).</li>
+ <li>Si hay nuevos componentes, XPCOM los registra:
+  <ol>
+   <li>XPCOM llama el arranque del autoregistro.</li>
+   <li>XPCOM registra los nuevos componentes.</li>
+   <li>XPCOM llama el fin del autoregistro.</li>
+  </ol>
+ </li>
+ <li>Arranque completo de XPCOM: XPCOM notifica que ha iniciado.</li>
+</ol>
+
+<p>Los manifiestos de Componentes y bibliotecas de tipos son descritos en la siguiente sección, <a href="#Registro_de_Manifiestos_de_XPCOM">Registro de Manifiestos de XPCOM</a>.</p>
+</div>
+
+<h4 id="Registro_de_Manifiestos_de_XPCOM" name="Registro_de_Manifiestos_de_XPCOM">Registro de Manifiestos de XPCOM</h4>
+
+<p>XPCOM usa archivos especiales llamados manifiestos para cambiar y guardar información acerca de los componentes en el sistema local. Hay dos tipos de manifiestos que usa XPCOM para cambiar componentes:</p>
+
+<h5 id="Manifiestos_de_Componente" name="Manifiestos_de_Componente">Manifiestos de Componente</h5>
+
+<p>Cuando XPCOM inicia por primera vez, busca el<em>manifiesto de componentes</em> que es un archivo que lista todos los componentes registrados y guarda detalles de lo que exactamente puede hacer cada componente. XPCOM usa el manifiesto de componentes para determinar que componentes han sido sobreescritos. Empezando en Mozilla 1.2, este archivo es llamado <code>compreg.dat</code> y existe en el directorio<em>components</em>, pero hay esfuerzos por moverlo fuera de esta ubicación a una ubicación menos centrada en la aplicación y más centrada en el usuario. Cualquier aplicación bassada en Gecko puede escoger ponerlo en otro lado. XPCOM lee este archivo dentro de una base de datos en memoria.</p>
+
+<div class="side-note">
+<p><span id="Manifiestos_de_Componentes"><a id="Manifiestos_de_Componentes"></a><strong>Manifiestos de Componentes</strong></span></p>
+
+<p>El manifiesto de componente es una correlación de archivos a componentes y de componentes a clases. Especifica la siguiente información:</p>
+
+<ul>
+ <li>Ubicación en disco de los componentes registrados con el tamaño de archivo</li>
+ <li>ID de Clase relacionado a la Ubicación.</li>
+ <li>Contract ID relacionado al ID de Clase.</li>
+</ul>
+
+<p>El manifiesto del componente relaciona archivos de componentes a identificadores únicos para las implementaciones específicas (IDs de Clase), que en su momento son relacionados a identificadores de componente más generales (contract IDs).</p>
+</div>
+
+<h5 id="Manifiestos_de_Bibliotecas_de_Tipos" name="Manifiestos_de_Bibliotecas_de_Tipos">Manifiestos de Bibliotecas de Tipos</h5>
+
+<p>Otro archivo importante que lee XPCOM es el<em>manifiesto de bibliotecas de tipos</em>. Este archivo tambien se localiza en el directorio<em>components</em> y se llama <code>xpti.dat</code>. Incluye la ubicación y direcciones de búsqueda de todas las bibliotecas de tipos en el sistema. este archivo también lista todas las interfaces conocidas y enlaces a los archivos de bibliotecas de tipos que definen estas estructuras de interfaces. Estos archivos de bibliotecas de tipos son el core para que XPCOM pueda ser script y de la arquitectura de componentes binarios de XPCOM.</p>
+
+<div class="side-note">
+<p><span id="Manifiestos_de_Bibliotecas_de_Tipos"><a id="Manifiestos_de_Bibliotecas_de_Tipos"></a><strong>Manifiestos de Bibliotecas de Tipos</strong></span> Los manifiestos de bibliotecas de tipos contienen la siguiente información:</p>
+
+<ul>
+ <li>ubicación de todos los archivos de bibliotecas de tipos</li>
+ <li>correlación de todas las interfaces conocidas y bibliotecas de tipos donde están definidas estas estructuras.</li>
+</ul>
+</div>
+
+<p>Using the data in these two manifests, XPCOM knows exactly which component libraries have been installed and what implementations go with which interfaces. Additionally, it relates the components to the type libraries in which the binary representations of the interfaces they support are defined.</p>
+
+<p>The next section describes how to hook into the XPCOM startup and registration process and make the data about your component available in these manifests, so that your component will be found and registered at startup.</p>
+
+<h4 id="M.C3.A9todos_de_Registro_en_XPCOM" name="M.C3.A9todos_de_Registro_en_XPCOM">Métodos de Registro en XPCOM</h4>
+
+<div class="side-note">
+<p><span id="What_Is_XPCOM_Registration?"><a id="What_Is_XPCOM_Registration?"></a><strong>What Is XPCOM Registration?</strong></span></p>
+
+<p>In a nutshell, registration is the process that makes XPCOM aware of your component(s). As this section and the next describe, you can register your component explicitly during installation, or with the <code>regxpcom</code> program, or you can use the autoregistration methods in the Service Manager to find and register components in a specified components directory:</p>
+
+<ul>
+ <li>XPInstall APIs</li>
+ <li><code>regxpcom</code> command-line tool</li>
+ <li><code>nsIComponentRegistrar</code> APIs from Service Manager</li>
+</ul>
+
+<p>The registration process is fairly involved. This section introduces it in terms of XPCOM initialization, and the next chapter describes what you have to do in your component code to register your component with XPCOM.</p>
+</div>
+
+<p>Once the manifest files are read in, XPCOM checks to see if there are any components that need to be registered. There are two supported ways to go about registering your XPCOM component. The first is to use<em>XPInstall</em>, which is an installation technology that may or may not come with a Gecko application and provides interfaces for registering your component during installation. Another, more explicit way to register your component is to run the application <code>regxpcom</code>, which is built as part of Mozilla and is also available in the Gecko SDK. <code>regxpcom</code> registers your component in the default component registry.</p>
+
+<p>A Gecko embedding application may also provide its own way of registering XPCOM components using the interface that is in fact used by both XPInstall and <code>regxpcom</code>, <code>nsIComponentRegistrar</code>. An application, for example, could provide a "registration-less" component directory whose components are automatically registered at startup and unregistered at shutdown. Component discovery does not currently happen automatically in non-debug builds of Gecko, however.</p>
+
+<p>When the registration process begins, XPCOM broadcasts to all registered observers a notification that says XPCOM has begun the registration of new components. After all components are registered, another notification is fired saying that XPCOM is done with the registration step. The <code>nsIObserver</code> interface that handles this notification is discussed in <a href="es/Creating_XPCOM_Components/Starting_WebLock">Starting WebLock</a>.</p>
+
+<p>Once registration is complete and the notifications have fired, XPCOM is ready to be used by the application. If XPCOM registered your component, then it will be available to other parts of the XPCOM system. The <a href="#XPCOM_Initialization">XPCOM Initialization</a> section in this chapter describes registration in more detail.</p>
+
+<h4 id="Autoregistro" name="Autoregistro">Autoregistro</h4>
+
+<p>The term<em>autoregistration</em> is sometimes used synonymously with registration in XPCOM. In the <a href="#What_Is_XPCOM_Registration?">What Is XPCOM Registration?</a> note, we describe the three ways you can register components with XPCOM. Sometimes, applications use the <code>nsIComponentRegistrar</code> interface and create their own code for watching a particular directory and registering new components that are added there, which is what's often referred to as<em>autoregistration</em>. You should always know what the installation and registration requirements are for the applications that will be using your component.</p>
+
+<h4 id="El_Proceso_de_Paro" name="El_Proceso_de_Paro">El Proceso de Paro</h4>
+
+<p>When the application is ready to shutdown XPCOM, it calls <code>NS_ShutdownXPCOM</code>. When that method is called, the following sequence of events occurs:</p>
+
+<ol>
+ <li>XPCOM fires a shutdown notification to all registered observers.</li>
+ <li>XPCOM closes down the Component Manager, the Service Manager and associated services.</li>
+ <li>XPCOM frees all global services.</li>
+ <li>NS_ShutdownXPCOM returns and the application may exit normally.</li>
+</ol>
+
+<div class="side-note">
+<p><span id="The_Unstoppable_Shutdown"><a id="The_Unstoppable_Shutdown"></a><strong>The Unstoppable Shutdown</strong></span></p>
+
+<p>Note that shutdown observation is unstoppable. In other words, the event you observe cannot be used to implement something like a "Are you sure you want to Quit?" dialog. Rather, the shutdown event gives the component or embedding application a last chance to clean up any leftovers before they are released. In order to support something like an "Are you sure you want to quit" dialog, the application needs to provide a higher-level event (e.g., <code>startShutdown()</code>) which allows for cancellation.</p>
+
+<p>Note also that XPCOM services may deny you access once you have received the shutdown notification. It is possible that XPCOM will return an error if you access the <code>nsIServiceManager</code> at that point, for example, so you may have to keep a reference-counted pointer to the service you are interested in using during this notification.</p>
+</div>
+
+<h4 id="Component_Loaders" name="Component_Loaders">Component Loaders</h4>
+
+<p>Components can be written in many languages. So far this book has been focusing on "native components," shared libraries exporting a <code>NSGetModule</code> symbol. But if there is a<em>component loader</em> for Javascript installed, then you can also write a JavaScript component.</p>
+
+<p>To register, unregister, load and manage various component types, XPCOM abstracts the interface between the XPCOM component and XPCOM with the Component Loader. This loader is responsible for initialization, loading, unloading, and supporting the <code>nsIModule</code> interface on behalf of each component. It is the Component Loader's responsibility to provide scriptable component support.</p>
+
+<p>When building a "native" component, the component loader looks for an exported symbol from the components shared library. "Native" here includes any language that can generate a platform native dynamically loaded library. Scripting languages and other "non-native" languages usually have no way to build native libraries. In order to have "non-native" XPCOM components work, XPCOM must have a special component loader which knows how to deal with these type of components.</p>
+
+<p>XPConnect, for example, provides a component loader that makes the various types, including the interfaces and their parameters, available to JavaScript. Each language supported by XPCOM must have a component loader.</p>
+
+<h4 id="Tres_Partes_de_una_Biblioteca_de_Componentes_XPCOM" name="Tres_Partes_de_una_Biblioteca_de_Componentes_XPCOM">Tres Partes de una Biblioteca de Componentes XPCOM</h4>
+
+<p>XPCOM is like an onion<span class="comment">or a parfait! Everybody likes parfaits</span>. XPCOM components have at least three layers. From the innermost and moving outward these layers include:</p>
+
+<ul>
+ <li>The core XPCOM object</li>
+ <li>The factory code</li>
+ <li>The module code</li>
+</ul>
+
+<p>The core XPCOM object is the object that will implement the functionality you need. For example, this is the object that may start a network download and implement interfaces that will listen to the progress. Or the object may provide a new content type handler. Whatever it does, this object is at the core of the XPCOM component, and the other layers are supporting it, plugging it into the XPCOM system. A single library may have many of these core objects.</p>
+
+<p>One layer above the core object is the factory code. The factory object provides a basic abstraction of the core XPCOM object. <a href="es/Creating_XPCOM_Components/An_Overview_of_XPCOM">An Overview of XPCOM</a> discussed the factory design pattern that's used in a factory object. At this layer of the XPCOM Component Library, the factory objects are factories for the core XPCOM objects of the layer below.</p>
+
+<p>One more layer outward is the module code. The module interface provides yet another abstraction - this time of the factories - and allows for multiple factory objects. From the outside of the component library, there is only the single entry point, <code>NSGetModule()</code>. This point of entry may fan out to any number of factories, and from there, to any number of XPCOM objects.</p>
+
+<p>The following chapter details these layers in terms of the XPCOM interfaces that represent them. Here we will just introduce them. The factory design pattern in XPCOM is represented by the <code>nsIFactory</code> interface. The module layer is represented by the <code>nsIModule</code> interface. Most component libraries only need these two interfaces, along with the <code>nsISupports</code> interface, to have XPCOM load, recognize, and use their core object code.</p>
+
+<p>In the next section, we'll be writing the code that actually compiles into a component library, and you will see how each layer is implemented and how each interface is used. Following this initial, verbose demonstration of the APIs, we will introduce a faster more generic way of implementing the module and factory code using macros, which can make components much easier to create.</p>
+
+<h3 id="XPCOM_Glue" name="XPCOM_Glue">XPCOM Glue</h3>
+
+<p>XPCOM contains a lot of stuff. Most of the XPCOM interfaces are not frozen and are meant to be used only by the Gecko internals, not by clients. XPCOM provides many data structures from linked lists to <a class="external" href="http://en.wikipedia.org/wiki/AVL_tree">AVL trees</a>. Instead of writing your own linked list, it's tempting to reuse <code>nsVoidArray</code> or another publicly available class, but this might be a fatal mistake. At any time the class can change and give you unexpected behavior.</p>
+
+<p>XPCOM makes for a very open environment. At runtime you can acquire any service or component merely by knowing a CID, or Contract ID, and an IID. At last count there were over 1300 interfaces defined in XPIDL. Of those 1300 interfaces, less than 100 were frozen, which means that a developer has a good chance of stumbling upon useful interfaces that aren't frozen. If an interface isn't explicitly marked "FROZEN" in the IDL comments, however - and most of them aren't - it will cause your component to possibly break or crash when the version changes.</p>
+
+<h4 id="La_Biblioteca_Glue" name="La_Biblioteca_Glue">La Biblioteca Glue</h4>
+
+<p>In general you should avoid any unfrozen interfaces, any symbols in XPCOM, or any other part of Gecko libraries that aren't frozen. However, there are some unfrozen tools in XPCOM that are used so often they are practically required parts of component programming.</p>
+
+<p>The smart pointer class, <code>nsCOMPtr</code>, for example, which can make reference counting a lot less tedious and error-prone, is not actually frozen, and neither are <code>nsDebug</code>, a class for aiding in tracking down bugs, or <code>nsMemory</code>, a class to ensure that everyone uses the same heap, generic factory, and module. Instead of asking every developer to find and copy these various files into their own application, XPCOM provides a single library of "not-ready-to-freeze-but-really-helpful" classes that you can link into your application, as the following figure demonstrates.</p>
+
+<p><span id="XPCOM_Glue_and_Tools"><a id="XPCOM_Glue_and_Tools"></a><strong>XPCOM Glue and Tools</strong></span></p>
+
+<p><img alt="Image:xpcom-glue-tools.png"></p>
+
+<p>This is the glue library. It provides a bridge, or "glue" layer, between your component and XPCOM.</p>
+
+<p>A version of the glue library is built into XPCOM, and when your component uses it, it links a snapshot of this library: it includes a copy of these unfrozen classes directly, which allows the XPCOM library version to change without affecting the software. There is a slight footprint penalty to linking directly, but this gives your component freedom to work in any recent environment. If footprint is a big issue in your component or application, you can trim out the pieces you don't need.</p>
+
+<h4 id="Clases_de_Cadenas_de_XPCOM" name="Clases_de_Cadenas_de_XPCOM">Clases de Cadenas de XPCOM</h4>
+
+<p>The base string types that XPCOM uses are <code>nsAString</code> and <code>nsACString</code>. These classes are described in the Mozilla String Guide (see <a href="es/Creating_XPCOM_Components/Resources#Gecko_Resources">Gecko Resources</a>).</p>
+
+<p>The string classes that implement these abstract classes are another set of helpful, unfrozen classes in XPCOM. Most components and embedding applications need to link to some kind of string classes in order to utilize certain Gecko APIs, but the string code that Mozilla uses is highly complex and even more expensive than the glue code in terms of footprint (~100k). <code>nsEmbedString</code> and <code>nsEmbedCString</code> are available as very light string class implementations for component development, especially in small embedded applications. This string implementation does the bare minimum to support <code>nsAString</code>/<code>nsACString</code> string classes.</p>
+
+<p>In your own component, you can go "slim" and restrict yourself to the <code>nsEmbedString</code> or go "hog wild" and use all of the functionality of the other strings. WebLock restricts itself to using the simple <code>nsEmbedString</code> family of classes.</p>
+
+<p><span id="String_Classes_and_XPCOM"><a id="String_Classes_and_XPCOM"></a><strong>String Classes and XPCOM</strong></span></p>
+
+<p><img alt="Image:strings-in-xpcom.png"></p>
+
+<p>The glue library provides stub functions for the public functions that XPCOM provides (see <code><a href="https://dxr.mozilla.org/mozilla-central/source/xpcom/build/nsXPCOM.h" rel="custom">xpcom/build/nsXPCOM.h</a></code>). When the glue library is initialized, it dynamically loads these symbols from the XPCOM library, which allows the component to avoid linking directly with the XPCOM library. You shouldn't have to link to the XPCOM library to create a XPCOM component - in fact, if your component has to, then something is wrong. </p><div class="prevnext" style="text-align: right;">
+    <p><a href="/es/docs/Creating_XPCOM_Components:Using_XPCOM_Components" style="float: left;">« Anterior</a><a href="/es/docs/Creating_XPCOM_Components:Creating_the_Component_Code">Siguiente  »</a></p>
+</div> <p></p><div class="licenseblock">
+<p>Copyright (c) 2003 by Doug Turner and Ian Oeschger. This material may be distributed only subject to the terms and conditions set forth in the <a class="external" href="http://www.opencontent.org/openpub/" rel="noopener">Open Publication License</a>, v1.02 or later. Distribution of substantively modified versions of this document is prohibited without the explicit permission of the copyright holder. Distribution of the work or derivative of the work in any standard (paper) book form is prohibited unless prior permission is obtained from the copyright holder.</p>
+</div><p></p>
diff --git a/files/es/orphaned/creación_de_componentes_xpcom/prefacio/index.html b/files/es/orphaned/creación_de_componentes_xpcom/prefacio/index.html
new file mode 100644
index 0000000000..f9b6448f60
--- /dev/null
+++ b/files/es/orphaned/creación_de_componentes_xpcom/prefacio/index.html
@@ -0,0 +1,40 @@
+---
+title: Prefacio
+slug: orphaned/Creación_de_Componentes_XPCOM/Prefacio
+original_slug: Creación_de_Componentes_XPCOM/Prefacio
+---
+<p>Este es un libro acerca de Gecko, y cómo crear componentes <a href="es/XPCOM">XPCOM</a> para aplicaciones basadas en Gecko. Aunque se hace énfasis en los pasos prácticos que sigues para que hagas tu código C++ dentro de un componente que pueda ser usado en Gecko, esperamos que esos pasos nos den también la ocasión de abordar todas las herramientas, técnicas y tecnologías que integran XPCOM. En consecuencia, este libro es arreglado de tal forma que puedes seguirlo y crear tus propios componentes o aprender distintos tópicos de XPCOM individualmente, como en una guía de referencia. Por ejemplo, la introducción incluye una discusión acerca de lo que son los componentes; y el primer capítulo - en el cual tu compilas un código básico y lo registras en Mozilla - apunta una discusión de la relación entre componentes y módulos de las interfases de XPCOM y del proceso de registro en general.
+</p><p>El principio de cada capítulo provee una lista de los tópicos más importantes tratados. Las secciones en la barra de al lado son incluidas para resaltar detalles técnicos. Al terminar el libro, si hemos hecho nuestro trabajo, habrás aprendido como construir componentes y sabrás algo acerca del framework para esos componentes en Gecko, que es XPCOM.
+</p>
+<h3 id="Quién_debe_leer_este_Libro"> Quién debe leer este Libro </h3>
+<p><a href="es/Creaci%c3%b3n_de_Componentes_XPCOM">Creación de Componentes XPCOM</a> está dirigido a desarrolladores C++. Aunque puedes crear componentes XPCOM en <a href="es/Javascript">Javascript</a> y otros lenguajes y aunque tal vez puedas seguir el libro como programador <a href="es/C">C</a>, el código de implementación está escrito en C++ y mucha de la discusión de cómo hacer tu código <i>dentro</i> de un componente XPCOM empieza desde C++. De cualquier modo no necesitas ser un experto en C++, aunque debes estar familiarizado con ideas básicas como herencia y encapsulación, ideas que cuando es posible son explicadas en el libro donde son usadas. También muchos de los ejemplos son en Javascript, que es usado en Mozilla para accesar componentes XPCOM como objetos script, así que estar familiarizado con ese lenguaje es útil también.
+</p><p>XPCOM significa Cross Platform Component Object Model(Modelo Componente Objeto Multiplataforma), como su nombre lo implica, XPCOM es similar al Microsoft COM, si tienes alguna experiencia con esta tecnología, grán parte de eso puede aplicarse a XPCOM. De cualquier modo este libro no asume ningún conocimiento previo de COM - todas las ideas básicas de COM serán introducidas.
+</p><p>Este libro provee un tutorial de cómo construir un componente XPCOM que controle el comportamiento de búsqueda; aunque XPCOM puede ser usado en muchos ambientes relacionados con búsqueda web, su principal cliente es Gecko, un buscador web embebido de código abierto, que cumple con estándares, donde es más fácil y práctico ilustrar la funcionalidad de XPCOM. Una descripción completa del componente de este turial puede ser encontrada en la sección <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Creaci%c3%b3n_de_el_C%c3%b3digo_del_Componente#En_lo_que_Estaremos_Trabajando">En lo que Estaremos Trabajando</a> de este tutorial.
+</p>
+<div class="note">
+<p>A pesar de lo que dice la documentación, XPCOM no debe ser usado para hacer <a href="es/Plugins">NPAPI plugins</a> script. A partir de la versión 1.7.5 de Gecko(Firefox 1.0) una extensión especial NPAPI para llamar desde script es soportada vea <a href="es/Gecko_Plugin_API_Reference/Scripting_plugins">Scripting plugins</a>.
+</p>
+</div>
+<h3 id="Organización_del_Tutorial"> Organización del Tutorial </h3>
+<p>La siguiente lista da una reseña de de los pasos que seguiremos para crear un componente XPCOM llamado <i>Weblock</i>, el cual provee la funcionalidad de bloqueo de sitios a los buscadores basados en Gecko. Cada uno de estos pasos tiene su propio capitulo, en el que se discuten varios tópicos asociados al paso.
+</p>
+<ul><li> Crear el módulo genérico de módulo para el componente.
+</li><li> Usar macros C++, clases especiales de cadenas y punteros inteligentes para optimizar el código.
+</li><li> Definir la funcionalidad del componente; crear una interfaz <a href="es/XPIDL">XPIDL</a> para esa funcionalidad, crear el código específico para la implementación adaptada de la interfaz del componente <i>Weblock</i>.
+</li><li> Finalizar la implementación del componente <i>Weblock</i>: <code>nsIContentPolicy</code>, E/S de archivos, bloqueo, etc.
+</li><li> Creación de la interfaz de usuario del componente <i>Weblock</i>.
+</li><li> Empaquetar <i>Weblock</i> para su distribución e instalación.
+</li></ul>
+<h3 id="Continuando_con_los_Ejemplos"> Continuando con los Ejemplos </h3>
+<p>Hay dos formas diferentes de tener XPCOM en tu máquina para poder crear componentes. Si ya tienes un Mozilla construído o el código fuente de Mozilla 1.2 o posterior, entonces puedes usar la plataforma XPCOM disponible ahí. Si no tienes las fuentes de Mozilla, entonces puedes bajar el Gecko SDK, que es una colección de librerías y herramientas que componen la plataforma de componentes XPCOM.
+</p><p>No importa si compilas tu código en el directorio de las fuentes de Mozilla o usas el Gecko SDK, puedes construir tus propios componentes que usen los componentes previamente existentes en Gecko. el componente <b>Weblock</b> que describimos en este tutorial es un complemento práctico(y esperamos genuinamente útil) para el navegador. Para poder construirlo, tu Gecko SDK o tus fuentes de Mozilla deben ser versión 1.2 o superior (las interfaces XPCOM en versiones anteriores no fueron completamente congeladas).
+</p><p>Este Libro asume que estas usando el SDK en vez del directorio de las fuentes de Mozilla, de cualquier forma la diferencia entre ambos es mínima. Detalles acerca de cómo obtener el SDK, construir y obtener acceso programático a los componetes de Gecko se dan en el APENDICE del libro, <a href="es/Creaci%c3%b3n_de_Componentes_XPCOM/Configurar_el_Gecko_SDK">Configurar el Gecko SDK</a>.
+</p>
+<h3 id="Convenciones"> Convenciones </h3>
+<p>Las convenciones de formato listadas abajo se usan para designar tipos específicos de información en el libro y hacer las cosas más fáciles de encontrar. El objetivo es usar tan pocos formatos como sea posible, pero distinguir los diferentes tipos de información claramente.
+</p>
+<table class="standard-table"> <tbody><tr> <td class="header">Formato</td> <td class="header">Descripción</td> </tr> <tr> <td><b>bold</b></td> <td><b>nombres de componentes</b> aparecen en negro en el texto</td> </tr> <tr> <td><code>monospace</code></td> <td><code>referencias al código</code>, <code>nombres de interfaces</code> y <code>miembros</code> de interfaces (ejm. <code>createInstance()</code>) aparecen en letra monospaced. Líneas de código aparecen en cajas separadas. También <code>nombres de archivos</code> y <code>directorios</code> aparecen en letra monospaced.</td> </tr> <tr> <td><i>itálica</i></td> <td><i>variables</i> aparecen en letra itálica. Términos importantes y nuevos conceptos también aparecen en letra itálica la primera vez que aparecen en el texto. También aquellos términos que son explicados inmediatamente después de ser citados, o donde se le dice al lector que vaya a una sección en el libro en donde se describen dichos términos a detalle.</td> </tr> <tr> <td>link</td> <td>Referencias a otras secciones, imágenes y tablas también son links a esas secciones.</td> </tr>
+</tbody></table>
+<h3 id="Agradecimientos"> Agradecimientos </h3>
+<p>Gracias a Peter Lubczynski, John Gaunt, Ellen Evans y Alec Flett por sus revisiones técnicas. Un agradecimiento especial a Darin Fisher por sus observaciones tan meticulosas, lectura tan cercana y atención a los detalles.
+</p>
diff --git a/files/es/orphaned/creando_una_extensión/index.html b/files/es/orphaned/creando_una_extensión/index.html
new file mode 100644
index 0000000000..ec7320a54c
--- /dev/null
+++ b/files/es/orphaned/creando_una_extensión/index.html
@@ -0,0 +1,237 @@
+---
+title: Creando una extensión
+slug: orphaned/Creando_una_extensión
+tags:
+  - Complementos
+  - Todas_las_Categorías
+  - extensiones
+original_slug: Creando_una_extensión
+---
+<h2 id="Introducci.C3.B3n" name="Introducci.C3.B3n">Introducción</h2>
+<p>Este tutorial contiene los pasos necesarios para desarrollar una extensión muy básica - la cuál añadirá un texto que diga "¡Hola, mundo!" en el panel de la barra de estado del navegador Firefox</p>
+<div class="note">
+  <p><strong>Nota</strong> Este tutorial sobre el desarrollo de una extensión es para la versión 1.5 de Firefox . Existen otros para versiones anteriores.</p>
+</div>
+<h2 id="Preparando_el_Entorno_de_Desarrollo" name="Preparando_el_Entorno_de_Desarrollo">Preparando el Entorno de Desarrollo</h2>
+<p>Las extensiones se distribuyen en archivos comprimidos en formato ZIP, o en paquetes, con extensión <code>xpi</code> (<em>se pronuncia “zippy”</em>). Los archivos XPI contienen el siguiente código:</p>
+<pre>extension.xpi:
+              /<a href="/es/docs/Install.rdf" title="Install.rdf">install.rdf</a>
+              <a href="#XPCOM_Components">/components/*</a>
+              <a href="#Application_Command_Line">/components/cmdline.js</a>
+              <a href="#Defaults_Files">/defaults/</a>
+              <a href="#Defaults_Files">/defaults/preferences/*.js</a>
+              /plugins/*
+              /<a href="/es/docs/Chrome.manifest" title="Chrome.manifest">chrome.manifest</a>
+              /<a href="/es/docs/Chrome_window_icons" title="Chrome_window_icons">chrome/icons/default/*</a>
+              /chrome/
+              /chrome/content/
+
+</pre>
+<p>Debido a esto, es más fácil presentar nuestros archivos fuente en un modo similar, a menos que decidamos crear alguno del tipo "Makefile" o un script "shell" para comprimirlos todos. Incluso si optamos por este método, es muy sencillo hacer pruebas, gracias al sistema de <em>Addons</em> de Firefox 1.5.</p>
+<p>Aclarado esto comenzamos. Crea una carpeta para tu extensión en algún lugar de tu disco duro, e.j. <code>C:\extensions\my_extension\</code> o <code>~/extensions/my_extension/</code>. (Nota: usa todos los caracteres en minúscula) Dentro de esta carpeta creamos otra carpeta llamada <code>chrome</code>, dentro de <code>chrome</code> creamos otra carpeta llamada <code>content</code>. (En sistemas Unix podemos crear los 3 directorios con el siguiente comando <code>mkdir -p chrome/content</code> dentro del directorio de raíz de la extensión.)</p>
+<p>Dentro de la <strong>raíz</strong> de la carpeta extensión, junto a la carpeta <code>chrome</code>, creamos dos archivos de textos vacíos, uno llamado <code>chrome.manifest</code> y el otro <code>install.rdf</code>.</p>
+<p>Deberías tener algo así:</p>
+<pre>&lt;carpeta extension&gt;\
+          install.rdf
+          chrome.manifest
+          chrome\
+             content\
+</pre>
+<p>Puedes encontrar más tips (ideas) sobre la configuración del ambiente de desarrollo en <a class="external" href="http://kb.mozillazine.org/Setting_up_extension_development_environment">Mozillazine Knowledge Base</a>.</p>
+<h2 id="Crear_el_manifest_de_la_instalaci.C3.B3n" name="Crear_el_manifest_de_la_instalaci.C3.B3n">Crear el manifiesto de la instalación</h2>
+<p>Abre el archivo llamado <code><a href="/es/docs/Manifiesto_de_instalación" title="Manifiesto_de_instalación">install.rdf</a></code> que creaste en la carpeta raíz de tu extensión y escribe lo siguiente en él:</p>
+<pre>&lt;?xml version="1.0"?&gt;
+
+&lt;RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+     xmlns:em="http://www.mozilla.org/2004/em-rdf#"&gt;
+
+  &lt;Description about="urn:mozilla:install-manifest"&gt;
+    &lt;em:id&gt;<strong><a class="link-mailto" href="mailto:sample@foo.net" rel="freelink">sample@foo.net</a></strong>&lt;/em:id&gt;
+    &lt;em:version&gt;<strong>1.0</strong>&lt;/em:version&gt;
+    &lt;em:type&gt;2&lt;/em:type&gt;
+
+    &lt;!-- Target Application this extension can install into,
+         with minimum and maximum supported versions. --&gt;
+    &lt;em:targetApplication&gt;
+      &lt;Description&gt;
+        &lt;em:id&gt;<strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong>&lt;/em:id&gt;
+        &lt;em:minVersion&gt;<strong>1.0+</strong>&lt;/em:minVersion&gt;
+        &lt;em:maxVersion&gt;<strong>1.5.0.*</strong>&lt;/em:maxVersion&gt;
+      &lt;/Description&gt;
+    &lt;/em:targetApplication&gt;
+
+    &lt;!-- Front End MetaData --&gt;
+    &lt;em:name&gt;<strong>¡Ejemplo!</strong>&lt;/em:name&gt;
+    &lt;em:description&gt;<strong>Una extensión de prueba</strong>&lt;/em:description&gt;
+    &lt;em:creator&gt;<strong>Tu nombre aquí</strong>&lt;/em:creator&gt;
+    &lt;em:homepageURL&gt;<strong>http://www.foo.com/</strong>&lt;/em:homepageURL&gt;
+  &lt;/Description&gt;
+&lt;/RDF&gt;
+</pre>
+
+<ul>
+  <li><strong><a class="link-mailto" href="mailto:sample@foo.net" rel="freelink">sample@foo.net</a></strong> - la ID de tu extensión. Esta es una clave que has creado para identificar tu extensión en formato de correo electrónico (nota: esta clave no debería ser tu email). Hazla única. Otra opción es usar un GUID.</li>
+  <li>Especifica <code>&lt;em:type&gt;2&lt;/em:type&gt;</code> -- el 2 indica que una extensión está siendo descrita (mira en <a href="/es/docs/Manifiesto_de_instalación#tipo" title="Manifiesto_de_instalación#tipo">Instalar el manifest#tipo</a> para ver los otros códigos).</li>
+  <li><strong>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</strong> - La ID del programa Firefox.</li>
+  <li><strong>1.0+</strong> - indica la versión mínima de Firefox con la que afirmas que tu extensión funcionará. Establece ésta como la versión mínima con la que te comprometes a comprobar y corregir errores.</li>
+  <li><strong>1.5.0.*</strong> - indica la versión máxima de Firefox con la que afirmas que tu extensión funcionará. ¡Establece ésta como no superior a la máxima versión que esté disponible!</li>
+</ul>
+<p>Mira <a href="/es/docs/Manifiesto_de_instalación" title="Manifiesto_de_instalación">Instalar el manifest</a> para una relación completa de las propiedades tanto obligatorias como opcionales.</p>
+<p>Guarda el archivo.</p>
+<h2 id="Ampliando_el_Navegador_con_XUL" name="Ampliando_el_Navegador_con_XUL">Ampliando el navegador con XUL</h2>
+<p>La interfaz de usuario de Firefox está escrita en XUL y Javascript. <a href="/es/docs/XUL" title="XUL">XUL</a> es una implementación XML que proporciona elementos de la interfaz de usuario como botones, menús, barras de botones etc. Las acciones del usuario se controlan mediante JavaScript. Para ampliar el navegador modificamos o añadimos elementos de la interfaz de usuario. Añadimos nuevos elementos mediante la inserción de nuevos elementos XUL DOM dentro de la ventana del navegador, y los modificamos usando scripts e incluyendo manejadores de eventos.</p>
+<p>El navegador está definido en un archivo XUL llamado <code>browser.xul</code> (<code>$FIREFOX_INSTALL_DIR/chrome/browser.jar</code> que incluye <code>content/browser/browser.xul</code>). En el archivo browser.xul podemos encontrar la barra de estado, definida en aproximadamente estos términos:</p>
+<pre>&lt;statusbar id="status-bar"&gt;
+ ... &lt;statusbarpanel&gt;s ...
+&lt;/statusbar&gt;
+</pre>
+<p><code>&lt;statusbar id="status-bar"&gt;</code> es un "punto de anclaje" para una capa XUL.</p>
+<h3 id="Capas__XUL" name="Capas__XUL">Capas XUL</h3>
+<p><a href="/es/docs/Capas_XUL" title="Capas_XUL">Capas XUL</a> son una manera de añadir un elemento a la interfaz de usuario en un documento XUL durante el tiempo de ejecución. Una capa XUL es un archivo .xul que marca elementos XUL para insertar en puntos de anclaje específicos dentro del "documento maestro". Estos fragmentos  indican que los elementos pueden ser añadidos, modificados o eliminados.</p>
+<p><strong>Ejemplo de documento de capa XUL</strong></p>
+<pre>&lt;?xml version="1.0"?&gt;
+&lt;overlay id="sample"
+         xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"&gt;
+ &lt;statusbar id="<strong>status-bar</strong>"&gt;
+  &lt;statusbarpanel id="my-panel" label="Hello, World"/&gt;
+ &lt;/statusbar&gt;
+&lt;/overlay&gt;
+</pre>
+<p>El <code>&lt;statusbar&gt;</code> llamado <code><strong>status-bar</strong></code> indica el punto de anclaje dentro de la ventana del navegador donde lo queremos incluir.</p>
+<p>El <code>&lt;statusbarpanel&gt;</code> hijo es un nuevo elemento que queremos insertar en el punto de anclaje.</p>
+<p>Copia el código de ejemplo arriba mostrado y guardaló en un archivo llamado <code><strong>sample.xul</strong></code> dentro de la carpeta <code>chrome/content</code> que creó.</p>
+<p>Para más información sobre elementos de inserción y modificar la interfaz de usuario empleando Capas, mira más abajo.</p>
+<h2 id="Chrome_URIs" name="Chrome_URIs">Chrome URIs</h2>
+<p>Los archivos XUL forman parte de "<a href="/es/docs/Chrome_Registration" title="Chrome_Registration">Chrome Packages</a>" - paquetes de componentes de interfaz del usuario, los cuales se cargan a través de la dirección <code>chrome://</code> URIs. Más que cargar el navegador desde el disco utilizando un (archivo) <code>file://</code> URI (ya que la ubicación de Firefox en un sistema puede cambiar de una plataforma a otra y de un sistema a otro), los desarrolladores de Mozilla se decantaron por una solución para crear URI al contexto de XUL,que la aplicación instalada ya conoce.</p>
+<p>La ventana del navegador es: <code><a class="external" rel="freelink">chrome://browser/content/browser.xul</a></code> ¡Prueba a teclear esta dirección URL en la barra de navegación de Firefox!</p>
+<p>Los Chrome URIs constan de varios componentes:</p>
+<ul>
+  <li>En primer lugar, la <strong>URI scheme</strong> Esquema URI (<code>chrome</code>) informa a la librería de red de Firefox de que es un 'Chrome URI' y que el contenido que se cargue debe ser manejado de manera especial.</li>
+  <li>En segundo lugar, un nombre de paquete (en el ejemplo superior utilizamos <code><strong>browser</strong></code>), que identifica la extension en la interfaz del usuario. Este nombre debe ser, en un caso ideal, único, de esa manera se evitará el conflicto entre extensiones.</li>
+  <li>En tercer lugar, el tipo de información que ofrece el archivo. Hay tres tipos: <code>content</code> (XUL, JavaScript, XBLs, etc. que forman la estructura y el comportamiento de una aplicación UI), <code>locale</code> (DTD, archivos .propiedades, etc., que contienen cadenas para la <a href="/es/docs/Localization" title="Localization">localization</a> del UI), y <code>skin</code> (CSS e imágenes que forman el <a href="/es/docs/Theme" title="Theme">theme</a> del UI)</li>
+  <li>En último lugar, la ruta del archivo a cargar.</li>
+</ul>
+<p>Por lo tanto, <code><a class="external" rel="freelink">chrome://foo/skin/bar.png</a></code> carga el archivo <code>bar.png</code> de la sección <code>skin</code>, del tema <code>foo</code>.</p>
+<p>Cuando cargas contenido usando un Chrome URI, Firefox usa el Chrome Registry para traducir esos URIs en los archivos fuentes en el disco (o en paquetes JAR).</p>
+<h2 id="Creando_un_Chrome_manifest" name="Creando_un_Chrome_manifest">Creando un Chrome manifest</h2>
+<p>Para más información sobre el Chrome manifest y las propiedades que soporta, mira la referencia <a href="/es/docs/Chrome_Manifest" title="Chrome_Manifest">Chrome Manifest</a>.</p>
+<p>Abre el archivo llamado <code><strong>chrome.manifest</strong></code> que creaste en el directorio <code>chrome</code> en la raìz de la jerarquía de la carpeta orìgen de la extensión</p>
+<p>Agrega este código:</p>
+<pre>content     sample    chrome/content/
+</pre>
+<p>(<strong>¡No te olvides de la barra oblicua, "<code>/</code>"!</strong> sin ella, la extensión no se cargará.)</p>
+<p>Esto especifica lo siguiente:</p>
+<ol>
+  <li>Tipo de material dentro de un paquete chrome.</li>
+  <li>Nombre del paquete chrome (Asegúrate de usar todos los caracteres en minúscula para el nombre del paquete "sample", ya que Firefox/Thunderbird no lo soporta en la versión 2 y anteriores - {{ Bug(132183) }})</li>
+  <li>Localización de los archivos del paquete chrome.</li>
+</ol>
+<p>Esta línea dice que para obtener una muestra del paquete chrome, debemos encontrar los archivos de <strong>content</strong> en la ruta <code>chrome/content</code>, la cual es relativa a la ruta de <code>chrome.manifest</code>.</p>
+<p>Nótese que el contenido, los archivos de idioma y los del skin, deben mantenerse dentro de carpetas llamadas <strong>content</strong> (para contenido), <strong>locale</strong> (para idioma) y <strong>skin</strong> dentro de tu subdirectorio <code>chrome</code>.</p>
+<p>Salva los cambios del archivo. Cuando inicies Firefox con tu extensión, (lo cual se hará despues en este tutorial), aquel-Firefox- registrará el chrome del paquete.</p>
+<h2 id="Registrar_un_Overlay" name="Registrar_un_Overlay">Registrar un Overlay</h2>
+<p>Necesitas que Firefox fusione tu overlay con la ventana del browser cada vez que se muestra, por lo que añade esta línea a tu archivo <code>chrome.manifest</code>:</p>
+<pre>overlay <a class="external" rel="freelink">chrome://browser/content/browser.xul</a> <a class="external" rel="freelink">chrome://sample/content/sample.xul</a>
+</pre>
+<p><br>
+  Esto le dice a Firefox que fusione <code>sample.xul</code> con <code>browser.xul</code> cuando <code>browser.xul</code> se cargue.</p>
+<h2 id="Pruebas" name="Pruebas">Pruebas</h2>
+<p>Primero, necesitamos informar a Firefox acerca de tu extensión. En los malos y viejos tiempos de Firefox 1.0, ésto significaba empaquetar tu extensión como un XPI e instalarlo a través de la interfaz de usuario, lo que era engorroso. Ahora es mucho más simple.</p>
+<ol>
+  <li>Abre tu <a class="external" href="http://kb.mozillazine.org/Profile_folder">carpeta Profiles</a> y adentrate en el perfil con el que deseas trabajar (e.g. <code>Firefox/Profiles/&lt;profile_id&gt;.default/</code>).</li>
+  <li>Abre la carpeta <strong>extensions</strong> (creala si ésta no existe)</li>
+  <li>Crea un nuevo archivo de texto, y añade la ruta de la carpeta que contiene tu extensión, e.g. <code>C:\extensions\my_extension\</code> o <code>~/extensions/my_extension</code>. Guarda el archivo con el identificador de tu extensión como nombre de archivo, e.g. <code><a class="link-mailto" href="mailto:sample@foo.net" rel="freelink">sample@foo.net</a></code></li>
+</ol>
+<p>¡¡Ahora estás preparado para comprobar tu extensión!!</p>
+<p>Ejecuta Firefox. Firefox detectará el vínculo de texto al directorio de tu extensión y la instalará. Cuando la ventana del navegador aparezca verás el texto "Hello, World!" en el lado derecho del panel de la barra de estado.</p>
+<p>Ahora puedes retornar al archivo .xul y realizar cambios, reinicia Firefox y éstos se verán reflejados.</p>
+&lt;center&gt;
+  <p><img alt="Image:Helloworld_tools_menu.PNG" class="internal" src="/@api/deki/files/1116/=Helloworld_tools_menu.PNG"></p>
+  <p><img alt="Image:Helloworld_extensions_wnd.PNG" class="internal" src="/@api/deki/files/1115/=Helloworld_extensions_wnd.PNG"></p>
+&lt;/center&gt;
+<h2 id="Empaquetado" name="Empaquetado">Empaquetado</h2>
+<p>Ahora que tu extensión funciona, puedes empaquetarla para su distribución e instalación.</p>
+<p>Comprime con zip los contenidos de las carpetas de tu carpeta (no la carpeta de la extensión en sí misma) y cambia la extensión del archivo de .zip a .xpi. En windows XP, puedes hacer esto fácilmente seleccionando todas las carpetas y subcarpeta de la carpeta de tu extensión, haz click con el botón derecho y selecciona "enviar a" -&gt; "Comprimir carpeta". Se creará un archivo .zip. Renómbralo y ya está.</p>
+<p>Ahora sube el archivo .xpi a tu servidor, asegurándote de que se sirve con el tipo mime <code>application/x-xpinstall</code>. Haciendo un hipervínculo al archivo puedes permitir a la gente que descargue e instale tu extensión en Firefox.</p>
+<h3 id="Usando_addons.mozilla.org" name="Usando_addons.mozilla.org">Usando addons.mozilla.org</h3>
+<p>En el sitio de distribución Mozilla Update puedes subir tus extensiones totalmente gratis. Tus extensiones serán alojadas en los mirrors de la red Mozilla para garantizar la transferencia directa aún cuando pueda ser muy popular su descarga. La web de Mozilla proporciona a los usuarios una instalación sencilla, y podrán automáticamente disponer de las ultimas versiones que hagas de tu extensión. Además Mozilla Update permite que los usuarios comenten y hagan mejoras sobre tu extensión. ¡Es muy recomendable que utilices Mozilla Update para distribuir tus extensiones!</p>
+<p>¡Visita <a class="external" href="http://addons.mozilla.org/developers/" rel="freelink">http://addons.mozilla.org/developers/</a> para crear una cuenta y comenzar a distribuir tu extensión!</p>
+<p><em>Nota:</em> Tu extensión será aceptada y descargada más rápidamente si tiene una buena descripción y algunas imágenes en uso.</p>
+<h3 id="Colocaci.C3.B3n_de_extensiones_en_el_registro_de_Windows" name="Colocaci.C3.B3n_de_extensiones_en_el_registro_de_Windows">Colocación de extensiones en el registro de Windows</h3>
+<p>En Windows, la información sobre las extensiones se puede agregar al registro, y dicha extensión será automáticamente seleccionada la próxima vez que se ejecute la aplicación. Esto permite que los instaladores de la aplicación integren fácilmente la extensión. Ver <a href="/es/docs/Agregar_una_Extensión_usando_el_Registro_de_Windows" title="Agregar_una_Extensión_usando_el_Registro_de_Windows">Agregar una Extensión usando el Registro de Windows</a> para más información.</p>
+<h2 id="M.C3.A1s_sobre_las_Capas_XUL" name="M.C3.A1s_sobre_las_Capas_XUL">Más sobre las capas XUL</h2>
+<p>Además de añadir elementos de la interfaz de usuario en el punto de anclaje, puede emplear fragmentos XUL dentro de las capas para:</p>
+<ul>
+  <li>Cambiar atributos en el punto de anclaje, e.g. <code>&lt;statusbar id="status-bar" hidden="true"/&gt;</code> (esconde la barra de estado)</li>
+  <li>Eliminar el punto de anclaje del documento maestro, e.g. <code>&lt;statusbar id="status-bar" removeelement="true"/&gt;</code></li>
+  <li>Controlar la posición de los elementos insertados:</li>
+</ul>
+<pre>&lt;statusbarpanel position="1" .../&gt;
+
+&lt;statusbarpanel insertbefore="other-id" .../&gt;
+
+&lt;statusbarpanel insertafter="other-id" .../&gt;
+</pre>
+<h2 id="Creando_nuevos_componentes_del_interfaz_de_usuario" name="Creando_nuevos_componentes_del_interfaz_de_usuario">Creando nuevos componentes de la interfaz de usuario</h2>
+<p>Puedes crear tus propias ventanas y cajas de diálogo separadas de los archivos .xul, proporcionar funcionalidad colocando acciones del usuario en ejecución en archivos .js , usar métodos DOM para manipular UI widgets. Puedes usar las reglas de estilos .css, adjuntar imágenes, cambiar colores, etc.</p>
+<p>Ver la guía <a href="/es/docs/XUL" title="XUL">XUL</a> contiene más recursos para desarrolladores XUL.</p>
+<h2 id="Archivos_Por_Defecto" name="Archivos_Por_Defecto">Archivos por defecto</h2>
+<p>Los archivos por defecto son utilizados para crear un perfil de usuario y se crean en la carpeta <code>defaults/</code> que se encuentra dentro de la carpeta raíz de tu extensión. Los archivos .js se deben almacenar dentro de <code>defaults/preferences/</code> - al ser almacenados aquí serán cargados automáticamente por el sistema de preferencias de Firefox- de modo que se pueda tener acceso mediante las <a href="/es/docs/Preferences_API" title="Preferences_API">Preferences API</a>.</p>
+<h2 id="Componente_XPCOM" name="Componente_XPCOM">Componente XPCOM</h2>
+<p>Firefox soporta el uso del componente <a href="/es/docs/XPCOM" title="XPCOM">XPCOM</a> en extensiones. Puedes crear tus propios componentes fácilmente usando JavaScript o C++ (usando el <a href="/es/docs/Gecko_SDK" title="Gecko_SDK">Gecko SDK</a>).</p>
+<p>Coloca todos tus archivos .js o .dll en el directorio <code>components/</code>- para que sean automáticamente registrados la primera vez que inicie Firefox después de instalada la extensión.</p>
+<p>Para más información revisa <a href="/es/docs/How_to_Build_an_XPCOM_Component_in_Javascript" title="How_to_Build_an_XPCOM_Component_in_Javascript">How to Build an XPCOM Component in Javascript</a> y el libro <a href="/es/docs/Creating_XPCOM_Components" title="Creating_XPCOM_Components">Creating XPCOM Components</a>.</p>
+<h3 id="Comandos_de_la_Aplicaci.C3.B3n" name="Comandos_de_la_Aplicaci.C3.B3n">Comandos de la aplicación</h3>
+<p>Una de las ventajas de las aplicaciones que usan el componente XPCOM es la de poder usar líneas de comandos para su ejecución tanto en Firefox como en Thunderbird. Puedes utilizar esta técnica para correr tus extensiones:</p>
+<pre> firefox.exe -myapp
+</pre>
+<p><span class="comment">I should move the useful parts of this to the Command Line page. -Nickolay This is done by adding a component containing the function... function NSGetModule(comMgr, fileSpec) { return myAppHandlerModule; } This function is run by firefox each time firefox is started. Firefox registers the myAppHandlerModule's by calling its 'registerSelf()'. Then it obtains the myAppHandlerModule's handler factory via 'getClassObject()'. The handler factory is then used to create the handle using its 'createInstance(). Finally, the handle's 'handle(cmdline)' processes the command line cmdline's handleFlagWithParam() and handleFlag().</span> Ver <a href="/es/docs/Chrome/Command_Line" title="Chrome/Command_Line">Chrome: Command Line</a> o visitar <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=365297">forum discussion</a> para más detalles.</p>
+<h2 id="Ubicaci.C3.B3n" name="Ubicaci.C3.B3n">Ubicación</h2>
+<p>Para permitir más de un lenguaje, debes separar las cadenas del contenido usando <a href="/es/docs/XUL_Tutorial/Localization" title="XUL_Tutorial/Localization">entities</a> y <a href="/es/docs/XUL_Tutorial/Property_Files" title="XUL_Tutorial/Property_Files">string bundles</a>. ¡Es mucho más fácil de hacer esto cuando estás desarrollando tu extensión que volver y hacerlo luego!</p>
+<p>La información de la ubicación está almacenada en el directorio locale para las extensiones. Por ejemplo, para agregar un locale para nuestra extensión de prueba, crea un directorio llamado "locale" en chrome (donde esta ubicado el "contenido" del directorio) y agrega las siguientes líneas al archivo chrome.manifest:</p>
+<pre>locale sample sampleLocale chrome/locale/
+</pre>
+<p>Para crear valores de atributos ubicables en XUL, pones los valores en un archivo <code>.ent</code> (o un <code>.dtd</code>), el cual deberá ponerse en el directorio locale y verse así:</p>
+<pre>&lt;!ENTITY  button.label     "Clickeame!"&gt;
+&lt;!ENTITY  button.accesskey "C"&gt;
+</pre>
+<p>Y entonces inclúyelo en la parte superior del documento XUL (pero debajo de: "&lt;?xml version"1.0"?&gt;") quedando asi:</p>
+<pre>&lt;!DOCTYPE <strong>window</strong> SYSTEM "<a class="external" rel="freelink">chrome://packagename/locale/filename.ent</a>"&gt;
+</pre>
+<p>Donde <code><strong>window</strong></code> es el <code><a href="/es/docs/DOM/element.localName" title="DOM/element.localName">localName</a></code> del elemento raíz del documento XUL, y el valor de la propiedad  <code>SYSTEM</code> es la URI de chorme al archivo entity. Para nuestra extensión de ejemplo, el elemento de la raíz es <code><strong>overlay</strong></code>.</p>
+<p>Para usar entities, tu XUL debe verse asi:</p>
+<pre>&lt;button label="&amp;button.label;" accesskey="&amp;button.accesskey;"/&gt;
+</pre>
+<p>El registro de Chrome se asegurara que el archivo entity ha sido cargado del  paquete correspondiente a la localizacion elegida.</p>
+<p>Para las lineas que usarás en tu script, crea un archivo .properties; un archivo de texto que contendrá estas líneas:</p>
+<pre>key=value
+</pre>
+<p>Entonces usa el tag <code><a href="/es/docs/NsIStringBundleService" title="NsIStringBundleService">nsIStringBundleService</a></code>/<code><a href="/es/docs/NsIStringBundle" title="NsIStringBundle">nsIStringBundle</a></code> o el tag <code><a class="external" href="http://xulplanet.com/references/elemref/ref_stringbundle.html">&lt;stringbundle&gt;</a></code> para cargar los valores en el script.</p>
+<h2 id="Comprendiendo_el_navegador" name="Comprendiendo_el_navegador">Comprender el navegador</h2>
+<p>Utiliza <a href="/es/docs/DOM_Inspector" title="DOM_Inspector">DOM Inspector</a> (no es parte de la instalación <strong>Estandar</strong> de Firefox, debes reinstalar seleccionando instalación personalizada y elegir <strong>Herramientas de Desarrollo </strong> si no hay un elemento "Inspector de DOM" en el menu Herramientas del browser) para inspeccionar la ventana del browser o cualquier otra ventana XUL que quieras extender.</p>
+<p>Utiliza el botón de búsqueda apuntar-y-clic situado en la parte superior izquierda de la barra de herramientas de DOM Inspector visualmente en un nodo de la ventana XUL para seleccionarlo. Cuando hagas esto DOM Inspector ira dentro del árbor jerárquico al nodo sobre el que hiciste clic.</p>
+<p>Utiliza el panel lateral derecho de DOM Inspector para descubrir los puntos de anclaje con los ids que puedes utilzar para insertar tus elementos en los overlays. Si no pudieses encontrar un elemento con un id sobre el que hacer la mezcla, puedes añadir un script en tu overlay e insertar tus elementos cuando el evento load se dispare en la ventana XUL maestra.</p>
+<p>Depurar extensiones</p>
+<p><strong>Herramientas analitícas para Depurar (Debugging)</strong></p>
+<ul>
+  <li>El <a href="/es/docs/DOM_Inspector" title="DOM_Inspector">DOM Inspector</a> - inspecciona atributos, estructura del DOM, reglas de estilos CSS que están afectando (ej. buscar-porque sus reglas de estilo parecen no estar trabajando para un elemento -, ¡una herramienta invaluable!)</li>
+  <li><a href="/es/docs/Venkman" title="Venkman">Venkman</a> - Marca de control (breakpoints) en JavaScript e inspeccionar la pila de llamada.</li>
+  <li><code><a href="/es/docs/Core_JavaScript_1.5_Reference/Objects/Function/arguments/callee" title="Core_JavaScript_1.5_Reference/Objects/Function/arguments/callee">arguments.callee</a>.<a href="/es/docs/Core_JavaScript_1.5_Reference/Objects/Function/caller" title="Core_JavaScript_1.5_Reference/Objects/Function/caller">caller</a></code> en JavaScript - accede a la pila de llamada de funciones.</li>
+</ul>
+<p><strong>printf debugging</strong></p>
+<ul>
+  <li>Ejecutar Firefox con <code>-console</code> en la linea de comandos y usar</li>
+</ul>
+<p><code><a href="/es/docs/DOM/window.dump" title="DOM/window.dump">dump</a>("string")</code> (ver el enlace para detalles)</p>
+<ul>
+  <li>Usar <code><a href="/es/docs/NsIConsoleService" title="NsIConsoleService">nsIConsoleService</a></code> para ingresar/invocar la consola JavaScript</li>
+</ul>
+<p><strong>Depuración avanzada</strong></p>
+<ul>
+  <li>Ejecutar una “construcción” de Firefox de depuración y establecer los puntos de interrupción en el propio Firefox, o sus componentes C++. Para el desarrollador experimentado, esta es a menudo la manera más rápida de diagnosticar un problema. Para más información ver <a href="/es/docs/Build_Documentation" title="Build_Documentation">Build Documentation</a> y <a href="/es/docs/Developing_Mozilla" title="Developing_Mozilla">Developing Mozilla</a>.</li>
+</ul>
+<ul>
+  <li>Para obtener mas consejos útiles ver <a href="/es/docs/Debugging_a_XULRunner_Application" title="Debugging_a_XULRunner_Application">Debugging a XULRunner Application</a>.</li>
+</ul>
+<h3 id="Gu.C3.ADa_R.C3.A1pida" name="Gu.C3.ADa_R.C3.A1pida">Guía Rápida</h3>
+<p>Otro tutorial desde <a class="external" href="http://kb.mozillazine.org/Getting_started_with_extension_development">MozillaZine Knowledge Base</a>, también puedes bajar este archivo para usarlo como base en la creación de tus extensiones <a class="external" href="http://mozilla.doslash.org/stuff/helloworld.zip">helloworld.zip</a>.</p>
diff --git a/files/es/orphaned/crear_una_extensión_personalizada_de_firefox_con_el_mozilla_build_system/index.html b/files/es/orphaned/crear_una_extensión_personalizada_de_firefox_con_el_mozilla_build_system/index.html
new file mode 100644
index 0000000000..2cca183f1b
--- /dev/null
+++ b/files/es/orphaned/crear_una_extensión_personalizada_de_firefox_con_el_mozilla_build_system/index.html
@@ -0,0 +1,582 @@
+---
+title: Crear una extensión personalizada de Firefox con el Mozilla Build System
+slug: >-
+  orphaned/Crear_una_extensión_personalizada_de_Firefox_con_el_Mozilla_Build_System
+tags:
+  - Complementos
+  - Documentación_de_compilado
+  - Todas_las_Categorías
+  - XPCOM
+  - extensiones
+original_slug: Crear_una_extensión_personalizada_de_Firefox_con_el_Mozilla_Build_System
+---
+<p> </p>
+
+<div class="note"><strong>Nota:</strong> Todas las instrucciones de este artículo sólo son aplicables a la rama 1.8 de Mozilla (p.e. Firefox 1.5). Intentaré mantener actualizada la versión estable aunque de hecho no deberías asumir que esto funcionará con la rama 1.5 (p.e, Firefox 1.0) o anteriores.</div>
+
+<p>Existe una <a href="/es/Extensiones" title="es/Extensiones">infinidad de documentación</a> sobre la creación de extensiones para Firefox. Sin embargo, actualmente todos esos documentos asumen que estás desarrollando tu extensión utilizando únicamente <a href="/es/XUL" title="es/XUL">XUL</a> y <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a>. Para las extensiones complejas puede ser necesario crear componentes en C++ que proporcionen funcionalidades adicionales. Las razones por las que podrías querer agregar componentes C++ en tu extensión incluyen:</p>
+
+<ul>
+ <li>La necesidad de un alto rendimiento más allá de lo que te ofrece el código JavaScript.</li>
+ <li>El uso de bibliotecas de terceras partes escritas en C o en C++.</li>
+ <li>El uso de interfaces de Mozilla que no están disponibles vía <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> (p.e, <a href="/es/NSPR" title="es/NSPR">NSPR</a>).</li>
+</ul>
+
+<p>Este artículo describe cómo configurar el entorno de desarrollo para una extensión de Firefox grande y compleja utilizando parcial o totalmente los requerimientos ya mencionados. El proceso de reunir esta información ha sido de algún modo un calvario debido a la falta de información publicada sobre este tema, aunque varios miembros de la comunidad de desarrolladores de Mozilla han colaborado en su creación. Ellos han mostrado una paciencia extraordinaria respondiendo preguntas típicas de novatos ignorantes. Me quedo corto si digo que estoy lejos de ser un experto de Mozilla, aunque voy mejorando. Puede que muchas partes de este documento sean imprecisas, confusas o simplemente incorrectas. De hecho, una de mis metas al escribir esto es afinar dichas instrucciones hasta que constituyan una guía definitiva para los hackers del núcleo que quieran ampliar la plataforma Firefox. Si tú eres uno de los muchos que saben más que yo sobre esto, tu ayuda mejorando este artículo será gratamente recibida.</p>
+
+<p>También debería enfatizar que <em>no</em> tienes por qué compilar Mozilla o utilizar el sistema de compilación de Mozilla si quieres crear componentes C++ para Mozilla. Si sólo buscas crear un componente <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> o dos, este artículo será algo excesivo y puede que te interese mirar <a class="external" href="http://www.iosart.com/firefox/xpcom/">esta guía</a> en su lugar. Por otra parte, si tienes experiencia desarrollando o dirigiendo un equipo y sabes que tienes que desarrollar una extensión grande y compleja, probablemente hagas bien en considerar la aproximación descrita en este artículo.</p>
+
+<p>Una última nota: sólo he probado dichas técnicas dentro de Firefox aunque probablemente funcionarán más o menos bien en otras plataformas basadas en Gecko como Thunderbird o SeaMonkey. Si alguien puede confirmar esto y/o suministrar guías de estilo para aquello en lo que difiere actualizaré el artículo para incorporar esta información.</p>
+
+<h3 id="Y_Bambi_y_Mozilla_se_encontraron..." name="Y_Bambi_y_Mozilla_se_encontraron...">Y Bambi y Mozilla se encontraron...</h3>
+
+<p>Nada en este artículo es para cobardes. En particular el primer paso conlleva la compilación de Mozilla, lo cual es un gran... no, un inmenso proyecto. Muchos desarrolladores inteligentes han sido llevados al borde de la locura intentando compilarlo por  primera vez. Si no tienes experiencia desarrollando C++ no deberías ni preocuparte. Sigue con JavaScript.</p>
+
+<h4 id="Plataformas_Windows" name="Plataformas_Windows">Plataformas Windows</h4>
+
+<p>La primera vez que compilé Mozilla utilicé <a href="/es/Prerrequisitos_de_compilaci%C3%B3n_en_Windows" title="es/Prerrequisitos_de_compilación_en_Windows">esta guía</a>. Ni siquiera puedo recordar por qué, pero me quedé pillado unas cuantas veces, aunque la odisea llevó más tiempo de lo que me había imaginado al principio. Me cargué los muebles y me arranqué el pelo. Aquí tienes una <a class="external" href="http://whereswalden.com/mozilla/msvcfree/">guía comprensiva rápida</a>, bien redactada. Sigue cada paso metódicamente y probablemente todo irá bien. Céntrate en el hecho de que una vez hayas completado la compilación, posiblemente el resto del trabajo no conllevará esfuerzo alguno. Posiblemente.</p>
+
+<h4 id="Otras_plataformas" name="Otras_plataformas">Otras plataformas</h4>
+
+<p>En otras plataformas, léase Linux y MacOS, el proceso es mucho más sencillo. Todas las herramientas para compilar están disponibles de forma integrada y por tanto todo lo que tienes que hacer es ejecutar algunas órdenes en el terminal. Puedes encontrar las instrucciones completas para casi cualquier SO <a href="/es/Documentaci%C3%B3n_de_compilaci%C3%B3n" title="es/Documentación_de_compilación">aquí</a>.</p>
+
+<h3 id="Estructurar_tu_proyecto" name="Estructurar_tu_proyecto">Estructurar tu proyecto</h3>
+
+<p>Mozilla incorpora un número de extensiones complejas que son integradas en su proceso de compilación. Es así que ha sido necesario resolver todos los problemas inherentes a la creación y registro de componentes XPCOM, a la compilación de ficheros JAR y los manifiestos; instalando el montón en el directorio <code>extensions</code> de Firefox y así sucesivamente. Así pues, lo mejor para nosotros es aprovecharnos de esta infraestructura para construir nuestra extensión.</p>
+
+<p>Antes que nada, elige un nombre con gancho para tu extensión y crea un directorio con ese nombre bajo el directorio <code>/mozilla/extensions/</code>. Utiliza sólo minísculas. Deberías ver un montón de otros directorios (<code>inspector/</code>, <code>reporter/</code>, etc...) al mismo nivel del árbol de directorios.</p>
+
+<p>Date cuenta  que antes de realmente construir nada, el sistema de desarrollo de Mozilla llama a un proceso que genera los makefiles usados por la compilación a partir de plantillas de makefiles llamadas <code>Makefile.in</code>. Los makefiles reales tienden a ser muy parecidos si no idénticos a las plantillas, pero la flexibilidad extra adquirida al obtener los makefiles generados dinámicamente es una de las cosas que hacen al sistema de compilación tan potente.</p>
+
+<h4 id="Anatom.C3.ADa_de_una_simple_extensi.C3.B3n_en_C.2B.2B" name="Anatom.C3.ADa_de_una_simple_extensi.C3.B3n_en_C.2B.2B">Anatomía de una simple extensión en C++</h4>
+
+<p>Asumiremos que estamos usando C++ para escribir componentes XPCOM que pueden ser usados tanto desde otros componentes C++ o desde JavaScript. El proceso de crear un componente es, en realidad, algo relativamente simple cuando se utiliza Mozilla Build System.</p>
+
+<p>El caso más simple ocurre cuando un componente va a consistir en un único directorio principal con dos subdirectorios, <code>public/</code> y <code>src/</code>. El directorio principal y cada subdirectorio deben contener un <code>Makefile.in</code> (a partir de ahora me referiré a este fichero como un makefile aunque, como sabemos, en la práctica es usado para generar los makefiles reales). Este makefile dice dos cosas: lo primero: lista los subdirectorios que componen la extensión por lo que el sistema de compilación conoce dónde buscar los makefiles adicionales. Después dà las instrucciones para compilar el sistema que crea una nueva extensión, en lugar de copiar los componentes directamente en el directorio de binarios de Firefox. La principal ventaja de utilizar una extensión es que es fácil empaquetarlo todo e instalarlo en otra máquina.</p>
+
+<p>Así pues, aquí tienes el makefile principal más básico y simplón que te puedas encontrar (<code>Makefile.in</code> en el directorio principal de la extensión):</p>
+
+<pre>DEPTH		= ../..
+topsrcdir	= @top_srcdir@
+srcdir		= @srcdir@
+VPATH		= @srcdir@
+
+include $(DEPTH)/config/autoconf.mk
+
+MODULE = myextension
+
+DIRS		= public src
+
+XPI_NAME		= myextension
+INSTALL_EXTENSION_ID	= myextension@mycompany.com
+XPI_PKGNAME		= myextension
+
+DIST_FILES = install.rdf
+
+include $(topsrcdir)/config/rules.mk
+</pre>
+
+<p>La descripción detallada del proceso de creación, describiendo las opciones clave de este makefile pueden ser encontradas <a href="/es/C%C3%B3mo_funciona_el_sistema_de_compilaci%C3%B3n_de_Mozilla" title="es/Cómo_funciona_el_sistema_de_compilación_de_Mozilla">aquí</a>. Tanto <strong>MODULE</strong> como <strong>XPI_NAME</strong> están asignados al nombre de tu extensión; deben aparecer repetidos en todos los makefiles del proyecto para que todos los ficheros acaben en el mismo lugar en el área de pruebas del XPI (ver más adelante). <strong>INSTALL_EXTENSION_ID</strong> es el ID único de tu extensión. Puede ser un GUID aunque el formato mostrado antes es más bonito y, asumámoslo, mucho más fácil de recordar. No tienes porqué proporcionar un <strong>XPI_PKGNAME</strong> aunque si creas un fichero XPI susceptible de ser distribuido, será creado automáticamente en el directorio raíz del área de pruebas del XPI (<code>/mozilla/$(MOZ_OBJDIR)/dist/xpi-stage/</code>).</p>
+
+<p>Toda extensión debe incluir un fichero <code>install.rdf</code> que le diga a Firefox cómo instalarla. Este fichero debería estar ubicado en el directorio principal de la extensión y tener este aspecto:</p>
+
+<pre>&lt;?xml version="1.0"?&gt;
+
+&lt;RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+     xmlns:em="http://www.mozilla.org/2004/em-rdf#"&gt;
+  &lt;Description about="urn:mozilla:install-manifest"&gt;
+    &lt;em:id&gt;myextension@mycompany.com&lt;/em:id&gt;
+    &lt;em:version&gt;0.1&lt;/em:version&gt;
+
+    &lt;em:targetApplication&gt;
+      &lt;!-- Firefox --&gt;
+      &lt;Description&gt;
+        &lt;em:id&gt;{ec8030f7-c20a-464f-9b0e-13a3a9e97384}&lt;/em:id&gt;
+        &lt;em:minVersion&gt;1.0+&lt;/em:minVersion&gt;
+        &lt;em:maxVersion&gt;1.0+&lt;/em:maxVersion&gt;
+      &lt;/Description&gt;
+    &lt;/em:targetApplication&gt;
+
+    &lt;!-- front-end metadata --&gt;
+    &lt;em:name&gt;My First Extension&lt;/em:name&gt;
+    &lt;em:description&gt;Just an example.&lt;/em:description&gt;
+    &lt;em:creator&gt;allpeers.com&lt;/em:creator&gt;
+    &lt;em:homepageURL&gt;http://www.allpeers.com/blog/&lt;/em:homepageURL&gt;
+  &lt;/Description&gt;
+&lt;/RDF&gt;
+</pre>
+
+<p>Existe una <a href="/es/Manifiestos_de_instalaci%C3%B3n" title="es/Manifiestos_de_instalación">descripción detallada</a> del formato del fichero <code>install.rdf</code>. Utiliza la variable <strong>DIST_FILES</strong> del makefile para decirle a <code>make</code> que copie el fichero en el directorio de la extensión y (opcionalmente) el fichero XPI.</p>
+
+<h4 id="Interfaces_p.C3.BAblicas" name="Interfaces_p.C3.BAblicas">Interfaces públicas</h4>
+
+<p>El directorio <code>public/</code> contiene todas las interfaces necesarias para que otros módulos puedan utilizarlas. Éstas pueden ser ficheros <a class="external" href="http://www.mozilla.org/scriptable/xpidl/idl-authors-guide/index.html">IDL</a> que describan interfaces <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a>, los cuales son utilizados para generar ficheros de cabecera normales de C++ para incluirlos en los ficheros fuente. También pueden ser ficheros de cabecera normales de C++ que son utilizados directamente por otros módulos. La forma más fácil de hacer esto último es usar implementaciones en línea para todos los métodos, por lo que no tendrás ninguna dependencia de enlazado adicional. En otro caso tendrás que utilizar enlazado estático en tu módulo si utilizas estas cabeceras públicas en otros módulos. Personalmente desaconsejo esta práctica (entre otras cosas porque el enlazado estático significa que el mismo código se carga más de una vez en memoria y el código no estará disponible desde JavaScript u otros lenguajes diferentes a C++) y animo a usar XPCOM siempre que sea posible.</p>
+
+<p>El makefile en el directorio <code>public/</code> debería parecerse a este modelo:</p>
+
+<pre>DEPTH		= ../../..
+topsrcdir	= @top_srcdir@
+srcdir		= @srcdir@
+VPATH		= @srcdir@
+
+include $(DEPTH)/config/autoconf.mk
+
+MODULE		= myextension
+XPIDL_MODULE	= myextension
+
+XPI_NAME = myextension
+
+EXPORTS = \
+		myHeader.h \
+		$(NULL)
+
+XPIDLSRCS	= \
+		myIFirstComponent.idl \
+		myISecondComponent.idl \
+		$(NULL)
+
+include $(topsrcdir)/config/rules.mk
+</pre>
+
+<p><strong>XPIDL_MODULE</strong> es el nombre del fichero XPT generado que contiene información de tipos sobre tus interfaces <a class="external" href="http://www.mozilla.org/scriptable/xpidl/idl-authors-guide/index.html">IDL</a>. Si tienes múltiples módulos, asegúrate de que utilizas un valor diferente de <strong>XPIDL_MODULE</strong> para cada uno. En caso contrario, el fichero XPT del primer módulo será sobrescrito por el segundo y obtendrás errores del tipo <strong>NS_ERROR_XPC_BAD_IID</strong> cuando intentes acceder a sus interfaces IDL desde el código. Los ficheros bajo <strong>EXPORTS</strong> son copiados directamente al directorio <code>/mozilla/$(MOZ_OBJDIR)/dist/include/myextension/</code> siendo así accesibles desde otros módulos (el valor de <strong>MOZ_OBJDIR</strong> se define en <code>/mozilla/.mozconfig</code>). XPIDLSRCS es ejecutado a través del procesador IDL y las cabeceras generadas de C++ son copiadas en el mismo directorio include. Además, se genera un fichero XPT (biblioteca de tipos) que se copia en el subdirectorio <code>components/</code> de tu extensión.</p>
+
+<h4 id="Ficheros_fuente" name="Ficheros_fuente">Ficheros fuente</h4>
+
+<p>Ahora es cuando hay que crear el makefile y los ficheros-fuente en el subdirectorio <code>src/</code>. Si estás implementando interfaces y las estás describiendo con IDL, la forma más fácil de hacer esto es dejando vacío el directorio <code>src/</code> y ejecutando <code>make</code> sólo en el directorio <code>public/</code>. Esto serà explicado en breve.</p>
+
+<p>Luego abre el fichero de cabecera generado para tu interfaz en <code>/mozilla/$(MOZ_OBJDIR)/dist/include/myextension/</code>. Este fichero tendrá algunas plantillas para los ficheros de componentes .H y .CPP que puedes copiar y pegar en tus ficheros de implementación. Todo lo que tienes que hacer es rellenar los huecos del fichero C++ con la implementación real y estarás listo para continuar.</p>
+
+<p>A continuación se muestra un ejemplo del makefile que necesitas colocar en tu directorio <code>src</code>.</p>
+
+<pre class="eval">DEPTH		= ../../..
+topsrcdir	= @top_srcdir@
+srcdir		= @srcdir@
+VPATH		= @srcdir@
+
+include $(DEPTH)/config/autoconf.mk
+
+IS_COMPONENT = 1
+MODULE = myextension
+LIBRARY_NAME =  myExtension
+
+XPI_NAME = myextension
+
+REQUIRES	= xpcom \
+		  string \
+		  $(NULL)
+
+CPPSRCS		= \
+		  myFirstComponent.cpp \
+		  mySecondComponent.cpp \
+		  myExtension.cpp \
+		  $(NULL)
+
+include $(topsrcdir)/config/rules.mk
+
+EXTRA_DSO_LDOPTS += \
+  $(XPCOM_GLUE_LDOPTS) \
+  $(NSPR_LIBS) \
+  $(NULL)
+
+# <span class="highlightred">NOTA: si estás codificando contra la versión 1.8.0 branch (no 1.8 branch o trunk),</span>
+# <span class="highlightred">la línea anterior no funcionará debido a problemas de modificadores del enlazador.</span>
+# En su lugar utiliza las siguientes variables:
+#
+# EXTRA_DSO_LDOPTS += \
+#   $(MOZ_COMPONENT_LIBS) \
+#   $(NULL)
+#
+# Por desgracia, usando MOZ_COMPONENT_LIBS se enlaza contra xpcom_core, lo que
+# significa que tus componentes no funcionarán en futuras versiones de Firefox.
+</pre>
+
+<p>La sección <code>REQUIRES</code> le dice a <code>make</code> qué módulos utilizan tus componentes. Esto provoca que los subdirectorios relevantes de <code>/mozilla/$(MOZ_OBJDIR)/dist/include/</code> sean añadidos a la ruta include del compilador de C++. Si estás incluyendo las cabeceras de Mozilla y el compilador es incapaz de encontrarlas, podría ser que no hayas listado todos los módulos necesarios aquí. <code>CPPSRCS</code> enumera los ficheros fuente que necesitan ser compilados.</p>
+
+<p>En este ejemplo, los dos primeros ficheros contienen la implementación de los dos componentes de la extensión. El fichero final <code>myExtension.cpp</code> contiene el código necesario para registrar dichos componentes, como se describirá en la siguiente sección.</p>
+
+<h4 id="Registrar_tus_componentes" name="Registrar_tus_componentes">Registrar tus componentes</h4>
+
+<p>Para poder usar tus componentes desde otros módulos de C++ y JavaScript primero tienes que registrarlos. Para hacerlo, tu extensión necesita implementar una clase que exponga la interfaz <code><a href="/es/NsIModule" title="es/NsIModule">nsIModule</a></code> la cual posee métodos para acceder a los componentes definidos en un módulo. Afortunadamente, esto puede ser llevado a cabo mediante el uso de unas pocas y simples macros por lo que no tienes que embarrarte con los detalles de qué está pasando internamente.</p>
+
+<p>El primer paso es definir un CID, un contract ID (o ID de contrato) y un nombre de clase para cada uno de tus componentes. Pega el siguiente código (adaptando los <strong>#defines</strong> según convenga) en la cabecera de cada componente que tenga que ser instanciado utilizando el administrador de componentes:</p>
+
+<pre>// {00000000-0000-0000-0000-000000000000}
+#define MYFIRSTCOMPONENT_CID \
+	{ 0x00000000, 0x0000, 0x0000, \
+	{ 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00 } }
+
+#define MYFIRSTCOMPONENT_CONTRACTID	"@mycompany.com/myfirst;1"
+#define MYFIRSTCOMPONENT_CLASSNAME	"My First Component"
+</pre>
+
+<p>Obviamente necesitas completar el CID con un GUID real. Bajo Windows puede ser generado utilizando <a class="external" href="http://www.microsoft.com/downloads/details.aspx?familyid=94551F58-484F-4A8C-BB39-ADB270833AFC">guidgen.exe</a>. Los Unixeros pueden utilizar uuidgen (viene de modo predeterminado en la mayoría de distribuciones de Unix y Linux).</p>
+
+<p>Ahora crea el fichero <code>myExtension.cpp</code> así:</p>
+
+<pre>#include "nsXPCOM.h"
+
+#include "nsIGenericFactory.h"
+
+/**
+ * Components to be registered
+ */
+#include "myFirstComponent.h"
+#include "mySecondComponent.h"
+
+NS_GENERIC_FACTORY_CONSTRUCTOR(myFirstComponent)
+NS_GENERIC_FACTORY_CONSTRUCTOR(mySecondComponent)
+
+//----------------------------------------------------------
+
+static const nsModuleComponentInfo components[] =
+{
+	{
+		MYFIRSTCOMPONENT_CLASSNAME,
+		MYFIRSTCOMPONENT_CID,
+		MYFIRSTCOMPONENT_CONTRACTID,
+		myFirstComponentConstructor
+	},
+	{
+		MYSECONDCOMPONENT_CLASSNAME,
+		MYSECONDCOMPONENT_CID,
+		MYSECONDCOMPONENT_CONTRACTID,
+		mySecondComponentConstructor
+	},
+};
+
+NS_IMPL_NSGETMODULE(MyExtension, components)
+</pre>
+
+<p>La macro <strong>NS_IMPL_NSGETMODULE</strong> crea el objeto de módulo apropiado suministrando acceso a todos los componentes listados en el array <code><a href="/es/NsModuleComponentInfo" title="es/NsModuleComponentInfo">nsModuleComponentInfo</a></code>.</p>
+
+<h4 id="Compilaci.C3.B3n" name="Compilaci.C3.B3n">Compilación</h4>
+
+<p>Como se dijo antes, probablemente querrás compilar tu extensión inmediatamente tras crear tus ficheros IDL para poder generar las plantillas C++ para las implementaciones del componente. Estoy asumiendo que ya has podido compilar Firefox sin problemas. Si no es así, vuelve inmediatamente al inicio de este artículo y no regreses hasta que hayas generado un <code>firefox.exe</code> funcional. <span class="comment">Creo que es una casilla del monopoly: Do not pass go. Do not collect $200.</span></p>
+
+<p>¿Sigues ahí? Bien, ahora vamos a modificar tu <code>.mozconfig</code> (en el directorio raíz <code>/mozilla/</code> para que tu extensión se compile junto con Mozilla. Añade la siguiente línea al final del fichero:</p>
+
+<pre>ac_add_options --enable-extensions=default,myextension
+</pre>
+
+<p>Ahora ejecuta <code>make</code> en el directorio raíz de Mozilla:</p>
+
+<pre>make -f client.mk build
+</pre>
+
+<p>Incluso aunque hayas compilado una versión actualizada de Firefox, tendrás que esperar un momento para que <code>make</code> pueda recorrer el árbol de Mozilla por completo buscando nuevo material (en mi máquina, que es bastante rápida, esto tarda unos 10-15 minutos). Finalmente alcanzará tu extensión y generará un montón de material bajo el directorio <code>/mozilla/$(MOZ_OBJDIR)/</code>:</p>
+
+<ul>
+ <li>Varios ficheros de cabecera exportados y ficheros de cabecera generados (desde IDL) en <code>dist/include/myextension/</code></li>
+ <li>Bibliotecas estáticas para tus módulos en <code>dist/lib/</code> (en el caso de que otros módulos quieran enlazar estáticamente a tu material en lugar de utilizar XPCOM).</li>
+ <li>Un fichero XPI en <code>dist/xpi-stage/myextensión.xpi</code>.</li>
+ <li>Los makefiles generados para tus proyectos en <code>extensions/myextension/</code> (recuerda que estamos bajo el directorio <code>/mozilla/$(MOZ_OBJDIR)/</code>.</li>
+ <li>Todo lo demás en <code>dist/bin/extensions/<a class="link-mailto" href="mailto:myextension@mycompany.com" rel="freelink">myextension@mycompany.com</a>/</code>.</li>
+</ul>
+
+<p>Gran parte de este material no será creado en la primera pasada ya que <code>make</code> se impacientará cuando no encuentre los ficheros fuente para tus componentes. No te preocupes por eso, todo lo que necesitas son los ficheros de cabecera generados que contengan las plantillas de implementación en C++. Vuelve atrás y rellena la implementación en C++ de tus componentes para que puedan ser compilados la siguiente vez. Recuerda que no deberías modificar jamás, nunca, ningún fichero generado. Modifica siempre los ficheros utilizados para generarlos y vuelve a ejecutar <code>make</code>. Quizá haya excepciones a esta regla, pero si estás cambiando los ficheros generados directamente muy probablemente estás metiendo la pata.</p>
+
+<p>El proceso de recorrer el árbol completo de Mozilla lleva bastante tiempo. Si ya has compilado Mozilla puedes evitar esto creando un makefile para tu extensión directamente. Ve al directorio raíz de tu $(MOZ_OBJDIR) y (desde un shell compatible con bash) introduce:</p>
+
+<pre class="eval">../build/autoconf/make-makefile extensions/myextension
+</pre>
+
+<p>Si tu $(MOZ_OBJDIR) está ubicado fuera de tu $(TOPSRCDIR), necesitarás hacer:</p>
+
+<pre class="eval">$(TOPSRCDIR)/build/autoconf/make-makefile -t $(TOPSRCDIR) extensions/myextension
+</pre>
+
+<p>para que el script sepa dónde están tus fuentes (usará la ruta de la extensión que des relativa al directorio actual para resolver dónde quieres que vayan tus makefiles).</p>
+
+<p>Esto generará el makefile apropiado para tu extensión. Tanto si quieres compilar el árbol completo de Mozilla como si tomas este atajo, puedes compilar de ahora en adelante yendo a <code>/mozilla/$(MOZ_OBJDIR)/extensions/myextension/</code> y escribiendo "make" en la línea de órdenes. Esto debería compilar tu componente sin distraerse con el resto de Mozilla. Si todo va bien, verás tu fichero XPI en el área de pruebas de XPI. También verás la versión descomprimida (es decir, la estructura de directorios descomprimida) bajo <code>/mozilla/$(MOZ_OBJDIR)/dist/bin/extensions</code> (si algo va mal, averigua qué es, corrígelo y luego vuelve aquí y añádelo a este artículo).</p>
+
+<p>Para asegurarte de que la compilación ha finalizado realmente, lanza Firefox y comprueba que tu extensión aparece en la lista cuando selecciones Herramientas / Complementos. Si estás usando Firefox como tu navegador habitual (y si no, ¿por qué no?), puede que te moleste el hecho que de que tendrás que cerrar tu Firefox normal antes de ejecutar tu versión personalizada. Si es así, prueba a establecer la variable de entorno <strong>MOZ_NO_REMOTE</strong> a "1" antes de ejecutar la versión de desarrollo de Firefox. También necesitarás usar un perfil diferente para tu versión de desarrollo:</p>
+
+<pre class="eval">firefox -P <em>desarrollo</em>
+</pre>
+
+<p>Donde <em>desarrollo</em> se sustituye con el nombre del perfil extra que has creado. Esto te permitirá ejecutar ambas versiones de Firefox simultáneamente, ahorràndote montones de tiempo a lo largo del ciclo de compilación/prueba.</p>
+
+<h4 id="No_hay_nada_como_estar_en_chrome" name="No_hay_nada_como_estar_en_chrome">No hay nada como estar en chrome</h4>
+
+<p>¡Yuhuuuu! Ahora ya tienes una extensión que no hace absolutamente nada. Es hora de hacer algo con esos geniales componentes que implementaste y registraste. La forma más fácil de hacer esto es escribiendo algo de código <a href="/es/JavaScript" title="es/JavaScript">JavaScript</a> y <a href="/es/XUL" title="es/XUL">XUL</a>. En este punto sería de mucha utilidad tener algo de experiencia <a href="/es/Extensiones" title="es/Extensiones">escribiendo extensiones "normales"</a> (p.e., sin utilizar componentes de C++ personalizadas). Si nunca has hecho esto, te recomiendo encarecidamente que pienses una idea guay para algo simple que siempre hayas querido hacer para Firefox y lo escribas. Mostrar sólo un nuevo elemento de menú que abra un cuadro de diálogo "¡Hola mundo!" sería ya un gran ejercicio de precalentamiento.</p>
+
+<p>Suponiendo que sabes cómo escribir extensiones en XUL/JavaScript, estarás al corriente de que la parte más importante va en el directorio <code>chrome/</code> de tu extensión. Bueno, el hecho de que estés utilizando también componentes C++ no cambia eso ni una pizca. Por tanto, ahora necesitas crear los directorios normales <code>content/</code>, <code>locale/</code> y <code>skin/</code> en los que has de poner tus ficheros chrome. Personalmente me gusta ubicar dichos directorios directamente bajo el directorio raíz de mi módulo pero supongo que no habrá diferencia si prefieres ponerlos bajo el subdirectorio <code>chrome/</code> o el que sea. ¡Viva la libertad!</p>
+
+<p>Una vez has escrito los ficheros chrome necesarios (por ejemplo, un overlay que añade un elemento de menú para instanciar y utilizar uno de tus componentes), necesitas empaquetarlo como parte de tu extensión. Esto es llevado a cabo a través del uso de un <a href="/es/Manifiestos_JAR" title="es/Manifiestos_JAR">manifiesto JAR</a>. Para nuestro ejemplo de extensión simple este fichero podría tener este aspecto:</p>
+
+<pre>myextension.jar:
+%  content myextension %content/
+%  locale myextension en-US %locale/en-US/
+%  skin myextension classic/1.0 %skin/classic/
+%  overlay chrome://browser/content/browser.xul chrome://myextension/content/MyExtensionOverlay.xul
+	content/MyExtensionOverlay.js		(content/MyExtensionOverlay.js)
+	content/MyExtensionOverlay.xul		(content/MyExtensionOverlay.xul)
+	locale/en-US/MyExtension.dtd		(locale/en-US/MyExtension.dtd)
+	locale/en-US/MyExtension.properties	(locale/en-US/MyExtension.properties)
+	skin/classic/MyExtension.css		(skin/classic/MyExtension.css)
+</pre>
+
+<p>Pon este código en un fichero llamado <code>jar.mn</code> en el directorio raíz de tu extensión, asegurándote de que las rutas en los paréntesis apuntan a los ficheros reales (relativos al directorio raíz). Además tienes que hacer un pequeño cambio al makefile del mismo directorio, añadiendo la siguiente línea:</p>
+
+<pre class="eval">USE_EXTENSION_MANIFEST = 1
+</pre>
+
+<p>Esto le dice a <code>make</code> que cree un único fichero de manifiesto llamado <code>chrome.manifest</code> en lugar de crear manifiestos separados con nombres tontos para cada paquete.</p>
+
+<p>Ahora ejecuta <code>make</code> de nuevo. Deberías ver un subdirectorio <code>chrome</code> en tu extensión (<code>/mozilla/$(MOZ_OBJDIR)/dist/bin/extensions/<a class="link-mailto" href="mailto:myextension@mycompany.com" rel="freelink">myextension@mycompany.com</a>/</code>). Observa que el directorio <code>chrome</code> contiene un fichero JAR (o sea, ZIP) con todos los ficheros chrome listados en <code>jar.mn</code> además de una estructura de directorio completa reflejo de la del fichero JAR. La estructura de directorio sin embargo está vacía. ¿Por qué? No lo sé. No te preocupes por esto, los ficheros en el JAR son los que realmente se usan.</p>
+
+<h4 id="Manteni.C3.A9ndolo_complejo" name="Manteni.C3.A9ndolo_complejo">Manteniéndolo complejo</h4>
+
+<p>Si estás desarrollando extensiones realmente complejas con un montón de componentes <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a>, probablemente desees dividir tu código en módulos más pequeños.</p>
+
+<h5 id="Extensiones_moderadamente_complejas" name="Extensiones_moderadamente_complejas">Extensiones moderadamente complejas</h5>
+
+<p>Para una extensión moderadamente compleja, probablemente bastará con dividir el código en módulos de un solo nivel. Supongamos que tienes un módulo <code>base/</code> que define un manojo de componentes XPCOM básicos y un módulo <code>advanced/</code> que define algunos componentes chrome así como otros componentes que usan a los básicos. La estructura del directorio debería lucir más o menos así:</p>
+
+<ul>
+ <li>myextension
+  <ul>
+   <li>base
+    <ul>
+     <li>public</li>
+     <li>src</li>
+    </ul>
+   </li>
+   <li>advanced
+    <ul>
+     <li>content</li>
+     <li>locale
+      <ul>
+       <li>en-US</li>
+       <li>...other locales...</li>
+      </ul>
+     </li>
+     <li>public</li>
+     <li>skin
+      <ul>
+       <li>classic</li>
+       <li>...other skins...</li>
+      </ul>
+     </li>
+     <li>src</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<p>Más allá de eso, nada cambia. Los makefiles en los directorios <code>base/</code> y <code>advanced/</code> deberían tener más o menos el mismo aspecto que el makefile original del directorio raíz, sin olvidar cambiar la variable <strong>DEPTH</strong> para reflejar el hecho de que se han movido a un nivel más de profundidad respecto de la raíz de mozilla. También debes quitar la variable <strong>DIST_FILES</strong> porque va a estar en el makefile de nivel superior. Cada makefile que genere algo debería definir la variable <strong>XPI_NAME</strong> para asegurarse que los archivos generados van dentro de tu extensión y no dentro del directorio global <code>components/</code>. Define esto en cada makefile para asegurarte. Puedes usar el mismo <strong>MODULE</strong> para ambos casos, <code>base/</code> y <code>advanced/</code>, y así todos los archivos include generados irán al mismo directorio, pero asegúrate de no usar el mismo <strong>XPIDL_MODULE</strong> en los dos directorios <code>public/</code> o una de las bibliotecas de componentes (es decir, archivos XPT) sobrescribirá al otro y todo se echará a perder.</p>
+
+<p>Cada módulo debe tener también un valor diferente para la variable <strong>LIBRARY_NAME</strong>. Éste es el nombre de la biblioteca dinámica generada, así que si llamamos a las bibliotecas "myBase" y "myAdvance" entonces tendremos los archivos <code>myBase.dll</code> y <code>myAdvance.dll</code> (por lo menos así es en Windows). Y cada uno de estos módulos va a tener un archivo C++ separado para registrar componentes, así que va a haber dos archivos que lucirán como <code>myExtension.cpp</code> en el ejemplo original, digamos Base.cpp y Advanced.cpp. Por último, cada módulo tendrá, obviamente, su propio jar.mn, aunque pueden referenciar al mismo nombre de archivo JAR y nombre de paquete si quieres que todos los archivos chrome estén organizados en un mismo paquete y archivo JAR. El único que realmente permanece es install.rdf, que existe una vez y sólo una vez en el directorio raíz de la extensión.</p>
+
+<p>En cuanto al makefile de nivel superior, ahora tendrá este aspecto:</p>
+
+<pre>DEPTH		= ../..
+topsrcdir	= @top_srcdir@
+srcdir		= @srcdir@
+VPATH		= @srcdir@
+
+include $(DEPTH)/config/autoconf.mk
+
+MODULE = myextension
+
+DIRS		= base advanced
+
+XPI_NAME               = myextension
+INSTALL_EXTENSION_ID   = myextension@mycompany.com
+XPI_PKGNAME		= myextension
+
+DIST_FILES = install.rdf
+
+include $(topsrcdir)/config/rules.mk
+</pre>
+
+<h5 id="Extensiones_realmente_complejas" name="Extensiones_realmente_complejas">Extensiones realmente complejas</h5>
+
+<p>En algún momento, hasta un solo módulo puede crecer hasta un punto en que desees dividirlo en submódulos. La diferencia entre tener módulos diferentes y tener un módulo dividido en submódulos es que todos los submódulos comparten el mismo archivo para registrar componentes (el famoso archivo myExtension.cpp) y cuando lo compilas genera una sola biblioteca dinámica. La decisión para dividir un módulo en submódulos es sólo cuestión de organización del código, no afecta al producto final.</p>
+
+<p>Para dividir un módulo en submódulos primero debes crear un directorio para cada submódulo. Luego debes crear un directorio adicional llamado <code>build/</code>. Cada submódulo será configurado para crear una biblioteca estática y el directorio <code>build/</code> las unirá para crear una sola biblioteca dinámica. ¿Confundido? Aquí hay un ejemplo mostrando la subrama <code>advanced/</code> del directorio <code>myextension/</code>:</p>
+
+<ul>
+ <li>advanced
+  <ul>
+   <li>build</li>
+   <li>intricate
+    <ul>
+     <li>public</li>
+     <li>src</li>
+    </ul>
+   </li>
+   <li>multifarious
+    <ul>
+     <li>public</li>
+     <li>src</li>
+    </ul>
+   </li>
+   <li>content</li>
+   <li>locale
+    <ul>
+     <li>en-US</li>
+     <li>...otros idiomas...</li>
+    </ul>
+   </li>
+   <li>skin
+    <ul>
+     <li>classic</li>
+     <li>...otros skins...</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<p>Como puedes ver, hemos dividido <code>advanced/</code> dentro de dos submódulos: <code>intrincate/</code> y <code>multifarious/</code> y hemos añadido un directorio <code>build/</code> adicional. Hemos dejado los directorios chrome directamente bajo <code>advanced/</code>, los cuales no están enlazados a ningún submódulo específico. Esto significa que jar.mn estará en el mismo lugar.</p>
+
+<p>Los makefiles <code>intricate/</code> y <code>multifarious/</code> lucirán casi igual al makefile original <code>advanced/</code>, pero necesitamos modificarlos un poquito. Como siempre, debemos ajustar la variable <strong>DEPTH</strong> porque el makefile está más profundo en la estructura de directorios. Y deberíamos cambiar <strong>LIBRARY_NAME</strong> para indicar que estamos generando una biblioteca estática para cada submódulo. Por convenio, se usa el sufijo "_s" para este propósito. Así que las llamaremos "myIntricate_s" y "myMultifarious_s". Finalmente definimos la variable <strong>FORCE_STATIC_LIB</strong> para que quede un makefile que comience más o menos así:</p>
+
+<pre>DEPTH		= ../../../../..
+topsrcdir	= @top_srcdir@
+srcdir		= @srcdir@
+VPATH		= @srcdir@
+
+include $(DEPTH)/config/autoconf.mk
+
+MODULE = myextension
+LIBRARY_NAME = myIntricate_s
+FORCE_STATIC_LIB = 1
+
+XPI_NAME = myextension
+
+...más cosas aquí...
+</pre>
+
+<p>El makefile build une las bibliotecas estáticas generadas por los submódulos y crea una única biblioteca dinámica de componentes:</p>
+
+<pre>DEPTH		= ../../../..
+topsrcdir	= @top_srcdir@
+srcdir		= @srcdir@
+VPATH		= @srcdir@
+
+include $(DEPTH)/config/autoconf.mk
+
+IS_COMPONENT = 1
+MODULE = myextension
+LIBRARY_NAME = myAdvanced
+
+XPI_NAME = myextension
+
+DEFINES += XPCOM_GLUE
+
+SHARED_LIBRARY_LIBS = \
+		$(DIST)/lib/$(LIB_PREFIX)myIntricate_s.$(LIB_SUFFIX) \
+		$(DIST)/lib/$(LIB_PREFIX)myMultifarious_s.$(LIB_SUFFIX) \
+                $(DIST)/lib/$(LIB_PREFIX)xpcomglue_s.$(LIB_SUFFIX) \
+                $(DIST)/lib/$(LIB_PREFIX)xpcom.$(LIB_SUFFIX) \
+                $(DIST)/lib/$(LIB_PREFIX)nspr4.$(LIB_SUFFIX) \
+                $(DIST)/lib/$(LIB_PREFIX)plds4.$(LIB_SUFFIX) \
+                $(DIST)/lib/$(LIB_PREFIX)plc4.$(LIB_SUFFIX) \
+		$(NULL)
+
+REQUIRES	= \
+		xpcom \
+		string \
+		$(NULL)
+
+CPPSRCS		= \
+		Advanced.cpp \
+		$(NULL)
+
+include $(topsrcdir)/config/rules.mk
+
+LOCAL_INCLUDES += \
+        -I$(srcdir)/../intricate/src \
+        -I$(srcdir)/../multifarious/src \
+        $(NULL)
+</pre>
+
+<p>El makefile en el directorio <code>advanced/</code> debería listar los directorios <code>intricate/</code>, <code>multifarious/</code> y <code>build/</code> en su variable <strong>DIRS</strong>. Asegúrate de que <code>build/</code> esté al final porque no puede crear la biblioteca hasta que los otros makefiles hayan sido completados.</p>
+
+<h3 id="Otros_temas" name="Otros_temas">Otros temas</h3>
+
+<h4 id="Agregar_archivos_de_datos_a_tus_extensiones" name="Agregar_archivos_de_datos_a_tus_extensiones">Agregar archivos de datos a tus extensiones</h4>
+
+<p>En algunos casos, puedes desear incluir archivos adicionales en tus extensiones que no pertenecen al subdirectorio <code>chrome/</code>. Algunos ejemplos pueden ser archivos de bases de datos o esquemas XML. Esto puede conseguirse añadiendo, en el makefile, código personalizado que copie los ficheros desde el árbol de origen hacia el directorio de destino de la extensión.</p>
+
+<h5 id="Copiar_archivos_de_datos_al_directorio_de_destino" name="Copiar_archivos_de_datos_al_directorio_de_destino">Copiar archivos de datos al directorio de destino</h5>
+
+<p>Supongamos que tienes algunos ficheros de datos que contienen información estadística que deseas incluir en tu extensión y que esté disponible para tus componentes. Tienes estos archivos, cuya extensión es .TXT, dentro del subdirectorio <code>stats/</code> bajo el directorio de tu extensión en el árbol del código fuente. Puedes usar el siguiente makefile para copiar los ficheros al directorio de destino de la extensión:</p>
+
+<pre>libs::
+	if test ! -d $(FINAL_TARGET)/stats; then \
+		$(NSINSTALL) -D $(FINAL_TARGET)/stats; \
+	fi
+	$(INSTALL) $(srcdir)/*.txt $(FINAL_TARGET)/stats
+</pre>
+
+<h5 id="Acceder_a_ficheros_de_datos_desde_los_componentes" name="Acceder_a_ficheros_de_datos_desde_los_componentes">Acceder a ficheros de datos desde los componentes</h5>
+
+<p>El truco para acceder a los ficheros es averiguar dónde está el directorio <em>home</em> de tu extensión. Los rumores dicen que en el futuro esto será posible a través del interface <a href="/es/NsExtensionManager" title="es/NsExtensionManager">nsExtensionManager</a> o alguna cosa similar. Mientras tanto, hay un modo simple y fiable de hacer esto. En la implementación de cualquier componente JavaScript XPCOM hay un símbolo especial <strong>__LOCATION__</strong> (dos subrayados delante y dos detrás) que apunta al fichero de implementación del componente. Así, puedes escribir un componente simple que deduzca el directorio raíz de tu extensión extrapolando desde su ubicación.</p>
+
+<p><a class="external" href="http://www.builderau.com.au/program/soa/Creating_XPCOM_components_with_JavaScript/0,39024614,39206503,00.htm">Este artículo</a> explica cómo crear un componente XPCOM en JavaScript. Necesitarás un fichero IDL para un interfaz que tenga un aspecto más o menos así:</p>
+
+<pre>interface myILocation : nsISupports
+{
+    readonly attribute nsIFile locationFile;
+};
+</pre>
+
+<p>Sitúa el fichero IDL en el directorio <code>public/</code> del proyecto o subproyecto. En el directorio <code>src/</code> coloca el fichero JavaScript que implementa el componente. La implementación del componente incluirá los métodos para solicitar la ruta o el fichero para el directorio <em>home</em> de la extensión.</p>
+
+<pre>myLocation.prototype =
+{
+  QueryInterface: function(iid)
+  {
+    if (iid.equals(nsISupports))
+      return this;
+    if (iid.equals(myILocation))
+      return this;
+
+    Components.returnCode = Components.results.NS_ERROR_NO_INTERFACE;
+    return null;
+  },
+
+  get locationFile()
+  {
+     return __LOCATION__.parent.parent;
+  }
+}
+</pre>
+
+<p>Esto asume que el componente se encuentra en un subdirectorio del directorio de la extensión (por convenio, este directorio se llama <code>components/</code>). La propiedad <code>parent</code> de <strong>__LOCATION__</strong> devuelve <code>components/</code>, y el valor <code>parent</code> de éste es el directorio de la extensión.</p>
+
+<p>El último paso es modificar el makefile del directorio de orìgen donde colocaste el fichero JavaScript para que sea copiado dentro de la ubicación apropiada en la extensión.</p>
+
+<pre>libs::
+	$(INSTALL) $(srcdir)/*.js $(FINAL_TARGET)/components
+</pre>
+
+<p>Ahora puedes instanciar este componente y usar la propiedad <code>locationFile</code> para obtener un interface <code><a href="/es/NsIFile" title="es/NsIFile">nsIFile</a></code> que apunte al directorio <em>home</em> de tu extensión.</p>
+
+<h4 id="Usar_otras_bibliotecas" name="Usar_otras_bibliotecas">Usar otras bibliotecas</h4>
+
+<p>Para extensiones más sofisticadas, tal vez desees integrar bibliotecas de terceros que proveerán funciones especializadas para conectividad de bases de datos, procesamiento de imágenes, funciones de red y otras tareas. Si quieres que tu extensión se ejecute en todas las plataformas de FireFox, necesitarás el código fuente de la biblioteca en cuestión, así que asumiré que está disponible.</p>
+
+<p>La mejor forma de hacerlo, desde el punto de vista del ciclo de desarrollo, es crear un makefile estilo-Mozilla para la biblioteca. Esto funciona bien para bibliotecas que tienen un proceso de compilación sencillo sin demasiada configuración. Un buen ejemplo de esto es la biblioteca SQLite incluida en el árbol de compilación de Mozilla en <code>db/sqlite</code>. Adaptando el makefile de esta manera, la biblioteca se crea como una parte estándar del proceso de compilado de Mozilla, lo cual elimina pasos adicionales. El lado malo es que necesitarás actualizar el makefile modificado cada vez que se publique una nueva versión de la biblioteca.</p>
+
+<p>Para bibliotecas que tienen un proceso de configuración complejo, que use un compilador no-estándar, o que tengan alguna otra característica especial, quizá no sea viable crear un makefile compatible con el estilo Mozilla. En este caso, recomendaría colocar la distribución completa de la biblioteca dentro del proyecto o subproyecto que la utiliza. Por ejemplo, si la biblioteca <code>acmelib</code> se usa dentro del subproyecto <code>multifarious/</code> en el ejemplo de arriba, se colocaría como un subdirectorio bajo ese proyecto (en el mismo nivel que <code>public/</code> y <code>src/</code>).</p>
+
+<p>Por supuesto, esto significa que tendrás que compilar <code>acmelib</code> manualmente en cada plataforma antes de lanzar Mozilla. Pero por lo menos luego puedes referirte a los archivos include y las bibliotecas importadas desde tus componentes usando rutas relativas.</p>
+
+<h4 id="Compilar_para_m.C3.BAltiples_plataformas" name="Compilar_para_m.C3.BAltiples_plataformas">Compilar para múltiples plataformas</h4>
+
+<p>Información del Documento Original</p>
+
+<div class="originaldocinfo">
+<ul>
+ <li>Autor: Matthew Gertner - Julio 26, 2005.</li>
+ <li>Permission granted to migrate in Jan 2006, including permission to relicense under the CC:By-SA.</li>
+ <li>Código Original: <a class="external" href="http://www.allpeers.com/blog/creating-complex-firefox-extensions/" rel="freelink">http://www.allpeers.com/blog/creatin...ox-extensions/</a></li>
+</ul>
+</div>
+
+<p> </p>
diff --git a/files/es/orphaned/css_dinámico/index.html b/files/es/orphaned/css_dinámico/index.html
new file mode 100644
index 0000000000..af44e82910
--- /dev/null
+++ b/files/es/orphaned/css_dinámico/index.html
@@ -0,0 +1,340 @@
+---
+title: CSS dinámico
+slug: orphaned/CSS_dinámico
+tags:
+  - CSS
+  - Todas_las_Categorías
+original_slug: CSS_dinámico
+---
+<p>
+</p>
+<h3 id="Introducci.C3.B3n"> Introducción </h3>
+<p>Tradicionalmente las páginas web se han dividido en dos categorías: estáticas y dinámicas. Hemos leído muchas veces que con <a href="es/XHTML">XHTML</a> y <a href="es/CSS">CSS</a> se pueden crear documentos de calidad, pero fijos, estáticos. Si quieres que tus páginas se adapten y cambien según las acciones del usuario, si quieres dinamismo, necesitas javascript o similares... Ya no.
+</p><p>Si teniamos <a href="es/DHTML">DHTML</a> (html dinámico), ahora tenemos <b>CDSS</b> (<b>C</b>ss <b>D</b>inámico <b>S</b>in <b>S</b>cripts). Como en un cuento de hadas en el que un humilde sapo acaba siendo el príncipe de la historia, unas modestas pseudo-clases pueden acabar siendo las estrellas de la Web. </p><p>Las <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/selector.html#q15">pseudo-clases</a> en principio nacieron para darle dinamismo a los enlaces, y este es el uso que se les ha dado durante los últimos años. Es raro el archivo CSS que no incluya unas líneas semejantes a estas:
+</p>
+<pre>a:link { ... }
+a:active { ... }
+a:visited { ... }
+</pre>
+<p>¡Pero la situación ha cambiado! Ahora podemos aplicarle pseudo-clases a la mayoría de los elementos, y jugando con los selectores podemos crear documentos dinámicos usando exclusivamente CSS.
+</p>
+<h3 id="Poco_a_poco"> Poco a poco </h3>
+<p>Lo veremos poco a poco y por medio de ejemplos centrados en la pseudo-clase :hover. Obviamente combinando diversas pseudo-clases pueden obtenerse efectos más complejos.
+Para probar los ejemplos basta copiar y pegar el código (sin quitar ni añadir nada) en un archivo vacio y visualizarlo con el navegador. </p><p>Empecemos por el uso tradicional:
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+a:hover { color: red; }
+
+&lt;/style&gt;
+
+&lt;p&gt; Párrafo con &lt;a&gt;enlace&lt;/a&gt; que se pone rojo &lt;/p&gt;
+
+</pre>
+<p>Soltamos amarras, levamos 'anclas' y...
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+p:hover { color: red; font-variant: small-caps; }
+li:hover { color: blue; background: silver; }
+div:hover { color: orange; text-align: right; }
+
+&lt;/style&gt;
+
+&lt;p&gt; Párrafo que se pone rojo y mayúsculo. &lt;/p&gt;
+&lt;ul&gt; &lt;li&gt; Item que se pone azul y con fondo gris. &lt;/li&gt; &lt;/ul&gt;
+&lt;div&gt; División con texto que se flota a la derecha y se pone naranja. &lt;/div&gt;
+</pre> <p>Esto nos permite crear con facilidad efectos dinámicos, podemos cambiar la visualización de las cosas dependiendo de los actos del usuario. Con un poco de imaginación y buen gusto se pueden hacer maravillas.
+</p>
+<h4 id="La_cosa_da_mucho_juego"> La cosa da mucho juego </h4>
+<p>Podemos cambiar cualquier propiedad, pero no todas son igual de útiles a la hora de crear dinamismo. Algunas de las más interesantes serían por ejemplo: display, position, z-index...
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+.comun { position: absolute; width: 10em;
+	 padding: 2em; text-align: center; }
+
+#rojo { background-color: red;
+        left: 1em; top: 1em;
+        z-index: 1; }
+
+#azul { background-color: blue;
+        left: 5em; top: 5em;
+        z-index: 2; }
+
+#naranja { background-color: orange;
+           left: 9em; top: 2em;
+           z-index: 3; }
+
+#rojo:hover,
+#azul:hover,
+#naranja:hover { z-index: 4; }
+
+&lt;/style&gt;
+
+&lt;p id='rojo'    class='comun'&gt;El rojo es vivo&lt;/p&gt;
+&lt;p id='azul'    class='comun'&gt;El azul es elegante&lt;/p&gt;
+&lt;p id='naranja' class='comun'&gt;El naranja es guay&lt;/p&gt;
+</pre>
+<h3 id="Pero_esto_no_es_todo.2C_a.C3.BAn_hay_m.C3.A1s."> Pero esto no es todo, aún hay más. </h3>
+<p>Jugando con los <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/selector.html">selectores</a> podemos relacionar unos elementos con otros.
+</p><p>Por ejemplo: al posicionarnos sobre <a href="es/HTML/Elemento/p">p</a> cambiamos las propiedades de <a href="es/HTML/Elemento/a">a</a>, y al posicionarnos sobre <a href="es/HTML/Elemento/a">a</a> cambiamos las propiedades de <a href="es/HTML/Elemento/em">em</a>.
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+em { display: none; }
+
+p:hover a { color: red; }
+a:hover em { display: inline; }
+
+&lt;/style&gt;
+
+&lt;p&gt; Párrafo &lt;a&gt;con enlace &lt;em&gt;que se pone rojo&lt;/em&gt; &lt;/a&gt; &lt;/p&gt;
+</pre>
+<p>Bueno, despues de unos ejemplos simples, uno un poco más complejo:
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+.editorial { width: 30%;}
+.item { list-style: none; list-style-position: inside;
+        padding: 0.2ex; margin: 0.2ex; }
+
+a { color: darkblue; text-decoration: none;}
+div:hover a { color: blue; text-decoration: underline;}
+
+.oculto ul { display: none; }
+div:hover ul { display: block; }
+
+ul { border: transparent solid 0.1ex; }
+ul:hover { border: peru solid 0.1ex; }
+
+ul:hover abbr,
+ul:hover dfn { color: red; }
+
+.vista { visibility: hidden; }
+ul:hover .vista { visibility: visible; }
+
+&lt;/style&gt;
+
+&lt;div class='editorial oculto'&gt;
+   &lt;h2&gt; &lt;a&gt; CSS &lt;/a&gt; &lt;/h2&gt;
+   &lt;ul class='item'&gt;
+      &lt;li&gt; &lt;dfn&gt;CSS&lt;/dfn&gt; es una c seguida de dos eses. &lt;/li&gt;
+      &lt;li&gt; También es un estándar del &lt;abbr&gt;W3C&lt;/abbr&gt;. &lt;/li&gt;
+      &lt;li class='vista'&gt; No se me ocurre qué poner aquí. &lt;/li&gt;
+   &lt;/ul&gt;
+
+&lt;/div&gt;
+
+&lt;div class='editorial'&gt;
+   &lt;h2&gt; &lt;a&gt; HTML &lt;/a&gt; &lt;/h2&gt;
+   &lt;ul class='item'&gt;
+      &lt;li&gt; &lt;dfn&gt;HTML&lt;/dfn&gt; es un lenguaje para el marcado de hipertextos. &lt;/li&gt;
+      &lt;li&gt; Es un estándar del &lt;abbr&gt;W3C&lt;/abbr&gt;. &lt;/li&gt;
+      &lt;li class='vista'&gt; Creado por Tim Berners-Lee. &lt;/li&gt;
+   &lt;/ul&gt;
+&lt;/div&gt;
+</pre>
+<h4 id="Tipos_de_relaciones_familiares"> Tipos de relaciones <i>familiares</i></h4>
+<p>Hasta el momento todos los ejemplos muestran relaciones padre → descendiente, si has consultado la especificación sabrás que no son las únicas, las posibilidades son las siguientes:
+</p>
+<h5 id="Padre_.E2.86.92_hijo"> Padre → hijo </h5>
+<p>Esta relación se expresa por medio del combinador ("&gt;"), relaciona un elemento con sus descendientes directos. En el siguiente ejemplo seleccionamos los elementos con clase 'subrayado' que sean hijos directos de <a href="es/HTML/Elemento/div">div</a>
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+body:hover &gt; .subrayado { text-decoration: underline;}
+
+&lt;/style&gt;
+
+&lt;div&gt;
+&lt;p&gt; Lo siguiente es una
+ &lt;span class='subrayado'&gt;cita&lt;/span&gt;:
+&lt;/p&gt;
+&lt;hr&gt;
+&lt;blockquote class='subrayado'&gt; &lt;p&gt;Si buscas resultados distintos, no hagas siempre lo mismo.
+ &lt;cite&gt;Einstein&lt;/cite&gt; &lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;/div&gt;
+</pre>
+<h5 id="Padre_.E2.86.92_descendiente"> Padre → descendiente </h5>
+<p>Esta relación se expresa por medio de un espacio en blanco (" ") relaciona un elemento con un descendiente. Este es el método más flexible, puedes seleccionar cualquier elemento independientemente del parentesco exacto.
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+     p:hover em { visibility: hidden;}
+
+&lt;/style&gt;
+
+&lt;h2&gt; Selección de descendientes&lt;/h2&gt;
+&lt;p&gt;
+  &lt;em&gt;Este em es hijo de un párrafo&lt;/em&gt;
+  &lt;span&gt; span tambien, pero...
+     &lt;em&gt;Este em no es hijo de un párrafo, &lt;/em&gt;
+     aunque sí descendiente (hijo de un hijo).
+  &lt;/span&gt;
+&lt;/p&gt;
+</pre>
+<h5 id="Hermano_.E2.86.92_hermano_.28adyacente.29"> Hermano → hermano (adyacente) </h5>
+<p>Esta relación es expresa por medio del combinador ("+"), relaciona un elemento con su hermano adyacente (el inmediatamente siquiente). Este es el método aparentemente más limitado, pero el que abre más puertas.
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+#primero + li { list-style-type: none; }
+
+&lt;/style&gt;
+
+&lt;ul&gt;
+  &lt;li id='primero'&gt;item 1&lt;/li&gt;
+  &lt;li&gt;item 2&lt;/li&gt;
+  &lt;li&gt;item 3&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+<p><br>
+Esto de relacionar hermanos está muy bien, pero solo se puede seleccionar el adyacente, esto es una limitación importante, pero bueno, siempre puedes seleccionar el adyacente del adyacente, o el...
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+#primero + li + li + li { list-style-type: none; }
+
+&lt;/style&gt;
+
+&lt;ul&gt;
+  &lt;li id='primero'&gt;item 1&lt;/li&gt;
+  &lt;li&gt;item 2&lt;/li&gt;
+  &lt;li&gt;item 3&lt;/li&gt;
+  &lt;li&gt;item 4&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+<h5 id="Otros_parentescos"> Otros parentescos </h5>
+<p>Padres, hijos y hermanos no son las únicas relaciones dentro de una familia. ¿Qué pasa si quiero seleccionar un nieto, o un sobrino? ¿Se puede? </p>
+<dl><dt> Seleccionando un nieto
+</dt><dd> No tiene mayor complicación, al fin y al cabo, un nieto no es más que un hijo de un hijo.
+</dd></dl>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+p:hover &gt; span &gt; em { color: red; }
+
+&lt;/style&gt;
+
+&lt;p&gt;
+ &lt;em&gt;este em es hijo de un párrafo&lt;/em&gt;
+ &lt;span&gt; span también, pero...
+   &lt;em&gt;este em es nieto&lt;/em&gt; &lt;/span&gt;
+&lt;/p&gt;
+</pre>
+<dl><dt> Seleccionando un sobrino.
+</dt><dd> No hay problema, un sobrino no es más que un hijo de un hermano.
+</dd></dl>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+p:hover + div &gt; em { color: red; }
+
+&lt;/style&gt;
+
+&lt;p&gt;Al ponerte sobre este párrafo&lt;/p&gt;
+&lt;div&gt; Cambias las propiedades de
+   &lt;em&gt;este em&lt;/em&gt;
+&lt;/div&gt;
+</pre>
+<h5 id="Limitaciones"> Limitaciones </h5>
+<p>De los ejemplos anteriores se desprende que es muy fácil abarcar todas las combinaciones posibles. Siempre y cuando la secuencia de los selectores sea:
+</p>
+<ol><li>Descendente - Un elemento y sus descendientes.
+</li><li>Horizontal - Un elemento y sus hermanos.
+</li><li>Mixta - Una combinación de las anteriores.
+</li></ol>
+<p>Lo que no se puede hacer es seleccionar un ascendiente (ej. un padre). Por lo tanto <u>el siquiente ejemplo ni funciona ni debe hacerlo</u>:
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+em:hover #div { color: red; }
+
+&lt;/style&gt;
+
+&lt;h1&gt;Este ejemplo ni funciona ni debe hacerlo.&lt;/h1&gt;
+
+&lt;div id='div'&gt;
+   &lt;em&gt;Este em&lt;/em&gt;
+   no puede cambiar las propiedades de su padre.
+&lt;/div&gt;
+</pre>
+<p>Además hay una curiosa limitación ¿será un bug? Un selector compuesto puede empezar por un elemento o por un #id con :hover, Pero no puede empezar por una clase con :hover. Sorprendentemente con el selector universal (*) tampoco funciona.
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+* { color: red; }
+
+  .uno       .cero { color: blue; }      /* esto sí funciona */
+ *.uno       .cerocero { color: blue; }  /* esto sí funciona */
+
+  #uno:hover .dos { color: blue; }       /* esto sí funciona */
+ul.uno:hover .cuatro { color: blue; }    /* esto sí funciona */
+
+  .uno:hover .tres { color: blue; }      /* esto NO funciona */
+ *.uno:hover .cinco { color: blue; }     /* esto TAMPOCO funciona */
+
+&lt;/style&gt;
+
+&lt;div class='uno'&gt;
+  .uno       .cero { color: blue; }
+  &lt;em class='cero'&gt;Esto sí funciona,&lt;/em&gt; y... &lt;br&gt;
+  *.uno       .cerocero { color: blue; }
+  &lt;em class='cerocero'&gt;esto también funciona.&lt;/em&gt;
+&lt;/div&gt;
+
+&lt;ul id='uno' class='uno'&gt;
+  &lt;li class='dos'&gt;#uno:hover .dos - esto sí funciona.&lt;/li&gt;
+  &lt;li class='tres'&gt;.uno:hover .tres - esto NO funciona.&lt;/li&gt;
+  &lt;li class='cuatro'&gt;ul.uno:hover .cuatro - esto sí funciona.&lt;/li&gt;
+  &lt;li class='cinco'&gt;*.uno:hover .cinco - esto TAMPOCO funciona.&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+<h3 id="Navegadores_que_lo_soportan">Navegadores que lo implementan</h3>
+<p>Los navegadores pueden dividirse en dos grupos: IE y el resto.</p>
+<ul> <li><strong>IE</strong>: IE6 no lo implementa, pero IE7 sí, aunque parece que sólo parcialmente... (probado en IE7 beta).</li> <li><strong>El resto</strong>: cada día son más los navegadores que implementan este uso de las pseudo-clases: <ul> <li>Firefox 1.5 - sí lo implementa, al igual que todos los navegadores basados en las últimas versiones de Gecko.</li> <li>Opera - sí lo implementa (pendiente de confirmación plena).</li> <li>Konqueror/Safari - sí lo implementa (pendiente de confirmación plena) al igual que todos los navegadores basados en las últimas versiones de KHTML.</li> </ul> </li>
+</ul><h3 id="Referencia">Referencia</h3>
+<p>Lo cierto es que no hay mucho escrito sobre el tema (en castellano casi nada, o nada), la gente sólo suele escribir sobre las cosas que funcionan en IE. Pero tampoco hace mucha falta. Todo lo que necesitamos está en <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/cover.html#minitoc">el estándar CSS-2</a>. Además, <em>curiosamente</em>, los dos pilares que sostienen esta funcionalidad (pseudoclases y selectores), están explicados en la misma página: <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/selector.html">el capítulo 5</a>.</p>
+<p>Recomiendo encarecidamente la lectura completa y atenta de todo el capítulo, y ya puestos, de toda la especificación. Aunque para el asunto que nos ocupa nos interesan principalmente:</p>
+<dl> <dd>Sobre los selectores por parentesco, sub-capítulos: 5.5, 5.6, 5.7</dd> <dd>Sobre las pseudo-clases, sub-capítulo: 5.11</dd>
+</dl><h3 id="CSS-3"> CSS-3 </h3>
+<p>Todo lo explicado es conforme a CSS-2.1 ¿Qué nos depara el futuro? Si los pilares de esta técnica son las pseudo-clases y los selectores, <a class="external" href="http://www.w3.org/Style/CSS/current-work">CSS-3</a> traerá muchas más <a class="external" href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#pseudo-classes">pseudo-clases</a> y muchos más <a class="external" href="http://www.w3.org/TR/2005/WD-css3-selectors-20051215/#selectors">selectores</a>, en definitiva, muchas más posibilidades de hacer cosas interesantes.
+</p><p>Por ejemplo, hemos visto las limitaciones de CSS-2 para seleccionar hermanos, con CSS-3 esta limitación desaparece. Lo siguiente es CSS-3 pero funciona (usando el navegador apropiado).
+</p>
+<pre>&lt;meta http-equiv='Content-Type' content='text/html; charset=UTF-8'&gt;
+&lt;style type='text/css'&gt;
+
+.gracias { visibility: hidden; }
+
+#primero:hover + .gracias { visibility: visible; }
+#primero:hover ~ * span { color: red; } /* esto:'~' es CSS-3 */
+
+&lt;/style&gt;
+
+&lt;ul&gt;
+  &lt;li id='primero'&gt;Por favor, ponga el cursor encima de esta frase.&lt;/li&gt;
+  &lt;li class='gracias'&gt;Le doy las gracias con CSS-2.1&lt;/li&gt;
+  &lt;li&gt;Item normal y corriente&lt;/li&gt;
+  &lt;li&gt;El futuro: &lt;span&gt;span en rojo gracias a CSS-3&lt;/span&gt;&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+<h3 id="Notas_finales"> Notas finales </h3>
+<ul><li> Sí, es cierto que con <a href="es/JavaScript">JavaScript</a> o PHP pueden hacerse cosas mucho más avanzadas, pero aquí está la gracia del artículo, que sin necesidad de Javascript o PHP, solo con CSS, puede añadírsele mucho dinamismo a las páginas web.
+</li></ul>
+<ul><li> Este artículo es sólo una introducción al tema, por razones didácticas los ejemplos son premeditadamente simples y limitados a una sola pseudo-clase (:hover). Puede que en el futuro exista un <a href="es/CSS_Din%c3%a1mico_II">CSS Dinámico II</a> que profundice más en el tema, muestre el uso de otras pseudo-clases y ejemplos más complejos.
+</li></ul>
+<p><span class="comment">Categorías</span>
+</p>
diff --git a/files/es/orphaned/desarrollando_mozilla/index.html b/files/es/orphaned/desarrollando_mozilla/index.html
new file mode 100644
index 0000000000..8e6cc17b75
--- /dev/null
+++ b/files/es/orphaned/desarrollando_mozilla/index.html
@@ -0,0 +1,17 @@
+---
+title: Desarrollando Mozilla
+slug: orphaned/Desarrollando_Mozilla
+tags:
+  - Desarrollando_Mozilla
+  - Todas_las_Categorías
+original_slug: Desarrollando_Mozilla
+---
+<p>¿Quieres echar una mano corrigiendo bugs, pero no sabes por dónde empezar?</p>
+<p>Este es el punto de partida para todo lo relacionado con el hackeo de la bestia. Descubrirás cómo conseguir el código fuente, cómo compilarlo, cómo crear parches, y todas esas cosas esenciales que cualquier hacker de Mozilla debería conocer.</p>
+<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Documentaci.C3.B3n"><a href="/Special:Tags?tag=Desarrollando_Mozilla&amp;language=es" title="Special:Tags?tag=Desarrollando_Mozilla&amp;language=es">Documentación</a></h4> <dl> <dt><a href="/es/Descargar_el_código_fuente_de_Mozilla" title="es/Descargar_el_código_fuente_de_Mozilla">Descargar el código fuente de Mozilla</a></dt> <dd><small>El código fuente de Mozilla puede obtenerse descargando el archivo con el código fuente o usando el cliente CVS (Concurrent Versioning System).</small></dd> </dl> <dl> <dt><a href="/es/Hackeando_Firefox" title="es/Hackeando_Firefox">Hackeando Firefox</a></dt> <dd><small>Participa en el desarrollo de <em>front-end</em> de Firefox.</small></dd> </dl> <dl> <dt><a href="/es/Documentación_para_la_compilación" title="es/Documentación_para_la_compilación">Documentación para la compilación</a></dt> <dd><small>Esta sección contiente documentación sobre el sistema de compilación de Mozilla. Entre otras cosas, muestra como obtener el código y como compilarlo.</small></dd> </dl> <dl> <dt><a class="external" href="http://www.mozilla.org/hacking/">Hacking documentation on mozilla.org (en)</a></dt> <dd><small>Another page with hacking-related documentation. We're working on this.</small></dd> </dl> <dl> <dt>Preguntas frecuentes sobre depuración.</dt> <dd><small>Los consejos de depuración son específicos para cada plataforma. Elija: <a href="/es/Depurando_Mozilla_en_Windows" title="es/Depurando_Mozilla_en_Windows">Windows</a>, <a class="external" href="http://www.mozilla.org/unix/debugging-faq.html">Linux</a>, o <a href="/es/Depurando_Mozilla_en_Mac_OS_X" title="es/Depurando_Mozilla_en_Mac_OS_X">Mac OS X</a>.</small></dd> </dl> <p><span>enlaces en rojo: ; <a href="/es/Creando_un_parche" title="es/Creando un parche">Creando un parche</a>: &lt;small&gt;Consejos para crear parches que permitan que tus cambios se incluyan.&lt;/small&gt;</span> <span><a href="/Special:Tags?tag=Desarrollando_Mozilla&amp;language=es" title="Special:Tags?tag=Desarrollando_Mozilla&amp;language=es">Ver más...</a></span></p> </td> <td> <h4 id="Comunidad">Comunidad</h4> <ul> <li>En mozillaES <ul> <li><a class="external" href="http://www.mozillaes.org/index.php?option=com_forum&amp;Itemid=122&amp;page=viewforum&amp;f=15&amp;sid=b486df56e1b6b367ab5a0e85a612bbf6">Desarrollo Mozilla</a></li> </ul> </li> </ul> <ul> <li>En la comunidad Mozilla... en inglés</li> </ul> <p>{{ DiscussionList("dev-general", "mozilla.dev.general") }}</p> <ul> <li><a class="link-irc" href="irc://irc.mozilla.org/developers">#developers en irc.mozilla.org</a></li> <li><a class="external" href="http://www.mozilla.org/community/developer-forums.html">Lista de temas específicos para todos los foros sobre desarrollo</a></li> </ul> <p><span><a href="/es/Desarrollando_Mozilla/Comunidad" title="es/Desarrollando_Mozilla/Comunidad">Ver más...</a></span></p> <h4 id="Herramientas">Herramientas</h4> <ul> <li><a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?format=guided">Bugzilla</a></li> <li><a class="external" href="http://bonsai.mozilla.org/cvsqueryform.cgi">Bonsai</a></li> <li><a href="/es/Tinderbox" title="es/Tinderbox">Tinderbox</a></li> <li><a class="external" href="http://lxr.mozilla.org/">Mozilla Cross-Reference (LXR)</a></li> </ul> <p><span><a href="/Special:Tags?tag=Desarrollando_Mozilla:Herramientas&amp;language=es" title="Special:Tags?tag=Desarrollando_Mozilla:Herramientas&amp;language=es">Ver más...</a></span></p> <h4 id="Temas_Relacionados">Temas Relacionados</h4> <dl> <dd><a href="/es/Garantía_de_Calidad" title="es/Garantía_de_Calidad">Garantía de Calidad</a>, <a href="/es/Seguridad" title="es/Seguridad">Seguridad</a></dd> </dl> </td> </tr> </tbody>
+</table>
+<p><span>Categorías</span></p>
+<p><span>Interwiki Language Links</span></p>
+<p> </p>
+
+<p>{{ languages( { "de": "de/Mozilla_entwickeln", "en": "en/Developing_Mozilla", "fr": "fr/D\u00e9veloppement_de_Mozilla", "ja": "ja/Developing_Mozilla", "pl": "pl/Programowanie_Mozilli", "pt": "pt/Desenvolvimento_Mozilla", "zh-cn": "cn/\u5f00\u53d1Mozilla" } ) }}</p>
diff --git a/files/es/orphaned/detectar_la_orientación_del_dispositivo/index.html b/files/es/orphaned/detectar_la_orientación_del_dispositivo/index.html
new file mode 100644
index 0000000000..d414a35732
--- /dev/null
+++ b/files/es/orphaned/detectar_la_orientación_del_dispositivo/index.html
@@ -0,0 +1,57 @@
+---
+title: Detectar la orientación del dispositivo
+slug: orphaned/Detectar_la_orientación_del_dispositivo
+tags:
+  - Aceleración
+  - CSS
+  - Consultas
+  - Orientación
+  - para_revisar
+original_slug: Detectar_la_orientación_del_dispositivo
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ gecko_minversion_header ("1.9.1") }}</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cada vez más, los dispositivos habilitados para la web son capaces de determinar su <strong>orientación,</strong> es decir, que pueden informar sobre los datos que indican cambios en su orientación con relación a la atracción de la gravedad.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En concreto, los dispositivos manuales como, por ejemplo, los teléfonos móviles pueden utilizar esta información para rotar automáticamente la pantalla de forma que se mantenga en posición vertical. Cuando el dispositivo se gira, presenta una vista en pantalla panorámica del contenido de la web, de manera que su anchura es superior a su altura.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Hay dos maneras de tratar la información de orientación en Gecko.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La primera es la <a href="/En/CSS/Media_queries#orientation" title="En/CSS/Media queries#orientation">consulta a medios de orientación</a> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto te permite ajustar el contenido de tu diseño con CSS, en función de si el dispositivo está en modo horizontal (es decir, su anchura es superior a su altura) o en modo vertical (su altura es mayor que su anchura).</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La segunda manera de administrar la información de orientación, , es el <a href="/en/DOM/MozOrientation" title="en/DOM/MozOrientation">evento </a></span></span><a href="/en/DOM/MozOrientation" title="en/DOM/MozOrientation"><code>MozOrientation</code></a><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><a>, agregado en Gecko 1.9.2 (Firefox 3.6).</a></span></span><a> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Este evento se envía cuando el acelerómetro detecta un cambio en la orientación del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al recibir y procesar los datos reportados por los eventos <code>MozOrientation</code>, es posible responder de forma interactiva a los cambios de elevación y rotación causados por el movimiento del dispositivo.</span></span></a></p><a>
+<h2 id="Ajuste_de_diseño_cuando_cambia_la_orientación"><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Ajuste de diseño cuando cambia la orientación</span></span></h2>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Uno de los casos en que te interesarán los cambios de orientación es cuando quieras evaluar el diseño de tu contenido en función de la orientación del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por ejemplo, tal vez desees que una barra de botones se extienda a lo largo de la pantalla del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si utilizas una consulta multimedia, puede hacer esto fácilmente y de forma automática.</span></span></p>
+<h3 id="Construir_el_CSS_para_cada_orientación"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Construir el CSS para cada orientación</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para este caso práctico, necesitarás dos hojas de estilo: una para ser usada cuando el dispositivo está en orientación vertical (su altura es mayor que su anchura) y la otra que se utiliza cuando el dispositivo está en posición horizontal (su ancho es mayor a su altura).</span></span></p>
+<table class="standard-table" style="width: auto;"> <tbody> <tr> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Vertical</span></span></td> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Horizontal</span></span></td> </tr> <tr> <td> <p><code>#toolbar {</code><br> <code>   width: 100%;</code><br> <code> }</code><br> <code> </code></p> </td> <td><code>#toolbar {</code><br> <code>   min-height: 500px;</code><br> <code>   width: 125px;</code><br> <code>   margin-right: 8px;</code><br> <code>   float: left;</code><br> <code> }</code><br> <code> </code></td> </tr> </tbody>
+</table>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Como puedes ver si analizas los dos fragmentos de CSS anteriores, en el modo vertical, hacemos que la barra de herramientas se extienda horizontalmente en la parte superior de la ventana, con el fin de maximizar el espacio horizontal disponible para el contenido.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el modo horizontal, la barra de herramientas se extiende verticalmente por el lado izquierdo del documento.</span></span></p>
+<h3 id="La_aplicación_del_CSS_correcto_en_función_de_la_orientación_actual"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La aplicación del CSS correcto en función de la orientación actual</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo único que tienes que hacer ahora es establecer las consultas multimedia que seleccionará automáticamente el archivo CSS correcto basado en la orientación del dispositivo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto es sencillo:</span></span></p>
+<pre class="brush: css">&lt;link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css"&gt;
+&lt;link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css"&gt;
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">A partir de ahora, la carga de los contenidos da como resultado la disposición correcta que se aplicará en función de la orientación del dispositivo.</span></span></p><h2 id="Procesamiento_de_eventos_de_orientación"><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Procesamiento de eventos de orientación</span></span></h2>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ gecko_minversion_header("1.9.2") }}</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Firefox 3.6 (Gecko 1.9.2) introdujo el evento <code>MozOrientation</code>, al que puedes prestar atención con el fin de recibir las actualizaciones mientras el usuario ajusta la orientación del dispositivo.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En la actualidad, este es compatible con algunos dispositivos móviles (Windows Mobile, por ejemplo) y en el MacBook de Apple y los equipos MacBook Pro.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo único que tienes que hacer para comenzar a recibir los eventos de orientación es lo siguiente:</span></span></p>
+<pre class="brush: js">window.addEventListener("MozOrientation", handleOrientation, true);</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Después de registrar tu escucha de eventos (en este caso, una función de JavaScript llamada handleOrientation()), la función de escucha se llama de forma periódica con la orientación de datos actualizada.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El evento de orientación contiene tres valores:</span></span></p>
+<table class="standard-table"> <tbody> <tr> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Campo</span></span></td> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Tipo</span></span></td> <td class="header"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Descripción</span></span></td> </tr> <tr> <td><code>x</code></td> <td><code>double</code></td> <td><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La cantidad de inclinación a lo largo del eje X.</span></span></td> </tr> <tr> <td><code>y</code></td> <td><code>double</code></td> <td><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La cantidad de inclinación a lo largo del eje Y.</span></span></td> </tr> <tr> <td><code>z</code></td> <td><code>double</code></td> <td><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El importe de la inclinación a lo largo del eje Z.</span></span></td> </tr> </tbody>
+</table>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los valores de <code>x</code> , <code>y</code> y <code>z</code> pueden variar desde -1 a 1, donde 0 significa que el dispositivo está en equilibrio sobre ese eje.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La función de controlador o manejador de eventos puede ser algo así:</span></span></p>
+<pre class="brush: js">function handleOrientation(orientData) {
+  var x = orientData.x;
+  var y = orientData.y;
+  var z = orientData.z;
+
+  // Haz cosas con los datos de orientación nuevos
+}
+</pre>
+<h3 id="Los_valores_del_acelerómetro_explicados"><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los valores del acelerómetro explicados</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El valor indicado para cada acceso indica la cantidad de la aceleración a lo largo de ese eje que está teniendo lugar actualmente.</span></span></p>
+<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><strong>Nota:</strong> en esta sección se describe cómo estos valores funcionan en la actualidad, sin embargo, esto está sujeto a cambios en un futuro.</span></span></div>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El eje X representa la cantidad de inclinación de derecha a izquierda.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este valor es 0 si el dispositivo está a nivel del eje X, y se aproxima a 1 si el dispositivo se inclina hacia la izquierda, y -1 si el dispositivo se inclina hacia la derecha.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El eje Y representa la cantidad de inclinación de adelante hacia atrás.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El valor es 0 si el dispositivo está a nivel del eje Y, y se aproxima a 1 a medida que inclinas el dispositivo hacia atrás (lejos de ti) y -1 si inclinas el dispositivo hacia el frente (hacia ti).</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El eje Z representa la aceleración vertical.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El valor es 1 cuando el dispositivo está pasando por la gravedad terrestre estándar (9.8m/sec <sup>2),</sup> pero no en movimiento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al mover el dispositivo hacia arriba hace que el valor descienda.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El valor es 0 si el dispositivo está en caída libre (ingrávido o precipitándose como consecuencia de una caída).</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En ingravidez, todos los valores será igual a cero cuando el dispositivo no se mueva, independientemente de su orientación, y sólo cambiará cuando se acelere.</span></span></p><h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Consulta también</span></span></h2>
+</a><ul><a> </a><li><a><code></code></a><code><a href="/en/DOM/MozOrientation" title="en/DOM/MozOrientation">MozOrientation</a></code></li> <li><a class=" external" href="http://hacks.mozilla.org/2009/06/media-queries/" title="http://hacks.mozilla.org/2009/06/media-queries/"><span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Una breve introducción a las consultas multimedia en Firefox 3.5</span></span></a></li>
+</ul>
+<p>{{ languages ( { "en": "en/Detecting_device_orientation" } ) }}</p>
diff --git a/files/es/orphaned/dhtml_demostraciones_del_uso_de_dom_style/index.html b/files/es/orphaned/dhtml_demostraciones_del_uso_de_dom_style/index.html
new file mode 100644
index 0000000000..dfa3acf438
--- /dev/null
+++ b/files/es/orphaned/dhtml_demostraciones_del_uso_de_dom_style/index.html
@@ -0,0 +1,50 @@
+---
+title: DHTML Demostraciones del uso de DOM/Style
+slug: orphaned/DHTML_Demostraciones_del_uso_de_DOM_Style
+tags:
+  - CSS
+  - DHTML
+  - DOM
+  - JavaScript
+  - Todas_las_Categorías
+original_slug: DHTML_Demostraciones_del_uso_de_DOM_Style
+---
+<p>
+</p><p><b>Proyecto de ejemplos DOM Mozilla</b>
+</p><p><a class="external" href="http://cgi.din.or.jp/%7Ehagi3/JavaScript/Mozilla/SampleList.cgi?fmt=html">Esta página</a> contiene una lista de ejemplos DOM basados en sus diversas características. La lista incluye demostraciones para eventos DOM, DOM Core, DOM HTML y mucho más.
+</p><p><b> Animación y manipulación de elementos de texto </b>
+</p>
+<ul><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/colorfades.html">Atenuación de colores</a>
+</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/textinterlace.html">Text Interlace Effect</a>
+</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/fadespacing.html">Atenuación y espaciado</a>
+</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/bouncingsmile.html">Texto animado 1</a> - <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/geckowave.html">y 2</a>
+</li><li> <a class="external" href="http://www.mozilla.org/docs/dom/samples/dom-css-fonts/credits.html">Demo de títulos de crédito</a> (requiere Netscape 7.x/Mozilla)
+</li></ul>
+<p><b> Animación 3D en tiempo real </b>
+</p><p><a class="external" href="http://www.world-direct.com/mozilla/dhtml/funo/3dcube/index.htm">Esta demostración</a> muestra cómo usar JavaScript y DOM para animar un conjunto de imágenes para crear un efecto de animación 3D.
+</p>
+<h3 id="Demostraciones_DOM_.28Requiere_navegador_que_interprete_DOM_1_y_2.29"> Demostraciones DOM (Requiere navegador que interprete DOM 1 y 2) </h3>
+<p><b> Estilo DOM: Recortar y posicionar elementos con la interfaz JavaScript DOM </b>
+</p><p><a class="external" href="http://www.mozilla.org/docs/dom/samples/can/index.html">Esta demostración</a> está optimizada para funcionar con Mozilla porque usa imágenes PNG con canal alpha. Demuestra el uso de interfaces DOM para establecer el valor de las propiedades de posición y recorte de los elementos DIV.
+</p><p><b> Eventos DOM 1 y DOM 2: Arrastrar y redimensionar un elemento usando DOM </b>
+</p><p><a class="external" href="http://www.mozilla.org/docs/dom/samples/resize/index.html">Esta muestra</a> requiere un navegador compatible con eventos DOM 1 y DOM 2. Ha sido probado con Netscape 7.x/Mozilla.
+</p><p><b> DOM 1 y DOM 2: Manipulando dinámicamente una tabla de elementos </b>
+</p><p><a class="external" href="http://www.mozilla.org/docs/dom/samples/dynatable-light/index.html">Esta demo</a> requiere un navegador que soporte la especificación DOM 1 y DOM 2, como Netscape 7.x o Mozilla. Usa los eventos DOM 2 del ratón para proporcionar un interfaz que puede manipular dinámicamente los elementos de la tabla.
+</p>
+<h3 id="Controles_multiplataforma"> Controles multiplataforma </h3>
+<p><b>Windowing API: La ventana DHTML de BrainJar </b>
+</p><p><a class="external" href="http://www.brainjar.com/dhtml/windows/demo.html">BrainJar's DHTML Windows</a> es un control (<i>widget</i>) que muestra cómo añadir ventanas DHTML dinámicas en una aplicación DHTML.
+</p><p><b> Stock Ticker </b>
+</p><p><a class="external" href="http://developer.mozilla.org/en/docs/DHTML_Demonstrations_Using_DOM/Style:Stock_Ticker">Stock Ticker</a> proporciona un objeto reutilizable que puede adaptarse para monitorizar (mediante una línea en movimiento) valores financieros en cualquier navegador que soporte el estándar DOM.
+<br>
+</p>
+<h3 id="Recursos_adicionales_para_aprender_DOM"> Recursos adicionales para aprender DOM </h3>
+<p><b> Cruzando una tabla HTML con JavaScript e Interfaces DOM </b>
+</p><p><a class="external" href="http://www.mozilla.org/docs/dom/technote/tn-dom-table/">Una visión</a> general sobre los métodos DOM de nivel 1 y de cómo usarlos mediante JavaScript. Estas notas técnicas cubren los métodos del núcleo, que son los que permiten la creación y manipulación dinámica de los elementos de marcado mediante JavaScript.
+</p><p><b> DOM Central </b>
+</p><p>Aprenda más acerca de <a href="es/DOM">W3C DOM</a>.
+</p><p><b> Visita GetElementById.com </b>
+</p><p><a class="external" href="http://getelementbyid.com/">GetElementById.com</a> contiene scripts DHTML y tutoriales que emplean W3C DOM. Descubre la <a class="external" href="http://getelementbyid.com/scripts/index.aspx?CodeID=28">demo Zoom Intro</a> y otras magníficas demostraciones y scripts DOM.
+</p><p><b> La categoría W3C DOM en DMOZ.ORG </b>
+</p><p><a class="external" href="http://dmoz.org/Computers/Programming/Languages/JavaScript/W3C_DOM/">Esta categoría</a> contiene notas técnicas, tutoriales y otros muchos recursos relacionados con JavaScript y W3C DOM.
+</p>{{ languages( { "en": "en/DHTML", "fr": "fr/DHTML", "ja": "ja/DHTML", "ko": "ko/DHTML", "pl": "pl/DHTML", "pt": "pt/DHTML" } ) }}
diff --git a/files/es/orphaned/dibujando_gráficos_con_canvas/index.html b/files/es/orphaned/dibujando_gráficos_con_canvas/index.html
new file mode 100644
index 0000000000..4d21cc8162
--- /dev/null
+++ b/files/es/orphaned/dibujando_gráficos_con_canvas/index.html
@@ -0,0 +1,6 @@
+---
+title: Dibujando Gráficos con Canvas
+slug: orphaned/Dibujando_Gráficos_con_Canvas
+original_slug: Dibujando_Gráficos_con_Canvas
+---
+<p>v</p>
diff --git a/files/es/orphaned/estructura_de_directorios_de_código_fuente_de_mozilla/index.html b/files/es/orphaned/estructura_de_directorios_de_código_fuente_de_mozilla/index.html
new file mode 100644
index 0000000000..9c1572605e
--- /dev/null
+++ b/files/es/orphaned/estructura_de_directorios_de_código_fuente_de_mozilla/index.html
@@ -0,0 +1,699 @@
+---
+title: Estructura de directorios de código fuente de Mozilla
+slug: orphaned/Estructura_de_directorios_de_código_fuente_de_Mozilla
+original_slug: Estructura_de_directorios_de_código_fuente_de_Mozilla
+---
+<p>El código para todos los proyectos de la familia Mozilla (como <span style="color: #0000cd;">Firefox</span>, <span style="color: #0000cd;">Thunderbird</span>, <span style="color: #0000cd;">etc.</span>) se combina en un único árbol-fuente. El árbol contiene el código fuente, así como el código necesario para generar cada proyecto en las plataformas compatibles (Linux, Windows, Mac OS, etc).</p>
+<p>Si simplemente quieres echar un vistazo al código fuente de Mozilla, no es necesario que lo descargues. Puedes mirar el codigo fuente directamente con tu navegador web usando MXR (la raiz del codigo fuente completo de Mozilla comienza en <a class="external" href="http://mxr.mozilla.org/mozilla-central/source/" rel="external" title="http://mxr.mozilla.org/mozilla-central/source/">http://mxr.mozilla.org/mozilla-central/source/</a>).</p>
+<p>Para modificar el código fuente, tienes que adquirirlo, ya sea descargando una<span style="color: #0000cd;"> instantánea </span>de las fuentes o <span style="color: #0000cd;">revisando las fuentes actuales de Mercurial</span>.</p>
+<p>Este documento describe la estructura de directorios que puede ser generada por client.mk -- es decir, los directorios que se utilizan por lo menos en algún producto del proyecto Mozilla. Hay otros directorios en el repositorio CVS de Mozilla, como los de las herramientas Web y los del código base clásico.</p>
+<p>Esto no está del todo actualizado. Mira la <span style="color: #0000cd;">descripción general de los directorios del código fuente</span> para una versión algo diferente (antigua) de la misma información. También mira la <span style="color: #0000cd;">descripción más detallada de las partes de Gecko</span>.</p>
+<h2 id="accessible">accessible</h2>
+<p>Archivos para la accesibilidad (por ejemplo, los archivos de soporte MSAA (Microsoft Active Accessibility) y ATK (Accessibility Toolkit, usado por GTK+ 2)). Ver <span style="color: #0000cd;">Accesibilidad de Mozilla</span>  <span style="color: #0000cd;">Accesibilidad</span>.</p>
+<h2 id="browser">browser</h2>
+<p>Contiene el código de la parte del usuario para el navegador Firefox (en XUL, JavaScript, XBL, y C++). Muchos de estos archivos comenzaron como una copia de los archivos de <span style="color: #0000cd;">xpfe</span>/.</p>
+<div id="section_3">
+  <h2 id="build">build</h2>
+  <p>Archivos varios, utilizados en el proceso de compilación. Véase también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#config" title="Mozilla_Source_Code_Directory_Structure#config">config</a>/.</p>
+</div>
+
+<div id="section_4">
+  <h2 id="calendar">calendar</h2>
+  <p>Implementación de <span style="color: #0000cd;">Calendar</span>, creado originalmente por OEone. Véase también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#extensions.2Flightning" title="Mozilla_Source_Code_Directory_Structure#extensions.2Flightning">extensions/lightning</a>/.</p>
+  <h2 id="caps">caps</h2>
+  <p>Gestión de la seguridad de la página web basada en capabilities.</p>
+  <p>Caps contiene las interfaces de C++ y el código para determinar las capabilities del contenido basado en la configuración de seguridad o certificados (por ejemplo VeriSign). Ver <span style="color: #0000cd;">seguridad de componentes</span>.</p>
+  <div id="section_6">
+    <h2 id="chrome">chrome</h2>
+    <p>Registro chrome utilizado con <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#toolkit" title="Mozilla_Source_Code_Directory_Structure#toolkit">toolkit</a>/. Estos archivos fueron originalmente copias de los archivos de <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#rdf" title="Mozilla_Source_Code_Directory_Structure#rdf">rdf</a>/chrome/.</p>
+  </div>
+  <div id="section_7">
+    <h2 id="composer">composer</h2>
+    <p>El código (XUL y JavaScript) de la parte del usuario (front-end) para la aplicación standalone <a href="http://www-archive.mozilla.org/editor/" title="http://www-archive.mozilla.org/editor/">Composer</a>.</p>
+  </div>
+  <div id="section_8">
+    <h2 id="config">config</h2>
+    <p>Más archivos utilizados por el proceso de compilación, incluidos normalmente para los makefiles, etc. Véase también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#build" title="Mozilla_Source_Code_Directory_Structure#build">build</a>/.</p>
+    <h2 id="content">content</h2>
+    <p>Las estructuras de datos que representan la estructura de las páginas Web (HTML, SVG, documentos XML, elementos, nodos de texto, etc.). Estos objetos contienen la implementación de varias interfaces DOM y también implementan algunos de los comportamientos asociados a esos objetos, como manejo de enlaces, control del comportamiento del formulario y envío del formulario.</p>
+    <p>Este directorio también contiene el código para <span style="color: #0000cd;">XUL</span>, <span style="color: #0000cd;">XBL</span>, <span style="color: #0000cd;">XTF</span>, <span style="color: #0000cd;">&lt;canvas&gt;</span>, así como el código de la implementación XSLT y manejo de eventos.</p>
+    <h2 id="db">db</h2>
+    <p>Contenedor para los módulos de acceso a las bases de datos. Actualmente contiene mork y sqlite.</p>
+    <h2 id="dbmdb_dbmork_and_dbmorkreader">db/mdb, db/mork, and db/morkreader</h2>
+    Implementación de <a href="/en-US/docs/Mork" title="Mork">Mork</a>, un formato de texto para bases de datos. Este se utiliza por ejemplo para almacenar la historia global.<br>
+    <p><code>morkreader</code> es un analizador simple para mork usado para migrar los datos antiguos a las nuevas bases de datos basadas en sqlite.</p>
+    <div id="section_12">
+      <h2 id="dbsqlite3">db/sqlite3</h2>
+      <p>La base de datos SQLite, usada por <a href="/en-US/docs/Storage" title="Storage">storage</a>. Reemplaza a mork en <a href="/en-US/docs/Firefox_3_for_developers" title="Firefox_3_for_developers">Firefox 3</a>.</p>
+    </div>
+    <div id="section_13">
+      <h2 id="dbm">dbm</h2>
+      <p>Código fuente de la librería Berkeley de base de datos, hackeado desde la versión 4.4BSD. Utilizado principalmente por el código NSS como almacén de certificados.</p>
+    </div>
+    <div id="section_14">
+      <h2 id="directory"><span>directory</span></h2>
+      <p>Soporte LDAP para Mozilla. Utilizado en las noticias por correo.</p>
+    </div>
+    <div id="section_15">
+      <h2 id="docshell"><span>docshell</span></h2>
+      <p>Implementación del docshell, el objeto principal para el manejo de lo relacionado con la ventana de un documento. Cada cuadro tiene su propio docshell. Contiene métodos para la carga de URIs, gestión de los oyentes del contenido de los URIs, etc. Es la capa más externa de la API embebida usada para incrustar un navegador Gecko en una aplicación. Ver también <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#webshell">webshell</a>/.</p>
+    </div>
+    <div id="section_16">
+      <h2 id="dom">dom</h2>
+      <p>Contiene:</p>
+      <ul>
+        <li><a href="/en-US/docs/XPIDL" title="XPIDL">Definiciones IDL</a> de las interfaces definidas por las especificaciones DOM y las extensiones de Mozilla a estas interfaces (las implementaciones de estas interfaces están principalmente, aunque no completamente, en <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#content">content</a>/).</li>
+        <li>Las partes de la conexión entre JavaScript y las implementaciones de objetos DOM que son específicos para JavaScript y el DOM. (Las partes que no son específicas del DOM, es decir, la unión genérica entre XPCOM y JavaScript, se encuentran en <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#js/src/xpconnect" rel="custom">js/src/xpconnect</a>/.)</li>
+        <li>Las implementaciones de algunos de los principales objetos "DOM nivel 0", tales como window, window.navigator, window.location, etc.</li>
+      </ul>
+    </div>
+    <div id="section_17">
+      <h2 id="editor"><span>editor</span></h2>
+      <p>The editor directory contains C++ interfaces, C++ code, and XUL/JavaScript for the embeddable editor component, which is used for the HTML Editor("Composer"), for plain and HTML mail composition, and for text fields and text areas throughout the product. The editor is designed like a "browser window with editing features": it adds some special classes for editing text and managing transaction undo/redo, but reuses browser code for nearly everything else.</p>
+      <p>Contains:</p>
+      <ul>
+        <li>The backend for HTML and text editing. This is not only used for the mail composer and the page editor composer, but also for <a class="external" href="http://www.mozilla.org/editor/midas-spec.html" rel="external" title="http://www.mozilla.org/editor/midas-spec.html">rich text editing inside webpages</a>. Textarea and input fields are using such an editor as well (in the plaintext variant). See <a class="external" href="http://www.mozilla.org/editor/" rel="external" title="http://www.mozilla.org/editor/">Mozilla Editor</a>.</li>
+        <li>The frontend for the HTML editor that is part of SeaMonkey.</li>
+      </ul>
+    </div>
+    <div id="section_18">
+      <h2 id="embedding"><span>embedding</span></h2>
+      <p>XXX this needs a description. See <a class="external" href="http://www.mozilla.org/projects/embedding/" rel="external" title="http://www.mozilla.org/projects/embedding/">Embedding</a>.</p>
+    </div>
+    <div id="section_19">
+      <h2 id="extensions"><span>extensions</span></h2>
+      Contains several extensions to mozilla, which can be enabled at compile-time using the <code>--enable-extensions</code> configure argument.<br>
+      <p>Note that some of these are now built specially and not using the <code>--enable-extensions</code> option. For example, disabling xmlextras is done using <code>--disable-xmlextras</code>.</p>
+      <div id="section_20">
+        <h3 id="extensionsauth"><span>extensions/auth</span></h3>
+        <p>Implementation of the negotiate auth method for HTTP and other protocols. Has code for SSPI, GSSAPI, etc. See <a class="external" href="http://www.mozilla.org/projects/netlib/integrated-auth.html" rel="external" title="http://www.mozilla.org/projects/netlib/integrated-auth.html">Integrated Authentication</a>.</p>
+      </div>
+      <div id="section_21">
+        <h3 id="extensionscontent-packs"><span>extensions/content-packs</span></h3>
+        <p>Content- and locale-pack switching user interface.</p>
+      </div>
+      <div id="section_22">
+        <h3 id="extensionscookie"><span>extensions/cookie</span></h3>
+        <p>Permissions backend for cookies, images etc, as well as the user interface to these permissions and other cookie features.</p>
+      </div>
+      <div id="section_23">
+        <h3 id="extensionscview"><span>extensions/cview</span></h3>
+        <p>Component viewer, which allows to view the currently registered components and interfaces.</p>
+      </div>
+      <div id="section_24">
+        <h3 id="extensionsdatetime"><span>extensions/datetime</span></h3>
+        <p>Support for the datetime protocol.</p>
+      </div>
+      <div id="section_25">
+        <h3 id="extensionsfinger"><span>extensions/finger</span></h3>
+        <p>Support for the finger protocol.</p>
+      </div>
+      <div id="section_26">
+        <h3 id="extensionsgnomevfs"><span>extensions/gnomevfs</span></h3>
+        <p>Interface to gnome-vfs to allow using all protocols supported by gnome-vfs inside of mozilla.</p>
+      </div>
+      <div id="section_27">
+        <h3 id="extensionshelp"><span>extensions/help</span></h3>
+        <p>Help viewer and help content. See <a class="external" href="http://www.mozilla.org/projects/help-viewer/" rel="external" title="http://www.mozilla.org/projects/help-viewer/">Mozilla Help Viewer Project</a>.</p>
+      </div>
+      <div id="section_28">
+        <h3 id="extensionsirc"><span>extensions/irc</span></h3>
+        <div class="editIcon">
+          <h3 id="sect1"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=28"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>This is ChatZilla, the IRC (Internet Relay Chat) component. See <a class="external" href="http://www.mozilla.org/projects/rt-messaging/chatzilla/" rel="external" title="http://www.mozilla.org/projects/rt-messaging/chatzilla/">ChatZilla</a>.</p>
+      </div>
+      <div id="section_29">
+        <h3 id="extensionsjava"><span>extensions/java</span></h3>
+        <div class="editIcon">
+          <h3 id="sect2"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=29"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>XPCOM&lt;-&gt;Java bridge ("<a href="/en-US/docs/JavaXPCOM" title="JavaXPCOM">JavaXPCOM</a>", formerly known as Javaconnect). Unrelated to the code in <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#java">java</a>/.</p>
+      </div>
+      <div id="section_30">
+        <h3 id="extensionslayout-debug"><span>extensions/layout-debug</span></h3>
+        <div class="editIcon">
+          <h3 id="sect3"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=30"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Layout debugger. Intended as replacement for "viewer". Can be used to run layout regression tests and has support for other layout debugging features.</p>
+      </div>
+      <div id="section_31">
+        <h3 id="extensionslightning"><span>extensions/lightning</span></h3>
+        <div class="editIcon">
+          <h3 id="sect4"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=31"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>The Lightning project, "an extension to tightly integrate calendar functionality (scheduling, tasks, etc.) into Thunderbird." See <a class="external" href="http://wiki.mozilla.org/Calendar:Lightning" rel="external" title="http://wiki.mozilla.org/Calendar:Lightning">Lightning</a>.</p>
+      </div>
+      <div id="section_32">
+        <h3 id="extensionsmono"><span>extensions/mono</span></h3>
+        <div class="editIcon">
+          <h3 id="sect5"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=32"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>A two-way bridge between the CLR/.NET/Mono/C#/etc. world and XPCOM.</p>
+      </div>
+      <div id="section_33">
+        <h3 id="extensionsp3p"><span>extensions/p3p</span></h3>
+        <div class="editIcon">
+          <h3 id="sect6"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=33"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Implementation of W3C's Platform for Privacy Preferences standard. See <a class="external" href="http://www.mozilla.org/projects/p3p/" rel="external" title="http://www.mozilla.org/projects/p3p/">Platform for Privacy Preferences (P3P)</a>.</p>
+      </div>
+      <div id="section_34">
+        <h3 id="extensionspref"><span>extensions/pref</span></h3>
+        <div class="editIcon">
+          <h3 id="sect7"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=34"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Preference-related extensions:</p>
+      </div>
+      <div id="section_35">
+        <h3 id="extensionspython"><span>extensions/python</span></h3>
+        <div class="editIcon">
+          <h3 id="sect8"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=35"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Support for implementing XPCOM components in python. See <a href="/en-US/docs/PyXPCOM" title="PyXPCOM">PyXPCOM</a>.</p>
+      </div>
+      <div id="section_36">
+        <h3 id="extensionsreporter"><span>extensions/reporter</span></h3>
+        <div class="editIcon">
+          <h3 id="sect9"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=36"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>An extension to report problems with web pages. Client-side part. See <a class="external" href="http://reporter.mozilla.org/" rel="external" title="http://reporter.mozilla.org/">Mozilla Reporter</a>.</p>
+      </div>
+      <div id="section_37">
+        <h3 id="extensionschema-validation"><span>extension/schema-validation</span></h3>
+        <div class="editIcon">
+          <h3 id="sect10"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=37"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Allows to validate XML trees according to specified XML Schemas.</p>
+      </div>
+      <div id="section_38">
+        <h3 id="extensionspatialnavigation"><span>extension/spatialnavigation</span></h3>
+        <div class="editIcon">
+          <h3 id="sect11"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=38"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Spatial navigation, navigating between links of a document according to their on-screen position. See <a class="external" href="http://www.mozilla.org/access/keyboard/snav/" rel="external" title="http://www.mozilla.org/access/keyboard/snav/">Spatial Navigation</a>.</p>
+      </div>
+      <div id="section_39">
+        <h3 id="extensionsspellcheck"><span>extensions/spellcheck</span></h3>
+        <div class="editIcon">
+          <h3 id="sect12"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=39"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Spellchecker for mailnews and composer.</p>
+      </div>
+      <div id="section_40">
+        <h3 id="extensionssql"><span>extensions/sql</span></h3>
+        <div class="editIcon">
+          <h3 id="sect13"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=40"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Support for accessing SQL databases from XUL applications. See <a class="external" href="http://www.mozilla.org/projects/sql/" rel="external" title="http://www.mozilla.org/projects/sql/">SQL Support in Mozilla</a>.</p>
+      </div>
+      <div id="section_41">
+        <h3 id="extensionssroaming"><span>extensions/sroaming</span></h3>
+        <div class="editIcon">
+          <h3 id="sect14"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=41"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Session roaming, i.e. support for storing a profile on a remote server.</p>
+      </div>
+      <div id="section_42">
+        <h3 id="extensionstransformiix"><span>extensions/transformiix</span></h3>
+        <div class="editIcon">
+          <h3 id="sect15"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=42"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>XSLT support. XSL Transformations is a language used to transform XML documents into other XML documents. See <a class="external" href="http://www.mozilla.org/projects/xslt/" rel="external" title="http://www.mozilla.org/projects/xslt/">XSL Transformations</a>.</p>
+      </div>
+      <div id="section_43">
+        <h3 id="extensionstridentprofile"><span>extensions/tridentprofile</span></h3>
+        <div class="editIcon">
+          <h3 id="sect16"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=43"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Support for importing profiles from MSIE.</p>
+      </div>
+      <div id="section_44">
+        <h3 id="extensionstypeaheadfind"><span>extensions/typeaheadfind</span></h3>
+        <div class="editIcon">
+          <h3 id="sect17"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=44"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Find As You Type allows quick web page navigation when you type a succession of characters in the body of the displayed page. See <a class="external" href="http://www.mozilla.org/projects/ui/accessibility/typeaheadfind.html" rel="external" title="http://www.mozilla.org/projects/ui/accessibility/typeaheadfind.html">Find As You Type</a>.</p>
+      </div>
+      <div id="section_45">
+        <h3 id="extensionsuniversalchardet"><span>extensions/universalchardet</span></h3>
+        <div class="editIcon">
+          <h3 id="sect18"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=45"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Universal character set detector.</p>
+      </div>
+      <div id="section_46">
+        <h3 id="extensionsvenkman"><span>extensions/venkman</span></h3>
+        <div class="editIcon">
+          <h3 id="sect19"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=46"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>The <a href="/en-US/docs/Venkman" title="Venkman">JavaScript Debugger</a>.</p>
+      </div>
+      <div id="section_47">
+        <h3 id="extensionswallet"><span>extensions/wallet</span></h3>
+        <div class="editIcon">
+          <h3 id="sect20"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=47"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Password and Form Manager.</p>
+      </div>
+      <div id="section_48">
+        <h3 id="extensionswebdav"><span>extensions/webdav</span></h3>
+        <div class="editIcon">
+          <h3 id="sect21"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=48"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>WebDAV code; exposes special APIs for accessing WebDAV servers. Used by the Calendar project.</p>
+      </div>
+      <div id="section_49">
+        <h3 id="extensionswebservices"><span>extensions/webservices</span></h3>
+        <div class="editIcon">
+          <h3 id="sect22"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=49"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Support for Webservices. See <a class="external" href="http://www.mozilla.org/projects/webservices/" rel="external" title="http://www.mozilla.org/projects/webservices/">Web Services</a>.</p>
+      </div>
+      <div id="section_50">
+        <h3 id="extensionsxforms"><span>extensions/xforms</span></h3>
+        <div class="editIcon">
+          <h3 id="sect23"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=50"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Code for the XForms extension. See <a class="external" href="http://www.mozilla.org/projects/xforms/" rel="external" title="http://www.mozilla.org/projects/xforms/">XForms</a>.</p>
+      </div>
+      <div id="section_51">
+        <h3 id="extensionsxmlextras"><span>extensions/xmlextras</span></h3>
+        <div class="editIcon">
+          <h3 id="sect24"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=51"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Several XML-related extensions. See <a href="/en-US/docs/XML_Extras" title="XML_Extras">XML Extras</a>.</p>
+      </div>
+      <div id="section_52">
+        <h3 id="extensionsxml-rpc"><span>extensions/xml-rpc</span></h3>
+        <div class="editIcon">
+          <h3 id="sect25"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=52"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>XML Remote Procedure Calls. Unowned these days. See <a class="external" href="http://www.mozilla.org/projects/xmlrpc/" rel="external" title="http://www.mozilla.org/projects/xmlrpc/">XML-RPC in Mozilla</a>.</p>
+      </div>
+      <div id="section_53">
+        <h3 id="extensionsxmlterm"><span>extensions/xmlterm</span></h3>
+        <div class="editIcon">
+          <h3 id="sect26"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=53"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>XMLTerm, a terminal implemented using mozilla technology. Only available on GTK builds.</p>
+      </div>
+    </div>
+    <div id="section_54">
+      <h2 id="gc"><span>gc</span></h2>
+      <div class="editIcon">
+        <h2 id="sect27"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=54"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Container for garbage collection libraries, currently only boehm GC.</p>
+    </div>
+    <div id="section_55">
+      <h2 id="gfx"><span>gfx</span></h2>
+      <div class="editIcon">
+        <h2 id="sect28"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=55"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Contains interfaces that abstract the capabilities of platform specific graphics toolkits, along with implementations on various platforms. These interfaces provide methods for things like drawing images, text, and basic shapes. It also contains basic data structures such as points and rectangles used here and in other parts of Mozilla.</p>
+      <p>It is also the home of the new graphics architecture based on cairo (via a C++ wrapper called thebes). See <a class="external" href="http://wiki.mozilla.org/Mozilla2:NewGFXAPIs" rel="external" title="http://wiki.mozilla.org/Mozilla2:NewGFXAPIs">NewGFXAPIs</a> and <a class="external" href="http://wiki.mozilla.org/Mozilla2:GFXEvolution" rel="external" title="http://wiki.mozilla.org/Mozilla2:GFXEvolution">GFXEvolution</a>.</p>
+    </div>
+    <div id="section_56">
+      <h2 id="image"><span>image</span></h2>
+      <div class="editIcon">
+        <h2 id="sect29"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=56"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Image rendering library. Contains decoders for the image formats mozilla supports.</p>
+    </div>
+    <div id="section_57">
+      <h2 id="intl"><span>intl</span></h2>
+      <div class="editIcon">
+        <h2 id="sect30"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=57"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Internationalization and localization support. See <a class="external" href="http://www.mozilla.org/projects/intl/index.html" rel="external" title="http://www.mozilla.org/projects/intl/index.html">Internationalisation Projects</a>.</p>
+      <dl>
+        <dt>
+          bidi</dt>
+        <dd>
+          Obsolete.</dd>
+        <dt>
+          chardet</dt>
+        <dd>
+          Code for "sniffing" the character encoding of Web pages.</dd>
+        <dt>
+          ctl</dt>
+        <dd>
+          Code for dealing with Complex Text Layout, related to shaping of south Asian languages (not built by default, needs <code>--enable-ctl</code>).</dd>
+        <dt>
+          locale</dt>
+        <dd>
+          Code related to determination of locale information from the operating environment.</dd>
+        <dt>
+          lwbrk</dt>
+        <dd>
+          Code related to line breaking and word breaking.</dd>
+        <dt>
+          strres</dt>
+        <dd>
+          Code related to string resources used for localization.</dd>
+        <dt>
+          uconv</dt>
+        <dd>
+          Code that converts (both ways: encoders and decoders) between UTF-16 and many other character encodings.</dd>
+        <dt>
+          unicharutil</dt>
+        <dd>
+          Code related to implementation of various algorithms for Unicode text, such as case conversion.</dd>
+      </dl>
+    </div>
+    <div id="section_58">
+      <h2 id="ipc"><span>ipc</span></h2>
+      <div class="editIcon">
+        <h2 id="sect31"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=58"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Container for implementations of IPC (Inter-Process Communication) mechanisms.</p>
+    </div>
+    <div id="section_59">
+      <h2 id="ipcipcd"><span>ipc/ipcd</span></h2>
+      <div class="editIcon">
+        <h2 id="sect32"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=59"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>The IPC daemon that is used for communication between several mozilla processes to support profile sharing. (Note that at the time of this writing (Dec 2005), profile sharing is not supported by mozilla).</p>
+    </div>
+    <div id="section_60">
+      <h2 id="jpeg"><span>jpeg</span></h2>
+      <div class="editIcon">
+        <h2 id="sect33"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=60"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Source code of libjpeg, used by the mozilla image library.</p>
+    </div>
+    <div id="section_61">
+      <h2 id="jssrc"><span>js/src</span></h2>
+      <div class="editIcon">
+        <h2 id="sect34"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=61"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>The JavaScript engine, also known as <a class="link-https" href="https://wiki.mozilla.org/JavaScript" rel="external" title="https://wiki.mozilla.org/JavaScript">SpiderMonkey</a>. See also <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>.</p>
+    </div>
+    <div id="section_62">
+      <h2 id="jsjsd"><span>js/jsd</span></h2>
+      <div class="editIcon">
+        <h2 id="sect35"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=62"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>JavaScript debugging library. See <a class="external" href="http://www.mozilla.org/js/jsd/" rel="external" title="http://www.mozilla.org/js/jsd/">JavaScript Debugging</a>.</p>
+    </div>
+    <div id="section_63">
+      <h2 id="jssrcxpconnect"><span>js/src/xpconnect</span></h2>
+      <div class="editIcon">
+        <h2 id="sect36"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=63"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Support code for calling JavaScript code from C++ code and C++ code from JavaScript code, using XPCOM interfaces. See <a href="/en-US/docs/XPConnect" title="XPConnect">XPConnect</a>].</p>
+    </div>
+    <div id="section_64">
+      <h2 id="jssrcliveconnect"><span>js/src/liveconnect</span></h2>
+      <div class="editIcon">
+        <h2 id="sect37"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=64"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Liveconnect, the bridge between JavaScript and Java. See <a href="/en-US/docs/JavaScript/Guide/LiveConnect_Overview" title="JavaScript/Guide/LiveConnect_Overview">LiveConnect Overview</a>.</p>
+    </div>
+    <div id="section_65">
+      <h2 id="l10n"><span>l10n</span></h2>
+      <div class="editIcon">
+        <h2 id="sect38"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=65"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Basically empty and not used by the mozilla build.</p>
+    </div>
+    <div id="section_66">
+      <h2 id="layout"><span>layout</span></h2>
+      <div class="editIcon">
+        <h2 id="sect39"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=66"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Code that implements a tree of rendering objects that describe the types and locations of the objects that are displayed on the screen (such as CSS boxes, tables, form controls, XUL boxes, etc.), and code that manages operations over that rendering tree (such as creating and destroying it, doing layout, painting, and event handling). See <a class="external" href="http://www.mozilla.org/newlayout/doc/" rel="external" title="http://www.mozilla.org/newlayout/doc/">documentation</a> and <a class="external" href="http://www.mozilla.org/newlayout/" rel="external" title="http://www.mozilla.org/newlayout/">other information</a>.</p>
+      <dl>
+        <dt>
+          base</dt>
+        <dd>
+          Code that deals with the rendering tree.</dd>
+        <dt>
+          generic</dt>
+        <dd>
+          The basic rendering object interface and the rendering tree objects for basic CSS boxes.</dd>
+        <dt>
+          forms</dt>
+        <dd>
+          Rendering tree objects for HTML form controls.</dd>
+        <dt>
+          tables</dt>
+        <dd>
+          Rendering tree objects for CSS/HTML tables</dd>
+        <dt>
+          mathml</dt>
+        <dd>
+          Rendering tree objects for <a href="/en-US/docs/MathML" title="MathML">MathML</a>.</dd>
+        <dt>
+          svg</dt>
+        <dd>
+          Rendering tree objects for <a href="/en-US/docs/SVG" title="SVG">SVG</a>.</dd>
+        <dt>
+          xul</dt>
+        <dd>
+          Additional rendering object interfaces for <a href="/en-US/docs/XUL" title="XUL">XUL</a> and the rendering tree objects for XUL boxes.</dd>
+      </dl>
+    </div>
+    <div id="section_67">
+      <h2 id="lib"><span>lib</span></h2>
+      <div class="editIcon">
+        <h2 id="sect40"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=67"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Mostly unused; might be used on mac?</p>
+    </div>
+    <div id="section_68">
+      <h2 id="mail"><span>mail</span></h2>
+      <div class="editIcon">
+        <h2 id="sect41"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=68"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Thunderbird frontend files. Note that many thunderbird files are shared with Mozilla Mailnews and can be found under <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#mailnews">mailnews</a>/.</p>
+    </div>
+    <div id="section_69">
+      <h2 id="mailnews"><span>mailnews</span></h2>
+      <div class="editIcon">
+        <h2 id="sect42"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=69"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>The mail and news backend code (e.g. code that manages folders, manages databases, or interacts with mail servers) and the frontend code for the SeaMonkey mail client, some of which is shared by Thunderbird.</p>
+    </div>
+    <div id="section_70">
+      <h2 id="moduleslibimg"><span>modules/libimg</span></h2>
+      <div class="editIcon">
+        <h2 id="sect43"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=70"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Contains libpng, used by the image library for PNG Image decoding.</p>
+    </div>
+    <div id="section_71">
+      <h2 id="moduleslibjar"><span>modules/libjar</span></h2>
+      <div class="editIcon">
+        <h2 id="sect44"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=71"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Code to read zip files, used for reading the .jar files that contain the files for the mozilla frontend.</p>
+    </div>
+    <div id="section_72">
+      <h2 id="moduleslibpref"><span>modules/libpref</span></h2>
+      <div class="editIcon">
+        <h2 id="sect45"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=72"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Library for reading and writing preferences.</p>
+    </div>
+    <div id="section_73">
+      <h2 id="moduleslibreg"><span>modules/libreg</span></h2>
+      <div class="editIcon">
+        <h2 id="sect46"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=73"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Library for reading the netscape binary registry files, used for the <code>~/.mozilla/appreg</code> file (<code>registry.dat</code> on windows).</p>
+    </div>
+    <div id="section_74">
+      <h2 id="modulesoji"><span>modules/oji</span></h2>
+      <div class="editIcon">
+        <h2 id="sect47"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=74"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Support for the Java plugin (a bridge for plugging-in generic Java VMs). See <a class="external" href="http://www.mozilla.org/oji/" rel="external" title="http://www.mozilla.org/oji/">Open JVM Integration (OJI)</a>.</p>
+      <p><em>Note: OJI may be removed from Mozilla 2.0 according to <a class="external" href="http://boomswaggerboom.wordpress.com/2007/04/16/javaplugin-cleanup-for-mozilla-20/" rel="external" title="http://boomswaggerboom.wordpress.com/2007/04/16/javaplugin-cleanup-for-mozilla-20/">this post by Josh</a>.</em></p>
+    </div>
+    <div id="section_75">
+      <h2 id="modulesplugin"><span>modules/plugin</span></h2>
+      <div class="editIcon">
+        <h2 id="sect48"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=75"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Plugin support. Implements the Netscape Plugin API (NPAPI). See <a href="/en-US/docs/Plugins" title="Plugins">Plugins</a>.</p>
+    </div>
+    <div id="section_76">
+      <h2 id="modulesstaticmod"><span>modules/staticmod</span></h2>
+      <div class="editIcon">
+        <h2 id="sect49"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=76"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Helper files for static mozilla builds.</p>
+    </div>
+    <div id="section_77">
+      <h2 id="moduleszlib"><span>modules/zlib</span></h2>
+      <div class="editIcon">
+        <h2 id="sect50"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=77"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Source code of zlib, used at least in the networking library for compressed transfers.</p>
+    </div>
+    <div id="section_78">
+      <h2 id="netwerk"><span>netwerk</span></h2>
+      <div class="editIcon">
+        <h2 id="sect51"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=78"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p><a href="/en-US/docs/Necko" title="Necko">Networking library</a>, also known as Necko. Responsible for doing actual transfers from and to servers, as well as for URI handling and related stuff. See also <a class="external" href="http://www.mozilla.org/projects/netlib/" rel="external" title="http://www.mozilla.org/projects/netlib/">Network library documentation</a>.</p>
+    </div>
+    <div id="section_79">
+      <h2 id="nsprpub"><span>nsprpub</span></h2>
+      <div class="editIcon">
+        <h2 id="sect52"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=79"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Netscape Portable Runtime. Used as an abstraction layer to things like threads, file I/O and socket I/O. See <a class="external" href="http://www.mozilla.org/projects/nspr/" rel="external" title="http://www.mozilla.org/projects/nspr/">Netscape Portable Runtime</a>.</p>
+    </div>
+    <div id="section_80">
+      <h2 id="other-licenses"><span>other-licenses</span></h2>
+      <div class="editIcon">
+        <h2 id="sect53"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=80"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Contains libraries that are not covered by the MPL but used in some mozilla code.</p>
+    </div>
+    <div id="section_81">
+      <h2 id="parserexpat"><span>parser/expat</span></h2>
+      <div class="editIcon">
+        <h2 id="sect54"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=81"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Copy of the expat source code, which is the XML parser used by mozilla.</p>
+    </div>
+    <div id="section_82">
+      <h2 id="parserhtmlparser"><span>parser/htmlparser</span></h2>
+      <div class="editIcon">
+        <h2 id="sect55"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=82"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Contains the html parser used by Mozilla, which parses HTML source code and calls the appropriate methods on a content sink.</p>
+    </div>
+    <div id="section_83">
+      <h2 id="profile"><span>profile</span></h2>
+      <div class="editIcon">
+        <h2 id="sect56"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=83"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Code for profile handling, the profile manager backend and frontend.</p>
+    </div>
+    <div id="section_84">
+      <h2 id="rdf"><span>rdf</span></h2>
+      <div class="editIcon">
+        <h2 id="sect57"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=84"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>RDF handling APIs. See <a href="/en-US/docs/RDF" title="RDF">RDF</a> and <a class="external" href="http://www.mozilla.org/rdf/doc/" rel="external" title="http://www.mozilla.org/rdf/doc/">RDF</a>.</p>
+      <p>Also contains the chrome registry code used by SeaMonkey, although toolkit apps (such as Firefox and Thunderbird) use the copy forked into <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#chrome">chrome</a>.</p>
+    </div>
+    <div id="section_85">
+      <h2 id="security"><span>security</span></h2>
+      <div class="editIcon">
+        <h2 id="sect58"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=85"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Contains NSS and PSM, to support cryptographic functions in mozilla (like S/MIME, SSL, etc). See <a class="external" href="http://www.mozilla.org/projects/security/pki/nss/" rel="external" title="http://www.mozilla.org/projects/security/pki/nss/">Network Security Services (NSS)</a> and <a class="external" href="http://www.mozilla.org/projects/security/pki/psm/" rel="external" title="http://www.mozilla.org/projects/security/pki/psm/">Personal Security Manager (PSM)</a>.</p>
+    </div>
+    <div id="section_86">
+      <h2 id="storage"><span>storage</span></h2>
+      <div class="editIcon">
+        <h2 id="sect59"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=86"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p><a href="/en-US/docs/Storage" title="Storage">Storage</a>: XPCOM wrapper for sqlite. Wants to unify storage of all profile-related data. Supersedes mork. See also <a class="external" href="http://wiki.mozilla.org/Mozilla2:Unified_Storage" rel="external" title="http://wiki.mozilla.org/Mozilla2:Unified_Storage">Unified Storage</a>.</p>
+    </div>
+    <div id="section_87">
+      <h2 id="suite"><span>suite</span></h2>
+      <div class="editIcon">
+        <h2 id="sect60"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=87"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Newer parts of SeaMonkey-specific code. Older parts live in <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#xpfe">xpfe</a>/.</p>
+    </div>
+    <div id="section_88">
+      <h2 id="themes"><span>themes</span></h2>
+      <div class="editIcon">
+        <h2 id="sect61"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=88"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Contains the themes shipped with SeaMonkey. Classic and Modern at the time of this writing.</p>
+    </div>
+    <div id="section_89">
+      <h2 id="toolkit"><span>toolkit</span></h2>
+      <div class="editIcon">
+        <h2 id="sect62"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=89"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>The "new toolkit" used by Thunderbird, Firefox, etc. This contains numerous front-end components shared between applications as well as most of the XBL-implemented parts of the XUL language (most of which was originally forked from versions in <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#xpfe">xpfe</a>/).</p>
+    </div>
+    <div id="section_90">
+      <h2 id="tools"><span>tools</span></h2>
+      <div class="editIcon">
+        <h2 id="sect63"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=90"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Some tools which are optionally built during the mozilla build process, mostly used for debugging.</p>
+    </div>
+    <div id="section_91">
+      <h2 id="uriloaderbase"><span>uriloader/base</span></h2>
+      <div class="editIcon">
+        <h2 id="sect64"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=91"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Content dispatch in Mozilla. Used to load uris and find an appropriate content listener for the data. Also manages web progress notifications. See <a class="external" href="http://www.mozilla.org/docs/docshell/uri-load-start.html" rel="external" title="http://www.mozilla.org/docs/docshell/uri-load-start.html">Document Loading: From Load Start to Finding a Handler</a> and <a class="external" href="http://www.mozilla.org/docs/url_load.html" rel="external" title="http://www.mozilla.org/docs/url_load.html">The Life Of An HTML HTTP Request</a>.</p>
+    </div>
+    <div id="section_92">
+      <h2 id="uriloaderexthandler"><span>uriloader/exthandler</span></h2>
+      <div class="editIcon">
+        <h2 id="sect65"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=92"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Used to handle content that Mozilla can't handle itself. Responsible for showing the helper app dialog, and generally for finding information about helper applications.</p>
+    </div>
+    <div id="section_93">
+      <h2 id="uriloaderprefetch"><span>uriloader/prefetch</span></h2>
+      <div class="editIcon">
+        <h2 id="sect66"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=93"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>Service to prefetch documents in order to have them cached for faster loading.</p>
+    </div>
+    <div id="section_94">
+      <h2 id="view"><span>view</span></h2>
+      <div class="editIcon">
+        <h2 id="sect67"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=94"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>View manager. Contains cross-platform code used for painting, scrolling, event handling, z-ordering, and opacity. Soon to become obsolete, gradually.</p>
+    </div>
+    <div id="section_95">
+      <h2 id="widget"><span>widget</span></h2>
+      <div class="editIcon">
+        <h2 id="sect68"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=95"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>A cross-platform API, with implementations on each platform, for dealing with operating system/environment widgets, i.e., code related to creation and handling of windows, popups, and other native widgets and to converting the system's messages related to painting and events into the messages used by other parts of Mozilla (e.g. <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#view">view</a>/ and <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#content">content</a>/, the latter of which converts many of the messages to yet another API, the DOM event API).</p>
+    </div>
+    <div id="section_96">
+      <h2 id="xpcom"><span>xpcom</span></h2>
+      <div class="editIcon">
+        <h2 id="sect69"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=96"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p><a href="/en-US/docs/XPCOM" title="XPCOM">Cross-Platform Component Object Model</a>. Also contains data structures used by the rest of the mozilla code. See also <a class="external" href="http://www.mozilla.org/projects/xpcom/" rel="external" title="http://www.mozilla.org/projects/xpcom/">XPCOM Project</a>.</p>
+    </div>
+    <div id="section_97">
+      <h2 id="xpfe"><span>xpfe</span></h2>
+      <div class="editIcon">
+        <h2 id="sect70"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=97"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>XPFE is the SeaMonkey frontend. It contains the XUL files for the browser interface, common files used by the other parts of the mozilla suite, and the XBL files for the parts of the XUL language that are implemented in XBL. Much of this code has been copied to <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#browser">browser</a>/ and <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#toolkit">toolkit</a>/ for use in Firefox, Thunderbird, etc.</p>
+      <div id="section_98">
+        <h3 id="xpfecomponents"><span>xpfe/components</span></h3>
+        <div class="editIcon">
+          <h3 id="sect71"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=98"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Components used by the Mozilla frontend, as well as implementations of interfaces that other parts of mozilla expect.</p>
+      </div>
+      <div id="section_99">
+        <h3 id="xpfebootstrap"><span>xpfe/bootstrap</span></h3>
+        <div class="editIcon">
+          <h3 id="sect72"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=99"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h3>
+        </div>
+        <p>Startup code for Mozilla. This contains the main/WinMain function. (Not used by "new toolkit" apps; for those, see <a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure#toolkit">toolkit</a>/xre and the "app" directory for each specific app).</p>
+      </div>
+    </div>
+    <div id="section_100">
+      <h2 id="xpinstall"><span>xpinstall</span></h2>
+      <div class="editIcon" style="">
+        <h2 id="sect73"><a href="/en-US/docs/Mozilla_Source_Code_Directory_Structure?action=edit&amp;sectionId=100"><span class="icon"><img alt="Edit section" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></h2>
+      </div>
+      <p>The installer, which contains code for installing Mozilla and for installing XPIs/extensions. This directory also contains code needed to build installer packages. See <a href="/en-US/docs/XPInstall" title="XPInstall">XPInstall</a> and the <a class="external" href="http://www.mozilla.org/projects/xpinstall/" rel="external" title="http://www.mozilla.org/projects/xpinstall/">XPInstall project page</a>.</p>
+    </div>
+  </div>
+</div>
diff --git a/files/es/orphaned/etiquetas_audio_y_video_en_firefox/index.html b/files/es/orphaned/etiquetas_audio_y_video_en_firefox/index.html
new file mode 100644
index 0000000000..c556536247
--- /dev/null
+++ b/files/es/orphaned/etiquetas_audio_y_video_en_firefox/index.html
@@ -0,0 +1,47 @@
+---
+title: Etiquetas audio y video en Firefox
+slug: orphaned/Etiquetas_audio_y_video_en_Firefox
+original_slug: Etiquetas_audio_y_video_en_Firefox
+---
+<p>{{ gecko_minversion_header("1.9.1") }}</p>
+<p>En Firefox 3.5 se ha incorporado la posibilidad de usar las etiquetas para los elementos  <a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a> y <a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a>, agregados a las especificaciones de HTML 5, lo que permite insertar  fácilmente archivos de audio o video en los documentos HTML.  Actualmente sólo pueden usarse los formatos Ogg y WAV, pero se espera agregar la posibilidad de usar otros formatos en el futuro.</p>
+<h2 id="Insertar_medios">Insertar medios</h2>
+<p>Insertar medios en su documento HTML es sencillo:</p>
+<pre class="brush: html">&lt;video src="http://v2v.cc/~j/theora_testsuite/320x240.ogg" autoplay&gt;
+  Your browser does not support the &lt;code&gt;video&lt;/code&gt; element.
+&lt;/video&gt;
+</pre>
+<p>Este ejemplo reproduce un video del sitio web de Theora.</p>
+<p>Se pueden agregar múltiples archivos usando el elemento <a class="internal" href="/En/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> para especificar diferentes archivos con diferentes formatos para distintos navegadores. Por ejemplo:</p>
+<pre class="brush: html">&lt;video autoplay&gt;
+  &lt;source src="foo.ogg" type="video/ogg"&gt;
+  &lt;source src="foo.mov"&gt;
+  Your browser does not support the &lt;code&gt;video&lt;/code&gt; element.
+&lt;/video&gt;
+</pre>
+<p>ejecutará el archivo OGG en los navegadores que puedan reproducir ese formato. Si el navegador no puede reproducir ese formato, intentará usar el archivo MOV.</p>
+<div class="note"><strong>Nota: </strong>El elemento source todavía no es completamente funcional en Firefox. Mire el {{ bug(449363) }} para más detalles.</div>
+<h2 id="Controlar_la_reproducción_de_los_archivos">Controlar la reproducción de los archivos</h2>
+<p>Una vez que haya insertado el archivo en el documento HTML usando los nuevos elementos, puede controlarlos usando JavaScript. Por ejemplo, para empezar (o reiniciar) la reproducción, puede hacer esto::</p>
+<pre class="brush: js">var v = document.getElementsByTagName("video")[0];
+v.play();
+</pre>
+<p>La primera línea localiza el elemento en el documento y la segunda usa el método <a class="external" href="/En/NsIDOMHTMLMediaElement#play()" title="https://developer.mozilla.org/editor/fckeditor/core/editor/En/NsIDOMHTMLMediaElement#play()"><code>play()</code></a> del mismo, como está definido en la interface {{ interface("nsIDOMHTMLMediaElement") }} que se usa para implementar los elementos de medios.</p>
+<h2 id="Eventos_en_medios">Eventos en medios</h2>
+<p>Muchos eventos son enviados cuando se manejan medios:</p>
+<table class="standard-table"> <tbody> <tr> <td class="header">Nombre del evento</td> <td class="header">Descripción</td> </tr> <tr> <td><code>abort</code></td> <td>Se envía cuando se aborta la reproducción, por ejemplo, cuando el archivo se está reproduciendo y es reiniciado, se envía este evento.</td> </tr> <tr> <td><code>canplay</code></td> <td>Se envía cuando ya está disponible la suficiente cantidad del archivo para que pueda reproducirse, por lo menos por unos cuantos cuadros. Se corresponde con <code>CAN_PLAY</code> <code>readyState</code>.</td> </tr> <tr> <td><code>canplaythrough</code></td> <td>Se envía cuando el estado cambia a <code>CAN_PLAY_THROUGH</code>, lo que indica que puede reproducirse completamente el archivo sin interrupciones, asumiendo que la tasa de descaraga se mantendrá en el nivel actual.</td> </tr> <tr> <td><code>canshowcurrentframe</code></td> <td>El cuadro actual fue cargado y puede mostrarse. Este se corresponde a <code>CAN_SHOW_CURRENT_FRAME</code> <code>readyState</code>.</td> </tr> <tr> <td><code>dataunavailable</code></td> <td>Se envía cuando el estado cambia a <code>DATA_UNAVAILABLE</code>.</td> </tr> <tr> <td><code>durationchange</code></td> <td>Los metadatos fueron cargados o han cambiado, lo que indica un cambio en la duración del archivo. Esto se envía, por ejemplo, cuando se ha cargado tanto del archivo que se conoce la duración total del mismo.</td> </tr> <tr> <td><code>emptied</code></td> <td>El  archivo se ha vaciado. Por ejemplo, este evento se envía si el archivo había sido cargado (o parcialmente cargado), y se llamó al método <a class="internal" href="/En/nsIDOMMediaHTMLElement#load()" title="En/nsIDOMMediaHTMLElement#load()"><code>load()</code></a> para recargarlo.</td> </tr> <tr> <td><code>empty</code></td> <td>Se envía cuando hay un error y el archivo está vacío.</td> </tr> <tr> <td><code>ended</code></td> <td>Se envía cuando se termina la reproducción.</td> </tr> <tr> <td><code>error</code></td> <td>Se envía cuando hay un error. El atributo <code>error</code> del elemento contiene más información.</td> </tr> <tr> <td><code>load</code></td> <td>El archivo se descargó completamente.</td> </tr> <tr> <td><code>loadedfirstframe</code></td> <td>El primer cuadro del archivo se terminó de descargar.</td> </tr> <tr> <td><code>loadedmetadata</code></td> <td>Los metadatos del archivo se terminaron de descargar, todos los atributos contienen la mayor cantidad de información posible.</td> </tr> <tr> <td><code>loadstart</code></td> <td>Se envía cuando comienza la carga del archivo.</td> </tr> <tr> <td><code>pause</code></td> <td>Se envia cuando se pone en pausa la reproducción.</td> </tr> <tr> <td><code>play</code></td> <td>Se envía cuando se comienza la reproducción o cuando se reinicia.</td> </tr> <tr> <td><code>ratechange</code></td> <td>Se envía cuando cambia la velocidad de reproducción.</td> </tr> <tr> <td><code>seeked</code></td> <td>Se envía cuando se completa la operación de búsqueda.</td> </tr> <tr> <td><code>seeking</code></td> <td>Se envía cuando comienza la operación de búsqueda.</td> </tr> <tr> <td><code>timeupdate</code></td> <td>El tiempo indicado por el atributo <code>currentTime</code> del elemento cambió.</td> </tr> <tr> <td><code>volumechange</code></td> <td>Se envía al cambiar el volumen del audio (cuando el volumen es elegido y cuando cambia el atributo <code>muted</code>).</td> </tr> <tr> <td><code>waiting</code></td> <td>Se envía cuando la operación solicitada (como la reproducción) se retrasa porque espera que se complete otra operación (como una búsqueda).</td> </tr> </tbody>
+</table>
+<p>Fácilmente puede vigilar estos eventos, si usa un código parecido al siguiente:</p>
+<pre>var v = document.getElementsByTagName("video")[0];
+
+v.addEventListener("seeked", function() { document.getElementsByTagName("video")[0].play(); }, true);
+v.currentTime = 10.0;
+</pre>
+<p>Este ejemplo obtiene el primer elemento de video del documento y le adhiere un event listenert, esperando por el evento seeked, que se envía cuando termino una operación de búsqueda.  El listener simplemente ejecuta el método <code>play()</code> del elemento, que comenzará la reproducción.</p>
+<p>En la línea 4, se configura el atributo <code>currentTime</code> a 10.0, que inicia una operación de busqueda a la marca de los 10 segundos en el archivo.  Esto genera que se envíe un evento <code>seeking</code> cuando comienza la operación, después un evento <code>seeked</code> se enviara cuando la búsqueda se haya completado.</p>
+<p>En otras palabras, en este ejemplo se busca la marca de los 10 segundos en el archivo, y luego comienza la reproducción.</p>
+<h2 id="Vea_también">Vea también</h2>
+<ul> <li><a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a></li> <li><a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a></li> <li><a class="internal" href="/En/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> </li> <li><a class="internal" href="/En/Manipulating_video_using_canvas" title="En/Manipulating video using canvas">Manipulating video using canvas</a></li> <li>{{ interface("nsIDOMHTMLMediaElement") }}</li>
+</ul>
+<p> {{ languages( { "en": "en/Using_audio_and_video_in_Firefox" } ) }}</p>
+<p> {{ languages( { "fr": "fr/Utilisation_d'audio_et_video_dans_Firefox" } ) }}</p>
diff --git a/files/es/orphaned/extensiones/actualización_de_extensiones_para_firefox_4/index.html b/files/es/orphaned/extensiones/actualización_de_extensiones_para_firefox_4/index.html
new file mode 100644
index 0000000000..5b2d9adbc0
--- /dev/null
+++ b/files/es/orphaned/extensiones/actualización_de_extensiones_para_firefox_4/index.html
@@ -0,0 +1,32 @@
+---
+title: Actualización de extensiones para Firefox 4
+slug: orphaned/Extensiones/Actualización_de_extensiones_para_Firefox_4
+tags:
+  - Agregados
+  - Complementos
+  - Firefox 4
+  - Gecko 2.0
+  - extensiones
+  - para_revisar
+original_slug: Extensiones/Actualización_de_extensiones_para_Firefox_4
+---
+<p>{{ fx_minversion_header(4) }}</p>
+<p>Este artículo ofrece detalles sobre aquellos cambios en Firefox 4 que pueden afectar a las extensiones existentes.</p>
+<h2 id="Cambios_en_XPCOM">Cambios en XPCOM</h2>
+<p>Se han llevado a cabo una serie de cambios que afectan a los complementos/agregados y las aplicaciones que incluyen componentes XPCOM. Consulta <a href="/es/XPCOM/Cambios_XPCOM_en_Gecko_2.0" title="https://developer.mozilla.org/es/XPCOM/Cambios_XPCOM_en_Gecko_2.0">los cambios de XPCOM en Gecko 2</a> para obtener más detalles.</p>
+<h2 id="Desempaquetado_de_XPI">Desempaquetado de XPI</h2>
+<p>Firefox 4 <a class=" link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=533038" title="https://bugzilla.mozilla.org/show_bug.cgi?id=533038">ya no extrae XPIs</a> al instalar complementos/agregados. Simplemente coloca el archivo XPI en el perfil del usuario y a continuación lee los archivos chrome y otro tipos de archivos directamente del XPI. Todavía funciona un jar en el XPI, aunque haya dejado de ser necesario, para facilitarte el proceso de desarrollo o compilación. Se ha hecho así principalmente por razones de rendimiento en los SO lentos a la vez que permite mejorar la invalidación de la caché, lo cual también ayuda a los desarrolladores. Sin embargo, no todos los tipos de archivos pueden leerse ya desde el XPI, por lo tanto si tu complemento/agregado usa uno de ellos, tienes que especificar <span class="nowiki"><a title="https://developer.mozilla.org/en/Install_Manifests#unpack"><code>&lt;em:unpack&gt;</code></a></span>  en tu install.rdf para hacer que Firefox continúe extrayendo tu XPI y usando archivos solos. De lo contrario, tu complemento/agregado fallará al intentar tener acceso a estos archivos.</p>
+<p>Si tu complemento/agregado sólo contiene estos tipos de archivos, no es necesario que realices ningún cambio::</p>
+<ul> <li><code>install.rdf</code></li> <li><code>chrome.manifest</code></li> <li><code>chrome</code> (incluyendo <code>content</code>, <code>locale</code>, <code>skin</code>)</li> <li>preferencias predeterminadas</li> <li>componentes XPCOM escritos en JavaScript</li>
+</ul>
+<p>Si tu complemento/agregado contiene alguno de los siguientes tipos de archivos, tendrás que incluir <code><code>&lt;em:unpack&gt;</code></code> en el install.rdf:</p>
+<ul> <li>componentes binarios XPCOM</li> <li>DLLs cargadas con CTypes</li> <li><code>searchplugins/</code> (que deben ser cargadas automáticamente por Firefox)</li> <li><code>dictionaries/</code></li> <li>Iconos de ventana (podrían <a class=" link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=595462" title="https://bugzilla.mozilla.org/show_bug.cgi?id=595462">solucionarse</a>)</li>
+</ul>
+<p>Si el código de tu complemento/agregado tiene acceso a otros archivos que has empaquetado en el XPI, entonces tendrás que incluir <code> </code><code>&lt;em:unpack&gt;</code> en el install.rdf o bien tendrás que realizar algunos cambios en tu código para poder admitir una instalación empaquetada. Cualquier código que usara getInstallLocation() y nsIFile tendrá que incluir em:unpack o modificarse. Puedes usar el método <code><a href="/en/Addons/Add-on_Manager/Addon#getResourceURI%28%29" title="https://developer.mozilla.org/en/Addons/Add-on_Manager/Addon#getResourceURI()">Addon.getResourceURI()</a></code>, devolverá un {{ interface("nsIURI") }} que apunta al archivo solicitado. Si la extensión o el agregado está sin empaquetar, entonces será un <code><span class="nowiki">file://</span></code> URI. Si la extensión o el agregado está empaquetada/o, será un <span class="nowiki"><code>jar://</code></span> URI. Puedes abrir secuencias para estas URI abriendo un canal mediante {{ interface("nsIIOService") }} que te permitirá descargar los contenidos de los archivos sin que haya que desempaquetar.</p>
+<h2 id="Se_han_eliminado_los_HWND_secundarios">Se han eliminado los HWND secundarios</h2>
+<p>Afectará a un número muy reducido de desarrolladores. En las versiones anteriores de Firefox, los <code>HWND</code> se creaban en Windows para uso interno. Como parte del trabajo destinado a la mejora del rendimiento de gráficos, éstos ya no se crean.</p>
+<p>Lamentablemente, las pocas extensiones que han tenido acceso y han manipulado directamente estos <code>HWND</code> no funcionarán en Firefox 4. Hemos colocado algunos parches para ayudar a los drivers de determinados dispositivos señaladores y al software de tecnología de ayuda (lectores de pantalla, por ejemplo). Sin embargo, hemos optado por no añadir más parches para admitir extensiones, que desde el principio no deberían haberlo hecho.</p>
+<p>Si mantienes una extensión que usa componentes nativos que dependen de unos <code>HWND</code> que ya no existen, tendrás que actualizar tu extensión. Existen dos formas de hacer esto.</p>
+<p>La primera, y la mejor, solución es dejar de acceder a los <code>HWND</code> y en su lugar usar características Web o XUL para implementar tus extensiones. Existen muchas características nuevas en Firefox 4 que posibilitan muchas cosas que requerían código nativo, por lo tanto ya no tendrás que hacerlo.</p>
+<p>Si ves que no funciona y sigues teniendo que acceder directamente a los <code>HWND</code>s, tal vez tu única solución sea escribir un plugin <a href="/en/NPAPI" title="en/NPAPI">NPAPI</a> para que haga el trabajo. Puede suponer mucho trabajo pero debería funcionar. Por supuesto, no te servirá si los <code>HWND</code> específicos que usabas ya no existen.</p>
+<p>{{ languages( { "en": "en/Extensions/Updating_extensions_for_Firefox_4" } ) }}</p>
diff --git a/files/es/orphaned/faq_incrustando_mozilla/index.html b/files/es/orphaned/faq_incrustando_mozilla/index.html
new file mode 100644
index 0000000000..44b6890c7e
--- /dev/null
+++ b/files/es/orphaned/faq_incrustando_mozilla/index.html
@@ -0,0 +1,71 @@
+---
+title: FAQ Incrustando Mozilla
+slug: orphaned/FAQ_Incrustando_Mozilla
+tags:
+  - Incrustando_Mozilla
+  - Preguntas_frecuentes_sobre_incrustación_en_Mozilla
+  - Todas_las_Categorías
+original_slug: FAQ_Incrustando_Mozilla
+---
+<p>Esta página es una recopilación de preguntas frecuentes sobre <a href="es/Incrustrando_Mozilla"> Incrustrando Mozilla </a>.
+</p><p>Lista de correo (en inglés): <a class="external" href="http://www.mozilla.org/community/developer-forums.html#mozilla-embedding">mozilla-embedding@mozilla.org</a>
+</p>
+<ol><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n">Introducción a Gecko e inscrustación</a>
+<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_Gecko.3F"> ¿Qué es Gecko?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_Mozilla.3F"> ¿Qué es Mozilla?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_el_GRE.3F"> ¿Qué es el GRE?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_es_XPCOM.3F"> ¿Qué es XPCOM?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Que_significa_.22incrustar.22_Gecko.3F"> ¿Qué significa "incrustar" Gecko?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Cuales_son_los_t.C3.A9rminos_de_licencia_para_incrustar_Gecko.3F"> ¿Cuales son los términos de licencia para incrustar Gecko?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Hay_disponible_un_SDK_.3F"> ¿Hay disponible un SDK?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Cu.C3.A1l_es_la_.C3.BAltima_versi.C3.B3n.3F_Que_versi.C3.B3n_deber.C3.ADa_usar.3F"> ¿Cuál es la última versión? ¿Que versión debería usar?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Introducci%c3%b3n_a_Gecko_e_inscrustaci%c3%b3n#Qui.C3.A9n_esta_usando_Gecko_actualmente.3F"> ¿Quién está usando Gecko actualmente?</a>
+</li></ol>
+</li><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko"> Incrustando Gecko</a>
+<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Qu.C3.A9_archivos_necesito_para_poder_incrustar_.3F"> ¿Qué archivos necesito para poder incrustar?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#C.C3.B3mo_se_lleva_a_cabo_la_distribuci.C3.B3n_de_la_incrustaci.C3.B3n.3F"> ¿Cómo se lleva a cabo a la distribución de la incrustación?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Por_qu.C3.A9_necesito_incluir_archivos_XPT_en_mi_aplicaci.C3.B3n3F"> ¿Por qué necesito incluir archivos XPT en mi aplicación?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#C.C3.B3mo_me_mantengo_al_tanto_con_los_cambios_en_la_interfaz_de_Gecko_.3F"> ¿Cómo me mantengo al tanto con los cambios en la interfaz de Gecko?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Esto_significa_que_mi_compilaci.C3.B3n_ser.C3.A1_compatible_con_todas_las_versiones_futuras_de_GRE_.2F_Gecko_.2F_Mozilla.3F"> ¿Esto significa que mi compilación será compatible con todas las versiones futuras de GRE/Gecko/Mozilla?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Qu.C3.A9_plataformas_son_soportadas_.3F"> ¿Qué plataformas son soportadas?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Admite_la_versi.C3.B3n_incrustada_protocolos_seguros_como_HTTPS.3F"> ¿Admite la versión incrustada protocolos seguros como HTTPS?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#C.C3.B3mo_se_comunica_mi_aplicaci.C3.B3n_con_Gecko.3F"> ¿Cómo se comunica mi aplicación con Gecko?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Puedo_incrustar_sin..."> ¿Puedo incrustar_sin ...</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Puedo_incrustar_el_editor_mozilla_de_HTML.3F"> Puedo incrustar el editor mozilla de HTML?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Qu.C3.A9_herramienta_de_creaci.C3.B3n_de_wigdets_emplea_Mozilla.3F"> ¿Qué herramienta de creación de wigdets emplea Mozilla?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Tiene_elmozilla_incrustado_soporte_para_Javat.3F"> Tiene el mozilla incrustado soporte para Java?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Incrustando_Gecko#Puedo_incrustar_en_ozilla_de_alguna_otra_manera.3F"> ¿Puedo incrustar en mozilla de alguna otra manera?</a>
+</li></ol>
+</li><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago_...">Cómo hago ...</a>
+<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_incrusto_Gecko.3F"> ¿Cómo incrusto Gecko?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#Qu.C3.A9_es_un_servicio.3F"> ¿Qué es un servicio?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_cargo_una_p.C3.A1gina.3F"> ¿Cómo cargo una página?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_bloqueo_una_carga.3F"> ¿Cómo bloqueo una carga?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_vigilo_.2Finterrumpo_una_carga_antes_de_que_ocurra_.3F"> ¿Cómo vigilo/interrumpo una carga antes de que ocurra?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_copio_elementos_al_portapapeles.3F"> Cómo copio elementos al portapapeles?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_grabo_un_documento_o_dato_en_el_disco.3F"> ¿Cómo grabo un documento o dato en el disco?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_grabo_.2F_cuelgo_un_archivo_.2F_dato_a_un_sitio_web_o_un_servidor_ftp.3F"> ¿Cómo grabo/cuelgo un archivo/dato a un sitio web o un servidor ftp?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_s.C3.A9_cuando_una_grabaci.C3.B3n_ha_concluido_.2C_vigilo_el_progreso_etc..3F"> ¿Cómo sé cuando una grabación ha concluido, vigilo el progreso etc.?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_imprimo_una_p.C3.A1gina.3F"> ¿Cómo imprimo una página?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_creo_la_vista_preliminar_de_una_p.C3.A1gina.3F"> Cómo creo la vista preliminar de una página?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_consigo_que_los_elemento_semergentes_fucionen_.3F"> Cómo consigo que los elementos emergentes fucionen?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#Necesito_que_el_Javascript_dentro_de_la_ventana_del_navegador_se_comunique_con_mi_cliente_incrustado._C.C3.B3mo_lo_hago_.3F"> Necesito que el Javascript dentro de la ventana del navegador se comunique con mi cliente incrustado. Cómolohago?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezaco_otras_ubicaciones_para_archivos_como_components.reg.3F"> Cómo establezco otras ubicaciones para archivos como components.reg?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezaco_otras_ubicaciones_para_los_perfiles.3F"> ¿Cómo establezco otras ubicaciones para los perfiles?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_cambio_la_cadena_de_identificaci.C3.B3n.3F"> ¿Cómo cambio la cadena de identificación?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_muestro_mi_propio_mensaje.2C_alertas_y_ventanas_de_aviso.3F"> ¿Cómo muestro mi propio mensaje, alertas y ventanas de aviso?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_obtengo_el_archivo_DOM_del_objeto_navegador.3F"> ¿Cómo obtengo el archivo DOM del objeto navegador?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#Qu.C3.A9_es_el_docshell.3F"> ¿Qué es el docshell?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezco_menus_contextuales_.3F"> ¿Cómo establezco menus contextuales?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_establezco_los_tool_tips.3F"> ¿Cómo establezco los tool tips?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_hago_para_ver_tool_tips_para_nodos_con_attributos_ALT.3F"> ¿Cómo hago para ver tool tips para nodos con attributos ALT?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/C%c3%b3mo_hago...#C.C3.B3mo_hago_para_configurar_el_proxy_.3F"> ¿Cómo hago para configurar el proxy?</a>
+</li></ol>
+</li><li> <a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_Comunes">Problemas comunes</a>
+<ol><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#TestGTKEmbed_no_funciona.21"> ¡El TestGTKEmbed no funciona!</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#C.C3.B3mo_compilo_MFCEmbed_.3F"> ¿Cómo compilo MFCEmbed?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#C.C3.B3mo_depuro_MFCEmbed.3F"> ¿Cómo depuro MFCEmbed?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#Por_qu.C3.A9_no_funciona_el_FTP.3F"> ¿Por qué no funciona el FTP?</a>
+</li><li><a href="es/Preguntas_frecuentes_sobre_incrustaci%c3%b3n_en_Mozilla/Problemas_comunes#Por_qu.C3.A9_es_mi_compilaci.C3.B3n_tan_grande.3F.21"> ¿Por qué es mi compilación tan grande?</a>
+</li></ol>
+</li></ol>
diff --git a/files/es/orphaned/firefox_addons_developer_guide/introduction_to_extensions/index.html b/files/es/orphaned/firefox_addons_developer_guide/introduction_to_extensions/index.html
new file mode 100644
index 0000000000..3dd23de8a0
--- /dev/null
+++ b/files/es/orphaned/firefox_addons_developer_guide/introduction_to_extensions/index.html
@@ -0,0 +1,160 @@
+---
+title: 'Capítulo 1: Introducción a las extensiones.'
+slug: orphaned/Firefox_addons_developer_guide/Introduction_to_Extensions
+original_slug: Firefox_addons_developer_guide/Introduction_to_Extensions
+---
+<div>
+ {{ Draft() }}</div>
+<p>{{ PreviousNext("Firefox_addons_developer_guide", "Firefox_addons_developer_guide/Technologies_used_in_developing_extensions") }}</p>
+<div class="note">
+ <strong>Note: </strong>If you want contribute to this document please following guidelines from the <a class="internal" href="/en-US/docs/Firefox_addons_developer_guide/Contribute" title="En/Firefox_addons_developer_guide/Contribute">Contribute</a> page.</div>
+<p><em>Este documento fue escrito por </em><a class="external" href="http://level.s69.xrea.com/mozilla/" title="http://level.s69.xrea.com/mozilla/"><em>Hideyuki Emura</em></a><em> y publicado originalmente en japonés para el </em><a class="link-https" href="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English" title="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English"><em>Firefox Developers Conference Summer 2007</em></a><em>. Emura-san es un coautor de <a class="external" href="http://www.oreilly.co.jp/books/9784873113753/index.html" title="http://www.oreilly.co.jp/books/9784873113753/index.html">Firefox 3 Hacks</a> (O'Reilly Japan, 2008.)</em></p>
+<h2 id="Introducción">Introducción</h2>
+<p>Si estás leyendo esta guía, probablemente has utilizado firefox antes. Tal vez la primera vez que viste firefox, es posible que te hayas sorprendido al ver que tiene una estructurara mucho más simple que otros navegadores con muchas funciones, como Opera o Safari.</p>
+<p>¿Qué características son consideradas estándar para los navegadores en estos días? Tal vez cosas como controles de pestañas, movimientos del ratón, barras de herramientas y botones, un lector de feed, integración con una variedad de aplicaciones web, o herramientas sofisticadas para ayudar al diseño web. Pero nosotros no teníamos la intención de crear un navegador todo-en uno que pueda satisfacer a todos</p>
+<p>En cambio, Firefox puede soportar estas características a través de las extensiones. El núcleo del navegador se limita a las funciones básicas, algo que puede hacer sentirse cómodo a un principiante, pero los usuarios que quieren algo más pueden instalar las extensiones.</p>
+<h2 id="Acerca_de_las_extensiones">Acerca de las extensiones</h2>
+<h3 id="Administrador_de_complementos">Administrador de complementos</h3>
+<p>El administrador de complementos de firefox es una excelente manera para manejar las extensiones y es muy fácil de usar.</p>
+<p><img alt="" class="internal" src="/@api/deki/files/3818/=addons-manager.png" style="width: 563px; height: 462px;"></p>
+<p>El Administrador de complementos se encarga de las siguientes tareas:</p>
+<ul>
+ <li>Instalaciones y desintalaciones seguras de complementos.</li>
+ <li>Verifica que el complemento sea compatible con la versión de firefox que estás usando.</li>
+ <li>Maneja listas blancas de sitios de confianza para la instalación de complementos.</li>
+ <li>Ayuda a solucionar problemas de complementos inhabilitándolos y faciliar un modo seguro.</li>
+ <li>Confirma y ejecuta actualizaciones.</li>
+ <li>Provee acceso a los diálogos de configuración del complemento.</li>
+ <li>Provee acceso a las páginas web de asistencia de los complementos.</li>
+</ul>
+<h3 id="Características_del_entorno_de_desarrollo">Características del entorno de desarrollo</h3>
+<p>Inicialmente, no había suficiente documentación disponible, y los desarrolladores de extensiones quedaron en gran medida a su suerte; sin embargo, ahora hay un cuantioso depósito de conocimiento.</p>
+<p>Debido a que Firefox y sus extensiones están diseñadas para soportar multiples idiomas, excelentes extensiones vienen de todo el mundo, y pueden ser localizadas rápidamente por cualquier persona que esté interesada.</p>
+<p>Ésto facilita el uso y el desarrollo de extensiones; este hecho, combinado con la popularidad creciente de firefox, ha creado un búcle de realimentación positiva, y un crecimiento explosivo del número de usuarios  y desarrolladores de las extensiones. Hay ahora más de 7000 extensiones y temas publicados en la página web de complementos de firefox. (<a class="link-https" href="https://addons.mozilla.org" rel="freelink">https://addons.mozilla.org</a>).</p>
+<h2 id="¿Qué_podemos_hacer_con_las_extensiones">¿Qué podemos hacer con las extensiones?</h2>
+<p>Echemos un vistazo a que características pueden añadir las extensiones y algunos ejemplos reales de ellas.</p>
+<h3 id="Extensiones_solo_con_una_función.">Extensiones solo con una función.</h3>
+<p>{{ TODO("Update this") }}.</p>
+<p>Éstas son extensiones relativamente simples que añaden solo una función.</p>
+<dl>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/1939/" title="https://addons.mozilla.org/firefox/1939/">Enlace de texto</a></dt>
+ <dd>
+  Makes it so that double-clicking on an unlinked URL follows that URL.</dd>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/3082/" title="https://addons.mozilla.org/firefox/3082/">Botón para abrir pestañas cerradas</a></dt>
+ <dd>
+  <span id="Dst[0][0:3:0:4]">Añade</span><span> </span><span id="Dst[0][5:5:6:7]">un</span><span> </span><span id="Dst[0][15:20:9:13]">botón</span><span> en la </span><span id="Dst[0][7:13:18:38]">barra de herramientas</span><span> </span><span id="Dst[0][22:23:40:43]">para</span><span> </span><span id="Dst[0][25:31:45:58]">volver a abrir</span><span> </span><span id="Dst[0][33:35:60:62]">las</span><span> </span><span id="Dst[0][58:61:64:71]">pestañas</span><span> </span><span id="Dst[0][51:56:73:80]">cerradas</span><span> </span><span id="Dst[0][42:49:86:98]">más recientemente</span><span> </span><span id="Dst[0][63:64:100:101]">en</span><span> </span><span id="Dst[0][66:68:103:104]">el</span><span> </span><span id="Dst[0][78:81:106:109]">menú del</span><span> </span><span id="Dst[0][70:76:111:119]">historial.</span></dd>
+</dl>
+<dl>
+ <dd>
+  <img alt="1211576231.png" class="internal default" src="/@api/deki/files/3316/=1211576231.png" style="width: 340px; height: 317px;"></dd>
+</dl>
+<dl>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/4014/" title="https://addons.mozilla.org/firefox/4014/">Barra de la dirección</a></dt>
+ <dd>
+  <div>
+   <span id="Dst[0][0:8:0:5]">Separa</span><span> </span><span id="Dst[0][18:23:18:24]">el dominio</span><span> </span><span id="Dst[0][25:27:26:26]">y</span><span> la ruta de </span><span id="Dst[0][29:32:36:41]">acceso</span><span> de una URL para facilitar su lectura </span><span id="Dst[0][34:35:43:44]">en</span><span> </span><span id="Dst[0][37:39:46:47]">la</span><span> </span><span id="Dst[0][50:52:49:53]">barra</span><span> de </span><span id="Dst[0][41:48:58:68]">direcciones</span><span>.</span></div>
+ </dd>
+ <dd>
+  <img alt="locationbar.png" class="internal default" src="/@api/deki/files/3317/=locationbar.png" style="width: 200px; height: 150px;"></dd>
+</dl>
+<h3 id="Feature_enhancing_extensions">Feature enhancing extensions</h3>
+<p>{{ TODO("Update this") }}.</p>
+<p>These extensions enhance features that already exist in Firefox.</p>
+<dl>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/1122/" title="https://addons.mozilla.org/firefox/1122/">Tab Mix Plus</a></dt>
+ <dd>
+  Offers detailed tab-related settings.</dd>
+ <dt>
+  <a class="external" href="http://prefbar.mozdev.org/" title="http://prefbar.mozdev.org/">PrefBar</a></dt>
+ <dd>
+  Gives access to numerous preferences from the toolbar.<img alt="PrefBar.png" class="internal default" src="/@api/deki/files/3371/=PrefBar.png" style="width: 843px; height: 113px;"></dd>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/722/" title="https://addons.mozilla.org/firefox/722/">NoScript</a></dt>
+ <dd>
+  Enables and disables JavaScript execution on a site-by-site basis.</dd>
+</dl>
+<h3 id="Web_application_integration_extensions">Web application integration extensions</h3>
+<p>{{ TODO("Update this") }}.</p>
+<p>The use the APIs of certain web applications to provide certain pieces of information.</p>
+<p><img alt="Forecastfox.png" class="internal default" src="/@api/deki/files/3372/=Forecastfox.png" style="width: 359px; height: 94px;"></p>
+<h3 id="New_feature_extensions">New feature extensions</h3>
+<p>{{ TODO("Update this") }}.</p>
+<p>Extensions can add completely new features to Firefox. This class of extension requires a greater level of knowledge and programming ability.</p>
+<dl>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/748/" title="https://addons.mozilla.org/firefox/748/">GreaseMonkey</a></dt>
+ <dt>
+  <a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=397735" title="http://forums.mozillazine.org/viewtopic.php?t=397735">UserChrome.js</a></dt>
+ <dd>
+  Both of these provide an environment for running user scripts (JavaScript) in Firefox itself, where the scripts can target specific websites.</dd>
+</dl>
+<dl>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/1865/" title="https://addons.mozilla.org/firefox/1865/">Adblock Plus</a></dt>
+ <dd>
+  Blocks the display of unwanted advertisements on web pages.</dd>
+ <dt>
+  <a class="link-https" href="https://addons.mozilla.org/firefox/12/" title="https://addons.mozilla.org/firefox/12/">All-in-One Gestures</a></dt>
+ <dd>
+  Adds mouse-gesture functionality.</dd>
+</dl>
+<h3 id="Application_level_extensions">Application level extensions</h3>
+<p>{{ TODO("Update this") }}.</p>
+<p>These are sophisticated extensions that can be considered full-scale applications in their own right, essentially using Firefox as the development platform.</p>
+<p><img alt="Firebug.gif" class="internal default" src="/@api/deki/files/3373/=Firebug.gif" style="width: 712px; height: 336px;"></p>
+<h3 id="One-trick_gag_extensions">One-trick gag extensions</h3>
+<p>{{ TODO("Update this") }}.</p>
+<p>There are a number of one-trick gag extensions that aren’t very useful.</p>
+<p><img alt="Shiitake Mushroom (1).png" class="internal default" src="/@api/deki/files/3375/=Shiitake%20Mushroom%20(1).png" style="width: 200px; height: 150px;"></p>
+<p>This is a very brief survey of a few extensions, but there are many other unique extensions available.</p>
+<p><strong>Table 1: Advanced customization methods for Firefox</strong></p>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Customization Method</td>
+   <td class="header">Does it work for web sites?</td>
+   <td class="header">Does it work for Firefox?</td>
+  </tr>
+  <tr>
+   <td>User style sheets (change appearance through CSS)</td>
+   <td>
+    <p>Yes; you can change the <code>userContent.css</code> file, or use the Stylish extension.</p>
+   </td>
+   <td>
+    <p>Yes; you can change the <code>userChrome.css</code> file, or use the Stylish extension.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>User scripts (change appearance and functionality through JavaScript)</td>
+   <td>
+    <p>Yes; you can use the GreaseMonkey extension or "bookmarklets."</p>
+   </td>
+   <td>
+    <p>Yes; you can change <code>userChrome.js</code> to add functionality through JavaScript.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Extensions (these can do anything)</td>
+   <td>Yes</td>
+   <td>Yes</td>
+  </tr>
+  <tr>
+   <td>Theming (this changes the look of the browser)</td>
+   <td>No</td>
+   <td>Yes</td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Vamos_a_construir_una_extensión">Vamos a construir una extensión</h2>
+<p>La tabla 1 muestra varias opciones de personalización disponibles para un usuario en firefox. Los usuarios tienen opciones de personalicación Flexibles, usando CSS en las hojas de estilo del usuario y javaScript/DOM en los script del usuario.</p>
+<p>En adición a CSS y Javascript, las extensiones pueden tomar ventajas de las tecnologías XUL y XPCOM para características más sofisticadas. Temas, los cuales pueden alterar la apariencia de firefox, son un tipo de complemento.</p>
+<p>Para crear una extension, necesitas una idea y sólo un poco de abilidad programando. Los siguientes capítulos explicaremos con detalles las tecnicas para escribir extensiones.</p>
+<div class="footnotes">
+ <div class="note" id="footnote1">
+  <a href="#from_footnote1">1</a> One of the authors of this special edition, Piro, is world-famous as one of the original developers.</div>
+</div>
+<p>{{ PreviousNext("Firefox_addons_developer_guide", "Firefox_addons_developer_guide/Technologies_used_in_developing_extensions") }}</p>
diff --git a/files/es/orphaned/firefox_addons_developer_guide/technologies_used_in_developing_extensions/index.html b/files/es/orphaned/firefox_addons_developer_guide/technologies_used_in_developing_extensions/index.html
new file mode 100644
index 0000000000..19d7156094
--- /dev/null
+++ b/files/es/orphaned/firefox_addons_developer_guide/technologies_used_in_developing_extensions/index.html
@@ -0,0 +1,80 @@
+---
+title: 'Chapter 2: Technologies used in developing extensions'
+slug: >-
+  orphaned/Firefox_addons_developer_guide/Technologies_used_in_developing_extensions
+original_slug: Firefox_addons_developer_guide/Technologies_used_in_developing_extensions
+---
+<p>{{ Draft() }} {{ PreviousNext("Firefox addons developer guide/Introduction to Extensions", "Firefox addons developer guide/Introduction_to_XUL—How_to_build_a_more_intuitive_UI") }}</p>
+<p><em>This document was authored by <a class="external" href="http://piro.sakura.ne.jp/" title="http://piro.sakura.ne.jp/">Hiroshi Shimoda</a> of </em><a class="external" href="http://www.clear-code.com/" title="http://www.clear-code.com/"><em>Clear Code Inc.</em></a><em> and was originally published in Japanese for the </em><a class="link-https" href="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English" title="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English"><em>Firefox Developers Conference Summer 2007</em></a><em>. Shimoda-san </em><em>is a co-author of <a class="external" href="http://www.oreilly.co.jp/books/9784873113753/index.html" title="http://www.oreilly.co.jp/books/9784873113753/index.html">Firefox 3 Hacks</a> (O'Reilly Japan, 2008).</em></p>
+<p>Antes de sumergirse en una explicación, rápidamente nos introduciremos en las tecnologías utilizadas para desarrollar extensiones en firefox. Nosotros también conoceremos los conocimientos míminos que se necesitan para desarrollar una extensión para firefox.</p>
+<h2 id="Tecnologías_utilizadas_para_desarrollar_extensiones_para_Firefox">Tecnologías utilizadas para desarrollar extensiones para Firefox</h2>
+<p>Firefox y sus extensiones están ambos basados en el desarrollo con tecnologías ampliamente usadas en la web. Su estructura es similar a la de HTML dynamico usado en algunas páginas webs, or el HTML de aplicaciones usado en Windows. Si tienes experiencia desarrollando HTML dinamico, Tú probablemente lo encontrarás relativamente fácil desarrollar una extensión para Firefox.</p>
+<h2 id="El_rol_de_cada_tecnología">El rol de cada tecnología</h2>
+<p>Firefox está construido en gran parte con cuatro tecnologías: XUL, CSS, Javascript y XPCOM. Las extensiones también están construidas usando esas cuatros tecnologías.</p>
+<p><strong>Figure 1: rol de cada tecnología en firefox.</strong></p>
+<p><img alt="" class="internal" src="/@api/deki/files/3762/=chap2_fig1.png" style="width: 740px; height: 350px;"></p>
+<p>En addition a esas tecnologías, el desarrollo de una extensión requerira que aprendas sobre como otorgar priviligos para vence priviligios de restricciones de seguridad en el código que escribistes, y como insertar tu codigo dentro de Firefox UI. Estos errores son discutidos en el <a class="internal" href="/En/Firefox_addons_developer_guide/Let's_build_a_Firefox_extension" title="En/Firefox addons developer guide/Let's build a Firefox extension">Capítulo 5</a>.</p>
+<h2 id="Conocimientos_básicos_requeridos">Conocimientos básicos requeridos</h2>
+<p>En el interest de brevedad, Vamos a omitir explicaciones de tecnologías, y nos enfocaremos en la introducción de nuevas tecnologías que necesitarás entender para desarrollar para Firefox. Asumimos que tu tienes esperiencia desarrollando con HTML dinamico, así como de los temas a continuación.<br>
+  Para más información sobre estas tecnologías, por favor consulte otras fuentes.</p>
+<ul>
+  <li><a class="internal" href="/en/XML" title="En/XML">XML codificación</a></li>
+  <li><a class="internal" href="/en/CSS" title="En/CSS">CSS coding</a></li>
+  <li><a class="internal" href="/en/JavaScript" title="En/JavaScript">Basic JavaScript syntax</a></li>
+</ul>
+<h3 id="XML_A_text-based_structural_language">XML: A text-based structural language</h3>
+<p> XML, siglas en inglés de <a class="external" href="http://www.w3.org/TR/REC-xml/" title="http://www.w3.org/TR/REC-xml/">eXtensible Markup Language</a> ('lenguaje de marcas extensible'), es un lenguaje de marcas desarrollado por el World Wide Web Consortium (W3C). Deriva del lenguaje SGML y permite definir la gramática de lenguajes específicos (de la misma manera que HTML es a su vez un lenguaje definido por SGML) para estructurar documentos grandes. A diferencia de otros lenguajes XML da soporte a bases de datos, siendo útil cuando varias aplicaciones se deben comunicar entre sí o integrar información. (Bases de datos Silberschatz).</p>
+<p><strong>Listing 1: XML syntax</strong></p>
+<pre class="brush: xml">&lt;elementname someattribute="somevalue"&gt;
+  content
+&lt;/elementname&gt;</pre>
+<p>As shown in Listing 1, XML uses elements, which consist of an opening tag, a closing tag, and content.</p>
+<div class="note" id="footnote2">
+  <strong>Note: </strong>Elements that take no content can be expressed in compact form as <code>&lt;elementname/&gt;.</code></div>
+<p>An element can include other elements as well as text in its content, and all information is structured as a tree. As in all trees, elements can have children (elements contained within them) and parents (elements that contain them). Attributes can also be added to opening tags, each with a value.</p>
+<p>As the "extensible" part of XML implies, elements from various XML-based languages such as XHTML and SVG can be interspersed in one another as a means to extend the language. All elements can carry a "namespace URI" identifier, which is unique for each language. For example, even though XHTML and SVG have elements with the same name, these can be distinguished. The namespace URI for XHTML is <code>"<a class="external" href="http://www.w3.org/1999/xhtml" rel="freelink">http://www.w3.org/1999/xhtml</a>"</code> ; for SVG is it "<code><a class="external" href="http://www.w3.org/2000/svg" rel="freelink">http://www.w3.org/2000/svg</a></code>".</p>
+<h3 id="CSS_A_style_language_to_alter_the_display_of_XML_documents">CSS: A style language to alter the display of XML documents</h3>
+<p>Like XML, Cascading Style Sheets (CSS) is a <a class="external" href="http://www.w3.org/Style/CSS/" title="http://www.w3.org/Style/CSS/">technical specification</a> established by the W3C; it is a style-description language defining the display of data marked up in XML and HTML. As shown in Listing 1, it has an extremely simple syntax. By separating the structure of the data, expressed through HTML or XML, and the display style, indicated by CSS, data can be reused better than it is when structural and stylistic markup are both embedded in HTML.</p>
+<p>There are three CSS specifications (Level 1 through Level 3), with progressively powerful features. The Gecko rendering engine handles nearly all of CSS Level 2 and some of CSS Level 3.</p>
+<p><strong>Listing 2: CSS code sample</strong></p>
+<pre class="brush: css">body {
+  color: black;
+  background-color: white;
+}
+p {
+  margin-bottom: 1em;
+  text-indent: 1em;
+}
+</pre>
+<h3 id="JavaScript_The_world's_most_misunderstood_language">JavaScript: The world's most misunderstood language</h3>
+<p>JavaScript is a scripting language first developed in the 1990s, at which time it was created as a way to add dynamic features to web pages. Because it was often used at first to display pop-up windows, marching text in status bars, or in other ways that made web pages less useful to users, the language acquired a reputation as having little practical use and lacking in functionality.</p>
+<p>Also, because a series of security holes were discovered in JavaScript and the compatible technology JScript, there was an initial reluctance to use JavaScript at all.</p>
+<p>Nevertheless, the rise of web services like Google Maps, which used JavaScript and asynchronous communications, created an awareness of a set of technologies nicknamed <a class="internal" href="/en/AJAX" title="En/AJAX">AJAX</a> (Asynchronous JavaScript and XML); that plus the advent of a number of libraries that paper over implementation differences between different web browsers has more recently led to a re-evaluation of JavaScript as a programming language.</p>
+<p>JavaScript is a prototype-based object-oriented language, and as shown in Listing 3, also permits independent class definitions. It does not have strict typing like Java, making it extremely flexible and giving it qualities that in some senses could be considered similar to Lisp.</p>
+<p>Firefox 3.5 includes a number of extensions to the specification standardized in ECMAScript 3rd Edition, and can use <a class="internal" href="/en/New_in_JavaScript_1.7" title="En/New in JavaScript 1.7">JavaScript 1.7</a> and <a class="internal" href="/en/New_in_JavaScript_1.8" title="En/New in JavaScript 1.8">JavaScript 1.8</a>.</p>
+<p><strong>Listing 3: An example of a class definition in JavaScript</strong></p>
+<pre class="brush: js">function MyClass() {
+}
+MyClass.prototype = {
+  property1 : true,
+  property2 : 'string',
+  method : function() {
+    alert('Hello, world!');
+  }
+};
+var obj = new MyClass();
+obj.method();
+</pre>
+<h3 id="DOM_An_API_for_manipulating_XML_documents">DOM: An API for manipulating XML documents</h3>
+<p>The <a class="internal" href="/en/DOM" title="En/DOM">Document Object Model</a> (DOM) is a <a class="external" href="http://www.w3.org/DOM/" title="http://www.w3.org/DOM/">technical standard</a> promulgated by the W3C, and is an API for manipulating the contents of XML documents as objects. In earlier dynamic HTML approaches, the typical method was to use the <code>innerHTML</code> property of the HTML element node to dynamically change the contents of the HTML document by manipulating strings, but using the DOM makes it possible to manipulate XML documents in a way that better matches JavaScript's object-oriented nature.</p>
+<p>In addition, XUL lacks any equivalent for the <code>innerHTML</code> property, so if it weren’t for the DOM, dynamic processing would be impossible.</p>
+<p>There are a number of levels to the DOM with different levels of functionality. Gecko supports nearly all of DOM Level 2 and some of DOM Level 3.</p>
+<p>With the DOM, the contents of an XML document are handled as a "DOM tree," a collection of element nodes and other nodes. Listing 4 shows an example that deletes the second child element of the element with the "toolbar" id, adds a new button element as a substitute, and sets a label attribute.</p>
+<p>We do not go into the details of the various APIs in the DOM. To learn more about the DOM, please take a look at the <a class="internal" href="/en/XUL_Tutorial/Document_Object_Model" title="En/XUL Tutorial/Document Object Model">MDC documentation</a>.</p>
+<p><strong>Listing 4: An example manipulation using the DOM</strong></p>
+<pre class="brush: js">var bar = document.getElementById('toolbar');
+bar.removeChild(bar.childNodes[1]);
+bar.appendChild(document.createElement('button'));
+bar.lastChild.setAttribute('label', 'Hello!');
+</pre>
+<p>{{ PreviousNext("Firefox addons developer guide/Introduction to Extensions", "Firefox addons developer guide/Introduction_to_XUL—How_to_build_a_more_intuitive_UI") }}</p>
diff --git a/files/es/orphaned/formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio/index.html b/files/es/orphaned/formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio/index.html
new file mode 100644
index 0000000000..ddee8aa094
--- /dev/null
+++ b/files/es/orphaned/formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio/index.html
@@ -0,0 +1,44 @@
+---
+title: Formatos multimedia admitidos por los elementos de audio y video
+slug: orphaned/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio
+tags:
+  - Firefox
+  - HTML5
+  - Multimedia
+  - formatos de audio
+  - formatos multimedia
+  - para_revisar
+original_slug: Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio
+---
+<p>{{ gecko_minversion_header("1.9.1") }}</p>
+<p>Gecko 1.9.1 admite los elementos <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/" title="http://www.whatwg.org/specs/web-apps/current-work/">HTML 5</a> <a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a> y <a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a>, los cuales proporcionan una compatibilidad integrada para la reproducción de medios de audio y video sin necesidad de instalar plug-ins. Este artículo aborda los formatos que son compatibles al implementar Gecko estos elementos .</p>
+<h2 id="Formatos_multimedia_compatibles">Formatos multimedia compatibles</h2>
+<p>Actualmente Gecko admite audio en formato WAVE así como contenedores Ogg con audio codificado en Vorbis y/o video Theora.</p>
+<div class="geckoVersionNote">
+<p>{{ gecko_callout_heading("2.0") }}</p>
+<p>A partir de Gecko 2.0 se admite también el formato de medios WebM. <a class=" external" href="http://www.webmproject.org/" title="http://www.webmproject.org/">WebM</a> usa el códec V8 para video y Vorbis para audio.</p>
+</div>
+<h3 id="Contenedores_WAVE">Contenedores WAVE</h3>
+<p>Gecko admite audio en contenedores WAVE; los archivos de este tipo suelen terminar en la extensión ".wav". Actualmente sólo se admite el códec "1" (PCM) .</p>
+<div class="note"><strong>Nota: </strong>Consulta <a class="external" href="http://www.rfc-editor.org/rfc/rfc2361.txt" title="http://www.rfc-editor.org/rfc/rfc2361.txt">RFC 2361</a> para el registro de códecs WAVE.</div>
+<h4 id="Tipos_MIME_reconocidos_para_audio_WAVE">Tipos MIME reconocidos para audio WAVE</h4>
+<p>Gecko reconoce que los siguientes tipos MIME representan archivos de audio WAVE.</p>
+<ul> <li><code>audio/wave</code> (preferido)</li> <li><code>audio/wav</code></li> <li><code>audio/x-wav</code></li> <li><code>audio/x-pn-wav</code></li>
+</ul>
+<p>{{ h2_gecko_minversion("WebM", 2) }}</p>
+<p><a class=" external" href="http://www.webmproject.org/" title="http://www.webmproject.org/">WebM</a> es un formato nuevo, basado en estándares abiertos, para la presentación de video en la web. Usa VP8 para video y Vorbis para audio, en un contenedor basado en <a class=" external" href="http://corecodec.com/products/matroska" title="http://corecodec.com/products/matroska">Matroska</a>.</p>
+<h4 id="Tipos_MIME_reconocidos_para_medios_WebM">Tipos MIME reconocidos para medios WebM</h4>
+<p>Gecko reconoce que los siguientes tipos MIME representan archivos de medios WebM.</p>
+<dl> <dt><code>video/webm</code></dt> <dd>Un archivo de medios WebM que contiene video (y posiblemente audio también).</dd> <dt><code>audio/webm</code></dt> <dd>Un archivo de medios WebM que contiene solamente audio.</dd>
+</dl>
+<h3 id="Contenedores_Ogg">Contenedores Ogg</h3>
+<p>Gecko también admite contenedores Ogg, que pueden contener audio y/o video. Gecko admite el códec Vorbis para audio Ogg y los códecs Theora y <a class=" external" href="http://wiki.xiph.org/OggYUV" title="http://wiki.xiph.org/OggYUV">OggYUV</a> para video.</p>
+<p>Puedes saber más acerca de la creación de medios Ogg si lees el <a class="external" href="http://en.flossmanuals.net/TheoraCookbook" title="http://en.flossmanuals.net/TheoraCookbook">Theora Cookbook</a>.</p>
+<h4 id="Tipos_MIME_reconocidos_para_medios_Ogg">Tipos MIME reconocidos para medios Ogg</h4>
+<p>Gecko reconoce que los siguientes tipos MIME son archivos Ogg.</p>
+<dl> <dt><code>audio/ogg</code></dt> <dd>Un archivo Ogg que contiene sólo audio.</dd> <dt><code>video/ogg</code></dt> <dd>Un archivo Ogg que contiene video (y posiblemente audio también).</dd> <dt><code>application/ogg</code></dt> <dd>Un archivo Ogg con contenido sin especificar. Es preferible usar uno de los otros dos tipo MIME pero puedes usarlo si no sabes cuáles son los contenidos del archivo.</dd>
+</dl>
+<h2 id="Consulta_también">Consulta también</h2>
+<ul> <li><a class="internal" href="/es/Usando_audio_y_video_en_Firefox" title="Es/Usando audio y video en Firefox">Usar audio y video en Firefox</a></li> <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#media-elements" title="http://www.whatwg.org/specs/web-apps/current-work/#media-elements">Elementos multimedia</a> (especificación HTML 5)</li> <li><code><a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video">video</a></code></li> <li><a class="internal" href="/En/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a></li>
+</ul>
+<p>{{ languages( { "en": "en/Media_formats_supported_by_the_audio_and_video_elements" } ) }}</p>
diff --git a/files/es/orphaned/fragmentos_de_código/index.html b/files/es/orphaned/fragmentos_de_código/index.html
new file mode 100644
index 0000000000..72cd88c7e1
--- /dev/null
+++ b/files/es/orphaned/fragmentos_de_código/index.html
@@ -0,0 +1,14 @@
+---
+title: Fragmentos de código
+slug: orphaned/Fragmentos_de_código
+tags:
+  - Add-ons
+  - extensiones
+  - fragmentos de código
+original_slug: Fragmentos_de_código
+---
+<p>Esta es una lista rápida de fragmentos de código útiles (pequeñas muestras de código) disponible para los desarrolladores de extensiones para las diversas aplicaciones de Mozilla. Muchas de estas muestras también pueden ser usados en aplicaciones XULRunner, así como en el propio código de Mozilla.</p>
+<p>Estos ejemplos demuestran cómo lograr tareas básicas que podrían no ser evidentes a simple vista.</p>
+<h2 id="Browser-oriented_code">Código orientado al Navegador</h2>
+<dl> <dt><a href="/es/Code_snippets/Tabbed_browser" title="es/Code_snippets/Tabbed_browser">Código del navegador con pestañas</a> (Firefox/SeaMonkey)</dt> <dd>Operaciones básicas, tales como la carga de la página en el navegador con pestañas, que es el corazón de las aplicaciones del navegador Mozilla.</dd> <dt>
+</dt></dl>
diff --git a/files/es/orphaned/funciones/index.html b/files/es/orphaned/funciones/index.html
new file mode 100644
index 0000000000..d5e957dcf2
--- /dev/null
+++ b/files/es/orphaned/funciones/index.html
@@ -0,0 +1,9 @@
+---
+title: Funciones
+slug: orphaned/Funciones
+tags:
+  - Funciones
+original_slug: Funciones
+---
+<p>Aquí necesitamos una lista completa de Funciones de XPCOM, algo parecido a la lista de <a href="es/Interfaces">Interfaces</a>.
+</p>
diff --git a/files/es/orphaned/generación_de_guids/index.html b/files/es/orphaned/generación_de_guids/index.html
new file mode 100644
index 0000000000..e4b63d6da7
--- /dev/null
+++ b/files/es/orphaned/generación_de_guids/index.html
@@ -0,0 +1,62 @@
+---
+title: Generación de GUIDs
+slug: orphaned/Generación_de_GUIDs
+original_slug: Generación_de_GUIDs
+---
+<div class="note">(Esta página se encuentra en proceso de traducción - ruego a quién la complete, si no lo hago antes, retirar esta nota de estatus - Ibnkhaldun)</div>
+<p>Los <strong>GUID</strong>s son empleados por los programas integrados en Mozilla para identificar de modo único a una gran variedad de entidades, entre las que se incluyen las <a href="/en/Interfaces" title="en/Interfaces">Interfaces</a> XPCOM (en este caso, la GUID es llamada IID), los componentes (CID), y los "agregados" (add-ons), como <a href="/en/Extensions" title="en/Extensions">extensiones</a> y <a href="/en/Themes" title="en/Themes">temas</a>; no obstante, los "agregados" (add-ons) <a href="/en/Install_Manifests#id" title="en/Install_Manifests#id">pueden (y debieran) ser identificados</a> mediante IDs (identificadores) de la forma <code><a class=" link-mailto" href="mailto:nombreextension@nombreorganizacion.tld" rel="freelink">nombreextension@nombreorganizacion.tld</a></code> a partir de <a href="/en/Firefox_1.5_for_developers" title="en/Firefox_1.5_for_developers">Firefox 1.5</a>.</p>
+<h3 id="Canonical_form" name="Canonical_form">Forma canónica de una GUID</h3>
+<p>La forma usual de una GUID es <code>xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxx</code>, donde cada <code>x</code> corresponde a un dígito hexadecimal (01...9A...F). Y, debe ser única en el mundo dígital. De modo que no importa en que equipo sea instalada la entidad a la que identifica no compita con el identificador de otro objeto o programa instalado en el mismo. Esto quiere decir, que una GUID no puede ser escrita de modo arbitrario, siguiendo el modelo canónico. Debe ser generada por una utilidad (algoritmo) que garantice su unicidad. Sería gravísimo crear un componente o una biblioteca y asignar GUIDs arbitrarias a ella y sus entidades integrantes: al distribuirla e instalarla en otros equipos podría provocar efectos inesperados cuando los programas y utilitarios instalados en los mismos traten de hacer referencia a (o cargar) piezas de software cuyos identificadores se solapan. Existen muchas utilidades que permiten generar GUIDs únicos que se ajustan a la forma canónica. Entre otras:</p>
+<h4 id="Online_tools" name="Online_tools">Herramientas en línea</h4>
+<ul> <li><a class="external" href="http://www.somacon.com/p113.php">Generate GUID Online</a></li> <li><a class="external" href="http://www.famkruithof.net/uuid/uuidgen">UUID (GUID) Generator on the WEB</a></li> <li><a class="external" href="http://mozilla.pettay.fi/cgi-bin/mozuuid.pl">UUID Generator for Mozilla Code</a> (tanto en forma IDL como C++.h)</li> <li>Se puede obtener una GUID desde algunos robots de correo (tales como botbot, firebot) el canal IRC <a class="link-irc" href="irc://irc.mozilla.org/firefox">#firefox</a> enviandoles <code>/msg</code>ing "uuid" .</li>
+</ul>
+<h4 id="Windows" name="Windows">Windows</h4>
+<p>Los usuarios de Windows pueden emplear el utilitario <a class="external" href="http://www.microsoft.com/downloads/details.aspx?FamilyID=94551F58-484F-4A8C-BB39-ADB270833AFC&amp;displaylang=en">GuidGen</a> de Microsoft para obtener una GUID. (esta utilidad de parte de MS Visual C++)</p>
+<h4 id="Linux" name="Linux">Linux</h4>
+<p>Usar <code>/usr/bin/uuidgen</code>. Se encuentra en el paquete <code>libuuid1</code> (Debian).</p>
+<h4 id="Mac_OS_X">Mac OS X</h4>
+<p>Usar <code>/usr/bin/uuidgen</code>.</p>
+<h4 id="Perl" name="Perl">Perl</h4>
+<p><a class="external" href="http://www.johnkeiser.com/mozilla/mozilla_tools.html">jkeiser's Mozilla tools</a> incluye un generador UUID con salidas en los estilos C++ e IDL.</p>
+<h4 id="nsIUUIDGenerator" name="nsIUUIDGenerator">nsIUUIDGenerator</h4>
+<p>Se puede generar un identificador UUID desde código, contando con privilegios de ejecución en Mozilla, utilizando los métodos del objeto <code><a href="/en/XPCOM_Interface_Reference/nsIUUIDGenerator" title="en/nsIUUIDGenerator">nsIUUIDGenerator</a></code>. Ver la página enlazada para obtener detalles.</p>
+<h3 id="COM.2FXPCOM_format" name="COM.2FXPCOM_format">Formato COM/XPCOM</h3>
+<p>Cuando se declaran IIDs y CIDs mediante enunciados  <code>#define</code> en código C++ para Mozilla, suele emplearse el siguiente formato:</p>
+<pre class="eval">// xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxx
+#define NS_...ID \
+{ 0xXXXXXXXX, 0xXXXX, 0xXXXX, \
+  { 0xXX, 0xXX, 0xXX, 0xXX, 0xXX, 0xXX, 0xXX, 0xXX } }
+</pre>
+<p>Para generar código en este formato puede emplearse alguna de las siguientes herramientas.</p>
+<h4 id="Online_tools_2" name="Online_tools_2">Utilidades en línea</h4>
+<ul> <li><a class=" external" href="http://mozilla.pettay.fi/cgi-bin/mozuuid.pl" rel="freelink">http://mozilla.pettay.fi/cgi-bin/mozuuid.pl</a></li>
+</ul>
+<h4 id="guidgen" name="guidgen">guidgen</h4>
+<p><code>guidgen.exe</code>, hace parte de Microsoft Visual Studio, genera UUIDs en este formato.</p>
+<div class="note">(N de T. Los dos párrafos siguientes son poco claros en el original - su traducción es difícil ¿alguna sugerencia? - hace falta un texto que los haga más orientadores - no son una buena ayuda)</div>
+<h4 id="bash" name="bash">bash</h4>
+<p>You can put the following into your <code>.bashrc</code> file:</p>
+<pre>uuidgen-c++()
+{
+       local UUID=$(uuidgen)
+       echo "// $UUID"
+       echo "#define NS__IID \\"
+       echo "{ 0x${UUID:0:8}, 0x${UUID:9:4}, 0x${UUID:14:4}, \\"
+       echo -n "  { 0x${UUID:19:2}, 0x${UUID:21:2}, 0x${UUID:24:2}, "
+       echo -n "0x${UUID:26:2}, 0x${UUID:28:2}, 0x${UUID:30:2}, "
+       echo "0x${UUID:32:2}, 0x${UUID:34:2} } }"
+}
+</pre>
+<h4 id="Perl_2" name="Perl_2">Perl</h4>
+<pre>#!/usr/bin/perl
+$uuid = `uuidgen`;
+chomp $uuid;
+print $uuid, "\n";
+@parts = ($uuid =~ /^(.{8})-(.{4})-(.{4})-(..)(..)-(..)(..)(..)(..)(..)(..)$/);
+print "{ 0x$parts[0], 0x$parts[1], 0x$parts[2], \\", "\n", " { ";
+for (3 .. 9) {
+    print "0x$parts[$_], ";
+}
+print "0x$parts[10] } }", "\n";
+</pre>
+<p>{{ languages( { "fr": "fr/G\u00e9n\u00e9ration_de_GUID", "ja": "ja/Generating_GUIDs", "pl": "pl/Generowanie_GUID" } ) }}</p>
diff --git a/files/es/orphaned/glossary/elemento/index.html b/files/es/orphaned/glossary/elemento/index.html
new file mode 100644
index 0000000000..c9211e2cd4
--- /dev/null
+++ b/files/es/orphaned/glossary/elemento/index.html
@@ -0,0 +1,8 @@
+---
+title: elemento
+slug: orphaned/Glossary/elemento
+tags:
+  - Junk
+original_slug: Glossary/elemento
+---
+<p>Componentes que especifican como los documentos HTML deben ser construidos y que tipo de contenido debe ser posicionado en que lugar de un documento HTML.</p>
diff --git a/files/es/orphaned/guía_para_el_desarrollador_de_agregados_para_firefox/index.html b/files/es/orphaned/guía_para_el_desarrollador_de_agregados_para_firefox/index.html
new file mode 100644
index 0000000000..5b5ec3c4f5
--- /dev/null
+++ b/files/es/orphaned/guía_para_el_desarrollador_de_agregados_para_firefox/index.html
@@ -0,0 +1,24 @@
+---
+title: Guía para el desarrollador de agregados para Firefox
+slug: orphaned/Guía_para_el_desarrollador_de_agregados_para_Firefox
+original_slug: Guía_para_el_desarrollador_de_agregados_para_Firefox
+---
+<p><em><br>
+</em>{{ Next("Firefox addons developer guide/Introduction to Extensions") }}</p>
+<p><a class="internal" href="/es/Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones" title="Es/Guía para el desarrollador de agregados para Firefox/Introducción a las extensiones">Capítulo 1: Introducción a las extensiones</a></p>
+<p><a class="internal" href="/Es/Guía_para_el_desarrollador_de_agregados_para_Firefox/Tecnologías_usadas_en_el_desarrollo_de_extensiones" title="Es/Guía para el desarrollador de agregados para Firefox/Tecnologías usadas en el desarrollo de extensiones">Capítulo 2: Tecnologías usadas para el desarrollo de extensiones<br>
+</a></p>
+<p><a class="internal" href="/En/Firefox_addons_developer_guide/Introduction_to_XUL—How_to_build_a_more_intuitive_UI" title="En/Firefox Addons Dev Guide/Introduction
+to XUL—How to build a more intuitive UI">Chapter 3: Introduction to XUL—How to build a more intuitive UI</a></p>
+<p><a class="internal" href="/En/Firefox_addons_developer_guide/Using_XPCOM—Implementing_advanced_processes" title="En/Firefox addons developer guide/Using
+XPCOM—Implementing advanced processes">Chapter 4: Using XPCOM—Implementing advanced processes</a></p>
+<p><a class="internal" href="/En/Firefox_addons_developer_guide/Let's_build_a_Firefox_extension" title="En/Firefox addons developer guide/Let's
+build a Firefox extension">Chapter 5: Let's build a Firefox extension</a> </p>
+<p><a class="internal" href="/En/Firefox_addons_developer_guide/Firefox_extensions_and_XUL_applications" title="En/Firefox addons developer guide/Firefox
+extensions and XUL applications">Chapter 6: Firefox extensions and XUL applications</a></p>
+<p><a class="internal" href="/En/Firefox_addons_developer_guide/License_authors" title="En/Firefox addons developer guide/License authors"><strong>License and authors</strong></a></p>
+<p>{{ Next("Guía para el desarrollador de agregados para Firefox/Introducción a las extensiones") }}</p>
+<p>{{ languages( { "de" : "de/Firefox_addons_developer_guide", "en" : "en/Firefox_addons_developer_guide" }) }}<em><br>
+</em></p>
+<p><a href="/en:Firefox_addons_developer_guide" title="en:Firefox_addons_developer_guide"><br>
+</a></p>
diff --git a/files/es/orphaned/guía_para_el_desarrollador_de_agregados_para_firefox/introducción_a_las_extensiones/index.html b/files/es/orphaned/guía_para_el_desarrollador_de_agregados_para_firefox/introducción_a_las_extensiones/index.html
new file mode 100644
index 0000000000..4fa2fbf7f4
--- /dev/null
+++ b/files/es/orphaned/guía_para_el_desarrollador_de_agregados_para_firefox/introducción_a_las_extensiones/index.html
@@ -0,0 +1,194 @@
+---
+title: Introducción a las extensiones
+slug: >-
+  orphaned/Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones
+original_slug: >-
+  Guía_para_el_desarrollador_de_agregados_para_Firefox/Introducción_a_las_extensiones
+---
+<p style="text-align: justify;">{{ Draft() }}</p>
+
+<p>{{ PreviousNext("Guía para el desarrollador de agregados para Firefox", "Guía para el desarrollador de agregados para Firefox/Tecnologías usadas en el desarrollo de extensiones") }}</p>
+
+<div class="note"><strong>Nota: </strong>Si desea contribuir en este documento, por favor siga las directivas de la página de <a class="internal" href="/Es/Guía_para_el_desarrollador_de_agregados_para_Firefox/Contribución" title="Es/Guía para el desarrollador de agregados para Firefox/Contribución">Contribución</a>.</div>
+
+<p><em>Este documento fue creado por </em><a class="external" href="http://level.s69.xrea.com/mozilla/" title="http://level.s69.xrea.com/mozilla/"><em>Hideyuki Emura</em></a><em> y fue originalmente publicado en japonés para la </em><a class="link-https" href="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English" title="https://wiki.mozilla.org/Japan/FxDevCon/Summer2007/English"><em>Firefox Developers Conference Summer 2007</em></a><em>. Emura-san es un coautor de <a class="external" href="http://www.oreilly.co.jp/books/9784873113753/index.html" title="http://www.oreilly.co.jp/books/9784873113753/index.html">Firefox 3 Hacks</a> (O'Reilly Japan, 2008.)</em></p>
+
+<h2 id="Introducción">Introducción</h2>
+
+<p>Si estás leyendo esta guía, probablemente ya has usado Firefox. Quizás la primera vez que miraste Firefox, te has sorprendido de ver que tiene una estructura mucho más simple que otros exploradores de amplias funcionalidades, como Opera o Safari.</p>
+
+<p>¿Qué funcionalidades son consideradas estándar en los exploradores web en estos días? Tal vez cosas como controles de pestañas de "granulado fino", gestos con el ratón, botones y barras de herramientas amplias, un lector de fuentes web, integración con una variedad de aplicaciones web, o herramientas sofisticadas para asistir el diseño web. Pero no nos hemos propuesto crear un explorador todo-en-uno que pueda satisfacer a todos.</p>
+
+<p>En su lugar, Firefox puede soportar esas funcionalidades a través de extensiones. El explorador básico está limitado a funcionalidades básicas, así es algo con lo que un principiante se siente cómodo, pero los usuarios que quieren ir más allá pueden instalar extensiones.</p>
+
+<h2 id="Acerca_de_las_extensiones">Acerca de las extensiones</h2>
+
+<h3 id="Manejo_usando_el_administrador_de_complementos">Manejo usando el administrador de complementos</h3>
+
+<p>El administrador de complementos de Firefox es una excelente forma de manejar las extensiones, y es un gran avance es facilidad de uso.</p>
+
+<p><img alt="" class="internal" src="/@api/deki/files/3818/=addons-manager.png" style="height: 462px; width: 563px;"></p>
+
+<p>El administrador de complementos se encarga de las siguientes tareas:</p>
+
+<ul>
+ <li>Instalar y desinstalar complementos de mandera segura</li>
+ <li>Asegurarse de que los complementos sean compatibles con la versión de Firefox en uso</li>
+ <li>Administrar la lista blanca de sitios en los que se confía para instalar complementos</li>
+ <li>Ayudar a solucionar problemas de los complementos deshabilitándolos y ofreciéndolos en modo seguro</li>
+ <li>Confirma y ejecuta actualizaciones</li>
+ <li>Proveé acceso a las ventanas de configuración de complementos</li>
+ <li>Proveé acceso a los sitios de soporte de los complementos</li>
+</ul>
+
+<h3 id="Comodidades_para_el_entorno_de_desarrollo">Comodidades para el entorno de desarrollo</h3>
+
+<p>Inicialmente, no había disponible una documentacíon adecuada, y los desarrolladores de extensiones quedaban en gran medida a su suerte<sup><a href="#footnote1" id="from_footnote1">1</a></sup>; sin embargo, ahora hay una considerable acumulación de conocimientos.</p>
+
+<p>Como Firefox y sus extensiones están diseñados para soportar múltiples idiomas, llegan excelentes ideas de todo el mundo, y pueden ser rápidamente localizadas por cualquier interesado.</p>
+
+<p>Esto disminuye el umbral tanto para el uso como para el desarrollo de extesiones; de hecho, combinado con el rápido crecimiento de la popularidad de Firefox, ha creado un bucle de retroalimentación positiva, con e número de usuarios y desarrolladores de extensiones aumentando explosivamente —actualmente hay más de 7000 extensiones y temas publicados en el sitio de Complementos para Firefox (<a class="link-https" href="https://addons.mozilla.org" rel="freelink">https://addons.mozilla.org</a>).</p>
+
+<h2 id="Qué_puedes_hacer_con_extensiones">Qué puedes hacer con extensiones</h2>
+
+<p>Let's look at what features extensions can add, and some actual examples of extensions.</p>
+
+<h3 id="Extensiones_de_una_sola_función">Extensiones de una sola función</h3>
+
+<p>{{ TODO("Update this") }}.</p>
+
+<p>These are relatively simple extensions that add a single feature.</p>
+
+<dl>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/1939/" title="https://addons.mozilla.org/firefox/1939/">Text Link</a></dt>
+ <dd>Makes it so that double-clicking on an unlinked URL follows that URL.</dd>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/3082/" title="https://addons.mozilla.org/firefox/3082/">Undo Closed Tabs Button</a></dt>
+ <dd>Adds a toolbar button to re-open the most recently closed tabs to the History menu.</dd>
+</dl>
+
+<dl>
+ <dd><img alt="1211576231.png" class="default internal" src="/@api/deki/files/3316/=1211576231.png" style="height: 317px; width: 340px;"></dd>
+</dl>
+
+<dl>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/4014/" title="https://addons.mozilla.org/firefox/4014/">Locationbar</a></dt>
+ <dd>Separa el dominio y la ruta de la URL en la barra de localización para una lectura más fácil.</dd>
+ <dd><img alt="locationbar.png" class="default internal" src="/@api/deki/files/3317/=locationbar.png" style="height: 150px; width: 200px;"></dd>
+</dl>
+
+<h3 id="Feature_enhancing_extensions">Feature enhancing extensions</h3>
+
+<p>{{ TODO("Update this") }}.</p>
+
+<p>Estas extensiones amplían características ya disponibles en Firefox.</p>
+
+<dl>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/1122/" title="https://addons.mozilla.org/firefox/1122/">Tab Mix Plus</a></dt>
+ <dd>Ofrece configuración detallada sobre las pestañas.</dd>
+ <dt><a class="external" href="http://prefbar.mozdev.org/" title="http://prefbar.mozdev.org/">PrefBar</a></dt>
+ <dd>Ofrece acceso a numerosas preferencias sobre la barra de herramientas.<img alt="PrefBar.png" class="default internal" src="/@api/deki/files/3371/=PrefBar.png" style="height: 113px; width: 843px;"></dd>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/722/" title="https://addons.mozilla.org/firefox/722/">NoScript</a></dt>
+ <dd>Enables and disables JavaScript execution on a site-by-site basis.</dd>
+</dl>
+
+<h3 id="Extensiones_de_integración_con_aplicaciones_web">Extensiones de integración con aplicaciones web</h3>
+
+<p>{{ TODO("Update this") }}.</p>
+
+<p>The use the APIs of certain web applications to provide certain pieces of information.</p>
+
+<p><img alt="Forecastfox.png" class="default internal" src="/@api/deki/files/3372/=Forecastfox.png" style="height: 94px; width: 359px;"></p>
+
+<h3 id="New_feature_extensions">New feature extensions</h3>
+
+<p>{{ TODO("Update this") }}.</p>
+
+<p>Extensions can add completely new features to Firefox. This class of extension requires a greater level of knowledge and programming ability.</p>
+
+<dl>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/748/" title="https://addons.mozilla.org/firefox/748/">GreaseMonkey</a></dt>
+ <dt><a class="external" href="http://forums.mozillazine.org/viewtopic.php?t=397735" title="http://forums.mozillazine.org/viewtopic.php?t=397735">UserChrome.js</a></dt>
+ <dd>Both of these provide an environment for running user scripts (JavaScript) in Firefox itself, where the scripts can target specific websites.</dd>
+</dl>
+
+<dl>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/1865/" title="https://addons.mozilla.org/firefox/1865/">Adblock Plus</a></dt>
+ <dd>Blocks the display of unwanted advertisements on web pages.</dd>
+ <dt><a class="link-https" href="https://addons.mozilla.org/firefox/12/" title="https://addons.mozilla.org/firefox/12/">All-in-One Gestures</a></dt>
+ <dd>Adds mouse-gesture functionality.</dd>
+</dl>
+
+<h3 id="Application_level_extensions">Application level extensions</h3>
+
+<p>{{ TODO("Update this") }}.</p>
+
+<p>These are sophisticated extensions that can be considered full-scale applications in their own right, essentially using Firefox as the development platform.</p>
+
+<p><img alt="Firebug.gif" class="default internal" src="/@api/deki/files/3373/=Firebug.gif" style="height: 336px; width: 712px;"></p>
+
+<h3 id="One-trick_gag_extensions">One-trick gag extensions</h3>
+
+<p>{{ TODO("Update this") }}.</p>
+
+<p>There are a number of one-trick gag extensions that aren’t very useful.</p>
+
+<p><img alt="Shiitake Mushroom (1).png" class="default internal" src="/@api/deki/files/3375/=Shiitake%20Mushroom%20(1).png" style="height: 150px; width: 200px;"></p>
+
+<p>This is a very brief survey of a few extensions, but there are many other unique extensions available.</p>
+
+<p><strong>Tabla 1: Métodos avanzados de personalización para Firefox</strong></p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Método de personalización</td>
+   <td class="header">¿Funciona en sitios web?</td>
+   <td class="header">¿Funciona en Firefox?</td>
+  </tr>
+  <tr>
+   <td>Hojas de estilo de usuario (cambia la apariencia a través de CSS)</td>
+   <td>
+    <p>Sí; puedes cambiar el archivo <code>userContent.css</code>, o usar la extensión Stylish.</p>
+   </td>
+   <td>
+    <p>Sí; puedes cambiar el archivo <code>userChrome.css</code>,o usar la extensión Stylish.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Usar scripts (cambia la apariencia y funcionalidad a través de JavaScript)</td>
+   <td>
+    <p>Sí; puedes usar la extensión GreaseMonkey o "bookmarklets."</p>
+   </td>
+   <td>
+    <p>Sí; puedes cambiar <code>userChrome.js</code> para agregar funcionalidades a través de JavaScript.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Extensiones (pueden hacer cualquier cosa)</td>
+   <td>Sí</td>
+   <td>Sí</td>
+  </tr>
+  <tr>
+   <td>Temas (cambian la apariencia del explorador)</td>
+   <td>No</td>
+   <td>Sí</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Construyamos_una_extensión">Construyamos una extensión</h2>
+
+<p>La table 1 muestra varias opciones de personalización disponibles para los usuarios en Firefox. Tienen opciones de personalización flexibles, usando CSS en hojas de estilo de usuario y JavaScript/DOM en scripts de usuario (depende de Stylish, GreaseMonkey, y <code>userChrome.js</code>).</p>
+
+<p>Además de CSS y JavaScript, las extensiones pueden tomar ventaja de las tecnologías XUL y XPCOM para funciones más sofisticadas. Los temas, que alteran la apariencia de Firefox, son una clase de complemento.</p>
+
+<p>Para crear una extensión, neesitas una idea y un poco de habilidades de programación. Los siguientes capítulos explican en detalle las técnicas de escritura de extensiones de algunos de los principales autores de extensiones japoneses. Te alentamos a que pruebes suerta con ellas.</p>
+
+<div class="footnotes">
+<div class="note" id="footnote1"><a href="#from_footnote1">1</a> Uno de los autores de esta edición especial, Piro, es mundialmente conocido como uno de los desarrolladores originales.</div>
+</div>
+
+<dl>
+</dl>
+
+<p>{{ PreviousNext("Guía para el desarrollador de agregados para Firefox", "Guía para el desarrollador de agregados para Firefox/Tecnologías usadas en el desarrollo de extensiones") }}</p>
diff --git a/files/es/orphaned/guía_para_la_migración_a_catálogo/index.html b/files/es/orphaned/guía_para_la_migración_a_catálogo/index.html
new file mode 100644
index 0000000000..355af1a697
--- /dev/null
+++ b/files/es/orphaned/guía_para_la_migración_a_catálogo/index.html
@@ -0,0 +1,177 @@
+---
+title: Guía para la migración a catálogo
+slug: orphaned/Guía_para_la_migración_a_catálogo
+tags:
+  - NeedsContent
+  - Places
+original_slug: Guía_para_la_migración_a_catálogo
+---
+<p>{{ Fx_minversion_header(3) }}
+Este documento es para los desarrolladores de aplicaciones y extensiones que tienen código los API de los marcadores y de el historial es Firefox 2 y anteriores y que están migrando a Firefox 3.
+</p>
+<h2 id="Visi.C3.B3n_general" name="Visi.C3.B3n_general">Visión general</h2>
+<p><a href="es/Cat%c3%a1logo">Catálogo</a> es un conjunto de API para la administración del historial de navegación y los meta datos de las URI. Esto incluye historial, marcadores, pestañas, favicons y anotaciones. Existen dos modelos de identidad en el sistema: URI e identificadores únicos para elementos del sistema de marcadores. Algunos de los API están centrados en URI, mientras que otros usan identificadores de elementos. La firma del API y su contexto, generalmente dejan claro qué modelo se requiere.
+</p>
+<h2 id="Marcadores" name="Marcadores"> Marcadores </h2>
+<p>El servicio del toolkit marcadores es {{ Source("toolkit/components/places/public/nsINavBookmarksService.idl", "nsINavBookmarksService") }}:
+</p>
+<pre>var bookmarks = Cc["@mozilla.org/browser/nav-bookmarks-service;1"].
+                getService(Ci.nsINavBookmarksService);
+</pre>
+<p>EL almacenamiento de los marcadores es jerárquico, sirviendo de modelo a las carpetas y su contenido. Varias carpetas significativas están disponibles como atributos de {{ Interface("nsINavBookmarksService") }}.
+</p>
+<ul><li> nsINavBookmarksService.placesRoot - La carpeta raíz de la jerarquía.
+</li><li> nsINavBookmarksService.bookmarksMenuFolder - El contenido de esta carpeta es visible en el menú Buscadores.
+</li><li> nsINavBookmarksService.toolbarFolder - El contenido de esta carpeta está visible en la barra de herramientas Marcadores.
+</li><li> nsINavBookmarksService.unfiledBookmarksFolder - Los elementos que han sido marcados con una estrella, pero que no están incluidos en ninguna carpeta.
+</li><li> nsINavBookmarksService.tagsFolder - Las sub carpetas de esta carpeta son pestañas y sus hijos son URI que han sido marcadas con ese naombre de carpeta.
+</li></ul>
+<p>Nota: Este documento cubre el servicio de tolkit Catálogo. Sin embargo, los desarrolladores de Firefox pueden aprovechar diversos API de ayuda que son específicos del navegador: </p>
+<ul><li> <a href="es/FUEL">FUEL</a>
+</li><li> {{ Source("browser/components/places/public/nsIPlacesTransactionsService.idl", "nsIPlacesTransactionsService") }}
+</li><li> <a href="es/Utilidades_Javascript_para_Cat%c3%a1logo">Utilidades_Javascript_para_Catálogo</a>
+</li></ul>
+<h3 id="Creaci.C3.B3n" name="Creaci.C3.B3n"> Creación </h3>
+<p>Crear un Marcador
+</p>
+<pre>// create an nsIURI for the URL to be bookmarked.
+var bookmarkURI = Cc["@mozilla.org/network/io-service;1"].
+                  getService(Ci.nsIIOService).
+                  newURI("http://www.mozilla.com", null, null);
+
+var bookmarkId = bookmarks.insertBookmark(
+  bookmarks.toolbarFolder, // El Id de la carpeta donde se guardará el marcador.
+  bookmarkURI,             // La URI del marcador - un objeto nsIURI.
+  bookmarks.DEFAULT_INDEX, // La posición del marcador en su carpeta padre.
+  "my bookmark title");    // El título del marcador.
+</pre>
+<p>Crear una carpeta
+</p>
+<pre>var folderId = bookmarks.createFolder(
+  bookmarks.toolbarFolder, // La id de la carpeta donde se guardará la nueva carpeta.
+  "my folder title",       // El título de la nueva carpeta.
+  bookmarks.DEFAULT_INDEX);    // La posición de la nueva carpeta en su carpeta padre.
+</pre>
+<p>Crear un separador
+</p>
+<pre>var separatorId = bookmarks.insertSeparator(
+  bookmarks.toolbarFolder, // La id de la carpeta donde será puesto el separador.
+  bookmarks.DEFAULT_INDEX);    // La posición del separador en su carpeta padre.
+</pre>
+<p>Crear un marcador dinámico
+</p>
+<pre>var IOService = Cc["@mozilla.org/network/io-service;1"].
+                  getService(Ci.nsIIOService);
+
+var siteURI = IOService.newURI("http://www.mozilla.com", null, null);
+var feedURI = IOService.newURI("http://www.mozilla.org/news.rdf", null, null);
+
+var livemarks = Cc["@mozilla.org/browser/livemark-service;2"].
+                getService(Ci.nsILivemarkService);
+
+livemarks.createLivemark(bookmarks.toolbarFolder, // La id de la carpeta donde será almacenado el marcador dinámico
+  "My Livemark Title",        // El título del marcador dinámico
+  siteURI,                    // La URI del sitio. Un objeto nsIURI.
+  feedURI,                    // La URI del Canal. Un objeto nsIURI.
+  bookmarks.DEFAULT_INDEX);   // La posición del marcador dinámico en su carpeta padre.
+</pre>
+<h3 id="Lectura" name="Lectura"> Lectura </h3>
+<h4 id="Propiedades_de_los_elementos" name="Propiedades_de_los_elementos">Propiedades de los elementos</h4>
+<p>Para todos los elementos:
+</p>
+<ul><li> String getItemTitle(aItemId) - XXX
+</li><li> Int64 getItemIndex(aItemId) - XXX
+</li><li> PRTime getItemType(aItemId) - XXX
+</li><li> PRTime getItemDateAdded(aItemId) - XXX
+</li><li> PRTime getItemLastModified(aItemId) - XXX
+</li><li> Int64 getFolderIdForItem(aItemId) - Devuelve la id de la carpeta que contienen el elemento dado.
+</li><li> String getItemGUID(aItemId) - Devuelve un identificador global único del elemento. Esto se usa principalmente en las extensiones, para sincronizar los datos de los marcadores entre diferentes perfiles.
+</li></ul>
+<p>Para marcadores:
+</p>
+<ul><li> nsIURI getBookmarkURI(aItemId) - XXX
+</li><li> String getKeywordForBookmark(aItemId) - XXX
+</li></ul>
+<p>Para carpetas:
+</p>
+<ul><li> Int64 getChildFolder(aFolderId, aSubfolderTitle) - Devuelve la id de la primera sub carpeta que coincide con el título dado.
+</li><li> Int64 getIdForItemAt(aFolderId, aPosition) - Devuelve la id del elemento en la posición determinada .
+</li><li> Bool getFolderReadonly(aFolderId)
+</li></ul>
+<h4 id="Contenido_de_las_carpetas" name="Contenido_de_las_carpetas">Contenido de las carpetas</h4>
+<p>Las consultas en Catálogo se ejecutan a través del servicio principal de historial. El ejemplo siguiente, muestra como listar el contenido de una carpeta de Marcadores y cómo acceder a las propiedades de cada elemento.
+</p>
+<pre>var history = Cc["@mozilla.org/browser/nav-history-service;1"].
+              getService(Ci.nsINavHistoryService);
+var query = history.getNewQuery();
+query.setFolders([myFolderId], 1);
+
+var result = history.executeQuery(query, history.getNewQueryOptions());
+
+// La propiedad raíz del resultado de una consulta es un objeto representando la carpeta que especificaste.
+var folderNode = result.root;
+
+// Abre la carpeta y actúa reiterativamente con su contenido.
+folderNode.containerOpen = true;
+for (var i=0; i &lt; folderNode.childCount; ++i) {
+  var childNode = folderNode.getChild(i);
+
+  // Algunas propiedades del elemento.
+  var title = childNode.title;
+  var id = childNode.itemId;
+  var type = childNode.type;
+
+  // Algunas acciones específicas del tipo.
+  if (type == Ci.nsINavHistoryResultNode.RESULT_TYPE_URI) {
+
+    var uri = childNode.uri;
+
+  }
+  else if (type == Ci.nsINavHistoryResultNode.RESULT_TYPE_FOLDER) {
+
+    childNode.QueryInterface(Ci.nsINavHistoryContainerResultNode);
+    childNode.containerOpen = true;
+    // ahora puedes actuar reiterativamente sobre el 'hijo' de una carpeta.
+
+  }
+}
+</pre>
+<p>Hay documentación sobre otros tipos de nodo disponible en <a class="external" href="http://mxr.mozilla.org/seamonkey/source/toolkit/components/places/public/nsINavHistoryService.idl">IDL</a>.
+</p>
+<h4 id="B.C3.BAsqueda" name="B.C3.BAsqueda">Búsqueda</h4>
+<h3 id="Actualizaci.C3.B3n" name="Actualizaci.C3.B3n">Actualización</h3>
+<p>Para todos los elementos:
+</p>
+<ul><li> setItemTitle(aItemId, aTitle) - Cambia el título de un elemento.
+</li><li> setItemIndex(aItemId, aIndex) - Cambia la posición de un elemento. NOTA: este no cambia los indices de toda la carpeta - para una solución administrada, usa moveItem.
+</li><li> setItemDateAdded(aItemId, aDateAdded) - Ajusta la fecha en que fue añadido el elemento por primera vez, en micro segundos.
+</li><li> setItemLastModified(aItemId, aLastModified) - Ajusta la fecha en que fue añadido el elemento por última vez, en micro segundos.
+</li><li> setItemGUID(aItemId, aGUID) - Devuelve un identificador global único del elemento. Esto se usa principalmente en las extensiones, para sincronizar los datos de los marcadores entre diferentes perfiles.
+</li><li> moveItem (aFolderId, aNewParentId, aIndex) - Mueve un elemento de una carpeta a otra.
+</li></ul>
+<p>Para marcadores:
+</p>
+<ul><li> changeBookmarkURI(aItemId, aURI) - Cambia la URI del marcador.
+</li><li> setKeywordForBookmark(aItemId, aKeyword) - Ajusta la palabra-clave para el marcador.
+</li></ul>
+<h3 id="Borrado" name="Borrado">Borrado</h3>
+<ul><li> Elementos
+</li><li> Contenedores
+</li></ul>
+<h3 id="Observar" name="Observar">Observar </h3>
+<h3 id="Importar.2FExportar_en_formato_HTML" name="Importar.2FExportar_en_formato_HTML">Importar/Exportar en formato HTML</h3>
+<h3 id="Respaldo.2FRestauraci.C3.B3n" name="Respaldo.2FRestauraci.C3.B3n">Respaldo/Restauración</h3>
+<h3 id="Nuevo" name="Nuevo">Nuevo</h3>
+<ul><li> Pestañas
+</li><li> Anotaciones
+</li><li> Búsquedas guardadas
+</li><li> Contenedores dinámicos
+</li></ul>
+<h2 id="Historia" name="Historia">Historia</h2>
+<h3 id="Agregar" name="Agregar">Agregar</h3>
+<h3 id="Consultas" name="Consultas">Consultas</h3>
+<h3 id="Observar_2" name="Observar_2">Observar</h3>
+<h3 id="Nuevo_2" name="Nuevo_2">Nuevo</h3>
+<div class="noinclude">
+</div>
+{{ languages( { "es": "es/Lugares/Gu\u00eda_para_migraci\u00f3n_con_lugares", "fr": "fr/Guide_de_migration_vers_Places", "ja": "ja/Places/Migration_Guide", "en": "en/Places_migration_guide" } ) }}
diff --git a/files/es/orphaned/herramientas/index.html b/files/es/orphaned/herramientas/index.html
new file mode 100644
index 0000000000..39b4e4d3f5
--- /dev/null
+++ b/files/es/orphaned/herramientas/index.html
@@ -0,0 +1,14 @@
+---
+title: Herramientas
+slug: orphaned/Herramientas
+tags:
+  - Herramientas
+  - para_revisar
+original_slug: Herramientas
+---
+<p> </p>
+<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Web_Development"><span><span style="">Desarrollo web</span></span></h4> <h5 id="Extensions"><span><span style="">Extensiones</span></span></h5> <dl> <dt><span><a href="/en/Venkman" title="en/Venkman"><span style="">Venkman</span></a></span></dt> <dd><span><span style="">El depurador JavaScript proporciona un potente entorno de depuración de JavaScript para navegadores basados ​​en Mozilla.</span></span></dd> </dl> <dl> <dt><a href="/en/DOM_Inspector" title="en/DOM_Inspector"><span><span style="">Inspector DOM</span></span></a></dt> <dd><span><span style="">Una herramienta de desarrollo utilizada para inspeccionar, examinar y modificar el DOM de documentos - normalmente páginas web o ventanas XUL.</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1843" title="https://addons.mozilla.org/en-US/firefox/addon/1843"><span><span style="">Firebug</span></span></a></dt> <dd><span><span style="">Integra una gran cantidad de herramientas de desarrollo para editar, depurar y monitorear CSS, HTML y JavaScript en vivo en cualquier página web ( <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.getfirebug.com%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNEyc4EzUXofVv9S_vhAmGQUczkTSw">detalles</a> )</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/60" title="https://addons.mozilla.org/en-US/firefox/addon/60"><span><span style="">Web Developer</span></span></a></dt> <dd><span><span style="">Agrega un menú y una barra de herramientas al navegador con varias herramientas de desarrollo web. ( <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fchrispederick.com%2Fwork%2Fweb-developer%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHJ8M44D_i_pGIzwqlkNOrImQNU2w">detalles</a> )</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/4111" title="https://addons.mozilla.org/en-US/firefox/addon/4111"><span><span style="">Aardvark</span></span></a></dt> <dd><span><span style="">Revela los elementos DOM mientras se mueve el ratón/mouse sobre una página. ( <a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.karmatics.com%2Faardvark%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHv0RxPV-ntEr1Fan_wylejOyhf6g">detalles</a> )</span></span></dd> </dl> <dl> <dt><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/browse/type:1/cat:4" title="https://addons.mozilla.org/en-US/firefox/browse/type:1/cat:4"><span><span style="">Más sobre Firefox Add-ons</span></span></a></dt> </dl> <h5 id="Validators"><span><span style="">Validadores</span></span></h5> <dl> <dt><a href="/en/Tools/Validators" title="en/Tools/Validators"><span><span style="">Lista de validadores</span></span></a></dt> </dl> <h5 id="Authoring_Software"><span><span style="">Software de creación</span></span></h5> <dl> <dt><a href="/en/Standards-Compliant_Authoring_Tools" title="en/Standards-Compliant_Authoring_Tools"><span><span style="">Herramientas de creación que cumplen con los estándares </span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://tidy.sourceforge.net/" title="http://tidy.sourceforge.net/"><span><span style="">HTMLTidy</span></span></a></dt> <dd><span><span style="">Una herramienta para limpiar HTML</span></span></dd> </dl> </td> <td> <h4 id="JavaScript"><span><span style="">JavaScript</span></span></h4> <table class="topicpage-table"> <tbody> <tr> <td> <dl> <dt><a href="/en/Tools/Scratchpad" title="en/Tools/Scratchpad"><span><span style="">Borrador</span></span></a>{{ gecko_minversion_inline ("6.0") }}</dt> <dd><span><span style="">Un editor de texto integrado en Firefox que te permite editar y ejecutar código JavaScript.</span></span></dd> <dt><a href="/en/Error_Console" title="en/Error_Console"><span><span style="">Consola de errores</span></span></a></dt> </dl> <dl> <dt><a href="/en/Venkman" title="en/Venkman"><span><span style="">Venkman</span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://www.jslint.com/" title="http://www.jslint.com/"><span><span style="">JSLint</span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://jsdoc.sourceforge.net/" title="http://jsdoc.sourceforge.net/"><span><span style="">JSDoc</span></span></a></dt> <dd><span><span style="">herramienta para la generación de documentación (generalmente HTML) a partir de los comentarios de código (similar a JavaDoc).</span></span></dd> </dl> <h4 id="DOM"><span><span style="">DOM</span></span></h4> <dl> <dt><a href="/en/DOM_Inspector" title="en/DOM_Inspector"><span><span style="">Inspector DOM</span></span></a></dt> </dl> <dl> <dt><a class="external" href="http://slayeroffice.com/tools/modi/v2.0/modi_help.html" title="http://slayeroffice.com/tools/modi/v2.0/modi_help.html"><span><span style="">MODI</span></span></a></dt> <dd><span><span style="">Mouseover DOM Inpector es un bookmarklet que te permite ver y manipular el DOM de una página web con sólo pasar el ratón/mouse por el documento.</span></span></dd> </dl> <h4 id="Localization"><span><span style="">Localización</span></span></h4> <dl> <dt><a class="external" href="http://www.mozilla.org/projects/l10n/mlp_tools.html" title="http://www.mozilla.org/projects/l10n/mlp_tools.html"><span><span style="">Herramientas de localización y aprovechamiento</span></span></a></dt> </dl> <h4 id="Tree_and_branch_management"><span><span style="">Gestión de árboles y ramas</span></span></h4> <dl> <dd><a href="../en/Using_cross_commit" title="en/Using_cross_commit"><code>cross-commit</code> script</a></dd> </dl> <h4 id="User_Profile_Tools"><span><span style="">Herramientas de perfil de usuario</span></span></h4> <div><strong><a href="/en/Profile_Manager" title="en/Profile_Manager"><span><span style="">Profile Manager</span></span></a></strong></div> <h4 id="Navegar_por_el_código_base_de_Mozilla"><span><span style="">Navegar por el código base de Mozilla</span></span></h4> <p><span><span style=""><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fmxr.mozilla.org%2F&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNGrg4dzGorguMnILmPWPgZEabuZdw">MXR</a><a class="external" href="http://mxr.mozilla.org/" title="http://mxr.mozilla.org/"> </a>(si utilizas vim, mxr-vim acelera el proceso)</span></span></p> <p><a class="external" href="http://dxr.mozilla.org/clang/" title="http://dxr.mozilla.org/clang/"><span><span style="">DXR</span></span></a></p> <dl> <dt> </dt><dd> </dd></dl> </td> </tr> </tbody> </table> </td> </tr> </tbody>
+</table>
+<p><span><span><span style="">Categorías</span></span></span></p>
+<p><span><span><span style="">Interwiki Language Links</span></span></span></p>
+<p><span><span style="">{{ languages( { "en": "en/Tools", "fr": "fr/Outils", "ja": "ja/Tools", "pl": "pl/Narz\u0119dzia" } ) }}</span></span></p>
diff --git a/files/es/orphaned/html/elemento/datalist/index.html b/files/es/orphaned/html/elemento/datalist/index.html
new file mode 100644
index 0000000000..1c7a3f193f
--- /dev/null
+++ b/files/es/orphaned/html/elemento/datalist/index.html
@@ -0,0 +1,8 @@
+---
+title: datalist
+slug: orphaned/HTML/Elemento/datalist
+tags:
+  - HTML5
+original_slug: HTML/Elemento/datalist
+---
+<p>Redirigir <a class="redirect" href="/es/docs/Web/HTML/Elemento/datalist">datalist</a></p>
diff --git a/files/es/orphaned/html/elemento/form/index.html b/files/es/orphaned/html/elemento/form/index.html
new file mode 100644
index 0000000000..c48886a39f
--- /dev/null
+++ b/files/es/orphaned/html/elemento/form/index.html
@@ -0,0 +1,6 @@
+---
+title: form
+slug: orphaned/HTML/Elemento/form
+original_slug: HTML/Elemento/form
+---
+<p>a</p>
diff --git a/files/es/orphaned/html/elemento/section/index.html b/files/es/orphaned/html/elemento/section/index.html
new file mode 100644
index 0000000000..9c52b4916d
--- /dev/null
+++ b/files/es/orphaned/html/elemento/section/index.html
@@ -0,0 +1,178 @@
+---
+title: Section
+slug: orphaned/HTML/Elemento/section
+original_slug: HTML/Elemento/section
+---
+<div class="geckoVersionNote">
+<h2 id="DEFINICIÓN" style="margin-left: 40px;">DEFINICIÓN:</h2>
+</div>
+
+<h4 id="La_etiqueta_section_proviene_del_idioma_inglés_y_se_traduce_al_español_como_sección.">La etiqueta section proviene del idioma inglés y se traduce al español como sección.</h4>
+
+<p> </p>
+
+<div class="geckoVersionNote">
+<h2 id="ETIQUETAS" style="margin-left: 40px;">ETIQUETAS: </h2>
+</div>
+
+<h4 id="&lt;section>&lt;section>">&lt;section&gt;&lt;/section&gt;</h4>
+
+<h4 id="Genera_una_sección_de_contenido_en_el_cuál_podemos_ubicar_dentro_muchos_otros_tipos_de_sección_(nav_article_asideheaderfooter_etc).">Genera una sección de contenido, en el cuál podemos ubicar dentro muchos otros tipos de sección (nav, article, aside,header,footer, etc).</h4>
+
+<p> </p>
+
+<div class="geckoVersionNote">
+<h2 id="ATRIBUTOS" style="margin-left: 40px;">ATRIBUTOS:</h2>
+</div>
+
+<table class="fullwidth-table standard-table">
+ <thead>
+  <tr>
+   <th scope="col" style="text-align: center;">
+    <h4 id="Atributo"><strong>Atributo</strong></h4>
+   </th>
+   <th colspan="2" scope="col" style="text-align: center;">
+    <h4 id="Valor"><strong>Valor</strong></h4>
+   </th>
+   <th scope="col" style="text-align: center;">
+    <h4 id="Descripción"><strong>Descripción</strong></h4>
+   </th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4">
+    <h4 id="Genéricos"><strong>Genéricos</strong></h4>
+   </th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title </code></td>
+   <td>Texto</td>
+   <td>Implícito</td>
+   <td>Título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style </code></td>
+   <td>Declaraciones de estilo</td>
+   <td>Implícito</td>
+   <td>Información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id </code></td>
+   <td>Un 'nombre'</td>
+   <td>Implícito</td>
+   <td>Identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class </code></td>
+   <td>Lista de clases CSS</td>
+   <td>implícito</td>
+   <td>Identificador a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir </code></td>
+   <td>Uno de los siguientes: <code>"ltr"</code> o <code>"rtl"</code></td>
+   <td>Implícito</td>
+   <td>Dirección del texto.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang </code></td>
+   <td>Código de idioma</td>
+   <td>Implícito</td>
+   <td>Información sobre el idioma.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">
+    <h4 id="Específicos"><strong>Específicos</strong></h4>
+   </th>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;"> onload, onunload.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">
+    <h4 id="De_transición"><strong>De transición</strong></h4>
+   </th>
+  </tr>
+  <tr>
+   <th>
+    <h4 id="atributo"><strong>atributo</strong></h4>
+   </th>
+   <th colspan="2" rowspan="1">
+    <h4 id="valor"><strong>valor</strong></h4>
+   </th>
+   <th>
+    <h4 id="descripción"><strong>descripción</strong></h4>
+   </th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">background </code></td>
+   <td>Una dirección</td>
+   <td>Implícito</td>
+   <td>Dirección de la imagen que se usará como fondo.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">bgcolor </code></td>
+   <td>Un color</td>
+   <td>Implícito</td>
+   <td>Color del fondo.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">text </code></td>
+   <td>Un color</td>
+   <td>Implícito</td>
+   <td>Color del texto.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">link </code></td>
+   <td>Un color</td>
+   <td>Implícito</td>
+   <td>Indica el color inicial de los enlaces</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">alink </code></td>
+   <td>Un color</td>
+   <td>Implícito</td>
+   <td>Indica el color de los enlaces cuando están activos.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">vlink </code></td>
+   <td>Un color</td>
+   <td>Implícito</td>
+   <td>Indica el color de los enlaces que han sido visitados.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval  language-html"><code class="language-html">
+   &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+        "http://www.w3.org/TR/html4/strict.dtd"&gt;
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
+           <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>title</span><span class="punctuation token">&gt;</span></span>Documento html básico<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>title</span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
+
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
+
+        &lt;section&gt;
+          &lt;article&gt;
+   <span class="tag token"><span class="tag token"><span class="punctuation token">          &lt;</span>p</span><span class="punctuation token">&gt;</span></span>Ejemplo de texto1<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;
+          &lt;/article&gt;
+  <code class="language-html">       &lt;article&gt;
+   <span class="tag token"><span class="tag token"><span class="punctuation token">          &lt;</span>p</span><span class="punctuation token">&gt;</span></span>Ejemplo de texto2<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;
+          &lt;/article&gt;</span></span></code>
+        &lt;/section&gt;
+
+        &lt;section&gt;
+<code class="language-html"><span class="tag token"><span class="punctuation token">  <code class="language-html">       &lt;article&gt;
+   <span class="tag token"><span class="tag token"><span class="punctuation token">          &lt;</span>p</span><span class="punctuation token">&gt;</span></span>Ejemplo de texto3 en un segundo artículo <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;
+          &lt;/article&gt;</span></span></code></span></span></code>
+<code class="language-html"><span class="tag token"><span class="punctuation token">       &lt;/section&gt;</span></span></code></span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span>
+ </code></pre>
diff --git a/files/es/orphaned/incrustando_mozilla/comunidad/index.html b/files/es/orphaned/incrustando_mozilla/comunidad/index.html
new file mode 100644
index 0000000000..305a0e9c71
--- /dev/null
+++ b/files/es/orphaned/incrustando_mozilla/comunidad/index.html
@@ -0,0 +1,8 @@
+---
+title: Comunidad
+slug: orphaned/Incrustando_Mozilla/Comunidad
+original_slug: Incrustando_Mozilla/Comunidad
+---
+<p>este comentario considero esta fuera dl tema pero queria saber  si hay proceso para instala firefox os en iphone</p>
+
+<p> </p>
diff --git a/files/es/orphaned/instalación_de_motores_de_búsqueda_desde_páginas_web/index.html b/files/es/orphaned/instalación_de_motores_de_búsqueda_desde_páginas_web/index.html
new file mode 100644
index 0000000000..764197c8ac
--- /dev/null
+++ b/files/es/orphaned/instalación_de_motores_de_búsqueda_desde_páginas_web/index.html
@@ -0,0 +1,34 @@
+---
+title: Instalación de motores de búsqueda desde páginas web
+slug: orphaned/Instalación_de_motores_de_búsqueda_desde_páginas_web
+tags:
+  - Plugins_de_búsqueda
+original_slug: Instalación_de_motores_de_búsqueda_desde_páginas_web
+---
+<p>Firefox permite que código de JavaScript instale plugins de motores de búsqueda, los formatos de plugin que soporta son: MozSearch, OpenSearch, y Sherlock.
+</p><p>Cuando el código JavaScript intenta instalar un plugin de búsqueda, Firefox muestra una alerta que pide al usuario permiso para instalarlo.
+</p>
+<h2 id="Instalaci.C3.B3n_de_plugins_MozSearch_y_OpenSearch"> Instalación de plugins MozSearch y OpenSearch </h2>
+<p>Para instalar plugin MozSearch o OpenSearch, es necesario usar el método DOM <code>window.external.AddSearchProvider()</code>. La sintaxis para este método es:
+</p>
+<pre class="eval">window.external.AddSearchProvider(<i>engineURL</i>);
+</pre>
+<p>Donde <i>engineURL</i> es el URL del archivo XML del plugin del motor de búsqueda.
+</p>
+<div class="note"><b>Nota</b>: el soporte a OpenSearch y MozSearch está disponible sólo en Firefox 2 y superior.</div>
+<p>Para más detalles sobre MozSearch, lease <a href="es/Creaci%c3%b3n_de_plugins_MozSearch">Creación de plugins MozSearch</a>.
+</p>
+<h2 id="Instalaci.C3.B3n_de_plugins_Sherlock"> Instalación de plugins Sherlock </h2>
+<p>Para instalar un plugin Sherlock, hay que llamar a <code>window.sidebar.addSearchEngine()</code>, la sintaxis para hacerlo es:
+</p>
+<pre class="eval">window.sidebar.addSearchEngine(<i>engineURL</i>, <i>iconURL</i>, <i>suggestedName</i>, <i>suggestedCategory</i>);
+</pre>
+<ul><li> El parámetro <code>engineURL</code> es el URL del plugin Sherlock a instalar (un archivo ".src").
+</li><li> <code>iconURL</code> es el URL del icono asociado al plugin.
+</li><li> El parámetro <code>suggestedName</code> sólo es usado cuando se le pide permiso al usuario para instala el plugin, de modo que pueda mostrarse un mensaje del tipo "¿Desea instalar <i>suggestedName</i> desde <i>engineURL</i>?".
+</li><li> El parámetro <code>suggestedCategory</code> no se usa. Se debería especificar una cadena vacía (<code>""</code>) o <code>null</code>.
+</li></ul>
+<p>Para más detalles sobre Sherlock, visite <a class=" external" href="http://developer.apple.com/macosx/sherlock/">http://developer.apple.com/macosx/sherlock/</a>
+</p><p><span class="comment">Categorías</span>
+</p><p><span class="comment">interwiki links</span>
+</p>{{ languages( { "en": "en/Adding_search_engines_from_web_pages", "ca": "ca/Addici\u00f3_de_motors_de_cerca_a_les_p\u00e0gines_web", "it": "it/Installare_plugin_di_ricerca_dalle_pagine_web", "ja": "ja/Adding_search_engines_from_web_pages" } ) }}
diff --git a/files/es/orphaned/learn/how_to_contribute/index.html b/files/es/orphaned/learn/how_to_contribute/index.html
new file mode 100644
index 0000000000..7c67556d6c
--- /dev/null
+++ b/files/es/orphaned/learn/how_to_contribute/index.html
@@ -0,0 +1,89 @@
+---
+title: ¿Cómo contribuir al Área de Aprendizaje en MDN?
+slug: orphaned/Learn/How_to_contribute
+tags:
+  - Aprender
+  - Documentación
+  - Guía
+  - MDN Meta
+  - Principiante
+  - contribuir
+  - l10n:priority
+translation_of: Learn/How_to_contribute
+original_slug: Learn/Como_Contribuir
+---
+<div>{{LearnSidebar}}</div>
+
+<p><br>
+ <span style="line-height: 1.5;">Si estás aqui, es probable que sea porque estas interesado en contribuir al área de aprendizaje de MDN. ¡Una noticia estupenda!</span></p>
+
+<p><span class="seoSummary">En esta página encontrarás todo lo que necesitas para comenzar ayudando a mejorar el contenido de aprendizaje en MDN. Hay muchas cosas que puedes hacer, dependiendo de cuanto tiempo tienes y de si eres <a href="/en-US/Learn/How_to_contribute#I'm_a_beginner">principiante</a>, <a href="/en-US/Learn/How_to_contribute#I'm_a_web_developer">desarrollador web</a>, o <a href="/en-US/Learn/How_to_contribute#I'm_a_teacher">profesor</a>.</span></p>
+
+<div class="note">
+<p><strong>Nota:</strong> Si ya eres colaborador de MDN, no dudes en volver a revisar la <a href="/en-US/docs/MDN/Doc_status/Learn">página de status de la documentación</a> para mantener un seguimiento del trabajo que se ha realizado y observar cuáles son nuestras prioridades de escritura.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota:</strong> Los colaboradores usan<a href="https://trello.com/b/LDggrYSV"> tableros de Trello</a> para organizar sus actividades. Si quieres usarlos, no tienes más que <a href="https://trello.com/signup">crearte una cuenta de Trello </a>y avisar a <a href="/en-US/docs/MDN/Contribute/Drivers_and_curators">Jeremie</a> para que te deje editar el tablero.</p>
+</div>
+
+<h2 id="Soy_principiante">Soy principiante</h2>
+
+<p>¡Genial! Los principiantes son muy importantes y valiosos para crear y dar retroalimentación sobre el material de aprendizaje. Tú tienes una perspectiva única sobre estos artículos como miembro de la audiencia a la que están dirigidos, lo cual puede convertirte en un miembro de incalculable valor para nuestro equipo. De hecho, si estás aprendiendo algo de uno de nuestros artículos y te encuentras atascado, o tienes las sensación de que el artículo es algo confuso, puedes modificarlo tú mismo o simplemente informarnos para que podamos resolverlo.</p>
+
+<p>Colaborar es un gran modo de divertirse mientras se aprenden cosas nuevas. Si alguna vez te sientes perdido o tienes algunas preguntas, no dudes en contactarnos a través de <a href="/en-US/docs/MDN/Community#Join_our_mailing_lists">nuestra lista de correo </a>o <a href="/en-US/docs/MDN/Community#Get_into_IRC">nuestro canal IRC</a> (ve al final de la página para más detalles).</p>
+
+<p>A continuación puedes encontrar algunas formas de las que puedes contribuir:</p>
+
+<dl>
+ <dt><a href="/en-US/docs/MDN/Contribute/Howto/Tag">Añade etiquetas a nuestros artículos</a> (<em>5 min</em>)</dt>
+ <dd>Etiquetar contenido de MDN es una de las formas más sencillas de contribuir a MDN. Como muchas de las características de nuestra plataforma usan etiquetas para ayudar a presentar la información en contexto, la ayuda con el etiquetado es una contribución muy valiosa. Echa un vistazo a la lista de <a href="/en-US/docs/MDN/Doc_status/Glossary#No_tags">entradas del glosario</a> y a los <a href="/en-US/docs/MDN/Doc_status/Learn#No_tags">artículos de aprendizaje</a> sin etiquetas para comenzar.</dd>
+ <dt><a href="/en-US/docs/Glossary">Lee y revisa una entrada de glosario</a> (<em>15 min</em>)</dt>
+ <dd>Como principiante, necesitamos que tu vista fresca revise nuestro contenido. Si encuentras alguna entrada del glosario difícil de entender, significa que hay que mejorarla. No dudes en realizar cualquier cambio que estimes oportuno. Si crees que no tienes las habilidades adecuadas para editar la entrada, puedes contactarnos <span style="line-height: 1.5;">a través de </span><a href="/en-US/docs/MDN/Community#Join_our_mailing_lists" style="line-height: 1.5;">nuestra lista de correo</a>.</dd>
+ <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">Escribe una nueva entrada de glosario </a>(<em>1 hora</em>)</dt>
+ <dd>Esta es la forma más eficaz de aprender algo nuevo. Elige un concepto que quieras comprender y, mientras aprendes, escribe una entrada del glosario sobre dicho concepto. Explicar algo a otros es un buen modo de "fijar" el conocimiento a tu cerebro y de ayudarte a darle sentido a las cosas. Todo mientras ayudas a otras personas. ¡Gana todo el mundo!</dd>
+ <dt><a href="/en-US/Learn/Index">Lee y revisa un artículo de aprendizaje</a> (<em>2 horas</em>)</dt>
+ <dd>Esto es bastante similar a revisar entradas del glosario (ver arriba); aunque lleva más tiempo, ya que estos artículos son un poco más largos.</dd>
+</dl>
+
+<h2 id="Soy_desarrollador_web">Soy desarrollador web</h2>
+
+<p>¡Fantástico! Tus habilidades técnicas son justo lo que necesitamos para asegurarnos de que proporcionamos contenido técnicamente preciso para los principiantes. Como esta parte específica de MDN está dedicada al aprendizaje de la web, asegúrate de explicar las cosas de la forma más sencilla posible. Pero procura no pasarte de sencillez, ya que entonces el contenido deja de ser útil. Es más importante que se comprenda a que sea innecesariamente preciso.</p>
+
+<dl>
+ <dt><a href="/en-US/docs/Glossary">Lee y revisa una entrada de glosario</a> (<em>15 min</em>)</dt>
+ <dd>Como desarrollador web, te necesitamos para asegurarnos de que nuestro contenido es técnicamente correcto sin ser demasiado pedante. No dudes en realizar cualquier cambio que creas necesario. Si quieres debatir sobre el contenido antes de editarlo, danos un toque<span style="line-height: 1.5;"> </span><a href="/en-US/docs/MDN/Community#Join_our_mailing_lists" style="line-height: 1.5;">a nuestra lista de correo</a> o al <a href="/en-US/docs/MDN/Community#Get_into_IRC">canal IRC</a>.</dd>
+ <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">Escribe una nueva entrada de glosario</a> (<em>1 hora</em>)</dt>
+ <dd>Clarificar nuestra jerga técnica es un muy buen modo de aprender y ser técnicamente preciso y simple. La gente con menos experiencia te lo agradecerá. Tenemos <a href="/en-US/docs/Glossary#Contribute">muchos términos indefinidos</a> que necesitan tu atención. Escoge uno y listo.</dd>
+ <dt><a href="/en-US/Learn/Index">Lee y revisa un artículo de aprendizaje</a> (<em>2 horas</em>)</dt>
+ <dd>Esto es lo mismo que revisar entradas del glosario (ver arriba); aunque lleva un poco más de tiempo, ya que estos artículos son un poco más largos.</dd>
+</dl>
+
+<dl>
+ <dt><a href="/en-US/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web">Escribe un nuevo artículo de aprendizaje</a> (<em>4 horas</em>)</dt>
+ <dd>En MDN hacen falta artículos sencillos y prácticos sobre el uso de tecnologías web (<a href="/en-US/docs/Learn/CSS">HTML</a>, <a href="/en-US/docs/Learn/CSS">CSS</a>, <a href="/en-US/docs/Learn/JavaScript">JavaScript</a>, etc). Incluso tenemos contenido viejo en MDN que merece ser revisado y reformado. Lleva tus habilidades al límite para lograr que las tecnologías web puedan ser utilizadas incluso por principiantes.</dd>
+ <dt><a href="/en-US/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">Crea ejercicios, ejemplos de código o herramientas de aprendizaje interactivo</a> (<em>? horas</em>)</dt>
+ <dd>Todos nuestros artículos de aprendizaje requieren lo que nosotros llamamos materiales de "aprendizaje activo", porque la gente aprende mejor haciendo las cosas por sí mismos. Materiales como ejercicios o contenido interactivo que ayude a los usuarios a aplicar y manejar los conceptos detallados en un artículo. Hay muchas formas de crear contenido de aprendizaje activo, desde crear ejemplos de código con <a href="http://jsfiddle.net" rel="external">JSFiddle</a> o similares, hasta crear contenido interactivo completamente hackeable con <a href="https://thimble.webmaker.org/" rel="external">Thimble</a>. ¡Libera tu creatividad!</dd>
+</dl>
+
+<h2 id="Soy_profesor">Soy profesor</h2>
+
+<p>MDN tiene un largo historial de excelencia técnica, pero necesitamos ayuda para mostrar el camino a los principiantes en conceptos técnicos. Aqué es donde entras tú, como profesor o educador. Puedes ayudarnos a asegurar que nuestro material se provee de forma adecuada y práctica para nuestros lectores.</p>
+
+<dl>
+ <dt><a href="/en-US/docs/Glossary">Lee y revisa una entrada en el glosario</a> (<em>15 min</em>)</dt>
+ <dd>Comprueba una entrada en el glosario y siéntete libre de hacer todos los cambios que creas que son necesarios. Si quieres discutir el contenido antes de editarlo, danos un toque en nuestra <a href="/en-US/docs/MDN/Community#Join_our_mailing_lists" style="line-height: 1.5;">lista de correo </a> or <a href="/en-US/docs/MDN/Community#Get_into_IRC">Canal de chat IRC</a>.</dd>
+ <dt><a href="/docs/MDN/Contribute/Howto/Write_a_new_entry_in_the_Glossary">Escribir una nueva entrada de glosario</a> (<em>1 hora</em>)</dt>
+ <dd><span id="result_box" lang="es"><span>Las definiciones simples y claras de los términos y las descripciones básicas de los conceptos en el glosario son fundamentales para satisfacer las necesidades de los principiantes.</span> <span>Su experiencia como educador puede ayudar a crear excelentes entradas de glosario;</span> <span>tenemos</span></span>  <a href="/en-US/docs/Glossary#Contribute">muchos terminos indefinidos</a> que necesitan de su atención. Escoge uno y ve por él.</dd>
+ <dt><a href="/en-US/docs/tag/needsSchema">Añadir ilustraciones y/o esquemas a los artículos</a> (<em>1 hora</em>)</dt>
+ <dd>Como ya sabrás, Las ilustraciones son parte invaluable de cualquier contenido de aprendizaje. Esto es algo que generalmente falta en MDN y tus habilidades pueden haer la diferencia en esta área. Mira en los <a href="/en-US/docs/tag/needsSchema">artículos que le falan contenido ilustrativo</a> y escoge uno al que te gustaría crearle los gráficos.</dd>
+ <dt><a href="/en-US/Learn/Index">Leer y revisar un artículo de aprendizaje</a> (<em>2 horas</em>)</dt>
+ <dd><span id="result_box" lang="es"><span>Esto es similar a revisar las entradas del glosario (ver arriba), pero requiere más tiempo ya que los artículos son bastante más largos</span></span> .</dd>
+ <dt><a href="/en-US/docs/MDN/Contribute/Howto/Write_an_article_to_help_learn_about_the_Web">Escribir un nuevo artículo de aprendizaje</a> (<em>4 horas</em>)</dt>
+ <dd><span id="result_box" lang="es"><span title="We need simple, straightforward articles about the Web ecosystem and other functional topics around it.">Necesitamos artículos simples y directos sobre el ecosistema web y otros temas funcionales a su alrededor. </span><span title="Since these learning articles need to be educational rather than trying to literally cover everything there is to know, your experience in knowing what to cover and how will be a great asset.
+">Dado que estos artículos de aprendizaje deben ser educativos en lugar de tratar de cubrir literalmente todo lo que hay que saber, su experiencia en saber qué cubrir y cómo será una gran ventaja</span></span>.</dd>
+ <dt><a href="/en-US/docs/MDN/Contribute/Howto/Create_an_interactive_exercise_to_help_learning_the_web">Crear ejercicios, cuestionarios o herramientas interactivas de aprendizaje</a> (<em>? horas</em>)</dt>
+ <dd><span id="result_box" lang="es"><span title='All our learning articles require what we call "active learning" materials.'>Todos nuestros artículos de aprendizaje requieren lo que llamamos materiales de "aprendizaje activo". </span><span title="Such materials are exercises or interactive content which help a user learn to use and expand upon the concepts detailed in an article.">Dichos materiales son ejercicios o contenido interactivo que ayudan al usuario a aprender a usar y ampliar los conceptos detallados en un artículo. </span><span title="There are lots of things you can do here, from creating quizzes to building fully hackable interactive content with Thimble.">Aquí puede hacer muchas cosas, desde crear concursos hasta crear contenido interactivo completamente pirateable con</span></span>  <a href="https://thimble.webmaker.org/" rel="external">Thimble</a>. Da rienda suelta a tu creatividad!</dd>
+ <dt><a href="/en-US/docs/MDN/Contribute/Howto/Create_learning_pathways">Crea rutas de aprendizaje</a> (<em>? horas</em>)</dt>
+ <dd><span id="result_box" lang="es"><span title="In order to provide progressive and comprehensible tutorials, we need to shape our content into pathways.">Con el fin de proporcionar tutoriales progresivos y comprensibles, tenemos que dar forma a nuestro contenido en rutas. </span><span title="It's a way to gather existing content and figure out what is missing to create a learning article to write">Es una forma de recopilar contenido existente y descubrir lo que falta para crear un artículo de aprendizaje para escribir</span></span> .</dd>
+</dl>
diff --git a/files/es/orphaned/learn/html/forms/html5_updates/index.html b/files/es/orphaned/learn/html/forms/html5_updates/index.html
new file mode 100644
index 0000000000..064aebe5dd
--- /dev/null
+++ b/files/es/orphaned/learn/html/forms/html5_updates/index.html
@@ -0,0 +1,45 @@
+---
+title: Formularios en HTML5
+slug: orphaned/Learn/HTML/Forms/HTML5_updates
+tags:
+  - HTML
+  - HTML5
+  - formulários
+  - para_revisar
+translation_of: Learn/HTML/Forms/HTML5_updates
+original_slug: HTML/HTML5/Formularios_en_HTML5
+---
+<p>{{ gecko_minversion_header("2") }}</p>
+<p>Los elementos y atributos para formularios en HTML5 proveen un mayor grado de marcado semántico que en HTML4 y eliminan gran parte del tedioso trabajo de programación y diseño que se necesitaba en HTML4. Las funcionalidades de los formularios en HTML5 brindan una mejor experiencia para los usuarios al permitir que estos tengan un comportamiento más coherente entre diferentes sitios web y proporcionar una retroalimentación inmediata acerca de la información ingresada. Asimismo, proporcionan esta experiencia a los usuarios que han deshabilitado el javascript en sus navegadores.</p>
+<p>Este documento describe los elementos nuevos o modificados que están disponibles en Gecko/Firefox.</p>
+<h3 id="El_elemento_&lt;input>">El elemento <code>&lt;input&gt;</code></h3>
+<p>El elemento <code>{{ HTMLElement("input") }}</code> tiene nuevos valores para el atributo {{ htmlattrxref("type", "input") }}.</p>
+<ul> <li><span style="font-family: Courier New;">search</span>: El atributo representa un campo de búsqueda. Los saltos de línea son automáticamente eliminados del valor ingresado pero no se modifica ninguna otra sintaxis.</li> <li><span style="font-family: Courier New;">tel</span>: El atributo representa un control para editar un número de teléfono. Los saltos de línea son automáticamente eliminados del valor ingresado pero no se modifica ninguna otra sintaxis, ya que los números telefónicos varían enormemente en todo el mundo. Puedes usar atributos como {{ htmlattrxref("pattern", "input") }} y {{ htmlattrxref("maxlength", "input") }} para restringir los valores ingresados en el campo.</li> <li><span style="font-family: Courier New;">url</span>: El atributo representa un control para editar una <a class=" external" href="http://es.wikipedia.org/URL" title="http://es.wikipedia.org/URL">URL</a>. Se eliminan los saltos de línea y espacios en blanco antes y después del valor ingresado.</li> <li> <p><span style="font-family: Courier New;">email</span>: El atributo representa una dirección de correo electrónico. Los saltos de línea se eliminan automáticamente del valor ingresado. Puede ingresarse una dirección de correo no válida, pero el campo de ingreso sólo funcionará si la dirección  satisface la producción ABNF <span style="font-family: Courier New;"><code><code title="">1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )</code></code></span> donde <code title="">atext</code> está definida en RFC 5322, sección 3.2.3 y <code title="">ldh-str</code> está definida en RFC 1034, sección 3.5.</p> <div class="note">Nota: si el atributo {{ htmlattrxref("multiple", "input") }} está incluido, pueden ingresarse muchas direcciones de correo electrónico en ese campo {{ HTMLElement("input") }}, como una lista separada por comas, pero no está implementado actualmente en Firefox.</div> </li>
+</ul>
+<p>El elemento {{ HTMLElement("input") }} también tiene nuevos atributos:</p>
+<ul> <li>{{ htmlattrxref("list", "input") }}: el id. de un elemento {{ HTMLElement("datalist") }} cuyo contenido, los elementos {{ HTMLElement("option") }}, van a ser usados como ayudas y serán mostrados como propuestas en el área de sugerencias del campo input.</li> <li>{{ htmlattrxref("pattern", "input") }}: una expresión regular respecto a la cual se comprueba el valor del control, que puede ser usada con valores de {{ htmlattrxref("type", "input") }} de <code>text</code>, <code>tel</code>, <code>search</code>, <code>url</code> y <code>email</code>.</li> <li>{{ htmlattrxref("formmethod", "input") }}: una cadena que indica qué método HTTP (GET, POST, PUT o DELETE) debe ser usado cuando se envía; sobrescribe el {{ htmlattrxref("method", "form") }} del elemento {{ HTMLElement("form") }}, si se define. El {{ htmlattrxref("formmethod", "input") }} sólo se aplica cuando el {{ htmlattrxref("type", "input") }} es <span style="font-family: Courier New;">image</span> o <span style="font-family: Courier New;">submit</span>.</li> <li>{{ htmlattrxref("x-moz-errormessage", "input") }} {{ non-standard_inline() }}: una cadena que se muestra como un mensaje de error si el campo no logra validarse. Es una extensión de Mozilla.</li> </ul>
+<h3 id="El_elemento_&lt;form>">El elemento <code>&lt;form&gt;</code></h3>
+<p>El elemento {{ HTMLElement("form") }} tiene un nuevo atributo:</p>
+<ul> <li>{{ htmlattrxref("novalidate", "form") }}: este atributo evita que el formulario sea validado antes del envío.</li>
+</ul><h3 id="El_elemento_&lt;datalist>">El elemento <code>&lt;datalist&gt; </code></h3>
+<p>El elemento {{ HTMLElement("datalist") }} representa la lista de elementos {{ HTMLElement("option") }} como sugerencias cuando se llena un campo {{ HTMLElement("input") }}.</p>
+<p>Puedes usar el atributo {{ htmlattrxref("list", "input") }} en un elemento {{ HTMLElement("input") }} para enlazar a un campo de ingreso específico con un elemento {{ HTMLElement("datalist") }} determinado.</p>
+<h3 id="El_elemento_&lt;output>">El elemento <code>&lt;output&gt;</code></h3>
+<p>El elemento <code>{{ HTMLElement("output") }}</code> representa el resultado de un cálculo.</p>
+<p>Puedes usar el atributo {{ htmlattrxref("for", "output") }} para especificar una relación entre el elemento output y otros elementos en el documento que afectan el cálculo (por ejemplo, ingreso de datos o parámetros). El valor del atributo {{ htmlattrxref("for", "output") }} es una lista separada por espacios de identificadores de otros elementos.</p><h3 id="El_atributo_placeholder">El atributo placeholder</h3>
+<p>El atributo {{ htmlattrxref("placeholder", "input") }} en elementos <code>{{ HTMLElement("input") }}</code> y <code>{{ HTMLElement("textarea") }}</code> proporciona una ayuda a los usuarios acerca de qué debe ingresarse en el campo. El texto introducido en el placeholder no debe contener retornos de carro o saltos de línea.</p><h3 id="El_atributo_autofocus">El atributo autofocus</h3>
+<p>El atributo {{ htmlattrxref("autofocus", "input") }} te permite especificar que una parte del formulario debe tener foco para ingresar información cuando se carga la página, a menos que el usuario lo cambie, por ejemplo al escribir en otro lugar. Sólo un elemento del formulario en un documento puede tener el atributo <code>autofocus</code>, que es booleano. Este atributo puede ser aplicado a los elementos <code>{{ HTMLElement("input") }}</code>, <code>{{ HTMLElement("button") }}</code>, <code>{{ HTMLElement("select") }}</code> y <code>{{ HTMLElement("textarea") }}</code>. La excepción es que <code>autofocus</code> no puede aplicarse a un elemento <code>&lt;input&gt;</code> si el atributo {{ htmlattrxref("type", "input") }} <code>hidden</code> está seleccionado (es decir, no puede enfocar automáticamente un elemento escondido).</p><h3 id="La_propiedad_label.control_del_DOM">La propiedad label.control del DOM</h3>
+<p>La interface <a href="/en/DOM/HTMLLabelElement" title="en/DOM/HTMLLabelElement">HTMLLabelElement</a> DOM brinda una propiedad extra, sumadas a las propiedades que corresponden a los atributos del elemento <code>{{ HTMLElement("label") }}</code> de HTML. La propiedad <strong>control</strong> devuelve el controlador etiquetado, es decir, el controlador para el que está hecha la etiqueta, que está determinado por el atributo {{ htmlattrxref("for", "label") }} (si está definido) o por el primer elemento controlador descendiente.</p><h3 id="Validación_restringida">Validación restringida</h3>
+<p>El HTML5 brinda sintaxis y elementos de API para posibilitar la validación de formularios del lado del cliente. Aunque esta funcionalidad no reemplaza la validación del lado del servidor, que todavía es necesaria por seguridad e integridad de la información, la validación del lado del cliente puede brindar una experiencia de usuario mejor al darle al usuario una respuesta inmediata acerca de la información ingresada.</p>
+<p>Si se ajusta el atributo <code>title</code> al elemento {{ HTMLElement("input") }}, esa cadena se mostrará en una ventana emergente de ayuda cuando falle la validación. Si <code>title</code> se ajusta a una cadena vacía, no se mostrará ninguna ventana emergente. Si el atributo <code>title</code> no se configura, en su lugar se mostrará el mensaje de validación estándar (como especifica el atributo {{ htmlattrxref("x-moz-errormessage") }} o llamando al método <code>setCustomValidity()</code>).</p>
+<div class="note"><strong>Note:</strong> la validación restringida no es compatible con los elementos {{ HTMLElement("button") }} en un formulario; si quieres aplicar estilo a un botón basado en la validez del formulario asociado, usa la seudoclase {{ cssxref(":-moz-submit-invalid") }}.</div>
+<h4 id="Sintaxis_de_HTML_para_la_validación_restringida">Sintaxis de HTML para la validación restringida</h4>
+<p>Los siguientes elementos de sintaxis de HTML5 pueden ser usados para restringir datos en el formulario.</p>
+<ul> <li>El atributo {{ htmlattrxref("required", "input") }} en los elementos {{ HTMLElement("input") }}, {{ HTMLElement("select") }} y {{ HTMLElement("textarea") }} indica que se debe ingresar algún dato. (En el elemento {{ HTMLElement("input") }}, {{ htmlattrxref("required", "input") }} solo se aplica con ciertos valores del atributo {{ htmlattrxref("type", "input") }}.)</li> <li>El atributo {{ htmlattrxref("pattern", "input") }} en el elemento {{ HTMLElement("input") }} restringe el valor para que concuerde con una expresión regular específica.</li> <li>Los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }} del elemento {{ HTMLElement("input") }} restringen los valores máximos y mínimos que pueden ser ingresados.</li> <li>El atributo {{ htmlattrxref("step", "input") }} del elemento {{ HTMLElement("input") }} (cuando se usa en combinación con los atributos {{ htmlattrxref("min", "input") }} y {{ htmlattrxref("max", "input") }}) restringe la granularidad de los valores ingresados. Un valor que no se corresponda con un valor permitido no será validado.</li> <li>El atributo {{ htmlattrxref("maxlength", "input") }} de los elementos {{ HTMLElement("input") }} y {{ HTMLElement("textarea") }} restringe el máximo número de caracteres (en puntos de código unicode) que el usuario puede ingresar.</li> <li>Los valores <code>url</code> y <code>email</code> para {{ htmlattrxref("type", "input") }} restringen el valor para una URL o dirección de correo válida respectivamente.</li>
+</ul>
+<p>Además, puedes evitar la validación restringida especificando el atributo {{ htmlattrxref("novalidate", "form") }} en el elemento {{ HTMLElement("form") }}, o el atributo {{ htmlattrxref("formnovalidate", "button") }} en el elemento {{ HTMLElement("button") }} y en el elemento {{ HTMLElement("input") }} (cuando {{ htmlattrxref("type", "input") }} es <code>submit</code> o <code>image</code>). Estos atributos indican que el formulario no será validado cuando se envie.</p><h4 id="API_de_validación_restringida">API de validación restringida</h4>
+<p>Las siguientes propiedades y métodos del DOM relacionadas con la validación restringida están disponibles para scripts del lado del cliente:</p>
+<ul> <li>En objetos <code><a href="/en/DOM/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a></code> el método <code>checkValidity()</code>, que devuelve verdadero si todos los elementos asociados del formulario que necesitan validación satisfacen las restricciones, y falso si no lo hacen,</li> <li>En <a href="/en/HTML/Content_categories#form-associated" title="en/HTML/Content Categories#form-associated">elementos asociados al formulario</a>: <ul> <li>la propiedad <code>willValidate</code>, que es falso si el elemento no satisface las restricciones.</li> <li>la propiedad <code>validity</code>, que es un objeto <code><a href="../../../../en/DOM/ValidityState" rel="internal">ValidityState</a></code> que representa los estados de validación en que está el elemento (p. ej., condiciones de restricción que han fallado o exitosas).</li> <li>la propiedad <code>validationMessage</code>, que es un mensaje que contiene todas las fallas o errores en las restricciones que pertenecen a ese elemento.</li> <li>el método <code>checkValidity()</code>, que devuelve falso si el elemento no logra satisfacer alguna de las restricciones, o verdadero si pasa lo contrario.</li> <li>el método <code>setCustomValidity()</code>, que establece un mensaje de validación personalizado, permitiendo imponer y validad restricciones más allá de las que están predefinidas.</li> </ul> </li>
+</ul>
+<p>{{ languages({"en": "en/HTML/HTML5/Forms_in_HTML5", "ja": "ja/HTML/HTML5/Forms_in_HTML5"}) }}</p>
+<p>{{ HTML5ArticleTOC() }}</p>
diff --git a/files/es/orphaned/localizar_con_narro/index.html b/files/es/orphaned/localizar_con_narro/index.html
new file mode 100644
index 0000000000..86afb27001
--- /dev/null
+++ b/files/es/orphaned/localizar_con_narro/index.html
@@ -0,0 +1,63 @@
+---
+title: Localizar con Narro
+slug: orphaned/Localizar_con_Narro
+tags:
+  - Localization:Tools
+  - l10n
+  - narro
+original_slug: Localizar_con_Narro
+---
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Narro es una práctica herramienta web de traducción que está disponible para los localizadores de los proyectos de Mozilla. Con Narro puedes traducir las aplicaciones de Mozilla en linea y exportando los archivos en ficheros .ZIP o generando archivos .XPI (paquete de idioma) los cuales pueden ser instalados localmente para ser probados. Después de la creación de un proyecto Narro utiliza la “Memoria de traducción” (MT) de tus traducciones para aprovechar el contenido ya traducido.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">La función MT te permite centrarte en las nuevas cadenas sin traducir y no enfocandote en la re-traducción de las cadenas de las versiones previamente traducidas.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Este documento te guiará por el proceso de la creación de una nueva localización y proyecto en Narro. Usando Firefox como ejemplo, vamos a cubrir la forma en como iniciar un proyecto en Narro, como usar Narro para traducir la aplicación y como exportar tus traducciones para pruebas localmente en Firefox.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para aprender acerca de las actualizaciones y cambios del proyecto Narro vista el </span><a class=" external" href="http://narro-project.blogspot.com/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">proyecto Narro</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y el sitio de la </span><a class=" link-https" href="https://l10n.mozilla-community.org/narro/projects.php?l=bg"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">herramienta basada en web.</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> A continuación encontrarás que son un requisito previo para localizar en Narro.</span></p>
+<p> </p>
+<h2 id="Registrándose_en_Narro">Registrándose en Narro</h2>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Antes de hacer cualquier otra cosa en Narro, es necesario configurar tu cuenta de usuario. Al hacer clic en el enlace en la esquina superior derecha de la página de inicio Narro te llevará a donde puedas registrar tu cuenta de usuario. Una vez que hayas registrado y conectado, podrás ver todos los diferentes lugares disponibles para trabajar en en el menú desplegable en la esquina superior derecha.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para nuestros ejemplos, vamos a llamar a nuestra nueva localización  X-prueba. Realiza los siguientes pasos para configurar tu nueva localización.</span></p>
+<p><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Alternativamente, si tu localización no existe, ponte en contacto con tu </span><a class=" link-https" href="https://wiki.mozilla.org/Category:L10n_Teams"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">comunidad l10n</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y pregunta acerca de cómo puedes participar!</span></p>
+<ol> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Contacta con los administradores de l10n Mozilla l10n utilizando la </span><a href="/es/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">lista de distribución dev-l10n</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> para preguntar si  tu localización ya existe.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Si no existe, envía un correo electrónico a  </span><a href="/es/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">dev-l10n lista de correo</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y solicita al administrador de Narro para iniciar una nueva localización en Narro para tu localización. En tu mensaje, por favor proporciona la siguiente información:</span> <ul> <li style="list-style-type: disc; font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">       tu nombre de usuario.</span></li> <li style="list-style-type: disc; font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">       tu idioma.</span></li> <li style="list-style-type: disc; font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">       un regalo. Los productos recién horneados son siempre un buen regalo ;).</span></li> </ul> Alternativamente, si tu localización no existe, ponte en contacto con tu comunidad l10n y pregunta acerca de cómo puedes participar!</li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Después de hacer esto, debes recibir los derechos de mantenimiento (es decir, exportación, importación y permisos de aprobación) para la nueva localización.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Después de recibir estos derechos, salir y entrar de nuevo para activarlos.</span></li>
+</ol>
+<p><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">La imagen de abajo es la pantalla que verá una vez que se conecte a activar sus derechos de mantenimiento.</span></p>
+<p><a href="/@api/deki/files/5836/=manage_a_locale.png"><img alt="" class="internal default" src="/@api/deki/files/5836/=manage_a_locale.png" style="width: 1053px; height: 576px;"></a></p>
+<p> </p>
+<h2 id="Importar">Importar</h2>
+<div class="note">Nota: Si ya te has unido a algún proyecto de localización existente, puedes saltarte este paso. Es decir, a menos que estés interesado en aprender acerca de cómo funciona la utilidad de importación, en tal caso continua con este paso..</div>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Cuenta de usuario creada: Listo. Proyecto de localización creada por el administrador global: Listo. Activado los derechos de mantenimiento para tu nueva localización: Listo. ¡Felicidades, ya estás listo para importar los archivos fuentes del proyecto Firefox!. La utilidad de importación ubicada en la pestaña Import de tu proyecto Firefox, te dará varias opciones para la importación de archivos para la traducción. ¡Lo bueno de esta utilidad es que es completamente automática!. Tú solo tienes que importar manualmente los archivos fuentes y luego nunca más tienes que preocuparte por hacer esto. La utilidad de importación importa los archivos cada noche, de modo que si tu cadena fué agregada o modificada durante el día la seguirás viendo en tu lista de no traducidos hasta el día siguiente.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Ahora vamos a repasar cómo configurar la utilidad de importación en tu proyecto.</span></p>
+<p> </p>
+<ol> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> Verás una lista de enlaces de proyectos inactivos con varios nombres (</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Firefox Aurora</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">, </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Firefox Release</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">, etc.) Hazle clic en el enlace del proyecto que tu quieras activar. En este caso le hacemos clic en </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Firefox Aurora</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Por defecto, está tomada la pestaña de descripción del proyecto. Navega a la etiqueta </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Import </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">para encontrar la utilidad de importación.</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Una vez ahí, encontarás estas secciones de importación:</span> <ul> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Texts.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para importar los archivos fuentes (por ejemplo desde en-US).</span></li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Translations.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para la importación de proyectos ya existentes</span>.</li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Options.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Casillas de verificación para configurar la importación</span>.</li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Operation log.- </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Descripción de la función de Importación que está siendo ejecutada.</span></li> </ul> </li> <li><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Por ahora nos vamos a centrar solo en las secciones </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Texts </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">y</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> Options. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En la sección </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Texts </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">verás la localización por defecto con los archivos fuente actualizados cada noche por tu proyecto. Asegurate de que las casillas de verificación en </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Options </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">están destiqueadas para esta importación.</span></li> <li>C<span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">lic en el botón </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Import. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">El </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Operation log </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">mostrará un mensaje una vez que la importación haya sido completada satisfactoriamente.</span></li>
+</ol>
+<p><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En la imágen de abajo es lo que deberás ver cuando se complete la importación.</span></p>
+<p><a href="/@api/deki/files/5828/=Import.png"><img alt="" class="internal default" src="/@api/deki/files/5828/=Import.png" style="width: 984px; height: 532px;"></a></p>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">¡¡Ahora ya estás listo para comenzar a traducir tu proyecto!!</span></p>
+<p> </p>
+<h2 id="Traducción">Traducción</h2>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Con la nueva localización entablecida en Narro, tu puedes ahora iniciar la traducción en linea. Una forma rápida de iniciar es hacer clic en la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Translate </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">y te llevará a una pantalla con un conjunto de contenido sin traducir. Las nuevas importaciones de Firefox Aurora (como Firefox 7) contiene 5,671 cadenas en Inglés.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Irónicamente, la primera vez que comienzas a traducir podrás ver las primeras entradas algunos de los archivos </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">region.properties </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">ese archivo </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: italic; font-variant: normal; text-decoration: none; vertical-align: baseline;">no debe ser traducido</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> usando Narro. Encontrarás algunas de esas entradas a medida que avanza en la traducción. Una buena guía para ayudarte a distinguir entre las cadenas traducibles y lo no-traducibles es ver si la cadena puede ser categorizada como uno de los siguientes:</span></p>
+<ul> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Si es el nombre de un producto, no se traduce.</span></li> <li>C<span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">ualquier cadena con código puro (ej. %s), no se traduce.</span></li>
+</ul>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Cualquier cadena que no caiga dentro de esas dos categorias es traducible. Avanzar con las cadenas traducibles para iniciar la traducción.</span></p>
+<p><a href="/@api/deki/files/5832/=Texts.png"><img alt="" class="internal default" src="/@api/deki/files/5832/=Texts.png" style="width: 1106px; height: 608px;"></a></p>
+<p><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para el ejemplo de este documento empezaremos a buscar las cadenas de dos diferentes tipos de archivos (los archivos DTD y archivos property). Vamos a hacer cambios a las cadenas de modo que podrás ver el cambio en la interfaz de usuario.</span></p>
+<h3 id="Ejemplo_1_Los_archivos_DTD_searchbar.dtd">Ejemplo 1: Los archivos DTD, "searchbar.dtd"</h3>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Narro te permite buscar cadenas en particular. Para este ejemplo buscaremos el archivo DTD (a menudo se llama una entidad) llamado </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">searchbar.dtd </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">que contiene la cadena </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines... </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Tu puedes </span><span style="font-size: 12pt; font-family: Arial; color: #333333; background-color: #f5f5f5; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">encontrar fácilmente esta cadena en la interfaz de usuario del navegador al hacer clic en el menú desplegable en el cuadro de búsqueda en la esquina superior derecha de tu navegador. Echa un vistazo a la imagen de abajo. En la parte inferior de la lista de botones de búsqueda que aparece podrás ver </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines...</span></p>
+<p><a href="/@api/deki/files/5837/=Add_%25252525S.png"><img alt="" class="internal default" src="/@api/deki/files/5837/=Add_%25252525S.png"></a></p>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Así es como podrás usar Narro para traducir el elemento </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines...</span></p>
+<p dir="ltr" style="text-indent: 36pt; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">1. Navega en la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Translate </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">dentro del proyecto Firefox Aurora.</span></p>
+<p dir="ltr" style="text-indent: 36pt; margin-top: 0pt; margin-bottom: 0pt;"><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">2. Ingresa la cadena “Manage Search Engines... ” en el campo </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Search for</span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y da clic en </span><span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Search.</span></p>
+<p><br> <span style="font-size: 11pt; font-family: Arial; color: #333333; background-color: #ffffff; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Después de ingresar en la cadena y haciendo clic en “Search”, Narro te muestra la cadena que estabas buscando.</span></p>
+<p><a href="/@api/deki/files/5833/=Manage_Search_Engines.png"><img alt="" class="internal default" src="/@api/deki/files/5833/=Manage_Search_Engines.png" style="width: 1109px; height: 250px;"></a></p>
+<p style="margin-left: 40px;"><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">3. Clic en el cuadro de texto debajo del resultado de búsqueda. Esto ampliará el cuadro de texto y lo resaltará en verde para mostrar el registro activo.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">4. Entra en la traducción y presiona el botón save.</span></p>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En el ejemplo de abajo verás el elemento  </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Manage Search Engines... </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">que ha sido traducido a </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">MANAGE SEARCH ENGINES</span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Verás también debajo del ícono de guardado que existen dos cadenas adicionales. Estos son mostrados desde una traducción anterior y desde otras traducciones que miembros de tu comunidad pueden haber proporcionado. Los botones verdes y rojos a la derecha te permiten aprobar o eliminar una traducción de la entrada activa. Una traducción aprobada es introducida en la memoria de traducción. No recomendamos aprobar traducciones hasta que estén en su estado final. Para nuestro ejemplo guardas la cadena haciendo clic en el ícono de guardado verde que está a la derecha.</span></p>
+<p><a href="/@api/deki/files/5831/=approved_translation.png"><img alt="" class="internal default" src="/@api/deki/files/5831/=approved_translation.png" style="width: 1109px; height: 345px;"></a></p>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">A medida que traduces estos tipos de archivos DTD, puedes exportar periódicamente un archivo .xpi (también conocido como paquete de idioma) que puedes instalar en Firefox. Hablaremos sobre como hacerlo en una sección posterior de este manual. La próxima vez que instales el paquete de idioma de prueba, verás la cadena  "MANAGE SEARCH ENGINES"  traducida en la interfaz de tu versión local de Firefox.</span></p>
+<h3 id="Ejemplo_2_Los_Archivos_Property_search.properties">Ejemplo 2: Los Archivos Property, "search.properties"</h3>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Los archivos Properties search.properties contienen la cadena </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Add %S. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Puedes encontrar facilmente esta cadena en la interfaz del navegador visitando un sitio web que procea de un plugin de búsqueda (como </span><a href="../"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">http://developer.mozilla.org/</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">) y haciendo clic en el menú desplegable  en la caja de búsqueda en la esquina superior derecha del navegador. Dale un vistazo a la imagen de abajo. Ahí verás el </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Add %S, </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">donde </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">%S </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">es reemplazado por el nombre del sitio.</span></p>
+<p><a href="/@api/deki/files/5837/=Add_%25252525S.png"><img alt="" class="internal default" src="/@api/deki/files/5837/=Add_%25252525S.png"></a></p>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Traducir las cadenas de los archivos Property es exactamente lo mismo que traducir los archivos DTD. Pero este ejemplo en particular simplemente se refiere a los pasos del ejemplo uno, reemplazando la cadena  “Administar motores de búsqueda...” con el “Add %S” . Al igual que con el archivo DTD tu puedes exportar periodicamente un archivo .xpi que puedes instalar en Firefox para ver tus cadenas traducidas guardadas. </span></p>
+<h2 id="Exportando_un_paquete_de_idioma_.xpi">Exportando un paquete de idioma .xpi</h2>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Felicidades! ahora que ya has traducido y guardado varias cadenas, vamos a exportar esas cadenas traducidas para que veas tus traducciones en tu navegador Firefox Aurora.</span><br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">La utilidad de exportación en la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">te dá algunas opciones diferentes para la exportación. Algunas opciones son para probar tus traducciones, otras son para que tu traducción final aprobadas que serán incorporadas en la próxima versión de Firefox. Para nuestro ejemplo, nos vamos a concentrar en exportar tu traducción paquete de idioma .xpi</span></p>
+<ol> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Ir a la pestaña </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export. </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">En la siguiente imágen se ilustra lo que verás cuando estés en esta pestaña</span> <p> </p> <p><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"><a href="/@api/deki/files/5834/=export.png"><img alt="" class="internal default" src="/@api/deki/files/5834/=export.png" style="width: 1076px; height: 291px;"></a></span></p> </li> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Seleccionar la opción </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Approved suggestion </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">del menú desplegable </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export translations using</span></li> <li>C<span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">lic en el botón </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: bold; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Export.</span></li> <li><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Una vez la barra de estado esté completa, verás que te aparecen los enlaces .zip, .html, y .xpi. Dale clic en el enlace .xpi para guardarlo en tu disco.</span></li>
+</ol>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">El paquete de idioma .xpi es construido cada vez que tu exportas tu traducción. Todas las cadenas no traducidas son exportadas en en-US  como parte de tu paquete de idioma. Esto te permitirá que vayas probando el progreso de tu trabajo sobre la marcha.</span><br> <br> <span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Cuando exportas archivos, la estructura del código fuente de Mozilla se conserva. En cualquier momento durante la traducción, puedes exportar el paquete en-US.zip por si quieres ver la estructura del código fuente de Firefox de los archivos con cadenas en-US.</span></p>
+<div class="warning">Aviso: No usar el comando <code>hg push</code> ya que esto es sólo para pruebas locales.</div>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Para saber como probar tu reciente paquete de idioma exportado, visita el tema </span><a href="../en/Create_a_new_localization#Testing_your_language_pack"><span style="font-size: 11pt; font-family: Courier New; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">Testing your language pack</span></a><span style="font-size: 11pt; font-family: Courier New; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">  </span><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">en la wiki de</span><a href="../en/Create_a_new_localization"><span style="font-size: 11pt; font-family: Courier New; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">Create a new localization</span></a></p>
+<p> </p>
+<h2 id="Exportación_Final">Exportación Final</h2>
+<p><span id="internal-source-marker_0.5117014449713394" style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">Una vez que has completado tu traducción, </span><a class=" link-https" href="https://wiki.mozilla.org/L10n:Becoming_an_Official_Localization#Preparation"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">revísala y pruébala</span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;"> y será el momento para hacer la exportación final (en formato .zip) para enviarlo a Mozilla. Para hacer esto envía un email a la </span><a class=" external" href="http://mailto:dev-l10n@lists.mozilla.org/"><span style="font-size: 11pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">lista de correo dev-l10n </span></a><span style="font-size: 11pt; font-family: Arial; color: #000000; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline;">o al administrador global de Narro pidiendo asistencia. </span></p>
+<div class="note">Por favor ten en cuenta que el Mozilla l10n-drivers ha producido el <a class=" link-https" href="https://l10n-stage-sj.mozilla.org/dashboard/"><span style="font-size: 12pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">l10n dashboard</span></a> para seguir el progreso de todas las localizaciones de Mozilla. Esto está basado en una poderosa herramienta llamada<a href="../en/Compare-locales"><span style="font-size: 12pt; font-family: Arial; color: #000099; background-color: transparent; font-weight: normal; font-style: normal; font-variant: normal; text-decoration: underline; vertical-align: baseline;">Compare-Locales</span></a>. Si tu eliges utilizar Narro para tu localización, sé conciente de que narro invalida el dashboard de seguimiento de presición  del proyecto debido a la forma en que Narro maneja las cadenas y las exporta.</div>
diff --git a/files/es/orphaned/mdn/community/index.html b/files/es/orphaned/mdn/community/index.html
new file mode 100644
index 0000000000..b143cd7554
--- /dev/null
+++ b/files/es/orphaned/mdn/community/index.html
@@ -0,0 +1,55 @@
+---
+title: Únete a la comunidad de MDN web docs
+slug: orphaned/MDN/Community
+tags:
+  - Comunidad
+  - Documentación
+  - Guía
+  - Proyecto MDC
+translation_of: MDN/Community
+original_slug: MDN/Comunidad
+---
+<div>{{MDNSidebar}}</div>
+
+<div>{{IncludeSubnav("/es/docs/MDN")}}</div>
+
+<div class="summary">
+<p>La documentación de la web de MDN (MDN web docs) es más que un wiki: Es una comunidad de desarrolladores que trabajan unidos para hacer que MDN sea un excelente recurso para todos los desarrolladores que usen cualquier tecnología de la Open Web.</p>
+</div>
+
+<p>Nos gustaría mucho que contribuyeras a MDN, pero nos encantaría si además de contribuir participaras en la comunidad de MDN. Aquí te explicamos cómo ponerte en contacto en tres sencillos pasos:</p>
+
+<ol>
+ <li><a href="/es/docs/MDN/Contribute/Howto/Crear_cuenta_MDN">Crear cuenta MDN</a>.</li>
+ <li><a href="/en-US/docs/MDN/Community/Conversations">Join in conversations (aun no disponible en español)</a>.</li>
+ <li><a href="/es/docs/Project:MDN/Contribuyendo/Siga_lo_que_está_pasando">Siga lo que está pasando</a>.</li>
+</ol>
+
+<h2 id="Cómo_funciona_la_comunidad">Cómo funciona la comunidad</h2>
+
+<p>Aquí encontraras más artículos que describen a la comunidad de MDN.</p>
+
+<div class="row topicpage-table">
+<div class="section">
+<dl>
+ <dt class="landingPageList"><a href="/en-US/docs/MDN/Community/Roles">Community roles</a></dt>
+ <dd class="landingPageList">No disponible en español por el momento.</dd>
+ <dt class="landingPageList"><a href="/en-US/docs/MDN/Community/Doc_sprints">Doc sprints</a></dt>
+ <dd class="landingPageList">No disponible en español por el momento</dd>
+ <dt class="landingPageList"><a href="/es/docs/Project:MDN/Contribuyendo/Siga_lo_que_está_pasando">Siga lo que está pasando</a></dt>
+ <dd class="landingPageList">MDN es auspiciado por <a class="external" href="https://wiki.mozilla.org/MDN"> La comunidad de la red de desarrolladores de Mozilla</a>. Aquí encontraras algunas maneras por las cuales compartimos información acerca de lo que estamos haciendo.</dd>
+</dl>
+
+<dl>
+</dl>
+</div>
+
+<div class="section">
+<dl>
+ <dt class="landingPageList"><a href="/en-US/docs/MDN/Community/Conversations">MDN community conversations</a></dt>
+ <dd class="landingPageList">no disponible en español por el momento</dd>
+ <dt class="landingPageList"><a href="/es/docs/MDN/Contribute/Community">Trabajar con nuestra comunidad</a></dt>
+ <dd class="landingPageList">Una gran parte de contribuir a la documentación de MDN en cualquier aspecto es saber cómo trabajar dentro de la comunidad MDN. Este artículo te ofrece tips para ayudarte a aprovechar las interacciones con otros colaboradores y con los equipos de desarrolladores.</dd>
+</dl>
+</div>
+</div>
diff --git a/files/es/orphaned/mdn/community/working_in_community/index.html b/files/es/orphaned/mdn/community/working_in_community/index.html
new file mode 100644
index 0000000000..f71d57ce2d
--- /dev/null
+++ b/files/es/orphaned/mdn/community/working_in_community/index.html
@@ -0,0 +1,119 @@
+---
+title: Trabajando con nuestra comunidad
+slug: orphaned/MDN/Community/Working_in_community
+tags:
+  - Comunidad
+  - Guía
+  - MDN Meta
+translation_of: MDN/Community/Working_in_community
+original_slug: MDN/Contribute/Community
+---
+<div>{{MDNSidebar}}</div>
+
+<p>Lo más importante para contribuir a la documentacion de MDN en cualquier escala es saber trabajar como parte de una comunidad. Este artículo brinda tips que te ayudarán a sacarle el máximo partido a tus interacciones con documentadores y el equipo de desarrolladores.</p>
+
+<h2 id="Reglas_generales_de_comportamiento.">Reglas generales de comportamiento.</h2>
+
+<p>Aquí encontraras algunas reglas generales de conducta para cuando trabajes en la comunidad Mozilla.</p>
+
+<ul>
+ <li>¡Se cortés! Incluso cuando no estés acuerdo, todos tenemos la misma misión: el mejoramiento de la Web.</li>
+ <li>Pide, no exijas. Es mucho más probable que las personas sean útiles y receptivas cuando solicita ayuda cortésmente en lugar de exigirla. Si bien el trabajo de documentación es importante, y nuestra comunidad de desarrolladores lo sabe, el instinto humano tiende a hacer que las personas sean agresivas y difíciles si no las tratas con el debido respeto.</li>
+ <li>Equilibra tu necesidad de información con la urgencia de la documentación y el tiempo que los demás participantes en tu discusión dedican a ayudarte. No sigas presionando para obtener más y más detalles si no es terriblemente urgente y necesario, hasta el punto de volver locos a los demás involucrados en la conversación.</li>
+ <li>Ten en cuenta que tu solicitud toma un tiempo valioso de las personas con las que estás contactando, así que asegúrate de aprovechar bien su tiempo.</li>
+ <li>Se consciente de las diferencias culturales. Mozilla es un equipo multinacional y multicultural, así que cuando hables con alguien cuya cultura sea  o pueda ser, diferente a la tuya, ten en cuenta eso mientras se comuniquen.</li>
+ <li>Inicia una conversacion nueva en vez de entrometerte en una existente. No pongas tus preguntas en una conversación sin relacion solo porque la gente con la que necesitas hablar está prestándole atención; mientras que esto podría ser conveniente para ti, esto puede molestar a las personas con las que intentas hablar, dando lugar a una experiencia lejos de ser ideal.</li>
+ <li>Evita {{interwiki("wikipedia", "bikeshedding")}} (trivialidad). No permitas que tu entusiasmo se transforme en una molesta pedanteria, esto hace las conversaciones desenfocadas y engorrosas.</li>
+</ul>
+
+<h2 id="Se_cortés">Se cortés</h2>
+
+<p>Siempre se diplomático y respetuoso cuando te comuniques con los demás.</p>
+
+<h3 id="Señalando_errores_cortésmente">Señalando errores cortésmente</h3>
+
+<p>Si tu propósito al contactar a alguien es pedirle que haga algo diferente o señalar un error que ha estado cometiendo (especialmente si lo hace repetidamente), comienza tu mensaje con un comentario positivo. Esto suaviza el golpe, por así decirlo, y demuestra que estás tratando de ayudar, en lugar de convertirte en 'el malo de la película'.</p>
+
+<p>Por ejemplo, si un colaborador nuevo ha estado creando muchas páginas sin etiquetas y te gustaría señalar este problema, tu mensaje podría verse así (las cosas que necesita cambiar para cada caso están subrayadas) :</p>
+
+<blockquote>
+<p>Hola, <u>MrBigglesworth</u>, he notado sus contribuciones <u>a la documentación de la API de Wormhole</u>, ¡y es fantástico contar con su ayuda! Me gusta especialmente <u>la forma en que equilibraste tu nivel de detalle con la legibilidad</u>. Dicho esto, sin embargo, podría hacer que estos artículos sean aún mejores y más útiles si <u>agrega las etiquetas correctas a las páginas</u> sobre la marcha.</p>
+
+<p><u>Consulte la guía de etiquetado de MDN (https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Tag) para obtener más detalles.</u></p>
+
+<p>Gracias de nuevo y espero sus futuras contribuciones.</p>
+</blockquote>
+
+<h2 id="Intercambiando_conocimiento">Intercambiando conocimiento</h2>
+
+<p>Al participar en el proyecto MDN, es útil saber lo que está pasando e interactuar con otros los demas miembros de nuestra comunidad. Al hacer esto, puedes compartir ideas, actualizaciones de estado y más. Además contamos con recursos y herramientas para ayudarte a saber que se está haciendo y por quiénes.</p>
+
+<h3 id="Canales_de_comunicación">Canales de comunicación</h3>
+
+<p>Existen varias formas en las que puedes participar con los miembros de la comunidad, ya sea con documentadores o desarrolladores, cada uno de los cuales tiene sus propias reglas de comportamiento.</p>
+
+<h4 id="Discourse_en_Inglés">Discourse (en Inglés)</h4>
+
+<p>El foro <a href="https://discourse.mozilla.org/c/mdn">MDN Discourse </a>es un buen lugar para hacer preguntas generales sobre la contribución a MDN y empezar discusiones.</p>
+
+<h4 id="Chat_en_Inglés">Chat (en Inglés)</h4>
+
+<p>Utiliza el sistema de chat Matrix para contactar con personas en tiempo real. Los miembros del personal de MDN están disponibles en la sala de <a href="https://chat.mozilla.org/#/room/#mdn:mozilla.org">MDN Web Docs </a> y están activos durante los días laborales en Europa y América del Norte. Explora las otras salas de chat para encontrar personas involucradas en temas que te interesen.</p>
+
+<h4 id="GitHub_en_Inglés">GitHub (en Inglés)</h4>
+
+<p>Si encuentras un problema en MDN, o deseas hacer una pregunta, ¡puedes presentar un problema en nuestro <a href="https://github.com/mdn/sprints/issues">repo de GitHub</a>! Luego serán evaluados y procesados en algún momento en el futuro.</p>
+
+<h4 id="Bugzilla">Bugzilla</h4>
+
+<p>Cuando escribes documentacion para cubrir los cambios implementados como consecuencia de un error en Bugzilla, podrás interactuar en ocasiones con las personas involucradas en estos errores. ¡Asegurate de tener <a href="https://bugzilla.mozilla.org/page.cgi?id=etiquette.html" title="https://bugzilla.mozilla.org/page.cgi?id=etiquette.html">guía de comportamiento Bugzilla</a> en mente todo el tiempo!</p>
+
+<h4 id="Email">Email</h4>
+
+<p>En ocasiones, el intercambio de correo electrónico privado entre tú y una o más personas es el camino a seguir, si tienes su dirección de correo electronico.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Como regla general, si alguien a publicado su email en los documentos sobre la tecnología que estás documentando, te ha dado su correo, o es un correo muy conocido, un correo es un buen medio para realizar el "primer contacto". Si tienes que buscarlo, probablemente deberías intentar obtener permiso para Discourse o una lista de correo primero, a menos que hayas agotado todos los demás recursos para ponerte en contacto.</p>
+</div>
+
+<h3 id="Estado_del_contenido">Estado del contenido</h3>
+
+<p>Tenemos varias herramientas útiles que te proporcionan información sobre el estado de la documentación.</p>
+
+<dl>
+ <dt><a href="/dashboards/revisions">Tablero de revisión</a></dt>
+ <dd>Esta es una herramienta fantástica para la revisión de los cambios realizados  en el contenido de MDN. Puedes ver el historial, seleccionar un rango de tiempo para ver, y filtrar por cosas como la configuración regional, nombre del contribuyente, y tema. Una vez que estés viendo la serie de revisiones, puedes ver los cambios realizados en cada una de ellas, abrir rápidamente la pagina, ver el historial completo o revertir cambios  (si tienes los permisos).</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/MDN/Doc_status/Overview">Visión general del estado de la documentación</a></dt>
+ <dd>Nuestra pagina de <a href="https://developer.mozilla.org/en-US/docs/MDN/Doc_status/Overview">vista del estado de documentación</a> provee una lista de todas las áreas de MDN que se han configurado para el seguimiento de estado, con información de algunas páginas y los diferentes trabajos que se necesitan. Haz click en un área en particular y mira un listado de los contenidos que necesitan trabajo, como páginas que no tienen etiquetas, o etiquetas que requieren cierto trabajo. Puedes ver una lista de páginas que no se han actualizado hace mucho tiempo, están desactualizados, o una lista de los errores encontrados y cómo han afectado a la documentación en esa área.</dd>
+ <dt><a href="/en-US/docs/MDN/Plans">Los planes del proyecto de documentación</a></dt>
+ <dd>Tenemos una serie de proyectos de escritura que se encuentran en etapa de planificación, o son grandes y se encuentran en curso, para los que se han escrito los documentos de planificación y así tener un registro de lo que tenemos que hacer.</dd>
+ <dt><a href="https://tree.taiga.io/project/viya-mdn-durable-team">MDN Taiga (en Inglés)</a></dt>
+ <dd>Los redactores del personal de MDN utilizan una herramienta llamada Taiga para gestionar proyectos de documentación actuales y futuros. Puedes echar un vistazo para ver lo que estamos haciendo y cómo va, también puedes ver qué proyectos nos gustaría que sucedan pronto. Algunos de ellos serán asumidos por escritores del personal, ¡pero no dudes en hacerte cargo de uno si lo deseas! Para obtener más información sobre los procesos ágiles que sigue el equipo de MDN, consulta nuestra página de procesos en la <a href="https://wiki.mozilla.org/Engagement/MDN_Durable_Team/Processes"> wiki de Mozilla.</a></dd>
+</dl>
+
+<h2 id="La_comunidad_de_desarrollo">La comunidad de desarrollo</h2>
+
+<p>Posiblemente las relaciones más importantes para desarrollar y mantener, como miembro de la comunidad de la escritura MDN, son las que mantengas  con los desarrolladores. Ellos crean el software que estamos desarrollando, pero también son la fuente más útil de información que tenemos. Es crucial que mantengamos buenas relaciones con los desarrolladores, ¡así es más probable que respondan a tus preguntas de forma rápida, precisa y adecuada!</p>
+
+<p>Además, representas a la comunidad de escritura MDN. Por favor, ayuda a asegurar que mantengamos nuestra excelente relación de trabajo con el equipo de desarrollo haciendo que cada interacción que tengan con el equipo de escritura sea la mejor posible.</p>
+
+<p>En una nota relacionada, una gran manera de encontrar a la persona adecuada para hablar es mirar la <a href="https://wiki.mozilla.org/Modules">lista de propietarios del módulo</a>.</p>
+
+<h2 id="La_comunidad_de_escritura">La comunidad de escritura</h2>
+
+<p>La comunidad de la escritura es grande. Mientras que el número de contribuyentes frecuentes o de gran escala es relativamente pequeño, hay muchas docenas o cientos de personas que contribuyen al menos de vez en cuando. Afortunadamente, se trata de personas impresionantes, con un amor genuino por la Web, Mozilla, y/o la documentación, además, la interacción con ellos es casi siempre bastante fácil.</p>
+
+<p>Mira el articulo <a href="/en-US/docs/MDN/Community" title="/en-US/docs/Project:MDN/Contributing/Join_the_community">Únete a la comunidad</a> para mas información acerca de la comunidad MDN.</p>
+
+<p> El lugar donde más frecuentemente podrás interactuar directamente con otros escritores es en el foro <a href="https://discourse.mozilla.org/c/mdn">Discourse.</a></p>
+
+<p><span id="result_box" lang="es"><span>Teniendo en cuenta la</span></span> {{anch("Guía general de comportamiento")}} , usted notará que las cosas salen bien por lo general.</p>
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Project:MDN/Contributing" title="/en-US/docs/Project:MDN/Contributing">Contribuyendo con MDN</a></li>
+ <li><a href="/en-US/docs/Project:MDN/Contributing/Join_the_community" title="/en-US/docs/Project:MDN/Contributing/Join_the_community">Comunidad MDN</a></li>
+ <li><a href="http://matt.might.net/articles/how-to-email/" title="http://matt.might.net/articles/how-to-email/">Cómo enviar y respoder un email</a></li>
+ <li><a href="http://blog.gerv.net/2012/10/how-to-be-a-mozillia/">Cómo ser un Mozillian</a></li>
+</ul>
diff --git a/files/es/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html b/files/es/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html
new file mode 100644
index 0000000000..95838bcbbb
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/create_an_mdn_account/index.html
@@ -0,0 +1,33 @@
+---
+title: Cómo crear una cuenta MDN
+slug: orphaned/MDN/Contribute/Howto/Create_an_MDN_account
+tags:
+  - Cuenta
+  - GitHub
+  - Perfil
+  - Persona
+  - Principiante
+  - account
+translation_of: MDN/Contribute/Howto/Create_an_MDN_account
+original_slug: MDN/Contribute/Howto/Crear_cuenta_MDN
+---
+<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/orphaned/mdn/contribute/howto/do_a_technical_review/index.html b/files/es/orphaned/mdn/contribute/howto/do_a_technical_review/index.html
new file mode 100644
index 0000000000..b4c75bc774
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/do_a_technical_review/index.html
@@ -0,0 +1,45 @@
+---
+title: Cómo hacer una revisión técnica
+slug: orphaned/MDN/Contribute/Howto/Do_a_technical_review
+translation_of: MDN/Contribute/Howto/Do_a_technical_review
+original_slug: MDN/Contribute/Howto/revision_tecnica
+---
+<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/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html b/files/es/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html
new file mode 100644
index 0000000000..34dda57c59
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html
@@ -0,0 +1,55 @@
+---
+title: Cómo hacer una revisión editorial
+slug: orphaned/MDN/Contribute/Howto/Do_an_editorial_review
+tags:
+  - Cómo hacerlo
+  - Documentación
+  - Guía
+  - Revisiones
+translation_of: MDN/Contribute/Howto/Do_an_editorial_review
+original_slug: MDN/Contribute/Howto/revision_editorial
+---
+<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/orphaned/mdn/contribute/howto/document_a_css_property/property_template/index.html b/files/es/orphaned/mdn/contribute/howto/document_a_css_property/property_template/index.html
new file mode 100644
index 0000000000..dc49696e81
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/document_a_css_property/property_template/index.html
@@ -0,0 +1,121 @@
+---
+title: Plantilla de página para propiedades CSS
+slug: orphaned/MDN/Contribute/Howto/Document_a_CSS_property/Property_template
+translation_of: MDN/Contribute/Howto/Document_a_CSS_property/Property_template
+original_slug: MDN/Contribute/Howto/Document_a_CSS_property/Plantilla_propiedad
+---
+<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/orphaned/mdn/contribute/howto/remove_experimental_macros/index.html b/files/es/orphaned/mdn/contribute/howto/remove_experimental_macros/index.html
new file mode 100644
index 0000000000..0d2439416a
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/remove_experimental_macros/index.html
@@ -0,0 +1,49 @@
+---
+title: Cómo y cuándo eliminar macros "experimentales"
+slug: orphaned/MDN/Contribute/Howto/Remove_Experimental_Macros
+tags:
+  - Experimental
+  - Guía
+  - MDN Meta
+  - Macros
+translation_of: MDN/Contribute/Howto/Remove_Experimental_Macros
+original_slug: MDN/Contribute/Howto/Remover_Macros_Experimentales
+---
+<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/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html b/files/es/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html
new file mode 100644
index 0000000000..37695460b6
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/set_the_summary_for_a_page/index.html
@@ -0,0 +1,119 @@
+---
+title: Cómo colocar el resumen de una página
+slug: orphaned/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
+original_slug: 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/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html b/files/es/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html
new file mode 100644
index 0000000000..a0292c9119
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/tag_javascript_pages/index.html
@@ -0,0 +1,84 @@
+---
+title: Cómo etiquetar páginas Javascript
+slug: orphaned/MDN/Contribute/Howto/Tag_JavaScript_pages
+tags:
+  - Etiquetas
+  - JavaScript
+translation_of: MDN/Contribute/Howto/Tag_JavaScript_pages
+original_slug: MDN/Contribute/Howto/Etiquetas_paginas_javascript
+---
+<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/orphaned/mdn/contribute/howto/use_navigation_sidebars/index.html b/files/es/orphaned/mdn/contribute/howto/use_navigation_sidebars/index.html
new file mode 100644
index 0000000000..f5f6f79402
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/use_navigation_sidebars/index.html
@@ -0,0 +1,79 @@
+---
+title: Cómo usar las barras laterales de navegación
+slug: orphaned/MDN/Contribute/Howto/Use_navigation_sidebars
+translation_of: MDN/Contribute/Howto/Use_navigation_sidebars
+original_slug: MDN/Contribute/Howto/Usar_barras_laterales_de_navegación
+---
+<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/orphaned/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html b/files/es/orphaned/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html
new file mode 100644
index 0000000000..ebfae0e469
--- /dev/null
+++ b/files/es/orphaned/mdn/contribute/howto/write_an_article_to_help_learn_about_the_web/index.html
@@ -0,0 +1,107 @@
+---
+title: Cómo escribir un artículo para ayudar a las personas a aprender sobre la Web.
+slug: orphaned/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
+original_slug: 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>
diff --git a/files/es/orphaned/mdn/tools/page_regeneration/index.html b/files/es/orphaned/mdn/tools/page_regeneration/index.html
new file mode 100644
index 0000000000..672d24d853
--- /dev/null
+++ b/files/es/orphaned/mdn/tools/page_regeneration/index.html
@@ -0,0 +1,33 @@
+---
+title: Renderizado de páginas en MDN
+slug: orphaned/MDN/Tools/Page_regeneration
+translation_of: MDN/Tools/Page_regeneration
+original_slug: MDN/Tools/Page_regeneration
+---
+<div>{{MDNSidebar}}</div>
+
+<p>El sitio MDN almacena en caché las páginas para que el usuario obtenga un mejor rendimiento. Como resultado, los cambios que guarde en una página podrían no aparecer la próxima vez que vuelva a cargar la página. A menudo, pero no siempre, aparece un banner en la página que indica que hay una actualización de la página en proceso. Puede hacer una "recarga forzada" (Shift + F5) en su navegador para volver a cargar la página desde el servidor, pero esto puede no tener efecto si la actualización en el servidor no se ha completado.</p>
+
+<p>Algunas páginas (especialmente las páginas de destino) usan macros para generar y actualizar automáticamente su contenido. Para las páginas de destino, esto asegura que los nuevos artículos se enumeren automáticamente en la página, sin que un escritor tenga que agregarlos manualmente. Esta es útil para los contribuyentes de mucho tiempo, y ayuda a los recién llegados a evitar que su trabajo se pierda en la confusión porque no sabían cómo vincular sus artículos en la jerarquía del sitio.</p>
+
+<p>Esto también se puede usar cuando se transmite contenido de una página a otras páginas (usando, por ejemplo, la macro {{TemplateLink ("Página")}}).</p>
+
+<p>Debido a que el caché de MDN almacena el contenido renderizado para mejorar el rendimiento, los cambios realizados en el material de origen (como salida de macro o páginas transcluidas) no se reflejan automáticamente en la página. Si espera cambios frecuentes en dichos materiales de origen, puede considerar habilitar la regeneración automática de su página.</p>
+
+<p>Siga los siguientes pasos para habilitar la regeneración automática:</p>
+
+<ol>
+ <li>Cambia el idioma del editor a inglés.</li>
+ <li>Haga clic en el botón <em><strong>Edit</strong> </em>en la página para ingresar al modo de edición.</li>
+ <li>Debajo del título de la página, haga clic en <em><strong>Edit page title and properties</strong></em> ubicados cerca del título de la página. Aparecen los campos de metadatos de la página.</li>
+ <li>Establezca un valor para <em><strong>Rendering max age</strong></em> . Este valor determina la cada cuánto tiempo se reconstruye la página en caché, incluida la ejecución de sus macros. Por lo general, usamos 4 u 8 por defecto. Para una tecnología cuya documentación está cambiando rápidamente, puede elegir un número más bajo.</li>
+ <li>Guarda tus cambios en la página. Es una buena práctica hacer un comentario de revisión que describa lo que hiciste, como "Establecer la Rendering max age en 4 horas".</li>
+</ol>
+
+<p>La página se regenerará automáticamente en el horario que especificó.</p>
+
+<div class="note">
+<p>Nota: La opción <em>Edit page title and properties</em> no está disponible al crear una nueva página; tendrás que volver a abrir el editor después de tu primer guardado.</p>
+
+<p>La opción <em>Edit page title and properties</em> no está disponible de momento en otros idiomas que no sean inglés.</p>
+</div>
diff --git a/files/es/orphaned/mdn/tools/template_editing/index.html b/files/es/orphaned/mdn/tools/template_editing/index.html
new file mode 100644
index 0000000000..82e84e68cd
--- /dev/null
+++ b/files/es/orphaned/mdn/tools/template_editing/index.html
@@ -0,0 +1,15 @@
+---
+title: Edición de plantillas
+slug: orphaned/MDN/Tools/Template_editing
+tags:
+  - Guía
+  - Herramientas
+  - MDN Meta
+  - Privilegios
+  - Roles(2)
+translation_of: MDN/Tools/Template_editing
+original_slug: MDN/Tools/Template_editing
+---
+<div>{{MDNSidebar}}</div><p>En MDN, las plantillas escritas en <a href="/en-US/docs/MDN/Contribute/Tools/KumaScript">KumaScript</a> son usadas para automatizar la generación de contenido y la personalización de las páginas. Cada plantilla es un archivo separado <a href="https://github.com/mozilla/kumascript/tree/master/macros">del directorio de macros del repositorio GitHub KumaScript</a>.</p>
+
+<p><span class="seoSummary">Cualquiera que edite páginas wiki de MDN puede invocar plantillas utilizando <a href="/en-US/docs/MDN/Contribute/Structures/Macros">macros</a> en los artículos MDN.  Cuaquiera puede crear y editar plantillas vía <a href="https://github.com/mozilla/kumascript">el repositorio GitHub KumaScript GitHub</a> usando prácticas open-source estándar (bifurcando el repositorio, creando una rama, haciendo tus cambios, y enviando una petición de incorporación de cambios para revisión). </span>Ten en cuenta que enviar una petición de incorporación de cambios es actualmente la única forma de actualizar cadenas traducidas en las plantillas que las contienen.</p>
diff --git a/files/es/orphaned/migrar_aplicaciones_desde_internet_explorer_a_mozilla/index.html b/files/es/orphaned/migrar_aplicaciones_desde_internet_explorer_a_mozilla/index.html
new file mode 100644
index 0000000000..543bbec42d
--- /dev/null
+++ b/files/es/orphaned/migrar_aplicaciones_desde_internet_explorer_a_mozilla/index.html
@@ -0,0 +1,1068 @@
+---
+title: Migrar aplicaciones desde Internet Explorer a Mozilla
+slug: orphaned/Migrar_aplicaciones_desde_Internet_Explorer_a_Mozilla
+tags:
+  - Desarrollo_Web
+  - Todas_las_Categorías
+original_slug: Migrar_aplicaciones_desde_Internet_Explorer_a_Mozilla
+---
+<h3 id="Introducci.C3.B3n" name="Introducci.C3.B3n">Introducción</h3>
+<p>Cuando Netscape comenzó con el navegador Mozilla, lo hizo con la decisión consciente de soportar los estándares del W3C. Como resultado, Mozilla no es totalmente compatible hacia atrás con el código heredado de Netscape Navigator 4.x ni de Microsoft Internet Explorer. Por ejemplo, Mozilla no soporta la etiqueta <code>&lt;layer&gt;</code> como se verá más adelante. Los navegadores como Internet Explorer 4 fueron construidos antes de la concepción de los estándares del W3C heredando muchos de sus extraños comportamientos. En este articulo se describirán las idiosincrasias de Mozilla que hacen que haya una fuerte compatibilidad del HTML hacia atrás con Internet Explorer y otros navegadores antiguos.</p>
+<p>También se repasarán las tecnologías no estandarizadas soportadas por Mozilla, como el XMLHttpRequest y la edición de texto enriquecido, dado que existen sus equivalentes existentes en el W3C y que se incluyen en:</p>
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/html401/">HTML 4.01</a>, <a class="external" href="http://www.w3.org/TR/xhtml1/">XHTML 1.0</a> y <a class="external" href="http://www.w3.org/TR/xhtml11/">XHTML 1.1</a></li>
+ <li>Hojas de estilo en cascada (CSS): <a class="external" href="http://www.w3.org/TR/REC-CSS1">CSS nivel 1</a>, <a class="external" href="http://www.w3.org/TR/CSS21/">CSS nivel 2.1</a> y parte del <a class="external" href="http://www.w3.org/Style/CSS/current-work.html">CSS nivel 3</a></li>
+ <li>Modelo de objetos de documento (DOM): <a class="external" href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/">DOM nivel 1</a>, <a class="external" href="http://www.w3.org/DOM/DOMTR#dom2">DOM nivel 2</a> y parte del <a class="external" href="http://www.w3.org/DOM/DOMTR#dom3">DOM nivel 3</a></li>
+ <li>Lenguaje de etiquetado matemático (MathML): <a class="external" href="http://www.w3.org/Math/">MathML versión 2.0</a></li>
+ <li>Lenguaje de etiquetado ampliable (XML): <a class="external" href="http://www.w3.org/TR/REC-xml">XML 1.0</a>, <a class="external" href="http://www.w3.org/TR/REC-xml-names/">Espacios de nombres en XML</a>, <a class="external" href="http://www.w3.org/TR/xml-stylesheet/">Asociando hojas de estilos con documentos XML 1.0</a>, <a class="external" href="http://lists.w3.org/Archives/Public/www-xml-linking-comments/2001AprJ%20un/att-0074/01-NOTE-FIXptr-20010425.htm">Fragment Identifier for XML</a></li>
+ <li>Transformaciones XSL: <a class="external" href="http://www.w3.org/TR/xslt">XSLT 1.0</a></li>
+ <li>Lenguaje XPath: <a class="external" href="http://www.w3.org/TR/xpath">XPath 1.0</a></li>
+ <li>Resource Description Framework (Infraestructura para la descripción de recursos): <a class="external" href="http://www.w3.org/RDF/">RDF</a></li>
+ <li>Simple Object Access Protocol (Protocolo simple de acceso a objetos): <a class="external" href="http://www.w3.org/TR/soap">SOAP 1.1</a></li>
+ <li>ECMA-262, revision 3 (JavaScript 1.5): <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMA-262</a></li>
+</ul>
+<h3 id="Trucos_generales_para_la_programaci.C3.B3n_multinavegador" name="Trucos_generales_para_la_programaci.C3.B3n_multinavegador">Trucos generales para la programación multinavegador</h3>
+<p>Pese a la existencia de los estándares web, los diferentes navegadores se comportan de manera distinta (de hecho, el mismo navegador puede comportarse de modo diferente dependiendo de la plataforma). Muchos navegadores, como Internet Explorer, también soportan el APIs anterior al W3C y nunca se han esforzado en añadir soporte para los navegadores compatibles con el W3C.</p>
+<p>Antes de enumerar las diferencias entre Mozilla e Internet Explorer, sería conveniente cubrir algunas formas básicas en las que se pueden crear aplicaciones web ampliables a las que añadir soporte para nuevos navegadores más tarde.</p>
+<p>Dado que los diferentes navegadores utilizan a veces diferentes APIs para una misma funcionalidad, es muy posible que encuentres múltiples bloques <code>if() else()</code> a lo largo y ancho del código para diferenciar el navegador que está ejecutando el documento. El siguiente código muestra un bloque diseñado para Internet Explorer:</p>
+<pre>. . .
+
+var elm;
+
+if (ns4)
+  elm = document.layers["myID"];
+else if (ie4)
+  elm = document.all["myID"]
+</pre>
+<p>El anterior código no es ampliable por lo que si quieres soportar un nuevo navegador, deberás actualizar ese bloque de código en toda la aplicación web.</p>
+<p>La forma más fácil de evitar la recodificación del documento para un nuevo navegador es abstraer la funcionalidad. En lugar de utilizar múltiples bloques <code>if() else()</code>, puedes incrementar la eficiencia tomando tareas comunes y abstrayéndolas en sus propias funciones. Esto no sólo hace al código más legible sino que simplifica el proceso añadir soporte para nuevos clientes.</p>
+<pre>var elm = getElmById("myID");
+
+function getElmById(aID){
+  var element = null;
+
+  if (isMozilla || isIE5)
+    element = document.getElementById(aID);
+  else if (isNetscape4)
+    element = document.layers[aID];
+  else if (isIE4)
+    element = document.all[aID];
+
+  return element;
+}
+</pre>
+<p>El código de arriba sigue arrastrando el problema del <em>browser sniffing</em> o el proceso de detección para saber qué navegador está utilizando el usuario. El browser sniffing es detectado generalmente gracias al parámetro <em>useragent</em>, como:</p>
+<pre>Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.5) Gecko/20031016
+</pre>
+<p>Mientras que la utilización del parámetro <em>useragent</em> para detectar el navegador proporciona información detallada del navegador en uso, el código que maneja esos parámetros genera errores con frecuencia cuando son publicadas nuevas versiones de los mismos, por lo que hay que cambiar el código.</p>
+<p>Si el tipo de navegador no importa (supongamos que se ha bloquado el acceso a la aplicación web a navegadores no soportados), <strong>será mucho mejor y más fiable detectar las capacidades del navegador o el soporte de objetos en particular</strong>. Generalmente se puede hacer esto probando la funcionalidad requerida en JavaScript, por ejemplo, en lugar de:</p>
+<pre>if (isMozilla || isIE5)
+</pre>
+<p>Se debería de usar:</p>
+<pre>if (document.getElementById)
+</pre>
+<p>Esto permitiría a otros navegadores que soportan ese método estandar del W3C (tales como Opera o Safari) funcionar sin ningún cambio.</p>
+<p>La detección del agente de usuario sin embargo tiene sentido cuando es importante acertar, como cuando estás verificando que un navegador coincide con los requerimientos de versión de la aplicación web o estás intentando sortear un fallo de programación.</p>
+<p>JavaScript también permite sentencias condicionales en línea, lo que ayuda a la legibilidad:</p>
+<pre>var foo = (condicion) ? condicionEsTrue : condicionEsFalse;
+</pre>
+<p>Por ejemplo, para obtener un elemento se debería usar:</p>
+<pre>
+function getElement(aID){
+  return (document.getElementById) ? document.getElementById(aID)
+                                   : document.all[aID];
+}
+</pre>
+<h3 id="Diferencias_entre_Mozilla_e_Internet_Explorer" name="Diferencias_entre_Mozilla_e_Internet_Explorer">Diferencias entre Mozilla e Internet Explorer</h3>
+<p>Primero se discutirán las diferencias en la forma en la que se comporta el HTML en Mozilla y en Internet Explorer.</p>
+<h4 id="T.C3.ADtulos_emergentes" name="T.C3.ADtulos_emergentes">Títulos emergentes</h4>
+<p>Los títulos emergentes son pequeños textos descriptivos que aparecen normalmente cuando se deja el cursor del ratón un cierto tiempo sobre un elemento.</p>
+<p>Los navegadores antiguos introdujeron los títulos emergentes en el HTML mostrándolos en enlaces y usando el valor del atributo <code>alt</code> como contenido del título. La última especificación de W3C para HTML creó el atributo <code>title</code>, pensado para contener una descripción detallada del enlace. Los navegadores modernos utilizan el atributo <code>title</code> para mostrar títulos emergentes y Mozilla sólo muestra dichos títulos basándose en el ese atributo y no en el atributo <code>alt</code>.</p>
+<h4 id="Entidades" name="Entidades">Entidades</h4>
+<p>El marcado HTML puede contener varias entidades definidas por el <a class="external" href="http://www.w3.org/TR/REC-html40/sgml/entities.html">departamento de estándares web del W3C</a>. Se pueden referenciar entidades a través de su referencia numérica o alfabética. Por ejemplo, puedes referenciar el carácter de espacio en blanco #160 con <code>&amp;#160</code> o con su referencia alfabética correspondiente <code>&amp;nbsp;</code>.</p>
+<p>Algunos navegadores antiguos, como Internet Explorer, son tan fulleros que permiten usar entidades reemplazando el carácter <code>;</code> (punto y coma) al final con contenido normal de texto.</p>
+<pre>&amp;nbsp Foo
+&amp;nbsp&amp;nbsp Foo
+</pre>
+<p>Internet Explorer visualizará los <code>&amp;nbsp</code> mostrados anteriormente como espacios en blanco, pese a que va en contra de la especificación del W3C. El navegador no analizará un <code>&amp;nbsp</code> si va inmediatamente seguido por más caracteres. Por ejemplo:</p>
+<pre>&amp;nbsp12345
+</pre>
+<p>Este código no funcionará en Mozilla, dado que va en contra de los estándares del W3C. Es mejor usar la forma correcta (<code>&amp;nbsp;</code>) para evitar discrepancias entre navegadores.</p>
+<h3 id="Diferencias_en_el_DOM" name="Diferencias_en_el_DOM">Diferencias en el DOM</h3>
+<p>El Modelo de Objetos de Documento (DOM) es <strong>la estructura en árbol que contiene los elementos del documento</strong>. Se puede manipular a través de las APIs de JavaScript, las cuales han sido estandarizadas por el W3C. Sin embargo, antes de la estandarización del W3C, Netscape 4 e Internet Explorer 4 implementaron las APIs de modo similar. Mozilla implementa las APIs heredadas sólo si han sido aceptadas por los estándares del W3C.</p>
+<h4 id="Accediendo_a_los_elementos" name="Accediendo_a_los_elementos">Accediendo a los elementos</h4>
+<p>Para referenciar un elemento usando una técnicas multinavegador, debe de usarse <code>document.getElementById(id)</code>, que funciona tanto en Internet Explorer versión 5.0 y superiores, en navegadores basados en Mozilla y en otros navegadores compatibles con el W3C y es parte de la especificación DOM nivel 1.</p>
+<p>Mozilla no soporta el acceso a elementos a través de <code>document.elementName</code>, ni siquiera a través del nombre del elemento; algo que Internet Explorer permite (llamado también <em>global namespace polluting</em>). Mozilla tampoco soporta el método <code>document.layers</code> de Netscape ni el <code>document.all</code> de Internet Explorer. Mientras que <code>document.getElementById</code> permite referenciar un único elemento, puedes usar <code>document.layers</code> y <code>document.all</code> para obtener una lista de todos los elementos del documento con un nombre determinado, como todos los elementos <code>&lt;div&gt;</code>.</p>
+<p>El método del DOM nivel 1 del W3C que permite referenciar a todos los elementos con el mismo nombre de etiqueta es <code>getElementsByTagName()</code>. Este método devuelve un vector en JavaScript y puede ser invocado desde el elemento <code>document</code> o desde otros nodos para buscar sólo en su sub-árbol. Para obtener un vector con todos los elementos del árbol del DOM, se puede utilizar <code>getElementsByTagName("*")</code>.</p>
+<p>Los métodos del DOM nivel 1, como muestra la tabla 1, son usados comúnmente para mover un elemento a una posición en particular y cambiar su visibilidad (menús, animaciones, etc...). Netscape 4 usaba la etiqueta <code>&lt;layer&gt;</code>(algo que Mozilla no soporta) como un elemento que podía posicionarse en cualquier lugar. En Mozilla se puede posicionar cualquier elemento utilizando la etiqueta <code>&lt;div&gt;</code>, algo que Internet Explorer también utiliza y que está presente en la especificación HTML.</p>
+<table class="standard-table">
+ <caption>
+  Tabla 1. Métodos usados para acceder a elementos</caption>
+ <tbody>
+  <tr>
+   <th>Método</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>document.getElementById( unId )</td>
+   <td>Devuelve una referencia al elemento cuyo atributo id coincide con el pasado como parámetro.</td>
+  </tr>
+  <tr>
+   <td>document.getElementsByTagName( unNombre )</td>
+   <td>Devuelve un vector de elementos cuyo nombre de etiqueta coincide con el pasado como parámetro.</td>
+  </tr>
+ </tbody>
+</table>
+<h4 id="Recorrer_el_DOM" name="Recorrer_el_DOM">Recorrer el DOM</h4>
+<p>Mozilla soporta las APIs del DOM del W3C que permiten recorrer el árbol del DOM a través de JavaScript (véase la tabla 2). Las APIs están disponibles para cada nodo del documento y permiten recorrer el árbol en cualquier dirección. Internet Explorer también soporta estas APIs y además sus APIs heredadas para recorrer el árbol del DOM, tales como la propiedad <code>children</code>.</p>
+<table class="standard-table">
+ <caption>
+  Tabla 2. Métodos usados para recorrer el DOM</caption>
+ <tbody>
+  <tr>
+   <th>Propiedad/Método</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>childNodes</td>
+   <td>Devuelve un vector con todos los nodos hijos del elemento.</td>
+  </tr>
+  <tr>
+   <td>firstChild</td>
+   <td>Devuelve el primer nodo hijo del elemento.</td>
+  </tr>
+  <tr>
+   <td>getAttribute( nombre )</td>
+   <td>Devuelve el valor del atributo cuyo nombre se pasa como parámetro.</td>
+  </tr>
+  <tr>
+   <td>hasAttribute( nombre )</td>
+   <td>Devuelve un valor booleano que indica si el nodo actual tiene un atributo definido con el nombre especificado.</td>
+  </tr>
+  <tr>
+   <td>hasChildNodes()</td>
+   <td>Devuelve un valor booleano que indica si el nodo actual tiene al menos un elemento hijo.</td>
+  </tr>
+  <tr>
+   <td>lastChild</td>
+   <td>Devuelve el último nodo hijo del elemento.</td>
+  </tr>
+  <tr>
+   <td>nextSibling</td>
+   <td>Devuelve el nodo que sigue inmediatamente al actual.</td>
+  </tr>
+  <tr>
+   <td>nodeName</td>
+   <td>Devuelve el nombre del nodo actual como una cadena de texto.</td>
+  </tr>
+  <tr>
+   <td>nodeType</td>
+   <td>Devuelve un valor numérico que indica el tipo del nodo actual.
+    <table>
+     <tbody>
+      <tr>
+       <th>Valor</th>
+       <th>Descripción</th>
+      </tr>
+      <tr>
+       <td>1</td>
+       <td>Nodo elemento</td>
+      </tr>
+      <tr>
+       <td>2</td>
+       <td>Nodo atributo</td>
+      </tr>
+      <tr>
+       <td>3</td>
+       <td>Nodo de texto</td>
+      </tr>
+      <tr>
+       <td>4</td>
+       <td>Nodo de sección CDATA</td>
+      </tr>
+      <tr>
+       <td>5</td>
+       <td>Nodo de referencia a entidad</td>
+      </tr>
+      <tr>
+       <td>6</td>
+       <td>Nodo entidad</td>
+      </tr>
+      <tr>
+       <td>7</td>
+       <td>Nodo de instrucción de proceso</td>
+      </tr>
+      <tr>
+       <td>8</td>
+       <td>Nodo comentario</td>
+      </tr>
+      <tr>
+       <td>9</td>
+       <td>Nodo documento</td>
+      </tr>
+      <tr>
+       <td>10</td>
+       <td>Nodo tipo de documento</td>
+      </tr>
+      <tr>
+       <td>11</td>
+       <td>Nodo fragmento de documento</td>
+      </tr>
+      <tr>
+       <td>12</td>
+       <td>Nodo anotación</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+  </tr>
+  <tr>
+   <td>nodeValue</td>
+   <td>Devuelve el valor del nodo actual. Para aquellos nodos que contentan texto, tales como los nodos de texto o los nodos comentario, se devolverá su valor alfabético. Para nodos atributo, se devolverá el valor de su atributo. Para el resto de nodos, se devolverá <code>null</code>.</td>
+  </tr>
+  <tr>
+   <td>ownerDocument</td>
+   <td>Devuelve el objeto <code>document</code> que contiene al nodo actual.</td>
+  </tr>
+  <tr>
+   <td>parentNode</td>
+   <td>Devuelve el nodo padre del nodo actual.</td>
+  </tr>
+  <tr>
+   <td>previousSibling</td>
+   <td>Devuelve el nodo inmediatamente anterior al nodo actual.</td>
+  </tr>
+  <tr>
+   <td>removeAttribute( nombre)</td>
+   <td>Elimina el atributo especificado del nodo actual.</td>
+  </tr>
+  <tr>
+   <td>setAttribute( nombre, valor )</td>
+   <td>Establece el valor de un atributo.</td>
+  </tr>
+ </tbody>
+</table>
+<p>Internet Explorer se comporta de un modo no estándar donde muchas de estas APIs ignorarán los nodos de texto en blanco que son generados, por ejemplo, mediante caracteres de nueva línea. Mozilla no las ignora por lo que a veces se necesita distinguir a estos nodos. Cada nodo posee la propiedad <code>nodeType</code> que especifica el tipo de nodo. Por ejemplo, un nodo elemento es de tipo 1 mientras que un nodo de texto es de tipo 3, un nodo comentario es de tipo 8, etc... La mejor forma de procesar sólo los nodos elemento es iterar todos los nodos hijos y procesar sólo aquellos cuya propiedad nodeType sea igual a 1:</p>
+<pre>HTML:
+  &lt;div id="foo"&gt;
+    &lt;span&gt;Test&lt;/span&gt;
+  &lt;/div&gt;
+
+JavaScript:
+  var myDiv = document.getElementById("foo");
+  var myChildren = myXMLDoc.childNodes;
+  for (var i = 0; i &lt; myChildren.length; i++) {
+    if (myChildren[i].nodeType == 1){
+      // Nodo elemento
+    };
+  };
+</pre>
+<h4 id="Generar_y_manejar_contenidos" name="Generar_y_manejar_contenidos">Generar y manejar contenidos</h4>
+<p>Mozilla soporta los métodos heredados para añadir contenido al DOM dinámicamente, tales como <code>document.write</code>, <code>document.open</code> y <code>document.close</code>. Mozilla también soporta el método de Internet Explorer <code>innerHTML</code> el cual puede ser llamado desde casi cualquier nodo. Sin embargo no soporta el método <code>outerHTML</code> (que añade marcado alrededor de un elemento y no tiene un equivalente estándar) ni <code>innerText</code> (el cual establece el valor alfabético de su nodo y que puede usarse en Mozilla usando <code>textContent</code>).</p>
+<p>Internet Explorer tiene varios métodos de manejo de contenidos que no son estándares y no son soportados en Mozilla, incluyendo obtener valores, insertar texto e insertar elementos adyacentes a un nodo tales como <code>getAdjacentElement</code> y <code>insertAdjacentHTML</code>. La tabla 3 muestra cómo el manipulan contenidos tanto Mozilla como el estándar del W3C, siendo todos ellos métodos aplicables a cualquier nodo del DOM.</p>
+<table class="standard-table">
+ <caption>
+  Tabla 3. Métodos usados por Mozilla para manipular contenidos</caption>
+ <tbody>
+  <tr>
+   <th>Método</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>appendChild( nodo )</td>
+   <td>Crea un nuevo nodo hijo. Devuelve una referencia al nuevo nodo hijo.</td>
+  </tr>
+  <tr>
+   <td>cloneNode( profundidad )</td>
+   <td>Crea y devuelve una copia del nodo sobre el que se hace la llamada. Si <em>profundidad</em> es true, copia el sub-árbol completo del nodo.</td>
+  </tr>
+  <tr>
+   <td>createElement( tipo )</td>
+   <td>Crea y devuelve un nuevo nodo huérfano de tipo igual al especificado por <em>tipo</em>.</td>
+  </tr>
+  <tr>
+   <td>createTextNode( valor )</td>
+   <td>Crea y devuelve un nuevo nodo de texto huérfano asignándole el valor especificado por <em>valor</em>.</td>
+  </tr>
+  <tr>
+   <td>insertBefore( nuevoNodo, nodoHijo )</td>
+   <td>Inserta el nodo <em>nuevoNodo</em> antes de <em>nodoHijo</em>, el cual debe ser un hijo del nodo actual.</td>
+  </tr>
+  <tr>
+   <td>removeChild( nodoHijo )</td>
+   <td>Elimina el nodo <em>nodoHijo</em> y devuelve una referencia a él.</td>
+  </tr>
+  <tr>
+   <td>replaceChild( nuevoNodo, nodoHijo )</td>
+   <td>Reemplaza el nodo <em>nodoHijo</em> con el nodo <em>nuevoNodo</em> y devuelve una referencia al nodo eliminado.</td>
+  </tr>
+ </tbody>
+</table>
+<h4 id="Fragmentos_de_documento" name="Fragmentos_de_documento">Fragmentos de documento</h4>
+<p>Por razones de eficiencia, pueden crearse documentos en memoria en lugar de trabajar con el DOM de un documento existente. El núcleo del DOM nivel 1 introdujo los fragmentos de documento, que son documentos ligeros que contienen un subconjunto de las interfaces de un documento normal. Por ejemplo, <code>getElementById</code> no existe pero <code>appendChild</code> sí. Además se pueden anexar fácilmente fragmentos de documento a los ya existentes.</p>
+<p>Mozilla crea fragmentos de documento a través de <code>document.createDocumentFragment()</code>, el cual devuelve un fragmento de documento vacío.</p>
+<p>Sin embargo, la implementación de Internet Explorer para los fragmentos de documentos no es compatible con el estándar del W3C y simplemente devuelve un documento normal.</p>
+<h3 id="Diferencias_en_JavaScript" name="Diferencias_en_JavaScript">Diferencias en JavaScript</h3>
+<p><span class="comment">Buscar traducción adecuada para hooks DOM. "timing related" traducido como "duración de la ejecución"</span></p>
+<p>Por lo general, la mayoría de las diferencias entre Mozilla e Internet Explorer son las de JavaScript. Sin embargo, los problemas normalmente residen en las APIs que un navegador muestra a JavaScript, tales como hooks de DOM. A nivel del núcleo, los dos navegadores no poseen grandes diferencias. Los problemas se encuentran frecuentemente en la duración de la ejecución.</p>
+<h4 id="Diferencias_en_las_fechas_de_JavaScript" name="Diferencias_en_las_fechas_de_JavaScript">Diferencias en las fechas de JavaScript</h4>
+<p>La única diferencia en el objeto <code>Date</code> es el método <code>getYear</code>. Para la especificación ECMAScript (que es la que sigue JavaScript), el método no es compatible con el efecto 2000 y al ejecutar <code>new Date().getYear()</code> en 2004 se obtendrá un valor igual a "104". Para la especificación ECMAScript, <code>getYear</code> devuelve el año menos 1900 lo cual devolvía "98" para 1998. <code>getYear</code> quedó obsoleto en la versión 3 de ECMAScript y fue reemplazado por <code>getFullYear</code>. Internet Explorer cambió la implementación de <code>getYear</code> para que funcionara como <code>getFullYear</code> y fuese así compatible con el efecto 2000, mientras que Mozilla mantuvo el comportamiento estándar.</p>
+<h4 id="Diferencias_de_ejecuci.C3.B3n_en_JavaScript" name="Diferencias_de_ejecuci.C3.B3n_en_JavaScript">Diferencias de ejecución en JavaScript</h4>
+<p>Diferentes navegadores ejecutarán JavaScript de modo distinto. Por ejemplo, el siguiento código asume que el nodo <code>div</code> ya existe en el DOM en el momento en el que el bloque <code>script</code> se ejecuta:</p>
+<pre>...
+&lt;div id="foo"&gt;Cargando...&lt;/div&gt;
+
+&lt;script&gt;
+  document.getElementById("foo").innerHTML = "Cargado.";
+&lt;/script&gt;
+</pre>
+<p>Sin embargo esto no está garantizado. Para asegurarnos de que todos los elementos existen se debería usar el manejador de evento <code>onload</code> en la etiqueta <code>&lt;body&gt;</code>:</p>
+<pre>&lt;body onload="doFinish();"&gt;
+
+&lt;div id="foo"&gt;Cargando...&lt;/div&gt;
+
+&lt;script&gt;
+  function doFinish() {
+    var element = document.getElementById("foo");
+    element.innerHTML = "Cargado.";
+  }
+&lt;/script&gt;
+...
+</pre>
+<p>Tales problemas relativos a la duración de la ejecución están también relacionados con el hardware; los sistemas más lentos pueden mostar fallos que los más rápidos no provocan. Un ejemplo en concreto se puede encontrar en <code>window.open</code>, el cual abre una nueva ventana:</p>
+<pre>&lt;script&gt;
+  function doOpenWindow(){
+    var myWindow = window.open("about:blank");
+    myWindow.location.href = "http://www.ibm.com";
+  }
+&lt;/script&gt;
+</pre>
+<p>El problema con el código es que <code>window.open</code> es asíncrono lo que implica que no se bloquee la ejecución de JavaScript hasta que la ventana haya terminado de cargarse. Por tanto, se puede ejecutar la línea siguiente a la línea <code>window.open</code> antes de que la nueva ventana haya terminado de cargarse. Se puede lidiar con esto poniendo un manejador <code>onload</code> en la nueva ventana y luego llamar desde ahí a la ventana padre (usando <code>window.opener</code>).</p>
+<h4 id="Diferencias_en_la_generaci.C3.B3n_HTML_de_JavaScript" name="Diferencias_en_la_generaci.C3.B3n_HTML_de_JavaScript">Diferencias en la generación HTML de JavaScript</h4>
+<p>JavaScript puede generar, a través de <code>document.write</code>, código HTML al vuelo a partir de una cadena de texto. El principal problema es cuando JavaScript está embebido dentro del documento HTML (es decir, dentro de la etiqueta <code>&lt;script&gt;</code>) y genera HTML que contiene una etiqueta <code>&lt;script&gt;</code>. Si el documento está en modo estricto de visualización, entonces se analizará la etiqueta <code>&lt;/script&gt;</code> que se halla dentro de la cadena como la etiqueta de cierre de la etiqueta <code>&lt;script&gt;</code> que la contiene. El siguiente código ilustra mejor esto:</p>
+<pre>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
+...
+&lt;script&gt;
+  document.write("&lt;script type='text\/javascript'&gt;alert('Hola');&lt;\/script&gt;")
+&lt;/script&gt;
+</pre>
+<p>Dado que la página está en modo estricto, el analizador de Mozilla verá el primer <code>&lt;script&gt;</code> y lo analizará hasta que encuentre la etiqueta de cierre correspondiente, que será cuando encuentre el primer <code>&lt;/script&gt;</code>. Se hace así porque el analizador no tiene conocimiento de la existencia de JavaScript (o cualquier otro lenguaje) cuando está en modo estricto. En modo quirks, el analizador conoce de la existencia de JavaScript cuando trabaja (algo que lo ralentiza). Internet Explorer siempre funciona en modo quirks porque no soporta el auténtico XHTML. Para hacer que esto funcione en modo estricto en Mozilla se puede separar la cadena en dos partes:</p>
+<pre>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
+...
+&lt;script&gt;
+  document.write("&lt;script type='text\/javascript'&gt;alert('Hola');&lt;/" + "script&gt;")
+&lt;/script&gt;
+</pre>
+<h4 id="Depurando_JavaScript" name="Depurando_JavaScript">Depurando JavaScript</h4>
+<p>Mozilla proporciona varias formas de depurar los fallos relacionados con JavaScript encontrados en las aplicaciones creadas para Internet Explorer. La primera herramienta es la consola integrada de JavaScript, mostrada en la figura 1, donde los errores y los avisos quedan registrados. Puedes acceder a ella en Mozilla yendo al menú <strong>Herramientas -&gt; Desarrollo web -&gt; Consola JavaScript</strong>, en Firefox 2.0 (el navegador ligero de Mozilla) en <strong>Herramientas -&gt; Consola de errores</strong>.</p>
+<p>Figura 1. Consola JavaScript</p>
+<p><img alt="Javascript Console"></p>
+<p>La consola JavaScript puede mostrar el registro completo o sólo los errores, avisos o mensajes. El mensaje de error de la figura 1 dice que en aol.com, la línea 95 ha intentado acceder a una variable no definida llamada is_ns70. Al hacer clic en el enlace se abrira el visualizador de código interno de Mozilla con la línea en cuestión resaltada.</p>
+<p>La consola además permite evaluar JavaScript. Para probar la sintaxis de JavaScript introducida, se puede escribir <code>1+1</code> en el campo de entrada y pulsar <strong>Evaluar</strong>, como muestra la figura 2.</p>
+<p>Figure 2. Evaluación en la consola de JavaScript</p>
+<p><img alt="JavaScript Console evaluating"></p>
+<p>El motor de JavaScript en Mozilla tiene integrado el soporte para la depuración convirtiéndose así en una potente herramienta para los desarrolladores de JavaScript. Venkman, mostrado en la figura 3, es un potente depurador multinavegador para JavaScript que se integra con Mozilla. Generalmente es empaquetado con los lanzamientos de Mozilla y puede ser encontrado en <strong>Herramientas -&gt; Desarrollo web -&gt; Depurador Javascript</strong>. En Firefox, el navegador no viene incluido. En lugar de eso, se puede descargar e instalar desde la <a class="external" href="http://www.mozilla.org/projects/venkman/">página del proyecto Venkman</a>. Además se pueden encontrar tutoriales en la página de desarrollo, ubicada en la <a class="external" href="http://www.hacksrus.com/%7Eginda/venkman/">página de desarrollo de Venkman</a>.</p>
+<p>Figura 3. Depurador de JavaScript de Mozilla</p>
+<p><img alt="Mozilla's JavaScript debugger"></p>
+<p>El depurador de JavaScript puede depurar el código JavaScript que se ejecuta en la ventana del navegador de Mozilla. Soporta características estándar de depuración tales como puntos de interrupciones, revisión de la pila de llamadas e inspección de variables/objetos. Todas las caracterísitcas son accesibles a través de la interfaz de usuario y a través de la consola interactiva del depurador. Con la consola, se puede ejecutar código JavaScript arbitrario del mismo ámbito en el que JavaScript está siendo depurado.</p>
+<h3 id="Diferencias_en_CSS" name="Diferencias_en_CSS">Diferencias en CSS</h3>
+<p>Todos los productos basados en Mozilla poseen un fuerte soporte para CSS (hojas de estilo en cascada), en comparación con Internet Explorer y el resto de navegadores, ya que soportan la mayoría de CSS 1, CSS 2.1 y parte de CSS 3.</p>
+<p>Para la mayoría de los problemas que se mostrarán a continuación, Mozilla mostrará un aviso o un error en la consola JavaScript. Se aconseja comprobar la consola JavaScript si se encuentran problemas relacionados con CSS.</p>
+<h4 id="Tipos_MIME_.28cuando_no_se_aplican_a_los_ficheros_CSS.29" name="Tipos_MIME_.28cuando_no_se_aplican_a_los_ficheros_CSS.29">Tipos MIME (cuando no se aplican a los ficheros CSS)</h4>
+<p>El problema más común relacionado con CSS ocurre cuando las definiciones CSS que se hallan dentro de los ficheros CSS referenciados no se aplican. Esto generalmente se debe a que el servidor envía un tipo MIME incorrecto para el fichero CSS. La especificación CSS dice que los ficheros CSS deberían ser servidos con el tipo MIME <code>text/css</code>. Mozilla respetará esto y sólo cargará los ficheros CSS con ese tipo MIME si la página web está en modo estricto de estándares. Internet Explorer siempre cargará el fichero CSS sin importar el tipo MIME con el que haya sido servido. Se considera que las páginas web están en modo estricto de estándares cuando comienzan con un doctype (tipo de documento) estricto. Para solventar este problema, se puede optar por hacer que el servidor envíe el tipo MIME correcto o eliminando el doctype. Se explicarán más a fondo los doctypes en la siguiente sección.</p>
+<h4 id="CSS_y_las_unidades" name="CSS_y_las_unidades">CSS y las unidades</h4>
+<p>Muchas aplicaciones web no usan unidades en sus hojas CSS, especialmente cuando se usa JavaScript para establecer el CSS. Mozilla permite esto sólo si la página no se visualiza en modo estricto. Dado que Internet Explorer no soporta el auténtico XHTML, no se preocupa por saber si se han especificado o no las unidades. Si la página está en modo estricto de estándares y no se usan unidades entonces Mozilla ignorará dicho estilo.</p>
+<pre class="eval">&lt;DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+  "<span class="nowiki">http://www.w3.org/TR/html4/strict.dtd</span>"&gt;
+&lt;html&gt;
+  &lt;head&gt;
+   &lt;meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"&gt;
+   &lt;title&gt;CSS y unidades - Ejemplo&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    // funciona en modo estricto
+    &lt;div style="width: 40<span class="boldcode">px</span>; border: 1px solid black;"&gt;
+      Text
+    &lt;/div&gt;
+</pre>
+<pre class="eval">    // peta en modo estricto
+    &lt;div style="width: 40; border: 1px solid black;"&gt;
+      Text
+    &lt;/div&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+<p>Debido a que el ejemplo de antes tiene un doctype estricto, la página se visualizará en modo estricto de estándares. El primer div tendrá una anchura de 40px dado que se han usado unidades, pero el segundo div no tendrá anchura definida y se le asignará aquella por defecto (100%). Pasaría lo mismo si se estableciese la anchura a través de JavaScript.</p>
+<h4 id="JavaScript_y_CSS" name="JavaScript_y_CSS">JavaScript y CSS</h4>
+<p>Dado que Mozilla soporta los estándares CSS, también soporta el estándar DOM de CSS para poder establecer el estilo CSS a través de JavaScript. Se puede acceder a, eliminar y cambiar cualquier regla CSS de un elemento a través de su miembro <code>style</code>:</p>
+<pre>&lt;div id="myDiv" style="border: 1px solid black;"&gt;
+  Text
+&lt;/div&gt;
+
+&lt;script&gt;
+  var myElm = document.getElementById("myDiv");
+  myElm.style.width = "40px";
+&lt;/script&gt;
+</pre>
+<p>Igualmente se puede acceder a cada atributo CSS de la misma forma. De nuevo, si la página web está en modo estricto, se debe establecer una unidad o, en caso contrario, Mozilla ignorará el comando. Cuando se consulte un valor, digamos <code>.style.width</code>, Mozilla e Internet Explorer devolverán una cadena de texto incluyendo la unidad. Se puede convertir dicha cadena en un número a través de <code>parseFloat("40px")</code>.</p>
+<h4 id="Diferencias_en_la_propiedad_CSS_overflow" name="Diferencias_en_la_propiedad_CSS_overflow">Diferencias en la propiedad CSS overflow</h4>
+<p>Con CSS, se introduce el concepto de overflow que permite definir cómo se maneja el rebasamiento, por ejemplo, cuando la altura del contenido de un <code>div</code> es mayor que la altura del propio <code>div</code>. El estándar CSS indica que en caso de rebosamiento, si no se ha establecido dicho comportamiento, el contenido del <code>div</code> debe de rebosar.</p>
+<p>Sin embargo, Internet Explorer no cumple esto y alargará el <code>div</code> más allá de su altura hasta que pueda albergar correctamente su contenido. Más abajo hay un ejemplo que muestra esta diferencia:</p>
+<pre>&lt;div style="height: 100px; border: 1px solid black;"&gt;
+  &lt;div style="height: 150px; border: 1px solid red; margin: 10px;"&gt;
+    a
+  &lt;/div&gt;
+&lt;/div&gt;
+</pre>
+<p>Como se puede apreciar en la figura 4, Mozilla reacciona como especifican los estándares del W3C. Dichos estándares dicen que, en este caso, el <code>div</code> interior debería rebosar por la parte inferior dado que su contenido es más alto que el de su padre. Si se prefiere utilizar el comportamiento de Internet Explorer, simplemente no habría que especificar ninguna altura para el elemento exterior.</p>
+<p>Figura 4. Rebosamiento DIV</p>
+<p><img alt="DIV Overflow"></p>
+<h4 id="Diferencias_con_la_pseudoclase_:hover" name="Diferencias_con_la_pseudoclase_:hover">Diferencias con la pseudoclase :hover</h4>
+<p>El comportamiento no estándar de la pseudoclase CSS :hover ocurre en un gran número de sitios web. Generalmente se manifiesta por sí mismo cambiando el estilo de texto cuando el cursor del ratón se sitúa sobre un elemento en Mozilla, pero no en Internet Explorer. Esto es así porque el selector CSS <code>a:hover</code> en Internet Explorer coincide con <code>&lt;a href=""&gt;...&lt;/a&gt;</code> pero no con <code>&lt;a name=""&gt;...&lt;/a&gt;</code>, el cual establece los anclajes en HTML. El cambio de texto ocurre porque los autores encapsulan áreas con el etiquetado de anclajes:</p>
+<pre>CSS:
+  a:hover {color: green;}
+
+HTML:
+  &lt;a href="foo.com"&gt;Este texto debería volverse verde cuando el cursor del ratón se sitúe sobre él.&lt;/a&gt;
+
+  &lt;a name="anchor-name"&gt;
+    Este texto debería cambiar el color cuando fuese sobrevolado con el cursor pero no ocurre en Internet Explorer.
+  &lt;/a&gt;
+</pre>
+<p>Mozilla sigue la especificación CSS correctamente y cambiará el color a verde en este ejemplo. Se pueden utilizar dos formas para que Mozilla se comporte como Internet Explorer y no cambie el color del texto cuando éste sea sobrevolado:</p>
+<ul>
+ <li>Primero, se puede cambiar la regla CSS para que sea <code>a:link:hover {color: green;}</code>, lo que provocará que sólo se cambie el color si un elemento es un enlace (tiene un atributo <code>href</code>).</li>
+ <li>Alternativamente, es posible cambiar el marcado y cerrar la <code>&lt; a/&gt;</code> abierta antes de que empiece el texto; el anclaje continuará funcionando de este modo.</li>
+</ul>
+<h3 id="Modo_quirks_vs._modo_est.C3.A1ndar" name="Modo_quirks_vs._modo_est.C3.A1ndar">Modo quirks vs. modo estándar</h3>
+<p>Los antiguos navegadores, como Internet Explorer 4, visualizaban los documentos bajo ciertas condiciones con el llamado modo quirks (modo chapucero). Aunque Mozilla apunta a convertirse en un navegador respetuoso con los estándares, posee 3 modos que permiten soportar las antiguas páginas creadas para comportarse de ese modo tan peculiar. El contenido de la página y la forma en la que nos es enviada determinan el modo que Mozilla debe de utilizar. Mozilla muestra dicho modo en <strong>Ver -&gt; Información de página</strong> (o <code>Ctrl+I</code>) y Firefox lo hace en <strong>Herramientas -&gt; Información de la página</strong>. El modo en el que una página es visualizada depende de su doctype.</p>
+<p>Los doctypes (contracción inglesa para las declaraciones de tipos de documento) tiene este aspecto:</p>
+<p><code>&lt;!DOCTYPE HTML PUBLIC <span style="color: blue;">"-//W3C//DTD HTML 4.01 Transitional//EN"</span> <span style="color: green;">"<span class="nowiki">http://www.w3.org/TR/html4/loose.dtd</span>"</span>&gt;</code></p>
+<p>La parte azul es llamada identificador público, la verde es el identificador de sistema que es un URI.</p>
+<h4 id="Modo_est.C3.A1ndar" name="Modo_est.C3.A1ndar">Modo estándar</h4>
+<p>El modo estándar es el modo de visualización más estricto: visualizará las páginas según las especificaciones HTML y CSS del W3C y no permitirá ninguna chapuza. Mozilla lo usa bajo las siguientes condiciones:</p>
+<ul>
+ <li>Cuando una página es enviada con un tipo MIME igual a <code>text/xml</code> o cualquier otro tipo MIME XML o XHTML.</li>
+ <li>Con cualquier doctype "DOCTYPE HTML SYSTEM" (por ejemplo, <code>&lt;!DOCTYPE HTML SYSTEM "<span class="nowiki">http://www.w3.org/TR/REC-html40/strict.dtd</span>"&gt;</code>), exceptuando el doctype de IBM</li>
+ <li>Cuando se especifique un doctype desconocido o éste no esté asociado a un DTD.</li>
+</ul>
+<h4 id="Modo_casi_est.C3.A1ndar" name="Modo_casi_est.C3.A1ndar">Modo <em>casi</em> estándar</h4>
+<p>Mozilla introdujo el modo <em>casi</em> estándar por una razón: una sección en la especificación CSS 2 daba al traste con los diseños que se basaban en la maquetación con tablas que contenían pequeñas imágenes. El usuario, en lugar de ver una imagen completa, veía cada imagen separada con un pequeño espacio en blanco. La antigua página de IBM mostrada en la figura 5 es un ejemplo de ello.</p>
+<p>Figura 5. Hueco en imágenes</p>
+<p><img alt="Image Gap"></p>
+<p>El modo <em>casi</em> estándar se comporta de modo muy parecido al modo estándar exceptuando el problema del hueco en imágenes. Este problema ocurre frecuentemente en páginas diseñadas acorde a los estándares y hace que se muestren incorrectamente.</p>
+<p>Mozilla utiliza el modo <em>casi</em> estándar bajo las siguientes condiciones:</p>
+<ul>
+ <li>Ante cualquier doctype de tipo "loose" (obsoleto), por ejemplo <code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"&gt;</code>, <code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<span class="nowiki">http://www.w3.org/TR/html4/loose.dtd</span>"&gt;</code></li>
+ <li>Para el doctype de IBM (<code>&lt;!DOCTYPE html SYSTEM "<span class="nowiki">http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd</span>"&gt;</code>)</li>
+</ul>
+<p>Para más información, véase el <a href="/es/Im%C3%A1genes,_tablas_y_huecos_misteriosos" title="es/Imágenes,_tablas_y_huecos_misteriosos">problema de los huecos con imágenes</a></p>
+<h4 id="Modo_quirks" name="Modo_quirks">Modo quirks</h4>
+<p>Actualmente, el web está plagado de sitios con HTML no válido, además de marcado que sólo funciona gracias a fallos de ciertos navegadores. Los antiguos navegadores de Netscape, cuando eran los amos del mercado, tenían fallos. Cuando desembarcó Internet Explorer, plagió esos mismos fallos para poder visualizar correctamente las páginas de aquella época. Más tarde cuando los nuevos navegadores llegaron al mercado, la mayoría de estos fallos originales, usualmente llamados <strong>quirks</strong>, fueron mantenidos por razones de compatibilidad hacia atrás. Mozilla soporta muchos de estos fallos cuando visualiza páginas en modo quirks. Nótese que debido a estos quirks, las páginas se visualizan más lentamente que si estuvieran escritas para respetar los estándares. La mayoría de las páginas web son visualizadas utilizando este modo.</p>
+<p>Mozilla utiliza este modo cuando encuentra las siguientes condiciones:</p>
+<ul>
+ <li>Cuando no se ha especificado un doctype.</li>
+ <li>Cuando se ha especificado un doctype sin su identificador de sistema (por ejemplo, &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt;&lt;/code&gt;)</li>
+</ul>
+<p>Para más información, véase <a href="/es/Mozilla_Quirks_Mode_Behavior" title="es/Mozilla_Quirks_Mode_Behavior">Mozilla Quirks Mode Behavior</a> and <a href="/es/Mozilla's_DOCTYPE_sniffing" title="es/Mozilla's_DOCTYPE_sniffing">Mozilla's DOCTYPE sniffing</a>.</p>
+<h3 id="Diferencias_en_eventos" name="Diferencias_en_eventos">Diferencias en eventos</h3>
+<p>Mozilla e Internet Explorer son prácticamente incompatibles en cuanto al manejo de eventos se refiere. El modelo de eventos de Mozilla sigue al del W3C y al de Netscape. En Internet Explorer, si una función es llamada desde un evento, se puede acceder al objeto <code>event</code> a través de <code>window.event</code>. En cambio Mozilla pasa un objeto <code>event</code> a los manejadores de eventos. Éstos deben de pasar específicamente el objeto a la función llamada a través de un argumento. A continuación se muestra un ejemplo multiplataforma de manejador de evento:</p>
+<pre>&lt;div onclick="handleEvent(event);"&gt;Click me!&lt;/div&gt;
+
+&lt;script&gt;
+  function handleEvent(evento) {
+    // if evento es null, significa que es el modelo de eventos de IE
+    // así que se utiliza window.event
+    var miEvento = evento ? evento : window.event;
+  }
+&lt;/script&gt;
+</pre>
+<p>A veces, esto no funciona ya que Internet Explorer <em>coge</em> el parámetro <code>evento</code>, identificándolo como no nulo, lo que en el códico provoca que no se pueda asignar window.event. La solución consiste en comprobar la propiedad window.event:</p>
+<pre>&lt;div onclick="handleEvent(event);"&gt;Click me!&lt;/div&gt;
+
+&lt;script&gt;
+  function handleEvent(aEvent) {
+    var myEvent = window.event ? window.event : aEvent;
+  }
+&lt;/script&gt;
+</pre>
+<p>Las propiedades y funciones que el objeto <code>event</code> muestra son nombradas con frecuencia de forma diferente entre Mozilla e Internet Explorer, como muestra la tabla 4:</p>
+<table class="standard-table">
+ <caption>
+  Tabla 4. Diferencias entre las propiedades de eventos entre Mozilla e Internet Explorer</caption>
+ <tbody>
+  <tr>
+   <th>Nombre en Internet Explorer</th>
+   <th>Nombre en Mozilla</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>altKey</td>
+   <td>altKey</td>
+   <td>Propiedad booleana que indica si la tecla <code>alt</code> estaba pulsada durante el evento.</td>
+  </tr>
+  <tr>
+   <td>cancelBubble</td>
+   <td>stopPropagation()</td>
+   <td>Usado para evitar que el evento sea propagado hacia los elementos ancestros en el árbol.</td>
+  </tr>
+  <tr>
+   <td>clientX</td>
+   <td>clientX</td>
+   <td>Coordenada X del evento, relativa al viewport.</td>
+  </tr>
+  <tr>
+   <td>clientY</td>
+   <td>clientY</td>
+   <td>Coordenada Y del evento, relativa al viewport.</td>
+  </tr>
+  <tr>
+   <td>ctrlKey</td>
+   <td>ctrlKey</td>
+   <td>Propiedad booleana que indica si la tecla <code>Ctrl</code> estaba pulsada durante el evento.</td>
+  </tr>
+  <tr>
+   <td>fromElement</td>
+   <td>relatedTarget</td>
+   <td>Para eventos de ratón, es el elemento desde el que partió el cursor del ratón.</td>
+  </tr>
+  <tr>
+   <td>keyCode</td>
+   <td>keyCode</td>
+   <td>Para eventos de teclado, es el número que representa a la tecla que estaba pulsada. 0 para los eventos de ratón.</td>
+  </tr>
+  <tr>
+   <td>returnValue</td>
+   <td>preventDefault()</td>
+   <td>Usado para evitar que se ejecute la acción por defecto del evento.</td>
+  </tr>
+  <tr>
+   <td>screenX</td>
+   <td>screenX</td>
+   <td>Coordenada X del evento, relativa a la pantalla.</td>
+  </tr>
+  <tr>
+   <td>screenY</td>
+   <td>screenY</td>
+   <td>Coordenada Y del evento, relativa a la pantalla.</td>
+  </tr>
+  <tr>
+   <td>shiftKey</td>
+   <td>shiftKey</td>
+   <td>Propiedad booleana que indica si la tecla <code>shift</code> estaba pulsada durante el evento.</td>
+  </tr>
+  <tr>
+   <td>srcElement</td>
+   <td>target</td>
+   <td>El elemento que provocó el evento.</td>
+  </tr>
+  <tr>
+   <td>toElement</td>
+   <td>currentTarget</td>
+   <td>Para eventos de ratón, es el elemento al que el ratón se dirigió cuando terminó el mismo.</td>
+  </tr>
+  <tr>
+   <td>type</td>
+   <td>type</td>
+   <td>Devuelve el nombre del evento.</td>
+  </tr>
+ </tbody>
+</table>
+<h4 id="A.C3.B1adir_manejadores_de_eventos" name="A.C3.B1adir_manejadores_de_eventos">Añadir manejadores de eventos</h4>
+<p>Mozilla posee dos formas de añadir eventos a través de JavaScript. El primero, soportado por todos los navegadores, consiste en establecer propiedades de eventos directamente en los objetos. Para asignar un manejador de evento al evento <code>click</code> hay que pasar una referencia a dicha función manejadora a la propiedad <code>onclick</code> del objeto.</p>
+<pre>&lt;div id="myDiv"&gt;Click me!&lt;/div&gt;
+
+&lt;script&gt;
+  function handleEvent(aEvent) {
+    // if aEvent is null, means the Internet Explorer event model,
+    // so get window.event.
+    var myEvent = aEvent ? aEvent : window.event;
+  }
+
+  function onPageLoad(){
+    document.getElementById("myDiv").onclick = handleEvent;
+  }
+&lt;/script&gt;
+</pre>
+<p>Mozilla soporta al 100% la forma estándar del W3C para añadir <em>escuchadores</em> a los nodos del DOM: usando los métodos <code>addEventListener()</code> y <code>removeEventListener()</code>; y además con el beneplácito de poder añadir múltiples escuchadores para un mismo tipo de evento. Ambos métodos necesitan tres parámetros: el tipo de evento, una referencia a la función y un valor booleano que indica si el escuchador debe de capturar los eventos en su fase <em>captura</em>. Si el booleano es puesto a false, sólo capturará los eventos en la fase <em>burbuja</em>. Los eventos del W3C tienen tres fases: captura, objetivo y burbuja. Cada objeto <code>event</code> tiene un atributo <code>eventPhase</code> que indica la fase en la que se encuentra el evento mediante un número de base 0. Cuando se provoca un evento, éste comienza en el elemento más externamente situado del DOM, o sea, en el elemento superior del árbol DOM. Luego va atravesando el DOM usando el camino más corto hacia el objetivo. Estamos en la fase de <strong>captura</strong>. Cuando el evento alcanza al objetivo, el evento está en la fase <strong>objetivo</strong>. Tras alcanzar el objetivo, regresa por el árbol hasta alcanzar de nuevo el nodo más exteriormente situado. Esta es la fase <strong>burbuja</strong>. El modelo de eventos de Internet Explorer sólo tiene la fase burbuja por lo que estableciendo el tercer parámetro a false se conseguirá un comportamiento igual al de Internet Explorer.</p>
+<pre>&lt;div id="myDiv"&gt;Click me!&lt;/div&gt;
+
+&lt;script&gt;
+
+  function handleEvent(aEvent) {
+    // if aEvent is null, it is the Internet Explorer event model,
+    // so get window.event.
+    var myEvent = aEvent ? aEvent : window.event;
+  }
+
+  function onPageLoad() {
+    var element = document.getElementById("myDiv");
+    element.addEventListener("click", handleEvent, false);
+  }
+&lt;/script&gt;
+</pre>
+<p>Una ventaja de <code>addEventListener()</code> y <code>removeEventListener()</code> sobre asignar las propiedades es que se pueden tener múltiples escuchadores de eventos para el mismo evento, cada cual llamando a una función diferente. Así, para eliminar un escuchador de evento se necesita que los tres parámetros sean los mismos que se usaron para añadir el escuchador.</p>
+<p>Mozilla no soporta el método de Internet Explorer de convertir etiquetas &lt;script&gt; en manejadores de eventos, la cual amplía a &lt;script&gt; con los atributos <code>for</code> y <code>event</code> (véase tabla 5). Tampoco suporta los métodos <code>attachEvent</code> ni <code>detachEvent</code>. En vez de eso, se deberían de usar los métodos <code>addEventListener</code> y <code>removeEventListener</code>. Internet Explorer no soporta la especificación de eventos del W3C.</p>
+<table class="standard-table">
+ <caption>
+  Tabla 5. Diferencias en los métodos de eventos entre Mozilla e Internet Explorer</caption>
+ <tbody>
+  <tr>
+   <th>Método de Internet Explorer</th>
+   <th>Método de Mozilla</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>attachEvent(tipoEvento, referenciaFuncion)</td>
+   <td>addEventListener(tipoEvento, referenciaFuncion, usarCaptura)</td>
+   <td>Añade un manejador de evento a un elemento del DOM</td>
+  </tr>
+  <tr>
+   <td>detachEvent(tipoEvento, referenciaFuncion)</td>
+   <td>removeEventListener(tipoEvento, referenciaFuncion, usarCaptura)</td>
+   <td>Elimina un manejador de evento a un elemento del DOM</td>
+  </tr>
+ </tbody>
+</table>
+<h3 id="Edici.C3.B3n_de_texto_enriquecido" name="Edici.C3.B3n_de_texto_enriquecido">Edición de texto enriquecido</h3>
+<p>Aunque Mozilla está orgulloso de ser el navegador más compatible con los estándares del W3C, sigue soportando funcionalidades no estándar, tales como <code>innerHTML</code> o <a href="/es/Midas" title="es/Midas">editores de texto enriquecido</a>, al no existir los equivalentes del W3C.</p>
+<p>Con Mozilla 1.3 se introdujo una implementación de la característica <a href="/es/Rich-Text_Editing_in_Mozilla/Class_xbDesignMode" title="es/Rich-Text_Editing_in_Mozilla/Class_xbDesignMode">designMode</a> de Internet Explorer, la cual convierte a un documento HTML en un editor de texto enriquecido.</p>
+<p>Una vez se ha cambiado al editor, los comandos pueden ser ejecutados en el documento a través del comando <code>execCommand</code>. Mozilla no soporta el atributo <code>contentEditable</code> de Internet Explorer para hacer editable cualquier control. Se puede usar un <code>iframe</code> para crear un editor de texto enriquecido.</p>
+<h4 id="Diferencias_en_el_texto_enriquecido" name="Diferencias_en_el_texto_enriquecido">Diferencias en el texto enriquecido</h4>
+<p>Mozilla soporta el método estándar del W3C para acceder al objeto <code>document</code> del iframe a través de <code>IFrameElmRef.contentDocument</code> mientras que Internet Explorer lo hace a través de <code>document.frames{{ mediawiki.external('\"IframeName\"') }}</code> y luego accede al <code>document</code> resultante.</p>
+<pre>&lt;script&gt;
+function getIFrameDocument(aID) {
+  var rv = null;
+
+  // if contentDocument existe, entonces es compatible con el W3C (Mozilla)
+  if (document.getElementById(aID).contentDocument){
+    rv = document.getElementById(aID).contentDocument;
+  } else {
+    // IE
+    rv = document.frames[aID].document;
+  }
+  return rv;
+}
+&lt;/script&gt;
+</pre>
+<p>Otra diferencia entre Mozilla e Internet Explorer es el HTML que crea el editor de texto enriquecido. Por defecto, Mozilla usa CSS para generar marcado. Sin embargo, Mozilla permite alternar entre el modo HTML y CSS usando el comando <code>useCSS</code> del execCommand cambiándolo entre true y false. Internet Explorer siempre usa el marcado HTML.</p>
+<pre>Mozilla (CSS):
+  &lt;span style="color: blue;"&gt;Azul&lt;/span&gt;
+
+Mozilla (HTML):
+  &lt;font color="blue"&gt;Azul&lt;/font&gt;
+
+Internet Explorer:
+  &lt;FONT color="blue"&gt;Azul&lt;/FONT&gt;
+</pre>
+<p>Más abajo hay una lista de comandos soportados por execCommand en Mozilla:</p>
+<table class="standard-table">
+ <caption>
+  Tabla 6. Comandos del editor de texto enriquecido.</caption>
+ <tbody>
+  <tr>
+   <th>Nombre</th>
+   <th>Descripción</th>
+   <th>Argumentos</th>
+  </tr>
+  <tr>
+   <td>bold</td>
+   <td>Alterna el modo en negrita de la selección.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>createlink</td>
+   <td>Genera un enlace HTML a partir del texto seleccionado.</td>
+   <td>URL a usar para el enlace</td>
+  </tr>
+  <tr>
+   <td>delete</td>
+   <td>Borra la selección.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>fontname</td>
+   <td>Cambia la fuente del texto seleccionado.</td>
+   <td>Nombre de la fuente (por ejemplo, Arial)</td>
+  </tr>
+  <tr>
+   <td>fontsize</td>
+   <td>Cambia el tamaño del texto seleccionado.</td>
+   <td>Tamaño de la fuente</td>
+  </tr>
+  <tr>
+   <td>fontcolor</td>
+   <td>Cambia el color de la fuente del texto seleccionado.</td>
+   <td>Color a usar</td>
+  </tr>
+  <tr>
+   <td>indent</td>
+   <td>Indenta el bloque donde el se encuentra el cursor.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>inserthorizontalrule</td>
+   <td>Inserta un elemento &lt;hr&gt; en la posición del cursor.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>insertimage</td>
+   <td>Inserta una imagen en la posición del cursor.</td>
+   <td>URL de la imagen</td>
+  </tr>
+  <tr>
+   <td>insertorderedlist</td>
+   <td>Inserta un elemento de lista ordeanda (&lt;ol&gt;) en la posición del cursor.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>insertunorderedlist</td>
+   <td>Inserta un elemento de lista no ordenada (&lt;ul&gt;) en la posición del cursor.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>italic</td>
+   <td>Alterna el modo en cursiva de la selección.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>justifycenter</td>
+   <td>Centra el contenido de la línea actual.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>justifyleft</td>
+   <td>Alinea el contenido de la línea actual a la izquierda.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>justifyright</td>
+   <td>Alinea el contenido de la línea actual a la derecha.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>outdent</td>
+   <td>Elimina la indentación del bloque donde se halla el cursor.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>redo</td>
+   <td>Rehace el anterior comando deshecho.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>removeformat</td>
+   <td>Elimina todo el formato de la selección.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>selectall</td>
+   <td>Selecciona todo el texto del editor.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>strikethrough</td>
+   <td>Alterna el modo tachado del texto seleccionado.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>subscript</td>
+   <td>Convierte la selección actual a subíndice.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>superscript</td>
+   <td>Convierte la selección actual a superíndice.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>underline</td>
+   <td>Alterna el modo subrayado del texto seleccionado.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>undo</td>
+   <td>Deshace el último comando ejecutado.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>unlink</td>
+   <td>Elimina toda la información sobre enlaces de la selección.</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>useCSS</td>
+   <td>Alterna el uso de CSS en el marcado generado.</td>
+   <td>Valor booleano</td>
+  </tr>
+ </tbody>
+</table>
+<p>Para más información, véase <a href="/es/Rich-Text_Editing_in_Mozilla" title="es/Rich-Text_Editing_in_Mozilla">Rich-Text Editing in Mozilla</a></p>
+<h3 id="Diferencias_en_XML" name="Diferencias_en_XML">Diferencias en XML</h3>
+<p>Mozilla posee un fuerte soporte para XML y todas sus tecnologías relacionadas, tales como XSLT y servicios web. Además soporta algunas extensiones no estándar de Internet Explorer, tales como XMLHttpRequest.</p>
+<h4 id="C.C3.B3mo_manejar_XMLs" name="C.C3.B3mo_manejar_XMLs">Cómo manejar XMLs</h4>
+<p>Al igual que ocurre con el estándar HTML, Mozilla soporta la especificación del DOM para XML del W3C, la cual permite manipular prácticamente cualquier aspecto de cualquier documento XML. Las diferencias entre el DOM para XML de Internet Explorer y Mozilla son provocadas por el comportamiento no estándar de Internet Explorer. Probablemente la diferencia más común es cómo ambos manejan los espacios en blanco en los nodos de texto. Con frecuencia cuando se genera un XML, contiene espacios en blanco entre los nodos XML. Internet Explorer, cuando usa <code>XMLNode.childNodes[]</code> no contendrá estos nodos de espacios en blanco. En Mozilla, estos nodos se incluirán en el vector.</p>
+<pre>XML:
+  &lt;?xml version="1.0"?&gt;
+  &lt;myXMLdoc xmlns:myns="http://myfoo.com"&gt;
+    &lt;myns:foo&gt;bar&lt;/myns:foo&gt;
+  &lt;/myXMLdoc&gt;
+
+JavaScript:
+  var myXMLDoc = getXMLDocument().documentElement;
+  alert(myXMLDoc.childNodes.length);
+</pre>
+<p>La primera línea de JavaScript carga el documento XML y accede a su elemento ráiz (<code>myXMLDoc</code>) recuperando el <code>documentElement</code>. La segunda línea simplemente muestra el número de nodos hijos. Para la especificación del W3C, los espacios en blanco y los retornos de carro se unen bajo un nodo de texto si uno es seguido del otro. Para Mozilla, el nodo <code>myXMLdoc</code> tiene tres hijos: un nodo de texto que contiene un retorno de carro y dos espacios, el nodo <code>myns:foo</code>, y otro nodo de texto con un retorno de carro. No obstante, Internet Explorer no obedece esto y devolverá "1" para el anterior código, considerando sólamente el nodo <code>myns:foo</code> Por elli, para recorrer los nodos hijos y desechar los nodos de texto se deben distinguir tales nodos del resto.</p>
+<p>Como se mencionó antes, cada nodo tiene un atributo <code>nodeType</code> que representa el tipo de nodo. Por ejemplo, un nodo elemento tiene tipo 1 mientras que un nodo documento posee tipo 9. Para distinguir los nodos de texto se deben buscar los nodos de tipo 3 (nodos de texto) y los de tipo 8 (nodos comentario).</p>
+<pre>XML:
+  &lt;?xml version="1.0"?&gt;
+  &lt;myXMLdoc xmlns:myns="http://myfoo.com"&gt;
+    &lt;myns:foo&gt;bar&lt;/myns:foo&gt;
+  &lt;/myXMLdoc&gt;
+
+JavaScript:
+  var myXMLDoc = getXMLDocument().documentElement;
+  var myChildren = myXMLDoc.childNodes;
+
+  for (var run = 0; run &lt; myChildren.length; run++){
+    if ( (myChildren[run].nodeType != 3) &amp;&amp;
+          myChildren[run].nodeType != 8) ){
+      // not a text or comment node
+    };
+  };
+</pre>
+<h4 id="Islas_de_datos_XML" name="Islas_de_datos_XML">Islas de datos XML</h4>
+<p>Internet Explorer posee una peculiaridad no estándar llamada <em>islas de datos XML (XML data islands)</em>, que permite incrustar XML dentro de un documento HTML usando la etiqueta HTML no estándar <code>&lt;xml&gt;</code>. Mozilla no soporta las islas de datos XML y las maneja como etiquetas HTML desconocidas. Se puede obtener la misma funcionalidad utilizando XHTML, sin embargo, debido a que el soporte de Internet Explorer para XHTML es débil, esto no es generalmente una opción.</p>
+<p>Una solución multiplataforma es usar analizadores DOM que generan, a partir de un documento XML serializado, el documento XML analizado. Mozilla usa la clase <code>DOMParser</code> la cual toma una cadena serializada crea un documento XML a partir de ella. En Internet Explorer se puede obtener la misma funcionalidad usando ActiveX. El nuevo <code>Microsoft.XMLDOM</code> genera y posee el método un método llamado <code>loadXML</code> que acepta una cadena de texto y genera un documento a partir de ella. El siguiente código muestra su funcionamiento:</p>
+<p> </p>
+<pre>Isla de datos XML para IE
+  ..
+  &lt;xml id="xmldataisland"&gt;
+    &lt;foo&gt;bar&lt;/foo&gt;
+  &lt;/xml&gt;
+
+Solución multiplataforma:
+  var xmlString = "&lt;xml id=\"xmldataisland\"&gt;&lt;foo&gt;bar&lt;/foo&gt;&lt;/xml&gt;";
+
+  var myDocument;
+
+  if (document.implementation.createDocument){
+    // Mozilla, create a new DOMParser
+    var parser = new DOMParser();
+    myDocument = parser.parseFromString(xmlString, "text/xml");
+  } else if (window.ActiveXObject){
+    // Internet Explorer, create a new XML document using ActiveX
+    // and use loadXML as a DOM parser.
+    myDocument = new ActiveXObject("Microsoft.XMLDOM");
+    myDocument.async="false";
+
+    myDocument.loadXML(xmlString);
+  }
+</pre>
+<h4 id="Peticiones_HTTP_para_XML" name="Peticiones_HTTP_para_XML">Peticiones HTTP para XML</h4>
+<p>Internet Explorer permite el envío y recuperación de ficheros XML usando la clase de MSXML <code>XMLHTTP</code>, instanciada a través de ActiveX usando <code>new ActiveXObject("Msxml2.XMLHTTP")</code> o <code>new ActiveXObject("Microsoft.XMLHTTP")</code>. Dado que no hay un método estándar para hacer esto, Mozilla proporciona la misma funcionalidad en el objeto global <code>XMLHttpRequest</code> de JavaScript. El objeto genera peticiones asíncronas de modo predeterminado.</p>
+<p>Tras instanciar el objeto usando <code>new XMLHttpRequest()</code> se puede usar el método <code>open</code> para especificar qué tipo de petición (GET o POST) se quiere usar, qué fichero se va a cargar y si será una petición asíncrona o no. Si la llamada es asíncrona, será necesario facilitar al miembro <code>onload</code> una referencia a una función que será invocada una vez la petición ha sido completada.</p>
+<p>Petición síncrona:</p>
+<pre class="eval">  var myXMLHTTPRequest = new XMLHttpRequest();
+  myXMLHTTPRequest.open("GET", "data.xml", false);
+
+  myXMLHTTPRequest.send(null);
+
+  var myXMLDocument = myXMLHTTPRequest.responseXML;
+</pre>
+<p>Petición asíncrona:</p>
+<pre class="eval">  var myXMLHTTPRequest;
+
+  function <span class="boldcode">xmlLoaded</span>() {
+    var myXMLDocument = myXMLHTTPRequest.responseXML;
+  }
+
+  function loadXML(){
+    myXMLHTTPRequest = new XMLHttpRequest();
+
+    myXMLHTTPRequest.open("GET", "data.xml", true);
+
+    myXMLHTTPRequest.onload = <span class="boldcode">xmlLoaded</span>;
+
+    myXMLHTTPRequest.send(null);
+  }
+</pre>
+<p>La tabla 7 muestra una lista de métodos y propiedades disponibles para el objeto <code>XMLHttpRequest</code> de Mozilla.</p>
+<table class="standard-table">
+ <caption>
+  Tabla 7. Métodos y propiedades XMLHttpRequest</caption>
+ <tbody>
+  <tr>
+   <th>Nombre</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>void abort()</td>
+   <td>Detiene la petición si ésta aún está en curso.</td>
+  </tr>
+  <tr>
+   <td>string getAllResponseHeaders()</td>
+   <td>Devuelve todas las cabeceras de respuesta como una única cadena.</td>
+  </tr>
+  <tr>
+   <td>string getResponseHeader(string headerName)</td>
+   <td>Devuelve el valor de la cabecera especificada.</td>
+  </tr>
+  <tr>
+   <td>functionRef onerror</td>
+   <td>La función que se le asigne será invocada cuando ocurran errores durante una petición.</td>
+  </tr>
+  <tr>
+   <td>functionRef onload</td>
+   <td>La función que se le asigne será invocada cuando la petición se complete con éxito y se haya recibido una respuesta. Se usa con las peticiones asíncronas.</td>
+  </tr>
+  <tr>
+   <td>void open (string HTTP_Method, string URL)<br>
+    <br>
+    void open (string HTTP_Method, string URL, boolean async, string userName, string password)</td>
+   <td>Inicializa la petición para la URL especificada, usando tanto GET o POST como el método HTTP. Para enviar la petición, es necesario llamar al método <code>send()</code> tras la inicialización. Si <code>async</code> se establece a false, la petición será síncrona. De modo predeterminado es asíncrona. Opcionalmente se puede especificar un nombre de usuario y contraseña por si la necesita la URL facilitada. Initializes the request for the specified URL, using either GET or POST as the HTTP method. To send the request, call the <code>send()</code> method after initialization. If <code>async</code> is false, the request is synchronous, else it defaults to asynchronous. Optionally, you can specify a username and password for the given URL needed.</td>
+  </tr>
+  <tr>
+   <td>int readyState</td>
+   <td>Estado de la petición. Valores posibles:
+    <table>
+     <tbody>
+      <tr>
+       <th>Valor</th>
+       <th>Descripción</th>
+      </tr>
+      <tr>
+       <td>0</td>
+       <td>UNINITIALIZED - open() aún no ha sido llamado.</td>
+      </tr>
+      <tr>
+       <td>1</td>
+       <td>LOADING - send() aún no ha sido llamado.</td>
+      </tr>
+      <tr>
+       <td>2</td>
+       <td>LOADED - send() ha sido llamado y las cabeceras y el estado están disponibles.</td>
+      </tr>
+      <tr>
+       <td>3</td>
+       <td>INTERACTIVE - Descargando. responseText contiene datos parciales.</td>
+      </tr>
+      <tr>
+       <td>4</td>
+       <td>COMPLETED - Todas las operaciones han sido completadas.</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+  </tr>
+  <tr>
+   <td>string responseText</td>
+   <td>Cadena que contiene la respuesta.</td>
+  </tr>
+  <tr>
+   <td>DOMDocument responseXML</td>
+   <td>Documento DOM que contiene la respuesta.</td>
+  </tr>
+  <tr>
+   <td>void send(variant body)</td>
+   <td>Realiza la petición. Si <code>body</code> está definido, será enviado como el cuerpo de la petición POST. <code>body</code> puede ser un documento XML o una cadena conteniendo un XML serializado.</td>
+  </tr>
+  <tr>
+   <td>void setRequestHeader (string headerName, string headerValue)</td>
+   <td>Establece una cabecera de petición HTTP para usarla en la petición HTTP. Ha de ser llamada tras invocar al método <code>open()</code>.</td>
+  </tr>
+  <tr>
+   <td>string status</td>
+   <td>El código de estado de la respuesta HTTP.</td>
+  </tr>
+ </tbody>
+</table>
+<h4 id="Diferencias_en_XSLT" name="Diferencias_en_XSLT">Diferencias en XSLT</h4>
+<p>Mozilla soporta las transformaciones XSL 1.0 (XSLT). Además permite a JavaScript realizar tanto transformaciones XSLT como consultas XPath sobre un documento.</p>
+<p>Mozilla necesita que se le pase el fichero XML y XSLT que contiene la hoja de estilos con un tipo MIME XML (<code>text/xml</code> o <code>application/xml</code>). Este es el motivo más común por el cual los XSLT no funcionan en Mozilla pero sí en Internet Explorer. En ese sentido, Mozilla es estricto.</p>
+<p>Internet Explorer 5.0 y 5.5 soportan el borrador de XSLT, el cual es sustancialmente diferente a la recomendación final 1.0. La forma más fácil de distinguir la versión en la que ha sido escrito un fichero XSLT es mirando su espacio de nombres. El espacio de nombres para la recomendación 1.0 es <code><span class="nowiki">http://www.w3.org/1999/XSL/Transform</span></code> mientras que el espacio de nombres del borrador es <code><span class="nowiki">http://www.w3.org/TR/WD-xsl</span></code>. Internet Explorer 6 soporta el borrador por razones de compatibilidad hacia atrás. Mozilla no soporta dicho borrador, sólo la recomendación final.</p>
+<p>Si el XSLT necesita distinguir el navegador, se puede consultar la propiedad de sistema "xsl:vendor". El motor XSLT de Mozilla devolverá "Transformiix" mientras que Internet Explorer devolverá "Microsoft".</p>
+<pre>&lt;xsl:if test="system-property('xsl:vendor') = 'Transformiix'"&gt;
+  &lt;!-- Marcado específico de Mozilla --&gt;
+&lt;/xsl:if&gt;
+&lt;xsl:if test="system-property('xsl:vendor') = 'Microsoft'"&gt;
+  &lt;!-- Marcado específico de Internet Explorer --&gt;
+&lt;/xsl:if&gt;
+</pre>
+<p>Mozilla también proporciona una interfaz de JavaScript para XSLT, permitiendo a un sitio web completar transformaciones XSLT en memoria. Esto puede hacerse usando el objeto global de JavaScript <code>XSLTProcessor</code>. <code>XSLTProcessor</code> necesita que se carge el XML y los ficheros XSLT ya que necesita sus documentos DOM. El documento XSLT importado por <code>XSLTProcessor</code> permite manipular los parámetros XSLT. <code>XSLTProcessor</code> puede generar un documento independiente utilizando <code>transformToDocument()</code> o puede crear un fragmento de documento utilizando <code>transformToFragment()</code> para poder ser anexado fácilmente a otro documento DOM. Más abajo se muestra un ejemplo:</p>
+<pre>var xslStylesheet;
+var xsltProcessor = new XSLTProcessor();
+
+// carga el fichero XSLT example1.xsl
+var myXMLHTTPRequest = new XMLHttpRequest();
+myXMLHTTPRequest.open("GET", "example1.xsl", false);
+myXMLHTTPRequest.send(null);
+
+// obtiene el documento XML y lo importa
+xslStylesheet = myXMLHTTPRequest.responseXML;
+
+xsltProcessor.importStylesheet(xslStylesheet);
+
+// carga el fichero xml example1.xml
+myXMLHTTPRequest = new XMLHttpRequest();
+myXMLHTTPRequest.open("GET", "example1.xml", false);
+myXMLHTTPRequest.send(null);
+
+var xmlSource = myXMLHTTPRequest.responseXML;
+
+var resultDocument = xsltProcessor.transformToDocument(xmlSource);
+</pre>
+<p>Tras crear un objeto <code>XSLTProcessor</code>, hay que cargar el fichero XSLT a través de <code>XMLHttpRequest</code>. El miembro <code>responseXML</code> del XMLHttpRequest contiene el documento XML del fichero XSLT, el cuas es pasado a <code>importStylesheet</code>. Luego hay que usar de nuevo <code>XMLHttpRequest</code> para cargar el documento XML que va a ser transformado. Ese documento es entonces pasado al método <code>transformToDocument</code> de <code>XSLTProcessor</code>. La tabla 8 muestra una lista con los métodos de <code>XSLTProcessor</code>.</p>
+<table class="standard-table">
+ <caption>
+  Tabla 8. Métodos de XSLTProcessor</caption>
+ <tbody>
+  <tr>
+   <th>Método</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>void importStylesheet(Node styleSheet)</td>
+   <td>Importa la hoja de estilo XSLT. El argumento <code>styleSheet</code> es el nodo ráiz del documento DOM de la hoja de estilos XSLT.</td>
+  </tr>
+  <tr>
+   <td>DocumentFragment transformToFragment(Node source, Document owner)</td>
+   <td>Transforma el nodo <code>source</code> aplicando la hoja de estilos importada con el método <code>importStylesheet</code> y genera un DocumentFragment. <code>owner</code> especifica a qué documento DOM debe anexarse el DocumentFragment, haciéndolo compatible con ese documento DOM.</td>
+  </tr>
+  <tr>
+   <td>Document transformToDocument(Node source)</td>
+   <td>Transforma el nodo <code>source</code> aplicando la hoja de estilos importada a través del método <code>importStylesheet</code> y devuelve un documento DOM independiente.</td>
+  </tr>
+  <tr>
+   <td>void setParameter(String namespaceURI, String localName, Variant value)</td>
+   <td>Establece un parámetro en la hoja de estilos XSLT importada.</td>
+  </tr>
+  <tr>
+   <td>Variant getParameter(String namespaceURI, String localName)</td>
+   <td>Obtiene el valor de un parámetro en la hoja de estilos XSLT importada.</td>
+  </tr>
+  <tr>
+   <td>void removeParameter(String namespaceURI, String localName)</td>
+   <td>Elimina todos los parámetros establecidos para la hoja de estilos XSLT importada y establece sus valores a los predeterminados para el XSLT.</td>
+  </tr>
+  <tr>
+   <td>void clearParameters()</td>
+   <td>Elimina todos los parámetros establecidos y establece sus valores a los predeterminados en la hoja de estilos XSLT.</td>
+  </tr>
+  <tr>
+   <td>void reset()</td>
+   <td>Elimina todos los parámetros y hojas de estilos.</td>
+  </tr>
+ </tbody>
+</table>
+<div class="originaldocinfo">
+ <h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3>
+ <ul>
+  <li>Author(s): Doron Rosenberg, IBM Corporation</li>
+  <li>Published: 26 Jul 2005</li>
+  <li>Link: <a class="external" href="http://www.ibm.com/developerworks/web/library/wa-ie2mozgd/" rel="freelink">http://www.ibm.com/developerworks/we...y/wa-ie2mozgd/</a></li>
+ </ul>
+</div>
+<p> </p>
diff --git a/files/es/orphaned/modo_casi_estándar_de_gecko/index.html b/files/es/orphaned/modo_casi_estándar_de_gecko/index.html
new file mode 100644
index 0000000000..712f8d57dd
--- /dev/null
+++ b/files/es/orphaned/modo_casi_estándar_de_gecko/index.html
@@ -0,0 +1,47 @@
+---
+title: Modo casi estándar de Gecko
+slug: orphaned/Modo_casi_estándar_de_Gecko
+tags:
+  - Desarrollo_Web
+  - Estándares_Web
+  - Gecko
+  - HTML
+  - Todas_las_Categorías
+original_slug: Modo_casi_estándar_de_Gecko
+---
+<p> </p>
+<p> </p>
+<p>A partir de Mozilla 1.0.1 y 1.1 beta, hay un nuevo modo de renderizado llamado "casi estándar". Este modo se añade a los ya tradicionales y modo "estándar".</p>
+<p>El modo de renderizado "casi estándar" es exactamente igual que el "modo estándar", en todo excepto en un detalle, la disposición de las imágenes dentro de las tablas se maneja tal y como se hace en el modo "Quirks" de Gecko, que es bastante comparable con la de otros navegadores, tales como Internet Explorer. Esto implica que los diseños basados en tablas con imágenes troceadas tienen más probabilidades de mostrarse correctamente en los navegadores basados en Gecko que utilicen el motor de renderizado de Mozilla 1.0.1 o posterior, tanto en el modo "Quirks" como en el "casi estándar". Léase el artículo "<a href="es/Im%c3%a1genes%2c_tablas_y_huecos_misteriosos">Imágenes, tablas y huecos misteriosos</a>" para una explicación detallada de cómo son tratados estos diseños en el modo "estándar".</p>
+<p>Salvo esta diferencia, el modo "casi estándar" y el "estándar" son exactamente iguales en términos de maquetación y otros comportamientos.</p>
+<h3 id="Activando_el_modo_.22casi_est.C3.A1ndar.22" name="Activando_el_modo_.22casi_est.C3.A1ndar.22">Activando el modo "casi estándar"</h3>
+<p>Los DOCTYPEs que activan el modo "casi estándar" son los que contienen:</p>
+<ul>
+ <li>El identificador público "<code>-//W3C//DTD XHTML 1.0 Transitional//EN</code>"</li>
+ <li>El identificador público "<code>-//W3C//DTD XHTML 1.0 Frameset//EN</code>"</li>
+ <li>El identificador público "<code>-//W3C//DTD HTML 4.01 Transitional//EN</code>", con un identificador de sistema</li>
+ <li>El identificador público "<code>-//W3C//DTD HTML 4.01 Frameset//EN</code>", con un identificador de sistema</li>
+ <li>The IBM system DOCTYPE "<code><span class="nowiki">http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd</span></code>"</li>
+</ul>
+<p>Un DOCTYPE completo contiene un identificador público y un identificador de sistema. Al hablar sobre los DOCTYPEs, mucha gente se refiere a ellos como "con URI" o "sin URI". El URI es el identificador de sistema. Por ejemplo, considere el DOCTYPE siguiente:</p>
+<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+			"http://www.w3.org/TR/html4/loose.dtd"&gt;</pre>
+<p>Tiene dos partes:</p>
+<ul>
+ <li>El identificador público: "<code>-//W3C//DTD HTML 4.01 Transitional//EN</code>"</li>
+ <li>El identificador de sistema: "<code><span class="nowiki">http://www.w3.org/TR/html4/loose.dtd</span></code>"</li>
+</ul>
+<p>Así, cualquier DOCTYPE HTML 4.01 transicional o Frameset con un URI (identificador de sistema) activará el modo "casi estándar", como cualquier DOCTYPE XHTML 1.0 transicional o Frameset, con o sin URI. Los Autores sin relación con IBM no deben preocuparse por su DOCTYPE a medida, también activará el modo "casi estándar".</p>
+<h3 id="Recomendaciones" name="Recomendaciones">Recomendaciones</h3>
+<ul>
+ <li>Los autores que están procurando migrar al código válido usando HTML 4,01 o XHTML 1,0, y que todavía utilizan conceptos de diseño con tablas e imágenes, deben asegurarse de utilizar un DOCTYPE que active el modo "casi estándar".</li>
+</ul>
+<h3 id="M.C3.A1s_en_MDC" name="M.C3.A1s_en_MDC">Más en MDC</h3>
+<ul>
+ <li><a href="es/Im%c3%a1genes%2c_tablas_y_huecos_misteriosos">Imágenes, tablas y huecos misteriosos</a></li>
+</ul>
+<h3 id="Enlaces_relacionados" name="Enlaces_relacionados">Enlaces relacionados</h3>
+<ul>
+ <li><a href="es/Selecci%c3%b3n_de_modo_en_Mozilla">Selección de modo en Mozilla</a></li>
+ <li><span class="comment">no sé si publicar esta sección: &lt;div class="originaldocinfo"&gt; == Original Document Information == * Author(s): Eric A. Meyer, Netscape Communications * Last Updated Date: Published 08 Nov 2002 * Cop</span></li>
+</ul>
diff --git a/files/es/orphaned/mozilla/add-ons/webextensions/debugging/index.html b/files/es/orphaned/mozilla/add-ons/webextensions/debugging/index.html
new file mode 100644
index 0000000000..f3fcefb3bd
--- /dev/null
+++ b/files/es/orphaned/mozilla/add-ons/webextensions/debugging/index.html
@@ -0,0 +1,190 @@
+---
+title: Depuración
+slug: orphaned/Mozilla/Add-ons/WebExtensions/Debugging
+tags:
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/Debugging
+original_slug: Mozilla/Add-ons/WebExtensions/Depuración
+---
+<div>{{AddonSidebar}}</div>
+
+<div class="note">
+<p>Las técnicas descritas aquí funcionan en Firefox 50 y versiones sucesivas. Si necesitas usar una versión anterior de Firefox, por favor ve al artículo <a href="/en-US/Add-ons/WebExtensions/Debugging_(before_Firefox_50)">debugging extensions using WebExtension APIs before Firefox 50</a>.</p>
+</div>
+
+<p>Este artículo explica cómo se pueden usar las herramientas de desarrollo de Firefox para depurar extensiones creadas con las WebExtension APIs.</p>
+
+<p>Una WebExtension puede consistir en varias partes distintas — scripts en segundo plano, popups, options pages, content scripts — y se tendrá que usar un proceso ligeramente distinto para depurar cada parte. Así, cada parte tendrá una sección principal en este artículo, y el objetivo es que esas secciones se puedan leer de forma independiente. Empezaremos presentando el Depurador de Add-on, que será usado para depurar la mayoría de las partes de un complemento.</p>
+
+<ul>
+</ul>
+
+<h2 class="western" id="El_Depurador_de_Add-on">El Depurador de Add-on</h2>
+
+<p>Para la mayor parte de este artículo utilizaremos el Depurador de Add-on. Para abrir el Depurador de Add-on:</p>
+
+<ul>
+ <li>
+  <p style="margin-bottom: 0cm;">abrir Firefox</p>
+ </li>
+ <li>
+  <p style="margin-bottom: 0cm;">escribir "about:debugging" en la barra de direcciones</p>
+ </li>
+ <li>
+  <p style="margin-bottom: 0cm;">marcar la casilla en la que pone "Activar depuración de complementos"</p>
+ </li>
+ <li>
+  <p style="margin-bottom: 0cm;">hacer click en el botón "Depurar" al lado del complemento</p>
+ </li>
+ <li>
+  <p>hacer click en "Aceptar" en el cuadro de alerta</p>
+ </li>
+</ul>
+
+<p>Se abrirá entonces una nueva ventana. La ventana principal de Firefox se pondrá en primer plano, así que se tendrá que hacer click en la nueva ventana para que aparezca en primer plano.</p>
+
+<p>{{EmbedYouTube("HMozipAjrYA")}}</p>
+
+<p>Esta nueva ventana se llama "Herramientas de desarrollo" y contiene las herramientas de depuración que se usarán. La interfaz tiene varias pestañas en la parte de arriba que permiten moverse por las herramientas disponibles:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13861/toolbox-tabs.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;"></p>
+
+<p>En este artículo usaremos tres herramientas de depuración:</p>
+
+<ul>
+ <li>
+  <p style="margin-bottom: 0cm;"><a href="https://developer.mozilla.org/es/docs/Tools/Web_Console">La Consola</a>: muestra mensajes registrados por la extensión así como mensajes de error registrados por el navegador mientras ejecuta la extensión. También proporciona una línea de comandos, habilitando la ejecución de JavaScript en el contexto de la extensión.</p>
+ </li>
+ <li>
+  <p style="margin-bottom: 0cm;"><a href="https://developer.mozilla.org/es/docs/Tools/Debugger">El Depurador</a>: habilita el uso de breakpoints y watchpoints en el código JavaScript de la extensión, y examina y modifica su estado interno.</p>
+ </li>
+ <li>
+  <p><a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector">El Inspector</a>: habilita la revisión y modificación del HTML y CSS usado para construir las páginas de la extensión.</p>
+ </li>
+</ul>
+
+<h2 class="western" id="Depurando_scripts_en_segundo_plano">Depurando scripts en segundo plano</h2>
+
+<div class="note">
+<p>Los ejemplos de esta sección usan la extensión de ejemplo "notify-link-clicks-l10n". Para explorar las opciones, se puede encontrar este ejemplo en el repositorio <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a>.</p>
+</div>
+
+<p>Los <a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#Scripts_en_segundo_plano">scripts en segundo plano</a> permanecen cargados durante el tiempo de vida de la extensión. Se cargan dentro de una “página en segundo plano” invisible: por defecto, es un documento HTML vacío, pero se puede especificar contenido HTML propio usando la palabra clave <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/background">"background"</a> en “manifest.json”.</p>
+
+<p>Se pueden depurar scripts en segundo plano usando el <a href="/en-US/Add-ons/WebExtensions/Debugging_(Firefox_50_onwards)#The_Add-on_Debugger">Depurador de Add-ons</a>.</p>
+
+<p>En la Consola del Depurador de Add-ons se puede ver un registro de las salidas, incluidas las llamadas a <code><a href="/en-US/docs/Web/API/Console/log">console.log()</a></code> desde los propios scripts en segundo plano y cualquier error que el navegador encuentre al ejecutarlos. Es importante mencionar que la consola muestra todos los errores detectados por el navegador, no sólo los errores relacionados con el código de la extensión.</p>
+
+<p>Por ejemplo, la extensión de ejemplo <a href="https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n">notify-link-clicks-i18n</a> registra un mensaje de su script en segundo plano cuando recibe un mensaje de uno de sus otros scripts:</p>
+
+<p>{{EmbedYouTube("WDQsBU-rpN0")}}</p>
+
+<p>Usando la línea de comandos de la Consola, se pueden acceder y modificar los objetos creados por los scripts en segundo plano.</p>
+
+<p>Por ejemplo, aquí se hace un allamada a la función <code>notify()</code> definida en el script en segundo plano de la extensión:</p>
+
+<p>{{EmbedYouTube("g-Qgf8Mc2wg")}}</p>
+
+<p>Si se mira la ventana del Depurador, se pueden ver todos los scripts en segundo plano de la extensión. Se pueden definir breakpoints, ver el código paso a paso y hacer <a href="https://developer.mozilla.org/es/docs/Tools/Debugger">todo lo que es posible hacer en un depurador</a>.</p>
+
+<p>{{EmbedYouTube("MNeaz2jdmzY")}}</p>
+
+<p>Si se pulsa la tecla de Escape mientras se está en el Depurador, la ventana de Herramientas de desarrollo se dividirá en dos, con la parte de abajo ocupada ahora por la Consola. Ahora, mientras se esté en un breakpoint, se puede modificar el estado del programa usando la consola. Ver <a href="/en-US/docs/Tools/Web_Console/Split_console">Dividir la Consola</a> para más información.</p>
+
+<h2 class="western" id="Depurando_páginas_de_opciones">Depurando páginas de opciones</h2>
+
+<p>Las <font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/es/Add-ons/WebExtensions/Anatomia_de_una_WebExtension#P%C3%A1gina_de_opciones">páginas de opciones</a></u></span></font> son páginas HTML que pueden ser proporcionadas por la persona que desarrolle la extensión y contienen opciones para la misma. Se muestran normalmente en un iframe en el Add-ons Manager (para ver el Add-ons Manager, visita la página "about:addons").</p>
+
+<p>Para depurar páginas de opciones:</p>
+
+<ul>
+ <li>
+  <p style="margin-bottom: 0cm;">abrir el <font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging#The_Add-on_Debugger">Depurador de Add-on</a></u></span></font> para la add-on en cuestión</p>
+ </li>
+ <li>
+  <p>abrir la página de opciones de la add-on.</p>
+ </li>
+</ul>
+
+<p>Cualquier archivo fuente en JavaScript que incluya será listado en el Depurador:</p>
+
+<p>{{EmbedYouTube("BUMG-M8tFF4")}}</p>
+
+<div class="note">
+<p>Este vídeo usa el ejemplo de WebExtension <font color="#000080"><span lang="zxx"><u><a href="https://github.com/mdn/webextensions-examples/tree/master/favourite-colourbeastify">favourite-colour</a></u></span></font>.</p>
+</div>
+
+<p>También se verá cualquier mensaje registrado por el código en la Consola del Depurador de Add-on.</p>
+
+<p>También se puede usar el Depurador de Add-on para depurar el código HTML y CSS de la página. Pero primero se necesita dirigir las herramientas al iframe que alberga la página de opciones. Para hacer esto: abre la página de opciones, haz clic en el icono indicado en la captura de pantalla mostrada a continuación y selecciona la página de opciones del menú desplegable:</p>
+
+<p class="western" style="margin-bottom: 0cm; line-height: 100%;"><img alt="" src="https://mdn.mozillademos.org/files/13863/toolbox-iframe.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;">Ahora al cambiar a la pestaña Inspector se podrá examinar y editar el HTML y CSS para la página:</p>
+
+<p class="western" style="margin-bottom: 0cm; line-height: 100%;"> </p>
+
+<p>{{EmbedYouTube("-2m3ubFAU94")}}</p>
+
+<h2 class="western" id="Depurando_ventanas_emergentes">Depurando ventanas emergentes</h2>
+
+<p><font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/user_interface/Popups">Las ventanas emergentes</a></u></span></font> son cuadros de diálogo unidos a acciones del navegador o de la página. Se especifican usando un documento HTML que puede incluir fuentes CSS y JavaScript para determinar el estilo y el funcionamiento. Cuando la ventana emergente es visible, se puede usar el <a href="/en-US/Add-ons/WebExtensions/Debugging_(Firefox_50_onwards)#The_Add-on_Debugger">Depurador de Add-on</a> para depurar su código.</p>
+
+<p>Un problema con las ventanas emergentes es que si una ventana emergente está abierta y se hace clic fuera de ella, esta se cierra y su código se descarga. Obviamente, esto hace que sea imposible depurarlas. Para eliminar este comportamiento, se debe hacer clic en el botón del Depurador de Add-on destacado en la captura de pantalla mostrada a continuación:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13877/toolbox-popup.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;"></p>
+
+<p class="western" style="margin-bottom: 0cm; line-height: 100%;">Ahora, al abrir una ventana emergente esta continuará abierta hasta que se pulse Escape.</p>
+
+<p class="western" style="margin-bottom: 0cm; line-height: 100%;"> </p>
+
+<div class="note">
+<p>Es importante señalar que esta opción está disponible para ventanas emergentes desarrolladas para el navegador, como el menú de hamburguesa (<img style="height: 20px; width: 22px;"> ), así como a ventanas emergentes propias de la add-on.</p>
+
+<p>También es importante notar que el cambio es persistente, incluso aunque el navegador se reinicie. Estamos trabajando en solucionar esto en el <font color="#000080"><span lang="zxx"><u><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1251658">bug 1251658</a></u></span></font>, pero hasta entonces puede ser mejor permitir de nuevo la ocultación automática<strong> </strong>volviendo a hacer clic en el botón antes de cerrar la Caja de Herramientas del Navegador.</p>
+
+<p>Internamente, este botón simplemente cambia la preferencia <code class="western">ui.popup.disable_autohide</code>, lo que se puede hacer manualmente usando about:config.</p>
+</div>
+
+<p>Cuando la ventana emergente está abierta, sus fuentes de JavaScript se listarán en el Depurador. Se pueden colocar breakpoints y modificar el estado interno del programa:</p>
+
+<p>{{EmbedYouTube("hzwnR8qoz2I")}}</p>
+
+<div class="note">
+<p>Este vídeo usa la extensión de ejemplo <a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">beastify</a>.</p>
+</div>
+
+<p>También se puede usar el Depurador de Add-on para depurar el código HTML y CSS de la ventana emergente. Pero primero se necesita dirigir las herramientas al documento de la ventana emergente. Para hacer esto: abre la ventana emergente, haz clic en el icono indicado en la captura de pantalla mostrada a continuación y selecciona la página de la ventana emergente del menú desplegable:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13863/toolbox-iframe.png" style="display: block; height: 417px; margin-left: auto; margin-right: auto; width: 876px;"></p>
+
+<p>Ahora al cambiar a Inspector se podrán examinar y editar el HTML y el CSS de la ventana emergente:</p>
+
+<p>{{EmbedYouTube("6lvdm7jaq7Y")}}</p>
+
+<h2 class="western" id="Depurando_scripts_de_contenido">Depurando scripts de contenido</h2>
+
+<p>Se puede usar el Depurador de Add-on para depurar páginas en segundo plano, páginas de opciones y ventanas emergentes. Sin embargo, no se puede usar para depurar scripts de contenido. Esto es debido a que, en <font color="#000080"><span lang="zxx"><u><a href="https://developer.mozilla.org/es/Firefox/Multiprocess_Firefox">Firefox multiproceso</a></u></span></font>, los scripts de contenido se ejecutan en un proceso distinto del de otras partes de la add-on.</p>
+
+<p>Para depurar scripts de contenido adjuntos a una página web, se deben usar las herramientas de desarrollo web normales para esa página:</p>
+
+<ul>
+ <li>
+  <p style="margin-bottom: 0cm;">selecciona “Alternar herramientas” del submenú Desarrollador Web en el menú Firefox (o el menú de herramientas si se muestra la barra de menú o se está utilizando Mac OS X)</p>
+ </li>
+ <li>
+  <p>o presiona el método abreviado del teclado <kbd>CtrlShiftI</kbd> (<kbd>CommandOptionI</kbd> en OS X).</p>
+ </li>
+</ul>
+
+<p>{{EmbedYouTube("f46hMLELyaI")}}</p>
+
+<p>Por defecto, las herramientas se muestran al pie de la pestaña de desarrollo, para reflejar que están relacionadas con esa pestaña. Cualquier salida de las instrucciones <code class="western"><a>console.log()</a></code> de los scripts de contenido será mostrada allí. También se verán los scripts de contenido listados en el Depurador, donde se podrán colocar breakpoints, avanzar en el código, etc.</p>
+
+<p>{{EmbedYouTube("Hx3GU_fEPeo")}}</p>
+
+<div class="note">
+<p>Este video usa el ejemplo <font color="#000080"><span lang="zxx"><u><a href="https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n">notify-link-clicks-i18n</a></u></span></font> de WebExtension.</p>
+</div>
+
+<div class="note">
+<p style="line-height: 120%;">Si la pestaña de Herramientas de Desarrollo no estaba abierta cuando el scripts de contenido se introdujo, puede ocurrir que el scripts de contenido no aparezca en el panel de depuración. Si esto ocurre, recargar la página que contiene la pestaña de Herramientas de Desarrollo debería solucionar el problema.</p>
+</div>
diff --git a/files/es/orphaned/mozilla/add-ons/webextensions/package_your_extension_/index.html b/files/es/orphaned/mozilla/add-ons/webextensions/package_your_extension_/index.html
new file mode 100644
index 0000000000..14d7d6c58f
--- /dev/null
+++ b/files/es/orphaned/mozilla/add-ons/webextensions/package_your_extension_/index.html
@@ -0,0 +1,106 @@
+---
+title: Publicando tu extensión
+slug: orphaned/Mozilla/Add-ons/WebExtensions/Package_your_extension_
+tags:
+  - AMO
+  - Addons
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/Package_your_extension_
+original_slug: Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Una vez que hayas acabado de modificar y testear tu extensión, es probable que quieras compartirla con el resto del mundo. Mozilla tiene una web: <a class="external external-icon" href="https://addons.mozilla.org">addons.mozilla.org</a> (comunmente abreviada como AMO), en la que los desarrolladores pueden publicar sus complementos y los usuarios pueden encontrarlos. Publicando tu extension en AMO, puedes participar en nuestra comunidad de usuarios y creadores, y encontrar una audiencia para tu extension.</p>
+
+<p>No tienes por que publicar tu extension en AMO.  De todas maneras, aunque no quieras publicarla, tendrás que enviarla a AMO para que pueda ser revisada y firmada. Las versiones oficiales de Firefox no aceptan complementos que no estén firmados por AMO.</p>
+
+<p>En resumen, este es el proceso para publicar una extensión:</p>
+
+<ol>
+ <li><a href="#1._Zip_up_your_extension's_files">Comprime los archivos de tu extension en un zip</a></li>
+ <li><a href="#2._Create_an_account_on_addons.mozilla.org">Crea una cuenta en AMO</a></li>
+ <li><a href="#3._Upload_your_zip">Sube tu zip a AMO para firmarlo y revisarlo y selecciona una opción</a></li>
+ <li><a href="#4._Fix_review_problems">Soluciona los problemas encontrados en la revisión</a></li>
+ <li><a href="#5._Publish_your_extension">Si seleccionas no publicar la extension en AMO, puedes obtener la extension firmada y publicala por tu cuenta</a></li>
+</ol>
+
+<p>Cuando estés listo para lanzar una nueva versión de tu extensión, puedes actualizarla visitando la página de la extensión en <a class="external external-icon" href="https://addons.mozilla.org">addons.mozilla.org</a>, y subiendo ahí la nueva versión. Ten en cuenta que tendrás que actualizar la página de la extensión para que AMO reconozca que es una actualización de la extensión, y no una extensión completamente nueva.</p>
+
+<p>Si seleccionas publicar tu extensión en AMO, Firefox buscará las actualizaciones automaticamente. Si seleccionas publicarla por tu cuenta, tendrás que incluir la clave <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> en tu manifest.json, con el atributo <code>update_url</code> apuntando a un <a href="/en-US/Add-ons/Updates">update manifest file</a>.</p>
+
+<div class="pull-aside">
+<div class="moreinfo">
+<p>Las extensiones empaquetadas de Firefox son "archivos XPI", que son simplemente un .ZIP con otra extensión</p>
+
+<p>No tienes que usar la extensión .XPI para subirla a AMO.</p>
+</div>
+</div>
+
+<h2 id="1._Comprime_los_archivos_en_un_zip">1. Comprime los archivos en un zip</h2>
+
+<p>En este punto tu extensión consistirá en una carpeta que contiene un manifest.json y otros archivos que necesite (scripts, iconos, documentos HTML, etc.). Necesitarás comprimir todos en un sólo .zip para poder subirlos a AMO.</p>
+
+<p>Es importante saber que el .zip deber crearse seleccionando<strong> todos los archivos de la extensión, no su carpeta contenedora</strong>.</p>
+
+<h3 id="Windows">Windows</h3>
+
+<ol>
+ <li>Abre la carpeta que contenga los archivos de tu extensión.</li>
+ <li>Selecciona todos los archivos (CTRL+E o CTRL+A, depende del idioma).</li>
+ <li>Click derecho en Enviar a → Carpeta comprimida (en zip).</li>
+</ol>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11949/install-windows.png" style="display: block; height: 576px; margin-left: auto; margin-right: auto; width: 800px;"></p>
+
+<h3 id="Mac_OS_X">Mac OS X</h3>
+
+<ol>
+ <li>Abre la carpeta que contenga los archivos de tu extensión.</li>
+ <li>Selecciona todos los archivos.</li>
+ <li>Click derecho y selecciona Comprimir <em>n</em> Items.</li>
+</ol>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11951/install-osx.png" style="display: block; height: 449px; margin-left: auto; margin-right: auto; width: 800px;"></p>
+
+<div class="pull-aside">
+<div class="moreinfo">Ver <a href="http://www.info-zip.org/mans/zip.html">http://www.info-zip.org/mans/zip.html</a>.</div>
+</div>
+
+<h3 id="Linux_Mac_OS_X_Terminal">Linux / Mac OS X Terminal</h3>
+
+<ol>
+ <li><code>cd path/to/my-extension/</code></li>
+ <li><code>zip -r -FS ../my-extension.zip *</code></li>
+</ol>
+
+<div style=""> </div>
+
+<h2 id="2._Crea_una_cuenta_en_addons.mozilla.org">2. Crea una cuenta en addons.mozilla.org</h2>
+
+<p>Visita <a href="https://addons.mozilla.org/">https://addons.mozilla.org/</a>. Si ya tienes una <a href="https://support.mozilla.org/en-US/kb/access-mozilla-services-firefox-accounts">Cuenta Firefox</a>, puedes utilizarla para iniciar sesión. Si no, haz click en "Registrar" y se te exigirá crear una cuenta.</p>
+
+<h2 id="3._Sube_tu_zip">3. Sube tu zip</h2>
+
+<p>A continuación, sube la extensión comprimida a AMO para poder revisarla y firmarla, y selecciona si quieres publicarla en AMO o no. Hay un <a href="https://developer.mozilla.org/en-US/Add-ons/Distribution/Submitting_an_add-on">tutorial</a> disponible para guiarte durante el proceso de envío. Sería conveniente que también veas <a href="https://developer.mozilla.org/es/Add-ons/Distribution#Enviando_a_AMO">Enviando a AMO</a> para más detalles sobre el proceso.</p>
+
+<div class="note">
+<p>Ten en cuenta que una vez que hayas subido la extensión a AMO no podrás actualizarla para usar el Add-on SDK o técnicas XUL/XPCOM. Si decides cambiar a una de estas plataformas, tendrás que enviar la extensión de nuevo como si de una nueva extensión se tratase.</p>
+
+<p>En otras palabras: portar a partir de sistemas de extensiones heredadas para usar APIs WebExtension es un camino de ida.</p>
+
+<p>Antes de subirla, asegurate de que el ZIP contiene sólo los archivos necesarios para la extensión.</p>
+</div>
+
+<h2 id="4._Soluciona_los_problemas_detectados_en_la_revisión">4. Soluciona los problemas detectados en la revisión</h2>
+
+<p>En cuanto subas la aplicación, el servidor AMO realizará varios tests básicos y te notificará inmediatamente de cualquier problema. Los problemas se dividen en dos categorías: "errors" y "warnings". Si tienes errores, tienes que arreglarlos y reenviar la extensión. Si sólo tienes avisos, conviene solucionarlos, pero no es obligatorio. Puedes continuar.</p>
+
+<p>Si el comprobador automático no detecta ningún error, la extensión pasará por una revisión más exhaustiva. Serás contactado con los resultados de la revisión. En caso de tener errores tendrás que solucionarlos e intentarlo de nuevo.</p>
+
+<p>Si has selccionado que la extensión esté hosteada en AMO, este es el final del proceso de publicación. AMO firmará la extensión y la publicará, tras esto los usuarios ya podrán descargarla e instalarla.</p>
+
+<h2 id="5._Publica_tu_extensión">5. Publica tu extensión</h2>
+
+<p>Si seleccionas no publicarla en AMO, obten la extensión firmada y públicala por tu cuenta.</p>
+
+<p> </p>
diff --git a/files/es/orphaned/mozilla/add-ons/webextensions/porting_a_google_chrome_extension/index.html b/files/es/orphaned/mozilla/add-ons/webextensions/porting_a_google_chrome_extension/index.html
new file mode 100644
index 0000000000..5b210d1016
--- /dev/null
+++ b/files/es/orphaned/mozilla/add-ons/webextensions/porting_a_google_chrome_extension/index.html
@@ -0,0 +1,23 @@
+---
+title: Conversión de extensiones de Google Chrome
+slug: orphaned/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension
+tags:
+  - WebExtensions
+translation_of: Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension
+original_slug: Mozilla/Add-ons/WebExtensions/Porting_from_Google_Chrome
+---
+<div>{{AddonSidebar}}</div>
+
+<p>Las extensiones programadas con API de WebExtensions están diseñadas para ser compatibles entre navegadores diferentes: en buena medida, esta tecnología es compatible directamente con la <a class="external external-icon" href="https://developer.chrome.com/extensions">API de extensiones</a> admitida por Google Chrome y Opera. En la mayoría de los casos, las extensiones creadas para estos navegadores se ejecutarán en Firefox con solo unas pocas modificaciones. Casi todas las <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API">API de extensiones</a> se admiten a través de funciones de devolución de llamada bajo el espacio de nombres <code>chrome</code>, al igual que Chrome. Las únicas API que no se admiten bajo el espacio de nombres <code>chrome</code> son aquellas que son deliberadamente incompatibles con Chrome. En esos casos contados, la página de documentación de la API manifestará expresamente que se admite solo en el espacio de nombres <code>browser</code>. El proceso de conversión de extensiones de Chrome u Opera es el siguiente:</p>
+
+<ol>
+ <li>Revise su utilización de funciones de manifest.json y API de WebExtensions con respecto a la <a href="/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">referencia de incompatibilidades con Chrome</a>. Si está empleando funciones o API que aún no se admiten en Firefox, es posible que no pueda convertir su extensión por el momento. Mozilla ofrece un servicio que puede ayudar a automatizar este paso: <a href="https://www.extensiontest.com/">https://www.extensiontest.com/</a>.</li>
+ <li><a href="/en-US/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Instale su extensión en Firefox</a> y póngala a prueba.</li>
+ <li>Si experimenta problemas, póngase en contacto con nosotros a través de la <a class="external external-icon" href="https://mail.mozilla.org/listinfo/dev-addons">lista de correo «dev-addons»</a> o el <a href="irc://irc.mozilla.org/webextensions">canal #webextensions</a> en <a class="external external-icon" href="https://wiki.mozilla.org/IRC">IRC</a>.</li>
+ <li><a href="/en-US/Add-ons/WebExtensions/Publishing_your_WebExtension">Envíe su complemento a AMO para su firma y distribución</a>.</li>
+</ol>
+
+<p>Si dependía de la opción de consola de Chrome para cargar extensiones no empaquetadas, eche un vistazo a la herramienta <a href="/en-US/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a>, la cual automatiza la instalación temporal en Firefox para permitir el desarrollo.</p>
+
+<ul>
+</ul>
diff --git a/files/es/orphaned/mozilla/add-ons/webextensions/temporary_installation_in_firefox/index.html b/files/es/orphaned/mozilla/add-ons/webextensions/temporary_installation_in_firefox/index.html
new file mode 100644
index 0000000000..7a29fd0967
--- /dev/null
+++ b/files/es/orphaned/mozilla/add-ons/webextensions/temporary_installation_in_firefox/index.html
@@ -0,0 +1,92 @@
+---
+title: Empaquetado e Instalación
+slug: orphaned/Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox
+translation_of: Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox
+translation_of_original: Mozilla/Add-ons/WebExtensions/Packaging_and_installation
+original_slug: Mozilla/Add-ons/WebExtensions/Packaging_and_installation
+---
+<h2 id="Empaquetando_tu_extensión">Empaquetando tu extensión</h2>
+
+<div class="note">
+<p>Mozilla actualmente esta considerando implementar una aplicación con interfaz visual para empaquetar y cargar extensiones. Mira el <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1185460">Bug 1185460</a> para más información. Hasta entonces, sigue los pasos que aparecen a continuación.</p>
+</div>
+
+<p>Las extensiones para Firefox son empaquetadas como archivos XPI, los cuales son solamente archivos ZIP, con extensión "xpi".</p>
+
+<p>Un truco es que el archivo ZIP debe ser un archivo que contenga los archivos de la extensión y no la carpeta que los contiene.</p>
+
+<h3 id="Windows">Windows</h3>
+
+<ol>
+ <li>Abre la carpeta que contiene los archivos de tu extensión.</li>
+ <li>Selecciona todos los archivos.</li>
+ <li>Con clic derecho elige Enviar a  → Carpeta comprimida (zip).</li>
+ <li>Cambia el nombre del archivo resultante de <code>something.zip</code> a <code>something.xpi</code>.</li>
+</ol>
+
+<p><img alt="Screenshot of the Windows Explorer context menu showing Send to compressed (zipped) folder" src="https://mdn.mozillademos.org/files/11717/pUF1vnr.png" style="height: 641px; width: 904px;"></p>
+
+<h3 id="Mac_OS_X">Mac OS X</h3>
+
+<ol>
+ <li>Abre la carpeta que contiene los archivos de tu extensión.</li>
+ <li>Selecciona todos los archivos.</li>
+ <li>Con clic derecho elige Comprimir <em>n</em> elementos.</li>
+ <li>Cambia el nombre del archivo resultante de <code>something.zip</code> a <code>something.xpi</code>.</li>
+</ol>
+
+<p><img alt="Screenshot of the Finder context menu showing the Compress 15 Items option" src="https://mdn.mozillademos.org/files/11715/Screen%20Shot%202015-10-08%20at%2016.19.02.png" style="height: 460px; width: 850px;"></p>
+
+<h3 id="Linux_Mac_OS_X_Terminal">Linux / Mac OS X Terminal</h3>
+
+<ol>
+ <li><code>cd path/to/my-extension/</code></li>
+ <li><code>zip -r ../my-extension.xpi *</code></li>
+</ol>
+
+<h2 id="Instalando_tu_extensión">Instalando tu extensión</h2>
+
+<ol>
+ <li>Navega a <code>about:addons</code></li>
+ <li>Arrastra y suelta el XPI dentro de la página, o abre el menú de opciones y escoge "Instalar complemento desde archivo..."</li>
+ <li>Da clic en "Instalar" en el diálogo que aparecerá</li>
+</ol>
+
+<h2 id="Instalando_tu_extensión_en_Firefox_OS">Instalando tu extensión en Firefox OS</h2>
+
+<p>Tu puedes instalar tu extensión desde WebIDE en un escritorio conectado vía USB o Wifi. Abre <code>path/to/my-extension/ como una Aplicación empaquetada en WebIDE.</code></p>
+
+<p><code>Cuando la validación de manifest.json es correcta podrás instalar y ejecutar tu extensión en el dispositivo con Firefox OS conectado.</code></p>
+
+<p><code>Para instalar extensiones debe tener habilitada la opción en Configuración-&gt;Complementos del dispositivo con Firefox OS.</code></p>
+
+<h2 id="Resolución_de_problemas">Resolución de problemas</h2>
+
+<p>Aquí están algunos de los problemas más comunes que podrías encontrarte:</p>
+
+<h3 id="Este_complemento_no_puede_ser_instalado_porque_no_ha_sido_verificado.">"Este complemento no puede ser instalado porque no ha sido verificado."</h3>
+
+<ul>
+ <li>Asegúrate que estás usando <a href="https://nightly.mozilla.org/">Nightly</a> y la preferencia <code>xpinstall.signatures.required</code> está en <code>false</code> en <code>about:config</code>.</li>
+ <li>Aprende más acerca de <a href="/en-US/docs/Mozilla/Add-ons/Distribution">la firma de complementos y su distribución</a>.</li>
+</ul>
+
+<h3 id="Este_complemento_no_puede_ser_instalado_porque_para_estar_corrupto.">"Este complemento no puede ser instalado porque para estar corrupto."</h3>
+
+<ul>
+ <li>Asegúrate que has comprimido los archivos directamente, <em>no la carpeta que contiene</em> los archivos de tu extensión. Tu archivo manifest.json debe estar en la carpeta raíz del archivo ZIP.</li>
+ <li>Asegúrate que estás usando la versión <a href="https://nightly.mozilla.org/">Nightly</a> de Firefox.</li>
+</ul>
+
+<h3 id="No_pasa_nada">No pasa nada</h3>
+
+<ul>
+ <li>Asegúrate que tu archivo actualmente termina en <code>.xpi</code>, existen algunos <em>sistemas operativos que le gusta ocultar</em> las extensiones de los archivos.
+
+  <ul>
+   <li>En Windows, comprueba con Vista → Mostrar / Ocultar: Extensiones de los archivos.</li>
+   <li>En Mac OS X, comprueba con Archivo → Obtener información → Nombre y Extensión.</li>
+  </ul>
+ </li>
+ <li>Es posible que te hayas perdido u ocultado el diálogo de instalación. Mira si un icono parecido a una pieza de rompecabezas está al lado del botón Atrás en Nightly. Has clic sobre él para trae nuevamente el diálogo de instalación.</li>
+</ul>
diff --git a/files/es/orphaned/módulos_javascript/index.html b/files/es/orphaned/módulos_javascript/index.html
new file mode 100644
index 0000000000..8f3a02f6fb
--- /dev/null
+++ b/files/es/orphaned/módulos_javascript/index.html
@@ -0,0 +1,24 @@
+---
+title: Módulos JavaScript
+slug: orphaned/Módulos_JavaScript
+tags:
+  - Firefox 3
+  - JavaScript
+  - Todas_las_Categorías
+  - XPConnect
+original_slug: Módulos_JavaScript
+---
+<p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Firefox 3 introduce el método <code><a href="es/Components.utils.import">Components.utils.import()</a></code> , que provee una sencilla forma de importar código JavaScript desde un módulo externo. Existe información sobre cómo configurar y <a href="es/Usando_m%c3%b3dulos_de_c%c3%b3digo_JavaScript">usar módulos JavaScript</a>. Los Módulos de JavaScript pueden también ser usados para <a href="es/Trabajar_con_ventanas_desde_c%c3%b3digo_chrome#Usando_m.C3.B3dulos_de_c.C3.B3digo_JavaScript">compartir datos</a> en extensiones.</p>
+
+<p>Además de ofrecer este método para importar módulos, Firefox incluye dos módulos por defecto:</p>
+
+<dl>
+ <dt>XPCOMUtils</dt>
+ <dd>El módulo <a href="es/XPCOMUtils.jsm">XPCOMUtils.jsm</a> provee facilidades para componentes de JavaScript cargados mediante el cargador de componentes de JavaScript.</dd>
+ <dt>JSON</dt>
+ <dd>El módulo <a href="es/JSON.jsm">JSON.jsm</a> provee facilidades para manipular datos JSON.</dd>
+ <dt>PluralForm</dt>
+ <dd>El módulo <a href="es/Localizaci%c3%b3n_y_Plurales">PluralForm.jsm</a> provee herramientas para pluralizar correctamente palabras en múltiples localizaciones.</dd>
+</dl>
diff --git a/files/es/orphaned/nsdirectoryservice/index.html b/files/es/orphaned/nsdirectoryservice/index.html
new file mode 100644
index 0000000000..528635d2e5
--- /dev/null
+++ b/files/es/orphaned/nsdirectoryservice/index.html
@@ -0,0 +1,12 @@
+---
+title: nsDirectoryService
+slug: orphaned/nsDirectoryService
+original_slug: nsDirectoryService
+---
+<h3 id="Resumen" name="Resumen">Resumen</h3>
+<p>El servicio de directorio XPCOM devuelve las ubicaciones de directorios "bien conocidos" en los sistemas operativos de una forma independiente. Por ejemplo puede indicarle la ruta del directorio temporal del sistema, el directorio de trabajo actual, etc.</p>
+<pre class="eval"> ClassID:    f00152d0-b40b-11d3-8c9c-000064657374
+ ContractID: @mozilla.org/file/directory_service;1
+</pre>
+<h3 id="Interfaces_soportados" name="Interfaces_soportados">Interfaces soportados</h3>
+<p><code><a href="es/NsIProperties">nsIProperties</a></code>, <code><a href="es/NsIDirectoryService">nsIDirectoryService</a></code></p>
diff --git a/files/es/orphaned/participar_en_el_proyecto_mozilla/index.html b/files/es/orphaned/participar_en_el_proyecto_mozilla/index.html
new file mode 100644
index 0000000000..9db164f92f
--- /dev/null
+++ b/files/es/orphaned/participar_en_el_proyecto_mozilla/index.html
@@ -0,0 +1,11 @@
+---
+title: Participar en el proyecto Mozilla
+slug: orphaned/Participar_en_el_proyecto_Mozilla
+tags:
+  - para_revisar
+original_slug: Participar_en_el_proyecto_Mozilla
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si estás interesado en ayudar a corregir los errores o trabajar en el código detrás de la plataforma Mozilla, este es el lugar para encontrar la documentación que te guiará en la dirección correcta.</span></span></p>
+<table class="mainpage-table"> <tbody> <tr> <td> <h2 id="Temas_generales"><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Temas generales</span></span></h2> <dl> <dt><a class="internal" href="/En/Developer_Guide" title="En/Developer Guide"><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Guía para desarrolladores de Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Consejos y guías sobre desarrollo para contribuir al código base de Mozilla.</span></span></dd> <dt><a class="internal" href="/En/Developer_Guide/Source_Code" title="En/Developer Guide/Source Code"><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Código fuente de Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Información acerca de cómo obtener el código de Mozilla, ya sea por descarga o por medio de control de versiones, y cómo obtener el código en el árbol.</span></span></dd> <dt><a class="internal" href="/En/The_Mozilla_platform" title="En/The Mozilla platform"><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Elaborar documentación</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Información acerca de cómo construir proyectos de Mozilla, incluyendo Firefox y Thunderbird.</span></span> <em><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Esta página necesita limpieza.</span></span></em></dd> <dt><a class="internal" href="/En/The_Mozilla_platform" title="En/The Mozilla platform"><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La plataforma Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Información sobre la plataforma Mozilla, incluyendo todos sus APIs y tecnologías, así como la forma de utilizarlas en tus propios proyectos.</span></span></dd> <dt><a class="internal" href="/Project:en/How_to_Help" title="Project:en/How to Help"><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Documentar Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Ayuda a crear y mejorar nuestra documentación para Mozilla y para la Web abierta.</span></span></dd> <dt><a class="internal" href="/En/Debugging" title="En/Debugging"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Depuración (Debugging)</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Consejos útiles y pautas a seguir para depurar el código de Mozilla.</span></span></dd> <dt><a class="internal" href="/en/QA" title="en/QA"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Aseguramiento/Control de calidad</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Información sobre pruebas y control de errores.</span></span></dd> <dt><a class="internal" href="/es/Localización" title="es/Localización"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Localización</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Documentación en múltiples idiomas sobre traducción de los proyectos de Mozilla, documentación y otros muchos aspectos.</span></span></dd> <dt><a class="internal" href="/en/Glossary" title="en/Glossary"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Glosario</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Términos y definiciones utilizadas por los hackers de Mozilla.</span></span></dd> </dl> <h2 id="Páginas_sobre_proyectos"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Páginas sobre proyectos</span></span></h2> <dl> <dt><a class="internal" href="/en/Thunderbird" title="en/Thunderbird"><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Thunderbird</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cliente de correo Mozilla</span></span></dd> <dt><a class="internal" href="/en/Calendar" title="en/Calendar">Sunbird</a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Proyecto de calendario de Mozilla</span></span></dd> </dl> </td> <td> <h2 id="Herramientas"><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Herramientas</span></span></h2> <dl> <dt><a class="link-https" href="https://bugzilla.mozilla.org/" title="https://bugzilla.mozilla.org/"><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Bugzilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-ph-missing goog-gtc-from-human" dir="ltr" style="">La base de datos </span></span><a class="internal" href="/en/Bugzilla" title="En/Bugzilla">Bugzilla</a><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-ph-missing goog-gtc-from-human" dir="ltr" style=""> se usa para rastrear los problemas o incidencias relacionados con los proyectos de Mozilla.</span></span></dd> <dt><a class="external" href="http://mxr.mozilla.org/" title="http://mxr.mozilla.org/">MXR</a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Navega y busca en el repositorio de código fuente de Mozilla en la Web.</span></span></dd> <dt><a class="external" href="http://bonsai.mozilla.org/cvsqueryform.cgi" title="http://bonsai.mozilla.org/cvsqueryform.cgi">Bonsai</a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style="">La herramienta </span></span><a class="internal" href="/en/Bonsai" title="En/Bonsai">Bonsai</a><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style=""> te permite saber quién cambió qué archivo en el repositorio y cuándo lo hicieron.</span></span></dd> <dt><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi" title="http://tinderbox.mozilla.org/showbuilds.cgi">Tinderbox</a></dt> <dd><a class="internal" href="/en/Tinderbox" title="En/Tinderbox">Tinderbox</a><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style=""> muestra el estado del árbol (si actualmente se construye o no con éxito).</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Compruébalo antes de proteger (check in) o desplegar (check out) y asegúrate de que estás trabajando con un árbol de trabajo.</span></span></dd> <dt><a class="internal" href="/en/Crash_reporting" title="en/Crash reporting"><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Seguimiento de errores</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style="">Información sobre los sistemas de notificación de fallos </span></span><a class="link-https" href="https://crash-reports.mozilla.com/reports" title="https://crash-reports.mozilla.com/reports">Socorro</a><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style=""> y </span></span><a class="external" href="http://talkback-public.mozilla.org/search/start.jsp" title="http://talkback-public.mozilla.org/search/start.jsp">Talkback</a>.</dd> <dt><a class="external" href="http://graphs.mozilla.org/" title="http://graphs.mozilla.org/"><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Seguimiento del rendimiento</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Consulta la información de rendimiento para los proyectos de Mozilla.</span></span></dd> <dt><a class="external" href="http://www.mozilla.org/community/developer-forums.html" title="http://www.mozilla.org/community/developer-forums.html"><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Foros para desarrolladores</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Una lista de temas específicos de foros de discusión, donde puedes hablar sobre cuestiones de desarrollo de Mozilla.</span></span></dd> </dl> </td> </tr> </tbody>
+</table>
+<p>  <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ languages ({"en": "en/Participating_in_the_Mozilla_project", "zh-cn": "cn / Participating_in_the_Mozilla_project", "ja": "ja / Participating_in_the_Mozilla_project", "ko": "ko / Participating_in_the_Mozilla_project"}) }}</span></span></p>
diff --git a/files/es/orphaned/preguntas_frecuentes_sobre_incrustación_en_mozilla/index.html b/files/es/orphaned/preguntas_frecuentes_sobre_incrustación_en_mozilla/index.html
new file mode 100644
index 0000000000..e5a0fe2999
--- /dev/null
+++ b/files/es/orphaned/preguntas_frecuentes_sobre_incrustación_en_mozilla/index.html
@@ -0,0 +1,6 @@
+---
+title: Preguntas frecuentes sobre incrustación en Mozilla
+slug: orphaned/Preguntas_frecuentes_sobre_incrustación_en_Mozilla
+original_slug: Preguntas_frecuentes_sobre_incrustación_en_Mozilla
+---
+{{wiki.localize('System.API.page-generated-for-subpage')}}
diff --git a/files/es/orphaned/preguntas_frecuentes_sobre_incrustación_en_mozilla/introducción_a_gecko_e_inscrustación/index.html b/files/es/orphaned/preguntas_frecuentes_sobre_incrustación_en_mozilla/introducción_a_gecko_e_inscrustación/index.html
new file mode 100644
index 0000000000..d8704e6489
--- /dev/null
+++ b/files/es/orphaned/preguntas_frecuentes_sobre_incrustación_en_mozilla/introducción_a_gecko_e_inscrustación/index.html
@@ -0,0 +1,43 @@
+---
+title: Introducción a Gecko e inscrustación
+slug: >-
+  orphaned/Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación
+tags:
+  - Incrustando_Mozilla
+  - Todas_las_Categorías
+original_slug: >-
+  Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación
+---
+<p>
+</p>
+<h2 id="Secci.C3.B3n_1:_Introducci.C3.B3n_a_Gecko_e_incrustaci.C3.B3n"> Sección 1: Introducción a Gecko e incrustación </h2>
+<h3 id=".C2.BFQu.C3.A9_es_Gecko.3F"> ¿Qué es Gecko? </h3>
+<p>Gecko es el motor del navegador, gestión de redes, analizadores, modelos de diseño, chrome y las otras tecnologías sobre las que Mozilla y otras apliaciones son construidas. En otras palabras, todo aquello queno es específico de la aplicación.
+</p><p>Gecko tiene una ligeramente desactualizada <a class="external" href="http://www.mozilla.org/newlayout/faq.html">sección de preguntas frecuentes</a> of its own.
+</p>
+<h3 id=".C2.BFQu.C3.A9_es_Mozilla.3F"> ¿Qué es Mozilla? </h3>
+<p>Mozilla es una aplicación multimplataforma formada por un navegador web,un editor de páginas web un gesator de correo /lector de noticiasn desarrollado sobre Gecko.
+</p>
+<h3 id=".C2.BFQu.C3.A9_es_the_GRE.3F"> ¿Qué es the GRE? </h3>
+<p>El GRE (anteriormente conocido como MRE) es <a href="es/GRE">Gecko Runtime Environment</a> un entorno de ejecución que muchas aplicaciones pueden compartir. Actualmente se ha esta desarrollando como un proyecto independiente llamado <a href="es/XULRunner">XULRunner</a>.
+</p>
+<h3 id=".C2.BFQu.C3.A9_es_XPCOM.3F"> ¿Qué es XPCOM? </h3>
+<p>XPCOM es una <i>tecnología de objetos</i> (similar al COM de MS Windows pero multiplataforma) cuya misión es to unificar la creación, el control y la eliminación de objetos y otros datosbajo Mozilla. El núcleo XPCOM es la interfaz nsISupports, que proporciona marco de referencia de conteo y un entorno de ejecución de búsquedas para capacidades. Todos los objetos XPCOM incluyen la interfaz nsISupports, además de las interfaces específicas de cadad objeto. Finalmente, XPCOM incluye una capa lenguaje-independiente llamada XPConnect que permite que el desarrrollo de objetos sea escrito en cualquier lenguage compatible y sean llamados desde cualquier lenguaje compatible.
+</p><p>Puede encontrar más información <a class="external" href="http://www.mozilla.org/projects/xpcom/">aquí</a>.
+</p>
+<h3 id=".C2.BFQu.C3.A9_significa_Gecko_.E2.80.9Cincrustado.E2.80.9D.3F"> ¿Qué significa Gecko “incrustado”? </h3>
+<p>Gecko permite a desarrolladores de terceros emplear la misma tecnología que Mozilla usa.. Esto significa que puede incrustar un navegador web dentro de una aplicación de terceros, abrir canales y descargas dentro de los límites de la red, navergar por el DOM y más. Incluso puede construir aplicaciones enteras empleando el chrome.
+</p>
+<h3 id=".C2.BFCuales_son_los_t.C3.A9rminos_de_licencia_para_incrustar_Gecko.3F"> ¿Cuales son los términos de licencia para incrustar Gecko? </h3>
+<p>Los mismos que para el resto de Mozilla. Mire <a class="external" href="http://www.mozilla.org/MPL/">página MPL</a> fpara más información.
+</p>
+<h3 id=".C2.BFHay_disponible_un_SDK.3F"> ¿Hay disponible un SDK? </h3>
+<p>Estamos trabajando lentamente para crear un SDK. De momento le recomendamos que <a class="external" href="http://www.mozilla.org/source.html">obtenga el código fuente</a> y compile desde ahí.
+</p><p>Las versiones de desarrollo del SDK para Win32 pueden ser encontradas <a class="link-ftp" href="ftp://ftp.mozilla.org/pub/mozilla.org/mozilla/nightly/latest-trunk/gecko-sdk-i586-pc-msvc.zip">aquí</a>.
+</p>
+<h3 id=".C2.BFCu.C3.A1l_es_la_.C3.BAltima_versi.C3.B3n.3F_.C2.BFQue_versi.C3.B3n_deber.C3.ADa_usar.3F"> ¿Cuál es la última versión? ¿Que versión debería usar? </h3>
+<p>Versiones incrustadas y el código fuente se generan con frecuencia y pueden descargarse <a class="link-ftp" href="ftp://ftp.mozilla.org/pub/mozilla.org/xulrunner/nightly/latest-trunk/">aquí</a>. Si desea estabilidad se recomienda emplear versiones Mozilla de la rama 1.7.x.
+</p>
+<h3 id=".C2.BFQui.C3.A9n_est.C3.A1_usando_Gecko_actualmente.3F"> ¿Quién está usando Gecko actualmente? </h3>
+<p>Mire <a class="external" href="http://www.mozilla.org/projects/embedding/examples/">aquí</a> para ver la creciente lista de programas que incrustan Gecko.
+</p>
diff --git a/files/es/orphaned/principios_básicos_de_los_servicios_web/index.html b/files/es/orphaned/principios_básicos_de_los_servicios_web/index.html
new file mode 100644
index 0000000000..f94847ecf5
--- /dev/null
+++ b/files/es/orphaned/principios_básicos_de_los_servicios_web/index.html
@@ -0,0 +1,37 @@
+---
+title: Principios básicos de los servicios Web
+slug: orphaned/Principios_básicos_de_los_servicios_Web
+tags:
+  - SOAP
+  - Servicios_Web_XML
+  - Todas_las_Categorías
+  - XML
+  - XML-RPC
+original_slug: Principios_básicos_de_los_servicios_Web
+---
+<p>
+</p><p><span class="comment">Summary: Un tema candente en la Web últimamente son los servicios Web. Esta pequeña guía le permitirá aprender mas acerca de los servicios Web.</span>
+</p>
+<h3 id="Los_fundamentos"> Los fundamentos </h3>
+<p>Los servicios Web no son realmente nada nuevo, y actualmente, si ha utilizado RSS o Atom para leer noticias desde un sitio web, tiene una idea de como funciona un servicio Web.
+</p><p>Los servicios Web intercambian datos desde un servidor al cliente, utilizando el formato XML para enviar las peticiones, de modo que tanto el servidor como el cliente puede entenderse (<a href="es/Introducci%c3%b3n_a_XML">Introducción a XML</a>).
+</p><p>Una mejor forma de entender un servicio Web es compararlo con un formulario HTML (en PHP o ASP) para postear y enviar datos. Ambos, el servicio Web y el formulario, reciben y envían peticiones. La única diferencia es que un servicio Web utiliza XML.
+</p>
+<h3 id="Ejemplos_de_servicios_Web_en_acci.C3.B3n"> Ejemplos de servicios Web en acción </h3>
+<p>Como se dijo anteriormente, RSS y los alimentadores Atom son simplemente un ejemplo de como funciona un servicio Web, más comúnmente, XML-RPC o SOAP son también utilizados para realizar la comunicación entre el servidor y el cliente.
+</p>
+<h3 id="Introducci.C3.B3n_a_XML-RPC"> Introducción a XML-RPC </h3>
+<p>XML-RPC es un tipo de servicio Web que ha existido desde 1998 y aunque no es un estándar oficial <a class="external" href="http://www.w3.org/">W3C</a>,es utilizado extensamente. XML-RPC fue desarrollado por Useful Inc, junto con Microsoft.
+</p>
+<h3 id="Introducci.C3.B3n_a__SOAP"> Introducción a SOAP </h3>
+<p>SOAP, un servicio Web, está listado como un estándar <a class="external" href="http://www.w3.org/">W3C</a>, y es similar de diversas formas a XML_RPC. SOAP está respaldado por IBM, así como por Microsoft.
+</p>
+<h3 id=".C2.BFSOAP_0_XML-RPC.3F"> ¿SOAP 0 XML-RPC? </h3>
+<p>Brevemente, SOAP fue pensado para rellenar los huecos de XML-RPC. Por ejemplo, es mucho más fácil enviar un array multi-dimensional con SOAP que con XML-RPC. SOAP tiene más funcionalidad que XML-RPC, aunque XML-RPC también tiene su propio uso.
+</p>
+<div class="originaldocinfo">
+<h3 id="Informaci.C3.B3n_sobre_el_documento"> Información sobre el documento </h3>
+<ul><li> Autor(es): Justin G. Shreve
+</li><li> Fecha de la última actualización : 19 de Mayo de 2005
+</li></ul>
+</div>
diff --git a/files/es/orphaned/recursos_en_modo_desconectado_en_firefox/index.html b/files/es/orphaned/recursos_en_modo_desconectado_en_firefox/index.html
new file mode 100644
index 0000000000..9123d0a38b
--- /dev/null
+++ b/files/es/orphaned/recursos_en_modo_desconectado_en_firefox/index.html
@@ -0,0 +1,162 @@
+---
+title: Recursos en modo desconectado en Firefox
+slug: orphaned/Recursos_en_modo_desconectado_en_Firefox
+tags:
+  - Aplicaciones_web_en_desconectado
+  - Firefox 3
+original_slug: Recursos_en_modo_desconectado_en_Firefox
+---
+<p>{{ Fx_minversion_header(3) }}</p>
+
+<p>Firefox 3 implementa en gran parte el soporte HTML 5 para la memoria<em>cache</em> (memoria temporal) de la aplicación web en modo desconectado. Esto lo hace por medio del cache de la aplicación (un conjunto de recursos obtenido con un manifiesto proporcionado por la aplicación web).</p>
+
+<h3 id="El_cache_de_la_aplicaci.C3.B3n" name="El_cache_de_la_aplicaci.C3.B3n">El cache de la aplicación</h3>
+
+<p>{{ Note("Firefox no gestiona actualmente ningún control de versión en el cache de aplicación.") }}</p>
+
+<p>Ya que múltiples aplicaciones web pueden compartir recursos (y pueden incluso compartir la misma URI) cada aplicación mantiene su propio cache (su propia memoria temporal). Sin embargo, las diferentes cache de las aplicaciones son agrupadas por su propio manifiesto de usuario y tienen un<em>estado de actualización</em> conjunto. El estado de actualización es uno de los siguientes:</p>
+
+<dl>
+ <dt><code>idle</code></dt>
+ <dd>El cache de aplicación no está descargando actualizaciones.</dd>
+ <dt><code>checking</code></dt>
+ <dd>El cache está comprobando su propio manifiesto de recursos, para ver si hay uno más reciente.</dd>
+ <dt><code>downloading</code></dt>
+ <dd>El cache está actualizando su manifiesto de recursos con información nueva, ya que el anterior fue modificado.</dd>
+</dl>
+
+<p>{{ Fx_minversion_note(3, "Actualmente, sólo se permiten estradas de recursos. Firefox no admite aún cambios oportunistas o entradas de restitución (volver a versiones anteriores), sin embargo, es recomendable suministrar una lista blanca, si procede, para una compatibilidad futura.") }}</p>
+
+<h4 id="Recursos" name="Recursos">Recursos</h4>
+
+<p>El cache siempre incluye al menos un recurso, identificado por su URI, de al menos una de las siguientes categorías:</p>
+
+<dl>
+ <dt>Entradas implícitas (Implicit entries)</dt>
+ <dd>Son recursos agregados al cache por que un contexto de navegación principal visitado por el usuario incluyó un documento que indica que el recurso está en su cache, utilizando su atributo <code>manifest</code>.</dd>
+ <dt>El manifiesto (manifest)</dt>
+ <dd>Este es el manifiesto de recurso en sí mismo, cargado desde la URI especificada en una entrada de <code>html</code> implícita con el atributo <code>manifest</code>. El manifiesto es descargado y tratado durante el proceso de actualización del cache de la aplicación. Las entradas implícitas han de tener el mismo protocolo, servidor y puerto que el manifiesto.</dd>
+ <dt>Entradas explícitas (Explicit entries)</dt>
+ <dd>Son recursos listados en el manifiesto del cache.</dd>
+ <dt>Entradas de restitución/recuperación (Fallback entries)</dt>
+ <dd>Son recursos que fueron listados en el manifiesto del cache como entradas "fallback". <strong>No admitido aún en Firefox.</strong></dd>
+ <dt>Entradas oportunistas (Opportunistically cached entries)</dt>
+ <dd>Son recursos cuyas URI correspondían a un espacio de nombre de puesta en cache oportunista cuando se descargaron y que por tanto, fueron puestas automáticamente en la memoria de la aplicación. <strong>No admitido aún en Firefox.</strong></dd>
+ <dt>Entradas dinámicas (Dynamic entries)</dt>
+ <dd>Son recursos añadidos por programa, con el método <code><a href="es/NsIDOMOfflineResourceList#add.28.29">add()</a></code>.</dd>
+</dl>
+
+<h4 id="La_lista_blanca_en_l.C3.ADnea" name="La_lista_blanca_en_l.C3.ADnea">La lista blanca en línea</h4>
+
+<p>La lista blanca puede contener cero o más URIs de recursos, que la aplicación web necesitará obtener del servidor en lugar de desde la memoria cache. Esto permite al modelo de seguridad del navegador proteger al usuario de posibles brechas de seguridad, limitando el acceso sólo a recursos aprobados.</p>
+
+<p>{{ Note("La lista blanca no se usa en Firefox 3, sin embargo, convendría facilitar una si se necesita, tanto para tener y/o mantener la compatibilidad con versiones futuras de Firefox u otros navegadores que implementen recursos en modo desconectado.") }}</p>
+
+<h3 id="El_manifiesto" name="El_manifiesto">El manifiesto</h3>
+
+<p>Los archivos de manifiesto deben darse con el tipo MIME <code>text/cache-manifest</code>, y todos los recursos entregados con este tipo MIME deben seguir la sintaxis para un manifiesto de aplicación cache, según se define más abajo. Los manifiestos de cache son archivo de texto con formato 'UTF-8' y pueden, opcionalmente, incluir un carácter BOM. Las líneas nuevas pueden ser representadas por un carácter de nueva linea (U+000A) o por uno de retorno de carro (U+000D) o por ambos caracteres.</p>
+
+<p>La primera línea de un manifiesto cache debe contener la cadena de orden: "CACHE MANIFEST" (con un espacio simple U´0020 entre las dos palabras), seguido por nada, espacios o caracteres de tabulador. Cualquier otro texto en esta línea será ignorado.</p>
+
+<p>El resto del manifiesto debe estar compuesto por ninguna , alguna o todas las líneas siguientes:</p>
+
+<dl>
+ <dt>Línea vacía</dt>
+ <dd>Podemos utilizar líneas vacías (sin nada) o con caracteres de espacio o tabulador.</dd>
+ <dt>Comentario</dt>
+ <dd>Los comentarios son formados por un sólo carácter <strong>"#"</strong>, seguido por nada o con el texto del comentario, si se quiere se puede poner espacio/s antes (por ejemplo: <code> # Aquí va mi comentario </code>). Los comentarios sólo se pueden escribir en sus propias líneas y no se pueden añadir en otras líneas.</dd>
+ <dt>Cabecera de sección</dt>
+ <dd>Las cabeceras de sección especifican qué sección del manifiesto se está manipulando. Hay tres posibles cabeceras de sección:</dd>
+</dl>
+
+<blockquote>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Cabecera de sección</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td><code>CACHE:</code></td>
+   <td>Pasa a la sección explícita. Esta es la sección por defecto.</td>
+  </tr>
+  <tr>
+   <td><code>FALLBACK:</code></td>
+   <td>Pasa a la sección de recuperación ("fallback").
+    <p>{{ Note("Esta sección no está aún implementada en Firefox y será ignorada.") }}</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>NETWORK:</code></td>
+   <td>Pasa a la sección de la lista blanca en línea.
+    <p>{{ Note("La sección de lista blanca en línea, no está aún implementada en Firefox y será ignorada, sin embargo, suministrar una lista blanca apropiada está fuertemente recomendado.") }}</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+</blockquote>
+
+<dl>
+ <dd>La línea de cabecera de sección puede contener espacios vacíos, pero es obligatorio incluir el carácter <strong>":"</strong> después del nombre.</dd>
+ <dt>Datos para la sección activa.</dt>
+ <dd>El formato de las líneas de datos cambia de sección a sección. En la sección explícita, cada línea es una URI válida o referencia IRI a un recurso del cache. Los espacios vacíos están permitidos antes y después de la URI o IRI en cada línea.</dd>
+</dl>
+
+<p>El manifiesto puede pasar de atrás a delante de sección a sección como quiere (de modo que cada cabecera de sección se puede usar más de una vez) y las secciones pueden estar vacías. {{ Note("Las URI relativas son relativas a la URI del manifiesto del cache, no a la URI del documento que referencia el manifiesto.") }}</p>
+
+<h4 id="Un_manifiesto_de_ejemplo" name="Un_manifiesto_de_ejemplo">Un manifiesto de ejemplo</h4>
+
+<p>Este es un manifiesto simple para una página web imaginaria cuyo sitio es <span class="nowiki">foo.com</span>.</p>
+
+<pre class="eval">CACHE MANIFEST
+# v1
+# Esto es un comentario.
+<span class="nowiki">http://www.foo.com/index.html</span>
+<span class="nowiki">http://www.foo.com/header.png</span>
+<span class="nowiki">http://www.foo.com/blah/blah</span>
+</pre>
+
+<p>En este ejemplo, no hay cabecera de sección, por lo que se considera que todas las líneas de datos están en la sección explícita.</p>
+
+<p>El comentario "v1" está ahí por una buena razón. Ya que el cache es actualizado sólo cuando el manifiesto cambia, si cambia el recurso (por ejemplo, actualizando la imagen <code>header.png</code> con nuevo contenido), el archivo del manifiesto debe modificarse para advertir el navegador que necesita refrescar el cache. Se puede hacer con cualquier truco en el manifiesto, pero tener un número de versión es una buena forma de hacerlo.</p>
+
+<p>Para indicar a Firefox que use aplicaciones en modo desconectado (almacenadas en el cache) para un sitio determinado, el sitio debe utilizar el atributo <code>manifest</code> en el elemento <code>html</code>, de forma parecida a:</p>
+
+<pre class="eval"><span class="nowiki">&lt;html manifest="http://www.foo.com/cache-manifest"&gt;</span>
+  ...
+&lt;/html&gt;
+</pre>
+
+<h3 id="El_proceso_de_actualizaci.C3.B3n" name="El_proceso_de_actualizaci.C3.B3n">El proceso de actualización</h3>
+
+<ol>
+ <li>Cuando Firefox visita un documento que incluye el atributo <code>manifest</code>, envía un evento <code>checking</code> al objeto <code><a href="es/DOM/window.applicationCache">window.applicationCache</a></code>, y a continuación recupera el archivo del manifiesto, siguiendo las reglas HTTP apropiadas. Si la copia actualmente en cache del manifiesto está al día, se envía el evento <code>noupdate</code> a la <code>applicationCache</code>, y el proceso de actualización está completado.</li>
+ <li>Si el archivo del manifiesto no ha cambiado desde la última actualización, de nuevo, se envía el evento <code>noupdate</code> a la <code>applicationCache</code>, y el proceso de actualización está completado. Esta es la razón por la que, si los recursos cambian, el archivo del manifiesto debe modificarse para que Firefox sepa que necesita refrescar la cache de recursos.</li>
+ <li>Si el manifiesto ha cambiado, todos los archivos en el manifiesto -- así como aquellos agregados al manifiesto mediante la llamada a <code><a href="es/NsIDOMOfflineResourceList#add.28.29">applicationCache.add()</a></code> -- son agregados al cache temporal, siguiendo las reglas apropiadas de HTTP. Para cada archivo agregado a la cache, se envía un evento <code>progress</code> al objeto <code>applicationCache</code>. Si ocurre algún error, se envía un evento <code>error</code> y se detiene la actualización.</li>
+ <li>Una vez que se han recuperado todos los archivos, son movidos al cache real y se envía un evento <code>cached</code> al objeto <code>applicationCache</code>.</li>
+</ol>
+
+<h3 id="Caracter.C3.ADsticas_a.C3.BAn_sin_implementar_en_Firefox" name="Caracter.C3.ADsticas_a.C3.BAn_sin_implementar_en_Firefox">Características aún sin implementar en Firefox</h3>
+
+<p>Debido a que el borrador estándar para HTML 5 estaba aún cambiando cuando llegamos a la fecha de congelación de características de Firefox 3, hay partes de las capacidades en modo desconectado que no han sido implementadas:</p>
+
+<ol>
+ <li>La especificación del WHATWG indica que todas las peticiones deben venir de la copia cache desconectada, cuando es posible, aún cuando el navegador esté conectado. Firefox sólo accede a la copia cache desconectada, cuando el navegador no está conectado. Por esta razón, la lista blanca tampoco está aún funcionando.</li>
+ <li>Firefox no mantiene actualmente copias cache separadas para las distintas aplicaciones. Las aplicaciones deberían evitar compartir recursos entre diferentes manifiestos, a no ser que no produzcan conflicto entre diferentes versiones de los recursos. En general, las aplicaciones deberían mantener copias separadas de cada recurso.</li>
+ <li>Firefox no gestiona aún entradas de recuperación o de oportunidad.</li>
+</ol>
+
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/2008/WD-html5-20080122/#appcache">HTML 5 working draft: Application caches</a></li>
+ <li>{{ Interface("nsIDOMOfflineResourceList") }}</li>
+</ul>
+
+<p> </p>
+
+<p> </p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "en": "en/Offline_resources_in_Firefox", "fr": "fr/Ressources_hors_ligne_dans_Firefox", "ja": "ja/Offline_resources_in_Firefox", "pl": "pl/Zasoby_offline_w_Firefoksie", "zh-tw": "zh_tw/Offline_resources_on_Firefox" } ) }}</p>
diff --git a/files/es/orphaned/referencia_de_xul/index.html b/files/es/orphaned/referencia_de_xul/index.html
new file mode 100644
index 0000000000..0541bd7a2a
--- /dev/null
+++ b/files/es/orphaned/referencia_de_xul/index.html
@@ -0,0 +1,318 @@
+---
+title: Referencia de XUL
+slug: orphaned/Referencia_de_XUL
+original_slug: Referencia_de_XUL
+---
+<p>« <a href="/es/docs/XUL" title="es/XUL">Referencia de XUL</a> «</p>
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th colspan="3">Todos los elementos XUL (ordenados alfabéticamente)</th>
+  </tr>
+  <tr>
+   <td>
+    <p><a href="/en/XUL/action" title="en/XUL/action">action</a><br>
+     <a href="/en/XUL/arrowscrollbox" title="en/XUL/arrowscrollbox">arrowscrollbox</a><br>
+     <a href="/en/XUL/assign" title="en/XUL/assign">assign</a><br>
+     <a href="/en/XUL/bbox" title="en/XUL/bbox">bbox</a><br>
+     <a href="/en/XUL/binding" title="en/XUL/binding">binding</a><br>
+     <a href="/en/XUL/bindings" title="en/XUL/bindings">bindings</a><br>
+     <a href="/en/XUL/box" title="en/XUL/box">box</a><br>
+     <a href="/en/XUL/broadcaster" title="en/XUL/broadcaster">broadcaster</a><br>
+     <a href="/en/XUL/broadcasterset" title="en/XUL/broadcasterset">broadcasterset</a><br>
+     <a href="/en/XUL/button" title="en/XUL/button">button</a><br>
+     <a href="/en/XUL/browser" title="en/XUL/browser">browser</a><br>
+     <a href="/en/XUL/checkbox" title="en/XUL/checkbox">checkbox</a><br>
+     <a href="/en/XUL/caption" title="en/XUL/caption">caption</a><br>
+     <a href="/en/XUL/colorpicker" title="en/XUL/colorpicker">colorpicker</a><br>
+     <a href="/en/XUL/column" title="en/XUL/column">column</a><br>
+     <a href="/en/XUL/columns" title="en/XUL/columns">columns</a><br>
+     <a href="/en/XUL/commandset" title="en/XUL/commandset">commandset</a><br>
+     <a href="/en/XUL/command" title="en/XUL/command">command</a><br>
+     <a href="/en/XUL/conditions" title="en/XUL/conditions">conditions</a><br>
+     <a href="/en/XUL/content" title="en/XUL/content">content</a><br>
+     <a href="/en/XUL/datepicker" title="en/XUL/datepicker">datepicker</a><br>
+     <a href="/en/XUL/deck" title="en/XUL/deck">deck</a><br>
+     <a href="/en/XUL/description" title="en/XUL/description">description</a><br>
+     <a href="/en/XUL/dialog" title="en/XUL/dialog">dialog</a><br>
+     <a href="/en/XUL/dialogheader" title="en/XUL/dialogheader">dialogheader</a><br>
+     <a href="/en/XUL/dropmarker" title="en/XUL/dropmarker">dropmarker</a><br>
+     <a href="/en/XUL/editor" title="en/XUL/editor">editor</a><br>
+     <a href="/en/XUL/grid" title="en/XUL/grid">grid</a><br>
+     <a href="/en/XUL/grippy" title="en/XUL/grippy">grippy</a><br>
+     <a href="/en/XUL/groupbox" title="en/XUL/groupbox">groupbox</a><br>
+     <a href="/en/XUL/hbox" title="en/XUL/hbox">hbox</a><br>
+     <a href="/en/XUL/iframe" title="en/XUL/iframe">iframe</a><br>
+     <a href="/en/XUL/image" title="en/XUL/image">image</a><br>
+     <a href="/en/XUL/key" title="en/XUL/key">key</a><br>
+     <a href="/en/XUL/keyset" title="en/XUL/keyset">keyset</a><br>
+     <a href="/en/XUL/label" title="en/XUL/label">label</a><br>
+     <a href="/en/XUL/listbox" title="en/XUL/listbox">listbox</a><br>
+     <a href="/en/XUL/listcell" title="en/XUL/listcell">listcell</a><br>
+     <a href="/en/XUL/listcol" title="en/XUL/listcol">listcol</a><br>
+     <a href="/en/XUL/listcols" title="en/XUL/listcols">listcols</a><br>
+     <a href="/en/XUL/listhead" title="en/XUL/listhead">listhead</a><br>
+     <a href="/en/XUL/listheader" title="en/XUL/listheader">listheader</a><br>
+     <a href="/en/XUL/listitem" title="en/XUL/listitem">listitem</a></p>
+   </td>
+   <td>
+    <p><a href="/en/XUL/member" title="en/XUL/member">member</a><br>
+     <a href="/en/XUL/menu" title="en/XUL/menu">menu</a><br>
+     <a href="/en/XUL/menubar" title="en/XUL/menubar">menubar</a><br>
+     <a href="/en/XUL/menuitem" title="en/XUL/menuitem">menuitem</a><br>
+     <a href="/en/XUL/menulist" title="en/XUL/menulist">menulist</a><br>
+     <a href="/en/XUL/menupopup" title="en/XUL/menupopup">menupopup</a><br>
+     <a href="/en/XUL/menuseparator" title="en/XUL/menuseparator">menuseparator</a><br>
+     <a href="/en/XUL/notification" title="en/XUL/notification">notification</a><br>
+     <a href="/en/XUL/notificationbox" title="en/XUL/notificationbox">notificationbox</a><br>
+     <a href="/en/XUL/observes" title="en/XUL/observes">observes</a><br>
+     <a href="/en/XUL/overlay" title="en/XUL/overlay">overlay</a><br>
+     <a href="/en/XUL/page" title="en/XUL/page">page</a><br>
+     <a href="/en/XUL/panel" title="en/XUL/panel">panel</a><br>
+     <a href="/en/XUL/param" title="en/XUL/param">param</a><br>
+     <a href="/en/XUL/popupset" title="en/XUL/popupset">popupset</a><br>
+     <a href="/en/XUL/preference" title="en/XUL/preference">preference</a><br>
+     <a href="/en/XUL/preferences" title="en/XUL/preferences">preferences</a><br>
+     <a href="/en/XUL/prefpane" title="en/XUL/prefpane">prefpane</a><br>
+     <a href="/en/XUL/prefwindow" title="en/XUL/prefwindow">prefwindow</a><br>
+     <a href="/en/XUL/progressmeter" title="en/XUL/progressmeter">progressmeter</a><br>
+     <a href="/en/XUL/query" title="en/XUL/query">query</a><br>
+     <a href="/en/XUL/queryset" title="en/XUL/queryset">queryset</a><br>
+     <a href="/en/XUL/radio" title="en/XUL/radio">radio</a><br>
+     <a href="/en/XUL/radiogroup" title="en/XUL/radiogroup">radiogroup</a><br>
+     <a href="/en/XUL/resizer" title="en/XUL/resizer">resizer</a><br>
+     <a href="/en/XUL/richlistbox" title="en/XUL/richlistbox">richlistbox</a><br>
+     <a href="/en/XUL/richlistitem" title="en/XUL/richlistitem">richlistitem</a><br>
+     <a href="/en/XUL/row" title="en/XUL/row">row</a><br>
+     <a href="/en/XUL/rows" title="en/XUL/rows">rows</a><br>
+     <a href="/en/XUL/rule" title="en/XUL/rule">rule</a><br>
+     <a href="/en/XUL/scale" title="en/XUL/scale">scale</a><br>
+     <a href="/en/XUL/script" title="en/XUL/script">script</a><br>
+     <a href="/en/XUL/scrollbar" title="en/XUL/scrollbar">scrollbar</a><br>
+     <a href="/en/XUL/scrollbox" title="en/XUL/scrollbox">scrollbox</a><br>
+     <a href="/en/XUL/scrollcorner" title="en/XUL/scrollcorner">scrollcorner</a><br>
+     <a href="/en/XUL/separator" title="en/XUL/separator">separator</a><br>
+     <a href="/en/XUL/spacer" title="en/XUL/spacer">spacer</a><br>
+     <a href="/en/XUL/spinbuttons" title="en/XUL/spinbuttons">spinbuttons</a><br>
+     <a href="/en/XUL/splitter" title="en/XUL/splitter">splitter</a><br>
+     <a href="/en/XUL/stack" title="en/XUL/stack">stack</a><br>
+     <a href="/en/XUL/statusbar" title="en/XUL/statusbar">statusbar</a></p>
+   </td>
+   <td>
+    <p><a href="/en/XUL/statusbarpanel" title="en/XUL/statusbarpanel">statusbarpanel</a><br>
+     <a href="/en/XUL/stringbundle" title="en/XUL/stringbundle">stringbundle</a><br>
+     <a href="/en/XUL/stringbundleset" title="en/XUL/stringbundleset">stringbundleset</a><br>
+     <a href="/en/XUL/tab" title="en/XUL/tab">tab</a><br>
+     <a href="/en/XUL/tabbrowser" title="en/XUL/tabbrowser">tabbrowser</a> (Firefox-a partir de<br>
+     Firefox 3/Gecko 1.9)<br>
+     <a href="/en/XUL/tabbox" title="en/XUL/tabbox">tabbox</a><br>
+     <a href="/en/XUL/tabpanel" title="en/XUL/tabpanel">tabpanel</a><br>
+     <a href="/en/XUL/tabpanels" title="en/XUL/tabpanels">tabpanels</a><br>
+     <a href="/en/XUL/tabs" title="en/XUL/tabs">tabs</a><br>
+     <a href="/en/XUL/template" title="en/XUL/template">template</a><br>
+     <a href="/en/XUL/textnode" title="en/XUL/textnode">textnode</a><br>
+     <a href="/en/XUL/textbox" title="en/XUL/textbox">textbox</a><br>
+     <a href="/en/XUL/textbox_(Firefox_autocomplete)" title="en/XUL/textbox_(Firefox_autocomplete)">textbox (Firefox autocomplete)</a><br>
+     <a href="/en/XUL/textbox_(Mozilla_autocomplete)" title="en/XUL/textbox_(Mozilla_autocomplete)">textbox (Mozilla autocomplete)</a><br>
+     <a href="/en/XUL/timepicker" title="en/XUL/timepicker">timepicker</a><br>
+     <a href="/en/XUL/titlebar" title="en/XUL/titlebar">titlebar</a><br>
+     <a href="/en/XUL/toolbar" title="en/XUL/toolbar">toolbar</a><br>
+     <a href="/en/XUL/toolbarbutton" title="en/XUL/toolbarbutton">toolbarbutton</a><br>
+     <a href="/en/XUL/toolbargrippy" title="en/XUL/toolbargrippy">toolbargrippy</a><br>
+     <a href="/en/XUL/toolbaritem" title="en/XUL/toolbaritem">toolbaritem</a><br>
+     <a href="/en/XUL/toolbarpalette" title="en/XUL/toolbarpalette">toolbarpalette</a><br>
+     <a href="/en/XUL/toolbarseparator" title="en/XUL/toolbarseparator">toolbarseparator</a><br>
+     <a href="/en/XUL/toolbarset" title="en/XUL/toolbarset">toolbarset</a><br>
+     <a href="/en/XUL/toolbarspacer" title="en/XUL/toolbarspacer">toolbarspacer</a><br>
+     <a href="/en/XUL/toolbarspring" title="en/XUL/toolbarspring">toolbarspring</a><br>
+     <a href="/en/XUL/toolbox" title="en/XUL/toolbox">toolbox</a><br>
+     <a href="/en/XUL/tooltip" title="en/XUL/tooltip">tooltip</a><br>
+     <a href="/en/XUL/tree" title="en/XUL/tree">tree</a><br>
+     <a href="/en/XUL/treecell" title="en/XUL/treecell">treecell</a><br>
+     <a href="/en/XUL/treechildren" title="en/XUL/treechildren">treechildren</a><br>
+     <a href="/en/XUL/treecol" title="en/XUL/treecol">treecol</a><br>
+     <a href="/en/XUL/treecols" title="en/XUL/treecols">treecols</a><br>
+     <a href="/en/XUL/treeitem" title="en/XUL/treeitem">treeitem</a><br>
+     <a href="/en/XUL/treerow" title="en/XUL/treerow">treerow</a><br>
+     <a href="/en/XUL/treeseparator" title="en/XUL/treeseparator">treeseparator</a><br>
+     <a href="/en/XUL/triple" title="en/XUL/triple">triple</a><br>
+     <a href="/en/XUL/vbox" title="en/XUL/vbox">vbox</a><br>
+     <a href="/en/XUL/where" title="en/XUL/where">where</a><br>
+     <a href="/en/XUL/window" title="en/XUL/window">window</a><br>
+     <a href="/en/XUL/wizard" title="en/XUL/wizard">wizard</a><br>
+     <a href="/en/XUL/wizardpage" title="en/XUL/wizardpage">wizardpage</a></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+<h1 id="Referencia_de_XUL">Referencia de XUL</h1>
+<p>« <a href="/es/docs/XUL" title="es/XUL">Referencia de XUL</a> «</p>
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th colspan="3">Elementos XUL por categoría</th>
+  </tr>
+  <tr>
+   <td>
+    <p><u><strong>VENTANAS</strong></u></p>
+    <p><a href="/en/XUL/dialog" title="en/XUL/dialog">dialog</a><br>
+     <a href="/en/XUL/overlay" title="en/XUL/overlay">overlay</a><br>
+     <a href="/en/XUL/page" title="en/XUL/page">page</a><br>
+     <a href="/en/XUL/window" title="en/XUL/window">window</a><br>
+     <a href="/en/XUL/wizard" title="en/XUL/wizard">wizard</a><br>
+     <a href="/en/XUL/wizardpage" title="en/XUL/wizardpage">wizardpage</a><br>
+     <a href="/en/XUL/preference" title="en/XUL/preference">preference</a><br>
+     <a href="/en/XUL/preferences" title="en/XUL/preferences">preferences</a><br>
+     <a href="/en/XUL/prefpane" title="en/XUL/prefpane">prefpane</a><br>
+     <a href="/en/XUL/prefwindow" title="en/XUL/prefwindow">prefwindow</a></p>
+    <p><u><strong>ESTRUCTURA<br>
+     DE VENTANAS</strong></u></p>
+    <p><a href="/en/XUL/browser" title="en/XUL/browser">browser</a><br>
+     <a href="/en/XUL/tabbrowser" title="en/XUL/tabbrowser">tabbrowser</a><br>
+     <a href="/en/XUL/editor" title="en/XUL/editor">editor</a><br>
+     <a href="/en/XUL/iframe" title="en/XUL/iframe">iframe</a><br>
+     <a href="/en/XUL/titlebar" title="en/XUL/titlebar">titlebar</a><br>
+     <a href="/en/XUL/resizer" title="en/XUL/resizer">resizer</a><br>
+     <a href="/en/XUL/statusbar" title="en/XUL/statusbar">statusbar</a><br>
+     <a href="/en/XUL/statusbarpanel" title="en/XUL/statusbarpanel">statusbarpanel</a><br>
+     <a href="/en/XUL/dialogheader" title="en/XUL/dialogheader">dialogheader</a><br>
+     <a href="/en/XUL/notification" title="en/XUL/notification">notification</a><br>
+     <a href="/en/XUL/notificationbox" title="en/XUL/notificationbox">notificationbox</a></p>
+    <p><u><strong>MENUS Y VENTANAS<br>
+     EMERGENTES</strong></u></p>
+    <p><a href="/en/XUL/menubar" title="en/XUL/menubar">menubar</a><br>
+     <a href="/en/XUL/menu" title="en/XUL/menu">menu</a><br>
+     <a href="/en/XUL/menuitem" title="en/XUL/menuitem">menuitem</a><br>
+     <a href="/en/XUL/menuseparator" title="en/XUL/menuseparator">menuseparator</a><br>
+     <a href="/en/XUL/menupopup" title="en/XUL/menupopup">menupopup</a><br>
+     <a href="/en/XUL/panel" title="en/XUL/panel">panel</a><br>
+     <a href="/en/XUL/tooltip" title="en/XUL/tooltip">tooltip</a><br>
+     <a href="/en/XUL/popupset" title="en/XUL/popupset">popupset</a></p>
+    <p><u><strong>BARRAS DE<br>
+     HERRAMIENTAS</strong></u></p>
+    <p><a href="/en/XUL/toolbar" title="en/XUL/toolbar">toolbar</a><br>
+     <a href="/en/XUL/toolbarbutton" title="en/XUL/toolbarbutton">toolbarbutton</a><br>
+     <a href="/en/XUL/toolbargrippy" title="en/XUL/toolbargrippy">toolbargrippy</a><br>
+     <a href="/en/XUL/toolbaritem" title="en/XUL/toolbaritem">toolbaritem</a><br>
+     <a href="/en/XUL/toolbarpalette" title="en/XUL/toolbarpalette">toolbarpalette</a><br>
+     <a href="/en/XUL/toolbarseparator" title="en/XUL/toolbarseparator">toolbarseparator</a><br>
+     <a href="/en/XUL/toolbarset" title="en/XUL/toolbarset">toolbarset</a><br>
+     <a href="/en/XUL/toolbarspacer" title="en/XUL/toolbarspacer">toolbarspacer</a><br>
+     <a href="/en/XUL/toolbarspring" title="en/XUL/toolbarspring">toolbarspring</a><br>
+     <a href="/en/XUL/toolbox" title="en/XUL/toolbox">toolbox</a></p>
+    <p><u><strong>PESTAÑAS Y<br>
+     AGRUPAMIENTO</strong></u></p>
+    <p><a href="/en/XUL/tabbox" title="en/XUL/tabbox">tabbox</a><br>
+     <a href="/en/XUL/tabs" title="en/XUL/tabs">tabs</a><br>
+     <a href="/en/XUL/tab" title="en/XUL/tab">tab</a><br>
+     <a href="/en/XUL/tabpanels" title="en/XUL/tabpanels">tabpanels</a><br>
+     <a href="/en/XUL/tabpanel" title="en/XUL/tabpanel">tabpanel</a><br>
+     <a href="/en/XUL/groupbox" title="en/XUL/groupbox">groupbox</a><br>
+     <a href="/en/XUL/caption" title="en/XUL/caption">caption</a><br>
+     <a href="/en/XUL/separator" title="en/XUL/separator">separator</a><br>
+     <a href="/en/XUL/spacer" title="en/XUL/spacer">spacer</a></p>
+   </td>
+   <td>
+    <p><u><strong>CONTROLES</strong></u></p>
+    <p><a href="/en/XUL/button" title="en/XUL/button">button</a><br>
+     <a href="/en/XUL/checkbox" title="en/XUL/checkbox">checkbox</a><br>
+     <a href="/en/XUL/colorpicker" title="en/XUL/colorpicker">colorpicker</a><br>
+     <a href="/en/XUL/datepicker" title="en/XUL/datepicker">datepicker</a><br>
+     <a href="/en/XUL/menulist" title="en/XUL/menulist">menulist</a><br>
+     <a href="/en/XUL/progressmeter" title="en/XUL/progressmeter">progressmeter</a><br>
+     <a href="/en/XUL/radio" title="en/XUL/radio">radio</a><br>
+     <a href="/en/XUL/radiogroup" title="en/XUL/radiogroup">radiogroup</a><br>
+     <a href="/en/XUL/scale" title="en/XUL/scale">scale</a><br>
+     <a href="/en/XUL/splitter" title="en/XUL/splitter">splitter</a><br>
+     <a href="/en/XUL/textbox" title="en/XUL/textbox">textbox</a><br>
+     <a href="/en/XUL/textbox_(Firefox_autocomplete)" title="en/XUL/textbox_(Firefox_autocomplete)">textbox (Firefox autocomplete)</a><br>
+     <a href="/en/XUL/textbox_(Mozilla_autocomplete)" title="en/XUL/textbox_(Mozilla_autocomplete)">textbox (Mozilla autocomplete)</a><br>
+     <a href="/en/XUL/timepicker" title="en/XUL/timepicker">timepicker</a></p>
+    <p><u><strong>TEXTO E<br>
+     IMAGENES</strong></u></p>
+    <p><a href="/en/XUL/description" title="en/XUL/description">description</a><br>
+     <a href="/en/XUL/label" title="en/XUL/label">label</a><br>
+     <a href="/en/XUL/image" title="en/XUL/image">image</a></p>
+    <p><u><strong>LISTSS</strong></u></p>
+    <p><a href="/en/XUL/listbox" title="en/XUL/listbox">listbox</a><br>
+     <a href="/en/XUL/listitem" title="en/XUL/listitem">listitem</a><br>
+     <a href="/en/XUL/listcell" title="en/XUL/listcell">listcell</a><br>
+     <a href="/en/XUL/listcol" title="en/XUL/listcol">listcol</a><br>
+     <a href="/en/XUL/listcols" title="en/XUL/listcols">listcols</a><br>
+     <a href="/en/XUL/listhead" title="en/XUL/listhead">listhead</a><br>
+     <a href="/en/XUL/listheader" title="en/XUL/listheader">listheader</a><br>
+     <a href="/en/XUL/richlistbox" title="en/XUL/richlistbox">richlistbox</a><br>
+     <a href="/en/XUL/richlistitem" title="en/XUL/richlistitem">richlistitem</a></p>
+    <p><u><strong>ARBOLES</strong></u></p>
+    <p><a href="/en/XUL/tree" title="en/XUL/tree">tree</a><br>
+     <a href="/en/XUL/treecell" title="en/XUL/treecell">treecell</a><br>
+     <a href="/en/XUL/treechildren" title="en/XUL/treechildren">treechildren</a><br>
+     <a href="/en/XUL/treecol" title="en/XUL/treecol">treecol</a><br>
+     <a href="/en/XUL/treecols" title="en/XUL/treecols">treecols</a><br>
+     <a href="/en/XUL/treeitem" title="en/XUL/treeitem">treeitem</a><br>
+     <a href="/en/XUL/treerow" title="en/XUL/treerow">treerow</a><br>
+     <a href="/en/XUL/treeseparator" title="en/XUL/treeseparator">treeseparator</a></p>
+    <p> </p>
+   </td>
+   <td>
+    <p><u><strong>DISPOSICION</strong></u></p>
+    <p><a href="/en/XUL/box" title="en/XUL/box">box</a><br>
+     <a href="/en/XUL/hbox" title="en/XUL/hbox">hbox</a><br>
+     <a href="/en/XUL/vbox" title="en/XUL/vbox">vbox</a><br>
+     <a href="/en/XUL/bbox" title="en/XUL/bbox">bbox</a><br>
+     <a href="/en/XUL/deck" title="en/XUL/deck">deck</a><br>
+     <a href="/en/XUL/stack" title="en/XUL/stack">stack</a><br>
+     <a href="/en/XUL/grid" title="en/XUL/grid">grid</a><br>
+     <a href="/en/XUL/columns" title="en/XUL/columns">columns</a><br>
+     <a href="/en/XUL/column" title="en/XUL/column">column</a><br>
+     <a href="/en/XUL/rows" title="en/XUL/rows">rows</a><br>
+     <a href="/en/XUL/row" title="en/XUL/row">row</a><br>
+     <a href="/en/XUL/scrollbox" title="en/XUL/scrollbox">scrollbox</a></p>
+    <p><u><strong>PLANTILLAS</strong></u></p>
+    <p><a href="/en/XUL/action" title="en/XUL/action">action</a><br>
+     <a href="/en/XUL/assign" title="en/XUL/assign">assign</a><br>
+     <a href="/en/XUL/binding" title="en/XUL/binding">binding</a><br>
+     <a href="/en/XUL/bindings" title="en/XUL/bindings">bindings</a><br>
+     <a href="/en/XUL/conditions" title="en/XUL/conditions">conditions</a><br>
+     <a href="/en/XUL/content" title="en/XUL/content">content</a><br>
+     <a href="/en/XUL/member" title="en/XUL/member">member</a><br>
+     <a href="/en/XUL/param" title="en/XUL/param">param</a><br>
+     <a href="/en/XUL/query" title="en/XUL/query">query</a><br>
+     <a href="/en/XUL/queryset" title="en/XUL/queryset">queryset</a><br>
+     <a href="/en/XUL/rule" title="en/XUL/rule">rule</a><br>
+     <a href="/en/XUL/template" title="en/XUL/template">template</a><br>
+     <a href="/en/XUL/textnode" title="en/XUL/textnode">textnode</a><br>
+     <a href="/en/XUL/triple" title="en/XUL/triple">triple</a><br>
+     <a href="/en/XUL/where" title="en/XUL/where">where</a></p>
+    <p><u><strong>SCRIPTING</strong></u></p>
+    <p><a href="/en/XUL/script" title="en/XUL/script">script</a><br>
+     <a href="/en/XUL/commandset" title="en/XUL/commandset">commandset</a><br>
+     <a href="/en/XUL/command" title="en/XUL/command">command</a><br>
+     <a href="/en/XUL/broadcaster" title="en/XUL/broadcaster">broadcaster</a><br>
+     <a href="/en/XUL/broadcasterset" title="en/XUL/broadcasterset">broadcasterset</a><br>
+     <a href="/en/XUL/observes" title="en/XUL/observes">observes</a><br>
+     <a href="/en/XUL/key" title="en/XUL/key">key</a><br>
+     <a href="/en/XUL/keyset" title="en/XUL/keyset">keyset</a><br>
+     <a href="/en/XUL/stringbundle" title="en/XUL/stringbundle">stringbundle</a><br>
+     <a href="/en/XUL/stringbundleset" title="en/XUL/stringbundleset">stringbundleset</a></p>
+    <p><u><strong>ELEMENTOS DE AYUDA</strong></u></p>
+    <p><a href="/en/XUL/scrollbar" title="en/XUL/scrollbar">arrowscrollbox</a><br>
+     <a href="/en/XUL/dropmarker" title="en/XUL/dropmarker">dropmarker</a><br>
+     <a href="/en/XUL/grippy" title="en/XUL/grippy">grippy</a><br>
+     <a href="/en/XUL/scrollbar" title="en/XUL/scrollbar">scrollbar</a><br>
+     <a href="/en/XUL/scrollcorner" title="en/XUL/scrollcorner">scrollcorner</a><br>
+     <a href="/en/XUL/spinbuttons" title="en/XUL/spinbuttons">spinbuttons</a></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+<h3 id="Other_XUL_lists" name="Other_XUL_lists">Otras listas XUL</h3>
+<ul>
+ <li><a href="/en/XUL/Attribute" title="en/XUL/Attribute">Todos los atributos</a></li>
+ <li><a href="/en/XUL/Property" title="en/XUL/Property">Todas las propiedades</a></li>
+ <li><a href="/en/XUL/Method" title="en/XUL/Method">Todos los métodos</a></li>
+ <li><a href="/en/XUL_element_attributes" title="en/XUL_element_attributes">Atributos definidos por todos los elementos XUL</a></li>
+ <li><a href="/en/XUL/Style" title="en/XUL/Style">Clases de estilos</a></li>
+ <li><a href="/en/XUL/Events" title="en/XUL/Events">Manipuladores de eventos</a></li>
+ <li><a href="/en/XUL/Deprecated//Defunct_Markup" title="en/XUL/Deprecated//Defunct_Markup">Obsoletos/Marcas extintas</a></li>
+</ul>
diff --git a/files/es/orphaned/selección_de_modo_en_mozilla/index.html b/files/es/orphaned/selección_de_modo_en_mozilla/index.html
new file mode 100644
index 0000000000..65fbb9cebc
--- /dev/null
+++ b/files/es/orphaned/selección_de_modo_en_mozilla/index.html
@@ -0,0 +1,144 @@
+---
+title: Selección de modo en Mozilla
+slug: orphaned/Selección_de_modo_en_Mozilla
+tags:
+  - Desarrollo_Web
+  - HTML
+  - Todas_las_Categorías
+  - XHTML
+  - XML
+original_slug: Selección_de_modo_en_Mozilla
+---
+<p> </p>
+<p>Este documento describe cómo Mozilla utiliza el declaración de DOCTYPE para determinar si utilizar el modo estricto o el. El código que toma la decisión está actualmente en <a href="https://dxr.mozilla.org/mozilla-central/source/parser/htmlparser/src/nsParser.cpp#1021" rel="custom">DetermineParseMode() in nsParser.cpp</a>. Vea los <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1312" title='FIXED: "Standard" compatibility mode needs to be hooked to DOCTYPE'>error 1312</a> y <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=55264" title="FIXED: [DOCTYPE] Documents with unknown DOCTYPE should be displayed in strict mode">error 55264</a> para saber más sobre la historia de la selección del modo. Vea el <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=153032" title="FIXED: Implement almost-standards rendering mode">error 153032</a> sobre la creación del modo Casi-Estándar en Mozilla 1.0.</p>
+<p>Las metas que indujeron a elegir este comportamiento fueron las siguientes::</p>
+<ul>
+ <li>Casi todas las páginas existentes de <code>text/html</code> en la web que necesiten estar en el modo quirks para visualizarse correctamente deben exhibirse usando el modo quirks. (<em>Almost</em> all, rather than all, to allow for the following points as well.)</li>
+ <li>Los autores que escriben páginas web según los estándares actuales deben poder activar el modo estricto.</li>
+ <li>Cualquier página escrita usando un identificador público en las declaraciones de DOCTYPE que aparezcan en el futuro deberán exhibirse usando el modo estricto.</li>
+</ul>
+<p>En otras palabras, el algoritmo es la mejor aproximación que podemos encontrar para determinarse qué páginas fueron escritas después de que Mozilla se convirtiese en un 'agente de usuario' importante en la Web.</p>
+<h2 id="Modo_Est.C3.A1ndar_Completo" name="Modo_Est.C3.A1ndar_Completo">Modo Estándar Completo</h2>
+<p>Lo siguiente activa el modo estándar completo:</p>
+<ul>
+ <li>Cualquier documento enviado con un tipo MIME de XML como son: <code>text/xml</code>, <code>application/xml</code>, o <code>application/xhtml+xml</code> (la selección del modo solo se aplica a documentos enviados como text/html).</li>
+ <li>Cualquier <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+SYSTEM+%22http%3A%2F%2Fwww.w3.org%2FTR%2FREC-html40%2Fstrict.dtd%22%3E">"DOCTYPE HTML SYSTEM"</a> sin un "DOCTYPE HTML PUBLIC", excepto para el doctype de IBM indicado mas abajo.</li>
+ <li>Una declaración de DOCTYPE sin DTD, i.e., <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML%3E">&lt;!DOCTYPE HTML&gt;</a>.</li>
+ <li>Una declaración de DOCTYPE con un <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+%5B+%3C%21ELEMENT+TEST+-+-+%28P%29+%3E+%5D%3E+">subconjunto interno</a>.</li>
+ <li>Un doctype desconocido, incluyendo los siguentes doctypes (tecnicamente conocidos):
+  <ul>
+   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.01//EN"</a>.</li>
+   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.0//EN"</a>.</li>
+   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+XHTML+1.0+Strict%2F%2FEN%22%3E">"-//W3C//DTD XHTML 1.0 Strict//EN"</a>.</li>
+   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22ISO%2FIEC+15445:2000%2F%2FDTD+HyperText+Markup+Language%2F%2FEN%22%3E">"ISO/IEC 15445:2000//DTD HyperText Markup Language//EN"</a>.</li>
+   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22ISO%2FIEC+15445:2000%2F%2FDTD+HTML%2F%2FEN%22%3E">"ISO/IEC 15445:2000//DTD HTML//EN"</a>.</li>
+   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+i18n%2F%2FEN%22%3E">"-//IETF//DTD HTML i18n//EN"</a>.</li>
+  </ul>
+ </li>
+</ul>
+<h2 id="Modo_casi_est.C3.A1ndar" name="Modo_casi_est.C3.A1ndar">Modo casi estándar</h2>
+<p>Lo siguiente activa el modo casi estándar. el fue creado entre (1.0 y 1.1alpha) y (1.0.1 y 1.1beta). Antes de su creación estos DOCTYPE activaban el modo estándar completo.</p>
+<ul>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+XHTML+1.0+Transitional%2F%2FEN%22%3E">"-//W3C//DTD XHTML 1.0 Transitional//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+XHTML+1.0+Frameset%2F%2FEN%22%3E">"-//W3C//DTD XHTML 1.0 Frameset//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Transitional%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml4%2Floose.dtd%22%3E">"-//W3C//DTD HTML 4.01 Transitional//EN"</a>, con identificador de sistema.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Frameset%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml4%2Fframeset.dtd%22%3E">"-//W3C//DTD HTML 4.01 Frameset//EN"</a>, con identificador de sistema.</li>
+</ul>
+<h2 id="Modo_Quirks" name="Modo_Quirks">Modo Quirks</h2>
+<p>Lo siguiente activa el modo quirks (esta lista necesita ser completa para garantizar que todas las páginas ya existentes en la www pueden activar el modo quirks):</p>
+<p>En la elaboración de esta lista han sido utilizados los siguientes sitios: <a class="external" href="http://validator.w3.org/sgml-lib/catalog">W3C HTML Validator</a>, <a class="external" href="http://www.htmlhelp.com/tools/validator/lib/catalog">HTMLHelp HTML Validator</a>.</p>
+<ul>
+ <li>la <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=">ausencia de DOCTYPE</a>.</li>
+ <li>Una <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%3Fxml+version%3D%221.0%22%3F%3E">declaración XML (pseudo-PI) sin doctype</a> (osea, ignora la declaración XML y usa el DOCTYPE). En 1.0 y 1.1alpha o superior (Pero no en 1.0.1 o 1.1beta), la presencia de una declaración XML activa el modo estándar completo.</li>
+ <li>Una declaración de DOCTYPE que <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+NOT+UNDERSTOOD%3E">no puede ser entendida</a> (Ejemplo: comillas desparejadas).</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+html+SYSTEM+%22http%3A%2F%2Fwww.ibm.com%2Fdata%2Fdtd%2Fv11%2Fibmxhtml1-transitional.dtd%22%3E">"http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd"</a> (Antes de 1.5b y 1.4.2, esto activaba el Modo casi estándar).</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Transitional%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.01 Transitional//EN"</a>, sin identificador de sistema.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Frameset%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.01 Frameset//EN"</a>, sin identificador de sistema.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Transitional%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.0 Transitional//EN"</a> (vea también <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Transitional%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2FREC-html40%2Floose.dtd%22%3E">test with a system identifier</a>).</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Frameset%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.0 Frameset//EN"</a> (vea también <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Frameset%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2FREC-html40%2Fframeset.dtd%22%3E">test with a system identifier</a>).</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSoftQuad+Software%2F%2FDTD+HoTMetaL+PRO+6.0::19990601::extensions+to+HTML+4.0%2F%2FEN%22%3E">"-//SoftQuad Software//DTD HoTMetaL PRO 6.0::19990601::extensions to HTML 4.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSoftQuad%2F%2FDTD+HoTMetaL+PRO+4.0::19971010::extensions+to+HTML+4.0%2F%2FEN%22%3E">"-//SoftQuad//DTD HoTMetaL PRO 4.0::19971010::extensions to HTML 4.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML//EN//3.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3O%2F%2FDTD+W3+HTML+3.0%2F%2FEN%2F%2F%22%3E">"-//W3O//DTD W3 HTML 3.0//EN//"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3O%2F%2FDTD+W3+HTML+3.0%2F%2FEN%22%3E">"-//W3O//DTD W3 HTML 3.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3+1995-03-24%2F%2FEN%22%3E">"-//W3C//DTD HTML 3 1995-03-24//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3.0%2F%2FEN%22%3E">"-//IETF//DTD HTML 3.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3.0%2F%2FEN%2F%2F%22%3E">"-//IETF//DTD HTML 3.0//EN//"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3%2F%2FEN%22%3E">"-//IETF//DTD HTML 3//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+3%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 3//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+3%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML Level 3//EN//3.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3.2%2F%2FEN%22%3E">"-//IETF//DTD HTML 3.2//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FAdvaSoft+Ltd%2F%2FDTD+HTML+3.0+asWedit+%2B+extensions%2F%2FEN%22%3E">"-//AS//DTD HTML 3.0 asWedit + extensions//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FAdvaSoft+Ltd%2F%2FDTD+HTML+3.0+asWedit+%2B+extensions%2F%2FEN%22%3E">"-//AdvaSoft Ltd//DTD HTML 3.0 asWedit + extensions//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML Strict//EN//3.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3O%2F%2FDTD+W3+HTML+Strict+3.0%2F%2FEN%2F%2F%22%3E">"-//W3O//DTD W3 HTML Strict 3.0//EN//"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+3%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 3//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+3%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML Strict Level 3//EN//3.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22HTML%22%3E">"HTML"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML%2F%2FEN%22%3E">"-//IETF//DTD HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 2//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+2%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Level 2//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Level 2//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 1//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+1%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Level 1//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Level 1//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+0%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+0%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Level 0//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 2//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+2%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict Level 2//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Strict%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Strict//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Strict+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Strict Level 2//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 1//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+1%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict Level 1//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Strict+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Strict Level 1//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+0%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+0%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict Level 0//EN//2.0"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FWebTechs%2F%2FDTD+Mozilla+HTML%2F%2FEN%22%3E">"-//WebTechs//DTD Mozilla HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FWebTechs%2F%2FDTD+Mozilla+HTML+2.0%2F%2FEN%22%3E">"-//WebTechs//DTD Mozilla HTML 2.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FNetscape+Comm.+Corp.%2F%2FDTD+HTML%2F%2FEN%22%3E">"-//Netscape Comm. Corp.//DTD HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FNetscape+Comm.+Corp.%2F%2FDTD+HTML%2F%2FEN%22%3E">"-//Netscape Comm. Corp.//DTD HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FNetscape+Comm.+Corp.%2F%2FDTD+Strict+HTML%2F%2FEN%22%3E">"-//Netscape Comm. Corp.//DTD Strict HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+2.0+HTML%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 2.0 HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+2.0+HTML+Strict%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 2.0 HTML Strict//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+2.0+Tables%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 2.0 Tables//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+3.0+HTML%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 3.0 HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+3.0+HTML+Strict%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 3.0 HTML Strict//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+3.0+Tables%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 3.0 Tables//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSun+Microsystems+Corp.%2F%2FDTD+HotJava+HTML%2F%2FEN%22%3E">"-//Sun Microsystems Corp.//DTD HotJava HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSun+Microsystems+Corp.%2F%2FDTD+HotJava+Strict+HTML%2F%2FEN%22%3E">"-//Sun Microsystems Corp.//DTD HotJava Strict HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.1E%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.1E//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FO%27Reilly+and+Associates%2F%2FDTD+HTML+Extended+1.0%2F%2FEN%22%3E">"-//O'Reilly and Associates//DTD HTML Extended 1.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FO%27Reilly+and+Associates%2F%2FDTD+HTML+Extended+Relaxed+1.0%2F%2FEN%22%3E">"-//O'Reilly and Associates//DTD HTML Extended Relaxed 1.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FO%27Reilly+and+Associates%2F%2FDTD+HTML+2.0%2F%2FEN%22%3E">"-//O'Reilly and Associates//DTD HTML 2.0//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSQ%2F%2FDTD+HTML+2.0+HoTMetaL+%2B+extensions%2F%2FEN%22%3E">"-//SQ//DTD HTML 2.0 HoTMetaL + extensions//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSpyglass%2F%2FDTD+HTML+2.0+Extended%2F%2FEN%22%3E">"-//Spyglass//DTD HTML 2.0 Extended//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22%2B%2F%2FSilmaril%2F%2FDTD+HTML+Pro+v0r11+19970101%2F%2FEN%22%3E">"+//Silmaril//DTD HTML Pro v0r11 19970101//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+Experimental+19960712%2F%2FEN%22%3E">"-//W3C//DTD HTML Experimental 19960712//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2+Final%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2 Final//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2+Draft%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2 Draft//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+Experimental+970421%2F%2FEN%22%3E">"-//W3C//DTD HTML Experimental 970421//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2S+Draft%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2S Draft//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+W3+HTML%2F%2FEN%22%3E">"-//W3C//DTD W3 HTML//EN"</a>.</li>
+ <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?pubid=-%2F%2FMetrius%2F%2FDTD+Metrius+Presentational%2F%2FEN">"-//Metrius//DTD Metrius Presentational//EN"</a>.</li>
+</ul>
+<p>Tenga en cuenta que todas las comparaciones de los identificadores públicos son insensibles a mayúsculas o minúsculas (técnicamente esto es incorrecto, puesto que las cadenas sí son sensibles). Esto se hace así por el gran número de páginas con identificadores públicos en los que se usan mal.</p>
+<h2 id="Ver_m.C3.A1s" name="Ver_m.C3.A1s">Ver más</h2>
+<ul>
+ <li><a href="/es/Desarrollo_Web" title="es/Desarrollo_Web">Desarrollo Web</a></li>
+ <li><a href="/es/Modo_Quirks_en_Mozilla" title="es/Modo_Quirks_en_Mozilla">Modo Quirks en Mozilla</a></li>
+ <li><a href="/en/Mozilla_Quirks_Mode_Behavior">Mozilla Quirks Mode Behavior (en)</a></li>
+</ul>
+<div class="originaldocinfo">
+ <h2 id="Informaci.C3.B3n_sobre_el_Documento_Original" name="Informaci.C3.B3n_sobre_el_Documento_Original">Información sobre el Documento Original</h2>
+ <ul>
+  <li>Author(s): <a class="external" href="http://dbaron.org/">David Baron</a></li>
+  <li>Last Updated Date: August 2, 2005</li>
+  <li>Copyright Information: Copyright (C) <a class="external" href="http://dbaron.org/">David Baron</a></li>
+ </ul>
+</div>
+<p> </p>
diff --git a/files/es/orphaned/storage/index.html b/files/es/orphaned/storage/index.html
new file mode 100644
index 0000000000..9763850868
--- /dev/null
+++ b/files/es/orphaned/storage/index.html
@@ -0,0 +1,253 @@
+---
+title: Storage
+slug: orphaned/Storage
+tags:
+  - Interfaces
+  - Storage
+  - Todas_las_Categorías
+  - Toolkit API
+  - páginas_a_traducir
+original_slug: Storage
+---
+<br>
+<p>{{ Fx_minversion_header(2) }}</p>
+<p><strong>Storage</strong> es una API para la  base de datos <a class="external" href="http://www.sqlite.org/">SQLite</a>. Responde a las llamadas entidades de confianza, es decir, componentes internos de Firefox y extensiones. hace referencia completa a todos los métodos y propiedades de las conexiones de la interfaz de la  base de datos, lee <a href="/es/mozIStorageConnection" title="es/mozIStorageConnection">mozIStorageConnection</a>.</p>
+<p>El API está actualmente "unfrozen," lo que significa que está sujeto a cambios en cualquier momento. Es muy probable que el API cambie en la transición entre Firefox 2 y Firefox 3.</p>
+<p> </p>
+<div class="note"><strong>Nota:</strong> Storage no es lo mismo que la característica <a href="/es/DOM/Storage" title="es/DOM/Storage">DOM:Storage</a> que puede ser usada por páginas web para almacenar datos persistentes o la <a href="/es/Session_store_API" title="es/Session_store_API">Session store API</a> (una utilidad <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> de almacenaje para usar con las extensiones).</div>
+<p> </p>
+<h2 id="Empezando" name="Empezando">Empezando</h2>
+<p>Este documento cubre el API mozStorage y algunas peculiaridades de sqlite. <em>No</em> cubre SQL o el sqlite. Sin embargo, puedes encontrar varios enlaces útiles en la sección <a href="#Ver_tambi.C3.A9n"> Ver también</a>. Para obtener ayuda sobre el API mozStorage, puedes escribir a mozilla.dev.apps.firefox en el servidor de noticias news.mozilla.org. Para reportar errores, usa <a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Toolkit&amp;component=Storage">Bugzilla</a> (producto "Toolkit", componente "Storage").</p>
+<p>Bueno, aquí vamos. mozStorage fue diseñado igual que muchos otros sistemas de base de datos. El procedimiento general de su uso es:</p>
+<ul> <li>Abre una conexión con la base de datos de tu elección.</li> <li>Crea las sentencias a ejecutar en tu conexión.</li> <li>Agrega los parámetros de las sentencias si es necesario.</li> <li>Ejecuta las sentencias.</li> <li>Comprueba si hay errores.</li> <li>Comienza de nuevo con las sentencias.</li>
+</ul>
+<h2 id="Abrir_una_conexi.C3.B3n" name="Abrir_una_conexi.C3.B3n">Abrir una conexión</h2>
+<p>Para los usuarios de C++: La inicialización del servicio de storage debe hacerse desde el mismo hilo principal.Si lo inicializas por primera vez desde otro hilo, obtendrás un error. Por tanto, si quieres usar el servicio dentro de un hilo, asegúrate de llamar a getService desde el hilo principal para estar seguro de que el servicio ha sido creado.</p>
+<p>Ejemplo de apertura de una conexión a "asdf.sqlite" en el directorio del perfil del usuario, en C++:</p>
+<pre>nsCOMPtr&lt;nsIFile&gt; dbFile;
+rv = NS_GetSpecialDirectory(NS_APP_USER_PROFILE_50_DIR,
+                            getter_AddRefs(dbFile));
+NS_ENSURE_SUCCESS(rv, rv);
+rv = dbFile-&gt;Append(NS_LITERAL_STRING("asdf.sqlite"));
+NS_ENSURE_SUCCESS(rv, rv);
+
+mDBService = do_GetService(MOZ_STORAGE_SERVICE_CONTRACTID, &amp;rv);
+NS_ENSURE_SUCCESS(rv, rv);
+rv = mDBService-&gt;OpenDatabase(dbFile, getter_AddRefs(mDBConn));
+NS_ENSURE_SUCCESS(rv, rv);
+</pre>
+<p><code>MOZ_STORAGE_SERVICE_CONTRACTID</code> está definido en {{ Source("storage/build/mozStorageCID.h") }}. Su valor es <code>"@mozilla.org/storage/service;1"</code></p>
+<p>Ejemplo en JavaScript:</p>
+<pre>var file = Components.classes["@mozilla.org/file/directory_service;1"]
+                     .getService(Components.interfaces.nsIProperties)
+                     .get("ProfD", Components.interfaces.nsIFile);
+file.append("my_db_file_name.sqlite");
+
+var storageService = Components.classes["@mozilla.org/storage/service;1"]
+                        .getService(Components.interfaces.mozIStorageService);
+var mDBConn = storageService.openDatabase(file);
+</pre>
+<dl> <dd> <div class="note">Nota: La función OpenDatabase está sujeta a cambios. Seguramente será simplificada y ampliada para que sea más difícil meterse en problemas.</div> </dd>
+</dl>
+<p>Sería tentador nombrar a tu base de datos con un nombre terminado en ".sdb" por <strong>s</strong>qlite <strong>d</strong>ata<strong>b</strong>ase, pero esto <em>no es recomendable</em>. Esta extensión es tratada de forma especial por Windows como una extensión para "Application Compatibility Database" y sus cambios están respaldados por el sistema automáticamente como parte del sistema de recuperación del sistema. Esto puede dar lugar a un tratamiento desmesurado de las operaciones del archivo.</p>
+<h2 id="Sentencias" name="Sentencias">Sentencias</h2>
+<p>Sigue los pasos para crear y ejecutar sentencias SQL en tu base de datos SQLite. Para una completa referencia, lee <a href="/es/MozIStorageStatement" title="es/MozIStorageStatement">mozIStorageStatement</a>.</p>
+<h3 id="Creando_una_sentencia" name="Creando_una_sentencia">Creando una sentencia</h3>
+<p>Hay dos maneras de crear una sentencia. Si no tienes parámetros y la sentencia no devuelve ningún dato, usa <code>mozIStorageConnection.executeSimpleSQL</code>.</p>
+<pre>C++:
+rv = mDBConn-&gt;ExecuteSimpleSQL(NS_LITERAL_CSTRING("CREATE TABLE foo (a INTEGER)"));
+
+JS:
+mDBConn.executeSimpleSQL("CREATE TABLE foo (a INTEGER)");
+</pre>
+<p>De otra forma, deberías preparar la sentencia usando <code>mozIStorageConnection.createStatement</code>:</p>
+<pre>C++:
+nsCOMPtr&lt;mozIStorageStatement&gt; statement;
+rv = mDBConn-&gt;CreateStatement(NS_LITERAL_CSTRING("SELECT * FROM foo WHERE a = ?1"),
+                              getter_AddRefs(statement));
+NS_ENSURE_SUCCESS(rv, rv);
+
+JS:
+var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = ?1");
+</pre>
+<p>Este ejemplo usa el comodín "?1" para recoger un parámetro devuelto más adelante (lee la próxima sección).</p>
+<p>Una vez que has preparado la sentencia, puedes agrupar su parámetros, ejecutarla y re usarla una y otra vez. Si utilizas una sentencia repetidamente, el uso de sentencias pre compiladas te brindará una mejora notable en la ejecución, ya que las consultas SQL no necesitan ser analizadas cada vez.</p>
+<p>If you are familiar with sqlite, you may know that prepared statements are invalidated when the schema of the database changes. Fortunately, mozIStorageStatement detects the error and will recompile the statement as needed. Therefore, once you create a statement, you don't need to worry when changing the schema; all statements will continue to transparently work.</p>
+<h3 id="Agregar_los_par.C3.A1metros" name="Agregar_los_par.C3.A1metros">Agregar los parámetros</h3>
+<p>Generalmente es mucho mejor agregar los parámetros separadamente, en lugar de intentar construir una sentencia SQL en una cadena conteniendo los parámetros. Entre otras cosas, esto evita el ataque de inyección de SQL, ya que un parámetro suelto nunca podrá ser ejecutado como una sentencia SQL.</p>
+<p>Se agregan los parámetros a una sentencia SQL reemplazando los comodines. Los comodines son llamados por orden, empezando con el "?1", luego el "?2", etcétera. Usa la función BindXXXParameter(0) BindXXXParameter(1)... para cambiar esos comodines.</p>
+<dl> <dd> <div class="note">Presta atención: Los indices en los comodines van a partir de 1. Los indices de las funciones de cambio, empiezan en 0. Esto es: el "?1" corresponde al parámetro 0, "?1" corresponde al parámetro 1, etcétera.</div> </dd>
+</dl>
+<p>Tambien puedes usar parámetros con nombre como: ":ejemplo" en lugar de "?xx".</p>
+<p>Un comodín puede aparecer varias veces en una cadena SQL y todas las veces será reemplazado por el correspondiente valos. Los parámetros que no han sido agragados (unbound) serán interpretados como <code>NULL</code></p>
+<p>Los ejemplos a continuación, usan <code>bindUTF8StringParameter()</code> y <code>bindInt32Parameter()</code>. Para una lista de todas las demás funciones, lee <a href="/es/MozIStorageStatement#Binding_functions" title="es/MozIStorageStatement#Binding_functions">mozIStorageStatement</a>.</p>
+<p>Ejemplo en C++:</p>
+<pre>nsCOMPtr&lt;mozIStorageStatement&gt; statement;
+rv = mDBConn-&gt;CreateStatement(NS_LITERAL_CSTRING("SELECT * FROM foo WHERE a = ?1 AND b &gt; ?2"),
+                              getter_AddRefs(statement));
+NS_ENSURE_SUCCESS(rv, rv);
+rv = statement-&gt;BindUTF8StringParameter(0, "hello"); // "hello" será sustituido por "?1"
+NS_ENSURE_SUCCESS(rv, rv);
+rv = statement-&gt;BindInt32Parameter(1, 1234); // 1234 será sustituido por "?2"
+NS_ENSURE_SUCCESS(rv, rv);
+</pre>
+<p>Ejemplo en JavaScript:</p>
+<pre>var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = ?1 AND b &gt; ?2");
+statement.bindUTF8StringParameter(0, "hello");
+statement.bindInt32Parameter(1, 1234);
+</pre>
+<p>Si usas parámetros con nombre, deberías usar el método <code>getParameterIndex</code> para obtener el índice del parámetro con nombre. Aquí hay un ejemplo en JavaScript:</p>
+<pre>var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = :myfirstparam AND b &gt; :mysecondparam");
+
+var firstidx = statement.getParameterIndex(":myfirstparam");
+statement.bindUTF8StringParameter(firstidx, "hello");
+
+var secondidx = statement.getParameterIndex(":mysecondparam");
+statement.bindInt32Parameter(secondidx, 1234);
+</pre>
+<p>Por supuesto, puedes mezclar parámetros con nombre y con índice en la misma consulta:</p>
+<pre>var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = ?1 AND b &gt; :mysecondparam");
+
+statement.bindUTF8StringParameter(0, "hello");
+// you can also use
+// var firstidx = statement.getParameterIndex("?1");
+// statement.bindUTF8StringParameter(firstidx, "hello");
+
+var secondidx = statement.getParameterIndex(":mysecondparam");
+statement.bindInt32Parameter(secondidx, 1234);
+</pre>
+<p>Si quieres usar la clausula <code>WHERE</code> con una expresión <code>IN ( value-list )</code>, las sentencias de Bindings no funcionarán. En su lugar, construye una cadena. Si no estas usando unstradas del usuario, la seguridad no es una de tus preocupaciones:</p>
+<pre>var ids = "3,21,72,89";
+var sql = "DELETE FROM table WHERE id IN ( "+ ids +" )";
+</pre>
+<h3 id="Ejecutar_una_sentencia" name="Ejecutar_una_sentencia">Ejecutar una sentencia</h3>
+<p>La manera principal de ejecutar una sentencia es con <code>mozIStorageStatement.executeStep</code>. Esta función te permite enumerar todos los resultados (filas / registros) que produzca tu sentencia y te notificará cuando no hay más resultados.</p>
+<p>Después de una llamada a <code>executeStep</code>, debes usar la <strong>función de recogida apropiada</strong> en <a href="/es/MozIStorageValueArray" title="es/MozIStorageValueArray">mozIStorageValueArray</a> para recoger el valor en una fila (mozIStorageStatement implementa mozIStorageValueArray). El ejemplo de abajo sólo usa <code>getInt32()</code>.</p>
+<p>Puedes obtener el tipo de un valor desde <code>mozIStorageValueArray.getTypeOfIndex</code>, que devuelve el tipo de la columna especificada. Ten cuidado: sqlite no es una base de datos que maneje tipos. Si requieres un tipo diferente, sqlite hará lo mejor que pueda para convertirlo, y dará algún tipo por defecto si no lo consigue. Por tanto, es imposible obtener errores de tipo, pero puedes obtener datos extraños como valor devuelto.</p>
+<p>En código C++ se puede también usar las funciones <code>AsInt32</code>, <code>AsDouble</code>, etcétera. que devuelven el valor como un valor más manejable en C++. Ten precaución, sin embargo, ya que no tendrás errores si tu índice es invalido. Es imposible obtener otros errores, yq que sqlite siempre convertirá los tipos, aún si no tienen sentido.</p>
+<p>Ejemplo C++:</p>
+<pre>PRBool hasMoreData;
+while (NS_SUCCEEDED(statement-&gt;ExecuteStep(&amp;hasMoreData)) &amp;&amp; hasMoreData) {
+  PRInt32 value = statement-&gt;AsInt32(0);
+  // use the value...
+}
+</pre>
+<p>Ejemplo Javascript:</p>
+<pre>while (statement.executeStep()) {
+  var value = statement.getInt32(0); // ¡usa la función correcta!
+  // usa el valor...
+}
+</pre>
+<p>La función <code>mozIStorageStatement.execute()</code> es útil cuando no estás obteniendo datos de la sentencia. Lo que hace es ejecutar la sentencia una vez y luego volverla al estado inicial. Esto puede ser útil para las sentencias de inserción, ya que realmente limpia el código:</p>
+<pre>var statement = mDBConn.createStatement("INSERT INTO my_table VALUES (?1)");
+statement.bindInt32Parameter(52);
+statement.execute();
+</pre>
+<p>Este es un ejemplo simple pero completo en JavaScript y XUL, de cómo ejecutar sentencias SQL en una base de datos: <img alt="Image:TTRW2.zip">.</p>
+<h3 id="Re_crear_una_sentencia_.28reset.29" name="Re_crear_una_sentencia_.28reset.29">Re crear una sentencia (reset)</h3>
+<p>Es importante re crear sentencias que no han sido usadas nuevamente. Las sentencias no re creadas, dejarán un bloqueo en las tablas y evitarán que otras sentencias puedan acceder a los datos. Sentencias de lectura no re creadas evitarán que funcionen las sentencias de escritura.</p>
+<p>Cuando los objetos sentencias son liberados, su correspondiente sentencia en la base de datos es liberada. Si estás usando C++ y sabes que todas las referencias serán destruidas, no tienes que re crear explicitamente las sentencias. Además, si usas <code>mozIStorageStatement.execute()</code>, tampoco necesitas re crear explicitamente las sentencias, esta función lo hará por ti. En otro caso, llama a <code>mozIStorageStatement.reset()</code>.</p>
+<p>Los que usáis JavaScript, deberéis aseguraros de re crear las sentencias. Se particularmente escrupuloso con las excepciones. Querrás estar seguro de re crear las sentencias aún si ocurre una excepción, o los accesos subsiguientes pueden no ser posibles. Re crear una sentencia es relativamente poco pesado y no ocurre nada malo si ya ha sido re creada, así que no te preocupes por re creaciones innecesarias.</p>
+<pre>var statement = connection.createStatement(...);
+try {
+  // usa la sentencia...
+} finally {
+  statement.reset();
+}
+</pre>
+<p>Los que usáis C++ debéis hacer lo mismo. Existe un objeto en {{ Source("storage/public/mozStorageHelper.h") }} llamado mozStorageStatementScoper que se asegurará que una sentencia dada sea re creada cuando sales del ámbito. Es muy recomendable que uses este objeto si te es posible.</p>
+<pre>void someClass::someFunction()
+{
+  mozStorageStatementScoper scoper(mStatement)
+  // use the statement
+}
+</pre>
+<h2 id="id_de_la_.C3.BAltima_inserci.C3.B3n" name="id_de_la_.C3.BAltima_inserci.C3.B3n">id de la última inserción</h2>
+<p>Usa la propiedad <code>lastInsertRowID</code> en la conexión para obtener el id (id de la fila) de la última operación <code>INSERT</code> operation en la base de datos.<br>
+Esto es útil si tienes una columna en tu tabla que sea la clave primaria (como <code>INTEGER PRIMARY KEY</code> o <code>INTEGER PRIMARY KEY AUTOINCREMENT</code>) en cuyo caso SQLite asigna automáticamente un valor a cada fila insertada, si tu no proporcionas alguno. <a class="external" href="http://www.sqlite.org/capi3ref.html#sqlite3_last_insert_rowid"></a><a class="external" href="http://www.sqlite.org/faq.html#q1"></a> El valor devuelto es del tipo <code>number</code> en JS y <code>long long</code> en C++.</p>
+<p><code>lastInsertRowID</code> JS example:</p>
+<pre>var sql = "INSERT INTO contacts_table (number_col, name_col) VALUES (?1, ?2)"
+var statement = mDBConn.createStatement(sql);
+    statement.bindUTF8StringParameter(0, number);
+    statement.bindUTF8StringParameter(1, name);
+    statement.execute();
+    statement.reset();
+
+var rowid = mDBConn.lastInsertRowID;
+</pre>
+<h2 id="Transacciones" name="Transacciones">Transacciones</h2>
+<p>mozIStorageConnection tiene funciones para las transacciones de comienzo y final. Si no usas transacciones explicitamente, se creará una transacción implícita por ti para cada sentencia. Esto tiene una gran implicación en el rendimiento. Hay una sobrecarga en cada transacción, especialmente para las transacciones de confianza. Por tanto verás una apreciable ganancia en el rendimiento, cuando estés haciendo ejecutando varias sentencias en una fila, si las agrupas en una transacción. Ver <a href="/es/Storage/Performance" title="es/Storage/Performance">Storage:Performance</a> para más detalles.</p>
+<p>La mayor diferencia entre otros sitemas de base de datos y sqlite es que éste último no implementa transacciones anidadas. Esto significa que en el momento en que una transacción es abierta, no puedes abrir otra transacción. Puedes usar <code>mozIStorageConnection.transactionInProgress</code> para ver si la transacción está en progreso.</p>
+<p>También puedes simplemente ejecutar "BEGIN TRANSACTION" y "END TRANSACTION" directamente como sentencias SQL (esto es lo que hace la conexión cuando llamas a las funciones). Sin embargo, el uso de <code>mozIStorageConnection.beginTransaction</code> y las funciones relacionadas, está <em>fuertemente</em> recomendado, ya que guarda el estado de la transacción en la conexión. De otra forma, el atributo <code>transactionInProgress</code> tendrá el valor erróneo.</p>
+<p>sqlite tiene vario tipos de transacción:</p>
+<ul> <li>mozIStorageConnection.TRANSACTION_DEFERRED: Por defecto. El bloqueo de la base de datos es adquirido cuando es necesario (generalmente cuando ejecutas una sentencia, por primera vez, en una transacción).</li>
+</ul>
+<ul> <li>mozIStorageConnection.TRANSACTION_IMMEDIATE: Adquiere inmediatamente, un bloqueo de lectura en la base de datos.immediately.</li>
+</ul>
+<ul> <li>mozIStorageConnection.TRANSACTION_EXCLUSIVE: Adquiere inmediatamente, un bloqueo de escritura en la base de datos.immediately.</li>
+</ul>
+<p>Puedes pasar este tipo de transacción a <code>mozIStorageConnection.beginTransactionAs</code> para determinar que clase de transacción necesitas. Recuerda que si ya se ha iniciado otra transacción, esta operación no tendrá éxito. Generalmente, el tipo por defecto de TRANSACTION_DEFERRED es suficiente y no deberías usar otro tipo, a no ser, que realmente sepas porqué lo necesitas. Para más información, lee la documentación de sqlite: <a class="external" href="http://www.sqlite.org/lang_transaction.html">BEGIN TRANSACTION</a> y <a class="external" href="http://www.sqlite.org/lockingv3.html">locking</a>.</p>
+<pre>var ourTransaction = false;
+if (!mDBConn.transactionInProgress) {
+  ourTransaction = true;
+  mDBConn.beginTransactionAs(mDBConn.TRANSACTION_DEFERRED);
+}
+
+// ... usa la conexión ...
+
+if (ourTransaction)
+  mDBConn.commitTransaction();
+</pre>
+<p>A partir de código C++, puedes usar la clase mozStorageTransaction definida en {{ Source("storage/public/mozStorageHelper.h") }}. Esta clase iniciará una transacción del tipo especificado en la conexión especificada y, cuando salga del entorno, bien confiará o bien volverá la transacción a su estado inicial. Si ya hay una transacción en progreso, la clase de ayuda de la transacción no hará nada.</p>
+<p>También tiene funciones de confianza explicitas. El uso típico es que crees la clase que por defecto vuelva a su estado original (rollback) y luego realices la confianza de la transacción explicitamente cuando tenga éxito:</p>
+<pre>nsresult someFunction()
+{
+  // deferred transaction (the default) with rollback on failure
+  mozStorageTransaction transaction(mDBConn, PR_FALSE);
+
+  // ... use the connection ...
+
+  // everything succeeded, now explicitly commit
+  return transaction.Commit();
+}
+</pre>
+<h2 id="C.C3.B3mo_corromper_tu_base_de_datos" name="C.C3.B3mo_corromper_tu_base_de_datos">Cómo corromper tu base de datos</h2>
+<ul> <li>Lee este documento: <a class="external" href="http://www.sqlite.org/lockingv3.html">File locking and concurrency in sqlite version 3</a>, especialmente la sección sobre corrupción.</li>
+</ul>
+<ul> <li>Abre más de una conexión hacia el mismo archivo con nombres que no son exactaente los determinados por <code>strcmp</code>. Esto incluye "my.db" y "../dir/my.db" o, en Windows (sin diferencia Mayúsculas/minúsculas) "my.db" y "My.db". Sqlite intentará manejar muchos de estos casos, pero no debes porfiar en ello.</li>
+</ul>
+<ul> <li>Accede una base de datos desde un enlace simbólico.</li>
+</ul>
+<ul> <li>Abre conexiones a la misma base de datos desde más de un hilo (Ver Seguridad de los hilos" más abajo).</li>
+</ul>
+<ul> <li>Accede a una conexión o a una sentencia desde más de un hilo (Ver Seguridad de los hilos" más abajo).</li>
+</ul>
+<ul> <li>Abre la base de datos desde un programa externo mientras está abierto en Mozilla. Nuestro sistema de cache rompe la reglas normales de bloqueo de archivos en sqlite que permitirían hacer esto de forma segura.</li>
+</ul>
+<h2 id="Bloqueo_en_SQLite" name="Bloqueo_en_SQLite">Bloqueo en SQLite</h2>
+<p>SQLite bloquea la base de datos enteramente, esto es, cualquier intento de lectura causará un que intento de escritura devuelva SQLITE_BUSY, y una escritura activa causará que cualquier intento de lectura devuelva SQLITE_BUSY. Una sentencia es considerada activa a partir del primer step() hasta que se llame a reset(). execute() llama a step() y reset() a un tiempo. Un problema común es olvidar reset() una sentencia después de haber terminado con step().</p>
+<p>Mientras que una conexión SQLite dada es capaz de tener muchas sentencias abiertas, su modelo de bloqueo limita lo que estas sentencias pueden realmente hacer simultáneamente (leer o escribir). De hecho es posible que muchas sentencias estén leyendo al mismo tiempo, sin embargo, no es posible que varias sentencias estén leyendo y escribiendo a la vez <em>en la misma tabla</em> -- aún cuando deriven de la misma conexión.</p>
+<p>El modelo de bloque de SQLite se conoce como "two-tiered": nivel de conexión y nivel de tabla. La mayoría de las personas están familiarizadas con el nivel de conexión (base de datos): múltiples lecturas pero solo una escritura. El nivel de tabla (B-Tree) es lo que a veces puede resultar confuso. (Internamente, cada tabla en la base de datos tiene su propio B-Tree, de modo que tabla y "B-Tree" son técnicamente sinonimos).</p>
+<h3 id="Bloqueo_a_nivel_de_tabla" name="Bloqueo_a_nivel_de_tabla">Bloqueo a nivel de tabla</h3>
+<p>Podrías pensar que si tienes sólo una conexión, i esta bloquea la base da datos para escritura, podrías usar multiples sentencias para hacer lo que quieras. No exactamente. Debes tener en cuenta que los bloqueos a nivel de tabla (B-Tree) que están mantenidos por sentencias se mantienen a lo largo de la base de datos (por ejemplo, las sentencias de manejo SELECT).</p>
+<p>La regla general es esta: una sentencia de manejo puede <strong>not</strong> modificar una tabla (B-Tree) que otras sentencias de manejo están leyendo (tienen el cursor abierto sobre ellas) -- aún cuando la sentencia de manejo comparte la misma conexión (contenido de la transacción, bloqueo de la base de datos, etcétera) con las otras sentencias de manejo. <em>Intentar hacer eso, también bloqueará (o devolverá SQLITE_BUSY)</em>.</p>
+<p>Este problema a menudo aparece cuando intestas interactuar en una tabla usando una sentencia mientras modificas registros en la tabla con otra sentencia. Esto no funcionará (o entraña muchas posibilidades de no funcionar, dependiendo del optimizador (ver más abajo)). Las sentencias de modificación causarán un bloque ya que la sentencia de lectura tiene el cursor abierto sobre la tabla.</p>
+<h3 id="Trabajando_con_los_problemas_de_bloqueo" name="Trabajando_con_los_problemas_de_bloqueo">Trabajando con los problemas de bloqueo</h3>
+<p>La solución es seguir (1) como se dice más arriba. Teóricamente, (2) actualmente no debería funcionar con SQLite 3.x En este escenario, los bloqueos de base de datos entran en juego (con múltiples conexiones) adicionalmente a los bloqueos de tablas. La conexión 2 (conexiones de cambio) no serán capaces de modificar (escribir en) la base de datos mientras que la conexión 1 (conexión de lectura) esté leyendo. La conexión 2 requerirá un bloqueo exclusivo para ejecutar una sentencia de modificación SQL, que no podrá obtener mientras la conexión 1 tenga sentencias activas leyendo la base de datos (La conexión 1 tiene un bloqueo de lectura compartido durante este tiempo que prohíbe a cualquier otra conexión tener un bloqueo exclusivo).</p>
+<p>Otra opción es usar una tabla temporal. Crea una tabla temporal que contenga los resultados de la tabla de interés, interactúa con ella (poniendo los bloqueos de la tabla con las sentencias de lectura en la tabla temporal) y entonces las sentencias de modificación pueden hacer cambios en la tabla real sin ningún problema). Esto puede hacerse con sentencias derivadas de una conexión simple (contexto de la transacción). Esta escena ocurre algunas veces 'detrás del escenario' ya que ORDERED BY puede producir tablas temporales internamente. Sin embargo, no es seguro asumir que el optimizador hará esto en todos los casos. Crear tablas temporales explicitamente, es la única forma segura de realizar esta última opción.</p>
+<h2 id="Seguridad_de_los_hilos" name="Seguridad_de_los_hilos">Seguridad de los hilos</h2>
+<p>El servicio mozStorage y sqlite son hilos seguros. Sin embargo, ningún otro mozStorage u objeto sqlite son hilos seguros.</p>
+<ul> <li>El servicio storage debe ser creado en el hilo principal. Si quieres acceder al servicio desde otro hilo, debes asegurarte de llamar a getService desde el hilo principal con antelación.</li>
+</ul>
+<ul> <li>No puedes acceder a una conexión o una sentencia desde múltiples hilos. Esos objetos storage no son seguros y las representaciones sqlite tampoco son seguras. Aún cuando hagas bloqueo y te asegures que sólo ese hilo está haciendo algo, puede haber problemas. Este caso no ha sido probado y puede haber algún estado pre-implementación en el hilo de sqlite. Se recomienda fuertemente que no hagas esto.</li>
+</ul>
+<ul> <li>No puedes acceder una base de datos simple desde múltiples conexiones en múltiples hilos. Normalmente, sqlite permite esto. Sin embargo, hacemos <code>sqlite3_enable_shared_cache(1);</code> (ver <a class="external" href="http://www.sqlite.org/sharedcache.html">sqlite shared-cache mode</a>) que hace que múltiples conexiones compartan la misma memoria cache. Esto es importante para el rendimiento. Sin embargo, no hay bloqueos para el acceso a la memoria cache, lo que significa que se romperá si se usa desde más de un hilo.</li>
+</ul>
+<p>De nada vale, sin embargo, que los autores de las extensiones de JavaScript del navegador, esten menos impactados por estas restricciones de lo que estaban al principio. Si una base de datos es creada y usada de forma exclusiva desde JavaScript, la seguridad de los hilos no será, normalmente, una preocupación. El motor JavaScript interno de Firefox (SpiderMonkey) ejecuta el JavaScript dentro de un único y persistente hilo, excepto cuando JavaScript se ejecuta en un hilo diferente o es ejecutado a partir de una llamada realizada desde otro hilo (p.e. desde interfaces de stream o delde la red). Con excepción del uso incorrecto de JavaScript en múltiples hilos, los problemas solo deberían ocurrir si se accede aun hilo asociado a una base de datos previamente en uso a través de mozStorage.</p>
+<h2 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h2>
+<ul> <li><a href="/es/mozIStorageConnection" title="es/mozIStorageConnection">mozIStorageConnection</a> Conexión de la base de datos a un archivo específico o almacenamiento en memoria.</li> <li><a href="/es/MozIStorageStatement" title="es/MozIStorageStatement">mozIStorageStatement</a> Crea y ejecuta sentencias SQL en bases de datos SQLite.</li> <li><a href="/es/MozIStorageValueArray" title="es/MozIStorageValueArray">mozIStorageValueArray</a> Agrupa una matriz de valores SQL, como una fila resultante.</li> <li><a href="/es/MozIStorageFunction" title="es/MozIStorageFunction">mozIStorageFunction</a> Crea una nueva función SQLite.</li> <li><a href="/es/MozIStorageAggregateFunction" title="es/MozIStorageAggregateFunction">mozIStorageAggregateFunction</a> Crea una nueva función agregada SQLite.</li> <li><a href="/es/MozIStorageProgressHandler" title="es/MozIStorageProgressHandler">mozIStorageProgressHandler</a> Vigilar progresos durante la ejecución de una sentencia.</li> <li><a href="/es/MozIStorageStatementWrapper" title="es/MozIStorageStatementWrapper">mozIStorageStatementWrapper</a> Agrupador de la sentencia Storage.</li> <li><a href="/es/MozIStorageService" title="es/MozIStorageService">mozIStorageService</a> Servicio Storage.</li>
+</ul>
+<ul> <li><a href="/es/Storage/Performance" title="es/Storage/Performance">Storage:Rendimiento</a> Cómo hacer que tu conexión de base de datos rinda bien.</li> <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/3072">Storage Inspector Extension</a><span class="goog-zippy-collapsed" id="romanspan" style="display: none;"><img alt="" class="buttons square13 zippy-plus" id="romanimg" src="http://www.google.es/images/cleardot.gif"><span id="romantext">Mostrar forma romanizada</span><span class="short_text" id="result_box"><span title=""><br> </span></span></span> <span class="short_text" id="result_box"><span title="">Hace que sea fácil de ver los archivos de base de datos SQLite en el perfil actual.</span></span></li> <li><a class="external" href="http://www.sqlite.org/lang.html">SQLite Syntax</a> Query <span class="short_text" id="result_box"><span style="" title="">lengua que comprenda </span></span>SQLite</li> <li><a class="external" href="http://sqlitebrowser.sourceforge.net/">SQLite Database Browser</a><span class="medium_text" id="result_box"><span title="">es una herramienta capaz libre disponible para muchas plataformas. </span><span title="">Puede ser útil para examinar las bases de datos existentes y las pruebas sentencias SQL.</span></span> <span class="goog-zippy-collapsed" id="romanspan" style="display: none;"><img alt="" class="buttons square13 zippy-plus" id="romanimg" src="http://www.google.es/images/cleardot.gif"><span id="romantext">Mostrar forma romanizada</span></span></li> <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/5817">SQLite Manager Extension</a><span class="short_text" id="result_box"><span style="background-color: rgb(255, 255, 255);" title="">ayuda a administrar los archivos de base de datos SQLite en el equipo.</span></span> <span class="goog-zippy-collapsed" id="romanspan" style="display: none;"><img alt="" class="buttons square13 zippy-plus" id="romanimg" src="http://www.google.es/images/cleardot.gif"><span id="romantext">Mostrar forma romanizada</span></span> <div class="almost_half_cell" style=""> <div dir="ltr" style=""><span class="short_text" id="result_box"><span style="background-color: rgb(255, 255, 255);" title=""><br> </span></span></div> </div> </li>
+</ul>
+<p> </p>
+<p>{{ languages( { "es": "es/Almacenamiento", "fr": "fr/Storage", "ja": "ja/Storage", "pl": "pl/Storage", "en": "en/Storage" } ) }}</p>
diff --git a/files/es/orphaned/tools/add-ons/dom_inspector/index.html b/files/es/orphaned/tools/add-ons/dom_inspector/index.html
new file mode 100644
index 0000000000..a567e8fb2e
--- /dev/null
+++ b/files/es/orphaned/tools/add-ons/dom_inspector/index.html
@@ -0,0 +1,30 @@
+---
+title: DOM Inspector
+slug: orphaned/Tools/Add-ons/DOM_Inspector
+tags:
+  - CSS
+  - CSS:Herramientas
+  - DOM
+  - DOM:Herramientas
+  - Extensiones:Herramientas
+  - HTML
+  - HTML:Herramientas
+  - JavaScript
+  - JavaScript:Herramientas
+  - Temas
+  - Temas:Herramientas
+  - Todas_las_Categorías
+  - XUL
+  - XUL:Herramientas
+  - extensiones
+translation_of: Tools/Add-ons/DOM_Inspector
+original_slug: DOM_Inspector
+---
+<p>
+</p><p>El <b><a class="external" href="http://www.mozilla.org/projects/inspector/">DOM Inspector</a></b> (conocido como <b>DOMi</b>) es una herramienta de Mozilla utilizada para inspeccionar, navegar y editar el <i>Modelo de Objetos del Documento</i>(<a href="es/DOM">Document Object Model</a> en inglés) de los documentos - normalmente páginas web o ventanas <a href="es/XUL">XUL</a> .
+</p><p>Para más información sobre el DOMi, consulta <a class="external" href="http://kb.mozillazine.org/DOM_Inspector">la página del DOM Inspector en MozillaZine</a>.
+</p><p><span>Categorías</span>
+</p>
+<div class="noinclude">
+</div>
+{{ languages( { "en": "en/DOM_Inspector", "fr": "fr/Inspecteur_DOM", "it": "it/DOM_Inspector", "ja": "ja/DOM_Inspector", "ko": "ko/DOM_Inspector", "pl": "pl/Inspektor_DOM" } ) }}
diff --git a/files/es/orphaned/tools/add-ons/index.html b/files/es/orphaned/tools/add-ons/index.html
new file mode 100644
index 0000000000..416e88484d
--- /dev/null
+++ b/files/es/orphaned/tools/add-ons/index.html
@@ -0,0 +1,18 @@
+---
+title: Add-ons
+slug: orphaned/Tools/Add-ons
+tags:
+  - NeedsTranslation
+  - TopicStub
+  - Web Development
+  - Web Development:Tools
+translation_of: Tools/Add-ons
+original_slug: Tools/Add-ons
+---
+<p>Developer tools that are not built into Firefox, but ship as separate add-ons.</p>
+
+<dl>
+ <dt><a href="https://addons.mozilla.org/en-US/firefox/addon/websocket-monitor/">WebSocket Monitor</a></dt>
+ <dd>Examine the data exchanged in a WebSocket connection.</dd>
+ <dd> </dd>
+</dl>
diff --git a/files/es/orphaned/traducir_las_descripciones_de_las_extensiones/index.html b/files/es/orphaned/traducir_las_descripciones_de_las_extensiones/index.html
new file mode 100644
index 0000000000..a342dc195a
--- /dev/null
+++ b/files/es/orphaned/traducir_las_descripciones_de_las_extensiones/index.html
@@ -0,0 +1,91 @@
+---
+title: Traducir las descripciones de las extensiones
+slug: orphaned/Traducir_las_descripciones_de_las_extensiones
+tags:
+  - Complementos
+  - Localización
+  - Todas_las_Categorías
+  - extensiones
+original_slug: Traducir_las_descripciones_de_las_extensiones
+---
+<p> </p>
+<h3 id="Localizing_in_Gecko_1.9" name="Localizing_in_Gecko_1.9">Localizing in Gecko 1.9</h3>
+<p>{{ Gecko_minversion_header(1.9) }} {{ Fx_minversion_header(3) }}</p>
+<p>Gecko 1.9 incluye un nuevo y más robusto método para localizar descripciones añadidas y otros metadatos. Todas las diferentes descripciones aparecen ahora en el fichero <a href="es/Install_Manifests">install.rdf</a> utilizando las propedades <code>em:localized</code>. Cada una contiene al menos una propiedad <code>em:locale</code> que marca el localizador (locale) para el cual deberá utilizarse la citada información y, además, todas las diversas cadenas (strings) del localizador. El siguiente ejemplo demuestra lo dicho (la mayoría de las propiedades normales del manifiesto han sido suprimidas para abreviar):</p>
+<pre>&lt;?xml version="1.0"?&gt;
+
+&lt;RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+     xmlns:em="http://www.mozilla.org/2004/em-rdf#"&gt;
+  &lt;Description about="urn:mozilla:install-manifest"&gt;
+    &lt;em:id&gt;TabSidebar@blueprintit.co.uk&lt;/em:id&gt;
+    &lt;em:localized&gt;
+      &lt;Description&gt;
+        &lt;em:locale&gt;de-DE&lt;/em:locale&gt;
+        &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
+        &lt;em:description&gt;Zeigt in einer Sidebar Vorschaubilder der Inhalte aller offenen Tabs an.&lt;/em:description&gt;
+      &lt;/Description&gt;
+    &lt;/em:localized&gt;
+    &lt;em:localized&gt;
+      &lt;Description&gt;
+        &lt;em:locale&gt;es-ES&lt;/em:locale&gt;
+        &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
+        &lt;em:description&gt;Muestra una vista previa de sus pestañas en su panel lateral.&lt;/em:description&gt;
+      &lt;/Description&gt;
+    &lt;/em:localized&gt;
+    &lt;em:localized&gt;
+      &lt;Description&gt;
+        &lt;em:locale&gt;nl-NL&lt;/em:locale&gt;
+        &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
+        &lt;em:description&gt;Laat voorbeeldweergaven van uw tabbladen in de zijbalk zien.&lt;/em:description&gt;
+      &lt;/Description&gt;
+    &lt;/em:localized&gt;
+    &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
+    &lt;em:description&gt;Displays previews of your tabs in your sidebar.&lt;/em:description&gt;
+  &lt;/Description&gt;
+&lt;/RDF&gt;
+</pre>
+<p>Todos los metadatos mencionados más abajo pueden localizarse mediante este procedimiento. La información de localización "por defecto" proporcionada por la propiedad <code>em:localized</code>, puede ser pasada por alto utilizando un conjunto de preferencias de localización, según se detalla a continuación.</p>
+<p>El proceso para seleccionar la propiedad <code>em:localized</code> a utilizar para una determinada localización (locale) es el siguiente:</p>
+<ol>
+ <li>Si existe una propiedad con un identificador <code>em:locale</code> que se corresponde exactamente con la localización (locale) entonces se usará esa propiedad.</li>
+ <li>Si se encuentran comparaciones inexactas, entonces se utilizará aquella que tenga el máximo de partes coincidentes, estando dichas partes separadas entre sí por un guión (es decir, "es" coincidiría con "es-ES" y viceversa).</li>
+ <li>Si existe más de un localizador (locale) con el mismo número de partes coincidentes, entonces se utilizará el más general (es decir, "en" será preferente en "en-GB" cuando se busque, antes que "en-US").</li>
+</ol>
+<p>En primer lugar se mostrará la localización actual "en-GB" y posteriormente se mostrará la segunda localización correspondiente a "en-US".</p>
+<p>Si no se ha establecido ninguna preferencia y no se encuentra una coindidencia <code>em:localized property</code> para la localización actual "en-GB" o "en-US" entonces se utilizarán las propiedades especificadas directamente en el manifiesto de instalación, como último recurso, tal y como se utilizaban en las versiones anteriores a la versión Gecko 1.9.</p>
+<h3 id="Localizar_antes_de_Gecko_1.9" name="Localizar_antes_de_Gecko_1.9">Localizar antes de Gecko 1.9</h3>
+<p>Antes de Gecko 1.9, los desarrolladores de extensiones o aplicaciones añadidas (add-ons) tenían que seguir un procedimiento especial para definir las descripciones adicionales locales para las aplicaciones añadidas orientadas a las aplicaciones basadas en el juego de herraminetas "toolkit" original (tales como Firefox o Thunderbird).</p>
+<ul>
+ <li>Si aún no dispone de ellas, cree <a href="es/Localizing_an_extension#Localizing_strings_in_JavaScript_code"> localized properties files</a>. Asegúrese de que utiliza la codificación UTF-8 para garantizar que los caracteres extranjeros se muestren correctamente.</li>
+ <li>Añada la siguiente línea a cada uno de sus ficheros de propiedades de localización (donde: <var>EXTENSION_ID</var> corresponda a su identificador de extensión (extension ID) (<code>&lt;em:id&gt;</code> de <a href="es/Install.rdf">install.rdf</a>) y <var>LOCALIZED_DESCRIPTION</var> es la descripción de su extensión, que usted desea que aparezca en el idioma determinado):
+  <pre>extensions.EXTENSION_ID.description=LOCALIZED_DESCRIPTION</pre>
+ </li>
+ <li>Si aún no dispone de uno, cree <a href="es/Building_an_Extension#Defaults_Files"> a default preferences file</a>.</li>
+ <li>Añádale la siguiente línea (donde: <var>EXTENSION_ID</var> coincida con su identificador de aplicación (application ID) de <a href="es/Install_Manifests">install.rdf</a> y <var>PATH_TO_LOCALIZATION_FILE</var> sea la ruta correcta del fichero de localización que usted añadió anteriormente):
+  <pre>pref("extensions.EXTENSION_ID.description", "PATH_TO_LOCALIZATION_FILE");</pre>
+ </li>
+</ul>
+<h4 id="Cadenas_Localizables" name="Cadenas_Localizables">Cadenas Localizables</h4>
+<p>Los siguientes "metadatos" de las extensiones o aplicaciones añadidas (add-ons) pueden ser localizados utilizando este proceso:</p>
+<ul>
+ <li>name (nombre)</li>
+ <li>description (descripción)</li>
+ <li>creator (creador)</li>
+ <li>homepageURL (URL de la página de inicio)</li>
+</ul>
+<h4 id="Listas_Localizables" name="Listas_Localizables">Listas Localizables</h4>
+<p>En los casos en que puedan existir múltiples valores, se añade un índice numérico al final del nombre de cada preferencia:</p>
+<pre>extensions.EXTENSION_ID.contributor.1=FIRST_LOCALIZED_CONTRIBUTOR_NAME
+extensions.EXTENSION_ID.contributor.2=SECOND_LOCALIZED_CONTRIBUTOR_NAME
+extensions.EXTENSION_ID.contributor.3=THRID_LOCALIZED_CONTRIBUTOR_NAME
+
+pref("extensions.EXTENSION_ID.contributor.1", "PATH_TO_LOCALIZATION_FILE");
+pref("extensions.EXTENSION_ID.contributor.2", "PATH_TO_LOCALIZATION_FILE");
+pref("extensions.EXTENSION_ID.contributor.3", "PATH_TO_LOCALIZATION_FILE");
+</pre>
+<p>Los siguientes "metadatos" de las extensiones o aplicaciones añadidas (add-ons) pueden localizarse utilizando este proceso:</p>
+<ul>
+ <li>developer (desarrollador)</li>
+ <li>translator (traductor)</li>
+ <li>contributor (contribuidor)</li>
+</ul>
diff --git a/files/es/orphaned/traducir_una_extensión/index.html b/files/es/orphaned/traducir_una_extensión/index.html
new file mode 100644
index 0000000000..5691f27418
--- /dev/null
+++ b/files/es/orphaned/traducir_una_extensión/index.html
@@ -0,0 +1,162 @@
+---
+title: Traducir una extensión
+slug: orphaned/Traducir_una_extensión
+tags:
+  - Complementos
+  - Localización
+  - Todas_las_Categorías
+  - extensiones
+original_slug: Traducir_una_extensión
+---
+<p>{{PreviousNext("Añadir preferencias a una extensión", "Actualizar una extensión para que soporte múltiples aplicaciones de Mozilla")}}</p>
+
+<p>Este artículo está construido sobre los anteriores ejemplos de programación de extensiones añadiendo soporte para traducción a nuestra extensión. Realizando unos pocos y simples pasos se conseguirá hacer la extensión mucho más fácil de traducir en varios idiomas sin tener que editar los ficheros XUL o JavaScript.</p>
+
+<p>Si aún no has creado ninguna extensión o te gustaría refrescar la memoria, echa un vistazo a los anteriores artículos de la serie:</p>
+
+<ul>
+ <li><a href="/es/Crear_una_extensi%C3%B3n_en_la_barra_de_estado" title="es/Crear_una_extensión_en_la_barra_de_estado">Crear una extensión en la barra de estado</a></li>
+ <li><a href="/es/Crear_una_extensi%C3%B3n_din%C3%A1mica_en_la_barra_de_estado" title="es/Crear_una_extensión_dinámica_en_la_barra_de_estado">Crear una extensión dinámica en la barra de estado</a></li>
+ <li><a href="/es/A%C3%B1adir_preferencias_a_una_extensi%C3%B3n" title="es/Añadir_preferencias_a_una_extensión">Añadir preferencias a una extensión</a></li>
+</ul>
+
+<h2 id="Descargar_el_ejemplo" name="Descargar_el_ejemplo">Descargar el ejemplo</h2>
+
+<p>Puedes descargar el código de ejemplo de este artículo para poder compararlo o para usarlo como base para tu propia extensión.</p>
+
+<p>http://developer.mozilla.org/samples/extension-samples/localizedstockwatcher.zip</p>
+
+<h2 id="Traducir_cadenas_en_los_ficheros_XUL" name="Traducir_cadenas_en_los_ficheros_XUL">Traducir cadenas en los ficheros XUL</h2>
+
+<h3 id="Crear_los_ficheros_de_configuraci.C3.B3n_regional_necesarios" name="Crear_los_ficheros_de_configuraci.C3.B3n_regional_necesarios">Crear los ficheros de configuración regional necesarios</h3>
+
+<p>Cada fichero XUL que comprende la interfaz de usuario de tu extensión debería tener un fichero local en su directorio locale.</p>
+
+<p>Cada fichero locale mapea los nombres de las entidades referenciadas en los ficheros XUL a las mismas cadenas. El diálogo de preferencias, cuyo fichero XUL es <code>options.xul</code>, tiene un fichero <code>options.dtd</code> correspondiente con este aspecto:</p>
+
+<pre class="eval"> &lt;!ENTITY options_window_title "StockWatcher 2 Preferences"&gt;
+ &lt;!ENTITY options_symbol.label "Stock to watch: "&gt;
+</pre>
+
+<p>La entidad "options_window_title" está mapeada a la cadena "StockWatcher 2 Preferences", la cual es usada como título de la ventana de preferencias.</p>
+
+<p>El fichero <code>stockwatcher2.dtd</code> contiene el mapa para el fichero <code>stockwatcher2.xul</code>:</p>
+
+<pre class="eval"> &lt;!ENTITY panel_loading "Loading..."&gt;
+ &lt;!ENTITY menu_refresh_now.label "Refresh Now"&gt;
+ &lt;!ENTITY menu_apple.label "Apple (AAPL)"&gt;
+ &lt;!ENTITY menu_google.label "Google (GOOG)"&gt;
+ &lt;!ENTITY menu_microsoft.label "Microsoft (MSFT)"&gt;
+ &lt;!ENTITY menu_yahoo.label "Yahoo (YHOO)"&gt;
+</pre>
+
+<h3 id="Actualizar_los_ficheros_XUL" name="Actualizar_los_ficheros_XUL">Actualizar los ficheros XUL</h3>
+
+<p>Cada fichero XUL necesita referenciar su correspondiente fichero de configuración regional. Además necesitamos actualizar el código para utilizar entidades en lugar de cadenas, por lo que las sustituciones tomarán lugar basándose en la configuración regional actualmente activa.</p>
+
+<p>Para añadir una referencia al fichero de configuración regional correcto dado un fichero XUL necesitamos añadir una línea al fichero XUL. Para <code>options.xul</code> añadimos esta línea:</p>
+
+<pre class="eval"> &lt;!DOCTYPE window SYSTEM "<a class="external" rel="freelink">chrome://stockwatcher2/locale/options.dtd</a>"&gt;
+</pre>
+
+<p>Añadimos una línea similar al fichero <code>stockwatcher.xul</code>:</p>
+
+<pre class="eval"> &lt;!DOCTYPE overlay SYSTEM "<a class="external" rel="freelink">chrome://stockwatcher2/locale/stockwatcher2.dtd</a>"&gt;
+</pre>
+
+<p>En aplicaciones mayores podrías necesitar utilizar entidades de diversos ficheros de configuración regional en un único fichero XUL. <a href="/es/Utilizar_m%C3%BAltiples_DTDs" title="es/Utilizar_múltiples_DTDs">Utilizar múltiples DTDs</a> explica cómo hacer esto.</p>
+
+<p>Date cuenta de que las URLs de los ficheros DTD no incluyen realmente el nombre del idioma a utilizar. el registro chrome resuelve los URIs basándose en la configuración regional actual y los datos que proporcionas en tu <a href="#actualizar_el_manifiesto_chrome">manifiesto chrome</a>.</p>
+
+<p>Luego simplemente reemplazaremos cada cadena de texto en nuestros ficheros XUL con la correspondiente entidad. Por ejemplo, en <code>stockwatcher2.xul</code> cambiamos la línea:</p>
+
+<pre class="eval"> &lt;menuitem label="Refresh Now" oncommand="StockWatcher.refreshInformation()"/&gt;
+</pre>
+
+<p>por</p>
+
+<pre class="eval"> &lt;menuitem label="&amp;menu_refresh_now.label;" oncommand="StockWatcher.refreshInformation()"/&gt;
+</pre>
+
+<p>Haremos esto para cada cadena utilizada en cada fichero XUL.</p>
+
+<h2 id="Actualizar_el_manifiesto_chrome" name="Actualizar_el_manifiesto_chrome">Actualizar el manifiesto chrome</h2>
+
+<p>Para que Firefox conozca los ficheros de configuración regional necesitamos revisar nuestro fichero <code><a href="/es/Registro_chrome" title="es/Registro_chrome">|chrome.manifest</a></code>, añadiendo una línea por cada idioma.</p>
+
+<pre class="eval"> locale stockwatcher2 en-US chrome/locale/en-US/
+</pre>
+
+<p>Esto le dice a Firefox que el idioma en-US está ubicado en el directorio <code>chrome/locale/en-US</code>.</p>
+
+<h2 id="Traducir_cadenas_en_el_c.C3.B3digo_JavaScript" name="Traducir_cadenas_en_el_c.C3.B3digo_JavaScript">Traducir cadenas en el código JavaScript</h2>
+
+<p>Si tu código JavaScript contiene cadenas literales que necesitan ser traducidas, como hace nuestro ejemplo visualizador de stocks, también necesitaremos hacerlo traducible. Podemos hacer esto moviendo las cadenas a un conjunto. Los conjuntos de cadenas son creados mediante el establecimiento de un fichero de propiedades que mapea claves a valores de cadena. Para una explicación detallada de cómo funciona esto, lee <a href="/es/Tutorial_XUL/Ficheros_de_propiedades" title="es/Tutorial_XUL/Ficheros_de_propiedades">Tutorial XUL:Ficheros de propiedades</a>.</p>
+
+<h3 id="Crear_un_fichero_de_propiedades" name="Crear_un_fichero_de_propiedades">Crear un fichero de propiedades</h3>
+
+<p>Lo primero que hacemos es crear un fichero de propiedades para los literales usados por el código JavaScript en <code>stockwatcher2.js</code>:</p>
+
+<pre class="eval">changeString=Chg:
+openString=Open:
+lowString=Low:
+highString=High:
+volumeString=Vol:
+</pre>
+
+<p>El fichero <code>stockwatcher2.properties</code> mostrado anteriormente mapea cinco claves (<code>changeString</code>, <code>openString</code>, <code>lowString</code>, <code>highString</code>, y <code>volumeString</code>) a su correspondiente texto en inglés.</p>
+
+<h3 id="Crear_un_conjunto_de_cadenas" name="Crear_un_conjunto_de_cadenas">Crear un conjunto de cadenas</h3>
+
+<p>El siguiente paso es modificar el fichero <code>stockwatcher2.xul</code> para referenciar este fichero de propiedades. Haremos esto creando un conjunto de cadenas utilizando el siguiente código:</p>
+
+<pre class="eval"> &lt;stringbundleset id="stringbundleset"&gt;
+   &lt;stringbundle id="string-bundle" src="<a class="external" rel="freelink">chrome://stockwatcher2/locale/stockw...er2.properties</a>"/&gt;
+ &lt;/stringbundleset&gt;
+</pre>
+
+<p>Esto establece un nuevo conjunto de cadenas, referenciados por el ID "string-bundle", cuyas claves y valores han de ser cargados desde el fichero <code>stockwatcher2.properties</code> que ya habíamos creado.</p>
+
+<h3 id="Actualizando_el_c.C3.B3digo_JavaScript" name="Actualizando_el_c.C3.B3digo_JavaScript">Actualizando el código JavaScript</h3>
+
+<p>Ahora estamos listos para revisar el código JavaScript para cargar las cadenas desde el conjunto de cadenas en lugar de utilizar literales. Esto implica la reescritura de la función <code>refreshInformation()</code> para cargar las cadenas y su función interna <code>infoReceived()</code> para utilizar las cadenas cargadas y traducidas en lugar de literales.</p>
+
+<p>Añadimos a <code>refreshInformation()</code> el siguiente código:</p>
+
+<pre class="eval"> var stringsBundle = document.getElementById("string-bundle");
+ var changeString = stringsBundle.getString('changeString') + " ";
+ var openString = stringsBundle.getString('openString') + " ";
+ var lowString = stringsBundle.getString('lowString') + " ";
+ var highString = stringsBundle.getString('highString') + " ";
+ var volumeString = stringsBundle.getString('volumeString') + " ";
+</pre>
+
+<p>Este código obtiene una referencia al elemento conjunto de cadenas que hemos añadido a <code>stockwatcher2.xul</code> llamando a <code>document.getElementById()</code>, especificando el ID "string-bundle". Luego recupera todas las cadenas que necesitamos desde el conjunto, una a una, llamando al método del conjunto de cadenas <code><a class="external" href="http://www.xulplanet.com/references/elemref/ref_stringbundle.html#prop_getString">getString()</a></code>, pasando la clave apropiada para cada cadena.</p>
+
+<p>En este caso, también añadimos un espacio al final de cada cadena. Hacemos esto porque este programa funciona así en particular y no tienes porqué hacerlo siempre.</p>
+
+<p>Luego reemplazamos toda ocurrencia de las cadenas literales con las variables apropiadas:</p>
+
+<pre class="eval"> samplePanel.tooltipText = changeString + fieldArray[4] + " | " +
+     openString + fieldArray[5] + " | " +
+     lowString + fieldArray[6] + " | " +
+     highString + fieldArray[7] + " | " +
+     volumeString + fieldArray[8];
+</pre>
+
+<h2 id="Traducir_la_descripci.C3.B3n_en_install.rdf" name="Traducir_la_descripci.C3.B3n_en_install.rdf">Traducir la descripción en install.rdf</h2>
+
+<p>Mira <a href="/es/Traducir_descripciones_de_extensiones" title="es/Traducir_descripciones_de_extensiones">Traducir descripciones de extensiones</a>.</p>
+
+<h2 id="A.C3.B1adir_m.C3.A1s_traducciones" name="A.C3.B1adir_m.C3.A1s_traducciones">Añadir más traducciones</h2>
+
+<p>Para añadir otra traducción a un nuevo idioma, todo lo que necesitas hacer es añadir otra línea al manifiesto chrome referenciando la nueva configuración regional. Por ejemplo, para añadir una traducción al español deberías añadir:</p>
+
+<pre class="eval"> locale stockwatcher2 es-ES chrome/locale/es-ES/
+</pre>
+
+<p>Luego sólo hay que crear un subdirectorio <code>chrome/locale/es-ES</code> y añadir los ficheros DTD necesarios; en este caso <code>options.dtd</code> y <code>stockwatcher2.dtd</code>. Dichos ficheros deberían mapear las mismas etiquetas para la traducción al español de las cadenas utilizadas por la extensión.</p>
+
+<p>Del mismo modo, si tenemos algún fichero de propiedades que contenga cadenas traducidas para nuestro código JavaScript también necesitaremos crear versiones de configuración regional para aquellos ficheros de propiedades en el directorio <code>chrome/locale/es-ES</code>. Sólo las cadenas deberían ser traducidas; las claves deberían ser las mismas para cada traducción.</p>
+
+<p>{{PreviousNext("Añadir preferencias a una extensión", "Actualizar una extensión para que soporte múltiples aplicaciones de Mozilla")}}</p>
diff --git a/files/es/orphaned/usando_archivos_desde_aplicaciones_web/index.html b/files/es/orphaned/usando_archivos_desde_aplicaciones_web/index.html
new file mode 100644
index 0000000000..7130b99de3
--- /dev/null
+++ b/files/es/orphaned/usando_archivos_desde_aplicaciones_web/index.html
@@ -0,0 +1,378 @@
+---
+title: Usando archivos desde aplicaciones web
+slug: orphaned/Usando_archivos_desde_aplicaciones_web
+tags:
+  - Archivos
+  - HTML5
+  - para_revisar
+  - páginas_a_traducir
+original_slug: Usando_archivos_desde_aplicaciones_web
+---
+<p>{{ gecko_minversion_header("1.9.2") }}</p>
+
+<p> </p>
+
+<p>Al usar la API de Archivos agregada al DOM en HTML5, ahora es posible que el contenido de una página web solicite al usuario que elija un archivo local para luego leer el contenido de esos archivos. Esta selección puede hacerse tanto usando un elemento <code class="western"><a href="/en/DOM/HTMLInputElement" title="en/DOM/HTMLInputElement">input</a></code> de HTML o arrastrando y soltando el archivo.</p>
+
+<h2 id="Seleccionar_archivos_usando_HTML"> Seleccionar archivos usando HTML</h2>
+
+<p> Seleccionar un solo archivo para usar con la API de archivo es simple:</p>
+
+<pre><code>&lt;input type="file" id="input" onchange="handleFiles(this.files)"&gt;</code>
+</pre>
+
+<p>Cuando el usuario selecciona un archivo, se  llama a la función <code>handleFiles()</code>  con un objeto <a href="/en/DOM/FileList" title="en/DOM/FileList"><code>FileList</code></a> que contiene el objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File </code></a>representando el archivo seleccionado por el usuario.</p>
+
+<p>Si desea permitir al usuario seleccionar varios archivos, simplemente use el atributo <code>multiple</code> en el elemento <code>input</code>:</p>
+
+<pre><code>&lt;input type="file" id="input" multiple="true" onchange="handleFiles(this.files)"&gt;</code>
+</pre>
+
+<p>En este caso, la lista de archivos se pasa a la función <code>handleFiles()contiene </code><code>un objeto</code> <a href="/en/DOM/File" title="en/DOM/File"> <code>File</code></a> por cada archivo que el usuario ha seleccionado.</p>
+
+<p>{{ h2_gecko_minversion("Uso de elementos ocultos del archivo de entrada usando el método click() ", "2.0") }}</p>
+
+<p>Desde la versión 2.0 de Gecko {{ geckoRelease("2.0") }}, puedes esconder el elemento file {{ HTMLElement("input") }} y mostrar una interfaz propia para abrir el examinador de archivos y para mostrar que archivo o archivos ha seleccionado el usuario. Puedes hacerlo agregándole al estilo del elemento input la instrucción "display:none" y usando el método <code>click()</code> en el elemento {{ HTMLElement("input") }}.</p>
+
+<p>Considere este código HTML:</p>
+
+<pre class="deki-transform">&lt;input type="file" id="fileElem" multiple accept="image/*" style="display:none" onchange="handleFiles(this.files)"&gt;
+&lt;a href="#" id="fileSelect"&gt;Select some files&lt;/a&gt;
+</pre>
+
+<p>Tu método <code>doClick()</code> puede verse como esto:</p>
+
+<pre class="deki-transform">var fileSelect = document.getElementById("fileSelect"),
+  fileElem = document.getElementById("fileElem");
+
+fileSelect.addEventListener("click", function (e) {
+  if (fileElem) {
+    fileElem.click();
+  }
+  e.preventDefault(); // prevent navigation to "#"
+}, false);
+</pre>
+
+<p>Obiamente puedes darle estilo al nuevo botón para abrir el selector de archivos como desees.</p>
+
+<h3 id="Dinámica_de_la_adición_de_un_detector_de_cambio">Dinámica de la adición de un detector de cambio</h3>
+
+<p> Si tu campo de entrada fue creado con una librería de JavaScript como <a class="external" href="http://www.jquery.com/">jQuery</a>, necesitarás usar {{ domxref("element.addEventListener()") }} para agregar un manejador de eventos de cambio, como este:</p>
+
+<pre class="deki-transform">var inputElement = document.getElementById("inputField");
+inputElement.addEventListener("change", handleFiles, false);
+
+function handleFiles() {
+  var fileList = this.files;
+
+  /* now you can work with the file list */
+}
+</pre>
+
+<p> Nota que en este caso, la función <code class="western">handleFiles()</code> busca la lista de archivos en lugar de aceptar un parámetro, ya que los detectores de eventos añadidos de esta manera no pueden aceptar un parámetro de entrada.</p>
+
+<p> </p>
+
+<p>{{ h1_gecko_minversion("Usando Objetos URL", "2.0") }}</p>
+
+<p>Gecko 2.0 {{ geckoRelease("2.0") }} introduce asistencia para el DOM {{ domxref("window.URL.createObjectURL()") }} y los métodos {{ domxref("window.URL.revokeObjectURL()") }} Esto te permite crear URLs simples para ser usadas como referencia a cualquier dato que pueda ser referenciado usando un objeto DOM <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a>, incluyendo archivos locales en el computador del usuario.</p>
+
+<p>Cuando tienes un objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> te gustaría hacer referencia por URL desde HTML, puedes crear un objeto URL para que quede así :</p>
+
+<pre>var objectURL = window.URL.createObjectURL(fileObj);
+</pre>
+
+<p>El objeto URL es una cadena de caracteres que identifica el objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> . Cada vez que invocas {{ domxref("window.URL.createObjectURL()") }}, un único objeto URL es creado, <span class="long_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener traducciones alternativas">incluso, si usted</span> ya <span class="hps" title="Haz clic para obtener traducciones alternativas">ha</span> <span class="hps" title="Haz clic para obtener traducciones alternativas">creado</span> <span class="hps" title="Haz clic para obtener traducciones alternativas">un</span><span class="hps" title="Haz clic para obtener traducciones alternativas"> objeto URL de</span> <span class="hps" title="Haz clic para obtener traducciones alternativas">ese archivo</span></span>. Cada uno de estos debe ser liberado. Mientras se liberan automáticamente cuando se libera la memoria utilizada por el documento, sí tu página los usa dinámicamente, podrías liberarlos explicitamente invocando {{ domxref("window.URL.revokeObjectURL()") }}:</p>
+
+<pre>window.URL.revokeObjectURL(objectURL);
+</pre>
+
+<h2 id="Selección_de_archivos_usando_arrastrar_y_soltar">Selección de archivos usando arrastrar y soltar</h2>
+
+<p> <span lang="es-ES">También puedes dejar que el usuario arrastre y suelte los archivos en la aplicación Web.</span></p>
+
+<p>El primer paso es establecer una zona para soltar. Exactamente que parte de tu contenido aceptara soltar puede variar dependiendo de el diseño de tu aplicación, pero hacer un elemento que reciba eventos de soltar es fácil:</p>
+
+<pre class="deki-transform">var dropbox;
+
+dropbox = document.getElementById("dropbox");
+dropbox.addEventListener("dragenter", dragenter, false);
+dropbox.addEventListener("dragover", dragover, false);
+dropbox.addEventListener("drop", drop, false);
+</pre>
+
+<p> En este ejemplo, estamos girando el elemento con el ID "dropbox" en nuestra zona para soltar. Esto se hace mediante la adicción de manejadores que escuchen los eventos <code class="western">dragenter</code>, <code class="western">dragover</code>, y <code class="western">drop</code>.</p>
+
+<p>En realidad no necesitamos hacer nada con los eventos <code class="western">dragenter</code> and <code class="western">dragover</code> en nuestro caso, por lo que estas funciones son a la vez simples. Acabar de detener la propagación del evento y evitar que la acción predeterminada ocurra:</p>
+
+<pre class="deki-transform">function dragenter(e) {
+  e.stopPropagation();
+  e.preventDefault();
+}
+
+function dragover(e) {
+  e.stopPropagation();
+  e.preventDefault();
+}
+</pre>
+
+<p>La verdadera magia pasa en la función <code class="western">drop()</code>:</p>
+
+<pre class="deki-transform">function drop(e) {
+  e.stopPropagation();
+  e.preventDefault();
+
+  var dt = e.dataTransfer;
+  var files = dt.files;
+
+  handleFiles(files);
+}
+</pre>
+
+<p>Aquí, recuperamos  el campo <code>dataTransfer</code> del evento, a continuación tomamos la lista de archivos fuera de él, que pasa para <code>handleFiles()</code>. Desde este punto, el manejo de los archivos es el mismo si el usuario utiliza el elemento de entrada o arrastrar y soltar. Obteniendo información de los archivos seleccionados.</p>
+
+<p>El objeto  <a href="/en/DOM/FileList" title="en/DOM/FileList"><code>FileList</code></a> proporcionado por el DOM de las listas de todos los archivos seleccionados por el usuario, cada una se especifica como un objeto<a href="/en/DOM/File" title="en/DOM/File"><code> File</code></a>. Tu puedes determinar cuantos archivos el usuario selecciona, al verificar el valor del atributo <code>length</code>:</p>
+
+<pre>var numFiles = files.length;
+</pre>
+
+<p>Individualmente los objetos <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> pueden ser recuperados simplemente accediendo a la lista como una matriz:</p>
+
+<pre class="deki-transform">for (var i = 0; i &lt; files.length; i++) {
+  var file = files[i];
+  ..
+}
+</pre>
+
+<p> Este bucle se repite en todos los archivos de la lista de archivos.</p>
+
+<p>Hay tres atributos proporcionados por el objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> que contienen información útil sobre el archivo.</p>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>El nombre de archivo como cadena de sólo lectura. Esto es sólo el nombre de el archivo y no incluye ninguna información de la ruta.</dd>
+ <dt><code>size</code></dt>
+ <dd>El tamaño del  archivo en bytes como de solo lectura entero de 64 bits.</dd>
+ <dt><code>type</code></dt>
+ <dd>El tipo MIME de el archivo como una cadena de sólo lectura, o "" si el tipo no puede ser determinado.</dd>
+</dl>
+
+<h2 id="Ejemplo_Mostrando_miniaturas_de_las_imágenes_seleccionadas_por_el_usuario">Ejemplo: Mostrando miniaturas de las imágenes seleccionadas por el usuario</h2>
+
+<p>Digamos que estás desarrollando el próximo gran sitio web para compartir fotos,y deseas usar HTML5 para mostrar vistas previas en miniaturas de las imágenes antes de que el usuario realmente suba los archivos. Simplemente basta con establecer el elemento de entrada o de soltar como se indicó anteriormente, y llamar una función, como la función <code>handleFiles()</code> de abajo.</p>
+
+<pre class="deki-transform">function handleFiles(files) {
+  for (var i = 0; i &lt; files.length; i++) {
+    var file = files[i];
+    var imageType = /image.*/;
+
+    if (!file.type.match(imageType)) {
+      continue;
+    }
+
+    var img = document.createElement("img");
+    img.classList.add("obj");
+    img.file = file;
+    preview.appendChild(img);
+
+    var reader = new FileReader();
+    reader.onload = (function(aImg) { return function(e) { aImg.src = e.target.result; }; })(img);
+    reader.readAsDataURL(file);
+  }
+}
+</pre>
+
+<p>Aquí nuestro bucle maneja los archivos seleccionados por el usuario buscando en cada tipo de atributo del archivo para ver si es un archivo imagen (Buscando coincidencias con la cadena de expresión regular "image.*"). Por cada archivo de tipo imagen, creamos un nuevo elemento img. El CSS puede ser usado para crear bordes, sombras y/o especificar el tamaño de la imagen, por lo cual no es necesario hacerlo aquí.</p>
+
+<p>Cada imagen tiene añadida la clase CSS "obj", para que sean fáciles de encontrar en el árbol DOM. También vamos a añadir un archivo atributo a cada imagen especificando el archivo de la imagen, o que nos permitirá buscar las imágenes para en realidad subirlas mas tarde. Por último se utilizamos {{ domxref("Node.appendChild()") }} para agregar la nueva miniatura para el área de previsualización de nuestro documento.</p>
+
+<p>A continuación, se establece  <a href="/en/DOM/FileReader" title="en/DOM/FileReader"><code>FileReader</code></a> para manejar de forma asincrónica la  carga de la  imagen y lo conecta con el elemento img.Después se crea  el  nuevo objeto <code>FileReader</code>, hemos creado la función <code>load</code>, a continuación llamamos <code>readAsDataURL()</code> para empezar la operación de lectura de fondo. cuando todo el contenido del archivo de imagen se carga, se convierten en una  <code>data:</code> URL, cada uno se pasa por  <code>onload</code> callback. Nuestra implementación de esta rutina se limita a establecer el atributo src del elemento img de la imagen cargada, lo que resulta en la imagen que aparece en la miniatura en la pantalla del usuario.</p>
+
+<p>{{ h1_gecko_minversion("Ejemplo: Usar URL objeto para mostrar imágenes", "2.0") }}</p>
+
+<p>En este ejemplo se utiliza el objeto URL para mostrar miniaturas de las imágenes. Además, se muestra la información de otro archivo con su nonbre y tamaño. Tu puedes <a href="/samples/domref/file-click-demo.html" title="https://developer.mozilla.org/samples/domref/file-click-demo.html">ver el ejemplo vivo </a>(nota se requiere  <a class="external" href="http://nightly.mozilla.org/" title="http://nightly.mozilla.org/">versión nocturna (nightly build</a>) de Firefox del 22 de noviembre o posterior, o Firefox 4.0 beta 8).</p>
+
+<div class="note"><strong>Nota:</strong> Esta API existía en versiones beta de Firefox 4, pero cambio el 22 de noviembre, ¡así que asegúrate que estas en una versión actual!</div>
+
+<p>Escuchar<br>
+ traducción del inglés al español<br>
+ El código HTML que presenta la interfaz se parece a esto:</p>
+
+<pre class="deki-transform">&lt;input type="file" id="fileElem" multiple accept="image/*" style="display:none" onchange="handleFiles(this.files)"&gt;
+&lt;a href="#" id="fileSelect"&gt;Select some files&lt;/a&gt;
+&lt;div id="fileList"&gt;
+  &lt;p&gt;¡No se han seleccionado archivos!&lt;/p&gt;
+&lt;/div&gt;
+</pre>
+
+<p>Este establece nuestro archivo {{ HTMLElement("input") }} elemento, así como un enlace que invoca el selector de archivos , ya que mantener la entrada de archivo oculto para para evitar que lo menos atractivo de la interfaz sea mostrado. Esto se explica más arriba en la sección  {{ anch("Using hidden file input elements using the click() method") }}, como es el método <code>doClick()</code> que invoca el selector de archivos.</p>
+
+<p>El método siguiente <code>handleFiles()</code>:</p>
+
+<pre class="deki-transform">var fileSelect = document.getElementById("fileSelect"),
+  fileElem = document.getElementById("fileElem"),
+  fileList = document.getElementById("fileList");
+
+fileSelect.addEventListener("click", function (e) {
+  if (fileElem) {
+    fileElem.click();
+  }
+  e.preventDefault(); // evitar la navegación a "#"
+}, false);
+
+function handleFiles(files) {
+  if (!files.length) {
+    fileList.innerHTML = "&lt;p&gt;¡No se han seleccionado archivos!&lt;/p&gt;";
+  }
+  else {
+    var list = document.createElement("ul");
+    for (var i = 0; i &lt; files.length; i++) {
+      var li = document.createElement("li");
+      list.appendChild(li);
+
+      var img = document.createElement("img");
+      img.src = window.URL.createObjectURL(files[i]);;
+      img.height = 60;
+      img.onload = function () {
+        window.URL.revokeObjectURL(this.src);
+      }
+      li.appendChild(img);
+
+      var info = document.createElement("span");
+      info.innerHTML = files[i].name + ": " + files[i].size + " bytes";
+      li.appendChild(info);
+    }
+    fileList.appendChild(list);
+  }
+}
+</pre>
+
+<p>Esto comienza por ir a buscar el {{ HTMLElement("div") }} con el ID "fileList". Este es el bloque en el que vamos a insertar la lista de archivos, incluyendo vistas en miniaturas.</p>
+
+<p>Si el  objeto {{ domxref("FileList") }} <code>handleFiles()</code> es <code>null</code>, se establece dentro del código HTML interno del bloque para que no aparezca "¡No se han seleccionado archivos!". De lo contrario, empezamos a contruir nuestra lista de archivos, de la siguiente manera:</p>
+
+<p>Una nueva lista desordenada elemento ({{ HTMLElement("ul") }} es creada.</p>
+
+<ol>
+ <li>La nueva lista de elementos se inserta en el bloque  {{ HTMLElement("div") }} llamando a este método {{ domxref("element.appendChild()") }}.</li>
+ <li>Para cada {{ domxref("File") }} en el {{ domxref("FileList") }} representado por <code>files</code>:
+  <ol>
+   <li>Crear un nuevo elemento de la lista ({{ HTMLElement("li") }}) y se inserta en la lista.</li>
+   <li>Crear un nuevo elemento imagen ({{ HTMLElement("img") }}).</li>
+   <li>Ajuste de la imagen de origen a un nuevo objeto URL representando el archivo, usando {{ domxref("window.URL.createObjectURL()") }} para crear la blob URL.</li>
+   <li>Ajuste la altura de la imagen a 60 píxeles.</li>
+   <li>Establecer el manejador de el evento de carga de imagen para liberar el objeto URL, Set up the image's load event handler to release the object URL, puesto que ya no se necesita una vez que la imagen se ha cargado. esto se hace llamando a el método {{ domxref("window.URL.revokeObjectURL()") }} , pasando en el objeto URL la cadena como lo especifica <code>img.src</code>.</li>
+   <li>Anexar el nuevo elemento lista a la lista.</li>
+  </ol>
+ </li>
+</ol>
+
+<h2 id="Ejemplo_Cargando_archivos_seleccionado_por_el_usuario_(user-selected_file)">Ejemplo: Cargando archivos seleccionado por el usuario (user-selected file)</h2>
+
+<p>Otra cosa que tu podrías querer hacer es permitir al usuario cargar  un archivo o archivos seleccionados (por ejemplo, las imagenes seleccionadas con el ejemplo previo) a un servidor. Esto puede hacerse asincrónicamente muy facil.</p>
+
+<h3 id="Creando_las_tareas_de_carga">Creando las tareas de carga</h3>
+
+<p>Continuando con el código que genera las imágenes en miniatura en el ejemplo anterior, recordemos que cada imagen en la clase CSS "obj", con el correspondiente <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> adjunto en el atributo de el archivo. Esto nos permite fácilmente seleccionar todas las imagenes que el usuario ha escogido para ser cargadas con {{ domxref("Document.querySelectorAll()") }}, así:</p>
+
+<pre class="deki-transform">function sendFiles() {
+  var imgs = document.querySelectorAll(".obj");
+
+  for (var i = 0; i &lt; imgs.length; i++) {
+    new FileUpload(imgs[i], imgs[i].file);
+  }
+}
+</pre>
+
+<p>En la linea 2 se crea una matriz, llamada <code>imgs</code>, de todos los elemtos in el documento con la clase CSS "obj". en nuestro caso, estas serán todas las miniaturas de las imágenes.Una vez que obtenemos esa lista, es trivial pasar por la lista, creando una nueva instancia <code>FileUpload</code> para cada uno. Cada uno de estos manejadores de carga el archivo correspondiente.</p>
+
+<h3 id="Manejadores_de_procesos_de_carga_de_un_archivo">Manejadores de procesos de carga de un archivo</h3>
+
+<p>La función <code>FileUpload</code> acepta dos entradas: un elemento imagen y un archivo desde donde se leerán  los datos de la imagen</p>
+
+<pre class="deki-transform">function FileUpload(img, file) {
+  this.ctrl = createThrobber(img);
+  var xhr = new XMLHttpRequest();
+  this.xhr = xhr;
+
+  var self = this;
+  this.xhr.upload.addEventListener("progress", function(e) {
+        if (e.lengthComputable) {
+          var percentage = Math.round((e.loaded * 100) / e.total);
+          self.ctrl.update(percentage);
+        }
+      }, false);
+
+  xhr.upload.addEventListener("load", function(e){
+          self.ctrl.update(100);
+          var canvas = self.ctrl.ctx.canvas;
+          canvas.parentNode.removeChild(canvas);
+      }, false);
+
+  xhr.open("POST", "http://demos.hacks.mozilla.org/paul/demos/resources/webservices/devnull.php");
+  xhr.overrideMimeType('text/plain; charset=x-user-defined-binary');
+  xhr.sendAsBinary(file.getAsBinary());
+}
+</pre>
+
+<p>La función <code>FileUpload()</code> muestra arriba crear un throbber, cada uno es usado para mostrar la información de progreso, a continuación se crea un <a href="/en/XMLHttpRequest" title="en/XMLHttpRequest"><code>XMLHttpRequest</code></a> para manejar la carga de los datos.</p>
+
+<p>Antes de transferir los datos actualmente, varios pasos preparatorios se tienen:</p>
+
+<ol>
+ <li>El <code>XMLHttpRequest</code>'s upload "progress" listener esta configurado para actualizar la información Throbber con nuevo porcentaje, de modo que a medida que avanza la carga, el Throbber sera actualizado basado en la ultima información.</li>
+ <li>El <code>XMLHttpRequest</code>'s upload "load" manejador de evento esta configurado para actualizar como un 100% como la información de progreso (para garantizar que el indicador de progreso realmente alcanza el 100%, en caso de peculiaridades y granulidades durante el proceso). A continuación se elimina el thobber, puesto que este no es necesario. Esto hace que el Thobber desaparezca una vez que la carga esta completa.</li>
+ <li>La solicitud de carga de imagen se abre llamando el método <code>XMLHttpRequest</code>'s <code>open()</code> para empezar a generar la POST solicitud.</li>
+ <li>El tipo MIME para la carga esta configurada para llamar la función<code> XMLHttpRequest</code> function <code>overrideMimeType()</code>. En este caso, estamos usando un tipo MIME  genérico; puede o no ser necesario para configurar el tipo MIME para todo, dependiendo de su caso de uso.</li>
+ <li>Finalmente la función <code>XMLHttpRequest</code> <code>sendAsBinary()</code> es llamada para cargar el contenido de el archivo. <em>Esto necesita ser revisado; en la actualidad esta obsoleto la rutina para extraer datos desde archivos getAsBinary() síncrona.</em></li>
+</ol>
+
+<h3 id="Manejando_el_proceso_de_carga_para_un_archivo_asíncronicamente">Manejando el proceso de carga para un archivo, asíncronicamente</h3>
+
+<pre class="deki-transform">function fileUpload(file) {
+  // Please report improvements to: marco.buratto at tiscali.it
+
+  var fileName = file.name,
+    fileSize = file.size,
+    fileData = file.getAsBinary(), // works on TEXT data ONLY.
+    boundary = "xxxxxxxxx",
+    uri = "serverLogic.php",
+    xhr = new XMLHttpRequest();
+
+  xhr.open("POST", uri, true);
+  xhr.setRequestHeader("Content-Type", "multipart/form-data, boundary="+boundary); // simulate a file MIME POST request.
+  xhr.setRequestHeader("Content-Length", fileSize);
+
+  xhr.onreadystatechange = function() {
+    if (xhr.readyState == 4) {
+      if ((xhr.status &gt;= 200 &amp;&amp; xhr.status &lt;= 200) || xhr.status == 304) {
+
+        if (xhr.responseText != "") {
+          alert(xhr.responseText); // display response.
+        }
+      }
+    }
+  }
+
+  var body = "--" + boundary + "\r\n";
+  body += "Content-Disposition: form-data; name='fileId'; filename='" + fileName + "'\r\n";
+  body += "Content-Type: application/octet-stream\r\n\r\n";
+  body += fileData + "\r\n";
+  body += "--" + boundary + "--";
+
+  xhr.send(body);
+  return true;
+}
+</pre>
+
+<p><em>Esto también necesita ser modificado para trabajar con datos binarios.</em></p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><code><a href="/en/DOM/File" title="en/DOM/File">File</a></code></li>
+ <li><code><a href="/en/DOM/FileList" title="en/DOM/FileList">FileList</a></code></li>
+ <li><a href="/en/DOM/FileReader" title="en/DOM/FileReader"><code>FileReader</code></a></li>
+ <li><a href="/En/XMLHttpRequest/Using_XMLHttpRequest" title="En/Using XMLHttpRequest">Using XMLHttpRequest</a></li>
+ <li><a href="/en/XMLHttpRequest" title="en/XMLHttpRequest"><code>XMLHttpRequest</code></a></li>
+</ul>
diff --git a/files/es/orphaned/usar_código_de_mozilla_en_otros_proyectos/index.html b/files/es/orphaned/usar_código_de_mozilla_en_otros_proyectos/index.html
new file mode 100644
index 0000000000..f5ac459e31
--- /dev/null
+++ b/files/es/orphaned/usar_código_de_mozilla_en_otros_proyectos/index.html
@@ -0,0 +1,16 @@
+---
+title: Usando código de Mozilla en otros proyectos
+slug: orphaned/Usar_código_de_Mozilla_en_otros_proyectos
+tags:
+  - para_revisar
+  - páginas_a_traducir
+original_slug: Usar_código_de_Mozilla_en_otros_proyectos
+---
+<p>Hay varias maneras en las que puede usar código de Mozilla en su propio proyecto.</p>
+<ul> <li>Mozilla proporciona un plataforma de desarrollo para aplicaciones de escritorio, llama <a class="internal" href="/en/XUL" title="En/XUL">XUL</a>, sobre la cual usted puede construir aplicaciones.</li> <li>Varios componentes de la plataforma, tales como el motor de JavaScript <a class="internal" href="/en/SpiderMonkey" title="En/SpiderMonkey">SpiderMonkey</a>, pueden ser utilizados en su propio proyecto.</li> <li>Varios componentes de la plataforma, tales como el motor de JavaScript <a class="internal" href="/en/SpiderMonkey" title="En/SpiderMonkey">SpiderMonkey</a>, pueden ser utilizados en su propio proyecto sin el resto de la plataforma.</li> <li>También hay módulos que no son utilizados en Firefox pero están disponibles para el uso de otras aplicaciones; un ejemplo de esto es <a class="internal" href="/en/Rhino" title="En/Rhino">Rhino</a>, el motor JavaScript escrito en Java.</li> <li>Usted puede embeber <a class="internal" href="/en/Gecko" title="En/Gecko">Gecko</a>, el motor de renderizado utilizado por Firefox para procesar paginas web, como un navegador dentro de su propia aplicación.</li>
+</ul>
+<table class="mainpage-table"> <tbody> <tr> <td> <h2 id="Construyendo_aplicaciones_XUL">Construyendo aplicaciones XUL</h2> <dl> <dt><a class="internal" href="/en/The_Joy_of_XUL" title="En/The Joy of XUL">La alegria XUL</a></dt> <dd>La introducción a XUL; una lectura necesaria para los nuevos desarrolladores.</dd> <dt><a class="internal" href="/en/XUL_Reference" title="En/XUL Reference">XUL Referencia</a></dt> <dd>La referencia completa a XUL.</dd> <dt><a class="internal" href="../../../../en/XULRunner" rel="internal">XULRunner</a></dt> <dd>Un paquete runtime que puede ser utilizado para arrancar aplicaciones XUL y XPCOM con facilidad.</dd> <dt><a class="internal" href="../../../../en/Toolkit_API" rel="internal">Mozilla Toolkit</a></dt> <dd>Información acerca de la API Mozilla Toolkit.</dd> </dl> </td> <td> <h2 id="Usando_componentes_Mozilla">Usando componentes Mozilla</h2> <dl> <dt><a class="internal" href="/en/SpiderMonkey" title="en/SpiderMonkey">SpiderMonkey</a></dt> <dd>SpiderMonkey es el motor JavaScript runtime utilizado por proyectos de Mozilla.</dd> <dt><a class="internal" href="/en/NSPR" title="En/NSPR">NSPR</a></dt> <dd>El Netscape Portable Runtime proporciona una API de plataforma-neutal para nivel de sistema y funciones libc-type.</dd> <dt><a class="internal" href="/en/Necko" title="En/Necko">Necko</a></dt> <dd>La librería de red Mozilla proporciona la funcionalidad multi-plataforma de redes.</dd> </dl> </td> </tr> </tbody>
+</table>
+<h2 id="Embeber_Mozilla">Embeber Mozilla</h2>
+<p>Para información sobre embeber un buscador web en su propio proyecto vea <a class="internal" href="/en/Embedding_Mozilla" title="En/Embedding Mozilla">Embeber Mozilla</a>.</p>
+<p>{{ languages( { "ja": "ja/Using_Mozilla_code_in_other_projects", "zh-cn": "cn/Using_Mozilla_code_in_other_projects"} ) }}</p>
diff --git a/files/es/orphaned/usar_web_workers/index.html b/files/es/orphaned/usar_web_workers/index.html
new file mode 100644
index 0000000000..5d3b471e08
--- /dev/null
+++ b/files/es/orphaned/usar_web_workers/index.html
@@ -0,0 +1,261 @@
+---
+title: Usar web workers
+slug: orphaned/Usar_web_workers
+tags:
+  - Firefox 3.5
+  - Gecko 1.9.1
+  - HTML5
+  - JavaScript
+  - Workers
+  - para_revisar
+original_slug: Usar_web_workers
+---
+<p>{{ gecko_minversion_header ("1.9.2") }}</p>
+<p>Workers constituye un medio sencillo para que el contenido web ejecute secuencias de comandos en subprocesos en segundo plano. Una vez creado, un worker puede enviar mensajes a la tarea de generación mediante la publicación de mensajes en un controlador de eventos especificado por el creador.</p>
+<p>El subproceso del worker puede realizar tareas sin interferir con la interfaz de usuario.  Además, pueden realizar E / S utilizando <code><a class="internal" href="/en/XMLHttpRequest" title="En/XMLHttpRequest">XMLHttpRequest</a></code> (aunque los atributos <code>responseXML</code> y <code>channel</code> siempre son nulos).</p>
+<div class="note">
+  <strong>Nota:</strong> como de costumbre, los subprocesos en segundo plano, incluyendo los workers, no pueden manipular el DOM.  Si las acciones adoptadas por el subproceso en segundo plano tienen que dar lugar a cambios en el DOM, deben enviar mensajes a sus creadores para hacer ese trabajo.</div>
+<p>Consulta el documento de referencia <a class="internal" href="/En/DOM/Worker" title="En/DOM/Worker">Worker</a> , al que este artículo complementa ofreciendo ejemplos y añadiendo detalles. Para obtener una lista de funciones disponibles para workers, consulta <a href="/En/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Funciones disponibles para workers</a> .</p>
+<h2 id="Acerca_de_la_seguridad_en_los_subprocesos">Acerca de la seguridad en los subprocesos</h2>
+<p>La interfaz <code>Worker</code> genera subprocesos a nivel del sistema operativo y la simultaneidad puede producir efectos interesantes en el código si no tienes cuidado. Sin embargo, en el caso de web workers, los puntos de comunicación controlados cuidadosamente con otros subprocesos supone que en realidad sea muy difícil causar problemas de simultaneidad.  No hay acceso a componentes sin subprocesos seguros o al DOM y tienes que pasar datos específicos dentro y fuera de un subproceso a través de objetos serializados.  Así que te tienes que esforzar mucho para causar problemas en el código.</p>
+<h2 id="Generar_un_worker">Generar un worker</h2>
+<p>Crear un nuevo worker es simple.  Lo único que tienes que hacer es llamar al constructor <code>Worker()</code>, especificando el URI de un script para ejecutar en el subproceso del worker y, si deseas poder recibir las notificaciones del worker, establece la propiedad <code>onmessage</code> del worker a una función de manejador de evento adecuada.</p>
+<pre class="brush: js">var myWorker = new Worker('my_worker.js');
+myWorker.onmessage = function(event) {
+  print("Llamado de nuevo por el worker\n");
+};</pre>
+<p>De forma alternativa, podemos usar <code>addEventListener()</code>:</p>
+<pre class="brush: js">var worker = new Worker('my_worker.js');
+worker.addEventListener('message', function(event) {
+ console.log("Called back by the worker!\n");
+}, false);
+
+worker.postMessage(""); // Iniciar el worker.
+</pre>
+<p>La línea 1 de este ejemplo crea e inicia el subproceso del worker. La línea 2 establece el controlador <code>onmessage</code> para el worker a una función que se llama cuando éste pide su propia función <code>postMessage()</code>.</p>
+<div class="note">
+  <strong>Nota</strong>: La URI pasada como parámetro del constructor del <code>Worker</code> debe obedecer la política del <a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">mismo origen o same-origin policy</a>. Actualmente hay un desacuerdo en los diferentes desarrolladores de navegadores acerca de si las URIs han de ser del mismo origen o no; Gecko 10.0 {{ geckoRelease("10.0") }} y posteriores permiten cualquier URI como script válido para workers, otros navegadores pueden no permitirlo.</div>
+<h2 id="Generar_subworkers">Generar subworkers</h2>
+<p>Los workers pueden generar más workers si así lo desean.  Los llamados subworkers deben estar alojados en el mismo origen que la página principal.  Además, los URI para los subworkers se resuelven en relación a la ubicación del worker principal y no en relación a la de la página propietaria.  Esto hace que sea más fácil que los workers realicen un seguimiento de dónde están sus dependencias.</p>
+<h2 id="Tiempos_de_espera_e_intervalos">Tiempos de espera e intervalos</h2>
+<p>Los workers pueden utilizar los tiempos de espera y los intervalos al igual que el proceso principal.  Esto puede ser útil, por ejemplo, si quieres hacer que tu subproceso del worker ejecute código de manera periódica en lugar de ininterrumpidamente.</p>
+<p>Consulta <a class="internal" href="/en/DOM/window.setTimeout" title="En/DOM/Window.setTimeout"><code>setTimeout()</code></a>, <a class="internal" href="/en/DOM/window.clearTimeout" title="En/DOM/Window.clearTimeout"><code>clearTimeout()</code></a>, <a class="internal" href="/en/DOM/window.setInterval" title="En/DOM/Window.setInterval"><code>setInterval()</code></a> y <a class="internal" href="/en/DOM/window.clearInterval" title="En/DOM/Window.clearInterval"><code>clearInterval()</code></a> si deseas tener más detalles.</p>
+<h2 id="Terminar_un_worker">Terminar un worker</h2>
+<p>Si tienes que cancelar inmediatamente un worker que se está ejecutando, puedes hacerlo llamando al método <code>terminate()</code> del worker:</p>
+<pre class="brush: js">myWorker.terminate();
+</pre>
+<p>El subproceso del worker se interrumpe inmediatamente y sin tener la posibilidad de terminar sus operaciones o limpiar por sí mismo.</p>
+<p>Los workers pueden cerrarse llamando a su propio método {{ ifmethod("nsIWorkerScope", "close") }}.</p>
+<h2 id="Gestión_de_errores">Gestión de errores</h2>
+<p>Cuando se produce un error de ejecución en el worker, es llamado su controlador de enventos <code>onerror</code>.  Recibe un evento denominado <code>error</code> que implementa la interfaz <code>ErrorEvent</code>.  El evento no se lanza y se puede cancelar, para evitar que la acción predeterminada tenga lugar, el worker puede llamar al método <a class="internal" href="../../../../en/DOM/event.preventDefault" rel="internal"><code>preventDefault()</code></a> del evento de error.</p>
+<p>El evento de error tiene los siguientes tres campos que son de interés:</p>
+<dl>
+  <dt>
+    <code>message</code></dt>
+  <dd>
+    Un mensaje de error legible para el ojo humano.</dd>
+  <dt>
+    <code>filename</code></dt>
+  <dd>
+    El nombre del archivo de script en el que se produjo el error.</dd>
+  <dt>
+    <code>lineno</code></dt>
+  <dd>
+    El número de línea del archivo de script en el que se produjo el error.</dd>
+</dl>
+<h2 id="Acceder_al_objeto_navegador">Acceder al objeto navegador</h2>
+<p>Los workers pueden acceder al objeto <code>navigator</code>, que está disponible dentro de su ámbito.  Contiene las siguientes cadenas de texto que pueden usarse para identificar el navegador, tal y como se puede hacer a partir de secuencias de comandos normales:</p>
+<ul>
+  <li><code>appName</code></li>
+  <li><code>appVersion</code></li>
+  <li><code>platform</code></li>
+  <li><code>userAgent</code></li>
+</ul>
+<h2 id="Importar_de_secuencias_de_comandos_y_bibliotecas">Importar de secuencias de comandos y bibliotecas</h2>
+<p>Los subprocesos de trabajo tienen acceso a una función global, importScripts (), que les permite importar secuencias de comandos de comandos o bibliotecas dentro de su ámbito.  Acepta como parámetros cero o más URI de recursos para la importación, todos los ejemplos siguientes son válidos:</p>
+<pre class="brush: js">importScripts();                        /* no importa nada */
+importScripts('foo.js');                /* importa solo "foo.js" */
+importScripts('foo.js', 'bar.js');      /* importa dos scripts */
+</pre>
+<p>Firefox carga cada secuencia de comandos de la lista, luego los ejecuta para permitirles que se inicialicen ellos mismos.  Los objetos globales de cada secuencia de comandos pueden entonces ser utilizados por el worker.</p>
+<div class="note">
+  <strong>Nota:</strong> los scripts pueden ser descargados en cualquier orden, pero no se ejecutarán en el orden en que pasas los nombres de archivo a <code>importScripts()</code> .  Esto se realiza de forma sincrónica; <code>importScripts()</code> no retorna hasta que todas las secuencias de comandos se han cargado y ejecutado.</div>
+<p> </p>
+<h2 id="Ejemplos">Ejemplos</h2>
+<p>Esta sección incluye varios ejemplos de cómo utilizar los DOM workers.</p>
+<h3 id="Realizar_cálculos_en_segundo_plano">Realizar cálculos en segundo plano</h3>
+<p>Una utilidad de los workers es permitir que tu código realice cálculos intensivos en el procesador sin bloquear el subproceso de interfaz de usuario.  En este ejemplo, un worker se utiliza para calcular los números de Fibonacci.</p>
+<h4 id="El_código_JavaScript">El código JavaScript</h4>
+<pre class="brush: js">var results = [];
+
+function resultReceiver(event) {
+  results.push(parseInt(event.data));
+  if (results.length == 2) {
+    postMessage(results[0] + results[1]);
+  }
+}
+
+function errorReceiver(event) {
+  throw event.data;
+}
+
+onmessage = function(event) {
+  var n = parseInt(event.data);
+
+  if (n == 0 || n == 1) {
+    postMessage(n);
+    return;
+  }
+
+  for (var i = 1; i &lt;= 2; i++) {
+    var worker = new Worker("fibonacci.js");
+    worker.onmessage = resultReceiver;
+    worker.onerror = errorReceiver;
+    worker.postMessage(n - i);
+  }
+ };</pre>
+<p>La función <code>onmessage</code> es llamada cuando el código HTML llamada al <code>postMessage()</code> en el worker.  Esto inicia la recursividad, generando copias nuevas de sí mismo para controlar cada iteración del cálculo.</p>
+<h4 id="El_código_HTML">El código HTML</h4>
+<pre class="brush: html">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt;
+&lt;html&gt;
+  &lt;title&gt;Test threads fibonacci&lt;/title&gt;
+  &lt;body&gt;
+
+  &lt;div id="result"&gt;&lt;/div&gt;
+
+  &lt;script language="javascript"&gt;
+
+    var worker = new Worker("fibonacci.js");
+
+    worker.onmessage = function(event) {
+      document.getElementById("result").textContent = event.data;
+      dump("Got: " + event.data + "\n");
+    };
+
+    worker.onerror = function(error) {
+      dump("Worker error: " + error.message + "\n");
+      throw error;
+    };
+
+    worker.postMessage("5");
+
+  &lt;/script&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+<p>La página web crea un elemento <code>div</code> con el id. de cliente <code>result</code> , que se utiliza para mostrar el resultado, a continuación, genera el worker.  Tras generar el worker, el manejador<code>onmessage</code> está configurado para mostrar los resultados mediante el ajuste de los contenidos del elemento <code>div</code>, y el manejador <code>onerror</code> se establece para <a href="/en/Debugging_JavaScript#dump()" title="en/Debugging JavaScript#dump()">volcar</a> el mensaje de error.</p>
+<p>Por último, se envía un mensaje al worker para iniciarlo.</p>
+<p><a href="/samples/workers/fibonacci" title="samples/workers/fibonacci">Prueba este ejemplo</a> .</p>
+<h3 id="Realizar_E_S_de_web_en_segundo_plano">Realizar E / S de web en segundo plano</h3>
+<p>Puedes encontrar un ejemplo de esto en el artículo <a class="internal" href="/En/Using_workers_in_extensions" title="En/Using workers in extensions">Usar  workers en las extensiones</a> .</p>
+<h3 id="Dividir_tareas_entre_varios_workers">Dividir tareas entre varios workers</h3>
+<p>A medida que los equipos con varios núcleos se hacen cada vez más frecuentes, resulta útil dividir las tareas  complejas, desde el punto de vista computacional, entre varios workers, que a su vez pueden llevar a cabo esas tareas en núcleos de procesador múltiple.</p>
+<p>el ejemplo se incluirá muy pronto</p>
+<h3 id="Crear_workers_desde_dentro_de_los_workers">Crear workers desde dentro de los workers</h3>
+<p>El ejemplo de Fibonacci mostrado anteriormente demuestra que los workers pueden, de hecho, generar más workers.  Esto facilita crear rutinas repetitivas.</p>
+<h3 id="Enviar_objetos_a_los_workers">Enviar objetos a los workers</h3>
+<p>Puede pasar con seguridad los objetos dentro y fuera de los workers que utilizan el método <code>postMessage()</code>, los objetos se convierten automáticamente en <a class="internal" href="/en/JSON" title="En/JSON">JSON</a> de manera interna.</p>
+<pre class="brush: js">var onmessage = function(e) {
+  postMessage(e.data);
+};</pre>
+<div class="note">
+  <strong>Nota: los</strong> objetos que se introducen o se extraer de los workers no deben contener funciones o referencias cíclicas, ya que JSON no es compatible con ellas.</div>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Característica</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera</th>
+        <th>Safari (WebKit)</th>
+      </tr>
+      <tr>
+        <td>Workers dedicados</td>
+        <td>3</td>
+        <td>3.5 (1.9.1)</td>
+        <td>10</td>
+        <td>10.60</td>
+        <td>4</td>
+      </tr>
+      <tr>
+        <td>Workers compartidos</td>
+        <td>5</td>
+        <td>---</td>
+        <td>---</td>
+        <td>10.60</td>
+        <td>5</td>
+      </tr>
+      <tr>
+        <td>Pasar datos usando <a href="/en/DOM/The_structured_clone_algorithm" title="El algoritmo de clonación estructurada">clonación estructurada</a>. </td>
+        <td>13</td>
+        <td>8</td>
+        <td>10</td>
+        <td>11.50</td>
+        <td>5.1</td>
+      </tr>
+      <tr>
+        <td>Pasar datos usando <a class="external" href="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects" title="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects">objetos transferibles</a></td>
+        <td>17 {{ property_prefix("webkit") }}</td>
+        <td>---</td>
+        <td>---</td>
+        <td>---</td>
+        <td>---</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Característica</th>
+        <th>Android</th>
+        <th>Chrome for Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Phone</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>Workers dedicados</td>
+        <td>---</td>
+        <td>0.16</td>
+        <td>---</td>
+        <td>---</td>
+        <td>11</td>
+        <td>5</td>
+      </tr>
+      <tr>
+        <td>Workers compartidos</td>
+        <td>---</td>
+        <td>{{ CompatNo() }}</td>
+        <td>---</td>
+        <td>---</td>
+        <td>---</td>
+        <td>---</td>
+      </tr>
+      <tr>
+        <td>Pasar datos usando <a href="/en/DOM/The_structured_clone_algorithm" title="El algoritmo de clonación estructurada">clonación estructurada</a>. </td>
+        <td>---</td>
+        <td>0.16</td>
+        <td>---</td>
+        <td>---</td>
+        <td>---</td>
+        <td>---</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<h2 id="Consulta_también">Consulta también</h2>
+<ul>
+  <li>{{ spec("http://dev.w3.org/html5/workers/", "Especificación API de ficheros: Web Workers", "ED") }}</li>
+  <li><a class="internal" href="/En/DOM/Worker" title="En/DOM/Worker">Worker</a> interface</li>
+  <li><a class="internal" href="/En/DOM/SharedWorker" title="En/DOM/SharedWorker">SharedWorker</a> interface</li>
+  <li><a href="/En/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Funciones disponibles para workers</a></li>
+  <li><a class="external" href="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers" title="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers">HTML5Rocks - Lo básico sobre Web Workers</a></li>
+</ul>
+<p>{{ HTML5ArticleTOC() }}</p>
+<p>{{ languages ( {"en": "En/Using_web_workers"} ) }}</p>
diff --git a/files/es/orphaned/usar_xpinstall_para_instalar_plugins/index.html b/files/es/orphaned/usar_xpinstall_para_instalar_plugins/index.html
new file mode 100644
index 0000000000..13e2dd9678
--- /dev/null
+++ b/files/es/orphaned/usar_xpinstall_para_instalar_plugins/index.html
@@ -0,0 +1,237 @@
+---
+title: Usar XPInstall para instalar plugins
+slug: orphaned/Usar_XPInstall_para_instalar_plugins
+tags:
+  - Plugins
+  - Todas_las_Categorías
+  - XPInstall
+original_slug: Usar_XPInstall_para_instalar_plugins
+---
+<p>
+</p><p><a href="es/XPInstall">XPInstall</a> es una tecnología de instalación basada en JavaScript que funciona en todas las plataformas en las que pueden instalarse los navegadores de <a class="external" href="http://mozilla.org">Mozilla</a> y los de Netscape basados en Mozilla. Puede ser un modo para asegurarle al usuario una plácida experiencia a la hora de obtener plugins, sin obligarlo a abandonar el entorno de navegación para ejecutar un instalador binario (el típico setup.exe en Windows) ni forzarlo a reiniciar su navegador. Los fabricantes de plugins que ya hayan escrito un instalador en código nativo (p.e., EXE) pueden incluir dicho instalador y ejecutarlo para que el usuario no tenga que abandonar el entorno del navegador y hacer clic en el EXE para ejecutarlo. Este artículo muestra una guía de estilo para mejorar la experiencia en la instalación de un plugin para los navegadores de Netscape Gecko utilizando <a href="es/XPInstall_API_Reference">XPInstall</a>.
+</p>
+<h3 id="Definici.C3.B3n_de_t.C3.A9rminos"> Definición de términos </h3>
+<p>XPInstall es una tecnología de instalación. El propio nombre significa "Cross Platform Install" (instalador multiplataforma) y de ahí lo de "XP" (abreviatura en inglés de "multiplataforma"). Un paquete XPInstall es generalmente llamado un paquete XPI para abreviar (y pronunciado generalmente "zippy" en inglés). Este artículo explica cómo se puede usar XPInstall para instalar plugin en los navegadores que soporten XPInstall.
+</p><p>Un paquete XPI es de hecho un fichero ZIP con la extensión XPI (p.e., myPluginInstaller.xip) y puede ser creado en Windows con utilidades tipo WinZip. Los paquetes XPI, como los ficheros ZIP, <i>contienen</i> otros ficheros, normalmente:
+</p>
+<ul><li> El componente software que va a ser instalado. En nuestro caso es el software del plugin.
+</li><li> Un fichero JavaScript llamado install.js, el cual contiene la lógica que conduce la instalación. Esto incluye instrucciones que indican dónde se va a instalar el software y mensajes para informar al usuario.
+</li></ul>
+<p>Un fichero XPInstall se puede crear empaquetando primero los elementos que se quieran instalar con WinZip (es decir, crear un fichero ZIP) y renombrarlo con la extensión XPI en lugar de ZIP.
+</p><p>A diferencia de los instaladores compilados para código nativo (p.e., los típicos ficheros setup.exe), el lenguaje de programación para las operaciones de instalación en XPI es JavaScript. Como el formato de fichero que contiene al software y al fichero JavaScript install.js es multiplataforma (Zip) y ya que los navegadores de Mozilla para todas las plataformas reconocen JavaScript, generalmente un único paquete XPI sirve para todas las plataformas. Así es, de hecho, <a class="external" href="http://www.mozilla.org/docs/xul/xulnotes/xulnote_packages.html">cómo las pieles y los temas son instalados en los navegadores de Mozilla</a>, cambiando su aspecto y apariencia. Este artículo se centra en cómo instalar plugins.
+</p>
+<h3 id=".C2.BFQu.C3.A9_navegadores_soportan_XPInstall.3F"> ¿Qué navegadores soportan XPInstall? </h3>
+<p>Actualmente, todos los <a class="external" href="http://mozilla.org/releases/stable.html">navegadores de Mozilla liberados por mozilla.org</a> y la familia de navegadores basados en el código de Mozilla soportan XPInstall. Concretamente, están incluidos:
+</p>
+<ul><li> Los navegadores recientes de Netscape tales como Netscape 6.2.x y Netscape 7.0, ambos basados en Netscape Gecko que es el núcleo del navegador Mozilla.
+</li></ul>
+<ul><li> Las versiones recientes <b>sólo beta</b> del software de AOL basado en Netscape Gecko, el motor de renderizado del proyecto Mozilla.
+</li></ul>
+<p><b>Advertencias:</b>
+</p>
+<ul><li> El <a class="external" href="http://www.compuserve.com/">navegador CompuServe</a> de AOL Time Warner, basado también en Netscape Gecko, no soporta XPInstall.
+</li></ul>
+<ul><li> Netscape Communicator 4.x no soporta XPInstall.
+</li></ul>
+<h3 id=".C2.BFEn_qu.C3.A9_consiste_un_plugin.3F"> ¿En qué consiste un plugin? </h3>
+<p>Los plugins pueden estar compuestos de los siguientes tipos de fichero, pudiendo ser todos ellos instalados desde un paquete XPI:
+</p>
+<ul><li> <b>Bibliotecas compartidas</b> (p.e., en Windows, son DLLs, en Unix son los ficheros *.so). Dichos ficheros están compilados en código nativo con la <a href="es/Gecko_Plugin_API_Reference">API para plugins de Netscape</a>.
+</li></ul>
+<ul><li> Si el plugin es scriptable, entonces también consistirá en un <a href="es/Gecko_Plugin_API_Reference/Plug-in_Development_Overview">fichero XPT</a>. Un ejemplo podría ser Flash 6r47 en Windows, el cual está compuesto por una DLL (llamada npswf32.dll) y un fichero XPT para la programación (llamado flashplayer.xpt). Si estás desarrollando un plugin y quieres <a href="es/Gecko_Plugin_API_Reference/Plug-in_Development_Overview">hacerlo scriptable</a>, mírate las partes importantes de la <a href="es/Gecko_Plugin_API_Reference">API para plugins</a>.
+</li></ul>
+<ul><li> <b>Software adicional</b>. Muchos plugins son parte de software adicional para tipos multimedia. Por ejemplo, RealPlayer para Windows consta de un plugin DLL pero también de la aplicación RealPlayer (EXE), de la que el plugin DLL es subconjunto. En este caso, el plugin es parte del paquete de software específico del navegador como mecanismo para darle a la aplicación <i>ganchos</i> adicionales en el navegador.
+</li></ul>
+<p>XPInstall puede ser utilizado para instalar cualquier combinación de estos ficheros en el ordenador del usuario final. Para aquellos que les suene la tecnología SmartUpdate de Netscape Communicator 4.x, esto les resultará familiar.
+</p>
+<h3 id="Breve_historia_de_las_tecnolog.C3.ADas_de_instalaci.C3.B3n_de_Netscape"> Breve historia de las tecnologías de instalación de Netscape </h3>
+<p>Esta sección es importante si estás familiarizado con la tecnología de instalación SmartUpdate de Netscape Communicator 4.x. El uso de JavaScript como lógica de instalación no tiene precedentes en los navegadores de Netscape. Netscape Communicator 4.x utilizaba la noción de SmartUpdate para instalar el software, concretamente los plugins y los applets de Java para que fuesen ejecutados localmente. SmartUpdate <i><b>no está soportado</b></i> por los navegadores de Mozilla (ni los navegadores de Netscape/AOL basados en Mozilla tales como Netscape 7) pero debido a la similitud entre ambas tecnologías de instalación, es fácil convertir los ficheros SmartUpdate a ficheros XPInstall. SmartUpdate utiliza un fichero JAR firmado digitalmente que contiene los componentes de software a instalar además del fichero JavaScript install.js (el llamado script de instalación) como lógica del instalador. Las descargas y los instaladores deberían empezar mostrando un cuadro de diálogo de seguridad que aclarase la autoridad certificadora y el firmante. Frecuentemente, la descarga SmartUpdate era disparada a través del atributo <code>pluginurl</code> de la etiqueta <code>&lt;embed&gt;</code>.
+</p>
+<pre>&lt;embed type="application/x-randomtype" src="myfile.typ" width="50" height="50"
+pluginurl="http://mytypecompany.xyz/jarpacks/mytypeplugin.jar"&gt;&lt;/embed&gt;
+</pre>
+<p>En el ejemplo anterior, el atributo <code>pluginurl</code> referencia a un fichero firmado JAR, el cual sería descargado por Netscape Communicator 4.x (dependiendo de la elección en el cuadro de diálogo de seguridad) <b>si</b> el plugin no estuviera instalado en la máquina del usuario. SmartUpdate difiere de XPInstall en esto:
+</p>
+<ul><li> XPInstall utiliza ficheros ZIP renombrados a XPI (*.xpi) y SmartUpdate utiliza ficheros JAR (*.jar)
+</li><li> A diferencia de los ficheros JAR de SmartUpdate, los paquetes XPI no tienen que estar firmados digitalmente con un certificado digital.
+</li><li> Los paquetes XPI hacen uso de <a href="es/XPInstall_API_Reference">diferentes APIs</a> dentro de install.js, aunque el concepto es el mismo.
+</li></ul>
+<p>XPInstall para los navegadores basados en Mozilla es análogo a SmartUpdate en el navegador Netscape Communicator 4.x. Portar SmartUpdate a XPInstall es trivial tras haberse familiarizado con la <a href="es/XPInstall_API_Reference">nueva API de XPInstall</a>.
+</p>
+<h3 id="Proceso_de_instalaci.C3.B3n_recomendado"> Proceso de instalación recomendado </h3>
+<p>XPInstall suministra una API unificada para llevar a cabo una rápida instalación y configuración del software del plugin para los usuarios finales. Los beneficios de usar XPInstall son porporcionar un mecanismo de instalación para descargas en flujo. Esta sección explica lo que tendría que hacer un paquete XPInstall ideal, además de descubrir algunas de las llamadas API de JavaScript que llevan a cabo estas tareas. Un paquete XPI ideal debería:
+</p>
+<ol><li> Instalarse en el navegador actual que ha llamado a la instalación XPInstall vía HTML o que la ha ejecutado a través de un script. Usaremos el término "navegador actual" para referirnos al navegador que inicia la descarga del XPInstall visitando un sitio que requiere un plugin que el navegador actual no encuentra localmente. Este paso implica el uso de la llamada a la API <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> para inicializarlo todo y además la llamada <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a> que ayuda a encontrar el directorio de plugins del navegador actual.
+</li><li> Instalar el software del plugin en otra ubicación del disco duro del usuario para que otros navegadores basados en Mozilla que el usuario pudiese instalar más tarde encontrasen y pudieran utilizar el plugin (los componentes específicos del navegador). La meta es asegurar que futuros navegadores Netscape Gecko que pudieran ser instalados más adelante puedan beneficiarse de la instalación iniciada por el usuario con el navegador actual. Un ejemplo lo tenemos si el navegador actual fuese Netscape 7 y más adelante el usuario descargase una beta del software de AOL que usase Netscape Gecko. En lugar de descargar de nuevo el plugin con el otro navegador, éste podría detectar que ya se llevó a cabo la instalación. Este mecanismo de descubrimiento necesita que la creación de la localización secundaria quede reflejada en algún repositorio común de metadatos. En Windows es el registro del sistema. De nuevo, este paso implica llamadas a <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a> para localizar un directorio "bien conocido" y usarlo como localización secundaria.
+</li><li> En Windows: escribir claves de registro que pudiesen ser analizadas por los navegadores Netscape Gecko (instalados tras el navegador actual) para detectar dónde está instalado el plugin en el ordenador. En particular, las claves de registro deberían referenciar a la localización de instalación secundaria para que los futuros navegadores Netscape Gecko pudiesen encontrar y añadir su lista de ubicaciones de plugins disponibles. El formato exacto de dichas claves y cómo deberían ser escritas es tratado en la sección <a href="#Problemas_con_la_primera_instalaci.C3.B3n">#Problemas con la primera instalación</a>. Para crear y escribir realmente claves en el registro de sistema de Windows se debe usar las funciones del <a href="es/XPInstall_API_Reference/WinReg_Object">objeto WinReg</a>.
+</li><li> Asegurar que el plugin recién instalado es actualizado correctamente llamando a la <a href="es/XPInstall_API_Reference/Install_Object/Methods/refreshPlugins">API refreshPlugins</a>. Actualizando el plugin, te estarás asegurando de que el plugin está disponible para uso inmediato, sin obligar al usuario a reiniciar su navegador. Esta es una de las ventajas clave de una experiencia con XPInstall depurada.
+</li></ol>
+<h3 id="El_problema_de_la_primera_instalaci.C3.B3n"> El problema de la primera instalación </h3>
+<p>El problema de la primera instalación hace referencia a los problemas que surgen cuando un plugin es instalado en el ordenador de un usuario antes de instalar un navegador. El proceso de instalación recomendado intenta resolver este problema instalando el plugin en una ubicación secundaria tras instalar el navegador actual. En pocas palabras, el problema de la primera instalación podría resumirse con la pregunta: ¿cómo puede un navegador instalado en el ordenador de un usuario después de que un plugin haya sido instalado previamente con el beneplácito del usuario desde una instalación existente en lugar de haber descargado el mismo plugin de nuevo? Para resolver este incoveniente, se aconseja a los vendedores a:
+</p>
+<ul><li> Instalar los componentes del software del plugin para el navegador (p.e., DLLs en Windows y ficheros XPT si procede) a una ubicación secundaria además de en el directorio de plugins del navegador actual.
+</li><li> Escribir claves en el registro de Windows para que guarden la información de esta ubicación secundaria, en particular la ruta de los plugins y la de los XPT (si procede) para que los navegadores de Netscape Gecko puedan buscar el plugin desde la ubicación secundaria si son instalados después de que lo fuese el plugin (o si un navegador de Netscape Gecko concreto reemplaza al navegador actual). La información que deberían contener las claves es <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">explicada con detalle en la especificación publicada en mozilla.org</a>. Existe además un <a class="external" href="http://www.mozilla.org/projects/plugins/example-scobe.txt">ejemplo de una entrada de registro</a> creada por una compañía imaginaria que ilustra lo que se explica en la <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">especificación para dichas claves de registro</a>.
+</li><li> En Windows, las claves del registro mencionadas antes siguen una nomenclatura usando el concepto de <a class="external" href="http://www.mozilla.org/projects/plugins/plugin-identifier.html">identificador de plugin</a> como nombre de clave bajo la subclave MozillaPlugins. El <a class="external" href="http://www.mozilla.org/projects/plugins/plugin-identifier.html">identificador de plugin (o PLID)</a> es un concepto útil que es también aplicable cuando se inicializa la instalación a través de la <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">API initInstall</a>.
+</li></ul>
+<h3 id="Disecci.C3.B3n_de_las_APIs_utilizadas"> Disección de las APIs utilizadas </h3>
+<p>El proceso recomendado de instalación de plugins hace uso de las APIs de XPInstall para instalarlos en el directorio Plugins del navegador actual, en una ubicación secundaria y para <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">escribir una clave en el registro del sistema de Windows que permita recuperar esta última ubicación</a>. Esta sección describe algunas de las APIs de XPInstall que pueden hacer esto y muestra además una plantilla completa de un paquete XPI. No todo el trabajo necesita ser hecho en JavaScript (si tienes un instalador nativo (EXE) que <a class="external" href="http://mozilla.org/projects/plugins/install-scheme.html">reconoce a los navegadores Netscape Gecko</a> y simplemente deseas incluir el instalador ejecutable en un paquete XPI para que el usuario pueda descargarlo, puedes hacerlo fácilmente). Esta sección hace referencia de modo extensivo a la <a href="es/XPInstall_API_Reference">documentación API de XPInstall</a>.
+</p>
+<h4 id="Inicializar_la_instalaci.C3.B3n_con_el_identificador_del_plugin"> Inicializar la instalación con el identificador del plugin </h4>
+<p>Toda instalación XPInstall es inicializada con el <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">método initInstall del objeto Install</a>. Ya que el objeto Install está disponible para el script de instalación no necesita ser mencionado en dicho script (p.e., no hay necesidad de utilizar Install.initInstall. Con invocar simplemente a <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> será suficiente). El método initInstall es polimórfico aunque a continuación se muestra el mecanismo de invocación recomendado:
+</p>
+<pre>initInstall("My Plugin Software", "@myplugin.com/MyPlugin,version=2.5", "2.5.0.0");
+</pre>
+<p>En el trozo de código anterior, el método <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> es invocado con tres parámetros:
+</p>
+<ul><li> Una cadena con el nombre de la aplicación.
+</li><li> Una cadena representando el <a class="external" href="http://mozilla.org/projects/plugins/plugin-identifier.html">identificador del plugin</a> asociado con el plugin. En realidad, este valor se guarda en el registro de versión de cliente tras la instalación, un fichero de los navegadores Mozilla que guarda metadatos con el software que acaba de ser instalado. Este valor puede ser consultado con JavaScript a través de una página web y es útil para inicializar descargas XPInstall vía <a href="es/XPInstall_API_Reference/InstallTrigger_Object">scripts disparados</a>. Se puede determinar la versión del software que ha sido instalado y determinar si se tiene que actualizar o no, todo esto utilizando JavaScript en una página web.
+</li><li> Una cadena que represnta la versión de cuatro dígitos del software.
+</li></ul>
+<p><b>Advertencia:</b> Ciertas versiones de los navegadores basados en Mozilla (tales como Netscape 6.x) tratan al carácter igual ("=") como un token ilegal, por lo que no permitirán la invocación de initInstall con cadenas que contengan "=". Un truco podría ser detectar si initInstall ha fallado y, en caso afirmativo, invocarlo de nuevo sin el "=". A continuación se muestra un ejemplo:
+</p>
+<pre>var PLID = "MyPlugin.plug/version=6.5";
+err = initInstall(SOFTWARE_NAME, PLID, VERSION);
+
+if (err != 0)
+{
+	// la instalación debería fallar: se usa N6 y =
+	// reemplazamos PLID con una cadena simple
+	err = initInstall(SOFTWARE_NAME, "MyPluginString", VERSION);
+	if (err != 0)
+		cancelInstall(err);
+}
+</pre>
+<p>Nótese que en el ejemplo anterior el PLID contiene un "=" y, en caso de que el paquete XPI esté siendo ejecutado en navegadores que tratan a "=" como un token ilegal, el truco capturará el error e invocará de nuevo a initInstall.
+</p>
+<h3 id="Usar_XPInstall_junto_con_un_instalador_ejecutable_.28c.C3.B3digo_nativo.29"> Usar XPInstall junto con un instalador ejecutable (código nativo) </h3>
+<p>Si lo que deseas es ejecutar un instalador nativo (EXE) para instalar el software de un plugin pero prefieres que el instalador sea descargado dentro del proceso del navegador entonces probablemente deberías considerar incluirlo en un paquete XPI. Desde JavaScript, puedes llamar al <a href="es/XPInstall_API_Reference/Install_Object/Methods/execute">método execute del objeto Install</a> del XPInstall para ejecutar el binario. Además puedes llamar al <a href="es/XPInstall_API_Reference/File_Object/Methods/execute">método execute del objeto File</a> si lo que realmente quieres instalar es el fichero que estás ejecutando en lugar de borrarlo. Puedes pasar parámetros de línea de comandos al ejecutable. Un ejemplo de llamada al método execute desde el objeto Install sobre un ejecutable que tiene un período de vida temporal (y no se necesita tras la instalación) es:
+</p>
+<pre>// Initialize the installation ....
+
+// initInstall(..... ) has already been called
+
+// Using the Install Object's execute method to block on a native installer
+
+execute("setup.exe", "-s", true);
+
+// En el ejemplo anterior, se supone que se ha ejecutado "setup -s" desde
+// la línea de comandos que arranca el instalador y que "-s" es algún
+// tipo de parámetro definido por el fichero setup.exe, quizá para forzar
+// al instalador a ejecutarse en modo silencioso. Se pasa el "-s" al instalador.
+// Pasando 'true' le estamos diciendo al script de instalación que bloquee
+// la ejecución del instalador y que lo haga síncronamente.
+
+// Se debería llamar a performInstall para hacer que suceda...
+
+err = getLastError();
+if (!err)
+   performInstall();
+else
+  cancelInstall(err);
+</pre>
+<h4 id="Instalar_los_ficheros_del_plugin_en_el_navegador_actual"> Instalar los ficheros del plugin en el navegador actual </h4>
+<p>La instalación en el navegador actual es la tarea más importante que debe de hacerse bien para un paquete XPI. A continuación se muestra un trozo de código que lleva a cabo esto:
+</p>
+<pre>// Name of the files to be installed
+var PLUGIN_FILE    = "NPMyPlugin.dll";
+var COMPONENT_FILE = "NPMyPluginScriptablePeer.xpt";
+
+// invoke initInstall to start the installation
+
+....
+
+var pluginFolder = getFolder("Plugins");
+
+// verify disk space is appropriate
+
+....
+
+err = addFile("@myplugin.com/MyPlugin,version=2.5.0.0",
+                     "2.5.0.0", PLUGIN_FILE, pluginsFolder, null);
+    if (err != 0)
+    {
+	//alert("Installation of MyPlugin plug-in failed. Error code "+err);
+	logComment("adding file "+PLUGIN_FILE+" failed. Errror conde: " + err);
+	return err;
+    }
+
+err = addFile(null, CULT_VERSION, COMPONENT_FILE, componentsFolder, null);
+    if (err != 0)
+    {
+	alert("Installation of MyPlugin component failed. Error code "+err);
+	logComment("adding file "+COMPONENT_FILE+" failed. Error conde: " + err);
+	return err;
+    }
+</pre>
+<h4 id="Instalaci.C3.B3n_en_una_ubicaci.C3.B3n_secundaria"> Instalación en una ubicación secundaria </h4>
+<p>Para solventar el <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">problema de la primera instalación</a> es necesario instalar en una segunda ubicación para asegurar que otros navegadores de Netscape Gecko puedan encontrar el plugin, además del navegador actual. Una buena elección para esta ubicación secundaria podría ser el directorio Windows en ordenadores con Windows. <b>Advertencia:</b> Debido a posibles problemas de permisos se aconseja manejar los errores con sumo cuidado.
+</p>
+<pre>// Obtenemos el directorio de sistema de Windows, p.e., el directorio C:\WINNT\system32\
+
+var winDirectory = getFolder("Win System");
+
+// Create the Folder C:\WINNT\system32\MyPlugin
+
+var dllWin32Folder = getFolder("file:///", winDirectory+"\\MyPlugin\\");
+//Install DLL to C:\Windows Folder
+	copyErr = addFile("", VERSION, PLUGIN_FILE, dllWin32Folder, null);
+    if (copyErr != 0)
+    {
+    	logComment("First Install:"+copyErr);
+    	return copyErr;
+    }
+
+// Install the XPT file to C:\WINNT\system32\MyPlugin folder
+
+var xptWin32Folder = getFolder("file:///", winDirectory+"\\MyPlugin\\");
+	copyErr = addFile("", VERSION, COMPONENT_FILE, xptWin32Folder, null);
+    if (copyErr != 0)
+    {
+    	logComment("First Install:"+copyErr);
+    	return copyErr;
+    }
+</pre>
+<p>Una vez decidida la ubicación secundaria, el <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">registro de windows ha de ser actualizado</a> con la ruta de dicha ubicación para que futuros navegadores puedan recuperarla. Esto es realizado con el objeto <a href="es/XPInstall_API_Reference/WinReg_Object">WinReg</a> proporcionado por XPInstall. Todas las piezas quedan ensambladas en la plantilla mostrada a continuación.
+</p>
+<h3 id="Plantilla_XPInstall"> Plantilla XPInstall </h3>
+<p>Se ha mostrado <a href="es/Using_XPInstall_to_Install_Plugins/Install_script_template">una plantilla para un script de instalación</a> que quizá te gustaría abrir en otra pestaña o ventana. Dicho script de instalación hace lo siguiente:
+</p>
+<ul><li> Instala tanto el fichero DLL como el XPT en el directorio de plugins del navegador. El propio plugin es imaginario: MyPlugin. Sin embargo, las variables que determinan el nombre del plugin pueden ser modificadas fácilmente. Este fichero install.js supone que el software del plugin que va a ser instalado está compuesto por un fichero DLL y por otro XBT, lo cual no siempre es cierto. Muchos plugins pueden traer más de una DLL o quizá código nativo adicional. No obstante, es una suposición más que segura para la mayoría de los plugins, especialmente para <a class="external" href="http://www.macromedia.com/go/getflashplayerbutton/">el plugin Flash de Macromedia</a> compuesto por una única DLL (en Windows es npswf32.dll) y un único fichero XPT para script (llamado flashplayer.xpt).
+</li><li> Adicionalmente, instala el plugin en una ubicación secundaria en el ordenador del usuario. Concretamente, como muchos ficheros OCX (los controles ActiveX), se instala en un directorio especial dentro de C:\WINNT\System32, llamado C:\WINNT\System32\MyPlugin. XPInstall es capaz de determinar cuál es este directorio gracias a la llamada API <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a>. Hemos escrito nuestra propia función de JavaScript que contiene todo el código de la instalación secundaria (la función createSecondaryInstall()).
+</li><li> Y por último, escribe <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">las claves de registro requeridas en Windows</a>. Esto se hace a través de la función creada, llamada registerPLID().
+</li></ul>
+<p>Es cierto que este secript se centra en Windows, pero es fácil portarlo a cualquier otra plataforma. Quizá esto sea todavía más fácil, ya que ni en Linux ni en Mac OSX hay que trabajar con la tediosa manipulación del registro de Windows. La <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">API getFolder</a> proporciona suficientes "golosinas sintácticas" como para determinar otras ubicaciones del ordenador del usuario en distintas plataformas y sistemas operativos. Un único install.js es casi siempre capaz de ejecutarse en muchas plataformas diferentes.
+</p>
+<h3 id="Algunas_notas_sobre_la_instalaci.C3.B3n"> Algunas notas sobre la instalación </h3>
+<p>Esta sección comprende algunas de las notas clave sobre el envío de paquetes XPI, en particular: ¿cómo puede ser iniciada la descarga de un plugin vía XPI? ¿Y qué pasa con la desinstalación de plugins?
+</p>
+<h3 id="Ejecutar_una_descarga_XPInstall_con_un_script_autoejecutable"> Ejecutar una descarga XPInstall con un script autoejecutable </h3>
+<p>Un <a href="es/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts">script autoejecutable</a> es un trozo de JavaScript de una página web que puede iniciar automáticamente una descarga XPInstall. Esto puede estar condicionado al hecho de que los <a href="es/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts">scripts autodisparados</a> pueden detectar además el software que ya está instalado en el ordenador del usuario a través de XPInstall. Esta opción es útil para los sitios web porque:
+</p>
+<ul><li> Las páginas HTML y JavaScript ya poseen un modo de detectar qué plugins están instalados. Además, gracias al objeto <a href="es/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> el cual es accesible por las páginas web, se puede conocer la última versión del paquete XPI instalado.
+</li><li> El objeto <a href="es/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> también puede iniciar una descarga XPI automáticamente. Esto es útil ya que los usuarios pueden visitar un sitio web y, de forma opcional, obtener el software del servidor (mediante flujo de datos) ofrecido al usuario por la página web.
+</li></ul>
+<p>Los scripts autoejecutables son la forma recomendada de iniciar las descargas XPInstall.
+</p>
+<h3 id="Ejecutar_una_descarga_XPInstall_desde_HTML"> Ejecutar una descarga XPInstall desde HTML </h3>
+<p>De manera análoga a como son inicializadas las descargas SmartUpdate por el atributo pluginurl de la etiqueta <code>&lt;embed&gt;</code>, las descargas XPInstall pueden ser también iniciadas por las etiquetas HTML que invocan a plugins, sobre todo a través del atributo <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#adef-codebase-OBJECT"><code>codebase</code></a> de la etiqueta <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-OBJECT"><code>&lt;object&gt;</code></a>. Esto es análogo a cómo Internet Explorer descarga ficheros CAB referenciados por el atributo <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#adef-codebase-OBJECT"><code>codebase</code></a> de la etiqueta <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-OBJECT"><code>&lt;object&gt;</code></a>. A continuación se muestra un ejemplo de una hipotética etiqueta <code>&lt;object&gt;</code> usada para invocar a MyPlugin (una aplicación imaginaria):
+</p>
+<pre>	&lt;object id="thePlugin" type="application/x-myplugin" width="100"
+	height="100" codebase="http://location/XPI/myplugin.xpi"&gt;
+
+&lt;param .... &gt;
+</pre>
+<p>En el caso anterior, el atributo <code>codebase</code> apunta directamente al paquete XPI y si el navegador no pudiese identificar ningún plugin para manejar el tipo MIME (imaginario) application/x-myplugin, entonces descargaría el paquete XPI.
+</p><p><b>Nota:</b> Los paquetes XPI (los ficheros con extensión xpi) utilizan el tipo MIME application/x-xpinstall. Al servir los paquetes XPI a los clientes desde el servidor, asegúrate de que los paquetes son servidos con este tipo MIME en las cabeceras HTTP. Asocia el tipo MIME application/x-xpinstall con los paquetes XPI.
+</p>
+<h3 id="El_problema_de_la_desinstalaci.C3.B3n"> El problema de la desinstalación </h3>
+<p>En su versión actual, XPInstall no posee una tecnología de desinstalación. Ya que sólo puede ser usado para instalar ficheros o para servir de transporte a instaladores de código nativo para el cliente, sería una buena idea escribir un desinstalador de código nativo para el cliente, si es procedente. XPInstall puede por tanto ser un "agente de transporte" para llevar el software del ejecutable y con éste la lógica de instalación y desinstalación que será manejada por él, el cual puede crear ficheros y entradas de registro además de limpiarlo todo después de eliminarlo.
+</p>
+<div class="originaldocinfo">
+<h3 id="Informaci.C3.B3n_original_del_documento"> Información original del documento </h3>
+<ul><li> Author(s): Arun K. Ranganathan, Netscape Communications
+</li><li> Last Updated Date: 05 Aug 2002
+</li><li> Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.
+</li><li> Link: <a class=" external" href="http://devedge-temp.mozilla.org/viewsource/2002/xpinstall-guidelines/index_en.html">http://devedge-temp.mozilla.org/view.../index_en.html</a>
+</li></ul>
+</div>
diff --git a/files/es/orphaned/uso_del_núcleo_del_nivel_1_del_dom/index.html b/files/es/orphaned/uso_del_núcleo_del_nivel_1_del_dom/index.html
new file mode 100644
index 0000000000..a1f476dfb1
--- /dev/null
+++ b/files/es/orphaned/uso_del_núcleo_del_nivel_1_del_dom/index.html
@@ -0,0 +1,93 @@
+---
+title: Uso del núcleo del nivel 1 del DOM
+slug: orphaned/Uso_del_núcleo_del_nivel_1_del_DOM
+tags:
+  - DOM
+  - Todas_las_Categorías
+original_slug: Uso_del_núcleo_del_nivel_1_del_DOM
+---
+<p>El núcleo del DOM nivel 1 del W3C es un potente modelo de objetos para cambiar el árbol de contenidos de los documentos. Está soportado en Mozilla (en el cual está basado Netscape 6) y (la mayor parte de) MSIE 5.0 para Windows. Es una potente base para la futura programación de la web.</p>
+
+<h3 id=".C2.BFQu.C3.A9_es_un_.C3.A1rbol_de_contenidos.3F" name=".C2.BFQu.C3.A9_es_un_.C3.A1rbol_de_contenidos.3F">¿Qué es un árbol de contenidos?</h3>
+
+<p>Muchos de los que trabajan con HTML pueden pensar que HTML es algo plano, un montón de texto con etiquetas en medio. Sin embargo es mucho más que eso. Todo documento HTML (y por extensión todo documento SGML o XML) posee una estructura en árbol. Por ejemplo, el siguiente documento y la estructura en árbol son similares (aunque no idénticas; ver anotaciones en <a href="es/The_DOM_and_JavaScript">espacios en blanco en DOM</a>):</p>
+
+<pre class="eval">&lt;html&gt;
+&lt;head&gt;
+  &lt;title&gt;Mi documento&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+  &lt;h1&gt;Cabecera&lt;/h1&gt;
+  &lt;p&gt;Párrafo&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+
+
+<p>Cuando analiza un documento, Mozilla construye un árbol de contenidos y luego lo utiliza para mostrar el documento.</p>
+
+<p>Los términos usados para describir los árboles show up frecuentemente en el núcleo del DOM nivel 1. Cada caja dibujada en el árbol de arriba es un nodo en el árbol. La línea sobre cada nodo expresa una relación padre-hijo: el nodo superior es el padre y el inferior, el hijo. Dos hijos del mismo padre son por tanto hermanos. Similarmente, uno puede referirse a sus ancestros y descendientes (incluso a los nodos primos, aunque es más complicado de explicar).</p>
+
+<h3 id=".C2.BFQu.C3.A9_me_permite_hacer_el_Nivel_1_del_DOM.3F" name=".C2.BFQu.C3.A9_me_permite_hacer_el_Nivel_1_del_DOM.3F">¿Qué me permite hacer el Nivel 1 del DOM?</h3>
+
+<p>El nivel 1 del DOM del W3C te permite cambiar el árbol de contenidos<em>como te de la gana</em> . Es lo suficientemente poderoso como para construir cualquier documento HTML a partir de la nada. Permite a los desarrolladores cambiar cualquier cosa en el documento desde un script, en cualquier momento. La forma más fácil para desarrolladores de páginas web para cambiar el DOM dinámicamente es usando JavaScript. En JavaScript, el documento es accesible en el mismo modo que lo era en los viejos navegadores: desde la propiedad global <code>document</code>. El objeto <code>document</code> implementa el <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#i-Document">interfaz de documento</a> del nivel 1 de la especificación para el DOM del W3C.</p>
+
+<h3 id="Un_ejemplo_simple" name="Un_ejemplo_simple">Un ejemplo simple</h3>
+
+<p>Supongamos que el autor del documento de arriba coge y cambia los contenidos de la cabecera y escribe dos párrafos en lugar de uno. El siguiente script debería hacer lo mismo (Resaltado de sintaxis: <code><span class="highlightred">palabras reservadas Javascript</span></code>, <code><span class="highlightblue">métodos y propiedades DOM</span></code> predefinidos y <code><span class="highlightgreen">comentarios en Javascript</span></code>):</p>
+
+<pre class="eval"><span class="highlightgreen">
+// document.getElementsByTagName("H1") devuelve un NodeList de los
+// elementos H1 del documento; el primer elemento tiene índice 0:
+</span>
+<span class="highlightred">var</span> header = <span class="highlightblue">document.getElementsByTagName</span>("H1").<span class="highlightblue">item</span>(0);
+<span class="highlightgreen">
+// La propiedad firstChild de la cabecera contiene un nodo de texto y su propiedad
+// data contiene el texto del nodo:
+</span>
+header.<span class="highlightblue">firstChild.data</span> = "Un documento dinámico";
+<span class="highlightgreen">
+// Ahora la cabecera es "Un documento dinámico".
+// Obtenemos el primer elemento P del documento de la misma forma:
+</span>
+<span class="highlightred">var</span> para = <span class="highlightblue">document.getElementsByTagName</span>("P").<span class="highlightblue">item</span>(0);
+<span class="highlightgreen">
+// y cambiamos su texto:
+</span>
+para.<span class="highlightblue">firstChild.data = "Este es el primer párrafo.";</span>
+<span class="highlightgreen">
+// creamos un nodo de texto para el segundo párrafo
+</span>
+<span class="highlightred">var</span> newText = <span class="highlightblue">document.createTextNode</span>("This is the second paragraph.");
+<span class="highlightgreen">
+// creamos un nuevo elemento que sea el segundo párrafo
+</span>
+<span class="highlightred">var</span> newElement = <span class="highlightblue">document.createElement</span>("P");
+<span class="highlightgreen">
+// ponemos el texto en el párrafo
+</span>
+newElement.<span class="highlightblue">appendChild</span>(newText);
+<span class="highlightgreen">
+// y ponemos el párrafo al final del documento anexándolo
+// a la etiqueta BODY (que es el padre del párrafo
+</span>
+para.<span class="highlightblue">parentNode.appendChild</span>(newElement);
+</pre>
+
+<p>Puedes ver este script en acción en el <a class="external" href="http://www.mozilla.org/docs/dom/technote/intro/example.html">ejemplo completo</a>.</p>
+
+<h3 id=".C2.BFC.C3.B3mo_puedo_aprender_m.C3.A1s.3F" name=".C2.BFC.C3.B3mo_puedo_aprender_m.C3.A1s.3F">¿Cómo puedo aprender más?</h3>
+
+<p>Una vez familiarizado con los conceptos básicos del DOM, puedes leer el documento que explica los <a href="es/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces">métodos fundamentales del DOM nivel 1</a>. Es lo que sigue a este documento.</p>
+
+<p>Véase también la <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html">especificación del núcleo de DOM nivel 1</a> del W3C. Es una especificación razonablemente clara a pesar de ser una especificación formal. Lo más útil para los desarrolladores es la descripción de los diferentes objetos del DOM y todas sus propiedades y métodos. Véase también nuestra <a href="es/DOM">otra documentación del DOM</a>.</p>
+
+<div class="originaldocinfo">
+<p><strong>Original Document Information</strong></p>
+
+<ul>
+ <li>Author(s): L. David Baron &lt;dbaron at dbaron dot org&gt;</li>
+ <li>Copyright Information: © 1998-2005 by individual mozilla.org contributors; content available under a <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Creative Commons license</a></li>
+</ul>
+</div>
diff --git a/files/es/orphaned/vigilar_plugins/index.html b/files/es/orphaned/vigilar_plugins/index.html
new file mode 100644
index 0000000000..23852e73e9
--- /dev/null
+++ b/files/es/orphaned/vigilar_plugins/index.html
@@ -0,0 +1,111 @@
+---
+title: Vigilar plugins
+slug: orphaned/Vigilar_plugins
+tags:
+  - Firefox 3
+  - Plugins
+  - Todas_las_Categorías
+original_slug: Vigilar_plugins
+---
+<p>{{ Fx_minversion_header(3) }}
+</p>
+<h3 id="Resumen" name="Resumen">Resumen</h3>
+<p>Ya está disponible un nuevo componente de los plugin que permite saber cuanto tiempo le toma a un determinado plugin (p.e. Adobe Flash) ejecutar sus llamadas. Este componente presenta el runtime del plugin usando el <a href="es/NsIObserverService">observer service</a> a cualquiera que reciba la notificación. Este artículo cuenta cómo los desarrolladores pueden hacer uso de esta facilidad.
+</p><p><br>
+</p>
+<h3 id="Datos_del_Runtime" name="Datos_del_Runtime">Datos del Runtime</h3>
+<p>La información del runtime presentada es siempre en fracciones de segundo. Ya que el componente mide el tiempo que le toma a las llamadas de bloque del plugin, el valor incluye tanto el tiempo de CPU, el tiempo de espera entre asignaciones de tiempo de CPU al proceso, como cualquier tiempo de e/s del disco. Es técnicamente incorrecto decir que el runtime es una medida del uso de CPU, sin embargo, es una buena representación de los recursos totales consumidos por el plugin.
+</p>
+<h3 id="Uso" name="Uso">Uso</h3>
+<p>Para hacer uso del nuevo componente, debes registrarte para recibir las notificaciones del runtime usando el <a href="es/NsIObserverService">observer service</a>. El tópico de la notificación es <code>experimental-notify-plugin-call</code>. Si eres novato con el servicio de observación de Mozilla, querrás familiarizarte con él antes de proseguir. Puedes encontrar información acerca del servicio de observación <a href="es/NsIObserverService"> aquí</a> y <a href="es/NsIObserver"> aquí</a>.
+</p><p>Debajo hay un número de conversaciones sobre JavaScript que podrían ser útiles para desarrolladores que quieran usar esta facilidad:
+</p>
+<h4 id="Registro" name="Registro">Registro</h4>
+<p>Para registrase en el servicio de notificaciones con el observador debes crear una clase con un método <code>observe</code> que recibe tres parámetros (<code>subject</code>, <code>topic</code> y <code>data</code>) así como un método <code>register</code> que contiene el siguiente código:
+</p><p><br>
+<code>
+</code></p>
+<pre class="eval">var observerService = Components.classes["@mozilla.org/observer-service;1"]
+                        .getService (Components.interfaces.nsIObserverService);
+observerService.addObserver(this, "experimental-notify-plugin-call", false);
+</pre>
+<p>
+</p><p><br>
+</p>
+<h4 id="Observando" name="Observando">Observando</h4>
+<p>Como hemos dicho arriba, para especificar lo que quieres que se haga cuando llega una notificación, tu clase debe tener un método <code>observe</code>, que recibe tres parámetros (<code>subject</code>, <code>topic</code> y <code>data</code>). El <code>topic</code> contiene el tópico de la notificación - <code>experimental-notify-plugin-call</code> en este caso, <code>data</code> es el runtime en mili segundos y <code>subject</code> es siempre <code>null</code> y no debería usarse.
+</p><p>Aquí hay un ejemplo que muestra el runtime en una caja de alerta al usuario si el runtime excede medio segundo de longitud:
+</p><p><code>
+</code></p>
+<pre class="eval"> observe: function(subject, topic, data) {
+   if (topic == "experimental-notify-plugin-call" ) {
+     if (data &gt; 0.500) {
+       alert("Runtime is: " + data);
+     }
+   }
+ }
+</pre>
+<p>
+</p><p><b>NOTA: Esto es un ejemplo simplificado y se desaconseja el uso de <code>alert()</code> ya que el componente puede enviar cientos de notificaciones por segundo y puede, potencialmente, causar la parada del navegador si se abre un número excesivo de cajas de alerta.</b>
+</p><p>Téngase también en cuenta que en el ejemplo anterior una sentencia if primero comprueba que el tópico de la notificación es el correcto. Esto es útil en casos en los que la clase se registra para recibir notificaciones de más de un tópico en el servicio de observación.
+</p>
+<h4 id="Limpieza" name="Limpieza">Limpieza</h4>
+<p>Para des-registrar tu clase en el servicio de observación - cuando ya no quieres escuchar las notificaciones del runtime - tu clase debe incluir un método <code>unregister</code> que contenga el siguiente código:
+</p><p><code>
+</code></p>
+<pre class="eval">var observerService = Components.classes["@mozilla.org/observer-service;1"]
+                       .getService(Components.interfaces.nsIObserverService);
+observerService.removeObserver(this, "experimental-notify-plugin-call");
+</pre>
+<p>
+</p><p><br>
+</p>
+<h4 id="Esquema_de_una_clase_para_el_observador" name="Esquema_de_una_clase_para_el_observador">Esquema de una clase para el observador</h4>
+<p>A continuación presentamos un esquema de una clase que puedes usar para escuchar el servicio de notificaciones:
+</p><p><code>
+</code></p>
+<pre class="eval"> function PluginObserver() {
+   this.registered = false;
+   this.register();	// se cuida de registrar esta clase en el servicio de observación como un observador para el servicio de notificación
+ }
+
+ PluginWatcherObserver.prototype = {
+   observe: function(subject, topic, data) {
+
+     if (topic == "experimental-notify-plugin-call") //En caso de que tu clase esté registrada para escuchar otros tópicos
+       //Esto es ejecutado cada vez que llega una notificación
+       // --AQUÍ VA TU CÓDIGO--
+     }
+
+
+   },
+   //Se cuida de registrar el observador para el tópico "experimental-notify-plugin-call"
+   register: function() {
+     if (this.registered == false) { //Este evento previene el doble registro -- ¡algo que quieres evitar!
+       var observerService = Components.classes["@mozilla.org/observer-service;1"]
+                                       .getService(Components.interfaces.nsIObserverService);
+       observerService.addObserver(this, "experimental-notify-plugin-call", false);
+       this.registered = true;
+     }
+   },
+   //Des-registra del servicio de observación
+   unregister: function() {
+     if (this.registered == true) {
+       var observerService = Components.classes["@mozilla.org/observer-service;1"]
+                                       .getService(Components.interfaces.nsIObserverService);
+       observerService.removeObserver(this, "experimental-notify-plugin-call");
+       this.registered = false;
+     }
+   }
+ }
+</pre>
+<p>
+</p><p><br>
+</p>
+<h3 id="Recursos_adicionales" name="Recursos_adicionales">Recursos adicionales</h3>
+<p>Más información sobre el servicio de observación:
+</p>
+<ul><li> <a href="es/NsIObserverService">nsIObserverService</a>
+</li><li> <a href="es/NsIObserver">nsIObserver</a>
+</li></ul>
+{{ languages( { "ja": "ja/Monitoring_plugins" } ) }}
diff --git a/files/es/orphaned/web/api/web_crypto_api/checking_authenticity_with_password/index.html b/files/es/orphaned/web/api/web_crypto_api/checking_authenticity_with_password/index.html
new file mode 100644
index 0000000000..6ff8e52560
--- /dev/null
+++ b/files/es/orphaned/web/api/web_crypto_api/checking_authenticity_with_password/index.html
@@ -0,0 +1,31 @@
+---
+title: Verificando la autenticidad usando contraseña
+slug: orphaned/Web/API/Web_Crypto_API/Checking_authenticity_with_password
+translation_of: Web/API/Web_Crypto_API/Checking_authenticity_with_password
+original_slug: Web/API/Web_Crypto_API/Checking_authenticity_with_password
+---
+<p>{{APIRef("Web Crypto API")}}{{draft}}</p>
+
+<p>La autenticidad del mensaje puede ser verificada usando el API Crypto Web. En este artículo mostrarémos como crear y controlar una firma digital utilizando una contraseña y una función hash.</p>
+
+<p>Un algoritmo HMAC toma una llave y genera un código digerido de la llave y los datos a firmar. Posteriormente, cualquiera con la llave puede volver a generar el mismo código digerido para verificar si los datos han sido alterados.  Además, mediante el conocimiento de una clave secreta, permite almacenar juntos el código digerido y los datos: un atacante no podrá generar un código digerido sobre datos manipulados si no conoce la clave secreta.</p>
+
+<p>Note that this algorithm doesn't carry any information about the person owning the data, nor its unicity: the mere knowledge of the key is enough to alter the data.</p>
+
+<p>Let's assume that the data is stored on the computer. To access it, both for writing and reading, we will use <code>localforage.js</code> a small library wrapping the different storages capabilities of a browser in the same interface. This library is not an essential component of this use case and is used here for convenience, to keep focused on what really matter, the cryptographic part.</p>
+
+<p>The data we want to access is of the form:</p>
+
+<p> </p>
+
+<p>where <code>data</code><em> </em>is the information to guarantee the integrity and <code>signature</code> the information used to verify it.</p>
+
+<p>Cryptographic keys can't be remembered by heart by human, and passwords, or passphrases, make bad, that is unsecure, cryptographic key. To solve this problem, cryptographers have designed algorithms generating cryptographically-sound keys from password. Knowing the password allowed to regenerate the same key and to use it.</p>
+
+<p>We ask the user for a password, and we use it to generate the key:</p>
+
+<pre> </pre>
+
+<p>With that key, we will be able to compute the <em>mac</em> of the data.</p>
+
+<pre> </pre>
diff --git a/files/es/orphaned/web/css/comenzando_(tutorial_css)/index.html b/files/es/orphaned/web/css/comenzando_(tutorial_css)/index.html
new file mode 100644
index 0000000000..d611859f41
--- /dev/null
+++ b/files/es/orphaned/web/css/comenzando_(tutorial_css)/index.html
@@ -0,0 +1,41 @@
+---
+title: Comenzando (tutorial CSS)
+slug: orphaned/Web/CSS/Comenzando_(tutorial_CSS)
+original_slug: Web/CSS/Comenzando_(tutorial_CSS)
+---
+<p> </p>
+<h2 id="Introducción">Introducción</h2>
+<p>Este tutorial te introducirá en las Hojas de Estilo en Cascada (CSS).</p>
+<p>Este tutorial te guiará a través de las características básicas de CSS con ejemplos prácticos que puedes probar tu mismo desde tu computadora. Está dividido en dos partes.</p>
+<ul> <li>La Parte I ilustra las características estándares de CSS que funcionan con los navegadores de Mozilla así como también con la mayoría de navegadores modernos.</li>
+</ul>
+<ul> <li>La Parte II contiene algunos ejemplos de características básicas que funcionan en Mozilla pero no necesariamente funciona en otros entornos.</li>
+</ul>
+<p>Este tutorial se base en la <a class=" external" href="http://www.w3.org/TR/CSS21/" title="http://www.w3.org/TR/CSS21/">especificación CSS 2.1</a></p>
+<h3 id="¿Quienes_deberían_usar_este_tutorial">¿Quienes deberían usar este tutorial?</h3>
+<p>Este tutorial es principalmente para principiantes en CSS, pero también puedes usarlo si tienes alguna experiencia con CSS.</p>
+<p>Si eres un principiante en CSS, usa la Parte I de este tutorial para entender y aprender como usar CSS. Luego usa la Parte II para entender el alcance de CSS en Mozilla.</p>
+<p>Si conoces algo de CSS, puedes saltarte las partes del tutorial que ya conozcas, y solo usar las partes que te interesan.</p>
+<p>Si tienes experiencia con CSS pero no con Mozilla, puedes saltarte a la Parte II.</p>
+<h3 id="¿Qué_necesitas_antes_de_empezar">¿Qué necesitas antes de empezar?</h3>
+<p>Para obtener el mayor provecho de este tutorial, necesitas un editor para archivos de texto, especialmente para la Parte II, un navegador de Mozilla (Firefox, Camino o SeaMonkey). También debes saber como usarlos de forma básica.</p>
+<p>Si no quieres editar archivos, puedes solo leer el tutorial y ver las imágenes, pero es una forma menos efectiva de aprender.</p>
+<p>Algunas partes de este tutorial requieren otros programas de Mozilla. Estas partes son opcionales. Si no quieres descargar otros programas de Mozilla, puedes saltarte estas partes.</p>
+<ul> <li><a href="/en/DOM_Inspector" title="en/DOM Inspector">DOM Inspector</a></li>
+</ul>
+<p><strong>Nota: </strong> CSS provee formas de trabajar con color, así que partes de este tutorial dependen del color. Puedes usar estas partes del tutorial fácilmente si tienes una pantalla a color y puedes visualizar normalmente los colores.</p>
+<h3 id="Como_usar_este_tutorial">Como usar este tutorial</h3>
+<p>Para usar este tutorial, lee las páginas cuidadosamente y en secuencia. Si te pierdes alguna página, entonces puedes tener dificultades para entender las páginas siguientes.</p>
+<p>En cada página, usa la sección <em>Información</em> para entender como funciona CSS. Usa la sección <em>Acción</em> para tratar de usar CSS en tu computadora.</p>
+<p>Para probar tu entendimiento, toma los retos al final de cada página. Las soluciones a los retos están enlazados bajo los mismos retos, así que no necesitas mirar las respuestas si no quieres hacerlo.</p>
+<p>Para entender CSS con mayor profundidad, lee la información que encuentres en las cajas subtituladas <em>Más detalles</em>. Usa los enlaces allí para encontrar información de referencia acerca de CSS.</p>
+<h2 id="Tutorial_Parte_I">Tutorial Parte I</h2>
+<p>Una guía de CSS paso a paso.</p>
+<ol> <li><strong><a href="/es/CSS/Getting_Started/Que_es_css" title="es/CSS/Getting_Started/Que_es_css">Que es CSS</a></strong></li> <li><a href="/es/CSS/Getting_Started/Por_que_usar_css" title="es/CSS/Getting_Started/Por_que_usar_css"><strong>Por qué usar CSS</strong></a></li> <li><a href="/es/CSS/Getting_Started/Como_funciona_css" title="es/CSS/Getting_Started/Como_funciona_css"><strong>Como funciona CSS</strong></a></li> <li><strong><a href="/es/CSS/Getting_Started/Cascada_y_herencia" title="es/CSS/Getting_Started/Cascada_y_herencia">Cascada y herencia</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Selectores" title="es/CSS/Getting_Started/Selectores">Selectores</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/CSS_legible" title="es/CSS/Getting_Started/CSS_legible">CSS legible</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Estilos_de_texto" title="es/CSS/Getting_Started/Estilos_de_texto">Estilos de texto</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Color" title="es/CSS/Getting_Started/Color">Color</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Contenido" title="es/CSS/Getting_Started/Contenido">Contenido</a> </strong></li> <li><strong><a href="/es/CSS/Getting_Started/Listas" title="es/CSS/Getting_Started/Listas">Listas</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Cajas" title="es/CSS/Getting_Started/Cajas">Cajas</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Estructura" title="es/CSS/Getting_Started/Estructura">Estructura</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Tablas" title="es/CSS/Getting_Started/Tablas">Tablas</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Media" title="es/CSS/Getting_Started/Media">Media</a></strong></li>
+</ol>
+<h2 id="Tutorial_Parte_II">Tutorial Parte II</h2>
+<p>Ejemplos que muestran el alcance de CSS usado con otras tecnologías web y de Mozilla.</p>
+<ol> <li><strong><a href="/es/CSS/Getting_Started/Javascript" title="es/CSS/Getting_Started/Javascript">JavaScript</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Graficos_svg" title="es/CSS/Getting_Started/Graficos_svg">Gráficos SVG</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Data_xml" title="es/CSS/Getting_Started/Data_xml">Data XML</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/XBL_bindings" title="es/CSS/Getting_Started/XBL_bindings">XBL bindings</a> </strong></li> <li><strong><a href="/es/CSS/Getting_Started/Interfaces_de_usuario_XUL" title="es/CSS/Getting_Started/Interfaces_de_usuario_XUL">Interfaces de usuario XUL</a></strong></li>
+</ol>
+<p>{{ CSSTutorialTOC() }}</p>
+<p>{{ languages( { "es": "es/CSS/Introducción", "de": "de/CSS/Einführung", "fr": "fr/CSS/Premiers_pas", "it": "it/Conoscere_i_CSS", "ja": "ja/CSS/Getting_Started", "nl": "nl/CSS/Voor_Beginners", "pl": "pl/CSS/Na_pocz\u0105tek", "pt": "pt/CSS/Como_come\u00e7ar", "zh-cn": "cn/CSS/\u5f00\u59cb" } ) }}</p>
diff --git a/files/es/orphaned/web/css/como_iniciar/index.html b/files/es/orphaned/web/css/como_iniciar/index.html
new file mode 100644
index 0000000000..ac3a0b3836
--- /dev/null
+++ b/files/es/orphaned/web/css/como_iniciar/index.html
@@ -0,0 +1,6 @@
+---
+title: Como iniciar
+slug: orphaned/Web/CSS/Como_iniciar
+original_slug: Web/CSS/Como_iniciar
+---
+This page was auto-generated because a user created a sub-page to this page.
diff --git a/files/es/orphaned/web/css/primeros_pasos/index.html b/files/es/orphaned/web/css/primeros_pasos/index.html
new file mode 100644
index 0000000000..e9a41b9331
--- /dev/null
+++ b/files/es/orphaned/web/css/primeros_pasos/index.html
@@ -0,0 +1,40 @@
+---
+title: Primeros pasos
+slug: orphaned/Web/CSS/Primeros_pasos
+original_slug: Web/CSS/Primeros_pasos
+---
+<p> </p>
+<h2 id="Introducción">Introducción</h2>
+<p>Este tutorial es una introducción a las hojas de estilo en cascada (CSS).</p>
+<p>Te guiará a través de las funcionalidades básicas de CSS con ejemplos prácticos que puedes poner a prueba en tu propio equipo. Tiene dos partes.</p>
+<ul> <li>La primera parte ilustra las funcionalidades estándar de CSS que funcionan en los navegadores de Mozilla y en casi todos los navegadores modernos.</li>
+</ul>
+<ul> <li>La segunda parte contiene algunos ejemplos de funciones especiales que funcionan en Mozilla pero no necesariamente en otros ambientes.</li>
+</ul>
+<p>El tutorial está basado en la <a class="external" href="http://www.w3.org/TR/CSS21/">especificación 2.1 de CSS 2.1</a>.</p>
+<h3 id="¿Quién_debe_usar_este_tutorial">¿Quién debe usar este tutorial?</h3>
+<p>Este tutotial es prácticamente para principiantes en CSS, pero también puedes usarlo si tienes alguna experiencia en CSS.</p>
+<p>Si eres un principiante en CSS, usa la primera parte del tutorial para entender CSS y aprender cómo usarlo. Después usa la segunda parte para entender el alcance de CSS en Mozilla.</p>
+<p>Si sabes algo de CSS, puedes saltearte las partes del tutorial que ya conoces y sólo leer las partes que te interesen.</p>
+<p>Si eres experimentado en CSS pero no en Mozilla, puedes pasar a la segunda parte.</p>
+<h3 id="¿Qué_necesitas_antes_de_empezar">¿Qué necesitas antes de empezar?</h3>
+<p>Para obtener lo mejor de este tutorial, necesitas un editor de archivos de texto y un navegador basado en Mozilla (Firefox o SeaMonkey). Deberías tener conocimientos básicos de cómo usarlos.</p>
+<p>Si no quieres editar archivos, puedes leer el tutorial y mirar las imágenes, pero esa es una forma menos efectiva de aprender.</p>
+<p>Unas pequeñas partes del tutorial requieren otros programas de Mozilla. Esas partes son opcionales. Si no quieres descargar otras aplicaciones de Mozilla, puedes saltearte esas partes. El otro software de Mozilla que se referencia en este tutorial incluye:</p>
+<ul> <li><a href="/en/DOM_Inspector" title="en/DOM Inspector">DOM Inspector</a></li>
+</ul>
+<p><strong>Nota: </strong> CSS brinda formas de trabajar con el color, así que partes de este tutorial dependen del color. Puedes usar estas partes fácilmente si tienes un monitor a color y una visión de colores normal.</p>
+<h3 id="Cómo_usar_este_tutorial">Cómo usar este tutorial</h3>
+<p>Para usar este tutorial, lee las páginas detenidamente y en orden. Si pierdes una página, podrá resultarte difícil entender las páginas posteriores.</p>
+<p>En cada página, usa la sección de <em>Información</em> para entender cómo funciona CSS. Usa la sección <em>Acción</em> para probar el uso de CSS en tu propio equipo.</p>
+<p>Para probar que hayas entendido, haz el desafío al final de cada página. Las soluciones a los desafíos están enlazados debajo de ellos, así no necesitas mirarlos si no quieres hacerlo.</p>
+<p>Para entender CSS más profundamente, lee la información que encontrarás en las cajas con el título <em>Más detalles</em>. Usa los enlaces que se encuentran allí para buscar información de referencia acerca de CSS.</p>
+<h2 id="Primera_parte_del_tutorial">Primera parte del tutorial</h2>
+<p>Una guía básica paso a paso de CSS.</p>
+<ol> <li><strong><a href="/en/CSS/Getting_Started/What_is_CSS" title="en/CSS/Getting_Started/What_is_CSS">What is CSS</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Why_use_CSS" title="en/CSS/Getting_Started/Why_use_CSS">Why use CSS</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting_Started/How_CSS_works">How CSS works</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Cascading_and_inheritance" title="en/CSS/Getting_Started/Cascading_and_inheritance">Cascading and inheritance</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Selectors" title="en/CSS/Getting_Started/Selectors">Selectors</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Readable_CSS" title="en/CSS/Getting_Started/Readable_CSS">Readable CSS</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Text_styles" title="en/CSS/Getting_Started/Text_styles">Text styles</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Color" title="en/CSS/Getting_Started/Color">Color</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Content" title="en/CSS/Getting_Started/Content">Content</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Lists" title="en/CSS/Getting_Started/Lists">Lists</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Boxes" title="en/CSS/Getting_Started/Boxes">Boxes</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Layout" title="en/CSS/Getting_Started/Layout">Layout</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Tables" title="en/CSS/Getting_Started/Tables">Tables</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Media" title="en/CSS/Getting_Started/Media">Media</a></strong></li>
+</ol>
+<h2 id="Segunda_parte_del_tutorial">Segunda parte del tutorial</h2>
+<p>Ejemplos que muestran el alcance del CSS en Mozilla.</p>
+<ol> <li><strong><a href="/en/CSS/Getting_Started/JavaScript" title="en/CSS/Getting_Started/JavaScript">JavaScript</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/XBL_bindings" title="en/CSS/Getting_Started/XBL_bindings">XBL bindings</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/XUL_user_interfaces" title="en/CSS/Getting_Started/XUL_user_interfaces">XUL user interfaces</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/SVG_graphics" title="en/CSS/Getting_Started/SVG_graphics">SVG graphics</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/XML_data" title="en/CSS/Getting_Started/XML_data">XML data</a></strong></li>
+</ol>
+<p>{{ languages( { "en": "en/CSS/Getting_Started", "de": "de/CSS/Einführung", "es": "es/CSS/Primeros_pasos", "fr": "fr/CSS/Premiers_pas", "it": "it/Conoscere_i_CSS", "ja": "ja/CSS/Getting_Started", "nl": "nl/CSS/Voor_Beginners", "pl": "pl/CSS/Na_pocz\u0105tek", "pt": "pt/CSS/Como_come\u00e7ar", "zh-cn": "cn/CSS/\u5f00\u59cb" } ) }}</p>
diff --git a/files/es/orphaned/web/css/rtl/index.html b/files/es/orphaned/web/css/rtl/index.html
new file mode 100644
index 0000000000..6497cf094d
--- /dev/null
+++ b/files/es/orphaned/web/css/rtl/index.html
@@ -0,0 +1,23 @@
+---
+title: rtl
+slug: orphaned/Web/CSS/rtl
+original_slug: Web/CSS/rtl
+---
+<h3 id="Sumario" name="Sumario"> Sumario </h3>
+<p>El valor <i>rtl</i> es el valor que debe usarse para la propiedad CSS:direction si queremos escribir en lenguas táles como el Hebreo o el Árabe. El nombre viene de las iniciales de las palabras en inglés: Right To Left, que indican que el texto y otros elementos se han de representar de derecha a izquierda.
+</p><p><br>
+</p>
+<h3 id="Ejemplos" name="Ejemplos"> Ejemplos </h3>
+<pre class="eval">div {
+   position: absolute;
+   right: 20px;
+   height: 200px;
+   border: 1px solid #000;
+   direction: rtl;
+}
+</pre>
+<p><br>
+</p>
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n"> Ver también </h3>
+<p>{{ Cssxref("direction") }}, {{ Cssxref("ltr") }}
+</p>
diff --git a/files/es/orphaned/web/guide/html/introduction_alhtml_clone/index.html b/files/es/orphaned/web/guide/html/introduction_alhtml_clone/index.html
new file mode 100644
index 0000000000..f5f733a71d
--- /dev/null
+++ b/files/es/orphaned/web/guide/html/introduction_alhtml_clone/index.html
@@ -0,0 +1,173 @@
+---
+title: Introducción al HTML
+slug: orphaned/Web/Guide/HTML/Introduction_alhtml_clone
+tags:
+  - HTML
+original_slug: Web/Guide/HTML/Introduction_alhtml_clone
+---
+<p>Cuando miras una página web en el navegador, lo que ves a simple vista son palabras. Estas palabras normalmente tienen algunas características, como diferentes tamaños y colores. En algunos casos la página web puede mostrar imágenes o incluso vídeos. Otras veces, formularios donde puedes introducir o buscar información, o personalizar la apariencia de la página que estás viendo. La página también puede contener animaciones y contenidos que cambian mientras el resto de la página se mantiene sin cambios.</p>
+
+<p>Varias tecnologías (como <a href="/en-US/docs/CSS" title="CSS">CSS</a>, <a href="/en-US/docs/JavaScript/About_JavaScript" title="JavaScript/About_JavaScript">JavaScript</a>, <a href="/en-US/docs/Scripting_Plugins/Adobe_Flash" title="Scripting_Plugins/Adobe_Flash">Flash</a>, <a href="/en-US/docs/AJAX" title="AJAX">AJAX</a>, <a href="/en-US/docs/JSON" title="JSON">JSON</a>) pueden usarse para definir los elementos que componen una página web. Sin embargo, en el nivel más bajo, una página web se define usando <a href="/en-US/docs/HTML" title="HTML"><strong>HTML</strong></a> (<strong>HyperText Markup Language)</strong>. Sin HTML, no habría páginas web.</p>
+
+<p>Este artículo proporciona una introducción al HTML. Si alguna vez te has preguntado qué ocurre detrás de tu navegador web, este artículo es el mejor lugar para empezar a aprender.</p>
+
+<h2 id="Una_breve_historia_del_HTML">Una breve historia del HTML</h2>
+
+<p>A finales de la década de los 80s, <a href="http://www.w3.org/People/Berners-Lee/" title="http://www.w3.org/People/Berners-Lee/">Tim Berners-Lee</a> estuvo trabajando como físico en <a href="http://public.web.cern.ch/public/" title="http://public.web.cern.ch/public/">CERN</a> (las siglas inglesas de la Organización Europea para la Investigación Nuclear). Ideó un sistema para que los científicos pudieran compartir documentos a través de internet. Antes de su invención, las comunicaciones por Internet sólo permitían transmitir texto plano, empleando tecnologías como el email, <a href="http://en.wikipedia.org/wiki/Ftp" title="http://en.wikipedia.org/wiki/Ftp">FTP</a> (File Transfer Protocol), y <a href="http://en.wikipedia.org/wiki/Usenet" title="http://en.wikipedia.org/wiki/Usenet">Usenet</a>- tecnología en la que se basan los foros de internet. La invención del HTML permitió el uso de un modelo de contenido almacenado en un servidor central, que podía ser mostrado en un terminal local mediante un navegador. Esto simplificó el acceso al contenido y habilitó la posibilidad de mostrar contenido "enriquecido" (como un sofisticado texto formateado y visualización de imagenes).</p>
+
+<h2 id="¿Qué_es_el_HTML">¿Qué es el HTML?</h2>
+
+<p>HTML es un <strong>lenguaje de etiquetas</strong>. Indica al navegador como tiene que mostrar el contenido. El HTML separa el "contenido" (palabras, imágenes, audio, video, etc.) de la "presentación" (la definición del tipo de contenido y las instrucciones de cómo esos contenidos tienen que mostrarse). El HTML emplea un conjunto de elementos predefinidos que permiten identificar los distintos tipos de elementos. Estos elementos contienen una o más etiquetas que contienen o expresan el contenido. Estas etiquetas suelen ir encapsuladas entre los símbolos &lt;&gt;, y las etiquetas de cierre (que indican el final de un determinado contenido) están precedidas por una barra /.</p>
+
+<p>Por ejemplo, el elemento párrafo consiste en una etiqueta de inicio como esta "&lt;p&gt;" y una de cierre "&lt;/p&gt;". El siguiente ejemplo muestra un párrafo que está contenido dentro del elemento párrafo en HTML:</p>
+
+<div id="Spl1">
+<pre class="brush:html;">&lt;p&gt;Mi perro odia el pescado.&lt;/p&gt;</pre>
+</div>
+
+<p>Cuando este contenido se muestra en una página web, mediante un navegador, aparece así:</p>
+
+<p>{{ EmbedLiveSample("Spl1", 400, 50) }}</p>
+
+<p>El navegador emplea las etiquetas como guías para saber cómo debe ser mostrado el contenido que hay dentro de dichas etiquetas.</p>
+
+<p>Los elementos que contienen contenidos, normalmente suelen contener también otros elementos. Por ejemplo, el elemento énfasis (etiqueta &lt;em&gt;) puede estar dentro del elemento párrafo:</p>
+
+<div id="Spl2">
+<pre class="brush:html;">&lt;p&gt;Mi perro &lt;em&gt;odia&lt;/em&gt; el pescado.&lt;/p&gt;</pre>
+</div>
+
+<p>Cuando se muestre se verá del siguiente modo:</p>
+
+<p>{{ EmbedLiveSample("Spl2", 400, 50) }}</p>
+
+<p>Algunos elementos no contienen otros elementos.  Como es el caso de la etiqueta imagen ("&lt;img&gt;") que simplemente especifica el nombre del archivo que contiene la imagen como atributo:</p>
+
+<pre class="brush:html;">&lt;img src="smileyface.jpg"&gt;</pre>
+
+<p>En ocasiones, suele ponerse una barra "/" al final de la etiqueta, justo antes del cierre de la misma "&gt;" para indicar el final de la misma "/&gt;". Aunque se trata de algo opcional en HTML, en <a href="/en-US/docs/XHTML" title="XHTML">XHTML</a> es obligatoria (que es un lenguaje que permite una forma de poder implementar XML en los elementos del HTML).</p>
+
+<p>El resto de este artículo describe con un mayor detalle los conceptos descritos en esta sección. Además, si quieres ver HTML en acción, pásate por <a href="http://thimble.webmaker.org/en-US/projects/wrangler/edit" title="http://thimble.webmaker.org/en-US/projects/wrangler/edit">Mozilla Thimble</a>, que es un editor online  interactivo que enseña cómo escribir HTML. Además, en el <a href="/en-US/docs/HTML/HTML_Elements" title="HTML/HTML_Elements">HTML Elements</a> podrás ver una lista de los elementos HTML disponibles, así como una descripción de los mismos y el uso de cada uno de ellos.</p>
+
+<h2 id="Elementos_—_los_bloques_básicos_de_construcción">Elementos — los bloques básicos de construcción</h2>
+
+<p>El HTML consiste en una serie de elementos. Los Elementos definen el significado <strong>semántico</strong> del contenido. Todos los Elementos están incluídos entre dos grandes etiquetas, que a su vez contienen otras etiquetas. Por ejemplo, el elemento "&lt;p&gt;" indica un párrafo; el elemento "&lt;img&gt;" indica una imagen. Mira la página <a href="/en-US/docs/HTML/Element" title="HTML/Element">HTML Elements</a> para ver una lista completa de todos los elementos.</p>
+
+<p>Algunos elementos tienen un significado muy preciso, como "esto es una imagen", "esto es un encabezado" o "esto es una lista ordenada". Otros elementos resultan menos específicos, como "esto es una sección de una página" o "esto es parte de un texto". Finalmente otros elementos son usados por razones técnicas, como "esto es la información identificativa de la página que no debe ser mostrada". De un modo y otro, todos los elementos del HTML tienen un determinado valor semántico.</p>
+
+<p>Muchos elementos contienen otros elementos, formando una estructura jerárquica. Un ejemplo simple, pero completo de una página web sería este:</p>
+
+<pre class="brush:html;">&lt;html&gt;
+  &lt;body&gt;
+
+    &lt;p&gt;Mi perro &lt;em&gt;odia&lt;/em&gt; el pescado.&lt;/p&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>Como puedes ver, los elementos &lt;html&gt; encierran el resto del documento, y el elemento &lt;body&gt; encierra el contenido de la página. Esta estructura crece con las ramas de un árbol, donde los elementos &lt;body&gt; y &lt;p&gt; son las ramas que crecen del tronco que es &lt;html&gt;. Esta estructura jerárquica es lo que se denomina <strong>DOM</strong>: siglas inglesas del Documento Objeto Modelo (<strong>Document Object Model)</strong>.</p>
+
+<h2 id="Etiquetas">Etiquetas</h2>
+
+<p>Los documentos HTML están escritos en texto plano. Pueden ser escritos mediante editores de texto capaces de guardar contenido de texto plano (aunque la mayor parte de los creadores de código HTML prefieren editores especializados que resaltan las partes de código propias de la sintaxis del HTML y muestran el DOM). Los nombres de las Etiquetas, pueden escribirse en mayúsculas o en minúsculas. Aunque, el <a href="http://www.w3.org/" title="http://www.w3.org/">W3C</a> (Asociación Global que vela por mantener los estándares HTML) recomiendan usar minúsculas (y además el <a href="/en-US/docs/XHTML" title="XHTML">XHTML</a> requiere de las minúsculas).</p>
+
+<p>El código HTML contenido entre los signos de menor que ("&lt;") al comienzo y mayor que ("&gt;") al final, tienen un significado especial. Es lo que denominamos etiquetas. He aquí un ejemplo sencillo:</p>
+
+<pre class="brush: xml">&lt;p&gt;Esto es texto dentro de un párrafo.&lt;/p&gt;
+</pre>
+
+<p>En este ejemplo hay una etiqueta de comienzo y otra de cierre. Las etiquetas de cierre son las mismas que las etiquetas de comienzo sólo que contienen una barra justo después del signo menor que. Muchos elementos de HTML se escriben empleando las dos etiquetas de comienzo y final. Las etiquetas de comiezo y final de un elemento deben estar adecuadamente anidadas, esto significa que las etiquetas de cierre deben escribirse en el orden inverso al de las etiquetas de inicio. La regla del anidamiento de etiquetas tiene que cumplirse de forma escrupulosa para poder escribir <strong>código válido</strong>.</p>
+
+<p>Esto es un ejemplo de <em>código válido</em>:</p>
+
+<pre class="brush: xml">&lt;em&gt;Me &lt;strong&gt;refiero&lt;/strong&gt; a eso&lt;/em&gt;.
+</pre>
+
+<p>Esto es un ejemplo de <em>código inválido</em>:</p>
+
+<pre class="brush: xml">Invalido: &lt;em&gt;Me &lt;strong&gt;refiero&lt;/em&gt; a eso&lt;/strong&gt;.</pre>
+
+<p>Observa que en el ejemplo válido, la etiqueta de cierre para el elemento anidado está situada antes de la etiqueta de cierre del elemento que la contenedor.</p>
+
+<div class="note">
+<p>Hasta la adopción de las reglas revisadas del HTML5, los navegadores no interpretaban los códigos no válidos del mismo modo y provocaban distintos resultados cuando se encontraban con estas partes de código. Los navegadores eran tolerantes con los autores de código Web, pero por desgracia no todos de la misma forma, llevando a situaciones impredecibles a la hora de interpretar códigos no válidos de HTML. Pero esos días han acabado tras la última evolución de los navegadores como Internet Explorer 10, Firefox 4, Opera 11.60, Chrome 18 o Safari 5, a medida que han implementado las nuevas normas de interpretación de código HTML no válido. Aquí puede ver el resultado de un código invalido para el mismo arbol DOM <a class="external" href="http://arstechnica.com/open-source/news/2011/11/a-look-at-the-state-of-html5-parsing-and-the-opera-1160-beta.ars" title="http://arstechnica.com/open-source/news/2011/11/a-look-at-the-state-of-html5-parsing-and-the-opera-1160-beta.ars">en todos los navegadores modernos</a>.</p>
+</div>
+
+<p>Algunos elementos no contienen texto o ningún otro elemento. Es lo que se denominan elementos vacíos y no necesitan etiquetas de cierre. Este es un ejemplo:</p>
+
+<pre class="brush: xml">&lt;img src="smileyface.jpg"&gt;</pre>
+
+<p>Mucha gente marca los elementos vacíos usando una barra al final de la etiqueta, justo antes del simbolo mayor que (necesario en los códigos de XHTML).</p>
+
+<pre class="brush: xml">&lt;img src="smileyface.jpg" /&gt;</pre>
+
+<p>En HTML esta barra no aporta ninguna funcionalidad técnica y su uso es solamente una elección de estilo.</p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>La etiqueta de comienzo puede contener información adicional, tal y como puede verse en el siguiente ejemplo. Dicha información es lo que se conoce como <strong>atributos</strong>. Los atributos suelen consistir en dor partes:</p>
+
+<ul>
+ <li>Un atributo <strong>nombre </strong>(name).</li>
+ <li>Un atributo <strong>valor</strong> (value).</li>
+</ul>
+
+<p>Algunos atributos sólo pueden tener un único valor. Son atributos <strong>Booleanos</strong> y pueden ser incluidos para especificar el nombre del atributo, o dejar su valor vacío. Así los siguientes tres ejemplos tienen el mismo significado:</p>
+
+<pre class="brush: xml">&lt;input required="required"&gt;
+
+&lt;input required=""&gt;
+
+&lt;input required&gt;
+</pre>
+
+<p>Los valores de los atributos que constan de una sola palabra o un número se pueden escribir tal cual, pero en cuanto hay dos o más cadenas de caracteres en el valor, éstos deben escribirse entre comillas. Están permitidas tanto las comillas simples ('), como las comillas dobles (") aunque muchos desarrolladores prefieren utilizar siempre comillas simples para que el código sea menos ambiguo para la vista y para evitar errores. El siguiente es semejante error..:Attribute values that consist of a single word or number may be written as they are, but as soon as there are two or more strings of characters in the value, it must be written within quotation marks. Both single quotes (') and double quotes (") are allowed. Many developers prefer to always use quotes to make the code less ambiguous to the eye and to avoid mistakes. El siguiente código sería un error:</p>
+
+<pre class="brush: xml">&lt;p class=foo bar&gt; (Ten cuidado, esto probablemente no quiere decir lo que piensas que significa.)</pre>
+
+<p>En este ejemplo suponemos que el valor del atributo es "foo bar" pero al no haber comillas en el código se interpreta como si se hubiera escrito así:</p>
+
+<pre class="brush: xml">&lt;p class="foo" bar=""&gt;</pre>
+
+<h2 id="Nombre_de_caracteres_referenciados">Nombre de caracteres referenciados</h2>
+
+<p>Los<strong> Caraceteres Referenciados </strong> (a veces llamados<em> entidades) </em>son combinaciones de caracteres que sirven para mostrar en el navegador símbolos que tienen un significado especial en el código HTML. Por ejemplo, HTML interpreta que el símbolo menor que y mayor que son delimitadores de una etiqueta. Si quieres que estos simbolos sean mostrados en el contenido del texto, debemos usar los nombres de referencia de estos caracteres. Aquí están los cuatro caracteres referenciados más comunes, que no estaría de más que memorizases:</p>
+
+<ul>
+ <li><code>&amp;gt;</code> representa el carater mayor que (<code>&gt;</code>)</li>
+ <li><code>&amp;lt;</code> representa el caracter menor que (<code>&lt;</code>)</li>
+ <li><code>&amp;amp;</code> representa el caracter ampersand (<code>&amp;</code>)</li>
+ <li><code>&amp;quot;</code> representa el caracter de comillas dobles (")</li>
+</ul>
+
+<p>Hay <a class="external" href="http://www.w3.org/TR/2011/WD-html5-20110113/named-character-references.html" title="http://www.w3.org/TR/html5/named-character-references.html#named-character-references">muchas más entidades</a>, pero estas cuatro son las más importantes por que representan caracteres que tienen un significado especial en HTML.</p>
+
+<h2 id="Tipo_de_documento_y_comentarios">Tipo de documento y comentarios</h2>
+
+<p>Además de las etiquetas, el contenido y las entidades, un documento de HTML debe contener una declaración <strong>doctype</strong> en la primera línea. En el HTML actual esto se escribe del siguiente modo:</p>
+
+<pre class="brush: xml">&lt;!DOCTYPE html&gt;</pre>
+
+<p>El doctype tiene una historia larga y complicada, pero todo lo que necesitas saber ahora es que el doctype le dice al navegador que interprete el código HTML y CSS de acuerdo a los estándares web del <a href="http://www.w3.org/" title="http://www.w3.org/">W3C</a> y que no trate de emular que se trata de un Internet Explorer de los 90's. (Consultar <a href="/en-US/docs/Quirks_Mode_and_Standards_Mode" title="Mozilla's Quirks Mode">peculiaridades</a>.)</p>
+
+<p>HTML tiene un mecanismo para poder introducir <strong>comentarios</strong> al código que no serán mostrados en la página cuando esta sea interpretada o leída por un navegador web. Esto suele emplearse para añadir explicaciones al código, o dejar notas para explicar a otras personas cómo trabaja el código de la página, o simplemente para dejar recordatorios para uno mismo. Los comentarios en HTML están contenidos entre los siguientes símbolos:</p>
+
+<pre class="brush: xml">&lt;!-- Esto es un comentario de texto --&gt;</pre>
+
+<h2 id="Un_pequeño_documento_pero_completo">Un pequeño documento pero completo</h2>
+
+<p>Colocando todas estas explicaciones juntas, aquí os dejamos un pequeño ejemplo de un documento HTML completo. Puedes copiar este código en un editor de textos, guardarlo como <em>myfirstdoc.html</em> y cargarlo en un navegador. Asegurate de estar usando los códigos de caracteres UTF-8. Dado que este documento no utiliza estilos (CSS) su apariencia será muy plana, pero sólo se trata de un pequeño comienzo.</p>
+
+<pre class="brush: xml">&lt;!DOCTYPE html&gt;
+&lt;html lang="en"&gt;
+&lt;head&gt;
+  &lt;meta charset="utf-8" /&gt;
+  &lt;title&gt;A tiny document&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+  &lt;h1&gt;Main heading in my document&lt;/h1&gt;
+  &lt;!-- Note that it is "h" + "1", not "h" + the letter "one" --&gt;
+  &lt;p&gt;Loook Ma, I am coding &lt;abbr title="Hyper Text Markup Language"&gt;HTML&lt;/abbr&gt;.&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
diff --git a/files/es/orphaned/web/html/element/command/index.html b/files/es/orphaned/web/html/element/command/index.html
new file mode 100644
index 0000000000..da926bfb8f
--- /dev/null
+++ b/files/es/orphaned/web/html/element/command/index.html
@@ -0,0 +1,153 @@
+---
+title: <command>
+slug: orphaned/Web/HTML/Element/command
+tags:
+  - HTML
+  - Obsoleto
+translation_of: Web/HTML/Element/command
+original_slug: Web/HTML/Elemento/command
+---
+<div>{{obsolete_header()}}</div>
+
+<div class="note">
+<p><span style="font-size: 14px; line-height: 21px;"><strong>Nota: </strong>El elemento <code>command</code> ha sido removido de </span>{{Gecko("24.0")}}  en favor del elemento {{HTMLElement("menuitem")}}  . Firefox nunca ha soportado este elemento <code>command , </code>y la implementación existente de la interface DOM  {{domxref("HTMLCommandElement")}} ha sido removida de  <a href="/en-US/docs/Site_Compatibility_for_Firefox_24">Firefox 24</a>.</p>
+</div>
+
+<h2 id="Resumen_de_el_catalogo">Resumen de el catalogo</h2>
+
+<pre>&lt;command function="About live stream"&gt;</pre>
+
+<h3 class="brush: html" id="sect1"></h3>
+
+<h4 id="El_elemento_command_representa_un_comando_que_el_usuario_puede_invocar_.">El elemento <code>command </code>representa un comando que el usuario puede invocar .</h4>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td>Contenido dinámico , contenido estático de texto, contenido de metadata .</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno , es un {{Glossary("empty element")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>La etiqueta de inicio es obligatoria , pero como es un elemento vacío , el uso de una etiqueta de cierre está prohibido . </td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos </th>
+   <td>Solamente {{HTMLElement("colgroup")}} ,aunque puede ser definido implícitamente ya que su etiqueta de inicio no es obligatoria .El  {{HTMLElement("colgroup")}} no debe de tener un {{HTMLElement("span")}} como hijo .</td>
+  </tr>
+  <tr>
+   <th scope="row">Interface DOM </th>
+   <td>{{domxref("HTMLCommandElement")}} {{ obsolete_inline(24) }}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</p>
+
+<ul>
+ <li><code>command</code> o <code>empty</code> el cual es el estado por default e indica que este es un comando normal.</li>
+ <li><code>checkbox</code> indica que el comando puede ser alternado usando un checkbox.</li>
+ <li><code>radio</code> indica que el comando puede ser alternado usando un radiobutton.</li>
+</ul>
+
+<dl>
+ <dt>{{htmlattrdef("checked")}}</dt>
+ <dd>Indica si el comando es seleccionado . Debe de ser omitido al menos que el atributo <code>type </code>sea <code>checkbox </code>o <code>radio.</code></dd>
+ <dt>{{htmlattrdef("disabled")}}</dt>
+ <dd>Indica que el comando no está disponible .</dd>
+ <dt>{{htmlattrdef("icon")}}</dt>
+ <dd>Proporciona una imagen que representa el comando.</dd>
+ <dt>{{htmlattrdef("label")}}</dt>
+ <dd>El nombre del comando como se muestra al usuario .</dd>
+ <dt>{{htmlattrdef("radiogroup")}}</dt>
+ <dd>Este atributo proporciona el nombre del grupo de comandos , con un atributo  <code>type </code>de<code> tipo radio ,</code>que será alternado cuando el comando en sí mismo sea alternado . Este atributo debe de ser omitido al menos que el atributo <code>type </code>sea del tipo <code>radio .</code></dd>
+ <dt>{{htmlattrdef("type")}}</dt>
+ <dd>Este atributo indica el tipo de comando . Este puede ser uno de los siguientes tres valores :</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;command type="command" label="Save" icon="icons/save.png" onclick="save()"&gt;
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'commands.html', '&lt;command&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'semantics.html#the-command-element', '&lt;command&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico </td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>{{ HTMLRef }}</p>
diff --git a/files/es/orphaned/web/html/element/element/index.html b/files/es/orphaned/web/html/element/element/index.html
new file mode 100644
index 0000000000..ae980b7be1
--- /dev/null
+++ b/files/es/orphaned/web/html/element/element/index.html
@@ -0,0 +1,111 @@
+---
+title: <element>
+slug: orphaned/Web/HTML/Element/element
+translation_of: Web/HTML/Element/element
+original_slug: Web/HTML/Elemento/element
+---
+<div class="note">
+<p><strong>Nota:</strong> Este elemento ha sido borrado de la especificación. Mira <a href="http://lists.w3.org/Archives/Public/public-webapps/2013JulSep/0287.html">esto</a> para obtener más información desde el editor de la espeficicación.</p>
+</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El <strong>elemento <a href="/es/docs/Web/HTML">HTML</a> <code>&lt;element&gt;</code></strong> es utilizado para personalizar los elementos DOM.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido" title="HTML/Categorias_de_contenido">Categorias de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Modelo_de_contenido_transparente">Contenido transparente</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido Permitido</th>
+   <td>???</td>
+  </tr>
+  <tr>
+   <th scope="row">Etiquetas omitidas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>???</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos" name="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<p>El texto va aquí</p>
+
+<pre class="brush: html">Más texto va aquí.
+</pre>
+
+<h2 id="Especificaciones" name="Especificaciones">Especificaciones</h2>
+
+<p>El elemento <code>&lt;element&gt;</code> fue formulado en un borrador de la especificación de <a href="http://w3c.github.io/webcomponents/spec/custom/">elementos personalizados</a>, que se ha eliminado.</p>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad dee navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver También" name="Ver También">Ver También</h2>
+
+<ul>
+ <li>Web components: {{HTMLElement("content")}}, {{HTMLElement("shadow")}}, {{HTMLElement("template")}}</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/orphaned/web/html/elemento/etiqueta_personalizada_html5/index.html b/files/es/orphaned/web/html/elemento/etiqueta_personalizada_html5/index.html
new file mode 100644
index 0000000000..54edf8c8f8
--- /dev/null
+++ b/files/es/orphaned/web/html/elemento/etiqueta_personalizada_html5/index.html
@@ -0,0 +1,47 @@
+---
+title: Etiqueta Personalizada HTML5
+slug: orphaned/Web/HTML/Elemento/Etiqueta_Personalizada_HTML5
+original_slug: Web/HTML/Elemento/Etiqueta_Personalizada_HTML5
+---
+<p>Una etiqueta personalizada sencilla, es crear una plantilla de elementos.</p>
+
+<p>Un sencillo ejemplo donde con poner la etiqueta &lt;corazon&gt; nos muetra un corazon en el documento:</p>
+
+<h2 id="corazon.js" name="corazon.js">corazon.js</h2>
+
+<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
+
+<pre class="brush: js">function ini(){
+document.createElement('corazon');//creamos el elemento corazon
+var corazon = document.getElementsByTagName('corazon');//llamamos todos los elemento corazon del documento
+  var i;
+  for (i = 0; i &lt; corazon.length; i++) {//ejecuta acciones para esos elementos
+//creamos estilos para nuetras etiquetas
+    corazon[i].style.backgroundImage= "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAACaElEQVR4nO2by7WCMBCGKYECyJgSLIESLCEnwT0l0IElWIIlWIIlsAxhkxLuXZh45YrKI+QF/zmznvn+TAYYj0myadOmTSMkMUl5VuQN0JIDrVooTmLHLhxoxRElPCtyjgk2nZdjgnlW5BxRcs/Lzi2wMwdaNUBLnhW56ZzdArIib4GdBTApgP0MiBtHlMzJKTFJBWIHAew2MOdPC+wsEDsYwlbgiF2HFtBfVHEaC95CcRphdu8BtPi4nwz+VMRk8H9RDymoxcf9mBMf0hGT4MWOXQzCP6IBWr7L2wAtZ576226QmKSD4DkmWACrl4D/dCocaLVkTgFMfh3OEpN07n0fHE+DiiNKrOQEVn80QE15G4XcOwEf9+rOL9H2/TkRu/bCq8eNNXgVUhgceEPj5fEsMUldFOIwZMcANX1dF2W3C4BWf3ff1uDzK+5doIaQ62LcdAEmeJXtr6MBWiZLvfEFETt2Wev911EnYuHXXs9DJsLiW5iPsfYOqNc+A27WP4B8ihaxa2J46xNUtFCc9IeQ82JcxGOTLNY5CG9Pi5D1XYPO16C6BmvqAvmyJLW4l3MendPvrMXWsRV6vyJXVyHmV2P59ccZ9btAjCZ8h388FeLbEsnRP5hGZMJ4+IhMmA4fgQnz4QM2wRx8gCaYhw/IhOXgAzBheXiPTbAH76EJ9uE9MsEdvAcmuIfXcmCCP/BaFk3wD17Lggn+wmstaIL/8FoLmBAOvJZBE8KD1zJgQrjwWjNMCB9ea4IJ8cBrjTAhPnitASbEC6/1wYT44bV6TFgPvBbHBHOgFQdazfpz06ZNmzbN0C97EM/d8hW+4gAAAABJRU5ErkJggg==')";
+    corazon[i].style.position="relative";
+    corazon[i].style.display="block";
+    corazon[i].style.width="64px";
+    corazon[i].style.height="64px";
+  }
+}
+window.addEventListener('load',ini,false);//ejecuta la funcion ini al cargar el documento</pre>
+
+<p>Ahora solo llamamos a nuestro archivo corazon.js desde nuetro html y podremos usar libremente nuetra etiqueta &lt;corazon&gt; con la cual nos mostrara un corazon.</p>
+
+<h2 id="index.html" name="index.html">index.html</h2>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<p>&lt;!DOCTYPE html&gt;<br>
+ &lt;html&gt;<br>
+   &lt;head&gt;<br>
+     &lt;meta charset="utf-8"&gt;<br>
+     &lt;title&gt;Mi Etiqueta&lt;/title&gt;<br>
+     &lt;script src="corazon.js"  type="text/javascript"&gt;&lt;/script&gt;<br>
+   &lt;/head&gt;<br>
+   &lt;body&gt;<br>
+     &lt;corazon&gt;&lt;/corazon&gt;<br>
+   &lt;/body&gt;<br>
+ &lt;/html&gt;</p>
+
+<p> </p>
diff --git a/files/es/orphaned/web/html/elemento/tipos_de_elementos/index.html b/files/es/orphaned/web/html/elemento/tipos_de_elementos/index.html
new file mode 100644
index 0000000000..a5d26e1fd9
--- /dev/null
+++ b/files/es/orphaned/web/html/elemento/tipos_de_elementos/index.html
@@ -0,0 +1,120 @@
+---
+title: Tipos de elementos
+slug: orphaned/Web/HTML/Elemento/Tipos_de_elementos
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+original_slug: Web/HTML/Elemento/Tipos_de_elementos
+---
+<p>Los elementos se pueden agrupan de varias manera, aquí ofrecenos las siguientes: formal, estructural y funcional.</p>
+
+<h2 id="Seg.C3.BAn_el_doctype" name="Seg.C3.BAn_el_doctype">Según el doctype</h2>
+
+<p>Todo documento HTML debe tener un doctype, en el doctype se indica la dtd que se aplica al documento. La dtd es un archivo que, entre otras cosas, indica qué elementos pueden usarse en el documento, o cuales son sus atributos.</p>
+
+<p>Los doctypes válidos en HTML 4.01 son tres:</p>
+
+<h3 id="Para_marcos" name="Para_marcos">Para marcos</h3>
+
+<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
+       "<a class="external" href="http://www.w3.org/TR/html4/frameset.dtd" rel="freelink">http://www.w3.org/TR/html4/frameset.dtd</a>"&gt;
+</pre>
+
+<p>Con este doctype pueden usarse todos los elementos del html.</p>
+
+<h3 id="De_transici.C3.B3n" name="De_transici.C3.B3n">De transición</h3>
+
+<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+       "<a class="external" href="http://www.w3.org/TR/html4/loose.dtd" rel="freelink">http://www.w3.org/TR/html4/loose.dtd</a>"&gt;
+</pre>
+
+<p>Pueden usarse todos los elementos <strong>menos</strong> los especificos de marcos que son: <a href="/es/docs/HTML/Elemento/frame">frame</a> <a href="/es/docs/HTML/Elemento/frameset">frameset</a></p>
+
+<h3 id="Estrictos" name="Estrictos">Estrictos</h3>
+
+<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+       "<a class="external" href="http://www.w3.org/TR/html4/strict.dtd" rel="freelink">http://www.w3.org/TR/html4/strict.dtd</a>"&gt;
+</pre>
+
+<p>Con este doctype pueden usarse todos los elementos <strong>menos</strong> los específicos de los marcos: <a href="/es/docs/HTML/Elemento/frame">frame</a> <a href="/es/docs/HTML/Elemento/frameset">frameset</a> y los desaprobados: <a href="/es/docs/HTML/Elemento/applet">applet</a> <a href="/es/docs/HTML/Elemento/basefont">basefont</a> <a href="/es/docs/HTML/Elemento/center">center</a> <a href="/es/docs/HTML/Elemento/dir">dir</a> <a href="/es/docs/HTML/Elemento/font">font</a> <a href="/es/docs/HTML/Elemento/isindex">isindex</a> <a href="/es/docs/HTML/Elemento/menu">menu</a> <a href="/es/docs/HTML/Elemento/s">s</a> <a href="/es/docs/HTML/Elemento/strike">strike</a> <a href="/es/docs/HTML/Elemento/u">u</a></p>
+
+<h2 id="Seg.C3.BAn_su_estructura" name="Seg.C3.BAn_su_estructura">Según su estructura</h2>
+
+<p>Se dividen en tres grupos: básicos, de cabecera y de cuerpo.</p>
+
+<h3 id="Los_elementos_b.C3.A1sicos" name="Los_elementos_b.C3.A1sicos">Los elementos básicos</h3>
+
+<p>Son los elemento que conforman la columna vertebral de un documento html:</p>
+
+<dl>
+ <dt>Para un documento normal</dt>
+ <dd><a href="/es/docs/HTML/Elemento/html">html</a> <a href="/es/docs/HTML/Elemento/head">head</a> <a href="/es/docs/HTML/Elemento/body">body</a></dd>
+</dl>
+
+<dl>
+ <dt>para uno de marcos</dt>
+ <dd><a href="/es/docs/HTML/Elemento/html">html</a> <a href="/es/docs/HTML/Elemento/head">head</a> <a href="/es/docs/HTML/Elemento/frameset">frameset</a> <a href="/es/docs/HTML/Elemento/frame">frame</a></dd>
+</dl>
+
+<h3 id="De_cabecera" name="De_cabecera">De cabecera</h3>
+
+<p>Los de cabecera contienen la información necesaria para el correcto funcionamiento del documento.</p>
+
+<dl>
+ <dt>Elementos de cabecera son</dt>
+ <dd> </dd>
+ <dd>El obligatorio: <a href="/es/docs/HTML/Elemento/title">title</a></dd>
+ <dd>Los opcionales: <a href="/es/docs/HTML/Elemento/base">base</a> <a href="/es/docs/HTML/Elemento/meta">meta</a> <a href="/es/docs/HTML/Elemento/link">link</a></dd>
+ <dd>Los mixtos: <a href="/es/docs/HTML/Elemento/style">style</a> <a href="/es/docs/HTML/Elemento/script">script</a> <a href="/es/docs/HTML/Elemento/object">object</a> y el transicional: <a href="/es/docs/HTML/Elemento/isindex">isindex</a>. Estos elementos pueden actuar como elementos de cabecera y de cuerpo.</dd>
+</dl>
+
+<h3 id="De_cuerpo" name="De_cuerpo">De cuerpo</h3>
+
+<p>Son los que estructuran el contenido del documento, pueden clasificarse en dos o tres grupos, los que forman parte del flujo del documento, estos son los elementos en bloque y los elementos en línea; y los que no forman parte directa del flujo.</p>
+
+<h4 id="En_bloque" name="En_bloque">En bloque</h4>
+
+<dl>
+ <dt>Elementos en bloque son</dt>
+ <dd> </dd>
+ <dd><a href="/es/docs/HTML/Elemento/p">p</a> <a href="/es/docs/HTML/Elemento/dl">dl</a> <a href="/es/docs/HTML/Elemento/div">div</a> <a href="/es/docs/HTML/Elemento/address">address</a> <a href="/es/docs/HTML/Elemento/hr">hr</a> <a href="/es/docs/HTML/Elemento/blockquote">blockquote</a> <a href="/es/docs/HTML/Elemento/form">form</a> <a href="/es/docs/HTML/Elemento/table">table</a> <a href="/es/docs/HTML/Elemento/fieldset">fieldset</a> <a href="/es/docs/HTML/Elemento/pre">pre</a> <a href="/es/docs/HTML/Elemento/noscript">noscript</a> <a href="/es/docs/HTML/Elemento/noframes">noframes</a> Y los transicionales: <a href="/es/docs/HTML/Elemento/center">center</a> <a href="/es/docs/HTML/Elemento/isindex">isindex</a></dd>
+ <dd>Los elementos de encabezados: <a href="/es/docs/HTML/Elemento/h1">h1</a> <a href="/es/docs/HTML/Elemento/h2">h2</a> <a href="/es/docs/HTML/Elemento/h3">h3</a> <a href="/es/docs/HTML/Elemento/h4">h4</a> <a href="/es/docs/HTML/Elemento/h5">h5</a> <a href="/es/docs/HTML/Elemento/h6">h6</a></dd>
+ <dd>los elementos para listas: <a href="/es/docs/HTML/Elemento/ul">ul</a> y <a href="/es/docs/HTML/Elemento/ol">ol</a>. Y los transicionales: <a href="/es/docs/HTML/Elemento/dir">dir</a> <a href="/es/docs/HTML/Elemento/menu">menu</a></dd>
+</dl>
+
+<h4 id="En_l.C3.ADnea" name="En_l.C3.ADnea">En línea</h4>
+
+<dl>
+ <dt>Elementos en línea son</dt>
+ <dd> </dd>
+ <dd>Los elementos de frase: <a href="/es/docs/HTML/Elemento/abbr">abbr</a> <a href="/es/docs/HTML/Elemento/acronym">acronym</a> <a href="/es/docs/HTML/Elemento/cite">cite</a> <a href="/es/docs/HTML/Elemento/code">code</a> <a href="/es/docs/HTML/Elemento/em">em</a> <a href="/es/docs/HTML/Elemento/strong">strong</a> <a href="/es/docs/HTML/Elemento/dfn">dfn</a> <a href="/es/docs/HTML/Elemento/kbd">kbd</a> <a href="/es/docs/HTML/Elemento/samp">samp</a> <a href="/es/docs/HTML/Elemento/var">var</a></dd>
+ <dd>Los elementos de estilo de fuente: <a href="/es/docs/HTML/Elemento/b">b</a> <a href="/es/docs/HTML/Elemento/big">big</a> <a href="/es/docs/HTML/Elemento/i">i</a> <a href="/es/docs/HTML/Elemento/small">small</a> <a href="/es/docs/HTML/Elemento/tt">tt</a> y los desaprobados: <a href="/es/docs/HTML/Elemento/u">u</a> <a href="/es/docs/HTML/Elemento/s">s</a> <a href="/es/docs/HTML/Elemento/strike">strike</a></dd>
+ <dd>Los elementos especiales: <a href="/es/docs/HTML/Elemento/a">a</a> <a href="/es/docs/HTML/Elemento/bdo">bdo</a> <a href="/es/docs/HTML/Elemento/br">br</a> <a href="/es/docs/HTML/Elemento/img">img</a> <a href="/es/docs/HTML/Elemento/map">map</a> <a href="/es/docs/HTML/Elemento/object">object</a> <a href="/es/docs/HTML/Elemento/q">q</a> <a href="/es/docs/HTML/Elemento/script">script</a> <a href="/es/docs/HTML/Elemento/span">span</a> <a href="/es/docs/HTML/Elemento/sub">sub</a> <a href="/es/docs/HTML/Elemento/sup">sup</a> y los desaprobados: <a href="/es/docs/HTML/Elemento/applet">applet</a> <a href="/es/docs/HTML/Elemento/font">font</a> <a href="/es/docs/HTML/Elemento/basefont">basefont</a> <a href="/es/docs/HTML/Elemento/iframe">iframe</a></dd>
+ <dd>Los elementos de controles de formulario: <a href="/es/docs/HTML/Elemento/button">button</a> <a href="/es/docs/HTML/Elemento/input">input</a> <a href="/es/docs/HTML/Elemento/label">label</a> <a href="/es/docs/HTML/Elemento/select">select</a> <a href="/es/docs/HTML/Elemento/textarea">textarea</a></dd>
+</dl>
+
+<h4 id="Ni_en_bloque_ni_en_l.C3.ADnea" name="Ni_en_bloque_ni_en_l.C3.ADnea">Ni en bloque ni en línea</h4>
+
+<p>Son los elementos que no forman parte del flujo por que son elementos subordinados a otros elementos.</p>
+
+<dl>
+ <dt>Elementos subordinados son</dt>
+ <dd> </dd>
+ <dd>Subordinados a table: <a href="/es/docs/HTML/Elemento/caption">caption</a> <a href="/es/docs/HTML/Elemento/tr">tr</a> <a href="/es/docs/HTML/Elemento/th">th</a> <a href="/es/docs/HTML/Elemento/td">td</a> <a href="/es/docs/HTML/Elemento/thead">thead</a> <a href="/es/docs/HTML/Elemento/tbody">tbody</a> <a href="/es/docs/HTML/Elemento/tfoot">tfoot</a> <a href="/es/docs/HTML/Elemento/col">col</a> <a href="/es/docs/HTML/Elemento/colgroup">colgroup</a></dd>
+ <dd>Subordinados de listas: <a href="/es/docs/HTML/Elemento/li">li</a> <a href="/es/docs/HTML/Elemento/dd">dd</a> <a href="/es/docs/HTML/Elemento/dl">dl</a> Subordinados a select son: <a href="/es/docs/HTML/Elemento/optgroup">optgroup</a> <a href="/es/docs/HTML/Elemento/option">option</a></dd>
+ <dd>Por último, <a href="/es/docs/HTML/Elemento/area">area</a> subordinado a map. <a href="/es/docs/HTML/Elemento/param">param</a> subordinado a object. y <a href="/es/docs/HTML/Elemento/legend">legend</a> subordinado a fieldset.</dd>
+</dl>
+
+<h4 id="En_bloque_y_en_l.C3.ADnea" name="En_bloque_y_en_l.C3.ADnea">En bloque y en línea</h4>
+
+<p>Los elementos <a href="/es/docs/HTML/Elemento/ins">ins</a> y <a href="/es/docs/HTML/Elemento/del">del</a> pueden ser elementos en línea o en bloque según convenga.</p>
+
+<h2 id="Seg.C3.BAn_su_funci.C3.B3n" name="Seg.C3.BAn_su_funci.C3.B3n">Según su función</h2>
+
+
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga carencias y defectos. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>Cómo ayudar</a>.</p>
+</div>
diff --git a/files/es/orphaned/web/html/global_attributes/dropzone/index.html b/files/es/orphaned/web/html/global_attributes/dropzone/index.html
new file mode 100644
index 0000000000..205236c73b
--- /dev/null
+++ b/files/es/orphaned/web/html/global_attributes/dropzone/index.html
@@ -0,0 +1,100 @@
+---
+title: dropzone
+slug: orphaned/Web/HTML/Global_attributes/dropzone
+tags:
+  - Atributos globales
+  - Experimental
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/dropzone
+original_slug: Web/HTML/Atributos_Globales/dropzone
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
+
+<p>El atributo global <strong>dropzone </strong>es un atributo enumerado que indica qué los tipos de contenido pueden ser soltados en un elemento , usando la <a href="/es/docs/DragDrop/Drag_and_Drop">API Drag and Drop</a> . Pueden tener los siguientes valores :</p>
+
+<ul>
+ <li>copy , indica que el soltado creará una copia del elemento que fue arrastrado .</li>
+ <li>move , indica que el elemento que fue arrastrado será movido a su nueva localización .</li>
+ <li>link, indica que creara un link para el dato arrastrado.</li>
+</ul>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "interaction.html#the-dropzone-attribute", "dropzone")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#the-dropzone-attribute", "dropzone")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de  {{SpecName('HTML WHATWG')}}, definición inicial .</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico </td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Cataracterística</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown}}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también </h2>
+
+<ul>
+ <li>Tos los atributos globales </li>
+</ul>
diff --git a/files/es/orphaned/web/javascript/reference/global_objects/array/prototype/index.html b/files/es/orphaned/web/javascript/reference/global_objects/array/prototype/index.html
new file mode 100644
index 0000000000..ed9861e62c
--- /dev/null
+++ b/files/es/orphaned/web/javascript/reference/global_objects/array/prototype/index.html
@@ -0,0 +1,189 @@
+---
+title: Array.prototype
+slug: orphaned/Web/JavaScript/Reference/Global_Objects/Array/prototype
+tags:
+  - Array
+  - Arreglo
+  - JavaScript
+  - Property
+  - Propiedad
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/prototype
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/prototype
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <strong><code>Array.prototype</code></strong> representa el prototipo del constructor {{jsxref("Array")}} y le permite agregar nuevas propiedades y métodos a todos los objetos Array.</p>
+
+<pre class="brush: js">// Si JavaScript no proporciona un método first() de forma nativa,
+// agrega un nuevo método que devuelve el primer elemento de una matriz.
+
+if (!Array.prototype.first) {
+  Array.prototype.first = function() {
+    return this[0];
+  }
+}
+</pre>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Las instancias {{jsxref("Array")}} heredan de <code>Array.prototype</code>. Al igual que con todos los constructores, puede cambiar el prototipo del constructor del objeto para realizar cambios en todas las instancias {{jsxref("Array")}} . Por ejemplo, puede agregar nuevos métodos y propiedades para extender todos los objetos <code>Array</code>. Esto se usa para {{Glossary("Polyfill", "polyfilling")}}, por ejemplo.</p>
+
+<p>Un hecho poco conocido: <code>Array.prototype</code> en sí es un {{jsxref("Array")}}:</p>
+
+<pre class="brush: js">Array.isArray(Array.prototype); // true</pre>
+
+<p>{{js_property_attributes(0, 0, 0)}}</p>
+
+<h2 id="Properties" name="Properties">Propiedades</h2>
+
+<dl>
+ <dt><code>Array.prototype.constructor</code></dt>
+ <dd>Especifica la función que crea el prototipo de un objeto.</dd>
+ <dt>{{jsxref("Array.prototype.length")}}</dt>
+ <dd>Refleja el número de elementos en un array.</dd>
+ <dt>{{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}}</dt>
+ <dd>Un símbolo que contiene nombres de propiedades para excluir de un ámbito vinculante <code><a href="/es/docs/Web/JavaScript/Reference/Statements/with">with</a></code>.</dd>
+</dl>
+
+<h2 id="Methods" name="Methods">Métodos</h2>
+
+<h3 id="Mutator_methods" name="Mutator_methods">Métodos de mutación</h3>
+
+<p>Estos métodos modifican el array:</p>
+
+<dl>
+ <dt>{{jsxref("Array.prototype.copyWithin()")}}</dt>
+ <dd>Copia una secuencia de elementos dentro del array.</dd>
+ <dt>{{jsxref("Array.prototype.fill()")}}</dt>
+ <dd>Rellena todos los elementos de un array desde un índice de inicio hasta un índice de fin con un valor determinado.</dd>
+ <dt>{{jsxref("Array.prototype.pop()")}}</dt>
+ <dd>Elimina el último elemento de un array y devuelve dicho elemento.</dd>
+ <dt>{{jsxref("Array.prototype.push()")}}</dt>
+ <dd>Añade uno o más elementos al final de un array y devuelve la nueva longitud del array.</dd>
+ <dt>{{jsxref("Array.prototype.reverse()")}}</dt>
+ <dd>Invierte el orden de los elementos de un array — el primero será el último y el último será el primero.</dd>
+ <dt>{{jsxref("Array.prototype.shift()")}}</dt>
+ <dd>Elimina el primer elemento de un array y devuelve dicho elemento.</dd>
+ <dt>{{jsxref("Array.prototype.sort()")}}</dt>
+ <dd>Ordena los elementos de un array y devuelve el array.</dd>
+ <dt>{{jsxref("Array.prototype.splice()")}}</dt>
+ <dd>Añade o elimina elementos de un array.</dd>
+ <dt>{{jsxref("Array.prototype.unshift()")}}</dt>
+ <dd>Añade uno o más elementos al principio del array y devuelve la nueva longitud del array.</dd>
+</dl>
+
+<h3 id="Accessor_methods" name="Accessor_methods">Métodos de consulta</h3>
+
+<p>Estos métodos no modifican el array y devuelven alguna representación del array.</p>
+
+<dl>
+ <dt>{{jsxref("Array.prototype.concat()")}}</dt>
+ <dd>Devuelve un nuevo array compuesto por este array unido con otro(s) array(s) y/o valor(es).</dd>
+ <dt>{{jsxref("Array.prototype.includes()")}}</dt>
+ <dd>Determina si un array contiene cierto elemento, devolviendo <code>true</code> o <code>false</code> apropiadamente.</dd>
+ <dt>{{jsxref("Array.prototype.indexOf()")}}</dt>
+ <dd>Devuelve el primer (menor) índice de un elemento dentro del array que sea igual al valor especificado, o -1 si no contiene dicho valor.</dd>
+ <dt>{{jsxref("Array.prototype.join()")}}</dt>
+ <dd>Une todos los elementos de un array en una cadena de texto.</dd>
+ <dt>{{jsxref("Array.prototype.lastIndexOf()")}}</dt>
+ <dd>Devuelve el último (mayor) índice de un elemento dentro del array que sea igual al valor especificado, o -1 si no contiene dicho valor.</dd>
+ <dt>{{jsxref("Array.prototype.slice()")}}</dt>
+ <dd>Extrae una sección de un array y devuelve un nuevo array.</dd>
+ <dt>{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}}</dt>
+ <dd>Devuelve el array literal que representa al propio array especificado; puedes usar este valor para crear un nuevo array. Reemplaza al método {{jsxref("Object.prototype.toSource()")}}.</dd>
+ <dt>{{jsxref("Array.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena de texto que representa el array y sus elementos. Reemplaza el método {{jsxref("Object.prototype.toString()")}}.</dd>
+ <dt>{{jsxref("Array.prototype.toLocaleString()")}}</dt>
+ <dd>Devuelve una cadena de texto localizada que representa el array y sus elementos. Reemplaza el método {{jsxref("Object.prototype.toLocaleString()")}}.</dd>
+</dl>
+
+<h3 id="Iteration_methods" name="Iteration_methods">Métodos de iteración</h3>
+
+<p>Muchos métodos toman como argumentos funciones que son llamadas mientras se procesa el array. Cuando estos métodos son llamados, la longitud (<code style="font-style: normal;">length</code>) del array es muestreado, y cualquier elemento añadido por encima de esta longitud dentro de la función (<span style="font-family: consolas,monaco,andale mono,monospace;">callback</span>) no es visitado. Otros cambios sobre el array (establecer el valor o eliminar un elemento) podría afectar el resultado de la operación si el método visita el elemento después. Mientras que el comportamiento especifico de estos métodos en muchos casos es bien definido, no deberías delegar sobre eso con la finalidad de no confundir a otros que podrían leer tu código. Si debes modificar el array, copialo en un nuevo array en su lugar.</p>
+
+<dl>
+ <dt>{{jsxref("Array.prototype.entries()")}}</dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los pares clave/valor para cada índice en el array.</dd>
+ <dt>{{jsxref("Array.prototype.every()")}}</dt>
+ <dd>Devuelve true si cada elemento en este array satisface la función de testeo proporcionada.</dd>
+ <dt>{{jsxref("Array.prototype.filter()")}}</dt>
+ <dd>Crea un nuevo array con todos los elementos de este array para los cuales la función de filtrado proporcionada devuelve true.</dd>
+ <dt>{{jsxref("Array.prototype.find()")}}</dt>
+ <dd>Devuelve el elemento hallado en el array si un elemento en el array satisface la función de testeo proporcionada, o <code>undefined</code> si no se halla ninguno.</dd>
+ <dt>{{jsxref("Array.prototype.findIndex()")}}</dt>
+ <dd>Devuelve el índice hallado en el array si un elemento en el array satisface la función de testeo proporcionada, o -1 si no se halla ninguno.</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("Array.prototype.forEach()")}}</dt>
+ <dd>Llama a una función para cada elemento del array.</dd>
+ <dt>{{jsxref("Array.prototype.keys()")}}</dt>
+ <dd>Devuelve un nuevo <code>Array Iterator</code> que contiene las claves para cada índice en el array.</dd>
+ <dt>{{jsxref("Array.prototype.map()")}}</dt>
+ <dd>Crea un nuevo array con el resultado de llamar a la función proporcionada sobre cada elemento de este array.</dd>
+ <dt>{{jsxref("Array.prototype.reduce()")}}</dt>
+ <dd>Aplica una función que recibe un acumulador y cada valor del array (de izquierda a derecha) para reducirlo a un único valor.</dd>
+ <dt>{{jsxref("Array.prototype.reduceRight()")}}</dt>
+ <dd>Aplica una función que recibe un acumulador y cada valor del array (de derecha a izquierda) para reducirlo a un único valor.</dd>
+ <dt>{{jsxref("Array.prototype.some()")}}</dt>
+ <dd>Devuelve true si al menos un elemento en este array satisface la función de testeo proporcionada.</dd>
+ <dt>{{jsxref("Array.prototype.values()")}}</dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array.</dd>
+ <dt>{{jsxref("Array.prototype.@@iterator()", "Array.prototype[@@iterator]()")}}</dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array.</dd>
+</dl>
+
+<h3 id="Generic_methods" name="Generic_methods">Métodos genéricos (no estándar)</h3>
+
+<p>Muchos métodos en el objeto Javascript Array son diseñados para ser generalmente llamados para todos los objetos que "parecen" Arrays. Es decir, pueden ser usados sobre cualquier objeto que tenga una propiedad longitud (<code style="font-style: normal;">length</code>), y puedan ser accedidos usando nombres de propiedades numéricos (como con la indexación <code><span style="font-family: consolas,monaco,andale mono,monospace;">array[5]</span></code>). Algunos métodos, tales como {{jsxref("Array.join", "join")}}, sólo leen la <code>longitud</code> y propiedades numéricas del objeto sobre el cual son llamados. Otros, como {{jsxref("Array.reverse", "reverse")}}, requieren que las propiedades numéricas del objeto y la <code>longitud</code> sean mutables; estos métodos, por tanto, no pueden ser llamados sobre objetos como {{jsxref("String")}}, los cuales no permiten que su longitud o propiedades numéricas sintetizadas sean establecidas.</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<p> </p>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.3.1', 'Array.prototype')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype', 'Array.prototype')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>
+    <p>Se agregaron los métodos <code>copyWithin()</code>, <code>fill()</code>, <code>entries()</code>, <code>keys()</code>, <code>values()</code>, <code>find()</code>, <code>findIndex()</code>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES7', '#sec-array.prototype', 'Array.prototype')}}</td>
+   <td>{{Spec2('ES7')}}</td>
+   <td>Se agregó el método <code>includes()</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.prototype")}}</div>
+
+<div id="compat-mobile"> </div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+ <li>{{jsxref("Function.prototype")}}</li>
+</ul>
diff --git a/files/es/orphaned/web/svg/svg_en_firefox_1.5/index.html b/files/es/orphaned/web/svg/svg_en_firefox_1.5/index.html
new file mode 100644
index 0000000000..363238cb7c
--- /dev/null
+++ b/files/es/orphaned/web/svg/svg_en_firefox_1.5/index.html
@@ -0,0 +1,61 @@
+---
+title: SVG en Firefox 1.5
+slug: orphaned/Web/SVG/SVG_en_Firefox_1.5
+tags:
+  - SVG
+  - Todas_las_Categorías
+original_slug: Web/SVG/SVG_en_Firefox_1.5
+---
+<p>
+<a href="es/Firefox_1.5">Firefox 1.5</a> marca la publicación del primer navegador de Mozilla que soporta el formato de <a class="external" href="http://www.w3.org/Graphics/SVG/">gráficos vectoriales escalables (SVG)</a>. El camino de este proyecto ha sido largo, nos satisface poner a disposición de los desarrolladores esta tecnologia y estamos impacientes por ver sus frutos. </p><p>Firefox SVG es un subconjunto de <a class="external" href="http://www.w3.org/TR/SVG11/">SVG 1.1</a>, pero no es ninguno de los perfiles oficiales (Tiny, Basic, Full). En este documento se puede encontrar una lista completa de los elementos que han sido implementados en Firefox 1.5. Además encontrará información sobre las limitaciones en su implementación.
+</p><p>La peculiar implementación que hemos realizado puede dificultar el creación de contenidos, le pedimos que tenga paciencia mientras trabajamos en la implementación completa de esta extensa especificación.
+</p><p>Mientras lee esto, usted puede preguntarse cuandos de estos detalles sobre de la implementación pueden haber cambiado. Por desgracia el <a class="external" href="http://www.mozilla.org/roadmap/gecko-1.9-roadmap.html">mapa de ruta actual</a> situa la publicación de Firefox con Gecko 1.9 en el primer trimestre de 2007. Sin embargo si usted desea comenzar a experimentar con las nuevas funcionalidades, tiene a su disposición en las <a class="external" href="http://www.mozilla.org/developer/#builds">nightly builds</a> las últimas evoluciones, y si lo desea puede consultar <a class="external" href="http://www.mozilla.org/projects/svg/status.html">la tabla actualizada</a> sobre la implementación de SVG en la versión de desarrollo. Como podreis comprobar, la cosa avanza a buen ritmo ☺.
+</p><p><br>
+</p>
+<h2 id="Performance" name="Performance"> Performance </h2>
+<p>Firefox usa el mismo motor de renderizado, <a class="external" href="http://cairographics.org/">cairo</a>, en todas las plataformas en las que navega. Por lo tanto sus características de interpretación serán similares. La Performance en linux es la más difícil de predecir, esto es debido a las distintas implementaciones que hacen los diversos servidores X de la extensión RENDER.
+</p><p>En Windows el renderizado de SVG es bastante más rápido que en otras plataformas.
+</p>
+<h2 id="Coordinate_range" name="Coordinate_range"> Coordinate range </h2>
+<p>Si tu contenido posee geometría con un gran rango de coordenadas, necesitarás tener cuidado con los problemas causados por el uso interno de cairo de una representación en punto fijo de 16.16 bit para sus cálculos. Cairo no clip primitives antes de la rasterización, por lo que las coordenadas finales tras la transformación que excedan el rango desde -32678 a 32677 causarán errores de renderizado y posiblemente un funcionamiento bastante lento.
+</p>
+<h2 id="Texto_en_Windows_98" name="Texto_en_Windows_98"> Texto en Windows 98 </h2>
+<p>Un lamentable efecto secundario de usar Cairo como backend de renderizado en Windows es que el renderizado del texto no funcionará en Windows 98. En realidad la cosa es aun peor, si aparece cualquier texto durante la visualización de contenidos SVG, todo el dibujo se parará.
+</p>
+<h2 id="Selecci.C3.B3n_de_fuente" name="Selecci.C3.B3n_de_fuente"> Selección de fuente </h2>
+<p>Si usted está familiarizado con CSS probablemente sabrá que puede especificar fuentes alternativas para las propiedades 'font' por si los glifos de una fuente concreta no estén disponibles. El actual motor de renderizado de SVG sólo tratará de usar la primera fuente especificada, y si esta no existe, usará una fuente del sistema. Las fuentes secundarias nunca son usadas, por ejemplo, font-family="Arial,LucidaSansUnicode" no generará una fuente LucidaSansUnicode, aun en el caso de que Arial no esté disponible.
+</p>
+<h2 id="Impresi.C3.B3n" name="Impresi.C3.B3n"> Impresión </h2>
+<p>Por desgracia, actualmente en la impresión no se aprovechan las propiedades vectoriales de SVG para generar una salida óptima, por contra, se renderiza según la resolución de la pantalla y luego la salida se hace como imagen.
+</p><p>Al imprimir en MS-Windows, el tamaño de la fuente será mucho más grande que el especificado por SVG.
+</p>
+<h2 id="Opacidad_de_grupo" name="Opacidad_de_grupo"> Opacidad de grupo </h2>
+<p>La propiedad de opacidad de grupo "opacity" permite que los objetos contenedores SVG puedan ser tratados como capas semi-transparentes, y sea separado de propiedades "fill-opacity" y "stroke-opacity" La implementacion actual de "opacity" consume bastantes recursos, debería ser usada con mesura. "fill-opacity" y "stroke-opacity" son mucho más rápidas, y dependiendo de su contenido pueden aportar los mismos resultados.
+</p><p>Actualmente la opacidad de grupo está implementado solo para &lt;g&gt; pero no para &lt;text&gt; o &lt;svg&gt;
+</p>
+<h2 id="Stroking_fonts" name="Stroking_fonts"> Stroking fonts </h2>
+<p>On the MS-Windows and OS-X platforms, the stroke of the text will not exactly match the fill. The error is typically quite small, and can be covered by using a slightly thicker stroke. An example of this difference:
+</p><p><br>
+<img alt="Imagen:Text-fill-stroke.png">
+</p>
+<h2 id=".3Cimage.3E" name=".3Cimage.3E"> &lt;image&gt; </h2>
+<p>&lt;image&gt; no soporta imágenes SVG en Firefox 1.5, sólo los formatos de imagen rasterizados que Firefox maneja.
+</p><p>Todas las instancias de &lt;image&gt; tienen una copia separada de la imagen que está siendo usada, lo cual es algo a tener en cuenta si tu contenido está usando múltiples copias de una imagen para un icono o algo parecido. Desafortunadamente, &lt;use&gt; en contenido &lt;image&gt; cuenta como otra copia en este caso.
+</p><p>De manera adicional, un uso intensivo de imágenes rasterizadas en SVG puede degradar de sobremanera el rendimiento en Firefox 1.5.
+</p>
+<h2 id="Eventos" name="Eventos"> Eventos </h2>
+<p>Soportamos los atributos de SVG para eventos, a excepción de "onfocusin", "onfocusout", y "onactivate".
+</p><p>Nuestro manejo del evento "onload" es actualmente no-estándar, pero creemos que aún así no impide su uso correcto. Mientras que el código especificado por el atributo "onload" será llamado para cada elemento, un evento SVGLoad es llamado únicamente para el elemento &lt;svg&gt; raíz. Algunos métodos DOM devolverán basura o error si son llamados antes de que el elemento correspondiente haya sido renderizado, algo que tendrás que tener en cuenta al escribir código "onload". Dichos métodos son getBBox, getScreenCTM, etc.
+</p><p>No damos soporte a los eventos para el teclado específicos de Adobe ("onkeydown", "onkeyup").
+</p>
+<h2 id="Interoperabilidad" name="Interoperabilidad"> Interoperabilidad </h2>
+<p>Si está trabajando con contenidos SVG actuales, puede encontrar problemas al cargarlos en Firefox. La mayoría de los problemas suelen ser triviales, y son el resultado de una implementación más estricta en Firefox. En <a class="external" href="http://jwatt.org/svg/authoring/">SVG Authoring Guidelines</a> Jonathan Watt's explica los problemas comunes.
+</p>
+<h2 id="Situaciones_del_uso" name="Situaciones_del_uso"> Situaciones del uso </h2>
+<p>Firefox 1.5 maneja SVG como un documento entero, o como referencia para los elementos embed, object, e iframe. Actualmente no puede ser usado como fuente del elemento img, ni para las propiedades CSS relativas a las imágenes.
+</p>
+<h2 id="Animaci.C3.B3n" name="Animaci.C3.B3n"> Animación </h2>
+<p>Firefox 1.5 no implementa la animación declarativa, pero soporta scripting dinámico. Doug Shepers lo ha usado para crear <a class="external" href="http://www.vectoreal.com/smilscript/">SmilScript</a>, una pequeña biblioteca de Javascript que implementa parte de la animación declarativa de SVG.
+</p>
+<h2 id="Elementos.2C_estado_de_la_implementaci.C3.B3n" name="Elementos.2C_estado_de_la_implementaci.C3.B3n"> Elementos, estado de la implementación </h2> <table style="margin: 5px;"> <tbody><tr> <th><b>Elemento</b></th> <th><b>Notas</b></th> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#basic-structure-mod">Módulo Estructura</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SVGElement">svg</a></td> <td> <ul> <li>Implementado. </li><li><code>currentScale</code> and <code>currentTranslate</code> DOM attributes are implemented, but there is no pan and zoom user interface. </li><li>SVGSVGElement <ul> <li> Atributos no implementados: contentScriptType, contentStyleType, viewport, useCurrentView, currentView </li> <li> Bindings no implementados: pauseAnimations, unpauseAnimations, animationsPaused, getCurrentTime, setCurrentTime, getIntersectionList, getEnclosureList, checkIntersection, checkEnclosure, deselectAll, createSVGAngle, getElementById </li> </ul> </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#GElement">g</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DefsElement">defs</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DescElement">desc</a></td> <td> <ul> <li>Implementado. </li><li>Only stored in the DOM, no user interface.&lt;/td&gt; </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#TitleElement">title</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/metadata.html#MetadataElement">metadata</a></td> <td> <ul> <li>Implementado. </li><li>Only stored in the DOM, no user interface.&lt;/td&gt; </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SymbolElement">symbol</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#UseElement">use</a></td> <td> <ul> <li>Implementado. </li><li>Only works for internal document references (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=269482">bug 269482</a>). </li><li>Doesn't completely follow &lt;svg:use&gt; cascading rules (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265894">bug 265894</a>). </li><li>Doesn't deliver events to a SVGElementInstance tree (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265895">bug 265895</a>). </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#conditional-mod">Conditional Processing Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SwitchElement">switch</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#image-mod">Image Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement">image</a></td> <td> <ul> <li>Implementado. </li><li>Only works for raster images (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=272288">bug 272288</a>). </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#style-mod">Style Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#StyleElement">style</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#shape-mod">Shape Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/paths.html#PathElement">path</a></td> <td> <ul> <li>Implementado.</li> <li>SVGPathElement Interfaz <ul> <li> Atributos no implementados: pathLength, normalizedPathSegList, animatedPathSegList, animatedNormalizedPathSegList </li> <li> Bindings no implementados: getTotalLength, getPointAtLength, getPathSegAtLength </li> </ul> </li> <li>SVGPathSegList Interface <ul> <li>Bindings no implementados: replaceItem()</li> </ul> </li> </ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement">rect</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#CircleElement">circle</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#LineElement">line</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement">ellipse</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolylineElement">polyline</a></td> <td> <ul> <li>SImplementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement">polygon</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/text.html#text-mod">Módulo Texto</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextElement">text</a></td> <td> <ul> <li>Implementado. </li><li>SVGTextElement <ul> <li> Atributos no implementados: rotate, textLength, lengthAdjust </li> <li> Bindings no implementados: getNumberOfChars, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString </li> <li> Bindings not functional at <code>onload</code> time: getExtentOfChar </li> </ul> </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TSpanElement">tspan</a></td> <td> <ul> <li>Implementado. </li><li>SVGTSpanElement <ul> <li> Atributos no implementados: rotate, textLength, lengthAdjust </li> <li> bindings no implementados: getNumberOfChars, getComputedTextLength, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getExtentOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString </li> </ul> </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TRefElement">tref</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextPathElement">textPath</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphElement">altGlyph</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphDefElement">altGlyphDef</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphItemElement">altGlyphItem</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#GlyphRefElement">glyphRef</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#marker-mod">Módulo Marker</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#MarkerElement">marker</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/color.html#color-profile-mod">Módulo Color-Profile</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/color.html#ColorProfileElement">color-profile</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#gradient-mod">Módulo Gradientes</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#LinearGradientElement">linearGradient</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#RadialGradientElement">radialGradient</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#StopElement">stop</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#pattern-mod">Módulo Pattern</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">pattern</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#clip-mod">Módulo Clip</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#ClipPathElement">clipPath</a></td> <td> <ul> <li>Implementado. </li><li>Won't handle clip paths with have elements with different clip-rule properties or that reference other clipPaths. (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=267224">bug 267224</a>). </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#mask-mod">Módulo Mask</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">mask</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#filter-mod">Módulo Filtro</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#FilterElement">filter</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feBlendElement">feBlend</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feColorMatrixElement">feColorMatrix</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feComponentTransferElement">feComponentTransfer</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement">feComposite</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElement">feConvolveMatrix</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDiffuseLightingElement">feDiffuseLighting</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMapElement">feDisplacementMap</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFloodElement">feFlood</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feGaussianBlurElement">feGaussianBlur</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement">feImage</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeElement">feMerge</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeNodeElement">feMergeNode</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMorphologyElement">feMorphology</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feOffsetElement">feOffset</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpecularLightingElement">feSpecularLighting</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTileElement">feTile</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTurbulenceElement">feTurbulence</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDistantLightElement">feDistantLight</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#fePointLightElement">fePointLight</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpotLightElement">feSpotLight</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncRElement">feFuncR</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncGElement">feFuncG</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncBElement">feFuncB</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncAElement">feFuncA</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#cursor-mod">Módulo Cursor</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#CursorElement">cursor</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#hyperlinking-mod">Módulo hiperenlace</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#AElement">a</a></td> <td> <ul> <li>Implementado en un binding XBL - object no es del tipo SVGAElement.</li> <li>Solo están implementados los atributos <code>xlink:href</code> y <code>xlink:show</code> </li> <li>Sobre el atributo <code>target</code> vea <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=300868">bug 300868</a></li> </ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#view-mod">Módulo visión</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#ViewElement">view</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/script.html#scripting-mod">Módulo Script</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/script.html#ScriptElement">script</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#animation-mod">Módulo Animación</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateElement">animate</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#SetElement">set</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateMotionElement">animateMotion</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateTransformElement">animateTransform</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateColorElement">animateColor</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#mpathElement">mpath</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#font-mod">Módulo Fuentes</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceElement">font</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement">glyph</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#MissingGlyphElement">missing-glyph</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#HKernElement">hkern</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#VKernElement">vkern</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceSrcElement">font-face-src</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-uri</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-format</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-name</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#DefinitionSrcElement">definition-src</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#extensibility-mod">Módulo Extensibilidad</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">foreignObject</a></td> <td> <ul> <li>Implementado, but not built. </li></ul> </td> </tr> </tbody></table>
+{{ languages( { "en": "en/SVG_in_Firefox", "fr": "fr/SVG_dans_Firefox", "ja": "ja/SVG_in_Firefox", "pl": "pl/SVG_w_Firefoksie" } ) }}
diff --git a/files/es/orphaned/xpinstall_api_reference/index.html b/files/es/orphaned/xpinstall_api_reference/index.html
new file mode 100644
index 0000000000..c830baa658
--- /dev/null
+++ b/files/es/orphaned/xpinstall_api_reference/index.html
@@ -0,0 +1,133 @@
+---
+title: XPInstall API Reference
+slug: orphaned/XPInstall_API_Reference
+original_slug: XPInstall_API_Reference
+---
+<p>@namespace url(<a class=" external" href="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">http://www.mozilla.org/keymaster/gat...re.is.only.xul</a>);
+</p><p>/* ----------Make toolbars Look ok on Classic---------- */
+</p>
+<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox {
+</li></ol>
+<pre class="eval"> -moz-appearance: toolbox !important;
+ background-color: -moz-Dialog !important;
+ border-top: 2px solid !important;
+ -moz-border-top-colors: ThreeDShadow ThreeDHighlight !important;
+</pre>
+<p>}
+</p>
+<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox toolbar {
+</li></ol>
+<pre class="eval"> -moz-appearance: toolbar !important;
+ border-top: 2px solid !important;
+ -moz-border-top-colors: ThreeDShadow ThreeDHighlight !important;
+</pre>
+<p>}
+</p>
+<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar {
+</li></ol>
+<pre class="eval"> border: none !important;
+</pre>
+<p>}
+</p>
+<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar,
+</li><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #PersonalToolbar {
+</li></ol>
+<pre class="eval"> -moz-opacity: 1 !important;
+</pre>
+<p>}
+</p>
+<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar,
+</li><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar menubar,
+</li><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #nav-bar {
+</li></ol>
+<pre class="eval"> -moz-appearance: toolbar !important;
+</pre>
+<p>}
+</p>
+<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar {
+</li></ol>
+<pre class="eval">  background: none !important;
+</pre>
+<p>}
+</p>
+<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox {
+</li></ol>
+<pre class="eval">  background-color: -moz-Dialog !important;
+</pre>
+<p>}
+</p><p>/* ----------Fix Address Bar---------- */
+</p>
+<ol><li>urlbar {
+</li></ol>
+<pre class="eval"> padding-left: 1px !important;
+</pre>
+<p>}
+</p><p>/* code from kliu0x52 */
+</p>
+<ol><li>urlbar:not(:-moz-system-metric(windows-default-theme)) {
+</li></ol>
+<pre class="eval">  -moz-appearance: TextField ! important;
+</pre>
+<p>}
+</p>
+<ol><li>urlbar{{ mediawiki.external('chromedir=\"ltr\"') }}:not(:-moz-system-metric(windows-default-theme)) {
+</li></ol>
+<pre class="eval">  -moz-margin-start: 4px ! important;
+</pre>
+<p>}
+</p>
+<ol><li>urlbar{{ mediawiki.external('chromedir=\"ltr\"') }}:not(:-moz-system-metric(windows-default-theme)) &gt; #identity-box {
+</li></ol>
+<pre class="eval">  -moz-margin-start: 0px ! important;
+</pre>
+<p>}
+</p>
+<ol><li>urlbar{{ mediawiki.external('chromedir=\"ltr\"') }}:not(:-moz-system-metric(windows-default-theme)) &gt; #identity-box &gt; hbox {
+</li></ol>
+<pre class="eval">  border-left-style: none ! important;
+  padding-left: 2px ! important;
+  -moz-border-radius: 0px ! important;
+</pre>
+<p>}
+</p><p>.searchbar-textbox:not(:-moz-system-metric(windows-default-theme)) {
+</p>
+<pre class="eval">  -moz-appearance: TextField ! important;
+</pre>
+<p>}
+/* end of code from kliu0x52 */
+</p><p>/* ----------Remove withe background from menubar---------- */
+</p>
+<ol><li>toolbar-menubar {
+</li></ol>
+<pre class="eval"> background: none !important;
+</pre>
+<p>}
+</p>
+<ol><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #file-menu,
+</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #edit-menu,
+</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #view-menu,
+</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #history-menu,
+</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #bookmarksMenu,
+</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #tools-menu,
+</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #helpMenu {
+</li></ol>
+<pre class="eval"> color: #ffffff !important;
+</pre>
+<p>}
+</p><p>/* ----------Make bookmarks toolbar blue---------- */
+</p>
+<ol><li>PersonalToolbar:-moz-system-metric(windows-default-theme) {
+</li></ol>
+<pre class="eval"> -moz-appearance: communications-toolbox !important;
+ padding: 2px 2px 3px 2px !important;
+</pre>
+<p>}
+</p>
+<ol><li>PersonalToolbar .toolbarbutton-text:-moz-system-metric(windows-default-theme) {
+</li></ol>
+<p>color: #fff !important;
+margin-bottom: 1px !important;
+}
+</p><p>toolbarbutton.bookmark-item:-moz-system-metric(windows-default-theme) {
+padding: 2px 6px !important;
+</p>
diff --git a/files/es/participar_en_el_proyecto_mozilla/index.html b/files/es/participar_en_el_proyecto_mozilla/index.html
deleted file mode 100644
index 7266e63643..0000000000
--- a/files/es/participar_en_el_proyecto_mozilla/index.html
+++ /dev/null
@@ -1,10 +0,0 @@
----
-title: Participar en el proyecto Mozilla
-slug: Participar_en_el_proyecto_Mozilla
-tags:
-  - para_revisar
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si estás interesado en ayudar a corregir los errores o trabajar en el código detrás de la plataforma Mozilla, este es el lugar para encontrar la documentación que te guiará en la dirección correcta.</span></span></p>
-<table class="mainpage-table"> <tbody> <tr> <td> <h2 id="Temas_generales"><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Temas generales</span></span></h2> <dl> <dt><a class="internal" href="/En/Developer_Guide" title="En/Developer Guide"><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Guía para desarrolladores de Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Consejos y guías sobre desarrollo para contribuir al código base de Mozilla.</span></span></dd> <dt><a class="internal" href="/En/Developer_Guide/Source_Code" title="En/Developer Guide/Source Code"><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Código fuente de Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Información acerca de cómo obtener el código de Mozilla, ya sea por descarga o por medio de control de versiones, y cómo obtener el código en el árbol.</span></span></dd> <dt><a class="internal" href="/En/The_Mozilla_platform" title="En/The Mozilla platform"><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Elaborar documentación</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Información acerca de cómo construir proyectos de Mozilla, incluyendo Firefox y Thunderbird.</span></span> <em><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Esta página necesita limpieza.</span></span></em></dd> <dt><a class="internal" href="/En/The_Mozilla_platform" title="En/The Mozilla platform"><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La plataforma Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Información sobre la plataforma Mozilla, incluyendo todos sus APIs y tecnologías, así como la forma de utilizarlas en tus propios proyectos.</span></span></dd> <dt><a class="internal" href="/Project:en/How_to_Help" title="Project:en/How to Help"><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Documentar Mozilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Ayuda a crear y mejorar nuestra documentación para Mozilla y para la Web abierta.</span></span></dd> <dt><a class="internal" href="/En/Debugging" title="En/Debugging"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Depuración (Debugging)</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Consejos útiles y pautas a seguir para depurar el código de Mozilla.</span></span></dd> <dt><a class="internal" href="/en/QA" title="en/QA"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Aseguramiento/Control de calidad</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Información sobre pruebas y control de errores.</span></span></dd> <dt><a class="internal" href="/es/Localización" title="es/Localización"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Localización</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Documentación en múltiples idiomas sobre traducción de los proyectos de Mozilla, documentación y otros muchos aspectos.</span></span></dd> <dt><a class="internal" href="/en/Glossary" title="en/Glossary"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Glosario</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Términos y definiciones utilizadas por los hackers de Mozilla.</span></span></dd> </dl> <h2 id="Páginas_sobre_proyectos"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Páginas sobre proyectos</span></span></h2> <dl> <dt><a class="internal" href="/en/Thunderbird" title="en/Thunderbird"><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Thunderbird</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cliente de correo Mozilla</span></span></dd> <dt><a class="internal" href="/en/Calendar" title="en/Calendar">Sunbird</a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Proyecto de calendario de Mozilla</span></span></dd> </dl> </td> <td> <h2 id="Herramientas"><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Herramientas</span></span></h2> <dl> <dt><a class="link-https" href="https://bugzilla.mozilla.org/" title="https://bugzilla.mozilla.org/"><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Bugzilla</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-ph-missing goog-gtc-from-human" dir="ltr" style="">La base de datos </span></span><a class="internal" href="/en/Bugzilla" title="En/Bugzilla">Bugzilla</a><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-ph-missing goog-gtc-from-human" dir="ltr" style=""> se usa para rastrear los problemas o incidencias relacionados con los proyectos de Mozilla.</span></span></dd> <dt><a class="external" href="http://mxr.mozilla.org/" title="http://mxr.mozilla.org/">MXR</a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Navega y busca en el repositorio de código fuente de Mozilla en la Web.</span></span></dd> <dt><a class="external" href="http://bonsai.mozilla.org/cvsqueryform.cgi" title="http://bonsai.mozilla.org/cvsqueryform.cgi">Bonsai</a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style="">La herramienta </span></span><a class="internal" href="/en/Bonsai" title="En/Bonsai">Bonsai</a><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style=""> te permite saber quién cambió qué archivo en el repositorio y cuándo lo hicieron.</span></span></dd> <dt><a class="external" href="http://tinderbox.mozilla.org/showbuilds.cgi" title="http://tinderbox.mozilla.org/showbuilds.cgi">Tinderbox</a></dt> <dd><a class="internal" href="/en/Tinderbox" title="En/Tinderbox">Tinderbox</a><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style=""> muestra el estado del árbol (si actualmente se construye o no con éxito).</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Compruébalo antes de proteger (check in) o desplegar (check out) y asegúrate de que estás trabajando con un árbol de trabajo.</span></span></dd> <dt><a class="internal" href="/en/Crash_reporting" title="en/Crash reporting"><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Seguimiento de errores</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style="">Información sobre los sistemas de notificación de fallos </span></span><a class="link-https" href="https://crash-reports.mozilla.com/reports" title="https://crash-reports.mozilla.com/reports">Socorro</a><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing" dir="ltr" style=""> y </span></span><a class="external" href="http://talkback-public.mozilla.org/search/start.jsp" title="http://talkback-public.mozilla.org/search/start.jsp">Talkback</a>.</dd> <dt><a class="external" href="http://graphs.mozilla.org/" title="http://graphs.mozilla.org/"><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Seguimiento del rendimiento</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Consulta la información de rendimiento para los proyectos de Mozilla.</span></span></dd> <dt><a class="external" href="http://www.mozilla.org/community/developer-forums.html" title="http://www.mozilla.org/community/developer-forums.html"><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Foros para desarrolladores</span></span></a></dt> <dd><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Una lista de temas específicos de foros de discusión, donde puedes hablar sobre cuestiones de desarrollo de Mozilla.</span></span></dd> </dl> </td> </tr> </tbody>
-</table>
-<p>  <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">{{ languages ({"en": "en/Participating_in_the_Mozilla_project", "zh-cn": "cn / Participating_in_the_Mozilla_project", "ja": "ja / Participating_in_the_Mozilla_project", "ko": "ko / Participating_in_the_Mozilla_project"}) }}</span></span></p>
diff --git a/files/es/plantillas_en_firefox_3/index.html b/files/es/plantillas_en_firefox_3/index.html
deleted file mode 100644
index 499fa226a2..0000000000
--- a/files/es/plantillas_en_firefox_3/index.html
+++ /dev/null
@@ -1,27 +0,0 @@
----
-title: Plantillas en Firefox 3
-slug: Plantillas_en_Firefox_3
-tags:
-  - Firefox 3
-translation_of: Mozilla/Firefox/Releases/3/Templates
----
-<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Las plantillas se han mejorado enormemente en Firefox 3. La mejora más importante permite el uso de <a href="/es/Cómo_implementar_un_componente_procesador_de_consultas_XUL" title="es/Cómo_implementar_un_componente_procesador_de_consultas_XUL">procesador de consultas personalizado</a> para manejar otro tipo de fuentes de datos además de RDF. Esto es posible gracias a la nueva sintaxis de consultas. También se incluyen soporte para SQL (<a href="/es/Almacenamiento" title="es/Almacenamiento">mozStorage</a>) y fuentes de datos XML. Ya {{ interwiki('wikimo', 'XUL:Template_Features_in_1.9', 'está disponible') }} una descripción completa de las nuevas características para plantillas. ({{ Bug(285631) }})</p>
-
-<h3 id="Otras_mejoras" name="Otras_mejoras">Otras mejoras</h3>
-
-<ul>
- <li>Se han añadido condiciones relacionales para que los resultados encontrados cumplan la norma con una mayor exactitud. Esto permite, por ejemplo, que se encuentren resultados que empiecen o terminen con determinados hilos, o que son antes o después otros valores.</li>
- <li>Se ha incluido una bandera, <code>dont-recurse</code>, para evitar que se repitan resultados generados tan solo a un nivel.</li>
- <li>Se han añadido APIs al editor de plantillas para recuperar un objeto de resultado que representa un dato externo.</li>
- <li>Se ha mejorado el servicio tipo XUL <a href="/es/XUL/Guía_de_plantillas/Ordenar_resultados" title="es/XUL/Guía_de_plantillas/Ordenar_resultados">clasificando</a> mejor tanto el árbol de contenido como el de sin contenido. También permite clasificar contenidos de plantillas no editables.({{ Bug(335122) }})</li>
-</ul>
-
-<h3 id="V.C3.A9ase_tambi.C3.A9n" name="V.C3.A9ase_tambi.C3.A9n">Véase también</h3>
-
-<ul>
- <li><a href="/es/Firefox_3_para_desarrolladores" title="es/Firefox_3_para_desarrolladores">Firefox 3 para desarrolladores</a></li>
-</ul>
-
-<p>{{ languages( { "en": "en/Templates_in_Firefox_3", "fr": "fr/Templates_dans_Firefox_3", "ja": "ja/Templates_in_Firefox_3" } ) }}</p>
diff --git a/files/es/preguntas_frecuentes_sobre_incrustación_en_mozilla/index.html b/files/es/preguntas_frecuentes_sobre_incrustación_en_mozilla/index.html
deleted file mode 100644
index 77496f3178..0000000000
--- a/files/es/preguntas_frecuentes_sobre_incrustación_en_mozilla/index.html
+++ /dev/null
@@ -1,5 +0,0 @@
----
-title: Preguntas frecuentes sobre incrustación en Mozilla
-slug: Preguntas_frecuentes_sobre_incrustación_en_Mozilla
----
-{{wiki.localize('System.API.page-generated-for-subpage')}}
diff --git a/files/es/preguntas_frecuentes_sobre_incrustación_en_mozilla/introducción_a_gecko_e_inscrustación/index.html b/files/es/preguntas_frecuentes_sobre_incrustación_en_mozilla/introducción_a_gecko_e_inscrustación/index.html
deleted file mode 100644
index 9240658758..0000000000
--- a/files/es/preguntas_frecuentes_sobre_incrustación_en_mozilla/introducción_a_gecko_e_inscrustación/index.html
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: Introducción a Gecko e inscrustación
-slug: >-
-  Preguntas_frecuentes_sobre_incrustación_en_Mozilla/Introducción_a_Gecko_e_inscrustación
-tags:
-  - Incrustando_Mozilla
-  - Todas_las_Categorías
----
-<p>
-</p>
-<h2 id="Secci.C3.B3n_1:_Introducci.C3.B3n_a_Gecko_e_incrustaci.C3.B3n"> Sección 1: Introducción a Gecko e incrustación </h2>
-<h3 id=".C2.BFQu.C3.A9_es_Gecko.3F"> ¿Qué es Gecko? </h3>
-<p>Gecko es el motor del navegador, gestión de redes, analizadores, modelos de diseño, chrome y las otras tecnologías sobre las que Mozilla y otras apliaciones son construidas. En otras palabras, todo aquello queno es específico de la aplicación.
-</p><p>Gecko tiene una ligeramente desactualizada <a class="external" href="http://www.mozilla.org/newlayout/faq.html">sección de preguntas frecuentes</a> of its own.
-</p>
-<h3 id=".C2.BFQu.C3.A9_es_Mozilla.3F"> ¿Qué es Mozilla? </h3>
-<p>Mozilla es una aplicación multimplataforma formada por un navegador web,un editor de páginas web un gesator de correo /lector de noticiasn desarrollado sobre Gecko.
-</p>
-<h3 id=".C2.BFQu.C3.A9_es_the_GRE.3F"> ¿Qué es the GRE? </h3>
-<p>El GRE (anteriormente conocido como MRE) es <a href="es/GRE">Gecko Runtime Environment</a> un entorno de ejecución que muchas aplicaciones pueden compartir. Actualmente se ha esta desarrollando como un proyecto independiente llamado <a href="es/XULRunner">XULRunner</a>.
-</p>
-<h3 id=".C2.BFQu.C3.A9_es_XPCOM.3F"> ¿Qué es XPCOM? </h3>
-<p>XPCOM es una <i>tecnología de objetos</i> (similar al COM de MS Windows pero multiplataforma) cuya misión es to unificar la creación, el control y la eliminación de objetos y otros datosbajo Mozilla. El núcleo XPCOM es la interfaz nsISupports, que proporciona marco de referencia de conteo y un entorno de ejecución de búsquedas para capacidades. Todos los objetos XPCOM incluyen la interfaz nsISupports, además de las interfaces específicas de cadad objeto. Finalmente, XPCOM incluye una capa lenguaje-independiente llamada XPConnect que permite que el desarrrollo de objetos sea escrito en cualquier lenguage compatible y sean llamados desde cualquier lenguaje compatible.
-</p><p>Puede encontrar más información <a class="external" href="http://www.mozilla.org/projects/xpcom/">aquí</a>.
-</p>
-<h3 id=".C2.BFQu.C3.A9_significa_Gecko_.E2.80.9Cincrustado.E2.80.9D.3F"> ¿Qué significa Gecko “incrustado”? </h3>
-<p>Gecko permite a desarrolladores de terceros emplear la misma tecnología que Mozilla usa.. Esto significa que puede incrustar un navegador web dentro de una aplicación de terceros, abrir canales y descargas dentro de los límites de la red, navergar por el DOM y más. Incluso puede construir aplicaciones enteras empleando el chrome.
-</p>
-<h3 id=".C2.BFCuales_son_los_t.C3.A9rminos_de_licencia_para_incrustar_Gecko.3F"> ¿Cuales son los términos de licencia para incrustar Gecko? </h3>
-<p>Los mismos que para el resto de Mozilla. Mire <a class="external" href="http://www.mozilla.org/MPL/">página MPL</a> fpara más información.
-</p>
-<h3 id=".C2.BFHay_disponible_un_SDK.3F"> ¿Hay disponible un SDK? </h3>
-<p>Estamos trabajando lentamente para crear un SDK. De momento le recomendamos que <a class="external" href="http://www.mozilla.org/source.html">obtenga el código fuente</a> y compile desde ahí.
-</p><p>Las versiones de desarrollo del SDK para Win32 pueden ser encontradas <a class="link-ftp" href="ftp://ftp.mozilla.org/pub/mozilla.org/mozilla/nightly/latest-trunk/gecko-sdk-i586-pc-msvc.zip">aquí</a>.
-</p>
-<h3 id=".C2.BFCu.C3.A1l_es_la_.C3.BAltima_versi.C3.B3n.3F_.C2.BFQue_versi.C3.B3n_deber.C3.ADa_usar.3F"> ¿Cuál es la última versión? ¿Que versión debería usar? </h3>
-<p>Versiones incrustadas y el código fuente se generan con frecuencia y pueden descargarse <a class="link-ftp" href="ftp://ftp.mozilla.org/pub/mozilla.org/xulrunner/nightly/latest-trunk/">aquí</a>. Si desea estabilidad se recomienda emplear versiones Mozilla de la rama 1.7.x.
-</p>
-<h3 id=".C2.BFQui.C3.A9n_est.C3.A1_usando_Gecko_actualmente.3F"> ¿Quién está usando Gecko actualmente? </h3>
-<p>Mire <a class="external" href="http://www.mozilla.org/projects/embedding/examples/">aquí</a> para ver la creciente lista de programas que incrustan Gecko.
-</p>
diff --git a/files/es/principios_básicos_de_los_servicios_web/index.html b/files/es/principios_básicos_de_los_servicios_web/index.html
deleted file mode 100644
index a5e4ca392c..0000000000
--- a/files/es/principios_básicos_de_los_servicios_web/index.html
+++ /dev/null
@@ -1,36 +0,0 @@
----
-title: Principios básicos de los servicios Web
-slug: Principios_básicos_de_los_servicios_Web
-tags:
-  - SOAP
-  - Servicios_Web_XML
-  - Todas_las_Categorías
-  - XML
-  - XML-RPC
----
-<p>
-</p><p><span class="comment">Summary: Un tema candente en la Web últimamente son los servicios Web. Esta pequeña guía le permitirá aprender mas acerca de los servicios Web.</span>
-</p>
-<h3 id="Los_fundamentos"> Los fundamentos </h3>
-<p>Los servicios Web no son realmente nada nuevo, y actualmente, si ha utilizado RSS o Atom para leer noticias desde un sitio web, tiene una idea de como funciona un servicio Web.
-</p><p>Los servicios Web intercambian datos desde un servidor al cliente, utilizando el formato XML para enviar las peticiones, de modo que tanto el servidor como el cliente puede entenderse (<a href="es/Introducci%c3%b3n_a_XML">Introducción a XML</a>).
-</p><p>Una mejor forma de entender un servicio Web es compararlo con un formulario HTML (en PHP o ASP) para postear y enviar datos. Ambos, el servicio Web y el formulario, reciben y envían peticiones. La única diferencia es que un servicio Web utiliza XML.
-</p>
-<h3 id="Ejemplos_de_servicios_Web_en_acci.C3.B3n"> Ejemplos de servicios Web en acción </h3>
-<p>Como se dijo anteriormente, RSS y los alimentadores Atom son simplemente un ejemplo de como funciona un servicio Web, más comúnmente, XML-RPC o SOAP son también utilizados para realizar la comunicación entre el servidor y el cliente.
-</p>
-<h3 id="Introducci.C3.B3n_a_XML-RPC"> Introducción a XML-RPC </h3>
-<p>XML-RPC es un tipo de servicio Web que ha existido desde 1998 y aunque no es un estándar oficial <a class="external" href="http://www.w3.org/">W3C</a>,es utilizado extensamente. XML-RPC fue desarrollado por Useful Inc, junto con Microsoft.
-</p>
-<h3 id="Introducci.C3.B3n_a__SOAP"> Introducción a SOAP </h3>
-<p>SOAP, un servicio Web, está listado como un estándar <a class="external" href="http://www.w3.org/">W3C</a>, y es similar de diversas formas a XML_RPC. SOAP está respaldado por IBM, así como por Microsoft.
-</p>
-<h3 id=".C2.BFSOAP_0_XML-RPC.3F"> ¿SOAP 0 XML-RPC? </h3>
-<p>Brevemente, SOAP fue pensado para rellenar los huecos de XML-RPC. Por ejemplo, es mucho más fácil enviar un array multi-dimensional con SOAP que con XML-RPC. SOAP tiene más funcionalidad que XML-RPC, aunque XML-RPC también tiene su propio uso.
-</p>
-<div class="originaldocinfo">
-<h3 id="Informaci.C3.B3n_sobre_el_documento"> Información sobre el documento </h3>
-<ul><li> Autor(es): Justin G. Shreve
-</li><li> Fecha de la última actualización : 19 de Mayo de 2005
-</li></ul>
-</div>
diff --git a/files/es/recursos_en_modo_desconectado_en_firefox/index.html b/files/es/recursos_en_modo_desconectado_en_firefox/index.html
deleted file mode 100644
index 1c187da642..0000000000
--- a/files/es/recursos_en_modo_desconectado_en_firefox/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Recursos en modo desconectado en Firefox
-slug: Recursos_en_modo_desconectado_en_Firefox
-tags:
-  - Aplicaciones_web_en_desconectado
-  - Firefox 3
----
-<p>{{ Fx_minversion_header(3) }}</p>
-
-<p>Firefox 3 implementa en gran parte el soporte HTML 5 para la memoria<em>cache</em> (memoria temporal) de la aplicación web en modo desconectado. Esto lo hace por medio del cache de la aplicación (un conjunto de recursos obtenido con un manifiesto proporcionado por la aplicación web).</p>
-
-<h3 id="El_cache_de_la_aplicaci.C3.B3n" name="El_cache_de_la_aplicaci.C3.B3n">El cache de la aplicación</h3>
-
-<p>{{ Note("Firefox no gestiona actualmente ningún control de versión en el cache de aplicación.") }}</p>
-
-<p>Ya que múltiples aplicaciones web pueden compartir recursos (y pueden incluso compartir la misma URI) cada aplicación mantiene su propio cache (su propia memoria temporal). Sin embargo, las diferentes cache de las aplicaciones son agrupadas por su propio manifiesto de usuario y tienen un<em>estado de actualización</em> conjunto. El estado de actualización es uno de los siguientes:</p>
-
-<dl>
- <dt><code>idle</code></dt>
- <dd>El cache de aplicación no está descargando actualizaciones.</dd>
- <dt><code>checking</code></dt>
- <dd>El cache está comprobando su propio manifiesto de recursos, para ver si hay uno más reciente.</dd>
- <dt><code>downloading</code></dt>
- <dd>El cache está actualizando su manifiesto de recursos con información nueva, ya que el anterior fue modificado.</dd>
-</dl>
-
-<p>{{ Fx_minversion_note(3, "Actualmente, sólo se permiten estradas de recursos. Firefox no admite aún cambios oportunistas o entradas de restitución (volver a versiones anteriores), sin embargo, es recomendable suministrar una lista blanca, si procede, para una compatibilidad futura.") }}</p>
-
-<h4 id="Recursos" name="Recursos">Recursos</h4>
-
-<p>El cache siempre incluye al menos un recurso, identificado por su URI, de al menos una de las siguientes categorías:</p>
-
-<dl>
- <dt>Entradas implícitas (Implicit entries)</dt>
- <dd>Son recursos agregados al cache por que un contexto de navegación principal visitado por el usuario incluyó un documento que indica que el recurso está en su cache, utilizando su atributo <code>manifest</code>.</dd>
- <dt>El manifiesto (manifest)</dt>
- <dd>Este es el manifiesto de recurso en sí mismo, cargado desde la URI especificada en una entrada de <code>html</code> implícita con el atributo <code>manifest</code>. El manifiesto es descargado y tratado durante el proceso de actualización del cache de la aplicación. Las entradas implícitas han de tener el mismo protocolo, servidor y puerto que el manifiesto.</dd>
- <dt>Entradas explícitas (Explicit entries)</dt>
- <dd>Son recursos listados en el manifiesto del cache.</dd>
- <dt>Entradas de restitución/recuperación (Fallback entries)</dt>
- <dd>Son recursos que fueron listados en el manifiesto del cache como entradas "fallback". <strong>No admitido aún en Firefox.</strong></dd>
- <dt>Entradas oportunistas (Opportunistically cached entries)</dt>
- <dd>Son recursos cuyas URI correspondían a un espacio de nombre de puesta en cache oportunista cuando se descargaron y que por tanto, fueron puestas automáticamente en la memoria de la aplicación. <strong>No admitido aún en Firefox.</strong></dd>
- <dt>Entradas dinámicas (Dynamic entries)</dt>
- <dd>Son recursos añadidos por programa, con el método <code><a href="es/NsIDOMOfflineResourceList#add.28.29">add()</a></code>.</dd>
-</dl>
-
-<h4 id="La_lista_blanca_en_l.C3.ADnea" name="La_lista_blanca_en_l.C3.ADnea">La lista blanca en línea</h4>
-
-<p>La lista blanca puede contener cero o más URIs de recursos, que la aplicación web necesitará obtener del servidor en lugar de desde la memoria cache. Esto permite al modelo de seguridad del navegador proteger al usuario de posibles brechas de seguridad, limitando el acceso sólo a recursos aprobados.</p>
-
-<p>{{ Note("La lista blanca no se usa en Firefox 3, sin embargo, convendría facilitar una si se necesita, tanto para tener y/o mantener la compatibilidad con versiones futuras de Firefox u otros navegadores que implementen recursos en modo desconectado.") }}</p>
-
-<h3 id="El_manifiesto" name="El_manifiesto">El manifiesto</h3>
-
-<p>Los archivos de manifiesto deben darse con el tipo MIME <code>text/cache-manifest</code>, y todos los recursos entregados con este tipo MIME deben seguir la sintaxis para un manifiesto de aplicación cache, según se define más abajo. Los manifiestos de cache son archivo de texto con formato 'UTF-8' y pueden, opcionalmente, incluir un carácter BOM. Las líneas nuevas pueden ser representadas por un carácter de nueva linea (U+000A) o por uno de retorno de carro (U+000D) o por ambos caracteres.</p>
-
-<p>La primera línea de un manifiesto cache debe contener la cadena de orden: "CACHE MANIFEST" (con un espacio simple U´0020 entre las dos palabras), seguido por nada, espacios o caracteres de tabulador. Cualquier otro texto en esta línea será ignorado.</p>
-
-<p>El resto del manifiesto debe estar compuesto por ninguna , alguna o todas las líneas siguientes:</p>
-
-<dl>
- <dt>Línea vacía</dt>
- <dd>Podemos utilizar líneas vacías (sin nada) o con caracteres de espacio o tabulador.</dd>
- <dt>Comentario</dt>
- <dd>Los comentarios son formados por un sólo carácter <strong>"#"</strong>, seguido por nada o con el texto del comentario, si se quiere se puede poner espacio/s antes (por ejemplo: <code> # Aquí va mi comentario </code>). Los comentarios sólo se pueden escribir en sus propias líneas y no se pueden añadir en otras líneas.</dd>
- <dt>Cabecera de sección</dt>
- <dd>Las cabeceras de sección especifican qué sección del manifiesto se está manipulando. Hay tres posibles cabeceras de sección:</dd>
-</dl>
-
-<blockquote>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Cabecera de sección</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td><code>CACHE:</code></td>
-   <td>Pasa a la sección explícita. Esta es la sección por defecto.</td>
-  </tr>
-  <tr>
-   <td><code>FALLBACK:</code></td>
-   <td>Pasa a la sección de recuperación ("fallback").
-    <p>{{ Note("Esta sección no está aún implementada en Firefox y será ignorada.") }}</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>NETWORK:</code></td>
-   <td>Pasa a la sección de la lista blanca en línea.
-    <p>{{ Note("La sección de lista blanca en línea, no está aún implementada en Firefox y será ignorada, sin embargo, suministrar una lista blanca apropiada está fuertemente recomendado.") }}</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-</blockquote>
-
-<dl>
- <dd>La línea de cabecera de sección puede contener espacios vacíos, pero es obligatorio incluir el carácter <strong>":"</strong> después del nombre.</dd>
- <dt>Datos para la sección activa.</dt>
- <dd>El formato de las líneas de datos cambia de sección a sección. En la sección explícita, cada línea es una URI válida o referencia IRI a un recurso del cache. Los espacios vacíos están permitidos antes y después de la URI o IRI en cada línea.</dd>
-</dl>
-
-<p>El manifiesto puede pasar de atrás a delante de sección a sección como quiere (de modo que cada cabecera de sección se puede usar más de una vez) y las secciones pueden estar vacías. {{ Note("Las URI relativas son relativas a la URI del manifiesto del cache, no a la URI del documento que referencia el manifiesto.") }}</p>
-
-<h4 id="Un_manifiesto_de_ejemplo" name="Un_manifiesto_de_ejemplo">Un manifiesto de ejemplo</h4>
-
-<p>Este es un manifiesto simple para una página web imaginaria cuyo sitio es <span class="nowiki">foo.com</span>.</p>
-
-<pre class="eval">CACHE MANIFEST
-# v1
-# Esto es un comentario.
-<span class="nowiki">http://www.foo.com/index.html</span>
-<span class="nowiki">http://www.foo.com/header.png</span>
-<span class="nowiki">http://www.foo.com/blah/blah</span>
-</pre>
-
-<p>En este ejemplo, no hay cabecera de sección, por lo que se considera que todas las líneas de datos están en la sección explícita.</p>
-
-<p>El comentario "v1" está ahí por una buena razón. Ya que el cache es actualizado sólo cuando el manifiesto cambia, si cambia el recurso (por ejemplo, actualizando la imagen <code>header.png</code> con nuevo contenido), el archivo del manifiesto debe modificarse para advertir el navegador que necesita refrescar el cache. Se puede hacer con cualquier truco en el manifiesto, pero tener un número de versión es una buena forma de hacerlo.</p>
-
-<p>Para indicar a Firefox que use aplicaciones en modo desconectado (almacenadas en el cache) para un sitio determinado, el sitio debe utilizar el atributo <code>manifest</code> en el elemento <code>html</code>, de forma parecida a:</p>
-
-<pre class="eval"><span class="nowiki">&lt;html manifest="http://www.foo.com/cache-manifest"&gt;</span>
-  ...
-&lt;/html&gt;
-</pre>
-
-<h3 id="El_proceso_de_actualizaci.C3.B3n" name="El_proceso_de_actualizaci.C3.B3n">El proceso de actualización</h3>
-
-<ol>
- <li>Cuando Firefox visita un documento que incluye el atributo <code>manifest</code>, envía un evento <code>checking</code> al objeto <code><a href="es/DOM/window.applicationCache">window.applicationCache</a></code>, y a continuación recupera el archivo del manifiesto, siguiendo las reglas HTTP apropiadas. Si la copia actualmente en cache del manifiesto está al día, se envía el evento <code>noupdate</code> a la <code>applicationCache</code>, y el proceso de actualización está completado.</li>
- <li>Si el archivo del manifiesto no ha cambiado desde la última actualización, de nuevo, se envía el evento <code>noupdate</code> a la <code>applicationCache</code>, y el proceso de actualización está completado. Esta es la razón por la que, si los recursos cambian, el archivo del manifiesto debe modificarse para que Firefox sepa que necesita refrescar la cache de recursos.</li>
- <li>Si el manifiesto ha cambiado, todos los archivos en el manifiesto -- así como aquellos agregados al manifiesto mediante la llamada a <code><a href="es/NsIDOMOfflineResourceList#add.28.29">applicationCache.add()</a></code> -- son agregados al cache temporal, siguiendo las reglas apropiadas de HTTP. Para cada archivo agregado a la cache, se envía un evento <code>progress</code> al objeto <code>applicationCache</code>. Si ocurre algún error, se envía un evento <code>error</code> y se detiene la actualización.</li>
- <li>Una vez que se han recuperado todos los archivos, son movidos al cache real y se envía un evento <code>cached</code> al objeto <code>applicationCache</code>.</li>
-</ol>
-
-<h3 id="Caracter.C3.ADsticas_a.C3.BAn_sin_implementar_en_Firefox" name="Caracter.C3.ADsticas_a.C3.BAn_sin_implementar_en_Firefox">Características aún sin implementar en Firefox</h3>
-
-<p>Debido a que el borrador estándar para HTML 5 estaba aún cambiando cuando llegamos a la fecha de congelación de características de Firefox 3, hay partes de las capacidades en modo desconectado que no han sido implementadas:</p>
-
-<ol>
- <li>La especificación del WHATWG indica que todas las peticiones deben venir de la copia cache desconectada, cuando es posible, aún cuando el navegador esté conectado. Firefox sólo accede a la copia cache desconectada, cuando el navegador no está conectado. Por esta razón, la lista blanca tampoco está aún funcionando.</li>
- <li>Firefox no mantiene actualmente copias cache separadas para las distintas aplicaciones. Las aplicaciones deberían evitar compartir recursos entre diferentes manifiestos, a no ser que no produzcan conflicto entre diferentes versiones de los recursos. En general, las aplicaciones deberían mantener copias separadas de cada recurso.</li>
- <li>Firefox no gestiona aún entradas de recuperación o de oportunidad.</li>
-</ol>
-
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/2008/WD-html5-20080122/#appcache">HTML 5 working draft: Application caches</a></li>
- <li>{{ Interface("nsIDOMOfflineResourceList") }}</li>
-</ul>
-
-<p> </p>
-
-<p> </p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "en": "en/Offline_resources_in_Firefox", "fr": "fr/Ressources_hors_ligne_dans_Firefox", "ja": "ja/Offline_resources_in_Firefox", "pl": "pl/Zasoby_offline_w_Firefoksie", "zh-tw": "zh_tw/Offline_resources_on_Firefox" } ) }}</p>
diff --git a/files/es/referencia_de_xul/index.html b/files/es/referencia_de_xul/index.html
deleted file mode 100644
index 9cab79c0e8..0000000000
--- a/files/es/referencia_de_xul/index.html
+++ /dev/null
@@ -1,317 +0,0 @@
----
-title: Referencia de XUL
-slug: Referencia_de_XUL
----
-<p>« <a href="/es/docs/XUL" title="es/XUL">Referencia de XUL</a> «</p>
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th colspan="3">Todos los elementos XUL (ordenados alfabéticamente)</th>
-  </tr>
-  <tr>
-   <td>
-    <p><a href="/en/XUL/action" title="en/XUL/action">action</a><br>
-     <a href="/en/XUL/arrowscrollbox" title="en/XUL/arrowscrollbox">arrowscrollbox</a><br>
-     <a href="/en/XUL/assign" title="en/XUL/assign">assign</a><br>
-     <a href="/en/XUL/bbox" title="en/XUL/bbox">bbox</a><br>
-     <a href="/en/XUL/binding" title="en/XUL/binding">binding</a><br>
-     <a href="/en/XUL/bindings" title="en/XUL/bindings">bindings</a><br>
-     <a href="/en/XUL/box" title="en/XUL/box">box</a><br>
-     <a href="/en/XUL/broadcaster" title="en/XUL/broadcaster">broadcaster</a><br>
-     <a href="/en/XUL/broadcasterset" title="en/XUL/broadcasterset">broadcasterset</a><br>
-     <a href="/en/XUL/button" title="en/XUL/button">button</a><br>
-     <a href="/en/XUL/browser" title="en/XUL/browser">browser</a><br>
-     <a href="/en/XUL/checkbox" title="en/XUL/checkbox">checkbox</a><br>
-     <a href="/en/XUL/caption" title="en/XUL/caption">caption</a><br>
-     <a href="/en/XUL/colorpicker" title="en/XUL/colorpicker">colorpicker</a><br>
-     <a href="/en/XUL/column" title="en/XUL/column">column</a><br>
-     <a href="/en/XUL/columns" title="en/XUL/columns">columns</a><br>
-     <a href="/en/XUL/commandset" title="en/XUL/commandset">commandset</a><br>
-     <a href="/en/XUL/command" title="en/XUL/command">command</a><br>
-     <a href="/en/XUL/conditions" title="en/XUL/conditions">conditions</a><br>
-     <a href="/en/XUL/content" title="en/XUL/content">content</a><br>
-     <a href="/en/XUL/datepicker" title="en/XUL/datepicker">datepicker</a><br>
-     <a href="/en/XUL/deck" title="en/XUL/deck">deck</a><br>
-     <a href="/en/XUL/description" title="en/XUL/description">description</a><br>
-     <a href="/en/XUL/dialog" title="en/XUL/dialog">dialog</a><br>
-     <a href="/en/XUL/dialogheader" title="en/XUL/dialogheader">dialogheader</a><br>
-     <a href="/en/XUL/dropmarker" title="en/XUL/dropmarker">dropmarker</a><br>
-     <a href="/en/XUL/editor" title="en/XUL/editor">editor</a><br>
-     <a href="/en/XUL/grid" title="en/XUL/grid">grid</a><br>
-     <a href="/en/XUL/grippy" title="en/XUL/grippy">grippy</a><br>
-     <a href="/en/XUL/groupbox" title="en/XUL/groupbox">groupbox</a><br>
-     <a href="/en/XUL/hbox" title="en/XUL/hbox">hbox</a><br>
-     <a href="/en/XUL/iframe" title="en/XUL/iframe">iframe</a><br>
-     <a href="/en/XUL/image" title="en/XUL/image">image</a><br>
-     <a href="/en/XUL/key" title="en/XUL/key">key</a><br>
-     <a href="/en/XUL/keyset" title="en/XUL/keyset">keyset</a><br>
-     <a href="/en/XUL/label" title="en/XUL/label">label</a><br>
-     <a href="/en/XUL/listbox" title="en/XUL/listbox">listbox</a><br>
-     <a href="/en/XUL/listcell" title="en/XUL/listcell">listcell</a><br>
-     <a href="/en/XUL/listcol" title="en/XUL/listcol">listcol</a><br>
-     <a href="/en/XUL/listcols" title="en/XUL/listcols">listcols</a><br>
-     <a href="/en/XUL/listhead" title="en/XUL/listhead">listhead</a><br>
-     <a href="/en/XUL/listheader" title="en/XUL/listheader">listheader</a><br>
-     <a href="/en/XUL/listitem" title="en/XUL/listitem">listitem</a></p>
-   </td>
-   <td>
-    <p><a href="/en/XUL/member" title="en/XUL/member">member</a><br>
-     <a href="/en/XUL/menu" title="en/XUL/menu">menu</a><br>
-     <a href="/en/XUL/menubar" title="en/XUL/menubar">menubar</a><br>
-     <a href="/en/XUL/menuitem" title="en/XUL/menuitem">menuitem</a><br>
-     <a href="/en/XUL/menulist" title="en/XUL/menulist">menulist</a><br>
-     <a href="/en/XUL/menupopup" title="en/XUL/menupopup">menupopup</a><br>
-     <a href="/en/XUL/menuseparator" title="en/XUL/menuseparator">menuseparator</a><br>
-     <a href="/en/XUL/notification" title="en/XUL/notification">notification</a><br>
-     <a href="/en/XUL/notificationbox" title="en/XUL/notificationbox">notificationbox</a><br>
-     <a href="/en/XUL/observes" title="en/XUL/observes">observes</a><br>
-     <a href="/en/XUL/overlay" title="en/XUL/overlay">overlay</a><br>
-     <a href="/en/XUL/page" title="en/XUL/page">page</a><br>
-     <a href="/en/XUL/panel" title="en/XUL/panel">panel</a><br>
-     <a href="/en/XUL/param" title="en/XUL/param">param</a><br>
-     <a href="/en/XUL/popupset" title="en/XUL/popupset">popupset</a><br>
-     <a href="/en/XUL/preference" title="en/XUL/preference">preference</a><br>
-     <a href="/en/XUL/preferences" title="en/XUL/preferences">preferences</a><br>
-     <a href="/en/XUL/prefpane" title="en/XUL/prefpane">prefpane</a><br>
-     <a href="/en/XUL/prefwindow" title="en/XUL/prefwindow">prefwindow</a><br>
-     <a href="/en/XUL/progressmeter" title="en/XUL/progressmeter">progressmeter</a><br>
-     <a href="/en/XUL/query" title="en/XUL/query">query</a><br>
-     <a href="/en/XUL/queryset" title="en/XUL/queryset">queryset</a><br>
-     <a href="/en/XUL/radio" title="en/XUL/radio">radio</a><br>
-     <a href="/en/XUL/radiogroup" title="en/XUL/radiogroup">radiogroup</a><br>
-     <a href="/en/XUL/resizer" title="en/XUL/resizer">resizer</a><br>
-     <a href="/en/XUL/richlistbox" title="en/XUL/richlistbox">richlistbox</a><br>
-     <a href="/en/XUL/richlistitem" title="en/XUL/richlistitem">richlistitem</a><br>
-     <a href="/en/XUL/row" title="en/XUL/row">row</a><br>
-     <a href="/en/XUL/rows" title="en/XUL/rows">rows</a><br>
-     <a href="/en/XUL/rule" title="en/XUL/rule">rule</a><br>
-     <a href="/en/XUL/scale" title="en/XUL/scale">scale</a><br>
-     <a href="/en/XUL/script" title="en/XUL/script">script</a><br>
-     <a href="/en/XUL/scrollbar" title="en/XUL/scrollbar">scrollbar</a><br>
-     <a href="/en/XUL/scrollbox" title="en/XUL/scrollbox">scrollbox</a><br>
-     <a href="/en/XUL/scrollcorner" title="en/XUL/scrollcorner">scrollcorner</a><br>
-     <a href="/en/XUL/separator" title="en/XUL/separator">separator</a><br>
-     <a href="/en/XUL/spacer" title="en/XUL/spacer">spacer</a><br>
-     <a href="/en/XUL/spinbuttons" title="en/XUL/spinbuttons">spinbuttons</a><br>
-     <a href="/en/XUL/splitter" title="en/XUL/splitter">splitter</a><br>
-     <a href="/en/XUL/stack" title="en/XUL/stack">stack</a><br>
-     <a href="/en/XUL/statusbar" title="en/XUL/statusbar">statusbar</a></p>
-   </td>
-   <td>
-    <p><a href="/en/XUL/statusbarpanel" title="en/XUL/statusbarpanel">statusbarpanel</a><br>
-     <a href="/en/XUL/stringbundle" title="en/XUL/stringbundle">stringbundle</a><br>
-     <a href="/en/XUL/stringbundleset" title="en/XUL/stringbundleset">stringbundleset</a><br>
-     <a href="/en/XUL/tab" title="en/XUL/tab">tab</a><br>
-     <a href="/en/XUL/tabbrowser" title="en/XUL/tabbrowser">tabbrowser</a> (Firefox-a partir de<br>
-     Firefox 3/Gecko 1.9)<br>
-     <a href="/en/XUL/tabbox" title="en/XUL/tabbox">tabbox</a><br>
-     <a href="/en/XUL/tabpanel" title="en/XUL/tabpanel">tabpanel</a><br>
-     <a href="/en/XUL/tabpanels" title="en/XUL/tabpanels">tabpanels</a><br>
-     <a href="/en/XUL/tabs" title="en/XUL/tabs">tabs</a><br>
-     <a href="/en/XUL/template" title="en/XUL/template">template</a><br>
-     <a href="/en/XUL/textnode" title="en/XUL/textnode">textnode</a><br>
-     <a href="/en/XUL/textbox" title="en/XUL/textbox">textbox</a><br>
-     <a href="/en/XUL/textbox_(Firefox_autocomplete)" title="en/XUL/textbox_(Firefox_autocomplete)">textbox (Firefox autocomplete)</a><br>
-     <a href="/en/XUL/textbox_(Mozilla_autocomplete)" title="en/XUL/textbox_(Mozilla_autocomplete)">textbox (Mozilla autocomplete)</a><br>
-     <a href="/en/XUL/timepicker" title="en/XUL/timepicker">timepicker</a><br>
-     <a href="/en/XUL/titlebar" title="en/XUL/titlebar">titlebar</a><br>
-     <a href="/en/XUL/toolbar" title="en/XUL/toolbar">toolbar</a><br>
-     <a href="/en/XUL/toolbarbutton" title="en/XUL/toolbarbutton">toolbarbutton</a><br>
-     <a href="/en/XUL/toolbargrippy" title="en/XUL/toolbargrippy">toolbargrippy</a><br>
-     <a href="/en/XUL/toolbaritem" title="en/XUL/toolbaritem">toolbaritem</a><br>
-     <a href="/en/XUL/toolbarpalette" title="en/XUL/toolbarpalette">toolbarpalette</a><br>
-     <a href="/en/XUL/toolbarseparator" title="en/XUL/toolbarseparator">toolbarseparator</a><br>
-     <a href="/en/XUL/toolbarset" title="en/XUL/toolbarset">toolbarset</a><br>
-     <a href="/en/XUL/toolbarspacer" title="en/XUL/toolbarspacer">toolbarspacer</a><br>
-     <a href="/en/XUL/toolbarspring" title="en/XUL/toolbarspring">toolbarspring</a><br>
-     <a href="/en/XUL/toolbox" title="en/XUL/toolbox">toolbox</a><br>
-     <a href="/en/XUL/tooltip" title="en/XUL/tooltip">tooltip</a><br>
-     <a href="/en/XUL/tree" title="en/XUL/tree">tree</a><br>
-     <a href="/en/XUL/treecell" title="en/XUL/treecell">treecell</a><br>
-     <a href="/en/XUL/treechildren" title="en/XUL/treechildren">treechildren</a><br>
-     <a href="/en/XUL/treecol" title="en/XUL/treecol">treecol</a><br>
-     <a href="/en/XUL/treecols" title="en/XUL/treecols">treecols</a><br>
-     <a href="/en/XUL/treeitem" title="en/XUL/treeitem">treeitem</a><br>
-     <a href="/en/XUL/treerow" title="en/XUL/treerow">treerow</a><br>
-     <a href="/en/XUL/treeseparator" title="en/XUL/treeseparator">treeseparator</a><br>
-     <a href="/en/XUL/triple" title="en/XUL/triple">triple</a><br>
-     <a href="/en/XUL/vbox" title="en/XUL/vbox">vbox</a><br>
-     <a href="/en/XUL/where" title="en/XUL/where">where</a><br>
-     <a href="/en/XUL/window" title="en/XUL/window">window</a><br>
-     <a href="/en/XUL/wizard" title="en/XUL/wizard">wizard</a><br>
-     <a href="/en/XUL/wizardpage" title="en/XUL/wizardpage">wizardpage</a></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-<h1 id="Referencia_de_XUL">Referencia de XUL</h1>
-<p>« <a href="/es/docs/XUL" title="es/XUL">Referencia de XUL</a> «</p>
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th colspan="3">Elementos XUL por categoría</th>
-  </tr>
-  <tr>
-   <td>
-    <p><u><strong>VENTANAS</strong></u></p>
-    <p><a href="/en/XUL/dialog" title="en/XUL/dialog">dialog</a><br>
-     <a href="/en/XUL/overlay" title="en/XUL/overlay">overlay</a><br>
-     <a href="/en/XUL/page" title="en/XUL/page">page</a><br>
-     <a href="/en/XUL/window" title="en/XUL/window">window</a><br>
-     <a href="/en/XUL/wizard" title="en/XUL/wizard">wizard</a><br>
-     <a href="/en/XUL/wizardpage" title="en/XUL/wizardpage">wizardpage</a><br>
-     <a href="/en/XUL/preference" title="en/XUL/preference">preference</a><br>
-     <a href="/en/XUL/preferences" title="en/XUL/preferences">preferences</a><br>
-     <a href="/en/XUL/prefpane" title="en/XUL/prefpane">prefpane</a><br>
-     <a href="/en/XUL/prefwindow" title="en/XUL/prefwindow">prefwindow</a></p>
-    <p><u><strong>ESTRUCTURA<br>
-     DE VENTANAS</strong></u></p>
-    <p><a href="/en/XUL/browser" title="en/XUL/browser">browser</a><br>
-     <a href="/en/XUL/tabbrowser" title="en/XUL/tabbrowser">tabbrowser</a><br>
-     <a href="/en/XUL/editor" title="en/XUL/editor">editor</a><br>
-     <a href="/en/XUL/iframe" title="en/XUL/iframe">iframe</a><br>
-     <a href="/en/XUL/titlebar" title="en/XUL/titlebar">titlebar</a><br>
-     <a href="/en/XUL/resizer" title="en/XUL/resizer">resizer</a><br>
-     <a href="/en/XUL/statusbar" title="en/XUL/statusbar">statusbar</a><br>
-     <a href="/en/XUL/statusbarpanel" title="en/XUL/statusbarpanel">statusbarpanel</a><br>
-     <a href="/en/XUL/dialogheader" title="en/XUL/dialogheader">dialogheader</a><br>
-     <a href="/en/XUL/notification" title="en/XUL/notification">notification</a><br>
-     <a href="/en/XUL/notificationbox" title="en/XUL/notificationbox">notificationbox</a></p>
-    <p><u><strong>MENUS Y VENTANAS<br>
-     EMERGENTES</strong></u></p>
-    <p><a href="/en/XUL/menubar" title="en/XUL/menubar">menubar</a><br>
-     <a href="/en/XUL/menu" title="en/XUL/menu">menu</a><br>
-     <a href="/en/XUL/menuitem" title="en/XUL/menuitem">menuitem</a><br>
-     <a href="/en/XUL/menuseparator" title="en/XUL/menuseparator">menuseparator</a><br>
-     <a href="/en/XUL/menupopup" title="en/XUL/menupopup">menupopup</a><br>
-     <a href="/en/XUL/panel" title="en/XUL/panel">panel</a><br>
-     <a href="/en/XUL/tooltip" title="en/XUL/tooltip">tooltip</a><br>
-     <a href="/en/XUL/popupset" title="en/XUL/popupset">popupset</a></p>
-    <p><u><strong>BARRAS DE<br>
-     HERRAMIENTAS</strong></u></p>
-    <p><a href="/en/XUL/toolbar" title="en/XUL/toolbar">toolbar</a><br>
-     <a href="/en/XUL/toolbarbutton" title="en/XUL/toolbarbutton">toolbarbutton</a><br>
-     <a href="/en/XUL/toolbargrippy" title="en/XUL/toolbargrippy">toolbargrippy</a><br>
-     <a href="/en/XUL/toolbaritem" title="en/XUL/toolbaritem">toolbaritem</a><br>
-     <a href="/en/XUL/toolbarpalette" title="en/XUL/toolbarpalette">toolbarpalette</a><br>
-     <a href="/en/XUL/toolbarseparator" title="en/XUL/toolbarseparator">toolbarseparator</a><br>
-     <a href="/en/XUL/toolbarset" title="en/XUL/toolbarset">toolbarset</a><br>
-     <a href="/en/XUL/toolbarspacer" title="en/XUL/toolbarspacer">toolbarspacer</a><br>
-     <a href="/en/XUL/toolbarspring" title="en/XUL/toolbarspring">toolbarspring</a><br>
-     <a href="/en/XUL/toolbox" title="en/XUL/toolbox">toolbox</a></p>
-    <p><u><strong>PESTAÑAS Y<br>
-     AGRUPAMIENTO</strong></u></p>
-    <p><a href="/en/XUL/tabbox" title="en/XUL/tabbox">tabbox</a><br>
-     <a href="/en/XUL/tabs" title="en/XUL/tabs">tabs</a><br>
-     <a href="/en/XUL/tab" title="en/XUL/tab">tab</a><br>
-     <a href="/en/XUL/tabpanels" title="en/XUL/tabpanels">tabpanels</a><br>
-     <a href="/en/XUL/tabpanel" title="en/XUL/tabpanel">tabpanel</a><br>
-     <a href="/en/XUL/groupbox" title="en/XUL/groupbox">groupbox</a><br>
-     <a href="/en/XUL/caption" title="en/XUL/caption">caption</a><br>
-     <a href="/en/XUL/separator" title="en/XUL/separator">separator</a><br>
-     <a href="/en/XUL/spacer" title="en/XUL/spacer">spacer</a></p>
-   </td>
-   <td>
-    <p><u><strong>CONTROLES</strong></u></p>
-    <p><a href="/en/XUL/button" title="en/XUL/button">button</a><br>
-     <a href="/en/XUL/checkbox" title="en/XUL/checkbox">checkbox</a><br>
-     <a href="/en/XUL/colorpicker" title="en/XUL/colorpicker">colorpicker</a><br>
-     <a href="/en/XUL/datepicker" title="en/XUL/datepicker">datepicker</a><br>
-     <a href="/en/XUL/menulist" title="en/XUL/menulist">menulist</a><br>
-     <a href="/en/XUL/progressmeter" title="en/XUL/progressmeter">progressmeter</a><br>
-     <a href="/en/XUL/radio" title="en/XUL/radio">radio</a><br>
-     <a href="/en/XUL/radiogroup" title="en/XUL/radiogroup">radiogroup</a><br>
-     <a href="/en/XUL/scale" title="en/XUL/scale">scale</a><br>
-     <a href="/en/XUL/splitter" title="en/XUL/splitter">splitter</a><br>
-     <a href="/en/XUL/textbox" title="en/XUL/textbox">textbox</a><br>
-     <a href="/en/XUL/textbox_(Firefox_autocomplete)" title="en/XUL/textbox_(Firefox_autocomplete)">textbox (Firefox autocomplete)</a><br>
-     <a href="/en/XUL/textbox_(Mozilla_autocomplete)" title="en/XUL/textbox_(Mozilla_autocomplete)">textbox (Mozilla autocomplete)</a><br>
-     <a href="/en/XUL/timepicker" title="en/XUL/timepicker">timepicker</a></p>
-    <p><u><strong>TEXTO E<br>
-     IMAGENES</strong></u></p>
-    <p><a href="/en/XUL/description" title="en/XUL/description">description</a><br>
-     <a href="/en/XUL/label" title="en/XUL/label">label</a><br>
-     <a href="/en/XUL/image" title="en/XUL/image">image</a></p>
-    <p><u><strong>LISTSS</strong></u></p>
-    <p><a href="/en/XUL/listbox" title="en/XUL/listbox">listbox</a><br>
-     <a href="/en/XUL/listitem" title="en/XUL/listitem">listitem</a><br>
-     <a href="/en/XUL/listcell" title="en/XUL/listcell">listcell</a><br>
-     <a href="/en/XUL/listcol" title="en/XUL/listcol">listcol</a><br>
-     <a href="/en/XUL/listcols" title="en/XUL/listcols">listcols</a><br>
-     <a href="/en/XUL/listhead" title="en/XUL/listhead">listhead</a><br>
-     <a href="/en/XUL/listheader" title="en/XUL/listheader">listheader</a><br>
-     <a href="/en/XUL/richlistbox" title="en/XUL/richlistbox">richlistbox</a><br>
-     <a href="/en/XUL/richlistitem" title="en/XUL/richlistitem">richlistitem</a></p>
-    <p><u><strong>ARBOLES</strong></u></p>
-    <p><a href="/en/XUL/tree" title="en/XUL/tree">tree</a><br>
-     <a href="/en/XUL/treecell" title="en/XUL/treecell">treecell</a><br>
-     <a href="/en/XUL/treechildren" title="en/XUL/treechildren">treechildren</a><br>
-     <a href="/en/XUL/treecol" title="en/XUL/treecol">treecol</a><br>
-     <a href="/en/XUL/treecols" title="en/XUL/treecols">treecols</a><br>
-     <a href="/en/XUL/treeitem" title="en/XUL/treeitem">treeitem</a><br>
-     <a href="/en/XUL/treerow" title="en/XUL/treerow">treerow</a><br>
-     <a href="/en/XUL/treeseparator" title="en/XUL/treeseparator">treeseparator</a></p>
-    <p> </p>
-   </td>
-   <td>
-    <p><u><strong>DISPOSICION</strong></u></p>
-    <p><a href="/en/XUL/box" title="en/XUL/box">box</a><br>
-     <a href="/en/XUL/hbox" title="en/XUL/hbox">hbox</a><br>
-     <a href="/en/XUL/vbox" title="en/XUL/vbox">vbox</a><br>
-     <a href="/en/XUL/bbox" title="en/XUL/bbox">bbox</a><br>
-     <a href="/en/XUL/deck" title="en/XUL/deck">deck</a><br>
-     <a href="/en/XUL/stack" title="en/XUL/stack">stack</a><br>
-     <a href="/en/XUL/grid" title="en/XUL/grid">grid</a><br>
-     <a href="/en/XUL/columns" title="en/XUL/columns">columns</a><br>
-     <a href="/en/XUL/column" title="en/XUL/column">column</a><br>
-     <a href="/en/XUL/rows" title="en/XUL/rows">rows</a><br>
-     <a href="/en/XUL/row" title="en/XUL/row">row</a><br>
-     <a href="/en/XUL/scrollbox" title="en/XUL/scrollbox">scrollbox</a></p>
-    <p><u><strong>PLANTILLAS</strong></u></p>
-    <p><a href="/en/XUL/action" title="en/XUL/action">action</a><br>
-     <a href="/en/XUL/assign" title="en/XUL/assign">assign</a><br>
-     <a href="/en/XUL/binding" title="en/XUL/binding">binding</a><br>
-     <a href="/en/XUL/bindings" title="en/XUL/bindings">bindings</a><br>
-     <a href="/en/XUL/conditions" title="en/XUL/conditions">conditions</a><br>
-     <a href="/en/XUL/content" title="en/XUL/content">content</a><br>
-     <a href="/en/XUL/member" title="en/XUL/member">member</a><br>
-     <a href="/en/XUL/param" title="en/XUL/param">param</a><br>
-     <a href="/en/XUL/query" title="en/XUL/query">query</a><br>
-     <a href="/en/XUL/queryset" title="en/XUL/queryset">queryset</a><br>
-     <a href="/en/XUL/rule" title="en/XUL/rule">rule</a><br>
-     <a href="/en/XUL/template" title="en/XUL/template">template</a><br>
-     <a href="/en/XUL/textnode" title="en/XUL/textnode">textnode</a><br>
-     <a href="/en/XUL/triple" title="en/XUL/triple">triple</a><br>
-     <a href="/en/XUL/where" title="en/XUL/where">where</a></p>
-    <p><u><strong>SCRIPTING</strong></u></p>
-    <p><a href="/en/XUL/script" title="en/XUL/script">script</a><br>
-     <a href="/en/XUL/commandset" title="en/XUL/commandset">commandset</a><br>
-     <a href="/en/XUL/command" title="en/XUL/command">command</a><br>
-     <a href="/en/XUL/broadcaster" title="en/XUL/broadcaster">broadcaster</a><br>
-     <a href="/en/XUL/broadcasterset" title="en/XUL/broadcasterset">broadcasterset</a><br>
-     <a href="/en/XUL/observes" title="en/XUL/observes">observes</a><br>
-     <a href="/en/XUL/key" title="en/XUL/key">key</a><br>
-     <a href="/en/XUL/keyset" title="en/XUL/keyset">keyset</a><br>
-     <a href="/en/XUL/stringbundle" title="en/XUL/stringbundle">stringbundle</a><br>
-     <a href="/en/XUL/stringbundleset" title="en/XUL/stringbundleset">stringbundleset</a></p>
-    <p><u><strong>ELEMENTOS DE AYUDA</strong></u></p>
-    <p><a href="/en/XUL/scrollbar" title="en/XUL/scrollbar">arrowscrollbox</a><br>
-     <a href="/en/XUL/dropmarker" title="en/XUL/dropmarker">dropmarker</a><br>
-     <a href="/en/XUL/grippy" title="en/XUL/grippy">grippy</a><br>
-     <a href="/en/XUL/scrollbar" title="en/XUL/scrollbar">scrollbar</a><br>
-     <a href="/en/XUL/scrollcorner" title="en/XUL/scrollcorner">scrollcorner</a><br>
-     <a href="/en/XUL/spinbuttons" title="en/XUL/spinbuttons">spinbuttons</a></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-<h3 id="Other_XUL_lists" name="Other_XUL_lists">Otras listas XUL</h3>
-<ul>
- <li><a href="/en/XUL/Attribute" title="en/XUL/Attribute">Todos los atributos</a></li>
- <li><a href="/en/XUL/Property" title="en/XUL/Property">Todas las propiedades</a></li>
- <li><a href="/en/XUL/Method" title="en/XUL/Method">Todos los métodos</a></li>
- <li><a href="/en/XUL_element_attributes" title="en/XUL_element_attributes">Atributos definidos por todos los elementos XUL</a></li>
- <li><a href="/en/XUL/Style" title="en/XUL/Style">Clases de estilos</a></li>
- <li><a href="/en/XUL/Events" title="en/XUL/Events">Manipuladores de eventos</a></li>
- <li><a href="/en/XUL/Deprecated//Defunct_Markup" title="en/XUL/Deprecated//Defunct_Markup">Obsoletos/Marcas extintas</a></li>
-</ul>
diff --git a/files/es/referencia_dom_de_gecko/cómo_espacioenblanco/index.html b/files/es/referencia_dom_de_gecko/cómo_espacioenblanco/index.html
deleted file mode 100644
index a943896180..0000000000
--- a/files/es/referencia_dom_de_gecko/cómo_espacioenblanco/index.html
+++ /dev/null
@@ -1,476 +0,0 @@
----
-title: 'Cómo manejan el espacio en blanco HTML, CSS y el DOM'
-slug: Referencia_DOM_de_Gecko/Cómo_espacioenblanco
-tags:
-  - CSS
-  - DOM
-  - HTML
-  - JavaScript
-  - espacioenblanco
-  - whitespace
-translation_of: Web/API/Document_Object_Model/Whitespace
----
-<div>{{APIRef("DOM")}}</div>
-
-<p>La presencia de espacios en blanco en el <a href="/es/docs/Web/API/Document_Object_Model">DOM</a> puede causar problemas de diseño y dificultar la manipulación del árbol de contenido de formas inesperadas, dependiendo de dónde se encuentra. Este artículo explora cuándo pueden surgir dificultades y analiza qué se puede hacer para mitigar los problemas resultantes.</p>
-
-<h2 id="¿Qué_es_el_espacio_en_blanco">¿Qué es el espacio en blanco?</h2>
-
-<p>El espacio en blanco es cualquier cadena de texto compuesta solo por espacios, tabulaciones o saltos de línea (para ser precisos, secuencias CRLF, retornos de carro o avances de línea). Estos caracteres te permiten formatear tu código de una manera que lo hará fácilmente legible por ti y otras personas. De hecho, gran parte de nuestro código fuente está lleno de estos caracteres de espacio en blanco, y solo tendemos a deshacernos de ellos en un paso de compilación de producción para reducir el tamaño de descarga del código.</p>
-
-<h3 id="¿HTML_ignora_en_gran_medida_los_espacios_en_blanco">¿HTML ignora en gran medida los espacios en blanco?</h3>
-
-<p>En el caso de HTML, los espacios en blanco se ignoran en gran medida: los espacios en blanco entre palabras se tratan como un solo carácter y los espacios en blanco al principio y al final de los elementos y los elementos externos se ignoran. Tomemos el siguiente ejemplo minimalista:</p>
-
-<h3 class="hidden" id="HTML_largely_ignores_whitespace">HTML largely ignores whitespace?</h3>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-
-    &lt;h1&gt;       ¡Hola      mundo!     &lt;/h1&gt;</pre>
-
-<p>{{EmbedLiveSample('HTML_largely_ignores_whitespace')}}</p>
-
-<p>Este código fuente contiene un par de avances de línea después del <code>DOCTYPE</code> y un montón de caracteres de espacio antes, después y dentro del elemento <code>&lt;h1&gt;</code>, pero al navegador no parece importarle en absoluto y solo muestra las palabras "¡Hola mundo!" como si estos caracteres no existieran en absoluto:</p>
-
-<p>Esto es para que los espacios en blanco no afecten el diseño de tu página. Crear espacio alrededor y dentro de los elementos es el trabajo de CSS.</p>
-
-<h3 id="¿Qué_sucede_con_los_espacios_en_blanco">¿Qué <em>sucede</em> con los espacios en blanco?</h3>
-
-<p>Sin embargo, no solo desaparecen.</p>
-
-<p>Cualquier carácter de espacio en blanco que esté fuera de los elementos HTML del documento original se representan en el DOM. Esto es necesario internamente para que el editor pueda preservar el formato de los documentos. Esto significa que:</p>
-
-<ul>
- <li>Habrá algunos nodos de texto que contienen solo espacios en blanco, y</li>
- <li>Algunos nodos de texto tendrán espacios en blanco al principio o al final.</li>
-</ul>
-
-<p>Tomemos el siguiente documento, por ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-  &lt;title&gt;Mi Documento&lt;/title&gt;
-&lt;/head&gt;
-&lt;body&gt;
-  &lt;h1&gt;Encabezado&lt;/h1&gt;
-  &lt;p&gt;
-    Párrafo
-  &lt;/p&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>El árbol del DOM para esto se ve así:</p>
-
-<p><img alt="árbol de dom equivalente al ejemplo de HTML anterior" src="https://mdn.mozillademos.org/files/17084/dom-string.png" style="display: block; height: 288px; margin: 0 auto; width: 562px;"></p>
-
-<p>Conservar caracteres de espacio en blanco en el DOM es útil de muchas maneras, pero hay ciertos lugares donde esto hace que ciertos diseños sean más difíciles de implementar y causa problemas a los desarrolladores que quieren iterar a través de los nodos del DOM. Veremos estas y algunas soluciones más adelante.</p>
-
-<h3 id="¿CSS_cómo_procesa_los_espacios_en_blanco">¿CSS cómo procesa los espacios en blanco?</h3>
-
-<p>La mayoría de los espacios en blanco se ignoran, no todos. En el ejemplo anterior, uno de los espacios entre "!Hola" y "mundo!" todavía existe cuando la página se representa en un navegador. Hay reglas en el motor del navegador que deciden qué caracteres de espacio en blanco son útiles y cuáles no; estos se especifican al menos en parte en el <a href="https://www.w3.org/TR/css-text-3">Módulo de texto CSS Nivel 3</a>, y especialmente las partes sobre la <a href="https://www.w3.org/TR/css-text-3/#white-space-property">propiedad <code>white-space</code> en CSS</a> y <a href="https://www.w3.org/TR/css-text-3/#white-space-processing">detalles de procesamiento del espacio en blanco</a>, pero también ofrecemos una explicación más sencilla a continuación.</p>
-
-<p>Tomemos otro ejemplo realmente simple. Para hacerlo más fácil, ilustramos todos los espacios con ◦, todas las tabulaciones con ⇥ y todos los saltos de línea con ⏎:</p>
-
-<p>Este ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola◦⏎
-⇥⇥⇥⇥&lt;span&gt;◦mundo!&lt;/span&gt;⇥◦◦&lt;/h1&gt;</pre>
-
-<p>se representa en el navegador así:</p>
-
-<div class="hidden">
-<h4 id="Hidden_example">Hidden example</h4>
-
-<pre class="brush: html notranslate">&lt;h1&gt;   ¡Hola
-    &lt;span&gt; mundo!&lt;/span&gt;   &lt;/h1&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample('Hidden_example')}}</p>
-
-<p>El elemento <code>&lt;h1&gt;</code> contiene solo elementos en línea. De hecho contiene:</p>
-
-<ul>
- <li>Un nodo de texto (que consta de algunos espacios, la palabra "¡Hola" y algunas tabulaciones).</li>
- <li>Un elemento en línea (el <code>&lt;span&gt;</code>, que contiene un espacio, y la palabra "mundo!").</li>
- <li>Otro nodo de texto (que consta solo de tabulaciones y espacios).</li>
-</ul>
-
-<p>Debido a esto, establece lo que se llama un {{cssxref("Inline_formatting_context", "contexto de formato en línea")}}. Este es uno de los posibles contextos de representación de diseño con los que funcionan los motores del navegador.</p>
-
-<p>Dentro de este contexto, el procesamiento de caracteres de espacio en blanco se puede resumir de la siguiente manera:</p>
-
-<ol>
- <li>
-  <p>Primero, todos los espacios y tabulaciones inmediatamente antes y después de un salto de línea se ignoran, por lo que, si tomamos nuestro marcado de ejemplo anterior y aplicamos esta primera regla, obtenemos:</p>
-
-  <pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola⏎
-&lt;span&gt;◦mundo!&lt;/span&gt;⇥◦◦&lt;/h1&gt;</pre>
- </li>
- <li>
-  <p>A continuación, todos los caracteres de tabulación se tratan como caracteres de espacio, por lo que el ejemplo se convierte en:</p>
-
-  <pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola⏎
-&lt;span&gt;◦mundo!&lt;/span&gt;◦◦◦&lt;/h1&gt;</pre>
- </li>
- <li>
-  <p>A continuación, los saltos de línea se convierten en espacios:</p>
-
-  <pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola◦&lt;span&gt;◦mundo!&lt;/span&gt;◦◦◦&lt;/h1&gt;</pre>
- </li>
- <li>
-  <p>Después de eso, cualquier espacio inmediatamente después de otro espacio (incluso a través de dos elementos en línea separados) se ignora, por lo que terminamos con:</p>
-
-  <pre class="brush: html notranslate">&lt;h1&gt;◦¡Hola◦&lt;span&gt;mundo!&lt;/span&gt;◦&lt;/h1&gt;</pre>
- </li>
- <li>
-  <p>Y finalmente, las secuencias de espacios al principio y al final de una línea se eliminan, por lo que eventualmente obtenemos esto:</p>
-
-  <pre class="brush: html notranslate">&lt;h1&gt;¡Hola◦&lt;span&gt;mundo!&lt;/span&gt;&lt;/h1&gt;</pre>
- </li>
-</ol>
-
-<p>Es por eso que las personas que visitan la página web simplemente verán la frase "¡Hola mundo!" muy bien escrita en la parte superior de la página, en lugar de un "!Hola" con una sangría extraña, seguido de un "mundo!" en la línea debajo de esa.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: <a href="/es/docs/Tools">Firefox DevTools</a> ha admitido el resaltado de nodos de texto desde la versión 52, lo que facilita ver exactamente qué contenido hay dentro de los nodos de espacios en blanco. Los nodos de espacios en blanco puros están marcados con una etiqueta "<code>whitespace</code>".</p>
-</div>
-
-<h3 id="Espacio_en_blanco_en_contextos_de_formato_de_bloque">Espacio en blanco en contextos de formato de bloque</h3>
-
-<p>Anteriormente, solo miramos elementos que contienen elementos en línea y contextos de formato en línea. Si un elemento contiene al menos un elemento de bloque, entonces establece lo que se llama un {{cssxref("Block_formatting_context", "contexto de formato de bloque")}}.</p>
-
-<p>En este contexto, los espacios en blanco se tratan de manera muy diferente. Veamos un ejemplo para explicar cómo. Hemos marcado los espacios en blanco como antes.</p>
-
-<pre class="brush: html notranslate">&lt;body&gt;⏎
-⇥&lt;div&gt;◦◦¡Hola◦◦&lt;/div&gt;⏎
-⏎
-◦◦◦&lt;div&gt;◦◦mundo!◦◦&lt;/div&gt;◦◦⏎
-&lt;/body&gt;</pre>
-
-<p>Tenemos 3 nodos de texto que contienen solo espacios en blanco, uno antes del primer <code>&lt;div&gt;</code>, uno entre los 2 <code>&lt;div&gt;</code>s y uno después del segundo <code>&lt;div&gt;</code>.</p>
-
-<p>Esto se renderiza así:</p>
-
-<div class="hidden">
-<h4 id="Hidden_example_2">Hidden example 2</h4>
-
-<pre class="brush: html notranslate">&lt;body&gt;
-  &lt;div&gt;  ¡Hola  &lt;/div&gt;
-
-   &lt;div&gt;  mundo!   &lt;/div&gt;
-&lt;/body&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample('Hidden_example_2')}}</p>
-
-<p>Podemos resumir cómo se maneja el espacio en blanco aquí de la siguiente manera (puede haber algunas pequeñas diferencias en el comportamiento exacto entre los navegadores, pero básicamente, esto funciona):</p>
-
-<ol>
- <li>
-  <p>Debido a que estamos dentro de un contexto de formato de bloque, todo debe ser un bloque, por lo que nuestros 3 nodos de texto también se convierten en bloques, al igual que los 2 <code>&lt;div&gt;</code>s. Los bloques ocupan todo el ancho disponible y se apilan unos encima de los otros, lo cual significa que terminamos con un diseño compuesto por esta lista de bloques:</p>
-
-  <pre class="brush: html notranslate">&lt;block&gt;⏎⇥&lt;/block&gt;
-&lt;block&gt;◦◦¡Hola◦◦&lt;/block&gt;
-&lt;block&gt;⏎◦◦◦&lt;/block&gt;
-&lt;block&gt;◦◦mundo!◦◦&lt;/block&gt;
-&lt;block&gt;◦◦⏎&lt;/block&gt;</pre>
- </li>
- <li>
-  <p>Esto luego se simplifica aún más aplicando las reglas de procesamiento para espacios en blanco en contextos de formato en línea a estos bloques:</p>
-
-  <pre class="brush: html notranslate">&lt;block&gt;&lt;/block&gt;
-&lt;block&gt;¡Hola&lt;/block&gt;
-&lt;block&gt;&lt;/block&gt;
-&lt;block&gt;mundo!&lt;/block&gt;
-&lt;block&gt;&lt;/block&gt;</pre>
- </li>
- <li>
-  <p>Los 3 bloques vacíos que tenemos ahora no van a ocupar ningún espacio en el diseño final, porque no contienen nada, así que terminaremos con solo 2 bloques ocupando espacio en la página. Las personas que visitan la página web ven las palabras "!Hola" y "mundo!" en 2 líneas separadas, ya que esperarías que se distribuyeran 2 <code>&lt;div&gt;</code>s. El motor del navegador esencialmente ha ignorado todos los espacios en blanco que se agregaron en el código fuente.</p>
- </li>
-</ol>
-
-<h2 id="Espacios_entre_elementos_en_línea_y_bloques_en_línea">Espacios entre elementos en línea y bloques en línea</h2>
-
-<p>Ahora analicemos algunos problemas que pueden surgir debido a los espacios en blanco y qué se puede hacer al respecto. En primer lugar, veremos qué sucede con los espacios entre los elementos en línea y de bloque en línea. De hecho, ya vimos esto en nuestro primer ejemplo, cuando describimos cómo se procesan los espacios en blanco dentro de los contextos de formato en línea.</p>
-
-<p>Dijimos que había reglas para ignorar la mayoría de los caracteres, pero que los caracteres que separan palabras permanecen. Cuando solo se trata de elementos a nivel de bloque como <code>&lt;p&gt;</code> que solo contienen elementos en línea como <code>&lt;em&gt;</code>, <code>&lt;strong&gt;</code>, <code>&lt;span&gt;</code>, etc., normalmente no te importa esto porque el espacio en blanco adicional que llega al diseño es útil para separar las palabras en la oración.</p>
-
-<p>Sin embargo, se vuelve más interesante cuando comienzas a usar elementos <code>inline-block</code>. Estos elementos se comportan como elementos en línea en el exterior y como bloques en el interior, y a menudo se utilizan para mostrar piezas de la IU más complejas que solo texto, una al lado de la otra en la misma línea, por ejemplo, elementos del menú de navegación.</p>
-
-<p>Debido a que son bloques, muchas personas esperan que se comporten como tales, pero en realidad no es así. Si hay espacios en blanco de formato entre elementos en línea adyacentes, esto dará como resultado un espacio en el diseño, al igual que los espacios entre palabras en el texto.</p>
-
-<p>Considera este ejemplo (nuevamente, los espacios en blanco en el HTML están marcados para que sean visibles):</p>
-
-<pre class="brush: css notranslate" id="ef6f">.people-list {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-}
-
-.people-list li {
-  display: inline-block;
-  width: 2em;
-  height: 2em;
-  background: #f06;
-  border: 1px solid;
-}
-</pre>
-
-<pre class="brush: html notranslate" id="24bb">&lt;ul class="people-list"&gt;⏎
-
-◦◦&lt;li&gt;&lt;/li&gt;⏎
-
-◦◦&lt;li&gt;&lt;/li&gt;⏎
-
-◦◦&lt;li&gt;&lt;/li&gt;⏎
-
-◦◦&lt;li&gt;&lt;/li&gt;⏎
-
-◦◦&lt;li&gt;&lt;/li&gt;⏎
-
-&lt;/ul&gt;</pre>
-
-<p>Esto se traduce de la siguiente manera:</p>
-
-<div class="hidden">
-<h3 id="Hidden_example_3">Hidden example 3</h3>
-
-<pre class="brush: css notranslate" id="ef6f">.people-list { list-style-type: none; margin: 0; padding: 0; }
-.people-list li { display: inline-block; width: 2em; height: 2em; background: #f06; border: 1px solid; }
-</pre>
-
-<pre class="brush: html notranslate" id="24bb">&lt;ul class="people-list"&gt;
-
-  &lt;li&gt;&lt;/li&gt;
-
-  &lt;li&gt;&lt;/li&gt;
-
-  &lt;li&gt;&lt;/li&gt;
-
-  &lt;li&gt;&lt;/li&gt;
-
-  &lt;li&gt;&lt;/li&gt;
-
-&lt;/ul&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample('Hidden_example_3')}}</p>
-
-<p>Probablemente no desees los espacios entre los bloques — dependiendo del caso de uso (¿esta es una lista de avatares o botones de navegación horizontales?), Probablemente desees que los lados del elemento estén alineados entre sí y poder controlar cualquier espacio tú mismo.</p>
-
-<p>El <em>Inspector HTML de Firefox DevTools</em> resaltará los nodos de texto y también te mostrará exactamente qué áreas están ocupando los elementos, lo que es útil si te preguntas qué está causando el problema y tal vez estés pensando que tienes un margen adicional allí o algo así.</p>
-
-<p><img alt="Espacio en blanco en Devtools" src="https://mdn.mozillademos.org/files/17085/whitespace-devtools.png" style="border-style: solid; border-width: 1px; height: 454px; width: 797px;"></p>
-
-<p>Hay algunas formas de solucionar este problema:</p>
-
-<p>Utiliza <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a> para crear la lista horizontal de elementos en lugar de probar una solución de <code>inline-block</code>. Esto se encarga de todo por ti y definitivamente es la solución preferida:</p>
-
-<pre class="brush: css notranslate">ul {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-}</pre>
-
-<p>Si necesitas confiar en <code>inline-block</code>, puedes establecer el {{cssxref("font-size")}} de la lista a 0. Esto solo trabaja si tus bloques no tienen el tamaño <code>ems</code> (según el <code>font-size</code>, por lo que el tamaño del bloque también terminaría siendo 0). <code>rems</code> sería una buena opción aquí:</p>
-
-<pre class="brush: css notranslate">ul {
-  font-size: 0;
-  ...
-}
-
-li {
-  display: inline-block;
-  width: 2rem;
-  height: 2rem;
-  ...
-}
-</pre>
-
-<p>O puedes establecer un margen negativo en los elementos de la lista:</p>
-
-<pre class="brush: css notranslate">li {
-  display: inline-block;
-  width: 2rem;
-  height: 2rem;
-  margin-right: -0.25rem;
-}</pre>
-
-<p>También puedes resolver este problema colocando los elementos de tu lista en la misma línea en la fuente, lo cual hace que los nodos de espacios en blanco no se creen en primer lugar:</p>
-
-<pre class="brush: html notranslate">&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;</pre>
-
-<h2 id="Recorrido_del_DOM_y_el_espacio_en_blanco">Recorrido del DOM y el espacio en blanco</h2>
-
-<p>Al intentar realizar una manipulación del <a href="/es/docs/Web/API/Document_Object_Model">DOM</a> en JavaScript, también puedes encontrar problemas debido a los nodos de espacios en blanco. Por ejemplo, si tienes una referencia a un nodo padre y deseas afectar su primer elemento hijo usando <a href="/es/docs/Web/API/Node/firstChild"><code>Node.firstChild</code></a>, si hay un nodo de espacio en blanco deshonesto justo después de la etiqueta de apertura principal, no obtendrás el resultado que esperabas. Se seleccionaría el nodo de texto en lugar del elemento al que deseas afectar.</p>
-
-<p>Veamos otro ejemplo, si tienes un determinado subconjunto de elementos en los que deseas hacer algo en función de si están vacíos (no tienen nodos secundarios) o, no puedes verificar si cada elemento está vacío usando algo como <a href="/es/docs/Web/API/Node/hasChildNodes"><code>Node.hasChildNodes()</code></a>, pero nuevamente, si algún elemento destino contiene nodos de texto, podrías terminar con resultados falsos.</p>
-
-<h2 id="Funciones_auxiliares_de_espacios_en_blanco">Funciones auxiliares de espacios en blanco</h2>
-
-<p>El siguiente código JavaScript define varias funciones que facilitan el manejo de espacios en blanco en el DOM:</p>
-
-<pre class="brush: js notranslate">/**
- * En todo, el espacio en blanco se define como uno de los caracteres
- *  "\t" TAB \u0009
- *  "\n" LF  \u000A
- *  "\r" CR  \u000D
- *  " "  SPC \u0020
- *
- * Esto no usa la "\s" de Javascript porque eso incluye
- * espacios irrompibles (y también algunos otros caracteres).
- */
-
-
-/**
- * Determina si el contenido de texto de un nodo es completamente de espacios en blanco.
- *
- * @param nod  Un nodo que implementa la interfaz | CharacterData | (es decir,
- *             un nodo |Text|, |Comment| o |CDATASection|
- * @return     True si todo el contenido de texto de |nod| es espacio en blanco,
- *             de lo contrario false.
- */
-function is_all_ws( nod )
-{
-  // Usa las características de String y RegExp de ECMA-262 Edición 3
-  return !(/[^\t\n\r ]/.test(nod.textContent));
-}
-
-
-/**
- * Determina si un nodo debe ser ignorado por las funciones del iterador.
- *
- * @param nod  Un objeto implementando la interfaz |Node| de DOM1.
- * @return     true si el nodo es:
- *                1) Un nodo |Text| en que todo es espacio en blanco
- *                2) Un nodo |Comment|
- *             y de lo contrario false.
- */
-
-function is_ignorable( nod )
-{
-  return ( nod.nodeType == 8) || // Un nodo comment
-         ( (nod.nodeType == 3) &amp;&amp; is_all_ws(nod) ); // un nodo text, todo es eeb
-}
-
-/**
- * Versión de |previousSibling| que omite los nodos que son completamente
- * espacio en blanco o comentarios.  (Normalmente |previousSibling| es una propiedad
- * de todos los nodos DOM que devuelve el nodo hermano, el nodo que es
- * un hijo del mismo padre, que ocurre inmediatamente antes del
- * nodo de referencia).
- *
- * @param sib  El nodo de referencia.
- * @return     O bien:
- *               1) El hermano anterior más cercano a |sib| eso no es
- *                  ignorable según |is_ignorable|, o
- *               2) null si no existe tal nodo.
- */
-function node_before( sib )
-{
-  while ((sib = sib.previousSibling)) {
-    if (!is_ignorable(sib)) return sib;
-  }
-  return null;
-}
-
-/**
- * Versión de |nextSibling| que omite los nodos que son completamente
- * espacio en blanco o comentarios.
- *
- * @param sib  El nodo de referencia.
- * @return     O bien:
- *               1) El hermano más cercano a |sib| eso no es
- *                  ignorable según |is_ignorable|, o
- *               2) null si no existe tal nodo.
- */
-function node_after( sib )
-{
-  while ((sib = sib.nextSibling)) {
-    if (!is_ignorable(sib)) return sib;
-  }
-  return null;
-}
-
-/**
- * Versión de |lastChild| que omite los nodos que son completamente
- * espacio en blanco o comentarios.  (Normalmente |lastChild| es una propiedad
- * de todos los nodos del DOM que da el último de los nodos contenidos
- * directamente en el nodo de referencia).
- *
- * @param sib  El nodo de referencia.
- * @return     O bien:
- *               1) El último hijo de |sib| eso no es
- *                  ignorable según |is_ignorable|, o
- *               2) null si no existe tal nodo.
- */
-function last_child( par )
-{
-  var res=par.lastChild;
-  while (res) {
-    if (!is_ignorable(res)) return res;
-    res = res.previousSibling;
-  }
-  return null;
-}
-
-/**
- * Versión de |firstChild| que omite los nodos que son completamente
- * espacios en blanco y comentarios.
- *
- * @param sib  El nodo de referencia.
- * @return     O bien:
- *               1) El primer hijo de |sib| eso no es
- *                  ignorable según |is_ignorable|, o
- *               2) null si no existe tal nodo.
- */
-function first_child( par )
-{
-  var res=par.firstChild;
-  while (res) {
-    if (!is_ignorable(res)) return res;
-    res = res.nextSibling;
-  }
-  return null;
-}
-
-/**
- * Versión de |data| que no incluye espacios en blanco al principio
- * y finaliza y normaliza todos los espacios en blanco a un solo espacio.  (Normalmente
- * |data| es una propiedad de los nodos de texto que proporciona el texto del nodo).
- *
- * @param txt  El nodo de texto cuyos datos se deben devolver
- * @return     Una cadena que proporciona el contenido del nodo de texto con
- *             espacios en blanco colapsados.
- */
-function data_of( txt )
-{
-  var data = txt.textContent;
-  // Usa las características de String y RegExp de ECMA-262 Edición 3
-  data = data.replace(/[\t\n\r ]+/g, " ");
-  if (data.charAt(0) == " ")
-    data = data.substring(1, data.length);
-  if (data.charAt(data.length - 1) == " ")
-    data = data.substring(0, data.length - 1);
-  return data;
-}
-</pre>
-
-<h3 id="Ejemplo">Ejemplo</h3>
-
-<p>El siguiente código demuestra el uso de las funciones anteriores. Itera sobre los hijos de un elemento (cuyos hijos son todos elementos) para encontrar aquel cuyo texto es <code>"Este es el tercer párrafo"</code>, y luego cambia el atributo de clase y el contenido de ese párrafo.</p>
-
-<pre class="brush: js notranslate">var cur = first_child(document.getElementById("test"));
-while (cur)
-{
-  if (data_of(cur.firstChild) == "Este es el tercer párrafo.")
-  {
-    cur.className = "magic";
-    cur.firstChild.textContent = "Este es el párrafo mágico.";
-  }
-  cur = node_after(cur);
-}
-</pre>
diff --git a/files/es/referencia_dom_de_gecko/ejemplos/index.html b/files/es/referencia_dom_de_gecko/ejemplos/index.html
deleted file mode 100644
index 33f0e9e2b7..0000000000
--- a/files/es/referencia_dom_de_gecko/ejemplos/index.html
+++ /dev/null
@@ -1,367 +0,0 @@
----
-title: Ejemplos
-slug: Referencia_DOM_de_Gecko/Ejemplos
-tags:
-  - DOM
-  - Referencia_DOM_de_Gecko
-  - Todas_las_Categorías
-  - páginas_a_traducir
-translation_of: Web/API/Document_Object_Model/Examples
----
-<p>En este capítulo se brindan ejemplos relativamente extensos que ilustran el uso del DOM para el desarrollo web y XML. Siempre que sea posible, usaremos las APIs, trucos y patrones comunes en JavaScript para la manipulación del objeto <code>document</code>.</p>
-
-<h3 id="Ejemplo_1:_Altos_y_anchos" name="Ejemplo_1:_Altos_y_anchos">Ejemplo 1: Altos y anchos</h3>
-
-<p>El ejemplo siguiente muestra el uso de las propiedades de alto (<code>height</code>) y ancho (<code>width</code>) junto a imágenes de dimensiones variadas:</p>
-
-<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-"http://www.w3.org/TR/html4/strict.dtd"&gt;
-
-&lt;html lang="es"&gt;
-
-&lt;head&gt;
-&lt;title&gt;Ejemplo de height/width&lt;/title&gt;
-&lt;script type="text/javascript"&gt;
-function iniciar()
-{
-  var arrImages = new Array(3);
-  arrImages[0] = document.getElementById("imagen1");
-  arrImages[1] = document.getElementById("imagen2");
-  arrImages[2] = document.getElementById("imagen3");
-  var objOutput = document.getElementById("salida");
-  var strHtml = "&lt;ul&gt;";
-  for (var i = 0; i &lt; arrImages.length; i++)
-    strHtml += "&lt;li&gt;imagen" + (i+1) +
-            ": height=" + arrImages[i].height +
-            ", width=" + arrImages[i].width +
-            ", style.height=" + arrImages[i].style.height +
-            ", style.width=" + arrImages[i].style.width +
-            "&lt;\/li&gt;";
-  strHtml += "&lt;\/ul&gt;";
-  salida.innerHTML = strHtml;
-}
-&lt;/script&gt;
-&lt;/head&gt;
-&lt;body onload="iniciar();"&gt;
-
-&lt;p&gt;La 1ª imagen:
-- alto (height): no
-- ancho (width): no
-- estilo (style): no
-    &lt;img id="imagen1" src="http://www.mozilla.org/images/mozilla-banner.gif"&gt;
-&lt;/p&gt;
-&lt;p&gt;La 2ª imagen:
-- height="50"
-- width="500"
-- style: no
-    &lt;img id="imagen2" src="http://www.mozilla.org/images/mozilla-banner.gif"
-         height="50" width="500"&gt;
-&lt;/p&gt;
-&lt;p&gt;La 3ª imagen:
-- height y width: no
-- style="height: 50px; width: 500px;": sí
-    &lt;img id="imagen3" src="http://www.mozilla.org/images/mozilla-banner.gif"
-         style="height: 50px; width: 500px;"&gt;
-&lt;/p&gt;
-
-&lt;div id="salida"&gt; &lt;/div&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p><code>height</code> y <code>width</code> son además propiedades de los elementos <code>OBJECT</code> y <code>APPLET</code>.</p>
-
-<h3 id="Ejemplo_2:_Atributos_de_una_imagen" name="Ejemplo_2:_Atributos_de_una_imagen">Ejemplo 2: Atributos de una imagen</h3>
-
-<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-"http://www.w3.org/TR/html4/strict.dtd"&gt;
-
-&lt;html lang="es"&gt;
-
-&lt;head&gt;
-&lt;title&gt;Modificación del borde de una imagen&lt;/title&gt;
-&lt;script type="text/javascript"&gt;
-function setBorderWidth(width) {
-  document.getElementById("img1").style.borderWidth = width + "px";
-}
-&lt;/script&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-&lt;p&gt;
-  &lt;img id="img1" src="image1.gif" style="border: 5px solid green;" width="100"
-height="100" alt="test de borde"&gt;
-&lt;/p&gt;
-
-&lt;form name="Formulario"&gt;
-  &lt;p&gt;&lt;input type="button" value="Definir un borde de 20px"
-onclick="setBorderWidth(20);"&gt; &lt;input type="button" value="Definir un borde de 5px"
-onclick="setBorderWidth(5);"&gt;&lt;/p&gt;
-&lt;/form&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="Ejemplo_3:_Manipulaci.C3.B3n_de_estilos" name="Ejemplo_3:_Manipulaci.C3.B3n_de_estilos">Ejemplo 3: Manipulación de estilos</h3>
-
-<p>En este ejemplo sencillo, algunas propiedades de estilo básicas de un elemento párrafo HTML son accedidas utilizando el objeto estilo en el elemento y aquellas propiedades de estilo CSS del objeto, pueden ser entregadas y establecidas desde el DOM. En este caso, está manipulando los estilos directamente. En el siguiente ejemplo (ver ejemplo 4), puede utilizar las hojas de estilo y sus reglas para cambiar estilos para el documento entero.</p>
-
-<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-"http://www.w3.org/TR/html4/strict.dtd"&gt;
-
-&lt;html lang="en"&gt;
-
-&lt;head&gt;
-&lt;title&gt;Changing color and font-size example&lt;/title&gt;
-&lt;script type="text/javascript"&gt;
-function changeText() {
-	var p = document.getElementById("pid");
-	p.style.color = "blue"
-	p.style.fontSize = "18pt"
-}
-&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
-&lt;p id="pid"
-onclick="window.location.href = 'http://www.cnn.com/';"&gt;linker&lt;/p&gt;
-&lt;form&gt;
-&lt;p&gt;&lt;input value="rec" type="button" onclick="changeText();"&gt;&lt;/p&gt;
-&lt;/form&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="Ejemplo_4:_Utilizaci.C3.B3n_de_las_hojas_de_estilo" name="Ejemplo_4:_Utilizaci.C3.B3n_de_las_hojas_de_estilo">Ejemplo 4: Utilización de las hojas de estilo</h3>
-
-<p>La propiedad de las hojas de estilo en un objeto de documento muestra una lista de las hojas de estilo que acompañan a ése documento. Usando los objetos de la hoja de estilo, del estilo y de las reglas de CSS se puede acceder individualmente a esas hojas de estilo y sus reglas, como se demuestra en este ejemplo, el cual muestra todos los selectores de reglas de estilo en la consola.</p>
-
-<pre>ss = document.styleSheets;
-for(i=0; i&lt;ss.length; i++)
- {
- for(j=0; j&lt;ss[0].cssRules.length; j++)
-  {
-  dump( ss[i].cssRules[j].selectorText + "\n" );
-  }
- }
-</pre>
-
-<p>Para un documento con una sola hoja de estilo en la cual son definidas las tres reglas siguientes:</p>
-
-<pre class="eval">BODY { background-color: darkblue; }
-P { font-face: Arial; font-size: 10pt; margin-left: .125in; }
-#lumpy { display: none; }
-</pre>
-
-<p>El script sale así:</p>
-
-<pre class="eval">BODY
-P
-#LUMPY
-</pre>
-
-<h3 id="Ejemplo_5:_Propagaci.C3.B3n_del_evento" name="Ejemplo_5:_Propagaci.C3.B3n_del_evento">Ejemplo 5: Propagación del evento</h3>
-
-<p>Este ejemplo muestra de una forma muy simple como los eventos se inician y son gestionados en el DOM. Cuando el cuerpo (<em>body</em> ) de ese documento HTML se carga,<em>un evento listener es registrado con la columna superior de la TABLA. El evento listener maneja el evento ejecutando la función stopEvent, que cambia el valor en el final de la celda de la tabla.</em></p>
-
-<p>Sin embargo, stopEvent también llama a un método del objeto evento, <a href="es/DOM/event.stopPropagation">event.stopPropagation</a>, que mantiene el evento del burbujeo a continuación dentro del DOM. Note que la tabla misma tiene un manejador de evento <a href="es/DOM/element.onclick">onclick</a> que muestra un mensaje cuando la tabla es seleccionada. Pero el método stopEvent ha detenido la propagación, y así despues los datos en la tabla son actualizados, la fase de evento es efectivamente finalizada, y un cuadro de alerta es mostrado para confirmar esto.</p>
-
-<pre>&lt;html&gt;
-&lt;head&gt;
-&lt;title&gt;Propagación del evento&lt;/title&gt;
-
-&lt;style type="text/css"&gt;
- #t-daddy { border: 1px solid red }
- #c1 { background-color: pink; }
-&lt;/style&gt;
-
-&lt;script type="text/javascript"&gt;
-
-function stopEvent(ev) {
-  c2 = document.getElementById("c2");
-  c2.innerHTML = "hola";
-
-  // this ought to keep t-daddy from getting the click.
-  ev.stopPropagation();
-  alert("La propagación del evento se ha parado.");
-}
-
-function load() {
-  elem = document.getElementById("tbl1");
-  elem.addEventListener("click", stopEvent, false);
-}
-&lt;/script&gt;
-&lt;/head&gt;
-
-&lt;body onload="load();"&gt;
-
-&lt;table id="t-daddy" onclick="alert('hi');"&gt;
- &lt;tr id="tbl1"&gt;
-  &lt;td id="c1"&gt;uno&lt;/td&gt;
- &lt;/tr&gt;
- &lt;tr&gt;
-  &lt;td id="c2"&gt;dos&lt;/td&gt;
- &lt;/tr&gt;
-&lt;/table&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="Ejemplo_6:_Conseguir_el_estilo_computado_.28getComputedStyle.29" name="Ejemplo_6:_Conseguir_el_estilo_computado_.28getComputedStyle.29">Ejemplo 6: Conseguir el estilo computado (getComputedStyle)</h3>
-
-<p>Este ejemplo demuestra como el método <a href="es/DOM/window.getComputedStyle">window.getComputedStyle</a> puedes utilizarse para obtener los estilos de un elemento que no son especificados en el atributo <code>style</code> o con JavaScript (por ejemplo, <strong><span class="highlightgreen"><code>element.style.backgroundColor="rgb(173, 216, 230)"</code></span></strong>). Estos últimos tipos de estilos se pueden recuperar con el atributo <a href="es/DOM/element.style">element.style</a>, las propiedades del cual están en la <a href="es/DOM/CSS">lista de propiedades de CSS</a> del DOM.</p>
-
-<p><code>getComputedStyle()</code> devuelve un objeto <code>ComputedCSSStyleDeclaration</code>, cuyas propiedades de estilo individuales pueden ser referenciadas con este método del objeto <code>getPropertyValue()</code>, el siguiente documento de ejemplo lo muestra.</p>
-
-<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-"http://www.w3.org/TR/html4/strict.dtd"&gt;
-
-&lt;html lang="en"&gt;
-
-&lt;head&gt;
- &lt;title&gt;Ejemplo de ''getComputedStyle''&lt;/title&gt;
-
- &lt;script type="text/javascript"&gt;
-   function cStyles()
-  {
-   var RefDiv = document.getElementById("d1");
-
-   var txtHeight = document.getElementById("t1");
-   var h_style =
-document.defaultView.getComputedStyle(RefDiv, null).getPropertyValue("height");
-   txtHeight.value = h_style;
-
-   var txtWidth = document.getElementById("t2");
-   var w_style =
-document.defaultView.getComputedStyle(RefDiv, null).getPropertyValue("width");
-   txtWidth.value = w_style;
-
-   var txtBackgroundColor = document.getElementById("t3");
-   var b_style =
-document.defaultView.getComputedStyle(RefDiv,
-null).getPropertyValue("background-color");
-   txtBackgroundColor.value = b_style;
-  }
- &lt;/script&gt;
-
- &lt;style type="text/css"&gt;
-   #d1 { margin-left: 10px; background-color: rgb(173, 216, 230);
-height: 20px; max-width: 20px; }
- &lt;/style&gt;
-
-&lt;/head&gt;
-
-&lt;body&gt;
-
-&lt;div id="d1"&gt;&amp;nbsp;&lt;/div&gt;
-
-&lt;form action=""&gt;
-&lt;p&gt;&lt;button type="button" onclick="cStyles();"&gt;getComputedStyle&lt;/button&gt;
-  height&lt;input id="t1" type="text" value="1"&gt;
-  max-width&lt;input id="t2" type="text" value="2"&gt;
-  bg-color&lt;input id="t3" type="text" value="3"&gt;&lt;/p&gt;
-&lt;/form&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="Ejemplo_7:_Mostrar_las_propiedades_del_objeto_de_evento" name="Ejemplo_7:_Mostrar_las_propiedades_del_objeto_de_evento">Ejemplo 7: Mostrar las propiedades del objeto de evento</h3>
-
-<p>Este ejemplo utiliza métodos del DOM para mostrar todas las propiedades del <a href="es/DOM/event">evento</a> de <a href="es/DOM/window.onload">window.onload</a> y sus valores en una tabla. Muestra además una cómoda técnica del uso de un bucle<em><strong>for...in</strong></em> para iterar sobre las propiedades de un objeto y conseguir sus valores.</p>
-
-<p>Las propiedades de los objetos de evento difieren bastante entre los navegadores, la <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html">especificación W3C de los eventos del DOM 2</a> enumera las propiedades estándares, sin embargo algunos navegadores han extendido estas diferencias.</p>
-
-<p>El siguiente código colocado dentro de un nuevo archivo de texto y cargado en un surtido de navegadores, sorprenderá por las diferencias de los números y nombres de propiedades y/o al ponerle más elementos a la página y llamar esa función desde diferentes gestores de evento.</p>
-
-<pre>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
-   "http://www.w3.org/TR/html4/strict.dtd"&gt;
-
-&lt;title&gt;Muestra las propiedades del evento&lt;/title&gt;
-
-&lt;style type="text/css"&gt;
-  table {border-collapse: collapse;}
-  thead {font-weight: bold;}
-  td {padding: 2px 10px 2px 10px;}
-  .odd {background-color: #efdfef;}
-  .even {background-color: #ffffff;}
-&lt;/style&gt;
-
-&lt;script type="text/javascript"&gt;
-
-function showEventProperties(e)
-{
-  function addCell(row, text) {
-    var cell = row.insertCell(-1);
-    cell.appendChild(document.createTextNode(text));
-  }
-
-  document.getElementById('eventType').innerHTML = e.type;
-
-  var e = e || window.event;
-  var table = document.createElement('table');
-  var thead = table.createTHead();
-  var row = thead.insertRow(-1);
-  var lableList = ['#', 'Propriété', 'Valeur'];
-  var len = lableList.length;
-
-  for (var i=0; i&lt;len; i++) {
-    addCell(row, lableList[i]);
-  }
-
-  var tbody = document.createElement('tbody');
-  table.appendChild(tbody);
-
-  for (var p in e) {
-    row = tbody.insertRow(-1);
-    row.className = (row.rowIndex % 2)? 'odd':'even';
-    addCell(row, row.rowIndex);
-    addCell(row, p);
-    addCell(row, e[p]);
-  }
-
-  document.body.appendChild(table);
-}
-window.onload = function(event){
-  showEventProperties(event);
-}
-&lt;/script&gt;
-
-&lt;h1&gt;Propiedades del objeto evento del DOM&lt;span id="eventType"&gt;&lt;/span&gt;&lt;/h1&gt;
-</pre>
-
-<h3 id="Ejemplo_8:_Utilizaci.C3.B3n_del_interfaz_de_tabla_del_DOM" name="Ejemplo_8:_Utilizaci.C3.B3n_del_interfaz_de_tabla_del_DOM">Ejemplo 8: Utilización del interfaz de tabla del DOM</h3>
-
-<p>La interfaz HTMLTableElement del DOM provee algunos métodos de conveniencia para crear y manipular tablas. Dos métodos usados frecuentemente son <code><a href="es/DOM/table.insertRow">table.insertRow</a></code> y <code><a href="es/DOM/table/row.insertCell">row.insertCell</a></code>.</p>
-
-<p>Para agregar una columna y algunas celdas a una tabla existente:</p>
-
-<pre>&lt;table id="table0"&gt;
- &lt;tr&gt;
-  &lt;td&gt;Row 0 Cell 0&lt;/td&gt;
-  &lt;td&gt;Row 0 Cell 1&lt;/td&gt;
- &lt;/tr&gt;
-&lt;/table&gt;
-
-&lt;script type="text/javascript"&gt;
-
-var table = document.getElementById('table0');
-var row = table.insertRow(-1);
-var cell, text;
-for (var i=0; i&lt;2; i++) {
-  cell = row.insertCell(-1);
-  text = 'Row ' + row.rowIndex + ' Cell ' + i;
-  cell.appendChild(document.createTextNode(text));
-}
-
-&lt;/script&gt;
-</pre>
-
-<h4 id="Notas" name="Notas">Notas</h4>
-
-<ul>
- <li>Una propiedad <code><a href="es/DOM/element.innerHTML">innerHTML</a></code> de la tabla nunca debería ser utilizada para modificar una tabla, aunque puede utilizarla para escribir una tabla entera o el contenido de una celda.</li>
- <li>Si los métodos Core del DOM<code><a href="es/DOM/document.createElement">document.createElement</a></code> y <code><a href="es/DOM/element.appendChild">element.appendChild</a></code> son utilizados para crear columnas y celdas, IE requiere que sean agregadas a un elemento tbody, mientras que otros navegadores permitirán agregar a un elemento de la tabla (las columnas serán agregadas al último elemento tbody).</li>
- <li>Hay un número de otros métodos de conveniencia pertenecientes a la <a href="es/DOM/table#M.C3.A9todos">interfaz de tabla</a> que pueden ser utilizados para crear y modificar tablas.</li>
-</ul>
diff --git a/files/es/referencia_dom_de_gecko/eventos/index.html b/files/es/referencia_dom_de_gecko/eventos/index.html
deleted file mode 100644
index fce2530535..0000000000
--- a/files/es/referencia_dom_de_gecko/eventos/index.html
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: Eventos y el DOM
-slug: Referencia_DOM_de_Gecko/Eventos
-tags:
-  - DOM
-  - Guía
-translation_of: Web/API/Document_Object_Model/Events
----
-<h2 id="Introduction" name="Introduction">Introducción</h2>
-
-<p>Este capítulo describe el Modelo de Eventos del DOM. Se describe la interfaz <a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-Event">Event</a>, así como las interfaces para el registro de eventos en los nodos del DOM, y los <a href="/en-US/docs/Web/API/EventTarget.addEventListener">oyentes de eventos</a>, y varios ejemplos más largos muestran cómo se relacionan entre sí las diversas interfaces de eventos.</p>
-
-<p>Hay un diagrama excelente que explica claramente las tres fases del flujo de eventos a través del DOM en el borrador <a href="http://www.w3.org/TR/DOM-Level-3-Events/#dom-event-architecture">DOM Level 3 Events</a>.</p>
-
-<p>Vea también el <a href="/en-US/docs/DOM/DOM_Reference/Examples#Example_5:_Event_Propagation">Ejemplo 5: Propagación de eventos</a> en el capítulo de Ejemplos para un ejemplo más detallado de cómo los eventos se mueven a través del DOM.</p>
-
-<h2 id="DOM_event_handler_List" name="DOM_event_handler_List">Registrando oyentes de eventos</h2>
-
-<p>Hay 3 formas de registrar gestores de eventos para un elemento DOM.</p>
-
-<h3 id="EventTarget.addEventListener" name="EventTarget.addEventListener"><a href="/en-US/docs/Web/API/EventTarget.addEventListener"><code>EventTarget.addEventListener</code></a></h3>
-
-<pre class="brush: js">// Se supone que myButton es un elemento de botón
-myButton.addEventListener('click', function(){alert('Hello world');}, false);
-</pre>
-
-<p>Este es el método que debe usar en las páginas web modernas. </p>
-
-<p>Nota: Internet Explorer 6-8 no admite este método, ofreciendo una API similar {{domxref("EventTarget.attachEvent")}} en su lugar. Para la compatibilidad entre navegadores utilice una de las muchas bibliotecas de JavaScript disponibles.</p>
-
-<p>Se pueden encontrar más detalles en la página de referencia {{domxref("EventTarget.addEventListener")}}.</p>
-
-<h3 id="HTML_attribute" name="HTML_attribute"><a href="/en-US/docs/Web/Guide/HTML/Event_attributes">Atributo HTML</a></h3>
-
-<pre class="brush: html">&lt;button onclick="alert('Hello world!')"&gt;
-</pre>
-
-<p>El código de JavaScript en el atributo pasa el objeto Event por medio del parámetro <code>event</code>. <a href="http://dev.w3.org/html5/spec/webappapis.html#the-event-handler-processing-algorithm">El valor de retorno se trata de una manera especial, descrita en la especificación HTML</a>.</p>
-
-<p>Debe evitarse esta forma. Hace que el marcado sea más grande y menos legible. El comitido del contenido/estructura y del comportamiento no están bien separadas, por lo que es más difícil encontrar un error.</p>
-
-<h3 id="DOM_element_properties" name="DOM_element_properties">Propiedades del elemento DOM</h3>
-
-<pre class="brush: js">// Se supone que myButton es un elemento de botón
-myButton.onclick = function(event){alert('Hello world');};
-</pre>
-
-<p>La función se puede defirnir para que tome un parámetro <code>event</code>. <a href="http://dev.w3.org/html5/spec/webappapis.html#the-event-handler-processing-algorithm">El valor de retorno se trata de una manera especial, descrita en la especificación HTML</a>.</p>
-
-<p>El problema con este método es que solo se puede establecer un gestor por elemento y por evento.</p>
-
-<h2 id="Accediendo_a_las_Interfaces_de_eventos">Accediendo a las Interfaces de eventos</h2>
-
-<p>Los controladores de eventos se pueden adjuntar a varios objetos, incluidos los elementos DOM, documentos, al <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects">objeto window</a>, etc. Cuando se produce un evento, se crea un objeto de evento y se pasa secuencialmente a los oyentes del evento.</p>
-
-<p>Se puede acceder a la interfaz {{domxref ("Evento")}} desde la función del gestor, a través del objeto de evento pasado como primer argumento. El siguiente ejemplo simple muestra cómo se pasa un objeto de evento a la función del controlador de eventos, y se puede usar desde dentro de una de esas funciones.</p>
-
-<pre class="brush: js">function foo(evt) {
-  // al parámetro evt se le asigna automáticamente el objeto event
-  alert(evt);
-}
-table_el.onclick = foo;
-</pre>
-
-<h2 id="Subnav">Subnav</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Document_Object_Model">DOM Reference</a></li>
- <li><a href="/en-US/docs/Web/API/Document_Object_Model/Introduction">Introduction to the DOM</a></li>
- <li><a href="/en-US/docs/Web/API/Document_Object_Model/Events">Events and the DOM</a></li>
- <li><a href="/en-US/docs/Web/API/Document_Object_Model/Examples">Examples</a></li>
-</ul>
diff --git a/files/es/referencia_dom_de_gecko/index.html b/files/es/referencia_dom_de_gecko/index.html
deleted file mode 100644
index 0f3a2a7f75..0000000000
--- a/files/es/referencia_dom_de_gecko/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: Referencia DOM de Gecko
-slug: Referencia_DOM_de_Gecko
-tags:
-  - DOM
-  - NecesitaRevisiónTécnica
-  - Todas_las_Categorías
-translation_of: Web/API/Document_Object_Model
----
-<p>
-« <a href="es/Referencia_DOM_de_Gecko">Referencia DOM de Gecko</a>
-</p><p><br>
-Aquí está la tabla de contenido para la referencia <a href="es/DOM">DOM</a> de <a href="es/Gecko">Gecko</a>.
-</p>
-<h4 id="Prefacio"> <a href="es/Referencia_DOM_de_Gecko/Prefacio">Prefacio</a> </h4>
-<ul><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Sobre_.C3.A9sta_referencia">Sobre ésta referencia</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#A_qui.C3.A9n_est.C3.A1_dirigida_esta_gu.C3.ADa.3F">A quién está dirigida esta guía?</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Qu.C3.A9_es_Gecko.3F">Qué es Gecko?</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Sintaxis_del_API">Sintaxis del API</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Utilizaci.C3.B3n_de_ejemplos">Utilización de ejemplos</a>
-</li></ul>
-<h4 id="Introducci.C3.B3n"> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n">Introducción</a> </h4>
-<ul><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Qu.C3.A9_es_el_DOM.3F">Qué es el DOM?</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#DOM_y_JavaScript">DOM y JavaScript</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#C.C3.B3mo_se_accede_al_DOM.3F">Cómo se accede al DOM?</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Importancia_de_los_tipos_de_datos">Tipos de datos importantes</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Interfaces_del_DOM">Interfaces del DOM</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Probando_el_API_del_DOM">Probando el API del DOM</a>
-</li></ul>
-<h4 id="La_referencia_al_elemento_.28element.29_de_DOM"> <a href="es/DOM/element">La referencia al elemento (<code>element</code>) de DOM</a> </h4>
-<ul><li> <a href="es/DOM/element#Introducci.C3.B3n">Introducción</a>
-</li><li> <a href="es/DOM/element#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/element#M.C3.A9todos">Métodos</a>
-</li><li> <a href="es/DOM/element#Manejo_de_los_eventos">Manejo de los eventos</a>
-</li></ul>
-<h4 id="La_referencia_a_la_ventana_.28window.29_de_DOM"> <a href="es/DOM/window">La referencia a la ventana (<code>window</code>) de DOM</a> </h4>
-<ul><li> <a href="es/DOM/window#Introducci.C3.B3n">Introducción</a>
-</li><li> <a href="es/DOM/window#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/window#M.C3.A9todos">Métodos</a>
-</li><li> <a href="es/DOM/window#Manejo_de_los_eventos">Manejo de los eventos</a>
-</li></ul>
-<h4 id="La_referencia_al_document_de_DOM"> <a href="es/DOM/document">La referencia al <code>document</code> de DOM</a> </h4>
-<ul><li> <a href="es/DOM/document#Introducci.C3.B3n">Introducción</a>
-</li><li> <a href="es/DOM/document#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/document#M.C3.A9todos">Métodos</a>
-</li></ul>
-<h4 id="La_referencia_al_event_de_DOM"> <a href="es/DOM/event">La referencia al <code>event</code> de DOM</a> </h4>
-<ul><li> <a href="es/DOM/event#Introducci.C3.B3n">Introducción</a>
-</li><li> <a href="es/DOM/event#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/event#M.C3.A9todos">Métodos</a>
-</li></ul>
-<h4 id="La_referencia_al_estilo_.28style.29_de_DOM"> <a href="es/DOM/style">La referencia al estilo (<code>style</code>) de DOM</a> </h4>
-<ul><li> <a href="es/DOM/style#Notas">Notas</a>
-</li><li> <a href="es/DOM/style#Material_que_se_mover.C3.A1_a_otras_p.C3.A1ginas"> Material que se moverá a otras páginas</a>
-</li></ul>
-<h4 id="La_referencia_al_rango_.28range.29_de_DOM"> <a href="es/DOM/range">La referencia al rango (<code>range</code>) de DOM</a> </h4>
-<ul><li> <a href="es/DOM/range#Introducci.C3.B3n">Introducción</a>
-</li><li> <a href="es/DOM/range#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/range#M.C3.A9todos">Métodos</a>
-</li></ul>
-<h4 id="La_referencia_a_la_selecci.C3.B3n_.28selection.29_de_DOM"> <a href="es/DOM/selection">La referencia a la selección (<code>selection</code>) de DOM</a> </h4>
-<ul><li> <a href="es/DOM/Selection#Introducci.C3.B3n">Introducción</a>
-</li><li> <a href="es/DOM/Selection#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/Selection#M.C3.A9todos">Métodos</a>
-</li></ul>
-<h4 id="Interfaz_del_elemento_formulario_.28form.29_en_HTML"> <a href="es/DOM/form">Interfaz del elemento formulario (<code>form</code>) en HTML</a> </h4>
-<ul><li> <a href="es/DOM/form#Interfaz_del_elemento_formulario_en_HTML">Interfaz del elemento formulario en HTML</a>
-</li><li> <a href="es/DOM/form#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/form#M.C3.A9todos">Métodos</a>
-</li></ul>
-<h4 id="Interfaz_del_elemento_tabla_.28table.29_en_HTML"> <a href="es/DOM/table">Interfaz del elemento tabla (<code>table</code>) en HTML</a> </h4>
-<ul><li> <a href="es/DOM/table#Interfaz_del_elemento_tabla_en_HTML">Interfaz del elemento tabla en HTML</a>
-</li><li> <a href="es/DOM/table#Propiedades">Propiedades</a>
-</li><li> <a href="es/DOM/table#M.C3.A9todos">Métodos</a>
-</li></ul>
-<h4 id="Ejemplos_DOM"> <a href="es/Referencia_DOM_de_Gecko/Ejemplos">Ejemplos DOM</a> </h4>
-<ul><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_1:_Altos_y_anchos">Ejemplo 1: Altos y anchos</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_2:_Atributos_de_una_imagen">Ejemplo 2: Atributos de una imagen</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_3:_Manipulaci.C3.B3n_de_estilos">Ejemplo 3: Manipulación de estilos</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_4:_Utilizaci.C3.B3n_de_la_hoja_de_estilo">Ejemplo 4: Utilización de la hoja de estilo</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_5:_Propagaci.C3.B3n_del_evento">Ejemplo 5: Propagación del evento</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_6:_Conseguir_el_estilo_computado">Ejemplo 6: Conseguir el estilo computado (<code>getComputedStyle</code>)</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_7:_Mostrar_las_propiedades_del_objeto_de_evento">Ejemplo 7: Mostrar las propiedades del objeto de evento</a>
-</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_8:_Utilizaci.C3.B3n_del_interfaz_de_tabla_del_DOM">Ejemplo 8: Utilización del interfaz de tabla del DOM</a>
-</li></ul>
-<div class="originaldocinfo">
-<h3 id="Informaci.C3.B3n_sobre_el_documento_original"> Información sobre el documento original </h3>
-<ul><li> Última actualización: 22 de Octubre de 2006
-</li></ul>
-</div>
-{{ languages( { "en": "en/Gecko_DOM_Reference", "fr": "fr/R\u00e9f\u00e9rence_du_DOM_Gecko", "it": "it/Reference_del_DOM_di_Gecko", "ja": "ja/Gecko_DOM_Reference", "ko": "ko/Gecko_DOM_Reference", "pl": "pl/Dokumentacja_Gecko_DOM", "zh-cn": "cn/Gecko_DOM_\u53c2\u8003" } ) }}
diff --git a/files/es/referencia_dom_de_gecko/introducción/index.html b/files/es/referencia_dom_de_gecko/introducción/index.html
deleted file mode 100644
index 5c604a7a6c..0000000000
--- a/files/es/referencia_dom_de_gecko/introducción/index.html
+++ /dev/null
@@ -1,248 +0,0 @@
----
-title: Introducción
-slug: Referencia_DOM_de_Gecko/Introducción
-tags:
-  - DOM
-  - Gecko
-  - Manuales
-  - Todas_las_Categorías
-translation_of: Web/API/Document_Object_Model/Introduction
----
-<p> </p>
-
-<p>Ésta sección da una breve introducción conceptual del <a href="es/DOM">DOM</a>: qué es, cómo proporciona la estructura para los documentos <a href="es/HTML">HTML</a> y <a href="es/XML">XML</a>, cómo se accede a él, y cómo esta <a href="https://es.wikipedia.org/wiki/Interfaz_de_programaci%C3%B3n_de_aplicaciones">"API"</a> presenta la información de referencia y ejemplos.</p>
-
-<h2 id=".C2.BFQu.C3.A9_es_el_DOM.3F" name=".C2.BFQu.C3.A9_es_el_DOM.3F">¿Qué es el DOM?</h2>
-
-<p>El modelo de objeto de documento (DOM) es una interfaz de programación para los documentos HTML y XML. Facilita una representación estructurada del documento y define de qué manera los programas pueden acceder, al fin de modificar, tanto su estructura, estilo y contenido. El DOM da una representación del documento como un grupo de nodos y objetos estructurados que tienen propiedades y métodos. Esencialmente, conecta las páginas web a scripts o lenguajes de programación.</p>
-
-<p>Una página web es un documento. Éste documento puede exhibirse en la ventana de un navegador o también como código fuente HTML. Pero, en los dos casos, es el mismo documento. El modelo de objeto de documento (DOM) proporciona otras formas de presentar, guardar y manipular este mismo documento. El DOM es una representación completamente orientada al objeto de la página web y puede ser modificado con un lenguaje de script como JavaScript.</p>
-
-<p>El <a class="external" href="http://www.w3.org/DOM/">W3C DOM</a> estándar forma la base del funcionamiento del DOM en muchos navegadores modernos. Varios navegadores ofrecen extensiones más allá del estándar W3C, hay que ir con extremo cuidado al utilizarlas en la web, ya que los documentos pueden ser consultados por navegadores que tienen DOMs diferentes.</p>
-
-<p>Por ejemplo, el DOM de W3C especifica que el método <code>getElementsByTagName</code> en el código de abajo debe devolver una lista de todos los elementos <code>&lt;p&gt;</code> del documento:</p>
-
-<pre class="brush: js">paragraphs<font><font> = document.getElementsByTagName ("p");</font></font>
-// paragraphs[0] es el primer elemento &lt;p&gt;
-// paragraphs[1] es el segundo elemento &lt;p&gt;, etc.<font><font>
-alert (</font></font>paragraphs<font><font> [0].nodeName);</font></font>
-</pre>
-
-<p>Todas las propiedades, métodos y eventos disponibles para la manipulación y la creación de páginas web está organizado dentro de objetos. Un ejemplo: el objeto <code>document</code> representa al documento mismo, el objeto <code>table</code> hace funcionar la interfaz especial <code>HTMLTableElement</code> del DOM para acceder a tablas HTML, y así sucesivamente. Ésta documentación procura una relación objeto-por-objeto del DOM que funciona con los navegadores basados en Gecko.</p>
-
-<h2 id="DOM_y_JavaScript" name="DOM_y_JavaScript"><font><font><font><font>DOM y JavaScript</font></font></font></font></h2>
-
-<p>El ejemplo corto de abajo, como casi todos los ejemplos de esta referencia, es <a href="es/JavaScript">JavaScript</a>. Es decir, es <em>escrito</em> en JavaScript pero <em>utiliza</em> el DOM para acceder al documento y a sus elementos. El DOM no es un lenguaje de programación pero sin él, el lenguaje JavaScript no tiene ningún modelo o noción de las páginas web, de la páginas XML ni de los elementos con los cuales es usualmente relacionado. Cada elemento -"el documento íntegro, el título, las tablas dentro del documento, los títulos de las tablas, el texto dentro de las celdas de las tablas"- es parte del modelo de objeto del documento para cada documento, así se puede acceder y manipularlos utilizando el DOM y un lenguaje de escritura, como JavaScript.</p>
-
-<p>En el comienzo, JavaScript y el DOM estaban herméticamente enlazados, pero después se desarrollaron como entidades separadas. El contenido de la página es almacenado en DOM y el acceso y la manipulación se hace vía JavaScript, podría representarse aproximadamente así:</p>
-
-<p>API(web o página XML) = DOM + JS(lenguaje de script)</p>
-
-<p>El DOM fue diseñado para ser independiente de cualquier lenguaje de programación particular, hace que la presentación estructural del documento sea disponible desde un simple y consistente API. Aunque en este manual nos centramos exclusivamente en JavaScript, la directrices del DOM pueden construirse para cualquier lenguaje, así lo demuestra el siguiente ejemplo de Python:</p>
-
-<pre class="brush: python line-numbers  language-python"><code class="language-python"># Ejemplo DOM de Python
-import xml.dom.minidom as m
-doc = m.parse("C:\\Projects\\Py\\chap1.xml");
-doc.nodeName # Propiedad DOM del objeto document;
-p_list = doc.getElementsByTagName("para");</code></pre>
-
-<h2 id=".C2.BFC.C3.B3mo_se_accede_al_DOM.3F" name=".C2.BFC.C3.B3mo_se_accede_al_DOM.3F">¿Cómo se accede al DOM?</h2>
-
-<p>No se tiene que hacer nada especial para empezar a utilizar el DOM. Los diferentes navegadores tienen directrices DOM distintas, y éstas directrices tienen diversos grados de conformidad al actual estándar DOM (un tema que se intenta evitar en este manual), pero todos los navegadores web usan el modelo de objeto de documento para hacer accesibles las páginas web al script.</p>
-
-<p>Cuando se crea un script –esté en un elemento <code>&lt;SCRIPT&gt;</code> o incluido en una página web por la instrucción de cargar un script– inmediatamente está disponible para usarlo con el API, accediendo así a los elementos <code><a href="es/DOM/document">document</a></code> o <code><a href="es/DOM/window">window</a></code>, para manipular el documento mismo o sus diferentes partes, las cuales son los varios elementos de una página web. La programación DOM hace algo tan simple como lo siguiente, lo cual abre un mensaje de alerta usando la función <code><a href="es/DOM/window.alert">alert()</a></code> desde el objeto <code><a href="es/DOM/window">window</a></code>, o permite métodos DOM más sofisticados para crear realmente un nuevo contenido, como en el largo ejemplo de más abajo.</p>
-
-<pre class="brush: html">&lt;body onload="window.alert('Bienvenido a mi página!');"&gt;
-</pre>
-
-<p>Aparte del elemento <code>&lt;script&gt;</code> en el cual JavaScript es definido, el ejemplo siguiente muestra la función a ejecutar cuando el documento se está cargando (y que el DOM completo es disponible para su uso). Esta función crea un nuevo elemento <code>H1</code>, le pone texto y después lo agrega al árbol del documento:</p>
-
-<pre class="brush: html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span></code><code class="language-html">
-  </code><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>script</span><span class="punctuation token">&gt;</span></span><span class="language-javascript script token">
-       <span class="comment token">// ejecuta esta función cuando se cargue el documento</span>
-       window<span class="punctuation token">.</span>onload <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-
-         <span class="comment token">// </span></span></code>crea dinámicamente un par de elementos HTML en una página vacia<code class="language-html"><span class="language-javascript script token">
-         <span class="keyword token">var</span> heading <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">"h1"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-         <span class="keyword token">var</span> heading_text <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createTextNode</span><span class="punctuation token">(</span><span class="string token">"</span></span></code>el texto que desee<code class="language-html"><span class="language-javascript script token"><span class="string token">"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-         heading<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>heading_text<span class="punctuation token">)</span><span class="punctuation token">;</span>
-         document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>heading<span class="punctuation token">)</span><span class="punctuation token">;</span>
-      <span class="punctuation token">}</span>
-    </span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>script</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<h2 id="Tipos_de_datos_importantes" name="Tipos_de_datos_importantes">Tipos de datos importantes</h2>
-
-<p>Esta parte intenta describir, de la manera más simple posible, los diferentes objetos y tipos. Pero hay que conocer una cantidad de tipos de datos diferentes que son utilizados por el API. Para simplificarlo, los ejemplos de sintaxis en esta API se refieren a nodos como <code>elements</code>, a una lista de nodos como <code>nodeLists</code> (o simples <code>elementos</code>) y a nodos de <code>atributo</code> como <code>attributes</code>.</p>
-
-<p>La siguiente tabla describe brevemente estos tipos de datos.</p>
-
-<table>
- <tbody>
-  <tr>
-   <td><code>document</code></td>
-   <td>Cuando un miembro devuelve un objeto del tipo <code>document</code> (por ejemplo, la propiedad <strong>ownerDocument</strong> de un elemento devuelve el documento "<code>document</code>" al cual pertenece), este objeto es la raíz del objeto documento en sí mismo. El capítulo <a href="es/DOM/documento">La referencia al documento (<code>document</code>) de DOM</a> lo explica con más detalles.</td>
-  </tr>
-  <tr>
-   <td><code>element</code></td>
-   <td><code>element</code> se refiere a un elemento o a un nodo de tipo de elemento "<code>element</code>" devuelto por un miembro del API de DOM. Dicho de otra manera, por ejemplo, el método <code>document.createElement()</code> devuelve un objeto referido a un <code>nodo</code>, lo que significa que este método devuelve el elemento que acaba de ser creado en el DOM. Los objetos <code>element</code> ponen en funcionamiento a la interfaz <code>Element</code> del DOM y también a la interfaz de nodo "<code>Node</code>" más básica, las cuales son incluidas en esta referencia.</td>
-  </tr>
-  <tr>
-   <td><code>nodeList</code></td>
-   <td>Una "<code>nodeList</code>" es una serie de elementos, parecido a lo que devuelve el método <code>document.getElementsByTagName()</code>. Se accede a los items de la <code>nodeList</code> de cualquiera de las siguientes dos formas:
-    <ul>
-     <li><font><font><font><font>list.item (1)</font></font></font></font></li>
-     <li><font><font>lista {{mediawiki.external (1)}}</font></font></li>
-    </ul>
-
-    <p>Ambas maneras son equivalentes. En la primera, <strong>item()</strong> es el método del objeto <code>nodeList</code>. En la última se utiliza la típica sintaxis de acceso a listas para llegar al segundo ítem de la lista.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>attribute</code></td>
-   <td>Cuando un atributo ("<code>attribute</code>") es devuelto por un miembro (por ej., por el método <strong>createAttribute()</strong>), es una referencia a un objeto que expone una interfaz particular (aunque limitada) a los atributos. Los atributos son nodos en el DOM igual que los elementos, pero no suelen usarse así.</td>
-  </tr>
-  <tr>
-   <td><code>NamedNodeMap</code></td>
-   <td>Un <code>namedNodeMap</code> es una serie, pero los ítems son accesibles tanto por el nombre o por un índice, este último caso es meramente una conveniencia para enumerar ya que no están en ningún orden en particular en la lista. Un <code>NamedNodeMap</code> es un método de ítem() por esa razón, y permite poner o quitar ítems en un <code>NamedNodeMap</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Interfaces_del_DOM" name="Interfaces_del_DOM">Interfaces del DOM</h2>
-
-<p>Uno de los propósitos de esta guía es minimizar el hablar de interfaces abstractas, heredadas y otros detalles de funcionamiento. Más bien, concentrarse sobre los objetos en el DOM y sobre las actuales <em>cosas</em> que se pueden usar para manipular la jerarquía de DOM. Desde el punto de vista del programador web, es bastante indiferente saber que la representación del objeto del elemento <code>HTML form</code> toma la propidedad <strong>name</strong> desde la interfaz <code>HTMLFormElement</code> pero que las propiedades <code><strong>className</strong> </code>se toman desde la propia interfaz <code>HTMLElement</code>. En ambos casos, la propiedad está sólo en el objeto <code>form</code>.</p>
-
-<p>Pero puede resultar confuso el funcionamiento de la fuerte relación entre objetos e interfaces en el DOM, por eso esta sección intentará hablar un poquito sobre las interfaces actuales en la especificación del DOM y de como se dispone de ellas.</p>
-
-<h2 id="Interfaces_y_objetos" name="Interfaces_y_objetos">Interfaces y objetos</h2>
-
-<p>En algunos casos un objeto pone en ejecución a una sola interfaz. Pero a menudo un objeto toma prestada una tabla HTML (<code>table</code>) desde muchas interfaces diversas. El objeto table, por ejemplo, pone en funcionamiento una <a href="es/DOM/tabla">Interfaz especial del elemento table HTML</a>, la cual incluye métodos como <code>createCaption</code> y <code>insertRow</code>. Pero como también es un elemento HTML, table pone en marcha a la interfaz del <code>Element</code> descrita en el capítulo <a href="es/Referencia_DOM_de_Gecko/elemento">La referencia al elemento del DOM</a>. Y finalmente, puesto que un elemento HTML es también, por lo que concierna al DOM, un nodo en el árbol de nodos que hace el modelo de objeto para una página web o XML, el elemento de table hace funcionar la interfaz más básica de <code>Node</code>, desde el cual deriva <code>Element</code>.</p>
-
-<p>La referencia a un objeto <code>table</code>, como en el ejemplo siguiente, utiliza estas interfaces intercambiables sobre el objeto.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> table <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"table"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> tableAttrs <span class="operator token">=</span> table<span class="punctuation token">.</span>attributes<span class="punctuation token">;</span> <span class="comment token">// Node/interfaz Element</span>
-<span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> i <span class="operator token">&lt;</span> tableAttrs<span class="punctuation token">.</span>length<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="comment token">// interfaz HTMLTableElement: atributo border</span>
-  <span class="keyword token">if</span><span class="punctuation token">(</span>tableAttrs<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">.</span>nodeName<span class="punctuation token">.</span><span class="function token">toLowerCase</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">==</span> <span class="string token">"border"</span><span class="punctuation token">)</span>
-    table<span class="punctuation token">.</span>border <span class="operator token">=</span> <span class="string token">"1"</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-<span class="comment token">// interfaz HTMLTableElement: atributo summary</span>
-table<span class="punctuation token">.</span>summary <span class="operator token">=</span> <span class="string token">"nota: borde aumentado"</span><span class="punctuation token">;</span></code></pre>
-
-<h2 id="Interfaces_esenciales_en_el_DOM" name="Interfaces_esenciales_en_el_DOM">Interfaces esenciales en el DOM</h2>
-
-<p>Esta sección lista las interfaces más comúnmente utilizadas en el DOM. La idea no es describir qué hacen estas APIs pero sí dar una idea de las clases de métodos y propiedades que se encuentran con el uso del DOM. Muchos ejemplos de uso común de esta API se encuentran en el capítulo <a href="es/Referencia_DOM_de_Gecko/Ejemplos">Ejemplos DOM</a> al final de este manual.</p>
-
-<p><code>document</code> y <code>window</code> son objetos cuya interfaces son generalmente muy usadas en la programación de DOM. En término simple, el objeto <code>window</code> representa algo como podría ser el navegador, y el objeto <code>document</code> es la raíz del documento en sí. <code>Element</code> hereda de la interfaz genérica <code>Node</code>, y juntos, estas dos interfaces proporcionan muchos métodos y propiedades utilizables sobre los elementos individuales. Éstos elementos pueden igualmente tener interfaces específicas según el tipo de datos representados, como en el ejemplo anterior del objeto <code>table</code>. Lo siguiente es una breve lista de los APIS comunes en la web y en las páginas escritas en XML utilizando el DOM.</p>
-
-<ul>
- <li><code><a href="es/DOM/document.getElementById">document.getElementById</a>(id)</code></li>
- <li><code>element.<a href="es/DOM/element.getElementsByTagName">getElementsByTagName</a>(name)</code></li>
- <li><code><a href="es/DOM/document.createElement">document.createElement</a>(name)</code></li>
- <li><code>parentNode.<a href="es/DOM/element.appendChild">appendChild</a>(node)</code></li>
- <li><code>element.<a href="es/DOM/element.innerHTML">innerHTML</a></code></li>
- <li><code>element.<a href="es/DOM/element.style">style</a>.left</code></li>
- <li><code>element.<a href="es/DOM/element.setAttribute">setAttribute</a></code></li>
- <li><code>element.<a href="es/DOM/element.getAttribute">element.getAttribute</a></code></li>
- <li><code>element.<a href="es/DOM/element.addEventListener">addEventListener</a></code></li>
- <li><code><a href="es/DOM/window.content">window.content</a></code></li>
- <li><code><a href="es/DOM/window.onload">window.onload</a></code></li>
- <li><code><a href="es/DOM/window.dump">window.dump</a></code></li>
- <li><code><a href="es/DOM/window.scrollTo">window.scrollTo</a></code></li>
-</ul>
-
-<h2 id="Probando_el_API_del_DOM" name="Probando_el_API_del_DOM">Probando el API del DOM</h2>
-
-<p>Ésta parte procura ejemplos para todas las interfaces usadas en el desarrollo web. En algunos casos, los ejemplos son páginas HTML enteras, con el acceso del DOM a un elemento de &lt;script&gt;, la interfaz necesaria (por ejemplo, botones) para la ejecución del script en un formulario, y también que los elementos HTML sobre los cuales opera el DOM se listen. Según el caso, los ejemplos se pueden copiar y pegar en un documento web para probarlos.</p>
-
-<p>No es el caso donde los ejemplos son muchos más concisos. Para la ejecución de estos ejemplos que sólo demuestran la relación básica entre la interfaz y los elementos HTML, resulta útil tener una página de prueba en la cual las interfaces serán fácilmente accesibles por los scripts. La muy simple página siguiente proporciona en las cabeceras un elemento de script en el cual se pondrán las funciones para testar la interfaz elegida, algunos elementos HTML con atributos que se puedan leer, editar y también manipular, así como la interfaz web necesaria para llamar esas funciones desde el navegador.</p>
-
-<p>Para probar y ver como trabajan en la plataforma del navegador las interfaces del DOM, esta página de prueba o una nueva similar son factibles. El contenido de la función <code>test()</code> se puede actualizar según la necesidad, para crear más botones o poner más elementos.</p>
-
-<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>title</span><span class="punctuation token">&gt;</span></span>Pruebas DOM<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>title</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>application/javascript<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="language-javascript script token">
-    <span class="keyword token">function</span> <span class="function token">setBodyAttr</span><span class="punctuation token">(</span>attr<span class="punctuation token">,</span> value<span class="punctuation token">)</span><span class="punctuation token">{</span>
-      <span class="keyword token">if</span> <span class="punctuation token">(</span>document<span class="punctuation token">.</span>body<span class="punctuation token">)</span> <span class="function token">eval</span><span class="punctuation token">(</span><span class="string token">'document.body.'</span><span class="operator token">+</span>attr<span class="operator token">+</span><span class="string token">'="'</span><span class="operator token">+</span>value<span class="operator token">+</span><span class="string token">'"'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-      <span class="keyword token">else</span> <span class="function token">notSupported</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    </span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>script</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span><span class="language-css style-attr token"><span class="attr-name token"> <span class="attr-name token">style</span></span><span class="punctuation token">="</span><span class="attr-value token"><span class="property token">margin</span><span class="punctuation token">:</span> <span class="number token">.5</span>in<span class="punctuation token">;</span> <span class="property token">height</span><span class="punctuation token">:</span> <span class="number token">400</span><span class="punctuation token">;</span></span><span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>tt</span><span class="punctuation token">&gt;</span></span>texto<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>tt</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>form</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>select</span> <span class="attr-name token">onChange</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>setBodyAttr(<span class="punctuation token">'</span>text<span class="punctuation token">'</span>,
-        this.options[this.selectedIndex].value);<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>black<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>negro
-          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>darkblue<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>azul oscuro
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>select</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>tt</span><span class="punctuation token">&gt;</span></span>bgColor<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>tt</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>select</span> <span class="attr-name token">onChange</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>setBodyAttr(<span class="punctuation token">'</span>bgColor<span class="punctuation token">'</span>,
-        this.options[this.selectedIndex].value);<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>white<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>blanco
-          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>lightgrey<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>gris
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>select</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>tt</span><span class="punctuation token">&gt;</span></span>link<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>tt</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>select</span> <span class="attr-name token">onChange</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>setBodyAttr(<span class="punctuation token">'</span>link<span class="punctuation token">'</span>,
-        this.options[this.selectedIndex].value);<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>blue<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>azul
-          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>green<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>verde
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>select</span><span class="punctuation token">&gt;</span></span>  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>small</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>a</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.brownhen.com/dom_api_top.html<span class="punctuation token">"</span></span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>sample<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-        (sample link)<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>a</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>small</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>br</span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>form</span><span class="punctuation token">&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>form</span><span class="punctuation token">&gt;</span></span>
-        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>input</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button<span class="punctuation token">"</span></span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>version<span class="punctuation token">"</span></span> <span class="attr-name token">onclick</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>ver()<span class="punctuation token">"</span></span> <span class="punctuation token">/&gt;</span></span>
-      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>form</span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<p>La creación de una página de prueba con una paleta de botones, campos de texto u otros elementos HTML, permitirá testar una gran cantidad de interfaces en un mismo documento, por ejemplo una serie de propiedades que afectan a los colores de una página web. Lo siguiente permite hacerse una idea de como pueden agruparse las interfaces para probarlas.</p>
-
-<p><font><font>Figura 0.1 Muestra DOM página de prueba</font></font></p>
-
-<p><img alt="" src="https://developer.mozilla.org/@api/deki/files/173/=DOM_Ref_Introduction_to_the_DOM.gif" style="height: 375px; width: 199px;"></p>
-
-<p>En este ejemplo, los menúes desplegables actualizan dinámicamente los aspectos de la página web accesibles al DOM como el color de fondo (<code>bgColor</code>), de los hiper-enlaces (<code>aLink</code>), y el del texto (<code>text</code>). El hecho de diseñar páginas, testar las interfaces que se encuentren a lo largo de la lectura son una parte importante del aprendizaje para una utilización eficaz del DOM.</p>
-
-<h2 id="Otros_enlaces"><strong>Otros enlaces</strong></h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model"><font><font>Referencia DOM</font></font></a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction"><font><font>Introducción al DOM</font></font></a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Events"><font><font>Eventos y el DOM</font></font></a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Examples"><font><font>Ejemplos</font></font></a></li>
-</ul>
-
-<div class="s3gt_translate_tooltip_mini_box" id="s3gt_translate_tooltip_mini" style="background: initial !important; border: initial !important; border-radius: initial !important; border-collapse: initial !important; direction: ltr !important; font-weight: initial !important; height: initial !important; letter-spacing: initial !important; max-width: initial !important; min-height: initial !important; margin: auto !important; outline: initial !important; padding: initial !important; position: absolute; text-align: initial !important; text-shadow: initial !important; width: initial !important; display: initial !important; color: inherit !important; font-size: 13px !important; font-family: X-LocaleSpecific,sans-serif,Tahoma,Helvetica !important; line-height: 13px !important; vertical-align: top !important; white-space: inherit !important; left: 10px; top: 35px; opacity: 0.85;">
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Reproducir"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copy text to Clipboard"> </div>
-</div>
-
-<div class="s3gt_translate_tooltip_mini_box" id="s3gt_translate_tooltip_mini" style="background: initial !important; border: initial !important; border-radius: initial !important; border-collapse: initial !important; direction: ltr !important; font-weight: initial !important; height: initial !important; letter-spacing: initial !important; max-width: initial !important; min-height: initial !important; margin: auto !important; outline: initial !important; padding: initial !important; position: absolute; text-align: initial !important; text-shadow: initial !important; width: initial !important; display: initial !important; color: inherit !important; font-size: 13px !important; font-family: X-LocaleSpecific,sans-serif,Tahoma,Helvetica !important; line-height: 13px !important; vertical-align: top !important; white-space: inherit !important; left: 39px; top: 1952px; opacity: 0.45;">
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Escuchar"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copiar texto al Portapapeles"> </div>
-</div>
-
-<div class="s3gt_translate_tooltip_mini_box" id="s3gt_translate_tooltip_mini" style="background: initial !important; border: initial !important; border-radius: initial !important; border-collapse: initial !important; direction: ltr !important; font-weight: initial !important; height: initial !important; letter-spacing: initial !important; max-width: initial !important; min-height: initial !important; margin: auto !important; outline: initial !important; padding: initial !important; position: absolute; text-align: initial !important; text-shadow: initial !important; width: initial !important; display: initial !important; color: inherit !important; font-size: 13px !important; font-family: X-LocaleSpecific,sans-serif,Tahoma,Helvetica !important; line-height: 13px !important; vertical-align: top !important; white-space: inherit !important; left: 307px; top: 1961px; opacity: 0;">
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Escuchar"> </div>
-
-<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copiar texto al Portapapeles"> </div>
-</div>
diff --git a/files/es/referencia_dom_de_gecko/localizando_elementos_dom_usando_selectores/index.html b/files/es/referencia_dom_de_gecko/localizando_elementos_dom_usando_selectores/index.html
deleted file mode 100644
index cf8a94cd4a..0000000000
--- a/files/es/referencia_dom_de_gecko/localizando_elementos_dom_usando_selectores/index.html
+++ /dev/null
@@ -1,50 +0,0 @@
----
-title: Localizando elementos DOM usando selectores
-slug: Referencia_DOM_de_Gecko/Localizando_elementos_DOM_usando_selectores
-tags:
-  - DOM
-  - Necesita actualizacion para principiantes
-  - Principiante
-translation_of: Web/API/Document_object_model/Locating_DOM_elements_using_selectors
----
-<p>Los selectores api proveen metodos que hacen mas facil y rapido devolver elementos del nodo {{domxref("Element")}} del DOM mediante emparejamiento de un conjunto de selectores. Esto es mucho mas rapido que las tecnicas anteriores, donde fuera necesario, por ejemplo usar un loop en un codigo JavaScript para localizar el item especifico que quisieras encontrar.</p>
-
-<h2 id="Interfaz_de_NodeSelector">Interfaz de NodeSelector</h2>
-
-<p>Esta especificación añade dos nuevos metodos a cualquier objeto implementando el {{domxref("Document")}}, {{domxref("DocumentFragment")}}, o {{domxref("Element")}} interfaces:</p>
-
-<dl>
- <dt>{{domxref("Element.querySelector", "querySelector()")}}</dt>
- <dd>Devuelve la primera coincidencia del (elemento) {{domxref("Element")}} nodo dentro de las subramas del nodo. Sino se encuentra un nodo coincidente, se devuelve <code>null</code> .</dd>
- <dt>{{domxref("Element.querySelectorAll", "querySelectorAll()")}}</dt>
- <dd>devuelve un listado de nodos {{domxref("NodeList")}} conteniendo todos los elementos del nodo coincidentes( <code>Element</code>) dentro de las subramas del nodo, o Devuelve un Listado de Nodos vacio <code>NodeList</code> sino se encuentran coincidencias.</dd>
-</dl>
-
-<div class="note"><strong>Note:</strong> El {{domxref("NodeList")}} devuelto por {{domxref("Element.querySelectorAll()", "querySelectorAll()")}} no es dinamico, Es decir que cualquier cambio realizado en el DOM no se vera reflejado en la coleccion. Esto es diferente de otros metodos de querying del dom que si devuelven listados de nodos dinamicos.</div>
-
-<p>Encontraras ejemplos y detalles leyendo el documento de metodos {{domxref("Element.querySelector()")}} y {{domxref("Element.querySelectorAll()")}}, Tambien en el articulo <a class="internal" href="/en-US/docs/Code_snippets/QuerySelector" title="en-US/docs/Code snippets/QuerySelector">Code snippets for querySelector</a>.</p>
-
-<h2 id="Selectors">Selectors</h2>
-
-<p>El metodo de selectores acepta uno o mas selectores seperados por comas entre cada selector  para determinar que elemento o elementos deben ser devueltos. por ejemplo para seleccionar todos los elementos (p) del parrafo en un documento donde la clase CSS sea tanto <code>warning</code> or <code>note</code>, podes hacer lo siguiente:</p>
-
-<pre class="notranslate"><code>var special = document.querySelectorAll( "p.warning, p.note" );</code></pre>
-
-<p>tambien por usar query para etiquetas id. Por ejemplo:</p>
-
-<pre class="notranslate"><code>var el = document.querySelector( "#main, #basic, #exclamation" );</code></pre>
-
-<p>luego de ejecutar el codigo de arriba, la variable <code>el</code> contiene el primer elemento del documento, su ID puede ser uno de los siguentes  <code>main</code>, <code>basic</code>, or <code>exclamation</code>.</p>
-
-<p>Podes usar cualquier selector CSS con los metodos <code>querySelector()</code> y <code>querySelectorAll()</code><em>.</em></p>
-
-<h2 id="Ver_tambien.">Ver tambien.</h2>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/selectors-api/" title="http://www.w3.org/TR/selectors-api/">Selectors API</a></li>
- <li>{{domxref("Element.querySelector()")}}</li>
- <li>{{domxref("Element.querySelectorAll()")}}</li>
- <li>{{domxref("Document.querySelector()")}}</li>
- <li>{{domxref("Document.querySelectorAll()")}}</li>
- <li><a href="/en-US/docs/Code_snippets/QuerySelector" title="en-US/docs/Code_snippets/QuerySelector">Code snippets for querySelector</a></li>
-</ul>
diff --git a/files/es/referencia_dom_de_gecko/prefacio/index.html b/files/es/referencia_dom_de_gecko/prefacio/index.html
deleted file mode 100644
index 7759932552..0000000000
--- a/files/es/referencia_dom_de_gecko/prefacio/index.html
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: Prefacio
-slug: Referencia_DOM_de_Gecko/Prefacio
-tags:
-  - DOM
-  - Todas_las_Categorías
-translation_of: Web/API/Document_Object_Model
-translation_of_original: Web/API/Document_Object_Model/Preface
----
-<p>« <a href="es/Referencia_DOM_de_Gecko">Referencia DOM de Gecko</a></p>
-
-<h3 id="Sobre_Esta_referencia" name="Sobre_Esta_referencia">Sobre Esta referencia</h3>
-
-<p>Esta parte describe el manual en sí: para quién está hecho, cómo se presenta la información y cómo se pueden usar los ejemplos de la referencia en el desarrollo propio de DOM.</p>
-
-<p>Notará que este documento está en curso de desarrollo y aún no es un listado completo de todos los métodos y propiedades DOM que funcionan para GECKO. Sin embargo, cada parte individual de esta guía (por ejemplo, <a href="es/DOM/document">La referencia al documento de DOM</a>) sí está completa para el/los objeto/s que describe. Cuando nuevas informaciones de referencia para los numerosos miembros de esta enorme API estén disponibles, se irán integrando dentro de este documento.</p>
-
-<h3 id="A_qui.C3.A9n_va_dirigida_esta_gu.C3.ADa.3F" name="A_qui.C3.A9n_va_dirigida_esta_gu.C3.ADa.3F">A quién va dirigida esta guía?</h3>
-
-<p>El lector de <a href="es/Referencia_DOM_de_Gecko">Referencia DOM de Gecko</a> puede ser un desarrollador Web o un usuario sabio que tiene alguna idea de como se construyen las páginas Web. Esta referencia evita tener presunciones sobre el nivel de conocimiento del lector con el DOM, el <a href="es/XML">XML</a>, los servidores o estándares Web y también con <a href="es/JavaScript">JavaScript</a>, el lenguaje en el cual el DOM se hace accesible al lector. Al contrario, sí, supone de la familiaridad con <a href="es/HTML">HTML</a>, el marcado, la estructura básica de las páginas Web, los navegadores y con las hojas de estilo.</p>
-
-<p>El material introductorio presentado aquí, con sus varios ejemplos y sus explicaciones de alto nivel, debe ser valorado tanto para los desarrolladores inexpertos como para los experimentados, no es sólo una guía de desarrollo Web para <em>principiantes</em>. En general y sin embargo se le puede considerar como un manual evolutivo del API.</p>
-
-<h3 id="Qu.C3.A9_es_Gecko.3F" name="Qu.C3.A9_es_Gecko.3F">Qué es Gecko?</h3>
-
-<p>Mozilla, Firefox, Netscape 6+, y otros navegadores basados en Mozilla tienen la idéntica codificación DOM. Es así porque utilizan la misma tecnología. <span class="comment">naturalmente, es sólo aplicable a los productos basados en la misma versión de Gecko, pero es complicado explicarlo - (naturally, it applies only to products based on the same version of Gecko, but it's tricky to explain)</span></p>
-
-<p>Gecko, la parte del programa en estos navegadores que se ocupa del análisis del HTML, de la disposición de las páginas, del modelo de objeto del documento, e incluso de la representación de la interfaz de aplicación entera, es una rápida, máquina cumplidora de los estándares de presentación que ejecutar los estándares del modelo de objeto del navegador (por ejemplo, <a href="es/DOM/window">ventana - <code>window</code></a>) del W3C DOM y del parecido DOM (pero no estándar) en el contexto de las páginas Web y la interfaz de aplicación (o<em>chrome</em>) del navegador.</p>
-
-<p>Aunque la interfaz de aplicación y el contenido exhibido por el navegador son diferentes en muchos puntos, el DOM los expone uniformemente como una jerarquía de nodos. <span class="comment">(commenting this incomplete sentence out for now...) The tree structure of the DOM (which in its application to the user</span></p>
-
-<h3 id="Sintaxis_del_API" name="Sintaxis_del_API">Sintaxis del API</h3>
-
-<p>Cada descripción en la referencia API incluye la sintaxis, los parámetros de entrada y salida (donde el tipo de retorno es agarrado), un ejemplo, todas las notas adicionales y un enlace a la especificación apropiada.</p>
-
-<p>Típicamente, las propiedades de sólo lectura tienen una simple línea de sintaxis, porque es posible leerlas pero imposible modificarlas. Por ejemplo, la propiedad de sólo lectura <code>availHeight</code> del objeto <code>screen</code> incluye la información siguiente:</p>
-
-<div></div>
-
-<p>Eso significa que sólo se puede utilizar la propiedad a la derecha de la declaración. En el caso de propiedades de lectura/escritura (posibilidad de modificación) se puede asignar un valor a la propiedad, como se ilustra en el siguiente ejemplo de sintaxis:</p>
-
-<div></div>
-
-<p>En general, el objeto cuyo miembro se está describiendo se pone en la declaración con un sólo tipo de dato:</p>
-
-<ul>
- <li><code>element</code> para todos los elementos.</li>
- <li><code>document</code> para el documento entero.</li>
- <li><code>table</code> para una tabla, etc.</li>
- <li>Para más información sobre la: <a href="es/Referencia_Gecko_del_DOM/Introducci%c3%b3n#Importancia_de_los_tipos_de_datos">Importancia de los tipos de datos</a>, lea este artículo.</li>
-</ul>
-
-<h3 id="Utilizaci.C3.B3n_de_ejemplos" name="Utilizaci.C3.B3n_de_ejemplos">Utilización de ejemplos</h3>
-
-<p>Varios ejemplos en esta referencia son archivos completos que se pueden ejecutar copiándolos y pegándolos dentro de un nuevo archivo y abriéndolo en un navegador. Otros son trozos de código que se pueden ejecutar poniéndolos en las funciones repeticón de llamada (<code>callback</code>) de JavaScript. Por ejemplo, la propiedad de <a href="es/DOM/window.document">window.document</a> se puede probar dentro de la siguiente función, la cual es llamada por el botón acompañante:</p>
-
-<pre>&lt;html&gt;
-
-&lt;script&gt;
-function testWinDoc() {
-
-  doc= window.document;
-
-  alert(doc.title);
-
-}
-&lt;/script&gt;
-
-&lt;button onclick="testWinDoc();"&gt;Prueba la propiedad del documento&lt;/button&gt;
-
-&lt;/html&gt;
-</pre>
-
-<p>Funciones y páginas similares pueden ser creadas para todos los miembros de objeto que no hayan sido ya preparados para su uso directo. Ver la parte <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Probando_el_API_del_DOM">Probando el API del DOM</a> en la introducción para una "prueba pesada" que permite probar varios API a la vez.</p>
-
-<p>{{ languages( { "en": "en/Gecko_DOM_Reference/Preface", "fr": "fr/R\u00e9f\u00e9rence_du_DOM_Gecko/Pr\u00e9face", "ja": "ja/Gecko_DOM_Reference/Preface", "ko": "ko/Gecko_DOM_Reference/Preface", "pl": "pl/Dokumentacja_Gecko_DOM/Przedmowa", "zh-cn": "cn/Gecko_DOM_\u53c2\u8003/Preface" } ) }}</p>
diff --git a/files/es/sections_and_outlines_of_an_html5_document/index.html b/files/es/sections_and_outlines_of_an_html5_document/index.html
deleted file mode 100644
index 145f89d9ae..0000000000
--- a/files/es/sections_and_outlines_of_an_html5_document/index.html
+++ /dev/null
@@ -1,411 +0,0 @@
----
-title: Secciones y esquema de un documento HTML5
-slug: Sections_and_Outlines_of_an_HTML5_document
-translation_of: Web/Guide/HTML/Using_HTML_sections_and_outlines
----
-<p>La especificación HTML5 trae muchos nuevos elementos a los desarrolladores web, permitiéndoles describir la estructura de un documento web con semántica estandarizada. Este documento describe estos elementos y cómo usarlos para definir el esquema de cualquier documento.</p>
-
-<div class="note">
-<p>A lo largo de este documento se empleará la palabra <strong>esquema</strong> en el sentido de esqueleto estructural o tabla de contenido, similar a cómo el índice de un libro muestra la estructura jerárquica de su contenido. Asimismo, usaremos <strong>algoritmo de esquematizado</strong> al proceso de construir el esquema infiriéndolo del contenido.</p>
-</div>
-
-<h2 id="Estructura_de_un_documento_HTML_4">Estructura de un documento HTML 4</h2>
-
-<p>La estructura de un documento, por ejemplo la estructura semántica de lo que está entre<code> &lt;body&gt;</code> y <code>&lt;/body&gt;</code> es fundamental para presentar la página al usuario. HTML4 usa la idea de secciones y subsecciones de un documento para describir su estructura. Una sección está definida por un elemento divisor HTML ({{HTMLElement("div")}}) con elementos de cabecera HTML ({{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, o {{HTMLElement("h6")}}) en él, definiendo sus títulos. La relación de estos elementos divisor y de cabecera HTML desemboca en la estructura del documento y su esquema.</p>
-
-<p>Entonces el siguiente marcado:</p>
-
-<div style="overflow: hidden;">
-<pre class="brush:xml">&lt;div class="seccion" id="zorro" &gt;
-&lt;h1&gt;El zorro&lt;/h1&gt;
-&lt;p&gt;En esta sección discutiremos sobre los aspectos menos conocidos del zorro.
-... bla, bla, bla ...
-&lt;div class="subseccion" id="zorro-habitat" &gt;
-&lt;h2&gt;Hábitat&lt;/h2&gt;
-&lt;p&gt;El zorro necesita un nido en donde poner sus huevos, de ahí que necesite árboles.
-...bla, bla, bla...
-&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<p>genera el siguiente esquema:</p>
-
-<pre>1. El zorro
-   1.1 Hábitat
-</pre>
-
-<p>Los elementos {{HTMLElement("div")}} no son obligatorios para definir una nueva sección. La sola presencia de un elemento de cabecera HTML es suficiente para implicar una nueva sección. Entonces,</p>
-
-<pre class="brush:xml">&lt;h1&gt;El zorro&lt;/h1&gt;
-&lt;p&gt;En esta sección discutiremos sobre los aspectos menos conocidos del zorro.
-... bla, bla, bla ...
-&lt;h2&gt;Hábitat&lt;/h2&gt;
-&lt;p&gt;El zorro necesita un nido en donde poner sus huevos, de ahí que necesite árboles.
-...bla, bla, bla...
-&lt;h2&gt;Costrumbres&lt;/h2&gt;
-&lt;h1&gt;El oso&lt;/h1&gt;
-</pre>
-
-<p>genera el siguiente esquema:</p>
-
-<pre>1. El zorro
-   1.1 Hábitat
-   1.2 Costumbres
-2. El oso
-</pre>
-
-<h2 id="Problemas_resueltos_por_HTML5">Problemas resueltos por HTML5</h2>
-
-<p>La definición de la estructura de un documento en HTML 4 y su algoritmo de esquematizado es muy tosco y genera numerosos problemas:</p>
-
-<ol>
- <li>El uso de {{HTMLElement("div")}} para definir secciones semánticas sin definir valores específicos para los atributos <strong>class</strong> hace imposible la automatización del algoritmo de esquematizado ("¿Es ese {{HTMLElement("div")}} parte del esquema de la página, definiendo una sección o subsección?" o "¿es un {{HTMLElement("div")}} sólo de presentación, sólo usado para estilo?"). En otras palabras, la especificación HTML4 es muy imprecisa de lo que es una sección y cómo ese ámbito está definido. La generación automatizada del esquema es importante, especialmente para <a class="external" href="https://es.wikipedia.org/wiki/Tecnolog%C3%ADas_de_apoyo" title="http://en.wikipedia.org/wiki/Assistive_technology">tecnologías de apoyo</a>, que son capaces de adaptar la forma en que presentan información a los usuarios de acuerdo a la estructura del documento. HTML5 quita la necesidad de elementos {{HTMLElement("div")}} del algoritmo de esquematizado introduciendo un nuevo elemento, {{HTMLElement("section")}}, el elemento de sección HTML.</li>
- <li>Mezclar varios documentos es difícil: la inclusión de un sub-documento en un documento principal significa cambiar el nivel de los elementos de cabecera HTML Headings Element para que el esquema se mantenga. Esto se resuelve en HTML5 con los recientemente introducidos elementos de seccionado ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} y {{HTMLElement("aside")}}) son siempre subsecciones dentro de la sección que las contiene, sin importar qué secciones son creadas por cabeceras internas.</li>
- <li>Debido a que cada elemento de cabecera HTML es parte del esquema, no es posible describir un subtítulo o título secundario (por ejemplo, <code>&lt;h1&gt;Mozart&lt;/h1&gt;&lt;h2&gt;El genio salzburgués&lt;/h2&gt;</code> crea el esquema <code>1. Mozart 1.1 El genio salzburgués</code>). HTML5 introduce el elemento {{HTMLElement("hgroup")}} que oculta todos los elementos de cabecera excepto el primero de más alto rango (por ejemplo, <code>&lt;hgroup&gt;&lt;h1&gt;Mozart&lt;/h1&gt;&lt;h2&gt;El genio salzburgués&lt;/h2&gt;&lt;/hgroup&gt;</code> crea el esquema <code>1. Mozart</code>).</li>
- <li>En HTML4, cada sección es parte del esquema del documento. Pero los documentos no son lineales a veces. Un documento puede tener secciones especiales conteniendo información que no es parte del flujo principal, aunque esté relacionado a él, como un bloque de publicidad o una caja de explicación. HTML5 introduce el elemento {{HTMLElement("aside")}} permitiendo a dichas secciones no ser parte del esquema principal.</li>
- <li>Otra vez, en HTML4, debido a que cada sección es parte del esquema del documento, no hay forma de tener una sección conteniendo información relacionada no al documento pero sí al sitio entero, como logos, menús, tablas de contenidos, o información de derechos de autor y notas legales. Para ese propósito, HTML5 introduce tres elementos de sección específicos: {{HTMLElement("nav")}} para colecciones de enlaces, como una tabla de contenidos, {{HTMLElement("footer")}} y {{HTMLElement("header")}} información relacionada con el sitio.</li>
-</ol>
-
-<p>De manera más general, HTML5 trae precisión a las características de seccionado y cabecera, permitiendo a los esquemas de documento ser predecibles y usados por el navegador para mejorar la experiencia del usuario.</p>
-
-<h2 id="El_algoritmo_de_esquematizado_de_HTML5">El algoritmo de esquematizado de HTML5</h2>
-
-<h3 id="Definiendo_secciones_en_HTML5">Definiendo secciones en HTML5</h3>
-
-<p>Todo el contenido incluido dentro del elemento {{HTMLElement("body")}} es parte de una sección. Las secciones en HTML5 pueden ser anidadas. Además de la sección principal, definida por el elemento {{HTMLElement("body")}}, los límites de la sección son definidos explícita o implícitamente. La secciones definidas explícitamente son el contenido definido en las etiquetas {{HTMLElement("body")}},  {{HTMLElement("section")}},  {{HTMLElement("article")}},  {{HTMLElement("aside")}}, {{HTMLElement("footer")}},  {{HTMLElement("header")}}, y {{HTMLElement("nav")}}.</p>
-
-<div class="note"><strong>Nota: </strong>Cada sección puede tener su propia jerarquía de cabeceras. Por lo tanto, incluso una sección anidada puede tener un elemento {{HTMLElement("h1")}}. Consulte también <a href="/en-US/docs/Sections_and_Outlines_of_an_HTML5_document#Defining_Headings_in_HTML5" title="en-US/docs/Sections_and_Outlines_of_an_HTML5_document#Defining_Headings_in_HTML5">Definiendo cabeceras en HTML5</a>.</div>
-
-<p>Ejemplo:</p>
-
-<pre class="brush:xml">&lt;section&gt;
-  &lt;h1&gt;El pato&lt;/h1&gt;
-  &lt;section&gt;
-    &lt;h1&gt;Introducción&lt;/h1&gt;
-    &lt;p&gt;En esta sección, ampliaremos nuestro concepto del pato.
-  &lt;/section&gt;
-  &lt;section&gt;
-    &lt;h1&gt;Hábitat&lt;/h1&gt;
-    &lt;p&gt;El pato, como fiero depredador, necesita un entorno con abundantes lobos que cazar.
-  &lt;/section&gt;
-  &lt;aside&gt;
-    &lt;p&gt;otros estudiosos del pato
-  &lt;/aside&gt;
-&lt;/section&gt;
-&lt;footer&gt;
-  &lt;p&gt;(c) 2010 The Example company
-&lt;/footer&gt;</pre>
-
-<p>El bloque de HTML define dos secciones de alto nivel:</p>
-
-<pre><span style="color: red;">&lt;section&gt;
-  &lt;h1&gt;El pato&lt;/h1&gt;
-  &lt;section&gt;
-    &lt;h1&gt;Introducción&lt;/h1&gt;
-    &lt;p&gt;En esta sección, ampliaremos nuestro concepto del pato.
-  &lt;/section&gt;
-  &lt;section&gt;
-    &lt;h1&gt;Hábitat&lt;/h1&gt;
-    &lt;p&gt;El pato, como fiero depredador, necesita un entorno con abundantes lobos que cazar.
-  &lt;/section&gt;
-   &lt;aside&gt;
-    &lt;p&gt;otros estudiosos del pato
-  &lt;/aside&gt;
-&lt;/section&gt;</span>
-
-<span style="color: green;">&lt;footer&gt;
-  &lt;p&gt;(c) 2010 The Example company
-&lt;/footer&gt;</span></pre>
-
-<p>La primera sección tiene tres subsecciones:</p>
-
-<pre>&lt;section&gt;
-  &lt;h1&gt;El pato&lt;/h1&gt;
-
-  <span style="color: red;">&lt;section&gt;
-    &lt;h1&gt;Introducción&lt;/h1&gt;
-    &lt;p&gt;En esta sección, ampliaremos nuestro concepto del pato.
-  &lt;/section&gt;</span>
-
-  <span style="color: green;">&lt;section&gt;
-    &lt;h1&gt;Hábitat&lt;/h1&gt;
-    &lt;p&gt;El pato, como fiero depredador, necesita un entorno con abundantes lobos que cazar.
-  &lt;/section&gt;</span>
-
-  <span style="color: blue;">&lt;aside&gt;
-    &lt;p&gt;Otros estudiosos del lobo
-  &lt;/aside&gt;</span>
-&lt;/section&gt;
-
-&lt;footer&gt;
-  &lt;p&gt;(c) 2010 The Example company
-&lt;/footer&gt;</pre>
-
-<p>Esto genera la siguiente estructura:</p>
-
-<pre>1. El pato
-   1.1 Introducción
-   1.2 Hábitat
-   1.3 Section (aside)
-</pre>
-
-<h3 id="Definiendo_cabeceras_en_HTML5">Definiendo cabeceras en HTML5</h3>
-
-<p>Mientras que los elementos de seccionado en HTML definen la estructura de un documento, un esquema también necesita cabeceras para ser útil. La regla básica es simple: el primer elemento de cabecera HTML (uno de los {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}) define la cabecera de la sección actual.</p>
-
-<p>Los elementos de cabecera tienen un <em>rango</em> dado por el número del nombre del elemento, donde {{HTMLElement("h1")}} tiene el rango <em>más alto</em>, y {{HTMLElement("h6")}} tiene el rango <em>más bajo</em>. Los rangos relativos importan sólo en una sección; el esquema es determinado por las secciones, no por el rango de cabeceras de las secciones. Por ejemplo, este código:</p>
-
-<pre class="brush:xml">&lt;section&gt;
-  &lt;h1&gt;La mosca&lt;/h1&gt;
-  &lt;p&gt;El esta sección hablaremos de la mosca, una criatura adorable.
-    ... bla, bla, bla ...
-  &lt;section&gt;
-    &lt;h2&gt;Hábitat&lt;/h2&gt;
-    &lt;p&gt;Únicamente se han divisado colonias de moscas en los montes de....
-        ...bla, bla, bla ...
-  &lt;/section&gt;
-&lt;/section&gt;
-&lt;section&gt;
-  &lt;h3&gt;El mosquito&lt;/h3&gt;
-  &lt;p&gt;A continuación, otra rareza a punto de extinguirse, el mosquito.
-     ...bla, bla, bla...
-&lt;/section&gt;</pre>
-
-<p>Genera el siguiente esquema:</p>
-
-<pre>1. La mosca
-   1.1 Hábitat
-2. El mosquito</pre>
-
-<p>Nótese que el rango del elemento de cabecera (en el ejemplo, {{HTMLElement("h1")}} para la primera sección de más alto nivel, {{HTMLElement("h2")}} para la subsección y {{HTMLElement("h3")}} para la segunda sección de alto nivel) no es importante. (Cualquier rango puede ser usado como la cabecera de una sección explícitamente definida, aunque esta práctica no es recomendada).</p>
-
-<h3 id="Seccionado_implícito">Seccionado implícito</h3>
-
-<p>Debido a que los elementos de seccionado HTML5 no son obligatorios para definir un esquema, para mantener la compatibilidad con la web existente dominada por HTML4, hay una forma de definir secciones sin ellas. Esto es llamado <em>seccionado implícito</em>.</p>
-
-<p>Los elementos de cabecera ({{HTMLElement("h1")}} a {{HTMLElement("h6")}}) definen un nuevo seccionado implícito cuando ellos no son el primer encabezado de sus secciones padre. La forma en que esta sección implícita es posicionada en el esquema es definida por su rango relativo con la cabecera anterior en su sección padre. Si es de un rango más bajo que la cabecera anterior, abre una sub-sección implícita de la sección. Este código:</p>
-
-<pre class="brush:xml">&lt;section&gt;
-  &lt;h1&gt;El águila&lt;/h1&gt;
-  &lt;p&gt; ....
-
-  &lt;h3 class="subsec-implicita"&gt;Hábitat&lt;/h3&gt;
-  &lt;p&gt; ...
-&lt;/section&gt;</pre>
-
-<p>Genera el siguiente esquema:</p>
-
-<pre><strong>1. El águila</strong>
-   <strong>1.1 Hábitat</strong> <em>(impícitamente definido mediante &lt;h3&gt;)</em>
-</pre>
-
-<p>Si es del mismo rango que la cabecera anterior, cierra la sección previa  (¡que puede haber sido explícita!) y abre una nueva sección implícita del mismo nivel: </p>
-
-<pre class="brush:xml">&lt;section&gt;
-  &lt;h1&gt;El águila&lt;/h1&gt;
-  &lt;p&gt;...
-  &lt;h1 class="secc-implicita"&gt;El buitre&lt;/h1&gt;
-  &lt;p&gt;...
-&lt;/section&gt;</pre>
-
-<p>genera el siguiente esquema: </p>
-
-<pre><strong>1. El águila</strong>
-<strong>2. El buitre</strong> <em>(implícitamente definido por &lt;h1&gt;, quien al mismo tiempo cierra el &lt;h1&gt; anterior)</em>
-</pre>
-
-<p>Si es de un rango más alto que el encabezamiento anterior, cierra la sección anterior y abre una nueva sección implícita al más alto nivel:</p>
-
-<pre class="brush:xml">&lt;body&gt;
-  &lt;h1&gt;Colores&lt;/h1&gt;
-  &lt;h2&gt;Rojo&lt;/h2&gt;
-  &lt;p&gt; ...
-  &lt;section&gt;
-    &lt;h3&gt;Amarillo&lt;/h3&gt;
-    &lt;p&gt; ...
-    &lt;h3&gt;Verde&lt;/h3&gt;
-      &lt;p&gt; ...
-    &lt;h2&gt;Sabores&lt;/h2&gt;
-      &lt;p&gt;...
-  &lt;/section&gt;
-&lt;/body&gt;</pre>
-
-<p>generando el siguiente esquema:</p>
-
-<pre><strong>1. Colores
-   1.1 Rojo</strong> <em>(implícitamente con <code>&lt;h2&gt;</code> )</em>
-   <strong>1.2 Amarillo</strong><em>(explícitamente con <code>&lt;section&gt; </code>)</em>
-   <strong>1.3 Verde</strong> <em>(impícitamente con <code>&lt;h3&gt;</code>, cerrando el <code>&lt;h3&gt;</code> previo)</em>
-<strong>2. Sabores</strong> <em>(implícitamente con &lt;h2&gt;, cerrando el &lt;section&gt; previo)</em>
-</pre>
-
-<p>Éste no es el esquema que uno podría observando las etiquetas de encabezamiento. Para hacer que tu marcado sea entendible para una persona que eche un vistazo rápido al código, es una buena práctica</p>
-
-<ul>
- <li>Usar <strong>etiquetas explícitas</strong> para abrir y cerrar secciones.</li>
- <li> Acomodar el rango de cabecera al nivel de anidamiento de la sección deseada. </li>
-</ul>
-
-<p>Sin embargo, esto no es requerido por la especificación HTML5. Si encuentra que los navegadores están generando el esquema de su documento en formas inesperadas, verifique si tiene secciones que están cerradas implícitamente por elementos de cabecera.</p>
-
-<p>Una <strong>excepción</strong> a la regla de que ese rango de cabecera debe corresponderse con el nivel de anidamiento de sección es para secciones que pueden ser <strong>reutilizadas</strong> en múltiples documentos. Por ejemplo, una sección puede ser almacenada en un sistema de gestión de contenidos y ensamblada en documentos en tiempo de ejecución. En este caso, una buena práctica es comenzar en {{HTMLElement("h1")}} para el nivel de cabecera más alto de la sección reusable. El nivel anidado de la sección reusable será determinado por la jerarquía de la sección del documento en el que aparece. Las etiquetas de secciones aún son útiles en este caso.</p>
-
-<h3 id="Sobreescribiendo_seccionamiento_implícito">Sobreescribiendo seccionamiento implícito</h3>
-
-<p>A veces una sección necesita tener varios encabezamientos. Unos pocos casos usuales son:</p>
-
-<ul>
- <li>Una sección cuyo encabezado principal es acompañado de otro encabezado , cuyo propósito es adornar o aportar cierta información al encabezado principal, pero sin oscurecerlo a la hora de formar el esquema estructural:
-  <pre class="brush:xml">&lt;section&gt;
-  &lt;h1&gt;La flauta mágica&lt;/h1&gt;
-  &lt;h2&gt;Ópera en dos actos del genio salzburgués&lt;/h2&gt;
-&lt;/section&gt;</pre>
-
-  <p>genera el siguiente esquema, que claramene <strong>no</strong> es el que se desea:</p>
-
-  <pre>1. La flauta mágica
-   1.1 Ópera en dos actos del genio salzburgués
-</pre>
- </li>
- <li>El encabezado secundario puede ser usado por una lista de etiquetas:
-  <pre class="brush:xml">&lt;section&gt;
-  &lt;h1&gt;Secciones y esquema del documento&lt;/h1&gt;
-  &lt;h2&gt;HTML, HTML5, secciones, esquema&lt;/h2&gt;
-&lt;/section&gt;</pre>
-
-  <p>genera el siguiente esquema, que <strong>tampoco es</strong> el que se desea:</p>
-
-  <pre>1. Secciones y esquema del documento
-   1.1 HTML, HTML5, secciones, esquema</pre>
- </li>
-</ul>
-
-<p>Debido al seccionado implícito, <strong>esto no es posible sin la ayuda del elemento de agrupamiento de cabeceras</strong> ({{HTMLElement("hgroup")}} introducido en HTML5). Esto oculta todas las cabeceras del grupo, excepto la primera, permitiendo una sobreescritura del seccionado implícito. Observa las diferencias:</p>
-
-<pre class="brush:xml">&lt;section&gt;
-  &lt;hgroup&gt;
-    &lt;h1&gt;La flauta mágica&lt;/h1&gt;
-    &lt;h2&gt;Ópera en dos actos del genio salzburgués&lt;/h2&gt;
-  &lt;/hgroup&gt;
-  ... algún contenido ...
-&lt;/section&gt;
-</pre>
-
-<p>genera el siguiente esquema, que es el que se desea:</p>
-
-<pre>1. La flauta mágica</pre>
-
-<h3 id="Secciones_desacopladas"><a name="sectioning_root">Secciones desacopladas</a></h3>
-
-<p>Piensa por un momento en una sección <strong><em>A</em></strong> que contiene una subsección <strong><em>B</em></strong>. A veces es conveniente que <em><strong>B</strong></em> mantenga su esquema interno ( subsecciones, encabezados, etc. ), pero que no "ensucie" el esquema de<em><strong> A</strong></em>, dando lugar a esquemas más claros.</p>
-
-<p>Existen elementos, cuyo propósito habitual es introducir contenido externo a la página: {{HTMLElement("blockquote")}}, {{HTMLElement("details")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}} y {{HTMLElement("td")}}.<br>
-  Estos elementos no se "montan" sobre el esquema global, sin importar su contenido, lo que conlleva un desacoplo o aislamiento entre las partes.</p>
-
-<p>Además, el elemento de partida para formar el esquema del documento es  {{HTMLElement("body")}}, el cual por ser la raíz,  se encuentra ya desacoplada de forma natural, en el sentido de que no se puede ir más arriba en el contexto.</p>
-
-<p>Ejemplo:</p>
-
-<pre class="brush: html">&lt;section&gt;
-  &lt;h1&gt;Bach&lt;/h1&gt;
-  &lt;section&gt;
-    &lt;h2&gt;Introducción&lt;/h2&gt;
-    &lt;p&gt;...
-  &lt;/section&gt;
-  &lt;section&gt;
-    &lt;h2&gt;La Pasión según S. Mateo&lt;/h2&gt;
-    &lt;p&gt; Bla, bla, bla ...
-    &lt;blockquote&gt;
-       &lt;h1&gt;Friedich Nietzsche
-       &lt;p&gt;“Esa semana he ido a escuchar tres veces la Pasión según san Mateo del divino Bach, y en cada una de ellas con el mismo sentimiento de máxima admiración. Una persona que -como yo- ha olvidado completamente el cristianismo no puede evitar oírla como si se tratase de uno de los evangelios”
-    &lt;/blockquote&gt;
-  &lt;/section&gt;
-&lt;/section&gt;</pre>
-
-<p>Este ejemplo resulta en el siguiente esquema:</p>
-
-<pre>1. Bach
-   1.1 Introducción
-   1.2 La Pasión según s. Mateo</pre>
-
-<p>Este esquema no contiene el esquema interno del elemento {{HTMLElement("blockquote")}} que, debido a la propia naturaleza del elemento, se desacopla. Observa bien que el elemento  {{HTMLElement("blockquote")}} , a pesar de todo, contiene un esquema propio bien estructurado.</p>
-
-<h3 id="Secciones_fuera_del_esquema">Secciones fuera del esquema</h3>
-
-<p>HTML5 introduce cuatro nuevos elementos que permiten definir secciones que no pertenecen al esquema principal de un documento web:</p>
-
-<ol>
- <li>El elemento sección lateral HTML ({{HTMLElement("aside")}}) define una sección que, aunque relacionada al elemento principal, no pertenece al flujo principal,  como una caja de explicación o un anuncio. Tiene su propio esquema, pero no pertenece al esquema principal.</li>
- <li>El elemento sección de navegación ({{HTMLElement("nav")}}) define una sección que contiene enlaces de navegación. Pueden ser muchas en un documento, por ejemplo, uno con enlaces internos a la página, como una tabla de contenidos, y otro con enlaces navegacionales. Estos enlaces no son parte del flujo principal y esquema y pueden ser inicialmente no generadas por lectores de pantalla y tecnología de apoyo similar.</li>
- <li>El elemento de sección de cabecera ({{HTMLElement("header")}}) define una cabecera de página, típicamente conteniendo el logo y nombre del sitio y posiblemente un menú horizontal. A pesar de su nombre, no está posicionado necesariamente al principio de la página.</li>
- <li>El elemento HTML de pie de página ({{HTMLElement("footer")}}) define un pie de página, típicamente conteniendo el derecho de autor y notas legales y a veces algunos enlaces. A pesar de su nombre, no es necesario que esté posicionado al final de la página.</li>
-</ol>
-
-<h2 id="Direcciones_y_tiempo_de_publicación_en_elementos_de_seccionado">Direcciones y tiempo de publicación en elementos de seccionado</h2>
-
-<p>El autor de un documento a veces quiere publicar alguna información de contacto, como el nombre del autor y su dirección. HTML4 permite eso vía el elemento {{HTMLElement("address")}}, que ha sido extendido en HTML5.</p>
-
-<p>Un documento puede ser hecho de diferentes secciones de diferentes autores. Una sección de otro autor diferente al autor de la página principal es definido usando el elemento {{HTMLElement("article")}}. Consecuentemente, el elemento {{HTMLElement("address")}} está ahora enlazado al ancestro más cercano, {{HTMLElement("body")}} o {{HTMLElement("article")}}.</p>
-
-<p>De manera similar, el elemento HTML5 {{HTMLElement("time")}}, con su atributo booleano establecido {{htmlattrxref("pubdate", "time")}}, representa la fecha de publicación asociada a todo el documento, respectivamente al artículo, relacionado a su ancestro más cercano {{HTMLElement("body")}} o {{HTMLElement("article")}}.</p>
-
-<h2 id="Usando_elementos_HTML5_en_navegadores_no_HTML5">Usando elementos HTML5 en navegadores no HTML5</h2>
-
-<p>Los elementos de sección y cabecera deben funcionar en la mayoría de navegadores no HTML5. Aunque no estén soportados, no necesitan una interfaz DOM especial y sólo necesitan la aplicación de CSS específico como a los elementos no conocidos se les aplica estilos como <code>display:inline</code> por defecto:</p>
-
-<pre class="brush: css">section, article, aside, footer, header, nav, hgroup {
-  display:block;
-}
-</pre>
-
-<p>Obviamente el desarrollador web puede aplicar estilos sobre ellos de forma diferente, pero mantener en mente que en un navegador no HTML5 la aplicación de estilos por defecto es diferente para lo que es esperado para esos elementos. También se debe notar que el elemento {{HTMLElement("time")}} no ha sido incluido, debido a que la aplicación de estilos por defecto de él en un navegador no HTML5 es el mismo que el estilo en un navegador compatible con HTML5.<br>
- <br>
- Este método tiene sin embargo sus limitaciones, así como algunos navegadores no permiten la aplicación de estilos en elementos no soportados. Este es el caso de Internet Explorer (version 8 e inferior), que necesita un script específico para permitirlo:</p>
-
-<pre class="brush:xml">&lt;!--[if lt IE 9]&gt;
-  &lt;script&gt;
-    document.createElement("header" );
-    document.createElement("footer" );
-    document.createElement("section");
-    document.createElement("aside"  );
-    document.createElement("nav"    );
-    document.createElement("article");
-    document.createElement("hgroup" );
-    document.createElement("time"   );
-  &lt;/script&gt;
-&lt;![endif]--&gt;</pre>
-
-<p>Esta sección significa que, en el caso de Internet Explorer (8 e inferior), el scripting debe estar habilitado para mostrar seccionamiento en HTML5 y elementos de cabecera apropiadamente. Si no, estas no serán mostradas, lo que puede ser problemático dado que estos elementos probablemente definen la estructura de toda la página. Esto es el porqué de un elemento {{HTMLElement("noscript")}} explícito debe ser añadido para este caso.</p>
-
-<pre class="brush:xml">&lt;noscript&gt;
-   &lt;strong&gt;Warning !&lt;/strong&gt;
-   Because your browser does not support HTML5, some elements are simulated using JScript.
-   Unfortunately your browser has disabled scripting. Please enable it in order to display this page.
-&lt;/noscript&gt;</pre>
-
-<p>Esto nos lleva al siguiente código para permitir el soporte de las secciones y elementos de cabecera en navegadores no HTML5, incluso para Internet Explorer (8 e inferiores), con una apropiada compatibilidad hacia atrás donde este último navegador es configurado para no usar scripting:</p>
-
-<pre class="brush:xml">&lt;!--[if lt IE 9]&gt;
-  &lt;script&gt;
-    document.createElement("header" );
-    document.createElement("footer" );
-    document.createElement("section");
-    document.createElement("aside"  );
-    document.createElement("nav"    );
-    document.createElement("article");
-    document.createElement("hgroup" );
-    document.createElement("time"   );
-  &lt;/script&gt;
-  &lt;noscript&gt;
-     &lt;strong&gt;Warning !&lt;/strong&gt;
-     Because your browser does not support HTML5, some elements are simulated using JScript.
-     Unfortunately your browser has disabled scripting. Please enable it in order to display this page.
-  &lt;/noscript&gt;
-&lt;![endif]--&gt;</pre>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>Los nuevos elementos semánticos introducidos en HTML5 suponen la posibilidad de describir la estructura y el esquema de un documento web de una manera estándar. Representan una gran ventaja para las personas que utilizan navegadores HTML5 y necesitan la estructura para ayudarles a utilizar la página, por ejemplo las personas que necesitan la ayuda de una tecnología de apoyo. Estos nuevos elementos semánticos son fáciles de usar y con muy poco esfuerzo pueden funcionar también en navegadores no HTML5. Por lo tanto deben ser usados sin restricciones.</p>
-
-<div>{{HTML5ArticleTOC()}}</div>
diff --git a/files/es/seguridad_en_firefox_2/index.html b/files/es/seguridad_en_firefox_2/index.html
deleted file mode 100644
index 43b55fff7c..0000000000
--- a/files/es/seguridad_en_firefox_2/index.html
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Seguridad en Firefox 2
-slug: Seguridad_en_Firefox_2
-tags:
-  - Seguridad
-  - Todas_las_Categorías
-translation_of: Mozilla/Firefox/Releases/2/Security_changes
----
-<div>{{FirefoxSidebar}}</div><p><a href="es/Firefox_2">Firefox 2</a> tiene tanto SSLv2 como la débil "exportación" de juegos de claves desactivados por defecto, en favor de SSLv3. Esto proporciona mejoras en la seguridad.</p>
-
-<p>Los métodos preferidos de encriptación son <code>TLS_DHE_DSS_WITH_3DES_EDE_CBC_SHA</code> y <code>TLS_RSA_WITH_3DES_EDE_CBC_SHA</code>. Algunos sevidores se refieren a ellos como <code>SSL_DHE_DSS_WITH_3DES_EDE_CBC_SHA</code> y <code>SSL_RSA_WITH_3DES_EDE_CBC_SHA</code>.</p>
-
-<p>Si el soporte SSLv2 tuviera que ser activado, puede hacerse cambiando en las preferencias de usuario el valor <code>security.ssl2.*</code> deseado a <code>true</code>.</p>
diff --git a/files/es/selección_de_modo_en_mozilla/index.html b/files/es/selección_de_modo_en_mozilla/index.html
deleted file mode 100644
index 2dae7b7909..0000000000
--- a/files/es/selección_de_modo_en_mozilla/index.html
+++ /dev/null
@@ -1,143 +0,0 @@
----
-title: Selección de modo en Mozilla
-slug: Selección_de_modo_en_Mozilla
-tags:
-  - Desarrollo_Web
-  - HTML
-  - Todas_las_Categorías
-  - XHTML
-  - XML
----
-<p> </p>
-<p>Este documento describe cómo Mozilla utiliza el declaración de DOCTYPE para determinar si utilizar el modo estricto o el. El código que toma la decisión está actualmente en <a href="https://dxr.mozilla.org/mozilla-central/source/parser/htmlparser/src/nsParser.cpp#1021" rel="custom">DetermineParseMode() in nsParser.cpp</a>. Vea los <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1312" title='FIXED: "Standard" compatibility mode needs to be hooked to DOCTYPE'>error 1312</a> y <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=55264" title="FIXED: [DOCTYPE] Documents with unknown DOCTYPE should be displayed in strict mode">error 55264</a> para saber más sobre la historia de la selección del modo. Vea el <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=153032" title="FIXED: Implement almost-standards rendering mode">error 153032</a> sobre la creación del modo Casi-Estándar en Mozilla 1.0.</p>
-<p>Las metas que indujeron a elegir este comportamiento fueron las siguientes::</p>
-<ul>
- <li>Casi todas las páginas existentes de <code>text/html</code> en la web que necesiten estar en el modo quirks para visualizarse correctamente deben exhibirse usando el modo quirks. (<em>Almost</em> all, rather than all, to allow for the following points as well.)</li>
- <li>Los autores que escriben páginas web según los estándares actuales deben poder activar el modo estricto.</li>
- <li>Cualquier página escrita usando un identificador público en las declaraciones de DOCTYPE que aparezcan en el futuro deberán exhibirse usando el modo estricto.</li>
-</ul>
-<p>En otras palabras, el algoritmo es la mejor aproximación que podemos encontrar para determinarse qué páginas fueron escritas después de que Mozilla se convirtiese en un 'agente de usuario' importante en la Web.</p>
-<h2 id="Modo_Est.C3.A1ndar_Completo" name="Modo_Est.C3.A1ndar_Completo">Modo Estándar Completo</h2>
-<p>Lo siguiente activa el modo estándar completo:</p>
-<ul>
- <li>Cualquier documento enviado con un tipo MIME de XML como son: <code>text/xml</code>, <code>application/xml</code>, o <code>application/xhtml+xml</code> (la selección del modo solo se aplica a documentos enviados como text/html).</li>
- <li>Cualquier <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+SYSTEM+%22http%3A%2F%2Fwww.w3.org%2FTR%2FREC-html40%2Fstrict.dtd%22%3E">"DOCTYPE HTML SYSTEM"</a> sin un "DOCTYPE HTML PUBLIC", excepto para el doctype de IBM indicado mas abajo.</li>
- <li>Una declaración de DOCTYPE sin DTD, i.e., <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML%3E">&lt;!DOCTYPE HTML&gt;</a>.</li>
- <li>Una declaración de DOCTYPE con un <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+%5B+%3C%21ELEMENT+TEST+-+-+%28P%29+%3E+%5D%3E+">subconjunto interno</a>.</li>
- <li>Un doctype desconocido, incluyendo los siguentes doctypes (tecnicamente conocidos):
-  <ul>
-   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.01//EN"</a>.</li>
-   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.0//EN"</a>.</li>
-   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+XHTML+1.0+Strict%2F%2FEN%22%3E">"-//W3C//DTD XHTML 1.0 Strict//EN"</a>.</li>
-   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22ISO%2FIEC+15445:2000%2F%2FDTD+HyperText+Markup+Language%2F%2FEN%22%3E">"ISO/IEC 15445:2000//DTD HyperText Markup Language//EN"</a>.</li>
-   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22ISO%2FIEC+15445:2000%2F%2FDTD+HTML%2F%2FEN%22%3E">"ISO/IEC 15445:2000//DTD HTML//EN"</a>.</li>
-   <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+i18n%2F%2FEN%22%3E">"-//IETF//DTD HTML i18n//EN"</a>.</li>
-  </ul>
- </li>
-</ul>
-<h2 id="Modo_casi_est.C3.A1ndar" name="Modo_casi_est.C3.A1ndar">Modo casi estándar</h2>
-<p>Lo siguiente activa el modo casi estándar. el fue creado entre (1.0 y 1.1alpha) y (1.0.1 y 1.1beta). Antes de su creación estos DOCTYPE activaban el modo estándar completo.</p>
-<ul>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+XHTML+1.0+Transitional%2F%2FEN%22%3E">"-//W3C//DTD XHTML 1.0 Transitional//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+XHTML+1.0+Frameset%2F%2FEN%22%3E">"-//W3C//DTD XHTML 1.0 Frameset//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Transitional%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml4%2Floose.dtd%22%3E">"-//W3C//DTD HTML 4.01 Transitional//EN"</a>, con identificador de sistema.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Frameset%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2Fhtml4%2Fframeset.dtd%22%3E">"-//W3C//DTD HTML 4.01 Frameset//EN"</a>, con identificador de sistema.</li>
-</ul>
-<h2 id="Modo_Quirks" name="Modo_Quirks">Modo Quirks</h2>
-<p>Lo siguiente activa el modo quirks (esta lista necesita ser completa para garantizar que todas las páginas ya existentes en la www pueden activar el modo quirks):</p>
-<p>En la elaboración de esta lista han sido utilizados los siguientes sitios: <a class="external" href="http://validator.w3.org/sgml-lib/catalog">W3C HTML Validator</a>, <a class="external" href="http://www.htmlhelp.com/tools/validator/lib/catalog">HTMLHelp HTML Validator</a>.</p>
-<ul>
- <li>la <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=">ausencia de DOCTYPE</a>.</li>
- <li>Una <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%3Fxml+version%3D%221.0%22%3F%3E">declaración XML (pseudo-PI) sin doctype</a> (osea, ignora la declaración XML y usa el DOCTYPE). En 1.0 y 1.1alpha o superior (Pero no en 1.0.1 o 1.1beta), la presencia de una declaración XML activa el modo estándar completo.</li>
- <li>Una declaración de DOCTYPE que <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+NOT+UNDERSTOOD%3E">no puede ser entendida</a> (Ejemplo: comillas desparejadas).</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+html+SYSTEM+%22http%3A%2F%2Fwww.ibm.com%2Fdata%2Fdtd%2Fv11%2Fibmxhtml1-transitional.dtd%22%3E">"http://www.ibm.com/data/dtd/v11/ibmxhtml1-transitional.dtd"</a> (Antes de 1.5b y 1.4.2, esto activaba el Modo casi estándar).</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Transitional%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.01 Transitional//EN"</a>, sin identificador de sistema.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.01+Frameset%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.01 Frameset//EN"</a>, sin identificador de sistema.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Transitional%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.0 Transitional//EN"</a> (vea también <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Transitional%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2FREC-html40%2Floose.dtd%22%3E">test with a system identifier</a>).</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Frameset%2F%2FEN%22%3E">"-//W3C//DTD HTML 4.0 Frameset//EN"</a> (vea también <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+4.0+Frameset%2F%2FEN%22+%22http%3A%2F%2Fwww.w3.org%2FTR%2FREC-html40%2Fframeset.dtd%22%3E">test with a system identifier</a>).</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSoftQuad+Software%2F%2FDTD+HoTMetaL+PRO+6.0::19990601::extensions+to+HTML+4.0%2F%2FEN%22%3E">"-//SoftQuad Software//DTD HoTMetaL PRO 6.0::19990601::extensions to HTML 4.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSoftQuad%2F%2FDTD+HoTMetaL+PRO+4.0::19971010::extensions+to+HTML+4.0%2F%2FEN%22%3E">"-//SoftQuad//DTD HoTMetaL PRO 4.0::19971010::extensions to HTML 4.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML//EN//3.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3O%2F%2FDTD+W3+HTML+3.0%2F%2FEN%2F%2F%22%3E">"-//W3O//DTD W3 HTML 3.0//EN//"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3O%2F%2FDTD+W3+HTML+3.0%2F%2FEN%22%3E">"-//W3O//DTD W3 HTML 3.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3+1995-03-24%2F%2FEN%22%3E">"-//W3C//DTD HTML 3 1995-03-24//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3.0%2F%2FEN%22%3E">"-//IETF//DTD HTML 3.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3.0%2F%2FEN%2F%2F%22%3E">"-//IETF//DTD HTML 3.0//EN//"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3%2F%2FEN%22%3E">"-//IETF//DTD HTML 3//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+3%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 3//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+3%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML Level 3//EN//3.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+3.2%2F%2FEN%22%3E">"-//IETF//DTD HTML 3.2//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FAdvaSoft+Ltd%2F%2FDTD+HTML+3.0+asWedit+%2B+extensions%2F%2FEN%22%3E">"-//AS//DTD HTML 3.0 asWedit + extensions//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FAdvaSoft+Ltd%2F%2FDTD+HTML+3.0+asWedit+%2B+extensions%2F%2FEN%22%3E">"-//AdvaSoft Ltd//DTD HTML 3.0 asWedit + extensions//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML Strict//EN//3.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3O%2F%2FDTD+W3+HTML+Strict+3.0%2F%2FEN%2F%2F%22%3E">"-//W3O//DTD W3 HTML Strict 3.0//EN//"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+3%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 3//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+3%2F%2FEN%2F%2F3.0%22%3E">"-//IETF//DTD HTML Strict Level 3//EN//3.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22HTML%22%3E">"HTML"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML%2F%2FEN%22%3E">"-//IETF//DTD HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 2//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+2%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Level 2//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Level 2//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 1//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+1%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Level 1//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Level 1//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+0%2F%2FEN%22%3E">"-//IETF//DTD HTML Level 0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Level+0%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Level 0//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 2//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+2%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict Level 2//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Strict%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Strict//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Strict+Level+2%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Strict Level 2//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 1//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+1%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict Level 1//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.0+Strict+Level+1%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.0 Strict Level 1//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+0%2F%2FEN%22%3E">"-//IETF//DTD HTML Strict Level 0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+Strict+Level+0%2F%2FEN%2F%2F2.0%22%3E">"-//IETF//DTD HTML Strict Level 0//EN//2.0"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FWebTechs%2F%2FDTD+Mozilla+HTML%2F%2FEN%22%3E">"-//WebTechs//DTD Mozilla HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FWebTechs%2F%2FDTD+Mozilla+HTML+2.0%2F%2FEN%22%3E">"-//WebTechs//DTD Mozilla HTML 2.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FNetscape+Comm.+Corp.%2F%2FDTD+HTML%2F%2FEN%22%3E">"-//Netscape Comm. Corp.//DTD HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FNetscape+Comm.+Corp.%2F%2FDTD+HTML%2F%2FEN%22%3E">"-//Netscape Comm. Corp.//DTD HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FNetscape+Comm.+Corp.%2F%2FDTD+Strict+HTML%2F%2FEN%22%3E">"-//Netscape Comm. Corp.//DTD Strict HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+2.0+HTML%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 2.0 HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+2.0+HTML+Strict%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 2.0 HTML Strict//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+2.0+Tables%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 2.0 Tables//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+3.0+HTML%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 3.0 HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+3.0+HTML+Strict%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 3.0 HTML Strict//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FMicrosoft%2F%2FDTD+Internet+Explorer+3.0+Tables%2F%2FEN%22%3E">"-//Microsoft//DTD Internet Explorer 3.0 Tables//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSun+Microsystems+Corp.%2F%2FDTD+HotJava+HTML%2F%2FEN%22%3E">"-//Sun Microsystems Corp.//DTD HotJava HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSun+Microsystems+Corp.%2F%2FDTD+HotJava+Strict+HTML%2F%2FEN%22%3E">"-//Sun Microsystems Corp.//DTD HotJava Strict HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FIETF%2F%2FDTD+HTML+2.1E%2F%2FEN%22%3E">"-//IETF//DTD HTML 2.1E//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FO%27Reilly+and+Associates%2F%2FDTD+HTML+Extended+1.0%2F%2FEN%22%3E">"-//O'Reilly and Associates//DTD HTML Extended 1.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FO%27Reilly+and+Associates%2F%2FDTD+HTML+Extended+Relaxed+1.0%2F%2FEN%22%3E">"-//O'Reilly and Associates//DTD HTML Extended Relaxed 1.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FO%27Reilly+and+Associates%2F%2FDTD+HTML+2.0%2F%2FEN%22%3E">"-//O'Reilly and Associates//DTD HTML 2.0//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSQ%2F%2FDTD+HTML+2.0+HoTMetaL+%2B+extensions%2F%2FEN%22%3E">"-//SQ//DTD HTML 2.0 HoTMetaL + extensions//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FSpyglass%2F%2FDTD+HTML+2.0+Extended%2F%2FEN%22%3E">"-//Spyglass//DTD HTML 2.0 Extended//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22%2B%2F%2FSilmaril%2F%2FDTD+HTML+Pro+v0r11+19970101%2F%2FEN%22%3E">"+//Silmaril//DTD HTML Pro v0r11 19970101//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+Experimental+19960712%2F%2FEN%22%3E">"-//W3C//DTD HTML Experimental 19960712//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2+Final%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2 Final//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2+Draft%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2 Draft//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+Experimental+970421%2F%2FEN%22%3E">"-//W3C//DTD HTML Experimental 970421//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+HTML+3.2S+Draft%2F%2FEN%22%3E">"-//W3C//DTD HTML 3.2S Draft//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?doctype=%3C%21DOCTYPE+HTML+PUBLIC+%22-%2F%2FW3C%2F%2FDTD+W3+HTML%2F%2FEN%22%3E">"-//W3C//DTD W3 HTML//EN"</a>.</li>
- <li>El identificador público <a class="external" href="http://dbaron.org/mozilla/tests/compat?pubid=-%2F%2FMetrius%2F%2FDTD+Metrius+Presentational%2F%2FEN">"-//Metrius//DTD Metrius Presentational//EN"</a>.</li>
-</ul>
-<p>Tenga en cuenta que todas las comparaciones de los identificadores públicos son insensibles a mayúsculas o minúsculas (técnicamente esto es incorrecto, puesto que las cadenas sí son sensibles). Esto se hace así por el gran número de páginas con identificadores públicos en los que se usan mal.</p>
-<h2 id="Ver_m.C3.A1s" name="Ver_m.C3.A1s">Ver más</h2>
-<ul>
- <li><a href="/es/Desarrollo_Web" title="es/Desarrollo_Web">Desarrollo Web</a></li>
- <li><a href="/es/Modo_Quirks_en_Mozilla" title="es/Modo_Quirks_en_Mozilla">Modo Quirks en Mozilla</a></li>
- <li><a href="/en/Mozilla_Quirks_Mode_Behavior">Mozilla Quirks Mode Behavior (en)</a></li>
-</ul>
-<div class="originaldocinfo">
- <h2 id="Informaci.C3.B3n_sobre_el_Documento_Original" name="Informaci.C3.B3n_sobre_el_Documento_Original">Información sobre el Documento Original</h2>
- <ul>
-  <li>Author(s): <a class="external" href="http://dbaron.org/">David Baron</a></li>
-  <li>Last Updated Date: August 2, 2005</li>
-  <li>Copyright Information: Copyright (C) <a class="external" href="http://dbaron.org/">David Baron</a></li>
- </ul>
-</div>
-<p> </p>
diff --git a/files/es/server-sent_events/index.html b/files/es/server-sent_events/index.html
deleted file mode 100644
index 9b22801732..0000000000
--- a/files/es/server-sent_events/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: Server-sent events
-slug: Server-sent_events
-tags:
-  - NeedsTranslation
-  - Server-sent events
-  - TopicStub
-translation_of: Web/API/Server-sent_events
----
-<p>Traditionally, a web page has to send a request to the server to receive new data; that is, the page requests data from the server. With server-sent events, it's possible for a server to send new data to a web page at any time, by pushing messages to the web page. These incoming messages can be treated as <em><a href="/en-US/docs/DOM/event" title="DOM/Event">Events</a> + data</em> inside the web page.</p>
-<table class="topicpage-table">
-  <tbody>
-    <tr>
-      <td>
-        <h2 class="Documentation" id="Documentation" name="Documentation">Documentation</h2>
-        <dl>
-          <dt>
-            <a href="/en-US/docs/Server-sent_events/Using_server-sent_events" title="Server-sent events/Using server-sent events">Using server-sent events</a></dt>
-          <dd>
-            A tutorial guide to writing both server and client side part of a server-sent events app.</dd>
-          <dt>
-            <a href="/en-US/docs/Server-sent_events/EventSource" title="Server-sent events/EventSource">EventSource reference</a></dt>
-          <dd>
-            A reference to the client-side EventSource API.</dd>
-        </dl>
-        <p><span class="alllinks"><a href="/en-US/docs/tag/Server-sent_events" title="tag/Server-sent events">View All...</a></span></p>
-      </td>
-      <td>
-        <h2 class="Tools" id="Tools" name="Tools">Tools</h2>
-        <ul>
-          <li>Remy Sharp’s <a class="link-https" href="https://github.com/remy/polyfills/blob/master/EventSource.js">EventSource polyfill</a></li>
-          <li>Yaffle’s <a class="link-https" href="https://github.com/Yaffle/EventSource" title="https://github.com/Yaffle/EventSource">EventSource polyfill</a></li>
-          <li>Rick Waldron’s <a class="link-https" href="https://github.com/rwldrn/jquery.eventsource">jquery plugin</a></li>
-        </ul>
-        <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Related Topics</h2>
-        <ul>
-          <li><a href="/en-US/docs/AJAX" title="AJAX">AJAX</a>, <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>, <a href="/en-US/docs/WebSockets" title="WebSockets">WebSockets</a></li>
-        </ul>
-      </td>
-    </tr>
-  </tbody>
-</table>
-<h2 id="See_also">See also</h2>
-<ul>
-  <li>A <a href="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/" title="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/">Twitter like application</a> powered by server-sent events and <a class="link-https" href="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends%20timeline" title="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends timeline">its code on Github</a>.</li>
-  <li><a href="http://dsheiko.com/weblog/html5-and-server-sent-events" title="http://dsheiko.com/weblog/html5-and-server-sent-events">HTML5 and Server-sent events</a></li>
-  <li><a href="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html" title="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html">Server-sent events using Asp.Net</a></li>
-</ul>
-<h2 id="Specification">Specification</h2>
-<ul>
-  <li><a href="http://dev.w3.org/html5/eventsource/" title="http://dev.w3.org/html5/eventsource/">Server-sent events</a></li>
-</ul>
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-<div>
-  {{CompatibilityTable}}</div>
-<div id="compat-desktop">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Feature</th>
-        <th>Chrome</th>
-        <th>Firefox (Gecko)</th>
-        <th>Internet Explorer</th>
-        <th>Opera</th>
-        <th>Safari</th>
-      </tr>
-      <tr>
-        <td>EventSource support</td>
-        <td>9</td>
-        <td>{{CompatGeckoDesktop("6.0")}}</td>
-        <td>{{CompatUnknown}}</td>
-        <td>11</td>
-        <td>5</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<div id="compat-mobile">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Feature</th>
-        <th>Android</th>
-        <th>Firefox Mobile (Gecko)</th>
-        <th>IE Mobile</th>
-        <th>Opera Mobile</th>
-        <th>Safari Mobile</th>
-      </tr>
-      <tr>
-        <td>EventSource support</td>
-        <td>{{CompatUnknown}}</td>
-        <td>{{CompatUnknown}}</td>
-        <td>{{CompatUnknown}}</td>
-        <td>{{CompatUnknown}}</td>
-        <td>{{CompatUnknown}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
diff --git a/files/es/server-sent_events/utilizando_server_sent_events_sse/index.html b/files/es/server-sent_events/utilizando_server_sent_events_sse/index.html
deleted file mode 100644
index 81a2f5dacc..0000000000
--- a/files/es/server-sent_events/utilizando_server_sent_events_sse/index.html
+++ /dev/null
@@ -1,231 +0,0 @@
----
-title: Utilizando eventos enviados por el servidor (server-sent event)
-slug: Server-sent_events/utilizando_server_sent_events_sse
-translation_of: Web/API/Server-sent_events/Using_server-sent_events
----
-<p>Desarrollar una aplicación web que utilice server-sent events es muy fácil. Solo necesitas un pequeño código del lado del servidor para transmitir los eventos a la aplicación web, pero del lado de la aplicacion web se trabaja prácticamente igual que con cualquier otro tipo de eventos.</p>
-
-<p>Puedes ver un ejemplo <a href="https://developer.mozilla.org/samples/sse/">aqui</a> (actualmente no funciona).</p>
-
-<p><a href="http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_sse">ejemplo2</a></p>
-
-<h2 id="Recibiendo_eventos_desde_el_servidor">Recibiendo eventos desde el servidor</h2>
-
-<p>El server-sent event API está contenido en la interfaz <a href="https://developer.mozilla.org/en/Server-sent_events/EventSource"><code>EventSource</code></a>; para abrir una conexión al servidor para recibir eventos de él. Se crea un nuevo objeto new <a href="https://developer.mozilla.org/en/Server-sent_events/EventSource">EventSource</a>, especificando el URI de un script que genera los eventos, Por ejemplo:</p>
-
-<pre class="brush: js">var evtSource = new EventSource("ssedemo.php");
-</pre>
-
-<div class="note"><strong>Nota</strong>: Aunque todavía no es parte de la norma, EventSource es soportado por Firefox 11 y posteriores. Se espera que pronto forme parte del estándar.</div>
-
-<p>Una vez que ha instanciado el origen del evento, puede comenzar a escuchar los mensajes:</p>
-
-<pre class="brush: js">evtSource.onmessage = function(e) {
-  var newElement = document.createElement("li");
-
-  newElement.innerHTML = "message: " + e.data;
-  eventList.appendChild(newElement);
-}
-</pre>
-
-<p>Este codigo escucha todos los mensajes entrantes (Es decir, todos los avisos del servidor, que no tienen un campo de eventos en ellos) y anexa texto del mensaje a la lista en el documento HTML.</p>
-
-<p>También puedes escuchar eventos, usando <code>addEventListener()</code>:</p>
-
-<pre class="brush: js">evtSource.addEventListener("ping", function(e) {
-  var newElement = document.createElement("li");
-
-  var obj = JSON.parse(e.data);
-  newElement.innerHTML = "ping at " + obj.time;
-  eventList.appendChild(newElement);
-}, false);
-</pre>
-
-<p>Este código es similar,  excepto que este se activa cada vez que el servidor envia un mensaje con el campo de evento "ping"; entonces se analiza el JSON en el campo de datos y retorna esa informacion.</p>
-
-<h2 id="Enviando_eventos_desde_el_servidor">Enviando eventos desde el servidor</h2>
-
-<p>El script del servidor que envia los datos tiene que responder con el tipo MIME text/event-stream. Cada notificación se envia con un bloque de texto terminado en un par de saltos de línea, para mas detalles sobre el formato sobre la secuencia de evetos, ver {{ anch("Event stream format") }},</p>
-
-<p>El codigo PHP para este ejemplo que estamos utilizando:</p>
-
-<pre class="brush: php">date_default_timezone_set("America/New_York");
-header("Content-Type: text/event-stream\n\n");
-
-$counter = rand(1, 10);
-while (1) {
-  // Every second, sent a "ping" event.
-
-  echo "event: ping\n";
-  $curDate = date(DATE_ISO8601);
-  echo 'data: {"time": "' . $curDate . '"}';
-  echo "\n\n";
-
-  // Send a simple message at random intervals.
-
-  $counter--;
-
-  if (!$counter) {
-    echo 'data: This is a message at time ' . $curDate . "\n\n";
-    $counter = rand(1, 10);
-  }
-
-  ob_flush();
-  flush();
-  sleep(1);
-}
-</pre>
-
-<p>Se genera un evento cada segundo, con el evento "ping". Los datos de cada evento es un objeto JSON que contiene, en este caso, solo la fecha en formato ISO 8601 correspondiente a la hora en que se generó el evento. A intervalos aleatorios, se envia un mensaje simple (sin ningún tipo de evento)</p>
-
-<h2 id="Gestion_de_errores">Gestion de errores</h2>
-
-<p>Cuando se producen problemas (como un tiempo de espera o problemas relacionados con el control de acceso), se genera un evento de error. Puedes tomar acción sobre esto al implementar una devolución de llamada al objeto EventSource:</p>
-
-<pre class="brush: js">evtSource.onerror = function(e) {
-  alert("EventSource failed.");
-};
-</pre>
-
-<p>En Firefox 22, no parece que haya manera de distinguir entre los diferentes de eventos de error.</p>
-
-<h2 id="Cerrando_flujo_de_eventos" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">Cerrando flujo de eventos</h2>
-
-<p>Por defecto, si la conexión entre el cliente y el servidor se cierra, la conexión es reiniciada. Podemos terminar la conexión con el método <code>.close()</code></p>
-
-<pre class="language-html" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal; color: rgb(77, 78, 83);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;">evtSource.close();</code></pre>
-
-<div> </div>
-
-<h2 id="Formato_de_flujo_de_eventos_(formato_stream)">Formato de flujo de eventos (formato stream)</h2>
-
-<p>El flujo de eventos es una corriente sencilla de datos de texto, que deben ser codificados usando UTF-8. Los mensajes en el flujo de eventos están separados por un par de caracteres de salto de línea. Si hay un símbolo de dos puntos como primer caracter de una línea, se entiende que es un comentario y es ignorado. </p>
-
-<div class="note"><strong>Nota:</strong> La línea de comentario se puede usar para prevenir que la conexión se agote por tiempo (timeout); un sevidor puede enviar periódicamente un comentario para mantener viva la conexión.</div>
-
-<p>Cada mensaje consiste en una o más líneas de texto que enumeran los campos para ese mensaje. Cada campo está representado por el nombre del campo, seguido por los datos de texto para el valor de ese campo.</p>
-
-<h3 id="Campos">Campos</h3>
-
-<p>Los siguientes nombres de campo son definidos por la especificación:</p>
-
-<h4 id="event">event</h4>
-
-<p style="margin-left: 40px;">El tipo de evento. Si se especifica, un evento se enviará al navegador a la escucha para el nombre del evento especificado, el sitio web usaria <code>addEventLister()</code> para escuchar eventos nombrados. El controlador <code>onmessage</code> se llama si no se especifica el nombre del evento para un mensaje.</p>
-
-<h4 id="data">data</h4>
-
-<p style="margin-left: 40px;">El campo de datos  para el mensaje. Cuando el EventSource recibe múltiples lineas con "<code>data:</code>", se concatenara, insertando un caracter de nueva de linea entre cada uno. Se eliminan los saltos de línea al final <strong>[VERIFICAR].</strong></p>
-
-<h4 id="id"><strong>id</strong></h4>
-
-<p style="margin-left: 40px;">  El ID del evento que establecerá el último ID del objeto EventSource.</p>
-
-<h4 id="Retry"><strong>Retry</strong></h4>
-
-<p style="margin-left: 40px;">El tiempo de reconexión para usar al intentar enviar el evento. [Qué código maneja esto?] Este debe ser un número entero, que especifica el tiempo de reconexion en milisegundos. Si se especifica un valor no entero, el campo se ignora.  </p>
-
-<p>Se omiten todos los demas nombres de campo.</p>
-
-<div class="note"><strong>Nota:</strong> Si una línea no contiene dos puntos, la línea entera se tratara como un nombre de campo, con una cadena de valor vacio.</div>
-
-<h3 id="Ejemplos">Ejemplos</h3>
-
-<h4 id="Mensajes_con_datos_únicamente">Mensajes con datos únicamente</h4>
-
-<p>En el siguiente ejemplo, hay tres mensajes enviados. El primero es solo un comentario, debido a que empieza con dos puntos. Como se mencionó anteriormente, esto puede ser útil para mantener la conexión viva si los mensajes no son enviados regularmente.</p>
-
-<p>The second message contains a data field with the value "some text". The third message contains a data field with the value "another message\nwith two lines". Note the newline in the value.</p>
-
-<p>El segundo mensaje contiene un campo de datos con el valor "some text". El tercer mensaje contiene un campo de datos con el valor "another message\nwith two lines". Nota la nueva línea en el valor.</p>
-
-<pre>: this is a test stream
-
-data: some text
-
-data: another message
-data: with two lines
-</pre>
-
-<h4 id="Eventos_nombrados">Eventos nombrados</h4>
-
-<p>Este ejemplo envia algunos eventos nombrados. Cada uno tiene un nombre de evento especificado por el campo <code>event</code>, y un campo <code>data</code> cuyo valor es una cadena JSON apropiada con los datos necesarios para que el cliente actue sobre el evento. El campo <code>data</code>, podria, por supuesto, tener cualquier cadena; no tiene que ser un JSON.</p>
-
-<pre>event: userconnect
-data: {"username": "bobby", "time": "02:33:48"}
-
-event: usermessage
-data: {"username": "bobby", "time": "02:34:11", "text": "Hi everyone."}
-
-event: userdisconnect
-data: {"username": "bobby", "time": "02:34:23"}
-
-event: usermessage
-data: {"username": "sean", "time": "02:34:36", "text": "Bye, bobby."}
-</pre>
-
-<h4 id="Mezclando_y_emparejando">Mezclando y emparejando</h4>
-
-<p>No tienes que usar solamente mensajes sin nombrar o eventos tipados; puedes mezclarlo juntos en un solo flujo de evento.</p>
-
-<pre>event: userconnect
-data: {"username": "bobby", "time": "02:33:48"}
-
-data: Here's a system message of some kind that will get used
-data: to accomplish some task.
-
-event: usermessage
-data: {"username": "bobby", "time": "02:34:11", "text": "Hi everyone."}
-</pre>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>EventSource support</td>
-   <td>9</td>
-   <td>{{ CompatGeckoDesktop("6.0") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>11</td>
-   <td>5</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android-and-Meego</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>EventSource support</td>
-   <td>6 a 24 b</td>
-   <td>1.0</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>11.1</td>
-   <td>4</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
diff --git a/files/es/storage/index.html b/files/es/storage/index.html
deleted file mode 100644
index 87e2df368e..0000000000
--- a/files/es/storage/index.html
+++ /dev/null
@@ -1,252 +0,0 @@
----
-title: Storage
-slug: Storage
-tags:
-  - Interfaces
-  - Storage
-  - Todas_las_Categorías
-  - Toolkit API
-  - páginas_a_traducir
----
-<br>
-<p>{{ Fx_minversion_header(2) }}</p>
-<p><strong>Storage</strong> es una API para la  base de datos <a class="external" href="http://www.sqlite.org/">SQLite</a>. Responde a las llamadas entidades de confianza, es decir, componentes internos de Firefox y extensiones. hace referencia completa a todos los métodos y propiedades de las conexiones de la interfaz de la  base de datos, lee <a href="/es/mozIStorageConnection" title="es/mozIStorageConnection">mozIStorageConnection</a>.</p>
-<p>El API está actualmente "unfrozen," lo que significa que está sujeto a cambios en cualquier momento. Es muy probable que el API cambie en la transición entre Firefox 2 y Firefox 3.</p>
-<p> </p>
-<div class="note"><strong>Nota:</strong> Storage no es lo mismo que la característica <a href="/es/DOM/Storage" title="es/DOM/Storage">DOM:Storage</a> que puede ser usada por páginas web para almacenar datos persistentes o la <a href="/es/Session_store_API" title="es/Session_store_API">Session store API</a> (una utilidad <a href="/es/XPCOM" title="es/XPCOM">XPCOM</a> de almacenaje para usar con las extensiones).</div>
-<p> </p>
-<h2 id="Empezando" name="Empezando">Empezando</h2>
-<p>Este documento cubre el API mozStorage y algunas peculiaridades de sqlite. <em>No</em> cubre SQL o el sqlite. Sin embargo, puedes encontrar varios enlaces útiles en la sección <a href="#Ver_tambi.C3.A9n"> Ver también</a>. Para obtener ayuda sobre el API mozStorage, puedes escribir a mozilla.dev.apps.firefox en el servidor de noticias news.mozilla.org. Para reportar errores, usa <a class="link-https" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Toolkit&amp;component=Storage">Bugzilla</a> (producto "Toolkit", componente "Storage").</p>
-<p>Bueno, aquí vamos. mozStorage fue diseñado igual que muchos otros sistemas de base de datos. El procedimiento general de su uso es:</p>
-<ul> <li>Abre una conexión con la base de datos de tu elección.</li> <li>Crea las sentencias a ejecutar en tu conexión.</li> <li>Agrega los parámetros de las sentencias si es necesario.</li> <li>Ejecuta las sentencias.</li> <li>Comprueba si hay errores.</li> <li>Comienza de nuevo con las sentencias.</li>
-</ul>
-<h2 id="Abrir_una_conexi.C3.B3n" name="Abrir_una_conexi.C3.B3n">Abrir una conexión</h2>
-<p>Para los usuarios de C++: La inicialización del servicio de storage debe hacerse desde el mismo hilo principal.Si lo inicializas por primera vez desde otro hilo, obtendrás un error. Por tanto, si quieres usar el servicio dentro de un hilo, asegúrate de llamar a getService desde el hilo principal para estar seguro de que el servicio ha sido creado.</p>
-<p>Ejemplo de apertura de una conexión a "asdf.sqlite" en el directorio del perfil del usuario, en C++:</p>
-<pre>nsCOMPtr&lt;nsIFile&gt; dbFile;
-rv = NS_GetSpecialDirectory(NS_APP_USER_PROFILE_50_DIR,
-                            getter_AddRefs(dbFile));
-NS_ENSURE_SUCCESS(rv, rv);
-rv = dbFile-&gt;Append(NS_LITERAL_STRING("asdf.sqlite"));
-NS_ENSURE_SUCCESS(rv, rv);
-
-mDBService = do_GetService(MOZ_STORAGE_SERVICE_CONTRACTID, &amp;rv);
-NS_ENSURE_SUCCESS(rv, rv);
-rv = mDBService-&gt;OpenDatabase(dbFile, getter_AddRefs(mDBConn));
-NS_ENSURE_SUCCESS(rv, rv);
-</pre>
-<p><code>MOZ_STORAGE_SERVICE_CONTRACTID</code> está definido en {{ Source("storage/build/mozStorageCID.h") }}. Su valor es <code>"@mozilla.org/storage/service;1"</code></p>
-<p>Ejemplo en JavaScript:</p>
-<pre>var file = Components.classes["@mozilla.org/file/directory_service;1"]
-                     .getService(Components.interfaces.nsIProperties)
-                     .get("ProfD", Components.interfaces.nsIFile);
-file.append("my_db_file_name.sqlite");
-
-var storageService = Components.classes["@mozilla.org/storage/service;1"]
-                        .getService(Components.interfaces.mozIStorageService);
-var mDBConn = storageService.openDatabase(file);
-</pre>
-<dl> <dd> <div class="note">Nota: La función OpenDatabase está sujeta a cambios. Seguramente será simplificada y ampliada para que sea más difícil meterse en problemas.</div> </dd>
-</dl>
-<p>Sería tentador nombrar a tu base de datos con un nombre terminado en ".sdb" por <strong>s</strong>qlite <strong>d</strong>ata<strong>b</strong>ase, pero esto <em>no es recomendable</em>. Esta extensión es tratada de forma especial por Windows como una extensión para "Application Compatibility Database" y sus cambios están respaldados por el sistema automáticamente como parte del sistema de recuperación del sistema. Esto puede dar lugar a un tratamiento desmesurado de las operaciones del archivo.</p>
-<h2 id="Sentencias" name="Sentencias">Sentencias</h2>
-<p>Sigue los pasos para crear y ejecutar sentencias SQL en tu base de datos SQLite. Para una completa referencia, lee <a href="/es/MozIStorageStatement" title="es/MozIStorageStatement">mozIStorageStatement</a>.</p>
-<h3 id="Creando_una_sentencia" name="Creando_una_sentencia">Creando una sentencia</h3>
-<p>Hay dos maneras de crear una sentencia. Si no tienes parámetros y la sentencia no devuelve ningún dato, usa <code>mozIStorageConnection.executeSimpleSQL</code>.</p>
-<pre>C++:
-rv = mDBConn-&gt;ExecuteSimpleSQL(NS_LITERAL_CSTRING("CREATE TABLE foo (a INTEGER)"));
-
-JS:
-mDBConn.executeSimpleSQL("CREATE TABLE foo (a INTEGER)");
-</pre>
-<p>De otra forma, deberías preparar la sentencia usando <code>mozIStorageConnection.createStatement</code>:</p>
-<pre>C++:
-nsCOMPtr&lt;mozIStorageStatement&gt; statement;
-rv = mDBConn-&gt;CreateStatement(NS_LITERAL_CSTRING("SELECT * FROM foo WHERE a = ?1"),
-                              getter_AddRefs(statement));
-NS_ENSURE_SUCCESS(rv, rv);
-
-JS:
-var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = ?1");
-</pre>
-<p>Este ejemplo usa el comodín "?1" para recoger un parámetro devuelto más adelante (lee la próxima sección).</p>
-<p>Una vez que has preparado la sentencia, puedes agrupar su parámetros, ejecutarla y re usarla una y otra vez. Si utilizas una sentencia repetidamente, el uso de sentencias pre compiladas te brindará una mejora notable en la ejecución, ya que las consultas SQL no necesitan ser analizadas cada vez.</p>
-<p>If you are familiar with sqlite, you may know that prepared statements are invalidated when the schema of the database changes. Fortunately, mozIStorageStatement detects the error and will recompile the statement as needed. Therefore, once you create a statement, you don't need to worry when changing the schema; all statements will continue to transparently work.</p>
-<h3 id="Agregar_los_par.C3.A1metros" name="Agregar_los_par.C3.A1metros">Agregar los parámetros</h3>
-<p>Generalmente es mucho mejor agregar los parámetros separadamente, en lugar de intentar construir una sentencia SQL en una cadena conteniendo los parámetros. Entre otras cosas, esto evita el ataque de inyección de SQL, ya que un parámetro suelto nunca podrá ser ejecutado como una sentencia SQL.</p>
-<p>Se agregan los parámetros a una sentencia SQL reemplazando los comodines. Los comodines son llamados por orden, empezando con el "?1", luego el "?2", etcétera. Usa la función BindXXXParameter(0) BindXXXParameter(1)... para cambiar esos comodines.</p>
-<dl> <dd> <div class="note">Presta atención: Los indices en los comodines van a partir de 1. Los indices de las funciones de cambio, empiezan en 0. Esto es: el "?1" corresponde al parámetro 0, "?1" corresponde al parámetro 1, etcétera.</div> </dd>
-</dl>
-<p>Tambien puedes usar parámetros con nombre como: ":ejemplo" en lugar de "?xx".</p>
-<p>Un comodín puede aparecer varias veces en una cadena SQL y todas las veces será reemplazado por el correspondiente valos. Los parámetros que no han sido agragados (unbound) serán interpretados como <code>NULL</code></p>
-<p>Los ejemplos a continuación, usan <code>bindUTF8StringParameter()</code> y <code>bindInt32Parameter()</code>. Para una lista de todas las demás funciones, lee <a href="/es/MozIStorageStatement#Binding_functions" title="es/MozIStorageStatement#Binding_functions">mozIStorageStatement</a>.</p>
-<p>Ejemplo en C++:</p>
-<pre>nsCOMPtr&lt;mozIStorageStatement&gt; statement;
-rv = mDBConn-&gt;CreateStatement(NS_LITERAL_CSTRING("SELECT * FROM foo WHERE a = ?1 AND b &gt; ?2"),
-                              getter_AddRefs(statement));
-NS_ENSURE_SUCCESS(rv, rv);
-rv = statement-&gt;BindUTF8StringParameter(0, "hello"); // "hello" será sustituido por "?1"
-NS_ENSURE_SUCCESS(rv, rv);
-rv = statement-&gt;BindInt32Parameter(1, 1234); // 1234 será sustituido por "?2"
-NS_ENSURE_SUCCESS(rv, rv);
-</pre>
-<p>Ejemplo en JavaScript:</p>
-<pre>var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = ?1 AND b &gt; ?2");
-statement.bindUTF8StringParameter(0, "hello");
-statement.bindInt32Parameter(1, 1234);
-</pre>
-<p>Si usas parámetros con nombre, deberías usar el método <code>getParameterIndex</code> para obtener el índice del parámetro con nombre. Aquí hay un ejemplo en JavaScript:</p>
-<pre>var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = :myfirstparam AND b &gt; :mysecondparam");
-
-var firstidx = statement.getParameterIndex(":myfirstparam");
-statement.bindUTF8StringParameter(firstidx, "hello");
-
-var secondidx = statement.getParameterIndex(":mysecondparam");
-statement.bindInt32Parameter(secondidx, 1234);
-</pre>
-<p>Por supuesto, puedes mezclar parámetros con nombre y con índice en la misma consulta:</p>
-<pre>var statement = mDBConn.createStatement("SELECT * FROM foo WHERE a = ?1 AND b &gt; :mysecondparam");
-
-statement.bindUTF8StringParameter(0, "hello");
-// you can also use
-// var firstidx = statement.getParameterIndex("?1");
-// statement.bindUTF8StringParameter(firstidx, "hello");
-
-var secondidx = statement.getParameterIndex(":mysecondparam");
-statement.bindInt32Parameter(secondidx, 1234);
-</pre>
-<p>Si quieres usar la clausula <code>WHERE</code> con una expresión <code>IN ( value-list )</code>, las sentencias de Bindings no funcionarán. En su lugar, construye una cadena. Si no estas usando unstradas del usuario, la seguridad no es una de tus preocupaciones:</p>
-<pre>var ids = "3,21,72,89";
-var sql = "DELETE FROM table WHERE id IN ( "+ ids +" )";
-</pre>
-<h3 id="Ejecutar_una_sentencia" name="Ejecutar_una_sentencia">Ejecutar una sentencia</h3>
-<p>La manera principal de ejecutar una sentencia es con <code>mozIStorageStatement.executeStep</code>. Esta función te permite enumerar todos los resultados (filas / registros) que produzca tu sentencia y te notificará cuando no hay más resultados.</p>
-<p>Después de una llamada a <code>executeStep</code>, debes usar la <strong>función de recogida apropiada</strong> en <a href="/es/MozIStorageValueArray" title="es/MozIStorageValueArray">mozIStorageValueArray</a> para recoger el valor en una fila (mozIStorageStatement implementa mozIStorageValueArray). El ejemplo de abajo sólo usa <code>getInt32()</code>.</p>
-<p>Puedes obtener el tipo de un valor desde <code>mozIStorageValueArray.getTypeOfIndex</code>, que devuelve el tipo de la columna especificada. Ten cuidado: sqlite no es una base de datos que maneje tipos. Si requieres un tipo diferente, sqlite hará lo mejor que pueda para convertirlo, y dará algún tipo por defecto si no lo consigue. Por tanto, es imposible obtener errores de tipo, pero puedes obtener datos extraños como valor devuelto.</p>
-<p>En código C++ se puede también usar las funciones <code>AsInt32</code>, <code>AsDouble</code>, etcétera. que devuelven el valor como un valor más manejable en C++. Ten precaución, sin embargo, ya que no tendrás errores si tu índice es invalido. Es imposible obtener otros errores, yq que sqlite siempre convertirá los tipos, aún si no tienen sentido.</p>
-<p>Ejemplo C++:</p>
-<pre>PRBool hasMoreData;
-while (NS_SUCCEEDED(statement-&gt;ExecuteStep(&amp;hasMoreData)) &amp;&amp; hasMoreData) {
-  PRInt32 value = statement-&gt;AsInt32(0);
-  // use the value...
-}
-</pre>
-<p>Ejemplo Javascript:</p>
-<pre>while (statement.executeStep()) {
-  var value = statement.getInt32(0); // ¡usa la función correcta!
-  // usa el valor...
-}
-</pre>
-<p>La función <code>mozIStorageStatement.execute()</code> es útil cuando no estás obteniendo datos de la sentencia. Lo que hace es ejecutar la sentencia una vez y luego volverla al estado inicial. Esto puede ser útil para las sentencias de inserción, ya que realmente limpia el código:</p>
-<pre>var statement = mDBConn.createStatement("INSERT INTO my_table VALUES (?1)");
-statement.bindInt32Parameter(52);
-statement.execute();
-</pre>
-<p>Este es un ejemplo simple pero completo en JavaScript y XUL, de cómo ejecutar sentencias SQL en una base de datos: <img alt="Image:TTRW2.zip">.</p>
-<h3 id="Re_crear_una_sentencia_.28reset.29" name="Re_crear_una_sentencia_.28reset.29">Re crear una sentencia (reset)</h3>
-<p>Es importante re crear sentencias que no han sido usadas nuevamente. Las sentencias no re creadas, dejarán un bloqueo en las tablas y evitarán que otras sentencias puedan acceder a los datos. Sentencias de lectura no re creadas evitarán que funcionen las sentencias de escritura.</p>
-<p>Cuando los objetos sentencias son liberados, su correspondiente sentencia en la base de datos es liberada. Si estás usando C++ y sabes que todas las referencias serán destruidas, no tienes que re crear explicitamente las sentencias. Además, si usas <code>mozIStorageStatement.execute()</code>, tampoco necesitas re crear explicitamente las sentencias, esta función lo hará por ti. En otro caso, llama a <code>mozIStorageStatement.reset()</code>.</p>
-<p>Los que usáis JavaScript, deberéis aseguraros de re crear las sentencias. Se particularmente escrupuloso con las excepciones. Querrás estar seguro de re crear las sentencias aún si ocurre una excepción, o los accesos subsiguientes pueden no ser posibles. Re crear una sentencia es relativamente poco pesado y no ocurre nada malo si ya ha sido re creada, así que no te preocupes por re creaciones innecesarias.</p>
-<pre>var statement = connection.createStatement(...);
-try {
-  // usa la sentencia...
-} finally {
-  statement.reset();
-}
-</pre>
-<p>Los que usáis C++ debéis hacer lo mismo. Existe un objeto en {{ Source("storage/public/mozStorageHelper.h") }} llamado mozStorageStatementScoper que se asegurará que una sentencia dada sea re creada cuando sales del ámbito. Es muy recomendable que uses este objeto si te es posible.</p>
-<pre>void someClass::someFunction()
-{
-  mozStorageStatementScoper scoper(mStatement)
-  // use the statement
-}
-</pre>
-<h2 id="id_de_la_.C3.BAltima_inserci.C3.B3n" name="id_de_la_.C3.BAltima_inserci.C3.B3n">id de la última inserción</h2>
-<p>Usa la propiedad <code>lastInsertRowID</code> en la conexión para obtener el id (id de la fila) de la última operación <code>INSERT</code> operation en la base de datos.<br>
-Esto es útil si tienes una columna en tu tabla que sea la clave primaria (como <code>INTEGER PRIMARY KEY</code> o <code>INTEGER PRIMARY KEY AUTOINCREMENT</code>) en cuyo caso SQLite asigna automáticamente un valor a cada fila insertada, si tu no proporcionas alguno. <a class="external" href="http://www.sqlite.org/capi3ref.html#sqlite3_last_insert_rowid"></a><a class="external" href="http://www.sqlite.org/faq.html#q1"></a> El valor devuelto es del tipo <code>number</code> en JS y <code>long long</code> en C++.</p>
-<p><code>lastInsertRowID</code> JS example:</p>
-<pre>var sql = "INSERT INTO contacts_table (number_col, name_col) VALUES (?1, ?2)"
-var statement = mDBConn.createStatement(sql);
-    statement.bindUTF8StringParameter(0, number);
-    statement.bindUTF8StringParameter(1, name);
-    statement.execute();
-    statement.reset();
-
-var rowid = mDBConn.lastInsertRowID;
-</pre>
-<h2 id="Transacciones" name="Transacciones">Transacciones</h2>
-<p>mozIStorageConnection tiene funciones para las transacciones de comienzo y final. Si no usas transacciones explicitamente, se creará una transacción implícita por ti para cada sentencia. Esto tiene una gran implicación en el rendimiento. Hay una sobrecarga en cada transacción, especialmente para las transacciones de confianza. Por tanto verás una apreciable ganancia en el rendimiento, cuando estés haciendo ejecutando varias sentencias en una fila, si las agrupas en una transacción. Ver <a href="/es/Storage/Performance" title="es/Storage/Performance">Storage:Performance</a> para más detalles.</p>
-<p>La mayor diferencia entre otros sitemas de base de datos y sqlite es que éste último no implementa transacciones anidadas. Esto significa que en el momento en que una transacción es abierta, no puedes abrir otra transacción. Puedes usar <code>mozIStorageConnection.transactionInProgress</code> para ver si la transacción está en progreso.</p>
-<p>También puedes simplemente ejecutar "BEGIN TRANSACTION" y "END TRANSACTION" directamente como sentencias SQL (esto es lo que hace la conexión cuando llamas a las funciones). Sin embargo, el uso de <code>mozIStorageConnection.beginTransaction</code> y las funciones relacionadas, está <em>fuertemente</em> recomendado, ya que guarda el estado de la transacción en la conexión. De otra forma, el atributo <code>transactionInProgress</code> tendrá el valor erróneo.</p>
-<p>sqlite tiene vario tipos de transacción:</p>
-<ul> <li>mozIStorageConnection.TRANSACTION_DEFERRED: Por defecto. El bloqueo de la base de datos es adquirido cuando es necesario (generalmente cuando ejecutas una sentencia, por primera vez, en una transacción).</li>
-</ul>
-<ul> <li>mozIStorageConnection.TRANSACTION_IMMEDIATE: Adquiere inmediatamente, un bloqueo de lectura en la base de datos.immediately.</li>
-</ul>
-<ul> <li>mozIStorageConnection.TRANSACTION_EXCLUSIVE: Adquiere inmediatamente, un bloqueo de escritura en la base de datos.immediately.</li>
-</ul>
-<p>Puedes pasar este tipo de transacción a <code>mozIStorageConnection.beginTransactionAs</code> para determinar que clase de transacción necesitas. Recuerda que si ya se ha iniciado otra transacción, esta operación no tendrá éxito. Generalmente, el tipo por defecto de TRANSACTION_DEFERRED es suficiente y no deberías usar otro tipo, a no ser, que realmente sepas porqué lo necesitas. Para más información, lee la documentación de sqlite: <a class="external" href="http://www.sqlite.org/lang_transaction.html">BEGIN TRANSACTION</a> y <a class="external" href="http://www.sqlite.org/lockingv3.html">locking</a>.</p>
-<pre>var ourTransaction = false;
-if (!mDBConn.transactionInProgress) {
-  ourTransaction = true;
-  mDBConn.beginTransactionAs(mDBConn.TRANSACTION_DEFERRED);
-}
-
-// ... usa la conexión ...
-
-if (ourTransaction)
-  mDBConn.commitTransaction();
-</pre>
-<p>A partir de código C++, puedes usar la clase mozStorageTransaction definida en {{ Source("storage/public/mozStorageHelper.h") }}. Esta clase iniciará una transacción del tipo especificado en la conexión especificada y, cuando salga del entorno, bien confiará o bien volverá la transacción a su estado inicial. Si ya hay una transacción en progreso, la clase de ayuda de la transacción no hará nada.</p>
-<p>También tiene funciones de confianza explicitas. El uso típico es que crees la clase que por defecto vuelva a su estado original (rollback) y luego realices la confianza de la transacción explicitamente cuando tenga éxito:</p>
-<pre>nsresult someFunction()
-{
-  // deferred transaction (the default) with rollback on failure
-  mozStorageTransaction transaction(mDBConn, PR_FALSE);
-
-  // ... use the connection ...
-
-  // everything succeeded, now explicitly commit
-  return transaction.Commit();
-}
-</pre>
-<h2 id="C.C3.B3mo_corromper_tu_base_de_datos" name="C.C3.B3mo_corromper_tu_base_de_datos">Cómo corromper tu base de datos</h2>
-<ul> <li>Lee este documento: <a class="external" href="http://www.sqlite.org/lockingv3.html">File locking and concurrency in sqlite version 3</a>, especialmente la sección sobre corrupción.</li>
-</ul>
-<ul> <li>Abre más de una conexión hacia el mismo archivo con nombres que no son exactaente los determinados por <code>strcmp</code>. Esto incluye "my.db" y "../dir/my.db" o, en Windows (sin diferencia Mayúsculas/minúsculas) "my.db" y "My.db". Sqlite intentará manejar muchos de estos casos, pero no debes porfiar en ello.</li>
-</ul>
-<ul> <li>Accede una base de datos desde un enlace simbólico.</li>
-</ul>
-<ul> <li>Abre conexiones a la misma base de datos desde más de un hilo (Ver Seguridad de los hilos" más abajo).</li>
-</ul>
-<ul> <li>Accede a una conexión o a una sentencia desde más de un hilo (Ver Seguridad de los hilos" más abajo).</li>
-</ul>
-<ul> <li>Abre la base de datos desde un programa externo mientras está abierto en Mozilla. Nuestro sistema de cache rompe la reglas normales de bloqueo de archivos en sqlite que permitirían hacer esto de forma segura.</li>
-</ul>
-<h2 id="Bloqueo_en_SQLite" name="Bloqueo_en_SQLite">Bloqueo en SQLite</h2>
-<p>SQLite bloquea la base de datos enteramente, esto es, cualquier intento de lectura causará un que intento de escritura devuelva SQLITE_BUSY, y una escritura activa causará que cualquier intento de lectura devuelva SQLITE_BUSY. Una sentencia es considerada activa a partir del primer step() hasta que se llame a reset(). execute() llama a step() y reset() a un tiempo. Un problema común es olvidar reset() una sentencia después de haber terminado con step().</p>
-<p>Mientras que una conexión SQLite dada es capaz de tener muchas sentencias abiertas, su modelo de bloqueo limita lo que estas sentencias pueden realmente hacer simultáneamente (leer o escribir). De hecho es posible que muchas sentencias estén leyendo al mismo tiempo, sin embargo, no es posible que varias sentencias estén leyendo y escribiendo a la vez <em>en la misma tabla</em> -- aún cuando deriven de la misma conexión.</p>
-<p>El modelo de bloque de SQLite se conoce como "two-tiered": nivel de conexión y nivel de tabla. La mayoría de las personas están familiarizadas con el nivel de conexión (base de datos): múltiples lecturas pero solo una escritura. El nivel de tabla (B-Tree) es lo que a veces puede resultar confuso. (Internamente, cada tabla en la base de datos tiene su propio B-Tree, de modo que tabla y "B-Tree" son técnicamente sinonimos).</p>
-<h3 id="Bloqueo_a_nivel_de_tabla" name="Bloqueo_a_nivel_de_tabla">Bloqueo a nivel de tabla</h3>
-<p>Podrías pensar que si tienes sólo una conexión, i esta bloquea la base da datos para escritura, podrías usar multiples sentencias para hacer lo que quieras. No exactamente. Debes tener en cuenta que los bloqueos a nivel de tabla (B-Tree) que están mantenidos por sentencias se mantienen a lo largo de la base de datos (por ejemplo, las sentencias de manejo SELECT).</p>
-<p>La regla general es esta: una sentencia de manejo puede <strong>not</strong> modificar una tabla (B-Tree) que otras sentencias de manejo están leyendo (tienen el cursor abierto sobre ellas) -- aún cuando la sentencia de manejo comparte la misma conexión (contenido de la transacción, bloqueo de la base de datos, etcétera) con las otras sentencias de manejo. <em>Intentar hacer eso, también bloqueará (o devolverá SQLITE_BUSY)</em>.</p>
-<p>Este problema a menudo aparece cuando intestas interactuar en una tabla usando una sentencia mientras modificas registros en la tabla con otra sentencia. Esto no funcionará (o entraña muchas posibilidades de no funcionar, dependiendo del optimizador (ver más abajo)). Las sentencias de modificación causarán un bloque ya que la sentencia de lectura tiene el cursor abierto sobre la tabla.</p>
-<h3 id="Trabajando_con_los_problemas_de_bloqueo" name="Trabajando_con_los_problemas_de_bloqueo">Trabajando con los problemas de bloqueo</h3>
-<p>La solución es seguir (1) como se dice más arriba. Teóricamente, (2) actualmente no debería funcionar con SQLite 3.x En este escenario, los bloqueos de base de datos entran en juego (con múltiples conexiones) adicionalmente a los bloqueos de tablas. La conexión 2 (conexiones de cambio) no serán capaces de modificar (escribir en) la base de datos mientras que la conexión 1 (conexión de lectura) esté leyendo. La conexión 2 requerirá un bloqueo exclusivo para ejecutar una sentencia de modificación SQL, que no podrá obtener mientras la conexión 1 tenga sentencias activas leyendo la base de datos (La conexión 1 tiene un bloqueo de lectura compartido durante este tiempo que prohíbe a cualquier otra conexión tener un bloqueo exclusivo).</p>
-<p>Otra opción es usar una tabla temporal. Crea una tabla temporal que contenga los resultados de la tabla de interés, interactúa con ella (poniendo los bloqueos de la tabla con las sentencias de lectura en la tabla temporal) y entonces las sentencias de modificación pueden hacer cambios en la tabla real sin ningún problema). Esto puede hacerse con sentencias derivadas de una conexión simple (contexto de la transacción). Esta escena ocurre algunas veces 'detrás del escenario' ya que ORDERED BY puede producir tablas temporales internamente. Sin embargo, no es seguro asumir que el optimizador hará esto en todos los casos. Crear tablas temporales explicitamente, es la única forma segura de realizar esta última opción.</p>
-<h2 id="Seguridad_de_los_hilos" name="Seguridad_de_los_hilos">Seguridad de los hilos</h2>
-<p>El servicio mozStorage y sqlite son hilos seguros. Sin embargo, ningún otro mozStorage u objeto sqlite son hilos seguros.</p>
-<ul> <li>El servicio storage debe ser creado en el hilo principal. Si quieres acceder al servicio desde otro hilo, debes asegurarte de llamar a getService desde el hilo principal con antelación.</li>
-</ul>
-<ul> <li>No puedes acceder a una conexión o una sentencia desde múltiples hilos. Esos objetos storage no son seguros y las representaciones sqlite tampoco son seguras. Aún cuando hagas bloqueo y te asegures que sólo ese hilo está haciendo algo, puede haber problemas. Este caso no ha sido probado y puede haber algún estado pre-implementación en el hilo de sqlite. Se recomienda fuertemente que no hagas esto.</li>
-</ul>
-<ul> <li>No puedes acceder una base de datos simple desde múltiples conexiones en múltiples hilos. Normalmente, sqlite permite esto. Sin embargo, hacemos <code>sqlite3_enable_shared_cache(1);</code> (ver <a class="external" href="http://www.sqlite.org/sharedcache.html">sqlite shared-cache mode</a>) que hace que múltiples conexiones compartan la misma memoria cache. Esto es importante para el rendimiento. Sin embargo, no hay bloqueos para el acceso a la memoria cache, lo que significa que se romperá si se usa desde más de un hilo.</li>
-</ul>
-<p>De nada vale, sin embargo, que los autores de las extensiones de JavaScript del navegador, esten menos impactados por estas restricciones de lo que estaban al principio. Si una base de datos es creada y usada de forma exclusiva desde JavaScript, la seguridad de los hilos no será, normalmente, una preocupación. El motor JavaScript interno de Firefox (SpiderMonkey) ejecuta el JavaScript dentro de un único y persistente hilo, excepto cuando JavaScript se ejecuta en un hilo diferente o es ejecutado a partir de una llamada realizada desde otro hilo (p.e. desde interfaces de stream o delde la red). Con excepción del uso incorrecto de JavaScript en múltiples hilos, los problemas solo deberían ocurrir si se accede aun hilo asociado a una base de datos previamente en uso a través de mozStorage.</p>
-<h2 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h2>
-<ul> <li><a href="/es/mozIStorageConnection" title="es/mozIStorageConnection">mozIStorageConnection</a> Conexión de la base de datos a un archivo específico o almacenamiento en memoria.</li> <li><a href="/es/MozIStorageStatement" title="es/MozIStorageStatement">mozIStorageStatement</a> Crea y ejecuta sentencias SQL en bases de datos SQLite.</li> <li><a href="/es/MozIStorageValueArray" title="es/MozIStorageValueArray">mozIStorageValueArray</a> Agrupa una matriz de valores SQL, como una fila resultante.</li> <li><a href="/es/MozIStorageFunction" title="es/MozIStorageFunction">mozIStorageFunction</a> Crea una nueva función SQLite.</li> <li><a href="/es/MozIStorageAggregateFunction" title="es/MozIStorageAggregateFunction">mozIStorageAggregateFunction</a> Crea una nueva función agregada SQLite.</li> <li><a href="/es/MozIStorageProgressHandler" title="es/MozIStorageProgressHandler">mozIStorageProgressHandler</a> Vigilar progresos durante la ejecución de una sentencia.</li> <li><a href="/es/MozIStorageStatementWrapper" title="es/MozIStorageStatementWrapper">mozIStorageStatementWrapper</a> Agrupador de la sentencia Storage.</li> <li><a href="/es/MozIStorageService" title="es/MozIStorageService">mozIStorageService</a> Servicio Storage.</li>
-</ul>
-<ul> <li><a href="/es/Storage/Performance" title="es/Storage/Performance">Storage:Rendimiento</a> Cómo hacer que tu conexión de base de datos rinda bien.</li> <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/3072">Storage Inspector Extension</a><span class="goog-zippy-collapsed" id="romanspan" style="display: none;"><img alt="" class="buttons square13 zippy-plus" id="romanimg" src="http://www.google.es/images/cleardot.gif"><span id="romantext">Mostrar forma romanizada</span><span class="short_text" id="result_box"><span title=""><br> </span></span></span> <span class="short_text" id="result_box"><span title="">Hace que sea fácil de ver los archivos de base de datos SQLite en el perfil actual.</span></span></li> <li><a class="external" href="http://www.sqlite.org/lang.html">SQLite Syntax</a> Query <span class="short_text" id="result_box"><span style="" title="">lengua que comprenda </span></span>SQLite</li> <li><a class="external" href="http://sqlitebrowser.sourceforge.net/">SQLite Database Browser</a><span class="medium_text" id="result_box"><span title="">es una herramienta capaz libre disponible para muchas plataformas. </span><span title="">Puede ser útil para examinar las bases de datos existentes y las pruebas sentencias SQL.</span></span> <span class="goog-zippy-collapsed" id="romanspan" style="display: none;"><img alt="" class="buttons square13 zippy-plus" id="romanimg" src="http://www.google.es/images/cleardot.gif"><span id="romantext">Mostrar forma romanizada</span></span></li> <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/5817">SQLite Manager Extension</a><span class="short_text" id="result_box"><span style="background-color: rgb(255, 255, 255);" title="">ayuda a administrar los archivos de base de datos SQLite en el equipo.</span></span> <span class="goog-zippy-collapsed" id="romanspan" style="display: none;"><img alt="" class="buttons square13 zippy-plus" id="romanimg" src="http://www.google.es/images/cleardot.gif"><span id="romantext">Mostrar forma romanizada</span></span> <div class="almost_half_cell" style=""> <div dir="ltr" style=""><span class="short_text" id="result_box"><span style="background-color: rgb(255, 255, 255);" title=""><br> </span></span></div> </div> </li>
-</ul>
-<p> </p>
-<p>{{ languages( { "es": "es/Almacenamiento", "fr": "fr/Storage", "ja": "ja/Storage", "pl": "pl/Storage", "en": "en/Storage" } ) }}</p>
diff --git a/files/es/svg_en_firefox/index.html b/files/es/svg_en_firefox/index.html
deleted file mode 100644
index ba802c6af4..0000000000
--- a/files/es/svg_en_firefox/index.html
+++ /dev/null
@@ -1,847 +0,0 @@
----
-title: SVG en Firefox
-slug: SVG_en_Firefox
-tags:
-  - NecesitaRevisiónTécnica
-  - SVG
-  - Todas_las_Categorías
-translation_of: Web/SVG/SVG_1.1_Support_in_Firefox
----
-<p> </p>
-<p><b>Firefox 2</b> sigue avanzando en la mejora de la implementación de <a class="external" href="http://www.w3.org/Graphics/SVG/">Gráficos vectoriales escalables (SVG)</a>. Aunque el único elemento añadido a los ya soportados por Firefox 1.5 ha sido <code>&lt;textPath&gt;</code>, se han resuelto varios fallos y se ha incorporado parte de la especificación.</p>
-<p><b>Firefox SVG</b> es un subconjunto de <a class="external" href="http://www.w3.org/TR/SVG11/">SVG 1.1</a>, pero no es ninguno de los perfiles oficiales (Tiny, Basic, Full). Al final de este documento se puede encontrar una lista completa de los elementos <a href="es/SVG">SVG</a> y su estado de implementación en Firefox 2.0. El resto del documento aporta información sobre las limitaciones en la implementación.</p>
-<p>La particular implementación que hemos realizado puede dificultar la creación de contenidos. Le pedimos que tenga paciencia mientras trabajamos en la implementación completa de esta extensa especificación.</p>
-<p>Mientras lee esto, usted puede preguntarse cuántos de estos detalles sobre de la implementación pueden haber cambiado. Por desgracia la <a class="external" href="http://www.mozilla.org/roadmap/gecko-1.9-roadmap.html">hoja de ruta</a> actual sitúa la publicación de Firefox con la nueva versión de Gecko en el primer trimestre de 2007. Sin embargo si desea empezar a experimentar con las nuevas funcionalidades, tiene a su disposición en las <a class="external" href="http://www.mozilla.org/developer/#builds">compilaciones nocturnas</a> las últimas evoluciones. También puede consultar <a class="external" href="http://www.mozilla.org/projects/svg/status.html">la tabla actualizada</a> sobre la implementación de SVG en la versión de desarrollo.</p>
-<h2 id="Rendimiento" name="Rendimiento">Rendimiento</h2>
-<p>Firefox usa el mismo motor de renderizado, <a class="external" href="http://cairographics.org/">cairo</a>, en todas las plataformas. Por lo tanto sus características de interpretación serán similares. El rendimiento en Linux es el más difícil de predecir, esto es debido a las distintas implementaciones que hacen los diversos servidores X de la extensión RENDER.</p>
-<p>En Windows el renderizado de SVG es bastante más rápido que en otras plataformas.</p>
-<h2 id="Rango_de_coordenadas" name="Rango_de_coordenadas">Rango de coordenadas</h2>
-<p>Si el contenido posee una geometría con un inmenso rango de coordenadas, habrá que tener cuidado con los problemas ocasionados por el uso interno de cairo para la representación de punto fijo de 16.16 bits para los cálculos. Cairo no recorta las primitivas antes del proceso de rasterización por lo que las coordenadas finales que excedan el rango de -32678 a 32677 tras la transformación provocarán errores de renderizado y posiblemente un rendimiento muy bajo.</p>
-<h2 id="Texto_en_Windows_98" name="Texto_en_Windows_98">Texto en Windows 98</h2>
-<p>Un lamentable efecto secundario de usar Cairo como backend de renderizado en Windows es que el renderizado de texto no funcionará en Windows 98. En realidad la cosa es aún peor, si aparece cualquier texto durante el renderizado de contenidos SVG, todo el dibujo se parará.</p>
-<h2 id="Selecci.C3.B3n_de_fuente" name="Selecci.C3.B3n_de_fuente">Selección de fuente</h2>
-<p>Si está familiarizado con CSS probablemente sabrá que pueden especificar fuentes alternativas para las propiedades 'font', por si los glifos de una fuente concreta no están disponibles. El actual motor de renderizado de SVG sólo tratará de usar la primera fuente especificada, y si ésta no existe, usará una fuente del sistema. Las fuentes secundarias nunca son usadas, por ejemplo, font-family="Arial,LucidaSansUnicode" no generará una fuente LucidaSansUnicode, aun en el caso de que Arial no esté disponible.</p>
-<h2 id="Impresi.C3.B3n" name="Impresi.C3.B3n">Impresión</h2>
-<p>Por desgracia, actualmente en la impresión no se aprovechan las propiedades vectoriales de SVG para generar una salida óptima, por contra, se renderiza según la resolución de la pantalla y luego la salida se hace como imagen.</p>
-<p>Al imprimir en MS-Windows, el tamaño de la fuente será mucho más grande que el especificado por SVG.</p>
-<h2 id="Opacidad_de_grupos" name="Opacidad_de_grupos">Opacidad de grupos</h2>
-<p>La propiedad de opacidad de grupo <code>opacity</code> permite que los objetos contenedores SVG puedan ser tratados como capas semitransparentes, y está separada de las propiedades "fill-opacity" y "stroke-opacity". La implementación actual de "opacity" consume bastantes recursos, debería ser usada con mesura. "fill-opacity" y "stroke-opacity" son mucho más rápidas, y dependiendo de su contenido pueden aportar los mismos resultados.</p>
-<h2 id="Fuentes_rotadas" name="Fuentes_rotadas">Fuentes rotadas</h2>
-<p>En las plataformas Microsoft Windows y Mac OSX, un texto rotado no es rellenado completamente. El error es por lo general despreciable y puede solucionarse usando un relleno un poquito más grueso. A continuación se muestra un ejemplo con la diferencia:</p>
-<p><img alt="Imagen:Text-fill-stroke.png"></p>
-<h2 id=".3Cimage.3E" name=".3Cimage.3E">&lt;image&gt;</h2>
-<p>&lt;image&gt; no soporta imágenes SVG en Firefox 1.5, sólo los formatos de imagen rasterizados que Firefox maneja.</p>
-<p>Todas las instancias de &lt;image&gt; tienen una copia separada de la imagen que está siendo usada, lo cual es algo a tener en cuenta si tu contenido está usando múltiples copias de una imagen para un icono o algo parecido. Desafortunadamente, &lt;use&gt; en contenido &lt;image&gt; cuenta como otra copia en este caso.</p>
-<p>De manera adicional, un uso intensivo de imágenes rasterizadas en SVG puede degradar sobremanera el rendimiento en Firefox 1.5.</p>
-<h2 id="Eventos" name="Eventos">Eventos</h2>
-<p>Soportamos los atributos de SVG para eventos, a excepción de <code>onfocusin</code>, <code>onfocusout</code>, y <code>onactivate</code>.</p>
-<p>Nuestro actual manejo del evento <code>onload</code> no es estándar, pero creemos que aún así no impide su uso correcto. Mientras que el código especificado por el atributo <code>onload</code> sea llamado para cada elemento, un evento <code>SVGLoad</code> será llamado únicamente para el elemento <code>&lt;svg&gt;</code> raíz. Algunos métodos DOM devolverán basura o error si son llamados antes de que el elemento correspondiente haya sido renderizado, algo que tendrás que tener en cuenta al escribir código <code>onload</code>. Dichos métodos son <code>getBBox</code>, <code>getScreenCTM</code>, etc...</p>
-<p>No damos soporte a los eventos para el teclado específicos de Adobe (<code>onkeydown</code>, <code>onkeyup</code>).</p>
-<h2 id="Interoperabilidad" name="Interoperabilidad">Interoperabilidad</h2>
-<p>Si está trabajando con contenidos SVG actuales, puede encontrar problemas al cargarlos en Firefox. La mayoría de los problemas suelen ser triviales y son el resultado de una implementación más estricta en Firefox. En <a class="external" href="http://jwatt.org/svg/authoring/">Guías de estilo para crear SVG</a>, Jonathan Watt explica problemas comunes.</p>
-<h2 id="Situaciones_de_uso_de_SVG" name="Situaciones_de_uso_de_SVG">Situaciones de uso de SVG</h2>
-<p>Firefox 1.5 maneja SVG como un documento completo, o como referencia para los elementos <code>embed</code>, <code>object</code>, e <code>iframe</code>. Actualmente no puede ser usado en HTML o XHTML como fuente del elemento <code>img</code>, ni para las propiedades CSS relativas a las imágenes.</p>
-<h2 id="Animaciones" name="Animaciones">Animaciones</h2>
-<p>Firefox 1.5 no implementa la animación declarativa, pero soporta scripting dinámico. Doug Shepers lo ha usado para crear <a class="external" href="http://www.vectoreal.com/smilscript/">SmilScript</a>, una pequeña biblioteca de Javascript que implementa parte de la animación declarativa de SVG.</p>
-<h2 id="Fallos_corregidos_en_Firefox_2" name="Fallos_corregidos_en_Firefox_2">Fallos corregidos en Firefox 2</h2>
-<p>Firefox 2 ha arreglado algunos fallos en su implementación para SVG. Esta sección presenta un repaso rápido a los arreglos más interesantes.</p>
-<ul>
- <li>Se ha solucionado un problema al rellenar y rotar texto en el que la posición del dibujo no era reiniciada correctamente entre dos operaciones (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=333615">333615</a>).</li>
-</ul>
-<ul>
- <li>Los gradientes radiales ahora mantienen los atributos <code>fx</code> y <code>fy</code> para asegurar que se encuentran dentro de la circunferencia de un círculo (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=330682">330682</a>).</li>
-</ul>
-<ul>
- <li>La longitud del texto ahora puede ser calculada usando su método <code>getComputedTextLength()</code>, lo que mejora la compatibilidad con ciertos sitios web (bugs <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=311031">311031</a> and <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=264380">264380</a>).</li>
-</ul>
-<ul>
- <li>Los elementos <code>&lt;tspan&gt;</code> ahora soportan correctamente los atributos <code>dx</code> y <code>dy</code> y funcionan si los atributos <code>x</code> e <code>y</code> no han sido especificados (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=311063">311063</a>).</li>
-</ul>
-<ul>
- <li>Se ha mejorado la lógica de invalidación en el redibujado, lo que evita el parpadeo de los píxeles en ciertos casos (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312269">312269</a>).</li>
-</ul>
-<ul>
- <li>Arreglado un fallo que impedía que los eventos fuesen manejados apropiadamente por objetos expuestos por el camino de recorte de otro objeto (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=315861">315861</a>).</li>
-</ul>
-<ul>
- <li>Arreglado un fallo que podía provocar el cierre de la aplicación si un elemento <code>&lt;path&gt;</code> tenía un atributo <code>d</code> con una cadena vacía (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=318379">318379</a>).</li>
-</ul>
-<ul>
- <li>El atributo <code>overflow</code> ahora funciona para el elemento <code>marker</code>, usando la sintaxis <code>overflow="visible"</code>, la cual antes no funcionaba correctamente (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=320623">320623</a>).</li>
-</ul>
-<ul>
- <li>Ahora se puede acceder al atributo <code>&lt;style&gt;</code> del elemento <code>marker</code> sin que se lance ninguna excepción (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=323589">323589</a>).</li>
-</ul>
-<ul>
- <li>Ahora se pueden usar valores porcentuales en el radio de un gradiente radial (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=323669">323669</a>).</li>
-</ul>
-<ul>
- <li>El método <code>documentElement.createSVGAngle()</code> ahora está implementado (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=327437">327437</a>).</li>
-</ul>
-<ul>
- <li>Cuando un elemento <code>&lt;stop&gt;</code> se convierte en hijo de otro elemento <code>&lt;stop&gt;</code> dicho elemento deja de ser un aserto (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=328137">328137</a>).</li>
-</ul>
-<ul>
- <li>Ahora funciona el cambio de la altura, anchura y orientación de los pinceles (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=325728">325728</a>).</li>
-</ul>
-<ul>
- <li>El tamaño de las fuentes impresas en Windows ya no es tan grande como el especificado por el SVG (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=314707">314707</a>).</li>
-</ul>
-<h2 id="Estado_de_la_implementaci.C3.B3n_de_los_elementos" name="Estado_de_la_implementaci.C3.B3n_de_los_elementos">Estado de la implementación de los elementos</h2>
-<table style="margin: 5px;">
- <tbody>
-  <tr>
-   <th><b>Elemento </b></th>
-   <th><b>Notas </b></th>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#basic-structure-mod">Módulo de estructura</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SVGElement">svg</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>Los atributos DOM <code>currentScale</code> y <code>currentTranslate</code> están implementados pero no existe una interfaz de usuario para pan ni zoom.</li>
-     <li>SVGSVGElement
-      <ul>
-       <li>Atributos no implementados: contentScriptType, contentStyleType, viewport, useCurrentView, currentView.</li>
-       <li>Bindings no implementados: pauseAnimations, unpauseAnimations,animationsPaused, getCurrentTime, setCurrentTime, getIntersectionList, getEnclosureList, checkIntersection, checkEnclosure, deselectAll, createSVGAngle, getElementById</li>
-      </ul>
-     </li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#GElement">g</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DefsElement">defs</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DescElement">desc</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>Solo disponible en el DOM, sin interfaz de usuario.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#TitleElement">title</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/metadata.html#MetadataElement">metadata</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>Solo disponible en el DOM, sin interfaz de usuario. &lt;/td&gt;</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SymbolElement">symbol</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#UseElement">use</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>Solo funciona para referencias internas al documento (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=269482">bug 269482</a>).</li>
-     <li>No sigue completamente las reglas de la cascada &lt;svg:use&gt; (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265894">bug 265894</a>).</li>
-     <li>No entrega eventos a un arbol SVGElementInstance (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265895">bug 265895</a>).</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#conditional-mod">Módulo de procesamiento condicional</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SwitchElement">switch</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#image-mod">Módulo de imagen</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement">image</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>Solo funciona para tramas de bitmaps (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=272288">bug 272288</a>).</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#style-mod">Módulo de estilo</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#StyleElement">style</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#shape-mod">Módulo de formas</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/paths.html#PathElement">path</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>Interfaz SVGPathElement
-      <ul>
-       <li>Atributos no implementados: pathLength, normalizedPathSegList, animatedPathSegList, animatedNormalizedPathSegList</li>
-       <li>Bindings no implementados: getTotalLength, getPointAtLength, getPathSegAtLength</li>
-      </ul>
-     </li>
-     <li>Interfaz SVGPathSegList
-      <ul>
-       <li>Bindings No implementados: replaceItem()</li>
-      </ul>
-     </li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement">rect</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#CircleElement">circle</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#LineElement">line</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement">ellipse</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolylineElement">polyline</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement">polygon</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/text.html#text-mod">Módulo de texto</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextElement">text</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>SVGTextElement
-      <ul>
-       <li>Atributos no implementados: rotate, textLength, lengthAdjust</li>
-       <li>Bindings no implementados: getNumberOfChars, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString.</li>
-       <li>Bindings not functional at <code>onload</code> time: getExtentOfChar</li>
-      </ul>
-     </li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TSpanElement">tspan</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>SVGTSpanElement
-      <ul>
-       <li>Atributos no implementados: rotate, textLength, lengthAdjust</li>
-       <li>Bindings no implementados: getNumberOfChars, getComputedTextLength, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getExtentOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString</li>
-      </ul>
-     </li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TRefElement">tref</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextPathElement">textPath</a></td>
-   <td>
-    <ul>
-     <li>Implementado en Firefox 2.</li>
-     <li>Atributos no implementados: method, spacing, textLength, lengthAdjust</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphElement">altGlyph</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphDefElement">altGlyphDef</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphItemElement">altGlyphItem</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#GlyphRefElement">glyphRef</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#marker-mod">Módulo de pinceles</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#MarkerElement">marker</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/color.html#color-profile-mod">Color Módulo de perfiles</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/color.html#ColorProfileElement">color-profile</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#gradient-mod">Módulo de gradientes</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#LinearGradientElement">linearGradient</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#RadialGradientElement">radialGradient</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#StopElement">stop</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#pattern-mod">Módulo de patrones</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">pattern</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#clip-mod">Módulo de recorte</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#ClipPathElement">clipPath</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-     <li>No maneja los caminos de recorte que tiene elementos con diferentes propiedades de reglas de recorte o que referencian otros clipPaths. (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=267224">bug 267224</a>).</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#mask-mod">Módulo de máscaras</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">mask</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#filter-mod">Módulo de filtros</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#FilterElement">filter</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feBlendElement">feBlend</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feColorMatrixElement">feColorMatrix</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feComponentTransferElement">feComponentTransfer</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement">feComposite</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElement">feConvolveMatrix</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDiffuseLightingElement">feDiffuseLighting</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMapElement">feDisplacementMap</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFloodElement">feFlood</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feGaussianBlurElement">feGaussianBlur</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement">feImage</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeElement">feMerge</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeNodeElement">feMergeNode</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMorphologyElement">feMorphology</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feOffsetElement">feOffset</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpecularLightingElement">feSpecularLighting</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTileElement">feTile</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTurbulenceElement">feTurbulence</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDistantLightElement">feDistantLight</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#fePointLightElement">fePointLight</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpotLightElement">feSpotLight</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncRElement">feFuncR</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncGElement">feFuncG</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncBElement">feFuncB</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncAElement">feFuncA</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#cursor-mod">Módulo de cursores</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#CursorElement">cursor</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#hyperlinking-mod">Módulos de hiperenlaces</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#AElement">a</a></td>
-   <td>
-    <ul>
-     <li>Implementado como un binding XBL - object is not of type SVGAElement.</li>
-     <li>Sólo están implementados los atributos <code>xlink:href</code>, <code>xlink:show</code> y <code>xlink:target</code> (en Firefox 2).</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#view-mod">Módulo de vista</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#ViewElement">view</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/script.html#scripting-mod">Módulo de scripting</a></th>
-  </tr>
-  <tr style="color: black; background-color: lightgreen;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/script.html#ScriptElement">script</a></td>
-   <td>
-    <ul>
-     <li>Implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#animation-mod">Módulo de animación</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateElement">animate</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#SetElement">set</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateMotionElement">animateMotion</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateTransformElement">animateTransform</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateColorElement">animateColor</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#mpathElement">mpath</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#font-mod">Módulo de fuentes</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceElement">font</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement">glyph</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#MissingGlyphElement">missing-glyph</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#HKernElement">hkern</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#VKernElement">vkern</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceSrcElement">font-face-src</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-uri</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-format</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-name</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#DefinitionSrcElement">definition-src</a></td>
-   <td>
-    <ul>
-     <li>No implementado.</li>
-    </ul>
-   </td>
-  </tr>
-  <tr>
-   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#extensibility-mod">Módulo de extensibilidad</a></th>
-  </tr>
-  <tr style="color: black; background-color: salmon;">
-   <td><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">foreignObject</a></td>
-   <td>
-    <ul>
-     <li>Implementado, aunque no integrado.</li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-<p>{{ languages( { "fr": "fr/SVG_dans_Firefox_1.5", "ja": "ja/SVG_in_Firefox_1.5", "pl": "pl/SVG_w_Firefoksie" } ) }}</p>
diff --git a/files/es/tipo_mime_incorrecto_en_archivos_css/index.html b/files/es/tipo_mime_incorrecto_en_archivos_css/index.html
deleted file mode 100644
index fbd15d6764..0000000000
--- a/files/es/tipo_mime_incorrecto_en_archivos_css/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: Tipo MIME incorrecto en archivos CSS
-slug: Tipo_MIME_incorrecto_en_archivos_CSS
-tags:
-  - CSS
-  - Todas_las_Categorías
-translation_of: Web/HTTP/Basics_of_HTTP/MIME_types
-translation_of_original: Incorrect_MIME_Type_for_CSS_Files
----
-<h3 id=".C2.BFCu.C3.A1l_es_el_problema.3F"> ¿Cuál es el problema? </h3>
-<p>Quizás encuentres una web que use CSS con un diseño pobre en Netscape 7.x o cualquier navegador basado en Gecko como Mozilla, mientras que en Internet Explorer se muestra correctamente. Una de las razones más comunes para que esto suceda es una configuración inapropiada del servidor que tiene almacenado el archivo CSS. Algunos servidores Apache e iPlanet asocian archivos con extensión .CSS con un tipo incorrecto MIME como el "text/plain" o "application/x-pointplus". En algunos casos, Netscape 7.x y Mozilla ignoran el archivo CSS porque tiene un tipo MIME incorrecto y usan una hoja de estilo por defecto que causa que el diseño sea diferente del que se pretendía por parte del desarrollador web.
-</p>
-<h3 id=".C2.BFCu.C3.A1ndo_ocurre_esto.3F"> ¿Cuándo ocurre esto? </h3>
-<p>La <a class="external" href="http://www.w3.org/TR/REC-CSS2/conform.html#text-css">especificación</a> W3C menciona que los archivos CSS deben ser almacenados con el tipo MIME "text/css". Mozilla y Netscape 7.x, cuando son usados en "modo estricto" siguen la especificación al pie de la letra y esperan que el archivo CSS este almacenado con el tipo MIME correcto (El "Modo estricto" se activa teniendo una Definición del Tipo de Documento estricta en la primera línea de la página HTML). En el "modo no estricto", ambas aplicaciones tolerarán el tipo MIME incorrecto y usarán la hoja de estilo adjunta a pesar de la configuración errónea del servidor. Esto significa que no puedes tener documentos en modo "estricto" con un servidor mal configurado. Internet Explorer te permite saltarte esta desconfiguración al no tener en cuenta el tipo MIME que el servidor proporciona en la cabecera del http.
-</p>
-<h3 id=".C2.BFQu.C3.A9_puedo_hacer_para_cambiar_esto.3F"> ¿Qué puedo hacer para cambiar esto? </h3>
-<p>Debes comentar a los administradores del servidor que actualicen el archivo de configuración de tipo MIME en el servidor web.
-</p><p>Esta cuestión, en los servidores web iPlanet/Netscape ya ha sido puesta en conocimiento por el vendedor, quien ha añadido una <a href="#Cambiando_el_tipo_MIME_en_servidores_iPlanet.2FSun">nota técnica</a> en su base de conocimientos.
-</p><p>Si usas Apache, puedes cambiar también la configuración del archivo .htaccess en tu directorio raíz (El archivo .htaccess es un archivo de solo lectura que maneja varias cosas incluyendo los tipos MIME). Añade esta línea a tu archivo .htaccess:
-</p>
-<pre>AddType text/css .css</pre>
-<p>Ten en cuenta que algunos Webmasters han deshabilitado el uso del archivo de configuración .htaccess en sus servidores Apache porque tiene un pequeño impacto de rendimiento.
-</p>
-<h3 id="Conclusi.C3.B3n"> Conclusión </h3>
-<p>Usar un tipo de definición de documento estricta con Mozilla dará lugar a que el servidor que aloja tus páginas web necesite ser configurado apropiadamente. Hay varias soluciones a este problema, pero la más efectiva es tener el tipo MIME correcto asociado a los archivos .css. Comenta al Webmaster que arregle esto por ti, ¡todo el mundo que publique documentos html en modo estricto te lo agradecerá!
-</p>
-<h3 id="Cambiando_el_tipo_MIME_en_servidores_iPlanet.2FSun"> Cambiando el tipo MIME en servidores iPlanet/Sun </h3>
-<p><b>Problema</b>
-</p><p>Los usuarios se encuentran con un dialogo de <i>Salvar como</i> con el tipo de contenido <i>application/x-pointplus</i> o con el contenido del archivo CSS representado como texto en el navegador cuando una pagina incluye una Hoja de Estilo con la extensión .css.
-</p><p><b>Solución</b>
-</p><p>El tipo de archivo .css no esta enlazado a las hojas de estilo en los tipos por defecto MIME incluidos en el Enterprise Server. Puedes cambiar el enlace en la pagina de tipos globales MIME.
-</p><p>Para acceder a esta página, desde el admin server acceder a <i>Preferencias del Servidor</i>, <i>MIME Types</i>, y establece el tipo MIME a .css a <i>text/css</i> en vez de <i>application/x-pointplus</i>.
-</p><p>Si el problema persiste, desactiva el keepalive añadiendo "KeepAliveTimeout 0" al <i>magnus.conf</i>
-</p><p>Basado en: <a class="external" href="http://sunsolve.sun.com">SunSolve, Sun Microsystems</a>
-</p>
-<h3 id="Fuentes_adicionales"> Fuentes adicionales </h3>
-<p><a href="es/Configurar_correctamente_los_tipos_MIME_del_servidor">Configurar correctamente los tipos MIME del servidor</a>
-</p><p><a class="external" href="http://www.htmlhelp.com/faq/html/media.html#garbled-media">Sobre garbled media</a>
-</p>
-<div class="originaldocinfo">
-<h3 id="Informaci.C3.B3n_original_del_documento"> Información original del documento </h3>
-<ul><li> Autor(es): Tristan Nitot
-</li><li> Última actualización: March 18th, 2002
-</li><li> Copyright © 2001-2003 Netscape.
-</li></ul>
-</div>
-{{ languages( { "en": "en/Incorrect_MIME_Type_for_CSS_Files", "fr": "fr/Type_MIME_incorrect_pour_les_fichiers_CSS", "pl": "pl/Nieprawid\u0142owy_typ_MIME_plik\u00f3w_CSS" } ) }}
diff --git a/files/es/tools/accesos_directos/index.html b/files/es/tools/accesos_directos/index.html
deleted file mode 100644
index 9372393011..0000000000
--- a/files/es/tools/accesos_directos/index.html
+++ /dev/null
@@ -1,1266 +0,0 @@
----
-title: Accesos directos
-slug: Tools/Accesos_directos
-tags:
-  - Herramientas
-  - 'l10n:priority'
-translation_of: Tools/Keyboard_shortcuts
----
-<div>{{ToolsSidebar}}</div>
-
-<p>Esta página muestra todos los accesos directos utilizados para las herramientas para desarrolladores de Firefox.</p>
-
-<p>La primera sección muestra el acceso directo para cada herramienta mientras que la segunda sección muestra los accesos directos aplicables sólo a las herramientas de desarrolladores. Por último hay una sección para cada herramienta, que lista todos los accesos directos que puedes usar dentro de la misma.</p>
-
-<p>Debido a que los accesos directos dependen de la ubicación, no están documentados en esta página.</p>
-
-<h2 id="Herramientas_de_apertura_y_cierre"><span class="tlid-translation translation" lang="es"><span title="">Herramientas de apertura y cierre</span></span></h2>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan en la ventana principal del navegador para abrir la herramienta especificada.</span> <span title="">Los mismos accesos directos funcionarán para cerrar las herramientas alojadas en la Caja de herramientas si la herramienta está activa.</span> <span title="">Para herramientas que se abren en una nueva ventana, como la consola del navegador, debe cerrar la ventana para cerrar la herramienta.</span></span></p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Abre la caja de herramientas (con la herramienta más reciente activada)</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>I</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Trae la caja de herramientas a primer plano (solo si está en una ventana separada y no en primer plano)</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Cierra la caja de herramientas (si está en una ventana separada y en primer plano)</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre la consola web <a href="#opening-closing-web-console-note"><strong><sup>1</sup></strong></a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>K</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el inspector de elementos</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el depurador <strong><sup><a href="#acceso_directo_depurador">2</a></sup></strong></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>S</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el editor de estilos</th>
-   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F7</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
-   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el perfilador</th>
-   <td><kbd>Shift</kbd> + <kbd>F5</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F5</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
-   <td><kbd>Shift</kbd> + <kbd>F5</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el monitor de red <a href="#opening-closing-network-monitor-note"><strong><sup>3</sup></strong></a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>E</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Despliega las herramientas de desarrollador</th>
-   <td><kbd>Shift</kbd> + <kbd>F2</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F2</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
-   <td><kbd>Shift</kbd> + <kbd>F2</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Despliega la vista de diseño adaptable</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>M</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>M</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>M</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre la consola del navegador <a href="#opening-closing-browser-console-note"><sup>4</sup></a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>J</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>J</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>J</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre la caja de herramientas del navegador</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el bloc de notas</th>
-   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el WebIDE</th>
-   <td><kbd>Shift</kbd> + <kbd>F8</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F8</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F8</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el inspector de almacenamiento <a href="#disabled-tools-shortcut"><sup>5</sup></a></th>
-   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el depurador<strong><sup><a href="#acceso_directo_depurador"> 2</a></sup></strong></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>Z</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<p><a name="opening-closing-web-console-note">1. </a><span class="tlid-translation translation" lang="es"><span title="">A diferencia de otras herramientas alojadas en la caja de herramientas, este acceso directo tampoco cierra la Consola Web.</span> <span title="">En cambio, se centra en la línea de comandos de la consola web.</span> <span title="">Para cerrar la consola web, use el acceso directo de la caja de herramientas global de Ctrl + Shift + I (Cmd + Opt + I en una Mac).</span></span><a name="opening-closing-web-console-note"></a></p>
-
-<p><a id="acceso_directo_depurador" name="acceso_directo_depurador">2. <span class="tlid-translation translation" lang="es"><span title="">A partir de Firefox 66, este acceso directo ya no estará asociado con el depurador</span></span>. A partir de Firefox 71, la letra de este acceso directo pasará a ser la Z.</a></p>
-
-<p><a name="opening-closing-network-monitor-note">3. Antes de Firefox 55, el atajo de teclaro era </a><a name="opening-closing-network-monitor-note"><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Q</kbd> (<kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>Q</kbd> en Mac).</a></p>
-
-<p><a id="opening-closing-browser-console-note" name="opening-closing-browser-console-note">4. </a><span class="tlid-translation translation" lang="es"><span title="">Hasta Firefox 38, cuando la consola del navegador está oculta por una ventana normal de Firefox, la misma combinación de teclas cierra la consola del navegador.</span> <span title="">Desde Firefox 38 en adelante, si la consola del navegador está oculta por una ventana normal de Firefox, esta combinación de teclas vuelve a colocar la consola del navegador en la parte superior y se enfoca en ella.</span></span><a name="opening-closing-browser-console-note">.</a></p>
-
-<p><a href="/en-US/docs/Tools_Toolbox#Settings" name="disabled-tools-shortcut">5. </a><span class="tlid-translation translation" lang="es"><span title="">La herramienta está deshabilitada de forma predeterminada, por lo que el acceso directo no funcionará hasta que se habilite desde el Panel de configuración.</span></span></p>
-
-<h2 id="Caja_de_Herramientas">Caja de Herramientas</h2>
-
-<div id="toolbox-shortcuts">
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan siempre que la caja de herramientas esté abierta, sin importar qué herramienta esté activa.</span></span></p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Recorre las herramientas de izquierda a derecha</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>]</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>]</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>]</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Recorre las herramientas de derecha a izquierda</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>[</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>[</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>[</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alterna entre la herramienta activa y la configuración.</span></span></th>
-   <td><kbd>F1</kbd></td>
-   <td><kbd>F1</kbd></td>
-   <td><kbd>F1</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alterna caja de herramientas entre los 2 últimos modos de acoplamiento</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alterna consola dividida (excepto si la consola es la herramienta seleccionada actualmente)</span></span></th>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="all-toolbox-tools">
-<div class="text-wrap tlid-copy-target">
-<div class="result-shield-container tlid-copy-target"><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan en todas las herramientas alojadas en la caja de herramientas.</span></span></div>
-
-<div class="result-shield-container tlid-copy-target"></div>
-</div>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Incrementa el tamaño de la fuente</th>
-   <td><kbd>Ctrl</kbd> + <kbd> + </kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd> + </kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd> + </kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Decrementa el tamaño de la fuente</th>
-   <td><kbd>Ctrl</kbd> + <kbd>-</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>-</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>-</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Restaura el tamaño por defecto de la fuente</th>
-   <td><kbd>Ctrl</kbd> + <kbd>0</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>0</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>0</kbd></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Editor_de_código_fuente">Editor de código fuente</h2>
-
-<div id="source-editor">
-<p><span class="tlid-translation translation" lang="es"><span title="">Esta tabla enumera los accesos directos predeterminados para el editor de código fuente.</span></span></p>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">En la sección <a href="/en-US/docs/Tools/Settings#Editor_Preferences">Preferencias del editor</a> de la configuración de las herramientas del desarrollador, es posible optar por utilizar las combinaciones de teclas Vim, Emacs o Sublime Text en su lugar.</span></span></p>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Para seleccionarlos, visite </span></span><code>about:config</code><span class="tlid-translation translation" lang="es"><span title="">, seleccione la configuración </span></span><code>devtools.editor.keymap</code><span class="tlid-translation translation" lang="es"><span title=""> y asigne "vim" o "emacs", o "sublime" a esa configuración.</span> <span title="">Si hace esto, los enlaces seleccionados se usarán para todas las herramientas de desarrollador que usan el editor de origen.</span> <span title="">Debe volver a abrir el editor para que el cambio surta efecto.</span></span></p>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Desde Firefox 33 en adelante, la preferencia de vinculación de teclas se expone en la sección <a href="/en-US/docs/Tools/Settings#Editor_Preferences">Preferencias del editor</a> de la configuración de las herramientas del desarrollador, y puede configurarla allí en lugar de en </span></span><code>about:config</code><span class="tlid-translation translation" lang="es"><span title="">.</span></span></p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Ir a la linea</th>
-   <td><kbd>Ctrl</kbd> + <kbd>J</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>J</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>J</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Buscar en la página</th>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Volver a buscar en la página</th>
-   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>G</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Seleccionar todo</th>
-   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>A</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Cortar</th>
-   <td><kbd>Ctrl</kbd> + <kbd>X</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>X</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>X</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Copiar</th>
-   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Pegar</th>
-   <td><kbd>Ctrl</kbd> + <kbd>V</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>V</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>V</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Desacer</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Z</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Rehacer</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Cmd</kbd> + <kbd>Y</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Identar</th>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Quitar identado o sangría</th>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mover línea(s) hacia arriba</span></span></th>
-   <td><kbd>Alt</kbd> + <kbd>Up</kbd></td>
-   <td><kbd>Alt</kbd> + <kbd>Up</kbd></td>
-   <td><kbd>Alt</kbd> + <kbd>Up</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mover línea (s) hacia abajo</span></span></th>
-   <td><kbd>Alt</kbd> + <kbd>Down</kbd></td>
-   <td><kbd>Alt</kbd> + <kbd>Down</kbd></td>
-   <td><kbd>Alt</kbd> + <kbd>Down</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Comentar/Decomentar linea(s)</th>
-   <td><kbd>Ctrl</kbd> + <kbd>/</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>/</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>/</kbd></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Inspector_de_páginas">Inspector de páginas</h2>
-
-<div id="page-inspector">
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Abre el inspector</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Selector_de_nodos"><span class="tlid-translation translation" lang="es"><span title="">Selector de nodos</span></span></h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan mientras el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Select_an_element#With_the_node_picker">selector de nodos</a> está activo.</span></span></p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Seleccione el elemento debajo del mouse y cancela el modo selector</span></span></th>
-   <td><kbd>Click</kbd></td>
-   <td><kbd>Click</kbd></td>
-   <td><kbd>Click</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Seleccione el elemento debajo del mouse y permanece en modo selector</span></span></th>
-   <td><kbd>Shift</kbd>+<kbd>Click</kbd></td>
-   <td><kbd>Shift</kbd>+<kbd>Click</kbd></td>
-   <td><kbd>Shift</kbd>+<kbd>Click</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Panel_HTML"><span class="tlid-translation translation" lang="es"><span title="">Panel HTML</span></span></h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan mientras se esté en el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML">panel HTML del Inspector</a>.</span></span></p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Elimina el nodo seleccionado</th>
-   <td><kbd>Delete</kbd></td>
-   <td><kbd>Delete</kbd></td>
-   <td><kbd>Delete</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Deshace el borrado de un nodo</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Z</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Rehace el borrado de un nodo</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Cmd</kbd> + <kbd>Y</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al siguiente nodo (solo nodos expandidos)</span></span></th>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Moverse al nodo anterior</th>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Moverse al primer nodo del arbol</th>
-   <td><kbd>Home</kbd></td>
-   <td><kbd>Home</kbd></td>
-   <td><kbd>Home</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Moverse al últiimo nodo del arbol</th>
-   <td><kbd>End</kbd></td>
-   <td><kbd>End</kbd></td>
-   <td><kbd>End</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Expandir el nodo seleccionado actualmente</span></span></th>
-   <td><kbd>Right arrow</kbd></td>
-   <td><kbd>Right arrow</kbd></td>
-   <td><kbd>Right arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Contraer el nodo seleccionado actualmente</span></span></th>
-   <td><kbd>Left arrow</kbd></td>
-   <td><kbd>Left arrow</kbd></td>
-   <td><kbd>Left arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">(Cuando se selecciona un nodo) moverse dentro del nodo para que pueda comenzar a recorrer los atributos.</span></span></th>
-   <td><kbd>Enter</kbd></td>
-   <td><kbd>Return</kbd></td>
-   <td><kbd>Enter</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avanza por los atributos de un nodo</span></span></th>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Retrocede a través de los atributos de un nodo</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">(Cuando se selecciona un atributo) comienza a editar el atributo</span></span></th>
-   <td><kbd>Enter</kbd></td>
-   <td><kbd>Return</kbd></td>
-   <td><kbd>Enter</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Oculta / muestra el nodo seleccionado</span></span></th>
-   <td><kbd>H</kbd></td>
-   <td><kbd>H</kbd></td>
-   <td><kbd>H</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Se centra en el cuadro de búsqueda en el panel HTML</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Editar como HTML</span></span></th>
-   <td><kbd>F2</kbd></td>
-   <td><kbd>F2</kbd></td>
-   <td><kbd>F2</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Deja de editar como HTML</span></span></th>
-   <td><kbd>F2</kbd> / <kbd>Ctrl</kbd> +<kbd>Enter</kbd></td>
-   <td><kbd>F2</kbd> / <kbd>Cmd</kbd> + <kbd>Return</kbd></td>
-   <td><kbd>F2</kbd> / <kbd>Ctrl</kbd> + <kbd>Enter</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Copia el HTML externo del nodo seleccionado</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>C</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazar el nodo seleccionado a la vista</span></span></th>
-   <td><kbd>S</kbd></td>
-   <td><kbd>S</kbd></td>
-   <td><kbd>S</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra la siguiente coincidencia en el marcado, cuando la búsqueda está activa</span></span></th>
-   <td><kbd>Enter</kbd></td>
-   <td><kbd>Return</kbd></td>
-   <td><kbd>Enter</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra la coincidencia anterior en el marcado, cuando la búsqueda está activa</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Return</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Barra_de_rutas_de_exploración_o_migas_de_pan">Barra de rutas de exploración o migas de pan</h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos funcionan cuando la <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#HTML_breadcrumbs">barra de rutas de exploración</a> está enfocada.</span></span></p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al elemento anterior en la barra</span></span></th>
-   <td><kbd>Left arrow</kbd></td>
-   <td><kbd>Left arrow</kbd></td>
-   <td><kbd>Left arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al siguiente elemento en la barra</span></span></th>
-   <td><kbd>Right arrow</kbd></td>
-   <td><kbd>Right arrow</kbd></td>
-   <td><kbd>Right arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Enfoca el </span></span> <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#HTML_pane">panel HTML</a></th>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Enfoca el</span></span> <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#CSS_pane">panel CSS</a></th>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Panel_CSS">Panel CSS</h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos funcionan cuando estás en el</span></span> <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS" title="/en-US/docs/Tools/Page_Inspector#CSS_pane">Inspector del panel CSS</a>.</p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Se centra en el cuadro de búsqueda del panel CSS</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Borrar el contenido del cuadro de búsqueda (solo cuando el cuadro de búsqueda está enfocado y se ha ingresado contenido)</span></span></th>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avanza a través de propiedades y valores del panel</span></span></th>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Retroceda a través de propiedades y valores del panel</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Comienza a editar la propiedad o el valor (Vista de reglas solamente, cuando se selecciona una propiedad o valor, pero aún no se está editando)</span></span></th>
-   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
-   <td><kbd>Return</kbd> or <kbd>Space</kbd></td>
-   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Se desplaza hacia arriba y hacia abajo a través de sugerencias de autocompletar (sólo vista de Reglas, cuando se edita una propiedad o valor)</span></span></th>
-   <td><kbd>Up arrow</kbd> , <kbd>Down arrow</kbd></td>
-   <td><kbd>Up arrow</kbd> , <kbd>Down arrow</kbd></td>
-   <td><kbd>Up arrow</kbd> , <kbd>Down arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Elige la sugerencia actual de autocompletar (sólo vista de reglas, cuando se edita una propiedad o valor)</span></span></th>
-   <td><kbd>Enter</kbd> or <kbd>Tab</kbd></td>
-   <td><kbd>Return</kbd> or <kbd>Tab</kbd></td>
-   <td><kbd>Enter</kbd> or <kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 1</span></span></th>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reducir el valor seleccionado en 1</span></span></th>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 100</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Page Up</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Page Up</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Page Up</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Decrementar el valor seleccionado en 100</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Page Down</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Page Down</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Page Down</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 10</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Up arrow</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Up arrow</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Up arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reducir el valor seleccionado en 10</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Down arrow</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Down arrow</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Down arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 0.1</span></span></th>
-   <td><kbd>Alt</kbd> + <kbd>Up arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Up arrow</kbd> from Firefox 60 onwards.)</td>
-   <td><kbd>Alt</kbd> + <kbd>Up arrow</kbd></td>
-   <td><kbd>Alt</kbd> + <kbd>Up arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Up arrow</kbd> from Firefox 60 onwards.)</td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reducir el valor seleccionado en 0.1</span></span></th>
-   <td><kbd>Alt</kbd> + <kbd>Down arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Down arrow</kbd> from Firefox 60 onwards).</td>
-   <td><kbd>Alt</kbd> + <kbd>Down arrow</kbd></td>
-   <td><kbd>Alt</kbd> + <kbd>Down arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Down arrow</kbd> from Firefox 60 onwards).</td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mostrar / ocultar más información sobre la propiedad actual (sólo vista calculada, cuando se selecciona una propiedad)</span></span></th>
-   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
-   <td><kbd>Return</kbd> or <kbd>Space</kbd></td>
-   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Abrir la página de referencia de MDN sobre la propiedad actual (solo vista calculada, cuando se selecciona una propiedad)</span></span></th>
-   <td><kbd>F1</kbd></td>
-   <td><kbd>F1</kbd></td>
-   <td><kbd>F1</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Abra el archivo CSS actual en el Editor de estilos (solo vista calculada, donde se muestra más información para una propiedad y se enfoca una referencia de archivo CSS).</span></span></th>
-   <td><kbd>Enter</kbd></td>
-   <td><kbd>Return</kbd></td>
-   <td><kbd>Enter</kbd></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Depurador">Depurador</h2>
-
-<div id="debugger">
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Cerrar archivo</th>
-   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>W</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar texto en el archivo actual</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar texto en todos los archivos</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra el siguiente en el archivo actual</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>G</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar cadenas por nombre</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>P</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reanudar la ejecución en un punto de interrupción</span></span></th>
-   <td><kbd>F8</kbd></td>
-   <td><kbd>F8</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
-   <td><kbd>F8</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Siguiente</th>
-   <td><kbd>F10</kbd></td>
-   <td><kbd>F10</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
-   <td><kbd>F10</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Anterior</th>
-   <td><kbd>F11</kbd></td>
-   <td><kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
-   <td><kbd>F11</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Salir</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
-   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Alternar punto de interrupción en la línea seleccionada actualmente</th>
-   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Alternar punto de interrupción condicional en la línea seleccionada actualmente</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<p><a name="mac-function-key-note">1. </a><span class="tlid-translation translation" lang="es"><span title="">De manera predeterminada, en algunos Mac, la tecla de función se reasigna para usar una función especial: por ejemplo, para cambiar el brillo de la pantalla o el volumen.</span> <span title="">Consulte esta <a href="http://support.apple.com/kb/HT3399">guía para usar estas teclas como teclas de función estándar</a>.</span> <span title="">Para usar una tecla reasignada como una tecla de función estándar, mantenga presionada la tecla Función también (para abrir el Profiler, use </span></span><kbd>Shift</kbd> + <kbd>Function</kbd> + <kbd>F5</kbd><span class="tlid-translation translation" lang="es"><span title="">)</span></span><a name="mac-function-key-note"></a>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> <span class="tlid-translation translation" lang="es"><span title="">Antes de Firefox 66, la combinación </span></span> <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd> <span class="tlid-translation translation" lang="es"><span title=""> en Windows y Linux o </span></span><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>S</kbd><span class="tlid-translation translation" lang="es"><span title=""> en macOS abriría / cerraría el depurador.</span> <span title="">Desde Firefox 66 y versiones posteriores, este ya no es el caso</span></span>.</p>
-</div>
-</div>
-
-<h2 id="Depurador_Antes_de_Firefox_52">Depurador (Antes de Firefox 52)</h2>
-
-<div id="old-debugger">
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Command</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Abrir el depurador</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>S</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar una cadena en el archivo actual</span></span> usando el <a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra el siguiente en el archivo actual</span></span></th>
-   <td><kbd>Enter</kbd> / <kbd>Up arrow</kbd></td>
-   <td><kbd>Return</kbd> / <kbd>Up arrow</kbd></td>
-   <td><kbd>Enter</kbd> / <kbd>Up arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra el anterior en el archivo actual</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Enter</kbd> / <kbd>Down arrow</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Return</kbd> / <kbd>Down arrow</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Enter</kbd> / <kbd>Down arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar en todas las fuentes usando el </span></span><a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar cadenas por nombre</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>P</kbd> / <kbd>Ctrl</kbd> + <kbd>O</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>P</kbd> / <kbd>Ctrl</kbd> + <kbd>O</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>P</kbd> / <kbd>Ctrl</kbd> + <kbd>O</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar definiciones de funciones</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>D</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>D</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>D</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Filtrar variables cuando la ejecución está en pausa</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>V</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>V</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>V</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reanudar la ejecución en un punto de interrupción</span></span></th>
-   <td><kbd>F8</kbd></td>
-   <td><kbd>F8</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
-   <td><kbd>F8</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Siguiente</th>
-   <td><kbd>F10</kbd></td>
-   <td><kbd>F10</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
-   <td><kbd>F10</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Anterior</th>
-   <td><kbd>F11</kbd></td>
-   <td><kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
-   <td><kbd>F11</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Salir</th>
-   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
-   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alternar punto de interrupción en la línea seleccionada </span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alternar punto de interrupción condicional en la línea seleccionada</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Agregar texto seleccionado a las expresiones de Watch</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Ir a la linea usando el <a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>L</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Buscar usando el <a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>O</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">En el <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_pane">panel de código fuente</a>, salta a la definición de la función</th>
-   <td><kbd>Ctrl</kbd> + click</td>
-   <td><kbd>Cmd</kbd> + click</td>
-   <td><kbd>Ctrl</kbd> + click</td>
-  </tr>
- </tbody>
-</table>
-
-<p><a name="mac-function-key-note">1. </a><span class="tlid-translation translation" lang="es"><span title="">De manera predeterminada, en algunos Mac, la tecla de función se reasigna para usar una función especial: por ejemplo, para cambiar el brillo de la pantalla o el volumen.</span> <span title="">Consulte esta <a href="http://support.apple.com/kb/HT3399">guía para usar estas teclas como teclas de función estándar</a>.</span> <span title="">Para usar una tecla reasignada como una tecla de función estándar, mantenga presionada la tecla Función también (para abrir el Profiler, use </span></span><kbd>Shift</kbd> + <kbd>Function</kbd> + <kbd>F5</kbd><span class="tlid-translation translation" lang="es"><span title="">)</span></span><a name="mac-function-key-note"></a></p>
-</div>
-
-<h2 id="Consola_web">Consola web</h2>
-
-<div id="web-console">
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comandos</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Abre la consola web</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>K</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar en el panel de visualización de mensajes</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abre el <a href="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties" title="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties">panel inspector de objetos</a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Click</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Click</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Click</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Limpia el <a href="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties" title="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties">panel inspector de objetos</a></th>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Centrarse en la línea de comando</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>K</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Limpiar salida</th>
-   <td>
-    <p><kbd>Ctrl</kbd> + <kbd>L</kbd></p>
-
-    <p>From Firefox 44:</p>
-
-    <p><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>L</kbd></p>
-   </td>
-   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
-   <td>
-    <p><kbd>Ctrl</kbd> + <kbd>L</kbd></p>
-
-    <p>From Firefox 44:</p>
-
-    <p><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>L</kbd></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Interprete_de_línea_de_comandos">Interprete de línea de comandos</h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos se aplican cuando estás en el</span></span> <a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter">Interprete de línea de comandos.</a></p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse hasta el inicio de la salida de la consola (solo si la línea de comando está vacía)</span></span></th>
-   <td><kbd>Home</kbd></td>
-   <td><kbd>Home</kbd></td>
-   <td><kbd>Home</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse hasta el final de la salida de la consola (solo si la línea de comando está vacía)</span></span></th>
-   <td><kbd>End</kbd></td>
-   <td><kbd>End</kbd></td>
-   <td><kbd>End</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avanzar página a través de la salida de la consola</span></span></th>
-   <td><kbd>Page up</kbd></td>
-   <td><kbd>Page up</kbd></td>
-   <td><kbd>Page up</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Retroceder una página a través de la salida de la consola</span></span></th>
-   <td><kbd>Page down</kbd></td>
-   <td><kbd>Page down</kbd></td>
-   <td><kbd>Page down</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir hacia atrás a través del </span></span><a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history">historial de comandos</a></th>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir hacia delante a través del </span></span><a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history">historial de comandos</a></th>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Inicie la búsqueda inversa a través del historial de comandos / retroceda a través de comandos coincidentes</span></span></th>
-   <td><kbd>F9</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>R</kbd></td>
-   <td><kbd>F9</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avance por el historial de comandos coincidentes (después de iniciar la búsqueda inversa)</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>S</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al principio de la línea</span></span></th>
-   <td><kbd>Home</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al final de la línea</span></span></th>
-   <td><kbd>End</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Ejecutar la expresión actual</th>
-   <td><kbd>Enter</kbd></td>
-   <td><kbd>Return</kbd></td>
-   <td><kbd>Enter</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Agregar una nueva línea (para ingresar expresiones de varias líneas)</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Return</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ventana_emergente_de_autocompletado">Ventana emergente de autocompletado</h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos se aplican mientras</span></span> la <a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Autocomplete" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Autocomplete">ventana emergente de autocompletado</a> está desplegada:</p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Elija la sugerencia actual de autocompletado</span></span></th>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-   <td><kbd>Tab</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Cancelar la ventana emergente de autocompletado</span></span></th>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir a la sugerencia de autocompletado anterior</span></span></th>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-   <td><kbd>Up arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir a la siguiente sugerencia de autocompletado</span></span></th>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-   <td><kbd>Down arrow</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Página arriba a través de sugerencias de autocompletado</span></span></th>
-   <td><kbd>Page up</kbd></td>
-   <td><kbd>Page up</kbd></td>
-   <td><kbd>Page up</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Página abajo a través de sugerencias de autocompletado</span></span></th>
-   <td><kbd>Page down</kbd></td>
-   <td><kbd>Page down</kbd></td>
-   <td><kbd>Page down</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse al principio de  las sugerencias de autocompletado</span></span></th>
-   <td><kbd>Home</kbd></td>
-   <td><kbd>Home</kbd></td>
-   <td><kbd>Home</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse hasta el final de las sugerencias de autocompletado</span></span></th>
-   <td><kbd>End</kbd></td>
-   <td><kbd>End</kbd></td>
-   <td><kbd>End</kbd></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Editor_de_Estilo">Editor de Estilo</h2>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Abrir el editor de estilo</th>
-   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abrir una ventana emergente de autocompletado</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Space</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<div id="scratchpad">
-<h2 id="Bloc_de_Notas">Bloc de Notas</h2>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row">Abrir el bloc de notas</th>
-   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Ejecutar el código del bloc de notas</th>
-   <td><kbd>Ctrl</kbd> + <kbd>R</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>R</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>R</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Ejecutar el código del bloc de notas y mostrar el resultado en el <a href="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties" title="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties">inspector de objetos</a></th>
-   <td><kbd>Ctrl</kbd> + <kbd>I</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>I</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>I</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Ejecutar el código del bloc de notas e insertar el resultado como un comentario</th>
-   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>L</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Reevaluar la función actual</th>
-   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>E</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Recargar la página actual y ejecutar el código del bloc de nota</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Guardar el código del bloc de notas</th>
-   <td><kbd>Ctrl</kbd> + <kbd>S</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>S</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>S</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Abrir un código existente</th>
-   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>O</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Crear una nueva página del bloc de notas</th>
-   <td><kbd>Ctrl</kbd> + <kbd>N</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>N</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>N</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Cerrar el bloc de notas</th>
-   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>W</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Imprimir el código en el bloc de notas</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
-   <td><kbd>Cmd</kbd> + <kbd>P</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row">Mostrar sugerencias de autocompletado</th>
-   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mostrar documentación</span></span></th>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Space</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Space</kbd></td>
-   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Space</kbd></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="eyedropper">
-<h2 id="Selector_de_color_Gotero">Selector de color (Gotero)</h2>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th scope="row" style="width: 40%;">Comando</th>
-   <th scope="col">Windows</th>
-   <th scope="col">macOS</th>
-   <th scope="col">Linux</th>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Seleccionar el color actual</span></span></th>
-   <td><kbd>Enter</kbd></td>
-   <td><kbd>Return</kbd></td>
-   <td><kbd>Enter</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Salir del gotero</span></span></th>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-   <td><kbd>Esc</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse por 1 píxel</span></span></th>
-   <td><kbd>Arrow keys</kbd></td>
-   <td><kbd>Arrow keys</kbd></td>
-   <td><kbd>Arrow keys</kbd></td>
-  </tr>
-  <tr>
-   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse por 10 píxels</span></span></th>
-   <td><kbd>Shift</kbd> + <kbd>arrow keys</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>arrow keys</kbd></td>
-   <td><kbd>Shift</kbd> + <kbd>arrow keys</kbd></td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/tools/add-ons/index.html b/files/es/tools/add-ons/index.html
deleted file mode 100644
index 53b7924169..0000000000
--- a/files/es/tools/add-ons/index.html
+++ /dev/null
@@ -1,17 +0,0 @@
----
-title: Add-ons
-slug: Tools/Add-ons
-tags:
-  - NeedsTranslation
-  - TopicStub
-  - Web Development
-  - 'Web Development:Tools'
-translation_of: Tools/Add-ons
----
-<p>Developer tools that are not built into Firefox, but ship as separate add-ons.</p>
-
-<dl>
- <dt><a href="https://addons.mozilla.org/en-US/firefox/addon/websocket-monitor/">WebSocket Monitor</a></dt>
- <dd>Examine the data exchanged in a WebSocket connection.</dd>
- <dd> </dd>
-</dl>
diff --git a/files/es/tools/debugger/how_to/use_a_source_map/index.html b/files/es/tools/debugger/how_to/use_a_source_map/index.html
new file mode 100644
index 0000000000..d294c36ba8
--- /dev/null
+++ b/files/es/tools/debugger/how_to/use_a_source_map/index.html
@@ -0,0 +1,37 @@
+---
+title: Uso de un mapa fuente
+slug: Tools/Debugger/How_to/Use_a_source_map
+tags:
+  - Debug
+  - mapa fuente
+  - source map
+translation_of: Tools/Debugger/How_to/Use_a_source_map
+original_slug: Tools/Debugger/How_to/Uso_de_un_mapa_fuente
+---
+<div>{{ToolsSidebar}}</div>
+
+<p>Los fuentes JavaScript ejecutados por el explorador frecuentemente son transformados de alguna manera desde el original creado por el desarrollador. Por ejemplo:</p>
+
+<ul>
+ <li>los fuentes a menudo se combinan y minifican para hacer la transferencia desde el servidor más eficiente.</li>
+ <li>el código JavaScript que se ejecuta en una página a menudo es generado automáticamente. Como el compilado desde los lenguajes <a href="http://coffeescript.org/">CoffeeScript</a> o <a href="http://www.typescriptlang.org/">TypeScript</a>.</li>
+</ul>
+
+<p>En estas situaciones, es mucho más fácil depurar el código fuente en el estado original, que el fuente en el estado transformado que el navegador ha descargado. Un <a href="http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/">mapa fuente</a> es un fichero que mapea el código transformado hacia el estado original, permitiendo al navegador reconstruir el fuente original y presentar el código original en el debugger.</p>
+
+<p>Para habilitar al debugger trabajar con un mapa fuente, debes:</p>
+
+<ul>
+ <li>generar el mapa fuente</li>
+ <li>incluir un comentario en el fichero transformado, apuntando al mapa fuente. La sintaxis del comentario es la siguiente:</li>
+</ul>
+
+<pre class="brush: js"><code>//# sourceMappingURL=http://example.com/path/to/your/sourcemap.map</code></pre>
+
+<p>{{EmbedYouTube("Fqd15gHC4Pg")}}</p>
+
+<p>En el video anterior, cargamos <a href="https://mdn.github.io/devtools-examples/sourcemaps-in-console/index.html">https://mdn.github.io/devtools-examples/sourcemaps-in-console/index.html</a>. Esta página carga un fuente llamado "main.js" que fue originalmente escrito en CoffeeScript y compilado a JavaScript. El fuente compilado contiene un comentario como el siguiente, que apunta al mapa fuente:</p>
+
+<pre class="brush: js"><code>//# sourceMappingURL=main.js.map</code></pre>
+
+<p>En el <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_list_pane">panel de fuentes</a> del debugger, el fichero fuente original en CoffeeScript aparece ahora como "main.coffee", y podemos depurarlo como cualquier otro fichero fuente.</p>
diff --git a/files/es/tools/debugger/how_to/uso_de_un_mapa_fuente/index.html b/files/es/tools/debugger/how_to/uso_de_un_mapa_fuente/index.html
deleted file mode 100644
index 30e60902cd..0000000000
--- a/files/es/tools/debugger/how_to/uso_de_un_mapa_fuente/index.html
+++ /dev/null
@@ -1,36 +0,0 @@
----
-title: Uso de un mapa fuente
-slug: Tools/Debugger/How_to/Uso_de_un_mapa_fuente
-tags:
-  - Debug
-  - mapa fuente
-  - source map
-translation_of: Tools/Debugger/How_to/Use_a_source_map
----
-<div>{{ToolsSidebar}}</div>
-
-<p>Los fuentes JavaScript ejecutados por el explorador frecuentemente son transformados de alguna manera desde el original creado por el desarrollador. Por ejemplo:</p>
-
-<ul>
- <li>los fuentes a menudo se combinan y minifican para hacer la transferencia desde el servidor más eficiente.</li>
- <li>el código JavaScript que se ejecuta en una página a menudo es generado automáticamente. Como el compilado desde los lenguajes <a href="http://coffeescript.org/">CoffeeScript</a> o <a href="http://www.typescriptlang.org/">TypeScript</a>.</li>
-</ul>
-
-<p>En estas situaciones, es mucho más fácil depurar el código fuente en el estado original, que el fuente en el estado transformado que el navegador ha descargado. Un <a href="http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/">mapa fuente</a> es un fichero que mapea el código transformado hacia el estado original, permitiendo al navegador reconstruir el fuente original y presentar el código original en el debugger.</p>
-
-<p>Para habilitar al debugger trabajar con un mapa fuente, debes:</p>
-
-<ul>
- <li>generar el mapa fuente</li>
- <li>incluir un comentario en el fichero transformado, apuntando al mapa fuente. La sintaxis del comentario es la siguiente:</li>
-</ul>
-
-<pre class="brush: js"><code>//# sourceMappingURL=http://example.com/path/to/your/sourcemap.map</code></pre>
-
-<p>{{EmbedYouTube("Fqd15gHC4Pg")}}</p>
-
-<p>En el video anterior, cargamos <a href="https://mdn.github.io/devtools-examples/sourcemaps-in-console/index.html">https://mdn.github.io/devtools-examples/sourcemaps-in-console/index.html</a>. Esta página carga un fuente llamado "main.js" que fue originalmente escrito en CoffeeScript y compilado a JavaScript. El fuente compilado contiene un comentario como el siguiente, que apunta al mapa fuente:</p>
-
-<pre class="brush: js"><code>//# sourceMappingURL=main.js.map</code></pre>
-
-<p>En el <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_list_pane">panel de fuentes</a> del debugger, el fichero fuente original en CoffeeScript aparece ahora como "main.coffee", y podemos depurarlo como cualquier otro fichero fuente.</p>
diff --git a/files/es/tools/desempeño/index.html b/files/es/tools/desempeño/index.html
deleted file mode 100644
index 9dbf8e643d..0000000000
--- a/files/es/tools/desempeño/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: Rendimiento
-slug: Tools/Desempeño
-translation_of: Tools/Performance
----
-<p>La herramienta de Rendimiento te da una visión general de la capacidad de respuesta del sitio que visitas así como de su JavaScript y el modelo de diseño. Con esta herramienta puedes generar un perfil o registro de un sitio web en un período de tiempo. En dicho perfil la herramienta te ofrece una <a href="/en-US/docs/Tools/Performance/UI_Tour#Waterfall_overview">vista general</a> de todas las acciones que tu navegador empleó para generar el sitio web así como una gráfica con el <a href="/en-US/docs/Tools/Performance/Frame_rate">tiempo de respuesta</a> de dicha pagina.</p>
-
-<p>Para examinar con más detalle los aspectos del perfil tienes tres herramientas auxiliares:</p>
-
-<ul>
- <li><a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a>  muestra qué operaciones ejecutó el navegador, tales como el modelo de ejecución empleado, JavaScript, repaints y liberación de memoria.</li>
- <li><a href="/en-US/docs/Tools/Performance/Call_Tree">Call Tree</a> muestra en qué funciones de JavaScript se requirió más tiempo del navegador.</li>
- <li><a href="/en-US/docs/Tools/Performance/Flame_Chart">Flame Chart</a> muestra la pila de llamadas de JavaScript a lo largo de la grabación.</li>
-</ul>
-
-<p>{{EmbedYouTube("WBmttwfA_k8")}}</p>
-
-<hr>
-<h2 id="Preámbulo">Preámbulo</h2>
-
-<div class="column-container">
-<div class="column-half">
-<dl>
- <dt><a href="/en-US/docs/Tools/Performance/UI_Tour">UI Tour</a></dt>
- <dd>
- <p>Guía rápida de la interfaz para comenzar a manejar la herramienta de rendimiento.</p>
- </dd>
-</dl>
-</div>
-
-<div class="column-half">
-<dl>
- <dt><a href="/en-US/docs/Tools/Performance/How_to">How to</a></dt>
- <dd>Tareas básicas: abrir la herramienta, crear, guardar, cargar y configurar las grabaciones.</dd>
-</dl>
-</div>
-</div>
-
-<hr>
-<h2 id="Componentes_de_la_herramienta_de_Rendimiento">Componentes de la herramienta de Rendimiento</h2>
-
-<div class="column-container">
-<div class="column-half">
-<dl>
- <dt><a href="/en-US/docs/Tools/Performance/Frame_rate">Frame rate</a></dt>
- <dd>Comprender la capacidad de respuesta general de tu sitio.</dd>
- <dt><a href="/en-US/docs/Tools/Performance/Call_Tree">Call Tree</a></dt>
- <dd>Encontrar cuellos de botella en el JavaScript de tu sitio.</dd>
-</dl>
-</div>
-
-<div class="column-half">
-<dl>
- <dt><a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a></dt>
- <dd>Comprender el trabajo que el navegador realiza cuando un usuario interactúa con el sitio web.</dd>
- <dt><a href="/en-US/docs/Tools/Performance/Flame_Chart">Flame Chart</a></dt>
- <dd>Ver qué funciones de JavaScript se ejecutan , y cuando , en el transcurso de la grabación.</dd>
- <dd> </dd>
-</dl>
-</div>
-</div>
-
-<hr>
-<h2 id="Escenarios">Escenarios</h2>
-
-<div class="column-container">
-<div class="column-half">
-<dl>
- <dt><a href="/en-US/docs/Tools/Performance/Scenarios/Animating_CSS_properties">Animating CSS properties</a></dt>
- <dd>Utiliza Waterfall para entender cómo el navegador actualiza una página, y cómo las diferentes propiedades CSS pueden afectar al rendimiento.</dd>
- <dd> </dd>
-</dl>
-</div>
-
-<div class="column-half">
-<dl>
- <dt><a href="/en-US/docs/Tools/Performance/Scenarios/Intensive_JavaScript">Intensive JavaScript</a></dt>
- <dd>Utiliza la velocidad de los fotogramas y la herramienta Waterfall para resaltar los problemas de rendimiento provocados por los JavaScript de larga duración y cómo los workers pueden ayudar en esta situación.</dd>
-</dl>
-</div>
-</div>
-
-<p> </p>
-
-<div class="column-half">
-<dl>
- <dd> </dd>
-</dl>
-</div>
-
-<p> </p>
diff --git a/files/es/tools/desempeño/ui_tour/index.html b/files/es/tools/desempeño/ui_tour/index.html
deleted file mode 100644
index 8898abae03..0000000000
--- a/files/es/tools/desempeño/ui_tour/index.html
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: Paseo por la interfaz de usuario
-slug: Tools/Desempeño/UI_Tour
-translation_of: Tools/Performance/UI_Tour
----
-<p>La interfaz de usuario (UI) de las herramientas de rendimiento, consta de cuatro partes principales:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13220/perf-tool-pieces.png" style="display: block; height: 702px; margin-left: auto; margin-right: auto; width: 1616px;"></p>
-
-<ul>
- <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Toolbar">Barra de herramientas (Toolbar)</a></li>
- <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Recordings_pane">Lista de grabaciones (Recordings pane)</a></li>
- <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Recording_overview">Vista previa de la grabación (Recording overview)</a></li>
- <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Details_pane">Ventana de detalles (Details pane)</a>, que puede mostrar:
-  <ul>
-   <li><a href="/en-US/docs/Tools/Performance/Waterfall">Vista en cascada (Waterfall)</a></li>
-   <li><a href="/en-US/docs/Tools/Performance/Call_Tree">Árbol de llamadas (Call Tree)</a></li>
-   <li><a href="/en-US/docs/Tools/Performance/Flame_Chart">Gráfico de llama(Flame Chart)</a></li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Barra_de_herramientas_(Toolbar)">Barra de herramientas (Toolbar)</h2>
-
-<p>De izquierde a derecha la barra de herramientas contiene los siguientes botones:</p>
-
-<ul>
- <li>
-  <p>Borrar la lista de grabaciones.</p>
- </li>
-</ul>
-
-<div class="note">
-<p><em>Nota: Si haces esto, perderas cualquier grabación que no haya sido guardada.</em></p>
-</div>
-
-<ul>
- <li>Inicia o detiene una grabación.</li>
- <li>Importar una grabación previamente guardada.</li>
- <li>Filtra los <a href="/en-US/docs/Tools/Performance/Waterfall#Markers">marcadores</a> que muestra la vista en cascada.</li>
- <li>Cambia la vista activa en la <a href="/es/docs/Tools/Desempeño/UI_Tour#Details_pane">ventana de detalles</a>.</li>
- <li>Muestra un popup con la configuración.</li>
-</ul>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13222/perf-toolbar.png" style="display: block; height: 434px; margin-left: auto; margin-right: auto; width: 1672px;"></p>
-
-<h2 id="Lista_de_grabaciones_(Recordings_pane)">Lista de grabaciones (Recordings pane)</h2>
-
-<p>La lista de grabaciones muestra todas las grabaciones activas, incluyendo las realizadas durante la sesion y las que hayas importado.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10917/perf-recordings-pane.png" style="display: block; height: 337px; margin-left: auto; margin-right: auto; width: 300px;"></p>
-
-<p>En el hay una grabación seleccionada en todo momento y esta se mostrara en el resto de la herramienta. Para seleccionar una grabación diferente, presiónala en la lista del panel. Para guardarla como un archivo JSON haz click en "Guardar".</p>
-
-<h2 id="Vista_previa_de_la_grabacion_(Recording_overview)">Vista previa de la grabacion (Recording overview)</h2>
-
-<p>Muestra un resumen de toda la grabación, donde el eje-x representa el tiempo.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10919/perf-overview.png" style="display: block; height: 164px; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<p>Contiene dos elementos: una vista previa de la vista en cascada y gráfico con el promedio de fotogramas.</p>
-
-<h3 id="Resumen_de_la_vista_en_cascada">Resumen de la vista en cascada</h3>
-
-<p>Nos presenta una versión comprimida de la <a href="/en-US/docs/Tools/Performance/Waterfall">vista en cascada</a>:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10923/perf-waterfall-overview.png" style="display: block; height: 76px; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<p>Las operaciones grabadas están codificadas con el mismo <a href="/en-US/docs/Tools/Performance/Waterfall#Markers">esquema de colores empleado para la vista en cascada</a> que se muestra en la ventana de detalles.</p>
-
-<h3 id="Gráfico_con_el_promedio_de_fotogramas">Gráfico con el promedio de fotogramas</h3>
-
-<p>El promedio de fotogramas nos da una idea de como el navegador responde durante la grabación:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10921/perf-frame-rate.png" style="display: block; height: 88px; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<p>Puedes consultar la entrada sobre el <a href="/en-US/docs/Tools/Performance/Frame_rate">promedio de fotogramas</a>.</p>
-
-<h3 id="Relacionando_eventos">Relacionando eventos</h3>
-
-<p>Como estos eventos están sincronizados, <span>puedes crear una </span>correlación entre ellos.</p>
-
-<p>Por ejemplo en la captura de pantalla inferior, una larga operación de pintado (<a href="/en-US/docs/Tools/Performance/Waterfall#Markers">representada con una barra verde</a> en el resumen de la vista en cascada) corresponde con una caída en el promedio de fotogramas:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10925/perf-overview-correlation.png" style="display: block; height: 494px; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<h3 id="Ampliando">Ampliando</h3>
-
-<p>Puedes usar la vista previa para seleccionar un trozo de la grabación para examinarlo con mas detalle. Al hacer esto, la ventana de detalles se actualizara con el contenido marcado. En la captura inferior hemos seleccionado la caída en el promedio de fotogramas y así podemos ver la operación de pintado con mas detalle:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10927/perf-zoomed.png" style="display: block; height: 416px; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<h2 id="Ventana_de_detalles_(Details_pane)">Ventana de detalles (Details pane)</h2>
-
-<p>La ventana de detalles muestra cualquier herramienta seleccionada. Para cambiar entre ellas, usa los botones de la <a href="/en-US/docs/Tools/Performance/UI_Tour#Toolbar">barra de herramientas</a>.</p>
-
-<h3 id="Vista_en_cascada">Vista en cascada</h3>
-
-<p>La vista en cascada da una vision de que esta haciendo el navegador durante la grabación: ejecutar Javascript, actualizar CSS,  actualizar la composición de la pagina y el rendimiento del redibujado. El eje-x representa el tiempo y las operaciones grabadas van apareciendo en forma de cascada, reflejando así la naturaleza que tiene el navegador el ejecutar las tareas en serie.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10929/perf-waterfall.png" style="display: block; height: 568px; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<p>Para aprender mas sobre la <a href="/en-US/docs/Tools/Performance/Waterfall">vista en cascada</a> puedes visitar su entrada.</p>
-
-<h3 id="Árbol_de_llamadas">Árbol de llamadas</h3>
-
-<p>El árbol de llamadas es una muestra del Javascript que se ejecuta en la pagina. Son una serie de muestras del estado del motor de Javascript y registra el stack de código ejecutado en el momento que se toma la muestra. Estadísticamente, el numero de muestras tomadas al ejecutar una función especifica, corresponde con la cantidad de tiempo que el navegador ha empleado para ejecutarlo, así puedes identificar los cuellos de botella en tu código.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10949/perf-call-tree.png" style="display: block; height: 384px; margin-left: auto; margin-right: auto; width: 972px;"><br>
- Para aprender mas sobre el <a href="/en-US/docs/Tools/Performance/Call_Tree">árbol de llamadas</a> puedes visitar su entrada.</p>
-
-<h3 id="Gráfico_de_llama">Gráfico de llama</h3>
-
-<p>Si el árbol de llamadas te muestra estadísticamente que funciones de tu sitio gastan mas tiempo de ejecución durante la grabación, el gráfico de llama nos indica cualquier stack llamado durante la misma:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10933/perf-flame-chart.png" style="display: block; height: 504px; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<p>Para aprender mas sobre el <a href="/en-US/docs/Tools/Performance/Flame_Chart">gráfico de llama</a> puedes visitar su entrada.</p>
-
-<h3 id="Asignaciones">Asignaciones</h3>
-
-<div class="geckoVersionNote">
-<p>La vista de Asignaciones es nueva en Firefox 46.</p>
-</div>
-
-<p>La vista de Asignaciones es como el árbol de llamadas, pero para las asignaciones: Nos muestra que funciones en tu pagina tienen mas memoria asignada durante el transacurso de la grabación.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/12413/allocations-view-1.png" style="display: block; margin-left: auto; margin-right: auto; width: 972px;"></p>
-
-<p>La vista de Asignaciones solo aparece si haz seleccionado "Grabar Asignaciones" en las opciones de las herramientas de rendimiento antes de hacer una nueva grabación.</p>
-
-<p>{{EmbedYouTube("Le9tTo7bqts")}}</p>
-
-<p>Para aprender mas sobre las <a href="/en-US/docs/Tools/Performance/Allocations">Asignaciones</a> puedes visitar su entrada.</p>
diff --git a/files/es/tools/editor_audio_web/index.html b/files/es/tools/editor_audio_web/index.html
deleted file mode 100644
index 2db0cdbe58..0000000000
--- a/files/es/tools/editor_audio_web/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title: Editor de audio web
-slug: Tools/Editor_Audio_Web
-translation_of: Tools/Web_Audio_Editor
----
-<div class="geckoVersionNote">
- <p>El editor de audio web es nuevo en Firefox 32.</p>
-</div>
-<p>Con la <a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">API de Audio Web</a>, los desarrolladores crean un <a href="/en-US/docs/Web/API/AudioContext">contexto de audio</a>. Dentro de ese contexto construyen un número de  <a href="/en-US/docs/Web/API/AudioNode">nodos de audio</a>, incluyendo:</p>
-<ul>
- <li>nodos que proporcionan la <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_sources">fuente del audio</a>, como un oscilador o una fuente de buffer de datos</li>
- <li>nodos que realizan <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_effects_filters">transformaciones</a> como delay y ganancia</li>
- <li>nodos que representan el <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_destinations">destino del flujo de audio</a>, como los altavoces</li>
-</ul>
-<p>Cada nodo tiene cero o más propiedades <code><a href="/en-US/docs/Web/API/AudioParam">AudioParam</a></code> que configuran su operación. Por ejemplo, <code><a href="/en-US/docs/Web/API/GainNode">GainNode</a></code> tiene solamente la propiedad <code>gain</code>, mientras que <a href="/en-US/docs/Web/API/OscillatorNode"><code>OscillatorNode</code></a> tiene las propiedades <code>frequency</code> y <code>detune</code>.</p>
-<p>El desarrollador conecta los nodos en un gráfico y ese gráfico completo define el comportamiento del flujo de audio.</p>
-<p>El editor de audio web examina un contexto de audio construido en la página y proporciona una visualización de su gráfico. Esto da una vista de alto nivel de su operación y permite asegurar que todos los nodos están conectados de la forma esperada. Entonces se pueden examinar y editar las propiedades <code>AudioParam</code> para cada nodo del gráfico. Algunas propiedades no-<code>AudioParam</code>, como una propiedad <code>OscillatorNode</code>'s <code>type</code> son mostradas y también se pueden editar.</p>
-<p>Esta herramienta todavía es experimental. Si encuentra errores, nos encantaría que los <a class="external external-icon" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox&amp;component=Developer%20Tools%3A%20Web%20Audio%20Editor">informe en Bugzilla</a>. Si tiene alguna opinión o sugerencias para nuevas funcionalidades, <a href="http://ffdevtools.uservoice.com/forums/246087-firefox-developer-tools-ideas">ffdevtools.uservoice.com</a> o <a href="http://twitter.com/firefoxdevtools">Twitter</a> son lugares excelentes para registrarlas.</p>
-<h2 id="Abriendo_el_editor_de_audio_web">Abriendo el editor de audio web</h2>
-<p>El editor de audio web no está habilitado por defecto en Firefox 32. Para habilitarlo, abra la <a href="/es/docs/Tools/Tools_Toolbox#Configuraciones">Configuración de herramientas de desarrollador</a> y marque "Audio web". Ahora debería haber una pestaña extra en la <a href="/es/docs/Tools/Tools_Toolbox#Barra_de_herramientas">Barra de herramientas</a> llamada "Audio web". Haga clic en esa pestaña y cargue una página que construya un contexto de audio. Dos demos interesantes son:</p>
-<ul>
- <li><a href="https://github.com/mdn/voice-change-o-matic">Voice-change-O-Matic</a>, puede aplicar varios efectos a la entrada de micrófono y también muestra una visualización del resultado</li>
- <li><a href="http://mdn.github.io/violent-theremin/">Violent Theremin</a>, cambia el tono y el volumen de una onda sinusoidal al mover el puntero del mouse</li>
-</ul>
-<h2 id="Visualizando_el_gráfico">Visualizando el gráfico</h2>
-<p>El editor de audio web ahora mostrará el gráfico del contexto de audio cargado. Aquí está el gráfico del demo de Violent Theremin:</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/7941/web-audio-editor-graph.png" style="display: block; margin-left: auto; margin-right: auto;">Se puede ver que usa tres nodos: un <a href="/en-US/docs/Web/API/OscillatorNode"><code>OscillatorNode</code></a> como fuente, un <a href="/en-US/docs/Web/API/GainNode"><code>GainNode</code></a> para controlar el volumen y un <a href="/en-US/docs/Web/API/AudioDestinationNode"><code>AudioDestinationNode</code></a> como destino.</p>
-<h2 id="Inspeccionando_y_modificando_AudioNodes">Inspeccionando y modificando AudioNodes</h2>
-<p>Si hace clic en un nodo, se restalta y aparece un inspector del nodo en el lado derecho. Ahí se listan los valores de las propiedades del nodo <code>AudioParam</code>. Por ejemplo, así se ve el OscillatorNode:</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/7943/web-audio-editor-inspect-node.png" style="display: block; margin-left: auto; margin-right: auto;">Con el demo de Violent Theremin, el parámetro frecuencia es modificado cuando el usuario mueve el mouse hacia la izquierda o la derecha y eso se puede ver reflejado en el inspector del nodo. Sin embargo, el valor no es actualizado en tiempo real: hay que hacer clic en el nodo nuevamente para ver el valor actualizado.</p>
-<p>Si se hace clic en el valor en el inspector del nodo se puede modificar: presione Intro o Tab y el nuevo valor tiene efecto inmediatamente.</p>
diff --git a/files/es/tools/editor_estilo/index.html b/files/es/tools/editor_estilo/index.html
deleted file mode 100644
index cdfc54bebf..0000000000
--- a/files/es/tools/editor_estilo/index.html
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: Editor de Estilo
-slug: Tools/Editor_Estilo
-tags:
-  - CSS
-  - Desarrollo web
-  - Herramientas
-  - Herramientas de desarrollo web
-  - Hojas de estilo
-translation_of: Tools/Style_Editor
----
-<p>El editor de estilo te permite:</p>
-
-<ul>
- <li>ver y editar todas las hojas de estilo asociadas con una página</li>
- <li>crear nuevas hojas de estilo desde bosquejos y aplicarlas a una página</li>
- <li>importar hojas de estilo existentes y aplicarlas en la página</li>
-</ul>
-
-<p>{{EmbedYouTube("7839qc55r7o")}}</p>
-
-<p>Para abrir el Editor de Estilo selecciona la opción "Editor de Estilo" desde el menú "Web Developer" (este es un submenu del menú "Tools" o "Herramientas" en una Mac). El Toolbox o caja de herramientas aparecerá en la parte inferior de la ventana del navegador, con el Editor de Estilo activado:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/6941/style-editor.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<p>El Editor de Estilo está divivido en  dos secciones principales: el panel de estilos en la izquierda y el editor en la derecha.</p>
-
-<div class="geckoVersionNote">
-<p>From Firefox 33 onwards, there's a third component to the Style Editor: <a href="/en-US/docs/Tools/Style_Editor#The_media_sidebar">the media sidebar</a>.</p>
-</div>
-
-<h2 id="El_panel_de_hojas_de_estilo">El panel de hojas de estilo</h2>
-
-<p>El panel de hojas de estilo, en la izquierda, muestra todas las hojas de estilos que están siendo utilizadas por el documento actual.  You can quickly toggle the use of a given sheet on and off by clicking the eyeball icon to the left of the sheet's name. Puede guardar los cambios hechos en la hoja de estilos a su computador, haciendo clic en el botón Guardar en la esquina inferior derecha de cada hoja de estilos de la lista.</p>
-
-<h2 id="El_panel_de_edición">El panel de edición</h2>
-
-<p>A la derecha está el panel de edición. Aquí está disponible el código fuente de la hoja de estilo seleccionada, lista para ver y editar. Cualquier cambio que realice será aplicada inmediatamente. This makes it easy to experiment with, revise, and test changes. Una vez esté satisfecho con sus cambios, puede guardar una copia localmente, haciendo clic en el botón Guardar.</p>
-
-<p><span style="line-height: 1.5;">El editor contiene numeración de líneas y resaltamiento de código, haciendo más fácil la lectura de su CSS. También soporta </span><a href="/en-US/docs/Tools/Style_Editor#Source_editor_shortcuts" style="line-height: 1.5;">keyboard shortcuts</a><span style="line-height: 1.5;">.</span></p>
-
-<p>El Editor de Estilos automáticamente des-minimiza las hojas de estilo que detecta, sin afectar el original. Esto facilita mucho el trabajo en páginas que ya han sido optimizadas.</p>
-
-<p>El Editor de Estilos soporta autocompletado. Empiece escribiendo y el sistema le ofrecerá una lista de sugerencias.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/6943/style-editor-autocomplete.png" style="display: block; margin-left: auto; margin-right: auto;">Puede deshabilitar el autocompletado en <a href="/en-US/docs/Tools_Toolbox#Style_Editor">Style Editor settings</a>.</p>
-
-<h2 id="La_barra_lateral_media">La barra lateral "media"</h2>
-
-<p>A partir de Firefox 33 en adelante, el Editor de Estilos muestra una barra lateral a la derecha cuando se encuentra alguna regla @media (<a href="/en-US/docs/Web/Guide/CSS/Media_queries"><code>@media</code> rules</a>). La barra lateral muestra las reglas y provee un link a la línea donde se define dicha regla. Haga clic en un ítem para ir hacia la definición de esa regla en la hoja de estilo. El texto condicional de la regla estará en gris si el media query no aplica.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/8365/style-editor-media-sidebar-detail.png" style="display: block; margin-left: auto; margin-right: auto;">La barra lateral de medios funciona especialmente bien con <a href="https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_View">Responsive Design View</a> para crear y depurar diseños móviles :</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/8363/style-editor-media-sidebar.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h2 id="Creación_e_importación_de_hojas_de_estilo">Creación e importación de hojas de estilo</h2>
-
-<p>Se puede crear una nueva hoja de estilos haciendo click en el nuevo botón de la barra de herrramientas. A continuación puedes comenzar a introducir  CSS en el nuevo editor y ver como los nuevos estilos se aplican de forma inmediata ,al igual que los cambios en otras hojas.</p>
-
-<p>Se puede cargar una hoja de estilos desde el disco y aplicarlo a la página haciendo click en el boton de importar.</p>
-
-<h2 id="Soporte_de_mapa_fuente">Soporte de mapa fuente</h2>
-
-<p>{{EmbedYouTube("zu2eZbYtEUQ")}}</p>
-
-<p>Los desarrolladores web, con frecuencia crean archivos CSS  utilizando un preprocesador como  <a href="http://sass-lang.com/">Sass</a>, <a href="http://lesscss.org/">Less</a>, o <a href="http://learnboost.github.io/stylus/">Stylus</a>. Estas herramientas generan archivos CSS  procedentes de un sintasix mas rico y expresivo. Si haces esto, seras capaz de editar y  ver que el  CSS  generado no es tan util, porque el código que mantienes es el <span class="short_text" id="result_box" lang="es"><span>sintaxis</span> <span>preprocesado</span></span>, no el  CSS generado. Por lo que necesitarás editar el CSS generado, y después manualmente trabajar sobre como reaplicarlo a la fuente original.</p>
-
-<p>Mapas Fuente habilita para regresar desde el CSS generado a la síntasix original, entonces  se puede ver, y te permite editar archivos en la síntasix original. A partir de Firefox 29 en adelante, el editor de estilos puede interpretar mapas fuente de CSS .</p>
-
-<p>Esto significa que si utilizas, por ejemplo, Sass, el Editor de Estilos  mostrará,y permitirá editar,archivos Sass , en lugar del CSS que se ha generado desde ellos:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/6939/style-editor-sourcemap-820.png" style="display: block; margin-left: auto; margin-right: auto;">Para que esto funcione ,es necesario:</p>
-
-<ul>
- <li>utilizar un preprocesador CSS que interprete  <a href="https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit">Source Map Revision 3 proposal</a>. Actualmente esto significa <a href="http://sass-lang.com/">Sass 3.3.0 </a> o superior , o la <a href="http://roots.io/using-less-source-maps/">versión 1.5.0 de Less</a>. Otros preprocesadores están trabajando activamente en añadir soporte, o lo están considerando.</li>
- <li>actualmente el preprocesador da instrucciones para generar un mapa fuente, por ejemplo pasando el argumento <code>--sourcemap</code> a la herramienta de comando en linea de  Sass.</li>
-</ul>
-
-<h3 id="Visualización_de_las_fuentes_originales">Visualización de las fuentes originales</h3>
-
-<p>Ahora, si compruebas "mostrar fuentes originales" en los <a href="/en-US/docs/Tools_Toolbox#Style_Editor">ajustes del Editor de estilos</a>, el vínculo junto a las reglas  CSS en la <a href="/en-US/docs/Tools/Page_Inspector#Rules_view">Vista de Reglas</a> ,vincula con las fuentes originales en el Editor de Estilos.</p>
-
-<h3 id="Edición_de_las_fuentes_originales">Edición de las fuentes originales</h3>
-
-<p>Se pueden editar tambien las fuentes originales en el  Editor de estilos y ver el resultado aplicado a la página de inmediato. Para conseguir que esto funcione hay dos pasos adicionales.</p>
-
-<p>Primero, configura el preprocesador para que muestre la fuente original y automaticamente regenere el CSS cuando cambien las fuentes. Con Sass puedes hacer esto simplemente pasando la opción <code>--watch</code> :</p>
-
-<pre>sass index.scss:index.css --sourcemap --watch</pre>
-
-<p>A continuación, guarda la fuente original en el editor de estilos haciendo click en el botón   "Guardar" junto al archivo, y este se guardará sobre el archivo original.</p>
-
-<p>Ahora cuando hagas cambios en el archivo original en el  Editor de Estilos , el CSS se regenerará y podrás ver los cambios de forma inmediata.</p>
-
-<h2 id="Atajos_de_Teclado">Atajos de Teclado</h2>
-
-<h3 id="Atajos_del_editor_de_código_fuente">Atajos del editor de código fuente</h3>
-
-<p>{{ Page ("en-US/docs/tools/Keyboard_shortcuts", "source-editor") }}</p>
-
-<p>{{ languages( { "ja": "ja/Tools/Style_Editor"} ) }}</p>
diff --git a/files/es/tools/keyboard_shortcuts/index.html b/files/es/tools/keyboard_shortcuts/index.html
new file mode 100644
index 0000000000..25585d51be
--- /dev/null
+++ b/files/es/tools/keyboard_shortcuts/index.html
@@ -0,0 +1,1267 @@
+---
+title: Accesos directos
+slug: Tools/Keyboard_shortcuts
+tags:
+  - Herramientas
+  - l10n:priority
+translation_of: Tools/Keyboard_shortcuts
+original_slug: Tools/Accesos_directos
+---
+<div>{{ToolsSidebar}}</div>
+
+<p>Esta página muestra todos los accesos directos utilizados para las herramientas para desarrolladores de Firefox.</p>
+
+<p>La primera sección muestra el acceso directo para cada herramienta mientras que la segunda sección muestra los accesos directos aplicables sólo a las herramientas de desarrolladores. Por último hay una sección para cada herramienta, que lista todos los accesos directos que puedes usar dentro de la misma.</p>
+
+<p>Debido a que los accesos directos dependen de la ubicación, no están documentados en esta página.</p>
+
+<h2 id="Herramientas_de_apertura_y_cierre"><span class="tlid-translation translation" lang="es"><span title="">Herramientas de apertura y cierre</span></span></h2>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan en la ventana principal del navegador para abrir la herramienta especificada.</span> <span title="">Los mismos accesos directos funcionarán para cerrar las herramientas alojadas en la Caja de herramientas si la herramienta está activa.</span> <span title="">Para herramientas que se abren en una nueva ventana, como la consola del navegador, debe cerrar la ventana para cerrar la herramienta.</span></span></p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Abre la caja de herramientas (con la herramienta más reciente activada)</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>I</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Trae la caja de herramientas a primer plano (solo si está en una ventana separada y no en primer plano)</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Cierra la caja de herramientas (si está en una ventana separada y en primer plano)</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd> o <kbd>F12</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre la consola web <a href="#opening-closing-web-console-note"><strong><sup>1</sup></strong></a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>K</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el inspector de elementos</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el depurador <strong><sup><a href="#acceso_directo_depurador">2</a></sup></strong></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>S</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el editor de estilos</th>
+   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F7</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
+   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el perfilador</th>
+   <td><kbd>Shift</kbd> + <kbd>F5</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F5</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
+   <td><kbd>Shift</kbd> + <kbd>F5</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el monitor de red <a href="#opening-closing-network-monitor-note"><strong><sup>3</sup></strong></a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>E</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Despliega las herramientas de desarrollador</th>
+   <td><kbd>Shift</kbd> + <kbd>F2</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F2</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
+   <td><kbd>Shift</kbd> + <kbd>F2</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Despliega la vista de diseño adaptable</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>M</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>M</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>M</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre la consola del navegador <a href="#opening-closing-browser-console-note"><sup>4</sup></a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>J</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>J</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>J</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre la caja de herramientas del navegador</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd>I</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el bloc de notas</th>
+   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el WebIDE</th>
+   <td><kbd>Shift</kbd> + <kbd>F8</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F8</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F8</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el inspector de almacenamiento <a href="#disabled-tools-shortcut"><sup>5</sup></a></th>
+   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el depurador<strong><sup><a href="#acceso_directo_depurador"> 2</a></sup></strong></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>Z</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<p><a name="opening-closing-web-console-note">1. </a><span class="tlid-translation translation" lang="es"><span title="">A diferencia de otras herramientas alojadas en la caja de herramientas, este acceso directo tampoco cierra la Consola Web.</span> <span title="">En cambio, se centra en la línea de comandos de la consola web.</span> <span title="">Para cerrar la consola web, use el acceso directo de la caja de herramientas global de Ctrl + Shift + I (Cmd + Opt + I en una Mac).</span></span><a name="opening-closing-web-console-note"></a></p>
+
+<p><a id="acceso_directo_depurador" name="acceso_directo_depurador">2. <span class="tlid-translation translation" lang="es"><span title="">A partir de Firefox 66, este acceso directo ya no estará asociado con el depurador</span></span>. A partir de Firefox 71, la letra de este acceso directo pasará a ser la Z.</a></p>
+
+<p><a name="opening-closing-network-monitor-note">3. Antes de Firefox 55, el atajo de teclaro era </a><a name="opening-closing-network-monitor-note"><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Q</kbd> (<kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>Q</kbd> en Mac).</a></p>
+
+<p><a id="opening-closing-browser-console-note" name="opening-closing-browser-console-note">4. </a><span class="tlid-translation translation" lang="es"><span title="">Hasta Firefox 38, cuando la consola del navegador está oculta por una ventana normal de Firefox, la misma combinación de teclas cierra la consola del navegador.</span> <span title="">Desde Firefox 38 en adelante, si la consola del navegador está oculta por una ventana normal de Firefox, esta combinación de teclas vuelve a colocar la consola del navegador en la parte superior y se enfoca en ella.</span></span><a name="opening-closing-browser-console-note">.</a></p>
+
+<p><a href="/en-US/docs/Tools_Toolbox#Settings" name="disabled-tools-shortcut">5. </a><span class="tlid-translation translation" lang="es"><span title="">La herramienta está deshabilitada de forma predeterminada, por lo que el acceso directo no funcionará hasta que se habilite desde el Panel de configuración.</span></span></p>
+
+<h2 id="Caja_de_Herramientas">Caja de Herramientas</h2>
+
+<div id="toolbox-shortcuts">
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan siempre que la caja de herramientas esté abierta, sin importar qué herramienta esté activa.</span></span></p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Recorre las herramientas de izquierda a derecha</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>]</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>]</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>]</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Recorre las herramientas de derecha a izquierda</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>[</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>[</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>[</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alterna entre la herramienta activa y la configuración.</span></span></th>
+   <td><kbd>F1</kbd></td>
+   <td><kbd>F1</kbd></td>
+   <td><kbd>F1</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alterna caja de herramientas entre los 2 últimos modos de acoplamiento</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>D</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alterna consola dividida (excepto si la consola es la herramienta seleccionada actualmente)</span></span></th>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="all-toolbox-tools">
+<div class="text-wrap tlid-copy-target">
+<div class="result-shield-container tlid-copy-target"><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan en todas las herramientas alojadas en la caja de herramientas.</span></span></div>
+
+<div class="result-shield-container tlid-copy-target"></div>
+</div>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Incrementa el tamaño de la fuente</th>
+   <td><kbd>Ctrl</kbd> + <kbd> + </kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd> + </kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd> + </kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Decrementa el tamaño de la fuente</th>
+   <td><kbd>Ctrl</kbd> + <kbd>-</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>-</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>-</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Restaura el tamaño por defecto de la fuente</th>
+   <td><kbd>Ctrl</kbd> + <kbd>0</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>0</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>0</kbd></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Editor_de_código_fuente">Editor de código fuente</h2>
+
+<div id="source-editor">
+<p><span class="tlid-translation translation" lang="es"><span title="">Esta tabla enumera los accesos directos predeterminados para el editor de código fuente.</span></span></p>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">En la sección <a href="/en-US/docs/Tools/Settings#Editor_Preferences">Preferencias del editor</a> de la configuración de las herramientas del desarrollador, es posible optar por utilizar las combinaciones de teclas Vim, Emacs o Sublime Text en su lugar.</span></span></p>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Para seleccionarlos, visite </span></span><code>about:config</code><span class="tlid-translation translation" lang="es"><span title="">, seleccione la configuración </span></span><code>devtools.editor.keymap</code><span class="tlid-translation translation" lang="es"><span title=""> y asigne "vim" o "emacs", o "sublime" a esa configuración.</span> <span title="">Si hace esto, los enlaces seleccionados se usarán para todas las herramientas de desarrollador que usan el editor de origen.</span> <span title="">Debe volver a abrir el editor para que el cambio surta efecto.</span></span></p>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Desde Firefox 33 en adelante, la preferencia de vinculación de teclas se expone en la sección <a href="/en-US/docs/Tools/Settings#Editor_Preferences">Preferencias del editor</a> de la configuración de las herramientas del desarrollador, y puede configurarla allí en lugar de en </span></span><code>about:config</code><span class="tlid-translation translation" lang="es"><span title="">.</span></span></p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Ir a la linea</th>
+   <td><kbd>Ctrl</kbd> + <kbd>J</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>J</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>J</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Buscar en la página</th>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Volver a buscar en la página</th>
+   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>G</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Seleccionar todo</th>
+   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>A</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Cortar</th>
+   <td><kbd>Ctrl</kbd> + <kbd>X</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>X</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>X</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Copiar</th>
+   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Pegar</th>
+   <td><kbd>Ctrl</kbd> + <kbd>V</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>V</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>V</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Desacer</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Z</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Rehacer</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Cmd</kbd> + <kbd>Y</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Identar</th>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Quitar identado o sangría</th>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mover línea(s) hacia arriba</span></span></th>
+   <td><kbd>Alt</kbd> + <kbd>Up</kbd></td>
+   <td><kbd>Alt</kbd> + <kbd>Up</kbd></td>
+   <td><kbd>Alt</kbd> + <kbd>Up</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mover línea (s) hacia abajo</span></span></th>
+   <td><kbd>Alt</kbd> + <kbd>Down</kbd></td>
+   <td><kbd>Alt</kbd> + <kbd>Down</kbd></td>
+   <td><kbd>Alt</kbd> + <kbd>Down</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Comentar/Decomentar linea(s)</th>
+   <td><kbd>Ctrl</kbd> + <kbd>/</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>/</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>/</kbd></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Inspector_de_páginas">Inspector de páginas</h2>
+
+<div id="page-inspector">
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Abre el inspector</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Selector_de_nodos"><span class="tlid-translation translation" lang="es"><span title="">Selector de nodos</span></span></h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan mientras el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Select_an_element#With_the_node_picker">selector de nodos</a> está activo.</span></span></p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Seleccione el elemento debajo del mouse y cancela el modo selector</span></span></th>
+   <td><kbd>Click</kbd></td>
+   <td><kbd>Click</kbd></td>
+   <td><kbd>Click</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Seleccione el elemento debajo del mouse y permanece en modo selector</span></span></th>
+   <td><kbd>Shift</kbd>+<kbd>Click</kbd></td>
+   <td><kbd>Shift</kbd>+<kbd>Click</kbd></td>
+   <td><kbd>Shift</kbd>+<kbd>Click</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Panel_HTML"><span class="tlid-translation translation" lang="es"><span title="">Panel HTML</span></span></h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos accesos directos funcionan mientras se esté en el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML">panel HTML del Inspector</a>.</span></span></p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Elimina el nodo seleccionado</th>
+   <td><kbd>Delete</kbd></td>
+   <td><kbd>Delete</kbd></td>
+   <td><kbd>Delete</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Deshace el borrado de un nodo</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Z</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Z</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Rehace el borrado de un nodo</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Cmd</kbd> + <kbd>Y</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Z</kbd> / <kbd>Ctrl</kbd> + <kbd>Y</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al siguiente nodo (solo nodos expandidos)</span></span></th>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Moverse al nodo anterior</th>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Moverse al primer nodo del arbol</th>
+   <td><kbd>Home</kbd></td>
+   <td><kbd>Home</kbd></td>
+   <td><kbd>Home</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Moverse al últiimo nodo del arbol</th>
+   <td><kbd>End</kbd></td>
+   <td><kbd>End</kbd></td>
+   <td><kbd>End</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Expandir el nodo seleccionado actualmente</span></span></th>
+   <td><kbd>Right arrow</kbd></td>
+   <td><kbd>Right arrow</kbd></td>
+   <td><kbd>Right arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Contraer el nodo seleccionado actualmente</span></span></th>
+   <td><kbd>Left arrow</kbd></td>
+   <td><kbd>Left arrow</kbd></td>
+   <td><kbd>Left arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">(Cuando se selecciona un nodo) moverse dentro del nodo para que pueda comenzar a recorrer los atributos.</span></span></th>
+   <td><kbd>Enter</kbd></td>
+   <td><kbd>Return</kbd></td>
+   <td><kbd>Enter</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avanza por los atributos de un nodo</span></span></th>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Retrocede a través de los atributos de un nodo</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">(Cuando se selecciona un atributo) comienza a editar el atributo</span></span></th>
+   <td><kbd>Enter</kbd></td>
+   <td><kbd>Return</kbd></td>
+   <td><kbd>Enter</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Oculta / muestra el nodo seleccionado</span></span></th>
+   <td><kbd>H</kbd></td>
+   <td><kbd>H</kbd></td>
+   <td><kbd>H</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Se centra en el cuadro de búsqueda en el panel HTML</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Editar como HTML</span></span></th>
+   <td><kbd>F2</kbd></td>
+   <td><kbd>F2</kbd></td>
+   <td><kbd>F2</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Deja de editar como HTML</span></span></th>
+   <td><kbd>F2</kbd> / <kbd>Ctrl</kbd> +<kbd>Enter</kbd></td>
+   <td><kbd>F2</kbd> / <kbd>Cmd</kbd> + <kbd>Return</kbd></td>
+   <td><kbd>F2</kbd> / <kbd>Ctrl</kbd> + <kbd>Enter</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Copia el HTML externo del nodo seleccionado</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>C</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>C</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazar el nodo seleccionado a la vista</span></span></th>
+   <td><kbd>S</kbd></td>
+   <td><kbd>S</kbd></td>
+   <td><kbd>S</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra la siguiente coincidencia en el marcado, cuando la búsqueda está activa</span></span></th>
+   <td><kbd>Enter</kbd></td>
+   <td><kbd>Return</kbd></td>
+   <td><kbd>Enter</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra la coincidencia anterior en el marcado, cuando la búsqueda está activa</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Return</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Barra_de_rutas_de_exploración_o_migas_de_pan">Barra de rutas de exploración o migas de pan</h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos funcionan cuando la <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#HTML_breadcrumbs">barra de rutas de exploración</a> está enfocada.</span></span></p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al elemento anterior en la barra</span></span></th>
+   <td><kbd>Left arrow</kbd></td>
+   <td><kbd>Left arrow</kbd></td>
+   <td><kbd>Left arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al siguiente elemento en la barra</span></span></th>
+   <td><kbd>Right arrow</kbd></td>
+   <td><kbd>Right arrow</kbd></td>
+   <td><kbd>Right arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Enfoca el </span></span> <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#HTML_pane">panel HTML</a></th>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Enfoca el</span></span> <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#CSS_pane">panel CSS</a></th>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Panel_CSS">Panel CSS</h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos funcionan cuando estás en el</span></span> <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS" title="/en-US/docs/Tools/Page_Inspector#CSS_pane">Inspector del panel CSS</a>.</p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Se centra en el cuadro de búsqueda del panel CSS</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Borrar el contenido del cuadro de búsqueda (solo cuando el cuadro de búsqueda está enfocado y se ha ingresado contenido)</span></span></th>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avanza a través de propiedades y valores del panel</span></span></th>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Retroceda a través de propiedades y valores del panel</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Comienza a editar la propiedad o el valor (Vista de reglas solamente, cuando se selecciona una propiedad o valor, pero aún no se está editando)</span></span></th>
+   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
+   <td><kbd>Return</kbd> or <kbd>Space</kbd></td>
+   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Se desplaza hacia arriba y hacia abajo a través de sugerencias de autocompletar (sólo vista de Reglas, cuando se edita una propiedad o valor)</span></span></th>
+   <td><kbd>Up arrow</kbd> , <kbd>Down arrow</kbd></td>
+   <td><kbd>Up arrow</kbd> , <kbd>Down arrow</kbd></td>
+   <td><kbd>Up arrow</kbd> , <kbd>Down arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Elige la sugerencia actual de autocompletar (sólo vista de reglas, cuando se edita una propiedad o valor)</span></span></th>
+   <td><kbd>Enter</kbd> or <kbd>Tab</kbd></td>
+   <td><kbd>Return</kbd> or <kbd>Tab</kbd></td>
+   <td><kbd>Enter</kbd> or <kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 1</span></span></th>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reducir el valor seleccionado en 1</span></span></th>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 100</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Page Up</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Page Up</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Page Up</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Decrementar el valor seleccionado en 100</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Page Down</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Page Down</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Page Down</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 10</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Up arrow</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Up arrow</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Up arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reducir el valor seleccionado en 10</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Down arrow</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Down arrow</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Down arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Incrementar el valor seleccionado en 0.1</span></span></th>
+   <td><kbd>Alt</kbd> + <kbd>Up arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Up arrow</kbd> from Firefox 60 onwards.)</td>
+   <td><kbd>Alt</kbd> + <kbd>Up arrow</kbd></td>
+   <td><kbd>Alt</kbd> + <kbd>Up arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Up arrow</kbd> from Firefox 60 onwards.)</td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reducir el valor seleccionado en 0.1</span></span></th>
+   <td><kbd>Alt</kbd> + <kbd>Down arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Down arrow</kbd> from Firefox 60 onwards).</td>
+   <td><kbd>Alt</kbd> + <kbd>Down arrow</kbd></td>
+   <td><kbd>Alt</kbd> + <kbd>Down arrow</kbd> (<kbd>Ctrl</kbd> + <kbd>Down arrow</kbd> from Firefox 60 onwards).</td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mostrar / ocultar más información sobre la propiedad actual (sólo vista calculada, cuando se selecciona una propiedad)</span></span></th>
+   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
+   <td><kbd>Return</kbd> or <kbd>Space</kbd></td>
+   <td><kbd>Enter</kbd> or <kbd>Space</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Abrir la página de referencia de MDN sobre la propiedad actual (solo vista calculada, cuando se selecciona una propiedad)</span></span></th>
+   <td><kbd>F1</kbd></td>
+   <td><kbd>F1</kbd></td>
+   <td><kbd>F1</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Abra el archivo CSS actual en el Editor de estilos (solo vista calculada, donde se muestra más información para una propiedad y se enfoca una referencia de archivo CSS).</span></span></th>
+   <td><kbd>Enter</kbd></td>
+   <td><kbd>Return</kbd></td>
+   <td><kbd>Enter</kbd></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Depurador">Depurador</h2>
+
+<div id="debugger">
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Cerrar archivo</th>
+   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>W</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar texto en el archivo actual</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar texto en todos los archivos</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra el siguiente en el archivo actual</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>G</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>G</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar cadenas por nombre</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>P</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reanudar la ejecución en un punto de interrupción</span></span></th>
+   <td><kbd>F8</kbd></td>
+   <td><kbd>F8</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
+   <td><kbd>F8</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Siguiente</th>
+   <td><kbd>F10</kbd></td>
+   <td><kbd>F10</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
+   <td><kbd>F10</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Anterior</th>
+   <td><kbd>F11</kbd></td>
+   <td><kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
+   <td><kbd>F11</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Salir</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
+   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Alternar punto de interrupción en la línea seleccionada actualmente</th>
+   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Alternar punto de interrupción condicional en la línea seleccionada actualmente</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<p><a name="mac-function-key-note">1. </a><span class="tlid-translation translation" lang="es"><span title="">De manera predeterminada, en algunos Mac, la tecla de función se reasigna para usar una función especial: por ejemplo, para cambiar el brillo de la pantalla o el volumen.</span> <span title="">Consulte esta <a href="http://support.apple.com/kb/HT3399">guía para usar estas teclas como teclas de función estándar</a>.</span> <span title="">Para usar una tecla reasignada como una tecla de función estándar, mantenga presionada la tecla Función también (para abrir el Profiler, use </span></span><kbd>Shift</kbd> + <kbd>Function</kbd> + <kbd>F5</kbd><span class="tlid-translation translation" lang="es"><span title="">)</span></span><a name="mac-function-key-note"></a>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> <span class="tlid-translation translation" lang="es"><span title="">Antes de Firefox 66, la combinación </span></span> <kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd> <span class="tlid-translation translation" lang="es"><span title=""> en Windows y Linux o </span></span><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>S</kbd><span class="tlid-translation translation" lang="es"><span title=""> en macOS abriría / cerraría el depurador.</span> <span title="">Desde Firefox 66 y versiones posteriores, este ya no es el caso</span></span>.</p>
+</div>
+</div>
+
+<h2 id="Depurador_Antes_de_Firefox_52">Depurador (Antes de Firefox 52)</h2>
+
+<div id="old-debugger">
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Command</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Abrir el depurador</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>S</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>S</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar una cadena en el archivo actual</span></span> usando el <a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra el siguiente en el archivo actual</span></span></th>
+   <td><kbd>Enter</kbd> / <kbd>Up arrow</kbd></td>
+   <td><kbd>Return</kbd> / <kbd>Up arrow</kbd></td>
+   <td><kbd>Enter</kbd> / <kbd>Up arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Encuentra el anterior en el archivo actual</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Enter</kbd> / <kbd>Down arrow</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Return</kbd> / <kbd>Down arrow</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Enter</kbd> / <kbd>Down arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar en todas las fuentes usando el </span></span><a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar cadenas por nombre</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>P</kbd> / <kbd>Ctrl</kbd> + <kbd>O</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>P</kbd> / <kbd>Ctrl</kbd> + <kbd>O</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>P</kbd> / <kbd>Ctrl</kbd> + <kbd>O</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar definiciones de funciones</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>D</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>D</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>D</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Filtrar variables cuando la ejecución está en pausa</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>V</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>V</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>V</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Reanudar la ejecución en un punto de interrupción</span></span></th>
+   <td><kbd>F8</kbd></td>
+   <td><kbd>F8</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
+   <td><kbd>F8</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Siguiente</th>
+   <td><kbd>F10</kbd></td>
+   <td><kbd>F10</kbd> <a href="#mac-function-key-note" title="#mac-function-key-note"><sup>1</sup></a></td>
+   <td><kbd>F10</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Anterior</th>
+   <td><kbd>F11</kbd></td>
+   <td><kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
+   <td><kbd>F11</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Salir</th>
+   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F11</kbd> <sup><a href="#mac-function-key-note" title="#mac-function-key-note">1</a></sup></td>
+   <td><kbd>Shift</kbd> + <kbd>F11</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alternar punto de interrupción en la línea seleccionada </span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>B</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Alternar punto de interrupción condicional en la línea seleccionada</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>B</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Agregar texto seleccionado a las expresiones de Watch</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>E</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Ir a la linea usando el <a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>L</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Buscar usando el <a href="/en-US/docs/Tools/Debugger/How_to/Search_and_filter" title="/en-US/docs/Tools/Debugger/How_to/Search_and_filter">script filter</a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>O</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">En el <a href="/en-US/docs/Tools/Debugger/UI_Tour#Source_pane">panel de código fuente</a>, salta a la definición de la función</th>
+   <td><kbd>Ctrl</kbd> + click</td>
+   <td><kbd>Cmd</kbd> + click</td>
+   <td><kbd>Ctrl</kbd> + click</td>
+  </tr>
+ </tbody>
+</table>
+
+<p><a name="mac-function-key-note">1. </a><span class="tlid-translation translation" lang="es"><span title="">De manera predeterminada, en algunos Mac, la tecla de función se reasigna para usar una función especial: por ejemplo, para cambiar el brillo de la pantalla o el volumen.</span> <span title="">Consulte esta <a href="http://support.apple.com/kb/HT3399">guía para usar estas teclas como teclas de función estándar</a>.</span> <span title="">Para usar una tecla reasignada como una tecla de función estándar, mantenga presionada la tecla Función también (para abrir el Profiler, use </span></span><kbd>Shift</kbd> + <kbd>Function</kbd> + <kbd>F5</kbd><span class="tlid-translation translation" lang="es"><span title="">)</span></span><a name="mac-function-key-note"></a></p>
+</div>
+
+<h2 id="Consola_web">Consola web</h2>
+
+<div id="web-console">
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comandos</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Abre la consola web</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>K</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Buscar en el panel de visualización de mensajes</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>F</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>F</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abre el <a href="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties" title="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties">panel inspector de objetos</a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Click</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Click</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Click</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Limpia el <a href="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties" title="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties">panel inspector de objetos</a></th>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Centrarse en la línea de comando</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Opt</kbd> + <kbd>K</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Limpiar salida</th>
+   <td>
+    <p><kbd>Ctrl</kbd> + <kbd>L</kbd></p>
+
+    <p>From Firefox 44:</p>
+
+    <p><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>L</kbd></p>
+   </td>
+   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
+   <td>
+    <p><kbd>Ctrl</kbd> + <kbd>L</kbd></p>
+
+    <p>From Firefox 44:</p>
+
+    <p><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>L</kbd></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Interprete_de_línea_de_comandos">Interprete de línea de comandos</h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos se aplican cuando estás en el</span></span> <a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter">Interprete de línea de comandos.</a></p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse hasta el inicio de la salida de la consola (solo si la línea de comando está vacía)</span></span></th>
+   <td><kbd>Home</kbd></td>
+   <td><kbd>Home</kbd></td>
+   <td><kbd>Home</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse hasta el final de la salida de la consola (solo si la línea de comando está vacía)</span></span></th>
+   <td><kbd>End</kbd></td>
+   <td><kbd>End</kbd></td>
+   <td><kbd>End</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avanzar página a través de la salida de la consola</span></span></th>
+   <td><kbd>Page up</kbd></td>
+   <td><kbd>Page up</kbd></td>
+   <td><kbd>Page up</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Retroceder una página a través de la salida de la consola</span></span></th>
+   <td><kbd>Page down</kbd></td>
+   <td><kbd>Page down</kbd></td>
+   <td><kbd>Page down</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir hacia atrás a través del </span></span><a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history">historial de comandos</a></th>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir hacia delante a través del </span></span><a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Command_history">historial de comandos</a></th>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Inicie la búsqueda inversa a través del historial de comandos / retroceda a través de comandos coincidentes</span></span></th>
+   <td><kbd>F9</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>R</kbd></td>
+   <td><kbd>F9</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Avance por el historial de comandos coincidentes (después de iniciar la búsqueda inversa)</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>S</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F9</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al principio de la línea</span></span></th>
+   <td><kbd>Home</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>A</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse al final de la línea</span></span></th>
+   <td><kbd>End</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Ejecutar la expresión actual</th>
+   <td><kbd>Enter</kbd></td>
+   <td><kbd>Return</kbd></td>
+   <td><kbd>Enter</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Agregar una nueva línea (para ingresar expresiones de varias líneas)</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Return</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>Enter</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ventana_emergente_de_autocompletado">Ventana emergente de autocompletado</h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Estos atajos se aplican mientras</span></span> la <a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Autocomplete" title="/en-US/docs/Tools/Web_Console/The_command_line_interpreter#Autocomplete">ventana emergente de autocompletado</a> está desplegada:</p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Elija la sugerencia actual de autocompletado</span></span></th>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+   <td><kbd>Tab</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Cancelar la ventana emergente de autocompletado</span></span></th>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir a la sugerencia de autocompletado anterior</span></span></th>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+   <td><kbd>Up arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Ir a la siguiente sugerencia de autocompletado</span></span></th>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+   <td><kbd>Down arrow</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Página arriba a través de sugerencias de autocompletado</span></span></th>
+   <td><kbd>Page up</kbd></td>
+   <td><kbd>Page up</kbd></td>
+   <td><kbd>Page up</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Página abajo a través de sugerencias de autocompletado</span></span></th>
+   <td><kbd>Page down</kbd></td>
+   <td><kbd>Page down</kbd></td>
+   <td><kbd>Page down</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse al principio de  las sugerencias de autocompletado</span></span></th>
+   <td><kbd>Home</kbd></td>
+   <td><kbd>Home</kbd></td>
+   <td><kbd>Home</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Desplazarse hasta el final de las sugerencias de autocompletado</span></span></th>
+   <td><kbd>End</kbd></td>
+   <td><kbd>End</kbd></td>
+   <td><kbd>End</kbd></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Editor_de_Estilo">Editor de Estilo</h2>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Abrir el editor de estilo</th>
+   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F7</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abrir una ventana emergente de autocompletado</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Space</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<div id="scratchpad">
+<h2 id="Bloc_de_Notas">Bloc de Notas</h2>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row">Abrir el bloc de notas</th>
+   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>F4</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Ejecutar el código del bloc de notas</th>
+   <td><kbd>Ctrl</kbd> + <kbd>R</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>R</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>R</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Ejecutar el código del bloc de notas y mostrar el resultado en el <a href="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties" title="/en-US/docs/Tools/Web_Console/Rich_output#Examining_object_properties">inspector de objetos</a></th>
+   <td><kbd>Ctrl</kbd> + <kbd>I</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>I</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>I</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Ejecutar el código del bloc de notas e insertar el resultado como un comentario</th>
+   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>L</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>L</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Reevaluar la función actual</th>
+   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>E</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>E</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Recargar la página actual y ejecutar el código del bloc de nota</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>R</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Guardar el código del bloc de notas</th>
+   <td><kbd>Ctrl</kbd> + <kbd>S</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>S</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>S</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Abrir un código existente</th>
+   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>O</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>O</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Crear una nueva página del bloc de notas</th>
+   <td><kbd>Ctrl</kbd> + <kbd>N</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>N</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>N</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Cerrar el bloc de notas</th>
+   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>W</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>W</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Imprimir el código en el bloc de notas</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
+   <td><kbd>Cmd</kbd> + <kbd>P</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>P</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row">Mostrar sugerencias de autocompletado</th>
+   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Space</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Mostrar documentación</span></span></th>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Space</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Space</kbd></td>
+   <td><kbd>Ctrl</kbd> + <kbd>Shift</kbd> + <kbd>Space</kbd></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="eyedropper">
+<h2 id="Selector_de_color_Gotero">Selector de color (Gotero)</h2>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th scope="row" style="width: 40%;">Comando</th>
+   <th scope="col">Windows</th>
+   <th scope="col">macOS</th>
+   <th scope="col">Linux</th>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Seleccionar el color actual</span></span></th>
+   <td><kbd>Enter</kbd></td>
+   <td><kbd>Return</kbd></td>
+   <td><kbd>Enter</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Salir del gotero</span></span></th>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+   <td><kbd>Esc</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse por 1 píxel</span></span></th>
+   <td><kbd>Arrow keys</kbd></td>
+   <td><kbd>Arrow keys</kbd></td>
+   <td><kbd>Arrow keys</kbd></td>
+  </tr>
+  <tr>
+   <th scope="row"><span class="tlid-translation translation" lang="es"><span title="">Moverse por 10 píxels</span></span></th>
+   <td><kbd>Shift</kbd> + <kbd>arrow keys</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>arrow keys</kbd></td>
+   <td><kbd>Shift</kbd> + <kbd>arrow keys</kbd></td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/tools/monitor_de_red/index.html b/files/es/tools/monitor_de_red/index.html
deleted file mode 100644
index f50f1ee0fc..0000000000
--- a/files/es/tools/monitor_de_red/index.html
+++ /dev/null
@@ -1,189 +0,0 @@
----
-title: Monitor de Red
-slug: Tools/Monitor_de_Red
-tags:
-  - Debugging
-  - Firefox
-  - Guía
-  - Herramientas
-  - Herramientas de Desarrollador
-  - Redes
-translation_of: Tools/Network_Monitor
----
-<p>El monitor de red muestra todas las solicitudes de red que Firefox realiza (por ejemplo, cuando carga una página, o debido a <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequests</a>), cuanto tiempo toma cada petición, y los detalles de cada petición. Para abrir el monitor seleccione "Red" del menu "Desarrollador Web"  (el cual es un Submenú del Menú "Herramientas" en Mac), o abra Herramientas de Desarrollador Web y seleccione la solapa "Red".</p>
-
-<p>El monitor de red aparecerá al final de la ventana de navegación. Recargue la página para ver las solicitudes:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7405/nm-overview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h2 id="Lista_de_Solicitudes_de_Red">Lista de Solicitudes de Red</h2>
-
-<p>Por defecto, el Monitor de Red muestra una lista de todas las solicitudes de red hechas durante la carga de una página. Cada solicitud es mostrada en su propia linea:<br>
- <img alt="" src="https://mdn.mozillademos.org/files/7419/nm-row.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<p>Por defecto, el Monitor de Red se limpia cada vez que ud. navega a una nueva página o recarga la página actual. Desde Firefox 31 en adelante se puede cambiar este comportamiento selecccionando "Habilitar Registros Persistentes" en las Opciones de <a href="https://developer.mozilla.org/en-US/docs/Tools_Toolbox#Common_preferences">Herramientas</a>.</p>
-
-<h3 id="Area_de_Solicitudes_de_Red">Area de Solicitudes de Red</h3>
-
-<p>Cada fila muestra:</p>
-
-<ul>
- <li><strong>√</strong>: El código HTTP retornado. Este es mostrado por un ícono a colores: Verde para correcto (Códigos 2XX ), naranja para redirección (3XX), o rojo para errores (4XX and 5XX). Desde Firefox 30 en adelante, el código exacto es mostrado inmediatamente después del ícono.</li>
- <li><strong>Método</strong>: El método de Solicitud HTTP</li>
- <li><strong>Archivo</strong>: Nombre base del archivo solicitado.</li>
- <li><strong>Dominio</strong>: Dominio del path solicitado.</li>
- <li><strong>Tipo</strong>: <code>Content-type</code> de la respuesta</li>
- <li><strong>Tamaño</strong>: Tamaño de la respuesta</li>
-</ul>
-
-<p>La barra de herramientas en la parte superior etiqueta estas columnas, y hacer click en las etiquetas ordena todas las solicitudes por esa columna.</p>
-
-<p>Desde Firefox 30 en adelante, si el archivo es una imagen, la fila incluye una miniatura de la imagen, y pasar por arriba del nombre del archivo muestra un preview en un tooltip:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7403/nm-image-preview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h3 id="Linea_de_Tiempo">Linea de Tiempo</h3>
-
-<p>La lista de solicitudes también muestra una linea de tiempo para las diferentes partes de cada solicitud. Cada linea de tiempo es dada en posición horizontal en su fila relativa a las otras solicitudes de red, de manera que ud. pueda ver el tiempo total que tomó cargar la página. Para más detalles sobre los códigos de color usados aqui, vea la sección en la página <a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor#Timings">Tiempos</a>.</p>
-
-<h3 id="Filtrando_por_tipo_de_Contenido">Filtrando por tipo de Contenido</h3>
-
-<p>Al final de la ventana una fila de botones le permite a ud. filtrar las solicitudes por el tipo de contenido de la respuesta:<img alt="" src="https://mdn.mozillademos.org/files/7395/nm-filter-by-type.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<p>En el extremo derecho de esta fila hay un botón llamado "Limpiar": como ud. podrá adivinar, esto le permite limpiar la lista de solicitudes de red.</p>
-
-<h3 id="Menu_Contextual">Menu Contextual</h3>
-
-<p>Haciendo click en una fila de la lista muestra un menú contextual con las siguientes opciones:</p>
-
-<ul>
- <li>Abrir en nueva pestaña</li>
- <li>Copiar URL</li>
- <li>Copiar como cURL (solo desde Firefox 31 en adelante)</li>
- <li>Copiar imagen como Data URI (solo para imágenes)</li>
- <li>Editar y Reenviar</li>
- <li>Comenzar <a href="/en-US/docs/Tools/Network_Monitor#Performance_analysis">Análisis de Performance</a> para la página</li>
-</ul>
-
-<h4 id="Editar_y_Reenviar">Editar y Reenviar</h4>
-
-<p>Esta opción abre un editor que le permite editar el método de Solicitud, URL, parámetros, y cabeceras, y reenviar la solicitud.</p>
-
-<h4 id="Copiar_como_cURL">Copiar como cURL</h4>
-
-<div class="geckoVersionNote">
-<p>Esta característica es nueva en Firefox 31.</p>
-</div>
-
-<p>Esta opción copia la solicitud de red al portapapeles como un comando <a href="http://curl.haxx.se/">cURL</a>, de manera que ud. pueda ejectutarlo desde una línea de comandos. El comando puede incluir las siguientes opciones:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><code>-X [METODO]</code></td>
-   <td>Si el método no es GET o POST</td>
-  </tr>
-  <tr>
-   <td><code>--data</code></td>
-   <td>Para parámetros de solicitud URL encodeados</td>
-  </tr>
-  <tr>
-   <td><code>--data-binary</code></td>
-   <td>Para parámetros de solicitud multiparte</td>
-  </tr>
-  <tr>
-   <td><code>--http/VERSION</code></td>
-   <td>Si la versión de HTTP no es 1.1</td>
-  </tr>
-  <tr>
-   <td><code>-I</code></td>
-   <td>Si el método no es HEAD</td>
-  </tr>
-  <tr>
-   <td><code>-H</code></td>
-   <td>
-    <p>Uno para cada encabezado de solicitud.</p>
-
-    <p>Deesde Firefox 34, si el encabezado "Accept-Encoding" está presente, el comando cURL incluirá <code>--compressed</code> en vez de  <code>-H "Accept-Encoding: gzip, deflate"</code>.  Esto significa que la respuesta será automáticamente descomprimida.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Detalles_de_Solicitud_de_red">Detalles de Solicitud de red</h2>
-
-<p>Hacer click en una fila muestra en un nuevo panel en la parte derecha del monitor de red, que provee más información detallada sobre la solicitud.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7393/nm-details-annotated.png" style="display: block; margin-left: auto; margin-right: auto;">Las pestañas de la parte superior de este panel le permiten cambiar entre 5 diferentes páginas:</p>
-
-<ul>
- <li><strong>Encabezados</strong></li>
- <li><strong>Cookies</strong></li>
- <li><strong>Parámetros</strong></li>
- <li><strong>Respuestas</strong></li>
- <li><strong>Tiempos</strong></li>
-</ul>
-
-<p>Desde Firefox 30 en adelante, hay una sexta página que aparece solamente si el tipo de contenido es HTML, la página de <strong>Vista Preliminar</strong>.</p>
-
-<p>Hacer click en el ícono de la izquierda de las pestañas cierra el panel y vuelve a la vista de lista.</p>
-
-<h3 id="Encabezados">Encabezados</h3>
-
-<p>Esta pestaña lista información básica sobre la solicitud incluyendo URL y código de estado, asi como la solicitud HTTP y encabezados de respuesta que fueron enviados:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7397/nm-headers.png" style="display: block; margin-left: auto; margin-right: auto;">Ud. puede filtrar las encabezados que se muestran:</p>
-
-<h3 id="Cookies"><img alt="" src="https://mdn.mozillademos.org/files/7399/nm-headers-filtered.png" style="display: block; margin-left: auto; margin-right: auto;">Cookies</h3>
-
-<p>Esta pestaña lista detalles completos de cualquier cookie que fue enviada con la solicitud o respuesta:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7391/nm-cookies.png" style="display: block; margin-left: auto; margin-right: auto;">Al igual que con los encabezados, ud. puede filtrar las cookies que se muestran.</p>
-
-<h3 id="Parametros">Parametros</h3>
-
-<p>Esta pestaña muestra los parámetros GET y datos POST de una solicitud:</p>
-
-<h3 id="Respuesta"><img alt="" src="https://mdn.mozillademos.org/files/7407/nm-params.png" style="display: block; margin-left: auto; margin-right: auto;">Respuesta</h3>
-
-<p>El contenido completo de la respuesta. Si la respuesta es HTML, JS o CSS, será mostrada como texto:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7413/nm-response-html.png" style="display: block; margin-left: auto; margin-right: auto;">Si la respuesta es JSON, será mostrada como un objeto inspeccionable:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7421/nm-response-json.png" style="display: block; margin-left: auto; margin-right: auto;">Si la respuesta es una imagen, la pestaña muestra una vista preliminar:</p>
-
-<h3 id="Tiempos"><img alt="" src="https://mdn.mozillademos.org/files/7415/nm-response-image.png" style="display: block; margin-left: auto; margin-right: auto;">Tiempos</h3>
-
-<p>La pestaña de tiempo muestra una lista más detallada y comentada de la barra de línea de tiempo para esa solicitud, mostrando como el tiempo de espera total es dividido en varias etapas:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7417/nm-timings.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h3 id="Vista_Preliminar">Vista Preliminar</h3>
-
-<div class="geckoVersionNote">
-<p>Esta caracteristica es nueva en  Firefox 30.</p>
-</div>
-
-<p>Desde Firefox 30 en adelante, si el tipo de archivo es HTML una sexta pestaña aparece llamada "Vista Preliminar". Esta hace un render de aquel HTML:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7401/nm-html-preview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h2 id="Análisis_de_Rendimiento">Análisis de Rendimiento</h2>
-
-<div class="geckoVersionNote">
-<p>La herramienta de análisis de rendimiento es nueva en Firefox 29.</p>
-</div>
-
-<p>Desde Firefox 29 en adelante, el Monitor de Red trae una herramienta de análisis de rendimiento (performance), para ayudarlo a ver cuánto le toma al navegador descargar las diferentes partes de su sitio.<br>
- <br>
- Para correr la herramienta de análisis de performance haga click en el icono de cronómetro en la barra de herramientas en la parte inferior del Monitor de Red:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7411/nm-performance-button.png" style="display: block; margin-left: auto; margin-right: auto;">(Alternativamente, si ud. acaba de abrir el Monitor de Red, por ende no está todavia poblado con la lista de Solicitudes, ud. tendrá el icono de Cronómetro en la ventana principal.)</p>
-
-<p>El Monitor de Red luego carga el sitio dos veces: una vez con un cache de navegador vacio, y una vez con el chaché óptimo. Esto simula la primera vez que un usuario visita su sitio, y visitas siguientes. Muestra los resultados para cada corrida de lado a lado o verticalmente si la ventana de Navegación es angosta:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7409/nm-performance.png" style="display: block; margin-left: auto; margin-right: auto;">El resultado de cada recarga es resumido en una tabla y un gráfico sectorial o de torta. La tabla agrupa recursos por tipo, y muestra el tamaño total de cada recurso y el tiempo total que tomó en cargarlos. El gráfico de torta acompañante muestra el tamaño relativo de cada tipo de recurso.</p>
-
-<p>Para volver a la lista de Solicitudes de Red del Monitor de Red haga click en el botón "Volver" en la izquierda.</p>
-
-<p>Hacer click en una porción de la torta lo lleva al Monitor de Red para esa recarga, con un filtro automáticamente aplicado para ver <a href="/en-US/docs/Tools/Network_Monitor#Filtering_by_content_type">solo este tipo de recurso</a>.</p>
diff --git a/files/es/tools/network_monitor/index.html b/files/es/tools/network_monitor/index.html
new file mode 100644
index 0000000000..c786393321
--- /dev/null
+++ b/files/es/tools/network_monitor/index.html
@@ -0,0 +1,190 @@
+---
+title: Monitor de Red
+slug: Tools/Network_Monitor
+tags:
+  - Debugging
+  - Firefox
+  - Guía
+  - Herramientas
+  - Herramientas de Desarrollador
+  - Redes
+translation_of: Tools/Network_Monitor
+original_slug: Tools/Monitor_de_Red
+---
+<p>El monitor de red muestra todas las solicitudes de red que Firefox realiza (por ejemplo, cuando carga una página, o debido a <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequests</a>), cuanto tiempo toma cada petición, y los detalles de cada petición. Para abrir el monitor seleccione "Red" del menu "Desarrollador Web"  (el cual es un Submenú del Menú "Herramientas" en Mac), o abra Herramientas de Desarrollador Web y seleccione la solapa "Red".</p>
+
+<p>El monitor de red aparecerá al final de la ventana de navegación. Recargue la página para ver las solicitudes:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7405/nm-overview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h2 id="Lista_de_Solicitudes_de_Red">Lista de Solicitudes de Red</h2>
+
+<p>Por defecto, el Monitor de Red muestra una lista de todas las solicitudes de red hechas durante la carga de una página. Cada solicitud es mostrada en su propia linea:<br>
+ <img alt="" src="https://mdn.mozillademos.org/files/7419/nm-row.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>Por defecto, el Monitor de Red se limpia cada vez que ud. navega a una nueva página o recarga la página actual. Desde Firefox 31 en adelante se puede cambiar este comportamiento selecccionando "Habilitar Registros Persistentes" en las Opciones de <a href="https://developer.mozilla.org/en-US/docs/Tools_Toolbox#Common_preferences">Herramientas</a>.</p>
+
+<h3 id="Area_de_Solicitudes_de_Red">Area de Solicitudes de Red</h3>
+
+<p>Cada fila muestra:</p>
+
+<ul>
+ <li><strong>√</strong>: El código HTTP retornado. Este es mostrado por un ícono a colores: Verde para correcto (Códigos 2XX ), naranja para redirección (3XX), o rojo para errores (4XX and 5XX). Desde Firefox 30 en adelante, el código exacto es mostrado inmediatamente después del ícono.</li>
+ <li><strong>Método</strong>: El método de Solicitud HTTP</li>
+ <li><strong>Archivo</strong>: Nombre base del archivo solicitado.</li>
+ <li><strong>Dominio</strong>: Dominio del path solicitado.</li>
+ <li><strong>Tipo</strong>: <code>Content-type</code> de la respuesta</li>
+ <li><strong>Tamaño</strong>: Tamaño de la respuesta</li>
+</ul>
+
+<p>La barra de herramientas en la parte superior etiqueta estas columnas, y hacer click en las etiquetas ordena todas las solicitudes por esa columna.</p>
+
+<p>Desde Firefox 30 en adelante, si el archivo es una imagen, la fila incluye una miniatura de la imagen, y pasar por arriba del nombre del archivo muestra un preview en un tooltip:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7403/nm-image-preview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h3 id="Linea_de_Tiempo">Linea de Tiempo</h3>
+
+<p>La lista de solicitudes también muestra una linea de tiempo para las diferentes partes de cada solicitud. Cada linea de tiempo es dada en posición horizontal en su fila relativa a las otras solicitudes de red, de manera que ud. pueda ver el tiempo total que tomó cargar la página. Para más detalles sobre los códigos de color usados aqui, vea la sección en la página <a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor#Timings">Tiempos</a>.</p>
+
+<h3 id="Filtrando_por_tipo_de_Contenido">Filtrando por tipo de Contenido</h3>
+
+<p>Al final de la ventana una fila de botones le permite a ud. filtrar las solicitudes por el tipo de contenido de la respuesta:<img alt="" src="https://mdn.mozillademos.org/files/7395/nm-filter-by-type.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>En el extremo derecho de esta fila hay un botón llamado "Limpiar": como ud. podrá adivinar, esto le permite limpiar la lista de solicitudes de red.</p>
+
+<h3 id="Menu_Contextual">Menu Contextual</h3>
+
+<p>Haciendo click en una fila de la lista muestra un menú contextual con las siguientes opciones:</p>
+
+<ul>
+ <li>Abrir en nueva pestaña</li>
+ <li>Copiar URL</li>
+ <li>Copiar como cURL (solo desde Firefox 31 en adelante)</li>
+ <li>Copiar imagen como Data URI (solo para imágenes)</li>
+ <li>Editar y Reenviar</li>
+ <li>Comenzar <a href="/en-US/docs/Tools/Network_Monitor#Performance_analysis">Análisis de Performance</a> para la página</li>
+</ul>
+
+<h4 id="Editar_y_Reenviar">Editar y Reenviar</h4>
+
+<p>Esta opción abre un editor que le permite editar el método de Solicitud, URL, parámetros, y cabeceras, y reenviar la solicitud.</p>
+
+<h4 id="Copiar_como_cURL">Copiar como cURL</h4>
+
+<div class="geckoVersionNote">
+<p>Esta característica es nueva en Firefox 31.</p>
+</div>
+
+<p>Esta opción copia la solicitud de red al portapapeles como un comando <a href="http://curl.haxx.se/">cURL</a>, de manera que ud. pueda ejectutarlo desde una línea de comandos. El comando puede incluir las siguientes opciones:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><code>-X [METODO]</code></td>
+   <td>Si el método no es GET o POST</td>
+  </tr>
+  <tr>
+   <td><code>--data</code></td>
+   <td>Para parámetros de solicitud URL encodeados</td>
+  </tr>
+  <tr>
+   <td><code>--data-binary</code></td>
+   <td>Para parámetros de solicitud multiparte</td>
+  </tr>
+  <tr>
+   <td><code>--http/VERSION</code></td>
+   <td>Si la versión de HTTP no es 1.1</td>
+  </tr>
+  <tr>
+   <td><code>-I</code></td>
+   <td>Si el método no es HEAD</td>
+  </tr>
+  <tr>
+   <td><code>-H</code></td>
+   <td>
+    <p>Uno para cada encabezado de solicitud.</p>
+
+    <p>Deesde Firefox 34, si el encabezado "Accept-Encoding" está presente, el comando cURL incluirá <code>--compressed</code> en vez de  <code>-H "Accept-Encoding: gzip, deflate"</code>.  Esto significa que la respuesta será automáticamente descomprimida.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Detalles_de_Solicitud_de_red">Detalles de Solicitud de red</h2>
+
+<p>Hacer click en una fila muestra en un nuevo panel en la parte derecha del monitor de red, que provee más información detallada sobre la solicitud.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7393/nm-details-annotated.png" style="display: block; margin-left: auto; margin-right: auto;">Las pestañas de la parte superior de este panel le permiten cambiar entre 5 diferentes páginas:</p>
+
+<ul>
+ <li><strong>Encabezados</strong></li>
+ <li><strong>Cookies</strong></li>
+ <li><strong>Parámetros</strong></li>
+ <li><strong>Respuestas</strong></li>
+ <li><strong>Tiempos</strong></li>
+</ul>
+
+<p>Desde Firefox 30 en adelante, hay una sexta página que aparece solamente si el tipo de contenido es HTML, la página de <strong>Vista Preliminar</strong>.</p>
+
+<p>Hacer click en el ícono de la izquierda de las pestañas cierra el panel y vuelve a la vista de lista.</p>
+
+<h3 id="Encabezados">Encabezados</h3>
+
+<p>Esta pestaña lista información básica sobre la solicitud incluyendo URL y código de estado, asi como la solicitud HTTP y encabezados de respuesta que fueron enviados:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7397/nm-headers.png" style="display: block; margin-left: auto; margin-right: auto;">Ud. puede filtrar las encabezados que se muestran:</p>
+
+<h3 id="Cookies"><img alt="" src="https://mdn.mozillademos.org/files/7399/nm-headers-filtered.png" style="display: block; margin-left: auto; margin-right: auto;">Cookies</h3>
+
+<p>Esta pestaña lista detalles completos de cualquier cookie que fue enviada con la solicitud o respuesta:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7391/nm-cookies.png" style="display: block; margin-left: auto; margin-right: auto;">Al igual que con los encabezados, ud. puede filtrar las cookies que se muestran.</p>
+
+<h3 id="Parametros">Parametros</h3>
+
+<p>Esta pestaña muestra los parámetros GET y datos POST de una solicitud:</p>
+
+<h3 id="Respuesta"><img alt="" src="https://mdn.mozillademos.org/files/7407/nm-params.png" style="display: block; margin-left: auto; margin-right: auto;">Respuesta</h3>
+
+<p>El contenido completo de la respuesta. Si la respuesta es HTML, JS o CSS, será mostrada como texto:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7413/nm-response-html.png" style="display: block; margin-left: auto; margin-right: auto;">Si la respuesta es JSON, será mostrada como un objeto inspeccionable:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7421/nm-response-json.png" style="display: block; margin-left: auto; margin-right: auto;">Si la respuesta es una imagen, la pestaña muestra una vista preliminar:</p>
+
+<h3 id="Tiempos"><img alt="" src="https://mdn.mozillademos.org/files/7415/nm-response-image.png" style="display: block; margin-left: auto; margin-right: auto;">Tiempos</h3>
+
+<p>La pestaña de tiempo muestra una lista más detallada y comentada de la barra de línea de tiempo para esa solicitud, mostrando como el tiempo de espera total es dividido en varias etapas:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7417/nm-timings.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h3 id="Vista_Preliminar">Vista Preliminar</h3>
+
+<div class="geckoVersionNote">
+<p>Esta caracteristica es nueva en  Firefox 30.</p>
+</div>
+
+<p>Desde Firefox 30 en adelante, si el tipo de archivo es HTML una sexta pestaña aparece llamada "Vista Preliminar". Esta hace un render de aquel HTML:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7401/nm-html-preview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h2 id="Análisis_de_Rendimiento">Análisis de Rendimiento</h2>
+
+<div class="geckoVersionNote">
+<p>La herramienta de análisis de rendimiento es nueva en Firefox 29.</p>
+</div>
+
+<p>Desde Firefox 29 en adelante, el Monitor de Red trae una herramienta de análisis de rendimiento (performance), para ayudarlo a ver cuánto le toma al navegador descargar las diferentes partes de su sitio.<br>
+ <br>
+ Para correr la herramienta de análisis de performance haga click en el icono de cronómetro en la barra de herramientas en la parte inferior del Monitor de Red:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7411/nm-performance-button.png" style="display: block; margin-left: auto; margin-right: auto;">(Alternativamente, si ud. acaba de abrir el Monitor de Red, por ende no está todavia poblado con la lista de Solicitudes, ud. tendrá el icono de Cronómetro en la ventana principal.)</p>
+
+<p>El Monitor de Red luego carga el sitio dos veces: una vez con un cache de navegador vacio, y una vez con el chaché óptimo. Esto simula la primera vez que un usuario visita su sitio, y visitas siguientes. Muestra los resultados para cada corrida de lado a lado o verticalmente si la ventana de Navegación es angosta:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7409/nm-performance.png" style="display: block; margin-left: auto; margin-right: auto;">El resultado de cada recarga es resumido en una tabla y un gráfico sectorial o de torta. La tabla agrupa recursos por tipo, y muestra el tamaño total de cada recurso y el tiempo total que tomó en cargarlos. El gráfico de torta acompañante muestra el tamaño relativo de cada tipo de recurso.</p>
+
+<p>Para volver a la lista de Solicitudes de Red del Monitor de Red haga click en el botón "Volver" en la izquierda.</p>
+
+<p>Hacer click en una porción de la torta lo lleva al Monitor de Red para esa recarga, con un filtro automáticamente aplicado para ver <a href="/en-US/docs/Tools/Network_Monitor#Filtering_by_content_type">solo este tipo de recurso</a>.</p>
diff --git a/files/es/tools/page_inspector/3-pane_mode/index.html b/files/es/tools/page_inspector/3-pane_mode/index.html
new file mode 100644
index 0000000000..67921e0b67
--- /dev/null
+++ b/files/es/tools/page_inspector/3-pane_mode/index.html
@@ -0,0 +1,70 @@
+---
+title: El 3er panel del modo inspector
+slug: Tools/Page_Inspector/3-pane_mode
+tags:
+  - 3 paneles
+  - CSS
+  - Guía
+  - Herramientas
+  - Inspectord
+translation_of: Tools/Page_Inspector/3-pane_mode
+original_slug: Tools/Page_Inspector/3er-panel_modo
+---
+<div>{{ToolsSidebar}}</div>
+
+<p class="summary">Este articulo explica como usar el 3er panel del modo inspector.</p>
+
+<h2 id="Feature_summary">Feature summary</h2>
+
+<p>Desde Firefox 62 en adelante, el <a href="/en-US/docs/Tools/Page_Inspector">Inspector de página</a> tieen un nuevo modo disponible— <strong>modo 3er-Panel</strong>. cuando este es activado, te permitira ver en simultaneo lo siguiente:</p>
+
+<ul>
+ <li>El <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML">panel HTML</a> al costado izquierdo, como es usual.</li>
+ <li>Las <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS#Examine_CSS_rules">reglas CSS</a> en un panel diferente en la partecentral, es mas como una pestaña.</li>
+ <li>Las otras caracteristicas relacionadas a CSS — como la <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS#Examine_computed_CSS">vista de estilos computados</a>, <a href="/en-US/docs/Tools/Page_Inspector/How_to/Work_with_animations">vista de animaciones</a>, y <a href="/en-US/docs/Tools/Page_Inspector/How_to/View_fonts">vista de fuentes</a> — en la pstaña derecha, como es usual.</li>
+</ul>
+
+<p><img alt="The firefox page inspector in 3 pane mode, with HTML pane on left, CSS rules pane in center, and CSS tool tabs on right" src="https://mdn.mozillademos.org/files/15935/3-pane-view-final.png" style="border-style: solid; border-width: 1px; display: block; height: 259px; margin: 0px auto; width: 1195px;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: En tamaños de pantalla mas reducidos, las pestañas apareceran bajo el panel de Reglas CSS.</p>
+</div>
+
+<p>Tener las reglas de CCS en su propio panel es muy util ya que no solo te permite revisar el HTML y editar el CSS que esta aplicado a este, si no que tambien puedes ver en tiempo real como afectan tus caracteristicas CSS afectan a los estilos computados. solo necesitas tener la pestaña abierta para ver el efecto.</p>
+
+<h2 id="A_brief_walkthrough">A brief walkthrough</h2>
+
+<p>El inspector de 3 paneles esta desactivado por defecto. este se activa con el  toggle que se encuentra el parte superior izquierda de la pestaña.</p>
+
+<p><img alt="a view of the tabs panel, showing the 2 to 3 pane toggle icon" src="https://mdn.mozillademos.org/files/15937/toggle-icon-final.png" style="display: block; height: 241px; margin: 0px auto; width: 410px;"></p>
+
+<p>presionando el toggle podras cambiar de la vista de  2 a 3 paneles.</p>
+
+<p><img alt="The firefox page inspector in 2 pane mode, with HTML pane on left and CSS tool tabs on right" src="https://mdn.mozillademos.org/files/15936/2-pane-view-final.png" style="border-style: solid; border-width: 1px; display: block; height: 262px; margin: 0px auto; width: 1195px;"></p>
+
+<p><img alt="The firefox page inspector in 3 pane mode, with HTML pane on left, CSS rules pane in center, and CSS tool tabs on right" src="https://mdn.mozillademos.org/files/15935/3-pane-view-final.png" style="border-style: solid; border-width: 1px; display: block; height: 259px; margin: 0px auto; width: 1195px;"></p>
+
+<p>Con el modo de 3 paneles activado, podras ver los cambios en vivo realizados a las reglas de CSS en tu página. Por ejemplo, puedes editar las propiedades de una <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">Rejilla CSS </a>y ver inmediatamente los cambios en el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Inspector de rejilla</a>.</p>
+
+<p>{{EmbedYouTube("ELS2OOUvxIw")}}</p>
+
+<h2 id="Habilitando_el_inspector_de_3_paneles_en_versiones_anteriores_a_Firefox_62">Habilitando el  inspector de 3 paneles en versiones anteriores a Firefox 62</h2>
+
+<p>en anteriores versiones de Firefox (desde Firefox 59/60), puedes activar el modo de 3 paneles en su version Beta para esto vas a about:config y pasando las siguientes  <code>true</code>:</p>
+
+<p><code>devtools.inspector.split-rule-enabled</code> — esto cambia el modo de 3 paneles de on a off.</p>
+
+<p><code>devtools.inspector.split-sidebar-toggle</code> — esto añade el boton a la UI.</p>
+
+<p>en Firefox 61, estas preferencias se renombran como:</p>
+
+<ul>
+ <li><code>devtools.inspector.three-pane-enabled</code></li>
+ <li><code>devtools.inspector.three-pane-toggle</code></li>
+</ul>
+
+<p>debes pasar estas dos a <code>true</code> en el Beta para probar las caracteristicas enFirefox 61.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El inspector de 3 paneles esta disponible en la edicion Nightly/Developer desde Firefox 62.</p>
+</div>
diff --git a/files/es/tools/page_inspector/3er-panel_modo/index.html b/files/es/tools/page_inspector/3er-panel_modo/index.html
deleted file mode 100644
index 7165d90a4d..0000000000
--- a/files/es/tools/page_inspector/3er-panel_modo/index.html
+++ /dev/null
@@ -1,69 +0,0 @@
----
-title: El 3er panel del modo inspector
-slug: Tools/Page_Inspector/3er-panel_modo
-tags:
-  - 3 paneles
-  - CSS
-  - Guía
-  - Herramientas
-  - Inspectord
-translation_of: Tools/Page_Inspector/3-pane_mode
----
-<div>{{ToolsSidebar}}</div>
-
-<p class="summary">Este articulo explica como usar el 3er panel del modo inspector.</p>
-
-<h2 id="Feature_summary">Feature summary</h2>
-
-<p>Desde Firefox 62 en adelante, el <a href="/en-US/docs/Tools/Page_Inspector">Inspector de página</a> tieen un nuevo modo disponible— <strong>modo 3er-Panel</strong>. cuando este es activado, te permitira ver en simultaneo lo siguiente:</p>
-
-<ul>
- <li>El <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML">panel HTML</a> al costado izquierdo, como es usual.</li>
- <li>Las <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS#Examine_CSS_rules">reglas CSS</a> en un panel diferente en la partecentral, es mas como una pestaña.</li>
- <li>Las otras caracteristicas relacionadas a CSS — como la <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_and_edit_CSS#Examine_computed_CSS">vista de estilos computados</a>, <a href="/en-US/docs/Tools/Page_Inspector/How_to/Work_with_animations">vista de animaciones</a>, y <a href="/en-US/docs/Tools/Page_Inspector/How_to/View_fonts">vista de fuentes</a> — en la pstaña derecha, como es usual.</li>
-</ul>
-
-<p><img alt="The firefox page inspector in 3 pane mode, with HTML pane on left, CSS rules pane in center, and CSS tool tabs on right" src="https://mdn.mozillademos.org/files/15935/3-pane-view-final.png" style="border-style: solid; border-width: 1px; display: block; height: 259px; margin: 0px auto; width: 1195px;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: En tamaños de pantalla mas reducidos, las pestañas apareceran bajo el panel de Reglas CSS.</p>
-</div>
-
-<p>Tener las reglas de CCS en su propio panel es muy util ya que no solo te permite revisar el HTML y editar el CSS que esta aplicado a este, si no que tambien puedes ver en tiempo real como afectan tus caracteristicas CSS afectan a los estilos computados. solo necesitas tener la pestaña abierta para ver el efecto.</p>
-
-<h2 id="A_brief_walkthrough">A brief walkthrough</h2>
-
-<p>El inspector de 3 paneles esta desactivado por defecto. este se activa con el  toggle que se encuentra el parte superior izquierda de la pestaña.</p>
-
-<p><img alt="a view of the tabs panel, showing the 2 to 3 pane toggle icon" src="https://mdn.mozillademos.org/files/15937/toggle-icon-final.png" style="display: block; height: 241px; margin: 0px auto; width: 410px;"></p>
-
-<p>presionando el toggle podras cambiar de la vista de  2 a 3 paneles.</p>
-
-<p><img alt="The firefox page inspector in 2 pane mode, with HTML pane on left and CSS tool tabs on right" src="https://mdn.mozillademos.org/files/15936/2-pane-view-final.png" style="border-style: solid; border-width: 1px; display: block; height: 262px; margin: 0px auto; width: 1195px;"></p>
-
-<p><img alt="The firefox page inspector in 3 pane mode, with HTML pane on left, CSS rules pane in center, and CSS tool tabs on right" src="https://mdn.mozillademos.org/files/15935/3-pane-view-final.png" style="border-style: solid; border-width: 1px; display: block; height: 259px; margin: 0px auto; width: 1195px;"></p>
-
-<p>Con el modo de 3 paneles activado, podras ver los cambios en vivo realizados a las reglas de CSS en tu página. Por ejemplo, puedes editar las propiedades de una <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">Rejilla CSS </a>y ver inmediatamente los cambios en el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Inspector de rejilla</a>.</p>
-
-<p>{{EmbedYouTube("ELS2OOUvxIw")}}</p>
-
-<h2 id="Habilitando_el_inspector_de_3_paneles_en_versiones_anteriores_a_Firefox_62">Habilitando el  inspector de 3 paneles en versiones anteriores a Firefox 62</h2>
-
-<p>en anteriores versiones de Firefox (desde Firefox 59/60), puedes activar el modo de 3 paneles en su version Beta para esto vas a about:config y pasando las siguientes  <code>true</code>:</p>
-
-<p><code>devtools.inspector.split-rule-enabled</code> — esto cambia el modo de 3 paneles de on a off.</p>
-
-<p><code>devtools.inspector.split-sidebar-toggle</code> — esto añade el boton a la UI.</p>
-
-<p>en Firefox 61, estas preferencias se renombran como:</p>
-
-<ul>
- <li><code>devtools.inspector.three-pane-enabled</code></li>
- <li><code>devtools.inspector.three-pane-toggle</code></li>
-</ul>
-
-<p>debes pasar estas dos a <code>true</code> en el Beta para probar las caracteristicas enFirefox 61.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El inspector de 3 paneles esta disponible en la edicion Nightly/Developer desde Firefox 62.</p>
-</div>
diff --git a/files/es/tools/page_inspector/how_to/abrir_el_inspector/index.html b/files/es/tools/page_inspector/how_to/abrir_el_inspector/index.html
deleted file mode 100644
index e45754096e..0000000000
--- a/files/es/tools/page_inspector/how_to/abrir_el_inspector/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: Abrir el Inspector
-slug: Tools/Page_Inspector/How_to/Abrir_el_Inspector
-tags:
-  - Guía
-  - Herramientas
-  - Inspector
-  - Tools
-translation_of: Tools/Page_Inspector/How_to/Open_the_Inspector
----
-<p>Hay dos maneras básicas para abrir el Inspector:</p>
-
-<ul>
- <li><em>Si no tenemos seleccionado ningun elemento:</em> desde la barra de menú "Herramientas -&gt; Desarrollador Web -&gt; Inspector" ; o utilizando un <a href="https://developer.mozilla.org/es/docs/tools/Keyboard_shortcuts#Opening_and_closing_tools">atajo de teclado</a> equivalente</li>
- <li>
-  <p><em>Si tenemos seleccionado un elemento: haz click derecho en un elemento de la página web y selecciona </em> "Inspeccionar elemento"</p>
- </li>
-</ul>
-
-<p>El Inspector aparecerá en la parte inferior de la ventana del navegador:</p>
-
-<p><img alt="The all-new Inspector in Firefox 57 DevTools." src="https://mdn.mozillademos.org/files/15493/57-inspector-starfish.png" style="display: block; height: 647px; margin-left: auto; margin-right: auto; width: 845px;">Para empezar a aprender sobre el Inspector ve al <a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/UI_Tour"> Tour por la UI</a>.</p>
diff --git a/files/es/tools/page_inspector/how_to/examinar_y_editar_el_modelo_de_cajasmodel/index.html b/files/es/tools/page_inspector/how_to/examinar_y_editar_el_modelo_de_cajasmodel/index.html
deleted file mode 100644
index 992a5b8326..0000000000
--- a/files/es/tools/page_inspector/how_to/examinar_y_editar_el_modelo_de_cajasmodel/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: Examinar y editar el modelo de cajas
-slug: Tools/Page_Inspector/How_to/Examinar_y_editar_el_modelo_de_cajasmodel
-tags:
-  - Guía
-  - Herramientas
-  - Tools
-translation_of: Tools/Page_Inspector/How_to/Examine_and_edit_the_box_model
----
-<h2 id="Visualización_del_modelo_de_caja">Visualización del modelo de caja</h2>
-
-<p>Con el <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Select_element_button">botón Seleccionar elemento</a> pulsado, si se pasa el ratón por encima de un elemento en la página, el <a href="/es/docs/Web/CSS/box_model">modelo de caja</a> para ese elemento se muestra superpuesto en la página:</p>
-
-<p>{{EmbedYouTube("vDRzN-svJHQ")}}</p>
-
-<p>También se muestra superpuesto en la página si en el panel HTML ponemos el cursor sobre la marca de un elemento :</p>
-
-<p>{{EmbedYouTube("xA4IxTttNLk")}}</p>
-
-<p>Si se trata de un elemento en línea que está dividido en varias filas, se destaca cada una de las líneas individuales que componen el elemento:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10349/inline-box-model.png" style="display: block; height: 186px; margin-left: auto; margin-right: auto; width: 351px;"></p>
-
-<h3 id="Vista_Modelo_de_Caja">Vista Modelo de Caja</h3>
-
-<p>Cuando se selecciona un elemento, podemos obtener una vista detallada del modelo de caja en dos de las vistas del panel CCS: <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Computed_view">Calculado</a> y Disposición:</p>
-
-<ul>
- <li>en la vista Calculado aparece en primer término, seguido de la sección con el listado de reglas que se aplican al elemento;</li>
- <li>en la vista Disposición está en segundo término, detrás de la sección 'Rejilla' y seguido de la sección Propiedades del modelo de caja (box-sizing, display, float, line-height, position y z-index) indicando sus valores</li>
-</ul>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14241/box-model.png" style="display: block; height: 232px; margin-left: auto; margin-right: auto; width: 610px;"></p>
-
-<p>Si ponemos el cursor sobre un valor en la vista modelo de caja al lado aparece un tooltip que nos indica de qué regla procede el valor:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14243/box-model-tooltip.png" style="display: block; height: 234px; margin-left: auto; margin-right: auto; width: 620px;"></p>
-
-<p>Si desplazamos el cursor sobre una parte del modelo de caja en la vista Modelo de caja, se resalta la parte correspondiente de la página y aparece otro tooltip con información indicando el elemento, su clase y/o ID y sus dimensiones (ancho x alto):</p>
-
-<p>{{EmbedYouTube("H3ZxRbbyfwI")}}</p>
-
-<h2 id="Edición_del_modelo_de_caja">Edición del modelo de caja</h2>
-
-<p>También podemos editar los valores en la <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_the_box_model#The_Box_Model_view">Vista Modelo de Caja</a>: hacer clic sobre un valor permite editarlo y ver los resultados inmediatamente en la página:</p>
-
-<p>{{EmbedYouTube("gHjDjM8GJ9I")}}</p>
diff --git a/files/es/tools/page_inspector/how_to/examinar_y_editar_html/index.html b/files/es/tools/page_inspector/how_to/examinar_y_editar_html/index.html
deleted file mode 100644
index 2a361a1d90..0000000000
--- a/files/es/tools/page_inspector/how_to/examinar_y_editar_html/index.html
+++ /dev/null
@@ -1,364 +0,0 @@
----
-title: Examinar y editar HTML
-slug: Tools/Page_Inspector/How_to/Examinar_y_editar_HTML
-tags:
-  - Guía
-  - Herramientas
-  - Inspector
-  - Tools
-translation_of: Tools/Page_Inspector/How_to/Examine_and_edit_HTML
----
-<p>Puedes examinar y editar el HTML de la página en el <a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/UI_Tour#HTML_pane">panel HTML</a>.</p>
-
-<h2 id="Navegar_en_HTML">Navegar en HTML</h2>
-
-<h3 id="HTML_breadcrumbs_(migas_de_pan)">HTML breadcrumbs (migas de pan)</h3>
-
-<p>En la parte inferior del panel HTML hay una barra de navegación de migas de pan. Muestra la jerarquía completa en el documento para la rama que contiene el elemento seleccionado:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/15499/57-html-panel.png" style="display: block; height: 274px; margin-left: auto; margin-right: auto; width: 633px;"></p>
-
-<p>Pasar el ratón sobre cada miguita de pan destaca ese elemento de la página.</p>
-
-<p>La barra breadcrumbs tiene sus propios <a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/Keyboard_shortcuts#Breadcrumbs_bar">atajos de teclado</a>.</p>
-
-<div class="note">
-<p>Ten en cuenta que antes de Firefox 48, esta barra de herramientas estaba en la parte superior del panel HTML.</p>
-</div>
-
-<h3 id="Buscar">Buscar</h3>
-
-<p>A partir de Firefox 45, el campo de búsqueda del Inspector de páginas busca coincidencias en todo el marcado del documento actual y en cualquier frame.</p>
-
-<p>Para empezar a buscar un marcador, haz clic en el cuadro de búsqueda para expandirlo o presiona <kbd>Ctrl</kbd> + <kbd>F</kbd> , o <kbd>Cmd</kbd> + <kbd>F</kbd> en Mac.</p>
-
-<p>A medida que escribes, en la ventana emergente se autocompletarán sugerencias con los atributos de clase o de ID que coincidan con el término de búsqueda actual:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/15495/html-code-search.png" style="display: block; height: 398px; margin-left: auto; margin-right: auto; width: 900px;"></p>
-
-<p>Presiona <kbd>Up</kbd> y <kbd>Down</kbd> para desplazarte por las sugerencias, <kbd>Tab</kbd> para elegir la sugerencia actual y entonces <kbd>Enter</kbd> para seleccionar el primer nodo con ese atributo.</p>
-
-<p>Si sólo introduces el término de búsqueda sin seleccionar un valor entre las sugerencias, el término de búsqueda se aplicará al texto completo del documento, incluyendo todos los nombres y valores de atributos y el contenido de texto de los nodos.</p>
-
-<p>{{EmbedYouTube("AKBhnfp1Opo")}}</p>
-
-<p>Para desplazarte por las sugerencias presiona <kbd>Enter</kbd> . A partir de Firefox 48 es posible el desplazamiento hacia atrás con <kbd>Shift</kbd> + <kbd>Enter</kbd> .</p>
-
-<h3 id="Árbol_HTML">Árbol HTML</h3>
-
-<p>El resto del panel muestra el HTML de la página como un árbol (esta interfaz de usuario también se llama Vista de marcado). Justo a la izquierda de cada nodo hay una flecha: haz clic en la flecha para desplegar el nodo. Si mantienes pulsada la tecla <kbd>Alt</kbd> mientras haces clic en la flecha, se desplegará el nodo y todos los nodos situados debajo de él.</p>
-
-<p><img alt="The new Firefox 57 inspector HTML tree." src="https://mdn.mozillademos.org/files/15503/57-html-tree.png" style="display: block; height: 433px; margin-left: auto; margin-right: auto; width: 600px;"></p>
-
-<p>Mover el ratón sobre un nodo del árbol destaca el elemento en la página.</p>
-
-<p>Los nodos no-visibles se representan descoloridos o desaturados. La invisibilidad puede deberse a razones diversas, entre ellas el uso de <code><a href="/es/docs/Web/CSS/display">display: none</a></code>, o que el elemento no tenga ninguna dimensión.</p>
-
-<p>A partir de Firefox 53 se muestra una elipsis entre la etiqueta de apertura y cierre de un elemento si el nodo está colapsado y contiene más contenido. Antes de Firefox 53, era imposible determinar si un nodo colapsado tenía hijos. Ahora los hijos se indican en el árbol con este icono: <img alt="" src="https://mdn.mozillademos.org/files/14925/child-node-indicator.png" style="height: 24px; width: 32px;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Hay atajos de teclado útiles para usar en el árbol HTML — ve a la <a href="/es/docs/Tools/Keyboard_shortcuts#HTML_pane">lista de atajos de teclado del panel HTML</a>.</p>
-</div>
-
-<h3 id="before_y_after">::before y ::after</h3>
-
-<p>Desde Firefox 35 en adelante, puede inspeccionar los pseudoelementos añadidos usando {{cssxref("::before")}} y {{cssxref("::after")}}:</p>
-
-<p>{{EmbedYouTube("ecfqTGvzsNc")}}</p>
-
-<h3 id="Whitespace-only_text_nodes">Whitespace-only text nodes</h3>
-
-<div class="geckoVersionNote">Nuevo en Firefox 52</div>
-
-<p>Los desarrolladores web no escriben todo su código en una sola línea de texto. Introducen espacios en blanco con <kbd>Space</kbd> , <kbd>Return</kbd> , y <kbd>Tab</kbd> entre sus elementos HTML para que el marcado sea más legible.</p>
-
-<p>Normalmente este espacio en blanco parece no tener efecto ni salida visual, pero de hecho, cuando un navegador analiza HTML genera automáticamente nodos de texto anónimos para elementos que no están contenidos en un nodo. Esto incluye los espacios en blanco que hay después de cualquier tipo de texto.</p>
-
-<p>Si estos nodos de texto generados automáticamente están <a href="https://developer.mozilla.org/es/docs/Web/Guide/CSS/Visual_formatting_model#Inline-level_elements_and_inline_boxes">inline level</a>, los navegadores les asignarán una anchura y altura distinta de cero. Así puede que encuentres espacios extraños entre los elementos, incluso si no has puesto ningún margen o relleno en ellos.</p>
-
-<p>Desde Firefox 52, el Inspector muestra los nodos whitespace para que puedas saber de dónde vienen los huecos en su marcado.</p>
-
-<p>Los nodos Whitespace se representan con un punto: <img alt="" src="https://mdn.mozillademos.org/files/14931/new-whitespace-text-indicator.png" style="height: 23px; width: 30px;"> y cuando pasas el ratón sobre ellos muestra un tooltip explicativo</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14929/whitespace-text-nodes-2.png" style="display: block; height: 1010px; margin-left: auto; margin-right: auto; width: 912px;"></p>
-
-<p>Para ver esto en la práctica ve a la demo en <a href="https://mdn.github.io/devtools-examples/whitespace-only-demo/index.html">https://mdn.github.io/devtools-examples/whitespace-only-demo/index.html</a>.</p>
-
-<h2 id="Elemento_menú_contextual_emergente">Elemento: menú contextual emergente</h2>
-
-<p>Puedes realizar ciertas tareas comunes en un elemento utilizando su menú contextual emergente. Para activar este menú, haz clic derecho en el elemento. El menú contiene los siguientes elementos - haz clic en los enlaces para encontrar la descripción de cada comando en {{anch("Context menu reference")}}:</p>
-
-<ul>
- <li><a href="#Edit as HTML">Editar como HTML</a></li>
- <li><a href="#Create New Node">Crear nodo nuevo</a></li>
- <li><a href="#Duplicate Node">Duplicar nodo</a></li>
- <li><a href="#Delete Node">Eliminar nodo</a></li>
- <li>Atributos
-  <ul>
-   <li><a href="#Attribute/Add Attribute">Añadir atributo</a></li>
-   <li><a href="#Attribute/Copy Attribute">Copiar valor del atributo</a></li>
-   <li><a href="#Attribute/Edit Attribute">Editar atributo</a></li>
-   <li><a href="#Attribute/Remove Attribute">Eliminar atributo</a></li>
-  </ul>
- </li>
- <li><a href="#:hover">:hover</a></li>
- <li><a href="#:active">:active</a></li>
- <li><a href="#:focus">:focus</a></li>
- <li>Copiar
-  <ul>
-   <li><a href="#Copy Inner HTML">HTML interno</a></li>
-   <li><a href="#Copy Outer HTML">HTML externo</a></li>
-   <li><a href="#Copy Unique Selector">Selector CSS</a></li>
-   <li><a href="#Copy CSS Path">Ruta CSS</a></li>
-   <li><a href="#Copy XPath">XPath</a></li>
-   <li><a href="#Copy Image Data-URL">Data-URL de imagen</a></li>
-  </ul>
- </li>
- <li>Pegar
-  <ul>
-   <li><a href="#Paste Inner HTML">HTML interno</a></li>
-   <li><a href="#Paste Outer HTML">HTML externo</a></li>
-   <li><a href="#Paste/Before">Antes</a></li>
-   <li><a href="#Paste/After">Detrás</a></li>
-   <li><a href="#Paste/As First Child">Como primer hijo</a></li>
-   <li><a href="#Paste/As Last Child">Como último hijo</a></li>
-  </ul>
- </li>
- <li><a href="#Expand All">Expandir todo</a></li>
- <li><a href="#Collapse">Contraer todo</a></li>
- <li><a href="#Scroll Into View">Desplazarse a la vista</a></li>
- <li><a href="#Screenshot Node">Obtener instantanea del nodo</a></li>
- <li><a href="#Use in Console">Usar en consola</a></li>
- <li><a href="#Show DOM Properties">Mostrar propiedades del DOM</a></li>
- <li><a href="#Open Link in New Tab">Abrir enlace en una pestaña nueva</a> *</li>
- <li><a href="#Open File in Debugger">Abrir archivo en depurador</a> *</li>
- <li><a href="#Open File in Style-Editor">Abrir archivo en editor de estilos</a> *</li>
- <li><a href="#Copy Link Address">Copiar la ruta del enlace</a> *</li>
-</ul>
-
-<p>* Estas opciones sólo aparecen en determinados contextos, por ejemplo, la opción "Abrir archivo en el editor de estilo" sólo aparece cuando haces clic con el botón contextual sobre el enlace a un archivo CSS.</p>
-
-<h3 id="Context_menu_reference">Context menu reference</h3>
-
-<div class="note">
-<p><strong>Nota</strong>: A partir de Firefox 49 el menú contextual se reorganizó significativamente para hacerlo más compacto. No te preocupes si la estructura de tu menú es ligeramente diferente de la que se muestra arriba: estarán disponibles las mismas opciones</p>
-</div>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td style="width: 30%;"><a id="Edit as HTML">Edit as /en-US/docs/HTML</a></td>
-   <td>
-    <p><a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#Editing_HTML">Editar el HTML del elemento</a></p>
-   </td>
-  </tr>
-  <tr>
-   <td><a id="Copy Inner HTML">(Copy) Inner HTML</a></td>
-   <td>Copiar el HTML interno para el elemento.</td>
-  </tr>
-  <tr>
-   <td><a id="Copy Outer HTML">(Copy) Outer HTML</a></td>
-   <td>
-    <p>Copiar el HTML externo para el elemento.</p>
-
-    <p>Presione <kbd>Ctrl</kbd> + <kbd>C</kbd> (o <kbd>Cmd</kbd> + <kbd>C</kbd> en Mac) realiza la misma acción.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><a id="Copy Unique Selector">(Copy) Unique Selector/CSS Selector</a></td>
-   <td>Copiar el selector CSS que selecciona únicamente el elemento</td>
-  </tr>
-  <tr>
-   <td><a id="Copy CSS Path">(Copy) CSS Path</a></td>
-   <td>Copiar el selector CSS que representa la ruta completa al elemento.</td>
-  </tr>
-  <tr>
-   <td><a id="Copy Image Data-URL">(Copy) Image Data-URL</a></td>
-   <td>Copiar imagen como data:// URL, l elemento selecionado es una imagen</td>
-  </tr>
-  <tr>
-   <td><a id="Copy Attribute">(Copy) Attribute</a></td>
-   <td>
-    <p>Copiar el atributo del elemento.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><a id="Show DOM Properties">Show DOM P/en-US/docs/roperties</a></td>
-   <td>Abrir la <a href="/es/docs/Tools/Web_Console#The_split_console">split console</a> e introducir el comando "<code>inspect($0)</code>" para <a href="/en-US/docs/Tools/Web_Console#Inspecting_objects">inspect</a> el elemento actualmente selecionado.</td>
-  </tr>
-  <tr>
-   <td><a id="Use in Console">Use in Console</a></td>
-   <td>
-    <div class="geckoVersionNote">
-    <p>Nuevo en Firefox 43<a href="/en-US/docs/">(Copy) Image Data-URL (Copy) Attribute </a></p>
-    </div>
-    Asigna el nodo actualmente seleccionado a una variable llamada <code>temp0</code> (o <code>temp1</code> si <code>temp0</code> esta ya asignado, y así sucesivamente), entonces abre la <a href="/es/docs/Tools/Web_Console#The_split_console">split console</a>,que le permite interactuar con ese nodo utilizando la línea de comandos de la consola.</td>
-  </tr>
-  <tr>
-   <td><a id="Expand All">Expand All</a></td>
-   <td>
-    <div class="geckoVersionNote">
-    <p>Nuevo en Firefox 44</p>
-    </div>
-    En la vista de árbol, expande el elemento actual y todos los elementos debajo de él. Esto equivale a mantener presionada la tecla <kbd>Alt</kbd> y hacer clic en el triángulo antes del elemento.</td>
-  </tr>
-  <tr>
-   <td><a id="Collapse">Collapse</a></td>
-   <td>
-    <div class="geckoVersionNote">
-    <p>Nuevo en Firefox 44</p>
-    </div>
-    En la vista de árbol, contrae el elemento actual. Esto equivale a hacer clic en la flecha de acceso situada junto al elemento que se ha expandido.</td>
-  </tr>
-  <tr>
-   <td><a id="Paste Inner HTML">(Paste) Inner HTML</a></td>
-   <td>Pegar el contenido del portapapeles en el nodo como su <a href="/es/docs/Web/API/element.innerHTML">HTML interno</a>.</td>
-  </tr>
-  <tr>
-   <td><a id="Paste Outer HTML">(Paste) Outer HTML</a></td>
-   <td>Pegar el contenido del portapapeles en el nodo como su <a href="/es/docs/Web/API/element.outerHTML">HTML externo</a>.</td>
-  </tr>
-  <tr>
-   <td><a id="Paste/Before">(Paste) Before</a></td>
-   <td>Pegar el contenido del portapapeles en el documento inmediatamente antes de este nodo</td>
-  </tr>
-  <tr>
-   <td><a id="Paste/After">(Paste) After</a></td>
-   <td>Pegar el contenido del portapapeles en el documento inmediatamente después de este nodo</td>
-  </tr>
-  <tr>
-   <td><a id="Paste/As First Child">(Paste) As First Child</a></td>
-   <td>Pegar el contenido del portapapeles en el documento como primerdescendiente de este nodo</td>
-  </tr>
-  <tr>
-   <td><a id="Paste/As Last Child">(Paste) As Last Child</a></td>
-   <td>Pegar el contenido del portapapeles en el documento como último descendiente de este nodo</td>
-  </tr>
-  <tr>
-   <td><a id="Scroll Into View">Scroll Into View</a></td>
-   <td>
-    <p>Desplazamiento en la página web para que el nodo seleccionado sea visible.</p>
-
-    <p>Desde Firefox 44, pulsando el atajo de teclado <kbd>S</kbd> también sirve para desplazarse en la página hasta que el nodo seleccionado está a la vista.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><a id="Screenshot Node">Screenshot Node</a></td>
-   <td>Hace una captura del nodo seleccionado y la guarda en tu directorio de Descargas. Ver <a href="/es/docs/Tools/Taking_screenshots">Taking screenshots</a>.</td>
-  </tr>
-  <tr>
-   <td><a id="Create New Node">Create New Node</a></td>
-   <td>Crea un nuevo elemento &lt;div&gt; como último descendiente del elemento actualmente seleccionado. Ver <a href="#Inserting_new_nodes">Inserting new nodes</a>.</td>
-  </tr>
-  <tr>
-   <td><a id="Duplicate Node">Duplicate Node</a></td>
-   <td>
-    <div class="geckoVersionNote">
-    <p>Nuevo en Firefox 44</p>
-    </div>
-
-    <p>Crear una copia de este elemento e insertarla inmediatamente antes de este elemento.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><a id="Delete Node">Delete Node</a></td>
-   <td>Elimina el elemento del DOM.</td>
-  </tr>
-  <tr>
-   <td><a id="Attribute/Add Attribute">Attribute/Add Attribute</a></td>
-   <td>
-    <div class="geckoVersionNote">
-    <p>Nuevo en Firefox 44</p>
-    </div>
-    Añade un atributo al elemento.</td>
-  </tr>
-  <tr>
-   <td><a id="Attribute/Edit Attribute">Attribute/Edit Attribute</a></td>
-   <td>
-    <div class="geckoVersionNote">
-    <p>Nuevo en Firefox 44</p>
-    </div>
-    (solo cuando se invoca en un atributo) Editar el atributo.</td>
-  </tr>
-  <tr>
-   <td><a id="Attribute/Remove Attribute">Attribute/Remove Attribute</a></td>
-   <td>
-    <div class="geckoVersionNote">
-    <p>Nuevo en Firefox 44</p>
-    </div>
-    (solo cuando se invoca en un atributo) Suprimir el atributo.</td>
-  </tr>
-  <tr>
-   <td><a id="Open Link in New Tab">Open Link in New Tab</a></td>
-   <td>(solo cuando se invoca sobre un enlace como atributo href) Abrir el item enlazado en una nueva pestaña.</td>
-  </tr>
-  <tr>
-   <td><a id="Open File in Debugger">Open File in Debugger</a></td>
-   <td>(solo cuando se invoca sobre un enlace a un archivo de código JS) Abrir el archivo enlazado en el depurador.</td>
-  </tr>
-  <tr>
-   <td><a id="Open File in Style-Editor">Open File in Style-Editor</a></td>
-   <td>(solo cuando se invoca sobre un enlace a un archivo de código CSS) Abrir el archivo CSS enlazado en un editor de estilos</td>
-  </tr>
-  <tr>
-   <td><a id="Copy Link Address">Copy Link Address</a></td>
-   <td>(solo cuando se invoca en una URL) Copiar la URL.</td>
-  </tr>
-  <tr>
-   <td><a id=":hover">:hover</a></td>
-   <td>Selecciona la pseudoclase CSS <a href="/en-US/docs/Web/CSS/:hover" title="/es/docs/Web/CSS/:hover">:hover</a></td>
-  </tr>
-  <tr>
-   <td><a id=":active">:active</a></td>
-   <td>Selecciona la pseudoclase CSS <a href="/en-US/docs/Web/CSS/:active" title="/es/docs/Web/CSS/:active">:active</a></td>
-  </tr>
-  <tr>
-   <td><a id=":focus">:focus</a></td>
-   <td>Selecciona la pseudoclase CSS <a href="/en-US/docs/Web/CSS/:focus" title="/es/docs/Web/CSS/:focus">:focus</a> CSS</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Editar_HTML">Editar HTML</h2>
-
-<p> </p>
-
-<p>Puedes editar el HTML - etiquetas, atributos y contenido - directamente en el panel HTML: haz doble clic en el texto que quieras editar, modifícalo y pulsa <kbd>Enter</kbd> para ver los cambios reflejados inmediatamente.</p>
-
-<p>Para editar el HTML externo de un elemento (<a href="/es/docs/Web/API/Element.outerHTML">HTML externo</a>), activa el menú emergente del elemento y selecciona "Editar como HTML". Verás un cuadro de texto en el panel HTML:</p>
-
-<p><img alt="Edit HTML directly in the Inspector panel in Firefox 57" src="https://mdn.mozillademos.org/files/15505/57-edit-as-html.png" style="display: block; height: 332px; margin-left: auto; margin-right: auto; width: 600px;"></p>
-
-<p>Aquí puedes añadir cualquier HTML: cambiar la etiqueta del elemento, cambiar elementos existentes o añadir otros nuevos. Una vez que hagas clic fuera del cuadro, los cambios se aplican a la página.</p>
-
-<p>A partir de Firefox 52, si estás editando HTML, el menú contextual que verás es el habitual al trabajar con texto editable:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14522/editable-context-menu.png" style="display: block; height: 241px; margin-left: auto; margin-right: auto; width: 200px;"></p>
-
-<h3 id="Copiar_y_pegar">Copiar y pegar</h3>
-
-<p>Puedes usar el <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#Element_popup_menu">menú emergente</a> desplegable para copiar nodos en el árbol HTML y pegarlos en la ubicación deseada.</p>
-
-<h3 id="Arrastrar_y_Soltar_(Drag_and_drop)">Arrastrar y Soltar (Drag and drop)</h3>
-
-<p>Puedes editar HTML moviendo nodos en el árbol HTML. Simplemente haz clic manteniendo presionado sobre cualquier elemento y arrástralo hacia arriba o hacia abajo en el árbol. Cuando sueltes el botón del ratón, el elemento se insertará en la posición correspondiente:</p>
-
-<p>{{EmbedYouTube("oI-a035nfWk")}}</p>
-
-<p>A partir de Firefox 44, puedes cancelar el arrastrar y soltar pulsando la tecla <kbd>Esc</kbd> .</p>
-
-<h3 id="Insertar_nuevos_nodos">Insertar nuevos nodos</h3>
-
-<div class="geckoVersionNote">Nuevo en Firefox 48</div>
-
-<p>A partir de Firefox 48, hay un icono "+" en la parte superior de la vista de marcado:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13082/inspector-insert-node.png" style="display: block; height: 337px; margin-left: auto; margin-right: auto; width: 547px;"></p>
-
-<p>Haz clic en este icono para insertar un <code><a href="/es/docs/Web/HTML/Element/div">&lt;div&gt;</a></code> vacío en el documento como el último hijo del elemento seleccionado actualmente. A continuación, puedes editar el contenido y el estilo del nuevo nodo tal como lo harías con cualquier otro nodo del documento.</p>
-
-<p>{{EmbedYouTube("NG5daffvVZM")}}</p>
-
-<p>Puedes acceder a la misma funcionalidad utilizando el menú desplegable "Crear nuevo nodo".</p>
-
-<p>Ten en cuenta que este botón está desactivado si el tipo de elemento seleccionado es tal que añadir un último hijo no produciría ningún efecto (por ejemplo, si es un elemento <code><a href="/es/docs/Web/HTML/Element/html">&lt;html&gt;</a></code> o <code><a href="/es/docs/Web/HTML/Element/iframe">&lt;iframe&gt;</a></code>). Sin embargo, está habilitado en lugares donde no es válido insertar <code>&lt;div&gt;</code>, como <code><a href="/es/docs/Web/HTML/Element/style">&lt;style&gt;</a></code> o <code><a href="/es/docs/Web/HTML/Element/link">&lt;link&gt;</a></code>. En estos casos, el elemento se añade como texto.</p>
diff --git a/files/es/tools/page_inspector/how_to/examine_and_edit_html/index.html b/files/es/tools/page_inspector/how_to/examine_and_edit_html/index.html
new file mode 100644
index 0000000000..9d0e9438e8
--- /dev/null
+++ b/files/es/tools/page_inspector/how_to/examine_and_edit_html/index.html
@@ -0,0 +1,365 @@
+---
+title: Examinar y editar HTML
+slug: Tools/Page_Inspector/How_to/Examine_and_edit_HTML
+tags:
+  - Guía
+  - Herramientas
+  - Inspector
+  - Tools
+translation_of: Tools/Page_Inspector/How_to/Examine_and_edit_HTML
+original_slug: Tools/Page_Inspector/How_to/Examinar_y_editar_HTML
+---
+<p>Puedes examinar y editar el HTML de la página en el <a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/UI_Tour#HTML_pane">panel HTML</a>.</p>
+
+<h2 id="Navegar_en_HTML">Navegar en HTML</h2>
+
+<h3 id="HTML_breadcrumbs_(migas_de_pan)">HTML breadcrumbs (migas de pan)</h3>
+
+<p>En la parte inferior del panel HTML hay una barra de navegación de migas de pan. Muestra la jerarquía completa en el documento para la rama que contiene el elemento seleccionado:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15499/57-html-panel.png" style="display: block; height: 274px; margin-left: auto; margin-right: auto; width: 633px;"></p>
+
+<p>Pasar el ratón sobre cada miguita de pan destaca ese elemento de la página.</p>
+
+<p>La barra breadcrumbs tiene sus propios <a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/Keyboard_shortcuts#Breadcrumbs_bar">atajos de teclado</a>.</p>
+
+<div class="note">
+<p>Ten en cuenta que antes de Firefox 48, esta barra de herramientas estaba en la parte superior del panel HTML.</p>
+</div>
+
+<h3 id="Buscar">Buscar</h3>
+
+<p>A partir de Firefox 45, el campo de búsqueda del Inspector de páginas busca coincidencias en todo el marcado del documento actual y en cualquier frame.</p>
+
+<p>Para empezar a buscar un marcador, haz clic en el cuadro de búsqueda para expandirlo o presiona <kbd>Ctrl</kbd> + <kbd>F</kbd> , o <kbd>Cmd</kbd> + <kbd>F</kbd> en Mac.</p>
+
+<p>A medida que escribes, en la ventana emergente se autocompletarán sugerencias con los atributos de clase o de ID que coincidan con el término de búsqueda actual:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/15495/html-code-search.png" style="display: block; height: 398px; margin-left: auto; margin-right: auto; width: 900px;"></p>
+
+<p>Presiona <kbd>Up</kbd> y <kbd>Down</kbd> para desplazarte por las sugerencias, <kbd>Tab</kbd> para elegir la sugerencia actual y entonces <kbd>Enter</kbd> para seleccionar el primer nodo con ese atributo.</p>
+
+<p>Si sólo introduces el término de búsqueda sin seleccionar un valor entre las sugerencias, el término de búsqueda se aplicará al texto completo del documento, incluyendo todos los nombres y valores de atributos y el contenido de texto de los nodos.</p>
+
+<p>{{EmbedYouTube("AKBhnfp1Opo")}}</p>
+
+<p>Para desplazarte por las sugerencias presiona <kbd>Enter</kbd> . A partir de Firefox 48 es posible el desplazamiento hacia atrás con <kbd>Shift</kbd> + <kbd>Enter</kbd> .</p>
+
+<h3 id="Árbol_HTML">Árbol HTML</h3>
+
+<p>El resto del panel muestra el HTML de la página como un árbol (esta interfaz de usuario también se llama Vista de marcado). Justo a la izquierda de cada nodo hay una flecha: haz clic en la flecha para desplegar el nodo. Si mantienes pulsada la tecla <kbd>Alt</kbd> mientras haces clic en la flecha, se desplegará el nodo y todos los nodos situados debajo de él.</p>
+
+<p><img alt="The new Firefox 57 inspector HTML tree." src="https://mdn.mozillademos.org/files/15503/57-html-tree.png" style="display: block; height: 433px; margin-left: auto; margin-right: auto; width: 600px;"></p>
+
+<p>Mover el ratón sobre un nodo del árbol destaca el elemento en la página.</p>
+
+<p>Los nodos no-visibles se representan descoloridos o desaturados. La invisibilidad puede deberse a razones diversas, entre ellas el uso de <code><a href="/es/docs/Web/CSS/display">display: none</a></code>, o que el elemento no tenga ninguna dimensión.</p>
+
+<p>A partir de Firefox 53 se muestra una elipsis entre la etiqueta de apertura y cierre de un elemento si el nodo está colapsado y contiene más contenido. Antes de Firefox 53, era imposible determinar si un nodo colapsado tenía hijos. Ahora los hijos se indican en el árbol con este icono: <img alt="" src="https://mdn.mozillademos.org/files/14925/child-node-indicator.png" style="height: 24px; width: 32px;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Hay atajos de teclado útiles para usar en el árbol HTML — ve a la <a href="/es/docs/Tools/Keyboard_shortcuts#HTML_pane">lista de atajos de teclado del panel HTML</a>.</p>
+</div>
+
+<h3 id="before_y_after">::before y ::after</h3>
+
+<p>Desde Firefox 35 en adelante, puede inspeccionar los pseudoelementos añadidos usando {{cssxref("::before")}} y {{cssxref("::after")}}:</p>
+
+<p>{{EmbedYouTube("ecfqTGvzsNc")}}</p>
+
+<h3 id="Whitespace-only_text_nodes">Whitespace-only text nodes</h3>
+
+<div class="geckoVersionNote">Nuevo en Firefox 52</div>
+
+<p>Los desarrolladores web no escriben todo su código en una sola línea de texto. Introducen espacios en blanco con <kbd>Space</kbd> , <kbd>Return</kbd> , y <kbd>Tab</kbd> entre sus elementos HTML para que el marcado sea más legible.</p>
+
+<p>Normalmente este espacio en blanco parece no tener efecto ni salida visual, pero de hecho, cuando un navegador analiza HTML genera automáticamente nodos de texto anónimos para elementos que no están contenidos en un nodo. Esto incluye los espacios en blanco que hay después de cualquier tipo de texto.</p>
+
+<p>Si estos nodos de texto generados automáticamente están <a href="https://developer.mozilla.org/es/docs/Web/Guide/CSS/Visual_formatting_model#Inline-level_elements_and_inline_boxes">inline level</a>, los navegadores les asignarán una anchura y altura distinta de cero. Así puede que encuentres espacios extraños entre los elementos, incluso si no has puesto ningún margen o relleno en ellos.</p>
+
+<p>Desde Firefox 52, el Inspector muestra los nodos whitespace para que puedas saber de dónde vienen los huecos en su marcado.</p>
+
+<p>Los nodos Whitespace se representan con un punto: <img alt="" src="https://mdn.mozillademos.org/files/14931/new-whitespace-text-indicator.png" style="height: 23px; width: 30px;"> y cuando pasas el ratón sobre ellos muestra un tooltip explicativo</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14929/whitespace-text-nodes-2.png" style="display: block; height: 1010px; margin-left: auto; margin-right: auto; width: 912px;"></p>
+
+<p>Para ver esto en la práctica ve a la demo en <a href="https://mdn.github.io/devtools-examples/whitespace-only-demo/index.html">https://mdn.github.io/devtools-examples/whitespace-only-demo/index.html</a>.</p>
+
+<h2 id="Elemento_menú_contextual_emergente">Elemento: menú contextual emergente</h2>
+
+<p>Puedes realizar ciertas tareas comunes en un elemento utilizando su menú contextual emergente. Para activar este menú, haz clic derecho en el elemento. El menú contiene los siguientes elementos - haz clic en los enlaces para encontrar la descripción de cada comando en {{anch("Context menu reference")}}:</p>
+
+<ul>
+ <li><a href="#Edit as HTML">Editar como HTML</a></li>
+ <li><a href="#Create New Node">Crear nodo nuevo</a></li>
+ <li><a href="#Duplicate Node">Duplicar nodo</a></li>
+ <li><a href="#Delete Node">Eliminar nodo</a></li>
+ <li>Atributos
+  <ul>
+   <li><a href="#Attribute/Add Attribute">Añadir atributo</a></li>
+   <li><a href="#Attribute/Copy Attribute">Copiar valor del atributo</a></li>
+   <li><a href="#Attribute/Edit Attribute">Editar atributo</a></li>
+   <li><a href="#Attribute/Remove Attribute">Eliminar atributo</a></li>
+  </ul>
+ </li>
+ <li><a href="#:hover">:hover</a></li>
+ <li><a href="#:active">:active</a></li>
+ <li><a href="#:focus">:focus</a></li>
+ <li>Copiar
+  <ul>
+   <li><a href="#Copy Inner HTML">HTML interno</a></li>
+   <li><a href="#Copy Outer HTML">HTML externo</a></li>
+   <li><a href="#Copy Unique Selector">Selector CSS</a></li>
+   <li><a href="#Copy CSS Path">Ruta CSS</a></li>
+   <li><a href="#Copy XPath">XPath</a></li>
+   <li><a href="#Copy Image Data-URL">Data-URL de imagen</a></li>
+  </ul>
+ </li>
+ <li>Pegar
+  <ul>
+   <li><a href="#Paste Inner HTML">HTML interno</a></li>
+   <li><a href="#Paste Outer HTML">HTML externo</a></li>
+   <li><a href="#Paste/Before">Antes</a></li>
+   <li><a href="#Paste/After">Detrás</a></li>
+   <li><a href="#Paste/As First Child">Como primer hijo</a></li>
+   <li><a href="#Paste/As Last Child">Como último hijo</a></li>
+  </ul>
+ </li>
+ <li><a href="#Expand All">Expandir todo</a></li>
+ <li><a href="#Collapse">Contraer todo</a></li>
+ <li><a href="#Scroll Into View">Desplazarse a la vista</a></li>
+ <li><a href="#Screenshot Node">Obtener instantanea del nodo</a></li>
+ <li><a href="#Use in Console">Usar en consola</a></li>
+ <li><a href="#Show DOM Properties">Mostrar propiedades del DOM</a></li>
+ <li><a href="#Open Link in New Tab">Abrir enlace en una pestaña nueva</a> *</li>
+ <li><a href="#Open File in Debugger">Abrir archivo en depurador</a> *</li>
+ <li><a href="#Open File in Style-Editor">Abrir archivo en editor de estilos</a> *</li>
+ <li><a href="#Copy Link Address">Copiar la ruta del enlace</a> *</li>
+</ul>
+
+<p>* Estas opciones sólo aparecen en determinados contextos, por ejemplo, la opción "Abrir archivo en el editor de estilo" sólo aparece cuando haces clic con el botón contextual sobre el enlace a un archivo CSS.</p>
+
+<h3 id="Context_menu_reference">Context menu reference</h3>
+
+<div class="note">
+<p><strong>Nota</strong>: A partir de Firefox 49 el menú contextual se reorganizó significativamente para hacerlo más compacto. No te preocupes si la estructura de tu menú es ligeramente diferente de la que se muestra arriba: estarán disponibles las mismas opciones</p>
+</div>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td style="width: 30%;"><a id="Edit as HTML">Edit as /en-US/docs/HTML</a></td>
+   <td>
+    <p><a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#Editing_HTML">Editar el HTML del elemento</a></p>
+   </td>
+  </tr>
+  <tr>
+   <td><a id="Copy Inner HTML">(Copy) Inner HTML</a></td>
+   <td>Copiar el HTML interno para el elemento.</td>
+  </tr>
+  <tr>
+   <td><a id="Copy Outer HTML">(Copy) Outer HTML</a></td>
+   <td>
+    <p>Copiar el HTML externo para el elemento.</p>
+
+    <p>Presione <kbd>Ctrl</kbd> + <kbd>C</kbd> (o <kbd>Cmd</kbd> + <kbd>C</kbd> en Mac) realiza la misma acción.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><a id="Copy Unique Selector">(Copy) Unique Selector/CSS Selector</a></td>
+   <td>Copiar el selector CSS que selecciona únicamente el elemento</td>
+  </tr>
+  <tr>
+   <td><a id="Copy CSS Path">(Copy) CSS Path</a></td>
+   <td>Copiar el selector CSS que representa la ruta completa al elemento.</td>
+  </tr>
+  <tr>
+   <td><a id="Copy Image Data-URL">(Copy) Image Data-URL</a></td>
+   <td>Copiar imagen como data:// URL, l elemento selecionado es una imagen</td>
+  </tr>
+  <tr>
+   <td><a id="Copy Attribute">(Copy) Attribute</a></td>
+   <td>
+    <p>Copiar el atributo del elemento.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><a id="Show DOM Properties">Show DOM P/en-US/docs/roperties</a></td>
+   <td>Abrir la <a href="/es/docs/Tools/Web_Console#The_split_console">split console</a> e introducir el comando "<code>inspect($0)</code>" para <a href="/en-US/docs/Tools/Web_Console#Inspecting_objects">inspect</a> el elemento actualmente selecionado.</td>
+  </tr>
+  <tr>
+   <td><a id="Use in Console">Use in Console</a></td>
+   <td>
+    <div class="geckoVersionNote">
+    <p>Nuevo en Firefox 43<a href="/en-US/docs/">(Copy) Image Data-URL (Copy) Attribute </a></p>
+    </div>
+    Asigna el nodo actualmente seleccionado a una variable llamada <code>temp0</code> (o <code>temp1</code> si <code>temp0</code> esta ya asignado, y así sucesivamente), entonces abre la <a href="/es/docs/Tools/Web_Console#The_split_console">split console</a>,que le permite interactuar con ese nodo utilizando la línea de comandos de la consola.</td>
+  </tr>
+  <tr>
+   <td><a id="Expand All">Expand All</a></td>
+   <td>
+    <div class="geckoVersionNote">
+    <p>Nuevo en Firefox 44</p>
+    </div>
+    En la vista de árbol, expande el elemento actual y todos los elementos debajo de él. Esto equivale a mantener presionada la tecla <kbd>Alt</kbd> y hacer clic en el triángulo antes del elemento.</td>
+  </tr>
+  <tr>
+   <td><a id="Collapse">Collapse</a></td>
+   <td>
+    <div class="geckoVersionNote">
+    <p>Nuevo en Firefox 44</p>
+    </div>
+    En la vista de árbol, contrae el elemento actual. Esto equivale a hacer clic en la flecha de acceso situada junto al elemento que se ha expandido.</td>
+  </tr>
+  <tr>
+   <td><a id="Paste Inner HTML">(Paste) Inner HTML</a></td>
+   <td>Pegar el contenido del portapapeles en el nodo como su <a href="/es/docs/Web/API/element.innerHTML">HTML interno</a>.</td>
+  </tr>
+  <tr>
+   <td><a id="Paste Outer HTML">(Paste) Outer HTML</a></td>
+   <td>Pegar el contenido del portapapeles en el nodo como su <a href="/es/docs/Web/API/element.outerHTML">HTML externo</a>.</td>
+  </tr>
+  <tr>
+   <td><a id="Paste/Before">(Paste) Before</a></td>
+   <td>Pegar el contenido del portapapeles en el documento inmediatamente antes de este nodo</td>
+  </tr>
+  <tr>
+   <td><a id="Paste/After">(Paste) After</a></td>
+   <td>Pegar el contenido del portapapeles en el documento inmediatamente después de este nodo</td>
+  </tr>
+  <tr>
+   <td><a id="Paste/As First Child">(Paste) As First Child</a></td>
+   <td>Pegar el contenido del portapapeles en el documento como primerdescendiente de este nodo</td>
+  </tr>
+  <tr>
+   <td><a id="Paste/As Last Child">(Paste) As Last Child</a></td>
+   <td>Pegar el contenido del portapapeles en el documento como último descendiente de este nodo</td>
+  </tr>
+  <tr>
+   <td><a id="Scroll Into View">Scroll Into View</a></td>
+   <td>
+    <p>Desplazamiento en la página web para que el nodo seleccionado sea visible.</p>
+
+    <p>Desde Firefox 44, pulsando el atajo de teclado <kbd>S</kbd> también sirve para desplazarse en la página hasta que el nodo seleccionado está a la vista.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><a id="Screenshot Node">Screenshot Node</a></td>
+   <td>Hace una captura del nodo seleccionado y la guarda en tu directorio de Descargas. Ver <a href="/es/docs/Tools/Taking_screenshots">Taking screenshots</a>.</td>
+  </tr>
+  <tr>
+   <td><a id="Create New Node">Create New Node</a></td>
+   <td>Crea un nuevo elemento &lt;div&gt; como último descendiente del elemento actualmente seleccionado. Ver <a href="#Inserting_new_nodes">Inserting new nodes</a>.</td>
+  </tr>
+  <tr>
+   <td><a id="Duplicate Node">Duplicate Node</a></td>
+   <td>
+    <div class="geckoVersionNote">
+    <p>Nuevo en Firefox 44</p>
+    </div>
+
+    <p>Crear una copia de este elemento e insertarla inmediatamente antes de este elemento.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><a id="Delete Node">Delete Node</a></td>
+   <td>Elimina el elemento del DOM.</td>
+  </tr>
+  <tr>
+   <td><a id="Attribute/Add Attribute">Attribute/Add Attribute</a></td>
+   <td>
+    <div class="geckoVersionNote">
+    <p>Nuevo en Firefox 44</p>
+    </div>
+    Añade un atributo al elemento.</td>
+  </tr>
+  <tr>
+   <td><a id="Attribute/Edit Attribute">Attribute/Edit Attribute</a></td>
+   <td>
+    <div class="geckoVersionNote">
+    <p>Nuevo en Firefox 44</p>
+    </div>
+    (solo cuando se invoca en un atributo) Editar el atributo.</td>
+  </tr>
+  <tr>
+   <td><a id="Attribute/Remove Attribute">Attribute/Remove Attribute</a></td>
+   <td>
+    <div class="geckoVersionNote">
+    <p>Nuevo en Firefox 44</p>
+    </div>
+    (solo cuando se invoca en un atributo) Suprimir el atributo.</td>
+  </tr>
+  <tr>
+   <td><a id="Open Link in New Tab">Open Link in New Tab</a></td>
+   <td>(solo cuando se invoca sobre un enlace como atributo href) Abrir el item enlazado en una nueva pestaña.</td>
+  </tr>
+  <tr>
+   <td><a id="Open File in Debugger">Open File in Debugger</a></td>
+   <td>(solo cuando se invoca sobre un enlace a un archivo de código JS) Abrir el archivo enlazado en el depurador.</td>
+  </tr>
+  <tr>
+   <td><a id="Open File in Style-Editor">Open File in Style-Editor</a></td>
+   <td>(solo cuando se invoca sobre un enlace a un archivo de código CSS) Abrir el archivo CSS enlazado en un editor de estilos</td>
+  </tr>
+  <tr>
+   <td><a id="Copy Link Address">Copy Link Address</a></td>
+   <td>(solo cuando se invoca en una URL) Copiar la URL.</td>
+  </tr>
+  <tr>
+   <td><a id=":hover">:hover</a></td>
+   <td>Selecciona la pseudoclase CSS <a href="/en-US/docs/Web/CSS/:hover" title="/es/docs/Web/CSS/:hover">:hover</a></td>
+  </tr>
+  <tr>
+   <td><a id=":active">:active</a></td>
+   <td>Selecciona la pseudoclase CSS <a href="/en-US/docs/Web/CSS/:active" title="/es/docs/Web/CSS/:active">:active</a></td>
+  </tr>
+  <tr>
+   <td><a id=":focus">:focus</a></td>
+   <td>Selecciona la pseudoclase CSS <a href="/en-US/docs/Web/CSS/:focus" title="/es/docs/Web/CSS/:focus">:focus</a> CSS</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Editar_HTML">Editar HTML</h2>
+
+<p> </p>
+
+<p>Puedes editar el HTML - etiquetas, atributos y contenido - directamente en el panel HTML: haz doble clic en el texto que quieras editar, modifícalo y pulsa <kbd>Enter</kbd> para ver los cambios reflejados inmediatamente.</p>
+
+<p>Para editar el HTML externo de un elemento (<a href="/es/docs/Web/API/Element.outerHTML">HTML externo</a>), activa el menú emergente del elemento y selecciona "Editar como HTML". Verás un cuadro de texto en el panel HTML:</p>
+
+<p><img alt="Edit HTML directly in the Inspector panel in Firefox 57" src="https://mdn.mozillademos.org/files/15505/57-edit-as-html.png" style="display: block; height: 332px; margin-left: auto; margin-right: auto; width: 600px;"></p>
+
+<p>Aquí puedes añadir cualquier HTML: cambiar la etiqueta del elemento, cambiar elementos existentes o añadir otros nuevos. Una vez que hagas clic fuera del cuadro, los cambios se aplican a la página.</p>
+
+<p>A partir de Firefox 52, si estás editando HTML, el menú contextual que verás es el habitual al trabajar con texto editable:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14522/editable-context-menu.png" style="display: block; height: 241px; margin-left: auto; margin-right: auto; width: 200px;"></p>
+
+<h3 id="Copiar_y_pegar">Copiar y pegar</h3>
+
+<p>Puedes usar el <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_HTML#Element_popup_menu">menú emergente</a> desplegable para copiar nodos en el árbol HTML y pegarlos en la ubicación deseada.</p>
+
+<h3 id="Arrastrar_y_Soltar_(Drag_and_drop)">Arrastrar y Soltar (Drag and drop)</h3>
+
+<p>Puedes editar HTML moviendo nodos en el árbol HTML. Simplemente haz clic manteniendo presionado sobre cualquier elemento y arrástralo hacia arriba o hacia abajo en el árbol. Cuando sueltes el botón del ratón, el elemento se insertará en la posición correspondiente:</p>
+
+<p>{{EmbedYouTube("oI-a035nfWk")}}</p>
+
+<p>A partir de Firefox 44, puedes cancelar el arrastrar y soltar pulsando la tecla <kbd>Esc</kbd> .</p>
+
+<h3 id="Insertar_nuevos_nodos">Insertar nuevos nodos</h3>
+
+<div class="geckoVersionNote">Nuevo en Firefox 48</div>
+
+<p>A partir de Firefox 48, hay un icono "+" en la parte superior de la vista de marcado:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13082/inspector-insert-node.png" style="display: block; height: 337px; margin-left: auto; margin-right: auto; width: 547px;"></p>
+
+<p>Haz clic en este icono para insertar un <code><a href="/es/docs/Web/HTML/Element/div">&lt;div&gt;</a></code> vacío en el documento como el último hijo del elemento seleccionado actualmente. A continuación, puedes editar el contenido y el estilo del nuevo nodo tal como lo harías con cualquier otro nodo del documento.</p>
+
+<p>{{EmbedYouTube("NG5daffvVZM")}}</p>
+
+<p>Puedes acceder a la misma funcionalidad utilizando el menú desplegable "Crear nuevo nodo".</p>
+
+<p>Ten en cuenta que este botón está desactivado si el tipo de elemento seleccionado es tal que añadir un último hijo no produciría ningún efecto (por ejemplo, si es un elemento <code><a href="/es/docs/Web/HTML/Element/html">&lt;html&gt;</a></code> o <code><a href="/es/docs/Web/HTML/Element/iframe">&lt;iframe&gt;</a></code>). Sin embargo, está habilitado en lugares donde no es válido insertar <code>&lt;div&gt;</code>, como <code><a href="/es/docs/Web/HTML/Element/style">&lt;style&gt;</a></code> o <code><a href="/es/docs/Web/HTML/Element/link">&lt;link&gt;</a></code>. En estos casos, el elemento se añade como texto.</p>
diff --git a/files/es/tools/page_inspector/how_to/examine_and_edit_the_box_model/index.html b/files/es/tools/page_inspector/how_to/examine_and_edit_the_box_model/index.html
new file mode 100644
index 0000000000..0c36514de7
--- /dev/null
+++ b/files/es/tools/page_inspector/how_to/examine_and_edit_the_box_model/index.html
@@ -0,0 +1,48 @@
+---
+title: Examinar y editar el modelo de cajas
+slug: Tools/Page_Inspector/How_to/Examine_and_edit_the_box_model
+tags:
+  - Guía
+  - Herramientas
+  - Tools
+translation_of: Tools/Page_Inspector/How_to/Examine_and_edit_the_box_model
+original_slug: Tools/Page_Inspector/How_to/Examinar_y_editar_el_modelo_de_cajasmodel
+---
+<h2 id="Visualización_del_modelo_de_caja">Visualización del modelo de caja</h2>
+
+<p>Con el <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Select_element_button">botón Seleccionar elemento</a> pulsado, si se pasa el ratón por encima de un elemento en la página, el <a href="/es/docs/Web/CSS/box_model">modelo de caja</a> para ese elemento se muestra superpuesto en la página:</p>
+
+<p>{{EmbedYouTube("vDRzN-svJHQ")}}</p>
+
+<p>También se muestra superpuesto en la página si en el panel HTML ponemos el cursor sobre la marca de un elemento :</p>
+
+<p>{{EmbedYouTube("xA4IxTttNLk")}}</p>
+
+<p>Si se trata de un elemento en línea que está dividido en varias filas, se destaca cada una de las líneas individuales que componen el elemento:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10349/inline-box-model.png" style="display: block; height: 186px; margin-left: auto; margin-right: auto; width: 351px;"></p>
+
+<h3 id="Vista_Modelo_de_Caja">Vista Modelo de Caja</h3>
+
+<p>Cuando se selecciona un elemento, podemos obtener una vista detallada del modelo de caja en dos de las vistas del panel CCS: <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Computed_view">Calculado</a> y Disposición:</p>
+
+<ul>
+ <li>en la vista Calculado aparece en primer término, seguido de la sección con el listado de reglas que se aplican al elemento;</li>
+ <li>en la vista Disposición está en segundo término, detrás de la sección 'Rejilla' y seguido de la sección Propiedades del modelo de caja (box-sizing, display, float, line-height, position y z-index) indicando sus valores</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14241/box-model.png" style="display: block; height: 232px; margin-left: auto; margin-right: auto; width: 610px;"></p>
+
+<p>Si ponemos el cursor sobre un valor en la vista modelo de caja al lado aparece un tooltip que nos indica de qué regla procede el valor:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14243/box-model-tooltip.png" style="display: block; height: 234px; margin-left: auto; margin-right: auto; width: 620px;"></p>
+
+<p>Si desplazamos el cursor sobre una parte del modelo de caja en la vista Modelo de caja, se resalta la parte correspondiente de la página y aparece otro tooltip con información indicando el elemento, su clase y/o ID y sus dimensiones (ancho x alto):</p>
+
+<p>{{EmbedYouTube("H3ZxRbbyfwI")}}</p>
+
+<h2 id="Edición_del_modelo_de_caja">Edición del modelo de caja</h2>
+
+<p>También podemos editar los valores en la <a href="/es/docs/Tools/Page_Inspector/How_to/Examine_and_edit_the_box_model#The_Box_Model_view">Vista Modelo de Caja</a>: hacer clic sobre un valor permite editarlo y ver los resultados inmediatamente en la página:</p>
+
+<p>{{EmbedYouTube("gHjDjM8GJ9I")}}</p>
diff --git a/files/es/tools/page_inspector/how_to/inspeccionar_y_seleccionar_colores/index.html b/files/es/tools/page_inspector/how_to/inspeccionar_y_seleccionar_colores/index.html
deleted file mode 100644
index f4ab42dabe..0000000000
--- a/files/es/tools/page_inspector/how_to/inspeccionar_y_seleccionar_colores/index.html
+++ /dev/null
@@ -1,26 +0,0 @@
----
-title: Inspeccionar y seleccionar colores
-slug: Tools/Page_Inspector/How_to/Inspeccionar_y_seleccionar_colores
-tags:
-  - Guía
-  - Herramientas
-  - Inspector
-translation_of: Tools/Page_Inspector/How_to/Inspect_and_select_colors
----
-<p>En la <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Rules_view">Vista reglas</a> del panel CSS, si una regla contiene un valor de color, verás una muestra del color junto al valor:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/6361/inspector-css-color-swatch.png" style="display: block; height: 158px; margin-left: auto; margin-right: auto; width: 487px;"></p>
-
-<p>Si haces clic en la muestra de color, verás una ventana emergente que te permite cambiar el color:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/7747/inspector-color-picker.png" style="display: block; height: 320px; margin-left: auto; margin-right: auto; width: 835px;"></p>
-
-<p>El selector de color incluye un icono de cuentagotas: al hacer clic en este icono, podrás utilizar el cuentagotas para seleccionar un nuevo color para el elemento:</p>
-
-<p>{{EmbedYouTube("0Zx1TN21QOo")}}</p>
-
-<p>A partir de Firefox 40, al hacer clic en la muestra de color mientras mantienes pulsada la tecla <kbd>Shift</kbd>, cambiará el formato de color: hexadecimal, HSL y RGB</p>
-
-<p>{{EmbedYouTube("gYL8-gxc1MA")}}</p>
-
-<p>Firefox 53 y versiones más recientes son compatibles con los valores de <a href="https://drafts.csswg.org/css-color/">CSS color level 4</a>.</p>
diff --git a/files/es/tools/page_inspector/how_to/inspect_and_select_colors/index.html b/files/es/tools/page_inspector/how_to/inspect_and_select_colors/index.html
new file mode 100644
index 0000000000..aac40b53ac
--- /dev/null
+++ b/files/es/tools/page_inspector/how_to/inspect_and_select_colors/index.html
@@ -0,0 +1,27 @@
+---
+title: Inspeccionar y seleccionar colores
+slug: Tools/Page_Inspector/How_to/Inspect_and_select_colors
+tags:
+  - Guía
+  - Herramientas
+  - Inspector
+translation_of: Tools/Page_Inspector/How_to/Inspect_and_select_colors
+original_slug: Tools/Page_Inspector/How_to/Inspeccionar_y_seleccionar_colores
+---
+<p>En la <a href="/es/docs/Tools/Page_Inspector/UI_Tour#Rules_view">Vista reglas</a> del panel CSS, si una regla contiene un valor de color, verás una muestra del color junto al valor:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6361/inspector-css-color-swatch.png" style="display: block; height: 158px; margin-left: auto; margin-right: auto; width: 487px;"></p>
+
+<p>Si haces clic en la muestra de color, verás una ventana emergente que te permite cambiar el color:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/7747/inspector-color-picker.png" style="display: block; height: 320px; margin-left: auto; margin-right: auto; width: 835px;"></p>
+
+<p>El selector de color incluye un icono de cuentagotas: al hacer clic en este icono, podrás utilizar el cuentagotas para seleccionar un nuevo color para el elemento:</p>
+
+<p>{{EmbedYouTube("0Zx1TN21QOo")}}</p>
+
+<p>A partir de Firefox 40, al hacer clic en la muestra de color mientras mantienes pulsada la tecla <kbd>Shift</kbd>, cambiará el formato de color: hexadecimal, HSL y RGB</p>
+
+<p>{{EmbedYouTube("gYL8-gxc1MA")}}</p>
+
+<p>Firefox 53 y versiones más recientes son compatibles con los valores de <a href="https://drafts.csswg.org/css-color/">CSS color level 4</a>.</p>
diff --git a/files/es/tools/page_inspector/how_to/open_the_inspector/index.html b/files/es/tools/page_inspector/how_to/open_the_inspector/index.html
new file mode 100644
index 0000000000..ced75d46de
--- /dev/null
+++ b/files/es/tools/page_inspector/how_to/open_the_inspector/index.html
@@ -0,0 +1,23 @@
+---
+title: Abrir el Inspector
+slug: Tools/Page_Inspector/How_to/Open_the_Inspector
+tags:
+  - Guía
+  - Herramientas
+  - Inspector
+  - Tools
+translation_of: Tools/Page_Inspector/How_to/Open_the_Inspector
+original_slug: Tools/Page_Inspector/How_to/Abrir_el_Inspector
+---
+<p>Hay dos maneras básicas para abrir el Inspector:</p>
+
+<ul>
+ <li><em>Si no tenemos seleccionado ningun elemento:</em> desde la barra de menú "Herramientas -&gt; Desarrollador Web -&gt; Inspector" ; o utilizando un <a href="https://developer.mozilla.org/es/docs/tools/Keyboard_shortcuts#Opening_and_closing_tools">atajo de teclado</a> equivalente</li>
+ <li>
+  <p><em>Si tenemos seleccionado un elemento: haz click derecho en un elemento de la página web y selecciona </em> "Inspeccionar elemento"</p>
+ </li>
+</ul>
+
+<p>El Inspector aparecerá en la parte inferior de la ventana del navegador:</p>
+
+<p><img alt="The all-new Inspector in Firefox 57 DevTools." src="https://mdn.mozillademos.org/files/15493/57-inspector-starfish.png" style="display: block; height: 647px; margin-left: auto; margin-right: auto; width: 845px;">Para empezar a aprender sobre el Inspector ve al <a href="https://developer.mozilla.org/es/docs/Tools/Page_Inspector/UI_Tour"> Tour por la UI</a>.</p>
diff --git a/files/es/tools/page_inspector/how_to/reposicionando_elementos_en_la_pagina/index.html b/files/es/tools/page_inspector/how_to/reposicionando_elementos_en_la_pagina/index.html
deleted file mode 100644
index bd926e4bed..0000000000
--- a/files/es/tools/page_inspector/how_to/reposicionando_elementos_en_la_pagina/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: Reposicionando elementos en la página
-slug: Tools/Page_Inspector/How_to/Reposicionando_elementos_en_la_pagina
-translation_of: Tools/Page_Inspector/How_to/Reposition_elements_in_the_page
----
-<div class="geckoVersionNote">Novedades en Firefox 48</div>
-
-<p>A partir de Firefox 48 puede mover elementos con <code>position: absolute</code> arrastrándolos alrededor de la página.</p>
-
-<p>{{EmbedYouTube("Or5HM1FFhvE")}}</p>
-
-<p>Si un elemento tiene su propiedad  <code>{{cssxref("position")}}</code> seteada en <code>absolute</code>, <code>relative</code> o <code>fixed</code> y una o más de las propiedades {{cssxref("top")}}, {{cssxref("bottom")}} , {{cssxref("left")}} or {{cssxref("right")}} , la <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#Computed_view">Vista del modelo de caja</a> muestra un botón:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14245/box-model-reposition.png" style="display: block; height: 472px; margin-left: auto; margin-right: auto; width: 610px;"></p>
-
-<p>Si hace click en ese botón, aparecen dos identificadores junto al elemento:</p>
-
-<p><img alt="Example for changing the position of an element within the content" src="https://mdn.mozillademos.org/files/12986/in-content-box-model-editing.png" style="display: block; height: 215px; margin-left: auto; margin-right: auto; width: 388px;"></p>
-
-<p>Puede utilizar estos identificadores para arrastrar el elemento alrededor de la página.</p>
-
-<p>Si el elemento está posicionado de forma absoluta, se muestran líneas discontinuas que representan el origen de desplazamiento. Para los elementos relativamente posicionados, las líneas discontinuas indican la posición original del nodo. Los desplazamientos están indicados por una línea y una descripción de herramientas para cada lado.</p>
diff --git a/files/es/tools/page_inspector/how_to/reposition_elements_in_the_page/index.html b/files/es/tools/page_inspector/how_to/reposition_elements_in_the_page/index.html
new file mode 100644
index 0000000000..2cc4c8791c
--- /dev/null
+++ b/files/es/tools/page_inspector/how_to/reposition_elements_in_the_page/index.html
@@ -0,0 +1,23 @@
+---
+title: Reposicionando elementos en la página
+slug: Tools/Page_Inspector/How_to/Reposition_elements_in_the_page
+translation_of: Tools/Page_Inspector/How_to/Reposition_elements_in_the_page
+original_slug: Tools/Page_Inspector/How_to/Reposicionando_elementos_en_la_pagina
+---
+<div class="geckoVersionNote">Novedades en Firefox 48</div>
+
+<p>A partir de Firefox 48 puede mover elementos con <code>position: absolute</code> arrastrándolos alrededor de la página.</p>
+
+<p>{{EmbedYouTube("Or5HM1FFhvE")}}</p>
+
+<p>Si un elemento tiene su propiedad  <code>{{cssxref("position")}}</code> seteada en <code>absolute</code>, <code>relative</code> o <code>fixed</code> y una o más de las propiedades {{cssxref("top")}}, {{cssxref("bottom")}} , {{cssxref("left")}} or {{cssxref("right")}} , la <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#Computed_view">Vista del modelo de caja</a> muestra un botón:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14245/box-model-reposition.png" style="display: block; height: 472px; margin-left: auto; margin-right: auto; width: 610px;"></p>
+
+<p>Si hace click en ese botón, aparecen dos identificadores junto al elemento:</p>
+
+<p><img alt="Example for changing the position of an element within the content" src="https://mdn.mozillademos.org/files/12986/in-content-box-model-editing.png" style="display: block; height: 215px; margin-left: auto; margin-right: auto; width: 388px;"></p>
+
+<p>Puede utilizar estos identificadores para arrastrar el elemento alrededor de la página.</p>
+
+<p>Si el elemento está posicionado de forma absoluta, se muestran líneas discontinuas que representan el origen de desplazamiento. Para los elementos relativamente posicionados, las líneas discontinuas indican la posición original del nodo. Los desplazamientos están indicados por una línea y una descripción de herramientas para cada lado.</p>
diff --git a/files/es/tools/performance/index.html b/files/es/tools/performance/index.html
new file mode 100644
index 0000000000..5aa048c2b0
--- /dev/null
+++ b/files/es/tools/performance/index.html
@@ -0,0 +1,92 @@
+---
+title: Rendimiento
+slug: Tools/Performance
+translation_of: Tools/Performance
+original_slug: Tools/Desempeño
+---
+<p>La herramienta de Rendimiento te da una visión general de la capacidad de respuesta del sitio que visitas así como de su JavaScript y el modelo de diseño. Con esta herramienta puedes generar un perfil o registro de un sitio web en un período de tiempo. En dicho perfil la herramienta te ofrece una <a href="/en-US/docs/Tools/Performance/UI_Tour#Waterfall_overview">vista general</a> de todas las acciones que tu navegador empleó para generar el sitio web así como una gráfica con el <a href="/en-US/docs/Tools/Performance/Frame_rate">tiempo de respuesta</a> de dicha pagina.</p>
+
+<p>Para examinar con más detalle los aspectos del perfil tienes tres herramientas auxiliares:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a>  muestra qué operaciones ejecutó el navegador, tales como el modelo de ejecución empleado, JavaScript, repaints y liberación de memoria.</li>
+ <li><a href="/en-US/docs/Tools/Performance/Call_Tree">Call Tree</a> muestra en qué funciones de JavaScript se requirió más tiempo del navegador.</li>
+ <li><a href="/en-US/docs/Tools/Performance/Flame_Chart">Flame Chart</a> muestra la pila de llamadas de JavaScript a lo largo de la grabación.</li>
+</ul>
+
+<p>{{EmbedYouTube("WBmttwfA_k8")}}</p>
+
+<hr>
+<h2 id="Preámbulo">Preámbulo</h2>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/docs/Tools/Performance/UI_Tour">UI Tour</a></dt>
+ <dd>
+ <p>Guía rápida de la interfaz para comenzar a manejar la herramienta de rendimiento.</p>
+ </dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/docs/Tools/Performance/How_to">How to</a></dt>
+ <dd>Tareas básicas: abrir la herramienta, crear, guardar, cargar y configurar las grabaciones.</dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h2 id="Componentes_de_la_herramienta_de_Rendimiento">Componentes de la herramienta de Rendimiento</h2>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/docs/Tools/Performance/Frame_rate">Frame rate</a></dt>
+ <dd>Comprender la capacidad de respuesta general de tu sitio.</dd>
+ <dt><a href="/en-US/docs/Tools/Performance/Call_Tree">Call Tree</a></dt>
+ <dd>Encontrar cuellos de botella en el JavaScript de tu sitio.</dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/docs/Tools/Performance/Waterfall">Waterfall</a></dt>
+ <dd>Comprender el trabajo que el navegador realiza cuando un usuario interactúa con el sitio web.</dd>
+ <dt><a href="/en-US/docs/Tools/Performance/Flame_Chart">Flame Chart</a></dt>
+ <dd>Ver qué funciones de JavaScript se ejecutan , y cuando , en el transcurso de la grabación.</dd>
+ <dd> </dd>
+</dl>
+</div>
+</div>
+
+<hr>
+<h2 id="Escenarios">Escenarios</h2>
+
+<div class="column-container">
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/docs/Tools/Performance/Scenarios/Animating_CSS_properties">Animating CSS properties</a></dt>
+ <dd>Utiliza Waterfall para entender cómo el navegador actualiza una página, y cómo las diferentes propiedades CSS pueden afectar al rendimiento.</dd>
+ <dd> </dd>
+</dl>
+</div>
+
+<div class="column-half">
+<dl>
+ <dt><a href="/en-US/docs/Tools/Performance/Scenarios/Intensive_JavaScript">Intensive JavaScript</a></dt>
+ <dd>Utiliza la velocidad de los fotogramas y la herramienta Waterfall para resaltar los problemas de rendimiento provocados por los JavaScript de larga duración y cómo los workers pueden ayudar en esta situación.</dd>
+</dl>
+</div>
+</div>
+
+<p> </p>
+
+<div class="column-half">
+<dl>
+ <dd> </dd>
+</dl>
+</div>
+
+<p> </p>
diff --git a/files/es/tools/performance/ui_tour/index.html b/files/es/tools/performance/ui_tour/index.html
new file mode 100644
index 0000000000..2ac5be7053
--- /dev/null
+++ b/files/es/tools/performance/ui_tour/index.html
@@ -0,0 +1,135 @@
+---
+title: Paseo por la interfaz de usuario
+slug: Tools/Performance/UI_Tour
+translation_of: Tools/Performance/UI_Tour
+original_slug: Tools/Desempeño/UI_Tour
+---
+<p>La interfaz de usuario (UI) de las herramientas de rendimiento, consta de cuatro partes principales:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13220/perf-tool-pieces.png" style="display: block; height: 702px; margin-left: auto; margin-right: auto; width: 1616px;"></p>
+
+<ul>
+ <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Toolbar">Barra de herramientas (Toolbar)</a></li>
+ <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Recordings_pane">Lista de grabaciones (Recordings pane)</a></li>
+ <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Recording_overview">Vista previa de la grabación (Recording overview)</a></li>
+ <li><a href="/es/docs/Tools/Desempeño/UI_Tour#Details_pane">Ventana de detalles (Details pane)</a>, que puede mostrar:
+  <ul>
+   <li><a href="/en-US/docs/Tools/Performance/Waterfall">Vista en cascada (Waterfall)</a></li>
+   <li><a href="/en-US/docs/Tools/Performance/Call_Tree">Árbol de llamadas (Call Tree)</a></li>
+   <li><a href="/en-US/docs/Tools/Performance/Flame_Chart">Gráfico de llama(Flame Chart)</a></li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Barra_de_herramientas_(Toolbar)">Barra de herramientas (Toolbar)</h2>
+
+<p>De izquierde a derecha la barra de herramientas contiene los siguientes botones:</p>
+
+<ul>
+ <li>
+  <p>Borrar la lista de grabaciones.</p>
+ </li>
+</ul>
+
+<div class="note">
+<p><em>Nota: Si haces esto, perderas cualquier grabación que no haya sido guardada.</em></p>
+</div>
+
+<ul>
+ <li>Inicia o detiene una grabación.</li>
+ <li>Importar una grabación previamente guardada.</li>
+ <li>Filtra los <a href="/en-US/docs/Tools/Performance/Waterfall#Markers">marcadores</a> que muestra la vista en cascada.</li>
+ <li>Cambia la vista activa en la <a href="/es/docs/Tools/Desempeño/UI_Tour#Details_pane">ventana de detalles</a>.</li>
+ <li>Muestra un popup con la configuración.</li>
+</ul>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13222/perf-toolbar.png" style="display: block; height: 434px; margin-left: auto; margin-right: auto; width: 1672px;"></p>
+
+<h2 id="Lista_de_grabaciones_(Recordings_pane)">Lista de grabaciones (Recordings pane)</h2>
+
+<p>La lista de grabaciones muestra todas las grabaciones activas, incluyendo las realizadas durante la sesion y las que hayas importado.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10917/perf-recordings-pane.png" style="display: block; height: 337px; margin-left: auto; margin-right: auto; width: 300px;"></p>
+
+<p>En el hay una grabación seleccionada en todo momento y esta se mostrara en el resto de la herramienta. Para seleccionar una grabación diferente, presiónala en la lista del panel. Para guardarla como un archivo JSON haz click en "Guardar".</p>
+
+<h2 id="Vista_previa_de_la_grabacion_(Recording_overview)">Vista previa de la grabacion (Recording overview)</h2>
+
+<p>Muestra un resumen de toda la grabación, donde el eje-x representa el tiempo.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10919/perf-overview.png" style="display: block; height: 164px; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<p>Contiene dos elementos: una vista previa de la vista en cascada y gráfico con el promedio de fotogramas.</p>
+
+<h3 id="Resumen_de_la_vista_en_cascada">Resumen de la vista en cascada</h3>
+
+<p>Nos presenta una versión comprimida de la <a href="/en-US/docs/Tools/Performance/Waterfall">vista en cascada</a>:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10923/perf-waterfall-overview.png" style="display: block; height: 76px; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<p>Las operaciones grabadas están codificadas con el mismo <a href="/en-US/docs/Tools/Performance/Waterfall#Markers">esquema de colores empleado para la vista en cascada</a> que se muestra en la ventana de detalles.</p>
+
+<h3 id="Gráfico_con_el_promedio_de_fotogramas">Gráfico con el promedio de fotogramas</h3>
+
+<p>El promedio de fotogramas nos da una idea de como el navegador responde durante la grabación:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10921/perf-frame-rate.png" style="display: block; height: 88px; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<p>Puedes consultar la entrada sobre el <a href="/en-US/docs/Tools/Performance/Frame_rate">promedio de fotogramas</a>.</p>
+
+<h3 id="Relacionando_eventos">Relacionando eventos</h3>
+
+<p>Como estos eventos están sincronizados, <span>puedes crear una </span>correlación entre ellos.</p>
+
+<p>Por ejemplo en la captura de pantalla inferior, una larga operación de pintado (<a href="/en-US/docs/Tools/Performance/Waterfall#Markers">representada con una barra verde</a> en el resumen de la vista en cascada) corresponde con una caída en el promedio de fotogramas:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10925/perf-overview-correlation.png" style="display: block; height: 494px; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<h3 id="Ampliando">Ampliando</h3>
+
+<p>Puedes usar la vista previa para seleccionar un trozo de la grabación para examinarlo con mas detalle. Al hacer esto, la ventana de detalles se actualizara con el contenido marcado. En la captura inferior hemos seleccionado la caída en el promedio de fotogramas y así podemos ver la operación de pintado con mas detalle:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10927/perf-zoomed.png" style="display: block; height: 416px; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<h2 id="Ventana_de_detalles_(Details_pane)">Ventana de detalles (Details pane)</h2>
+
+<p>La ventana de detalles muestra cualquier herramienta seleccionada. Para cambiar entre ellas, usa los botones de la <a href="/en-US/docs/Tools/Performance/UI_Tour#Toolbar">barra de herramientas</a>.</p>
+
+<h3 id="Vista_en_cascada">Vista en cascada</h3>
+
+<p>La vista en cascada da una vision de que esta haciendo el navegador durante la grabación: ejecutar Javascript, actualizar CSS,  actualizar la composición de la pagina y el rendimiento del redibujado. El eje-x representa el tiempo y las operaciones grabadas van apareciendo en forma de cascada, reflejando así la naturaleza que tiene el navegador el ejecutar las tareas en serie.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10929/perf-waterfall.png" style="display: block; height: 568px; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<p>Para aprender mas sobre la <a href="/en-US/docs/Tools/Performance/Waterfall">vista en cascada</a> puedes visitar su entrada.</p>
+
+<h3 id="Árbol_de_llamadas">Árbol de llamadas</h3>
+
+<p>El árbol de llamadas es una muestra del Javascript que se ejecuta en la pagina. Son una serie de muestras del estado del motor de Javascript y registra el stack de código ejecutado en el momento que se toma la muestra. Estadísticamente, el numero de muestras tomadas al ejecutar una función especifica, corresponde con la cantidad de tiempo que el navegador ha empleado para ejecutarlo, así puedes identificar los cuellos de botella en tu código.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10949/perf-call-tree.png" style="display: block; height: 384px; margin-left: auto; margin-right: auto; width: 972px;"><br>
+ Para aprender mas sobre el <a href="/en-US/docs/Tools/Performance/Call_Tree">árbol de llamadas</a> puedes visitar su entrada.</p>
+
+<h3 id="Gráfico_de_llama">Gráfico de llama</h3>
+
+<p>Si el árbol de llamadas te muestra estadísticamente que funciones de tu sitio gastan mas tiempo de ejecución durante la grabación, el gráfico de llama nos indica cualquier stack llamado durante la misma:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10933/perf-flame-chart.png" style="display: block; height: 504px; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<p>Para aprender mas sobre el <a href="/en-US/docs/Tools/Performance/Flame_Chart">gráfico de llama</a> puedes visitar su entrada.</p>
+
+<h3 id="Asignaciones">Asignaciones</h3>
+
+<div class="geckoVersionNote">
+<p>La vista de Asignaciones es nueva en Firefox 46.</p>
+</div>
+
+<p>La vista de Asignaciones es como el árbol de llamadas, pero para las asignaciones: Nos muestra que funciones en tu pagina tienen mas memoria asignada durante el transacurso de la grabación.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/12413/allocations-view-1.png" style="display: block; margin-left: auto; margin-right: auto; width: 972px;"></p>
+
+<p>La vista de Asignaciones solo aparece si haz seleccionado "Grabar Asignaciones" en las opciones de las herramientas de rendimiento antes de hacer una nueva grabación.</p>
+
+<p>{{EmbedYouTube("Le9tTo7bqts")}}</p>
+
+<p>Para aprender mas sobre las <a href="/en-US/docs/Tools/Performance/Allocations">Asignaciones</a> puedes visitar su entrada.</p>
diff --git a/files/es/tools/profiler/index.html b/files/es/tools/profiler/index.html
deleted file mode 100644
index 23fa9e1e34..0000000000
--- a/files/es/tools/profiler/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: JavaScript Profiler
-slug: Tools/Profiler
-translation_of: Tools/Performance
-translation_of_original: Tools/Profiler
----
-<div>
- Utilice la herramienta de perfiles para encontrar los cuellos de botella en el código JavaScript. El Profiler muestras periódicamente la pila actual de llamadas JavaScript y compila información sobre las muestras. </div>
-<div>
-  </div>
-<div>
- Puede iniciar el Analizador seleccionando "Profiler" en el menú "Web Developer". Usted encontrará en el menú "Web Developer" en el menú "Herramientas" en Linux y OS X, y directamente bajo el menú "Firefox" en Windows. </div>
-<div>
-  </div>
-<div>
- La <a href="/en-US/docs/Tools/DevTools_Window">Caja de herramientas</a> se abrirá, con el Profiler seleccionado.</div>
-<div>
-  </div>
-<h2 id="Los_perfiladores_de_muestreo"><a name="sampling-profilers">Los perfiladores de muestreo</a></h2>
-<p>El perfilador de JavaScript es un generador de perfiles de muestreo. Esto significa que las muestras periódicamente el estado del motor de JavaScript, y registra la pila para el código que se ejecuta en el momento de tomar la muestra. Estadísticamente, el número de muestras tomadas en la que estábamos ejecutando una función particular, corresponde a la cantidad de tiempo que el navegador está gastando ejecutarlo, para que pueda identificar los cuellos de botella en el código.<br>
- <br>
- <a name="profiling-example">Por ejemplo, considere un programa como este:</a></p>
-<pre class="brush: js">function doSomething() {
-  var x = getTheValue();
-  x = x + 1;                   // -&gt; sample A
-  logTheValue(x);
-}
-
-function getTheValue() {
-  return 5;
-}
-
-function logTheValue(x) {
- console.log(x);               // -&gt; sample B, sample C
-}
-
-doSomething();</pre>
-<p>Supongamos que ejecutar este programa con el perfilador activo, y en el tiempo que se tarda en ejecutar, el perfilador toma de tres muestras, como se indica en los comentarios en línea de arriba. </p>
-<p>Todos están tomadas desde el interior <code>doSomething()</code>, pero los otros dos se encuentran dentro de la función <code>logTheValue()</code> llamado por <code>doSomething()</code>. Así que el perfil consistiría en tres seguimientos de pila, como este:</p>
-<pre>Sample A: doSomething()
-Sample B: doSomething() &gt; logTheValue()
-Sample C: doSomething() &gt; logTheValue()</pre>
-<p>Esto, obviamente, no hay suficientes datos para que nos digan nada, pero con mucho más muestras de que podría ser capaz de concluir que <code>logTheValue()</code> es el cuello de botella en nuestro código.</p>
-<h2 id="Creación_de_un_perfil">Creación de un perfil</h2>
-<p>Haga clic en el botón del cronómetro (<em>stopwatch</em><span style="font-size: 14px; line-height: 1.5;">) en el Profiler para iniciar muestras de grabación. Cuando Profiler está grabando, se resaltará el botón del cronómetro. Haga clic en él de nuevo para detener la grabación y guardar el nuevo perfil:</span></p>
-<p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/5977/Screen%20Shot%202013-08-26%20at%2010.35.47%20AM.png"></p>
-<p>Una vez que haya hecho clic en "Stop", el nuevo perfil se abrirá de forma automática:</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/5981/Screen%20Shot%202013-08-26%20at%2011.07.18%20AM.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-<p>Este panel está dividido en dos partes:</p>
-<ul>
- <li>El lado izquierdo muestra todos los perfiles que ha capturado y le permite cargar cada uno. Justo por encima de esto hay dos botones: el botón del cronómetro (<em>stopwatch</em>) le permite grabar un nuevo perfil, mientras que el botón Importar (<em>Import</em>) ... permite importar los datos guardados anteriormente. Cuando se selecciona el perfil, puede guardar sus datos como un archivo JSON haciendo clic en el botón Guardar (Save). </li>
- <li>El lado derecho muestra el perfil actualmente cargado.</li>
-</ul>
-<h2 id="Analyzing_a_profile">Analyzing a profile</h2>
-<p>The profile is split into two parts:</p>
-<ul>
- <li>the <a href="#profile-timeline" title="#profile-timeline">profile timeline</a></li>
- <li>the <a href="#profile-details" title="#profile-details">profile details</a></li>
-</ul>
-<h3 id="Profile_timeline"><a name="profile-timeline">Profile timeline</a></h3>
-<p>The profile timeline occupies the top part of the profile display:</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/5987/timeline" style="display: block; margin-left: auto; margin-right: auto;">The horizontal axis is time, and the vertical axis is call stack size at that sample. Call stack represents the amount of active functions at the time when the sample was taken.</p>
-<p>Red samples along the chart indicate the browser was unresponsive during that time, and a user would notice pauses in animations and responsiveness. If a profile has red samples, consider breaking this code up into several events, and look into using <a href="/en-US/docs/Web/API/window.requestAnimationFrame" title="/en-US/docs/Web/API/window.requestAnimationFrame">requestAnimationFrame</a> and <a href="/en-US/docs/Web/Guide/Performance/Using_web_workers" title="/en-US/docs/Web/Guide/Performance/Using_web_workers">Workers</a>.</p>
-<p>You can examine a specific range within the profile by clicking and dragging inside the timeline:</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/5989/Screen%20Shot%202013-08-26%20at%2011.17.59%20AM.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-<p>A new button then appears above the timeline labeled "Sample Range [AAA, BBB]". Clicking that button zooms the profile, and the details view underneath it, to that timeslice:</p>
-<p><br>
- <img alt="" src="https://mdn.mozillademos.org/files/5991/Screen%20Shot%202013-08-26%20at%2011.18.03%20AM.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-<h3 id="Profile_details"><a name="profile-details">Profile details</a></h3>
-<p>The profile details occupy the bottom part of the profile display:</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/5993/profiler-details-highligted.png" style="display: block; margin-left: auto; margin-right: auto;">When you first open a new sample, the sample pane contains a single row labeled "(total)", as in the screenshot above. If you click the arrow next to "(total)", you'll see a list of all the top-level functions which appear in a sample.</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/5995/Screen%20Shot%202013-08-26%20at%2011.22.10%20AM.png"></p>
-<p><strong>Running time</strong> shows the total number of samples in which this function appeared<a href="#footnote-1"><sup>1</sup></a>, followed by the percentage of all samples in the profile in which this function appeared. The first row above shows that there were 2021 samples in the entire profile, and the second row shows that 1914, or 94.7%, of them were inside the <code>detectImage()</code> function.</p>
-<p><strong>Self</strong> shows the number of samples in which the sample was taken while executing this function itself, and not a function it was calling. In the <a href="#profiling-example" title="#profiling-example">simple example</a> above, <code>doSomething()</code> would have a <strong>Running time</strong> of 3 (samples A, B, and C), but a <strong>Self</strong> value of 1 (sample A).</p>
-<p>The third column gives the name of the function along with the filename and line number (for local functions) or basename and domain name (for remote functions). Functions in gray are built-in browser functions: functions in black represent JavaScript loaded by the page. If you hover the mouse over a row you'll see an arrow to the right of the function's identifier: click the arrow and you'll be taken to the function source.</p>
-<h3 id="Expanding_the_call_tree">Expanding the call tree</h3>
-<p>In a given row, if there are any samples taken while we were in a function called by this function (that is, if <strong>Running Time</strong> is greater than <strong>Self</strong> for a given row) then an arrow appears to the left of the function's name, enabling you to expand the call tree.</p>
-<p>In the <a href="#profiling-example" title="#profiling-example">simple example</a> above, the fully-expanded call tree would look like this:</p>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td style="text-align: center;"><strong>Running Time</strong></td>
-   <td style="text-align: center;"><strong>Self</strong></td>
-   <td style="text-align: center;"> </td>
-  </tr>
-  <tr>
-   <td style="text-align: center;">3            100%</td>
-   <td style="text-align: center;">1</td>
-   <td style="text-align: center;">doSomething()</td>
-  </tr>
-  <tr>
-   <td style="text-align: center;">2              67%</td>
-   <td style="text-align: center;">2</td>
-   <td style="text-align: center;">logTheValue()</td>
-  </tr>
- </tbody>
-</table>
-<p>To take a more realistic example: in the screenshot below, looking at the second row we can see that 1914 samples were taken inside the <code>detectImage()</code> function. But all of them were taken in functions called by <code>detectImage()</code> (the <strong>Self</strong> cell is zero). We can expand the call tree to find out which functions were actually running when most of the samples were taken:</p>
-<p><img alt="" src="https://mdn.mozillademos.org/files/5999/bla.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-<p>This tells us that 6 samples were taken when we were actually executing <code>detectAtScale(), </code>12 when we were executing <code>getRect()</code> and so on.</p>
-<h2 id="Footnotes">Footnotes</h2>
-<ol>
- <li><a name="footnote-1">If the function is called multiple times from different sources, it will be represented multiple times in the Profiler output. So generic functions like <code>forEach</code> will appear multiple times in the call tree.</a></li>
-</ol>
-<p> </p>
diff --git a/files/es/tools/remote_debugging/debugging_over_a_network/index.html b/files/es/tools/remote_debugging/debugging_over_a_network/index.html
deleted file mode 100644
index a827b255cb..0000000000
--- a/files/es/tools/remote_debugging/debugging_over_a_network/index.html
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Debugging over a network
-slug: Tools/Remote_Debugging/Debugging_over_a_network
-translation_of: 'Tools/about:debugging#Connecting_over_the_Network'
-translation_of_original: Tools/Remote_Debugging/Debugging_over_a_network
----
-<blockquote>
-<h3 id="draft">{{draft}}</h3>
-</blockquote>
-
-<p>Coming soon...</p>
diff --git a/files/es/tools/remote_debugging/firefox_for_android/index.html b/files/es/tools/remote_debugging/firefox_for_android/index.html
new file mode 100644
index 0000000000..4548618161
--- /dev/null
+++ b/files/es/tools/remote_debugging/firefox_for_android/index.html
@@ -0,0 +1,133 @@
+---
+title: Depuración remota en Firefox para Android
+slug: Tools/Remote_Debugging/Firefox_for_Android
+translation_of: Tools/Remote_Debugging/Firefox_for_Android
+original_slug: Tools/Remote_Debugging/Firefox_para_Android
+---
+<p>Esta guía explica como usar la <a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_usage_tips/Remote_debugging">depuración remota </a>para inspeccionar o depurar código funcionando en <a href="/en-US/docs/Mozilla/Firefox_for_Android">Firefox para Android </a>conectado por USB.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5833/remote-debugging-overview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>Esta guía se divide en dos partes: la primera parte, "Requisitos previos" cubre la materia que solo hay que hacer una vez, mientras que la segunda parte, "Conectando", cubre la materia que hay que hacer cada vez que conectas el dispositivo. </p>
+
+<h2 id="Requisitos_previos">Requisitos previos</h2>
+
+<p>Primero, lo que necesitará:</p>
+
+<ul>
+ <li>un ordenador de sobremesa o un portátil con Firefox funcionando</li>
+ <li>un dispositivo Android con <a href="https://support.mozilla.org/en-US/kb/will-firefox-work-my-mobile-device" title="https://support.mozilla.org/en-US/kb/will-firefox-work-my-mobile-device">capacidad de arrancar Firefox para Android</a> con Firefox para Android funcionando en él</li>
+ <li>un cable USB que conecte ambos dispositivos</li>
+</ul>
+
+<h3 id="Configuración_ADB">Configuración ADB</h3>
+
+<p>A continuación, necesitarás que el ordenador de sobremesa y el dispositivo Android hablen entre si utilizando la herramienta de la línea de comandos del adb.</p>
+
+<h4 class="note" id="En_el_dispositivo_Android">En el dispositivo Android</h4>
+
+<ul>
+ <li><a href="http://developer.android.com/guide/developing/device.html#setting-up" title="http://developer.android.com/guide/developing/device.html#setting-up">Habilita la depuración USB (solo el paso 2 de este enlace)</a>.</li>
+ <li>Conecta el dispositivo con el ordenador mediante el cable USB.</li>
+</ul>
+
+<h4 class="note" id="En_el_ordenador_de_sobremesa">En el ordenador de sobremesa</h4>
+
+<ul>
+ <li>Instala la versión correcta del <a href="http://developer.android.com/sdk/index.html" title="http://developer.android.com/sdk/index.html">SDK de Android</a> para tu dispositivo.</li>
+ <li>Utilizando el SDK de Android, instala las <a href="http://developer.android.com/sdk/installing.html#components" title="http://developer.android.com/sdk/installing.html#components">herramientas de la plataforma Android</a>.</li>
+ <li>Las herramientas de la plataforma Android instalan adb en un subdirectorio llamado "platform-tools" dentro del directorio donde hayas instalado el Android SDK. Asegúrate que el directorio "platform-tools" aparece en la variable "path" de tu sistema operativo.</li>
+</ul>
+
+<p>Para comprobar que funciona, abre en tu ordenador de sobremesa la aplicación que te deja escribir comandos en línea del sistema operativo y teclea:</p>
+
+<pre>adb devices</pre>
+
+<p>Deberías ver una respuesta parecida a esta:</p>
+
+<pre>List of devices attached
+51800F220F01564 device
+</pre>
+
+<p>(La cadena de texto hexadecimal será diferente.)</p>
+
+<p>Si obtienes ésto, entonces <code>adb</code> ha encontrado tu dispositivo y has configurado correctamente el ADB.</p>
+
+<h3 id="Habilitar_la_depuración_remota">Habilitar la depuración remota</h3>
+
+<p>A continuación, tienes que activar la depuración remota en el ordenador de sobremesa y en el dispositivo Android.</p>
+
+<h4 id="Firefox_versión_24_y_anteriores_para_Android">Firefox versión 24 y anteriores para Android</h4>
+
+<p>Para habilitar la depuración remota en el dispositivo, tienes que ajustar la preferencia <code>devtools.debugger.remote-enabled</code> al valor <code>true</code>.</p>
+
+<p>Introduce la dirección <code>about:config</code> en Firefox para Android, escribe "devtools" dentro del cuadro de búsqueda y pulsa la tecla Search. Verás todas las preferencias de DevTools. Busca la preferencia <code>devtools.debugger.remote-enabled</code> preference, y pulsa "Toggle".</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5803/remote-debugger-about-config-toggle.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h4 class="note" id="Firefox_versión_25_y_posteriores_para_Android">Firefox versión 25 y posteriores para Android</h4>
+
+<p>En Firefox v.25 y posteriores para Android, hay un elemento de menú para habilitar la depuración remota. Abre el menú, selecciona "Settings", luego "Developer tools" (en algunos dispositivos Android puede que necesites seleccionar "More" para ver la opción "Settings"). Marca la casilla "Remote debugging":</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5829/remote-debugging-device-enable.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>El navegador mostrará una notificación para recordarte que debes configurar el redireccionamiento de puertos, lo cuál haremos más adelante.</p>
+
+<h4 id="En_el_ordenador_de_sobremesa_2">En el ordenador de sobremesa</h4>
+
+<p>En el ordenador, la depuración remota se habilita  a través de un ajuste en la caja de herramientas. <a href="/en-US/docs/Tools_Toolbox" title="/en-US/docs/Tools_Toolbox">Abre la caja de herramientas</a>, haz clic en el botón "Settings"  de la <a href="/en-US/docs/Tools_Toolbox#Toolbar" title="/en-US/docs/Tools_Toolbox#Toolbar">barra de herramientas</a>, y marca "Enable remote debugging" en la pestaña de <a href="/en-US/docs/Tools_Toolbox#Settings" title="/en-US/docs/Tools_Toolbox#Settings">Settings</a>:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5827/remote-debugger-toolbox-settings.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<div class="Note">Si estás utilizando una versión de Firefox anterior a la 27, tendrás que reiniciar el navegador para que se aplique la nueva configuración.</div>
+
+<p>Verás una nueva opción en el menú "Web Developer" con la etiqueta  "Connect...":</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5811/remote-debugging-connect-menuitem.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h2 id="Conectarse">Conectarse</h2>
+
+<p>Ahora puedes conectar la herramienta de depuración remota con el dispositivo. En primer lugar, conecta el dispositivo al ordenador con un cable USB, si no lo has hecho todavía.</p>
+
+<h4 class="note" id="En_el_ordenador_de_sobremesa_3">En el ordenador de sobremesa</h4>
+
+<p>Ve al símbolo del sistema y teclea:</p>
+
+<pre>adb forward tcp:6000 tcp:6000</pre>
+
+<p>(Si has cambiado el valor que el dispositivo Android usa para el puerto de depuración, deberás modificarlo a este valor.)</p>
+
+<p>Para Firefox OS, teclea:</p>
+
+<pre><code>adb forward tcp:6000 localfilesystem:/data/data/org.mozilla.firefox/firefox-debugger-socket</code></pre>
+
+<p>Tendrás que volver a ejecutar este comando cada vez que conectes físicamente el ordenador de sobremesa y el dispositivo con el cable USB.</p>
+
+<p>A continuación, ve al menú Web Developer del Firefox, y selecciona  "Connect...". Verás una página parecida a ésta:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5813/remote-debugging-desktop-connect.png" style="display: block; margin-left: auto; margin-right: auto;">Si no has cambiado los números de puerto, elige 6000 y pulsa el botón 'Connect'.</p>
+
+<h4 class="note" id="En_el_dispositivo_Android_2">En el dispositivo Android</h4>
+
+<div class="mttextarea" dir="ltr" id="TranslationOutput">
+<div><span>A </span><span id="Dst[0][0:3:2:13]">continuación</span><span> </span><span id="Dst[0][5:14:15:24]">verás</span><span> </span><span id="Dst[0][16:16:26:27]">un</span><span> cuadro de </span><span id="Dst[0][18:23:39:45]">diálogo</span><span> </span><span id="Dst[0][25:26:47:48]">en</span><span> </span><span id="Dst[0][28:30:50:51]">el</span><span> </span><span id="Dst[0][40:45:53:63]">dispositivo</span><span> </span><span id="Dst[0][32:38:65:71]">Android que pide </span><span>que </span><span> </span><span id="Dst[0][61:67:87:95]">confirmes</span><span> </span><span id="Dst[0][69:71:97:98]">la</span><span> </span><span id="Dst[0][73:82:100:107]">conexión</span>:</div>
+</div>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5815/remote-debugging-device-connect.png" style="display: block; margin-left: auto; margin-right: auto;">Haz click en "OK". El ordenador de sobremesa espera unos segundos para darte tiempo para que confirmes en el cuadro de diálogo: si se agota el tiempo de espera, solo tienes que volver a hacer click en "Connect" en el cuadro de diálogo del ordenador de sobremesa.</p>
+
+<h4 class="note" id="En_el_ordenador_de_sobremesa_4">En el ordenador de sobremesa</h4>
+
+<p>A continuación, el ordenador te muestra un cuadro de diálogo parecido a este:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5819/remote-debugging-desktop-select-target.png" style="display: block; margin-left: auto; margin-right: auto;">Te pregunta si quieres depurar el contenido de la web que se ejecuta en alguna pestaña del navegador, o depurar el código del propio navegador.</p>
+
+<ul>
+ <li>Verás una entrada por cada pestaña abierta debajo de "Available remote tabs",  y haciendo click sobre una conectarás la herramienta de depuración al contenido web de la pestaña. Si quieres depurar el contenido de tu web, elige la pestaña pertinente.</li>
+ <li>Verás una entrada debajo de "Available remote processes": este es el propio proceso del navegador. Elige esta opción si quieres depurar el código del navegador.</li>
+</ul>
+
+<p>Elegimos conectarnos al sitio web mozilla.org.  Se abrirá una ventana con la Caja de herramientas, vinculada a la pestaña del Firefox para Android que muestra el sito de mozilla.org:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/5821/remote-debugging-console.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>La caja de herramientas y las herramientas que contiene, funcionan de la misma manera que lo hacen cuando están conectadas a un contenido local.<img alt="" src="https://mdn.mozillademos.org/files/5823/remote-debugging-debugger.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
diff --git a/files/es/tools/remote_debugging/firefox_para_android/index.html b/files/es/tools/remote_debugging/firefox_para_android/index.html
deleted file mode 100644
index 497d026a34..0000000000
--- a/files/es/tools/remote_debugging/firefox_para_android/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: Depuración remota en Firefox para Android
-slug: Tools/Remote_Debugging/Firefox_para_Android
-translation_of: Tools/Remote_Debugging/Firefox_for_Android
----
-<p>Esta guía explica como usar la <a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_usage_tips/Remote_debugging">depuración remota </a>para inspeccionar o depurar código funcionando en <a href="/en-US/docs/Mozilla/Firefox_for_Android">Firefox para Android </a>conectado por USB.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5833/remote-debugging-overview.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<p>Esta guía se divide en dos partes: la primera parte, "Requisitos previos" cubre la materia que solo hay que hacer una vez, mientras que la segunda parte, "Conectando", cubre la materia que hay que hacer cada vez que conectas el dispositivo. </p>
-
-<h2 id="Requisitos_previos">Requisitos previos</h2>
-
-<p>Primero, lo que necesitará:</p>
-
-<ul>
- <li>un ordenador de sobremesa o un portátil con Firefox funcionando</li>
- <li>un dispositivo Android con <a href="https://support.mozilla.org/en-US/kb/will-firefox-work-my-mobile-device" title="https://support.mozilla.org/en-US/kb/will-firefox-work-my-mobile-device">capacidad de arrancar Firefox para Android</a> con Firefox para Android funcionando en él</li>
- <li>un cable USB que conecte ambos dispositivos</li>
-</ul>
-
-<h3 id="Configuración_ADB">Configuración ADB</h3>
-
-<p>A continuación, necesitarás que el ordenador de sobremesa y el dispositivo Android hablen entre si utilizando la herramienta de la línea de comandos del adb.</p>
-
-<h4 class="note" id="En_el_dispositivo_Android">En el dispositivo Android</h4>
-
-<ul>
- <li><a href="http://developer.android.com/guide/developing/device.html#setting-up" title="http://developer.android.com/guide/developing/device.html#setting-up">Habilita la depuración USB (solo el paso 2 de este enlace)</a>.</li>
- <li>Conecta el dispositivo con el ordenador mediante el cable USB.</li>
-</ul>
-
-<h4 class="note" id="En_el_ordenador_de_sobremesa">En el ordenador de sobremesa</h4>
-
-<ul>
- <li>Instala la versión correcta del <a href="http://developer.android.com/sdk/index.html" title="http://developer.android.com/sdk/index.html">SDK de Android</a> para tu dispositivo.</li>
- <li>Utilizando el SDK de Android, instala las <a href="http://developer.android.com/sdk/installing.html#components" title="http://developer.android.com/sdk/installing.html#components">herramientas de la plataforma Android</a>.</li>
- <li>Las herramientas de la plataforma Android instalan adb en un subdirectorio llamado "platform-tools" dentro del directorio donde hayas instalado el Android SDK. Asegúrate que el directorio "platform-tools" aparece en la variable "path" de tu sistema operativo.</li>
-</ul>
-
-<p>Para comprobar que funciona, abre en tu ordenador de sobremesa la aplicación que te deja escribir comandos en línea del sistema operativo y teclea:</p>
-
-<pre>adb devices</pre>
-
-<p>Deberías ver una respuesta parecida a esta:</p>
-
-<pre>List of devices attached
-51800F220F01564 device
-</pre>
-
-<p>(La cadena de texto hexadecimal será diferente.)</p>
-
-<p>Si obtienes ésto, entonces <code>adb</code> ha encontrado tu dispositivo y has configurado correctamente el ADB.</p>
-
-<h3 id="Habilitar_la_depuración_remota">Habilitar la depuración remota</h3>
-
-<p>A continuación, tienes que activar la depuración remota en el ordenador de sobremesa y en el dispositivo Android.</p>
-
-<h4 id="Firefox_versión_24_y_anteriores_para_Android">Firefox versión 24 y anteriores para Android</h4>
-
-<p>Para habilitar la depuración remota en el dispositivo, tienes que ajustar la preferencia <code>devtools.debugger.remote-enabled</code> al valor <code>true</code>.</p>
-
-<p>Introduce la dirección <code>about:config</code> en Firefox para Android, escribe "devtools" dentro del cuadro de búsqueda y pulsa la tecla Search. Verás todas las preferencias de DevTools. Busca la preferencia <code>devtools.debugger.remote-enabled</code> preference, y pulsa "Toggle".</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5803/remote-debugger-about-config-toggle.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h4 class="note" id="Firefox_versión_25_y_posteriores_para_Android">Firefox versión 25 y posteriores para Android</h4>
-
-<p>En Firefox v.25 y posteriores para Android, hay un elemento de menú para habilitar la depuración remota. Abre el menú, selecciona "Settings", luego "Developer tools" (en algunos dispositivos Android puede que necesites seleccionar "More" para ver la opción "Settings"). Marca la casilla "Remote debugging":</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5829/remote-debugging-device-enable.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<p>El navegador mostrará una notificación para recordarte que debes configurar el redireccionamiento de puertos, lo cuál haremos más adelante.</p>
-
-<h4 id="En_el_ordenador_de_sobremesa_2">En el ordenador de sobremesa</h4>
-
-<p>En el ordenador, la depuración remota se habilita  a través de un ajuste en la caja de herramientas. <a href="/en-US/docs/Tools_Toolbox" title="/en-US/docs/Tools_Toolbox">Abre la caja de herramientas</a>, haz clic en el botón "Settings"  de la <a href="/en-US/docs/Tools_Toolbox#Toolbar" title="/en-US/docs/Tools_Toolbox#Toolbar">barra de herramientas</a>, y marca "Enable remote debugging" en la pestaña de <a href="/en-US/docs/Tools_Toolbox#Settings" title="/en-US/docs/Tools_Toolbox#Settings">Settings</a>:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5827/remote-debugger-toolbox-settings.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<div class="Note">Si estás utilizando una versión de Firefox anterior a la 27, tendrás que reiniciar el navegador para que se aplique la nueva configuración.</div>
-
-<p>Verás una nueva opción en el menú "Web Developer" con la etiqueta  "Connect...":</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5811/remote-debugging-connect-menuitem.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h2 id="Conectarse">Conectarse</h2>
-
-<p>Ahora puedes conectar la herramienta de depuración remota con el dispositivo. En primer lugar, conecta el dispositivo al ordenador con un cable USB, si no lo has hecho todavía.</p>
-
-<h4 class="note" id="En_el_ordenador_de_sobremesa_3">En el ordenador de sobremesa</h4>
-
-<p>Ve al símbolo del sistema y teclea:</p>
-
-<pre>adb forward tcp:6000 tcp:6000</pre>
-
-<p>(Si has cambiado el valor que el dispositivo Android usa para el puerto de depuración, deberás modificarlo a este valor.)</p>
-
-<p>Para Firefox OS, teclea:</p>
-
-<pre><code>adb forward tcp:6000 localfilesystem:/data/data/org.mozilla.firefox/firefox-debugger-socket</code></pre>
-
-<p>Tendrás que volver a ejecutar este comando cada vez que conectes físicamente el ordenador de sobremesa y el dispositivo con el cable USB.</p>
-
-<p>A continuación, ve al menú Web Developer del Firefox, y selecciona  "Connect...". Verás una página parecida a ésta:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5813/remote-debugging-desktop-connect.png" style="display: block; margin-left: auto; margin-right: auto;">Si no has cambiado los números de puerto, elige 6000 y pulsa el botón 'Connect'.</p>
-
-<h4 class="note" id="En_el_dispositivo_Android_2">En el dispositivo Android</h4>
-
-<div class="mttextarea" dir="ltr" id="TranslationOutput">
-<div><span>A </span><span id="Dst[0][0:3:2:13]">continuación</span><span> </span><span id="Dst[0][5:14:15:24]">verás</span><span> </span><span id="Dst[0][16:16:26:27]">un</span><span> cuadro de </span><span id="Dst[0][18:23:39:45]">diálogo</span><span> </span><span id="Dst[0][25:26:47:48]">en</span><span> </span><span id="Dst[0][28:30:50:51]">el</span><span> </span><span id="Dst[0][40:45:53:63]">dispositivo</span><span> </span><span id="Dst[0][32:38:65:71]">Android que pide </span><span>que </span><span> </span><span id="Dst[0][61:67:87:95]">confirmes</span><span> </span><span id="Dst[0][69:71:97:98]">la</span><span> </span><span id="Dst[0][73:82:100:107]">conexión</span>:</div>
-</div>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5815/remote-debugging-device-connect.png" style="display: block; margin-left: auto; margin-right: auto;">Haz click en "OK". El ordenador de sobremesa espera unos segundos para darte tiempo para que confirmes en el cuadro de diálogo: si se agota el tiempo de espera, solo tienes que volver a hacer click en "Connect" en el cuadro de diálogo del ordenador de sobremesa.</p>
-
-<h4 class="note" id="En_el_ordenador_de_sobremesa_4">En el ordenador de sobremesa</h4>
-
-<p>A continuación, el ordenador te muestra un cuadro de diálogo parecido a este:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5819/remote-debugging-desktop-select-target.png" style="display: block; margin-left: auto; margin-right: auto;">Te pregunta si quieres depurar el contenido de la web que se ejecuta en alguna pestaña del navegador, o depurar el código del propio navegador.</p>
-
-<ul>
- <li>Verás una entrada por cada pestaña abierta debajo de "Available remote tabs",  y haciendo click sobre una conectarás la herramienta de depuración al contenido web de la pestaña. Si quieres depurar el contenido de tu web, elige la pestaña pertinente.</li>
- <li>Verás una entrada debajo de "Available remote processes": este es el propio proceso del navegador. Elige esta opción si quieres depurar el código del navegador.</li>
-</ul>
-
-<p>Elegimos conectarnos al sitio web mozilla.org.  Se abrirá una ventana con la Caja de herramientas, vinculada a la pestaña del Firefox para Android que muestra el sito de mozilla.org:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/5821/remote-debugging-console.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<p>La caja de herramientas y las herramientas que contiene, funcionan de la misma manera que lo hacen cuando están conectadas a un contenido local.<img alt="" src="https://mdn.mozillademos.org/files/5823/remote-debugging-debugger.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
diff --git a/files/es/tools/responsive_design_mode/index.html b/files/es/tools/responsive_design_mode/index.html
new file mode 100644
index 0000000000..9208566353
--- /dev/null
+++ b/files/es/tools/responsive_design_mode/index.html
@@ -0,0 +1,19 @@
+---
+title: Responsive Design View
+slug: Tools/Responsive_Design_Mode
+translation_of: Tools/Responsive_Design_Mode
+original_slug: Tools/Responsive_Design_View
+---
+<p>{{ fx_minversion_header("15.0") }}</p>
+
+<p>La vista de Diseño Adaptable hace que sea fácil ver cómo sus diseños se verán y funcionarán en diferentes tamaños de pantallas. <a href="/en-US/docs/Web_Development/Responsive_Web_design">Diseño Adaptable</a> se adapta a diferentes tamaños de pantalla para proporcionar una presentación adecuada para diferentes tipos de dispositivos, principalmente teléfonos móviles. La captura de pantalla siguiente es un ejemplo de la página web <a href="http://mozilla.org" title="/en-US/docs/Localizing_extension_metadata_on_addons.mozilla.org">mozilla.org</a> vista con un área de contenido 320 por 480.</p>
+
+<p><img alt="" src="/files/3877/Responsive%20Design%20View.png" style="float: left; height: 628px; padding-right: 2em; width: 372px;">La vista de Diseño Adaptable es conveniente porque se puede cambiar rápidamente el tamaño del área de contenido sin cambiar el tamaño de la ventana del navegador. Cambiar el tamaño de la ventana del navegador puede ser molesto porque todos los tamaños de tus pestañas cambian entonces y también hay menos espacio en la ventana de herramientas de desarrollo.</p>
+
+<p>Tu puedes encontrar la vista de Diseño Adaptable en el menú Desarrollador Web.</p>
+
+<p>Como alternativa, puede usar el atajo ctrl-shift-M en Windows o Linux y cmd-opt-M en Mac  para iniciar la vista de Diseño adaptable. Presionando la tecla &lt;esc&gt; se cerrará la vista. Mientras que estás en la vista de Diseñó Adaptable, puedes seguir con normalidad en el área de contenido reescalado.</p>
+
+<p>En la parte superior de la vista de Diseño Adaptable, hay un menú desplegable de tamaños preestablecidos que son convenientes para ver rápidamente su diseño en un número de tamaños de pantallas más comunes. También hay un botón de rotación para cambiar inmediatamente la anchura y altura (similar a la rotación de un teléfono móvil o tableta ).</p>
+
+<p><span id="result_box" lang="es"><span class="hps">Usted</span> <span class="hps">puede utilizar el</span> <span class="hps">controlador de tamaño</span> <span class="hps">en la</span> <span class="hps">parte inferior derecha del</span> <span class="hps">área de contenido</span> <span class="hps">para cambiar el</span> <span class="hps">tamaño del área de</span> <span class="hps">contenido</span></span>.</p>
diff --git a/files/es/tools/responsive_design_view/index.html b/files/es/tools/responsive_design_view/index.html
deleted file mode 100644
index 2571bc5aa4..0000000000
--- a/files/es/tools/responsive_design_view/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Responsive Design View
-slug: Tools/Responsive_Design_View
-translation_of: Tools/Responsive_Design_Mode
----
-<p>{{ fx_minversion_header("15.0") }}</p>
-
-<p>La vista de Diseño Adaptable hace que sea fácil ver cómo sus diseños se verán y funcionarán en diferentes tamaños de pantallas. <a href="/en-US/docs/Web_Development/Responsive_Web_design">Diseño Adaptable</a> se adapta a diferentes tamaños de pantalla para proporcionar una presentación adecuada para diferentes tipos de dispositivos, principalmente teléfonos móviles. La captura de pantalla siguiente es un ejemplo de la página web <a href="http://mozilla.org" title="/en-US/docs/Localizing_extension_metadata_on_addons.mozilla.org">mozilla.org</a> vista con un área de contenido 320 por 480.</p>
-
-<p><img alt="" src="/files/3877/Responsive%20Design%20View.png" style="float: left; height: 628px; padding-right: 2em; width: 372px;">La vista de Diseño Adaptable es conveniente porque se puede cambiar rápidamente el tamaño del área de contenido sin cambiar el tamaño de la ventana del navegador. Cambiar el tamaño de la ventana del navegador puede ser molesto porque todos los tamaños de tus pestañas cambian entonces y también hay menos espacio en la ventana de herramientas de desarrollo.</p>
-
-<p>Tu puedes encontrar la vista de Diseño Adaptable en el menú Desarrollador Web.</p>
-
-<p>Como alternativa, puede usar el atajo ctrl-shift-M en Windows o Linux y cmd-opt-M en Mac  para iniciar la vista de Diseño adaptable. Presionando la tecla &lt;esc&gt; se cerrará la vista. Mientras que estás en la vista de Diseñó Adaptable, puedes seguir con normalidad en el área de contenido reescalado.</p>
-
-<p>En la parte superior de la vista de Diseño Adaptable, hay un menú desplegable de tamaños preestablecidos que son convenientes para ver rápidamente su diseño en un número de tamaños de pantallas más comunes. También hay un botón de rotación para cambiar inmediatamente la anchura y altura (similar a la rotación de un teléfono móvil o tableta ).</p>
-
-<p><span id="result_box" lang="es"><span class="hps">Usted</span> <span class="hps">puede utilizar el</span> <span class="hps">controlador de tamaño</span> <span class="hps">en la</span> <span class="hps">parte inferior derecha del</span> <span class="hps">área de contenido</span> <span class="hps">para cambiar el</span> <span class="hps">tamaño del área de</span> <span class="hps">contenido</span></span>.</p>
diff --git a/files/es/tools/style_editor/index.html b/files/es/tools/style_editor/index.html
new file mode 100644
index 0000000000..f57d6f6f17
--- /dev/null
+++ b/files/es/tools/style_editor/index.html
@@ -0,0 +1,102 @@
+---
+title: Editor de Estilo
+slug: Tools/Style_Editor
+tags:
+  - CSS
+  - Desarrollo web
+  - Herramientas
+  - Herramientas de desarrollo web
+  - Hojas de estilo
+translation_of: Tools/Style_Editor
+original_slug: Tools/Editor_Estilo
+---
+<p>El editor de estilo te permite:</p>
+
+<ul>
+ <li>ver y editar todas las hojas de estilo asociadas con una página</li>
+ <li>crear nuevas hojas de estilo desde bosquejos y aplicarlas a una página</li>
+ <li>importar hojas de estilo existentes y aplicarlas en la página</li>
+</ul>
+
+<p>{{EmbedYouTube("7839qc55r7o")}}</p>
+
+<p>Para abrir el Editor de Estilo selecciona la opción "Editor de Estilo" desde el menú "Web Developer" (este es un submenu del menú "Tools" o "Herramientas" en una Mac). El Toolbox o caja de herramientas aparecerá en la parte inferior de la ventana del navegador, con el Editor de Estilo activado:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6941/style-editor.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<p>El Editor de Estilo está divivido en  dos secciones principales: el panel de estilos en la izquierda y el editor en la derecha.</p>
+
+<div class="geckoVersionNote">
+<p>From Firefox 33 onwards, there's a third component to the Style Editor: <a href="/en-US/docs/Tools/Style_Editor#The_media_sidebar">the media sidebar</a>.</p>
+</div>
+
+<h2 id="El_panel_de_hojas_de_estilo">El panel de hojas de estilo</h2>
+
+<p>El panel de hojas de estilo, en la izquierda, muestra todas las hojas de estilos que están siendo utilizadas por el documento actual.  You can quickly toggle the use of a given sheet on and off by clicking the eyeball icon to the left of the sheet's name. Puede guardar los cambios hechos en la hoja de estilos a su computador, haciendo clic en el botón Guardar en la esquina inferior derecha de cada hoja de estilos de la lista.</p>
+
+<h2 id="El_panel_de_edición">El panel de edición</h2>
+
+<p>A la derecha está el panel de edición. Aquí está disponible el código fuente de la hoja de estilo seleccionada, lista para ver y editar. Cualquier cambio que realice será aplicada inmediatamente. This makes it easy to experiment with, revise, and test changes. Una vez esté satisfecho con sus cambios, puede guardar una copia localmente, haciendo clic en el botón Guardar.</p>
+
+<p><span style="line-height: 1.5;">El editor contiene numeración de líneas y resaltamiento de código, haciendo más fácil la lectura de su CSS. También soporta </span><a href="/en-US/docs/Tools/Style_Editor#Source_editor_shortcuts" style="line-height: 1.5;">keyboard shortcuts</a><span style="line-height: 1.5;">.</span></p>
+
+<p>El Editor de Estilos automáticamente des-minimiza las hojas de estilo que detecta, sin afectar el original. Esto facilita mucho el trabajo en páginas que ya han sido optimizadas.</p>
+
+<p>El Editor de Estilos soporta autocompletado. Empiece escribiendo y el sistema le ofrecerá una lista de sugerencias.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6943/style-editor-autocomplete.png" style="display: block; margin-left: auto; margin-right: auto;">Puede deshabilitar el autocompletado en <a href="/en-US/docs/Tools_Toolbox#Style_Editor">Style Editor settings</a>.</p>
+
+<h2 id="La_barra_lateral_media">La barra lateral "media"</h2>
+
+<p>A partir de Firefox 33 en adelante, el Editor de Estilos muestra una barra lateral a la derecha cuando se encuentra alguna regla @media (<a href="/en-US/docs/Web/Guide/CSS/Media_queries"><code>@media</code> rules</a>). La barra lateral muestra las reglas y provee un link a la línea donde se define dicha regla. Haga clic en un ítem para ir hacia la definición de esa regla en la hoja de estilo. El texto condicional de la regla estará en gris si el media query no aplica.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/8365/style-editor-media-sidebar-detail.png" style="display: block; margin-left: auto; margin-right: auto;">La barra lateral de medios funciona especialmente bien con <a href="https://developer.mozilla.org/en-US/docs/Tools/Responsive_Design_View">Responsive Design View</a> para crear y depurar diseños móviles :</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/8363/style-editor-media-sidebar.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h2 id="Creación_e_importación_de_hojas_de_estilo">Creación e importación de hojas de estilo</h2>
+
+<p>Se puede crear una nueva hoja de estilos haciendo click en el nuevo botón de la barra de herrramientas. A continuación puedes comenzar a introducir  CSS en el nuevo editor y ver como los nuevos estilos se aplican de forma inmediata ,al igual que los cambios en otras hojas.</p>
+
+<p>Se puede cargar una hoja de estilos desde el disco y aplicarlo a la página haciendo click en el boton de importar.</p>
+
+<h2 id="Soporte_de_mapa_fuente">Soporte de mapa fuente</h2>
+
+<p>{{EmbedYouTube("zu2eZbYtEUQ")}}</p>
+
+<p>Los desarrolladores web, con frecuencia crean archivos CSS  utilizando un preprocesador como  <a href="http://sass-lang.com/">Sass</a>, <a href="http://lesscss.org/">Less</a>, o <a href="http://learnboost.github.io/stylus/">Stylus</a>. Estas herramientas generan archivos CSS  procedentes de un sintasix mas rico y expresivo. Si haces esto, seras capaz de editar y  ver que el  CSS  generado no es tan util, porque el código que mantienes es el <span class="short_text" id="result_box" lang="es"><span>sintaxis</span> <span>preprocesado</span></span>, no el  CSS generado. Por lo que necesitarás editar el CSS generado, y después manualmente trabajar sobre como reaplicarlo a la fuente original.</p>
+
+<p>Mapas Fuente habilita para regresar desde el CSS generado a la síntasix original, entonces  se puede ver, y te permite editar archivos en la síntasix original. A partir de Firefox 29 en adelante, el editor de estilos puede interpretar mapas fuente de CSS .</p>
+
+<p>Esto significa que si utilizas, por ejemplo, Sass, el Editor de Estilos  mostrará,y permitirá editar,archivos Sass , en lugar del CSS que se ha generado desde ellos:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/6939/style-editor-sourcemap-820.png" style="display: block; margin-left: auto; margin-right: auto;">Para que esto funcione ,es necesario:</p>
+
+<ul>
+ <li>utilizar un preprocesador CSS que interprete  <a href="https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit">Source Map Revision 3 proposal</a>. Actualmente esto significa <a href="http://sass-lang.com/">Sass 3.3.0 </a> o superior , o la <a href="http://roots.io/using-less-source-maps/">versión 1.5.0 de Less</a>. Otros preprocesadores están trabajando activamente en añadir soporte, o lo están considerando.</li>
+ <li>actualmente el preprocesador da instrucciones para generar un mapa fuente, por ejemplo pasando el argumento <code>--sourcemap</code> a la herramienta de comando en linea de  Sass.</li>
+</ul>
+
+<h3 id="Visualización_de_las_fuentes_originales">Visualización de las fuentes originales</h3>
+
+<p>Ahora, si compruebas "mostrar fuentes originales" en los <a href="/en-US/docs/Tools_Toolbox#Style_Editor">ajustes del Editor de estilos</a>, el vínculo junto a las reglas  CSS en la <a href="/en-US/docs/Tools/Page_Inspector#Rules_view">Vista de Reglas</a> ,vincula con las fuentes originales en el Editor de Estilos.</p>
+
+<h3 id="Edición_de_las_fuentes_originales">Edición de las fuentes originales</h3>
+
+<p>Se pueden editar tambien las fuentes originales en el  Editor de estilos y ver el resultado aplicado a la página de inmediato. Para conseguir que esto funcione hay dos pasos adicionales.</p>
+
+<p>Primero, configura el preprocesador para que muestre la fuente original y automaticamente regenere el CSS cuando cambien las fuentes. Con Sass puedes hacer esto simplemente pasando la opción <code>--watch</code> :</p>
+
+<pre>sass index.scss:index.css --sourcemap --watch</pre>
+
+<p>A continuación, guarda la fuente original en el editor de estilos haciendo click en el botón   "Guardar" junto al archivo, y este se guardará sobre el archivo original.</p>
+
+<p>Ahora cuando hagas cambios en el archivo original en el  Editor de Estilos , el CSS se regenerará y podrás ver los cambios de forma inmediata.</p>
+
+<h2 id="Atajos_de_Teclado">Atajos de Teclado</h2>
+
+<h3 id="Atajos_del_editor_de_código_fuente">Atajos del editor de código fuente</h3>
+
+<p>{{ Page ("en-US/docs/tools/Keyboard_shortcuts", "source-editor") }}</p>
+
+<p>{{ languages( { "ja": "ja/Tools/Style_Editor"} ) }}</p>
diff --git a/files/es/tools/taking_screenshots/index.html b/files/es/tools/taking_screenshots/index.html
new file mode 100644
index 0000000000..57411ff5db
--- /dev/null
+++ b/files/es/tools/taking_screenshots/index.html
@@ -0,0 +1,43 @@
+---
+title: Tomar capturas de pantalla
+slug: Tools/Taking_screenshots
+tags:
+  - Herramientas
+translation_of: Tools/Taking_screenshots
+original_slug: Tools/Tomar_capturas_de_pantalla
+---
+<p>Puedes usar las Herramientas de Desarrollo (Developer Tools) para tomar una captura de pantalla de toda la página, o de un único elemento de la página.</p>
+
+<h2 id="Tomar_una_captura_de_pantalla_de_la_página">Tomar una captura de pantalla de la página</h2>
+
+<p>Usa el ícono de captura de pantalla: <img alt="" src="https://mdn.mozillademos.org/files/14713/camera-icon.png" style="height: 16px; margin-bottom: -4px; width: 18px;"> para tomar una captura completa de la página actual.</p>
+
+<p>Por defecto, el ícono de captura de pantalla no está habilitado. Para habilitarlo::</p>
+
+<ul>
+ <li>visita la página de  <a href="/en-US/docs/Tools/Settings">Ajustes (Settings)</a></li>
+ <li>encuentra la sección con el texto "Available Toolbox Buttons"</li>
+ <li>marca la caja con la etiqueta "Take a screenshot of the entire page".</li>
+</ul>
+
+<p>Verás el ícono en la barra de herramientas:</p>
+
+<p>{{EmbedYouTube("KB5V9uJgcS4")}}</p>
+
+<p>Haz clic en el ícono para tomar una capura de la página actual. La captura se guarda en el directorio de descargas de tu navegador:</p>
+
+<p>{{EmbedYouTube("HKS6MofdXVE")}}</p>
+
+<h2 id="Tomar_una_captura_de_un_elemento">Tomar una captura de un elemento</h2>
+
+<p>Para tomar una captura de un único elemento en la página, activa el menú contextual en ese elemento en el <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#HTML_pane">panel HTML del Inspector</a>, y selecciona "Screenshot Node". La captura se guarda en el directorio de descargas del navegador:</p>
+
+<p>{{EmbedYouTube("p2pjF_BrE1o")}}</p>
+
+<h2 id="Copiar_capturas_de_pantalla_al_portapapeles">Copiar capturas de pantalla al portapapeles</h2>
+
+<p>Desde Firefox 53, también puedes copiar la captura al portapapeles. Sólo marca la caja en Ajustes con la etiqueta "Screenshot to clipboard":</p>
+
+<p>{{EmbedYouTube("AZedFGh6F78")}}</p>
+
+<p>Ahora, cuando tomes una captura, la captura también es copiada al portapapeles.</p>
diff --git a/files/es/tools/tomar_capturas_de_pantalla/index.html b/files/es/tools/tomar_capturas_de_pantalla/index.html
deleted file mode 100644
index d842153d65..0000000000
--- a/files/es/tools/tomar_capturas_de_pantalla/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: Tomar capturas de pantalla
-slug: Tools/Tomar_capturas_de_pantalla
-tags:
-  - Herramientas
-translation_of: Tools/Taking_screenshots
----
-<p>Puedes usar las Herramientas de Desarrollo (Developer Tools) para tomar una captura de pantalla de toda la página, o de un único elemento de la página.</p>
-
-<h2 id="Tomar_una_captura_de_pantalla_de_la_página">Tomar una captura de pantalla de la página</h2>
-
-<p>Usa el ícono de captura de pantalla: <img alt="" src="https://mdn.mozillademos.org/files/14713/camera-icon.png" style="height: 16px; margin-bottom: -4px; width: 18px;"> para tomar una captura completa de la página actual.</p>
-
-<p>Por defecto, el ícono de captura de pantalla no está habilitado. Para habilitarlo::</p>
-
-<ul>
- <li>visita la página de  <a href="/en-US/docs/Tools/Settings">Ajustes (Settings)</a></li>
- <li>encuentra la sección con el texto "Available Toolbox Buttons"</li>
- <li>marca la caja con la etiqueta "Take a screenshot of the entire page".</li>
-</ul>
-
-<p>Verás el ícono en la barra de herramientas:</p>
-
-<p>{{EmbedYouTube("KB5V9uJgcS4")}}</p>
-
-<p>Haz clic en el ícono para tomar una capura de la página actual. La captura se guarda en el directorio de descargas de tu navegador:</p>
-
-<p>{{EmbedYouTube("HKS6MofdXVE")}}</p>
-
-<h2 id="Tomar_una_captura_de_un_elemento">Tomar una captura de un elemento</h2>
-
-<p>Para tomar una captura de un único elemento en la página, activa el menú contextual en ese elemento en el <a href="/en-US/docs/Tools/Page_Inspector/UI_Tour#HTML_pane">panel HTML del Inspector</a>, y selecciona "Screenshot Node". La captura se guarda en el directorio de descargas del navegador:</p>
-
-<p>{{EmbedYouTube("p2pjF_BrE1o")}}</p>
-
-<h2 id="Copiar_capturas_de_pantalla_al_portapapeles">Copiar capturas de pantalla al portapapeles</h2>
-
-<p>Desde Firefox 53, también puedes copiar la captura al portapapeles. Sólo marca la caja en Ajustes con la etiqueta "Screenshot to clipboard":</p>
-
-<p>{{EmbedYouTube("AZedFGh6F78")}}</p>
-
-<p>Ahora, cuando tomes una captura, la captura también es copiada al portapapeles.</p>
diff --git a/files/es/tools/web_audio_editor/index.html b/files/es/tools/web_audio_editor/index.html
new file mode 100644
index 0000000000..2c2a28c097
--- /dev/null
+++ b/files/es/tools/web_audio_editor/index.html
@@ -0,0 +1,32 @@
+---
+title: Editor de audio web
+slug: Tools/Web_Audio_Editor
+translation_of: Tools/Web_Audio_Editor
+original_slug: Tools/Editor_Audio_Web
+---
+<div class="geckoVersionNote">
+ <p>El editor de audio web es nuevo en Firefox 32.</p>
+</div>
+<p>Con la <a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">API de Audio Web</a>, los desarrolladores crean un <a href="/en-US/docs/Web/API/AudioContext">contexto de audio</a>. Dentro de ese contexto construyen un número de  <a href="/en-US/docs/Web/API/AudioNode">nodos de audio</a>, incluyendo:</p>
+<ul>
+ <li>nodos que proporcionan la <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_sources">fuente del audio</a>, como un oscilador o una fuente de buffer de datos</li>
+ <li>nodos que realizan <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_effects_filters">transformaciones</a> como delay y ganancia</li>
+ <li>nodos que representan el <a href="/en-US/docs/Web/API/Web_Audio_API#Defining_audio_destinations">destino del flujo de audio</a>, como los altavoces</li>
+</ul>
+<p>Cada nodo tiene cero o más propiedades <code><a href="/en-US/docs/Web/API/AudioParam">AudioParam</a></code> que configuran su operación. Por ejemplo, <code><a href="/en-US/docs/Web/API/GainNode">GainNode</a></code> tiene solamente la propiedad <code>gain</code>, mientras que <a href="/en-US/docs/Web/API/OscillatorNode"><code>OscillatorNode</code></a> tiene las propiedades <code>frequency</code> y <code>detune</code>.</p>
+<p>El desarrollador conecta los nodos en un gráfico y ese gráfico completo define el comportamiento del flujo de audio.</p>
+<p>El editor de audio web examina un contexto de audio construido en la página y proporciona una visualización de su gráfico. Esto da una vista de alto nivel de su operación y permite asegurar que todos los nodos están conectados de la forma esperada. Entonces se pueden examinar y editar las propiedades <code>AudioParam</code> para cada nodo del gráfico. Algunas propiedades no-<code>AudioParam</code>, como una propiedad <code>OscillatorNode</code>'s <code>type</code> son mostradas y también se pueden editar.</p>
+<p>Esta herramienta todavía es experimental. Si encuentra errores, nos encantaría que los <a class="external external-icon" href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox&amp;component=Developer%20Tools%3A%20Web%20Audio%20Editor">informe en Bugzilla</a>. Si tiene alguna opinión o sugerencias para nuevas funcionalidades, <a href="http://ffdevtools.uservoice.com/forums/246087-firefox-developer-tools-ideas">ffdevtools.uservoice.com</a> o <a href="http://twitter.com/firefoxdevtools">Twitter</a> son lugares excelentes para registrarlas.</p>
+<h2 id="Abriendo_el_editor_de_audio_web">Abriendo el editor de audio web</h2>
+<p>El editor de audio web no está habilitado por defecto en Firefox 32. Para habilitarlo, abra la <a href="/es/docs/Tools/Tools_Toolbox#Configuraciones">Configuración de herramientas de desarrollador</a> y marque "Audio web". Ahora debería haber una pestaña extra en la <a href="/es/docs/Tools/Tools_Toolbox#Barra_de_herramientas">Barra de herramientas</a> llamada "Audio web". Haga clic en esa pestaña y cargue una página que construya un contexto de audio. Dos demos interesantes son:</p>
+<ul>
+ <li><a href="https://github.com/mdn/voice-change-o-matic">Voice-change-O-Matic</a>, puede aplicar varios efectos a la entrada de micrófono y también muestra una visualización del resultado</li>
+ <li><a href="http://mdn.github.io/violent-theremin/">Violent Theremin</a>, cambia el tono y el volumen de una onda sinusoidal al mover el puntero del mouse</li>
+</ul>
+<h2 id="Visualizando_el_gráfico">Visualizando el gráfico</h2>
+<p>El editor de audio web ahora mostrará el gráfico del contexto de audio cargado. Aquí está el gráfico del demo de Violent Theremin:</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/7941/web-audio-editor-graph.png" style="display: block; margin-left: auto; margin-right: auto;">Se puede ver que usa tres nodos: un <a href="/en-US/docs/Web/API/OscillatorNode"><code>OscillatorNode</code></a> como fuente, un <a href="/en-US/docs/Web/API/GainNode"><code>GainNode</code></a> para controlar el volumen y un <a href="/en-US/docs/Web/API/AudioDestinationNode"><code>AudioDestinationNode</code></a> como destino.</p>
+<h2 id="Inspeccionando_y_modificando_AudioNodes">Inspeccionando y modificando AudioNodes</h2>
+<p>Si hace clic en un nodo, se restalta y aparece un inspector del nodo en el lado derecho. Ahí se listan los valores de las propiedades del nodo <code>AudioParam</code>. Por ejemplo, así se ve el OscillatorNode:</p>
+<p><img alt="" src="https://mdn.mozillademos.org/files/7943/web-audio-editor-inspect-node.png" style="display: block; margin-left: auto; margin-right: auto;">Con el demo de Violent Theremin, el parámetro frecuencia es modificado cuando el usuario mueve el mouse hacia la izquierda o la derecha y eso se puede ver reflejado en el inspector del nodo. Sin embargo, el valor no es actualizado en tiempo real: hay que hacer clic en el nodo nuevamente para ver el valor actualizado.</p>
+<p>Si se hace clic en el valor en el inspector del nodo se puede modificar: presione Intro o Tab y el nuevo valor tiene efecto inmediatamente.</p>
diff --git a/files/es/tools/web_console/iniciando_la_consola_web/index.html b/files/es/tools/web_console/iniciando_la_consola_web/index.html
deleted file mode 100644
index 59b0156a49..0000000000
--- a/files/es/tools/web_console/iniciando_la_consola_web/index.html
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Iniciando la Consola Web
-slug: Tools/Web_Console/Iniciando_la_Consola_Web
-translation_of: Tools/Web_Console/UI_Tour
----
-<p>Para abrir la Consola Web:</p>
-
-<ul>
- <li>Puedes seleccionar "Consola Web" desde el submenu Desarrollador Web en el menu de Firefox ( o menu Herramientas si despliegas la barra menu o estas utilizando Mac OS X)</li>
- <li>o presionando el <kbd>Ctrl</kbd><kbd>Shift</kbd><kbd>K</kbd> (<kbd>Command</kbd><kbd>Option</kbd><kbd>K</kbd> en OS X) atajo de teclado.</li>
-</ul>
-
-<p>La Caja de herramientas (<a href="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window" title="/en-US/docs/Tools/DevTools_Window">Toolbox</a>) aparecera en la parte baja de la ventana del navegador, con la Consola Web activada (solamente se le llama "Consola" en la barra de herramientas DevTools (<a href="/en-US/docs/Tools/DevTools_Window#Toolbar" title="/en-US/docs/Tools/DevTools_Window#Toolbar">DevTools toolbar</a>)):</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/11669/console.png" style="display: block; height: 324px; margin-left: auto; margin-right: auto; width: 952px;"></p>
-
-<p>La interfaz de la Consola Web esta dividida en tres secciones horizontales que son:</p>
-
-<ul>
- <li>Barra de herramientas (<a href="/en-US/docs/Tools/Web_Console/Console_messages#Filtering_by_category" title="#filtering-and-searching">Toolbar</a>): A lo largo de la parte de arriba esta la barra de herramientas, contiene botones con etiquetas como "Net", "CSS", and "JS". Esta barra de herramientas se usa para filtrar cuales mensajes seran mostrados.</li>
- <li>Linea de comando (<a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter" title="#command-line">Command Line</a>): A lo largo  de la parte de abajo esta una linea de comando que se puede utilizar para ingresar expresiones en  JavaScript </li>
- <li>Panel de Mensaje (<a href="/en-US/docs/Tools/Web_Console/Console_messages" title="#message-display-pane">Message Display Pane</a>): se localiza en medio de la barra de herramientas y la linea de omando, ocupa la mayor parte de la ventana, es el espacio en el cual la Consola Web muestra los mensajes.</li>
-</ul>
diff --git a/files/es/tools/web_console/la_línea_de_comandos_del_intérprete/index.html b/files/es/tools/web_console/la_línea_de_comandos_del_intérprete/index.html
deleted file mode 100644
index 06e5922248..0000000000
--- a/files/es/tools/web_console/la_línea_de_comandos_del_intérprete/index.html
+++ /dev/null
@@ -1,188 +0,0 @@
----
-title: La línea de comandos del intérprete de JavaScript
-slug: Tools/Web_Console/La_línea_de_comandos_del_intérprete
-tags:
-  - Debugging
-  - Depuración
-  - Desarrollo web
-  - consola web
-translation_of: Tools/Web_Console/The_command_line_interpreter
----
-<div>{{ToolsSidebar}}</div>
-
-<p>Puedes interpretar expresiones JavaScript en tiempo real utilizando el intérprete proporcionado por la Consola web. Tiene dos modos: entrada unilínea y entrada multilínea.</p>
-
-<h2 id="Modo_unilínea">Modo unilínea</h2>
-
-<p>Para entrada de una sola línea, puedes escribir expresiones JavaScript en el campo en la parte inferior del registro de la consola, en el indicador <strong>&gt;&gt;</strong>.</p>
-
-<p><img alt="La consola web, mostrando el modo unilínea" src="https://mdn.mozillademos.org/files/16965/web_console_single.png" style="display: block; height: 704px; margin-left: auto; margin-right: auto; width: 1952px;"></p>
-
-<p>Para ingresar expresiones en el modo unilínea, escribe en el indicador y presiona <kbd>Intro</kbd>. Para ingresar expresiones de varias líneas, presiona <kbd>Mayús</kbd>+<kbd>Intro</kbd> después de escribir cada línea, luego <kbd>Intro</kbd> para ejecutar todas las líneas ingresadas.</p>
-
-<p>La expresión que escribas se repite debajo de la petición de entrada, seguida del resultado.</p>
-
-<p>Si tu entrada no parece estar completa cuando presiones <kbd>Intro</kbd>, la consola lo trata como <kbd>Mayús</kbd>+<kbd>Intro</kbd>, lo cual te permite finalizar tu entrada.</p>
-
-<p>Por ejemplo, si escribes:</p>
-
-<pre class="brush: js notranslate">function foo() {</pre>
-
-<p>y luego <kbd>Intro</kbd>, la consola no ejecuta inmediatamente la entrada, pero se comporta como si hubieras presionado <kbd>Mayús</kbd>+<kbd>Intro</kbd>, para que puedas terminar de ingresar la definición de la función.</p>
-
-<h2 id="Modo_multilínea">Modo multilínea</h2>
-
-<p>Para la entrada multilínea, haz clic en el icono de "panel dividido" en el lado derecho del campo de entrada unilínea, o presiona <kbd>Ctrl</kbd>+<kbd>B</kbd> (Windows/Linux) o <kbd>Cmd</kbd>+<kbd>B</kbd> (macOS). El panel de edición multilínea se abre en el lado izquierdo de la Consola web.</p>
-
-<p><img alt="Modo multilínea en la consola web" src="https://mdn.mozillademos.org/files/16966/web_console_multi.png" style="border-style: solid; border-width: 1px; height: 700px; width: 1946px;"></p>
-
-<p>De manera predeterminada, en este modo puedes ingresar múltiples líneas de JavaScript, presionando <kbd>Intro</kbd> después de cada una. Para ejecutar el fragmento que se encuentre actualmente en el panel de edición, haz clic en el botón <strong>Ejecutar</strong> o presiona <kbd>Ctrl</kbd>+<kbd>Intro</kbd> (o <kbd>Cmd</kbd>+<kbd>Intro</kbd> en MacOS). El fragmento se repite debajo de la petición de entrada (en el panel del lado derecho), seguido del resultado. También puedes seleccionar un rango de líneas en el panel de edición y ejecutar solo el código en esas líneas.</p>
-
-<p>A partir de Firefox 76, si el fragmento de código tiene más de cinco líneas, solo las primeras cinco líneas se repiten en la consola, precedidas por un triángulo desplegable (o "twistie") y seguidos por puntos suspensivos (…). Haz clic en cualquier parte del área que contiene el código reproducido para mostrar el fragmento completo; haz clic de nuevo en esa área para contraerlo.</p>
-
-<p>Puedes abrir archivos en el modo multilínea y guardar el contenido actual del panel de edición en un archivo.</p>
-
-<ul>
- <li>Para abrir un archivo, presiona <kbd>Ctrl</kbd>+<kbd>O</kbd> (<kbd>Cmd</kbd>+<kbd>O</kbd> en MacOS). Se abre un cuadro de diálogo de archivo para que puedas seleccionar el archivo que deseas abrir.</li>
- <li>Para guardar el contenido del panel de edición, presiona <kbd>Ctrl</kbd>+<kbd>S</kbd> (<kbd>Cmd</kbd>+<kbd>S</kbd> en MacOS). Se abre un cuadro de diálogo de archivo para que puedas especificar la ubicación en la que deseas guardar el archivo.</li>
-</ul>
-
-<p>Para volver al modo unilínea, haz clic en el icono <strong>X</strong> en la parte superior del panel de edición multilínea o presiona <kbd>Ctrl</kbd>+<kbd>B</kbd> (Windows/Linux) o <kbd>Cmd</kbd>+<kbd>B</kbd> (MacOS).</p>
-
-<h2 id="Acceder_a_variables">Acceder a variables</h2>
-
-<p>Puedes acceder a las variables definidas en la página, tanto variables integradas como <code>window</code> como variables agregadas por bibliotecas de JavaScript como <em>jQuery</em>:</p>
-
-<p><img alt="Accder a variables" src="https://mdn.mozillademos.org/files/7367/commandline-accessbuiltin.png" style="display: block; margin-left: auto; margin-right: auto;"><img alt="" src="https://mdn.mozillademos.org/files/7369/commandline-accesspageadded.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
-
-<h2 id="Autocompletado">Autocompletado</h2>
-
-<p>El editor tiene autocompletado: ingresa las primeras letras y aparecerá una ventana emergente con posibles terminaciones:</p>
-
-<p><img alt="Autocompletado" src="https://mdn.mozillademos.org/files/16426/console_autocomplete_cropped.png" style="border: 1px solid black; display: block; height: 299px; margin-left: auto; margin-right: auto; width: 302px;"></p>
-
-<p>Presiona <kbd>Intro</kbd>, <kbd>Tab</kbd> o la tecla de flecha derecha para aceptar la sugerencia, usa las flechas arriba/abajo para pasar a una diferente sugerencia, o simplemente sigue escribiendo si no te gusta ninguna de las sugerencias.</p>
-
-<p>Las sugerencias de autocompletado de la consola no distinguen entre mayúsculas y minúsculas.</p>
-
-<p>La consola sugiere terminaciones del ámbito del marco de la pila que se está ejecutando actualmente. Esto significa que si has alcanzado un punto de interrupción en una función, obtienes autocompletado para los objetos locales a la función.</p>
-
-<p>También obtienes sugerencias de autocompletado para elementos de arreglo:</p>
-
-<p><img alt="Autocompletado en arreglos" src="https://mdn.mozillademos.org/files/16440/arrayList_autocomplete.png" style="border: 1px solid black; display: block; height: 271px; margin-left: auto; margin-right: auto; width: 800px;"></p>
-
-<p>Puedes habilitar o deshabilitar el autocompletado a través del menú Configuración ("engrane") en la barra de herramientas de la Consola web. El elemento de menú <strong>Habilitar autocompletado</strong> tiene una marca de verificación junto a él cuando la función está habilitada, que falta cuando está inhabilitada. Selecciona el elemento del menú para cambiar el estado.</p>
-
-<h2 id="Evaluación_instantánea">Evaluación instantánea</h2>
-
-<div class="blockIndicator note">
-<p>Esta característica está disponible en Firefox Nightly, en las versiones etiquetadas con 74 y posteriores.</p>
-</div>
-
-<p>Cuando la característica de "evaluación instantánea" está habilitada, el intérprete muestra los resultados de las expresiones mientras las escribes en el modo unilínea. Ten en cuenta que el resultado puede ser un mensaje de error. Las expresiones que tienen efectos secundarios no se evalúan.</p>
-
-<p>Puedes habilitar o deshabilitar la evaluación instantánea a través del menú Configuración ("engrane") en la barra de herramientas de la Consola web. El elemento <strong>Evaluación instantánea</strong> del menú tiene una marca de verificación junto a él cuando la característica está habilitada, y falta cuando está inhabilitada. Selecciona el elemento del menú para cambiar el estado.</p>
-
-<h2 id="Contexto_de_ejecución">Contexto de ejecución</h2>
-
-<p>El código que has ejecutado se convierte en parte del contexto de ejecución, independientemente del modo de edición en el que te encontrabas cuando lo ejecutaste. Por ejemplo, si escribes una definición de función en el editor multilínea y haces clic en <strong>Ejecutar</strong>, puedes cambiar al modo unilínea y seguir utilizando tu función.</p>
-
-<h2 id="Resaltado_de_sintaxis">Resaltado de sintaxis</h2>
-
-<p><img alt="La salida de la consola mostrando la sintaxis resaltada" src="https://mdn.mozillademos.org/files/16470/console_syntaxHighlighting.png" style="border: 1px solid black; display: block; height: 310px; margin-left: auto; margin-right: auto; width: 452px;"></p>
-
-<p>El texto que ingreses tiene resaltado de sintaxis tan pronto como hayas escrito lo suficiente para que el resaltador lo analice e infiera el significado de las "palabras".</p>
-
-<p>La salida también se resalta cuando es apropiado.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> El resaltado de sintaxis no está visible en tu navegador si se han habilitado las funciones de accesibilidad.</p>
-</div>
-
-<h2 id="Historial_de_ejecución">Historial de ejecución</h2>
-
-<p>El intérprete recuerda las expresiones que has escrito. Para avanzar y retroceder en tu historial:</p>
-
-<ul>
- <li>En el modo unilínea, usa las flechas hacia arriba y hacia abajo.</li>
- <li>En el modo multilínea, utiliza los iconos <strong>⋀</strong> y <strong>⋁</strong> de la barra de herramientas del panel de edición.</li>
-</ul>
-
-<p>El historial de expresiones se conserva entre sesiones. Para borrar el historial, usa la <a href="/es/docs/Tools/Web_Console/The_command_line_interpreter#Helper_commands">función auxiliar</a> <code>clearHistory()</code>.</p>
-
-<p>Puedes iniciar una búsqueda inversa a través del historial de expresiones, al igual que en bash en Linux y Mac o PowerShell en Windows. En Windows y Linux, presiona <kbd>F9</kbd>. En Mac, presiona <kbd>Ctrl</kbd>+<kbd>R</kbd> (<strong>Nota:</strong> ¡no <kbd>Cmd</kbd>+<kbd>R</kbd>!) para iniciar la búsqueda inversa.</p>
-
-<p><img alt="Búsqueda inversa" src="https://mdn.mozillademos.org/files/16468/reverse_search.png" style="border: 1px solid black; display: block; height: 335px; margin: 0px auto; width: 500px;"></p>
-
-<p>Ingresa el texto que deseas buscar en el cuadro de entrada en la parte inferior de la consola. Empieza a escribir parte de la expresión que estás buscando y la primera coincidencia se mostrará en la consola. Si escribes <kbd>F9</kbd> repetidamente en Windows y Linux (<kbd>Ctrl</kbd>+<kbd>R</kbd> en Mac), retrocedes por las coincidencias.</p>
-
-<p><img alt="Ejemplo de búsqueda inversa" src="https://mdn.mozillademos.org/files/16469/reverse_search_example.png" style="border: 1px solid black; display: block; margin: 0 auto;"></p>
-
-<p>Una vez que hayas iniciado la búsqueda inversa, puedes usar <kbd>Mayús</kbd>+<kbd>F9</kbd> en Windows o Linux (<kbd>Ctrl</kbd>+<kbd>S</kbd> en Mac) para buscar hacia adelante en la lista de coincidencias. También puedes utilizar los iconos <strong>⋀</strong> y <strong>⋁</strong> en la barra de búsqueda de expresiones.</p>
-
-<p>Cuando encuentres la expresión que deseas, presiona <kbd>Intro</kbd> (<kbd>Intro</kbd>) para ejecutar la instrucción.</p>
-
-<h2 id="Trabajando_con_iframes">Trabajando con <code>iframe</code>s</h2>
-
-<p>Si una página contiene <a href="/es/docs/Web/HTML/Element/iframe">iframes</a> incrustados, puedes utilizar la función <code>cd()</code> para cambiar el alcance de la consola a un <code>iframe</code> específico, y luego puedes ejecutar funciones definidas en el documento alojado por ese <code>iframe</code>. Hay tres formas de seleccionar un <code>iframe</code> usando <code>cd()</code>:</p>
-
-<p>Puedes pasar el elemento <code>iframe</code> del DOM:</p>
-
-<pre class="brush: js notranslate">var frame = document.getElementById("frame1");
-cd(frame);</pre>
-
-<p>Puedes pasar un selector de CSS que coincida con el <code>iframe</code>:</p>
-
-<pre class="brush: js notranslate">cd("#frame1");</pre>
-
-<p>Puedes pasar el objeto <code>window</code> global del <code>iframe</code>:</p>
-
-<pre class="brush: js notranslate">var frame = document.getElementById("frame1");
-cd(frame.contentWindow);
-</pre>
-
-<p>Para volver a cambiar el contexto al objeto <code>window</code> de nivel superior, llama a <code>cd()</code> sin argumentos:</p>
-
-<pre class="brush: js notranslate">cd();</pre>
-
-<p>Por ejemplo, supongamos que tenemos un documento que incluye un <code>iframe</code>:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="UTF-8"&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;iframe id="frame1" src="static/frame/my-frame1.html"&gt;&lt;/iframe&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>El <code>iframe</code> define una nueva función:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="UTF-8"&gt;
-    &lt;script&gt;
-      function whoAreYou() {
-        return "Yo soy el frame1";
-      }
-   &lt;/script&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>Puedes cambiar el contexto al <code>iframe</code> de esta manera:</p>
-
-<pre class="brush: js notranslate">cd("#frame1");</pre>
-
-<p>Ahora verás que el objeto <code>window</code> global del documento es el <code>iframe</code>:</p>
-
-<p><img alt="window global del documento" src="https://mdn.mozillademos.org/files/7355/web-console-iframe-document.png" style="display: block; height: 75px; margin-left: auto; margin-right: auto; width: 632px;">Y puedes llamar a la función definida en el <code>iframe</code>:</p>
-
-<p><img alt="función en la consola web" src="https://mdn.mozillademos.org/files/7357/web-console-iframe-function.png" style="display: block; height: 77px; margin-left: auto; margin-right: auto; width: 632px;"></p>
-
-<h2 id="Comandos_auxiliares">Comandos auxiliares</h2>
-
-<p>{{ page("es/docs/Tools/Web_Console/Helpers", "Los comandos") }}</p>
diff --git a/files/es/tools/web_console/the_command_line_interpreter/index.html b/files/es/tools/web_console/the_command_line_interpreter/index.html
new file mode 100644
index 0000000000..b1d652f0d3
--- /dev/null
+++ b/files/es/tools/web_console/the_command_line_interpreter/index.html
@@ -0,0 +1,189 @@
+---
+title: La línea de comandos del intérprete de JavaScript
+slug: Tools/Web_Console/The_command_line_interpreter
+tags:
+  - Debugging
+  - Depuración
+  - Desarrollo web
+  - consola web
+translation_of: Tools/Web_Console/The_command_line_interpreter
+original_slug: Tools/Web_Console/La_línea_de_comandos_del_intérprete
+---
+<div>{{ToolsSidebar}}</div>
+
+<p>Puedes interpretar expresiones JavaScript en tiempo real utilizando el intérprete proporcionado por la Consola web. Tiene dos modos: entrada unilínea y entrada multilínea.</p>
+
+<h2 id="Modo_unilínea">Modo unilínea</h2>
+
+<p>Para entrada de una sola línea, puedes escribir expresiones JavaScript en el campo en la parte inferior del registro de la consola, en el indicador <strong>&gt;&gt;</strong>.</p>
+
+<p><img alt="La consola web, mostrando el modo unilínea" src="https://mdn.mozillademos.org/files/16965/web_console_single.png" style="display: block; height: 704px; margin-left: auto; margin-right: auto; width: 1952px;"></p>
+
+<p>Para ingresar expresiones en el modo unilínea, escribe en el indicador y presiona <kbd>Intro</kbd>. Para ingresar expresiones de varias líneas, presiona <kbd>Mayús</kbd>+<kbd>Intro</kbd> después de escribir cada línea, luego <kbd>Intro</kbd> para ejecutar todas las líneas ingresadas.</p>
+
+<p>La expresión que escribas se repite debajo de la petición de entrada, seguida del resultado.</p>
+
+<p>Si tu entrada no parece estar completa cuando presiones <kbd>Intro</kbd>, la consola lo trata como <kbd>Mayús</kbd>+<kbd>Intro</kbd>, lo cual te permite finalizar tu entrada.</p>
+
+<p>Por ejemplo, si escribes:</p>
+
+<pre class="brush: js notranslate">function foo() {</pre>
+
+<p>y luego <kbd>Intro</kbd>, la consola no ejecuta inmediatamente la entrada, pero se comporta como si hubieras presionado <kbd>Mayús</kbd>+<kbd>Intro</kbd>, para que puedas terminar de ingresar la definición de la función.</p>
+
+<h2 id="Modo_multilínea">Modo multilínea</h2>
+
+<p>Para la entrada multilínea, haz clic en el icono de "panel dividido" en el lado derecho del campo de entrada unilínea, o presiona <kbd>Ctrl</kbd>+<kbd>B</kbd> (Windows/Linux) o <kbd>Cmd</kbd>+<kbd>B</kbd> (macOS). El panel de edición multilínea se abre en el lado izquierdo de la Consola web.</p>
+
+<p><img alt="Modo multilínea en la consola web" src="https://mdn.mozillademos.org/files/16966/web_console_multi.png" style="border-style: solid; border-width: 1px; height: 700px; width: 1946px;"></p>
+
+<p>De manera predeterminada, en este modo puedes ingresar múltiples líneas de JavaScript, presionando <kbd>Intro</kbd> después de cada una. Para ejecutar el fragmento que se encuentre actualmente en el panel de edición, haz clic en el botón <strong>Ejecutar</strong> o presiona <kbd>Ctrl</kbd>+<kbd>Intro</kbd> (o <kbd>Cmd</kbd>+<kbd>Intro</kbd> en MacOS). El fragmento se repite debajo de la petición de entrada (en el panel del lado derecho), seguido del resultado. También puedes seleccionar un rango de líneas en el panel de edición y ejecutar solo el código en esas líneas.</p>
+
+<p>A partir de Firefox 76, si el fragmento de código tiene más de cinco líneas, solo las primeras cinco líneas se repiten en la consola, precedidas por un triángulo desplegable (o "twistie") y seguidos por puntos suspensivos (…). Haz clic en cualquier parte del área que contiene el código reproducido para mostrar el fragmento completo; haz clic de nuevo en esa área para contraerlo.</p>
+
+<p>Puedes abrir archivos en el modo multilínea y guardar el contenido actual del panel de edición en un archivo.</p>
+
+<ul>
+ <li>Para abrir un archivo, presiona <kbd>Ctrl</kbd>+<kbd>O</kbd> (<kbd>Cmd</kbd>+<kbd>O</kbd> en MacOS). Se abre un cuadro de diálogo de archivo para que puedas seleccionar el archivo que deseas abrir.</li>
+ <li>Para guardar el contenido del panel de edición, presiona <kbd>Ctrl</kbd>+<kbd>S</kbd> (<kbd>Cmd</kbd>+<kbd>S</kbd> en MacOS). Se abre un cuadro de diálogo de archivo para que puedas especificar la ubicación en la que deseas guardar el archivo.</li>
+</ul>
+
+<p>Para volver al modo unilínea, haz clic en el icono <strong>X</strong> en la parte superior del panel de edición multilínea o presiona <kbd>Ctrl</kbd>+<kbd>B</kbd> (Windows/Linux) o <kbd>Cmd</kbd>+<kbd>B</kbd> (MacOS).</p>
+
+<h2 id="Acceder_a_variables">Acceder a variables</h2>
+
+<p>Puedes acceder a las variables definidas en la página, tanto variables integradas como <code>window</code> como variables agregadas por bibliotecas de JavaScript como <em>jQuery</em>:</p>
+
+<p><img alt="Accder a variables" src="https://mdn.mozillademos.org/files/7367/commandline-accessbuiltin.png" style="display: block; margin-left: auto; margin-right: auto;"><img alt="" src="https://mdn.mozillademos.org/files/7369/commandline-accesspageadded.png" style="display: block; margin-left: auto; margin-right: auto;"></p>
+
+<h2 id="Autocompletado">Autocompletado</h2>
+
+<p>El editor tiene autocompletado: ingresa las primeras letras y aparecerá una ventana emergente con posibles terminaciones:</p>
+
+<p><img alt="Autocompletado" src="https://mdn.mozillademos.org/files/16426/console_autocomplete_cropped.png" style="border: 1px solid black; display: block; height: 299px; margin-left: auto; margin-right: auto; width: 302px;"></p>
+
+<p>Presiona <kbd>Intro</kbd>, <kbd>Tab</kbd> o la tecla de flecha derecha para aceptar la sugerencia, usa las flechas arriba/abajo para pasar a una diferente sugerencia, o simplemente sigue escribiendo si no te gusta ninguna de las sugerencias.</p>
+
+<p>Las sugerencias de autocompletado de la consola no distinguen entre mayúsculas y minúsculas.</p>
+
+<p>La consola sugiere terminaciones del ámbito del marco de la pila que se está ejecutando actualmente. Esto significa que si has alcanzado un punto de interrupción en una función, obtienes autocompletado para los objetos locales a la función.</p>
+
+<p>También obtienes sugerencias de autocompletado para elementos de arreglo:</p>
+
+<p><img alt="Autocompletado en arreglos" src="https://mdn.mozillademos.org/files/16440/arrayList_autocomplete.png" style="border: 1px solid black; display: block; height: 271px; margin-left: auto; margin-right: auto; width: 800px;"></p>
+
+<p>Puedes habilitar o deshabilitar el autocompletado a través del menú Configuración ("engrane") en la barra de herramientas de la Consola web. El elemento de menú <strong>Habilitar autocompletado</strong> tiene una marca de verificación junto a él cuando la función está habilitada, que falta cuando está inhabilitada. Selecciona el elemento del menú para cambiar el estado.</p>
+
+<h2 id="Evaluación_instantánea">Evaluación instantánea</h2>
+
+<div class="blockIndicator note">
+<p>Esta característica está disponible en Firefox Nightly, en las versiones etiquetadas con 74 y posteriores.</p>
+</div>
+
+<p>Cuando la característica de "evaluación instantánea" está habilitada, el intérprete muestra los resultados de las expresiones mientras las escribes en el modo unilínea. Ten en cuenta que el resultado puede ser un mensaje de error. Las expresiones que tienen efectos secundarios no se evalúan.</p>
+
+<p>Puedes habilitar o deshabilitar la evaluación instantánea a través del menú Configuración ("engrane") en la barra de herramientas de la Consola web. El elemento <strong>Evaluación instantánea</strong> del menú tiene una marca de verificación junto a él cuando la característica está habilitada, y falta cuando está inhabilitada. Selecciona el elemento del menú para cambiar el estado.</p>
+
+<h2 id="Contexto_de_ejecución">Contexto de ejecución</h2>
+
+<p>El código que has ejecutado se convierte en parte del contexto de ejecución, independientemente del modo de edición en el que te encontrabas cuando lo ejecutaste. Por ejemplo, si escribes una definición de función en el editor multilínea y haces clic en <strong>Ejecutar</strong>, puedes cambiar al modo unilínea y seguir utilizando tu función.</p>
+
+<h2 id="Resaltado_de_sintaxis">Resaltado de sintaxis</h2>
+
+<p><img alt="La salida de la consola mostrando la sintaxis resaltada" src="https://mdn.mozillademos.org/files/16470/console_syntaxHighlighting.png" style="border: 1px solid black; display: block; height: 310px; margin-left: auto; margin-right: auto; width: 452px;"></p>
+
+<p>El texto que ingreses tiene resaltado de sintaxis tan pronto como hayas escrito lo suficiente para que el resaltador lo analice e infiera el significado de las "palabras".</p>
+
+<p>La salida también se resalta cuando es apropiado.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> El resaltado de sintaxis no está visible en tu navegador si se han habilitado las funciones de accesibilidad.</p>
+</div>
+
+<h2 id="Historial_de_ejecución">Historial de ejecución</h2>
+
+<p>El intérprete recuerda las expresiones que has escrito. Para avanzar y retroceder en tu historial:</p>
+
+<ul>
+ <li>En el modo unilínea, usa las flechas hacia arriba y hacia abajo.</li>
+ <li>En el modo multilínea, utiliza los iconos <strong>⋀</strong> y <strong>⋁</strong> de la barra de herramientas del panel de edición.</li>
+</ul>
+
+<p>El historial de expresiones se conserva entre sesiones. Para borrar el historial, usa la <a href="/es/docs/Tools/Web_Console/The_command_line_interpreter#Helper_commands">función auxiliar</a> <code>clearHistory()</code>.</p>
+
+<p>Puedes iniciar una búsqueda inversa a través del historial de expresiones, al igual que en bash en Linux y Mac o PowerShell en Windows. En Windows y Linux, presiona <kbd>F9</kbd>. En Mac, presiona <kbd>Ctrl</kbd>+<kbd>R</kbd> (<strong>Nota:</strong> ¡no <kbd>Cmd</kbd>+<kbd>R</kbd>!) para iniciar la búsqueda inversa.</p>
+
+<p><img alt="Búsqueda inversa" src="https://mdn.mozillademos.org/files/16468/reverse_search.png" style="border: 1px solid black; display: block; height: 335px; margin: 0px auto; width: 500px;"></p>
+
+<p>Ingresa el texto que deseas buscar en el cuadro de entrada en la parte inferior de la consola. Empieza a escribir parte de la expresión que estás buscando y la primera coincidencia se mostrará en la consola. Si escribes <kbd>F9</kbd> repetidamente en Windows y Linux (<kbd>Ctrl</kbd>+<kbd>R</kbd> en Mac), retrocedes por las coincidencias.</p>
+
+<p><img alt="Ejemplo de búsqueda inversa" src="https://mdn.mozillademos.org/files/16469/reverse_search_example.png" style="border: 1px solid black; display: block; margin: 0 auto;"></p>
+
+<p>Una vez que hayas iniciado la búsqueda inversa, puedes usar <kbd>Mayús</kbd>+<kbd>F9</kbd> en Windows o Linux (<kbd>Ctrl</kbd>+<kbd>S</kbd> en Mac) para buscar hacia adelante en la lista de coincidencias. También puedes utilizar los iconos <strong>⋀</strong> y <strong>⋁</strong> en la barra de búsqueda de expresiones.</p>
+
+<p>Cuando encuentres la expresión que deseas, presiona <kbd>Intro</kbd> (<kbd>Intro</kbd>) para ejecutar la instrucción.</p>
+
+<h2 id="Trabajando_con_iframes">Trabajando con <code>iframe</code>s</h2>
+
+<p>Si una página contiene <a href="/es/docs/Web/HTML/Element/iframe">iframes</a> incrustados, puedes utilizar la función <code>cd()</code> para cambiar el alcance de la consola a un <code>iframe</code> específico, y luego puedes ejecutar funciones definidas en el documento alojado por ese <code>iframe</code>. Hay tres formas de seleccionar un <code>iframe</code> usando <code>cd()</code>:</p>
+
+<p>Puedes pasar el elemento <code>iframe</code> del DOM:</p>
+
+<pre class="brush: js notranslate">var frame = document.getElementById("frame1");
+cd(frame);</pre>
+
+<p>Puedes pasar un selector de CSS que coincida con el <code>iframe</code>:</p>
+
+<pre class="brush: js notranslate">cd("#frame1");</pre>
+
+<p>Puedes pasar el objeto <code>window</code> global del <code>iframe</code>:</p>
+
+<pre class="brush: js notranslate">var frame = document.getElementById("frame1");
+cd(frame.contentWindow);
+</pre>
+
+<p>Para volver a cambiar el contexto al objeto <code>window</code> de nivel superior, llama a <code>cd()</code> sin argumentos:</p>
+
+<pre class="brush: js notranslate">cd();</pre>
+
+<p>Por ejemplo, supongamos que tenemos un documento que incluye un <code>iframe</code>:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="UTF-8"&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;iframe id="frame1" src="static/frame/my-frame1.html"&gt;&lt;/iframe&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>El <code>iframe</code> define una nueva función:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="UTF-8"&gt;
+    &lt;script&gt;
+      function whoAreYou() {
+        return "Yo soy el frame1";
+      }
+   &lt;/script&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+  &lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>Puedes cambiar el contexto al <code>iframe</code> de esta manera:</p>
+
+<pre class="brush: js notranslate">cd("#frame1");</pre>
+
+<p>Ahora verás que el objeto <code>window</code> global del documento es el <code>iframe</code>:</p>
+
+<p><img alt="window global del documento" src="https://mdn.mozillademos.org/files/7355/web-console-iframe-document.png" style="display: block; height: 75px; margin-left: auto; margin-right: auto; width: 632px;">Y puedes llamar a la función definida en el <code>iframe</code>:</p>
+
+<p><img alt="función en la consola web" src="https://mdn.mozillademos.org/files/7357/web-console-iframe-function.png" style="display: block; height: 77px; margin-left: auto; margin-right: auto; width: 632px;"></p>
+
+<h2 id="Comandos_auxiliares">Comandos auxiliares</h2>
+
+<p>{{ page("es/docs/Tools/Web_Console/Helpers", "Los comandos") }}</p>
diff --git a/files/es/tools/web_console/ui_tour/index.html b/files/es/tools/web_console/ui_tour/index.html
new file mode 100644
index 0000000000..c1d39ba98d
--- /dev/null
+++ b/files/es/tools/web_console/ui_tour/index.html
@@ -0,0 +1,24 @@
+---
+title: Iniciando la Consola Web
+slug: Tools/Web_Console/UI_Tour
+translation_of: Tools/Web_Console/UI_Tour
+original_slug: Tools/Web_Console/Iniciando_la_Consola_Web
+---
+<p>Para abrir la Consola Web:</p>
+
+<ul>
+ <li>Puedes seleccionar "Consola Web" desde el submenu Desarrollador Web en el menu de Firefox ( o menu Herramientas si despliegas la barra menu o estas utilizando Mac OS X)</li>
+ <li>o presionando el <kbd>Ctrl</kbd><kbd>Shift</kbd><kbd>K</kbd> (<kbd>Command</kbd><kbd>Option</kbd><kbd>K</kbd> en OS X) atajo de teclado.</li>
+</ul>
+
+<p>La Caja de herramientas (<a href="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window" title="/en-US/docs/Tools/DevTools_Window">Toolbox</a>) aparecera en la parte baja de la ventana del navegador, con la Consola Web activada (solamente se le llama "Consola" en la barra de herramientas DevTools (<a href="/en-US/docs/Tools/DevTools_Window#Toolbar" title="/en-US/docs/Tools/DevTools_Window#Toolbar">DevTools toolbar</a>)):</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/11669/console.png" style="display: block; height: 324px; margin-left: auto; margin-right: auto; width: 952px;"></p>
+
+<p>La interfaz de la Consola Web esta dividida en tres secciones horizontales que son:</p>
+
+<ul>
+ <li>Barra de herramientas (<a href="/en-US/docs/Tools/Web_Console/Console_messages#Filtering_by_category" title="#filtering-and-searching">Toolbar</a>): A lo largo de la parte de arriba esta la barra de herramientas, contiene botones con etiquetas como "Net", "CSS", and "JS". Esta barra de herramientas se usa para filtrar cuales mensajes seran mostrados.</li>
+ <li>Linea de comando (<a href="/en-US/docs/Tools/Web_Console/The_command_line_interpreter" title="#command-line">Command Line</a>): A lo largo  de la parte de abajo esta una linea de comando que se puede utilizar para ingresar expresiones en  JavaScript </li>
+ <li>Panel de Mensaje (<a href="/en-US/docs/Tools/Web_Console/Console_messages" title="#message-display-pane">Message Display Pane</a>): se localiza en medio de la barra de herramientas y la linea de omando, ocupa la mayor parte de la ventana, es el espacio en el cual la Consola Web muestra los mensajes.</li>
+</ul>
diff --git a/files/es/traducir_las_descripciones_de_las_extensiones/index.html b/files/es/traducir_las_descripciones_de_las_extensiones/index.html
deleted file mode 100644
index f2a85cff51..0000000000
--- a/files/es/traducir_las_descripciones_de_las_extensiones/index.html
+++ /dev/null
@@ -1,90 +0,0 @@
----
-title: Traducir las descripciones de las extensiones
-slug: Traducir_las_descripciones_de_las_extensiones
-tags:
-  - Complementos
-  - Localización
-  - Todas_las_Categorías
-  - extensiones
----
-<p> </p>
-<h3 id="Localizing_in_Gecko_1.9" name="Localizing_in_Gecko_1.9">Localizing in Gecko 1.9</h3>
-<p>{{ Gecko_minversion_header(1.9) }} {{ Fx_minversion_header(3) }}</p>
-<p>Gecko 1.9 incluye un nuevo y más robusto método para localizar descripciones añadidas y otros metadatos. Todas las diferentes descripciones aparecen ahora en el fichero <a href="es/Install_Manifests">install.rdf</a> utilizando las propedades <code>em:localized</code>. Cada una contiene al menos una propiedad <code>em:locale</code> que marca el localizador (locale) para el cual deberá utilizarse la citada información y, además, todas las diversas cadenas (strings) del localizador. El siguiente ejemplo demuestra lo dicho (la mayoría de las propiedades normales del manifiesto han sido suprimidas para abreviar):</p>
-<pre>&lt;?xml version="1.0"?&gt;
-
-&lt;RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-     xmlns:em="http://www.mozilla.org/2004/em-rdf#"&gt;
-  &lt;Description about="urn:mozilla:install-manifest"&gt;
-    &lt;em:id&gt;TabSidebar@blueprintit.co.uk&lt;/em:id&gt;
-    &lt;em:localized&gt;
-      &lt;Description&gt;
-        &lt;em:locale&gt;de-DE&lt;/em:locale&gt;
-        &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
-        &lt;em:description&gt;Zeigt in einer Sidebar Vorschaubilder der Inhalte aller offenen Tabs an.&lt;/em:description&gt;
-      &lt;/Description&gt;
-    &lt;/em:localized&gt;
-    &lt;em:localized&gt;
-      &lt;Description&gt;
-        &lt;em:locale&gt;es-ES&lt;/em:locale&gt;
-        &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
-        &lt;em:description&gt;Muestra una vista previa de sus pestañas en su panel lateral.&lt;/em:description&gt;
-      &lt;/Description&gt;
-    &lt;/em:localized&gt;
-    &lt;em:localized&gt;
-      &lt;Description&gt;
-        &lt;em:locale&gt;nl-NL&lt;/em:locale&gt;
-        &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
-        &lt;em:description&gt;Laat voorbeeldweergaven van uw tabbladen in de zijbalk zien.&lt;/em:description&gt;
-      &lt;/Description&gt;
-    &lt;/em:localized&gt;
-    &lt;em:name&gt;Tab Sidebar&lt;/em:name&gt;
-    &lt;em:description&gt;Displays previews of your tabs in your sidebar.&lt;/em:description&gt;
-  &lt;/Description&gt;
-&lt;/RDF&gt;
-</pre>
-<p>Todos los metadatos mencionados más abajo pueden localizarse mediante este procedimiento. La información de localización "por defecto" proporcionada por la propiedad <code>em:localized</code>, puede ser pasada por alto utilizando un conjunto de preferencias de localización, según se detalla a continuación.</p>
-<p>El proceso para seleccionar la propiedad <code>em:localized</code> a utilizar para una determinada localización (locale) es el siguiente:</p>
-<ol>
- <li>Si existe una propiedad con un identificador <code>em:locale</code> que se corresponde exactamente con la localización (locale) entonces se usará esa propiedad.</li>
- <li>Si se encuentran comparaciones inexactas, entonces se utilizará aquella que tenga el máximo de partes coincidentes, estando dichas partes separadas entre sí por un guión (es decir, "es" coincidiría con "es-ES" y viceversa).</li>
- <li>Si existe más de un localizador (locale) con el mismo número de partes coincidentes, entonces se utilizará el más general (es decir, "en" será preferente en "en-GB" cuando se busque, antes que "en-US").</li>
-</ol>
-<p>En primer lugar se mostrará la localización actual "en-GB" y posteriormente se mostrará la segunda localización correspondiente a "en-US".</p>
-<p>Si no se ha establecido ninguna preferencia y no se encuentra una coindidencia <code>em:localized property</code> para la localización actual "en-GB" o "en-US" entonces se utilizarán las propiedades especificadas directamente en el manifiesto de instalación, como último recurso, tal y como se utilizaban en las versiones anteriores a la versión Gecko 1.9.</p>
-<h3 id="Localizar_antes_de_Gecko_1.9" name="Localizar_antes_de_Gecko_1.9">Localizar antes de Gecko 1.9</h3>
-<p>Antes de Gecko 1.9, los desarrolladores de extensiones o aplicaciones añadidas (add-ons) tenían que seguir un procedimiento especial para definir las descripciones adicionales locales para las aplicaciones añadidas orientadas a las aplicaciones basadas en el juego de herraminetas "toolkit" original (tales como Firefox o Thunderbird).</p>
-<ul>
- <li>Si aún no dispone de ellas, cree <a href="es/Localizing_an_extension#Localizing_strings_in_JavaScript_code"> localized properties files</a>. Asegúrese de que utiliza la codificación UTF-8 para garantizar que los caracteres extranjeros se muestren correctamente.</li>
- <li>Añada la siguiente línea a cada uno de sus ficheros de propiedades de localización (donde: <var>EXTENSION_ID</var> corresponda a su identificador de extensión (extension ID) (<code>&lt;em:id&gt;</code> de <a href="es/Install.rdf">install.rdf</a>) y <var>LOCALIZED_DESCRIPTION</var> es la descripción de su extensión, que usted desea que aparezca en el idioma determinado):
-  <pre>extensions.EXTENSION_ID.description=LOCALIZED_DESCRIPTION</pre>
- </li>
- <li>Si aún no dispone de uno, cree <a href="es/Building_an_Extension#Defaults_Files"> a default preferences file</a>.</li>
- <li>Añádale la siguiente línea (donde: <var>EXTENSION_ID</var> coincida con su identificador de aplicación (application ID) de <a href="es/Install_Manifests">install.rdf</a> y <var>PATH_TO_LOCALIZATION_FILE</var> sea la ruta correcta del fichero de localización que usted añadió anteriormente):
-  <pre>pref("extensions.EXTENSION_ID.description", "PATH_TO_LOCALIZATION_FILE");</pre>
- </li>
-</ul>
-<h4 id="Cadenas_Localizables" name="Cadenas_Localizables">Cadenas Localizables</h4>
-<p>Los siguientes "metadatos" de las extensiones o aplicaciones añadidas (add-ons) pueden ser localizados utilizando este proceso:</p>
-<ul>
- <li>name (nombre)</li>
- <li>description (descripción)</li>
- <li>creator (creador)</li>
- <li>homepageURL (URL de la página de inicio)</li>
-</ul>
-<h4 id="Listas_Localizables" name="Listas_Localizables">Listas Localizables</h4>
-<p>En los casos en que puedan existir múltiples valores, se añade un índice numérico al final del nombre de cada preferencia:</p>
-<pre>extensions.EXTENSION_ID.contributor.1=FIRST_LOCALIZED_CONTRIBUTOR_NAME
-extensions.EXTENSION_ID.contributor.2=SECOND_LOCALIZED_CONTRIBUTOR_NAME
-extensions.EXTENSION_ID.contributor.3=THRID_LOCALIZED_CONTRIBUTOR_NAME
-
-pref("extensions.EXTENSION_ID.contributor.1", "PATH_TO_LOCALIZATION_FILE");
-pref("extensions.EXTENSION_ID.contributor.2", "PATH_TO_LOCALIZATION_FILE");
-pref("extensions.EXTENSION_ID.contributor.3", "PATH_TO_LOCALIZATION_FILE");
-</pre>
-<p>Los siguientes "metadatos" de las extensiones o aplicaciones añadidas (add-ons) pueden localizarse utilizando este proceso:</p>
-<ul>
- <li>developer (desarrollador)</li>
- <li>translator (traductor)</li>
- <li>contributor (contribuidor)</li>
-</ul>
diff --git a/files/es/traducir_una_extensión/index.html b/files/es/traducir_una_extensión/index.html
deleted file mode 100644
index 7c5c33627a..0000000000
--- a/files/es/traducir_una_extensión/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Traducir una extensión
-slug: Traducir_una_extensión
-tags:
-  - Complementos
-  - Localización
-  - Todas_las_Categorías
-  - extensiones
----
-<p>{{PreviousNext("Añadir preferencias a una extensión", "Actualizar una extensión para que soporte múltiples aplicaciones de Mozilla")}}</p>
-
-<p>Este artículo está construido sobre los anteriores ejemplos de programación de extensiones añadiendo soporte para traducción a nuestra extensión. Realizando unos pocos y simples pasos se conseguirá hacer la extensión mucho más fácil de traducir en varios idiomas sin tener que editar los ficheros XUL o JavaScript.</p>
-
-<p>Si aún no has creado ninguna extensión o te gustaría refrescar la memoria, echa un vistazo a los anteriores artículos de la serie:</p>
-
-<ul>
- <li><a href="/es/Crear_una_extensi%C3%B3n_en_la_barra_de_estado" title="es/Crear_una_extensión_en_la_barra_de_estado">Crear una extensión en la barra de estado</a></li>
- <li><a href="/es/Crear_una_extensi%C3%B3n_din%C3%A1mica_en_la_barra_de_estado" title="es/Crear_una_extensión_dinámica_en_la_barra_de_estado">Crear una extensión dinámica en la barra de estado</a></li>
- <li><a href="/es/A%C3%B1adir_preferencias_a_una_extensi%C3%B3n" title="es/Añadir_preferencias_a_una_extensión">Añadir preferencias a una extensión</a></li>
-</ul>
-
-<h2 id="Descargar_el_ejemplo" name="Descargar_el_ejemplo">Descargar el ejemplo</h2>
-
-<p>Puedes descargar el código de ejemplo de este artículo para poder compararlo o para usarlo como base para tu propia extensión.</p>
-
-<p>http://developer.mozilla.org/samples/extension-samples/localizedstockwatcher.zip</p>
-
-<h2 id="Traducir_cadenas_en_los_ficheros_XUL" name="Traducir_cadenas_en_los_ficheros_XUL">Traducir cadenas en los ficheros XUL</h2>
-
-<h3 id="Crear_los_ficheros_de_configuraci.C3.B3n_regional_necesarios" name="Crear_los_ficheros_de_configuraci.C3.B3n_regional_necesarios">Crear los ficheros de configuración regional necesarios</h3>
-
-<p>Cada fichero XUL que comprende la interfaz de usuario de tu extensión debería tener un fichero local en su directorio locale.</p>
-
-<p>Cada fichero locale mapea los nombres de las entidades referenciadas en los ficheros XUL a las mismas cadenas. El diálogo de preferencias, cuyo fichero XUL es <code>options.xul</code>, tiene un fichero <code>options.dtd</code> correspondiente con este aspecto:</p>
-
-<pre class="eval"> &lt;!ENTITY options_window_title "StockWatcher 2 Preferences"&gt;
- &lt;!ENTITY options_symbol.label "Stock to watch: "&gt;
-</pre>
-
-<p>La entidad "options_window_title" está mapeada a la cadena "StockWatcher 2 Preferences", la cual es usada como título de la ventana de preferencias.</p>
-
-<p>El fichero <code>stockwatcher2.dtd</code> contiene el mapa para el fichero <code>stockwatcher2.xul</code>:</p>
-
-<pre class="eval"> &lt;!ENTITY panel_loading "Loading..."&gt;
- &lt;!ENTITY menu_refresh_now.label "Refresh Now"&gt;
- &lt;!ENTITY menu_apple.label "Apple (AAPL)"&gt;
- &lt;!ENTITY menu_google.label "Google (GOOG)"&gt;
- &lt;!ENTITY menu_microsoft.label "Microsoft (MSFT)"&gt;
- &lt;!ENTITY menu_yahoo.label "Yahoo (YHOO)"&gt;
-</pre>
-
-<h3 id="Actualizar_los_ficheros_XUL" name="Actualizar_los_ficheros_XUL">Actualizar los ficheros XUL</h3>
-
-<p>Cada fichero XUL necesita referenciar su correspondiente fichero de configuración regional. Además necesitamos actualizar el código para utilizar entidades en lugar de cadenas, por lo que las sustituciones tomarán lugar basándose en la configuración regional actualmente activa.</p>
-
-<p>Para añadir una referencia al fichero de configuración regional correcto dado un fichero XUL necesitamos añadir una línea al fichero XUL. Para <code>options.xul</code> añadimos esta línea:</p>
-
-<pre class="eval"> &lt;!DOCTYPE window SYSTEM "<a class="external" rel="freelink">chrome://stockwatcher2/locale/options.dtd</a>"&gt;
-</pre>
-
-<p>Añadimos una línea similar al fichero <code>stockwatcher.xul</code>:</p>
-
-<pre class="eval"> &lt;!DOCTYPE overlay SYSTEM "<a class="external" rel="freelink">chrome://stockwatcher2/locale/stockwatcher2.dtd</a>"&gt;
-</pre>
-
-<p>En aplicaciones mayores podrías necesitar utilizar entidades de diversos ficheros de configuración regional en un único fichero XUL. <a href="/es/Utilizar_m%C3%BAltiples_DTDs" title="es/Utilizar_múltiples_DTDs">Utilizar múltiples DTDs</a> explica cómo hacer esto.</p>
-
-<p>Date cuenta de que las URLs de los ficheros DTD no incluyen realmente el nombre del idioma a utilizar. el registro chrome resuelve los URIs basándose en la configuración regional actual y los datos que proporcionas en tu <a href="#actualizar_el_manifiesto_chrome">manifiesto chrome</a>.</p>
-
-<p>Luego simplemente reemplazaremos cada cadena de texto en nuestros ficheros XUL con la correspondiente entidad. Por ejemplo, en <code>stockwatcher2.xul</code> cambiamos la línea:</p>
-
-<pre class="eval"> &lt;menuitem label="Refresh Now" oncommand="StockWatcher.refreshInformation()"/&gt;
-</pre>
-
-<p>por</p>
-
-<pre class="eval"> &lt;menuitem label="&amp;menu_refresh_now.label;" oncommand="StockWatcher.refreshInformation()"/&gt;
-</pre>
-
-<p>Haremos esto para cada cadena utilizada en cada fichero XUL.</p>
-
-<h2 id="Actualizar_el_manifiesto_chrome" name="Actualizar_el_manifiesto_chrome">Actualizar el manifiesto chrome</h2>
-
-<p>Para que Firefox conozca los ficheros de configuración regional necesitamos revisar nuestro fichero <code><a href="/es/Registro_chrome" title="es/Registro_chrome">|chrome.manifest</a></code>, añadiendo una línea por cada idioma.</p>
-
-<pre class="eval"> locale stockwatcher2 en-US chrome/locale/en-US/
-</pre>
-
-<p>Esto le dice a Firefox que el idioma en-US está ubicado en el directorio <code>chrome/locale/en-US</code>.</p>
-
-<h2 id="Traducir_cadenas_en_el_c.C3.B3digo_JavaScript" name="Traducir_cadenas_en_el_c.C3.B3digo_JavaScript">Traducir cadenas en el código JavaScript</h2>
-
-<p>Si tu código JavaScript contiene cadenas literales que necesitan ser traducidas, como hace nuestro ejemplo visualizador de stocks, también necesitaremos hacerlo traducible. Podemos hacer esto moviendo las cadenas a un conjunto. Los conjuntos de cadenas son creados mediante el establecimiento de un fichero de propiedades que mapea claves a valores de cadena. Para una explicación detallada de cómo funciona esto, lee <a href="/es/Tutorial_XUL/Ficheros_de_propiedades" title="es/Tutorial_XUL/Ficheros_de_propiedades">Tutorial XUL:Ficheros de propiedades</a>.</p>
-
-<h3 id="Crear_un_fichero_de_propiedades" name="Crear_un_fichero_de_propiedades">Crear un fichero de propiedades</h3>
-
-<p>Lo primero que hacemos es crear un fichero de propiedades para los literales usados por el código JavaScript en <code>stockwatcher2.js</code>:</p>
-
-<pre class="eval">changeString=Chg:
-openString=Open:
-lowString=Low:
-highString=High:
-volumeString=Vol:
-</pre>
-
-<p>El fichero <code>stockwatcher2.properties</code> mostrado anteriormente mapea cinco claves (<code>changeString</code>, <code>openString</code>, <code>lowString</code>, <code>highString</code>, y <code>volumeString</code>) a su correspondiente texto en inglés.</p>
-
-<h3 id="Crear_un_conjunto_de_cadenas" name="Crear_un_conjunto_de_cadenas">Crear un conjunto de cadenas</h3>
-
-<p>El siguiente paso es modificar el fichero <code>stockwatcher2.xul</code> para referenciar este fichero de propiedades. Haremos esto creando un conjunto de cadenas utilizando el siguiente código:</p>
-
-<pre class="eval"> &lt;stringbundleset id="stringbundleset"&gt;
-   &lt;stringbundle id="string-bundle" src="<a class="external" rel="freelink">chrome://stockwatcher2/locale/stockw...er2.properties</a>"/&gt;
- &lt;/stringbundleset&gt;
-</pre>
-
-<p>Esto establece un nuevo conjunto de cadenas, referenciados por el ID "string-bundle", cuyas claves y valores han de ser cargados desde el fichero <code>stockwatcher2.properties</code> que ya habíamos creado.</p>
-
-<h3 id="Actualizando_el_c.C3.B3digo_JavaScript" name="Actualizando_el_c.C3.B3digo_JavaScript">Actualizando el código JavaScript</h3>
-
-<p>Ahora estamos listos para revisar el código JavaScript para cargar las cadenas desde el conjunto de cadenas en lugar de utilizar literales. Esto implica la reescritura de la función <code>refreshInformation()</code> para cargar las cadenas y su función interna <code>infoReceived()</code> para utilizar las cadenas cargadas y traducidas en lugar de literales.</p>
-
-<p>Añadimos a <code>refreshInformation()</code> el siguiente código:</p>
-
-<pre class="eval"> var stringsBundle = document.getElementById("string-bundle");
- var changeString = stringsBundle.getString('changeString') + " ";
- var openString = stringsBundle.getString('openString') + " ";
- var lowString = stringsBundle.getString('lowString') + " ";
- var highString = stringsBundle.getString('highString') + " ";
- var volumeString = stringsBundle.getString('volumeString') + " ";
-</pre>
-
-<p>Este código obtiene una referencia al elemento conjunto de cadenas que hemos añadido a <code>stockwatcher2.xul</code> llamando a <code>document.getElementById()</code>, especificando el ID "string-bundle". Luego recupera todas las cadenas que necesitamos desde el conjunto, una a una, llamando al método del conjunto de cadenas <code><a class="external" href="http://www.xulplanet.com/references/elemref/ref_stringbundle.html#prop_getString">getString()</a></code>, pasando la clave apropiada para cada cadena.</p>
-
-<p>En este caso, también añadimos un espacio al final de cada cadena. Hacemos esto porque este programa funciona así en particular y no tienes porqué hacerlo siempre.</p>
-
-<p>Luego reemplazamos toda ocurrencia de las cadenas literales con las variables apropiadas:</p>
-
-<pre class="eval"> samplePanel.tooltipText = changeString + fieldArray[4] + " | " +
-     openString + fieldArray[5] + " | " +
-     lowString + fieldArray[6] + " | " +
-     highString + fieldArray[7] + " | " +
-     volumeString + fieldArray[8];
-</pre>
-
-<h2 id="Traducir_la_descripci.C3.B3n_en_install.rdf" name="Traducir_la_descripci.C3.B3n_en_install.rdf">Traducir la descripción en install.rdf</h2>
-
-<p>Mira <a href="/es/Traducir_descripciones_de_extensiones" title="es/Traducir_descripciones_de_extensiones">Traducir descripciones de extensiones</a>.</p>
-
-<h2 id="A.C3.B1adir_m.C3.A1s_traducciones" name="A.C3.B1adir_m.C3.A1s_traducciones">Añadir más traducciones</h2>
-
-<p>Para añadir otra traducción a un nuevo idioma, todo lo que necesitas hacer es añadir otra línea al manifiesto chrome referenciando la nueva configuración regional. Por ejemplo, para añadir una traducción al español deberías añadir:</p>
-
-<pre class="eval"> locale stockwatcher2 es-ES chrome/locale/es-ES/
-</pre>
-
-<p>Luego sólo hay que crear un subdirectorio <code>chrome/locale/es-ES</code> y añadir los ficheros DTD necesarios; en este caso <code>options.dtd</code> y <code>stockwatcher2.dtd</code>. Dichos ficheros deberían mapear las mismas etiquetas para la traducción al español de las cadenas utilizadas por la extensión.</p>
-
-<p>Del mismo modo, si tenemos algún fichero de propiedades que contenga cadenas traducidas para nuestro código JavaScript también necesitaremos crear versiones de configuración regional para aquellos ficheros de propiedades en el directorio <code>chrome/locale/es-ES</code>. Sólo las cadenas deberían ser traducidas; las claves deberían ser las mismas para cada traducción.</p>
-
-<p>{{PreviousNext("Añadir preferencias a una extensión", "Actualizar una extensión para que soporte múltiples aplicaciones de Mozilla")}}</p>
diff --git a/files/es/trazado_de_una_tabla_html_mediante_javascript_y_la_interface_dom/index.html b/files/es/trazado_de_una_tabla_html_mediante_javascript_y_la_interface_dom/index.html
deleted file mode 100644
index b8bc2e4cf9..0000000000
--- a/files/es/trazado_de_una_tabla_html_mediante_javascript_y_la_interface_dom/index.html
+++ /dev/null
@@ -1,337 +0,0 @@
----
-title: Trazado de una tabla HTML mediante JavaScript y la Interface DOM
-slug: Trazado_de_una_tabla_HTML_mediante_JavaScript_y_la_Interface_DOM
-translation_of: >-
-  Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
----
-<h2 id="Introduction" name="Introduction">Introducción</h2>
-
-<p>Este artículo es un resumen de algunos métodos DOM nivel 1 poderosos y fundamentales así como una descripción de cómo utilizarlos utilizando Javascript.  Aprenderás a crear, accesar, controlar, y remover elementos HTML dinámicamente.  Los métodos DOM presentados aquí no son específicos de HTML; también aplican para XML. Las demostraciones aquí proporcionadas funcionarán en cualquier navegador moderno, incluyendo todas las versiones de Firefox e IE 5+.</p>
-
-<div class="note">Los métodos DOM presentados aquí forman parte del Modelo de Documento basado en Objetos (DOM: Document Object Model por sus siglas en inglés) de especificación nivel 1.  DOM nivel 1 incluye métodos tanto para acceso genérico del documento (DOM 1 Core) así como métodos específicos para documentos HTML (DOM 1 HTML).</div>
-
-<h2 id="Overview_of_Sample1.html" name="Overview_of_Sample1.html">Ejemplo: Crear una tabla HTML dinámicamente (<code>Ejemplo1.html</code>)</h2>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush: html">&lt;input type="button" value="Genera una tabla" onclick="genera_tabla()"&gt;
-</pre>
-
-<h3 id="JavaScript_Content">JavaScript Content</h3>
-
-<pre class="brush: js">function genera_tabla() {
-  // Obtener la referencia del elemento body
-  var body = document.getElementsByTagName("body")[0];
-
-  // Crea un elemento &lt;table&gt; y un elemento &lt;tbody&gt;
-  var tabla   = document.createElement("table");
-  var tblBody = document.createElement("tbody");
-
-  // Crea las celdas
-  for (var i = 0; i &lt; 2; i++) {
-    // Crea las hileras de la tabla
-    var hilera = document.createElement("tr");
-
-    for (var j = 0; j &lt; 2; j++) {
-      // Crea un elemento &lt;td&gt; y un nodo de texto, haz que el nodo de
-      // texto sea el contenido de &lt;td&gt;, ubica el elemento &lt;td&gt; al final
-      // de la hilera de la tabla
-      var celda = document.createElement("td");
-      var textoCelda = document.createTextNode("celda en la hilera "+i+", columna "+j);
-      celda.appendChild(textoCelda);
-      hilera.appendChild(celda);
-    }
-
-    // agrega la hilera al final de la tabla (al final del elemento tblbody)
-    tblBody.appendChild(hilera);
-  }
-
-  // posiciona el &lt;tbody&gt; debajo del elemento &lt;table&gt;
-  tabla.appendChild(tblBody);
-  // appends &lt;table&gt; into &lt;body&gt;
-  body.appendChild(tabla);
-  // modifica el atributo "border" de la tabla y lo fija a "2";
-  tabla.setAttribute("border", "2");
-}</pre>
-
-<p>{{ EmbedLiveSample('Overview_of_Sample1.html') }}</p>
-
-<p>Observa cuidadosamente el orden en el que se crearon los elementos en el nodo de texto:</p>
-
-<ol>
- <li>Primero se crea el elemento &lt;table&gt;.</li>
- <li>Posteriormente, creamos el elemento &lt;tbody&gt; , que es el hijo del elemento &lt;table&gt; .</li>
- <li>Después, utilizamos ciclos para crear los elementos &lt;tr&gt;, que son hijos del elemento &lt;tbody&gt;.</li>
- <li>Para cada elemento &lt;tr&gt;, utilizamos nuevamente ciclos para generar los elementos &lt;td&gt; que son hijos de los elementos &lt;tr&gt;.</li>
- <li>Para cada elemento &lt;td&gt;, creamos nodos de texto con el contenido de cada celda.</li>
-</ol>
-
-<p>Una vez creados los elementos &lt;table&gt;, &lt;tbody&gt;, &lt;tr&gt;, y &lt;td&gt; así como los nodos de texto, adicionamos a cada hijo bajo su padre en el órden opuesto:</p>
-
-<ol>
- <li>Primero, anexamos cada nodo de texto a su elemento padre &lt;td&gt; :
-  <pre>celda.appendChild(textoCelda);</pre>
- </li>
- <li>Posteriormente, anexamos cada elemento &lt;td&gt; a su elemento padre &lt;tr&gt; :
-  <pre>hilera.appendChild(celda);</pre>
- </li>
- <li>Posteriomente, anexamos cada elemento &lt;tr&gt; a su elemento padre &lt;tbody&gt;:
-  <pre>tblBody.appendChild(hilera);</pre>
- </li>
- <li>Después, anexamos el elemento &lt;tbody&gt; a su elemento padre &lt;table&gt;:
-  <pre>tabla.appendChild(tblBody);</pre>
- </li>
- <li>Finalmente, anexamos el elemento &lt;table&gt; a su elemento padre &lt;body&gt;:
-  <pre>body.appendChild(tabla);</pre>
- </li>
-</ol>
-
-<p>Recuérda esta técnica. Te será muy útil en la programación bajo el estándar W3C DOM. Primero, creas los elementos de arriba a abajo; posteriormente adicionas los hijos a los padres de abajo a arriba.</p>
-
-<p>A continuación aparece el código HTML generado por el código JavaScript:</p>
-
-<pre>...
-&lt;table border="2"&gt;
-    &lt;tbody&gt;
-        &lt;tr&gt;&lt;td&gt;celda en la hilera 0, columna 0&lt;/td&gt;&lt;td&gt;celda en la hilera 0, columna 1&lt;/td&gt;&lt;/tr&gt;
-        &lt;tr&gt;&lt;td&gt;celda en la hilera 1, columna 0&lt;/td&gt;&lt;td&gt;celda en la hilera 1, columna 1&lt;/td&gt;&lt;/tr&gt;
-    &lt;/tbody&gt;
-&lt;/table&gt;
-...
-</pre>
-
-<p>Aquí está el árbol de objetos DOM generado por el código del elemento &lt;TABLE&gt; :</p>
-
-<p><img alt="Image:sample1-tabledom.jpg" src="/@api/deki/files/833/=Sample1-tabledom.jpg"></p>
-
-<p>Tú puedes construir esta tabla y sus elementos internos utilizando sólo algunos de los varios métodos del DOM. Recuerda tener en mente el modelo de la estructura que planeas crear; esto hará mucho más fácil la escritura del código necesario.</p>
-
-<p>En el árbol del elemento &lt;table&gt; de la Figura 1, el elemento &lt;table&gt; tiene solamente un hijo mientras que &lt;tbody&gt; tiene dos.  A su vez, cada hijo de &lt;tbody&gt; tiene dos hijos. Finalmente, cada elemento &lt;td&gt; tiene sólo uno, el nodo de texto.</p>
-
-<h2 id="Setting_background_of_a_paragraph" name="Setting_background_of_a_paragraph">Ejemplo: Configuración del color de fondo de un párrafo</h2>
-
-<p><code>getElementsByTagName(tagNameValue)</code> es un método disponible en cualquier elemento DOM o el elemento raíz del documento. Cuando se le llama, devolverá una matriz con todos los descendientes de elementos que coincidan con el nombre de la etiqueta. El primer elemento de la lista se encuentra en la posición [0] de la matriz.</p>
-
-<h3 id="HTML_Content">HTML Content</h3>
-
-<pre class="brush: html">&lt;body&gt;
-  &lt;input type="button" value="Set paragraph background color" onclick="set_background()"&gt;
-  &lt;p&gt;hi&lt;/p&gt;
-  &lt;p&gt;hello&lt;/p&gt;
-&lt;/body&gt;</pre>
-
-<h3 id="JavaScript_Content_2">JavaScript Content</h3>
-
-<pre class="brush: js">function set_background() {
-  // get a list of all the body elements (there will only be one),
-  // and then select the zeroth (or first) such element
-  myBody = document.getElementsByTagName("body")[0];
-
-  // now, get all the p elements that are descendants of the body
-  myBodyElements = myBody.getElementsByTagName("p");
-
-  // get the second item of the list of p elements
-  myP = myBodyElements[1];
-  myP.style.background = "rgb(255,0,0)";
-}</pre>
-
-<p>{{ EmbedLiveSample('Setting_background_of_a_paragraph') }}</p>
-
-<p>En este ejemplo, establecemos la variable <code>myP</code> en el objeto DOM para el segundo elemento<code>p</code> dentro del body:</p>
-
-<ol>
- <li>Primero, obtendremos una lista de todos los elementos body mediante
-  <pre>myBody = document.getElementsByTagName("body")[0]</pre>
-  Como en cualquier documento HTML sólo hay un elemento body válido, esta lista tendrá sólo un elemento, que recuperamos seleccionando el primer elemento de esa lista usando <code>{{mediawiki.external(0)}}</code>.</li>
- <li>Luego, obtenemos todos los elementos p que son descendientes del body mediante
-  <pre>myBodyElements = myBody.getElementsByTagName("p");</pre>
- </li>
- <li>Finalmente, obtenemos el segundo item de la lista de elementos p mediante
-  <pre>myP = myBodyElements[1];</pre>
- </li>
-</ol>
-
-<p><img alt="Image:sample2a2.jpg" src="/@api/deki/files/834/=Sample2a2.jpg"></p>
-
-<p>Una vez que haya obtenido el objeto DOM para un elemento HTML, puede establecer sus propiedades. Por ejemplo, si desea establecer la propiedad estilo de color de fondo, agregue:</p>
-
-<pre>myP.style.background = "rgb(255,0,0)";
-// setting inline STYLE attribute
-</pre>
-
-<h3 id="Creating_TextNodes_with_document.createTextNode.28.22...22.29" name="Creating_TextNodes_with_document.createTextNode.28.22...22.29">Creating TextNodes with <code>document.createTextNode("..")</code></h3>
-
-<p>Use the document object to invoke the createTextNode method and create your text node. You just need to pass the text content. The return value is an object that represents the text node.</p>
-
-<pre>myTextNode = document.createTextNode("world");
-</pre>
-
-<p>This means that you have created a node of the type TEXT_NODE (a piece of text) whose text data is "world", and myTextNode is your reference to this node object. To insert this text into your HTML page, you need to make this text node a child of some other node element.</p>
-
-<h3 id="Inserting_Elements_with_appendChild.28...29" name="Inserting_Elements_with_appendChild.28...29">Inserting Elements with appendChild(..)</h3>
-
-<p>So, by calling myP.appendChild({{mediawiki.external('node_element')}}), you are making the element a new child of the second &lt;p&gt; element.</p>
-
-<pre>myP.appendChild(myTextNode);
-</pre>
-
-<p>After testing this sample, note that the words hello and world are together: helloworld. So visually, when you see the HTML page it seems like the two text nodes hello and world are a single node, but remember that in the document model, there are two nodes. The second node is a new node of type TEXT_NODE, and it is the second child of the second &lt;p&gt; tag. The following figure shows the recently created Text Node object inside the document tree.</p>
-
-<p><img alt="Image:sample2b2.jpg" src="/@api/deki/files/835/=Sample2b2.jpg"></p>
-
-<div class="note">createTextNode and appendChild is a simple way to include white space between the words hello and world. Another important note is that the appendChild method will append the child after the last child, just like the word world has been added after the word hello. So if you want to append a Text Node between hello and world you will need to use insertBefore instead of appendChild.</div>
-
-<h3 id="Creating_New_Elements_with_the_document_object_and_the_createElement.28...29_method" name="Creating_New_Elements_with_the_document_object_and_the_createElement.28...29_method">Creating New Elements with the document object and the <code>createElement(..)</code> method</h3>
-
-<p>You can create new HTML elements or any other element you want with createElement. For example, if you want to create a new &lt;p&gt; element as a child of the &lt;body&gt; element, you can use the myBody in the previous example and append a new element node. To create a node simply call <code>document.createElement("tagname")</code>. For example:</p>
-
-<pre>myNewPTAGnode = document.createElement("p");
-myBody.appendChild(myNewPTAGnode);
-</pre>
-
-<p><img alt="Image:sample2c.jpg" src="/@api/deki/files/836/=Sample2c.jpg"></p>
-
-<h3 id="Removing_nodes_with_the_removeChild.28...29_method" name="Removing_nodes_with_the_removeChild.28...29_method">Removing nodes with the <code>removeChild(..)</code> method</h3>
-
-<p>Nodes can be removed. The following code removes text node <code>myTextNode</code> (containing the word "world") from the second <code>&lt;p&gt;</code> element, <code>myP</code>.</p>
-
-<pre>myP.removeChild(myTextNode);
-</pre>
-
-<p>Text node <code>myTextNode</code> (containing the word "world") still exists. The following code attaches <code>myTextNode</code> to the recently created <code>&lt;p&gt;</code> element, <code>myNewPTAGnode</code>.</p>
-
-<pre>myNewPTAGnode.appendChild(myTextNode);
-</pre>
-
-<p>The final state for the modified object tree looks like this:</p>
-
-<p><img alt="Image:sample2d.jpg" src="/@api/deki/files/837/=Sample2d.jpg"></p>
-
-<h2 id="Creating_a_table_dynamically_.28back_to_Sample1.html.29" name="Creating_a_table_dynamically_.28back_to_Sample1.html.29">Creating a table dynamically (back to Sample1.html)</h2>
-
-<p>For the rest of this article we will continue working with sample1.html. The following figure shows the table object tree structure for the table created in the sample.</p>
-
-<h3 id="Reviewing_the_HTML_Table_structure" name="Reviewing_the_HTML_Table_structure">Reviewing the HTML Table structure</h3>
-
-<p><img alt="Image:sample1-tabledom.jpg" src="/@api/deki/files/833/=Sample1-tabledom.jpg"></p>
-
-<h3 id="Creating_element_nodes_and_inserting_them_into_the_document_tree" name="Creating_element_nodes_and_inserting_them_into_the_document_tree">Creating element nodes and inserting them into the document tree</h3>
-
-<p>The basic steps to create the table in sample1.html are:</p>
-
-<ul>
- <li>Get the body object (first item of the document object).</li>
- <li>Create all the elements.</li>
- <li>Finally, append each child according to the table structure (as in the above figure). The following source code is a commented version for the sample1.html.</li>
-</ul>
-
-<div class="note">At the end of the start function there is a new line of code. The table's border property was set using another DOM method, <code>setAttribute</code>. setAttribute has two arguments: the attribute name and the attribute value. You can set any attribute of any element using the setAttribute method.</div>
-
-<pre class="brush:html">&lt;head&gt;
-&lt;title&gt;Sample code - Traversing an HTML Table with JavaScript and DOM Interfaces&lt;/title&gt;
-&lt;script&gt;
-    function start() {
-        // get the reference for the body
-        var mybody = document.getElementsByTagName("body")[0];
-
-        // creates &lt;table&gt; and &lt;tbody&gt; elements
-        mytable     = document.createElement("table");
-        mytablebody = document.createElement("tbody");
-
-        // creating all cells
-        for(var j = 0; j &lt; 2; j++) {
-            // creates a &lt;tr&gt; element
-            mycurrent_row = document.createElement("tr");
-
-            for(var i = 0; i &lt; 2; i++) {
-                // creates a &lt;td&gt; element
-                mycurrent_cell = document.createElement("td");
-                // creates a Text Node
-                currenttext = document.createTextNode("cell is row " + j + ", column " + i);
-                // appends the Text Node we created into the cell &lt;td&gt;
-                mycurrent_cell.appendChild(currenttext);
-                // appends the cell &lt;td&gt; into the row &lt;tr&gt;
-                mycurrent_row.appendChild(mycurrent_cell);
-            }
-            // appends the row &lt;tr&gt; into &lt;tbody&gt;
-            mytablebody.appendChild(mycurrent_row);
-        }
-
-        // appends &lt;tbody&gt; into &lt;table&gt;
-        mytable.appendChild(mytablebody);
-        // appends &lt;table&gt; into &lt;body&gt;
-        mybody.appendChild(mytable);
-        // sets the border attribute of mytable to 2;
-        mytable.setAttribute("border","2");
-    }
-&lt;/script&gt;
-&lt;/head&gt;
-&lt;body onload="start()"&gt;
-&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<h2 id="Manipulating_the_table_with_DOM_and_CSS" name="Manipulating_the_table_with_DOM_and_CSS">Manipulating the table with DOM and CSS</h2>
-
-<h3 id="Getting_a_text_node_from_the_table" name="Getting_a_text_node_from_the_table">Getting a text node from the table</h3>
-
-<p>This example introduces two new DOM attributes. First it uses the <code>childNodes</code> attribute to get the list of child nodes of mycel. The <code>childNodes</code> list includes all child nodes, regardless of what their name or type is. Like getElementsByTagName(), it returns a list of nodes. The differences are that (a) getElementsByTagName() only returns elements of the specified tag name; and (b) getElementsByTagName() returns descendants at any level, not just immediate children. Once you have the returned list, use <code>{{mediawiki.external('x')}}</code> method to retrieve the desired child item. This example stores in myceltext the text node of the second cell in the second row of the table. Then, to display the results in this example, it creates a new text node whose content is the data of myceltext and appends it as a child of the &lt;body&gt; element.</p>
-
-<div class="note">If your object is a text node, you can use the data attribute and retrieve the text content of the node.</div>
-
-<pre class="brush:js">mybody      = document.getElementsByTagName("body")[0];
-mytable     = mybody.getElementsByTagName("table")[0];
-mytablebody = mytable.getElementsByTagName("tbody")[0];
-myrow       = mytablebody.getElementsByTagName("tr")[1];
-mycel       = myrow.getElementsByTagName("td")[1];
-
-// first item element of the childNodes list of mycel
-myceltext=mycel.childNodes[0];
-
-// content of currenttext is the data content of myceltext
-currenttext=document.createTextNode(myceltext.data);
-mybody.appendChild(currenttext);
-</pre>
-
-<h3 id="Getting_an_attribute_value" name="Getting_an_attribute_value">Getting an attribute value</h3>
-
-<p>At the end of sample1 there is a call to setAttribute on the mytable object. This call was used to set the border property of the table. To retrieve the value of the attribute, use the getAttribute method:</p>
-
-<pre>mytable.getAttribute("border");
-</pre>
-
-<h3 id="Hiding_a_column_by_changing_style_properties" name="Hiding_a_column_by_changing_style_properties">Hiding a column by changing style properties</h3>
-
-<p>Once you have the object in your JavaScript variable, you can set style properties directly. The following code is a modified version of sample1.html in which each cell of the second column is hidden and each cell of the first column is changed to have a red background. Note that the style property was set directly.</p>
-
-<pre class="brush:html">&lt;html&gt;
-&lt;body onload="start()"&gt;
-&lt;/body&gt;
-&lt;script&gt;
-    function start() {
-       var mybody =document.getElementsByTagName("body")[0];
-       mytable     = document.createElement("table");
-       mytablebody = document.createElement("tbody");
-
-       for(var j = 0; j &lt; 2; j++) {
-           mycurrent_row=document.createElement("tr");
-           for(var i = 0; i &lt; 2; i++) {
-               mycurrent_cell = document.createElement("td");
-               currenttext = document.createTextNode("cell is:" + i + j);
-               mycurrent_cell.appendChild(currenttext);
-               mycurrent_row.appendChild(mycurrent_cell);
-               // set the cell background color
-               // if the column is 0. If the column is 1 hide the cel
-               if (i == 0) {
-                   mycurrent_cell.style.background = "rgb(255,0,0)";
-               } else {
-                   mycurrent_cell.style.display = "none";
-               }
-           }
-           mytablebody.appendChild(mycurrent_row);
-       }
-       mytable.appendChild(mytablebody);
-       mybody.appendChild(mytable);
-    }
-&lt;/script&gt;
-&lt;/html&gt;
-</pre>
diff --git a/files/es/usando_archivos_desde_aplicaciones_web/index.html b/files/es/usando_archivos_desde_aplicaciones_web/index.html
deleted file mode 100644
index a3f0c8546e..0000000000
--- a/files/es/usando_archivos_desde_aplicaciones_web/index.html
+++ /dev/null
@@ -1,377 +0,0 @@
----
-title: Usando archivos desde aplicaciones web
-slug: Usando_archivos_desde_aplicaciones_web
-tags:
-  - Archivos
-  - HTML5
-  - para_revisar
-  - páginas_a_traducir
----
-<p>{{ gecko_minversion_header("1.9.2") }}</p>
-
-<p> </p>
-
-<p>Al usar la API de Archivos agregada al DOM en HTML5, ahora es posible que el contenido de una página web solicite al usuario que elija un archivo local para luego leer el contenido de esos archivos. Esta selección puede hacerse tanto usando un elemento <code class="western"><a href="/en/DOM/HTMLInputElement" title="en/DOM/HTMLInputElement">input</a></code> de HTML o arrastrando y soltando el archivo.</p>
-
-<h2 id="Seleccionar_archivos_usando_HTML"> Seleccionar archivos usando HTML</h2>
-
-<p> Seleccionar un solo archivo para usar con la API de archivo es simple:</p>
-
-<pre><code>&lt;input type="file" id="input" onchange="handleFiles(this.files)"&gt;</code>
-</pre>
-
-<p>Cuando el usuario selecciona un archivo, se  llama a la función <code>handleFiles()</code>  con un objeto <a href="/en/DOM/FileList" title="en/DOM/FileList"><code>FileList</code></a> que contiene el objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File </code></a>representando el archivo seleccionado por el usuario.</p>
-
-<p>Si desea permitir al usuario seleccionar varios archivos, simplemente use el atributo <code>multiple</code> en el elemento <code>input</code>:</p>
-
-<pre><code>&lt;input type="file" id="input" multiple="true" onchange="handleFiles(this.files)"&gt;</code>
-</pre>
-
-<p>En este caso, la lista de archivos se pasa a la función <code>handleFiles()contiene </code><code>un objeto</code> <a href="/en/DOM/File" title="en/DOM/File"> <code>File</code></a> por cada archivo que el usuario ha seleccionado.</p>
-
-<p>{{ h2_gecko_minversion("Uso de elementos ocultos del archivo de entrada usando el método click() ", "2.0") }}</p>
-
-<p>Desde la versión 2.0 de Gecko {{ geckoRelease("2.0") }}, puedes esconder el elemento file {{ HTMLElement("input") }} y mostrar una interfaz propia para abrir el examinador de archivos y para mostrar que archivo o archivos ha seleccionado el usuario. Puedes hacerlo agregándole al estilo del elemento input la instrucción "display:none" y usando el método <code>click()</code> en el elemento {{ HTMLElement("input") }}.</p>
-
-<p>Considere este código HTML:</p>
-
-<pre class="deki-transform">&lt;input type="file" id="fileElem" multiple accept="image/*" style="display:none" onchange="handleFiles(this.files)"&gt;
-&lt;a href="#" id="fileSelect"&gt;Select some files&lt;/a&gt;
-</pre>
-
-<p>Tu método <code>doClick()</code> puede verse como esto:</p>
-
-<pre class="deki-transform">var fileSelect = document.getElementById("fileSelect"),
-  fileElem = document.getElementById("fileElem");
-
-fileSelect.addEventListener("click", function (e) {
-  if (fileElem) {
-    fileElem.click();
-  }
-  e.preventDefault(); // prevent navigation to "#"
-}, false);
-</pre>
-
-<p>Obiamente puedes darle estilo al nuevo botón para abrir el selector de archivos como desees.</p>
-
-<h3 id="Dinámica_de_la_adición_de_un_detector_de_cambio">Dinámica de la adición de un detector de cambio</h3>
-
-<p> Si tu campo de entrada fue creado con una librería de JavaScript como <a class="external" href="http://www.jquery.com/">jQuery</a>, necesitarás usar {{ domxref("element.addEventListener()") }} para agregar un manejador de eventos de cambio, como este:</p>
-
-<pre class="deki-transform">var inputElement = document.getElementById("inputField");
-inputElement.addEventListener("change", handleFiles, false);
-
-function handleFiles() {
-  var fileList = this.files;
-
-  /* now you can work with the file list */
-}
-</pre>
-
-<p> Nota que en este caso, la función <code class="western">handleFiles()</code> busca la lista de archivos en lugar de aceptar un parámetro, ya que los detectores de eventos añadidos de esta manera no pueden aceptar un parámetro de entrada.</p>
-
-<p> </p>
-
-<p>{{ h1_gecko_minversion("Usando Objetos URL", "2.0") }}</p>
-
-<p>Gecko 2.0 {{ geckoRelease("2.0") }} introduce asistencia para el DOM {{ domxref("window.URL.createObjectURL()") }} y los métodos {{ domxref("window.URL.revokeObjectURL()") }} Esto te permite crear URLs simples para ser usadas como referencia a cualquier dato que pueda ser referenciado usando un objeto DOM <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a>, incluyendo archivos locales en el computador del usuario.</p>
-
-<p>Cuando tienes un objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> te gustaría hacer referencia por URL desde HTML, puedes crear un objeto URL para que quede así :</p>
-
-<pre>var objectURL = window.URL.createObjectURL(fileObj);
-</pre>
-
-<p>El objeto URL es una cadena de caracteres que identifica el objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> . Cada vez que invocas {{ domxref("window.URL.createObjectURL()") }}, un único objeto URL es creado, <span class="long_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener traducciones alternativas">incluso, si usted</span> ya <span class="hps" title="Haz clic para obtener traducciones alternativas">ha</span> <span class="hps" title="Haz clic para obtener traducciones alternativas">creado</span> <span class="hps" title="Haz clic para obtener traducciones alternativas">un</span><span class="hps" title="Haz clic para obtener traducciones alternativas"> objeto URL de</span> <span class="hps" title="Haz clic para obtener traducciones alternativas">ese archivo</span></span>. Cada uno de estos debe ser liberado. Mientras se liberan automáticamente cuando se libera la memoria utilizada por el documento, sí tu página los usa dinámicamente, podrías liberarlos explicitamente invocando {{ domxref("window.URL.revokeObjectURL()") }}:</p>
-
-<pre>window.URL.revokeObjectURL(objectURL);
-</pre>
-
-<h2 id="Selección_de_archivos_usando_arrastrar_y_soltar">Selección de archivos usando arrastrar y soltar</h2>
-
-<p> <span lang="es-ES">También puedes dejar que el usuario arrastre y suelte los archivos en la aplicación Web.</span></p>
-
-<p>El primer paso es establecer una zona para soltar. Exactamente que parte de tu contenido aceptara soltar puede variar dependiendo de el diseño de tu aplicación, pero hacer un elemento que reciba eventos de soltar es fácil:</p>
-
-<pre class="deki-transform">var dropbox;
-
-dropbox = document.getElementById("dropbox");
-dropbox.addEventListener("dragenter", dragenter, false);
-dropbox.addEventListener("dragover", dragover, false);
-dropbox.addEventListener("drop", drop, false);
-</pre>
-
-<p> En este ejemplo, estamos girando el elemento con el ID "dropbox" en nuestra zona para soltar. Esto se hace mediante la adicción de manejadores que escuchen los eventos <code class="western">dragenter</code>, <code class="western">dragover</code>, y <code class="western">drop</code>.</p>
-
-<p>En realidad no necesitamos hacer nada con los eventos <code class="western">dragenter</code> and <code class="western">dragover</code> en nuestro caso, por lo que estas funciones son a la vez simples. Acabar de detener la propagación del evento y evitar que la acción predeterminada ocurra:</p>
-
-<pre class="deki-transform">function dragenter(e) {
-  e.stopPropagation();
-  e.preventDefault();
-}
-
-function dragover(e) {
-  e.stopPropagation();
-  e.preventDefault();
-}
-</pre>
-
-<p>La verdadera magia pasa en la función <code class="western">drop()</code>:</p>
-
-<pre class="deki-transform">function drop(e) {
-  e.stopPropagation();
-  e.preventDefault();
-
-  var dt = e.dataTransfer;
-  var files = dt.files;
-
-  handleFiles(files);
-}
-</pre>
-
-<p>Aquí, recuperamos  el campo <code>dataTransfer</code> del evento, a continuación tomamos la lista de archivos fuera de él, que pasa para <code>handleFiles()</code>. Desde este punto, el manejo de los archivos es el mismo si el usuario utiliza el elemento de entrada o arrastrar y soltar. Obteniendo información de los archivos seleccionados.</p>
-
-<p>El objeto  <a href="/en/DOM/FileList" title="en/DOM/FileList"><code>FileList</code></a> proporcionado por el DOM de las listas de todos los archivos seleccionados por el usuario, cada una se especifica como un objeto<a href="/en/DOM/File" title="en/DOM/File"><code> File</code></a>. Tu puedes determinar cuantos archivos el usuario selecciona, al verificar el valor del atributo <code>length</code>:</p>
-
-<pre>var numFiles = files.length;
-</pre>
-
-<p>Individualmente los objetos <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> pueden ser recuperados simplemente accediendo a la lista como una matriz:</p>
-
-<pre class="deki-transform">for (var i = 0; i &lt; files.length; i++) {
-  var file = files[i];
-  ..
-}
-</pre>
-
-<p> Este bucle se repite en todos los archivos de la lista de archivos.</p>
-
-<p>Hay tres atributos proporcionados por el objeto <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> que contienen información útil sobre el archivo.</p>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>El nombre de archivo como cadena de sólo lectura. Esto es sólo el nombre de el archivo y no incluye ninguna información de la ruta.</dd>
- <dt><code>size</code></dt>
- <dd>El tamaño del  archivo en bytes como de solo lectura entero de 64 bits.</dd>
- <dt><code>type</code></dt>
- <dd>El tipo MIME de el archivo como una cadena de sólo lectura, o "" si el tipo no puede ser determinado.</dd>
-</dl>
-
-<h2 id="Ejemplo_Mostrando_miniaturas_de_las_imágenes_seleccionadas_por_el_usuario">Ejemplo: Mostrando miniaturas de las imágenes seleccionadas por el usuario</h2>
-
-<p>Digamos que estás desarrollando el próximo gran sitio web para compartir fotos,y deseas usar HTML5 para mostrar vistas previas en miniaturas de las imágenes antes de que el usuario realmente suba los archivos. Simplemente basta con establecer el elemento de entrada o de soltar como se indicó anteriormente, y llamar una función, como la función <code>handleFiles()</code> de abajo.</p>
-
-<pre class="deki-transform">function handleFiles(files) {
-  for (var i = 0; i &lt; files.length; i++) {
-    var file = files[i];
-    var imageType = /image.*/;
-
-    if (!file.type.match(imageType)) {
-      continue;
-    }
-
-    var img = document.createElement("img");
-    img.classList.add("obj");
-    img.file = file;
-    preview.appendChild(img);
-
-    var reader = new FileReader();
-    reader.onload = (function(aImg) { return function(e) { aImg.src = e.target.result; }; })(img);
-    reader.readAsDataURL(file);
-  }
-}
-</pre>
-
-<p>Aquí nuestro bucle maneja los archivos seleccionados por el usuario buscando en cada tipo de atributo del archivo para ver si es un archivo imagen (Buscando coincidencias con la cadena de expresión regular "image.*"). Por cada archivo de tipo imagen, creamos un nuevo elemento img. El CSS puede ser usado para crear bordes, sombras y/o especificar el tamaño de la imagen, por lo cual no es necesario hacerlo aquí.</p>
-
-<p>Cada imagen tiene añadida la clase CSS "obj", para que sean fáciles de encontrar en el árbol DOM. También vamos a añadir un archivo atributo a cada imagen especificando el archivo de la imagen, o que nos permitirá buscar las imágenes para en realidad subirlas mas tarde. Por último se utilizamos {{ domxref("Node.appendChild()") }} para agregar la nueva miniatura para el área de previsualización de nuestro documento.</p>
-
-<p>A continuación, se establece  <a href="/en/DOM/FileReader" title="en/DOM/FileReader"><code>FileReader</code></a> para manejar de forma asincrónica la  carga de la  imagen y lo conecta con el elemento img.Después se crea  el  nuevo objeto <code>FileReader</code>, hemos creado la función <code>load</code>, a continuación llamamos <code>readAsDataURL()</code> para empezar la operación de lectura de fondo. cuando todo el contenido del archivo de imagen se carga, se convierten en una  <code>data:</code> URL, cada uno se pasa por  <code>onload</code> callback. Nuestra implementación de esta rutina se limita a establecer el atributo src del elemento img de la imagen cargada, lo que resulta en la imagen que aparece en la miniatura en la pantalla del usuario.</p>
-
-<p>{{ h1_gecko_minversion("Ejemplo: Usar URL objeto para mostrar imágenes", "2.0") }}</p>
-
-<p>En este ejemplo se utiliza el objeto URL para mostrar miniaturas de las imágenes. Además, se muestra la información de otro archivo con su nonbre y tamaño. Tu puedes <a href="/samples/domref/file-click-demo.html" title="https://developer.mozilla.org/samples/domref/file-click-demo.html">ver el ejemplo vivo </a>(nota se requiere  <a class="external" href="http://nightly.mozilla.org/" title="http://nightly.mozilla.org/">versión nocturna (nightly build</a>) de Firefox del 22 de noviembre o posterior, o Firefox 4.0 beta 8).</p>
-
-<div class="note"><strong>Nota:</strong> Esta API existía en versiones beta de Firefox 4, pero cambio el 22 de noviembre, ¡así que asegúrate que estas en una versión actual!</div>
-
-<p>Escuchar<br>
- traducción del inglés al español<br>
- El código HTML que presenta la interfaz se parece a esto:</p>
-
-<pre class="deki-transform">&lt;input type="file" id="fileElem" multiple accept="image/*" style="display:none" onchange="handleFiles(this.files)"&gt;
-&lt;a href="#" id="fileSelect"&gt;Select some files&lt;/a&gt;
-&lt;div id="fileList"&gt;
-  &lt;p&gt;¡No se han seleccionado archivos!&lt;/p&gt;
-&lt;/div&gt;
-</pre>
-
-<p>Este establece nuestro archivo {{ HTMLElement("input") }} elemento, así como un enlace que invoca el selector de archivos , ya que mantener la entrada de archivo oculto para para evitar que lo menos atractivo de la interfaz sea mostrado. Esto se explica más arriba en la sección  {{ anch("Using hidden file input elements using the click() method") }}, como es el método <code>doClick()</code> que invoca el selector de archivos.</p>
-
-<p>El método siguiente <code>handleFiles()</code>:</p>
-
-<pre class="deki-transform">var fileSelect = document.getElementById("fileSelect"),
-  fileElem = document.getElementById("fileElem"),
-  fileList = document.getElementById("fileList");
-
-fileSelect.addEventListener("click", function (e) {
-  if (fileElem) {
-    fileElem.click();
-  }
-  e.preventDefault(); // evitar la navegación a "#"
-}, false);
-
-function handleFiles(files) {
-  if (!files.length) {
-    fileList.innerHTML = "&lt;p&gt;¡No se han seleccionado archivos!&lt;/p&gt;";
-  }
-  else {
-    var list = document.createElement("ul");
-    for (var i = 0; i &lt; files.length; i++) {
-      var li = document.createElement("li");
-      list.appendChild(li);
-
-      var img = document.createElement("img");
-      img.src = window.URL.createObjectURL(files[i]);;
-      img.height = 60;
-      img.onload = function () {
-        window.URL.revokeObjectURL(this.src);
-      }
-      li.appendChild(img);
-
-      var info = document.createElement("span");
-      info.innerHTML = files[i].name + ": " + files[i].size + " bytes";
-      li.appendChild(info);
-    }
-    fileList.appendChild(list);
-  }
-}
-</pre>
-
-<p>Esto comienza por ir a buscar el {{ HTMLElement("div") }} con el ID "fileList". Este es el bloque en el que vamos a insertar la lista de archivos, incluyendo vistas en miniaturas.</p>
-
-<p>Si el  objeto {{ domxref("FileList") }} <code>handleFiles()</code> es <code>null</code>, se establece dentro del código HTML interno del bloque para que no aparezca "¡No se han seleccionado archivos!". De lo contrario, empezamos a contruir nuestra lista de archivos, de la siguiente manera:</p>
-
-<p>Una nueva lista desordenada elemento ({{ HTMLElement("ul") }} es creada.</p>
-
-<ol>
- <li>La nueva lista de elementos se inserta en el bloque  {{ HTMLElement("div") }} llamando a este método {{ domxref("element.appendChild()") }}.</li>
- <li>Para cada {{ domxref("File") }} en el {{ domxref("FileList") }} representado por <code>files</code>:
-  <ol>
-   <li>Crear un nuevo elemento de la lista ({{ HTMLElement("li") }}) y se inserta en la lista.</li>
-   <li>Crear un nuevo elemento imagen ({{ HTMLElement("img") }}).</li>
-   <li>Ajuste de la imagen de origen a un nuevo objeto URL representando el archivo, usando {{ domxref("window.URL.createObjectURL()") }} para crear la blob URL.</li>
-   <li>Ajuste la altura de la imagen a 60 píxeles.</li>
-   <li>Establecer el manejador de el evento de carga de imagen para liberar el objeto URL, Set up the image's load event handler to release the object URL, puesto que ya no se necesita una vez que la imagen se ha cargado. esto se hace llamando a el método {{ domxref("window.URL.revokeObjectURL()") }} , pasando en el objeto URL la cadena como lo especifica <code>img.src</code>.</li>
-   <li>Anexar el nuevo elemento lista a la lista.</li>
-  </ol>
- </li>
-</ol>
-
-<h2 id="Ejemplo_Cargando_archivos_seleccionado_por_el_usuario_(user-selected_file)">Ejemplo: Cargando archivos seleccionado por el usuario (user-selected file)</h2>
-
-<p>Otra cosa que tu podrías querer hacer es permitir al usuario cargar  un archivo o archivos seleccionados (por ejemplo, las imagenes seleccionadas con el ejemplo previo) a un servidor. Esto puede hacerse asincrónicamente muy facil.</p>
-
-<h3 id="Creando_las_tareas_de_carga">Creando las tareas de carga</h3>
-
-<p>Continuando con el código que genera las imágenes en miniatura en el ejemplo anterior, recordemos que cada imagen en la clase CSS "obj", con el correspondiente <a href="/en/DOM/File" title="en/DOM/File"><code>File</code></a> adjunto en el atributo de el archivo. Esto nos permite fácilmente seleccionar todas las imagenes que el usuario ha escogido para ser cargadas con {{ domxref("Document.querySelectorAll()") }}, así:</p>
-
-<pre class="deki-transform">function sendFiles() {
-  var imgs = document.querySelectorAll(".obj");
-
-  for (var i = 0; i &lt; imgs.length; i++) {
-    new FileUpload(imgs[i], imgs[i].file);
-  }
-}
-</pre>
-
-<p>En la linea 2 se crea una matriz, llamada <code>imgs</code>, de todos los elemtos in el documento con la clase CSS "obj". en nuestro caso, estas serán todas las miniaturas de las imágenes.Una vez que obtenemos esa lista, es trivial pasar por la lista, creando una nueva instancia <code>FileUpload</code> para cada uno. Cada uno de estos manejadores de carga el archivo correspondiente.</p>
-
-<h3 id="Manejadores_de_procesos_de_carga_de_un_archivo">Manejadores de procesos de carga de un archivo</h3>
-
-<p>La función <code>FileUpload</code> acepta dos entradas: un elemento imagen y un archivo desde donde se leerán  los datos de la imagen</p>
-
-<pre class="deki-transform">function FileUpload(img, file) {
-  this.ctrl = createThrobber(img);
-  var xhr = new XMLHttpRequest();
-  this.xhr = xhr;
-
-  var self = this;
-  this.xhr.upload.addEventListener("progress", function(e) {
-        if (e.lengthComputable) {
-          var percentage = Math.round((e.loaded * 100) / e.total);
-          self.ctrl.update(percentage);
-        }
-      }, false);
-
-  xhr.upload.addEventListener("load", function(e){
-          self.ctrl.update(100);
-          var canvas = self.ctrl.ctx.canvas;
-          canvas.parentNode.removeChild(canvas);
-      }, false);
-
-  xhr.open("POST", "http://demos.hacks.mozilla.org/paul/demos/resources/webservices/devnull.php");
-  xhr.overrideMimeType('text/plain; charset=x-user-defined-binary');
-  xhr.sendAsBinary(file.getAsBinary());
-}
-</pre>
-
-<p>La función <code>FileUpload()</code> muestra arriba crear un throbber, cada uno es usado para mostrar la información de progreso, a continuación se crea un <a href="/en/XMLHttpRequest" title="en/XMLHttpRequest"><code>XMLHttpRequest</code></a> para manejar la carga de los datos.</p>
-
-<p>Antes de transferir los datos actualmente, varios pasos preparatorios se tienen:</p>
-
-<ol>
- <li>El <code>XMLHttpRequest</code>'s upload "progress" listener esta configurado para actualizar la información Throbber con nuevo porcentaje, de modo que a medida que avanza la carga, el Throbber sera actualizado basado en la ultima información.</li>
- <li>El <code>XMLHttpRequest</code>'s upload "load" manejador de evento esta configurado para actualizar como un 100% como la información de progreso (para garantizar que el indicador de progreso realmente alcanza el 100%, en caso de peculiaridades y granulidades durante el proceso). A continuación se elimina el thobber, puesto que este no es necesario. Esto hace que el Thobber desaparezca una vez que la carga esta completa.</li>
- <li>La solicitud de carga de imagen se abre llamando el método <code>XMLHttpRequest</code>'s <code>open()</code> para empezar a generar la POST solicitud.</li>
- <li>El tipo MIME para la carga esta configurada para llamar la función<code> XMLHttpRequest</code> function <code>overrideMimeType()</code>. En este caso, estamos usando un tipo MIME  genérico; puede o no ser necesario para configurar el tipo MIME para todo, dependiendo de su caso de uso.</li>
- <li>Finalmente la función <code>XMLHttpRequest</code> <code>sendAsBinary()</code> es llamada para cargar el contenido de el archivo. <em>Esto necesita ser revisado; en la actualidad esta obsoleto la rutina para extraer datos desde archivos getAsBinary() síncrona.</em></li>
-</ol>
-
-<h3 id="Manejando_el_proceso_de_carga_para_un_archivo_asíncronicamente">Manejando el proceso de carga para un archivo, asíncronicamente</h3>
-
-<pre class="deki-transform">function fileUpload(file) {
-  // Please report improvements to: marco.buratto at tiscali.it
-
-  var fileName = file.name,
-    fileSize = file.size,
-    fileData = file.getAsBinary(), // works on TEXT data ONLY.
-    boundary = "xxxxxxxxx",
-    uri = "serverLogic.php",
-    xhr = new XMLHttpRequest();
-
-  xhr.open("POST", uri, true);
-  xhr.setRequestHeader("Content-Type", "multipart/form-data, boundary="+boundary); // simulate a file MIME POST request.
-  xhr.setRequestHeader("Content-Length", fileSize);
-
-  xhr.onreadystatechange = function() {
-    if (xhr.readyState == 4) {
-      if ((xhr.status &gt;= 200 &amp;&amp; xhr.status &lt;= 200) || xhr.status == 304) {
-
-        if (xhr.responseText != "") {
-          alert(xhr.responseText); // display response.
-        }
-      }
-    }
-  }
-
-  var body = "--" + boundary + "\r\n";
-  body += "Content-Disposition: form-data; name='fileId'; filename='" + fileName + "'\r\n";
-  body += "Content-Type: application/octet-stream\r\n\r\n";
-  body += fileData + "\r\n";
-  body += "--" + boundary + "--";
-
-  xhr.send(body);
-  return true;
-}
-</pre>
-
-<p><em>Esto también necesita ser modificado para trabajar con datos binarios.</em></p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><code><a href="/en/DOM/File" title="en/DOM/File">File</a></code></li>
- <li><code><a href="/en/DOM/FileList" title="en/DOM/FileList">FileList</a></code></li>
- <li><a href="/en/DOM/FileReader" title="en/DOM/FileReader"><code>FileReader</code></a></li>
- <li><a href="/En/XMLHttpRequest/Using_XMLHttpRequest" title="En/Using XMLHttpRequest">Using XMLHttpRequest</a></li>
- <li><a href="/en/XMLHttpRequest" title="en/XMLHttpRequest"><code>XMLHttpRequest</code></a></li>
-</ul>
diff --git a/files/es/usar_código_de_mozilla_en_otros_proyectos/index.html b/files/es/usar_código_de_mozilla_en_otros_proyectos/index.html
deleted file mode 100644
index 5cb8795395..0000000000
--- a/files/es/usar_código_de_mozilla_en_otros_proyectos/index.html
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Usando código de Mozilla en otros proyectos
-slug: Usar_código_de_Mozilla_en_otros_proyectos
-tags:
-  - para_revisar
-  - páginas_a_traducir
----
-<p>Hay varias maneras en las que puede usar código de Mozilla en su propio proyecto.</p>
-<ul> <li>Mozilla proporciona un plataforma de desarrollo para aplicaciones de escritorio, llama <a class="internal" href="/en/XUL" title="En/XUL">XUL</a>, sobre la cual usted puede construir aplicaciones.</li> <li>Varios componentes de la plataforma, tales como el motor de JavaScript <a class="internal" href="/en/SpiderMonkey" title="En/SpiderMonkey">SpiderMonkey</a>, pueden ser utilizados en su propio proyecto.</li> <li>Varios componentes de la plataforma, tales como el motor de JavaScript <a class="internal" href="/en/SpiderMonkey" title="En/SpiderMonkey">SpiderMonkey</a>, pueden ser utilizados en su propio proyecto sin el resto de la plataforma.</li> <li>También hay módulos que no son utilizados en Firefox pero están disponibles para el uso de otras aplicaciones; un ejemplo de esto es <a class="internal" href="/en/Rhino" title="En/Rhino">Rhino</a>, el motor JavaScript escrito en Java.</li> <li>Usted puede embeber <a class="internal" href="/en/Gecko" title="En/Gecko">Gecko</a>, el motor de renderizado utilizado por Firefox para procesar paginas web, como un navegador dentro de su propia aplicación.</li>
-</ul>
-<table class="mainpage-table"> <tbody> <tr> <td> <h2 id="Construyendo_aplicaciones_XUL">Construyendo aplicaciones XUL</h2> <dl> <dt><a class="internal" href="/en/The_Joy_of_XUL" title="En/The Joy of XUL">La alegria XUL</a></dt> <dd>La introducción a XUL; una lectura necesaria para los nuevos desarrolladores.</dd> <dt><a class="internal" href="/en/XUL_Reference" title="En/XUL Reference">XUL Referencia</a></dt> <dd>La referencia completa a XUL.</dd> <dt><a class="internal" href="../../../../en/XULRunner" rel="internal">XULRunner</a></dt> <dd>Un paquete runtime que puede ser utilizado para arrancar aplicaciones XUL y XPCOM con facilidad.</dd> <dt><a class="internal" href="../../../../en/Toolkit_API" rel="internal">Mozilla Toolkit</a></dt> <dd>Información acerca de la API Mozilla Toolkit.</dd> </dl> </td> <td> <h2 id="Usando_componentes_Mozilla">Usando componentes Mozilla</h2> <dl> <dt><a class="internal" href="/en/SpiderMonkey" title="en/SpiderMonkey">SpiderMonkey</a></dt> <dd>SpiderMonkey es el motor JavaScript runtime utilizado por proyectos de Mozilla.</dd> <dt><a class="internal" href="/en/NSPR" title="En/NSPR">NSPR</a></dt> <dd>El Netscape Portable Runtime proporciona una API de plataforma-neutal para nivel de sistema y funciones libc-type.</dd> <dt><a class="internal" href="/en/Necko" title="En/Necko">Necko</a></dt> <dd>La librería de red Mozilla proporciona la funcionalidad multi-plataforma de redes.</dd> </dl> </td> </tr> </tbody>
-</table>
-<h2 id="Embeber_Mozilla">Embeber Mozilla</h2>
-<p>Para información sobre embeber un buscador web en su propio proyecto vea <a class="internal" href="/en/Embedding_Mozilla" title="En/Embedding Mozilla">Embeber Mozilla</a>.</p>
-<p>{{ languages( { "ja": "ja/Using_Mozilla_code_in_other_projects", "zh-cn": "cn/Using_Mozilla_code_in_other_projects"} ) }}</p>
diff --git a/files/es/usar_web_workers/index.html b/files/es/usar_web_workers/index.html
deleted file mode 100644
index 0dacf19312..0000000000
--- a/files/es/usar_web_workers/index.html
+++ /dev/null
@@ -1,260 +0,0 @@
----
-title: Usar web workers
-slug: Usar_web_workers
-tags:
-  - Firefox 3.5
-  - Gecko 1.9.1
-  - HTML5
-  - JavaScript
-  - Workers
-  - para_revisar
----
-<p>{{ gecko_minversion_header ("1.9.2") }}</p>
-<p>Workers constituye un medio sencillo para que el contenido web ejecute secuencias de comandos en subprocesos en segundo plano. Una vez creado, un worker puede enviar mensajes a la tarea de generación mediante la publicación de mensajes en un controlador de eventos especificado por el creador.</p>
-<p>El subproceso del worker puede realizar tareas sin interferir con la interfaz de usuario.  Además, pueden realizar E / S utilizando <code><a class="internal" href="/en/XMLHttpRequest" title="En/XMLHttpRequest">XMLHttpRequest</a></code> (aunque los atributos <code>responseXML</code> y <code>channel</code> siempre son nulos).</p>
-<div class="note">
-  <strong>Nota:</strong> como de costumbre, los subprocesos en segundo plano, incluyendo los workers, no pueden manipular el DOM.  Si las acciones adoptadas por el subproceso en segundo plano tienen que dar lugar a cambios en el DOM, deben enviar mensajes a sus creadores para hacer ese trabajo.</div>
-<p>Consulta el documento de referencia <a class="internal" href="/En/DOM/Worker" title="En/DOM/Worker">Worker</a> , al que este artículo complementa ofreciendo ejemplos y añadiendo detalles. Para obtener una lista de funciones disponibles para workers, consulta <a href="/En/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Funciones disponibles para workers</a> .</p>
-<h2 id="Acerca_de_la_seguridad_en_los_subprocesos">Acerca de la seguridad en los subprocesos</h2>
-<p>La interfaz <code>Worker</code> genera subprocesos a nivel del sistema operativo y la simultaneidad puede producir efectos interesantes en el código si no tienes cuidado. Sin embargo, en el caso de web workers, los puntos de comunicación controlados cuidadosamente con otros subprocesos supone que en realidad sea muy difícil causar problemas de simultaneidad.  No hay acceso a componentes sin subprocesos seguros o al DOM y tienes que pasar datos específicos dentro y fuera de un subproceso a través de objetos serializados.  Así que te tienes que esforzar mucho para causar problemas en el código.</p>
-<h2 id="Generar_un_worker">Generar un worker</h2>
-<p>Crear un nuevo worker es simple.  Lo único que tienes que hacer es llamar al constructor <code>Worker()</code>, especificando el URI de un script para ejecutar en el subproceso del worker y, si deseas poder recibir las notificaciones del worker, establece la propiedad <code>onmessage</code> del worker a una función de manejador de evento adecuada.</p>
-<pre class="brush: js">var myWorker = new Worker('my_worker.js');
-myWorker.onmessage = function(event) {
-  print("Llamado de nuevo por el worker\n");
-};</pre>
-<p>De forma alternativa, podemos usar <code>addEventListener()</code>:</p>
-<pre class="brush: js">var worker = new Worker('my_worker.js');
-worker.addEventListener('message', function(event) {
- console.log("Called back by the worker!\n");
-}, false);
-
-worker.postMessage(""); // Iniciar el worker.
-</pre>
-<p>La línea 1 de este ejemplo crea e inicia el subproceso del worker. La línea 2 establece el controlador <code>onmessage</code> para el worker a una función que se llama cuando éste pide su propia función <code>postMessage()</code>.</p>
-<div class="note">
-  <strong>Nota</strong>: La URI pasada como parámetro del constructor del <code>Worker</code> debe obedecer la política del <a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">mismo origen o same-origin policy</a>. Actualmente hay un desacuerdo en los diferentes desarrolladores de navegadores acerca de si las URIs han de ser del mismo origen o no; Gecko 10.0 {{ geckoRelease("10.0") }} y posteriores permiten cualquier URI como script válido para workers, otros navegadores pueden no permitirlo.</div>
-<h2 id="Generar_subworkers">Generar subworkers</h2>
-<p>Los workers pueden generar más workers si así lo desean.  Los llamados subworkers deben estar alojados en el mismo origen que la página principal.  Además, los URI para los subworkers se resuelven en relación a la ubicación del worker principal y no en relación a la de la página propietaria.  Esto hace que sea más fácil que los workers realicen un seguimiento de dónde están sus dependencias.</p>
-<h2 id="Tiempos_de_espera_e_intervalos">Tiempos de espera e intervalos</h2>
-<p>Los workers pueden utilizar los tiempos de espera y los intervalos al igual que el proceso principal.  Esto puede ser útil, por ejemplo, si quieres hacer que tu subproceso del worker ejecute código de manera periódica en lugar de ininterrumpidamente.</p>
-<p>Consulta <a class="internal" href="/en/DOM/window.setTimeout" title="En/DOM/Window.setTimeout"><code>setTimeout()</code></a>, <a class="internal" href="/en/DOM/window.clearTimeout" title="En/DOM/Window.clearTimeout"><code>clearTimeout()</code></a>, <a class="internal" href="/en/DOM/window.setInterval" title="En/DOM/Window.setInterval"><code>setInterval()</code></a> y <a class="internal" href="/en/DOM/window.clearInterval" title="En/DOM/Window.clearInterval"><code>clearInterval()</code></a> si deseas tener más detalles.</p>
-<h2 id="Terminar_un_worker">Terminar un worker</h2>
-<p>Si tienes que cancelar inmediatamente un worker que se está ejecutando, puedes hacerlo llamando al método <code>terminate()</code> del worker:</p>
-<pre class="brush: js">myWorker.terminate();
-</pre>
-<p>El subproceso del worker se interrumpe inmediatamente y sin tener la posibilidad de terminar sus operaciones o limpiar por sí mismo.</p>
-<p>Los workers pueden cerrarse llamando a su propio método {{ ifmethod("nsIWorkerScope", "close") }}.</p>
-<h2 id="Gestión_de_errores">Gestión de errores</h2>
-<p>Cuando se produce un error de ejecución en el worker, es llamado su controlador de enventos <code>onerror</code>.  Recibe un evento denominado <code>error</code> que implementa la interfaz <code>ErrorEvent</code>.  El evento no se lanza y se puede cancelar, para evitar que la acción predeterminada tenga lugar, el worker puede llamar al método <a class="internal" href="../../../../en/DOM/event.preventDefault" rel="internal"><code>preventDefault()</code></a> del evento de error.</p>
-<p>El evento de error tiene los siguientes tres campos que son de interés:</p>
-<dl>
-  <dt>
-    <code>message</code></dt>
-  <dd>
-    Un mensaje de error legible para el ojo humano.</dd>
-  <dt>
-    <code>filename</code></dt>
-  <dd>
-    El nombre del archivo de script en el que se produjo el error.</dd>
-  <dt>
-    <code>lineno</code></dt>
-  <dd>
-    El número de línea del archivo de script en el que se produjo el error.</dd>
-</dl>
-<h2 id="Acceder_al_objeto_navegador">Acceder al objeto navegador</h2>
-<p>Los workers pueden acceder al objeto <code>navigator</code>, que está disponible dentro de su ámbito.  Contiene las siguientes cadenas de texto que pueden usarse para identificar el navegador, tal y como se puede hacer a partir de secuencias de comandos normales:</p>
-<ul>
-  <li><code>appName</code></li>
-  <li><code>appVersion</code></li>
-  <li><code>platform</code></li>
-  <li><code>userAgent</code></li>
-</ul>
-<h2 id="Importar_de_secuencias_de_comandos_y_bibliotecas">Importar de secuencias de comandos y bibliotecas</h2>
-<p>Los subprocesos de trabajo tienen acceso a una función global, importScripts (), que les permite importar secuencias de comandos de comandos o bibliotecas dentro de su ámbito.  Acepta como parámetros cero o más URI de recursos para la importación, todos los ejemplos siguientes son válidos:</p>
-<pre class="brush: js">importScripts();                        /* no importa nada */
-importScripts('foo.js');                /* importa solo "foo.js" */
-importScripts('foo.js', 'bar.js');      /* importa dos scripts */
-</pre>
-<p>Firefox carga cada secuencia de comandos de la lista, luego los ejecuta para permitirles que se inicialicen ellos mismos.  Los objetos globales de cada secuencia de comandos pueden entonces ser utilizados por el worker.</p>
-<div class="note">
-  <strong>Nota:</strong> los scripts pueden ser descargados en cualquier orden, pero no se ejecutarán en el orden en que pasas los nombres de archivo a <code>importScripts()</code> .  Esto se realiza de forma sincrónica; <code>importScripts()</code> no retorna hasta que todas las secuencias de comandos se han cargado y ejecutado.</div>
-<p> </p>
-<h2 id="Ejemplos">Ejemplos</h2>
-<p>Esta sección incluye varios ejemplos de cómo utilizar los DOM workers.</p>
-<h3 id="Realizar_cálculos_en_segundo_plano">Realizar cálculos en segundo plano</h3>
-<p>Una utilidad de los workers es permitir que tu código realice cálculos intensivos en el procesador sin bloquear el subproceso de interfaz de usuario.  En este ejemplo, un worker se utiliza para calcular los números de Fibonacci.</p>
-<h4 id="El_código_JavaScript">El código JavaScript</h4>
-<pre class="brush: js">var results = [];
-
-function resultReceiver(event) {
-  results.push(parseInt(event.data));
-  if (results.length == 2) {
-    postMessage(results[0] + results[1]);
-  }
-}
-
-function errorReceiver(event) {
-  throw event.data;
-}
-
-onmessage = function(event) {
-  var n = parseInt(event.data);
-
-  if (n == 0 || n == 1) {
-    postMessage(n);
-    return;
-  }
-
-  for (var i = 1; i &lt;= 2; i++) {
-    var worker = new Worker("fibonacci.js");
-    worker.onmessage = resultReceiver;
-    worker.onerror = errorReceiver;
-    worker.postMessage(n - i);
-  }
- };</pre>
-<p>La función <code>onmessage</code> es llamada cuando el código HTML llamada al <code>postMessage()</code> en el worker.  Esto inicia la recursividad, generando copias nuevas de sí mismo para controlar cada iteración del cálculo.</p>
-<h4 id="El_código_HTML">El código HTML</h4>
-<pre class="brush: html">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt;
-&lt;html&gt;
-  &lt;title&gt;Test threads fibonacci&lt;/title&gt;
-  &lt;body&gt;
-
-  &lt;div id="result"&gt;&lt;/div&gt;
-
-  &lt;script language="javascript"&gt;
-
-    var worker = new Worker("fibonacci.js");
-
-    worker.onmessage = function(event) {
-      document.getElementById("result").textContent = event.data;
-      dump("Got: " + event.data + "\n");
-    };
-
-    worker.onerror = function(error) {
-      dump("Worker error: " + error.message + "\n");
-      throw error;
-    };
-
-    worker.postMessage("5");
-
-  &lt;/script&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-<p>La página web crea un elemento <code>div</code> con el id. de cliente <code>result</code> , que se utiliza para mostrar el resultado, a continuación, genera el worker.  Tras generar el worker, el manejador<code>onmessage</code> está configurado para mostrar los resultados mediante el ajuste de los contenidos del elemento <code>div</code>, y el manejador <code>onerror</code> se establece para <a href="/en/Debugging_JavaScript#dump()" title="en/Debugging JavaScript#dump()">volcar</a> el mensaje de error.</p>
-<p>Por último, se envía un mensaje al worker para iniciarlo.</p>
-<p><a href="/samples/workers/fibonacci" title="samples/workers/fibonacci">Prueba este ejemplo</a> .</p>
-<h3 id="Realizar_E_S_de_web_en_segundo_plano">Realizar E / S de web en segundo plano</h3>
-<p>Puedes encontrar un ejemplo de esto en el artículo <a class="internal" href="/En/Using_workers_in_extensions" title="En/Using workers in extensions">Usar  workers en las extensiones</a> .</p>
-<h3 id="Dividir_tareas_entre_varios_workers">Dividir tareas entre varios workers</h3>
-<p>A medida que los equipos con varios núcleos se hacen cada vez más frecuentes, resulta útil dividir las tareas  complejas, desde el punto de vista computacional, entre varios workers, que a su vez pueden llevar a cabo esas tareas en núcleos de procesador múltiple.</p>
-<p>el ejemplo se incluirá muy pronto</p>
-<h3 id="Crear_workers_desde_dentro_de_los_workers">Crear workers desde dentro de los workers</h3>
-<p>El ejemplo de Fibonacci mostrado anteriormente demuestra que los workers pueden, de hecho, generar más workers.  Esto facilita crear rutinas repetitivas.</p>
-<h3 id="Enviar_objetos_a_los_workers">Enviar objetos a los workers</h3>
-<p>Puede pasar con seguridad los objetos dentro y fuera de los workers que utilizan el método <code>postMessage()</code>, los objetos se convierten automáticamente en <a class="internal" href="/en/JSON" title="En/JSON">JSON</a> de manera interna.</p>
-<pre class="brush: js">var onmessage = function(e) {
-  postMessage(e.data);
-};</pre>
-<div class="note">
-  <strong>Nota: los</strong> objetos que se introducen o se extraer de los workers no deben contener funciones o referencias cíclicas, ya que JSON no es compatible con ellas.</div>
-<p>{{ CompatibilityTable() }}</p>
-<div id="compat-desktop">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Característica</th>
-        <th>Chrome</th>
-        <th>Firefox (Gecko)</th>
-        <th>Internet Explorer</th>
-        <th>Opera</th>
-        <th>Safari (WebKit)</th>
-      </tr>
-      <tr>
-        <td>Workers dedicados</td>
-        <td>3</td>
-        <td>3.5 (1.9.1)</td>
-        <td>10</td>
-        <td>10.60</td>
-        <td>4</td>
-      </tr>
-      <tr>
-        <td>Workers compartidos</td>
-        <td>5</td>
-        <td>---</td>
-        <td>---</td>
-        <td>10.60</td>
-        <td>5</td>
-      </tr>
-      <tr>
-        <td>Pasar datos usando <a href="/en/DOM/The_structured_clone_algorithm" title="El algoritmo de clonación estructurada">clonación estructurada</a>. </td>
-        <td>13</td>
-        <td>8</td>
-        <td>10</td>
-        <td>11.50</td>
-        <td>5.1</td>
-      </tr>
-      <tr>
-        <td>Pasar datos usando <a class="external" href="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects" title="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects">objetos transferibles</a></td>
-        <td>17 {{ property_prefix("webkit") }}</td>
-        <td>---</td>
-        <td>---</td>
-        <td>---</td>
-        <td>---</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<div id="compat-mobile">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Característica</th>
-        <th>Android</th>
-        <th>Chrome for Android</th>
-        <th>Firefox Mobile (Gecko)</th>
-        <th>IE Phone</th>
-        <th>Opera Mobile</th>
-        <th>Safari Mobile</th>
-      </tr>
-      <tr>
-        <td>Workers dedicados</td>
-        <td>---</td>
-        <td>0.16</td>
-        <td>---</td>
-        <td>---</td>
-        <td>11</td>
-        <td>5</td>
-      </tr>
-      <tr>
-        <td>Workers compartidos</td>
-        <td>---</td>
-        <td>{{ CompatNo() }}</td>
-        <td>---</td>
-        <td>---</td>
-        <td>---</td>
-        <td>---</td>
-      </tr>
-      <tr>
-        <td>Pasar datos usando <a href="/en/DOM/The_structured_clone_algorithm" title="El algoritmo de clonación estructurada">clonación estructurada</a>. </td>
-        <td>---</td>
-        <td>0.16</td>
-        <td>---</td>
-        <td>---</td>
-        <td>---</td>
-        <td>---</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<h2 id="Consulta_también">Consulta también</h2>
-<ul>
-  <li>{{ spec("http://dev.w3.org/html5/workers/", "Especificación API de ficheros: Web Workers", "ED") }}</li>
-  <li><a class="internal" href="/En/DOM/Worker" title="En/DOM/Worker">Worker</a> interface</li>
-  <li><a class="internal" href="/En/DOM/SharedWorker" title="En/DOM/SharedWorker">SharedWorker</a> interface</li>
-  <li><a href="/En/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Funciones disponibles para workers</a></li>
-  <li><a class="external" href="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers" title="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers">HTML5Rocks - Lo básico sobre Web Workers</a></li>
-</ul>
-<p>{{ HTML5ArticleTOC() }}</p>
-<p>{{ languages ( {"en": "En/Using_web_workers"} ) }}</p>
diff --git a/files/es/usar_xpinstall_para_instalar_plugins/index.html b/files/es/usar_xpinstall_para_instalar_plugins/index.html
deleted file mode 100644
index 260a29a8e5..0000000000
--- a/files/es/usar_xpinstall_para_instalar_plugins/index.html
+++ /dev/null
@@ -1,236 +0,0 @@
----
-title: Usar XPInstall para instalar plugins
-slug: Usar_XPInstall_para_instalar_plugins
-tags:
-  - Plugins
-  - Todas_las_Categorías
-  - XPInstall
----
-<p>
-</p><p><a href="es/XPInstall">XPInstall</a> es una tecnología de instalación basada en JavaScript que funciona en todas las plataformas en las que pueden instalarse los navegadores de <a class="external" href="http://mozilla.org">Mozilla</a> y los de Netscape basados en Mozilla. Puede ser un modo para asegurarle al usuario una plácida experiencia a la hora de obtener plugins, sin obligarlo a abandonar el entorno de navegación para ejecutar un instalador binario (el típico setup.exe en Windows) ni forzarlo a reiniciar su navegador. Los fabricantes de plugins que ya hayan escrito un instalador en código nativo (p.e., EXE) pueden incluir dicho instalador y ejecutarlo para que el usuario no tenga que abandonar el entorno del navegador y hacer clic en el EXE para ejecutarlo. Este artículo muestra una guía de estilo para mejorar la experiencia en la instalación de un plugin para los navegadores de Netscape Gecko utilizando <a href="es/XPInstall_API_Reference">XPInstall</a>.
-</p>
-<h3 id="Definici.C3.B3n_de_t.C3.A9rminos"> Definición de términos </h3>
-<p>XPInstall es una tecnología de instalación. El propio nombre significa "Cross Platform Install" (instalador multiplataforma) y de ahí lo de "XP" (abreviatura en inglés de "multiplataforma"). Un paquete XPInstall es generalmente llamado un paquete XPI para abreviar (y pronunciado generalmente "zippy" en inglés). Este artículo explica cómo se puede usar XPInstall para instalar plugin en los navegadores que soporten XPInstall.
-</p><p>Un paquete XPI es de hecho un fichero ZIP con la extensión XPI (p.e., myPluginInstaller.xip) y puede ser creado en Windows con utilidades tipo WinZip. Los paquetes XPI, como los ficheros ZIP, <i>contienen</i> otros ficheros, normalmente:
-</p>
-<ul><li> El componente software que va a ser instalado. En nuestro caso es el software del plugin.
-</li><li> Un fichero JavaScript llamado install.js, el cual contiene la lógica que conduce la instalación. Esto incluye instrucciones que indican dónde se va a instalar el software y mensajes para informar al usuario.
-</li></ul>
-<p>Un fichero XPInstall se puede crear empaquetando primero los elementos que se quieran instalar con WinZip (es decir, crear un fichero ZIP) y renombrarlo con la extensión XPI en lugar de ZIP.
-</p><p>A diferencia de los instaladores compilados para código nativo (p.e., los típicos ficheros setup.exe), el lenguaje de programación para las operaciones de instalación en XPI es JavaScript. Como el formato de fichero que contiene al software y al fichero JavaScript install.js es multiplataforma (Zip) y ya que los navegadores de Mozilla para todas las plataformas reconocen JavaScript, generalmente un único paquete XPI sirve para todas las plataformas. Así es, de hecho, <a class="external" href="http://www.mozilla.org/docs/xul/xulnotes/xulnote_packages.html">cómo las pieles y los temas son instalados en los navegadores de Mozilla</a>, cambiando su aspecto y apariencia. Este artículo se centra en cómo instalar plugins.
-</p>
-<h3 id=".C2.BFQu.C3.A9_navegadores_soportan_XPInstall.3F"> ¿Qué navegadores soportan XPInstall? </h3>
-<p>Actualmente, todos los <a class="external" href="http://mozilla.org/releases/stable.html">navegadores de Mozilla liberados por mozilla.org</a> y la familia de navegadores basados en el código de Mozilla soportan XPInstall. Concretamente, están incluidos:
-</p>
-<ul><li> Los navegadores recientes de Netscape tales como Netscape 6.2.x y Netscape 7.0, ambos basados en Netscape Gecko que es el núcleo del navegador Mozilla.
-</li></ul>
-<ul><li> Las versiones recientes <b>sólo beta</b> del software de AOL basado en Netscape Gecko, el motor de renderizado del proyecto Mozilla.
-</li></ul>
-<p><b>Advertencias:</b>
-</p>
-<ul><li> El <a class="external" href="http://www.compuserve.com/">navegador CompuServe</a> de AOL Time Warner, basado también en Netscape Gecko, no soporta XPInstall.
-</li></ul>
-<ul><li> Netscape Communicator 4.x no soporta XPInstall.
-</li></ul>
-<h3 id=".C2.BFEn_qu.C3.A9_consiste_un_plugin.3F"> ¿En qué consiste un plugin? </h3>
-<p>Los plugins pueden estar compuestos de los siguientes tipos de fichero, pudiendo ser todos ellos instalados desde un paquete XPI:
-</p>
-<ul><li> <b>Bibliotecas compartidas</b> (p.e., en Windows, son DLLs, en Unix son los ficheros *.so). Dichos ficheros están compilados en código nativo con la <a href="es/Gecko_Plugin_API_Reference">API para plugins de Netscape</a>.
-</li></ul>
-<ul><li> Si el plugin es scriptable, entonces también consistirá en un <a href="es/Gecko_Plugin_API_Reference/Plug-in_Development_Overview">fichero XPT</a>. Un ejemplo podría ser Flash 6r47 en Windows, el cual está compuesto por una DLL (llamada npswf32.dll) y un fichero XPT para la programación (llamado flashplayer.xpt). Si estás desarrollando un plugin y quieres <a href="es/Gecko_Plugin_API_Reference/Plug-in_Development_Overview">hacerlo scriptable</a>, mírate las partes importantes de la <a href="es/Gecko_Plugin_API_Reference">API para plugins</a>.
-</li></ul>
-<ul><li> <b>Software adicional</b>. Muchos plugins son parte de software adicional para tipos multimedia. Por ejemplo, RealPlayer para Windows consta de un plugin DLL pero también de la aplicación RealPlayer (EXE), de la que el plugin DLL es subconjunto. En este caso, el plugin es parte del paquete de software específico del navegador como mecanismo para darle a la aplicación <i>ganchos</i> adicionales en el navegador.
-</li></ul>
-<p>XPInstall puede ser utilizado para instalar cualquier combinación de estos ficheros en el ordenador del usuario final. Para aquellos que les suene la tecnología SmartUpdate de Netscape Communicator 4.x, esto les resultará familiar.
-</p>
-<h3 id="Breve_historia_de_las_tecnolog.C3.ADas_de_instalaci.C3.B3n_de_Netscape"> Breve historia de las tecnologías de instalación de Netscape </h3>
-<p>Esta sección es importante si estás familiarizado con la tecnología de instalación SmartUpdate de Netscape Communicator 4.x. El uso de JavaScript como lógica de instalación no tiene precedentes en los navegadores de Netscape. Netscape Communicator 4.x utilizaba la noción de SmartUpdate para instalar el software, concretamente los plugins y los applets de Java para que fuesen ejecutados localmente. SmartUpdate <i><b>no está soportado</b></i> por los navegadores de Mozilla (ni los navegadores de Netscape/AOL basados en Mozilla tales como Netscape 7) pero debido a la similitud entre ambas tecnologías de instalación, es fácil convertir los ficheros SmartUpdate a ficheros XPInstall. SmartUpdate utiliza un fichero JAR firmado digitalmente que contiene los componentes de software a instalar además del fichero JavaScript install.js (el llamado script de instalación) como lógica del instalador. Las descargas y los instaladores deberían empezar mostrando un cuadro de diálogo de seguridad que aclarase la autoridad certificadora y el firmante. Frecuentemente, la descarga SmartUpdate era disparada a través del atributo <code>pluginurl</code> de la etiqueta <code>&lt;embed&gt;</code>.
-</p>
-<pre>&lt;embed type="application/x-randomtype" src="myfile.typ" width="50" height="50"
-pluginurl="http://mytypecompany.xyz/jarpacks/mytypeplugin.jar"&gt;&lt;/embed&gt;
-</pre>
-<p>En el ejemplo anterior, el atributo <code>pluginurl</code> referencia a un fichero firmado JAR, el cual sería descargado por Netscape Communicator 4.x (dependiendo de la elección en el cuadro de diálogo de seguridad) <b>si</b> el plugin no estuviera instalado en la máquina del usuario. SmartUpdate difiere de XPInstall en esto:
-</p>
-<ul><li> XPInstall utiliza ficheros ZIP renombrados a XPI (*.xpi) y SmartUpdate utiliza ficheros JAR (*.jar)
-</li><li> A diferencia de los ficheros JAR de SmartUpdate, los paquetes XPI no tienen que estar firmados digitalmente con un certificado digital.
-</li><li> Los paquetes XPI hacen uso de <a href="es/XPInstall_API_Reference">diferentes APIs</a> dentro de install.js, aunque el concepto es el mismo.
-</li></ul>
-<p>XPInstall para los navegadores basados en Mozilla es análogo a SmartUpdate en el navegador Netscape Communicator 4.x. Portar SmartUpdate a XPInstall es trivial tras haberse familiarizado con la <a href="es/XPInstall_API_Reference">nueva API de XPInstall</a>.
-</p>
-<h3 id="Proceso_de_instalaci.C3.B3n_recomendado"> Proceso de instalación recomendado </h3>
-<p>XPInstall suministra una API unificada para llevar a cabo una rápida instalación y configuración del software del plugin para los usuarios finales. Los beneficios de usar XPInstall son porporcionar un mecanismo de instalación para descargas en flujo. Esta sección explica lo que tendría que hacer un paquete XPInstall ideal, además de descubrir algunas de las llamadas API de JavaScript que llevan a cabo estas tareas. Un paquete XPI ideal debería:
-</p>
-<ol><li> Instalarse en el navegador actual que ha llamado a la instalación XPInstall vía HTML o que la ha ejecutado a través de un script. Usaremos el término "navegador actual" para referirnos al navegador que inicia la descarga del XPInstall visitando un sitio que requiere un plugin que el navegador actual no encuentra localmente. Este paso implica el uso de la llamada a la API <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> para inicializarlo todo y además la llamada <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a> que ayuda a encontrar el directorio de plugins del navegador actual.
-</li><li> Instalar el software del plugin en otra ubicación del disco duro del usuario para que otros navegadores basados en Mozilla que el usuario pudiese instalar más tarde encontrasen y pudieran utilizar el plugin (los componentes específicos del navegador). La meta es asegurar que futuros navegadores Netscape Gecko que pudieran ser instalados más adelante puedan beneficiarse de la instalación iniciada por el usuario con el navegador actual. Un ejemplo lo tenemos si el navegador actual fuese Netscape 7 y más adelante el usuario descargase una beta del software de AOL que usase Netscape Gecko. En lugar de descargar de nuevo el plugin con el otro navegador, éste podría detectar que ya se llevó a cabo la instalación. Este mecanismo de descubrimiento necesita que la creación de la localización secundaria quede reflejada en algún repositorio común de metadatos. En Windows es el registro del sistema. De nuevo, este paso implica llamadas a <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a> para localizar un directorio "bien conocido" y usarlo como localización secundaria.
-</li><li> En Windows: escribir claves de registro que pudiesen ser analizadas por los navegadores Netscape Gecko (instalados tras el navegador actual) para detectar dónde está instalado el plugin en el ordenador. En particular, las claves de registro deberían referenciar a la localización de instalación secundaria para que los futuros navegadores Netscape Gecko pudiesen encontrar y añadir su lista de ubicaciones de plugins disponibles. El formato exacto de dichas claves y cómo deberían ser escritas es tratado en la sección <a href="#Problemas_con_la_primera_instalaci.C3.B3n">#Problemas con la primera instalación</a>. Para crear y escribir realmente claves en el registro de sistema de Windows se debe usar las funciones del <a href="es/XPInstall_API_Reference/WinReg_Object">objeto WinReg</a>.
-</li><li> Asegurar que el plugin recién instalado es actualizado correctamente llamando a la <a href="es/XPInstall_API_Reference/Install_Object/Methods/refreshPlugins">API refreshPlugins</a>. Actualizando el plugin, te estarás asegurando de que el plugin está disponible para uso inmediato, sin obligar al usuario a reiniciar su navegador. Esta es una de las ventajas clave de una experiencia con XPInstall depurada.
-</li></ol>
-<h3 id="El_problema_de_la_primera_instalaci.C3.B3n"> El problema de la primera instalación </h3>
-<p>El problema de la primera instalación hace referencia a los problemas que surgen cuando un plugin es instalado en el ordenador de un usuario antes de instalar un navegador. El proceso de instalación recomendado intenta resolver este problema instalando el plugin en una ubicación secundaria tras instalar el navegador actual. En pocas palabras, el problema de la primera instalación podría resumirse con la pregunta: ¿cómo puede un navegador instalado en el ordenador de un usuario después de que un plugin haya sido instalado previamente con el beneplácito del usuario desde una instalación existente en lugar de haber descargado el mismo plugin de nuevo? Para resolver este incoveniente, se aconseja a los vendedores a:
-</p>
-<ul><li> Instalar los componentes del software del plugin para el navegador (p.e., DLLs en Windows y ficheros XPT si procede) a una ubicación secundaria además de en el directorio de plugins del navegador actual.
-</li><li> Escribir claves en el registro de Windows para que guarden la información de esta ubicación secundaria, en particular la ruta de los plugins y la de los XPT (si procede) para que los navegadores de Netscape Gecko puedan buscar el plugin desde la ubicación secundaria si son instalados después de que lo fuese el plugin (o si un navegador de Netscape Gecko concreto reemplaza al navegador actual). La información que deberían contener las claves es <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">explicada con detalle en la especificación publicada en mozilla.org</a>. Existe además un <a class="external" href="http://www.mozilla.org/projects/plugins/example-scobe.txt">ejemplo de una entrada de registro</a> creada por una compañía imaginaria que ilustra lo que se explica en la <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">especificación para dichas claves de registro</a>.
-</li><li> En Windows, las claves del registro mencionadas antes siguen una nomenclatura usando el concepto de <a class="external" href="http://www.mozilla.org/projects/plugins/plugin-identifier.html">identificador de plugin</a> como nombre de clave bajo la subclave MozillaPlugins. El <a class="external" href="http://www.mozilla.org/projects/plugins/plugin-identifier.html">identificador de plugin (o PLID)</a> es un concepto útil que es también aplicable cuando se inicializa la instalación a través de la <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">API initInstall</a>.
-</li></ul>
-<h3 id="Disecci.C3.B3n_de_las_APIs_utilizadas"> Disección de las APIs utilizadas </h3>
-<p>El proceso recomendado de instalación de plugins hace uso de las APIs de XPInstall para instalarlos en el directorio Plugins del navegador actual, en una ubicación secundaria y para <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">escribir una clave en el registro del sistema de Windows que permita recuperar esta última ubicación</a>. Esta sección describe algunas de las APIs de XPInstall que pueden hacer esto y muestra además una plantilla completa de un paquete XPI. No todo el trabajo necesita ser hecho en JavaScript (si tienes un instalador nativo (EXE) que <a class="external" href="http://mozilla.org/projects/plugins/install-scheme.html">reconoce a los navegadores Netscape Gecko</a> y simplemente deseas incluir el instalador ejecutable en un paquete XPI para que el usuario pueda descargarlo, puedes hacerlo fácilmente). Esta sección hace referencia de modo extensivo a la <a href="es/XPInstall_API_Reference">documentación API de XPInstall</a>.
-</p>
-<h4 id="Inicializar_la_instalaci.C3.B3n_con_el_identificador_del_plugin"> Inicializar la instalación con el identificador del plugin </h4>
-<p>Toda instalación XPInstall es inicializada con el <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">método initInstall del objeto Install</a>. Ya que el objeto Install está disponible para el script de instalación no necesita ser mencionado en dicho script (p.e., no hay necesidad de utilizar Install.initInstall. Con invocar simplemente a <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> será suficiente). El método initInstall es polimórfico aunque a continuación se muestra el mecanismo de invocación recomendado:
-</p>
-<pre>initInstall("My Plugin Software", "@myplugin.com/MyPlugin,version=2.5", "2.5.0.0");
-</pre>
-<p>En el trozo de código anterior, el método <a href="es/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> es invocado con tres parámetros:
-</p>
-<ul><li> Una cadena con el nombre de la aplicación.
-</li><li> Una cadena representando el <a class="external" href="http://mozilla.org/projects/plugins/plugin-identifier.html">identificador del plugin</a> asociado con el plugin. En realidad, este valor se guarda en el registro de versión de cliente tras la instalación, un fichero de los navegadores Mozilla que guarda metadatos con el software que acaba de ser instalado. Este valor puede ser consultado con JavaScript a través de una página web y es útil para inicializar descargas XPInstall vía <a href="es/XPInstall_API_Reference/InstallTrigger_Object">scripts disparados</a>. Se puede determinar la versión del software que ha sido instalado y determinar si se tiene que actualizar o no, todo esto utilizando JavaScript en una página web.
-</li><li> Una cadena que represnta la versión de cuatro dígitos del software.
-</li></ul>
-<p><b>Advertencia:</b> Ciertas versiones de los navegadores basados en Mozilla (tales como Netscape 6.x) tratan al carácter igual ("=") como un token ilegal, por lo que no permitirán la invocación de initInstall con cadenas que contengan "=". Un truco podría ser detectar si initInstall ha fallado y, en caso afirmativo, invocarlo de nuevo sin el "=". A continuación se muestra un ejemplo:
-</p>
-<pre>var PLID = "MyPlugin.plug/version=6.5";
-err = initInstall(SOFTWARE_NAME, PLID, VERSION);
-
-if (err != 0)
-{
-	// la instalación debería fallar: se usa N6 y =
-	// reemplazamos PLID con una cadena simple
-	err = initInstall(SOFTWARE_NAME, "MyPluginString", VERSION);
-	if (err != 0)
-		cancelInstall(err);
-}
-</pre>
-<p>Nótese que en el ejemplo anterior el PLID contiene un "=" y, en caso de que el paquete XPI esté siendo ejecutado en navegadores que tratan a "=" como un token ilegal, el truco capturará el error e invocará de nuevo a initInstall.
-</p>
-<h3 id="Usar_XPInstall_junto_con_un_instalador_ejecutable_.28c.C3.B3digo_nativo.29"> Usar XPInstall junto con un instalador ejecutable (código nativo) </h3>
-<p>Si lo que deseas es ejecutar un instalador nativo (EXE) para instalar el software de un plugin pero prefieres que el instalador sea descargado dentro del proceso del navegador entonces probablemente deberías considerar incluirlo en un paquete XPI. Desde JavaScript, puedes llamar al <a href="es/XPInstall_API_Reference/Install_Object/Methods/execute">método execute del objeto Install</a> del XPInstall para ejecutar el binario. Además puedes llamar al <a href="es/XPInstall_API_Reference/File_Object/Methods/execute">método execute del objeto File</a> si lo que realmente quieres instalar es el fichero que estás ejecutando en lugar de borrarlo. Puedes pasar parámetros de línea de comandos al ejecutable. Un ejemplo de llamada al método execute desde el objeto Install sobre un ejecutable que tiene un período de vida temporal (y no se necesita tras la instalación) es:
-</p>
-<pre>// Initialize the installation ....
-
-// initInstall(..... ) has already been called
-
-// Using the Install Object's execute method to block on a native installer
-
-execute("setup.exe", "-s", true);
-
-// En el ejemplo anterior, se supone que se ha ejecutado "setup -s" desde
-// la línea de comandos que arranca el instalador y que "-s" es algún
-// tipo de parámetro definido por el fichero setup.exe, quizá para forzar
-// al instalador a ejecutarse en modo silencioso. Se pasa el "-s" al instalador.
-// Pasando 'true' le estamos diciendo al script de instalación que bloquee
-// la ejecución del instalador y que lo haga síncronamente.
-
-// Se debería llamar a performInstall para hacer que suceda...
-
-err = getLastError();
-if (!err)
-   performInstall();
-else
-  cancelInstall(err);
-</pre>
-<h4 id="Instalar_los_ficheros_del_plugin_en_el_navegador_actual"> Instalar los ficheros del plugin en el navegador actual </h4>
-<p>La instalación en el navegador actual es la tarea más importante que debe de hacerse bien para un paquete XPI. A continuación se muestra un trozo de código que lleva a cabo esto:
-</p>
-<pre>// Name of the files to be installed
-var PLUGIN_FILE    = "NPMyPlugin.dll";
-var COMPONENT_FILE = "NPMyPluginScriptablePeer.xpt";
-
-// invoke initInstall to start the installation
-
-....
-
-var pluginFolder = getFolder("Plugins");
-
-// verify disk space is appropriate
-
-....
-
-err = addFile("@myplugin.com/MyPlugin,version=2.5.0.0",
-                     "2.5.0.0", PLUGIN_FILE, pluginsFolder, null);
-    if (err != 0)
-    {
-	//alert("Installation of MyPlugin plug-in failed. Error code "+err);
-	logComment("adding file "+PLUGIN_FILE+" failed. Errror conde: " + err);
-	return err;
-    }
-
-err = addFile(null, CULT_VERSION, COMPONENT_FILE, componentsFolder, null);
-    if (err != 0)
-    {
-	alert("Installation of MyPlugin component failed. Error code "+err);
-	logComment("adding file "+COMPONENT_FILE+" failed. Error conde: " + err);
-	return err;
-    }
-</pre>
-<h4 id="Instalaci.C3.B3n_en_una_ubicaci.C3.B3n_secundaria"> Instalación en una ubicación secundaria </h4>
-<p>Para solventar el <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">problema de la primera instalación</a> es necesario instalar en una segunda ubicación para asegurar que otros navegadores de Netscape Gecko puedan encontrar el plugin, además del navegador actual. Una buena elección para esta ubicación secundaria podría ser el directorio Windows en ordenadores con Windows. <b>Advertencia:</b> Debido a posibles problemas de permisos se aconseja manejar los errores con sumo cuidado.
-</p>
-<pre>// Obtenemos el directorio de sistema de Windows, p.e., el directorio C:\WINNT\system32\
-
-var winDirectory = getFolder("Win System");
-
-// Create the Folder C:\WINNT\system32\MyPlugin
-
-var dllWin32Folder = getFolder("file:///", winDirectory+"\\MyPlugin\\");
-//Install DLL to C:\Windows Folder
-	copyErr = addFile("", VERSION, PLUGIN_FILE, dllWin32Folder, null);
-    if (copyErr != 0)
-    {
-    	logComment("First Install:"+copyErr);
-    	return copyErr;
-    }
-
-// Install the XPT file to C:\WINNT\system32\MyPlugin folder
-
-var xptWin32Folder = getFolder("file:///", winDirectory+"\\MyPlugin\\");
-	copyErr = addFile("", VERSION, COMPONENT_FILE, xptWin32Folder, null);
-    if (copyErr != 0)
-    {
-    	logComment("First Install:"+copyErr);
-    	return copyErr;
-    }
-</pre>
-<p>Una vez decidida la ubicación secundaria, el <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">registro de windows ha de ser actualizado</a> con la ruta de dicha ubicación para que futuros navegadores puedan recuperarla. Esto es realizado con el objeto <a href="es/XPInstall_API_Reference/WinReg_Object">WinReg</a> proporcionado por XPInstall. Todas las piezas quedan ensambladas en la plantilla mostrada a continuación.
-</p>
-<h3 id="Plantilla_XPInstall"> Plantilla XPInstall </h3>
-<p>Se ha mostrado <a href="es/Using_XPInstall_to_Install_Plugins/Install_script_template">una plantilla para un script de instalación</a> que quizá te gustaría abrir en otra pestaña o ventana. Dicho script de instalación hace lo siguiente:
-</p>
-<ul><li> Instala tanto el fichero DLL como el XPT en el directorio de plugins del navegador. El propio plugin es imaginario: MyPlugin. Sin embargo, las variables que determinan el nombre del plugin pueden ser modificadas fácilmente. Este fichero install.js supone que el software del plugin que va a ser instalado está compuesto por un fichero DLL y por otro XBT, lo cual no siempre es cierto. Muchos plugins pueden traer más de una DLL o quizá código nativo adicional. No obstante, es una suposición más que segura para la mayoría de los plugins, especialmente para <a class="external" href="http://www.macromedia.com/go/getflashplayerbutton/">el plugin Flash de Macromedia</a> compuesto por una única DLL (en Windows es npswf32.dll) y un único fichero XPT para script (llamado flashplayer.xpt).
-</li><li> Adicionalmente, instala el plugin en una ubicación secundaria en el ordenador del usuario. Concretamente, como muchos ficheros OCX (los controles ActiveX), se instala en un directorio especial dentro de C:\WINNT\System32, llamado C:\WINNT\System32\MyPlugin. XPInstall es capaz de determinar cuál es este directorio gracias a la llamada API <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a>. Hemos escrito nuestra propia función de JavaScript que contiene todo el código de la instalación secundaria (la función createSecondaryInstall()).
-</li><li> Y por último, escribe <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">las claves de registro requeridas en Windows</a>. Esto se hace a través de la función creada, llamada registerPLID().
-</li></ul>
-<p>Es cierto que este secript se centra en Windows, pero es fácil portarlo a cualquier otra plataforma. Quizá esto sea todavía más fácil, ya que ni en Linux ni en Mac OSX hay que trabajar con la tediosa manipulación del registro de Windows. La <a href="es/XPInstall_API_Reference/Install_Object/Methods/getFolder">API getFolder</a> proporciona suficientes "golosinas sintácticas" como para determinar otras ubicaciones del ordenador del usuario en distintas plataformas y sistemas operativos. Un único install.js es casi siempre capaz de ejecutarse en muchas plataformas diferentes.
-</p>
-<h3 id="Algunas_notas_sobre_la_instalaci.C3.B3n"> Algunas notas sobre la instalación </h3>
-<p>Esta sección comprende algunas de las notas clave sobre el envío de paquetes XPI, en particular: ¿cómo puede ser iniciada la descarga de un plugin vía XPI? ¿Y qué pasa con la desinstalación de plugins?
-</p>
-<h3 id="Ejecutar_una_descarga_XPInstall_con_un_script_autoejecutable"> Ejecutar una descarga XPInstall con un script autoejecutable </h3>
-<p>Un <a href="es/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts">script autoejecutable</a> es un trozo de JavaScript de una página web que puede iniciar automáticamente una descarga XPInstall. Esto puede estar condicionado al hecho de que los <a href="es/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts">scripts autodisparados</a> pueden detectar además el software que ya está instalado en el ordenador del usuario a través de XPInstall. Esta opción es útil para los sitios web porque:
-</p>
-<ul><li> Las páginas HTML y JavaScript ya poseen un modo de detectar qué plugins están instalados. Además, gracias al objeto <a href="es/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> el cual es accesible por las páginas web, se puede conocer la última versión del paquete XPI instalado.
-</li><li> El objeto <a href="es/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> también puede iniciar una descarga XPI automáticamente. Esto es útil ya que los usuarios pueden visitar un sitio web y, de forma opcional, obtener el software del servidor (mediante flujo de datos) ofrecido al usuario por la página web.
-</li></ul>
-<p>Los scripts autoejecutables son la forma recomendada de iniciar las descargas XPInstall.
-</p>
-<h3 id="Ejecutar_una_descarga_XPInstall_desde_HTML"> Ejecutar una descarga XPInstall desde HTML </h3>
-<p>De manera análoga a como son inicializadas las descargas SmartUpdate por el atributo pluginurl de la etiqueta <code>&lt;embed&gt;</code>, las descargas XPInstall pueden ser también iniciadas por las etiquetas HTML que invocan a plugins, sobre todo a través del atributo <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#adef-codebase-OBJECT"><code>codebase</code></a> de la etiqueta <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-OBJECT"><code>&lt;object&gt;</code></a>. Esto es análogo a cómo Internet Explorer descarga ficheros CAB referenciados por el atributo <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#adef-codebase-OBJECT"><code>codebase</code></a> de la etiqueta <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-OBJECT"><code>&lt;object&gt;</code></a>. A continuación se muestra un ejemplo de una hipotética etiqueta <code>&lt;object&gt;</code> usada para invocar a MyPlugin (una aplicación imaginaria):
-</p>
-<pre>	&lt;object id="thePlugin" type="application/x-myplugin" width="100"
-	height="100" codebase="http://location/XPI/myplugin.xpi"&gt;
-
-&lt;param .... &gt;
-</pre>
-<p>En el caso anterior, el atributo <code>codebase</code> apunta directamente al paquete XPI y si el navegador no pudiese identificar ningún plugin para manejar el tipo MIME (imaginario) application/x-myplugin, entonces descargaría el paquete XPI.
-</p><p><b>Nota:</b> Los paquetes XPI (los ficheros con extensión xpi) utilizan el tipo MIME application/x-xpinstall. Al servir los paquetes XPI a los clientes desde el servidor, asegúrate de que los paquetes son servidos con este tipo MIME en las cabeceras HTTP. Asocia el tipo MIME application/x-xpinstall con los paquetes XPI.
-</p>
-<h3 id="El_problema_de_la_desinstalaci.C3.B3n"> El problema de la desinstalación </h3>
-<p>En su versión actual, XPInstall no posee una tecnología de desinstalación. Ya que sólo puede ser usado para instalar ficheros o para servir de transporte a instaladores de código nativo para el cliente, sería una buena idea escribir un desinstalador de código nativo para el cliente, si es procedente. XPInstall puede por tanto ser un "agente de transporte" para llevar el software del ejecutable y con éste la lógica de instalación y desinstalación que será manejada por él, el cual puede crear ficheros y entradas de registro además de limpiarlo todo después de eliminarlo.
-</p>
-<div class="originaldocinfo">
-<h3 id="Informaci.C3.B3n_original_del_documento"> Información original del documento </h3>
-<ul><li> Author(s): Arun K. Ranganathan, Netscape Communications
-</li><li> Last Updated Date: 05 Aug 2002
-</li><li> Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.
-</li><li> Link: <a class=" external" href="http://devedge-temp.mozilla.org/viewsource/2002/xpinstall-guidelines/index_en.html">http://devedge-temp.mozilla.org/view.../index_en.html</a>
-</li></ul>
-</div>
diff --git a/files/es/using_the_w3c_dom_level_1_core/index.html b/files/es/using_the_w3c_dom_level_1_core/index.html
deleted file mode 100644
index 6c5f14c025..0000000000
--- a/files/es/using_the_w3c_dom_level_1_core/index.html
+++ /dev/null
@@ -1,93 +0,0 @@
----
-title: Using the W3C DOM Level 1 Core
-slug: Using_the_W3C_DOM_Level_1_Core
-tags:
-  - DOM
-  - NeedsTranslation
-  - NeedsUpdate
-  - TopicStub
-translation_of: Web/API/Document_object_model/Using_the_W3C_DOM_Level_1_Core
----
-<p>The W3C's DOM Level 1 Core is a powerful object model for changing the content tree of documents. It is supported in all major browsers including Mozilla Firefox and Microsoft Internet Explorer. It is a powerful base for scripting on the web.</p>
-
-<h2 id="What_is_a_content_tree.3F" name="What_is_a_content_tree.3F">What is a content tree?</h2>
-
-<p>Many HTML authors may think of HTML as something flat -- a bunch of text with tags in the middle. However, it is something much more than that. Any HTML document (or for that matter any SGML document or XML document) is a tree structure. For example, the following document and tree structure are similar (although not identical -- see the notes on <a href="/en-US/docs/Whitespace_in_the_DOM" title="Whitespace_in_the_DOM">whitespace in the DOM</a>):</p>
-
-<pre class="brush: html">&lt;html&gt;
-&lt;head&gt;
-  &lt;title&gt;My Document&lt;/title&gt;
-&lt;/head&gt;
-&lt;body&gt;
-  &lt;h1&gt;Header&lt;/h1&gt;
-  &lt;p&gt;Paragraph&lt;/p&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p><img alt="image:Using_the_W3C_DOM_Level_1_Core-doctree.jpg" class="internal" src="/@api/deki/files/415/=Using_the_W3C_DOM_Level_1_Core-doctree.jpg"></p>
-
-<p>When Mozilla parses a document, it builds a content tree and then uses it to display the document.</p>
-
-<p>The terms used to describe trees show up often in the DOM Level 1 Core. Each of the boxes I drew in the tree above is a node in the tree. The line above a node expresses a parent-child relationship: the node on top is the parent, and the node on the bottom is the child. Two children of the same parent are therefore siblings. Similarly, one can refer to ancestors and descendants. (Cousins are too messy, though.)</p>
-
-<h2 id="What_does_the_DOM_Level_1_Core_let_me_do.3F" name="What_does_the_DOM_Level_1_Core_let_me_do.3F">What does the DOM Level 1 Core let me do?</h2>
-
-<p>The W3C DOM Level 1 allows you to change the content tree <em>any way you want</em>. It is powerful enough to build any HTML document from scratch. It allows authors to change anything in the document from script, at any time. The easiest way for web page authors to change the DOM dynamically is using JavaScript. In JavaScript, the document is accessible the same way it has been in older browsers: from the <code>document</code> property of the global object. This <code>document</code> object implements the <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#i-Document">Document interface</a> from the W3C's DOM Level 1 spec.</p>
-
-<h2 id="A_simple_example" name="A_simple_example">A simple example</h2>
-
-<p>Suppose the author wants to take the above document and change the contents of the header, and write two paragraphs instead of one. The following script would do the job:</p>
-
-<h3 id="HTML_Content">HTML Content</h3>
-
-<pre class="brush: html">&lt;body&gt;
-&lt;input type="button" value="Change this document." onclick="change()"&gt;
-&lt;h2&gt;Header&lt;/h2&gt;
-&lt;p&gt;Paragraph&lt;/p&gt;
-&lt;/body&gt;<span>
-</span></pre>
-
-<h3 id="JavaScript_Content">JavaScript Content</h3>
-
-<pre class="brush: js"><span>  function change() {
-    // document.getElementsByTagName("H2") returns a NodeList of the &lt;h2&gt;
-    // elements in the document, and the first is number 0:
-
-    var header = document.getElementsByTagName("H2").item(0);
-    // the firstChild of the header is a Text node:
-    header.firstChild.data = "A dynamic document";
-    // now the header is "A dynamic document".
-
-    var para = document.getElementsByTagName("P").item(0);
-    para.firstChild.data = "This is the first paragraph.";
-
-    // create a new Text node for the second paragraph
-    var newText = document.createTextNode("This is the second paragraph.");
-    // create a new Element to be the second paragraph
-    var newElement = document.createElement("P");
-    // put the text in the paragraph
-    newElement.appendChild(newText);
-    // and put the paragraph on the end of the document by appending it to
-    // the BODY (which is the parent of para)
-    para.parentNode.appendChild(newElement);
-  }</span></pre>
-
-<p>{{ EmbedLiveSample('A_simple_example', 800, 300) }}</p>
-
-<p>You can see this script as <a class="internal" href="/@api/deki/files/2866/=example.html" title="/@api/deki/files/2866/=example.html">a complete example</a>.</p>
-
-<h2 id="How_can_I_learn_more.3F" name="How_can_I_learn_more.3F">How can I learn more?</h2>
-
-<p>Now that you are familiar with the basic concepts of the DOM, there is a document explaining the <a href="/en-US/docs/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces" title="Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces">DOM Level 1 fundamental methods</a>. It is the follow-up to this document.</p>
-
-<p>See also the <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html">DOM Level 1 Core specification</a> from the W3C. It's a reasonably clear spec, although it is formal. The main thing that's useful to authors is the description of the different DOM objects and all their properties and methods. Also see our <a href="/en-US/docs/DOM" title="DOM">other DOM documentation</a>.</p>
-
-<div class="originaldocinfo">
-<p><strong>Original Document Information</strong></p>
-
-<ul>
- <li>Author(s): L. David Baron &lt;dbaron at dbaron dot org&gt;</li>
- <li>Copyright Information: © 1998-2005 by individual mozilla.org contributors; content available under a <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Creative Commons license</a></li>
-</ul>
-</div>
diff --git a/files/es/uso_del_núcleo_del_nivel_1_del_dom/index.html b/files/es/uso_del_núcleo_del_nivel_1_del_dom/index.html
deleted file mode 100644
index 1e5b13b9a6..0000000000
--- a/files/es/uso_del_núcleo_del_nivel_1_del_dom/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: Uso del núcleo del nivel 1 del DOM
-slug: Uso_del_núcleo_del_nivel_1_del_DOM
-tags:
-  - DOM
-  - Todas_las_Categorías
----
-<p>El núcleo del DOM nivel 1 del W3C es un potente modelo de objetos para cambiar el árbol de contenidos de los documentos. Está soportado en Mozilla (en el cual está basado Netscape 6) y (la mayor parte de) MSIE 5.0 para Windows. Es una potente base para la futura programación de la web.</p>
-
-<h3 id=".C2.BFQu.C3.A9_es_un_.C3.A1rbol_de_contenidos.3F" name=".C2.BFQu.C3.A9_es_un_.C3.A1rbol_de_contenidos.3F">¿Qué es un árbol de contenidos?</h3>
-
-<p>Muchos de los que trabajan con HTML pueden pensar que HTML es algo plano, un montón de texto con etiquetas en medio. Sin embargo es mucho más que eso. Todo documento HTML (y por extensión todo documento SGML o XML) posee una estructura en árbol. Por ejemplo, el siguiente documento y la estructura en árbol son similares (aunque no idénticas; ver anotaciones en <a href="es/The_DOM_and_JavaScript">espacios en blanco en DOM</a>):</p>
-
-<pre class="eval">&lt;html&gt;
-&lt;head&gt;
-  &lt;title&gt;Mi documento&lt;/title&gt;
-&lt;/head&gt;
-&lt;body&gt;
-  &lt;h1&gt;Cabecera&lt;/h1&gt;
-  &lt;p&gt;Párrafo&lt;/p&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-
-
-<p>Cuando analiza un documento, Mozilla construye un árbol de contenidos y luego lo utiliza para mostrar el documento.</p>
-
-<p>Los términos usados para describir los árboles show up frecuentemente en el núcleo del DOM nivel 1. Cada caja dibujada en el árbol de arriba es un nodo en el árbol. La línea sobre cada nodo expresa una relación padre-hijo: el nodo superior es el padre y el inferior, el hijo. Dos hijos del mismo padre son por tanto hermanos. Similarmente, uno puede referirse a sus ancestros y descendientes (incluso a los nodos primos, aunque es más complicado de explicar).</p>
-
-<h3 id=".C2.BFQu.C3.A9_me_permite_hacer_el_Nivel_1_del_DOM.3F" name=".C2.BFQu.C3.A9_me_permite_hacer_el_Nivel_1_del_DOM.3F">¿Qué me permite hacer el Nivel 1 del DOM?</h3>
-
-<p>El nivel 1 del DOM del W3C te permite cambiar el árbol de contenidos<em>como te de la gana</em> . Es lo suficientemente poderoso como para construir cualquier documento HTML a partir de la nada. Permite a los desarrolladores cambiar cualquier cosa en el documento desde un script, en cualquier momento. La forma más fácil para desarrolladores de páginas web para cambiar el DOM dinámicamente es usando JavaScript. En JavaScript, el documento es accesible en el mismo modo que lo era en los viejos navegadores: desde la propiedad global <code>document</code>. El objeto <code>document</code> implementa el <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#i-Document">interfaz de documento</a> del nivel 1 de la especificación para el DOM del W3C.</p>
-
-<h3 id="Un_ejemplo_simple" name="Un_ejemplo_simple">Un ejemplo simple</h3>
-
-<p>Supongamos que el autor del documento de arriba coge y cambia los contenidos de la cabecera y escribe dos párrafos en lugar de uno. El siguiente script debería hacer lo mismo (Resaltado de sintaxis: <code><span class="highlightred">palabras reservadas Javascript</span></code>, <code><span class="highlightblue">métodos y propiedades DOM</span></code> predefinidos y <code><span class="highlightgreen">comentarios en Javascript</span></code>):</p>
-
-<pre class="eval"><span class="highlightgreen">
-// document.getElementsByTagName("H1") devuelve un NodeList de los
-// elementos H1 del documento; el primer elemento tiene índice 0:
-</span>
-<span class="highlightred">var</span> header = <span class="highlightblue">document.getElementsByTagName</span>("H1").<span class="highlightblue">item</span>(0);
-<span class="highlightgreen">
-// La propiedad firstChild de la cabecera contiene un nodo de texto y su propiedad
-// data contiene el texto del nodo:
-</span>
-header.<span class="highlightblue">firstChild.data</span> = "Un documento dinámico";
-<span class="highlightgreen">
-// Ahora la cabecera es "Un documento dinámico".
-// Obtenemos el primer elemento P del documento de la misma forma:
-</span>
-<span class="highlightred">var</span> para = <span class="highlightblue">document.getElementsByTagName</span>("P").<span class="highlightblue">item</span>(0);
-<span class="highlightgreen">
-// y cambiamos su texto:
-</span>
-para.<span class="highlightblue">firstChild.data = "Este es el primer párrafo.";</span>
-<span class="highlightgreen">
-// creamos un nodo de texto para el segundo párrafo
-</span>
-<span class="highlightred">var</span> newText = <span class="highlightblue">document.createTextNode</span>("This is the second paragraph.");
-<span class="highlightgreen">
-// creamos un nuevo elemento que sea el segundo párrafo
-</span>
-<span class="highlightred">var</span> newElement = <span class="highlightblue">document.createElement</span>("P");
-<span class="highlightgreen">
-// ponemos el texto en el párrafo
-</span>
-newElement.<span class="highlightblue">appendChild</span>(newText);
-<span class="highlightgreen">
-// y ponemos el párrafo al final del documento anexándolo
-// a la etiqueta BODY (que es el padre del párrafo
-</span>
-para.<span class="highlightblue">parentNode.appendChild</span>(newElement);
-</pre>
-
-<p>Puedes ver este script en acción en el <a class="external" href="http://www.mozilla.org/docs/dom/technote/intro/example.html">ejemplo completo</a>.</p>
-
-<h3 id=".C2.BFC.C3.B3mo_puedo_aprender_m.C3.A1s.3F" name=".C2.BFC.C3.B3mo_puedo_aprender_m.C3.A1s.3F">¿Cómo puedo aprender más?</h3>
-
-<p>Una vez familiarizado con los conceptos básicos del DOM, puedes leer el documento que explica los <a href="es/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces">métodos fundamentales del DOM nivel 1</a>. Es lo que sigue a este documento.</p>
-
-<p>Véase también la <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html">especificación del núcleo de DOM nivel 1</a> del W3C. Es una especificación razonablemente clara a pesar de ser una especificación formal. Lo más útil para los desarrolladores es la descripción de los diferentes objetos del DOM y todas sus propiedades y métodos. Véase también nuestra <a href="es/DOM">otra documentación del DOM</a>.</p>
-
-<div class="originaldocinfo">
-<p><strong>Original Document Information</strong></p>
-
-<ul>
- <li>Author(s): L. David Baron &lt;dbaron at dbaron dot org&gt;</li>
- <li>Copyright Information: © 1998-2005 by individual mozilla.org contributors; content available under a <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Creative Commons license</a></li>
-</ul>
-</div>
diff --git a/files/es/vigilar_plugins/index.html b/files/es/vigilar_plugins/index.html
deleted file mode 100644
index 2e5c6a0863..0000000000
--- a/files/es/vigilar_plugins/index.html
+++ /dev/null
@@ -1,110 +0,0 @@
----
-title: Vigilar plugins
-slug: Vigilar_plugins
-tags:
-  - Firefox 3
-  - Plugins
-  - Todas_las_Categorías
----
-<p>{{ Fx_minversion_header(3) }}
-</p>
-<h3 id="Resumen" name="Resumen">Resumen</h3>
-<p>Ya está disponible un nuevo componente de los plugin que permite saber cuanto tiempo le toma a un determinado plugin (p.e. Adobe Flash) ejecutar sus llamadas. Este componente presenta el runtime del plugin usando el <a href="es/NsIObserverService">observer service</a> a cualquiera que reciba la notificación. Este artículo cuenta cómo los desarrolladores pueden hacer uso de esta facilidad.
-</p><p><br>
-</p>
-<h3 id="Datos_del_Runtime" name="Datos_del_Runtime">Datos del Runtime</h3>
-<p>La información del runtime presentada es siempre en fracciones de segundo. Ya que el componente mide el tiempo que le toma a las llamadas de bloque del plugin, el valor incluye tanto el tiempo de CPU, el tiempo de espera entre asignaciones de tiempo de CPU al proceso, como cualquier tiempo de e/s del disco. Es técnicamente incorrecto decir que el runtime es una medida del uso de CPU, sin embargo, es una buena representación de los recursos totales consumidos por el plugin.
-</p>
-<h3 id="Uso" name="Uso">Uso</h3>
-<p>Para hacer uso del nuevo componente, debes registrarte para recibir las notificaciones del runtime usando el <a href="es/NsIObserverService">observer service</a>. El tópico de la notificación es <code>experimental-notify-plugin-call</code>. Si eres novato con el servicio de observación de Mozilla, querrás familiarizarte con él antes de proseguir. Puedes encontrar información acerca del servicio de observación <a href="es/NsIObserverService"> aquí</a> y <a href="es/NsIObserver"> aquí</a>.
-</p><p>Debajo hay un número de conversaciones sobre JavaScript que podrían ser útiles para desarrolladores que quieran usar esta facilidad:
-</p>
-<h4 id="Registro" name="Registro">Registro</h4>
-<p>Para registrase en el servicio de notificaciones con el observador debes crear una clase con un método <code>observe</code> que recibe tres parámetros (<code>subject</code>, <code>topic</code> y <code>data</code>) así como un método <code>register</code> que contiene el siguiente código:
-</p><p><br>
-<code>
-</code></p>
-<pre class="eval">var observerService = Components.classes["@mozilla.org/observer-service;1"]
-                        .getService (Components.interfaces.nsIObserverService);
-observerService.addObserver(this, "experimental-notify-plugin-call", false);
-</pre>
-<p>
-</p><p><br>
-</p>
-<h4 id="Observando" name="Observando">Observando</h4>
-<p>Como hemos dicho arriba, para especificar lo que quieres que se haga cuando llega una notificación, tu clase debe tener un método <code>observe</code>, que recibe tres parámetros (<code>subject</code>, <code>topic</code> y <code>data</code>). El <code>topic</code> contiene el tópico de la notificación - <code>experimental-notify-plugin-call</code> en este caso, <code>data</code> es el runtime en mili segundos y <code>subject</code> es siempre <code>null</code> y no debería usarse.
-</p><p>Aquí hay un ejemplo que muestra el runtime en una caja de alerta al usuario si el runtime excede medio segundo de longitud:
-</p><p><code>
-</code></p>
-<pre class="eval"> observe: function(subject, topic, data) {
-   if (topic == "experimental-notify-plugin-call" ) {
-     if (data &gt; 0.500) {
-       alert("Runtime is: " + data);
-     }
-   }
- }
-</pre>
-<p>
-</p><p><b>NOTA: Esto es un ejemplo simplificado y se desaconseja el uso de <code>alert()</code> ya que el componente puede enviar cientos de notificaciones por segundo y puede, potencialmente, causar la parada del navegador si se abre un número excesivo de cajas de alerta.</b>
-</p><p>Téngase también en cuenta que en el ejemplo anterior una sentencia if primero comprueba que el tópico de la notificación es el correcto. Esto es útil en casos en los que la clase se registra para recibir notificaciones de más de un tópico en el servicio de observación.
-</p>
-<h4 id="Limpieza" name="Limpieza">Limpieza</h4>
-<p>Para des-registrar tu clase en el servicio de observación - cuando ya no quieres escuchar las notificaciones del runtime - tu clase debe incluir un método <code>unregister</code> que contenga el siguiente código:
-</p><p><code>
-</code></p>
-<pre class="eval">var observerService = Components.classes["@mozilla.org/observer-service;1"]
-                       .getService(Components.interfaces.nsIObserverService);
-observerService.removeObserver(this, "experimental-notify-plugin-call");
-</pre>
-<p>
-</p><p><br>
-</p>
-<h4 id="Esquema_de_una_clase_para_el_observador" name="Esquema_de_una_clase_para_el_observador">Esquema de una clase para el observador</h4>
-<p>A continuación presentamos un esquema de una clase que puedes usar para escuchar el servicio de notificaciones:
-</p><p><code>
-</code></p>
-<pre class="eval"> function PluginObserver() {
-   this.registered = false;
-   this.register();	// se cuida de registrar esta clase en el servicio de observación como un observador para el servicio de notificación
- }
-
- PluginWatcherObserver.prototype = {
-   observe: function(subject, topic, data) {
-
-     if (topic == "experimental-notify-plugin-call") //En caso de que tu clase esté registrada para escuchar otros tópicos
-       //Esto es ejecutado cada vez que llega una notificación
-       // --AQUÍ VA TU CÓDIGO--
-     }
-
-
-   },
-   //Se cuida de registrar el observador para el tópico "experimental-notify-plugin-call"
-   register: function() {
-     if (this.registered == false) { //Este evento previene el doble registro -- ¡algo que quieres evitar!
-       var observerService = Components.classes["@mozilla.org/observer-service;1"]
-                                       .getService(Components.interfaces.nsIObserverService);
-       observerService.addObserver(this, "experimental-notify-plugin-call", false);
-       this.registered = true;
-     }
-   },
-   //Des-registra del servicio de observación
-   unregister: function() {
-     if (this.registered == true) {
-       var observerService = Components.classes["@mozilla.org/observer-service;1"]
-                                       .getService(Components.interfaces.nsIObserverService);
-       observerService.removeObserver(this, "experimental-notify-plugin-call");
-       this.registered = false;
-     }
-   }
- }
-</pre>
-<p>
-</p><p><br>
-</p>
-<h3 id="Recursos_adicionales" name="Recursos_adicionales">Recursos adicionales</h3>
-<p>Más información sobre el servicio de observación:
-</p>
-<ul><li> <a href="es/NsIObserverService">nsIObserverService</a>
-</li><li> <a href="es/NsIObserver">nsIObserver</a>
-</li></ul>
-{{ languages( { "ja": "ja/Monitoring_plugins" } ) }}
diff --git a/files/es/web/accesibilidad/comunidad/index.html b/files/es/web/accesibilidad/comunidad/index.html
deleted file mode 100644
index 34acce8e6e..0000000000
--- a/files/es/web/accesibilidad/comunidad/index.html
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: Comunidad
-slug: Web/Accesibilidad/Comunidad
-tags:
-  - Accesibilidad
-  - Todas_las_Categorías
-translation_of: Web/Accessibility/Community
----
-<p> </p>
-<p>Si conoces alguna lista de correo, grupo de noticias, foro, o comunidad relacionada con la
- <i>
-  accesibilidad</i>
- que pueda ser de interés. Por favor, pon aquí un enlace.</p>
-<h3 id="Mozilla" name="Mozilla">Mozilla</h3>
-<ul>
- <li>La
-  <i>
-   Accesibilidad</i>
-  en la comunidad Mozilla... en inglés</li>
-</ul>
-<p>{{ DiscussionList("support-accessibility", "mozilla.support.accessibility") }}</p>
-<h3 id="Listas_de_correo" name="Listas_de_correo">Listas de correo</h3>
-<ul>
- <li><a class="external" href="http://es.groups.yahoo.com/group/accesoweb">Accesoweb</a> Lista en castellano sobre problemas y soluciones de diseño accesible para la Red de la <b>Fundación Sidar</b>.</li>
-</ul>
-<h3 id="Foros" name="Foros">Foros</h3>
-<ul>
- <li> </li>
-</ul>
-<p> </p>
-<h3 id="Bit.C3.A1coras" name="Bit.C3.A1coras">Bitácoras</h3>
-<ul>
- <li><a class="external" href="http://accesibilidadweb.blogspot.com/">Accesibilidad, Usabilidad y Estándares Web</a> Este es un blog dedicado a todos los temas relacionados con la accesibilidad web, usabilidad y estándares web.</li>
-</ul>
-<h3 id="Wikis" name="Wikis">Wikis</h3>
-<ul>
- <li> </li>
-</ul>
-<p> </p>
-<h3 id="Otros_Sitios" name="Otros_Sitios">Otros Sitios</h3>
-<ul>
- <li><a class="external" href="http://www.w3.org/WAI/">El sitio del WAI (en)</a></li>
-</ul>
-<p><span class="comment">categorías</span></p>
diff --git a/files/es/web/accesibilidad/index.html b/files/es/web/accesibilidad/index.html
deleted file mode 100644
index ea30623a6d..0000000000
--- a/files/es/web/accesibilidad/index.html
+++ /dev/null
@@ -1,93 +0,0 @@
----
-title: Accesibilidad
-slug: Web/Accesibilidad
-tags:
-  - Accesibilidad
-  - Todas_las_Categorías
-translation_of: Web/Accessibility
----
-<div class="callout-box"><strong><a class="external" href="http://www.w3c.es/Divulgacion/Guiasbreves/Accesibilidad">Guía Breve de Accesibilidad Web</a></strong><br>
-Las cuatro cosas básicas y un montón de buenos enlaces.</div>
-
-<p>La <strong>accesibilidad web </strong>(a menudo abreviada como <strong>A11y)</strong> se refiere a la posibilidad de acceso a los diferentes sitios web y a todo su contenido por todas las personas, independientemente de sus limitaciones fìsicas (discapacidad) o las derivadas del contexto de uso (tecnológicas o ambientales).{{ Ref(1) }}</p>
-
-<p><font><font>Para muchas personas, la tecnología facilita las cosas. </font><font>Para las personas con algun tipo de discapacidad, la tecnología hace las cosas posibles. </font><font>Accesibilidad significa desarrollar contenido para que sea lo más accesible posible sin importar las habilidades físicas y cognitivas de un individuo y sin importar cómo acceda a la web.</font></font></p>
-
-<p><font><font>" </font></font><strong><font><font>La Web está diseñada fundamentalmente para que funcione para todas las personas</font></font></strong><font><font> , independientemente de su hardware, software, idioma, cultura, ubicación, capacidad física o mental.</font></font></p>
-
-<p>El máximo organismo dentro de la jerarquía de Internet que se encarga de promover la accesibilidad es el <a class="external" href="http://www.w3c.es">W3C</a>, en especial su grupo de trabajo <a class="external" href="http://www.w3c.es/Traducciones/es/WAI/intro/accessibility">WAI</a>.</p>
-
-<table class="topicpage-table">
- <tbody>
-  <tr>
-   <td>
-    <h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"><a href="/Special:Tags?tag=Accesibilidad&amp;language=es" title="Special:Tags?tag=Accesibilidad&amp;language=es">Documentación</a></h4>
-
-    <dl>
-     <dt><a href="/es/Introducci%C3%B3n_a_la_Accesibilidad_Web_(externo)" title="es/Introducción_a_la_Accesibilidad_Web_(externo)">Introducción a la Accesibilidad Web (externo)</a></dt>
-     <dd>WAI: estrategias, pautas, recursos para hacer la Web accesible a personas con discapacidad.</dd>
-    </dl>
-
-    <dl>
-     <dt><a href="/es/Pautas_de_Accesibilidad_al_Contenido_en_la_Web_1.0_(externo)" title="es/Pautas_de_Accesibilidad_al_Contenido_en_la_Web_1.0_(externo)">Pautas de Accesibilidad al Contenido en la Web 1.0 (externo)</a></dt>
-     <dd>"Estas pautas explican cómo hacer accesibles los contenidos de la Web a personas con discapacidad."</dd>
-    </dl>
-
-    <dl>
-     <dt><a class="external" href="http://www.discapnet.es/web_accesible/tecnicas/WCAG10-TECHS-20001106_es.html">Técnicas para las Pautas de Accesibilidad al Contenido en la Web 1.0</a></dt>
-     <dd>Este documento es el punto de acceso a una serie de documentos relacionados que describen técnicas para satisfacer los requisitos definidos en las "Pautas de Accesibilidad al Contenido en la Web 1.0"</dd>
-    </dl>
-
-    <dl>
-     <dt><a class="external" href="http://www.discapnet.es/web_accesible/WCAG-REC-fact.html">FAQ sobre las "Pautas de Accesibilidad al Contenido en la Web 1.0"</a></dt>
-     <dd>Esta página de preguntas frecuentes proporciona información sobre la recomendación W3C WACG 1.0. Es una traducción de <em>Fact Sheet for "Web Content Accessibility Guidelines 1.0"</em></dd>
-    </dl>
-
-    <dl>
-     <dt></dt>
-     <dd>When authored according to these guidelines, XUL is capable of generating accessible user interfaces. Coders, reviewers, designers and QA engineers should be familiar with these guidelines.</dd>
-    </dl>
-
-    <p><span class="alllinks"><a href="/Special:Tags?tag=Accesibilidad&amp;language=es" title="Special:Tags?tag=Accesibilidad&amp;language=es">Ver más...</a></span></p>
-   </td>
-   <td>
-    <h4 id="Comunidad" name="Comunidad">Comunidad</h4>
-
-    <ul>
-     <li>En la comunidad Mozilla... en inglés</li>
-    </ul>
-
-    <p>{{ DiscussionList("support-accessibility", "mozilla.support.accessibility") }}</p>
-
-    <p><span class="alllinks"><a href="/es/Accesibilidad/Comunidad" title="es/Accesibilidad/Comunidad">Ver más...</a></span></p>
-
-    <h4 id="Herramientas" name="Herramientas">Herramientas</h4>
-
-    <ul>
-     <li><a href="/es/HERA_(externo)" title="es/HERA_(externo)">HERA, test de accesibilidad</a></li>
-     <li><a href="/es/TAW_(externo)" title="es/TAW_(externo)">TAW, test de accesibilidad </a></li>
-     <li><a class="external" href="http://www.accesible.com.ar/examinator/">Test de accesibilidad eXaminator</a></li>
-     <li><a class="external" href="http://www.e-kaw.org/index.jsp">kit de accesibilidad web</a></li>
-     <li><a class="external" href="https://addons.mozilla.org/es/firefox/addon/claws/">Claws - emulador de lector de pantalla</a></li>
-    </ul>
-
-    <p><span class="alllinks"><a href="/Special:Tags?tag=Accesibilidad:Herramientas&amp;language=es" title="Special:Tags?tag=Accesibilidad:Herramientas&amp;language=es">Ver más...</a></span></p>
-
-    <h4 id="Temas_relacionados" name="Temas_relacionados">Temas relacionados</h4>
-
-    <dl>
-     <dd>· <a href="/es/Desarrollo_Web" title="es/Desarrollo_Web">Desarrollo Web</a> · <a href="/es/Desarrollando_Mozilla" title="es/Desarrollando_Mozilla">Desarrollando Mozilla</a> ·</dd>
-    </dl>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<hr>
-<p><small>{{ Note(1) }} <a class="external" href="http://es.wikipedia.org/wiki/Accesibilidad_web">Definición de la Wikipedia</a> </small></p>
-
-<p><span class="comment">Categorias</span></p>
-
-<p><span class="comment">Interwiki Language Links</span></p>
-
-<p>{{ languages( { "en": "en/Accessibility", "fr": "fr/Accessibilit\u00e9", "ja": "ja/Accessibility", "pl": "pl/Dost\u0119pno\u015b\u0107" } ) }}</p>
diff --git a/files/es/web/accesibilidad/understanding_wcag/etiquetas_de_texto_y_nombres/index.html b/files/es/web/accesibilidad/understanding_wcag/etiquetas_de_texto_y_nombres/index.html
deleted file mode 100644
index ffaade2cb1..0000000000
--- a/files/es/web/accesibilidad/understanding_wcag/etiquetas_de_texto_y_nombres/index.html
+++ /dev/null
@@ -1,266 +0,0 @@
----
-title: Etiquetas de texto y nombres
-slug: Web/Accesibilidad/Understanding_WCAG/Etiquetas_de_texto_y_nombres
-tags:
-  - Accesibilidad
-  - Etiquetas de texto
-  - WCAG
-translation_of: Web/Accessibility/Understanding_WCAG/Text_labels_and_names
----
-<p><span class="seoSummary">Hay muchas situaciones en las cuales un control, dialogo o cualquier otra característica de un sitio web deberían recibir un nombre o etiqueta descriptiva para permitir a los usuarios de técnologías asistivas entender cual es su propósito y ser capaz de entenderlo y operarlo correctamente.</span> Hay un número de diferentes tipos de problemas en esta categoría, dependientes del contexto, y cada uno tiene su propia solución. Los diferentes problemas y soluciones son discutidas en las secciones posteriores.</p>
-
-<h2 id="Utilizar_el_atributo_alt_para_etiquetar_elementos_que_ocupen_un_área_que_tiene_el_atributo_href">Utilizar el atributo alt para etiquetar elementos que ocupen un área que tiene el atributo href</h2>
-
-<p>En mapas de imágenes, cada elemento {{htmlelement("area")}} con un atributo <code>alt</code> definiendo un nombre que describa el recurso al que enlaza el area. Fallar al hacer eso provoca que un mapa de imagen sea difícil de usar para usuarios que usen tecnología asistiva — ellos necesitan texto alternativo para ser capaces de entender el propósito de una imagen.</p>
-
-<h3 id="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente ejemplo muestra un simple mapa de imagen (tomada de <a href="https://www.w3.org/TR/WCAG20-TECHS/H24.html">H24: Providing text alternatives for the area elements of image maps</a>):</p>
-
-<pre>&lt;img src="welcome.gif" usemap="#map1"
-    alt="Areas in the library. Select an area for
-more information on that area." /&gt;
-&lt;map id="map1" name="map1"&gt;
-  &lt;area shape="rect" coords="0,0,30,30"
-    href="reference.html" alt="Reference" /&gt;
-  &lt;area shape="rect" coords="34,34,100,100"
-    href="media.html" alt="Audio visual lab" /&gt;
-&lt;/map&gt;</pre>
-
-<p>Ver la <a href="/en-US/docs/Web/HTML/Element/area">página de referencia del elemento</a> <a href="/en-US/docs/Web/HTML/Element/area"><code>&lt;area&gt;</code></a> para unu ejemplo interactivo.</p>
-
-<h3 id="Ver_también">Ver también</h3>
-
-<ul>
- <li>{{htmlelement("area")}}</li>
- <li><a href="https://www.w3.org/TR/WCAG20-TECHS/H24.html">H24: Providing text alternatives for the area elements of image maps</a></li>
-</ul>
-
-<h2 id="Los_diálogos_deberían_ser_etiquetados">Los diálogos deberían ser etiquetados</h2>
-
-<p>Para cualquier contenedor cuyo contenido actue como una caja de diálogo (por ejemplo, un modal preguntando al usuario realizar una elección o responder a una acción siendo tomada), debe tener una etiqueta descriptiva o nombre, para que la tecnología asistiva le permita al usuario descrubir fácilmente cual es su propósito.</p>
-
-<p>Una caja de diálogo es generalmente denominada con un ARIA <code><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/dialog_role">role="dialog"</a></code> o <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role">role="alertdialog"</a></code>; se puede usar tanto el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code> o <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a></code> para proporcionar una etiqueta.</p>
-
-<h3 id="Ejemplos_2">Ejemplos</h3>
-
-<p>El siguiente ejemplo muestra una caja de dialogo sencilla, definida como <code>role="dialog"</code> y etiquetada con <code>aria-labelledby</code>.</p>
-
-<pre>&lt;div role="dialog" aria-labelledby="dialog1Title" aria-describedby="dialog1Desc"&gt;
-  &lt;h2 id="dialog1Title"&gt;Your personal details were successfully updated&lt;/h2&gt;
-  &lt;p id="dialog1Desc"&gt;You can change your details at any time in the user account section.&lt;/p&gt;
-  &lt;button&gt;Close&lt;/button&gt;
-&lt;/div&gt;</pre>
-
-<p>Si la caja de diálogo no tiene un encabezado, se puede usar <code>aria-label</code> para contener la etiqueta de texto:</p>
-
-<pre>&lt;div role="dialog" aria-label="Personal details updated confirmation"&gt;
-  &lt;p&gt;Your personal details were successfully updated. You can
-    change your details at any time in the user account section.&lt;/p&gt;
-  &lt;button&gt;Close&lt;/button&gt;
-&lt;/div&gt;</pre>
-
-<h3 id="Ver_también_2">Ver también</h3>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/dialog_role">role="dialog"</a></code></li>
- <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role">role="alertdialog"</a></code></li>
- <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code></li>
- <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a></code></li>
- <li><a href="https://www.w3.org/TR/wai-aria-1.2/#dialog">WAI-ARIA: dialog role</a></li>
- <li><a href="https://www.w3.org/TR/wai-aria-practices/#dialog_roles_states_props">Dialog authoring practices</a></li>
-</ul>
-
-<h2 id="Los_documentos_deben_tener_un_título">Los documentos deben tener un título</h2>
-
-<p>Es importante que cada documento HTML, incluya un elemento {{htmlelement("title")}} que describa el propósito de la página. Una técnica común de navegación para usuarios que usan tecnologías asistivas es inferir el contenido de la página leyendo su título. Si no hay título disponible, tienen que navegar por la página para determinar su contenido, lo cual puede ser un proceso largo y confuso.</p>
-
-<h3 id="Ejemplos_3">Ejemplos</h3>
-
-<p>El título para el artículo de refencia sobre el elemento {{htmlelement("title")}} es como sigue:</p>
-
-<pre>&lt;title&gt;&amp;lt;title&amp;gt;: The Document Title element - HTML: Hypertext Markup Language | MDN&lt;/title&gt;</pre>
-
-<p>Otro ejemplo podría ser:</p>
-
-<pre>&lt;title&gt;Fill in your details to register — myGov services&lt;/title&gt;</pre>
-
-<p>Para ayudar al usuario, se puede actualizar el titulo de la página para reflejar cambios significativos al estado de la página (como problemas en la validación de un formulario):</p>
-
-<pre>&lt;title&gt;2 errors — Fill in your details to register — myGov services&lt;/title&gt;</pre>
-
-<h3 id="Ver_también_3">Ver también</h3>
-
-<ul>
- <li>{{htmlelement("title")}}</li>
-</ul>
-
-<h2 id="Contenido_incrustado_debe_ser_etiquetado">Contenido incrustado debe ser etiquetado</h2>
-
-<p>Asegurarse que elementos que incrusten contenido tengan un atributo título que describa el contenido incrustado. Esto incluye al elemento {{htmlelement("embed")}} y al elemento {{htmlelement("object")}}. Estos elementos son usualmente definidos por un contenido gráfico, similar a un elemento {{HTMLelement("img")}}. Un título descriptivo ayuda a los usuarios de tecnologías asistivas entender que muestra el elemento.</p>
-
-<h2 id="Figuras_con_leyendas_opcionales_deberían_ser_etiquetadas">Figuras con leyendas opcionales deberían ser etiquetadas</h2>
-
-<p>Para una mejor accesibilidad, incluir un {{HTMLElement("figcaption")}} dentro de un elemento {{HTMLElement("figure")}}, incluso si hacerlo es opcional técnicamente. La leyenda es adicional a cualquier texto alternativo en las imágenes dentro de la figura. La leyenda describe el proósito de una figura en el documento, que puede ser diferente de una descripción sencilla de un elemento visual, tal como lo proporciona el texto alternativo.</p>
-
-<h3 id="Ejemplo">Ejemplo</h3>
-
-<p>El siguiente ejemplo muestra código para una figura con un pie de página. El atributo <code>alt</code> del elemento {{htmlelement("img")}} describe la apariencia de la imagen; el elemento {{htmlelement("figcaption")}} lo describe desde una perspectiva funcional (en este caso, el nombre en latín de la flor de la imagen).</p>
-
-<pre>&lt;figure&gt;
-  &lt;img src="milkweed.jpg"
-      alt="Black and white close-up photo of milkweed flowers"&gt;
- &lt;figcaption&gt;Asclepias verticillata&lt;/figcaption&gt;
-&lt;/figure&gt;
-</pre>
-
-<h2 id="Los_elementos_de_un_conjuto_campos_deben_ser_etiquetados">Los elementos de un conjuto campos deben ser etiquetados</h2>
-
-<p>Los elementos de un conjunto de campos (fieldset) deben tener un texto descriptivo, similar a otros elementos del formulario. Utilice el elemento {{htmlelement("legend")}} para describir el propósito de un conjunto de campos (fieldset).</p>
-
-<h2 id="Utilizar_una_leyenda_para_etiquetar_un_conjunto_de_campos">Utilizar una leyenda para etiquetar un conjunto de campos</h2>
-
-<p>Al agrupar un conjunto de elementos de un formulario con un elemento {{htmlelement("fieldset")}}, se debería incluir un elemento {{htmlelement("legend")}} anidado dento de éste, conteninedo una clara descripción del grupo.</p>
-
-<p>Usuarios de tecnologías asistivas encuentras esta descripción útil cuando tratan de entender el propósito del grupo. Sin la leyenda, tienen que navegar individualmente por todos los controles del formulario en el grupo para inferir una idea del propósito general, lo que puede resultar confuso.</p>
-
-<h3 id="Ejemplo_2">Ejemplo</h3>
-
-<pre>&lt;form&gt;
-  &lt;fieldset&gt;
-    &lt;legend&gt;Choose your favorite monster&lt;/legend&gt;
-
-    &lt;input type="radio" id="kraken" name="monster"&gt;
-    &lt;label for="kraken"&gt;Kraken&lt;/label&gt;&lt;br/&gt;
-
-    &lt;input type="radio" id="sasquatch" name="monster"&gt;
-    &lt;label for="sasquatch"&gt;Sasquatch&lt;/label&gt;&lt;br/&gt;
-
-    &lt;input type="radio" id="mothman" name="monster"&gt;
-    &lt;label for="mothman"&gt;Mothman&lt;/label&gt;
-  &lt;/fieldset&gt;
-&lt;/form&gt;</pre>
-
-<p>Puede ver un ejemplo interactivo en la <a href="/en-US/docs/Web/HTML/Element/fieldset"> página de referencia de <code>&lt;fieldset&gt;</code></a>.</p>
-
-<h3 id="Ver_también_4">Ver también</h3>
-
-<ul>
- <li>{{htmlelement("fieldset")}}</li>
- <li>{{htmlelement("legend")}}</li>
-</ul>
-
-<h2 id="Los_elementos_de_un_formulario_deben_estar_etiquetados">Los elementos de un formulario deben estar etiquetados</h2>
-
-<p>Todos los elementos dentro de un formulario deben tener un elemento {{htmlelement("label")}} que identifique su propósito. Esto aplica a todos los tipos de elementos {{htmlelement("input")}}, como también para elementos {{htmlelement("button")}}, {{htmlelement("output")}}, {{htmlelement("select")}}, {{htmlelement("textarea")}}, {{htmlelement("progress")}} y {{htmlelement("meter")}}, como para cualquier elemento con el <a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Switch_role"> ARIA role</a> <a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Switch_role"><code>switch</code></a>.</p>
-
-<p>El elemento del formulario puede ser puesto dentro de un elemento {{htmlelement("label")}}, en cuyo caso la asociación entre el elemento del formulario y la etiqueta es obvia por la estructura. O, se puede crear una asociación entre un {{htmlelement("label")}} y el elemento del formulario al especificar el valor <code>id</code> del elemento del formulario y el valor del atributo <code>for</code> de la etiqueta.</p>
-
-<h3 id="Ejemplos_4">Ejemplos</h3>
-
-<pre>&lt;label&gt;I agree to the terms and conditions.
-  &lt;input type="checkbox" id="terms"&gt;
-&lt;/label&gt;
-
-&lt;input type="checkbox" id="emailoptin"&gt;
-&lt;label for="emailoptin"&gt;Yes, please send me news about this product.&lt;/label&gt;
-</pre>
-
-<h2 id="Los_elementos_de_un_formulario_deberían_tener_una_etiqueta_de_texto_visible">Los elementos de un formulario deberían tener una etiqueta de texto visible</h2>
-
-<p>En adición a tener un elemento {{htmlelement("label")}} para cada elemento del formulario, estas etiquetas deberían ser visibles, no ocultarse. Las etiquetas visbles ayudan a <em>todos</em> los usuarios entender el propósito de un elemento de formulario. No dependa de un texto temporal porque éste desaparece tan pronto como el usuario empieza a escribir.</p>
-
-<h2 id="Los_elementos_marco_frame_deben_estar_etiquetados">Los elementos marco ('frame') deben estar etiquetados</h2>
-
-<p>Los elementos marco ('frame'), tanto {{htmlelement("iframe")}} como el obsoleto y antiguo {{htmlelement("frame")}}, deben tener un título para describir el contenido del marco. Utilice el atributo <code>title</code> para etiquetar un elemento 'frame'. Sin un título, los usuarios que usen una tecnología asistiva tienen que navegar dentro del marco para entender que contiene, lo que puede ser difícil y confuso. </p>
-
-<p>El elemento <code>&lt;frame&gt;</code> ya no forma parte de la especificación HTML en la versión HTML5. El soporte podría ser abandonado por los navegadores en el futuro. Además, es difícil para los lectores de pantalla el navegar páginas con elementos <code>&lt;frame&gt;</code>. Para una mejor accesibilidad y mantenimiento futuro, se debe rediseñar cualquier página que use marcos y reemplazarlos con el uso de CSS para lograr un diseño similar.</p>
-
-<p>Como una mejor práctica, también proporcionar un {{htmlelement("title")}} para el documento que esta encapsulado en el marco, con un contenido identico al atributo <code>title</code> del marco. (Esto asumiendo que el documento encapsulado esta en control de uno, si no, tratar de coincidir el atributo <code>title</code> del marco con el título del documento.) Algunos lectores de pantalla reemplazan el contenido del atributo <code>title</code> con el contenido del {{htmlelement("title")}} del documento encapsulado. Es más seguro y más accesible el proporcionar el mismo título en ambos lugares.</p>
-
-<h3 id="Ejemplos_5">Ejemplos</h3>
-
-<pre>&lt;iframe
-    title="MDN Web docs"
-    width="300"
-    height="200"
-    src="https://developer.mozilla.org"&gt;
-&lt;/iframe&gt;
-
-</pre>
-
-<h2 id="Usar_el_atributo_alt_para_etiquetar_elementos_mglyph">Usar el atributo alt para etiquetar elementos mglyph</h2>
-
-<p>Al escribir ecuaciones con MathML, a cada elemento {{mathmlelement("mglyph")}} se le debe asignar el atributo <code>alt</code> conteniendo un nombre que describa el símbolo. Puesto que los elementos <code>mglyph</code> son usados para símbolos no estándar sin definiciones Unicode, los lectores de pantalla no serán capaces de automáticamente nombrarlos. El texto alternativo ayuda a los usuarios de lectores de pantalla entender el símbolo.</p>
-
-<h2 id="Los_encabezados_deben_ser_etiquetados">Los encabezados deben ser etiquetados</h2>
-
-<p>Asegurarse que los encabezados tengan un contenido no vacío y no estén ocultos como con el CSS <code>display:none</code> o <code>aria-hidden=true</code>. Los usuarios de lectores de pantalla confían en los encabezados para entender la estructura y el contenido de un documento.</p>
-
-<p>Además, es importante usar los <a href="/en-US/docs/Web/HTML/Element/Heading_Elements">elementos de encabezado</a> sólo para los encabezados de sección reales, y no como una forma rápida de hacer que el texto se destaque. Los lectores de pantalla suelen "hojear" los encabezados de una página, de manera muy parecida a los usuarios con visión, el texto que no sea encabezado que se marca con elementos de encabezamiento puede causar confusión.</p>
-
-<h2 id="Los_encabezados_deberían_tener_contenido_de_texto_visible">Los encabezados deberían tener contenido de texto visible</h2>
-
-<p>Asegurarse que los encabezados tengan un contenido no vacío y no estén ocultos como con el CSS <code>display:none</code> or <code>aria-hidden=true</code>. Los usuarios de lectores de pantalla confían en los encabezados para entender la estructura y el contenido de un documento. No use encabezados para marcar imágenes u otro contenido gráfico.</p>
-
-<h2 id="Utilizar_el_atributo_title_para_describir_el_contenido_de_un_&lt;iframe>">Utilizar el atributo title para describir el contenido de un &lt;iframe&gt;</h2>
-
-<p>Asegurarse que los elementos {{htmlelement("iframe")}} tienen un atributo <code>title</code> para describir el contenido de un marco. Sin un título, los usuarios de tecnologías asistivas tienen que navegar dentro del marco para entender que contiene, lo que puede ser difícil y confuso. </p>
-
-<p>Una mejor práctica consiste en proveer un {{htmlelement("title")}} al documento encapsulado por el marco, con un contenido identico al atributo <code>title</code> del marco. (Asumiendo que el documento encapsulado es propio, si no, tratar de hacer coincidir el atributo <code>title</code> del marco con el título del documento.) Algunos lectores de pantalla reemplazan el contenido del atributo <code>title</code> con el contenido del {{htmlelement("title")}} del documento encapsulado. Es más seguro y accesible definir el mismo título en ambos lugares.</p>
-
-<h2 id="Contenido_con_imágenes_deben_ser_etiquetados">Contenido con imágenes deben ser etiquetados</h2>
-
-<p>Proporcionar un texto descriptivo para todas las imágenes y elementos parecidos a imágenes que tengan contenido (es decir que no sean decorativos. Esto incluye imágenes SVG, elementos {{htmlelement("img")}}, {{htmlelement("canvas")}}, {{htmlelement("map")}}, y {{htmlelement("area")}}, así como elementos {{htmlelement("input")}} donde este definido <code>type=image</code> y elementos {{htmlelement("object")}} donde el <code>type</code> empiece con <code>image/</code>. La forma típica de hacer esto es con el atributo <code>alt</code>. Asegurarse de que la descripción trasmite lo que muestra la imagen</p>
-
-<h3 id="Ejemplo_3">Ejemplo</h3>
-
-<pre>&lt;img src="milkweed.jgp"
-     alt="Black and white close-up photo of milkweed flowers"&gt; </pre>
-
-<h2 id="Elementos_interactivos_deben_ser_etiquetados">Elementos interactivos deben ser etiquetados</h2>
-
-<p>Si un elemento esta destinado para que los usuarios interactúen con él, debe estar etiquetado. Los elementos interactivos incluyen enlaces ({{htmlelement("a")}}), elementos de un formulario, botones, y cualquier elemento que tenga manejadores de eventos para ratón o teclado. La forma para etiquetar un elemento depende de su tipo: para elementos de un formulario, utilizar un {{htmlelement("label")}}; para enlaces, botones y elementos sobre los que se puede hacere click, el contenido del texto del elemento suele proporcionar la etiqueta. Si no existe otra opción para etiquetar un elemento, utilizar el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code>.</p>
-
-<h2 id="Usar_el_atributo_label_en_elementos_optgroup">Usar el atributo label en elementos optgroup</h2>
-
-<p>En un elemento {{htmlelement("optgroup")}}, utilizar el atributo <code>label</code> para describir el gupo para que tecnologías asistivas puedan acceder a dicha descripción para sus usuarios.</p>
-
-<h3 id="Ejemplo_4">Ejemplo</h3>
-
-<p>En este ejemplo, el atributo <code>label</code> en los elementos <code>&lt;optgroup&gt;</code> da un nombre de categoría para el grupo de opciones.</p>
-
-<pre>&lt;label for="dino-select"&gt;Choose a dinosaur:&lt;/label&gt;
-&lt;select id="dino-select"&gt;
-    &lt;optgroup label="Theropods"&gt;
-        &lt;option&gt;Tyrannosaurus&lt;/option&gt;
-        &lt;option&gt;Velociraptor&lt;/option&gt;
-        &lt;option&gt;Deinonychus&lt;/option&gt;
-    &lt;/optgroup&gt;
-    &lt;optgroup label="Sauropods"&gt;
-        &lt;option&gt;Diplodocus&lt;/option&gt;
-        &lt;option&gt;Saltasaurus&lt;/option&gt;
-        &lt;option&gt;Apatosaurus&lt;/option&gt;
-    &lt;/optgroup&gt;
-&lt;/select&gt;</pre>
-
-<h2 id="Las_barras_de_herramientas_deben_ser_etiquetadas_cuando_haya_más_de_una_barra">Las barras de herramientas deben ser etiquetadas cuando haya más de una barra</h2>
-
-<p>Si se define más una barra de herramientas en una aplicación web utilizando el rol ARIA <code>toolbar</code>, se debe usar el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code> para etiquetar cada una de ellas de manera que pueda ser descrita por la tecnología de asistencia. Es una buena práctica etiquetar una barra de herramientas aún cuando solo haya una en la página</p>
-
-<h3 id="Ver_también_5">Ver también</h3>
-
-<ul>
- <li><a href="https://www.w3.org/TR/wai-aria-practices/examples/toolbar/toolbar.html">Ejemplo de una barra de herramienta W3C ARIA (W3C ARIA toolbar example)</a></li>
-</ul>
-
-<h2 id="Criterios_de_aprobación_relacionados_a_WCAG">Criterios de aprobación relacionados a WCAG</h2>
-
-<dl>
- <dt><a href="https://www.w3.org/TR/WCAG21/#non-text-content">1.1.1 Contenido no textual (A)</a></dt>
- <dd>Todo contenido no textual que es presentado al usuario tiene un texto alternativo que sirve un propósito similar, excepto para las situaciones listadas en el enlace anterior.</dd>
- <dt><a href="https://www.w3.org/TR/WCAG21/#link-purpose-in-context">2.4.4 Propósito del enlace (en contexto) (A)</a></dt>
- <dd>El propósito de cada enlace puede determinarse a partir del texto del enlace o del texto del enlace en conjunto con contexto determinado programáticamente, salvo cuando el propósito del enlace sea ambiguo para los usuarios en general.</dd>
- <dt><a href="https://www.w3.org/TR/WCAG21/#link-purpose-link-only">2.4.9 Propósito del enlace (sólo el enlace) (AAA)</a></dt>
- <dd>Se dispone de un mecanismo que permite identificar el propósito de cada enlace a partir del texto del enlace solamente, excepto cuando el propósito del enlace es ambiguo para los usuarios en general.</dd>
-</dl>
diff --git a/files/es/web/accesibilidad/understanding_wcag/index.html b/files/es/web/accesibilidad/understanding_wcag/index.html
deleted file mode 100644
index f58fae9c48..0000000000
--- a/files/es/web/accesibilidad/understanding_wcag/index.html
+++ /dev/null
@@ -1,56 +0,0 @@
----
-title: Understanding the Web Content Accessibility Guidelines
-slug: Web/Accesibilidad/Understanding_WCAG
-translation_of: Web/Accessibility/Understanding_WCAG
----
-<p class="summary">Esto es parte de un grupo de artículos que explican rápidamente los pasos necesario para cumplir con la normativa de W3C Web Content Accessibility Guides 2.0 o 2.1 (también conocida como WCAG).</p>
-
-<p>La norma WCAG 2.0 y 2.1 provee unas guías detalladas para lograr que el contenido de nuestro sitio sea accesible para personas con distintos tipos de discapacidades. Es exhaustivo y muy detallado, por lo que cuesta comprenderlo rápidamente. Por esta razón, hemos resumido los pasos a seguir para que puedas cumplir con las diferentes recomendaciones e incluimos links al pie para más detalles en los lugares necesarios.</p>
-
-<h2 id="Los_cuatro_principios">Los cuatro principios</h2>
-
-<p>La normativa WCAG tiene cuatro secciones, cuatro categorías en las cuales el contenido <strong>debe</strong> ser accesible (para más información puedes referirte a <a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/intro.html#introduction-fourprincs-head">Understanding the Four Principles of Accessibility (inglés)</a>).</p>
-
-<p>Cada uno de los siguientes enlaces te llevarán a páginas en las que podrás expandir tu conocimiento en cada una de las áreas de WCAG 2.0 y 2.1.</p>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Perceivable">Perceptible:</a> Los usuarios deben poder percibir el contenido de alguna forma, a través de alguno de sus sentidos.</li>
- <li><a href="/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Operable">Operable</a>: Los usuarios deben poder controlar los elementos de interfaz (por ejemplo, se deben poder cliquear botones de alguna forma, ya sea utilizando el ratón, teclado o comando de voz).</li>
- <li><a href="/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Understandable">Comprensible</a>: El contenido debe ser comprensible para los usuarios.</li>
- <li><a href="/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Robust">Robusto</a>: El contenido debe ser desarrollado utilizando estándares actuales que funcionarán en todos los navegadores del momento, hoy y en el futuro.</li>
-</ul>
-
-<h2 id="Debo_usar_WCAG_2.0_o_2.1">Debo usar WCAG 2.0 o 2.1?</h2>
-
-<p>WCAG 2.1 es el estándar más reciente y relevante. Utilízalo para mejorar la calidad de navegación de los usuarios con discapacidades y para reducir las posibles acciones legales a los dueños del sitio web.</p>
-
-<p>Al momento de asignar recursos, ten como objetivo WCAG 2.0, luego sube a 2.1.</p>
-
-<h3 id="¿Qué_es_WCAG_2.1">¿Qué es WCAG 2.1?</h3>
-
-<p>WCAG 2.1 fue publicado el 5 de junio de 2018 como recomendación oficial. La Unión Europea (EU) lo adoptó como estándar en septiembre de ese mismo año. La W3C publicó un <a href="https://www.w3.org/blog/2018/09/wcag-2-1-adoption-in-europe/">anuncio de prensa al respecto</a>.</p>
-
-<p>WCAG 2.1 incluye:</p>
-
-<ul>
- <li>Toda la normativa WCAG 2.0 (literal, palabra-por-palabra)</li>
- <li>17 nuevos Criterios de Conformidad en los niveles A / AA / AAA que se enfocan principalmente en las siguientes necesidades:
-  <ul>
-   <li>Accessbilidad móvil</li>
-   <li>Baja visión</li>
-   <li>Cognitivas</li>
-  </ul>
- </li>
- <li>Lee más sobre WCAG 2.1 (en inglés):
-  <ul>
-   <li>Deque: <a href="https://www.deque.com/blog/wcag-2-1-what-is-next-for-accessibility-guidelines/">WCAG 2.1:  What is Next for Accessibility Guidelines</a></li>
-   <li>TPG:  <a href="https://developer.paciellogroup.com/blog/2018/06/web-content-accessibility-guidelines-wcag-2-1/">Web Content Accessibilituy Guidelines (WCAG) 2.1</a></li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Legal">Legal</h2>
-
-<p>Esta guía tiene como objetivo proveer información para que puedas construir mejores sitios, más accesibles. Sin embargo, no somos abogados y nada de esto es un asesoramiento legal. Si estás preocupado/a por las implicaciones legales de la accesibilidad web recomendamos que investigues la legislación de tu país o que consultes a un abogado calificado.</p>
-
-<p><a href="/en-US/docs/Learn/Accessibility/What_is_accessibility">¿Qué es la accesibilidad?</a> y <a href="/en-US/docs/Learn/Accessibility/What_is_accessibility#Accessibility_guidelines_and_the_law">guías de accesibilidad y sobre la ley</a> proveen más información al respecto (en inglés).</p>
diff --git a/files/es/web/accesibilidad/understanding_wcag/perceivable/color_contraste/index.html b/files/es/web/accesibilidad/understanding_wcag/perceivable/color_contraste/index.html
deleted file mode 100644
index 2db0f4e251..0000000000
--- a/files/es/web/accesibilidad/understanding_wcag/perceivable/color_contraste/index.html
+++ /dev/null
@@ -1,162 +0,0 @@
----
-title: Contraste del color
-slug: Web/Accesibilidad/Understanding_WCAG/Perceivable/Color_contraste
-tags:
-  - Accesibilidad
-  - Perceptible
-  - contraste
-translation_of: Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast
----
-<p>El <a href="https://www.w3.org/TR/WCAG21/#dfn-contrast-ratio">contraste del color</a> entre el fondo y el contenido del primer plano (que suele ser texto) debe ser lo suficientemente alto como para garantizar la legibilidad.</p>
-
-<p>Al diseñar interfaces legibles para diferentes capacidades de visión, las directrices de la WCAG recomiendan las siguientes relaciones de contraste:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Tipo de contenido</th>
-   <th scope="col">Relación mínima (nivel AA)</th>
-   <th scope="col">Relación mejorada (nivel AAA)</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>Cuerpo de texto</td>
-   <td>4.5 : 1</td>
-   <td>7 : 1</td>
-  </tr>
-  <tr>
-   <td>Texto a gran escala (120-150% mayor que el cuerpo de texto)</td>
-   <td>3 : 1</td>
-   <td>4.5 : 1</td>
-  </tr>
-  <tr>
-   <td>Componentes activos de la interfaz de usuario y objetos gráficos como iconos y gráficos</td>
-   <td>3 : 1</td>
-   <td>No definido</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Estas proporciones no se aplican al texto "incidental", como controles inactivos, logotipos o texto puramente decorativo.</p>
-
-<p>Consulta la sección {{anch("Solución")}} a continuación para obtener más información.</p>
-
-<p>Tener un buen contraste de color en tu sitio web beneficia a todos tus usuarios, pero es particularmente beneficioso para los que tienen cierto tipo de ceguera al color y otras afecciones similares, como los que experimentan una baja sensibilidad al contraste y tienen dificultades para diferenciar colores parecidos. Esto se debe a que no distinguen las áreas brillantes y oscuras con tanta facilidad como las personas que no tienen esa discapacidad, y por lo tanto tienen problemas para ver los bordes y otros detalles.  </p>
-
-<p>Es bueno tener un diseño atractivo en tu sitio web, pero el diseño es inútil si tus usuarios no pueden leer el contenido.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Veamos algunos ejemplos simples con código HTML y CSS:</p>
-
-<pre class="brush: html notranslate">&lt;div class="good"&gt;Buen contraste&lt;/div&gt;
-&lt;div class="bad"&gt;Mal contraste&lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">div {
-  /* General div styles here */
-}
-
-.good {
-  background-color: #fae6fa;
-}
-
-.bad {
-  background-color: #400064;
-}</pre>
-
-<p>Ambos fragmentos de texto tienen color negro por defecto. El <code>&lt;div&gt;</code> "good" tiene un color de fondo púrpura claro, lo que hace que el texto sea fácil de leer:</p>
-
-<div class="hidden">
-<h4 id="example1">example1</h4>
-
-<pre class="brush: html notranslate">    &lt;div class="good"&gt;
-      Good contrast
-    &lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">div {
-  font-family: sans-serif;
-  text-align: center;
-  font-size: 2rem;
-  font-weight: bold;
-  width: 250px;
-  padding: 30px;
-  border-radius: 20px;
-  box-shadow: 1px 1px 1px black;
-}
-
-.good {
-  background-color: #fae6fa;
-}</pre>
-</div>
-
-<p>{{EmbedLiveSample('example1', '100%', '100')}}</p>
-
-<p>El <code>&lt;div&gt;</code> "bad", por otro lado, tiene un color de fondo púrpura muy oscuro, lo que hace que el texto sea mucho más difícil de leer:</p>
-
-<div class="hidden">
-<h4 id="example2">example2</h4>
-
-<pre class="brush: html notranslate">    &lt;div class="bad"&gt;
-      Bad contrast
-    &lt;/div&gt;</pre>
-
-<pre class="brush: css notranslate">div {
-  font-family: sans-serif;
-  text-align: center;
-  font-size: 2rem;
-  font-weight: bold;
-  width: 250px;
-  padding: 30px;
-  border-radius: 20px;
-  box-shadow: 1px 1px 1px black;
-}
-
-.bad {
-  background-color: #400064;
-}</pre>
-</div>
-
-<p>{{EmbedLiveSample('example2', '100%', '100')}}</p>
-
-<dl>
-</dl>
-
-<h2 id="Solución">Solución</h2>
-
-<p>Al elegir un esquema de color para tu sitio web, selecciona colores de primer plano y de fondo que tengan un buen contraste. Haz que el contraste de color sea lo mejor posible dentro de las limitaciones de tu diseño — preferiblemente elige el nivel AAA (ver 1.4.6 más abajo), pero al menos cumple con el nivel AA (ver 1.4.3 más abajo).</p>
-
-<p>Si incluyes contenido no textual, como vídeo o animación, debes seguir 1.4.11 (nuevamente, ver más abajo).</p>
-
-<p>Para verificar el contraste a medida que seleccionas los colores puedes utlizar una herramienta como <a class="external external-icon" href="http://webaim.org/resources/contrastchecker/" rel="noopener">Color Contrast Checker</a> de WebAIM.</p>
-
-<p>También puedes comprobar el contraste de color sobre la marcha utilizando las herramientas para desarrolladores de Firefox— ver nuestra guía <a href="/en-US/docs/Tools/Accessibility_inspector">Accessibility inspector</a>, y en particular la sección <a href="/en-US/docs/Tools/Accessibility_inspector#Check_for_accessibility_issues">Check for accessibility issues</a>. Prueba a usarlo en los ejemplos en vivo en la sección de descripción.</p>
-
-<h2 id="Criterios_de_conformidad_relacionados_con_WCAG">Criterios de conformidad relacionados con WCAG</h2>
-
-<dl>
- <dt><a href="https://www.w3.org/TR/WCAG21/#contrast-minimum">1.4.3 Contraste mínimo (AA)</a></dt>
- <dd>El contraste de color entre el fondo y el contenido del primer plano debe tener un nivel mínimo para garantizar la legibilidad:
- <ul>
-  <li>El texto y el fondo deben tener una relación de contraste de al menos 4.5:1.</li>
-  <li>Los encabezados (o simplemente el texto más grande) deben tener una relación de contraste de al menos 3:1. El texto más grande se define como de al menos 18pt, o 14pt en negrita.</li>
- </ul>
- </dd>
- <dt><a href="https://www.w3.org/TR/WCAG21/#contrast-enhanced">1.4.6 Contraste mejorado (AAA)</a></dt>
- <dd>Esto sigue y se basa en el criterio 1.4.3.
- <ul>
-  <li>El texto y el fondo deben tener una relación de contraste de al menos 7:1.</li>
-  <li>Los encabezados (o simplemente el texto más grande) deben tener una relación de contraste de al menos 4.5:1.</li>
- </ul>
- </dd>
- <dt><a href="https://www.w3.org/TR/WCAG21/#non-text-contrast">1.4.11 Contraste no textual (AA)</a> (añadido en 2.1)</dt>
- <dd>Debe haber una relación mínima de contraste de color de 3 a 1 para los componentes de la interfaz de usuario y los objetos gráficos.</dd>
-</dl>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form#Multiple_labels">Multiple labels</a></li>
- <li><a href="https://www.w3.org/WAI/WCAG21/Understanding/non-text-contrast.html">Understanding Non-Text Contrast</a></li>
-</ul>
diff --git a/files/es/web/accesibilidad/understanding_wcag/perceivable/index.html b/files/es/web/accesibilidad/understanding_wcag/perceivable/index.html
deleted file mode 100644
index 6bf99039f8..0000000000
--- a/files/es/web/accesibilidad/understanding_wcag/perceivable/index.html
+++ /dev/null
@@ -1,336 +0,0 @@
----
-title: Perceivable
-slug: Web/Accesibilidad/Understanding_WCAG/Perceivable
-translation_of: Web/Accessibility/Understanding_WCAG/Perceivable
----
-<p class="summary">Este artículo ofrece consejos prácticos sobre cómo hacer que tu sitio web cumpla con los criterios de <strong>Percepción</strong> de WCAG 2.0 y 2.1. Los estados perceptivos que los usuarios deben poder reconocer utilizando alguno de sus sentidos.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Para leer las definiciones de la W3C sobre Percepción y las guías para cumplir con los criterios dirígete a <a href="https://www.w3.org/TR/WCAG21/#perceivable">Principle 1: Perceivable - Information and user interface components must be presentable to users in ways they can perceive.</a></p>
-</div>
-
-<h2 id="Pauta_1.1_—_Dar_alternativas_de_texto_para_contenido_no_textual.">Pauta 1.1 — Dar alternativas de texto para contenido no textual.</h2>
-
-<p>La clave aquí es convertir el texto a otros formatos que puedan ser entendidos por personas con otras capacidades; ya sea si utilizan un screen-reader, zoom o un lector de braille. El contenido no textual se refiere a elementos multimedia como imágenes, audio y vídeo.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Criterio de éxito</th>
-   <th scope="col">Cómo cumplir</th>
-   <th scope="col">Recursos prácticos</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td colspan="1" rowspan="5">1.1.1 Alternativas textuales  (A)</td>
-   <td>Toda imagen que sea útil para el usuario debe tener un texto alternativo.</td>
-   <td><a href="/en-US/docs/Learn/Accessibility/HTML#Text_alternatives">Texto alternativo.</a></td>
-  </tr>
-  <tr>
-   <td>
-    <p>Las imágenes complejas o gráficos deben tener una alternativa accesible, ya sea en al misma página o en una externa. Utiliza un elemento de link en vez del atributo <code>longdesc</code>.</p>
-   </td>
-   <td>
-    <p>Una alternativa textual o una tabla puede resolverlo (ver <a href="/en-US/docs/Learn/HTML/Tables/Advanced">HTML table advanced features and accessibility</a> y <a href="/en-US/docs/Learn/Accessibility/HTML#Other_text_alternative_mechanisms">Other text alternative mechanisms</a> para leer sobre el argumento en contra de <code>longdesc</code>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>El contenido multimedia (por ejemlo, audio o vídeo) debería tener por lo menos una descripción accesible disponible (captions o similar).</td>
-   <td>
-    <p>Ver <a href="/en-US/docs/Learn/Accessibility/HTML#Text_alternatives">alternativas de texto</a> para opciones de captions, y <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a>, <a href="/en-US/docs/Learn/Accessibility/Multimedia#Video_text_tracks">Video text tracks</a> o <a href="/en-US/docs/Learn/Accessibility/Multimedia#Other_multimedia_content">Other multimedia content</a> para otras alternativas.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Los elementos de interfaz como botones o elementos de formulario deberán tener <code>label</code>s que describan su propósito.</td>
-   <td>Deberás asegurarte de que los botones describan su función (por ejemplo, <code>&lt;button&gt;Subir imagen&lt;/button&gt;</code>). Para más información ver <a href="/en-US/docs/Learn/Accessibility/HTML#UI_controls">UI controls</a>.</td>
-  </tr>
-  <tr>
-   <td>
-    <p>Implementa elementos decorativos (imágenes o vídeos) de manera que sea invisibles para lectores de pantalla, de esta forma evitarás confundir a estos usuarios.</p>
-   </td>
-   <td>
-    <p>Las imágenes decorativas deben ser implementadas utilizando la propiedad <code>background-image</code><em>. </em>Si debes incluir una imagen con la etiqueta {{htmlelement("img")}} deberás agregarle un atributo <code>alt</code> vacío, de otra manera los lectores de pantalla podrían leerlo.</p>
-
-    <p>Si incluyes un vídeo o audio en tu sitio que se reproduce automáticamente intenta de que sea lo menos molesto posible. No hagas que se vea ni actúe como contenido y provee una forma de apagarlo.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: Ver también <a href="https://www.w3.org/TR/WCAG21/#text-alternatives">WCAG description for Guideline 1.1: Text alternatives</a>.</p>
-</div>
-
-<h2 id="Pauta_1.2_—_Proporcionar_alternativas_para_los_medios_tempo-dependientes.">Pauta 1.2 — Proporcionar alternativas para los medios tempo-dependientes.</h2>
-
-<p>Los medios tempo-dependientes se refieren a multimedia con una duración (audio y vídeo, por ejemplo). Ten en cuenta que si este contenido multimedia funciona como una alternativa a un contenido textual no necesitas proveer otra alternavtiva.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Criterio de éxito</th>
-   <th scope="col">Cómo cumplir</th>
-   <th scope="col">Recursos prácticos</th>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="1">1.2.1 Provee alternativas para multimedia de solo audio o solo vídeo (A)</td>
-   <td>A transcript should be provided for prerecorded audio-only media, and a transcript or audio description should be provided for prerecorded video-only media (i.e. silent video).</td>
-   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information. No audio description tutorial available as yet.</td>
-  </tr>
-  <tr>
-   <td colspan="1">1.2.2 Provee captions para los vídeos (A)</td>
-   <td>You should provide captions for video presented on the web, e.g. HTML5 video. This is for the benefit of people who can't hear the audio part of the video.</td>
-   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Video_text_tracks">Video text tracks</a> for HTML5 video captions, and <a href="/en-US/docs/Learn/Accessibility/Multimedia#Other_multimedia_content">Other multimedia content</a> for other technologies. See also <a href="https://support.google.com/youtube/answer/2734796?hl=en">Add your own subtitles &amp; closed captions</a> (YouTube).</td>
-  </tr>
-  <tr>
-   <td colspan="1">
-    <p>1.2.3 Provee texto alternativo o una descripción para el audio del vídeo (A)</p>
-   </td>
-   <td>You should provide text transcripts or audio descriptions for video presented on the web, e.g. HTML5 video. This is for the benefit of people who can't see the visual part of the video, and don't get the full content from the audio alone.</td>
-   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information. No audio description tutorial available as yet.</td>
-  </tr>
-  <tr>
-   <td colspan="1">1.2.4 Provee captions para audio en vivo (AA)</td>
-   <td>You should provide synchronized captions for all live multimedia that contains audio (e.g. video conferences, live audio broadcasts.)</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.2.5 Provee descripciones de adio para vídeo pre-grabado (AA)</td>
-   <td>Audio descriptions should be provided for prerecorded video, but only where the existing audio does not convey the full meaning expressed by the video.</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.2.6 Provee lenguaje de signos equivalente a el audio pre-grabado (AAA)</td>
-   <td>An equivalent sign language video should be provided for any prerecorded content containing audio.</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.2.7 Provee un vídeo extendido con descripciones de audio (AAA)</td>
-   <td>Where audio descriptions cannot be provided (see 1.2.5) due to video timing issues (e.g. there are no suitable pauses in the content in which to insert the audio descriptions), an alternative version of the video should be provided that includes inserted pauses (and audio descriptions).</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.2.8 Provee una alternativa para los elementos multimedia pre-grabados (AAA)</td>
-   <td>For all content that features video, a descriptive text transcript should be provided, for example a script of the movie you are watching. This is for the benefit of hearing impaired viewers who cannot hear the content.</td>
-   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information.</td>
-  </tr>
-  <tr>
-   <td colspan="1">1.2.9 Provee una transcripción para el audio en vivo (AAA)</td>
-   <td>For any live audio content being broadcast, a descriptive text should be provided, for example a script of the play or musical you are listening to. This is for the benefit of hearing impaired viewers who cannot hear the content.</td>
-   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information.</td>
-  </tr>
- </thead>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: Ver también la descripción de <a href="https://www.w3.org/TR/WCAG21/#time-based-media">WCAG Guideline 1.2: Time-based Media: Provide alternatives for time-based media</a>.</p>
-</div>
-
-<h2 id="Pauta_1.3_—_Crear_contenido_que_pueda_presentarse_de_diferentes_formas">Pauta 1.3 — Crear contenido que pueda presentarse de diferentes formas</h2>
-
-<p>Esta pauta hace referencia a la posibilidad de que todo contenido pueda ser consumido de distintas formas, adaptándose a las necesidades del usuario.</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Criterios de éxito</th>
-   <th scope="col">Cómo cumplir</th>
-   <th scope="col">Recursos prácticos</th>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="1">1.3.1 Info and relationships (A)</td>
-   <td>
-    <p>Any content structure — or visual relationship made between content —  can also be determined programmatically, or be inferred from text description. The main situations in which this is relevant are:</p>
-
-    <ul>
-     <li>Text labels and the form elements they describe are associated unambiguously using the {{htmlelement("label")}} element, which can be picked up by screenreaders, etc.</li>
-     <li>Image alt text — content images should have text available that clearly describes the image's contents, which can be programmatically associated with it (e.g. <code>alt</code> text), or otherwise is easy to associate (e.g. describes it and is sat right next to it). This should means that the full meaning can still be inferred even if you can't see the image.</li>
-     <li>Lists — if the order of list items is important, and ordered list should be used ({{htmlelement("ol")}}).</li>
-    </ul>
-   </td>
-   <td>The whole of
-    <p><a href="/en-US/docs/Learn/Accessibility/HTML">HTML: A good basis for accessibility</a> is packed with information about this, but you should particularly refer to <a href="/en-US/docs/Learn/Accessibility/HTML#Good_semantics">Good semantics</a>, <a href="/en-US/docs/Learn/Accessibility/HTML#UI_controls">UI controls</a>, and <a href="/en-US/docs/Learn/Accessibility/HTML#Text_alternatives">Text alternatives</a>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.3.2 Meaningful content sequence (A)</td>
-   <td>A sensible, logical reading order should be easy to determine for any content, even if it is visually presented in an unusual way. The order should be made obvious by use of correct semantic elements (e.g. headings, paragraphs), with CSS being used to create any unusual layout styles, irrespective of the markup.</td>
-   <td>Again, refer to <a href="/en-US/docs/Learn/Accessibility/HTML">HTML: A good basis for accessibility</a>.</td>
-  </tr>
-  <tr>
-   <td colspan="1">1.3.3 Sensory characteristics (A)</td>
-   <td>
-    <p>Instructions for operating controls or understanding content do not rely on a single sense — this may prove inaccessible to people with a disability related to that sense, or a device that does not support that sense. So for example:</p>
-
-    <ul>
-     <li>"Click the round button to continue" — The button should be clearly labelled so that it is obvious that it is the button you need to press. If there are multiple buttons, make sure there are all clearly labelled to distinguish their function.</li>
-     <li>"Listen to the audio instructions for guidance" — This is obviously problematic — audio will be inaccessible to those with heading impairments, whereas text can be read, but also spoken by a screenreader if required.</li>
-     <li>"Swipe from the right hand side of the screen to reveal the menu" — some users might not be able to swipe the screen, either due to disability or because their device does not support touch. An alternative should be provided, such as a keyboard shortcut or button that can be activated by keyboard or other means.</li>
-    </ul>
-
-    <div class="note">
-    <p><strong>Note</strong>: Conveying instructions solely by color is related, but covered in a different guideline — 1.4.1.</p>
-    </div>
-   </td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.3.4 Orientation (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
-   <td>Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.</td>
-   <td>
-    <p><a href="https://www.w3.org/WAI/WCAG21/Understanding/orientation.html">Understanding Orientation</a> </p>
-   </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.3.5 Identify Input Purpose (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
-   <td>
-    <p> </p>
-
-    <p>Follow the list of <a href="https://www.w3.org/TR/WCAG21/#input-purposes">53 input fields</a> to programmatically identify the purpose of a field.   </p>
-   </td>
-   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/identify-input-purpose.html">Understanding Identify Input Purpose</a></td>
-  </tr>
-  <tr>
-   <td colspan="1">1.3.6 Identify Purpose (AAA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
-   <td>In content implemented using markup languages, the purpose of User Interface Components, icons, and regions can be programmatically determined.</td>
-   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/identify-purpose.html">Understanding Identify Purpose</a></td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: Ver también la descripción de WCAG: <a href="https://www.w3.org/TR/WCAG21/#adaptable">Guideline 1.3: Adaptable: Create content that can be presented in different ways without losing information or structure.</a></p>
-</div>
-
-<h2 id="Pauta_1.4_Facilitar_a_los_usuarios_ver_y_oír_el_contenido_incluyendo_la_separación_entre_el_primer_plano_y_el_fondo">Pauta 1.4: Facilitar a los usuarios ver y oír el contenido, incluyendo la separación entre el primer plano y el fondo</h2>
-
-<p>Esta pauta tiene como objetivo la creación de contenido que sea fácil de diferenciar del fondo y otras decoraciones. El ejemplo clásico es sobre color (tanto en relación al contraste como utilizarlo para transmitir información), pero aplica también en otras situaciones.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Criterios de éxito</th>
-   <th scope="col">Cómo cumplir</th>
-   <th scope="col">Recursos prácticos</th>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="1">1.4.1 Use of color (A)</td>
-   <td>
-    <p>Color should not be solely relied upon to convey information — for example, in forms you should never mark required fields purely with a color (like red). Instead (or as well as), something like an asterisk with a label of "required" would be more appropriate.</p>
-   </td>
-   <td>See <a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a> and <a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form#Multiple_labels">Multiple labels</a>.</td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.2 Audio controls (A)</td>
-   <td>For any audio that plays for longer than three seconds, accessible controls should be provided to play and pause the audio/video, and mute/adjust volume.</td>
-   <td>Use native <code>&lt;button&gt;</code>s to provide accessible keyboard controls, as shown in <a href="/en-US/docs/Web/Apps/Fundamentals/Audio_and_video_delivery/Video_player_styling_basics">Video player syling basics</a>.</td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.3 Minimum contrast (AA)</td>
-   <td>
-    <p>The color contrast between background and foreground content should be at a minimum level to ensure legibility:</p>
-
-    <ul>
-     <li>Text and its background should have a contrast ratio of at least 4.5.1.</li>
-     <li>Heading (or just larger) text should have a ratio of at least 3.1. Larger text is defined as at least 18pt, or 14pt bold.</li>
-    </ul>
-   </td>
-   <td>See <a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a>.</td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.4 Resize text (AA)</td>
-   <td>The page should be readable and usable when the text size is doubled. This means that designs should be responsive, so that when the text size is increased, the content is still accessible.</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.5 Images of text (AA)</td>
-   <td>Images should NOT be used to present content where text would do the job. For example, if an image is mostly textual, it could be represented using text as well as images.</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.6 Enhanced contrast (AAA)</td>
-   <td>
-    <p>This follows, and builds on, criterion 1.4.3.</p>
-
-    <ul>
-     <li>Text and its background should have a contrast ratio of at least 7.1.</li>
-     <li>Heading (or just larger) text should have a ratio of at least 4.5.1. Larger text is defined as at least 18pt, or 14pt bold.</li>
-    </ul>
-   </td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.7 Low or no background audio (AAA)</td>
-   <td>Prerecorded audio recordings that primarily feature speech should have minimal background noise, so the content can be easily understood.</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.8 Visual presentation (AAA)</td>
-   <td>
-    <p>For text content presentation, the following should be true:</p>
-
-    <ul>
-     <li>Foreground and background colors should be user-selectable.</li>
-     <li>Text blocks should be no wider than 80 characters (or glyphs), for maximum readability.</li>
-     <li>Text should not be fully justified (e.g. <code>text-align: justify;</code>)</li>
-     <li>line height should be at least 1.5 times the text size within paragraphs (e.g. <code>line-height: 1.5;</code>), and at least 2.25 times the text size between paragraphs (e.g. <code>padding: 2.25rem;</code>)</li>
-     <li>When the text size is doubled, the content should not need to be scrolled.</li>
-    </ul>
-   </td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.9 Images of text (No Exception) (AAA)</td>
-   <td>Text should not be presented as part of an image unless it is purely decoration (i.e. it does not convey any content), or cannot be presented in any other way.</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.10 Reflow (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
-   <td>
-    <ul>
-     <li>No horizontal scrolling for right-to-left languages (like English) or left-to-right languages (like Arabic)   </li>
-     <li>No vertical scrolling for top-to-bottom languages (like Japanese)</li>
-     <li>Except for parts of the content which require two-dimensional layout for usage or meaning (like a large data table).</li>
-    </ul>
-   </td>
-   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/reflow.html">Understanding Reflow</a></td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.11 Non-Text Contrast(AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
-   <td>Minimum color contrast ratio of 3 to 1 for user interface components and graphical objects. </td>
-   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/non-text-contrast.html">Understanding Non-Text Contrast</a></td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.12 Text Spacing (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
-   <td>
-    <p>No loss of content or functionality occurs when the following styles are applied: </p>
-
-    <ul>
-     <li>Line height (line spacing) to at least 1.5 times the font size;</li>
-     <li>Spacing following paragraphs to at least 2 times the font size;</li>
-     <li>Letter spacing (tracking) to at least 0.12 times the font size;</li>
-     <li>Word spacing to at least 0.16 times the font size.</li>
-    </ul>
-   </td>
-   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/text-spacing.html">Understanding Text Spacing</a></td>
-  </tr>
-  <tr>
-   <td colspan="1">1.4.13 Content on Hover or Focus (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
-   <td>
-    <p>Additional content appear and disappear in coordination with hover and keyboard focus, this success criterion specifies three conditions that must be met:</p>
-
-    <ul>
-     <li>dismissable (can be closed/removed)</li>
-     <li>hoverable (the additional content does not disappear when the pointer is over it) </li>
-     <li>persistent (the additional content does not disappear without user action)</li>
-    </ul>
-   </td>
-   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus.html">Understanding Content on Hover or Focus</a></td>
-  </tr>
- </thead>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: Ver también la descripción de WCAG: <a href="https://www.w3.org/TR/WCAG21/#distinguishable">Guideline 1.4: Distinguishable: Make it easier for users to see and hear content including separating foreground from background.</a><a href="https://www.w3.org/TR/WCAG21/#distinguishable">.</a></p>
-</div>
diff --git a/files/es/web/accesibilidad/understanding_wcag/teclado/index.html b/files/es/web/accesibilidad/understanding_wcag/teclado/index.html
deleted file mode 100644
index 239dd6727b..0000000000
--- a/files/es/web/accesibilidad/understanding_wcag/teclado/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: Teclado (Keyboard)
-slug: Web/Accesibilidad/Understanding_WCAG/Teclado
-tags:
-  - Accesibilidad
-  - teclado
-translation_of: Web/Accessibility/Understanding_WCAG/Keyboard
----
-<div>Para ser completamente accesible, una página web debe ser operable por alguién utilizando únicamente un teclado para acceder y controlarla. Esto incluye usuarios de lectores de pantalla, pero también puede incluir a quienes tienen dificultades utilizando un dispositivo apuntador como un ratón o una bola de rastreo, o aquellos cuyo ratón no esta funcionando temporalmente, o la gente que simplemente prefiere usar un teclado como entrada siempre que les sea posible.</div>
-
-<h2 id="Los_elementos_enfocables_deben_tener_una_semántica_interactiva">Los elementos enfocables deben tener una semántica interactiva</h2>
-
-<p>Si un elemento puede ser enfocado utilizando un teclado, entonces debería ser interactivo, es decir, el usuario debería ser capaz de hacer algo y producir un cambio de algún tipo (por ejemplo, activar un enlace o cambiar una opción).</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota: </strong>Una excepción importante a esta regla es si el elemento tiene aplicado <code>role="document"</code>, <strong>dentro </strong>un contexto interactivo (como un <code>role="application"</code>). En tal caso, enfocar el documento anidado es la única forma de devolver la tecnología de asistencia a un estado de no interactividad (comúnmente llamado "modo navegador").</p>
-</div>
-
-<p>La mayoría de los elementos son enfocables por defecto, y se puede hacer que un elemento sea enfocable al añadir el atributo <code>tabindex=0</code>. Sin embargo, sólo se debería añadir <code>tabindex</code> si el elemento también se hace interactivo, por ejemplo, definiendo los eventos de teclado apropiados para los manejadores de eventos.</p>
-
-<h3 id="Ver_también">Ver también</h3>
-
-<ul>
- <li>Atributo HTML global <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
- <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">onkeydown</a></li>
- <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">onkeyup</a></li>
-</ul>
-
-<h2 id="Evitar_usar_el_atributo_tabindex_con_un_valor_mayor_a_cero">Evitar usar el atributo <code>tabindex</code> con un valor mayor a cero</h2>
-
-<p>El atributo <code>tabindex</code> indica que un elemento es enfocable utilizando el teclado. Un valor de cero indica que el elemento es parte del orden de enfoque normal, que está basado en el orden de los elementos en el documento HTML. Un valor positivo pone al elemento adelante de aquellos con el orden normal; elementos con valores positivos son enfocados en el orden del valor de <code>tabindex</code> (1, luego 2, después 3, etc.).</p>
-
-<p>Esto genera una confusión para usuarios que solo usen el teclado cuando el orden del enfoque difiera al orden lógico de la página. Una mejor estrategia es estructurar el documento HTML para que los elementos enfocables estén es un orden lógico, sin la necesidad de reordenarlos con un valor positivo de <code>tabindex</code>.</p>
-
-<h3 id="Ver_también_2">Ver también</h3>
-
-<ul>
- <li>Atributo HTML globlal <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
- <li><a href="https://www.w3.org/WAI/WCAG21/Understanding/focus-order.html">Entendiento el orden del enfoque</a></li>
- <li><a href="http://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html">No use un tabindex mayor que 0</a></li>
-</ul>
-
-<h2 id="Los_elementos_a_los_que_se_les_puede_hacer_click_deben_ser_enfocables_y_deberían_tener_semánticas_interactivas">Los elementos a los que se les puede hacer click deben ser enfocables y deberían tener semánticas interactivas</h2>
-
-<p>Si a un elemento se le puede hacer click con un dispositivo apuntador, como un ratón, entonces también debería enfocable utilizando el teclado, y el usuario debería ser capaz de hacer algo al interactuar con este.</p>
-
-<p>A un elemento se le puede hacer click si tiene in manejador de evento<code> onclick</code> definido. Se puede hacer enfocable al añadir un atributo-valor <code>tabindex=0</code>. Se puede hacer que se opere con un teclado al definir un manejador de evento <code>onkeydown</code>; en la mayoría de los casos, la acción tomada por el manejador de eventos debería ser la misma para los dos tipos de eventos</p>
-
-<h3 id="Ver_también_3">Ver también</h3>
-
-<ul>
- <li>El atributo global HTML <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
- <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">onkeydown</a></li>
- <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">onkeyup</a></li>
-</ul>
-
-<h2 id="Los_elementos_interactivos_deben_ser_capaz_de_ser_activos_utilizando_un_teclado">Los elementos interactivos deben ser capaz de ser activos utilizando un teclado</h2>
-
-<p>Si el usuario puede interactuar con un elemento utilizando el tacto o un dispositivo apuntador, entonces el elemento debería ser también capaz de interactuar con el teclado, Es decir, si hay manejadores de evento definidos para los eventos al tacto y al hacer click, también debería haber manejadores de eventos para el teclado. Los manejadores de eventos para el teclado deberían realizar la misma interacción que sus contrapartes con el tacto y al hacer click.</p>
-
-<h3 id="Ver_también_4">Ver también</h3>
-
-<ul>
- <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">onkeydown</a></li>
- <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">onkeyup</a></li>
-</ul>
-
-<h2 id="Los_elementos_interactivos_deben_ser_enfocables">Los elementos interactivos deben ser enfocables</h2>
-
-<p>Si el usuario puede interactuar con un elemento (por ejemplo, usando el tacto o con un dispositivo apuntador) entonces debería ser enfocable utilizando el teclado. Puede hacerse enfocable al añadirle el atributo-valor<code> tabindex=0</code>. Eso añadirá el elemento a la lista de elementos que pueden ser enfocados al presionar la tecla <kbd>Tab</kbd>, en la secuencia en que dichos elementos se encuentran definidos en el documento HTML.</p>
-
-<h3 id="Ver_también_5">Ver también</h3>
-
-<ul>
- <li>Atributo global HTML <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
-</ul>
-
-<h2 id="Elementos_enfocables_deben_tener_un_estilo_al_estar_enfocados">Elementos enfocables deben tener un estilo al estar enfocados</h2>
-
-<p>Cualquier elemento que pueda recibir el enfoque desde el teclado, debería tener un estilo visible que indique cuando el elemento esta enfocado. Se puede hacer esto con la pseudo-clase de CSS <code><a href="/en-US/docs/Web/CSS/:focus">:focus</a></code>.</p>
-
-<p>Elementos enfocables estándar como enlaces y los campos de entrada reciben un estilo especial por parte del navegador de forma predeterminada, por lo que podría no ser necesario especificar un estilo de enfoque para éstos, a menos que se quiera que el estilo de enfoque sea más distintivo.</p>
-
-<p>Si se crean componentes enfocables, se debe estar seguro de que también se defina el estilo de enfoque para éstos.</p>
-
-<p>If you create your own focusable components, be sure that you also define focus styling for them.</p>
-
-<h3 id="Ver_también_6">Ver también</h3>
-
-<ul>
- <li><a href="https://www.w3.org/WAI/WCAG21/Techniques/css/C15.html">Utilizando CSS para cambiar la presentación de un componente UI cuando reciba el enfoque</a></li>
-</ul>
diff --git a/files/es/web/accessibility/aria/aria_techniques/usando_el_atributo_aria-required/index.html b/files/es/web/accessibility/aria/aria_techniques/usando_el_atributo_aria-required/index.html
deleted file mode 100644
index 6d744bb956..0000000000
--- a/files/es/web/accessibility/aria/aria_techniques/usando_el_atributo_aria-required/index.html
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: Usando el atributo aria-required
-slug: Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_atributo_aria-required
-tags:
-  - Accesibilidad
-translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-required_attribute
----
-<h3 id="Descripción">Descripción</h3>
-
-<p><span class="seoSummary">El atributo <a class="external" href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required"><code>aria-required</code></a> es usado para indicar al usuario que un input es requerido en un elemento antes de que un form pueda ser enviado. Este atributo puede ser usado en un form con cualquier elemento HTML típico; no se limita a elementosque tengan un <code>role</code> ARIA asignado.</span></p>
-
-<p>{{ HTMLVersionInline("5") }} ahora tiene el atributo <code>required</code>, pero aria-required todavía es útil para un agente de usuario que no soporta HTML5.</p>
-
-<h3 id="Value">Value</h3>
-
-<p><code>true</code> o <code>false</code> (Default: <code>false</code>)</p>
-
-<h3 id="Posibles_efectos_en_agentes_de_usuario_y_tecnología_asistente.">Posibles efectos en agentes de usuario y tecnología asistente.</h3>
-
-<p>Los lectores de pantalla deben anunciar el campo como requerido.</p>
-
-<p>Nota que este atributo no cambiará automáticamente la presentación del campo.</p>
-
-<div class="note"><strong>Nota:</strong> Las opiniones pueden diferir en cuanto a cómo esta técnica debería ser manejada por la tecnología asistente.  La información prevista arribaes una de esas opciones y por lo tanto no es normativa.</div>
-
-<h3 id="Ejemplos">Ejemplos</h3>
-
-<h4 id="Ejemplo_1_Un_formulario_sencillo">Ejemplo 1: Un formulario sencillo</h4>
-
-<pre class="brush: html"> &lt;form action="post"&gt;
-     &lt;label for="firstName"&gt;First name:&lt;/label&gt;
-     &lt;input id="firstName" type="text" aria-required="true" /&gt;
-     &lt;br/&gt;
-     &lt;label for="lastName"&gt;Last name:&lt;/label&gt;
-     &lt;input id="lastName" type="text" aria-required="true" /&gt;
-     &lt;br/&gt;
-     &lt;label for="streetAddress"&gt;Street address:&lt;/label&gt;
-     &lt;input id="streetAddress" type="text" /&gt;
- &lt;/form&gt;
-</pre>
-
-<h4 id="Ejemplos_en_acción">Ejemplos en acción:</h4>
-
-<p><a class="external" href="http://www.oaa-accessibility.org/examplep/tooltip1/" title="http://www.oaa-accessibility.org/examplep/tooltip1/">Ejemplo de un Tooltip</a> (incluye el uso del atributo <code>aria-required</code>)</p>
-
-<h3 id="Notas">Notas </h3>
-
-<h3 id="Usan_ARIA_roles">Usan ARIA roles</h3>
-
-<ul>
- <li>Combobox</li>
- <li>Gridcell</li>
- <li>Listbox</li>
- <li>Radiogroup</li>
- <li>Spinbutton</li>
- <li><a href="/en/Accessibility/ARIA/ARIA_Techniques/Using_the_textbox_role" title="Usando el role textbox">Textbox</a></li>
- <li>Tree</li>
-</ul>
-
-<h3 id="Técnicas_relacionadas_con_ARIA">Técnicas relacionadas con ARIA</h3>
-
-<ul>
- <li><a href="/en/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-invalid_attribute" title="Usando la propiedad aria-invalid ">Utilizando el atributo aria-invalid</a></li>
-</ul>
-
-<h3 id="Compatibilidad">Compatibilidad</h3>
-
-<p class="comment">Por determinar: Agregar información de soporte para combinaciones comunes de productos UA y AT.</p>
-
-<h3 id="Recursos_adicionales">Recursos adicionales</h3>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required">Especificación WAI-ARIA para <code>aria-required</code></a></li>
- <li><a class="external" href="http://www.w3.org/TR/wai-aria-practices/#ariaform" title="http://www.w3.org/TR/wai-aria-practices/#ariaform">WAI-ARIA Authoring Practices for forms</a></li>
- <li><a href="/en/HTML/HTML5/Constraint_validation" title="Constraint validation">Constraint validation</a> in {{ HTMLVersionInline("5") }}</li>
-</ul>
diff --git a/files/es/web/accessibility/aria/aria_techniques/usando_el_rol_alertdialog/index.html b/files/es/web/accessibility/aria/aria_techniques/usando_el_rol_alertdialog/index.html
deleted file mode 100644
index fad923dd3a..0000000000
--- a/files/es/web/accessibility/aria/aria_techniques/usando_el_rol_alertdialog/index.html
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: Usando el rol alertdialog
-slug: Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_rol_alertdialog
-tags:
-  - ARIA
-  - Accesibilidad
-  - Alertas
-  - Desarrollo web
-  - HTML
-  - agente
-  - alertdialog
-  - modal
-translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role
----
-<h3 id="Descripción">Descripción</h3>
-
-<div class="summary">
-<p>Esta técnica demuestra como usar el rol <code><a class="external" href="http://www.w3.org/TR/2009/WD-wai-aria-20091215/roles#alertdialog" title="http://www.w3.org/TR/2009/WD-wai-aria-20091215/roles#alertdialog">alertdialog</a></code>.</p>
-</div>
-
-<p>El rol <code>alertdialog</code> es utilizado para notificar al usuario información urgenete que demanden la atención inmediata del usuario. Como el nombre implica, <code>alertdialog</code> es un tipo de díalogo. Esto significa que la mayoría de las instrucciones proveidas en la técnica de ''<a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_dialog_role" title="Using the alert role">usando el rol <code>dialog</code></a>' son aplicables al rol <code>alertdialog</code> también: </p>
-
-<ul>
- <li>El díalogo de alerta debe siempre recibir un nombre accesible (a través de <code>aria-labelledby</code> o <code>aria-label</code>), y en la mayoría de los casos el texto de alerta debe ser marcado como la descripción accesible del díalogo de alerta (utilizando <code>aria-describedby</code>).</li>
- <li>A diferencia de alertas regulares, un díalogo de alerta debe tener al menos un control enfocable y el foco debe moverse a ese control cuando el díalogo de alerta aparece. Generalmente los díalogos de alerta tienen al menos un botón de Confirmación, Cerrar o Cancelar que pueder ser usado para moverl el foco. Adicionalmente, díalogos de alerta pueder tener otros controles interactivos tales como campos de texto, pestañas o checkboxes. El enfoque de control al que se debe desplazar depende del propósito del diálogo.</li>
- <li>El orden de la pestaña dentro del díalogo de alerta debe ajustarse.</li>
-</ul>
-
-<p>La diferencia con díalogos normales es que el rol de <code>alertdialog</code> debe ser utilizado únicamente cuando una alerta, error, o advertencia ocurre. En otras palabras, cuando la información o controles de un díalogo requieren la inmediata atención del usuario debe usarse <code>alertdialog</code> en lugar de <code>dialog.</code> Sin embargo, depende del desarrollador hacer esta distinción.</p>
-
-<p>Debido a su carácter urgente los díalogos de alerta deben ser siempre modales.</p>
-
-<div class="note"><strong>Nota: </strong>Este rol solo debe ser usado para mensajes de alerta que tienen controles interactivos asociado. Si un díalogo de alerta solo contiene contenido estático y no tiene controles interactivos, <code>alertdialog</code> es probablemente el rol incorrecto para ser utilizado.. El rol <code>alert</code> debe ser usado en su lugar en éste caso (como se describe en la técnica de <a href="/en/ARIA/ARIA_Techniques/Using_the_alert_role" title="Using the alert role">Utilizando el rol <code>alert</code></a>).</div>
-
-<h3 id="Posibles_efectos_de_agentes_de_usuario_y_tecnología_de_asistencia">Posibles efectos de agentes de usuario y tecnología de asistencia</h3>
-
-<p>Cuando un rol <code>alertdialog</code> es utilizado, el agente de usuario debería hacer lo siguiente:</p>
-
-<ul>
- <li>Exponer el elemento como un díalogo a la API de accesibilidad del sistema operativo.</li>
- <li>Disparar un evento de alerta accesible usando la API de accesibilidad del sistema operativo si lo soporta.</li>
-</ul>
-
-<p>Cuando la aleta de díalogo aparece, los lectores de pantalla deberían anunciar la alerta.</p>
-
-<p>Cuando el díalogo de alerta es etiquetado correctamente y el foco es movido de un control a el interior del díalogo, los lectores de pantalla deberían anunciar el rol accesible del díalogo así como su nombre y su descriipción antes de anunciar el elemento enfocado. </p>
-
-<div class="note"><strong>Nota:</strong> Opiniones pueden diferir en como tecnología de asistencia debe manejar esta técnica. La información proveída arriba es una de éstas opiniones y por lo tanto no es normativa.</div>
-
-<h3 id="Ejemplos">Ejemplos</h3>
-
-<h4 id="Ejemplos_1_Un_díalogo_de_alerta_básico">Ejemplos 1: Un díalogo de alerta básico</h4>
-
-<p>El fragmento de código siguiente muestra como marcar un díalogo de alerta que solo provee un mensaje y un botón de OK.</p>
-
-<pre class="brush: html">&lt;div role="alertdialog" aria-labelledby="tituloDialogo1" aria-describedby="descrDialogo1"&gt;
-  &lt;div role="document" tabindex="0"&gt;
-    &lt;h2 id="tituloDialogo1"&gt;Tu sesión esta apunto de expirar&lt;/h2&gt;
-    &lt;p id="descrDialogo1"&gt;Para extender tu sesión de clic en el botón OK&lt;/p&gt;
-    &lt;button&gt;OK&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/div&gt;</pre>
-
-<h4 id="Ejemplos_en_funcionamiento">Ejemplos en funcionamiento:</h4>
-
-<p>Pendiente</p>
-
-<h3 id="Notas">Notas </h3>
-
-<h3 id="Atributos_ARIA_utilizados">Atributos ARIA utilizados</h3>
-
-<ul>
- <li><a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#dialog" title="http://www.w3.org/TR/wai-aria/roles#dialog">alertdialog</a></li>
- <li><a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-labelledby" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby">aria-labelledby</a></li>
- <li><a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-describedby" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby">aria-describedby</a></li>
-</ul>
-
-<h3 id="Técnicas_ARIA_relacionadas">Técnicas ARIA relacionadas</h3>
-
-<ul>
- <li> <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_dialog_role" title="Using the dialog role">usando el rol <code>dialog</code></a></li>
- <li> <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role" title="Using the alert role">usando el rol <code>alert</code></a></li>
-</ul>
-
-<h3 id="Compatibilidad">Compatibilidad</h3>
-
-<p class="comment">Pendiente: <em>Add support information for common UA and AT product combinations</em></p>
-
-<h3 id="Recursos_adicionales">Recursos adicionales</h3>
diff --git a/files/es/web/accessibility/aria/aria_techniques/using_the_alertdialog_role/index.html b/files/es/web/accessibility/aria/aria_techniques/using_the_alertdialog_role/index.html
new file mode 100644
index 0000000000..8ed9f03ef9
--- /dev/null
+++ b/files/es/web/accessibility/aria/aria_techniques/using_the_alertdialog_role/index.html
@@ -0,0 +1,90 @@
+---
+title: Usando el rol alertdialog
+slug: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role
+tags:
+  - ARIA
+  - Accesibilidad
+  - Alertas
+  - Desarrollo web
+  - HTML
+  - agente
+  - alertdialog
+  - modal
+translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role
+original_slug: Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_rol_alertdialog
+---
+<h3 id="Descripción">Descripción</h3>
+
+<div class="summary">
+<p>Esta técnica demuestra como usar el rol <code><a class="external" href="http://www.w3.org/TR/2009/WD-wai-aria-20091215/roles#alertdialog" title="http://www.w3.org/TR/2009/WD-wai-aria-20091215/roles#alertdialog">alertdialog</a></code>.</p>
+</div>
+
+<p>El rol <code>alertdialog</code> es utilizado para notificar al usuario información urgenete que demanden la atención inmediata del usuario. Como el nombre implica, <code>alertdialog</code> es un tipo de díalogo. Esto significa que la mayoría de las instrucciones proveidas en la técnica de ''<a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_dialog_role" title="Using the alert role">usando el rol <code>dialog</code></a>' son aplicables al rol <code>alertdialog</code> también: </p>
+
+<ul>
+ <li>El díalogo de alerta debe siempre recibir un nombre accesible (a través de <code>aria-labelledby</code> o <code>aria-label</code>), y en la mayoría de los casos el texto de alerta debe ser marcado como la descripción accesible del díalogo de alerta (utilizando <code>aria-describedby</code>).</li>
+ <li>A diferencia de alertas regulares, un díalogo de alerta debe tener al menos un control enfocable y el foco debe moverse a ese control cuando el díalogo de alerta aparece. Generalmente los díalogos de alerta tienen al menos un botón de Confirmación, Cerrar o Cancelar que pueder ser usado para moverl el foco. Adicionalmente, díalogos de alerta pueder tener otros controles interactivos tales como campos de texto, pestañas o checkboxes. El enfoque de control al que se debe desplazar depende del propósito del diálogo.</li>
+ <li>El orden de la pestaña dentro del díalogo de alerta debe ajustarse.</li>
+</ul>
+
+<p>La diferencia con díalogos normales es que el rol de <code>alertdialog</code> debe ser utilizado únicamente cuando una alerta, error, o advertencia ocurre. En otras palabras, cuando la información o controles de un díalogo requieren la inmediata atención del usuario debe usarse <code>alertdialog</code> en lugar de <code>dialog.</code> Sin embargo, depende del desarrollador hacer esta distinción.</p>
+
+<p>Debido a su carácter urgente los díalogos de alerta deben ser siempre modales.</p>
+
+<div class="note"><strong>Nota: </strong>Este rol solo debe ser usado para mensajes de alerta que tienen controles interactivos asociado. Si un díalogo de alerta solo contiene contenido estático y no tiene controles interactivos, <code>alertdialog</code> es probablemente el rol incorrecto para ser utilizado.. El rol <code>alert</code> debe ser usado en su lugar en éste caso (como se describe en la técnica de <a href="/en/ARIA/ARIA_Techniques/Using_the_alert_role" title="Using the alert role">Utilizando el rol <code>alert</code></a>).</div>
+
+<h3 id="Posibles_efectos_de_agentes_de_usuario_y_tecnología_de_asistencia">Posibles efectos de agentes de usuario y tecnología de asistencia</h3>
+
+<p>Cuando un rol <code>alertdialog</code> es utilizado, el agente de usuario debería hacer lo siguiente:</p>
+
+<ul>
+ <li>Exponer el elemento como un díalogo a la API de accesibilidad del sistema operativo.</li>
+ <li>Disparar un evento de alerta accesible usando la API de accesibilidad del sistema operativo si lo soporta.</li>
+</ul>
+
+<p>Cuando la aleta de díalogo aparece, los lectores de pantalla deberían anunciar la alerta.</p>
+
+<p>Cuando el díalogo de alerta es etiquetado correctamente y el foco es movido de un control a el interior del díalogo, los lectores de pantalla deberían anunciar el rol accesible del díalogo así como su nombre y su descriipción antes de anunciar el elemento enfocado. </p>
+
+<div class="note"><strong>Nota:</strong> Opiniones pueden diferir en como tecnología de asistencia debe manejar esta técnica. La información proveída arriba es una de éstas opiniones y por lo tanto no es normativa.</div>
+
+<h3 id="Ejemplos">Ejemplos</h3>
+
+<h4 id="Ejemplos_1_Un_díalogo_de_alerta_básico">Ejemplos 1: Un díalogo de alerta básico</h4>
+
+<p>El fragmento de código siguiente muestra como marcar un díalogo de alerta que solo provee un mensaje y un botón de OK.</p>
+
+<pre class="brush: html">&lt;div role="alertdialog" aria-labelledby="tituloDialogo1" aria-describedby="descrDialogo1"&gt;
+  &lt;div role="document" tabindex="0"&gt;
+    &lt;h2 id="tituloDialogo1"&gt;Tu sesión esta apunto de expirar&lt;/h2&gt;
+    &lt;p id="descrDialogo1"&gt;Para extender tu sesión de clic en el botón OK&lt;/p&gt;
+    &lt;button&gt;OK&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/div&gt;</pre>
+
+<h4 id="Ejemplos_en_funcionamiento">Ejemplos en funcionamiento:</h4>
+
+<p>Pendiente</p>
+
+<h3 id="Notas">Notas </h3>
+
+<h3 id="Atributos_ARIA_utilizados">Atributos ARIA utilizados</h3>
+
+<ul>
+ <li><a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#dialog" title="http://www.w3.org/TR/wai-aria/roles#dialog">alertdialog</a></li>
+ <li><a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-labelledby" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-labelledby">aria-labelledby</a></li>
+ <li><a class="external" href="https://www.w3.org/TR/wai-aria-1.1/#aria-describedby" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-describedby">aria-describedby</a></li>
+</ul>
+
+<h3 id="Técnicas_ARIA_relacionadas">Técnicas ARIA relacionadas</h3>
+
+<ul>
+ <li> <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_dialog_role" title="Using the dialog role">usando el rol <code>dialog</code></a></li>
+ <li> <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role" title="Using the alert role">usando el rol <code>alert</code></a></li>
+</ul>
+
+<h3 id="Compatibilidad">Compatibilidad</h3>
+
+<p class="comment">Pendiente: <em>Add support information for common UA and AT product combinations</em></p>
+
+<h3 id="Recursos_adicionales">Recursos adicionales</h3>
diff --git a/files/es/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.html b/files/es/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.html
new file mode 100644
index 0000000000..ec063afe9c
--- /dev/null
+++ b/files/es/web/accessibility/aria/aria_techniques/using_the_aria-required_attribute/index.html
@@ -0,0 +1,77 @@
+---
+title: Usando el atributo aria-required
+slug: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-required_attribute
+tags:
+  - Accesibilidad
+translation_of: Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-required_attribute
+original_slug: Web/Accessibility/ARIA/ARIA_Techniques/Usando_el_atributo_aria-required
+---
+<h3 id="Descripción">Descripción</h3>
+
+<p><span class="seoSummary">El atributo <a class="external" href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required"><code>aria-required</code></a> es usado para indicar al usuario que un input es requerido en un elemento antes de que un form pueda ser enviado. Este atributo puede ser usado en un form con cualquier elemento HTML típico; no se limita a elementosque tengan un <code>role</code> ARIA asignado.</span></p>
+
+<p>{{ HTMLVersionInline("5") }} ahora tiene el atributo <code>required</code>, pero aria-required todavía es útil para un agente de usuario que no soporta HTML5.</p>
+
+<h3 id="Value">Value</h3>
+
+<p><code>true</code> o <code>false</code> (Default: <code>false</code>)</p>
+
+<h3 id="Posibles_efectos_en_agentes_de_usuario_y_tecnología_asistente.">Posibles efectos en agentes de usuario y tecnología asistente.</h3>
+
+<p>Los lectores de pantalla deben anunciar el campo como requerido.</p>
+
+<p>Nota que este atributo no cambiará automáticamente la presentación del campo.</p>
+
+<div class="note"><strong>Nota:</strong> Las opiniones pueden diferir en cuanto a cómo esta técnica debería ser manejada por la tecnología asistente.  La información prevista arribaes una de esas opciones y por lo tanto no es normativa.</div>
+
+<h3 id="Ejemplos">Ejemplos</h3>
+
+<h4 id="Ejemplo_1_Un_formulario_sencillo">Ejemplo 1: Un formulario sencillo</h4>
+
+<pre class="brush: html"> &lt;form action="post"&gt;
+     &lt;label for="firstName"&gt;First name:&lt;/label&gt;
+     &lt;input id="firstName" type="text" aria-required="true" /&gt;
+     &lt;br/&gt;
+     &lt;label for="lastName"&gt;Last name:&lt;/label&gt;
+     &lt;input id="lastName" type="text" aria-required="true" /&gt;
+     &lt;br/&gt;
+     &lt;label for="streetAddress"&gt;Street address:&lt;/label&gt;
+     &lt;input id="streetAddress" type="text" /&gt;
+ &lt;/form&gt;
+</pre>
+
+<h4 id="Ejemplos_en_acción">Ejemplos en acción:</h4>
+
+<p><a class="external" href="http://www.oaa-accessibility.org/examplep/tooltip1/" title="http://www.oaa-accessibility.org/examplep/tooltip1/">Ejemplo de un Tooltip</a> (incluye el uso del atributo <code>aria-required</code>)</p>
+
+<h3 id="Notas">Notas </h3>
+
+<h3 id="Usan_ARIA_roles">Usan ARIA roles</h3>
+
+<ul>
+ <li>Combobox</li>
+ <li>Gridcell</li>
+ <li>Listbox</li>
+ <li>Radiogroup</li>
+ <li>Spinbutton</li>
+ <li><a href="/en/Accessibility/ARIA/ARIA_Techniques/Using_the_textbox_role" title="Usando el role textbox">Textbox</a></li>
+ <li>Tree</li>
+</ul>
+
+<h3 id="Técnicas_relacionadas_con_ARIA">Técnicas relacionadas con ARIA</h3>
+
+<ul>
+ <li><a href="/en/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-invalid_attribute" title="Usando la propiedad aria-invalid ">Utilizando el atributo aria-invalid</a></li>
+</ul>
+
+<h3 id="Compatibilidad">Compatibilidad</h3>
+
+<p class="comment">Por determinar: Agregar información de soporte para combinaciones comunes de productos UA y AT.</p>
+
+<h3 id="Recursos_adicionales">Recursos adicionales</h3>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required" title="http://www.w3.org/TR/wai-aria/states_and_properties#aria-required">Especificación WAI-ARIA para <code>aria-required</code></a></li>
+ <li><a class="external" href="http://www.w3.org/TR/wai-aria-practices/#ariaform" title="http://www.w3.org/TR/wai-aria-practices/#ariaform">WAI-ARIA Authoring Practices for forms</a></li>
+ <li><a href="/en/HTML/HTML5/Constraint_validation" title="Constraint validation">Constraint validation</a> in {{ HTMLVersionInline("5") }}</li>
+</ul>
diff --git a/files/es/web/accessibility/aria/forms/alertas/index.html b/files/es/web/accessibility/aria/forms/alertas/index.html
deleted file mode 100644
index 65cc3d3d09..0000000000
--- a/files/es/web/accessibility/aria/forms/alertas/index.html
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: Alertas
-slug: Web/Accessibility/ARIA/forms/alertas
-tags:
-  - ARIA
-  - Accesibilidad
-  - Forms
-  - Web
-  - formulários
-translation_of: Web/Accessibility/ARIA/forms/alerts
----
-<h2 id="El_problema">El problema</h2>
-
-<p>Tienes un formulario — un formulario de contacto — por ejemplo, en el que deseas poner algún control de error accesible. Ejemplos de problemas comunes incluyen direcciones de correo electrónico que no son válidas o un campo de nombre que no contiene al menos un nombre o apellido.</p>
-
-<h2 id="El_formulario">El formulario</h2>
-
-<p>Primero, lee acerca de la <code><a href="/es/docs/Web/Accessibility/ARIA/forms/Basic_form_hints#Required_and_invalid_fields" title="/es/Web/Accessibility/ARIA/forms/Basic_form_hints">técnica requerida por aria</a></code> si no lo has hecho, ya que esta técnica amplía a esa.</p>
-
-<p>Aquí hay un sencillo formulario:</p>
-
-<pre class="brush: html notranslate"> &lt;form method="post" action="post.php"&gt;
-   &lt;fieldset&gt;
-     &lt;legend&gt;Introduce tus datos de contacto&lt;/legend&gt;
-     &lt;label for="name"&gt;Tu nombre (obligatorio):&lt;/label&gt;
-     &lt;input name="name" id="name" aria-required="true"/&gt;
-     &lt;br /&gt;
-     &lt;label for="email"&gt;Dirección de correo electrónico (obligatorio):&lt;/label&gt;
-     &lt;input name="email" id="email" aria-required="true"/&gt;
-     &lt;br /&gt;
-     &lt;label for="website"&gt;Sitio web (opcional):&lt;/label&gt;
-     &lt;input name="website" id="website"/&gt;
-   &lt;/fieldset&gt;
-   &lt;label for="message"&gt;Por favor ingresa tu mensaje (requerido):&lt;/label&gt;
-   &lt;br /&gt;
-   &lt;textarea name="message" id="message" rows="5" cols="80"
-             aria-required="true"&gt;&lt;/textarea&gt;
-   &lt;br /&gt;
-   &lt;input type="submit" name="submit" value="Enviar mensaje"/&gt;
-   &lt;input type="reset" name="reset" value="Restablecer formulario"/&gt;
- &lt;/form&gt;
-</pre>
-
-<h2 id="Verificación_de_validez_y_notificación_al_usuario"><span class="mw-headline" id="Checking_for_validity_and_notifying_the_user">Verificación de validez y notificación al usuario</span></h2>
-
-<p>La validación de formularios consta de varios pasos:</p>
-
-<ol>
- <li>Verificando si la dirección de correo electrónico o el nombre ingresado son válidos. Cada campo tiene un conjunto de criterios que se deben cumplir para aprobar la validación. Para simplificar este ejemplo, verificaremos si la dirección de correo electrónico contiene el símbolo "@" y si la entrada del nombre contiene al menos 1 carácter.</li>
- <li>Si no se cumplen los criterios anteriores, el atributo <code>aria-invalid</code> del campo recibirá un valor de "<code>true</code>".</li>
- <li>Si no se cumplieron los criterios, se notificará al usuario mediante una alerta. En lugar de usar la función "<code>alert</code>" de JavaScript, usaremos un <em>widget WAI-ARIA</em> simple para la notificación. Esto notifica al usuario del error, pero le permite continuar modificando el formulario sin perder el foco (causado por el controlador "<code>onblur</code>" en la función "<code>alert</code>" predeterminada de JavaScript).</li>
-</ol>
-
-<p>A continuación se muestra un código JavaScript de ejemplo que se podría insertar encima de la etiqueta de cierre "<code>head</code>":</p>
-
-<pre class="brush: js notranslate"> &lt;script type="application/javascript"&gt;
- function removeOldAlert()
- {
-   var oldAlert = document.getElementById("alert");
-   if (oldAlert){
-     document.body.removeChild(oldAlert);
-   }
- }
-
- function addAlert(aMsg)
- {
-   removeOldAlert();
-   var newAlert = document.createElement("div");
-   newAlert.setAttribute("role", "alert");
-   newAlert.setAttribute("id", "alert");
-   var msg = document.createTextNode(aMsg);
-   newAlert.appendChild(msg);
-   document.body.appendChild(newAlert);
- }
-
- function checkValidity(aID, aSearchTerm, aMsg)
- {
-   var elem = document.getElementById(aID);
-   var invalid = (elem.value.indexOf(aSearchTerm) &lt; 0);
-   if (invalid) {
-     elem.setAttribute("aria-invalid", "true");
-     addAlert(aMsg);
-   } else {
-     elem.setAttribute("aria-invalid", "false");
-     removeOldAlert();
-   }
- }
- &lt;/script&gt;
-</pre>
-
-<h2 id="La_función_checkValidity"><span class="mw-headline" id="The_checkValidity_function">La función <code>checkValidity</code></span></h2>
-
-<p>El método principal en JavaScript utilizado para la validación de formularios es la función <code>checkValidity</code>. Este método toma tres parámetros: el ID de el <code>input</code> que se va a validar, el término que se busca para asegurar la validez y el mensaje de error que se inserta en la alerta.</p>
-
-<p>Para ver si es válido, la función comprueba si el valor <code>indexOf</code> del <code>input</code> es algo mayor que <code>-1</code>. Se devuelve un valor de <code>-1</code> o menos si el índice del término de búsqueda no se pudo encontrar dentro del valor.</p>
-
-<p>Si no es válido, la función hace dos cosas:</p>
-
-<ol>
- <li>Establece el atributo <code>aria-invalid</code> del elemento en "<code>true</code>", lo que indicará a los lectores de pantalla que hay contenido no válido aquí.</li>
- <li>Llamará a la función <code>addAlert</code> para agregar la alerta con el mensaje de error proporcionado.</li>
-</ol>
-
-<p>Si se encuentra el término de búsqueda, el atributo <code>aria-invalid</code> se restablece a “<code>false</code>”. Además, se eliminan las alertas sobrantes.</p>
-
-<h2 id="La_función_addAlert"><span class="mw-headline" id="The_addAlert_function">La función <code>addAlert</code></span></h2>
-
-<p>Esta función primero elimina las alertas antiguas. La función es simple: busca un elemento con id "<code>alert</code>" y, si lo encuentra, lo elimina del <a href="/es/docs/Mozilla/Tech/XUL/Tutorial/Document_Object_Model">modelo de objetos del documento</a>.</p>
-
-<p>A continuación, la función crea un elemento <code>div</code> para contener el texto de alerta. Obtiene un ID de "<code>alert</code>". Y obtiene un conjunto de roles de "alert". En realidad, está inspirado en ARIA, aunque no dice "aria" en el nombre del atributo. Esto se debe a que ese rol se basa en el <a class="external text" href="http://www.w3.org/TR/xhtml-role/" title="Módulo de atributo de rol XHTML">Módulo de atributos de rol XHTML</a> que simplemente se transfirió a HTML para simplificar.</p>
-
-<p>El texto se agrega al elemento <code>div</code> y el elemento <code>div</code> se agrega al documento.</p>
-
-<p>En el momento en que esto suceda, Firefox lanzará un evento "<code>alert</code>" a las tecnologías de asistencia cuando aparezca este <code>div</code>. La mayoría de los lectores de pantalla la recogerán automáticamente y la pregonarán. Esto es similar a la barra de notificaciones en Firefox que te pregunta si deseas guardar una contraseña. La alerta que acabamos de crear no tiene ningún botón para presionar, solo nos dice lo que está mal.</p>
-
-<h2 id="Modificar_el_evento_onblur"><span class="mw-headline" id="Adding_the_magic_to_the_.E2.80.9Conblur.E2.80.9D_event">Modificar el evento "<code>onblur</code>"</span></h2>
-
-<p>Todo lo que queda ahora es agregar el controlador de eventos. Necesitamos cambiar las dos entradas para el correo electrónico y el nombre para esto:</p>
-
-<pre class="brush: html notranslate"> &lt;input name="name" id="name" aria-required="true"
-        onblur="checkValidity('name', '', '¡Se ingresó un nombre no válido!');"/&gt;
- &lt;br /&gt;
- &lt;input name="email" id="email" aria-required="true"
-        onblur="checkValidity('email', '@', 'Dirección de correo electrónico no válida');"/&gt;
-</pre>
-
-<p><strong>Probar el ejemplo</strong></p>
-
-<p>Si usas Firefox 3 y un lector de pantalla compatible actualmente, intenta lo siguiente:</p>
-
-<ol>
- <li>Ingresa solo tu primer nombre como nombre. Al pulsar la tecla de tabulación, escucharás una alerta que te indicará que ingresaste un nombre no válido. Luego puedes volver atrás con <code>Mayús-Tab</code> y corregir el error.</li>
- <li>Ingresa una dirección de correo electrónico sin el símbolo “@”. Cuando salgas de este campo, deberías escuchar una advertencia que dice que no ingresaste una dirección de correo electrónico válida.</li>
-</ol>
-
-<p>En ambos casos, al volver a enfocar el campo en cuestión, tu lector de pantalla debería decirte que este campo no es válido. JAWS 9 admite esto, pero JAWS 8 no, por lo que es posible que esto no funcione en todas las versiones de los lectores de pantalla compatibles.</p>
-
-<h2 id="Algunas_preguntas_que_podrías_tener"><span class="mw-headline" id="A_few_questions_that_you_might_have">Algunas preguntas que podrías tener</span></h2>
-
-<dl>
- <dt>P. ¿Por qué pusiste “<code>(obligatorio)</code>” en el texto de la etiqueta y el atributo <code>aria-required</code> en algunas de las entradas?</dt>
- <dd>R. Si se tratara de un formulario real en vivo y el sitio estuviera siendo visitado por un navegador que aún no es compatible con ARIA, aún quisiéramos dar una indicación de que este es un campo obligatorio.</dd>
- <dt>P. ¿Por qué no vuelve a enfocarse en el campo no válido automáticamente?</dt>
- <dd>R. Porque esto no está permitido por las especificaciones de la API de Windows y posiblemente otras. Además, dejar que el enfoque salte sin interacción real del usuario con demasiada frecuencia no es algo agradable en general. </dd>
-</dl>
-
-<div class="warning">Aún no definido: reconsideremos esto ─ personalmente, creo que establecer el enfoque podría ser bueno si se hace sin causar una trampa en el teclado.</div>
diff --git a/files/es/web/accessibility/aria/forms/alerts/index.html b/files/es/web/accessibility/aria/forms/alerts/index.html
new file mode 100644
index 0000000000..5500c28574
--- /dev/null
+++ b/files/es/web/accessibility/aria/forms/alerts/index.html
@@ -0,0 +1,148 @@
+---
+title: Alertas
+slug: Web/Accessibility/ARIA/forms/alerts
+tags:
+  - ARIA
+  - Accesibilidad
+  - Forms
+  - Web
+  - formulários
+translation_of: Web/Accessibility/ARIA/forms/alerts
+original_slug: Web/Accessibility/ARIA/forms/alertas
+---
+<h2 id="El_problema">El problema</h2>
+
+<p>Tienes un formulario — un formulario de contacto — por ejemplo, en el que deseas poner algún control de error accesible. Ejemplos de problemas comunes incluyen direcciones de correo electrónico que no son válidas o un campo de nombre que no contiene al menos un nombre o apellido.</p>
+
+<h2 id="El_formulario">El formulario</h2>
+
+<p>Primero, lee acerca de la <code><a href="/es/docs/Web/Accessibility/ARIA/forms/Basic_form_hints#Required_and_invalid_fields" title="/es/Web/Accessibility/ARIA/forms/Basic_form_hints">técnica requerida por aria</a></code> si no lo has hecho, ya que esta técnica amplía a esa.</p>
+
+<p>Aquí hay un sencillo formulario:</p>
+
+<pre class="brush: html notranslate"> &lt;form method="post" action="post.php"&gt;
+   &lt;fieldset&gt;
+     &lt;legend&gt;Introduce tus datos de contacto&lt;/legend&gt;
+     &lt;label for="name"&gt;Tu nombre (obligatorio):&lt;/label&gt;
+     &lt;input name="name" id="name" aria-required="true"/&gt;
+     &lt;br /&gt;
+     &lt;label for="email"&gt;Dirección de correo electrónico (obligatorio):&lt;/label&gt;
+     &lt;input name="email" id="email" aria-required="true"/&gt;
+     &lt;br /&gt;
+     &lt;label for="website"&gt;Sitio web (opcional):&lt;/label&gt;
+     &lt;input name="website" id="website"/&gt;
+   &lt;/fieldset&gt;
+   &lt;label for="message"&gt;Por favor ingresa tu mensaje (requerido):&lt;/label&gt;
+   &lt;br /&gt;
+   &lt;textarea name="message" id="message" rows="5" cols="80"
+             aria-required="true"&gt;&lt;/textarea&gt;
+   &lt;br /&gt;
+   &lt;input type="submit" name="submit" value="Enviar mensaje"/&gt;
+   &lt;input type="reset" name="reset" value="Restablecer formulario"/&gt;
+ &lt;/form&gt;
+</pre>
+
+<h2 id="Verificación_de_validez_y_notificación_al_usuario"><span class="mw-headline" id="Checking_for_validity_and_notifying_the_user">Verificación de validez y notificación al usuario</span></h2>
+
+<p>La validación de formularios consta de varios pasos:</p>
+
+<ol>
+ <li>Verificando si la dirección de correo electrónico o el nombre ingresado son válidos. Cada campo tiene un conjunto de criterios que se deben cumplir para aprobar la validación. Para simplificar este ejemplo, verificaremos si la dirección de correo electrónico contiene el símbolo "@" y si la entrada del nombre contiene al menos 1 carácter.</li>
+ <li>Si no se cumplen los criterios anteriores, el atributo <code>aria-invalid</code> del campo recibirá un valor de "<code>true</code>".</li>
+ <li>Si no se cumplieron los criterios, se notificará al usuario mediante una alerta. En lugar de usar la función "<code>alert</code>" de JavaScript, usaremos un <em>widget WAI-ARIA</em> simple para la notificación. Esto notifica al usuario del error, pero le permite continuar modificando el formulario sin perder el foco (causado por el controlador "<code>onblur</code>" en la función "<code>alert</code>" predeterminada de JavaScript).</li>
+</ol>
+
+<p>A continuación se muestra un código JavaScript de ejemplo que se podría insertar encima de la etiqueta de cierre "<code>head</code>":</p>
+
+<pre class="brush: js notranslate"> &lt;script type="application/javascript"&gt;
+ function removeOldAlert()
+ {
+   var oldAlert = document.getElementById("alert");
+   if (oldAlert){
+     document.body.removeChild(oldAlert);
+   }
+ }
+
+ function addAlert(aMsg)
+ {
+   removeOldAlert();
+   var newAlert = document.createElement("div");
+   newAlert.setAttribute("role", "alert");
+   newAlert.setAttribute("id", "alert");
+   var msg = document.createTextNode(aMsg);
+   newAlert.appendChild(msg);
+   document.body.appendChild(newAlert);
+ }
+
+ function checkValidity(aID, aSearchTerm, aMsg)
+ {
+   var elem = document.getElementById(aID);
+   var invalid = (elem.value.indexOf(aSearchTerm) &lt; 0);
+   if (invalid) {
+     elem.setAttribute("aria-invalid", "true");
+     addAlert(aMsg);
+   } else {
+     elem.setAttribute("aria-invalid", "false");
+     removeOldAlert();
+   }
+ }
+ &lt;/script&gt;
+</pre>
+
+<h2 id="La_función_checkValidity"><span class="mw-headline" id="The_checkValidity_function">La función <code>checkValidity</code></span></h2>
+
+<p>El método principal en JavaScript utilizado para la validación de formularios es la función <code>checkValidity</code>. Este método toma tres parámetros: el ID de el <code>input</code> que se va a validar, el término que se busca para asegurar la validez y el mensaje de error que se inserta en la alerta.</p>
+
+<p>Para ver si es válido, la función comprueba si el valor <code>indexOf</code> del <code>input</code> es algo mayor que <code>-1</code>. Se devuelve un valor de <code>-1</code> o menos si el índice del término de búsqueda no se pudo encontrar dentro del valor.</p>
+
+<p>Si no es válido, la función hace dos cosas:</p>
+
+<ol>
+ <li>Establece el atributo <code>aria-invalid</code> del elemento en "<code>true</code>", lo que indicará a los lectores de pantalla que hay contenido no válido aquí.</li>
+ <li>Llamará a la función <code>addAlert</code> para agregar la alerta con el mensaje de error proporcionado.</li>
+</ol>
+
+<p>Si se encuentra el término de búsqueda, el atributo <code>aria-invalid</code> se restablece a “<code>false</code>”. Además, se eliminan las alertas sobrantes.</p>
+
+<h2 id="La_función_addAlert"><span class="mw-headline" id="The_addAlert_function">La función <code>addAlert</code></span></h2>
+
+<p>Esta función primero elimina las alertas antiguas. La función es simple: busca un elemento con id "<code>alert</code>" y, si lo encuentra, lo elimina del <a href="/es/docs/Mozilla/Tech/XUL/Tutorial/Document_Object_Model">modelo de objetos del documento</a>.</p>
+
+<p>A continuación, la función crea un elemento <code>div</code> para contener el texto de alerta. Obtiene un ID de "<code>alert</code>". Y obtiene un conjunto de roles de "alert". En realidad, está inspirado en ARIA, aunque no dice "aria" en el nombre del atributo. Esto se debe a que ese rol se basa en el <a class="external text" href="http://www.w3.org/TR/xhtml-role/" title="Módulo de atributo de rol XHTML">Módulo de atributos de rol XHTML</a> que simplemente se transfirió a HTML para simplificar.</p>
+
+<p>El texto se agrega al elemento <code>div</code> y el elemento <code>div</code> se agrega al documento.</p>
+
+<p>En el momento en que esto suceda, Firefox lanzará un evento "<code>alert</code>" a las tecnologías de asistencia cuando aparezca este <code>div</code>. La mayoría de los lectores de pantalla la recogerán automáticamente y la pregonarán. Esto es similar a la barra de notificaciones en Firefox que te pregunta si deseas guardar una contraseña. La alerta que acabamos de crear no tiene ningún botón para presionar, solo nos dice lo que está mal.</p>
+
+<h2 id="Modificar_el_evento_onblur"><span class="mw-headline" id="Adding_the_magic_to_the_.E2.80.9Conblur.E2.80.9D_event">Modificar el evento "<code>onblur</code>"</span></h2>
+
+<p>Todo lo que queda ahora es agregar el controlador de eventos. Necesitamos cambiar las dos entradas para el correo electrónico y el nombre para esto:</p>
+
+<pre class="brush: html notranslate"> &lt;input name="name" id="name" aria-required="true"
+        onblur="checkValidity('name', '', '¡Se ingresó un nombre no válido!');"/&gt;
+ &lt;br /&gt;
+ &lt;input name="email" id="email" aria-required="true"
+        onblur="checkValidity('email', '@', 'Dirección de correo electrónico no válida');"/&gt;
+</pre>
+
+<p><strong>Probar el ejemplo</strong></p>
+
+<p>Si usas Firefox 3 y un lector de pantalla compatible actualmente, intenta lo siguiente:</p>
+
+<ol>
+ <li>Ingresa solo tu primer nombre como nombre. Al pulsar la tecla de tabulación, escucharás una alerta que te indicará que ingresaste un nombre no válido. Luego puedes volver atrás con <code>Mayús-Tab</code> y corregir el error.</li>
+ <li>Ingresa una dirección de correo electrónico sin el símbolo “@”. Cuando salgas de este campo, deberías escuchar una advertencia que dice que no ingresaste una dirección de correo electrónico válida.</li>
+</ol>
+
+<p>En ambos casos, al volver a enfocar el campo en cuestión, tu lector de pantalla debería decirte que este campo no es válido. JAWS 9 admite esto, pero JAWS 8 no, por lo que es posible que esto no funcione en todas las versiones de los lectores de pantalla compatibles.</p>
+
+<h2 id="Algunas_preguntas_que_podrías_tener"><span class="mw-headline" id="A_few_questions_that_you_might_have">Algunas preguntas que podrías tener</span></h2>
+
+<dl>
+ <dt>P. ¿Por qué pusiste “<code>(obligatorio)</code>” en el texto de la etiqueta y el atributo <code>aria-required</code> en algunas de las entradas?</dt>
+ <dd>R. Si se tratara de un formulario real en vivo y el sitio estuviera siendo visitado por un navegador que aún no es compatible con ARIA, aún quisiéramos dar una indicación de que este es un campo obligatorio.</dd>
+ <dt>P. ¿Por qué no vuelve a enfocarse en el campo no válido automáticamente?</dt>
+ <dd>R. Porque esto no está permitido por las especificaciones de la API de Windows y posiblemente otras. Además, dejar que el enfoque salte sin interacción real del usuario con demasiada frecuencia no es algo agradable en general. </dd>
+</dl>
+
+<div class="warning">Aún no definido: reconsideremos esto ─ personalmente, creo que establecer el enfoque podría ser bueno si se hace sin causar una trampa en el teclado.</div>
diff --git a/files/es/web/accessibility/aria/forms/basic_form_hints/index.html b/files/es/web/accessibility/aria/forms/basic_form_hints/index.html
new file mode 100644
index 0000000000..0b12c2375c
--- /dev/null
+++ b/files/es/web/accessibility/aria/forms/basic_form_hints/index.html
@@ -0,0 +1,116 @@
+---
+title: Consejos básicos para formularios
+slug: Web/Accessibility/ARIA/forms/Basic_form_hints
+tags:
+  - ARIA
+  - Accesibilidad
+  - formulários
+translation_of: Web/Accessibility/ARIA/forms/Basic_form_hints
+original_slug: Web/Accessibility/ARIA/forms/consejos_basicos_para_formularios
+---
+<p><span class="seoSummary">Cuando se implementan formularios utilizando elementos relacionados con los formularios HTML tradicionales, es importante proveer etiquetas para los controles y explicitamente asociar una etiqueta con su control.</span> Cuando un usuario de lector de pantalla navega una página, el lector de pantalla describirá los controles del formulario. Sin una asociación directa entre el control y su etiqueta, el lector de pantalla no tiene forma de saber que etiqueta es la correcta para el control.</p>
+
+<p>El ejemplo siguiente muestra un formulario sencillo con etiquetas. Note que cada elemento {{ HTMLElement("input") }} tiene un <code>id</code>, y cada elemento {{ HTMLElement("label") }} tiene un atributo <code>for</code>, indicando el <code>id</code> asociado al {{ HTMLElement("input") }}.</p>
+
+<pre class="brush: html">&lt;form&gt;
+  &lt;ul&gt;
+    &lt;li&gt;
+      &lt;input id="vino-1" type="checkbox" value="riesling"/&gt;
+      &lt;label for="vino-1"&gt;Berg Rottland Riesling&lt;/label&gt;
+    &lt;/li&gt;
+    &lt;li&gt;
+      &lt;input id="vino-2" type="checkbox" value="pinot-blanc"/&gt;
+      &lt;label for="vino-2"&gt;Pinot Blanc&lt;/label&gt;
+    &lt;/li&gt;
+    &lt;li&gt;
+      &lt;input id="vino-3" type="checkbox" value="pinot-grigio"/&gt;
+      &lt;label for="vino-3"&gt;Pinot Grigio&lt;/label&gt;
+    &lt;/li&gt;
+    &lt;li&gt;
+      &lt;input id="vino-4" type="checkbox" value="gewurztraminer"/&gt;
+      &lt;label for="vino-4"&gt;Gewürztraminer&lt;/label&gt;
+    &lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/form&gt;
+</pre>
+
+<h2 id="Labeling_with_ARIA" name="Labeling_with_ARIA">Etiquetando con ARIA</h2>
+
+<p>El elemento HTML {{ HTMLElement("label") }} es apropiado para elementos relacionados a formularios, pero muchos controles de formulario son implementados como un widget dinámico de JavaScript, utilizando {{ HTMLElement("div") }}s o {{ HTMLElement("span") }}s. <a href="https://www.w3.org/WAI/standards-guidelines/aria/" title="http://www.w3.org/WAI/intro/aria.php">WAI-ARIA</a>, la especificación <strong>Accessible Rich Internet Applications</strong> de W3C's <a href="http://www.w3.org/WAI/" title="http://www.w3.org/WAI/">Web Accessibility Initiative</a>, provee el atributo <code><a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-labelledby" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-labelledby">aria-labelledby</a></code> para estos casos.</p>
+
+<p>El siguiente ejemplo muestra un grupo de radio buttons implementado usando una lista no ordenada. Note que en la línea 3, el elemento {{ HTMLElement("ul") }} define el atributo <code>aria-labelledby</code> a <code>etiqueta_rg1</code>, el <code>id</code> de elemento {{ HTMLElement("h3") }} en la línea 1, que es la etiqueta para el grupo de controles radio.</p>
+
+<pre class="brush: html">&lt;h3 id="etiqueta_rg1"&gt;Opciones para el almuerzo&lt;/h3&gt;
+
+&lt;ul class="radiogroup" id="rg1"  role="radiogroup" aria-labelledby="etiqueta_rg1"&gt;
+  &lt;li id="r1"  tabindex="-1" role="radio" aria-checked="false"&gt;
+    &lt;img role="presentation" src="radio-unchecked.gif" /&gt; Thai
+  &lt;/li&gt;
+  &lt;li id="r2"  tabindex="-1" role="radio"  aria-checked="false"&gt;
+    &lt;img role="presentation" src="radio-unchecked.gif" /&gt; Subway
+  &lt;/li&gt;
+  &lt;li id="r3"   tabindex="0" role="radio" aria-checked="true"&gt;
+    &lt;img role="presentation" src="radio-checked.gif" /&gt; Radio Maria
+  &lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
+<h2 id="Describing_with_ARIA" name="Describing_with_ARIA">Describiendo con ARIA</h2>
+
+<p>Los controles de formulario en ocasiones tienen una descripción asociada con ellos, además de la descripción de la etiqueta. ARIA provee el atributo <code><a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-describedby" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-describedby">aria-describedby</a></code>  para directamente asociar la descripción con el control.</p>
+
+<p>El ejemplo siguiente muestra un elemento {{ HTMLElement("button") }} que es descrito por una oración de un diferento elemento {{ HTMLElement("div") }}. El atributo <code>aria-describedby</code> en el {{ HTMLElement("button") }} referencia al <code>id</code> del {{ HTMLElement("div") }}.</p>
+
+<pre class="brush: html">&lt;button aria-describedby="descriptionRevert"&gt;Revertir&lt;/button&gt;
+&lt;div id="descriptionRevert"&gt;Revertir deshará cualquier cambio que se haya hecho desde la última que se guardo.&lt;/div&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: El atributo <code>aria-describedby</code> es utilizado para otros própositos además de los controles de formularios.</p>
+</div>
+
+<h2 id="Required_and_invalid_fields" name="Required_and_invalid_fields">Campos requeridos e inválidos</h2>
+
+<div class="note">
+<p><strong>Nota</strong>: Ahora que <code>required</code> esta disponible para más del 97% de usuarios globalmente, no se recomienda que se use al mismo tiempo <code>required</code> y <code>aria-required</code>.</p>
+</div>
+
+<p>Los desarrolladores Web típicamente usan estrategias de presentación para inidicar campos requeridos o inválidos. Tecnologías asistivas (Assistive technologies - ATs) no necesariamente pueden inferir de la presentación. ARIA provee atributos para indicar que controles de formulario son requeridos o inválidos:</p>
+
+<ul>
+ <li>La propiedad <a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-required" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-required"><strong>aria-required</strong></a> puede ser aplicada a un elemento de un formulario para indicar a a una AT que es requerida para completar el formulario.</li>
+ <li>El estado <a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-invalid" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-invalid"><strong>aria-invalid</strong></a> puede ser aplicado programáticamente, para indicar al AT que campos de información tienen información incorrecta para que el usuario sepa que ingresaron información inválida.</li>
+</ul>
+
+<p>El siguiente ejemplo muestra un formulario sencillo con tres campos. En las líneas 4 y 12, los atributos <code>aria-required</code> son establecidos a true (en adición a los asteriscos junto a las etiquetas), indicando que los campos de nombre y email son requeridos. La segunda parte del ejemplo, es un fragmento de código de JavaScript que valida el formato del email, y establece el atributo <code>aria-invalid</code> del campo email (línea 12 del HTML) de acuerdo al resultado (adicionalmente de cambiar la presentación del elemento).</p>
+
+<pre class="brush: html">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="nombre"&gt;* Nombre:&lt;/label&gt;
+    &lt;input type="text" value="nombre" id="nombre" aria-required="true"/&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="telefono"&gt;Phone:&lt;/label&gt;
+    &lt;input type="text" value="telefono" id="telefono" aria-required="false"/&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="email"&gt;* E-mail:&lt;/label&gt;
+    &lt;input type="text" value="email" id="email" aria-required="true"/&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>The script that validates the form entry would look something like this:</p>
+
+<pre class="brush: js">var validar = function () {
+  var elementoEmail = document.getElementById(emailFieldId);
+  var esValido = emailValid(formData.email); // regresa verdadero si es válido, de otro modo devuelve falso.
+
+  elementoEmail.setAttribute("aria-invalid", !esValido);
+  setElementBorderColour(elementoEmail, esValido); // establece el borde de color rojo si el segundo argumento es falso
+};
+</pre>
+
+<h2 id="Providing_Helpful_Error_Messages" name="Providing_Helpful_Error_Messages">Ofreciendo Mensajes de Error Útiles</h2>
+
+<p>Lea como usar <a href="/en-US/docs/aria/forms/alerts" title="aria/forms/alerts">alertas ARIA para mejorar formularios</a>.</p>
+
+<p>Para mayor orientación en el uso de ARIA para la accesibilidad de los formularios, vea el documento <a href="http://www.w3.org/TR/wai-aria-practices/" title="http://www.w3.org/TR/wai-aria-practices/">Prácticas de Autoria WAI-ARIA (WAI-ARIA Authoring Practices</a>).</p>
diff --git a/files/es/web/accessibility/aria/forms/consejos_basicos_para_formularios/index.html b/files/es/web/accessibility/aria/forms/consejos_basicos_para_formularios/index.html
deleted file mode 100644
index 48f2dba3e3..0000000000
--- a/files/es/web/accessibility/aria/forms/consejos_basicos_para_formularios/index.html
+++ /dev/null
@@ -1,115 +0,0 @@
----
-title: Consejos básicos para formularios
-slug: Web/Accessibility/ARIA/forms/consejos_basicos_para_formularios
-tags:
-  - ARIA
-  - Accesibilidad
-  - formulários
-translation_of: Web/Accessibility/ARIA/forms/Basic_form_hints
----
-<p><span class="seoSummary">Cuando se implementan formularios utilizando elementos relacionados con los formularios HTML tradicionales, es importante proveer etiquetas para los controles y explicitamente asociar una etiqueta con su control.</span> Cuando un usuario de lector de pantalla navega una página, el lector de pantalla describirá los controles del formulario. Sin una asociación directa entre el control y su etiqueta, el lector de pantalla no tiene forma de saber que etiqueta es la correcta para el control.</p>
-
-<p>El ejemplo siguiente muestra un formulario sencillo con etiquetas. Note que cada elemento {{ HTMLElement("input") }} tiene un <code>id</code>, y cada elemento {{ HTMLElement("label") }} tiene un atributo <code>for</code>, indicando el <code>id</code> asociado al {{ HTMLElement("input") }}.</p>
-
-<pre class="brush: html">&lt;form&gt;
-  &lt;ul&gt;
-    &lt;li&gt;
-      &lt;input id="vino-1" type="checkbox" value="riesling"/&gt;
-      &lt;label for="vino-1"&gt;Berg Rottland Riesling&lt;/label&gt;
-    &lt;/li&gt;
-    &lt;li&gt;
-      &lt;input id="vino-2" type="checkbox" value="pinot-blanc"/&gt;
-      &lt;label for="vino-2"&gt;Pinot Blanc&lt;/label&gt;
-    &lt;/li&gt;
-    &lt;li&gt;
-      &lt;input id="vino-3" type="checkbox" value="pinot-grigio"/&gt;
-      &lt;label for="vino-3"&gt;Pinot Grigio&lt;/label&gt;
-    &lt;/li&gt;
-    &lt;li&gt;
-      &lt;input id="vino-4" type="checkbox" value="gewurztraminer"/&gt;
-      &lt;label for="vino-4"&gt;Gewürztraminer&lt;/label&gt;
-    &lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/form&gt;
-</pre>
-
-<h2 id="Labeling_with_ARIA" name="Labeling_with_ARIA">Etiquetando con ARIA</h2>
-
-<p>El elemento HTML {{ HTMLElement("label") }} es apropiado para elementos relacionados a formularios, pero muchos controles de formulario son implementados como un widget dinámico de JavaScript, utilizando {{ HTMLElement("div") }}s o {{ HTMLElement("span") }}s. <a href="https://www.w3.org/WAI/standards-guidelines/aria/" title="http://www.w3.org/WAI/intro/aria.php">WAI-ARIA</a>, la especificación <strong>Accessible Rich Internet Applications</strong> de W3C's <a href="http://www.w3.org/WAI/" title="http://www.w3.org/WAI/">Web Accessibility Initiative</a>, provee el atributo <code><a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-labelledby" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-labelledby">aria-labelledby</a></code> para estos casos.</p>
-
-<p>El siguiente ejemplo muestra un grupo de radio buttons implementado usando una lista no ordenada. Note que en la línea 3, el elemento {{ HTMLElement("ul") }} define el atributo <code>aria-labelledby</code> a <code>etiqueta_rg1</code>, el <code>id</code> de elemento {{ HTMLElement("h3") }} en la línea 1, que es la etiqueta para el grupo de controles radio.</p>
-
-<pre class="brush: html">&lt;h3 id="etiqueta_rg1"&gt;Opciones para el almuerzo&lt;/h3&gt;
-
-&lt;ul class="radiogroup" id="rg1"  role="radiogroup" aria-labelledby="etiqueta_rg1"&gt;
-  &lt;li id="r1"  tabindex="-1" role="radio" aria-checked="false"&gt;
-    &lt;img role="presentation" src="radio-unchecked.gif" /&gt; Thai
-  &lt;/li&gt;
-  &lt;li id="r2"  tabindex="-1" role="radio"  aria-checked="false"&gt;
-    &lt;img role="presentation" src="radio-unchecked.gif" /&gt; Subway
-  &lt;/li&gt;
-  &lt;li id="r3"   tabindex="0" role="radio" aria-checked="true"&gt;
-    &lt;img role="presentation" src="radio-checked.gif" /&gt; Radio Maria
-  &lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-
-<h2 id="Describing_with_ARIA" name="Describing_with_ARIA">Describiendo con ARIA</h2>
-
-<p>Los controles de formulario en ocasiones tienen una descripción asociada con ellos, además de la descripción de la etiqueta. ARIA provee el atributo <code><a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-describedby" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-describedby">aria-describedby</a></code>  para directamente asociar la descripción con el control.</p>
-
-<p>El ejemplo siguiente muestra un elemento {{ HTMLElement("button") }} que es descrito por una oración de un diferento elemento {{ HTMLElement("div") }}. El atributo <code>aria-describedby</code> en el {{ HTMLElement("button") }} referencia al <code>id</code> del {{ HTMLElement("div") }}.</p>
-
-<pre class="brush: html">&lt;button aria-describedby="descriptionRevert"&gt;Revertir&lt;/button&gt;
-&lt;div id="descriptionRevert"&gt;Revertir deshará cualquier cambio que se haya hecho desde la última que se guardo.&lt;/div&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: El atributo <code>aria-describedby</code> es utilizado para otros própositos además de los controles de formularios.</p>
-</div>
-
-<h2 id="Required_and_invalid_fields" name="Required_and_invalid_fields">Campos requeridos e inválidos</h2>
-
-<div class="note">
-<p><strong>Nota</strong>: Ahora que <code>required</code> esta disponible para más del 97% de usuarios globalmente, no se recomienda que se use al mismo tiempo <code>required</code> y <code>aria-required</code>.</p>
-</div>
-
-<p>Los desarrolladores Web típicamente usan estrategias de presentación para inidicar campos requeridos o inválidos. Tecnologías asistivas (Assistive technologies - ATs) no necesariamente pueden inferir de la presentación. ARIA provee atributos para indicar que controles de formulario son requeridos o inválidos:</p>
-
-<ul>
- <li>La propiedad <a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-required" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-required"><strong>aria-required</strong></a> puede ser aplicada a un elemento de un formulario para indicar a a una AT que es requerida para completar el formulario.</li>
- <li>El estado <a href="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-invalid" title="http://www.w3.org/TR/2010/WD-wai-aria-20100916/states_and_properties#aria-invalid"><strong>aria-invalid</strong></a> puede ser aplicado programáticamente, para indicar al AT que campos de información tienen información incorrecta para que el usuario sepa que ingresaron información inválida.</li>
-</ul>
-
-<p>El siguiente ejemplo muestra un formulario sencillo con tres campos. En las líneas 4 y 12, los atributos <code>aria-required</code> son establecidos a true (en adición a los asteriscos junto a las etiquetas), indicando que los campos de nombre y email son requeridos. La segunda parte del ejemplo, es un fragmento de código de JavaScript que valida el formato del email, y establece el atributo <code>aria-invalid</code> del campo email (línea 12 del HTML) de acuerdo al resultado (adicionalmente de cambiar la presentación del elemento).</p>
-
-<pre class="brush: html">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="nombre"&gt;* Nombre:&lt;/label&gt;
-    &lt;input type="text" value="nombre" id="nombre" aria-required="true"/&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="telefono"&gt;Phone:&lt;/label&gt;
-    &lt;input type="text" value="telefono" id="telefono" aria-required="false"/&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="email"&gt;* E-mail:&lt;/label&gt;
-    &lt;input type="text" value="email" id="email" aria-required="true"/&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>The script that validates the form entry would look something like this:</p>
-
-<pre class="brush: js">var validar = function () {
-  var elementoEmail = document.getElementById(emailFieldId);
-  var esValido = emailValid(formData.email); // regresa verdadero si es válido, de otro modo devuelve falso.
-
-  elementoEmail.setAttribute("aria-invalid", !esValido);
-  setElementBorderColour(elementoEmail, esValido); // establece el borde de color rojo si el segundo argumento es falso
-};
-</pre>
-
-<h2 id="Providing_Helpful_Error_Messages" name="Providing_Helpful_Error_Messages">Ofreciendo Mensajes de Error Útiles</h2>
-
-<p>Lea como usar <a href="/en-US/docs/aria/forms/alerts" title="aria/forms/alerts">alertas ARIA para mejorar formularios</a>.</p>
-
-<p>Para mayor orientación en el uso de ARIA para la accesibilidad de los formularios, vea el documento <a href="http://www.w3.org/TR/wai-aria-practices/" title="http://www.w3.org/TR/wai-aria-practices/">Prácticas de Autoria WAI-ARIA (WAI-ARIA Authoring Practices</a>).</p>
diff --git a/files/es/web/accessibility/aria/forms/etiquetas_complejas/index.html b/files/es/web/accessibility/aria/forms/etiquetas_complejas/index.html
deleted file mode 100644
index 4bc8cafa67..0000000000
--- a/files/es/web/accessibility/aria/forms/etiquetas_complejas/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: >-
-  Etiquetas complejas: Utilizando ARIA para etiquetas con campos embebidos
-  dentro de ellos
-slug: Web/Accessibility/ARIA/forms/Etiquetas_complejas
-tags:
-  - ARIA
-  - Accesibilidad
-  - Firefox
-  - Guía
-  - HTML
-  - NeedsContent
-  - aria-labelledby
-  - etiqueta
-  - label
-translation_of: Web/Accessibility/ARIA/forms/Multipart_labels
----
-<div>
-<h2 id="Problema"><span class="mw-headline" id="Problem">Problema</span></h2>
-
-<p>Tiene un formulario donde le pregunta a su usuario una pregunta, pero la respuesta es mencionada en la misma pregunta. Un ejemplo clásico que todos conocemos de las configuraciones de nuestro navegador es la opción "Eliminar el historial despues de x días". "Eliminar  el historial despues" está a la izquierda de la caja de texto, x es el número, por ejemplo 21, y la palabra "días" sigue a la caja de texto, formando una oración que es fácil de comprender.</p>
-
-<p>Si se esta usando un lector de pantalla, quizá ha notado que, cuando se van a las configuraciónes de Firefox, el lector dice: ¿"Eliminar el historial después de 21 días"?, seguidamente anuncia que está en una caja de texto y que contiene el número 21. ¿No es super? No necesita navegar alrededor para darse cuenta de la unidad. "Días" podría ser fácilmente "meses" o "años", y en muchos dialogos ordinarios no hay forma de descubrirlo más que navegando utilizando los comandos de revisión del lector de pantalla.</p>
-
-<p><span class="seoSummary">La solución esta en un atributo ARIA llamado <strong>aria-labelledby</strong>. Su parámetro es una cadena de texto que consiste de los IDs de los elementos HTML que se deseen concatenar dentro de un solo nombre accesible.</span></p>
-
-<p>Tanto <strong>aria-labelledby</strong> y <strong>aria-describedby</strong> se especifican en el elemento de formulario   que debe etiquetarse, por ejemplo un &lt;input&gt;. En ambos casos, la etiqueta for/label para ligar a los controles que puedan existir son anuladas por <strong>aria-labelledby</strong>. Si en una página se provee <strong>aria-labelledby</strong>, se debería colocar también una etiqueta para también soportar navegadores antiguos que no tengan aún soperte ARIA. Con Firefox 3, los usuarios ciegos tendrán automáticamente mejor accesibilidad con el nuevo atributo, pero los usuarios de navadores antiguos de esta forma no son dejados en la oscuridad.</p>
-
-<p>Ejemplo:</p>
-<input> <span id="labelShutdown">apagar computadora después de </span> <input> <span id="shutdownUnit"> minutos</span>
-
-<pre class="brush: html">&lt;input aria-labelledby="etiquetaApagado tiempoApagado unidadApagado" type="checkbox" /&gt;
-&lt;span id="etiquetaApagado"&gt;Apagar computadora después de &lt;/span&gt;
-&lt;input aria-labelledby="etiquetaApagado tiempoApagado unidadApagado" id="tiempoApagado" type="text" value="10" /&gt;
-&lt;span id="unidadApagado"&gt; minutos&lt;/span&gt;
-</pre>
-
-<h2 id="Nota_para_usuarios_de_JAWS_8"><span class="mw-headline" id="A_Note_for_JAWS_8_users">Nota para usuarios de JAWS 8</span></h2>
-
-<p>JAWS 8.0 tiene su propia lógica para encontrar etiquetas, causando que siempre sobreescriba el nombre accesible que obtiene la caja de texto de un documento HTML. Con JAWS 8, no se ha encontrado una manera de hacer que acepte la etiqueta del ejemplo anterior. Pero NVDA y  Window-Eyes funcionan correctamente, Orca on Linux tampoco tiene problemas.</p>
-
-<div class="note">TBD (pendiente): añadir más información sobre compatiblidad</div>
-
-<h2 id="¿Puede_hacerse_sin_ARIA"><span class="mw-headline" id="Can_this_be_done_without_ARIA.3F">¿Puede hacerse sin ARIA?</span></h2>
-
-<p> Community member Ben Millard has pointed out in a blog post that <a class="external text" href="http://projectcerbera.com/blog/2008/03#day24" rel="nofollow">controls can be embedded in labels as shown in the above example using HTML 4</a>, simply by embedding the input into the label. Thanks for that info, Ben! It is very useful and shows that some techniques that have been available for years escape even the gurus sometimes. This technique works in Firefox; however, it doesn't currently work in many other browsers, including IE. For labels with embedded form controls, using <strong>aria-labelledby</strong> is still the best approach.</p>
-</div>
diff --git a/files/es/web/accessibility/aria/forms/multipart_labels/index.html b/files/es/web/accessibility/aria/forms/multipart_labels/index.html
new file mode 100644
index 0000000000..5af5f96663
--- /dev/null
+++ b/files/es/web/accessibility/aria/forms/multipart_labels/index.html
@@ -0,0 +1,48 @@
+---
+title: >-
+  Etiquetas complejas: Utilizando ARIA para etiquetas con campos embebidos
+  dentro de ellos
+slug: Web/Accessibility/ARIA/forms/Multipart_labels
+tags:
+  - ARIA
+  - Accesibilidad
+  - Firefox
+  - Guía
+  - HTML
+  - NeedsContent
+  - aria-labelledby
+  - etiqueta
+  - label
+translation_of: Web/Accessibility/ARIA/forms/Multipart_labels
+original_slug: Web/Accessibility/ARIA/forms/Etiquetas_complejas
+---
+<div>
+<h2 id="Problema"><span class="mw-headline" id="Problem">Problema</span></h2>
+
+<p>Tiene un formulario donde le pregunta a su usuario una pregunta, pero la respuesta es mencionada en la misma pregunta. Un ejemplo clásico que todos conocemos de las configuraciones de nuestro navegador es la opción "Eliminar el historial despues de x días". "Eliminar  el historial despues" está a la izquierda de la caja de texto, x es el número, por ejemplo 21, y la palabra "días" sigue a la caja de texto, formando una oración que es fácil de comprender.</p>
+
+<p>Si se esta usando un lector de pantalla, quizá ha notado que, cuando se van a las configuraciónes de Firefox, el lector dice: ¿"Eliminar el historial después de 21 días"?, seguidamente anuncia que está en una caja de texto y que contiene el número 21. ¿No es super? No necesita navegar alrededor para darse cuenta de la unidad. "Días" podría ser fácilmente "meses" o "años", y en muchos dialogos ordinarios no hay forma de descubrirlo más que navegando utilizando los comandos de revisión del lector de pantalla.</p>
+
+<p><span class="seoSummary">La solución esta en un atributo ARIA llamado <strong>aria-labelledby</strong>. Su parámetro es una cadena de texto que consiste de los IDs de los elementos HTML que se deseen concatenar dentro de un solo nombre accesible.</span></p>
+
+<p>Tanto <strong>aria-labelledby</strong> y <strong>aria-describedby</strong> se especifican en el elemento de formulario   que debe etiquetarse, por ejemplo un &lt;input&gt;. En ambos casos, la etiqueta for/label para ligar a los controles que puedan existir son anuladas por <strong>aria-labelledby</strong>. Si en una página se provee <strong>aria-labelledby</strong>, se debería colocar también una etiqueta para también soportar navegadores antiguos que no tengan aún soperte ARIA. Con Firefox 3, los usuarios ciegos tendrán automáticamente mejor accesibilidad con el nuevo atributo, pero los usuarios de navadores antiguos de esta forma no son dejados en la oscuridad.</p>
+
+<p>Ejemplo:</p>
+<input> <span id="labelShutdown">apagar computadora después de </span> <input> <span id="shutdownUnit"> minutos</span>
+
+<pre class="brush: html">&lt;input aria-labelledby="etiquetaApagado tiempoApagado unidadApagado" type="checkbox" /&gt;
+&lt;span id="etiquetaApagado"&gt;Apagar computadora después de &lt;/span&gt;
+&lt;input aria-labelledby="etiquetaApagado tiempoApagado unidadApagado" id="tiempoApagado" type="text" value="10" /&gt;
+&lt;span id="unidadApagado"&gt; minutos&lt;/span&gt;
+</pre>
+
+<h2 id="Nota_para_usuarios_de_JAWS_8"><span class="mw-headline" id="A_Note_for_JAWS_8_users">Nota para usuarios de JAWS 8</span></h2>
+
+<p>JAWS 8.0 tiene su propia lógica para encontrar etiquetas, causando que siempre sobreescriba el nombre accesible que obtiene la caja de texto de un documento HTML. Con JAWS 8, no se ha encontrado una manera de hacer que acepte la etiqueta del ejemplo anterior. Pero NVDA y  Window-Eyes funcionan correctamente, Orca on Linux tampoco tiene problemas.</p>
+
+<div class="note">TBD (pendiente): añadir más información sobre compatiblidad</div>
+
+<h2 id="¿Puede_hacerse_sin_ARIA"><span class="mw-headline" id="Can_this_be_done_without_ARIA.3F">¿Puede hacerse sin ARIA?</span></h2>
+
+<p> Community member Ben Millard has pointed out in a blog post that <a class="external text" href="http://projectcerbera.com/blog/2008/03#day24" rel="nofollow">controls can be embedded in labels as shown in the above example using HTML 4</a>, simply by embedding the input into the label. Thanks for that info, Ben! It is very useful and shows that some techniques that have been available for years escape even the gurus sometimes. This technique works in Firefox; however, it doesn't currently work in many other browsers, including IE. For labels with embedded form controls, using <strong>aria-labelledby</strong> is still the best approach.</p>
+</div>
diff --git a/files/es/web/accessibility/community/index.html b/files/es/web/accessibility/community/index.html
new file mode 100644
index 0000000000..367956150e
--- /dev/null
+++ b/files/es/web/accessibility/community/index.html
@@ -0,0 +1,45 @@
+---
+title: Comunidad
+slug: Web/Accessibility/Community
+tags:
+  - Accesibilidad
+  - Todas_las_Categorías
+translation_of: Web/Accessibility/Community
+original_slug: Web/Accesibilidad/Comunidad
+---
+<p> </p>
+<p>Si conoces alguna lista de correo, grupo de noticias, foro, o comunidad relacionada con la
+ <i>
+  accesibilidad</i>
+ que pueda ser de interés. Por favor, pon aquí un enlace.</p>
+<h3 id="Mozilla" name="Mozilla">Mozilla</h3>
+<ul>
+ <li>La
+  <i>
+   Accesibilidad</i>
+  en la comunidad Mozilla... en inglés</li>
+</ul>
+<p>{{ DiscussionList("support-accessibility", "mozilla.support.accessibility") }}</p>
+<h3 id="Listas_de_correo" name="Listas_de_correo">Listas de correo</h3>
+<ul>
+ <li><a class="external" href="http://es.groups.yahoo.com/group/accesoweb">Accesoweb</a> Lista en castellano sobre problemas y soluciones de diseño accesible para la Red de la <b>Fundación Sidar</b>.</li>
+</ul>
+<h3 id="Foros" name="Foros">Foros</h3>
+<ul>
+ <li> </li>
+</ul>
+<p> </p>
+<h3 id="Bit.C3.A1coras" name="Bit.C3.A1coras">Bitácoras</h3>
+<ul>
+ <li><a class="external" href="http://accesibilidadweb.blogspot.com/">Accesibilidad, Usabilidad y Estándares Web</a> Este es un blog dedicado a todos los temas relacionados con la accesibilidad web, usabilidad y estándares web.</li>
+</ul>
+<h3 id="Wikis" name="Wikis">Wikis</h3>
+<ul>
+ <li> </li>
+</ul>
+<p> </p>
+<h3 id="Otros_Sitios" name="Otros_Sitios">Otros Sitios</h3>
+<ul>
+ <li><a class="external" href="http://www.w3.org/WAI/">El sitio del WAI (en)</a></li>
+</ul>
+<p><span class="comment">categorías</span></p>
diff --git a/files/es/web/accessibility/index.html b/files/es/web/accessibility/index.html
new file mode 100644
index 0000000000..600dd99d0a
--- /dev/null
+++ b/files/es/web/accessibility/index.html
@@ -0,0 +1,94 @@
+---
+title: Accesibilidad
+slug: Web/Accessibility
+tags:
+  - Accesibilidad
+  - Todas_las_Categorías
+translation_of: Web/Accessibility
+original_slug: Web/Accesibilidad
+---
+<div class="callout-box"><strong><a class="external" href="http://www.w3c.es/Divulgacion/Guiasbreves/Accesibilidad">Guía Breve de Accesibilidad Web</a></strong><br>
+Las cuatro cosas básicas y un montón de buenos enlaces.</div>
+
+<p>La <strong>accesibilidad web </strong>(a menudo abreviada como <strong>A11y)</strong> se refiere a la posibilidad de acceso a los diferentes sitios web y a todo su contenido por todas las personas, independientemente de sus limitaciones fìsicas (discapacidad) o las derivadas del contexto de uso (tecnológicas o ambientales).{{ Ref(1) }}</p>
+
+<p><font><font>Para muchas personas, la tecnología facilita las cosas. </font><font>Para las personas con algun tipo de discapacidad, la tecnología hace las cosas posibles. </font><font>Accesibilidad significa desarrollar contenido para que sea lo más accesible posible sin importar las habilidades físicas y cognitivas de un individuo y sin importar cómo acceda a la web.</font></font></p>
+
+<p><font><font>" </font></font><strong><font><font>La Web está diseñada fundamentalmente para que funcione para todas las personas</font></font></strong><font><font> , independientemente de su hardware, software, idioma, cultura, ubicación, capacidad física o mental.</font></font></p>
+
+<p>El máximo organismo dentro de la jerarquía de Internet que se encarga de promover la accesibilidad es el <a class="external" href="http://www.w3c.es">W3C</a>, en especial su grupo de trabajo <a class="external" href="http://www.w3c.es/Traducciones/es/WAI/intro/accessibility">WAI</a>.</p>
+
+<table class="topicpage-table">
+ <tbody>
+  <tr>
+   <td>
+    <h4 id="Documentaci.C3.B3n" name="Documentaci.C3.B3n"><a href="/Special:Tags?tag=Accesibilidad&amp;language=es" title="Special:Tags?tag=Accesibilidad&amp;language=es">Documentación</a></h4>
+
+    <dl>
+     <dt><a href="/es/Introducci%C3%B3n_a_la_Accesibilidad_Web_(externo)" title="es/Introducción_a_la_Accesibilidad_Web_(externo)">Introducción a la Accesibilidad Web (externo)</a></dt>
+     <dd>WAI: estrategias, pautas, recursos para hacer la Web accesible a personas con discapacidad.</dd>
+    </dl>
+
+    <dl>
+     <dt><a href="/es/Pautas_de_Accesibilidad_al_Contenido_en_la_Web_1.0_(externo)" title="es/Pautas_de_Accesibilidad_al_Contenido_en_la_Web_1.0_(externo)">Pautas de Accesibilidad al Contenido en la Web 1.0 (externo)</a></dt>
+     <dd>"Estas pautas explican cómo hacer accesibles los contenidos de la Web a personas con discapacidad."</dd>
+    </dl>
+
+    <dl>
+     <dt><a class="external" href="http://www.discapnet.es/web_accesible/tecnicas/WCAG10-TECHS-20001106_es.html">Técnicas para las Pautas de Accesibilidad al Contenido en la Web 1.0</a></dt>
+     <dd>Este documento es el punto de acceso a una serie de documentos relacionados que describen técnicas para satisfacer los requisitos definidos en las "Pautas de Accesibilidad al Contenido en la Web 1.0"</dd>
+    </dl>
+
+    <dl>
+     <dt><a class="external" href="http://www.discapnet.es/web_accesible/WCAG-REC-fact.html">FAQ sobre las "Pautas de Accesibilidad al Contenido en la Web 1.0"</a></dt>
+     <dd>Esta página de preguntas frecuentes proporciona información sobre la recomendación W3C WACG 1.0. Es una traducción de <em>Fact Sheet for "Web Content Accessibility Guidelines 1.0"</em></dd>
+    </dl>
+
+    <dl>
+     <dt></dt>
+     <dd>When authored according to these guidelines, XUL is capable of generating accessible user interfaces. Coders, reviewers, designers and QA engineers should be familiar with these guidelines.</dd>
+    </dl>
+
+    <p><span class="alllinks"><a href="/Special:Tags?tag=Accesibilidad&amp;language=es" title="Special:Tags?tag=Accesibilidad&amp;language=es">Ver más...</a></span></p>
+   </td>
+   <td>
+    <h4 id="Comunidad" name="Comunidad">Comunidad</h4>
+
+    <ul>
+     <li>En la comunidad Mozilla... en inglés</li>
+    </ul>
+
+    <p>{{ DiscussionList("support-accessibility", "mozilla.support.accessibility") }}</p>
+
+    <p><span class="alllinks"><a href="/es/Accesibilidad/Comunidad" title="es/Accesibilidad/Comunidad">Ver más...</a></span></p>
+
+    <h4 id="Herramientas" name="Herramientas">Herramientas</h4>
+
+    <ul>
+     <li><a href="/es/HERA_(externo)" title="es/HERA_(externo)">HERA, test de accesibilidad</a></li>
+     <li><a href="/es/TAW_(externo)" title="es/TAW_(externo)">TAW, test de accesibilidad </a></li>
+     <li><a class="external" href="http://www.accesible.com.ar/examinator/">Test de accesibilidad eXaminator</a></li>
+     <li><a class="external" href="http://www.e-kaw.org/index.jsp">kit de accesibilidad web</a></li>
+     <li><a class="external" href="https://addons.mozilla.org/es/firefox/addon/claws/">Claws - emulador de lector de pantalla</a></li>
+    </ul>
+
+    <p><span class="alllinks"><a href="/Special:Tags?tag=Accesibilidad:Herramientas&amp;language=es" title="Special:Tags?tag=Accesibilidad:Herramientas&amp;language=es">Ver más...</a></span></p>
+
+    <h4 id="Temas_relacionados" name="Temas_relacionados">Temas relacionados</h4>
+
+    <dl>
+     <dd>· <a href="/es/Desarrollo_Web" title="es/Desarrollo_Web">Desarrollo Web</a> · <a href="/es/Desarrollando_Mozilla" title="es/Desarrollando_Mozilla">Desarrollando Mozilla</a> ·</dd>
+    </dl>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<hr>
+<p><small>{{ Note(1) }} <a class="external" href="http://es.wikipedia.org/wiki/Accesibilidad_web">Definición de la Wikipedia</a> </small></p>
+
+<p><span class="comment">Categorias</span></p>
+
+<p><span class="comment">Interwiki Language Links</span></p>
+
+<p>{{ languages( { "en": "en/Accessibility", "fr": "fr/Accessibilit\u00e9", "ja": "ja/Accessibility", "pl": "pl/Dost\u0119pno\u015b\u0107" } ) }}</p>
diff --git a/files/es/web/accessibility/understanding_wcag/index.html b/files/es/web/accessibility/understanding_wcag/index.html
new file mode 100644
index 0000000000..c1bfb8fc7e
--- /dev/null
+++ b/files/es/web/accessibility/understanding_wcag/index.html
@@ -0,0 +1,57 @@
+---
+title: Understanding the Web Content Accessibility Guidelines
+slug: Web/Accessibility/Understanding_WCAG
+translation_of: Web/Accessibility/Understanding_WCAG
+original_slug: Web/Accesibilidad/Understanding_WCAG
+---
+<p class="summary">Esto es parte de un grupo de artículos que explican rápidamente los pasos necesario para cumplir con la normativa de W3C Web Content Accessibility Guides 2.0 o 2.1 (también conocida como WCAG).</p>
+
+<p>La norma WCAG 2.0 y 2.1 provee unas guías detalladas para lograr que el contenido de nuestro sitio sea accesible para personas con distintos tipos de discapacidades. Es exhaustivo y muy detallado, por lo que cuesta comprenderlo rápidamente. Por esta razón, hemos resumido los pasos a seguir para que puedas cumplir con las diferentes recomendaciones e incluimos links al pie para más detalles en los lugares necesarios.</p>
+
+<h2 id="Los_cuatro_principios">Los cuatro principios</h2>
+
+<p>La normativa WCAG tiene cuatro secciones, cuatro categorías en las cuales el contenido <strong>debe</strong> ser accesible (para más información puedes referirte a <a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/intro.html#introduction-fourprincs-head">Understanding the Four Principles of Accessibility (inglés)</a>).</p>
+
+<p>Cada uno de los siguientes enlaces te llevarán a páginas en las que podrás expandir tu conocimiento en cada una de las áreas de WCAG 2.0 y 2.1.</p>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Perceivable">Perceptible:</a> Los usuarios deben poder percibir el contenido de alguna forma, a través de alguno de sus sentidos.</li>
+ <li><a href="/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Operable">Operable</a>: Los usuarios deben poder controlar los elementos de interfaz (por ejemplo, se deben poder cliquear botones de alguna forma, ya sea utilizando el ratón, teclado o comando de voz).</li>
+ <li><a href="/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Understandable">Comprensible</a>: El contenido debe ser comprensible para los usuarios.</li>
+ <li><a href="/en-US/docs/user:chrisdavidmills/Understanding_WCAG/Robust">Robusto</a>: El contenido debe ser desarrollado utilizando estándares actuales que funcionarán en todos los navegadores del momento, hoy y en el futuro.</li>
+</ul>
+
+<h2 id="Debo_usar_WCAG_2.0_o_2.1">Debo usar WCAG 2.0 o 2.1?</h2>
+
+<p>WCAG 2.1 es el estándar más reciente y relevante. Utilízalo para mejorar la calidad de navegación de los usuarios con discapacidades y para reducir las posibles acciones legales a los dueños del sitio web.</p>
+
+<p>Al momento de asignar recursos, ten como objetivo WCAG 2.0, luego sube a 2.1.</p>
+
+<h3 id="¿Qué_es_WCAG_2.1">¿Qué es WCAG 2.1?</h3>
+
+<p>WCAG 2.1 fue publicado el 5 de junio de 2018 como recomendación oficial. La Unión Europea (EU) lo adoptó como estándar en septiembre de ese mismo año. La W3C publicó un <a href="https://www.w3.org/blog/2018/09/wcag-2-1-adoption-in-europe/">anuncio de prensa al respecto</a>.</p>
+
+<p>WCAG 2.1 incluye:</p>
+
+<ul>
+ <li>Toda la normativa WCAG 2.0 (literal, palabra-por-palabra)</li>
+ <li>17 nuevos Criterios de Conformidad en los niveles A / AA / AAA que se enfocan principalmente en las siguientes necesidades:
+  <ul>
+   <li>Accessbilidad móvil</li>
+   <li>Baja visión</li>
+   <li>Cognitivas</li>
+  </ul>
+ </li>
+ <li>Lee más sobre WCAG 2.1 (en inglés):
+  <ul>
+   <li>Deque: <a href="https://www.deque.com/blog/wcag-2-1-what-is-next-for-accessibility-guidelines/">WCAG 2.1:  What is Next for Accessibility Guidelines</a></li>
+   <li>TPG:  <a href="https://developer.paciellogroup.com/blog/2018/06/web-content-accessibility-guidelines-wcag-2-1/">Web Content Accessibilituy Guidelines (WCAG) 2.1</a></li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Legal">Legal</h2>
+
+<p>Esta guía tiene como objetivo proveer información para que puedas construir mejores sitios, más accesibles. Sin embargo, no somos abogados y nada de esto es un asesoramiento legal. Si estás preocupado/a por las implicaciones legales de la accesibilidad web recomendamos que investigues la legislación de tu país o que consultes a un abogado calificado.</p>
+
+<p><a href="/en-US/docs/Learn/Accessibility/What_is_accessibility">¿Qué es la accesibilidad?</a> y <a href="/en-US/docs/Learn/Accessibility/What_is_accessibility#Accessibility_guidelines_and_the_law">guías de accesibilidad y sobre la ley</a> proveen más información al respecto (en inglés).</p>
diff --git a/files/es/web/accessibility/understanding_wcag/keyboard/index.html b/files/es/web/accessibility/understanding_wcag/keyboard/index.html
new file mode 100644
index 0000000000..b3f2792fb4
--- /dev/null
+++ b/files/es/web/accessibility/understanding_wcag/keyboard/index.html
@@ -0,0 +1,93 @@
+---
+title: Teclado (Keyboard)
+slug: Web/Accessibility/Understanding_WCAG/Keyboard
+tags:
+  - Accesibilidad
+  - teclado
+translation_of: Web/Accessibility/Understanding_WCAG/Keyboard
+original_slug: Web/Accesibilidad/Understanding_WCAG/Teclado
+---
+<div>Para ser completamente accesible, una página web debe ser operable por alguién utilizando únicamente un teclado para acceder y controlarla. Esto incluye usuarios de lectores de pantalla, pero también puede incluir a quienes tienen dificultades utilizando un dispositivo apuntador como un ratón o una bola de rastreo, o aquellos cuyo ratón no esta funcionando temporalmente, o la gente que simplemente prefiere usar un teclado como entrada siempre que les sea posible.</div>
+
+<h2 id="Los_elementos_enfocables_deben_tener_una_semántica_interactiva">Los elementos enfocables deben tener una semántica interactiva</h2>
+
+<p>Si un elemento puede ser enfocado utilizando un teclado, entonces debería ser interactivo, es decir, el usuario debería ser capaz de hacer algo y producir un cambio de algún tipo (por ejemplo, activar un enlace o cambiar una opción).</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota: </strong>Una excepción importante a esta regla es si el elemento tiene aplicado <code>role="document"</code>, <strong>dentro </strong>un contexto interactivo (como un <code>role="application"</code>). En tal caso, enfocar el documento anidado es la única forma de devolver la tecnología de asistencia a un estado de no interactividad (comúnmente llamado "modo navegador").</p>
+</div>
+
+<p>La mayoría de los elementos son enfocables por defecto, y se puede hacer que un elemento sea enfocable al añadir el atributo <code>tabindex=0</code>. Sin embargo, sólo se debería añadir <code>tabindex</code> si el elemento también se hace interactivo, por ejemplo, definiendo los eventos de teclado apropiados para los manejadores de eventos.</p>
+
+<h3 id="Ver_también">Ver también</h3>
+
+<ul>
+ <li>Atributo HTML global <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
+ <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">onkeydown</a></li>
+ <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">onkeyup</a></li>
+</ul>
+
+<h2 id="Evitar_usar_el_atributo_tabindex_con_un_valor_mayor_a_cero">Evitar usar el atributo <code>tabindex</code> con un valor mayor a cero</h2>
+
+<p>El atributo <code>tabindex</code> indica que un elemento es enfocable utilizando el teclado. Un valor de cero indica que el elemento es parte del orden de enfoque normal, que está basado en el orden de los elementos en el documento HTML. Un valor positivo pone al elemento adelante de aquellos con el orden normal; elementos con valores positivos son enfocados en el orden del valor de <code>tabindex</code> (1, luego 2, después 3, etc.).</p>
+
+<p>Esto genera una confusión para usuarios que solo usen el teclado cuando el orden del enfoque difiera al orden lógico de la página. Una mejor estrategia es estructurar el documento HTML para que los elementos enfocables estén es un orden lógico, sin la necesidad de reordenarlos con un valor positivo de <code>tabindex</code>.</p>
+
+<h3 id="Ver_también_2">Ver también</h3>
+
+<ul>
+ <li>Atributo HTML globlal <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
+ <li><a href="https://www.w3.org/WAI/WCAG21/Understanding/focus-order.html">Entendiento el orden del enfoque</a></li>
+ <li><a href="http://adrianroselli.com/2014/11/dont-use-tabindex-greater-than-0.html">No use un tabindex mayor que 0</a></li>
+</ul>
+
+<h2 id="Los_elementos_a_los_que_se_les_puede_hacer_click_deben_ser_enfocables_y_deberían_tener_semánticas_interactivas">Los elementos a los que se les puede hacer click deben ser enfocables y deberían tener semánticas interactivas</h2>
+
+<p>Si a un elemento se le puede hacer click con un dispositivo apuntador, como un ratón, entonces también debería enfocable utilizando el teclado, y el usuario debería ser capaz de hacer algo al interactuar con este.</p>
+
+<p>A un elemento se le puede hacer click si tiene in manejador de evento<code> onclick</code> definido. Se puede hacer enfocable al añadir un atributo-valor <code>tabindex=0</code>. Se puede hacer que se opere con un teclado al definir un manejador de evento <code>onkeydown</code>; en la mayoría de los casos, la acción tomada por el manejador de eventos debería ser la misma para los dos tipos de eventos</p>
+
+<h3 id="Ver_también_3">Ver también</h3>
+
+<ul>
+ <li>El atributo global HTML <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
+ <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">onkeydown</a></li>
+ <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">onkeyup</a></li>
+</ul>
+
+<h2 id="Los_elementos_interactivos_deben_ser_capaz_de_ser_activos_utilizando_un_teclado">Los elementos interactivos deben ser capaz de ser activos utilizando un teclado</h2>
+
+<p>Si el usuario puede interactuar con un elemento utilizando el tacto o un dispositivo apuntador, entonces el elemento debería ser también capaz de interactuar con el teclado, Es decir, si hay manejadores de evento definidos para los eventos al tacto y al hacer click, también debería haber manejadores de eventos para el teclado. Los manejadores de eventos para el teclado deberían realizar la misma interacción que sus contrapartes con el tacto y al hacer click.</p>
+
+<h3 id="Ver_también_4">Ver también</h3>
+
+<ul>
+ <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeydown">onkeydown</a></li>
+ <li>Manejador de evento global: <a href="/en-US/docs/Web/API/GlobalEventHandlers/onkeyup">onkeyup</a></li>
+</ul>
+
+<h2 id="Los_elementos_interactivos_deben_ser_enfocables">Los elementos interactivos deben ser enfocables</h2>
+
+<p>Si el usuario puede interactuar con un elemento (por ejemplo, usando el tacto o con un dispositivo apuntador) entonces debería ser enfocable utilizando el teclado. Puede hacerse enfocable al añadirle el atributo-valor<code> tabindex=0</code>. Eso añadirá el elemento a la lista de elementos que pueden ser enfocados al presionar la tecla <kbd>Tab</kbd>, en la secuencia en que dichos elementos se encuentran definidos en el documento HTML.</p>
+
+<h3 id="Ver_también_5">Ver también</h3>
+
+<ul>
+ <li>Atributo global HTML <a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">tabindex</a></li>
+</ul>
+
+<h2 id="Elementos_enfocables_deben_tener_un_estilo_al_estar_enfocados">Elementos enfocables deben tener un estilo al estar enfocados</h2>
+
+<p>Cualquier elemento que pueda recibir el enfoque desde el teclado, debería tener un estilo visible que indique cuando el elemento esta enfocado. Se puede hacer esto con la pseudo-clase de CSS <code><a href="/en-US/docs/Web/CSS/:focus">:focus</a></code>.</p>
+
+<p>Elementos enfocables estándar como enlaces y los campos de entrada reciben un estilo especial por parte del navegador de forma predeterminada, por lo que podría no ser necesario especificar un estilo de enfoque para éstos, a menos que se quiera que el estilo de enfoque sea más distintivo.</p>
+
+<p>Si se crean componentes enfocables, se debe estar seguro de que también se defina el estilo de enfoque para éstos.</p>
+
+<p>If you create your own focusable components, be sure that you also define focus styling for them.</p>
+
+<h3 id="Ver_también_6">Ver también</h3>
+
+<ul>
+ <li><a href="https://www.w3.org/WAI/WCAG21/Techniques/css/C15.html">Utilizando CSS para cambiar la presentación de un componente UI cuando reciba el enfoque</a></li>
+</ul>
diff --git a/files/es/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html b/files/es/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html
new file mode 100644
index 0000000000..8e6f27d841
--- /dev/null
+++ b/files/es/web/accessibility/understanding_wcag/perceivable/color_contrast/index.html
@@ -0,0 +1,163 @@
+---
+title: Contraste del color
+slug: Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast
+tags:
+  - Accesibilidad
+  - Perceptible
+  - contraste
+translation_of: Web/Accessibility/Understanding_WCAG/Perceivable/Color_contrast
+original_slug: Web/Accesibilidad/Understanding_WCAG/Perceivable/Color_contraste
+---
+<p>El <a href="https://www.w3.org/TR/WCAG21/#dfn-contrast-ratio">contraste del color</a> entre el fondo y el contenido del primer plano (que suele ser texto) debe ser lo suficientemente alto como para garantizar la legibilidad.</p>
+
+<p>Al diseñar interfaces legibles para diferentes capacidades de visión, las directrices de la WCAG recomiendan las siguientes relaciones de contraste:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Tipo de contenido</th>
+   <th scope="col">Relación mínima (nivel AA)</th>
+   <th scope="col">Relación mejorada (nivel AAA)</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>Cuerpo de texto</td>
+   <td>4.5 : 1</td>
+   <td>7 : 1</td>
+  </tr>
+  <tr>
+   <td>Texto a gran escala (120-150% mayor que el cuerpo de texto)</td>
+   <td>3 : 1</td>
+   <td>4.5 : 1</td>
+  </tr>
+  <tr>
+   <td>Componentes activos de la interfaz de usuario y objetos gráficos como iconos y gráficos</td>
+   <td>3 : 1</td>
+   <td>No definido</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Estas proporciones no se aplican al texto "incidental", como controles inactivos, logotipos o texto puramente decorativo.</p>
+
+<p>Consulta la sección {{anch("Solución")}} a continuación para obtener más información.</p>
+
+<p>Tener un buen contraste de color en tu sitio web beneficia a todos tus usuarios, pero es particularmente beneficioso para los que tienen cierto tipo de ceguera al color y otras afecciones similares, como los que experimentan una baja sensibilidad al contraste y tienen dificultades para diferenciar colores parecidos. Esto se debe a que no distinguen las áreas brillantes y oscuras con tanta facilidad como las personas que no tienen esa discapacidad, y por lo tanto tienen problemas para ver los bordes y otros detalles.  </p>
+
+<p>Es bueno tener un diseño atractivo en tu sitio web, pero el diseño es inútil si tus usuarios no pueden leer el contenido.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Veamos algunos ejemplos simples con código HTML y CSS:</p>
+
+<pre class="brush: html notranslate">&lt;div class="good"&gt;Buen contraste&lt;/div&gt;
+&lt;div class="bad"&gt;Mal contraste&lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">div {
+  /* General div styles here */
+}
+
+.good {
+  background-color: #fae6fa;
+}
+
+.bad {
+  background-color: #400064;
+}</pre>
+
+<p>Ambos fragmentos de texto tienen color negro por defecto. El <code>&lt;div&gt;</code> "good" tiene un color de fondo púrpura claro, lo que hace que el texto sea fácil de leer:</p>
+
+<div class="hidden">
+<h4 id="example1">example1</h4>
+
+<pre class="brush: html notranslate">    &lt;div class="good"&gt;
+      Good contrast
+    &lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">div {
+  font-family: sans-serif;
+  text-align: center;
+  font-size: 2rem;
+  font-weight: bold;
+  width: 250px;
+  padding: 30px;
+  border-radius: 20px;
+  box-shadow: 1px 1px 1px black;
+}
+
+.good {
+  background-color: #fae6fa;
+}</pre>
+</div>
+
+<p>{{EmbedLiveSample('example1', '100%', '100')}}</p>
+
+<p>El <code>&lt;div&gt;</code> "bad", por otro lado, tiene un color de fondo púrpura muy oscuro, lo que hace que el texto sea mucho más difícil de leer:</p>
+
+<div class="hidden">
+<h4 id="example2">example2</h4>
+
+<pre class="brush: html notranslate">    &lt;div class="bad"&gt;
+      Bad contrast
+    &lt;/div&gt;</pre>
+
+<pre class="brush: css notranslate">div {
+  font-family: sans-serif;
+  text-align: center;
+  font-size: 2rem;
+  font-weight: bold;
+  width: 250px;
+  padding: 30px;
+  border-radius: 20px;
+  box-shadow: 1px 1px 1px black;
+}
+
+.bad {
+  background-color: #400064;
+}</pre>
+</div>
+
+<p>{{EmbedLiveSample('example2', '100%', '100')}}</p>
+
+<dl>
+</dl>
+
+<h2 id="Solución">Solución</h2>
+
+<p>Al elegir un esquema de color para tu sitio web, selecciona colores de primer plano y de fondo que tengan un buen contraste. Haz que el contraste de color sea lo mejor posible dentro de las limitaciones de tu diseño — preferiblemente elige el nivel AAA (ver 1.4.6 más abajo), pero al menos cumple con el nivel AA (ver 1.4.3 más abajo).</p>
+
+<p>Si incluyes contenido no textual, como vídeo o animación, debes seguir 1.4.11 (nuevamente, ver más abajo).</p>
+
+<p>Para verificar el contraste a medida que seleccionas los colores puedes utlizar una herramienta como <a class="external external-icon" href="http://webaim.org/resources/contrastchecker/" rel="noopener">Color Contrast Checker</a> de WebAIM.</p>
+
+<p>También puedes comprobar el contraste de color sobre la marcha utilizando las herramientas para desarrolladores de Firefox— ver nuestra guía <a href="/en-US/docs/Tools/Accessibility_inspector">Accessibility inspector</a>, y en particular la sección <a href="/en-US/docs/Tools/Accessibility_inspector#Check_for_accessibility_issues">Check for accessibility issues</a>. Prueba a usarlo en los ejemplos en vivo en la sección de descripción.</p>
+
+<h2 id="Criterios_de_conformidad_relacionados_con_WCAG">Criterios de conformidad relacionados con WCAG</h2>
+
+<dl>
+ <dt><a href="https://www.w3.org/TR/WCAG21/#contrast-minimum">1.4.3 Contraste mínimo (AA)</a></dt>
+ <dd>El contraste de color entre el fondo y el contenido del primer plano debe tener un nivel mínimo para garantizar la legibilidad:
+ <ul>
+  <li>El texto y el fondo deben tener una relación de contraste de al menos 4.5:1.</li>
+  <li>Los encabezados (o simplemente el texto más grande) deben tener una relación de contraste de al menos 3:1. El texto más grande se define como de al menos 18pt, o 14pt en negrita.</li>
+ </ul>
+ </dd>
+ <dt><a href="https://www.w3.org/TR/WCAG21/#contrast-enhanced">1.4.6 Contraste mejorado (AAA)</a></dt>
+ <dd>Esto sigue y se basa en el criterio 1.4.3.
+ <ul>
+  <li>El texto y el fondo deben tener una relación de contraste de al menos 7:1.</li>
+  <li>Los encabezados (o simplemente el texto más grande) deben tener una relación de contraste de al menos 4.5:1.</li>
+ </ul>
+ </dd>
+ <dt><a href="https://www.w3.org/TR/WCAG21/#non-text-contrast">1.4.11 Contraste no textual (AA)</a> (añadido en 2.1)</dt>
+ <dd>Debe haber una relación mínima de contraste de color de 3 a 1 para los componentes de la interfaz de usuario y los objetos gráficos.</dd>
+</dl>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a></li>
+ <li><a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form#Multiple_labels">Multiple labels</a></li>
+ <li><a href="https://www.w3.org/WAI/WCAG21/Understanding/non-text-contrast.html">Understanding Non-Text Contrast</a></li>
+</ul>
diff --git a/files/es/web/accessibility/understanding_wcag/perceivable/index.html b/files/es/web/accessibility/understanding_wcag/perceivable/index.html
new file mode 100644
index 0000000000..f24aa300d9
--- /dev/null
+++ b/files/es/web/accessibility/understanding_wcag/perceivable/index.html
@@ -0,0 +1,337 @@
+---
+title: Perceivable
+slug: Web/Accessibility/Understanding_WCAG/Perceivable
+translation_of: Web/Accessibility/Understanding_WCAG/Perceivable
+original_slug: Web/Accesibilidad/Understanding_WCAG/Perceivable
+---
+<p class="summary">Este artículo ofrece consejos prácticos sobre cómo hacer que tu sitio web cumpla con los criterios de <strong>Percepción</strong> de WCAG 2.0 y 2.1. Los estados perceptivos que los usuarios deben poder reconocer utilizando alguno de sus sentidos.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Para leer las definiciones de la W3C sobre Percepción y las guías para cumplir con los criterios dirígete a <a href="https://www.w3.org/TR/WCAG21/#perceivable">Principle 1: Perceivable - Information and user interface components must be presentable to users in ways they can perceive.</a></p>
+</div>
+
+<h2 id="Pauta_1.1_—_Dar_alternativas_de_texto_para_contenido_no_textual.">Pauta 1.1 — Dar alternativas de texto para contenido no textual.</h2>
+
+<p>La clave aquí es convertir el texto a otros formatos que puedan ser entendidos por personas con otras capacidades; ya sea si utilizan un screen-reader, zoom o un lector de braille. El contenido no textual se refiere a elementos multimedia como imágenes, audio y vídeo.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Criterio de éxito</th>
+   <th scope="col">Cómo cumplir</th>
+   <th scope="col">Recursos prácticos</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td colspan="1" rowspan="5">1.1.1 Alternativas textuales  (A)</td>
+   <td>Toda imagen que sea útil para el usuario debe tener un texto alternativo.</td>
+   <td><a href="/en-US/docs/Learn/Accessibility/HTML#Text_alternatives">Texto alternativo.</a></td>
+  </tr>
+  <tr>
+   <td>
+    <p>Las imágenes complejas o gráficos deben tener una alternativa accesible, ya sea en al misma página o en una externa. Utiliza un elemento de link en vez del atributo <code>longdesc</code>.</p>
+   </td>
+   <td>
+    <p>Una alternativa textual o una tabla puede resolverlo (ver <a href="/en-US/docs/Learn/HTML/Tables/Advanced">HTML table advanced features and accessibility</a> y <a href="/en-US/docs/Learn/Accessibility/HTML#Other_text_alternative_mechanisms">Other text alternative mechanisms</a> para leer sobre el argumento en contra de <code>longdesc</code>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>El contenido multimedia (por ejemlo, audio o vídeo) debería tener por lo menos una descripción accesible disponible (captions o similar).</td>
+   <td>
+    <p>Ver <a href="/en-US/docs/Learn/Accessibility/HTML#Text_alternatives">alternativas de texto</a> para opciones de captions, y <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a>, <a href="/en-US/docs/Learn/Accessibility/Multimedia#Video_text_tracks">Video text tracks</a> o <a href="/en-US/docs/Learn/Accessibility/Multimedia#Other_multimedia_content">Other multimedia content</a> para otras alternativas.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Los elementos de interfaz como botones o elementos de formulario deberán tener <code>label</code>s que describan su propósito.</td>
+   <td>Deberás asegurarte de que los botones describan su función (por ejemplo, <code>&lt;button&gt;Subir imagen&lt;/button&gt;</code>). Para más información ver <a href="/en-US/docs/Learn/Accessibility/HTML#UI_controls">UI controls</a>.</td>
+  </tr>
+  <tr>
+   <td>
+    <p>Implementa elementos decorativos (imágenes o vídeos) de manera que sea invisibles para lectores de pantalla, de esta forma evitarás confundir a estos usuarios.</p>
+   </td>
+   <td>
+    <p>Las imágenes decorativas deben ser implementadas utilizando la propiedad <code>background-image</code><em>. </em>Si debes incluir una imagen con la etiqueta {{htmlelement("img")}} deberás agregarle un atributo <code>alt</code> vacío, de otra manera los lectores de pantalla podrían leerlo.</p>
+
+    <p>Si incluyes un vídeo o audio en tu sitio que se reproduce automáticamente intenta de que sea lo menos molesto posible. No hagas que se vea ni actúe como contenido y provee una forma de apagarlo.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: Ver también <a href="https://www.w3.org/TR/WCAG21/#text-alternatives">WCAG description for Guideline 1.1: Text alternatives</a>.</p>
+</div>
+
+<h2 id="Pauta_1.2_—_Proporcionar_alternativas_para_los_medios_tempo-dependientes.">Pauta 1.2 — Proporcionar alternativas para los medios tempo-dependientes.</h2>
+
+<p>Los medios tempo-dependientes se refieren a multimedia con una duración (audio y vídeo, por ejemplo). Ten en cuenta que si este contenido multimedia funciona como una alternativa a un contenido textual no necesitas proveer otra alternavtiva.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Criterio de éxito</th>
+   <th scope="col">Cómo cumplir</th>
+   <th scope="col">Recursos prácticos</th>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="1">1.2.1 Provee alternativas para multimedia de solo audio o solo vídeo (A)</td>
+   <td>A transcript should be provided for prerecorded audio-only media, and a transcript or audio description should be provided for prerecorded video-only media (i.e. silent video).</td>
+   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information. No audio description tutorial available as yet.</td>
+  </tr>
+  <tr>
+   <td colspan="1">1.2.2 Provee captions para los vídeos (A)</td>
+   <td>You should provide captions for video presented on the web, e.g. HTML5 video. This is for the benefit of people who can't hear the audio part of the video.</td>
+   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Video_text_tracks">Video text tracks</a> for HTML5 video captions, and <a href="/en-US/docs/Learn/Accessibility/Multimedia#Other_multimedia_content">Other multimedia content</a> for other technologies. See also <a href="https://support.google.com/youtube/answer/2734796?hl=en">Add your own subtitles &amp; closed captions</a> (YouTube).</td>
+  </tr>
+  <tr>
+   <td colspan="1">
+    <p>1.2.3 Provee texto alternativo o una descripción para el audio del vídeo (A)</p>
+   </td>
+   <td>You should provide text transcripts or audio descriptions for video presented on the web, e.g. HTML5 video. This is for the benefit of people who can't see the visual part of the video, and don't get the full content from the audio alone.</td>
+   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information. No audio description tutorial available as yet.</td>
+  </tr>
+  <tr>
+   <td colspan="1">1.2.4 Provee captions para audio en vivo (AA)</td>
+   <td>You should provide synchronized captions for all live multimedia that contains audio (e.g. video conferences, live audio broadcasts.)</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.2.5 Provee descripciones de adio para vídeo pre-grabado (AA)</td>
+   <td>Audio descriptions should be provided for prerecorded video, but only where the existing audio does not convey the full meaning expressed by the video.</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.2.6 Provee lenguaje de signos equivalente a el audio pre-grabado (AAA)</td>
+   <td>An equivalent sign language video should be provided for any prerecorded content containing audio.</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.2.7 Provee un vídeo extendido con descripciones de audio (AAA)</td>
+   <td>Where audio descriptions cannot be provided (see 1.2.5) due to video timing issues (e.g. there are no suitable pauses in the content in which to insert the audio descriptions), an alternative version of the video should be provided that includes inserted pauses (and audio descriptions).</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.2.8 Provee una alternativa para los elementos multimedia pre-grabados (AAA)</td>
+   <td>For all content that features video, a descriptive text transcript should be provided, for example a script of the movie you are watching. This is for the benefit of hearing impaired viewers who cannot hear the content.</td>
+   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information.</td>
+  </tr>
+  <tr>
+   <td colspan="1">1.2.9 Provee una transcripción para el audio en vivo (AAA)</td>
+   <td>For any live audio content being broadcast, a descriptive text should be provided, for example a script of the play or musical you are listening to. This is for the benefit of hearing impaired viewers who cannot hear the content.</td>
+   <td>See <a href="/en-US/docs/Learn/Accessibility/Multimedia#Audio_transcripts">Audio transcripts</a> for transcript information.</td>
+  </tr>
+ </thead>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: Ver también la descripción de <a href="https://www.w3.org/TR/WCAG21/#time-based-media">WCAG Guideline 1.2: Time-based Media: Provide alternatives for time-based media</a>.</p>
+</div>
+
+<h2 id="Pauta_1.3_—_Crear_contenido_que_pueda_presentarse_de_diferentes_formas">Pauta 1.3 — Crear contenido que pueda presentarse de diferentes formas</h2>
+
+<p>Esta pauta hace referencia a la posibilidad de que todo contenido pueda ser consumido de distintas formas, adaptándose a las necesidades del usuario.</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Criterios de éxito</th>
+   <th scope="col">Cómo cumplir</th>
+   <th scope="col">Recursos prácticos</th>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="1">1.3.1 Info and relationships (A)</td>
+   <td>
+    <p>Any content structure — or visual relationship made between content —  can also be determined programmatically, or be inferred from text description. The main situations in which this is relevant are:</p>
+
+    <ul>
+     <li>Text labels and the form elements they describe are associated unambiguously using the {{htmlelement("label")}} element, which can be picked up by screenreaders, etc.</li>
+     <li>Image alt text — content images should have text available that clearly describes the image's contents, which can be programmatically associated with it (e.g. <code>alt</code> text), or otherwise is easy to associate (e.g. describes it and is sat right next to it). This should means that the full meaning can still be inferred even if you can't see the image.</li>
+     <li>Lists — if the order of list items is important, and ordered list should be used ({{htmlelement("ol")}}).</li>
+    </ul>
+   </td>
+   <td>The whole of
+    <p><a href="/en-US/docs/Learn/Accessibility/HTML">HTML: A good basis for accessibility</a> is packed with information about this, but you should particularly refer to <a href="/en-US/docs/Learn/Accessibility/HTML#Good_semantics">Good semantics</a>, <a href="/en-US/docs/Learn/Accessibility/HTML#UI_controls">UI controls</a>, and <a href="/en-US/docs/Learn/Accessibility/HTML#Text_alternatives">Text alternatives</a>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.3.2 Meaningful content sequence (A)</td>
+   <td>A sensible, logical reading order should be easy to determine for any content, even if it is visually presented in an unusual way. The order should be made obvious by use of correct semantic elements (e.g. headings, paragraphs), with CSS being used to create any unusual layout styles, irrespective of the markup.</td>
+   <td>Again, refer to <a href="/en-US/docs/Learn/Accessibility/HTML">HTML: A good basis for accessibility</a>.</td>
+  </tr>
+  <tr>
+   <td colspan="1">1.3.3 Sensory characteristics (A)</td>
+   <td>
+    <p>Instructions for operating controls or understanding content do not rely on a single sense — this may prove inaccessible to people with a disability related to that sense, or a device that does not support that sense. So for example:</p>
+
+    <ul>
+     <li>"Click the round button to continue" — The button should be clearly labelled so that it is obvious that it is the button you need to press. If there are multiple buttons, make sure there are all clearly labelled to distinguish their function.</li>
+     <li>"Listen to the audio instructions for guidance" — This is obviously problematic — audio will be inaccessible to those with heading impairments, whereas text can be read, but also spoken by a screenreader if required.</li>
+     <li>"Swipe from the right hand side of the screen to reveal the menu" — some users might not be able to swipe the screen, either due to disability or because their device does not support touch. An alternative should be provided, such as a keyboard shortcut or button that can be activated by keyboard or other means.</li>
+    </ul>
+
+    <div class="note">
+    <p><strong>Note</strong>: Conveying instructions solely by color is related, but covered in a different guideline — 1.4.1.</p>
+    </div>
+   </td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.3.4 Orientation (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
+   <td>Content does not restrict its view and operation to a single display orientation, such as portrait or landscape, unless a specific display orientation is essential.</td>
+   <td>
+    <p><a href="https://www.w3.org/WAI/WCAG21/Understanding/orientation.html">Understanding Orientation</a> </p>
+   </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.3.5 Identify Input Purpose (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
+   <td>
+    <p> </p>
+
+    <p>Follow the list of <a href="https://www.w3.org/TR/WCAG21/#input-purposes">53 input fields</a> to programmatically identify the purpose of a field.   </p>
+   </td>
+   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/identify-input-purpose.html">Understanding Identify Input Purpose</a></td>
+  </tr>
+  <tr>
+   <td colspan="1">1.3.6 Identify Purpose (AAA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
+   <td>In content implemented using markup languages, the purpose of User Interface Components, icons, and regions can be programmatically determined.</td>
+   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/identify-purpose.html">Understanding Identify Purpose</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: Ver también la descripción de WCAG: <a href="https://www.w3.org/TR/WCAG21/#adaptable">Guideline 1.3: Adaptable: Create content that can be presented in different ways without losing information or structure.</a></p>
+</div>
+
+<h2 id="Pauta_1.4_Facilitar_a_los_usuarios_ver_y_oír_el_contenido_incluyendo_la_separación_entre_el_primer_plano_y_el_fondo">Pauta 1.4: Facilitar a los usuarios ver y oír el contenido, incluyendo la separación entre el primer plano y el fondo</h2>
+
+<p>Esta pauta tiene como objetivo la creación de contenido que sea fácil de diferenciar del fondo y otras decoraciones. El ejemplo clásico es sobre color (tanto en relación al contraste como utilizarlo para transmitir información), pero aplica también en otras situaciones.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Criterios de éxito</th>
+   <th scope="col">Cómo cumplir</th>
+   <th scope="col">Recursos prácticos</th>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="1">1.4.1 Use of color (A)</td>
+   <td>
+    <p>Color should not be solely relied upon to convey information — for example, in forms you should never mark required fields purely with a color (like red). Instead (or as well as), something like an asterisk with a label of "required" would be more appropriate.</p>
+   </td>
+   <td>See <a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a> and <a href="/en-US/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form#Multiple_labels">Multiple labels</a>.</td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.2 Audio controls (A)</td>
+   <td>For any audio that plays for longer than three seconds, accessible controls should be provided to play and pause the audio/video, and mute/adjust volume.</td>
+   <td>Use native <code>&lt;button&gt;</code>s to provide accessible keyboard controls, as shown in <a href="/en-US/docs/Web/Apps/Fundamentals/Audio_and_video_delivery/Video_player_styling_basics">Video player syling basics</a>.</td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.3 Minimum contrast (AA)</td>
+   <td>
+    <p>The color contrast between background and foreground content should be at a minimum level to ensure legibility:</p>
+
+    <ul>
+     <li>Text and its background should have a contrast ratio of at least 4.5.1.</li>
+     <li>Heading (or just larger) text should have a ratio of at least 3.1. Larger text is defined as at least 18pt, or 14pt bold.</li>
+    </ul>
+   </td>
+   <td>See <a href="/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a>.</td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.4 Resize text (AA)</td>
+   <td>The page should be readable and usable when the text size is doubled. This means that designs should be responsive, so that when the text size is increased, the content is still accessible.</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.5 Images of text (AA)</td>
+   <td>Images should NOT be used to present content where text would do the job. For example, if an image is mostly textual, it could be represented using text as well as images.</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.6 Enhanced contrast (AAA)</td>
+   <td>
+    <p>This follows, and builds on, criterion 1.4.3.</p>
+
+    <ul>
+     <li>Text and its background should have a contrast ratio of at least 7.1.</li>
+     <li>Heading (or just larger) text should have a ratio of at least 4.5.1. Larger text is defined as at least 18pt, or 14pt bold.</li>
+    </ul>
+   </td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.7 Low or no background audio (AAA)</td>
+   <td>Prerecorded audio recordings that primarily feature speech should have minimal background noise, so the content can be easily understood.</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.8 Visual presentation (AAA)</td>
+   <td>
+    <p>For text content presentation, the following should be true:</p>
+
+    <ul>
+     <li>Foreground and background colors should be user-selectable.</li>
+     <li>Text blocks should be no wider than 80 characters (or glyphs), for maximum readability.</li>
+     <li>Text should not be fully justified (e.g. <code>text-align: justify;</code>)</li>
+     <li>line height should be at least 1.5 times the text size within paragraphs (e.g. <code>line-height: 1.5;</code>), and at least 2.25 times the text size between paragraphs (e.g. <code>padding: 2.25rem;</code>)</li>
+     <li>When the text size is doubled, the content should not need to be scrolled.</li>
+    </ul>
+   </td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.9 Images of text (No Exception) (AAA)</td>
+   <td>Text should not be presented as part of an image unless it is purely decoration (i.e. it does not convey any content), or cannot be presented in any other way.</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.10 Reflow (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
+   <td>
+    <ul>
+     <li>No horizontal scrolling for right-to-left languages (like English) or left-to-right languages (like Arabic)   </li>
+     <li>No vertical scrolling for top-to-bottom languages (like Japanese)</li>
+     <li>Except for parts of the content which require two-dimensional layout for usage or meaning (like a large data table).</li>
+    </ul>
+   </td>
+   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/reflow.html">Understanding Reflow</a></td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.11 Non-Text Contrast(AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
+   <td>Minimum color contrast ratio of 3 to 1 for user interface components and graphical objects. </td>
+   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/non-text-contrast.html">Understanding Non-Text Contrast</a></td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.12 Text Spacing (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
+   <td>
+    <p>No loss of content or functionality occurs when the following styles are applied: </p>
+
+    <ul>
+     <li>Line height (line spacing) to at least 1.5 times the font size;</li>
+     <li>Spacing following paragraphs to at least 2 times the font size;</li>
+     <li>Letter spacing (tracking) to at least 0.12 times the font size;</li>
+     <li>Word spacing to at least 0.16 times the font size.</li>
+    </ul>
+   </td>
+   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/text-spacing.html">Understanding Text Spacing</a></td>
+  </tr>
+  <tr>
+   <td colspan="1">1.4.13 Content on Hover or Focus (AA) <em><a href="https://www.w3.org/TR/WCAG21/#new-features-in-wcag-2-1">added in 2.1</a></em></td>
+   <td>
+    <p>Additional content appear and disappear in coordination with hover and keyboard focus, this success criterion specifies three conditions that must be met:</p>
+
+    <ul>
+     <li>dismissable (can be closed/removed)</li>
+     <li>hoverable (the additional content does not disappear when the pointer is over it) </li>
+     <li>persistent (the additional content does not disappear without user action)</li>
+    </ul>
+   </td>
+   <td><a href="https://www.w3.org/WAI/WCAG21/Understanding/content-on-hover-or-focus.html">Understanding Content on Hover or Focus</a></td>
+  </tr>
+ </thead>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: Ver también la descripción de WCAG: <a href="https://www.w3.org/TR/WCAG21/#distinguishable">Guideline 1.4: Distinguishable: Make it easier for users to see and hear content including separating foreground from background.</a><a href="https://www.w3.org/TR/WCAG21/#distinguishable">.</a></p>
+</div>
diff --git a/files/es/web/accessibility/understanding_wcag/text_labels_and_names/index.html b/files/es/web/accessibility/understanding_wcag/text_labels_and_names/index.html
new file mode 100644
index 0000000000..0d4c4a857a
--- /dev/null
+++ b/files/es/web/accessibility/understanding_wcag/text_labels_and_names/index.html
@@ -0,0 +1,267 @@
+---
+title: Etiquetas de texto y nombres
+slug: Web/Accessibility/Understanding_WCAG/Text_labels_and_names
+tags:
+  - Accesibilidad
+  - Etiquetas de texto
+  - WCAG
+translation_of: Web/Accessibility/Understanding_WCAG/Text_labels_and_names
+original_slug: Web/Accesibilidad/Understanding_WCAG/Etiquetas_de_texto_y_nombres
+---
+<p><span class="seoSummary">Hay muchas situaciones en las cuales un control, dialogo o cualquier otra característica de un sitio web deberían recibir un nombre o etiqueta descriptiva para permitir a los usuarios de técnologías asistivas entender cual es su propósito y ser capaz de entenderlo y operarlo correctamente.</span> Hay un número de diferentes tipos de problemas en esta categoría, dependientes del contexto, y cada uno tiene su propia solución. Los diferentes problemas y soluciones son discutidas en las secciones posteriores.</p>
+
+<h2 id="Utilizar_el_atributo_alt_para_etiquetar_elementos_que_ocupen_un_área_que_tiene_el_atributo_href">Utilizar el atributo alt para etiquetar elementos que ocupen un área que tiene el atributo href</h2>
+
+<p>En mapas de imágenes, cada elemento {{htmlelement("area")}} con un atributo <code>alt</code> definiendo un nombre que describa el recurso al que enlaza el area. Fallar al hacer eso provoca que un mapa de imagen sea difícil de usar para usuarios que usen tecnología asistiva — ellos necesitan texto alternativo para ser capaces de entender el propósito de una imagen.</p>
+
+<h3 id="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente ejemplo muestra un simple mapa de imagen (tomada de <a href="https://www.w3.org/TR/WCAG20-TECHS/H24.html">H24: Providing text alternatives for the area elements of image maps</a>):</p>
+
+<pre>&lt;img src="welcome.gif" usemap="#map1"
+    alt="Areas in the library. Select an area for
+more information on that area." /&gt;
+&lt;map id="map1" name="map1"&gt;
+  &lt;area shape="rect" coords="0,0,30,30"
+    href="reference.html" alt="Reference" /&gt;
+  &lt;area shape="rect" coords="34,34,100,100"
+    href="media.html" alt="Audio visual lab" /&gt;
+&lt;/map&gt;</pre>
+
+<p>Ver la <a href="/en-US/docs/Web/HTML/Element/area">página de referencia del elemento</a> <a href="/en-US/docs/Web/HTML/Element/area"><code>&lt;area&gt;</code></a> para unu ejemplo interactivo.</p>
+
+<h3 id="Ver_también">Ver también</h3>
+
+<ul>
+ <li>{{htmlelement("area")}}</li>
+ <li><a href="https://www.w3.org/TR/WCAG20-TECHS/H24.html">H24: Providing text alternatives for the area elements of image maps</a></li>
+</ul>
+
+<h2 id="Los_diálogos_deberían_ser_etiquetados">Los diálogos deberían ser etiquetados</h2>
+
+<p>Para cualquier contenedor cuyo contenido actue como una caja de diálogo (por ejemplo, un modal preguntando al usuario realizar una elección o responder a una acción siendo tomada), debe tener una etiqueta descriptiva o nombre, para que la tecnología asistiva le permita al usuario descrubir fácilmente cual es su propósito.</p>
+
+<p>Una caja de diálogo es generalmente denominada con un ARIA <code><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/dialog_role">role="dialog"</a></code> o <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role">role="alertdialog"</a></code>; se puede usar tanto el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code> o <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a></code> para proporcionar una etiqueta.</p>
+
+<h3 id="Ejemplos_2">Ejemplos</h3>
+
+<p>El siguiente ejemplo muestra una caja de dialogo sencilla, definida como <code>role="dialog"</code> y etiquetada con <code>aria-labelledby</code>.</p>
+
+<pre>&lt;div role="dialog" aria-labelledby="dialog1Title" aria-describedby="dialog1Desc"&gt;
+  &lt;h2 id="dialog1Title"&gt;Your personal details were successfully updated&lt;/h2&gt;
+  &lt;p id="dialog1Desc"&gt;You can change your details at any time in the user account section.&lt;/p&gt;
+  &lt;button&gt;Close&lt;/button&gt;
+&lt;/div&gt;</pre>
+
+<p>Si la caja de diálogo no tiene un encabezado, se puede usar <code>aria-label</code> para contener la etiqueta de texto:</p>
+
+<pre>&lt;div role="dialog" aria-label="Personal details updated confirmation"&gt;
+  &lt;p&gt;Your personal details were successfully updated. You can
+    change your details at any time in the user account section.&lt;/p&gt;
+  &lt;button&gt;Close&lt;/button&gt;
+&lt;/div&gt;</pre>
+
+<h3 id="Ver_también_2">Ver también</h3>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/dialog_role">role="dialog"</a></code></li>
+ <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role">role="alertdialog"</a></code></li>
+ <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code></li>
+ <li><code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a></code></li>
+ <li><a href="https://www.w3.org/TR/wai-aria-1.2/#dialog">WAI-ARIA: dialog role</a></li>
+ <li><a href="https://www.w3.org/TR/wai-aria-practices/#dialog_roles_states_props">Dialog authoring practices</a></li>
+</ul>
+
+<h2 id="Los_documentos_deben_tener_un_título">Los documentos deben tener un título</h2>
+
+<p>Es importante que cada documento HTML, incluya un elemento {{htmlelement("title")}} que describa el propósito de la página. Una técnica común de navegación para usuarios que usan tecnologías asistivas es inferir el contenido de la página leyendo su título. Si no hay título disponible, tienen que navegar por la página para determinar su contenido, lo cual puede ser un proceso largo y confuso.</p>
+
+<h3 id="Ejemplos_3">Ejemplos</h3>
+
+<p>El título para el artículo de refencia sobre el elemento {{htmlelement("title")}} es como sigue:</p>
+
+<pre>&lt;title&gt;&amp;lt;title&amp;gt;: The Document Title element - HTML: Hypertext Markup Language | MDN&lt;/title&gt;</pre>
+
+<p>Otro ejemplo podría ser:</p>
+
+<pre>&lt;title&gt;Fill in your details to register — myGov services&lt;/title&gt;</pre>
+
+<p>Para ayudar al usuario, se puede actualizar el titulo de la página para reflejar cambios significativos al estado de la página (como problemas en la validación de un formulario):</p>
+
+<pre>&lt;title&gt;2 errors — Fill in your details to register — myGov services&lt;/title&gt;</pre>
+
+<h3 id="Ver_también_3">Ver también</h3>
+
+<ul>
+ <li>{{htmlelement("title")}}</li>
+</ul>
+
+<h2 id="Contenido_incrustado_debe_ser_etiquetado">Contenido incrustado debe ser etiquetado</h2>
+
+<p>Asegurarse que elementos que incrusten contenido tengan un atributo título que describa el contenido incrustado. Esto incluye al elemento {{htmlelement("embed")}} y al elemento {{htmlelement("object")}}. Estos elementos son usualmente definidos por un contenido gráfico, similar a un elemento {{HTMLelement("img")}}. Un título descriptivo ayuda a los usuarios de tecnologías asistivas entender que muestra el elemento.</p>
+
+<h2 id="Figuras_con_leyendas_opcionales_deberían_ser_etiquetadas">Figuras con leyendas opcionales deberían ser etiquetadas</h2>
+
+<p>Para una mejor accesibilidad, incluir un {{HTMLElement("figcaption")}} dentro de un elemento {{HTMLElement("figure")}}, incluso si hacerlo es opcional técnicamente. La leyenda es adicional a cualquier texto alternativo en las imágenes dentro de la figura. La leyenda describe el proósito de una figura en el documento, que puede ser diferente de una descripción sencilla de un elemento visual, tal como lo proporciona el texto alternativo.</p>
+
+<h3 id="Ejemplo">Ejemplo</h3>
+
+<p>El siguiente ejemplo muestra código para una figura con un pie de página. El atributo <code>alt</code> del elemento {{htmlelement("img")}} describe la apariencia de la imagen; el elemento {{htmlelement("figcaption")}} lo describe desde una perspectiva funcional (en este caso, el nombre en latín de la flor de la imagen).</p>
+
+<pre>&lt;figure&gt;
+  &lt;img src="milkweed.jpg"
+      alt="Black and white close-up photo of milkweed flowers"&gt;
+ &lt;figcaption&gt;Asclepias verticillata&lt;/figcaption&gt;
+&lt;/figure&gt;
+</pre>
+
+<h2 id="Los_elementos_de_un_conjuto_campos_deben_ser_etiquetados">Los elementos de un conjuto campos deben ser etiquetados</h2>
+
+<p>Los elementos de un conjunto de campos (fieldset) deben tener un texto descriptivo, similar a otros elementos del formulario. Utilice el elemento {{htmlelement("legend")}} para describir el propósito de un conjunto de campos (fieldset).</p>
+
+<h2 id="Utilizar_una_leyenda_para_etiquetar_un_conjunto_de_campos">Utilizar una leyenda para etiquetar un conjunto de campos</h2>
+
+<p>Al agrupar un conjunto de elementos de un formulario con un elemento {{htmlelement("fieldset")}}, se debería incluir un elemento {{htmlelement("legend")}} anidado dento de éste, conteninedo una clara descripción del grupo.</p>
+
+<p>Usuarios de tecnologías asistivas encuentras esta descripción útil cuando tratan de entender el propósito del grupo. Sin la leyenda, tienen que navegar individualmente por todos los controles del formulario en el grupo para inferir una idea del propósito general, lo que puede resultar confuso.</p>
+
+<h3 id="Ejemplo_2">Ejemplo</h3>
+
+<pre>&lt;form&gt;
+  &lt;fieldset&gt;
+    &lt;legend&gt;Choose your favorite monster&lt;/legend&gt;
+
+    &lt;input type="radio" id="kraken" name="monster"&gt;
+    &lt;label for="kraken"&gt;Kraken&lt;/label&gt;&lt;br/&gt;
+
+    &lt;input type="radio" id="sasquatch" name="monster"&gt;
+    &lt;label for="sasquatch"&gt;Sasquatch&lt;/label&gt;&lt;br/&gt;
+
+    &lt;input type="radio" id="mothman" name="monster"&gt;
+    &lt;label for="mothman"&gt;Mothman&lt;/label&gt;
+  &lt;/fieldset&gt;
+&lt;/form&gt;</pre>
+
+<p>Puede ver un ejemplo interactivo en la <a href="/en-US/docs/Web/HTML/Element/fieldset"> página de referencia de <code>&lt;fieldset&gt;</code></a>.</p>
+
+<h3 id="Ver_también_4">Ver también</h3>
+
+<ul>
+ <li>{{htmlelement("fieldset")}}</li>
+ <li>{{htmlelement("legend")}}</li>
+</ul>
+
+<h2 id="Los_elementos_de_un_formulario_deben_estar_etiquetados">Los elementos de un formulario deben estar etiquetados</h2>
+
+<p>Todos los elementos dentro de un formulario deben tener un elemento {{htmlelement("label")}} que identifique su propósito. Esto aplica a todos los tipos de elementos {{htmlelement("input")}}, como también para elementos {{htmlelement("button")}}, {{htmlelement("output")}}, {{htmlelement("select")}}, {{htmlelement("textarea")}}, {{htmlelement("progress")}} y {{htmlelement("meter")}}, como para cualquier elemento con el <a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Switch_role"> ARIA role</a> <a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Switch_role"><code>switch</code></a>.</p>
+
+<p>El elemento del formulario puede ser puesto dentro de un elemento {{htmlelement("label")}}, en cuyo caso la asociación entre el elemento del formulario y la etiqueta es obvia por la estructura. O, se puede crear una asociación entre un {{htmlelement("label")}} y el elemento del formulario al especificar el valor <code>id</code> del elemento del formulario y el valor del atributo <code>for</code> de la etiqueta.</p>
+
+<h3 id="Ejemplos_4">Ejemplos</h3>
+
+<pre>&lt;label&gt;I agree to the terms and conditions.
+  &lt;input type="checkbox" id="terms"&gt;
+&lt;/label&gt;
+
+&lt;input type="checkbox" id="emailoptin"&gt;
+&lt;label for="emailoptin"&gt;Yes, please send me news about this product.&lt;/label&gt;
+</pre>
+
+<h2 id="Los_elementos_de_un_formulario_deberían_tener_una_etiqueta_de_texto_visible">Los elementos de un formulario deberían tener una etiqueta de texto visible</h2>
+
+<p>En adición a tener un elemento {{htmlelement("label")}} para cada elemento del formulario, estas etiquetas deberían ser visibles, no ocultarse. Las etiquetas visbles ayudan a <em>todos</em> los usuarios entender el propósito de un elemento de formulario. No dependa de un texto temporal porque éste desaparece tan pronto como el usuario empieza a escribir.</p>
+
+<h2 id="Los_elementos_marco_frame_deben_estar_etiquetados">Los elementos marco ('frame') deben estar etiquetados</h2>
+
+<p>Los elementos marco ('frame'), tanto {{htmlelement("iframe")}} como el obsoleto y antiguo {{htmlelement("frame")}}, deben tener un título para describir el contenido del marco. Utilice el atributo <code>title</code> para etiquetar un elemento 'frame'. Sin un título, los usuarios que usen una tecnología asistiva tienen que navegar dentro del marco para entender que contiene, lo que puede ser difícil y confuso. </p>
+
+<p>El elemento <code>&lt;frame&gt;</code> ya no forma parte de la especificación HTML en la versión HTML5. El soporte podría ser abandonado por los navegadores en el futuro. Además, es difícil para los lectores de pantalla el navegar páginas con elementos <code>&lt;frame&gt;</code>. Para una mejor accesibilidad y mantenimiento futuro, se debe rediseñar cualquier página que use marcos y reemplazarlos con el uso de CSS para lograr un diseño similar.</p>
+
+<p>Como una mejor práctica, también proporcionar un {{htmlelement("title")}} para el documento que esta encapsulado en el marco, con un contenido identico al atributo <code>title</code> del marco. (Esto asumiendo que el documento encapsulado esta en control de uno, si no, tratar de coincidir el atributo <code>title</code> del marco con el título del documento.) Algunos lectores de pantalla reemplazan el contenido del atributo <code>title</code> con el contenido del {{htmlelement("title")}} del documento encapsulado. Es más seguro y más accesible el proporcionar el mismo título en ambos lugares.</p>
+
+<h3 id="Ejemplos_5">Ejemplos</h3>
+
+<pre>&lt;iframe
+    title="MDN Web docs"
+    width="300"
+    height="200"
+    src="https://developer.mozilla.org"&gt;
+&lt;/iframe&gt;
+
+</pre>
+
+<h2 id="Usar_el_atributo_alt_para_etiquetar_elementos_mglyph">Usar el atributo alt para etiquetar elementos mglyph</h2>
+
+<p>Al escribir ecuaciones con MathML, a cada elemento {{mathmlelement("mglyph")}} se le debe asignar el atributo <code>alt</code> conteniendo un nombre que describa el símbolo. Puesto que los elementos <code>mglyph</code> son usados para símbolos no estándar sin definiciones Unicode, los lectores de pantalla no serán capaces de automáticamente nombrarlos. El texto alternativo ayuda a los usuarios de lectores de pantalla entender el símbolo.</p>
+
+<h2 id="Los_encabezados_deben_ser_etiquetados">Los encabezados deben ser etiquetados</h2>
+
+<p>Asegurarse que los encabezados tengan un contenido no vacío y no estén ocultos como con el CSS <code>display:none</code> o <code>aria-hidden=true</code>. Los usuarios de lectores de pantalla confían en los encabezados para entender la estructura y el contenido de un documento.</p>
+
+<p>Además, es importante usar los <a href="/en-US/docs/Web/HTML/Element/Heading_Elements">elementos de encabezado</a> sólo para los encabezados de sección reales, y no como una forma rápida de hacer que el texto se destaque. Los lectores de pantalla suelen "hojear" los encabezados de una página, de manera muy parecida a los usuarios con visión, el texto que no sea encabezado que se marca con elementos de encabezamiento puede causar confusión.</p>
+
+<h2 id="Los_encabezados_deberían_tener_contenido_de_texto_visible">Los encabezados deberían tener contenido de texto visible</h2>
+
+<p>Asegurarse que los encabezados tengan un contenido no vacío y no estén ocultos como con el CSS <code>display:none</code> or <code>aria-hidden=true</code>. Los usuarios de lectores de pantalla confían en los encabezados para entender la estructura y el contenido de un documento. No use encabezados para marcar imágenes u otro contenido gráfico.</p>
+
+<h2 id="Utilizar_el_atributo_title_para_describir_el_contenido_de_un_&lt;iframe>">Utilizar el atributo title para describir el contenido de un &lt;iframe&gt;</h2>
+
+<p>Asegurarse que los elementos {{htmlelement("iframe")}} tienen un atributo <code>title</code> para describir el contenido de un marco. Sin un título, los usuarios de tecnologías asistivas tienen que navegar dentro del marco para entender que contiene, lo que puede ser difícil y confuso. </p>
+
+<p>Una mejor práctica consiste en proveer un {{htmlelement("title")}} al documento encapsulado por el marco, con un contenido identico al atributo <code>title</code> del marco. (Asumiendo que el documento encapsulado es propio, si no, tratar de hacer coincidir el atributo <code>title</code> del marco con el título del documento.) Algunos lectores de pantalla reemplazan el contenido del atributo <code>title</code> con el contenido del {{htmlelement("title")}} del documento encapsulado. Es más seguro y accesible definir el mismo título en ambos lugares.</p>
+
+<h2 id="Contenido_con_imágenes_deben_ser_etiquetados">Contenido con imágenes deben ser etiquetados</h2>
+
+<p>Proporcionar un texto descriptivo para todas las imágenes y elementos parecidos a imágenes que tengan contenido (es decir que no sean decorativos. Esto incluye imágenes SVG, elementos {{htmlelement("img")}}, {{htmlelement("canvas")}}, {{htmlelement("map")}}, y {{htmlelement("area")}}, así como elementos {{htmlelement("input")}} donde este definido <code>type=image</code> y elementos {{htmlelement("object")}} donde el <code>type</code> empiece con <code>image/</code>. La forma típica de hacer esto es con el atributo <code>alt</code>. Asegurarse de que la descripción trasmite lo que muestra la imagen</p>
+
+<h3 id="Ejemplo_3">Ejemplo</h3>
+
+<pre>&lt;img src="milkweed.jgp"
+     alt="Black and white close-up photo of milkweed flowers"&gt; </pre>
+
+<h2 id="Elementos_interactivos_deben_ser_etiquetados">Elementos interactivos deben ser etiquetados</h2>
+
+<p>Si un elemento esta destinado para que los usuarios interactúen con él, debe estar etiquetado. Los elementos interactivos incluyen enlaces ({{htmlelement("a")}}), elementos de un formulario, botones, y cualquier elemento que tenga manejadores de eventos para ratón o teclado. La forma para etiquetar un elemento depende de su tipo: para elementos de un formulario, utilizar un {{htmlelement("label")}}; para enlaces, botones y elementos sobre los que se puede hacere click, el contenido del texto del elemento suele proporcionar la etiqueta. Si no existe otra opción para etiquetar un elemento, utilizar el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code>.</p>
+
+<h2 id="Usar_el_atributo_label_en_elementos_optgroup">Usar el atributo label en elementos optgroup</h2>
+
+<p>En un elemento {{htmlelement("optgroup")}}, utilizar el atributo <code>label</code> para describir el gupo para que tecnologías asistivas puedan acceder a dicha descripción para sus usuarios.</p>
+
+<h3 id="Ejemplo_4">Ejemplo</h3>
+
+<p>En este ejemplo, el atributo <code>label</code> en los elementos <code>&lt;optgroup&gt;</code> da un nombre de categoría para el grupo de opciones.</p>
+
+<pre>&lt;label for="dino-select"&gt;Choose a dinosaur:&lt;/label&gt;
+&lt;select id="dino-select"&gt;
+    &lt;optgroup label="Theropods"&gt;
+        &lt;option&gt;Tyrannosaurus&lt;/option&gt;
+        &lt;option&gt;Velociraptor&lt;/option&gt;
+        &lt;option&gt;Deinonychus&lt;/option&gt;
+    &lt;/optgroup&gt;
+    &lt;optgroup label="Sauropods"&gt;
+        &lt;option&gt;Diplodocus&lt;/option&gt;
+        &lt;option&gt;Saltasaurus&lt;/option&gt;
+        &lt;option&gt;Apatosaurus&lt;/option&gt;
+    &lt;/optgroup&gt;
+&lt;/select&gt;</pre>
+
+<h2 id="Las_barras_de_herramientas_deben_ser_etiquetadas_cuando_haya_más_de_una_barra">Las barras de herramientas deben ser etiquetadas cuando haya más de una barra</h2>
+
+<p>Si se define más una barra de herramientas en una aplicación web utilizando el rol ARIA <code>toolbar</code>, se debe usar el atributo <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute">aria-label</a></code> para etiquetar cada una de ellas de manera que pueda ser descrita por la tecnología de asistencia. Es una buena práctica etiquetar una barra de herramientas aún cuando solo haya una en la página</p>
+
+<h3 id="Ver_también_5">Ver también</h3>
+
+<ul>
+ <li><a href="https://www.w3.org/TR/wai-aria-practices/examples/toolbar/toolbar.html">Ejemplo de una barra de herramienta W3C ARIA (W3C ARIA toolbar example)</a></li>
+</ul>
+
+<h2 id="Criterios_de_aprobación_relacionados_a_WCAG">Criterios de aprobación relacionados a WCAG</h2>
+
+<dl>
+ <dt><a href="https://www.w3.org/TR/WCAG21/#non-text-content">1.1.1 Contenido no textual (A)</a></dt>
+ <dd>Todo contenido no textual que es presentado al usuario tiene un texto alternativo que sirve un propósito similar, excepto para las situaciones listadas en el enlace anterior.</dd>
+ <dt><a href="https://www.w3.org/TR/WCAG21/#link-purpose-in-context">2.4.4 Propósito del enlace (en contexto) (A)</a></dt>
+ <dd>El propósito de cada enlace puede determinarse a partir del texto del enlace o del texto del enlace en conjunto con contexto determinado programáticamente, salvo cuando el propósito del enlace sea ambiguo para los usuarios en general.</dd>
+ <dt><a href="https://www.w3.org/TR/WCAG21/#link-purpose-link-only">2.4.9 Propósito del enlace (sólo el enlace) (AAA)</a></dt>
+ <dd>Se dispone de un mecanismo que permite identificar el propósito de cada enlace a partir del texto del enlace solamente, excepto cuando el propósito del enlace es ambiguo para los usuarios en general.</dd>
+</dl>
diff --git a/files/es/web/api/animation/animación/index.html b/files/es/web/api/animation/animación/index.html
deleted file mode 100644
index 770036b76d..0000000000
--- a/files/es/web/api/animation/animación/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: Animation()
-slug: Web/API/Animation/Animación
-tags:
-  - Animacion
-translation_of: Web/API/Animation/Animation
----
-<p>{{ SeeCompatTable() }}{{ APIRef("Web Animations API") }}</p>
-
-<p>El constructor <strong><code>Animation()</code></strong> de <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a> devuelve una instancia del objeto <code>Animation</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var <em>animation</em> = new Animation([<em>effect</em>][, <em>timeline</em>]);</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>effect</code> {{optional_inline}}</dt>
- <dd>El efecto objetivo, es un objeto de la interfaz {{domxref("AnimationEffectReadOnly")}} ,para asignarlo a la animación. Aunque en el futuro podrían ser asignados otros efectos como <code>SequenceEffect</code> o <code>GroupEffect</code>, el único efecto disponible actualmente es {{domxref("KeyframeEffect")}}. Este puede ser <code>null</code> (valor por defecto) para indicar que no debe aplicarse ningún efecto.</dd>
- <dt><code>timeline</code> {{optional_inline}}</dt>
- <dd>Especifica el  <code>timeline</code> con el que asociar la animación, como un objeto de tipo basado en la interfaz {{domxref("AnimationTimeline")}} . Actualmente el único tipo de línea de tiempo disponible es {{domxref("DocumentTimeline")}}, pero en el futuro habrá lineas de tiempo asociadas , por ejemplo, con gestos o desplazamiento. El valor por defecto es {{domxref("Document.timeline")}}, pero puede ser establecido en <code>null</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>En el ejemplo <a href="http://codepen.io/rachelnabors/pen/eJyWzm/?editors=0010">Follow the White Rabbit </a>, el constructor <code>Animation()</code> es usado para crear una <code>Animation</code> para el <code>rabbitDownKeyframes</code> utilizando el <code>timeline</code> del documento:</p>
-
-<pre class="brush: js">var rabbitDownAnimation = new Animation(rabbitDownKeyframes, document.timeline);
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Animations', '#dom-animation-animation', 'Animation()' )}}</td>
-   <td>{{Spec2('Web Animations')}}</td>
-   <td>Editor's draft.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile(48)}} <sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] La Web Animations API solo está habilitada de manera predeterminada en Firefox Developer Edition y Nightly builds. Puedes habilitarla en compilaciones de lanzamiento estableciendo la preferencia de <code>dom.animations-api.core.enabled</code> en <code>true</code>, y puede desactivarse en cualquier versión de Firefox estableciendo esta preferencia en <code>false</code>.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a></li>
- <li>{{domxref("Animation")}}</li>
-</ul>
diff --git a/files/es/web/api/animation/animation/index.html b/files/es/web/api/animation/animation/index.html
new file mode 100644
index 0000000000..b5f693e9bb
--- /dev/null
+++ b/files/es/web/api/animation/animation/index.html
@@ -0,0 +1,107 @@
+---
+title: Animation()
+slug: Web/API/Animation/Animation
+tags:
+  - Animacion
+translation_of: Web/API/Animation/Animation
+original_slug: Web/API/Animation/Animación
+---
+<p>{{ SeeCompatTable() }}{{ APIRef("Web Animations API") }}</p>
+
+<p>El constructor <strong><code>Animation()</code></strong> de <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a> devuelve una instancia del objeto <code>Animation</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <em>animation</em> = new Animation([<em>effect</em>][, <em>timeline</em>]);</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>effect</code> {{optional_inline}}</dt>
+ <dd>El efecto objetivo, es un objeto de la interfaz {{domxref("AnimationEffectReadOnly")}} ,para asignarlo a la animación. Aunque en el futuro podrían ser asignados otros efectos como <code>SequenceEffect</code> o <code>GroupEffect</code>, el único efecto disponible actualmente es {{domxref("KeyframeEffect")}}. Este puede ser <code>null</code> (valor por defecto) para indicar que no debe aplicarse ningún efecto.</dd>
+ <dt><code>timeline</code> {{optional_inline}}</dt>
+ <dd>Especifica el  <code>timeline</code> con el que asociar la animación, como un objeto de tipo basado en la interfaz {{domxref("AnimationTimeline")}} . Actualmente el único tipo de línea de tiempo disponible es {{domxref("DocumentTimeline")}}, pero en el futuro habrá lineas de tiempo asociadas , por ejemplo, con gestos o desplazamiento. El valor por defecto es {{domxref("Document.timeline")}}, pero puede ser establecido en <code>null</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>En el ejemplo <a href="http://codepen.io/rachelnabors/pen/eJyWzm/?editors=0010">Follow the White Rabbit </a>, el constructor <code>Animation()</code> es usado para crear una <code>Animation</code> para el <code>rabbitDownKeyframes</code> utilizando el <code>timeline</code> del documento:</p>
+
+<pre class="brush: js">var rabbitDownAnimation = new Animation(rabbitDownKeyframes, document.timeline);
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Animations', '#dom-animation-animation', 'Animation()' )}}</td>
+   <td>{{Spec2('Web Animations')}}</td>
+   <td>Editor's draft.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile(48)}} <sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] La Web Animations API solo está habilitada de manera predeterminada en Firefox Developer Edition y Nightly builds. Puedes habilitarla en compilaciones de lanzamiento estableciendo la preferencia de <code>dom.animations-api.core.enabled</code> en <code>true</code>, y puede desactivarse en cualquier versión de Firefox estableciendo esta preferencia en <code>false</code>.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a></li>
+ <li>{{domxref("Animation")}}</li>
+</ul>
diff --git a/files/es/web/api/animation/currenttime/index.html b/files/es/web/api/animation/currenttime/index.html
new file mode 100644
index 0000000000..d32168ef4d
--- /dev/null
+++ b/files/es/web/api/animation/currenttime/index.html
@@ -0,0 +1,115 @@
+---
+title: Animation.currentTime
+slug: Web/API/Animation/currentTime
+tags:
+  - Animacion
+translation_of: Web/API/Animation/currentTime
+original_slug: Web/API/Animation/tiempoActual
+---
+<p>{{APIRef("Web Animations")}}{{SeeCompatTable}}</p>
+
+<p>La propiedad <code><strong>Animation</strong></code><strong><code>.currentTime</code></strong> de la <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a> devuelve y establece el valor del tiempo de la animación en milisegundos, tanto si se está ejecutando como en pausa.</p>
+
+<p>Si la animación carece de un {{domxref("AnimationTimeline", "timeline")}}, está inactiva, o no ha sido reproducida todavía, el valor devuelto por <code>currentTime</code> es <code>null</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <em>currentTime</em> = <em>Animation</em>.currentTime;
+<em>Animation</em>.currentTime =<em> newTime;</em></pre>
+
+<h3 id="Valor">Valor</h3>
+
+<p>Un número que representa el tiempo actual en milisegundos, o <code>null</code> para desactivar la animación.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>En el juego <a href="http://codepen.io/rachelnabors/pen/PNYGZQ?editors=0010">Drink Me/Eat Me </a>, la altura de Alicia está animada, por lo que puede cambiar de pequeña a grande y de grande a pequeña. Al inicio del juego, su altura de fija estableciendo el <code>currentTime</code> (tiempoActual) a la mitad de la duración total del<a href="/en-US/docs/Web/API/Web_Animations_API/Animation_timing_options"><code>KeyframeEffect</code></a>:</p>
+
+<pre class="brush: js">aliceChange<strong>.</strong>currentTime = aliceChange.effect.timing.duration / 2;</pre>
+
+<p>Un modo más genérico para encontrar la marca del 50% en una animación sería :</p>
+
+<pre class="brush: js">animation.currentTime =
+  animation.effect.getComputedTiming().delay +
+  animation.effect.getComputedTiming().activeDuration / 2;</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Animations', '#dom-animation-currenttime', 'currentTime')}}</td>
+   <td>{{Spec2("Web Animations")}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(39.0)}}</td>
+   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(39.0)}}</td>
+   <td>{{CompatGeckoMobile(48)}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(39.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] La Web Animations API solo está habilitada por defecto en Firefox Developer Edition y Nightly builds. Puedes habilitarlo en versiones Beta estableciendo la preferencia <code>dom.animations-api.core.enabled</code> en <code>true</code>, y puede ser deshabilitado en cualquier versión de Firefox, estableciendo esta preferencia en <code>false</code>.</p>
+
+<h2 id="Ver_también" style="line-height: 30px; font-size: 2.14285714285714rem;">Ver también</h2>
+
+<ul>
+ <li>{{domxref("Animation")}} <span id="result_box" lang="es"><span>para otros métodos y propiedades que puede usar para controlar la animación de la página web</span></span>.</li>
+ <li>{{domxref("Animation.startTime")}} para programar el tiempo de inicio de una animación.</li>
+ <li><a href="/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a></li>
+</ul>
diff --git a/files/es/web/api/animation/finished/index.html b/files/es/web/api/animation/finished/index.html
new file mode 100644
index 0000000000..a2381e8f00
--- /dev/null
+++ b/files/es/web/api/animation/finished/index.html
@@ -0,0 +1,121 @@
+---
+title: Animation.finished
+slug: Web/API/Animation/finished
+tags:
+  - API
+  - Animacion
+  - Animaciones Web
+  - Experimental
+  - Reference
+translation_of: Web/API/Animation/finished
+original_slug: Web/API/Animation/terminado
+---
+<p>{{ SeeCompatTable() }}{{ APIRef("Web Animations") }}</p>
+
+<p>La propiedad de solo-lectura de <code><strong>Animation</strong></code><strong><code>.finished</code></strong> de la  <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a> devuelve un {{jsxref("Promise")}} que se resuelve una vez que la animación a terminado de reproducirse.</p>
+
+<div class="note">
+<p>Una vez que la reproducción de la animación abandona el estado  <code>finished</code>  ( es decir, la reproducción se está ejecutando otra vez ), Un nuevo <code>Promise</code> es creado para esta propiedad. El nuevo <code>Promise</code> será resuelto cuando se haya completado la actual secuencia de la animación.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <em>animationsPromise</em> = <em>Animation.</em>finished;
+</pre>
+
+<h3 id="Valor">Valor</h3>
+
+<p>Un objeto {{jsxref("Promise")}} que se resuelve cuando haya finalizado la reproducción de la animación.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente código espera a que todas las animaciones que se ejecutan en el elemento <code>elem</code> hayan terminado, después elimina el elemento del arbol del DOM:</p>
+
+<pre class="brush: js">Promise.all(
+  elem.getAnimations().map(
+    function(animation) {
+      return animation.finished
+    }
+  )
+).then(
+  function() {
+    return elem.remove();
+  }
+);</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Animations', '#dom-animation-finished', 'Animation.finished' )}}</td>
+   <td>{{Spec2('Web Animations')}}</td>
+   <td>Editor's draft.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] La Web Animations API solo está habilitada por defecto en Firefox Developer Edition y Nightly builds. Puedes habilitarlo en versiones Beta y de lanzamiento estableciendo la preferencia <code>dom.animations-api.core.enabled</code> en <code>true</code>, y puedes deshabilitarlo en cualquier versión de Firefox estableciendo esta propiedad en <code>false</code>.</p>
+
+<h2 id="Ver_también" style="line-height: 30px; font-size: 2.14285714285714rem;">Ver también</h2>
+
+<ul>
+ <li>{{domxref("KeyframeEffect")}}</li>
+ <li><a href="/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a></li>
+ <li>{{domxref("Animation")}}</li>
+</ul>
diff --git a/files/es/web/api/animation/terminado/index.html b/files/es/web/api/animation/terminado/index.html
deleted file mode 100644
index 5d321ba012..0000000000
--- a/files/es/web/api/animation/terminado/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: Animation.finished
-slug: Web/API/Animation/terminado
-tags:
-  - API
-  - Animacion
-  - Animaciones Web
-  - Experimental
-  - Reference
-translation_of: Web/API/Animation/finished
----
-<p>{{ SeeCompatTable() }}{{ APIRef("Web Animations") }}</p>
-
-<p>La propiedad de solo-lectura de <code><strong>Animation</strong></code><strong><code>.finished</code></strong> de la  <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a> devuelve un {{jsxref("Promise")}} que se resuelve una vez que la animación a terminado de reproducirse.</p>
-
-<div class="note">
-<p>Una vez que la reproducción de la animación abandona el estado  <code>finished</code>  ( es decir, la reproducción se está ejecutando otra vez ), Un nuevo <code>Promise</code> es creado para esta propiedad. El nuevo <code>Promise</code> será resuelto cuando se haya completado la actual secuencia de la animación.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var <em>animationsPromise</em> = <em>Animation.</em>finished;
-</pre>
-
-<h3 id="Valor">Valor</h3>
-
-<p>Un objeto {{jsxref("Promise")}} que se resuelve cuando haya finalizado la reproducción de la animación.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente código espera a que todas las animaciones que se ejecutan en el elemento <code>elem</code> hayan terminado, después elimina el elemento del arbol del DOM:</p>
-
-<pre class="brush: js">Promise.all(
-  elem.getAnimations().map(
-    function(animation) {
-      return animation.finished
-    }
-  )
-).then(
-  function() {
-    return elem.remove();
-  }
-);</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Animations', '#dom-animation-finished', 'Animation.finished' )}}</td>
-   <td>{{Spec2('Web Animations')}}</td>
-   <td>Editor's draft.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] La Web Animations API solo está habilitada por defecto en Firefox Developer Edition y Nightly builds. Puedes habilitarlo en versiones Beta y de lanzamiento estableciendo la preferencia <code>dom.animations-api.core.enabled</code> en <code>true</code>, y puedes deshabilitarlo en cualquier versión de Firefox estableciendo esta propiedad en <code>false</code>.</p>
-
-<h2 id="Ver_también" style="line-height: 30px; font-size: 2.14285714285714rem;">Ver también</h2>
-
-<ul>
- <li>{{domxref("KeyframeEffect")}}</li>
- <li><a href="/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a></li>
- <li>{{domxref("Animation")}}</li>
-</ul>
diff --git a/files/es/web/api/animation/tiempoactual/index.html b/files/es/web/api/animation/tiempoactual/index.html
deleted file mode 100644
index acd56f9170..0000000000
--- a/files/es/web/api/animation/tiempoactual/index.html
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: Animation.currentTime
-slug: Web/API/Animation/tiempoActual
-tags:
-  - Animacion
-translation_of: Web/API/Animation/currentTime
----
-<p>{{APIRef("Web Animations")}}{{SeeCompatTable}}</p>
-
-<p>La propiedad <code><strong>Animation</strong></code><strong><code>.currentTime</code></strong> de la <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a> devuelve y establece el valor del tiempo de la animación en milisegundos, tanto si se está ejecutando como en pausa.</p>
-
-<p>Si la animación carece de un {{domxref("AnimationTimeline", "timeline")}}, está inactiva, o no ha sido reproducida todavía, el valor devuelto por <code>currentTime</code> es <code>null</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var <em>currentTime</em> = <em>Animation</em>.currentTime;
-<em>Animation</em>.currentTime =<em> newTime;</em></pre>
-
-<h3 id="Valor">Valor</h3>
-
-<p>Un número que representa el tiempo actual en milisegundos, o <code>null</code> para desactivar la animación.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>En el juego <a href="http://codepen.io/rachelnabors/pen/PNYGZQ?editors=0010">Drink Me/Eat Me </a>, la altura de Alicia está animada, por lo que puede cambiar de pequeña a grande y de grande a pequeña. Al inicio del juego, su altura de fija estableciendo el <code>currentTime</code> (tiempoActual) a la mitad de la duración total del<a href="/en-US/docs/Web/API/Web_Animations_API/Animation_timing_options"><code>KeyframeEffect</code></a>:</p>
-
-<pre class="brush: js">aliceChange<strong>.</strong>currentTime = aliceChange.effect.timing.duration / 2;</pre>
-
-<p>Un modo más genérico para encontrar la marca del 50% en una animación sería :</p>
-
-<pre class="brush: js">animation.currentTime =
-  animation.effect.getComputedTiming().delay +
-  animation.effect.getComputedTiming().activeDuration / 2;</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Animations', '#dom-animation-currenttime', 'currentTime')}}</td>
-   <td>{{Spec2("Web Animations")}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(39.0)}}</td>
-   <td>{{CompatGeckoDesktop(48)}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(39.0)}}</td>
-   <td>{{CompatGeckoMobile(48)}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(39.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] La Web Animations API solo está habilitada por defecto en Firefox Developer Edition y Nightly builds. Puedes habilitarlo en versiones Beta estableciendo la preferencia <code>dom.animations-api.core.enabled</code> en <code>true</code>, y puede ser deshabilitado en cualquier versión de Firefox, estableciendo esta preferencia en <code>false</code>.</p>
-
-<h2 id="Ver_también" style="line-height: 30px; font-size: 2.14285714285714rem;">Ver también</h2>
-
-<ul>
- <li>{{domxref("Animation")}} <span id="result_box" lang="es"><span>para otros métodos y propiedades que puede usar para controlar la animación de la página web</span></span>.</li>
- <li>{{domxref("Animation.startTime")}} para programar el tiempo de inicio de una animación.</li>
- <li><a href="/en-US/docs/Web/API/Web_Animations_API">Web Animations API</a></li>
-</ul>
diff --git a/files/es/web/api/api_de_almacenamiento_web/index.html b/files/es/web/api/api_de_almacenamiento_web/index.html
deleted file mode 100644
index 26a858d254..0000000000
--- a/files/es/web/api/api_de_almacenamiento_web/index.html
+++ /dev/null
@@ -1,146 +0,0 @@
----
-title: API de almacenamiento web
-slug: Web/API/API_de_almacenamiento_web
-tags:
-  - API
-  - API de almacenamiento web
-  - Almacenamiento web
-  - Storage
-  - localStorage
-  - sessionStorage
-translation_of: Web/API/Web_Storage_API
----
-<p>{{DefaultAPISidebar("Web Storage API")}}</p>
-
-<p>La <strong>API de almacenamiento web</strong> proporciona los mecanismos mediante los cuales el navegador puede almacenar información de tipo clave/valor, de una forma mucho más intuitiva que utilizando cookies.</p>
-
-<h2 id="Almacenamiento_web_conceptos_y_uso"><strong>Almacenamiento web, conceptos y uso</strong></h2>
-
-<p>Los dos mecanismos en el almacenamiento web son los siguientes:</p>
-
-<ul>
- <li><strong><code>sessionStorage</code> </strong>mantiene un área de almacenamiento separada para cada origen que está disponible mientras dure la sesión de la página (mientras el navegador esté abierto, incluyendo recargas de página y restablecimientos).</li>
- <li><strong><code>localStorage</code> </strong>hace lo mismo, pero persiste incluso cuando el navegador se cierre y se reabra.</li>
-</ul>
-
-<p>Estos mecanismos están disponibles mediante las propiedades <a href="https://developer.mozilla.org/es/docs/Web/API/Window/sessionStorage" title="La propiedad sessionStorage permite acceder a un objeto Storage asociado a la sesión actual. La propiedad sessionStorage es similar a localStorage, la única diferencia es que la información almacenada en localStorage no posee tiempo de expiración, por el contrario la información almacenada en sessionStorage es eliminada al finalizar la sesion de la página. La sesión de la página perdura mientras el navegador se encuentra abierto, y se mantiene por sobre las recargas y reaperturas de la página. Abrir una página en una nueva pestaña o ventana iniciará una nueva sesión, lo que difiere en la forma en que trabajan las cookies de sesión."><code>Window.sessionStorage</code></a> y  <a href="https://developer.mozilla.org/es/docs/Web/API/Window/localStorage" title="La propiedad localStorage te permite acceder al objeto local Storage. localStorage es similar a sessionStorage. La única diferencia es que, mientras los datos almacenados en localStorage no tienen fecha de expiración, los datos almacenados en sessionStorage son eliminados cuando finaliza la sesion de navegación - lo cual ocurre cuando se cierra el navegador."><code>Window.localStorage</code></a> (dicho con más precisión, en navegadores con soporte, el objeto <code>Window</code> implementa los objetos  <code>WindowLocalStorage</code> y <code>WindowSessionStorage</code>, en los cuales se basan las propiedades <code>localStorage</code> y <code>sessionStorage</code>). Al invocar uno de éstos, se creará una instancia del objeto <a href="https://developer.mozilla.org/es/docs/Web/API/Storage" title="La interfaz Storage de la API de almacenamiento web provee acceso al almacenamiento de la sesión o al almacenamiento local para un dominio en particular, permitiéndote por ejemplo añadir, modificar o eliminar elementos de dato almacenados."><code>Storage</code></a>, a través del cual los datos pueden ser creados, recuperados y eliminados. sessionStorage y localStorage utilizan un objeto de almacenamiento diferente según su origen — funcionan y son controlados por separado.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Acceder al Almacenamiento web desde IFrames de terceros está prohibido si el usuario tiene <a href="https://support.mozilla.org/en-US/kb/disable-third-party-cookies">deshabilitadas las cookies de terceros</a> (Firefox implementa este comportamiento a partir de la <a href="/en-US/docs/Mozilla/Firefox/Releases/43">versión 43</a>).</p>
-</div>
-
-<div class="note">
-<p><strong>Nota:</strong> El almacenamiento web no es lo mismo que <a href="/en-US/docs/Storage" title="Storage">mozStorage</a> (interfaces Mozilla's XPCOM para SQLite) o la <a href="/en-US/docs/Session_store_API" title="Session_store_API">Session store API</a> (una utilidad de almacenamiento <a href="/en-US/docs/XPCOM" title="XPCOM">XPCOM</a> usada por extensiones).</p>
-</div>
-
-<h2 id="Interfaces_de_almacenamiento_web">Interfaces de almacenamiento web</h2>
-
-<dl>
- <dt>{{domxref("Storage")}}</dt>
- <dd>Permite crear, recuperar y eliminar datos de un dominio y tipo de almacenamiento (sesión o local) específicos.</dd>
- <dt>{{domxref("Window")}}</dt>
- <dd>La API de almacenamiento web extiende el objeto {{domxref("Window")}} con dos nuevas propiedades — {{domxref("Window.sessionStorage")}} y {{domxref("Window.localStorage")}} — que proveen acceso a la sesión actual del dominio y a objetos {{domxref("Storage")}} locales, respectivamente. También ofrece un manejador de evento {{domxref("Window.onstorage")}} que se dispara cuando un área de la memoria cambia (por ejemplo, cuando se almacena un nuevo elemento).</dd>
- <dt>{{domxref("StorageEvent")}}</dt>
- <dd>El evento <code>storage</code> se dispara en el objeto <code>Window</code> de un documento cuando un área de la memoria cambia.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Para ilustrar algunos usos típicos del almacenamiento web, hemos creado un ejemplo simple, llamado <a href="https://github.com/mdn/web-storage-demo">Demo de almacenamiento web</a>. La <a href="http://mdn.github.io/web-storage-demo/">página de inicio</a> proporciona controles que puedes utilizar para personalizar el color, la tipografía y la imagen decorativa. Cuando seleccionas una opción diferente, la página se actualiza instantáneamente; además, tus opciones se almacenan en <code>localStorage</code>, de forma que si abandonas la página y la vuelves a cargar, tus opciones son recordadas.</p>
-
-<p>También creamos una<a href="http://mdn.github.io/web-storage-demo/event.html"> página de salida del evento</a> — si cargas esta página en otra pestaña y luego haces cambios a tus opciones en la página de inicio, verás que se muestra la información almacenada actualizada puesto que se dispara un evento {{event("StorageEvent")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Storage')}}</td>
-   <td>{{Spec2('Web Storage')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores"><strong>Compatibilidad </strong>de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>localStorage</td>
-   <td>4</td>
-   <td>3.5</td>
-   <td>8</td>
-   <td>10.50</td>
-   <td>4</td>
-  </tr>
-  <tr>
-   <td>sessionStorage</td>
-   <td>5</td>
-   <td>2</td>
-   <td>8</td>
-   <td>10.50</td>
-   <td>4</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>2.1</td>
-   <td>{{ CompatUnknown }}</td>
-   <td>8</td>
-   <td>11</td>
-   <td>iOS 3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Todos los navegadores tienen distintos niveles de capacidad tanto para localStorage como para sessionStorage. Aquí está una <a class="external external-icon" href="http://dev-test.nemikor.com/web-storage/support-test/" rel="noopener" title="http://dev-test.nemikor.com/web-storage/support-test/">análisis detallado de todas las capacidades de almacenamiento de diferentes navegadores</a>.</p>
-
-<div class="note">
-<p><strong>Nota: </strong>Desde iOS 5.1, Safari Mobile almacena los datos de localStorage en la carpeta de caché, la cual está sujeta a limpiezas ocasionales, a petición del sistema operativo, típicamente cuando el espacio es reducido.</p>
-</div>
-
-<h2 id="Navegación_privada_Modo_incógnito">Navegación privada / Modo incógnito</h2>
-
-<p>La mayoría de los navegadores de hoy en día soportan una opción de privacidad llamada  'Modo incógnito', 'Navegación privada', o algo similar, que básicamente se asegura de que la sesión de navegación no deje rastros después de que el navegador se cierra. Esto es fundamentalmente incompatible con el almacenamiento web por obvias razones. Por ello, muchos navegadores están experimentando con diferentes escenarios para lidiar con esta incompatibilidad.</p>
-
-<p>La mayoría de los navegadores han optado por una estrategia donde las API de almacenamiento siguen disponibles y aparentemente completamente funcionales, con la única gran diferencia de que todos los datos almacenados son eliminados después de cerrar el navegador. Para estos navegadores aún hay diferentes interpretaciones sobre qué debería hacerse con los datos almacenados existentes (de una sesión de navegación normal). ¿Deberían de estar disponibles para lectura cuando esté en modo privado? Entonces, hay algunos navegadores, sobre todo Safari, que han optado por una solución donde el almacenamiento está disponible, pero vacío, y tiene un cupo de 0 bytes asignado, por lo que se vuelve imposible usar esta memoria para escribir datos.</p>
-
-<p>Los desarrolladores deberían de estar conscientes de estas diferentes implementaciones y tenerlas en cuenta a la hora de desarrollar aplicaciones web que depende de la API de almacenamiento web. Para más información, échale un vistazo a<a href="https://blog.whatwg.org/tag/localstorage"> esta entrada de blog WHATWG</a> que trata específicamente con este tema.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Usando la API de almacenamiento web</a></li>
-</ul>
diff --git a/files/es/web/api/api_de_almacenamiento_web/usando_la_api_de_almacenamiento_web/index.html b/files/es/web/api/api_de_almacenamiento_web/usando_la_api_de_almacenamiento_web/index.html
deleted file mode 100644
index 086af18610..0000000000
--- a/files/es/web/api/api_de_almacenamiento_web/usando_la_api_de_almacenamiento_web/index.html
+++ /dev/null
@@ -1,272 +0,0 @@
----
-title: Usando la API de almacenamiento web
-slug: Web/API/API_de_almacenamiento_web/Usando_la_API_de_almacenamiento_web
-tags:
-  - API
-  - API de almacenamiento web
-  - Guía
-  - localStorage
-  - sessionStorage
-translation_of: Web/API/Web_Storage_API/Using_the_Web_Storage_API
----
-<div>{{DefaultAPISidebar("Web Storage API")}}</div>
-
-<div class="summary">
-<p>La API de almacenamiento web proporciona los mecanismos mediante los cuales el navegador puede almacenar información de tipo clave/valor, de una forma mucho más intuitiva que utilizando cookies.</p>
-
-<p>Este artículo proporciona una guía general de cómo usar esta tecnología.</p>
-</div>
-
-<h2 id="Conceptos_básicos">Conceptos básicos</h2>
-
-<p>Los objetos de almacenamiento son simples almacenes de clave/valor, similares a objetos, pero que permanecen intactos cuando la página se recarga. Las claves y los valores siempre son cadenas de texto (fíjate que las claves con enteros se convierten automáticamente a cadenas, tal y como lo hacen los objetos). Puedes acceder a estos valores como un objeto, o con los métodos {{domxref("Storage.getItem()")}} y {{domxref("Storage.setItem()")}}. Estas tres líneas modifican el valor de colorSetting de la misma manera:</p>
-
-<pre class="brush: js notranslate" style="white-space: pre;">localStorage.colorSetting = '#a4509b';
-localStorage['colorSetting'] = '#a4509b';
-localStorage.setItem('colorSetting', '#a4509b');</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Se recomiendo usar la API de almacenamiento web (<code>setItem</code>, <code>getItem</code>, <code>removeItem</code>, <code>key</code>, <code>length</code>) para prevenir las dificultades asociadas al uso de simples objetos como almacenes de valores llave/valor.</p>
-</div>
-
-<p>Los dos mecanismos en el almacenamiento web son los siguientes:</p>
-
-<ul>
- <li><strong><code>sessionStorage</code> </strong>mantiene un área de almacenamiento separada para cada origen que está disponible mientras dure la sesión de la página (mientras el navegador esté abierto, incluyendo recargas de página y restablecimientos).</li>
- <li><strong><code>localStorage</code> </strong>hace lo mismo, pero persiste incluso cuando el navegador se cierre y se reabra.</li>
-</ul>
-
-<p>Estos mecanismos están disponibles mediante las propiedades <a href="https://developer.mozilla.org/es/docs/Web/API/Window/sessionStorage" title="La propiedad sessionStorage permite acceder a un objeto Storage asociado a la sesión actual. La propiedad sessionStorage es similar a localStorage, la única diferencia es que la información almacenada en localStorage no posee tiempo de expiración, por el contrario la información almacenada en sessionStorage es eliminada al finalizar la sesion de la página. La sesión de la página perdura mientras el navegador se encuentra abierto, y se mantiene por sobre las recargas y reaperturas de la página. Abrir una página en una nueva pestaña o ventana iniciará una nueva sesión, lo que difiere en la forma en que trabajan las cookies de sesión."><code>Window.sessionStorage</code></a> y  <a href="https://developer.mozilla.org/es/docs/Web/API/Window/localStorage" title="La propiedad localStorage te permite acceder al objeto local Storage. localStorage es similar a sessionStorage. La única diferencia es que, mientras los datos almacenados en localStorage no tienen fecha de expiración, los datos almacenados en sessionStorage son eliminados cuando finaliza la sesion de navegación - lo cual ocurre cuando se cierra el navegador."><code>Window.localStorage</code></a> (dicho con más precisión, en navegadores con soporte, el objeto <code>Window</code> implementa los objetos  <code>WindowLocalStorage</code> y <code>WindowSessionStorage</code>, en los cuales se basan las propiedades <code>localStorage</code> y <code>sessionStorage</code>). Al invocar uno de éstos, se creará una instancia del objeto <a href="https://developer.mozilla.org/es/docs/Web/API/Storage" title="La interfaz Storage de la API de almacenamiento web provee acceso al almacenamiento de la sesión o al almacenamiento local para un dominio en particular, permitiéndote por ejemplo añadir, modificar o eliminar elementos de dato almacenados."><code>Storage</code></a>, a través del cual los datos pueden ser creados, recuperados y eliminados. sessionStorage y localStorage utilizan un objeto de almacenamiento diferente según su origen — funcionan y son controlados por separado.</p>
-
-<p>Así que, por ejemplo, si en un inicio se llama a <code>localStorage</code> en un documento, esto devolverá un objeto {{domxref("Storage")}}; llamar a <code>sessionStorage</code> en un documento devolverá un objeto {{domxref("Storage")}} diferente. Ambos objetos se pueden manipular de la misma forma, pero separados.</p>
-
-<h2 id="Detectar_la_característica_localStorage">Detectar la característica localStorage</h2>
-
-<p>Para poder usar localStorage, debemos de verificar que tiene soporte y que está disponible en la sesión del buscador actual.</p>
-
-<h3 id="Probar_la_disponibilidad">Probar la disponibilidad</h3>
-
-<div class="blockIndicator note">
-<p>Nota: esta API está disponible en las versiones actuales de todos los navegadores principales. La prueba de disponibilidad es necesaria sólo si debes soportar navegadores muy antiguos, como Internet Explorer 6 o 7, o en las circunstancias limitadas descritas más abajo.</p>
-</div>
-
-<p>Los buscadores que soportan localStorage tienen una propiedad en el objeto window que se llama localStorage. Sin embargo, por varias razones, el sólo asegurarse de que la propiedad existe puede arrojar excepciones. El que localStorage exista no es garantía suficiente de que en verdad esté disponible, puesto que varios buscadores ofrecen configuraciones que lo inhabilitan. Así que un buscador puede <em>soportar </em>localStorage, pero puede no hacerlo <em>disponible </em>para los scripts en la página. Un ejemplo de esto es Safari, que en el modo de búsqueda privada ofrece un objeto localStorage vacío con un cupo de 0, por lo que es inutilizable. Sin embargo, es posible que aún así obtengamos un QuotaExceededError legítimo, lo que significa que ya usamos todo el espacio de almacenamiento disponible, aunque el almacenamiento esté, de hecho, <em>disponible</em>. Nuestra detección de la característica debe de tomar en cuenta estos escenarios.</p>
-
-<p>Esta función detecta si localStorage tiene soporte y está disponible:</p>
-
-<pre class="brush: js notranslate">function storageAvailable(type) {
-    try {
-        var storage = window[type],
-            x = '__storage_test__';
-        storage.setItem(x, x);
-        storage.removeItem(x);
-        return true;
-    }
-    catch(e) {
-        return e instanceof DOMException &amp;&amp; (
-            // everything except Firefox
-            e.code === 22 ||
-            // Firefox
-            e.code === 1014 ||
-            // test name field too, because code might not be present
-            // everything except Firefox
-            e.name === 'QuotaExceededError' ||
-            // Firefox
-            e.name === 'NS_ERROR_DOM_QUOTA_REACHED') &amp;&amp;
-            // acknowledge QuotaExceededError only if there's something already stored
-            storage.length !== 0;
-    }
-}</pre>
-
-<p>Y aquí se muestra cómo usarla:</p>
-
-<pre class="brush: js notranslate">if (storageAvailable('localStorage')) {
-  // Yippee! We can use localStorage awesomeness
-}
-else {
-  // Too bad, no localStorage for us
-}</pre>
-
-<p>También puedes probar sessionStorage invocando <code>storageAvailable('sessionStorage')</code>.</p>
-
-<p>Aquí puedes ver una <a href="https://gist.github.com/paulirish/5558557">breve historia de la detección de la característica localStorage</a>.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Para ilustrar un uso típico de almacenamiento web, creamos un ejemplo simple que llamamos <strong>Demo de almacenamiento web</strong>. La <a href="https://mdn.github.io/dom-examples/web-storage/">página de inicio</a> proporciona unos controles que se pueden usar para personalizar el color, la tipografía y la imagen decorativa:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/9685/landing.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;">Cuando seleccionas una opción diferente, la página se actualiza instantáneamente; además, tus opciones se almacenan en <code>localStorage</code>, de forma que si abandonas la página y la vuelves a cargar, tus opciones son recordadas.</p>
-
-<p>También creamos una <a href="https://mdn.github.io/dom-examples/web-storage/event.html">página de salida del evento</a> — si cargas esta página en otra pestaña y luego haces cambios a tus opciones en la página de inicio, verás que se muestra la información almacenada actualizada puesto que se dispara un {{domxref("StorageEvent")}}.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/9687/event-output.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes ver las páginas de ejemplo usando los links de arriba y también puedes <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">ver el código fuente.</a></p>
-</div>
-
-<h3 id="Probar_si_la_memoria_tiene_valores">Probar si la memoria tiene valores</h3>
-
-<p>En el inicio de <a href="https://github.com/mdn/dom-examples/blob/master/web-storage/main.js">main.js</a>, probamos si el objeto ya tiene valores (es decir, si la página ya fue visitada):</p>
-
-<pre class="brush: js notranslate">if(!localStorage.getItem('bgcolor')) {
-  populateStorage();
-} else {
-  setStyles();
-}</pre>
-
-<p>El método {{domxref("Storage.getItem()")}} se usa para obtener un dato de la memoria; en este caso, estamos probando si el dato <code>bgcolor</code> existe; si no, corremos <code>populateStorage()</code> para añadir los valores personalizados actuales a la memoria. Si ya hay valores guardados, corremos <code>setStyles()</code> para actualizar el estilo de la página con los valores almacenados.</p>
-
-<p><strong>Nota</strong>: También puedes usar {{domxref("Storage.length")}} para probar si el objeto de almacenamiento está vació o no.</p>
-
-<h3 id="Obtener_valores_de_la_memoria">Obtener valores de la memoria</h3>
-
-<p>Como dijimos arriba, los valores se pueden recuperar de la memoria usando {{domxref("Storage.getItem()")}}. Este método usa la llave del dato como argumento y devuelve el valor. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">function setStyles() {
-  var currentColor = localStorage.getItem('bgcolor');
-  var currentFont = localStorage.getItem('font');
-  var currentImage = localStorage.getItem('image');
-
-  document.getElementById('bgcolor').value = currentColor;
-  document.getElementById('font').value = currentFont;
-  document.getElementById('image').value = currentImage;
-
-  htmlElem.style.backgroundColor = '#' + currentColor;
-  pElem.style.fontFamily = currentFont;
-  imgElem.setAttribute('src', currentImage);
-}</pre>
-
-<p>Aquí, en las primeras tres líneas tomamos los valores del almacenamiento local. Después, fijamos los valores mostrados en los elementos del formulario a esos valores, de forma que se mantengan sincronizados cuando recargues la página. Finalmente, actualizamos los estilos y la imagen decorativa en la página para que tus opciones personalizadas vuelvan a aparecer al recargar.</p>
-
-<h3 id="Guardar_valores_en_la_memoria">Guardar valores en la memoria</h3>
-
-<p>{{domxref("Storage.setItem()")}} se usa tanto para crear nuevos datos como para actualizar valores existentes (si el dato ya existía). Este método recibe dos argumentos: la llave del dato que se va a crear/modificar y el valor que se va a guardar.</p>
-
-<pre class="brush: js notranslate">function populateStorage() {
-  localStorage.setItem('bgcolor', document.getElementById('bgcolor').value);
-  localStorage.setItem('font', document.getElementById('font').value);
-  localStorage.setItem('image', document.getElementById('image').value);
-
-  setStyles();
-}</pre>
-
-<p>La función <code>populateStorage()</code> define tres elementos en el almacenamiento local — el color de fondo, la tipografía y la ruta de almacenamiento de la imagen. Luego corre la función <code>setStyles()</code> para actualizar el estilo de la página, etc.</p>
-
-<p>También incluimos un manejador <code>onchange</code> para cada elemento del formulario, de manera que los datos y los estilos son actualizados cada vez que un valor del formulario cambia:</p>
-
-<pre class="brush: js notranslate">bgcolorForm.onchange = populateStorage;
-fontForm.onchange = populateStorage;
-imageForm.onchange = populateStorage;</pre>
-
-<h3 id="Responder_a_cambios_en_la_memoria_con_el_evento_StorageEvent">Responder a cambios en la memoria con el evento StorageEvent</h3>
-
-<p>El evento {{domxref("StorageEvent")}} se dispara siempre que se hace un cambio al objeto {{domxref("Storage")}} (nota que este evento no se dispara para cambios en sessionStorage). Este evento no va a trabajar en la misma página en la que se están haciendo los cambios, sino que es una manera para que las otras páginas del dominio que usan la memoria sincronicen los cambios que se están haciendo. Las páginas en otros dominios no pueden acceder a los mismos objetos de almacenamiento.</p>
-
-<p>En la página de eventos (ver <a href="https://github.com/mdn/dom-examples/blob/master/web-storage/event.js">events.js</a>) el único JavaScript es el siguiente:</p>
-
-<pre class="brush: js notranslate">window.addEventListener('storage', function(e) {
-  document.querySelector('.my-key').textContent = e.key;
-  document.querySelector('.my-old').textContent = e.oldValue;
-  document.querySelector('.my-new').textContent = e.newValue;
-  document.querySelector('.my-url').textContent = e.url;
-  document.querySelector('.my-storage').textContent = JSON.stringify(e.storageArea);
-});</pre>
-
-<p>Aquí añadimos un detector de evento al objeto <code>window</code> que se dispara cuando el objeto {{domxref("Storage")}} asociado con el origen actual cambia. Como puedes ver arriba, el objeto asociado a este evento tiene varias propiedades que contienen información útil — la llave del dato que cambió, el valor anterior al cambio, el nuevo valor tras el cambio, la URL del documento que cambió la memoria y el objeto de almacenamiento mismo (que volvimos una cadena para que pudieras ver su contenido).</p>
-
-<h3 id="Borrar_registros">Borrar registros</h3>
-
-<p>El almacenamiento web también provee un par de métodos simples para remover datos. No los usamos en nuestro demo, pero se pueden añadir de manera muy simple a tu proyecto:</p>
-
-<ul>
- <li>{{domxref("Storage.removeItem()")}} recibe un solo argumento — la llave del dato que quieres eliminar — y lo remueve del objeto de almacenamiento de ese dominio.</li>
- <li>{{domxref("Storage.clear()")}} no recibe argumentos; vacía todo el objeto de almacenamiento de ese dominio.</li>
-</ul>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'webstorage.html#webstorage')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>localStorage</td>
-   <td>4</td>
-   <td>3.5</td>
-   <td>8</td>
-   <td>10.50</td>
-   <td>4</td>
-  </tr>
-  <tr>
-   <td>sessionStorage</td>
-   <td>5</td>
-   <td>2</td>
-   <td>8</td>
-   <td>10.50</td>
-   <td>4</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>2.1</td>
-   <td>{{ CompatUnknown }}</td>
-   <td>8</td>
-   <td>11</td>
-   <td>iOS 3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Todos los navegadores tienen distintos niveles de capacidad tanto para localStorage como para sessionStorage. Aquí está una <a class="external external-icon" href="http://dev-test.nemikor.com/web-storage/support-test/" rel="noopener" title="http://dev-test.nemikor.com/web-storage/support-test/">análisis detallado de todas las capacidades de almacenamiento de diferentes navegadores</a>.</p>
-
-<div class="note">
-<p><strong>Nota: </strong>Desde iOS 5.1, Safari Mobile almacena los datos de localStorage en la carpeta de caché, la cual está sujeta a limpiezas ocasionales, a petición del sistema operativo, típicamente cuando el espacio es reducido.</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Web_Storage_API">Página de inicio de la API de almacenamiento web</a></li>
-</ul>
diff --git a/files/es/web/api/api_del_portapapeles/index.html b/files/es/web/api/api_del_portapapeles/index.html
deleted file mode 100644
index 53e43f6bd5..0000000000
--- a/files/es/web/api/api_del_portapapeles/index.html
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: API del portapapeles
-slug: Web/API/API_del_portapapeles
-translation_of: Web/API/Clipboard_API
----
-<div>{{DefaultAPISidebar("Clipboard API")}}</div>
-
-<p>La <strong>API del portapapeles </strong>permite acceder los comandos del portapapeles (cortar, copiar y pegar), así como leer y escribir de manera asíncrona el portapapeles del sistema. Acceder al contenido del portapapeles está sujeta a la <a href="/es/docs/Web/API/Permissions_API">API de permisos</a>: El permiso <code>clipboard-write</code> es concedido automáticamente a las páginas cuando están en la pestaña activa. El permiso <code>clipboard-read</code> debe ser solicitado, lo que se puede hacer intentando leer directamente el portapapeles.</p>
-
-<p>Esta API está diseñada para reemplazar el acceso al portapapeles usando {{domxref("document.execCommand()")}}.</p>
-
-<h2 id="Accediendo_al_portapapeles">Accediendo al portapapeles</h2>
-
-<p>En vez de instanciar un objeto <code>Clipboard</code>, se puede acceder al portapapeles del sistema a través de la variable global {{domxref("Navigator.clipboard")}}:</p>
-
-<pre class="brush: js notranslate">navigator.clipboard.readText().then(
-  clipText =&gt; document.querySelector(".editor").innerText += clipText);</pre>
-
-<p>Esta pieza de código lee el texto que hay en el portapapeles y lo añade al primer elemento que tenga la clase <code>editor</code>. Desde que {{domxref("Clipboard.readText", "readText()")}} (y también {{domxref("Clipboard.read", "read()")}}, de hecho) devuelve una cadena de texto vacía si el contenido del portapapeles no es texto, este código es seguro.</p>
-
-<h2 id="Interfaces">Interfaces</h2>
-
-<dl>
- <dt>{{domxref("Clipboard")}} {{securecontext_inline}}</dt>
- <dd>Proporciona una interfaz para leer y escribir texto y datos. La especificación se refiere a esto como 'Async Clipboard API.'</dd>
- <dt>{{domxref("ClipboardEvent")}} {{securecontext_inline}}</dt>
- <dd>Representa la información del evento que se ha disparado. Los eventos que se pueden disparar son: {{domxref("Element/cut_event", "cortar")}}, {{domxref("Element/copy_event", "copiar")}}, y {{domxref("Element/paste_event", "pegar")}}. La especificación se refiere a esto como 'Clipboard Event API'.</dd>
- <dt>{{domxref("ClipboardItem")}} {{securecontext_inline}}</dt>
- <dd>Representa uno de los objetos del portapapeles, usado en la lectura y escritura de datos.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Clipboard API')}}</td>
-   <td>{{Spec2('Clipboard API')}}</td>
-   <td>Definición primitiva.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<h3 id="Clipboard">Clipboard</h3>
-
-<div>
-
-
-<p>{{Compat("api.Clipboard")}}</p>
-
-<h3 id="ClipboardEvent">ClipboardEvent</h3>
-
-<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
-
-<p>{{Compat("api.ClipboardEvent")}}</p>
-
-<h3 id="ClipboardItem">ClipboardItem</h3>
-
-
-
-<p>{{Compat("api.ClipboardItem")}}</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/API/Permissions">Permissions API</a></li>
- <li><a href="/es/docs/Web/API/Permissions_API/Using_the_Permissions_API">Using the Permissions API</a></li>
-</ul>
-</div>
diff --git a/files/es/web/api/battery_status_api/index.html b/files/es/web/api/battery_status_api/index.html
new file mode 100644
index 0000000000..2aea788656
--- /dev/null
+++ b/files/es/web/api/battery_status_api/index.html
@@ -0,0 +1,40 @@
+---
+title: API de Estado de Bateria
+slug: Web/API/Battery_Status_API
+tags:
+  - API
+  - Apps
+  - Firefox OS
+  - Mobile
+translation_of: Web/API/Battery_Status_API
+original_slug: WebAPI/Estado_de_Bateria
+---
+<p>La <strong>API de Estado de Batería</strong>, también conocida como "<strong>Battery API</strong>", provee información acerca del sistema de carga de la batería y permite notificar mediante eventos que son enviados cuando el nivel de la batería cambia. Este puede ser usado para ajustar el uso de recursos por parte de una aplicación y evitar un gasto innecesario de energía cuando la batería esta baja o para guardar cambios en un archivo antes de que la batería se agote y así prevenir perdida de información.</p>
+<p>La API de Estado de Batería se puede extender mediante {{domxref("window.navigator")}} con una propiedad {{domxref("window.navigator.battery")}} que pertenece al objeto {{domxref("BatteryManager")}} y agrega algunos nuevos eventos que usted puede recibir en el monitor de estado de la batería.</p>
+<h2 id="Ejemplo">Ejemplo</h2>
+<p>En este ejemplo, observamos los cambios en el estado de la carga (este o no conectado y cargando) y  en el nivel de la batería. Esto se hace escuchando el evento {{event("chargingchange")}} y el evento {{event("levelchange")}} respectivamente.</p>
+<pre class="brush: js">var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery;
+
+function updateBatteryStatus() {
+  console.log("Battery status: " + battery.level * 100 + " %");
+
+  if (battery.charging) {
+    console.log("Battery is charging");
+  }
+}
+
+battery.addEventListener("chargingchange", updateBatteryStatus);
+battery.addEventListener("levelchange", updateBatteryStatus);
+updateBatteryStatus();
+</pre>
+<p>Vea también: <a class="external" href="http://dev.w3.org/2009/dap/system-info/battery-status.html#introduction">El ejemplo en las especificaciones</a></p>
+<h2 id="Especificaciones">Especificaciones</h2>
+<p>{{page("/en-US/docs/Web/API/BatteryManager","Specifications")}}</p>
+<h2 id="Compatibilidad_del_Navegador">Compatibilidad del Navegador</h2>
+<p>{{page("/en-US/docs/Web/API/BatteryManager","Browser_compatibility")}}</p>
+<h2 id="Vea_también">Vea también</h2>
+<ul>
+  <li><a class="external" href="http://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/">Hacks blog post - Usando la API de Batería</a></li>
+  <li>{{domxref("BatteryManager")}}</li>
+  <li>{{domxref("window.navigator.battery","navigator.battery")}}</li>
+</ul>
diff --git a/files/es/web/api/canvas_api/a_basic_ray-caster/index.html b/files/es/web/api/canvas_api/a_basic_ray-caster/index.html
new file mode 100644
index 0000000000..d0268216eb
--- /dev/null
+++ b/files/es/web/api/canvas_api/a_basic_ray-caster/index.html
@@ -0,0 +1,60 @@
+---
+title: A basic ray-caster
+slug: Web/API/Canvas_API/A_basic_ray-caster
+tags:
+  - Avanzado
+  - Canvas
+  - Ejemplo
+  - Espanol(2)
+  - Gráficos(2)
+  - HTML
+  - Necesita traducción
+  - Web
+translation_of: Web/API/Canvas_API/A_basic_ray-caster
+original_slug: Web/HTML/Canvas/A_basic_ray-caster
+---
+<div>{{CanvasSidebar}}</div>
+
+<div class="summary">
+<p>Este artículo proporciona un interesante ejemplo de la vida real usando el elemento {{HTMLElement("canvas")}} para renderizar un sencillo entorno 3D usando una técnica de render llamada ray-casting.</p>
+</div>
+
+<p>{{EmbedGHLiveSample("canvas-raycaster/index.html", 900, 300)}}</p>
+
+<p><strong><a href="http://mdn.github.io/canvas-raycaster/">Abrir en una nueva ventana</a></strong></p>
+
+<h2 id="Why.3F" name="Why.3F">¿Por qué?</h2>
+
+<p> </p>
+
+<p>Después de darme cuenta, para mi satisfacción, de que el ingenioso elemento &lt;canvas&gt; sobre el que había estado leyendo, no sólo iba a recibir soporte por parte de Firefox, sino que <strong>ya estaba</strong> soportado por la versión actual de Safari, así que tenía que ponerme manos a la obra y hacer un pequeño experimento.</p>
+
+<p>El <a href="https://developer.mozilla.org/en-US/docs/Canvas_tutorial">tutorial</a> y el <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API">resumen</a> que encontré en la MDN son geniales, pero nadie había escrito nada (todavía) sobre animación, así que pensé que sería una buena oportunidad para portar un sencillo raycaster en el que había trabajado hacía tiempo y comprobar qué tipo de rendimiento podía esperar de un buffer de pixeles controlado por JavaScript.</p>
+
+<h2 id="How.3F" name="How.3F">¿Cómo?</h2>
+
+<p>La idea es sencilla, usar {{domxref("WindowTimers.setInterval","setInterval()")}} con un retraso arbitrario que se corresponde con la velocidad de fotogramas deseada. Por cada llamada al intervalo se ejecutará una función que volverá a pintar el elemento &lt;canvas&gt;  en el que se muestra la vista actual del usuario. Sé que podría haber empezado con un ejemplo más simple, pero creo que el <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">tutorial</a> sobre &lt;canvas&gt; vale para eso, y quería ver si podía hacer esto.</p>
+
+<p>Continuemos, por cada actualización, el raycaster comprueba si has presionado alguna tecla, si no has presionado ninguna se mantendrán los cálculos para ahorrar tiempo de ejecución. Si se ha presionado alguna tecla, el &lt;canvas&gt; es borrado, el suelo y el cielo son pintados, la posición y la orientación de la cámara son actualizados, y los rayos son lanzados. Según van intersectando los rayos con las paredes se van pintando líneas verticales de pared del color de la pared con la que han colisionado, mezcladas con una versión más oscura del color en función de la distancia a la que se encuentra la pared. La altura de la línea vertical depende directamente de la distancia a la que el rayo es interesectado, dibujándose centrada con respecto la línea del horizonte.</p>
+
+<p>El código que he terminado usando es una amalgama regurgitada del código que aparece en los capítulos sobre raycasting del libro de André LaMothe <em>Tricks of the Game Programming Gurus</em> y una <a class="external" href="http://www.shinelife.co.uk/java-maze/">versión en java de un raycaster</a> que encontré online, a su vez pasado por el filtro de mi pulsión a renombrar todo para que tenga sentido para mí y todo el chapuceo necesario para que las cosas funcionen bien.</p>
+
+<h2 id="Results" name="Results">Resultados</h2>
+
+<p>El &lt;canvas&gt; en Safari 2.0.1 rindió sorprendentemente bien. Renderizando columnas de 8 pixeles de ancho, puedo correr una ventana de 320 x 240 a 24 FPS en mi Apple Mini. Firefox 1.5 Beta 1 es incluso más rápido; puedo correr una ventana de 320 x 240 a 24 FPS con columnas de 4 píxeles de ancho. No es exactamente un nuevo miembro de la familia de ID Software, pero es bastante decente teniendo en cuenta que es un entorno completamente interpretado, y que no me he tenido que preocupar de reservar memoria, ni modos de vídeo o escribir rutinas en ensamblador. Aún así el código intenta ser lo más eficiente posible, usando tablas de acceso rápido para valores precalculados, pero no soy ningún gurú de la optimización, así que seguramente haya varias cosas que se puedan escribir más rápido.</p>
+
+<p>Además, deja bastante que desear en términos de intentar convertir esto en un motor de juego - no hay texturas en las paredes, no hay sprites, no hay puertas, ni siquiera hay teletransportadores que te permitan ir a otro nivel. Pero tengo bastante confianza en que todas esas cosas se podrían añadir con el suficiente tiempo disponible. La API de canvas soporta copiado de píxeles de imágenes, así que tener texturas parece bastante factible. Dejaré esto para otro artículo, seguramente para otra persona. =)</p>
+
+<h2 id="The_RayCaster" name="The_RayCaster">El ray-caster</h2>
+
+<p>El gente tan maravillosa que hay aquí han copiado manualmente mis archivos así vosotros podéis echarle un <a href="http://mdn.github.io/canvas-raycaster/">vistazo</a>, y para vuestro disfrute he puesto los archivos individuales como listados de código (ver abajo).</p>
+
+<p>¡Así que aquí lo tenéis, arrancad Safari 1.3+ o Firefox 1.5+ o cualquier otro navegador que soporte el elemento <code>&lt;canvas&gt;</code> y a disfrutar!<br>
+ <br>
+ <small><a href="https://github.com/mdn/canvas-raycaster/blob/master/input.js">input.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/Level.js">Level.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/Player.js">Player.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/index.html">RayCaster.html</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/RayCaster.js">RayCaster.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/trace.css">trace.css</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/trace.js">trace.js</a> </small></p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Tutorial de canvas</a></li>
+</ul>
diff --git a/files/es/web/api/canvas_api/index.html b/files/es/web/api/canvas_api/index.html
new file mode 100644
index 0000000000..811a842e7e
--- /dev/null
+++ b/files/es/web/api/canvas_api/index.html
@@ -0,0 +1,171 @@
+---
+title: API Canvas
+slug: Web/API/Canvas_API
+tags:
+  - API
+  - Canvas
+  - JavaScript
+  - Referencia
+  - introducción
+translation_of: Web/API/Canvas_API
+original_slug: Web/HTML/Canvas
+---
+<div>{{CanvasSidebar}}</div>
+
+<p class="summary">Añadido en <a href="/es/docs/HTML/HTML5">HTML5</a>, el <strong>elemento HTML {{HTMLElement("canvas")}}</strong> se puede usar para dibujar gráficos mediante scripting en <a href="/es/docs/Web/JavaScript">JavaScript</a>. Por ejemplo, se puede usar para hacer gráficas, composiciones fotográficas, crear animaciones, o incluso procesado o renderizado de vídeo en tiempo real.</p>
+
+<p>Las aplicaciones de Mozilla soportan <code>&lt;canvas&gt;</code> desde Gecko 1.8 (es decir, <a href="/es/docs/Mozilla/Firefox/Releases/1.5">Firefox 1.5</a>). El elemento fue inicialmenmte presentado por Apple para el Dashboard de OS X y Safari. Internet Explorer soporta <code>&lt;canvas&gt;</code> desde la versión 9 en adelante; para versiones anteriores de IE, se puede añadir soporte para <code>&lt;canvas&gt;</code> a una página incluyendo un script del proyecto de Google <a href="https://github.com/arv/explorercanvas">Explorer Canvas</a>. Google Chrome y Opera 9 también soportan <code>&lt;canvas&gt;</code>.</p>
+
+<p>El elemento <code>&lt;canvas&gt;</code> también se usa en <a href="/es/docs/Web/WebGL">WebGL</a> para dibujar gráficos 3D con aceleración por hardware en páginas web.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Esto es un trozo de código que usa el método {{domxref("CanvasRenderingContext2D.fillRect()")}}.</p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
+</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'green';
+ctx.fillRect(10, 10, 100, 100);
+</pre>
+
+<p>Edita este código para ver tus cambios en tiempo real en este canvas:</p>
+
+<div class="hidden">
+<h6 id="Código_editable">Código editable</h6>
+
+<pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
+&lt;div class="playable-buttons"&gt;
+  &lt;input id="edit" type="button" value="Edit" /&gt;
+  &lt;input id="reset" type="button" value="Reset" /&gt;
+&lt;/div&gt;
+&lt;textarea id="code" class="playable-code"&gt;
+ctx.fillStyle = 'green';
+ctx.fillRect(10, 10, 100, 100);&lt;/textarea&gt;
+</pre>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext("2d");
+var textarea = document.getElementById('code');
+var reset = document.getElementById('reset');
+var edit = document.getElementById('edit');
+var code = textarea.value;
+
+function drawCanvas() {
+  ctx.clearRect(0, 0, canvas.width, canvas.height);
+  eval(textarea.value);
+}
+
+reset.addEventListener('click', function() {
+  textarea.value = code;
+  drawCanvas();
+});
+
+edit.addEventListener('click', function() {
+  textarea.focus();
+})
+
+textarea.addEventListener('input', drawCanvas);
+window.addEventListener('load', drawCanvas);
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Código_editable', 700, 360) }}</p>
+
+<h2 id="Referencia">Referencia</h2>
+
+<div class="index">
+<ul>
+ <li>{{domxref("HTMLCanvasElement")}}</li>
+ <li>{{domxref("CanvasRenderingContext2D")}}</li>
+ <li>{{domxref("CanvasGradient")}}</li>
+ <li>{{domxref("CanvasImageSource")}}</li>
+ <li>{{domxref("CanvasPattern")}}</li>
+ <li>{{domxref("ImageBitmap")}}</li>
+ <li>{{domxref("ImageData")}}</li>
+ <li>{{domxref("RenderingContext")}}</li>
+ <li>{{domxref("TextMetrics")}}</li>
+ <li>{{domxref("OffscreenCanvas")}}{{experimental_inline}}</li>
+ <li>{{domxref("Path2D")}} {{experimental_inline}}{{domxref("ImageBitmapRenderingContext")}}{{experimental_inline}}</li>
+</ul>
+</div>
+
+<p>Las interfaces relacionadas con <code>WebGLRenderingContext</code> están en <a href="/es/docs/Web/WebGL" title="/en-US/docs/Web/WebGL">WebGL</a>.</p>
+
+<p>{{domxref("CanvasCaptureMediaStream")}} está relacionado..</p>
+
+<h2 id="Guías_y_tutoriales">Guías y tutoriales</h2>
+
+<dl>
+ <dt><a href="/es/docs/Web/API/Canvas_API/Tutorial">Tutorial Canvas</a></dt>
+ <dd>Tutorial exhaustivo que cubre tanto el uso básico de <code>&lt;canvas&gt;</code> como sus características avanzadas.</dd>
+ <dt><a href="/es/Add-ons/Code_snippets/Canvas">Fragmentos de código: Canvas</a></dt>
+ <dd>Algunos fragmentos de código orientados al desarrollador de extensiones usando <code>&lt;canvas&gt;</code>.</dd>
+ <dt><a href="/es/docs/Web/API/Canvas_API/A_basic_ray-caster">Demo: Un laberinto básico</a></dt>
+ <dd>Una demo de una animación de laberinto usando canvas.</dd>
+ <dt><a href="/es/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas">Dibujar objetos DOM en un canvas</a></dt>
+ <dd>Cómo dibujar contenido DOM, como elementos HTML, en un canvas.</dd>
+ <dt><a href="/es/docs/Web/API/Canvas_API/Manipulating_video_using_canvas">Manipulación de vídeo usando canvas</a></dt>
+ <dd>Combinando {{HTMLElement("video")}} y {{HTMLElement("canvas")}} para manipular datos de vídeo en tiempo real.</dd>
+</dl>
+
+<h2 id="Recursos">Recursos</h2>
+
+<h3 id="Genéricos">Genéricos</h3>
+
+<ul>
+ <li><a href="http://joshondesign.com/p/books/canvasdeepdive/title.html">Profundizando en HTML5 Canvas</a></li>
+ <li><a href="http://bucephalus.org/text/CanvasHandbook/CanvasHandbook.html">Manual de Canvas</a></li>
+</ul>
+
+<h3 id="Librerías">Librerías</h3>
+
+<ul>
+ <li><a href="http://fabricjs.com">Fabric.js</a> es una librería open-source para canvas con capacidad de parsear SVG.</li>
+ <li><a href="https://github.com/ericdrowell/KineticJS">Kinetic.js</a> es una librería open-source de canvas enfocada en la interactividad para aplicaciones móviles y de escritorio.</li>
+ <li><a href="http://paperjs.org/">Paper.js</a> es un framework para gráficos vectoriales open source que funciona sobre Canvas HTML5.</li>
+ <li><a href="http://origamijs.com/docs/">Origami.js</a> es una librería ligera open-source para canvas.</li>
+ <li><a href="http://libcanvas.github.com/">libCanvas</a> es un framework ligero y potente para canvas.</li>
+ <li><a href="http://processingjs.org">Processing.js</a> es un port de PVL (Processing visualization language).</li>
+ <li><a href="https://playcanvas.com/">PlayCanvas</a> es un motor open source de juegos.</li>
+ <li><a href="http://www.pixijs.com/">Pixi.js</a> es un motor open source de juegos.</li>
+ <li><a href="http://www.liquidx.net/plotkit/">PlotKit</a> es una librería para hacer gráficas.</li>
+ <li><a class="link-https" href="https://github.com/jeremyckahn/rekapi">Rekapi</a> es una API para animación por frames para Canvas.</li>
+ <li><a href="http://senchalabs.github.com/philogl/">PhiloGL</a> es un framework WebGL para visualización de datos, programación creativa y desarrollo de juegos.</li>
+ <li><a href="http://thejit.org/">JavaScript InfoVis Toolkit</a> crea visualizaciones de datos 2D interactivas para Web.</li>
+ <li><a href="http://www.createjs.com/easeljs">EaselJS</a> es una librería open source/libre que facilita el uso de canvas para arte y juegos</li>
+ <li><a href="http://scrawl.rikweb.org.uk/">Scrawl-canvas</a> es otra librería open-source javascript para crear y manipular elementos canvas en 2D</li>
+ <li><a href="https://www.patrick-wied.at/static/heatmapjs/">heatmap.js</a> es una librería open-source para crear mapas (heatmaps)</li>
+</ul>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'scripting.html#the-canvas-element', '&lt;canvas&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/WebGL">WebGL</a></li>
+</ul>
diff --git a/files/es/web/api/canvas_api/manipulating_video_using_canvas/index.html b/files/es/web/api/canvas_api/manipulating_video_using_canvas/index.html
new file mode 100644
index 0000000000..26afd8c837
--- /dev/null
+++ b/files/es/web/api/canvas_api/manipulating_video_using_canvas/index.html
@@ -0,0 +1,127 @@
+---
+title: Manipular video por medio de canvas
+slug: Web/API/Canvas_API/Manipulating_video_using_canvas
+tags:
+  - Canvas
+  - Firefox 3.5
+  - Video
+  - para_revisar
+translation_of: Web/API/Canvas_API/Manipulating_video_using_canvas
+original_slug: Web/HTML/anipular_video_por_medio_de_canvas
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">{{ fx_minversion_header (3.5) }}</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al combinar las capacidades del elemento </span></span><a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""> introducido en Firefox 3.5 con un elemento </span></span><a class="internal" href="/en/HTML/Canvas" title="En/Canvas"><code>canvas</code></a><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""> , puedes manipular los datos de video en tiempo real para incorporar una variedad de efectos visuales que se mostrarán en el video.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este artículo, adaptado de <a class="external" href="http://blog.mozbox.org/post/2009/02/25/video-canvas%3A-special-effects" title="http://blog.mozbox.org/post/2009/02/25/video-canvas:-special-effects">esta entrada del blog</a> de Paul Rouget, muestra cómo realizar una inserción croma (también conocida como el "efecto pantalla verde") utilizando el código JavaScript.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style=""><a href="/samples/video/chroma-key/index.xhtml" title="samples/video/chroma-key/index.xhtml">Ver este ejemplo en vivo</a> .</span></span></p>
+<h2 id="El_contenido_del_documento"><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El contenido del documento</span></span></h2>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El documento XHTML que se utiliza para representar este contenido se muestra a continuación.</span></span></p>
+<pre class="brush: html">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
+&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
+  &lt;head&gt;
+    &lt;style&gt;
+      body {
+        background: black;
+        color:#CCCCCC;
+      }
+      #c2 {
+        background-image: url(foo.png);
+        background-repeat: no-repeat;
+      }
+      div {
+        float: left;
+        border :1px solid #444444;
+        padding:10px;
+        margin: 10px;
+        background:#3B3B3B;
+      }
+    &lt;/style&gt;
+    &lt;script type="text/javascript;version=1.8" src="main.js"&gt;&lt;/script&gt;
+  &lt;/head&gt;
+
+  &lt;body onload="processor.doLoad()"&gt;
+    &lt;div&gt;
+      &lt;video id="video" src="video.ogv" controls="true"/&gt;
+    &lt;/div&gt;
+    &lt;div&gt;
+      &lt;canvas id="c1" width="160" height="96"/&gt;
+      &lt;canvas id="c2" width="160" height="96"/&gt;
+    &lt;/div&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los puntos clave a tener en cuenta son:</span></span></p>
+<ol>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este documento establece dos elemento <a class="internal"><code>canvas</code></a> , con los identificadores de <code>c1</code> y <code>c2</code> .</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Canvas <code>c1</code> se utiliza para mostrar la imagen actual del video original, mientras que <code>c2</code> se utiliza para mostrar el video después de realizar la manipulación con el efecto croma; <code>c2</code> se carga previamente con la imagen fija que se utilizará para sustituir el fondo verde en el video.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El código JavaScript es importado de un script llamado <code>main.js</code> ; este script utiliza JavaScript 1.8 características, de modo que la versión se especifica en la línea 22 al importar la secuencia de comandos.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cuando se carga el documento, se ejecuta el método <code>processor.doLoad()</code> de <code>main.js</code>.</span></span></li>
+</ol>
+<h2 id="El_código_JavaScript"><span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El código JavaScript</span></span></h2>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El código JavaScript en <code>main.js</code> consta de tres métodos.</span></span></p>
+<h3 id="Inicializar_el_reproductor_de_croma"><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Inicializar el reproductor de croma</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El método <code>doLoad()</code> se llama cuando el documento XHTML se carga inicialmente.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La función de este método es preparar las variables necesarias para el código de procesamiento del croma y la creación de un detector de eventos para que podamos detectar cuándo inicia el usuario la reproducción del video.</span></span></p>
+<pre class="brush: js">  doLoad: function() {
+    this.video = document.getElementById("video");
+    this.c1 = document.getElementById("c1");
+    this.ctx1 = this.c1.getContext("2d");
+    this.c2 = document.getElementById("c2");
+    this.ctx2 = this.c2.getContext("2d");
+    let self = this;
+    this.video.addEventListener("play", function() {
+        self.width = self.video.videoWidth / 2;
+        self.height = self.video.videoHeight / 2;
+        self.timerCallback();
+      }, false);
+  },
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este código obtiene referencias a los elementos del documento XHTML que son de particular interés, a saber, el elemento <code>video</code> y los dos elementos <code>canvas</code>.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">También recupera las referencias a los contextos gráficos para cada uno de los dos elementos canvas.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Estos serán utilizados cuando estamos haciendo de verdad el efecto croma.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Luego <code>addEventListener()</code> es llamado para empezar a ver el elemento <code>video</code> de forma que podamos obtener una notificación cuando el usuario presione el botón de reproducción en el video.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En respuesta al usuario que inicia la reproducción, el código obtiene la anchura y la altura de video, reduciendo a la mitad cada uno (vamos a reducir a la mitad el tamaño del video, cuando llevamos a cabo la manipulación efecto croma). A continuación, llama al método <code>timerCallback()</code> para iniciar el visionado del video y la computación del efecto visual.</span></span></p>
+<h3 id="La_devolución_de_llamada_del_temporizador"><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">La devolución de llamada del temporizador</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La devolución de llamada del temporizador se llama inicialmente cuando el video comienza a reproducirse (cuando tiene lugar el evento "reproducir"), a continuación, toma la responsabilidad por la que se establece a sí mismo para ser llamado periódicamente, a fin de poner en marcha el efecto croma para cada imagen.</span></span></p>
+<pre class="brush: js">  timerCallback: function() {
+    if (this.video.paused || this.video.ended) {
+      return;
+    }
+    this.computeFrame();
+    let self = this;
+    setTimeout(function () {
+        self.timerCallback();
+      }, 0);
+  },
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-82"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo primero que la devolución de llamada hace es comprobar si el video se está aún reproduciendo, y si no lo está, la devolución de llamada regresa inmediatamente sin hacer nada.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-83"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">A continuación, llama al método <code>computeFrame()</code>, que lleva a cabo la manipulación del efecto croma en la imagen de video actual.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-84"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo último que la devolución de llamada hace es llamar a <code>setTimeout()</code> para programarse para ser llamado lo más pronto posible.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-85"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el mundo real, es probable que programes esto en función de la velocidad de fotogramas del video.</span></span></p>
+<h3 id="Manipulación_de_los_datos_de_la_imagen_del_video"><span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Manipulación de los datos de la imagen del video</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-87"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El método <code>computeFrame()</code>, que se muestra a continuación, se encarga de ir a buscar realmente un fotograma de datos y realizar el efecto croma.</span></span></p>
+<pre class="brush: js">  computeFrame: function() {
+    this.ctx1.drawImage(this.video, 0, 0, this.width, this.height);
+    let frame = this.ctx1.getImageData(0, 0, this.width, this.height);
+    let l = frame.data.length / 4;
+
+    for (let i = 0; i &lt; l; i++) {
+      let r = frame.data[i * 4 + 0];
+      let g = frame.data[i * 4 + 1];
+      let b = frame.data[i * 4 + 2];
+      if (g &gt; 100 &amp;&amp; r &gt; 100 &amp;&amp; b &lt; 43)
+        frame.data[i * 4 + 3] = 0;
+    }
+    this.ctx2.putImageData(frame, 0, 0);
+    return;
+  }
+</pre>
+<p>Cuando esta rutina es llamada, el elemento video muestra el fotograma de datos de video más reciente, que tiene este aspecto:</p>
+<p><img alt="video.png" class="internal default" src="/@api/deki/files/3282/=video.png" style="width: 320px; height: 192px;"></p>
+<p>En la línea 2, ese fotograma de video se copia al contexto gráfico <code>ctx1</code> del primer lienzo, especificando como alto y ancho los valores que previamente guardamos para dibujar el fotograma a mitad de tamaño.  <span class="goog-gtc-unit" id="goog-gtc-unit-104"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Ten en cuenta que puedes pasar simplemente el elemento de video al método <code>drawImage()</code> del contexto para dibujar el fotograma de video actual en dicho contexto.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-105"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El resultado es:</span></span></p>
+<p><img alt="sourcectx.png" class="internal default" src="/@api/deki/files/3284/=sourcectx.png" style="width: 160px; height: 96px;"></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-106"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Línea 3 obtiene una copia de los datos gráficos del actual fotograma de video llamando al método <code>getImageData()</code> en el primer contexto.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-107"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto proporciona los datos de imagen en píxeles de 32 bits sin procesar que podemos después manipular.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-108"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Línea 4 calcula el número de píxeles de la imagen al dividir entre cuatro el tamaño total de los datos de la imagen del fotograma.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-109"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El bucle <code>for</code> que comienza en la línea 6 explora a través de los píxeles del fotograma, extrayendo los valores rojo, verde y azul para cada píxel, y compara los valores frente a números predeterminados que se utilizan para detectar la pantalla verde que se reemplazará por la imagen de fondo fija importada de <code>foo.png</code> .</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-110"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cada píxel de datos de imagen del fotograma que se encuentra que está dentro de los parámetros que se consideran parte de la pantalla verde tiene su valor alfa reemplazado por un cero, lo que indica que el píxel es totalmente transparente.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-111"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Como resultado, la imagen final tiene toda el área de pantalla verde 100% transparente, de modo que cuando se dibuja en el contexto de destino en la línea 13, el resultado es una superposición sobre el fondo estático.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-112"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">La imagen resultante tiene este aspecto:</span></span></p>
+<p><img alt="output.png" class="internal default" src="/@api/deki/files/3283/=output.png" style="width: 161px; height: 96px;"></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-113"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto se hace en varias ocasiones mientras el video se reproduce, de manera que fotograma tras fotograma se procesa y se muestra con el efecto de croma.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-114"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style=""><a href="/samples/video/chroma-key/index.xhtml" title="samples/video/chroma-key/index.xhtml">Ver este ejemplo en vivo</a> .</span></span></p>
+<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-115"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Consulta también</span></span></h2>
+<ul>
+ <li><a class="internal" href="/es/Usando_audio_y_video_en_Firefox" title="es/Usando audio y video en Firefox"><span class="goog-gtc-unit" id="goog-gtc-unit-116"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Usar audio y video en Firefox</span></span></a></li>
+</ul>
+<p>{{ languages ( { "en": "En/Manipulating_video_using_canvas" } ) }}</p>
diff --git a/files/es/web/api/canvas_api/tutorial/advanced_animations/index.html b/files/es/web/api/canvas_api/tutorial/advanced_animations/index.html
new file mode 100644
index 0000000000..8d1800d423
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/advanced_animations/index.html
@@ -0,0 +1,381 @@
+---
+title: Advanced animations
+slug: Web/API/Canvas_API/Tutorial/Advanced_animations
+tags:
+  - Canvas
+  - Tutoria
+  - graficos
+translation_of: Web/API/Canvas_API/Tutorial/Advanced_animations
+original_slug: Web/Guide/HTML/Canvas_tutorial/Advanced_animations
+---
+<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Basic_animations", "Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas")}}</div>
+
+<div class="summary">
+<p>En el último capítulo hicimos unas <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">animaciones básicas</a> y nos familiarizamos con varias maneras de mover cosas. En esta parte examinaremos la moción misma y agregaremos la física para hacer nuestras animaciones más avanzadas.</p>
+</div>
+
+<h2 id="Dibujar_una_bola">Dibujar una bola</h2>
+
+<p>Vamos a usar una bola para nuestro estudio de la animación, entonces primero dibujamos la bola dentro del canvas. El siguente código lo configurará.</p>
+
+<pre class="brush: html">&lt;canvas id="canvas" width="600" height="300"&gt;&lt;/canvas&gt;
+</pre>
+
+<p>Como siempre, necesitamos un entorno para dibujar. Para dibujar la bola, creamos un contenido <code>ball</code> lo cual contiene propiedades y un método <code>draw()</code>.</p>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+
+var ball = {
+  x: 100,
+  y: 100,
+  radius: 25,
+  color: 'blue',
+  draw: function() {
+    ctx.beginPath();
+    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
+    ctx.closePath();
+    ctx.fillStyle = this.color;
+    ctx.fill();
+  }
+};
+
+ball.draw();</pre>
+
+<p>Nada especial aquí; la bola es en realidad un circulo sencillo y se dibuja con el método {{domxref("CanvasRenderingContext2D.arc()", "arc()")}}.</p>
+
+<h2 id="Agregar_velocidad">Agregar velocidad</h2>
+
+<p>Ya que tenemos una bola, estamos listos agregar una animación básica así como aprendimos en el <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">último capítulo</a> de esta tutoría. De nuevo, {{domxref("window.requestAnimationFrame()")}} nos ayuda controlar la animación. La bola empieza moverse por agregar un vector de velocidad a la posición. Para cada fotograma, también {{domxref("CanvasRenderingContext2D.clearRect", "clear", "", 1)}} el canvas para quitar los circulos viejos de los fotogramas anteriores.</p>
+
+<pre class="brush: js; highlight:[8,9,24,25]">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+var raf;
+
+var ball = {
+  x: 100,
+  y: 100,
+  vx: 5,
+  vy: 2,
+  radius: 25,
+  color: 'blue',
+  draw: function() {
+    ctx.beginPath();
+    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
+    ctx.closePath();
+    ctx.fillStyle = this.color;
+    ctx.fill();
+  }
+};
+
+function draw() {
+  ctx.clearRect(0,0, canvas.width, canvas.height);
+  ball.draw();
+  ball.x += ball.vx;
+  ball.y += ball.vy;
+  raf = window.requestAnimationFrame(draw);
+}
+
+canvas.addEventListener('mouseover', function(e) {
+  raf = window.requestAnimationFrame(draw);
+});
+
+canvas.addEventListener('mouseout', function(e) {
+  window.cancelAnimationFrame(raf);
+});
+
+ball.draw();
+</pre>
+
+<h2 id="Límites">Límites</h2>
+
+<p>Si no probamos los límites, de repente nuestra bola se agota el canvas. Necesitamos verificar si las posiciones <code>x</code> e <code>y</code> están fuera de las dimensiones del canvas y invertir la direción de los vectores de velocidad. Para hacer eso, agregamos los siguentes pasos al método <code>draw</code>:</p>
+
+<pre class="brush: js">if (ball.y + ball.vy &gt; canvas.height || ball.y + ball.vy &lt; 0) {
+  ball.vy = -ball.vy;
+}
+if (ball.x + ball.vx &gt; canvas.width || ball.x + ball.vx &lt; 0) {
+  ball.vx = -ball.vx;
+}</pre>
+
+<h3 id="Primera_demo">Primera demo</h3>
+
+<p>Veamos como se ve en acción hasta este punto. Dirige el ratón dentro del canvas para empezar la animación.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+var raf;
+
+var ball = {
+  x: 100,
+  y: 100,
+  vx: 5,
+  vy: 2,
+  radius: 25,
+  color: 'blue',
+  draw: function() {
+    ctx.beginPath();
+    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
+    ctx.closePath();
+    ctx.fillStyle = this.color;
+    ctx.fill();
+  }
+};
+
+function draw() {
+  ctx.clearRect(0,0, canvas.width, canvas.height);
+  ball.draw();
+  ball.x += ball.vx;
+  ball.y += ball.vy;
+
+  if (ball.y + ball.vy &gt; canvas.height ||
+      ball.y + ball.vy &lt; 0) {
+    ball.vy = -ball.vy;
+  }
+  if (ball.x + ball.vx &gt; canvas.width ||
+      ball.x + ball.vx &lt; 0) {
+    ball.vx = -ball.vx;
+  }
+
+  raf = window.requestAnimationFrame(draw);
+}
+
+canvas.addEventListener('mouseover', function(e) {
+  raf = window.requestAnimationFrame(draw);
+});
+
+canvas.addEventListener('mouseout', function(e) {
+  window.cancelAnimationFrame(raf);
+});
+
+ball.draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("First_demo", "610", "310")}}</p>
+
+<h2 id="Aceleración">Aceleración</h2>
+
+<p>Para convertir la moción en más auténtica, puedes jugar con la velocidad, así por ejemplo:</p>
+
+<pre class="brush: js">ball.vy *= .99;
+ball.vy += .25;</pre>
+
+<p>Esto reduce el vector vertical de velocidad para cada fotograma para que la bola termina rebotando en el suelo.</p>
+
+<div class="hidden">
+<h6 id="Second_demo">Second demo</h6>
+
+<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+var raf;
+
+var ball = {
+  x: 100,
+  y: 100,
+  vx: 5,
+  vy: 2,
+  radius: 25,
+  color: 'blue',
+  draw: function() {
+    ctx.beginPath();
+    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
+    ctx.closePath();
+    ctx.fillStyle = this.color;
+    ctx.fill();
+  }
+};
+
+function draw() {
+  ctx.clearRect(0,0, canvas.width, canvas.height);
+  ball.draw();
+  ball.x += ball.vx;
+  ball.y += ball.vy;
+  ball.vy *= .99;
+  ball.vy += .25;
+
+  if (ball.y + ball.vy &gt; canvas.height ||
+      ball.y + ball.vy &lt; 0) {
+    ball.vy = -ball.vy;
+  }
+  if (ball.x + ball.vx &gt; canvas.width ||
+      ball.x + ball.vx &lt; 0) {
+    ball.vx = -ball.vx;
+  }
+
+  raf = window.requestAnimationFrame(draw);
+}
+
+canvas.addEventListener('mouseover', function(e) {
+  raf = window.requestAnimationFrame(draw);
+});
+
+canvas.addEventListener('mouseout', function(e) {
+  window.cancelAnimationFrame(raf);
+});
+
+ball.draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("Second_demo", "610", "310")}}</p>
+
+<h2 id="Efecto_de_rezagar">Efecto de rezagar</h2>
+
+<p>Hasta este punto hemos limpiado los fotogramas anteriores con el método {{domxref("CanvasRenderingContext2D.clearRect", "clearRect")}}. Si reemplazas este método con un semi-transparente {{domxref("CanvasRenderingContext2D.fillRect", "fillRect")}}, puedes facilmente crear un efecto de rezagar.</p>
+
+<pre class="brush: js">ctx.fillStyle = 'rgba(255, 255, 255, 0.3)';
+ctx.fillRect(0, 0, canvas.width, canvas.height);</pre>
+
+<div class="hidden">
+<h6 id="Third_demo">Third demo</h6>
+
+<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+var raf;
+
+var ball = {
+  x: 100,
+  y: 100,
+  vx: 5,
+  vy: 2,
+  radius: 25,
+  color: 'blue',
+  draw: function() {
+    ctx.beginPath();
+    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
+    ctx.closePath();
+    ctx.fillStyle = this.color;
+    ctx.fill();
+  }
+};
+
+function draw() {
+  ctx.fillStyle = 'rgba(255, 255, 255, 0.3)';
+  ctx.fillRect(0, 0, canvas.width, canvas.height);
+  ball.draw();
+  ball.x += ball.vx;
+  ball.y += ball.vy;
+  ball.vy *= .99;
+  ball.vy += .25;
+
+  if (ball.y + ball.vy &gt; canvas.height ||
+      ball.y + ball.vy &lt; 0) {
+    ball.vy = -ball.vy;
+  }
+  if (ball.x + ball.vx &gt; canvas.width ||
+      ball.x + ball.vx &lt; 0) {
+    ball.vx = -ball.vx;
+  }
+
+  raf = window.requestAnimationFrame(draw);
+}
+
+canvas.addEventListener('mouseover', function(e) {
+  raf = window.requestAnimationFrame(draw);
+});
+
+canvas.addEventListener('mouseout', function(e) {
+  window.cancelAnimationFrame(raf);
+});
+
+ball.draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("Third_demo", "610", "310")}}</p>
+
+<h2 id="Agregar_control_de_ratón">Agregar control de ratón</h2>
+
+<p>Para controlar la bola, podemos hacerla seguir nuestro ratón usando el evento <code><a href="/en-US/docs/Web/Reference/Events/mousemove">mousemove</a></code>, por ejemplo. El evento <code><a href="/en-US/docs/Web/Events/click">click</a></code> solta la bola y la deja rebotar de nuevo.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
+</div>
+
+<pre class="brush: js">var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+var raf;
+var running = false;
+
+var ball = {
+  x: 100,
+  y: 100,
+  vx: 5,
+  vy: 1,
+  radius: 25,
+  color: 'blue',
+  draw: function() {
+    ctx.beginPath();
+    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
+    ctx.closePath();
+    ctx.fillStyle = this.color;
+    ctx.fill();
+  }
+};
+
+function clear() {
+  ctx.fillStyle = 'rgba(255, 255, 255, 0.3)';
+  ctx.fillRect(0,0,canvas.width,canvas.height);
+}
+
+function draw() {
+  clear();
+  ball.draw();
+  ball.x += ball.vx;
+  ball.y += ball.vy;
+
+  if (ball.y + ball.vy &gt; canvas.height || ball.y + ball.vy &lt; 0) {
+    ball.vy = -ball.vy;
+  }
+  if (ball.x + ball.vx &gt; canvas.width || ball.x + ball.vx &lt; 0) {
+    ball.vx = -ball.vx;
+  }
+
+  raf = window.requestAnimationFrame(draw);
+}
+
+canvas.addEventListener('mousemove', function(e) {
+  if (!running) {
+    clear();
+    ball.x = e.clientX;
+    ball.y = e.clientY;
+    ball.draw();
+  }
+});
+
+canvas.addEventListener('click', function(e) {
+  if (!running) {
+    raf = window.requestAnimationFrame(draw);
+    running = true;
+  }
+});
+
+canvas.addEventListener('mouseout', function(e) {
+  window.cancelAnimationFrame(raf);
+  running = false;
+});
+
+ball.draw();
+</pre>
+
+<p>Mueve la bola usando el ratón y suéltala haciendo click.</p>
+
+<p>{{EmbedLiveSample("Adding_mouse_control", "610", "310")}}</p>
+
+<h2 id="Breakout">Breakout</h2>
+
+<p>Este capítulo corto sólo explica algunas técnicas para crear animaciones más avanzadas. ¡Hay muchos más!  ¿Qué tal agregar una raqueta, algunos ladrillos, y convertir esta demo en un partido <a href="http://en.wikipedia.org/wiki/Breakout_%28video_game%29">Breakout</a>? Visita nuestra área de <a href="/en-US/docs/Games">Game development</a> para mayor información.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{domxref("window.requestAnimationFrame()")}}</li>
+ <li><a href="/en-US/docs/Games/Techniques/Efficient_animation_for_web_games">Efficient animation for web games</a></li>
+</ul>
+
+<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Basic_animations", "Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas")}}</p>
diff --git a/files/es/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html b/files/es/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html
new file mode 100644
index 0000000000..089f74510c
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/applying_styles_and_colors/index.html
@@ -0,0 +1,727 @@
+---
+title: Applying styles and colors
+slug: Web/API/Canvas_API/Tutorial/Applying_styles_and_colors
+translation_of: Web/API/Canvas_API/Tutorial/Applying_styles_and_colors
+original_slug: Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors
+---
+<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Drawing_shapes", "Web/API/Canvas_API/Tutorial/Drawing_text")}}</div>
+
+<div class="summary">
+<p>En el capítulo acerca de dibujar formas, usamos unicamente los estilos de linea y de relleno por defecto. Aqui exploraremos las opciones del canvas que tenemos a nuestra disposición para hacer los dibujos un tanto más atractivos. Aprenderas como agregar diferentes colores, estilos de linea, gradiantes, patrones y sombras a tus dibujos.</p>
+</div>
+
+<h2 id="Colors" name="Colors">Colors</h2>
+
+<p>Hasta ahrora nosotros solo me hemos visto metodos en el contexto de dibujo. Si quisieramos aplicar colores a las formas, hay dos importantes propiedades que podemos usar: <code>fillStyle</code> y <code>strokeStyle</code>.</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.fillStyle", "fillStyle = color")}}</dt>
+ <dd>Configura el estilo cuando se rellenan las formas.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.strokeStyle", "strokeStyle = color")}}</dt>
+ <dd>Configura el estilo al contorno perimetral de las formas.</dd>
+</dl>
+
+<p><code>color</code> es una cadena que representa  un CSS {{cssxref("&lt;color&gt;")}}, un objeto gradiante, o un objeto patron. Miraremos en objetos de gradientes y patrones mas tarde. Por defecto, el color del trazo y del relleno son configurados en negro (valor de color CSS <code>#000000</code>).</p>
+
+<div class="note">
+<p><strong>Nota: </strong> Cuando configuras la propiedad  <code>strokeStyle</code> y/o <code>fillStyle</code>, el nuevo valor llega a ser el vador por defecto para los dibujos posteriores. Para cada forma que tu quieras en un color difrente, necesitaras reasignar las propiedades anteriores.</p>
+</div>
+
+<p>Las cadenas validas que tu pueden entrar deberian, segun la especificación, ser valores de  {{cssxref("&lt;color&gt;")}} CSS. En el siguiente ejemplo, describimos en mismo color.</p>
+
+<pre class="brush: js">// these all set the fillStyle to 'orange'
+
+ctx.fillStyle = 'orange';
+ctx.fillStyle = '#FFA500';
+ctx.fillStyle = 'rgb(255, 165, 0)';
+ctx.fillStyle = 'rgba(255, 165, 0, 1)';
+</pre>
+
+<h3 id="A_fillStyle_example" name="A_fillStyle_example">A <code>fillStyle</code> example</h3>
+
+<p>En este ejemplo, usamos dos bucles for para dibujar una cuadrícula de rectangulos, cada uno de diferente color. La imagen resultante deberia ser similar a la de la screenhot. No hay nada demasiado espectacular en el proceso. Usamos dos variables i y j para generar un unico color RGB para cada celda cuadrada, modificando las componentes rojo y verde. El canal azul tiene un valor fijo. Modificando los canales, puedes generar todo tipo de paletas. Incrementando los paos, puedes lograr algo similar que se parezca a las paletas de colores que Photoshop usa.</p>
+
+<pre class="brush: js;highlight[5,6]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+  for (var i = 0; i &lt; 6; i++) {
+    for (var j = 0; j &lt; 6; j++) {
+      ctx.fillStyle = 'rgb(' + Math.floor(255 - 42.5 * i) + ', ' +
+                       Math.floor(255 - 42.5 * j) + ', 0)';
+      ctx.fillRect(j * 25, i * 25, 25, 25);
+    }
+  }
+}</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>The result looks like this:</p>
+
+<p>{{EmbedLiveSample("A_fillStyle_example", 160, 160, "https://mdn.mozillademos.org/files/5417/Canvas_fillstyle.png")}}</p>
+
+<h3 id="A_strokeStyle_example" name="A_strokeStyle_example">A <code>strokeStyle</code> example</h3>
+
+<p>Este ejemplo es similar al de arriba, pero usa la propiedad  <code>strokeStyle</code> para cambiar el color del contorno de las formas. Usamos el método  <code>arc()</code> para dibujar circulos en lugar de celdas cuadradas.</p>
+
+<pre class="brush: js;highlight[5,6]">  function draw() {
+    var ctx = document.getElementById('canvas').getContext('2d');
+    for (var i = 0; i &lt; 6; i++) {
+      for (var j = 0; j &lt; 6; j++) {
+        ctx.strokeStyle = 'rgb(0, ' + Math.floor(255 - 42.5 * i) + ', ' +
+                         Math.floor(255 - 42.5 * j) + ')';
+        ctx.beginPath();
+        ctx.arc(12.5 + j * 25, 12.5 + i * 25, 10, 0, Math.PI * 2, true);
+        ctx.stroke();
+      }
+    }
+  }
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>The result looks like this:</p>
+
+<p>{{EmbedLiveSample("A_strokeStyle_example", "180", "180", "https://mdn.mozillademos.org/files/253/Canvas_strokestyle.png")}}</p>
+
+<h2 id="Transparency" name="Transparency">Transparency</h2>
+
+<p>Ademas de dibujar formas opacas en el canvas, podemos dibujar formas semi-transparentes(o translucidas). Esto se logra bien configurando la propiedad  <code>globalAlpha</code> o asignando un color semi-transparente al estilo del trazo u  u/y al de relleno.</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.globalAlpha", "globalAlpha = transparencyValue")}}</dt>
+ <dd>Applies the specified transparency value to all future shapes drawn on the canvas. The value must be between 0.0 (fully transparent) to 1.0 (fully opaque). This value is 1.0 (fully opaque) by default.</dd>
+</dl>
+
+<p>The <code>globalAlpha</code> property can be useful if you want to draw a lot of shapes on the canvas with similar transparency, but otherwise it's generally more useful to set the transparency on individual shapes when setting their colors.</p>
+
+<p>Debido qaque las propiedades  <code>strokeStyle</code> y <code>fillStyle</code> aceptan valores de color rgba de CSS, podemos usar la siguiente notacion para asignar una color transparente a ellos.</p>
+
+<pre class="brush: js">// Assigning transparent colors to stroke and fill style
+
+ctx.strokeStyle = 'rgba(255, 0, 0, 0.5)';
+ctx.fillStyle = 'rgba(255, 0, 0, 0.5)';
+</pre>
+
+<p>The <code>rgba()</code> function is similar to the <code>rgb()</code> function but it has one extra parameter. The last parameter sets the transparency value of this particular color. The valid range is again between 0.0 (fully transparent) and 1.0 (fully opaque).</p>
+
+<h3 id="A_globalAlpha_example" name="A_globalAlpha_example">A <code>globalAlpha</code> example</h3>
+
+<p>In this example, we'll draw a background of four different colored squares. On top of these, we'll draw a set of semi-transparent circles. The <code>globalAlpha</code> property is set at <code>0.2</code> which will be used for all shapes from that point on. Every step in the <code>for</code> loop draws a set of circles with an increasing radius. The final result is a radial gradient. By overlaying ever more circles on top of each other, we effectively reduce the transparency of the circles that have already been drawn. By increasing the step count and in effect drawing more circles, the background would completely disappear from the center of the image.</p>
+
+<pre class="brush: js;highlight[15]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+  // draw background
+  ctx.fillStyle = '#FD0';
+  ctx.fillRect(0, 0, 75, 75);
+  ctx.fillStyle = '#6C0';
+  ctx.fillRect(75, 0, 75, 75);
+  ctx.fillStyle = '#09F';
+  ctx.fillRect(0, 75, 75, 75);
+  ctx.fillStyle = '#F30';
+  ctx.fillRect(75, 75, 75, 75);
+  ctx.fillStyle = '#FFF';
+
+  // set transparency value
+  ctx.globalAlpha = 0.2;
+
+  // Draw semi transparent circles
+  for (var i = 0; i &lt; 7; i++) {
+    ctx.beginPath();
+    ctx.arc(75, 75, 10 + 10 * i, 0, Math.PI * 2, true);
+    ctx.fill();
+  }
+}</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("A_globalAlpha_example", "180", "180", "https://mdn.mozillademos.org/files/232/Canvas_globalalpha.png")}}</p>
+
+<h3 id="An_example_using_rgba" name="An_example_using_rgba()">An example using <code>rgba()</code></h3>
+
+<p>In this second example, we do something similar to the one above, but instead of drawing circles on top of each other, I've drawn small rectangles with increasing opacity. Using <code>rgba()</code> gives you a little more control and flexibility because we can set the fill and stroke style individually.</p>
+
+<pre class="brush: js;highlight[16]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // Draw background
+  ctx.fillStyle = 'rgb(255, 221, 0)';
+  ctx.fillRect(0, 0, 150, 37.5);
+  ctx.fillStyle = 'rgb(102, 204, 0)';
+  ctx.fillRect(0, 37.5, 150, 37.5);
+  ctx.fillStyle = 'rgb(0, 153, 255)';
+  ctx.fillRect(0, 75, 150, 37.5);
+  ctx.fillStyle = 'rgb(255, 51, 0)';
+  ctx.fillRect(0, 112.5, 150, 37.5);
+
+  // Draw semi transparent rectangles
+  for (var i = 0; i &lt; 10; i++) {
+    ctx.fillStyle = 'rgba(255, 255, 255, ' + (i + 1) / 10 + ')';
+    for (var j = 0; j &lt; 4; j++) {
+      ctx.fillRect(5 + i * 14, 5 + j * 37.5, 14, 27.5);
+    }
+  }
+}</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("An_example_using_rgba()", "180", "180", "https://mdn.mozillademos.org/files/246/Canvas_rgba.png")}}</p>
+
+<h2 id="Line_styles" name="Line_styles">Line styles</h2>
+
+<p>There are several properties which allow us to style lines.</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.lineWidth", "lineWidth = value")}}</dt>
+ <dd>Sets the width of lines drawn in the future.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.lineCap", "lineCap = type")}}</dt>
+ <dd>Sets the appearance of the ends of lines.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.lineJoin", "lineJoin = type")}}</dt>
+ <dd>Sets the appearance of the "corners" where lines meet.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.miterLimit", "miterLimit = value")}}</dt>
+ <dd>Establishes a limit on the miter when two lines join at a sharp angle, to let you control how thick the junction becomes.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.getLineDash", "getLineDash()")}}</dt>
+ <dd>Returns the current line dash pattern array containing an even number of non-negative numbers.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.setLineDash", "setLineDash(segments)")}}</dt>
+ <dd>Sets the current line dash pattern.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.lineDashOffset", "lineDashOffset = value")}}</dt>
+ <dd>Specifies where to start a dash array on a line.</dd>
+</dl>
+
+<p>You'll get a better understanding of what these do by looking at the examples below.</p>
+
+<h3 id="A_lineWidth_example" name="A_lineWidth_example">A <code>lineWidth</code> example</h3>
+
+<p>This property sets the current line thickness. Values must be positive numbers. By default this value is set to 1.0 units.</p>
+
+<p>The line width is the thickness of the stroke centered on the given path. In other words, the area that's drawn extends to half the line width on either side of the path. Because canvas coordinates do not directly reference pixels, special care must be taken to obtain crisp horizontal and vertical lines.</p>
+
+<p>In the example below, 10 straight lines are drawn with increasing line widths. The line on the far left is 1.0 units wide. However, the leftmost and all other odd-integer-width thickness lines do not appear crisp, because of the path's positioning.</p>
+
+<pre class="brush: js;highlight[4]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+  for (var i = 0; i &lt; 10; i++) {
+    ctx.lineWidth = 1 + i;
+    ctx.beginPath();
+    ctx.moveTo(5 + i * 14, 5);
+    ctx.lineTo(5 + i * 14, 140);
+    ctx.stroke();
+  }
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("A_lineWidth_example", "180", "180", "https://mdn.mozillademos.org/files/239/Canvas_linewidth.png")}}</p>
+
+<p>Obtaining crisp lines requires understanding how paths are stroked. In the images below, the grid represents the canvas coordinate grid. The squares between gridlines are actual on-screen pixels. In the first grid image below, a rectangle from (2,1) to (5,5) is filled. The entire area between them (light red) falls on pixel boundaries, so the resulting filled rectangle will have crisp edges.</p>
+
+<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/201/Canvas-grid.png"></p>
+
+<p>If you consider a path from (3,1) to (3,5) with a line thickness of <code>1.0</code>, you end up with the situation in the second image. The actual area to be filled (dark blue) only extends halfway into the pixels on either side of the path. An approximation of this has to be rendered, which means that those pixels being only partially shaded, and results in the entire area (the light blue and dark blue) being filled in with a color only half as dark as the actual stroke color. This is what happens with the <code>1.0</code> width line in the previous example code.</p>
+
+<p>To fix this, you have to be very precise in your path creation. Knowing that a <code>1.0</code> width line will extend half a unit to either side of the path, creating the path from (3.5,1) to (3.5,5) results in the situation in the third image—the <code>1.0</code> line width ends up completely and precisely filling a single pixel vertical line.</p>
+
+<div class="note">
+<p><strong>Note:</strong> Be aware that in our vertical line example, the Y position still referenced an integer gridline position—if it hadn't, we would see pixels with half coverage at the endpoints (but note also that this behavior depends on the current <code>lineCap</code> style whose default value is <code>butt</code>; you may want to compute consistent strokes with half-pixel coordinates for odd-width lines, by setting the <code>lineCap</code> style to <code>square</code>, so that the outer border of the stroke around the endpoint will be automatically extended to cover the whole pixel exactly).</p>
+
+<p>Note also that only start and final endpoints of a path are affected: if a path is closed with <code>closePath()</code>, there's no start and final endpoint; instead, all endpoints in the path are connected to their attached previous and next segment using the current setting of the <code>lineJoin</code> style, whose default value is <code>miter</code>, with the effect of automatically extending the outer borders of the connected segments to their intersection point, so that the rendered stroke will exactly cover full pixels centered at each endpoint if those connected segments are horizontal and/or vertical). See the next two sections for demonstrations of these additional line styles.</p>
+</div>
+
+<p>For even-width lines, each half ends up being an integer amount of pixels, so you want a path that is between pixels (that is, (3,1) to (3,5)), instead of down the middle of pixels.</p>
+
+<p>While slightly painful when initially working with scalable 2D graphics, paying attention to the pixel grid and the position of paths ensures that your drawings will look correct regardless of scaling or any other transformations involved. A 1.0-width vertical line drawn at the correct position will become a crisp 2-pixel line when scaled up by 2, and will appear at the correct position.</p>
+
+<h3 id="A_lineCap_example" name="A_lineCap_example">A <code>lineCap</code> example</h3>
+
+<p>The <code>lineCap</code> property determines how the end points of every line are drawn. There are three possible values for this property and those are: <code>butt</code>, <code>round</code> and <code>square</code>. By default this property is set to <code>butt</code>.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/236/Canvas_linecap.png" style="float: right; height: 190px; width: 190px;"></p>
+
+<dl>
+ <dt><code>butt</code></dt>
+ <dd>The ends of lines are squared off at the endpoints.</dd>
+ <dt><code>round</code></dt>
+ <dd>The ends of lines are rounded.</dd>
+ <dt><code>square</code></dt>
+ <dd>The ends of lines are squared off by adding a box with an equal width and half the height of the line's thickness.</dd>
+</dl>
+
+<p>In this example, we'll draw three lines, each with a different value for the <code>lineCap</code> property. I also added two guides to see the exact differences between the three. Each of these lines starts and ends exactly on these guides.</p>
+
+<p>The line on the left uses the default <code>butt</code> option. You'll notice that it's drawn completely flush with the guides. The second is set to use the <code>round</code> option. This adds a semicircle to the end that has a radius half the width of the line. The line on the right uses the <code>square</code> option. This adds a box with an equal width and half the height of the line thickness.</p>
+
+<pre class="brush: js;highlight[18]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+  var lineCap = ['butt', 'round', 'square'];
+
+  // Draw guides
+  ctx.strokeStyle = '#09f';
+  ctx.beginPath();
+  ctx.moveTo(10, 10);
+  ctx.lineTo(140, 10);
+  ctx.moveTo(10, 140);
+  ctx.lineTo(140, 140);
+  ctx.stroke();
+
+  // Draw lines
+  ctx.strokeStyle = 'black';
+  for (var i = 0; i &lt; lineCap.length; i++) {
+    ctx.lineWidth = 15;
+    ctx.lineCap = lineCap[i];
+    ctx.beginPath();
+    ctx.moveTo(25 + i * 50, 10);
+    ctx.lineTo(25 + i * 50, 140);
+    ctx.stroke();
+  }
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("A_lineCap_example", "180", "180", "https://mdn.mozillademos.org/files/236/Canvas_linecap.png")}}</p>
+
+<h3 id="A_lineJoin_example" name="A_lineJoin_example">A <code>lineJoin</code> example</h3>
+
+<p>The <code>lineJoin</code> property determines how two connecting segments (of lines, arcs or curves) with non-zero lengths in a shape are joined together (degenerate segments with zero lengths, whose specified endpoints and control points are exactly at the same position, are skipped).</p>
+
+<p>There are three possible values for this property: <code>round</code>, <code>bevel</code> and <code>miter</code>. By default this property is set to <code>miter</code>. Note that the <code>lineJoin</code> setting has no effect if the two connected segments have the same direction, because no joining area will be added in this case.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/237/Canvas_linejoin.png" style="float: right; height: 190px; width: 190px;"></p>
+
+<dl>
+ <dt><code>round</code></dt>
+ <dd>Rounds off the corners of a shape by filling an additional sector of disc centered at the common endpoint of connected segments. The radius for these rounded corners is equal to half the line width.</dd>
+ <dt><code>bevel</code></dt>
+ <dd>Fills an additional triangular area between the common endpoint of connected segments, and the separate outside rectangular corners of each segment.</dd>
+ <dt><code>miter</code></dt>
+ <dd>Connected segments are joined by extending their outside edges to connect at a single point, with the effect of filling an additional lozenge-shaped area. This setting is effected by the <code>miterLimit</code> property which is explained below.</dd>
+</dl>
+
+<p>The example below draws three different paths, demonstrating each of these three <code>lineJoin</code> property settings; the output is shown above.</p>
+
+<pre class="brush: js;highlight[6]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+  var lineJoin = ['round', 'bevel', 'miter'];
+  ctx.lineWidth = 10;
+  for (var i = 0; i &lt; lineJoin.length; i++) {
+    ctx.lineJoin = lineJoin[i];
+    ctx.beginPath();
+    ctx.moveTo(-5, 5 + i * 40);
+    ctx.lineTo(35, 45 + i * 40);
+    ctx.lineTo(75, 5 + i * 40);
+    ctx.lineTo(115, 45 + i * 40);
+    ctx.lineTo(155, 5 + i * 40);
+    ctx.stroke();
+  }
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("A_lineJoin_example", "180", "180", "https://mdn.mozillademos.org/files/237/Canvas_linejoin.png")}}</p>
+
+<h3 id="A_demo_of_the_miterLimit_property" name="A_demo_of_the_miterLimit_property">A demo of the <code>miterLimit</code> property</h3>
+
+<p>As you've seen in the previous example, when joining two lines with the <code>miter</code> option, the outside edges of the two joining lines are extended up to the point where they meet. For lines which are at large angles with each other, this point is not far from the inside connection point. However, as the angles between each line decreases, the distance (miter length) between these points increases exponentially.</p>
+
+<p>The <code>miterLimit</code> property determines how far the outside connection point can be placed from the inside connection point. If two lines exceed this value, a bevel join gets drawn instead. Note that the maximum miter length is the product of the line width measured in the current coordinate system, by the value of this <code>miterLimit</code> property (whose default value is 10.0 in the HTML {{HTMLElement("canvas")}}), so the <code>miterLimit</code> can be set independently from the current display scale or any affine transforms of paths: it only influences the effectively rendered shape of line edges.</p>
+
+<p>More exactly, the miter limit is the maximum allowed ratio of the extension length (in the HTML canvas, it is measured between the outside corner of the joined edges of the line and the common endpoint of connecting segments specified in the path) to half the line width. It can equivalently be defined as the maximum allowed ratio of the distance between the inside and outside points of jonction of edges, to the total line width. It is then equal to the cosecant of half the minimum inner angle of connecting segments below which no miter join will be rendered, but only a bevel join:</p>
+
+<ul>
+ <li><code>miterLimit</code> = <strong>max</strong> <code>miterLength</code> / <code>lineWidth</code> = 1 / <strong>sin</strong> ( <strong>min</strong> <em>θ</em> / 2 )</li>
+ <li>The default miter limit of 10.0 will strip all miters for sharp angles below about 11 degrees.</li>
+ <li>A miter limit equal to √2 ≈ 1.4142136 (rounded up) will strip miters for all acute angles, keeping miter joins only for obtuse or right angles.</li>
+ <li>A miter limit equal to 1.0 is valid but will disable all miters.</li>
+ <li>Values below 1.0 are invalid for the miter limit.</li>
+</ul>
+
+<p>Here's a little demo in which you can set <code>miterLimit</code> dynamically and see how this effects the shapes on the canvas. The blue lines show where the start and endpoints for each of the lines in the zig-zag pattern are.</p>
+
+<p>If you specify a <code>miterLimit</code> value below 4.2 in this demo, none of the visible corners will join with a miter extension, but only with a small bevel near the blue lines; with a <code>miterLimit</code> above 10, most corners in this demo should join with a miter far away from the blue lines, and whose height is decreasing between corners from left to right because they connect with growing angles; with intermediate values, the corners on the left side will only join with a bevel near the blue lines, and the corners on the right side with a miter extension (also with a decreasing height).</p>
+
+<pre class="brush: js;highlight[18]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // Clear canvas
+  ctx.clearRect(0, 0, 150, 150);
+
+  // Draw guides
+  ctx.strokeStyle = '#09f';
+  ctx.lineWidth   = 2;
+  ctx.strokeRect(-5, 50, 160, 50);
+
+  // Set line styles
+  ctx.strokeStyle = '#000';
+  ctx.lineWidth = 10;
+
+  // check input
+  if (document.getElementById('miterLimit').value.match(/\d+(\.\d+)?/)) {
+    ctx.miterLimit = parseFloat(document.getElementById('miterLimit').value);
+  } else {
+    alert('Value must be a positive number');
+  }
+
+  // Draw lines
+  ctx.beginPath();
+  ctx.moveTo(0, 100);
+  for (i = 0; i &lt; 24 ; i++) {
+    var dy = i % 2 == 0 ? 25 : -25;
+    ctx.lineTo(Math.pow(i, 1.5) * 2, 75 + dy);
+  }
+  ctx.stroke();
+  return false;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;table&gt;
+  &lt;tr&gt;
+    &lt;td&gt;&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;&lt;/td&gt;
+    &lt;td&gt;Change the &lt;code&gt;miterLimit&lt;/code&gt; by entering a new value below and clicking the redraw button.&lt;br&gt;&lt;br&gt;
+      &lt;form onsubmit="return draw();"&gt;
+        &lt;label&gt;Miter limit&lt;/label&gt;
+        &lt;input type="number" size="3" id="miterLimit"/&gt;
+        &lt;input type="submit" value="Redraw"/&gt;
+      &lt;/form&gt;
+    &lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;</pre>
+
+<pre class="brush: js">document.getElementById('miterLimit').value = document.getElementById('canvas').getContext('2d').miterLimit;
+draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("A_demo_of_the_miterLimit_property", "400", "180", "https://mdn.mozillademos.org/files/240/Canvas_miterlimit.png")}}</p>
+
+<h3 id="Using_line_dashes">Using line dashes</h3>
+
+<p>The <code>setLineDash</code> method and the <code>lineDashOffset</code> property specify the dash pattern for lines. The <code>setLineDash</code> method accepts a list of numbers that specifies distances to alternately draw a line and a gap and the <code>lineDashOffset</code> property sets an offset where to start the pattern.</p>
+
+<p>In this example we are creating a marching ants effect. It is an animation technique often found in <span class="new">selection</span> tools of computer graphics programs. It helps the user to distinguish the selection border from the image background by animating the border. In a later part of this tutorial, you can learn how to do this and other <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">basic animations</a>.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="110" height="110"&gt;&lt;/canvas&gt;</pre>
+</div>
+
+<pre class="brush: js;highlight[6]">var ctx = document.getElementById('canvas').getContext('2d');
+var offset = 0;
+
+function draw() {
+  ctx.clearRect(0, 0, canvas.width, canvas.height);
+  ctx.setLineDash([4, 2]);
+  ctx.lineDashOffset = -offset;
+  ctx.strokeRect(10, 10, 100, 100);
+}
+
+function march() {
+  offset++;
+  if (offset &gt; 16) {
+    offset = 0;
+  }
+  draw();
+  setTimeout(march, 20);
+}
+
+march();</pre>
+
+<p>{{EmbedLiveSample("Using_line_dashes", "120", "120", "https://mdn.mozillademos.org/files/9853/marching-ants.png")}}</p>
+
+<h2 id="Gradients" name="Gradients">Gradients</h2>
+
+<p>Just like any normal drawing program, we can fill and stroke shapes using linear and radial gradients. We create a {{domxref("CanvasGradient")}} object by using one of the following methods. We can then assign this object to the <code>fillStyle</code> or <code>strokeStyle</code> properties.</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.createLinearGradient", "createLinearGradient(x1, y1, x2, y2)")}}</dt>
+ <dd>Creates a linear gradient object with a starting point of (<code>x1</code>, <code>y1</code>) and an end point of (<code>x2</code>, <code>y2</code>).</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.createRadialGradient", "createRadialGradient(x1, y1, r1, x2, y2, r2)")}}</dt>
+ <dd>Creates a radial gradient. The parameters represent two circles, one with its center at (<code>x1</code>, <code>y1</code>) and a radius of <code>r1</code>, and the other with its center at (<code>x2</code>, <code>y2</code>) with a radius of <code>r2</code>.</dd>
+</dl>
+
+<p>For example:</p>
+
+<pre class="brush: js">var lineargradient = ctx.createLinearGradient(0, 0, 150, 150);
+var radialgradient = ctx.createRadialGradient(75, 75, 0, 75, 75, 100);
+</pre>
+
+<p>Once we've created a <code>CanvasGradient</code> object we can assign colors to it by using the <code>addColorStop()</code> method.</p>
+
+<dl>
+ <dt>{{domxref("CanvasGradient.addColorStop", "gradient.addColorStop(position, color)")}}</dt>
+ <dd>Creates a new color stop on the <code>gradient</code> object. The <code>position</code> is a number between 0.0 and 1.0 and defines the relative position of the color in the gradient, and the <code>color</code> argument must be a string representing a CSS {{cssxref("&lt;color&gt;")}}, indicating the color the gradient should reach at that offset into the transition.</dd>
+</dl>
+
+<p>You can add as many color stops to a gradient as you need. Below is a very simple linear gradient from white to black.</p>
+
+<pre class="brush: js">var lineargradient = ctx.createLinearGradient(0, 0, 150, 150);
+lineargradient.addColorStop(0, 'white');
+lineargradient.addColorStop(1, 'black');
+</pre>
+
+<h3 id="A_createLinearGradient_example" name="A_createLinearGradient_example">A <code>createLinearGradient</code> example</h3>
+
+<p>In this example, we'll create two different gradients. As you can see here, both the <code>strokeStyle</code> and <code>fillStyle</code> properties can accept a <code>canvasGradient</code> object as valid input.</p>
+
+<pre class="brush: js;highlight[5,11]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // Create gradients
+  var lingrad = ctx.createLinearGradient(0, 0, 0, 150);
+  lingrad.addColorStop(0, '#00ABEB');
+  lingrad.addColorStop(0.5, '#fff');
+  lingrad.addColorStop(0.5, '#26C000');
+  lingrad.addColorStop(1, '#fff');
+
+  var lingrad2 = ctx.createLinearGradient(0, 50, 0, 95);
+  lingrad2.addColorStop(0.5, '#000');
+  lingrad2.addColorStop(1, 'rgba(0, 0, 0, 0)');
+
+  // assign gradients to fill and stroke styles
+  ctx.fillStyle = lingrad;
+  ctx.strokeStyle = lingrad2;
+
+  // draw shapes
+  ctx.fillRect(10, 10, 130, 130);
+  ctx.strokeRect(50, 50, 50, 50);
+
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>The first is a background gradient. As you can see, we assigned two colors at the same position. You do this to make very sharp color transitions—in this case from white to green. Normally, it doesn't matter in what order you define the color stops, but in this special case, it does significantly. If you keep the assignments in the order you want them to appear, this won't be a problem.</p>
+
+<p>In the second gradient, we didn't assign the starting color (at position 0.0) since it wasn't strictly necessary, because it will automatically assume the color of the next color stop. Therefore, assigning the black color at position 0.5 automatically makes the gradient, from the start to this stop, black.</p>
+
+<p>{{EmbedLiveSample("A_createLinearGradient_example", "180", "180", "https://mdn.mozillademos.org/files/235/Canvas_lineargradient.png")}}</p>
+
+<h3 id="A_createRadialGradient_example" name="A_createRadialGradient_example">A <code>createRadialGradient</code> example</h3>
+
+<p>In this example, we'll define four different radial gradients. Because we have control over the start and closing points of the gradient, we can achieve more complex effects than we would normally have in the "classic" radial gradients we see in, for instance, Photoshop (that is, a gradient with a single center point where the gradient expands outward in a circular shape).</p>
+
+<pre class="brush: js;highlight[5,10,15,20]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // Create gradients
+  var radgrad = ctx.createRadialGradient(45, 45, 10, 52, 50, 30);
+  radgrad.addColorStop(0, '#A7D30C');
+  radgrad.addColorStop(0.9, '#019F62');
+  radgrad.addColorStop(1, 'rgba(1, 159, 98, 0)');
+
+  var radgrad2 = ctx.createRadialGradient(105, 105, 20, 112, 120, 50);
+  radgrad2.addColorStop(0, '#FF5F98');
+  radgrad2.addColorStop(0.75, '#FF0188');
+  radgrad2.addColorStop(1, 'rgba(255, 1, 136, 0)');
+
+  var radgrad3 = ctx.createRadialGradient(95, 15, 15, 102, 20, 40);
+  radgrad3.addColorStop(0, '#00C9FF');
+  radgrad3.addColorStop(0.8, '#00B5E2');
+  radgrad3.addColorStop(1, 'rgba(0, 201, 255, 0)');
+
+  var radgrad4 = ctx.createRadialGradient(0, 150, 50, 0, 140, 90);
+  radgrad4.addColorStop(0, '#F4F201');
+  radgrad4.addColorStop(0.8, '#E4C700');
+  radgrad4.addColorStop(1, 'rgba(228, 199, 0, 0)');
+
+  // draw shapes
+  ctx.fillStyle = radgrad4;
+  ctx.fillRect(0, 0, 150, 150);
+  ctx.fillStyle = radgrad3;
+  ctx.fillRect(0, 0, 150, 150);
+  ctx.fillStyle = radgrad2;
+  ctx.fillRect(0, 0, 150, 150);
+  ctx.fillStyle = radgrad;
+  ctx.fillRect(0, 0, 150, 150);
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>In this case, we've offset the starting point slightly from the end point to achieve a spherical 3D effect. It's best to try to avoid letting the inside and outside circles overlap because this results in strange effects which are hard to predict.</p>
+
+<p>The last color stop in each of the four gradients uses a fully transparent color. If you want to have a nice transition from this to the previous color stop, both colors should be equal. This isn't very obvious from the code because it uses two different CSS color methods as a demonstration, but in the first gradient <code>#019F62 = rgba(1,159,98,1)</code>.</p>
+
+<p>{{EmbedLiveSample("A_createRadialGradient_example", "180", "180", "https://mdn.mozillademos.org/files/244/Canvas_radialgradient.png")}}</p>
+
+<h2 id="Patterns" name="Patterns">Patterns</h2>
+
+<p>In one of the examples on the previous page, we used a series of loops to create a pattern of images. There is, however, a much simpler method: the <code>createPattern()</code> method.</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.createPattern", "createPattern(image, type)")}}</dt>
+ <dd>Creates and returns a new canvas pattern object. <code>image</code> is a {{domxref("CanvasImageSource")}} (that is, an {{domxref("HTMLImageElement")}}, another canvas, a {{HTMLElement("video")}} element, or the like. <code>type</code> is a string indicating how to use the image.</dd>
+</dl>
+
+<p>The type specifies how to use the image in order to create the pattern, and must be one of the following string values:</p>
+
+<dl>
+ <dt><code>repeat</code></dt>
+ <dd>Tiles the image in both vertical and horizontal directions.</dd>
+ <dt><code>repeat-x</code></dt>
+ <dd>Tiles the image horizontally but not vertically.</dd>
+ <dt><code>repeat-y</code></dt>
+ <dd>Tiles the image vertically but not horizontally.</dd>
+ <dt><code>no-repeat</code></dt>
+ <dd>Doesn't tile the image. It's used only once.</dd>
+</dl>
+
+<p>We use this method to create a {{domxref("CanvasPattern")}} object which is very similar to the gradient methods we've seen above. Once we've created a pattern, we can assign it to the <code>fillStyle</code> or <code>strokeStyle</code> properties. For example:</p>
+
+<pre class="brush: js">var img = new Image();
+img.src = 'someimage.png';
+var ptrn = ctx.createPattern(img, 'repeat');
+</pre>
+
+<div class="note">
+<p><strong>Note:</strong> Like with the <code>drawImage()</code> method, you must make sure the image you use is loaded before calling this method or the pattern may be drawn incorrectly.</p>
+</div>
+
+<h3 id="A_createPattern_example" name="A_createPattern_example">A <code>createPattern</code> example</h3>
+
+<p>In this last example, we'll create a pattern to assign to the <code>fillStyle</code> property. The only thing worth noting is the use of the image's <code>onload</code> handler. This is to make sure the image is loaded before it is assigned to the pattern.</p>
+
+<pre class="brush: js;highlight[10]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // create new image object to use as pattern
+  var img = new Image();
+  img.src = 'https://mdn.mozillademos.org/files/222/Canvas_createpattern.png';
+  img.onload = function() {
+
+    // create pattern
+    var ptrn = ctx.createPattern(img, 'repeat');
+    ctx.fillStyle = ptrn;
+    ctx.fillRect(0, 0, 150, 150);
+
+  }
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+
+<p>The result looks like this:</p>
+</div>
+
+<p>{{EmbedLiveSample("A_createPattern_example", "180", "180", "https://mdn.mozillademos.org/files/222/Canvas_createpattern.png")}}</p>
+
+<h2 id="Shadows">Shadows</h2>
+
+<p>Using shadows involves just four properties:</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.shadowOffsetX", "shadowOffsetX = float")}}</dt>
+ <dd>Indicates the horizontal distance the shadow should extend from the object. This value isn't affected by the transformation matrix. The default is 0.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.shadowOffsetY", "shadowOffsetY = float")}}</dt>
+ <dd>Indicates the vertical distance the shadow should extend from the object. This value isn't affected by the transformation matrix. The default is 0.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.shadowBlur", "shadowBlur = float")}}</dt>
+ <dd>Indicates the size of the blurring effect; this value doesn't correspond to a number of pixels and is not affected by the current transformation matrix. The default value is 0.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.shadowColor", "shadowColor = color")}}</dt>
+ <dd>A standard CSS color value indicating the color of the shadow effect; by default, it is fully-transparent black.</dd>
+</dl>
+
+<p>The properties <code>shadowOffsetX</code> and <code>shadowOffsetY</code> indicate how far the shadow should extend from the object in the X and Y directions; these values aren't affected by the current transformation matrix. Use negative values to cause the shadow to extend up or to the left, and positive values to cause the shadow to extend down or to the right. These are both 0 by default.</p>
+
+<p>The <code>shadowBlur</code> property indicates the size of the blurring effect; this value doesn't correspond to a number of pixels and is not affected by the current transformation matrix. The default value is 0.</p>
+
+<p>The <code>shadowColor</code> property is a standard CSS color value indicating the color of the shadow effect; by default, it is fully-transparent black.</p>
+
+<div class="note">
+<p><strong>Note:</strong> Shadows are only drawn for <code>source-over</code> <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Compositing" title="Web/Guide/HTML/Canvas_tutorial/Compositing">compositing operations</a>.</p>
+</div>
+
+<h3 id="A_shadowed_text_example">A shadowed text example</h3>
+
+<p>This example draws a text string with a shadowing effect.</p>
+
+<pre class="brush: js;highlight[4,5,6,7]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  ctx.shadowOffsetX = 2;
+  ctx.shadowOffsetY = 2;
+  ctx.shadowBlur = 2;
+  ctx.shadowColor = 'rgba(0, 0, 0, 0.5)';
+
+  ctx.font = '20px Times New Roman';
+  ctx.fillStyle = 'Black';
+  ctx.fillText('Sample String', 5, 30);
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="80"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("A_shadowed_text_example", "180", "100", "https://mdn.mozillademos.org/files/2505/shadowed-string.png")}}</p>
+
+<p>We will look at the <code>font</code> property and <code>fillText</code> method in the next chapter about <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text">drawing text</a>.</p>
+
+<h2 id="Canvas_fill_rules">Canvas fill rules</h2>
+
+<p>When using <code>fill</code> (or {{domxref("CanvasRenderingContext2D.clip", "clip")}} and {{domxref("CanvasRenderingContext2D.isPointInPath", "isPointinPath")}}) you can optionally provide a fill rule algorithm by which to determine if a point is inside or outside a path and thus if it gets filled or not. This is useful when a path intersects itself or is nested.<br>
+ <br>
+ Two values are possible:</p>
+
+<ul>
+ <li><code><strong>"nonzero</strong></code>": The <a class="external external-icon" href="http://en.wikipedia.org/wiki/Nonzero-rule">non-zero winding rule</a>, which is the default rule.</li>
+ <li><code><strong>"evenodd"</strong></code>: The <a class="external external-icon" href="http://en.wikipedia.org/wiki/Even%E2%80%93odd_rule">even-odd winding rule</a>.</li>
+</ul>
+
+<p>In this example we are using the <code>evenodd</code> rule.</p>
+
+<pre class="brush: js;highlight[6]">function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+  ctx.beginPath();
+  ctx.arc(50, 50, 30, 0, Math.PI * 2, true);
+  ctx.arc(50, 50, 15, 0, Math.PI * 2, true);
+  ctx.fill('evenodd');
+}</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="100" height="100"&gt;&lt;/canvas&gt;</pre>
+
+<pre class="brush: js">draw();</pre>
+</div>
+
+<p>{{EmbedLiveSample("Canvas_fill_rules", "110", "110", "https://mdn.mozillademos.org/files/9855/fill-rule.png")}}</p>
+
+<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Drawing_shapes", "Web/API/Canvas_API/Tutorial/Drawing_text")}}</p>
diff --git a/files/es/web/api/canvas_api/tutorial/basic_animations/index.html b/files/es/web/api/canvas_api/tutorial/basic_animations/index.html
new file mode 100644
index 0000000000..8202a2621f
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/basic_animations/index.html
@@ -0,0 +1,334 @@
+---
+title: Animaciones básicas
+slug: Web/API/Canvas_API/Tutorial/Basic_animations
+tags:
+  - Canvas
+  - HTML5
+  - Intermedio
+  - Tutorial
+  - graficos
+translation_of: Web/API/Canvas_API/Tutorial/Basic_animations
+original_slug: Web/Guide/HTML/Canvas_tutorial/Basic_animations
+---
+<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Compositing", "Web/API/Canvas_API/Tutorial/Advanced_animations")}}</div>
+
+<div class="summary">
+<p>Ya que estamos usando JavaScript para controlar elementos {{HTMLElement("canvas")}} , también es muy fácil hacer animaciones (interactivas). En este capitulo veremos como hacer algunas animaciones básicas.</p>
+</div>
+
+<p>Probablemente la mayor limitación es que una vez que se dibuja una forma, se mantiene de esa manera. Si necesitamos moverlo tenemos que volver a dibujarlo y todo lo que se dibujó antes. Se necesita mucho tiempo para volver a dibujar estructuras complejas y el rendimiento depende en gran medida de la velocidad de la computadora en la que se ejecuta.</p>
+
+<h2 id="Basic_animation_steps" name="Basic_animation_steps">Pasos básicos de animación</h2>
+
+<p>Estos son los pasos que necesitas para dibujar un cuadro:</p>
+
+<ol>
+ <li><strong>Limpiar el canvas</strong><br>
+  A menos que las formas que vas a dibujar llenen el canvas completo (por ejemplo, una imagen de fondo), debes borrar cualquier forma que haya dibujado previamente. La forma más fácil de hacerlo es usar el método {{domxref("CanvasRenderingContext2D.clearRect", "clearRect()")}}.</li>
+ <li><strong>Guardar el estado del canvas</strong><br>
+  Si estás cambiando alguna configuración (como estilos, transformaciones, etc.) que afecte el estado del canvas y deseas asegurarte de que se utiliza el estado original cada vez que se dibuja una figura, debes guardar ese estado original. </li>
+ <li><strong>Dibujar formas animadas</strong><br>
+  El paso en el que realizas el renderizado del cuadro actual.</li>
+ <li><strong>Restaurar el estado del canvas</strong><br>
+  Si has guardado el estado, restáuralo antes de dibujar un nuevo cuadro.</li>
+</ol>
+
+<h2 id="Controlling_an_animation" name="Controlling_an_animation">Controlando una animación</h2>
+
+<p>Las formas se dibujan en el canvas utilizando los métodos de canvas directamente o llamando a funciones personalizadas. En circunstancias normales, solo vemos que estos resultados aparecen en el canvas cuando el script termina de ejecutarse. Por ejemplo, no es posible hacer una animación desde un bucle <code>for</code>.</p>
+
+<p>Eso significa que necesitamos una forma de ejecutar nuestras funciones de dibujo durante un período de tiempo. Hay dos formas de controlar una animación como esta.</p>
+
+<h3 id="Actualizaciones_Programadas">Actualizaciones Programadas</h3>
+
+<p>Primero {{domxref("window.setInterval()")}}, {{domxref("window.setTimeout()")}}, y {{domxref("window.requestAnimationFrame()")}} son funciones que pueden ser usadas para llamar una función especifica en un periodo de tiempo establecido.</p>
+
+<dl>
+ <dt>{{domxref("WindowTimers.setInterval", "setInterval(function, delay)")}}</dt>
+ <dd>Ejecuta una función especificada por <code>function</code> cada <code>delay</code> milisegundos.</dd>
+ <dt>{{domxref("WindowTimers.setTimeout", "setTimeout(function, delay)")}}</dt>
+ <dd>Ejecuta una función especificada por <code>function</code> dentro de <code>delay</code> milisegundos.</dd>
+ <dt>{{domxref("Window.requestAnimationFrame()", "requestAnimationFrame(callback)")}}</dt>
+ <dd>Comunica al navegador que  deseas iniciar una animación y requieres que el navegador llame a las funciones especificas para actualizar la misma antes de la siguiente escena.</dd>
+</dl>
+
+<p>Si no quieres ninguna interacción del usuario puedes usar la función <code>setInterval()</code> que repite la ejecución del código suministrado. Si lo que queremos es hacer un juego, podríamos usar eventos de teclado o el mouse para controlar la animación y usar <code>setTimeout()</code>. Al establecer los {{domxref("EventListener")}}, capturamos cualquier interacción del usuario y ejecutamos nuestras funciones de animación.</p>
+
+<div class="note">
+<p>En los siguiente ejemplo,usaremos el método para controlar animaciones {{domxref("window.requestAnimationFrame()")}}. El método <code>requestAnimationFrame</code> provee formas amigables y mas eficientes  para animar llamando cada marco de animación cuando el sistema esta listo para dibujar. La cantidad de devoluciones de llamadas suele ser 60 veces por segundo y podría ser reducido a menor periodo cuando se corre en un segundo plano. Para mas información acerca de los ciclos de animación, especialmente para juegos, Ver el Articulo <a href="/es/docs/Games/Anatomy">Anatomía de un videojuego</a> en nuestra <a href="/en-US/docs/Games">GameZona de desarrollo de Juegos</a>.</p>
+</div>
+
+<h2 id="Un_sistema_solar_animado">Un sistema solar animado</h2>
+
+<p>Este ejemplo animado es un pequeño modelo de nuestro sistema solar.</p>
+
+<pre class="brush: js">var sun = new Image();
+var moon = new Image();
+var earth = new Image();
+function init(){
+  sun.src = 'https://mdn.mozillademos.org/files/1456/Canvas_sun.png';
+  moon.src = 'https://mdn.mozillademos.org/files/1443/Canvas_moon.png';
+  earth.src = 'https://mdn.mozillademos.org/files/1429/Canvas_earth.png';
+  window.requestAnimationFrame(draw);
+}
+
+function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  ctx.globalCompositeOperation = 'destination-over';
+  ctx.clearRect(0,0,300,300); // limpiar canvas
+
+  ctx.fillStyle = 'rgba(0,0,0,0.4)';
+  ctx.strokeStyle = 'rgba(0,153,255,0.4)';
+  ctx.save();
+  ctx.translate(150,150);
+
+  // La tierra
+  var time = new Date();
+  ctx.rotate( ((2*Math.PI)/60)*time.getSeconds() + ((2*Math.PI)/60000)*time.getMilliseconds() );
+  ctx.translate(105,0);
+  ctx.fillRect(0,-12,50,24); // Sombra
+  ctx.drawImage(earth,-12,-12);
+
+  // La luna
+  ctx.save();
+  ctx.rotate( ((2*Math.PI)/6)*time.getSeconds() + ((2*Math.PI)/6000)*time.getMilliseconds() );
+  ctx.translate(0,28.5);
+  ctx.drawImage(moon,-3.5,-3.5);
+  ctx.restore();
+
+  ctx.restore();
+
+  ctx.beginPath();
+  ctx.arc(150,150,105,0,Math.PI*2,false); // Órbita terrestre
+  ctx.stroke();
+
+  ctx.drawImage(sun,0,0,300,300);
+
+  window.requestAnimationFrame(draw);
+}
+
+init();
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="300" height="300"&gt;&lt;/canvas&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample("Un_sistema_solar_animado", "310", "310", "https://mdn.mozillademos.org/files/202/Canvas_animation1.png")}}</p>
+
+<h2 id="Un_reloj_animado">Un reloj animado</h2>
+
+<p>Este ejemplo dibuja una reloj animado, mostrando la hora actual.</p>
+
+<pre class="brush: js">function clock(){
+  var now = new Date();
+  var ctx = document.getElementById('canvas').getContext('2d');
+  ctx.save();
+  ctx.clearRect(0,0,150,150);
+  ctx.translate(75,75);
+  ctx.scale(0.4,0.4);
+  ctx.rotate(-Math.PI/2);
+  ctx.strokeStyle = "black";
+  ctx.fillStyle = "white";
+  ctx.lineWidth = 8;
+  ctx.lineCap = "round";
+
+  // Aguja de la hora
+  ctx.save();
+  for (var i=0;i&lt;12;i++){
+    ctx.beginPath();
+    ctx.rotate(Math.PI/6);
+    ctx.moveTo(100,0);
+    ctx.lineTo(120,0);
+    ctx.stroke();
+  }
+  ctx.restore();
+
+  // Aguja del minuto
+  ctx.save();
+  ctx.lineWidth = 5;
+  for (i=0;i&lt;60;i++){
+    if (i%5!=0) {
+      ctx.beginPath();
+      ctx.moveTo(117,0);
+      ctx.lineTo(120,0);
+      ctx.stroke();
+    }
+    ctx.rotate(Math.PI/30);
+  }
+  ctx.restore();
+
+  var sec = now.getSeconds();
+  var min = now.getMinutes();
+  var hr  = now.getHours();
+  hr = hr&gt;=12 ? hr-12 : hr;
+
+  ctx.fillStyle = "black";
+
+  // Escribimos la hora
+  ctx.save();
+  ctx.rotate( hr*(Math.PI/6) + (Math.PI/360)*min + (Math.PI/21600)*sec )
+  ctx.lineWidth = 14;
+  ctx.beginPath();
+  ctx.moveTo(-20,0);
+  ctx.lineTo(80,0);
+  ctx.stroke();
+  ctx.restore();
+
+  // escribimos los minutos
+  ctx.save();
+  ctx.rotate( (Math.PI/30)*min + (Math.PI/1800)*sec )
+  ctx.lineWidth = 10;
+  ctx.beginPath();
+  ctx.moveTo(-28,0);
+  ctx.lineTo(112,0);
+  ctx.stroke();
+  ctx.restore();
+
+  // escribimos los segundos
+  ctx.save();
+  ctx.rotate(sec * Math.PI/30);
+  ctx.strokeStyle = "#D40000";
+  ctx.fillStyle = "#D40000";
+  ctx.lineWidth = 6;
+  ctx.beginPath();
+  ctx.moveTo(-30,0);
+  ctx.lineTo(83,0);
+  ctx.stroke();
+  ctx.beginPath();
+  ctx.arc(0,0,10,0,Math.PI*2,true);
+  ctx.fill();
+  ctx.beginPath();
+  ctx.arc(95,0,10,0,Math.PI*2,true);
+  ctx.stroke();
+  ctx.fillStyle = "rgba(0,0,0,0)";
+  ctx.arc(0,0,3,0,Math.PI*2,true);
+  ctx.fill();
+  ctx.restore();
+
+  ctx.beginPath();
+  ctx.lineWidth = 14;
+  ctx.strokeStyle = '#325FA2';
+  ctx.arc(0,0,142,0,Math.PI*2,true);
+  ctx.stroke();
+
+  ctx.restore();
+
+  window.requestAnimationFrame(clock);
+}
+
+window.requestAnimationFrame(clock);</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample("Un_reloj_animado", "180", "180", "https://mdn.mozillademos.org/files/203/Canvas_animation2.png")}}</p>
+
+<h2 id="Un_panorama_en_bucle">Un panorama en bucle</h2>
+
+<p>En este ejemplo, una foto panorámica avanza de izquierda a derecha. Donde usaremos <a href="http://commons.wikimedia.org/wiki/File:Capitan_Meadows,_Yosemite_National_Park.jpg" title="http://commons.wikimedia.org/wiki/File:Capitan_Meadows,_Yosemite_National_Park.jpg">una imagen del Parque Nacional de Yosemite</a> que tomamos de Wikipedia, pero tu podrías usar cualquier imagen que sea mas grande que el canvas.</p>
+
+<pre class="brush: js">var img = new Image();
+
+// Variables de usuario - personalizar estas para cambiar la imagen cuando inicie el desplazamiento
+// dirección y velocidad.
+
+img.src = 'https://mdn.mozillademos.org/files/4553/Capitan_Meadows,_Yosemite_National_Park.jpg';
+var CanvasXSize = 800;
+var CanvasYSize = 200;
+var speed = 30; //más bajo es más rápido
+var scale = 1.05;
+var y = -4.5; //desplazamiento vertical
+
+// Programa principal
+
+var dx = 0.75;
+var imgW;
+var imgH;
+var x = 0;
+var clearX;
+var clearY;
+var ctx;
+
+img.onload = function() {
+    imgW = img.width * scale;
+    imgH = img.height * scale;
+
+    if (imgW &gt; CanvasXSize) {
+        // imagen más grande que canvas
+        x = CanvasXSize - imgW;
+    }
+    if (imgW &gt; CanvasXSize) {
+        // ancho de imagen más grande que canvas
+        clearX = imgW;
+    } else {
+        clearX = CanvasXSize;
+    }
+    if (imgH &gt; CanvasYSize) {
+        // altura de la imagen más grande que canvas
+        clearY = imgH;
+    } else {
+        clearY = CanvasYSize;
+    }
+
+    // obtener contexto de canvas
+    ctx = document.getElementById('canvas').getContext('2d');
+
+    // establecer frecuencia de actualización
+    return setInterval(draw, speed);
+}
+
+function draw() {
+    ctx.clearRect(0, 0, clearX, clearY); // clear the canvas
+
+    // si la imagen es &lt;= tamaño de Canvas
+    if (imgW &lt;= CanvasXSize) {
+        // reiniciar, comenzar desde el principio
+        if (x &gt; CanvasXSize) {
+            x = -imgW + x;
+        }
+        // dibujar image1 adicional
+        if (x &gt; 0) {
+            ctx.drawImage(img, -imgW + x, y, imgW, imgH);
+        }
+        // dibujar image2 adicional
+        if (x - imgW &gt; 0) {
+            ctx.drawImage(img, -imgW * 2 + x, y, imgW, imgH);
+        }
+    }
+
+    // la imagen es &gt; tamaño de Canvas
+    else {
+        // reiniciar, comenzar desde el principio
+        if (x &gt; (CanvasXSize)) {
+            x = CanvasXSize - imgW;
+        }
+        // dibujar image adicional
+        if (x &gt; (CanvasXSize-imgW)) {
+            ctx.drawImage(img, x - imgW + 1, y, imgW, imgH);
+        }
+    }
+    // dibujar imagen
+    ctx.drawImage(img, x, y,imgW, imgH);
+    // cantidad para moverse
+    x += dx;
+}</pre>
+
+<p>Debajo esta el elemento {{HTMLElement("canvas")}} en el cual va la imagen se va ha desplazar. Nota que el ancho y el alto especificado aquí son las variables <code>CanvasXZSize</code> y <code>CanvasYSize</code>.</p>
+
+<pre class="brush: html">&lt;canvas id="canvas" width="800" height="200"&gt;&lt;/canvas&gt;</pre>
+
+<p>{{EmbedLiveSample("Un_panorama_en_bucle", "830", "230")}}</p>
+
+<h2 id="Other_examples" name="Other_examples">Otros ejemplos</h2>
+
+<dl>
+ <dt><a href="/es/docs/Web/API/Canvas_API/A_basic_ray-caster" title="/en-US/docs/Web/Guide/HTML/A_basic_ray-caster">Un ray-caster básico</a></dt>
+ <dd>Un buen ejemplo de como hacer animaciones usando como control el teclado.</dd>
+ <dt><a href="/es/docs/Web/API/Canvas_API/Tutorial/Advanced_animations">Animaciones avanzadas</a></dt>
+ <dd>Vamos a echar un vistazo a algunas técnicas de animación avanzadas y física en el próximo capítulo.</dd>
+</dl>
+
+<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Compositing", "Web/API/Canvas_API/Tutorial/Advanced_animations")}}</p>
diff --git a/files/es/web/api/canvas_api/tutorial/basic_usage/index.html b/files/es/web/api/canvas_api/tutorial/basic_usage/index.html
new file mode 100644
index 0000000000..ced215285a
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/basic_usage/index.html
@@ -0,0 +1,147 @@
+---
+title: Uso básico de Canvas
+slug: Web/API/Canvas_API/Tutorial/Basic_usage
+translation_of: Web/API/Canvas_API/Tutorial/Basic_usage
+original_slug: Web/Guide/HTML/Canvas_tutorial/Basic_usage
+---
+<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial", "Web/API/Canvas_API/Tutorial/Dibujando_formas")}}</div>
+
+<div class="summary">
+<p>Comenzamos este tutorial observando el elemento  {{HTMLElement("canvas")}}. Al final de esta página, sabrás como configurar el entorno 2D de canvas y habrás dibujado el primer ejemplo en tu navegador.</p>
+</div>
+
+<h2 id="El_elemento_&lt;canvas>">El elemento <code>&lt;canvas&gt;</code></h2>
+
+<pre class="brush: html">&lt;canvas id="tutorial" width="150" height="150"&gt;&lt;/canvas&gt;
+</pre>
+
+<p>A primera vista, un elemento {{HTMLElement("canvas")}} es parecido al elemento {{HTMLElement("img")}}, con la diferencia que este no tiene los atributos <code>src</code> y <code>alt</code>. El elemento <code>&lt;canvas&gt;</code> tiene solo dos atributos - {{htmlattrxref("width", "canvas")}} y {{htmlattrxref("height", "canvas")}}. Ambos son opcionales y pueden ser definidos usando propiedades <a href="/en-US/docs/DOM" rel="internal" title="en/DOM">DOM</a>. Cuando los atributos ancho y alto no estan especificados, el lienzo se inicializara con <strong>300 pixels</strong> ancho y <strong>150 pixels</strong> de alto. El elemento puede ser arbitrariamente redimensionado por CSS, pero durante el renderizado la imagen es escalada para ajustarse al tamaño de su layout. Si el tamaño del CSS no respeta el ratio del canvas inicial, este aparecerá distorsionado.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Si su renderizado se ve distorsionado, pruebe especificar los atributos width y height explícitamente en los atributos del <code>&lt;canvas&gt;</code> , y no usando CSS.</p>
+</div>
+
+<p>El atributo <a href="/es/docs/Web/HTML/Atributos_Globales/id">id</a> no está especificado para el elemento  <code>&lt;canvas&gt;</code> pero es uno de los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales de HTML</a> el cual puede ser aplicado a cualquier elemento HTML (como <a href="en-US/docs/Web/HTML/Global_attributes/class">class</a> por ejemplo). Siempre es buena idea proporcionar un <code>id</code> porque esto hace más fácil identificarlo en un script.</p>
+
+<p>El elemento <code>&lt;canvas&gt;</code> puede ser estilizado como a cualquier imagen normal (margin, border, background, etc). Estas reglas, sin embargo, no afectan a lo dibujado sobre el canvas. Mas adelante veremos cómo se hace esto en un <a href="en-US/docs/Web/API/Canvas_API/Tutorial/Applying_styles_and_colors">capítulo dedicado</a> en este tutorial. Cuando no tenemos reglas de estilo aplicadas al canvas, este será completamente transparente.</p>
+
+<div id="section_2">
+<h3 id="Contenido_alternativo">Contenido alternativo</h3>
+
+<p>El elemento &lt;canvas&gt; se diferencia de un tag {{HTMLElement("img")}} en que, como los elementos {{HTMLElement("video")}}, {{HTMLElement("audio")}} o {{HTMLElement("picture")}}, es fácil definir contenido alternativo (fallback content) para mostrarse en navegadores viejos que no soporten el elemento &lt;canvas&gt;, como versiones de Internet Explorer previas a la versión 9 o navegadores de texto. Siempre debes proporcionar contenido alternativo para mostrar en estos navegadores.</p>
+
+<p>Proporcionar contenido alternativo es muy explicito: solo debemos insertar el contenido alterno dentro del elemento &lt;canvas&gt;. Los navegadores que no soporten <code>&lt;canvas&gt;</code> ignoraran el contenedor y mostrarán el contenido indicado dentro de este. Navegadores que soporten <code>&lt;canvas&gt;</code> ignorarán el contenido en su interior (de las etiquetas), y mostrarán el canvas normalmente.</p>
+
+<p>Por ejemplo, podremos proporcionar un texto descriptivo del contenido del canvas o proveer una imagen estática del contenido rederizado. Nos podría quedar algo así:</p>
+
+<pre class="brush: html">&lt;canvas id="stockGraph" width="150" height="150"&gt;
+  current stock price: $3.15 +0.15
+&lt;/canvas&gt;
+
+&lt;canvas id="clock" width="150" height="150"&gt;
+  &lt;img src="images/clock.png" width="150" height="150" alt=""/&gt;
+&lt;/canvas&gt;
+</pre>
+
+<h2 id="Etiqueta_&lt;canvas>_requerida">Etiqueta <code>&lt;/canvas&gt;</code> requerida</h2>
+
+<p>De manera distinta al elemento {{HTMLElement("img")}}, el elemento {{HTMLElement("canvas")}} requiere cerrar la etiqueta  (<code>&lt;/canvas&gt;</code>).</p>
+
+<div class="note">
+<p><strong>Note:</strong> Aunque las versiones anteriores del navegador Safari de Apple no requeria el cierre de la etiqueta, la especificacion indica que es necesaria, asi que tu deberias incluir esta para asegurarte la compatibilidad. Aquellas versiones de Safari (anteriores versiones a 2.0) renderizaran el contenido de regreso agregandolo al canvas mismo a no ser que utilice trucos de CSS para enmascararlo. Afortunadamente, los usuarios de aquellas versiones de Safari son raros hoy en dia.</p>
+</div>
+
+<p>Si el contenido alternativo no se necesita, un simple <code>&lt;canvas id="foo" ...&gt;&lt;/canvas&gt;</code> es completamente compatible con todos los navegadores que soportan canvas.</p>
+
+<h2 id="El_contexto_de_renderización">El contexto de renderización</h2>
+
+<p>{{HTMLElement("canvas")}} crea un lienzo de dibujo fijado que expone uno o mas contextos renderizados, los cuales son usados para crear y manipular el contenido mostrado. Nos enfocaremos en renderizacion de contextos 2D. Otros contextos deberan proveer diferentes tipos de renderizaciones; por ejemplo, <a href="/en-US/docs/Web/WebGL" title="/en-US/docs/Web/WebGL">WebGL</a> usa un 3D contexto ("experimental-webgl") basado sobre <a class="external" href="http://www.khronos.org/opengles/" rel="external" title="http://en.wikipedia.org/wiki/OpenGL_ES">OpenGL ES</a>.</p>
+
+<p>El canvas esta inicialmente en blanco. Para mostrar alguna cosa, un script primero necesita acceder al contexto a renderizar y dibujar sobre este. El elemento  {{HTMLElement("canvas")}} tiene un <a href="/en-US/docs/Web/API/HTMLCanvasElement#Methods" title="/en-US/docs/Web/API/HTMLCanvasElement#Methods">method</a> llamado  <code>getContext()</code>, usado para obtener el contexto a renderizar y sus funciones de dibujo. <code>getContext()</code> toma un parametro, el tipo de contexto. Para graficos 2D, como los que cubre este tutorial, su especificacion es "2d".</p>
+
+<pre class="brush: js">var canvas = document.getElementById('tutorial');
+var ctx = canvas.getContext('2d');
+</pre>
+
+<p>La primera linea regresa el nodo DOM para el elemento {{HTMLElement("canvas")}} llamando al metodo  {{domxref("document.getElementById()")}}. Una vez tu tienes el elemento nodo, tu puedes acceder al contexto de dibujo usando su metodo <code>getContext()</code>.</p>
+
+<div id="section_5">
+<h2 id="Comprobando_soporte">Comprobando soporte</h2>
+
+<p>El contenido de regreso que es mostrado en navegadores los cuales no soportan {{HTMLElement("canvas")}}. Para los Scripts puede tambien comprobarse su soporte desde la programacion por un simple test para la presencia del metodo <code>getContext()</code>. Con un trozo de codigo parecido al que viene debajo:</p>
+
+<pre class="brush: js">var canvas = document.getElementById('tutorial');
+
+if (canvas.getContext){
+  var ctx = canvas.getContext('2d');
+  // drawing code here
+} else {
+  // canvas-unsupported code here
+}
+</pre>
+</div>
+</div>
+
+<h2 id="Un_esqueleto_de_plantilla">Un esqueleto de plantilla</h2>
+
+<p>Aqui esta una plantilla minimalista, la cual usaremos como punto de partida para posteriores ejemplos.</p>
+
+<pre class="brush: html">&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;Canvas tutorial&lt;/title&gt;
+    &lt;script type="text/javascript"&gt;
+      function draw(){
+        var canvas = document.getElementById('tutorial');
+        if (canvas.getContext){
+          var ctx = canvas.getContext('2d');
+        }
+      }
+    &lt;/script&gt;
+    &lt;style type="text/css"&gt;
+      canvas { border: 1px solid black; }
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body onload="draw();"&gt;
+    &lt;canvas id="tutorial" width="150" height="150"&gt;&lt;/canvas&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>El script incluye una funcion llamada draw(), la cual es ejecutada una vez finalizada la carga de la pagina; este esta hecho usando el evento load del documento. Esta funcion, o una parecida, podria tambien ser llamada usando {{domxref("window.setTimeout()")}}, {{domxref("window.setInterval()")}}, o cualquier otro manejador de evento, a lo largo de que la pagina esta siendo cargada la primera vez.</p>
+
+<p>Aqui esta como la plantilla se ve en acción:</p>
+
+<p>{{EmbedLiveSample("Un_esqueleto_de_plantilla", 160, 160)}}</p>
+
+<h2 id="Un_simple_ejemplo">Un simple ejemplo</h2>
+
+<p>Para comenzar, daremos un vistazo a un simple ejemplo que dibuja dos rectangulos que se intersectan, uno de los cuales tiene alpha transparencia. Exploraremos como esto trabaja en mas detalle en posteriores ejemplos.</p>
+
+<pre class="brush: html">&lt;html&gt;
+ &lt;head&gt;
+  &lt;script type="application/javascript"&gt;
+    function draw() {
+      var canvas = document.getElementById("canvas");
+      if (canvas.getContext) {
+        var ctx = canvas.getContext("2d");
+
+        ctx.fillStyle = "rgb(200,0,0)";
+        ctx.fillRect (10, 10, 55, 50);
+
+        ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
+        ctx.fillRect (30, 30, 55, 50);
+      }
+    }
+  &lt;/script&gt;
+ &lt;/head&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>Este ejemplo quedaría así:</p>
+
+<p>{{EmbedLiveSample("Un_simple_ejemplo", 160, 160, "https://mdn.mozillademos.org/files/228/canvas_ex1.png")}}</p>
+
+<p>{{PreviousNext("Web/Guide/HTML/Canvas_tutorial", "Web/Guide/HTML/Canvas_tutorial/Dibujando_formas")}}</p>
diff --git a/files/es/web/api/canvas_api/tutorial/compositing/ejemplo/index.html b/files/es/web/api/canvas_api/tutorial/compositing/ejemplo/index.html
deleted file mode 100644
index b85b83238c..0000000000
--- a/files/es/web/api/canvas_api/tutorial/compositing/ejemplo/index.html
+++ /dev/null
@@ -1,295 +0,0 @@
----
-title: Ejemplo de composición
-slug: Web/API/Canvas_API/Tutorial/Compositing/Ejemplo
-tags:
-  - Canvas
-  - Ejemplo
-  - HTML
-  - HTML5
-  - Tutorial
-  - graficos
-translation_of: Web/API/Canvas_API/Tutorial/Compositing/Example
----
-<div>{{CanvasSidebar}}</div>
-
-<p>Este programa de ejemplo muestra una cantidad de <a href="/es/docs/Web/API/CanvasRenderingContext2D.globalCompositeOperation">operaciones de composición</a>. La salida se ve así:</p>
-
-<p>{{EmbedLiveSample("Ejemplo_de_composición", "100%", 7250)}}</p>
-
-<h2 id="Ejemplo_de_composición">Ejemplo de composición</h2>
-
-<p>Este código establece los valores globales utilizados por el resto del programa.</p>
-
-<pre class="brush: js">var canvas1 = document.createElement("canvas");
-var canvas2 = document.createElement("canvas");
-var gco = [ 'source-over','source-in','source-out','source-atop',
-            'destination-over','destination-in','destination-out','destination-atop',
-            'lighter', 'copy','xor', 'multiply', 'screen', 'overlay', 'darken',
-            'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light',
-            'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'
-          ].reverse();
-var gcoText = [
-'Esta es la configuración predeterminada y dibuja nuevas formas sobre el contenido del canvas existente.',
-'La nueva forma se dibuja solo donde la nueva forma y el canvas de destino se superponen. Todo lo demás se hace transparente.',
-'La nueva forma se dibuja donde no se superpone al contenido del canvas existente.',
-'La nueva forma solo se dibuja donde se solapa con el contenido del canvas existente.',
-'Se dibujan nuevas formas detrás del contenido del canvas existente',
-'El contenido del canvas existente se conserva donde la nueva forma y el contenido del canvas existente se superponen. Todo lo demás se hace transparente.',
-'El contenido existente se mantiene donde no se superpone a la nueva forma.',
-'El canvas existente solo se conserva donde se solapa con la nueva forma. La nueva forma se dibuja detrás del contenido del canvas.',
-'Donde ambas formas se superponen, el color se determina agregando valores de color.',
-'Solo se muestra la nueva forma.',
-'Las formas se hacen transparentes donde ambas se superponen y se dibujan de manera normal en cualquier otro lugar.',
-'Los píxeles de la capa superior se multiplican con el píxel correspondiente de la capa inferior. El resultado es una imagen más oscura. ',
-'Los píxeles están invertidos, multiplicados e invertidos nuevamente. Una imagen más clara es el resultado (opuesto a multiplicar).',
-'Una combinación de multiplicar y pantalla. Las partes oscuras en la capa base se oscurecen y las partes claras se vuelven más claras.',
-'Conserva los píxeles más oscuros de ambas capas.',
-'Conserva los píxeles más claros de ambas capas.',
-'Divide la capa inferior por la capa superior invertida.',
-'Divide la capa inferior invertida por la capa superior, y luego invierte el resultado.',
-'Una combinación de multiplicar y pantalla como superposición, pero con la parte superior y la capa inferior intercambiado.',
-'Una versión más suave de la luz dura. Negro puro o blanco no da como resultado negro o blanco puro.',
-'Resta la capa inferior de la capa superior o viceversa para obtener siempre un valor positivo.',
-'Al igual que la diferencia, pero con menor contraste.',
-'Conserva la luma y el croma de la capa inferior, mientras adopta el tono de la capa superior.',
-'Conserva la luma y el tono de la capa inferior, mientras adopta el croma de la capa superior.',
-'Conserva la luma de la capa inferior, mientras adopta el matiz y el croma de la capa superior.',
-'Conserva el tono y el croma de la capa inferior, mientras adopta la luma de la capa superior.'
-          ].reverse();
-var width = 320;
-var height = 340;
-</pre>
-
-<h3 id="Programa_principal">Programa principal</h3>
-
-<p>Cuando se carga la página, este código se ejecuta para configurar y ejecutar el ejemplo:</p>
-
-<pre class="brush: js">window.onload = function() {
-    // lum en sRGB
-    var lum = {
-        r: 0.33,
-        g: 0.33,
-        b: 0.33
-    };
-    // redimensionar canvas
-    canvas1.width = width;
-    canvas1.height = height;
-    canvas2.width = width;
-    canvas2.height = height;
-    lightMix()
-    colorSphere();
-    runComposite();
-    return;
-};
-</pre>
-
-<p>Y este código, <code>runComposite()</code>, maneja la mayor parte del trabajo, dependiendo de una serie de funciones de utilidad para hacer las partes difíciles.</p>
-
-<pre class="brush: js">function createCanvas() {
-    var canvas = document.createElement("canvas");
-    canvas.style.background = "url("+op_8x8.data+")";
-    canvas.style.border = "1px solid #000";
-    canvas.style.margin = "5px";
-    canvas.width = width/2;
-    canvas.height = height/2;
-    return canvas;
-}
-
-function runComposite() {
-    var dl = document.createElement("dl");
-    document.body.appendChild(dl);
-    while(gco.length) {
-        var pop = gco.pop();
-        var dt = document.createElement("dt");
-        dt.textContent = pop;
-        dl.appendChild(dt);
-        var dd = document.createElement("dd");
-        var p = document.createElement("p");
-        p.textContent = gcoText.pop();
-        dd.appendChild(p);
-
-        var canvasToDrawOn = createCanvas();
-        var canvasToDrawFrom = createCanvas();
-        var canvasToDrawResult = createCanvas();
-
-        var ctx = canvasToDrawResult.getContext('2d');
-        ctx.clearRect(0, 0, width, height)
-        ctx.save();
-        ctx.drawImage(canvas1, 0, 0, width/2, height/2);
-        ctx.globalCompositeOperation = pop;
-        ctx.drawImage(canvas2, 0, 0, width/2, height/2);
-        ctx.globalCompositeOperation = "source-over";
-        ctx.fillStyle = "rgba(0,0,0,0.8)";
-        ctx.fillRect(0, height/2 - 20, width/2, 20);
-        ctx.fillStyle = "#FFF";
-        ctx.font = "14px arial";
-        ctx.fillText(pop, 5, height/2 - 5);
-        ctx.restore();
-
-        var ctx = canvasToDrawOn.getContext('2d');
-        ctx.clearRect(0, 0, width, height)
-        ctx.save();
-        ctx.drawImage(canvas1, 0, 0, width/2, height/2);
-        ctx.fillStyle = "rgba(0,0,0,0.8)";
-        ctx.fillRect(0, height/2 - 20, width/2, 20);
-        ctx.fillStyle = "#FFF";
-        ctx.font = "14px arial";
-        ctx.fillText('existing content', 5, height/2 - 5);
-        ctx.restore();
-
-        var ctx = canvasToDrawFrom.getContext('2d');
-        ctx.clearRect(0, 0, width, height)
-        ctx.save();
-        ctx.drawImage(canvas2, 0, 0, width/2, height/2);
-        ctx.fillStyle = "rgba(0,0,0,0.8)";
-        ctx.fillRect(0, height/2 - 20, width/2, 20);
-        ctx.fillStyle = "#FFF";
-        ctx.font = "14px arial";
-        ctx.fillText('new content', 5, height/2 - 5);
-        ctx.restore();
-
-        dd.appendChild(canvasToDrawOn);
-        dd.appendChild(canvasToDrawFrom);
-        dd.appendChild(canvasToDrawResult);
-
-        dl.appendChild(dd);
-    }
-};
-</pre>
-
-<h3 id="Funciones_de_utilidad">Funciones de utilidad</h3>
-
-<p>El programa se basa en una serie de funciones de utilidad.</p>
-
-<pre class="brush: js">var lightMix = function() {
-    var ctx = canvas2.getContext("2d");
-    ctx.save();
-    ctx.globalCompositeOperation = "lighter";
-    ctx.beginPath();
-    ctx.fillStyle = "rgba(255,0,0,1)";
-    ctx.arc(100, 200, 100, Math.PI*2, 0, false);
-    ctx.fill()
-    ctx.beginPath();
-    ctx.fillStyle = "rgba(0,0,255,1)";
-    ctx.arc(220, 200, 100, Math.PI*2, 0, false);
-    ctx.fill()
-    ctx.beginPath();
-    ctx.fillStyle = "rgba(0,255,0,1)";
-    ctx.arc(160, 100, 100, Math.PI*2, 0, false);
-    ctx.fill();
-    ctx.restore();
-    ctx.beginPath();
-    ctx.fillStyle = "#f00";
-    ctx.fillRect(0,0,30,30)
-    ctx.fill();
-};
-</pre>
-
-<pre class="brush: js">var colorSphere = function(element) {
-    var ctx = canvas1.getContext("2d");
-    var width = 360;
-    var halfWidth = width / 2;
-    var rotate = (1 / 360) * Math.PI * 2; // por grado
-    var offset = 0; // scrollbar offset
-    var oleft = -20;
-    var otop = -20;
-    for (var n = 0; n &lt;= 359; n ++) {
-        var gradient = ctx.createLinearGradient(oleft + halfWidth, otop, oleft + halfWidth, otop + halfWidth);
-        var color = Color.HSV_RGB({ H: (n + 300) % 360, S: 100, V: 100 });
-        gradient.addColorStop(0, "rgba(0,0,0,0)");
-        gradient.addColorStop(0.7, "rgba("+color.R+","+color.G+","+color.B+",1)");
-        gradient.addColorStop(1, "rgba(255,255,255,1)");
-        ctx.beginPath();
-        ctx.moveTo(oleft + halfWidth, otop);
-        ctx.lineTo(oleft + halfWidth, otop + halfWidth);
-        ctx.lineTo(oleft + halfWidth + 6, otop);
-        ctx.fillStyle = gradient;
-        ctx.fill();
-        ctx.translate(oleft + halfWidth, otop + halfWidth);
-        ctx.rotate(rotate);
-        ctx.translate(-(oleft + halfWidth), -(otop + halfWidth));
-    }
-    ctx.beginPath();
-    ctx.fillStyle = "#00f";
-    ctx.fillRect(15,15,30,30)
-    ctx.fill();
-    return ctx.canvas;
-};
-</pre>
-
-<pre class="brush: js">// HSV (1978) = H: Hue / S: Saturation / V: Value
-Color = {};
-Color.HSV_RGB = function (o) {
-    var H = o.H / 360,
-        S = o.S / 100,
-        V = o.V / 100,
-        R, G, B;
-    var A, B, C, D;
-    if (S == 0) {
-        R = G = B = Math.round(V * 255);
-    } else {
-        if (H &gt;= 1) H = 0;
-        H = 6 * H;
-        D = H - Math.floor(H);
-        A = Math.round(255 * V * (1 - S));
-        B = Math.round(255 * V * (1 - (S * D)));
-        C = Math.round(255 * V * (1 - (S * (1 - D))));
-        V = Math.round(255 * V);
-        switch (Math.floor(H)) {
-            case 0:
-                R = V;
-                G = C;
-                B = A;
-                break;
-            case 1:
-                R = B;
-                G = V;
-                B = A;
-                break;
-            case 2:
-                R = A;
-                G = V;
-                B = C;
-                break;
-            case 3:
-                R = A;
-                G = B;
-                B = V;
-                break;
-            case 4:
-                R = C;
-                G = A;
-                B = V;
-                break;
-            case 5:
-                R = V;
-                G = A;
-                B = B;
-                break;
-        }
-    }
-    return {
-        R: R,
-        G: G,
-        B: B
-    };
-};
-
-var createInterlace = function (size, color1, color2) {
-    var proto = document.createElement("canvas").getContext("2d");
-    proto.canvas.width = size * 2;
-    proto.canvas.height = size * 2;
-    proto.fillStyle = color1; // top-left
-    proto.fillRect(0, 0, size, size);
-    proto.fillStyle = color2; // top-right
-    proto.fillRect(size, 0, size, size);
-    proto.fillStyle = color2; // bottom-left
-    proto.fillRect(0, size, size, size);
-    proto.fillStyle = color1; // bottom-right
-    proto.fillRect(size, size, size, size);
-    var pattern = proto.createPattern(proto.canvas, "repeat");
-    pattern.data = proto.canvas.toDataURL();
-    return pattern;
-};
-
-var op_8x8 = createInterlace(8, "#FFF", "#eee");</pre>
diff --git a/files/es/web/api/canvas_api/tutorial/compositing/example/index.html b/files/es/web/api/canvas_api/tutorial/compositing/example/index.html
new file mode 100644
index 0000000000..c0d0ae3813
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/compositing/example/index.html
@@ -0,0 +1,296 @@
+---
+title: Ejemplo de composición
+slug: Web/API/Canvas_API/Tutorial/Compositing/Example
+tags:
+  - Canvas
+  - Ejemplo
+  - HTML
+  - HTML5
+  - Tutorial
+  - graficos
+translation_of: Web/API/Canvas_API/Tutorial/Compositing/Example
+original_slug: Web/API/Canvas_API/Tutorial/Compositing/Ejemplo
+---
+<div>{{CanvasSidebar}}</div>
+
+<p>Este programa de ejemplo muestra una cantidad de <a href="/es/docs/Web/API/CanvasRenderingContext2D.globalCompositeOperation">operaciones de composición</a>. La salida se ve así:</p>
+
+<p>{{EmbedLiveSample("Ejemplo_de_composición", "100%", 7250)}}</p>
+
+<h2 id="Ejemplo_de_composición">Ejemplo de composición</h2>
+
+<p>Este código establece los valores globales utilizados por el resto del programa.</p>
+
+<pre class="brush: js">var canvas1 = document.createElement("canvas");
+var canvas2 = document.createElement("canvas");
+var gco = [ 'source-over','source-in','source-out','source-atop',
+            'destination-over','destination-in','destination-out','destination-atop',
+            'lighter', 'copy','xor', 'multiply', 'screen', 'overlay', 'darken',
+            'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light',
+            'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'
+          ].reverse();
+var gcoText = [
+'Esta es la configuración predeterminada y dibuja nuevas formas sobre el contenido del canvas existente.',
+'La nueva forma se dibuja solo donde la nueva forma y el canvas de destino se superponen. Todo lo demás se hace transparente.',
+'La nueva forma se dibuja donde no se superpone al contenido del canvas existente.',
+'La nueva forma solo se dibuja donde se solapa con el contenido del canvas existente.',
+'Se dibujan nuevas formas detrás del contenido del canvas existente',
+'El contenido del canvas existente se conserva donde la nueva forma y el contenido del canvas existente se superponen. Todo lo demás se hace transparente.',
+'El contenido existente se mantiene donde no se superpone a la nueva forma.',
+'El canvas existente solo se conserva donde se solapa con la nueva forma. La nueva forma se dibuja detrás del contenido del canvas.',
+'Donde ambas formas se superponen, el color se determina agregando valores de color.',
+'Solo se muestra la nueva forma.',
+'Las formas se hacen transparentes donde ambas se superponen y se dibujan de manera normal en cualquier otro lugar.',
+'Los píxeles de la capa superior se multiplican con el píxel correspondiente de la capa inferior. El resultado es una imagen más oscura. ',
+'Los píxeles están invertidos, multiplicados e invertidos nuevamente. Una imagen más clara es el resultado (opuesto a multiplicar).',
+'Una combinación de multiplicar y pantalla. Las partes oscuras en la capa base se oscurecen y las partes claras se vuelven más claras.',
+'Conserva los píxeles más oscuros de ambas capas.',
+'Conserva los píxeles más claros de ambas capas.',
+'Divide la capa inferior por la capa superior invertida.',
+'Divide la capa inferior invertida por la capa superior, y luego invierte el resultado.',
+'Una combinación de multiplicar y pantalla como superposición, pero con la parte superior y la capa inferior intercambiado.',
+'Una versión más suave de la luz dura. Negro puro o blanco no da como resultado negro o blanco puro.',
+'Resta la capa inferior de la capa superior o viceversa para obtener siempre un valor positivo.',
+'Al igual que la diferencia, pero con menor contraste.',
+'Conserva la luma y el croma de la capa inferior, mientras adopta el tono de la capa superior.',
+'Conserva la luma y el tono de la capa inferior, mientras adopta el croma de la capa superior.',
+'Conserva la luma de la capa inferior, mientras adopta el matiz y el croma de la capa superior.',
+'Conserva el tono y el croma de la capa inferior, mientras adopta la luma de la capa superior.'
+          ].reverse();
+var width = 320;
+var height = 340;
+</pre>
+
+<h3 id="Programa_principal">Programa principal</h3>
+
+<p>Cuando se carga la página, este código se ejecuta para configurar y ejecutar el ejemplo:</p>
+
+<pre class="brush: js">window.onload = function() {
+    // lum en sRGB
+    var lum = {
+        r: 0.33,
+        g: 0.33,
+        b: 0.33
+    };
+    // redimensionar canvas
+    canvas1.width = width;
+    canvas1.height = height;
+    canvas2.width = width;
+    canvas2.height = height;
+    lightMix()
+    colorSphere();
+    runComposite();
+    return;
+};
+</pre>
+
+<p>Y este código, <code>runComposite()</code>, maneja la mayor parte del trabajo, dependiendo de una serie de funciones de utilidad para hacer las partes difíciles.</p>
+
+<pre class="brush: js">function createCanvas() {
+    var canvas = document.createElement("canvas");
+    canvas.style.background = "url("+op_8x8.data+")";
+    canvas.style.border = "1px solid #000";
+    canvas.style.margin = "5px";
+    canvas.width = width/2;
+    canvas.height = height/2;
+    return canvas;
+}
+
+function runComposite() {
+    var dl = document.createElement("dl");
+    document.body.appendChild(dl);
+    while(gco.length) {
+        var pop = gco.pop();
+        var dt = document.createElement("dt");
+        dt.textContent = pop;
+        dl.appendChild(dt);
+        var dd = document.createElement("dd");
+        var p = document.createElement("p");
+        p.textContent = gcoText.pop();
+        dd.appendChild(p);
+
+        var canvasToDrawOn = createCanvas();
+        var canvasToDrawFrom = createCanvas();
+        var canvasToDrawResult = createCanvas();
+
+        var ctx = canvasToDrawResult.getContext('2d');
+        ctx.clearRect(0, 0, width, height)
+        ctx.save();
+        ctx.drawImage(canvas1, 0, 0, width/2, height/2);
+        ctx.globalCompositeOperation = pop;
+        ctx.drawImage(canvas2, 0, 0, width/2, height/2);
+        ctx.globalCompositeOperation = "source-over";
+        ctx.fillStyle = "rgba(0,0,0,0.8)";
+        ctx.fillRect(0, height/2 - 20, width/2, 20);
+        ctx.fillStyle = "#FFF";
+        ctx.font = "14px arial";
+        ctx.fillText(pop, 5, height/2 - 5);
+        ctx.restore();
+
+        var ctx = canvasToDrawOn.getContext('2d');
+        ctx.clearRect(0, 0, width, height)
+        ctx.save();
+        ctx.drawImage(canvas1, 0, 0, width/2, height/2);
+        ctx.fillStyle = "rgba(0,0,0,0.8)";
+        ctx.fillRect(0, height/2 - 20, width/2, 20);
+        ctx.fillStyle = "#FFF";
+        ctx.font = "14px arial";
+        ctx.fillText('existing content', 5, height/2 - 5);
+        ctx.restore();
+
+        var ctx = canvasToDrawFrom.getContext('2d');
+        ctx.clearRect(0, 0, width, height)
+        ctx.save();
+        ctx.drawImage(canvas2, 0, 0, width/2, height/2);
+        ctx.fillStyle = "rgba(0,0,0,0.8)";
+        ctx.fillRect(0, height/2 - 20, width/2, 20);
+        ctx.fillStyle = "#FFF";
+        ctx.font = "14px arial";
+        ctx.fillText('new content', 5, height/2 - 5);
+        ctx.restore();
+
+        dd.appendChild(canvasToDrawOn);
+        dd.appendChild(canvasToDrawFrom);
+        dd.appendChild(canvasToDrawResult);
+
+        dl.appendChild(dd);
+    }
+};
+</pre>
+
+<h3 id="Funciones_de_utilidad">Funciones de utilidad</h3>
+
+<p>El programa se basa en una serie de funciones de utilidad.</p>
+
+<pre class="brush: js">var lightMix = function() {
+    var ctx = canvas2.getContext("2d");
+    ctx.save();
+    ctx.globalCompositeOperation = "lighter";
+    ctx.beginPath();
+    ctx.fillStyle = "rgba(255,0,0,1)";
+    ctx.arc(100, 200, 100, Math.PI*2, 0, false);
+    ctx.fill()
+    ctx.beginPath();
+    ctx.fillStyle = "rgba(0,0,255,1)";
+    ctx.arc(220, 200, 100, Math.PI*2, 0, false);
+    ctx.fill()
+    ctx.beginPath();
+    ctx.fillStyle = "rgba(0,255,0,1)";
+    ctx.arc(160, 100, 100, Math.PI*2, 0, false);
+    ctx.fill();
+    ctx.restore();
+    ctx.beginPath();
+    ctx.fillStyle = "#f00";
+    ctx.fillRect(0,0,30,30)
+    ctx.fill();
+};
+</pre>
+
+<pre class="brush: js">var colorSphere = function(element) {
+    var ctx = canvas1.getContext("2d");
+    var width = 360;
+    var halfWidth = width / 2;
+    var rotate = (1 / 360) * Math.PI * 2; // por grado
+    var offset = 0; // scrollbar offset
+    var oleft = -20;
+    var otop = -20;
+    for (var n = 0; n &lt;= 359; n ++) {
+        var gradient = ctx.createLinearGradient(oleft + halfWidth, otop, oleft + halfWidth, otop + halfWidth);
+        var color = Color.HSV_RGB({ H: (n + 300) % 360, S: 100, V: 100 });
+        gradient.addColorStop(0, "rgba(0,0,0,0)");
+        gradient.addColorStop(0.7, "rgba("+color.R+","+color.G+","+color.B+",1)");
+        gradient.addColorStop(1, "rgba(255,255,255,1)");
+        ctx.beginPath();
+        ctx.moveTo(oleft + halfWidth, otop);
+        ctx.lineTo(oleft + halfWidth, otop + halfWidth);
+        ctx.lineTo(oleft + halfWidth + 6, otop);
+        ctx.fillStyle = gradient;
+        ctx.fill();
+        ctx.translate(oleft + halfWidth, otop + halfWidth);
+        ctx.rotate(rotate);
+        ctx.translate(-(oleft + halfWidth), -(otop + halfWidth));
+    }
+    ctx.beginPath();
+    ctx.fillStyle = "#00f";
+    ctx.fillRect(15,15,30,30)
+    ctx.fill();
+    return ctx.canvas;
+};
+</pre>
+
+<pre class="brush: js">// HSV (1978) = H: Hue / S: Saturation / V: Value
+Color = {};
+Color.HSV_RGB = function (o) {
+    var H = o.H / 360,
+        S = o.S / 100,
+        V = o.V / 100,
+        R, G, B;
+    var A, B, C, D;
+    if (S == 0) {
+        R = G = B = Math.round(V * 255);
+    } else {
+        if (H &gt;= 1) H = 0;
+        H = 6 * H;
+        D = H - Math.floor(H);
+        A = Math.round(255 * V * (1 - S));
+        B = Math.round(255 * V * (1 - (S * D)));
+        C = Math.round(255 * V * (1 - (S * (1 - D))));
+        V = Math.round(255 * V);
+        switch (Math.floor(H)) {
+            case 0:
+                R = V;
+                G = C;
+                B = A;
+                break;
+            case 1:
+                R = B;
+                G = V;
+                B = A;
+                break;
+            case 2:
+                R = A;
+                G = V;
+                B = C;
+                break;
+            case 3:
+                R = A;
+                G = B;
+                B = V;
+                break;
+            case 4:
+                R = C;
+                G = A;
+                B = V;
+                break;
+            case 5:
+                R = V;
+                G = A;
+                B = B;
+                break;
+        }
+    }
+    return {
+        R: R,
+        G: G,
+        B: B
+    };
+};
+
+var createInterlace = function (size, color1, color2) {
+    var proto = document.createElement("canvas").getContext("2d");
+    proto.canvas.width = size * 2;
+    proto.canvas.height = size * 2;
+    proto.fillStyle = color1; // top-left
+    proto.fillRect(0, 0, size, size);
+    proto.fillStyle = color2; // top-right
+    proto.fillRect(size, 0, size, size);
+    proto.fillStyle = color2; // bottom-left
+    proto.fillRect(0, size, size, size);
+    proto.fillStyle = color1; // bottom-right
+    proto.fillRect(size, size, size, size);
+    var pattern = proto.createPattern(proto.canvas, "repeat");
+    pattern.data = proto.canvas.toDataURL();
+    return pattern;
+};
+
+var op_8x8 = createInterlace(8, "#FFF", "#eee");</pre>
diff --git a/files/es/web/api/canvas_api/tutorial/drawing_shapes/index.html b/files/es/web/api/canvas_api/tutorial/drawing_shapes/index.html
new file mode 100644
index 0000000000..8a3cf9b199
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/drawing_shapes/index.html
@@ -0,0 +1,514 @@
+---
+title: Dibujando formas con  canvas
+slug: Web/API/Canvas_API/Tutorial/Drawing_shapes
+tags:
+  - Canvas
+  - HTML
+  - HTML Canvas
+  - HTML5
+  - Intermedio
+  - Tutorial
+  - graficos
+translation_of: Web/API/Canvas_API/Tutorial/Drawing_shapes
+original_slug: Web/Guide/HTML/Canvas_tutorial/Dibujando_formas
+---
+<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Basic_usage", "Web/API/Canvas_API/Tutorial/Applying_styles_and_colors")}}</div>
+
+<div class="summary">
+<p>Ahora que hemos preparado nuestro <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_usage">entorno canvas</a>, podemos entrar en detalles de como dibujar en el canvas. Al final de este artículo, habrás aprendido  como dibujar rectángulos, triángulos, líneas, arcos y curvas, dándote familiaridad con algunas figuras básicas. Trabajar con rutas es esencial cuando dibujamos objetos sobre el canvas y veremos como se puede hacer eso.</p>
+</div>
+
+<h2 id="La_cuadrícula">La cuadrícula</h2>
+
+<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/224/Canvas_default_grid.png" style="float: right; height: 220px; width: 220px;">Antes de que podamos empezar a dibujar, necesitamos hablar sobre la cuadrícula del canvas o el <strong>espacio de coordenadas</strong>. La plantilla HTML de la página anterior tenía un elemento canvas con un 'height' y un 'width' de 150 píxeles. A la derecha, puedes ver este canvas con la cuadrícula por defecto superpuesta. Normalmente una unidad en la cuadrícula corresponde a un píxel en el elemento canvas. El origen de esta cuadrícula está posicionado en la esquina superior izquierda (coordenada (0,0)). Todos los elementos estan posicionados de manera relativa a este punto, así que la posición de la esquina superior izquierda del cuadrado azul es de 'x' pixeles desde la izquierda y 'y' pixeles desde arriba (coordenada (x,y)). Mas tarde en este tutorial veremos como trasladar el punto de origen a una posicion diferente, girar la cuadrícula e incluso darle una escala diferente. Por ahora nos dedicaremos a lo mas común.</p>
+
+<h2 id="Dibujando_rectángulos">Dibujando rectángulos</h2>
+
+<p>A diferencia de <a href="/en-US/docs/SVG" rel="internal" title="en/SVG">SVG</a>, {{HTMLElement("canvas")}} solo soporta una forma primitiva: rectangulos. Todas las otras formas deben ser creadas por la combinación de uno o más trazos, listas de puntos conectados por líneas. Afortunadamente, tenemos una variedad de funciones para dibujar trazos  que hacen posible componer formas muy complejas.</p>
+
+<div id="section_3">
+<p>Primero veamos el rectángulo. Aquí hay tres funciones que podemos usar en el canvas para dibujarlos:</p>
+
+<dl>
+ <dt><code>fillRect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
+ <dd>Dibuja un rectángulo relleno.</dd>
+ <dt><code>strokeRect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
+ <dd>Dibuja el contorno de un rectángulo.</dd>
+ <dt><code>clearRect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
+ <dd>Borra un área rectangular especificada, dejándola totalmente transparente.</dd>
+</dl>
+
+<p>Cada una de estas tres funciones toma los mismos parámetros. X e Y especifican la posición del canvas (en relación con el origen) desde la esquina superior izquierda del rectángulo. Tambien especifica los parámetros de anchura y altura que proporcionan el tamaño del rectángulo.</p>
+
+<p>A continuación se muestra la función draw() de la página anterior, pero ahora haciendo uso de estas tres funciones.</p>
+
+<h3 id="Ejemplo_de_forma_rectangular">Ejemplo de forma rectangular</h3>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext) {
+    var ctx = canvas.getContext('2d');
+
+    ctx.fillRect(25,25,100,100);
+    ctx.clearRect(45,45,60,60);
+    ctx.strokeRect(50,50,50,50);
+  }
+}</pre>
+
+<p>El resultado de este ejemplo se muestra a continuación.</p>
+
+<p>{{EmbedLiveSample("Rectangular_shape_example", 160, 160, "https://mdn.mozillademos.org/files/245/Canvas_rect.png")}}</p>
+
+<p>La función fillRect() dibuja un cuadrado grande negro de 100 píxeles en cada lado. La función clearRect() luego borra un cuadrado de 60x60 píxeles del centro, y luego strokeRect() es llamado para crear un contorno rectangular de 50x50 píxeles dentro del cuadrado borrado.</p>
+
+<p>En las próximas páginas veremos dos métodos alternativos para clearRect(), y también veremos cómo cambiar el color y el trazo de diferentes formas.</p>
+
+<p>A diferencia de las funciones de trazo que veremos en la próxima sección, las tres funciones del rectángulo dibujan inmediatamente en el canvas.</p>
+
+<h2 id="Dibujando_trazos">Dibujando trazos</h2>
+
+<p>Crear formas mediante trazos requiere algunos pasos adicionales.</p>
+
+<ol>
+ <li>Primero, se crea el trazo.</li>
+ <li>A continuación, se usan <a href="/es/docs/Web/API/CanvasRenderingContext2D#Paths">comandos de dibujo</a> para dibujar dentro del trazo.</li>
+ <li>Después, se cierra el trazo.</li>
+ <li>Una vez el trazo ha sido creado, se le puede dar contorno o relleno para renderizarlo.</li>
+</ol>
+
+<p>Estas son las funciones que se usan para llevar a cabo estos pasos:</p>
+
+<dl>
+ <dt><code>beginPath()</code></dt>
+ <dd>Crea un nuevo trazo. Una vez creado, los comandos de dibujo futuros son aplicados dentro del trazo y usados para construir el nuevo trazo hacia arriba.</dd>
+ <dt><code>closePath()</code></dt>
+ <dd>Cierra el trazo de tal forma que los comandos de dibujo futuros son, una vez más redireccionados al contexto.</dd>
+ <dt><code>stroke()</code></dt>
+ <dd>Dibuja el contorno de la forma.</dd>
+ <dt><code>fill()</code></dt>
+ <dd>Dibuja una forma solida rellenando el área del trazo.</dd>
+</dl>
+
+<p>El primer paso para crear un trazo es llamar la función <code>beginPath()</code>. Internamente, los trazos son guardados como una lista de subtrazos (lineas, arcos, etc) los cuales juntos crean una forma. Todo tiempo que sea llamado este método la lista es reseteada y podemos empezar a dibujar nuevas formas.</p>
+
+<div class="note"><strong>Nota:</strong> Cuando el trazo actual este vacio, como aparece inmediatamente despues de llamar la función <code>beginPath()</code>, o en un canvas nuevo, el primer comando para la construcción del trazo es siempre tratada como un <code>moveTo()</code>, independientemente de cual es el trazo actual. Por esta razón casi siempre querrás específicamente setear tu posición de inicio despues de resetear un trazo.</div>
+
+<p>El segundo paso es llamar los métodos que específican los trazos a crear. Los veremos en seguida.</p>
+
+<p>El tercero, y un paso opcional, es llamar a la función <code>closePath()</code>. Este método trata de cerrar la forma dibujando una linea recta desde el punto actual al inicio. Si la forma ya ha sido cerrada o hay solamente un punto en la lista, la función hace nada.</p>
+
+<div class="note"><strong>Nota:</strong> Cuando llamas a la función <code>fill()</code>, cualquier forma abierta es cerrada automaticamente, de tal forma que no tendrás que llamar a la función <code>closePath()</code>. Este no es el caso cuando llamas a la función <code>stroke()</code>.</div>
+
+<h3 id="Dibujando_un_triangulo">Dibujando un triangulo</h3>
+
+<p>Por ejemplo, el código para dibujar un triangulo luciría como el siguiente:</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext){
+    var ctx = canvas.getContext('2d');
+
+    ctx.beginPath();
+    ctx.moveTo(75,50);
+    ctx.lineTo(100,75);
+    ctx.lineTo(100,25);
+    ctx.closePath();
+    ctx.fill();
+  }
+}
+</pre>
+
+<p>El resultado lucirá así:</p>
+
+<p>{{EmbedLiveSample("Drawing_a_triangle", 160, 160)}}</p>
+
+<h3 id="Moviendo_la_pluma">Moviendo la pluma</h3>
+
+<p>Una función muy útil, la cual realmente no dibuja algo pero convierte parte de la lista de trazos descrita arriba, es la función <code>moveTo()</code>. Puedes, probablemente, pensar mejor de esta como levantar el lápiz o la pluma de un punto en un pedazo de papel y ponerlo en el siguiente punto.</p>
+
+<dl>
+ <dt><code>moveTo(<em>x</em>, <em>y</em>)</code></dt>
+ <dd>Mueve la pluma a las coordenadas específicadas por <code>x</code> e <code>y</code>.</dd>
+</dl>
+
+<p>Cuando el canvas es inicializado ó la función <code>beginPath()</code> es llamada, querrás usar la función <code>moveTo()</code> para colocar el punto de inicio en alguna otra parte. Podríamos usar <code>moveTo()</code> para dibujar trazos sin conectar. Toma un vistazo a la cara sonriente de abajo. He marcado los lugares donde use el método <code>moveTo()</code> (las líneas rojas).</p>
+
+<p>Para intentar esto por tí mismo, puedes usar el pequeño código de abajo. Solo pégalo dentro de la función <code>draw()</code> que vimos antes.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext){
+    var ctx = canvas.getContext('2d');
+
+    ctx.beginPath();
+    ctx.arc(75,75,50,0,Math.PI*2,true); // Círculo externo
+    ctx.moveTo(110,75);
+    ctx.arc(75,75,35,0,Math.PI,false);   // Boca (contra reloj)
+    ctx.moveTo(65,65);
+    ctx.arc(60,65,5,0,Math.PI*2,true);  // Ojo izquierdo
+    ctx.moveTo(95,65);
+    ctx.arc(90,65,5,0,Math.PI*2,true);  // Ojo derecho
+    ctx.stroke();
+  }
+}
+</pre>
+
+<p>El resultado luce así:</p>
+
+<p>{{EmbedLiveSample("Moving_the_pen", 160, 160, "https://mdn.mozillademos.org/files/252/Canvas_smiley.png")}}</p>
+
+<p>Si quisieras ver las líneas conectadas, puedes remover las líneas de código que llaman <code>moveTo()</code>.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Para aprender más sobre la función <code>arc()</code>, vea los {{anch("Arcs")}} a continuación.</p>
+</div>
+
+<h3 id="Líneas">Líneas</h3>
+
+<p>Para dibujar lineas rectas usa el método <code>lineTo()</code>.</p>
+
+<dl>
+ <dt><code>lineTo(<em>x</em>, <em>y</em>)</code></dt>
+ <dd>Dibuja una línea desde la posición actual del dibujo a la posición específicada por <code>x</code> e <code>y</code>.</dd>
+</dl>
+
+<p>Este método toma dos argumentos <code>x</code> e <code>y</code>, los cuales son las coordenadas del punto final de la linea. El punto de inicio es dependiente de los trazos previamente dibujados, donde el punto final del trazo anterior es el punto inicial para el siguiente, etc. El punto de inicio también puede ser cambiado usando el método <code>moveTo()</code>.</p>
+
+<p>El ejemplo siguiente dibuja dos triángulos, uno rellenado y el otro contorneado.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext){
+    var ctx = canvas.getContext('2d');
+
+    // Triángulo rellenado
+    ctx.beginPath();
+    ctx.moveTo(25,25);
+    ctx.lineTo(105,25);
+    ctx.lineTo(25,105);
+    ctx.fill();
+
+    // Triángulo contorneado
+    ctx.beginPath();
+    ctx.moveTo(125,125);
+    ctx.lineTo(125,45);
+    ctx.lineTo(45,125);
+    ctx.closePath();
+    ctx.stroke();
+  }
+}
+</pre>
+
+<p>Esto comienza llamando a <code>beginPath()</code> para empezar una nueva forma. Entonces usamos el método <code>moveTo()</code> para mover el punto de inicio a la posición deseada. Debajo de esto dos líneas son dibujadas lo cual pinta dos lados del triángulo.</p>
+
+<p>{{EmbedLiveSample("Lines", 160, 160, "https://mdn.mozillademos.org/files/238/Canvas_lineTo.png")}}</p>
+
+<p>Te darás cuenta de la diferencia entre el triángulo rellenado y el contorneado. Esto es, como se menciona arriba, porque las formas son automáticamente cerradas cuando un trazo es rellenado, pero no cuando esta contorneado. Si sacamos el <code>closePath()</code> para el triángulo contorneado, solamente dos líneas serian dibujadas, no un triángulo completo.</p>
+
+<h3 id="Arcos">Arcos</h3>
+
+<p>Para dibujar arcos o circulos usamos el método <code>arc()</code>. También puedes usar <code>arcTo()</code>, pero su implementación es un poco menos confiable, así que no lo cubriremos aquí.</p>
+
+<dl>
+ <dt><code>arc(<em>x</em>, <em>y</em>, <em>radius</em>, <em>startAngle</em>, <em>endAngle</em>, <em>anticlockwise</em>)</code></dt>
+ <dd>Dibuja un arco.</dd>
+</dl>
+
+<p>Este método toma cinco parámetros: <code>x</code> e <code>y</code> son las coordenadas del centro del círculo en el cual el arco debería ser dibujado. <code>radius</code> se explica por sí solo. Los parámetros <code>startAngle</code> y <code>endAngle</code> definen el punto de inicio y punto final del arco en radianes a lo largo de la curva del círculo. Estos son medidos desde el eje x. El parámetro <code>anticlockwise</code> es un valor Booleano el cual cuando es verdadero (<code>true</code>) dibuja el arco al contrario de las manecillas del reloj, de lo contrario el arco es dibujado al sentido de las manecillas del reloj.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Los ángulos en la función del arco (<code>arc</code>) son medidos en radianes, no en grados. Para convertir grados a radianes puedes usar la siguiente expresión en Javascript: <code>radians = (Math.PI/180)*degrees</code>.</p>
+</div>
+
+<p>El siguiente ejemplo es un poco más complejo que otros que hemos visto arriba. Esto dibuja 12 diferentes arcos, todos con diferentes ángulos y rellenos.</p>
+
+<p>Las dos sentencias <code>for</code> son para iterar a través de las filas y columnas de los arcos. Para cada arco, empezamos un nuevo trazo llamando <code>beginPath()</code>. En el código, cada uno de los parámetros para el arco estan en una variable para su entendimiento, pero no es necesario esto en la vida real.</p>
+
+<p>Las coordenadas <code>x</code> e <code>y</code> deberían ser suficientemente claras. <code>radius</code> y <code>startAngle</code> estan arreglados. El <code>endAngle</code> inicia en 180 grados (la mitad de un círculo) en la primera columna y es incrementado por pasos de 90 grados, culminando en un círculo completo en la última columna.</p>
+
+<p>El parámetro <code>clockwise</code> resulta, en la primera y tercera fila siendo dibujado como un arco al sentido de las manecillas de reloj y la segunda y cuarta fila como arcos al contrario de las manecillas de reloj. Finalmente, la estructura <code>if</code> hace los arcos contorneados a la mitad desde arriba y los arcos hacia abajorellenados a la mitad.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="200"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext){
+    var ctx = canvas.getContext('2d');
+
+    for(var i=0;i&lt;4;i++){
+      for(var j=0;j&lt;3;j++){
+        ctx.beginPath();
+        var x              = 25+j*50;               // Coordenada x
+        var y              = 25+i*50;               // Coordenada y
+        var radius         = 20;                    // Radio del arco
+        var startAngle     = 0;                     // Punto inicial del círculo
+        var endAngle       = Math.PI+(Math.PI*j)/2; // Punto final del círculo
+        var anticlockwise  = i%2==0 ? false : true; // Sentido de las manecillas del reloj y contrario a ellas
+
+        ctx.arc(x, y, radius, startAngle, endAngle, anticlockwise);
+
+        if (i&gt;1){
+          ctx.fill();
+        } else {
+          ctx.stroke();
+        }
+      }
+    }
+  }
+}
+</pre>
+{{EmbedLiveSample("Arcs", 160, 210, "https://mdn.mozillademos.org/files/204/Canvas_arc.png")}}
+
+<h3 id="Curvas_Bezier_curvas_cuadráticas">Curvas Bezier curvas cuadráticas</h3>
+
+<p>El siguiente tipo de trazos disponibles son las  <a class="external" href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve" rel="external" title="http://en.wikipedia.org/wiki/B%C3%A9zier_curve">curvas Bézier</a>, en sus dos variantes, cúbicas y cuadráticas. Son usadas generalmente para dibujar complejas formas orgánicas.</p>
+
+<dl>
+ <dt><code>quadraticCurveTo(cp1x, cp1y, x, y)</code></dt>
+ <dd><span id="result_box" lang="es"><span>Dibuja una curva cuadrática de Bézier desde la posición actual de la pluma hasta el punto final especificado por <code>x</code> e <code>y</code>, utilizando el punto de control especificado por <code>cp1x</code> y <code>cp1y</code>.</span></span></dd>
+ <dt><code>bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)</code></dt>
+ <dd>Dibuja una curva cúbica de Bézier desde la posición actual de la pluma hasta el punto final especificado por <code>x</code> e <code>y</code>, utilizando los puntos de control especificados por (<code>cp1x</code>, <code>cp1y</code>) y (<code>cp2x</code>, <code>cp2y</code>).</dd>
+</dl>
+
+<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/223/Canvas_curves.png" style="float: right; height: 190px; width: 190px;">La diferencia entre estos puede describirse mejor utilizando la imagen de la derecha. Una curva cuadrática de Bézier tiene un punto inicial y un punto final (puntos azules) y un solo <strong>punto de control</strong> (indicado por el punto rojo), mientras que una curva cúbica de Bézier utiliza dos puntos de control.</p>
+
+<p>Los parámetros <code>x</code> e <code>y</code> de ambos métodos son las coordenadas del punto final. <code>cp1x</code> y <code>cp1y</code> son las coordenadas del primer punto de control, y <code>cp2x</code> y <code>cp2y</code> son las coordenadas del segundo punto de control.</p>
+
+<p>El uso de curvas cuadráticas y cúbicas Bézier puede ser bastante difícil, ya que a diferencia del software de dibujo vectorial como Adobe Illustrator, no tenemos respuesta visual directa en cuanto a lo que estamos haciendo. Esto hace bastante difícil dibujar formas complejas. En el siguiente ejemplo, vamos a dibujar algunas formas orgánicas simples, pero si tienes el tiempo y, sobre todo, la paciencia, se pueden crear formas mucho más complejas.</p>
+
+<p>No hay nada muy difícil en estos ejemplos. En ambos casos vemos una sucesión de curvas que se dibujan que finalmente dan lugar a una forma completa.</p>
+
+<h4 id="Curvas_de_Bezier_cuadraticas">Curvas de Bezier cuadraticas</h4>
+
+<p>Este ejemplo usa multiples curvas cuadraticas de Bézier para renderizar un globo de voz.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext) {
+    var ctx = canvas.getContext('2d');
+
+    // Quadratric curves example
+    ctx.beginPath();
+    ctx.moveTo(75,25);
+    ctx.quadraticCurveTo(25,25,25,62.5);
+    ctx.quadraticCurveTo(25,100,50,100);
+    ctx.quadraticCurveTo(50,120,30,125);
+    ctx.quadraticCurveTo(60,120,65,100);
+    ctx.quadraticCurveTo(125,100,125,62.5);
+    ctx.quadraticCurveTo(125,25,75,25);
+    ctx.stroke();
+  }
+}
+</pre>
+
+<p>{{EmbedLiveSample("Quadratic_Bezier_curves", 160, 160, "https://mdn.mozillademos.org/files/243/Canvas_quadratic.png")}}</p>
+
+<h4 id="Curvas_cúbicas_Bezier">Curvas cúbicas Bezier</h4>
+
+<p>Este ejemplo dibuja un corazon usanco curvas cúbicas de Bézier.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext){
+    var ctx = canvas.getContext('2d');
+
+    // Quadratric curves example
+    ctx.beginPath();
+    ctx.moveTo(75,40);
+    ctx.bezierCurveTo(75,37,70,25,50,25);
+    ctx.bezierCurveTo(20,25,20,62.5,20,62.5);
+    ctx.bezierCurveTo(20,80,40,102,75,120);
+    ctx.bezierCurveTo(110,102,130,80,130,62.5);
+    ctx.bezierCurveTo(130,62.5,130,25,100,25);
+    ctx.bezierCurveTo(85,25,75,37,75,40);
+    ctx.fill();
+  }
+}
+</pre>
+
+<p>{{EmbedLiveSample("Cubic_Bezier_curves", 160, 160, "https://mdn.mozillademos.org/files/207/Canvas_bezier.png")}}</p>
+
+<h3 id="Rectangles">Rectangles</h3>
+
+<p>In addition to the three methods we saw in {{anch("Drawing rectangles")}}, which draw rectangular shapes directly to the canvas, there's also the <code>rect()</code> method, which adds a rectangular path to a currently open path.</p>
+
+<dl>
+ <dt><code>rect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
+ <dd>Draws a rectangle whose top-left corner is specified by (<code>x</code>, <code>y</code>) with the specified <code>width</code> and <code>height</code>.</dd>
+</dl>
+
+<p>When this method is executed, the <code>moveTo()</code> method is automatically called with the parameters (0,0). In other words, the current pen position is automatically reset to the default coordinates.</p>
+
+<h3 id="Making_combinations">Making combinations</h3>
+
+<p>So far, each example on this page has used only one type of path function per shape. However, there's no limitation to the number or types of paths you can use to create a shape. So in this final example, let's combine all of the path functions to make a set of very famous game characters.</p>
+
+<div class="hidden">
+<pre class="brush: html">&lt;html&gt;
+ &lt;body onload="draw();"&gt;
+   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
+ &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<pre class="brush: js">function draw() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext){
+    var ctx = canvas.getContext('2d');
+
+    roundedRect(ctx,12,12,150,150,15);
+    roundedRect(ctx,19,19,150,150,9);
+    roundedRect(ctx,53,53,49,33,10);
+    roundedRect(ctx,53,119,49,16,6);
+    roundedRect(ctx,135,53,49,33,10);
+    roundedRect(ctx,135,119,25,49,10);
+
+    ctx.beginPath();
+    ctx.arc(37,37,13,Math.PI/7,-Math.PI/7,false);
+    ctx.lineTo(31,37);
+    ctx.fill();
+
+    for(var i=0;i&lt;8;i++){
+      ctx.fillRect(51+i*16,35,4,4);
+    }
+
+    for(i=0;i&lt;6;i++){
+      ctx.fillRect(115,51+i*16,4,4);
+    }
+
+    for(i=0;i&lt;8;i++){
+      ctx.fillRect(51+i*16,99,4,4);
+    }
+
+    ctx.beginPath();
+    ctx.moveTo(83,116);
+    ctx.lineTo(83,102);
+    ctx.bezierCurveTo(83,94,89,88,97,88);
+    ctx.bezierCurveTo(105,88,111,94,111,102);
+    ctx.lineTo(111,116);
+    ctx.lineTo(106.333,111.333);
+    ctx.lineTo(101.666,116);
+    ctx.lineTo(97,111.333);
+    ctx.lineTo(92.333,116);
+    ctx.lineTo(87.666,111.333);
+    ctx.lineTo(83,116);
+    ctx.fill();
+
+    ctx.fillStyle = "white";
+    ctx.beginPath();
+    ctx.moveTo(91,96);
+    ctx.bezierCurveTo(88,96,87,99,87,101);
+    ctx.bezierCurveTo(87,103,88,106,91,106);
+    ctx.bezierCurveTo(94,106,95,103,95,101);
+    ctx.bezierCurveTo(95,99,94,96,91,96);
+    ctx.moveTo(103,96);
+    ctx.bezierCurveTo(100,96,99,99,99,101);
+    ctx.bezierCurveTo(99,103,100,106,103,106);
+    ctx.bezierCurveTo(106,106,107,103,107,101);
+    ctx.bezierCurveTo(107,99,106,96,103,96);
+    ctx.fill();
+
+    ctx.fillStyle = "black";
+    ctx.beginPath();
+    ctx.arc(101,102,2,0,Math.PI*2,true);
+    ctx.fill();
+
+    ctx.beginPath();
+    ctx.arc(89,102,2,0,Math.PI*2,true);
+    ctx.fill();
+  }
+}
+
+// A utility function to draw a rectangle with rounded corners.
+
+function roundedRect(ctx,x,y,width,height,radius){
+  ctx.beginPath();
+  ctx.moveTo(x,y+radius);
+  ctx.lineTo(x,y+height-radius);
+  ctx.quadraticCurveTo(x,y+height,x+radius,y+height);
+  ctx.lineTo(x+width-radius,y+height);
+  ctx.quadraticCurveTo(x+width,y+height,x+width,y+height-radius);
+  ctx.lineTo(x+width,y+radius);
+  ctx.quadraticCurveTo(x+width,y,x+width-radius,y);
+  ctx.lineTo(x+radius,y);
+  ctx.quadraticCurveTo(x,y,x,y+radius);
+  ctx.stroke();
+}
+</pre>
+
+<div id="section_18">
+<p>The resulting image looks like this:</p>
+
+<p>{{EmbedLiveSample("Making_combinations", 160, 160)}}</p>
+
+<p>We won't go over this in detail, since it's actually surprisingly simple. The most important things to note are the use of the <code>fillStyle</code> property on the drawing context, and the use of a utility function (in this case <code>roundedRect()</code>). Using utility functions for bits of drawing you do often can be very helpful and reduce the amount of code you need, as well as its complexity.</p>
+
+<p>We'll take another look at <code>fillStyle</code>, in more detail, later in this tutorial. Here, all we're doing is using it to change the fill color for paths from the default color of black to white, and then back again.</p>
+
+<p>{{PreviousNext("Web/Guide/HTML/Canvas_tutorial/Basic_usage", "Web/Guide/HTML/Canvas_tutorial/Using_images")}}</p>
+</div>
+</div>
+
+<p> </p>
diff --git a/files/es/web/api/canvas_api/tutorial/drawing_text/index.html b/files/es/web/api/canvas_api/tutorial/drawing_text/index.html
new file mode 100644
index 0000000000..cdcbe07005
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/drawing_text/index.html
@@ -0,0 +1,68 @@
+---
+title: Dibujar texto usando canvas
+slug: Web/API/Canvas_API/Tutorial/Drawing_text
+tags:
+  - HTML:Canvas
+translation_of: Web/API/Canvas_API/Tutorial/Drawing_text
+original_slug: Dibujar_texto_usando_canvas
+---
+<p>{{ Gecko_minversion_header(1.9) }}
+{{ Fx_minversion_header(3) }}
+El elemento <code><a href="es/HTML/Canvas">&lt;canvas&gt;</a></code> permite dibujar texto en él a través de una API experimental de Mozilla.
+</p>
+<h3 id="API" name="API"> API </h3>
+<pre class="eval">attribute DOMString mozTextStyle;
+void mozDrawText(in DOMString textToDraw);
+float mozMeasureText(in DOMString textToMeasure);
+void mozPathText(in DOMString textToPath);
+void mozTextAlongPath(in DOMString textToDraw, in boolean stroke);
+</pre>
+<h3 id="Notas" name="Notas"> Notas </h3>
+<ul><li> El tipo de letra predeterminado es sans-serif 12pt.
+</li><li> Estas extensiones de texto no están aún estandarizadas por WHATWG.
+</li><li> No necesitas un contexto especial para usarlas; el contexto 2D funciona bien.
+</li><li> Todos los dibujos se realizan usando la transformación actual.
+</li><li> Revisa el {{ Bug(339553) }} si quieres leer más sobre las implementaciones específicas.
+</li></ul>
+<h3 id="Demostraciones" name="Demostraciones"> Demostraciones </h3>
+<p>Mira algunos ejemplos <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273497">aquí</a>, <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273498">aquí</a>, y <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=273499">aquí</a>.
+</p>
+<h3 id="Cambiar_el_tipo_de_letra_actual" name="Cambiar_el_tipo_de_letra_actual"> Cambiar el tipo de letra actual </h3>
+<p>El atributo <code>mozTextStyle</code> contiene el estilo de texto actual. Usa la misma sintaxis que el especificado para las <a href="es/CSS/font">tipografías CSS</a>.
+</p><p>Ej:
+</p>
+<pre class="eval">ctx.mozTextStyle = "20pt Arial"
+</pre>
+<h3 id="Dibujar_texto" name="Dibujar_texto"> Dibujar texto </h3>
+<p>Dibujar es muy sencillo. <code>mozDrawText</code> usa el estilo de texto actual, cualquiera que sea éste. Se usa el color de relleno del contexto como color del texto.
+</p>
+<pre class="eval">ctx.translate(10, 50);
+ctx.fillStyle = "Red";
+ctx.mozDrawText("Sample String");
+</pre>
+<h3 id="Medir_texto" name="Medir_texto"> Medir texto </h3>
+<p>A veces es útil saber qué tan ancho es un trozo de texto en particular (para centrarlo en una ventana, por ejemplo).
+</p>
+<pre class="eval">var text = "Sample String";
+var width = ctx.canvas.width;
+var len = ctx.mozMeasureText(text);
+ctx.translate(len/2, 0);
+ctx.mozDrawText(text);
+</pre>
+<h3 id="Interacci.C3.B3n_texto.2Ftrazo" name="Interacci.C3.B3n_texto.2Ftrazo"> Interacción texto/trazo </h3>
+<p>Si quieres tachar un texto, <code>mozDrawText</code> no te lo permite. En cambio, <code>mozPathText</code> agrega el tachado de texto al trazo actual.
+</p>
+<pre class="eval">ctx.fillStyle = "green";
+ctx.strokeStyle = "black";
+ctx.mozPathText("Sample String");
+ctx.fill()
+ctx.stroke()
+</pre>
+<p>Supongamos ahora que quieres agregar un texto que se acomode a un trazo que dibujaste (una línea curva o algo parecido) es donde aparece <code>mozTextAlongPath</code>. Al contrario de otras funciones de texto, <code>mozTextAlongPath</code> necesita dos argumentos: el texto y qué se quiere hacer con él. <code>mozTextAlongPath</code> aproxima el trazo actual como una serie de segmentos de línea y ubica cada carácter encima de ese trazo. Los caracteres no son cambiados de tamaño o transformados de acuerdo a la curvatura de la base; toman la orientación del trazo a la mitad del carácter.
+</p><p>Una vez que <code>mozTextAlongPath</code> sabe dónde está el carácter, busca el segundo parámetro para decidir qué hacer con él. Si el segundo parámetro es <code>false</code>, entonces dibuja el carácter como lo haría <code>mozDrawText</code>. Si es <code>true</code>, agrega el carácter al trazo actual, como lo hace <code>mozPathText</code>. Esto puede usarse para crear efectos únicos.
+</p><p><br>
+</p><p><br>
+</p>
+<div class="noinclude">
+</div>
+{{ languages( { "en": "en/Drawing_text_using_a_canvas", "fr": "fr/Dessin_de_texte_avec_canvas", "ja": "ja/Drawing_text_using_a_canvas", "pl": "pl/Rysowanie_tekstu_przy_u\u017cyciu_canvas" } ) }}
diff --git a/files/es/web/api/canvas_api/tutorial/hit_regions_and_accessibility/index.html b/files/es/web/api/canvas_api/tutorial/hit_regions_and_accessibility/index.html
new file mode 100644
index 0000000000..1f2a93dbae
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/hit_regions_and_accessibility/index.html
@@ -0,0 +1,100 @@
+---
+title: Hit regions and accessibility
+slug: Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility
+translation_of: Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility
+original_slug: Web/Guide/HTML/Canvas_tutorial/Hit_regions_and_accessibility
+---
+<div>{{CanvasSidebar}} {{ PreviousNext("Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas", "Web/API/Canvas_API/Tutorial/Optimizing_canvas") }}</div>
+
+<div class="summary">The {{HTMLElement("canvas")}} element on its own is just a bitmap and does not provide information about any drawn objects. Canvas content is not exposed to accessibility tools like semantic HTML is. In general, you should avoid using canvas in an accessible website or app. The following guidelines can help to make it more accessible.</div>
+
+<div class="summary">El elemento {{HTMLElement ("canvas")}} por sí solo es solo un mapa de bits y no proporciona información sobre ningún objeto dibujado. El contenido del lienzo no está expuesto a herramientas de accesibilidad como el HTML semántico. En general, debe evitar usar canvas en un sitio web o aplicación accesible. Las siguientes pautas pueden ayudar a que sea más accesible.</div>
+
+<h2 id="Fallback_content">Fallback content</h2>
+
+<p>The content inside the <code>&lt;canvas&gt; ... &lt;/canvas&gt;</code> tags can be used as a fallback for browsers which don't support canvas rendering. It's also very useful for assistive technology users (like screen readers) which can read and interpret the sub DOM in it. A good example at <a href="http://www.html5accessibility.com/tests/canvas.html">html5accessibility.com</a> demonstrates how this can be done:</p>
+
+<pre class="brush: html">&lt;canvas&gt;
+  &lt;h2&gt;Shapes&lt;/h2&gt;
+  &lt;p&gt;A rectangle with a black border.
+   In the background is a pink circle.
+   Partially overlaying the &lt;a href="http://en.wikipedia.org/wiki/Circle" onfocus="drawCircle();" onblur="drawPicture();"&gt;circle&lt;/a&gt;.
+   Partially overlaying the circle is a green
+   &lt;a href="http://en.wikipedia.org/wiki/Square" onfocus="drawSquare();" onblur="drawPicture();"&gt;square&lt;/a&gt;
+   and a purple &lt;a href="http://en.wikipedia.org/wiki/Triangle" onfocus="drawTriangle();" onblur="drawPicture();"&gt;triangle&lt;/a&gt;,
+   both of which are semi-opaque, so the full circle can be seen underneath.&lt;/p&gt;
+&lt;/canvas&gt; </pre>
+
+<p>See the <a href="https://www.youtube.com/watch?v=ABeIFlqYiMQ">video how NVDA reads this example by Steve Faulkner</a>.</p>
+
+<h2 id="ARIA_rules">ARIA rules</h2>
+
+<p>Accessible Rich Internet Applications <strong>(<a href="/en-US/docs/Web/Accessibility/ARIA">ARIA</a>)</strong> defines ways to make Web content and Web applications more accessible to people with disabilities. You can use ARIA attributes to describe the behavior and purpose of the canvas element. See <a href="/en-US/docs/Web/Accessibility/ARIA">ARIA</a> and <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques">ARIA techniques</a> for more information.</p>
+
+<pre class="brush: html">&lt;canvas id="button" tabindex="0" role="button" aria-pressed="false" aria-label="Start game"&gt;&lt;/canvas&gt;
+</pre>
+
+<h2 id="Hit_regions">Hit regions</h2>
+
+<p>Whether the mouse coordinates are within a particular area on the canvas, is a common problem to solve. The hit region API allows you to define an area of your canvas and provides another possibility to expose interactive content on a canvas to accessibility tools. It allows you to make hit detection easier and lets you route events to DOM elements. The API has the following three methods (which are still experimental in current web browsers; check the browser compatibility tables).</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.addHitRegion()")}} {{experimental_inline}}</dt>
+ <dd>Adds a hit region to the canvas.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.removeHitRegion()")}} {{experimental_inline}}</dt>
+ <dd>Removes the hit region with the specified <code>id</code> from the canvas.</dd>
+ <dt>{{domxref("CanvasRenderingContext2D.clearHitRegions()")}} {{experimental_inline}}</dt>
+ <dd>Removes all hit regions from the canvas.</dd>
+</dl>
+
+<p>You can add a hit region to your path and check for the {{domxref("MouseEvent.region")}} property to test if your mouse is hitting your region, for example.</p>
+
+<pre class="brush: html">&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
+&lt;script&gt;
+var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+
+ctx.beginPath();
+ctx.arc(70, 80, 10, 0, 2 * Math.PI, false);
+ctx.fill();
+ctx.addHitRegion({id: 'circle'});
+
+canvas.addEventListener('mousemove', function(event) {
+  if (event.region) {
+    alert('hit region: ' + event.region);
+  }
+});
+&lt;/script&gt;</pre>
+
+<p>The <code>addHitRegion()</code> method also takes a <code>control</code> option to route events to an element (that is a descendant of the canvas):</p>
+
+<pre class="brush: js">ctx.addHitRegion({control: element});</pre>
+
+<p>This can be useful for routing to {{HTMLElement("input")}} elements, for example. See also this <a href="https://codepen.io/peterj35/pen/PEdLKx">codepen demo</a>.</p>
+
+<h2 id="Focus_rings">Focus rings</h2>
+
+<p>When working with the keyboard, focus rings are a handy indicator to help navigating on a page. To draw focus rings on a canvas drawing, the <code>drawFocusIfNeeded</code> property can be used.</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.drawFocusIfNeeded()")}} {{experimental_inline}}</dt>
+ <dd>If a given element is focused, this method draws a focus ring around the current path.</dd>
+</dl>
+
+<p>Additionally, the <code>scrollPathIntoView()</code> method can be used to make an element visible on the screen if focused, for example.</p>
+
+<dl>
+ <dt>{{domxref("CanvasRenderingContext2D.scrollPathIntoView()")}} {{experimental_inline}}</dt>
+ <dd>Scrolls the current path or a given path into the view.</dd>
+</dl>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="https://www.w3.org/WAI/PF/HTML/wiki/Canvas_Accessibility_Use_Cases">Canvas accessibility use cases</a></li>
+ <li><a href="https://www.w3.org/html/wg/wiki/AddedElementCanvas">Canvas element accessibility issues</a></li>
+ <li><a href="http://www.paciellogroup.com/blog/2012/06/html5-canvas-accessibility-in-firefox-13/">HTML5 Canvas Accessibility in Firefox 13 – by Steve Faulkner</a></li>
+ <li><a href="https://html.spec.whatwg.org/multipage/scripting.html#best-practices">Best practices for interactive canvas elements</a></li>
+</ul>
+
+<div>{{ PreviousNext("Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas", "Web/API/Canvas_API/Tutorial/Optimizing_canvas") }}</div>
diff --git a/files/es/web/api/canvas_api/tutorial/index.html b/files/es/web/api/canvas_api/tutorial/index.html
new file mode 100644
index 0000000000..79290d7b06
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/index.html
@@ -0,0 +1,62 @@
+---
+title: Tutorial Canvas
+slug: Web/API/Canvas_API/Tutorial
+tags:
+  - Canvas
+  - HTML5
+  - graficos
+translation_of: Web/API/Canvas_API/Tutorial
+original_slug: Web/Guide/HTML/Canvas_tutorial
+---
+<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><img alt="" src="https://mdn.mozillademos.org/files/257/Canvas_tut_examples.jpg" style="float: right; height: 450px; width: 200px;"></a></p>
+
+<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><strong><code>&lt;canvas&gt;</code></strong></a> es un elemento <a href="/en-US/docs/HTML" title="HTML">HTML</a> el cual puede ser usado para dibujar gráficos usando scripts (normalmente <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>). Este puede, por ejemplo, ser usado para dibujar gráficos, realizar composición de fotos o simples (y <a href="/en-US/docs/HTML/Canvas/A_Basic_RayCaster" title="A_Basic_RayCaster">no tan simples</a>) animaciones. Las imágenes a la derecha muestran algunos ejemplos de implementaciones <code>&lt;canvas&gt;</code>  las cuales se verán en un futuro en este tutorial.</p>
+
+<p><code>&lt;canvas&gt;</code>  fue introducido primero por Apple para el Mac OS X Dashboard y después implementado en Safari y Google Chrome. Navegadores basados en <a href="/en-US/docs/Gecko" title="Gecko">Gecko</a> 1.8, tal como Firefox 1.5, que también soportan este elemento. El <code>&lt;canvas&gt;</code> es un elemento parte de las especificaciones de la <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">WhatWG Web applications 1.0</a> mejor conocida como HTML5.</p>
+
+<p><span class="seoSummary">En este tutorial se describe cómo usar el elemento <code>&lt;canvas&gt;</code> para dibujar gráficos en 2D, empezando con lo básico. Los ejemplos le proveerán mayor claridad a las ideas que pueda tener referentes al canvas, así como los códigos que necesita para crear su propio contenido.</span></p>
+
+<h2 id="Before_you_start" name="Before_you_start">Antes de Empezar</h2>
+
+<p>Usar el elemento <code>&lt;canvas&gt;</code> no es algo muy díficil pero necesita saber y entender los aspectos básicos del <a href="/en-US/docs/HTML" title="HTML">HTML</a> y <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>. El elemento <code>&lt;canvas&gt;</code> no está soportado en navegadores viejos, pero están soportado en la mayoría de las versiones más recientes de los navegadores. El tamaño por defecto del canvas es 300px * 150px [ancho (width) * alto (height)]. Pero se puede personalizar el tamaño usando las propiedades height y width de CSS.<span id="result_box" lang="es"><span class="hps"> Con el fin de</span> <span class="hps">dibujar gráficos</span> <span class="hps">en el lienzo</span> <span class="hps">&lt;canvas&gt; se utiliza un</span> <span class="hps">objeto de contexto de</span> <span class="hps">JavaScript</span> <span class="hps">que crea</span> <span class="hps">gráficos</span> <span class="hps">sobre la marcha.</span></span></p>
+
+<h2 id="In_this_tutorial" name="In_this_tutorial">En este Tutorial</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_usage" title="Canvas_tutorial/Basic_usage">Usos Básicos</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Drawing_shapes" title="Canvas_tutorial/Drawing_shapes">Dibujando Formas</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Using_images" title="Canvas_tutorial/Using_images">Usando Imágenes</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors" title="Canvas_tutorial/Applying_styles_and_colors">Aplicando estilos y colores</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Transformations" title="Canvas_tutorial/Transformations">Transformaciones</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Compositing" title="Canvas_tutorial/Compositing">Composiciones</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_animations" title="Canvas_tutorial/Basic_animations">Animaciones Básicas</a></li>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas" title="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas">Optimización de Canvas</a></li>
+</ul>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas">Canvas topic page</a></li>
+ <li><a href="/en-US/docs/HTML/Canvas/Drawing_Graphics_with_Canvas" title="Drawing_Graphics_with_Canvas">Drawing Graphics with Canvas</a></li>
+ <li><a href="/en-US/docs/tag/Canvas_examples" title="tag/Canvas_examples">Canvas examples</a></li>
+ <li><a href="http://www.html5andcss3.org">HTML5 Tutorial</a></li>
+ <li><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas">Drawing Text Using a Canvas</a></li>
+ <li><a class="external" href="http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/HTML-canvas-guide/AddingText/AddingText.html#//apple_ref/doc/uid/TP40010542-CH6-SW4" title="Adding Text to Canvas">Adding Text to Canvas</a></li>
+ <li><a class="external" href="http://www.canvasdemos.com/" title="Canvas Demos">Canvas Demos - Games, applications, tools and tutorials</a></li>
+ <li><a class="external" href="http://canvimation.github.com/" title="http://canvimation.github.com/">Canvas Drawing and Animation Application</a></li>
+ <li><a class="external" href="http://billmill.org/static/canvastutorial/" title="http://billmill.org/static/canvastutorial/">Interactive canvas tutorial</a></li>
+ <li><a class="external" href="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html" title="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html">Canvas Cheat Sheet with all attributes and methods</a></li>
+ <li><a class="external" href="http://visitmix.com/labs/ai2canvas/" title="http://visitmix.com/labs/ai2canvas/">Adobe Illustrator to Canvas plug-in</a></li>
+ <li><a class="external" href="http://www.html5canvastutorials.com/" title="http://www.html5canvastutorials.com/">HTML5CanvasTutorials</a></li>
+ <li><a class="external" href="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api" title="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api">How to draw N grade Bézier curves with the Canvas API</a></li>
+ <li><a class="external" href="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/" title="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/">31 days of canvas tutorials</a></li>
+ <li><a href="http://www.w3.org/TR/2dcontext/" title="http://www.w3.org/TR/2dcontext/">W3C Standard</a></li>
+ <li><a href="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php" title="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php">HTML5 Canvas tutorials and reference</a></li>
+ <li><a href="http://davidwalsh.name/convert-canvas-image">JavaScript Canvas Image Conversion</a></li>
+</ul>
+
+<h2 id="Nota_a_los_contribuyentes">Nota a los contribuyentes</h2>
+
+<p>Debido a un desafortunado error técnico que ocurrió el 17 de junio del 2013, perdimos la historia de este tutorial, incluyendo atribuciones a todos los contribuyentes del pasado a su contenido. Pedimos disculpas por esto, y esperamos que perdone este desafortunado percance.</p>
+
+<div>{{ Next("Web/Guide/HTML/Canvas_tutorial/Basic_usage") }}</div>
diff --git a/files/es/web/api/canvas_api/tutorial/optimizing_canvas/index.html b/files/es/web/api/canvas_api/tutorial/optimizing_canvas/index.html
new file mode 100644
index 0000000000..eb1d7b58fa
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/optimizing_canvas/index.html
@@ -0,0 +1,20 @@
+---
+title: Optimizing canvas
+slug: Web/API/Canvas_API/Tutorial/Optimizing_canvas
+translation_of: Web/API/Canvas_API/Tutorial/Optimizing_canvas
+original_slug: Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas
+---
+<p>{{HTMLElement("canvas")}} es uno de los estándares más utilizados para la representación de gráficos 2D en la Web. Se utiliza ampliamente en los juegos y visualizaciones complejas. Sin embargo, as Web sites and apps push canvas to the limits, el rendimiento comienza a sufrir. <span class="seoSummary">This article aims to provide suggestions for optimizing your use of the canvas element, to ensure that your Web site or app performs well.</span></p>
+<p>A continuación una lista de tips par mejorar el rendimiento:</p>
+<ul>
+ <li>Repintar primitives similares o objetos repetidos dentro y fuera de la pantalla canvas.</li>
+ <li>Batch canvas calls together (for example, draw a poly-line instead of multiple separate lines).</li>
+ <li>Avoid floating-point coordinates and use integers instead.</li>
+ <li>Avoid unnecessary canvas state changes.</li>
+ <li>Render screen differences only, not the whole new state.</li>
+ <li>Utilice varios lienzos en capas para escenas complejas.</li>
+ <li>Evite la propiedad <code>shadowBlur</code> siempre que sea posible.</li>
+ <li>Con las animaciones, use {{domxref("window.requestAnimationFrame()")}}.</li>
+ <li>Probar el rendimiento con <a href="http://jsperf.com" title="http://jsperf.com">JSPerf</a>.</li>
+</ul>
+<p>{{PreviousNext("Web/Guide/HTML/Canvas_tutorial/Basic_animations")}}</p>
diff --git a/files/es/web/api/canvas_api/tutorial/pixel_manipulation_with_canvas/index.html b/files/es/web/api/canvas_api/tutorial/pixel_manipulation_with_canvas/index.html
new file mode 100644
index 0000000000..67955cd1b7
--- /dev/null
+++ b/files/es/web/api/canvas_api/tutorial/pixel_manipulation_with_canvas/index.html
@@ -0,0 +1,302 @@
+---
+title: Pixel manipulation with canvas
+slug: Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas
+translation_of: Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas
+original_slug: Web/Guide/HTML/Canvas_tutorial/Pixel_manipulation_with_canvas
+---
+<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Advanced_animations", "Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility")}}</div>
+
+<div class="summary">
+<p>Hasta ahora, no habíamos mirado los píxeles reales de nuestro <em>canvas</em>. Con el objeto <code>ImageData</code>, puedes leer y escribir directamente un <em>array</em> de datos para manipular píxeles.</p>
+
+<p>También veremos cómo se puede controlar el suavizado de la imagen (antialiasing) y cómo guardar imágenes de tu <em>canvas</em>.</p>
+</div>
+
+<h2 id="El_objeto_ImageData">El objeto <code>ImageData</code></h2>
+
+<p>El objeto {{domxref("ImageData")}} representa los datos pixelados subyacentes de un área de un objeto lienzo. Contiene los siguientes atributos de sólo lectura:</p>
+
+<dl>
+ <dt><code>width</code></dt>
+ <dd>El ancho de la imagen en píxeles.</dd>
+ <dt><code>height</code></dt>
+ <dd>La altura de la imagen en píxeles.</dd>
+ <dt><code>data</code></dt>
+ <dd>Un objeto {{jsxref("Uint8ClampedArray")}} que representa un array unidimensional, contiene información en formato RGBA, con valores desde <code>0</code> hasta <code>255</code> (incluído).</dd>
+</dl>
+
+<p>La propiedad <code>data</code> devuelve un  {{jsxref("Uint8ClampedArray")}}, al que se puede acceder para ver los datos originales del pixel; cada pixel está representado por cuatro valores (rojo, verde, azul, y alfa, en ese orden; esto es, formato "RGBA"). Cada componente de color se representa con un valor entero entre 0 y 255. Dentro del array, cada componente ocupa un índice consecutivo, comenzando con 0 desde el punto superior izquierdo, continuando de izquierda a derecha y de arriba hacia abajo, a través del array.</p>
+
+<p>El {{jsxref("Uint8ClampedArray")}} contiene <code>alto</code> × <code>ancho</code> × 4 bytes de datos, con valores de índice en el rango entre 0 y (<code>alto</code>×<code>ancho</code>×4)-1.</p>
+
+<p>Por ejemplo, para leer el valor del componente azul del pixel en la columna 200, fila 50 de una imagen, deberías hacer lo siguiente:</p>
+
+<p>blueComponent = imageData.data[((50 * (imageData.width * 4)) + (200 * 4)) + 2];</p>
+
+<p>Si se le da un conjunto de coordenadas (X e Y), puede que termine haciendo algo así:</p>
+
+<pre class="brush: js">var xCoord = 50;
+var yCoord = 100;
+var canvasWidth = 1024;
+
+function getColorIndicesForCoord(x, y, width) {
+  var red = y * (width * 4) + x * 4;
+  return [red, red + 1, red + 2, red + 3];
+}
+
+var colorIndices = getColorIndicesForCoord(xCoord, yCoord, canvasWidth);
+
+var redIndex = colorIndices[0];
+var greenIndex = colorIndices[1];
+var blueIndex = colorIndices[2];
+var alphaIndex = colorIndices[3];
+
+var redForCoord = imageData.data[redIndex];
+var greenForCoord = imageData.data[greenIndex];
+var blueForCoord = imageData.data[blueIndex];
+var alphaForCoord = imageData.data[alphaIndex];
+</pre>
+
+<p>O, en ES6 sería algo así:</p>
+
+<pre class="brush: js">const xCoord = 50;
+const yCoord = 100;
+const canvasWidth = 1024;
+
+const getColorIndicesForCoord = (x, y, width) =&gt; {
+  const red = y * (width * 4) + x * 4;
+  return [red, red + 1, red + 2, red + 3];
+};
+
+const colorIndices = getColorIndicesForCoord(xCoord, yCoord, canvasWidth);
+
+const [redIndex, greenIndex, blueIndex, alphaIndex] = colorIndices;
+</pre>
+
+<p>You may also access the size of the pixel array in bytes by reading the <code>Uint8ClampedArray.length</code> attribute:</p>
+
+<pre class="brush: js">var numBytes = imageData.data.length;
+</pre>
+
+<h2 id="Creando_un_objeto_ImageData">Creando un objeto <code>ImageData</code></h2>
+
+<p>Para crear un objeto nuevo y vacío tipo <code>ImageData</code>, debes usar el método  {{domxref("CanvasRenderingContext2D.createImageData", "createImageData()")}}. Hay dos versiones del método <code>createImageData()</code>:</p>
+
+<pre class="brush: js">var myImageData = ctx.createImageData(width, height);</pre>
+
+<p>Esto crea un nuevo objeto <code>ImageData</code> con las dimensiones especificadas. Todos los pixels tienen valor correspondiente a negro - transparente (0,0,0,0).</p>
+
+<p>También puedes crear un nuevo objeto <code>ImageData</code> con las mismas dimensiones que otro objeto, especificado por <code>anotherImageData</code>. Los píxels del nuevo objeto tienen valor negro - transparente. <strong>¡Esto no es una copia de los datos de la imagen!</strong></p>
+
+<pre class="brush: js">var myImageData = ctx.createImageData(anotherImageData);</pre>
+
+<h2 id="Getting_the_pixel_data_for_a_context">Getting the pixel data for a context</h2>
+
+<p>To obtain an <code>ImageData</code> object containing a copy of the pixel data for a canvas context, you can use the <code>getImageData()</code> method:</p>
+
+<pre class="brush: js">var myImageData = ctx.getImageData(left, top, width, height);</pre>
+
+<p>This method returns an <code>ImageData</code> object representing the pixel data for the area of the canvas whose corners are represented by the points (<code>left</code>,<code>top</code>), (<code>left+width</code>, <code>top</code>), (<code>left</code>, <code>top+height</code>), and (<code>left+width</code>, <code>top+height</code>). The coordinates are specified in canvas coordinate space units.</p>
+
+<div class="note">
+<p><strong>Note</strong>: Any pixels outside the canvas are returned as transparent black in the resulting <code>ImageData</code> object.</p>
+</div>
+
+<p>This method is also demonstrated in the article <a href="/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas">Manipulating video using canvas</a>.</p>
+
+<h3 id="A_color_picker">A color picker</h3>
+
+<p>In this example we are using the <a href="/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData">getImageData() </a>method to display the color under the mouse cursor. For this, we need the current position of the mouse with <code>layerX</code> and <code>layerY</code>, then we look up the pixel data on that position in the pixel array that <a href="/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData">getImageData()</a> provides us. Finally, we use the array data to set a background color and a text in the <code>&lt;div&gt;</code> to display the color.</p>
+
+<div class="hidden">
+<pre class="brush: html;">&lt;canvas id="canvas" width="300" height="227" style="float:left"&gt;&lt;/canvas&gt;
+&lt;div id="color" style="width:200px;height:50px;float:left"&gt;&lt;/div&gt;
+</pre>
+</div>
+
+<pre class="brush: js;">var img = new Image();
+img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg';
+var canvas = document.getElementById('canvas');
+var ctx = canvas.getContext('2d');
+img.onload = function() {
+  ctx.drawImage(img, 0, 0);
+  img.style.display = 'none';
+};
+var color = document.getElementById('color');
+function pick(event) {
+  var x = event.layerX;
+  var y = event.layerY;
+  var pixel = ctx.getImageData(x, y, 1, 1);
+  var data = pixel.data;
+  var rgba = 'rgba(' + data[0] + ', ' + data[1] +
+             ', ' + data[2] + ', ' + (data[3] / 255) + ')';
+  color.style.background =  rgba;
+  color.textContent = rgba;
+}
+canvas.addEventListener('mousemove', pick);
+</pre>
+
+<p>{{ EmbedLiveSample('A_color_picker', 610, 240) }}</p>
+
+<h2 id="Painting_pixel_data_into_a_context">Painting pixel data into a context</h2>
+
+<p>You can use the<a href="/en-US/docs/Web/API/CanvasRenderingContext2D/putImageData"> putImageData() </a>method to paint pixel data into a context:</p>
+
+<pre class="brush: js">ctx.putImageData(myImageData, dx, dy);
+</pre>
+
+<p>The <code>dx</code> and <code>dy</code> parameters indicate the device coordinates within the context at which to paint the top left corner of the pixel data you wish to draw.</p>
+
+<p>For example, to paint the entire image represented by <code>myImageData</code> to the top left corner of the context, you can simply do the following:</p>
+
+<pre class="brush: js">ctx.putImageData(myImageData, 0, 0);
+</pre>
+
+<h3 id="Grayscaling_and_inverting_colors">Grayscaling and inverting colors</h3>
+
+<p>In this example we iterate over all pixels to change their values, then we put the modified pixel array back to the canvas using <a href="/en-US/docs/Web/API/CanvasRenderingContext2D/putImageData">putImageData()</a>. The invert function simply subtracts each color from the max value 255. The grayscale function simply uses the average of red, green and blue. You can also use a weighted average, given by the formula <code>x = 0.299r + 0.587g + 0.114b</code>, for example. See <a href="http://en.wikipedia.org/wiki/Grayscale">Grayscale</a> on Wikipedia for more information.</p>
+
+<div class="hidden">
+<pre class="brush: html;">&lt;canvas id="canvas" width="300" height="227"&gt;&lt;/canvas&gt;
+&lt;div&gt;
+  &lt;input id="grayscalebtn" value="Grayscale" type="button"&gt;
+  &lt;input id="invertbtn" value="Invert" type="button"&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<pre class="brush: js">var img = new Image();
+img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg';
+img.onload = function() {
+  draw(this);
+};
+
+function draw(img) {
+  var canvas = document.getElementById('canvas');
+  var ctx = canvas.getContext('2d');
+  ctx.drawImage(img, 0, 0);
+  img.style.display = 'none';
+  var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
+  var data = imageData.data;
+
+  var invert = function() {
+    for (var i = 0; i &lt; data.length; i += 4) {
+      data[i]     = 255 - data[i];     // red
+      data[i + 1] = 255 - data[i + 1]; // green
+      data[i + 2] = 255 - data[i + 2]; // blue
+    }
+    ctx.putImageData(imageData, 0, 0);
+  };
+
+  var grayscale = function() {
+    for (var i = 0; i &lt; data.length; i += 4) {
+      var avg = (data[i] + data[i + 1] + data[i + 2]) / 3;
+      data[i]     = avg; // red
+      data[i + 1] = avg; // green
+      data[i + 2] = avg; // blue
+    }
+    ctx.putImageData(imageData, 0, 0);
+  };
+
+  var invertbtn = document.getElementById('invertbtn');
+  invertbtn.addEventListener('click', invert);
+  var grayscalebtn = document.getElementById('grayscalebtn');
+  grayscalebtn.addEventListener('click', grayscale);
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Grayscaling_and_inverting_colors', 330, 270) }}</p>
+
+<h2 id="Zooming_and_anti-aliasing">Zooming and anti-aliasing</h2>
+
+<p>With the help of the {{domxref("CanvasRenderingContext2D.drawImage", "drawImage()")}} method, a second canvas and the {{domxref("CanvasRenderingContext2D.imageSmoothingEnabled", "imageSmoothingEnabled")}} property, we are able to zoom into our picture and see the details.</p>
+
+<p>We get the position of the mouse and crop an image of 5 pixels left and above to 5 pixels right and below. Then we copy that one over to another canvas and resize the image to the size we want it to. In the zoom canvas we resize a 10×10 pixel crop of the original canvas to 200×200.</p>
+
+<pre class="brush: js">zoomctx.drawImage(canvas,
+                  Math.abs(x - 5), Math.abs(y - 5),
+                  10, 10, 0, 0, 200, 200);</pre>
+
+<p>Because anti-aliasing is enabled by default, we might want to disable the smoothing to see clear pixels. You can toggle the checkbox to see the effect of the <code>imageSmoothingEnabled</code> property (which needs prefixes for different browsers).</p>
+
+<h6 class="hidden" id="Zoom_example">Zoom example</h6>
+
+<div class="hidden">
+<pre class="brush: html;">&lt;canvas id="canvas" width="300" height="227"&gt;&lt;/canvas&gt;
+&lt;canvas id="zoom" width="300" height="227"&gt;&lt;/canvas&gt;
+&lt;div&gt;
+&lt;label for="smoothbtn"&gt;
+  &lt;input type="checkbox" name="smoothbtn" checked="checked" id="smoothbtn"&gt;
+  Enable image smoothing
+&lt;/label&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<pre class="brush: js">var img = new Image();
+img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg';
+img.onload = function() {
+  draw(this);
+};
+
+function draw(img) {
+  var canvas = document.getElementById('canvas');
+  var ctx = canvas.getContext('2d');
+  ctx.drawImage(img, 0, 0);
+  img.style.display = 'none';
+  var zoomctx = document.getElementById('zoom').getContext('2d');
+
+  var smoothbtn = document.getElementById('smoothbtn');
+  var toggleSmoothing = function(event) {
+    zoomctx.imageSmoothingEnabled = this.checked;
+    zoomctx.mozImageSmoothingEnabled = this.checked;
+    zoomctx.webkitImageSmoothingEnabled = this.checked;
+    zoomctx.msImageSmoothingEnabled = this.checked;
+  };
+  smoothbtn.addEventListener('change', toggleSmoothing);
+
+  var zoom = function(event) {
+    var x = event.layerX;
+    var y = event.layerY;
+    zoomctx.drawImage(canvas,
+                      Math.abs(x - 5),
+                      Math.abs(y - 5),
+                      10, 10,
+                      0, 0,
+                      200, 200);
+  };
+
+  canvas.addEventListener('mousemove', zoom);
+}</pre>
+
+<p>{{ EmbedLiveSample('Zoom_example', 620, 490) }}</p>
+
+<h2 id="Guardando_las_imágenes">Guardando las imágenes</h2>
+
+<p>The {{domxref("HTMLCanvasElement")}} provides a <code>toDataURL()</code> method, which is useful when saving images. It returns a <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs">data URI</a> containing a representation of the image in the format specified by the <code>type</code> parameter (defaults to <a class="external external-icon" href="https://en.wikipedia.org/wiki/Portable_Network_Graphics">PNG</a>). The returned image is in a resolution of 96 dpi.</p>
+
+<dl>
+ <dt>{{domxref("HTMLCanvasElement.toDataURL", "canvas.toDataURL('image/png')")}}</dt>
+ <dd>Default setting. Creates a PNG image.</dd>
+ <dt>{{domxref("HTMLCanvasElement.toDataURL", "canvas.toDataURL('image/jpeg', quality)")}}</dt>
+ <dd>Creates a JPG image. Optionally, you can provide a quality in the range from 0 to 1, with one being the best quality and with 0 almost not recognizable but small in file size.</dd>
+</dl>
+
+<p>Once you have generated a data URI from you canvas, you are able to use it as the source of any {{HTMLElement("image")}} or put it into a hyper link with a <a href="/en-US/docs/Web/HTML/Element/a#attr-download">download attribute</a> to save it to disc, for example.</p>
+
+<p>You can also create a {{domxref("Blob")}} from the canvas.</p>
+
+<dl>
+ <dt>{{domxref("HTMLCanvasElement.toBlob", "canvas.toBlob(callback, type, encoderOptions)")}}</dt>
+ <dd>Creates a <code>Blob</code> object representing the image contained in the canvas.</dd>
+</dl>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("ImageData")}}</li>
+ <li><a href="/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas">Manipulating video using canvas</a></li>
+ <li><a href="https://codepo8.github.io/canvas-images-and-pixels/">Canvas, images and pixels – by Christian Heilmann</a></li>
+</ul>
+
+<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Advanced_animations", "Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility")}}</p>
diff --git a/files/es/web/api/clipboard_api/index.html b/files/es/web/api/clipboard_api/index.html
new file mode 100644
index 0000000000..1f434f1b9f
--- /dev/null
+++ b/files/es/web/api/clipboard_api/index.html
@@ -0,0 +1,77 @@
+---
+title: API del portapapeles
+slug: Web/API/Clipboard_API
+translation_of: Web/API/Clipboard_API
+original_slug: Web/API/API_del_portapapeles
+---
+<div>{{DefaultAPISidebar("Clipboard API")}}</div>
+
+<p>La <strong>API del portapapeles </strong>permite acceder los comandos del portapapeles (cortar, copiar y pegar), así como leer y escribir de manera asíncrona el portapapeles del sistema. Acceder al contenido del portapapeles está sujeta a la <a href="/es/docs/Web/API/Permissions_API">API de permisos</a>: El permiso <code>clipboard-write</code> es concedido automáticamente a las páginas cuando están en la pestaña activa. El permiso <code>clipboard-read</code> debe ser solicitado, lo que se puede hacer intentando leer directamente el portapapeles.</p>
+
+<p>Esta API está diseñada para reemplazar el acceso al portapapeles usando {{domxref("document.execCommand()")}}.</p>
+
+<h2 id="Accediendo_al_portapapeles">Accediendo al portapapeles</h2>
+
+<p>En vez de instanciar un objeto <code>Clipboard</code>, se puede acceder al portapapeles del sistema a través de la variable global {{domxref("Navigator.clipboard")}}:</p>
+
+<pre class="brush: js notranslate">navigator.clipboard.readText().then(
+  clipText =&gt; document.querySelector(".editor").innerText += clipText);</pre>
+
+<p>Esta pieza de código lee el texto que hay en el portapapeles y lo añade al primer elemento que tenga la clase <code>editor</code>. Desde que {{domxref("Clipboard.readText", "readText()")}} (y también {{domxref("Clipboard.read", "read()")}}, de hecho) devuelve una cadena de texto vacía si el contenido del portapapeles no es texto, este código es seguro.</p>
+
+<h2 id="Interfaces">Interfaces</h2>
+
+<dl>
+ <dt>{{domxref("Clipboard")}} {{securecontext_inline}}</dt>
+ <dd>Proporciona una interfaz para leer y escribir texto y datos. La especificación se refiere a esto como 'Async Clipboard API.'</dd>
+ <dt>{{domxref("ClipboardEvent")}} {{securecontext_inline}}</dt>
+ <dd>Representa la información del evento que se ha disparado. Los eventos que se pueden disparar son: {{domxref("Element/cut_event", "cortar")}}, {{domxref("Element/copy_event", "copiar")}}, y {{domxref("Element/paste_event", "pegar")}}. La especificación se refiere a esto como 'Clipboard Event API'.</dd>
+ <dt>{{domxref("ClipboardItem")}} {{securecontext_inline}}</dt>
+ <dd>Representa uno de los objetos del portapapeles, usado en la lectura y escritura de datos.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Clipboard API')}}</td>
+   <td>{{Spec2('Clipboard API')}}</td>
+   <td>Definición primitiva.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<h3 id="Clipboard">Clipboard</h3>
+
+<div>
+
+
+<p>{{Compat("api.Clipboard")}}</p>
+
+<h3 id="ClipboardEvent">ClipboardEvent</h3>
+
+<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("api.ClipboardEvent")}}</p>
+
+<h3 id="ClipboardItem">ClipboardItem</h3>
+
+
+
+<p>{{Compat("api.ClipboardItem")}}</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/API/Permissions">Permissions API</a></li>
+ <li><a href="/es/docs/Web/API/Permissions_API/Using_the_Permissions_API">Using the Permissions API</a></li>
+</ul>
+</div>
diff --git a/files/es/web/api/console/tabla/index.html b/files/es/web/api/console/tabla/index.html
deleted file mode 100644
index 53f57f5636..0000000000
--- a/files/es/web/api/console/tabla/index.html
+++ /dev/null
@@ -1,212 +0,0 @@
----
-title: Console.table()
-slug: Web/API/Console/tabla
-tags:
-  - API
-  - Consola
-  - DOM
-  - Depuración
-translation_of: Web/API/Console/table
----
-<div>{{APIRef("Console API")}}</div>
-
-<p><span class="seoSummary">Muestra datos tabulares como una tabla.</span></p>
-
-<p>Esta función toma un argumento obligatorio: <code>data</code>, que debe ser un array o un objeto, y un parámetro adicional: <code>columns</code>.</p>
-
-<p>Muestra <code>data</code> como una tabla en la consola. Cada elemento en el array (o propiedad enumerable si <code>data</code> es un objeto) será una fila en la tabla.</p>
-
-<p>La primera columna de la tabla se identificará como <code>(index)</code>. Si <code>data</code> es un array, sus valores serán los índices del array. Si <code>data</code> es un objeto, entonces sus valores serán los nombres de las propiedades. Tenga en cuenta que (en Firefox) <code>console.table</code> está limitado a mostrar 1000 filas (la primera columna es la llamada <code>index</code>).</p>
-
-<p>{{AvailableInWorkers}}</p>
-
-<h3 id="Colecciones_de_tipos_primitivos">Colecciones de tipos primitivos</h3>
-
-<p>El argumento <code>data</code> puede ser un array o un objeto.</p>
-
-<pre class="brush: js">// un array de strings
-
-console.table(["apples", "oranges", "bananas"]);</pre>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/8567/console-table-array.png"></p>
-
-<pre class="brush: js">// un objeto cuyas propiedades son strings
-
-function Person(firstName, lastName) {
-  this.firstName = firstName;
-  this.lastName = lastName;
-}
-
-var me = new Person("John", "Smith");
-
-console.table(me);</pre>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/8559/console-table-simple-object.png"></p>
-
-<h3 id="Colecciones_de_tipos_compuestos">Colecciones de tipos compuestos</h3>
-
-<p>Si los elementos en el array, o propiedades en el objeto, son también arrays u objetos, sus elementos o propiedades serán enumeradas en la fila, una por columna:</p>
-
-<pre class="brush: js">// un array de arrays
-
-var people = [["John", "Smith"], ["Jane", "Doe"], ["Emily", "Jones"]]
-console.table(people);</pre>
-
-<p><img alt="Table displaying array of arrays" src="https://mdn.mozillademos.org/files/8561/console-table-array-of-array.png"></p>
-
-<pre class="brush: js">// un array de objetos
-
-function Person(firstName, lastName) {
-  this.firstName = firstName;
-  this.lastName = lastName;
-}
-
-var john = new Person("John", "Smith");
-var jane = new Person("Jane", "Doe");
-var emily = new Person("Emily", "Jones");
-
-console.table([john, jane, emily]);</pre>
-
-<p>Tenga en cuenta que si el array contiene objetos, las columnas se etiquetarán con el nombre de la propiedad.</p>
-
-<p><img alt="Table displaying array of objects" src="https://mdn.mozillademos.org/files/8563/console-table-array-of-objects.png"></p>
-
-<pre class="brush: js">// un objeto cuyas propiedades son objetos
-
-var family = {};
-
-family.mother = new Person("Jane", "Smith");
-family.father = new Person("John", "Smith");
-family.daughter = new Person("Emily", "Smith");
-
-console.table(family);</pre>
-
-<p><img alt="Table displaying object of objects" src="https://mdn.mozillademos.org/files/8565/console-table-object-of-objects.png"></p>
-
-<h3 id="Restringiendo_las_columnas_mostradas">Restringiendo las columnas mostradas</h3>
-
-<p>Por defecto, <code>console.table()</code> muestra todos los elementos de cada fila. Puedes emplear el parámetro opcional <code>columns</code>  para seleccionar un subconjunto de columnas que mostrar:</p>
-
-<pre class="brush: js">// an array of objects, logging only firstName
-
-function Person(firstName, lastName) {
-  this.firstName = firstName;
-  this.lastName = lastName;
-}
-
-var john = new Person("John", "Smith");
-var jane = new Person("Jane", "Doe");
-var emily = new Person("Emily", "Jones");
-
-console.table([john, jane, emily], ["firstName"]);</pre>
-
-<p><img alt="Table displaying array of objects with filtered output" src="https://mdn.mozillademos.org/files/8569/console-table-array-of-objects-firstName-only.png"></p>
-
-<h3 id="Ordenando_columnas">Ordenando columnas</h3>
-
-<p>Se puede ordenar la tabla por una columna en particular pulsando en la etiqueta de dicha columna.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">console.table(data [, <em>columns</em>]);
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>data</code></dt>
- <dd>La información a mostrar. Puede ser tanto un array como un objeto.</dd>
- <dt><code>columns</code></dt>
- <dd>Un array que contenga los nombres de las columnas a incluir.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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("Console API", "#table", "console.table()")}}</td>
-   <td>{{Spec2("Console API")}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("34.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Disponible en workers</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("38.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("34.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Disponible en workers</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("38.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/api/console/table/index.html b/files/es/web/api/console/table/index.html
new file mode 100644
index 0000000000..e234ca415e
--- /dev/null
+++ b/files/es/web/api/console/table/index.html
@@ -0,0 +1,213 @@
+---
+title: Console.table()
+slug: Web/API/Console/table
+tags:
+  - API
+  - Consola
+  - DOM
+  - Depuración
+translation_of: Web/API/Console/table
+original_slug: Web/API/Console/tabla
+---
+<div>{{APIRef("Console API")}}</div>
+
+<p><span class="seoSummary">Muestra datos tabulares como una tabla.</span></p>
+
+<p>Esta función toma un argumento obligatorio: <code>data</code>, que debe ser un array o un objeto, y un parámetro adicional: <code>columns</code>.</p>
+
+<p>Muestra <code>data</code> como una tabla en la consola. Cada elemento en el array (o propiedad enumerable si <code>data</code> es un objeto) será una fila en la tabla.</p>
+
+<p>La primera columna de la tabla se identificará como <code>(index)</code>. Si <code>data</code> es un array, sus valores serán los índices del array. Si <code>data</code> es un objeto, entonces sus valores serán los nombres de las propiedades. Tenga en cuenta que (en Firefox) <code>console.table</code> está limitado a mostrar 1000 filas (la primera columna es la llamada <code>index</code>).</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h3 id="Colecciones_de_tipos_primitivos">Colecciones de tipos primitivos</h3>
+
+<p>El argumento <code>data</code> puede ser un array o un objeto.</p>
+
+<pre class="brush: js">// un array de strings
+
+console.table(["apples", "oranges", "bananas"]);</pre>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/8567/console-table-array.png"></p>
+
+<pre class="brush: js">// un objeto cuyas propiedades son strings
+
+function Person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+}
+
+var me = new Person("John", "Smith");
+
+console.table(me);</pre>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/8559/console-table-simple-object.png"></p>
+
+<h3 id="Colecciones_de_tipos_compuestos">Colecciones de tipos compuestos</h3>
+
+<p>Si los elementos en el array, o propiedades en el objeto, son también arrays u objetos, sus elementos o propiedades serán enumeradas en la fila, una por columna:</p>
+
+<pre class="brush: js">// un array de arrays
+
+var people = [["John", "Smith"], ["Jane", "Doe"], ["Emily", "Jones"]]
+console.table(people);</pre>
+
+<p><img alt="Table displaying array of arrays" src="https://mdn.mozillademos.org/files/8561/console-table-array-of-array.png"></p>
+
+<pre class="brush: js">// un array de objetos
+
+function Person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+}
+
+var john = new Person("John", "Smith");
+var jane = new Person("Jane", "Doe");
+var emily = new Person("Emily", "Jones");
+
+console.table([john, jane, emily]);</pre>
+
+<p>Tenga en cuenta que si el array contiene objetos, las columnas se etiquetarán con el nombre de la propiedad.</p>
+
+<p><img alt="Table displaying array of objects" src="https://mdn.mozillademos.org/files/8563/console-table-array-of-objects.png"></p>
+
+<pre class="brush: js">// un objeto cuyas propiedades son objetos
+
+var family = {};
+
+family.mother = new Person("Jane", "Smith");
+family.father = new Person("John", "Smith");
+family.daughter = new Person("Emily", "Smith");
+
+console.table(family);</pre>
+
+<p><img alt="Table displaying object of objects" src="https://mdn.mozillademos.org/files/8565/console-table-object-of-objects.png"></p>
+
+<h3 id="Restringiendo_las_columnas_mostradas">Restringiendo las columnas mostradas</h3>
+
+<p>Por defecto, <code>console.table()</code> muestra todos los elementos de cada fila. Puedes emplear el parámetro opcional <code>columns</code>  para seleccionar un subconjunto de columnas que mostrar:</p>
+
+<pre class="brush: js">// an array of objects, logging only firstName
+
+function Person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+}
+
+var john = new Person("John", "Smith");
+var jane = new Person("Jane", "Doe");
+var emily = new Person("Emily", "Jones");
+
+console.table([john, jane, emily], ["firstName"]);</pre>
+
+<p><img alt="Table displaying array of objects with filtered output" src="https://mdn.mozillademos.org/files/8569/console-table-array-of-objects-firstName-only.png"></p>
+
+<h3 id="Ordenando_columnas">Ordenando columnas</h3>
+
+<p>Se puede ordenar la tabla por una columna en particular pulsando en la etiqueta de dicha columna.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">console.table(data [, <em>columns</em>]);
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>data</code></dt>
+ <dd>La información a mostrar. Puede ser tanto un array como un objeto.</dd>
+ <dt><code>columns</code></dt>
+ <dd>Un array que contenga los nombres de las columnas a incluir.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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("Console API", "#table", "console.table()")}}</td>
+   <td>{{Spec2("Console API")}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("34.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Disponible en workers</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("38.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("34.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Disponible en workers</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("38.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/api/crypto/getrandomvalues/index.html b/files/es/web/api/crypto/getrandomvalues/index.html
new file mode 100644
index 0000000000..f72868c167
--- /dev/null
+++ b/files/es/web/api/crypto/getrandomvalues/index.html
@@ -0,0 +1,76 @@
+---
+title: Crypto.getRandomValues()
+slug: Web/API/Crypto/getRandomValues
+tags:
+  - API
+  - Criptografía
+  - Referencia
+  - metodo
+translation_of: Web/API/Crypto/getRandomValues
+original_slug: Web/API/RandomSource/Obtenervaloresaleatorios
+---
+<p>{{APIRef("Web Crypto API")}}</p>
+
+<p>El método <code><strong>Crypto.getRandomValues()</strong></code> permite obtener valores aleatorios criptográficamente fuertes. El array que se pasa como parámetro se rellena con números aleatorios (entiéndase aleatorios en el sentido criptográfico).</p>
+
+<p>Con el fin de garantizar un rendimiento razonable, las distintas implementaciones no utilizan un generador de numeros aleatorios puro, sino que utilizan un generador numérico pseudo-aleatorio, sembrado con un valor con suficiente entropía. Los generadores numéricos pseudo-aleatorios utilizados difieren entre {{Glossary("user agent", "user agents")}}, pero son adecuados para usos criptográficos. Se require también que las distintas implementaciones usen una semilla con suficiente entropía, como una fuente de entropía a nivel de sistema.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cryptoObj</em>.getRandomValues(<em>typedArray</em>);</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><em>typedArray</em></dt>
+ <dd>Es un entero {{jsxref("TypedArray")}}, que puede ser un {{jsxref("Int8Array")}}, un {{jsxref("Uint8Array")}}, un {{jsxref("Int16Array")}}, un {{jsxref("Uint16Array")}}, un {{jsxref("Int32Array")}}, o un {{jsxref("Uint32Array")}}. Todos los elementos dentro del array seran sobreescritos con números aleatorios.</dd>
+</dl>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<ul>
+ <li>Una {{exception("QuotaExceededError")}} {{domxref("DOMException")}} es lanzada si la longitud solicitada es mayor a 65536 bytes.</li>
+</ul>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: js">/* Asumiendo que window.crypto.getRandomValues está disponible */
+
+var array = new Uint32Array(10);
+window.crypto.getRandomValues(array);
+
+console.log("Tus numeros de la suerte:");
+for (var i = 0; i &lt; array.length; i++) {
+    console.log(array[i]);
+}
+</pre>
+
+<h2 id="Specification" name="Specification">Especificación</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Crypto API', '#RandomSource-method-getRandomValues')}}</td>
+   <td>{{Spec2('Web Crypto API')}}</td>
+   <td>Definición Inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir a los datos, por favor, compruebe <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un pull request.</p>
+
+<p>{{Compat("api.Crypto.getRandomValues")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{ domxref("Window.crypto") }} para obtener un objeto tipo {{domxref("Crypto")}}.</li>
+ <li>{{jsxref("Math.random")}}, una fuente no criptográfica de números aleatorios.</li>
+</ul>
diff --git a/files/es/web/api/document/abrir/index.html b/files/es/web/api/document/abrir/index.html
deleted file mode 100644
index 13b541561d..0000000000
--- a/files/es/web/api/document/abrir/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: Document.open()
-slug: Web/API/Document/abrir
-translation_of: Web/API/Document/open
----
-<div>{{APIRef("DOM")}}</div>
-
-<p>El método <strong><code>Document.open()</code></strong> abre un documento para escritura (<a href="/en-US/docs/Web/API/Document/write" title="en/DOM/document.write">writing</a>)</p>
-
-<p>Esto viene con algunos efectos secundarios. Por ejemplo:</p>
-
-<ul>
- <li>Todos las atenciones de eventos actualmente registrados en el documento, los nodos dentro del documento o la ventana del documento son eliminados.</li>
- <li>Todos los nodos existentes se eliminan del documento.</li>
-</ul>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">document.open();
-</pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una instancia del objeto Document (<code>Document)</code>.</p>
-
-<h2 id="Example" name="Example">Ejemplos</h2>
-
-<p>El código simple a continuación abre el documento y reemplaza su contenido con un número de diferentes fragmentos HTML antes de cerrarlo nuevamente.</p>
-
-<pre class="notranslate">document.open();
-document.write("&lt;p&gt;Hola mundo!&lt;/p&gt;");
-document.write("&lt;p&gt;Soy un pez&lt;/p&gt;");
-document.write("&lt;p&gt;El numero es 42&lt;/p&gt;");
-document.close();</pre>
-
-<h2 id="Notes" name="Notes">Notas</h2>
-
-<div class="blockIndicator note">
-<p>Traducción pendiente para el texto que sigue</p>
-</div>
-
-<p>An automatic <code>document.open()</code> call happens when {{domxref("document.write()")}} is called after the page has loaded.</p>
-
-<p>For years Firefox and Internet Explorer additionally erased all JavaScript variables, etc., in addition to removing all nodes. This is no longer the case.<span class="comment">document non-spec'ed parameters to document.open</span></p>
-
-<h3 id="Gecko-specific_notes">Gecko-specific notes</h3>
-
-<p>Starting with Gecko 1.9, this method is subject to the same same-origin policy as other properties, and does not work if doing so would change the document's origin.</p>
-
-<p>Starting with Gecko 1.9.2, <code>document.open()</code> uses the <a href="/docs/Security_check_basics">principal</a> of the document whose URI it uses, instead of fetching the principal off the stack. As a result, you can no longer call {{domxref("document.write()")}} into an untrusted document from chrome, even using <a class="internal" href="/en/wrappedJSObject"><code>wrappedJSObject</code></a>. See <a href="/en/Security_check_basics" title="en/Security check basics">Security check basics</a> for more about principals.</p>
-
-<h2 id="Example" name="Example">Three-argument document.open()</h2>
-
-<p>There is a lesser-known and little-used three-argument version of <code>document.open()</code> , which is an alias of {{domxref("Window.open()")}} (see its page for full details).</p>
-
-<p>This call, for example opens github.com in a new window, with its opener set to <code>null</code>:</p>
-
-<pre class="brush: js notranslate"><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="cm-variable">document</span>.<span class="cm-property">open</span>(<span class="cm-string">'https://www.github.com'</span>,<span class="cm-string">''</span>, <span class="cm-string">'noopener=true'</span>)</span></span></span></pre>
-
-<h2 id="Two-argument_document.open"><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">Two-argument document.open()</span></span></span></h2>
-
-<p><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">Browsers used to support a two-argument <code>document.open()</code>, with the following signature:</span></span></span></p>
-
-<pre class="brush: js notranslate">document.open(<em>type</em>, <em>replace</em>)</pre>
-
-<p>Where <code>type</code> specified the MIME type of the data you are writing (e.g. <code>text/html</code>) and replace if set (i.e. a string of <code>"replace"</code>) specified that the history entry for the new document would replace the current history entry of the document being written to.</p>
-
-<p>This form is now obsolete; it won't throw an error, but instead just forwards to <code>document.open()</code> (i.e. is the equivalent of just running it with no arguments).  The history-replacement behavior now always happens.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName("HTML WHATWG", "#dom-document-open", "document.open()")}}</td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName("DOM2 HTML", "html.html#ID-72161170", "document.open()")}}</td>
-   <td>{{Spec2("DOM2 HTML")}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("api.Document.open")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{domxref("Document")}}</li>
- <li>{{domxref("Window.open()")}}</li>
-</ul>
diff --git a/files/es/web/api/document/async/index.html b/files/es/web/api/document/async/index.html
deleted file mode 100644
index 132fd106e1..0000000000
--- a/files/es/web/api/document/async/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: Document.async
-slug: Web/API/Document/async
-translation_of: Web/API/XMLDocument/async
----
-<p><code>document.async</code> es utilizado para indicar cuándo un llamado de  {{domxref("document.load")}} debe ser sincrónico o asincrónico. <code>true</code> es su valor por defecto, indicando que el documento se cargó asincrónicamente.</p>
-
-<p>(Desde la versión 1.4 alpha es posible cargar documentos sincrónicamente)</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush:js">function loadXMLData(e) {
-  alert(new XMLSerializer().serializeToString(e.target)); // Devuelve los contenidos de querydata.xml como un string
-}
-
-var xmlDoc = document.implementation.createDocument("", "test", null);
-
-xmlDoc.async = false;
-xmlDoc.onload = loadXMLData;
-xmlDoc.load('querydata.xml');</pre>
-
-<h2 id="Specification" name="Specification">Especificación</h2>
-
-<ul>
- <li><a href="http://www.w3.org/TR/DOM-Level-3-LS/load-save.html#LS-DocumentLS">DOM Level 3 Load &amp; Save module</a></li>
-</ul>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/XML_in_Mozilla" title="XML_in_Mozilla">XML in Mozilla</a></li>
- <li>{{domxref("document.load")}}</li>
-</ul>
diff --git a/files/es/web/api/document/cookie/index.html b/files/es/web/api/document/cookie/index.html
new file mode 100644
index 0000000000..631756f64e
--- /dev/null
+++ b/files/es/web/api/document/cookie/index.html
@@ -0,0 +1,120 @@
+---
+title: document.cookie
+slug: Web/API/Document/cookie
+tags:
+  - NeedsContent
+translation_of: Web/API/Document/cookie
+original_slug: DOM/document.cookie
+---
+<p>{{ApiRef("DOM")}}</p>
+
+<h3 id="Resumen" name="Resumen">Resumen</h3>
+
+<p>Con <code>document.cookie</code> se obtienen y definen las <code>cookies</code> asociadas con el documento.</p>
+
+<h2 id="Sintaxis_2">Sintaxis</h2>
+
+<h3 id="Sintaxis" name="Sintaxis">Leer todas las cookies accesibles desde una localización</h3>
+
+<pre class="eval"><em>todasLasCookies</em> = <em>document</em>.cookie;
+</pre>
+
+<p>En el código anterior <em><code>todasLasCookies</code></em> es una cadena que contiene una lista de todas las cookies separadas por punto y coma (en pares <em><code>clave=valor</code></em>). Tenga en cuenta que <var>clave</var> y <var>valor</var> pueden estar rodeadas por espacios en blanco (caracteres espacio y tabulación): de hecho <a href="https://tools.ietf.org/html/rfc6265">RFC 6265</a> especifica que debe haber un espacio en blanco después de cada punto y coma (;), pero algunos agentes de usuario no son muy estrictos con esto.</p>
+
+<h3 id="Escribir_una_nueva_cookie">Escribir una nueva cookie</h3>
+
+<pre class="eval"><em>document</em>.cookie = <em>nuevaCookie</em>;</pre>
+
+<p class="eval">En el código anterior, <em><code>nuevacookie</code></em> es una cadena de la forma <em><code>clave=valor</code></em>. Tenga en cuenta que solo se puede crear o actualizar una cookie de cada vez mediante este método. Considere también que:</p>
+
+<ul>
+ <li class="eval">Cualquiera de los siguientes atributos opcionales se puede escribir después del par clave-valor, especificando la cookie que se va a crear o actualizar, precedidos de un punto y coma.
+  <ul>
+   <li class="eval"><code>;path=<em>pat</em>h</code> (p. ej.: '/'. '/midir'). Si no se especifica, por defecto corresponde a la ruta del documento actual.<br>
+    La ruta debe ser <strong>absoluta</strong> (ver <a href="https://tools.ietf.org/html/rfc6265">RFC 6265</a>). Para más información sobre cómo utilizar rutas relativas, ir a <a href="https://developer.mozilla.org/es/docs/DOM/document.cookie$edit#Using_relative_URLs_in_the_path_parameter">este párrafo</a>.</li>
+   <li class="eval"><code>;domain=<em>domain</em></code> (p. ej. 'example.com', 'subdomain.example.com'). Si no se especifica, su valor por defecto es la porción de la dirección web de la ubicación actual del archivo. A diferencia de lo que ocurría en las primeras especificaciones, los puntos iniciales de los nombre de dominio se ignoran, pero los navegadores pueden impedir crear cookies que contengan dichos puntos. Si se especifica un dominio, los subdominios siempre son incluidos.</li>
+   <li class="eval"><code>;max-age=</code><em><code>duración-máxima-en-segundos</code></em> Por ejemplo: 60*60*24*365 para un año.</li>
+   <li class="eval"><code>;expires=</code><em><code>fecha-en-formato-GMTString</code> </em>Si no se especifica <code>max-age</code> ni <code>expires</code>, la cookie expirará al terminar la sesión actual.</li>
+   <li class="eval"><code>;secure</code> La cookie sólo será transmitida en un protocolo seguro (HTTPS, SSL). Antes de Chrmoe 52, este atributo podía aparecer con cookes de dominios http.</li>
+   <li class="eval"><code>;samesite</code> Este atributo impide al navegador enviar esta cookie a través de peticiones cross-site. Los valores posibles son lax o strict. El soporte de este atributo se añadió en Chrome 51.
+    <ul>
+     <li class="eval">El valor <em><code>strict</code></em> impide que la cookie sea enviada por el navegador al sitio destino en contexto de navegador cross-site, incluso cuando sigue un enlace regular.</li>
+     <li class="eval">El valor <em><code>lax</code></em> sólo envía cookies a las peticiones de GET de ALTO NIVEL. Es suficiente para seguir al usuario, pero evitará muchos ataques CSRF.</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+ <li class="eval">El valor de la cookie puede ser evaluado mediante <a href="/es/Referencia_de_JavaScript_1.5/Funciones_globales/encodeURIComponent" title="encodeURIComponent">encodeURIComponent()</a> para asegurarse de que dicha cadena no incluya comas, punto y coma, ni espacios en blanco (lo cual no está permitido en el valor de una cookie).</li>
+ <li class="eval">Algunas implementaciones de agente de usuario soporta los siguientes prefijos de cookie:
+  <ul>
+   <li class="eval"><code>__Secure-</code>  Señales para el navegador que solo deben incluirse en las perticiones de cookie transmitidas por un canal seguro.</li>
+   <li class="eval"><code>__Host-</code> Señales del navegador que además de la restricción de uso de cookies que provienen de un origen serugo, el ámbito de la cookie está limitado a un atributo path que proporciona el servidor. Si el servidor omite el atributo path, el directorio de las petición URI está en uso. Tabién las señales del atributo dominio no deben estar presentes, lo cual previene que la cookie sea usada en otros dominis. Para Chrome, el atributo path debe tener el mismo origen.</li>
+  </ul>
+ </li>
+</ul>
+
+<div class="geckoVersionNote">{{ gecko_callout_heading("6.0") }}</div>
+
+<div class="geckoVersionNote">Nótese que previamente a Gecko 6.0 {{ geckoRelease("6.0") }}, rutas que contenían comillas eran tratadas como si las comillas fueran parte de la cadena, en lugar de considerarse como un delimitador de la ruta actual. Esto ya ha sido arreglado.</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo" name="Ejemplo">Ejemplo # 1: Uso sencillo</h3>
+
+<pre class="brush: js">document.cookie = "nombre=oeschger";
+document.cookie = "comida_preferida=tripa";
+function alertCookie() {
+  alert(document.cookie); // visualizar: nombre=oeschger;comida favorita=tripa
+
+}</pre>
+
+<pre>&lt;button onclick="alertCookie()"&gt;Mostrar cookies&lt;/button&gt;</pre>
+
+<p>{{EmbedLiveSample('Example_1_Simple_usage', 200, 36)}}</p>
+
+<h3 id="Ejemplo_2_Obtener_una_cookie_de_ejemplo_llamada_test2">Ejemplo #2: Obtener una cookie de ejemplo llamada <em>test2</em></h3>
+
+<pre>document.cookie = "test1=Hola";
+document.cookie = "test2=Mundo";
+
+var cookieValor = document.cookie.replace(/(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/, "$1");
+
+function alertCookieValue() {
+  alert(cookieValor);
+}
+</pre>
+
+<pre>&lt;button onclick="alertCookieValue()"&gt;Mostrar valor de cookie&lt;/button&gt;</pre>
+
+<p>{{EmbedLiveSample('Example_2_Get_a_sample_cookie_named_test2', 200, 36)}}</p>
+
+<h3 id="Ejemplo_3_Hacer_algo_una_sola_vez">Ejemplo #3: Hacer algo una sola vez</h3>
+
+<p>De manera a usar el siguiente código, favor remplace todas las veces la palabra <code>hacerAlgoUnaSolaVez</code> (el nombre de la cookie) con un nombre personalizado.</p>
+
+<pre>function hazUnaVez() {
+  if (document.cookie.replace(/(?:(?:^|.*;\s*)<code>hacerAlgoUnaSolaVez</code>\s*\=\s*([^;]*).*$)|^.*$/, "$1") !== "true") {
+    alert("Hacer algo aquí!");
+    document.cookie = "<code>hacerAlgoUnaSolaVez</code>=true; expires=Fri, 31 Dec 9999 23:59:59 GMT";
+  }
+}</pre>
+
+<pre>&lt;button onclick="dhacerUnaVez()"&gt;Solo hacer algo una vez&lt;/button&gt;</pre>
+
+<p>{{EmbedLiveSample('Example_3_Do_something_only_once', 200, 36)}}</p>
+
+<h3 id="Notas" name="Notas">Seguridad</h3>
+
+<p>Es importante mencionar que la restricción path no protege contra la lectura no autorizada de cookies de una ruta distinta. Puede ser fácilmente resuelto mediante DOM (por ejemplo creando un <a href="/en/HTML/Element/iframe" title="en/HTML/Element/iframe">iframe</a> oculto con la ruta de la cookie y accediendo a la propiedad contentDocument.cookie del iframe). La única manera de proteger el acceso a cookies es ocupando un dominio o subdominio diferente, debido a la <a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">política de mismo origen</a>.</p>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li>Empezando con Firefox 2, está disponible un mejor mecanismo de almacenamiento en cliente - <a href="/es/DOM/Storage" title="es/DOM/Storage">WHATWG DOM Storage</a>.</li>
+ <li>Puedes eliminar una cookie simplemente estableciendo su fecha de expiración a cero.</li>
+ <li>Cabe mencionar que entre más cookies se tengan, mayor cantidad de datos serán transferidos entre el servidor y el cliente en cada solicitud. Esto reducirá el tiempo entre cada solicitud. Es altamente recomendado que se utilice <a href="/es/DOM/Storage" title="es/DOM/Storage">WHATWG DOM Storage</a> si se van a mantener los datos solamente en el cliente.</li>
+</ul>
+
+<h3 id="Especificaci.C3.B3n" name="Especificaci.C3.B3n">Especificación</h3>
+
+<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-8747038">DOM Level 2: HTMLDocument.cookie</a></p>
diff --git a/files/es/web/api/document/crearatributo/index.html b/files/es/web/api/document/crearatributo/index.html
deleted file mode 100644
index 22f769d577..0000000000
--- a/files/es/web/api/document/crearatributo/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: Document.createAttribute()
-slug: Web/API/Document/crearAtributo
-tags:
-  - Atributos
-  - Crear Atributo
-  - JavaScript
-  - Métodos
-translation_of: Web/API/Document/createAttribute
----
-<div>{{ ApiRef("DOM") }}</div>
-
-<p>El método <code><strong>Document.createAttribute()</strong></code> crea un nuevo nodo de tipo atributo (attr), y lo retorna. El objeto crea un nodo implementando la interfaz {{domxref("Attr")}}. El DOM no impone que tipo de atributos pueden ser agregados a un particular elemento de esta forma.</p>
-
-<div class="note">
-<p>El texto pasado como parametro es convertido a minusculas.</p>
-</div>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>atributo</em> = document.createAttribute(nombre)
-</pre>
-
-<h3 id="Parameters" name="Parameters">Parametros</h3>
-
-<ul>
- <li><code>nombre</code> es un string conteniendo el nombre del atributo.</li>
-</ul>
-
-<h3 id="Valor_que_retorna">Valor que retorna</h3>
-
-<p>Un nodo {{domxref("Attr")}} nodo.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<ul>
- <li><code>INVALID_CHARACTER_ERR</code> si el parametro contiene caracteres invalidos para un atributo XML .</li>
-</ul>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<pre class="brush:js">var nodo = document.getElementById("div1");
-var a = document.createAttribute("miAtributo");
-a.value = "nuevoVal";
-nodo.setAttributeNode(a);
-console.log(nodo.getAttribute("miAtributo")); // "nuevoVal"
-</pre>
-
-<h2 id="Specification" name="Specification">Especificaciones</h2>
-
-<table class="spectable standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-document-createattribute','Document.createAttribute()')}}</td>
-   <td>{{Spec2("DOM WHATWG")}}</td>
-   <td>Comportamiento preciso con caracteres en mayuscula </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM3 Core','core.html#ID-1084891198','Document.createAttribute()')}}</td>
-   <td>{{Spec2('DOM3 Core')}}</td>
-   <td>Sin cambios</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM2 Core','core.html#ID-1084891198','Document.createAttribute()')}}</td>
-   <td>{{Spec2('DOM2 Core')}}</td>
-   <td>Sin cambios</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM1','level-one-core.html#ID-1084891198','Document.createAttribute()')}}</td>
-   <td>{{Spec2('DOM1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_buscador">Compatibilidad del buscador</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada desde estructuras de datos. Sí le gustaría contribuir con estos datos, por favor revisar <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y enviarnos un pull request.</div>
-
-<p>{{Compat("api.Document.createAttribute")}}</p>
-
-<h2 id="Ver_ademas">Ver ademas</h2>
-
-<ul>
- <li>{{domxref("Document.createElement()")}}</li>
-</ul>
diff --git a/files/es/web/api/document/createattribute/index.html b/files/es/web/api/document/createattribute/index.html
new file mode 100644
index 0000000000..7b6ac22dc5
--- /dev/null
+++ b/files/es/web/api/document/createattribute/index.html
@@ -0,0 +1,92 @@
+---
+title: Document.createAttribute()
+slug: Web/API/Document/createAttribute
+tags:
+  - Atributos
+  - Crear Atributo
+  - JavaScript
+  - Métodos
+translation_of: Web/API/Document/createAttribute
+original_slug: Web/API/Document/crearAtributo
+---
+<div>{{ ApiRef("DOM") }}</div>
+
+<p>El método <code><strong>Document.createAttribute()</strong></code> crea un nuevo nodo de tipo atributo (attr), y lo retorna. El objeto crea un nodo implementando la interfaz {{domxref("Attr")}}. El DOM no impone que tipo de atributos pueden ser agregados a un particular elemento de esta forma.</p>
+
+<div class="note">
+<p>El texto pasado como parametro es convertido a minusculas.</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>atributo</em> = document.createAttribute(nombre)
+</pre>
+
+<h3 id="Parameters" name="Parameters">Parametros</h3>
+
+<ul>
+ <li><code>nombre</code> es un string conteniendo el nombre del atributo.</li>
+</ul>
+
+<h3 id="Valor_que_retorna">Valor que retorna</h3>
+
+<p>Un nodo {{domxref("Attr")}} nodo.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<ul>
+ <li><code>INVALID_CHARACTER_ERR</code> si el parametro contiene caracteres invalidos para un atributo XML .</li>
+</ul>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<pre class="brush:js">var nodo = document.getElementById("div1");
+var a = document.createAttribute("miAtributo");
+a.value = "nuevoVal";
+nodo.setAttributeNode(a);
+console.log(nodo.getAttribute("miAtributo")); // "nuevoVal"
+</pre>
+
+<h2 id="Specification" name="Specification">Especificaciones</h2>
+
+<table class="spectable standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#dom-document-createattribute','Document.createAttribute()')}}</td>
+   <td>{{Spec2("DOM WHATWG")}}</td>
+   <td>Comportamiento preciso con caracteres en mayuscula </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Core','core.html#ID-1084891198','Document.createAttribute()')}}</td>
+   <td>{{Spec2('DOM3 Core')}}</td>
+   <td>Sin cambios</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Core','core.html#ID-1084891198','Document.createAttribute()')}}</td>
+   <td>{{Spec2('DOM2 Core')}}</td>
+   <td>Sin cambios</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM1','level-one-core.html#ID-1084891198','Document.createAttribute()')}}</td>
+   <td>{{Spec2('DOM1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_buscador">Compatibilidad del buscador</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada desde estructuras de datos. Sí le gustaría contribuir con estos datos, por favor revisar <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y enviarnos un pull request.</div>
+
+<p>{{Compat("api.Document.createAttribute")}}</p>
+
+<h2 id="Ver_ademas">Ver ademas</h2>
+
+<ul>
+ <li>{{domxref("Document.createElement()")}}</li>
+</ul>
diff --git a/files/es/web/api/document/createevent/index.html b/files/es/web/api/document/createevent/index.html
new file mode 100644
index 0000000000..69c2e36b5c
--- /dev/null
+++ b/files/es/web/api/document/createevent/index.html
@@ -0,0 +1,36 @@
+---
+title: Event.createEvent()
+slug: Web/API/Document/createEvent
+tags:
+  - API
+  - DOM
+  - Evento
+  - metodo
+translation_of: Web/API/Document/createEvent
+translation_of_original: Web/API/Event/createEvent
+original_slug: Web/API/Event/createEvent
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>Crea un nuevo evento, que debe ser inicializado llamando a su método <code>init()</code>.</p>
+
+<h3 id="Sintaxis">Sintaxis</h3>
+
+<pre><code>document.createEvent(tipo);</code></pre>
+
+<dl>
+ <dt><code>tipo</code></dt>
+ <dd>Una string indicando el tipo de evento a crear.</dd>
+</dl>
+
+<p>Este método devuelve un nuevo objeto {{ domxref("Event") }} del DOM del tipo indicado, que debe ser inicializado antes de su uso.</p>
+
+<h3 id="Ejemplo">Ejemplo</h3>
+
+<pre>var nuevoEvento = document.createEvent("UIEvents");</pre>
+
+<h3 id="Especificación">Especificación</h3>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-document" title="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-document">DOM Level 2 Events</a></li>
+</ul>
diff --git a/files/es/web/api/document/getselection/index.html b/files/es/web/api/document/getselection/index.html
deleted file mode 100644
index 6c03b64dcf..0000000000
--- a/files/es/web/api/document/getselection/index.html
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Document.getSelection()
-slug: Web/API/Document/getSelection
-tags:
-  - Referencia
-  - Selección
-  - metodo
-translation_of: Web/API/DocumentOrShadowRoot/getSelection
-translation_of_original: Web/API/Document/getSelection
----
-<p>{{APIRef("DOM")}}</p>
-
-<p>Este método funciona exactamente igual que {{domxref("Window.getSelection()")}}; devuelve un objeto {{domxref("Selection")}} que representa el texto que se ha seleccionado en el documento.</p>
diff --git a/files/es/web/api/document/open/index.html b/files/es/web/api/document/open/index.html
new file mode 100644
index 0000000000..18d8559fdb
--- /dev/null
+++ b/files/es/web/api/document/open/index.html
@@ -0,0 +1,110 @@
+---
+title: Document.open()
+slug: Web/API/Document/open
+translation_of: Web/API/Document/open
+original_slug: Web/API/Document/abrir
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>El método <strong><code>Document.open()</code></strong> abre un documento para escritura (<a href="/en-US/docs/Web/API/Document/write" title="en/DOM/document.write">writing</a>)</p>
+
+<p>Esto viene con algunos efectos secundarios. Por ejemplo:</p>
+
+<ul>
+ <li>Todos las atenciones de eventos actualmente registrados en el documento, los nodos dentro del documento o la ventana del documento son eliminados.</li>
+ <li>Todos los nodos existentes se eliminan del documento.</li>
+</ul>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">document.open();
+</pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una instancia del objeto Document (<code>Document)</code>.</p>
+
+<h2 id="Example" name="Example">Ejemplos</h2>
+
+<p>El código simple a continuación abre el documento y reemplaza su contenido con un número de diferentes fragmentos HTML antes de cerrarlo nuevamente.</p>
+
+<pre class="notranslate">document.open();
+document.write("&lt;p&gt;Hola mundo!&lt;/p&gt;");
+document.write("&lt;p&gt;Soy un pez&lt;/p&gt;");
+document.write("&lt;p&gt;El numero es 42&lt;/p&gt;");
+document.close();</pre>
+
+<h2 id="Notes" name="Notes">Notas</h2>
+
+<div class="blockIndicator note">
+<p>Traducción pendiente para el texto que sigue</p>
+</div>
+
+<p>An automatic <code>document.open()</code> call happens when {{domxref("document.write()")}} is called after the page has loaded.</p>
+
+<p>For years Firefox and Internet Explorer additionally erased all JavaScript variables, etc., in addition to removing all nodes. This is no longer the case.<span class="comment">document non-spec'ed parameters to document.open</span></p>
+
+<h3 id="Gecko-specific_notes">Gecko-specific notes</h3>
+
+<p>Starting with Gecko 1.9, this method is subject to the same same-origin policy as other properties, and does not work if doing so would change the document's origin.</p>
+
+<p>Starting with Gecko 1.9.2, <code>document.open()</code> uses the <a href="/docs/Security_check_basics">principal</a> of the document whose URI it uses, instead of fetching the principal off the stack. As a result, you can no longer call {{domxref("document.write()")}} into an untrusted document from chrome, even using <a class="internal" href="/en/wrappedJSObject"><code>wrappedJSObject</code></a>. See <a href="/en/Security_check_basics" title="en/Security check basics">Security check basics</a> for more about principals.</p>
+
+<h2 id="Example" name="Example">Three-argument document.open()</h2>
+
+<p>There is a lesser-known and little-used three-argument version of <code>document.open()</code> , which is an alias of {{domxref("Window.open()")}} (see its page for full details).</p>
+
+<p>This call, for example opens github.com in a new window, with its opener set to <code>null</code>:</p>
+
+<pre class="brush: js notranslate"><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="cm-variable">document</span>.<span class="cm-property">open</span>(<span class="cm-string">'https://www.github.com'</span>,<span class="cm-string">''</span>, <span class="cm-string">'noopener=true'</span>)</span></span></span></pre>
+
+<h2 id="Two-argument_document.open"><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">Two-argument document.open()</span></span></span></h2>
+
+<p><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">Browsers used to support a two-argument <code>document.open()</code>, with the following signature:</span></span></span></p>
+
+<pre class="brush: js notranslate">document.open(<em>type</em>, <em>replace</em>)</pre>
+
+<p>Where <code>type</code> specified the MIME type of the data you are writing (e.g. <code>text/html</code>) and replace if set (i.e. a string of <code>"replace"</code>) specified that the history entry for the new document would replace the current history entry of the document being written to.</p>
+
+<p>This form is now obsolete; it won't throw an error, but instead just forwards to <code>document.open()</code> (i.e. is the equivalent of just running it with no arguments).  The history-replacement behavior now always happens.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "#dom-document-open", "document.open()")}}</td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM2 HTML", "html.html#ID-72161170", "document.open()")}}</td>
+   <td>{{Spec2("DOM2 HTML")}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("api.Document.open")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("Document")}}</li>
+ <li>{{domxref("Window.open()")}}</li>
+</ul>
diff --git a/files/es/web/api/document/pointerlockchange_event/index.html b/files/es/web/api/document/pointerlockchange_event/index.html
new file mode 100644
index 0000000000..462fd2a3df
--- /dev/null
+++ b/files/es/web/api/document/pointerlockchange_event/index.html
@@ -0,0 +1,81 @@
+---
+title: pointerlockchange
+slug: Web/API/Document/pointerlockchange_event
+translation_of: Web/API/Document/pointerlockchange_event
+original_slug: Web/Events/pointerlockchange
+---
+<p>El evento <code>pointerlockchange</code> es disparado cuando el cursor del navegador es bloqueado o desbloqueado.</p>
+
+<h2 id="Información_general">Información general</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Specification</dt>
+ <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/pointerlock/#pointerlockchange-and-pointerlockerror-events">Pointer Lock</a></dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interface</dt>
+ <dd style="margin: 0 0 0 120px;">Event</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
+ <dd style="margin: 0 0 0 120px;">Yes</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Target</dt>
+ <dd style="margin: 0 0 0 120px;">Document</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Default Action</dt>
+ <dd style="margin: 0 0 0 120px;">None</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col">Type</th>
+   <th scope="col">Description</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyInline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>The event target (the topmost target in the DOM tree).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The type of event.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event normally bubbles or not.</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event is cancellable or not.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush:js;">//Ten en cuenta que el nombre del evento, en este caso "pointerlockchange" puede variar según el navegador.
+document.addEventListener("pointerlockchange", function( event ) {
+    // El objetivo, parámetro "target", del objeto "event" es siempre el objeto "document".
+    // para recuperar el objeto que recibe el bloqueo/desbloqueo es document.pointerlockElement.
+    document.pointerLockElement;
+
+});
+</pre>
+
+<h2 id="Eventos_relacionados">Eventos relacionados</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Mozilla_event_reference/pointerlockerror"><code>pointerlockerror</code></a></li>
+</ul>
+
+<h2 id="Véase_también">Véase también:</h2>
+
+<ul>
+ <li><a href="/en-US/docs/API/Pointer_Lock_API">Using Pointer Lock API</a></li>
+</ul>
diff --git a/files/es/web/api/document/pointerlockelement/index.html b/files/es/web/api/document/pointerlockelement/index.html
deleted file mode 100644
index cc5d490e5c..0000000000
--- a/files/es/web/api/document/pointerlockelement/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: Document.pointerLockElement
-slug: Web/API/Document/pointerLockElement
-translation_of: Web/API/DocumentOrShadowRoot/pointerLockElement
----
-<div>{{APIRef("DOM")}}</div>
-
-<p>La propiedad <code>pointerLockElement</code> conserva el elemento adquirido, para el evento del mouse, mientras el bloqueo se encuentre activo .  Es <code>null</code> si el bloqueo se encuentra en estado pendiente para bloqueo, o si el bloqueo se ha liberado, es decir ya no se encuentra en estado bloqueado, o si el elemento bloqueado se encuentra en otro documento.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var elemento = document.pointerLockElement;
-</pre>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Un {{domxref("Element")}} o <code>null</code>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Bloquear puntero','l#extension-to-the-document-interface','Document')}}</td>
-   <td>{{Spec2('Pointer lock')}}</td>
-   <td>Extiende de la interfaz <code>Document</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad del Navegador</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{ CompatVersionUnknown() }} {{property_prefix("webkit")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatVersionUnknown() }} {{property_prefix("moz")}}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
-  <tr>
-   <td>Soporte sin prefijar</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop(50)}}</td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también:</h2>
-
-<ul>
- <li>{{ domxref("Document.exitPointerLock()") }}</li>
- <li>{{ domxref("Element.requestPointerLock()") }}</li>
- <li><a href="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock</a></li>
-</ul>
diff --git a/files/es/web/api/document/stylesheets/index.html b/files/es/web/api/document/stylesheets/index.html
deleted file mode 100644
index 0458cb3fc9..0000000000
--- a/files/es/web/api/document/stylesheets/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: Document.styleSheets
-slug: Web/API/Document/styleSheets
-translation_of: Web/API/DocumentOrShadowRoot/styleSheets
-translation_of_original: Web/API/Document/styleSheets
----
-<p>{{ ApiRef() }}</p>
-<h3 id="Summary" name="Summary">Resumen</h3>
-<p>Devuelve una lista de objetos de tipo <a href="/es/DOM/stylesheet" title="es/DOM/stylesheet">stylesheet</a> para las hojas de estilo que están específicamente enlazadas o contenidas en el documento.</p>
-<h3 id="Properties" name="Properties">Propiedades</h3>
-<p><code>styleSheetList.length</code> - devuelve el número de objetos de tipo stylesheet contenidos en el objeto.</p>
-<h3 id="Syntax" name="Syntax">Sintaxis</h3>
-<pre class="eval"><em>styleSheetList</em> = <em>document</em>.styleSheets
-</pre>
-<p>El objeto devuelto es del tipo <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/stylesheets.html#StyleSheets-DocumentStyle-styleSheets">StyleSheetList</a>.</p>
-<p>Es una colección ordenada de objetos de tipo <a href="/es/DOM/stylesheet" title="es/DOM/stylesheet">stylesheet</a>. <code><em>styleSheetList</em>.item(<em>index</em>)</code> o simplemente <code><em>styleSheetList</em>{{ mediawiki.external('
- <i>
-  index</i>
- ') }}</code> devuelve un único objeto de tipo stylesheet con el índice especificado (el índice es de origen 0).</p>
-<h3 id="Specification" name="Specification">Especificación</h3>
-<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/stylesheets.html#StyleSheets-DocumentStyle-styleSheets">DOM Level 2 Style: styleSheets</a></p>
-<p>{{ languages( { "ja": "ja/DOM/document.styleSheets", "pl": "pl/DOM/document.styleSheets" } ) }}</p>
diff --git a/files/es/web/api/document_object_model/events/index.html b/files/es/web/api/document_object_model/events/index.html
new file mode 100644
index 0000000000..5f2c1b47cf
--- /dev/null
+++ b/files/es/web/api/document_object_model/events/index.html
@@ -0,0 +1,73 @@
+---
+title: Eventos y el DOM
+slug: Web/API/Document_Object_Model/Events
+tags:
+  - DOM
+  - Guía
+translation_of: Web/API/Document_Object_Model/Events
+original_slug: Referencia_DOM_de_Gecko/Eventos
+---
+<h2 id="Introduction" name="Introduction">Introducción</h2>
+
+<p>Este capítulo describe el Modelo de Eventos del DOM. Se describe la interfaz <a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-Event">Event</a>, así como las interfaces para el registro de eventos en los nodos del DOM, y los <a href="/en-US/docs/Web/API/EventTarget.addEventListener">oyentes de eventos</a>, y varios ejemplos más largos muestran cómo se relacionan entre sí las diversas interfaces de eventos.</p>
+
+<p>Hay un diagrama excelente que explica claramente las tres fases del flujo de eventos a través del DOM en el borrador <a href="http://www.w3.org/TR/DOM-Level-3-Events/#dom-event-architecture">DOM Level 3 Events</a>.</p>
+
+<p>Vea también el <a href="/en-US/docs/DOM/DOM_Reference/Examples#Example_5:_Event_Propagation">Ejemplo 5: Propagación de eventos</a> en el capítulo de Ejemplos para un ejemplo más detallado de cómo los eventos se mueven a través del DOM.</p>
+
+<h2 id="DOM_event_handler_List" name="DOM_event_handler_List">Registrando oyentes de eventos</h2>
+
+<p>Hay 3 formas de registrar gestores de eventos para un elemento DOM.</p>
+
+<h3 id="EventTarget.addEventListener" name="EventTarget.addEventListener"><a href="/en-US/docs/Web/API/EventTarget.addEventListener"><code>EventTarget.addEventListener</code></a></h3>
+
+<pre class="brush: js">// Se supone que myButton es un elemento de botón
+myButton.addEventListener('click', function(){alert('Hello world');}, false);
+</pre>
+
+<p>Este es el método que debe usar en las páginas web modernas. </p>
+
+<p>Nota: Internet Explorer 6-8 no admite este método, ofreciendo una API similar {{domxref("EventTarget.attachEvent")}} en su lugar. Para la compatibilidad entre navegadores utilice una de las muchas bibliotecas de JavaScript disponibles.</p>
+
+<p>Se pueden encontrar más detalles en la página de referencia {{domxref("EventTarget.addEventListener")}}.</p>
+
+<h3 id="HTML_attribute" name="HTML_attribute"><a href="/en-US/docs/Web/Guide/HTML/Event_attributes">Atributo HTML</a></h3>
+
+<pre class="brush: html">&lt;button onclick="alert('Hello world!')"&gt;
+</pre>
+
+<p>El código de JavaScript en el atributo pasa el objeto Event por medio del parámetro <code>event</code>. <a href="http://dev.w3.org/html5/spec/webappapis.html#the-event-handler-processing-algorithm">El valor de retorno se trata de una manera especial, descrita en la especificación HTML</a>.</p>
+
+<p>Debe evitarse esta forma. Hace que el marcado sea más grande y menos legible. El comitido del contenido/estructura y del comportamiento no están bien separadas, por lo que es más difícil encontrar un error.</p>
+
+<h3 id="DOM_element_properties" name="DOM_element_properties">Propiedades del elemento DOM</h3>
+
+<pre class="brush: js">// Se supone que myButton es un elemento de botón
+myButton.onclick = function(event){alert('Hello world');};
+</pre>
+
+<p>La función se puede defirnir para que tome un parámetro <code>event</code>. <a href="http://dev.w3.org/html5/spec/webappapis.html#the-event-handler-processing-algorithm">El valor de retorno se trata de una manera especial, descrita en la especificación HTML</a>.</p>
+
+<p>El problema con este método es que solo se puede establecer un gestor por elemento y por evento.</p>
+
+<h2 id="Accediendo_a_las_Interfaces_de_eventos">Accediendo a las Interfaces de eventos</h2>
+
+<p>Los controladores de eventos se pueden adjuntar a varios objetos, incluidos los elementos DOM, documentos, al <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects">objeto window</a>, etc. Cuando se produce un evento, se crea un objeto de evento y se pasa secuencialmente a los oyentes del evento.</p>
+
+<p>Se puede acceder a la interfaz {{domxref ("Evento")}} desde la función del gestor, a través del objeto de evento pasado como primer argumento. El siguiente ejemplo simple muestra cómo se pasa un objeto de evento a la función del controlador de eventos, y se puede usar desde dentro de una de esas funciones.</p>
+
+<pre class="brush: js">function foo(evt) {
+  // al parámetro evt se le asigna automáticamente el objeto event
+  alert(evt);
+}
+table_el.onclick = foo;
+</pre>
+
+<h2 id="Subnav">Subnav</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Document_Object_Model">DOM Reference</a></li>
+ <li><a href="/en-US/docs/Web/API/Document_Object_Model/Introduction">Introduction to the DOM</a></li>
+ <li><a href="/en-US/docs/Web/API/Document_Object_Model/Events">Events and the DOM</a></li>
+ <li><a href="/en-US/docs/Web/API/Document_Object_Model/Examples">Examples</a></li>
+</ul>
diff --git a/files/es/web/api/document_object_model/examples/index.html b/files/es/web/api/document_object_model/examples/index.html
new file mode 100644
index 0000000000..92124a8994
--- /dev/null
+++ b/files/es/web/api/document_object_model/examples/index.html
@@ -0,0 +1,368 @@
+---
+title: Ejemplos
+slug: Web/API/Document_Object_Model/Examples
+tags:
+  - DOM
+  - Referencia_DOM_de_Gecko
+  - Todas_las_Categorías
+  - páginas_a_traducir
+translation_of: Web/API/Document_Object_Model/Examples
+original_slug: Referencia_DOM_de_Gecko/Ejemplos
+---
+<p>En este capítulo se brindan ejemplos relativamente extensos que ilustran el uso del DOM para el desarrollo web y XML. Siempre que sea posible, usaremos las APIs, trucos y patrones comunes en JavaScript para la manipulación del objeto <code>document</code>.</p>
+
+<h3 id="Ejemplo_1:_Altos_y_anchos" name="Ejemplo_1:_Altos_y_anchos">Ejemplo 1: Altos y anchos</h3>
+
+<p>El ejemplo siguiente muestra el uso de las propiedades de alto (<code>height</code>) y ancho (<code>width</code>) junto a imágenes de dimensiones variadas:</p>
+
+<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd"&gt;
+
+&lt;html lang="es"&gt;
+
+&lt;head&gt;
+&lt;title&gt;Ejemplo de height/width&lt;/title&gt;
+&lt;script type="text/javascript"&gt;
+function iniciar()
+{
+  var arrImages = new Array(3);
+  arrImages[0] = document.getElementById("imagen1");
+  arrImages[1] = document.getElementById("imagen2");
+  arrImages[2] = document.getElementById("imagen3");
+  var objOutput = document.getElementById("salida");
+  var strHtml = "&lt;ul&gt;";
+  for (var i = 0; i &lt; arrImages.length; i++)
+    strHtml += "&lt;li&gt;imagen" + (i+1) +
+            ": height=" + arrImages[i].height +
+            ", width=" + arrImages[i].width +
+            ", style.height=" + arrImages[i].style.height +
+            ", style.width=" + arrImages[i].style.width +
+            "&lt;\/li&gt;";
+  strHtml += "&lt;\/ul&gt;";
+  salida.innerHTML = strHtml;
+}
+&lt;/script&gt;
+&lt;/head&gt;
+&lt;body onload="iniciar();"&gt;
+
+&lt;p&gt;La 1ª imagen:
+- alto (height): no
+- ancho (width): no
+- estilo (style): no
+    &lt;img id="imagen1" src="http://www.mozilla.org/images/mozilla-banner.gif"&gt;
+&lt;/p&gt;
+&lt;p&gt;La 2ª imagen:
+- height="50"
+- width="500"
+- style: no
+    &lt;img id="imagen2" src="http://www.mozilla.org/images/mozilla-banner.gif"
+         height="50" width="500"&gt;
+&lt;/p&gt;
+&lt;p&gt;La 3ª imagen:
+- height y width: no
+- style="height: 50px; width: 500px;": sí
+    &lt;img id="imagen3" src="http://www.mozilla.org/images/mozilla-banner.gif"
+         style="height: 50px; width: 500px;"&gt;
+&lt;/p&gt;
+
+&lt;div id="salida"&gt; &lt;/div&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p><code>height</code> y <code>width</code> son además propiedades de los elementos <code>OBJECT</code> y <code>APPLET</code>.</p>
+
+<h3 id="Ejemplo_2:_Atributos_de_una_imagen" name="Ejemplo_2:_Atributos_de_una_imagen">Ejemplo 2: Atributos de una imagen</h3>
+
+<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd"&gt;
+
+&lt;html lang="es"&gt;
+
+&lt;head&gt;
+&lt;title&gt;Modificación del borde de una imagen&lt;/title&gt;
+&lt;script type="text/javascript"&gt;
+function setBorderWidth(width) {
+  document.getElementById("img1").style.borderWidth = width + "px";
+}
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+&lt;p&gt;
+  &lt;img id="img1" src="image1.gif" style="border: 5px solid green;" width="100"
+height="100" alt="test de borde"&gt;
+&lt;/p&gt;
+
+&lt;form name="Formulario"&gt;
+  &lt;p&gt;&lt;input type="button" value="Definir un borde de 20px"
+onclick="setBorderWidth(20);"&gt; &lt;input type="button" value="Definir un borde de 5px"
+onclick="setBorderWidth(5);"&gt;&lt;/p&gt;
+&lt;/form&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="Ejemplo_3:_Manipulaci.C3.B3n_de_estilos" name="Ejemplo_3:_Manipulaci.C3.B3n_de_estilos">Ejemplo 3: Manipulación de estilos</h3>
+
+<p>En este ejemplo sencillo, algunas propiedades de estilo básicas de un elemento párrafo HTML son accedidas utilizando el objeto estilo en el elemento y aquellas propiedades de estilo CSS del objeto, pueden ser entregadas y establecidas desde el DOM. En este caso, está manipulando los estilos directamente. En el siguiente ejemplo (ver ejemplo 4), puede utilizar las hojas de estilo y sus reglas para cambiar estilos para el documento entero.</p>
+
+<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd"&gt;
+
+&lt;html lang="en"&gt;
+
+&lt;head&gt;
+&lt;title&gt;Changing color and font-size example&lt;/title&gt;
+&lt;script type="text/javascript"&gt;
+function changeText() {
+	var p = document.getElementById("pid");
+	p.style.color = "blue"
+	p.style.fontSize = "18pt"
+}
+&lt;/script&gt;
+&lt;/head&gt;
+&lt;body&gt;
+&lt;p id="pid"
+onclick="window.location.href = 'http://www.cnn.com/';"&gt;linker&lt;/p&gt;
+&lt;form&gt;
+&lt;p&gt;&lt;input value="rec" type="button" onclick="changeText();"&gt;&lt;/p&gt;
+&lt;/form&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="Ejemplo_4:_Utilizaci.C3.B3n_de_las_hojas_de_estilo" name="Ejemplo_4:_Utilizaci.C3.B3n_de_las_hojas_de_estilo">Ejemplo 4: Utilización de las hojas de estilo</h3>
+
+<p>La propiedad de las hojas de estilo en un objeto de documento muestra una lista de las hojas de estilo que acompañan a ése documento. Usando los objetos de la hoja de estilo, del estilo y de las reglas de CSS se puede acceder individualmente a esas hojas de estilo y sus reglas, como se demuestra en este ejemplo, el cual muestra todos los selectores de reglas de estilo en la consola.</p>
+
+<pre>ss = document.styleSheets;
+for(i=0; i&lt;ss.length; i++)
+ {
+ for(j=0; j&lt;ss[0].cssRules.length; j++)
+  {
+  dump( ss[i].cssRules[j].selectorText + "\n" );
+  }
+ }
+</pre>
+
+<p>Para un documento con una sola hoja de estilo en la cual son definidas las tres reglas siguientes:</p>
+
+<pre class="eval">BODY { background-color: darkblue; }
+P { font-face: Arial; font-size: 10pt; margin-left: .125in; }
+#lumpy { display: none; }
+</pre>
+
+<p>El script sale así:</p>
+
+<pre class="eval">BODY
+P
+#LUMPY
+</pre>
+
+<h3 id="Ejemplo_5:_Propagaci.C3.B3n_del_evento" name="Ejemplo_5:_Propagaci.C3.B3n_del_evento">Ejemplo 5: Propagación del evento</h3>
+
+<p>Este ejemplo muestra de una forma muy simple como los eventos se inician y son gestionados en el DOM. Cuando el cuerpo (<em>body</em> ) de ese documento HTML se carga,<em>un evento listener es registrado con la columna superior de la TABLA. El evento listener maneja el evento ejecutando la función stopEvent, que cambia el valor en el final de la celda de la tabla.</em></p>
+
+<p>Sin embargo, stopEvent también llama a un método del objeto evento, <a href="es/DOM/event.stopPropagation">event.stopPropagation</a>, que mantiene el evento del burbujeo a continuación dentro del DOM. Note que la tabla misma tiene un manejador de evento <a href="es/DOM/element.onclick">onclick</a> que muestra un mensaje cuando la tabla es seleccionada. Pero el método stopEvent ha detenido la propagación, y así despues los datos en la tabla son actualizados, la fase de evento es efectivamente finalizada, y un cuadro de alerta es mostrado para confirmar esto.</p>
+
+<pre>&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;Propagación del evento&lt;/title&gt;
+
+&lt;style type="text/css"&gt;
+ #t-daddy { border: 1px solid red }
+ #c1 { background-color: pink; }
+&lt;/style&gt;
+
+&lt;script type="text/javascript"&gt;
+
+function stopEvent(ev) {
+  c2 = document.getElementById("c2");
+  c2.innerHTML = "hola";
+
+  // this ought to keep t-daddy from getting the click.
+  ev.stopPropagation();
+  alert("La propagación del evento se ha parado.");
+}
+
+function load() {
+  elem = document.getElementById("tbl1");
+  elem.addEventListener("click", stopEvent, false);
+}
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body onload="load();"&gt;
+
+&lt;table id="t-daddy" onclick="alert('hi');"&gt;
+ &lt;tr id="tbl1"&gt;
+  &lt;td id="c1"&gt;uno&lt;/td&gt;
+ &lt;/tr&gt;
+ &lt;tr&gt;
+  &lt;td id="c2"&gt;dos&lt;/td&gt;
+ &lt;/tr&gt;
+&lt;/table&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="Ejemplo_6:_Conseguir_el_estilo_computado_.28getComputedStyle.29" name="Ejemplo_6:_Conseguir_el_estilo_computado_.28getComputedStyle.29">Ejemplo 6: Conseguir el estilo computado (getComputedStyle)</h3>
+
+<p>Este ejemplo demuestra como el método <a href="es/DOM/window.getComputedStyle">window.getComputedStyle</a> puedes utilizarse para obtener los estilos de un elemento que no son especificados en el atributo <code>style</code> o con JavaScript (por ejemplo, <strong><span class="highlightgreen"><code>element.style.backgroundColor="rgb(173, 216, 230)"</code></span></strong>). Estos últimos tipos de estilos se pueden recuperar con el atributo <a href="es/DOM/element.style">element.style</a>, las propiedades del cual están en la <a href="es/DOM/CSS">lista de propiedades de CSS</a> del DOM.</p>
+
+<p><code>getComputedStyle()</code> devuelve un objeto <code>ComputedCSSStyleDeclaration</code>, cuyas propiedades de estilo individuales pueden ser referenciadas con este método del objeto <code>getPropertyValue()</code>, el siguiente documento de ejemplo lo muestra.</p>
+
+<pre>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+"http://www.w3.org/TR/html4/strict.dtd"&gt;
+
+&lt;html lang="en"&gt;
+
+&lt;head&gt;
+ &lt;title&gt;Ejemplo de ''getComputedStyle''&lt;/title&gt;
+
+ &lt;script type="text/javascript"&gt;
+   function cStyles()
+  {
+   var RefDiv = document.getElementById("d1");
+
+   var txtHeight = document.getElementById("t1");
+   var h_style =
+document.defaultView.getComputedStyle(RefDiv, null).getPropertyValue("height");
+   txtHeight.value = h_style;
+
+   var txtWidth = document.getElementById("t2");
+   var w_style =
+document.defaultView.getComputedStyle(RefDiv, null).getPropertyValue("width");
+   txtWidth.value = w_style;
+
+   var txtBackgroundColor = document.getElementById("t3");
+   var b_style =
+document.defaultView.getComputedStyle(RefDiv,
+null).getPropertyValue("background-color");
+   txtBackgroundColor.value = b_style;
+  }
+ &lt;/script&gt;
+
+ &lt;style type="text/css"&gt;
+   #d1 { margin-left: 10px; background-color: rgb(173, 216, 230);
+height: 20px; max-width: 20px; }
+ &lt;/style&gt;
+
+&lt;/head&gt;
+
+&lt;body&gt;
+
+&lt;div id="d1"&gt;&amp;nbsp;&lt;/div&gt;
+
+&lt;form action=""&gt;
+&lt;p&gt;&lt;button type="button" onclick="cStyles();"&gt;getComputedStyle&lt;/button&gt;
+  height&lt;input id="t1" type="text" value="1"&gt;
+  max-width&lt;input id="t2" type="text" value="2"&gt;
+  bg-color&lt;input id="t3" type="text" value="3"&gt;&lt;/p&gt;
+&lt;/form&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="Ejemplo_7:_Mostrar_las_propiedades_del_objeto_de_evento" name="Ejemplo_7:_Mostrar_las_propiedades_del_objeto_de_evento">Ejemplo 7: Mostrar las propiedades del objeto de evento</h3>
+
+<p>Este ejemplo utiliza métodos del DOM para mostrar todas las propiedades del <a href="es/DOM/event">evento</a> de <a href="es/DOM/window.onload">window.onload</a> y sus valores en una tabla. Muestra además una cómoda técnica del uso de un bucle<em><strong>for...in</strong></em> para iterar sobre las propiedades de un objeto y conseguir sus valores.</p>
+
+<p>Las propiedades de los objetos de evento difieren bastante entre los navegadores, la <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html">especificación W3C de los eventos del DOM 2</a> enumera las propiedades estándares, sin embargo algunos navegadores han extendido estas diferencias.</p>
+
+<p>El siguiente código colocado dentro de un nuevo archivo de texto y cargado en un surtido de navegadores, sorprenderá por las diferencias de los números y nombres de propiedades y/o al ponerle más elementos a la página y llamar esa función desde diferentes gestores de evento.</p>
+
+<pre>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+   "http://www.w3.org/TR/html4/strict.dtd"&gt;
+
+&lt;title&gt;Muestra las propiedades del evento&lt;/title&gt;
+
+&lt;style type="text/css"&gt;
+  table {border-collapse: collapse;}
+  thead {font-weight: bold;}
+  td {padding: 2px 10px 2px 10px;}
+  .odd {background-color: #efdfef;}
+  .even {background-color: #ffffff;}
+&lt;/style&gt;
+
+&lt;script type="text/javascript"&gt;
+
+function showEventProperties(e)
+{
+  function addCell(row, text) {
+    var cell = row.insertCell(-1);
+    cell.appendChild(document.createTextNode(text));
+  }
+
+  document.getElementById('eventType').innerHTML = e.type;
+
+  var e = e || window.event;
+  var table = document.createElement('table');
+  var thead = table.createTHead();
+  var row = thead.insertRow(-1);
+  var lableList = ['#', 'Propriété', 'Valeur'];
+  var len = lableList.length;
+
+  for (var i=0; i&lt;len; i++) {
+    addCell(row, lableList[i]);
+  }
+
+  var tbody = document.createElement('tbody');
+  table.appendChild(tbody);
+
+  for (var p in e) {
+    row = tbody.insertRow(-1);
+    row.className = (row.rowIndex % 2)? 'odd':'even';
+    addCell(row, row.rowIndex);
+    addCell(row, p);
+    addCell(row, e[p]);
+  }
+
+  document.body.appendChild(table);
+}
+window.onload = function(event){
+  showEventProperties(event);
+}
+&lt;/script&gt;
+
+&lt;h1&gt;Propiedades del objeto evento del DOM&lt;span id="eventType"&gt;&lt;/span&gt;&lt;/h1&gt;
+</pre>
+
+<h3 id="Ejemplo_8:_Utilizaci.C3.B3n_del_interfaz_de_tabla_del_DOM" name="Ejemplo_8:_Utilizaci.C3.B3n_del_interfaz_de_tabla_del_DOM">Ejemplo 8: Utilización del interfaz de tabla del DOM</h3>
+
+<p>La interfaz HTMLTableElement del DOM provee algunos métodos de conveniencia para crear y manipular tablas. Dos métodos usados frecuentemente son <code><a href="es/DOM/table.insertRow">table.insertRow</a></code> y <code><a href="es/DOM/table/row.insertCell">row.insertCell</a></code>.</p>
+
+<p>Para agregar una columna y algunas celdas a una tabla existente:</p>
+
+<pre>&lt;table id="table0"&gt;
+ &lt;tr&gt;
+  &lt;td&gt;Row 0 Cell 0&lt;/td&gt;
+  &lt;td&gt;Row 0 Cell 1&lt;/td&gt;
+ &lt;/tr&gt;
+&lt;/table&gt;
+
+&lt;script type="text/javascript"&gt;
+
+var table = document.getElementById('table0');
+var row = table.insertRow(-1);
+var cell, text;
+for (var i=0; i&lt;2; i++) {
+  cell = row.insertCell(-1);
+  text = 'Row ' + row.rowIndex + ' Cell ' + i;
+  cell.appendChild(document.createTextNode(text));
+}
+
+&lt;/script&gt;
+</pre>
+
+<h4 id="Notas" name="Notas">Notas</h4>
+
+<ul>
+ <li>Una propiedad <code><a href="es/DOM/element.innerHTML">innerHTML</a></code> de la tabla nunca debería ser utilizada para modificar una tabla, aunque puede utilizarla para escribir una tabla entera o el contenido de una celda.</li>
+ <li>Si los métodos Core del DOM<code><a href="es/DOM/document.createElement">document.createElement</a></code> y <code><a href="es/DOM/element.appendChild">element.appendChild</a></code> son utilizados para crear columnas y celdas, IE requiere que sean agregadas a un elemento tbody, mientras que otros navegadores permitirán agregar a un elemento de la tabla (las columnas serán agregadas al último elemento tbody).</li>
+ <li>Hay un número de otros métodos de conveniencia pertenecientes a la <a href="es/DOM/table#M.C3.A9todos">interfaz de tabla</a> que pueden ser utilizados para crear y modificar tablas.</li>
+</ul>
diff --git a/files/es/web/api/document_object_model/how_to_create_a_dom_tree/index.html b/files/es/web/api/document_object_model/how_to_create_a_dom_tree/index.html
new file mode 100644
index 0000000000..71864ae1fa
--- /dev/null
+++ b/files/es/web/api/document_object_model/how_to_create_a_dom_tree/index.html
@@ -0,0 +1,131 @@
+---
+title: Cómo crear un DOM tree
+slug: Web/API/Document_object_model/How_to_create_a_DOM_tree
+translation_of: Web/API/Document_object_model/How_to_create_a_DOM_tree
+original_slug: How_to_create_a_DOM_tree
+---
+<p> </p>
+<p>Esta página describe cómo usar el API <a class="external" href="http://www.w3.org/TR/DOM-Level-3-Core/core.html">DOM Core</a> en JavaScript para crear o modificar objetos DOM. Es aplicable a todas las aplicaciones basadas en Gecko (como Mozilla Firefox) cuyo código tenga privilegios (como las extensiones) y a las que no (páginas web).</p>
+<h3 id="Dynamically_creating_a_DOM_tree" name="Dynamically_creating_a_DOM_tree">Creación dinámica de un DOM tree</h3>
+<p>Considere el siguiente documento XML:</p>
+<pre class="brush: xml">&lt;?xml version="1.0"?&gt;
+&lt;people&gt;
+  &lt;person first-name="eric" middle-initial="H" last-name="jung"&gt;
+    &lt;address street="321 south st" city="denver" state="co" country="usa"/&gt;
+    &lt;address street="123 main st" city="arlington" state="ma" country="usa"/&gt;
+  &lt;/person&gt;
+
+  &lt;person first-name="jed" last-name="brown"&gt;
+    &lt;address street="321 north st" city="atlanta" state="ga" country="usa"/&gt;
+    &lt;address street="123 west st" city="seattle" state="wa" country="usa"/&gt;
+    &lt;address street="321 south avenue" city="denver" state="co" country="usa"/&gt;
+  &lt;/person&gt;
+&lt;/people&gt;
+</pre>
+<p>El W3C DOM API soportado por Mozilla, puede ser usado para crear una representación en memoria del documento anterior, como se ve a continuación:</p>
+<pre class="brush: js">var doc = document.implementation.createDocument("", "", null);
+var peopleElem = doc.createElement("people");
+
+var personElem1 = doc.createElement("person");
+personElem1.setAttribute("first-name", "eric");
+personElem1.setAttribute("middle-initial", "h");
+personElem1.setAttribute("last-name", "jung");
+
+var addressElem1 = doc.createElement("address");
+addressElem1.setAttribute("street", "321 south st");
+addressElem1.setAttribute("city", "denver");
+addressElem1.setAttribute("state", "co");
+addressElem1.setAttribute("country", "usa");
+personElem1.appendChild(addressElem1);
+
+var addressElem2 = doc.createElement("address");
+addressElem2.setAttribute("street", "123 main st");
+addressElem2.setAttribute("city", "arlington");
+addressElem2.setAttribute("state", "ma");
+addressElem2.setAttribute("country", "usa");
+personElem1.appendChild(addressElem2);
+
+var personElem2 = doc.createElement("person");
+personElem2.setAttribute("first-name", "jed");
+personElem2.setAttribute("last-name", "brown");
+
+var addressElem3 = doc.createElement("address");
+addressElem3.setAttribute("street", "321 north st");
+addressElem3.setAttribute("city", "atlanta");
+addressElem3.setAttribute("state", "ga");
+addressElem3.setAttribute("country", "usa");
+personElem2.appendChild(addressElem3);
+
+var addressElem4 = doc.createElement("address");
+addressElem4.setAttribute("street", "123 west st");
+addressElem4.setAttribute("city", "seattle");
+addressElem4.setAttribute("state", "wa");
+addressElem4.setAttribute("country", "usa");
+personElem2.appendChild(addressElem4);
+
+var addressElem5 = doc.createElement("address");
+addressElem5.setAttribute("street", "321 south avenue");
+addressElem5.setAttribute("city", "denver");
+addressElem5.setAttribute("state", "co");
+addressElem5.setAttribute("country", "usa");
+personElem2.appendChild(addressElem5);
+
+peopleElem.appendChild(personElem1);
+peopleElem.appendChild(personElem2);
+doc.appendChild(peopleElem);
+</pre>
+<p>Vea también el <a href="/en/XUL_Tutorial/Document_Object_Model" title="en/XUL_Tutorial/Document_Object_Model"> Capítulo DOM del Tutorial de XUL</a>.</p>
+<p>Se puede automatizar la creación de un DOM tree usando el <a href="/en/JXON#JXON_reverse_algorithms" title="en/JXON#JXON_reverse_algorithms">JXON reverse algorithm (algoritmo inverso JXON)</a> en asociación con la siguiente representación JSON:</p>
+<pre class="brush: js">{
+  "people": {
+    "person": [{
+      "address": [{
+        "@street": "321 south st",
+        "@city": "denver",
+        "@state": "co",
+        "@country": "usa"
+      }, {
+        "@street": "123 main st",
+        "@city": "arlington",
+        "@state": "ma",
+        "@country": "usa"
+      }],
+      "@first-name": "eric",
+      "@middle-initial": "H",
+      "@last-name": "jung"
+    }, {
+      "address": [{
+        "@street": "321 north st",
+        "@city": "atlanta",
+        "@state": "ga",
+        "@country": "usa"
+      }, {
+        "@street": "123 west st",
+        "@city": "seattle",
+        "@state": "wa",
+        "@country": "usa"
+      }, {
+        "@street": "321 south avenue",
+        "@city": "denver",
+        "@state": "co",
+        "@country": "usa"
+      }],
+      "@first-name": "jed",
+      "@last-name": "brown"
+    }]
+  }
+}
+</pre>
+<h3 id="So_what.3F" name="So_what.3F">¿Ahora qué?</h3>
+<p>Los DOM trees pueden ser <a href="/en/Using_XPath" title="en/Using_XPath">invocados usando expresiones XPath</a>, convertidos a cadenas de texto, salvados a un archivo local o remoto usando <a href="/en/Parsing_and_serializing_XML" title="en/Parsing_and_serializing_XML">XMLSerializer</a> (sin tener que convertirlo primero a una cadena de texto), Enviados mediante <a href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest">POST a un servidor web</a> (via <code>XMLHttpRequest</code>), transformados usando <a href="/en/XSLT" title="en/XSLT">XSLT</a>, <a href="/en/XLink" title="en/XLink">XLink</a>, convertidos a un objeto JavaScript a tráves del  <a href="/en/JXON" title="en/JXON">algoritmo </a><a href="/en/JXON" title="en/JXON">JXON</a>, etc.</p>
+<p>Adicionalmente se puede hacer uso de los DOM trees para modelar los datos que no estén bien formados para RDF (o si sólo no prefieres usar RDF). Otra aplicación que puedes darle, se relaciona a XUL (que es XML), la UI (interfaz) de tu aplicación puede ser manipulada dinámicamente, descargada, subida, guardada, cargada, convertida, o transformada fácilmente.</p>
+<h2 id="Vea_también">Vea también</h2>
+<ul>
+ <li><a class="internal" href="/en/XML" title="en/XML">XML</a></li>
+ <li><a class="internal" href="/en/JXON" title="en/JXON">JXON</a></li>
+ <li><a class="internal" href="/en/XPath" title="en/XPath">XPath</a></li>
+ <li><a class="internal" href="/en/E4X" title="en/E4X">E4X (ECMAScript for XML)</a></li>
+ <li><a class="internal" href="/en/Parsing_and_serializing_XML" title="en/Parsing_and_serializing_XML">Parsing and serializing XML</a></li>
+ <li><a class="internal" href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a></li>
+</ul>
+<p>{{ languages( { "fr": "fr/Comment_cr\u00e9er_un_arbre_DOM", "ja": "ja/How_to_create_a_DOM_tree", "zh-cn": "zh-cn/How_to_create_a_DOM_tree" } ) }}</p>
diff --git a/files/es/web/api/document_object_model/index.html b/files/es/web/api/document_object_model/index.html
new file mode 100644
index 0000000000..ee5003ec08
--- /dev/null
+++ b/files/es/web/api/document_object_model/index.html
@@ -0,0 +1,92 @@
+---
+title: Referencia DOM de Gecko
+slug: Web/API/Document_Object_Model
+tags:
+  - DOM
+  - NecesitaRevisiónTécnica
+  - Todas_las_Categorías
+translation_of: Web/API/Document_Object_Model
+original_slug: Referencia_DOM_de_Gecko
+---
+<p>
+« <a href="es/Referencia_DOM_de_Gecko">Referencia DOM de Gecko</a>
+</p><p><br>
+Aquí está la tabla de contenido para la referencia <a href="es/DOM">DOM</a> de <a href="es/Gecko">Gecko</a>.
+</p>
+<h4 id="Prefacio"> <a href="es/Referencia_DOM_de_Gecko/Prefacio">Prefacio</a> </h4>
+<ul><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Sobre_.C3.A9sta_referencia">Sobre ésta referencia</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#A_qui.C3.A9n_est.C3.A1_dirigida_esta_gu.C3.ADa.3F">A quién está dirigida esta guía?</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Qu.C3.A9_es_Gecko.3F">Qué es Gecko?</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Sintaxis_del_API">Sintaxis del API</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Prefacio#Utilizaci.C3.B3n_de_ejemplos">Utilización de ejemplos</a>
+</li></ul>
+<h4 id="Introducci.C3.B3n"> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n">Introducción</a> </h4>
+<ul><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Qu.C3.A9_es_el_DOM.3F">Qué es el DOM?</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#DOM_y_JavaScript">DOM y JavaScript</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#C.C3.B3mo_se_accede_al_DOM.3F">Cómo se accede al DOM?</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Importancia_de_los_tipos_de_datos">Tipos de datos importantes</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Interfaces_del_DOM">Interfaces del DOM</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Introducci%c3%b3n#Probando_el_API_del_DOM">Probando el API del DOM</a>
+</li></ul>
+<h4 id="La_referencia_al_elemento_.28element.29_de_DOM"> <a href="es/DOM/element">La referencia al elemento (<code>element</code>) de DOM</a> </h4>
+<ul><li> <a href="es/DOM/element#Introducci.C3.B3n">Introducción</a>
+</li><li> <a href="es/DOM/element#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/element#M.C3.A9todos">Métodos</a>
+</li><li> <a href="es/DOM/element#Manejo_de_los_eventos">Manejo de los eventos</a>
+</li></ul>
+<h4 id="La_referencia_a_la_ventana_.28window.29_de_DOM"> <a href="es/DOM/window">La referencia a la ventana (<code>window</code>) de DOM</a> </h4>
+<ul><li> <a href="es/DOM/window#Introducci.C3.B3n">Introducción</a>
+</li><li> <a href="es/DOM/window#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/window#M.C3.A9todos">Métodos</a>
+</li><li> <a href="es/DOM/window#Manejo_de_los_eventos">Manejo de los eventos</a>
+</li></ul>
+<h4 id="La_referencia_al_document_de_DOM"> <a href="es/DOM/document">La referencia al <code>document</code> de DOM</a> </h4>
+<ul><li> <a href="es/DOM/document#Introducci.C3.B3n">Introducción</a>
+</li><li> <a href="es/DOM/document#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/document#M.C3.A9todos">Métodos</a>
+</li></ul>
+<h4 id="La_referencia_al_event_de_DOM"> <a href="es/DOM/event">La referencia al <code>event</code> de DOM</a> </h4>
+<ul><li> <a href="es/DOM/event#Introducci.C3.B3n">Introducción</a>
+</li><li> <a href="es/DOM/event#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/event#M.C3.A9todos">Métodos</a>
+</li></ul>
+<h4 id="La_referencia_al_estilo_.28style.29_de_DOM"> <a href="es/DOM/style">La referencia al estilo (<code>style</code>) de DOM</a> </h4>
+<ul><li> <a href="es/DOM/style#Notas">Notas</a>
+</li><li> <a href="es/DOM/style#Material_que_se_mover.C3.A1_a_otras_p.C3.A1ginas"> Material que se moverá a otras páginas</a>
+</li></ul>
+<h4 id="La_referencia_al_rango_.28range.29_de_DOM"> <a href="es/DOM/range">La referencia al rango (<code>range</code>) de DOM</a> </h4>
+<ul><li> <a href="es/DOM/range#Introducci.C3.B3n">Introducción</a>
+</li><li> <a href="es/DOM/range#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/range#M.C3.A9todos">Métodos</a>
+</li></ul>
+<h4 id="La_referencia_a_la_selecci.C3.B3n_.28selection.29_de_DOM"> <a href="es/DOM/selection">La referencia a la selección (<code>selection</code>) de DOM</a> </h4>
+<ul><li> <a href="es/DOM/Selection#Introducci.C3.B3n">Introducción</a>
+</li><li> <a href="es/DOM/Selection#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/Selection#M.C3.A9todos">Métodos</a>
+</li></ul>
+<h4 id="Interfaz_del_elemento_formulario_.28form.29_en_HTML"> <a href="es/DOM/form">Interfaz del elemento formulario (<code>form</code>) en HTML</a> </h4>
+<ul><li> <a href="es/DOM/form#Interfaz_del_elemento_formulario_en_HTML">Interfaz del elemento formulario en HTML</a>
+</li><li> <a href="es/DOM/form#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/form#M.C3.A9todos">Métodos</a>
+</li></ul>
+<h4 id="Interfaz_del_elemento_tabla_.28table.29_en_HTML"> <a href="es/DOM/table">Interfaz del elemento tabla (<code>table</code>) en HTML</a> </h4>
+<ul><li> <a href="es/DOM/table#Interfaz_del_elemento_tabla_en_HTML">Interfaz del elemento tabla en HTML</a>
+</li><li> <a href="es/DOM/table#Propiedades">Propiedades</a>
+</li><li> <a href="es/DOM/table#M.C3.A9todos">Métodos</a>
+</li></ul>
+<h4 id="Ejemplos_DOM"> <a href="es/Referencia_DOM_de_Gecko/Ejemplos">Ejemplos DOM</a> </h4>
+<ul><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_1:_Altos_y_anchos">Ejemplo 1: Altos y anchos</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_2:_Atributos_de_una_imagen">Ejemplo 2: Atributos de una imagen</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_3:_Manipulaci.C3.B3n_de_estilos">Ejemplo 3: Manipulación de estilos</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_4:_Utilizaci.C3.B3n_de_la_hoja_de_estilo">Ejemplo 4: Utilización de la hoja de estilo</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_5:_Propagaci.C3.B3n_del_evento">Ejemplo 5: Propagación del evento</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_6:_Conseguir_el_estilo_computado">Ejemplo 6: Conseguir el estilo computado (<code>getComputedStyle</code>)</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_7:_Mostrar_las_propiedades_del_objeto_de_evento">Ejemplo 7: Mostrar las propiedades del objeto de evento</a>
+</li><li> <a href="es/Referencia_DOM_de_Gecko/Ejemplos#Ejemplo_8:_Utilizaci.C3.B3n_del_interfaz_de_tabla_del_DOM">Ejemplo 8: Utilización del interfaz de tabla del DOM</a>
+</li></ul>
+<div class="originaldocinfo">
+<h3 id="Informaci.C3.B3n_sobre_el_documento_original"> Información sobre el documento original </h3>
+<ul><li> Última actualización: 22 de Octubre de 2006
+</li></ul>
+</div>
+{{ languages( { "en": "en/Gecko_DOM_Reference", "fr": "fr/R\u00e9f\u00e9rence_du_DOM_Gecko", "it": "it/Reference_del_DOM_di_Gecko", "ja": "ja/Gecko_DOM_Reference", "ko": "ko/Gecko_DOM_Reference", "pl": "pl/Dokumentacja_Gecko_DOM", "zh-cn": "cn/Gecko_DOM_\u53c2\u8003" } ) }}
diff --git a/files/es/web/api/document_object_model/introduction/index.html b/files/es/web/api/document_object_model/introduction/index.html
new file mode 100644
index 0000000000..b6c5706536
--- /dev/null
+++ b/files/es/web/api/document_object_model/introduction/index.html
@@ -0,0 +1,249 @@
+---
+title: Introducción
+slug: Web/API/Document_Object_Model/Introduction
+tags:
+  - DOM
+  - Gecko
+  - Manuales
+  - Todas_las_Categorías
+translation_of: Web/API/Document_Object_Model/Introduction
+original_slug: Referencia_DOM_de_Gecko/Introducción
+---
+<p> </p>
+
+<p>Ésta sección da una breve introducción conceptual del <a href="es/DOM">DOM</a>: qué es, cómo proporciona la estructura para los documentos <a href="es/HTML">HTML</a> y <a href="es/XML">XML</a>, cómo se accede a él, y cómo esta <a href="https://es.wikipedia.org/wiki/Interfaz_de_programaci%C3%B3n_de_aplicaciones">"API"</a> presenta la información de referencia y ejemplos.</p>
+
+<h2 id=".C2.BFQu.C3.A9_es_el_DOM.3F" name=".C2.BFQu.C3.A9_es_el_DOM.3F">¿Qué es el DOM?</h2>
+
+<p>El modelo de objeto de documento (DOM) es una interfaz de programación para los documentos HTML y XML. Facilita una representación estructurada del documento y define de qué manera los programas pueden acceder, al fin de modificar, tanto su estructura, estilo y contenido. El DOM da una representación del documento como un grupo de nodos y objetos estructurados que tienen propiedades y métodos. Esencialmente, conecta las páginas web a scripts o lenguajes de programación.</p>
+
+<p>Una página web es un documento. Éste documento puede exhibirse en la ventana de un navegador o también como código fuente HTML. Pero, en los dos casos, es el mismo documento. El modelo de objeto de documento (DOM) proporciona otras formas de presentar, guardar y manipular este mismo documento. El DOM es una representación completamente orientada al objeto de la página web y puede ser modificado con un lenguaje de script como JavaScript.</p>
+
+<p>El <a class="external" href="http://www.w3.org/DOM/">W3C DOM</a> estándar forma la base del funcionamiento del DOM en muchos navegadores modernos. Varios navegadores ofrecen extensiones más allá del estándar W3C, hay que ir con extremo cuidado al utilizarlas en la web, ya que los documentos pueden ser consultados por navegadores que tienen DOMs diferentes.</p>
+
+<p>Por ejemplo, el DOM de W3C especifica que el método <code>getElementsByTagName</code> en el código de abajo debe devolver una lista de todos los elementos <code>&lt;p&gt;</code> del documento:</p>
+
+<pre class="brush: js">paragraphs<font><font> = document.getElementsByTagName ("p");</font></font>
+// paragraphs[0] es el primer elemento &lt;p&gt;
+// paragraphs[1] es el segundo elemento &lt;p&gt;, etc.<font><font>
+alert (</font></font>paragraphs<font><font> [0].nodeName);</font></font>
+</pre>
+
+<p>Todas las propiedades, métodos y eventos disponibles para la manipulación y la creación de páginas web está organizado dentro de objetos. Un ejemplo: el objeto <code>document</code> representa al documento mismo, el objeto <code>table</code> hace funcionar la interfaz especial <code>HTMLTableElement</code> del DOM para acceder a tablas HTML, y así sucesivamente. Ésta documentación procura una relación objeto-por-objeto del DOM que funciona con los navegadores basados en Gecko.</p>
+
+<h2 id="DOM_y_JavaScript" name="DOM_y_JavaScript"><font><font><font><font>DOM y JavaScript</font></font></font></font></h2>
+
+<p>El ejemplo corto de abajo, como casi todos los ejemplos de esta referencia, es <a href="es/JavaScript">JavaScript</a>. Es decir, es <em>escrito</em> en JavaScript pero <em>utiliza</em> el DOM para acceder al documento y a sus elementos. El DOM no es un lenguaje de programación pero sin él, el lenguaje JavaScript no tiene ningún modelo o noción de las páginas web, de la páginas XML ni de los elementos con los cuales es usualmente relacionado. Cada elemento -"el documento íntegro, el título, las tablas dentro del documento, los títulos de las tablas, el texto dentro de las celdas de las tablas"- es parte del modelo de objeto del documento para cada documento, así se puede acceder y manipularlos utilizando el DOM y un lenguaje de escritura, como JavaScript.</p>
+
+<p>En el comienzo, JavaScript y el DOM estaban herméticamente enlazados, pero después se desarrollaron como entidades separadas. El contenido de la página es almacenado en DOM y el acceso y la manipulación se hace vía JavaScript, podría representarse aproximadamente así:</p>
+
+<p>API(web o página XML) = DOM + JS(lenguaje de script)</p>
+
+<p>El DOM fue diseñado para ser independiente de cualquier lenguaje de programación particular, hace que la presentación estructural del documento sea disponible desde un simple y consistente API. Aunque en este manual nos centramos exclusivamente en JavaScript, la directrices del DOM pueden construirse para cualquier lenguaje, así lo demuestra el siguiente ejemplo de Python:</p>
+
+<pre class="brush: python line-numbers  language-python"><code class="language-python"># Ejemplo DOM de Python
+import xml.dom.minidom as m
+doc = m.parse("C:\\Projects\\Py\\chap1.xml");
+doc.nodeName # Propiedad DOM del objeto document;
+p_list = doc.getElementsByTagName("para");</code></pre>
+
+<h2 id=".C2.BFC.C3.B3mo_se_accede_al_DOM.3F" name=".C2.BFC.C3.B3mo_se_accede_al_DOM.3F">¿Cómo se accede al DOM?</h2>
+
+<p>No se tiene que hacer nada especial para empezar a utilizar el DOM. Los diferentes navegadores tienen directrices DOM distintas, y éstas directrices tienen diversos grados de conformidad al actual estándar DOM (un tema que se intenta evitar en este manual), pero todos los navegadores web usan el modelo de objeto de documento para hacer accesibles las páginas web al script.</p>
+
+<p>Cuando se crea un script –esté en un elemento <code>&lt;SCRIPT&gt;</code> o incluido en una página web por la instrucción de cargar un script– inmediatamente está disponible para usarlo con el API, accediendo así a los elementos <code><a href="es/DOM/document">document</a></code> o <code><a href="es/DOM/window">window</a></code>, para manipular el documento mismo o sus diferentes partes, las cuales son los varios elementos de una página web. La programación DOM hace algo tan simple como lo siguiente, lo cual abre un mensaje de alerta usando la función <code><a href="es/DOM/window.alert">alert()</a></code> desde el objeto <code><a href="es/DOM/window">window</a></code>, o permite métodos DOM más sofisticados para crear realmente un nuevo contenido, como en el largo ejemplo de más abajo.</p>
+
+<pre class="brush: html">&lt;body onload="window.alert('Bienvenido a mi página!');"&gt;
+</pre>
+
+<p>Aparte del elemento <code>&lt;script&gt;</code> en el cual JavaScript es definido, el ejemplo siguiente muestra la función a ejecutar cuando el documento se está cargando (y que el DOM completo es disponible para su uso). Esta función crea un nuevo elemento <code>H1</code>, le pone texto y después lo agrega al árbol del documento:</p>
+
+<pre class="brush: html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span></code><code class="language-html">
+  </code><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>script</span><span class="punctuation token">&gt;</span></span><span class="language-javascript script token">
+       <span class="comment token">// ejecuta esta función cuando se cargue el documento</span>
+       window<span class="punctuation token">.</span>onload <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+
+         <span class="comment token">// </span></span></code>crea dinámicamente un par de elementos HTML en una página vacia<code class="language-html"><span class="language-javascript script token">
+         <span class="keyword token">var</span> heading <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">"h1"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+         <span class="keyword token">var</span> heading_text <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createTextNode</span><span class="punctuation token">(</span><span class="string token">"</span></span></code>el texto que desee<code class="language-html"><span class="language-javascript script token"><span class="string token">"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+         heading<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>heading_text<span class="punctuation token">)</span><span class="punctuation token">;</span>
+         document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>heading<span class="punctuation token">)</span><span class="punctuation token">;</span>
+      <span class="punctuation token">}</span>
+    </span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>script</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<h2 id="Tipos_de_datos_importantes" name="Tipos_de_datos_importantes">Tipos de datos importantes</h2>
+
+<p>Esta parte intenta describir, de la manera más simple posible, los diferentes objetos y tipos. Pero hay que conocer una cantidad de tipos de datos diferentes que son utilizados por el API. Para simplificarlo, los ejemplos de sintaxis en esta API se refieren a nodos como <code>elements</code>, a una lista de nodos como <code>nodeLists</code> (o simples <code>elementos</code>) y a nodos de <code>atributo</code> como <code>attributes</code>.</p>
+
+<p>La siguiente tabla describe brevemente estos tipos de datos.</p>
+
+<table>
+ <tbody>
+  <tr>
+   <td><code>document</code></td>
+   <td>Cuando un miembro devuelve un objeto del tipo <code>document</code> (por ejemplo, la propiedad <strong>ownerDocument</strong> de un elemento devuelve el documento "<code>document</code>" al cual pertenece), este objeto es la raíz del objeto documento en sí mismo. El capítulo <a href="es/DOM/documento">La referencia al documento (<code>document</code>) de DOM</a> lo explica con más detalles.</td>
+  </tr>
+  <tr>
+   <td><code>element</code></td>
+   <td><code>element</code> se refiere a un elemento o a un nodo de tipo de elemento "<code>element</code>" devuelto por un miembro del API de DOM. Dicho de otra manera, por ejemplo, el método <code>document.createElement()</code> devuelve un objeto referido a un <code>nodo</code>, lo que significa que este método devuelve el elemento que acaba de ser creado en el DOM. Los objetos <code>element</code> ponen en funcionamiento a la interfaz <code>Element</code> del DOM y también a la interfaz de nodo "<code>Node</code>" más básica, las cuales son incluidas en esta referencia.</td>
+  </tr>
+  <tr>
+   <td><code>nodeList</code></td>
+   <td>Una "<code>nodeList</code>" es una serie de elementos, parecido a lo que devuelve el método <code>document.getElementsByTagName()</code>. Se accede a los items de la <code>nodeList</code> de cualquiera de las siguientes dos formas:
+    <ul>
+     <li><font><font><font><font>list.item (1)</font></font></font></font></li>
+     <li><font><font>lista {{mediawiki.external (1)}}</font></font></li>
+    </ul>
+
+    <p>Ambas maneras son equivalentes. En la primera, <strong>item()</strong> es el método del objeto <code>nodeList</code>. En la última se utiliza la típica sintaxis de acceso a listas para llegar al segundo ítem de la lista.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>attribute</code></td>
+   <td>Cuando un atributo ("<code>attribute</code>") es devuelto por un miembro (por ej., por el método <strong>createAttribute()</strong>), es una referencia a un objeto que expone una interfaz particular (aunque limitada) a los atributos. Los atributos son nodos en el DOM igual que los elementos, pero no suelen usarse así.</td>
+  </tr>
+  <tr>
+   <td><code>NamedNodeMap</code></td>
+   <td>Un <code>namedNodeMap</code> es una serie, pero los ítems son accesibles tanto por el nombre o por un índice, este último caso es meramente una conveniencia para enumerar ya que no están en ningún orden en particular en la lista. Un <code>NamedNodeMap</code> es un método de ítem() por esa razón, y permite poner o quitar ítems en un <code>NamedNodeMap</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Interfaces_del_DOM" name="Interfaces_del_DOM">Interfaces del DOM</h2>
+
+<p>Uno de los propósitos de esta guía es minimizar el hablar de interfaces abstractas, heredadas y otros detalles de funcionamiento. Más bien, concentrarse sobre los objetos en el DOM y sobre las actuales <em>cosas</em> que se pueden usar para manipular la jerarquía de DOM. Desde el punto de vista del programador web, es bastante indiferente saber que la representación del objeto del elemento <code>HTML form</code> toma la propidedad <strong>name</strong> desde la interfaz <code>HTMLFormElement</code> pero que las propiedades <code><strong>className</strong> </code>se toman desde la propia interfaz <code>HTMLElement</code>. En ambos casos, la propiedad está sólo en el objeto <code>form</code>.</p>
+
+<p>Pero puede resultar confuso el funcionamiento de la fuerte relación entre objetos e interfaces en el DOM, por eso esta sección intentará hablar un poquito sobre las interfaces actuales en la especificación del DOM y de como se dispone de ellas.</p>
+
+<h2 id="Interfaces_y_objetos" name="Interfaces_y_objetos">Interfaces y objetos</h2>
+
+<p>En algunos casos un objeto pone en ejecución a una sola interfaz. Pero a menudo un objeto toma prestada una tabla HTML (<code>table</code>) desde muchas interfaces diversas. El objeto table, por ejemplo, pone en funcionamiento una <a href="es/DOM/tabla">Interfaz especial del elemento table HTML</a>, la cual incluye métodos como <code>createCaption</code> y <code>insertRow</code>. Pero como también es un elemento HTML, table pone en marcha a la interfaz del <code>Element</code> descrita en el capítulo <a href="es/Referencia_DOM_de_Gecko/elemento">La referencia al elemento del DOM</a>. Y finalmente, puesto que un elemento HTML es también, por lo que concierna al DOM, un nodo en el árbol de nodos que hace el modelo de objeto para una página web o XML, el elemento de table hace funcionar la interfaz más básica de <code>Node</code>, desde el cual deriva <code>Element</code>.</p>
+
+<p>La referencia a un objeto <code>table</code>, como en el ejemplo siguiente, utiliza estas interfaces intercambiables sobre el objeto.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> table <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"table"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> tableAttrs <span class="operator token">=</span> table<span class="punctuation token">.</span>attributes<span class="punctuation token">;</span> <span class="comment token">// Node/interfaz Element</span>
+<span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> i <span class="operator token">&lt;</span> tableAttrs<span class="punctuation token">.</span>length<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="comment token">// interfaz HTMLTableElement: atributo border</span>
+  <span class="keyword token">if</span><span class="punctuation token">(</span>tableAttrs<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">.</span>nodeName<span class="punctuation token">.</span><span class="function token">toLowerCase</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">==</span> <span class="string token">"border"</span><span class="punctuation token">)</span>
+    table<span class="punctuation token">.</span>border <span class="operator token">=</span> <span class="string token">"1"</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+<span class="comment token">// interfaz HTMLTableElement: atributo summary</span>
+table<span class="punctuation token">.</span>summary <span class="operator token">=</span> <span class="string token">"nota: borde aumentado"</span><span class="punctuation token">;</span></code></pre>
+
+<h2 id="Interfaces_esenciales_en_el_DOM" name="Interfaces_esenciales_en_el_DOM">Interfaces esenciales en el DOM</h2>
+
+<p>Esta sección lista las interfaces más comúnmente utilizadas en el DOM. La idea no es describir qué hacen estas APIs pero sí dar una idea de las clases de métodos y propiedades que se encuentran con el uso del DOM. Muchos ejemplos de uso común de esta API se encuentran en el capítulo <a href="es/Referencia_DOM_de_Gecko/Ejemplos">Ejemplos DOM</a> al final de este manual.</p>
+
+<p><code>document</code> y <code>window</code> son objetos cuya interfaces son generalmente muy usadas en la programación de DOM. En término simple, el objeto <code>window</code> representa algo como podría ser el navegador, y el objeto <code>document</code> es la raíz del documento en sí. <code>Element</code> hereda de la interfaz genérica <code>Node</code>, y juntos, estas dos interfaces proporcionan muchos métodos y propiedades utilizables sobre los elementos individuales. Éstos elementos pueden igualmente tener interfaces específicas según el tipo de datos representados, como en el ejemplo anterior del objeto <code>table</code>. Lo siguiente es una breve lista de los APIS comunes en la web y en las páginas escritas en XML utilizando el DOM.</p>
+
+<ul>
+ <li><code><a href="es/DOM/document.getElementById">document.getElementById</a>(id)</code></li>
+ <li><code>element.<a href="es/DOM/element.getElementsByTagName">getElementsByTagName</a>(name)</code></li>
+ <li><code><a href="es/DOM/document.createElement">document.createElement</a>(name)</code></li>
+ <li><code>parentNode.<a href="es/DOM/element.appendChild">appendChild</a>(node)</code></li>
+ <li><code>element.<a href="es/DOM/element.innerHTML">innerHTML</a></code></li>
+ <li><code>element.<a href="es/DOM/element.style">style</a>.left</code></li>
+ <li><code>element.<a href="es/DOM/element.setAttribute">setAttribute</a></code></li>
+ <li><code>element.<a href="es/DOM/element.getAttribute">element.getAttribute</a></code></li>
+ <li><code>element.<a href="es/DOM/element.addEventListener">addEventListener</a></code></li>
+ <li><code><a href="es/DOM/window.content">window.content</a></code></li>
+ <li><code><a href="es/DOM/window.onload">window.onload</a></code></li>
+ <li><code><a href="es/DOM/window.dump">window.dump</a></code></li>
+ <li><code><a href="es/DOM/window.scrollTo">window.scrollTo</a></code></li>
+</ul>
+
+<h2 id="Probando_el_API_del_DOM" name="Probando_el_API_del_DOM">Probando el API del DOM</h2>
+
+<p>Ésta parte procura ejemplos para todas las interfaces usadas en el desarrollo web. En algunos casos, los ejemplos son páginas HTML enteras, con el acceso del DOM a un elemento de &lt;script&gt;, la interfaz necesaria (por ejemplo, botones) para la ejecución del script en un formulario, y también que los elementos HTML sobre los cuales opera el DOM se listen. Según el caso, los ejemplos se pueden copiar y pegar en un documento web para probarlos.</p>
+
+<p>No es el caso donde los ejemplos son muchos más concisos. Para la ejecución de estos ejemplos que sólo demuestran la relación básica entre la interfaz y los elementos HTML, resulta útil tener una página de prueba en la cual las interfaces serán fácilmente accesibles por los scripts. La muy simple página siguiente proporciona en las cabeceras un elemento de script en el cual se pondrán las funciones para testar la interfaz elegida, algunos elementos HTML con atributos que se puedan leer, editar y también manipular, así como la interfaz web necesaria para llamar esas funciones desde el navegador.</p>
+
+<p>Para probar y ver como trabajan en la plataforma del navegador las interfaces del DOM, esta página de prueba o una nueva similar son factibles. El contenido de la función <code>test()</code> se puede actualizar según la necesidad, para crear más botones o poner más elementos.</p>
+
+<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>html</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>head</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>title</span><span class="punctuation token">&gt;</span></span>Pruebas DOM<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>title</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>application/javascript<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="language-javascript script token">
+    <span class="keyword token">function</span> <span class="function token">setBodyAttr</span><span class="punctuation token">(</span>attr<span class="punctuation token">,</span> value<span class="punctuation token">)</span><span class="punctuation token">{</span>
+      <span class="keyword token">if</span> <span class="punctuation token">(</span>document<span class="punctuation token">.</span>body<span class="punctuation token">)</span> <span class="function token">eval</span><span class="punctuation token">(</span><span class="string token">'document.body.'</span><span class="operator token">+</span>attr<span class="operator token">+</span><span class="string token">'="'</span><span class="operator token">+</span>value<span class="operator token">+</span><span class="string token">'"'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+      <span class="keyword token">else</span> <span class="function token">notSupported</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    </span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>script</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>head</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>body</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span><span class="language-css style-attr token"><span class="attr-name token"> <span class="attr-name token">style</span></span><span class="punctuation token">="</span><span class="attr-value token"><span class="property token">margin</span><span class="punctuation token">:</span> <span class="number token">.5</span>in<span class="punctuation token">;</span> <span class="property token">height</span><span class="punctuation token">:</span> <span class="number token">400</span><span class="punctuation token">;</span></span><span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>tt</span><span class="punctuation token">&gt;</span></span>texto<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>tt</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>form</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>select</span> <span class="attr-name token">onChange</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>setBodyAttr(<span class="punctuation token">'</span>text<span class="punctuation token">'</span>,
+        this.options[this.selectedIndex].value);<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>black<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>negro
+          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>darkblue<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>azul oscuro
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>select</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>tt</span><span class="punctuation token">&gt;</span></span>bgColor<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>tt</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>select</span> <span class="attr-name token">onChange</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>setBodyAttr(<span class="punctuation token">'</span>bgColor<span class="punctuation token">'</span>,
+        this.options[this.selectedIndex].value);<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>white<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>blanco
+          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>lightgrey<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>gris
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>select</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>tt</span><span class="punctuation token">&gt;</span></span>link<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>tt</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>b</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>select</span> <span class="attr-name token">onChange</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>setBodyAttr(<span class="punctuation token">'</span>link<span class="punctuation token">'</span>,
+        this.options[this.selectedIndex].value);<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>blue<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>azul
+          <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>option</span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>green<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>verde
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>select</span><span class="punctuation token">&gt;</span></span>  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>small</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>a</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.brownhen.com/dom_api_top.html<span class="punctuation token">"</span></span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>sample<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+        (sample link)<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>a</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>small</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>br</span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>form</span><span class="punctuation token">&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>form</span><span class="punctuation token">&gt;</span></span>
+        <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>input</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button<span class="punctuation token">"</span></span> <span class="attr-name token">value</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>version<span class="punctuation token">"</span></span> <span class="attr-name token">onclick</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>ver()<span class="punctuation token">"</span></span> <span class="punctuation token">/&gt;</span></span>
+      <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>form</span><span class="punctuation token">&gt;</span></span>
+    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>body</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>html</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p>La creación de una página de prueba con una paleta de botones, campos de texto u otros elementos HTML, permitirá testar una gran cantidad de interfaces en un mismo documento, por ejemplo una serie de propiedades que afectan a los colores de una página web. Lo siguiente permite hacerse una idea de como pueden agruparse las interfaces para probarlas.</p>
+
+<p><font><font>Figura 0.1 Muestra DOM página de prueba</font></font></p>
+
+<p><img alt="" src="https://developer.mozilla.org/@api/deki/files/173/=DOM_Ref_Introduction_to_the_DOM.gif" style="height: 375px; width: 199px;"></p>
+
+<p>En este ejemplo, los menúes desplegables actualizan dinámicamente los aspectos de la página web accesibles al DOM como el color de fondo (<code>bgColor</code>), de los hiper-enlaces (<code>aLink</code>), y el del texto (<code>text</code>). El hecho de diseñar páginas, testar las interfaces que se encuentren a lo largo de la lectura son una parte importante del aprendizaje para una utilización eficaz del DOM.</p>
+
+<h2 id="Otros_enlaces"><strong>Otros enlaces</strong></h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model"><font><font>Referencia DOM</font></font></a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction"><font><font>Introducción al DOM</font></font></a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Events"><font><font>Eventos y el DOM</font></font></a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Examples"><font><font>Ejemplos</font></font></a></li>
+</ul>
+
+<div class="s3gt_translate_tooltip_mini_box" id="s3gt_translate_tooltip_mini" style="background: initial !important; border: initial !important; border-radius: initial !important; border-collapse: initial !important; direction: ltr !important; font-weight: initial !important; height: initial !important; letter-spacing: initial !important; max-width: initial !important; min-height: initial !important; margin: auto !important; outline: initial !important; padding: initial !important; position: absolute; text-align: initial !important; text-shadow: initial !important; width: initial !important; display: initial !important; color: inherit !important; font-size: 13px !important; font-family: X-LocaleSpecific,sans-serif,Tahoma,Helvetica !important; line-height: 13px !important; vertical-align: top !important; white-space: inherit !important; left: 10px; top: 35px; opacity: 0.85;">
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Reproducir"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copy text to Clipboard"> </div>
+</div>
+
+<div class="s3gt_translate_tooltip_mini_box" id="s3gt_translate_tooltip_mini" style="background: initial !important; border: initial !important; border-radius: initial !important; border-collapse: initial !important; direction: ltr !important; font-weight: initial !important; height: initial !important; letter-spacing: initial !important; max-width: initial !important; min-height: initial !important; margin: auto !important; outline: initial !important; padding: initial !important; position: absolute; text-align: initial !important; text-shadow: initial !important; width: initial !important; display: initial !important; color: inherit !important; font-size: 13px !important; font-family: X-LocaleSpecific,sans-serif,Tahoma,Helvetica !important; line-height: 13px !important; vertical-align: top !important; white-space: inherit !important; left: 39px; top: 1952px; opacity: 0.45;">
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Escuchar"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copiar texto al Portapapeles"> </div>
+</div>
+
+<div class="s3gt_translate_tooltip_mini_box" id="s3gt_translate_tooltip_mini" style="background: initial !important; border: initial !important; border-radius: initial !important; border-collapse: initial !important; direction: ltr !important; font-weight: initial !important; height: initial !important; letter-spacing: initial !important; max-width: initial !important; min-height: initial !important; margin: auto !important; outline: initial !important; padding: initial !important; position: absolute; text-align: initial !important; text-shadow: initial !important; width: initial !important; display: initial !important; color: inherit !important; font-size: 13px !important; font-family: X-LocaleSpecific,sans-serif,Tahoma,Helvetica !important; line-height: 13px !important; vertical-align: top !important; white-space: inherit !important; left: 307px; top: 1961px; opacity: 0;">
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_logo" title="Traducir texto seleccionado"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_sound" title="Escuchar"> </div>
+
+<div class="s3gt_translate_tooltip_mini" id="s3gt_translate_tooltip_mini_copy" title="Copiar texto al Portapapeles"> </div>
+</div>
diff --git a/files/es/web/api/document_object_model/locating_dom_elements_using_selectors/index.html b/files/es/web/api/document_object_model/locating_dom_elements_using_selectors/index.html
new file mode 100644
index 0000000000..75a66ad21b
--- /dev/null
+++ b/files/es/web/api/document_object_model/locating_dom_elements_using_selectors/index.html
@@ -0,0 +1,51 @@
+---
+title: Localizando elementos DOM usando selectores
+slug: Web/API/Document_object_model/Locating_DOM_elements_using_selectors
+tags:
+  - DOM
+  - Necesita actualizacion para principiantes
+  - Principiante
+translation_of: Web/API/Document_object_model/Locating_DOM_elements_using_selectors
+original_slug: Referencia_DOM_de_Gecko/Localizando_elementos_DOM_usando_selectores
+---
+<p>Los selectores api proveen metodos que hacen mas facil y rapido devolver elementos del nodo {{domxref("Element")}} del DOM mediante emparejamiento de un conjunto de selectores. Esto es mucho mas rapido que las tecnicas anteriores, donde fuera necesario, por ejemplo usar un loop en un codigo JavaScript para localizar el item especifico que quisieras encontrar.</p>
+
+<h2 id="Interfaz_de_NodeSelector">Interfaz de NodeSelector</h2>
+
+<p>Esta especificación añade dos nuevos metodos a cualquier objeto implementando el {{domxref("Document")}}, {{domxref("DocumentFragment")}}, o {{domxref("Element")}} interfaces:</p>
+
+<dl>
+ <dt>{{domxref("Element.querySelector", "querySelector()")}}</dt>
+ <dd>Devuelve la primera coincidencia del (elemento) {{domxref("Element")}} nodo dentro de las subramas del nodo. Sino se encuentra un nodo coincidente, se devuelve <code>null</code> .</dd>
+ <dt>{{domxref("Element.querySelectorAll", "querySelectorAll()")}}</dt>
+ <dd>devuelve un listado de nodos {{domxref("NodeList")}} conteniendo todos los elementos del nodo coincidentes( <code>Element</code>) dentro de las subramas del nodo, o Devuelve un Listado de Nodos vacio <code>NodeList</code> sino se encuentran coincidencias.</dd>
+</dl>
+
+<div class="note"><strong>Note:</strong> El {{domxref("NodeList")}} devuelto por {{domxref("Element.querySelectorAll()", "querySelectorAll()")}} no es dinamico, Es decir que cualquier cambio realizado en el DOM no se vera reflejado en la coleccion. Esto es diferente de otros metodos de querying del dom que si devuelven listados de nodos dinamicos.</div>
+
+<p>Encontraras ejemplos y detalles leyendo el documento de metodos {{domxref("Element.querySelector()")}} y {{domxref("Element.querySelectorAll()")}}, Tambien en el articulo <a class="internal" href="/en-US/docs/Code_snippets/QuerySelector" title="en-US/docs/Code snippets/QuerySelector">Code snippets for querySelector</a>.</p>
+
+<h2 id="Selectors">Selectors</h2>
+
+<p>El metodo de selectores acepta uno o mas selectores seperados por comas entre cada selector  para determinar que elemento o elementos deben ser devueltos. por ejemplo para seleccionar todos los elementos (p) del parrafo en un documento donde la clase CSS sea tanto <code>warning</code> or <code>note</code>, podes hacer lo siguiente:</p>
+
+<pre class="notranslate"><code>var special = document.querySelectorAll( "p.warning, p.note" );</code></pre>
+
+<p>tambien por usar query para etiquetas id. Por ejemplo:</p>
+
+<pre class="notranslate"><code>var el = document.querySelector( "#main, #basic, #exclamation" );</code></pre>
+
+<p>luego de ejecutar el codigo de arriba, la variable <code>el</code> contiene el primer elemento del documento, su ID puede ser uno de los siguentes  <code>main</code>, <code>basic</code>, or <code>exclamation</code>.</p>
+
+<p>Podes usar cualquier selector CSS con los metodos <code>querySelector()</code> y <code>querySelectorAll()</code><em>.</em></p>
+
+<h2 id="Ver_tambien.">Ver tambien.</h2>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/selectors-api/" title="http://www.w3.org/TR/selectors-api/">Selectors API</a></li>
+ <li>{{domxref("Element.querySelector()")}}</li>
+ <li>{{domxref("Element.querySelectorAll()")}}</li>
+ <li>{{domxref("Document.querySelector()")}}</li>
+ <li>{{domxref("Document.querySelectorAll()")}}</li>
+ <li><a href="/en-US/docs/Code_snippets/QuerySelector" title="en-US/docs/Code_snippets/QuerySelector">Code snippets for querySelector</a></li>
+</ul>
diff --git a/files/es/web/api/document_object_model/traversing_an_html_table_with_javascript_and_dom_interfaces/index.html b/files/es/web/api/document_object_model/traversing_an_html_table_with_javascript_and_dom_interfaces/index.html
new file mode 100644
index 0000000000..04064e3d5c
--- /dev/null
+++ b/files/es/web/api/document_object_model/traversing_an_html_table_with_javascript_and_dom_interfaces/index.html
@@ -0,0 +1,339 @@
+---
+title: Trazado de una tabla HTML mediante JavaScript y la Interface DOM
+slug: >-
+  Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
+translation_of: >-
+  Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
+original_slug: Trazado_de_una_tabla_HTML_mediante_JavaScript_y_la_Interface_DOM
+---
+<h2 id="Introduction" name="Introduction">Introducción</h2>
+
+<p>Este artículo es un resumen de algunos métodos DOM nivel 1 poderosos y fundamentales así como una descripción de cómo utilizarlos utilizando Javascript.  Aprenderás a crear, accesar, controlar, y remover elementos HTML dinámicamente.  Los métodos DOM presentados aquí no son específicos de HTML; también aplican para XML. Las demostraciones aquí proporcionadas funcionarán en cualquier navegador moderno, incluyendo todas las versiones de Firefox e IE 5+.</p>
+
+<div class="note">Los métodos DOM presentados aquí forman parte del Modelo de Documento basado en Objetos (DOM: Document Object Model por sus siglas en inglés) de especificación nivel 1.  DOM nivel 1 incluye métodos tanto para acceso genérico del documento (DOM 1 Core) así como métodos específicos para documentos HTML (DOM 1 HTML).</div>
+
+<h2 id="Overview_of_Sample1.html" name="Overview_of_Sample1.html">Ejemplo: Crear una tabla HTML dinámicamente (<code>Ejemplo1.html</code>)</h2>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush: html">&lt;input type="button" value="Genera una tabla" onclick="genera_tabla()"&gt;
+</pre>
+
+<h3 id="JavaScript_Content">JavaScript Content</h3>
+
+<pre class="brush: js">function genera_tabla() {
+  // Obtener la referencia del elemento body
+  var body = document.getElementsByTagName("body")[0];
+
+  // Crea un elemento &lt;table&gt; y un elemento &lt;tbody&gt;
+  var tabla   = document.createElement("table");
+  var tblBody = document.createElement("tbody");
+
+  // Crea las celdas
+  for (var i = 0; i &lt; 2; i++) {
+    // Crea las hileras de la tabla
+    var hilera = document.createElement("tr");
+
+    for (var j = 0; j &lt; 2; j++) {
+      // Crea un elemento &lt;td&gt; y un nodo de texto, haz que el nodo de
+      // texto sea el contenido de &lt;td&gt;, ubica el elemento &lt;td&gt; al final
+      // de la hilera de la tabla
+      var celda = document.createElement("td");
+      var textoCelda = document.createTextNode("celda en la hilera "+i+", columna "+j);
+      celda.appendChild(textoCelda);
+      hilera.appendChild(celda);
+    }
+
+    // agrega la hilera al final de la tabla (al final del elemento tblbody)
+    tblBody.appendChild(hilera);
+  }
+
+  // posiciona el &lt;tbody&gt; debajo del elemento &lt;table&gt;
+  tabla.appendChild(tblBody);
+  // appends &lt;table&gt; into &lt;body&gt;
+  body.appendChild(tabla);
+  // modifica el atributo "border" de la tabla y lo fija a "2";
+  tabla.setAttribute("border", "2");
+}</pre>
+
+<p>{{ EmbedLiveSample('Overview_of_Sample1.html') }}</p>
+
+<p>Observa cuidadosamente el orden en el que se crearon los elementos en el nodo de texto:</p>
+
+<ol>
+ <li>Primero se crea el elemento &lt;table&gt;.</li>
+ <li>Posteriormente, creamos el elemento &lt;tbody&gt; , que es el hijo del elemento &lt;table&gt; .</li>
+ <li>Después, utilizamos ciclos para crear los elementos &lt;tr&gt;, que son hijos del elemento &lt;tbody&gt;.</li>
+ <li>Para cada elemento &lt;tr&gt;, utilizamos nuevamente ciclos para generar los elementos &lt;td&gt; que son hijos de los elementos &lt;tr&gt;.</li>
+ <li>Para cada elemento &lt;td&gt;, creamos nodos de texto con el contenido de cada celda.</li>
+</ol>
+
+<p>Una vez creados los elementos &lt;table&gt;, &lt;tbody&gt;, &lt;tr&gt;, y &lt;td&gt; así como los nodos de texto, adicionamos a cada hijo bajo su padre en el órden opuesto:</p>
+
+<ol>
+ <li>Primero, anexamos cada nodo de texto a su elemento padre &lt;td&gt; :
+  <pre>celda.appendChild(textoCelda);</pre>
+ </li>
+ <li>Posteriormente, anexamos cada elemento &lt;td&gt; a su elemento padre &lt;tr&gt; :
+  <pre>hilera.appendChild(celda);</pre>
+ </li>
+ <li>Posteriomente, anexamos cada elemento &lt;tr&gt; a su elemento padre &lt;tbody&gt;:
+  <pre>tblBody.appendChild(hilera);</pre>
+ </li>
+ <li>Después, anexamos el elemento &lt;tbody&gt; a su elemento padre &lt;table&gt;:
+  <pre>tabla.appendChild(tblBody);</pre>
+ </li>
+ <li>Finalmente, anexamos el elemento &lt;table&gt; a su elemento padre &lt;body&gt;:
+  <pre>body.appendChild(tabla);</pre>
+ </li>
+</ol>
+
+<p>Recuérda esta técnica. Te será muy útil en la programación bajo el estándar W3C DOM. Primero, creas los elementos de arriba a abajo; posteriormente adicionas los hijos a los padres de abajo a arriba.</p>
+
+<p>A continuación aparece el código HTML generado por el código JavaScript:</p>
+
+<pre>...
+&lt;table border="2"&gt;
+    &lt;tbody&gt;
+        &lt;tr&gt;&lt;td&gt;celda en la hilera 0, columna 0&lt;/td&gt;&lt;td&gt;celda en la hilera 0, columna 1&lt;/td&gt;&lt;/tr&gt;
+        &lt;tr&gt;&lt;td&gt;celda en la hilera 1, columna 0&lt;/td&gt;&lt;td&gt;celda en la hilera 1, columna 1&lt;/td&gt;&lt;/tr&gt;
+    &lt;/tbody&gt;
+&lt;/table&gt;
+...
+</pre>
+
+<p>Aquí está el árbol de objetos DOM generado por el código del elemento &lt;TABLE&gt; :</p>
+
+<p><img alt="Image:sample1-tabledom.jpg" src="/@api/deki/files/833/=Sample1-tabledom.jpg"></p>
+
+<p>Tú puedes construir esta tabla y sus elementos internos utilizando sólo algunos de los varios métodos del DOM. Recuerda tener en mente el modelo de la estructura que planeas crear; esto hará mucho más fácil la escritura del código necesario.</p>
+
+<p>En el árbol del elemento &lt;table&gt; de la Figura 1, el elemento &lt;table&gt; tiene solamente un hijo mientras que &lt;tbody&gt; tiene dos.  A su vez, cada hijo de &lt;tbody&gt; tiene dos hijos. Finalmente, cada elemento &lt;td&gt; tiene sólo uno, el nodo de texto.</p>
+
+<h2 id="Setting_background_of_a_paragraph" name="Setting_background_of_a_paragraph">Ejemplo: Configuración del color de fondo de un párrafo</h2>
+
+<p><code>getElementsByTagName(tagNameValue)</code> es un método disponible en cualquier elemento DOM o el elemento raíz del documento. Cuando se le llama, devolverá una matriz con todos los descendientes de elementos que coincidan con el nombre de la etiqueta. El primer elemento de la lista se encuentra en la posición [0] de la matriz.</p>
+
+<h3 id="HTML_Content">HTML Content</h3>
+
+<pre class="brush: html">&lt;body&gt;
+  &lt;input type="button" value="Set paragraph background color" onclick="set_background()"&gt;
+  &lt;p&gt;hi&lt;/p&gt;
+  &lt;p&gt;hello&lt;/p&gt;
+&lt;/body&gt;</pre>
+
+<h3 id="JavaScript_Content_2">JavaScript Content</h3>
+
+<pre class="brush: js">function set_background() {
+  // get a list of all the body elements (there will only be one),
+  // and then select the zeroth (or first) such element
+  myBody = document.getElementsByTagName("body")[0];
+
+  // now, get all the p elements that are descendants of the body
+  myBodyElements = myBody.getElementsByTagName("p");
+
+  // get the second item of the list of p elements
+  myP = myBodyElements[1];
+  myP.style.background = "rgb(255,0,0)";
+}</pre>
+
+<p>{{ EmbedLiveSample('Setting_background_of_a_paragraph') }}</p>
+
+<p>En este ejemplo, establecemos la variable <code>myP</code> en el objeto DOM para el segundo elemento<code>p</code> dentro del body:</p>
+
+<ol>
+ <li>Primero, obtendremos una lista de todos los elementos body mediante
+  <pre>myBody = document.getElementsByTagName("body")[0]</pre>
+  Como en cualquier documento HTML sólo hay un elemento body válido, esta lista tendrá sólo un elemento, que recuperamos seleccionando el primer elemento de esa lista usando <code>{{mediawiki.external(0)}}</code>.</li>
+ <li>Luego, obtenemos todos los elementos p que son descendientes del body mediante
+  <pre>myBodyElements = myBody.getElementsByTagName("p");</pre>
+ </li>
+ <li>Finalmente, obtenemos el segundo item de la lista de elementos p mediante
+  <pre>myP = myBodyElements[1];</pre>
+ </li>
+</ol>
+
+<p><img alt="Image:sample2a2.jpg" src="/@api/deki/files/834/=Sample2a2.jpg"></p>
+
+<p>Una vez que haya obtenido el objeto DOM para un elemento HTML, puede establecer sus propiedades. Por ejemplo, si desea establecer la propiedad estilo de color de fondo, agregue:</p>
+
+<pre>myP.style.background = "rgb(255,0,0)";
+// setting inline STYLE attribute
+</pre>
+
+<h3 id="Creating_TextNodes_with_document.createTextNode.28.22...22.29" name="Creating_TextNodes_with_document.createTextNode.28.22...22.29">Creating TextNodes with <code>document.createTextNode("..")</code></h3>
+
+<p>Use the document object to invoke the createTextNode method and create your text node. You just need to pass the text content. The return value is an object that represents the text node.</p>
+
+<pre>myTextNode = document.createTextNode("world");
+</pre>
+
+<p>This means that you have created a node of the type TEXT_NODE (a piece of text) whose text data is "world", and myTextNode is your reference to this node object. To insert this text into your HTML page, you need to make this text node a child of some other node element.</p>
+
+<h3 id="Inserting_Elements_with_appendChild.28...29" name="Inserting_Elements_with_appendChild.28...29">Inserting Elements with appendChild(..)</h3>
+
+<p>So, by calling myP.appendChild({{mediawiki.external('node_element')}}), you are making the element a new child of the second &lt;p&gt; element.</p>
+
+<pre>myP.appendChild(myTextNode);
+</pre>
+
+<p>After testing this sample, note that the words hello and world are together: helloworld. So visually, when you see the HTML page it seems like the two text nodes hello and world are a single node, but remember that in the document model, there are two nodes. The second node is a new node of type TEXT_NODE, and it is the second child of the second &lt;p&gt; tag. The following figure shows the recently created Text Node object inside the document tree.</p>
+
+<p><img alt="Image:sample2b2.jpg" src="/@api/deki/files/835/=Sample2b2.jpg"></p>
+
+<div class="note">createTextNode and appendChild is a simple way to include white space between the words hello and world. Another important note is that the appendChild method will append the child after the last child, just like the word world has been added after the word hello. So if you want to append a Text Node between hello and world you will need to use insertBefore instead of appendChild.</div>
+
+<h3 id="Creating_New_Elements_with_the_document_object_and_the_createElement.28...29_method" name="Creating_New_Elements_with_the_document_object_and_the_createElement.28...29_method">Creating New Elements with the document object and the <code>createElement(..)</code> method</h3>
+
+<p>You can create new HTML elements or any other element you want with createElement. For example, if you want to create a new &lt;p&gt; element as a child of the &lt;body&gt; element, you can use the myBody in the previous example and append a new element node. To create a node simply call <code>document.createElement("tagname")</code>. For example:</p>
+
+<pre>myNewPTAGnode = document.createElement("p");
+myBody.appendChild(myNewPTAGnode);
+</pre>
+
+<p><img alt="Image:sample2c.jpg" src="/@api/deki/files/836/=Sample2c.jpg"></p>
+
+<h3 id="Removing_nodes_with_the_removeChild.28...29_method" name="Removing_nodes_with_the_removeChild.28...29_method">Removing nodes with the <code>removeChild(..)</code> method</h3>
+
+<p>Nodes can be removed. The following code removes text node <code>myTextNode</code> (containing the word "world") from the second <code>&lt;p&gt;</code> element, <code>myP</code>.</p>
+
+<pre>myP.removeChild(myTextNode);
+</pre>
+
+<p>Text node <code>myTextNode</code> (containing the word "world") still exists. The following code attaches <code>myTextNode</code> to the recently created <code>&lt;p&gt;</code> element, <code>myNewPTAGnode</code>.</p>
+
+<pre>myNewPTAGnode.appendChild(myTextNode);
+</pre>
+
+<p>The final state for the modified object tree looks like this:</p>
+
+<p><img alt="Image:sample2d.jpg" src="/@api/deki/files/837/=Sample2d.jpg"></p>
+
+<h2 id="Creating_a_table_dynamically_.28back_to_Sample1.html.29" name="Creating_a_table_dynamically_.28back_to_Sample1.html.29">Creating a table dynamically (back to Sample1.html)</h2>
+
+<p>For the rest of this article we will continue working with sample1.html. The following figure shows the table object tree structure for the table created in the sample.</p>
+
+<h3 id="Reviewing_the_HTML_Table_structure" name="Reviewing_the_HTML_Table_structure">Reviewing the HTML Table structure</h3>
+
+<p><img alt="Image:sample1-tabledom.jpg" src="/@api/deki/files/833/=Sample1-tabledom.jpg"></p>
+
+<h3 id="Creating_element_nodes_and_inserting_them_into_the_document_tree" name="Creating_element_nodes_and_inserting_them_into_the_document_tree">Creating element nodes and inserting them into the document tree</h3>
+
+<p>The basic steps to create the table in sample1.html are:</p>
+
+<ul>
+ <li>Get the body object (first item of the document object).</li>
+ <li>Create all the elements.</li>
+ <li>Finally, append each child according to the table structure (as in the above figure). The following source code is a commented version for the sample1.html.</li>
+</ul>
+
+<div class="note">At the end of the start function there is a new line of code. The table's border property was set using another DOM method, <code>setAttribute</code>. setAttribute has two arguments: the attribute name and the attribute value. You can set any attribute of any element using the setAttribute method.</div>
+
+<pre class="brush:html">&lt;head&gt;
+&lt;title&gt;Sample code - Traversing an HTML Table with JavaScript and DOM Interfaces&lt;/title&gt;
+&lt;script&gt;
+    function start() {
+        // get the reference for the body
+        var mybody = document.getElementsByTagName("body")[0];
+
+        // creates &lt;table&gt; and &lt;tbody&gt; elements
+        mytable     = document.createElement("table");
+        mytablebody = document.createElement("tbody");
+
+        // creating all cells
+        for(var j = 0; j &lt; 2; j++) {
+            // creates a &lt;tr&gt; element
+            mycurrent_row = document.createElement("tr");
+
+            for(var i = 0; i &lt; 2; i++) {
+                // creates a &lt;td&gt; element
+                mycurrent_cell = document.createElement("td");
+                // creates a Text Node
+                currenttext = document.createTextNode("cell is row " + j + ", column " + i);
+                // appends the Text Node we created into the cell &lt;td&gt;
+                mycurrent_cell.appendChild(currenttext);
+                // appends the cell &lt;td&gt; into the row &lt;tr&gt;
+                mycurrent_row.appendChild(mycurrent_cell);
+            }
+            // appends the row &lt;tr&gt; into &lt;tbody&gt;
+            mytablebody.appendChild(mycurrent_row);
+        }
+
+        // appends &lt;tbody&gt; into &lt;table&gt;
+        mytable.appendChild(mytablebody);
+        // appends &lt;table&gt; into &lt;body&gt;
+        mybody.appendChild(mytable);
+        // sets the border attribute of mytable to 2;
+        mytable.setAttribute("border","2");
+    }
+&lt;/script&gt;
+&lt;/head&gt;
+&lt;body onload="start()"&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<h2 id="Manipulating_the_table_with_DOM_and_CSS" name="Manipulating_the_table_with_DOM_and_CSS">Manipulating the table with DOM and CSS</h2>
+
+<h3 id="Getting_a_text_node_from_the_table" name="Getting_a_text_node_from_the_table">Getting a text node from the table</h3>
+
+<p>This example introduces two new DOM attributes. First it uses the <code>childNodes</code> attribute to get the list of child nodes of mycel. The <code>childNodes</code> list includes all child nodes, regardless of what their name or type is. Like getElementsByTagName(), it returns a list of nodes. The differences are that (a) getElementsByTagName() only returns elements of the specified tag name; and (b) getElementsByTagName() returns descendants at any level, not just immediate children. Once you have the returned list, use <code>{{mediawiki.external('x')}}</code> method to retrieve the desired child item. This example stores in myceltext the text node of the second cell in the second row of the table. Then, to display the results in this example, it creates a new text node whose content is the data of myceltext and appends it as a child of the &lt;body&gt; element.</p>
+
+<div class="note">If your object is a text node, you can use the data attribute and retrieve the text content of the node.</div>
+
+<pre class="brush:js">mybody      = document.getElementsByTagName("body")[0];
+mytable     = mybody.getElementsByTagName("table")[0];
+mytablebody = mytable.getElementsByTagName("tbody")[0];
+myrow       = mytablebody.getElementsByTagName("tr")[1];
+mycel       = myrow.getElementsByTagName("td")[1];
+
+// first item element of the childNodes list of mycel
+myceltext=mycel.childNodes[0];
+
+// content of currenttext is the data content of myceltext
+currenttext=document.createTextNode(myceltext.data);
+mybody.appendChild(currenttext);
+</pre>
+
+<h3 id="Getting_an_attribute_value" name="Getting_an_attribute_value">Getting an attribute value</h3>
+
+<p>At the end of sample1 there is a call to setAttribute on the mytable object. This call was used to set the border property of the table. To retrieve the value of the attribute, use the getAttribute method:</p>
+
+<pre>mytable.getAttribute("border");
+</pre>
+
+<h3 id="Hiding_a_column_by_changing_style_properties" name="Hiding_a_column_by_changing_style_properties">Hiding a column by changing style properties</h3>
+
+<p>Once you have the object in your JavaScript variable, you can set style properties directly. The following code is a modified version of sample1.html in which each cell of the second column is hidden and each cell of the first column is changed to have a red background. Note that the style property was set directly.</p>
+
+<pre class="brush:html">&lt;html&gt;
+&lt;body onload="start()"&gt;
+&lt;/body&gt;
+&lt;script&gt;
+    function start() {
+       var mybody =document.getElementsByTagName("body")[0];
+       mytable     = document.createElement("table");
+       mytablebody = document.createElement("tbody");
+
+       for(var j = 0; j &lt; 2; j++) {
+           mycurrent_row=document.createElement("tr");
+           for(var i = 0; i &lt; 2; i++) {
+               mycurrent_cell = document.createElement("td");
+               currenttext = document.createTextNode("cell is:" + i + j);
+               mycurrent_cell.appendChild(currenttext);
+               mycurrent_row.appendChild(mycurrent_cell);
+               // set the cell background color
+               // if the column is 0. If the column is 1 hide the cel
+               if (i == 0) {
+                   mycurrent_cell.style.background = "rgb(255,0,0)";
+               } else {
+                   mycurrent_cell.style.display = "none";
+               }
+           }
+           mytablebody.appendChild(mycurrent_row);
+       }
+       mytable.appendChild(mytablebody);
+       mybody.appendChild(mytable);
+    }
+&lt;/script&gt;
+&lt;/html&gt;
+</pre>
diff --git a/files/es/web/api/document_object_model/using_the_w3c_dom_level_1_core/index.html b/files/es/web/api/document_object_model/using_the_w3c_dom_level_1_core/index.html
new file mode 100644
index 0000000000..1c1eea5a0e
--- /dev/null
+++ b/files/es/web/api/document_object_model/using_the_w3c_dom_level_1_core/index.html
@@ -0,0 +1,94 @@
+---
+title: Using the W3C DOM Level 1 Core
+slug: Web/API/Document_object_model/Using_the_W3C_DOM_Level_1_Core
+tags:
+  - DOM
+  - NeedsTranslation
+  - NeedsUpdate
+  - TopicStub
+translation_of: Web/API/Document_object_model/Using_the_W3C_DOM_Level_1_Core
+original_slug: Using_the_W3C_DOM_Level_1_Core
+---
+<p>The W3C's DOM Level 1 Core is a powerful object model for changing the content tree of documents. It is supported in all major browsers including Mozilla Firefox and Microsoft Internet Explorer. It is a powerful base for scripting on the web.</p>
+
+<h2 id="What_is_a_content_tree.3F" name="What_is_a_content_tree.3F">What is a content tree?</h2>
+
+<p>Many HTML authors may think of HTML as something flat -- a bunch of text with tags in the middle. However, it is something much more than that. Any HTML document (or for that matter any SGML document or XML document) is a tree structure. For example, the following document and tree structure are similar (although not identical -- see the notes on <a href="/en-US/docs/Whitespace_in_the_DOM" title="Whitespace_in_the_DOM">whitespace in the DOM</a>):</p>
+
+<pre class="brush: html">&lt;html&gt;
+&lt;head&gt;
+  &lt;title&gt;My Document&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+  &lt;h1&gt;Header&lt;/h1&gt;
+  &lt;p&gt;Paragraph&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p><img alt="image:Using_the_W3C_DOM_Level_1_Core-doctree.jpg" class="internal" src="/@api/deki/files/415/=Using_the_W3C_DOM_Level_1_Core-doctree.jpg"></p>
+
+<p>When Mozilla parses a document, it builds a content tree and then uses it to display the document.</p>
+
+<p>The terms used to describe trees show up often in the DOM Level 1 Core. Each of the boxes I drew in the tree above is a node in the tree. The line above a node expresses a parent-child relationship: the node on top is the parent, and the node on the bottom is the child. Two children of the same parent are therefore siblings. Similarly, one can refer to ancestors and descendants. (Cousins are too messy, though.)</p>
+
+<h2 id="What_does_the_DOM_Level_1_Core_let_me_do.3F" name="What_does_the_DOM_Level_1_Core_let_me_do.3F">What does the DOM Level 1 Core let me do?</h2>
+
+<p>The W3C DOM Level 1 allows you to change the content tree <em>any way you want</em>. It is powerful enough to build any HTML document from scratch. It allows authors to change anything in the document from script, at any time. The easiest way for web page authors to change the DOM dynamically is using JavaScript. In JavaScript, the document is accessible the same way it has been in older browsers: from the <code>document</code> property of the global object. This <code>document</code> object implements the <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#i-Document">Document interface</a> from the W3C's DOM Level 1 spec.</p>
+
+<h2 id="A_simple_example" name="A_simple_example">A simple example</h2>
+
+<p>Suppose the author wants to take the above document and change the contents of the header, and write two paragraphs instead of one. The following script would do the job:</p>
+
+<h3 id="HTML_Content">HTML Content</h3>
+
+<pre class="brush: html">&lt;body&gt;
+&lt;input type="button" value="Change this document." onclick="change()"&gt;
+&lt;h2&gt;Header&lt;/h2&gt;
+&lt;p&gt;Paragraph&lt;/p&gt;
+&lt;/body&gt;<span>
+</span></pre>
+
+<h3 id="JavaScript_Content">JavaScript Content</h3>
+
+<pre class="brush: js"><span>  function change() {
+    // document.getElementsByTagName("H2") returns a NodeList of the &lt;h2&gt;
+    // elements in the document, and the first is number 0:
+
+    var header = document.getElementsByTagName("H2").item(0);
+    // the firstChild of the header is a Text node:
+    header.firstChild.data = "A dynamic document";
+    // now the header is "A dynamic document".
+
+    var para = document.getElementsByTagName("P").item(0);
+    para.firstChild.data = "This is the first paragraph.";
+
+    // create a new Text node for the second paragraph
+    var newText = document.createTextNode("This is the second paragraph.");
+    // create a new Element to be the second paragraph
+    var newElement = document.createElement("P");
+    // put the text in the paragraph
+    newElement.appendChild(newText);
+    // and put the paragraph on the end of the document by appending it to
+    // the BODY (which is the parent of para)
+    para.parentNode.appendChild(newElement);
+  }</span></pre>
+
+<p>{{ EmbedLiveSample('A_simple_example', 800, 300) }}</p>
+
+<p>You can see this script as <a class="internal" href="/@api/deki/files/2866/=example.html" title="/@api/deki/files/2866/=example.html">a complete example</a>.</p>
+
+<h2 id="How_can_I_learn_more.3F" name="How_can_I_learn_more.3F">How can I learn more?</h2>
+
+<p>Now that you are familiar with the basic concepts of the DOM, there is a document explaining the <a href="/en-US/docs/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces" title="Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces">DOM Level 1 fundamental methods</a>. It is the follow-up to this document.</p>
+
+<p>See also the <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html">DOM Level 1 Core specification</a> from the W3C. It's a reasonably clear spec, although it is formal. The main thing that's useful to authors is the description of the different DOM objects and all their properties and methods. Also see our <a href="/en-US/docs/DOM" title="DOM">other DOM documentation</a>.</p>
+
+<div class="originaldocinfo">
+<p><strong>Original Document Information</strong></p>
+
+<ul>
+ <li>Author(s): L. David Baron &lt;dbaron at dbaron dot org&gt;</li>
+ <li>Copyright Information: © 1998-2005 by individual mozilla.org contributors; content available under a <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Creative Commons license</a></li>
+</ul>
+</div>
diff --git a/files/es/web/api/document_object_model/whitespace/index.html b/files/es/web/api/document_object_model/whitespace/index.html
new file mode 100644
index 0000000000..866185204c
--- /dev/null
+++ b/files/es/web/api/document_object_model/whitespace/index.html
@@ -0,0 +1,477 @@
+---
+title: Cómo manejan el espacio en blanco HTML, CSS y el DOM
+slug: Web/API/Document_Object_Model/Whitespace
+tags:
+  - CSS
+  - DOM
+  - HTML
+  - JavaScript
+  - espacioenblanco
+  - whitespace
+translation_of: Web/API/Document_Object_Model/Whitespace
+original_slug: Referencia_DOM_de_Gecko/Cómo_espacioenblanco
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>La presencia de espacios en blanco en el <a href="/es/docs/Web/API/Document_Object_Model">DOM</a> puede causar problemas de diseño y dificultar la manipulación del árbol de contenido de formas inesperadas, dependiendo de dónde se encuentra. Este artículo explora cuándo pueden surgir dificultades y analiza qué se puede hacer para mitigar los problemas resultantes.</p>
+
+<h2 id="¿Qué_es_el_espacio_en_blanco">¿Qué es el espacio en blanco?</h2>
+
+<p>El espacio en blanco es cualquier cadena de texto compuesta solo por espacios, tabulaciones o saltos de línea (para ser precisos, secuencias CRLF, retornos de carro o avances de línea). Estos caracteres te permiten formatear tu código de una manera que lo hará fácilmente legible por ti y otras personas. De hecho, gran parte de nuestro código fuente está lleno de estos caracteres de espacio en blanco, y solo tendemos a deshacernos de ellos en un paso de compilación de producción para reducir el tamaño de descarga del código.</p>
+
+<h3 id="¿HTML_ignora_en_gran_medida_los_espacios_en_blanco">¿HTML ignora en gran medida los espacios en blanco?</h3>
+
+<p>En el caso de HTML, los espacios en blanco se ignoran en gran medida: los espacios en blanco entre palabras se tratan como un solo carácter y los espacios en blanco al principio y al final de los elementos y los elementos externos se ignoran. Tomemos el siguiente ejemplo minimalista:</p>
+
+<h3 class="hidden" id="HTML_largely_ignores_whitespace">HTML largely ignores whitespace?</h3>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+
+    &lt;h1&gt;       ¡Hola      mundo!     &lt;/h1&gt;</pre>
+
+<p>{{EmbedLiveSample('HTML_largely_ignores_whitespace')}}</p>
+
+<p>Este código fuente contiene un par de avances de línea después del <code>DOCTYPE</code> y un montón de caracteres de espacio antes, después y dentro del elemento <code>&lt;h1&gt;</code>, pero al navegador no parece importarle en absoluto y solo muestra las palabras "¡Hola mundo!" como si estos caracteres no existieran en absoluto:</p>
+
+<p>Esto es para que los espacios en blanco no afecten el diseño de tu página. Crear espacio alrededor y dentro de los elementos es el trabajo de CSS.</p>
+
+<h3 id="¿Qué_sucede_con_los_espacios_en_blanco">¿Qué <em>sucede</em> con los espacios en blanco?</h3>
+
+<p>Sin embargo, no solo desaparecen.</p>
+
+<p>Cualquier carácter de espacio en blanco que esté fuera de los elementos HTML del documento original se representan en el DOM. Esto es necesario internamente para que el editor pueda preservar el formato de los documentos. Esto significa que:</p>
+
+<ul>
+ <li>Habrá algunos nodos de texto que contienen solo espacios en blanco, y</li>
+ <li>Algunos nodos de texto tendrán espacios en blanco al principio o al final.</li>
+</ul>
+
+<p>Tomemos el siguiente documento, por ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+  &lt;title&gt;Mi Documento&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+  &lt;h1&gt;Encabezado&lt;/h1&gt;
+  &lt;p&gt;
+    Párrafo
+  &lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>El árbol del DOM para esto se ve así:</p>
+
+<p><img alt="árbol de dom equivalente al ejemplo de HTML anterior" src="https://mdn.mozillademos.org/files/17084/dom-string.png" style="display: block; height: 288px; margin: 0 auto; width: 562px;"></p>
+
+<p>Conservar caracteres de espacio en blanco en el DOM es útil de muchas maneras, pero hay ciertos lugares donde esto hace que ciertos diseños sean más difíciles de implementar y causa problemas a los desarrolladores que quieren iterar a través de los nodos del DOM. Veremos estas y algunas soluciones más adelante.</p>
+
+<h3 id="¿CSS_cómo_procesa_los_espacios_en_blanco">¿CSS cómo procesa los espacios en blanco?</h3>
+
+<p>La mayoría de los espacios en blanco se ignoran, no todos. En el ejemplo anterior, uno de los espacios entre "!Hola" y "mundo!" todavía existe cuando la página se representa en un navegador. Hay reglas en el motor del navegador que deciden qué caracteres de espacio en blanco son útiles y cuáles no; estos se especifican al menos en parte en el <a href="https://www.w3.org/TR/css-text-3">Módulo de texto CSS Nivel 3</a>, y especialmente las partes sobre la <a href="https://www.w3.org/TR/css-text-3/#white-space-property">propiedad <code>white-space</code> en CSS</a> y <a href="https://www.w3.org/TR/css-text-3/#white-space-processing">detalles de procesamiento del espacio en blanco</a>, pero también ofrecemos una explicación más sencilla a continuación.</p>
+
+<p>Tomemos otro ejemplo realmente simple. Para hacerlo más fácil, ilustramos todos los espacios con ◦, todas las tabulaciones con ⇥ y todos los saltos de línea con ⏎:</p>
+
+<p>Este ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola◦⏎
+⇥⇥⇥⇥&lt;span&gt;◦mundo!&lt;/span&gt;⇥◦◦&lt;/h1&gt;</pre>
+
+<p>se representa en el navegador así:</p>
+
+<div class="hidden">
+<h4 id="Hidden_example">Hidden example</h4>
+
+<pre class="brush: html notranslate">&lt;h1&gt;   ¡Hola
+    &lt;span&gt; mundo!&lt;/span&gt;   &lt;/h1&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample('Hidden_example')}}</p>
+
+<p>El elemento <code>&lt;h1&gt;</code> contiene solo elementos en línea. De hecho contiene:</p>
+
+<ul>
+ <li>Un nodo de texto (que consta de algunos espacios, la palabra "¡Hola" y algunas tabulaciones).</li>
+ <li>Un elemento en línea (el <code>&lt;span&gt;</code>, que contiene un espacio, y la palabra "mundo!").</li>
+ <li>Otro nodo de texto (que consta solo de tabulaciones y espacios).</li>
+</ul>
+
+<p>Debido a esto, establece lo que se llama un {{cssxref("Inline_formatting_context", "contexto de formato en línea")}}. Este es uno de los posibles contextos de representación de diseño con los que funcionan los motores del navegador.</p>
+
+<p>Dentro de este contexto, el procesamiento de caracteres de espacio en blanco se puede resumir de la siguiente manera:</p>
+
+<ol>
+ <li>
+  <p>Primero, todos los espacios y tabulaciones inmediatamente antes y después de un salto de línea se ignoran, por lo que, si tomamos nuestro marcado de ejemplo anterior y aplicamos esta primera regla, obtenemos:</p>
+
+  <pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola⏎
+&lt;span&gt;◦mundo!&lt;/span&gt;⇥◦◦&lt;/h1&gt;</pre>
+ </li>
+ <li>
+  <p>A continuación, todos los caracteres de tabulación se tratan como caracteres de espacio, por lo que el ejemplo se convierte en:</p>
+
+  <pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola⏎
+&lt;span&gt;◦mundo!&lt;/span&gt;◦◦◦&lt;/h1&gt;</pre>
+ </li>
+ <li>
+  <p>A continuación, los saltos de línea se convierten en espacios:</p>
+
+  <pre class="brush: html notranslate">&lt;h1&gt;◦◦◦¡Hola◦&lt;span&gt;◦mundo!&lt;/span&gt;◦◦◦&lt;/h1&gt;</pre>
+ </li>
+ <li>
+  <p>Después de eso, cualquier espacio inmediatamente después de otro espacio (incluso a través de dos elementos en línea separados) se ignora, por lo que terminamos con:</p>
+
+  <pre class="brush: html notranslate">&lt;h1&gt;◦¡Hola◦&lt;span&gt;mundo!&lt;/span&gt;◦&lt;/h1&gt;</pre>
+ </li>
+ <li>
+  <p>Y finalmente, las secuencias de espacios al principio y al final de una línea se eliminan, por lo que eventualmente obtenemos esto:</p>
+
+  <pre class="brush: html notranslate">&lt;h1&gt;¡Hola◦&lt;span&gt;mundo!&lt;/span&gt;&lt;/h1&gt;</pre>
+ </li>
+</ol>
+
+<p>Es por eso que las personas que visitan la página web simplemente verán la frase "¡Hola mundo!" muy bien escrita en la parte superior de la página, en lugar de un "!Hola" con una sangría extraña, seguido de un "mundo!" en la línea debajo de esa.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: <a href="/es/docs/Tools">Firefox DevTools</a> ha admitido el resaltado de nodos de texto desde la versión 52, lo que facilita ver exactamente qué contenido hay dentro de los nodos de espacios en blanco. Los nodos de espacios en blanco puros están marcados con una etiqueta "<code>whitespace</code>".</p>
+</div>
+
+<h3 id="Espacio_en_blanco_en_contextos_de_formato_de_bloque">Espacio en blanco en contextos de formato de bloque</h3>
+
+<p>Anteriormente, solo miramos elementos que contienen elementos en línea y contextos de formato en línea. Si un elemento contiene al menos un elemento de bloque, entonces establece lo que se llama un {{cssxref("Block_formatting_context", "contexto de formato de bloque")}}.</p>
+
+<p>En este contexto, los espacios en blanco se tratan de manera muy diferente. Veamos un ejemplo para explicar cómo. Hemos marcado los espacios en blanco como antes.</p>
+
+<pre class="brush: html notranslate">&lt;body&gt;⏎
+⇥&lt;div&gt;◦◦¡Hola◦◦&lt;/div&gt;⏎
+⏎
+◦◦◦&lt;div&gt;◦◦mundo!◦◦&lt;/div&gt;◦◦⏎
+&lt;/body&gt;</pre>
+
+<p>Tenemos 3 nodos de texto que contienen solo espacios en blanco, uno antes del primer <code>&lt;div&gt;</code>, uno entre los 2 <code>&lt;div&gt;</code>s y uno después del segundo <code>&lt;div&gt;</code>.</p>
+
+<p>Esto se renderiza así:</p>
+
+<div class="hidden">
+<h4 id="Hidden_example_2">Hidden example 2</h4>
+
+<pre class="brush: html notranslate">&lt;body&gt;
+  &lt;div&gt;  ¡Hola  &lt;/div&gt;
+
+   &lt;div&gt;  mundo!   &lt;/div&gt;
+&lt;/body&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample('Hidden_example_2')}}</p>
+
+<p>Podemos resumir cómo se maneja el espacio en blanco aquí de la siguiente manera (puede haber algunas pequeñas diferencias en el comportamiento exacto entre los navegadores, pero básicamente, esto funciona):</p>
+
+<ol>
+ <li>
+  <p>Debido a que estamos dentro de un contexto de formato de bloque, todo debe ser un bloque, por lo que nuestros 3 nodos de texto también se convierten en bloques, al igual que los 2 <code>&lt;div&gt;</code>s. Los bloques ocupan todo el ancho disponible y se apilan unos encima de los otros, lo cual significa que terminamos con un diseño compuesto por esta lista de bloques:</p>
+
+  <pre class="brush: html notranslate">&lt;block&gt;⏎⇥&lt;/block&gt;
+&lt;block&gt;◦◦¡Hola◦◦&lt;/block&gt;
+&lt;block&gt;⏎◦◦◦&lt;/block&gt;
+&lt;block&gt;◦◦mundo!◦◦&lt;/block&gt;
+&lt;block&gt;◦◦⏎&lt;/block&gt;</pre>
+ </li>
+ <li>
+  <p>Esto luego se simplifica aún más aplicando las reglas de procesamiento para espacios en blanco en contextos de formato en línea a estos bloques:</p>
+
+  <pre class="brush: html notranslate">&lt;block&gt;&lt;/block&gt;
+&lt;block&gt;¡Hola&lt;/block&gt;
+&lt;block&gt;&lt;/block&gt;
+&lt;block&gt;mundo!&lt;/block&gt;
+&lt;block&gt;&lt;/block&gt;</pre>
+ </li>
+ <li>
+  <p>Los 3 bloques vacíos que tenemos ahora no van a ocupar ningún espacio en el diseño final, porque no contienen nada, así que terminaremos con solo 2 bloques ocupando espacio en la página. Las personas que visitan la página web ven las palabras "!Hola" y "mundo!" en 2 líneas separadas, ya que esperarías que se distribuyeran 2 <code>&lt;div&gt;</code>s. El motor del navegador esencialmente ha ignorado todos los espacios en blanco que se agregaron en el código fuente.</p>
+ </li>
+</ol>
+
+<h2 id="Espacios_entre_elementos_en_línea_y_bloques_en_línea">Espacios entre elementos en línea y bloques en línea</h2>
+
+<p>Ahora analicemos algunos problemas que pueden surgir debido a los espacios en blanco y qué se puede hacer al respecto. En primer lugar, veremos qué sucede con los espacios entre los elementos en línea y de bloque en línea. De hecho, ya vimos esto en nuestro primer ejemplo, cuando describimos cómo se procesan los espacios en blanco dentro de los contextos de formato en línea.</p>
+
+<p>Dijimos que había reglas para ignorar la mayoría de los caracteres, pero que los caracteres que separan palabras permanecen. Cuando solo se trata de elementos a nivel de bloque como <code>&lt;p&gt;</code> que solo contienen elementos en línea como <code>&lt;em&gt;</code>, <code>&lt;strong&gt;</code>, <code>&lt;span&gt;</code>, etc., normalmente no te importa esto porque el espacio en blanco adicional que llega al diseño es útil para separar las palabras en la oración.</p>
+
+<p>Sin embargo, se vuelve más interesante cuando comienzas a usar elementos <code>inline-block</code>. Estos elementos se comportan como elementos en línea en el exterior y como bloques en el interior, y a menudo se utilizan para mostrar piezas de la IU más complejas que solo texto, una al lado de la otra en la misma línea, por ejemplo, elementos del menú de navegación.</p>
+
+<p>Debido a que son bloques, muchas personas esperan que se comporten como tales, pero en realidad no es así. Si hay espacios en blanco de formato entre elementos en línea adyacentes, esto dará como resultado un espacio en el diseño, al igual que los espacios entre palabras en el texto.</p>
+
+<p>Considera este ejemplo (nuevamente, los espacios en blanco en el HTML están marcados para que sean visibles):</p>
+
+<pre class="brush: css notranslate" id="ef6f">.people-list {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+
+.people-list li {
+  display: inline-block;
+  width: 2em;
+  height: 2em;
+  background: #f06;
+  border: 1px solid;
+}
+</pre>
+
+<pre class="brush: html notranslate" id="24bb">&lt;ul class="people-list"&gt;⏎
+
+◦◦&lt;li&gt;&lt;/li&gt;⏎
+
+◦◦&lt;li&gt;&lt;/li&gt;⏎
+
+◦◦&lt;li&gt;&lt;/li&gt;⏎
+
+◦◦&lt;li&gt;&lt;/li&gt;⏎
+
+◦◦&lt;li&gt;&lt;/li&gt;⏎
+
+&lt;/ul&gt;</pre>
+
+<p>Esto se traduce de la siguiente manera:</p>
+
+<div class="hidden">
+<h3 id="Hidden_example_3">Hidden example 3</h3>
+
+<pre class="brush: css notranslate" id="ef6f">.people-list { list-style-type: none; margin: 0; padding: 0; }
+.people-list li { display: inline-block; width: 2em; height: 2em; background: #f06; border: 1px solid; }
+</pre>
+
+<pre class="brush: html notranslate" id="24bb">&lt;ul class="people-list"&gt;
+
+  &lt;li&gt;&lt;/li&gt;
+
+  &lt;li&gt;&lt;/li&gt;
+
+  &lt;li&gt;&lt;/li&gt;
+
+  &lt;li&gt;&lt;/li&gt;
+
+  &lt;li&gt;&lt;/li&gt;
+
+&lt;/ul&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample('Hidden_example_3')}}</p>
+
+<p>Probablemente no desees los espacios entre los bloques — dependiendo del caso de uso (¿esta es una lista de avatares o botones de navegación horizontales?), Probablemente desees que los lados del elemento estén alineados entre sí y poder controlar cualquier espacio tú mismo.</p>
+
+<p>El <em>Inspector HTML de Firefox DevTools</em> resaltará los nodos de texto y también te mostrará exactamente qué áreas están ocupando los elementos, lo que es útil si te preguntas qué está causando el problema y tal vez estés pensando que tienes un margen adicional allí o algo así.</p>
+
+<p><img alt="Espacio en blanco en Devtools" src="https://mdn.mozillademos.org/files/17085/whitespace-devtools.png" style="border-style: solid; border-width: 1px; height: 454px; width: 797px;"></p>
+
+<p>Hay algunas formas de solucionar este problema:</p>
+
+<p>Utiliza <a href="/es/docs/Learn/CSS/CSS_layout/Flexbox">Flexbox</a> para crear la lista horizontal de elementos en lugar de probar una solución de <code>inline-block</code>. Esto se encarga de todo por ti y definitivamente es la solución preferida:</p>
+
+<pre class="brush: css notranslate">ul {
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+}</pre>
+
+<p>Si necesitas confiar en <code>inline-block</code>, puedes establecer el {{cssxref("font-size")}} de la lista a 0. Esto solo trabaja si tus bloques no tienen el tamaño <code>ems</code> (según el <code>font-size</code>, por lo que el tamaño del bloque también terminaría siendo 0). <code>rems</code> sería una buena opción aquí:</p>
+
+<pre class="brush: css notranslate">ul {
+  font-size: 0;
+  ...
+}
+
+li {
+  display: inline-block;
+  width: 2rem;
+  height: 2rem;
+  ...
+}
+</pre>
+
+<p>O puedes establecer un margen negativo en los elementos de la lista:</p>
+
+<pre class="brush: css notranslate">li {
+  display: inline-block;
+  width: 2rem;
+  height: 2rem;
+  margin-right: -0.25rem;
+}</pre>
+
+<p>También puedes resolver este problema colocando los elementos de tu lista en la misma línea en la fuente, lo cual hace que los nodos de espacios en blanco no se creen en primer lugar:</p>
+
+<pre class="brush: html notranslate">&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;&lt;li&gt;&lt;/li&gt;</pre>
+
+<h2 id="Recorrido_del_DOM_y_el_espacio_en_blanco">Recorrido del DOM y el espacio en blanco</h2>
+
+<p>Al intentar realizar una manipulación del <a href="/es/docs/Web/API/Document_Object_Model">DOM</a> en JavaScript, también puedes encontrar problemas debido a los nodos de espacios en blanco. Por ejemplo, si tienes una referencia a un nodo padre y deseas afectar su primer elemento hijo usando <a href="/es/docs/Web/API/Node/firstChild"><code>Node.firstChild</code></a>, si hay un nodo de espacio en blanco deshonesto justo después de la etiqueta de apertura principal, no obtendrás el resultado que esperabas. Se seleccionaría el nodo de texto en lugar del elemento al que deseas afectar.</p>
+
+<p>Veamos otro ejemplo, si tienes un determinado subconjunto de elementos en los que deseas hacer algo en función de si están vacíos (no tienen nodos secundarios) o, no puedes verificar si cada elemento está vacío usando algo como <a href="/es/docs/Web/API/Node/hasChildNodes"><code>Node.hasChildNodes()</code></a>, pero nuevamente, si algún elemento destino contiene nodos de texto, podrías terminar con resultados falsos.</p>
+
+<h2 id="Funciones_auxiliares_de_espacios_en_blanco">Funciones auxiliares de espacios en blanco</h2>
+
+<p>El siguiente código JavaScript define varias funciones que facilitan el manejo de espacios en blanco en el DOM:</p>
+
+<pre class="brush: js notranslate">/**
+ * En todo, el espacio en blanco se define como uno de los caracteres
+ *  "\t" TAB \u0009
+ *  "\n" LF  \u000A
+ *  "\r" CR  \u000D
+ *  " "  SPC \u0020
+ *
+ * Esto no usa la "\s" de Javascript porque eso incluye
+ * espacios irrompibles (y también algunos otros caracteres).
+ */
+
+
+/**
+ * Determina si el contenido de texto de un nodo es completamente de espacios en blanco.
+ *
+ * @param nod  Un nodo que implementa la interfaz | CharacterData | (es decir,
+ *             un nodo |Text|, |Comment| o |CDATASection|
+ * @return     True si todo el contenido de texto de |nod| es espacio en blanco,
+ *             de lo contrario false.
+ */
+function is_all_ws( nod )
+{
+  // Usa las características de String y RegExp de ECMA-262 Edición 3
+  return !(/[^\t\n\r ]/.test(nod.textContent));
+}
+
+
+/**
+ * Determina si un nodo debe ser ignorado por las funciones del iterador.
+ *
+ * @param nod  Un objeto implementando la interfaz |Node| de DOM1.
+ * @return     true si el nodo es:
+ *                1) Un nodo |Text| en que todo es espacio en blanco
+ *                2) Un nodo |Comment|
+ *             y de lo contrario false.
+ */
+
+function is_ignorable( nod )
+{
+  return ( nod.nodeType == 8) || // Un nodo comment
+         ( (nod.nodeType == 3) &amp;&amp; is_all_ws(nod) ); // un nodo text, todo es eeb
+}
+
+/**
+ * Versión de |previousSibling| que omite los nodos que son completamente
+ * espacio en blanco o comentarios.  (Normalmente |previousSibling| es una propiedad
+ * de todos los nodos DOM que devuelve el nodo hermano, el nodo que es
+ * un hijo del mismo padre, que ocurre inmediatamente antes del
+ * nodo de referencia).
+ *
+ * @param sib  El nodo de referencia.
+ * @return     O bien:
+ *               1) El hermano anterior más cercano a |sib| eso no es
+ *                  ignorable según |is_ignorable|, o
+ *               2) null si no existe tal nodo.
+ */
+function node_before( sib )
+{
+  while ((sib = sib.previousSibling)) {
+    if (!is_ignorable(sib)) return sib;
+  }
+  return null;
+}
+
+/**
+ * Versión de |nextSibling| que omite los nodos que son completamente
+ * espacio en blanco o comentarios.
+ *
+ * @param sib  El nodo de referencia.
+ * @return     O bien:
+ *               1) El hermano más cercano a |sib| eso no es
+ *                  ignorable según |is_ignorable|, o
+ *               2) null si no existe tal nodo.
+ */
+function node_after( sib )
+{
+  while ((sib = sib.nextSibling)) {
+    if (!is_ignorable(sib)) return sib;
+  }
+  return null;
+}
+
+/**
+ * Versión de |lastChild| que omite los nodos que son completamente
+ * espacio en blanco o comentarios.  (Normalmente |lastChild| es una propiedad
+ * de todos los nodos del DOM que da el último de los nodos contenidos
+ * directamente en el nodo de referencia).
+ *
+ * @param sib  El nodo de referencia.
+ * @return     O bien:
+ *               1) El último hijo de |sib| eso no es
+ *                  ignorable según |is_ignorable|, o
+ *               2) null si no existe tal nodo.
+ */
+function last_child( par )
+{
+  var res=par.lastChild;
+  while (res) {
+    if (!is_ignorable(res)) return res;
+    res = res.previousSibling;
+  }
+  return null;
+}
+
+/**
+ * Versión de |firstChild| que omite los nodos que son completamente
+ * espacios en blanco y comentarios.
+ *
+ * @param sib  El nodo de referencia.
+ * @return     O bien:
+ *               1) El primer hijo de |sib| eso no es
+ *                  ignorable según |is_ignorable|, o
+ *               2) null si no existe tal nodo.
+ */
+function first_child( par )
+{
+  var res=par.firstChild;
+  while (res) {
+    if (!is_ignorable(res)) return res;
+    res = res.nextSibling;
+  }
+  return null;
+}
+
+/**
+ * Versión de |data| que no incluye espacios en blanco al principio
+ * y finaliza y normaliza todos los espacios en blanco a un solo espacio.  (Normalmente
+ * |data| es una propiedad de los nodos de texto que proporciona el texto del nodo).
+ *
+ * @param txt  El nodo de texto cuyos datos se deben devolver
+ * @return     Una cadena que proporciona el contenido del nodo de texto con
+ *             espacios en blanco colapsados.
+ */
+function data_of( txt )
+{
+  var data = txt.textContent;
+  // Usa las características de String y RegExp de ECMA-262 Edición 3
+  data = data.replace(/[\t\n\r ]+/g, " ");
+  if (data.charAt(0) == " ")
+    data = data.substring(1, data.length);
+  if (data.charAt(data.length - 1) == " ")
+    data = data.substring(0, data.length - 1);
+  return data;
+}
+</pre>
+
+<h3 id="Ejemplo">Ejemplo</h3>
+
+<p>El siguiente código demuestra el uso de las funciones anteriores. Itera sobre los hijos de un elemento (cuyos hijos son todos elementos) para encontrar aquel cuyo texto es <code>"Este es el tercer párrafo"</code>, y luego cambia el atributo de clase y el contenido de ese párrafo.</p>
+
+<pre class="brush: js notranslate">var cur = first_child(document.getElementById("test"));
+while (cur)
+{
+  if (data_of(cur.firstChild) == "Este es el tercer párrafo.")
+  {
+    cur.className = "magic";
+    cur.firstChild.textContent = "Este es el párrafo mágico.";
+  }
+  cur = node_after(cur);
+}
+</pre>
diff --git a/files/es/web/api/documentorshadowroot/getselection/index.html b/files/es/web/api/documentorshadowroot/getselection/index.html
new file mode 100644
index 0000000000..21153bf09b
--- /dev/null
+++ b/files/es/web/api/documentorshadowroot/getselection/index.html
@@ -0,0 +1,14 @@
+---
+title: Document.getSelection()
+slug: Web/API/DocumentOrShadowRoot/getSelection
+tags:
+  - Referencia
+  - Selección
+  - metodo
+translation_of: Web/API/DocumentOrShadowRoot/getSelection
+translation_of_original: Web/API/Document/getSelection
+original_slug: Web/API/Document/getSelection
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>Este método funciona exactamente igual que {{domxref("Window.getSelection()")}}; devuelve un objeto {{domxref("Selection")}} que representa el texto que se ha seleccionado en el documento.</p>
diff --git a/files/es/web/api/documentorshadowroot/pointerlockelement/index.html b/files/es/web/api/documentorshadowroot/pointerlockelement/index.html
new file mode 100644
index 0000000000..b785328d1c
--- /dev/null
+++ b/files/es/web/api/documentorshadowroot/pointerlockelement/index.html
@@ -0,0 +1,106 @@
+---
+title: Document.pointerLockElement
+slug: Web/API/DocumentOrShadowRoot/pointerLockElement
+translation_of: Web/API/DocumentOrShadowRoot/pointerLockElement
+original_slug: Web/API/Document/pointerLockElement
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>La propiedad <code>pointerLockElement</code> conserva el elemento adquirido, para el evento del mouse, mientras el bloqueo se encuentre activo .  Es <code>null</code> si el bloqueo se encuentra en estado pendiente para bloqueo, o si el bloqueo se ha liberado, es decir ya no se encuentra en estado bloqueado, o si el elemento bloqueado se encuentra en otro documento.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var elemento = document.pointerLockElement;
+</pre>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Un {{domxref("Element")}} o <code>null</code>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Bloquear puntero','l#extension-to-the-document-interface','Document')}}</td>
+   <td>{{Spec2('Pointer lock')}}</td>
+   <td>Extiende de la interfaz <code>Document</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad del Navegador</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{ CompatVersionUnknown() }} {{property_prefix("webkit")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatVersionUnknown() }} {{property_prefix("moz")}}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>Soporte sin prefijar</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop(50)}}</td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también:</h2>
+
+<ul>
+ <li>{{ domxref("Document.exitPointerLock()") }}</li>
+ <li>{{ domxref("Element.requestPointerLock()") }}</li>
+ <li><a href="/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock</a></li>
+</ul>
diff --git a/files/es/web/api/documentorshadowroot/stylesheets/index.html b/files/es/web/api/documentorshadowroot/stylesheets/index.html
new file mode 100644
index 0000000000..94c43bd765
--- /dev/null
+++ b/files/es/web/api/documentorshadowroot/stylesheets/index.html
@@ -0,0 +1,23 @@
+---
+title: Document.styleSheets
+slug: Web/API/DocumentOrShadowRoot/styleSheets
+translation_of: Web/API/DocumentOrShadowRoot/styleSheets
+translation_of_original: Web/API/Document/styleSheets
+original_slug: Web/API/Document/styleSheets
+---
+<p>{{ ApiRef() }}</p>
+<h3 id="Summary" name="Summary">Resumen</h3>
+<p>Devuelve una lista de objetos de tipo <a href="/es/DOM/stylesheet" title="es/DOM/stylesheet">stylesheet</a> para las hojas de estilo que están específicamente enlazadas o contenidas en el documento.</p>
+<h3 id="Properties" name="Properties">Propiedades</h3>
+<p><code>styleSheetList.length</code> - devuelve el número de objetos de tipo stylesheet contenidos en el objeto.</p>
+<h3 id="Syntax" name="Syntax">Sintaxis</h3>
+<pre class="eval"><em>styleSheetList</em> = <em>document</em>.styleSheets
+</pre>
+<p>El objeto devuelto es del tipo <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/stylesheets.html#StyleSheets-DocumentStyle-styleSheets">StyleSheetList</a>.</p>
+<p>Es una colección ordenada de objetos de tipo <a href="/es/DOM/stylesheet" title="es/DOM/stylesheet">stylesheet</a>. <code><em>styleSheetList</em>.item(<em>index</em>)</code> o simplemente <code><em>styleSheetList</em>{{ mediawiki.external('
+ <i>
+  index</i>
+ ') }}</code> devuelve un único objeto de tipo stylesheet con el índice especificado (el índice es de origen 0).</p>
+<h3 id="Specification" name="Specification">Especificación</h3>
+<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/stylesheets.html#StyleSheets-DocumentStyle-styleSheets">DOM Level 2 Style: styleSheets</a></p>
+<p>{{ languages( { "ja": "ja/DOM/document.styleSheets", "pl": "pl/DOM/document.styleSheets" } ) }}</p>
diff --git a/files/es/web/api/domstring/binary/index.html b/files/es/web/api/domstring/binary/index.html
new file mode 100644
index 0000000000..e430db0ebf
--- /dev/null
+++ b/files/es/web/api/domstring/binary/index.html
@@ -0,0 +1,32 @@
+---
+title: Cadenas binarias
+slug: Web/API/DOMString/Binary
+tags:
+  - Arreglos tipados JavaScript
+  - Cadena
+  - Cadena de caracteres
+  - DOM
+  - JavaScript
+  - Referencia
+  - String
+translation_of: Web/API/DOMString/Binary
+original_slug: Web/API/DOMString/Cadenas_binarias
+---
+<p>{{jsxref("String", "Cadenas JavaScript")}} son cadenas codificadas en UTF-16. Esto significa que cada unidad de código requiere dos bytes de memoria y puede representar <code>65535</code> puntos de código diferentes. Un subconjunto de estas cadenas está representado por cadenas UTF-16 que contienen solo caracteres ASCII (es decir, caracteres cuyo punto de código no excede <code>127</code>). Por ejemplo, la cadena <code>"¡Hola mundo!"</code> pertenece al subconjunto ASCII, mientras que la cadena <code>"ÀÈÌÒÙ"</code> no. Una <strong>cadena binaria</strong> es un concepto similar al subconjunto ASCII, pero en lugar de limitar el rango a <code>127</code>, permite hasta <code>255</code> puntos de código. Sin embargo, su propósito no es representar caracteres, sino datos binarios. El tamaño de los datos así representados es el doble de lo que sería en formato binario normal, sin embargo, esto no será visible para el usuario final, ya que la longitud de las cadenas de JavaScript se calcula usando dos bytes como unidad.</p>
+
+<p>Las cadenas binarias no forman parte del diseño del lenguaje JavaScript. Sin embargo, al menos una función nativa requiere cadenas binarias como entrada, {{domxref("WindowBase64.btoa", "btoa()")}}: invocarla en una cadena que contiene puntos de código mayores de <code>255</code> causará un error <code>Caracter fuera de rango</code>.</p>
+
+<p>La razón que llevó al uso de unidades de código UTF-16 como marcadores de posición para los números <code>uint8</code> es que a medida que las aplicaciones web se vuelven cada vez más poderosas (agregando funciones como manipulación de audio y video, acceso a datos sin procesar usando WebSockets, y así sucesivamente) ha quedado claro que hay ocasiones en las que sería útil que el código JavaScript pudiera manipular rápida y fácilmente datos binarios sin procesar.</p>
+
+<p>En el pasado, esto se tenía que simular tratando los datos sin procesar como <a href="https://developer.mozilla.org/es/docs/JavaScript/Reference/Global_Objects/String" title="JavaScript/Reference/Global_Objects/String">string</a> y utilizar el método <a href="https://developer.mozilla.org/es/docs/JavaScript/Reference/Global_Objects/String/charCodeAt" title="JavaScript/Reference/Global_Objects/String/charCodeAt"><code>charCodeAt()</code></a> para leer los bytes del búfer de datos (es decir, usando cadenas binarias). Sin embargo, esto es lento y propenso a errores, debido a la necesidad de múltiples conversiones (especialmente si los datos binarios en realidad no son datos en formato de bytes, sino, por ejemplo, enteros de 32 bits o flotantes).</p>
+
+<p>Los <a href="/es/docs/Web/JavaScript/Typed_arrays" title="/es/docs/Web/JavaScript/Typed_arrays">arreglos tipados en JavaScript</a> proporcionan un mecanismo para acceder a datos binarios sin procesar mucho más eficientemente. La API de <a href="/es/docs/Web/JavaScript/Typed_arrays/StringView" title="/es/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a> <span class="inlineIndicator" title="Esta API no es nativa"> cuyo constructor no es nativo</span> está un nivel por encima de los arreglos tipados y proporciona una interfaz para cadenas similar a la de <a class="external" href="http://en.wikipedia.org/wiki/C_(lenguaje_de_programación)">C</a>.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Typed_arrays" title="/es/docs/Web/JavaScript/Typed_arrays">Arreglos tipados</a></li>
+ <li><a href="/es/docs/Web/API/DOMString" title="/es/docs/Web/API/DOMString/Binary"><code>DOMString</code></a></li>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/String" title="/es/docs/Web/API/DOMString">String</a></li>
+ <li><a href="/es/docs/Web/JavaScript/Typed_arrays/StringView" title="/es/docs/Web/JavaScript/Typed_arrays/String_view"><code>StringView</code></a></li>
+</ul>
diff --git a/files/es/web/api/domstring/cadenas_binarias/index.html b/files/es/web/api/domstring/cadenas_binarias/index.html
deleted file mode 100644
index a52358f62c..0000000000
--- a/files/es/web/api/domstring/cadenas_binarias/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title: Cadenas binarias
-slug: Web/API/DOMString/Cadenas_binarias
-tags:
-  - Arreglos tipados JavaScript
-  - Cadena
-  - Cadena de caracteres
-  - DOM
-  - JavaScript
-  - Referencia
-  - String
-translation_of: Web/API/DOMString/Binary
----
-<p>{{jsxref("String", "Cadenas JavaScript")}} son cadenas codificadas en UTF-16. Esto significa que cada unidad de código requiere dos bytes de memoria y puede representar <code>65535</code> puntos de código diferentes. Un subconjunto de estas cadenas está representado por cadenas UTF-16 que contienen solo caracteres ASCII (es decir, caracteres cuyo punto de código no excede <code>127</code>). Por ejemplo, la cadena <code>"¡Hola mundo!"</code> pertenece al subconjunto ASCII, mientras que la cadena <code>"ÀÈÌÒÙ"</code> no. Una <strong>cadena binaria</strong> es un concepto similar al subconjunto ASCII, pero en lugar de limitar el rango a <code>127</code>, permite hasta <code>255</code> puntos de código. Sin embargo, su propósito no es representar caracteres, sino datos binarios. El tamaño de los datos así representados es el doble de lo que sería en formato binario normal, sin embargo, esto no será visible para el usuario final, ya que la longitud de las cadenas de JavaScript se calcula usando dos bytes como unidad.</p>
-
-<p>Las cadenas binarias no forman parte del diseño del lenguaje JavaScript. Sin embargo, al menos una función nativa requiere cadenas binarias como entrada, {{domxref("WindowBase64.btoa", "btoa()")}}: invocarla en una cadena que contiene puntos de código mayores de <code>255</code> causará un error <code>Caracter fuera de rango</code>.</p>
-
-<p>La razón que llevó al uso de unidades de código UTF-16 como marcadores de posición para los números <code>uint8</code> es que a medida que las aplicaciones web se vuelven cada vez más poderosas (agregando funciones como manipulación de audio y video, acceso a datos sin procesar usando WebSockets, y así sucesivamente) ha quedado claro que hay ocasiones en las que sería útil que el código JavaScript pudiera manipular rápida y fácilmente datos binarios sin procesar.</p>
-
-<p>En el pasado, esto se tenía que simular tratando los datos sin procesar como <a href="https://developer.mozilla.org/es/docs/JavaScript/Reference/Global_Objects/String" title="JavaScript/Reference/Global_Objects/String">string</a> y utilizar el método <a href="https://developer.mozilla.org/es/docs/JavaScript/Reference/Global_Objects/String/charCodeAt" title="JavaScript/Reference/Global_Objects/String/charCodeAt"><code>charCodeAt()</code></a> para leer los bytes del búfer de datos (es decir, usando cadenas binarias). Sin embargo, esto es lento y propenso a errores, debido a la necesidad de múltiples conversiones (especialmente si los datos binarios en realidad no son datos en formato de bytes, sino, por ejemplo, enteros de 32 bits o flotantes).</p>
-
-<p>Los <a href="/es/docs/Web/JavaScript/Typed_arrays" title="/es/docs/Web/JavaScript/Typed_arrays">arreglos tipados en JavaScript</a> proporcionan un mecanismo para acceder a datos binarios sin procesar mucho más eficientemente. La API de <a href="/es/docs/Web/JavaScript/Typed_arrays/StringView" title="/es/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a> <span class="inlineIndicator" title="Esta API no es nativa"> cuyo constructor no es nativo</span> está un nivel por encima de los arreglos tipados y proporciona una interfaz para cadenas similar a la de <a class="external" href="http://en.wikipedia.org/wiki/C_(lenguaje_de_programación)">C</a>.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Typed_arrays" title="/es/docs/Web/JavaScript/Typed_arrays">Arreglos tipados</a></li>
- <li><a href="/es/docs/Web/API/DOMString" title="/es/docs/Web/API/DOMString/Binary"><code>DOMString</code></a></li>
- <li><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/String" title="/es/docs/Web/API/DOMString">String</a></li>
- <li><a href="/es/docs/Web/JavaScript/Typed_arrays/StringView" title="/es/docs/Web/JavaScript/Typed_arrays/String_view"><code>StringView</code></a></li>
-</ul>
diff --git a/files/es/web/api/element/accesskey/index.html b/files/es/web/api/element/accesskey/index.html
deleted file mode 100644
index 7d73c395fc..0000000000
--- a/files/es/web/api/element/accesskey/index.html
+++ /dev/null
@@ -1,23 +0,0 @@
----
-title: Element.accessKey
-slug: Web/API/Element/accessKey
-tags:
-  - API
-  - Propiedad
-  - necesidades de contenido
-translation_of: Web/API/HTMLElement/accessKey
-translation_of_original: Web/API/Element/accessKey
----
-<div>{{APIRef("DOM")}}</div>
-
-<div> </div>
-
-<p><span id="result_box" lang="es"><span>La propiedad</span> <strong><span>Element.accessKey</span></strong> <span>establece la pulsación</span><span> de teclado</span> <span>mediante el cual un</span> <span>usuario puede presionar</span> <span>para saltar a</span> <span>este elemento</span><span>.</span></span></p>
-
-<div class="note">
-<p><span id="result_box" lang="es"><span>Nota: la propiedad</span> <strong><span>Element.accessKey</span></strong> <span>se usa raramente</span> <span>debido a sus</span> <span>múltiples</span> <span>conflictos con las asociaciones de teclas</span> <span>que ya están presentes</span>  <span>en los navegadores</span><span>.</span> <span>Para evitar</span> <span>esto,</span> <span>los navegadores implementan</span> <span>el comportamiento</span> <span>tecla de acceso</span> <span>si</span> <span>se pulsan las claves</span> <span>con otras teclas</span> <span>"cualificadas</span><span>" (como</span> <span>Alt</span> <span>+</span> <span>tecla de acceso</span><span>)</span><span>.</span></span></p>
-</div>
-
-<p> </p>
-
-<p> </p>
diff --git a/files/es/web/api/element/blur_event/index.html b/files/es/web/api/element/blur_event/index.html
new file mode 100644
index 0000000000..5d03222d92
--- /dev/null
+++ b/files/es/web/api/element/blur_event/index.html
@@ -0,0 +1,157 @@
+---
+title: blur (evento)
+slug: Web/API/Element/blur_event
+tags:
+  - DOM
+translation_of: Web/API/Element/blur_event
+original_slug: Web/Events/blur
+---
+<p>El evento <code>blur</code> es disparado cuando un elemento ha perdido su foco. La diferencia principal entre este evento y <code><a href="/en-US/docs/Mozilla_event_reference/focusout">focusout</a></code> es que sólo el último se propaga (bubbles).</p>
+
+<h2 id="Información_General">Información General</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
+ <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-blur">DOM L3</a></dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
+ <dd style="margin: 0 0 0 120px;">{{domxref("FocusEvent")}}</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Burbujas</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Objetivo</dt>
+ <dd style="margin: 0 0 0 120px;">Element</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Acción por defecto</dt>
+ <dd style="margin: 0 0 0 120px;">Ninguna.</dd>
+</dl>
+
+<p>{{NoteStart}}El valor de  {{domxref("Document.activeElement")}} varía a traves de navegadores mientras este evento está siendo manejado ({{bug(452307)}}): IE10 lo agrega al elemento al cual el foco se movera, mientras Firefox y Chrome muy seguido lo agregan al cuerpo del documento.{{NoteEnd}}</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedad</th>
+   <th scope="col">Tipo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyInline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>Objetivo del evento (elemento DOM)</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>El tipo de evento.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Si el elemento normalmente se propaga o no.</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Si el evento es cancelable o no.</td>
+  </tr>
+  <tr>
+   <td><code>relatedTarget</code> {{readonlyInline}}</td>
+   <td>{{domxref("EventTarget")}} (DOM element)</td>
+   <td>null</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Delegación_de_eventos">Delegación de eventos</h2>
+
+<p>Hay dos maneras de implementar la delegación de eventos para este evento: usando el evento <code>focusout</code> en exploradores que lo soporten, o cambiando el parámetro "useCapture" de <a href="/en-US/docs/DOM/element.addEventListener"><code>addEventListener</code></a> a <code>true</code>:</p>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush:html;">&lt;form id="form"&gt;
+  &lt;input type="text" placeholder="text input"&gt;
+  &lt;input type="password" placeholder="password"&gt;
+&lt;/form&gt;</pre>
+
+<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
+
+<pre class="brush: js">var form = document.getElementById("form");
+form.addEventListener("focus", function( event ) {
+  event.target.style.background = "pink";
+}, true);
+form.addEventListener("blur", function( event ) {
+  event.target.style.background = "";
+}, true);</pre>
+
+<p>{{EmbedLiveSample('Delegación_de_eventos')}}</p>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>5</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+   <td>6</td>
+   <td>12.1</td>
+   <td>5.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4.0</td>
+   <td>53</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.0</td>
+   <td>12.1</td>
+   <td>5.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Antes de Gecko 24 {{geckoRelease(24)}} la interfaz para este evento era {{domxref("Event")}}, no {{domxref("FocusEvent")}}. Vea ({{bug(855741)}}).</p>
+
+<h2 id="Eventos_relacionados">Eventos relacionados</h2>
+
+<ul>
+ <li>{{event("focus")}}</li>
+ <li>{{event("blur")}}</li>
+ <li>{{event("focusin")}}</li>
+ <li>{{event("focusout")}}</li>
+</ul>
diff --git a/files/es/web/api/element/name/index.html b/files/es/web/api/element/name/index.html
deleted file mode 100644
index c970ea8947..0000000000
--- a/files/es/web/api/element/name/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: Element.name
-slug: Web/API/Element/name
-tags:
-  - API
-  - Compatibilidad de los navegadores
-  - DOM
-  - Elemento
-  - Propiedad
-  - Referencia
-  - Web
-  - actualizacion
-translation_of: Web/API
-translation_of_original: Web/API/Element/name
----
-<p>{{ APIRef("DOM") }}</p>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p><code><strong>name</strong></code> <span id="result_box" lang="es"><span>obtiene o establece</span> <span>la</span> <span>propiedad del nombre</span> <span>de un</span> <span>objeto DOM</span><span>;</span> <span>sólo se aplica a</span> <span>los</span> <span>siguientes elementos</span><span>:</span></span> {{ HTMLelement("a") }}, {{ HTMLelement("applet") }}, {{ HTMLelement("button") }}, {{ HTMLelement("form") }}, {{ HTMLelement("frame") }}, {{ HTMLelement("iframe") }}, {{ HTMLelement("img") }}, {{ HTMLelement("input") }}, {{ HTMLelement("map") }}, {{ HTMLelement("meta") }}, {{ HTMLelement("object") }}, {{ HTMLelement("param") }}, {{ HTMLelement("select") }}, and {{ HTMLelement("textarea") }}.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> <code>La propiedad name no esixte para otros elementos</code>; a diferencia de <a href="/en/DOM/Element.tagName" title="en/DOM/element.tagName"><code>tagName</code></a> y <a href="/en/DOM/Node.nodeName" title="en/DOM/Node.nodeName"><code>nodeName</code></a>, no es una propiedad de los modos de comunicación (interfaces) {{domxref("Node")}}, {{domxref("Element")}} or {{domxref("HTMLElement")}}.</p>
-</div>
-
-<p><code>name</code> puede ser utilizado en el método{{ domxref("document.getElementsByName()") }} , en una <a href="/en/DOM/HTMLFormElement" title="en/DOM/form">configuración</a> y con la colección de <a href="/en/DOM/form.elements" title="en/DOM/form.elements">elementos</a> de la configuración. cuando utilizamos una configuración o  elementos de una colección, puede devolver un solo elemento o una colección.</p>
-
-<h2 id="Syntax" name="Syntax">Síntasix</h2>
-
-<pre class="eval"><em>HTMLElement</em>.name = <em>string</em>;
-var elName = <em>HTMLElement</em>.name;
-
-var fControl = <em>HTMLFormElement</em>.<em>elementName</em>;
-var controlCollection = <em>HTMLFormElement</em>.elements.<em>elementName</em>;
-</pre>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<pre class="eval">&lt;form action="" name="formA"&gt;
-  &lt;input type="text" value="foo"&gt;
-&lt;/form&gt;
-
-&lt;script type="text/javascript"&gt;
-
-  // Get a reference to the first element in the form
-  var formElement = document.forms['formA'].elements[0];
-
-  // Give it a name
-  formElement.name = 'inputA';
-
-  // Show the value of the input
-  alert(document.forms['formA'].elements['inputA'].value);
-
-&lt;/script&gt;
-</pre>
-
-<h2 id="Notes" name="Notes">Notas</h2>
-
-<p>En Internet Explorer (IE), la propiedad <code>name</code> de los objetos DOM , creada utilizando{{ domxref("document.createElement()") }} no puede ser establecida o modificada</p>
-
-<h2 id="Specification" name="Specification">Especificaciones</h2>
-
-<p>W3C DOM 2 HTML Specification:</p>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-32783304">Anchor</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-39843695">Applet</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-34812697">Button</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-22051454">Form</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-91128709">Frame</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-96819659">iFrame</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-47534097">Image</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-89658498">Input</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-52696514">Map</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-31037081">Meta</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-20110362">Object</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-59871447">Param</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-41636323">Select</a></li>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-70715578">Textarea</a></li>
-</ul>
diff --git a/files/es/web/api/element/ongotpointercapture/index.html b/files/es/web/api/element/ongotpointercapture/index.html
deleted file mode 100644
index 3023c3758e..0000000000
--- a/files/es/web/api/element/ongotpointercapture/index.html
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: Element.ongotpointercapture
-slug: Web/API/Element/ongotpointercapture
-tags:
-  - API
-  - Controlador
-  - DOM
-  - Elemento
-  - Eventos Puntero
-  - Propiedad
-  - Referencia
-translation_of: Web/API/GlobalEventHandlers/ongotpointercapture
-translation_of_original: Web/API/Element/ongotpointercapture
----
-<p>{{ ApiRef("DOM") }}</p>
-
-<p><code>ongotpointercapture</code> es una propiedad {{domxref("EventHandler")}} de la interfaz {{domxref("Element")}}  <span id="result_box" lang="es"><span>que devuelve</span> <span>el controlador de eventos</span> <span>(función</span><span>)</span> <span>para el</span></span> evento tipo {{event("gotpointercapture")}}.</p>
-
-<h2 id="Syntax" name="Syntax">Síntasix</h2>
-
-<pre class="eval">var gotCaptureHandler = target.ongotpointercpature;
-</pre>
-
-<h3 id="Return_Value" name="Return_Value">Valor de Retorno</h3>
-
-<dl>
- <dt><code>gotCaptureHandler</code></dt>
- <dd><span id="result_box" lang="es"><span>El controlador de eventos</span>  <span>gotpointercapture</span> para el <span>elemento target</span><span>.</span></span></dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: js">&lt;html&gt;
-&lt;script&gt;
-function overHandler(ev) {
- // Determine the target event's gotpointercapture handler
- var gotCaptureHandler = ev.target.ongotpointercapture;
-}
-function init() {
- var el=document.getElementById("target");
- el.onpointerover = overHandler;
-}
-&lt;/script&gt;
-&lt;body onload="init();"&gt;
-&lt;div id="target"&gt; Touch me ... &lt;/div&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Pointer Events 2','#widl-Element-ongotpointercapture', 'ongotpointercapture')}}</td>
-   <td>{{Spec2('Pointer Events 2')}}</td>
-   <td>Versión no estable.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('Pointer Events', '#widl-Element-ongotpointercapture', 'ongotpointercapture')}}</td>
-   <td>{{Spec2('Pointer Events')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad en los Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Función</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}} <sup>[1]</sup></td>
-   <td>{{CompatIE("10")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Función</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Firefox OS</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatIE("10")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Implementación retirada. Ver {{Bug("1166347")}}.</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{ event("gotpointercapture") }}</li>
-</ul>
diff --git a/files/es/web/api/element/onlostpointercapture/index.html b/files/es/web/api/element/onlostpointercapture/index.html
deleted file mode 100644
index 9a07506d45..0000000000
--- a/files/es/web/api/element/onlostpointercapture/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: Element.onlostpointercapture
-slug: Web/API/Element/onlostpointercapture
-tags:
-  - API
-  - Controlador de Eventos
-  - DOM
-  - Eventos Puntero
-  - Propiedad
-  - Referencia
-translation_of: Web/API/GlobalEventHandlers/onlostpointercapture
-translation_of_original: Web/API/Element/onlostpointercapture
----
-<p>{{ ApiRef("DOM") }}</p>
-
-<p><code>onlostpointercapture</code> es una propiedad {{domxref("EventHandler")}} de la interfaz {{domxref("Element")}}  <span id="result_box" lang="es"><span>que devuelve</span> <span>el controlador de eventos</span> <span>(función</span><span>)</span> <span>para el evento tipo </span></span>{{event("lostpointercapture")}} .</p>
-
-<h2 id="Syntax" name="Syntax">Síntasix</h2>
-
-<pre class="eval">var lostCaptureHandler = target.onlostpointercpature;
-</pre>
-
-<h3 id="Return_Value" name="Return_Value">Valor de Retorno</h3>
-
-<dl>
- <dt><code>lostCaptureHandler</code></dt>
- <dd>El controlador de eventos  <em>lostpointercapture</em> para el elemento <code>target</code>.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: js">&lt;html&gt;
-&lt;script&gt;
-function overHandler(ev) {
- // Determine the target event's lostpointercapture handler
- var lostCaptureHandler = ev.target.onlostpointercapture;
-}
-function init() {
- var el=document.getElementById("target");
- el.onpointerover = overHandler;
-}
-&lt;/script&gt;
-&lt;body onload="init();"&gt;
-&lt;div id="target"&gt; Touch me ... &lt;/div&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Pointer Events 2','#widl-Element-onlostpointercapture', 'onlostpointercapture')}}</td>
-   <td>{{Spec2('Pointer Events 2')}}</td>
-   <td>Versión no estable.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('Pointer Events', '#widl-Element-onlostpointercapture', 'onlostpointercapture')}}</td>
-   <td>{{Spec2('Pointer Events')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad en los Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Función</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}} <sup>[1]</sup></td>
-   <td>{{CompatIE("10")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Función</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Firefox OS</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatIE("10")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Implementación retirada. Ver {{Bug("1166347")}}.</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{ event("lostpointercapture") }}</li>
-</ul>
diff --git a/files/es/web/api/element/onwheel/index.html b/files/es/web/api/element/onwheel/index.html
deleted file mode 100644
index b8f829969b..0000000000
--- a/files/es/web/api/element/onwheel/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title: Element.onwheel
-slug: Web/API/Element/onwheel
-tags:
-  - API
-  - DOM
-  - Gecko
-  - Propiedad
-  - Referencia
-translation_of: Web/API/GlobalEventHandlers/onwheel
----
-<p>{{ ApiRef("DOM") }}</p>
-
-<p>{{ non-standard_header() }}</p>
-
-<h3 id="Sumario">Sumario</h3>
-
-<p>La propiedad  <code>onwheel</code> devuelve el código del controlador de eventos <code>onwheel</code> en el elemento actual.</p>
-
-<h3 id="Syntax">Syntax</h3>
-
-<pre class="eval">element.onwheel = <em>event handling code</em>
-</pre>
-
-<h3 id="Notas">Notas</h3>
-
-<p>El evento <code>wheel</code> se genera cuando el usuario desplaza el contenido de un elemento.</p>
-
-<h3 id="Ver_también">Ver también</h3>
-
-<p><a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=18542" title="https://www.w3.org/Bugs/Public/show_bug.cgi?id=18542">Bug 18542 – el atributo onmousewheel  debe ser reemplazado con onwheel</a></p>
diff --git a/files/es/web/api/elementcssinlinestyle/style/index.html b/files/es/web/api/elementcssinlinestyle/style/index.html
new file mode 100644
index 0000000000..dbe5d50c77
--- /dev/null
+++ b/files/es/web/api/elementcssinlinestyle/style/index.html
@@ -0,0 +1,53 @@
+---
+title: Element.style
+slug: Web/API/ElementCSSInlineStyle/style
+translation_of: Web/API/ElementCSSInlineStyle/style
+original_slug: Web/API/HTMLElement/style
+---
+<p>{{ ApiRef("HTML DOM") }}</p>
+
+<h3 id="Summary" name="Summary">Resumen</h3>
+
+<p>Devuelve un objeto que representa el atributo <code>style </code>del elemento.</p>
+
+<h3 id="Example" name="Example">Ejemplo</h3>
+
+<pre class="eval">var div = document.getElementById("div1");
+div.style.marginTop = ".25in";
+</pre>
+
+<h3 id="Notes" name="Notes">Notas</h3>
+
+<p>Ya que la propiedad <code>style </code>tiene la misma (y más alta) prioridad en la cascada CSS que las declaraciones <em>in-line</em> hechas mediante el atributo style, resulta muy útil para establecer el estilo en un elemento específico. </p>
+
+<p>Sin embargo, no resulta útil para aprender acerca del estilo original de un elemento, ya que representa sólo la declaración CSS en el atributo style <em>in-line</em> y no aquellos atributos que vienen de alguna otra parte, como las declaraciones en la sección &lt;head&gt; o en hojas de estilo.</p>
+
+<p>Para recoger los valores de todas las propiedades CSS de un elemento, deberías usar <a href="/Es/DOM/Window.getComputedStyle" title="en/DOM/window.getComputedStyle">window.getComputedStyle</a> en su lugar.</p>
+
+<p>Mira la lista de Propiedades CSS del DOM (<a href="/es/DOM/CSS" title="en/DOM/CSS">DOM CSS Properties List</a>) para tener una lista completa de las propiedades CSS que están disponibles en el Gecko DOM.</p>
+
+<p>Generalmente es mejor usarla propiedad <code>style </code>que usar <code>elt.setAttribute('style', '...')</code>, ya que el uso de la propiedad <code>style </code>no reemplazará otras propiedades CSS que puedan especificarse en el atributo <code>style</code>.</p>
+
+<p>Los estilos <em>no</em> pueden establecerse asignando una cadena a la propiedad (solo lectura) style, como en <code>elt.style = "color: blue;"</code>. Esto es porque el atributo <code>style </code>devuelve un objeto del tipo <code>CSSStyleDeclaration</code>. En su lugar, pueds establecer las propiedades como:</p>
+
+<pre class="eval">elt.style.color = "blue";  // Asignación directa
+
+var st = elt.style;
+st.color = "blue";  // Asignación Indirecta
+</pre>
+
+<p>El siguiente código presenta los nombres de todas las propiedades style, los valores se establecen de forma explícita para los elementos<code> elt </code>y sus valores heredados: </p>
+
+<pre class="eval">var elt = document.getElementById("elementIdHere");
+var out = "";
+var st = elt.style;
+var cs = window.getComputedStyle(elt, null);
+for (x in st)
+  out += "  " + x + " = '" + st[x] + "' &gt; '" + cs[x] + "'\n";
+</pre>
+
+<p> </p>
+
+<h3 id="Specification" name="Specification">Especificación</h3>
+
+<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-ElementCSSInlineStyle">DOM Level 2 Style: ElementCSSInlineStyle.style</a></p>
diff --git a/files/es/web/api/elementoshtmlparavideo/index.html b/files/es/web/api/elementoshtmlparavideo/index.html
deleted file mode 100644
index 4b36d9cba2..0000000000
--- a/files/es/web/api/elementoshtmlparavideo/index.html
+++ /dev/null
@@ -1,202 +0,0 @@
----
-title: Elementos HTML para Video
-slug: Web/API/ElementosHTMLparaVideo
-translation_of: Web/API/HTMLVideoElement
----
-<div>
-<div>{{APIRef("HTML DOM")}}</div>
-</div>
-
-<p>El interfaz de <strong><code>HTMLVideoElement</code></strong> provee propiedades especiales y metodos para manipular objectos de videos. Tambien, este interfaz hereda propiedades y métodos de {{domxref("HTMLMediaElement")}} y {{domxref("HTMLElement")}}.</p>
-
-<p>La lista de <a href="/en-US/docs/HTML/Supported_media_formats">supported media formats</a> (formatos de medios compatibles) varía de un navegador a otro. Debe proveer su video en un formato sencillo que sea compatible con todos los navegadores o proveer varias fuentes de videos in varios formatos, para que así todo navegador que necesite este cubierto.</p>
-
-<p>{{InheritanceDiagram(600, 140)}}</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<p><em>Hereda las propiedades de los interfaces anteriores, {{domxref("HTMLMediaElement")}}, y </em><em>{{domxref("HTMLElement")}}.</em></p>
-
-<dl>
- <dt>{{domxref("HTMLVideoElement.height")}}</dt>
- <dd>Es un {{domxref("DOMString")}} que refleja el atributo HTML {{htmlattrxref("height", "video")}}, el cual especifica la altura del area mostrada, en pixeles CSS.</dd>
- <dt>{{domxref("HTMLVideoElement.poster")}}</dt>
- <dd>Es un {{domxref("DOMString")}} que refleja el atributo HTML {{htmlattrxref("poster", "video")}}, el cual especifica que imagen sera mostrada en la ausencia de data de video.</dd>
- <dt>{{domxref("HTMLVideoElement.videoHeight")}} {{readonlyInline}}</dt>
- <dd>Devuelve un <code>unsigned long</code> que contiene la altura intrinsica del recurso en pixeles CSS, tomando en consideracion las dimensiones, aspecto proporcional, apertura limpia, resolucion, etc., ya definidas por el formato usado por el recurso.  Si el estado disponible del elemento es <code>HAVE_NOTHING</code>, su valor es <code>0</code>.</dd>
- <dt>{{domxref("HTMLVideoElement.videoWidth")}} {{readonlyInline}}</dt>
- <dd>Devuelve un <code>unsigned long</code> que contiene la anchura intrinsica del recurso en pixeles CSS, tomando en consideracion las dimensiones, aspecto proporcional, apertura limpia, resolucion, etc., ya definidas por el formato usado por el recurso.  Si el estado disponible del elemento es <code>HAVE_NOTHING</code>, su valor es <code>0</code>.</dd>
- <dt>{{domxref("HTMLVideoElement.width")}}</dt>
- <dd>Es un {{domxref("DOMString")}} que refleja el atributo HTML {{htmlattrxref("width", "video")}}, el cual especifica la anchura del area mostrada, en pixeles CSS.</dd>
-</dl>
-
-<h3 id="Propiedades_especificas_para_Gecko">Propiedades especificas para Gecko</h3>
-
-<dl>
- <dt>{{domxref("HTMLVideoElement.mozParsedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
- <dd><code>Devuelve un unsigned long</code> con el conteo de marcos de video que han sido analizados del recurso de multimedia.</dd>
- <dt>{{domxref("HTMLVideoElement.mozDecodedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
- <dd>Devuelve un <code>unsigned long</code> con el conteo de marcos de video que han sido decifrados como imágines.</dd>
- <dt>{{domxref("HTMLVideoElement.mozPresentedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
- <dd>Devuelve un <code>unsigned long</code> con el conteo de marcos decodificados que han sido  presentados a la canalización de render para pintar.</dd>
- <dt>{{domxref("HTMLVideoElement.mozPaintedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
- <dd>Devuelve un <code>unsigned long</code> con el conteo de marcos presentados que han sido pintados en la pantalla.</dd>
- <dt>{{domxref("HTMLVideoElement.mozFrameDelay")}} {{readonlyInline}}{{non-standard_inline}}</dt>
- <dd>Devuelve un <code>double</code> con el tiempo, en segundos, que el último marco de video fue pintado por retrazo.</dd>
- <dt>{{domxref("HTMLVideoElement.mozHasAudio")}} {{readonlyInline}}{{non-standard_inline}}</dt>
- <dd>Devuelve un {{domxref("Boolean")}} indicando si existe algún audio asociado con el video.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<p><em>Hereda los métodos anteriores de </em><em>{{domxref("HTMLMediaElement")}} y </em><em>{{domxref("HTMLElement")}}.</em></p>
-
-<dl>
- <dt>{{domxref("HTMLVideoElement.getVideoPlaybackQuality()")}} {{experimental_inline}}</dt>
- <dd>Devuelve un {{domxref("VideoPlaybackQuality")}} para objetos que contienen las medidas de reproducciones actuales.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Media Source Extensions', '#idl-def-HTMLVideoElement', 'Extensions to HTMLVideoElement')}}</td>
-   <td>{{Spec2("Media Source Extensions")}}</td>
-   <td>Anadio el metodo <code>getVideoPlaybackQuality()</code> .</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "the-video-element.html#the-video-element", "HTMLAreaElement")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambios del {{SpecName('HTML5 W3C')}}.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "embedded-content-0.html#the-video-element", "HTMLAreaElement")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Definicion incial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegador">Compatibilidad con Navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristicas</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Apoyo basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>9.0</td>
-   <td>10.50</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>mozParsedFrames mozDecodedFrames mozPresentedFrames mozPaintedFrames mozFrameDelay</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("5.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>mozHasAudio</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoDesktop("15.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>getVideoPlaybackQuality()</code>{{experimental_inline}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoDesktop("25.0")}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Características</th>
-   <th>Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Apoyo básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>9.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>mozParsedFrames mozDecodedFrames mozPresentedFrames mozPaintedFrames mozFrameDelay</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("5.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>mozHasAudio</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("15.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>getVideoPlaybackQuality()</code>{{experimental_inline}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile("25.0")}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Gecko implementa esto detras de la preferencia <code>media.mediasource.enabled</code>, predispuesto a <code>false</code>.</p>
-
-<h2 id="Lea_Tambien">Lea Tambien</h2>
-
-<ul>
- <li>Elemento HTML implementando este interfaz: {{HTMLElement("video")}}.</li>
- <li><a class="external" href="http://people.mozilla.org/~cpearce/paint-stats-demo.html">Demonstracion de estadisticas de pintura de video</a></li>
- <li><a href="/en-US/docs/HTML/Supported_media_formats">Formatos de medios compatibles </a></li>
-</ul>
diff --git a/files/es/web/api/event/createevent/index.html b/files/es/web/api/event/createevent/index.html
deleted file mode 100644
index 7b273c6e33..0000000000
--- a/files/es/web/api/event/createevent/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: Event.createEvent()
-slug: Web/API/Event/createEvent
-tags:
-  - API
-  - DOM
-  - Evento
-  - metodo
-translation_of: Web/API/Document/createEvent
-translation_of_original: Web/API/Event/createEvent
----
-<p>{{APIRef("DOM")}}</p>
-
-<p>Crea un nuevo evento, que debe ser inicializado llamando a su método <code>init()</code>.</p>
-
-<h3 id="Sintaxis">Sintaxis</h3>
-
-<pre><code>document.createEvent(tipo);</code></pre>
-
-<dl>
- <dt><code>tipo</code></dt>
- <dd>Una string indicando el tipo de evento a crear.</dd>
-</dl>
-
-<p>Este método devuelve un nuevo objeto {{ domxref("Event") }} del DOM del tipo indicado, que debe ser inicializado antes de su uso.</p>
-
-<h3 id="Ejemplo">Ejemplo</h3>
-
-<pre>var nuevoEvento = document.createEvent("UIEvents");</pre>
-
-<h3 id="Especificación">Especificación</h3>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-document" title="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-document">DOM Level 2 Events</a></li>
-</ul>
diff --git a/files/es/web/api/fetch_api/basic_concepts/index.html b/files/es/web/api/fetch_api/basic_concepts/index.html
new file mode 100644
index 0000000000..1331b49400
--- /dev/null
+++ b/files/es/web/api/fetch_api/basic_concepts/index.html
@@ -0,0 +1,74 @@
+---
+title: Conceptos básicos de Fetch
+slug: Web/API/Fetch_API/Basic_concepts
+tags:
+  - API
+  - API Fetch
+  - Fetch
+  - conceptos
+  - guard
+  - request
+translation_of: Web/API/Fetch_API/Basic_concepts
+original_slug: Web/API/Fetch_API/Conceptos_basicos
+---
+<p>{{DefaultAPISidebar("Fetch API")}}{{draft}}</p>
+
+<div class="summary">
+<p>La <a href="/en-US/docs/Web/API/Fetch_API">API Fetch</a> proporciona una interfaz para obtener recursos (incluso a traves de la red). Parecera familiar a quien sea que haya usado {{domxref("XMLHttpRequest")}}, pero proporciona un conjunto de características más potentes y flexibles. Este artículo explica algunos de los conceptos básicos de la API Fetch.</p>
+</div>
+
+<div class="note">
+<p>Este artículo será añadido en un futuro. Si encuenta un concepto de Fetch que siente necesita una mejor explicación, hagalo saber a alguien en el <a href="https://discourse.mozilla-community.org/c/mdn">foro de discusión de </a><a href="https://discourse.mozilla-community.org/c/mdn">MDN</a>, o <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a> (#mdn room.)</p>
+</div>
+
+<h2 id="En_pocas_palabras">En pocas palabras</h2>
+
+<p>En el corazón de Fetch estan las abstracciones de interfaz de cargas de HTTP {{domxref("Request")}}s, {{domxref("Response")}}s, {{domxref("Headers")}}, y {{domxref("Body")}}, junto a un método {{domxref("GlobalFetch.fetch","global fetch")}} para inicializar peticiones de recurso asíncronos. Porque los prinipales componentes de HTTP son abstraídos como objetos Javascript, es sencillo para otras APIs el hacer uso de dicha funcionalidad.</p>
+
+<p><a href="/en-US/docs/Web/API/ServiceWorker_API">Service Workers</a> es un ejemplo de una API que hace un fuerte uso de Fetch.</p>
+
+<p>Fetch toma la naturaleza asíncrona de dichas peticiones un paso adelante. La API esta completamente basada en {{jsxref("Promise")}}.</p>
+
+<h2 id="Guard">Guard</h2>
+
+<p>Guard es una característica de objetos {{domxref("Headers")}}, con los valores posibles <code>immutable</code>, <code>request</code>, <code>request-no-cors</code>, <code>response</code>, o <code>none</code>, dependiendo de donde el encabezado es usado.</p>
+
+<p>Cuando un nuevo objeto {{domxref("Headers")}} es creado usando el {{domxref("Headers.Headers","Headers()")}} {{glossary("constructor")}}, su guarda (guard) se establece a <code>none</code> (por defecto). Cuando un objeto {{domxref("Request")}} o {{domxref("Response")}} es creado, tiene un objeto  {{domxref("Headers")}} asociado cuyo guarda (guard) se establece como se resume a continuación:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="row">nuevo tipo de objeto</th>
+   <th scope="col">creando el constructor</th>
+   <th scope="col">configuraciones de guarda (guard) del objeto {{domxref("Headers")}} asociado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td rowspan="2">{{domxref("Request")}}</td>
+   <td>{{domxref("Request.Request","Request()")}}</td>
+   <td><code>request</code></td>
+  </tr>
+  <tr>
+   <td>{{domxref("Request.Request","Request()")}} con {{domxref("Request.mode","mode")}} de <code>no-cors</code></td>
+   <td><code>request-no-cors</code></td>
+  </tr>
+  <tr>
+   <td rowspan="2">{{domxref("Response")}}</td>
+   <td>{{domxref("Response.Response","Response()")}}</td>
+   <td><code>response</code></td>
+  </tr>
+  <tr>
+   <td>Métodos {{domxref("Response.error","error()")}} o {{domxref("Response.redirect","redirect()")}}</td>
+   <td><code>immutable</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Un guarda (guard) de encabezado afecta los métodos {{domxref("Headers.set","set()")}}, {{domxref("Headers.delete","delete()")}}, y {{domxref("Headers.append","append()")}} que cambían los contenidos del encabezado. Un <code>TypeError</code> es arrojado si se trata modificar un objeto {{domxref("Headers")}} cuyo guarda (guard) es <code>immutable</code>. Sin embargo, la operación funcionará si</p>
+
+<ul>
+ <li>guard es <code title="">request</code> y el nombre del encabezado no es un {{Glossary("forbidden header name")}} .</li>
+ <li>guard es <code title="">request-no-cors</code> y el encabezado <var>nombre/valor</var> es un {{Glossary("simple header")}} .</li>
+ <li>guard es <code title="">response</code> y el <var>nombre </var>del encabezado no es {{Glossary("forbidden response header name")}}.</li>
+</ul>
diff --git a/files/es/web/api/fetch_api/conceptos_basicos/index.html b/files/es/web/api/fetch_api/conceptos_basicos/index.html
deleted file mode 100644
index 8c02021de6..0000000000
--- a/files/es/web/api/fetch_api/conceptos_basicos/index.html
+++ /dev/null
@@ -1,73 +0,0 @@
----
-title: Conceptos básicos de Fetch
-slug: Web/API/Fetch_API/Conceptos_basicos
-tags:
-  - API
-  - API Fetch
-  - Fetch
-  - conceptos
-  - guard
-  - request
-translation_of: Web/API/Fetch_API/Basic_concepts
----
-<p>{{DefaultAPISidebar("Fetch API")}}{{draft}}</p>
-
-<div class="summary">
-<p>La <a href="/en-US/docs/Web/API/Fetch_API">API Fetch</a> proporciona una interfaz para obtener recursos (incluso a traves de la red). Parecera familiar a quien sea que haya usado {{domxref("XMLHttpRequest")}}, pero proporciona un conjunto de características más potentes y flexibles. Este artículo explica algunos de los conceptos básicos de la API Fetch.</p>
-</div>
-
-<div class="note">
-<p>Este artículo será añadido en un futuro. Si encuenta un concepto de Fetch que siente necesita una mejor explicación, hagalo saber a alguien en el <a href="https://discourse.mozilla-community.org/c/mdn">foro de discusión de </a><a href="https://discourse.mozilla-community.org/c/mdn">MDN</a>, o <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a> (#mdn room.)</p>
-</div>
-
-<h2 id="En_pocas_palabras">En pocas palabras</h2>
-
-<p>En el corazón de Fetch estan las abstracciones de interfaz de cargas de HTTP {{domxref("Request")}}s, {{domxref("Response")}}s, {{domxref("Headers")}}, y {{domxref("Body")}}, junto a un método {{domxref("GlobalFetch.fetch","global fetch")}} para inicializar peticiones de recurso asíncronos. Porque los prinipales componentes de HTTP son abstraídos como objetos Javascript, es sencillo para otras APIs el hacer uso de dicha funcionalidad.</p>
-
-<p><a href="/en-US/docs/Web/API/ServiceWorker_API">Service Workers</a> es un ejemplo de una API que hace un fuerte uso de Fetch.</p>
-
-<p>Fetch toma la naturaleza asíncrona de dichas peticiones un paso adelante. La API esta completamente basada en {{jsxref("Promise")}}.</p>
-
-<h2 id="Guard">Guard</h2>
-
-<p>Guard es una característica de objetos {{domxref("Headers")}}, con los valores posibles <code>immutable</code>, <code>request</code>, <code>request-no-cors</code>, <code>response</code>, o <code>none</code>, dependiendo de donde el encabezado es usado.</p>
-
-<p>Cuando un nuevo objeto {{domxref("Headers")}} es creado usando el {{domxref("Headers.Headers","Headers()")}} {{glossary("constructor")}}, su guarda (guard) se establece a <code>none</code> (por defecto). Cuando un objeto {{domxref("Request")}} o {{domxref("Response")}} es creado, tiene un objeto  {{domxref("Headers")}} asociado cuyo guarda (guard) se establece como se resume a continuación:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="row">nuevo tipo de objeto</th>
-   <th scope="col">creando el constructor</th>
-   <th scope="col">configuraciones de guarda (guard) del objeto {{domxref("Headers")}} asociado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td rowspan="2">{{domxref("Request")}}</td>
-   <td>{{domxref("Request.Request","Request()")}}</td>
-   <td><code>request</code></td>
-  </tr>
-  <tr>
-   <td>{{domxref("Request.Request","Request()")}} con {{domxref("Request.mode","mode")}} de <code>no-cors</code></td>
-   <td><code>request-no-cors</code></td>
-  </tr>
-  <tr>
-   <td rowspan="2">{{domxref("Response")}}</td>
-   <td>{{domxref("Response.Response","Response()")}}</td>
-   <td><code>response</code></td>
-  </tr>
-  <tr>
-   <td>Métodos {{domxref("Response.error","error()")}} o {{domxref("Response.redirect","redirect()")}}</td>
-   <td><code>immutable</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Un guarda (guard) de encabezado afecta los métodos {{domxref("Headers.set","set()")}}, {{domxref("Headers.delete","delete()")}}, y {{domxref("Headers.append","append()")}} que cambían los contenidos del encabezado. Un <code>TypeError</code> es arrojado si se trata modificar un objeto {{domxref("Headers")}} cuyo guarda (guard) es <code>immutable</code>. Sin embargo, la operación funcionará si</p>
-
-<ul>
- <li>guard es <code title="">request</code> y el nombre del encabezado no es un {{Glossary("forbidden header name")}} .</li>
- <li>guard es <code title="">request-no-cors</code> y el encabezado <var>nombre/valor</var> es un {{Glossary("simple header")}} .</li>
- <li>guard es <code title="">response</code> y el <var>nombre </var>del encabezado no es {{Glossary("forbidden response header name")}}.</li>
-</ul>
diff --git a/files/es/web/api/fetch_api/using_fetch/index.html b/files/es/web/api/fetch_api/using_fetch/index.html
new file mode 100644
index 0000000000..78b32858b6
--- /dev/null
+++ b/files/es/web/api/fetch_api/using_fetch/index.html
@@ -0,0 +1,378 @@
+---
+title: Uso de Fetch
+slug: Web/API/Fetch_API/Using_Fetch
+tags:
+  - API
+  - BODY
+  - Experimental
+  - Fetch
+  - Guía
+  - HTTP
+  - Petición
+  - Promesa
+  - Promise
+  - Respuesta
+translation_of: Web/API/Fetch_API/Using_Fetch
+original_slug: Web/API/Fetch_API/Utilizando_Fetch
+---
+<p>{{DefaultAPISidebar("Fetch API")}}{{ SeeCompatTable }}</p>
+
+<div class="summary">
+<p>La <a href="/en-US/docs/Web/API/Fetch_API">API Fetch</a> proporciona una interfaz JavaScript para acceder y manipular partes del canal HTTP, tales como peticiones y respuestas. También provee un método global {{domxref("GlobalFetch.fetch","fetch()")}} que proporciona una forma fácil y lógica de obtener recursos de forma asíncrona por la red.</p>
+</div>
+
+<p>Este tipo de funcionalidad se conseguía previamente haciendo uso de {{domxref("XMLHttpRequest")}}. Fetch proporciona una alternativa mejor que puede ser empleada fácilmente por otras tecnologías como {{domxref("ServiceWorker_API", "Service Workers")}}. Fetch también aporta un único lugar lógico en el que definir otros conceptos relacionados con HTTP como CORS y extensiones para HTTP.</p>
+
+<p>La especificación fetch difiere de <code>JQuery.ajax()</code> en dos formas principales:</p>
+
+<ul>
+ <li>
+  <p>El objeto Promise devuelto desde <code>fetch()</code> <strong>no será rechazado con un estado de error HTTP</strong> incluso si la respuesta es un error HTTP 404 o 500. En cambio, este se resolverá normalmente (con un estado <code>ok</code> configurado a false), y  este solo sera rechazado ante un fallo de red o si algo impidió completar la solicitud.</p>
+ </li>
+ <li>Por defecto, <code>fetch</code> no enviará ni recibirá cookies del servidor, resultando en peticiones no autenticadas si el sitio permite mantentener una sesión de usuario (para mandar cookies, <em>credentials</em> de la opción <a href="https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch#Parameters">init</a> deberan ser configuradas). Desde <a href="https://github.com/whatwg/fetch/pull/585">el 25 de agosto de 2017</a>. La especificación cambió la politica por defecto de las credenciales a <code>same-origin</code>. Firefox cambió desde la versión 61.0b13.</li>
+</ul>
+
+<p>Una petición básica de <code>fetch</code> es realmente simple de realizar. Eche un vistazo al siguente código:</p>
+
+<pre class="notranslate">fetch('http://example.com/movies.json')
+  .then(response =&gt; response.json())
+  .then(data =&gt; console.log(data));</pre>
+
+<p>Aquí estamos recuperando un archivo JSON a través de red e imprimiendo en la consola. El uso de <code>fetch()</code> más simple toma un argumento (la ruta del recurso que quieres obtener) y devuelve un objeto Promise conteniendo la respuesta, un objeto {{domxref("Response")}}.</p>
+
+<p>Esto es, por supuesto, una respuesta HTTP no el archivo JSON. Para extraer el contenido en el cuerpo del JSON desde la respuesta, usamos el método {{domxref("Body.json","json()")}} (definido en el <a href="https://es.wikipedia.org/wiki/Mixin">mixin</a> de {{domxref("Body")}}, el cual está implementado por los objetos {{domxref("Request")}} y {{domxref("Response")}}).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El mixin de <code>Body</code> tambien tiene metodos parecidos para extraer otros tipos de contenido del cuerpo. Vease {{anch("Body")}} para más información.</p>
+</div>
+
+<p>Las peticiones de Fetch son controladas por la directiva de <code>connect-src</code> de <a href="https://developer.mozilla.org/en-US/docs/Security/CSP/CSP_policy_directives">Content Security Policy</a> en vez de la directiva de los recursos que se han devuelto.</p>
+
+<h3 id="Suministrando_opciones_de_petición">Suministrando opciones de petición</h3>
+
+<p>El método <code>fetch()</code> puede aceptar opcionalmente un segundo parámetro, un objeto <code>init</code> que permite controlar un numero de diferentes ajustes:</p>
+
+<p>Vea {{domxref("GlobalFetch.fetch","fetch()")}}, para ver todas las opciones disponibles y más detalles.</p>
+
+<pre class="notranslate">// Ejemplo implementando el metodo POST:
+async function postData(url = '', data = {}) {
+  // Opciones por defecto estan marcadas con un *
+  const response = await fetch(url, {
+    method: 'POST', // *GET, POST, PUT, DELETE, etc.
+    mode: 'cors', // no-cors, *cors, same-origin
+    cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
+    credentials: 'same-origin', // include, *same-origin, omit
+    headers: {
+      'Content-Type': 'application/json'
+      // 'Content-Type': 'application/x-www-form-urlencoded',
+    },
+    redirect: 'follow', // manual, *follow, error
+    referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
+    body: JSON.stringify(data) // body data type must match "Content-Type" header
+  });
+  return response.json(); // parses JSON response into native JavaScript objects
+}
+
+postData('https://example.com/answer', { answer: 42 })
+  .then(data =&gt; {
+    console.log(data); // JSON data parsed by `data.json()` call
+  });</pre>
+
+<p>Tenga en cuenta que  <code>mode: "no-cors"</code> solo permite un conjunto limitado de encabezados en la solicitud:</p>
+
+<ul>
+ <li><code>Accept</code></li>
+ <li><code>Accept-Language</code></li>
+ <li><code>Content-Language</code></li>
+ <li><code>Content-Type</code> with a value of <code>application/x-www-form-urlencoded</code>, <code>multipart/form-data</code>, or <code>text/plain</code></li>
+</ul>
+
+<h3 id="Comprobando_que_la_petición_es_satisfactoria">Comprobando que la petición es satisfactoria</h3>
+
+<p>Una petición promise {{domxref("GlobalFetch.fetch","fetch()")}} será rechazada con {{jsxref("TypeError")}} cuando se encuentre un error de red, aunque esto normalmente significa problemas de permisos o similares — por ejemplo, un 404 no constituye un error de red. Una forma precisa de comprobar que la petición <code>fetch()</code> es satisfactoria pasa por comprobar si la promesa ha sido resuelta, además de comprobar que la propiedad {{domxref("Response.ok")}} tiene el valor <code>true</code> que indica que el estado de la petición HTTP es OK (código 200-299). El código sería algo así:</p>
+
+<pre class="brush: js notranslate">fetch('flores.jpg').then(function(response) {
+  if(response.ok) {
+    response.blob().then(function(miBlob) {
+      var objectURL = URL.createObjectURL(miBlob);
+      miImagen.src = objectURL;
+    });
+  } else {
+    console.log('Respuesta de red OK pero respuesta HTTP no OK');
+  }
+})
+.catch(function(error) {
+  console.log('Hubo un problema con la petición Fetch:' + error.message);
+});</pre>
+
+<h3 id="Proporcionando_tu_propio_objeto_Request">Proporcionando tu propio objeto Request</h3>
+
+<p>En lugar de pasar la ruta al recurso que deseas solicitar a la llamada del método <code>fetch()</code>, puedes crear un objeto de petición utilizando el constructor {{domxref("Request.Request","Request()")}}, y pasarlo como un argumento del método <code>fetch()</code>:</p>
+
+<pre class="brush: js notranslate">var myHeaders = new Headers();
+
+var myInit = { method: 'GET',
+               headers: myHeaders,
+               mode: 'cors',
+               cache: 'default' };
+
+var myRequest = new Request('flowers.jpg', myInit);
+
+fetch(myRequest)
+.then(function(response) {
+  return response.blob();
+})
+.then(function(myBlob) {
+  var objectURL = URL.createObjectURL(myBlob);
+  myImage.src = objectURL;
+});</pre>
+
+<p><code>Request()</code> acepta exactamente los mismos parámetros que el método <code>fetch()</code>. Puedes incluso pasar un objeto de petición existente para crear una copia del mismo:</p>
+
+<pre class="brush: js notranslate">var anotherRequest = new Request(myRequest, myInit);</pre>
+
+<p>Esto es muy útil ya que el cuerpo de las solicitudes y respuestas son de un sólo uso. Haciendo una copia como esta te permite utilizar la petición/respuesta de nuevo, y al mismo tiempo, si lo deseas, modificar las opciones de <code>init</code>. La copia debe estar hecha antes de la lectura del &lt;body&gt;, y leyendo el &lt;body&gt; en la copia, se marcará como leido en la petición original.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Existe también un método {{domxref("Request.clone","clone()")}} que crea una copia. Este tiene una semántica ligeramente distinta al otro método de copia — el primero fallará si el cuerpo de la petición anterior ya ha sido leído (lo mismo para copiar una respuesta), mientras que <code>clone()</code> no.</p>
+</div>
+
+<h3 id="Enviar_una_petición_con_credenciales_incluido">Enviar una petición con credenciales incluido</h3>
+
+<p>Para producir que los navegadores envien una petición con las credenciales incluidas, incluso para una llamada de origen cruzado, añadimos<code> credentials: 'include'</code> en el el objeto <code>init</code> que se pasa al método <code>fetch()</code>.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
+  credentials<span class="punctuation token">:</span> <span class="string token">'include'</span>
+<span class="punctuation token">}</span><span class="punctuation token">)</span></code></pre>
+
+<p>Si solo quieres enviar la credenciales si la URL de la petición está en el mismo origen desde donde se llamada el script, añade <code>credentials: 'same-origin'</code>.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="comment token">// El script fué llamado desde el origen 'https://example.com'</span>
+
+<span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
+  credentials<span class="punctuation token">:</span> <span class="string token">'same-origin'</span>
+<span class="punctuation token">}</span><span class="punctuation token">)</span></code></pre>
+
+<p>Sin embargo para asegurarte que el navegador no incluye las credenciales en la petición, usa <code>credentials: 'omit'</code>.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
+  credentials<span class="punctuation token">:</span> <span class="string token">'omit'</span>
+<span class="punctuation token">}</span><span class="punctuation token">)</span></code></pre>
+
+<h3 id="Enviando_datos_JSON">Enviando datos JSON</h3>
+
+<p>Usa {{domxref("GlobalFetch.fetch","fetch()")}} para enviar una petición POST con datos codificados en JSON .</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="keyword token">var</span> url <span class="operator token">=</span> <span class="string token">'https://example.com/profile'</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> data <span class="operator token">=</span> <span class="punctuation token">{</span>username<span class="punctuation token">:</span> <span class="string token">'example'</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+
+<span class="function token">fetch</span><span class="punctuation token">(</span>url<span class="punctuation token">,</span> <span class="punctuation token">{</span>
+  method<span class="punctuation token">:</span> <span class="string token">'POST'</span><span class="punctuation token">,</span> <span class="comment token">// or 'PUT'</span>
+  body<span class="punctuation token">:</span> JSON<span class="punctuation token">.</span><span class="function token">stringify</span><span class="punctuation token">(</span>data<span class="punctuation token">)</span><span class="punctuation token">,</span> <span class="comment token">// data can be `string` or {object}!</span>
+  headers<span class="punctuation token">:</span><span class="punctuation token">{</span>
+    <span class="string token">'Content-Type'</span><span class="punctuation token">:</span> <span class="string token">'application/json'</span>
+  <span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>res <span class="operator token">=</span><span class="operator token">&gt;</span> res<span class="punctuation token">.</span><span class="function token">json</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">)</span>
+<span class="punctuation token">.</span><span class="keyword token">catch</span><span class="punctuation token">(</span>error <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'Error:'</span><span class="punctuation token">,</span> error<span class="punctuation token">)</span><span class="punctuation token">)</span>
+<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>response <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'Success:'</span><span class="punctuation token">,</span> response<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<h3 id="Enviando_un_archivo">Enviando un archivo</h3>
+
+<p>Los archivos pueden ser subido mediante el HTML de un elemento input <code>&lt;input type="file" /&gt;</code>, {{domxref("FormData.FormData","FormData()")}} y {{domxref("GlobalFetch.fetch","fetch()")}}.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="keyword token">var</span> formData <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">FormData</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> fileField <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">"input[type='file']"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+formData<span class="punctuation token">.</span><span class="function token">append</span><span class="punctuation token">(</span><span class="string token">'username'</span><span class="punctuation token">,</span> <span class="string token">'abc123'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+formData<span class="punctuation token">.</span><span class="function token">append</span><span class="punctuation token">(</span><span class="string token">'avatar'</span><span class="punctuation token">,</span> fileField<span class="punctuation token">.</span>files<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+<span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com/profile/avatar'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
+  method<span class="punctuation token">:</span> <span class="string token">'PUT'</span><span class="punctuation token">,</span>
+  body<span class="punctuation token">:</span> formData
+<span class="punctuation token">}</span><span class="punctuation token">)</span>
+<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>response <span class="operator token">=</span><span class="operator token">&gt;</span> response<span class="punctuation token">.</span><span class="function token">json</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">)</span>
+<span class="punctuation token">.</span><span class="keyword token">catch</span><span class="punctuation token">(</span>error <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'Error:'</span><span class="punctuation token">,</span> error<span class="punctuation token">)</span><span class="punctuation token">)</span>
+<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>response <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'Success:'</span><span class="punctuation token">,</span> response<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<h2 id="Cabeceras">Cabeceras</h2>
+
+<p>La interfaz {{domxref("Headers")}} te permite crear tus propios objetos de headers mediante el constructor {{domxref("Headers.Headers","Headers()")}}. Un objeto headers es un simple multi-mapa de nombres y valores:</p>
+
+<pre class="brush: js notranslate">var content = "Hello World";
+var myHeaders = new Headers();
+myHeaders.append("Content-Type", "text/plain");
+myHeaders.append("Content-Length", content.length.toString());
+myHeaders.append("X-Custom-Header", "ProcessThisImmediately");</pre>
+
+<p>Lo mismo se puede lograr pasando un "array de arrays" o un objeto literal al constructor:</p>
+
+<pre class="brush: js notranslate">myHeaders = new Headers({
+  "Content-Type": "text/plain",
+  "Content-Length": content.length.toString(),
+  "X-Custom-Header": "ProcessThisImmediately",
+});</pre>
+
+<p>Los contenidos pueden ser consultados o recuperados:</p>
+
+<pre class="brush: js notranslate">console.log(myHeaders.has("Content-Type")); // true
+console.log(myHeaders.has("Set-Cookie")); // false
+myHeaders.set("Content-Type", "text/html");
+myHeaders.append("X-Custom-Header", "AnotherValue");
+
+console.log(myHeaders.get("Content-Length")); // 11
+console.log(myHeaders.getAll("X-Custom-Header")); // ["ProcessThisImmediately", "AnotherValue"]
+
+myHeaders.delete("X-Custom-Header");
+console.log(myHeaders.getAll("X-Custom-Header")); // [ ]</pre>
+
+<p>Algunas de estas operaciones solo serán utiles en  {{domxref("ServiceWorker_API","ServiceWorkers")}}, pero estas disponen de una mejor API  para manipular <code>headers</code>.</p>
+
+<p>Todos los métodosde de <code>headers</code> lanzan un <code>TypeError</code> si un nombre de cabecera no es un nombre de cabecera HTTP válido. Las operaciones de mutación lanzarán un <code>TypeError</code> si hay un guarda inmutable (ver más abajo). Si no, fallan silenciosamente. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">var myResponse = Response.error();
+try {
+  myResponse.headers.set("Origin", "http://mybank.com");
+} catch(e) {
+  console.log("Cannot pretend to be a bank!");
+}</pre>
+
+<p>Un buen caso de uso para <code>headers</code> es comprobar cuando el tipo de contenido es correcto antes de que se procese:</p>
+
+<pre class="brush: js notranslate">fetch(myRequest).then(function(response) {
+  var contentType = response.headers.get("content-type");
+  if(contentType &amp;&amp; contentType.indexOf("application/json") !== -1) {
+    return response.json().then(function(json) {
+      // process your JSON further
+    });
+  } else {
+    console.log("Oops, we haven't got JSON!");
+  }
+});</pre>
+
+<h3 id="Guarda_Guard">Guarda (Guard)</h3>
+
+<p>Desde que las cabeceras pueden ser enviadas  en peticiones y recibidas en respuestas, y tienen limitaciones sobre que información puede y debería ser mutable, los objeto headers tienen una propierdad de guarda. Este no está expuesto a la Web, pero puede afectar a que operaciones de mutación son permitidas sobre el objeto headers.</p>
+
+<p>Los valores posibles de guarda (guard) son:</p>
+
+<ul>
+ <li><code>none</code>: valor por defecto.</li>
+ <li><code>request</code>: Guarda para el objeto headers obtenido de la petición ({{domxref("Request.headers")}}).</li>
+ <li><code>request-no-cors</code>: Guarda para un objeto headers obtenido desde una petición creada con {{domxref("Request.mode")}} a <code>no-cors</code>.</li>
+ <li><code>response</code>: Guarda para una cabecera obetenida desde un respuesta ({{domxref("Response.headers")}}).</li>
+ <li><code>immutable</code>: Mayormente utilizado para ServiceWorkers, produce un objeto headers de solo lectura.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>:  No se debería añadir o establecer una petición a un objeto headers <em>guardado</em> con la cabecera <code>Content-Length</code>. De igual manera, insertar <code>Set-Cookie</code> en la respuesta de la cabecera no esta permitido: ServiceWorkers no estan autorizados a establecer cookies a través de respuestas sintéticas.</p>
+</div>
+
+<h2 id="Objetos_Response">Objetos Response</h2>
+
+<p>Cómo has visto anteriormente, las instancias de {{domxref("Response")}} son devueltas cuando <code>fetch()</code> es resuelto.</p>
+
+<p>Las propiedades de response que usarás son:</p>
+
+<ul>
+ <li>{{domxref("Response.status")}} — Entero (por defecto con valor 200) que contiene el código de estado de las respuesta.</li>
+ <li>{{domxref("Response.statusText")}} — Cadena (con valor por defecto "OK"), el cual corresponde al mensaje del estado de código HTTP.</li>
+ <li>{{domxref("Response.ok")}} — Visto en uso anteriormente, es una clave para comprobar que el estado está dentro del rango 200-299 (ambos incluidos). Este devuelve un valor {{domxref("Boolean")}}, siendo <code>true</code> si lo anterior se cumple y <code>false</code> en otro caso.</li>
+</ul>
+
+<p>Estos pueden también creados programáticamente a través de JavaScript, pero esto solamente es realmete útil en {{domxref("ServiceWorker_API", "ServiceWorkers")}},  cuando pones un objeto response personalizado a una respuesta recibida usando un método {{domxref("FetchEvent.respondWith","respondWith()")}}:</p>
+
+<pre class="brush: js notranslate">var myBody = new Blob();
+
+addEventListener('fetch', function(event) {
+  event.respondWith(
+    new Response(myBody, {
+      headers: { "Content-Type" : "text/plain" }
+    })
+  );
+});</pre>
+
+<p>El constructor {{domxref("Response.Response","Response()")}} toma dos argurmentos opcionales, un cuerpo para la respuesta y un objeto init (similar al que acepta {{domxref("Request.Request","Request()")}}).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: El método estático {{domxref("Response.error","error()")}} simplemente devuelve un error en la respuesta. De igual manera que {{domxref("Response.redirect","redirect()")}} devuelve una respuesta que resulta en un redirección a una URL especificada. Estos son solo relevantes tambien a ServiceWorkers.</p>
+</div>
+
+<h2 id="Body">Body</h2>
+
+<p>Tanto las peticiones como las respuestas pueden contener datos body. Body es una instancia de cualquiera de los siguientes tipos:</p>
+
+<ul>
+ <li>{{domxref("ArrayBuffer")}}</li>
+ <li>{{domxref("ArrayBufferView")}} (Uint8Array y amigos)</li>
+ <li>{{domxref("Blob")}}/File</li>
+ <li>string</li>
+ <li>{{domxref("URLSearchParams")}}</li>
+ <li>{{domxref("FormData")}}</li>
+</ul>
+
+<p>El mixin de {{domxref("Body")}} define los siguientes metodos para extraer un body (implementado por {{domxref("Request")}} and {{domxref("Response")}}). Todas ellas devuelven una promesa que es eventualmente resuelta con el contenido actual.</p>
+
+<ul>
+ <li>{{domxref("Body.arrayBuffer","arrayBuffer()")}}</li>
+ <li>{{domxref("Body.blob","blob()")}}</li>
+ <li>{{domxref("Body.json","json()")}}</li>
+ <li>{{domxref("Body.text","text()")}}</li>
+ <li>{{domxref("Body.formData","formData()")}}</li>
+</ul>
+
+<p>Este hace uso de los datos no texttuales mucho mas facil que si fuera con XHR.</p>
+
+<p>Las peticiones body pueden ser establecidas pasando el parametro body:</p>
+
+<pre class="brush: js notranslate">var form = new FormData(document.getElementById('login-form'));
+fetch("/login", {
+  method: "POST",
+  body: form
+});</pre>
+
+<p>Tanto peticiones y respuestas (y por extensión la function <code>fetch()</code>), intentaran inteligentemente determinar el tipo de contenido. Una petición tambien establecerá automáticamente la propiedad <code>Context-Type</code> de la cabecera si no es ha establecido una.</p>
+
+<h2 id="Detectar_característica">Detectar característica</h2>
+
+<p>Puedes comprobar si el navegador soporta  la API de Fetch comprobando la existencia de {{domxref("Headers")}}, {{domxref("Request")}}, {{domxref("Response")}} o {{domxref("GlobalFetch.fetch","fetch()")}} sobre el ámbito de {{domxref("Window")}} o {{domxref("Worker")}}. Por ejemplo:</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="keyword token">if</span> <span class="punctuation token">(</span>self<span class="punctuation token">.</span>fetch<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="comment token">// run my fetch request here</span>
+<span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="punctuation token">{</span>
+    <span class="comment token">// do something with XMLHttpRequest?</span>
+<span class="punctuation token">}</span></code></pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Para utilizar <code>fetch()</code> en un explorador no soportado, hay disponible un <a href="https://github.com/github/fetch">Fetch Polyfill</a> que recrea la funcionalidad para navegadores no soportados.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Fetch')}}</td>
+   <td>{{Spec2('Fetch')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{Compat("api.WindowOrWorkerGlobalScope.fetch")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li>
+ <li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">HTTP access control (CORS)</a></li>
+ <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
+ <li><a href="https://github.com/github/fetch">Fetch polyfill</a></li>
+ <li><a href="https://github.com/mdn/fetch-examples/">Fetch examples on Github</a></li>
+</ul>
diff --git a/files/es/web/api/fetch_api/utilizando_fetch/index.html b/files/es/web/api/fetch_api/utilizando_fetch/index.html
deleted file mode 100644
index 51617ad047..0000000000
--- a/files/es/web/api/fetch_api/utilizando_fetch/index.html
+++ /dev/null
@@ -1,377 +0,0 @@
----
-title: Uso de Fetch
-slug: Web/API/Fetch_API/Utilizando_Fetch
-tags:
-  - API
-  - BODY
-  - Experimental
-  - Fetch
-  - Guía
-  - HTTP
-  - Petición
-  - Promesa
-  - Promise
-  - Respuesta
-translation_of: Web/API/Fetch_API/Using_Fetch
----
-<p>{{DefaultAPISidebar("Fetch API")}}{{ SeeCompatTable }}</p>
-
-<div class="summary">
-<p>La <a href="/en-US/docs/Web/API/Fetch_API">API Fetch</a> proporciona una interfaz JavaScript para acceder y manipular partes del canal HTTP, tales como peticiones y respuestas. También provee un método global {{domxref("GlobalFetch.fetch","fetch()")}} que proporciona una forma fácil y lógica de obtener recursos de forma asíncrona por la red.</p>
-</div>
-
-<p>Este tipo de funcionalidad se conseguía previamente haciendo uso de {{domxref("XMLHttpRequest")}}. Fetch proporciona una alternativa mejor que puede ser empleada fácilmente por otras tecnologías como {{domxref("ServiceWorker_API", "Service Workers")}}. Fetch también aporta un único lugar lógico en el que definir otros conceptos relacionados con HTTP como CORS y extensiones para HTTP.</p>
-
-<p>La especificación fetch difiere de <code>JQuery.ajax()</code> en dos formas principales:</p>
-
-<ul>
- <li>
-  <p>El objeto Promise devuelto desde <code>fetch()</code> <strong>no será rechazado con un estado de error HTTP</strong> incluso si la respuesta es un error HTTP 404 o 500. En cambio, este se resolverá normalmente (con un estado <code>ok</code> configurado a false), y  este solo sera rechazado ante un fallo de red o si algo impidió completar la solicitud.</p>
- </li>
- <li>Por defecto, <code>fetch</code> no enviará ni recibirá cookies del servidor, resultando en peticiones no autenticadas si el sitio permite mantentener una sesión de usuario (para mandar cookies, <em>credentials</em> de la opción <a href="https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch#Parameters">init</a> deberan ser configuradas). Desde <a href="https://github.com/whatwg/fetch/pull/585">el 25 de agosto de 2017</a>. La especificación cambió la politica por defecto de las credenciales a <code>same-origin</code>. Firefox cambió desde la versión 61.0b13.</li>
-</ul>
-
-<p>Una petición básica de <code>fetch</code> es realmente simple de realizar. Eche un vistazo al siguente código:</p>
-
-<pre class="notranslate">fetch('http://example.com/movies.json')
-  .then(response =&gt; response.json())
-  .then(data =&gt; console.log(data));</pre>
-
-<p>Aquí estamos recuperando un archivo JSON a través de red e imprimiendo en la consola. El uso de <code>fetch()</code> más simple toma un argumento (la ruta del recurso que quieres obtener) y devuelve un objeto Promise conteniendo la respuesta, un objeto {{domxref("Response")}}.</p>
-
-<p>Esto es, por supuesto, una respuesta HTTP no el archivo JSON. Para extraer el contenido en el cuerpo del JSON desde la respuesta, usamos el método {{domxref("Body.json","json()")}} (definido en el <a href="https://es.wikipedia.org/wiki/Mixin">mixin</a> de {{domxref("Body")}}, el cual está implementado por los objetos {{domxref("Request")}} y {{domxref("Response")}}).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El mixin de <code>Body</code> tambien tiene metodos parecidos para extraer otros tipos de contenido del cuerpo. Vease {{anch("Body")}} para más información.</p>
-</div>
-
-<p>Las peticiones de Fetch son controladas por la directiva de <code>connect-src</code> de <a href="https://developer.mozilla.org/en-US/docs/Security/CSP/CSP_policy_directives">Content Security Policy</a> en vez de la directiva de los recursos que se han devuelto.</p>
-
-<h3 id="Suministrando_opciones_de_petición">Suministrando opciones de petición</h3>
-
-<p>El método <code>fetch()</code> puede aceptar opcionalmente un segundo parámetro, un objeto <code>init</code> que permite controlar un numero de diferentes ajustes:</p>
-
-<p>Vea {{domxref("GlobalFetch.fetch","fetch()")}}, para ver todas las opciones disponibles y más detalles.</p>
-
-<pre class="notranslate">// Ejemplo implementando el metodo POST:
-async function postData(url = '', data = {}) {
-  // Opciones por defecto estan marcadas con un *
-  const response = await fetch(url, {
-    method: 'POST', // *GET, POST, PUT, DELETE, etc.
-    mode: 'cors', // no-cors, *cors, same-origin
-    cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
-    credentials: 'same-origin', // include, *same-origin, omit
-    headers: {
-      'Content-Type': 'application/json'
-      // 'Content-Type': 'application/x-www-form-urlencoded',
-    },
-    redirect: 'follow', // manual, *follow, error
-    referrerPolicy: 'no-referrer', // no-referrer, *no-referrer-when-downgrade, origin, origin-when-cross-origin, same-origin, strict-origin, strict-origin-when-cross-origin, unsafe-url
-    body: JSON.stringify(data) // body data type must match "Content-Type" header
-  });
-  return response.json(); // parses JSON response into native JavaScript objects
-}
-
-postData('https://example.com/answer', { answer: 42 })
-  .then(data =&gt; {
-    console.log(data); // JSON data parsed by `data.json()` call
-  });</pre>
-
-<p>Tenga en cuenta que  <code>mode: "no-cors"</code> solo permite un conjunto limitado de encabezados en la solicitud:</p>
-
-<ul>
- <li><code>Accept</code></li>
- <li><code>Accept-Language</code></li>
- <li><code>Content-Language</code></li>
- <li><code>Content-Type</code> with a value of <code>application/x-www-form-urlencoded</code>, <code>multipart/form-data</code>, or <code>text/plain</code></li>
-</ul>
-
-<h3 id="Comprobando_que_la_petición_es_satisfactoria">Comprobando que la petición es satisfactoria</h3>
-
-<p>Una petición promise {{domxref("GlobalFetch.fetch","fetch()")}} será rechazada con {{jsxref("TypeError")}} cuando se encuentre un error de red, aunque esto normalmente significa problemas de permisos o similares — por ejemplo, un 404 no constituye un error de red. Una forma precisa de comprobar que la petición <code>fetch()</code> es satisfactoria pasa por comprobar si la promesa ha sido resuelta, además de comprobar que la propiedad {{domxref("Response.ok")}} tiene el valor <code>true</code> que indica que el estado de la petición HTTP es OK (código 200-299). El código sería algo así:</p>
-
-<pre class="brush: js notranslate">fetch('flores.jpg').then(function(response) {
-  if(response.ok) {
-    response.blob().then(function(miBlob) {
-      var objectURL = URL.createObjectURL(miBlob);
-      miImagen.src = objectURL;
-    });
-  } else {
-    console.log('Respuesta de red OK pero respuesta HTTP no OK');
-  }
-})
-.catch(function(error) {
-  console.log('Hubo un problema con la petición Fetch:' + error.message);
-});</pre>
-
-<h3 id="Proporcionando_tu_propio_objeto_Request">Proporcionando tu propio objeto Request</h3>
-
-<p>En lugar de pasar la ruta al recurso que deseas solicitar a la llamada del método <code>fetch()</code>, puedes crear un objeto de petición utilizando el constructor {{domxref("Request.Request","Request()")}}, y pasarlo como un argumento del método <code>fetch()</code>:</p>
-
-<pre class="brush: js notranslate">var myHeaders = new Headers();
-
-var myInit = { method: 'GET',
-               headers: myHeaders,
-               mode: 'cors',
-               cache: 'default' };
-
-var myRequest = new Request('flowers.jpg', myInit);
-
-fetch(myRequest)
-.then(function(response) {
-  return response.blob();
-})
-.then(function(myBlob) {
-  var objectURL = URL.createObjectURL(myBlob);
-  myImage.src = objectURL;
-});</pre>
-
-<p><code>Request()</code> acepta exactamente los mismos parámetros que el método <code>fetch()</code>. Puedes incluso pasar un objeto de petición existente para crear una copia del mismo:</p>
-
-<pre class="brush: js notranslate">var anotherRequest = new Request(myRequest, myInit);</pre>
-
-<p>Esto es muy útil ya que el cuerpo de las solicitudes y respuestas son de un sólo uso. Haciendo una copia como esta te permite utilizar la petición/respuesta de nuevo, y al mismo tiempo, si lo deseas, modificar las opciones de <code>init</code>. La copia debe estar hecha antes de la lectura del &lt;body&gt;, y leyendo el &lt;body&gt; en la copia, se marcará como leido en la petición original.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Existe también un método {{domxref("Request.clone","clone()")}} que crea una copia. Este tiene una semántica ligeramente distinta al otro método de copia — el primero fallará si el cuerpo de la petición anterior ya ha sido leído (lo mismo para copiar una respuesta), mientras que <code>clone()</code> no.</p>
-</div>
-
-<h3 id="Enviar_una_petición_con_credenciales_incluido">Enviar una petición con credenciales incluido</h3>
-
-<p>Para producir que los navegadores envien una petición con las credenciales incluidas, incluso para una llamada de origen cruzado, añadimos<code> credentials: 'include'</code> en el el objeto <code>init</code> que se pasa al método <code>fetch()</code>.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
-  credentials<span class="punctuation token">:</span> <span class="string token">'include'</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span></code></pre>
-
-<p>Si solo quieres enviar la credenciales si la URL de la petición está en el mismo origen desde donde se llamada el script, añade <code>credentials: 'same-origin'</code>.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="comment token">// El script fué llamado desde el origen 'https://example.com'</span>
-
-<span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
-  credentials<span class="punctuation token">:</span> <span class="string token">'same-origin'</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span></code></pre>
-
-<p>Sin embargo para asegurarte que el navegador no incluye las credenciales en la petición, usa <code>credentials: 'omit'</code>.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
-  credentials<span class="punctuation token">:</span> <span class="string token">'omit'</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span></code></pre>
-
-<h3 id="Enviando_datos_JSON">Enviando datos JSON</h3>
-
-<p>Usa {{domxref("GlobalFetch.fetch","fetch()")}} para enviar una petición POST con datos codificados en JSON .</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="keyword token">var</span> url <span class="operator token">=</span> <span class="string token">'https://example.com/profile'</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> data <span class="operator token">=</span> <span class="punctuation token">{</span>username<span class="punctuation token">:</span> <span class="string token">'example'</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-
-<span class="function token">fetch</span><span class="punctuation token">(</span>url<span class="punctuation token">,</span> <span class="punctuation token">{</span>
-  method<span class="punctuation token">:</span> <span class="string token">'POST'</span><span class="punctuation token">,</span> <span class="comment token">// or 'PUT'</span>
-  body<span class="punctuation token">:</span> JSON<span class="punctuation token">.</span><span class="function token">stringify</span><span class="punctuation token">(</span>data<span class="punctuation token">)</span><span class="punctuation token">,</span> <span class="comment token">// data can be `string` or {object}!</span>
-  headers<span class="punctuation token">:</span><span class="punctuation token">{</span>
-    <span class="string token">'Content-Type'</span><span class="punctuation token">:</span> <span class="string token">'application/json'</span>
-  <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>res <span class="operator token">=</span><span class="operator token">&gt;</span> res<span class="punctuation token">.</span><span class="function token">json</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">)</span>
-<span class="punctuation token">.</span><span class="keyword token">catch</span><span class="punctuation token">(</span>error <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'Error:'</span><span class="punctuation token">,</span> error<span class="punctuation token">)</span><span class="punctuation token">)</span>
-<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>response <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'Success:'</span><span class="punctuation token">,</span> response<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<h3 id="Enviando_un_archivo">Enviando un archivo</h3>
-
-<p>Los archivos pueden ser subido mediante el HTML de un elemento input <code>&lt;input type="file" /&gt;</code>, {{domxref("FormData.FormData","FormData()")}} y {{domxref("GlobalFetch.fetch","fetch()")}}.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="keyword token">var</span> formData <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">FormData</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> fileField <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">"input[type='file']"</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-formData<span class="punctuation token">.</span><span class="function token">append</span><span class="punctuation token">(</span><span class="string token">'username'</span><span class="punctuation token">,</span> <span class="string token">'abc123'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-formData<span class="punctuation token">.</span><span class="function token">append</span><span class="punctuation token">(</span><span class="string token">'avatar'</span><span class="punctuation token">,</span> fileField<span class="punctuation token">.</span>files<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-<span class="function token">fetch</span><span class="punctuation token">(</span><span class="string token">'https://example.com/profile/avatar'</span><span class="punctuation token">,</span> <span class="punctuation token">{</span>
-  method<span class="punctuation token">:</span> <span class="string token">'PUT'</span><span class="punctuation token">,</span>
-  body<span class="punctuation token">:</span> formData
-<span class="punctuation token">}</span><span class="punctuation token">)</span>
-<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>response <span class="operator token">=</span><span class="operator token">&gt;</span> response<span class="punctuation token">.</span><span class="function token">json</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">)</span>
-<span class="punctuation token">.</span><span class="keyword token">catch</span><span class="punctuation token">(</span>error <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'Error:'</span><span class="punctuation token">,</span> error<span class="punctuation token">)</span><span class="punctuation token">)</span>
-<span class="punctuation token">.</span><span class="function token">then</span><span class="punctuation token">(</span>response <span class="operator token">=</span><span class="operator token">&gt;</span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'Success:'</span><span class="punctuation token">,</span> response<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<h2 id="Cabeceras">Cabeceras</h2>
-
-<p>La interfaz {{domxref("Headers")}} te permite crear tus propios objetos de headers mediante el constructor {{domxref("Headers.Headers","Headers()")}}. Un objeto headers es un simple multi-mapa de nombres y valores:</p>
-
-<pre class="brush: js notranslate">var content = "Hello World";
-var myHeaders = new Headers();
-myHeaders.append("Content-Type", "text/plain");
-myHeaders.append("Content-Length", content.length.toString());
-myHeaders.append("X-Custom-Header", "ProcessThisImmediately");</pre>
-
-<p>Lo mismo se puede lograr pasando un "array de arrays" o un objeto literal al constructor:</p>
-
-<pre class="brush: js notranslate">myHeaders = new Headers({
-  "Content-Type": "text/plain",
-  "Content-Length": content.length.toString(),
-  "X-Custom-Header": "ProcessThisImmediately",
-});</pre>
-
-<p>Los contenidos pueden ser consultados o recuperados:</p>
-
-<pre class="brush: js notranslate">console.log(myHeaders.has("Content-Type")); // true
-console.log(myHeaders.has("Set-Cookie")); // false
-myHeaders.set("Content-Type", "text/html");
-myHeaders.append("X-Custom-Header", "AnotherValue");
-
-console.log(myHeaders.get("Content-Length")); // 11
-console.log(myHeaders.getAll("X-Custom-Header")); // ["ProcessThisImmediately", "AnotherValue"]
-
-myHeaders.delete("X-Custom-Header");
-console.log(myHeaders.getAll("X-Custom-Header")); // [ ]</pre>
-
-<p>Algunas de estas operaciones solo serán utiles en  {{domxref("ServiceWorker_API","ServiceWorkers")}}, pero estas disponen de una mejor API  para manipular <code>headers</code>.</p>
-
-<p>Todos los métodosde de <code>headers</code> lanzan un <code>TypeError</code> si un nombre de cabecera no es un nombre de cabecera HTTP válido. Las operaciones de mutación lanzarán un <code>TypeError</code> si hay un guarda inmutable (ver más abajo). Si no, fallan silenciosamente. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">var myResponse = Response.error();
-try {
-  myResponse.headers.set("Origin", "http://mybank.com");
-} catch(e) {
-  console.log("Cannot pretend to be a bank!");
-}</pre>
-
-<p>Un buen caso de uso para <code>headers</code> es comprobar cuando el tipo de contenido es correcto antes de que se procese:</p>
-
-<pre class="brush: js notranslate">fetch(myRequest).then(function(response) {
-  var contentType = response.headers.get("content-type");
-  if(contentType &amp;&amp; contentType.indexOf("application/json") !== -1) {
-    return response.json().then(function(json) {
-      // process your JSON further
-    });
-  } else {
-    console.log("Oops, we haven't got JSON!");
-  }
-});</pre>
-
-<h3 id="Guarda_Guard">Guarda (Guard)</h3>
-
-<p>Desde que las cabeceras pueden ser enviadas  en peticiones y recibidas en respuestas, y tienen limitaciones sobre que información puede y debería ser mutable, los objeto headers tienen una propierdad de guarda. Este no está expuesto a la Web, pero puede afectar a que operaciones de mutación son permitidas sobre el objeto headers.</p>
-
-<p>Los valores posibles de guarda (guard) son:</p>
-
-<ul>
- <li><code>none</code>: valor por defecto.</li>
- <li><code>request</code>: Guarda para el objeto headers obtenido de la petición ({{domxref("Request.headers")}}).</li>
- <li><code>request-no-cors</code>: Guarda para un objeto headers obtenido desde una petición creada con {{domxref("Request.mode")}} a <code>no-cors</code>.</li>
- <li><code>response</code>: Guarda para una cabecera obetenida desde un respuesta ({{domxref("Response.headers")}}).</li>
- <li><code>immutable</code>: Mayormente utilizado para ServiceWorkers, produce un objeto headers de solo lectura.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>:  No se debería añadir o establecer una petición a un objeto headers <em>guardado</em> con la cabecera <code>Content-Length</code>. De igual manera, insertar <code>Set-Cookie</code> en la respuesta de la cabecera no esta permitido: ServiceWorkers no estan autorizados a establecer cookies a través de respuestas sintéticas.</p>
-</div>
-
-<h2 id="Objetos_Response">Objetos Response</h2>
-
-<p>Cómo has visto anteriormente, las instancias de {{domxref("Response")}} son devueltas cuando <code>fetch()</code> es resuelto.</p>
-
-<p>Las propiedades de response que usarás son:</p>
-
-<ul>
- <li>{{domxref("Response.status")}} — Entero (por defecto con valor 200) que contiene el código de estado de las respuesta.</li>
- <li>{{domxref("Response.statusText")}} — Cadena (con valor por defecto "OK"), el cual corresponde al mensaje del estado de código HTTP.</li>
- <li>{{domxref("Response.ok")}} — Visto en uso anteriormente, es una clave para comprobar que el estado está dentro del rango 200-299 (ambos incluidos). Este devuelve un valor {{domxref("Boolean")}}, siendo <code>true</code> si lo anterior se cumple y <code>false</code> en otro caso.</li>
-</ul>
-
-<p>Estos pueden también creados programáticamente a través de JavaScript, pero esto solamente es realmete útil en {{domxref("ServiceWorker_API", "ServiceWorkers")}},  cuando pones un objeto response personalizado a una respuesta recibida usando un método {{domxref("FetchEvent.respondWith","respondWith()")}}:</p>
-
-<pre class="brush: js notranslate">var myBody = new Blob();
-
-addEventListener('fetch', function(event) {
-  event.respondWith(
-    new Response(myBody, {
-      headers: { "Content-Type" : "text/plain" }
-    })
-  );
-});</pre>
-
-<p>El constructor {{domxref("Response.Response","Response()")}} toma dos argurmentos opcionales, un cuerpo para la respuesta y un objeto init (similar al que acepta {{domxref("Request.Request","Request()")}}).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: El método estático {{domxref("Response.error","error()")}} simplemente devuelve un error en la respuesta. De igual manera que {{domxref("Response.redirect","redirect()")}} devuelve una respuesta que resulta en un redirección a una URL especificada. Estos son solo relevantes tambien a ServiceWorkers.</p>
-</div>
-
-<h2 id="Body">Body</h2>
-
-<p>Tanto las peticiones como las respuestas pueden contener datos body. Body es una instancia de cualquiera de los siguientes tipos:</p>
-
-<ul>
- <li>{{domxref("ArrayBuffer")}}</li>
- <li>{{domxref("ArrayBufferView")}} (Uint8Array y amigos)</li>
- <li>{{domxref("Blob")}}/File</li>
- <li>string</li>
- <li>{{domxref("URLSearchParams")}}</li>
- <li>{{domxref("FormData")}}</li>
-</ul>
-
-<p>El mixin de {{domxref("Body")}} define los siguientes metodos para extraer un body (implementado por {{domxref("Request")}} and {{domxref("Response")}}). Todas ellas devuelven una promesa que es eventualmente resuelta con el contenido actual.</p>
-
-<ul>
- <li>{{domxref("Body.arrayBuffer","arrayBuffer()")}}</li>
- <li>{{domxref("Body.blob","blob()")}}</li>
- <li>{{domxref("Body.json","json()")}}</li>
- <li>{{domxref("Body.text","text()")}}</li>
- <li>{{domxref("Body.formData","formData()")}}</li>
-</ul>
-
-<p>Este hace uso de los datos no texttuales mucho mas facil que si fuera con XHR.</p>
-
-<p>Las peticiones body pueden ser establecidas pasando el parametro body:</p>
-
-<pre class="brush: js notranslate">var form = new FormData(document.getElementById('login-form'));
-fetch("/login", {
-  method: "POST",
-  body: form
-});</pre>
-
-<p>Tanto peticiones y respuestas (y por extensión la function <code>fetch()</code>), intentaran inteligentemente determinar el tipo de contenido. Una petición tambien establecerá automáticamente la propiedad <code>Context-Type</code> de la cabecera si no es ha establecido una.</p>
-
-<h2 id="Detectar_característica">Detectar característica</h2>
-
-<p>Puedes comprobar si el navegador soporta  la API de Fetch comprobando la existencia de {{domxref("Headers")}}, {{domxref("Request")}}, {{domxref("Response")}} o {{domxref("GlobalFetch.fetch","fetch()")}} sobre el ámbito de {{domxref("Window")}} o {{domxref("Worker")}}. Por ejemplo:</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="keyword token">if</span> <span class="punctuation token">(</span>self<span class="punctuation token">.</span>fetch<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="comment token">// run my fetch request here</span>
-<span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="punctuation token">{</span>
-    <span class="comment token">// do something with XMLHttpRequest?</span>
-<span class="punctuation token">}</span></code></pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Para utilizar <code>fetch()</code> en un explorador no soportado, hay disponible un <a href="https://github.com/github/fetch">Fetch Polyfill</a> que recrea la funcionalidad para navegadores no soportados.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Fetch')}}</td>
-   <td>{{Spec2('Fetch')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{Compat("api.WindowOrWorkerGlobalScope.fetch")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li>
- <li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">HTTP access control (CORS)</a></li>
- <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
- <li><a href="https://github.com/github/fetch">Fetch polyfill</a></li>
- <li><a href="https://github.com/mdn/fetch-examples/">Fetch examples on Github</a></li>
-</ul>
diff --git a/files/es/web/api/formdata/index.html b/files/es/web/api/formdata/index.html
new file mode 100644
index 0000000000..f212bd63a3
--- /dev/null
+++ b/files/es/web/api/formdata/index.html
@@ -0,0 +1,85 @@
+---
+title: FormData
+slug: Web/API/FormData
+tags:
+  - API
+  - FormData
+  - Interfaz
+  - Referencia
+  - XMLHttpRequest
+translation_of: Web/API/FormData
+original_slug: Web/API/XMLHttpRequest/FormData
+---
+<p>{{APIRef("XMLHttpRequest")}}</p>
+
+<p>La interfaz <strong><code>FormData</code></strong> proporciona una manera sencilla de construir un conjunto de parejas clave/valor que representan los campos de un formulario y sus valores, que pueden ser enviados fácilmente con el método {{domxref("XMLHttpRequest.send()")}}. Utiliza el mismo formato que usaría un formulario si el tipo de codificación fuera <code>"multipart/form-data"</code>.</p>
+
+<p>También puede pasarse directamente al constructor de {{domxref("URLSearchParams")}} si se quieren generar parámetros de consulta de la misma forma en que lo haría un {{HTMLElement("form")}} si usara un envío <code>GET</code> simple.</p>
+
+<p>Un objeto que implementa <code>FormData</code> puede usarse directamente en una estructura {{jsxref("Statements/for...of", "for...of")}}, en lugar de {{domxref('FormData.entries()', 'entries()')}}: <code>for (var p of myFormData)</code> es equivalente a <code>for (var p of myFormData.entries())</code>.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Esta característica está disponible en <a href="/es/docs/Web/API/Web_Workers_API">Web Workers</a>.</p>
+</div>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{domxref("FormData.FormData","FormData()")}}</dt>
+ <dd>Crea un nuevo objeto <code>FormData</code>.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{domxref("FormData.append()")}}</dt>
+ <dd>Agrega un nuevo valor a una clave existente dentro de un objeto <code>FormData</code>, o añade la clave si aún no existe.</dd>
+ <dt>{{domxref("FormData.delete()")}}</dt>
+ <dd>Elimina una pareja clave/valor de un objeto <code>FormData</code>.</dd>
+ <dt>{{domxref("FormData.entries()")}}</dt>
+ <dd>Devuelve un {{jsxref("Iteration_protocols","iterator")}} que permite recorrer todas las parejas clave/valor contenidas en este objeto.</dd>
+ <dt>{{domxref("FormData.get()")}}</dt>
+ <dd>Devuelve el primer valor asociado con una clave dada en un objeto <code>FormData</code>.</dd>
+ <dt>{{domxref("FormData.getAll()")}}</dt>
+ <dd>Devuelve un array con todos los valores asociados con una clave dada en un objeto <code>FormData</code>.</dd>
+ <dt>{{domxref("FormData.has()")}}</dt>
+ <dd>Devuelve un booleano que indica si un objeto <code>FormData</code> contiene una clave determinada.</dd>
+ <dt>{{domxref("FormData.keys()")}}</dt>
+ <dd>Devuelve un {{jsxref("Iteration_protocols", "iterator")}} que permite recorrer todas las claves de las parejas clave/valor contenidas en este objeto.</dd>
+ <dt>{{domxref("FormData.set()")}}</dt>
+ <dd>Establece un nuevo valor para una clave existente dentro de un objeto <code>FormData</code>, o agrega la clave/valor si aún no existe.</dd>
+ <dt>{{domxref("FormData.values()")}}</dt>
+ <dd>Devuelve un {{jsxref("Iteration_protocols", "iterator")}} que permite recorrer todos los valores contenidos en este objeto.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('XMLHttpRequest','#interface-formdata','FormData')}}</td>
+   <td>{{Spec2('XMLHttpRequest')}}</td>
+   <td>FormData definido en XHR spec</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("api.FormData")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{domxref("XMLHTTPRequest")}}</li>
+ <li><a href="/en/DOM/XMLHttpRequest/Using_XMLHttpRequest" title="En/Using XMLHttpRequest">Utilización de XMLHttpRequest</a></li>
+ <li><a href="/es/docs/Web/Guide/Usando_Objetos_FormData" title="en/DOM/XMLHttpRequest/FormData/Using_FormData_objects">Usando objetos FormData</a></li>
+ <li>{{HTMLElement("Form")}}</li>
+</ul>
diff --git a/files/es/web/api/formdata/using_formdata_objects/index.html b/files/es/web/api/formdata/using_formdata_objects/index.html
new file mode 100644
index 0000000000..47b2fae3fa
--- /dev/null
+++ b/files/es/web/api/formdata/using_formdata_objects/index.html
@@ -0,0 +1,138 @@
+---
+title: Usando Objetos FormData
+slug: Web/API/FormData/Using_FormData_Objects
+translation_of: Web/API/FormData/Using_FormData_Objects
+translation_of_original: Web/Guide/Using_FormData_Objects
+original_slug: Web/Guide/Usando_Objetos_FormData
+---
+<p>Los objetos <code><a href="/es/docs/XMLHttpRequest/FormData" title="en/DOM/XMLHttpRequest/FormData">FormData</a> </code>le permiten compilar un conjunto de pares clave/valor para enviar mediante <code>XMLHttpRequest</code>. Están destinados principalmente para el envío de los datos del formulario, pero se pueden utilizar de forma independiente con el fin de transmitir los datos tecleados. Los datos transmitidos estarán en el mismo formato que usa el método <code>submit() </code>del formulario para enviar los datos si el tipo de codificación del formulario se establece en "multipart/form-data".</p>
+
+<h2 id="Creación_de_un_objeto_FormData_desde_cero">Creación de un objeto FormData desde cero</h2>
+
+<p>Usted mismo puede construir un objeto <code>FormData</code> instanciándolo y después añadiendo campos a la instancia usando su método  <a href="/en/DOM/XMLHttpRequest/FormData#append()" title="en/XMLHttpRequest/FormData#append()"><code>append()</code></a> , tal y como se muestra:</p>
+
+<pre class="brush: js">var formData = new FormData();
+
+<span style="line-height: normal;">formData</span>.append("username", "Groucho");
+<span style="line-height: normal;">formData</span>.append("accountnum", 123456); // number 123456 is immediately converted to string "123456"
+
+// HTML file input user's choice...
+<span style="line-height: normal;">formData</span>.append("userfile", fileInputElement.files[0]);
+
+// JavaScript file-like object...
+var content = '&lt;a id="a"&gt;&lt;b id="b"&gt;hey!&lt;/b&gt;&lt;/a&gt;'; // the body of the new file...
+var blob = new Blob([<span style="line-height: normal;">content</span><span style="line-height: normal;">], { type: "text/xml"});</span>
+
+formData.append("webmasterfile", <span style="line-height: normal;">blob</span><span style="line-height: normal;">);</span>
+
+var request = new XMLHttpRequest();
+<span style="line-height: normal;">request</span>.open("POST", "http://foo.com/submitform.php");
+<span style="line-height: normal;">request</span>.send(formData);
+</pre>
+
+<div class="note"><strong>Nota:</strong> Los campos "userfile" y "webmasterfile" contienen ambos un archivo. El número asignado al campo "accountnum" es inmediatamente convertido a string por el método <a href="/en/DOM/XMLHttpRequest/FormData#append()" title="en/XMLHttpRequest/FormData#append()"><code>FormData.append()</code></a> (el valor del campo puede ser un {{ domxref("Blob") }}, {{ domxref("File") }}, o una cadena de texto; <strong>si el valor no es ni un Blob, ni un File, será convertido a un string</strong>).</div>
+
+<p>Este ejemplo construye una instancia de <code>FormData</code> que almacenará los valores de los campos "username", "accountnum", "userfile" y "webmasterfile", entonces usará el método <a href="/en/DOM/XMLHttpRequest#send()" title="en/XMLHttpRequest#send()"><code>send()</code></a> de <code>XMLHttpRequest</code> para enviar los datos del formulario. El campo "webmasterfile" es un <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a>. Un objeto <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a> representa un objeto de tipo similar a un fichero que es inalterable y que almacenará datos en formato raw. Los Blobs representan datos que no necesariamente tendrán un formato Javascript nativo. La interfaz {{ domxref("File") }} está basada en <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a>, y hereda su funcionalidad y la amplía para dar soporte a archivos que estén en el sistema del usuario. Para construir un <code><a href="/en/DOM/Blob" title="en/DOM/Blob">Blob</a></code>, puede invocar <a href="/en/DOM/Blob#Constructor" title="en/DOM/Blob#Constructor"><code>al constructor del objeto Blob</code></a>.</p>
+
+<h2 id="Recuperando_un_objeto_FormData_de_un_formulario_HTML">Recuperando un objeto FormData de un formulario HTML </h2>
+
+<p>Para construir un objeto <code>FormData</code> que contenga los datos de un {{ HTMLElement("form") }} existente, especifique ese elemento form cuando cree el objeto <code>FormData</code>:</p>
+
+<pre class="brush: js">var <span style="line-height: normal;">formData</span><span style="line-height: normal;"> = new FormData(someFormElement);</span>
+</pre>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: js">var formElement = document.getElementById("myFormElement");
+var request = new XMLHttpRequest();
+<span style="line-height: normal;">request</span>.open("POST", "submitform.php");
+<span style="line-height: normal;">request</span>.send(new FormData(formElement));
+</pre>
+
+<p>También puede añadir datos adicionales al objeto <code>FormData</code> antes de enviarlo. Así:</p>
+
+<pre class="brush: js">var formElement = document.getElementById("myFormElement");
+formData = new FormData(formElement);
+formData.append("serialnumber", serialNumber++);
+<span style="line-height: normal;">request</span>.send(formData);</pre>
+
+<p>Esto le permite aumentar los datos del formulario antes de enviarlos para incluir información adicional que no necesariamente debiera ser editable por el usuario en el formulario.</p>
+
+<h2 id="Enviando_archivos_usando_objetos_FormData">Enviando archivos usando objetos FormData</h2>
+
+<p>También puede enviar archivos usando <code>FormData</code>. Simplemente incluye un elemento {{ HTMLElement("input") }} de tipo {{ domxref("File") }}:</p>
+
+<pre class="brush: html">&lt;form enctype="multipart/form-data" method="post" name="fileinfo"&gt;
+  &lt;label&gt;Your email address:&lt;/label&gt;
+  &lt;input type="email" autocomplete="on" autofocus name="userid" placeholder="email" required size="32" maxlength="64" /&gt;&lt;br /&gt;
+  &lt;label&gt;Custom file label:&lt;/label&gt;
+  &lt;input type="text" name="filelabel" size="12" maxlength="32" /&gt;&lt;br /&gt;
+  &lt;label&gt;File to stash:&lt;/label&gt;
+  &lt;input type="file" name="file" required /&gt;
+  &lt;input type="submit" value="Stash the file!" /&gt;
+&lt;/form&gt;
+&lt;div id="output"&gt;&lt;/div&gt;
+</pre>
+
+<p>Luego puede enviarlo usando código como el siguiente:</p>
+
+<pre class="brush: js">var form = document.forms.namedItem("fileinfo");
+form.addEventListener('submit', function(ev) {
+
+  var
+    oOutput = document.getElementById("output"),
+    oData = new FormData(document.forms.namedItem("fileinfo"));
+
+  oData.append("CustomField", "This is some extra data");
+
+  var oReq = new XMLHttpRequest();
+  oReq.open("POST", "stash.php", true);
+  oReq.onload = function(oEvent) {
+    if (oReq.status == 200) {
+      oOutput.innerHTML = "Uploaded!";
+    } else {
+      oOutput.innerHTML = "Error " + oReq.status + " occurred uploading your file.&lt;br \/&gt;";
+    }
+  };
+
+  oReq.send(oData);
+  ev.preventDefault();
+}, false);
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: el método especificado en el formulario será usado por encima del método utilizado en en la llamada a open().</p>
+</div>
+
+<p>También puede añadir un {{ domxref("File") }} o un {{ domxref("Blob") }} directamente al objeto {{ domxref("XMLHttpRequest/FormData", "FormData") }} de la siguiente manera:</p>
+
+<pre class="brush: js">data.append("myfile", myBlob, "filename.txt");
+</pre>
+
+<p>Cuando se usa el método <code>append</code> es posible usar, de manera opcional, un tercer parámetro para pasarle un nombre de fichero dentro de la cabecera <code>Content-Disposition </code>que será enviada al servidor. Cuando no se especifica (o el parámetro no es soportado), el nombre "blob" es el que será utilizado.</p>
+
+<p>Además, puede usar FormData con jQuery si asigna las opciones correctas:</p>
+
+<pre class="brush: js">var fd = new FormData(document.getElementById("fileinfo"));
+fd.append("CustomField", "This is some extra data");
+$.ajax({
+  url: "stash.php",
+  type: "POST",
+  data: fd,
+  processData: false,  // tell jQuery not to process the data
+  contentType: false   // tell jQuery not to set contentType
+});
+</pre>
+
+<h2 id="Envío_de_formularios_y_carga_de_archivos_vía_AJAX_sin_objetos_FormData">Envío de formularios y carga de archivos vía AJAX <em>sin</em>  objetos <code style="font-size: 30px; font-weight: 700;">FormData</code></h2>
+
+<p>Si quiere saber cómo serializar y enviar vía <a href="/en-US/docs/AJAX" title="/en-US/docs/AJAX">AJAX</a> un formulario <em>sin </em>utilizar objetos FormData, por favor leer <a href="/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files" title="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files">este párrafo</a> .</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest" title="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest">Usando XMLHttpRequest</a></li>
+ <li><a href="/en-US/docs/DOM/HTMLFormElement" title="/en-US/docs/DOM/HTMLFormElement"><code>HTMLFormElement</code></a></li>
+ <li><a href="/en-US/docs/DOM/Blob" title="/en-US/docs/DOM/Blob"><code>Blob</code></a></li>
+ <li><a href="/en-US/docs/JavaScript/Typed_arrays" title="/en-US/docs/JavaScript/Typed_arrays">Typed Arrays</a></li>
+</ul>
diff --git a/files/es/web/api/geolocation_api/index.html b/files/es/web/api/geolocation_api/index.html
new file mode 100644
index 0000000000..6f54c10663
--- /dev/null
+++ b/files/es/web/api/geolocation_api/index.html
@@ -0,0 +1,233 @@
+---
+title: Uso de geolocalización
+slug: Web/API/Geolocation_API
+tags:
+  - API
+  - Geolocalización
+  - Guía
+  - clearWatch
+  - watchPosition
+translation_of: Web/API/Geolocation_API
+original_slug: WebAPI/Using_geolocation
+---
+<p>{{securecontext_header}}{{APIRef("Geolocation API")}}</p>
+
+<p><span id="result_box" lang="es"><span class="hps">La</span> <strong><span class="hps">API de geolocalización</span></strong> <span class="hps">permite al</span> <span class="hps">usuario compartir su</span> <span class="hps">ubicación</span> <span class="hps">a las aplicaciones web</span> <span class="hps">si</span> <span class="hps">así lo desea.</span> <span class="hps">Por razones de privacidad</span><span>,</span> <span class="hps">al usuario</span> <span class="hps">se le pide que</span> <span class="hps">confirme el permiso</span> <span class="hps">para proporcionar información</span> <span class="hps">de ubicación.</span></span></p>
+
+<h2 id="El_objeto_geolocation">El objeto geolocation</h2>
+
+<p><span id="result_box" lang="es"><span class="hps">La API</span> <span class="hps">de geolocalización</span> <span class="hps">se publica</span> <span class="hps">a través del objeto </span></span>{{domxref("window.navigator.geolocation","navigator.geolocation")}}.</p>
+
+<p><span id="result_box" lang="es"><span class="hps">Si el objeto existe</span><span>,</span> <span class="hps">los servicios de geolocalización</span> <span class="hps">están disponibles.</span> <span class="hps">Se puede</span> <span class="hps">comprobar la presencia</span> <span class="hps">de la geolocalización</span> <span class="hps">de esta manera:</span></span></p>
+
+<pre class="brush: js">if ("geolocation" in navigator) {
+  /* la geolocalización está disponible */
+} else {
+  /* la geolocalización NO está disponible */
+}
+</pre>
+
+<div class="blockIndicator note">
+<p>Nota: En Firefox 24 y versiones anteriores, <code>"geolocation" in navigator</code> siempre retornaba <code>true</code> incluso si la API se encontraba deshabilitada. Esto ha sido corregido en <a href="https://www.fxsitecompat.com/en-CA/versions/25/">Firefox 25</a> para cumplir con la especificación.  ({{bug(884921)}}).</p>
+</div>
+
+<h3 id="Obtención_de_la_ubicación_actual">Obtención de la ubicación actual</h3>
+
+<p><span lang="es"><span class="hps">Para</span> <span class="hps">obtener la ubicación</span> <span class="hps">actual del usuario</span><span>, puede llamar a</span><span class="atn hps">l método </span></span>{{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}<span lang="es"><span class="hps">.</span></span></p>
+
+<p><span lang="es"><span class="hps">Esto inicia</span> <span class="hps">una solicitud asíncrona</span> <span class="hps">para detectar</span> <span class="hps">la posición del usuario</span><span>, y</span> <span class="hps">consulta el</span> <span class="hps">hardware</span> <span class="hps">de posicionamiento para</span> <span class="hps">obtener</span><span class="hps"> información actualizada.</span> </span><span id="result_box" lang="es"><span class="hps">Cuando</span> <span class="hps">se determina la posición</span><span>, se ejecuta la función</span> <span class="hps">de callback</span><span class="hps">.</span></span><span lang="es"> <span class="hps">Si lo desea,</span> <span class="hps">puede proporcionar otra función de callback</span><span class="hps"> que se</span> <span class="hps">ejecuta si</span> <span class="hps">se produce un error</span><span>.</span> <span class="hps">Un tercer</span> <span class="hps">parámetro</span> <span class="hps">opcional</span><span>, es un</span> <span class="hps">objeto de opciones</span> <span class="hps">donde se puede establecer</span> <span class="hps">la edad máxima de</span> <span class="hps">la</span> <span class="hps">posición devuelta</span><span>,</span> <span class="hps">el tiempo de espera</span> <span class="hps">para una solicitud</span> <span class="hps">y si se requiere</span> <span class="hps">una alta precisión</span> <span class="hps">para la posición.</span></span></p>
+
+<div class="note">
+<p><strong>Nota:</strong> Por defecto, {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} intenta responder tan rápido como sea posible con un resultado de baja precisión. Es útil cuando se necesita una respuesta rápida sin importar su exactitud. A los dispositivos con GPS, por ejemplo, les puede tomar más de un minuto obtener una posición, por lo que datos menos precisos (localización por IP o wifi) pueden ser devueltos por {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p>
+</div>
+
+<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) {
+  haz_algo(position.coords.latitude, position.coords.longitude);
+});</pre>
+
+<p>En el ejemplo anterior la función do_something() será ejecutada una vez que se obtiene la posición.</p>
+
+<h3 id="Rastreando_la_posición_actual">Rastreando la posición actual</h3>
+
+<p>Si los datos de ubicación cambian (si el dispositivo se mueve o información geográfica más precisa es recibida), puede definir una función de callback que se ejecuta al cambiar la posición. Esto se logra a través de la función {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}}, que recibe los mismos parámetros que {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}. La función de callback es ejecutada varias veces, permitiendo al navegador actualizar la ubicación cada vez que cambia, o proporcionar una posición con mayor exactitud utilizando distintas técnicas de geolocalización. La función de callback de error, la cual es opcional como en {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}, es llamada solo una vez, cuando nunca serán devueltos resultados correctos.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Es posible usar la función {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} sin haber ejecutado antes {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p>
+</div>
+
+<pre class="brush: js">var watchID = navigator.geolocation.watchPosition(function(position) {
+  do_something(position.coords.latitude, position.coords.longitude);
+});</pre>
+
+<p>El método {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} devuelve un número que se utiliza para identificar el rastreador de posición solicitado; este valor se utiliza junto con el método {{domxref("window.navigator.geolocation.clearWatch()","clearWatch()")}} para dejar de rastrear la posición del usuario.</p>
+
+<pre class="brush: js">navigator.geolocation.clearWatch(watchID);
+</pre>
+
+<h3 id="Afinando_la_respuesta">Afinando la respuesta</h3>
+
+<p>Ambos métodos,  {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} y {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} aceptan una función de callback en caso de éxito, una función callback opcional si ocurre algún error, y un objeto <code>PositionOptions</code> también opcional.</p>
+
+<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionOptions")}}</p>
+
+<p>Una llamada a {{domxref("window.navigator.geolocation.watchPosition()","watchPosition")}} luce como el siguiente ejemplo:</p>
+
+<pre class="brush: js">function geo_success(position) {
+  do_something(position.coords.latitude, position.coords.longitude);
+}
+
+function geo_error() {
+  alert("Sorry, no position available.");
+}
+
+var geo_options = {
+  enableHighAccuracy: true,
+  maximumAge        : 30000,
+  timeout           : 27000
+};
+
+var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);</pre>
+
+<p><a id="fck_paste_padding">Demo de watchPosition: </a><a class="external" href="http://www.thedotproduct.org/experiments/geo/">http://www.thedotproduct.org/experiments/geo/</a><br>
+ <a id="fck_paste_padding"></a></p>
+
+<h2 id="Describiendo_una_posición">Describiendo una posición</h2>
+
+<p>La ubicación del usuario es descrita con un objeto <code>Position</code> referenciando a un objeto <code>Coordinates</code>.</p>
+
+<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Position")}}</p>
+
+<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Coordinates")}}</p>
+
+<h2 id="Manejo_de_errores">Manejo de errores</h2>
+
+<p>La función de callback de error, si existe cuando se llama a <code>getCurrentPosition()</code> o <code>watchPosition()</code>, recibe un objeto  <code>PositionError</code> como su primer parámetro.</p>
+
+<pre class="brush: js">function errorCallback(error) {
+  alert('ERROR(' + error.code + '): ' + error.message);
+};
+</pre>
+
+<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionError")}}</p>
+
+<h2 id="Ejemplo_de_geolocalización">Ejemplo de geolocalización</h2>
+
+<div class="hidden">
+<pre class="brush: css">body {
+  padding: 20px;
+  background-color:#ffffc9
+}
+
+p { margin : 0; }
+</pre>
+</div>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush: html;">&lt;p&gt;&lt;button onclick="geoFindMe()"&gt;Show my location&lt;/button&gt;&lt;/p&gt;
+&lt;div id="out"&gt;&lt;/div&gt;
+</pre>
+
+<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
+
+<pre class="brush: js;">function geoFindMe() {
+  var output = document.getElementById("out");
+
+  if (!navigator.geolocation){
+    output.innerHTML = "&lt;p&gt;Geolocation is not supported by your browser&lt;/p&gt;";
+    return;
+  }
+
+  function success(position) {
+    var latitude  = position.coords.latitude;
+    var longitude = position.coords.longitude;
+
+    output.innerHTML = '&lt;p&gt;Latitude is ' + latitude + '° &lt;br&gt;Longitude is ' + longitude + '°&lt;/p&gt;';
+
+    var img = new Image();
+    img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&amp;zoom=13&amp;size=300x300&amp;sensor=false";
+
+    output.appendChild(img);
+  };
+
+  function error() {
+    output.innerHTML = "Unable to retrieve your location";
+  };
+
+  output.innerHTML = "&lt;p&gt;Locating…&lt;/p&gt;";
+
+  navigator.geolocation.getCurrentPosition(success, error);
+}
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Geolocation_Live_Example',350,410) }}</p>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>5</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
+   <td>9</td>
+   <td>10.60</td>
+   <td>5</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown()}}</td>
+   <td>{{CompatUnknown()}}</td>
+   <td>{{CompatGeckoMobile("4")}}</td>
+   <td>{{CompatUnknown()}}</td>
+   <td>10.60</td>
+   <td>{{CompatUnknown()}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Notas_sobre_Gecko">Notas sobre Gecko</h3>
+
+<p>Firefox incluye soporte para localizar basándose en información de redes inalámbricas, usando Google Location Services. En la transacción entre Firefox y Google, los datos son compartidos incluyendo información del punto de acceso inalámbrico, un token de acceso (similar a una cookie con duración de dos semanas), y la dirección IP del usuario. Para más información, por favor consulte la <a href="http://www.mozilla.com/en-US/legal/privacy/" title="http://www.mozilla.com/en-US/legal/privacy/">Política de Privacidad de Mozilla</a><span class="external"> y la</span> <a href="http://www.google.com/privacy-lsf.html" title="http://www.google.com/privacy-lsf.html">Política de Privacidad de Google</a>, dichos documentos cubren como estos datos pueden ser utilizados.</p>
+
+<p>En Firefox 3.6 (Gecko 1.9.2) fue añadido soporte para utilizar el servicio <a href="http://catb.org/gpsd/" title="http://catb.org/gpsd/">GPSD</a> para geolocalización en sistemas Linux.</p>
+
+<h2 id="Consultar_también">Consultar también</h2>
+
+<ul>
+ <li>{{domxref("window.navigator.geolocation","navigator.geolocation")}}</li>
+ <li><a href="http://www.w3.org/TR/geolocation-API/" title="http://www.w3.org/TR/geolocation-API/">API de Geolocalización en w3.org</a></li>
+ <li><a href="/en-US/demos/tag/tech:geolocation" title="/en-US/demos/tag/tech:geolocation">Demos que utilizan la API de Geolocalización</a></li>
+</ul>
+
+<p> </p>
diff --git a/files/es/web/api/globaleventhandlers/ongotpointercapture/index.html b/files/es/web/api/globaleventhandlers/ongotpointercapture/index.html
new file mode 100644
index 0000000000..eb41191855
--- /dev/null
+++ b/files/es/web/api/globaleventhandlers/ongotpointercapture/index.html
@@ -0,0 +1,135 @@
+---
+title: Element.ongotpointercapture
+slug: Web/API/GlobalEventHandlers/ongotpointercapture
+tags:
+  - API
+  - Controlador
+  - DOM
+  - Elemento
+  - Eventos Puntero
+  - Propiedad
+  - Referencia
+translation_of: Web/API/GlobalEventHandlers/ongotpointercapture
+translation_of_original: Web/API/Element/ongotpointercapture
+original_slug: Web/API/Element/ongotpointercapture
+---
+<p>{{ ApiRef("DOM") }}</p>
+
+<p><code>ongotpointercapture</code> es una propiedad {{domxref("EventHandler")}} de la interfaz {{domxref("Element")}}  <span id="result_box" lang="es"><span>que devuelve</span> <span>el controlador de eventos</span> <span>(función</span><span>)</span> <span>para el</span></span> evento tipo {{event("gotpointercapture")}}.</p>
+
+<h2 id="Syntax" name="Syntax">Síntasix</h2>
+
+<pre class="eval">var gotCaptureHandler = target.ongotpointercpature;
+</pre>
+
+<h3 id="Return_Value" name="Return_Value">Valor de Retorno</h3>
+
+<dl>
+ <dt><code>gotCaptureHandler</code></dt>
+ <dd><span id="result_box" lang="es"><span>El controlador de eventos</span>  <span>gotpointercapture</span> para el <span>elemento target</span><span>.</span></span></dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: js">&lt;html&gt;
+&lt;script&gt;
+function overHandler(ev) {
+ // Determine the target event's gotpointercapture handler
+ var gotCaptureHandler = ev.target.ongotpointercapture;
+}
+function init() {
+ var el=document.getElementById("target");
+ el.onpointerover = overHandler;
+}
+&lt;/script&gt;
+&lt;body onload="init();"&gt;
+&lt;div id="target"&gt; Touch me ... &lt;/div&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Pointer Events 2','#widl-Element-ongotpointercapture', 'ongotpointercapture')}}</td>
+   <td>{{Spec2('Pointer Events 2')}}</td>
+   <td>Versión no estable.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Pointer Events', '#widl-Element-ongotpointercapture', 'ongotpointercapture')}}</td>
+   <td>{{Spec2('Pointer Events')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad en los Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Función</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}} <sup>[1]</sup></td>
+   <td>{{CompatIE("10")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Función</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatIE("10")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Implementación retirada. Ver {{Bug("1166347")}}.</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{ event("gotpointercapture") }}</li>
+</ul>
diff --git a/files/es/web/api/globaleventhandlers/onlostpointercapture/index.html b/files/es/web/api/globaleventhandlers/onlostpointercapture/index.html
new file mode 100644
index 0000000000..7a1588480a
--- /dev/null
+++ b/files/es/web/api/globaleventhandlers/onlostpointercapture/index.html
@@ -0,0 +1,134 @@
+---
+title: Element.onlostpointercapture
+slug: Web/API/GlobalEventHandlers/onlostpointercapture
+tags:
+  - API
+  - Controlador de Eventos
+  - DOM
+  - Eventos Puntero
+  - Propiedad
+  - Referencia
+translation_of: Web/API/GlobalEventHandlers/onlostpointercapture
+translation_of_original: Web/API/Element/onlostpointercapture
+original_slug: Web/API/Element/onlostpointercapture
+---
+<p>{{ ApiRef("DOM") }}</p>
+
+<p><code>onlostpointercapture</code> es una propiedad {{domxref("EventHandler")}} de la interfaz {{domxref("Element")}}  <span id="result_box" lang="es"><span>que devuelve</span> <span>el controlador de eventos</span> <span>(función</span><span>)</span> <span>para el evento tipo </span></span>{{event("lostpointercapture")}} .</p>
+
+<h2 id="Syntax" name="Syntax">Síntasix</h2>
+
+<pre class="eval">var lostCaptureHandler = target.onlostpointercpature;
+</pre>
+
+<h3 id="Return_Value" name="Return_Value">Valor de Retorno</h3>
+
+<dl>
+ <dt><code>lostCaptureHandler</code></dt>
+ <dd>El controlador de eventos  <em>lostpointercapture</em> para el elemento <code>target</code>.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: js">&lt;html&gt;
+&lt;script&gt;
+function overHandler(ev) {
+ // Determine the target event's lostpointercapture handler
+ var lostCaptureHandler = ev.target.onlostpointercapture;
+}
+function init() {
+ var el=document.getElementById("target");
+ el.onpointerover = overHandler;
+}
+&lt;/script&gt;
+&lt;body onload="init();"&gt;
+&lt;div id="target"&gt; Touch me ... &lt;/div&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Pointer Events 2','#widl-Element-onlostpointercapture', 'onlostpointercapture')}}</td>
+   <td>{{Spec2('Pointer Events 2')}}</td>
+   <td>Versión no estable.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Pointer Events', '#widl-Element-onlostpointercapture', 'onlostpointercapture')}}</td>
+   <td>{{Spec2('Pointer Events')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad en los Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Función</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}} <sup>[1]</sup></td>
+   <td>{{CompatIE("10")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Función</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatIE("10")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Implementación retirada. Ver {{Bug("1166347")}}.</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{ event("lostpointercapture") }}</li>
+</ul>
diff --git a/files/es/web/api/globaleventhandlers/onunload/index.html b/files/es/web/api/globaleventhandlers/onunload/index.html
deleted file mode 100644
index a665fc2027..0000000000
--- a/files/es/web/api/globaleventhandlers/onunload/index.html
+++ /dev/null
@@ -1,45 +0,0 @@
----
-title: window.onunload
-slug: Web/API/GlobalEventHandlers/onunload
-translation_of: Web/API/WindowEventHandlers/onunload
----
-<p>{{ ApiRef() }}</p>
-<h3 id="Summary" name="Summary">Test Summary</h3>
-<p>The unload event is raised when the document is unloaded.</p>
-<h3 id="Syntax" name="Syntax">Syntax</h3>
-<pre class="eval">window.onunload = <em>funcRef</em>;
-</pre>
-<ul>
- <li><code>funcRef</code> is a reference to a function.</li>
-</ul>
-<h3 id="Example" name="Example">Example</h3>
-<pre>&lt;html&gt;
-&lt;head&gt;
-
-&lt;title&gt;onunload test&lt;/title&gt;
-
-&lt;script type="text/javascript"&gt;
-
-window.onunload = unloadPage;
-
-function unloadPage()
-{
- alert("unload event detected!");
-}
-&lt;/script&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-&lt;p&gt;Reload a new page into the browser&lt;br /&gt;
- to fire the unload event for this page.&lt;/p&gt;
-&lt;p&gt;You can also use the back or forward buttons&lt;br /&gt;
- to load a new page and fire this event.&lt;/p&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-<h3 id="Notes" name="Notes">Notes</h3>
-<p>Note that using this event handler in your page prevents Firefox 1.5 from caching the page in the in-memory bfcache. See <a href="/En/Using_Firefox_1.5_caching" title="En/Using_Firefox_1.5_caching">Using Firefox 1.5 caching</a> for details.</p>
-<p>Browsers equipped with pop-up window blockers will ignore all window.open() method calls in onunload event handler functions.</p>
-<h3 id="Specification" name="Specification">Specification</h3>
-<p>{{ DOM0() }}</p>
-<p>{{ languages( {"zh-cn": "zh-cn/DOM/window.onunload" } ) }}</p>
diff --git a/files/es/web/api/globaleventhandlers/onwheel/index.html b/files/es/web/api/globaleventhandlers/onwheel/index.html
new file mode 100644
index 0000000000..e2a59493ba
--- /dev/null
+++ b/files/es/web/api/globaleventhandlers/onwheel/index.html
@@ -0,0 +1,32 @@
+---
+title: Element.onwheel
+slug: Web/API/GlobalEventHandlers/onwheel
+tags:
+  - API
+  - DOM
+  - Gecko
+  - Propiedad
+  - Referencia
+translation_of: Web/API/GlobalEventHandlers/onwheel
+original_slug: Web/API/Element/onwheel
+---
+<p>{{ ApiRef("DOM") }}</p>
+
+<p>{{ non-standard_header() }}</p>
+
+<h3 id="Sumario">Sumario</h3>
+
+<p>La propiedad  <code>onwheel</code> devuelve el código del controlador de eventos <code>onwheel</code> en el elemento actual.</p>
+
+<h3 id="Syntax">Syntax</h3>
+
+<pre class="eval">element.onwheel = <em>event handling code</em>
+</pre>
+
+<h3 id="Notas">Notas</h3>
+
+<p>El evento <code>wheel</code> se genera cuando el usuario desplaza el contenido de un elemento.</p>
+
+<h3 id="Ver_también">Ver también</h3>
+
+<p><a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=18542" title="https://www.w3.org/Bugs/Public/show_bug.cgi?id=18542">Bug 18542 – el atributo onmousewheel  debe ser reemplazado con onwheel</a></p>
diff --git a/files/es/web/api/history_api/example/index.html b/files/es/web/api/history_api/example/index.html
new file mode 100644
index 0000000000..aed471d057
--- /dev/null
+++ b/files/es/web/api/history_api/example/index.html
@@ -0,0 +1,416 @@
+---
+title: Ejemplo de Navegación usando Ajax
+slug: Web/API/History_API/Example
+translation_of: Web/API/History_API/Example
+original_slug: DOM/Manipulando_el_historial_del_navegador/Ejemplo
+---
+<p>This is an example of an AJAX web site composed only of three pages (<em>first_page.php</em>, <em>second_page.php</em> and <em>third_page.php</em>). To see how it works, please, create the following files (or git clone <a href="https://github.com/giabao/mdn-ajax-nav-example" title="/en-US/docs/">https://github.com/giabao/mdn-ajax-nav-example.git</a> ):</p>
+
+<div class="note" id="const_compatibility"><strong>Note:</strong> For fully integrating the {{HTMLElement("form")}} elements within this <em>mechanism</em>, please take a look at the paragraph <a href="/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files">Submitting forms and uploading files</a>.</div>
+
+<p><strong>first_page.php</strong>:</p>
+
+<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
+<pre class="brush: php">&lt;?php
+    $page_title = "First page";
+
+    $as_json = false;
+    if (isset($_GET["view_as"]) &amp;&amp; $_GET["view_as"] == "json") {
+        $as_json = true;
+        ob_start();
+    } else {
+?&gt;
+&lt;!doctype html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;?php
+        include "include/header.php";
+        echo "&lt;title&gt;" . $page_title . "&lt;/title&gt;";
+?&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+&lt;?php include "include/before_content.php"; ?&gt;
+
+&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;first_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;div id="ajax-content"&gt;
+&lt;?php } ?&gt;
+
+    &lt;p&gt;This is the content of &lt;strong&gt;first_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;?php
+    if ($as_json) {
+        echo json_encode(array("page" =&gt; $page_title, "content" =&gt; ob_get_clean()));
+    } else {
+?&gt;
+&lt;/div&gt;
+
+&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;first_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;?php
+        include "include/after_content.php";
+        echo "&lt;/body&gt;\n&lt;/html&gt;";
+    }
+?&gt;
+</pre>
+</div>
+
+<p><strong>second_page.php</strong>:</p>
+
+<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
+<pre class="brush: php">&lt;?php
+    $page_title = "Second page";
+
+    $as_json = false;
+    if (isset($_GET["view_as"]) &amp;&amp; $_GET["view_as"] == "json") {
+        $as_json = true;
+        ob_start();
+    } else {
+?&gt;
+&lt;!doctype html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;?php
+        include "include/header.php";
+        echo "&lt;title&gt;" . $page_title . "&lt;/title&gt;";
+?&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+&lt;?php include "include/before_content.php"; ?&gt;
+
+&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;second_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;div id="ajax-content"&gt;
+&lt;?php } ?&gt;
+
+    &lt;p&gt;This is the content of &lt;strong&gt;second_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;?php
+    if ($as_json) {
+        echo json_encode(array("page" =&gt; $page_title, "content" =&gt; ob_get_clean()));
+    } else {
+?&gt;
+&lt;/div&gt;
+
+&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;second_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;?php
+        include "include/after_content.php";
+        echo "&lt;/body&gt;\n&lt;/html&gt;";
+    }
+?&gt;
+</pre>
+</div>
+
+<p><strong>third_page.php</strong>:</p>
+
+<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
+<pre class="brush: php">&lt;?php
+    $page_title = "Third page";
+    $page_content = "&lt;p&gt;This is the content of &lt;strong&gt;third_page.php&lt;/strong&gt;. This content is stored into a php variable.&lt;/p&gt;";
+
+    if (isset($_GET["view_as"]) &amp;&amp; $_GET["view_as"] == "json") {
+        echo json_encode(array("page" =&gt; $page_title, "content" =&gt; $page_content));
+    } else {
+?&gt;
+&lt;!doctype html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;?php
+        include "include/header.php";
+        echo "&lt;title&gt;" . $page_title . "&lt;/title&gt;";
+?&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+&lt;?php include "include/before_content.php"; ?&gt;
+
+&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;third_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;div id="ajax-content"&gt;
+&lt;?php echo $page_content; ?&gt;
+&lt;/div&gt;
+
+&lt;p&gt;This paragraph is shown only when the navigation starts from &lt;strong&gt;third_page.php&lt;/strong&gt;.&lt;/p&gt;
+
+&lt;?php
+        include "include/after_content.php";
+        echo "&lt;/body&gt;\n&lt;/html&gt;";
+    }
+?&gt;
+</pre>
+</div>
+
+<p><strong>css/style.css</strong>:</p>
+
+<pre class="brush: css">#ajax-loader {
+    position: fixed;
+    display: table;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+
+#ajax-loader &gt; div {
+    display: table-cell;
+    width: 100%;
+    height: 100%;
+    vertical-align: middle;
+    text-align: center;
+    background-color: #000000;
+    opacity: 0.65;
+}
+</pre>
+
+<p><strong>include/after_content.php</strong>:</p>
+
+<pre class="brush: php">&lt;p&gt;This is the footer. It is shared between all ajax pages.&lt;/p&gt;
+</pre>
+
+<p><strong>include/before_content.php</strong>:</p>
+
+<pre class="brush: php">&lt;p&gt;
+[ &lt;a class="ajax-nav" href="first_page.php"&gt;First example&lt;/a&gt;
+| &lt;a class="ajax-nav" href="second_page.php"&gt;Second example&lt;/a&gt;
+| &lt;a class="ajax-nav" href="third_page.php"&gt;Third example&lt;/a&gt;
+| &lt;a class="ajax-nav" href="unexisting.php"&gt;Unexisting page&lt;/a&gt; ]
+&lt;/p&gt;
+
+</pre>
+
+<p><strong>include/header.php</strong>:</p>
+
+<pre class="brush: php">&lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
+&lt;script type="text/javascript" src="js/ajax_nav.js"&gt;&lt;/script&gt;
+&lt;link rel="stylesheet" href="css/style.css" /&gt;
+</pre>
+
+<p><strong>js/ajax_nav.js</strong>:</p>
+
+<p>(before implementing it in a working environment, <strong>please read <a href="#const_compatibility" title="Note about *const* compatibility">the note about the const statement compatibility</a></strong>)</p>
+
+<div style="height: 400px; margin-bottom: 12px; overflow: auto;">
+<pre class="brush: js">"use strict";
+
+const ajaxRequest = new (function () {
+
+    function closeReq () {
+        oLoadingBox.parentNode &amp;&amp; document.body.removeChild(oLoadingBox);
+        bIsLoading = false;
+    }
+
+    function abortReq () {
+        if (!bIsLoading) { return; }
+        oReq.abort();
+        closeReq();
+    }
+
+    function ajaxError () {
+        alert("Unknown error.");
+    }
+
+    function ajaxLoad () {
+        var vMsg, nStatus = this.status;
+        switch (nStatus) {
+            case 200:
+                vMsg = JSON.parse(this.responseText);
+                document.title = oPageInfo.title = vMsg.page;
+                document.getElementById(sTargetId).innerHTML = vMsg.content;
+                if (bUpdateURL) {
+                    history.pushState(oPageInfo, oPageInfo.title, oPageInfo.url);
+                    bUpdateURL = false;
+                }
+                break;
+            default:
+                vMsg = nStatus + ": " + (oHTTPStatus[nStatus] || "Unknown");
+                switch (Math.floor(nStatus / 100)) {
+                    /*
+                    case 1:
+                        // Informational 1xx
+                        console.log("Information code " + vMsg);
+                        break;
+                    case 2:
+                        // Successful 2xx
+                        console.log("Successful code " + vMsg);
+                        break;
+                    case 3:
+                        // Redirection 3xx
+                        console.log("Redirection code " + vMsg);
+                        break;
+                    */
+                    case 4:
+                        /* Client Error 4xx */
+                        alert("Client Error #" + vMsg);
+                        break;
+                    case 5:
+                        /* Server Error 5xx */
+                        alert("Server Error #" + vMsg);
+                        break;
+                    default:
+                        /* Unknown status */
+                        ajaxError();
+                }
+        }
+        closeReq();
+    }
+
+    function filterURL (sURL, sViewMode) {
+        return sURL.replace(rSearch, "") + ("?" + sURL.replace(rHost, "&amp;").replace(rView, sViewMode ? "&amp;" + sViewKey + "=" + sViewMode : "").slice(1)).replace(rEndQstMark, "");
+    }
+
+    function getPage (sPage) {
+        if (bIsLoading) { return; }
+        oReq = new XMLHttpRequest();
+        bIsLoading = true;
+        oReq.onload = ajaxLoad;
+        oReq.onerror = ajaxError;
+        if (sPage) { oPageInfo.url = filterURL(sPage, null); }
+        oReq.open("get", filterURL(oPageInfo.url, "json"), true);
+        oReq.send();
+        oLoadingBox.parentNode || document.body.appendChild(oLoadingBox);
+    }
+
+    function requestPage (sURL) {
+        if (history.pushState) {
+            bUpdateURL = true;
+            getPage(sURL);
+        } else {
+            /* Ajax navigation is not supported */
+            location.assign(sURL);
+        }
+    }
+
+    function processLink () {
+        if (this.className === sAjaxClass) {
+            requestPage(this.href);
+            return false;
+        }
+        return true;
+    }
+
+    function init () {
+        oPageInfo.title = document.title;
+        for (var oLink, nIdx = 0, nLen = document.links.length; nIdx &lt; nLen; document.links[nIdx++].onclick = processLink);
+    }
+
+    const
+
+        /* customizable constants */
+        sTargetId = "ajax-content", sViewKey = "view_as", sAjaxClass = "ajax-nav",
+
+        /* not customizable constants */
+        rSearch = /\?.*$/, rHost = /^[^\?]*\?*&amp;*/, rView = new RegExp("&amp;" + sViewKey + "\\=[^&amp;]*|&amp;*$", "i"), rEndQstMark = /\?$/,
+        oLoadingBox = document.createElement("div"), oCover = document.createElement("div"), oLoadingImg = new Image(),
+        oPageInfo = {
+            title: null,
+            url: location.href
+        }, oHTTPStatus = /* http://www.iana.org/assignments/http-status-codes/http-status-codes.xml */ {
+            100: "Continue",
+            101: "Switching Protocols",
+            102: "Processing",
+            200: "OK",
+            201: "Created",
+            202: "Accepted",
+            203: "Non-Authoritative Information",
+            204: "No Content",
+            205: "Reset Content",
+            206: "Partial Content",
+            207: "Multi-Status",
+            208: "Already Reported",
+            226: "IM Used",
+            300: "Multiple Choices",
+            301: "Moved Permanently",
+            302: "Found",
+            303: "See Other",
+            304: "Not Modified",
+            305: "Use Proxy",
+            306: "Reserved",
+            307: "Temporary Redirect",
+            308: "Permanent Redirect",
+            400: "Bad Request",
+            401: "Unauthorized",
+            402: "Payment Required",
+            403: "Forbidden",
+            404: "Not Found",
+            405: "Method Not Allowed",
+            406: "Not Acceptable",
+            407: "Proxy Authentication Required",
+            408: "Request Timeout",
+            409: "Conflict",
+            410: "Gone",
+            411: "Length Required",
+            412: "Precondition Failed",
+            413: "Request Entity Too Large",
+            414: "Request-URI Too Long",
+            415: "Unsupported Media Type",
+            416: "Requested Range Not Satisfiable",
+            417: "Expectation Failed",
+            422: "Unprocessable Entity",
+            423: "Locked",
+            424: "Failed Dependency",
+            425: "Unassigned",
+            426: "Upgrade Required",
+            427: "Unassigned",
+            428: "Precondition Required",
+            429: "Too Many Requests",
+            430: "Unassigned",
+            431: "Request Header Fields Too Large",
+            500: "Internal Server Error",
+            501: "Not Implemented",
+            502: "Bad Gateway",
+            503: "Service Unavailable",
+            504: "Gateway Timeout",
+            505: "HTTP Version Not Supported",
+            506: "Variant Also Negotiates (Experimental)",
+            507: "Insufficient Storage",
+            508: "Loop Detected",
+            509: "Unassigned",
+            510: "Not Extended",
+            511: "Network Authentication Required"
+        };
+
+    var
+
+        oReq, bIsLoading = false, bUpdateURL = false;
+
+    oLoadingBox.id = "ajax-loader";
+    oCover.onclick = abortReq;
+    oLoadingImg.src = "data:image/gif;base64,R0lGODlhEAAQAPIAAP///wAAAMLCwkJCQgAAAGJiYoKCgpKSkiH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAADMwi63P4wyklrE2MIOggZnAdOmGYJRbExwroUmcG2LmDEwnHQLVsYOd2mBzkYDAdKa+dIAAAh+QQJCgAAACwAAAAAEAAQAAADNAi63P5OjCEgG4QMu7DmikRxQlFUYDEZIGBMRVsaqHwctXXf7WEYB4Ag1xjihkMZsiUkKhIAIfkECQoAAAAsAAAAABAAEAAAAzYIujIjK8pByJDMlFYvBoVjHA70GU7xSUJhmKtwHPAKzLO9HMaoKwJZ7Rf8AYPDDzKpZBqfvwQAIfkECQoAAAAsAAAAABAAEAAAAzMIumIlK8oyhpHsnFZfhYumCYUhDAQxRIdhHBGqRoKw0R8DYlJd8z0fMDgsGo/IpHI5TAAAIfkECQoAAAAsAAAAABAAEAAAAzIIunInK0rnZBTwGPNMgQwmdsNgXGJUlIWEuR5oWUIpz8pAEAMe6TwfwyYsGo/IpFKSAAAh+QQJCgAAACwAAAAAEAAQAAADMwi6IMKQORfjdOe82p4wGccc4CEuQradylesojEMBgsUc2G7sDX3lQGBMLAJibufbSlKAAAh+QQJCgAAACwAAAAAEAAQAAADMgi63P7wCRHZnFVdmgHu2nFwlWCI3WGc3TSWhUFGxTAUkGCbtgENBMJAEJsxgMLWzpEAACH5BAkKAAAALAAAAAAQABAAAAMyCLrc/jDKSatlQtScKdceCAjDII7HcQ4EMTCpyrCuUBjCYRgHVtqlAiB1YhiCnlsRkAAAOwAAAAAAAAAAAA==";
+    oCover.appendChild(oLoadingImg);
+    oLoadingBox.appendChild(oCover);
+
+    onpopstate = function (oEvent) {
+        bUpdateURL = false;
+        oPageInfo.title = oEvent.state.title;
+        oPageInfo.url = oEvent.state.url;
+        getPage();
+    };
+
+    window.addEventListener ? addEventListener("load", init, false) : window.attachEvent ? attachEvent("onload", init) : (onload = init);
+
+    // Public methods
+
+    this.open = requestPage;
+    this.stop = abortReq;
+    this.rebuildLinks = init;
+
+})();
+</pre>
+</div>
+
+<div class="note" id="const_compatibility"><strong>Note:</strong> The current implementation of <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> (constant statement) <strong>is not part of ECMAScript 5</strong>. It is supported in Firefox &amp; Chrome (V8) and partially supported in Opera 9+ and Safari. <strong>It is not supported in Internet Explorer 6-9, or in the preview of Internet Explorer 10</strong>. <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> is going to be defined by ECMAScript 6, but with different semantics. Similar to variables declared with the <a href="/en/JavaScript/Reference/Statements/let" title="en/JavaScript/Reference/Statements/let"><code>let</code></a> statement, constants declared with <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> will be block-scoped. <strong>We used it only for didactic purpose. If you want a full browser compatibility of this library, please replace all the <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> statements with the <a href="/en/JavaScript/Reference/Statements/var" title="en/JavaScript/Reference/Statements/var"><code>var</code></a> statements.</strong></div>
+
+<p>For more information, please see: <a href="/en-US/docs/DOM/Manipulating_the_browser_history" title="/en-US/docs/DOM/Manipulating_the_browser_history">Manipulating the browser history</a>.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{ domxref("window.history") }}</li>
+ <li>{{ domxref("window.onpopstate") }}</li>
+</ul>
diff --git a/files/es/web/api/history_api/index.html b/files/es/web/api/history_api/index.html
new file mode 100644
index 0000000000..b5efd6ae1b
--- /dev/null
+++ b/files/es/web/api/history_api/index.html
@@ -0,0 +1,229 @@
+---
+title: Manipulando el historial del navegador
+slug: Web/API/History_API
+tags:
+  - HTML5
+  - historial
+  - para_revisar
+translation_of: Web/API/History_API
+original_slug: DOM/Manipulando_el_historial_del_navegador
+---
+<p>El objeto DOM {{ domxref("window") }} proporciona acceso al historial del navegador a través del objeto {{ domxref("window.history", "history") }} . Este da acceso a métodos y propiedades útiles que permiten avanzar y retroceder a través del historial del usuario, así como --a partir de HTML5-- manipular el contenido del historial.</p>
+
+<h2 id="Viajando_a_través_del_historial">Viajando a través del historial</h2>
+
+<p>Retroceder y avanzar a través del historial del usuario utilizando los métodos <code>back()</code>, <code>forward()</code> y <code>go()</code>.</p>
+
+<h3 id="Moviéndose_hacia_adelante_y_hacia_atrás">Moviéndose hacia adelante y hacia atrás</h3>
+
+<p>Para moverte hacia atrás, solo debes hacer:</p>
+
+<pre>window.history.back();
+</pre>
+
+<p>Esto actuará exactamente como si el usuario hiciera clic en el botón "atrás" en la barra de herramientas del navegador.</p>
+
+<p>De manera similar, puedes moverte hacia adelante (como si el usuario hiciera clic en en el botón "adelante"), de esta forma:</p>
+
+<pre>window.history.forward();
+</pre>
+
+<h3 id="Moverse_a_un_punto_específico_del_historial">Moverse a un punto específico del historial</h3>
+
+<p>Puedes usar el método <code>go()</code> para cargar una página desde el historial de la sesión, identificada por su poscición relativa a la página actual  (Siendo la página actual, por supuesto, relativa al índice 0).</p>
+
+<p>Para moverse atrás una página (equivalente a llamar <code>back()</code>):</p>
+
+<pre><code>window.history.go(-1);</code>
+</pre>
+
+<p>Para moverse una página hacia adelante, como si se llamara a <code>forward()</code>:</p>
+
+<pre><code>window.history.go(1);</code>
+</pre>
+
+<p>De manera similar, puedes avanzar 2 páginas pasando 2 y así sucesivamente.</p>
+
+<p>Otro uso para <code>go()</code> es el de actualizar la página ya sea pasando <code>0</code> como parámetro o ninguno.</p>
+
+<pre><code>// Cada una de las siguientes
+// instrucciones actualiza la página
+window.history.go(0);
+window.history.go();</code></pre>
+
+<p>Puedes obtener el número de páginas en la pila del historial consultando el valor de la propiedad <span class="long_text" id="result_box" lang="es"><span title=""><code>length</code>:</span></span></p>
+
+<pre>var numeroDeEntradas = window.history.length;
+</pre>
+
+<div class="note"><strong>Nota:</strong> Internet Explorer admite el paso de cadenas de URL como parámetro para <code>go()</code>; esto no es estándar y no está implementado en Gecko.</div>
+
+<h2 id="Añadiendo_y_modificando_entradas_del_historial">Añadiendo y modificando entradas del historial</h2>
+
+<p>{{ gecko_minversion_header("2") }}</p>
+
+<p>HTML5 introduce los métodos <code>history.pushState()</code> y <code>history.replaceState()</code>, los cuales te permiten añadir y modificar entradas del historial, respectivamente. Estos métodos trabajan en conjunto con el evento {{ domxref("window.onpopstate") }}.</p>
+
+<p>Hacer uso de <code>history.pushState()</code> cambia el referer que es utilizado en la cabecera HTTP por los objetos <a href="/es/docs/XMLHttpRequest">XMLHttpRequest</a> que hayan sido creados luego de cambiar el estado. El referer utilizará la URL del documento cuyo objeto window sea <code>this</code> al momento de la creación del objeto <a href="/es/docs/XMLHttpRequest">XMLHttpRequest</a>.</p>
+
+<h3 id="Ejemplo">Ejemplo</h3>
+
+<p>Supongamos que <span class="nowiki">http://mozilla.org/foo.html</span> ejecuta el siguiente JavaScript:</p>
+
+<pre>var stateObj = { foo: "bar" };
+history.pushState(stateObj, "page 2", "bar.html");
+</pre>
+
+<p>Esto causará que la barra de URL muestre <span class="nowiki">http://mozilla.org/bar.html</span>, pero no provocará que el navegador carge bar.html ni tampoco que verifique si bar.html existe.</p>
+
+<p>Supongamos ahora que el usuario navega hacia <span class="nowiki">http://google.com</span>, y despúes hace clic en Atrás.  En este punto, la barra de URL mostrará <span class="nowiki">http://mozilla.org/bar.html</span>, y la página tendrá un evento <code>popstate</code> cuyo <em>state object</em> contiene una copia de <code>stateObj</code>. La página en si se verá como <code>foo.html</code>, aunque la página podria modificar su contenido durante el evento <code>popstate</code> event.</p>
+
+<p>Si hacemos clic en "atrás" nuevamente, la URL cambiará a <span class="nowiki">http://mozilla.org/foo.html</span>, y el documento generará otro evento <code>popstate</code> event, esta vez con un state object nulo. Aquí también, ir atrás no cambia el contenido del documento con respecto al paso anterior, aunque el documento permite actualizar su contenido manualmente después de recibir el evento <code>popstate</code>.</p>
+
+<h3 id="El_método_pushState()">El método pushState()</h3>
+
+<p><code>pushState()</code> toma tres parámetros: un objeto estado, un título (el cual es normalmente ignorado) y (opcionalmente) una URL.  Vamos a examinar cada uno de estos tres parametros en más detalle:</p>
+
+<ul>
+ <li>
+  <p><strong>object estado</strong> —  El objeto estado es un objeto JavaScript el cual esta asociado con la nueva entrada al historial creada por <code>pushState()</code>. Cada vez que el usuario navega hacia un nuevo estado, un evento <code>popstate</code> event se dispara, y la propiedad <code>state</code> del evento contiene una copia del historial de entradas del objeto estado.</p>
+
+  <p>El objeto estado puede ser cualquier cosa que puedas pasar a <code>JSON.stringify</code>. Dado que Firefox guarda los objetos estado en el disco del usuario para que puedan ser restaurados después de que el usuario reinicie su navegador, se ha impuesto  un tamaño límite de 640K caracteres en representación JSON de un objeto estado. Si pasas un objeto estado cuya representación es más larga que esto a <code>pushState()</code>, el método arrojará una excepción. Si necesitas más espacio, se recomienda usar <code>sessionStorage</code> y/o <code>localStorage</code>.</p>
+ </li>
+ <li>
+  <p><strong>título</strong> — Firefox actualmente ignora este parámetro, aunque podría usarse en el futuro. Pasar una cadena de caracteres vacia aquí podría asegurar estar a salvo de futuros cambios en este método. Alternativamente podrías pasar un título corto del estado hacia el cual te estás moviendo.</p>
+ </li>
+ <li>
+  <p><strong>URL</strong> — La URL de la nueva entrada al  historial está dada por este parámetro. Recuerda que el browser no intentará cargar esta URL después de llamar a <code>pushState()</code>,  <span class="long_text" id="result_box" lang="es"><span title="">pero podría intentar cargar la URL más tarde, por ejemplo, después de que el usuario reinicie su navegador</span></span>. La nueva URL no necesita ser absoluta; si es relativa, es resuelta relativamente a la actual URL.  La nueva URL debe ser del mismo origen que la actual URL. Si no es así, <code>pushState()</code> arrojará una excepción. Este parámetro es opcional; <span class="long_text" id="result_box" lang="es"><span title="">si no se especifica, se tomará la URL actual del documento.</span></span></p>
+ </li>
+</ul>
+
+<p>En un sentido, llamar <code>pushState()</code> es similar a asignar <code>window.location = "#foo"</code>, <span class="long_text" id="result_box" lang="es"><span title="">en tanto que también se va a crear y activar otra entrada al historial asociada con el documento actual</span></span>. Pero <code>pushState()</code> tiene las siguientes ventajas:</p>
+
+<ul>
+ <li>La nueva URL puede ser cualquier URL en el mismo origen de la actual URL. En contraste, asignar <code>window.location</code> te mantiene en el mismo {{ domxref("document") }} solamente si modificas unicamente el hash.</li>
+ <li>No hay por qué cambiar la URL si no se desea. Por el contrario, asignar <code>window.location = "#foo"; solamente crea una nueva entrada en el historial si el hash actual no es </code><code>#foo</code>.</li>
+ <li>Puedes asociar datos arbitrarios con tu nuevo historial de entrada. Con el enfoque hash-based, tu necesitas codificar todos datos relevantes dentro de una cadena de caracteres corta.</li>
+ <li>Si <code>title</code> es utilizado por los navegadores, estos datos pueden utilizarse (independientemente de, por ejemplo, el hash).</li>
+</ul>
+
+<p>Hay que tener en cuenta que <code>pushState()</code> nunca dispara un evento <code>hashchange</code>, incluso si la nueva URL difiere de la antigua URL únicamente en su hash.</p>
+
+<p>En un documento XUL, crea el elemento XUL específico.</p>
+
+<p>En otros documentos, crea un elemento con un namespace de URI nulo (<code>null</code>).</p>
+
+<h3 id="El_método_replaceState()">El método replaceState()</h3>
+
+<p><code>history.replaceState()</code> trabaja exactamente igual a <code>history.pushState()</code> excepto que <code>replaceState()</code> modifica la entrada al historial actual en lugar de crear una nueva.</p>
+
+<p><code>replaceState()</code> es particularmente útil si deseas actualizar el objeto estado o la URL del la actual entrada al historial en respuesta a alguna acción del usuario.</p>
+
+<h3 id="El_evento_popstate">El evento popstate</h3>
+
+<p>Un evento <code>popstate</code> es dirigido a la ventana cada vez que la entrada al historial cambia. Si la entrada al historial es activada y fue creada por un llamado a <code>pushState</code> o afectada por una llamada a <code>replaceState</code>, la propiedad state del evento <code>popstate</code> contiene una copia del historial de entradas del objeto estado.</p>
+
+<p>Ver {{ domxref("window.onpopstate") }} para un ejemplo de uso.</p>
+
+<h3 id="Leyendo_el_estado_actual">Leyendo el estado actual</h3>
+
+<p>Cuando la página carga, debería tener un objeto de estado no nulo. Esto podría ocurrir, por ejemplo, si la página establece un object de estado (usando <code>pushState()</code> o <code>replaceState()</code>) y entonces el usuario reinicia su navegador. Cuando la página carga de nuevo, la página recibirá el evento onload, pero no el evento popstate.  Sin embargo, si lees la propiedad history.state, obtendrás el objeto estado que habrías tenido si se hubiera lanzado el evento apopstate.</p>
+
+<p>Puedes leer el estado del historial actual sin tener que esperar un evento <code>popstate</code> usando la propiedad  <code>history.state</code> de esta manera:</p>
+
+<pre><code>var currentState = history.state;</code></pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Para un ejemplo completo de un sitio AJAX, ver: <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history/Example" title="/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history/Example">Ejemplo de navegación AJAX</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado </th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "browsers.html#history", "History")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No hay cambios desde {{SpecName("HTML5 W3C")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "browsers.html#history", "History")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>replaceState, pushState</td>
+   <td>5</td>
+   <td>{{ CompatGeckoDesktop("2.0") }}</td>
+   <td>10</td>
+   <td>11.50</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>history.state</td>
+   <td>18</td>
+   <td>{{ CompatGeckoDesktop("2.0") }}</td>
+   <td>10</td>
+   <td>11.50</td>
+   <td>6.0</td>
+  </tr>
+ </tbody>
+</table>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>replaceState, pushState</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>history.state</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{ domxref("window.history") }}</li>
+ <li>{{ domxref("window.onpopstate") }}</li>
+</ul>
diff --git a/files/es/web/api/html_drag_and_drop_api/file_drag_and_drop/index.html b/files/es/web/api/html_drag_and_drop_api/file_drag_and_drop/index.html
new file mode 100644
index 0000000000..0e4cc870ed
--- /dev/null
+++ b/files/es/web/api/html_drag_and_drop_api/file_drag_and_drop/index.html
@@ -0,0 +1,118 @@
+---
+title: Drag & Drop archivo
+slug: Web/API/HTML_Drag_and_Drop_API/File_drag_and_drop
+tags:
+  - Guía
+  - arrastra y suelta
+  - drag and drop
+  - drop zone
+  - zona de arrastre
+translation_of: Web/API/HTML_Drag_and_Drop_API/File_drag_and_drop
+original_slug: DragDrop/Drag_and_Drop/drag_and_drop_archivo
+---
+<p>{{DefaultAPISidebar("HTML Drag and Drop API")}}</p>
+
+<p>Las interfaces Drag-and-Drop posibilitan arrastrar y soltar archivos en una página web. En este documento se describe cómo una aplicación puede aceptar uno, o más, archivos que son arrastrados desde el <em>explorador de archivos </em>de la plataforma y soltados en una página web.</p>
+
+<p>Los pasos principales para configurar Drag-and-drop son: 1) definir una "zona drop (<em>drop zone), </em>es decir, definir un elemento donde se podrá soltar el archivo; y 2) definir funciones para la gestión de los eventos {{event("drop")}} y {{event("dragover")}}. Estos pasos se describen a continuación, tambien se incluyen ejemplos snippets de código. El código fuente completo está disponible en el <a href="https://github.com/mdn/dom-examples/tree/master/drag-and-drop">repositorio drag-and-drop de MDN</a> (cualquier sugerencia o  tema que revisar es bienvenido).</p>
+
+<p class="note">Nota: {{domxref("HTML_Drag_and_Drop_API","HTML drag and drop")}} define 2 diferentes APIs para soportar drag and drop de archivos. Una API es la interfaz {{domxref("DataTransfer")}} y la segunda API son las interfaces {{domxref("DataTransferItem")}} y {{domxref("DataTransferItemList")}}.  Este ejemplo ilustra el uso de ambas APIs (y no usa ninguna interfaz específica de Gecko).</p>
+
+<h2 id="Define_la_zona_drop_drop_zone">Define la zona "drop" [drop <em>zone</em>]</h2>
+
+<p>Es necesario configurar un evento {{event("drop")}} en el objeto sobre el cual se soltará el objeto arrastrado. Este evento llamará una función global {{domxref("GlobalEventHandlers.ondrop","ondrop")}} que recibe los datos del objeto arrastrado. El siguiente código muestra cómo se hace con un elemento {{HTMLelement("div")}}:</p>
+
+<pre class="brush: html notranslate">&lt;div id="drop_zone" ondrop="dropHandler(event);"&gt;
+  &lt;p&gt;Arrastra y suelta uno o más archivos a esta zona ...&lt;/p&gt;
+&lt;/div&gt;</pre>
+
+<p>Normalmente, una aplicación incluirá una función de gestión de eventos {{event("dragover")}} en el elemento objetivo del arrastre y esa función desactivará el comportamiento de arrastre por defecto del browser. Para añadir esta función necesita incluir una función global {{domxref("GlobalEventHandlers.ondragover","ondragover")}}:</p>
+
+<pre class="brush: html notranslate">&lt;div id="drop_zone" ondrop="dropHandler(event);" ondragover="dragOverHandler(event);"&gt;
+  &lt;p&gt;Arrastra y suelta uno o más archivos a esta zona ...&lt;/p&gt;
+&lt;/div&gt;
+</pre>
+
+<p>Por último, puede que una aplicación quiera personalizar el estilo del elemento objetivo del arrastre para indicar visualmente que es una zona drag and drop. En este ejemplo, el elemento objetivo usa el siguiente estilo:</p>
+
+<pre class="brush: css notranslate">#drop_zone {
+  border: 5px solid blue;
+  width:  200px;
+  height: 100px;
+}
+</pre>
+
+<div class="note">
+<p>Fíjese que los eventos <code>dragstart</code> y <code>dragend</code> no son activados cuando se arrastra un archivo al browser desde el SO.</p>
+</div>
+
+<h2 id="Procesar_la_acción_de_soltar_drop">Procesar la acción de soltar [drop]</h2>
+
+<p>El evento {{event("drop")}} se ejecuta cuando el usuario suelta el o los archivos. En el siguiente manejador, si el navegador sorporta la interfaz {{domxref("DataTransferItemList")}} , el método {{domxref("DataTransferItem.getAsFile","getAsFile()")}} se utiliza para acceder cada fichero; de lo contrario la propiedad {{domxref("DataTransfer")}} de la interfaz {{domxref("DataTransfer.files","files")}} es usada para acceder cada archivo.</p>
+
+<p>El ejemplo siguiente muestra como escribir el nombre de cada fichero arrastrado en la consola. En una aplicación <em>real</em>, se querrá procesar un archivo usando {{domxref("File","File API")}}.</p>
+
+<p>Nótese que en este ejemplo, cualquier item arrastrado que no sea un archivo es ignorado.</p>
+
+<pre class="brush: js notranslate">function dropHandler(ev) {
+  console.log('Fichero(s) arrastrados');
+
+  // Evitar el comportamiendo por defecto (Evitar que el fichero se abra/ejecute)
+  ev.preventDefault();
+
+  if (ev.dataTransfer.items) {
+    // Usar la interfaz DataTransferItemList para acceder a el/los archivos)
+    for (var i = 0; i &lt; ev.dataTransfer.items.length; i++) {
+      // Si los elementos arrastrados no son ficheros, rechazarlos
+      if (ev.dataTransfer.items[i].kind === 'file') {
+        var file = ev.dataTransfer.items[i].getAsFile();
+        console.log('... file[' + i + '].name = ' + file.name);
+      }
+    }
+  } else {
+    // Usar la interfaz DataTransfer para acceder a el/los archivos
+    for (var i = 0; i &lt; ev.dataTransfer.files.length; i++) {
+      console.log('... file[' + i + '].name = ' + ev.dataTransfer.files[i].name);
+    }
+  }
+
+  // Pasar el evento a removeDragData para limpiar
+  removeDragData(ev)
+}</pre>
+
+<h2 id="Prevenir_el_comportamiento_default_de_arrastrado_en_el_browser">Prevenir el comportamiento default de arrastrado en el browser </h2>
+
+<p>El siguiente evento {{event("dragover")}} llama a  {{domxref("Event.preventDefault","preventDefault()")}} para deshabilitar (turn off) la respuesta estandar drag-and-drop del browser.</p>
+
+<pre class="brush: js notranslate">function dragOverHandler(ev) {
+  console.log('File(s) in drop zone');
+
+  // Prevent default behavior (Prevent file from being opened)
+  ev.preventDefault();
+}
+</pre>
+
+<h2 id="Limpieza_Cleanup">Limpieza (Cleanup)</h2>
+
+<p>Typically, an application may want to perform some cleanup by deleting the file drag data. In this example, the drop event is passed along from drop handler to a custom function called removeDragData. If the browser supports the {{domxref("DataTransferItemList")}} interface, the list's {{domxref("DataTransferItemList.clear","clear()")}} method is used to delete the file drag data; otherwise the {{domxref("DataTransfer")}} object's {{domxref("DataTransfer.clearData","clearData()")}} method is used to delete the data.</p>
+
+<pre class="brush: js notranslate">function removeDragData(ev) {
+  console.log('Removing drag data')
+
+  if (ev.dataTransfer.items) {
+    // Use DataTransferItemList interface to remove the drag data
+    ev.dataTransfer.items.clear();
+  } else {
+    // Use DataTransfer interface to remove the drag data
+    ev.dataTransfer.clearData();
+  }
+}
+</pre>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/HTML_Drag_and_Drop_API">HTML Drag and Drop API</a></li>
+ <li><a class="internal" href="/Web/Guide/HTML/Drag_operations" title="Drag Operations">Drag Operations</a></li>
+ <li><a href="https://html.spec.whatwg.org/multipage/interaction.html#dnd" title="Drag and Drop Standard">HTML5 Living Standard: Drag and Drop</a></li>
+</ul>
diff --git a/files/es/web/api/html_drag_and_drop_api/index.html b/files/es/web/api/html_drag_and_drop_api/index.html
new file mode 100644
index 0000000000..c40c43a5bb
--- /dev/null
+++ b/files/es/web/api/html_drag_and_drop_api/index.html
@@ -0,0 +1,58 @@
+---
+title: Arrastrar y soltar
+slug: Web/API/HTML_Drag_and_Drop_API
+tags:
+  - HTML5
+  - XUL
+translation_of: Web/API/HTML_Drag_and_Drop_API
+original_slug: DragDrop/Drag_and_Drop
+---
+<p>Firefox y otras aplicaciones de Mozilla admiten una serie de características para gestionar la funcionalidad de arrastrar y soltar. Esto le permite al usuario hacer clic y mantener presionado el botón del ratón/mouse sobre un elemento, arrastrarlo a otra ubicación y soltarlo para colocar el elemento allí. Al puntero le seguirá una representación transparente de lo que se está arrastrando durante la operación. La ubicación de destino puede ser una aplicación diferente. Sitios web, extensiones y aplicaciones XUL pueden hacer uso de esta funcionalidad para personalizar los elementos que pueden ser arrastrados, evaluar la operación, así como especificar el lugar donde los elementos se pueden soltar.</p>
+<div class="note"> Esta sección trata sobre la funcionalidad de arrastrar y soltar en Firefox 3.5 (Gecko 1.9.1) y versiones posteriores. Consulta la <a href="/en-US/docs/Drag_and_Drop" title="/en-US/docs/Drag_and_Drop">documentación de la API anterior</a> para Firefox 3.0 y versiones anteriores.</div>
+
+
+<h2 id="Elementos_básicos_de_arrastrar_y_soltar">Elementos básicos de arrastrar y soltar</h2>
+<p>Cuando comienza una operación de arrastre, se puede proporcionar una serie de datos:</p>
+<ul>
+	<li>los datos que se van a arrastrar, que pueden ser de varios formatos diferentes. Por ejemplo, datos de texto que contienen una cadena de texto que se va a arrastrar. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragdata" title="/en-US/docs/DragDrop/Drag_Operations#dragdata">Datos de la operación de arrastre</a> .</li>
+	<li>la imagen de confirmación sobre la operación de arrastre que aparece junto al puntero durante la operación. Esta imagen puede personalizarse, sin embargo, la mayoría de las veces, no se especifica y se genera una imagen por defecto basándose en el elemento donde se ha pulsado el ratón/mouse. Para obtener más información acerca de estas imágenes, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragfeedback" title="/en-US/docs/DragDrop/Drag_Operations#dragfeedback">Configurar la imagen de confirmación sobre la operación de descarga</a> .</li>
+	<li>efectos de arrastre que se permiten. Son posibles tres efectos: <code>copy</code> para indicar que los datos que se arrastran se copiarán desde su ubicación actual a la ubicación de destino, <code>move</code> para indicar que los datos que se arrastran serán movidos y <code>link</code> para indicar que se creará algún tipo de relación o conexión entre la ubicación actual y la ubicación de destino. Durante la operación, se pueden modificar los efectos de arrastre y especificar cuáles en concreto se permiten en determinadas ubicaciones. Si se permite, se puede realizar una operación de colocación en esa ubicación. Consulta <a href="/en-US/docs/DragDrop/Drag_Operations#drageffects" title="/en-US/docs/DragDrop/Drag_Operations#drageffects">Efectos de arrastre</a> para obtener más detalles.</li>
+</ul>
+<p>Mozilla y Firefox admiten una serie de características que no se encuentran en el modelo estándar de arrastrar y soltar. Estas te permiten arrastrar elementos múltiples y arrastrar datos que no son cadenas. Para obtener más información, consulta <a href="/en-US/docs/DragDrop/Dragging_and_Dropping_Multiple_Items" title="/en-US/docs/DragDrop/Dragging_and_Dropping_Multiple_Items">Arrastrar y soltar múltiples elementos</a> .</p>
+<p>Para obtener una lista de tipos de datos comunes utilizados para arrastrar y soltar, consulta <a href="/en-US/docs/DragDrop/Recommended_Drag_Types" title="/en-US/docs/DragDrop/Recommended_Drag_Types">Tipos de operaciones de arrastre recomendados</a>.</p>
+<p>Está disponible una referencia rápida para los procedimientos recomendados en la operación de arrastre de los siguientes tipos de elementos:</p>
+<ul>
+	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#text" title="/en-US/docs/DragDrop/Recommended_Drag_Types#text">Texto</a></li>
+	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#link" title="/en-US/docs/DragDrop/Recommended_Drag_Types#link">Enlaces</a></li>
+	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#html" title="/en-US/docs/DragDrop/Recommended_Drag_Types#html">HTML y XML</a></li>
+	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#file" title="/en-US/docs/DragDrop/Recommended_Drag_Types#file">Archivos</a></li>
+	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#image" title="/en-US/docs/DragDrop/Recommended_Drag_Types#image">Imágenes</a></li>
+	<li><a href="/en-US/docs/DragDrop/Recommended_Drag_Types#node" title="/en-US/docs/DragDrop/Recommended_Drag_Types#node">Nodos de documento</a></li>
+</ul>
+<p>Consulta <a href="/en-US/docs/DragDrop/DataTransfer" title="/en-US/docs/DragDrop/DataTransfer">DataTransfer</a> para tener una referencia al objeto DataTransfer.</p>
+
+
+<h2 id="events" name="events">Eventos de arrastre</h2>
+<p>Se utilizan una serie de eventos que se ejecutan durante las diversas etapas de la operación de arrastre y colocación. Ten en cuenta que se ejecutan sólo los eventos de arrastre, los eventos del ratón/mouse como <code>mousemove</code> no se ejecutan durante una operación de arrastre.</p>
+<p>La propiedad <a href="/en-US/docs/DragDrop/DataTransfer" title="/en-US/docs/DragDrop/DataTransfer">dataTransfer</a> de todos los eventos de arrastre contiene datos sobre la operación de arrastre y colocación.</p>
+
+
+<dl>
+	<dt>dragstart</dt>
+	<dd>Se ejecuta sobre un elemento cuando se inicia una operación de arrastre. El usuario está solicitando arrastrar el elemento al que dispara el evento dragstart. Durante este evento, un proceso de escucha ajustará cierto tipo de información como los datos de la operación de arrastre y la imagen que se asocia con ella. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragstart" title="/en-US/docs/DragDrop/Drag_Operations#dragstart">Inicio de una operación de arrastre</a> .</dd>
+	<dt>dragenter</dt>
+	<dd>Se dispara cuando el ratón/mouse se mueve primero sobre un elemento, mientras está teniendo lugar una operación de arrastre. Un proceso de escucha de este evento debe indicar si se permite una operación de arrastre sobre esta ubicación. Si no hay procesos de escucha o éstos no realizan ninguna operación, entonces no se permite, de manera predeterminada, una operación de arrastre. Este es también el evento al que escuchar si deseas proporcionar información acerca de que se permite una operación de arrastre, como, por ejemplo, mostrar un resaltado o un marcador de inserción. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#droptargets" title="/en-US/docs/DragDrop/Drag_Operations#droptargets">Especificación de destinos de colocación</a> .</dd>
+	<dt>dragover</dt>
+	<dd>Este evento se activa cuando el ratón/mouse se mueve sobre un elemento cuando está teniendo lugar una operación de arrastre. Gran parte del tiempo, la operación que tiene lugar durante un proceso de escucha será la misma que el evento dragenter. Para obtener más información al respecto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#droptargets" title="/en-US/docs/DragDrop/Drag_Operations#droptargets">Especificación de destinos de colocación</a>.</dd>
+	<dt>dragleave</dt>
+	<dd>Este evento se activa cuando el ratón/mouse sale de un elemento mientras que está teniendo lugar una operación de arrastre. Los procesos de escucha deben eliminar cualquier resaltado o marcador de inserción que usan para la información sobre el proceso de arrastre.</dd>
+	<dt>drag</dt>
+	<dd>Este evento se activa en el origen del arrastre, es decir, el elemento donde dragstart fue disparado, durante la operación de arrastre.</dd>
+	<dt>drop</dt>
+	<dd>El evento se dispara sobre el elemento en el que se produjo la colocación al finalizar la operación de arrastre. Un proceso de escucha se encargará de recuperar los datos que se arrastran e insertarlos en la ubicación de la colocación. Este evento sólo se activará si se desea disponer de la funcionalidad de soltar. No se activará si el usuario cancela la operación de arrastre, por ejemplo, pulsando la tecla Escape, o si se liberó el botón del ratón/mouse mientras que éste no estaba sobre un destino de colocación válido. Para más información sobre esto, consulta <a href="/en-US/docs/DragDrop/Drag_Operations#drop" title="/en-US/docs/DragDrop/Drag_Operations#drop">Realizar una operación de colocación</a>.</dd>
+	<dt>dragend</dt>
+	<dd>El origen del arrastre recibirá un evento dragend cuando la operación se haya completado, tanto si tuvo éxito como si no. Consulta <a href="/en-US/docs/DragDrop/Drag_Operations#dragend" title="/en-US/docs/DragDrop/Drag_Operations#dragend">Finalizar una operación de arrastre</a> si deseas más información.</dd>
+</dl>
+
+
+<div>{{ HTML5ArticleTOC () }}</div>
diff --git a/files/es/web/api/html_drag_and_drop_api/recommended_drag_types/index.html b/files/es/web/api/html_drag_and_drop_api/recommended_drag_types/index.html
new file mode 100644
index 0000000000..84b04854fa
--- /dev/null
+++ b/files/es/web/api/html_drag_and_drop_api/recommended_drag_types/index.html
@@ -0,0 +1,145 @@
+---
+title: Tipos de Drag recomendados
+slug: Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types
+translation_of: Web/API/HTML_Drag_and_Drop_API/Recommended_drag_types
+original_slug: DragDrop/Recommended_Drag_Types
+---
+<p>A continuación se describe la mejor practica para utilizar los datos a ser arrastrado.</p>
+<h2 id="text" name="text">Arrastramdo Texto</h2>
+<p>Al arrastrar el texto, utilice el texto / texto normal. Los datos deben ser la cadena de arrastre. Por ejemplo:</p>
+<pre>event.dataTransfer.setData("text/plain", "This is text to drag")
+</pre>
+<p>Arrastrar texto en cuadros de texto y las selecciones de las páginas web se realiza de forma automática, por lo que no es necesario para manejar dragging.</p>
+<p><span style="line-height: 1.5;">Se recomienda que siempre se agrega datos del tipo  </span><code style="font-size: 14px;">text/plain</code><span style="line-height: 1.5;">  </span><span style="line-height: 1.5;">como un mensaje para las aplicaciones o los destinos que no soportan otros tipos, a menos que no hay alternativa de texto lógico. Siempre agregue el tipo de texto sin formato pasado, ya que es el menos específico.</span></p>
+<p><span style="line-height: 1.5;">En códigos más viejo, encontrara </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/unicode o </span>el tipo<span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;"> </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">Text.</span><span style="line-height: 1.5;">Estos equivalen </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/plain,</span><span style="line-height: 1.5;">que </span><span style="line-height: 1.5;">guardara y recibia los datos del texto plano en ese lugar</span><font face="Courier New, Andale Mono, monospace"><span style="line-height: normal;">.</span></font></p>
+<h2 id="link" name="link">Arrastrando Enlaces</h2>
+<p>Los enlaces deben incluir los datos de los dos tipos, el primero debe ser  URL utilizando el tipo <span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/uri-list,</span><span style="line-height: 1.5;">y el segundo es URL utilizando el tipo </span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/plain. </span><span style="line-height: 1.5;">Ambos tipos deben utilizar los mismos datos, la URL del enlace. Por ejemplo:</span></p>
+<pre>var dt = event.dataTransfer;
+dt.setData("text/uri-list", "http://www.mozilla.org");
+dt.setData("text/plain", "http://www.mozilla.org");
+</pre>
+<p>Es constumbre, establecer el tipo <span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">text/plain de ultimo, </span><span style="line-height: 1.5;">, ya que es menos específico que el tipo de URI.</span></p>
+<p>Note que el tipo de URL <span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">uri-list </span><span style="line-height: 1.5;">es con una "i", no una "L"</span></p>
+<p><span style="line-height: 1.5;">Note that the URL type is </span><code style="font-size: 14px;">uri-list</code><span style="line-height: 1.5;"> with an 'I', not with an 'L'.</span></p>
+<p>To drag multiple links, you can also separate each link with a linebreak. A line that begins with a number sign (#) is a comment and should not be considered a valid URL. You can use a comment to indicate the purpose of a link, or to hold the title associated with a link. The <code>text/plain</code> version of the drag data should include all links but should not include the comments.</p>
+<p>For example:</p>
+<pre>http://www.mozilla.org
+#A second link
+http://www.xulplanet.com
+</pre>
+<p>This sample <code>text/uri-list</code> data contains two links and a comment.</p>
+<p>When retrieving a dropped link, you should ensure you handle the case where multiple links may have been dragged, and any comments that appear in the data. For convenience, the special type <code>URL</code> may be used to refer to the first valid link within the data for the <code>text/uri-list</code> type. You should not add data using the <code>URL</code> type; attempting to do so will just set the value of the <code>text/uri-list</code> type instead.</p>
+<pre>var url = event.dataTransfer.getData("URL");
+</pre>
+<p>You may also see data using the <code>text/x-moz-url</code> type which is a Mozilla specific type. If it appears, it should be used before the <code>text/uri-list</code> type. It holds the URL of the link followed by the title of the link, separated by a linebreak. For example:</p>
+<pre>http://www.mozilla.org
+Mozilla
+http://www.xulplanet.com
+XUL Planet
+</pre>
+<h2 id="html" name="html">Dragging HTML and XML</h2>
+<p>HTML content may use the <code>text/html</code> type. The data for this type should be the serialized HTML to drag. For instance, it would be suitable to set the data value for this type to the value of the <code>innerHTML</code> property of an element.</p>
+<p>XML content may use the <code>text/xml</code> type, but you should ensure that the data value is well-formed XML.</p>
+<p>You may also include a plain text representation of the HTML or XML data using the <code>text/plain</code> type. The data should be just the text and should not include any of the source tags or attributes. For instance:</p>
+<pre>var dt = event.dataTransfer;
+dt.setData("text/html", "Hello there, &lt;strong&gt;stranger&lt;/strong&gt;");
+dt.setData("text/plain", "Hello there, stranger");
+</pre>
+<h2 id="file" name="file">Dragging Files</h2>
+<p>A local file is dragged using the <code>application/x-moz-file</code> type with a data value that is an <a href="/en/XPCOM_Interface_Reference/nsIFile" title="nsIFile">nsIFile</a> object. Non-privileged web pages are not able to retrieve or modify data of this type. Because a file is not a string, you must use the <a href="/En/DragDrop/DataTransfer#mozSetDataAt.28.29" title="mozSetDataAt">mozSetDataAt</a> method to assign the data. Similarly, when retrieving the data, you must use the <a href="/En/DragDrop/DataTransfer#mozGetDataAt.28.29" title="mozGetDataAt">mozGetDataAt</a> method.</p>
+<pre>event.dataTransfer.mozSetDataAt("application/x-moz-file", file, 0);
+</pre>
+<p>If possible, you may also include the file URL of the file using both the <code>text/uri-list</code> and/or <code>text/plain</code> types. These types should be added last so that the more specific <code>application/x-moz-file</code> type has higher priority.</p>
+<p>Multiple files will be received during a drop as mutliple items in the data transfer. See <a href="/En/DragDrop/Dragging_and_Dropping_Multiple_Items" title="Dragging and Dropping Multiple Items">Dragging and Dropping Multiple Items</a> for more details about this.</p>
+<p>The following example shows how to create an area for receiving dropped files:</p>
+<pre>&lt;listbox ondragenter="return checkDrag(event)"
+         ondragover="return checkDrag(event)"
+         ondrop="doDrop(event)"/&gt;
+
+&lt;script&gt;
+function checkDrag(event)
+{
+  return event.dataTransfer.types.contains("application/x-moz-file");
+}
+
+function doDrop(event)
+{
+  var file = event.dataTransfer.mozGetDataAt("application/x-moz-file", 0);
+  if (file instanceof Components.interfaces.nsIFile)
+    event.currentTarget.appendItem(file.leafName);
+}
+&lt;/script&gt;
+</pre>
+<p>In this example, the event returns false only if the data transfer contains the <code>application/x-moz-file</code> type. During the drop event, the data associated with the file type is retrieved, and the filename of the file is added to the listbox. Note that the <code>instanceof</code> operator is used here as the <a href="/En/DragDrop/DataTransfer#mozGetDataAt.28.29" title="mozGetDataAt">mozGetDataAt</a> method will return an <code>nsISupports</code> that needs to be checked and converted into an nsIFile. This is also a good extra check in case someone made a mistake and added a non-file for this type.</p>
+<h2 id="image" name="image">Dragging Images</h2>
+<p>Direct image dragging is not commonly done. In fact, Mozilla does not support direct image dragging on Mac or Linux platforms. Instead, images are usually dragged only by their URLs. To do this, use the <code>text/uri-list</code> type as with other URL links. The data should be the URL of the image or a data URL if the image is not stored on a web site or disk. For more information about data URLs, see <a class="internal" href="/en/data_URIs" title="en/The data URL scheme">the data URL scheme</a>.</p>
+<p>As with other links, the data for the <code>text/plain</code> type should also contain the URL. However, a data URL is not usually as useful in a text context, so you may wish to exclude the <code>text/plain</code> data in this situation.</p>
+<p>In chrome or other privileged code, you may also use the <code>image/jpeg</code>, <code>image/png</code> or <code>image/gif</code> types, depending on the type of image. The data should be an object which implements the <a href="/en/XPCOM_Interface_Reference/nsIInputStream" title="nsIInputStream">nsIInputStream</a> interface. When this stream is read, it should provide the data bits for the image, as if the image was a file of that type.</p>
+<p>You should also include the <code>application/x-moz-file</code> type if the image is located on disk. In fact, this a common way in which image files are dragged.</p>
+<p>It is important to set the data in the right order, from most specific to least specific. The image type such as <code>image/jpeg</code> should come first, followed by the <code>application/x-moz-file</code> type. Next, you should set the <code>text/uri-list</code> data and finally the <code>text/plain</code> data. For example:</p>
+<pre>var dt = event.dataTransfer;
+dt.mozSetDataAt("image/png", stream, 0);
+dt.mozSetDataAt("application/x-moz-file", file, 0);
+dt.setData("text/uri-list", imageurl);
+dt.setData("text/plain", imageurl);
+</pre>
+<p>Note that the <a href="/En/DragDrop/DataTransfer#mozGetDataAt.28.29" title="mozGetDataAt">mozGetDataAt</a> method is used for non-text data. As some contexts may only include some of these types, it is important to check which type is made available when receiving dropped images.</p>
+<h2 id="node" name="node">Dragging Nodes</h2>
+<p>Nodes and elements in a document may be dragged using the <code>application/x-moz-node</code> type. This data for the type should be a DOM node. This allows the drop target to receive the actual node where the drag was started from. Note that callers from a different domain will not be able to access the node even when it has been dropped.</p>
+<p>You should always include a plain text alternative for the node.</p>
+<h2 id="custom" name="custom">Dragging Custom Data</h2>
+<p>You can also use other types that you make up for custom purposes. You should strive to always include a plain text alternative unless that object being dragged is specific to a particular site or application. In this case, the custom type ensures that the data cannot be dropped elsewhere.</p>
+<h2 id="filestoos" name="filestoos">Dragging files to an operating system folder</h2>
+<p>There are cases in which you may want to add a file to an existing drag event session, and you may also want to write the file to disk when the drop operation happens over a folder in the operating system when your code receives notification of the target folder's location. This only works in extensions (or other privileged code) and the data flavor "application/moz-file-promise" should be used. The following sample offers an overview of this advanced case:</p>
+<pre class="brush: js">// currentEvent is a given existing drag operation event
+
+currentEvent.dataTransfer.setData("text/x-moz-url", URL);
+currentEvent.dataTransfer.setData("application/x-moz-file-promise-url", URL);
+currentEvent.dataTransfer.setData("application/x-moz-file-promise-filename", leafName);
+currentEvent.dataTransfer.mozSetDataAt('application/x-moz-file-promise',
+                  new dataProvider(success,error),
+                  0, Components.interfaces.nsISupports);
+
+function dataProvider(){}
+
+dataProvider.prototype = {
+  QueryInterface : function(iid) {
+    if (iid.equals(Components.interfaces.nsIFlavorDataProvider)
+                  || iid.equals(Components.interfaces.nsISupports))
+      return this;
+    throw Components.results.NS_NOINTERFACE;
+  },
+  getFlavorData : function(aTransferable, aFlavor, aData, aDataLen) {
+    if (aFlavor == 'application/x-moz-file-promise') {
+
+       var urlPrimitive = {};
+       var dataSize = {};
+
+       aTransferable.getTransferData('application/x-moz-file-promise-url', urlPrimitive, dataSize);
+       var url = new String(urlPrimitive.value.QueryInterface(Components.interfaces.nsISupportsString));
+       console.log("URL file orignal is = " + url);
+
+       var namePrimitive = {};
+       aTransferable.getTransferData('application/x-moz-file-promise-filename', namePrimitive, dataSize);
+       var name = new String(namePrimitive.value.QueryInterface(Components.interfaces.nsISupportsString));
+
+       console.log("target filename is = " + name);
+
+       var dirPrimitive = {};
+       aTransferable.getTransferData('application/x-moz-file-promise-dir', dirPrimitive, dataSize);
+       var dir = dirPrimitive.value.QueryInterface(Components.interfaces.nsILocalFile);
+
+       console.log("target folder is = " + dir.path);
+
+       var file = Cc['@mozilla.org/file/local;1'].createInstance(Components.interfaces.nsILocalFile);
+       file.initWithPath(dir.path);
+       file.appendRelativePath(name);
+
+       console.log("output final path is =" + file.path);
+
+       // now you can write or copy the file yourself...
+    }
+  }
+}
+</pre>
+<p>{{ languages( { "ja": "Ja/DragDrop/Recommended_Drag_Types" } ) }}</p>
diff --git a/files/es/web/api/htmlelement/accesskey/index.html b/files/es/web/api/htmlelement/accesskey/index.html
new file mode 100644
index 0000000000..4d77ae4133
--- /dev/null
+++ b/files/es/web/api/htmlelement/accesskey/index.html
@@ -0,0 +1,24 @@
+---
+title: Element.accessKey
+slug: Web/API/HTMLElement/accessKey
+tags:
+  - API
+  - Propiedad
+  - necesidades de contenido
+translation_of: Web/API/HTMLElement/accessKey
+translation_of_original: Web/API/Element/accessKey
+original_slug: Web/API/Element/accessKey
+---
+<div>{{APIRef("DOM")}}</div>
+
+<div> </div>
+
+<p><span id="result_box" lang="es"><span>La propiedad</span> <strong><span>Element.accessKey</span></strong> <span>establece la pulsación</span><span> de teclado</span> <span>mediante el cual un</span> <span>usuario puede presionar</span> <span>para saltar a</span> <span>este elemento</span><span>.</span></span></p>
+
+<div class="note">
+<p><span id="result_box" lang="es"><span>Nota: la propiedad</span> <strong><span>Element.accessKey</span></strong> <span>se usa raramente</span> <span>debido a sus</span> <span>múltiples</span> <span>conflictos con las asociaciones de teclas</span> <span>que ya están presentes</span>  <span>en los navegadores</span><span>.</span> <span>Para evitar</span> <span>esto,</span> <span>los navegadores implementan</span> <span>el comportamiento</span> <span>tecla de acceso</span> <span>si</span> <span>se pulsan las claves</span> <span>con otras teclas</span> <span>"cualificadas</span><span>" (como</span> <span>Alt</span> <span>+</span> <span>tecla de acceso</span><span>)</span><span>.</span></span></p>
+</div>
+
+<p> </p>
+
+<p> </p>
diff --git a/files/es/web/api/htmlelement/animationend_event/index.html b/files/es/web/api/htmlelement/animationend_event/index.html
new file mode 100644
index 0000000000..55a49ff105
--- /dev/null
+++ b/files/es/web/api/htmlelement/animationend_event/index.html
@@ -0,0 +1,82 @@
+---
+title: animationend
+slug: Web/API/HTMLElement/animationend_event
+translation_of: Web/API/HTMLElement/animationend_event
+original_slug: Web/Events/animationend
+---
+<p>El evento <code>animationend</code> es lanzado cuando una animación CSS se ha completado.</p>
+
+<h2 id="Información_General">Información General</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
+ <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/css3-animations/#animation-events">CSS Animations</a></dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interface</dt>
+ <dd style="margin: 0 0 0 120px;">AnimationEvent</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
+ <dd style="margin: 0 0 0 120px;">Si</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Target</dt>
+ <dd style="margin: 0 0 0 120px;">Document, Element</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Acción por defecto</dt>
+ <dd style="margin: 0 0 0 120px;">None</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedad</th>
+   <th scope="col">Tipo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{ReadOnlyInline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>The event target (the topmost target in the DOM tree).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{ReadOnlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The type of event.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{ReadOnlyInline}}</td>
+   <td><code>boolean</code></td>
+   <td>Does the event normally bubble?</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{ReadOnlyInline}}</td>
+   <td><code>boolean</code></td>
+   <td>Is it possible to cancel the event?</td>
+  </tr>
+  <tr>
+   <td><code>animationName</code> {{ReadOnlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The name of the CSS property associated with the transition.</td>
+  </tr>
+  <tr>
+   <td><code>elapsedTime</code> {{ReadOnlyInline}}</td>
+   <td>Float</td>
+   <td>The amount of time the animation has been running, in seconds, when this event fired, excluding any time the animation was paused. For an "animationstart" event, the elapsedTime is zero unless there was a negative value for <code>animation-delay</code>, in which case the event will be fired with an elapsedTime of (-1 * delay).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Eventos_relacionados">Eventos relacionados</h2>
+
+<ul>
+ <li>{{Event("animationstart")}}</li>
+ <li>{{Event("animationend")}}</li>
+ <li>{{Event("animationiteration")}}</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/CSS/Using_CSS_animations" title="/en-US/docs/CSS/Using_CSS_animations">Using CSS Animations</a></li>
+</ul>
diff --git a/files/es/web/api/htmlelement/dataset/index.html b/files/es/web/api/htmlelement/dataset/index.html
deleted file mode 100644
index 10c6f555f9..0000000000
--- a/files/es/web/api/htmlelement/dataset/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: HTMLElement.dataset
-slug: Web/API/HTMLElement/dataset
-translation_of: Web/API/HTMLOrForeignElement/dataset
----
-<div>{{ APIRef("HTML DOM") }}</div>
-
-<p><span class="seoSummary">La propiedad <code><strong>dataset</strong></code> en {{domxref("HTMLElement")}} proporciona una interfaz lectura/escritura para obtener todos los <a href="/es/HTML/Global_attributes#attr-data-*" title="https://developer.mozilla.org/en/HTML/Global_attributes#attr-data-*">atributos de datos personalizados</a> (<code>data-*</code>) de cada uno de los elementos.</span> Está disponible el acceso en HTML y en el DOM.  Dentro del <a href="/en/DOM/DOMStringMap" title="en/DOM/DOMStringMap">map of DOMString</a>, aparece una entrada por cada atributo de datos. Hay que tener en cuenta que la propiedad<strong> </strong><code>dataset</code><strong> </strong>puede leerse, pero no modificarse directamente.  En vez de eso, las escrituras deben ser realizadas a través de cada propiedad individual del <code>dataset</code>, que representan a cada atributo correspondiente. Además un HTML <code><strong>data-</strong></code><em>attribute</em> y su correspondiente DOM<strong> </strong><code>dataset.</code><em>property</em> no comparten el mismo nombre, pero son siempre similares:</p>
-
-<ul>
- <li>El nombre de un attributo de datos comienza en HTML con <code>data-</code>. Sólo puede estar formado por letras minúsculas, números y los caracteres: guión (<code>-</code>), punto (<code>.</code>), dos puntos (<code>:</code>) y guión bajo (<code>_</code>) -- NUNCA una letra mayúscula (A a Z).</li>
- <li>El nombre del atributo en JavaScript será el del correspondiente atributo HTML pero en camelCase, sin guiones, puntos, etc.</li>
-</ul>
-
-<p>Adicionalmente, encontrarás una guía de como usar los atributos data de HTML en nuestro articulo <a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes.</a></p>
-
-<h3 id="Conversion_de_nombres">Conversion de nombres</h3>
-
-<p><code>dash-style</code> a <code>camelCase</code>: Un atributo de datos personalizado se transforma en una clave para la entrada {{ domxref("DOMStringMap") }} con las siguientes reglas</p>
-
-<ul>
- <li>el prefijo <code>data-</code> es eliminado (incluyendo el guión);</li>
- <li>por cada guión (<code>U+002D</code>) seguido de un caracter ASCII que sea una letra en minuscula<span style="line-height: 1.5;"> </span><code>a</code><span style="line-height: 1.5;"> a la </span><code>z</code><span style="line-height: 1.5;">, el guión es removido y la letra se transforma en su contraparte en mayuscula;</span></li>
- <li>otros caracteres (incluyendo otros guines) se mantienen intactos.</li>
-</ul>
-
-<p><code>camelCase</code> a <code>dash-style</code>: La conversión opuesta, mapea una clave en un nombre de atributo, usa las siguientes reglas:</p>
-
-<ul>
- <li>Restricción: Un guión no debe ser inmediatamente seguido por un un caracter ASCII que sea una letra minuscula de la <code>a</code> a la <code>z</code> (antes de la conversión);</li>
- <li>se agrega el prefijo <code>data-</code>;</li>
- <li>cualquier caracter ASCII que sea una letra mayuscula de la <code>A</code> a la <code>Z</code> se convierte en un guión seguido de se contraparte en minuscula;</li>
- <li>otros caracteres se mantienen intactos.</li>
-</ul>
-
-<p>La restricción en las reglas anteriores aseguran que las dos conversiones sean inversas una a la otra.</p>
-
-<p>Por ejemplo, el atributo nombrado <code>data-abc-def</code> corresponde a la clave <code>abcDef</code>.</p>
-
-<ul>
-</ul>
-
-<h3 id="Accediendo_valores">Accediendo valores</h3>
-
-<ul>
- <li>Los atributos pueden ser definidos y obtenidos usando el nombre camelCase (la clave) como la propiedad de un objeto del dataset, como en <code>element.dataset.keyname</code></li>
- <li>Los atributos tambien pueden ser definidos y obtenidos usando la sintaxis de corchetes, como en <code>element.dataset[keyname]</code></li>
- <li>El <a href="/en-US/docs/Web/JavaScript/Reference/Operators/in">operador <code>in</code></a> puede ser usado para checar si un atributo dado existe.</li>
-</ul>
-
-<h3 id="Definiendo_valores">Definiendo valores</h3>
-
-<ul>
- <li>Cuando un atributo es definido, su valor siempre se convierte a string. Por ejemplo, <code>null</code> siempre se convierte en el string "null".</li>
- <li>Cuando quieras remover un atributo, puedes usar el <a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete">operador <code>delete</code></a>.</li>
-</ul>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<ul>
- <li><em>string</em> = <em>element</em>.<strong>dataset</strong>.<em>camelCasedName</em>;</li>
- <li><em>element.</em><strong>dataset</strong>.<em>camelCasedName</em> = <em>string</em>;</li>
- <br>
- <li><em>string</em> = <em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>];</li>
- <li><em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>] = <em>string</em>;</li>
- <br>
- <li><em>Custom data attributes can also be set directly on HTML elements, but attribute names must use the data- syntax above. </em></li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth&gt;John Doe&lt;/div&gt;</pre>
-
-<pre class="brush: js">const el = document.querySelector('#user');
-
-// el.id == 'user'
-// el.dataset.id === '1234567890'
-// el.dataset.user === 'johndoe'
-// el.dataset.dateOfBirth === ''
-
-// set the data attribute
-el.dataset.dateOfBirth = '1960-10-03';
-// Result: el.dataset.dateOfBirth === 1960-10-03
-
-delete el.dataset.dateOfBirth;
-// Result: el.dataset.dateOfBirth === undefined
-
-// 'someDataAttr' in el.dataset === false
-el.dataset.someDataAttr = 'mydata';
-// Result: 'someDataAttr' in el.dataset === true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No change from latest snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot of  {{SpecName('HTML WHATWG')}}, initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-
-
-<p>{{Compat("api.HTMLElement.dataset")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>The HTML <code><a href="/en-US/docs/Web/HTML/Global_attributes/data-*"><strong>data-*</strong></a></code> class of global attributes.</li>
- <li><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes</a></li>
- <li>{{domxref("Element.getAttribute()")}} and {{domxref("Element.setAttribute()")}}</li>
-</ul>
diff --git a/files/es/web/api/htmlelement/focus/index.html b/files/es/web/api/htmlelement/focus/index.html
deleted file mode 100644
index d615cbf12e..0000000000
--- a/files/es/web/api/htmlelement/focus/index.html
+++ /dev/null
@@ -1,164 +0,0 @@
----
-title: HTMLElement.focus()
-slug: Web/API/HTMLElement/focus
-tags:
-  - API
-  - HTML DOM
-  - HTMLElement
-  - Referencia
-  - metodo
-translation_of: Web/API/HTMLOrForeignElement/focus
----
-<div>{{ APIRef("HTML DOM") }}</div>
-
-<p>El método <code><strong>HTMLElement.focus()</strong></code> fija el foco del cursor en el elemento indicado, si éste puede ser enfocado.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">element.focus();
-element.focus(focusOption); // Object parameter</pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>focusOptions</code> {{optional_inline}} {{experimental_inline}}</dt>
- <dd>Es un objeto con la siguiente propiedad:</dd>
- <dd>
- <dl>
-  <dt><code>preventScroll</code> {{optional_inline}}</dt>
-  <dd>Es un valor <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a>:
-  <ul>
-   <li>Si es <code>false</code>, el método hará scroll hasta que el elemento esté visible en la ventana del navegador</li>
-   <li>Si es <code>true</code>,  el método NO hará scroll hasta que el elemento esté visible en la ventana del navegador.</li>
-  </ul>
-  </dd>
- </dl>
- </dd>
-</dl>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Enfocar_un_campo_de_texto" name="Enfocar_un_campo_de_texto">Enfocar un campo de texto</h3>
-
-<h4 id="JavaScript">JavaScript</h4>
-
-<pre class="brush: js">focusMethod = function getFocus() {
-  document.getElementById("myTextField").focus();
-}</pre>
-
-<h4 id="HTML">HTML</h4>
-
-<pre class="brush: html">&lt;input type="text" id="myTextField" value="Campo de texto."&gt;
-&lt;p&gt;&lt;/p&gt;
-&lt;button type="button" onclick="focusMethod()"&gt;¡Púlsame para enfocar el campo de texto!&lt;/button&gt;
-</pre>
-
-<h4 id="Resultado">Resultado</h4>
-
-<p>{{ EmbedLiveSample('Focus_on_a_text_field') }}</p>
-
-<h3 id="Enfocar_un_botón" name="Enfocar_un_botón">Enfocar un botón</h3>
-
-<h4 id="JavaScript_2">JavaScript</h4>
-
-<pre class="brush: js">focusMethod = function getFocus() {
-  document.getElementById("myButton").focus();
-}
-</pre>
-
-<h4 id="HTML_2">HTML</h4>
-
-<pre class="brush: html">&lt;button type="button" id="myButton"&gt;Púlsame!&lt;/button&gt;
-&lt;p&gt;&lt;/p&gt;
-&lt;button type="button" onclick="focusMethod()"&gt;¡Púlsame para enfocar el botón!&lt;/button&gt;
-</pre>
-
-<h4 id="Resultado_2">Resultado</h4>
-
-<p>{{ EmbedLiveSample('Focus_on_a_button') }}</p>
-
-
-
-<h3 id="Enfocar_con_focusOption" name="Enfocar_con_focusOption">Enfocar con focusOption</h3>
-
-<h4 id="JavaScript_3">JavaScript</h4>
-
-<pre class="brush: js">focusScrollMethod = function getFocus() {
-  document.getElementById("myButton").focus({preventScroll:false});
-}
-focusNoScrollMethod = function getFocusWithoutScrolling() {
-  document.getElementById("myButton").focus({preventScroll:true});
-}
-
-</pre>
-
-<h4 id="HTML_3">HTML</h4>
-
-<pre class="brush: html">&lt;button type="button" onclick="focusScrollMethod()"&gt;¡Púlsame para enfocar el botón!&lt;/button&gt;
-&lt;button type="button" onclick="focusNoScrollMethod()"&gt;¡Púlsame para enfocar el botón sin hacer scroll!&lt;/button&gt;
-
-&lt;div id="container" style="height: 1000px; width: 1000px;"&gt;
-&lt;button type="button" id="myButton" style="margin-top: 500px;"&gt;¡Púlsame!&lt;/button&gt;
-&lt;/div&gt;
-
-</pre>
-
-<h4 id="Resultado_3">Resultado</h4>
-
-<p>{{ EmbedLiveSample('Focus_prevent_scroll') }}</p>
-
-<h2 id="Especificación" name="Especificación">Especificación</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'editing.html#dom-focus', 'focus')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'editing.html#focus()-0', 'focus')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'editing.html#dom-focus', 'focus')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM2 HTML', 'html.html#ID-32130014', 'focus')}}</td>
-   <td>{{Spec2('DOM2 HTML')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM1', 'level-one-html.html#method-focus', 'focus')}}</td>
-   <td>{{Spec2('DOM1')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Notas">Notas</h2>
-
-<p>Si se llama a <code>HTMLElement.focus()</code> desde un gestor de eventos "mousedown" (ratón presionado), se debe también llamar al método <code>event.preventDefault()</code> para evitar que el foco abandone <code>HTMLElement</code><strong>.</strong></p>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-
-
-<p>{{Compat("api.HTMLElement.focus")}}</p>
-
-<h2 id="Ver_también" name="Ver_también">Ver también</h2>
-
-<ul>
- <li>Método DOM {{domxref("HTMLElement.blur()")}} para quitar el foco sobre un elemento.</li>
- <li>{{ domxref("document.activeElement") }} para saber cuál es el elemento enfocado actualmente.</li>
-</ul>
diff --git a/files/es/web/api/htmlelement/style/index.html b/files/es/web/api/htmlelement/style/index.html
deleted file mode 100644
index 62c8903b72..0000000000
--- a/files/es/web/api/htmlelement/style/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
----
-title: Element.style
-slug: Web/API/HTMLElement/style
-translation_of: Web/API/ElementCSSInlineStyle/style
----
-<p>{{ ApiRef("HTML DOM") }}</p>
-
-<h3 id="Summary" name="Summary">Resumen</h3>
-
-<p>Devuelve un objeto que representa el atributo <code>style </code>del elemento.</p>
-
-<h3 id="Example" name="Example">Ejemplo</h3>
-
-<pre class="eval">var div = document.getElementById("div1");
-div.style.marginTop = ".25in";
-</pre>
-
-<h3 id="Notes" name="Notes">Notas</h3>
-
-<p>Ya que la propiedad <code>style </code>tiene la misma (y más alta) prioridad en la cascada CSS que las declaraciones <em>in-line</em> hechas mediante el atributo style, resulta muy útil para establecer el estilo en un elemento específico. </p>
-
-<p>Sin embargo, no resulta útil para aprender acerca del estilo original de un elemento, ya que representa sólo la declaración CSS en el atributo style <em>in-line</em> y no aquellos atributos que vienen de alguna otra parte, como las declaraciones en la sección &lt;head&gt; o en hojas de estilo.</p>
-
-<p>Para recoger los valores de todas las propiedades CSS de un elemento, deberías usar <a href="/Es/DOM/Window.getComputedStyle" title="en/DOM/window.getComputedStyle">window.getComputedStyle</a> en su lugar.</p>
-
-<p>Mira la lista de Propiedades CSS del DOM (<a href="/es/DOM/CSS" title="en/DOM/CSS">DOM CSS Properties List</a>) para tener una lista completa de las propiedades CSS que están disponibles en el Gecko DOM.</p>
-
-<p>Generalmente es mejor usarla propiedad <code>style </code>que usar <code>elt.setAttribute('style', '...')</code>, ya que el uso de la propiedad <code>style </code>no reemplazará otras propiedades CSS que puedan especificarse en el atributo <code>style</code>.</p>
-
-<p>Los estilos <em>no</em> pueden establecerse asignando una cadena a la propiedad (solo lectura) style, como en <code>elt.style = "color: blue;"</code>. Esto es porque el atributo <code>style </code>devuelve un objeto del tipo <code>CSSStyleDeclaration</code>. En su lugar, pueds establecer las propiedades como:</p>
-
-<pre class="eval">elt.style.color = "blue";  // Asignación directa
-
-var st = elt.style;
-st.color = "blue";  // Asignación Indirecta
-</pre>
-
-<p>El siguiente código presenta los nombres de todas las propiedades style, los valores se establecen de forma explícita para los elementos<code> elt </code>y sus valores heredados: </p>
-
-<pre class="eval">var elt = document.getElementById("elementIdHere");
-var out = "";
-var st = elt.style;
-var cs = window.getComputedStyle(elt, null);
-for (x in st)
-  out += "  " + x + " = '" + st[x] + "' &gt; '" + cs[x] + "'\n";
-</pre>
-
-<p> </p>
-
-<h3 id="Specification" name="Specification">Especificación</h3>
-
-<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-ElementCSSInlineStyle">DOM Level 2 Style: ElementCSSInlineStyle.style</a></p>
diff --git a/files/es/web/api/htmlelement/transitioncancel_event/index.html b/files/es/web/api/htmlelement/transitioncancel_event/index.html
new file mode 100644
index 0000000000..9bc3f53e51
--- /dev/null
+++ b/files/es/web/api/htmlelement/transitioncancel_event/index.html
@@ -0,0 +1,164 @@
+---
+title: transitioncancel
+slug: Web/API/HTMLElement/transitioncancel_event
+tags:
+  - DOM
+  - Evento
+  - Referencia
+  - eventos
+translation_of: Web/API/HTMLElement/transitioncancel_event
+original_slug: Web/Events/transitioncancel
+---
+<p>{{SeeCompatTable}}</p>
+
+<p>El evento <code>transitioncancel</code> es lanzado cuando una <a href="/en-US/docs/CSS/Using_CSS_transitions">transición CSS</a> es cancelada.</p>
+
+<p>Véase {{domxref("GlobalEventHandlers.ontransitioncancel")}} para mas información y ejemplos.</p>
+
+<h2 id="Información_general">Información general</h2>
+
+<dl>
+ <dt>Interfaz</dt>
+ <dd>{{domxref("TransitionEvent")}}</dd>
+ <dt>Burbuja</dt>
+ <dd>Sí</dd>
+ <dt>Cancelable</dt>
+ <dd>No</dd>
+ <dt>Objetivo</dt>
+ <dd>{{domxref("document")}}, {{domxref("element")}}</dd>
+ <dt>Acción por defecto</dt>
+ <dd>Ninguna</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedad</th>
+   <th scope="col">Tipo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyinline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>El objetivo del evento (the topmost target in the DOM tree).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyinline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>El tipo de evento.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyinline}}</td>
+   <td>{{domxref("Boolean")}}</td>
+   <td>Si el evento normalmente se propaga o no</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyinline}}</td>
+   <td>{{domxref("Boolean")}}</td>
+   <td>Si el evento es cancelable o no</td>
+  </tr>
+  <tr>
+   <td><code>propertyName</code>{{readonlyinline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>El nombre de la propiedad CSS asociada con la transición.</td>
+  </tr>
+  <tr>
+   <td><code>elapsedTime</code>{{readonlyinline}}</td>
+   <td>{{domxref("Float")}}</td>
+   <td>
+    <p>La cantidad de tiempo que ha durado la transición, en segundos, desde el momento en que el evento fué generado. Este valor no se ve afectado por el valor de <code>transition-delay</code>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>pseudoElement</code>{{readonlyinline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>
+    <p>El nombre (empezando con dos "dos puntos") del pseudo-elemento CSS en el que ha ocurrido la transición (en caso de que el objetivo del evento sea dicho pseudo-elemento correspondiente al elemento), o una cadena vacía si la transición ha ocurrido en un elemento (lo que quiere decir que el objetivo del evento es dicho elemento).</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Transitions', '#transitioncancel', 'transitioncancel')}}</td>
+   <td>{{Spec2('CSS3 Transitions')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop(53)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile(53)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>El manejador {{domxref("GlobalEventHandlers.ontransitioncancel")}}</li>
+ <li>La interfaz {{domxref("TransitionEvent")}}</li>
+ <li>{{event("transitionstart")}}, {{event("transitionend")}}</li>
+ <li>Propiedades CSS: {{cssxref("transition")}}, {{cssxref("transition-delay")}}, {{cssxref("transition-duration")}}, {{cssxref("transition-property")}}, {{cssxref("transition-timing-function")}}.</li>
+</ul>
diff --git a/files/es/web/api/htmlelement/transitionend_event/index.html b/files/es/web/api/htmlelement/transitionend_event/index.html
new file mode 100644
index 0000000000..3005798cae
--- /dev/null
+++ b/files/es/web/api/htmlelement/transitionend_event/index.html
@@ -0,0 +1,184 @@
+---
+title: transitionend
+slug: Web/API/HTMLElement/transitionend_event
+tags:
+  - DOM
+  - Event
+  - Referencia
+  - Transiciones CSS
+  - Transiciones CSS3
+  - TransitionEvent
+  - transitionend
+translation_of: Web/API/HTMLElement/transitionend_event
+original_slug: Web/Events/transitionend
+---
+<p>El evento <code>transitionend</code> es lanzado cuando una <a href="/en-US/docs/CSS/Using_CSS_transitions">transición CSS</a> se ha completado. Si la transición es eliminada antes de haberse completado, como cuando {{cssxref("transition-property")}} es eliminado o {{cssxref("display")}} se establece a <code>"none"</code>, entonces el evento no será generado.</p>
+
+<h2 id="Información_general">Información general</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
+ <dd style="margin: 0 0 0 120px;">{{SpecName("CSS3 Transitions")}}</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
+ <dd style="margin: 0 0 0 120px;">{{domxref("TransitionEvent")}}</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Burbuja</dt>
+ <dd style="margin: 0 0 0 120px;">Sí</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">Sí</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Objetivo</dt>
+ <dd style="margin: 0 0 0 120px;">{{domxref("Element")}}, {{domxref("Document")}}, {{domxref("Window")}}</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Acción</dt>
+ <dd style="margin: 0 0 0 120px;">undefined</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col">Type</th>
+   <th scope="col">Description</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyInline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>The event target (the topmost target in the DOM tree).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The type of event.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event normally bubbles or not.</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event is cancellable or not.</td>
+  </tr>
+  <tr>
+   <td><code>propertyName</code> {{readonlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The name of the CSS property associated with the transition.</td>
+  </tr>
+  <tr>
+   <td><code>elapsedTime</code> {{readonlyInline}}</td>
+   <td>Float</td>
+   <td>The amount of time the transition has been running, in seconds, as of the time the event was generated. This value is not affected by the value of <code>transition-delay</code>.</td>
+  </tr>
+  <tr>
+   <td><code>pseudoElement</code> {{readonlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The name (beginning with two colons) of the CSS pseudo-element on which the transition occured (in which case the target of the event is that pseudo-element's corresponding element), or the empty string if the transition occurred on an element (which means the target of the event is that element).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Este ejemplo establece un manejador de evento para detectar el evento <code>transitionend</code>, y así cambiar el texto que se muestra dentro del elemento cuando la transición se completa.</p>
+
+<pre class="brush: js">let element = document.getElementById("slidingMenu");
+element.addEventListener("transitionend", function(event) {
+  element.innerHTML = "Done!";
+}, false);
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Transitions", "#transitionend", "transitionend")}}</td>
+   <td>{{Spec2('CSS3 Transitions')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0<sup>[1]</sup><br>
+    36</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.5<sup>[2]</sup><br>
+    12<br>
+    12.10<br>
+    23</td>
+   <td>3.2<sup>[1]</sup><br>
+    7.0.6</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.1</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10<sup>[2]</sup><br>
+    12<br>
+    12.10</td>
+   <td>3.2<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Implementado en Chrome 1.0, Android 2.1 y WebKit 3.2 como <code>webkitTransitionEnd</code>. Chrome 36 y WebKit 7.0.6 usan el estándar <code>transitionend</code>.</p>
+
+<p>[2] Implementado como <code>oTransitionEnd</code> desde Opera 10.5, como <code>otransitionend</code> desde la versión 12 y como el estándar <code>transitionend</code> desde la versión 12.10.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<p>La interfaz {{domxref("TransitionEvent")}}</p>
+
+<ul>
+ <li>{{event("transitionstart")}}, {{event("transitioncancel")}}</li>
+ <li>Propiedades CSS: {{cssxref("transition")}}, {{cssxref("transition-delay")}}, {{cssxref("transition-duration")}}, {{cssxref("transition-property")}}, {{cssxref("transition-timing-function")}}.</li>
+</ul>
diff --git a/files/es/web/api/htmlmediaelement/abort_event/index.html b/files/es/web/api/htmlmediaelement/abort_event/index.html
new file mode 100644
index 0000000000..597993df26
--- /dev/null
+++ b/files/es/web/api/htmlmediaelement/abort_event/index.html
@@ -0,0 +1,69 @@
+---
+title: abort
+slug: Web/API/HTMLMediaElement/abort_event
+translation_of: Web/API/HTMLMediaElement/abort_event
+translation_of_original: Web/Events/abort
+original_slug: Web/Events/abort
+---
+<p>The <code>abort</code> event is fired when the loading of a resource has been aborted.</p>
+
+<h2 id="Información_general">Información general</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Specification</dt>
+ <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-abort">DOM L3</a></dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interface</dt>
+ <dd style="margin: 0 0 0 120px;">UIEvent if generated from a user interface, Event otherwise.</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Target</dt>
+ <dd style="margin: 0 0 0 120px;">Element</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Default Action</dt>
+ <dd style="margin: 0 0 0 120px;">None</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col">Type</th>
+   <th scope="col">Description</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyInline}}</td>
+   <td><a href="/en-US/docs/Web/API/EventTarget" title="EventTarget is an interface implemented by objects that can receive events and may have listeners for them."><code>EventTarget</code></a></td>
+   <td>The event target (the topmost target in the DOM tree).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyInline}}</td>
+   <td><a href="/en-US/docs/Web/API/DOMString" title="DOMString is a UTF-16 String. As JavaScript already uses such strings, DOMString is mapped directly to a String."><code>DOMString</code></a></td>
+   <td>The type of event.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyInline}}</td>
+   <td><a href="/en-US/docs/Web/API/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a></td>
+   <td>Whether the event normally bubbles or not.</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyInline}}</td>
+   <td><a href="/en-US/docs/Web/API/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a></td>
+   <td>Whether the event is cancellable or not.</td>
+  </tr>
+  <tr>
+   <td><code>view</code> {{readonlyInline}}</td>
+   <td><a class="new" href="/en-US/docs/Web/API/WindowProxy" rel="nofollow" title="The documentation about this has not yet been written; please consider contributing!"><code>WindowProxy</code></a></td>
+   <td><a href="/en-US/docs/Web/API/Document/defaultView" title="In browsers, document.defaultView returns the window object associated with a document, or null if none is available."><code>document.defaultView</code></a> (<code>window</code> of the document)</td>
+  </tr>
+  <tr>
+   <td><code>detail</code> {{readonlyInline}}</td>
+   <td><code>long</code> (<code>float</code>)</td>
+   <td>0.</td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/es/web/api/htmlorforeignelement/dataset/index.html b/files/es/web/api/htmlorforeignelement/dataset/index.html
new file mode 100644
index 0000000000..f43113b4a9
--- /dev/null
+++ b/files/es/web/api/htmlorforeignelement/dataset/index.html
@@ -0,0 +1,133 @@
+---
+title: HTMLElement.dataset
+slug: Web/API/HTMLOrForeignElement/dataset
+translation_of: Web/API/HTMLOrForeignElement/dataset
+original_slug: Web/API/HTMLElement/dataset
+---
+<div>{{ APIRef("HTML DOM") }}</div>
+
+<p><span class="seoSummary">La propiedad <code><strong>dataset</strong></code> en {{domxref("HTMLElement")}} proporciona una interfaz lectura/escritura para obtener todos los <a href="/es/HTML/Global_attributes#attr-data-*" title="https://developer.mozilla.org/en/HTML/Global_attributes#attr-data-*">atributos de datos personalizados</a> (<code>data-*</code>) de cada uno de los elementos.</span> Está disponible el acceso en HTML y en el DOM.  Dentro del <a href="/en/DOM/DOMStringMap" title="en/DOM/DOMStringMap">map of DOMString</a>, aparece una entrada por cada atributo de datos. Hay que tener en cuenta que la propiedad<strong> </strong><code>dataset</code><strong> </strong>puede leerse, pero no modificarse directamente.  En vez de eso, las escrituras deben ser realizadas a través de cada propiedad individual del <code>dataset</code>, que representan a cada atributo correspondiente. Además un HTML <code><strong>data-</strong></code><em>attribute</em> y su correspondiente DOM<strong> </strong><code>dataset.</code><em>property</em> no comparten el mismo nombre, pero son siempre similares:</p>
+
+<ul>
+ <li>El nombre de un attributo de datos comienza en HTML con <code>data-</code>. Sólo puede estar formado por letras minúsculas, números y los caracteres: guión (<code>-</code>), punto (<code>.</code>), dos puntos (<code>:</code>) y guión bajo (<code>_</code>) -- NUNCA una letra mayúscula (A a Z).</li>
+ <li>El nombre del atributo en JavaScript será el del correspondiente atributo HTML pero en camelCase, sin guiones, puntos, etc.</li>
+</ul>
+
+<p>Adicionalmente, encontrarás una guía de como usar los atributos data de HTML en nuestro articulo <a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes.</a></p>
+
+<h3 id="Conversion_de_nombres">Conversion de nombres</h3>
+
+<p><code>dash-style</code> a <code>camelCase</code>: Un atributo de datos personalizado se transforma en una clave para la entrada {{ domxref("DOMStringMap") }} con las siguientes reglas</p>
+
+<ul>
+ <li>el prefijo <code>data-</code> es eliminado (incluyendo el guión);</li>
+ <li>por cada guión (<code>U+002D</code>) seguido de un caracter ASCII que sea una letra en minuscula<span style="line-height: 1.5;"> </span><code>a</code><span style="line-height: 1.5;"> a la </span><code>z</code><span style="line-height: 1.5;">, el guión es removido y la letra se transforma en su contraparte en mayuscula;</span></li>
+ <li>otros caracteres (incluyendo otros guines) se mantienen intactos.</li>
+</ul>
+
+<p><code>camelCase</code> a <code>dash-style</code>: La conversión opuesta, mapea una clave en un nombre de atributo, usa las siguientes reglas:</p>
+
+<ul>
+ <li>Restricción: Un guión no debe ser inmediatamente seguido por un un caracter ASCII que sea una letra minuscula de la <code>a</code> a la <code>z</code> (antes de la conversión);</li>
+ <li>se agrega el prefijo <code>data-</code>;</li>
+ <li>cualquier caracter ASCII que sea una letra mayuscula de la <code>A</code> a la <code>Z</code> se convierte en un guión seguido de se contraparte en minuscula;</li>
+ <li>otros caracteres se mantienen intactos.</li>
+</ul>
+
+<p>La restricción en las reglas anteriores aseguran que las dos conversiones sean inversas una a la otra.</p>
+
+<p>Por ejemplo, el atributo nombrado <code>data-abc-def</code> corresponde a la clave <code>abcDef</code>.</p>
+
+<ul>
+</ul>
+
+<h3 id="Accediendo_valores">Accediendo valores</h3>
+
+<ul>
+ <li>Los atributos pueden ser definidos y obtenidos usando el nombre camelCase (la clave) como la propiedad de un objeto del dataset, como en <code>element.dataset.keyname</code></li>
+ <li>Los atributos tambien pueden ser definidos y obtenidos usando la sintaxis de corchetes, como en <code>element.dataset[keyname]</code></li>
+ <li>El <a href="/en-US/docs/Web/JavaScript/Reference/Operators/in">operador <code>in</code></a> puede ser usado para checar si un atributo dado existe.</li>
+</ul>
+
+<h3 id="Definiendo_valores">Definiendo valores</h3>
+
+<ul>
+ <li>Cuando un atributo es definido, su valor siempre se convierte a string. Por ejemplo, <code>null</code> siempre se convierte en el string "null".</li>
+ <li>Cuando quieras remover un atributo, puedes usar el <a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete">operador <code>delete</code></a>.</li>
+</ul>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<ul>
+ <li><em>string</em> = <em>element</em>.<strong>dataset</strong>.<em>camelCasedName</em>;</li>
+ <li><em>element.</em><strong>dataset</strong>.<em>camelCasedName</em> = <em>string</em>;</li>
+ <br>
+ <li><em>string</em> = <em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>];</li>
+ <li><em>element</em>.<strong>dataset</strong>[<em>camelCasedName</em>] = <em>string</em>;</li>
+ <br>
+ <li><em>Custom data attributes can also be set directly on HTML elements, but attribute names must use the data- syntax above. </em></li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;div id="user" data-id="1234567890" data-user="johndoe" data-date-of-birth&gt;John Doe&lt;/div&gt;</pre>
+
+<pre class="brush: js">const el = document.querySelector('#user');
+
+// el.id == 'user'
+// el.dataset.id === '1234567890'
+// el.dataset.user === 'johndoe'
+// el.dataset.dateOfBirth === ''
+
+// set the data attribute
+el.dataset.dateOfBirth = '1960-10-03';
+// Result: el.dataset.dateOfBirth === 1960-10-03
+
+delete el.dataset.dateOfBirth;
+// Result: el.dataset.dateOfBirth === undefined
+
+// 'someDataAttr' in el.dataset === false
+el.dataset.someDataAttr = 'mydata';
+// Result: 'someDataAttr' in el.dataset === true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change from latest snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot of {{SpecName('HTML WHATWG')}}, no change from {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#dom-dataset", "HTMLElement.dataset")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot of  {{SpecName('HTML WHATWG')}}, initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.dataset")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>The HTML <code><a href="/en-US/docs/Web/HTML/Global_attributes/data-*"><strong>data-*</strong></a></code> class of global attributes.</li>
+ <li><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">Using data attributes</a></li>
+ <li>{{domxref("Element.getAttribute()")}} and {{domxref("Element.setAttribute()")}}</li>
+</ul>
diff --git a/files/es/web/api/htmlorforeignelement/focus/index.html b/files/es/web/api/htmlorforeignelement/focus/index.html
new file mode 100644
index 0000000000..9c7f8acf64
--- /dev/null
+++ b/files/es/web/api/htmlorforeignelement/focus/index.html
@@ -0,0 +1,165 @@
+---
+title: HTMLElement.focus()
+slug: Web/API/HTMLOrForeignElement/focus
+tags:
+  - API
+  - HTML DOM
+  - HTMLElement
+  - Referencia
+  - metodo
+translation_of: Web/API/HTMLOrForeignElement/focus
+original_slug: Web/API/HTMLElement/focus
+---
+<div>{{ APIRef("HTML DOM") }}</div>
+
+<p>El método <code><strong>HTMLElement.focus()</strong></code> fija el foco del cursor en el elemento indicado, si éste puede ser enfocado.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">element.focus();
+element.focus(focusOption); // Object parameter</pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>focusOptions</code> {{optional_inline}} {{experimental_inline}}</dt>
+ <dd>Es un objeto con la siguiente propiedad:</dd>
+ <dd>
+ <dl>
+  <dt><code>preventScroll</code> {{optional_inline}}</dt>
+  <dd>Es un valor <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a>:
+  <ul>
+   <li>Si es <code>false</code>, el método hará scroll hasta que el elemento esté visible en la ventana del navegador</li>
+   <li>Si es <code>true</code>,  el método NO hará scroll hasta que el elemento esté visible en la ventana del navegador.</li>
+  </ul>
+  </dd>
+ </dl>
+ </dd>
+</dl>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Enfocar_un_campo_de_texto" name="Enfocar_un_campo_de_texto">Enfocar un campo de texto</h3>
+
+<h4 id="JavaScript">JavaScript</h4>
+
+<pre class="brush: js">focusMethod = function getFocus() {
+  document.getElementById("myTextField").focus();
+}</pre>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="brush: html">&lt;input type="text" id="myTextField" value="Campo de texto."&gt;
+&lt;p&gt;&lt;/p&gt;
+&lt;button type="button" onclick="focusMethod()"&gt;¡Púlsame para enfocar el campo de texto!&lt;/button&gt;
+</pre>
+
+<h4 id="Resultado">Resultado</h4>
+
+<p>{{ EmbedLiveSample('Focus_on_a_text_field') }}</p>
+
+<h3 id="Enfocar_un_botón" name="Enfocar_un_botón">Enfocar un botón</h3>
+
+<h4 id="JavaScript_2">JavaScript</h4>
+
+<pre class="brush: js">focusMethod = function getFocus() {
+  document.getElementById("myButton").focus();
+}
+</pre>
+
+<h4 id="HTML_2">HTML</h4>
+
+<pre class="brush: html">&lt;button type="button" id="myButton"&gt;Púlsame!&lt;/button&gt;
+&lt;p&gt;&lt;/p&gt;
+&lt;button type="button" onclick="focusMethod()"&gt;¡Púlsame para enfocar el botón!&lt;/button&gt;
+</pre>
+
+<h4 id="Resultado_2">Resultado</h4>
+
+<p>{{ EmbedLiveSample('Focus_on_a_button') }}</p>
+
+
+
+<h3 id="Enfocar_con_focusOption" name="Enfocar_con_focusOption">Enfocar con focusOption</h3>
+
+<h4 id="JavaScript_3">JavaScript</h4>
+
+<pre class="brush: js">focusScrollMethod = function getFocus() {
+  document.getElementById("myButton").focus({preventScroll:false});
+}
+focusNoScrollMethod = function getFocusWithoutScrolling() {
+  document.getElementById("myButton").focus({preventScroll:true});
+}
+
+</pre>
+
+<h4 id="HTML_3">HTML</h4>
+
+<pre class="brush: html">&lt;button type="button" onclick="focusScrollMethod()"&gt;¡Púlsame para enfocar el botón!&lt;/button&gt;
+&lt;button type="button" onclick="focusNoScrollMethod()"&gt;¡Púlsame para enfocar el botón sin hacer scroll!&lt;/button&gt;
+
+&lt;div id="container" style="height: 1000px; width: 1000px;"&gt;
+&lt;button type="button" id="myButton" style="margin-top: 500px;"&gt;¡Púlsame!&lt;/button&gt;
+&lt;/div&gt;
+
+</pre>
+
+<h4 id="Resultado_3">Resultado</h4>
+
+<p>{{ EmbedLiveSample('Focus_prevent_scroll') }}</p>
+
+<h2 id="Especificación" name="Especificación">Especificación</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'editing.html#dom-focus', 'focus')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'editing.html#focus()-0', 'focus')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'editing.html#dom-focus', 'focus')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 HTML', 'html.html#ID-32130014', 'focus')}}</td>
+   <td>{{Spec2('DOM2 HTML')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM1', 'level-one-html.html#method-focus', 'focus')}}</td>
+   <td>{{Spec2('DOM1')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Notas">Notas</h2>
+
+<p>Si se llama a <code>HTMLElement.focus()</code> desde un gestor de eventos "mousedown" (ratón presionado), se debe también llamar al método <code>event.preventDefault()</code> para evitar que el foco abandone <code>HTMLElement</code><strong>.</strong></p>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+
+
+<p>{{Compat("api.HTMLElement.focus")}}</p>
+
+<h2 id="Ver_también" name="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Método DOM {{domxref("HTMLElement.blur()")}} para quitar el foco sobre un elemento.</li>
+ <li>{{ domxref("document.activeElement") }} para saber cuál es el elemento enfocado actualmente.</li>
+</ul>
diff --git a/files/es/web/api/htmlvideoelement/index.html b/files/es/web/api/htmlvideoelement/index.html
new file mode 100644
index 0000000000..19ea192165
--- /dev/null
+++ b/files/es/web/api/htmlvideoelement/index.html
@@ -0,0 +1,203 @@
+---
+title: Elementos HTML para Video
+slug: Web/API/HTMLVideoElement
+translation_of: Web/API/HTMLVideoElement
+original_slug: Web/API/ElementosHTMLparaVideo
+---
+<div>
+<div>{{APIRef("HTML DOM")}}</div>
+</div>
+
+<p>El interfaz de <strong><code>HTMLVideoElement</code></strong> provee propiedades especiales y metodos para manipular objectos de videos. Tambien, este interfaz hereda propiedades y métodos de {{domxref("HTMLMediaElement")}} y {{domxref("HTMLElement")}}.</p>
+
+<p>La lista de <a href="/en-US/docs/HTML/Supported_media_formats">supported media formats</a> (formatos de medios compatibles) varía de un navegador a otro. Debe proveer su video en un formato sencillo que sea compatible con todos los navegadores o proveer varias fuentes de videos in varios formatos, para que así todo navegador que necesite este cubierto.</p>
+
+<p>{{InheritanceDiagram(600, 140)}}</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<p><em>Hereda las propiedades de los interfaces anteriores, {{domxref("HTMLMediaElement")}}, y </em><em>{{domxref("HTMLElement")}}.</em></p>
+
+<dl>
+ <dt>{{domxref("HTMLVideoElement.height")}}</dt>
+ <dd>Es un {{domxref("DOMString")}} que refleja el atributo HTML {{htmlattrxref("height", "video")}}, el cual especifica la altura del area mostrada, en pixeles CSS.</dd>
+ <dt>{{domxref("HTMLVideoElement.poster")}}</dt>
+ <dd>Es un {{domxref("DOMString")}} que refleja el atributo HTML {{htmlattrxref("poster", "video")}}, el cual especifica que imagen sera mostrada en la ausencia de data de video.</dd>
+ <dt>{{domxref("HTMLVideoElement.videoHeight")}} {{readonlyInline}}</dt>
+ <dd>Devuelve un <code>unsigned long</code> que contiene la altura intrinsica del recurso en pixeles CSS, tomando en consideracion las dimensiones, aspecto proporcional, apertura limpia, resolucion, etc., ya definidas por el formato usado por el recurso.  Si el estado disponible del elemento es <code>HAVE_NOTHING</code>, su valor es <code>0</code>.</dd>
+ <dt>{{domxref("HTMLVideoElement.videoWidth")}} {{readonlyInline}}</dt>
+ <dd>Devuelve un <code>unsigned long</code> que contiene la anchura intrinsica del recurso en pixeles CSS, tomando en consideracion las dimensiones, aspecto proporcional, apertura limpia, resolucion, etc., ya definidas por el formato usado por el recurso.  Si el estado disponible del elemento es <code>HAVE_NOTHING</code>, su valor es <code>0</code>.</dd>
+ <dt>{{domxref("HTMLVideoElement.width")}}</dt>
+ <dd>Es un {{domxref("DOMString")}} que refleja el atributo HTML {{htmlattrxref("width", "video")}}, el cual especifica la anchura del area mostrada, en pixeles CSS.</dd>
+</dl>
+
+<h3 id="Propiedades_especificas_para_Gecko">Propiedades especificas para Gecko</h3>
+
+<dl>
+ <dt>{{domxref("HTMLVideoElement.mozParsedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
+ <dd><code>Devuelve un unsigned long</code> con el conteo de marcos de video que han sido analizados del recurso de multimedia.</dd>
+ <dt>{{domxref("HTMLVideoElement.mozDecodedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
+ <dd>Devuelve un <code>unsigned long</code> con el conteo de marcos de video que han sido decifrados como imágines.</dd>
+ <dt>{{domxref("HTMLVideoElement.mozPresentedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
+ <dd>Devuelve un <code>unsigned long</code> con el conteo de marcos decodificados que han sido  presentados a la canalización de render para pintar.</dd>
+ <dt>{{domxref("HTMLVideoElement.mozPaintedFrames")}} {{readonlyInline}}{{non-standard_inline}}</dt>
+ <dd>Devuelve un <code>unsigned long</code> con el conteo de marcos presentados que han sido pintados en la pantalla.</dd>
+ <dt>{{domxref("HTMLVideoElement.mozFrameDelay")}} {{readonlyInline}}{{non-standard_inline}}</dt>
+ <dd>Devuelve un <code>double</code> con el tiempo, en segundos, que el último marco de video fue pintado por retrazo.</dd>
+ <dt>{{domxref("HTMLVideoElement.mozHasAudio")}} {{readonlyInline}}{{non-standard_inline}}</dt>
+ <dd>Devuelve un {{domxref("Boolean")}} indicando si existe algún audio asociado con el video.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<p><em>Hereda los métodos anteriores de </em><em>{{domxref("HTMLMediaElement")}} y </em><em>{{domxref("HTMLElement")}}.</em></p>
+
+<dl>
+ <dt>{{domxref("HTMLVideoElement.getVideoPlaybackQuality()")}} {{experimental_inline}}</dt>
+ <dd>Devuelve un {{domxref("VideoPlaybackQuality")}} para objetos que contienen las medidas de reproducciones actuales.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Media Source Extensions', '#idl-def-HTMLVideoElement', 'Extensions to HTMLVideoElement')}}</td>
+   <td>{{Spec2("Media Source Extensions")}}</td>
+   <td>Anadio el metodo <code>getVideoPlaybackQuality()</code> .</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "the-video-element.html#the-video-element", "HTMLAreaElement")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambios del {{SpecName('HTML5 W3C')}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "embedded-content-0.html#the-video-element", "HTMLAreaElement")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Definicion incial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegador">Compatibilidad con Navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristicas</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Apoyo basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>9.0</td>
+   <td>10.50</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>mozParsedFrames mozDecodedFrames mozPresentedFrames mozPaintedFrames mozFrameDelay</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("5.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>mozHasAudio</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("15.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>getVideoPlaybackQuality()</code>{{experimental_inline}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("25.0")}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Características</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Apoyo básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>9.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>mozParsedFrames mozDecodedFrames mozPresentedFrames mozPaintedFrames mozFrameDelay</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("5.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>mozHasAudio</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("15.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>getVideoPlaybackQuality()</code>{{experimental_inline}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("25.0")}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Gecko implementa esto detras de la preferencia <code>media.mediasource.enabled</code>, predispuesto a <code>false</code>.</p>
+
+<h2 id="Lea_Tambien">Lea Tambien</h2>
+
+<ul>
+ <li>Elemento HTML implementando este interfaz: {{HTMLElement("video")}}.</li>
+ <li><a class="external" href="http://people.mozilla.org/~cpearce/paint-stats-demo.html">Demonstracion de estadisticas de pintura de video</a></li>
+ <li><a href="/en-US/docs/HTML/Supported_media_formats">Formatos de medios compatibles </a></li>
+</ul>
diff --git a/files/es/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html b/files/es/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html
new file mode 100644
index 0000000000..f905407f9e
--- /dev/null
+++ b/files/es/web/api/indexeddb_api/basic_concepts_behind_indexeddb/index.html
@@ -0,0 +1,217 @@
+---
+title: Conceptos Básicos
+slug: Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB
+translation_of: Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB
+original_slug: Web/API/IndexedDB_API/Conceptos_Basicos_Detras_De_IndexedDB
+---
+<p><strong>IndexedDB</strong> es una manera de almacenar datos de manera persistente en el navegador. Dado que permite la creación de aplicaciones web con capacidades de consulta mejoradas, éstas pueden funcionar tanto en línea como fuera de línea. IndexedDB es útil para aplicaciones que almacenan una gran cantidad de datos (catálogos de DVDs en una biblioteca, por ejemplo) y para aplicaciones que no necesitan de una conexión permanente a internet para funcionar (clientes de correo, listas de tareas y blocs de notas, por ejemplo).</p>
+
+<h2 id="Sobre_este_documento">Sobre este documento</h2>
+
+<p>Esta introducción discute conceptos y terminologías fundamentales en IndexedDB. Provee una visión general y orienta sobre los conceptos clave. Para aprender más sobre los términos relacionados con IndexedDB, vea la sección de <a href="#definitions">Definiciones</a>.</p>
+
+<p>Para un tutorial sobre cómo usar la API, vea <a href="/es/IndexedDB/Usando_IndexedDB" title="en/IndexedDB/IndexedDB primer">Usando IndexedDB</a>. Para ver la documentación de referencia sobre la API de IndexedDB, vea el artículo <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a> y sus sub-páginas, que documentan los tipos de objetos utilizados por IndexedDB, así como los métodos de las API síncrona y asíncrona.</p>
+
+<h2 id="Visión_general_de_IndexedDB">Visión general de IndexedDB</h2>
+
+<p>IndexedDB le permite almacenar y obtener objetos indizados a partir de una "llave". Todos los cambios realizados a la base de datos ocurren dentro de transacciones. Como la mayoría de las soluciones de almacenamiento web, IndexedDB sigue una <a class="external" href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">política de mismo origen</a>, por lo que aún cuando se puede acceder a datos almacenados en un dominio, no se pueden acceder a datos a través de distintos dominios.</p>
+
+<p>La API incluye una variante <a href="/en/IndexedDB#Asynchronous_API" title="https://developer.mozilla.org/en/IndexedDB#Asynchronous_API">asíncrona</a> y una <a href="/en/IndexedDB#Synchronous_API" title="https://developer.mozilla.org/en/IndexedDB#Synchronous_API">síncrona</a>. La variante asíncrona puede ser utilizada en la mayoría de los casos, incluyendo <a href="/En/DOM/Using_web_workers" title="https://developer.mozilla.org/En/Using_web_workers">WebWorkers</a>, mientras la variante síncrona está diseñada para ser utilizada solo con WebWorkers. Actualmente, ninguno de los navegadores principales soportan la API síncrona. Sin embargo, aún cuando la API síncrona sea soportada, en la mayoría de los casos de uso de IndexedDB lo más probable es que se utilice la API asíncrona.</p>
+
+<p>IndexedDB es una alternativa a WebSQL, que fue marcada como obsoleta por W3C el 18 de Noviembre de 2010. Aún cuando IndexedDB y WebSQL son soluciones para el almacenamiento, éstas no ofrecen las mismas funcionalidades. WebSQL es un sistema relacional de acceso a datos, mientras que IndexedDB es un sistema de tablas indizadas.</p>
+
+<h2 id="concepts" name="concepts">Conceptos principales</h2>
+
+<p>Si usted tiene alguna idea de cómo trabajan otros tipos de bases de datos, podría tener algún conflicto de conceptos al trabajar con IndexedDB. Por esta razón mantenga los siguientes conceptos importantes en mente:</p>
+
+<ul>
+ <li>
+  <p><strong>IndexedDB almacena pares llave-valor.</strong> Los valores pueden ser objetos con estructuras complejas, y las llaves pueden ser propiedades de esos objetos. Se pueden crear índices que usan cualquier propiedad de los objetos para realizar búsquedas rápidas o enumeraciones ordenadas.</p>
+ </li>
+ <li>
+  <p><strong>IndexedDB está hecho sobre un modelo de base de datos transaccional.</strong> Todo lo que usted haga en IndexedDB siempre ocurre en el contexto de una <a href="#gloss_transaction">transacción</a>. La API de IndexedDB provee una gran cantidad de objetos que representan índices, tablas, cursores, y más, pero cada uno de ellos están atados a una transacción particular. Así, usted no puede ejecutar ningún comando o abrir un cursor fuera de una transacción.</p>
+
+  <p>Las transacciones tienen un período de vida bien definido. Por esta razón, cualquier intento de utilizar una transacción que ya se ha completado ocasionará excepciones. Igualmente, las transacciones aplican los cambios automáticamente y no se puede hacer <em>commit</em> automáticamente.</p>
+
+  <p>Este modelo de transacciones es realmente útil cuando se considera qué podría pasar si un usuario abre dos instancias de una aplicación simultáneamente en dos pestañas. Sin operaciones transaccionales, las dos instancias podrían hacer que los cambios se <em>pisen</em> o se sobreescriban entre sí. Si no está familiarizado con el concepto de transacción en una base de datos, lea el <a class="link-https" href="https://es.wikipedia.org/wiki/Transacci%C3%B3n_%28base_de_datos%29" title="https://secure.wikimedia.org/wikipedia/en/wiki/Database_transaction">artículo correspondiente en la Wikipedia</a> y <a href="#gloss_transaction">transacción</a> en la sección de definiciones.</p>
+ </li>
+ <li>
+  <p><strong>La API de IndexedDB es mayormente asincrona.</strong> La API no devuelve datos regresando un valor; en cambio, es necesario pasarle una funcion como <em>callback</em>. Usted no "guarda" un valor en la base de datos, o "lee" un valor de la misma por medios síncronos. En cambio, usted "solicita" una operación a la base de datos. Un evento del DOM es utilizado para notificarle que la operación terminó, y el tipo de evento recibido le permite saber si ésta falló o si fue exitosa. Esto puede sonar complicado al comienzo, pero hay algunas medidas de sanidad incluidas por defecto. Esto no es muy distinto de cómo funciona <a href="/es/DOM/XMLHttpRequest" title="https://developer.mozilla.org/en/xmlhttprequest">XMLHttpRequest</a>.</p>
+ </li>
+ <li>
+  <p><strong>IndexedDB usa solicitudes en todos lados. </strong>Las solicitudes (<em>requests</em>) son objetos que reciben los eventos del DOM mencionados previamente. Éstas cuentan con las propiedades <code style="font-size: 14px;">onsuccess</code> y <code style="font-size: 14px;">onerror</code>, sobre las cuales se puede aplicar <code style="font-size: 14px;">addEventListener()</code> y <code style="font-size: 14px;">removeEventListener()</code>. Estas también tienen las propiedades  <code style="font-size: 14px;">readyState</code>, <code style="font-size: 14px;">result</code>, y <code style="font-size: 14px;">errorCode</code> que permiten conocer el estado de la solicitud. La propiedad <code style="font-size: 14px;">result</code> es particularmente mágica, dado que puede ser muchas cosas distintas, dependiendo de cómo se generó la solicitud (por ejemplo, una instancia de <code>IDBCursor</code>, o la llave de un valor recién insertado en la base de datos).</p>
+ </li>
+ <li>
+  <p><strong>IndexedDB usa eventos DOM para notificar cuando los resultados están disponibles.</strong> Los eventos del DOM siempre tienen una propiedad <code style="font-size: 14px;">type</code> (en IndexedDB, ésta es generalmente <code style="font-size: 14px;">"success"</code> o <code style="font-size: 14px;">"error"</code>). Los eventos del DOM también tienen una propiedad <code style="font-size: 14px;">target</code> que dice a dónde apunta el evento. En la mayoría de los casos, el <code style="font-size: 14px;">target</code> de un evento es el objeto <code style="font-size: 14px;">IDBRequest</code> que se generó como resultado de una operación sobre la base de datos. Los eventos exitosos no son pasados a los padres y no pueden ser cancelados. Por otro lado, los eventos de error son pasados a los padres del target y pueden cancelarse. Esto es importante, dado que los eventos de error cancelan cualquier transacción sobre la que estén corriendo a menos que sean cancelados.</p>
+ </li>
+ <li>
+  <p><strong>IndexedDB es orientada a objetos.</strong> IndexedDB no es una base de datos relacional, con tablas, filas y columnas. Esta diferencia fundamental e importante afecta la manera como usted diseña e implementa sus aplicaciones.</p>
+
+  <p>En un almacén de datos relacional, usted podría tener una tabla que almacena una colección de filas de datos y columnas de tipos de datos con un nombre. IndexedDB, por otro lado, necesita que usted cree un almacén de objetos para un tipo de datos y sencillamente almacena objetos JavaScript en ese almacén. Cada almacén de objetos puede tener una colección de índices que hacen que la iteración y la búsqueda de elementos sea más eficiente. Si usted no está familiarizado con los sistemas de manejo de datos orientados a objetos, lea el <a class="external" href="https://es.wikipedia.org/wiki/Base_de_datos_orientada_a_objetos" title="http://en.wikipedia.org/wiki/Object_database">artículo de la Wikipedia sobre bases de datos orientadas a objetos</a>.</p>
+ </li>
+ <li>
+  <p><strong>IndexedDB no utiliza SQL (</strong><strong>Structured Query Language).</strong> En cambio usa consultas sobre un índice que producen un cursor. Éste puede utilizarse para iterar sobre el conjunto de resultados. Si no está familiarizado con sistemas NoSQL, lea el <a class="external" href="https://es.wikipedia.org/wiki/NoSQL" title="http://en.wikipedia.org/wiki/NoSQL">artículo de Wikipedia sobre NoSQL</a>.</p>
+ </li>
+ <li>
+  <p><a name="origin"><strong>IndexedDB se adhiere a una política de mismo origen</strong></a>. Un orígen es el dominio, protocolo de la capa de aplicación, y el puerto de la URL del documento donde se está ejecutando la aplicación. Cada orígen tiene su propio conjunto de bases de datos asociado. Cada base de datos tiene un nombre que la identifica dentro de un orígen.</p>
+
+  <p>El límite de seguridad impuesto en IndexedDB prevé que las aplicaciones puedan acceder a datos de un orígen diferente. Por ejemplo, mientras una aplicación en <a class="external" href="http://www.example.com/app/" rel="freelink">http://www.example.com/app/</a> puede obtener datos desde <a class="external" href="http://www.example.com/dir/" rel="freelink">http://www.example.com/dir/</a>, debido a que comparten un mismo orígen, esta no puede leer datos desde <a class="external" href="http://www.example.com:8080/dir/" rel="freelink">http://www.example.com:8080/dir/</a> (puerto distinto) o desde <a class="link-https" href="https://www.example.com/dir/" rel="freelink">https://www.example.com/dir/</a> (protocolo distinto), debido a que tienen distintos orígenes.</p>
+ </li>
+</ul>
+
+<h2 id="definitions" name="definitions">Definiciones</h2>
+
+<p>Esta sección define y explica los términos utilizados en la API de IndexedDB.</p>
+
+<h3 id="database" name="database">Base de Datos</h3>
+
+<dl>
+ <dt><a name="gloss_database">base de datos</a></dt>
+ <dd>Un repositorio de información, típicamente compuesto de uno o más  <a href="#gloss_object_store" title="#gloss_object_store"><em>almacenes de objetos</em></a>. Cada base de datos debe tener:
+ <ul>
+  <li><strong>Nombre</strong>. Identifica la base de datos dentro de un mismo origen y no cambia a lo largo de la existencia de ésta. El nombre puede ser cualquier cadena de caracteres (incluyendo una vacía).</li>
+  <li>
+   <p><strong><a href="#gloss_version"><em>Versión</em></a> actual</strong>. Cuando una base de datos se crea por primera vez, la versión es el número entero 1 si no se indica otra cosa. Cada base de datos puede tener una y sólo una versión en cualquier momento.</p>
+  </li>
+ </ul>
+ </dd>
+ <dt><a name="gloss_object_store">almacén de objetos</a></dt>
+ <dd>
+ <p>El mecanismo a través del cual los datos son almacenados en la base de datos. El almacén de objetos mantiene registros de manera persistente, que son pares de llave-valor. Los registros dentro de un almacén de objetos son ordenados de acuerdo con las <em><a href="#gloss_key">llaves</a></em> en orden ascendente.</p>
+
+ <p>Todo almacén de objetos debe tener un nombre que es único a lo largo de su base de datos. Opcionalmente puede tener un <em><a href="#gloss_keygenerator">generador de llaves</a></em> y una <em><a href="#gloss_keypath">ruta de llaves</a></em>. Si el almacén tiene una ruta de llaves, éste utiliza <em><a href="#gloss_inline_key">llaves en línea</a></em>; si no, utiliza <em><a href="#gloss_outofline_key">llaves fuera de línea</a></em>.</p>
+
+ <p>Para documentación de referencia sobre los almacenes de objetos, vew <a href="../../../../en/IndexedDB/IDBObjectStore" rel="internal">IDBObjectStore</a> o <a href="../../../../en/IndexedDB/IDBObjectStoreSync" rel="internal">IDBObjectStoreSync</a>.</p>
+ </dd>
+ <dt><a name="gloss_version">versión</a></dt>
+ <dd>Cuando una base de datos es creada por primera vez, su versión es 1. Cada base de datos tiene una versión en cualquier momento y no puede tener varias versiones al mismo tiempo. La única manera de cambiar la versión es abrir la base de datos con una versión mayor a la actual. Esto arranca una <em>transacción</em> <code>versionchang<em>e</em></code> y dispara el evento <code>upgradeneeded</code>. El único momento cuando se puede actualizar el esquema de la base de datos es dentro del manejador de este evento.</dd>
+ <dd>Nota: Esta definición describe la <a class="external" href="http://dvcs.w3.org/hg/IndexedDB/raw-file/tip/Overview.html">especificación más actual</a>, que solo está implementada por las versiones más nuevas de los navegadores. Los navegadores más antiguos implementaron el método <a href="/en-US/docs/IndexedDB/IDBDatabase#setVersion()" title="/en-US/docs/IndexedDB/IDBDatabase#setVersion()"><code>IDBDatabase.setVersion()</code></a>, que ya ha sido marcado obsoleto y removido.</dd>
+ <dt><a name="gloss_database_connection">conexión a la base de datos</a></dt>
+ <dd>Una operación creada al abrir una <em><a href="#gloss_database">base de datos</a></em>. Una base de datos puede tener múltiples conexiónes al mismo tiempo.</dd>
+ <dt><a name="gloss_transaction">transacción</a></dt>
+ <dd>
+ <p>Un conjunto atómico y durable de operaciónes de acceso y modificación de datos sobre una base de datos particular. Esta es la manera cómo se interactúa con los datos de una base de datos. De hecho, cualquier lectura o modificación de datos en la base de datos debe ocurrir dentro de una transacción.</p>
+
+ <p>Una conexión a la base de datos puede tener varias transacciones activas, siempre que las operaciones de escrituras no tengan <a href="#scope"><em>ámbitos</em></a> que se solapen. El ámbito de las transacciones, que es definido al momento en que éstas son creadas, determina con qué almacenes de datos puede interactuar ésta y permanece constante a lo largo de su existencia. Así, por ejemplo, si una conexión tiene una transacción escribiendo con un ámbito que abarca solo el almacén <code>flyingMonkey</code>, se puede iniciar una segunda que tenga como ámbito los almacenes <code>unicornCentaur</code> y <code>unicornPegasus</code>. En el caso de las transacciones de lectura, se pueden tener varias aún cuando se solapen.</p>
+
+ <p>Se espera que las transacciones tengan una existencia corta, de manera que el navegador puede cancelar una transacción que tome demasiado tiempo para liberar recursos que la misma tenga bloqueados. Usted puede abortar la transacción, lo que deshace los cambios hechos a la base de datos durante la misma. Ni siquiera es necesario esperar a que la transacción inicie para abortarla.</p>
+
+ <p>Los tres modos de transacción son: <code>readwrite</code>, <code>readonly</code>, y <code>versionchange</code>. La única manera de crear y borrar almacenes es usar una transacción <code>versionchange</code>. Para aprender más sobre los tipos de transacción, vea al artículo de referencia de <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a>.</p>
+
+ <p>Debido a que todo sucede dentro de una transacción, este es un concepto muy importante. Para aprender más sobre las transacciones, especialmente sobre como se relacionan con el versionado, vea <a href="../../../../en/IndexedDB/IDBTransaction" rel="internal">IDBTransaction</a>, que también cuenta con documentación de referencia. Para la documentación sobre la API asíncrona, vea <a href="../../../../en/IndexedDB/IDBTransactionSync" rel="internal">IDBTransactionSync</a>.</p>
+ </dd>
+ <dt><a name="gloss_request">solicitud</a></dt>
+ <dd>La operación por medio de la cual se lee o se escribe en una base de datos. Toda solicitud representa una y solo una operación de lectura o escritura.</dd>
+ <dt><a name="gloss_index">índice</a></dt>
+ <dd>
+ <p>Un almacén especializado para buscar registros en otro almacén, llamado <em>almacén de objetos referenciado</em>. El índice es un almacenamiento persistente llave-valor donde el valor es una llave del almacén referenciado. Los registros en un índice son rellenados automáticamente cada vez que se modifican los registros del almacén referenciado. Cada registro en un índice puede apuntar solo a un registro de su almacén referenciado, pero varios índices pueden apuntar al mismo almacén.</p>
+
+ <p>Alternativamente, se pueden realizar búsquedas en un almacén de objetos usando la <a href="#gloss_key">llave</a><em>.</em></p>
+
+ <p>Para aprender más sobre el uso de los índices, vea <a href="/en/IndexedDB/Using_IndexedDB#Using_an_index" title="en/IndexedDB/Using_IndexedDB#Using_an_index">Usando IndexedDB</a>. Para documentación de referencia, vea <a href="../../../../en/IndexedDB/IDBKeyRange" rel="internal">IDBKeyRange</a>.</p>
+ </dd>
+</dl>
+
+<h3 id="key" name="key">Llave y valor</h3>
+
+<dl>
+ <dt><a name="gloss_key">llave</a></dt>
+ <dd>
+ <p>Es uno de los atributos del objeto a partir del cual los demás objetos son organizados y obtenidos desde el almacén de objetos. El almacén puede derivar una llave desde uno de tres orígenes: un <em><a href="#gloss_keygenerator">generador de llaves</a></em>, una <em><a href="#gloss_keypath">ruta de llave</a></em><a>, y un valor indicado de forma explícita. La llave debe ser de un tipo de datos que tenga un número creciente en relación con los objetos almacenados previamente. Cada registro en un almacén de datos debe tener una llave única en el almacén, de manera que no se pueden tener varios objetos con la misma llave en un almacén de objetos dado.</a></p>
+ <a> </a>
+
+ <p><a>Una llave puede ser de uno de los siguientes tipos: </a><a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String" title="String">String</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date" title="Date">Date</a>, float, y <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array" title="Array">Array</a>. Para los arreglos, la llave puede tener un rango desde un valor vacío hasta infinito, y puede incluirse un arreglo dentro de otro. No se requiere usar solo cadenas o enteros para las llaves {{ fx_minversion_inline("11") }}.</p>
+
+ <p>Como alternativa, se pueden realizar búsquedas de objetos usando un <em><a href="#gloss_index">índice</a>.</em></p>
+ </dd>
+ <dt><a name="gloss_keygenerator">generador de llaves</a></dt>
+ <dd>Es un mecanismo para producir nuevas llaves en una secuencia ordenada. Si un almacén de objetos no tiene un generador de llaves, entonces la aplicación debe proveer llaves para los registros que se almacenen. Los generadores no son compartidos entre almacenes. Esto es un detalle de implementación de los navegadores, porque en desarrollo web, realmente no se crea o se accede a un generador de llaves.</dd>
+ <dt><a name="gloss_inline_key">llaves en línea</a></dt>
+ <dd>Es una llave que se almacena como parte del valor almacenado. La manera como se determina cuál es la llave es utilizando una  <em>ruta de llave</em>. Una llave en línea puede obtenerse con un generador. Después de que la llave ha sido generada, esta puede almacenarse en el valor usando la ruta del atributo o puede ser usada directamente como llave.</dd>
+ <dt><a name="gloss_outofline_key">llave fuera de línea</a></dt>
+ <dd>Una llave que se almacena separada del valor.</dd>
+ <dt><a name="gloss_keypath">ruta de llave</a></dt>
+ <dd>Define de dónde se debe extraer la llave desde un valor en el almacén o en un índice. Una ruta de llave válida puede incluir alguno de los siguientes: una cadena vacía, un identificador de JavaScript, o múltiples identificadores de JavaScript separados con puntos. No puede incluir espacios.</dd>
+ <dt><a name="gloss_value">valor</a></dt>
+ <dd>
+ <p>Cada registro tiene un valor, el cual puede ser cualquier cosa que pueda ser expresada en JavaScript, incluyendo: <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Boolean" rel="internal" title="Boolean">booleanos</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number" rel="internal" title="Number">números</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String" title="String">cadenas</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date" title="Date">fechas</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object" title="Object">objetos</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array" rel="internal" title="Array">arreglos</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/RegExp" rel="internal" title="RegExp">expresiones regulares</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/undefined" title="undefined">undefined</a>, y null.</p>
+
+ <p>Cuando un objeto o un arreglo es almacenado, las propiedades y valores en ese objeto o arreglo pueden ser cualquier cosa que sea un valor válido.</p>
+
+ <p>Se pueden almacenar <a href="/en/DOM/Blob" title="en/DOM/Blob">Blobs</a> y archivos. cf. <a class="external" href="http://dvcs.w3.org/hg/IndexedDB/raw-file/tip/Overview.html">especificación</a> {{ fx_minversion_inline("11") }}.</p>
+ </dd>
+</dl>
+
+<h3 id="range" name="range">Rango y ámbito</h3>
+
+<dl>
+ <dt>ámbito</dt>
+ <dd>El conjunto de almacenes de objetos e índices en los que una transacción aplica. Los ámbitos de varias transacciones de solo lectura pueden solaparse y ejecutarse al mismo tiempo. En cambio, los ámbitos de transacciones de escritura no pueden solaparse. Aún así se pueden crear varias transacciones con el mismo ámbito al mismo tiempo, pero éstas serán manejadas por una cola y ejecutadas una detrás de otra.</dd>
+ <dt>cursor</dt>
+ <dd>Un mecanismo para iterar a través de múltiples registros con un <em>rango de llaves</em>. El cursor tiene un orígen que indica que índice o almacén de datos está iterando. El cursor tiene una posición dentro del rango, y se mueve en dirección creciente o decreciente en el orden de las llaves de cada registro. Para obtener documentación de referencia sobre cursores, vea <a href="../../../../en/IndexedDB/IDBCursor" rel="internal">IDBCursor</a> o <a href="../../../../en/IndexedDB/IDBCursorSync" rel="internal">IDBCursorSync</a>.</dd>
+ <dt>rango de llaves</dt>
+ <dd>
+ <p>Un intervalo continuo sobre algún tipo de datos utilizado para las llaves. Los registros pueden obtenerse desde los almacenes e índices usando llaves o un rango de llaves. Los rangos pueden limitarse o filtrarse con umbrales inferiores y superiores. Por ejemplo, se puede iterar sobre todos los valores de una llave desde x hasta y.</p>
+
+ <p>Para documentación de referencia sobre los rangos de llaves, vea <a href="../../../../en/IndexedDB/IDBKeyRange" rel="internal">IDBKeyRange</a>.</p>
+ </dd>
+</dl>
+
+<h2 id="limitations" name="limitations">Limitaciones</h2>
+
+<p>IndexedDB está diseñado para cubrir la mayoría de los casos en los que se necesita almacenamiento del lado del cliente. Sin embargo, no están contemplados en su diseño unos pocos casos como los siguientes:</p>
+
+<ul>
+ <li>Ordenamiento internacionalizado. No todos los idiomas ordenan las cadenas de la misma forma, por lo que el ordenamiento internacionalizado no está soportado. Aún cuando la base de datos no puede ordenar los datos respetando su idioma, usted puede ordenar los datos obtenidos de la base de datos por su cuenta.</li>
+ <li>Sincronización. La API no está diseñada para tomar en cuenta la sincronización con una base de datos del lado del servidor. Usted debe escribir el código de sincronización para estos casos.</li>
+ <li>Búsqueda de Texto Completo. La API no ofrece un equivalente al operador <span style="direction: ltr;"><code>LIKE</code> en SQL. </span></li>
+</ul>
+
+<p>Adicionalmente, tenga en cuenta que los navegadores podrían eliminar la base de datos, como en las siguientes condiciones:</p>
+
+<ul>
+ <li>El usuario pide borrar los datos del navegador.<br>
+  Muchos navegadores tienen opciones que permiten al usuario eliminar todos los datos almacenados de un sitio, incluyendo cookies, marcadores, contraseñas, y datos de IndexedDB.</li>
+ <li>El navegador está en modo de navegación privada.<br>
+  Algunos navegadores tienen modos de "navegación privada" (Firefox) o "incógnito" (Chrome). Al final de la sesión, el navegador elimina la base de datos.</li>
+ <li>Se alcanza el límite de espacio en disco.</li>
+ <li>Los datos se corrompen.</li>
+ <li>Se realiza un cambio incompatible a ésta característica.</li>
+</ul>
+
+<p>Las circunstancias exactas y capacidades de los navegadores cambian con el tiempo, pero la filosofía de los navegadores es, en general, hacer lo posible por conservar los datos.</p>
+
+<div class="warning">
+<p><strong>Advertencia:</strong> Al momento, debido a errores o a propósito, es imposible abrir una base de datos IndexedDB desde un <a href="https://developer.mozilla.org/en-US/docs/Accessibility/An_overview_of_accessible_web_applications_and_widgets" title="/en-US/docs/Accessibility/An_overview_of_accessible_web_applications_and_widgets">Web App</a>. Esto requiere mayor investigación para documentarlo.</p>
+</div>
+
+<h2 id="next" name="next">Próximo paso</h2>
+
+<p>Ok, ahora con estos conceptos generales bajo nuestros cinturones, podemos seguir a cosas más concretas. Para un tutorial sobre como utilizar la API, vea <a href="/en/IndexedDB/Using_IndexedDB" title="en/IndexedDB/IndexedDB primer">Usando IndexedDB</a>.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<p>Especificación</p>
+
+<ul>
+ <li><a href="http://www.w3.org/TR/IndexedDB/" title="http://www.w3.org/TR/IndexedDB/"><span style="direction: ltr;">Especificación de la API de IndexedDB</span></a></li>
+</ul>
+
+<p>Referencia</p>
+
+<ul>
+ <li><a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">Referencia de la API de IndexedDB</a></li>
+</ul>
+
+<p>Tutoriales</p>
+
+<ul>
+ <li><a href="/en/IndexedDB/Using_IndexedDB" title="en/IndexedDB/IndexedDB primer">Usando IndexedDB</a></li>
+ <li><a class="external" href="http://www.html5rocks.com/tutorials/indexeddb/todo/" title="http://www.html5rocks.com/tutorials/indexeddb/todo/">Una lista de tareas sencilla usando HTML5 e IndexedDB</a><span class="external">. </span><span class="external"> {{ Note("Este ejemplo usa una versión antigua de la especificación y no funciona en las versiones más recientes de los navegadores principales (aún utiliza el método <code>setVersion()</code>, que fue removido.") }}</span></li>
+</ul>
+
+<p>Artículo relacionado</p>
+
+<ul>
+ <li><a class="external" href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx" title="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — El almacén en su navegador</a></li>
+</ul>
diff --git a/files/es/web/api/indexeddb_api/conceptos_basicos_detras_de_indexeddb/index.html b/files/es/web/api/indexeddb_api/conceptos_basicos_detras_de_indexeddb/index.html
deleted file mode 100644
index 34d4fdd438..0000000000
--- a/files/es/web/api/indexeddb_api/conceptos_basicos_detras_de_indexeddb/index.html
+++ /dev/null
@@ -1,216 +0,0 @@
----
-title: Conceptos Básicos
-slug: Web/API/IndexedDB_API/Conceptos_Basicos_Detras_De_IndexedDB
-translation_of: Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB
----
-<p><strong>IndexedDB</strong> es una manera de almacenar datos de manera persistente en el navegador. Dado que permite la creación de aplicaciones web con capacidades de consulta mejoradas, éstas pueden funcionar tanto en línea como fuera de línea. IndexedDB es útil para aplicaciones que almacenan una gran cantidad de datos (catálogos de DVDs en una biblioteca, por ejemplo) y para aplicaciones que no necesitan de una conexión permanente a internet para funcionar (clientes de correo, listas de tareas y blocs de notas, por ejemplo).</p>
-
-<h2 id="Sobre_este_documento">Sobre este documento</h2>
-
-<p>Esta introducción discute conceptos y terminologías fundamentales en IndexedDB. Provee una visión general y orienta sobre los conceptos clave. Para aprender más sobre los términos relacionados con IndexedDB, vea la sección de <a href="#definitions">Definiciones</a>.</p>
-
-<p>Para un tutorial sobre cómo usar la API, vea <a href="/es/IndexedDB/Usando_IndexedDB" title="en/IndexedDB/IndexedDB primer">Usando IndexedDB</a>. Para ver la documentación de referencia sobre la API de IndexedDB, vea el artículo <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a> y sus sub-páginas, que documentan los tipos de objetos utilizados por IndexedDB, así como los métodos de las API síncrona y asíncrona.</p>
-
-<h2 id="Visión_general_de_IndexedDB">Visión general de IndexedDB</h2>
-
-<p>IndexedDB le permite almacenar y obtener objetos indizados a partir de una "llave". Todos los cambios realizados a la base de datos ocurren dentro de transacciones. Como la mayoría de las soluciones de almacenamiento web, IndexedDB sigue una <a class="external" href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">política de mismo origen</a>, por lo que aún cuando se puede acceder a datos almacenados en un dominio, no se pueden acceder a datos a través de distintos dominios.</p>
-
-<p>La API incluye una variante <a href="/en/IndexedDB#Asynchronous_API" title="https://developer.mozilla.org/en/IndexedDB#Asynchronous_API">asíncrona</a> y una <a href="/en/IndexedDB#Synchronous_API" title="https://developer.mozilla.org/en/IndexedDB#Synchronous_API">síncrona</a>. La variante asíncrona puede ser utilizada en la mayoría de los casos, incluyendo <a href="/En/DOM/Using_web_workers" title="https://developer.mozilla.org/En/Using_web_workers">WebWorkers</a>, mientras la variante síncrona está diseñada para ser utilizada solo con WebWorkers. Actualmente, ninguno de los navegadores principales soportan la API síncrona. Sin embargo, aún cuando la API síncrona sea soportada, en la mayoría de los casos de uso de IndexedDB lo más probable es que se utilice la API asíncrona.</p>
-
-<p>IndexedDB es una alternativa a WebSQL, que fue marcada como obsoleta por W3C el 18 de Noviembre de 2010. Aún cuando IndexedDB y WebSQL son soluciones para el almacenamiento, éstas no ofrecen las mismas funcionalidades. WebSQL es un sistema relacional de acceso a datos, mientras que IndexedDB es un sistema de tablas indizadas.</p>
-
-<h2 id="concepts" name="concepts">Conceptos principales</h2>
-
-<p>Si usted tiene alguna idea de cómo trabajan otros tipos de bases de datos, podría tener algún conflicto de conceptos al trabajar con IndexedDB. Por esta razón mantenga los siguientes conceptos importantes en mente:</p>
-
-<ul>
- <li>
-  <p><strong>IndexedDB almacena pares llave-valor.</strong> Los valores pueden ser objetos con estructuras complejas, y las llaves pueden ser propiedades de esos objetos. Se pueden crear índices que usan cualquier propiedad de los objetos para realizar búsquedas rápidas o enumeraciones ordenadas.</p>
- </li>
- <li>
-  <p><strong>IndexedDB está hecho sobre un modelo de base de datos transaccional.</strong> Todo lo que usted haga en IndexedDB siempre ocurre en el contexto de una <a href="#gloss_transaction">transacción</a>. La API de IndexedDB provee una gran cantidad de objetos que representan índices, tablas, cursores, y más, pero cada uno de ellos están atados a una transacción particular. Así, usted no puede ejecutar ningún comando o abrir un cursor fuera de una transacción.</p>
-
-  <p>Las transacciones tienen un período de vida bien definido. Por esta razón, cualquier intento de utilizar una transacción que ya se ha completado ocasionará excepciones. Igualmente, las transacciones aplican los cambios automáticamente y no se puede hacer <em>commit</em> automáticamente.</p>
-
-  <p>Este modelo de transacciones es realmente útil cuando se considera qué podría pasar si un usuario abre dos instancias de una aplicación simultáneamente en dos pestañas. Sin operaciones transaccionales, las dos instancias podrían hacer que los cambios se <em>pisen</em> o se sobreescriban entre sí. Si no está familiarizado con el concepto de transacción en una base de datos, lea el <a class="link-https" href="https://es.wikipedia.org/wiki/Transacci%C3%B3n_%28base_de_datos%29" title="https://secure.wikimedia.org/wikipedia/en/wiki/Database_transaction">artículo correspondiente en la Wikipedia</a> y <a href="#gloss_transaction">transacción</a> en la sección de definiciones.</p>
- </li>
- <li>
-  <p><strong>La API de IndexedDB es mayormente asincrona.</strong> La API no devuelve datos regresando un valor; en cambio, es necesario pasarle una funcion como <em>callback</em>. Usted no "guarda" un valor en la base de datos, o "lee" un valor de la misma por medios síncronos. En cambio, usted "solicita" una operación a la base de datos. Un evento del DOM es utilizado para notificarle que la operación terminó, y el tipo de evento recibido le permite saber si ésta falló o si fue exitosa. Esto puede sonar complicado al comienzo, pero hay algunas medidas de sanidad incluidas por defecto. Esto no es muy distinto de cómo funciona <a href="/es/DOM/XMLHttpRequest" title="https://developer.mozilla.org/en/xmlhttprequest">XMLHttpRequest</a>.</p>
- </li>
- <li>
-  <p><strong>IndexedDB usa solicitudes en todos lados. </strong>Las solicitudes (<em>requests</em>) son objetos que reciben los eventos del DOM mencionados previamente. Éstas cuentan con las propiedades <code style="font-size: 14px;">onsuccess</code> y <code style="font-size: 14px;">onerror</code>, sobre las cuales se puede aplicar <code style="font-size: 14px;">addEventListener()</code> y <code style="font-size: 14px;">removeEventListener()</code>. Estas también tienen las propiedades  <code style="font-size: 14px;">readyState</code>, <code style="font-size: 14px;">result</code>, y <code style="font-size: 14px;">errorCode</code> que permiten conocer el estado de la solicitud. La propiedad <code style="font-size: 14px;">result</code> es particularmente mágica, dado que puede ser muchas cosas distintas, dependiendo de cómo se generó la solicitud (por ejemplo, una instancia de <code>IDBCursor</code>, o la llave de un valor recién insertado en la base de datos).</p>
- </li>
- <li>
-  <p><strong>IndexedDB usa eventos DOM para notificar cuando los resultados están disponibles.</strong> Los eventos del DOM siempre tienen una propiedad <code style="font-size: 14px;">type</code> (en IndexedDB, ésta es generalmente <code style="font-size: 14px;">"success"</code> o <code style="font-size: 14px;">"error"</code>). Los eventos del DOM también tienen una propiedad <code style="font-size: 14px;">target</code> que dice a dónde apunta el evento. En la mayoría de los casos, el <code style="font-size: 14px;">target</code> de un evento es el objeto <code style="font-size: 14px;">IDBRequest</code> que se generó como resultado de una operación sobre la base de datos. Los eventos exitosos no son pasados a los padres y no pueden ser cancelados. Por otro lado, los eventos de error son pasados a los padres del target y pueden cancelarse. Esto es importante, dado que los eventos de error cancelan cualquier transacción sobre la que estén corriendo a menos que sean cancelados.</p>
- </li>
- <li>
-  <p><strong>IndexedDB es orientada a objetos.</strong> IndexedDB no es una base de datos relacional, con tablas, filas y columnas. Esta diferencia fundamental e importante afecta la manera como usted diseña e implementa sus aplicaciones.</p>
-
-  <p>En un almacén de datos relacional, usted podría tener una tabla que almacena una colección de filas de datos y columnas de tipos de datos con un nombre. IndexedDB, por otro lado, necesita que usted cree un almacén de objetos para un tipo de datos y sencillamente almacena objetos JavaScript en ese almacén. Cada almacén de objetos puede tener una colección de índices que hacen que la iteración y la búsqueda de elementos sea más eficiente. Si usted no está familiarizado con los sistemas de manejo de datos orientados a objetos, lea el <a class="external" href="https://es.wikipedia.org/wiki/Base_de_datos_orientada_a_objetos" title="http://en.wikipedia.org/wiki/Object_database">artículo de la Wikipedia sobre bases de datos orientadas a objetos</a>.</p>
- </li>
- <li>
-  <p><strong>IndexedDB no utiliza SQL (</strong><strong>Structured Query Language).</strong> En cambio usa consultas sobre un índice que producen un cursor. Éste puede utilizarse para iterar sobre el conjunto de resultados. Si no está familiarizado con sistemas NoSQL, lea el <a class="external" href="https://es.wikipedia.org/wiki/NoSQL" title="http://en.wikipedia.org/wiki/NoSQL">artículo de Wikipedia sobre NoSQL</a>.</p>
- </li>
- <li>
-  <p><a name="origin"><strong>IndexedDB se adhiere a una política de mismo origen</strong></a>. Un orígen es el dominio, protocolo de la capa de aplicación, y el puerto de la URL del documento donde se está ejecutando la aplicación. Cada orígen tiene su propio conjunto de bases de datos asociado. Cada base de datos tiene un nombre que la identifica dentro de un orígen.</p>
-
-  <p>El límite de seguridad impuesto en IndexedDB prevé que las aplicaciones puedan acceder a datos de un orígen diferente. Por ejemplo, mientras una aplicación en <a class="external" href="http://www.example.com/app/" rel="freelink">http://www.example.com/app/</a> puede obtener datos desde <a class="external" href="http://www.example.com/dir/" rel="freelink">http://www.example.com/dir/</a>, debido a que comparten un mismo orígen, esta no puede leer datos desde <a class="external" href="http://www.example.com:8080/dir/" rel="freelink">http://www.example.com:8080/dir/</a> (puerto distinto) o desde <a class="link-https" href="https://www.example.com/dir/" rel="freelink">https://www.example.com/dir/</a> (protocolo distinto), debido a que tienen distintos orígenes.</p>
- </li>
-</ul>
-
-<h2 id="definitions" name="definitions">Definiciones</h2>
-
-<p>Esta sección define y explica los términos utilizados en la API de IndexedDB.</p>
-
-<h3 id="database" name="database">Base de Datos</h3>
-
-<dl>
- <dt><a name="gloss_database">base de datos</a></dt>
- <dd>Un repositorio de información, típicamente compuesto de uno o más  <a href="#gloss_object_store" title="#gloss_object_store"><em>almacenes de objetos</em></a>. Cada base de datos debe tener:
- <ul>
-  <li><strong>Nombre</strong>. Identifica la base de datos dentro de un mismo origen y no cambia a lo largo de la existencia de ésta. El nombre puede ser cualquier cadena de caracteres (incluyendo una vacía).</li>
-  <li>
-   <p><strong><a href="#gloss_version"><em>Versión</em></a> actual</strong>. Cuando una base de datos se crea por primera vez, la versión es el número entero 1 si no se indica otra cosa. Cada base de datos puede tener una y sólo una versión en cualquier momento.</p>
-  </li>
- </ul>
- </dd>
- <dt><a name="gloss_object_store">almacén de objetos</a></dt>
- <dd>
- <p>El mecanismo a través del cual los datos son almacenados en la base de datos. El almacén de objetos mantiene registros de manera persistente, que son pares de llave-valor. Los registros dentro de un almacén de objetos son ordenados de acuerdo con las <em><a href="#gloss_key">llaves</a></em> en orden ascendente.</p>
-
- <p>Todo almacén de objetos debe tener un nombre que es único a lo largo de su base de datos. Opcionalmente puede tener un <em><a href="#gloss_keygenerator">generador de llaves</a></em> y una <em><a href="#gloss_keypath">ruta de llaves</a></em>. Si el almacén tiene una ruta de llaves, éste utiliza <em><a href="#gloss_inline_key">llaves en línea</a></em>; si no, utiliza <em><a href="#gloss_outofline_key">llaves fuera de línea</a></em>.</p>
-
- <p>Para documentación de referencia sobre los almacenes de objetos, vew <a href="../../../../en/IndexedDB/IDBObjectStore" rel="internal">IDBObjectStore</a> o <a href="../../../../en/IndexedDB/IDBObjectStoreSync" rel="internal">IDBObjectStoreSync</a>.</p>
- </dd>
- <dt><a name="gloss_version">versión</a></dt>
- <dd>Cuando una base de datos es creada por primera vez, su versión es 1. Cada base de datos tiene una versión en cualquier momento y no puede tener varias versiones al mismo tiempo. La única manera de cambiar la versión es abrir la base de datos con una versión mayor a la actual. Esto arranca una <em>transacción</em> <code>versionchang<em>e</em></code> y dispara el evento <code>upgradeneeded</code>. El único momento cuando se puede actualizar el esquema de la base de datos es dentro del manejador de este evento.</dd>
- <dd>Nota: Esta definición describe la <a class="external" href="http://dvcs.w3.org/hg/IndexedDB/raw-file/tip/Overview.html">especificación más actual</a>, que solo está implementada por las versiones más nuevas de los navegadores. Los navegadores más antiguos implementaron el método <a href="/en-US/docs/IndexedDB/IDBDatabase#setVersion()" title="/en-US/docs/IndexedDB/IDBDatabase#setVersion()"><code>IDBDatabase.setVersion()</code></a>, que ya ha sido marcado obsoleto y removido.</dd>
- <dt><a name="gloss_database_connection">conexión a la base de datos</a></dt>
- <dd>Una operación creada al abrir una <em><a href="#gloss_database">base de datos</a></em>. Una base de datos puede tener múltiples conexiónes al mismo tiempo.</dd>
- <dt><a name="gloss_transaction">transacción</a></dt>
- <dd>
- <p>Un conjunto atómico y durable de operaciónes de acceso y modificación de datos sobre una base de datos particular. Esta es la manera cómo se interactúa con los datos de una base de datos. De hecho, cualquier lectura o modificación de datos en la base de datos debe ocurrir dentro de una transacción.</p>
-
- <p>Una conexión a la base de datos puede tener varias transacciones activas, siempre que las operaciones de escrituras no tengan <a href="#scope"><em>ámbitos</em></a> que se solapen. El ámbito de las transacciones, que es definido al momento en que éstas son creadas, determina con qué almacenes de datos puede interactuar ésta y permanece constante a lo largo de su existencia. Así, por ejemplo, si una conexión tiene una transacción escribiendo con un ámbito que abarca solo el almacén <code>flyingMonkey</code>, se puede iniciar una segunda que tenga como ámbito los almacenes <code>unicornCentaur</code> y <code>unicornPegasus</code>. En el caso de las transacciones de lectura, se pueden tener varias aún cuando se solapen.</p>
-
- <p>Se espera que las transacciones tengan una existencia corta, de manera que el navegador puede cancelar una transacción que tome demasiado tiempo para liberar recursos que la misma tenga bloqueados. Usted puede abortar la transacción, lo que deshace los cambios hechos a la base de datos durante la misma. Ni siquiera es necesario esperar a que la transacción inicie para abortarla.</p>
-
- <p>Los tres modos de transacción son: <code>readwrite</code>, <code>readonly</code>, y <code>versionchange</code>. La única manera de crear y borrar almacenes es usar una transacción <code>versionchange</code>. Para aprender más sobre los tipos de transacción, vea al artículo de referencia de <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a>.</p>
-
- <p>Debido a que todo sucede dentro de una transacción, este es un concepto muy importante. Para aprender más sobre las transacciones, especialmente sobre como se relacionan con el versionado, vea <a href="../../../../en/IndexedDB/IDBTransaction" rel="internal">IDBTransaction</a>, que también cuenta con documentación de referencia. Para la documentación sobre la API asíncrona, vea <a href="../../../../en/IndexedDB/IDBTransactionSync" rel="internal">IDBTransactionSync</a>.</p>
- </dd>
- <dt><a name="gloss_request">solicitud</a></dt>
- <dd>La operación por medio de la cual se lee o se escribe en una base de datos. Toda solicitud representa una y solo una operación de lectura o escritura.</dd>
- <dt><a name="gloss_index">índice</a></dt>
- <dd>
- <p>Un almacén especializado para buscar registros en otro almacén, llamado <em>almacén de objetos referenciado</em>. El índice es un almacenamiento persistente llave-valor donde el valor es una llave del almacén referenciado. Los registros en un índice son rellenados automáticamente cada vez que se modifican los registros del almacén referenciado. Cada registro en un índice puede apuntar solo a un registro de su almacén referenciado, pero varios índices pueden apuntar al mismo almacén.</p>
-
- <p>Alternativamente, se pueden realizar búsquedas en un almacén de objetos usando la <a href="#gloss_key">llave</a><em>.</em></p>
-
- <p>Para aprender más sobre el uso de los índices, vea <a href="/en/IndexedDB/Using_IndexedDB#Using_an_index" title="en/IndexedDB/Using_IndexedDB#Using_an_index">Usando IndexedDB</a>. Para documentación de referencia, vea <a href="../../../../en/IndexedDB/IDBKeyRange" rel="internal">IDBKeyRange</a>.</p>
- </dd>
-</dl>
-
-<h3 id="key" name="key">Llave y valor</h3>
-
-<dl>
- <dt><a name="gloss_key">llave</a></dt>
- <dd>
- <p>Es uno de los atributos del objeto a partir del cual los demás objetos son organizados y obtenidos desde el almacén de objetos. El almacén puede derivar una llave desde uno de tres orígenes: un <em><a href="#gloss_keygenerator">generador de llaves</a></em>, una <em><a href="#gloss_keypath">ruta de llave</a></em><a>, y un valor indicado de forma explícita. La llave debe ser de un tipo de datos que tenga un número creciente en relación con los objetos almacenados previamente. Cada registro en un almacén de datos debe tener una llave única en el almacén, de manera que no se pueden tener varios objetos con la misma llave en un almacén de objetos dado.</a></p>
- <a> </a>
-
- <p><a>Una llave puede ser de uno de los siguientes tipos: </a><a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String" title="String">String</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date" title="Date">Date</a>, float, y <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array" title="Array">Array</a>. Para los arreglos, la llave puede tener un rango desde un valor vacío hasta infinito, y puede incluirse un arreglo dentro de otro. No se requiere usar solo cadenas o enteros para las llaves {{ fx_minversion_inline("11") }}.</p>
-
- <p>Como alternativa, se pueden realizar búsquedas de objetos usando un <em><a href="#gloss_index">índice</a>.</em></p>
- </dd>
- <dt><a name="gloss_keygenerator">generador de llaves</a></dt>
- <dd>Es un mecanismo para producir nuevas llaves en una secuencia ordenada. Si un almacén de objetos no tiene un generador de llaves, entonces la aplicación debe proveer llaves para los registros que se almacenen. Los generadores no son compartidos entre almacenes. Esto es un detalle de implementación de los navegadores, porque en desarrollo web, realmente no se crea o se accede a un generador de llaves.</dd>
- <dt><a name="gloss_inline_key">llaves en línea</a></dt>
- <dd>Es una llave que se almacena como parte del valor almacenado. La manera como se determina cuál es la llave es utilizando una  <em>ruta de llave</em>. Una llave en línea puede obtenerse con un generador. Después de que la llave ha sido generada, esta puede almacenarse en el valor usando la ruta del atributo o puede ser usada directamente como llave.</dd>
- <dt><a name="gloss_outofline_key">llave fuera de línea</a></dt>
- <dd>Una llave que se almacena separada del valor.</dd>
- <dt><a name="gloss_keypath">ruta de llave</a></dt>
- <dd>Define de dónde se debe extraer la llave desde un valor en el almacén o en un índice. Una ruta de llave válida puede incluir alguno de los siguientes: una cadena vacía, un identificador de JavaScript, o múltiples identificadores de JavaScript separados con puntos. No puede incluir espacios.</dd>
- <dt><a name="gloss_value">valor</a></dt>
- <dd>
- <p>Cada registro tiene un valor, el cual puede ser cualquier cosa que pueda ser expresada en JavaScript, incluyendo: <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Boolean" rel="internal" title="Boolean">booleanos</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number" rel="internal" title="Number">números</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/String" title="String">cadenas</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Date" title="Date">fechas</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Object" title="Object">objetos</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Array" rel="internal" title="Array">arreglos</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/RegExp" rel="internal" title="RegExp">expresiones regulares</a>, <a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/undefined" title="undefined">undefined</a>, y null.</p>
-
- <p>Cuando un objeto o un arreglo es almacenado, las propiedades y valores en ese objeto o arreglo pueden ser cualquier cosa que sea un valor válido.</p>
-
- <p>Se pueden almacenar <a href="/en/DOM/Blob" title="en/DOM/Blob">Blobs</a> y archivos. cf. <a class="external" href="http://dvcs.w3.org/hg/IndexedDB/raw-file/tip/Overview.html">especificación</a> {{ fx_minversion_inline("11") }}.</p>
- </dd>
-</dl>
-
-<h3 id="range" name="range">Rango y ámbito</h3>
-
-<dl>
- <dt>ámbito</dt>
- <dd>El conjunto de almacenes de objetos e índices en los que una transacción aplica. Los ámbitos de varias transacciones de solo lectura pueden solaparse y ejecutarse al mismo tiempo. En cambio, los ámbitos de transacciones de escritura no pueden solaparse. Aún así se pueden crear varias transacciones con el mismo ámbito al mismo tiempo, pero éstas serán manejadas por una cola y ejecutadas una detrás de otra.</dd>
- <dt>cursor</dt>
- <dd>Un mecanismo para iterar a través de múltiples registros con un <em>rango de llaves</em>. El cursor tiene un orígen que indica que índice o almacén de datos está iterando. El cursor tiene una posición dentro del rango, y se mueve en dirección creciente o decreciente en el orden de las llaves de cada registro. Para obtener documentación de referencia sobre cursores, vea <a href="../../../../en/IndexedDB/IDBCursor" rel="internal">IDBCursor</a> o <a href="../../../../en/IndexedDB/IDBCursorSync" rel="internal">IDBCursorSync</a>.</dd>
- <dt>rango de llaves</dt>
- <dd>
- <p>Un intervalo continuo sobre algún tipo de datos utilizado para las llaves. Los registros pueden obtenerse desde los almacenes e índices usando llaves o un rango de llaves. Los rangos pueden limitarse o filtrarse con umbrales inferiores y superiores. Por ejemplo, se puede iterar sobre todos los valores de una llave desde x hasta y.</p>
-
- <p>Para documentación de referencia sobre los rangos de llaves, vea <a href="../../../../en/IndexedDB/IDBKeyRange" rel="internal">IDBKeyRange</a>.</p>
- </dd>
-</dl>
-
-<h2 id="limitations" name="limitations">Limitaciones</h2>
-
-<p>IndexedDB está diseñado para cubrir la mayoría de los casos en los que se necesita almacenamiento del lado del cliente. Sin embargo, no están contemplados en su diseño unos pocos casos como los siguientes:</p>
-
-<ul>
- <li>Ordenamiento internacionalizado. No todos los idiomas ordenan las cadenas de la misma forma, por lo que el ordenamiento internacionalizado no está soportado. Aún cuando la base de datos no puede ordenar los datos respetando su idioma, usted puede ordenar los datos obtenidos de la base de datos por su cuenta.</li>
- <li>Sincronización. La API no está diseñada para tomar en cuenta la sincronización con una base de datos del lado del servidor. Usted debe escribir el código de sincronización para estos casos.</li>
- <li>Búsqueda de Texto Completo. La API no ofrece un equivalente al operador <span style="direction: ltr;"><code>LIKE</code> en SQL. </span></li>
-</ul>
-
-<p>Adicionalmente, tenga en cuenta que los navegadores podrían eliminar la base de datos, como en las siguientes condiciones:</p>
-
-<ul>
- <li>El usuario pide borrar los datos del navegador.<br>
-  Muchos navegadores tienen opciones que permiten al usuario eliminar todos los datos almacenados de un sitio, incluyendo cookies, marcadores, contraseñas, y datos de IndexedDB.</li>
- <li>El navegador está en modo de navegación privada.<br>
-  Algunos navegadores tienen modos de "navegación privada" (Firefox) o "incógnito" (Chrome). Al final de la sesión, el navegador elimina la base de datos.</li>
- <li>Se alcanza el límite de espacio en disco.</li>
- <li>Los datos se corrompen.</li>
- <li>Se realiza un cambio incompatible a ésta característica.</li>
-</ul>
-
-<p>Las circunstancias exactas y capacidades de los navegadores cambian con el tiempo, pero la filosofía de los navegadores es, en general, hacer lo posible por conservar los datos.</p>
-
-<div class="warning">
-<p><strong>Advertencia:</strong> Al momento, debido a errores o a propósito, es imposible abrir una base de datos IndexedDB desde un <a href="https://developer.mozilla.org/en-US/docs/Accessibility/An_overview_of_accessible_web_applications_and_widgets" title="/en-US/docs/Accessibility/An_overview_of_accessible_web_applications_and_widgets">Web App</a>. Esto requiere mayor investigación para documentarlo.</p>
-</div>
-
-<h2 id="next" name="next">Próximo paso</h2>
-
-<p>Ok, ahora con estos conceptos generales bajo nuestros cinturones, podemos seguir a cosas más concretas. Para un tutorial sobre como utilizar la API, vea <a href="/en/IndexedDB/Using_IndexedDB" title="en/IndexedDB/IndexedDB primer">Usando IndexedDB</a>.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<p>Especificación</p>
-
-<ul>
- <li><a href="http://www.w3.org/TR/IndexedDB/" title="http://www.w3.org/TR/IndexedDB/"><span style="direction: ltr;">Especificación de la API de IndexedDB</span></a></li>
-</ul>
-
-<p>Referencia</p>
-
-<ul>
- <li><a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">Referencia de la API de IndexedDB</a></li>
-</ul>
-
-<p>Tutoriales</p>
-
-<ul>
- <li><a href="/en/IndexedDB/Using_IndexedDB" title="en/IndexedDB/IndexedDB primer">Usando IndexedDB</a></li>
- <li><a class="external" href="http://www.html5rocks.com/tutorials/indexeddb/todo/" title="http://www.html5rocks.com/tutorials/indexeddb/todo/">Una lista de tareas sencilla usando HTML5 e IndexedDB</a><span class="external">. </span><span class="external"> {{ Note("Este ejemplo usa una versión antigua de la especificación y no funciona en las versiones más recientes de los navegadores principales (aún utiliza el método <code>setVersion()</code>, que fue removido.") }}</span></li>
-</ul>
-
-<p>Artículo relacionado</p>
-
-<ul>
- <li><a class="external" href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx" title="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — El almacén en su navegador</a></li>
-</ul>
diff --git a/files/es/web/api/indexeddb_api/usando_indexeddb/index.html b/files/es/web/api/indexeddb_api/usando_indexeddb/index.html
deleted file mode 100644
index ea9d2d879c..0000000000
--- a/files/es/web/api/indexeddb_api/usando_indexeddb/index.html
+++ /dev/null
@@ -1,1308 +0,0 @@
----
-title: Usando IndexedDB
-slug: Web/API/IndexedDB_API/Usando_IndexedDB
-tags:
-  - API
-  - Almacenamiento
-  - Avanzado
-  - Base de datos
-  - Guía
-  - IndexedDB
-  - Tutorial
-  - jsstore
-translation_of: Web/API/IndexedDB_API/Using_IndexedDB
----
-<div class="summary">
-<p>IndexedDB es una manera de almacenar datos dentro del navegador del usuario. Debido a que permite la creación de aplicaciones con habilidades de consulta enriquecidas, con independencia de la disponibilidad de la red, sus aplicaciones pueden trabajar tanto en línea como fuera de línea.</p>
-</div>
-
-<h2 id="Acerca_de_este_documento">Acerca de este documento</h2>
-
-<p>Este tutorial es una guía sobre el uso de la API asíncrona de IndexedDB. Si no está familiarizado con IndexedDB, por favor consulte primero <a href="/en/IndexedDB/Basic_Concepts_Behind_IndexedDB" style="line-height: 1.5;" title="en/IndexedDB/Basic Concepts Behind IndexedDB">Conceptos Básicos Acerca de IndexedDB</a><span style="line-height: 1.5;">.</span></p>
-
-<p>Para la documentación de referencia sobre la API de IndexedDB, vea el artículo <a href="/es/docs/IndexedDB" style="line-height: 1.5;" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a><span style="line-height: 1.5;"> y sus subpaginas, que documentan los tipos de objetos usados por IndexedDB, así como los métodos síncronos y asíncronos. </span></p>
-
-<h2 id="pattern" name="pattern">Patrones Básicos</h2>
-
-<p>El patrón básico que indexedDB propone es:</p>
-
-<ol>
- <li>Abrir una base de datos.</li>
- <li>Crear un objeto de almacenamiento en la base de datos.</li>
- <li>Iniciar una transacción y hacer una petición para hacer alguna operación de la base de datos, tal como añadir o recuperar datos.</li>
- <li>
-  <div><span id="result_box" lang="es"><span class="hps">Espere a que</span> <span class="hps">se complete la operación</span> <span class="hps">por</span> <span class="hps">la escucha de la</span> <span class="hps">clase correcta de</span> <span class="hps">eventos DOM</span></span> .</div>
- </li>
- <li>
-  <div>Hacer algo con el resultado (El cual puede ser encontrado en el objeto de la petición).</div>
- </li>
-</ol>
-
-<p>Con esos grandes rasgos en mente, seremos más concretos.</p>
-
-<h2 id="open" name="open">Creando y estructurando el almacenamiento</h2>
-
-<p>Como las especificaciones están todavía elaborandose, las implementaciones actuales de indexedDB dependen de los navegadores. H<span id="result_box" lang="es"><span class="hps">asta que la</span> <span class="hps">especificación</span> <span class="hps">se haya consolidado, l</span></span>os proveedores de navegadores pueden tener diferentes implementaciones de los estandares de indexedDB<span id="result_box" lang="es"><span>.</span></span> Una vez se alcance el consenso en el estandar, los proveedores implementarán la API sin prefijos. En algunas implementaciones ya fueron removidos los prefijos: Internet Explorer 10, Firefox 16, Chrome 24. Cuando utilizan un prefijo, los navegadores basados en gecko usan el prefijo <code>moz</code> , mientras que los navegadores basados en WebKit usan el prefijo <code>webkit</code>.</p>
-
-<h3 id="Usando_una_versión_experimental_de_IndexedDB">Usando una versión experimental de IndexedDB</h3>
-
-<p>En caso que usted quiera probar su código en navegadores que todavía usen un prefijo, puede usar el siguiente codigo:  </p>
-
-<pre class="brush: js">// En la siguiente línea, puede incluir prefijos de implementación que quiera probar.
-window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
-// No use "var indexedDB = ..." Si no está en una función.
-// Por otra parte, puedes necesitar referencias a algun objeto window.IDB*:
-window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction;
-window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;
-// (Mozilla nunca ha prefijado estos objetos, por lo tanto no necesitamos window.mozIDB*)</pre>
-
-<p>Hay que tener cuidado con las implementaciones que usan un prefijo ya que puede ser inestables, incompletas, o usen una versión antigua de la especificación. En producción se recomienda usar el código sin prefijos. Es preferible no tener soporte para un navegador a decir que lo tiene y fallar en ello :</p>
-
-<pre class="brush: js">if (!window.indexedDB) {
-    window.alert("Su navegador no soporta una versión estable de indexedDB. Tal y como las características no serán validas");
-}
-</pre>
-
-<h3 id="Abriendo_una_base_de_datos">Abriendo una base de datos</h3>
-
-<p>Iniciamos todo el proceso así:</p>
-
-<pre class="brush: js">// dejamos abierta nuestra base de datos
-var request = window.indexedDB.open("MyTestDatabase", 3);
-</pre>
-
-<p>¿Lo has visto? Abrir una base de datos es igual que cualquier otra operación — solo tienes que "solicitarla" (request).</p>
-
-<p>La solicitud de apertura no abre la base de datos o inicia la transacción de inmediato. La llamada a la función <code>open()</code> retornan unos objetos <code><a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="/en-US/docs/IndexedDB/IDBOpenDBRequest">IDBOpenDBRequest</a>,</code> cuyo resultado, correcto o erróneo, se maneja en un evento.  Alguna otra función asincrónica en indexedDB hace lo mismo - Devolver un objeto <a href="/en-US/docs/IndexedDB/IDBRequest" title="/en-US/docs/IndexedDB/IDBRequest"><code style="font-size: 14px; color: rgb(51, 51, 51);">IDBRequest</code></a> que disparará un evento con el resultado o el error. El resultado para la función de abrir es una instancia de un <code style="font-size: 14px; color: rgb(51, 51, 51);"><a href="/en-US/docs/IndexedDB/IDBDatabase" title="/en-US/docs/IndexedDB/IDBDatabase">IDBDatabase</a>.</code></p>
-
-<p>El segundo parámetro para el método open es la versión de la base de datos. La versión de la base de datos determina el esquema - El almacen de objectos en la base de datos y su estructura. Si la base de datos no existe, es creada y se dispara un evento <code>onupgradeneeded</code> de inmediato, permitiéndote proveer una actualización de la estructura e índices en la función que capture dicho evento. Se verá más adelante en  <a href="#Updating_the_version_of_the_database">Actualizando la versión de la base de datos</a>. </p>
-
-<div class="warning">
-<p><strong>Importante</strong>: El número de versión es un <code>unsigned long</code>. Por lo tanto significa que puede ser un entero muy grande. También significa que si usas un flotante será convertido en un entero más cercano y la transacción puede no ser iniciada, el evento <code>upgradeneeded </code>no se desencadenará. Por ejemplo no use 2.4 como un número de versión ya que será igual que la 2:</p>
-
-<pre class="brush: js">var request = indexedDB.open("MyTestDatabase", 2.4); // Esto no se hace, la versión será redondeada a 2</pre>
-</div>
-
-<h4 id="Generando_manipuladores">Generando manipuladores</h4>
-
-<p>La primera cosa que usted querrá hacer con la totalidad de las peticiones que usted genera es agregar controladores de éxito y de error:</p>
-
-<pre class="brush: js">request.onerror = function(event) {
-  // Hacer algo con request.errorCode!
-};
-request.onsuccess = function(event) {
-  // Hacer algo con request.result!
-};</pre>
-
-<p>¿Cuál de las dos funciones, onSuccess () o onerror (), se vuelve a llamar? Si todo tiene éxito, un evento de éxito (es decir, un evento DOM cuya propiedad tipo se establece en el "éxito") se dispara con la solicitud como su objetivo. Una vez que se dispara, la función onSuccess () a petición se activa con el evento de éxito como argumento. De lo contrario, si había algún problema, un evento de error (es decir, un evento DOM cuyo tipo de propiedad se establece en "error") se dispara a petición. Esto desencadena la función onerror () con el evento de error como argumento.</p>
-
-<p>La API IndexedDB está diseñada para minimizar la necesidad de control de errores, por lo que no es probable que veamos muchos eventos de error (al menos, no una vez que estás acostumbrado a la API). En el caso de la apertura de una base de datos, sin embargo, hay algunas condiciones comunes que generan eventos de error. El problema más común se produce cuando el usuario ha decidido no dar, a su aplicación web, el permiso para crear una base de datos. Uno de los principales objetivos de diseño de IndexedDB es permitir que grandes cantidades de datos se almacenen para su uso sin conexión a internet. (Para obtener más información sobre la cantidad de almacenamiento que puede tener para cada navegador, consulte <a href="https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API#Storage_limits">Límites de almacenamiento</a>.)  </p>
-
-<p>Obviamente, los navegadores no permitirán que alguna red de publicidad o sitio web malicioso pueda contaminar su ordenador, por ello los navegadores utilizan un diálogo para indicar al usuario la primera vez que cualquier aplicación web determinada intente abrir una IndexedDB para el almacenamiento. El usuario puede optar por permitir o denegar el acceso. Además, el almacenamiento IndexedDB en los modos de privacidad navegadores sólo dura en memoria hasta que la sesión de incógnito haya sido cerrada (modo de navegación privada para el modo de Firefox e Incognito para Chrome, pero en Firefox <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=781982">no está implementado</a> a partir de noviembre 2015 por lo que no puede utilizar IndexedDB en Firefox navegación privada en absoluto).</p>
-
-<p>Ahora, asumiendo que el usuario acepta su solicitud para crear una base de datos, y que ha recibido un evento de éxito para activar la devolución de llamada de éxito; ¿Que sigue? La solicitud aquí se generó con una llamada a indexedDB.open (), por lo request.result es una instancia de IDBDatabase, y que sin duda quieren ahorrar para más adelante. Su código podría ser algo como esto:</p>
-
-<pre class="brush: js">var db;
-var request = indexedDB.open("MyTestDatabase");
-request.onerror = function(event) {
-  alert("Why didn't you allow my web app to use IndexedDB?!");
-};
-request.onsuccess = function(event) {
-  db = request.result;
-};
-</pre>
-
-<h4 id="Manejando_errores">Manejando errores</h4>
-
-<p>Como se mencionó anteriormente, los eventos de error de burbujas. Eventos de error se dirigen a la solicitud que generó el error, entonces el evento se propaga a la operación, y finalmente con el objeto de base de datos. Si desea evitar la adición de controladores de errores a cada solicitud, en su lugar puede añadir un solo controlador de errores en el objeto de base de datos, así:</p>
-
-<pre class="brush: js">db.onerror = function(event) {
-  // Generic error handler for all errors targeted at this database's
-  // requests!
-  alert("Database error: " + event.target.errorCode);
-};
-</pre>
-
-<p>Uno de los errores más comunes posibles al abrir una base de datos es <code>VER_ERR</code>. Indica que la versión de la base de datos almacenada en el disco es mayor que la versión que está intentando abrir. Este es un caso de error que siempre debe ser manejado por el gestor de errores.</p>
-
-<h3 id="Creación_o_actualización_de_la_versión_de_la_base_de_datos">Creación o actualización de la versión de la base de datos</h3>
-
-<p>Cuando se crea una nueva base de datos o se aumenta el número de versión de una base de datos existente (mediante la especificación de un número de versión más alto de lo que hizo antes, en {{anch ("Cómo abrir una base de datos")}}), el evento onupgradeneeded se activará y un objeto <a href="https://developer.mozilla.org/en-US/docs/Web/API/IDBVersionChangeEvent">IDBVersionChangeEvent</a> será pasado a cualquier controlador de eventos <code>onversionchange</code> establecido en <code>request.result</code> (es decir, db en el ejemplo). En el controlador para el evento <code>upgradeneeded</code>, se debe crear los almacenes de objetos necesarios para esta versión de la base de datos:</p>
-
-<pre class="brush:js;">// Este evento solamente está implementado en navegadores recientes
-request.onupgradeneeded = function(event) {
-  var db = event.target.result;
-
-  // Crea un almacén de objetos (objectStore) para esta base de datos
-  var objectStore = db.createObjectStore("name", { keyPath: "myKey" });
-};</pre>
-
-<p>En este caso, la base de datos ya tendrá los almacenes de objetos de la versión anterior de la base de datos, por lo que no tiene que crear estos almacenes de objetos de nuevo. Sólo es necesario crear nuevos almacenes de objetos, o eliminar las tiendas de objetos de la versión anterior que ya no son necesarios. Si necesita cambiar un almacén de objetos existentes (por ejemplo, para cambiar la ruta de acceso clave <code>keyPath</code>), entonces se debe eliminar el antiguo almacén de objetos y crear de nuevo con las nuevas opciones. (Tenga en cuenta que esto borrará la información en el almacén de objetos Si usted necesita guardar esa información, usted debe leerlo y guardarlo en otro lugar antes de actualizar la base de datos.)</p>
-
-<p>Tratar de crear un almacén de objetos con un nombre que ya existe (o tratando de eliminar un almacén de objetos con un nombre que no existe) lanzará un error.</p>
-
-<p>Si el evento <code>onupgradeneeded</code> retorna éxito, entonces se activará el manejador <code>onsuccess</code> de la solicitud de base de datos abierta.</p>
-
-<p>Blink / Webkit soportan la versión actual de la especificación, tal como fue liberado en Chrome 23+ y Opera 17+ ; IE10+ también lo soporta. Implementaciones mas viejas o distintas no implementan la versión actual de la especificación, y por lo tanto no son compatibles todavía con el <code>indexedDB.open (nombre, versión).onupgradeneeded</code> . Para obtener más información sobre cómo actualizar la versión de la base de datos en Webkit/Blink mas viejos, consulte el artículo de referencia <a href="/es/docs/Web/API/IDBDatabase" title="https://developer.mozilla.org/en/IndexedDB/IDBDatabase#setVersion()_.0A.0ADeprecated">IDBDatabase</a>.</p>
-
-<h3 id="Estructuración_de_la_base_de_datos">Estructuración de la base de datos</h3>
-
-<p>Ahora para estructurar la base de datos. IndexedDB usa almacenes de datos (object stores) en lugar de tablas, y una base de datos puede contener cualquier número de almacenes. Cuando un valor es almacenado, se le asocia con una clave. Existen diversas maneras en que una clave pude ser indicada dependiendo de si el almacén usa una <a href="https://developer.mozilla.org/en/IndexedDB/Basic_Concepts_Behind_IndexedDB#gloss_keypath">ruta de clave</a> o <a href="https://developer.mozilla.org/en/IndexedDB/Basic_Concepts_Behind_IndexedDB#gloss_keygenerator">generador</a>.</p>
-
-<p>La siguiente table muetra las distintas formas en que las claves pueden ser indicadas:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Ruta de clave(<code>keyPath</code>)</th>
-   <th scope="col">Generador de clave (<code>autoIncrement</code>)</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>No</td>
-   <td>No</td>
-   <td>Este almacén puede contener cualquier tipo de valor, incluso valores primitivos como números y cadenas. Se debe indicar un argumento de clave distinto cada vez que se agregue un nuevo valor.</td>
-  </tr>
-  <tr>
-   <td>Si</td>
-   <td>No</td>
-   <td>Este almacén de objetos solo puede contener objetos de JavaScript. Los objetos deben tener una propiedad con el mismo nombre que la ruta de clave.</td>
-  </tr>
-  <tr>
-   <td>No</td>
-   <td>Si</td>
-   <td>Este objeto puede contener cualquier tipo de valor. La clave es generada automáticamente, o se puede indicar un argumento de clave distinto si se quiere usar una clave específica.</td>
-  </tr>
-  <tr>
-   <td>Si</td>
-   <td>Si</td>
-   <td>
-    <p>Este almacén de objetos solo puede contener objetos de JavaScript. Usualmente una clave es generada y dicho valor es almacenado en el objeto en una propiedad con el mismo nombre que la ruta de clave. Sin embargo, si dicha propiedad ya existe en el objeto, el valor de esa propuiedad es usado como clave en lugar de generar una nueva.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>También se puede crear índices en cualquer almacén de objetos, siempre y cuando el almacén contenga objets, y no primitivos. Un índice permite buscar valores contenidos en el almacén usando el valor de una propiedad del objeto almacenado, en lugar de la clave del mismo.</p>
-
-<p>Adicionalmente, los índices tienen la habilidad para hacer cumplir restricciones simples en los datos almacendos. Al indicar la bandera <code>unique</code> al crear el índice, el índice asegurará que no se puedan almacenar dos objetos que tengan el mismo valor para la clave del índice. Así, por ejemplo si se tiene un almacén de objetos que contiene un set de personas, y se desea asegurar que no existan dos personas con el mismo email, se puede usar un índice con la bandera <code>unique</code> activada para forzar esto.</p>
-
-<p>Esto puede sonar confuso, pero un ejemplo simple debe ilustrar el concepto. Primero, definiremos alguna información de clientes para usar en nuestro ejemplo:</p>
-
-<pre class="brush: js">// Así se ve nuestra información de clientes.
-const customerData = [
-  { ssn: "444-44-4444", name: "Bill", age: 35, email: "bill@company.com" },
-  { ssn: "555-55-5555", name: "Donna", age: 32, email: "donna@home.org" }
-];
-</pre>
-
-<p>Ahora, creemos una IndexedDB para almacenar los datos:</p>
-
-<pre class="brush: js">const dbName = "the_name";
-
-var request = indexedDB.open(dbName, 2);
-
-request.onerror = function(event) {
-  // Manejar errores.
-};
-request.onupgradeneeded = function(event) {
-  var db = event.target.result;
-
-  // Se crea un almacén para contener la información de nuestros cliente
-  // Se usará "ssn" como clave ya que es garantizado que es única
-  var objectStore = db.createObjectStore("customers", { keyPath: "ssn" });
-
-  // Se crea un índice para buscar clientes por nombre. Se podrían tener duplicados
-  // por lo que no se puede usar un índice único.
-  objectStore.createIndex("name", "name", { unique: false });
-
-  // Se crea un índice para buscar clientespor email. Se quiere asegurar que
-  // no puedan haberdos clientes con el mismo email, asi que se usa un índice único.
-  objectStore.createIndex("email", "email", { unique: true });
-
-  // Se usa transaction.oncomplete para asegurarse que la creación del almacén
-  // haya finalizado antes de añadir los datos en el.
-  objectStore.transaction.oncomplete = function(event) {
-    // Guarda los datos en el almacén recién creado.
-    var customerObjectStore = db.transaction("customers", "readwrite").objectStore("customers");
-    for (var i in customerData) {
-      customerObjectStore.add(customerData[i]);
-    }
-  }
-};
-</pre>
-
-<p>Como se indicó previamente, <code>onupgradeneeded</code> es el único lugar donde se puede alterar la estructura de la base de datos. En el, se puede crear y borrar almacenes de objetos y construir y remover índices.</p>
-
-<div>Los almacenes de datos son creados con una llamada a  <code>createObjectStore()</code>. El método toma como parámetros el nombre del almacén y un objeto.  A pesar de que el segundo parámetro es opcional, es muy importante, porque permite definir propiedades opcionales importantes y refinar el tipo de almacén que se desea crear. En este caso, se pregunta por un almacén llamado "customers" y se define la clave, que es la propiedad que indica que un objeto en el almacén es único. La propiedad en este ejemplo es "ssn" (Social Security Number) ya que los números de seguridad social está garantizado que sea único. "ssn" debe estar presente en cada objeto que se guarda al almacén.</div>
-
-<p>También se solicitó crear un índice llamado "name" que se fija en la propiedad <code>name </code>de los objetos almacenados. Así como con <code>createObjectStore()</code>, <code>createIndex()</code> toma un objeto opcional <code>options</code> que refina el tipo de índice que se desea crear. Agregar objetos que no tengan una propiedad <code>name</code> funcionará, pero los objetos no aparecerán en el índice "name"</p>
-
-<div>Ahora se pueden obtener los clientes almacenados usando su <code>ssn</code> directamente del almacen, o usando su nombre a través del índice. Para aprender como hacer esto, vea la sección <a href="#El_uso_de_un_índice">El uso de un índice</a></div>
-
-<h3 id="El_uso_de_un_generador_de_claves">El uso de un generador de claves</h3>
-
-<p>Indicar la bandera <code>autoIncrement </code> cuando se crea el almacén habilitará el generador de claves para dicho almacén. Por defecto esta bandera no está marcada.</p>
-
-<p>Con el generador de claves, la clave será generada automáticamente a medida que se agreguen valores al almacén. El número actual de un generador de claves siempre se establece en 1 cuando se creal el almacén por primera vez. Básicamente la nueva clave autogenerada es incrementada en 1 basada en la llave anterior. El numero actual para un generador de claves nunca disminuye, salvo como resultado de operaciones de base de datos  que sean revertidos, por ejemplo, cuando la transacción de base de datos es abortada. Por lo tanto borrar un registro o incluso borrar todos los registros de un almacén nunca afecta al generador de claves</p>
-
-<p>Se puede crear otro almacén de objetos con generador de claves como se muestra abajo:</p>
-
-<pre class="brush: js">// Abrir la indexedDB.
-var request = indexedDB.open(dbName, 3);
-
-request.onupgradeneeded = function (event) {
-
-    var db = event.target.result;
-
-    // Create another object store called "names" with the autoIncrement flag set as true.
-    var objStore = db.createObjectStore("names", { autoIncrement : true });
-
-    // Because the "names" object store has the key generator, the key for the name value is generated automatically.
-    // The added records would be like:
-    // key : 1 =&gt; value : "Bill"
-    // key : 2 =&gt; value : "Donna"
-    for (var i in customerData) {
-        objStore.add(customerData[i].name);
-    }
-}</pre>
-
-<p>Para más detalles acerca del generador de claves, por favor ver <a href="http://www.w3.org/TR/IndexedDB/#key-generator-concept">"W3C Key Generators"</a>.</p>
-
-<h2 id="Añadir_recuperación_y_eliminación_de_datos">Añadir, recuperación y eliminación de datos</h2>
-
-<p>Antes que haga algo con su nueva base de datos , necesita comenzar una transacción. Transactions come from the database object, and you have to specify which object stores you want the transaction to span. Once you are inside the transaction, you can access the object stores that hold your data and make your requests. Next, you need to decide if you're going to make changes to the database or if you just need to read from it. Transactions have three available modes: <code>readonly</code>, <code>readwrite</code>, and <code>versionchange</code>.</p>
-
-<p>To change the "schema" or structure of the database—which involves creating or deleting object stores or indexes—the transaction must be in <code>versionchange</code> mode. This transaction is opened by calling the {{domxref("IDBFactory.open")}} method with a <code>version</code> specified. (In WebKit browsers, which have not implemented the latest specifcation, the {{domxref("IDBFactory.open")}} method takes only one parameter, the <code>name</code> of the database; then you must call {{domxref("IDBVersionChangeRequest.setVersion")}} to establish the <code>versionchange</code> transaction.)</p>
-
-<p>To read the records of an existing object store, the transaction can either be in <code>readonly</code> or <code>readwrite</code> mode. To make changes to an existing object store, the transaction must be in <code>readwrite</code> mode. You open such transactions with {{domxref("IDBDatabase.transaction")}}. The method accepts two parameters: the <code>storeNames</code> (the scope, defined as an array of object stores that you want to access) and the <code>mode</code> (<code>readonly</code> or <code>readwrite</code>) for the transaction. The method returns a transaction object containing the {{domxref("IDBIndex.objectStore")}} method, which you can use to access your object store. By default, where no mode is specified, transactions open in <code>readonly</code> mode.</p>
-
-<p>You can speed up data access by using the right scope and mode in the transaction. Here are a couple of tips:</p>
-
-<ul>
- <li>When defining the scope, specify only the object stores you need. This way, you can run multiple transactions with non-overlapping scopes concurrently.</li>
- <li>Only specify a <code>readwrite</code> transaction mode when necessary. You can concurrently run multiple <code>readonly</code> transactions with overlapping scopes, but you can have only one <code>readwrite</code> transaction for an object store. To learn more, see the definition for <dfn><a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB#Database">transactions</a></dfn> in the <a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB">Basic Concepts</a> article.</li>
-</ul>
-
-<h3 id="Agregar_datos_a_la_base_de_datos">Agregar datos a la base de datos</h3>
-
-<p>If you've just created a database, then you probably want to write to it. Here's what that looks like:</p>
-
-<pre class="brush:js;">var transaction = db.transaction(["customers"], "readwrite");
-// Note: Older experimental implementations use the deprecated constant IDBTransaction.READ_WRITE instead of "readwrite".
-// In case you want to support such an implementation, you can write:
-// var transaction = db.transaction(["customers"], IDBTransaction.READ_WRITE);</pre>
-
-<p>The <code>transaction()</code> function takes two arguments (though one is optional) and returns a transaction object. The first argument is a list of object stores that the transaction will span. You can pass an empty array if you want the transaction to span all object stores, but don't do it because the spec says an empty array should generate an InvalidAccessError. If you don't specify anything for the second argument, you get a read-only transaction. Since you want to write to it here you need to pass the <code>"readwrite"</code> flag.</p>
-
-<p>Now that you have a transaction you need to understand its lifetime. Transactions are tied very closely to the event loop. If you make a transaction and return to the event loop without using it then the transaction will become inactive. The only way to keep the transaction active is to make a request on it. When the request is finished you'll get a DOM event and, assuming that the request succeeded, you'll have another opportunity to extend the transaction during that callback. If you return to the event loop without extending the transaction then it will become inactive, and so on. As long as there are pending requests the transaction remains active. Transaction lifetimes are really very simple but it might take a little time to get used to. A few more examples will help, too. If you start seeing <code>TRANSACTION_INACTIVE_ERR</code> error codes then you've messed something up.</p>
-
-<p>Transactions can receive DOM events of three different types: <code>error</code>, <code>abort</code>, and <code>complete</code>. We've talked about the way that <code>error</code> events bubble, so a transaction receives error events from any requests that are generated from it. A more subtle point here is that the default behavior of an error is to abort the transaction in which it occurred. Unless you handle the error by first calling <code>preventDefault()</code> on the error event then doing something else, the entire transaction is rolled back. This design forces you to think about and handle errors, but you can always add a catchall error handler to the database if fine-grained error handling is too cumbersome. If you don't handle an error event or if you call <code>abort()</code> on the transaction, then the transaction is rolled back and an <code>abort</code> event is fired on the transaction. Otherwise, after all pending requests have completed, you'll get a <code>complete</code> event. If you're doing lots of database operations, then tracking the transaction rather than individual requests can certainly aid your sanity.</p>
-
-<p>Now that you have a transaction, you'll need to get the object store from it. Transactions only let you have an object store that you specified when creating the transaction. Then you can add all the data you need.</p>
-
-<pre class="brush: js">// Do something when all the data is added to the database.
-transaction.oncomplete = function(event) {
-  alert("All done!");
-};
-
-transaction.onerror = function(event) {
-  // Don't forget to handle errors!
-};
-
-var objectStore = transaction.objectStore("customers");
-for (var i in customerData) {
-  var request = objectStore.add(customerData[i]);
-  request.onsuccess = function(event) {
-    // event.target.result == customerData[i].ssn;
-  };
-}</pre>
-
-<p>The <code>result</code> of a request generated from a call to <code>add()</code> is the key of the value that was added. So in this case, it should equal the <code>ssn</code> property of the object that was added, since the object store uses the <code>ssn</code> property for the key path. Note that the <code>add()</code> function requires that no object already be in the database with the same key. If you're trying to modify an existing entry, or you don't care if one exists already, you can use the <code>put()</code> function, as shown below in the {{ anch("Updating an entry in the database") }} section.</p>
-
-<h3 id="Extracción_de_datos_de_la_base_de_datos">Extracción de datos de la base de datos</h3>
-
-<p>Removing data is very similar:</p>
-
-<pre class="brush: js">var request = db.transaction(["customers"], "readwrite")
-                .objectStore("customers")
-                .delete("444-44-4444");
-request.onsuccess = function(event) {
-  // It's gone!
-};</pre>
-
-<h3 id="Obtener_datos_de_la_base_de_datos">Obtener datos de la base de datos</h3>
-
-<p>Now that the database has some info in it, you can retrieve it in several ways. First, the simple <code>get()</code>. You need to provide the key to retrieve the value, like so:</p>
-
-<pre class="brush: js">var transaction = db.transaction(["customers"]);
-var objectStore = transaction.objectStore("customers");
-var request = objectStore.get("444-44-4444");
-request.onerror = function(event) {
-  // Handle errors!
-};
-request.onsuccess = function(event) {
-  // Do something with the request.result!
-  alert("Name for SSN 444-44-4444 is " + request.result.name);
-};</pre>
-
-<p>That's a lot of code for a "simple" retrieval. Here's how you can shorten it up a bit, assuming that you handle errors at the database level:</p>
-
-<pre class="brush: js">db.transaction("customers").objectStore("customers").get("444-44-4444").onsuccess = function(event) {
-  alert("Name for SSN 444-44-4444 is " + event.target.result.name);
-};</pre>
-
-<p>See how this works? Since there's only one object store, you can avoid passing a list of object stores you need in your transaction and just pass the name as a string. Also, you're only reading from the database, so you don't need a <code>"readwrite"</code> transaction. Calling <code>transaction()</code> with no mode specified gives you a <code>"readonly"</code> transaction. Another subtlety here is that you don't actually save the request object to a variable. Since the DOM event has the request as its target you can use the event to get to the <code>result</code> property.</p>
-
-<div class="note">
-<p><strong>Note</strong>: You can speed up data access by limiting the scope and mode in the transaction. Here are a couple of tips:</p>
-
-<ul>
- <li>
-  <p>When defining the <a href="#scope">scope</a>, specify only the object stores you need. This way, you can run multiple transactions with non-overlapping scopes concurrently.</p>
- </li>
- <li>
-  <p>Only specify a <code>readwrite</code> transaction mode when necessary. You can concurrently run multiple <code>readonly</code> transactions with overlapping scopes, but you can have only one <code>readwrite</code> transaction for an object store. To learn more, see the definition for <a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB#gloss_transaction"><dfn>transactions</dfn> in the Basic Concepts article</a>.</p>
- </li>
-</ul>
-</div>
-
-<h3 id="Actualización_de_una_entrada_en_la_base_de_datos">Actualización de una entrada en la base de datos</h3>
-
-<p>Now we've retrieved some data, updating it and inserting it back into the IndexedDB is pretty simple. Let's update the previous example somewhat:</p>
-
-<pre class="brush: js">var objectStore = db.transaction(["customers"], "readwrite").objectStore("customers");
-var request = objectStore.get("444-44-4444");
-request.onerror = function(event) {
-  // Handle errors!
-};
-request.onsuccess = function(event) {
-  // Get the old value that we want to update
-  var data = request.result;
-
-  // update the value(s) in the object that you want to change
-  data.age = 42;
-
-  // Put this updated object back into the database.
-  var requestUpdate = objectStore.put(data);
-   requestUpdate.onerror = function(event) {
-     // Do something with the error
-   };
-   requestUpdate.onsuccess = function(event) {
-     // Success - the data is updated!
-   };
-};</pre>
-
-<p>So here we're creating an <code>objectStore</code> and requesting a customer record out of it, identified by its ssn value (<code>444-44-4444</code>). We then put the result of that request in a variable (<code>data</code>), update the <code>age</code> property of this object, then create a second request (<code>requestUpdate</code>) to put the customer record back into the <code>objectStore</code>, overwriting the previous value.</p>
-
-<div class="note">
-<p><strong>Note</strong> that in this case we've had to specify a <code>readwrite</code> transaction because we want to write to the database, not just read out of it.</p>
-</div>
-
-<h3 id="El_uso_de_un_cursor">El uso de un cursor</h3>
-
-<p>Using <code>get()</code> requires that you know which key you want to retrieve. If you want to step through all the values in your object store, then you can use a cursor. Here's what it looks like:</p>
-
-<pre class="brush: js">var objectStore = db.transaction("customers").objectStore("customers");
-
-objectStore.openCursor().onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    alert("Name for SSN " + cursor.key + " is " + cursor.value.name);
-    cursor.continue();
-  }
-  else {
-    alert("No more entries!");
-  }
-};</pre>
-
-<p>The<code> openCursor()</code> function takes several arguments. First, you can limit the range of items that are retrieved by using a key range object that we'll get to in a minute. Second, you can specify the direction that you want to iterate. In the above example, we're iterating over all objects in ascending order. The success callback for cursors is a little special. The cursor object itself is the <code>result</code> of the request (above we're using the shorthand, so it's <code>event.target.result</code>). Then the actual key and value can be found on the <code>key</code> and <code>value</code> properties of the cursor object. If you want to keep going, then you have to call <code>continue()</code> on the cursor. When you've reached the end of the data (or if there were no entries that matched your <code>openCursor()</code> request) you still get a success callback, but the <code>result</code> property is <code>undefined</code>.</p>
-
-<p>One common pattern with cursors is to retrieve all objects in an object store and add them to an array, like this:</p>
-
-<pre class="brush: js">var customers = [];
-
-objectStore.openCursor().onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    customers.push(cursor.value);
-    cursor.continue();
-  }
-  else {
-    alert("Got all customers: " + customers);
-  }
-};</pre>
-
-<div class="note">
-<p>Note: Mozilla has also implemented <code>getAll()</code> to handle this case (and <code>getAllKeys()</code>, which is currently hidden behind the <code>dom.indexedDB.experimental</code> preference in about:config). these aren't part of the IndexedDB standard, so may disappear in the future. We've included them because we think they're useful. The following code does precisely the same thing as above:</p>
-
-<pre class="brush: js">objectStore.getAll().onsuccess = function(event) {
-  alert("Got all customers: " + event.target.result);
-};</pre>
-
-<p>There is a performance cost associated with looking at the <code>value</code> property of a cursor, because the object is created lazily. When you use <code>getAll()</code> for example, Gecko must create all the objects at once. If you're just interested in looking at each of the keys, for instance, it is much more efficient to use a cursor than to use <code>getAll()</code>. If you're trying to get an array of all the objects in an object store, though, use <code>getAll()</code>.</p>
-</div>
-
-<h3 id="El_uso_de_un_índice">El uso de un índice</h3>
-
-<p>Storing customer data using the SSN as a key is logical since the SSN uniquely identifies an individual. (Whether this is a good idea for privacy is a different question, and outside the scope of this article.) If you need to look up a customer by name, however, you'll need to iterate over every SSN in the database until you find the right one. Searching in this fashion would be very slow, so instead you can use an index.</p>
-
-<pre class="brush: js">var index = objectStore.index("name");
-index.get("Donna").onsuccess = function(event) {
-  alert("Donna's SSN is " + event.target.result.ssn);
-};</pre>
-
-<p>The "name" cursor isn't unique, so there could be more than one entry with the <code>name</code> set to <code>"Donna"</code>. In that case you always get the one with the lowest key value.</p>
-
-<p>If you need to access all the entries with a given <code>name</code> you can use a cursor. You can open two different types of cursors on indexes. A normal cursor maps the index property to the object in the object store. A key cursor maps the index property to the key used to store the object in the object store. The differences are illustrated here:</p>
-
-<pre class="brush: js">// Using a normal cursor to grab whole customer record objects
-index.openCursor().onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    // cursor.key is a name, like "Bill", and cursor.value is the whole object.
-    alert("Name: " + cursor.key + ", SSN: " + cursor.value.ssn + ", email: " + cursor.value.email);
-    cursor.continue();
-  }
-};
-
-// Using a key cursor to grab customer record object keys
-index.openKeyCursor().onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    // cursor.key is a name, like "Bill", and cursor.value is the SSN.
-    // No way to directly get the rest of the stored object.
-    alert("Name: " + cursor.key + ", SSN: " + cursor.value);
-    cursor.continue();
-  }
-};</pre>
-
-<h3 id="Especificación_de_la_gama_y_la_dirección_de_los_cursores">Especificación de la gama y la dirección de los cursores</h3>
-
-<p>If you would like to limit the range of values you see in a cursor, you can use an <code>IDBKeyRange</code> object and pass it as the first argument to <code>openCursor()</code> or <code>openKeyCursor()</code>. You can make a key range that only allows a single key, or one that has a lower or upper bound, or one that has both a lower and upper bound. The bound may be "closed" (i.e., the key range includes the given value(s)) or "open" (i.e., the key range does not include the given value(s)). Here's how it works:</p>
-
-<pre class="brush: js">// Only match "Donna"
-var singleKeyRange = IDBKeyRange.only("Donna");
-
-// Match anything past "Bill", including "Bill"
-var lowerBoundKeyRange = IDBKeyRange.lowerBound("Bill");
-
-// Match anything past "Bill", but don't include "Bill"
-var lowerBoundOpenKeyRange = IDBKeyRange.lowerBound("Bill", true);
-
-// Match anything up to, but not including, "Donna"
-var upperBoundOpenKeyRange = IDBKeyRange.upperBound("Donna", true);
-
-// Match anything between "Bill" and "Donna", but not including "Donna"
-var boundKeyRange = IDBKeyRange.bound("Bill", "Donna", false, true);
-
-// To use one of the key ranges, pass it in as the first argument of openCursor()/openKeyCursor()
-index.openCursor(boundKeyRange).onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    // Do something with the matches.
-    cursor.continue();
-  }
-};</pre>
-
-<p>Sometimes you may want to iterate in descending order rather than in ascending order (the default direction for all cursors). Switching direction is accomplished by passing <code>prev</code> to the <code>openCursor()</code> function as the second argument:</p>
-
-<pre class="brush: js">objectStore.openCursor(boundKeyRange, "prev").onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    // Do something with the entries.
-    cursor.continue();
-  }
-};</pre>
-
-<p>If you just want to specify a change of direction but not constrain the results shown, you can just pass in null as the first argument:</p>
-
-<pre class="brush: js">objectStore.openCursor(null, "prev").onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    // Do something with the entries.
-    cursor.continue();
-  }
-};</pre>
-
-<p>Since the "name" index isn't unique, there might be multiple entries where <code>name</code> is the same. Note that such a situation cannot occur with object stores since the key must always be unique. If you wish to filter out duplicates during cursor iteration over indexes, you can pass <code>nextunique</code> (or <code>prevunique</code> if you're going backwards) as the direction parameter. When <code>nextunique</code> or <code>prevunique</code> is used, the entry with the lowest key is always the one returned.</p>
-
-<pre class="brush: js">index.openKeyCursor(null, "nextunique").onsuccess = function(event) {
-  var cursor = event.target.result;
-  if (cursor) {
-    // Do something with the entries.
-    cursor.continue();
-  }
-};</pre>
-
-<p>Please see "<a href="https://developer.mozilla.org/en-US/docs/Web/API/IDBCursor?redirectlocale=en-US&amp;redirectslug=IndexedDB%2FIDBCursor#Constants">IDBCursor Constants</a>" for the valid direction arguments.</p>
-
-<h2 id="Cambios_Versión_mientras_que_una_aplicación_web_está_abierto_en_otra_pestaña">Cambios Versión mientras que una aplicación web está abierto en otra pestaña</h2>
-
-<p>When your web app changes in such a way that a version change is required for your database, you need to consider what happens if the user has the old version of your app open in one tab and then loads the new version of your app in another. When you call <code>open()</code> with a greater version than the actual version of the database, all other open databases must explicitly acknowledge the request before you can start making changes to the database (an <code>onblocked</code> event is fired until tey are closed or reloaded). Here's how it works:</p>
-
-<pre class="brush: js">var openReq = mozIndexedDB.open("MyTestDatabase", 2);
-
-openReq.onblocked = function(event) {
-  // If some other tab is loaded with the database, then it needs to be closed
-  // before we can proceed.
-  alert("Please close all other tabs with this site open!");
-};
-
-openReq.onupgradeneeded = function(event) {
-  // All other databases have been closed. Set everything up.
-  db.createObjectStore(/* ... */);
-  useDatabase(db);
-}
-
-openReq.onsuccess = function(event) {
-  var db = event.target.result;
-  useDatabase(db);
-  return;
-}
-
-function useDatabase(db) {
-  // Make sure to add a handler to be notified if another page requests a version
-  // change. We must close the database. This allows the other page to upgrade the database.
-  // If you don't do this then the upgrade won't happen until the user closes the tab.
-  db.onversionchange = function(event) {
-    db.close();
-    alert("A new version of this page is ready. Please reload!");
-  };
-
-  // Do stuff with the database.
-}
-</pre>
-
-<h2 id="Seguridad">Seguridad</h2>
-
-<p>IndexedDB uses the same-origin principle, which means that it ties the store to the origin of the site that creates it (typically, this is the site domain or subdomain), so it cannot be accessed by any other origin.</p>
-
-<p>It's important to note that IndexedDB doesn't work for content loaded into a frame from another site (either {{ HTMLElement("frame") }} or {{ HTMLElement("iframe") }}. This is a security and privacy measure and can be considered analogous the blocking of third-party cookies. For more details, see {{ bug(595307) }}.</p>
-
-<h2 id="Warning_About_Browser_Shutdown">Warning About Browser Shutdown</h2>
-
-<p>When the browser shuts down (e.g., when the user selects Exit or clicks the Close button), any pending IndexedDB transactions are (silently) aborted — they will not complete, and they will not trigger the error handler. Since the user can exit the browser at any time, this means that you cannot rely upon any particular transaction to complete or to know that it did not complete. There are several implications of this behavior.</p>
-
-<p>First, you should take care to always leave your database in a consistent state at the end of every transaction. For example, suppose that you are using IndexedDB to store a list of items that you allow the user to edit. You save the list after the edit by clearing the object store and then writing out the new list. If you clear the object store in one transaction and write the new list in another transaction, there is a danger that the browser will close after the clear but before the write, leaving you with an empty database. To avoid this, you should combine the clear and the write into a single transaction. </p>
-
-<p>Second, you should never tie database transactions to unload events. If the unload event is triggered by the browser closing, any transactions created in the unload event handler will never complete. An intuitive approach to maintaining some information across browser sessions is to read it from the database when the browser (or a particular page) is opened, update it as the user interacts with the browser, and then save it to the database when the browser (or page) closes. However, this will not work. The database transactions will be created in the unload event handler, but because they are asynchronous they will be aborted before they can execute.</p>
-
-<p>In fact, there is no way to guarantee that IndexedDB transactions will complete, even with normal browser shutdown. See {{ bug(870645) }}.</p>
-
-<h2 id="Full_IndexedDB_example" name="Full_IndexedDB_example">Full IndexedDB example</h2>
-
-<h3 id="HTML_Content">HTML Content</h3>
-
-<pre class="brush: html">&lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"&gt;&lt;/script&gt;
-
-    &lt;h1&gt;IndexedDB Demo: storing blobs, e-publication example&lt;/h1&gt;
-    &lt;div class="note"&gt;
-      &lt;p&gt;
-        Works and tested with:
-      &lt;/p&gt;
-      &lt;div id="compat"&gt;
-      &lt;/div&gt;
-    &lt;/div&gt;
-
-    &lt;div id="msg"&gt;
-    &lt;/div&gt;
-
-    &lt;form id="register-form"&gt;
-      &lt;table&gt;
-        &lt;tbody&gt;
-          &lt;tr&gt;
-            &lt;td&gt;
-              &lt;label for="pub-title" class="required"&gt;
-                Title:
-              &lt;/label&gt;
-            &lt;/td&gt;
-            &lt;td&gt;
-              &lt;input type="text" id="pub-title" name="pub-title" /&gt;
-            &lt;/td&gt;
-          &lt;/tr&gt;
-          &lt;tr&gt;
-            &lt;td&gt;
-              &lt;label for="pub-biblioid" class="required"&gt;
-                Bibliographic ID:&lt;br/&gt;
-                &lt;span class="note"&gt;(ISBN, ISSN, etc.)&lt;/span&gt;
-              &lt;/label&gt;
-            &lt;/td&gt;
-            &lt;td&gt;
-              &lt;input type="text" id="pub-biblioid" name="pub-biblioid"/&gt;
-            &lt;/td&gt;
-          &lt;/tr&gt;
-          &lt;tr&gt;
-            &lt;td&gt;
-              &lt;label for="pub-year"&gt;
-                Year:
-              &lt;/label&gt;
-            &lt;/td&gt;
-            &lt;td&gt;
-              &lt;input type="number" id="pub-year" name="pub-year" /&gt;
-            &lt;/td&gt;
-          &lt;/tr&gt;
-        &lt;/tbody&gt;
-        &lt;tbody&gt;
-          &lt;tr&gt;
-            &lt;td&gt;
-              &lt;label for="pub-file"&gt;
-                File image:
-              &lt;/label&gt;
-            &lt;/td&gt;
-            &lt;td&gt;
-              &lt;input type="file" id="pub-file"/&gt;
-            &lt;/td&gt;
-          &lt;/tr&gt;
-          &lt;tr&gt;
-            &lt;td&gt;
-              &lt;label for="pub-file-url"&gt;
-                Online-file image URL:&lt;br/&gt;
-                &lt;span class="note"&gt;(same origin URL)&lt;/span&gt;
-              &lt;/label&gt;
-            &lt;/td&gt;
-            &lt;td&gt;
-              &lt;input type="text" id="pub-file-url" name="pub-file-url"/&gt;
-            &lt;/td&gt;
-          &lt;/tr&gt;
-        &lt;/tbody&gt;
-      &lt;/table&gt;
-
-      &lt;div class="button-pane"&gt;
-        &lt;input type="button" id="add-button" value="Add Publication" /&gt;
-        &lt;input type="reset" id="register-form-reset"/&gt;
-      &lt;/div&gt;
-    &lt;/form&gt;
-
-    &lt;form id="delete-form"&gt;
-      &lt;table&gt;
-        &lt;tbody&gt;
-          &lt;tr&gt;
-            &lt;td&gt;
-              &lt;label for="pub-biblioid-to-delete"&gt;
-                Bibliographic ID:&lt;br/&gt;
-                &lt;span class="note"&gt;(ISBN, ISSN, etc.)&lt;/span&gt;
-              &lt;/label&gt;
-            &lt;/td&gt;
-            &lt;td&gt;
-              &lt;input type="text" id="pub-biblioid-to-delete"
-                     name="pub-biblioid-to-delete" /&gt;
-            &lt;/td&gt;
-          &lt;/tr&gt;
-          &lt;tr&gt;
-            &lt;td&gt;
-              &lt;label for="key-to-delete"&gt;
-                Key:&lt;br/&gt;
-                &lt;span class="note"&gt;(for example 1, 2, 3, etc.)&lt;/span&gt;
-              &lt;/label&gt;
-            &lt;/td&gt;
-            &lt;td&gt;
-              &lt;input type="text" id="key-to-delete"
-                     name="key-to-delete" /&gt;
-            &lt;/td&gt;
-          &lt;/tr&gt;
-        &lt;/tbody&gt;
-      &lt;/table&gt;
-      &lt;div class="button-pane"&gt;
-        &lt;input type="button" id="delete-button" value="Delete Publication" /&gt;
-        &lt;input type="button" id="clear-store-button"
-               value="Clear the whole store" class="destructive" /&gt;
-      &lt;/div&gt;
-    &lt;/form&gt;
-
-    &lt;form id="search-form"&gt;
-      &lt;div class="button-pane"&gt;
-        &lt;input type="button" id="search-list-button"
-               value="List database content" /&gt;
-      &lt;/div&gt;
-    &lt;/form&gt;
-
-    &lt;div&gt;
-      &lt;div id="pub-msg"&gt;
-      &lt;/div&gt;
-      &lt;div id="pub-viewer"&gt;
-      &lt;/div&gt;
-      &lt;ul id="pub-list"&gt;
-      &lt;/ul&gt;
-    &lt;/div&gt;
-</pre>
-
-<h3 id="CSS_Content">CSS Content</h3>
-
-<pre class="brush: css">body {
-  font-size: 0.8em;
-  font-family: Sans-Serif;
-}
-
-form {
-  background-color: #cccccc;
-  border-radius: 0.3em;
-  display: inline-block;
-  margin-bottom: 0.5em;
-  padding: 1em;
-}
-
-table {
-  border-collapse: collapse;
-}
-
-input {
-  padding: 0.3em;
-  border-color: #cccccc;
-  border-radius: 0.3em;
-}
-
-.required:after {
-  content: "*";
-  color: red;
-}
-
-.button-pane {
-  margin-top: 1em;
-}
-
-#pub-viewer {
-  float: right;
-  width: 48%;
-  height: 20em;
-  border: solid #d092ff 0.1em;
-}
-#pub-viewer iframe {
-  width: 100%;
-  height: 100%;
-}
-
-#pub-list {
-  width: 46%;
-  background-color: #eeeeee;
-  border-radius: 0.3em;
-}
-#pub-list li {
-  padding-top: 0.5em;
-  padding-bottom: 0.5em;
-  padding-right: 0.5em;
-}
-
-#msg {
-  margin-bottom: 1em;
-}
-
-.action-success {
-  padding: 0.5em;
-  color: #00d21e;
-  background-color: #eeeeee;
-  border-radius: 0.2em;
-}
-
-.action-failure {
-  padding: 0.5em;
-  color: #ff1408;
-  background-color: #eeeeee;
-  border-radius: 0.2em;
-}
-
-.note {
-  font-size: smaller;
-}
-
-.destructive {
-  background-color: orange;
-}
-.destructive:hover {
-  background-color: #ff8000;
-}
-.destructive:active {
-  background-color: red;
-}
-</pre>
-
-<p> </p>
-
-<h3 id="JavaScript_Content">JavaScript Content</h3>
-
-<pre class="brush: js">(function () {
-  var COMPAT_ENVS = [
-    ['Firefox', "&gt;= 16.0"],
-    ['Google Chrome',
-     "&gt;= 24.0 (you may need to get Google Chrome Canary), NO Blob storage support"]
-  ];
-  var compat = $('#compat');
-  compat.empty();
-  compat.append('&lt;ul id="compat-list"&gt;&lt;/ul&gt;');
-  COMPAT_ENVS.forEach(function(val, idx, array) {
-    $('#compat-list').append('&lt;li&gt;' + val[0] + ': ' + val[1] + '&lt;/li&gt;');
-  });
-
-  const DB_NAME = 'mdn-demo-indexeddb-epublications';
-  const DB_VERSION = 1; // Use a long long for this value (don't use a float)
-  const DB_STORE_NAME = 'publications';
-
-  var db;
-
-  // Used to keep track of which view is displayed to avoid uselessly reloading it
-  var current_view_pub_key;
-
-  function openDb() {
-    console.log("openDb ...");
-    var req = indexedDB.open(DB_NAME, DB_VERSION);
-    req.onsuccess = function (evt) {
-      // Better use "this" than "req" to get the result to avoid problems with
-      // garbage collection.
-      // db = req.result;
-      db = this.result;
-      console.log("openDb DONE");
-    };
-    req.onerror = function (evt) {
-      console.error("openDb:", evt.target.errorCode);
-    };
-
-    req.onupgradeneeded = function (evt) {
-      console.log("openDb.onupgradeneeded");
-      var store = evt.currentTarget.result.createObjectStore(
-        DB_STORE_NAME, { keyPath: 'id', autoIncrement: true });
-
-      store.createIndex('biblioid', 'biblioid', { unique: true });
-      store.createIndex('title', 'title', { unique: false });
-      store.createIndex('year', 'year', { unique: false });
-    };
-  }
-
-  /**
-   * @param {string} store_name
-   * @param {string} mode either "readonly" or "readwrite"
-   */
-  function getObjectStore(store_name, mode) {
-    var tx = db.transaction(store_name, mode);
-    return tx.objectStore(store_name);
-  }
-
-  function clearObjectStore(store_name) {
-    var store = getObjectStore(DB_STORE_NAME, 'readwrite');
-    var req = store.clear();
-    req.onsuccess = function(evt) {
-      displayActionSuccess("Store cleared");
-      displayPubList(store);
-    };
-    req.onerror = function (evt) {
-      console.error("clearObjectStore:", evt.target.errorCode);
-      displayActionFailure(this.error);
-    };
-  }
-
-  function getBlob(key, store, success_callback) {
-    var req = store.get(key);
-    req.onsuccess = function(evt) {
-      var value = evt.target.result;
-      if (value)
-        success_callback(value.blob);
-    };
-  }
-
-  /**
-   * @param {IDBObjectStore=} store
-   */
-  function displayPubList(store) {
-    console.log("displayPubList");
-
-    if (typeof store == 'undefined')
-      store = getObjectStore(DB_STORE_NAME, 'readonly');
-
-    var pub_msg = $('#pub-msg');
-    pub_msg.empty();
-    var pub_list = $('#pub-list');
-    pub_list.empty();
-    // Resetting the iframe so that it doesn't display previous content
-    newViewerFrame();
-
-    var req;
-    req = store.count();
-    // Requests are executed in the order in which they were made against the
-    // transaction, and their results are returned in the same order.
-    // Thus the count text below will be displayed before the actual pub list
-    // (not that it is algorithmically important in this case).
-    req.onsuccess = function(evt) {
-      pub_msg.append('&lt;p&gt;There are &lt;strong&gt;' + evt.target.result +
-                     '&lt;/strong&gt; record(s) in the object store.&lt;/p&gt;');
-    };
-    req.onerror = function(evt) {
-      console.error("add error", this.error);
-      displayActionFailure(this.error);
-    };
-
-    var i = 0;
-    req = store.openCursor();
-    req.onsuccess = function(evt) {
-      var cursor = evt.target.result;
-
-      // If the cursor is pointing at something, ask for the data
-      if (cursor) {
-        console.log("displayPubList cursor:", cursor);
-        req = store.get(cursor.key);
-        req.onsuccess = function (evt) {
-          var value = evt.target.result;
-          var list_item = $('&lt;li&gt;' +
-                            '[' + cursor.key + '] ' +
-                            '(biblioid: ' + value.biblioid + ') ' +
-                            value.title +
-                            '&lt;/li&gt;');
-          if (value.year != null)
-            list_item.append(' - ' + value.year);
-
-          if (value.hasOwnProperty('blob') &amp;&amp;
-              typeof value.blob != 'undefined') {
-            var link = $('&lt;a href="' + cursor.key + '"&gt;File&lt;/a&gt;');
-            link.on('click', function() { return false; });
-            link.on('mouseenter', function(evt) {
-                      setInViewer(evt.target.getAttribute('href')); });
-            list_item.append(' / ');
-            list_item.append(link);
-          } else {
-            list_item.append(" / No attached file");
-          }
-          pub_list.append(list_item);
-        };
-
-        // Move on to the next object in store
-        cursor.continue();
-
-        // This counter serves only to create distinct ids
-        i++;
-      } else {
-        console.log("No more entries");
-      }
-    };
-  }
-
-  function newViewerFrame() {
-    var viewer = $('#pub-viewer');
-    viewer.empty();
-    var iframe = $('&lt;iframe /&gt;');
-    viewer.append(iframe);
-    return iframe;
-  }
-
-  function setInViewer(key) {
-    console.log("setInViewer:", arguments);
-    key = Number(key);
-    if (key == current_view_pub_key)
-      return;
-
-    current_view_pub_key = key;
-
-    var store = getObjectStore(DB_STORE_NAME, 'readonly');
-    getBlob(key, store, function(blob) {
-      console.log("setInViewer blob:", blob);
-      var iframe = newViewerFrame();
-
-      // It is not possible to set a direct link to the
-      // blob to provide a mean to directly download it.
-      if (blob.type == 'text/html') {
-        var reader = new FileReader();
-        reader.onload = (function(evt) {
-          var html = evt.target.result;
-          iframe.load(function() {
-            $(this).contents().find('html').html(html);
-          });
-        });
-        reader.readAsText(blob);
-      } else if (blob.type.indexOf('image/') == 0) {
-        iframe.load(function() {
-          var img_id = 'image-' + key;
-          var img = $('&lt;img id="' + img_id + '"/&gt;');
-          $(this).contents().find('body').html(img);
-          var obj_url = window.URL.createObjectURL(blob);
-          $(this).contents().find('#' + img_id).attr('src', obj_url);
-          window.URL.revokeObjectURL(obj_url);
-        });
-      } else if (blob.type == 'application/pdf') {
-        $('*').css('cursor', 'wait');
-        var obj_url = window.URL.createObjectURL(blob);
-        iframe.load(function() {
-          $('*').css('cursor', 'auto');
-        });
-        iframe.attr('src', obj_url);
-        window.URL.revokeObjectURL(obj_url);
-      } else {
-        iframe.load(function() {
-          $(this).contents().find('body').html("No view available");
-        });
-      }
-
-    });
-  }
-
-  /**
-   * @param {string} biblioid
-   * @param {string} title
-   * @param {number} year
-   * @param {string} url the URL of the image to download and store in the local
-   *   IndexedDB database. The resource behind this URL is subjected to the
-   *   "Same origin policy", thus for this method to work, the URL must come from
-   *   the same origin as the web site/app this code is deployed on.
-   */
-  function addPublicationFromUrl(biblioid, title, year, url) {
-    console.log("addPublicationFromUrl:", arguments);
-
-    var xhr = new XMLHttpRequest();
-    xhr.open('GET', url, true);
-    // Setting the wanted responseType to "blob"
-    // http://www.w3.org/TR/XMLHttpRequest2/#the-response-attribute
-    xhr.responseType = 'blob';
-    xhr.onload = function (evt) {
-                           if (xhr.status == 200) {
-                             console.log("Blob retrieved");
-                             var blob = xhr.response;
-                             console.log("Blob:", blob);
-                             addPublication(biblioid, title, year, blob);
-                           } else {
-                             console.error("addPublicationFromUrl error:",
-                                           xhr.responseText, xhr.status);
-                           }
-                         };
-    xhr.send();
-
-    // We can't use jQuery here because as of jQuery 1.8.3 the new "blob"
-    // responseType is not handled.
-    // http://bugs.jquery.com/ticket/11461
-    // http://bugs.jquery.com/ticket/7248
-    // $.ajax({
-    //   url: url,
-    //   type: 'GET',
-    //   xhrFields: { responseType: 'blob' },
-    //   success: function(data, textStatus, jqXHR) {
-    //     console.log("Blob retrieved");
-    //     console.log("Blob:", data);
-    //     // addPublication(biblioid, title, year, data);
-    //   },
-    //   error: function(jqXHR, textStatus, errorThrown) {
-    //     console.error(errorThrown);
-    //     displayActionFailure("Error during blob retrieval");
-    //   }
-    // });
-  }
-
-  /**
-   * @param {string} biblioid
-   * @param {string} title
-   * @param {number} year
-   * @param {Blob=} blob
-   */
-  function addPublication(biblioid, title, year, blob) {
-    console.log("addPublication arguments:", arguments);
-    var obj = { biblioid: biblioid, title: title, year: year };
-    if (typeof blob != 'undefined')
-      obj.blob = blob;
-
-    var store = getObjectStore(DB_STORE_NAME, 'readwrite');
-    var req;
-    try {
-      req = store.add(obj);
-    } catch (e) {
-      if (e.name == 'DataCloneError')
-        displayActionFailure("This engine doesn't know how to clone a Blob, " +
-                             "use Firefox");
-      throw e;
-    }
-    req.onsuccess = function (evt) {
-      console.log("Insertion in DB successful");
-      displayActionSuccess();
-      displayPubList(store);
-    };
-    req.onerror = function() {
-      console.error("addPublication error", this.error);
-      displayActionFailure(this.error);
-    };
-  }
-
-  /**
-   * @param {string} biblioid
-   */
-  function deletePublicationFromBib(biblioid) {
-    console.log("deletePublication:", arguments);
-    var store = getObjectStore(DB_STORE_NAME, 'readwrite');
-    var req = store.index('biblioid');
-    req.get(biblioid).onsuccess = function(evt) {
-      if (typeof evt.target.result == 'undefined') {
-        displayActionFailure("No matching record found");
-        return;
-      }
-      deletePublication(evt.target.result.id, store);
-    };
-    req.onerror = function (evt) {
-      console.error("deletePublicationFromBib:", evt.target.errorCode);
-    };
-  }
-
-  /**
-   * @param {number} key
-   * @param {IDBObjectStore=} store
-   */
-  function deletePublication(key, store) {
-    console.log("deletePublication:", arguments);
-
-    if (typeof store == 'undefined')
-      store = getObjectStore(DB_STORE_NAME, 'readwrite');
-
-    // As per spec http://www.w3.org/TR/IndexedDB/#object-store-deletion-operation
-    // the result of the Object Store Deletion Operation algorithm is
-    // undefined, so it's not possible to know if some records were actually
-    // deleted by looking at the request result.
-    var req = store.get(key);
-    req.onsuccess = function(evt) {
-      var record = evt.target.result;
-      console.log("record:", record);
-      if (typeof record == 'undefined') {
-        displayActionFailure("No matching record found");
-        return;
-      }
-      // Warning: The exact same key used for creation needs to be passed for
-      // the deletion. If the key was a Number for creation, then it needs to
-      // be a Number for deletion.
-      req = store.delete(key);
-      req.onsuccess = function(evt) {
-        console.log("evt:", evt);
-        console.log("evt.target:", evt.target);
-        console.log("evt.target.result:", evt.target.result);
-        console.log("delete successful");
-        displayActionSuccess("Deletion successful");
-        displayPubList(store);
-      };
-      req.onerror = function (evt) {
-        console.error("deletePublication:", evt.target.errorCode);
-      };
-    };
-    req.onerror = function (evt) {
-      console.error("deletePublication:", evt.target.errorCode);
-      };
-  }
-
-  function displayActionSuccess(msg) {
-    msg = typeof msg != 'undefined' ? "Success: " + msg : "Success";
-    $('#msg').html('&lt;span class="action-success"&gt;' + msg + '&lt;/span&gt;');
-  }
-  function displayActionFailure(msg) {
-    msg = typeof msg != 'undefined' ? "Failure: " + msg : "Failure";
-    $('#msg').html('&lt;span class="action-failure"&gt;' + msg + '&lt;/span&gt;');
-  }
-  function resetActionStatus() {
-    console.log("resetActionStatus ...");
-    $('#msg').empty();
-    console.log("resetActionStatus DONE");
-  }
-
-  function addEventListeners() {
-    console.log("addEventListeners");
-
-    $('#register-form-reset').click(function(evt) {
-      resetActionStatus();
-    });
-
-    $('#add-button').click(function(evt) {
-      console.log("add ...");
-      var title = $('#pub-title').val();
-      var biblioid = $('#pub-biblioid').val();
-      if (!title || !biblioid) {
-        displayActionFailure("Required field(s) missing");
-        return;
-      }
-      var year = $('#pub-year').val();
-      if (year != '') {
-        // Better use Number.isInteger if the engine has EcmaScript 6
-        if (isNaN(year))  {
-          displayActionFailure("Invalid year");
-          return;
-        }
-        year = Number(year);
-      } else {
-        year = null;
-      }
-
-      var file_input = $('#pub-file');
-      var selected_file = file_input.get(0).files[0];
-      console.log("selected_file:", selected_file);
-      // Keeping a reference on how to reset the file input in the UI once we
-      // have its value, but instead of doing that we rather use a "reset" type
-      // input in the HTML form.
-      //file_input.val(null);
-      var file_url = $('#pub-file-url').val();
-      if (selected_file) {
-        addPublication(biblioid, title, year, selected_file);
-      } else if (file_url) {
-        addPublicationFromUrl(biblioid, title, year, file_url);
-      } else {
-        addPublication(biblioid, title, year);
-      }
-
-    });
-
-    $('#delete-button').click(function(evt) {
-      console.log("delete ...");
-      var biblioid = $('#pub-biblioid-to-delete').val();
-      var key = $('#key-to-delete').val();
-
-      if (biblioid != '') {
-        deletePublicationFromBib(biblioid);
-      } else if (key != '') {
-        // Better use Number.isInteger if the engine has EcmaScript 6
-        if (key == '' || isNaN(key))  {
-          displayActionFailure("Invalid key");
-          return;
-        }
-        key = Number(key);
-        deletePublication(key);
-      }
-    });
-
-    $('#clear-store-button').click(function(evt) {
-      clearObjectStore();
-    });
-
-    var search_button = $('#search-list-button');
-    search_button.click(function(evt) {
-      displayPubList();
-    });
-
-  }
-
-  openDb();
-  addEventListeners();
-
-})(); // Immediately-Invoked Function Expression (IIFE)
-</pre>
-
-<p>{{ LiveSampleLink('Full_IndexedDB_example', "Test the online live demo") }}</p>
-
-<h2 id="Next_step">Next step</h2>
-
-<p>If you want to start tinkering with the API, jump in to the <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">reference documentation</a> and check out the different methods.</p>
-
-<h2 id="See_also">See also</h2>
-
-<p>Reference</p>
-
-<ul>
- <li><a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB API Reference</a></li>
- <li><a class="external" href="http://www.w3.org/TR/IndexedDB/" title="http://www.w3.org/TR/IndexedDB/">Indexed Database API Specification</a></li>
- <li><a href="/en-US/docs/IndexedDB/Using_IndexedDB_in_chrome" title="/en-US/docs/IndexedDB/Using_IndexedDB_in_chrome">Using IndexedDB in chrome</a></li>
-</ul>
-
-<p>Tutorials</p>
-
-<ul>
- <li><a class="external" href="http://www.html5rocks.com/tutorials/indexeddb/todo/" title="http://www.html5rocks.com/tutorials/indexeddb/todo/">A simple TODO list using HTML5 IndexedDB</a><span class="external">. {{Note("This tutorial is based on an old version of the specification and does not work on up-to-date browsers - it still uses the removed <code>setVersion()</code> method.") }}</span></li>
- <li><a href="http://www.html5rocks.com/en/tutorials/indexeddb/uidatabinding/" title="http://www.html5rocks.com/en/tutorials/indexeddb/uidatabinding/">Databinding UI Elements with IndexedDB</a></li>
-</ul>
-
-<p>Related articles</p>
-
-<ul>
- <li><a class="external" href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx" title="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — The Store in Your Browser</a></li>
-</ul>
-
-<p>Firefox</p>
-
-<ul>
- <li>Mozilla <a class="link-https" href="https://mxr.mozilla.org/mozilla-central/find?text=&amp;string=dom%2FindexedDB%2F.*%5C.idl&amp;regexp=1" title="https://mxr.mozilla.org/mozilla-central/find?text=&amp;string=dom/indexedDB/.*\.idl&amp;regexp=1">interface files</a></li>
-</ul>
diff --git a/files/es/web/api/indexeddb_api/using_indexeddb/index.html b/files/es/web/api/indexeddb_api/using_indexeddb/index.html
new file mode 100644
index 0000000000..fe51ba9e20
--- /dev/null
+++ b/files/es/web/api/indexeddb_api/using_indexeddb/index.html
@@ -0,0 +1,1309 @@
+---
+title: Usando IndexedDB
+slug: Web/API/IndexedDB_API/Using_IndexedDB
+tags:
+  - API
+  - Almacenamiento
+  - Avanzado
+  - Base de datos
+  - Guía
+  - IndexedDB
+  - Tutorial
+  - jsstore
+translation_of: Web/API/IndexedDB_API/Using_IndexedDB
+original_slug: Web/API/IndexedDB_API/Usando_IndexedDB
+---
+<div class="summary">
+<p>IndexedDB es una manera de almacenar datos dentro del navegador del usuario. Debido a que permite la creación de aplicaciones con habilidades de consulta enriquecidas, con independencia de la disponibilidad de la red, sus aplicaciones pueden trabajar tanto en línea como fuera de línea.</p>
+</div>
+
+<h2 id="Acerca_de_este_documento">Acerca de este documento</h2>
+
+<p>Este tutorial es una guía sobre el uso de la API asíncrona de IndexedDB. Si no está familiarizado con IndexedDB, por favor consulte primero <a href="/en/IndexedDB/Basic_Concepts_Behind_IndexedDB" style="line-height: 1.5;" title="en/IndexedDB/Basic Concepts Behind IndexedDB">Conceptos Básicos Acerca de IndexedDB</a><span style="line-height: 1.5;">.</span></p>
+
+<p>Para la documentación de referencia sobre la API de IndexedDB, vea el artículo <a href="/es/docs/IndexedDB" style="line-height: 1.5;" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB</a><span style="line-height: 1.5;"> y sus subpaginas, que documentan los tipos de objetos usados por IndexedDB, así como los métodos síncronos y asíncronos. </span></p>
+
+<h2 id="pattern" name="pattern">Patrones Básicos</h2>
+
+<p>El patrón básico que indexedDB propone es:</p>
+
+<ol>
+ <li>Abrir una base de datos.</li>
+ <li>Crear un objeto de almacenamiento en la base de datos.</li>
+ <li>Iniciar una transacción y hacer una petición para hacer alguna operación de la base de datos, tal como añadir o recuperar datos.</li>
+ <li>
+  <div><span id="result_box" lang="es"><span class="hps">Espere a que</span> <span class="hps">se complete la operación</span> <span class="hps">por</span> <span class="hps">la escucha de la</span> <span class="hps">clase correcta de</span> <span class="hps">eventos DOM</span></span> .</div>
+ </li>
+ <li>
+  <div>Hacer algo con el resultado (El cual puede ser encontrado en el objeto de la petición).</div>
+ </li>
+</ol>
+
+<p>Con esos grandes rasgos en mente, seremos más concretos.</p>
+
+<h2 id="open" name="open">Creando y estructurando el almacenamiento</h2>
+
+<p>Como las especificaciones están todavía elaborandose, las implementaciones actuales de indexedDB dependen de los navegadores. H<span id="result_box" lang="es"><span class="hps">asta que la</span> <span class="hps">especificación</span> <span class="hps">se haya consolidado, l</span></span>os proveedores de navegadores pueden tener diferentes implementaciones de los estandares de indexedDB<span id="result_box" lang="es"><span>.</span></span> Una vez se alcance el consenso en el estandar, los proveedores implementarán la API sin prefijos. En algunas implementaciones ya fueron removidos los prefijos: Internet Explorer 10, Firefox 16, Chrome 24. Cuando utilizan un prefijo, los navegadores basados en gecko usan el prefijo <code>moz</code> , mientras que los navegadores basados en WebKit usan el prefijo <code>webkit</code>.</p>
+
+<h3 id="Usando_una_versión_experimental_de_IndexedDB">Usando una versión experimental de IndexedDB</h3>
+
+<p>En caso que usted quiera probar su código en navegadores que todavía usen un prefijo, puede usar el siguiente codigo:  </p>
+
+<pre class="brush: js">// En la siguiente línea, puede incluir prefijos de implementación que quiera probar.
+window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
+// No use "var indexedDB = ..." Si no está en una función.
+// Por otra parte, puedes necesitar referencias a algun objeto window.IDB*:
+window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.msIDBTransaction;
+window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange || window.msIDBKeyRange;
+// (Mozilla nunca ha prefijado estos objetos, por lo tanto no necesitamos window.mozIDB*)</pre>
+
+<p>Hay que tener cuidado con las implementaciones que usan un prefijo ya que puede ser inestables, incompletas, o usen una versión antigua de la especificación. En producción se recomienda usar el código sin prefijos. Es preferible no tener soporte para un navegador a decir que lo tiene y fallar en ello :</p>
+
+<pre class="brush: js">if (!window.indexedDB) {
+    window.alert("Su navegador no soporta una versión estable de indexedDB. Tal y como las características no serán validas");
+}
+</pre>
+
+<h3 id="Abriendo_una_base_de_datos">Abriendo una base de datos</h3>
+
+<p>Iniciamos todo el proceso así:</p>
+
+<pre class="brush: js">// dejamos abierta nuestra base de datos
+var request = window.indexedDB.open("MyTestDatabase", 3);
+</pre>
+
+<p>¿Lo has visto? Abrir una base de datos es igual que cualquier otra operación — solo tienes que "solicitarla" (request).</p>
+
+<p>La solicitud de apertura no abre la base de datos o inicia la transacción de inmediato. La llamada a la función <code>open()</code> retornan unos objetos <code><a href="/en-US/docs/IndexedDB/IDBOpenDBRequest" title="/en-US/docs/IndexedDB/IDBOpenDBRequest">IDBOpenDBRequest</a>,</code> cuyo resultado, correcto o erróneo, se maneja en un evento.  Alguna otra función asincrónica en indexedDB hace lo mismo - Devolver un objeto <a href="/en-US/docs/IndexedDB/IDBRequest" title="/en-US/docs/IndexedDB/IDBRequest"><code style="font-size: 14px; color: rgb(51, 51, 51);">IDBRequest</code></a> que disparará un evento con el resultado o el error. El resultado para la función de abrir es una instancia de un <code style="font-size: 14px; color: rgb(51, 51, 51);"><a href="/en-US/docs/IndexedDB/IDBDatabase" title="/en-US/docs/IndexedDB/IDBDatabase">IDBDatabase</a>.</code></p>
+
+<p>El segundo parámetro para el método open es la versión de la base de datos. La versión de la base de datos determina el esquema - El almacen de objectos en la base de datos y su estructura. Si la base de datos no existe, es creada y se dispara un evento <code>onupgradeneeded</code> de inmediato, permitiéndote proveer una actualización de la estructura e índices en la función que capture dicho evento. Se verá más adelante en  <a href="#Updating_the_version_of_the_database">Actualizando la versión de la base de datos</a>. </p>
+
+<div class="warning">
+<p><strong>Importante</strong>: El número de versión es un <code>unsigned long</code>. Por lo tanto significa que puede ser un entero muy grande. También significa que si usas un flotante será convertido en un entero más cercano y la transacción puede no ser iniciada, el evento <code>upgradeneeded </code>no se desencadenará. Por ejemplo no use 2.4 como un número de versión ya que será igual que la 2:</p>
+
+<pre class="brush: js">var request = indexedDB.open("MyTestDatabase", 2.4); // Esto no se hace, la versión será redondeada a 2</pre>
+</div>
+
+<h4 id="Generando_manipuladores">Generando manipuladores</h4>
+
+<p>La primera cosa que usted querrá hacer con la totalidad de las peticiones que usted genera es agregar controladores de éxito y de error:</p>
+
+<pre class="brush: js">request.onerror = function(event) {
+  // Hacer algo con request.errorCode!
+};
+request.onsuccess = function(event) {
+  // Hacer algo con request.result!
+};</pre>
+
+<p>¿Cuál de las dos funciones, onSuccess () o onerror (), se vuelve a llamar? Si todo tiene éxito, un evento de éxito (es decir, un evento DOM cuya propiedad tipo se establece en el "éxito") se dispara con la solicitud como su objetivo. Una vez que se dispara, la función onSuccess () a petición se activa con el evento de éxito como argumento. De lo contrario, si había algún problema, un evento de error (es decir, un evento DOM cuyo tipo de propiedad se establece en "error") se dispara a petición. Esto desencadena la función onerror () con el evento de error como argumento.</p>
+
+<p>La API IndexedDB está diseñada para minimizar la necesidad de control de errores, por lo que no es probable que veamos muchos eventos de error (al menos, no una vez que estás acostumbrado a la API). En el caso de la apertura de una base de datos, sin embargo, hay algunas condiciones comunes que generan eventos de error. El problema más común se produce cuando el usuario ha decidido no dar, a su aplicación web, el permiso para crear una base de datos. Uno de los principales objetivos de diseño de IndexedDB es permitir que grandes cantidades de datos se almacenen para su uso sin conexión a internet. (Para obtener más información sobre la cantidad de almacenamiento que puede tener para cada navegador, consulte <a href="https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API#Storage_limits">Límites de almacenamiento</a>.)  </p>
+
+<p>Obviamente, los navegadores no permitirán que alguna red de publicidad o sitio web malicioso pueda contaminar su ordenador, por ello los navegadores utilizan un diálogo para indicar al usuario la primera vez que cualquier aplicación web determinada intente abrir una IndexedDB para el almacenamiento. El usuario puede optar por permitir o denegar el acceso. Además, el almacenamiento IndexedDB en los modos de privacidad navegadores sólo dura en memoria hasta que la sesión de incógnito haya sido cerrada (modo de navegación privada para el modo de Firefox e Incognito para Chrome, pero en Firefox <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=781982">no está implementado</a> a partir de noviembre 2015 por lo que no puede utilizar IndexedDB en Firefox navegación privada en absoluto).</p>
+
+<p>Ahora, asumiendo que el usuario acepta su solicitud para crear una base de datos, y que ha recibido un evento de éxito para activar la devolución de llamada de éxito; ¿Que sigue? La solicitud aquí se generó con una llamada a indexedDB.open (), por lo request.result es una instancia de IDBDatabase, y que sin duda quieren ahorrar para más adelante. Su código podría ser algo como esto:</p>
+
+<pre class="brush: js">var db;
+var request = indexedDB.open("MyTestDatabase");
+request.onerror = function(event) {
+  alert("Why didn't you allow my web app to use IndexedDB?!");
+};
+request.onsuccess = function(event) {
+  db = request.result;
+};
+</pre>
+
+<h4 id="Manejando_errores">Manejando errores</h4>
+
+<p>Como se mencionó anteriormente, los eventos de error de burbujas. Eventos de error se dirigen a la solicitud que generó el error, entonces el evento se propaga a la operación, y finalmente con el objeto de base de datos. Si desea evitar la adición de controladores de errores a cada solicitud, en su lugar puede añadir un solo controlador de errores en el objeto de base de datos, así:</p>
+
+<pre class="brush: js">db.onerror = function(event) {
+  // Generic error handler for all errors targeted at this database's
+  // requests!
+  alert("Database error: " + event.target.errorCode);
+};
+</pre>
+
+<p>Uno de los errores más comunes posibles al abrir una base de datos es <code>VER_ERR</code>. Indica que la versión de la base de datos almacenada en el disco es mayor que la versión que está intentando abrir. Este es un caso de error que siempre debe ser manejado por el gestor de errores.</p>
+
+<h3 id="Creación_o_actualización_de_la_versión_de_la_base_de_datos">Creación o actualización de la versión de la base de datos</h3>
+
+<p>Cuando se crea una nueva base de datos o se aumenta el número de versión de una base de datos existente (mediante la especificación de un número de versión más alto de lo que hizo antes, en {{anch ("Cómo abrir una base de datos")}}), el evento onupgradeneeded se activará y un objeto <a href="https://developer.mozilla.org/en-US/docs/Web/API/IDBVersionChangeEvent">IDBVersionChangeEvent</a> será pasado a cualquier controlador de eventos <code>onversionchange</code> establecido en <code>request.result</code> (es decir, db en el ejemplo). En el controlador para el evento <code>upgradeneeded</code>, se debe crear los almacenes de objetos necesarios para esta versión de la base de datos:</p>
+
+<pre class="brush:js;">// Este evento solamente está implementado en navegadores recientes
+request.onupgradeneeded = function(event) {
+  var db = event.target.result;
+
+  // Crea un almacén de objetos (objectStore) para esta base de datos
+  var objectStore = db.createObjectStore("name", { keyPath: "myKey" });
+};</pre>
+
+<p>En este caso, la base de datos ya tendrá los almacenes de objetos de la versión anterior de la base de datos, por lo que no tiene que crear estos almacenes de objetos de nuevo. Sólo es necesario crear nuevos almacenes de objetos, o eliminar las tiendas de objetos de la versión anterior que ya no son necesarios. Si necesita cambiar un almacén de objetos existentes (por ejemplo, para cambiar la ruta de acceso clave <code>keyPath</code>), entonces se debe eliminar el antiguo almacén de objetos y crear de nuevo con las nuevas opciones. (Tenga en cuenta que esto borrará la información en el almacén de objetos Si usted necesita guardar esa información, usted debe leerlo y guardarlo en otro lugar antes de actualizar la base de datos.)</p>
+
+<p>Tratar de crear un almacén de objetos con un nombre que ya existe (o tratando de eliminar un almacén de objetos con un nombre que no existe) lanzará un error.</p>
+
+<p>Si el evento <code>onupgradeneeded</code> retorna éxito, entonces se activará el manejador <code>onsuccess</code> de la solicitud de base de datos abierta.</p>
+
+<p>Blink / Webkit soportan la versión actual de la especificación, tal como fue liberado en Chrome 23+ y Opera 17+ ; IE10+ también lo soporta. Implementaciones mas viejas o distintas no implementan la versión actual de la especificación, y por lo tanto no son compatibles todavía con el <code>indexedDB.open (nombre, versión).onupgradeneeded</code> . Para obtener más información sobre cómo actualizar la versión de la base de datos en Webkit/Blink mas viejos, consulte el artículo de referencia <a href="/es/docs/Web/API/IDBDatabase" title="https://developer.mozilla.org/en/IndexedDB/IDBDatabase#setVersion()_.0A.0ADeprecated">IDBDatabase</a>.</p>
+
+<h3 id="Estructuración_de_la_base_de_datos">Estructuración de la base de datos</h3>
+
+<p>Ahora para estructurar la base de datos. IndexedDB usa almacenes de datos (object stores) en lugar de tablas, y una base de datos puede contener cualquier número de almacenes. Cuando un valor es almacenado, se le asocia con una clave. Existen diversas maneras en que una clave pude ser indicada dependiendo de si el almacén usa una <a href="https://developer.mozilla.org/en/IndexedDB/Basic_Concepts_Behind_IndexedDB#gloss_keypath">ruta de clave</a> o <a href="https://developer.mozilla.org/en/IndexedDB/Basic_Concepts_Behind_IndexedDB#gloss_keygenerator">generador</a>.</p>
+
+<p>La siguiente table muetra las distintas formas en que las claves pueden ser indicadas:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Ruta de clave(<code>keyPath</code>)</th>
+   <th scope="col">Generador de clave (<code>autoIncrement</code>)</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>No</td>
+   <td>No</td>
+   <td>Este almacén puede contener cualquier tipo de valor, incluso valores primitivos como números y cadenas. Se debe indicar un argumento de clave distinto cada vez que se agregue un nuevo valor.</td>
+  </tr>
+  <tr>
+   <td>Si</td>
+   <td>No</td>
+   <td>Este almacén de objetos solo puede contener objetos de JavaScript. Los objetos deben tener una propiedad con el mismo nombre que la ruta de clave.</td>
+  </tr>
+  <tr>
+   <td>No</td>
+   <td>Si</td>
+   <td>Este objeto puede contener cualquier tipo de valor. La clave es generada automáticamente, o se puede indicar un argumento de clave distinto si se quiere usar una clave específica.</td>
+  </tr>
+  <tr>
+   <td>Si</td>
+   <td>Si</td>
+   <td>
+    <p>Este almacén de objetos solo puede contener objetos de JavaScript. Usualmente una clave es generada y dicho valor es almacenado en el objeto en una propiedad con el mismo nombre que la ruta de clave. Sin embargo, si dicha propiedad ya existe en el objeto, el valor de esa propuiedad es usado como clave en lugar de generar una nueva.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>También se puede crear índices en cualquer almacén de objetos, siempre y cuando el almacén contenga objets, y no primitivos. Un índice permite buscar valores contenidos en el almacén usando el valor de una propiedad del objeto almacenado, en lugar de la clave del mismo.</p>
+
+<p>Adicionalmente, los índices tienen la habilidad para hacer cumplir restricciones simples en los datos almacendos. Al indicar la bandera <code>unique</code> al crear el índice, el índice asegurará que no se puedan almacenar dos objetos que tengan el mismo valor para la clave del índice. Así, por ejemplo si se tiene un almacén de objetos que contiene un set de personas, y se desea asegurar que no existan dos personas con el mismo email, se puede usar un índice con la bandera <code>unique</code> activada para forzar esto.</p>
+
+<p>Esto puede sonar confuso, pero un ejemplo simple debe ilustrar el concepto. Primero, definiremos alguna información de clientes para usar en nuestro ejemplo:</p>
+
+<pre class="brush: js">// Así se ve nuestra información de clientes.
+const customerData = [
+  { ssn: "444-44-4444", name: "Bill", age: 35, email: "bill@company.com" },
+  { ssn: "555-55-5555", name: "Donna", age: 32, email: "donna@home.org" }
+];
+</pre>
+
+<p>Ahora, creemos una IndexedDB para almacenar los datos:</p>
+
+<pre class="brush: js">const dbName = "the_name";
+
+var request = indexedDB.open(dbName, 2);
+
+request.onerror = function(event) {
+  // Manejar errores.
+};
+request.onupgradeneeded = function(event) {
+  var db = event.target.result;
+
+  // Se crea un almacén para contener la información de nuestros cliente
+  // Se usará "ssn" como clave ya que es garantizado que es única
+  var objectStore = db.createObjectStore("customers", { keyPath: "ssn" });
+
+  // Se crea un índice para buscar clientes por nombre. Se podrían tener duplicados
+  // por lo que no se puede usar un índice único.
+  objectStore.createIndex("name", "name", { unique: false });
+
+  // Se crea un índice para buscar clientespor email. Se quiere asegurar que
+  // no puedan haberdos clientes con el mismo email, asi que se usa un índice único.
+  objectStore.createIndex("email", "email", { unique: true });
+
+  // Se usa transaction.oncomplete para asegurarse que la creación del almacén
+  // haya finalizado antes de añadir los datos en el.
+  objectStore.transaction.oncomplete = function(event) {
+    // Guarda los datos en el almacén recién creado.
+    var customerObjectStore = db.transaction("customers", "readwrite").objectStore("customers");
+    for (var i in customerData) {
+      customerObjectStore.add(customerData[i]);
+    }
+  }
+};
+</pre>
+
+<p>Como se indicó previamente, <code>onupgradeneeded</code> es el único lugar donde se puede alterar la estructura de la base de datos. En el, se puede crear y borrar almacenes de objetos y construir y remover índices.</p>
+
+<div>Los almacenes de datos son creados con una llamada a  <code>createObjectStore()</code>. El método toma como parámetros el nombre del almacén y un objeto.  A pesar de que el segundo parámetro es opcional, es muy importante, porque permite definir propiedades opcionales importantes y refinar el tipo de almacén que se desea crear. En este caso, se pregunta por un almacén llamado "customers" y se define la clave, que es la propiedad que indica que un objeto en el almacén es único. La propiedad en este ejemplo es "ssn" (Social Security Number) ya que los números de seguridad social está garantizado que sea único. "ssn" debe estar presente en cada objeto que se guarda al almacén.</div>
+
+<p>También se solicitó crear un índice llamado "name" que se fija en la propiedad <code>name </code>de los objetos almacenados. Así como con <code>createObjectStore()</code>, <code>createIndex()</code> toma un objeto opcional <code>options</code> que refina el tipo de índice que se desea crear. Agregar objetos que no tengan una propiedad <code>name</code> funcionará, pero los objetos no aparecerán en el índice "name"</p>
+
+<div>Ahora se pueden obtener los clientes almacenados usando su <code>ssn</code> directamente del almacen, o usando su nombre a través del índice. Para aprender como hacer esto, vea la sección <a href="#El_uso_de_un_índice">El uso de un índice</a></div>
+
+<h3 id="El_uso_de_un_generador_de_claves">El uso de un generador de claves</h3>
+
+<p>Indicar la bandera <code>autoIncrement </code> cuando se crea el almacén habilitará el generador de claves para dicho almacén. Por defecto esta bandera no está marcada.</p>
+
+<p>Con el generador de claves, la clave será generada automáticamente a medida que se agreguen valores al almacén. El número actual de un generador de claves siempre se establece en 1 cuando se creal el almacén por primera vez. Básicamente la nueva clave autogenerada es incrementada en 1 basada en la llave anterior. El numero actual para un generador de claves nunca disminuye, salvo como resultado de operaciones de base de datos  que sean revertidos, por ejemplo, cuando la transacción de base de datos es abortada. Por lo tanto borrar un registro o incluso borrar todos los registros de un almacén nunca afecta al generador de claves</p>
+
+<p>Se puede crear otro almacén de objetos con generador de claves como se muestra abajo:</p>
+
+<pre class="brush: js">// Abrir la indexedDB.
+var request = indexedDB.open(dbName, 3);
+
+request.onupgradeneeded = function (event) {
+
+    var db = event.target.result;
+
+    // Create another object store called "names" with the autoIncrement flag set as true.
+    var objStore = db.createObjectStore("names", { autoIncrement : true });
+
+    // Because the "names" object store has the key generator, the key for the name value is generated automatically.
+    // The added records would be like:
+    // key : 1 =&gt; value : "Bill"
+    // key : 2 =&gt; value : "Donna"
+    for (var i in customerData) {
+        objStore.add(customerData[i].name);
+    }
+}</pre>
+
+<p>Para más detalles acerca del generador de claves, por favor ver <a href="http://www.w3.org/TR/IndexedDB/#key-generator-concept">"W3C Key Generators"</a>.</p>
+
+<h2 id="Añadir_recuperación_y_eliminación_de_datos">Añadir, recuperación y eliminación de datos</h2>
+
+<p>Antes que haga algo con su nueva base de datos , necesita comenzar una transacción. Transactions come from the database object, and you have to specify which object stores you want the transaction to span. Once you are inside the transaction, you can access the object stores that hold your data and make your requests. Next, you need to decide if you're going to make changes to the database or if you just need to read from it. Transactions have three available modes: <code>readonly</code>, <code>readwrite</code>, and <code>versionchange</code>.</p>
+
+<p>To change the "schema" or structure of the database—which involves creating or deleting object stores or indexes—the transaction must be in <code>versionchange</code> mode. This transaction is opened by calling the {{domxref("IDBFactory.open")}} method with a <code>version</code> specified. (In WebKit browsers, which have not implemented the latest specifcation, the {{domxref("IDBFactory.open")}} method takes only one parameter, the <code>name</code> of the database; then you must call {{domxref("IDBVersionChangeRequest.setVersion")}} to establish the <code>versionchange</code> transaction.)</p>
+
+<p>To read the records of an existing object store, the transaction can either be in <code>readonly</code> or <code>readwrite</code> mode. To make changes to an existing object store, the transaction must be in <code>readwrite</code> mode. You open such transactions with {{domxref("IDBDatabase.transaction")}}. The method accepts two parameters: the <code>storeNames</code> (the scope, defined as an array of object stores that you want to access) and the <code>mode</code> (<code>readonly</code> or <code>readwrite</code>) for the transaction. The method returns a transaction object containing the {{domxref("IDBIndex.objectStore")}} method, which you can use to access your object store. By default, where no mode is specified, transactions open in <code>readonly</code> mode.</p>
+
+<p>You can speed up data access by using the right scope and mode in the transaction. Here are a couple of tips:</p>
+
+<ul>
+ <li>When defining the scope, specify only the object stores you need. This way, you can run multiple transactions with non-overlapping scopes concurrently.</li>
+ <li>Only specify a <code>readwrite</code> transaction mode when necessary. You can concurrently run multiple <code>readonly</code> transactions with overlapping scopes, but you can have only one <code>readwrite</code> transaction for an object store. To learn more, see the definition for <dfn><a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB#Database">transactions</a></dfn> in the <a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB">Basic Concepts</a> article.</li>
+</ul>
+
+<h3 id="Agregar_datos_a_la_base_de_datos">Agregar datos a la base de datos</h3>
+
+<p>If you've just created a database, then you probably want to write to it. Here's what that looks like:</p>
+
+<pre class="brush:js;">var transaction = db.transaction(["customers"], "readwrite");
+// Note: Older experimental implementations use the deprecated constant IDBTransaction.READ_WRITE instead of "readwrite".
+// In case you want to support such an implementation, you can write:
+// var transaction = db.transaction(["customers"], IDBTransaction.READ_WRITE);</pre>
+
+<p>The <code>transaction()</code> function takes two arguments (though one is optional) and returns a transaction object. The first argument is a list of object stores that the transaction will span. You can pass an empty array if you want the transaction to span all object stores, but don't do it because the spec says an empty array should generate an InvalidAccessError. If you don't specify anything for the second argument, you get a read-only transaction. Since you want to write to it here you need to pass the <code>"readwrite"</code> flag.</p>
+
+<p>Now that you have a transaction you need to understand its lifetime. Transactions are tied very closely to the event loop. If you make a transaction and return to the event loop without using it then the transaction will become inactive. The only way to keep the transaction active is to make a request on it. When the request is finished you'll get a DOM event and, assuming that the request succeeded, you'll have another opportunity to extend the transaction during that callback. If you return to the event loop without extending the transaction then it will become inactive, and so on. As long as there are pending requests the transaction remains active. Transaction lifetimes are really very simple but it might take a little time to get used to. A few more examples will help, too. If you start seeing <code>TRANSACTION_INACTIVE_ERR</code> error codes then you've messed something up.</p>
+
+<p>Transactions can receive DOM events of three different types: <code>error</code>, <code>abort</code>, and <code>complete</code>. We've talked about the way that <code>error</code> events bubble, so a transaction receives error events from any requests that are generated from it. A more subtle point here is that the default behavior of an error is to abort the transaction in which it occurred. Unless you handle the error by first calling <code>preventDefault()</code> on the error event then doing something else, the entire transaction is rolled back. This design forces you to think about and handle errors, but you can always add a catchall error handler to the database if fine-grained error handling is too cumbersome. If you don't handle an error event or if you call <code>abort()</code> on the transaction, then the transaction is rolled back and an <code>abort</code> event is fired on the transaction. Otherwise, after all pending requests have completed, you'll get a <code>complete</code> event. If you're doing lots of database operations, then tracking the transaction rather than individual requests can certainly aid your sanity.</p>
+
+<p>Now that you have a transaction, you'll need to get the object store from it. Transactions only let you have an object store that you specified when creating the transaction. Then you can add all the data you need.</p>
+
+<pre class="brush: js">// Do something when all the data is added to the database.
+transaction.oncomplete = function(event) {
+  alert("All done!");
+};
+
+transaction.onerror = function(event) {
+  // Don't forget to handle errors!
+};
+
+var objectStore = transaction.objectStore("customers");
+for (var i in customerData) {
+  var request = objectStore.add(customerData[i]);
+  request.onsuccess = function(event) {
+    // event.target.result == customerData[i].ssn;
+  };
+}</pre>
+
+<p>The <code>result</code> of a request generated from a call to <code>add()</code> is the key of the value that was added. So in this case, it should equal the <code>ssn</code> property of the object that was added, since the object store uses the <code>ssn</code> property for the key path. Note that the <code>add()</code> function requires that no object already be in the database with the same key. If you're trying to modify an existing entry, or you don't care if one exists already, you can use the <code>put()</code> function, as shown below in the {{ anch("Updating an entry in the database") }} section.</p>
+
+<h3 id="Extracción_de_datos_de_la_base_de_datos">Extracción de datos de la base de datos</h3>
+
+<p>Removing data is very similar:</p>
+
+<pre class="brush: js">var request = db.transaction(["customers"], "readwrite")
+                .objectStore("customers")
+                .delete("444-44-4444");
+request.onsuccess = function(event) {
+  // It's gone!
+};</pre>
+
+<h3 id="Obtener_datos_de_la_base_de_datos">Obtener datos de la base de datos</h3>
+
+<p>Now that the database has some info in it, you can retrieve it in several ways. First, the simple <code>get()</code>. You need to provide the key to retrieve the value, like so:</p>
+
+<pre class="brush: js">var transaction = db.transaction(["customers"]);
+var objectStore = transaction.objectStore("customers");
+var request = objectStore.get("444-44-4444");
+request.onerror = function(event) {
+  // Handle errors!
+};
+request.onsuccess = function(event) {
+  // Do something with the request.result!
+  alert("Name for SSN 444-44-4444 is " + request.result.name);
+};</pre>
+
+<p>That's a lot of code for a "simple" retrieval. Here's how you can shorten it up a bit, assuming that you handle errors at the database level:</p>
+
+<pre class="brush: js">db.transaction("customers").objectStore("customers").get("444-44-4444").onsuccess = function(event) {
+  alert("Name for SSN 444-44-4444 is " + event.target.result.name);
+};</pre>
+
+<p>See how this works? Since there's only one object store, you can avoid passing a list of object stores you need in your transaction and just pass the name as a string. Also, you're only reading from the database, so you don't need a <code>"readwrite"</code> transaction. Calling <code>transaction()</code> with no mode specified gives you a <code>"readonly"</code> transaction. Another subtlety here is that you don't actually save the request object to a variable. Since the DOM event has the request as its target you can use the event to get to the <code>result</code> property.</p>
+
+<div class="note">
+<p><strong>Note</strong>: You can speed up data access by limiting the scope and mode in the transaction. Here are a couple of tips:</p>
+
+<ul>
+ <li>
+  <p>When defining the <a href="#scope">scope</a>, specify only the object stores you need. This way, you can run multiple transactions with non-overlapping scopes concurrently.</p>
+ </li>
+ <li>
+  <p>Only specify a <code>readwrite</code> transaction mode when necessary. You can concurrently run multiple <code>readonly</code> transactions with overlapping scopes, but you can have only one <code>readwrite</code> transaction for an object store. To learn more, see the definition for <a href="/en-US/docs/IndexedDB/Basic_Concepts_Behind_IndexedDB#gloss_transaction"><dfn>transactions</dfn> in the Basic Concepts article</a>.</p>
+ </li>
+</ul>
+</div>
+
+<h3 id="Actualización_de_una_entrada_en_la_base_de_datos">Actualización de una entrada en la base de datos</h3>
+
+<p>Now we've retrieved some data, updating it and inserting it back into the IndexedDB is pretty simple. Let's update the previous example somewhat:</p>
+
+<pre class="brush: js">var objectStore = db.transaction(["customers"], "readwrite").objectStore("customers");
+var request = objectStore.get("444-44-4444");
+request.onerror = function(event) {
+  // Handle errors!
+};
+request.onsuccess = function(event) {
+  // Get the old value that we want to update
+  var data = request.result;
+
+  // update the value(s) in the object that you want to change
+  data.age = 42;
+
+  // Put this updated object back into the database.
+  var requestUpdate = objectStore.put(data);
+   requestUpdate.onerror = function(event) {
+     // Do something with the error
+   };
+   requestUpdate.onsuccess = function(event) {
+     // Success - the data is updated!
+   };
+};</pre>
+
+<p>So here we're creating an <code>objectStore</code> and requesting a customer record out of it, identified by its ssn value (<code>444-44-4444</code>). We then put the result of that request in a variable (<code>data</code>), update the <code>age</code> property of this object, then create a second request (<code>requestUpdate</code>) to put the customer record back into the <code>objectStore</code>, overwriting the previous value.</p>
+
+<div class="note">
+<p><strong>Note</strong> that in this case we've had to specify a <code>readwrite</code> transaction because we want to write to the database, not just read out of it.</p>
+</div>
+
+<h3 id="El_uso_de_un_cursor">El uso de un cursor</h3>
+
+<p>Using <code>get()</code> requires that you know which key you want to retrieve. If you want to step through all the values in your object store, then you can use a cursor. Here's what it looks like:</p>
+
+<pre class="brush: js">var objectStore = db.transaction("customers").objectStore("customers");
+
+objectStore.openCursor().onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    alert("Name for SSN " + cursor.key + " is " + cursor.value.name);
+    cursor.continue();
+  }
+  else {
+    alert("No more entries!");
+  }
+};</pre>
+
+<p>The<code> openCursor()</code> function takes several arguments. First, you can limit the range of items that are retrieved by using a key range object that we'll get to in a minute. Second, you can specify the direction that you want to iterate. In the above example, we're iterating over all objects in ascending order. The success callback for cursors is a little special. The cursor object itself is the <code>result</code> of the request (above we're using the shorthand, so it's <code>event.target.result</code>). Then the actual key and value can be found on the <code>key</code> and <code>value</code> properties of the cursor object. If you want to keep going, then you have to call <code>continue()</code> on the cursor. When you've reached the end of the data (or if there were no entries that matched your <code>openCursor()</code> request) you still get a success callback, but the <code>result</code> property is <code>undefined</code>.</p>
+
+<p>One common pattern with cursors is to retrieve all objects in an object store and add them to an array, like this:</p>
+
+<pre class="brush: js">var customers = [];
+
+objectStore.openCursor().onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    customers.push(cursor.value);
+    cursor.continue();
+  }
+  else {
+    alert("Got all customers: " + customers);
+  }
+};</pre>
+
+<div class="note">
+<p>Note: Mozilla has also implemented <code>getAll()</code> to handle this case (and <code>getAllKeys()</code>, which is currently hidden behind the <code>dom.indexedDB.experimental</code> preference in about:config). these aren't part of the IndexedDB standard, so may disappear in the future. We've included them because we think they're useful. The following code does precisely the same thing as above:</p>
+
+<pre class="brush: js">objectStore.getAll().onsuccess = function(event) {
+  alert("Got all customers: " + event.target.result);
+};</pre>
+
+<p>There is a performance cost associated with looking at the <code>value</code> property of a cursor, because the object is created lazily. When you use <code>getAll()</code> for example, Gecko must create all the objects at once. If you're just interested in looking at each of the keys, for instance, it is much more efficient to use a cursor than to use <code>getAll()</code>. If you're trying to get an array of all the objects in an object store, though, use <code>getAll()</code>.</p>
+</div>
+
+<h3 id="El_uso_de_un_índice">El uso de un índice</h3>
+
+<p>Storing customer data using the SSN as a key is logical since the SSN uniquely identifies an individual. (Whether this is a good idea for privacy is a different question, and outside the scope of this article.) If you need to look up a customer by name, however, you'll need to iterate over every SSN in the database until you find the right one. Searching in this fashion would be very slow, so instead you can use an index.</p>
+
+<pre class="brush: js">var index = objectStore.index("name");
+index.get("Donna").onsuccess = function(event) {
+  alert("Donna's SSN is " + event.target.result.ssn);
+};</pre>
+
+<p>The "name" cursor isn't unique, so there could be more than one entry with the <code>name</code> set to <code>"Donna"</code>. In that case you always get the one with the lowest key value.</p>
+
+<p>If you need to access all the entries with a given <code>name</code> you can use a cursor. You can open two different types of cursors on indexes. A normal cursor maps the index property to the object in the object store. A key cursor maps the index property to the key used to store the object in the object store. The differences are illustrated here:</p>
+
+<pre class="brush: js">// Using a normal cursor to grab whole customer record objects
+index.openCursor().onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    // cursor.key is a name, like "Bill", and cursor.value is the whole object.
+    alert("Name: " + cursor.key + ", SSN: " + cursor.value.ssn + ", email: " + cursor.value.email);
+    cursor.continue();
+  }
+};
+
+// Using a key cursor to grab customer record object keys
+index.openKeyCursor().onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    // cursor.key is a name, like "Bill", and cursor.value is the SSN.
+    // No way to directly get the rest of the stored object.
+    alert("Name: " + cursor.key + ", SSN: " + cursor.value);
+    cursor.continue();
+  }
+};</pre>
+
+<h3 id="Especificación_de_la_gama_y_la_dirección_de_los_cursores">Especificación de la gama y la dirección de los cursores</h3>
+
+<p>If you would like to limit the range of values you see in a cursor, you can use an <code>IDBKeyRange</code> object and pass it as the first argument to <code>openCursor()</code> or <code>openKeyCursor()</code>. You can make a key range that only allows a single key, or one that has a lower or upper bound, or one that has both a lower and upper bound. The bound may be "closed" (i.e., the key range includes the given value(s)) or "open" (i.e., the key range does not include the given value(s)). Here's how it works:</p>
+
+<pre class="brush: js">// Only match "Donna"
+var singleKeyRange = IDBKeyRange.only("Donna");
+
+// Match anything past "Bill", including "Bill"
+var lowerBoundKeyRange = IDBKeyRange.lowerBound("Bill");
+
+// Match anything past "Bill", but don't include "Bill"
+var lowerBoundOpenKeyRange = IDBKeyRange.lowerBound("Bill", true);
+
+// Match anything up to, but not including, "Donna"
+var upperBoundOpenKeyRange = IDBKeyRange.upperBound("Donna", true);
+
+// Match anything between "Bill" and "Donna", but not including "Donna"
+var boundKeyRange = IDBKeyRange.bound("Bill", "Donna", false, true);
+
+// To use one of the key ranges, pass it in as the first argument of openCursor()/openKeyCursor()
+index.openCursor(boundKeyRange).onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    // Do something with the matches.
+    cursor.continue();
+  }
+};</pre>
+
+<p>Sometimes you may want to iterate in descending order rather than in ascending order (the default direction for all cursors). Switching direction is accomplished by passing <code>prev</code> to the <code>openCursor()</code> function as the second argument:</p>
+
+<pre class="brush: js">objectStore.openCursor(boundKeyRange, "prev").onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    // Do something with the entries.
+    cursor.continue();
+  }
+};</pre>
+
+<p>If you just want to specify a change of direction but not constrain the results shown, you can just pass in null as the first argument:</p>
+
+<pre class="brush: js">objectStore.openCursor(null, "prev").onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    // Do something with the entries.
+    cursor.continue();
+  }
+};</pre>
+
+<p>Since the "name" index isn't unique, there might be multiple entries where <code>name</code> is the same. Note that such a situation cannot occur with object stores since the key must always be unique. If you wish to filter out duplicates during cursor iteration over indexes, you can pass <code>nextunique</code> (or <code>prevunique</code> if you're going backwards) as the direction parameter. When <code>nextunique</code> or <code>prevunique</code> is used, the entry with the lowest key is always the one returned.</p>
+
+<pre class="brush: js">index.openKeyCursor(null, "nextunique").onsuccess = function(event) {
+  var cursor = event.target.result;
+  if (cursor) {
+    // Do something with the entries.
+    cursor.continue();
+  }
+};</pre>
+
+<p>Please see "<a href="https://developer.mozilla.org/en-US/docs/Web/API/IDBCursor?redirectlocale=en-US&amp;redirectslug=IndexedDB%2FIDBCursor#Constants">IDBCursor Constants</a>" for the valid direction arguments.</p>
+
+<h2 id="Cambios_Versión_mientras_que_una_aplicación_web_está_abierto_en_otra_pestaña">Cambios Versión mientras que una aplicación web está abierto en otra pestaña</h2>
+
+<p>When your web app changes in such a way that a version change is required for your database, you need to consider what happens if the user has the old version of your app open in one tab and then loads the new version of your app in another. When you call <code>open()</code> with a greater version than the actual version of the database, all other open databases must explicitly acknowledge the request before you can start making changes to the database (an <code>onblocked</code> event is fired until tey are closed or reloaded). Here's how it works:</p>
+
+<pre class="brush: js">var openReq = mozIndexedDB.open("MyTestDatabase", 2);
+
+openReq.onblocked = function(event) {
+  // If some other tab is loaded with the database, then it needs to be closed
+  // before we can proceed.
+  alert("Please close all other tabs with this site open!");
+};
+
+openReq.onupgradeneeded = function(event) {
+  // All other databases have been closed. Set everything up.
+  db.createObjectStore(/* ... */);
+  useDatabase(db);
+}
+
+openReq.onsuccess = function(event) {
+  var db = event.target.result;
+  useDatabase(db);
+  return;
+}
+
+function useDatabase(db) {
+  // Make sure to add a handler to be notified if another page requests a version
+  // change. We must close the database. This allows the other page to upgrade the database.
+  // If you don't do this then the upgrade won't happen until the user closes the tab.
+  db.onversionchange = function(event) {
+    db.close();
+    alert("A new version of this page is ready. Please reload!");
+  };
+
+  // Do stuff with the database.
+}
+</pre>
+
+<h2 id="Seguridad">Seguridad</h2>
+
+<p>IndexedDB uses the same-origin principle, which means that it ties the store to the origin of the site that creates it (typically, this is the site domain or subdomain), so it cannot be accessed by any other origin.</p>
+
+<p>It's important to note that IndexedDB doesn't work for content loaded into a frame from another site (either {{ HTMLElement("frame") }} or {{ HTMLElement("iframe") }}. This is a security and privacy measure and can be considered analogous the blocking of third-party cookies. For more details, see {{ bug(595307) }}.</p>
+
+<h2 id="Warning_About_Browser_Shutdown">Warning About Browser Shutdown</h2>
+
+<p>When the browser shuts down (e.g., when the user selects Exit or clicks the Close button), any pending IndexedDB transactions are (silently) aborted — they will not complete, and they will not trigger the error handler. Since the user can exit the browser at any time, this means that you cannot rely upon any particular transaction to complete or to know that it did not complete. There are several implications of this behavior.</p>
+
+<p>First, you should take care to always leave your database in a consistent state at the end of every transaction. For example, suppose that you are using IndexedDB to store a list of items that you allow the user to edit. You save the list after the edit by clearing the object store and then writing out the new list. If you clear the object store in one transaction and write the new list in another transaction, there is a danger that the browser will close after the clear but before the write, leaving you with an empty database. To avoid this, you should combine the clear and the write into a single transaction. </p>
+
+<p>Second, you should never tie database transactions to unload events. If the unload event is triggered by the browser closing, any transactions created in the unload event handler will never complete. An intuitive approach to maintaining some information across browser sessions is to read it from the database when the browser (or a particular page) is opened, update it as the user interacts with the browser, and then save it to the database when the browser (or page) closes. However, this will not work. The database transactions will be created in the unload event handler, but because they are asynchronous they will be aborted before they can execute.</p>
+
+<p>In fact, there is no way to guarantee that IndexedDB transactions will complete, even with normal browser shutdown. See {{ bug(870645) }}.</p>
+
+<h2 id="Full_IndexedDB_example" name="Full_IndexedDB_example">Full IndexedDB example</h2>
+
+<h3 id="HTML_Content">HTML Content</h3>
+
+<pre class="brush: html">&lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"&gt;&lt;/script&gt;
+
+    &lt;h1&gt;IndexedDB Demo: storing blobs, e-publication example&lt;/h1&gt;
+    &lt;div class="note"&gt;
+      &lt;p&gt;
+        Works and tested with:
+      &lt;/p&gt;
+      &lt;div id="compat"&gt;
+      &lt;/div&gt;
+    &lt;/div&gt;
+
+    &lt;div id="msg"&gt;
+    &lt;/div&gt;
+
+    &lt;form id="register-form"&gt;
+      &lt;table&gt;
+        &lt;tbody&gt;
+          &lt;tr&gt;
+            &lt;td&gt;
+              &lt;label for="pub-title" class="required"&gt;
+                Title:
+              &lt;/label&gt;
+            &lt;/td&gt;
+            &lt;td&gt;
+              &lt;input type="text" id="pub-title" name="pub-title" /&gt;
+            &lt;/td&gt;
+          &lt;/tr&gt;
+          &lt;tr&gt;
+            &lt;td&gt;
+              &lt;label for="pub-biblioid" class="required"&gt;
+                Bibliographic ID:&lt;br/&gt;
+                &lt;span class="note"&gt;(ISBN, ISSN, etc.)&lt;/span&gt;
+              &lt;/label&gt;
+            &lt;/td&gt;
+            &lt;td&gt;
+              &lt;input type="text" id="pub-biblioid" name="pub-biblioid"/&gt;
+            &lt;/td&gt;
+          &lt;/tr&gt;
+          &lt;tr&gt;
+            &lt;td&gt;
+              &lt;label for="pub-year"&gt;
+                Year:
+              &lt;/label&gt;
+            &lt;/td&gt;
+            &lt;td&gt;
+              &lt;input type="number" id="pub-year" name="pub-year" /&gt;
+            &lt;/td&gt;
+          &lt;/tr&gt;
+        &lt;/tbody&gt;
+        &lt;tbody&gt;
+          &lt;tr&gt;
+            &lt;td&gt;
+              &lt;label for="pub-file"&gt;
+                File image:
+              &lt;/label&gt;
+            &lt;/td&gt;
+            &lt;td&gt;
+              &lt;input type="file" id="pub-file"/&gt;
+            &lt;/td&gt;
+          &lt;/tr&gt;
+          &lt;tr&gt;
+            &lt;td&gt;
+              &lt;label for="pub-file-url"&gt;
+                Online-file image URL:&lt;br/&gt;
+                &lt;span class="note"&gt;(same origin URL)&lt;/span&gt;
+              &lt;/label&gt;
+            &lt;/td&gt;
+            &lt;td&gt;
+              &lt;input type="text" id="pub-file-url" name="pub-file-url"/&gt;
+            &lt;/td&gt;
+          &lt;/tr&gt;
+        &lt;/tbody&gt;
+      &lt;/table&gt;
+
+      &lt;div class="button-pane"&gt;
+        &lt;input type="button" id="add-button" value="Add Publication" /&gt;
+        &lt;input type="reset" id="register-form-reset"/&gt;
+      &lt;/div&gt;
+    &lt;/form&gt;
+
+    &lt;form id="delete-form"&gt;
+      &lt;table&gt;
+        &lt;tbody&gt;
+          &lt;tr&gt;
+            &lt;td&gt;
+              &lt;label for="pub-biblioid-to-delete"&gt;
+                Bibliographic ID:&lt;br/&gt;
+                &lt;span class="note"&gt;(ISBN, ISSN, etc.)&lt;/span&gt;
+              &lt;/label&gt;
+            &lt;/td&gt;
+            &lt;td&gt;
+              &lt;input type="text" id="pub-biblioid-to-delete"
+                     name="pub-biblioid-to-delete" /&gt;
+            &lt;/td&gt;
+          &lt;/tr&gt;
+          &lt;tr&gt;
+            &lt;td&gt;
+              &lt;label for="key-to-delete"&gt;
+                Key:&lt;br/&gt;
+                &lt;span class="note"&gt;(for example 1, 2, 3, etc.)&lt;/span&gt;
+              &lt;/label&gt;
+            &lt;/td&gt;
+            &lt;td&gt;
+              &lt;input type="text" id="key-to-delete"
+                     name="key-to-delete" /&gt;
+            &lt;/td&gt;
+          &lt;/tr&gt;
+        &lt;/tbody&gt;
+      &lt;/table&gt;
+      &lt;div class="button-pane"&gt;
+        &lt;input type="button" id="delete-button" value="Delete Publication" /&gt;
+        &lt;input type="button" id="clear-store-button"
+               value="Clear the whole store" class="destructive" /&gt;
+      &lt;/div&gt;
+    &lt;/form&gt;
+
+    &lt;form id="search-form"&gt;
+      &lt;div class="button-pane"&gt;
+        &lt;input type="button" id="search-list-button"
+               value="List database content" /&gt;
+      &lt;/div&gt;
+    &lt;/form&gt;
+
+    &lt;div&gt;
+      &lt;div id="pub-msg"&gt;
+      &lt;/div&gt;
+      &lt;div id="pub-viewer"&gt;
+      &lt;/div&gt;
+      &lt;ul id="pub-list"&gt;
+      &lt;/ul&gt;
+    &lt;/div&gt;
+</pre>
+
+<h3 id="CSS_Content">CSS Content</h3>
+
+<pre class="brush: css">body {
+  font-size: 0.8em;
+  font-family: Sans-Serif;
+}
+
+form {
+  background-color: #cccccc;
+  border-radius: 0.3em;
+  display: inline-block;
+  margin-bottom: 0.5em;
+  padding: 1em;
+}
+
+table {
+  border-collapse: collapse;
+}
+
+input {
+  padding: 0.3em;
+  border-color: #cccccc;
+  border-radius: 0.3em;
+}
+
+.required:after {
+  content: "*";
+  color: red;
+}
+
+.button-pane {
+  margin-top: 1em;
+}
+
+#pub-viewer {
+  float: right;
+  width: 48%;
+  height: 20em;
+  border: solid #d092ff 0.1em;
+}
+#pub-viewer iframe {
+  width: 100%;
+  height: 100%;
+}
+
+#pub-list {
+  width: 46%;
+  background-color: #eeeeee;
+  border-radius: 0.3em;
+}
+#pub-list li {
+  padding-top: 0.5em;
+  padding-bottom: 0.5em;
+  padding-right: 0.5em;
+}
+
+#msg {
+  margin-bottom: 1em;
+}
+
+.action-success {
+  padding: 0.5em;
+  color: #00d21e;
+  background-color: #eeeeee;
+  border-radius: 0.2em;
+}
+
+.action-failure {
+  padding: 0.5em;
+  color: #ff1408;
+  background-color: #eeeeee;
+  border-radius: 0.2em;
+}
+
+.note {
+  font-size: smaller;
+}
+
+.destructive {
+  background-color: orange;
+}
+.destructive:hover {
+  background-color: #ff8000;
+}
+.destructive:active {
+  background-color: red;
+}
+</pre>
+
+<p> </p>
+
+<h3 id="JavaScript_Content">JavaScript Content</h3>
+
+<pre class="brush: js">(function () {
+  var COMPAT_ENVS = [
+    ['Firefox', "&gt;= 16.0"],
+    ['Google Chrome',
+     "&gt;= 24.0 (you may need to get Google Chrome Canary), NO Blob storage support"]
+  ];
+  var compat = $('#compat');
+  compat.empty();
+  compat.append('&lt;ul id="compat-list"&gt;&lt;/ul&gt;');
+  COMPAT_ENVS.forEach(function(val, idx, array) {
+    $('#compat-list').append('&lt;li&gt;' + val[0] + ': ' + val[1] + '&lt;/li&gt;');
+  });
+
+  const DB_NAME = 'mdn-demo-indexeddb-epublications';
+  const DB_VERSION = 1; // Use a long long for this value (don't use a float)
+  const DB_STORE_NAME = 'publications';
+
+  var db;
+
+  // Used to keep track of which view is displayed to avoid uselessly reloading it
+  var current_view_pub_key;
+
+  function openDb() {
+    console.log("openDb ...");
+    var req = indexedDB.open(DB_NAME, DB_VERSION);
+    req.onsuccess = function (evt) {
+      // Better use "this" than "req" to get the result to avoid problems with
+      // garbage collection.
+      // db = req.result;
+      db = this.result;
+      console.log("openDb DONE");
+    };
+    req.onerror = function (evt) {
+      console.error("openDb:", evt.target.errorCode);
+    };
+
+    req.onupgradeneeded = function (evt) {
+      console.log("openDb.onupgradeneeded");
+      var store = evt.currentTarget.result.createObjectStore(
+        DB_STORE_NAME, { keyPath: 'id', autoIncrement: true });
+
+      store.createIndex('biblioid', 'biblioid', { unique: true });
+      store.createIndex('title', 'title', { unique: false });
+      store.createIndex('year', 'year', { unique: false });
+    };
+  }
+
+  /**
+   * @param {string} store_name
+   * @param {string} mode either "readonly" or "readwrite"
+   */
+  function getObjectStore(store_name, mode) {
+    var tx = db.transaction(store_name, mode);
+    return tx.objectStore(store_name);
+  }
+
+  function clearObjectStore(store_name) {
+    var store = getObjectStore(DB_STORE_NAME, 'readwrite');
+    var req = store.clear();
+    req.onsuccess = function(evt) {
+      displayActionSuccess("Store cleared");
+      displayPubList(store);
+    };
+    req.onerror = function (evt) {
+      console.error("clearObjectStore:", evt.target.errorCode);
+      displayActionFailure(this.error);
+    };
+  }
+
+  function getBlob(key, store, success_callback) {
+    var req = store.get(key);
+    req.onsuccess = function(evt) {
+      var value = evt.target.result;
+      if (value)
+        success_callback(value.blob);
+    };
+  }
+
+  /**
+   * @param {IDBObjectStore=} store
+   */
+  function displayPubList(store) {
+    console.log("displayPubList");
+
+    if (typeof store == 'undefined')
+      store = getObjectStore(DB_STORE_NAME, 'readonly');
+
+    var pub_msg = $('#pub-msg');
+    pub_msg.empty();
+    var pub_list = $('#pub-list');
+    pub_list.empty();
+    // Resetting the iframe so that it doesn't display previous content
+    newViewerFrame();
+
+    var req;
+    req = store.count();
+    // Requests are executed in the order in which they were made against the
+    // transaction, and their results are returned in the same order.
+    // Thus the count text below will be displayed before the actual pub list
+    // (not that it is algorithmically important in this case).
+    req.onsuccess = function(evt) {
+      pub_msg.append('&lt;p&gt;There are &lt;strong&gt;' + evt.target.result +
+                     '&lt;/strong&gt; record(s) in the object store.&lt;/p&gt;');
+    };
+    req.onerror = function(evt) {
+      console.error("add error", this.error);
+      displayActionFailure(this.error);
+    };
+
+    var i = 0;
+    req = store.openCursor();
+    req.onsuccess = function(evt) {
+      var cursor = evt.target.result;
+
+      // If the cursor is pointing at something, ask for the data
+      if (cursor) {
+        console.log("displayPubList cursor:", cursor);
+        req = store.get(cursor.key);
+        req.onsuccess = function (evt) {
+          var value = evt.target.result;
+          var list_item = $('&lt;li&gt;' +
+                            '[' + cursor.key + '] ' +
+                            '(biblioid: ' + value.biblioid + ') ' +
+                            value.title +
+                            '&lt;/li&gt;');
+          if (value.year != null)
+            list_item.append(' - ' + value.year);
+
+          if (value.hasOwnProperty('blob') &amp;&amp;
+              typeof value.blob != 'undefined') {
+            var link = $('&lt;a href="' + cursor.key + '"&gt;File&lt;/a&gt;');
+            link.on('click', function() { return false; });
+            link.on('mouseenter', function(evt) {
+                      setInViewer(evt.target.getAttribute('href')); });
+            list_item.append(' / ');
+            list_item.append(link);
+          } else {
+            list_item.append(" / No attached file");
+          }
+          pub_list.append(list_item);
+        };
+
+        // Move on to the next object in store
+        cursor.continue();
+
+        // This counter serves only to create distinct ids
+        i++;
+      } else {
+        console.log("No more entries");
+      }
+    };
+  }
+
+  function newViewerFrame() {
+    var viewer = $('#pub-viewer');
+    viewer.empty();
+    var iframe = $('&lt;iframe /&gt;');
+    viewer.append(iframe);
+    return iframe;
+  }
+
+  function setInViewer(key) {
+    console.log("setInViewer:", arguments);
+    key = Number(key);
+    if (key == current_view_pub_key)
+      return;
+
+    current_view_pub_key = key;
+
+    var store = getObjectStore(DB_STORE_NAME, 'readonly');
+    getBlob(key, store, function(blob) {
+      console.log("setInViewer blob:", blob);
+      var iframe = newViewerFrame();
+
+      // It is not possible to set a direct link to the
+      // blob to provide a mean to directly download it.
+      if (blob.type == 'text/html') {
+        var reader = new FileReader();
+        reader.onload = (function(evt) {
+          var html = evt.target.result;
+          iframe.load(function() {
+            $(this).contents().find('html').html(html);
+          });
+        });
+        reader.readAsText(blob);
+      } else if (blob.type.indexOf('image/') == 0) {
+        iframe.load(function() {
+          var img_id = 'image-' + key;
+          var img = $('&lt;img id="' + img_id + '"/&gt;');
+          $(this).contents().find('body').html(img);
+          var obj_url = window.URL.createObjectURL(blob);
+          $(this).contents().find('#' + img_id).attr('src', obj_url);
+          window.URL.revokeObjectURL(obj_url);
+        });
+      } else if (blob.type == 'application/pdf') {
+        $('*').css('cursor', 'wait');
+        var obj_url = window.URL.createObjectURL(blob);
+        iframe.load(function() {
+          $('*').css('cursor', 'auto');
+        });
+        iframe.attr('src', obj_url);
+        window.URL.revokeObjectURL(obj_url);
+      } else {
+        iframe.load(function() {
+          $(this).contents().find('body').html("No view available");
+        });
+      }
+
+    });
+  }
+
+  /**
+   * @param {string} biblioid
+   * @param {string} title
+   * @param {number} year
+   * @param {string} url the URL of the image to download and store in the local
+   *   IndexedDB database. The resource behind this URL is subjected to the
+   *   "Same origin policy", thus for this method to work, the URL must come from
+   *   the same origin as the web site/app this code is deployed on.
+   */
+  function addPublicationFromUrl(biblioid, title, year, url) {
+    console.log("addPublicationFromUrl:", arguments);
+
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', url, true);
+    // Setting the wanted responseType to "blob"
+    // http://www.w3.org/TR/XMLHttpRequest2/#the-response-attribute
+    xhr.responseType = 'blob';
+    xhr.onload = function (evt) {
+                           if (xhr.status == 200) {
+                             console.log("Blob retrieved");
+                             var blob = xhr.response;
+                             console.log("Blob:", blob);
+                             addPublication(biblioid, title, year, blob);
+                           } else {
+                             console.error("addPublicationFromUrl error:",
+                                           xhr.responseText, xhr.status);
+                           }
+                         };
+    xhr.send();
+
+    // We can't use jQuery here because as of jQuery 1.8.3 the new "blob"
+    // responseType is not handled.
+    // http://bugs.jquery.com/ticket/11461
+    // http://bugs.jquery.com/ticket/7248
+    // $.ajax({
+    //   url: url,
+    //   type: 'GET',
+    //   xhrFields: { responseType: 'blob' },
+    //   success: function(data, textStatus, jqXHR) {
+    //     console.log("Blob retrieved");
+    //     console.log("Blob:", data);
+    //     // addPublication(biblioid, title, year, data);
+    //   },
+    //   error: function(jqXHR, textStatus, errorThrown) {
+    //     console.error(errorThrown);
+    //     displayActionFailure("Error during blob retrieval");
+    //   }
+    // });
+  }
+
+  /**
+   * @param {string} biblioid
+   * @param {string} title
+   * @param {number} year
+   * @param {Blob=} blob
+   */
+  function addPublication(biblioid, title, year, blob) {
+    console.log("addPublication arguments:", arguments);
+    var obj = { biblioid: biblioid, title: title, year: year };
+    if (typeof blob != 'undefined')
+      obj.blob = blob;
+
+    var store = getObjectStore(DB_STORE_NAME, 'readwrite');
+    var req;
+    try {
+      req = store.add(obj);
+    } catch (e) {
+      if (e.name == 'DataCloneError')
+        displayActionFailure("This engine doesn't know how to clone a Blob, " +
+                             "use Firefox");
+      throw e;
+    }
+    req.onsuccess = function (evt) {
+      console.log("Insertion in DB successful");
+      displayActionSuccess();
+      displayPubList(store);
+    };
+    req.onerror = function() {
+      console.error("addPublication error", this.error);
+      displayActionFailure(this.error);
+    };
+  }
+
+  /**
+   * @param {string} biblioid
+   */
+  function deletePublicationFromBib(biblioid) {
+    console.log("deletePublication:", arguments);
+    var store = getObjectStore(DB_STORE_NAME, 'readwrite');
+    var req = store.index('biblioid');
+    req.get(biblioid).onsuccess = function(evt) {
+      if (typeof evt.target.result == 'undefined') {
+        displayActionFailure("No matching record found");
+        return;
+      }
+      deletePublication(evt.target.result.id, store);
+    };
+    req.onerror = function (evt) {
+      console.error("deletePublicationFromBib:", evt.target.errorCode);
+    };
+  }
+
+  /**
+   * @param {number} key
+   * @param {IDBObjectStore=} store
+   */
+  function deletePublication(key, store) {
+    console.log("deletePublication:", arguments);
+
+    if (typeof store == 'undefined')
+      store = getObjectStore(DB_STORE_NAME, 'readwrite');
+
+    // As per spec http://www.w3.org/TR/IndexedDB/#object-store-deletion-operation
+    // the result of the Object Store Deletion Operation algorithm is
+    // undefined, so it's not possible to know if some records were actually
+    // deleted by looking at the request result.
+    var req = store.get(key);
+    req.onsuccess = function(evt) {
+      var record = evt.target.result;
+      console.log("record:", record);
+      if (typeof record == 'undefined') {
+        displayActionFailure("No matching record found");
+        return;
+      }
+      // Warning: The exact same key used for creation needs to be passed for
+      // the deletion. If the key was a Number for creation, then it needs to
+      // be a Number for deletion.
+      req = store.delete(key);
+      req.onsuccess = function(evt) {
+        console.log("evt:", evt);
+        console.log("evt.target:", evt.target);
+        console.log("evt.target.result:", evt.target.result);
+        console.log("delete successful");
+        displayActionSuccess("Deletion successful");
+        displayPubList(store);
+      };
+      req.onerror = function (evt) {
+        console.error("deletePublication:", evt.target.errorCode);
+      };
+    };
+    req.onerror = function (evt) {
+      console.error("deletePublication:", evt.target.errorCode);
+      };
+  }
+
+  function displayActionSuccess(msg) {
+    msg = typeof msg != 'undefined' ? "Success: " + msg : "Success";
+    $('#msg').html('&lt;span class="action-success"&gt;' + msg + '&lt;/span&gt;');
+  }
+  function displayActionFailure(msg) {
+    msg = typeof msg != 'undefined' ? "Failure: " + msg : "Failure";
+    $('#msg').html('&lt;span class="action-failure"&gt;' + msg + '&lt;/span&gt;');
+  }
+  function resetActionStatus() {
+    console.log("resetActionStatus ...");
+    $('#msg').empty();
+    console.log("resetActionStatus DONE");
+  }
+
+  function addEventListeners() {
+    console.log("addEventListeners");
+
+    $('#register-form-reset').click(function(evt) {
+      resetActionStatus();
+    });
+
+    $('#add-button').click(function(evt) {
+      console.log("add ...");
+      var title = $('#pub-title').val();
+      var biblioid = $('#pub-biblioid').val();
+      if (!title || !biblioid) {
+        displayActionFailure("Required field(s) missing");
+        return;
+      }
+      var year = $('#pub-year').val();
+      if (year != '') {
+        // Better use Number.isInteger if the engine has EcmaScript 6
+        if (isNaN(year))  {
+          displayActionFailure("Invalid year");
+          return;
+        }
+        year = Number(year);
+      } else {
+        year = null;
+      }
+
+      var file_input = $('#pub-file');
+      var selected_file = file_input.get(0).files[0];
+      console.log("selected_file:", selected_file);
+      // Keeping a reference on how to reset the file input in the UI once we
+      // have its value, but instead of doing that we rather use a "reset" type
+      // input in the HTML form.
+      //file_input.val(null);
+      var file_url = $('#pub-file-url').val();
+      if (selected_file) {
+        addPublication(biblioid, title, year, selected_file);
+      } else if (file_url) {
+        addPublicationFromUrl(biblioid, title, year, file_url);
+      } else {
+        addPublication(biblioid, title, year);
+      }
+
+    });
+
+    $('#delete-button').click(function(evt) {
+      console.log("delete ...");
+      var biblioid = $('#pub-biblioid-to-delete').val();
+      var key = $('#key-to-delete').val();
+
+      if (biblioid != '') {
+        deletePublicationFromBib(biblioid);
+      } else if (key != '') {
+        // Better use Number.isInteger if the engine has EcmaScript 6
+        if (key == '' || isNaN(key))  {
+          displayActionFailure("Invalid key");
+          return;
+        }
+        key = Number(key);
+        deletePublication(key);
+      }
+    });
+
+    $('#clear-store-button').click(function(evt) {
+      clearObjectStore();
+    });
+
+    var search_button = $('#search-list-button');
+    search_button.click(function(evt) {
+      displayPubList();
+    });
+
+  }
+
+  openDb();
+  addEventListeners();
+
+})(); // Immediately-Invoked Function Expression (IIFE)
+</pre>
+
+<p>{{ LiveSampleLink('Full_IndexedDB_example', "Test the online live demo") }}</p>
+
+<h2 id="Next_step">Next step</h2>
+
+<p>If you want to start tinkering with the API, jump in to the <a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">reference documentation</a> and check out the different methods.</p>
+
+<h2 id="See_also">See also</h2>
+
+<p>Reference</p>
+
+<ul>
+ <li><a href="/en/IndexedDB" title="https://developer.mozilla.org/en/IndexedDB">IndexedDB API Reference</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/IndexedDB/" title="http://www.w3.org/TR/IndexedDB/">Indexed Database API Specification</a></li>
+ <li><a href="/en-US/docs/IndexedDB/Using_IndexedDB_in_chrome" title="/en-US/docs/IndexedDB/Using_IndexedDB_in_chrome">Using IndexedDB in chrome</a></li>
+</ul>
+
+<p>Tutorials</p>
+
+<ul>
+ <li><a class="external" href="http://www.html5rocks.com/tutorials/indexeddb/todo/" title="http://www.html5rocks.com/tutorials/indexeddb/todo/">A simple TODO list using HTML5 IndexedDB</a><span class="external">. {{Note("This tutorial is based on an old version of the specification and does not work on up-to-date browsers - it still uses the removed <code>setVersion()</code> method.") }}</span></li>
+ <li><a href="http://www.html5rocks.com/en/tutorials/indexeddb/uidatabinding/" title="http://www.html5rocks.com/en/tutorials/indexeddb/uidatabinding/">Databinding UI Elements with IndexedDB</a></li>
+</ul>
+
+<p>Related articles</p>
+
+<ul>
+ <li><a class="external" href="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx" title="http://msdn.microsoft.com/en-us/scriptjunkie/gg679063.aspx">IndexedDB — The Store in Your Browser</a></li>
+</ul>
+
+<p>Firefox</p>
+
+<ul>
+ <li>Mozilla <a class="link-https" href="https://mxr.mozilla.org/mozilla-central/find?text=&amp;string=dom%2FindexedDB%2F.*%5C.idl&amp;regexp=1" title="https://mxr.mozilla.org/mozilla-central/find?text=&amp;string=dom/indexedDB/.*\.idl&amp;regexp=1">interface files</a></li>
+</ul>
diff --git a/files/es/web/api/media_streams_api/index.html b/files/es/web/api/media_streams_api/index.html
new file mode 100644
index 0000000000..38ece0b5b8
--- /dev/null
+++ b/files/es/web/api/media_streams_api/index.html
@@ -0,0 +1,446 @@
+---
+title: API de MediaStream
+slug: Web/API/Media_Streams_API
+translation_of: Web/API/Media_Streams_API
+original_slug: WebRTC/MediaStream_API
+---
+<p>{{SeeCompatTable}}</p>
+<p>La <strong>API de proceso <a href="#_edn1" name="_ednref1" title=""><strong>[i]</strong></a><em>MediaStream</em></strong>, a veces llamada<em>Media Stream API</em> o<em> Stream API</em>, es parte de la norma <a href="https://developer.mozilla.org/en-US/docs/WebRTC" title="https://developer.mozilla.org/en-US/docs/WebRTC">WebRTC [en]</a> y describe un flujo de datos de audio o video, los métodos para trabajar con ellos, las limitaciones asociadas con este tipo de datos, las respuestas de error y éxito al usar los datos asincrónicamente y los eventos que se disparan durante el proceso.</p>
+<div>
+   </div>
+<h2 id="Conceptos_Básicos">Conceptos Básicos</h2>
+<p>La API está basada sobre la manipulación de  un objeto {{domxref("MediaStream")}} que representa un flujo de datos de audio o video. Generalmente, un objeto <code>MediaStream</code> es una simple cadena URL que puede ser usada para referirse a datos almacenados en un {{domxref("Archivo")}} DOM  o un objeto {{domxref("Blob")}} creado con {{domxref("window.URL.createObjectURL()")}}, como se lo describe en<a href="https://developer.mozilla.org/en-US/docs/WebRTC/taking_webcam_photos#Get_the_video" title="https://developer.mozilla.org/en-US/docs/WebRTC/taking_webcam_photos#Get_the_video"> <u>Obtener el video</u></a>.</p>
+<p>Un <code>MediaStream</code> está compuesto por más objetos <a href="#_edn1" name="_ednref1" title="">[i]</a>{{domxref("MediaStreamTrack")}} que representan varias <strong>pistas</strong> de audio o video. Cada <code>MediaStreamTrack </code>puede tener uno o más <strong>canales</strong>. El canal representa la unidad menor de un flujo de medio, como una señal de audio asociada a un parlante específico, como el <em>izquierdo</em> o el <em>derecho</em> en una pista de audio estéreo.</p>
+<p>Los objetos <code>MediaStream</code> poseen una sola <strong>entrada</strong> y <strong>salida<a href="#_edn2" name="_ednref2" title=""><strong>[ii]</strong></a>. </strong>Un objeto <code>MediaStream</code> creado con <a href="https://developer.mozilla.org/en-US/docs/Web/API/Navigator.getUserMedia?redirectlocale=en-US&amp;redirectslug=WebRTC%2Fnavigator.getUserMedia" title="https://developer.mozilla.org/en-US/docs/Web/API/Navigator.getUserMedia?redirectlocale=en-US&amp;redirectslug=WebRTC%2Fnavigator.getUserMedia"><u>getUserMedia()</u></a> se denomina <em>local </em>y tiene como origen de entrada una de las cámaras o micrófonos del usuario. Un MediaStream no local puede estar representando un elemento de medio como {{HTMLElement("video")}} o {{HTMLElement("audio")}}, un flujo originado en la red y obtenido a través de la <a href="#_edn3" name="_ednref3" title="">[iii]</a><a href="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API" title="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API"><em><u>PeerConnection API</u></em></a> o un flujo creado con la <a href="https://developer.mozilla.org/en-US/docs/Web_Audio_API" title="https://developer.mozilla.org/en-US/docs/Web_Audio_API"><u>API de Audio Web</u></a> <a href="#_edn4" name="_ednref4" title="">[iv]</a>{{domxref("MediaStreamAudioSourceNode")}}. La salida de un objeto <code>MediaStream</code> está enlazada a un <strong>consumidor.</strong> El mismo puede ser un elemento de medio  como <code>&lt;audio&gt; o &lt;video&gt;</code>, la <a href="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API" title="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API"><u>PeerConnection API</u></a> de WebRTC o una <a href="https://developer.mozilla.org/en-US/docs/Web_Audio_API" title="https://developer.mozilla.org/en-US/docs/Web_Audio_API"><u>API de Audio Web</u></a> <a href="#_edn5" name="_ednref5" title="">[v]</a>{{domxref("MediaStreamAudioDestinationNode")}}.</p>
+<div>
+   </div>
+<h2 id="Referencia">Referencia</h2>
+<div class="index">
+  <ul>
+    <li>{{event("addtrack")}} (event)</li>
+    <li>{{domxref("AudioStreamTrack")}}</li>
+    <li>{{domxref("BlobEvent")}}</li>
+    <li>{{domxref("BlobEventInit")}}</li>
+    <li>{{event("ended (MediaStream)")}} (event)</li>
+    <li>{{event("ended (MediaStreamTrack)")}} (event)</li>
+    <li>{{domxref("MediaStream")}}</li>
+    <li>{{domxref("MediaStreamConstraints")}}</li>
+    <li>{{domxref("MediaStreamTrack")}}</li>
+    <li>{{domxref("MediaStreamTrackEvent")}}</li>
+    <li>{{domxref("MediaStreamTrackList")}}</li>
+    <li>{{domxref("MediaTrackConstraints")}}</li>
+    <li>{{event("muted")}} (event)</li>
+    <li>{{domxref("NavigatorUserMedia")}}</li>
+    <li>{{domxref("NavigatorUserMediaError")}}</li>
+    <li>{{event("overconstrained")}} (event)</li>
+    <li>{{event("removetrack")}} (event)</li>
+    <li>{{event("started")}} (event)</li>
+    <li>{{event("unmuted")}} (event)</li>
+    <li>{{domxref("URL")}}</li>
+    <li>{{domxref("VideoStreamTrack")}}</li>
+  </ul>
+</div>
+<h2 id="Pista_de_MediaStream">Pista de MediaStream</h2>
+<p>Una <em>MediaStreamTrack </em>puede ser de dos tipos, de audio o video, y representa el origen del medio, como una cámara.</p>
+<h3 id="Atributos">Atributos</h3>
+<table>
+  <thead>
+    <tr>
+      <th scope="col">Atributo</th>
+      <th scope="col">Tipo</th>
+      <th scope="col">Descripción</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>enabled</td>
+      <td>Boolean </td>
+      <td>True si la pista sigue asociada a su fuente.</td>
+    </tr>
+    <tr>
+      <td>id</td>
+      <td>DOMString, read-only</td>
+      <td>Un <em>globally unique identifier </em>(GUID) que describe la pista de medios.</td>
+    </tr>
+    <tr>
+      <td>kind</td>
+      <td>DOMString, read-only</td>
+      <td>El <strong>audio</strong> o <strong>video</strong> para la pista de origen.</td>
+    </tr>
+    <tr>
+      <td>label</td>
+      <td>DOMString, read-only</td>
+      <td>Una cadena de tipo usuario-asignada que identifica la pista de origen, como en "internal microphone." </td>
+    </tr>
+    <tr>
+      <td>onended</td>
+      <td>EventHandler</td>
+      <td>Maneja el evento finalizado cuando se lo activa en el objeto MediaStreamTrack.</td>
+    </tr>
+    <tr>
+      <td>onmute </td>
+      <td>EventHandler</td>
+      <td>Maneja el evento mudo del objeto MediaStreamTrack. </td>
+    </tr>
+    <tr>
+      <td>onoverconstrained</td>
+      <td>EventHandler</td>
+      <td>Maneja el evento superrestricto cuando se lo activa en el objeto MediaStreamTrack.</td>
+    </tr>
+    <tr>
+      <td>onstarted</td>
+      <td>EventHandler</td>
+      <td>Maneja el evento iniciado cuando se lo activa en el objeto MediaStreamTrack.</td>
+    </tr>
+    <tr>
+      <td>onunmute </td>
+      <td>EventHandler</td>
+      <td>Manjea el evento sin enmudecer cuando se lo activa en el objeto MediaStreamTrack.</td>
+    </tr>
+    <tr>
+      <td>readyState</td>
+      <td>unsigned short, read-only</td>
+      <td>
+        <p>Valores para la pista lista:</p>
+        <ul>
+          <li>live - la pista está activa; la salida se puede activar <em>on</em> y <em>off</em> con el atributo habilitado.</li>
+          <li>muted - el origen del medio subyacente de la pista no puede proveer temporalmente datos en tiempo real.</li>
+        </ul>
+      </td>
+    </tr>
+    <tr>
+      <td>sourceId</td>
+      <td>DOMString, read-only</td>
+      <td>La identidad de este origen que es único para esta aplicación y persistente. Se recomienda una GUID pero no es obligatoria.</td>
+    </tr>
+    <tr>
+      <td>sourceType</td>
+      <td>SourceTypeEnum, read-only</td>
+      <td>Contiene el tipo de información del origen, si es que existe.</td>
+    </tr>
+  </tbody>
+</table>
+<h3 id="Eventos">Eventos</h3>
+<table>
+  <thead>
+    <tr>
+      <th scope="col">Evento</th>
+      <th scope="col">Interfaz</th>
+      <th scope="col">Descripción </th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>started</td>
+      <td>Event</td>
+      <td>El objeto MediaStreamTrack no es más "new" en el readyState.</td>
+    </tr>
+    <tr>
+      <td>muted</td>
+      <td>Event</td>
+      <td>El origen del objeto MediaStreamTrack no puede proveer datos temporalmente.</td>
+    </tr>
+    <tr>
+      <td>unmuted </td>
+      <td>Event</td>
+      <td>El origen del objeto MediaStreamTrack a recomenzado a proveer datos</td>
+    </tr>
+    <tr>
+      <td>overconstrained</td>
+      <td>Event</td>
+      <td>El origen del objeto MediaStreamTrack no puede ser confugurado para que encaje en las restricciones impuestas por la pista. Esto podría ocurrir con la altura en el caso de un video, entre otras posibilidades.</td>
+    </tr>
+    <tr>
+      <td>ended</td>
+      <td>Event</td>
+      <td>
+        <p>El origen del objeto MediaStreamTrack no proveerá datos; puede ocurrir por lo siguiente:</p>
+        <ul>
+          <li>el usuario a deshabilitado los permisos de la aplicación</li>
+          <li>el dispositivo de origen está desconectado</li>
+          <li>el <em>peer</em> remoto no transmite datos</li>
+          <li>se llamó el método stop()</li>
+        </ul>
+      </td>
+    </tr>
+  </tbody>
+</table>
+<h3 id="appendConstraint()">appendConstraint()</h3>
+<p>Agrega la restricción al final de la lista. Esto sólo es un método para añadir restricciones optativas.</p>
+<dl>
+  <dt>
+    Parámetros</dt>
+  <dd>
+    constraintName <strong>DOMString</strong>, required.</dd>
+  <dd>
+    constraintValue <strong>Primitive (DOMString, float, etc.) </strong>or<strong> MinMaxConstraint</strong>, required.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    void</dd>
+  <dt>
+    Excepciones</dt>
+  <dd>
+    None.</dd>
+</dl>
+<h3 id="applyConstraints()">applyConstraints()</h3>
+<p>Aplica una lista de opciones optativas a la pista. Sobrescribe cualquier otra restricción optativa ya existente en la pista.</p>
+<dl>
+  <dt>
+    <strong>Parámetros</strong></dt>
+  <dd>
+    constraints <strong>MediaTrackConstraints</strong>, required.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    void</dd>
+  <dt>
+    Excepciones</dt>
+  <dd>
+    None.</dd>
+</dl>
+<h3 id="constraints()">constraints()</h3>
+<p>Devuelte todas las <a href="#_edn1" name="_ednref1" title="">[i]</a>restricciones en la pista, obligatorias y optativas. Si tanto<em> <code>mandatory </code></em>u <code>optional</code> no tienen restricciones, ese campo será <code>undefined</code>. Si ninguno tiene restricciones, entonces<code> constraints()</code> devolverá <code>null<em>.</em></code></p>
+<dl>
+  <dt>
+    Parámetros</dt>
+  <dd>
+    None.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    <strong>MediaTrackConstraints</strong> or <strong>null</strong></dd>
+  <dt>
+    <span id="cke_bm_186C" style="display: none;"> </span>Excepciones</dt>
+  <dd>
+    None.</dd>
+</dl>
+<h3 id="getConstraint()">getConstraint()</h3>
+<p>Trae una restricción específica, por nombre, de la pista. Este método puede devolver una de varias posibilidades:</p>
+<ul>
+  <li>Si su restricción no existe, devuelve <code>null.</code></li>
+  <li>Si no provee true para parámetro optativo<code>mandatory </code>y su búsqueda resulta en más de una restricción, este método devolverá una lista. Cada ítem de la lista será el nombre de la búsqueda así como su valor o un objeto <code>MinMaxConstraint</code>. La lista se agrupa con la entrada 0º como la más importante y cada entrada posterior es progresivamente menos importante.</li>
+  <li>Si provee<code>True </code>al parámetro <code>mandatory</code> y su búsqueda es miembro del <code>MediaTrackConstraintSet </code>de la pista, este método devuelve su valor primitivo o su <code>MinMaxConstraint</code>, cualquiera que aplique al caso.</li>
+</ul>
+<dl>
+  <dt>
+    Parámetros</dt>
+  <dd>
+    constraintName <strong>DOMString</strong>, required.</dd>
+  <dd>
+    mandatory <strong>boolean</strong>, optional, default false.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    Any of the possibilities mentioned above.</dd>
+  <dt>
+    Excepciones</dt>
+  <dd>
+    None.</dd>
+</dl>
+<p>--</p>
+<h3 id="stop()">stop()</h3>
+<p>Detiene permanentemente la creación de datos para las pistas y remueve las referencias a los orígines.</p>
+<dl>
+  <dt>
+    Parámetros</dt>
+  <dd>
+    None.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    Void.</dd>
+  <dt>
+    Excepciones</dt>
+  <dd>
+    None.</dd>
+</dl>
+<h2 id="Lista_de_pistas_de_MediaStream">Lista de pistas de MediaStream</h2>
+<p>Un MediaStream tiene dos objetos MediaStreamTrackList, uno para la pista de video y otro para la de audio.</p>
+<table>
+  <thead>
+    <tr>
+      <th scope="col">Atributo </th>
+      <th scope="col">Tipo</th>
+      <th scope="col">Descripción</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>length</td>
+      <td>unsigned long, read-only </td>
+      <td>El número de pistas en la lista.</td>
+    </tr>
+    <tr>
+      <td>onaddtrack </td>
+      <td>EventHandler</td>
+      <td>Maneja el evento addtrack.</td>
+    </tr>
+    <tr>
+      <td>onremovetrack </td>
+      <td>EventHandler</td>
+      <td>Maneja el evento removetrack.</td>
+    </tr>
+  </tbody>
+</table>
+<h3 id="Eventos_2">Eventos</h3>
+<table>
+  <thead>
+    <tr>
+      <th scope="col">Evento</th>
+      <th scope="col">Interfaz</th>
+      <th scope="col">Descripción </th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>addtrack </td>
+      <td>MediaStreamTrackEvent </td>
+      <td>Se agregó una MediaStreamTrack a la lista.</td>
+    </tr>
+    <tr>
+      <td>removetrack </td>
+      <td>MediaStreamTrackEvent</td>
+      <td>Se removió una MediaStreamTrack de la lista.</td>
+    </tr>
+  </tbody>
+</table>
+<h3 id="add()">add()</h3>
+<p>Agrega una MediaStreamTrack a la lista de pistas.</p>
+<dl>
+  <dt>
+    Parámetros</dt>
+  <dd>
+    MediaStreamTrack <strong>track</strong>, required.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    Void.</dd>
+  <dt>
+    Excepciones</dt>
+  <dd>
+    INVALID_STATE_ERR if the stream is finished (all tracks have ended).</dd>
+</dl>
+<h3 id="item()">item()<span id="cke_bm_369C" style="display: none;"> </span></h3>
+<p>Devuelve la MediaStreamTrack al valor de índice (index) especificado.</p>
+<dl>
+  <dt>
+    Parámetros</dt>
+  <dd>
+    unsigned long <strong>index</strong>, required.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    MediaStreamTrack</dd>
+  <dt>
+    Excepciones</dt>
+  <dd>
+    None.</dd>
+</dl>
+<h3 id="Remove()">Remove()</h3>
+<p>Remueve una MediaStreamTrack de la lista de pistas.</p>
+<dl>
+  <dt>
+    Parámetros</dt>
+  <dd>
+    MediaStreamTrack <strong>track</strong>, required.</dd>
+  <dt>
+    Devuelve</dt>
+  <dd>
+    Void.</dd>
+  <dt>
+    Excepciones</dt>
+  <dd>
+    INVALID_STATE_ERR if the stream is finished (all tracks have ended).</dd>
+</dl>
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera </th>
+        <th>Safari (WebKit)</th>
+      </tr>
+      <tr>
+        <td>Stream API </td>
+        <td>21{{ property_prefix("webkit") }} </td>
+        <td>nightly 18{{ property_prefix("moz") }} </td>
+        <td>{{ CompatUnknown() }} </td>
+        <td>12</td>
+        <td>{{ CompatUnknown() }} </td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Phone</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>Stream API </td>
+        <td>{{ CompatNo() }} </td>
+        <td>{{ CompatUnknown() }}</td>
+        <td>{{ CompatUnknown() }} </td>
+        <td>{{ CompatNo() }} </td>
+        <td>{{ CompatNo() }} </td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<p>Actualmente, el uso de WebRTC para acceder a la cámara está soportado en Chrome, Opera y Firefox Nightly 18. Habilitar WebRTC en Firefox Nightly requiere que usted establezca una advertencia (flag) en la configuración:</p>
+<ul style="margin: 0px 0px 1.286em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px;">
+  <li>Escriba "about:config" en la barra de direcciones y diga que sí quiere efectuar los cambios</li>
+  <li>Busque la entrada de "media.navigator.enabled" entry y establezca su valos a "true" [sin comillas]</li>
+</ul>
+<div>
+  <p> </p>
+  <div>
+    <br>
+    <hr>
+    <div id="edn1">
+      <p><a href="#_ednref1" name="_edn1" title="">[i]</a> en castellano,<em>Flujo o transmisión de [multi] Medios</em></p>
+    </div>
+  </div>
+  <hr>
+  <div id="edn1">
+    <p><a href="#_ednref1" name="_edn1" title="">[i]</a> en castellano,<em> Pista de Flujo de Media</em></p>
+  </div>
+  <div id="edn2">
+    <p><a href="#_ednref2" name="_edn2" title="">[ii]</a> del inglés, <em>input </em>y<em>output</em></p>
+  </div>
+  <div id="edn3">
+    <p><a href="#_ednref3" name="_edn3" title="">[iii]</a> en castellano, <em>API de Conexión de Pares</em></p>
+  </div>
+  <div id="edn4">
+    <p><a href="#_ednref4" name="_edn4" title="">[iv]</a> en castellano,<em> Nodo de origen del Audio MediaStream</em></p>
+  </div>
+  <div id="edn5">
+    <p><a href="#_ednref5" name="_edn5" title="">[v]</a> en castellano, <em>Nodo de destino del Audio MediaStream</em></p>
+    <div>
+      <br>
+      <hr>
+      <div id="edn1">
+        <p><a href="#_ednref1" name="_edn1" title="">[i]</a> del inglés,<em>constraints</em></p>
+      </div>
+    </div>
+  </div>
+</div>
+<p> </p>
+<h2 id="Ver_también">Ver también</h2>
+<ul>
+  <li><a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> - la página de introducción a la API</li>
+  <li><a href="/en-US/docs/WebRTC/navigator.getUserMedia" title="/en-US/docs/WebRTC/navigator.getUserMedia">getUserMedia()</a></li>
+  <li><a href="/en-US/docs/WebRTC/taking_webcam_photos" title="/en-US/docs/WebRTC/taking_webcam_photos">Taking webcam photos</a> - un tutorial para usar getUserMedia()</li>
+</ul>
diff --git a/files/es/web/api/navigator/geolocation/index.html b/files/es/web/api/navigator/geolocation/index.html
new file mode 100644
index 0000000000..88c239d50a
--- /dev/null
+++ b/files/es/web/api/navigator/geolocation/index.html
@@ -0,0 +1,107 @@
+---
+title: window.navigator.geolocation
+slug: Web/API/Navigator/geolocation
+translation_of: Web/API/Navigator/geolocation
+original_slug: Web/API/NavigatorGeolocation/geolocation
+---
+<p>{{APIRef("Geolocation API")}}<br>
+ La propiedad de sólo lectura <strong><code>Navigator.geolocation</code></strong> devuelve un objeto <a href="https://developer.mozilla.org/es/docs/Web/API/Geolocation" title="La interfaz Geolocalización representa un objeto capaz de obtener mediante programación la posición del dispositivo. Se da acceso Web de la ubicación del dispositivo. Esto permite a un sitio Web o aplicación ofrecer resultados personalizados basados ​​en la ubicación del usuario."><code>Geolocation</code></a> que proporciona acceso web a la ubicación de un dispositivo. Esto permite ofrecer al sitio web o aplicación resultados personalizados basados en la ubicación del usuario.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Por motivos de seguridad, cuando una página web trata de acceder a la información de ubicación, se solicita permiso al usuario. Cada navegador tiene sus propias reglas sobre cómo y cuándo obtener dicho permiso.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>geo</var> = <var>navigator</var>.geolocation
+</pre>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{domxref("geolocation.getCurrentPosition", "geolocation.getCurrentPosition()")}}</dt>
+ <dd>Utilizado para obtener la posición actual.</dd>
+ <dt>{{domxref("geolocation.watchPosition", "geolocation.watchPosition()")}}</dt>
+ <dd>Utilizado para asignar un manejador para dar seguimiento a cualquier cambio de ubicación.</dd>
+ <dt>{{domxref("geolocation.clearWatch", "geolocation.clearWatch()")}}</dt>
+ <dd>Utilizado para eliminar un manejador asignado a los cambios de ubicación.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('Geolocation')}}</td>
+   <td>{{Spec2('Geolocation')}}</td>
+   <td>Especificación inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>5</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
+   <td>9</td>
+   <td>10.60<br>
+    {{CompatNo}} 15.0<br>
+    16.0</td>
+   <td>5</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.1</td>
+   <td>50</td>
+   <td>{{CompatGeckoMobile("4")}}</td>
+   <td>10</td>
+   <td>10.60</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/docs/WebAPI/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Utilizando la geolocalización</a></li>
+</ul>
diff --git a/files/es/web/api/navigatorgeolocation/geolocation/index.html b/files/es/web/api/navigatorgeolocation/geolocation/index.html
deleted file mode 100644
index 94c22ef6b0..0000000000
--- a/files/es/web/api/navigatorgeolocation/geolocation/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: window.navigator.geolocation
-slug: Web/API/NavigatorGeolocation/geolocation
-translation_of: Web/API/Navigator/geolocation
----
-<p>{{APIRef("Geolocation API")}}<br>
- La propiedad de sólo lectura <strong><code>Navigator.geolocation</code></strong> devuelve un objeto <a href="https://developer.mozilla.org/es/docs/Web/API/Geolocation" title="La interfaz Geolocalización representa un objeto capaz de obtener mediante programación la posición del dispositivo. Se da acceso Web de la ubicación del dispositivo. Esto permite a un sitio Web o aplicación ofrecer resultados personalizados basados ​​en la ubicación del usuario."><code>Geolocation</code></a> que proporciona acceso web a la ubicación de un dispositivo. Esto permite ofrecer al sitio web o aplicación resultados personalizados basados en la ubicación del usuario.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Por motivos de seguridad, cuando una página web trata de acceder a la información de ubicación, se solicita permiso al usuario. Cada navegador tiene sus propias reglas sobre cómo y cuándo obtener dicho permiso.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>geo</var> = <var>navigator</var>.geolocation
-</pre>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{domxref("geolocation.getCurrentPosition", "geolocation.getCurrentPosition()")}}</dt>
- <dd>Utilizado para obtener la posición actual.</dd>
- <dt>{{domxref("geolocation.watchPosition", "geolocation.watchPosition()")}}</dt>
- <dd>Utilizado para asignar un manejador para dar seguimiento a cualquier cambio de ubicación.</dd>
- <dt>{{domxref("geolocation.clearWatch", "geolocation.clearWatch()")}}</dt>
- <dd>Utilizado para eliminar un manejador asignado a los cambios de ubicación.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('Geolocation')}}</td>
-   <td>{{Spec2('Geolocation')}}</td>
-   <td>Especificación inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>5</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
-   <td>9</td>
-   <td>10.60<br>
-    {{CompatNo}} 15.0<br>
-    16.0</td>
-   <td>5</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.1</td>
-   <td>50</td>
-   <td>{{CompatGeckoMobile("4")}}</td>
-   <td>10</td>
-   <td>10.60</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/docs/WebAPI/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Utilizando la geolocalización</a></li>
-</ul>
diff --git a/files/es/web/api/navigatorgeolocation/index.html b/files/es/web/api/navigatorgeolocation/index.html
deleted file mode 100644
index 0f8895b7b8..0000000000
--- a/files/es/web/api/navigatorgeolocation/index.html
+++ /dev/null
@@ -1,107 +0,0 @@
----
-title: NavigatorGeolocation
-slug: Web/API/NavigatorGeolocation
-tags:
-  - API
-translation_of: Web/API/Geolocation
-translation_of_original: Web/API/NavigatorGeolocation
----
-<p>{{APIRef("Geolocation API")}}</p>
-
-<p><code><strong>NavigatorGeolocation</strong></code>  contains a creation method allowing objects implementing it to obtain a {{domxref("Geolocation")}} instance.</p>
-
-<p>There is no object of type <code>NavigatorGeolocation</code>, but some interfaces, like {{domxref("Navigator")}} implements it.</p>
-
-<h2 id="Properties">Properties</h2>
-
-<p><em>The <code>NavigatorGeolocation</code></em><em> interface doesn't inherit any property.</em></p>
-
-<dl>
- <dt>{{domxref("NavigatorGeolocation.geolocation")}} {{readonlyInline}}</dt>
- <dd>Returns a {{domxref("Geolocation")}} object allowing accessing the location of the device.</dd>
-</dl>
-
-<h2 id="Methods">Methods</h2>
-
-<p><em>The </em><em><code>NavigatorGeolocation</code></em><em> interface neither implements, nor inherit any method.</em></p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Geolocation', '#navi-geo', 'NavigatorGeolocation')}}</td>
-   <td>{{Spec2('Geolocation')}}</td>
-   <td>Initial specification.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>5</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
-   <td>9</td>
-   <td>10.60<br>
-    Removed in 15.0<br>
-    Reintroduced in 16.0</td>
-   <td>5</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatUnknown()}}</td>
-   <td>{{CompatUnknown()}}</td>
-   <td>{{CompatGeckoMobile("4")}}</td>
-   <td>{{CompatUnknown()}}</td>
-   <td>10.60</td>
-   <td>{{CompatUnknown()}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/WebAPI/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Using geolocation.</a></li>
-</ul>
-
-<p> </p>
diff --git a/files/es/web/api/navigatoronline/eventos_online_y_offline/index.html b/files/es/web/api/navigatoronline/eventos_online_y_offline/index.html
deleted file mode 100644
index d4f8a77824..0000000000
--- a/files/es/web/api/navigatoronline/eventos_online_y_offline/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: Eventos online y offline
-slug: Web/API/NavigatorOnLine/Eventos_online_y_offline
-tags:
-  - AJAX
-  - DOM
-  - Desarrollo_Web
-  - Todas_las_Categorías
-translation_of: Web/API/NavigatorOnLine/Online_and_offline_events
----
-<p>{{ Fx_minversion_header(3) }}
-<a href="es/Firefox_3_para_desarrolladores">Firefox 3</a> implementa <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">eventos Online/Offline</a> de la <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">especificacióbn WHATWG Web Applications 1.0</a>.
-</p>
-<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n"> Descripción </h3>
-<p>Para poder construir una aplicación web offline-funcional, necesitas conocer cuándo está tu aplicación realmente offline. Además, también necesitas conocer cuándo vuelve la aplicación al estado 'online' nuevamente. A efectos prácticos, los requisitos son los siguientes:
-</p>
-<ol><li> Necesitas conocer cuándo el usuario vuelve a estar online, para que puedas re-sincronizar con el servidor.
-</li><li> Necesitas conocer cuándo el usuario está offline, para así estar seguro de poner en cola las peticiones al servidor para más tarde.
-</li></ol>
-<p>Es este proceso el que los eventos online/offline ayudan a trivializar.
-</p><p>Tu aplicación web quizás necesite establecer que ciertos documentos se mantengan en la caché de recursos offline. Para hacerlo, incluye elementos <code>LINK</code> en tu sección <code>HEAD</code> de la siguiente manera:
-</p>
-<pre class="eval"><span class="nowiki">&lt;link rel="offline-resource" href="mi_recurso&gt;</span>
-</pre>
-<p>Cuando Firefox 3 o superiores procesan el HTML, esto causará que el recurso referenciado se mantenga en caché para su uso offline en un recurso especial de la caché.
-</p>
-<h3 id="API" name="API"> API </h3>
-<h4 id="navigator.onLine" name="navigator.onLine"> <code>navigator.onLine</code> </h4>
-<p><code><a href="es/DOM/window.navigator.onLine">navigator.onLine</a></code> es una propiedad que mantiene un valor <code>true</code>/<code>false</code> (<code>true</code> para online, <code>false</code> para offline). Esta propiedad se actualiza siempre que el usuario cambia hacia "Modo sin conexión" seleccionando el menú correspondiente (Archivo -&gt; Trabajar sin conexión en Firefox).
-</p><p>Además, esta propiedad se debería actualizar siempre que el navegador no sea capaz de conectarse a la red. De acuerdo con la especificación:
-</p>
-<blockquote>
-El atributo <code>navigator.onLine</code> debe devolver false si el agente de usuario no contactará con la red cuando el usuario siga los enlaces o cuando un script solicite una página remota (o sepa que intentarlo fallaría)...
-</blockquote>
-<p>Firefox 2 actualiza esta propiedad cuando cambia desde/hacia el modo offline del navegador, y cuando pierde/recupera la conectividad de la red en Windows y Linux.
-</p><p>Esta propiedad existía en versiones más antiguas de Firefox e Internet Explorer (la especificación surgió a partir estas implementaciones previas), así que puedes comenzar a usarla inmediatamente. La detección automática del estado de la red se implementó en Firefox 2.
-</p>
-<h4 id="eventos_.22online.22_y_.22offline.22" name="eventos_.22online.22_y_.22offline.22"> eventos "<code>online</code>" y "<code>offline</code>" </h4>
-<p><a href="es/Firefox_3_para_desarrolladores">Firefox 3</a> introduce dos nuevos eventos: "<code>online</code>" y "<code>offline</code>". Estos dos eventos son iniciados en el <code>&lt;body&gt;</code> de cada página cuando el usuario cambia de modo online a offline. Además, los eventos emergen desde <code>document.body</code> a <code>document</code>, terminando en <code>window</code>. Ambos eventos son no-cancelables (no se puede evitar que el usuario pase a modo online u offline).
-</p><p>Puedes registrar <i>listeners</i> para estos eventos de varias maneras habituales:
-</p>
-<ul><li> Usando <code><a href="es/DOM/element.addEventListener">addEventListener</a></code> en <code>window</code>, <code>document</code> o <code>document.body</code>
-</li><li> estableciendo las propiedades <code>.ononline</code> u <code>.onoffline</code> en <code>document</code> o <code>document.body</code> para que apunten a un objeto JavaScript <code>Function</code> (<b>Nota:</b> usar <code>window.ononline</code> o <code>window.onoffline</code> no funcionará por razones de compatibilidad).
-</li><li> especificando los atributos <code>ononline="..."</code> u <code>onoffline="..."</code> en la etiqueta <code>&lt;body&gt;</code> en el código HTML.
-</li></ul>
-<h3 id="Ejemplo:" name="Ejemplo:"> Ejemplo: </h3>
-<p>Hay una <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">prueba sencilla</a> que puedes ejecutar para verificar que los eventos están funcionando.
-</p><p><span class="comment">
-</span></p>
-<pre class="eval"> &lt;!doctype html&gt;
- &lt;html&gt;
- &lt;head&gt;
-   &lt;script&gt;
-     function updateOnlineStatus(msg) {
-       var status = document.getElementById("status");
-       var condition = navigator.onLine ? "ONLINE" : "OFFLINE";
-       status.setAttribute("class", condition);
-       var state = document.getElementById("state");
-       state.innerHTML = condition;
-       var log = document.getElementById("log");
-       log.appendChild(document.createTextNode("Event: " + msg + "; status=" + condition + "\n"));
-     }
-     function loaded() {
-       updateOnlineStatus("load");
-       document.body.addEventListener("offline", function () {
-         updateOnlineStatus("offline")
-       }, false);
-       document.body.addEventListener("online", function () {
-         updateOnlineStatus("online")
-       }, false);
-     }
-   &lt;/script&gt;
-   &lt;style&gt;...&lt;/style&gt;
- &lt;/head&gt;
- &lt;body onload="loaded()"&gt;
-   &lt;div id="status"&gt;&lt;p id="state"&gt;&lt;/p&gt;&lt;/div&gt;
-   &lt;div id="log"&gt;&lt;/div&gt;
- &lt;/body&gt;
- &lt;/html&gt;
-</pre>
-<h3 id="Referencias" name="Referencias"> Referencias </h3>
-<ul><li> <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">Sección 'Eventos Online/Offline ' de la especificación WHATWG Web Applications 1.0 </a>
-</li><li> <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336359">El bug que documenta la implementación de los eventos online/offline en Firefox </a> y un enlace <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336682">con una modificación posterior</a>
-</li><li> <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">Un ejemplo sencillo</a>
-</li><li> <a class="external" href="http://ejohn.org/blog/offline-events/">Una explicación de los eventos Online/Offline</a>
-</li></ul>
-<p><br>
-</p>
-<div class="noinclude">
-</div>
-{{ languages( { "en": "en/Online_and_offline_events", "fr": "fr/\u00c9v\u00e8nements_online_et_offline", "ja": "ja/Online_and_offline_events", "pl": "pl/Zdarzenia_online_i_offline", "pt": "pt/Eventos_online_e_offline" } ) }}
diff --git a/files/es/web/api/navigatoronline/online_and_offline_events/index.html b/files/es/web/api/navigatoronline/online_and_offline_events/index.html
new file mode 100644
index 0000000000..46bbf4cf38
--- /dev/null
+++ b/files/es/web/api/navigatoronline/online_and_offline_events/index.html
@@ -0,0 +1,92 @@
+---
+title: Eventos online y offline
+slug: Web/API/NavigatorOnLine/Online_and_offline_events
+tags:
+  - AJAX
+  - DOM
+  - Desarrollo_Web
+  - Todas_las_Categorías
+translation_of: Web/API/NavigatorOnLine/Online_and_offline_events
+original_slug: Web/API/NavigatorOnLine/Eventos_online_y_offline
+---
+<p>{{ Fx_minversion_header(3) }}
+<a href="es/Firefox_3_para_desarrolladores">Firefox 3</a> implementa <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">eventos Online/Offline</a> de la <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">especificacióbn WHATWG Web Applications 1.0</a>.
+</p>
+<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n"> Descripción </h3>
+<p>Para poder construir una aplicación web offline-funcional, necesitas conocer cuándo está tu aplicación realmente offline. Además, también necesitas conocer cuándo vuelve la aplicación al estado 'online' nuevamente. A efectos prácticos, los requisitos son los siguientes:
+</p>
+<ol><li> Necesitas conocer cuándo el usuario vuelve a estar online, para que puedas re-sincronizar con el servidor.
+</li><li> Necesitas conocer cuándo el usuario está offline, para así estar seguro de poner en cola las peticiones al servidor para más tarde.
+</li></ol>
+<p>Es este proceso el que los eventos online/offline ayudan a trivializar.
+</p><p>Tu aplicación web quizás necesite establecer que ciertos documentos se mantengan en la caché de recursos offline. Para hacerlo, incluye elementos <code>LINK</code> en tu sección <code>HEAD</code> de la siguiente manera:
+</p>
+<pre class="eval"><span class="nowiki">&lt;link rel="offline-resource" href="mi_recurso&gt;</span>
+</pre>
+<p>Cuando Firefox 3 o superiores procesan el HTML, esto causará que el recurso referenciado se mantenga en caché para su uso offline en un recurso especial de la caché.
+</p>
+<h3 id="API" name="API"> API </h3>
+<h4 id="navigator.onLine" name="navigator.onLine"> <code>navigator.onLine</code> </h4>
+<p><code><a href="es/DOM/window.navigator.onLine">navigator.onLine</a></code> es una propiedad que mantiene un valor <code>true</code>/<code>false</code> (<code>true</code> para online, <code>false</code> para offline). Esta propiedad se actualiza siempre que el usuario cambia hacia "Modo sin conexión" seleccionando el menú correspondiente (Archivo -&gt; Trabajar sin conexión en Firefox).
+</p><p>Además, esta propiedad se debería actualizar siempre que el navegador no sea capaz de conectarse a la red. De acuerdo con la especificación:
+</p>
+<blockquote>
+El atributo <code>navigator.onLine</code> debe devolver false si el agente de usuario no contactará con la red cuando el usuario siga los enlaces o cuando un script solicite una página remota (o sepa que intentarlo fallaría)...
+</blockquote>
+<p>Firefox 2 actualiza esta propiedad cuando cambia desde/hacia el modo offline del navegador, y cuando pierde/recupera la conectividad de la red en Windows y Linux.
+</p><p>Esta propiedad existía en versiones más antiguas de Firefox e Internet Explorer (la especificación surgió a partir estas implementaciones previas), así que puedes comenzar a usarla inmediatamente. La detección automática del estado de la red se implementó en Firefox 2.
+</p>
+<h4 id="eventos_.22online.22_y_.22offline.22" name="eventos_.22online.22_y_.22offline.22"> eventos "<code>online</code>" y "<code>offline</code>" </h4>
+<p><a href="es/Firefox_3_para_desarrolladores">Firefox 3</a> introduce dos nuevos eventos: "<code>online</code>" y "<code>offline</code>". Estos dos eventos son iniciados en el <code>&lt;body&gt;</code> de cada página cuando el usuario cambia de modo online a offline. Además, los eventos emergen desde <code>document.body</code> a <code>document</code>, terminando en <code>window</code>. Ambos eventos son no-cancelables (no se puede evitar que el usuario pase a modo online u offline).
+</p><p>Puedes registrar <i>listeners</i> para estos eventos de varias maneras habituales:
+</p>
+<ul><li> Usando <code><a href="es/DOM/element.addEventListener">addEventListener</a></code> en <code>window</code>, <code>document</code> o <code>document.body</code>
+</li><li> estableciendo las propiedades <code>.ononline</code> u <code>.onoffline</code> en <code>document</code> o <code>document.body</code> para que apunten a un objeto JavaScript <code>Function</code> (<b>Nota:</b> usar <code>window.ononline</code> o <code>window.onoffline</code> no funcionará por razones de compatibilidad).
+</li><li> especificando los atributos <code>ononline="..."</code> u <code>onoffline="..."</code> en la etiqueta <code>&lt;body&gt;</code> en el código HTML.
+</li></ul>
+<h3 id="Ejemplo:" name="Ejemplo:"> Ejemplo: </h3>
+<p>Hay una <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">prueba sencilla</a> que puedes ejecutar para verificar que los eventos están funcionando.
+</p><p><span class="comment">
+</span></p>
+<pre class="eval"> &lt;!doctype html&gt;
+ &lt;html&gt;
+ &lt;head&gt;
+   &lt;script&gt;
+     function updateOnlineStatus(msg) {
+       var status = document.getElementById("status");
+       var condition = navigator.onLine ? "ONLINE" : "OFFLINE";
+       status.setAttribute("class", condition);
+       var state = document.getElementById("state");
+       state.innerHTML = condition;
+       var log = document.getElementById("log");
+       log.appendChild(document.createTextNode("Event: " + msg + "; status=" + condition + "\n"));
+     }
+     function loaded() {
+       updateOnlineStatus("load");
+       document.body.addEventListener("offline", function () {
+         updateOnlineStatus("offline")
+       }, false);
+       document.body.addEventListener("online", function () {
+         updateOnlineStatus("online")
+       }, false);
+     }
+   &lt;/script&gt;
+   &lt;style&gt;...&lt;/style&gt;
+ &lt;/head&gt;
+ &lt;body onload="loaded()"&gt;
+   &lt;div id="status"&gt;&lt;p id="state"&gt;&lt;/p&gt;&lt;/div&gt;
+   &lt;div id="log"&gt;&lt;/div&gt;
+ &lt;/body&gt;
+ &lt;/html&gt;
+</pre>
+<h3 id="Referencias" name="Referencias"> Referencias </h3>
+<ul><li> <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">Sección 'Eventos Online/Offline ' de la especificación WHATWG Web Applications 1.0 </a>
+</li><li> <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336359">El bug que documenta la implementación de los eventos online/offline en Firefox </a> y un enlace <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336682">con una modificación posterior</a>
+</li><li> <a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">Un ejemplo sencillo</a>
+</li><li> <a class="external" href="http://ejohn.org/blog/offline-events/">Una explicación de los eventos Online/Offline</a>
+</li></ul>
+<p><br>
+</p>
+<div class="noinclude">
+</div>
+{{ languages( { "en": "en/Online_and_offline_events", "fr": "fr/\u00c9v\u00e8nements_online_et_offline", "ja": "ja/Online_and_offline_events", "pl": "pl/Zdarzenia_online_i_offline", "pt": "pt/Eventos_online_e_offline" } ) }}
diff --git a/files/es/web/api/node/elementopadre/index.html b/files/es/web/api/node/elementopadre/index.html
deleted file mode 100644
index 2a2e947a8d..0000000000
--- a/files/es/web/api/node/elementopadre/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Node.parentElement
-slug: Web/API/Node/elementoPadre
-tags:
-  - API
-  - DOM
-  - NecesitaCompatiblidadNavegador
-  - Nodo
-  - Propiedad
-translation_of: Web/API/Node/parentElement
----
-<div>
-<div>{{APIRef("DOM")}}</div>
-</div>
-
-<p>La propiedad de sólo lectura de <code><strong>Nodo.parentElement</strong></code> devuelve el nodo padre del DOM {{domxref("Element")}}, o <code>null</code>, si el nodo no tiene padre o si el padre no es un {{domxref("Element")}} DOM .</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>elementoPadre</em> = <em>node</em>.parentElement</pre>
-
-<p>El <code>elementoPadre</code> es el padre del nodo actual. Esto es siempre un objecto {{domxref("Element")}} DOM, o <code>null</code>.</p>
-
-<h2 id="Ejemplo" name="Ejemplo">Ejemplo</h2>
-
-<pre class="brush:js">if (node.parentElement) {
-    node.parentElement.style.color = "red";
-}</pre>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>En algunos navegadores, la propiedad <code>elementoPadre</code> es solo definida en nodos que ellos mismos son {{domxref("Element")}}. En particular, esto no está definido en nodos de texto.</p>
-
-<p>{{Compat("api.Node.parentElement")}}</p>
-
-<h2 id="Especificación" name="Especificación">Especificación</h2>
-
-<ul>
- <li>{{spec("http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#parent-element", "DOM Level 4: Node.parentElement", "WD")}}</li>
-</ul>
-
-<h2 id="Ver_también" name="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{domxref("Node.parentNode")}}</li>
-</ul>
diff --git a/files/es/web/api/node/insertarantes/index.html b/files/es/web/api/node/insertarantes/index.html
deleted file mode 100644
index 102d4dfbdd..0000000000
--- a/files/es/web/api/node/insertarantes/index.html
+++ /dev/null
@@ -1,172 +0,0 @@
----
-title: Node.insertBefore()
-slug: Web/API/Node/insertarAntes
-tags:
-  - API
-  - DOM
-  - Nodo
-  - Referencia
-  - metodo
-translation_of: Web/API/Node/insertBefore
----
-<div>{{APIRef("DOM")}}</div>
-
-<p>El método <strong><code>Node.insertBefore()</code></strong> inserta un nodo antes del nodo de referencia como hijo de un nodo padre indicado. Si el nodo hijo es una referencia a un nodo ya existente en el documento, <code>insertBefore()</code> lo mueve de la posición actual a la nueva posición (no hay necesidad de eliminar el nodo de su nodo padre antes de agregarlo al algún nodo nuevo).</p>
-
-<p>Esto significa que el nodo no puede estar en dos puntos del documento al simultáneamente. Por lo que si el nodo ya tiene un padre, primero se elimina el nodo, y luego se inserta en la nueva posición. {{domxref("Node.cloneNode()")}} puede utilizarse para hacer una copia de un nodo antes de insertarlo en un nuevo padre. Ten en cuenta que las copias hechas con <code>cloneNode()</code> no se mantendrán sincronizadas automáticamente.</p>
-
-<p>Si el nodo de referencia es <code>null</code>, el nodo indicado se añadirá al final de la lista de hijos del nodo padre especificado.</p>
-
-<p>Si el hijo proporcionado es un {{domxref("DocumentFragment")}}, el contenido completo del <code>DocumentFragment</code> se moverá a la lista de hijos del nodo padre indicado.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var <em>insertedNode</em> = <em>parentNode</em>.insertBefore(<em>newNode</em>, <em>referenceNode</em>);
-</pre>
-
-<ul>
- <li><code>insertedNode</code> El nodo que esta siendo insertado, es decir, <code>newNode</code></li>
- <li><code>parentNode</code> El padre del nodo recién insertado.</li>
- <li><code>newNode</code> El nodo a insertar.</li>
- <li><code>referenceNode</code> El nodo antes del cual se inserta <code>newNode</code>.</li>
-</ul>
-
-<p>Si <code>referenceNode</code> es <code>null</code>, el <code>newNode</code> se insertará al final de la lista de nodos hijos.</p>
-
-<div class="note">
-<p><code>referenceNode</code> <strong>no</strong> es un parámetro opcional -- debes pasar explícitamente un <code>Node</code> o <code>null</code>. No proporcionándolo o pasando valores no válidos podría provocar un <a href="https://code.google.com/p/chromium/issues/detail?id=419780">comportamiento</a> <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=119489">distinto</a> en diferentes versiones de navegadores.</p>
-</div>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El valor devuelto es el hijo añadido excepto cuando <code>newNode</code> es un {{domxref("DocumentFragment")}}, en cuyo caso se devuelve un {{domxref("DocumentFragment")}}.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Ejemplo_1">Ejemplo 1</h3>
-
-<pre class="brush: html">&lt;div id="parentElement"&gt;
-   &lt;span id="childElement"&gt;foo bar&lt;/span&gt;
-&lt;/div&gt;
-
-&lt;script&gt;
-// Crear el nodo a insertar
-var newNode = document.createElement("span");
-
-// Obtener una referencia al nodo padre
-var parentDiv = document.getElementById("childElement").parentNode;
-
-// Comienzo del test [ 1 ] : Existe un childElement --&gt; Todo funciona correctamente
-var sp2 = document.getElementById("childElement");
-parentDiv.insertBefore(newNode, sp2);
-// Fin del test [ 1 ]
-
-// Comienzo del test [ 2 ] : childElement no es del tipo undefined
-var sp2 = undefined; // No existe un nodo con id "childElement"
-parentDiv.insertBefore(newNode, sp2); // Implicit dynamic cast to type Node
-// Fin del test [ 2 ]
-
-// Comienzo del test [ 3 ] : childElement es de Tipo "undefined" ( string )
-var sp2 = "undefined"; // No existe un nodo con id "childElement"
-parentDiv.insertBefore(newNode, sp2); // Genera "Type Error: Invalid Argument"
-// Fin del test [ 3 ]
-&lt;/script&gt;
-</pre>
-
-<h3 id="Ejemplo_2">Ejemplo 2</h3>
-
-<pre class="brush:html">&lt;div id="parentElement"&gt;
-  &lt;span id="childElement"&gt;foo bar&lt;/span&gt;
-&lt;/div&gt;
-
-&lt;script&gt;
-// Crea un nuevo, elemento &lt;span&gt;
-var sp1 = document.createElement("span");
-
-// Obtener una referencia al elemento, antes de donde queremos insertar el elemento
-var sp2 = document.getElementById("childElement");
-// Obtener una referencia al nodo padre
-var parentDiv = sp2.parentNode;
-
-// Inserta un nuevo elemento en el DOM antes de sp2
-parentDiv.insertBefore(sp1, sp2);
-&lt;/script&gt;
-</pre>
-
-<p>No existe el método <code>insertAfter()</code>.  Puede ser emulado mediante la combinación del método con {{domxref("Node.nextSibling()")}}.</p>
-
-<p>En el ejemplo anterior, <code>sp1</code> podría insertarse después de <code>sp2</code> usando:</p>
-
-<pre class="brush: js"><code>parentDiv.insertBefore(sp1, sp2.nextSibling);</code></pre>
-
-<p>Si <code>sp2</code> no tiene ningún hermano depués de él, entonces debe ser el último hijo — <code>sp2.nextSibling</code> devuelve <code>null</code>, y <code>sp1</code> se inserta al final de la lista de nodos hijos (inmediatamente después de <code>sp2</code>).</p>
-
-<h3 id="Ejemplo_3">Ejemplo 3</h3>
-
-<p>Inserta un elemento antes del primer elemento hijo, utilizando la propiedad <a href="/en-US/docs/DOM/Node.firstChild" title="Node.firstChild">firstChild</a>.</p>
-
-<pre class="brush:js">// Obtener una referencia al elemento en el que se quiere insertar un nuevo nodo
-var parentElement = document.getElementById('parentElement');
-// Obtener una referencia al primer hijo
-var theFirstChild = parentElement.firstChild;
-
-// Crear un nuevo elemento
-var newElement = document.createElement("div");
-
-// Insertar el nuevo elemento antes que el primer hijo
-parentElement.insertBefore(newElement, theFirstChild);
-</pre>
-
-<p>Cuando el elemento no tiene ub primer hijo, entonces <code style="font-style: normal; line-height: 1.5;">firstChild</code><span style="line-height: 1.5;"> es </span><code style="font-style: normal; line-height: 1.5;">null</code><span style="line-height: 1.5;">. Aun así, el elemento se añade al padre después del último hijo. Puesto que el elemento padre no tenía primer hijo, tampoco tiene último hijo. Por tanto, el nuevo elemento es el único elemento después de ser insertado.</span></p>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{Compat("api.Node.insertBefore")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="spectable standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-node-insertbefore','Node.insertBefore')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Corrige errores en el algoritmo de inserción</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM4','#dom-node-insertbefore','Node.insertBefore')}}</td>
-   <td>{{Spec2('DOM4')}}</td>
-   <td>Describe el algoritmo con mayor detalle</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM3 Core','core.html#ID-952280727','Node.insertBefore')}}</td>
-   <td>{{Spec2('DOM3 Core')}}</td>
-   <td>Sin cambios notables</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM2 Core','core.html#ID-952280727','Node.insertBefore')}}</td>
-   <td>{{Spec2('DOM2 Core')}}</td>
-   <td>Sin cambios notables</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM1','level-one-core.html#method-insertBefore','Node.insertBefore')}}</td>
-   <td>{{Spec2('DOM1')}}</td>
-   <td>Introducido</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{domxref("Node.removeChild()")}}</li>
- <li>{{domxref("Node.replaceChild()")}}</li>
- <li>{{domxref("Node.appendChild()")}}</li>
- <li>{{domxref("Node.hasChildNodes()")}}</li>
- <li>{{domxref("Element.insertAdjacentElement()")}}</li>
- <li>{{domxref("ParentNode.prepend()")}}</li>
-</ul>
diff --git a/files/es/web/api/node/insertbefore/index.html b/files/es/web/api/node/insertbefore/index.html
new file mode 100644
index 0000000000..3b896dceb0
--- /dev/null
+++ b/files/es/web/api/node/insertbefore/index.html
@@ -0,0 +1,173 @@
+---
+title: Node.insertBefore()
+slug: Web/API/Node/insertBefore
+tags:
+  - API
+  - DOM
+  - Nodo
+  - Referencia
+  - metodo
+translation_of: Web/API/Node/insertBefore
+original_slug: Web/API/Node/insertarAntes
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>El método <strong><code>Node.insertBefore()</code></strong> inserta un nodo antes del nodo de referencia como hijo de un nodo padre indicado. Si el nodo hijo es una referencia a un nodo ya existente en el documento, <code>insertBefore()</code> lo mueve de la posición actual a la nueva posición (no hay necesidad de eliminar el nodo de su nodo padre antes de agregarlo al algún nodo nuevo).</p>
+
+<p>Esto significa que el nodo no puede estar en dos puntos del documento al simultáneamente. Por lo que si el nodo ya tiene un padre, primero se elimina el nodo, y luego se inserta en la nueva posición. {{domxref("Node.cloneNode()")}} puede utilizarse para hacer una copia de un nodo antes de insertarlo en un nuevo padre. Ten en cuenta que las copias hechas con <code>cloneNode()</code> no se mantendrán sincronizadas automáticamente.</p>
+
+<p>Si el nodo de referencia es <code>null</code>, el nodo indicado se añadirá al final de la lista de hijos del nodo padre especificado.</p>
+
+<p>Si el hijo proporcionado es un {{domxref("DocumentFragment")}}, el contenido completo del <code>DocumentFragment</code> se moverá a la lista de hijos del nodo padre indicado.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <em>insertedNode</em> = <em>parentNode</em>.insertBefore(<em>newNode</em>, <em>referenceNode</em>);
+</pre>
+
+<ul>
+ <li><code>insertedNode</code> El nodo que esta siendo insertado, es decir, <code>newNode</code></li>
+ <li><code>parentNode</code> El padre del nodo recién insertado.</li>
+ <li><code>newNode</code> El nodo a insertar.</li>
+ <li><code>referenceNode</code> El nodo antes del cual se inserta <code>newNode</code>.</li>
+</ul>
+
+<p>Si <code>referenceNode</code> es <code>null</code>, el <code>newNode</code> se insertará al final de la lista de nodos hijos.</p>
+
+<div class="note">
+<p><code>referenceNode</code> <strong>no</strong> es un parámetro opcional -- debes pasar explícitamente un <code>Node</code> o <code>null</code>. No proporcionándolo o pasando valores no válidos podría provocar un <a href="https://code.google.com/p/chromium/issues/detail?id=419780">comportamiento</a> <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=119489">distinto</a> en diferentes versiones de navegadores.</p>
+</div>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El valor devuelto es el hijo añadido excepto cuando <code>newNode</code> es un {{domxref("DocumentFragment")}}, en cuyo caso se devuelve un {{domxref("DocumentFragment")}}.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Ejemplo_1">Ejemplo 1</h3>
+
+<pre class="brush: html">&lt;div id="parentElement"&gt;
+   &lt;span id="childElement"&gt;foo bar&lt;/span&gt;
+&lt;/div&gt;
+
+&lt;script&gt;
+// Crear el nodo a insertar
+var newNode = document.createElement("span");
+
+// Obtener una referencia al nodo padre
+var parentDiv = document.getElementById("childElement").parentNode;
+
+// Comienzo del test [ 1 ] : Existe un childElement --&gt; Todo funciona correctamente
+var sp2 = document.getElementById("childElement");
+parentDiv.insertBefore(newNode, sp2);
+// Fin del test [ 1 ]
+
+// Comienzo del test [ 2 ] : childElement no es del tipo undefined
+var sp2 = undefined; // No existe un nodo con id "childElement"
+parentDiv.insertBefore(newNode, sp2); // Implicit dynamic cast to type Node
+// Fin del test [ 2 ]
+
+// Comienzo del test [ 3 ] : childElement es de Tipo "undefined" ( string )
+var sp2 = "undefined"; // No existe un nodo con id "childElement"
+parentDiv.insertBefore(newNode, sp2); // Genera "Type Error: Invalid Argument"
+// Fin del test [ 3 ]
+&lt;/script&gt;
+</pre>
+
+<h3 id="Ejemplo_2">Ejemplo 2</h3>
+
+<pre class="brush:html">&lt;div id="parentElement"&gt;
+  &lt;span id="childElement"&gt;foo bar&lt;/span&gt;
+&lt;/div&gt;
+
+&lt;script&gt;
+// Crea un nuevo, elemento &lt;span&gt;
+var sp1 = document.createElement("span");
+
+// Obtener una referencia al elemento, antes de donde queremos insertar el elemento
+var sp2 = document.getElementById("childElement");
+// Obtener una referencia al nodo padre
+var parentDiv = sp2.parentNode;
+
+// Inserta un nuevo elemento en el DOM antes de sp2
+parentDiv.insertBefore(sp1, sp2);
+&lt;/script&gt;
+</pre>
+
+<p>No existe el método <code>insertAfter()</code>.  Puede ser emulado mediante la combinación del método con {{domxref("Node.nextSibling()")}}.</p>
+
+<p>En el ejemplo anterior, <code>sp1</code> podría insertarse después de <code>sp2</code> usando:</p>
+
+<pre class="brush: js"><code>parentDiv.insertBefore(sp1, sp2.nextSibling);</code></pre>
+
+<p>Si <code>sp2</code> no tiene ningún hermano depués de él, entonces debe ser el último hijo — <code>sp2.nextSibling</code> devuelve <code>null</code>, y <code>sp1</code> se inserta al final de la lista de nodos hijos (inmediatamente después de <code>sp2</code>).</p>
+
+<h3 id="Ejemplo_3">Ejemplo 3</h3>
+
+<p>Inserta un elemento antes del primer elemento hijo, utilizando la propiedad <a href="/en-US/docs/DOM/Node.firstChild" title="Node.firstChild">firstChild</a>.</p>
+
+<pre class="brush:js">// Obtener una referencia al elemento en el que se quiere insertar un nuevo nodo
+var parentElement = document.getElementById('parentElement');
+// Obtener una referencia al primer hijo
+var theFirstChild = parentElement.firstChild;
+
+// Crear un nuevo elemento
+var newElement = document.createElement("div");
+
+// Insertar el nuevo elemento antes que el primer hijo
+parentElement.insertBefore(newElement, theFirstChild);
+</pre>
+
+<p>Cuando el elemento no tiene ub primer hijo, entonces <code style="font-style: normal; line-height: 1.5;">firstChild</code><span style="line-height: 1.5;"> es </span><code style="font-style: normal; line-height: 1.5;">null</code><span style="line-height: 1.5;">. Aun así, el elemento se añade al padre después del último hijo. Puesto que el elemento padre no tenía primer hijo, tampoco tiene último hijo. Por tanto, el nuevo elemento es el único elemento después de ser insertado.</span></p>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{Compat("api.Node.insertBefore")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="spectable standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#dom-node-insertbefore','Node.insertBefore')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Corrige errores en el algoritmo de inserción</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM4','#dom-node-insertbefore','Node.insertBefore')}}</td>
+   <td>{{Spec2('DOM4')}}</td>
+   <td>Describe el algoritmo con mayor detalle</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Core','core.html#ID-952280727','Node.insertBefore')}}</td>
+   <td>{{Spec2('DOM3 Core')}}</td>
+   <td>Sin cambios notables</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Core','core.html#ID-952280727','Node.insertBefore')}}</td>
+   <td>{{Spec2('DOM2 Core')}}</td>
+   <td>Sin cambios notables</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM1','level-one-core.html#method-insertBefore','Node.insertBefore')}}</td>
+   <td>{{Spec2('DOM1')}}</td>
+   <td>Introducido</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{domxref("Node.removeChild()")}}</li>
+ <li>{{domxref("Node.replaceChild()")}}</li>
+ <li>{{domxref("Node.appendChild()")}}</li>
+ <li>{{domxref("Node.hasChildNodes()")}}</li>
+ <li>{{domxref("Element.insertAdjacentElement()")}}</li>
+ <li>{{domxref("ParentNode.prepend()")}}</li>
+</ul>
diff --git a/files/es/web/api/node/nodoprincipal/index.html b/files/es/web/api/node/nodoprincipal/index.html
deleted file mode 100644
index f6faf58631..0000000000
--- a/files/es/web/api/node/nodoprincipal/index.html
+++ /dev/null
@@ -1,34 +0,0 @@
----
-title: Nodo.nodoPrincipal
-slug: Web/API/Node/nodoPrincipal
-tags:
-  - API
-  - DOM
-  - Gecko
-  - Propiedad
-translation_of: Web/API/Node
-translation_of_original: Web/API/Node/nodePrincipal
----
-<div>
-<div>{{APIRef("DOM")}}</div>
-{{Non-standard_header}}
-
-<p>La propiedad de solo loctura de <code><strong>Nodo.nodePrincipal</strong></code> devuelve el objeto {{Interface("nsIPrincipal")}} representando el contexto de seguridad del nodo actual.</p>
-
-<p>{{Note("This property exists on all nodes (HTML, XUL, SVG, MathML, etc.), but only if the script trying to use it has chrome privileges.")}}</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>principalObj</em> = element.nodePrincipal
-</pre>
-
-<h2 id="Notes" name="Notes">Notas</h2>
-
-<p>Esta propiedad es de solo lectura; Si intentamos editarla nos lanzará una excepción. Además, esta propiedad tan solo debería ser accesible desde código privilegiado</p>
-
-<h2 id="Specification" name="Specification">Especificación</h2>
-
-<p>No hay especificaciones.</p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/api/node/parentelement/index.html b/files/es/web/api/node/parentelement/index.html
new file mode 100644
index 0000000000..ac6a1650a5
--- /dev/null
+++ b/files/es/web/api/node/parentelement/index.html
@@ -0,0 +1,47 @@
+---
+title: Node.parentElement
+slug: Web/API/Node/parentElement
+tags:
+  - API
+  - DOM
+  - NecesitaCompatiblidadNavegador
+  - Nodo
+  - Propiedad
+translation_of: Web/API/Node/parentElement
+original_slug: Web/API/Node/elementoPadre
+---
+<div>
+<div>{{APIRef("DOM")}}</div>
+</div>
+
+<p>La propiedad de sólo lectura de <code><strong>Nodo.parentElement</strong></code> devuelve el nodo padre del DOM {{domxref("Element")}}, o <code>null</code>, si el nodo no tiene padre o si el padre no es un {{domxref("Element")}} DOM .</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>elementoPadre</em> = <em>node</em>.parentElement</pre>
+
+<p>El <code>elementoPadre</code> es el padre del nodo actual. Esto es siempre un objecto {{domxref("Element")}} DOM, o <code>null</code>.</p>
+
+<h2 id="Ejemplo" name="Ejemplo">Ejemplo</h2>
+
+<pre class="brush:js">if (node.parentElement) {
+    node.parentElement.style.color = "red";
+}</pre>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>En algunos navegadores, la propiedad <code>elementoPadre</code> es solo definida en nodos que ellos mismos son {{domxref("Element")}}. En particular, esto no está definido en nodos de texto.</p>
+
+<p>{{Compat("api.Node.parentElement")}}</p>
+
+<h2 id="Especificación" name="Especificación">Especificación</h2>
+
+<ul>
+ <li>{{spec("http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#parent-element", "DOM Level 4: Node.parentElement", "WD")}}</li>
+</ul>
+
+<h2 id="Ver_también" name="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{domxref("Node.parentNode")}}</li>
+</ul>
diff --git a/files/es/web/api/notifications_api/usando_la_api_de_notificaciones/index.html b/files/es/web/api/notifications_api/usando_la_api_de_notificaciones/index.html
deleted file mode 100644
index 8220534f63..0000000000
--- a/files/es/web/api/notifications_api/usando_la_api_de_notificaciones/index.html
+++ /dev/null
@@ -1,294 +0,0 @@
----
-title: Usando la API de Notificaciones
-slug: Web/API/Notifications_API/Usando_la_API_de_Notificaciones
-tags:
-  - API
-  - Notificaciones
-  - Tutorial
-translation_of: Web/API/Notifications_API/Using_the_Notifications_API
----
-<p>{{APIRef("Web Notifications")}}</p>
-
-<p class="summary">La <a href="/en-US/docs/Web/API/Notifications_API">API de Notificaciones</a> permite a una página web enviar notificaciones que se mostrarán fuera de la web al nivel del sistema. Esto permite a las aplicaciones web enviar información al usuario aunque estas estén de fondo.</p>
-
-<p>{{AvailableInWorkers}}</p>
-
-<p>Para comenzar, tenemos que saber qué son las notificaciones y cómo se muestran. En la imagen de abajo se puede ver un ejemplo de notificaciones en android.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/10959/android-notification.png" style="display: block; height: 184px; margin: 0px auto; width: 300px;"><img alt="" src="https://mdn.mozillademos.org/files/10961/mac-notification.png" style="display: block; height: 97px; margin: 0px auto; width: 358px;"></p>
-
-<p>El sistema de notificaciones variará según el navegador y la plataforma en la que estemos, pero esto no va a suponer ningún problema. La API de notificaciones está escrita de manera que sea compatible con la gran mayoría de sistemas.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<div class="column-container">
-<div class="column-half">
-<p>Un ejemplo claro de uso de notificaciones web puede ser un mail basado en web o una aplicación IRC que nos notificará cada vez que nos llegue un nuevo mensaje, aunque estemos fuera de la aplicación. Un ejemplo de esto lo podemos ver en <a href="https://slack.com/">Slack</a>.</p>
-
-<p>Hemos escrito un par de ejemplos del mundo real para dar una idea más clara de cómo podemos usar las notificaciones web:</p>
-
-<ul>
- <li><strong>Lista de pendientes</strong>: Esto es una app sencilla que almacena las tareas pendientes localmente usando <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a> y avisa al usuario cuándo hay que realizar las tareas mediante notificaciones. <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">Descarga el código</a>, o echa un vistazo al <a href="http://mdn.github.io/to-do-notifications/">ejemplo en tiempo real</a>.</li>
- <li><strong>Emogotchi</strong>: Una parodia absurda de Tamagotchi, en la que tienes que mantener a tu Emo miserable o perderás el juego. Esto usa las notificaciones del sistema para indicarte cómo lo estás haciendo y para quejarse de ti, TODO EL RATO. <a href="https://github.com/mdn/emogotchi">Descarga el código de Emogotchi</a>, o echa un vistazo a la <a href="http://mdn.github.io/emogotchi/">versión en tiempo real</a>.</li>
-</ul>
-</div>
-
-<div class="column-half">
-<p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/10963/emogotchi.png" style="max-width: 300px; width: 70%;">.</p>
-</div>
-</div>
-
-<h2 id="Pidiendo_permiso">Pidiendo permiso</h2>
-
-<p>Antes de que una app pueda lanzar una notificación, el usuario tiene que darle permiso para ello. Esto es un requisito común cuando una API intenta interactuar con algo fuera de una página web — al menos una vez, el usuario tendrá que permitir a la aplicación mostrar notificaciones, de esta forma, el usuario decide qué aplicaciones le pueden mostrar notificaciones y cuáles no.</p>
-
-<h3 id="Comprobando_el_permiso_actual">Comprobando el permiso actual</h3>
-
-<p>Puedes comprobar si ya tienes permiso comprobando la propiedad {{domxref("Notification.permission")}} de solo lectura. Esta puede tener uno de los siguientes valores:</p>
-
-<dl>
- <dt><code>default</code></dt>
- <dd>No se le ha pedido permiso al usuario aún, por lo que la app no tiene permisos.</dd>
- <dt><code>granted</code></dt>
- <dd>El usuario ha permitido las notificaciones de la app.</dd>
- <dt><code>denied</code></dt>
- <dd>El usuario ha denegado las notificaciones de la app.</dd>
-</dl>
-
-<h3 id="Obteniendo_permiso">Obteniendo permiso</h3>
-
-<p>Si la aplicación aún no tiene permiso para mostrar notificaciones, tendremos que hacer uso de {{domxref("Notification.requestPermission()")}} para pedir permiso al usuario. En su manera más simple, tal y como se usa en la <a href="http://mdn.github.io/emogotchi/">Demo de Emogotchi</a> (<a href="https://github.com/mdn/emogotchi">código fuente</a>), solo tenemos que incluir lo siguiente:</p>
-
-<pre class="brush: js">Notification.requestPermission().then(function(result) {
-  console.log(result);
-});</pre>
-
-<p>Esto usa la versión promise del método, que está soportada en las versiones recientes (p.ej. Firefox 47). Si quieres soportar versiones más antiguas tendrás que usar la versión de callback, que es la siguiente:</p>
-
-<pre class="brush: js">Notification.requestPermission();</pre>
-
-<p>La versión de callback acepta de forma opcional una función callback que será ejecutada cuando el usuario responda a si quiere notificaciones o no (tal y como se ve en el segundo <code>else ... if</code> abajo). Por lo general, pedirás permiso para mostrar notificaciones una vez que hayas inicializado la app, y antes de lanzar una notificación. Si quieres ser muy cuidadoso puedes usar lo siguiente (ver <a href="https://github.com/mdn/to-do-notifications/blob/gh-pages/scripts/todo.js#L305-L344">To-do List Notifications</a>):</p>
-
-<pre class="brush: js">function notifyMe() {
-  // Comprobamos si el navegador soporta las notificaciones
-  if (!("Notification" in window)) {
-    alert("Este navegador no soporta las notificaciones del sistema");
-  }
-
-  // Comprobamos si ya nos habían dado permiso
-  else if (Notification.permission === "granted") {
-    // Si esta correcto lanzamos la notificación
-    var notification = new Notification("Holiwis :D");
-  }
-
-  // Si no, tendremos que pedir permiso al usuario
-  else if (Notification.permission !== 'denied') {
-    Notification.requestPermission(function (permission) {
-      // Si el usuario acepta, lanzamos la notificación
-      if (permission === "granted") {
-        var notification = new Notification("Gracias majo!");
-      }
-    });
-  }
-
-  // Finalmente, si el usuario te ha denegado el permiso y
-  // quieres ser respetuoso no hay necesidad molestar más.
-}</pre>
-
-<div class="note">
-<p><strong>Nota:</strong> Antes de la versión 37, Chrome no te deja llamar a {{domxref("Notification.requestPermission()")}} en manejador de eventos <code>load</code> (ver <a href="https://code.google.com/p/chromium/issues/detail?id=274284" title="https://code.google.com/p/chromium/issues/detail?id=274284">problema 274284</a>).</p>
-</div>
-
-<h3 id="Permisos_en_Firefox_OS_manifest">Permisos en Firefox OS manifest</h3>
-
-<p>Ten en cuenta que mientras la API de Notificaciones no esté {{Glossary("privileged")}} o {{Glossary("certified")}}, deberías seguir inculyendo una entrada en tu archivo <code>manifest.webapp</code> cuando vayas a usarlo en una app en Firefox OS:</p>
-
-<pre>"permissions": {
-  "desktop-notification": {
-    "description": "Needed for creating system notifications."
-  }
-},
-"messages": [{"notification": "path/to/your/index.html"}]
-
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Cuándo una aplicación es instalada, no deberías de necesitar {{anch("Getting permission","explicitly request permission")}}, pero vas a seguir necesitando los permisos y las entradas de texto de arriba para poder lanzar las notificaciones.</p>
-</div>
-
-<h2 id="Creando_una_notificación">Creando una notificación</h2>
-
-<p>Crear una notificación es fácil, simplemente usa el constructor {{domxref("Notification")}}. Este constructor espera un título que mostrar en la notificación y otras opciones para mejorar la notificación, como un {{domxref("Notification.icon","icon")}} o un texto {{domxref("Notification.body","body")}}.</p>
-
-<p>Por ejemplo, en el <a href="https://github.com/mdn/emogotchi/blob/master/main.js#L109-L127">Ejemplo de Emogotchi</a> tenemos dos funciones que pueden ser llamadas cuando hay que lanzar una notificación; el uso de una u otra depende de si queremos establecer el contenido de la notificación, o si queremos una notificación con contenido aleatorio:</p>
-
-<pre class="brush: js">function spawnNotification(theBody,theIcon,theTitle) {
-  var options = {
-      body: theBody,
-      icon: theIcon
-  }
-  var n = new Notification(theTitle,options);
-  setTimeout(n.close.bind(n), 5000);
-}
-
-function randomNotification() {
-  var randomQuote = quoteChooser();
-  var options = {
-      body: randomQuote,
-      icon: 'img/sad_head.png',
-  }
-
-  var n = new Notification('Emogotchi says',options);
-  setTimeout(n.close.bind(n), 5000);
-}</pre>
-
-<h2 id="Cerrando_las_notificaciones">Cerrando las notificaciones</h2>
-
-<p>Firefox y Safari cierran las notificaciones automáticamente tras cierto tiempo (unos 4 segundos). Esto también puede suceder a nivel de sistema operativo (en Windows duran 7 segundos por defecto). En cambio, en algunos navegadores no se cierran automáticamente, como en Chrome, por ejemplo. Para asegurarnos de que las notificaciones se cierran en todos los navegadores, al final de las funciones de arriba, llamamos a la función {domxref("Notification.close")}}  dentro de {{domxref("WindowTimers.setTimeout","setTimeout()")}} para cerrar la notificación tras 5 segundos. Date cuenta también del uso que hacemos de <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">bind()</a></code> para asegurarnos de que la función <code>close()</code> está asociada a la notificación.</p>
-
-<pre class="brush: js">setTimeout(n.close.bind(n), 5000);
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Cuándo recibes un evento "close", no hay ninguna garantía de que haya sido el usuario quién ha cerrado la notificación. Esto coincide con la especificación que dice: "Cuando una notificación es cerrada, sea por la misma plataforma o por el usuario, se deben lanzar los pasos de cierre para la misma".</p>
-</div>
-
-<h2 id="Eventos_de_Notificación">Eventos de Notificación</h2>
-
-<p>Las especificaciones de la API de notificaciones listan cuatro eventos que pueden ser lanzados en la instancia {{domxref("Notification")}}:</p>
-
-<dl>
- <dt>{{event("click")}}</dt>
- <dd>Lanzado cuando el usuario hace click en la notificación.</dd>
- <dt>{{event("error")}}</dt>
- <dd>Lanzado cuando algo falla en la notificación; habitualmente es porque la notificación no se ha podido mostrar por algún motivo.</dd>
-</dl>
-
-<p>Estos eventos se pueden monitorizar usando los manejadores {{domxref("Notification.onclick","onclick")}} y {{domxref("Notification.onerror","onerror")}}. Como {{domxref("Notification")}} también hereda de {{domxref("EventTarget")}}, es posible usar el método {{domxref("EventTarget.addEventListener","addEventListener()")}} en ella.</p>
-
-<p>También hay otros dos eventos que estaban listados en la especificación, pero que han sido eliminados recientemente. Estos puede que sigan funcionando en los navegadores por ahora, pero deberían tratarse como obsoletos y evitar su uso:</p>
-
-<dl>
- <dt>{{event("close")}}</dt>
- <dd>Lanzado cuándo la notificación se cierra.</dd>
- <dt>{{event("show")}}</dt>
- <dd>Lanzado cuándo la notificación se muestra al usuario.</dd>
-</dl>
-
-<h2 id="Reemplazando_notificaciones_existentes">Reemplazando notificaciones existentes</h2>
-
-<p>Normalmente los usuario no quieren recibir muchas notificaciones en poco tiempo — por ejemplo, una aplicación de mensajería que te notifica cada mensaje que te llegue, y te llegan un montón. Para evitar el spam de notificaciones, se puede modificar la cola de notificaciones, reemplazando una o varias notificaciones pendientes, por una nueva notificación.</p>
-
-<p>Para hacer esto, se puede añadir una etiqueta a cualquier nueva notificación. Si ya hay una notificación con la misma etiqueta y aún no se ha mostrado, la nueva reemplazará a la anterior. Si la notificación con la misma etiqueta ya ha sido mostrada, se cerrará la anterior y se mostrará la nueva.</p>
-
-<h3 id="Ejemplo_de_etiquta">Ejemplo de etiquta</h3>
-
-<p>Teniendo el siguiente código HTML:</p>
-
-<pre class="brush: html">&lt;button&gt;Notifícame!&lt;/button&gt;</pre>
-
-<p>Es posible controlar múltiples notificaciones de la siguiente forma:</p>
-
-<pre class="brush: js">window.addEventListener('load', function () {
-  // Primero, comprobamos si tenemos permiso para lanzar notificaciones
-  // Si no lo tenemos, lo pedimos
-  if (window.Notification &amp;&amp; Notification.permission !== "granted") {
-    Notification.requestPermission(function (status) {
-      if (Notification.permission !== status) {
-        Notification.permission = status;
-      }
-    });
-  }
-
-  var button = document.getElementsByTagName('button')[0];
-
-  button.addEventListener('click', function () {
-    // Si el usuario ha dado permiso
-    // le intentamos enviar 10 notificaciones
-    if (window.Notification &amp;&amp; Notification.permission === "granted") {
-      var i = 0;
-      // Usamos un inteval porque algunos navegadores (Firefox incluído) bloquean las notificaciones si se envían demasiadas en cierto tiempo.
-      var interval = window.setInterval(function () {
-        // Gracias a la etiqueta, deberíamos de ver sólo la notificación "Holiws! 9"
-        var n = new Notification("Holiwis! " + i, {tag: 'soManyNotification'});
-        if (i++ == 9) {
-          window.clearInterval(interval);
-        }
-      }, 200);
-    }
-
-    // Si el usuario no ha dicho si quiere notificaciones
-    // Nota: en Chrome no estamos seguros de si la propiedad permission
-    // esta asignada, por lo que es inseguro comprobar el valor "default".
-    else if (window.Notification &amp;&amp; Notification.permission !== "denied") {
-      Notification.requestPermission(function (status) {
-        // Si el usuario acepta
-        if (status === "granted") {
-          var i = 0;
-          // Usamos un inteval porque algunos navegadores (Firefox incluído) bloquean las notificaciones si se envían demasiadas en cierto tiempo.
-          var interval = window.setInterval(function () {
-          // Gracias a la etiqueta, deberíamos de ver sólo la notificación "Holiws! 9" var n = new Notification("Holiwis! " + i, {tag: 'soManyNotification'});
-            if (i++ == 9) {
-              window.clearInterval(interval);
-            }
-          }, 200);
-        }
-
-        // Otherwise, we can fallback to a regular modal alert
-        else {
-          alert("Hi!");
-        }
-      });
-    }
-
-    // If the user refuses to get notified
-    else {
-      // We can fallback to a regular modal alert
-      alert("Hi!");
-    }
-  });
-});</pre>
-
-<p>Comprueba el ejemplo en directo abajo:</p>
-
-<p>{{ EmbedLiveSample('Tag_example', '100%', 30) }}</p>
-
-<h2 id="Receiving_notification_of_clicks_on_app_notifications">Receiving notification of clicks on app notifications</h2>
-
-<p>When a user clicks on a notification generated by an app, you will be notified of this event in two different ways, depending on the circumstance:</p>
-
-<ol>
- <li>A click event if your app has not closed or been put in the background between the time you create the notification and the time the user clicks on it.</li>
- <li>A <a href="/en-US/docs/Web/API/Navigator/mozSetMessageHandler">system message</a> otherwise.</li>
-</ol>
-
-<p>See <a href="https://github.com/mozilla/buddyup/commit/829cba7afa576052cf601c3e286b8d1981f93f45#diff-3">this code snippet</a> for an example of how to deal with this.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Notifications')}}</td>
-   <td>{{Spec2('Web Notifications')}}</td>
-   <td>Living standard</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{page("/en-US/Web/API/Notification","Browser compatibility")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/Apps/Build/User_notifications">User notifications reference</a></li>
- <li><a href="/en-US/Apps/Build/User_notifications/Notifying_users_via_the_Notification_and_Vibration">Notifying users via the Notification and Vibration APIs</a></li>
- <li>{{ domxref("Notification") }}</li>
-</ul>
diff --git a/files/es/web/api/notifications_api/using_the_notifications_api/index.html b/files/es/web/api/notifications_api/using_the_notifications_api/index.html
new file mode 100644
index 0000000000..9c4e6affd5
--- /dev/null
+++ b/files/es/web/api/notifications_api/using_the_notifications_api/index.html
@@ -0,0 +1,295 @@
+---
+title: Usando la API de Notificaciones
+slug: Web/API/Notifications_API/Using_the_Notifications_API
+tags:
+  - API
+  - Notificaciones
+  - Tutorial
+translation_of: Web/API/Notifications_API/Using_the_Notifications_API
+original_slug: Web/API/Notifications_API/Usando_la_API_de_Notificaciones
+---
+<p>{{APIRef("Web Notifications")}}</p>
+
+<p class="summary">La <a href="/en-US/docs/Web/API/Notifications_API">API de Notificaciones</a> permite a una página web enviar notificaciones que se mostrarán fuera de la web al nivel del sistema. Esto permite a las aplicaciones web enviar información al usuario aunque estas estén de fondo.</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<p>Para comenzar, tenemos que saber qué son las notificaciones y cómo se muestran. En la imagen de abajo se puede ver un ejemplo de notificaciones en android.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/10959/android-notification.png" style="display: block; height: 184px; margin: 0px auto; width: 300px;"><img alt="" src="https://mdn.mozillademos.org/files/10961/mac-notification.png" style="display: block; height: 97px; margin: 0px auto; width: 358px;"></p>
+
+<p>El sistema de notificaciones variará según el navegador y la plataforma en la que estemos, pero esto no va a suponer ningún problema. La API de notificaciones está escrita de manera que sea compatible con la gran mayoría de sistemas.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<div class="column-container">
+<div class="column-half">
+<p>Un ejemplo claro de uso de notificaciones web puede ser un mail basado en web o una aplicación IRC que nos notificará cada vez que nos llegue un nuevo mensaje, aunque estemos fuera de la aplicación. Un ejemplo de esto lo podemos ver en <a href="https://slack.com/">Slack</a>.</p>
+
+<p>Hemos escrito un par de ejemplos del mundo real para dar una idea más clara de cómo podemos usar las notificaciones web:</p>
+
+<ul>
+ <li><strong>Lista de pendientes</strong>: Esto es una app sencilla que almacena las tareas pendientes localmente usando <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a> y avisa al usuario cuándo hay que realizar las tareas mediante notificaciones. <a href="https://github.com/mdn/to-do-notifications/tree/gh-pages">Descarga el código</a>, o echa un vistazo al <a href="http://mdn.github.io/to-do-notifications/">ejemplo en tiempo real</a>.</li>
+ <li><strong>Emogotchi</strong>: Una parodia absurda de Tamagotchi, en la que tienes que mantener a tu Emo miserable o perderás el juego. Esto usa las notificaciones del sistema para indicarte cómo lo estás haciendo y para quejarse de ti, TODO EL RATO. <a href="https://github.com/mdn/emogotchi">Descarga el código de Emogotchi</a>, o echa un vistazo a la <a href="http://mdn.github.io/emogotchi/">versión en tiempo real</a>.</li>
+</ul>
+</div>
+
+<div class="column-half">
+<p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/10963/emogotchi.png" style="max-width: 300px; width: 70%;">.</p>
+</div>
+</div>
+
+<h2 id="Pidiendo_permiso">Pidiendo permiso</h2>
+
+<p>Antes de que una app pueda lanzar una notificación, el usuario tiene que darle permiso para ello. Esto es un requisito común cuando una API intenta interactuar con algo fuera de una página web — al menos una vez, el usuario tendrá que permitir a la aplicación mostrar notificaciones, de esta forma, el usuario decide qué aplicaciones le pueden mostrar notificaciones y cuáles no.</p>
+
+<h3 id="Comprobando_el_permiso_actual">Comprobando el permiso actual</h3>
+
+<p>Puedes comprobar si ya tienes permiso comprobando la propiedad {{domxref("Notification.permission")}} de solo lectura. Esta puede tener uno de los siguientes valores:</p>
+
+<dl>
+ <dt><code>default</code></dt>
+ <dd>No se le ha pedido permiso al usuario aún, por lo que la app no tiene permisos.</dd>
+ <dt><code>granted</code></dt>
+ <dd>El usuario ha permitido las notificaciones de la app.</dd>
+ <dt><code>denied</code></dt>
+ <dd>El usuario ha denegado las notificaciones de la app.</dd>
+</dl>
+
+<h3 id="Obteniendo_permiso">Obteniendo permiso</h3>
+
+<p>Si la aplicación aún no tiene permiso para mostrar notificaciones, tendremos que hacer uso de {{domxref("Notification.requestPermission()")}} para pedir permiso al usuario. En su manera más simple, tal y como se usa en la <a href="http://mdn.github.io/emogotchi/">Demo de Emogotchi</a> (<a href="https://github.com/mdn/emogotchi">código fuente</a>), solo tenemos que incluir lo siguiente:</p>
+
+<pre class="brush: js">Notification.requestPermission().then(function(result) {
+  console.log(result);
+});</pre>
+
+<p>Esto usa la versión promise del método, que está soportada en las versiones recientes (p.ej. Firefox 47). Si quieres soportar versiones más antiguas tendrás que usar la versión de callback, que es la siguiente:</p>
+
+<pre class="brush: js">Notification.requestPermission();</pre>
+
+<p>La versión de callback acepta de forma opcional una función callback que será ejecutada cuando el usuario responda a si quiere notificaciones o no (tal y como se ve en el segundo <code>else ... if</code> abajo). Por lo general, pedirás permiso para mostrar notificaciones una vez que hayas inicializado la app, y antes de lanzar una notificación. Si quieres ser muy cuidadoso puedes usar lo siguiente (ver <a href="https://github.com/mdn/to-do-notifications/blob/gh-pages/scripts/todo.js#L305-L344">To-do List Notifications</a>):</p>
+
+<pre class="brush: js">function notifyMe() {
+  // Comprobamos si el navegador soporta las notificaciones
+  if (!("Notification" in window)) {
+    alert("Este navegador no soporta las notificaciones del sistema");
+  }
+
+  // Comprobamos si ya nos habían dado permiso
+  else if (Notification.permission === "granted") {
+    // Si esta correcto lanzamos la notificación
+    var notification = new Notification("Holiwis :D");
+  }
+
+  // Si no, tendremos que pedir permiso al usuario
+  else if (Notification.permission !== 'denied') {
+    Notification.requestPermission(function (permission) {
+      // Si el usuario acepta, lanzamos la notificación
+      if (permission === "granted") {
+        var notification = new Notification("Gracias majo!");
+      }
+    });
+  }
+
+  // Finalmente, si el usuario te ha denegado el permiso y
+  // quieres ser respetuoso no hay necesidad molestar más.
+}</pre>
+
+<div class="note">
+<p><strong>Nota:</strong> Antes de la versión 37, Chrome no te deja llamar a {{domxref("Notification.requestPermission()")}} en manejador de eventos <code>load</code> (ver <a href="https://code.google.com/p/chromium/issues/detail?id=274284" title="https://code.google.com/p/chromium/issues/detail?id=274284">problema 274284</a>).</p>
+</div>
+
+<h3 id="Permisos_en_Firefox_OS_manifest">Permisos en Firefox OS manifest</h3>
+
+<p>Ten en cuenta que mientras la API de Notificaciones no esté {{Glossary("privileged")}} o {{Glossary("certified")}}, deberías seguir inculyendo una entrada en tu archivo <code>manifest.webapp</code> cuando vayas a usarlo en una app en Firefox OS:</p>
+
+<pre>"permissions": {
+  "desktop-notification": {
+    "description": "Needed for creating system notifications."
+  }
+},
+"messages": [{"notification": "path/to/your/index.html"}]
+
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Cuándo una aplicación es instalada, no deberías de necesitar {{anch("Getting permission","explicitly request permission")}}, pero vas a seguir necesitando los permisos y las entradas de texto de arriba para poder lanzar las notificaciones.</p>
+</div>
+
+<h2 id="Creando_una_notificación">Creando una notificación</h2>
+
+<p>Crear una notificación es fácil, simplemente usa el constructor {{domxref("Notification")}}. Este constructor espera un título que mostrar en la notificación y otras opciones para mejorar la notificación, como un {{domxref("Notification.icon","icon")}} o un texto {{domxref("Notification.body","body")}}.</p>
+
+<p>Por ejemplo, en el <a href="https://github.com/mdn/emogotchi/blob/master/main.js#L109-L127">Ejemplo de Emogotchi</a> tenemos dos funciones que pueden ser llamadas cuando hay que lanzar una notificación; el uso de una u otra depende de si queremos establecer el contenido de la notificación, o si queremos una notificación con contenido aleatorio:</p>
+
+<pre class="brush: js">function spawnNotification(theBody,theIcon,theTitle) {
+  var options = {
+      body: theBody,
+      icon: theIcon
+  }
+  var n = new Notification(theTitle,options);
+  setTimeout(n.close.bind(n), 5000);
+}
+
+function randomNotification() {
+  var randomQuote = quoteChooser();
+  var options = {
+      body: randomQuote,
+      icon: 'img/sad_head.png',
+  }
+
+  var n = new Notification('Emogotchi says',options);
+  setTimeout(n.close.bind(n), 5000);
+}</pre>
+
+<h2 id="Cerrando_las_notificaciones">Cerrando las notificaciones</h2>
+
+<p>Firefox y Safari cierran las notificaciones automáticamente tras cierto tiempo (unos 4 segundos). Esto también puede suceder a nivel de sistema operativo (en Windows duran 7 segundos por defecto). En cambio, en algunos navegadores no se cierran automáticamente, como en Chrome, por ejemplo. Para asegurarnos de que las notificaciones se cierran en todos los navegadores, al final de las funciones de arriba, llamamos a la función {domxref("Notification.close")}}  dentro de {{domxref("WindowTimers.setTimeout","setTimeout()")}} para cerrar la notificación tras 5 segundos. Date cuenta también del uso que hacemos de <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">bind()</a></code> para asegurarnos de que la función <code>close()</code> está asociada a la notificación.</p>
+
+<pre class="brush: js">setTimeout(n.close.bind(n), 5000);
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Cuándo recibes un evento "close", no hay ninguna garantía de que haya sido el usuario quién ha cerrado la notificación. Esto coincide con la especificación que dice: "Cuando una notificación es cerrada, sea por la misma plataforma o por el usuario, se deben lanzar los pasos de cierre para la misma".</p>
+</div>
+
+<h2 id="Eventos_de_Notificación">Eventos de Notificación</h2>
+
+<p>Las especificaciones de la API de notificaciones listan cuatro eventos que pueden ser lanzados en la instancia {{domxref("Notification")}}:</p>
+
+<dl>
+ <dt>{{event("click")}}</dt>
+ <dd>Lanzado cuando el usuario hace click en la notificación.</dd>
+ <dt>{{event("error")}}</dt>
+ <dd>Lanzado cuando algo falla en la notificación; habitualmente es porque la notificación no se ha podido mostrar por algún motivo.</dd>
+</dl>
+
+<p>Estos eventos se pueden monitorizar usando los manejadores {{domxref("Notification.onclick","onclick")}} y {{domxref("Notification.onerror","onerror")}}. Como {{domxref("Notification")}} también hereda de {{domxref("EventTarget")}}, es posible usar el método {{domxref("EventTarget.addEventListener","addEventListener()")}} en ella.</p>
+
+<p>También hay otros dos eventos que estaban listados en la especificación, pero que han sido eliminados recientemente. Estos puede que sigan funcionando en los navegadores por ahora, pero deberían tratarse como obsoletos y evitar su uso:</p>
+
+<dl>
+ <dt>{{event("close")}}</dt>
+ <dd>Lanzado cuándo la notificación se cierra.</dd>
+ <dt>{{event("show")}}</dt>
+ <dd>Lanzado cuándo la notificación se muestra al usuario.</dd>
+</dl>
+
+<h2 id="Reemplazando_notificaciones_existentes">Reemplazando notificaciones existentes</h2>
+
+<p>Normalmente los usuario no quieren recibir muchas notificaciones en poco tiempo — por ejemplo, una aplicación de mensajería que te notifica cada mensaje que te llegue, y te llegan un montón. Para evitar el spam de notificaciones, se puede modificar la cola de notificaciones, reemplazando una o varias notificaciones pendientes, por una nueva notificación.</p>
+
+<p>Para hacer esto, se puede añadir una etiqueta a cualquier nueva notificación. Si ya hay una notificación con la misma etiqueta y aún no se ha mostrado, la nueva reemplazará a la anterior. Si la notificación con la misma etiqueta ya ha sido mostrada, se cerrará la anterior y se mostrará la nueva.</p>
+
+<h3 id="Ejemplo_de_etiquta">Ejemplo de etiquta</h3>
+
+<p>Teniendo el siguiente código HTML:</p>
+
+<pre class="brush: html">&lt;button&gt;Notifícame!&lt;/button&gt;</pre>
+
+<p>Es posible controlar múltiples notificaciones de la siguiente forma:</p>
+
+<pre class="brush: js">window.addEventListener('load', function () {
+  // Primero, comprobamos si tenemos permiso para lanzar notificaciones
+  // Si no lo tenemos, lo pedimos
+  if (window.Notification &amp;&amp; Notification.permission !== "granted") {
+    Notification.requestPermission(function (status) {
+      if (Notification.permission !== status) {
+        Notification.permission = status;
+      }
+    });
+  }
+
+  var button = document.getElementsByTagName('button')[0];
+
+  button.addEventListener('click', function () {
+    // Si el usuario ha dado permiso
+    // le intentamos enviar 10 notificaciones
+    if (window.Notification &amp;&amp; Notification.permission === "granted") {
+      var i = 0;
+      // Usamos un inteval porque algunos navegadores (Firefox incluído) bloquean las notificaciones si se envían demasiadas en cierto tiempo.
+      var interval = window.setInterval(function () {
+        // Gracias a la etiqueta, deberíamos de ver sólo la notificación "Holiws! 9"
+        var n = new Notification("Holiwis! " + i, {tag: 'soManyNotification'});
+        if (i++ == 9) {
+          window.clearInterval(interval);
+        }
+      }, 200);
+    }
+
+    // Si el usuario no ha dicho si quiere notificaciones
+    // Nota: en Chrome no estamos seguros de si la propiedad permission
+    // esta asignada, por lo que es inseguro comprobar el valor "default".
+    else if (window.Notification &amp;&amp; Notification.permission !== "denied") {
+      Notification.requestPermission(function (status) {
+        // Si el usuario acepta
+        if (status === "granted") {
+          var i = 0;
+          // Usamos un inteval porque algunos navegadores (Firefox incluído) bloquean las notificaciones si se envían demasiadas en cierto tiempo.
+          var interval = window.setInterval(function () {
+          // Gracias a la etiqueta, deberíamos de ver sólo la notificación "Holiws! 9" var n = new Notification("Holiwis! " + i, {tag: 'soManyNotification'});
+            if (i++ == 9) {
+              window.clearInterval(interval);
+            }
+          }, 200);
+        }
+
+        // Otherwise, we can fallback to a regular modal alert
+        else {
+          alert("Hi!");
+        }
+      });
+    }
+
+    // If the user refuses to get notified
+    else {
+      // We can fallback to a regular modal alert
+      alert("Hi!");
+    }
+  });
+});</pre>
+
+<p>Comprueba el ejemplo en directo abajo:</p>
+
+<p>{{ EmbedLiveSample('Tag_example', '100%', 30) }}</p>
+
+<h2 id="Receiving_notification_of_clicks_on_app_notifications">Receiving notification of clicks on app notifications</h2>
+
+<p>When a user clicks on a notification generated by an app, you will be notified of this event in two different ways, depending on the circumstance:</p>
+
+<ol>
+ <li>A click event if your app has not closed or been put in the background between the time you create the notification and the time the user clicks on it.</li>
+ <li>A <a href="/en-US/docs/Web/API/Navigator/mozSetMessageHandler">system message</a> otherwise.</li>
+</ol>
+
+<p>See <a href="https://github.com/mozilla/buddyup/commit/829cba7afa576052cf601c3e286b8d1981f93f45#diff-3">this code snippet</a> for an example of how to deal with this.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Notifications')}}</td>
+   <td>{{Spec2('Web Notifications')}}</td>
+   <td>Living standard</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{page("/en-US/Web/API/Notification","Browser compatibility")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/Apps/Build/User_notifications">User notifications reference</a></li>
+ <li><a href="/en-US/Apps/Build/User_notifications/Notifying_users_via_the_Notification_and_Vibration">Notifying users via the Notification and Vibration APIs</a></li>
+ <li>{{ domxref("Notification") }}</li>
+</ul>
diff --git a/files/es/web/api/pointer_lock_api/index.html b/files/es/web/api/pointer_lock_api/index.html
new file mode 100644
index 0000000000..2b8f272ad9
--- /dev/null
+++ b/files/es/web/api/pointer_lock_api/index.html
@@ -0,0 +1,285 @@
+---
+title: API Pointer Lock
+slug: Web/API/Pointer_Lock_API
+translation_of: Web/API/Pointer_Lock_API
+original_slug: WebAPI/Pointer_Lock
+---
+<p> </p>
+
+<p><strong>Pointer Lock </strong>(antes llamado Bloqueo del <em>Mouse</em>)  proporciona métodos de entrada basados ​​en el movimiento del ratón a traves del tiempo (es decir, deltas), no sólo la posición absoluta del cursor del <em>mouse</em>. Te da acceso al movimiento <span style="line-height: inherit;">puro </span><span style="line-height: inherit;">del <em>mouse</em>, bloquea el objetivo de los eventos del <em>mouse</em> a un solo elemento, elimina límites en cuanto a  que tan lejos puedes mover el <em>mouse</em> en una sola dirección, y quita el cursor de la vista.</span></p>
+
+<p>Esta API es útil para aplicaciones que requieren bastantes acciones para controlar los movimientos del <em>mouse</em>, rotar objetos y cambiar las entradas. Es especialmente importante para aplicaciones altamente visuales, tales como los que utilizan la perspectiva en primera persona, así como vistas en 3D y modelado.</p>
+
+<p>Por ejemplo, puedes crear aplicaciones que permiten a los usuarios controlar el ángulo de visión con sólo mover el <em>mouse</em> sin ningún clic, permitiendo liberar <span style="line-height: inherit;">los clics</span><span style="line-height: inherit;"> para otras acciones. Este tipo de entrada del <em>mouse</em> es muy útil para ver mapas, imágenes de satélite, o escenas en primera persona (como en un juego o un vídeo embebido).</span></p>
+
+<p><strong>Pointer Lock</strong><span style="line-height: inherit;"> te permite acceder a los eventos del </span><em>mouse</em><span style="line-height: inherit;"> incluso cuando el cursor pasa por el límite de la pantalla del navegador. Por ejemplo, los usuarios pueden seguir girando o manipular un modelo 3D moviendo el </span><em>mouse</em><span style="line-height: inherit;"> sin fin. Sin </span><strong>Pointer Lock</strong><span style="line-height: inherit;">, la rotación o la manipulación se detiene en el momento en que el cursor alcanza el borde de la pantalla del navegador. Los jugadores se verán particularmente encantados con esta característica, ya que anciosamente pueden hacer clic en los botones y arrastrar el cursor del </span><em>mouse</em><span style="line-height: inherit;"> de un lado a otro sin tener que preocuparse por salir de la zona de juego ni de cliquear accidentalmente otra aplicación que podría llevar al </span><em>mouse</em><span style="line-height: inherit;"> fuera del juego. Una tragedia!</span></p>
+
+<h2 id="basics" name="basics">Conceptos Básicos</h2>
+
+<p><strong>Pointer Lock</strong><strong style="line-height: inherit;"> </strong><span style="line-height: inherit;">está relacionado con la <em>mouse capture</em>. </span><em>mouse capture </em><span style="line-height: inherit;">proporciona la entrega continua de eventos a un elemento de destino, mientras que el <em>mouse</em> se arrastra, pero se detiene cuando se suelta el clic. </span><strong>Pointer Lock</strong><span style="line-height: inherit;"> es diferente de </span><em>mouse capture </em><span style="line-height: inherit;">en las siguientes maneras:</span></p>
+
+<ul>
+ <li><span style="line-height: 1.5em;">Es persistente. <strong style="line-height: normal;">Pointer Lock</strong> no libera el <em>mouse</em> hasta que se haga una llamada explícita a la API  o el usuario utilize un gesto concreto de lanzamiento.</span></li>
+ <li><span style="line-height: 1.5em;">No está limitado por los limites del navegador o la pantalla.</span></li>
+ <li>Envia continuamente eventos independientemente del estado del clic del <em>mouse</em>.</li>
+ <li>Oculta el cursor.</li>
+</ul>
+
+<h2 id="example" name="example">Ejemplo</h2>
+
+<p>El siguiente es un ejemplo de cómo se puede configurar <strong>Pointer Lock</strong> en su página web.</p>
+
+<pre class="brush: js">&lt;button onclick="lockPointer();"&gt;Lock it!&lt;/button&gt;
+&lt;div id="pointer-lock-element"&gt;&lt;/div&gt;
+&lt;script&gt;
+// Nota: Al momento de escribir esto, sólo Mozilla y WebKit apoyan Pointer Lock.
+
+// El elemento que servirá para pantalla completa y pointer lock.
+var elem;
+
+document.addEventListener("mousemove", function(e) {
+  var movementX = e.movementX       ||
+                  e.mozMovementX    ||
+                  e.webkitMovementX ||
+                  0,
+      movementY = e.movementY       ||
+                  e.mozMovementY    ||
+                  e.webkitMovementY ||
+                  0;
+
+  // Imprime los valores delta del movimiento del mouse
+  console.log("movementX=" + movementX, "movementY=" + movementY);
+}, false);
+
+function fullscreenChange() {
+  if (document.webkitFullscreenElement === elem ||
+      document.mozFullscreenElement === elem ||
+      document.mozFullScreenElement === elem) { // Older API upper case 'S'.
+    // El elemento esta en pantalla completa, ahora podemos hacer el request de pointer lock
+    elem.requestPointerLock = elem.requestPointerLock    ||
+                              elem.mozRequestPointerLock ||
+                              elem.webkitRequestPointerLock;
+    elem.requestPointerLock();
+  }
+}
+
+document.addEventListener('fullscreenchange', fullscreenChange, false);
+document.addEventListener('mozfullscreenchange', fullscreenChange, false);
+document.addEventListener('webkitfullscreenchange', fullscreenChange, false);
+
+function pointerLockChange() {
+  if (document.mozPointerLockElement === elem ||
+      document.webkitPointerLockElement === elem) {
+    console.log("Pointer Lock was successful.");
+  } else {
+    console.log("Pointer Lock was lost.");
+  }
+}
+
+document.addEventListener('pointerlockchange', pointerLockChange, false);
+document.addEventListener('mozpointerlockchange', pointerLockChange, false);
+document.addEventListener('webkitpointerlockchange', pointerLockChange, false);
+
+function pointerLockError() {
+  console.log("Error while locking pointer.");
+}
+
+document.addEventListener('pointerlockerror', pointerLockError, false);
+document.addEventListener('mozpointerlockerror', pointerLockError, false);
+document.addEventListener('webkitpointerlockerror', pointerLockError, false);
+
+function lockPointer() {
+  elem = document.getElementById("pointer-lock-element");
+  // Start by going fullscreen with the element.  Current implementations
+  // require the element to be in fullscreen before requesting pointer
+  // lock--something that will likely change in the future.
+  elem.requestFullscreen = elem.requestFullscreen    ||
+                           elem.mozRequestFullscreen ||
+                           elem.mozRequestFullScreen || // Older API upper case 'S'.
+                           elem.webkitRequestFullscreen;
+  elem.requestFullscreen();
+}
+&lt;/script&gt;
+</pre>
+
+<h2 id="method_overview" name="method_overview">Propiedades/Métodos</h2>
+
+<p>La API de bloque de puntero ,similar a la API de Fullscreen,extiende del elemento DOM agregando un nuevo método, <code>requestPointerLock</code>, la cual es dependiente del vendedor(del navegador). Puede escribirse como:</p>
+
+<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">element.webkitRequestPointerLock(); // para Chrome</span></span>
+
+element.mozRequestPointerLock(); // para Firefox
+</pre>
+
+<p>Current implementations of <code>requestPointerLock</code> are tightly bound to <code>requestFullScreen</code> and the Fullscreen API. Before an element can be pointer locked, it must first enter the fullscreen state. As demonstrated above, the process of locking the pointer is asynchronous, with events (<code>pointerlockchange</code>, <code>pointerlockerror</code>) indicating the success or failure of the request. This matches how the Fullscreen API works, with its <code>requestFullScreen</code> method and <code>fullscreenchange</code> and <code>fullscreenerror</code> events.</p>
+
+<p>The Pointer lock API also extends the <code>document</code> interface, adding both a new property and a new method. The new property is used for accessing the currently locked element (if any), and is named <code>pointerLockElement</code>, which is vendor-prefixed for now. The new method on <code>document</code> is <code>exitPointerLock</code> and, as the name implies, it is used to exit Pointer lock.</p>
+
+<p>The <code>pointerLockElement</code> property is useful for determining if any element is currently pointer locked (e.g., for doing a boolean check) and also for obtaining a reference to the locked element, if any. Here is an example of both uses:</p>
+
+<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.pointerLockElement = document.pointerLockElement    ||
+                              document.mozPointerLockElement ||
+                              document.webkitPointerLockElement;</span></span>
+
+// 1) Used as a boolean check--are we pointer locked?
+if (!!document.pointerLockElement) {
+  // pointer is locked
+} else {
+  // pointer is not locked
+}
+
+// 2) Used to access the pointer locked element
+if (document.pointerLockElement === someElement) {
+  // someElement is currently pointer locked
+}
+</pre>
+
+<p>The <code>document</code>'s <code>exitPointerLock</code> method is used to exit pointer lock, and like requestPointerLock, works asynchrounously using the <code>pointerlockchange</code> and <code>pointerlockerror</code> events:</p>
+
+<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.exitPointerLock = document.exitPointerLock    ||
+                           document.mozExitPointerLock ||
+                           document.webkitExitPointerLock;</span></span>
+
+function pointerLockChange() {
+  <span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.pointerLockElement = document.pointerLockElement    ||
+                                document.mozPointerLockElement ||
+                                document.webkitPointerLockElement;</span></span>
+
+  if (!!document.pointerLockElement) {
+    console.log("Still locked.");
+  } else {
+    console.log("Exited lock.");
+  }
+}
+
+document.addEventListener('pointerlockchange', pointerLockChange, false);
+document.addEventListener('mozpointerlockchange', pointerLockChange, false);
+document.addEventListener('webkitpointerlockchange', pointerLockChange, false);
+
+// Attempt to unlock
+document.exitPointerLock();
+</pre>
+
+<h2 id="mouselocklostevent" name="mouselocklostevent">pointerlockchange event</h2>
+
+<p>When the Pointer lock state changes—for example, when calling <code>requestPointerLock</code>, <code>exitPointerLock</code>, the user pressing the ESC key, etc.—the <code>pointerlockchange</code> event is dispatched to the <code>document</code>. This is a simple event and contains no extra data.</p>
+
+<div class="note">This event is currently prefixed as <code>mozpointerlockchange</code> in Firefox and <code>webkitpointerlockchange</code> in Chrome. </div>
+
+<h2 id="mouselocklostevent" name="mouselocklostevent">pointerlockerror event</h2>
+
+<p>When there is an error caused by calling <code>requestPointerLock</code> or <code>exitPointerLock</code>, the <code>pointerlockerror</code> event is dispatched to the <code>document</code>. This is a simple event and contains no extra data.</p>
+
+<div class="note">This event is currently prefixed as <code>mozpointerlockerror</code> in Firefox and <code>webkitpointerlockerror</code> in Chrome. </div>
+
+<h2 id="extensions" name="extensions">Extensions to mouse events</h2>
+
+<p>The Pointer lock API extends the normal <code>MouseEvent</code> with movement attributes.</p>
+
+<pre class="idl"><span class="idlInterface" id="idl-def-MouseEvent">partial interface <span class="idlInterfaceID">MouseEvent</span> {
+<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a>long</a></span> <span class="idlAttrName"><a href="http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html#widl-MouseEvent-movementX">movementX</a></span>;</span>
+<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a>long</a></span> <span class="idlAttrName"><a href="http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html#widl-MouseEvent-movementY">movementY</a></span>;</span>
+};</span></pre>
+
+<div class="note">The movement attributes are currently prefixed as <code>.mozMovementX</code> and <code>.mozMovementY</code> in Firefox, and<code>.webkitMovementX</code> and <code>.webkitMovementY</code> in Chrome.</div>
+
+<p>Two new parameters to mouse events—<code>movementX</code> and <code>movementY</code>—provide the change in mouse positions. The values of the parameters are the same as the difference between the values of <a href="/en/DOM/MouseEvent" title="en/DOM/Event/UIEvent/MouseEvent"><code>MouseEvent</code></a> properties, <code>screenX</code> and <code>screenY</code>, which are stored in two subsequent <code>mousemove</code> events, <code>eNow</code> and <code>ePrevious</code>. In other words, the Pointer lock parameter <code>movementX = eNow.screenX - ePrevious.screenX</code>.</p>
+
+<h3 id="locked_state" name="locked_state">Locked state</h3>
+
+<p>When Pointer lock is enabled, the standard <code>MouseEvent</code> properties <code>clientX</code>, <code>clientY</code>, <code>screenX</code>, and <code>screenY</code> are held constant, as if the mouse is not moving. The <code>movementX</code> and <code>movementY</code> properties continue to provide the mouse's change in position. There is no limit to <code>movementX</code> and <code>movementY</code> values if the mouse is continuously moving in a single direction. The concept of the mouse cursor does not exist and the cursor cannot move off the window or be clamped by a screen edge.</p>
+
+<h3 id="unlocked_state" name="unlocked_state">Unlocked state</h3>
+
+<p>The parameters <code>movementX</code> and <code>movementY</code> are valid regardless of the mouse lock state, and are available even when unlocked for convenience.</p>
+
+<p>When the mouse is unlocked, the system cursor can exit and re-enter the browser window. If that happens, <code>movementX</code> and <code>movementY</code> could be set to zero.</p>
+
+<h2 id="iframe_limitations">iframe limitations</h2>
+
+<p>Pointer lock can only lock one iframe at a time. If you lock one iframe, you cannot try to lock another iframe and transfer the target to it; Pointer lock will error out. To avoid this limitation, first unlock the locked iframe, and then lock the other.</p>
+
+<p>While iframes work by default, "sandboxed" iframes block Pointer lock. The ability to avoid this limitation, in the form of the attribute/value combination <code>&lt;iframe sandbox="allow-pointer-lock"&gt;</code>, is expected to appear in Chrome soon.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Pointer Lock')}}</td>
+   <td>{{Spec2('Pointer Lock')}}</td>
+   <td>Initial specification.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>
+    <p>Targeting 23{{ property_prefix("webkit") }}*</p>
+
+    <p>See <a class="external" href="http://code.google.com/p/chromium/issues/detail?id=72754" title="http://code.google.com/p/chromium/issues/detail?id=72754">CR/72574</a></p>
+   </td>
+   <td>
+    <p>{{ CompatGeckoDesktop("14.0") }}</p>
+
+    <p>{{bug("633602") }}</p>
+   </td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>* Requires the feature be enabled in <code>about:flags</code> or Chrome started with the <code>--enable-pointer-lock</code> flag.</p>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<p><a href="/en/DOM/MouseEvent" title="en/DOM/Event/UIEvent/MouseEvent">MouseEvent</a></p>
diff --git a/files/es/web/api/push_api/using_the_push_api/index.html b/files/es/web/api/push_api/using_the_push_api/index.html
deleted file mode 100644
index 05d101e5fa..0000000000
--- a/files/es/web/api/push_api/using_the_push_api/index.html
+++ /dev/null
@@ -1,433 +0,0 @@
----
-title: Usando la API Push
-slug: Web/API/Push_API/Using_the_Push_API
-translation_of: Web/API/Push_API
-translation_of_original: Web/API/Push_API/Using_the_Push_API
----
-<p class="summary"><span class="seoSummary">La W3C <a href="/en-US/docs/Web/API/Push_API">Push API</a> offers some exciting new functionality for developers to use in web applications: this article provides an introduction to getting Push notifications setup and running, with a simple demo.</span></p>
-
-<p>La habilidad de enviar mensajes o notificaciones de un servidor a un cliente en cualquier momento —si la aplicación está activa en su sitema o no—es algo que ha sido disfrutado por las plataformas nativas durante algún tiempo, y esta finalmente llega a la web! el soporte para muchos push está ahora disponible en Firefox 43+ y Chrome 42+ en escritorio, esperamos seguir pronto con las plataformas moviles. {{domxref("PushMessageData")}} actualmente solo es soportada experimentalmente en Firefox (44+), y la implementación está sujeta a cambios.</p>
-
-<div class="note">
-<p><strong>Note</strong>: Early versions of Firefox OS used a proprietary version of this API called <a href="/en-US/docs/Web/API/Simple_Push_API">Simple Push</a>. This is being rendered obsolete by the Push API standard.</p>
-</div>
-
-<h2 id="Demo_las_bases_de_una_simple_app_de_servidor_de_chat">Demo: las bases de una simple app de servidor de chat</h2>
-
-<p>La demo que hemos creado proporciona los principios de una simple app de chat. Esta presenta un formulario para que ingreses un identificador de chat y un boton que al presionar se suscriba a los mensajes push.</p>
-
-<p>En este punto, el nombre de los nuevos suscriptores aparecerá en la lista de suscriptores, junto con un campo de texto y un botón de envío para permitir al suscriptor enviar mensajes.</p>
-
-<p>At this point, the new subscriber's name will appear in the subscriber's list, along with a text field and submit button to allow the subscriber to send messages.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/11823/push-api-demo.png" style="border: 1px solid black; display: block; height: 406px; margin: 0px auto; width: 705px;"></p>
-
-<p>Para correr la demo, siga las instrucciones de <a href="https://github.com/chrisdavidmills/push-api-demo">push-api-demo README</a>. Tenga en cuenta que el componente server-side aún nesecita un poco de trabajo para que funcione en chrome y se ejecute de una manera más rezonable. Pero los aspectos de push pueden ser explicados a fondo; Nos sumergiremos en ella después de revisar las tecnologías en juego.</p>
-
-<h2 id="Visión_de_la_tecnología">Visión de la tecnología</h2>
-
-<p>Esta sección proporciona un esquema de qué tecnologías están involucradas en este ejemplo.</p>
-
-<p>Los mensajes web push hacen parte de la familia tecnológica <a href="/en-US/docs/Web/API/Service_Worker_API">service workers</a>; en particular, se requiere que un service worker esté activo en la página para recibir mensajes push. el service worker recibe el mensaje push, y acontinuación depende de usted cómo notificar a la página. Usted puede:</p>
-
-<p>Web Push messages are part of the <a href="/en-US/docs/Web/API/Service_Worker_API">service workers</a> technology family; in particular, a service worker is required to be active on the page for it to receive push messages. The service worker receives the push message, and then it is up to you how to then notify the page. You can:</p>
-
-<ul>
- <li>Enviar una <a href="/en-US/docs/Web/API/Notifications_API">notificación web</a> emergente para alertar al usuario. Esto requiere que sean concedidos los permisos para enviar el mensaje push.</li>
- <li>Envía un mensaje a la página principal a través de un  {{domxref("MessageChannel")}}.</li>
-</ul>
-
-<p>A menudo una combinación de los dos será necesario; La demo a continuación muestra un ejemplo de cada uno.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Usted necesita algún tipo de código que se ejecute en el servidor para manejar el cifrado de punto final/datos y enviar las solicitudes de notificaciones push. En nuestra demostración hemos creado un servidor  quick-and-dirty usando <a href="https://nodejs.org/">NodeJS</a>.</p>
-</div>
-
-<p>El service worker también tiene que suscribirse al servicio de mensajería psuh. Cada sesión recibe su propio punto final único cuando se suscribe al servicio de mensajería. Este punto final es obtenido desde la propiedad  ({{domxref("PushSubscription.endpoint")}}) en el objeto de suscripción. Este punto final se puede enviar a su servidor y se utiliza para enviar un mensaje al service worker asctivo en esta sesión. Cada navegador tiene su propio servidor de mensajería push para manejar el envío del mensaje push.</p>
-
-<h3 id="Encryption">Encryption</h3>
-
-<div class="note">
-<p><strong>Note</strong>: For an interactive walkthrough, try JR Conlin's <a href="https://jrconlin.github.io/WebPushDataTestPage/">Web Push Data Encryption Test Page</a>.</p>
-</div>
-
-<p>To send data via a push message, it needs to be encrypted. This requires a public key created using the {{domxref("PushSubscription.getKey()")}} method, which relies upon some complex encryption mechanisms that are run server-side; read <a href="https://tools.ietf.org/html/draft-ietf-webpush-encryption-01">Message Encryption for Web Push</a> for more details. As time goes on, libraries will appear to handle key generation and encryption/decryption of push messages; for this demo we used Marco Castelluccio's NodeJS <a href="https://github.com/marco-c/web-push">web-push library</a>.</p>
-
-<div class="note">
-<p><strong>Note</strong>: There is also another library to handle the encryption with a Node and Python version available, see <a href="https://github.com/martinthomson/encrypted-content-encoding">encrypted-content-encoding</a>.</p>
-</div>
-
-<h3 id="Push_workflow_summary">Push workflow summary</h3>
-
-<p>To summarize, here is what is needed to implement push messaging. You can find more details about specific parts of the demo code in subsequent sections.</p>
-
-<ol>
- <li>Request permission for web notifications, or anything else you are using that requires permissions.</li>
- <li>Register a service worker to control the page by calling {{domxref("ServiceWorkerContainer.register()")}}.</li>
- <li>Subscribe to the push messaging service using {{domxref("PushManager.subscribe()")}}.</li>
- <li>Retrieve the endpoint associated with the subscription and generate a client public key ({{domxref("PushSubscription.endpoint")}} and {{domxref("PushSubscription.getKey()")}}. Note that <code>getKey()</code> is currently experimental and Firefox only.)</li>
- <li>Send these details to the server so it can send push message when required. This demo uses {{domxref("XMLHttpRequest")}}, but you could use <a href="/en-US/docs/Web/API/Fetch_API">Fetch</a>.</li>
- <li>If you are using the <a href="/en-US/docs/Web/API/Channel_Messaging_API">Channel Messaging API</a> to comunicate with the service worker, set up a new message channel ({{domxref("MessageChannel.MessageChannel()")}}) and send <code>port2</code> over to the service worker by calling {{domxref("Worker.postMessage()")}} on the service worker, in order to open up the communication channel. You should also set up a listener to respond to messages sent back from the service worker.</li>
- <li>On the server side, store the endpoint and any other required details so they are available when a push message needs to be sent to a push subscriber (we are using a simple text file, but you could use a database or whatever you like). In a production app, make sure you keep these details hidden, so malicious parties can't steal endpoints and spam subscribers with push messages.</li>
- <li>To send a push message, you need to send an HTTP <code>POST</code> to the endpoint URL. The request must include a <code>TTL</code> header that limits how long the message should be queued if the user is not online. To include payload data in your request, you must encrypt it (which involves the client public key). In our demo, we are using the <a href="https://github.com/marco-c/web-push">web-push</a> module, which handles all the hard work for you.</li>
- <li>Over in your service worker, set up a <code>push</code> event handler to respond to push messages being received.
-  <ol>
-   <li>If you want to respond by sending a channel message back to the main context (see Step 6) you need to first get a reference to the <code>port2</code> we sent over to the service worker context ({{domxref("MessagePort")}}). This is available on the {{domxref("MessageEvent")}} object passed to the <code>onmessage</code> handler ({{domxref("ServiceWorkerGlobalScope.onmessage")}}). Specifically, this is found in the <code>ports</code> property, index 0. Once this is done, you can send a message back to <code>port1</code>, using {{domxref("MessagePort.postMessage()")}}.</li>
-   <li>If you want to respond by firing a system notification, you can do this by calling {{domxref("ServiceWorkerRegistration.showNotification()")}}. Note that in our code we have run this inside an {{domxref("ExtendableEvent.waitUntil()")}} method — this extends the lifetime of the event until after the notification has been fired, so we can make sure everything has happened that we want to happen.<span id="cke_bm_307E" style="display: none;"> </span></li>
-  </ol>
- </li>
-</ol>
-
-<h2 id="Construyendo_la_demo">Construyendo la demo</h2>
-
-<p>Vamos a ensayar el código para esta demo, podemos empezar a entender como trabaja todo esto.</p>
-
-<ul>
- <li>
-  <h3 id="HTML_y_CSS">HTML y CSS</h3>
- </li>
-</ul>
-
-<p>No hay nada destacalbe sobre el HTML y el CSS para la demo; el HTML inicialmente contiene un simple formulario que permite introducir un udentificador para la sala de chat, un boton que al hacer click se suscribe a las notificaciones push, y dos listas con los suscriptores y los mensajes. Una vez suscrito, aparecerán controles adicionales para permitir al usuario actual escribir mensajes en el chat.</p>
-
-<p>El CSS ha sido muy minimo para no desvirtuar la explicación de la funcionalidad Push Api.</p>
-
-<ul>
- <li>
-  <h3 id="El_archivo_JavaScript_principal">El archivo JavaScript principal</h3>
- </li>
-</ul>
-
-<p>El JavaScript es obviamente más sustancial. Echemos un vistazo al archivo JavaScript principal.</p>
-
-<h4 id="Variables_y_configuración_inicial">Variables y configuración inicial</h4>
-
-<p>Para iniciar, nosotros declaramos algunas variables a usar en nuestra app:</p>
-
-<pre class="brush: js">var isPushEnabled = false;
-var useNotifications = false;
-
-var subBtn = document.querySelector('.subscribe');
-var sendBtn;
-var sendInput;
-
-var controlsBlock = document.querySelector('.controls');
-var subscribersList = document.querySelector('.subscribers ul');
-var messagesList = document.querySelector('.messages ul');
-
-var nameForm = document.querySelector('#form');
-var nameInput = document.querySelector('#name-input');
-nameForm.onsubmit = function(e) {
-  e.preventDefault()
-};
-nameInput.value = 'Bob';</pre>
-
-<p>Primero, tenemos dos boleanos para hacer un seguimiento si se a suscrito a push, y si ha permitido las notificaciones.</p>
-
-<p>A continuación, tomamos una referencia al suscrito/no-suscrito <code>{{htmlelement("button")}}</code>, y se declaran variables para almacenar referencias a nuestro mensaje enviado boton/entrada (sólo se crean cuando la suscripsión es correcta.)</p>
-
-<p>Las siguientes variables toman referencia a los trés elementos principales <code>{{htmlelement("div")}}</code> en el diseño, por lo que podemos insertar elementos en ellos (por ejemplo cuando aparezca el botón <em>envíar el mensaje de chat</em> o el mensaje de chat aparezca en la lista de <em>mensajes</em>.)</p>
-
-<p>Finalmente tomamos referencia a nuestro formulario de selección de nombre y el elemento <code>{{htmlelement("input")}},</code> damos a la entrada un valor por defecto, y usamos <code><a href="/en-US/docs/Web/API/Event/preventDefault">preventDefault()</a></code> para detener el envío del formulario cuando este es enviado pulsando return.</p>
-
-<p>A continuación, pedimos permiso para enviar las notificaciones web, usando <code>{{domxref("Notification.requestPermission","requestPermission()")}}</code>:</p>
-
-<pre class="brush: js">Notification.requestPermission();</pre>
-
-<p>Ahora ejecutamos una sección de código cuando se dispara el <code><a href="/en-US/docs/Web/API/GlobalEventHandlers/onload">onload</a></code>, para empezar el proceso de inicialización de la app cuando se carga pro primera vez. En primer lugar añadimos un detector de eventos de clik al botón  Sucribirse/unsubscribe que ejecuta nuestra funcion <code>unsubscribe()</code> si actualmente estamos suscritos (<code>isPushEnabled</code> is <code>true</code>), y <code>subscribe()</code> de la otra manera:</p>
-
-<pre class="brush: js">window.addEventListener('load', function() {
-  subBtn.addEventListener('click', function() {
-    if (isPushEnabled) {
-      unsubscribe();
-    } else {
-      subscribe();
-    }
-  });</pre>
-
-<p>A continuación verificamos el service worked es soportado. Si es así, registramos un service worker usando <code>{{domxref("ServiceWorkerContainer.register()")}}</code>, y ejecutando nuestra función <code>initialiseState()</code>. Si no es así, entregamos un mensaje de error a la consola.</p>
-
-<pre class="brush: js">  // Check that service workers are supported, if so, progressively
-  // enhance and add push messaging support, otherwise continue without it.
-  if ('serviceWorker' in navigator) {
-    navigator.serviceWorker.register('sw.js').then(function(reg) {
-      if(reg.installing) {
-        console.log('Service worker installing');
-      } else if(reg.waiting) {
-        console.log('Service worker installed');
-      } else if(reg.active) {
-        console.log('Service worker active');
-      }
-
-      initialiseState(reg);
-    });
-  } else {
-    console.log('Service workers aren\'t supported in this browser.');
-  }
-});
-</pre>
-
-<p>La siguiente cosa en el código es la función <code>initialiseState()</code> — para el codigo completo comentado, mira en <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js"><code>initialiseState()</code> source on Github</a> (no lo estamos repitiendo aquí por brevedad.)</p>
-
-<p><code>initialiseState()</code> primero comprueba si las notificaciones son soportadas en los service workers, entonces establece la variable  <code>useNotifications</code> a verdadero. A continuación comprueba si dichas notificaciones están permitidas por el usuario y si los mensajes push están soportados, y reacciona deacuerdo a cada uno.</p>
-
-<p>Finalmente, se usa <code>{{domxref("ServiceWorkerContainer.ready()")}}</code> para esperar a que el service worker esté activo y listo para hacer las cosas. Una vez se revuelva el promise, recuperamos nuestra suscripsión para enviar los mensajes push usando la propiedad <code>{{domxref("ServiceWorkerRegistration.pushManager")}}</code>, que devuelve un objeto <code>{{domxref("PushManager")}}</code> cuando llamamos a <code>{{domxref("PushManager.getSubscription()")}}</code>. Una vez la segunda promesa interna se resuelva, habilitamos el botón subscribe/unsubscribe (<code>subBtn.disabled = false;</code>), y verificamos que tenemos un objeto suscripsión para trabajar.</p>
-
-<p>Si lo hacemos, entonces ya estamos suscritos. Esto es posible cuando la app no está abierta en el navegador; el service worker aun puede ser activado en segundo plano. si estamos suscritos, actualizamos la UI para mostrar que estamos suscritos por la actualizacion del label en el botón, entonces establecemos <code>isPushEnabled</code> to <code>true</code>, toma el punto final de suscripsión desde <code>{{domxref("PushSubscription.endpoint")}}</code>, genera una public key usando <code>{{domxref("PushSubscription.getKey()")}}</code>, y ejecutando nuestra función <code>updateStatus()</code>, que como verá más adelante se comunica con el servidor.</p>
-
-<p>Como un bonus añadido, configuramos un nuevo <code>{{domxref("MessageChannel")}}</code> usando el constructor <code>{{domxref("MessageChannel.MessageChannel()")}}</code>, toma una referencia al service worker activo usando <code>{{domxref("ServiceworkerRegistration.active")}}</code>, luego configure un canal entre el contexto principal del navegador y el contexto del service worker usando <code>{{domxref("Worker.postMessage()")}}</code>. El contexto del navegador recive mensajes en <code>{{domxref("MessageChannel.port1")}}</code>; Cuando esto suceda, ejecutamos la función <code>handleChannelMessage()</code> para decidir que hacer con esos datos (mirar la sección <code>{{anch("Handling channel messages sent from the service worker")}}</code> ).</p>
-
-<h4 id="Subscribing_and_unsubscribing">Subscribing and unsubscribing</h4>
-
-<p>Ahora regresamos la atención a las funciones <code>subscribe()</code> y <code>unsubscribe()</code> usadas para subscribe/unsubscribe al servicion de notificaciones push.</p>
-
-<p>In the case of subscription, we again check that our service worker is active and ready by calling {{domxref("ServiceWorkerContainer.ready()")}}. When the promise resolves, we subscribe to the service using {{domxref("PushManager.subscribe()")}}. If the subscription is successful, we get a {{domxref("PushSubscription")}} object, extract the subscription endpoint from this and generate a public key (again, {{domxref("PushSubscription.endpoint")}} and {{domxref("PushSubscription.getKey()")}}), and pass them to our <code>updateStatus()</code> function along with the update type (<code>subscribe</code>) to send the necessary details to the server.</p>
-
-<p>We also make the necessary updates to the app state (set <code>isPushEnabled</code> to <code>true</code>) and UI (enable the subscribe/unsubscribe button and set its label text to show that the next time it is pressed it will unsubscribe.)</p>
-
-<p>The <code>unsubscribe()</code> function is pretty similar in structure, but it basically does the opposite; the most notable difference is that it gets the current subscription using {{domxref("PushManager.getSubscription()")}}, and when that promise resolves it unsubscribes using {{domxref("PushSubscription.unsubscribe()")}}.</p>
-
-<p>Appropriate error handling is also provided in both functions.  </p>
-
-<p>We only show the <code>subscribe()</code> code below, for brevity; see the full <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js">subscribe/unsubscribe code on Github</a>.</p>
-
-<pre class="brush: js">function subscribe() {
-  // Disable the button so it can't be changed while
-  // we process the permission request
-
-  subBtn.disabled = true;
-
-  navigator.serviceWorker.ready.then(function(reg) {
-    reg.pushManager.subscribe({userVisibleOnly: true})
-      .then(function(subscription) {
-        // The subscription was successful
-        isPushEnabled = true;
-        subBtn.textContent = 'Unsubscribe from Push Messaging';
-        subBtn.disabled = false;
-
-        // Update status to subscribe current user on server, and to let
-        // other users know this user has subscribed
-        var endpoint = subscription.endpoint;
-        var key = subscription.getKey('p256dh');
-        updateStatus(endpoint,key,'subscribe');
-      })
-      .catch(function(e) {
-        if (Notification.permission === 'denied') {
-          // The user denied the notification permission which
-          // means we failed to subscribe and the user will need
-          // to manually change the notification permission to
-          // subscribe to push messages
-          console.log('Permission for Notifications was denied');
-
-        } else {
-          // A problem occurred with the subscription, this can
-          // often be down to an issue or lack of the gcm_sender_id
-          // and / or gcm_user_visible_only
-          console.log('Unable to subscribe to push.', e);
-          subBtn.disabled = false;
-          subBtn.textContent = 'Subscribe to Push Messaging';
-        }
-      });
-  });
-}</pre>
-
-<h4 id="Updating_the_status_in_the_app_and_server">Updating the status in the app and server</h4>
-
-<p>The next function in our main JavaScript is <code>updateStatus()</code>, which updates the UI for sending chat messages when subscribing/unsubscribing and sends a request to update this information on the server.</p>
-
-<p>The function does one of three different things, depending on the value of the <code>statusType</code> parameter passed into it:</p>
-
-<ul>
- <li><code>subscribe</code>: The button and text input for sending chat messages are created and inserted into the UI, and an object is sent to the server via XHR containing the status type (<code>subscribe</code>), username of the subscriber, subscription endpoint, and client public key.</li>
- <li><code>unsubscribe</code>: This basically works in the opposite way to subscribe — the chat UI elements are removed, and an object is sent to the server to tell it that the user has unsubscribed.</li>
- <li><code>init</code>: This is run when the app is first loaded/initialised — it creates the chat UI elements, and sends an object to the server to tell it that which user has reinitialised (reloaded.)</li>
-</ul>
-
-<p>Again, we have not included the entire function listing for brevity. Examine the <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js">full <code>updateStatus()</code> code on Github</a>.</p>
-
-<h4 id="Handling_channel_messages_sent_from_the_service_worker">Handling channel messages sent from the service worker</h4>
-
-<p>As mentioned earlier, when a <a href="/en-US/docs/Web/API/Channel_Messaging_API">channel message</a> is received from the service worker, our <code>handleChannelMessage()</code> function is called to handle it. This is done by our handler for the {{event("message")}} event, {{domxref("channel.port1.onmessage")}}:</p>
-
-<pre class="brush: js">channel.port1.onmessage = function(e) {
-  handleChannelMessage(e.data);
-}</pre>
-
-<p>This occurs when the <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/sw.js#L8">service worker sends a channel message over</a>.</p>
-
-<p>The <code>handleChannelMessage()</code> function looks like this:</p>
-
-<pre class="brush: js">function handleChannelMessage(data) {
-  if(data.action === 'subscribe' || data.action === 'init') {
-    var listItem = document.createElement('li');
-    listItem.textContent = data.name;
-    subscribersList.appendChild(listItem);
-  } else if(data.action === 'unsubscribe') {
-    for(i = 0; i &lt; subscribersList.children.length; i++) {
-      if(subscribersList.children[i].textContent === data.name) {
-        subscribersList.children[i].parentNode.removeChild(subscribersList.children[i]);
-      }
-    }
-    nameInput.disabled = false;
-  } else if(data.action === 'chatMsg') {
-    var listItem = document.createElement('li');
-    listItem.textContent = data.name + ": " + data.msg;
-    messagesList.appendChild(listItem);
-    sendInput.value = '';
-  }
-}</pre>
-
-<p>What happens here depends on what the <code>action</code> property on the <code>data</code> object is set to:</p>
-
-<ul>
- <li><code>subscribe</code> or <code>init</code> (at both startup and restart, we need to do the same thing in this sample): An {{htmlelement("li")}} element is created, its text content is set to <code>data.name</code> (the name of the subscriber), and it is appended to the subscribers list (a simple {{htmlelement("ul")}} element) so there is visual feedback that a subscriber has (re)joined the chat.</li>
- <li><code>unsubscribe</code>: We loop through the children of the subscribers list, find the one whose text content is equal to <code>data.name</code> (the name of the unsubscriber), and delete that node to provide visual feedback that someone has unsubscribed.</li>
- <li><code>chatMsg</code>: In a similar manner to the first case, an {{htmlelement("li")}} element is created, its text content is set to <code>data.name + ": " + data.msg</code> (so for example "Chris: This is my message"), and it is appended to the chat messages list; this is how the chat messages appear on the UI for each user.</li>
-</ul>
-
-<div class="note">
-<p><strong>Note</strong>: We have to pass the data back to the main context before we do DOM updates because service workers don't have access to the DOM. You should be aware of the limitations of service workers before attemping to ue them. Read <a href="/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers">Using Service Workers</a> for more details.</p>
-</div>
-
-<h4 id="Sending_chat_messages">Sending chat messages</h4>
-
-<p>When the <em>Send Chat Message</em> button is clicked, the content of the associated text field is sent as a chat message. This is handled by the <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js"><code>sendChatMessage()</code> function</a> (again, not shown in full for brevity). This works in a similar way to the different parts of the <code>updateStatus()</code> function (see {{anch("Updating the status in the app and server")}}) — we retrieve an endpoint and public key via a {{domxref("PushSubscription")}} object, which is itself retrieved via {{domxref("ServiceWorkerContainer.ready()")}} and {{domxref("PushManager.subscribe()")}}. These are sent to the server via {{domxref("XMLHttpRequest")}} in a message object, along with the name of the subscribed user, the chat message to send, and a <code>statusType</code> of <code>chatMsg</code>.</p>
-
-<h3 id="The_server">The server</h3>
-
-<p>As mentioned above, we need a server-side component in our app, to handle storing subscription details, and send out push messages when updates occur. We've hacked together a quick-and-dirty server using <a href="http://nodejs.org/">NodeJS</a> (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/server.js">server.js</a></code>), which handles the XHR requests sent by our client-side JavaScript code.</p>
-
-<p>It uses a text file (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/endpoint.txt">endpoint.txt</a></code>) to store subscription details; this file starts out empty. There are four different types of request, marked by the <code>statusType</code> property of the object sent over in the request; these are the same as those understood client-side, and perform the required server actions for that same situation. Here's what each means in the context of the server:</p>
-
-<ul>
- <li><code>subscribe</code>: The server adds the new subscriber's details into the subscription data store (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/endpoint.txt">endpoint.txt</a></code>), including the endpoint, and then sends a push message to all the endpoints it has stored to tell each subscriber that someone new has joined the chat.</li>
- <li><code>unsubscribe</code>: The server finds the sending subscriber's details in the subscription store and removes it, then sends a push message to all remaining subscribers telling them the user has unsubscribed.</li>
- <li><code>init</code>: The server reads all the current subscribers from the text file, and sends each one a push message to tell them a user has initialized (rejoined) the chat.</li>
- <li><code>chatMsg</code>: Sent by a subscriber that wishes to deliver a message to all users; the server reads the list of all current subscribers from the subscription store file, then sends each one a push message containing the new chat message they should display.</li>
-</ul>
-
-<p>A couple more things to note:</p>
-
-<ul>
- <li>We are using the Node.js <a href="https://nodejs.org/api/https.html">https module</a> to create the server, because for security purposes, service workers only work on a secure connection. This is why we need to include the <code>.pfx</code> security cert in the app, and reference it when creating the server in the Node code.</li>
- <li>When you send a push message without data, you simply send it to the endpoint URL using an HTTP <code>POST</code> request. However, when the push message contains data, you need to encrypt it, which is quite a complex process. As time goes on, libraries will appear to do this kind of thing for you; for this demo we used Marco Castelluccio's NodeJS <a href="https://github.com/marco-c/web-push">web-push library</a>. Have a look at the source code to get more of an idea of how the encryption is done (and read <a href="https://tools.ietf.org/html/draft-ietf-webpush-encryption-01">Message Encryption for Web Push</a> for more details.) The library <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/server.js#L43-L46">makes sending a push message simple</a>.</li>
- <li>If you wish to have messages that collapse (newer updates will replace older updates), you can use the Topic feature. A topic is a special class of subscription update that has a <code>Topic</code> header. A topic name can be any URL safe, base64 string. For example, a header like "<code>Topic: MyFavoriteTopic-For2016</code>" is fine, but "<code>Topic: OMG! Kitties :)</code>" is not. Topic messages are collapsed when the subscriber is offline or unavailable. When they come back, they will receive only the lastest message per topic, along with whatever other messages are pending. "<a href="https://hacks.mozilla.org/2016/11/mozilla-push-server-now-supports-topics/">Mozilla Push Server now supports Topics</a>" on the Mozilla Hacks blog gives more details and examples.</li>
-</ul>
-
-<h3 id="The_service_worker">The service worker</h3>
-
-<p>Now let's have a look at the service worker code (<code><a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/sw.js">sw.js</a></code>), which responds to the push messages, represented by {{Event("push")}} events. These are handled on the service worker's scope by the ({{domxref("ServiceWorkerGlobalScope.onpush")}}) event handler; its job is to work out what to do in response to each received message. We first convert the received message back into an object by calling {{domxref("PushMessageData.json()")}}. Next, we check what type of push message it is, by looking at the object's <code>action</code> property:</p>
-
-<ul>
- <li><code>subscribe</code> or <code>unsubscribe</code>: We send a system notification via the <code>fireNotification()</code> function, but also send a message back to the main context on our {{domxref("MessageChannel")}} so we can update the subscriber list accordingly (see {{anch("Handling channel messages sent from the service worker")}} for more details).</li>
- <li><code>init</code> or <code>chatMsg</code>: We just send a channel message back to the main context to handle the <code>init</code> and <code>chatMsg</code> cases (these don't need a system notification).</li>
-</ul>
-
-<pre class="brush: js">self.addEventListener('push', function(event) {
-  var obj = event.data.json();
-
-  if(obj.action === 'subscribe' || obj.action === 'unsubscribe') {
-    fireNotification(obj, event);
-    port.postMessage(obj);
-  } else if(obj.action === 'init' || obj.action === 'chatMsg') {
-    port.postMessage(obj);
-  }
-});</pre>
-
-<p>Next, let's look at the <code>fireNotification()</code> function (which is blissfully pretty simple).</p>
-
-<pre class="brush: js">function fireNotification(obj, event) {
-  var title = 'Subscription change';
-  var body = obj.name + ' has ' + obj.action + 'd.';
-  var icon = 'push-icon.png';
-  var tag = 'push';
-
-  event.waitUntil(self.registration.showNotification(title, {
-    body: body,
-    icon: icon,
-    tag: tag
-  }));
-}</pre>
-
-<p>Here we assemble the assets needed by the notification box: the title, body, and icon. Then we send a notification via the {{domxref("ServiceWorkerRegistration.showNotification()")}} method, providing that information as well as the tag "push", which we can use to identify this notification among any other notifications we might be using. When the notification is successfully sent, it manifests as a system notification dialog on the users computers/devices in whatever style system notifications look like on those systems (the following image shows a Mac OSX system notification.)</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/11855/subscribe-notification.png" style="display: block; height: 65px; margin: 0px auto; width: 326px;"></p>
-
-<p>Note that we do this from inside an {{domxref("ExtendableEvent.waitUntil()")}} method; this is to make sure the service worker remains active until the notification has been sent. <code>waitUntil()</code> will extend the life cycle of the service worker until everything inside this method has completed.</p>
-
-<div class="note">
-<p><strong>Note</strong>: Web notifications from service workers were introduced around Firefox version 42, but are likely to be removed again while the surrounding functionality (such as <code>Clients.openWindow()</code>) is properly implemented (see {{bug(1203324)}} for more details.)</p>
-</div>
-
-<h2 id="Handling_premature_subscription_expiration">Handling premature subscription expiration</h2>
-
-<p>Sometimes push subscriptions expire prematurely, without {{domxref("PushSubscription.unsubscribe()")}} being called. This can happen when the server gets overloaded, or if you are offline for a long time, for example.  This is highly server-dependent, so the exact behavior is difficult to predict. In any case, you can handle this problem by watching for the {{Event("pushsubscriptionchange")}} event, which you can listen for by providing a {{domxref("ServiceWorkerGlobalScope.onpushsubscriptionchange")}} event handler; this event is fired only in this specific case.</p>
-
-<pre class="brush: js  language-js"><code class="language-js">self<span class="punctuation token">.</span><span class="function token">addEventListener<span class="punctuation token">(</span></span><span class="string token">'pushsubscriptionchange'</span><span class="punctuation token">,</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
- <span class="comment token"> // do something, usually resubscribe to push and
-</span> <span class="comment token"> // send the new subscription details back to the
-</span> <span class="comment token"> // server via XHR or Fetch
-</span><span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Note that we don't cover this case in our demo, as a subscription ending is not a big deal for a simple chat server. But for a more complex example you'd probably want to resubscribe the user.</p>
-
-<h2 id="Extra_steps_for_Chrome_support">Extra steps for Chrome support</h2>
-
-<p>To get the app working on Chrome, we need a few extra steps, as Chrome currently relies on Google's Cloud Messaging service to work.</p>
-
-<h3 id="Setting_up_Google_Cloud_Messaging">Setting up Google Cloud Messaging</h3>
-
-<p>To get this set up, follow these steps:</p>
-
-<ol>
- <li>Navigate to the <a href="https://console.developers.google.com">Google Developers Console</a>  and set up a new project.</li>
- <li>Go to your project's homepage (ours is at <code>https://console.developers.google.com/project/push-project-978</code>, for example), then
-  <ol>
-   <li>Select the <em>Enable Google APIs for use in your apps</em> option.</li>
-   <li>In the next screen, click <em>Cloud Messaging for Android</em> under the <em>Mobile APIs</em> section.</li>
-   <li>Click the <em>Enable API</em> button.</li>
-  </ol>
- </li>
- <li>Now you need to make a note of your project number and API key because you'll need them later. To find them:
-  <ol>
-   <li><strong>Project number</strong>: click <em>Home</em> on the left; the project number is clearly marked at the top of your project's home page.</li>
-   <li><strong>API key</strong>: click <em>Credentials</em> on the left hand menu; the API key can be found on that screen.</li>
-  </ol>
- </li>
-</ol>
-
-<h3 id="manifest.json">manifest.json</h3>
-
-<p>You need to include a Google app-style <code>manifest.json</code> file in your app, which references the project number you made a note of earlier in the <code>gcm_sender_id</code> parameter. Here is our simple example <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/manifest.json">manifest.json</a>:</p>
-
-<pre class="brush: js">{
-  "name": "Push Demo",
-  "short_name": "Push Demo",
-  "icons": [{
-        "src": "push-icon.png",
-        "sizes": "111x111",
-        "type": "image/png"
-      }],
-  "start_url": "/index.html",
-  "display": "standalone",
-  "gcm_sender_id": "224273183921"
-}</pre>
-
-<p>You also need to reference your manifest using a {{HTMLElement("link")}} element in your HTML:</p>
-
-<pre class="brush: html">&lt;link rel="manifest" href="manifest.json"&gt;</pre>
-
-<h3 id="userVisibleOnly">userVisibleOnly</h3>
-
-<p>Chrome requires you to set the <a href="/en-US/docs/Web/API/PushManager/subscribe#Parameters"><code>userVisibleOnly</code> parameter</a> to <code>true</code> when subscribing to the push service, which indicates that we are promising to show a notification whenever a push is received. This can be <a href="https://github.com/chrisdavidmills/push-api-demo/blob/gh-pages/main.js#L127">seen in action in our <code>subscribe()</code> function</a>.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Push_API">Push API</a></li>
- <li><a href="/en-US/docs/Web/API/Service_Worker_API">Service Worker API</a></li>
-</ul>
-
-<div class="note">
-<p><strong>Note</strong>: Some of the client-side code in our Push demo is heavily influenced by Matt Gaunt's excellent examples in <a href="http://updates.html5rocks.com/2015/03/push-notificatons-on-the-open-web">Push Notifications on the Open Web</a>. Thanks for the awesome work, Matt!</p>
-</div>
diff --git a/files/es/web/api/randomsource/index.html b/files/es/web/api/randomsource/index.html
deleted file mode 100644
index 76e8d7fdc2..0000000000
--- a/files/es/web/api/randomsource/index.html
+++ /dev/null
@@ -1,111 +0,0 @@
----
-title: RandomSource
-slug: Web/API/RandomSource
-tags:
-  - API
-  - Interface
-  - NeedsTranslation
-  - RandomSource
-  - Reference
-  - TopicStub
-  - Web Crypto API
-translation_of: Web/API/Crypto/getRandomValues
-translation_of_original: Web/API/RandomSource
----
-<p>{{APIRef("Web Crypto API")}}</p>
-
-<p><strong><code>RandomSource</code></strong> represents a source of cryptographically secure random numbers. It is available via the {{domxref("Crypto")}} object of the global object: {{domxref("Window.crypto")}} on Web pages, {{domxref("WorkerGlobalScope.crypto")}} in workers.</p>
-
-<p><code>RandomSource</code> is a not an interface and no object of this type can be created.</p>
-
-<h2 id="Properties">Properties</h2>
-
-<p><em><code>RandomSource</code> neither defines nor inherits any property.</em></p>
-
-<dl>
-</dl>
-
-<h2 id="Methods">Methods</h2>
-
-<dl>
- <dt>{{ domxref("RandomSource.getRandomValues()") }}</dt>
- <dd>Fills the passed {{ domxref("ArrayBufferView") }} with cryptographically sound random values.</dd>
-</dl>
-
-<h2 id="Specification" name="Specification">Specification</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Crypto API', '#dfn-RandomSource')}}</td>
-   <td>{{Spec2('Web Crypto API')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_Compatibility">Browser Compatibility</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>11.0 {{ webkitbug("22049") }}</td>
-   <td>{{CompatGeckoDesktop(21)}} [1]</td>
-   <td>11.0</td>
-   <td>15.0</td>
-   <td>3.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatNo() }}</td>
-   <td>23</td>
-   <td>{{CompatGeckoMobile(21)}}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>6</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Although the transparent <code>RandomSource</code> is only available since Firefox 26, the feature was available in Firefox 21.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{ domxref("Window.crypto") }} to get a {{domxref("Crypto")}} object.</li>
- <li>{{jsxref("Math.random")}}, a non-cryptographic source of random numbers.</li>
-</ul>
diff --git a/files/es/web/api/randomsource/obtenervaloresaleatorios/index.html b/files/es/web/api/randomsource/obtenervaloresaleatorios/index.html
deleted file mode 100644
index b6e09439a9..0000000000
--- a/files/es/web/api/randomsource/obtenervaloresaleatorios/index.html
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: Crypto.getRandomValues()
-slug: Web/API/RandomSource/Obtenervaloresaleatorios
-tags:
-  - API
-  - Criptografía
-  - Referencia
-  - metodo
-translation_of: Web/API/Crypto/getRandomValues
----
-<p>{{APIRef("Web Crypto API")}}</p>
-
-<p>El método <code><strong>Crypto.getRandomValues()</strong></code> permite obtener valores aleatorios criptográficamente fuertes. El array que se pasa como parámetro se rellena con números aleatorios (entiéndase aleatorios en el sentido criptográfico).</p>
-
-<p>Con el fin de garantizar un rendimiento razonable, las distintas implementaciones no utilizan un generador de numeros aleatorios puro, sino que utilizan un generador numérico pseudo-aleatorio, sembrado con un valor con suficiente entropía. Los generadores numéricos pseudo-aleatorios utilizados difieren entre {{Glossary("user agent", "user agents")}}, pero son adecuados para usos criptográficos. Se require también que las distintas implementaciones usen una semilla con suficiente entropía, como una fuente de entropía a nivel de sistema.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cryptoObj</em>.getRandomValues(<em>typedArray</em>);</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><em>typedArray</em></dt>
- <dd>Es un entero {{jsxref("TypedArray")}}, que puede ser un {{jsxref("Int8Array")}}, un {{jsxref("Uint8Array")}}, un {{jsxref("Int16Array")}}, un {{jsxref("Uint16Array")}}, un {{jsxref("Int32Array")}}, o un {{jsxref("Uint32Array")}}. Todos los elementos dentro del array seran sobreescritos con números aleatorios.</dd>
-</dl>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<ul>
- <li>Una {{exception("QuotaExceededError")}} {{domxref("DOMException")}} es lanzada si la longitud solicitada es mayor a 65536 bytes.</li>
-</ul>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: js">/* Asumiendo que window.crypto.getRandomValues está disponible */
-
-var array = new Uint32Array(10);
-window.crypto.getRandomValues(array);
-
-console.log("Tus numeros de la suerte:");
-for (var i = 0; i &lt; array.length; i++) {
-    console.log(array[i]);
-}
-</pre>
-
-<h2 id="Specification" name="Specification">Especificación</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Crypto API', '#RandomSource-method-getRandomValues')}}</td>
-   <td>{{Spec2('Web Crypto API')}}</td>
-   <td>Definición Inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir a los datos, por favor, compruebe <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un pull request.</p>
-
-<p>{{Compat("api.Crypto.getRandomValues")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{ domxref("Window.crypto") }} para obtener un objeto tipo {{domxref("Crypto")}}.</li>
- <li>{{jsxref("Math.random")}}, una fuente no criptográfica de números aleatorios.</li>
-</ul>
diff --git a/files/es/web/api/server-sent_events/index.html b/files/es/web/api/server-sent_events/index.html
new file mode 100644
index 0000000000..d62c1f2499
--- /dev/null
+++ b/files/es/web/api/server-sent_events/index.html
@@ -0,0 +1,100 @@
+---
+title: Server-sent events
+slug: Web/API/Server-sent_events
+tags:
+  - NeedsTranslation
+  - Server-sent events
+  - TopicStub
+translation_of: Web/API/Server-sent_events
+original_slug: Server-sent_events
+---
+<p>Traditionally, a web page has to send a request to the server to receive new data; that is, the page requests data from the server. With server-sent events, it's possible for a server to send new data to a web page at any time, by pushing messages to the web page. These incoming messages can be treated as <em><a href="/en-US/docs/DOM/event" title="DOM/Event">Events</a> + data</em> inside the web page.</p>
+<table class="topicpage-table">
+  <tbody>
+    <tr>
+      <td>
+        <h2 class="Documentation" id="Documentation" name="Documentation">Documentation</h2>
+        <dl>
+          <dt>
+            <a href="/en-US/docs/Server-sent_events/Using_server-sent_events" title="Server-sent events/Using server-sent events">Using server-sent events</a></dt>
+          <dd>
+            A tutorial guide to writing both server and client side part of a server-sent events app.</dd>
+          <dt>
+            <a href="/en-US/docs/Server-sent_events/EventSource" title="Server-sent events/EventSource">EventSource reference</a></dt>
+          <dd>
+            A reference to the client-side EventSource API.</dd>
+        </dl>
+        <p><span class="alllinks"><a href="/en-US/docs/tag/Server-sent_events" title="tag/Server-sent events">View All...</a></span></p>
+      </td>
+      <td>
+        <h2 class="Tools" id="Tools" name="Tools">Tools</h2>
+        <ul>
+          <li>Remy Sharp’s <a class="link-https" href="https://github.com/remy/polyfills/blob/master/EventSource.js">EventSource polyfill</a></li>
+          <li>Yaffle’s <a class="link-https" href="https://github.com/Yaffle/EventSource" title="https://github.com/Yaffle/EventSource">EventSource polyfill</a></li>
+          <li>Rick Waldron’s <a class="link-https" href="https://github.com/rwldrn/jquery.eventsource">jquery plugin</a></li>
+        </ul>
+        <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Related Topics</h2>
+        <ul>
+          <li><a href="/en-US/docs/AJAX" title="AJAX">AJAX</a>, <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>, <a href="/en-US/docs/WebSockets" title="WebSockets">WebSockets</a></li>
+        </ul>
+      </td>
+    </tr>
+  </tbody>
+</table>
+<h2 id="See_also">See also</h2>
+<ul>
+  <li>A <a href="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/" title="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/">Twitter like application</a> powered by server-sent events and <a class="link-https" href="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends%20timeline" title="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends timeline">its code on Github</a>.</li>
+  <li><a href="http://dsheiko.com/weblog/html5-and-server-sent-events" title="http://dsheiko.com/weblog/html5-and-server-sent-events">HTML5 and Server-sent events</a></li>
+  <li><a href="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html" title="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html">Server-sent events using Asp.Net</a></li>
+</ul>
+<h2 id="Specification">Specification</h2>
+<ul>
+  <li><a href="http://dev.w3.org/html5/eventsource/" title="http://dev.w3.org/html5/eventsource/">Server-sent events</a></li>
+</ul>
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+<div>
+  {{CompatibilityTable}}</div>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera</th>
+        <th>Safari</th>
+      </tr>
+      <tr>
+        <td>EventSource support</td>
+        <td>9</td>
+        <td>{{CompatGeckoDesktop("6.0")}}</td>
+        <td>{{CompatUnknown}}</td>
+        <td>11</td>
+        <td>5</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Mobile</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>EventSource support</td>
+        <td>{{CompatUnknown}}</td>
+        <td>{{CompatUnknown}}</td>
+        <td>{{CompatUnknown}}</td>
+        <td>{{CompatUnknown}}</td>
+        <td>{{CompatUnknown}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
diff --git a/files/es/web/api/server-sent_events/using_server-sent_events/index.html b/files/es/web/api/server-sent_events/using_server-sent_events/index.html
new file mode 100644
index 0000000000..9b7087b875
--- /dev/null
+++ b/files/es/web/api/server-sent_events/using_server-sent_events/index.html
@@ -0,0 +1,232 @@
+---
+title: Utilizando eventos enviados por el servidor (server-sent event)
+slug: Web/API/Server-sent_events/Using_server-sent_events
+translation_of: Web/API/Server-sent_events/Using_server-sent_events
+original_slug: Server-sent_events/utilizando_server_sent_events_sse
+---
+<p>Desarrollar una aplicación web que utilice server-sent events es muy fácil. Solo necesitas un pequeño código del lado del servidor para transmitir los eventos a la aplicación web, pero del lado de la aplicacion web se trabaja prácticamente igual que con cualquier otro tipo de eventos.</p>
+
+<p>Puedes ver un ejemplo <a href="https://developer.mozilla.org/samples/sse/">aqui</a> (actualmente no funciona).</p>
+
+<p><a href="http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_sse">ejemplo2</a></p>
+
+<h2 id="Recibiendo_eventos_desde_el_servidor">Recibiendo eventos desde el servidor</h2>
+
+<p>El server-sent event API está contenido en la interfaz <a href="https://developer.mozilla.org/en/Server-sent_events/EventSource"><code>EventSource</code></a>; para abrir una conexión al servidor para recibir eventos de él. Se crea un nuevo objeto new <a href="https://developer.mozilla.org/en/Server-sent_events/EventSource">EventSource</a>, especificando el URI de un script que genera los eventos, Por ejemplo:</p>
+
+<pre class="brush: js">var evtSource = new EventSource("ssedemo.php");
+</pre>
+
+<div class="note"><strong>Nota</strong>: Aunque todavía no es parte de la norma, EventSource es soportado por Firefox 11 y posteriores. Se espera que pronto forme parte del estándar.</div>
+
+<p>Una vez que ha instanciado el origen del evento, puede comenzar a escuchar los mensajes:</p>
+
+<pre class="brush: js">evtSource.onmessage = function(e) {
+  var newElement = document.createElement("li");
+
+  newElement.innerHTML = "message: " + e.data;
+  eventList.appendChild(newElement);
+}
+</pre>
+
+<p>Este codigo escucha todos los mensajes entrantes (Es decir, todos los avisos del servidor, que no tienen un campo de eventos en ellos) y anexa texto del mensaje a la lista en el documento HTML.</p>
+
+<p>También puedes escuchar eventos, usando <code>addEventListener()</code>:</p>
+
+<pre class="brush: js">evtSource.addEventListener("ping", function(e) {
+  var newElement = document.createElement("li");
+
+  var obj = JSON.parse(e.data);
+  newElement.innerHTML = "ping at " + obj.time;
+  eventList.appendChild(newElement);
+}, false);
+</pre>
+
+<p>Este código es similar,  excepto que este se activa cada vez que el servidor envia un mensaje con el campo de evento "ping"; entonces se analiza el JSON en el campo de datos y retorna esa informacion.</p>
+
+<h2 id="Enviando_eventos_desde_el_servidor">Enviando eventos desde el servidor</h2>
+
+<p>El script del servidor que envia los datos tiene que responder con el tipo MIME text/event-stream. Cada notificación se envia con un bloque de texto terminado en un par de saltos de línea, para mas detalles sobre el formato sobre la secuencia de evetos, ver {{ anch("Event stream format") }},</p>
+
+<p>El codigo PHP para este ejemplo que estamos utilizando:</p>
+
+<pre class="brush: php">date_default_timezone_set("America/New_York");
+header("Content-Type: text/event-stream\n\n");
+
+$counter = rand(1, 10);
+while (1) {
+  // Every second, sent a "ping" event.
+
+  echo "event: ping\n";
+  $curDate = date(DATE_ISO8601);
+  echo 'data: {"time": "' . $curDate . '"}';
+  echo "\n\n";
+
+  // Send a simple message at random intervals.
+
+  $counter--;
+
+  if (!$counter) {
+    echo 'data: This is a message at time ' . $curDate . "\n\n";
+    $counter = rand(1, 10);
+  }
+
+  ob_flush();
+  flush();
+  sleep(1);
+}
+</pre>
+
+<p>Se genera un evento cada segundo, con el evento "ping". Los datos de cada evento es un objeto JSON que contiene, en este caso, solo la fecha en formato ISO 8601 correspondiente a la hora en que se generó el evento. A intervalos aleatorios, se envia un mensaje simple (sin ningún tipo de evento)</p>
+
+<h2 id="Gestion_de_errores">Gestion de errores</h2>
+
+<p>Cuando se producen problemas (como un tiempo de espera o problemas relacionados con el control de acceso), se genera un evento de error. Puedes tomar acción sobre esto al implementar una devolución de llamada al objeto EventSource:</p>
+
+<pre class="brush: js">evtSource.onerror = function(e) {
+  alert("EventSource failed.");
+};
+</pre>
+
+<p>En Firefox 22, no parece que haya manera de distinguir entre los diferentes de eventos de error.</p>
+
+<h2 id="Cerrando_flujo_de_eventos" style="margin-bottom: 20px; line-height: 30px; font-size: 2.14285714285714rem;">Cerrando flujo de eventos</h2>
+
+<p>Por defecto, si la conexión entre el cliente y el servidor se cierra, la conexión es reiniciada. Podemos terminar la conexión con el método <code>.close()</code></p>
+
+<pre class="language-html" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal; color: rgb(77, 78, 83);"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;">evtSource.close();</code></pre>
+
+<div> </div>
+
+<h2 id="Formato_de_flujo_de_eventos_(formato_stream)">Formato de flujo de eventos (formato stream)</h2>
+
+<p>El flujo de eventos es una corriente sencilla de datos de texto, que deben ser codificados usando UTF-8. Los mensajes en el flujo de eventos están separados por un par de caracteres de salto de línea. Si hay un símbolo de dos puntos como primer caracter de una línea, se entiende que es un comentario y es ignorado. </p>
+
+<div class="note"><strong>Nota:</strong> La línea de comentario se puede usar para prevenir que la conexión se agote por tiempo (timeout); un sevidor puede enviar periódicamente un comentario para mantener viva la conexión.</div>
+
+<p>Cada mensaje consiste en una o más líneas de texto que enumeran los campos para ese mensaje. Cada campo está representado por el nombre del campo, seguido por los datos de texto para el valor de ese campo.</p>
+
+<h3 id="Campos">Campos</h3>
+
+<p>Los siguientes nombres de campo son definidos por la especificación:</p>
+
+<h4 id="event">event</h4>
+
+<p style="margin-left: 40px;">El tipo de evento. Si se especifica, un evento se enviará al navegador a la escucha para el nombre del evento especificado, el sitio web usaria <code>addEventLister()</code> para escuchar eventos nombrados. El controlador <code>onmessage</code> se llama si no se especifica el nombre del evento para un mensaje.</p>
+
+<h4 id="data">data</h4>
+
+<p style="margin-left: 40px;">El campo de datos  para el mensaje. Cuando el EventSource recibe múltiples lineas con "<code>data:</code>", se concatenara, insertando un caracter de nueva de linea entre cada uno. Se eliminan los saltos de línea al final <strong>[VERIFICAR].</strong></p>
+
+<h4 id="id"><strong>id</strong></h4>
+
+<p style="margin-left: 40px;">  El ID del evento que establecerá el último ID del objeto EventSource.</p>
+
+<h4 id="Retry"><strong>Retry</strong></h4>
+
+<p style="margin-left: 40px;">El tiempo de reconexión para usar al intentar enviar el evento. [Qué código maneja esto?] Este debe ser un número entero, que especifica el tiempo de reconexion en milisegundos. Si se especifica un valor no entero, el campo se ignora.  </p>
+
+<p>Se omiten todos los demas nombres de campo.</p>
+
+<div class="note"><strong>Nota:</strong> Si una línea no contiene dos puntos, la línea entera se tratara como un nombre de campo, con una cadena de valor vacio.</div>
+
+<h3 id="Ejemplos">Ejemplos</h3>
+
+<h4 id="Mensajes_con_datos_únicamente">Mensajes con datos únicamente</h4>
+
+<p>En el siguiente ejemplo, hay tres mensajes enviados. El primero es solo un comentario, debido a que empieza con dos puntos. Como se mencionó anteriormente, esto puede ser útil para mantener la conexión viva si los mensajes no son enviados regularmente.</p>
+
+<p>The second message contains a data field with the value "some text". The third message contains a data field with the value "another message\nwith two lines". Note the newline in the value.</p>
+
+<p>El segundo mensaje contiene un campo de datos con el valor "some text". El tercer mensaje contiene un campo de datos con el valor "another message\nwith two lines". Nota la nueva línea en el valor.</p>
+
+<pre>: this is a test stream
+
+data: some text
+
+data: another message
+data: with two lines
+</pre>
+
+<h4 id="Eventos_nombrados">Eventos nombrados</h4>
+
+<p>Este ejemplo envia algunos eventos nombrados. Cada uno tiene un nombre de evento especificado por el campo <code>event</code>, y un campo <code>data</code> cuyo valor es una cadena JSON apropiada con los datos necesarios para que el cliente actue sobre el evento. El campo <code>data</code>, podria, por supuesto, tener cualquier cadena; no tiene que ser un JSON.</p>
+
+<pre>event: userconnect
+data: {"username": "bobby", "time": "02:33:48"}
+
+event: usermessage
+data: {"username": "bobby", "time": "02:34:11", "text": "Hi everyone."}
+
+event: userdisconnect
+data: {"username": "bobby", "time": "02:34:23"}
+
+event: usermessage
+data: {"username": "sean", "time": "02:34:36", "text": "Bye, bobby."}
+</pre>
+
+<h4 id="Mezclando_y_emparejando">Mezclando y emparejando</h4>
+
+<p>No tienes que usar solamente mensajes sin nombrar o eventos tipados; puedes mezclarlo juntos en un solo flujo de evento.</p>
+
+<pre>event: userconnect
+data: {"username": "bobby", "time": "02:33:48"}
+
+data: Here's a system message of some kind that will get used
+data: to accomplish some task.
+
+event: usermessage
+data: {"username": "bobby", "time": "02:34:11", "text": "Hi everyone."}
+</pre>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>EventSource support</td>
+   <td>9</td>
+   <td>{{ CompatGeckoDesktop("6.0") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>11</td>
+   <td>5</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android-and-Meego</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>EventSource support</td>
+   <td>6 a 24 b</td>
+   <td>1.0</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>11.1</td>
+   <td>4</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
diff --git a/files/es/web/api/storage/localstorage/index.html b/files/es/web/api/storage/localstorage/index.html
deleted file mode 100644
index 5c46cb9559..0000000000
--- a/files/es/web/api/storage/localstorage/index.html
+++ /dev/null
@@ -1,136 +0,0 @@
----
-title: LocalStorage
-slug: Web/API/Storage/LocalStorage
-tags:
-  - Almacenamiento en Navegador
-  - Almacenamiento local
-translation_of: Web/API/Window/localStorage
-translation_of_original: Web/API/Web_Storage_API/Local_storage
----
-<p><code>localStorage</code> (almacenamiento local) es lo mismo que<code> <a href="/en-US/docs/Web/API/sessionStorage">sessionStorage</a> </code>(almacenamiento de sesión), con las mismas reglas de mismo-origen aplicadas, pero es persistente a través de diferentes sesiones. <code>localStorage</code> se introdujo en la version Firefox 3.5.</p>
-
-<div class="note"><strong>Nota:</strong> Cuando el navegador está en modo de navegación privado, una nueva base de datos temporal se crea para guardar <em>datos </em>de almacenamiento local. Esta base de datos se vacía y descarta cuando salimos del modo de navegación privado.</div>
-
-<pre class="brush:js notranslate" style="font-size: 14px;">// Guardar datos al almacenamiento local actual
-localStorage.setItem("nombredeusuario", "John");
-
-// Acceder a datos almacenados
-alert( "nombredeusuario = " + localStorage.getItem("nombredeusuario"));</pre>
-
-<p class="note">La persistencia de <code>localStorage</code> lo hace útil para una variedad de cosas, incluyendo contadores de páginas, como se demuestra en <a href="http://codepen.io/awesom3/pen/Hlfma">este tutorial en Codepen</a>.</p>
-
-<h4 id="Compatibilidad" style="line-height: 18px; font-size: 1.28571428571429rem;">Compatibilidad</h4>
-
-<p>Los objetos de <code>Storage</code> (almacenamiento) son una adición reciente al estándar, por lo que pueden no estar presentes en todos los navegadores. Esto se puede solucionar si introduce uno de los dos códigos al principio de sus <em>scripts</em>, permitiendo el uso de el objeto <code>localStorage</code> en implementaciones que no lo soportan de forma nativa.</p>
-
-<p>Este algoritmo es una imitación exacta del objeto <code>localStorage</code>, pero hace uso de cookies.</p>
-
-<pre class="brush:js notranslate" style="font-size: 14px;">if (!window.localStorage) {
-  Object.defineProperty(window, "localStorage", new (function () {
-    var aKeys = [], oStorage = {};
-    Object.defineProperty(oStorage, "getItem", {
-      value: function (sKey) { return sKey ? this[sKey] : null; },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "key", {
-      value: function (nKeyId) { return aKeys[nKeyId]; },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "setItem", {
-      value: function (sKey, sValue) {
-        if(!sKey) { return; }
-        document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/";
-      },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "length", {
-      get: function () { return aKeys.length; },
-      configurable: false,
-      enumerable: false
-    });
-    Object.defineProperty(oStorage, "removeItem", {
-      value: function (sKey) {
-        if(!sKey) { return; }
-        document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
-      },
-      writable: false,
-      configurable: false,
-      enumerable: false
-    });
-    this.get = function () {
-      var iThisIndx;
-      for (var sKey in oStorage) {
-        iThisIndx = aKeys.indexOf(sKey);
-        if (iThisIndx === -1) { oStorage.setItem(sKey, oStorage[sKey]); }
-        else { aKeys.splice(iThisIndx, 1); }
-        delete oStorage[sKey];
-      }
-      for (aKeys; aKeys.length &gt; 0; aKeys.splice(0, 1)) { oStorage.removeItem(aKeys[0]); }
-      for (var aCouple, iKey, nIdx = 0, aCouples = document.cookie.split(/\s*;\s*/); nIdx &lt; aCouples.length; nIdx++) {
-        aCouple = aCouples[nIdx].split(/\s*=\s*/);
-        if (aCouple.length &gt; 1) {
-          oStorage[iKey = unescape(aCouple[0])] = unescape(aCouple[1]);
-          aKeys.push(iKey);
-        }
-      }
-      return oStorage;
-    };
-    this.configurable = false;
-    this.enumerable = true;
-  })());
-}
-</pre>
-
-<div class="note"><strong>Nota:</strong> El tamaño máximo de datos que se puede guardar está muy restringido por el uso de cookies. Con este algoritmo, utilize las funciones <code>localStorage.getItem()</code>, <code>localStorage.setItem()</code>, y <code>localStorage.removeItem()</code> para agregar, cambiar, o quitar una clave. El uso del método <code>localStorage.suClave</code> para obtener, establecer, o borrar una clave <strong>no está permitido con este código</strong>. También se puede cambiar el nombre y usarse sólo para gestionar las cookies de el documento sin importar el objeto localStorage.</div>
-
-<div class="note"><strong>Nota:</strong> Al cambiar la cadena <code style="background: rgb(204, 204, 204);">"; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/"</code> a: <code style="background: rgb(204, 204, 204);">"; path=/"</code> (y al cambiar el nombre del objeto), esto se pasará a ser un <code>sessionStorage</code> <em>polyfill</em> en vez de un <code>localStorage</code> <em>polyfill</em>. Sin embargo, esta implementación compartirá valores almacenados a través de pestañas y ventanas del navegador (y sólo se borrará cuando todas las ventanas del navegador hayan sido cerradas), mientras que una implementación  <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">sessionStorage</span><span style="line-height: 1.5em;"> completamente compatible sólo restringirá los valores guardados al contexto actual del navegador.</span></div>
-
-<p>Esta es otra imitación menos exacta de el objeto <code>localStorage</code>, es más simple que la anterior, pero es compatible con navegadores antiguos, como Internet Explorer &lt; 8 (<strong>probado y funcional incluso en Internet Explorer 6</strong>). También hace uso de cookies.</p>
-
-<pre class="brush:js notranslate" style="font-size: 14px;">if (!window.localStorage) {
-  window.localStorage = {
-    getItem: function (sKey) {
-      if (!sKey || !this.hasOwnProperty(sKey)) { return null; }
-      return unescape(document.cookie.replace(new RegExp("(?:^|.*;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=\\s*((?:[^;](?!;))*[^;]?).*"), "$1"));
-    },
-    key: function (nKeyId) {
-      return unescape(document.cookie.replace(/\s*\=(?:.(?!;))*$/, "").split(/\s*\=(?:[^;](?!;))*[^;]?;\s*/)[nKeyId]);
-    },
-    setItem: function (sKey, sValue) {
-      if(!sKey) { return; }
-      document.cookie = escape(sKey) + "=" + escape(sValue) + "; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/";
-      this.length = document.cookie.match(/\=/g).length;
-    },
-    length: 0,
-    removeItem: function (sKey) {
-      if (!sKey || !this.hasOwnProperty(sKey)) { return; }
-      document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";
-      this.length--;
-    },
-    hasOwnProperty: function (sKey) {
-      return (new RegExp("(?:^|;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=")).test(document.cookie);
-    }
-  };
-  window.localStorage.length = (document.cookie.match(/\=/g) || window.localStorage).length;
-}
-</pre>
-
-<div class="note"><strong>Nota:</strong> El tamaño máximo de datos que se puede guardar está muy restringido por el uso de cookies. Con este algoritmo, utilize las funciones <code>localStorage.getItem()</code>, <code>localStorage.setItem()</code>, y <code>localStorage.removeItem()</code> para agregar, cambiar, o quitar una clave. El uso del método <code>localStorage.suClave</code> para obtener, establecer, o borrar una clave <strong>no está permitido con este código</strong>. También se puede cambiar el nombre y usarse sólo para gestionar las cookies de el documento sin importar el objeto localStorage.</div>
-
-<div class="note"><strong>Nota:</strong> Al cambiar la cadena <code style="background: rgb(204, 204, 204);">"; expires=Tue, 19 Jan 2038 03:14:07 GMT; path=/"</code> a: <code style="background: rgb(204, 204, 204);">"; path=/"</code> (y al cambiar el nombre del objeto), esto se volverá un <code>sessionStorage</code> <em>polyfill</em> en vez de un <code>localStorage</code> <em>polyfill</em>. Sin embargo, esta implementación compartirá valores almacenados a través de pestañas y ventanas del navegador (y sólo se borrará cuando todas las ventanas del navegador hayan sido cerradas), mientras que una implementación  <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">sessionStorage</span><span style="line-height: 1.5em;"> completamente compatible sólo restringirá los valores guardados al contexto actual del navegador.</span></div>
-
-<h4 id="Compatibilidad_y_relación_con_globalStorage" style="line-height: 18px; font-size: 1.28571428571429rem;">Compatibilidad y relación con globalStorage</h4>
-
-<p class="note"><code>localStorage</code> es lo mismo que <code>globalStorage[location.hostname]</code>, con la excepción de que tiene un ámbito de origen HTML5 (<em>esquema </em>+ <em>nombre del host </em>+ <em>puerto no estandar</em>), y <code>localStorage</code> es una instancia de <code>Storage</code>, al contrario que <code>globalStorage[location.hostname]</code>, que es una instancia de <code>StorageObsolete</code>, como se explica más adelante. Por ejemplo, <a class="external" href="http://example.com" rel="freelink">http://ejemplo.com</a> no puede acceder al mismo objeto <code>localStorage</code> que <a class="link-https" href="https://example.com" rel="freelink">https://ejemplo.com,</a> pero los dos pueden acceder al mismo elemento de <code>globalStorage</code>. --<code>localStorage</code> es una interfaz estándar mientras que <code>globalStorage</code> no lo es, así que no se debe depender de ella.</p>
-
-<p>Nótese que al establecer una propiedad en <code>globalStorage[location.hostname]</code> <strong>no</strong> la establece en <code>localStorage</code>, y al extender <code>Storage.prototype</code> no afecta a los elementos de <code>globalStorage</code>; sólo al extender <code>StorageObsolete.prototype</code> los afecta.</p>
-
-<h4 id="El_formato_de_Storage">El formato de Storage</h4>
-
-<p>Las claves y valores de <code>Storage</code> se guardan en el formato UTF-16 <a href="/en-US/docs/Web/API/DOMString">DOMString</a>, que usa 2 bytes por carácter.</p>
diff --git a/files/es/web/api/subtlecrypto/encrypt/index.html b/files/es/web/api/subtlecrypto/encrypt/index.html
deleted file mode 100644
index 8f35030d35..0000000000
--- a/files/es/web/api/subtlecrypto/encrypt/index.html
+++ /dev/null
@@ -1,142 +0,0 @@
----
-title: SubtleCrypto.digest()
-slug: Web/API/SubtleCrypto/encrypt
-tags:
-  - API
-  - Encriptación
-  - Referencia
-  - SubtleCrypto
-  - Web Crypto API
-  - encrypt
-translation_of: Web/HTTP/Headers/Digest
----
-<div>{{APIRef("Web Crypto API")}}</div>
-
-<p>El método <code><strong>digest()</strong></code> de la interfaz {{domxref("SubtleCrypto")}} genera un digest de los datos proveidos. Un {{domxref("digest")}} es un valor corto de longitud fija derivado de alguna entrada de longitud variable. Los digest criptográficos deben mostrar resistencia a colisiones, lo que significa que es difícil encontrar dos entradas diferentes que tengan el mismo valor de digest.</p>
-
-<p>Toma como argumento un identificador para el algoritmo digest a utilizar y los datos a codificar. Devuelve un <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" title="The Promise object represents the eventual completion (or failure) of an asynchronous operation, and its resulting value."><code>Promise</code></a> que se completará con el digest.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">const digest = <em>crypto</em><code>.subtle.digest(<em>algorithm</em>, <em>data</em>)</code>;
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<ul>
- <li><em><code>algorithm</code></em> es un {{domxref("DOMString")}} definiendo la función hash a utilizar. Los valores admitidos son:
-
-  <ul>
-   <li><code>SHA-1</code> (pero no debe utilizarse en aplicaciones criptográficas)</li>
-   <li><code>SHA-256</code></li>
-   <li><code>SHA-384</code></li>
-   <li><code>SHA-512</code></li>
-  </ul>
- </li>
- <li><em><code>data</code></em> es un {{jsxref("ArrayBuffer")}} o {{domxref("ArrayBufferView")}} que contiene los datos a ser digitalizados.</li>
-</ul>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<ul>
- <li><code><em>digest</em></code> es un <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" title="The Promise object represents the eventual completion (or failure) of an asynchronous operation, and its resulting value."><code>Promise</code></a> que se completa con un <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer" title="The ArrayBuffer object is used to represent a generic, fixed-length raw binary data buffer. You cannot directly manipulate the contents of an ArrayBuffer; instead, you create one of the typed array objects or a DataView object which represents the buffer in a specific format, and use that to read and write the contents of the buffer."><code>ArrayBuffer</code></a> conteniendo el digest.</li>
-</ul>
-
-<h2 id="Algoritmos_soportados">Algoritmos soportados</h2>
-
-<p>Los argoritmos digest, también conocidos como <a href="/en-US/docs/Glossary/Cryptographic_hash_function">funciones criptográficas hash</a>, transforman un bloque de datos arbitrariamente grande en una salida de tamaño fijo, normalmente mucho más corta que la entrada. Tienen una variedad de aplicaciones en criptografía.</p>
-
-<h3 id="SHA-1">SHA-1</h3>
-
-<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.1, y produce una salida de 160 bits de largo.</p>
-
-<div class="blockIndicator warning">
-<p><strong>Advertencia</strong>: Este algoritmo se considera ahora vulnerable y no debe utilizarse para aplicaciones criptográficas.</p>
-</div>
-
-<h3 id="SHA-256">SHA-256</h3>
-
-<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.2, y produce una salida de 256 bits de largo.</p>
-
-<h3 id="SHA-384">SHA-384</h3>
-
-<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.5, y produce una salida de 384 bits de largo.</p>
-
-<h3 id="SHA-512">SHA-512</h3>
-
-<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.4, y produce una salida de 512 bits de largo.</p>
-
-<div class="blockIndicator note">
-<p>Sugerencia: Si estás buscando aquí cómo crear un código de autenticación de mensajes "keyed-hash" (<a href="/en-US/docs/Glossary/HMAC">HMAC</a>), necesitas usar <a href="/en-US/docs/Web/API/SubtleCrypto/sign#HMAC">SubtleCrypto.sign()</a> en su lugar.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_básico">Ejemplo básico</h3>
-
-<p>Este ejemplo codifica un mensaje, luego calcula su digest SHA-256 y muestra la longitud del mismo:</p>
-
-<pre class="brush: js">const text = 'An obscure body in the S-K System, your majesty. The inhabitants refer to it as the planet Earth.';
-
-async function digestMessage(message) {
-  const encoder = new TextEncoder();
-  const data = encoder.encode(message);
-  const hash = await crypto.subtle.digest('SHA-256', data);
-  return hash;
-}
-
-const digestBuffer = await digestMessage(text);
-console.log(digestBuffer.byteLength);
-</pre>
-
-<h3 id="Convirtiendo_un_digest_a_una_cadena_hexadecimal">Convirtiendo un digest a una cadena hexadecimal</h3>
-
-<p>El resumen se devuelve como un <code>ArrayBuffer</code>, pero para la comparación y visualización los digests se representan a menudo como cadenas hexadecimales. Este ejemplo calcula un digest, y luego convierte el <code>ArrayBuffer</code> a un string hexadecimal:</p>
-
-<pre class="brush: js">const text = 'An obscure body in the S-K System, your majesty. The inhabitants refer to it as the planet Earth.';
-
-async function digestMessage(message) {
-  const msgUint8 = new TextEncoder().encode(message);                           // encode as (utf-8) Uint8Array
-  const hashBuffer = await crypto.subtle.digest('SHA-256', msgUint8);           // hash the message
-  const hashArray = Array.from(new Uint8Array(hashBuffer));                     // convert buffer to byte array
-  const hashHex = hashArray.map(b =&gt; b.toString(16).padStart(2, '0')).join(''); // convert bytes to hex string
-  return hashHex;
-}
-
-const digestHex = await digestMessage(text);
-console.log(digestHex);
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Crypto API', '#dfn-SubtleCrypto-method-digest', 'SubtleCrypto.digest()')}}</td>
-   <td>{{Spec2('Web Crypto API')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir a los datos, por favor, revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
-
-<p>{{Compat("api.SubtleCrypto.digest")}}</p>
-
-<div class="blockIndicator note">
-<p>En Chrome 60, se añadió una característica que deshabilita crypto.subtle para conexiones no TLS.</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features">Chromium especificación de origines seguro</a></li>
- <li><a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf" rel="noopener">FIPS 180-4</a> especifica la familia de algoritmos de digest SHA.</li>
-</ul>
diff --git a/files/es/web/api/touch_events/index.html b/files/es/web/api/touch_events/index.html
new file mode 100644
index 0000000000..0b45057ef7
--- /dev/null
+++ b/files/es/web/api/touch_events/index.html
@@ -0,0 +1,293 @@
+---
+title: Eventos de toque
+slug: Web/API/Touch_events
+tags:
+  - DOM
+  - Event
+  - Mobile
+  - NeedsMobileBrowserCompatTable
+  - eventos
+translation_of: Web/API/Touch_events
+original_slug: DOM/Touch_events
+---
+<p>Con el fin de proporcionar soporte de calidad para usuarios de interfaces táctiles, los eventos táctiles dan la posibilidad de interpretar la actividad de los dedos en pantallas táctiles o trackpads.</p>
+
+<h2 id="Definiciones">Definiciones</h2>
+
+<dl>
+ <dt>Superficie</dt>
+ <dd>La superficie sensible al tacto. Esta puede ser una pantalla o un trackpad.</dd>
+</dl>
+
+<dl>
+ <dt><strong style="font-weight: bold;">Punto de toque</strong></dt>
+ <dd>Un punto de contacto con la superficie. Esto podría ser un dedo (o un codo, oreja, nariz, o lo que sea, pero probablemente un dedo) o un stylus.</dd>
+</dl>
+
+<h2 id="Interfaces">Interfaces</h2>
+
+<dl>
+ <dt>{{ domxref("TouchEvent") }}</dt>
+ <dd>Representa un evento que ocurre cuando el estado de los toques en la superficie cambian.</dd>
+ <dt>{{ domxref("Touch") }}</dt>
+ <dd>Represeta un único punto de contacto entre el usuario y la superficie táctil.</dd>
+ <dt>{{ domxref("TouchList") }}</dt>
+ <dd>Representa varios puntos de toque: esto se utiliza cuando el usuario tiene, por ejemplo, varios dedos en la superficie al mismo tiempo.</dd>
+ <dt>{{ domxref("DocumentTouch") }}</dt>
+ <dd>Contiene varios métodos para crear objetos de {{domxref("Touch")}} y {{domxref("TouchList")}}.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Este ejemplo muestra múltiples puntos de toques al mismo tiempo, permitiendo al usuario dibujar en un {{ HTMLElement("canvas") }} con más de un dedo a la vez. Esto funciona solamente en un navegador que soporte eventos táctiles.</p>
+
+<div class="note"><strong>Not</strong><strong>a:</strong> El texto de abajo usa el término "dedo" cuando describe el contacto con la superficie, pero esto podría ser, por supuesto, también un stylus u otro método de contacto.</div>
+
+<h3 id="Configurando_los_eventos_de_manipulación">Configurando los eventos de manipulación</h3>
+
+<p>Cuando la página carga, la función <code>startup()</code> mostrada a continuación es llamada por nuestro atributo <code>onload</code> del elemento {{ HTMLElement("body") }}.</p>
+
+<pre class="brush: js">function startup() {
+  var el = document.getElementsByTagName("canvas")[0];
+  el.addEventListener("touchstart", handleStart, false);
+  el.addEventListener("touchend", handleEnd, false);
+  el.addEventListener("touchcancel", handleCancel, false);
+  el.addEventListener("touchleave", handleLeave, false);
+  el.addEventListener("touchmove", handleMove, false);
+}
+</pre>
+
+<p>Esto simplemente configura todos los detectores de eventos para nuestro elemento {{ HTMLElement("canvas") }}, por lo que podremos manejar todos los eventos de toque cuando se produzcan.</p>
+
+<h3 id="Seguimiento_de_nuevos_toques">Seguimiento de nuevos toques</h3>
+
+<p>Cuando un evento <code>touchstart</code> ocurre, indicando que un nuevo toque sobre la superficie se ha producido, la función <code>handleStart()</code> de a continuación es llamada.</p>
+
+<pre class="brush: js">function handleStart(evt) {
+  evt.preventDefault();
+  var el = document.getElementsByTagName("canvas")[0];
+  var ctx = el.getContext("2d");
+  var touches = evt.changedTouches;
+
+  for (var i=0; i&lt;touches.length; i++) {
+    ongoingTouches.push(touches[i]);
+    var color = colorForTouch(touches[i]);
+    ctx.fillStyle = color;
+    ctx.fillRect(touches[i].pageX-2, touches[i].pageY-2, 4, 4);
+  }
+}
+</pre>
+
+<p>Esto llama a {{ domxref("event.preventDefault()") }} para mantener al navegador procesando el evento de toque (esto también previene que un evento del ratón o mouse sea entregado). Entonces obtenemos el contexto y lanzamos la lista de puntos de contacto cambiados de la propiedad {{ domxref("TouchEvent.changedTouches") }} del evento.</p>
+
+<p>Después de ello, iteramos sobre todos los objetos {{ domxref("Touch") }} de la lista, insertándolo en una matriz de puntos de toque activos y dibujando el punto de inicio como un pequeño rectángulo; estamos usando una línea de 4 pixeles de ancho, por tanto estamos dibujando un cuadrado de 4 por 4 píxeles como punto de consistencia.</p>
+
+<h3 id="Dibujando_mientras_los_eventos_de_toque_se_mueven">Dibujando mientras los eventos de toque se mueven</h3>
+
+<p>Cada vez que uno o más dedos se mueven, un evento <code>touchmove</code> es entregado, resultando en una llamada a nuestra función <code>handleMove()</code>. Su responsabilidad en este ejemplo es actualizar la información de toque cacheada y dibujar una línea desde la posición previa a la posición actual en cada toque.</p>
+
+<pre class="brush: js">function handleMove(evt) {
+  evt.preventDefault();
+  var el = document.getElementsByTagName("canvas")[0];
+  var ctx = el.getContext("2d");
+  var touches = evt.changedTouches;
+
+  ctx.lineWidth = 4;
+
+  for (var i=0; i&lt;touches.length; i++) {
+    var color = colorForTouch(touches[i]);
+    var idx = ongoingTouchIndexById(touches[i].identifier);
+
+    ctx.fillStyle = color;
+    ctx.beginPath();
+    ctx.moveTo(ongoingTouches[idx].pageX, ongoingTouches[idx].pageY);
+    ctx.lineTo(touches[i].pageX, touches[i].pageY);
+    ctx.closePath();
+    ctx.stroke();
+    ongoingTouches.splice(idx, 1, touches[i]);  // swap in the new touch record
+  }
+}
+</pre>
+
+<p>Esto se repite también en los toques cambiados, pero mira en nuestra matriz de información de toques cacheados la información previa de cada toque con el fin de determinar los puntos de inicio para cada nuevo segmento de línea de toques que será dibujada. Esto se hace mirando cada propiedad de los toques de {{ domxref("Touch.identifier") }} . Esta propiedad es un único entero para cada toque, y sigue siendo consistente para cada evento durante la duración del contacto de cada dedo con la superficie.</p>
+
+<p>Esto nos permite conseguir las coordenadas de la posición previa de cada toque y usar el método apropiado de contexto para dibujar un segmento de línea uniendo dos posiciones a la vez.</p>
+
+<p>Después de dibujar la línea, llamamos a  <a href="/en/JavaScript/Reference/Global_Objects/Array/splice" title="en/JavaScript/Reference/Global Objects/Array/splice"><code>Array.splice()</code></a> para reemplazar la información previa sobre el punto de toque con la información actual de la matriz <code>ongoingTouches</code>.</p>
+
+<h3 id="Manejando_el_final_de_un_toque">Manejando el final de un toque</h3>
+
+<p>Cuando el usuario levanta un dedo de la superficie, un evento <code>touchend</code> es enviado.  De igual manera, si el dedo se desliza fuera de nuestro lienzo, obtenemos un evento <code>touchleave</code>. Manejamos ambos casos de la misma manera: llamando a la función <code>handleEnd()</code> de abajo. Su trabajo es dibujar el último segmento de línea para cada toque que ha finalizado y remueve el punto de toque de la lista de toques en marcha.</p>
+
+<pre class="brush: js">function handleEnd(evt) {
+  evt.preventDefault();
+  var el = document.getElementsByTagName("canvas")[0];
+  var ctx = el.getContext("2d");
+  var touches = evt.changedTouches;
+
+  ctx.lineWidth = 4;
+
+  for (var i=0; i&lt;touches.length; i++) {
+    var color = colorForTouch(touches[i]);
+    var idx = ongoingTouchIndexById(touches[i].identifier);
+
+    ctx.fillStyle = color;
+    ctx.beginPath();
+    ctx.moveTo(ongoingTouches[i].pageX, ongoingTouches[i].pageY);
+    ctx.lineTo(touches[i].pageX, touches[i].pageY);
+    ongoingTouches.splice(i, 1);  // remove it; we're done
+  }
+}
+</pre>
+
+<p>Esto es muy similar a la función previa; la única diferencia real es que cuando llamamos a  <a href="/en/JavaScript/Reference/Global_Objects/Array/splice" title="en/JavaScript/Reference/Global Objects/Array/splice"><code>Array.splice()</code></a>, simplemente remueve la antigua entrada de la lista de toques en marcha, sin añadir la información actualizada. El resultado es que detenemos el seguimiento del punto de toque.</p>
+
+<h3 id="Manejando_los_toques_cancelados">Manejando los toques cancelados</h3>
+
+<p>Si el dedo del usuario se equivoca en la Interfaz del navegador, o el toque necesita ser cancelado, el evento <code>touchcancel</code> es enviado, y llamamos a la función <code>handleCancel()</code> abajo.</p>
+
+<pre class="brush: js">function handleCancel(evt) {
+  evt.preventDefault();
+  var touches = evt.changedTouches;
+
+  for (var i=0; i&lt;touches.length; i++) {
+    ongoingTouches.splice(i, 1);  // remove it; we're done
+  }
+}
+</pre>
+
+<p>Dado que la idea es cancelar el toque inmediatamente, simplemente lo removemos de la lista de toques en marcha sin dibujar un segmento de línea final.</p>
+
+<h3 id="Funciones_de_conveniencia">Funciones de conveniencia</h3>
+
+<p>Este ejemplo usa dos funciones de convenience que deben mirarse brevemente para ayudar a que el resto del código sea más claro.</p>
+
+<h4 id="Seleccionando_un_color_para_cada_toque">Seleccionando un color para cada toque</h4>
+
+<p>Con el fin de hacer que cada dibujo de toque se vea diferente, la función  <code>colorForTouch()</code> es usada para elegir un color basado en el identificador único de toque. Este identificador estará siempre entre 0 y un valor menos que el número de toques activos. Puesto que es muy improbable que alguna persona con más de 16 dedos use este demo, convertimos estos directamente en colores de escalas grises.</p>
+
+<pre class="brush: js">function colorForTouch(touch) {
+  var id = touch.identifier;
+  id = id.toString(16); // make it a hex digit
+  return "#" + id + id + id;
+}
+</pre>
+
+<p>El resultado de esta función es un string o cadena que puede ser usada cuando se llame a funciones {{ HTMLElement("canvas") }} para configurar los colores de dibujos. Por ejemplo, para un valor {{ domxref("Touch.identifier") }}  de 10, el resultado string o cadena es "#aaa".</p>
+
+<h4 id="Encontrando_un_toque_continuo">Encontrando un toque continuo</h4>
+
+<p>La función <code>ongoingTouchIndexById()</code> abajo explora mediante la matriz <code>ongoingTouches</code> para encontrar el toque que coincida con el identificador dado, luego devuelve los índices de toques a la matriz.</p>
+
+<pre class="brush: js">function ongoingTouchIndexById(idToFind) {
+  for (var i=0; i&lt;ongoingTouches.length; i++) {
+    var id = ongoingTouches[i].identifier;
+
+    if (id == idToFind) {
+      return i;
+    }
+  }
+  return -1;    // not found
+}
+</pre>
+
+<p><a href="/samples/domref/touchevents.html">Ver ejemplo en vivo</a></p>
+
+<h2 id="Consejos_adicionales">Consejos adicionales</h2>
+
+<p>Esta sección provee consejos adicionales sobre como manejar los eventos de toques en tu aplicación web.</p>
+
+<h3 id="Manejando_los_clics">Manejando los clics</h3>
+
+<p>Ya que la llamada <code>preventDefault()</code> en un <code>touchstart</code> o el primer evento <code>touchmove</code> de una serie impide que los eventos correspondientes eventos del mouse o ratón se disparen, es común llamar a <code>preventDefault()</code> en <code>touchmove</code> en lugar de <code>touchstart</code>. De esta manera, los eventos del ratón pueden todavía ser disparados y cosas como enlaces siguen funcionando. Alternativamente, algunos frameworks tienen que referirse a eventos de toque como eventos de ratón para este mismo propósito. (Este ejemplo es muy simplificado y podria resultar en un extraño comportamiento. Solo se diseñó como guía).</p>
+
+<pre class="brush: js">function onTouch(evt) {
+  evt.preventDefault();
+  if (evt.touches.length &gt; 1 || (evt.type == "touchend" &amp;&amp; evt.touches.length &gt; 0))
+    return;
+
+  var newEvt = <a href="https://developer.mozilla.org/en/DOM/document.createEvent" rel="internal" title="en/DOM/document.createEvent">document.createEvent</a>("MouseEvents");
+  var type = null;
+  var touch = null;
+  switch (event.type) {
+    case "touchstart": type = "mousedown"; touch = event.changedTouches[[0];
+    case "touchmove":  type = "mousemove"; touch = event.changedTouches[[0];
+    case "touchend":   type = "mouseup"; touch = event.changedTouches[0];
+  }
+  newEvt.<strong>initMouseEvent</strong>(type, true, true, event.<code><a href="https://developer.mozilla.org/en/DOM/event.originalTarget" rel="custom">originalTarget</a>.ownerDocument.defaultView</code>, 0,
+    touch.screenX, touch.screenY, touch.clientX, touch.clientY,
+    evt.ctrlKey, evt.altKey, evt.shirtKey, evt.metaKey, 0, null);
+  event.<code><a href="https://developer.mozilla.org/en/DOM/event.originalTarget" rel="custom">originalTarget</a></code>.<a href="https://developer.mozilla.org/en/DOM/element.dispatchEvent" rel="internal" title="en/DOM/element.dispatchEvent">dispatchEvent</a>(newEvt);
+}
+</pre>
+
+<h3 id="Llamando_a_preventDefault()_solo_en_un_segundo_toque">Llamando a preventDefault() solo en un segundo toque</h3>
+
+<p>Una cosa para prevenir cosas como <code>pinchZoom</code> en una página es llamar a <code>preventDefault()</code> en el segundo toque de una serie. Este comportamiento no está bien definido en los eventos de toque, y resulta en diferentes comportamientos en diferentes navegadores (osea iOS evitará el zoom o acercamiento pero permitirá vista panorámica con ambos dedos. Android permitirá zoom o acercamiento pero no una panorámica. Opera and Firefox actualmente evita panorámica y zoom o acercamiento). Actualmente, no se recomienda depender de ningún comportamiento en particular en este caso, si no mas bien depender de una meta vista para evitar el zoom.</p>
+
+<dl>
+</dl>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatChrome("22.0") }}</td>
+   <td>{{ CompatGeckoDesktop("18.0") }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("6.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Notas_de_Gecko">Notas de Gecko</h3>
+
+<p>La preferencia <code>dom.w3c_touch_events.enabled</code> puede ser utilizada para activar o desactivar el soporte de eventos de toque estándares; por defecto, están activados.</p>
+
+<div class="geckoVersionNote" style="">
+<p>{{ gecko_callout_heading("12.0") }}</p>
+
+<p>Antes de Gecko 12.0 {{ geckoRelease("12.0") }}, Gecko no soportaba multi-toques; solo un toque cada vez era reportado.</p>
+</div>
+
+<div class="note"><strong>Note: </strong>Antes de Gecko 6.0 {{ geckoRelease("6.0") }}, Gecko ofrecía una <a href="/en/DOM/Touch_events_(Mozilla_experimental)" title="en/DOM/Touch events (Mozilla experimental)">API de eventos de toque propietaria</a>. Está API está obsoleta actualmente; deberías cambiar a esta."</div>
diff --git a/files/es/web/api/vibration_api/index.html b/files/es/web/api/vibration_api/index.html
new file mode 100644
index 0000000000..7d4a74ee42
--- /dev/null
+++ b/files/es/web/api/vibration_api/index.html
@@ -0,0 +1,156 @@
+---
+title: Vibración API
+slug: Web/API/Vibration_API
+tags:
+  - API
+  - Firefox OS
+  - Mobile
+  - Principiante
+  - Vibración
+  - Vibrado
+  - Vibrar
+  - WebAPI
+translation_of: Web/API/Vibration_API
+original_slug: Web/Guide/API/Vibration
+---
+<p>La mayoría de los dispositivos modernos pueden vibrar a través del hardware, esto permite que a través del código de software se pueda emitir estas vibraciones. La <strong>Vibration API</strong>  ofrece a las aplicaciones web la capacidad de acceder a este hardware en caso este lo soporte, caso contrario el dispositivo no hace nada.</p>
+
+<h2 id="Describiendo_vibraciones">Describiendo vibraciones</h2>
+
+<p>Vibración se puede describir como un patrón de prender y apagar pulsos, los cuales pueden variar en longitud. El patrón puede consistir de un sólo número que indica cuantos milisegundos vibrará, o un arreglo de enteros describiendo un patrón de vibraciones y pausas. La vibración es controlada por un solo método:</p>
+
+<p><span style="font-size: 13.63636302948px; line-height: 19.0909080505371px;">{{domxref("window.navigator.vibrate()")}}.</span></p>
+
+<h3 id="Vibración_simple">Vibración simple</h3>
+
+<p>Puedes iniciar una sola vibración del hardware pasando como argumento un sólo número, o un arreglo de un sólo número:</p>
+
+<pre class="brush:js">window.navigator.vibrate(200);
+window.navigator.vibrate([200]);
+</pre>
+
+<p>Ambos ejemplos hacen vibrar el dispositivo por 200 ms.</p>
+
+<h3 id="Patrones_de_vibración">Patrones de vibración</h3>
+
+<p>Un arreglo de valores describen que las vibraciones serán por períodos alternados, es decir, el dispositivo vibrará luego no lo hará, así según la secuencia definida. Cada valor en el arreglo es convertido a entero para luego ser interpretado alternadamente como el tiempo que el dispositivo debe vibrar y el tiempo que no debe vibrar. Ejemplo:</p>
+
+<pre class="brush: js">window.navigator.vibrate([200, 100, 200]);
+</pre>
+
+<p>Según este ejemplo el dispositivo vibrará por 200ms, luego se detiene por 100ms y luego vibra 200ms.</p>
+
+<p>Puedes especificar cuantas vibraciones/pausas desees, y el arreglo puede tener un tamaño par o impar. No importa que agregues una pausa como el último valor del arreglo, ya que el celular dejará de vibrar de todas formas al final de cada vibración.</p>
+
+<h3 id="Cancelar_vibraciones_existentes">Cancelar vibraciones existentes</h3>
+
+<p>Llamar {{domxref("window.navigator.vibrate()")}} con un valor de <code>0</code>, arreglo vació, o arreglo que contenga 0's detendrá cualquier vibración en curso.</p>
+
+<h3 id="Vibraciones_continuas">Vibraciones continuas</h3>
+
+<p style="margin: 0px 0px 0.8em; padding: 0px; border: 0px; font-family: 'Open Sans', Arial, sans-serif; line-height: 1.6em; font-size: 16px; vertical-align: baseline;">Algunas básicas acciones son <code style="margin: 0px; padding: 2px 7px; border: 0px; font-family: monospace, sans-serif; font-style: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; font-size: 16px; vertical-align: baseline; background-color: rgb(248, 248, 248); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;">setInterval</code> y <code style="margin: 0px; padding: 2px 7px; border: 0px; font-family: monospace, sans-serif; font-style: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; font-size: 16px; vertical-align: baseline; background-color: rgb(248, 248, 248); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;">clearInterval</code> que nos permitirán crear vibraciones persistentes:</p>
+
+<pre class="js  language-js" style="margin-top: 0.5em; margin-bottom: 0.5em; padding: 1em; border: 0px; font-family: Consolas, Monaco, 'Andale Mono', monospace; line-height: 1.6em; font-size: 0.8em; vertical-align: baseline; background-color: rgb(245, 242, 240); color: black; text-shadow: white 0px 1px; direction: ltr;"><code class="language-js" style="margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-style: inherit; font-variant: inherit; line-height: inherit; font-size: 13px; vertical-align: baseline; text-shadow: white 0px 1px; direction: ltr;"><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">var</span> intervaloDeVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
+<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">
+// Iniciar la vibración
+</span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">iniciarVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
+	navigator<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">.</span><span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">vibrate<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion)<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
+<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span>
+<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">
+// Detiene la vibración
+</span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">detenerVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
+<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">	// Limpiar el intervalo y detener las vibraciones existentes
+</span>	<span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">if</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span>intervaloDeVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">clearInterval<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>intervaloDeVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
+	navigator<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">.</span><span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">vibrate<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span><span class="token number" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 0, 85);">0</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
+<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span>
+<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">
+// Iniciar las vibraciones con una determinado tiempo e intervalo
+</span><span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">// Asumir que el valor recibido es un entero
+</span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span> iniciarVibradoPersistente<span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;"><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">,</span> intervalo<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
+	intervaloDeVibrado <span class="token operator" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(166, 127, 89); background-color: rgba(255, 255, 255, 0.498039);">=</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">setInterval<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
+		<span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">iniciarVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
+	<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">,</span> intervalo<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
+<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span></code></pre>
+
+<p style="margin: 0px 0px 0.8em; padding: 0px; border: 0px; font-family: 'Open Sans', Arial, sans-serif; line-height: 1.6em; font-size: 16px; vertical-align: baseline;">Claro que el código de arriba no toma en cuenta el método de utilizar un arreglo de vibración, utilizar un arreglo para vibración persistente necesitaría recalcular la suma de los elementos del arregloo y crear un intervalo basado en esos números (agregando adicionalmente las pausas)</p>
+
+<h3 id="¿Por_qué_utilizar_Vibration_API">¿Por qué utilizar Vibration API?</h3>
+
+<p style="margin: 0px 0px 0.8em; padding: 0px; border: 0px; font-family: 'Open Sans', Arial, sans-serif; line-height: 1.6em; font-size: 16px; vertical-align: baseline;">Esta API es claramente accesible a través de dispositivos móbiles. Vibration API puede servir para alertas en las aplicaciones web del celular, y sería es asombrosa cuando se utiliza en juegos o en aplicaciones pesadas. Imagínate mirando un video en tu celular y durante la escena de explosión,tu teléfono vibra un poco. O la sensación que tendría tu usuario al sentir el estallido de una bomba en el juego Bomberman.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('Vibration API')}}</td>
+   <td>{{Spec2('Vibration API')}}</td>
+   <td>Especificación inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteŕistica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}} {{property_prefix("webkit")}}</td>
+   <td>11.0 {{property_prefix("moz")}}<br>
+    16 (no prefix)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}} {{property_prefix("webkit")}}</td>
+   <td>11.0 {{property_prefix("moz")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_También">Ver También</h2>
+
+<ul>
+ <li>{{domxref("window.navigator.vibrate()")}}</li>
+ <li><a href="http://davidwalsh.name/vibration-api">Vibration API - David Walsh</a></li>
+</ul>
diff --git a/files/es/web/api/web_audio_api/index.html b/files/es/web/api/web_audio_api/index.html
new file mode 100644
index 0000000000..329f080a65
--- /dev/null
+++ b/files/es/web/api/web_audio_api/index.html
@@ -0,0 +1,511 @@
+---
+title: Web Audio API
+slug: Web/API/Web_Audio_API
+translation_of: Web/API/Web_Audio_API
+original_slug: Web_Audio_API
+---
+<div>{{apiref("Web Audio API")}}</div>
+
+<p class="summary">La API de Audio Web provee un sistema poderoso y versatil para controlar audio en la Web, permitiendo a los desarrolladores escoger fuentes de audio, agregar efectos al audio, crear visualizaciones de audios, aplicar efectos espaciales (como paneo) y mucho más.</p>
+
+<h2 id="Conceptos_y_uso_de_audio_Web">Conceptos y uso de audio Web</h2>
+
+<p>La API de Audio Web involucra manejar operaciones de audio dentro de un <strong>contexto de audio</strong>, y ha sido diseñada para permitir <strong>enrutamiento modular</strong>. Las operaciones de audio básicas son realizadas con <strong>nodos de audio</strong>, que están enlazados juntos para formar un <strong>gráfico de enrutamiento de audio</strong>. Muchas fuentes — con diferentes tipos de diseño de canales — están soportadas incluso dentro de un único contexto. Este diseño modular provee flexibilidad para crear funciones de audio complejas con efectos dinámicos.</p>
+
+<p>Los nodos de audio están enlazados en cadenas y redes simples por sus entradas y salidas. Éstos típicamente empiezan con una o más fuentes. Las fuentes provee matrices de intensidades de sonidos (muestras) en segmentos de tiempo muy pequeños, a menudo decenas de miles de éstos por segundo.  Éstos podrían ser calculados matemáticamente (como  {{domxref("OscillatorNode")}}), o pueden ser grabaciones de archivos de audio o video (como {{domxref("AudioBufferSourceNode")}} y {{domxref("MediaElementAudioSourceNode")}}) y transmisiones de audio ({{domxref("MediaStreamAudioSourceNode")}}). De hecho, los archivos de sonido son sólo grabaciones de intensidades de sonido, que vienen desde micrófonos o instrumentos eléctricos, y mezclados en una onda única y complicada.</p>
+
+<p>Los resultados de éstos nodos podrían ser enlazados a las entradas de otros, que mezclan o modifican estas transmisiones de muestras de audio en diferentes transmisiones. Una modificación común es multiplicar las muestras por un valor para hacerlas más fuertes o silenciosas (como es el caso con {{domxref("GainNode")}}). Una vez que el sonido ha sido lo suficientemente procesado por el efecto necesario, puede ser enlazados a la entrada de un destino({{domxref("AudioContext.destination")}}), que enviá el sonido a los altavoces o auriculares. Esta última conexión sólo es necesaria si el usuario debe escuchar el audio.</p>
+
+<p>Un diagrama de flujo simple y típico para el audio web se vería algo como esto:</p>
+
+<ol>
+ <li>Crear contexto de audio</li>
+ <li>Dentro del contexto, crear fuentes — como <code>&lt;audio&gt;</code>, oscillator, stream</li>
+ <li>Crear nodos de efectos, <span class="short_text" id="result_box" lang="es"><span>tales como reverberación, filtro biquad, panner, compresor</span></span></li>
+ <li>Ecoge el destino final del audio, por ejemplo tu sistema de altavoces</li>
+ <li>Conecta las fuentes a los efectos, y los efectos al destino.</li>
+</ol>
+
+<p><img alt="A simple box diagram with an outer box labeled Audio context, and three inner boxes labeled Sources, Effects and Destination. The three inner boxes have arrow between them pointing from left to right, indicating the flow of audio information." src="https://mdn.mozillademos.org/files/12241/webaudioAPI_en.svg" style="display: block; height: 143px; margin: 0px auto; width: 643px;"></p>
+
+<p>El tiempo es controlado con alta precisión baja latencia, permitiendo a los desarrolladores escribir código que responda con precisión a los eventos y sea capaz de apuntar a muestras específicas, incluso en una alta frecuencia de muestreo. <span id="result_box" lang="es"><span>Por lo tanto, las aplicaciones como las cajas de ritmos y los secuenciadores están a su alcance.</span></span></p>
+
+<p>El API de Audio Web también nos permite controlar cómo el audio es <em>espacializado</em>. Usando un sistema basado en un <em>modelo fuente-oyente</em>, esto permite controlar el <em>modeo de paneo</em> y que se ocupa de la <em>atenuación inducida por distancia </em>o <em>desplazamiento doppler</em> i<span class="short_text" id="result_box" lang="es"><span>nducido por una fuente en movimiento (o un oyente en movimiento).</span></span></p>
+
+<div class="note">
+<p>Puedes leear sobre la teoría del API de Audio Web con más detalle en nuestro artículo <a href="/en-US/docs/Web/API/Web_Audio_API/Basic_concepts_behind_Web_Audio_API">Conceptos Básicos detrás del API de Audio Web</a>.</p>
+</div>
+
+<h2 id="Interfaces_del_API_de_Audio_Web">Interfaces del API de Audio Web</h2>
+
+<p>La API de Audio Web tiene un número de interfaces y eventos asociados, que han sido divididos en nueve categorias de funcionalidad.</p>
+
+<h3 id="Definición_general_del_gráfico_de_audio">Definición general del gráfico de audio</h3>
+
+<p><span id="result_box" lang="es"><span>Contenedores y definiciones generales que dan forma a los gráficos de audio en el uso de Web Audio API</span></span>.</p>
+
+<dl>
+ <dt>{{domxref("AudioContext")}}</dt>
+ <dd>La interfaz <strong><code>AudioContext</code></strong> representa un gráfico de procesamiento de audio construido de módulos de audio enlazados juntos, cada uno representado por un {{domxref("AudioNode")}}. Un contexto de audio controla la creación de los nodos que contiene y la ejecución del procesamiento del audio, or decoding. Necesitas crear un <code>AudioContext</code> antes de hacer cualquier cosa,  ya que todo pasa dentro de un contexto de audio.</dd>
+ <dt>{{domxref("AudioNode")}}</dt>
+ <dd>La interfaz <strong><code>AudioNode</code></strong><strong> </strong>representa un módulo de procesamiento de audio como una <em>fuente de audio</em> (por ejemplo un ejemplo HTML {{HTMLElement("audio")}} or {{HTMLElement("video")}}), <em>destino de audio</em>, <em>módulo de procesamiento intermedio</em> (por ejemplo un filtro como {{domxref("BiquadFilterNode")}}, o <em>control de volumen</em> como {{domxref("GainNode")}}).</dd>
+ <dt>{{domxref("AudioParam")}}</dt>
+ <dd>La interfaz <strong><code>AudioParam</code></strong><strong> </strong>representa un parámetro relacionado al audio, como uno de un {{domxref("AudioNode")}}. Esto puede ser establecido a un valor específico o un cambio de valor, y puede ser agendado para que ocurra en un momento específico y siguiendo un patrón específico.</dd>
+ <dt>{{domxref("AudioParamMap")}}</dt>
+ <dd>Provee una interfaz como para mapear a un grupo de interfaces {{domxref("AudioParam")}}, lo que significa que proporciona los métodos <code>forEach()</code>, <code>get()</code>, <code>has()</code>, <code>keys()</code>, y <code>values()</code>, como también una propiedad <code>size</code>.</dd>
+ <dt>{{domxref("BaseAudioContext")}}</dt>
+ <dd>La interfaz <strong><code>BaseAudioContext</code></strong> actúa como una definición base para procesamiento de gráficos de audio en y fuera de línea, como lo representa {{domxref("AudioContext")}} y {{domxref("OfflineAudioContext")}} resepectivamente. No tendrás que usar <code>BaseAudioContext</code> directamente — tendrás que usar sus características a través de una de éstas dos interfaces heredadas.</dd>
+ <dt>El evento {{event("ended")}}</dt>
+ <dd>El evento <code>ended</code> es lanzado cuando la reproducción se detiene porque se alcanzó el fin del archivo de medio.</dd>
+</dl>
+
+<h3 id="Definiendo_fuentes_de_audio">Definiendo fuentes de audio</h3>
+
+<p>Las interfaces que definen fuentes de audio para usar en la API de Web.</p>
+
+<dl>
+ <dt>{{domxref("AudioScheduledSourceNode")}}</dt>
+ <dd>La interfaz <strong><code>AudioScheduledSourceNode</code></strong> es una interfaz padre para muchos tipos de interfaces de nodos de fuentes de audio. Es un {{domxref("AudioNode")}}.</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("OscillatorNode")}}</dt>
+ <dd>La interfaz <strong><code style="font-size: 14px;">OscillatorNode</code></strong><strong> </strong>representa una forma de onda periódica, como una onda sinusoidal o triangular. Es un módulo de procesamiento de audio {{domxref("AudioNode")}} que causa que se cree una <em>frecuencia</em> de onda determinada.</dd>
+ <dt>{{domxref("AudioBuffer")}}</dt>
+ <dd>La interfaz <strong><code>AudioBuffer</code></strong> representa un recurso de audio corto que reside en la memoria, creado desde un archivo de audio usando el método {{ domxref("AudioContext.decodeAudioData()") }}, o creado con datos sin procesar usando {{ domxref("AudioContext.createBuffer()") }}. Una vez decodificado en esta forma, el audio puede ser colocado en un {{ domxref("AudioBufferSourceNode") }}.</dd>
+ <dt>{{domxref("AudioBufferSourceNode")}}</dt>
+ <dd>La interfaz <strong><code>AudioBufferSourceNode</code></strong> representa una fuente de audio que consiste en una datos de audio en la memoria, almacenada en un {{domxref("AudioBuffer")}}. Es un {{domxref("AudioNode")}} que actúa como una fuente de audio.</dd>
+ <dt>{{domxref("MediaElementAudioSourceNode")}}</dt>
+ <dd>La interfaz <code><strong>MediaElementAudio</strong></code><strong><code>SourceNode</code></strong> representa una fuente de audio que consiste en un elemento {{ htmlelement("audio") }} o {{ htmlelement("video") }} de HTML5. Es un {{domxref("AudioNode")}} que actúa como una fuente de audio.</dd>
+ <dt>{{domxref("MediaStreamAudioSourceNode")}}</dt>
+ <dd>La interfaz <code><strong>MediaStreamAudio</strong></code><strong><code>SourceNode</code></strong> representa una fuente de audio que consiste en un {{domxref("MediaStream")}} de <a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> (como una cámara web, micrófono, o una transmisión siendo enviada a una computadora remota). Es un {{domxref("AudioNode")}} que actúa como una fuente de audio.</dd>
+</dl>
+
+<h3 id="Definiendo_filtros_de_efectos_de_audio">Definiendo filtros de efectos de audio</h3>
+
+<p>Interfaces para definir efectos que quieras aplicar a tus fuentes de audio.</p>
+
+<dl>
+ <dt>{{domxref("BiquadFilterNode")}}</dt>
+ <dd>La interfaz <strong><code>BiquadFilterNode</code></strong><strong> </strong>representa una filtro de bajo orden sencillo. Es un {{domxref("AudioNode")}} que puede representar diferentes tipos de filtros, dispositivos de control de tono, o ecualizadores gráficos. Un <code>BiquadFilterNode</code> siempre tiene exactamente una entrada y una salida.</dd>
+ <dt>{{domxref("ConvolverNode")}}</dt>
+ <dd>La interfaz <code><strong>Convolver</strong></code><strong><code>Node</code></strong><strong> </strong>es un <span style="line-height: 1.5;">{{domxref("AudioNode")}} que realiza una Convolución Lineal en un</span><span style="line-height: 1.5;"> {{domxref("AudioBuffer")}} determinado, y es usado a menudo para lograr un efecto de reverberación</span><span style="line-height: 1.5;">.</span></dd>
+ <dt>{{domxref("DelayNode")}}</dt>
+ <dd>La interfaz <strong><code>DelayNode</code></strong> representa una <a href="http://en.wikipedia.org/wiki/Digital_delay_line" title="http://en.wikipedia.org/wiki/Digital_delay_line">línea de detardo</a>; un módulo de procesamiento de audio de {{domxref("AudioNode")}} que causa un retardo entre la llegada de una entrada de datos y su propagación a la salida.</dd>
+ <dt>{{domxref("DynamicsCompressorNode")}}</dt>
+ <dd>La intefaz <strong><code>DynamicsCompressorNode</code></strong> proporciona un efecto de compresión, que reduce el volumen de las partes más ruidosas de la señal para ayudar a evitar el recorte y la distorsión que pueden ocurrir cuando se reproducen y multiplexan múltiples sonidos a la vez.</dd>
+ <dt>{{domxref("GainNode")}}</dt>
+ <dd>La intefaz <strong><code>GainNode</code></strong><strong> </strong>representa un cambio de volumen. Es un módulo de procesamiento de audio de {{domxref("AudioNode")}} que causa que una <em>ganancia</em> determinada para ser aplicada a la entrada de datos antes de su propacación a la salida.</dd>
+ <dt>{{domxref("WaveShaperNode")}}</dt>
+ <dd>La interfaz <strong><code>WaveShaperNode</code></strong><strong> </strong>representa un la interfaz representa un distorsionador no lineal. Es un {{domxref("AudioNode")}} que usa una curva para aplicar una distorsión en forma de onda a la señal. Además de los obvios efectos de distorsión, a menudo se usa para agregar una sensación cálida a la señal.</dd>
+ <dt>{{domxref("PeriodicWave")}}</dt>
+ <dd>Describe una forma de onda periódica que puede ser usada para dar forma a la salida de un {{ domxref("OscillatorNode") }}.</dd>
+ <dt>{{domxref("IIRFilterNode")}}</dt>
+ <dd>Implementa un filtro de <strong><a class="external external-icon" href="https://en.wikipedia.org/wiki/infinite%20impulse%20response" title="infinite impulse response">respuesta de pulso infinito</a></strong> (IIR) general; este tipo de filtro se puede usar para implementar dispositivos de control de tono y ecualizadores gráficos también.</dd>
+</dl>
+
+<h3 id="Definición_de_destinos_de_audio">Definición de destinos de audio</h3>
+
+<p>Una vez que haya terminado de procesar su audio, estas interfaces definen dónde emitirlo.</p>
+
+<dl>
+ <dt>{{domxref("AudioDestinationNode")}}</dt>
+ <dd>La interfaz <strong><code>AudioDestinationNode</code></strong> representa el destino final de una fuente de audio en contexto determinado — usualmente los altavoces de tu dispositivo.</dd>
+ <dt>{{domxref("MediaStreamAudioDestinationNode")}}</dt>
+ <dd>La interfaz <code><strong>MediaStreamAudio</strong></code><strong><code>DestinationNode</code></strong> representa un destino de audio que consiste en un {{domxref("MediaStream")}} de <a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> con un <code>AudioMediaStreamTrack</code> sencillo, que puede ser usado de una manera similiar a un {{domxref("MediaStream")}} obtenido desde {{ domxref("MediaDevices.getUserMedia", "getUserMedia()") }}. Es un {{domxref("AudioNode")}} que actúa como un destino de audio.</dd>
+</dl>
+
+<h3 id="Análisis_y_visualización_de_datos">Análisis y visualización de datos</h3>
+
+<p>Si quieres extraer el tiempo, frecuencia, y otros datos de tu audio, <code>AnalyserNode</code> es lo que necesitas.</p>
+
+<dl>
+ <dt>{{domxref("AnalyserNode")}}</dt>
+ <dd>La interfaz <strong><code>AnalyserNode</code></strong> representa un nodo capáz de proveer la frecuencia en tiempo real y la información del análisis del dominio de tiempo, para propósitos de análisis y visualización de datos.</dd>
+</dl>
+
+<h3 id="División_y_fusión_de_canales_de_audio">División y fusión de canales de audio</h3>
+
+<p>Para dividir y fusionar canales de audio, deberás usar estas interfaces.</p>
+
+<dl>
+ <dt>{{domxref("ChannelSplitterNode")}}</dt>
+ <dd>La interfaz <code><strong>ChannelSplitterNode</strong></code> separa los diferentes canales de una fuente de audio enn un conjunto de salidas <em>mono</em>.</dd>
+ <dt>{{domxref("ChannelMergerNode")}}</dt>
+ <dd>La interfaz <code><strong>ChannelMergerNode</strong></code> reune las diferentes salidas mono en una sola salida. Cada entrada deberá ser usada para llenar un canal de la salida.</dd>
+</dl>
+
+<h3 id="Espacialización_de_audio">Espacialización de audio</h3>
+
+<p>Estas interfaces te permiten agregar efectos de paneo de especialización de audio a tus fuentes de audio.</p>
+
+<dl>
+ <dt>{{domxref("AudioListener")}}</dt>
+ <dd>La interfaz <strong><code>AudioListener</code></strong><strong> </strong>representa la posición y orientación de la única persona escuchando la escena de audio usada en la espacialización de audio.</dd>
+ <dt>{{domxref("PannerNode")}}</dt>
+ <dd>La interfaz <code><strong>PannerNode</strong></code> representa la posición y comportamiento de una señal de fuente de audio en un espacio 3D, permitiéndote crear efectos de paneo complejos.</dd>
+ <dt>{{domxref("StereoPannerNode")}}</dt>
+ <dd>La interfaz <code><strong>StereoPannerNode</strong></code> representa un nodo de panner estéreo simple que se puede usar para panoramizar un flujo de audio hacia la izquierda o hacia la derecha.</dd>
+</dl>
+
+<h3 id="Proccesamiento_de_audio_en_JavaScript">Proccesamiento de audio en JavaScript</h3>
+
+<p>Usando worklets de audio (pequeñas tareas), puedes definir nodos personalizados de audio escritos en JavaScript o <a href="/en-US/docs/WebAssembly">WebAssembly</a>. Los worklets de audios implementan la interfaz {{domxref("Worklet")}}, una versión ligera de la interfaz {{domxref("Worker")}}. A partir del enero de 2018, los worklets de audio están disponibles en Chrome 64 detrás de un identificador.</p>
+
+<dl>
+ <dt>{{domxref("AudioWorklet")}} {{experimental_inline}}</dt>
+ <dd>La interfaz <code>AudioWorklet</code> está disponible a través de {{domxref("BaseAudioContext.audioWorklet")}} y te permite agregar nuevos móduloss al worklet de audio.</dd>
+ <dt>{{domxref("AudioWorkletNode")}} {{experimental_inline}}</dt>
+ <dd>La intefaz <code>AudioWorkletNode</code> representa un {{domxref("AudioNode")}} que está insertada en un gráfico de audio y puede pasar mensajes a la <code>AudioWorkletProcessor</code>.</dd>
+ <dt>{{domxref("AudioWorkletProcessor")}} {{experimental_inline}}</dt>
+ <dd>La interfaz <code>AudioWorkletProcessor</code> representa código de procesamiento de audio que se ejecuta en un <code>AudioWorkletGlobalScope</code> que genera, procesa, o analiza audio directamente, y puede pasar mensajes al <code>AudioWorkletNode</code>.</dd>
+ <dt>{{domxref("AudioWorkletGlobalScope")}} {{experimental_inline}}</dt>
+ <dd>La interfaz <code>AudioWorkletGlobalScope</code> es un objeto derivado de <code>WorkletGlobalScope</code> que representa un contexto del worker en el que se ejecuta un script de procesamiento de audio; está diseñado para permitir la generación, procesamiento, y análisis de datos de audio directamente usando JavaScript en un hilo worklet.</dd>
+</dl>
+
+<p>Antes de que se definieran los worklets de audio, la API de Web Audio usó  <code>ScriptProcessorNode</code> {{deprecated_inline}} para procesamiento de audio basado en JavaScript. Como el código se ejecuta en el hilo principal, tuvo un mal rendimiento. <code>ScriptProcessorNode</code> se mantiene por razones históricas pero está marcada como obsoleta y será removida en una versión futura de la especificación.</p>
+
+<dl>
+ <dt>{{domxref("ScriptProcessorNode")}} {{deprecated_inline}}</dt>
+ <dd>La interfaz <strong><code>ScriptProcessorNode</code></strong><strong> </strong>permite la generación, procesamiento, o análisis de audio usando JavaScript. Es un módulo de procesamiento de audio {{domxref("AudioNode")}} que está enlazado a dos buffers, uno conteniendo la actual entrada, uno conteniendo la salida. Un evento, implementando la interfaz {{domxref("AudioProcessingEvent")}}, es enviado al objeto cada vez que el buffer de entrada contiene nuevos datos, y el manejador del evento termina cuando ha llenado el buffer de salida con datos.</dd>
+ <dt>{{event("audioprocess")}} (event) {{deprecated_inline}}</dt>
+ <dd>El evento <code>audioprocess</code> es lanzado cuando un buffer de entrada de un {{domxref("ScriptProcessorNode")}} del API del Audio Web está listo para ser procesado.</dd>
+ <dt>{{domxref("AudioProcessingEvent")}} {{deprecated_inline}}</dt>
+ <dd>El evento <code>AudioProcessingEvent</code> del <a href="/en-US/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">API de Audio Web</a> representa los eventos que ocurren cuando un buffer de entrada {{domxref("ScriptProcessorNode")}} está listo para ser procesado.</dd>
+</dl>
+
+<h3 id="Procesamiento_de_audio_offlineen_segundo_plano">Procesamiento de audio offline/en segundo plano</h3>
+
+<p>Es posible procesar/renderizar un gráfico de muy rápidamente en segundo plano — renderizándolo en un {{domxref("AudioBuffer")}} en lugar de hacerlo a los altavoces del equipo — con lo siguiente.</p>
+
+<dl>
+ <dt>{{domxref("OfflineAudioContext")}}</dt>
+ <dd>La interfaz <strong><code>OfflineAudioContext</code></strong> es una interfaz {{domxref("AudioContext")}} representando un gráfico de procesamiento de audio construido a partir de varios {{domxref("AudioNode")}} enlazados juntos. En contraste con un <code>AudioContext</code> estándar, un <code>OfflineAudioContext</code> realmente no procesa el audio sino que lo genera, <em>lo más rápido que puede</em>, en un buffer.</dd>
+ <dt>{{event("complete")}} (event)</dt>
+ <dd>El evento <code>complete</code> es lanzado cuando el renderizado de un {{domxref("OfflineAudioContext")}} está terminado.</dd>
+ <dt>{{domxref("OfflineAudioCompletionEvent")}}</dt>
+ <dd>La interfaz <code>OfflineAudioCompletionEvent</code> representa los eventos que ocurren cuando procesamiento de un {{domxref("OfflineAudioContext")}} is terminado. El evento {{event("complete")}} implementa esta interfaz.</dd>
+</dl>
+
+<h2 id="Example" name="Example">Interfaces obsoletas</h2>
+
+<p>Las siguientes interfaces fueron definidas en versiones antiguas de la especificación del API de Audio Web, pero ahora están obsoletas y han sido reemplazadas por otras interfaces.</p>
+
+<dl>
+ <dt>{{domxref("JavaScriptNode")}}</dt>
+ <dd>Usada para dirigir procesamiento de audio a través de JavaScript. Esta interfaz está obsoleta, y ha sido reemplazada por {{domxref("ScriptProcessorNode")}}.</dd>
+ <dt>{{domxref("WaveTableNode")}}</dt>
+ <dd>Usada para definir una forma de onda periórica. Esta interfaz está obsoleta, y ha sido reemplazada por {{domxref("PeriodicWave")}}.</dd>
+</dl>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<p>Este ejemplo muestra una amplia variedad de funciones del API de Audio Web siendo usadas. Puedes ver este código en acción en la demostración de <a href="https://mdn.github.io/voice-change-o-matic/">Voice-change-o-matic</a> (también revisa el <a href="https://github.com/mdn/voice-change-o-matic">código completo en Github</a>) — este es un demo experimental de juguete cambiador de voz; manten tus parlantes en bajo volumen cuando lo uses ¡Al menos al comenzar!</p>
+
+<p>Las líneas del API de Audio Web están resaltadas; si quieres saber más sobre lo que hacen los diferentes métodos, etc., busca en las páginas de referencia.</p>
+
+<pre class="brush: js; highlight:[1,2,9,10,11,12,36,37,38,39,40,41,62,63,72,114,115,121,123,124,125,147,151]">var audioCtx = new (window.AudioContext || window.webkitAudioContext)(); // definir contexto de audio
+// los navegadores Webkit/blink necesitan prefijo, Safari no funcionará sin window.
+
+var voiceSelect = document.getElementById("voice"); // caja de selección para la selección de opciones de efectos de voz
+var visualSelect = document.getElementById("visual"); // caja<span id="result_box" lang="es"><span class="alt-edited"> de selección para la selección de opciones de visualización de audio</span></span>
+var mute = document.querySelector('.mute'); // botón de silencio
+var drawVisual; // requestAnimationFrame
+
+var analyser = audioCtx.createAnalyser();
+var distortion = audioCtx.createWaveShaper();
+var gainNode = audioCtx.createGain();
+var biquadFilter = audioCtx.createBiquadFilter();
+
+function makeDistortionCurve(amount) { // función para hacer que la forma de curva para distorsión / nodo modificador de onda para usar
+  var k = typeof amount === 'number' ? amount : 50,
+    n_samples = 44100,
+    curve = new Float32Array(n_samples),
+    deg = Math.PI / 180,
+    i = 0,
+    x;
+  for ( ; i &lt; n_samples; ++i ) {
+    x = i * 2 / n_samples - 1;
+    curve[i] = ( 3 + k ) * x * 20 * deg / ( Math.PI + k * Math.abs(x) );
+  }
+  return curve;
+};
+
+navigator.getUserMedia (
+  // restricciones - solo el audio es necesario para esta aplicación
+  {
+    audio: true
+  },
+
+  // Retrollamada de éxito
+  function(stream) {
+    source = audioCtx.createMediaStreamSource(stream);
+    source.connect(analyser);
+    analyser.connect(distortion);
+    distortion.connect(biquadFilter);
+    biquadFilter.connect(gainNode);
+    gainNode.connect(audioCtx.destination); // conectando los diferentes nodos de grafo de audio juntos
+
+    visualize(stream);
+    voiceChange();
+
+  },
+
+  // Retrollamada de error
+  function(err) {
+    console.log('Se produjo el siguiente error gUM: ' + err);
+  }
+);
+
+function visualize(stream) {
+  WIDTH = canvas.width;
+  HEIGHT = canvas.height;
+
+  var visualSetting = visualSelect.value;
+  console.log(visualSetting);
+
+  if(visualSetting == "sinewave") {
+    analyser.fftSize = 2048;
+    var bufferLength = analyser.frequencyBinCount; // la mitad del valor de FFT
+    var dataArray = new Uint8Array(bufferLength); // crear una matriz para almacenar los datos
+
+    canvasCtx.clearRect(0, 0, WIDTH, HEIGHT);
+
+    function draw() {
+
+      drawVisual = requestAnimationFrame(draw);
+
+      analyser.getByteTimeDomainData(dataArray); // obtener datos de forma de onda y ponerlo en la matriz creada arriba
+
+      canvasCtx.fillStyle = 'rgb(200, 200, 200)'; // dibujar onda con canvas
+      canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);
+
+      canvasCtx.lineWidth = 2;
+      canvasCtx.strokeStyle = 'rgb(0, 0, 0)';
+
+      canvasCtx.beginPath();
+
+      var sliceWidth = WIDTH * 1.0 / bufferLength;
+      var x = 0;
+
+      for(var i = 0; i &lt; bufferLength; i++) {
+
+        var v = dataArray[i] / 128.0;
+        var y = v * HEIGHT/2;
+
+        if(i === 0) {
+          canvasCtx.moveTo(x, y);
+        } else {
+          canvasCtx.lineTo(x, y);
+        }
+
+        x += sliceWidth;
+      }
+
+      canvasCtx.lineTo(canvas.width, canvas.height/2);
+      canvasCtx.stroke();
+    };
+
+    draw();
+
+  } else if(visualSetting == "off") {
+    canvasCtx.clearRect(0, 0, WIDTH, HEIGHT);
+    canvasCtx.fillStyle = "red";
+    canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);
+  }
+
+}
+
+function voiceChange() {
+  distortion.curve = new Float32Array;
+  biquadFilter.gain.value = 0; // restablecer los efectos cada vez que se ejecuta la función VoiceChange
+
+  var voiceSetting = voiceSelect.value;
+  console.log(voiceSetting);
+
+  if(voiceSetting == "distortion") {
+    distortion.curve = makeDistortionCurve(400); // aplicar distorsión al sonido usando el nodo waveshaper
+  } else if(voiceSetting == "biquad") {
+    biquadFilter.type = "lowshelf";
+    biquadFilter.frequency.value = 1000;
+    biquadFilter.gain.value = 25; // aplicar el filtro lowshelf a los sonidos usando biquad
+  } else if(voiceSetting == "off") {
+    console.log("Voice settings turned off"); // no hacer nada, ya que se eligió la opción de apagado
+  }
+
+}
+
+// oyentes de eventos para cambiar la visualización y la configuración de voz
+
+visualSelect.onchange = function() {
+  window.cancelAnimationFrame(drawVisual);
+  visualize(stream);
+}
+
+voiceSelect.onchange = function() {
+  voiceChange();
+}
+
+mute.onclick = voiceMute;
+
+function voiceMute() { // alternar para silenciar y activar el sonido
+  if(mute.id == "") {
+    gainNode.gain.value = 0; // ganancia establecida en 0 para silenciar el sonido
+    mute.id = "activated";
+    mute.innerHTML = "Unmute";
+  } else {
+    gainNode.gain.value = 1; // ganancia establecida en 1 para activar el sonido
+    mute.id = "";
+    mute.innerHTML = "Mute";
+  }
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Audio API')}}</td>
+   <td>{{Spec2('Web Audio API')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>14 {{property_prefix("webkit")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>23</td>
+   <td>{{CompatNo}}</td>
+   <td>15 {{property_prefix("webkit")}}<br>
+    22 (unprefixed)</td>
+   <td>6 {{property_prefix("webkit")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>28 {{property_prefix("webkit")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>25</td>
+   <td>1.2</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>6 {{property_prefix("webkit")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="También_ver">También ver</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">Usando el API de Audio Web</a></li>
+ <li><a href="/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API">Visualizaciones con el API de Audio Web</a></li>
+ <li><a href="http://mdn.github.io/voice-change-o-matic/">Voice-change-O-matic example</a></li>
+ <li><a href="http://mdn.github.io/violent-theremin/">Violent Theremin example</a></li>
+ <li><a href="/en-US/docs/Web/API/Web_Audio_API/Web_audio_spatialization_basics">Bases de la espacialización de audio Web</a></li>
+ <li><a href="http://www.html5rocks.com/tutorials/webaudio/positional_audio/" title="http://www.html5rocks.com/tutorials/webaudio/positional_audio/">Mixing Positional Audio and WebGL</a></li>
+ <li><a href="http://www.html5rocks.com/tutorials/webaudio/games/" title="http://www.html5rocks.com/tutorials/webaudio/games/">Developing Game Audio with the Web Audio API</a></li>
+ <li><a href="/en-US/docs/Web/API/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext" title="/en-US/docs/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext">Porting webkitAudioContext code to standards based AudioContext</a></li>
+ <li><a href="https://github.com/bit101/tones">Tonos</a>: Una sencilla librería para reproducción de tonos/notas específicas usando el API de Audio Web.</li>
+ <li><a href="https://github.com/goldfire/howler.js/">howler.js</a>: a JS audio library that defaults to <a href="https://dvcs.w3.org/hg/audio/raw-file/tip/webaudio/specification.html">Web Audio API</a> and falls back to <a href="http://www.whatwg.org/specs/web-apps/current-work/#the-audio-element">HTML5 Audio</a>, as well as providing other useful features.</li>
+ <li><a href="https://github.com/mattlima/mooog">Mooog</a>: jQuery-style chaining of AudioNodes, mixer-style sends/returns, and more.</li>
+ <li><a class="external external-icon" href="https://github.com/chrisjohndigital/OpenLang">OpenLang</a>: HTML5 video language lab web application using the Web Audio API to record and combine video and audio from different sources into a single file (<a class="external external-icon" href="https://github.com/chrisjohndigital/OpenLang">source on GitHub</a>)</li>
+</ul>
+
+<h3 id="Enlaces_rápidos">Enlaces rápidos</h3>
+
+<ol>
+ <li><strong>Guíass</strong>
+
+  <ol>
+   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Basic_concepts_behind_Web_Audio_API">Conceptos básicos detrás del API de Audio Web</a></li>
+   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">Usando el API de Audio Web</a></li>
+   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API">Visualizaciones con el API de Audio Web</a></li>
+   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Web_audio_spatialization_basics">Bases de la espacialización de audio Web</a></li>
+   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext" title="/en-US/docs/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext">Portando código de webkitAudioContext a estándares basados en AudioContext</a></li>
+  </ol>
+ </li>
+ <li><strong>Ejemplos</strong>
+  <ol>
+   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Simple_synth">Teclado sintetizador sencillo</a></li>
+   <li><a href="http://mdn.github.io/voice-change-o-matic/">Voice-change-O-matic</a></li>
+   <li><a href="http://mdn.github.io/violent-theremin/">Violent Theremin</a></li>
+  </ol>
+ </li>
+ <li><strong>Interfaces</strong>
+  <ol>
+   <li>{{domxref("AnalyserNode")}}</li>
+   <li>{{domxref("AudioBuffer")}}</li>
+   <li>{{domxref("AudioScheduledSourceNode")}}</li>
+   <li>{{domxref("AudioBufferSourceNode")}}</li>
+   <li>{{domxref("AudioContext")}}</li>
+   <li>{{domxref("AudioDestinationNode")}}</li>
+   <li>{{domxref("AudioListener")}}</li>
+   <li>{{domxref("AudioNode")}}</li>
+   <li>{{domxref("AudioParam")}}</li>
+   <li>{{event("audioprocess")}} (event)</li>
+   <li>{{domxref("AudioProcessingEvent")}}</li>
+   <li>{{domxref("BiquadFilterNode")}}</li>
+   <li>{{domxref("ChannelMergerNode")}}</li>
+   <li>{{domxref("ChannelSplitterNode")}}</li>
+   <li>{{event("complete")}} (event)</li>
+   <li>{{domxref("ConvolverNode")}}</li>
+   <li>{{domxref("DelayNode")}}</li>
+   <li>{{domxref("DynamicsCompressorNode")}}</li>
+   <li>{{event("ended_(Web_Audio)", "ended")}} (event)</li>
+   <li>{{domxref("GainNode")}}</li>
+   <li>{{domxref("MediaElementAudioSourceNode")}}</li>
+   <li>{{domxref("MediaStreamAudioDestinationNode")}}</li>
+   <li>{{domxref("MediaStreamAudioSourceNode")}}</li>
+   <li>{{domxref("OfflineAudioCompletionEvent")}}</li>
+   <li>{{domxref("OfflineAudioContext")}}</li>
+   <li>{{domxref("OscillatorNode")}}</li>
+   <li>{{domxref("PannerNode")}}</li>
+   <li>{{domxref("PeriodicWave")}}</li>
+   <li>{{domxref("ScriptProcessorNode")}}</li>
+   <li>{{domxref("WaveShaperNode")}}</li>
+  </ol>
+ </li>
+</ol>
diff --git a/files/es/web/api/web_crypto_api/checking_authenticity_with_password/index.html b/files/es/web/api/web_crypto_api/checking_authenticity_with_password/index.html
deleted file mode 100644
index f2e2ef65fd..0000000000
--- a/files/es/web/api/web_crypto_api/checking_authenticity_with_password/index.html
+++ /dev/null
@@ -1,30 +0,0 @@
----
-title: Verificando la autenticidad usando contraseña
-slug: Web/API/Web_Crypto_API/Checking_authenticity_with_password
-translation_of: Web/API/Web_Crypto_API/Checking_authenticity_with_password
----
-<p>{{APIRef("Web Crypto API")}}{{draft}}</p>
-
-<p>La autenticidad del mensaje puede ser verificada usando el API Crypto Web. En este artículo mostrarémos como crear y controlar una firma digital utilizando una contraseña y una función hash.</p>
-
-<p>Un algoritmo HMAC toma una llave y genera un código digerido de la llave y los datos a firmar. Posteriormente, cualquiera con la llave puede volver a generar el mismo código digerido para verificar si los datos han sido alterados.  Además, mediante el conocimiento de una clave secreta, permite almacenar juntos el código digerido y los datos: un atacante no podrá generar un código digerido sobre datos manipulados si no conoce la clave secreta.</p>
-
-<p>Note that this algorithm doesn't carry any information about the person owning the data, nor its unicity: the mere knowledge of the key is enough to alter the data.</p>
-
-<p>Let's assume that the data is stored on the computer. To access it, both for writing and reading, we will use <code>localforage.js</code> a small library wrapping the different storages capabilities of a browser in the same interface. This library is not an essential component of this use case and is used here for convenience, to keep focused on what really matter, the cryptographic part.</p>
-
-<p>The data we want to access is of the form:</p>
-
-<p> </p>
-
-<p>where <code>data</code><em> </em>is the information to guarantee the integrity and <code>signature</code> the information used to verify it.</p>
-
-<p>Cryptographic keys can't be remembered by heart by human, and passwords, or passphrases, make bad, that is unsecure, cryptographic key. To solve this problem, cryptographers have designed algorithms generating cryptographically-sound keys from password. Knowing the password allowed to regenerate the same key and to use it.</p>
-
-<p>We ask the user for a password, and we use it to generate the key:</p>
-
-<pre> </pre>
-
-<p>With that key, we will be able to compute the <em>mac</em> of the data.</p>
-
-<pre> </pre>
diff --git a/files/es/web/api/web_speech_api/using_the_web_speech_api/index.html b/files/es/web/api/web_speech_api/using_the_web_speech_api/index.html
new file mode 100644
index 0000000000..a8ffc88767
--- /dev/null
+++ b/files/es/web/api/web_speech_api/using_the_web_speech_api/index.html
@@ -0,0 +1,302 @@
+---
+title: Uso de la Web Speech API
+slug: Web/API/Web_Speech_API/Using_the_Web_Speech_API
+translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API
+original_slug: Web/API/Web_Speech_API/Uso_de_la_Web_Speech_API
+---
+<p class="summary">La API Web Speech API proporciona dos funcionalidades distintas — reconocimiento de voz, y síntesis de voz (también conocido como texto a voz o tts) — lo que nos ofrece nuevas e interesantes posibilidades para accesibilidad y otros mecanismos. Este artículo ofrece una breve introducción en las dos áreas, así como unas demos.</p>
+
+<h2 id="Reconocimiento_de_voz">Reconocimiento de voz</h2>
+
+<p>El reconocimiento de voz implica recibir voz a través del micrófono de un dispositivo, luego es verificado por un servicio de reconocimiento de voz contra una lista de palabras o frases 'grammar' (esta lista básicamente es el vocabulario a reconocer en una app particular). Cuando se reconoce con éxito una palabra o frase, esta se devuelve como una cadena de texto y así poder iniciar otras acciones.</p>
+
+<p>La API Web Speech tiene una interfaz principal de control para el - {{domxref ("SpeechRecognition")}} -, además de una serie de interfaces estrechamente relacionadas para representar la gramática, los resultados, etc. Normalmente, el sistema de reconocimiento de voz predeterminado que dispone el dispositivo se utilizará para el reconocimiento de voz: la mayoría de los sistemas operativos modernos tienen un sistema de reconocimiento de voz para emitir comandos de voz. Piense en Dictado en macOS, Siri en iOS, Cortana en Windows 10, Android Speech, etc.</p>
+
+<div class="note">
+<p><strong>Note</strong>: En algunos navegadores como Chrome, el uso del reconocimiento de voz implica el uso de un motor de reconocimiento basado en un servidor. Tu audio se envía a un servicio de reconocimiento web para ser procesado, por lo que no funcionará offline.</p>
+</div>
+
+<h3 id="Demo">Demo</h3>
+
+<p>Para mostrar un uso sencillo del reconocimiento de voz Web, hemos escrito una demo llamada <a href="https://github.com/mdn/web-speech-api/tree/master/speech-color-changer">Speech color changer</a>. Cuando se toca o hace click en la pantalla, se puede decir un color HTML, y el color de fondo de la aplicación cambiará a ese color.</p>
+
+<p><img alt="The UI of an app titled Speech Color changer. It invites the user to tap the screen and say a color, and then it turns the background of the app that colour. In this case it has turned the background red." src="https://mdn.mozillademos.org/files/11975/speech-color-changer.png" style="border: 1px solid black; display: block; height: 533px; margin: 0px auto; width: 300px;"></p>
+
+<p>Para ejecutar la demo, se puede clonar (o <a href="https://github.com/mdn/web-speech-api/archive/master.zip">directamente descargar</a>) el repositorio Github donde se encuentra, abrir el fichero index HTML en un navegador de escritorio compatible, o navegar a través del enlace <a href="https://mdn.github.io/web-speech-api/speech-color-changer/">live demo URL</a> en un navegador de móvil compatible como Chrome.</p>
+
+<h3 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h3>
+
+<p>Actualmente, la compatibilidad de la Web Speech API para el reconocimiento de voz se limita a Chrome para escritorio y Android — Chrome tiene soporte desde la versión 33 pero con interfaces 'prefixed', por lo que se deben incluir ese tipo de interfaces 'prefixed', por ejemplo <code>webkitSpeechRecognition</code>.</p>
+
+<h3 id="HTML_y_CSS">HTML y CSS</h3>
+
+<p>El HTML y el CSS para esta app no son importantes. Solo tenemos un título, instrucciones en un párrafo, y un div dentro del cual visualizaremos los mensajes de diagnósticos.</p>
+
+<pre class="brush: html">&lt;h1&gt;Speech color changer&lt;/h1&gt;
+&lt;p&gt;Tap/click then say a color to change the background color of the app.&lt;/p&gt;
+&lt;div&gt;
+  &lt;p class="output"&gt;&lt;em&gt;...diagnostic messages&lt;/em&gt;&lt;/p&gt;
+&lt;/div&gt;</pre>
+
+<p>El CSS proporciona un estilo responsive muy simple para que se visualice bien en todos los dispositivos.</p>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<p>Miremos el JavaScript con un poco más de detalle.</p>
+
+<h4 id="Compatibilidad_con_Chrome">Compatibilidad con Chrome </h4>
+
+<p>Como se ha mencionado anteriormente, Chrome actualmente admite el reconocimiento de voz con propiedades 'prefixed', por lo tanto, al principio de nuestro código incluiremos las siguientes líneas para usar los objetos que correspondan a Chrome, y así cualquier implementación en el futuro pueda admitir estas características sin ningún 'prefixed':</p>
+
+<pre class="brush: js">var SpeechRecognition = SpeechRecognition || webkitSpeechRecognition
+var SpeechGrammarList = SpeechGrammarList || webkitSpeechGrammarList
+var SpeechRecognitionEvent = SpeechRecognitionEvent || webkitSpeechRecognitionEvent</pre>
+
+<h4 id="La_gramática_-grammar-">La gramática -grammar-</h4>
+
+<p>Las siguientes líneas de código definen la gramática que queremos que reconozca nuestra app. Se define una variable para contener nuestra gramática:</p>
+
+<pre class="brush: js">var colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' ... ];
+var grammar = '#JSGF V1.0; grammar colors; public &lt;color&gt; = ' + colors.join(' | ') + ' ;'</pre>
+
+<p>El formato usado para 'grammar' es <a class="external external-icon" href="http://www.w3.org/TR/jsgf/">JSpeech Grammar Format</a> (<strong>JSGF</strong>) — Se puede encontrar más sobre las especificaciones de este formato en el anterior enlace. Sin embargo y por ahora vamos a echarle un vistazo rápidamente:</p>
+
+<ul>
+ <li>Las líneas se separan con punto y coma como en JavaScript.</li>
+ <li>La primera línea — <code>#JSGF V1.0;</code> — establece el formato y versión utilizados. Esto siempre se debe incluir primero.</li>
+ <li>La segunda línea indica el tipo de términos que queremos que se reconozcan. <code>public</code> declara que es una regla pública, la cadena entre los paréntesis angulares definen el nombre reconocido para éste término (<code>color</code>), y la lista de elementos que siguen al signo igual son los valores alternativos que se reconocerán y aceptaran como valores apropiados al término. Observar como cada elemento se separa con el carácter pipe ' | ' .</li>
+ <li>Se pueden definir tantos términos como se desee en líneas separadas siguiendo la estructura anterior, e incluir definiciones gramaticales complejas. Esta demostración básica la mantenemos lo más simple posible.</li>
+</ul>
+
+<h4 id="Conectando_la_gramática_a_nuestro_reconocimiento_de_voz">Conectando la gramática a nuestro reconocimiento de voz</h4>
+
+<p>Lo siguiente que tenemos que hacer es definir una instancia de reconocimiento de voz para el control en nuestra aplicación. Esto se hace usando el constructor {{domxref("SpeechRecognition.SpeechRecognition()", "SpeechRecognition()")}}. También creamos una lista de gramática de voz para contener nuestra gramática usando el constructor {{domxref("SpeechGrammarList.SpeechGrammarList()","SpeechGrammarList()")}}.</p>
+
+<pre class="brush: js">var recognition = new SpeechRecognition();
+var speechRecognitionList = new SpeechGrammarList();</pre>
+
+<p>Añadimos nuestra  <code>grammar</code>  a la lista anterior usando el método {{domxref("SpeechGrammarList.addFromString()")}}. Este método acepta como parámetro la cadena que queremos añadir, así como opcionalmente, un valor que especifique la importancia de esta gramática en relación a otras gramáticas disponibles en la lista (el rango del valor va desde 0 hasta 1 inclusive). La gramática agregada está disponible en la lista como una instancia del objeto {{domxref("SpeechGrammar")}}.</p>
+
+<pre class="brush: js">speechRecognitionList.addFromString(grammar, 1);</pre>
+
+<p>Después añadimos la lista {{domxref("SpeechGrammarList")}} a la instancia del reconocimiento de voz estableciéndola en la propiedad {{domxref("SpeechRecognition.grammars")}}. También establecemos algunas otras propiedades a la instancia de reconocimiento antes de continuar:</p>
+
+<ul>
+ <li>{{domxref("SpeechRecognition.continuous")}}: Controla si se capturan los resultados de forma continua (<code>true</code>), o solo un resultado cada vez que se inicia el reconocimiento (<code>false</code>).</li>
+ <li>{{domxref("SpeechRecognition.lang")}}: Establece el idioma del reconocimiento. Esto es una buena práctica y, por lo tanto, recomendable.</li>
+ <li>{{domxref("SpeechRecognition.interimResults")}}: Define si el sistema de reconocimiento de voz debe devolver resultados provisionales o solo resultados finales. Para nuestra demo es suficiente con los resultados finales.</li>
+ <li>{{domxref("SpeechRecognition.maxAlternatives")}}:  Establece el número de posibles coincidencias alternativas que se deben devolver por resultado. Esto a veces puede ser útil, por ejemplo, si un resultado no está completamente claro y desea mostrar una lista de alternativas para que el usuario elija la correcta. Esta opción no es necesaria para la demo, por lo que solo especificamos una (la cual es la predeterminada).</li>
+</ul>
+
+<pre class="brush: js">recognition.grammars = speechRecognitionList;
+recognition.continuous = false;
+recognition.lang = 'en-US';
+recognition.interimResults = false;
+recognition.maxAlternatives = 1;</pre>
+
+<h4 id="Comenzando_el_reconocimiento_de_voz">Comenzando el reconocimiento de voz</h4>
+
+<p>Tomamos las referencias de la salida {{htmlelement("div")}} y del elemento HTML (para que podamos enviar mensajes de diagnostico y actualizar el color de fondo de la aplicación más adelante), e implementamos un manejador onclick para que cuando se haga click o se toque la pantalla, se inicie el reconocimiento de voz. Esto se logra llamando al método {{domxref("SpeechRecognition.start()")}}. El método <code>forEach()</code> se usa para visualizar indicadores de colores que muestran qué colores intenta decir.</p>
+
+<pre class="brush: js">var diagnostic = document.querySelector('.output');
+var bg = document.querySelector('html');
+var hints = document.querySelector('.hints');
+
+var colorHTML= '';
+colors.forEach(function(v, i, a){
+  console.log(v, i);
+  colorHTML += '&lt;span style="background-color:' + v + ';"&gt; ' + v + ' &lt;/span&gt;';
+});
+hints.innerHTML = 'Tap/click then say a color to change the background color of the app. Try ' + colorHTML + '.';
+
+document.body.onclick = function() {
+  recognition.start();
+  console.log('Ready to receive a color command.');
+}</pre>
+
+<h4 id="Recepción_y_manejo_de_resultados">Recepción y manejo de resultados</h4>
+
+<p>Una vez que comienza el reconocimiento de voz, hay muchos manejadores de eventos que se pueden usar para recuperar los resultados, así como otros elementos de información adicional (ver <a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition#Event_handlers"><code>SpeechRecognition</code> event handlers list</a>.) El más común que probablemente usarás es {{domxref("SpeechRecognition.onresult")}}, el cual es lanzado cuando se recibe el resultado con éxito:</p>
+
+<pre class="brush: js">recognition.onresult = function(event) {
+  var color = event.results[0][0].transcript;
+  diagnostic.textContent = 'Result received: ' + color + '.';
+  bg.style.backgroundColor = color;
+  console.log('Confidence: ' + event.results[0][0].confidence);
+}</pre>
+
+<p>La tercera línea es un poco más compleja, así que vamos a explicarla paso a paso. La propiedad {{domxref("SpeechRecognitionEvent.results")}} devuelve un objeto {{domxref("SpeechRecognitionResultList")}} que contiene los objetos {{domxref("SpeechRecognitionResult")}}. Tiene un getter para que pueda ser accesible como si fuera un array — así el primer <code>[0]</code> devuelve el <code>SpeechRecognitionResult</code> en la posición 0. Cada objeto <code>SpeechRecognitionResult</code> contiene objetos {{domxref("SpeechRecognitionAlternative")}} que contienen palabras individuales reconocidas. Estos también tienen getters para que se puedan acceder a ellos como arrays — por lo tanto el segundo <code>[0]</code> devuelve <code>SpeechRecognitionAlternative</code> en la posición 0. Luego devolvemos su propiedad <code>transcript</code> para obtener una cadena que contenga  el resultado individual reconocido como un string, estableciendo el color de fondo a ese color, e informando del color reconocido como un mensaje de diagnóstico en el IU.</p>
+
+<p>También usamos el manejador {{domxref("SpeechRecognition.onspeechend")}} para parar el servicio de reconocimiento de voz (usando {{domxref("SpeechRecognition.stop()")}}) cuando se ha reconocido una sola palabra y se ha finalizado de hablar:</p>
+
+<pre class="brush: js">recognition.onspeechend = function() {
+  recognition.stop();
+}</pre>
+
+<h4 id="Manejo_de_errores_y_voz_no_reconocida">Manejo de errores y voz no reconocida</h4>
+
+<p>Los dos últimos manejadores son para controlar los casos donde no se reconoce ninguna de las palabras definidas en la gramática, o cuando ocurre un error. {{domxref("SpeechRecognition.onnomatch")}} maneja el primer caso mencionado, pero tenga en cuenta que de momento no parece que se dispare correctamente; solo devuelve lo que ha reconocido:</p>
+
+<pre class="brush: js">recognition.onnomatch = function(event) {
+  diagnostic.textContent = 'I didnt recognise that color.';
+}</pre>
+
+<p>{{domxref("SpeechRecognition.onerror")}} maneja los casos donde se ha producido en error en el reconocimiento  — la propiedad {{domxref("SpeechRecognitionError.error")}} contiene el error devuelto:</p>
+
+<pre class="brush: js">recognition.onerror = function(event) {
+  diagnostic.textContent = 'Error occurred in recognition: ' + event.error;
+}</pre>
+
+<h2 id="Síntesis_de_voz">Síntesis de voz</h2>
+
+<p>La síntesis de voz (también  conocida como texto a voz o tts) implica recibir  contenido en forma de texto dentro de una aplicación y convertirla en voz a través del altavoz del dispositivo o de la conexión de salida del audio.</p>
+
+<p>La Web Speech API tiene una interface principal controladora — {{domxref("SpeechSynthesis")}} — además de una serie de interfaces estrechamente relacionadas para representar  el texto que se va a sintetizar (conocido como dictados 'utterances'), voces que se usarán para los dictados, etc. De nuevo, la mayoría de sistemas operativos disponen de algún sistema de síntesis de voz que pueden serán usados por la API si están disponibles.</p>
+
+<h3 id="Demo_2">Demo</h3>
+
+<p>Para mostrar un uso sencillo de la síntesis de voz Web, tenemos la demo llamada <a href="https://mdn.github.io/web-speech-api/speak-easy-synthesis/">Speak easy synthesis</a>. Esta incluye un juego de controles de formulario para introducir texto a sintetizar, configurar el tono, velocidad de reproducción y la voz a usar cuando el texto sea pronunciado.  Después de introducir el texto se puede presionar <kbd>Enter</kbd>/<kbd>Return</kbd> para escucharlo.</p>
+
+<p><img alt="UI of an app called speak easy synthesis. It has an input field in which to input text to be synthesised, slider controls to change the rate and pitch of the speech, and a drop down menu to choose between different voices." src="https://mdn.mozillademos.org/files/11977/speak-easy-synthesis.png" style="border: 1px solid black; display: block; height: 533px; margin: 0px auto; width: 300px;"></p>
+
+<p>Para ejecutar la demo, se puede clonar (o <a href="https://github.com/mdn/web-speech-api/archive/master.zip">directamente descargar</a>) el repositorio Github donde se encuentra, abrir el fichero index HTML en un navegador de escritorio compatible, o navegar a través del enlace <a href="https://mdn.github.io/web-speech-api/speech-color-changer/">live demo URL</a> en un navegador de móvil compatible como Chrome.</p>
+
+<h3 id="Compatibilidad_de_navegadores_2">Compatibilidad de navegadores</h3>
+
+<p>El soporte para la síntesis de voz Web Speech API solo ha llegado a los navegadores más importantes  y actualmente se limita a los siguientes:</p>
+
+<ul>
+ <li>
+  <p>Firefox para escritorio y dispositivos móviles en Gecko 42+ (Windows)/44+, sin prefijos, y se puede activar configurando el flag <code>media.webspeech.synth.enabled</code> a <code>true</code> en <code>about:config</code>.</p>
+ </li>
+ <li>
+  <p>Firefox OS 2.5+ lo soporta por defecto y sin ser necesario ningún permiso.</p>
+ </li>
+ <li>
+  <p>Chrome para escritorio y  Android tienen soporte desde la versión 33, sin prefijos.</p>
+ </li>
+</ul>
+
+<h3 id="HTML_y_CSS_2">HTML y CSS</h3>
+
+<p>El HTML y CSS de nuevo no son fundamentales, simplemente contiene un titulo, algunas instrucciones de uso y un formulario con algunos controles sencillos. El elemento {{htmlelement("select")}} inicialmente está vacío pero se rellena con {{htmlelement("option")}} mediante JavaScript (ver más adelante.)</p>
+
+<pre class="brush: html">&lt;h1&gt;Speech synthesiser&lt;/h1&gt;
+
+&lt;p&gt;Enter some text in the input below and press return to hear it. change voices using the dropdown menu.&lt;/p&gt;
+
+&lt;form&gt;
+  &lt;input type="text" class="txt"&gt;
+  &lt;div&gt;
+    &lt;label for="rate"&gt;Rate&lt;/label&gt;&lt;input type="range" min="0.5" max="2" value="1" step="0.1" id="rate"&gt;
+    &lt;div class="rate-value"&gt;1&lt;/div&gt;
+    &lt;div class="clearfix"&gt;&lt;/div&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="pitch"&gt;Pitch&lt;/label&gt;&lt;input type="range" min="0" max="2" value="1" step="0.1" id="pitch"&gt;
+    &lt;div class="pitch-value"&gt;1&lt;/div&gt;
+    &lt;div class="clearfix"&gt;&lt;/div&gt;
+  &lt;/div&gt;
+  &lt;select&gt;
+
+  &lt;/select&gt;
+&lt;/form&gt;</pre>
+
+<h3 id="JavaScript_2">JavaScript</h3>
+
+<p>Analicemos el JavaScript usado en esta app.</p>
+
+<h4 id="Configurar_variables">Configurar variables</h4>
+
+<p>En primer lugar, capturamos las referencias de todos los elementos DOM involucrados en la IU, pero lo más importante es capturar una referencia a  {{domxref("Window.speechSynthesis")}}. Este es el punto de entrada a la API — devuelve una instancia a {{domxref("SpeechSynthesis")}}, la interface controladora para la síntesis de voz en la web.</p>
+
+<pre class="brush: js">var synth = window.speechSynthesis;
+
+var inputForm = document.querySelector('form');
+var inputTxt = document.querySelector('.txt');
+var voiceSelect = document.querySelector('select');
+
+var pitch = document.querySelector('#pitch');
+var pitchValue = document.querySelector('.pitch-value');
+var rate = document.querySelector('#rate');
+var rateValue = document.querySelector('.rate-value');
+
+var voices = [];
+</pre>
+
+<h4 id="Rellenar_el_elemento_select">Rellenar el elemento select </h4>
+
+<p>Para rellenar el elemento {{htmlelement("select")}} con las diferentes opciones de voz del que dispone el dispositivo, hemos escrito la función <code>populateVoiceList()</code>. Primero invocamos {{domxref("SpeechSynthesis.getVoices()")}}, que devuelve una lista de todas las voces disponibles representadas por objetos {{domxref("SpeechSynthesisVoice")}}. Después recorremos esa lista — para cada voz creamos un elemento {{htmlelement("option")}}, establecemos su contenido con el nombre de la voz (desde {{domxref("SpeechSynthesisVoice.name")}}), y el lenguaje de la misma (desde {{domxref("SpeechSynthesisVoice.lang")}}), y <code>-- DEFAULT</code> si la voz es la predeterminada para el motor de síntesis (verificando si {{domxref("SpeechSynthesisVoice.default")}} devuelve <code>true</code>.)</p>
+
+<p>Para cada opción también creamos atributos <code>data-</code>, conteniendo el nombre y lenguaje de la voz asociada, para que más tarde podamos usarlos fácilmente, y después añadimos las opciones 'option' como hijos del select.</p>
+
+<pre class="brush: js">function populateVoiceList() {
+  voices = synth.getVoices();
+
+  for(i = 0; i &lt; voices.length ; i++) {
+    var option = document.createElement('option');
+    option.textContent = voices[i].name + ' (' + voices[i].lang + ')';
+
+    if(voices[i].default) {
+      option.textContent += ' -- DEFAULT';
+    }
+
+    option.setAttribute('data-lang', voices[i].lang);
+    option.setAttribute('data-name', voices[i].name);
+    voiceSelect.appendChild(option);
+  }
+}</pre>
+
+<p>Cuando vamos a ejecutar la función hacemos lo siguiente debido a que Firefox no soporta {{domxref("SpeechSynthesis.onvoiceschanged")}}, y sólo devolverá una lista de voces cuando se ejecute {{domxref("SpeechSynthesis.getVoices()")}}. Sin embargo con Chrome solo hay que esperar a que se active el evento antes de rellenar la lista, de ahí la siguiente parte de código.</p>
+
+<pre class="brush: js">populateVoiceList();
+if (speechSynthesis.onvoiceschanged !== undefined) {
+  speechSynthesis.onvoiceschanged = populateVoiceList;
+}</pre>
+
+<h4 id="Reproduciendo_el_texto_introducido">Reproduciendo el texto introducido</h4>
+
+<p>A continuación, creamos un manejador de eventos para comenzar a reproducir el texto introducido en el campo de texto. Usamos un manejador <a href="/en-US/docs/Web/API/GlobalEventHandlers/onsubmit">onsubmit</a> en el formulario para que la acción ocurra cuando se presione <kbd>Enter</kbd>/<kbd>Return</kbd>. Primero creamos una nueva instancia de  {{domxref("SpeechSynthesisUtterance.SpeechSynthesisUtterance()", "SpeechSynthesisUtterance()")}} usando su constructor — a este se le pasa el valor de la entrada de texto como parámetro.</p>
+
+<p>A continuación, debemos obtener la voz que queremos utilizar. Usamos la propiedad {{domxref("HTMLSelectElement")}} <code>selectedOptions</code> para devolver el elemento seleccionado {{htmlelement("option")}}. Entonces usamos el atributo de este elemento <code>data-name</code>, encontrando el objeto {{domxref("SpeechSynthesisVoice")}} cuyo nombre coincida con el valor del atributo. Y configuramos la propiedad de {{domxref("SpeechSynthesisUtterance.voice")}} con el valor que coincida con la opción seleccionada.</p>
+
+<p>Por último, configuramos {{domxref("SpeechSynthesisUtterance.pitch")}} y {{domxref("SpeechSynthesisUtterance.rate")}} con los valores de los elementos del formulario correspondientes. Entonces y ya configurado todo lo necesario, comenzamos la reproducción invocando  {{domxref("SpeechSynthesis.speak()")}}, y pasándolo a la instancia {{domxref("SpeechSynthesisUtterance")}} como parámetro.</p>
+
+<pre class="brush: js">inputForm.onsubmit = function(event) {
+  event.preventDefault();
+
+  var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
+  var selectedOption = voiceSelect.selectedOptions[0].getAttribute('data-name');
+  for(i = 0; i &lt; voices.length ; i++) {
+    if(voices[i].name === selectedOption) {
+      utterThis.voice = voices[i];
+    }
+  }
+  utterThis.pitch = pitch.value;
+  utterThis.rate = rate.value;
+  synth.speak(utterThis);</pre>
+
+<p>Al final del manejador incluimos un manejador {{domxref("SpeechSynthesisUtterance.onpause")}} para mostrar cómo usar {{domxref("SpeechSynthesisEvent")}}. Cuando se invoca a  {{domxref("SpeechSynthesis.pause()")}},este devuelve un mensaje informando del número y nombre del carácter en el que se detuvo la reproducción.</p>
+
+<pre class="brush: js">   utterThis.onpause = function(event) {
+    var char = event.utterance.text.charAt(event.charIndex);
+    console.log('Speech paused at character ' + event.charIndex + ' of "' +
+    event.utterance.text + '", which is "' + char + '".');
+  }</pre>
+
+<p>Por último, llamamos a <a href="/en-US/docs/Web/API/HTMLElement/blur">blur()</a> en la entrada de texto. Esto permite ocultar la entrada de texto en Firefox OS.</p>
+
+<pre class="brush: js">  inputTxt.blur();
+}</pre>
+
+<h4 id="Actualizando_los_valores_de_tono_y_velocidad_mostrados">Actualizando los valores de tono y velocidad mostrados</h4>
+
+<p>La última parte del código simplemente actualiza los valores <code>pitch</code>/<code>rate</code> mostrados en la IU, cada vez que el slider cambia de posición.</p>
+
+<pre class="brush: js">pitch.onchange = function() {
+  pitchValue.textContent = pitch.value;
+}
+
+rate.onchange = function() {
+  rateValue.textContent = rate.value;
+}</pre>
diff --git a/files/es/web/api/web_speech_api/uso_de_la_web_speech_api/index.html b/files/es/web/api/web_speech_api/uso_de_la_web_speech_api/index.html
deleted file mode 100644
index 407de0e10d..0000000000
--- a/files/es/web/api/web_speech_api/uso_de_la_web_speech_api/index.html
+++ /dev/null
@@ -1,301 +0,0 @@
----
-title: Uso de la Web Speech API
-slug: Web/API/Web_Speech_API/Uso_de_la_Web_Speech_API
-translation_of: Web/API/Web_Speech_API/Using_the_Web_Speech_API
----
-<p class="summary">La API Web Speech API proporciona dos funcionalidades distintas — reconocimiento de voz, y síntesis de voz (también conocido como texto a voz o tts) — lo que nos ofrece nuevas e interesantes posibilidades para accesibilidad y otros mecanismos. Este artículo ofrece una breve introducción en las dos áreas, así como unas demos.</p>
-
-<h2 id="Reconocimiento_de_voz">Reconocimiento de voz</h2>
-
-<p>El reconocimiento de voz implica recibir voz a través del micrófono de un dispositivo, luego es verificado por un servicio de reconocimiento de voz contra una lista de palabras o frases 'grammar' (esta lista básicamente es el vocabulario a reconocer en una app particular). Cuando se reconoce con éxito una palabra o frase, esta se devuelve como una cadena de texto y así poder iniciar otras acciones.</p>
-
-<p>La API Web Speech tiene una interfaz principal de control para el - {{domxref ("SpeechRecognition")}} -, además de una serie de interfaces estrechamente relacionadas para representar la gramática, los resultados, etc. Normalmente, el sistema de reconocimiento de voz predeterminado que dispone el dispositivo se utilizará para el reconocimiento de voz: la mayoría de los sistemas operativos modernos tienen un sistema de reconocimiento de voz para emitir comandos de voz. Piense en Dictado en macOS, Siri en iOS, Cortana en Windows 10, Android Speech, etc.</p>
-
-<div class="note">
-<p><strong>Note</strong>: En algunos navegadores como Chrome, el uso del reconocimiento de voz implica el uso de un motor de reconocimiento basado en un servidor. Tu audio se envía a un servicio de reconocimiento web para ser procesado, por lo que no funcionará offline.</p>
-</div>
-
-<h3 id="Demo">Demo</h3>
-
-<p>Para mostrar un uso sencillo del reconocimiento de voz Web, hemos escrito una demo llamada <a href="https://github.com/mdn/web-speech-api/tree/master/speech-color-changer">Speech color changer</a>. Cuando se toca o hace click en la pantalla, se puede decir un color HTML, y el color de fondo de la aplicación cambiará a ese color.</p>
-
-<p><img alt="The UI of an app titled Speech Color changer. It invites the user to tap the screen and say a color, and then it turns the background of the app that colour. In this case it has turned the background red." src="https://mdn.mozillademos.org/files/11975/speech-color-changer.png" style="border: 1px solid black; display: block; height: 533px; margin: 0px auto; width: 300px;"></p>
-
-<p>Para ejecutar la demo, se puede clonar (o <a href="https://github.com/mdn/web-speech-api/archive/master.zip">directamente descargar</a>) el repositorio Github donde se encuentra, abrir el fichero index HTML en un navegador de escritorio compatible, o navegar a través del enlace <a href="https://mdn.github.io/web-speech-api/speech-color-changer/">live demo URL</a> en un navegador de móvil compatible como Chrome.</p>
-
-<h3 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h3>
-
-<p>Actualmente, la compatibilidad de la Web Speech API para el reconocimiento de voz se limita a Chrome para escritorio y Android — Chrome tiene soporte desde la versión 33 pero con interfaces 'prefixed', por lo que se deben incluir ese tipo de interfaces 'prefixed', por ejemplo <code>webkitSpeechRecognition</code>.</p>
-
-<h3 id="HTML_y_CSS">HTML y CSS</h3>
-
-<p>El HTML y el CSS para esta app no son importantes. Solo tenemos un título, instrucciones en un párrafo, y un div dentro del cual visualizaremos los mensajes de diagnósticos.</p>
-
-<pre class="brush: html">&lt;h1&gt;Speech color changer&lt;/h1&gt;
-&lt;p&gt;Tap/click then say a color to change the background color of the app.&lt;/p&gt;
-&lt;div&gt;
-  &lt;p class="output"&gt;&lt;em&gt;...diagnostic messages&lt;/em&gt;&lt;/p&gt;
-&lt;/div&gt;</pre>
-
-<p>El CSS proporciona un estilo responsive muy simple para que se visualice bien en todos los dispositivos.</p>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<p>Miremos el JavaScript con un poco más de detalle.</p>
-
-<h4 id="Compatibilidad_con_Chrome">Compatibilidad con Chrome </h4>
-
-<p>Como se ha mencionado anteriormente, Chrome actualmente admite el reconocimiento de voz con propiedades 'prefixed', por lo tanto, al principio de nuestro código incluiremos las siguientes líneas para usar los objetos que correspondan a Chrome, y así cualquier implementación en el futuro pueda admitir estas características sin ningún 'prefixed':</p>
-
-<pre class="brush: js">var SpeechRecognition = SpeechRecognition || webkitSpeechRecognition
-var SpeechGrammarList = SpeechGrammarList || webkitSpeechGrammarList
-var SpeechRecognitionEvent = SpeechRecognitionEvent || webkitSpeechRecognitionEvent</pre>
-
-<h4 id="La_gramática_-grammar-">La gramática -grammar-</h4>
-
-<p>Las siguientes líneas de código definen la gramática que queremos que reconozca nuestra app. Se define una variable para contener nuestra gramática:</p>
-
-<pre class="brush: js">var colors = [ 'aqua' , 'azure' , 'beige', 'bisque', 'black', 'blue', 'brown', 'chocolate', 'coral' ... ];
-var grammar = '#JSGF V1.0; grammar colors; public &lt;color&gt; = ' + colors.join(' | ') + ' ;'</pre>
-
-<p>El formato usado para 'grammar' es <a class="external external-icon" href="http://www.w3.org/TR/jsgf/">JSpeech Grammar Format</a> (<strong>JSGF</strong>) — Se puede encontrar más sobre las especificaciones de este formato en el anterior enlace. Sin embargo y por ahora vamos a echarle un vistazo rápidamente:</p>
-
-<ul>
- <li>Las líneas se separan con punto y coma como en JavaScript.</li>
- <li>La primera línea — <code>#JSGF V1.0;</code> — establece el formato y versión utilizados. Esto siempre se debe incluir primero.</li>
- <li>La segunda línea indica el tipo de términos que queremos que se reconozcan. <code>public</code> declara que es una regla pública, la cadena entre los paréntesis angulares definen el nombre reconocido para éste término (<code>color</code>), y la lista de elementos que siguen al signo igual son los valores alternativos que se reconocerán y aceptaran como valores apropiados al término. Observar como cada elemento se separa con el carácter pipe ' | ' .</li>
- <li>Se pueden definir tantos términos como se desee en líneas separadas siguiendo la estructura anterior, e incluir definiciones gramaticales complejas. Esta demostración básica la mantenemos lo más simple posible.</li>
-</ul>
-
-<h4 id="Conectando_la_gramática_a_nuestro_reconocimiento_de_voz">Conectando la gramática a nuestro reconocimiento de voz</h4>
-
-<p>Lo siguiente que tenemos que hacer es definir una instancia de reconocimiento de voz para el control en nuestra aplicación. Esto se hace usando el constructor {{domxref("SpeechRecognition.SpeechRecognition()", "SpeechRecognition()")}}. También creamos una lista de gramática de voz para contener nuestra gramática usando el constructor {{domxref("SpeechGrammarList.SpeechGrammarList()","SpeechGrammarList()")}}.</p>
-
-<pre class="brush: js">var recognition = new SpeechRecognition();
-var speechRecognitionList = new SpeechGrammarList();</pre>
-
-<p>Añadimos nuestra  <code>grammar</code>  a la lista anterior usando el método {{domxref("SpeechGrammarList.addFromString()")}}. Este método acepta como parámetro la cadena que queremos añadir, así como opcionalmente, un valor que especifique la importancia de esta gramática en relación a otras gramáticas disponibles en la lista (el rango del valor va desde 0 hasta 1 inclusive). La gramática agregada está disponible en la lista como una instancia del objeto {{domxref("SpeechGrammar")}}.</p>
-
-<pre class="brush: js">speechRecognitionList.addFromString(grammar, 1);</pre>
-
-<p>Después añadimos la lista {{domxref("SpeechGrammarList")}} a la instancia del reconocimiento de voz estableciéndola en la propiedad {{domxref("SpeechRecognition.grammars")}}. También establecemos algunas otras propiedades a la instancia de reconocimiento antes de continuar:</p>
-
-<ul>
- <li>{{domxref("SpeechRecognition.continuous")}}: Controla si se capturan los resultados de forma continua (<code>true</code>), o solo un resultado cada vez que se inicia el reconocimiento (<code>false</code>).</li>
- <li>{{domxref("SpeechRecognition.lang")}}: Establece el idioma del reconocimiento. Esto es una buena práctica y, por lo tanto, recomendable.</li>
- <li>{{domxref("SpeechRecognition.interimResults")}}: Define si el sistema de reconocimiento de voz debe devolver resultados provisionales o solo resultados finales. Para nuestra demo es suficiente con los resultados finales.</li>
- <li>{{domxref("SpeechRecognition.maxAlternatives")}}:  Establece el número de posibles coincidencias alternativas que se deben devolver por resultado. Esto a veces puede ser útil, por ejemplo, si un resultado no está completamente claro y desea mostrar una lista de alternativas para que el usuario elija la correcta. Esta opción no es necesaria para la demo, por lo que solo especificamos una (la cual es la predeterminada).</li>
-</ul>
-
-<pre class="brush: js">recognition.grammars = speechRecognitionList;
-recognition.continuous = false;
-recognition.lang = 'en-US';
-recognition.interimResults = false;
-recognition.maxAlternatives = 1;</pre>
-
-<h4 id="Comenzando_el_reconocimiento_de_voz">Comenzando el reconocimiento de voz</h4>
-
-<p>Tomamos las referencias de la salida {{htmlelement("div")}} y del elemento HTML (para que podamos enviar mensajes de diagnostico y actualizar el color de fondo de la aplicación más adelante), e implementamos un manejador onclick para que cuando se haga click o se toque la pantalla, se inicie el reconocimiento de voz. Esto se logra llamando al método {{domxref("SpeechRecognition.start()")}}. El método <code>forEach()</code> se usa para visualizar indicadores de colores que muestran qué colores intenta decir.</p>
-
-<pre class="brush: js">var diagnostic = document.querySelector('.output');
-var bg = document.querySelector('html');
-var hints = document.querySelector('.hints');
-
-var colorHTML= '';
-colors.forEach(function(v, i, a){
-  console.log(v, i);
-  colorHTML += '&lt;span style="background-color:' + v + ';"&gt; ' + v + ' &lt;/span&gt;';
-});
-hints.innerHTML = 'Tap/click then say a color to change the background color of the app. Try ' + colorHTML + '.';
-
-document.body.onclick = function() {
-  recognition.start();
-  console.log('Ready to receive a color command.');
-}</pre>
-
-<h4 id="Recepción_y_manejo_de_resultados">Recepción y manejo de resultados</h4>
-
-<p>Una vez que comienza el reconocimiento de voz, hay muchos manejadores de eventos que se pueden usar para recuperar los resultados, así como otros elementos de información adicional (ver <a href="https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition#Event_handlers"><code>SpeechRecognition</code> event handlers list</a>.) El más común que probablemente usarás es {{domxref("SpeechRecognition.onresult")}}, el cual es lanzado cuando se recibe el resultado con éxito:</p>
-
-<pre class="brush: js">recognition.onresult = function(event) {
-  var color = event.results[0][0].transcript;
-  diagnostic.textContent = 'Result received: ' + color + '.';
-  bg.style.backgroundColor = color;
-  console.log('Confidence: ' + event.results[0][0].confidence);
-}</pre>
-
-<p>La tercera línea es un poco más compleja, así que vamos a explicarla paso a paso. La propiedad {{domxref("SpeechRecognitionEvent.results")}} devuelve un objeto {{domxref("SpeechRecognitionResultList")}} que contiene los objetos {{domxref("SpeechRecognitionResult")}}. Tiene un getter para que pueda ser accesible como si fuera un array — así el primer <code>[0]</code> devuelve el <code>SpeechRecognitionResult</code> en la posición 0. Cada objeto <code>SpeechRecognitionResult</code> contiene objetos {{domxref("SpeechRecognitionAlternative")}} que contienen palabras individuales reconocidas. Estos también tienen getters para que se puedan acceder a ellos como arrays — por lo tanto el segundo <code>[0]</code> devuelve <code>SpeechRecognitionAlternative</code> en la posición 0. Luego devolvemos su propiedad <code>transcript</code> para obtener una cadena que contenga  el resultado individual reconocido como un string, estableciendo el color de fondo a ese color, e informando del color reconocido como un mensaje de diagnóstico en el IU.</p>
-
-<p>También usamos el manejador {{domxref("SpeechRecognition.onspeechend")}} para parar el servicio de reconocimiento de voz (usando {{domxref("SpeechRecognition.stop()")}}) cuando se ha reconocido una sola palabra y se ha finalizado de hablar:</p>
-
-<pre class="brush: js">recognition.onspeechend = function() {
-  recognition.stop();
-}</pre>
-
-<h4 id="Manejo_de_errores_y_voz_no_reconocida">Manejo de errores y voz no reconocida</h4>
-
-<p>Los dos últimos manejadores son para controlar los casos donde no se reconoce ninguna de las palabras definidas en la gramática, o cuando ocurre un error. {{domxref("SpeechRecognition.onnomatch")}} maneja el primer caso mencionado, pero tenga en cuenta que de momento no parece que se dispare correctamente; solo devuelve lo que ha reconocido:</p>
-
-<pre class="brush: js">recognition.onnomatch = function(event) {
-  diagnostic.textContent = 'I didnt recognise that color.';
-}</pre>
-
-<p>{{domxref("SpeechRecognition.onerror")}} maneja los casos donde se ha producido en error en el reconocimiento  — la propiedad {{domxref("SpeechRecognitionError.error")}} contiene el error devuelto:</p>
-
-<pre class="brush: js">recognition.onerror = function(event) {
-  diagnostic.textContent = 'Error occurred in recognition: ' + event.error;
-}</pre>
-
-<h2 id="Síntesis_de_voz">Síntesis de voz</h2>
-
-<p>La síntesis de voz (también  conocida como texto a voz o tts) implica recibir  contenido en forma de texto dentro de una aplicación y convertirla en voz a través del altavoz del dispositivo o de la conexión de salida del audio.</p>
-
-<p>La Web Speech API tiene una interface principal controladora — {{domxref("SpeechSynthesis")}} — además de una serie de interfaces estrechamente relacionadas para representar  el texto que se va a sintetizar (conocido como dictados 'utterances'), voces que se usarán para los dictados, etc. De nuevo, la mayoría de sistemas operativos disponen de algún sistema de síntesis de voz que pueden serán usados por la API si están disponibles.</p>
-
-<h3 id="Demo_2">Demo</h3>
-
-<p>Para mostrar un uso sencillo de la síntesis de voz Web, tenemos la demo llamada <a href="https://mdn.github.io/web-speech-api/speak-easy-synthesis/">Speak easy synthesis</a>. Esta incluye un juego de controles de formulario para introducir texto a sintetizar, configurar el tono, velocidad de reproducción y la voz a usar cuando el texto sea pronunciado.  Después de introducir el texto se puede presionar <kbd>Enter</kbd>/<kbd>Return</kbd> para escucharlo.</p>
-
-<p><img alt="UI of an app called speak easy synthesis. It has an input field in which to input text to be synthesised, slider controls to change the rate and pitch of the speech, and a drop down menu to choose between different voices." src="https://mdn.mozillademos.org/files/11977/speak-easy-synthesis.png" style="border: 1px solid black; display: block; height: 533px; margin: 0px auto; width: 300px;"></p>
-
-<p>Para ejecutar la demo, se puede clonar (o <a href="https://github.com/mdn/web-speech-api/archive/master.zip">directamente descargar</a>) el repositorio Github donde se encuentra, abrir el fichero index HTML en un navegador de escritorio compatible, o navegar a través del enlace <a href="https://mdn.github.io/web-speech-api/speech-color-changer/">live demo URL</a> en un navegador de móvil compatible como Chrome.</p>
-
-<h3 id="Compatibilidad_de_navegadores_2">Compatibilidad de navegadores</h3>
-
-<p>El soporte para la síntesis de voz Web Speech API solo ha llegado a los navegadores más importantes  y actualmente se limita a los siguientes:</p>
-
-<ul>
- <li>
-  <p>Firefox para escritorio y dispositivos móviles en Gecko 42+ (Windows)/44+, sin prefijos, y se puede activar configurando el flag <code>media.webspeech.synth.enabled</code> a <code>true</code> en <code>about:config</code>.</p>
- </li>
- <li>
-  <p>Firefox OS 2.5+ lo soporta por defecto y sin ser necesario ningún permiso.</p>
- </li>
- <li>
-  <p>Chrome para escritorio y  Android tienen soporte desde la versión 33, sin prefijos.</p>
- </li>
-</ul>
-
-<h3 id="HTML_y_CSS_2">HTML y CSS</h3>
-
-<p>El HTML y CSS de nuevo no son fundamentales, simplemente contiene un titulo, algunas instrucciones de uso y un formulario con algunos controles sencillos. El elemento {{htmlelement("select")}} inicialmente está vacío pero se rellena con {{htmlelement("option")}} mediante JavaScript (ver más adelante.)</p>
-
-<pre class="brush: html">&lt;h1&gt;Speech synthesiser&lt;/h1&gt;
-
-&lt;p&gt;Enter some text in the input below and press return to hear it. change voices using the dropdown menu.&lt;/p&gt;
-
-&lt;form&gt;
-  &lt;input type="text" class="txt"&gt;
-  &lt;div&gt;
-    &lt;label for="rate"&gt;Rate&lt;/label&gt;&lt;input type="range" min="0.5" max="2" value="1" step="0.1" id="rate"&gt;
-    &lt;div class="rate-value"&gt;1&lt;/div&gt;
-    &lt;div class="clearfix"&gt;&lt;/div&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="pitch"&gt;Pitch&lt;/label&gt;&lt;input type="range" min="0" max="2" value="1" step="0.1" id="pitch"&gt;
-    &lt;div class="pitch-value"&gt;1&lt;/div&gt;
-    &lt;div class="clearfix"&gt;&lt;/div&gt;
-  &lt;/div&gt;
-  &lt;select&gt;
-
-  &lt;/select&gt;
-&lt;/form&gt;</pre>
-
-<h3 id="JavaScript_2">JavaScript</h3>
-
-<p>Analicemos el JavaScript usado en esta app.</p>
-
-<h4 id="Configurar_variables">Configurar variables</h4>
-
-<p>En primer lugar, capturamos las referencias de todos los elementos DOM involucrados en la IU, pero lo más importante es capturar una referencia a  {{domxref("Window.speechSynthesis")}}. Este es el punto de entrada a la API — devuelve una instancia a {{domxref("SpeechSynthesis")}}, la interface controladora para la síntesis de voz en la web.</p>
-
-<pre class="brush: js">var synth = window.speechSynthesis;
-
-var inputForm = document.querySelector('form');
-var inputTxt = document.querySelector('.txt');
-var voiceSelect = document.querySelector('select');
-
-var pitch = document.querySelector('#pitch');
-var pitchValue = document.querySelector('.pitch-value');
-var rate = document.querySelector('#rate');
-var rateValue = document.querySelector('.rate-value');
-
-var voices = [];
-</pre>
-
-<h4 id="Rellenar_el_elemento_select">Rellenar el elemento select </h4>
-
-<p>Para rellenar el elemento {{htmlelement("select")}} con las diferentes opciones de voz del que dispone el dispositivo, hemos escrito la función <code>populateVoiceList()</code>. Primero invocamos {{domxref("SpeechSynthesis.getVoices()")}}, que devuelve una lista de todas las voces disponibles representadas por objetos {{domxref("SpeechSynthesisVoice")}}. Después recorremos esa lista — para cada voz creamos un elemento {{htmlelement("option")}}, establecemos su contenido con el nombre de la voz (desde {{domxref("SpeechSynthesisVoice.name")}}), y el lenguaje de la misma (desde {{domxref("SpeechSynthesisVoice.lang")}}), y <code>-- DEFAULT</code> si la voz es la predeterminada para el motor de síntesis (verificando si {{domxref("SpeechSynthesisVoice.default")}} devuelve <code>true</code>.)</p>
-
-<p>Para cada opción también creamos atributos <code>data-</code>, conteniendo el nombre y lenguaje de la voz asociada, para que más tarde podamos usarlos fácilmente, y después añadimos las opciones 'option' como hijos del select.</p>
-
-<pre class="brush: js">function populateVoiceList() {
-  voices = synth.getVoices();
-
-  for(i = 0; i &lt; voices.length ; i++) {
-    var option = document.createElement('option');
-    option.textContent = voices[i].name + ' (' + voices[i].lang + ')';
-
-    if(voices[i].default) {
-      option.textContent += ' -- DEFAULT';
-    }
-
-    option.setAttribute('data-lang', voices[i].lang);
-    option.setAttribute('data-name', voices[i].name);
-    voiceSelect.appendChild(option);
-  }
-}</pre>
-
-<p>Cuando vamos a ejecutar la función hacemos lo siguiente debido a que Firefox no soporta {{domxref("SpeechSynthesis.onvoiceschanged")}}, y sólo devolverá una lista de voces cuando se ejecute {{domxref("SpeechSynthesis.getVoices()")}}. Sin embargo con Chrome solo hay que esperar a que se active el evento antes de rellenar la lista, de ahí la siguiente parte de código.</p>
-
-<pre class="brush: js">populateVoiceList();
-if (speechSynthesis.onvoiceschanged !== undefined) {
-  speechSynthesis.onvoiceschanged = populateVoiceList;
-}</pre>
-
-<h4 id="Reproduciendo_el_texto_introducido">Reproduciendo el texto introducido</h4>
-
-<p>A continuación, creamos un manejador de eventos para comenzar a reproducir el texto introducido en el campo de texto. Usamos un manejador <a href="/en-US/docs/Web/API/GlobalEventHandlers/onsubmit">onsubmit</a> en el formulario para que la acción ocurra cuando se presione <kbd>Enter</kbd>/<kbd>Return</kbd>. Primero creamos una nueva instancia de  {{domxref("SpeechSynthesisUtterance.SpeechSynthesisUtterance()", "SpeechSynthesisUtterance()")}} usando su constructor — a este se le pasa el valor de la entrada de texto como parámetro.</p>
-
-<p>A continuación, debemos obtener la voz que queremos utilizar. Usamos la propiedad {{domxref("HTMLSelectElement")}} <code>selectedOptions</code> para devolver el elemento seleccionado {{htmlelement("option")}}. Entonces usamos el atributo de este elemento <code>data-name</code>, encontrando el objeto {{domxref("SpeechSynthesisVoice")}} cuyo nombre coincida con el valor del atributo. Y configuramos la propiedad de {{domxref("SpeechSynthesisUtterance.voice")}} con el valor que coincida con la opción seleccionada.</p>
-
-<p>Por último, configuramos {{domxref("SpeechSynthesisUtterance.pitch")}} y {{domxref("SpeechSynthesisUtterance.rate")}} con los valores de los elementos del formulario correspondientes. Entonces y ya configurado todo lo necesario, comenzamos la reproducción invocando  {{domxref("SpeechSynthesis.speak()")}}, y pasándolo a la instancia {{domxref("SpeechSynthesisUtterance")}} como parámetro.</p>
-
-<pre class="brush: js">inputForm.onsubmit = function(event) {
-  event.preventDefault();
-
-  var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
-  var selectedOption = voiceSelect.selectedOptions[0].getAttribute('data-name');
-  for(i = 0; i &lt; voices.length ; i++) {
-    if(voices[i].name === selectedOption) {
-      utterThis.voice = voices[i];
-    }
-  }
-  utterThis.pitch = pitch.value;
-  utterThis.rate = rate.value;
-  synth.speak(utterThis);</pre>
-
-<p>Al final del manejador incluimos un manejador {{domxref("SpeechSynthesisUtterance.onpause")}} para mostrar cómo usar {{domxref("SpeechSynthesisEvent")}}. Cuando se invoca a  {{domxref("SpeechSynthesis.pause()")}},este devuelve un mensaje informando del número y nombre del carácter en el que se detuvo la reproducción.</p>
-
-<pre class="brush: js">   utterThis.onpause = function(event) {
-    var char = event.utterance.text.charAt(event.charIndex);
-    console.log('Speech paused at character ' + event.charIndex + ' of "' +
-    event.utterance.text + '", which is "' + char + '".');
-  }</pre>
-
-<p>Por último, llamamos a <a href="/en-US/docs/Web/API/HTMLElement/blur">blur()</a> en la entrada de texto. Esto permite ocultar la entrada de texto en Firefox OS.</p>
-
-<pre class="brush: js">  inputTxt.blur();
-}</pre>
-
-<h4 id="Actualizando_los_valores_de_tono_y_velocidad_mostrados">Actualizando los valores de tono y velocidad mostrados</h4>
-
-<p>La última parte del código simplemente actualiza los valores <code>pitch</code>/<code>rate</code> mostrados en la IU, cada vez que el slider cambia de posición.</p>
-
-<pre class="brush: js">pitch.onchange = function() {
-  pitchValue.textContent = pitch.value;
-}
-
-rate.onchange = function() {
-  rateValue.textContent = rate.value;
-}</pre>
diff --git a/files/es/web/api/web_storage_api/index.html b/files/es/web/api/web_storage_api/index.html
new file mode 100644
index 0000000000..241ca9faf5
--- /dev/null
+++ b/files/es/web/api/web_storage_api/index.html
@@ -0,0 +1,147 @@
+---
+title: API de almacenamiento web
+slug: Web/API/Web_Storage_API
+tags:
+  - API
+  - API de almacenamiento web
+  - Almacenamiento web
+  - Storage
+  - localStorage
+  - sessionStorage
+translation_of: Web/API/Web_Storage_API
+original_slug: Web/API/API_de_almacenamiento_web
+---
+<p>{{DefaultAPISidebar("Web Storage API")}}</p>
+
+<p>La <strong>API de almacenamiento web</strong> proporciona los mecanismos mediante los cuales el navegador puede almacenar información de tipo clave/valor, de una forma mucho más intuitiva que utilizando cookies.</p>
+
+<h2 id="Almacenamiento_web_conceptos_y_uso"><strong>Almacenamiento web, conceptos y uso</strong></h2>
+
+<p>Los dos mecanismos en el almacenamiento web son los siguientes:</p>
+
+<ul>
+ <li><strong><code>sessionStorage</code> </strong>mantiene un área de almacenamiento separada para cada origen que está disponible mientras dure la sesión de la página (mientras el navegador esté abierto, incluyendo recargas de página y restablecimientos).</li>
+ <li><strong><code>localStorage</code> </strong>hace lo mismo, pero persiste incluso cuando el navegador se cierre y se reabra.</li>
+</ul>
+
+<p>Estos mecanismos están disponibles mediante las propiedades <a href="https://developer.mozilla.org/es/docs/Web/API/Window/sessionStorage" title="La propiedad sessionStorage permite acceder a un objeto Storage asociado a la sesión actual. La propiedad sessionStorage es similar a localStorage, la única diferencia es que la información almacenada en localStorage no posee tiempo de expiración, por el contrario la información almacenada en sessionStorage es eliminada al finalizar la sesion de la página. La sesión de la página perdura mientras el navegador se encuentra abierto, y se mantiene por sobre las recargas y reaperturas de la página. Abrir una página en una nueva pestaña o ventana iniciará una nueva sesión, lo que difiere en la forma en que trabajan las cookies de sesión."><code>Window.sessionStorage</code></a> y  <a href="https://developer.mozilla.org/es/docs/Web/API/Window/localStorage" title="La propiedad localStorage te permite acceder al objeto local Storage. localStorage es similar a sessionStorage. La única diferencia es que, mientras los datos almacenados en localStorage no tienen fecha de expiración, los datos almacenados en sessionStorage son eliminados cuando finaliza la sesion de navegación - lo cual ocurre cuando se cierra el navegador."><code>Window.localStorage</code></a> (dicho con más precisión, en navegadores con soporte, el objeto <code>Window</code> implementa los objetos  <code>WindowLocalStorage</code> y <code>WindowSessionStorage</code>, en los cuales se basan las propiedades <code>localStorage</code> y <code>sessionStorage</code>). Al invocar uno de éstos, se creará una instancia del objeto <a href="https://developer.mozilla.org/es/docs/Web/API/Storage" title="La interfaz Storage de la API de almacenamiento web provee acceso al almacenamiento de la sesión o al almacenamiento local para un dominio en particular, permitiéndote por ejemplo añadir, modificar o eliminar elementos de dato almacenados."><code>Storage</code></a>, a través del cual los datos pueden ser creados, recuperados y eliminados. sessionStorage y localStorage utilizan un objeto de almacenamiento diferente según su origen — funcionan y son controlados por separado.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Acceder al Almacenamiento web desde IFrames de terceros está prohibido si el usuario tiene <a href="https://support.mozilla.org/en-US/kb/disable-third-party-cookies">deshabilitadas las cookies de terceros</a> (Firefox implementa este comportamiento a partir de la <a href="/en-US/docs/Mozilla/Firefox/Releases/43">versión 43</a>).</p>
+</div>
+
+<div class="note">
+<p><strong>Nota:</strong> El almacenamiento web no es lo mismo que <a href="/en-US/docs/Storage" title="Storage">mozStorage</a> (interfaces Mozilla's XPCOM para SQLite) o la <a href="/en-US/docs/Session_store_API" title="Session_store_API">Session store API</a> (una utilidad de almacenamiento <a href="/en-US/docs/XPCOM" title="XPCOM">XPCOM</a> usada por extensiones).</p>
+</div>
+
+<h2 id="Interfaces_de_almacenamiento_web">Interfaces de almacenamiento web</h2>
+
+<dl>
+ <dt>{{domxref("Storage")}}</dt>
+ <dd>Permite crear, recuperar y eliminar datos de un dominio y tipo de almacenamiento (sesión o local) específicos.</dd>
+ <dt>{{domxref("Window")}}</dt>
+ <dd>La API de almacenamiento web extiende el objeto {{domxref("Window")}} con dos nuevas propiedades — {{domxref("Window.sessionStorage")}} y {{domxref("Window.localStorage")}} — que proveen acceso a la sesión actual del dominio y a objetos {{domxref("Storage")}} locales, respectivamente. También ofrece un manejador de evento {{domxref("Window.onstorage")}} que se dispara cuando un área de la memoria cambia (por ejemplo, cuando se almacena un nuevo elemento).</dd>
+ <dt>{{domxref("StorageEvent")}}</dt>
+ <dd>El evento <code>storage</code> se dispara en el objeto <code>Window</code> de un documento cuando un área de la memoria cambia.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Para ilustrar algunos usos típicos del almacenamiento web, hemos creado un ejemplo simple, llamado <a href="https://github.com/mdn/web-storage-demo">Demo de almacenamiento web</a>. La <a href="http://mdn.github.io/web-storage-demo/">página de inicio</a> proporciona controles que puedes utilizar para personalizar el color, la tipografía y la imagen decorativa. Cuando seleccionas una opción diferente, la página se actualiza instantáneamente; además, tus opciones se almacenan en <code>localStorage</code>, de forma que si abandonas la página y la vuelves a cargar, tus opciones son recordadas.</p>
+
+<p>También creamos una<a href="http://mdn.github.io/web-storage-demo/event.html"> página de salida del evento</a> — si cargas esta página en otra pestaña y luego haces cambios a tus opciones en la página de inicio, verás que se muestra la información almacenada actualizada puesto que se dispara un evento {{event("StorageEvent")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Storage')}}</td>
+   <td>{{Spec2('Web Storage')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores"><strong>Compatibilidad </strong>de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>localStorage</td>
+   <td>4</td>
+   <td>3.5</td>
+   <td>8</td>
+   <td>10.50</td>
+   <td>4</td>
+  </tr>
+  <tr>
+   <td>sessionStorage</td>
+   <td>5</td>
+   <td>2</td>
+   <td>8</td>
+   <td>10.50</td>
+   <td>4</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>2.1</td>
+   <td>{{ CompatUnknown }}</td>
+   <td>8</td>
+   <td>11</td>
+   <td>iOS 3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Todos los navegadores tienen distintos niveles de capacidad tanto para localStorage como para sessionStorage. Aquí está una <a class="external external-icon" href="http://dev-test.nemikor.com/web-storage/support-test/" rel="noopener" title="http://dev-test.nemikor.com/web-storage/support-test/">análisis detallado de todas las capacidades de almacenamiento de diferentes navegadores</a>.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>Desde iOS 5.1, Safari Mobile almacena los datos de localStorage en la carpeta de caché, la cual está sujeta a limpiezas ocasionales, a petición del sistema operativo, típicamente cuando el espacio es reducido.</p>
+</div>
+
+<h2 id="Navegación_privada_Modo_incógnito">Navegación privada / Modo incógnito</h2>
+
+<p>La mayoría de los navegadores de hoy en día soportan una opción de privacidad llamada  'Modo incógnito', 'Navegación privada', o algo similar, que básicamente se asegura de que la sesión de navegación no deje rastros después de que el navegador se cierra. Esto es fundamentalmente incompatible con el almacenamiento web por obvias razones. Por ello, muchos navegadores están experimentando con diferentes escenarios para lidiar con esta incompatibilidad.</p>
+
+<p>La mayoría de los navegadores han optado por una estrategia donde las API de almacenamiento siguen disponibles y aparentemente completamente funcionales, con la única gran diferencia de que todos los datos almacenados son eliminados después de cerrar el navegador. Para estos navegadores aún hay diferentes interpretaciones sobre qué debería hacerse con los datos almacenados existentes (de una sesión de navegación normal). ¿Deberían de estar disponibles para lectura cuando esté en modo privado? Entonces, hay algunos navegadores, sobre todo Safari, que han optado por una solución donde el almacenamiento está disponible, pero vacío, y tiene un cupo de 0 bytes asignado, por lo que se vuelve imposible usar esta memoria para escribir datos.</p>
+
+<p>Los desarrolladores deberían de estar conscientes de estas diferentes implementaciones y tenerlas en cuenta a la hora de desarrollar aplicaciones web que depende de la API de almacenamiento web. Para más información, échale un vistazo a<a href="https://blog.whatwg.org/tag/localstorage"> esta entrada de blog WHATWG</a> que trata específicamente con este tema.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Usando la API de almacenamiento web</a></li>
+</ul>
diff --git a/files/es/web/api/web_storage_api/using_the_web_storage_api/index.html b/files/es/web/api/web_storage_api/using_the_web_storage_api/index.html
new file mode 100644
index 0000000000..bba0cba9a5
--- /dev/null
+++ b/files/es/web/api/web_storage_api/using_the_web_storage_api/index.html
@@ -0,0 +1,273 @@
+---
+title: Usando la API de almacenamiento web
+slug: Web/API/Web_Storage_API/Using_the_Web_Storage_API
+tags:
+  - API
+  - API de almacenamiento web
+  - Guía
+  - localStorage
+  - sessionStorage
+translation_of: Web/API/Web_Storage_API/Using_the_Web_Storage_API
+original_slug: Web/API/API_de_almacenamiento_web/Usando_la_API_de_almacenamiento_web
+---
+<div>{{DefaultAPISidebar("Web Storage API")}}</div>
+
+<div class="summary">
+<p>La API de almacenamiento web proporciona los mecanismos mediante los cuales el navegador puede almacenar información de tipo clave/valor, de una forma mucho más intuitiva que utilizando cookies.</p>
+
+<p>Este artículo proporciona una guía general de cómo usar esta tecnología.</p>
+</div>
+
+<h2 id="Conceptos_básicos">Conceptos básicos</h2>
+
+<p>Los objetos de almacenamiento son simples almacenes de clave/valor, similares a objetos, pero que permanecen intactos cuando la página se recarga. Las claves y los valores siempre son cadenas de texto (fíjate que las claves con enteros se convierten automáticamente a cadenas, tal y como lo hacen los objetos). Puedes acceder a estos valores como un objeto, o con los métodos {{domxref("Storage.getItem()")}} y {{domxref("Storage.setItem()")}}. Estas tres líneas modifican el valor de colorSetting de la misma manera:</p>
+
+<pre class="brush: js notranslate" style="white-space: pre;">localStorage.colorSetting = '#a4509b';
+localStorage['colorSetting'] = '#a4509b';
+localStorage.setItem('colorSetting', '#a4509b');</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Se recomiendo usar la API de almacenamiento web (<code>setItem</code>, <code>getItem</code>, <code>removeItem</code>, <code>key</code>, <code>length</code>) para prevenir las dificultades asociadas al uso de simples objetos como almacenes de valores llave/valor.</p>
+</div>
+
+<p>Los dos mecanismos en el almacenamiento web son los siguientes:</p>
+
+<ul>
+ <li><strong><code>sessionStorage</code> </strong>mantiene un área de almacenamiento separada para cada origen que está disponible mientras dure la sesión de la página (mientras el navegador esté abierto, incluyendo recargas de página y restablecimientos).</li>
+ <li><strong><code>localStorage</code> </strong>hace lo mismo, pero persiste incluso cuando el navegador se cierre y se reabra.</li>
+</ul>
+
+<p>Estos mecanismos están disponibles mediante las propiedades <a href="https://developer.mozilla.org/es/docs/Web/API/Window/sessionStorage" title="La propiedad sessionStorage permite acceder a un objeto Storage asociado a la sesión actual. La propiedad sessionStorage es similar a localStorage, la única diferencia es que la información almacenada en localStorage no posee tiempo de expiración, por el contrario la información almacenada en sessionStorage es eliminada al finalizar la sesion de la página. La sesión de la página perdura mientras el navegador se encuentra abierto, y se mantiene por sobre las recargas y reaperturas de la página. Abrir una página en una nueva pestaña o ventana iniciará una nueva sesión, lo que difiere en la forma en que trabajan las cookies de sesión."><code>Window.sessionStorage</code></a> y  <a href="https://developer.mozilla.org/es/docs/Web/API/Window/localStorage" title="La propiedad localStorage te permite acceder al objeto local Storage. localStorage es similar a sessionStorage. La única diferencia es que, mientras los datos almacenados en localStorage no tienen fecha de expiración, los datos almacenados en sessionStorage son eliminados cuando finaliza la sesion de navegación - lo cual ocurre cuando se cierra el navegador."><code>Window.localStorage</code></a> (dicho con más precisión, en navegadores con soporte, el objeto <code>Window</code> implementa los objetos  <code>WindowLocalStorage</code> y <code>WindowSessionStorage</code>, en los cuales se basan las propiedades <code>localStorage</code> y <code>sessionStorage</code>). Al invocar uno de éstos, se creará una instancia del objeto <a href="https://developer.mozilla.org/es/docs/Web/API/Storage" title="La interfaz Storage de la API de almacenamiento web provee acceso al almacenamiento de la sesión o al almacenamiento local para un dominio en particular, permitiéndote por ejemplo añadir, modificar o eliminar elementos de dato almacenados."><code>Storage</code></a>, a través del cual los datos pueden ser creados, recuperados y eliminados. sessionStorage y localStorage utilizan un objeto de almacenamiento diferente según su origen — funcionan y son controlados por separado.</p>
+
+<p>Así que, por ejemplo, si en un inicio se llama a <code>localStorage</code> en un documento, esto devolverá un objeto {{domxref("Storage")}}; llamar a <code>sessionStorage</code> en un documento devolverá un objeto {{domxref("Storage")}} diferente. Ambos objetos se pueden manipular de la misma forma, pero separados.</p>
+
+<h2 id="Detectar_la_característica_localStorage">Detectar la característica localStorage</h2>
+
+<p>Para poder usar localStorage, debemos de verificar que tiene soporte y que está disponible en la sesión del buscador actual.</p>
+
+<h3 id="Probar_la_disponibilidad">Probar la disponibilidad</h3>
+
+<div class="blockIndicator note">
+<p>Nota: esta API está disponible en las versiones actuales de todos los navegadores principales. La prueba de disponibilidad es necesaria sólo si debes soportar navegadores muy antiguos, como Internet Explorer 6 o 7, o en las circunstancias limitadas descritas más abajo.</p>
+</div>
+
+<p>Los buscadores que soportan localStorage tienen una propiedad en el objeto window que se llama localStorage. Sin embargo, por varias razones, el sólo asegurarse de que la propiedad existe puede arrojar excepciones. El que localStorage exista no es garantía suficiente de que en verdad esté disponible, puesto que varios buscadores ofrecen configuraciones que lo inhabilitan. Así que un buscador puede <em>soportar </em>localStorage, pero puede no hacerlo <em>disponible </em>para los scripts en la página. Un ejemplo de esto es Safari, que en el modo de búsqueda privada ofrece un objeto localStorage vacío con un cupo de 0, por lo que es inutilizable. Sin embargo, es posible que aún así obtengamos un QuotaExceededError legítimo, lo que significa que ya usamos todo el espacio de almacenamiento disponible, aunque el almacenamiento esté, de hecho, <em>disponible</em>. Nuestra detección de la característica debe de tomar en cuenta estos escenarios.</p>
+
+<p>Esta función detecta si localStorage tiene soporte y está disponible:</p>
+
+<pre class="brush: js notranslate">function storageAvailable(type) {
+    try {
+        var storage = window[type],
+            x = '__storage_test__';
+        storage.setItem(x, x);
+        storage.removeItem(x);
+        return true;
+    }
+    catch(e) {
+        return e instanceof DOMException &amp;&amp; (
+            // everything except Firefox
+            e.code === 22 ||
+            // Firefox
+            e.code === 1014 ||
+            // test name field too, because code might not be present
+            // everything except Firefox
+            e.name === 'QuotaExceededError' ||
+            // Firefox
+            e.name === 'NS_ERROR_DOM_QUOTA_REACHED') &amp;&amp;
+            // acknowledge QuotaExceededError only if there's something already stored
+            storage.length !== 0;
+    }
+}</pre>
+
+<p>Y aquí se muestra cómo usarla:</p>
+
+<pre class="brush: js notranslate">if (storageAvailable('localStorage')) {
+  // Yippee! We can use localStorage awesomeness
+}
+else {
+  // Too bad, no localStorage for us
+}</pre>
+
+<p>También puedes probar sessionStorage invocando <code>storageAvailable('sessionStorage')</code>.</p>
+
+<p>Aquí puedes ver una <a href="https://gist.github.com/paulirish/5558557">breve historia de la detección de la característica localStorage</a>.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Para ilustrar un uso típico de almacenamiento web, creamos un ejemplo simple que llamamos <strong>Demo de almacenamiento web</strong>. La <a href="https://mdn.github.io/dom-examples/web-storage/">página de inicio</a> proporciona unos controles que se pueden usar para personalizar el color, la tipografía y la imagen decorativa:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/9685/landing.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;">Cuando seleccionas una opción diferente, la página se actualiza instantáneamente; además, tus opciones se almacenan en <code>localStorage</code>, de forma que si abandonas la página y la vuelves a cargar, tus opciones son recordadas.</p>
+
+<p>También creamos una <a href="https://mdn.github.io/dom-examples/web-storage/event.html">página de salida del evento</a> — si cargas esta página en otra pestaña y luego haces cambios a tus opciones en la página de inicio, verás que se muestra la información almacenada actualizada puesto que se dispara un {{domxref("StorageEvent")}}.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/9687/event-output.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes ver las páginas de ejemplo usando los links de arriba y también puedes <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">ver el código fuente.</a></p>
+</div>
+
+<h3 id="Probar_si_la_memoria_tiene_valores">Probar si la memoria tiene valores</h3>
+
+<p>En el inicio de <a href="https://github.com/mdn/dom-examples/blob/master/web-storage/main.js">main.js</a>, probamos si el objeto ya tiene valores (es decir, si la página ya fue visitada):</p>
+
+<pre class="brush: js notranslate">if(!localStorage.getItem('bgcolor')) {
+  populateStorage();
+} else {
+  setStyles();
+}</pre>
+
+<p>El método {{domxref("Storage.getItem()")}} se usa para obtener un dato de la memoria; en este caso, estamos probando si el dato <code>bgcolor</code> existe; si no, corremos <code>populateStorage()</code> para añadir los valores personalizados actuales a la memoria. Si ya hay valores guardados, corremos <code>setStyles()</code> para actualizar el estilo de la página con los valores almacenados.</p>
+
+<p><strong>Nota</strong>: También puedes usar {{domxref("Storage.length")}} para probar si el objeto de almacenamiento está vació o no.</p>
+
+<h3 id="Obtener_valores_de_la_memoria">Obtener valores de la memoria</h3>
+
+<p>Como dijimos arriba, los valores se pueden recuperar de la memoria usando {{domxref("Storage.getItem()")}}. Este método usa la llave del dato como argumento y devuelve el valor. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">function setStyles() {
+  var currentColor = localStorage.getItem('bgcolor');
+  var currentFont = localStorage.getItem('font');
+  var currentImage = localStorage.getItem('image');
+
+  document.getElementById('bgcolor').value = currentColor;
+  document.getElementById('font').value = currentFont;
+  document.getElementById('image').value = currentImage;
+
+  htmlElem.style.backgroundColor = '#' + currentColor;
+  pElem.style.fontFamily = currentFont;
+  imgElem.setAttribute('src', currentImage);
+}</pre>
+
+<p>Aquí, en las primeras tres líneas tomamos los valores del almacenamiento local. Después, fijamos los valores mostrados en los elementos del formulario a esos valores, de forma que se mantengan sincronizados cuando recargues la página. Finalmente, actualizamos los estilos y la imagen decorativa en la página para que tus opciones personalizadas vuelvan a aparecer al recargar.</p>
+
+<h3 id="Guardar_valores_en_la_memoria">Guardar valores en la memoria</h3>
+
+<p>{{domxref("Storage.setItem()")}} se usa tanto para crear nuevos datos como para actualizar valores existentes (si el dato ya existía). Este método recibe dos argumentos: la llave del dato que se va a crear/modificar y el valor que se va a guardar.</p>
+
+<pre class="brush: js notranslate">function populateStorage() {
+  localStorage.setItem('bgcolor', document.getElementById('bgcolor').value);
+  localStorage.setItem('font', document.getElementById('font').value);
+  localStorage.setItem('image', document.getElementById('image').value);
+
+  setStyles();
+}</pre>
+
+<p>La función <code>populateStorage()</code> define tres elementos en el almacenamiento local — el color de fondo, la tipografía y la ruta de almacenamiento de la imagen. Luego corre la función <code>setStyles()</code> para actualizar el estilo de la página, etc.</p>
+
+<p>También incluimos un manejador <code>onchange</code> para cada elemento del formulario, de manera que los datos y los estilos son actualizados cada vez que un valor del formulario cambia:</p>
+
+<pre class="brush: js notranslate">bgcolorForm.onchange = populateStorage;
+fontForm.onchange = populateStorage;
+imageForm.onchange = populateStorage;</pre>
+
+<h3 id="Responder_a_cambios_en_la_memoria_con_el_evento_StorageEvent">Responder a cambios en la memoria con el evento StorageEvent</h3>
+
+<p>El evento {{domxref("StorageEvent")}} se dispara siempre que se hace un cambio al objeto {{domxref("Storage")}} (nota que este evento no se dispara para cambios en sessionStorage). Este evento no va a trabajar en la misma página en la que se están haciendo los cambios, sino que es una manera para que las otras páginas del dominio que usan la memoria sincronicen los cambios que se están haciendo. Las páginas en otros dominios no pueden acceder a los mismos objetos de almacenamiento.</p>
+
+<p>En la página de eventos (ver <a href="https://github.com/mdn/dom-examples/blob/master/web-storage/event.js">events.js</a>) el único JavaScript es el siguiente:</p>
+
+<pre class="brush: js notranslate">window.addEventListener('storage', function(e) {
+  document.querySelector('.my-key').textContent = e.key;
+  document.querySelector('.my-old').textContent = e.oldValue;
+  document.querySelector('.my-new').textContent = e.newValue;
+  document.querySelector('.my-url').textContent = e.url;
+  document.querySelector('.my-storage').textContent = JSON.stringify(e.storageArea);
+});</pre>
+
+<p>Aquí añadimos un detector de evento al objeto <code>window</code> que se dispara cuando el objeto {{domxref("Storage")}} asociado con el origen actual cambia. Como puedes ver arriba, el objeto asociado a este evento tiene varias propiedades que contienen información útil — la llave del dato que cambió, el valor anterior al cambio, el nuevo valor tras el cambio, la URL del documento que cambió la memoria y el objeto de almacenamiento mismo (que volvimos una cadena para que pudieras ver su contenido).</p>
+
+<h3 id="Borrar_registros">Borrar registros</h3>
+
+<p>El almacenamiento web también provee un par de métodos simples para remover datos. No los usamos en nuestro demo, pero se pueden añadir de manera muy simple a tu proyecto:</p>
+
+<ul>
+ <li>{{domxref("Storage.removeItem()")}} recibe un solo argumento — la llave del dato que quieres eliminar — y lo remueve del objeto de almacenamiento de ese dominio.</li>
+ <li>{{domxref("Storage.clear()")}} no recibe argumentos; vacía todo el objeto de almacenamiento de ese dominio.</li>
+</ul>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'webstorage.html#webstorage')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>localStorage</td>
+   <td>4</td>
+   <td>3.5</td>
+   <td>8</td>
+   <td>10.50</td>
+   <td>4</td>
+  </tr>
+  <tr>
+   <td>sessionStorage</td>
+   <td>5</td>
+   <td>2</td>
+   <td>8</td>
+   <td>10.50</td>
+   <td>4</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>2.1</td>
+   <td>{{ CompatUnknown }}</td>
+   <td>8</td>
+   <td>11</td>
+   <td>iOS 3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Todos los navegadores tienen distintos niveles de capacidad tanto para localStorage como para sessionStorage. Aquí está una <a class="external external-icon" href="http://dev-test.nemikor.com/web-storage/support-test/" rel="noopener" title="http://dev-test.nemikor.com/web-storage/support-test/">análisis detallado de todas las capacidades de almacenamiento de diferentes navegadores</a>.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>Desde iOS 5.1, Safari Mobile almacena los datos de localStorage en la carpeta de caché, la cual está sujeta a limpiezas ocasionales, a petición del sistema operativo, típicamente cuando el espacio es reducido.</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Web_Storage_API">Página de inicio de la API de almacenamiento web</a></li>
+</ul>
diff --git a/files/es/web/api/web_workers_api/using_web_workers/index.html b/files/es/web/api/web_workers_api/using_web_workers/index.html
new file mode 100644
index 0000000000..75a8cfa1bb
--- /dev/null
+++ b/files/es/web/api/web_workers_api/using_web_workers/index.html
@@ -0,0 +1,634 @@
+---
+title: Usando Web Workers
+slug: Web/API/Web_Workers_API/Using_web_workers
+translation_of: Web/API/Web_Workers_API/Using_web_workers
+original_slug: Web/Guide/Performance/Usando_web_workers
+---
+<p><span class="seoSummary">Los Web Workers dedicados proveen un medio sencillo para que el contenido web ejecute scripts en hilos en segundo plano. Una vez creado, un worker puede enviar mensajes a la tarea creada mediante envio de mensajes al manejador de eventos especificado por el creador.</span> Sin embargo, <strong>los workers trabajan dentro de un <a href="https://developer.mozilla.org/en-US/docs/JavaScript/DedicatedWorkerGlobalScope">contexto global</a> diferente de la ventana actual</strong> (usar el atajo <span style="line-height: 1.5;"> {{ domxref("window") }} en lugar de </span><span style="line-height: 1.5;">{{ domxref("window.self","self") }} con el fin de obtener el scope actual dentro de un </span><span style="line-height: 1.5;">{{ domxref("Worker") }} retornaría, de hecho, un error).</span></p>
+
+<p>El hilo worker puede realizar tareas sin interferir con la interfaz de usuario. Ademas, pueden realizar I/O usando <code style="font-size: 14px;"><a class="internal" href="/en/nsIXMLHttpRequest" title="En/XMLHttpRequest">XMLHttpRequest</a></code><span style="line-height: 1.5;"> (aunque el responseXML y los atributos channel son siempre null).</span></p>
+
+<p><span style="line-height: 1.5;">Para documentacion de referencia acerca de workers busca </span><span style="line-height: 1.5;">{{ domxref("Worker") }} ; este articulo complementa ese ofreciendo ejemplos y detalles adicionales. Para una lista de las funciones disponibles sobre workers, visita </span><span style="line-height: 1.5;"> </span><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Needs_categorization/Functions_available_to_workers?redirect=no" style="line-height: 1.5;" title="En/DOM/Worker/Functions available to workers">Functions and interfaces available to workers</a><span style="line-height: 1.5;">.</span></p>
+
+<h2 id="Acerca_de_seguridad_de_hilos" style="line-height: 22.79199981689453px;">Acerca de seguridad de hilos</h2>
+
+<p>La interfaz <span style="line-height: 1.5;"> {{ domxref("Worker") }} crea hilos a nivel de SO reales, y la concurrencia puede causar effectos interesantes en tu código si no eres cuidadoso. Sin embargo, en el caso de los web workers, el control cuidadoso de los puntos de comunicacion con otros hilos indica que es realmente muy dificil causar problemas de concurrencia. No existe acceso a componentes no-hilo seguros o al DOM y debes pasar la informacion entrante o saliente del hilo a traves de objetos serializados. Así que debes poner esfuerzo para causar problemas en tu código.</span></p>
+
+<p><strong style="">Creando un web worker</strong></p>
+
+<p>Crear un nuevo worker es simple.  Sólo tienes que llamar el constructor {{ domxref("Worker.Worker", "Worker()") }}, especificando la URI de un script a ejecutar en el hilo del worker (<em>worker thread</em>), y, si deseas poder recibir notificaciones del worker, establece la propiedad  {{domxref("Worker.onmessage")}} del worker a una función de manejo de eventos apropiada.</p>
+
+<div style="overflow: hidden;">
+<pre class="brush: js notranslate">var myWorker = new Worker("my_task.js");
+
+myWorker.onmessage = function (oEvent) {
+  console.log("Called back by the worker!\n");
+};</pre>
+</div>
+
+<p>Alternativamente, puedes usar <code>addEventListener()</code> :</p>
+
+<div style="overflow: hidden;">
+<pre class="brush: js notranslate">var myWorker = new Worker("my_task.js");
+
+myWorker.addEventListener("message", function (oEvent) {
+  console.log("Called back by the worker!\n");
+}, false);
+
+myWorker.postMessage(""); // start the worker.</pre>
+</div>
+
+<p>La Línea 1 en  este ejemplo crea un nuevo worker (<em>worker thread)</em>. La Línea 3 configura un manejador de eventos (<em>listener</em>) para encargarse de los eventos <code>message</code> del worker. Este manejador de eventos se llamará cuando el worker llame a su propia función {{domxref("Worker.postMessage()")}}. Finalmente, la Linea 7 inicia el worker <em>(worker thread)</em>.</p>
+
+<div class="note"><strong>Nota</strong> : La URI pasada como parámetro del constructor de <code>Worker</code> debe obedecer la política <a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">same-origin policy</a> . Actualmente hay desacuerdo entre los desarolladores de navegadores sobre qué URIs son del mismo origen; Gecko 10.0 {{ geckoRelease("10.0") }} y posteriores sí permiten data URIs e Internet Explorer 10 no permite Blob URIs como un script válido para los workers.</div>
+
+<h2 id="Pasando_datos">Pasando datos</h2>
+
+<p>Los datos pasan entre la página principal y los workers son <strong>copiados</strong>, no compartidos. Los objetos se serializan a medida que se entregan al worker, y posteriormente, se deserializan en el otro extremo. La página y el worker <strong>no comparten la misma instancia</strong>, por lo que el resultado final es que un duplicado es creado en cada extremo. La mayoría de los navegadores implementan esta característica como <a href="/en/DOM/The_structured_clone_algorithm" title="The structured clone algorithm">structured cloning</a>.</p>
+
+<p>Antes de continuar, vamos a crear con fines didácticos una función llamada <code>emulateMessage()</code> que simulará el comportamiento de un valor el cual es clonado y no compartido durante el paso desde un <em>worker </em>a la página principal o viceversa:</p>
+
+<pre class="brush: js notranslate">function emulateMessage (vVal) {
+    return eval("(" + JSON.stringify(vVal) + ")");
+}
+
+// Tests
+
+// test #1
+var example1 = new Number(3);
+alert(typeof example1); // object
+alert(typeof emulateMessage(example1)); // number
+
+// test #2
+var example2 = true;
+alert(typeof example2); // boolean
+alert(typeof emulateMessage(example2)); // boolean
+
+// test #3
+var example3 = new String("Hello World");
+alert(typeof example3); // object
+alert(typeof emulateMessage(example3)); // string
+
+// test #4
+var example4 = {
+    "name": "John Smith",
+    "age": 43
+};
+alert(typeof example4); // object
+alert(typeof emulateMessage(example4)); // object
+
+// test #5
+function Animal (sType, nAge) {
+    this.type = sType;
+    this.age = nAge;
+}
+var example5 = new Animal("Cat", 3);
+alert(example5.constructor); // Animal
+alert(emulateMessage(example5).constructor); // Object</pre>
+
+<p>A Un valor que es clonado y no compartido se denomina <em>mensaje</em>. De vuelta con los workers, los <em>mensajes</em> pueden ser enviados hacia y desde el hilo principal empleando <code>postMessage()</code>. Los eventos de <code>mensaje</code> {{domxref("MessageEvent.data", "data")}} atributo contienen datos devueltos desde el worker.</p>
+
+<p><strong>example.html</strong>: (la página principal):</p>
+
+<pre class="brush: js notranslate">var myWorker = new Worker("my_task.js");
+
+myWorker.onmessage = function (oEvent) {
+  console.log("Worker said : " + oEvent.data);
+};
+
+myWorker.postMessage("ali");</pre>
+
+<p><strong>my_task.js</strong> (el worker):</p>
+
+<pre class="brush: js notranslate">postMessage("I\'m working before postMessage(\'ali\').");
+
+onmessage = function (oEvent) {
+  postMessage("Hi " + oEvent.data);
+};</pre>
+
+<div class="note"><strong>Note:</strong> Como siempre, los hilos en segundo plano -incluyendo workers- <strong>no pueden manipular el DOM</strong>. Si acciones tomadas por el hilo en segundo planos resultarían en cambios en el DOM, deberian enviar mensajes a sus creadores para llevarlos a cabo.</div>
+
+<p>The <a href="/en-US/docs/Web/Guide/DOM/The_structured_clone_algorithm" style="line-height: 1.572;" title="The structured clone algorithm">structured cloning</a> algorithm can accept JSON and a few things that JSON can't like circular references.</p>
+
+<h3 id="Ejemplos_pasando_datos">Ejemplos pasando datos</h3>
+
+<h4 id="Example_1_Crear_un_eval_asíncrono_genérico">Example #1: Crear un "<code>eval() asíncrono</code>" genérico</h4>
+
+<p>El siguiente ejemplo muestra como usar un worker para ejecutar <strong>asíncronamente</strong> cualquier tipo de código en Javascript a traves de <a href="/en-US/docs/JavaScript/Reference/Global_Objects/eval" title="/en-US/docs/JavaScript/Reference/Global_Objects/eval"><code>eval</code></a> dentro del worker:</p>
+
+<pre class="brush: js notranslate">// Syntax: asyncEval(code[, listener])
+
+var asyncEval = (function () {
+
+  var aListeners = [], oParser = new Worker("data:text/javascript;charset=US-ASCII,onmessage%20%3D%20function%20%28oEvent%29%20%7B%0A%09postMessage%28%7B%0A%09%09%22id%22%3A%20oEvent.data.id%2C%0A%09%09%22evaluated%22%3A%20eval%28oEvent.data.code%29%0A%09%7D%29%3B%0A%7D");
+
+  oParser.onmessage = function (oEvent) {
+    if (aListeners[oEvent.data.id]) { aListeners[oEvent.data.id](oEvent.data.evaluated); }
+    delete aListeners[oEvent.data.id];
+  };
+
+
+  return function (sCode, fListener) {
+    aListeners.push(fListener || null);
+    oParser.postMessage({
+      "id": aListeners.length - 1,
+      "code": sCode
+    });
+  };
+
+})();</pre>
+
+<p>Ejemplo de uso:</p>
+
+<pre class="brush: js notranslate">// asynchronous alert message...
+asyncEval("3 + 2", function (sMessage) {
+    alert("3 + 2 = " + sMessage);
+});
+
+// asynchronous print message...
+asyncEval("\"Hello World!!!\"", function (sHTML) {
+    document.body.appendChild(document.createTextNode(sHTML));
+});
+
+// asynchronous void...
+asyncEval("(function () {\n\tvar oReq = new XMLHttpRequest();\n\toReq.open(\"get\", \"http://www.mozilla.org/\", false);\n\toReq.send(null);\n\treturn oReq.responseText;\n})()");</pre>
+
+<h4 id="Ejemplo_2_Paso_avanzado_de_JSON_Data_y_creación_de_un_sistema_de_conmutación">Ejemplo #2: Paso avanzado de JSON Data y creación de un sistema de conmutación</h4>
+
+<p>Si tiene que pasar datos complejos y tienes que llamar a muchas funciones diferentes tanto en la página principal como en el Worker, puede crear un sistema como el siguiente.</p>
+
+<p><strong>example.html</strong> (the main page):</p>
+
+<pre class="brush: html notranslate">&lt;!doctype html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;meta charset="UTF-8"  /&gt;
+&lt;title&gt;MDN Example - Queryable worker&lt;/title&gt;
+&lt;script type="text/javascript"&gt;
+  /*
+    QueryableWorker instances methods:
+     * sendQuery(queryable function name, argument to pass 1, argument to pass 2, etc. etc): calls a Worker's queryable function
+     * postMessage(string or JSON Data): see Worker.prototype.postMessage()
+     * terminate(): terminates the Worker
+     * addListener(name, function): adds a listener
+     * removeListener(name): removes a listener
+    QueryableWorker instances properties:
+     * defaultListener: the default listener executed only when the Worker calls the postMessage() function directly
+  */
+  function QueryableWorker (sURL, fDefListener, fOnError) {
+    var oInstance = this, oWorker = new Worker(sURL), oListeners = {};
+    this.defaultListener = fDefListener || function () {};
+    oWorker.onmessage = function (oEvent) {
+      if (oEvent.data instanceof Object &amp;&amp; oEvent.data.hasOwnProperty("vo42t30") &amp;&amp; oEvent.data.hasOwnProperty("rnb93qh")) {
+        oListeners[oEvent.data.vo42t30].apply(oInstance, oEvent.data.rnb93qh);
+      } else {
+        this.defaultListener.call(oInstance, oEvent.data);
+      }
+    };
+    if (fOnError) { oWorker.onerror = fOnError; }
+    this.sendQuery = function (/* queryable function name, argument to pass 1, argument to pass 2, etc. etc */) {
+      if (arguments.length &lt; 1) { throw new TypeError("QueryableWorker.sendQuery - not enough arguments"); return; }
+      oWorker.postMessage({ "bk4e1h0": arguments[0], "ktp3fm1": Array.prototype.slice.call(arguments, 1) });
+    };
+    this.postMessage = function (vMsg) {
+      //I just think there is no need to use call() method
+      //how about just oWorker.postMessage(vMsg);
+      //the same situation with terminate
+      //well,just a little faster,no search up the prototye chain
+      Worker.prototype.postMessage.call(oWorker, vMsg);
+    };
+    this.terminate = function () {
+      Worker.prototype.terminate.call(oWorker);
+    };
+    this.addListener = function (sName, fListener) {
+      oListeners[sName] = fListener;
+    };
+    this.removeListener = function (sName) {
+      delete oListeners[sName];
+    };
+  };
+
+  // your custom "queryable" worker
+  var oMyTask = new QueryableWorker("my_task.js" /* , yourDefaultMessageListenerHere [optional], yourErrorListenerHere [optional] */);
+
+  // your custom "listeners"
+
+  oMyTask.addListener("printSomething", function (nResult) {
+    document.getElementById("firstLink").parentNode.appendChild(document.createTextNode(" The difference is " + nResult + "!"));
+  });
+
+  oMyTask.addListener("alertSomething", function (nDeltaT, sUnit) {
+    alert("Worker waited for " + nDeltaT + " " + sUnit + " :-)");
+  });
+&lt;/script&gt;
+&lt;/head&gt;
+&lt;body&gt;
+  &lt;ul&gt;
+    &lt;li&gt;&lt;a id="firstLink" href="javascript:oMyTask.sendQuery('getDifference', 5, 3);"&gt;What is the difference between 5 and 3?&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="javascript:oMyTask.sendQuery('waitSomething');"&gt;Wait 3 seconds&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="javascript:oMyTask.terminate();"&gt;terminate() the Worker&lt;/a&gt;&lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p><strong>my_task.js</strong> (el worker):</p>
+
+<pre class="brush: js notranslate">// your custom PRIVATE functions
+
+function myPrivateFunc1 () {
+  // do something
+}
+
+function myPrivateFunc2 () {
+  // do something
+}
+
+// etc. etc.
+
+// your custom PUBLIC functions (i.e. queryable from the main page)
+
+var queryableFunctions = {
+  // example #1: get the difference between two numbers:
+  getDifference: function (nMinuend, nSubtrahend) {
+      reply("printSomething", nMinuend - nSubtrahend);
+  },
+  // example #2: wait three seconds
+  waitSomething: function () {
+      setTimeout(function() { reply("alertSomething", 3, "seconds"); }, 3000);
+  }
+};
+
+// system functions
+
+function defaultQuery (vMsg) {
+  // your default PUBLIC function executed only when main page calls the queryableWorker.postMessage() method directly
+  // do something
+}
+
+function reply (/* listener name, argument to pass 1, argument to pass 2, etc. etc */) {
+  if (arguments.length &lt; 1) { throw new TypeError("reply - not enough arguments"); return; }
+  postMessage({ "vo42t30": arguments[0], "rnb93qh": Array.prototype.slice.call(arguments, 1) });
+}
+
+onmessage = function (oEvent) {
+  if (oEvent.data instanceof Object &amp;&amp; oEvent.data.hasOwnProperty("bk4e1h0") &amp;&amp; oEvent.data.hasOwnProperty("ktp3fm1")) {
+    queryableFunctions[oEvent.data.bk4e1h0].apply(self, oEvent.data.ktp3fm1);
+  } else {
+    defaultQuery(oEvent.data);
+  }
+};</pre>
+
+<p>Es un método posible para conmutar el contenido de cada mensaje de cada mainpage-worker y viceversa.</p>
+
+<h3 id="Pasando_datos_mediante_transferencia_de_propiedades_objetos_transferibles">Pasando datos mediante transferencia de propiedades (objetos transferibles)</h3>
+
+<p>Google Chrome 17 y Firefox 18 implementan un método adicional para enviar ciertos tipos de objetos desde o hacia el worker con un mejor rendimiento. Estos objetos se denominan objetos transferibles (transferable objects), es decir, o<span class="external">bjetos que implementan la interfaz {{domxref("Transferable")}}</span>. Los objetos transferibles se transfieren de un contexto a otro con una operación "zero-copy". Esto supone una gran mejora de rendimiento al enviar grandes cantidades de datos. Piensa en ello como un paso por referencia si vienes del mundo de C/C++.  Sin embargo, a diferecia del paso por referencia, la "versión" original no queda disponible una vez transferida. Su contenido es transferido al nuevo contexto. Por ejemplo, cuando se transfiere un {{domxref("ArrayBuffer")}} de tu aplicacion al Worker, el contenido del {{domxref("ArrayBuffer")}} original se vacía y no se puede utilizar posteriormente. Su contenido es (literalmente) transferido al contexto del Worker.</p>
+
+<pre class="brush: js notranslate">// Create a 32MB "file" and fill it.
+var uInt8Array = new Uint8Array(1024*1024*32); // 32MB
+for (var i = 0; i &lt; uInt8Array.length; ++i) {
+  uInt8Array[i] = i;
+}
+
+worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
+</pre>
+
+<p>Para más información sobre los objetos transferibles, <a class="external" href="http://updates.html5rocks.com/2011/12/Transferable-Objects-Lightning-Fast" title="http://updates.html5rocks.com/2011/12/Transferable-Objects-Lightning-Fast">visita HTML5Rocks</a> .</p>
+
+<h2 id="Spawning_subworkers">Spawning subworkers</h2>
+
+<p>Workers may spawn more workers if they wish.  So-called subworkers must be hosted within the same origin as the parent page.  Also, the URIs for subworkers are resolved relative to the parent worker's location rather than that of the owning page.  This makes it easier for workers to keep track of where their dependencies are.</p>
+
+<p>Subworkers are currently not supported in Chrome. See <a class="external" href="http://code.google.com/p/chromium/issues/detail?id=31666" title="http://code.google.com/p/chromium/issues/detail?id=31666">crbug.com/31666</a> .</p>
+
+<h2 id="Embedded_workers">Embedded workers</h2>
+
+<p>There is not an "official" way to embed the code of a worker within a web page as for the {{ HTMLElement("script") }} elements. But a {{ HTMLElement("script") }} element which does not have a <code>src</code> attribute and has a <code>type</code> attribute that does not identify an executable mime-type will be considered a data block element, that JavaScript could use.  "Data blocks" is a more general feature of HTML5 that can carry almost any textual data. So, a worker could be embedded in this way:</p>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;meta charset="UTF-8" /&gt;
+&lt;title&gt;MDN Example - Embedded worker&lt;/title&gt;
+&lt;script type="text/js-worker"&gt;
+  // This script WON'T be parsed by JS engines because its mime-type is text/js-worker.
+  var myVar = "Hello World!";
+  // Rest of your worker code goes here.
+&lt;/script&gt;
+&lt;script type="text/javascript"&gt;
+  // This script WILL be parsed by JS engines because its mime-type is text/javascript.
+  function pageLog (sMsg) {
+    // Use a fragment: browser will only render/reflow once.
+    var oFragm = document.createDocumentFragment();
+    oFragm.appendChild(document.createTextNode(sMsg));
+    oFragm.appendChild(document.createElement("br"));
+    document.querySelector("#logDisplay").appendChild(oFragm);
+  }
+&lt;/script&gt;
+&lt;script type="text/js-worker"&gt;
+  // This script WON'T be parsed by JS engines because its mime-type is text/js-worker.
+  onmessage = function (oEvent) {
+    postMessage(myVar);
+  };
+  // Rest of your worker code goes here.
+&lt;/script&gt;
+&lt;script type="text/javascript"&gt;
+  // This script WILL be parsed by JS engines because its mime-type is text/javascript.
+
+  // In the past...:
+  // blob builder existed
+  // ...but now we use Blob...:
+  var blob = new Blob(Array.prototype.map.call(document.querySelectorAll("script[type=\"text\/js-worker\"]"), function (oScript) { return oScript.textContent; }),{type: "text/javascript"});
+
+  // Creating a new document.worker property containing all our "text/js-worker" scripts.
+  document.worker = new Worker(window.URL.createObjectURL(blob));
+
+  document.worker.onmessage = function (oEvent) {
+    pageLog("Received: " + oEvent.data);
+  };
+
+  // Start the worker.
+  window.onload = function() { document.worker.postMessage(""); };
+&lt;/script&gt;
+&lt;/head&gt;
+&lt;body&gt;&lt;div id="logDisplay"&gt;&lt;/div&gt;&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>The embedded worker is now nested into a new custom <code>document.worker</code> property.</p>
+
+<h2 id="Tiempos_fuera_e_intervalos">Tiempos fuera e intervalos</h2>
+
+<p>Los trabajadores pueden usar tiempos fuera e intervalos de la misma forma que el "hilo principal".  Esto puede ser útil, por ejemplo, si quieres tener a tu hilo trabajador corriendo codigo periodicamente en lugar de sin parar.</p>
+
+<p>Ver <a class="internal" href="/en/DOM/window.setTimeout" title="En/DOM/Window.setTimeout"><code>setTimeout()</code> </a> , <a class="internal" href="/en/DOM/window.clearTimeout" title="En/DOM/Window.clearTimeout"> <code>clearTimeout()</code> </a> , <a class="internal" href="/en/DOM/window.setInterval" title="En/DOM/Window.setInterval"> <code>setInterval()</code> </a> , y <a class="internal" href="/en/DOM/window.clearInterval" title="En/DOM/Window.clearInterval"><code>clearInterval()</code> </a> para más detalles. Ver también: <a href="/en-US/docs/JavaScript/Timers" title="/en-US/docs/JavaScript/Timers">JavaScript Timers</a>.</p>
+
+<h2 id="Terminating_a_worker">Terminating a worker</h2>
+
+<p>If you need to immediately terminate a running worker, you can do so by calling the worker's <code>terminate()</code> method:</p>
+
+<pre class="syntaxbox notranslate">myWorker.terminate();</pre>
+
+<p>The worker thread is killed immediately without an opportunity to complete its operations or clean up after itself.</p>
+
+<p>Workers may close themselves by calling their own {{ ifmethod("nsIWorkerScope", "close") }} method:</p>
+
+<pre class="syntaxbox notranslate">self.close();</pre>
+
+<h2 id="Manejo_de_errores">Manejo de errores</h2>
+
+<p>When a runtime error occurs in worker, its <code>onerror</code> event handler is called.  It receives an event named <code>error</code> which implements the <code>ErrorEvent</code> interface.  The event doesn't bubble and is cancelable; to prevent the default action from taking place, the worker can call the error event's <a class="internal" href="/en/DOM/event.preventDefault" title="En/DOM/Event.preventDefault"> <code>preventDefault()</code> </a> method.</p>
+
+<p>The error event has the following three fields that are of interest:</p>
+
+<dl>
+ <dt><code>message</code></dt>
+ <dd>A human-readable error message.</dd>
+ <dt><code>filename</code></dt>
+ <dd>The name of the script file in which the error occurred.</dd>
+ <dt><code>lineno</code></dt>
+ <dd>The line number of the script file on which the error occurred.</dd>
+</dl>
+
+<h2 id="Accediendo_al_objeto_navigator">Accediendo al objeto navigator</h2>
+
+<p>Los workers pueden acceder al objeto <code>navigator</code>, el cuál está disponible dentro de su scope actual. Este contiene los siguientes strings que pueden ser usados para identificar el navegador, al igual que puede realizarse usando scripts normales:</p>
+
+<ul>
+ <li><code>appName</code></li>
+ <li><code>appVersion</code></li>
+ <li><code>platform</code></li>
+ <li><code>userAgent</code></li>
+</ul>
+
+<h2 id="Importing_scripts_and_libraries">Importing scripts and libraries</h2>
+
+<p>Worker threads have access to a global function, <code>importScripts()</code> , which lets them import scripts or libraries into their scope.  It accepts as parameters zero or more URIs to resources to import; all of the following examples are valid:</p>
+
+<pre class="brush: js notranslate">importScripts();                        /* imports nothing */
+importScripts('foo.js');                /* imports just "foo.js" */
+importScripts('foo.js', 'bar.js');      /* imports two scripts */
+</pre>
+
+<p>The browser loads each listed script and executes it. Any global objects from each script may then be used by the worker. If the script can't be loaded, <code>NETWORK_ERROR</code> is thrown, and subsequent code will not be executed. Previously executed code (including code deferred using {{ domxref("window.setTimeout()") }}) will still be functional though. Function declarations <strong>after</strong> the <code>importScripts()</code> method are also kept, since these are always evaluated before the rest of the code.</p>
+
+<div class="note"><strong>Note:</strong> Scripts may be downloaded in any order, but will be executed in the order in which you pass the filenames into <code>importScripts()</code> .  This is done synchronously; <code>importScripts()</code> does not return until all the scripts have been loaded and executed.</div>
+
+<h2 id="Examples">Examples</h2>
+
+<p>This section provides several examples of how to use DOM workers.</p>
+
+<h3 id="Performing_computations_in_the_background">Performing computations in the background</h3>
+
+<p>One way workers are useful is to allow your code to perform processor-intensive calculations without blocking the user interface thread.  In this example, a worker is used to calculate Fibonacci numbers.</p>
+
+<h4 id="The_JavaScript_code">The JavaScript code</h4>
+
+<p>The following JavaScript code is stored in the "fibonacci.js" file referenced by the HTML in the next section.</p>
+
+<pre class="brush: js notranslate">var results = [];
+
+function resultReceiver(event) {
+  results.push(parseInt(event.data));
+  if (results.length == 2) {
+    postMessage(results[0] + results[1]);
+  }
+}
+
+function errorReceiver(event) {
+  throw event.data;
+}
+
+onmessage = function(event) {
+  var n = parseInt(event.data);
+
+  if (n == 0 || n == 1) {
+    postMessage(n);
+    return;
+  }
+
+  for (var i = 1; i &lt;= 2; i++) {
+    var worker = new Worker("fibonacci.js");
+    worker.onmessage = resultReceiver;
+    worker.onerror = errorReceiver;
+    worker.postMessage(n - i);
+  }
+ };</pre>
+
+<p>The worker sets the property <code>onmessage</code>  to a function which will receive messages sent when the worker object's  <code>postMessage()</code> is called.  (Note that this differs from defining a global <em>variable</em> of that name, or defining a <em>function</em> with that name.   <code>var onmessage</code> and <code>function onmessage</code> will define global properties with those names, but they will not register the function to receive messages sent by the  web page that created the worker.)  This starts the recursion, spawning new copies of itself to handle each iteration of the calculation.</p>
+
+<h4 id="The_HTML_code">The HTML code</h4>
+
+<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;meta charset="UTF-8"  /&gt;
+    &lt;title&gt;Test threads fibonacci&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+
+  &lt;div id="result"&gt;&lt;/div&gt;
+
+  &lt;script language="javascript"&gt;
+
+    var worker = new Worker("fibonacci.js");
+
+    worker.onmessage = function(event) {
+      document.getElementById("result").textContent = event.data;
+      dump("Got: " + event.data + "\n");
+    };
+
+    worker.onerror = function(error) {
+      dump("Worker error: " + error.message + "\n");
+      throw error;
+    };
+
+    worker.postMessage("5");
+
+  &lt;/script&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>The web page creates a <code>div</code> element with the ID  <code>result</code> , which gets used to display the result, then spawns the worker.  After spawning the worker, the <code>onmessage</code> handler is configured to display the results by setting the contents of the <code>div</code> element, and the <code>onerror</code> handler is set to <a class="external" href="/en/Debugging_JavaScript#dump()" title="https://developer.mozilla.org/editor/fckeditor/core/editor/en/Debugging_JavaScript#dump()">dump</a> the error message.</p>
+
+<p>Finally, a message is sent to the worker to start it.</p>
+
+<p><a class="external" href="/samples/workers/fibonacci" title="https://developer.mozilla.org/samples/workers/fibonacci/">Try this example</a> .</p>
+
+<h3 id="Performing_web_IO_in_the_background">Performing web I/O in the background</h3>
+
+<p>You can find an example of this in the article <a class="internal" href="/En/Using_workers_in_extensions" title="En/Using workers in extensions">Using workers in extensions</a> .</p>
+
+<h3 id="Dividing_tasks_among_multiple_workers">Dividing tasks among multiple workers</h3>
+
+<p>As multi-core computers become increasingly common, it's often useful to divide computationally complex tasks among multiple workers, which may then perform those tasks on multiple-processor cores.</p>
+
+<p>example coming soon</p>
+
+<h3 id="Creating_workers_from_within_workers">Creating workers from within workers</h3>
+
+<p>The Fibonacci example shown previously demonstrates that workers can in fact <a href="#Spawning_subworkers">spawn additional workers</a>.  This makes it easy to create recursive routines.</p>
+
+<h2 id="Browser_Compatibility" name="Browser_Compatibility">Browser compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Dedicated workers</td>
+   <td>{{CompatChrome(3)}}</td>
+   <td>{{CompatGeckoDesktop(1.9.1)}}</td>
+   <td>{{CompatIE(10)}}</td>
+   <td>{{CompatOpera(10.60)}}</td>
+   <td>{{CompatSafari(4)}}</td>
+  </tr>
+  <tr>
+   <td>Shared workers</td>
+   <td>{{CompatChrome(3)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera(10.60)}}</td>
+   <td>{{CompatSafari(5)}}</td>
+  </tr>
+  <tr>
+   <td>Passing data using <a href="/en/DOM/The_structured_clone_algorithm" title="The structured clone algorithm">structured cloning</a> . </td>
+   <td>{{CompatChrome(13)}}</td>
+   <td>{{CompatGeckoDesktop(8)}}</td>
+   <td>{{CompatIE(10)}}</td>
+   <td>{{CompatOpera(11.50)}}</td>
+   <td>{{CompatSafari(5.1)}}</td>
+  </tr>
+  <tr>
+   <td>Passing data using  <a class="external" href="http://www.w3.org/html/wg/drafts/html/master/infrastructure.html#transferable-objects" title="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects">transferable objects</a></td>
+   <td>17 {{ property_prefix("webkit") }}<br>
+    {{CompatChrome(21)}}</td>
+   <td>{{CompatGeckoDesktop(18)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera(15)}}</td>
+   <td>{{CompatSafari(6)}}</td>
+  </tr>
+  <tr>
+   <td>Global {{ domxref("window.URL", "URL") }}</td>
+   <td>10 as <code>webkitURL</code><br>
+    {{CompatChrome(23)}}</td>
+   <td>{{CompatGeckoDesktop(21)}}</td>
+   <td>{{CompatIE(11)}}</td>
+   <td>{{CompatOpera(15)}}</td>
+   <td>6 as <code>webkitURL</code></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Dedicated workers</td>
+   <td>---</td>
+   <td>0.16</td>
+   <td>3.5 (1.9.1)</td>
+   <td>---</td>
+   <td>11</td>
+   <td>5</td>
+  </tr>
+  <tr>
+   <td>Shared workers</td>
+   <td>---</td>
+   <td>{{ CompatNo() }}</td>
+   <td>---</td>
+   <td>---</td>
+   <td>---</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>Passing data using <a href="/en/DOM/The_structured_clone_algorithm" title="The structured clone algorithm">structured cloning</a> . </td>
+   <td>---</td>
+   <td>0.16</td>
+   <td>8</td>
+   <td>---</td>
+   <td>---</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>Passing data using  <a class="external" href="http://www.w3.org/html/wg/drafts/html/master/infrastructure.html#transferable-objectshtml#transferable-objects" title="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects">transferable objects</a></td>
+   <td>---</td>
+   <td></td>
+   <td>18</td>
+   <td>---</td>
+   <td>---</td>
+   <td>---</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{ spec("http://dev.w3.org/html5/workers/", "File API Specification: Web Workers", "ED") }}</li>
+ <li><code><a class="internal" href="/en/DOM/Worker" title="En/DOM/Worker">Worker</a></code> interface</li>
+ <li><code><a class="internal" href="/en/DOM/SharedWorker" title="En/DOM/SharedWorker">SharedWorker</a></code> interface</li>
+ <li><a href="/en/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Functions available to workers</a></li>
+ <li><a class="external" href="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers" title="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers">HTML5Rocks - The Basics of Web Workers</a></li>
+ <li><a class="external" href="http://code.google.com/p/chromium/issues/detail?id=127990" title="Chrome has Problems with many workers">Chrome has problems when using too many worker</a></li>
+</ul>
diff --git a/files/es/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html b/files/es/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html
new file mode 100644
index 0000000000..0119b61a22
--- /dev/null
+++ b/files/es/web/api/webgl_api/tutorial/creating_3d_objects_using_webgl/index.html
@@ -0,0 +1,134 @@
+---
+title: Creación de objetos 3D utilizando WebGL
+slug: Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL
+tags:
+  - Cubo 3D
+  - Objetos 3D
+  - Tutorial
+  - WebGL
+translation_of: Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL
+original_slug: Web/API/WebGL_API/Tutorial/Objetos_3D_utilizando_WebGL
+---
+<p>{{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL", "Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL")}}</p>
+
+<p>Vamos a llevar nuestro cuadrado hacia la tercera dimensión agregando cinco caras más para crear el cubo. Para hacer esto de manera eficiente, vamos a cambiar el dibujado por medio de vertices utilizando el método {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}}<code> </code>por el uso de un arreglo de vértices como tabla, esto por medio del llamado hacia   {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}.</p>
+
+<p>Considerar: cada cara cuatro vértices para su definición, pero cada vértice es compartido por 3 caras. Realizando una lista con los 24 vértices es como nosotros haremos un menor intercambio de datos, después haremos referencia hacia cada vértic por medio se su índice en la lista en lugar de pasar el juego entero de coordenadas. Si te preguntas por qué necesitamos 24 vértices, y no solo 8, es porque cada esquina pertenece a tres caras de diferente color, y un solo vértice necesita tener un solo color específico, por lo tanto crearemos 3 copias de cada vértice en tres colores diferentes, uno por cada cara.</p>
+
+<h2 id="Definir_la_posición_de_los_vértices_del_cubo">Definir la posición de los vértices del cubo</h2>
+
+<p>Primero, construiremos el buffer para la posición de los vértices actualizando el código en <code>initBuffers()</code>. Esto es muy parecido a lo como si fuera para el cuadraro, pero más lardo debido a que ahora son 24 vértices (4 por lado):</p>
+
+<pre class="brush: js">var vertices = [
+  // Cara delantera
+  -1.0, -1.0,  1.0,
+   1.0, -1.0,  1.0,
+   1.0,  1.0,  1.0,
+  -1.0,  1.0,  1.0,
+
+  // Cara trasera
+  -1.0, -1.0, -1.0,
+  -1.0,  1.0, -1.0,
+   1.0,  1.0, -1.0,
+   1.0, -1.0, -1.0,
+
+  // Top face
+  -1.0,  1.0, -1.0,
+  -1.0,  1.0,  1.0,
+   1.0,  1.0,  1.0,
+   1.0,  1.0, -1.0,
+
+  // Bottom face
+  -1.0, -1.0, -1.0,
+   1.0, -1.0, -1.0,
+   1.0, -1.0,  1.0,
+  -1.0, -1.0,  1.0,
+
+  // Right face
+   1.0, -1.0, -1.0,
+   1.0,  1.0, -1.0,
+   1.0,  1.0,  1.0,
+   1.0, -1.0,  1.0,
+
+  // Left face
+  -1.0, -1.0, -1.0,
+  -1.0, -1.0,  1.0,
+  -1.0,  1.0,  1.0,
+  -1.0,  1.0, -1.0
+];
+</pre>
+
+<h2 id="Definir_los_colores_de_los_vértices">Definir los colores de los vértices</h2>
+
+<p>Necesitamos construir un arreglo de colores por cada uno de los 24 vertices. Este código comienza por definir un color para cada cara, después utiliza un ciclo para ensamblar el arreglo de colores por cada uno de los vértices.</p>
+
+<pre class="brush: js">var colors = [
+  [1.0,  1.0,  1.0,  1.0],    // Cara delantera: blanco
+  [1.0,  0.0,  0.0,  1.0],    // Cara trasera: rojo
+  [0.0,  1.0,  0.0,  1.0],    // Cara superior: verde
+  [0.0,  0.0,  1.0,  1.0],    // Cara inferior: azul
+  [1.0,  1.0,  0.0,  1.0],    // Cara derecha: amarillo
+  [1.0,  0.0,  1.0,  1.0]     // Cara izquierda: morado
+];
+
+var generatedColors = [];
+
+for (j=0; j&lt;6; j++) {
+  var c = colors[j];
+
+  for (var i=0; i&lt;4; i++) {
+    generatedColors = generatedColors.concat(c);
+  }
+}
+
+var cubeVerticesColorBuffer = gl.createBuffer();
+gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesColorBuffer);
+gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(generatedColors), gl.STATIC_DRAW);
+</pre>
+
+<h2 id="Definir_el_elemento_arreglo">Definir el elemento arreglo</h2>
+
+<p>Una ves que el vértice es generado, nosotros necesitamos contruir el elemento arreglo.</p>
+
+<pre class="brush: js">var cubeVerticesIndexBuffer = gl.createBuffer();
+gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVerticesIndexBuffer);
+
+// Este arrelgo define cada cara como 2 triángulos utilizando
+// los índices dentro de cada arreglo de vértices
+// para especificar cada posición en los tríangulos.
+
+var cubeVertexIndices = [
+  0,  1,  2,      0,  2,  3,    // enfrente
+  4,  5,  6,      4,  6,  7,    // atrás
+  8,  9,  10,     8,  10, 11,   // arriba
+  12, 13, 14,     12, 14, 15,   // fondo
+  16, 17, 18,     16, 18, 19,   // derecha
+  20, 21, 22,     20, 22, 23    // izquierda
+];
+
+// Ahora enviamos el elemento arreglo a  GL
+
+gl.bufferData(gl.ELEMENT_ARRAY_BUFFER,
+    new Uint16Array(cubeVertexIndices), gl.STATIC_DRAW);
+</pre>
+
+<p>El arreglo <code>cubeVertexIndices</code> define cada cara como un par de triángulos, especificando cada vértice del triángulo como un índice dentro del arreglo de vértices en el cubo. Así el cubo es descrito como una colección de 12 triángulos. </p>
+
+<h2 id="Dibujando_el_cubo">Dibujando el cubo</h2>
+
+<p>Para continuar necesitaremos agregar el código a nuestra función <code>drawScene()</code> esto para poder dibujar utilizando el buffer índice del cubo, agregaremos un nuevo llamado a  {{domxref("WebGLRenderingContext.bindBuffer()", "gl.bindBuffer()")}}  y {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}como se muestra a continuación:</p>
+
+<pre class="brush: js">gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVerticesIndexBuffer);
+setMatrixUniforms();
+gl.drawElements(gl.TRIANGLES, 36, gl.UNSIGNED_SHORT, 0);
+</pre>
+
+<p>Desde que cada cara de nuestro cubo está compuesto de dos triángulos, tenemos 6 vértices en el cubo, se podría pensar que algunos de ellos son duplicados. Sin embargo, desde que nuestro arreglo índice se encuentra compuesto de enteros simples, esto no es una cantidad excesiva de intercambio de datos para pasar por cada cuadro de la animación.</p>
+
+<p>En este punto ahora tenemos un cubo animado rebotando y rotando, cuenta con seis caras coloreadas vívidamente.</p>
+
+<p>{{EmbedGHLiveSample('webgl-examples/tutorial/sample5/index.html', 670, 510) }}</p>
+
+<p><a href="https://github.com/mdn/webgl-examples/tree/gh-pages/tutorial/sample5">Ver el Código completo</a> | <a href="http://mdn.github.io/webgl-examples/tutorial/sample5/">Abrir esta demostración en una página nueva</a></p>
+
+<p>{{PreviousNext("Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL", "Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL")}}</p>
diff --git a/files/es/web/api/webgl_api/tutorial/objetos_3d_utilizando_webgl/index.html b/files/es/web/api/webgl_api/tutorial/objetos_3d_utilizando_webgl/index.html
deleted file mode 100644
index 91e6bf3d37..0000000000
--- a/files/es/web/api/webgl_api/tutorial/objetos_3d_utilizando_webgl/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: Creación de objetos 3D utilizando WebGL
-slug: Web/API/WebGL_API/Tutorial/Objetos_3D_utilizando_WebGL
-tags:
-  - Cubo 3D
-  - Objetos 3D
-  - Tutorial
-  - WebGL
-translation_of: Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL
----
-<p>{{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL", "Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL")}}</p>
-
-<p>Vamos a llevar nuestro cuadrado hacia la tercera dimensión agregando cinco caras más para crear el cubo. Para hacer esto de manera eficiente, vamos a cambiar el dibujado por medio de vertices utilizando el método {{domxref("WebGLRenderingContext.drawArrays()", "gl.drawArrays()")}}<code> </code>por el uso de un arreglo de vértices como tabla, esto por medio del llamado hacia   {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}.</p>
-
-<p>Considerar: cada cara cuatro vértices para su definición, pero cada vértice es compartido por 3 caras. Realizando una lista con los 24 vértices es como nosotros haremos un menor intercambio de datos, después haremos referencia hacia cada vértic por medio se su índice en la lista en lugar de pasar el juego entero de coordenadas. Si te preguntas por qué necesitamos 24 vértices, y no solo 8, es porque cada esquina pertenece a tres caras de diferente color, y un solo vértice necesita tener un solo color específico, por lo tanto crearemos 3 copias de cada vértice en tres colores diferentes, uno por cada cara.</p>
-
-<h2 id="Definir_la_posición_de_los_vértices_del_cubo">Definir la posición de los vértices del cubo</h2>
-
-<p>Primero, construiremos el buffer para la posición de los vértices actualizando el código en <code>initBuffers()</code>. Esto es muy parecido a lo como si fuera para el cuadraro, pero más lardo debido a que ahora son 24 vértices (4 por lado):</p>
-
-<pre class="brush: js">var vertices = [
-  // Cara delantera
-  -1.0, -1.0,  1.0,
-   1.0, -1.0,  1.0,
-   1.0,  1.0,  1.0,
-  -1.0,  1.0,  1.0,
-
-  // Cara trasera
-  -1.0, -1.0, -1.0,
-  -1.0,  1.0, -1.0,
-   1.0,  1.0, -1.0,
-   1.0, -1.0, -1.0,
-
-  // Top face
-  -1.0,  1.0, -1.0,
-  -1.0,  1.0,  1.0,
-   1.0,  1.0,  1.0,
-   1.0,  1.0, -1.0,
-
-  // Bottom face
-  -1.0, -1.0, -1.0,
-   1.0, -1.0, -1.0,
-   1.0, -1.0,  1.0,
-  -1.0, -1.0,  1.0,
-
-  // Right face
-   1.0, -1.0, -1.0,
-   1.0,  1.0, -1.0,
-   1.0,  1.0,  1.0,
-   1.0, -1.0,  1.0,
-
-  // Left face
-  -1.0, -1.0, -1.0,
-  -1.0, -1.0,  1.0,
-  -1.0,  1.0,  1.0,
-  -1.0,  1.0, -1.0
-];
-</pre>
-
-<h2 id="Definir_los_colores_de_los_vértices">Definir los colores de los vértices</h2>
-
-<p>Necesitamos construir un arreglo de colores por cada uno de los 24 vertices. Este código comienza por definir un color para cada cara, después utiliza un ciclo para ensamblar el arreglo de colores por cada uno de los vértices.</p>
-
-<pre class="brush: js">var colors = [
-  [1.0,  1.0,  1.0,  1.0],    // Cara delantera: blanco
-  [1.0,  0.0,  0.0,  1.0],    // Cara trasera: rojo
-  [0.0,  1.0,  0.0,  1.0],    // Cara superior: verde
-  [0.0,  0.0,  1.0,  1.0],    // Cara inferior: azul
-  [1.0,  1.0,  0.0,  1.0],    // Cara derecha: amarillo
-  [1.0,  0.0,  1.0,  1.0]     // Cara izquierda: morado
-];
-
-var generatedColors = [];
-
-for (j=0; j&lt;6; j++) {
-  var c = colors[j];
-
-  for (var i=0; i&lt;4; i++) {
-    generatedColors = generatedColors.concat(c);
-  }
-}
-
-var cubeVerticesColorBuffer = gl.createBuffer();
-gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesColorBuffer);
-gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(generatedColors), gl.STATIC_DRAW);
-</pre>
-
-<h2 id="Definir_el_elemento_arreglo">Definir el elemento arreglo</h2>
-
-<p>Una ves que el vértice es generado, nosotros necesitamos contruir el elemento arreglo.</p>
-
-<pre class="brush: js">var cubeVerticesIndexBuffer = gl.createBuffer();
-gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVerticesIndexBuffer);
-
-// Este arrelgo define cada cara como 2 triángulos utilizando
-// los índices dentro de cada arreglo de vértices
-// para especificar cada posición en los tríangulos.
-
-var cubeVertexIndices = [
-  0,  1,  2,      0,  2,  3,    // enfrente
-  4,  5,  6,      4,  6,  7,    // atrás
-  8,  9,  10,     8,  10, 11,   // arriba
-  12, 13, 14,     12, 14, 15,   // fondo
-  16, 17, 18,     16, 18, 19,   // derecha
-  20, 21, 22,     20, 22, 23    // izquierda
-];
-
-// Ahora enviamos el elemento arreglo a  GL
-
-gl.bufferData(gl.ELEMENT_ARRAY_BUFFER,
-    new Uint16Array(cubeVertexIndices), gl.STATIC_DRAW);
-</pre>
-
-<p>El arreglo <code>cubeVertexIndices</code> define cada cara como un par de triángulos, especificando cada vértice del triángulo como un índice dentro del arreglo de vértices en el cubo. Así el cubo es descrito como una colección de 12 triángulos. </p>
-
-<h2 id="Dibujando_el_cubo">Dibujando el cubo</h2>
-
-<p>Para continuar necesitaremos agregar el código a nuestra función <code>drawScene()</code> esto para poder dibujar utilizando el buffer índice del cubo, agregaremos un nuevo llamado a  {{domxref("WebGLRenderingContext.bindBuffer()", "gl.bindBuffer()")}}  y {{domxref("WebGLRenderingContext.drawElements()", "gl.drawElements()")}}como se muestra a continuación:</p>
-
-<pre class="brush: js">gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVerticesIndexBuffer);
-setMatrixUniforms();
-gl.drawElements(gl.TRIANGLES, 36, gl.UNSIGNED_SHORT, 0);
-</pre>
-
-<p>Desde que cada cara de nuestro cubo está compuesto de dos triángulos, tenemos 6 vértices en el cubo, se podría pensar que algunos de ellos son duplicados. Sin embargo, desde que nuestro arreglo índice se encuentra compuesto de enteros simples, esto no es una cantidad excesiva de intercambio de datos para pasar por cada cuadro de la animación.</p>
-
-<p>En este punto ahora tenemos un cubo animado rebotando y rotando, cuenta con seis caras coloreadas vívidamente.</p>
-
-<p>{{EmbedGHLiveSample('webgl-examples/tutorial/sample5/index.html', 670, 510) }}</p>
-
-<p><a href="https://github.com/mdn/webgl-examples/tree/gh-pages/tutorial/sample5">Ver el Código completo</a> | <a href="http://mdn.github.io/webgl-examples/tutorial/sample5/">Abrir esta demostración en una página nueva</a></p>
-
-<p>{{PreviousNext("Web/API/WebGL_API/Tutorial/Animating_objects_with_WebGL", "Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL")}}</p>
diff --git a/files/es/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html b/files/es/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html
new file mode 100644
index 0000000000..01b77bdbad
--- /dev/null
+++ b/files/es/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html
@@ -0,0 +1,210 @@
+---
+title: Utilizando texturas en WebGL
+slug: Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL
+tags:
+  - Texturas
+  - Tutorial
+  - WebGL
+translation_of: Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL
+original_slug: Web/API/WebGL_API/Tutorial/Wtilizando_texturas_en_WebGL
+---
+<p>{{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL", "Web/API/WebGL_API/Tutorial/Lighting_in_WebGL")}}</p>
+
+<p>Ahora que nuestro programa de prueba tiene un cubo, asignemos una textura en lugar de tener sus caras de un color solido.</p>
+
+<h2 id="Cargando_texturas">Cargando texturas</h2>
+
+<p>La primera cosa que debemos hacer es añadir el codigo para cargar nuestra textura. en nuestro caso, estaremos usando una unica textura, asignada en las seis caras de nuestro cubo rotador, pero la misma tecnica puede ser utilizada para cualquier cantidad de texturas.</p>
+
+<div class="note"><strong>Note:</strong> Es importante señalar que la carga de texturas sigue <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS">reglas de dominio-cruzado</a>; Es decir, sólo puede cargar texturas de sitios para los que su contenido tiene aprobación de CORS. Vea las texturas entre dominios a continuación para más detalles.</div>
+
+<p>El codigo que carga la textura se ve como esto:</p>
+
+<pre class="brush: js">function initTextures() {
+  cubeTexture = gl.createTexture();
+  cubeImage = new Image();
+  cubeImage.onload = function() { handleTextureLoaded(cubeImage, cubeTexture); }
+  cubeImage.src = 'cubetexture.png';
+}
+
+function handleTextureLoaded(image, texture) {
+  gl.bindTexture(gl.TEXTURE_2D, texture);
+  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST);
+  gl.generateMipmap(gl.TEXTURE_2D);
+  gl.bindTexture(gl.TEXTURE_2D, null);
+}
+</pre>
+
+<p><code><font face="Open Sans, Arial, sans-serif">La rutina </font>initTextures()</code> comienza por crear el GL texture cubeTexture llamando la rutina GL {{domxref("WebGLRenderingContext.createTexture()", "createTexture()")}}. Para cargar la textura desde un archivo de imagen, este luego crea un Objeto Imagen y carga en él el archivo de imagen que deseamos utilizar como nuestra textura. La rutina <code>handleTextureLoaded()</code> corre cuando la textura ha terminado de cargar.</p>
+
+<p>Para realmente crear la textura, especificamos que la nueva textura es la textura actual en la que queremos operar vinculándola a gl.TEXTURE_2D. Despues de esto, la imagen cargada es pasada a  {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}} para escribir la informacion de la imagen en la textura.</p>
+
+<div class="note"><strong>Nota: El alto y hancho de las texturas deben, en la mayoría de las circunstancias, ser una potencia de dos píxeles (es decir, 1, 2, 4, 8, 16, etc.) en cada dimensión. Para la excepción, vea la sección: <a href="https://developer.mozilla.org/en-US/docs/Web/WebGL/Using_textures_in_WebGL#Non_power-of-two_textures">"Texturas no potencia de dos"</a>, a continuación.</strong></div>
+
+<p>Las siguientes dos líneas setean el filtrado para la textura; Esto controla cómo se filtra la imagen mientras se escala. En este caso estamos usando linear filtering cuando escala la imagen, y mipmap cuando se hace mas pequeña. Entonces el mipmap es generado llamando {{domxref("WebGLRenderingContext.generateMipMap()", "generateMipMap()")}}, Y terminamos diciéndole a WebGL que hemos terminado de manipular la textura vinculando null a gl.TEXTURE_2D.</p>
+
+<h3 id="Texturas_no_potencia-de-dos">Texturas no potencia-de-dos</h3>
+
+<p>Generalmente hablando, Utilizar texturas cuyos lados son una potencia de dos es ideal. Están almacenadas eficientemente en la memoria de video y no están restringidas en cómo podrían ser utilizadas. Las texturas creadas por el artista deben ser escaladas hacia arriba o hacia abajo a una potencia cercana a dos y, realmente, debería haber sido creada en potencia-de-dos para empezar. Cada lado debe ser: 1, 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024 ó 2048 píxeles. Muchos dispositivos, pero no todos, pueden soportar 4096 píxeles; Algunos pueden soportar 8192 e incluso más.</p>
+
+<p>Ocasionalmente, es difícil utilizar texturas en potencia-de-dos dada una circunstancia especifica. Si la fuente es alguna tercera parte, A menudo los mejores resultados vienen de modificar las imágenes usando canvas HTML5 en tamaños de potencia-de-dos antes de que se pasen a WebGL; Las coordenadas UV también pueden requerir ajuste si el estiramiento es notorio.</p>
+
+<p>Pero, Si tiene que tener una textura no-potencia-de-dos (NPOT = no-power-of-two), WebGL incluye un limitado soporte nativo. Las texturas NPOT son en su mayoría útiles si las dimensiones de la textura debe ser la misma resolución que otra cosa, como la resolución de tu monitor, o si no vale la pena molestarse por las sugerencias anteriores. Resumiendo: estas texturas no se pueden usar con mipmapping y no deben repetirse (tile o wrap).</p>
+
+<p>Un ejemplo de una textura es tilear una imagen de unos ladrillos para cubrir una pared de ladrillos.</p>
+
+<p>Mipmapping y "UV tiling" pueden ser desactivados utilizando {{domxref("WebGLRenderingContext.texParameter()", "texParameteri()")}} y cuando creas tu textura utilizando {{domxref("WebGLRenderingContext.bindTexture()", "bindTexture()")}}. Ésto permitirá las texturas NPOT a expensas de mipmapping, UV wrapping, UV tiling, y tu control sobre cómo el dispositivo procederá a manejar tu textura.</p>
+
+<pre class="brush: js">// gl.NEAREST is also allowed, instead of gl.LINEAR, as neither mipmap.
+gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+// Prevents s-coordinate wrapping (repeating).
+gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+// Prevents t-coordinate wrapping (repeating).
+gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);</pre>
+
+<p>Una vez más, con estos parámetros, los dispositivos compatibles con WebGL aceptarán automáticamente cualquier resolución para esa textura (hasta sus dimensiones máximas). Sin realizar la configuración anterior, WebGL requiere que todas las muestras de texturas NPOT fallen al devolver el color "negro sólido": rgba (0,0,0,1).</p>
+
+<h2 id="Mapeando_la_textura_en_las_caras">Mapeando la textura en las caras</h2>
+
+<p>A este punto, la textura esta cargada y lista para usar. pero antes de utilizarla, Necesitamos asignar el mapeo de las coordenadas de textura a los vértices de las caras de nuestro cubo. Esto reemplaza todo el código previamente existente para configurar colores para cada una de las caras del cubo en initBuffers().</p>
+
+<pre class="brush: js">cubeVerticesTextureCoordBuffer = gl.createBuffer();
+gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesTextureCoordBuffer);
+
+var textureCoordinates = [
+  // Front
+  0.0,  0.0,
+  1.0,  0.0,
+  1.0,  1.0,
+  0.0,  1.0,
+  // Back
+  0.0,  0.0,
+  1.0,  0.0,
+  1.0,  1.0,
+  0.0,  1.0,
+  // Top
+  0.0,  0.0,
+  1.0,  0.0,
+  1.0,  1.0,
+  0.0,  1.0,
+  // Bottom
+  0.0,  0.0,
+  1.0,  0.0,
+  1.0,  1.0,
+  0.0,  1.0,
+  // Right
+  0.0,  0.0,
+  1.0,  0.0,
+  1.0,  1.0,
+  0.0,  1.0,
+  // Left
+  0.0,  0.0,
+  1.0,  0.0,
+  1.0,  1.0,
+  0.0,  1.0
+];
+
+gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(textureCoordinates),
+              gl.STATIC_DRAW);
+</pre>
+
+<p>Primeramente, este codigo crea un GL buffer en el cual almacenaremos las coordenadas de la textura para cada cara, luego enlazamos ese buffer como el array en el cual escribiremos.</p>
+
+<p>El array textureCoordinates define las coordenadas de textura correspondientes a cada vértice de cada cara. Tenga en cuenta que las coordenadas de textura van de 0,0 a 1,0; Las dimensiones de las texturas se normalizan a un rango de 0,0 a 1,0 independientemente de su tamaño real, con el propósito de mapeo de textura.</p>
+
+<p>Una vez que hemos seteado la matriz de mapeo de textura, pasamos la matriz al búfer, de modo que GL tiene esos datos listos para su uso.</p>
+
+<h2 id="Actualizando_los_shaders">Actualizando los shaders</h2>
+
+<p>El shader -- y el código que inicializa los shaders -- también necesita ser actualizado para utilizar la textura en vez de un color solido.</p>
+
+<p>Primero, echemos un vistazo a un cambio muy sencillo que se necesita en initShaders():</p>
+
+<pre class="brush: js">textureCoordAttribute = gl.getAttribLocation(shaderProgram, 'aTextureCoord');
+gl.enableVertexAttribArray(textureCoordAttribute);
+gl.vertexAttribPointer(texCoordAttribute, 2, gl.FLOAT, false, 0, 0);
+</pre>
+
+<p>Esto reemplaza el código que setea el atributo "vertex color" (color del vertice) con uno que contiene la coordenada de textura para cada vértice.</p>
+
+<h3 id="El_vertex_shader">El vertex shader</h3>
+
+<p>A continuación, necesitamos reemplazar el "vertex shader" de modo que en lugar de buscar datos de color, busque los datos de coordenadas de textura.</p>
+
+<pre class="brush: html">&lt;script id="shader-vs" type="x-shader/x-vertex"&gt;
+  attribute vec3 aVertexPosition;
+  attribute vec2 aTextureCoord;
+
+  uniform mat4 uMVMatrix;
+  uniform mat4 uPMatrix;
+
+  varying highp vec2 vTextureCoord;
+
+  void main(void) {
+    gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);
+    vTextureCoord = aTextureCoord;
+  }
+&lt;/script&gt;
+</pre>
+
+<p>El cambio clave aquí es que en lugar de buscar el color del vértice (vertex color), estamos estableciendo las coordenadas de textura; Esto indicará la ubicación dentro de la textura correspondiente al vértice.</p>
+
+<h3 id="El_fragment_shader">El fragment shader</h3>
+
+<p>El fragment shader también debe actualizarse:</p>
+
+<pre class="brush: html">&lt;script id="shader-fs" type="x-shader/x-fragment"&gt;
+  varying highp vec2 vTextureCoord;
+
+  uniform sampler2D uSampler;
+
+  void main(void) {
+    gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t));
+  }
+&lt;/script&gt;
+</pre>
+
+<p>En lugar de asignar un valor de color al fragment color, el fragment color se calcula recolectando el texel (es decir, el píxel dentro de la textura) que el muestreador dice que se corresponde mejor con la posición del fragment.</p>
+
+<h2 id="Dibujando_el_cubo_texturado">Dibujando el cubo texturado</h2>
+
+<p>El cambio a la función drawScene() es simple (excepto que por razones de claridad, he eliminado el código que hace que el cubo se traslade a través del espacio mientras se anima, en vez de eso, solo gira).</p>
+
+<p>El código para mapear colores a la textura se ha ido, sustituido por esto:</p>
+
+<pre class="brush: js">gl.activeTexture(gl.TEXTURE0);
+gl.bindTexture(gl.TEXTURE_2D, cubeTexture);
+gl.uniform1i(gl.getUniformLocation(shaderProgram, 'uSampler'), 0);
+</pre>
+
+<p>GL proporciona 32 registros de textura; La primera de ellas es gl.TEXTURE0. Vincularemos nuestra textura previamente cargada a ese registro, a continuación, establecremos el shader sampler uSampler (especificado en el shader) para utilizar esa textura.</p>
+
+<p>En este punto, el cubo giratorio debe estar listo.</p>
+
+<p>{{EmbedGHLiveSample('webgl-examples/tutorial/sample6/index.html', 670, 510) }}</p>
+
+<p><a href="https://github.com/mdn/webgl-examples/tree/gh-pages/tutorial/sample6">Ver el código completo</a> | <a href="http://mdn.github.io/webgl-examples/tutorial/sample6/">Abrir esta demo en una nueva pestaña</a></p>
+
+<h2 id="Texturas_entre_dominios">Texturas entre dominios</h2>
+
+<p>La carga de texturas WebGL esta sujeta a controles de acceso entre dominios. Para que su contenido cargue una textura de otro dominio, La aprobacion CORS debe ser obtenida. Ver <a href="/en-US/docs/Web/HTTP/Access_control_CORS">control de acceso HTTP</a> para mas detalles sobre CORS.</p>
+
+<p>Ver este articulo <a class="external" href="http://hacks.mozilla.org/2011/11/using-cors-to-load-webgl-textures-from-cross-domain-images/">hacks.mozilla.org</a> para una explicacion de como usar imágenes CORS-approved como texturas WebGL , con un <a class="external" href="http://people.mozilla.org/~bjacob/webgltexture-cors-js.html">ejemplo auto-contenido</a>.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>El soporte CORS para texturas WebGL y el atributo crossOrigin para elementos de imagen se implementan en {{Gecko ("8.0")}}.</p>
+</div>
+
+<p>Canvas 2D contaminados (Solo lectura) no pueden ser utilizados como texturas WebGL. una 2D {{ HTMLElement("canvas") }} se convierte en contaminada, por ejemplo, cuando una imagen de dominio cruzado (cross-domain) es dibujada en el.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>El soporte de CORS para Canvas 2D drawImage se implementa en {{Gecko ("9.0")}}. Esto significa que el uso de una imagen de dominio cruzado con aprobación de CORS ya no pinta el lienzo 2D, por lo que el lienzo 2D sigue siendo utilizable como fuente de una textura WebGL. </p>
+</div>
+
+<div class="note">
+<p><strong>Nota:</strong> El soporte de CORS para videos de dominio cruzado y el atributo de crossorigin para elementos {{HTMLElement("video")}} se implementa en {{Gecko ("12.0")}}.</p>
+</div>
+
+<p>{{PreviousNext("Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL", "Web/API/WebGL_API/Tutorial/Lighting_in_WebGL")}}</p>
diff --git a/files/es/web/api/webgl_api/tutorial/wtilizando_texturas_en_webgl/index.html b/files/es/web/api/webgl_api/tutorial/wtilizando_texturas_en_webgl/index.html
deleted file mode 100644
index 9d2be2d61b..0000000000
--- a/files/es/web/api/webgl_api/tutorial/wtilizando_texturas_en_webgl/index.html
+++ /dev/null
@@ -1,209 +0,0 @@
----
-title: Utilizando texturas en WebGL
-slug: Web/API/WebGL_API/Tutorial/Wtilizando_texturas_en_WebGL
-tags:
-  - Texturas
-  - Tutorial
-  - WebGL
-translation_of: Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL
----
-<p>{{WebGLSidebar("Tutorial")}} {{PreviousNext("Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL", "Web/API/WebGL_API/Tutorial/Lighting_in_WebGL")}}</p>
-
-<p>Ahora que nuestro programa de prueba tiene un cubo, asignemos una textura en lugar de tener sus caras de un color solido.</p>
-
-<h2 id="Cargando_texturas">Cargando texturas</h2>
-
-<p>La primera cosa que debemos hacer es añadir el codigo para cargar nuestra textura. en nuestro caso, estaremos usando una unica textura, asignada en las seis caras de nuestro cubo rotador, pero la misma tecnica puede ser utilizada para cualquier cantidad de texturas.</p>
-
-<div class="note"><strong>Note:</strong> Es importante señalar que la carga de texturas sigue <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS">reglas de dominio-cruzado</a>; Es decir, sólo puede cargar texturas de sitios para los que su contenido tiene aprobación de CORS. Vea las texturas entre dominios a continuación para más detalles.</div>
-
-<p>El codigo que carga la textura se ve como esto:</p>
-
-<pre class="brush: js">function initTextures() {
-  cubeTexture = gl.createTexture();
-  cubeImage = new Image();
-  cubeImage.onload = function() { handleTextureLoaded(cubeImage, cubeTexture); }
-  cubeImage.src = 'cubetexture.png';
-}
-
-function handleTextureLoaded(image, texture) {
-  gl.bindTexture(gl.TEXTURE_2D, texture);
-  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
-  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST);
-  gl.generateMipmap(gl.TEXTURE_2D);
-  gl.bindTexture(gl.TEXTURE_2D, null);
-}
-</pre>
-
-<p><code><font face="Open Sans, Arial, sans-serif">La rutina </font>initTextures()</code> comienza por crear el GL texture cubeTexture llamando la rutina GL {{domxref("WebGLRenderingContext.createTexture()", "createTexture()")}}. Para cargar la textura desde un archivo de imagen, este luego crea un Objeto Imagen y carga en él el archivo de imagen que deseamos utilizar como nuestra textura. La rutina <code>handleTextureLoaded()</code> corre cuando la textura ha terminado de cargar.</p>
-
-<p>Para realmente crear la textura, especificamos que la nueva textura es la textura actual en la que queremos operar vinculándola a gl.TEXTURE_2D. Despues de esto, la imagen cargada es pasada a  {{domxref("WebGLRenderingContext.texImage2D()", "texImage2D()")}} para escribir la informacion de la imagen en la textura.</p>
-
-<div class="note"><strong>Nota: El alto y hancho de las texturas deben, en la mayoría de las circunstancias, ser una potencia de dos píxeles (es decir, 1, 2, 4, 8, 16, etc.) en cada dimensión. Para la excepción, vea la sección: <a href="https://developer.mozilla.org/en-US/docs/Web/WebGL/Using_textures_in_WebGL#Non_power-of-two_textures">"Texturas no potencia de dos"</a>, a continuación.</strong></div>
-
-<p>Las siguientes dos líneas setean el filtrado para la textura; Esto controla cómo se filtra la imagen mientras se escala. En este caso estamos usando linear filtering cuando escala la imagen, y mipmap cuando se hace mas pequeña. Entonces el mipmap es generado llamando {{domxref("WebGLRenderingContext.generateMipMap()", "generateMipMap()")}}, Y terminamos diciéndole a WebGL que hemos terminado de manipular la textura vinculando null a gl.TEXTURE_2D.</p>
-
-<h3 id="Texturas_no_potencia-de-dos">Texturas no potencia-de-dos</h3>
-
-<p>Generalmente hablando, Utilizar texturas cuyos lados son una potencia de dos es ideal. Están almacenadas eficientemente en la memoria de video y no están restringidas en cómo podrían ser utilizadas. Las texturas creadas por el artista deben ser escaladas hacia arriba o hacia abajo a una potencia cercana a dos y, realmente, debería haber sido creada en potencia-de-dos para empezar. Cada lado debe ser: 1, 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024 ó 2048 píxeles. Muchos dispositivos, pero no todos, pueden soportar 4096 píxeles; Algunos pueden soportar 8192 e incluso más.</p>
-
-<p>Ocasionalmente, es difícil utilizar texturas en potencia-de-dos dada una circunstancia especifica. Si la fuente es alguna tercera parte, A menudo los mejores resultados vienen de modificar las imágenes usando canvas HTML5 en tamaños de potencia-de-dos antes de que se pasen a WebGL; Las coordenadas UV también pueden requerir ajuste si el estiramiento es notorio.</p>
-
-<p>Pero, Si tiene que tener una textura no-potencia-de-dos (NPOT = no-power-of-two), WebGL incluye un limitado soporte nativo. Las texturas NPOT son en su mayoría útiles si las dimensiones de la textura debe ser la misma resolución que otra cosa, como la resolución de tu monitor, o si no vale la pena molestarse por las sugerencias anteriores. Resumiendo: estas texturas no se pueden usar con mipmapping y no deben repetirse (tile o wrap).</p>
-
-<p>Un ejemplo de una textura es tilear una imagen de unos ladrillos para cubrir una pared de ladrillos.</p>
-
-<p>Mipmapping y "UV tiling" pueden ser desactivados utilizando {{domxref("WebGLRenderingContext.texParameter()", "texParameteri()")}} y cuando creas tu textura utilizando {{domxref("WebGLRenderingContext.bindTexture()", "bindTexture()")}}. Ésto permitirá las texturas NPOT a expensas de mipmapping, UV wrapping, UV tiling, y tu control sobre cómo el dispositivo procederá a manejar tu textura.</p>
-
-<pre class="brush: js">// gl.NEAREST is also allowed, instead of gl.LINEAR, as neither mipmap.
-gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
-// Prevents s-coordinate wrapping (repeating).
-gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
-// Prevents t-coordinate wrapping (repeating).
-gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);</pre>
-
-<p>Una vez más, con estos parámetros, los dispositivos compatibles con WebGL aceptarán automáticamente cualquier resolución para esa textura (hasta sus dimensiones máximas). Sin realizar la configuración anterior, WebGL requiere que todas las muestras de texturas NPOT fallen al devolver el color "negro sólido": rgba (0,0,0,1).</p>
-
-<h2 id="Mapeando_la_textura_en_las_caras">Mapeando la textura en las caras</h2>
-
-<p>A este punto, la textura esta cargada y lista para usar. pero antes de utilizarla, Necesitamos asignar el mapeo de las coordenadas de textura a los vértices de las caras de nuestro cubo. Esto reemplaza todo el código previamente existente para configurar colores para cada una de las caras del cubo en initBuffers().</p>
-
-<pre class="brush: js">cubeVerticesTextureCoordBuffer = gl.createBuffer();
-gl.bindBuffer(gl.ARRAY_BUFFER, cubeVerticesTextureCoordBuffer);
-
-var textureCoordinates = [
-  // Front
-  0.0,  0.0,
-  1.0,  0.0,
-  1.0,  1.0,
-  0.0,  1.0,
-  // Back
-  0.0,  0.0,
-  1.0,  0.0,
-  1.0,  1.0,
-  0.0,  1.0,
-  // Top
-  0.0,  0.0,
-  1.0,  0.0,
-  1.0,  1.0,
-  0.0,  1.0,
-  // Bottom
-  0.0,  0.0,
-  1.0,  0.0,
-  1.0,  1.0,
-  0.0,  1.0,
-  // Right
-  0.0,  0.0,
-  1.0,  0.0,
-  1.0,  1.0,
-  0.0,  1.0,
-  // Left
-  0.0,  0.0,
-  1.0,  0.0,
-  1.0,  1.0,
-  0.0,  1.0
-];
-
-gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(textureCoordinates),
-              gl.STATIC_DRAW);
-</pre>
-
-<p>Primeramente, este codigo crea un GL buffer en el cual almacenaremos las coordenadas de la textura para cada cara, luego enlazamos ese buffer como el array en el cual escribiremos.</p>
-
-<p>El array textureCoordinates define las coordenadas de textura correspondientes a cada vértice de cada cara. Tenga en cuenta que las coordenadas de textura van de 0,0 a 1,0; Las dimensiones de las texturas se normalizan a un rango de 0,0 a 1,0 independientemente de su tamaño real, con el propósito de mapeo de textura.</p>
-
-<p>Una vez que hemos seteado la matriz de mapeo de textura, pasamos la matriz al búfer, de modo que GL tiene esos datos listos para su uso.</p>
-
-<h2 id="Actualizando_los_shaders">Actualizando los shaders</h2>
-
-<p>El shader -- y el código que inicializa los shaders -- también necesita ser actualizado para utilizar la textura en vez de un color solido.</p>
-
-<p>Primero, echemos un vistazo a un cambio muy sencillo que se necesita en initShaders():</p>
-
-<pre class="brush: js">textureCoordAttribute = gl.getAttribLocation(shaderProgram, 'aTextureCoord');
-gl.enableVertexAttribArray(textureCoordAttribute);
-gl.vertexAttribPointer(texCoordAttribute, 2, gl.FLOAT, false, 0, 0);
-</pre>
-
-<p>Esto reemplaza el código que setea el atributo "vertex color" (color del vertice) con uno que contiene la coordenada de textura para cada vértice.</p>
-
-<h3 id="El_vertex_shader">El vertex shader</h3>
-
-<p>A continuación, necesitamos reemplazar el "vertex shader" de modo que en lugar de buscar datos de color, busque los datos de coordenadas de textura.</p>
-
-<pre class="brush: html">&lt;script id="shader-vs" type="x-shader/x-vertex"&gt;
-  attribute vec3 aVertexPosition;
-  attribute vec2 aTextureCoord;
-
-  uniform mat4 uMVMatrix;
-  uniform mat4 uPMatrix;
-
-  varying highp vec2 vTextureCoord;
-
-  void main(void) {
-    gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);
-    vTextureCoord = aTextureCoord;
-  }
-&lt;/script&gt;
-</pre>
-
-<p>El cambio clave aquí es que en lugar de buscar el color del vértice (vertex color), estamos estableciendo las coordenadas de textura; Esto indicará la ubicación dentro de la textura correspondiente al vértice.</p>
-
-<h3 id="El_fragment_shader">El fragment shader</h3>
-
-<p>El fragment shader también debe actualizarse:</p>
-
-<pre class="brush: html">&lt;script id="shader-fs" type="x-shader/x-fragment"&gt;
-  varying highp vec2 vTextureCoord;
-
-  uniform sampler2D uSampler;
-
-  void main(void) {
-    gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.s, vTextureCoord.t));
-  }
-&lt;/script&gt;
-</pre>
-
-<p>En lugar de asignar un valor de color al fragment color, el fragment color se calcula recolectando el texel (es decir, el píxel dentro de la textura) que el muestreador dice que se corresponde mejor con la posición del fragment.</p>
-
-<h2 id="Dibujando_el_cubo_texturado">Dibujando el cubo texturado</h2>
-
-<p>El cambio a la función drawScene() es simple (excepto que por razones de claridad, he eliminado el código que hace que el cubo se traslade a través del espacio mientras se anima, en vez de eso, solo gira).</p>
-
-<p>El código para mapear colores a la textura se ha ido, sustituido por esto:</p>
-
-<pre class="brush: js">gl.activeTexture(gl.TEXTURE0);
-gl.bindTexture(gl.TEXTURE_2D, cubeTexture);
-gl.uniform1i(gl.getUniformLocation(shaderProgram, 'uSampler'), 0);
-</pre>
-
-<p>GL proporciona 32 registros de textura; La primera de ellas es gl.TEXTURE0. Vincularemos nuestra textura previamente cargada a ese registro, a continuación, establecremos el shader sampler uSampler (especificado en el shader) para utilizar esa textura.</p>
-
-<p>En este punto, el cubo giratorio debe estar listo.</p>
-
-<p>{{EmbedGHLiveSample('webgl-examples/tutorial/sample6/index.html', 670, 510) }}</p>
-
-<p><a href="https://github.com/mdn/webgl-examples/tree/gh-pages/tutorial/sample6">Ver el código completo</a> | <a href="http://mdn.github.io/webgl-examples/tutorial/sample6/">Abrir esta demo en una nueva pestaña</a></p>
-
-<h2 id="Texturas_entre_dominios">Texturas entre dominios</h2>
-
-<p>La carga de texturas WebGL esta sujeta a controles de acceso entre dominios. Para que su contenido cargue una textura de otro dominio, La aprobacion CORS debe ser obtenida. Ver <a href="/en-US/docs/Web/HTTP/Access_control_CORS">control de acceso HTTP</a> para mas detalles sobre CORS.</p>
-
-<p>Ver este articulo <a class="external" href="http://hacks.mozilla.org/2011/11/using-cors-to-load-webgl-textures-from-cross-domain-images/">hacks.mozilla.org</a> para una explicacion de como usar imágenes CORS-approved como texturas WebGL , con un <a class="external" href="http://people.mozilla.org/~bjacob/webgltexture-cors-js.html">ejemplo auto-contenido</a>.</p>
-
-<div class="note">
-<p><strong>Nota: </strong>El soporte CORS para texturas WebGL y el atributo crossOrigin para elementos de imagen se implementan en {{Gecko ("8.0")}}.</p>
-</div>
-
-<p>Canvas 2D contaminados (Solo lectura) no pueden ser utilizados como texturas WebGL. una 2D {{ HTMLElement("canvas") }} se convierte en contaminada, por ejemplo, cuando una imagen de dominio cruzado (cross-domain) es dibujada en el.</p>
-
-<div class="note">
-<p><strong>Nota: </strong>El soporte de CORS para Canvas 2D drawImage se implementa en {{Gecko ("9.0")}}. Esto significa que el uso de una imagen de dominio cruzado con aprobación de CORS ya no pinta el lienzo 2D, por lo que el lienzo 2D sigue siendo utilizable como fuente de una textura WebGL. </p>
-</div>
-
-<div class="note">
-<p><strong>Nota:</strong> El soporte de CORS para videos de dominio cruzado y el atributo de crossorigin para elementos {{HTMLElement("video")}} se implementa en {{Gecko ("12.0")}}.</p>
-</div>
-
-<p>{{PreviousNext("Web/API/WebGL_API/Tutorial/Creating_3D_objects_using_WebGL", "Web/API/WebGL_API/Tutorial/Lighting_in_WebGL")}}</p>
diff --git a/files/es/web/api/webrtc_api/session_lifetime/index.html b/files/es/web/api/webrtc_api/session_lifetime/index.html
new file mode 100644
index 0000000000..a62c2da369
--- /dev/null
+++ b/files/es/web/api/webrtc_api/session_lifetime/index.html
@@ -0,0 +1,22 @@
+---
+title: WebRTC Introduction
+slug: Web/API/WebRTC_API/Session_lifetime
+translation_of: Web/API/WebRTC_API/Session_lifetime
+original_slug: WebRTC/Introduction
+---
+<div class="note">
+  <p>WebRTC te permite establecer una comunicación par-a-par en una aplicación del navegador.</p>
+</div>
+<h2 id="Estableciendo_la_conexión">Estableciendo la conexión</h2>
+<p>La conexión inicial entre pares debe ser establecida a través de un servidor de aplicaciones que proporcione descubrimiento de usuarios, comunicación y traducción de direcciones de red (NAT) con transmisión de datos.</p>
+<h3 id="Señalización">Señalización</h3>
+<p>Señalización es el mecanismo por el cual los pares se envían mensajes de control entre sí con el propósito de establecer el protocolo, canal, y método de comunicación. Estos no están especifiados en el standar WebRTC. En su lugar, el desarrollador puede elegir cualquier protocolo de mensajería (como SIP o XMPP), y cualquier canal de comunicación bidirecional (como WebSocket o XMLHttpRequest) en conjunción con un servidor con un API de  conexión permanente (como  el <a href="https://developers.google.com/appengine/docs/python/channel/overview" title="https://developers.google.com/appengine/docs/python/channel/overview">Google Channel API</a>) para AppEngine.</p>
+<h2 id="Transmisión">Transmisión</h2>
+<h3 id="getUserMedia">getUserMedia</h3>
+<p>LocalMediaStream object</p>
+<h2 id="Recepción">Recepción</h2>
+<p>El soporte para WebRTC en Firefox está escondido detrás de un selector de preferencias. Ve a <a href="/about:config" title="/about:config">about:config</a> y establce 'media.navigator.enabled' a 'true'.</p>
+<div class="note">
+  <p>Hay algunos archivos de prueba en el repositorio de código para darte una idea de cómo funciona. Ve: <a href="http://hg.mozilla.org/projects/alder/file/tip/dom/media/tests/local_video_test.html">dom/media/tests/local_video_test.html</a>. Por favor, prueba también la<a href="http://webrtc-demo.herokuapp.com/mozdemo">demo de servicio de llamadas</a>, la página de su código, y <a href="https://github.com/anantn/webrtc-demo/">el código de su servidor</a>.</p>
+</div>
+<p> </p>
diff --git a/files/es/web/api/webrtc_api/taking_still_photos/index.html b/files/es/web/api/webrtc_api/taking_still_photos/index.html
new file mode 100644
index 0000000000..7ad8892b16
--- /dev/null
+++ b/files/es/web/api/webrtc_api/taking_still_photos/index.html
@@ -0,0 +1,160 @@
+---
+title: Capturar fotografías con la cámara web
+slug: Web/API/WebRTC_API/Taking_still_photos
+tags:
+  - Canvas
+  - WebRTC
+  - cámara web
+  - getusermedia
+translation_of: Web/API/WebRTC_API/Taking_still_photos
+original_slug: WebRTC/Taking_webcam_photos
+---
+<h2 id="Introducción_y_demostración">Introducción y demostración</h2>
+<p>Este es un tutorial rápido de cómo acceder a la cámara de tu laptop y capturar una foto con ella. Puedes observar el <a href="http://jsfiddle.net/codepo8/agaRe/4/" title="http://jsfiddle.net/codepo8/agaRe/4/">código final en acción en este JSFiddle</a>. También existe una versión más avanzada en JavaScript para cargar fotos a <strong>imgur</strong> disponible como <a href="https://github.com/codepo8/interaction-cam/" title="https://github.com/codepo8/interaction-cam/">código en GitHub</a> o <a href="http://codepo8.github.com/interaction-cam/" title="http://codepo8.github.com/interaction-cam/">como demo</a>.</p>
+<h2 id="El_formato_HTML">El formato HTML</h2>
+<p>Lo primero que necesitas para acceder a la cámara web utilizando WebRTC es un elemento {{HTMLElement("video")}} y un elemento {{HTMLElement("canvas")}} en la página. El elemento de video recibe la secuencia desde WebRTC y el elemento canvas es utilizado para agarrar la imagen desde el video. También añadimos una imagen de relleno que luego será reemplazada con la toma capturada por la cámara web.</p>
+<pre class="brush:html;">&lt;video id="video"&gt;&lt;/video&gt;
+&lt;button id="startbutton"&gt;Take photo&lt;/button&gt;
+&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
+&lt;img src="http://placekitten.com/g/320/261" id="photo" alt="photo"&gt;
+</pre>
+<h2 id="El_script_completo">El script completo</h2>
+<p>Aquí se muestra completamente el código JavaScript. Más abajo, explicaremos gradualmente cada sección con más detalle.</p>
+<pre class="brush:js;">(function() {
+
+  var streaming = false,
+      video        = document.querySelector('#video'),
+      canvas       = document.querySelector('#canvas'),
+      photo        = document.querySelector('#photo'),
+      startbutton  = document.querySelector('#startbutton'),
+      width = 320,
+      height = 0;
+
+  navigator.getMedia = ( navigator.getUserMedia ||
+                         navigator.webkitGetUserMedia ||
+                         navigator.mozGetUserMedia ||
+                         navigator.msGetUserMedia);
+
+  navigator.getMedia(
+    {
+      video: true,
+      audio: false
+    },
+    function(stream) {
+      if (navigator.mozGetUserMedia) {
+        video.mozSrcObject = stream;
+      } else {
+        var vendorURL = window.URL || window.webkitURL;
+        video.src = vendorURL.createObjectURL(stream);
+      }
+      video.play();
+    },
+    function(err) {
+      console.log("An error occured! " + err);
+    }
+  );
+
+  video.addEventListener('canplay', function(ev){
+    if (!streaming) {
+      height = video.videoHeight / (video.videoWidth/width);
+      video.setAttribute('width', width);
+      video.setAttribute('height', height);
+      canvas.setAttribute('width', width);
+      canvas.setAttribute('height', height);
+      streaming = true;
+    }
+  }, false);
+
+  function takepicture() {
+    canvas.width = width;
+    canvas.height = height;
+    canvas.getContext('2d').drawImage(video, 0, 0, width, height);
+    var data = canvas.toDataURL('image/png');
+    photo.setAttribute('src', data);
+  }
+
+  startbutton.addEventListener('click', function(ev){
+      takepicture();
+    ev.preventDefault();
+  }, false);
+
+})();</pre>
+<h2 id="Explicando_paso_a_paso">Explicando paso a paso</h2>
+<p>Entonces, ¿Qué es lo que sucede aquí? Lo analizaremos paso por paso.</p>
+<h3 id="Función_Anónima">Función Anónima</h3>
+<pre class="brush:js;">(function() {
+
+  var streaming = false,
+      video        = document.querySelector('#video'),
+      canvas       = document.querySelector('#canvas'),
+      photo        = document.querySelector('#photo'),
+      startbutton  = document.querySelector('#startbutton'),
+      width = 320,
+      height = 0;</pre>
+<p>Empezamos por encerrar el script entero en una función anónima para evitar las variables globales. Tomamos los elementos HTML que necesitamos y definimos el ancho (width) del video a 320 y la altura (height) a 0, ya que calcularemos la altura apropiada posteriormente.</p>
+<div class="warning">
+  <p>En estos momentos existe una diferencia entre los tamaños de video proporcionados por getUserMedia. Firefox Nightly utiliza una resolución de 352x288 y Opera y Chrome utiliza una resolución de 640x400. Esto cambiará en el futuro, pero cambiando el tamaño con la proporción que usaremos más abajo, nos aseguraremos de no obtener sorpresas desagradables.</p>
+</div>
+<h3 id="Obtener_el_video">Obtener el video</h3>
+<p>Ahora necesitamos obtener el video desde la cámara web. Actualmente esto está predeterminado para los diferentes navegadores, así que necesitamos comprobar cuál es compatible:</p>
+<pre class="brush:js;">  navigator.getMedia = ( navigator.getUserMedia ||
+                         navigator.webkitGetUserMedia ||
+                         navigator.mozGetUserMedia ||
+                         navigator.msGetUserMedia);</pre>
+<p>Le solicitamos al navegador que nos dé un video sin audio y obtenemos una secuencia (stream) en la función de retrollamada:</p>
+<pre class="brush:js;">  navigator.getMedia(
+    {
+      video: true,
+      audio: false
+    },
+    function(stream) {
+      if (navigator.mozGetUserMedia) {
+        video.mozSrcObject = stream;
+      } else {
+        var vendorURL = window.URL || window.webkitURL;
+        video.src = vendorURL.createObjectURL(stream);
+      }
+      video.play();
+    },
+    function(err) {
+      console.log("An error occured! " + err);
+    }
+  );</pre>
+<p>En estos momentos Firefox Nightly necesita que tu configures la propiedad de <code>mozSrcObject</code> del elemento del video con el fin de reproducirlo; para otros navegadores, configura el atributo <code>src</code>. Mientras que Firefox puede utilizar la secuencia de video directamente, Webkit y Opera necesitan crear un objeto URL desde ella. Todo esto será estandarizado en un futuro cercano.</p>
+<h3 id="Redefinir_el_tamaño_del_video">Redefinir el tamaño del video</h3>
+<p>Luego necesitamos configurar el tamaño del video a las dimensiones deseadas.</p>
+<pre class="brush:js;">  video.addEventListener('canplay', function(ev){
+    if (!streaming) {
+      height = video.videoHeight / (video.videoWidth/width);
+      video.setAttribute('width', width);
+      video.setAttribute('height', height);
+      canvas.setAttribute('width', width);
+      canvas.setAttribute('height', height);
+      streaming = true;
+    }
+  }, false);</pre>
+<p>Nos subscribimos al evento <code>canplay </code>del video y leemos sus dimensiones utilizando <code>videoHeight</code> y <code>videoWidth</code>. Estas no están disponible realmente hasta que el evento sea iniciado. Establecemos <code>streaming</code> a verdadero (true) para que compruebe esto solo una vez, mientras que el evento <code>canplay</code>  siga en actividad.</p>
+<p>Esto es todo lo que se necesita para que inicie el video.</p>
+<h3 id="Capturar_una_imagen">Capturar una imagen</h3>
+<p>Ahora necesitamos capturar una imagen utilizando un lienzo (canvas). Asignamos un manejador de eventos al botón de inicio para llamar a la función de <code>takepicture</code>.</p>
+<pre class="brush:js;">  startbutton.addEventListener('click', function(ev){
+      takepicture();
+    ev.preventDefault();
+  }, false);</pre>
+<p>En esta función, reestablecemos el tamaño del lienzo (canvas) a las dimensiones del video, el cual lo sustituye y tenemos un marco del video, el cual se copia al canvas. Luego necesitamos convertir los datos del canvas en datos tipo URL con un encabezado PNG, y establecer el src de la fotografía a este mismo url.</p>
+<pre class="brush:js;">  function takepicture() {
+    canvas.width = width;
+    canvas.height = height;
+    canvas.getContext('2d').drawImage(video, 0, 0, width, height);
+    var data = canvas.toDataURL('image/png');
+    photo.setAttribute('src', data);
+  }
+
+})();</pre>
+<p>Eso es todo lo que se necesita para mostrar la secuencia de la cámara web y capturar una imagen fija de ella, a través de Chrome, Opera y Firefox.</p>
+<h2 id="Compatibilidad">Compatibilidad</h2>
+<p>Actualmente utilizar WebRTC para acceder a la cámara es compatible en Chrome, Opera y Firefox Nightly 18. Para habilitar WebRTC en Firefox Nightly requiere que establezcas un indicador en la configuración:</p>
+<ul>
+  <li>Teclea "about:config" en la barra de direcciones y afirma que quieres realizar algunos cambios.</li>
+  <li>Encuentra la entrada "media.navigator.enabled" y establécelo a verdadero (true).</li>
+</ul>
diff --git a/files/es/web/api/websockets_api/escribiendo_servidor_websocket/index.html b/files/es/web/api/websockets_api/escribiendo_servidor_websocket/index.html
deleted file mode 100644
index 333e8e8830..0000000000
--- a/files/es/web/api/websockets_api/escribiendo_servidor_websocket/index.html
+++ /dev/null
@@ -1,244 +0,0 @@
----
-title: Escribiendo un servidor WebSocket en C#
-slug: Web/API/WebSockets_API/Escribiendo_servidor_WebSocket
-tags:
-  - HTML5
-  - Tutorial
-  - WebSockets
-translation_of: Web/API/WebSockets_API/Writing_WebSocket_server
----
-<h2 id="Introducción">Introducción</h2>
-
-<p>Si deseas utilizar la API WebSocket, es conveniente si tienes un servidor. En este artículo te mostraré como puedes escribir uno en C#. Tú puedes hacer esto en cualquier lenguaje del lado del servidor, pero para mantener las cosas simples y más comprensibles, elegí el lenguaje de Microsoft<span style="line-height: 1.5;">.</span></p>
-
-<p>Este servidor se ajusta a <a href="http://tools.ietf.org/html/rfc6455" title="http://tools.ietf.org/html/rfc6455">RFC 6455</a> por lo que solo manejará las conexiones de Chrome version 16, Firefox 11, IE 10 and superiores.</p>
-
-<h2 id="Primeros_pasos">Primeros pasos</h2>
-
-<p>WebSocket se comunica a través de conexiones <a href="https://es.wikipedia.org/wiki/Transmission_Control_Protocol" title="https://es.wikipedia.org/wiki/Transmission_Control_Protocol">TCP (Transmission Control Protocol)</a>, afortunadamente C# tiene una clase <a href="http://msdn.microsoft.com/es-es/library/system.net.sockets.tcplistener.aspx" title="http://msdn.microsoft.com/en-us/library/system.net.sockets.tcplistener.aspx">TcpListener</a> la cual hace lo que su nombre sugiere. Esta se encuentra en el namespace <em>System.Net.Sockets</em>.</p>
-
-<div class="note">
-<p><span style="line-height: 1.572;">Es una buena idea usar la instrucción <code>using</code></span><span style="line-height: 1.572;"> para escribir menos. Eso significa que no tendrás que re escribir el namespace de nuevo en cada ocasión.</span></p>
-</div>
-
-<h3 id="TcpListener">TcpListener</h3>
-
-<p>Constructor:</p>
-
-<pre class="brush: cpp">TcpListener(System.Net.IPAddress localaddr, int port)</pre>
-
-<p><code>localaddr</code> especifica la IP a escuchar y <code>port</code> especifica el puerto.</p>
-
-<div class="note">
-<p>Para crear un objeto <code>IPAddress</code> desde un <code>string</code>, usa el método estático <code>Parse</code> de <code>IPAddres.</code></p>
-</div>
-
-<p><span style="line-height: 1.572;">Métodos</span><span style="line-height: 1.572;">:</span></p>
-
-<ul>
- <li><code><span style="line-height: 1.572;">Start()</span></code></li>
- <li><span style="line-height: 1.572;">S<code>ystem.Net.Sockets.<a href="http://msdn.microsoft.com/en-us/library/system.net.sockets.tcpclient.aspx" title="http://msdn.microsoft.com/en-us/library/system.net.sockets.tcpclient.aspx">TcpClient</a> AcceptTcpClient()</code><br>
-  Espera por una conexión TCP, la acepta y la devuelve como un objeto TcpClient.</span></li>
-</ul>
-
-<p><span style="line-height: 1.572;">Aquí está como utilizar lo que hemos aprendido:</span></p>
-
-<pre class="brush: cpp">​using System.Net.Sockets;
-using System.Net;
-using System;
-
-class Server {
-    public static void Main() {
-        TcpListener server = new TcpListener(IPAddress.Parse("127.0.0.1"), 80);
-
-        server.Start();
-        Console.WriteLine("El server se ha iniciado en 127.0.0.1:80.{0}Esperando una conexión...", Environment.NewLine);
-
-        TcpClient client = server.AcceptTcpClient();
-
-        Console.WriteLine("Un cliente conectado.");
-    }
-}
-</pre>
-
-<h3 id="TcpClient"><span style="line-height: 1.572;">TcpClient</span></h3>
-
-<p>Métodos:</p>
-
-<ul>
- <li><code>System.Net.Sockets.<a href="http://msdn.microsoft.com/en-us/library/system.net.sockets.networkstream.aspx" title="http://msdn.microsoft.com/en-us/library/system.net.sockets.networkstream.aspx">NetworkStream</a> GetStream()</code><br>
-  Obtiene el stream del canal de comunicación. Ambos lados del canal tienen capacidad de lectura y escritura.</li>
-</ul>
-
-<p>Propiedades:</p>
-
-<ul>
- <li><code>int Available</code><br>
-  Este es el número de bytes de datos que han sido enviados. El valor es cero hasta que <code><em>NetworkStream.DataAvailable</em></code> es <code><em>true</em></code>.</li>
-</ul>
-
-<h3 id="NetworkStream">NetworkStream</h3>
-
-<p>Métodos:</p>
-
-<pre class="brush: cpp">Write(Byte[] buffer, int offset, int size)</pre>
-
-<p>Escribe bytes desde el <em>buffer;</em> el <em>offset</em> y el <em>size</em> determinan la longitud del mensaje.</p>
-
-<pre><span class="brush: cpp" style="line-height: 1.572;">Read(Byte[] buffer, int offset, int size)</span></pre>
-
-<p>Lee bytes al <em>buffer;</em> el <em>offset</em> y el <em>size </em>determinan la longitud del mensaje.</p>
-
-<p>Ampliemos nuestro ejemplo anterior.</p>
-
-<pre class="brush: cpp">TcpClient client = server.AcceptTcpClient();
-
-Console.WriteLine("Un cliente conectado.");
-
-NetworkStream stream = client.GetStream();
-
-//enter to an infinite cycle to be able to handle every change in stream
-while (true) {
-    while (!stream.DataAvailable);
-
-    Byte[] bytes = new Byte[client.Available];
-
-    stream.Read(bytes, 0, bytes.Length);
-}</pre>
-
-<h2 id="Handshaking">Handshaking</h2>
-
-<p>Cuando un cliente se conecta al servidor, envía una solicitud GET para actualizar la conexión al WebSocket desde una simple petición HTTP. Esto es conocido como <em>handshaking</em>.</p>
-
-<p>Este código de ejemplo detecta el GET desde el cliente. Nota que esto bloqueará hasta los 3 primeros bytes del mensaje disponible. Soluciones alternativas deben ser investigadas para ambientes de producción.</p>
-
-<pre><code>using System.Text;
-using System.Text.RegularExpressions;
-
-while(client.Available &lt; 3)
-{
-   // wait for enough bytes to be available
-}
-
-Byte[] bytes = new Byte[client.Available];
-
-stream.Read(bytes, 0, bytes.Length);
-
-//translate bytes of request to string
-String data = Encoding.UTF8.GetString(bytes);
-
-if (Regex.IsMatch(data, "^GET")) {
-
-} else {
-
-}</code></pre>
-
-<p>Esta respuesta es fácil de construir, pero puede ser un poco díficil de entender. La explicación completa del <em>handshake </em>al servidor puede encontrarse en  <a href="https://developer.mozilla.org/es/docs/WebSockets-840092-dup/RFC%206455,%20section%204.2.2">RFC 6455, section 4.2.2</a>. Para nuestros propósitos, solo construiremos una respuesta simple.</p>
-
-<p>Debes:</p>
-
-<ol>
- <li>Obtener el valor de "<em>Sec-WebSocket-Key" </em>sin espacios iniciales ni finales de el encabezado de la solicitud</li>
- <li>Concatenarlo con "258EAFA5-E914-47DA-95CA-C5AB0DC85B11"</li>
- <li>Calcular el código SHA-1 y Base64</li>
- <li>Escribe el valor <em>Sec-WebSocket-Accept</em> en el encabezado como parte de la respuesta HTTP.</li>
-</ol>
-
-<pre class="brush: cpp">if (new Regex("^GET").IsMatch(data)) {
-    Byte[] response = Encoding.UTF8.GetBytes("HTTP/1.1 101 Switching Protocols" + Environment.NewLine
-        + "Connection: Upgrade" + Environment.NewLine
-        + "Upgrade: websocket" + Environment.NewLine
-        + "Sec-WebSocket-Accept: " + Convert.ToBase64String (
-            SHA1.Create().ComputeHash (
-                Encoding.UTF8.GetBytes (
-                    new Regex("Sec-WebSocket-Key: (.*)").Match(data).Groups[1].Value.Trim() + "258EAFA5-E914-47DA-95CA-C5AB0DC85B11"
-                )
-            )
-        ) + Environment.NewLine
-        + Environment.NewLine);
-
-    stream.Write(response, 0, response.Length);
-}
-</pre>
-
-<h2 id="Decoding_messages">Decoding messages</h2>
-
-<p>Luego de un <em>handshake</em> exitoso el cliente puede enviar mensajes al servidor, pero estos serán codificados.</p>
-
-<p>Si nosotros enviamos "MDN", obtendremos estos bytes:</p>
-
-<table>
- <tbody>
-  <tr>
-   <td>129</td>
-   <td>131</td>
-   <td>61</td>
-   <td>84</td>
-   <td>35</td>
-   <td>6</td>
-   <td>112</td>
-   <td>16</td>
-   <td>109</td>
-  </tr>
- </tbody>
-</table>
-
-<p>- 129:</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">FIN (¿Es el mensaje completo?)</th>
-   <th scope="col">RSV1</th>
-   <th scope="col">RSV2</th>
-   <th scope="col">RSV3</th>
-   <th scope="col">Opcode</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>1</td>
-   <td>0</td>
-   <td>0</td>
-   <td>0</td>
-   <td>0x1=0001</td>
-  </tr>
- </tbody>
-</table>
-
-<p>FIN: Puedes enviar tu mensaje en marcos, pero ahora debe mantener las cosas simples.<br>
- <span style="line-height: 1.572;">Opcode </span><em>0x1</em><span style="line-height: 1.572;"> significa que es un texto. </span><a href="http://tools.ietf.org/html/rfc6455#section-5.2" style="line-height: 1.572;" title="http://tools.ietf.org/html/rfc6455#section-5.2">Lista completa de Opcodes</a></p>
-
-<p>- 131:</p>
-
-<p>Si el segundo byte menos 128 se encuentra entre 0 y 125, esta es la longitud del mensaje. Si es 126, los siguientes 2 bytes (entero sin signo de 16 bits), si es 127, los siguientes 8 bytes (entero sin signo de 64 bits) son la longitud.</p>
-
-<div class="note">
-<p>Puedo tomar 128, porque el primer bit siempre es 1.</p>
-</div>
-
-<p>- 61, 84, 35 y 6 son los bytes de la clave a decodificar. Cambian en cada oportunidad.</p>
-
-<p>- Los bytes codificados restantes son el mensaje<span style="line-height: 1.572;">.</span></p>
-
-<h3 id="Algoritmo_de_decodificación">Algoritmo de decodificación</h3>
-
-<p>byte decodificado = byte codificado XOR (posición del byte codificado Mod 4) byte de la clave</p>
-
-<p>Ejemplo en C#:</p>
-
-<pre class="brush: cpp">Byte[] decoded = new Byte[3];
-Byte[] encoded = new Byte[3] {112, 16, 109};
-Byte[] key = Byte[4] {61, 84, 35, 6};
-
-for (int i = 0; i &lt; encoded.Length; i++) {
-    decoded[i] = (Byte)(encoded[i] ^ key[i % 4]);
-}</pre>
-
-<h2 id="Relacionado">Relacionado</h2>
-
-<ul>
- <li><a href="/es/docs/WebSockets/Writing_WebSocket_servers">Escribiendo servidores WebSocket</a></li>
-</ul>
-
-<div id="cke_pastebin" style="position: absolute; top: 2209.23px; width: 1px; height: 1px; overflow: hidden; left: -1000px;"> </div>
diff --git a/files/es/web/api/websockets_api/escribiendo_servidores_con_websocket/index.html b/files/es/web/api/websockets_api/escribiendo_servidores_con_websocket/index.html
deleted file mode 100644
index 1261f75bec..0000000000
--- a/files/es/web/api/websockets_api/escribiendo_servidores_con_websocket/index.html
+++ /dev/null
@@ -1,246 +0,0 @@
----
-title: Escribir servidores WebSocket
-slug: Web/API/WebSockets_API/Escribiendo_servidores_con_WebSocket
-translation_of: Web/API/WebSockets_API/Writing_WebSocket_servers
----
-<p>{{gecko_minversion_header("2")}}</p>
-
-<h2 id="Introducción">Introducción</h2>
-
-<p>Un servidor WebSocket es simplemente una aplicación TCP que escucha en cualquier puerto de un servidor que sigue un protocolo específico. La tarea de crear un servidor propio personalizado suele asustar a los desarrolladores, sin embargo puede resultar muy fácil implementar un servidor WebSocket en la plataforma que elijas.</p>
-
-<p>Un servidor WebSocket puede ser escrito en cualquier lenguaje de programación Server-Side que sea soporte <a href="https://en.wikipedia.org/wiki/Berkeley_sockets">Berkeley Sockets</a>, como por ejemplo C++ o Python o inclusive PHP y JavaScript para servidores. Este no va a ser un tutorial para ningún lenguaje espefícamente sino que te ayudará a escribir tu propio servidor.<br>
- <br>
- Necesitarás conocer como trabaja el protocolo HTTP y una experiencia intermedia en programación. Dependiendo de las capacidades de tu lenguaje puede ser necesario tener conocimientos en sockets TCP. Esta guía te dará el conocimiento necesario para escribir un servidor con WebSocket.</p>
-
-<div class="note">
-<p>Lea las últimas especificaciones oficiales de WebSocket <a href="http://datatracker.ietf.org/doc/rfc6455/?include_text=1">RFC 6455</a>. Las secciones 1 y 4-7 son especialmente interesantes para personas que deseen implementar servidores. La sección 10 abarca temas de seguridad y definitivamente deberías leerla antes de exponer tu servidor a la red.</p>
-</div>
-
-<p>Un servidor WebSocket es explicado a un muy bajo nivel aquí. Los servidores WebSocket usualmente estan separados y especializados (por una cuestión de balance de cargas y otra razones prácticas), por lo tanto deberías usar un <a href="https://en.wikipedia.org/wiki/Reverse_proxy">Reverse Proxy</a> (semejante a un servidor HTTP común) casi siempre para detectar los Handshakes de WebSocket, preprocesarlos, y reenviar los datos de los clientes al servidor WebSocket real.<br>
-  </p>
-
-<h2 id="Paso_1_El_Handshake_del_WebSocket"><a name="Handshake">Paso 1: El Handshake del WebSocket </a></h2>
-
-<p>Antes que nada, el servidor debe escuchar las conexiones entrantes usando un socket TCP estandar. Dependiendo de tu plataforma, esto puede ser manejado por tí. Por ejemplo asumamos que tu servidor esta escuchando la dirección example.com en el puerto 8000, y tu socket en el servidor responde a la petición GET con /chat.</p>
-
-<div class="warning">
-<p><strong>Advertencia: </strong>El servidor puede escuchar cualquier puerto que elijas, pero si elijes un puerto diferente al 80 o 443 podría haber problemas con los firewalls y proxies. Suele suceder con el puerto 443 tambien pero para eso se necesita un conexión segura (TLS/SSL). También se debe aclarar que la mayoría de los navegadores (como Firefox 8 o superiores) no permiten conexiones a servidores WebSocket sin seguridad que se realicen desde páginas web con seguridad (HTTPS). </p>
-</div>
-
-<p>El Handshake es el puente desde HTTP a WS. En el Handshake se negocian los detalles de la conexión y cualquier de las partes pueden abandonar el proceso antes de completar dicha conexión si los términos no son favorables. El servidor debe ser cuidadoso al analizar lo que el cliente pide, de lo contrario podrían introducirse problemas de seguridad.</p>
-
-<h3 id="Petición_de_Handshake_en_el_cliente">Petición de Handshake en el cliente</h3>
-
-<p>A pesar de que estamos creando un servidor, un cliente es quien tiene que comenzar el proceso de Handshake de WebSocket. Entonces tú tienes que saber cómo interpretar la petición del cliente. El cliente enviará una linda petición HTTP estandar que lucirá algo asi (la versión del HTTP debe ser 1.1 o mayor y el método debe ser GET):</p>
-
-<pre>GET /chat HTTP/1.1
-Host: example.com:8000
-<strong>Upgrade: websocket</strong>
-<strong>Connection: Upgrade</strong>
-Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
-Sec-WebSocket-Version: 13
-
-</pre>
-
-<p>El cliente puede solicitar aquí extensiones y/o sub protocolos; vea <a href="#Miscellaneous">Misceláneos</a> para más detalles. También, cabeceras comunes como <code>User-Agent</code>, <code>Referer</code>, <code>Cookie</code>, or cabeceras de autenticación podrían ser incluidos. Haz lo que quieras con ellos; no pertencen a WebSocket. También puedes ignorarlos. En muchas configuraciones comunes, un proxy inverso ya ha tratado con ellos.</p>
-
-<p>Si alguna cabecera no se entiende o posee un valor incorrecto, el servidor debe responder "<a href="https://developer.mozilla.org/es/docs/HTTP/Response_codes#400">400 Bad Request</a>" e inmediatamente cerrar la conexión. Normalmente, también puede dar la razón porque falló el <em>handshake</em> en el cuerpo de la respuesta HTTP, pero el mensaje podría no ser mostrado (el browser no lo muestra). Si el servidor no comprende que la versión del WebSockets, debería enviar una cabecera <code>Sec-WebSocket-Version</code> que contenga la(s) versión(es) no entendidas. (Esta guía explica v13, la más nueva). Ahora, vamos a ver la cabecera más curiosa, <code>Sec-WebSocket-Key</code>.</p>
-
-<div class="note">
-<p><strong>Tip:</strong> Todos los <strong>navegadores</strong> deben enviar una <a href="https://developer.mozilla.org/es/docs/HTTP/Access_control_CORS#Origin"><code>cabecera Origin</code></a>. Tu puedes usar esta cabecera por seguridad (revisando por el mismo origen, listas blancas/ listas negras, etc.) y enviar un <a href="https://developer.mozilla.org/es/docs/HTTP/Response_codes#403">403 Forbidden</a> si no te gusta lo que ves. Sin embargo, se advierte que los agentes no navegadores pueden enviar un falso <code>Origin</code>.  La mayoría de las aplicaciones rechazaran las solicitudes sin esta cabecera.</p>
-</div>
-
-<div class="note">
-<p><strong>Tip:</strong> The request-uri (<code>/chat</code> here) has no defined meaning in the spec. So many people cleverly use it to let one server handle multiple WebSocket applications. For example, <code>example.com/chat</code> could invoke a multiuser chat app, while <code>/game</code> on the same server might invoke a multiplayer game.</p>
-</div>
-
-<div class="note">
-<p><strong>Note:</strong> <a href="https://developer.mozilla.org/en-US/docs/HTTP/Response_codes">Regular HTTP status codes</a> can only be used before the handshake. After the handshake succeeds, you have to use a different set of codes (defined in section 7.4 of the spec).</p>
-</div>
-
-<h3 id="Respuesta_de_Handshake_del_servidor">Respuesta de Handshake del servidor</h3>
-
-<p>Después de la petición, el servidor debería enviar una linda respuesta (aunque todavía en formato HTTP) que se verá asi (hay que recordar que la cabecera termina con \r \n y agrega un \r \n extra después del último):</p>
-
-<pre><strong>HTTP/1.1 101 Switching Protocols</strong>
-Upgrade: websocket
-Connection: Upgrade
-<strong>Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
-
-</strong></pre>
-
-<p>Adicionalmente, el servidor puede decidir respecto de las solicitudes "extension/subprotocol" en este punto (ver <a href="#Miscellaneous">Miscelláneos</a> para más detalles). La cabecera <code>Sec-WebSocket-Accept</code> es interesante. El servidor debe derivarla a partir de la cabecera <code>Sec-WebSocket-Key</code> enviada anteriormente por el cliente. Para lograr esto se deben concatenar la cabecera del cliente<span style="line-height: 1.5em;"> </span><code style="font-size: 14px;">Sec-WebSocket-Key</code><span style="line-height: 1.5em;"> y el string "</span><code style="font-size: 14px;">258EAFA5-E914-47DA-95CA-C5AB0DC85B11</code><span style="line-height: 1.5em;">" (es un "</span><a href="https://en.wikipedia.org/wiki/Magic_string" style="line-height: 1.5em;">magic string</a><span style="line-height: 1.5em;">"), calcular el </span><a href="https://en.wikipedia.org/wiki/SHA-1" style="line-height: 1.5em;">hash SHA-1</a><span style="line-height: 1.5em;"> del resultado y devolver el string codificado en</span><span style="line-height: 1.5em;"> </span><a href="https://en.wikipedia.org/wiki/Base64" style="line-height: 1.5em;">base64</a><span style="line-height: 1.5em;"> de este hash.</span></p>
-
-<div class="note">
-<p><strong>FYI:</strong> Este aparentemente complicado e innecesario proceso se realiza de manera que sea obvio para el cliente si el servidor soporta o noWebSockets. Esto es importante de realizar, ya que podrían crearse problemas de seguridad si el servidor acepta conexiones WebSockets pero interpreta los datos como solicitudes HTTP.</p>
-</div>
-
-<p>Así, si la cabecera <code>Sec-WebSocket-Key</code> era "<code>dGhlIHNhbXBsZSBub25jZQ==</code>", la correspondiente respuesta <code>Sec-WebSocket-Accept</code> será "<code>s3pPLMBiTxaQ9kYGzzhZRbK+xOo=</code>". Una vez que el servidor envía estas cabeceras, el "handshake" se considera completo y puedes comenzar a intercambiar datos.</p>
-
-<div class="note">
-<p>El servidor puede enviar otras cabeceras como Set-Cookie, o solicitar autenticación o redirigir mediante otros status codes antes de responder al handshake.</p>
-</div>
-
-<h3 id="Llevando_registro_de_los_clientes">Llevando registro de los clientes</h3>
-
-<p>Esto no está directamente relacionado con el protocolo WebSocket, pero no está de más mencionarlo: tu servidor debe llevar el registro de los sockets de los clientes, de manera de no realizar handshakes constantemente con los clientes que ya han completado este proceso. La misma dirección IP cliente puede intentar conectarse múltiples veces (pero el servidor puede denegar la conexión si se intentan demasiadas conexiones con el objetivo de evitar ataques <a href="https://en.wikipedia.org/wiki/Denial_of_service">ataques DoS</a>).</p>
-
-<h2 id="Paso_2_Intercambiando_Data_Frames">Paso 2: Intercambiando Data Frames</h2>
-
-<p>Tanto el cliente como el servidor puede decidir enviar un mensaje en cualquier momento — ese es el encanto de los WebSockets. Sin embargo, extraer información de esos denominados "frames" o tramas de datos no es una experiencia muy mágica. Aunque todos los frames siguen el mismo formato específico, los datos que van del cliente al servidor se enmascaran utilizando el <a href="https://en.wikipedia.org/wiki/XOR_cipher">cifrado XOR</a> (con una clave de 32 bits). La sección 5 de la especificación describe esto en detalle.</p>
-
-<h3 id="Formato">Formato</h3>
-
-<p>Cada trama de datos (desde el cliente al servidor o viceversa) sigue este mismo formato:</p>
-
-<pre style="float: left; margin-right: 20px;"> 0                   1                   2                   3
- 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
-+-+-+-+-+-------+-+-------------+-------------------------------+
-|F|R|R|R| opcode|M| Payload len |    Extended payload length    |
-|I|S|S|S|  (4)  |A|     (7)     |             (16/64)           |
-|N|V|V|V|       |S|             |   (if payload len==126/127)   |
-| |1|2|3|       |K|             |                               |
-+-+-+-+-+-------+-+-------------+ - - - - - - - - - - - - - - - +
-|     Extended payload length continued, if payload len == 127  |
-+ - - - - - - - - - - - - - - - +-------------------------------+
-|                               |Masking-key, if MASK set to 1  |
-+-------------------------------+-------------------------------+
-| Masking-key (continued)       |          Payload Data         |
-+-------------------------------- - - - - - - - - - - - - - - - +
-:                     Payload Data continued ...                :
-+ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
-|                     Payload Data continued ...                |
-+---------------------------------------------------------------+</pre>
-
-<p>Los RSV1-3 se pueden ignorar, son para las extensiones.</p>
-
-<p>El bit MASK simplemente indica si el mensaje está codificado. Los mensajes del cliente deben estar enmascarados, por lo que tu servidor debe esperar que valga 1. (De hecho, la <a href="http://tools.ietf.org/html/rfc6455#section-5.1">sección 5.1 de las espeficicaciones</a>  dice que tu servidor debe desconectarse de un cliente si ese cliente envía un mensaje sin enmascarar). Cuando se envía una trama al cliente, no lo ocultes y no pongas el bit de la máscara. Te explicaremos el enmascaramiento más tarde. <em>Nota: Tienes que enmascarar los mensajes incluso cuando uses un socket seguro.</em></p>
-
-<p>El campo opcode define cómo interpretar los datos de la carga útil:<code style="font-style: normal; line-height: 1.5;">0x0</code><span style="line-height: 1.5;"> </span><span style="line-height: 1.5;">para continuar,</span><span style="font-family: courier new,andale mono,monospace; line-height: 1.5;"> </span><code style="font-style: normal; line-height: 1.5;">0x1</code><span style="line-height: 1.5;"> para texto (que siempre se codifica con UTF-8), </span><code style="font-style: normal; line-height: 1.5;">0x2</code><span style="line-height: 1.5;"> para datos binarios, otros llamados "códigos de control" se explican más tarde. En esta versión de WebSockets, de <code>0x3</code> a <code>0x7</code> y de <code>0xB</code> a <code>0xF</code> no tienen significado.</span></p>
-
-<p>El bit FIN indica si este es el último mensaje de una serie. Si es 0, el servidor seguirá escuchando más partes del mensaje; de lo contrario, el servidor debería considerar el mensaje entregado. Más sobre esto después.</p>
-
-<h3 id="Decoding_Payload_Length">Decoding Payload Length</h3>
-
-<p>To read the payload data, you must know when to stop reading. That's why the payload length is important to know. Unfortunately, this is somewhat complicated. To read it, follow these steps:</p>
-
-<ol>
- <li>Read bits 9-15 (inclusive) and interpret that as an unsigned integer. If it's 125 or less, then that's the length; you're <strong>done</strong>. If it's 126, go to step 2. If it's 127, go to step 3.</li>
- <li>Read the next 16 bits and interpret those as an unsigned integer. You're <strong>done</strong>.</li>
- <li>Read the next 64 bits and interpret those as an unsigned integer. You're <strong>done</strong>.</li>
-</ol>
-
-<h3 id="Reading_and_Unmasking_the_Data">Reading and Unmasking the Data</h3>
-
-<p>If the MASK bit was set (and it should be, for client-to-server messages), read the next 4 octets (32 bits); this is the masking key. <span style="line-height: 1.5;">Once the payload length and masking key is decoded, you can go ahead and read that number of bytes from the socket. Let's call the data <strong>ENCODED</strong>, and the key <strong>MASK</strong>. To get <strong>DECODED</strong>, loop through the octets (bytes a.k.a. characters for text data) of <strong>ENCODED</strong> and XOR the octet with the (i modulo 4)th octet of MASK. In pseudo-code (that happens to be valid JavaScript):</span></p>
-
-<pre>var DECODED = "";
-for (var i = 0; i &lt; ENCODED.length; i++) {
-    DECODED[i] = ENCODED[i] ^ MASK[i % 4];
-<span style="line-height: 1.5;">}</span></pre>
-
-<p><span style="line-height: 1.5;">Now you can figure out what <strong>DECODED</strong> means depending on your application.</span></p>
-
-<h3 id="Message_Fragmentation">Message Fragmentation</h3>
-
-<p>The FIN and opcode fields work together to send a message split up into separate frames.  This is called message fragmentation. Fragmentation is only available on opcodes <code>0x0</code> to <code>0x2</code>.</p>
-
-<p><span style="line-height: 1.5;">Recall that the opcode tells what a frame is meant to do. If it's <code>0x1</code>, the payload is text. If it's <code>0x2</code>, the payload is binary data.</span><span style="line-height: 1.5;"> However, if it's </span><code style="font-style: normal; line-height: 1.5;">0x0,</code><span style="line-height: 1.5;"> the frame is a continuation frame. This means the server should concatenate the frame's payload to the last frame it received from that client.</span><span style="line-height: 1.5;"> Here is a rough sketch, in which a server reacts to a client sending text messages. The first message is sent in a single frame, while the second message is sent across three frames. FIN and opcode details are shown only for the client:</span></p>
-
-<pre style="font-size: 14px;"><strong>Client:</strong> FIN=1, opcode=0x1, msg="hello"
-<strong>Server:</strong> <em>(process complete message immediately) </em>Hi.
-<strong>Client:</strong> FIN=0, opcode=0x1, msg="and a"
-<strong>Server:</strong> <em>(listening, new message containing text started)</em>
-<strong>Client:</strong> FIN=0, opcode=0x0, msg="happy new"
-<strong>Server:</strong> <em>(listening, payload concatenated to previous message)</em>
-<strong>Client:</strong> FIN=1, opcode=0x0, msg="year!"
-<strong>Server:</strong> <em>(process complete message) </em>Happy new year to you too!</pre>
-
-<p>Notice the first frame contains an entire message (has <code>FIN=1</code> and <code>opcode!=0x0</code>), so the server can process or respond as it sees fit. The second frame sent by the client has a text payload (<code>opcode=0x1</code>), but the entire message has not arrived yet (<code>FIN=0</code>). All remaining parts of that message are sent with continuation frames (<code>opcode=0x0</code>), and the final frame of the message is marked by <code>FIN=1</code>. <a href="http://tools.ietf.org/html/rfc6455#section-5.4">Section 5.4 of the spec</a> describes message fragmentation.</p>
-
-<h2 id="Pings_and_Pongs_The_Heartbeat_of_WebSockets">Pings and Pongs: The Heartbeat of WebSockets</h2>
-
-<p>At any point after the handshake, either the client or the server can choose to send a ping to the other party. When the ping is received, the recipient must send back a pong as soon as possible. You can use this to make sure that the client is still connected, for example.</p>
-
-<p>A ping or pong is just a regular frame, but it's a <strong>control frame</strong>. Pings have an opcode of <code>0x9</code>, and pongs have an opcode of <code>0xA</code>. When you get a ping, send back a pong with the exact same Payload Data as the ping (for pings and pongs, the max payload length is 125). You might also get a pong without ever sending a ping; ignore this if it happens.</p>
-
-<div class="note">
-<p>If you have gotten more than one ping before you get the chance to send a pong, you only send one pong.</p>
-</div>
-
-<h2 id="Step_4_Closing_the_connection">Step 4: Closing the connection</h2>
-
-<p>To close a connection either the client or server can send a control frame with data containing a specified control sequence to begin the closing handshake (detailed in <a href="http://tools.ietf.org/html/rfc6455#section-5.5.1">Section 5.5.1</a>). Upon receiving such a frame, the other peer sends a Close frame in response. The first peer then closes the connection. Any further data received after closing of connection is then discarded. </p>
-
-<h2 id="Miscellaneous_2"><a name="Miscellaneous">Miscellaneous</a></h2>
-
-<div class="note">
-<p>WebSocket codes, extensions, subprotocols, etc. are registered at the <a href="http://www.iana.org/assignments/websocket/websocket.xml">IANA WebSocket Protocol Registry</a>.</p>
-</div>
-
-<p>WebSocket extensions and subprotocols are negotiated via headers during <a href="#Handshake">the handshake</a>. Sometimes extensions and subprotocols seem too similar to be different things, but there is a clear distinction. Extensions control the WebSocket <strong>frame</strong> and <strong>modify</strong> the payload, while subprotocols structure the WebSocket <strong>payload</strong> and <strong>never modify</strong> anything. Extensions are optional and generalized (like compression); subprotocols are mandatory and localized (like ones for chat and for MMORPG games).</p>
-
-<h3 id="Extensions">Extensions</h3>
-
-<div class="note">
-<p><strong>This section needs expansion. Please edit if you are equipped to do so.</strong></p>
-</div>
-
-<p>Think of an extension as compressing a file before e-mailing it to someone. Whatever you do, you're sending the <em>same</em> data in different forms. The recipient will eventually be able to get the same data as your local copy, but it is sent differently. That's what an extension does. WebSockets defines a protocol and a simple way to send data, but an extension such as compression could allow sending the same data but in a shorter format.</p>
-
-<div class="note">
-<p>Extensions are explained in sections 5.8, 9, 11.3.2, and 11.4 of the spec.</p>
-</div>
-
-<p><em>TODO</em></p>
-
-<h3 id="Subprotocols">Subprotocols</h3>
-
-<p>Think of a subprotocol as a custom <a href="https://en.wikipedia.org/wiki/XML_schema">XML schema</a> or <a href="https://en.wikipedia.org/wiki/Document_Type_Definition">doctype declaration</a>. You're still using XML and its syntax, but you're additionally restricted by a structure you agreed on. WebSocket subprotocols are just like that. They do not introduce anything fancy, they just establish structure. Like a doctype or schema, both parties must agree on the subprotocol; unlike a doctype or schema, the subprotocol is implemented on the server and cannot be externally refered to by the client.</p>
-
-<div class="note">
-<p>Subprotocols are explained in sections 1.9, 4.2, 11.3.4, and 11.5 of the spec.</p>
-</div>
-
-<p>A client has to ask for a specific subprotocol. To do so, it will send something like this <strong>as part of the original handshake</strong>:</p>
-
-<pre>GET /chat HTTP/1.1
-...
-Sec-WebSocket-Protocol: soap, wamp
-
-</pre>
-
-<p>or, equivalently:</p>
-
-<pre>...
-Sec-WebSocket-Protocol: soap
-Sec-WebSocket-Protocol: wamp
-
-</pre>
-
-<p>Now the server must pick one of the protocols that the client suggested and it supports. If there are more than one, send the first one the client sent. Imagine our server can use both <code>soap</code> and <code>wamp</code>. Then, in the response handshake, it'll send:</p>
-
-<pre>Sec-WebSocket-Protocol: soap
-
-</pre>
-
-<div class="warning">
-<p>The server can't send more than one <code>Sec-Websocket-Protocol</code> header.<br>
- <span style="line-height: 1.5;">If the server doesn't want to use a</span><span style="line-height: 1.5;">ny subprotocol, </span><strong style="line-height: 1.5;">it shouldn't send any <code>Sec-WebSocket-Protocol</code> header</strong><span style="line-height: 1.5;">. Sending a blank header is incorrect.<br>
- The client may close the connection if it doesn't get the subprotocol it wants.</span></p>
-</div>
-
-<p>If you want your server to obey certain subprotocols, then naturally you'll need extra code on the server. Let's imagine we're using a subprotocol <code>json</code>. In this subprotocol, all data is passed as <a href="https://en.wikipedia.org/wiki/JSON">JSON</a>. If the client solicits this protocol and the server wants to use it, the server will need to have a JSON parser. Practically speaking, this will be part of a library, but the server will need to pass the data around.</p>
-
-<div class="note">
-<p><strong>Tip:</strong> To avoid name conflict, it's recommended to make your subprotocol name part of a domain string. If you are building a custom chat app that uses a proprietary format exclusive to Example Inc., then you might use this: <code>Sec-WebSocket-Protocol: chat.example.com</code>. For different versions, a widely-used method is to add a <code>/</code> followed by the version number, like <code>chat.example.com/2.0</code>. Note that this isn't required, it's just an optional convention, and you can use any string you wish.</p>
-</div>
-
-<h2 id="Related">Related</h2>
-
-<ul>
- <li><a href="/en-US/docs/WebSockets/Writing_WebSocket_server" title="/en-US/docs/WebSockets/Writing_WebSocket_server">Tutorial: Websocket server in C#</a></li>
- <li><a href="/en-US/docs/WebSockets/Writing_WebSocket_client_applications">Writing WebSocket client applications</a></li>
- <li><a href="/en-US/docs/WebSockets/WebSocket_Server_Vb.NET">Tutorial: Websocket server in VB.NET</a></li>
-</ul>
diff --git a/files/es/web/api/websockets_api/writing_websocket_server/index.html b/files/es/web/api/websockets_api/writing_websocket_server/index.html
new file mode 100644
index 0000000000..b4af4cd030
--- /dev/null
+++ b/files/es/web/api/websockets_api/writing_websocket_server/index.html
@@ -0,0 +1,245 @@
+---
+title: Escribiendo un servidor WebSocket en C#
+slug: Web/API/WebSockets_API/Writing_WebSocket_server
+tags:
+  - HTML5
+  - Tutorial
+  - WebSockets
+translation_of: Web/API/WebSockets_API/Writing_WebSocket_server
+original_slug: Web/API/WebSockets_API/Escribiendo_servidor_WebSocket
+---
+<h2 id="Introducción">Introducción</h2>
+
+<p>Si deseas utilizar la API WebSocket, es conveniente si tienes un servidor. En este artículo te mostraré como puedes escribir uno en C#. Tú puedes hacer esto en cualquier lenguaje del lado del servidor, pero para mantener las cosas simples y más comprensibles, elegí el lenguaje de Microsoft<span style="line-height: 1.5;">.</span></p>
+
+<p>Este servidor se ajusta a <a href="http://tools.ietf.org/html/rfc6455" title="http://tools.ietf.org/html/rfc6455">RFC 6455</a> por lo que solo manejará las conexiones de Chrome version 16, Firefox 11, IE 10 and superiores.</p>
+
+<h2 id="Primeros_pasos">Primeros pasos</h2>
+
+<p>WebSocket se comunica a través de conexiones <a href="https://es.wikipedia.org/wiki/Transmission_Control_Protocol" title="https://es.wikipedia.org/wiki/Transmission_Control_Protocol">TCP (Transmission Control Protocol)</a>, afortunadamente C# tiene una clase <a href="http://msdn.microsoft.com/es-es/library/system.net.sockets.tcplistener.aspx" title="http://msdn.microsoft.com/en-us/library/system.net.sockets.tcplistener.aspx">TcpListener</a> la cual hace lo que su nombre sugiere. Esta se encuentra en el namespace <em>System.Net.Sockets</em>.</p>
+
+<div class="note">
+<p><span style="line-height: 1.572;">Es una buena idea usar la instrucción <code>using</code></span><span style="line-height: 1.572;"> para escribir menos. Eso significa que no tendrás que re escribir el namespace de nuevo en cada ocasión.</span></p>
+</div>
+
+<h3 id="TcpListener">TcpListener</h3>
+
+<p>Constructor:</p>
+
+<pre class="brush: cpp">TcpListener(System.Net.IPAddress localaddr, int port)</pre>
+
+<p><code>localaddr</code> especifica la IP a escuchar y <code>port</code> especifica el puerto.</p>
+
+<div class="note">
+<p>Para crear un objeto <code>IPAddress</code> desde un <code>string</code>, usa el método estático <code>Parse</code> de <code>IPAddres.</code></p>
+</div>
+
+<p><span style="line-height: 1.572;">Métodos</span><span style="line-height: 1.572;">:</span></p>
+
+<ul>
+ <li><code><span style="line-height: 1.572;">Start()</span></code></li>
+ <li><span style="line-height: 1.572;">S<code>ystem.Net.Sockets.<a href="http://msdn.microsoft.com/en-us/library/system.net.sockets.tcpclient.aspx" title="http://msdn.microsoft.com/en-us/library/system.net.sockets.tcpclient.aspx">TcpClient</a> AcceptTcpClient()</code><br>
+  Espera por una conexión TCP, la acepta y la devuelve como un objeto TcpClient.</span></li>
+</ul>
+
+<p><span style="line-height: 1.572;">Aquí está como utilizar lo que hemos aprendido:</span></p>
+
+<pre class="brush: cpp">​using System.Net.Sockets;
+using System.Net;
+using System;
+
+class Server {
+    public static void Main() {
+        TcpListener server = new TcpListener(IPAddress.Parse("127.0.0.1"), 80);
+
+        server.Start();
+        Console.WriteLine("El server se ha iniciado en 127.0.0.1:80.{0}Esperando una conexión...", Environment.NewLine);
+
+        TcpClient client = server.AcceptTcpClient();
+
+        Console.WriteLine("Un cliente conectado.");
+    }
+}
+</pre>
+
+<h3 id="TcpClient"><span style="line-height: 1.572;">TcpClient</span></h3>
+
+<p>Métodos:</p>
+
+<ul>
+ <li><code>System.Net.Sockets.<a href="http://msdn.microsoft.com/en-us/library/system.net.sockets.networkstream.aspx" title="http://msdn.microsoft.com/en-us/library/system.net.sockets.networkstream.aspx">NetworkStream</a> GetStream()</code><br>
+  Obtiene el stream del canal de comunicación. Ambos lados del canal tienen capacidad de lectura y escritura.</li>
+</ul>
+
+<p>Propiedades:</p>
+
+<ul>
+ <li><code>int Available</code><br>
+  Este es el número de bytes de datos que han sido enviados. El valor es cero hasta que <code><em>NetworkStream.DataAvailable</em></code> es <code><em>true</em></code>.</li>
+</ul>
+
+<h3 id="NetworkStream">NetworkStream</h3>
+
+<p>Métodos:</p>
+
+<pre class="brush: cpp">Write(Byte[] buffer, int offset, int size)</pre>
+
+<p>Escribe bytes desde el <em>buffer;</em> el <em>offset</em> y el <em>size</em> determinan la longitud del mensaje.</p>
+
+<pre><span class="brush: cpp" style="line-height: 1.572;">Read(Byte[] buffer, int offset, int size)</span></pre>
+
+<p>Lee bytes al <em>buffer;</em> el <em>offset</em> y el <em>size </em>determinan la longitud del mensaje.</p>
+
+<p>Ampliemos nuestro ejemplo anterior.</p>
+
+<pre class="brush: cpp">TcpClient client = server.AcceptTcpClient();
+
+Console.WriteLine("Un cliente conectado.");
+
+NetworkStream stream = client.GetStream();
+
+//enter to an infinite cycle to be able to handle every change in stream
+while (true) {
+    while (!stream.DataAvailable);
+
+    Byte[] bytes = new Byte[client.Available];
+
+    stream.Read(bytes, 0, bytes.Length);
+}</pre>
+
+<h2 id="Handshaking">Handshaking</h2>
+
+<p>Cuando un cliente se conecta al servidor, envía una solicitud GET para actualizar la conexión al WebSocket desde una simple petición HTTP. Esto es conocido como <em>handshaking</em>.</p>
+
+<p>Este código de ejemplo detecta el GET desde el cliente. Nota que esto bloqueará hasta los 3 primeros bytes del mensaje disponible. Soluciones alternativas deben ser investigadas para ambientes de producción.</p>
+
+<pre><code>using System.Text;
+using System.Text.RegularExpressions;
+
+while(client.Available &lt; 3)
+{
+   // wait for enough bytes to be available
+}
+
+Byte[] bytes = new Byte[client.Available];
+
+stream.Read(bytes, 0, bytes.Length);
+
+//translate bytes of request to string
+String data = Encoding.UTF8.GetString(bytes);
+
+if (Regex.IsMatch(data, "^GET")) {
+
+} else {
+
+}</code></pre>
+
+<p>Esta respuesta es fácil de construir, pero puede ser un poco díficil de entender. La explicación completa del <em>handshake </em>al servidor puede encontrarse en  <a href="https://developer.mozilla.org/es/docs/WebSockets-840092-dup/RFC%206455,%20section%204.2.2">RFC 6455, section 4.2.2</a>. Para nuestros propósitos, solo construiremos una respuesta simple.</p>
+
+<p>Debes:</p>
+
+<ol>
+ <li>Obtener el valor de "<em>Sec-WebSocket-Key" </em>sin espacios iniciales ni finales de el encabezado de la solicitud</li>
+ <li>Concatenarlo con "258EAFA5-E914-47DA-95CA-C5AB0DC85B11"</li>
+ <li>Calcular el código SHA-1 y Base64</li>
+ <li>Escribe el valor <em>Sec-WebSocket-Accept</em> en el encabezado como parte de la respuesta HTTP.</li>
+</ol>
+
+<pre class="brush: cpp">if (new Regex("^GET").IsMatch(data)) {
+    Byte[] response = Encoding.UTF8.GetBytes("HTTP/1.1 101 Switching Protocols" + Environment.NewLine
+        + "Connection: Upgrade" + Environment.NewLine
+        + "Upgrade: websocket" + Environment.NewLine
+        + "Sec-WebSocket-Accept: " + Convert.ToBase64String (
+            SHA1.Create().ComputeHash (
+                Encoding.UTF8.GetBytes (
+                    new Regex("Sec-WebSocket-Key: (.*)").Match(data).Groups[1].Value.Trim() + "258EAFA5-E914-47DA-95CA-C5AB0DC85B11"
+                )
+            )
+        ) + Environment.NewLine
+        + Environment.NewLine);
+
+    stream.Write(response, 0, response.Length);
+}
+</pre>
+
+<h2 id="Decoding_messages">Decoding messages</h2>
+
+<p>Luego de un <em>handshake</em> exitoso el cliente puede enviar mensajes al servidor, pero estos serán codificados.</p>
+
+<p>Si nosotros enviamos "MDN", obtendremos estos bytes:</p>
+
+<table>
+ <tbody>
+  <tr>
+   <td>129</td>
+   <td>131</td>
+   <td>61</td>
+   <td>84</td>
+   <td>35</td>
+   <td>6</td>
+   <td>112</td>
+   <td>16</td>
+   <td>109</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>- 129:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">FIN (¿Es el mensaje completo?)</th>
+   <th scope="col">RSV1</th>
+   <th scope="col">RSV2</th>
+   <th scope="col">RSV3</th>
+   <th scope="col">Opcode</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>1</td>
+   <td>0</td>
+   <td>0</td>
+   <td>0</td>
+   <td>0x1=0001</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>FIN: Puedes enviar tu mensaje en marcos, pero ahora debe mantener las cosas simples.<br>
+ <span style="line-height: 1.572;">Opcode </span><em>0x1</em><span style="line-height: 1.572;"> significa que es un texto. </span><a href="http://tools.ietf.org/html/rfc6455#section-5.2" style="line-height: 1.572;" title="http://tools.ietf.org/html/rfc6455#section-5.2">Lista completa de Opcodes</a></p>
+
+<p>- 131:</p>
+
+<p>Si el segundo byte menos 128 se encuentra entre 0 y 125, esta es la longitud del mensaje. Si es 126, los siguientes 2 bytes (entero sin signo de 16 bits), si es 127, los siguientes 8 bytes (entero sin signo de 64 bits) son la longitud.</p>
+
+<div class="note">
+<p>Puedo tomar 128, porque el primer bit siempre es 1.</p>
+</div>
+
+<p>- 61, 84, 35 y 6 son los bytes de la clave a decodificar. Cambian en cada oportunidad.</p>
+
+<p>- Los bytes codificados restantes son el mensaje<span style="line-height: 1.572;">.</span></p>
+
+<h3 id="Algoritmo_de_decodificación">Algoritmo de decodificación</h3>
+
+<p>byte decodificado = byte codificado XOR (posición del byte codificado Mod 4) byte de la clave</p>
+
+<p>Ejemplo en C#:</p>
+
+<pre class="brush: cpp">Byte[] decoded = new Byte[3];
+Byte[] encoded = new Byte[3] {112, 16, 109};
+Byte[] key = Byte[4] {61, 84, 35, 6};
+
+for (int i = 0; i &lt; encoded.Length; i++) {
+    decoded[i] = (Byte)(encoded[i] ^ key[i % 4]);
+}</pre>
+
+<h2 id="Relacionado">Relacionado</h2>
+
+<ul>
+ <li><a href="/es/docs/WebSockets/Writing_WebSocket_servers">Escribiendo servidores WebSocket</a></li>
+</ul>
+
+<div id="cke_pastebin" style="position: absolute; top: 2209.23px; width: 1px; height: 1px; overflow: hidden; left: -1000px;"> </div>
diff --git a/files/es/web/api/websockets_api/writing_websocket_servers/index.html b/files/es/web/api/websockets_api/writing_websocket_servers/index.html
new file mode 100644
index 0000000000..468f0154b9
--- /dev/null
+++ b/files/es/web/api/websockets_api/writing_websocket_servers/index.html
@@ -0,0 +1,247 @@
+---
+title: Escribir servidores WebSocket
+slug: Web/API/WebSockets_API/Writing_WebSocket_servers
+translation_of: Web/API/WebSockets_API/Writing_WebSocket_servers
+original_slug: Web/API/WebSockets_API/Escribiendo_servidores_con_WebSocket
+---
+<p>{{gecko_minversion_header("2")}}</p>
+
+<h2 id="Introducción">Introducción</h2>
+
+<p>Un servidor WebSocket es simplemente una aplicación TCP que escucha en cualquier puerto de un servidor que sigue un protocolo específico. La tarea de crear un servidor propio personalizado suele asustar a los desarrolladores, sin embargo puede resultar muy fácil implementar un servidor WebSocket en la plataforma que elijas.</p>
+
+<p>Un servidor WebSocket puede ser escrito en cualquier lenguaje de programación Server-Side que sea soporte <a href="https://en.wikipedia.org/wiki/Berkeley_sockets">Berkeley Sockets</a>, como por ejemplo C++ o Python o inclusive PHP y JavaScript para servidores. Este no va a ser un tutorial para ningún lenguaje espefícamente sino que te ayudará a escribir tu propio servidor.<br>
+ <br>
+ Necesitarás conocer como trabaja el protocolo HTTP y una experiencia intermedia en programación. Dependiendo de las capacidades de tu lenguaje puede ser necesario tener conocimientos en sockets TCP. Esta guía te dará el conocimiento necesario para escribir un servidor con WebSocket.</p>
+
+<div class="note">
+<p>Lea las últimas especificaciones oficiales de WebSocket <a href="http://datatracker.ietf.org/doc/rfc6455/?include_text=1">RFC 6455</a>. Las secciones 1 y 4-7 son especialmente interesantes para personas que deseen implementar servidores. La sección 10 abarca temas de seguridad y definitivamente deberías leerla antes de exponer tu servidor a la red.</p>
+</div>
+
+<p>Un servidor WebSocket es explicado a un muy bajo nivel aquí. Los servidores WebSocket usualmente estan separados y especializados (por una cuestión de balance de cargas y otra razones prácticas), por lo tanto deberías usar un <a href="https://en.wikipedia.org/wiki/Reverse_proxy">Reverse Proxy</a> (semejante a un servidor HTTP común) casi siempre para detectar los Handshakes de WebSocket, preprocesarlos, y reenviar los datos de los clientes al servidor WebSocket real.<br>
+  </p>
+
+<h2 id="Paso_1_El_Handshake_del_WebSocket"><a name="Handshake">Paso 1: El Handshake del WebSocket </a></h2>
+
+<p>Antes que nada, el servidor debe escuchar las conexiones entrantes usando un socket TCP estandar. Dependiendo de tu plataforma, esto puede ser manejado por tí. Por ejemplo asumamos que tu servidor esta escuchando la dirección example.com en el puerto 8000, y tu socket en el servidor responde a la petición GET con /chat.</p>
+
+<div class="warning">
+<p><strong>Advertencia: </strong>El servidor puede escuchar cualquier puerto que elijas, pero si elijes un puerto diferente al 80 o 443 podría haber problemas con los firewalls y proxies. Suele suceder con el puerto 443 tambien pero para eso se necesita un conexión segura (TLS/SSL). También se debe aclarar que la mayoría de los navegadores (como Firefox 8 o superiores) no permiten conexiones a servidores WebSocket sin seguridad que se realicen desde páginas web con seguridad (HTTPS). </p>
+</div>
+
+<p>El Handshake es el puente desde HTTP a WS. En el Handshake se negocian los detalles de la conexión y cualquier de las partes pueden abandonar el proceso antes de completar dicha conexión si los términos no son favorables. El servidor debe ser cuidadoso al analizar lo que el cliente pide, de lo contrario podrían introducirse problemas de seguridad.</p>
+
+<h3 id="Petición_de_Handshake_en_el_cliente">Petición de Handshake en el cliente</h3>
+
+<p>A pesar de que estamos creando un servidor, un cliente es quien tiene que comenzar el proceso de Handshake de WebSocket. Entonces tú tienes que saber cómo interpretar la petición del cliente. El cliente enviará una linda petición HTTP estandar que lucirá algo asi (la versión del HTTP debe ser 1.1 o mayor y el método debe ser GET):</p>
+
+<pre>GET /chat HTTP/1.1
+Host: example.com:8000
+<strong>Upgrade: websocket</strong>
+<strong>Connection: Upgrade</strong>
+Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
+Sec-WebSocket-Version: 13
+
+</pre>
+
+<p>El cliente puede solicitar aquí extensiones y/o sub protocolos; vea <a href="#Miscellaneous">Misceláneos</a> para más detalles. También, cabeceras comunes como <code>User-Agent</code>, <code>Referer</code>, <code>Cookie</code>, or cabeceras de autenticación podrían ser incluidos. Haz lo que quieras con ellos; no pertencen a WebSocket. También puedes ignorarlos. En muchas configuraciones comunes, un proxy inverso ya ha tratado con ellos.</p>
+
+<p>Si alguna cabecera no se entiende o posee un valor incorrecto, el servidor debe responder "<a href="https://developer.mozilla.org/es/docs/HTTP/Response_codes#400">400 Bad Request</a>" e inmediatamente cerrar la conexión. Normalmente, también puede dar la razón porque falló el <em>handshake</em> en el cuerpo de la respuesta HTTP, pero el mensaje podría no ser mostrado (el browser no lo muestra). Si el servidor no comprende que la versión del WebSockets, debería enviar una cabecera <code>Sec-WebSocket-Version</code> que contenga la(s) versión(es) no entendidas. (Esta guía explica v13, la más nueva). Ahora, vamos a ver la cabecera más curiosa, <code>Sec-WebSocket-Key</code>.</p>
+
+<div class="note">
+<p><strong>Tip:</strong> Todos los <strong>navegadores</strong> deben enviar una <a href="https://developer.mozilla.org/es/docs/HTTP/Access_control_CORS#Origin"><code>cabecera Origin</code></a>. Tu puedes usar esta cabecera por seguridad (revisando por el mismo origen, listas blancas/ listas negras, etc.) y enviar un <a href="https://developer.mozilla.org/es/docs/HTTP/Response_codes#403">403 Forbidden</a> si no te gusta lo que ves. Sin embargo, se advierte que los agentes no navegadores pueden enviar un falso <code>Origin</code>.  La mayoría de las aplicaciones rechazaran las solicitudes sin esta cabecera.</p>
+</div>
+
+<div class="note">
+<p><strong>Tip:</strong> The request-uri (<code>/chat</code> here) has no defined meaning in the spec. So many people cleverly use it to let one server handle multiple WebSocket applications. For example, <code>example.com/chat</code> could invoke a multiuser chat app, while <code>/game</code> on the same server might invoke a multiplayer game.</p>
+</div>
+
+<div class="note">
+<p><strong>Note:</strong> <a href="https://developer.mozilla.org/en-US/docs/HTTP/Response_codes">Regular HTTP status codes</a> can only be used before the handshake. After the handshake succeeds, you have to use a different set of codes (defined in section 7.4 of the spec).</p>
+</div>
+
+<h3 id="Respuesta_de_Handshake_del_servidor">Respuesta de Handshake del servidor</h3>
+
+<p>Después de la petición, el servidor debería enviar una linda respuesta (aunque todavía en formato HTTP) que se verá asi (hay que recordar que la cabecera termina con \r \n y agrega un \r \n extra después del último):</p>
+
+<pre><strong>HTTP/1.1 101 Switching Protocols</strong>
+Upgrade: websocket
+Connection: Upgrade
+<strong>Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=
+
+</strong></pre>
+
+<p>Adicionalmente, el servidor puede decidir respecto de las solicitudes "extension/subprotocol" en este punto (ver <a href="#Miscellaneous">Miscelláneos</a> para más detalles). La cabecera <code>Sec-WebSocket-Accept</code> es interesante. El servidor debe derivarla a partir de la cabecera <code>Sec-WebSocket-Key</code> enviada anteriormente por el cliente. Para lograr esto se deben concatenar la cabecera del cliente<span style="line-height: 1.5em;"> </span><code style="font-size: 14px;">Sec-WebSocket-Key</code><span style="line-height: 1.5em;"> y el string "</span><code style="font-size: 14px;">258EAFA5-E914-47DA-95CA-C5AB0DC85B11</code><span style="line-height: 1.5em;">" (es un "</span><a href="https://en.wikipedia.org/wiki/Magic_string" style="line-height: 1.5em;">magic string</a><span style="line-height: 1.5em;">"), calcular el </span><a href="https://en.wikipedia.org/wiki/SHA-1" style="line-height: 1.5em;">hash SHA-1</a><span style="line-height: 1.5em;"> del resultado y devolver el string codificado en</span><span style="line-height: 1.5em;"> </span><a href="https://en.wikipedia.org/wiki/Base64" style="line-height: 1.5em;">base64</a><span style="line-height: 1.5em;"> de este hash.</span></p>
+
+<div class="note">
+<p><strong>FYI:</strong> Este aparentemente complicado e innecesario proceso se realiza de manera que sea obvio para el cliente si el servidor soporta o noWebSockets. Esto es importante de realizar, ya que podrían crearse problemas de seguridad si el servidor acepta conexiones WebSockets pero interpreta los datos como solicitudes HTTP.</p>
+</div>
+
+<p>Así, si la cabecera <code>Sec-WebSocket-Key</code> era "<code>dGhlIHNhbXBsZSBub25jZQ==</code>", la correspondiente respuesta <code>Sec-WebSocket-Accept</code> será "<code>s3pPLMBiTxaQ9kYGzzhZRbK+xOo=</code>". Una vez que el servidor envía estas cabeceras, el "handshake" se considera completo y puedes comenzar a intercambiar datos.</p>
+
+<div class="note">
+<p>El servidor puede enviar otras cabeceras como Set-Cookie, o solicitar autenticación o redirigir mediante otros status codes antes de responder al handshake.</p>
+</div>
+
+<h3 id="Llevando_registro_de_los_clientes">Llevando registro de los clientes</h3>
+
+<p>Esto no está directamente relacionado con el protocolo WebSocket, pero no está de más mencionarlo: tu servidor debe llevar el registro de los sockets de los clientes, de manera de no realizar handshakes constantemente con los clientes que ya han completado este proceso. La misma dirección IP cliente puede intentar conectarse múltiples veces (pero el servidor puede denegar la conexión si se intentan demasiadas conexiones con el objetivo de evitar ataques <a href="https://en.wikipedia.org/wiki/Denial_of_service">ataques DoS</a>).</p>
+
+<h2 id="Paso_2_Intercambiando_Data_Frames">Paso 2: Intercambiando Data Frames</h2>
+
+<p>Tanto el cliente como el servidor puede decidir enviar un mensaje en cualquier momento — ese es el encanto de los WebSockets. Sin embargo, extraer información de esos denominados "frames" o tramas de datos no es una experiencia muy mágica. Aunque todos los frames siguen el mismo formato específico, los datos que van del cliente al servidor se enmascaran utilizando el <a href="https://en.wikipedia.org/wiki/XOR_cipher">cifrado XOR</a> (con una clave de 32 bits). La sección 5 de la especificación describe esto en detalle.</p>
+
+<h3 id="Formato">Formato</h3>
+
+<p>Cada trama de datos (desde el cliente al servidor o viceversa) sigue este mismo formato:</p>
+
+<pre style="float: left; margin-right: 20px;"> 0                   1                   2                   3
+ 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
++-+-+-+-+-------+-+-------------+-------------------------------+
+|F|R|R|R| opcode|M| Payload len |    Extended payload length    |
+|I|S|S|S|  (4)  |A|     (7)     |             (16/64)           |
+|N|V|V|V|       |S|             |   (if payload len==126/127)   |
+| |1|2|3|       |K|             |                               |
++-+-+-+-+-------+-+-------------+ - - - - - - - - - - - - - - - +
+|     Extended payload length continued, if payload len == 127  |
++ - - - - - - - - - - - - - - - +-------------------------------+
+|                               |Masking-key, if MASK set to 1  |
++-------------------------------+-------------------------------+
+| Masking-key (continued)       |          Payload Data         |
++-------------------------------- - - - - - - - - - - - - - - - +
+:                     Payload Data continued ...                :
++ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +
+|                     Payload Data continued ...                |
++---------------------------------------------------------------+</pre>
+
+<p>Los RSV1-3 se pueden ignorar, son para las extensiones.</p>
+
+<p>El bit MASK simplemente indica si el mensaje está codificado. Los mensajes del cliente deben estar enmascarados, por lo que tu servidor debe esperar que valga 1. (De hecho, la <a href="http://tools.ietf.org/html/rfc6455#section-5.1">sección 5.1 de las espeficicaciones</a>  dice que tu servidor debe desconectarse de un cliente si ese cliente envía un mensaje sin enmascarar). Cuando se envía una trama al cliente, no lo ocultes y no pongas el bit de la máscara. Te explicaremos el enmascaramiento más tarde. <em>Nota: Tienes que enmascarar los mensajes incluso cuando uses un socket seguro.</em></p>
+
+<p>El campo opcode define cómo interpretar los datos de la carga útil:<code style="font-style: normal; line-height: 1.5;">0x0</code><span style="line-height: 1.5;"> </span><span style="line-height: 1.5;">para continuar,</span><span style="font-family: courier new,andale mono,monospace; line-height: 1.5;"> </span><code style="font-style: normal; line-height: 1.5;">0x1</code><span style="line-height: 1.5;"> para texto (que siempre se codifica con UTF-8), </span><code style="font-style: normal; line-height: 1.5;">0x2</code><span style="line-height: 1.5;"> para datos binarios, otros llamados "códigos de control" se explican más tarde. En esta versión de WebSockets, de <code>0x3</code> a <code>0x7</code> y de <code>0xB</code> a <code>0xF</code> no tienen significado.</span></p>
+
+<p>El bit FIN indica si este es el último mensaje de una serie. Si es 0, el servidor seguirá escuchando más partes del mensaje; de lo contrario, el servidor debería considerar el mensaje entregado. Más sobre esto después.</p>
+
+<h3 id="Decoding_Payload_Length">Decoding Payload Length</h3>
+
+<p>To read the payload data, you must know when to stop reading. That's why the payload length is important to know. Unfortunately, this is somewhat complicated. To read it, follow these steps:</p>
+
+<ol>
+ <li>Read bits 9-15 (inclusive) and interpret that as an unsigned integer. If it's 125 or less, then that's the length; you're <strong>done</strong>. If it's 126, go to step 2. If it's 127, go to step 3.</li>
+ <li>Read the next 16 bits and interpret those as an unsigned integer. You're <strong>done</strong>.</li>
+ <li>Read the next 64 bits and interpret those as an unsigned integer. You're <strong>done</strong>.</li>
+</ol>
+
+<h3 id="Reading_and_Unmasking_the_Data">Reading and Unmasking the Data</h3>
+
+<p>If the MASK bit was set (and it should be, for client-to-server messages), read the next 4 octets (32 bits); this is the masking key. <span style="line-height: 1.5;">Once the payload length and masking key is decoded, you can go ahead and read that number of bytes from the socket. Let's call the data <strong>ENCODED</strong>, and the key <strong>MASK</strong>. To get <strong>DECODED</strong>, loop through the octets (bytes a.k.a. characters for text data) of <strong>ENCODED</strong> and XOR the octet with the (i modulo 4)th octet of MASK. In pseudo-code (that happens to be valid JavaScript):</span></p>
+
+<pre>var DECODED = "";
+for (var i = 0; i &lt; ENCODED.length; i++) {
+    DECODED[i] = ENCODED[i] ^ MASK[i % 4];
+<span style="line-height: 1.5;">}</span></pre>
+
+<p><span style="line-height: 1.5;">Now you can figure out what <strong>DECODED</strong> means depending on your application.</span></p>
+
+<h3 id="Message_Fragmentation">Message Fragmentation</h3>
+
+<p>The FIN and opcode fields work together to send a message split up into separate frames.  This is called message fragmentation. Fragmentation is only available on opcodes <code>0x0</code> to <code>0x2</code>.</p>
+
+<p><span style="line-height: 1.5;">Recall that the opcode tells what a frame is meant to do. If it's <code>0x1</code>, the payload is text. If it's <code>0x2</code>, the payload is binary data.</span><span style="line-height: 1.5;"> However, if it's </span><code style="font-style: normal; line-height: 1.5;">0x0,</code><span style="line-height: 1.5;"> the frame is a continuation frame. This means the server should concatenate the frame's payload to the last frame it received from that client.</span><span style="line-height: 1.5;"> Here is a rough sketch, in which a server reacts to a client sending text messages. The first message is sent in a single frame, while the second message is sent across three frames. FIN and opcode details are shown only for the client:</span></p>
+
+<pre style="font-size: 14px;"><strong>Client:</strong> FIN=1, opcode=0x1, msg="hello"
+<strong>Server:</strong> <em>(process complete message immediately) </em>Hi.
+<strong>Client:</strong> FIN=0, opcode=0x1, msg="and a"
+<strong>Server:</strong> <em>(listening, new message containing text started)</em>
+<strong>Client:</strong> FIN=0, opcode=0x0, msg="happy new"
+<strong>Server:</strong> <em>(listening, payload concatenated to previous message)</em>
+<strong>Client:</strong> FIN=1, opcode=0x0, msg="year!"
+<strong>Server:</strong> <em>(process complete message) </em>Happy new year to you too!</pre>
+
+<p>Notice the first frame contains an entire message (has <code>FIN=1</code> and <code>opcode!=0x0</code>), so the server can process or respond as it sees fit. The second frame sent by the client has a text payload (<code>opcode=0x1</code>), but the entire message has not arrived yet (<code>FIN=0</code>). All remaining parts of that message are sent with continuation frames (<code>opcode=0x0</code>), and the final frame of the message is marked by <code>FIN=1</code>. <a href="http://tools.ietf.org/html/rfc6455#section-5.4">Section 5.4 of the spec</a> describes message fragmentation.</p>
+
+<h2 id="Pings_and_Pongs_The_Heartbeat_of_WebSockets">Pings and Pongs: The Heartbeat of WebSockets</h2>
+
+<p>At any point after the handshake, either the client or the server can choose to send a ping to the other party. When the ping is received, the recipient must send back a pong as soon as possible. You can use this to make sure that the client is still connected, for example.</p>
+
+<p>A ping or pong is just a regular frame, but it's a <strong>control frame</strong>. Pings have an opcode of <code>0x9</code>, and pongs have an opcode of <code>0xA</code>. When you get a ping, send back a pong with the exact same Payload Data as the ping (for pings and pongs, the max payload length is 125). You might also get a pong without ever sending a ping; ignore this if it happens.</p>
+
+<div class="note">
+<p>If you have gotten more than one ping before you get the chance to send a pong, you only send one pong.</p>
+</div>
+
+<h2 id="Step_4_Closing_the_connection">Step 4: Closing the connection</h2>
+
+<p>To close a connection either the client or server can send a control frame with data containing a specified control sequence to begin the closing handshake (detailed in <a href="http://tools.ietf.org/html/rfc6455#section-5.5.1">Section 5.5.1</a>). Upon receiving such a frame, the other peer sends a Close frame in response. The first peer then closes the connection. Any further data received after closing of connection is then discarded. </p>
+
+<h2 id="Miscellaneous_2"><a name="Miscellaneous">Miscellaneous</a></h2>
+
+<div class="note">
+<p>WebSocket codes, extensions, subprotocols, etc. are registered at the <a href="http://www.iana.org/assignments/websocket/websocket.xml">IANA WebSocket Protocol Registry</a>.</p>
+</div>
+
+<p>WebSocket extensions and subprotocols are negotiated via headers during <a href="#Handshake">the handshake</a>. Sometimes extensions and subprotocols seem too similar to be different things, but there is a clear distinction. Extensions control the WebSocket <strong>frame</strong> and <strong>modify</strong> the payload, while subprotocols structure the WebSocket <strong>payload</strong> and <strong>never modify</strong> anything. Extensions are optional and generalized (like compression); subprotocols are mandatory and localized (like ones for chat and for MMORPG games).</p>
+
+<h3 id="Extensions">Extensions</h3>
+
+<div class="note">
+<p><strong>This section needs expansion. Please edit if you are equipped to do so.</strong></p>
+</div>
+
+<p>Think of an extension as compressing a file before e-mailing it to someone. Whatever you do, you're sending the <em>same</em> data in different forms. The recipient will eventually be able to get the same data as your local copy, but it is sent differently. That's what an extension does. WebSockets defines a protocol and a simple way to send data, but an extension such as compression could allow sending the same data but in a shorter format.</p>
+
+<div class="note">
+<p>Extensions are explained in sections 5.8, 9, 11.3.2, and 11.4 of the spec.</p>
+</div>
+
+<p><em>TODO</em></p>
+
+<h3 id="Subprotocols">Subprotocols</h3>
+
+<p>Think of a subprotocol as a custom <a href="https://en.wikipedia.org/wiki/XML_schema">XML schema</a> or <a href="https://en.wikipedia.org/wiki/Document_Type_Definition">doctype declaration</a>. You're still using XML and its syntax, but you're additionally restricted by a structure you agreed on. WebSocket subprotocols are just like that. They do not introduce anything fancy, they just establish structure. Like a doctype or schema, both parties must agree on the subprotocol; unlike a doctype or schema, the subprotocol is implemented on the server and cannot be externally refered to by the client.</p>
+
+<div class="note">
+<p>Subprotocols are explained in sections 1.9, 4.2, 11.3.4, and 11.5 of the spec.</p>
+</div>
+
+<p>A client has to ask for a specific subprotocol. To do so, it will send something like this <strong>as part of the original handshake</strong>:</p>
+
+<pre>GET /chat HTTP/1.1
+...
+Sec-WebSocket-Protocol: soap, wamp
+
+</pre>
+
+<p>or, equivalently:</p>
+
+<pre>...
+Sec-WebSocket-Protocol: soap
+Sec-WebSocket-Protocol: wamp
+
+</pre>
+
+<p>Now the server must pick one of the protocols that the client suggested and it supports. If there are more than one, send the first one the client sent. Imagine our server can use both <code>soap</code> and <code>wamp</code>. Then, in the response handshake, it'll send:</p>
+
+<pre>Sec-WebSocket-Protocol: soap
+
+</pre>
+
+<div class="warning">
+<p>The server can't send more than one <code>Sec-Websocket-Protocol</code> header.<br>
+ <span style="line-height: 1.5;">If the server doesn't want to use a</span><span style="line-height: 1.5;">ny subprotocol, </span><strong style="line-height: 1.5;">it shouldn't send any <code>Sec-WebSocket-Protocol</code> header</strong><span style="line-height: 1.5;">. Sending a blank header is incorrect.<br>
+ The client may close the connection if it doesn't get the subprotocol it wants.</span></p>
+</div>
+
+<p>If you want your server to obey certain subprotocols, then naturally you'll need extra code on the server. Let's imagine we're using a subprotocol <code>json</code>. In this subprotocol, all data is passed as <a href="https://en.wikipedia.org/wiki/JSON">JSON</a>. If the client solicits this protocol and the server wants to use it, the server will need to have a JSON parser. Practically speaking, this will be part of a library, but the server will need to pass the data around.</p>
+
+<div class="note">
+<p><strong>Tip:</strong> To avoid name conflict, it's recommended to make your subprotocol name part of a domain string. If you are building a custom chat app that uses a proprietary format exclusive to Example Inc., then you might use this: <code>Sec-WebSocket-Protocol: chat.example.com</code>. For different versions, a widely-used method is to add a <code>/</code> followed by the version number, like <code>chat.example.com/2.0</code>. Note that this isn't required, it's just an optional convention, and you can use any string you wish.</p>
+</div>
+
+<h2 id="Related">Related</h2>
+
+<ul>
+ <li><a href="/en-US/docs/WebSockets/Writing_WebSocket_server" title="/en-US/docs/WebSockets/Writing_WebSocket_server">Tutorial: Websocket server in C#</a></li>
+ <li><a href="/en-US/docs/WebSockets/Writing_WebSocket_client_applications">Writing WebSocket client applications</a></li>
+ <li><a href="/en-US/docs/WebSockets/WebSocket_Server_Vb.NET">Tutorial: Websocket server in VB.NET</a></li>
+</ul>
diff --git a/files/es/web/api/window/beforeunload_event/index.html b/files/es/web/api/window/beforeunload_event/index.html
new file mode 100644
index 0000000000..f4465c2b86
--- /dev/null
+++ b/files/es/web/api/window/beforeunload_event/index.html
@@ -0,0 +1,216 @@
+---
+title: beforeunload
+slug: Web/API/Window/beforeunload_event
+translation_of: Web/API/Window/beforeunload_event
+original_slug: Web/Events/beforeunload
+---
+<div>El evento <strong>beforeunload</strong> es disparado cuando la ventana, el documento y sus recursos estan a punto de ser descargados. El documento todavia es visible y el evento todavia es cancelable en este punto.</div>
+
+<div> </div>
+
+<p>Si es asignado un string a la propiedad del objeto Evento returnValue, una caja de dialogo aparece, preguntando al usuario que confirme que dejara la pagina(mirar el ejemplo de abajo).  Algunos navegadores muestran el string devuelto en una caja de dialogos, otros muestran un mensaje fijo. Si no se provee ningun valor, el evento procede silenciosamente.</p>
+
+<div class="note">
+<p><strong>Nota:</strong>Para combatir pop-ups indeseados, los navegadores pueden no mostrar mensajes creados en manejadores del evento beforeunload a menos que se haya interactuado con la pagina, o incluso sin que se haya interactuado en nada con esta.</p>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td>Burbujas</td>
+   <td>No</td>
+  </tr>
+  <tr>
+   <td>Cancelable</td>
+   <td>Si</td>
+  </tr>
+  <tr>
+   <td>Objetos de destino</td>
+   <td>defaultView</td>
+  </tr>
+  <tr>
+   <td>Interfaz</td>
+   <td>{{domxref("Event")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedad</th>
+   <th scope="col">Tipo</th>
+   <th scope="col">Descripcion</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readOnlyInline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>El evento objetivo(el objetivo superior en el arbol del DOM).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readOnlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>El tipo de evento.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readOnlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>El evento normalmente burbujea?</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readOnlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Es posible cancelar el evento?</td>
+  </tr>
+  <tr>
+   <td><code>returnValue</code></td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>El valor actual devuelto por el evento (el mensaje que se le mostrara al usuario).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush:js;">window.addEventListener("beforeunload", function (event) {
+  event.returnValue = "\o/";
+});
+
+// es equivalente a
+window.addEventListener("beforeunload", function (event) {
+  event.preventDefault();
+});</pre>
+
+<p>Navegadores basados en WebKit no siguen las especificaciones para la caja de dialogos. Un ejemplo que funcione con distintos navegadores seria similar al siguiente:</p>
+
+<pre class="brush: js">window.addEventListener("beforeunload", function (e) {
+  var confirmationMessage = "\o/";
+
+  e.returnValue = confirmationMessage;     // Gecko, Trident, Chrome 34+
+  return confirmationMessage;              // Gecko, WebKit, Chrome &lt;34
+});</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>A partir del 25 de Mayo del 2011, la especificion HTML5 establece que llamadas a los metodos {{domxref("window.alert()")}}, {{domxref("window.confirm()")}}, y {{domxref("window.prompt()")}}pueden ser ignoradas durante este evento.Mire las <a href="http://www.w3.org/TR/html5/webappapis.html#user-prompts">especificaciones de HTML5</a> para mas detalles.</p>
+
+<p>Varios navegadores ignoran el resultado del evento y no le preguntan al usuario por confirmacion en absoluto. El documento siempre se descargara automaticamente. Firefox tiene un switch llamado dom.disable_beforeunload en <a>about:config</a>  para habilitar este comportamiento.</p>
+
+<p>Usando este manejador de evento tu pagina previene que Firefox cambie el cache de la pagina a uno en memoria bfcache. Mire <a href="en/Using_Firefox_1.5_caching">Usando el almacenamiento en cache Firefox 1.5</a> para detalles.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "indices.html#event-beforeunload", "beforeunload")}}</td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "browsers.html#unloading-documents", "beforeunload")}}</td>
+   <td>{{Spec2("HTML5 W3C")}}</td>
+   <td>Definicion inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{CompatChrome(1.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>1</td>
+   <td>4</td>
+   <td>12</td>
+   <td>3</td>
+  </tr>
+  <tr>
+   <td>Texto personalizado soporte removido</td>
+   <td>{{CompatChrome(51.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("44.0")}}</td>
+   <td> </td>
+   <td>38</td>
+   <td><a href="https://developer.apple.com/library/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9_1.html">9.1</a></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>(no) <a href="https://bugs.webkit.org/show_bug.cgi?id=19324">defect</a></td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Texto personalizado soporte removido</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(51.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("44.0")}}</td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td>{{CompatChrome(51.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Mire_tambien">Mire tambien</h2>
+
+<ul>
+ <li>{{Event("DOMContentLoaded")}}</li>
+ <li>{{Event("readystatechange")}}</li>
+ <li>{{Event("load")}}</li>
+ <li>{{Event("unload")}}</li>
+ <li><a href="http://www.whatwg.org/specs/web-apps/current-work/#prompt-to-unload-a-document" title="http://www.whatwg.org/specs/web-apps/current-work/#prompt-to-unload-a-document">Unloading Documents — Confirmacion para descargar un documento</a></li>
+ <li><a href="https://developers.google.com/web/updates/2016/04/chrome-51-deprecations?hl=en#remove_custom_messages_in_onbeforeload_dialogs">Remover mensajes personalizados en dialogos onbeforeload despues de Chrome 51</a> </li>
+</ul>
diff --git a/files/es/web/api/window/domcontentloaded_event/index.html b/files/es/web/api/window/domcontentloaded_event/index.html
new file mode 100644
index 0000000000..0659abde6f
--- /dev/null
+++ b/files/es/web/api/window/domcontentloaded_event/index.html
@@ -0,0 +1,149 @@
+---
+title: DOMContentLoaded
+slug: Web/API/Window/DOMContentLoaded_event
+translation_of: Web/API/Window/DOMContentLoaded_event
+original_slug: Web/Events/DOMContentLoaded
+---
+<p>El evento <code>DOMContentLoaded</code> es disparado cuando el documento HTML ha sido completamente cargado y parseado, sin esperar hojas de estilo, images y subframes para  finalizar la carga. Un evento muy diferente - <a href="/en-US/docs/Mozilla_event_reference/load"><code>load</code></a> - debería ser usado solo para detectar una carga completa de la página. Es un error increíblemente popular usar <a href="/en-US/docs/Mozilla_event_reference/load"><code>load</code></a> cuando <code>DOMContentLoaded</code> sería mucho más apropiado, así que úsalo con cuidado.</p>
+
+<p>JavaScript síncrono pausa el parseo del DOM.</p>
+
+<p>También hay mucho propósito general y bibliotecas autónomas que ofrecen métodos de navegador cruzado para detectar que el DOM está preparado.</p>
+
+<h2 id="Speeding_up">Speeding up</h2>
+
+<p>If you want DOM to get parsed as fast as possible after the user had requested the page, some things you could do is turn your <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests">JavaScript asynchronous</a> and to <a href="https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery">optimize loading of stylesheets</a> which if used as usual, slow down page load due to being loaded in parallel, "stealing" traffic from the main html document.</p>
+
+<h2 id="General_info">General info</h2>
+
+<dl>
+ <dt style="width: 120px; text-align: right; float: left;">Specification</dt>
+ <dd style="margin: 0px 0px 0px 120px;"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-end.html#the-end">HTML5</a></dd>
+ <dt style="width: 120px; text-align: right; float: left;">Interface</dt>
+ <dd style="margin: 0px 0px 0px 120px;">Event</dd>
+ <dt style="width: 120px; text-align: right; float: left;">Bubbles</dt>
+ <dd style="margin: 0px 0px 0px 120px;">Yes</dd>
+ <dt style="width: 120px; text-align: right; float: left;">Cancelable</dt>
+ <dd style="margin: 0px 0px 0px 120px;">Yes (although specified as a simple event that isn't cancelable)</dd>
+ <dt style="width: 120px; text-align: right; float: left;">Target</dt>
+ <dd style="margin: 0px 0px 0px 120px;">Document</dd>
+ <dt style="width: 120px; text-align: right; float: left;">Default Action</dt>
+ <dd style="margin: 0px 0px 0px 120px;">None.</dd>
+</dl>
+
+<h2 id="Properties">Properties</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col">Type</th>
+   <th scope="col">Description</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyInline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>The event target (the topmost target in the DOM tree).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The type of event.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event normally bubbles or not.</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event is cancellable or not.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: html">&lt;script&gt;
+  document.addEventListener("DOMContentLoaded", function(event) {
+    console.log("DOM fully loaded and parsed");
+  });
+&lt;/script&gt;
+</pre>
+
+<pre class="brush: html">&lt;script&gt;
+  document.addEventListener("DOMContentLoaded", function(event) {
+    console.log("DOM fully loaded and parsed");
+  });
+
+for(var i=0; i&lt;1000000000; i++)
+{} // this synchronous script is going to delay parsing of the DOM. So the DOMContentLoaded event is going to launch later.
+&lt;/script&gt;
+</pre>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0<sup>[1]</sup></td>
+   <td>{{CompatGeckoDesktop("1")}}<sup>[1]</sup></td>
+   <td>9.0<sup>[2]</sup></td>
+   <td>9.0</td>
+   <td>3.1<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+   <td>{{CompatGeckoMobile("1")}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}<sup>[2]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Bubbling for this event is supported by at least Gecko 1.9.2, Chrome 6, and Safari 4.</p>
+
+<p>[2] Internet Explorer 8 supports the <code>readystatechange</code> event, which can be used to detect when the DOM is ready. In earlier versions of Internet Explorer, this state can be detected by repeatedly trying to execute <code>document.documentElement.doScroll("left");</code>, as this snippet will throw an error until the DOM is ready.</p>
+
+<h2 id="Related_Events">Related Events</h2>
+
+<ul>
+ <li>{{event("DOMContentLoaded")}}</li>
+ <li>{{event("readystatechange")}}</li>
+ <li>{{event("load")}}</li>
+ <li>{{event("beforeunload")}}</li>
+ <li>{{event("unload")}}</li>
+</ul>
diff --git a/files/es/web/api/window/load_event/index.html b/files/es/web/api/window/load_event/index.html
new file mode 100644
index 0000000000..420b99b5d4
--- /dev/null
+++ b/files/es/web/api/window/load_event/index.html
@@ -0,0 +1,126 @@
+---
+title: load
+slug: Web/API/Window/load_event
+tags:
+  - Evento
+translation_of: Web/API/Window/load_event
+original_slug: Web/Events/load
+---
+<p>El evento <code>load</code> se dispara cuando un recurso y sus recursos dependientes han terminado de cargar.</p>
+
+<p> </p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 class="brush: html" id="Window">Window</h3>
+
+<pre class="brush: html">&lt;script&gt;
+  window.addEventListener("load", function(event) {
+    console.log("'Todos los recursos terminaron de cargar!");
+  });
+&lt;/script&gt;</pre>
+
+<h3 id="Elemento_script">Elemento <code>script</code></h3>
+
+<pre class="brush: html">&lt;script&gt;
+  var script = document.createElement("script");
+  script.addEventListener("load", function(event) {
+    console.log("Script terminó de cargarse y ejecutarse");
+  });
+  script.src = "http://example.com/example.js";
+  script.async = true;
+  document.getElementsByTagName("script")[0].parentNode.appendChild(script);
+&lt;/script&gt;</pre>
+
+<h2 id="Información_general">Información general</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
+ <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-load">DOM L3</a></dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
+ <dd style="margin: 0 0 0 120px;">UIEvent</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Propagación</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Objetivo</dt>
+ <dd style="margin: 0 0 0 120px;">Window,Document,Element</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Por defecto Acción</dt>
+ <dd style="margin: 0 0 0 120px;">None.</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedad</th>
+   <th scope="col">Tipo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyInline}}</td>
+   <td><code>{{domxref("EventTarget")}}</code></td>
+   <td>El objetivo del evento (el objetivo superior en el árbol DOM).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyInline}}</td>
+   <td><code>{{domxref("DOMString")}}</code></td>
+   <td>El tipo de evento.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyInline}}</td>
+   <td><code>{{domxref("Boolean")}}</code></td>
+   <td>Si el elemento normalmente se propaga (bubbles) o no.</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyInline}}</td>
+   <td><code>{{domxref("Boolean")}}</code></td>
+   <td>Si el evento es cancelable o no.</td>
+  </tr>
+  <tr>
+   <td><code>view</code> {{readonlyInline}}</td>
+   <td><code>{{domxref("WindowProxy")}}</code></td>
+   <td><code>{{domxref("Document.defaultView", "document.defaultView")}}</code> (<code>window</code> del documento)</td>
+  </tr>
+  <tr>
+   <td><code>detail</code> {{readonlyInline}}</td>
+   <td><code>long</code> (<code>float</code>)</td>
+   <td>0.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('UI Events', '#event-type-load', 'load')}}</td>
+   <td>{{Spec2('UI Events')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'parsing.html#the-end:event-load', 'Load event')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Esto enlaza con la sección en los pasos que se llevan a cabo al final de cargar un documento. Los eventos 'load' también se disparan a muchos elementos. Y tenga en cuenta que hay muchos lugares en la especificación que hacen referencia a cosas que pueden "<a href="https://html.spec.whatwg.org/multipage/parsing.html#delay-the-load-event">retrasar el evento de carga</a>".</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Eventos_relacionados">Eventos relacionados</h2>
+
+<ul>
+ <li>{{event("DOMContentLoaded")}}</li>
+ <li>{{event("readystatechange")}}</li>
+ <li>{{event("load")}}</li>
+ <li>{{event("beforeunload")}}</li>
+ <li>{{event("unload")}}</li>
+</ul>
diff --git a/files/es/web/api/window/url/index.html b/files/es/web/api/window/url/index.html
deleted file mode 100644
index 6ca15914a4..0000000000
--- a/files/es/web/api/window/url/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: Window.URL
-slug: Web/API/Window/URL
-tags:
-  - API
-  - DOM
-  - Propiedad
-  - Referencia
-  - Referência DOM
-  - WebAPI
-translation_of: Web/API/URL
-translation_of_original: Web/API/Window/URL
----
-<p>{{ApiRef("Window")}}{{SeeCompatTable}}</p>
-
-<p>La propiedad <strong><code>Window.URL</code></strong> devuelve un objeto que proporciona métodos estáticos usados para crear y gestionar objetos de URLs. Además puede ser llamado como un constructor para construir objetos {{domxref("URL")}}.</p>
-
-<p>{{AvailableInWorkers}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p>Llamando a un método estático:</p>
-
-<pre class="syntaxbox"><code><var>img</var>.src = URL.{{domxref("URL.createObjectURL", "createObjectURL")}}(<var>blob</var>);</code></pre>
-
-<p>Construyendo un nuevo objeto:</p>
-
-<pre class="syntaxbox"><code>var <var>url</var> = new {{domxref("URL.URL", "URL")}}("../cats/", "https://www.example.com/dogs/");</code></pre>
-
-<h2 id="Especificación">Especificación</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('URL', '#dom-url', 'URL')}}</td>
-   <td>{{Spec2('URL')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>8.0<sup>[2]</sup></td>
-   <td>{{CompatGeckoDesktop("2.0")}}<sup>[1]</sup><br>
-    {{CompatGeckoDesktop("19.0")}}</td>
-   <td>10.0</td>
-   <td>15.0<sup>[2]</sup></td>
-   <td>6.0<sup>[2]</sup><br>
-    7.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}<sup>[2]</sup></td>
-   <td>{{CompatGeckoMobile("14.0")}}<sup>[1]</sup><br>
-    {{CompatGeckoMobile("19.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>15.0<sup>[2]</sup></td>
-   <td>6.0<sup>[2]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Desde Gecko 2 (Firefox 4) hasta Gecko 18 incluidos, Gecko devuelve un objeto con el tipo interno no estandar <code>nsIDOMMozURLProperty</code>. En la práctica, esto no hace ninguna diferencia.</p>
-
-<p>[2] Implementado bajo el nombre no estandar <code>webkitURL</code>.</p>
diff --git a/files/es/web/api/windowbase64/atob/index.html b/files/es/web/api/windowbase64/atob/index.html
deleted file mode 100644
index aa9eeead07..0000000000
--- a/files/es/web/api/windowbase64/atob/index.html
+++ /dev/null
@@ -1,111 +0,0 @@
----
-title: WindowBase64.atob()
-slug: Web/API/WindowBase64/atob
-translation_of: Web/API/WindowOrWorkerGlobalScope/atob
----
-<p>{{APIRef}}</p>
-
-<p>La función <strong>WindowBase64.atob() </strong>descodifica una cadena de datos que ha sido codificada utilizando la codificación en base-64. Puedes utilizar el método {{domxref("window.btoa()")}} para codificar y transmitir datos que, de otro modo podrían generar problemas de comunicación. Luego de ser transmitidos se puede usar el método window.atob() para decodificar los datos de nuevo. Por ejemplo, puedes codificar, transmitir y decodificar los caracteres de control como valores ASCII 0 a 31.</p>
-
-<p>For use with Unicode or UTF-8 strings, see <a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding#The_.22Unicode_Problem.22">this note at Base64 encoding and decoding</a> and <a href="/en-US/docs/Web/API/window.btoa#Unicode_Strings">this note at <code>window.btoa()</code></a>.</p>
-
-<h2 id="Syntax" name="Syntax">Syntax</h2>
-
-<pre class="syntaxbox">var decodedData = window.atob(<em>encodedData</em>);</pre>
-
-<h2 id="Example" name="Example">Example</h2>
-
-<pre class="brush:js">var encodedData = window.btoa("Hello, world"); // encode a string
-var decodedData = window.atob(encodedData); // decode the string</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', '#dom-windowbase64-atob', 'WindowBase64.atob()')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', '#dom-windowbase64-atob', 'WindowBase64.atob()')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot of {{SpecName("HTML WHATWG")}}. No change.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "#dom-windowbase64-atob", "WindowBase64.atob()")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowBase64</code> (properties where on the target before it).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop(1)}}[1][2]</td>
-   <td>10</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile(1)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1]  <code>atob()</code> is also available to XPCOM components implemented in JavaScript, even though <code><a href="/en-US/docs/DOM/window">window</a></code> is not the global object in components.</p>
-
-<p>[2] Starting with <a href="/en-US/Firefox/Releases/27/Site_Compatibility">Firefox 27</a>, this <code>atob()</code> method ignores all space characters in the argument to comply with the latest HTML5 spec. ({{ bug(711180) }})</p>
-
-<h2 id="See_also" name="See_also">See also</h2>
-
-<ul>
- <li><a href="/Web/API/WindowBase64/Base64_encoding_and_decoding">Base64 encoding and decoding</a></li>
- <li><a href="/en-US/docs/data_URIs"><code>data</code> URIs</a></li>
- <li>{{domxref("window.btoa()")}}</li>
- <li><a href="/en-US/docs/Components.utils.importGlobalProperties">Components.utils.importGlobalProperties</a></li>
-</ul>
diff --git a/files/es/web/api/windowbase64/base64_codificando_y_decodificando/index.html b/files/es/web/api/windowbase64/base64_codificando_y_decodificando/index.html
deleted file mode 100644
index c8747777cd..0000000000
--- a/files/es/web/api/windowbase64/base64_codificando_y_decodificando/index.html
+++ /dev/null
@@ -1,345 +0,0 @@
----
-title: Base64 codificando y decodificando
-slug: Web/API/WindowBase64/Base64_codificando_y_decodificando
-translation_of: Glossary/Base64
----
-<p><strong>Base64</strong> es un grupo de esquemas de <a href="https://es.wikipedia.org/wiki/Codificaci%C3%B3n_de_binario_a_texto">codificación de binario a texto</a> que representa los datos binarios mediante una cadena ASCII, traduciéndolos en una representación radix-64. El término <em>Base64</em> se origina de un <a href="https://es.wikipedia.org/wiki/Multipurpose_Internet_Mail_Extensions#Content-Transfer-Encoding">sistema de codificación de transmisión de contenido MIME</a> específico.</p>
-
-<p>Los esquemas de codificación Base64 son comúnmente usados cuando se necesita codificar datos binarios para que sean almacenados y transferidos sobre un medio diseñado para tratar con datos textuales. Esto es para asegurar que los datos se mantienen intactos y sin modificaciones durante la transmisión. Base64 es comúnmente usado en muchas aplicaciones, incluyendo la escritura de emails vía <a href="https://es.wikipedia.org/wiki/Multipurpose_Internet_Mail_Extensions">MIME</a> y el almacenamiento de datos complejos en <a href="/es/docs/XML">XML</a>.</p>
-
-<p>En JavaScript hay dos funciones para decodificar y codificar cadenas base64, respectivamente:</p>
-
-<ul>
- <li>{{domxref("WindowBase64.atob","atob()")}}</li>
- <li>{{domxref("WindowBase64.btoa","btoa()")}}</li>
-</ul>
-
-<p>La función <code>atob()</code> decodifica una cadena de datos que ha sido codificada usando la codificación en base 64. Por el contrario, la función <code>btoa()</code> crea una cadena ASCII codificada en base 64 a partir de una "cadena" de datos binarios.</p>
-
-<p>Ambas funciones trabajan sobre cadenas de texto. Si desea trabajar con <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer">ArrayBuffers</a>, lea <a href="/es/docs/Web/API/WindowBase64/Base64_codificando_y_decodificando$edit#Solution_.232_.E2.80.93_rewriting_atob%28%29_and_btoa%28%29_using_TypedArrays_and_UTF-8">este párrafo</a>.</p>
-
-
-
-<table class="topicpage-table">
- <tbody>
-  <tr>
-   <td>
-    <h2 class="Documentation" id="Documentation" name="Documentation">Documentación</h2>
-
-    <dl>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/data_URIs" title="https://developer.mozilla.org/en-US/docs/data_URIs"><code>data</code> URIs</a></dt>
-     <dd><small><code>Los URIs de</code> datos, definidos por <a class="external" href="http://tools.ietf.org/html/rfc2397" title="http://tools.ietf.org/html/rfc2397">RFC 2397</a>, permiten a los creadores de contenido introducir pequeños ficheros en línea en documentos.</small></dd>
-     <dt><a href="https://es.wikipedia.org/wiki/Base64" title="https://en.wikipedia.org/wiki/Base64">Base64</a></dt>
-     <dd><small>Artículo en Wikipedia sobre el sistema de codificación Base64.</small></dd>
-     <dt>{{domxref("WindowBase64.atob","atob()")}}</dt>
-     <dd><small>Decodifica una cadena de datos que ha sido codificada utilizando base-64.</small></dd>
-     <dt>{{domxref("WindowBase64.btoa","btoa()")}}</dt>
-     <dd><small>Crea una cadena ASCII codificada en base 64 a partir de una "cadena" de datos binarios.</small></dd>
-     <dt><a href="#The_.22Unicode_Problem.22">The "Unicode Problem"</a></dt>
-     <dd><small>En la mayoría de navegadores, llamar a <code>btoa()</code> con una cadena Unicode causará una excepción <code>Character Out Of Range</code>. Este párrafo muestra algunas soluciones.</small></dd>
-     <dt><a href="/en-US/docs/URIScheme" title="/en-US/docs/URIScheme">URIScheme</a></dt>
-     <dd><small>Lista de esquemas URI soportados por Mozilla.</small></dd>
-     <dt><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a></dt>
-     <dd>En este artículo está publicada una librería hecha por nosotros con los siguientes objetivos:</dd>
-     <dd>
-     <ul>
-      <li>crear una interfaz al estilo de <a class="external" href="http://en.wikipedia.org/wiki/C_%28programming_language%29" title="http://en.wikipedia.org/wiki/C_%28programming_language%29">C</a> para cadenas (es decir, arrays de códigos de caracteres —<a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView" title="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView"> <code>ArrayBufferView</code></a> en JavaScript) basada en la interfaz  <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer" title="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer"><code>ArrayBuffer</code></a> de JavaScript.</li>
-      <li>crear una colección de métodos para los que los objetos parecidos a cadenas (de ahora en adelante, <code>stringView</code>s) funcionen estrictamente en arrays de números más que en cadenas JavaScript inmutables.</li>
-      <li>trabajar con otras codificaciones Unicode diferentes de las <a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a>s UTF-16 por defecto de JavaScript.</li>
-     </ul>
-     </dd>
-    </dl>
-
-    <p><span class="alllinks"><a href="/en-US/docs/tag/Base64">Ver todo...</a></span></p>
-   </td>
-   <td>
-    <h2 class="Tools" id="Tools" name="Tools">Herramientas</h2>
-
-    <ul>
-     <li><a href="#Solution_.232_.E2.80.93_rewriting_atob()_and_btoa()_using_TypedArrays_and_UTF-8">Reescribir atob() y btoa() usando TypedArrays y UTF-8</a></li>
-     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code>, una representación parecida a C de cadenas basadas en arrays tipados</a><span class="alllinks"><a href="/en-US/docs/tag/Base64">View All...</a></span></li>
-    </ul>
-
-    <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Temas relacionados</h2>
-
-    <ul>
-     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer"><code>ArrayBuffer</code></a></li>
-     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">Vectores o arrays tipados</a></li>
-     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView">ArrayBufferView</a></li>
-     <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array"><code>Uint8Array</code></a></li>
-     <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView">, una representación parecida a C de cadenas basadas en arrays tipados</a></li>
-     <li><a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a></li>
-     <li><a href="/en-US/docs/URI" title="/en-US/docs/URI"><code>URI</code></a></li>
-     <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI"><code>encodeURI()</code></a></li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-
-
-<h2 id="El_Problema_Unicode">El "Problema Unicode"</h2>
-
-<p>Como las <a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a>s son cadenas codificadas en 16 bits, en la mayoría de navegadores llamar a <code>window.btoa</code> sobre una cadena Unicode resultará en una excepción <code>Character Out Of Range </code>si un carácter excede el rango de los caracteres ASCII de 8 bits. Hay dos posibles métodos para resolver este problema:</p>
-
-<ul>
- <li>el primero es escapar la cadena completa y, entonces, codificarla;</li>
- <li>el segundo es convertir la <a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString"><code>DOMString</code></a> UTF-16 en un array de caracteres UTF-8 y codificarla.</li>
-</ul>
-
-<p>Aquí están los dos posibles métodos:</p>
-
-<h3 id="Solución_1_–_escapar_la_cadena_antes_de_codificarla">Solución #1 – escapar la cadena antes de codificarla</h3>
-
-<pre class="brush:js notranslate">function utf8_to_b64( str ) {
-  return window.btoa(unescape(encodeURIComponent( str )));
-}
-
-function b64_to_utf8( str ) {
-  return decodeURIComponent(escape(window.atob( str )));
-}
-
-// Uso:
-utf8_to_b64('✓ à la mode'); // "4pyTIMOgIGxhIG1vZGU="
-b64_to_utf8('4pyTIMOgIGxhIG1vZGU='); // "✓ à la mode"</pre>
-
-<p>Esta solución ha sido propuesta por <a href="http://ecmanaut.blogspot.com/2006/07/encoding-decoding-utf8-in-javascript.html">Johan Sundström</a>.</p>
-
-<p>Otra posible solución sin utilizar las funciones 'unscape' y 'escape', ya obsoletas.</p>
-
-<pre class="brush:js notranslate">function b64EncodeUnicode(str) {
-    return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
-        return String.fromCharCode('0x' + p1);
-    }));
-}
- b64EncodeUnicode('✓ à la mode'); // "4pyTIMOgIGxhIG1vZGU="
-</pre>
-
-<h3 id="Solución_2_–_reescribir_atob_y_btoa_usando_TypedArrays_y_UTF-8">Solución #2 – reescribir <code>atob()</code> y <code>btoa()</code> usando <code>TypedArray</code>s y UTF-8</h3>
-
-<div class="note"><strong>Nota:</strong> El siguiente código también es útil para obtener un <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">ArrayBuffer</a> a partir de una cadena <em>Base64</em> y/o viceversa (<a href="#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer" title="#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer">véase abajo</a>). <strong>Para una librería completa de arrays tipados, vea <a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView">este artículo</a></strong>.</div>
-
-<pre class="brush: js notranslate">"use strict";
-
-/*\
-|*|
-|*|  Base64 / binary data / UTF-8 strings utilities
-|*|
-|*|  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding
-|*|
-\*/
-
-/* Decodificación de cadena base64 en array de bytes */
-
-function b64ToUint6 (nChr) {
-
-  return nChr &gt; 64 &amp;&amp; nChr &lt; 91 ?
-      nChr - 65
-    : nChr &gt; 96 &amp;&amp; nChr &lt; 123 ?
-      nChr - 71
-    : nChr &gt; 47 &amp;&amp; nChr &lt; 58 ?
-      nChr + 4
-    : nChr === 43 ?
-      62
-    : nChr === 47 ?
-      63
-    :
-      0;
-
-}
-
-function base64DecToArr (sBase64, nBlocksSize) {
-
-  var
-    sB64Enc = sBase64.replace(/[^A-Za-z0-9\+\/]/g, ""), nInLen = sB64Enc.length,
-    nOutLen = nBlocksSize ? Math.ceil((nInLen * 3 + 1 &gt;&gt; 2) / nBlocksSize) * nBlocksSize : nInLen * 3 + 1 &gt;&gt; 2, taBytes = new Uint8Array(nOutLen);
-
-  for (var nMod3, nMod4, nUint24 = 0, nOutIdx = 0, nInIdx = 0; nInIdx &lt; nInLen; nInIdx++) {
-    nMod4 = nInIdx &amp; 3;
-    nUint24 |= b64ToUint6(sB64Enc.charCodeAt(nInIdx)) &lt;&lt; 18 - 6 * nMod4;
-    if (nMod4 === 3 || nInLen - nInIdx === 1) {
-      for (nMod3 = 0; nMod3 &lt; 3 &amp;&amp; nOutIdx &lt; nOutLen; nMod3++, nOutIdx++) {
-        taBytes[nOutIdx] = nUint24 &gt;&gt;&gt; (16 &gt;&gt;&gt; nMod3 &amp; 24) &amp; 255;
-      }
-      nUint24 = 0;
-
-    }
-  }
-
-  return taBytes;
-}
-
-/* Codificación de array en una cadena Base64 */
-
-function uint6ToB64 (nUint6) {
-
-  return nUint6 &lt; 26 ?
-      nUint6 + 65
-    : nUint6 &lt; 52 ?
-      nUint6 + 71
-    : nUint6 &lt; 62 ?
-      nUint6 - 4
-    : nUint6 === 62 ?
-      43
-    : nUint6 === 63 ?
-      47
-    :
-      65;
-
-}
-
-function base64EncArr (aBytes) {
-
-  var nMod3 = 2, sB64Enc = "";
-
-  for (var nLen = aBytes.length, nUint24 = 0, nIdx = 0; nIdx &lt; nLen; nIdx++) {
-    nMod3 = nIdx % 3;
-    if (nIdx &gt; 0 &amp;&amp; (nIdx * 4 / 3) % 76 === 0) { sB64Enc += "\r\n"; }
-    nUint24 |= aBytes[nIdx] &lt;&lt; (16 &gt;&gt;&gt; nMod3 &amp; 24);
-    if (nMod3 === 2 || aBytes.length - nIdx === 1) {
-      sB64Enc += String.fromCharCode(uint6ToB64(nUint24 &gt;&gt;&gt; 18 &amp; 63), uint6ToB64(nUint24 &gt;&gt;&gt; 12 &amp; 63), uint6ToB64(nUint24 &gt;&gt;&gt; 6 &amp; 63), uint6ToB64(nUint24 &amp; 63));
-      nUint24 = 0;
-    }
-  }
-
-  return sB64Enc.substr(0, sB64Enc.length - 2 + nMod3) + (nMod3 === 2 ? '' : nMod3 === 1 ? '=' : '==');
-
-}
-
-/* De array UTF-8 a DOMString y viceversa */
-
-function UTF8ArrToStr (aBytes) {
-
-  var sView = "";
-
-  for (var nPart, nLen = aBytes.length, nIdx = 0; nIdx &lt; nLen; nIdx++) {
-    nPart = aBytes[nIdx];
-    sView += String.fromCharCode(
-      nPart &gt; 251 &amp;&amp; nPart &lt; 254 &amp;&amp; nIdx + 5 &lt; nLen ? /* six bytes */
-        /* (nPart - 252 &lt;&lt; 30) may be not so safe in ECMAScript! So...: */
-        (nPart - 252) * 1073741824 + (aBytes[++nIdx] - 128 &lt;&lt; 24) + (aBytes[++nIdx] - 128 &lt;&lt; 18) + (aBytes[++nIdx] - 128 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
-      : nPart &gt; 247 &amp;&amp; nPart &lt; 252 &amp;&amp; nIdx + 4 &lt; nLen ? /* five bytes */
-        (nPart - 248 &lt;&lt; 24) + (aBytes[++nIdx] - 128 &lt;&lt; 18) + (aBytes[++nIdx] - 128 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
-      : nPart &gt; 239 &amp;&amp; nPart &lt; 248 &amp;&amp; nIdx + 3 &lt; nLen ? /* four bytes */
-        (nPart - 240 &lt;&lt; 18) + (aBytes[++nIdx] - 128 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
-      : nPart &gt; 223 &amp;&amp; nPart &lt; 240 &amp;&amp; nIdx + 2 &lt; nLen ? /* three bytes */
-        (nPart - 224 &lt;&lt; 12) + (aBytes[++nIdx] - 128 &lt;&lt; 6) + aBytes[++nIdx] - 128
-      : nPart &gt; 191 &amp;&amp; nPart &lt; 224 &amp;&amp; nIdx + 1 &lt; nLen ? /* two bytes */
-        (nPart - 192 &lt;&lt; 6) + aBytes[++nIdx] - 128
-      : /* nPart &lt; 127 ? */ /* one byte */
-        nPart
-    );
-  }
-
-  return sView;
-
-}
-
-function strToUTF8Arr (sDOMStr) {
-
-  var aBytes, nChr, nStrLen = sDOMStr.length, nArrLen = 0;
-
-  /* mapeando... */
-
-  for (var nMapIdx = 0; nMapIdx &lt; nStrLen; nMapIdx++) {
-    nChr = sDOMStr.charCodeAt(nMapIdx);
-    nArrLen += nChr &lt; 0x80 ? 1 : nChr &lt; 0x800 ? 2 : nChr &lt; 0x10000 ? 3 : nChr &lt; 0x200000 ? 4 : nChr &lt; 0x4000000 ? 5 : 6;
-  }
-
-  aBytes = new Uint8Array(nArrLen);
-
-  /* transcripción... */
-
-  for (var nIdx = 0, nChrIdx = 0; nIdx &lt; nArrLen; nChrIdx++) {
-    nChr = sDOMStr.charCodeAt(nChrIdx);
-    if (nChr &lt; 128) {
-      /* un byte */
-      aBytes[nIdx++] = nChr;
-    } else if (nChr &lt; 0x800) {
-      /* dos bytes */
-      aBytes[nIdx++] = 192 + (nChr &gt;&gt;&gt; 6);
-      aBytes[nIdx++] = 128 + (nChr &amp; 63);
-    } else if (nChr &lt; 0x10000) {
-      /* tres bytes */
-      aBytes[nIdx++] = 224 + (nChr &gt;&gt;&gt; 12);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &amp; 63);
-    } else if (nChr &lt; 0x200000) {
-      /* cuatro bytes */
-      aBytes[nIdx++] = 240 + (nChr &gt;&gt;&gt; 18);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 12 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &amp; 63);
-    } else if (nChr &lt; 0x4000000) {
-      /* cinco bytes */
-      aBytes[nIdx++] = 248 + (nChr &gt;&gt;&gt; 24);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 18 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 12 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &amp; 63);
-    } else /* if (nChr &lt;= 0x7fffffff) */ {
-      /* seis bytes */
-      aBytes[nIdx++] = 252 + (nChr &gt;&gt;&gt; 30);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 24 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 18 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 12 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &gt;&gt;&gt; 6 &amp; 63);
-      aBytes[nIdx++] = 128 + (nChr &amp; 63);
-    }
-  }
-
-  return aBytes;
-
-}
-</pre>
-
-<h4 id="Tests">Tests</h4>
-
-<pre class="brush: js notranslate">/* Tests */
-
-var sMyInput = "Base 64 \u2014 Mozilla Developer Network";
-
-var aMyUTF8Input = strToUTF8Arr(sMyInput);
-
-var sMyBase64 = base64EncArr(aMyUTF8Input);
-
-alert(sMyBase64);
-
-var aMyUTF8Output = base64DecToArr(sMyBase64);
-
-var sMyOutput = UTF8ArrToStr(aMyUTF8Output);
-
-alert(sMyOutput);</pre>
-
-<h4 id="Apéndice_Decodificar_una_cadena_Base64_en_Uint8Array_o_ArrayBuffer">Apéndice: Decodificar una cadena <em>Base64</em> en <a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array">Uint8Array</a> o <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">ArrayBuffer</a></h4>
-
-<p>Estas funciones nos permiten crear también <a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array">uint8Arrays</a> o <a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">arrayBuffers</a> a partir de cadenas codificadas en base 64:</p>
-
-<pre class="brush: js notranslate">var myArray = base64DecToArr("QmFzZSA2NCDigJQgTW96aWxsYSBEZXZlbG9wZXIgTmV0d29yaw=="); // "Base 64 \u2014 Mozilla Developer Network"
-
-var myBuffer = base64DecToArr("QmFzZSA2NCDigJQgTW96aWxsYSBEZXZlbG9wZXIgTmV0d29yaw==").buffer; // "Base 64 \u2014 Mozilla Developer Network"
-
-alert(myBuffer.byteLength);</pre>
-
-<div class="note"><strong>Nota:</strong> La función <code>base64DecToArr(sBase64[, <em>nBlocksSize</em>])</code> devuelve un <a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array"><code>uint8Array</code></a> de bytes. Si tu objetivo es construir un búfer de datos crudos de 16, 32 o 64 bits, usa el argumento <code>nBlocksSize</code>, que es el número de bytes de los que la propiedad <code>uint8Array.buffer.bytesLength</code> debe devolver un múltiplo (1 u omitido para ASCII, <a href="/en-US/docs/Web/API/DOMString/Binary">cadenas binarias</a> o cadenas UTF-8 codificacas, 2 para cadenas UTF-16, 4 para cadenas UTF-32).</div>
-
-<p>Para una librería más completa, véase <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code></a><a href="/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView">, una representación parecida a C de cadenas basadas en arrays tipados</a>.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{domxref("WindowBase64.atob","atob()")}}</li>
- <li>{{domxref("WindowBase64.btoa","btoa()")}}</li>
- <li><a href="/en-US/docs/data_URIs" title="/en-US/docs/data_URIs"><code>data</code> URIs</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBuffer">ArrayBuffer</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">TypedArrays</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/ArrayBufferView">ArrayBufferView</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays/Uint8Array">Uint8Array</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Typed_arrays/StringView" title="/en-US/docs/Web/JavaScript/Typed_arrays/StringView"><code>StringView</code> – a C-like representation of strings based on typed arrays</a></li>
- <li><a href="/en-US/docs/Web/API/DOMString" title="/en-US/docs/Web/API/DOMString">DOMString</a></li>
- <li><a href="/en-US/docs/URI" title="/en-US/docs/URI"><code>URI</code></a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI"><code>encodeURI()</code></a></li>
- <li><a href="/en-US/docs/XPCOM_Interface_Reference/nsIURIFixup" title="/en-US/docs/XPCOM_Interface_Reference/nsIURIFixup"><code>nsIURIFixup()</code></a></li>
- <li><a href="https://en.wikipedia.org/wiki/Base64" title="https://en.wikipedia.org/wiki/Base64"><code>Base64 on Wikipedia</code></a></li>
-</ul>
diff --git a/files/es/web/api/windowbase64/index.html b/files/es/web/api/windowbase64/index.html
deleted file mode 100644
index 2607e635fa..0000000000
--- a/files/es/web/api/windowbase64/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: WindowBase64
-slug: Web/API/WindowBase64
-tags:
-  - API
-  - HTML-DOM
-  - Helper
-  - NeedsTranslation
-  - TopicStub
-  - WindowBase64
-translation_of: Web/API/WindowOrWorkerGlobalScope
-translation_of_original: Web/API/WindowBase64
----
-<p>{{APIRef}}</p>
-<p>The <code><strong>WindowBase64</strong></code> helper contains utility methods to convert data to and from base64, a binary-to-text encoding scheme. For example it is used in <a href="/en-US/docs/data_URIs">data URIs</a>.</p>
-<p>There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.</p>
-<h2 id="Properties">Properties</h2>
-<p><em>This helper neither defines nor inherits any properties.</em></p>
-<h2 id="Methods">Methods</h2>
-<p><em>This helper does not inherit any methods.</em></p>
-<dl>
- <dt>
-  {{domxref("WindowBase64.atob()")}}</dt>
- <dd>
-  Decodes a string of data which has been encoded using base-64 encoding.</dd>
- <dt>
-  {{domxref("WindowBase64.btoa()")}}</dt>
- <dd>
-  Creates a base-64 encoded ASCII string from a string of binary data.</dd>
-</dl>
-<h2 id="Specifications">Specifications</h2>
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', '#windowbase64', 'WindowBase64')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', '#windowbase64', 'WindowBase64')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot of {{SpecName("HTML WHATWG")}}. No change.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "#windowbase64", "WindowBase64")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowBase64</code> (properties where on the target before it).</td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-<p>{{CompatibilityTable}}</p>
-<div id="compat-desktop">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Firefox (Gecko)</th>
-    <th>Chrome</th>
-    <th>Internet Explorer</th>
-    <th>Opera</th>
-    <th>Safari</th>
-   </tr>
-   <tr>
-    <td>Basic support</td>
-    <td>{{CompatGeckoDesktop(1)}} [1]</td>
-    <td>{{CompatVersionUnknown}}</td>
-    <td>10.0</td>
-    <td>{{CompatVersionUnknown}}</td>
-    <td>{{CompatVersionUnknown}}</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Firefox Mobile (Gecko)</th>
-    <th>Android</th>
-    <th>IE Mobile</th>
-    <th>Opera Mobile</th>
-    <th>Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Basic support</td>
-    <td>{{CompatGeckoMobile(1)}}</td>
-    <td rowspan="1">{{CompatVersionUnknown}}</td>
-    <td rowspan="1">{{CompatVersionUnknown}}</td>
-    <td rowspan="1">{{CompatVersionUnknown}}</td>
-    <td rowspan="1">{{CompatVersionUnknown}}</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<p>[1]  <code>atob()</code> is also available to XPCOM components implemented in JavaScript, even though {{domxref("Window")}} is not the global object in components.</p>
-<h2 id="See_also">See also</h2>
-<ul>
- <li><a href="/Web/API/WindowBase64/Base64_encoding_and_decoding">Base64 encoding and decoding</a></li>
- <li>{{domxref("Window")}}, {{domxref("WorkerGlobalScope")}}, {{domxref("DedicatedWorkerGlobalScope")}}, {{domxref("SharedWorkerGlobalScope")}}, and {{domxref("ServiceWorkerGlobalScope")}}</li>
-</ul>
diff --git a/files/es/web/api/windoweventhandlers/onunload/index.html b/files/es/web/api/windoweventhandlers/onunload/index.html
new file mode 100644
index 0000000000..111f87edf2
--- /dev/null
+++ b/files/es/web/api/windoweventhandlers/onunload/index.html
@@ -0,0 +1,46 @@
+---
+title: window.onunload
+slug: Web/API/WindowEventHandlers/onunload
+translation_of: Web/API/WindowEventHandlers/onunload
+original_slug: Web/API/GlobalEventHandlers/onunload
+---
+<p>{{ ApiRef() }}</p>
+<h3 id="Summary" name="Summary">Test Summary</h3>
+<p>The unload event is raised when the document is unloaded.</p>
+<h3 id="Syntax" name="Syntax">Syntax</h3>
+<pre class="eval">window.onunload = <em>funcRef</em>;
+</pre>
+<ul>
+ <li><code>funcRef</code> is a reference to a function.</li>
+</ul>
+<h3 id="Example" name="Example">Example</h3>
+<pre>&lt;html&gt;
+&lt;head&gt;
+
+&lt;title&gt;onunload test&lt;/title&gt;
+
+&lt;script type="text/javascript"&gt;
+
+window.onunload = unloadPage;
+
+function unloadPage()
+{
+ alert("unload event detected!");
+}
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+&lt;p&gt;Reload a new page into the browser&lt;br /&gt;
+ to fire the unload event for this page.&lt;/p&gt;
+&lt;p&gt;You can also use the back or forward buttons&lt;br /&gt;
+ to load a new page and fire this event.&lt;/p&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+<h3 id="Notes" name="Notes">Notes</h3>
+<p>Note that using this event handler in your page prevents Firefox 1.5 from caching the page in the in-memory bfcache. See <a href="/En/Using_Firefox_1.5_caching" title="En/Using_Firefox_1.5_caching">Using Firefox 1.5 caching</a> for details.</p>
+<p>Browsers equipped with pop-up window blockers will ignore all window.open() method calls in onunload event handler functions.</p>
+<h3 id="Specification" name="Specification">Specification</h3>
+<p>{{ DOM0() }}</p>
+<p>{{ languages( {"zh-cn": "zh-cn/DOM/window.onunload" } ) }}</p>
diff --git a/files/es/web/api/windoworworkerglobalscope/atob/index.html b/files/es/web/api/windoworworkerglobalscope/atob/index.html
new file mode 100644
index 0000000000..446f7e2df9
--- /dev/null
+++ b/files/es/web/api/windoworworkerglobalscope/atob/index.html
@@ -0,0 +1,112 @@
+---
+title: WindowBase64.atob()
+slug: Web/API/WindowOrWorkerGlobalScope/atob
+translation_of: Web/API/WindowOrWorkerGlobalScope/atob
+original_slug: Web/API/WindowBase64/atob
+---
+<p>{{APIRef}}</p>
+
+<p>La función <strong>WindowBase64.atob() </strong>descodifica una cadena de datos que ha sido codificada utilizando la codificación en base-64. Puedes utilizar el método {{domxref("window.btoa()")}} para codificar y transmitir datos que, de otro modo podrían generar problemas de comunicación. Luego de ser transmitidos se puede usar el método window.atob() para decodificar los datos de nuevo. Por ejemplo, puedes codificar, transmitir y decodificar los caracteres de control como valores ASCII 0 a 31.</p>
+
+<p>For use with Unicode or UTF-8 strings, see <a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding#The_.22Unicode_Problem.22">this note at Base64 encoding and decoding</a> and <a href="/en-US/docs/Web/API/window.btoa#Unicode_Strings">this note at <code>window.btoa()</code></a>.</p>
+
+<h2 id="Syntax" name="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var decodedData = window.atob(<em>encodedData</em>);</pre>
+
+<h2 id="Example" name="Example">Example</h2>
+
+<pre class="brush:js">var encodedData = window.btoa("Hello, world"); // encode a string
+var decodedData = window.atob(encodedData); // decode the string</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', '#dom-windowbase64-atob', 'WindowBase64.atob()')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', '#dom-windowbase64-atob', 'WindowBase64.atob()')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. No change.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "#dom-windowbase64-atob", "WindowBase64.atob()")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowBase64</code> (properties where on the target before it).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop(1)}}[1][2]</td>
+   <td>10</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile(1)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1]  <code>atob()</code> is also available to XPCOM components implemented in JavaScript, even though <code><a href="/en-US/docs/DOM/window">window</a></code> is not the global object in components.</p>
+
+<p>[2] Starting with <a href="/en-US/Firefox/Releases/27/Site_Compatibility">Firefox 27</a>, this <code>atob()</code> method ignores all space characters in the argument to comply with the latest HTML5 spec. ({{ bug(711180) }})</p>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<ul>
+ <li><a href="/Web/API/WindowBase64/Base64_encoding_and_decoding">Base64 encoding and decoding</a></li>
+ <li><a href="/en-US/docs/data_URIs"><code>data</code> URIs</a></li>
+ <li>{{domxref("window.btoa()")}}</li>
+ <li><a href="/en-US/docs/Components.utils.importGlobalProperties">Components.utils.importGlobalProperties</a></li>
+</ul>
diff --git a/files/es/web/api/windoworworkerglobalscope/clearinterval/index.html b/files/es/web/api/windoworworkerglobalscope/clearinterval/index.html
new file mode 100644
index 0000000000..c984baf637
--- /dev/null
+++ b/files/es/web/api/windoworworkerglobalscope/clearinterval/index.html
@@ -0,0 +1,44 @@
+---
+title: WindowTimers.clearInterval()
+slug: Web/API/WindowOrWorkerGlobalScope/clearInterval
+translation_of: Web/API/WindowOrWorkerGlobalScope/clearInterval
+original_slug: Web/API/WindowTimers/clearInterval
+---
+<div>
+<div>{{APIRef("HTML DOM")}}</div>
+</div>
+
+<p>Cancela una acción reiterativa que se inició mediante una llamada a {{domxref("window.setInterval", "setInterval")}}.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>window</em>.clearInterval(<var>intervalID</var>)
+</pre>
+
+<p><code>intervalID</code> es el identificador de la acción reiterativa que se desea cancelar. Este ID se obtiene a partir de <code>setInterval()</code>.</p>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<p>Vea el <a href="/en-US/docs/DOM/window.setInterval#Example" title="DOM/window.setInterval#Example">ejemplo de<code> setInterval()</code></a>.</p>
+
+<h2 id="Specification" name="Specification">Especificación</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'timers.html#timers', 'clearInterval')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/JavaScript/Timers" title="JavaScript/Timers">JavaScript timers</a></li>
+ <li>{{domxref("WindowTimers.setTimeout")}}</li>
+ <li>{{domxref("WindowTimers.setInterval")}}</li>
+ <li>{{domxref("WindowTimers.clearTimeout")}}</li>
+ <li>{{domxref("window.requestAnimationFrame")}}</li>
+ <li><a href="/en-US/docs/JavaScript/Timers/Daemons" title="JavaScript/Timers/Daemons"><em>Daemons</em> management</a></li>
+</ul>
diff --git a/files/es/web/api/windoworworkerglobalscope/cleartimeout/index.html b/files/es/web/api/windoworworkerglobalscope/cleartimeout/index.html
new file mode 100644
index 0000000000..4b9c62b78c
--- /dev/null
+++ b/files/es/web/api/windoworworkerglobalscope/cleartimeout/index.html
@@ -0,0 +1,64 @@
+---
+title: window.clearTimeout
+slug: Web/API/WindowOrWorkerGlobalScope/clearTimeout
+translation_of: Web/API/WindowOrWorkerGlobalScope/clearTimeout
+original_slug: Web/API/WindowTimers/clearTimeout
+---
+<div>{{ApiRef}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>Borra el retraso asignado por {{domxref("window.setTimeout","window.setTimeout()")}}.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox">window.clearTimeout(<em>timeoutID</em>)
+</pre>
+
+<ul>
+ <li><code>timeoutID</code> es el ID del timeout que desee borrar, retornado por {{domxref("window.setTimeout","window.setTimeout()")}}.</li>
+</ul>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<p>Ejecute el script de abajo en el contexto de una página web y haga clic en la página una vez. Verá un mensaje emergente en un segundo. Si permanece haciendo clic en la página cada segundo, la alerta nunca aparece.</p>
+
+<pre class="brush: js">var alarm = {
+  remind: function(aMessage) {
+    alert(aMessage);
+    delete this.timeoutID;
+  },
+
+  setup: function() {
+    this.cancel();
+    var self = this;
+    this.timeoutID = window.setTimeout(function(msg) {self.remind(msg);}, 1000, "Wake up!");
+  },
+
+  cancel: function() {
+    if(typeof this.timeoutID == "number") {
+      window.clearTimeout(this.timeoutID);
+      delete this.timeoutID;
+    }
+  }
+};
+window.onclick = function() { alarm.setup() };</pre>
+
+<h2 id="Notes" name="Notes">Notas</h2>
+
+<p>Pasar un ID inválido a <code>clearTimeout</code> no tiene ningún efecto (y no lanza una excepción).</p>
+
+<h2 id="Specification" name="Specification">Especificación</h2>
+
+<p>DOM Nivel 0. Especificado en <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-cleartimeout" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-cleartimeout">HTML5</a>.</p>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/JavaScript/Timers" title="JavaScript/Timers">JavaScript timers</a></li>
+ <li>{{domxref("window.setTimeout")}}</li>
+ <li>{{domxref("window.setInterval")}}</li>
+ <li>{{domxref("window.clearInterval")}}</li>
+ <li>{{domxref("window.requestAnimationFrame")}}</li>
+ <li><a href="/en-US/docs/JavaScript/Timers/Daemons" title="JavaScript/Timers/Daemons"><em>Daemons</em> management</a></li>
+</ul>
diff --git a/files/es/web/api/windoworworkerglobalscope/setinterval/index.html b/files/es/web/api/windoworworkerglobalscope/setinterval/index.html
new file mode 100644
index 0000000000..a00e4b2c93
--- /dev/null
+++ b/files/es/web/api/windoworworkerglobalscope/setinterval/index.html
@@ -0,0 +1,693 @@
+---
+title: WindowTimers.setInterval()
+slug: Web/API/WindowOrWorkerGlobalScope/setInterval
+tags:
+  - API
+  - DOM
+  - Gecko
+  - Intervalos
+  - Method
+  - Temporizadores
+  - Temporizadores de JavaScript
+  - WindowTimers
+  - setInterval
+translation_of: Web/API/WindowOrWorkerGlobalScope/setInterval
+original_slug: Web/API/WindowTimers/setInterval
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<div>Ejecuta una función o un fragmento de código de forma repetitiva cada vez que termina el periodo de tiempo determinado. Devuelve un ID de proceso.</div>
+
+<div></div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><em>var procesoID</em> = window.setInterval(<em>función</em>, <em>intervaloDeTiempo</em>[, <em>parámetro1</em>, <em>parámetro2</em>, ... , parámetroN]);
+<em>var procesoID</em> = window.setInterval(<em>código</em>, <em>intervaloDeTiempo</em>);
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>función</code></dt>
+ <dd>La {{jsxref("function")}} que será ejecutada cada <code>intervaloDeTiempo</code> milisegundos.</dd>
+ <dt><code>código</code></dt>
+ <dd>Una sintaxis opcional permite introducir una cadena en lugar de una función, la cual es evaluada y ejecutada cada <code>intervaloDeTiempo</code> milisegundos. Se recomienda evitar esta sintaxis por la misma razón por la que el comando {{jsxref("eval", "eval()")}} conlleva problemas de seguridad.</dd>
+ <dt><code>intervaloDeTiempo</code></dt>
+ <dd>El tiempo en milisegundos (1/1000 de segundo, ms) que se debe esperar entre cada ejecución de la función o del código. Si el valor es menor que 10, se usará 10 en su lugar. El tiempo entre cada ejecución puede ser mayor al que indicamos, para mayor información puedes revisar el siguiente artículo: {{SectionOnPage("/en-US/docs/Web/API/WindowTimers/setTimeout", "Reasons for delays longer than specified")}}.</dd>
+ <dt>
+ <div class="note">El parámetro <strong>intervaloDeTiempo</strong> es convertido en un entero de 32 bits con signo en el IDL, por lo que el valor más grande que puede tener es 2,147,483,647 milisegundos, aproximadamente 24.8 días.</div>
+ </dt>
+ <dt><code>parámetro1, ..., parámetroN</code> {{optional_inline}}</dt>
+ <dd>Parámetros adicionales que se pasan a la función a ejecutar.</dd>
+</dl>
+
+<div class="note">
+<p>En Internet Explorer 9 y anteriores no es posible pasar más parámetros mediante esta sintaxis. Si quieres activar esta funcionalidad en dichos navegadores deberás usar un polyfill (entra en la sección <a href="#Callback_arguments">Callback arguments</a>).</p>
+</div>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>El valor de retorno <code>procesoID</code> es un valor numérico distinto de cero que identifica al temporizador que fue creado al llamar <code>setInterval()</code>; este valor puede ser usado como parámetro en la función {{domxref("Window.clearInterval()")}} para detener el temporizador. Las funciones <code>setInterval()</code> y {{domxref("WindowTimers.setTimeout", "setTimeout()")}} comparten la misma pila de IDs, por lo que, técnicamente, los comandos <code>clearInterval()</code> y {{domxref("WindowTimers.clearTimeout", "clearTimeout()")}} pueden usarse indiscriminadamente. Sin embargo, por motivos de claridad y mantenimiento, es importante usarlos como corresponde.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> El argumento <code>intervaloDeTiempo</code> se convierte aun entero con signo de 32 bits. Esto limita efectivamente al <code>intervaloDeTiempo</code> a valores de 2147483647 ms, ya que se especifica como entero con signo en el IDL.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_1_Sintaxis_básica">Ejemplo 1: Sintaxis básica</h3>
+
+<p>El siguiente ejemplo muestra la sintaxis básica.</p>
+
+<pre class="brush:js notranslate">var intervalID = window.setInterval(miFuncion, 500, 'Parametro 1', 'Parametro 2');
+
+function miFuncion(a,b) {
+  // Aquí va tu código
+  // Los parámetros son opcionales completamente
+  console.log(a);
+  console.log(b);
+}
+</pre>
+
+<h3 id="Ejemplo_2_Alternando_dos_colores">Ejemplo 2: Alternando dos colores</h3>
+
+<p>El siguiente ejemplo se llama a la función <code>flashtext()</code> una vez por segundo hasta que se presiona el botón Detener.</p>
+
+<pre class="brush:html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+  &lt;meta charset="UTF-8" /&gt;
+  &lt;title&gt;Ejemplo de setInterval/clearInterval&lt;/title&gt;
+  &lt;script&gt;
+     var nIntervId;
+
+     function cambiaDeColor() {
+        nIntervId = setInterval(flasheaTexto, 1000);
+     }
+
+     function flasheaTexto() {
+        var oElem = document.getElementById('mi_mensaje');
+        oElem.style.color = oElem.style.color == 'red' ? 'blue' : 'red';
+        //oElem.style.color ... es un operador ternario o condicional
+     }
+
+     function detenerCambioDeColor() {
+        clearInterval(nIntervId);
+     }
+  &lt;/script&gt;
+&lt;/head&gt;
+&lt;body onload="cambiaDeColor();"&gt;
+  &lt;div id="mi_mensaje"&gt;
+    &lt;p&gt;¡Hola mundo!&lt;/p&gt;
+  &lt;/div&gt;
+  &lt;button onclick="detenerCambioDeColor();"&gt;Detener&lt;/button&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="Ejemplo_3_Simulando_una_máquina_de_escribir">Ejemplo 3: Simulando una máquina de escribir</h3>
+
+<p>El siguiente ejemplo simula una máquina de escribir, primero borra el contenido de una lista de nodos (<code><a href="/en-US/docs/DOM/NodeList">NodeList</a>)</code> que coinciden con un grupo de selectores y después lo escribe lentamente.</p>
+
+<pre class="brush:html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;meta charset="UTF-8" /&gt;
+&lt;title&gt;Máquina de Escribir con JavaScript&lt;/title&gt;
+&lt;script&gt;
+  function maquinaEscribir (sSelector, nRate) {
+
+      function limpiar () {
+        clearInterval(nIntervId);
+        bTyping = false;
+        bStart = true;
+        oCurrent = null;
+        aSheets.length = nIdx = 0;
+      }
+
+      function desplazarse (oSheet, nPos, bEraseAndStop) {
+        if (!oSheet.hasOwnProperty("parts") || aMap.length &lt; nPos) { return true; }
+
+        var oRel, bExit = false;
+
+        if (aMap.length === nPos) { aMap.push(0); }
+
+        while (aMap[nPos] &lt; oSheet.parts.length) {
+          oRel = oSheet.parts[aMap[nPos]];
+
+          desplazarse(oRel, nPos + 1, bEraseAndStop) ? aMap[nPos]++ : bExit = true;
+
+          if (bEraseAndStop &amp;&amp; (oRel.ref.nodeType - 1 | 1) === 3 &amp;&amp; oRel.ref.nodeValue) {
+            bExit = true;
+            oCurrent = oRel.ref;
+            sPart = oCurrent.nodeValue;
+            oCurrent.nodeValue = "";
+          }
+
+          oSheet.ref.appendChild(oRel.ref);
+          if (bExit) { return false; }
+        }
+
+        aMap.length--;
+        return true;
+      }
+
+      function mecanografear () {
+        if (sPart.length === 0 &amp;&amp; desplazarse(aSheets[nIdx], 0, true) &amp;&amp; nIdx++ === aSheets.length - 1) { limpiar(); return; }
+
+        oCurrent.nodeValue += sPart.charAt(0);
+        sPart = sPart.slice(1);
+      }
+
+      function Hoja (oNode) {
+        this.ref = oNode;
+        if (!oNode.hasChildNodes()) { return; }
+        this.parts = Array.prototype.slice.call(oNode.childNodes);
+
+        for (var nChild = 0; nChild &lt; this.parts.length; nChild++) {
+          oNode.removeChild(this.parts[nChild]);
+          this.parts[nChild] = new Hoja(this.parts[nChild]);
+        }
+      }
+
+      var
+        nIntervId, oCurrent = null, bTyping = false, bStart = true,
+        nIdx = 0, sPart = "", aSheets = [], aMap = [];
+
+      this.rate = nRate || 100;
+
+      this.ejecuta = function () {
+        if (bTyping) { return; }
+        if (bStart) {
+          var aItems = document.querySelectorAll(sSelector);
+
+          if (aItems.length === 0) { return; }
+          for (var nItem = 0; nItem &lt; aItems.length; nItem++) {
+            aSheets.push(new Hoja(aItems[nItem]));
+            /* Uncomment the following line if you have previously hidden your elements via CSS: */
+            // aItems[nItem].style.visibility = "visible";
+          }
+
+          bStart = false;
+        }
+
+        nIntervId = setInterval(mecanografear, this.rate);
+        bTyping = true;
+      };
+
+      this.pausa = function () {
+        clearInterval(nIntervId);
+        bTyping = false;
+      };
+
+      this.finaliza = function () {
+        oCurrent.nodeValue += sPart;
+        sPart = "";
+        for (nIdx; nIdx &lt; aSheets.length; desplazarse(aSheets[nIdx++], 0, false));
+        limpiar();
+      };
+  }
+
+    /* usage: */
+    var oTWExample1 = new maquinaEscribir(/* elements: */ "#article, h1, #info, #copyleft", /* frame rate (optional): */ 15);
+
+    /* default frame rate is 100: */
+    var oTWExample2 = new maquinaEscribir("#controls");
+
+    /* you can also change the frame rate value modifying the "rate" property; for example: */
+    // oTWExample2.rate = 150;
+
+    onload = function () {
+      oTWExample1.ejecuta();
+      oTWExample2.ejecuta();
+    };
+&lt;/script&gt;
+&lt;style type="text/css"&gt;
+span.intLink, a, a:visited {
+  cursor: pointer;
+  color: #000000;
+  text-decoration: underline;
+}
+
+#info {
+  width: 180px;
+  height: 150px;
+  float: right;
+  background-color: #eeeeff;
+  padding: 4px;
+  overflow: auto;
+  font-size: 12px;
+  margin: 4px;
+  border-radius: 5px;
+  /* visibility: hidden; */
+}
+&lt;/style&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+&lt;p id="copyleft" style="font-style: italic; font-size: 12px; text-align: center;"&gt;CopyLeft 2012 by &lt;a href="https://developer.mozilla.org/" target="_blank"&gt;Mozilla Developer Network&lt;/a&gt;&lt;/p&gt;
+&lt;p id="controls" style="text-align: center;"&gt;[&amp;nbsp;&lt;span class="intLink" onclick="oTWExample1.ejecuta();"&gt;Ejecutar&lt;/span&gt; | &lt;span class="intLink" onclick="oTWExample1.pausa();"&gt;Pausar&lt;/span&gt; | &lt;span class="intLink" onclick="oTWExample1.finaliza();"&gt;Terminar&lt;/span&gt;&amp;nbsp;]&lt;/p&gt;
+&lt;div id="info"&gt;
+Vivamus blandit massa ut metus mattis in fringilla lectus imperdiet. Proin ac ante a felis ornare vehicula. Fusce pellentesque lacus vitae eros convallis ut mollis magna pellentesque. Pellentesque placerat enim at lacus ultricies vitae facilisis nisi fringilla. In tincidunt tincidunt tincidunt.
+&lt;/div&gt;
+&lt;h1&gt;Maquina de Escribir en JavaScript &lt;/h1&gt;
+
+&lt;div id="article"&gt;
+&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ultrices dolor ac dolor imperdiet ullamcorper. Suspendisse quam libero, luctus auctor mollis sed, malesuada condimentum magna. Quisque in ante tellus, in placerat est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec a mi magna, quis mattis dolor. Etiam sit amet ligula quis urna auctor imperdiet nec faucibus ante. Mauris vel consectetur dolor. Nunc eget elit eget velit pulvinar fringilla consectetur aliquam purus. Curabitur convallis, justo posuere porta egestas, velit erat ornare tortor, non viverra justo diam eget arcu. Phasellus adipiscing fermentum nibh ac commodo. Nam turpis nunc, suscipit a hendrerit vitae, volutpat non ipsum.&lt;/p&gt;
+&lt;form&gt;
+&lt;p&gt;Phasellus ac nisl lorem: &lt;input type="text" /&gt;&lt;br /&gt;
+&lt;textarea style="width: 400px; height: 200px;"&gt;Nullam commodo suscipit lacus non aliquet. Phasellus ac nisl lorem, sed facilisis ligula. Nam cursus lobortis placerat. Sed dui nisi, elementum eu sodales ac, placerat sit amet mauris. Pellentesque dapibus tellus ut ipsum aliquam eu auctor dui vehicula. Quisque ultrices laoreet erat, at ultrices tortor sodales non. Sed venenatis luctus magna, ultricies ultricies nunc fringilla eget. Praesent scelerisque urna vitae nibh tristique varius consequat neque luctus. Integer ornare, erat a porta tempus, velit justo fermentum elit, a fermentum metus nisi eu ipsum. Vivamus eget augue vel dui viverra adipiscing congue ut massa. Praesent vitae eros erat, pulvinar laoreet magna. Maecenas vestibulum mollis nunc in posuere. Pellentesque sit amet metus a turpis lobortis tempor eu vel tortor. Cras sodales eleifend interdum.&lt;/textarea&gt;&lt;/p&gt;
+&lt;p&gt;&lt;input type="submit" value="Send" /&gt;
+&lt;/form&gt;
+&lt;p&gt;Duis lobortis sapien quis nisl luctus porttitor. In tempor semper libero, eu tincidunt dolor eleifend sit amet. Ut nec velit in dolor tincidunt rhoncus non non diam. Morbi auctor ornare orci, non euismod felis gravida nec. Curabitur elementum nisi a eros rutrum nec blandit diam placerat. Aenean tincidunt risus ut nisi consectetur cursus. Ut vitae quam elit. Donec dignissim est in quam tempor consequat. Aliquam aliquam diam non felis convallis suscipit. Nulla facilisi. Donec lacus risus, dignissim et fringilla et, egestas vel eros. Duis malesuada accumsan dui, at fringilla mauris bibStartum quis. Cras adipiscing ultricies fermentum. Praesent bibStartum condimentum feugiat.&lt;/p&gt;
+&lt;p&gt;Nam faucibus, ligula eu fringilla pulvinar, lectus tellus iaculis nunc, vitae scelerisque metus leo non metus. Proin mattis lobortis lobortis. Quisque accumsan faucibus erat, vel varius tortor ultricies ac. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nec libero nunc. Nullam tortor nunc, elementum a consectetur et, ultrices eu orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a nisl eu sem vehicula egestas.&lt;/p&gt;
+&lt;/div&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p><a href="/files/3997/typewriter.html">Observa este ejemplo en acción</a>. Ver más: <a href="/en-US/docs/DOM/window.clearInterval"><code>clearInterval()</code></a>.</p>
+
+<h2 id="Argumentos_de_Callback">Argumentos de Callback</h2>
+
+<p>Como se mencionó previamente Internet Explorer version 9 y anteriores no soportan el pasar argumentos a la función Callback en <code>setTimeout()</code> ni en <code>setInterval()</code>. El siguiente código específico de Internet Explorer muestra un método de superar esta limitante. Para usarlo basta añadir el código marcado al inicio de tu script.</p>
+
+<pre class="brush:js notranslate">/*\
+|*|
+|*|  IE-specific polyfill that enables the passage of arbitrary arguments to the
+|*|  callback functions of javascript timers (HTML5 standard syntax).
+|*|
+|*|  https://developer.mozilla.org/en-US/docs/Web/API/window.setInterval
+|*|  https://developer.mozilla.org/User:fusionchess
+|*|
+|*|  Syntax:
+|*|  var timeoutID = window.setTimeout(func, delay[, param1, param2, ...]);
+|*|  var timeoutID = window.setTimeout(code, delay);
+|*|  var intervalID = window.setInterval(func, delay[, param1, param2, ...]);
+|*|  var intervalID = window.setInterval(code, delay);
+|*|
+\*/
+
+if (document.all &amp;&amp; !window.setTimeout.isPolyfill) {
+  var __nativeST__ = window.setTimeout;
+  window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
+    var aArgs = Array.prototype.slice.call(arguments, 2);
+    return __nativeST__(vCallback instanceof Function ? function () {
+      vCallback.apply(null, aArgs);
+    } : vCallback, nDelay);
+  };
+  window.setTimeout.isPolyfill = true;
+}
+
+if (document.all &amp;&amp; !window.setInterval.isPolyfill) {
+  var __nativeSI__ = window.setInterval;
+  window.setInterval = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
+    var aArgs = Array.prototype.slice.call(arguments, 2);
+    return __nativeSI__(vCallback instanceof Function ? function () {
+      vCallback.apply(null, aArgs);
+    } : vCallback, nDelay);
+  };
+  window.setInterval.isPolyfill = true;
+}
+</pre>
+
+<p>Otra posible solución es el usar funciones anónimas para llamar al Callback, aunque esta solución es un poco más cara. Ejemplo:</p>
+
+<pre class="brush:js notranslate">var intervalID = setInterval(function() { myFunc("one", "two", "three"); }, 1000);</pre>
+
+<p>También puedes hacer uso de <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">function's bind</a>. Ejemplo:</p>
+
+<pre class="brush:js notranslate">var intervalID = setInterval(function(arg1) {}.bind(undefined, 10), 1000);</pre>
+
+<p>{{h3_gecko_minversion("Inactive tabs", "5.0")}}</p>
+
+<p>A partir de Gecko 5.0 {{geckoRelease("5.0")}}, los intervalos no se disparan más de una vez por segundo en las pestañas inactivas.</p>
+
+<h2 id="Problemas_usando_this">Problemas usando "<a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>"</h2>
+
+<p>Cuando pasas el método de un objeto a la función <code>setInterval()</code> éste es invocado fuera de su contexto. Esto puede crear un valor de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> que puede no ser el esperado. Este problema es abordado en detalle en <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this#As_an_object_method">JavaScript reference</a>.</p>
+
+<h3 id="Explicación">Explicación</h3>
+
+<p>Cuando <code>setInterval() o setTimeOut()</code> ejecuta un determinado código o función, ésta corre en un contexto de ejecución separado al de la función en la que se creó dicho temporizador. Por esta razón a la palabra clave <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> se le asigna el valor del objeto <code>window</code> (o el objeto <code>global</code>), no es igual que usar <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> dentro de una fuinción que invoque a <code>setTimeOut()</code>. Observa el siguiente ejemplo (que utiliza <code>setTimeOut()</code> en lugar de <code>setInterval()</code> – el problema, de hecho, es el mismo para ambos temporizadores):</p>
+
+<pre class="brush:js notranslate">miArreglo = ["cero", "uno", "dos"];
+
+miArreglo.miMetodo = function (sPropiedad) {
+    alert(arguments.length &gt; 0 ? this[sPropiedad] : this);
+};
+
+miArreglo.miMetodo(); // imprime "cero,uno,dos"
+miArreglo.miMetodo(1); // imprime "uno"
+setTimeout(miArreglo.miMetodo, 1000); // imprime "[object Window]" despues de 1 segundo
+setTimeout(miArreglo.miMetodo, 1500, "1"); // imprime "undefined" despues de 1,5 segundos
+// tratemos de pasar el objeto 'this'
+setTimeout.call(miArreglo, miArreglo.miMetodo, 2000); // error: "NS_ERROR_XPC_BAD_OP_ON_WN_PROTO: Illegal operation on WrappedNative prototype object"
+setTimeout.call(miArreglo, miArreglo.miMetodo, 2500, 2); // same error</pre>
+
+<p>Como puedes ver no hay forma de pasar el objeto <code>this</code> a la función de Callback en la versión anterior de JavaScript.</p>
+
+<h3 id="Una_posible_solución">Una posible solución</h3>
+
+<p>Una posible alternativa para resolver ésto es reemplazar las dos funciones globales nativas <code>setTimeout()</code> y <code>setInterval()</code> con las siguientes funciones no nativas que permiten su ejecución a través del método <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Function/call"><code>Function.prototype.call</code></a>. El siguiente ejemplo muestra una posible sustitución:</p>
+
+<pre class="brush:js notranslate">// Permite el pase del objeto 'this' a través de temporizadores JavaScript
+
+var __nativeST__ = window.setTimeout, __nativeSI__ = window.setInterval;
+
+window.setTimeout = function (vCallback, nDelay /*, argumentoAPasar1, argumentuAPasar2, etc. */) {
+  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
+  return __nativeST__(vCallback instanceof Function ? function () {
+    vCallback.apply(oThis, aArgs);
+  } : vCallback, nDelay);
+};
+
+window.setInterval = function (vCallback, nDelay /*, argumentoAPasar1, argumentoAPasar2, etc. */) {
+  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
+  return __nativeSI__(vCallback instanceof Function ? function () {
+    vCallback.apply(oThis, aArgs);
+  } : vCallback, nDelay);
+};
+</pre>
+
+<div class="note">Estos dos reemplazos también permiten el camino estándar en HTML5 de pasar argumentos arbitrarios a las funciones de Callback de los temporizadores dentro de IE. Por lo tanto, pueden utilizarse como rellenos (polyfills) <em>no estándar</em>. Para más información vea <a href="#Callback_arguments">callback arguments paragraph</a>.</div>
+
+<p>Prueba de nueva funcionalidad:</p>
+
+<pre class="brush:js notranslate">miArreglo = ["cero", "uno", "dos"];
+
+miArreglo.miMetodo = function (sProperty) {
+    alert(arguments.length &gt; 0 ? this[sProperty] : this);
+};
+
+setTimeout(alert, 1500, "Hola Mundo!"); // la utilizacion estandar de setTimeout y de setInterval se mantiene, pero...
+setTimeout.call(miArreglo, miArreglo.miMetodo, 2000); // imprime "cero,uno,dos" despues de 2 segundos
+setTimeout.call(miArreglo, miArreglo.miMetodo, 2500, 2); // imprime "dos" despues de 2,5 segundos
+</pre>
+
+<p>Otra solución más compleja está en la siguiente liga de <a href="#A_little_framework">framework</a>.</p>
+
+<div class="note">JavaScript 1.8.5 introduce el método <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">Function.prototype.bind()</a></code>, el cual permite especificar el valor de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> para todas sus llamadas en una determinada función. Esto permite sobrellevar facilmente diferentes problemas de contexto con el uso de la palabra <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>. También, ES2015 soporta <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">arrow functions</a>, dentro del lenguaje nos permite escribir cosas como setInterval( () =&gt; this.myMethod) si estamos dentro del método de miArreglo .</div>
+
+<h2 id="MiniDaemon_-_Un_framework_para_administrar_temporizadores">MiniDaemon - Un framework para administrar temporizadores</h2>
+
+<p>En proyectos que requieren muchos temporizadores puede volverse complicado el seguimiento de todos los eventos generados. Una forma de facilitar la administración de timers es guardando sus estados en un objeto. El siguiente ejemplo muestra este tipo de abstracción, la arquitectura del constructor evita explicitamente el uso de cerraduras. También ofrece un camino alternativo para pasar el objeto <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> a la función de Callback (observa la sección Problemas usando "<a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>" para más detalles). Puedes consultar también el siguiente código en<a href="https://github.com/madmurphy/minidaemon.js"> GitHub</a>.</p>
+
+<div class="note">Para una versión más modular de este (<code><em>Daemon)</em></code>puedes verlo en <a href="/en-US/Add-ons/Code_snippets/Timers/Daemons">JavaScript Daemons Management</a>. Aquí encontrarás una versión mas complicada que se reduce a una colección escalable de métodos para el constructor <code><em>Daemon</em></code>. Éste constructor no es más que un clon del  <code><em>MiniDaemon</em></code> con soporte para las funciones <em>init</em> y <em>onstart</em> declarables durante la instanciación del mismo. Por esto el <strong><code><em>MiniDaemon</em></code> framework </strong>se mantiene como el camino recomendado para realizar animaciones simples.</div>
+
+<h3 id="minidaemon.js">minidaemon.js</h3>
+
+<pre class="brush:js notranslate">/*\
+|*|
+|*|  :: MiniDaemon ::
+|*|
+|*|  Revision #2 - September 26, 2014
+|*|
+|*|  https://developer.mozilla.org/en-US/docs/Web/API/window.setInterval
+|*|  https://developer.mozilla.org/User:fusionchess
+|*|  https://github.com/madmurphy/minidaemon.js
+|*|
+|*|  This framework is released under the GNU Lesser General Public License, version 3 or later.
+|*|  http://www.gnu.org/licenses/lgpl-3.0.html
+|*|
+\*/
+
+function MiniDaemon (oOwner, fTask, nRate, nLen) {
+  if (!(this &amp;&amp; this instanceof MiniDaemon)) { return; }
+  if (arguments.length &lt; 2) { throw new TypeError("MiniDaemon - not enough arguments"); }
+  if (oOwner) { this.owner = oOwner; }
+  this.task = fTask;
+  if (isFinite(nRate) &amp;&amp; nRate &gt; 0) { this.rate = Math.floor(nRate); }
+  if (nLen &gt; 0) { this.length = Math.floor(nLen); }
+}
+
+MiniDaemon.prototype.owner = null;
+MiniDaemon.prototype.task = null;
+MiniDaemon.prototype.rate = 100;
+MiniDaemon.prototype.length = Infinity;
+
+  /* These properties should be read-only */
+
+MiniDaemon.prototype.SESSION = -1;
+MiniDaemon.prototype.INDEX = 0;
+MiniDaemon.prototype.PAUSED = true;
+MiniDaemon.prototype.BACKW = true;
+
+  /* Global methods */
+
+MiniDaemon.forceCall = function (oDmn) {
+  oDmn.INDEX += oDmn.BACKW ? -1 : 1;
+  if (oDmn.task.call(oDmn.owner, oDmn.INDEX, oDmn.length, oDmn.BACKW) === false || oDmn.isAtEnd()) { oDmn.pause(); return false; }
+  return true;
+};
+
+  /* Instances methods */
+
+MiniDaemon.prototype.isAtEnd = function () {
+  return this.BACKW ? isFinite(this.length) &amp;&amp; this.INDEX &lt; 1 : this.INDEX + 1 &gt; this.length;
+};
+
+MiniDaemon.prototype.synchronize = function () {
+  if (this.PAUSED) { return; }
+  clearInterval(this.SESSION);
+  this.SESSION = setInterval(MiniDaemon.forceCall, this.rate, this);
+};
+
+MiniDaemon.prototype.pause = function () {
+  clearInterval(this.SESSION);
+  this.PAUSED = true;
+};
+
+MiniDaemon.prototype.start = function (bReverse) {
+  var bBackw = Boolean(bReverse);
+  if (this.BACKW === bBackw &amp;&amp; (this.isAtEnd() || !this.PAUSED)) { return; }
+  this.BACKW = bBackw;
+  this.PAUSED = false;
+  this.synchronize();
+};
+</pre>
+
+<div class="note">MiniDaemon pasa argumentos a la función callback. Si quieres trabajar con ellos en navegadores que no soportan nativamente esta característica, usa uno de los métodos propuestos arriba.</div>
+
+<h3 id="Sintaxis_2">Sintaxis</h3>
+
+<p><code>var myDaemon = new MiniDaemon(<em>thisObject</em>, <em>callback</em>[</code><code>, <em>rate</em></code><code>[, <em>length</em>]]);</code></p>
+
+<h3 id="Descripción">Descripción</h3>
+
+<p>Regresa un <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">Objecto</a></code> que contiene la información necesaria para una animación (como el objeto <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>, la función de Callback, la duración y el frame-rate).</p>
+
+<h4 id="Parámetros_2">Parámetros</h4>
+
+<dl>
+ <dt><code>thisObject</code></dt>
+ <dd>El valor de la palabra <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> sobre el cual funcionará la función de <em>Callback. </em>Puede ser un <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>objecto</code></a> o <code>null</code>.</dd>
+ <dt><code>callback</code></dt>
+ <dd>La función que se invocará repetidas veces. Dicha función se invocará con tres parámetros: <em>index</em> que corresponde al valor iterativo de cada invocación, <em>length</em> que es el número total de invocaciones asignadas al <em>daemon</em> (puede ser un valor finito o <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>) y <em>backwards</em> (valor booleano que expresa cuando el valor de <em>index</em> es creciente o decreciente). Es similar a <em>callback</em>.call(<em>thisObject</em>, <em>index</em>, <em>length</em>, <em>backwards</em>). Si la función de Callback regresa un valor false el deamon se detiene.</dd>
+ <dt><code>rate (optional)</code></dt>
+ <dd>El tiempo minimo en milisegundos que transcurre entre cada invocación. El valor por omisión es 100.</dd>
+ <dt><code>length (optional)</code></dt>
+ <dd>El número total de invocaciones. Puede ser un valor entero positivo o <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>. El valor por omisión es <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity">Infinity</a>.</code></dd>
+</dl>
+
+<h4 id="Propiedades_de_la_intancia_MiniDaemon"><code>Propiedades de la intancia MiniDaemon</code> </h4>
+
+<dl>
+ <dt><code>myDaemon.owner</code></dt>
+ <dd>El objeto <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> sobre el cual se ejecuta el daemon (lectura/escritura). Puede ser un <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>objecto</code></a> o <code>null</code>.</dd>
+ <dt><code>myDaemon.task</code></dt>
+ <dd>La función que se invocará repetidas veces. Dicha función se invocará con tres parámetros: <em>index</em> que corresponde al valor iterativo de cada invocación, <em>length</em> que es el número total de invocaciones asignadas al <em>daemon</em> (puede ser un valor finito o <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>) y <em>backwards</em> (valor booleano que expresa cuando el valor de <em>index</em> es creciente o decreciente). Es similar a <em>callback</em>.call(<em>thisObject</em>, <em>index</em>, <em>length</em>, <em>backwards</em>). Si la función de Callback regresa un valor false el deamon se detiene.</dd>
+ <dt><code>myDaemon.rate</code></dt>
+ <dd>El tiempo minimo en milisegundos que transcurre entre cada invocación. El valor por omición es 100 (lectura/escritura).</dd>
+ <dt><code>myDaemon.length</code></dt>
+ <dd>El número total de invocaciones. Puede ser un valor entero positivo o <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>. El valor por omición es <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity">Infinity</a> </code>(lectura/escritura).</dd>
+</dl>
+
+<h4 id="MiniDaemon_instances_methods"><code>MiniDaemon</code> instances methods</h4>
+
+<dl>
+ <dt><code>myDaemon.isAtEnd()</code></dt>
+ <dd>Regresa un valor boleano que expresa cuando el <em>daemon</em> está en posición de inicio/fin o no.</dd>
+ <dt><code>myDaemon.synchronize()</code></dt>
+ <dd>Sincroniza el tiempo de un deamon iniciado con el tiempo de su invocación.</dd>
+ <dt><code>myDaemon.pause()</code></dt>
+ <dd>Pausa el deamon.</dd>
+ <dt><code>myDaemon.start([<em>reverse</em>])</code></dt>
+ <dd>Inicia el daemon hacia adelante "forward" (el indice de cada invocación se incrementa) o hacia atrás "backwards" (el índice de cada invocación se decrementa).</dd>
+</dl>
+
+<h4 id="Métodos_del_objeto_global_del_MiniDaemon">Métodos del objeto global del <code>MiniDaemon</code></h4>
+
+<dl>
+ <dt><code>MiniDaemon.forceCall(<em>minidaemon</em>)</code></dt>
+ <dd>Fuerza una sola función callback a la función <code><em>minidaemon</em>.task</code>  en lugar del hecho de que se ha alcanzado el final o no. En cualquier caso la propiedad INDEX interna crece o decrece según la dirección del proceso.</dd>
+</dl>
+
+<h3 id="Ejemplo_de_uso">Ejemplo de uso</h3>
+
+<p>Tu página HTML:</p>
+
+<pre class="brush:html notranslate">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+  &lt;meta charset="UTF-8" /&gt;
+  &lt;title&gt;MiniDaemin Example - MDN&lt;/title&gt;
+  &lt;script type="text/javascript" src="minidaemon.js"&gt;&lt;/script&gt;
+  &lt;style type="text/css"&gt;
+    #sample_div {
+      visibility: hidden;
+    }
+  &lt;/style&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+  &lt;p&gt;
+    &lt;input type="button" onclick="fadeInOut.start(false /* optional */);" value="fade in" /&gt;
+    &lt;input type="button" onclick="fadeInOut.start(true);" value="fade out"&gt;
+    &lt;input type="button" onclick="fadeInOut.pause();" value="pause" /&gt;
+  &lt;/p&gt;
+
+  &lt;div id="sample_div"&gt;Some text here&lt;/div&gt;
+
+  &lt;script type="text/javascript"&gt;
+    function opacity (nIndex, nLength, bBackwards) {
+      this.style.opacity = nIndex / nLength;
+      if (bBackwards ? nIndex === 0 : nIndex === 1) {
+        this.style.visibility = bBackwards ? "hidden" : "visible";
+      }
+    }
+
+    var fadeInOut = new MiniDaemon(document.getElementById("sample_div"), opacity, 300, 8);
+  &lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p><a href="/files/3995/minidaemon_example.html" title="MiniDaemon Example">Prueba este ejemplo</a></p>
+
+<h2 id="Notas">Notas</h2>
+
+<p>La función<code> setInterval()</code> es usada frecuentemente para asignar una pausa para ejecutar funciones recurrentes, como por ejemplo pintar el siguiente cuadro de una animación.</p>
+
+<p>Puedes cancelar el ciclo iniciado por un <code>setInterval() </code>usando el comando <a href="/en-US/docs/Web/API/WindowTimers/clearInterval"><code>window.clearInterval()</code></a>.</p>
+
+<p>Si solo deseas ejecutar el ciclo una sola vez despues de una pausa usa en su lugar la función <a href="/en-US/docs/Web/API/WindowTimers/setTimeout"><code>window.setTimeout()</code></a>.</p>
+
+<h3 id="Asegúrate_que_el_tiempo_de_ejecución_sea_menor_que_la_frecuencia">Asegúrate que el tiempo de ejecución sea menor que la frecuencia</h3>
+
+<p>Si existe la posibilidad de que tu función o el código a ejecutarse una y otra vez exeda el tiempo marcado en cada intervalo es recomendado que uses recursivamente el nombre de tu función usando <code><a href="/en-US/docs/Web/API/WindowTimers/setTimeout">window.setTimeout</a></code>. Por ejemplo, si usas <code>setInterval </code>para hacer llamadas a un servidor remoto cada 5 segundos, la latencia en la red, un servidor que no responde, o cualquier otro tipo de contratiempo puede generar una pausa mayor a la que indicaste. De esta forma terminarás con solicitudes XHR apiladas que no se resolverán necesariamente en orden.</p>
+
+<p>En estos casos llamadas con un patrón de <code>setTimeout()</code> recursivo es preferible:</p>
+
+<pre class="brush:js notranslate">(function loop(){
+   setTimeout(function() {
+      // Your logic here
+
+      loop();
+  }, delay);
+})();
+</pre>
+
+<p>En este fragmento de código, la función <code>loop()</code> es declarada y es ejecutada inmediatamente. La función <code>loop()</code> es invocada de forma recursiva dentro de <code>setTimeout()</code> despues de cada ejecución. Si bien este patrón no garantiza una ejecución a intervalos fijos, si garantiza que nunca se ejecutará un paso sin que se haya finalizado el anterior. </p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Especificaciones</th>
+   <th>Estatus</th>
+   <th>Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "webappapis.html#dom-setinterval", "WindowTimers.setInterval()")}}</td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+   <td>Definición inicial (DOM Level 0)</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad">Compatibilidad</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)<sup>[2]</sup></th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1")}}</td>
+   <td>4.0</td>
+   <td>4.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>Soporta parámetros para callback<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>10.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoMobile("1")}}</td>
+   <td>6.0</td>
+   <td>6.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>Soporta parámetros para callback<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Whether it supports the optional parameters when in its first form or not.</p>
+
+<p>[2] Anterior a Firefox 13, Firefox pasaba un parametro adicional al callback, indicando el "actual lateness" del timeout en milisegundos. Este parámetro no estandar dejó de usarse en versiones posteriores a Firefox 13. No es recomendable que extensiones basadas en XPCOM para Firefox usen setInterval(), ya que las actualizaciones pueden causar el que el objeto {{domxref("Window")}} se actualice perdiendo los temporizadores. Deberás usar en su lugar {{interface("nsITimer")}}.</p>
+
+<h2 id="Ver_más">Ver más</h2>
+
+<ul>
+ <li><a href="/en-US/Add-ons/Code_snippets/Timers">JavaScript timers</a></li>
+ <li>{{domxref("WindowTimers.setTimeout")}}</li>
+ <li>{{domxref("WindowTimers.clearTimeout")}}</li>
+ <li>{{domxref("WindowTimers.clearInterval")}}</li>
+ <li>{{domxref("window.requestAnimationFrame")}}</li>
+ <li><a href="/en-US/Add-ons/Code_snippets/Timers/Daemons"><em>Daemons</em> management</a></li>
+</ul>
diff --git a/files/es/web/api/windoworworkerglobalscope/settimeout/index.html b/files/es/web/api/windoworworkerglobalscope/settimeout/index.html
new file mode 100644
index 0000000000..ccb517dac3
--- /dev/null
+++ b/files/es/web/api/windoworworkerglobalscope/settimeout/index.html
@@ -0,0 +1,341 @@
+---
+title: WindowOrWorkerGlobalScope.setTimeout
+slug: Web/API/WindowOrWorkerGlobalScope/setTimeout
+tags:
+  - API
+  - HTML DOM
+  - WindowOrWorkerGlobalScope
+  - setTimeout
+translation_of: Web/API/WindowOrWorkerGlobalScope/setTimeout
+original_slug: Web/API/WindowTimers/setTimeout
+---
+<div>{{APIRef("HTML DOM")}}</div>
+
+<p>El método <strong><code>setTimeout()</code></strong> del mixin {{domxref("WindowOrWorkerGlobalScope")}} establece un temporizador que ejecuta una función o una porción de código después de que transcurre un tiempo establecido.</p>
+
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>var idTemporizador</em> = <em>scope</em>.setTimeout(<em>funcion</em>[, <em>retraso</em>, <em>parametro1</em>, <em>parametro2</em>, ...]);
+<em>var</em> <em>idTimeout</em> = <em>scope</em>.setTimeout(<em>funcion</em>[, <em>retraso</em>]);
+<em>var idTimeout</em> = <em>scope</em>.setTimeout(<em>codigo</em>[, <em>retraso</em>]);
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>funcion</code></dt>
+ <dd>Una {{jsxref("function")}} para ejecutar después de que expire el temporizador.</dd>
+ <dt><code>codigo</code></dt>
+ <dd>Una sintaxis opcional que le permite incluir una cadena en lugar de una función, la cual es compilada y ejecutada cuando el temporizador expira. Esta sintaxis <strong>no se recomienda</strong> por las mismas razones que hacen del uso de {{jsxref("Global_Objects/eval", "eval()")}} un riesgo de seguridad.</dd>
+ <dt><code>retraso</code> {{optional_inline}}</dt>
+ <dd>Tiempo, en milisegundos  (milésimas de segundo), que el temporizador debe esperar antes de ejecutar la función o el código. Si se omite este parámetro se usa el valor 0. Tenga en cuenta que el retraso real puede ser más prolongado; ver más abajo {{anch("Reasons for delays longer than specified")}}.</dd>
+ <dt><code>param1, ..., paramN</code> {{optional_inline}}</dt>
+ <dd>Parámetros adicionales que se pasan a la función especificada por  <em>func</em> una vez el temporizador expira.</dd>
+</dl>
+
+<div class="note"><strong>Nota:</strong> Pasar parámetros adicionales a la función en la primera sintaxis no funciona en Internet Explorer 9 o inferior. Si quiere habilitar esta funcionalidad en ese navegador,  debe usar un código de compatibilidad (vea la sección <a href="#Callback_arguments">Callback arguments</a>).</div>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>El valor retornado <code>IDtemporizador</code> es númerico y no es cero; identifica el temporizador creado con la llamada a <code>setTimeout()</code>; este valor puede pasarse a {{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}} para cancelar el temporizador.</p>
+
+<p>Puede ser útil advertir que  <code>setTimeout()</code> y {{domxref("WindowOrWorkerGlobalScope.setInterval", "setInterval()")}} comparten la misma piscina de IDs, y que tanto <code>clearTimeout()</code> como {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}} pueden intercambiarse.  Por claridad, sin embargo,  debe hacerlos coincidir para evitar confusiones cuando mantenga su código.</p>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<p>El siguiente ejemplo establece dos botenes simples en una página web y los engancha a las rutinas <code>setTimeout()</code> y <code>clearTimeout()</code>. Presionando el primer botón establecerá un temporizador que llama un diálogo de alerta después de dos segundos y guarda el id del temporizador para usarlo con <code>clearTimeout()</code>. Opcionalmente puede cancelar este temporizador presionando el segundo botón.</p>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush: html">&lt;p&gt;Ejemplo funcional&lt;/p&gt;
+&lt;button onclick="delayedAlert();"&gt;Muestra una caja de alerta después de dos segundos&lt;/button&gt;
+&lt;p&gt;&lt;/p&gt;
+&lt;button onclick="clearAlert();"&gt;Cancela la alerta antes de que ocurra&lt;/button&gt;
+</pre>
+
+<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
+
+<pre class="brush: js">var timeoutID;
+
+function delayedAlert() {
+  timeoutID = window.setTimeout(slowAlert, 2000);
+}
+
+function slowAlert() {
+  alert("That was really slow!");
+}
+
+function clearAlert() {
+  window.clearTimeout(timeoutID);
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Example') }}</p>
+
+<p>Vea también <a href="/en-US/docs/DOM/window.clearTimeout#Example" title="en-US/docs/DOM/window.clearTimeout#Example"><code>clearTimeout()</code> example</a>.</p>
+
+<h2 id="Callback_arguments">Callback arguments</h2>
+
+<p>Si necesita pasar un argumento a su función callback, pero necesita que funcione en Internet Explorer, que no soporta el envío de parámetros adicionales (ni con <code>setTimeout()</code> o <code>setInterval()</code>) usted puede incluir este código de compatibilidad <em>IE-specific</em> que habilitará la funcionalidad estándar de HTML5 para pasar los parámetros adicionales en ese navegador para ambos temporizadores solamente insertandolo al inicio de sus scripts.</p>
+
+<pre class="brush: js">/*\
+|*|
+|*|  IE-specific polyfill which enables the passage of arbitrary arguments to the
+|*|  callback functions of JavaScript timers (HTML5 standard syntax).
+|*|
+|*|  https://developer.mozilla.org/en-US/docs/DOM/window.setInterval
+|*|
+|*|  Syntax:
+|*|  var timeoutID = window.setTimeout(func, delay, [param1, param2, ...]);
+|*|  var timeoutID = window.setTimeout(code, delay);
+|*|  var intervalID = window.setInterval(func, delay[, param1, param2, ...]);
+|*|  var intervalID = window.setInterval(code, delay);
+|*|
+\*/
+
+if (document.all &amp;&amp; !window.setTimeout.isPolyfill) {
+  var __nativeST__ = window.setTimeout;
+  window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
+    var aArgs = Array.prototype.slice.call(arguments, 2);
+    return __nativeST__(vCallback instanceof Function ? function () {
+      vCallback.apply(null, aArgs);
+    } : vCallback, nDelay);
+  };
+  window.setTimeout.isPolyfill = true;
+}
+
+if (document.all &amp;&amp; !window.setInterval.isPolyfill) {
+  var __nativeSI__ = window.setInterval;
+  window.setInterval = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
+    var aArgs = Array.prototype.slice.call(arguments, 2);
+    return __nativeSI__(vCallback instanceof Function ? function () {
+      vCallback.apply(null, aArgs);
+    } : vCallback, nDelay);
+  };
+  window.setInterval.isPolyfill = true;
+}
+</pre>
+
+<h2 id="Arreglo_solo_para_IE">Arreglo solo para IE</h2>
+
+<p>Si quiere una solución completamente no intrusiva con otros navegadores móviles o de escritorio, incluyendo IE 9 y superior, puede usar los comentarios condicionales de JavaScript:</p>
+
+<pre class="brush: js">/*@cc_on
+  // conditional IE &lt; 9 only fix
+  @if (@_jscript_version &lt;= 6)
+  (function(f){
+     window.setTimeout =f(window.setTimeout);
+     window.setInterval =f(window.setInterval);
+  })(function(f){return function(c,t){var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)}});
+  @end
+@*/
+</pre>
+
+<p>O usar un enfoque más limpio basado en el condicional para IE de HTML:</p>
+
+<pre class="brush: html">&lt;!--[if lt IE 9]&gt;&lt;script&gt;
+(function(f){
+window.setTimeout =f(window.setTimeout);
+window.setInterval =f(window.setInterval);
+})(function(f){return function(c,t){
+var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)}
+});
+&lt;/script&gt;&lt;![endif]--&gt;
+</pre>
+
+<p>Otra posibilidad es usar una función anónima para llamar el callback, pero esta solución es un poco más costosa. Ejemplo:</p>
+
+<pre class="brush: js">var intervalID = setTimeout(function() { myFunc("uno", "dos", "tres"); }, 1000);
+</pre>
+
+<p>Sin embargo, otra posibilidad es usar <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind" title="/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind">function's bind</a>. Ejemplo:</p>
+
+<pre class="brush: js">setTimeout(function(arg1){}.bind(undefined, 10));
+</pre>
+
+<h2 id="El_problema_this">El problema "<code>this</code>"</h2>
+
+<p>Cuando pasa un método a <code>setTimeout()</code> (o cualquier otra función , por el estilo), podría ser invocada con el valor de <code>this</code> equivocado. Este problema es explicado en detalle en la <a href="/en-US/docs/JavaScript/Reference/Operators/this#Method_binding" title="en-US/docs/Core_JavaScript_1.5_Reference/Operators/Special_Operators/this_Operator#Method_binding">referencia de JavaScript</a>.</p>
+
+<h3 id="Explicación">Explicación</h3>
+
+<p>El código ejecutado por <code>setTimeout()</code> corre en un contexto de ejecución diferente al de la función por la que fue llamado. Como consecuencia, la palabra clave <code>this para la función llamada </code>será asignado al objeto <code>window</code> (o <code>global</code>); no tendrá el mismo valor del <code>this</code> de la función que llamó al <code>setTimeout</code>. Vea el siguiente ejemplo:</p>
+
+<pre class="brush: js">myArray = ["cero", "uno", "dos"];
+myArray.myMethod = function (sProperty) {
+    alert(arguments.length &gt; 0 ? this[sProperty] : this);
+};
+
+myArray.myMethod(); // imprime "cero,uno,dos"
+myArray.myMethod(1); // imprime "uno"
+setTimeout(myArray.myMethod, 1000); // imprime "[object Window]" después de 1 segundo
+setTimeout(myArray.myMethod, 1500, "1"); // imprime "undefined" después de 1.5 segundos
+// intentemos pasar el objeto 'this'
+setTimeout.call(myArray, myArray.myMethod, 2000); // error: "NS_ERROR_XPC_BAD_OP_ON_WN_PROTO: Illegal operation on WrappedNative prototype object"
+setTimeout.call(myArray, myArray.myMethod, 2500, 2); // mismo error</pre>
+
+<p>Como puedes ver no hay forma de pasar el objeto <code>this</code> a la función callback.</p>
+
+<h3 id="Una_posible_solución">Una posible solución</h3>
+
+<p>Una posible forma de resolver el problema del "<code>this</code>" es reemplazar las dos funciones globales nativas <code>setTimeout()</code> or <code>setInterval()por dos no-nativas<em> </em> </code>que permitan su invocación a través del método <a href="en-US/docs/JavaScript/Reference/Global_Objects/Function/call" title="en-US/docs/JavaScript/Reference/Global_Objects/Function/call"><code>Function.prototype.call</code></a>. El siguiente ejemplo muestra un posible reemplazo:</p>
+
+<pre class="brush: js">// Enable the passage of the 'this' object through the JavaScript timers
+
+var __nativeST__ = window.setTimeout, __nativeSI__ = window.setInterval;
+
+window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
+  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
+  return __nativeST__(vCallback instanceof Function ? function () {
+    vCallback.apply(oThis, aArgs);
+  } : vCallback, nDelay);
+};
+
+window.setInterval = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
+  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
+  return __nativeSI__(vCallback instanceof Function ? function () {
+    vCallback.apply(oThis, aArgs);
+  } : vCallback, nDelay);
+};</pre>
+
+<div class="note"><strong>Nota:</strong> Estos dos reemplazos habilitarán el estándar HTML5 para el paso de argumentos arbitrarios a las funciones callback de los temporizadores en IE. Pueden usarse como polyfills también. Vea el párrafo <a href="#Callback_arguments">Callback arguments</a>.</div>
+
+<p>Prueba de la nueva característica:</p>
+
+<pre class="brush: js">myArray = ["zero", "one", "two"];
+myArray.myMethod = function (sProperty) {
+    alert(arguments.length &gt; 0 ? this[sProperty] : this);
+};
+
+setTimeout(alert, 1500, "Hello world!"); // the standard use of setTimeout and setInterval is preserved, but...
+setTimeout.call(myArray, myArray.myMethod, 2000); // prints "zero,one,two" after 2 seconds
+setTimeout.call(myArray, myArray.myMethod, 2500, 2); // prints "two" after 2.5 seconds
+</pre>
+
+<p>No hay soluciones nativas <em>ad hoc</em> a este problema.</p>
+
+<div class="note"><strong>Nota:</strong> JavaScript 1.8.5 introduce el método <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind" title="en-US/docs/JavaScript/Reference/Global Objects/Function/bind">Function.prototype.bind(</a></code>, que permite especificar el valor que debería usarse como <code>this</code> para todas las llamadas a una función dada. Esto permite evitar fácilmente los problemas en los que no es claro que será, dependiendo del contexto desde el cual la función sea llamada.</div>
+
+<h2 id="Notas">Notas</h2>
+
+<p>Puede cancelar el temporizador usando <code><a href="/en-US/docs/DOM/window.clearTimeout" title="en-US/docs/DOM/window.clearTimeout">window.clearTimeout()</a></code>. Si desea tener una función llamada repetidamente (p.e., cada N milisegundos), considere usar <code><a href="/en-US/docs/DOM/window.setInterval" title="en-US/docs/DOM/window.setInterval">window.setInterval()</a></code>.</p>
+
+<p>Es importante notar que la función o fragmento de código no puede ser ejecutado hasta que el hilo que llamó <code>setTimeout()</code>haya terminado.</p>
+
+<h3 id="Pasando_cadenas_literales">Pasando cadenas literales</h3>
+
+<p>Pasando una cadena en vez de una función a <code>setTimeout()</code>pasa lo mismo que al usar <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/eval#Don.27t_use_eval.21" title="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/eval">eval</a>. </code></p>
+
+<pre class="brush: js">// Correcto
+window.setTimeout(function() {
+    alert("Hello World!");
+}, 500);
+
+// Incorrecto
+window.setTimeout("alert(\"Hello World!\");", 500);
+
+</pre>
+
+<p>Las cadenas literales son evaluadas en el contexto global, así que los símbolos locales en el contexto donde <code>setTimeout()</code> fue llamado no estarán disponibles cuando la cadena es evaluada como código.</p>
+
+<h3 id="Minimum_maximum_delay_and_timeout_nesting">Minimum/ maximum delay and timeout nesting</h3>
+
+<p><a class="external" href="http://code.google.com/p/chromium/issues/detail?id=792#c10" title="http://code.google.com/p/chromium/issues/detail?id=792#c10">Historically</a> browsers implement <code>setTimeout()</code> "clamping": successive <code>setTimeout()</code> calls with <code>delay</code> smaller than the "minimum delay" limit are forced to use at least the minimum delay. The minimum delay, <code>DOM_MIN_TIMEOUT_VALUE</code>, is 4 ms (stored in a preference in Firefox: <code>dom.min_timeout_value</code>), with a <code>DOM_CLAMP_TIMEOUT_NESTING_LEVEL</code> of 5ms.</p>
+
+<p>In fact, 4ms is <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#timers">specified by the HTML5 spec</a> and is consistent across browsers released in 2010 and onward. Prior to {{ geckoRelease("5.0") }}, the minimum timeout value for nested timeouts was 10 ms.</p>
+
+<p>In addition to "clamping", the timeout can also fire later when the page (or the OS/browser itself) is busy with other tasks.</p>
+
+<p>To implement a 0 ms timeout in a modern browser, you can use {{ domxref("window.postMessage()") }} as <a class="external" href="http://dbaron.org/log/20100309-faster-timeouts" title="http://dbaron.org/log/20100309-faster-timeouts">described here</a>.</p>
+
+<p>Browsers including Internet Explorer, Chrome, Safari, and Firefox store the delay as a 32-bit signed Integer internally. This causes an Integer overflow when using delays larger than 2147483647, resulting in the timeout being executed immediately.</p>
+
+<h4 id="Inactive_tabs">Inactive tabs</h4>
+
+<p>In {{ geckoRelease("5.0") }} and Chrome 11, timeouts are clamped to firing no more often than once per second (1000ms) in inactive tabs; see {{ bug(633421) }} for more information about this in Mozilla or <a class="external" href="http://crbug.com/66078" title="http://crbug.com/66078">crbug.com/66078</a> for details about this in Chrome.</p>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{ CompatGeckoDesktop("1") }}</td>
+   <td>4.0</td>
+   <td>4.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>Soporta parámetros para callback*1</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>10.0</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatUnknown }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>1.0</td>
+   <td>{{ CompatGeckoMobile("1") }}</td>
+   <td>6.0</td>
+   <td>6.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>Soporta parámetros para callback*1</td>
+   <td>{{ CompatUnknown }}</td>
+   <td>{{ CompatUnknown }}</td>
+   <td>{{ CompatUnknown }}</td>
+   <td>{{ CompatUnknown }}</td>
+   <td>{{ CompatUnknown }}</td>
+   <td>{{ CompatUnknown }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>*1 Whether it supports the optional parameters when in its first form or not.</p>
+
+<h2 id="Specification" name="Specification">Especificación</h2>
+
+<p>Parte del DOM nivel 0, como se especifica en <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#timers" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#timers">HTML5</a>.</p>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/JavaScript/Timers" title="/en-US/docs/JavaScript/Timers">JavaScript timers</a></li>
+ <li><a href="/en-US/docs/Mozilla/JavaScript_code_modules/Timer.jsm" title="/en-US/docs/Mozilla/JavaScript_code_modules/Timer.jsm">Timer.jsm</a></li>
+ <li>{{domxref("window.setInterval")}}</li>
+ <li>{{domxref("window.requestAnimationFrame")}}</li>
+ <li><a href="/en-US/docs/JavaScript/Timers/Daemons" title="/en-US/docs/JavaScript/Timers/Daemons"><em>Daemons</em> management</a></li>
+</ul>
diff --git a/files/es/web/api/windowtimers/clearinterval/index.html b/files/es/web/api/windowtimers/clearinterval/index.html
deleted file mode 100644
index 14a1b0d1b8..0000000000
--- a/files/es/web/api/windowtimers/clearinterval/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: WindowTimers.clearInterval()
-slug: Web/API/WindowTimers/clearInterval
-translation_of: Web/API/WindowOrWorkerGlobalScope/clearInterval
----
-<div>
-<div>{{APIRef("HTML DOM")}}</div>
-</div>
-
-<p>Cancela una acción reiterativa que se inició mediante una llamada a {{domxref("window.setInterval", "setInterval")}}.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>window</em>.clearInterval(<var>intervalID</var>)
-</pre>
-
-<p><code>intervalID</code> es el identificador de la acción reiterativa que se desea cancelar. Este ID se obtiene a partir de <code>setInterval()</code>.</p>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<p>Vea el <a href="/en-US/docs/DOM/window.setInterval#Example" title="DOM/window.setInterval#Example">ejemplo de<code> setInterval()</code></a>.</p>
-
-<h2 id="Specification" name="Specification">Especificación</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'timers.html#timers', 'clearInterval')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/JavaScript/Timers" title="JavaScript/Timers">JavaScript timers</a></li>
- <li>{{domxref("WindowTimers.setTimeout")}}</li>
- <li>{{domxref("WindowTimers.setInterval")}}</li>
- <li>{{domxref("WindowTimers.clearTimeout")}}</li>
- <li>{{domxref("window.requestAnimationFrame")}}</li>
- <li><a href="/en-US/docs/JavaScript/Timers/Daemons" title="JavaScript/Timers/Daemons"><em>Daemons</em> management</a></li>
-</ul>
diff --git a/files/es/web/api/windowtimers/cleartimeout/index.html b/files/es/web/api/windowtimers/cleartimeout/index.html
deleted file mode 100644
index 0df5242672..0000000000
--- a/files/es/web/api/windowtimers/cleartimeout/index.html
+++ /dev/null
@@ -1,63 +0,0 @@
----
-title: window.clearTimeout
-slug: Web/API/WindowTimers/clearTimeout
-translation_of: Web/API/WindowOrWorkerGlobalScope/clearTimeout
----
-<div>{{ApiRef}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>Borra el retraso asignado por {{domxref("window.setTimeout","window.setTimeout()")}}.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox">window.clearTimeout(<em>timeoutID</em>)
-</pre>
-
-<ul>
- <li><code>timeoutID</code> es el ID del timeout que desee borrar, retornado por {{domxref("window.setTimeout","window.setTimeout()")}}.</li>
-</ul>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<p>Ejecute el script de abajo en el contexto de una página web y haga clic en la página una vez. Verá un mensaje emergente en un segundo. Si permanece haciendo clic en la página cada segundo, la alerta nunca aparece.</p>
-
-<pre class="brush: js">var alarm = {
-  remind: function(aMessage) {
-    alert(aMessage);
-    delete this.timeoutID;
-  },
-
-  setup: function() {
-    this.cancel();
-    var self = this;
-    this.timeoutID = window.setTimeout(function(msg) {self.remind(msg);}, 1000, "Wake up!");
-  },
-
-  cancel: function() {
-    if(typeof this.timeoutID == "number") {
-      window.clearTimeout(this.timeoutID);
-      delete this.timeoutID;
-    }
-  }
-};
-window.onclick = function() { alarm.setup() };</pre>
-
-<h2 id="Notes" name="Notes">Notas</h2>
-
-<p>Pasar un ID inválido a <code>clearTimeout</code> no tiene ningún efecto (y no lanza una excepción).</p>
-
-<h2 id="Specification" name="Specification">Especificación</h2>
-
-<p>DOM Nivel 0. Especificado en <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-cleartimeout" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-cleartimeout">HTML5</a>.</p>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/JavaScript/Timers" title="JavaScript/Timers">JavaScript timers</a></li>
- <li>{{domxref("window.setTimeout")}}</li>
- <li>{{domxref("window.setInterval")}}</li>
- <li>{{domxref("window.clearInterval")}}</li>
- <li>{{domxref("window.requestAnimationFrame")}}</li>
- <li><a href="/en-US/docs/JavaScript/Timers/Daemons" title="JavaScript/Timers/Daemons"><em>Daemons</em> management</a></li>
-</ul>
diff --git a/files/es/web/api/windowtimers/index.html b/files/es/web/api/windowtimers/index.html
deleted file mode 100644
index 549969232f..0000000000
--- a/files/es/web/api/windowtimers/index.html
+++ /dev/null
@@ -1,119 +0,0 @@
----
-title: WindowTimers
-slug: Web/API/WindowTimers
-tags:
-  - API
-translation_of: Web/API/WindowOrWorkerGlobalScope
-translation_of_original: Web/API/WindowTimers
----
-<div>{{APIRef("HTML DOM")}}</div>
-
-<p><code><strong>WindowTimers</strong></code> contains utility methods to set and clear timers.</p>
-
-<p>There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.</p>
-
-<h2 id="Properties">Properties</h2>
-
-<p><em>This interface do not define any property, nor inherit any.</em></p>
-
-<h2 id="Methods">Methods</h2>
-
-<p><em>This interface do not inherit any method.</em></p>
-
-<dl>
- <dt>{{domxref("WindowTimers.clearInterval()")}}</dt>
- <dd>Cancels the repeated execution set using {{domxref("WindowTimers.setInterval()")}}.</dd>
- <dt>{{domxref("WindowTimers.clearTimeout()")}}</dt>
- <dd>Cancels the repeated execution set using {{domxref("WindowTimers.setTimeout()")}}.</dd>
- <dt>{{domxref("WindowTimers.setInterval()")}}</dt>
- <dd>Schedules the execution of a function each X milliseconds.</dd>
- <dt>{{domxref("WindowTimers.setTimeout()")}}</dt>
- <dd>Sets a delay for executing a function.</dd>
-</dl>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', '#windowtimers', 'WindowTimers')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No change since the latest snapshot, {{SpecName("HTML5.1")}}.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', '#windowtimers', 'WindowTimers')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot of {{SpecName("HTML WHATWG")}}. No change.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "#windowtimers", "WindowTimers")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot of {{SpecName("HTML WHATWG")}}. Creation of <code>WindowBase64</code> (properties where on the target before it).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatGeckoDesktop(1)}}</td>
-   <td>1.0</td>
-   <td>4.0</td>
-   <td>4.0</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Android</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatGeckoMobile(1)}}</td>
-   <td rowspan="1">{{CompatVersionUnknown}}</td>
-   <td rowspan="1">{{CompatVersionUnknown}}</td>
-   <td rowspan="1">{{CompatVersionUnknown}}</td>
-   <td rowspan="1">{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{domxref("Window")}}, {{domxref("WorkerGlobalScope")}}, {{domxref("DedicatedWorkerGlobalScope")}}, {{domxref("SharedWorkerGlobalScope")}}, and {{domxref("ServiceWorkerGlobalScope")}}</li>
-</ul>
diff --git a/files/es/web/api/windowtimers/setinterval/index.html b/files/es/web/api/windowtimers/setinterval/index.html
deleted file mode 100644
index fe41612dd6..0000000000
--- a/files/es/web/api/windowtimers/setinterval/index.html
+++ /dev/null
@@ -1,692 +0,0 @@
----
-title: WindowTimers.setInterval()
-slug: Web/API/WindowTimers/setInterval
-tags:
-  - API
-  - DOM
-  - Gecko
-  - Intervalos
-  - Method
-  - Temporizadores
-  - Temporizadores de JavaScript
-  - WindowTimers
-  - setInterval
-translation_of: Web/API/WindowOrWorkerGlobalScope/setInterval
----
-<div>{{APIRef("HTML DOM")}}</div>
-
-<div>Ejecuta una función o un fragmento de código de forma repetitiva cada vez que termina el periodo de tiempo determinado. Devuelve un ID de proceso.</div>
-
-<div></div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><em>var procesoID</em> = window.setInterval(<em>función</em>, <em>intervaloDeTiempo</em>[, <em>parámetro1</em>, <em>parámetro2</em>, ... , parámetroN]);
-<em>var procesoID</em> = window.setInterval(<em>código</em>, <em>intervaloDeTiempo</em>);
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>función</code></dt>
- <dd>La {{jsxref("function")}} que será ejecutada cada <code>intervaloDeTiempo</code> milisegundos.</dd>
- <dt><code>código</code></dt>
- <dd>Una sintaxis opcional permite introducir una cadena en lugar de una función, la cual es evaluada y ejecutada cada <code>intervaloDeTiempo</code> milisegundos. Se recomienda evitar esta sintaxis por la misma razón por la que el comando {{jsxref("eval", "eval()")}} conlleva problemas de seguridad.</dd>
- <dt><code>intervaloDeTiempo</code></dt>
- <dd>El tiempo en milisegundos (1/1000 de segundo, ms) que se debe esperar entre cada ejecución de la función o del código. Si el valor es menor que 10, se usará 10 en su lugar. El tiempo entre cada ejecución puede ser mayor al que indicamos, para mayor información puedes revisar el siguiente artículo: {{SectionOnPage("/en-US/docs/Web/API/WindowTimers/setTimeout", "Reasons for delays longer than specified")}}.</dd>
- <dt>
- <div class="note">El parámetro <strong>intervaloDeTiempo</strong> es convertido en un entero de 32 bits con signo en el IDL, por lo que el valor más grande que puede tener es 2,147,483,647 milisegundos, aproximadamente 24.8 días.</div>
- </dt>
- <dt><code>parámetro1, ..., parámetroN</code> {{optional_inline}}</dt>
- <dd>Parámetros adicionales que se pasan a la función a ejecutar.</dd>
-</dl>
-
-<div class="note">
-<p>En Internet Explorer 9 y anteriores no es posible pasar más parámetros mediante esta sintaxis. Si quieres activar esta funcionalidad en dichos navegadores deberás usar un polyfill (entra en la sección <a href="#Callback_arguments">Callback arguments</a>).</p>
-</div>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>El valor de retorno <code>procesoID</code> es un valor numérico distinto de cero que identifica al temporizador que fue creado al llamar <code>setInterval()</code>; este valor puede ser usado como parámetro en la función {{domxref("Window.clearInterval()")}} para detener el temporizador. Las funciones <code>setInterval()</code> y {{domxref("WindowTimers.setTimeout", "setTimeout()")}} comparten la misma pila de IDs, por lo que, técnicamente, los comandos <code>clearInterval()</code> y {{domxref("WindowTimers.clearTimeout", "clearTimeout()")}} pueden usarse indiscriminadamente. Sin embargo, por motivos de claridad y mantenimiento, es importante usarlos como corresponde.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> El argumento <code>intervaloDeTiempo</code> se convierte aun entero con signo de 32 bits. Esto limita efectivamente al <code>intervaloDeTiempo</code> a valores de 2147483647 ms, ya que se especifica como entero con signo en el IDL.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_1_Sintaxis_básica">Ejemplo 1: Sintaxis básica</h3>
-
-<p>El siguiente ejemplo muestra la sintaxis básica.</p>
-
-<pre class="brush:js notranslate">var intervalID = window.setInterval(miFuncion, 500, 'Parametro 1', 'Parametro 2');
-
-function miFuncion(a,b) {
-  // Aquí va tu código
-  // Los parámetros son opcionales completamente
-  console.log(a);
-  console.log(b);
-}
-</pre>
-
-<h3 id="Ejemplo_2_Alternando_dos_colores">Ejemplo 2: Alternando dos colores</h3>
-
-<p>El siguiente ejemplo se llama a la función <code>flashtext()</code> una vez por segundo hasta que se presiona el botón Detener.</p>
-
-<pre class="brush:html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-  &lt;meta charset="UTF-8" /&gt;
-  &lt;title&gt;Ejemplo de setInterval/clearInterval&lt;/title&gt;
-  &lt;script&gt;
-     var nIntervId;
-
-     function cambiaDeColor() {
-        nIntervId = setInterval(flasheaTexto, 1000);
-     }
-
-     function flasheaTexto() {
-        var oElem = document.getElementById('mi_mensaje');
-        oElem.style.color = oElem.style.color == 'red' ? 'blue' : 'red';
-        //oElem.style.color ... es un operador ternario o condicional
-     }
-
-     function detenerCambioDeColor() {
-        clearInterval(nIntervId);
-     }
-  &lt;/script&gt;
-&lt;/head&gt;
-&lt;body onload="cambiaDeColor();"&gt;
-  &lt;div id="mi_mensaje"&gt;
-    &lt;p&gt;¡Hola mundo!&lt;/p&gt;
-  &lt;/div&gt;
-  &lt;button onclick="detenerCambioDeColor();"&gt;Detener&lt;/button&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="Ejemplo_3_Simulando_una_máquina_de_escribir">Ejemplo 3: Simulando una máquina de escribir</h3>
-
-<p>El siguiente ejemplo simula una máquina de escribir, primero borra el contenido de una lista de nodos (<code><a href="/en-US/docs/DOM/NodeList">NodeList</a>)</code> que coinciden con un grupo de selectores y después lo escribe lentamente.</p>
-
-<pre class="brush:html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;meta charset="UTF-8" /&gt;
-&lt;title&gt;Máquina de Escribir con JavaScript&lt;/title&gt;
-&lt;script&gt;
-  function maquinaEscribir (sSelector, nRate) {
-
-      function limpiar () {
-        clearInterval(nIntervId);
-        bTyping = false;
-        bStart = true;
-        oCurrent = null;
-        aSheets.length = nIdx = 0;
-      }
-
-      function desplazarse (oSheet, nPos, bEraseAndStop) {
-        if (!oSheet.hasOwnProperty("parts") || aMap.length &lt; nPos) { return true; }
-
-        var oRel, bExit = false;
-
-        if (aMap.length === nPos) { aMap.push(0); }
-
-        while (aMap[nPos] &lt; oSheet.parts.length) {
-          oRel = oSheet.parts[aMap[nPos]];
-
-          desplazarse(oRel, nPos + 1, bEraseAndStop) ? aMap[nPos]++ : bExit = true;
-
-          if (bEraseAndStop &amp;&amp; (oRel.ref.nodeType - 1 | 1) === 3 &amp;&amp; oRel.ref.nodeValue) {
-            bExit = true;
-            oCurrent = oRel.ref;
-            sPart = oCurrent.nodeValue;
-            oCurrent.nodeValue = "";
-          }
-
-          oSheet.ref.appendChild(oRel.ref);
-          if (bExit) { return false; }
-        }
-
-        aMap.length--;
-        return true;
-      }
-
-      function mecanografear () {
-        if (sPart.length === 0 &amp;&amp; desplazarse(aSheets[nIdx], 0, true) &amp;&amp; nIdx++ === aSheets.length - 1) { limpiar(); return; }
-
-        oCurrent.nodeValue += sPart.charAt(0);
-        sPart = sPart.slice(1);
-      }
-
-      function Hoja (oNode) {
-        this.ref = oNode;
-        if (!oNode.hasChildNodes()) { return; }
-        this.parts = Array.prototype.slice.call(oNode.childNodes);
-
-        for (var nChild = 0; nChild &lt; this.parts.length; nChild++) {
-          oNode.removeChild(this.parts[nChild]);
-          this.parts[nChild] = new Hoja(this.parts[nChild]);
-        }
-      }
-
-      var
-        nIntervId, oCurrent = null, bTyping = false, bStart = true,
-        nIdx = 0, sPart = "", aSheets = [], aMap = [];
-
-      this.rate = nRate || 100;
-
-      this.ejecuta = function () {
-        if (bTyping) { return; }
-        if (bStart) {
-          var aItems = document.querySelectorAll(sSelector);
-
-          if (aItems.length === 0) { return; }
-          for (var nItem = 0; nItem &lt; aItems.length; nItem++) {
-            aSheets.push(new Hoja(aItems[nItem]));
-            /* Uncomment the following line if you have previously hidden your elements via CSS: */
-            // aItems[nItem].style.visibility = "visible";
-          }
-
-          bStart = false;
-        }
-
-        nIntervId = setInterval(mecanografear, this.rate);
-        bTyping = true;
-      };
-
-      this.pausa = function () {
-        clearInterval(nIntervId);
-        bTyping = false;
-      };
-
-      this.finaliza = function () {
-        oCurrent.nodeValue += sPart;
-        sPart = "";
-        for (nIdx; nIdx &lt; aSheets.length; desplazarse(aSheets[nIdx++], 0, false));
-        limpiar();
-      };
-  }
-
-    /* usage: */
-    var oTWExample1 = new maquinaEscribir(/* elements: */ "#article, h1, #info, #copyleft", /* frame rate (optional): */ 15);
-
-    /* default frame rate is 100: */
-    var oTWExample2 = new maquinaEscribir("#controls");
-
-    /* you can also change the frame rate value modifying the "rate" property; for example: */
-    // oTWExample2.rate = 150;
-
-    onload = function () {
-      oTWExample1.ejecuta();
-      oTWExample2.ejecuta();
-    };
-&lt;/script&gt;
-&lt;style type="text/css"&gt;
-span.intLink, a, a:visited {
-  cursor: pointer;
-  color: #000000;
-  text-decoration: underline;
-}
-
-#info {
-  width: 180px;
-  height: 150px;
-  float: right;
-  background-color: #eeeeff;
-  padding: 4px;
-  overflow: auto;
-  font-size: 12px;
-  margin: 4px;
-  border-radius: 5px;
-  /* visibility: hidden; */
-}
-&lt;/style&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-
-&lt;p id="copyleft" style="font-style: italic; font-size: 12px; text-align: center;"&gt;CopyLeft 2012 by &lt;a href="https://developer.mozilla.org/" target="_blank"&gt;Mozilla Developer Network&lt;/a&gt;&lt;/p&gt;
-&lt;p id="controls" style="text-align: center;"&gt;[&amp;nbsp;&lt;span class="intLink" onclick="oTWExample1.ejecuta();"&gt;Ejecutar&lt;/span&gt; | &lt;span class="intLink" onclick="oTWExample1.pausa();"&gt;Pausar&lt;/span&gt; | &lt;span class="intLink" onclick="oTWExample1.finaliza();"&gt;Terminar&lt;/span&gt;&amp;nbsp;]&lt;/p&gt;
-&lt;div id="info"&gt;
-Vivamus blandit massa ut metus mattis in fringilla lectus imperdiet. Proin ac ante a felis ornare vehicula. Fusce pellentesque lacus vitae eros convallis ut mollis magna pellentesque. Pellentesque placerat enim at lacus ultricies vitae facilisis nisi fringilla. In tincidunt tincidunt tincidunt.
-&lt;/div&gt;
-&lt;h1&gt;Maquina de Escribir en JavaScript &lt;/h1&gt;
-
-&lt;div id="article"&gt;
-&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam ultrices dolor ac dolor imperdiet ullamcorper. Suspendisse quam libero, luctus auctor mollis sed, malesuada condimentum magna. Quisque in ante tellus, in placerat est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec a mi magna, quis mattis dolor. Etiam sit amet ligula quis urna auctor imperdiet nec faucibus ante. Mauris vel consectetur dolor. Nunc eget elit eget velit pulvinar fringilla consectetur aliquam purus. Curabitur convallis, justo posuere porta egestas, velit erat ornare tortor, non viverra justo diam eget arcu. Phasellus adipiscing fermentum nibh ac commodo. Nam turpis nunc, suscipit a hendrerit vitae, volutpat non ipsum.&lt;/p&gt;
-&lt;form&gt;
-&lt;p&gt;Phasellus ac nisl lorem: &lt;input type="text" /&gt;&lt;br /&gt;
-&lt;textarea style="width: 400px; height: 200px;"&gt;Nullam commodo suscipit lacus non aliquet. Phasellus ac nisl lorem, sed facilisis ligula. Nam cursus lobortis placerat. Sed dui nisi, elementum eu sodales ac, placerat sit amet mauris. Pellentesque dapibus tellus ut ipsum aliquam eu auctor dui vehicula. Quisque ultrices laoreet erat, at ultrices tortor sodales non. Sed venenatis luctus magna, ultricies ultricies nunc fringilla eget. Praesent scelerisque urna vitae nibh tristique varius consequat neque luctus. Integer ornare, erat a porta tempus, velit justo fermentum elit, a fermentum metus nisi eu ipsum. Vivamus eget augue vel dui viverra adipiscing congue ut massa. Praesent vitae eros erat, pulvinar laoreet magna. Maecenas vestibulum mollis nunc in posuere. Pellentesque sit amet metus a turpis lobortis tempor eu vel tortor. Cras sodales eleifend interdum.&lt;/textarea&gt;&lt;/p&gt;
-&lt;p&gt;&lt;input type="submit" value="Send" /&gt;
-&lt;/form&gt;
-&lt;p&gt;Duis lobortis sapien quis nisl luctus porttitor. In tempor semper libero, eu tincidunt dolor eleifend sit amet. Ut nec velit in dolor tincidunt rhoncus non non diam. Morbi auctor ornare orci, non euismod felis gravida nec. Curabitur elementum nisi a eros rutrum nec blandit diam placerat. Aenean tincidunt risus ut nisi consectetur cursus. Ut vitae quam elit. Donec dignissim est in quam tempor consequat. Aliquam aliquam diam non felis convallis suscipit. Nulla facilisi. Donec lacus risus, dignissim et fringilla et, egestas vel eros. Duis malesuada accumsan dui, at fringilla mauris bibStartum quis. Cras adipiscing ultricies fermentum. Praesent bibStartum condimentum feugiat.&lt;/p&gt;
-&lt;p&gt;Nam faucibus, ligula eu fringilla pulvinar, lectus tellus iaculis nunc, vitae scelerisque metus leo non metus. Proin mattis lobortis lobortis. Quisque accumsan faucibus erat, vel varius tortor ultricies ac. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nec libero nunc. Nullam tortor nunc, elementum a consectetur et, ultrices eu orci. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a nisl eu sem vehicula egestas.&lt;/p&gt;
-&lt;/div&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p><a href="/files/3997/typewriter.html">Observa este ejemplo en acción</a>. Ver más: <a href="/en-US/docs/DOM/window.clearInterval"><code>clearInterval()</code></a>.</p>
-
-<h2 id="Argumentos_de_Callback">Argumentos de Callback</h2>
-
-<p>Como se mencionó previamente Internet Explorer version 9 y anteriores no soportan el pasar argumentos a la función Callback en <code>setTimeout()</code> ni en <code>setInterval()</code>. El siguiente código específico de Internet Explorer muestra un método de superar esta limitante. Para usarlo basta añadir el código marcado al inicio de tu script.</p>
-
-<pre class="brush:js notranslate">/*\
-|*|
-|*|  IE-specific polyfill that enables the passage of arbitrary arguments to the
-|*|  callback functions of javascript timers (HTML5 standard syntax).
-|*|
-|*|  https://developer.mozilla.org/en-US/docs/Web/API/window.setInterval
-|*|  https://developer.mozilla.org/User:fusionchess
-|*|
-|*|  Syntax:
-|*|  var timeoutID = window.setTimeout(func, delay[, param1, param2, ...]);
-|*|  var timeoutID = window.setTimeout(code, delay);
-|*|  var intervalID = window.setInterval(func, delay[, param1, param2, ...]);
-|*|  var intervalID = window.setInterval(code, delay);
-|*|
-\*/
-
-if (document.all &amp;&amp; !window.setTimeout.isPolyfill) {
-  var __nativeST__ = window.setTimeout;
-  window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
-    var aArgs = Array.prototype.slice.call(arguments, 2);
-    return __nativeST__(vCallback instanceof Function ? function () {
-      vCallback.apply(null, aArgs);
-    } : vCallback, nDelay);
-  };
-  window.setTimeout.isPolyfill = true;
-}
-
-if (document.all &amp;&amp; !window.setInterval.isPolyfill) {
-  var __nativeSI__ = window.setInterval;
-  window.setInterval = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
-    var aArgs = Array.prototype.slice.call(arguments, 2);
-    return __nativeSI__(vCallback instanceof Function ? function () {
-      vCallback.apply(null, aArgs);
-    } : vCallback, nDelay);
-  };
-  window.setInterval.isPolyfill = true;
-}
-</pre>
-
-<p>Otra posible solución es el usar funciones anónimas para llamar al Callback, aunque esta solución es un poco más cara. Ejemplo:</p>
-
-<pre class="brush:js notranslate">var intervalID = setInterval(function() { myFunc("one", "two", "three"); }, 1000);</pre>
-
-<p>También puedes hacer uso de <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">function's bind</a>. Ejemplo:</p>
-
-<pre class="brush:js notranslate">var intervalID = setInterval(function(arg1) {}.bind(undefined, 10), 1000);</pre>
-
-<p>{{h3_gecko_minversion("Inactive tabs", "5.0")}}</p>
-
-<p>A partir de Gecko 5.0 {{geckoRelease("5.0")}}, los intervalos no se disparan más de una vez por segundo en las pestañas inactivas.</p>
-
-<h2 id="Problemas_usando_this">Problemas usando "<a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>"</h2>
-
-<p>Cuando pasas el método de un objeto a la función <code>setInterval()</code> éste es invocado fuera de su contexto. Esto puede crear un valor de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> que puede no ser el esperado. Este problema es abordado en detalle en <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this#As_an_object_method">JavaScript reference</a>.</p>
-
-<h3 id="Explicación">Explicación</h3>
-
-<p>Cuando <code>setInterval() o setTimeOut()</code> ejecuta un determinado código o función, ésta corre en un contexto de ejecución separado al de la función en la que se creó dicho temporizador. Por esta razón a la palabra clave <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> se le asigna el valor del objeto <code>window</code> (o el objeto <code>global</code>), no es igual que usar <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> dentro de una fuinción que invoque a <code>setTimeOut()</code>. Observa el siguiente ejemplo (que utiliza <code>setTimeOut()</code> en lugar de <code>setInterval()</code> – el problema, de hecho, es el mismo para ambos temporizadores):</p>
-
-<pre class="brush:js notranslate">miArreglo = ["cero", "uno", "dos"];
-
-miArreglo.miMetodo = function (sPropiedad) {
-    alert(arguments.length &gt; 0 ? this[sPropiedad] : this);
-};
-
-miArreglo.miMetodo(); // imprime "cero,uno,dos"
-miArreglo.miMetodo(1); // imprime "uno"
-setTimeout(miArreglo.miMetodo, 1000); // imprime "[object Window]" despues de 1 segundo
-setTimeout(miArreglo.miMetodo, 1500, "1"); // imprime "undefined" despues de 1,5 segundos
-// tratemos de pasar el objeto 'this'
-setTimeout.call(miArreglo, miArreglo.miMetodo, 2000); // error: "NS_ERROR_XPC_BAD_OP_ON_WN_PROTO: Illegal operation on WrappedNative prototype object"
-setTimeout.call(miArreglo, miArreglo.miMetodo, 2500, 2); // same error</pre>
-
-<p>Como puedes ver no hay forma de pasar el objeto <code>this</code> a la función de Callback en la versión anterior de JavaScript.</p>
-
-<h3 id="Una_posible_solución">Una posible solución</h3>
-
-<p>Una posible alternativa para resolver ésto es reemplazar las dos funciones globales nativas <code>setTimeout()</code> y <code>setInterval()</code> con las siguientes funciones no nativas que permiten su ejecución a través del método <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Function/call"><code>Function.prototype.call</code></a>. El siguiente ejemplo muestra una posible sustitución:</p>
-
-<pre class="brush:js notranslate">// Permite el pase del objeto 'this' a través de temporizadores JavaScript
-
-var __nativeST__ = window.setTimeout, __nativeSI__ = window.setInterval;
-
-window.setTimeout = function (vCallback, nDelay /*, argumentoAPasar1, argumentuAPasar2, etc. */) {
-  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
-  return __nativeST__(vCallback instanceof Function ? function () {
-    vCallback.apply(oThis, aArgs);
-  } : vCallback, nDelay);
-};
-
-window.setInterval = function (vCallback, nDelay /*, argumentoAPasar1, argumentoAPasar2, etc. */) {
-  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
-  return __nativeSI__(vCallback instanceof Function ? function () {
-    vCallback.apply(oThis, aArgs);
-  } : vCallback, nDelay);
-};
-</pre>
-
-<div class="note">Estos dos reemplazos también permiten el camino estándar en HTML5 de pasar argumentos arbitrarios a las funciones de Callback de los temporizadores dentro de IE. Por lo tanto, pueden utilizarse como rellenos (polyfills) <em>no estándar</em>. Para más información vea <a href="#Callback_arguments">callback arguments paragraph</a>.</div>
-
-<p>Prueba de nueva funcionalidad:</p>
-
-<pre class="brush:js notranslate">miArreglo = ["cero", "uno", "dos"];
-
-miArreglo.miMetodo = function (sProperty) {
-    alert(arguments.length &gt; 0 ? this[sProperty] : this);
-};
-
-setTimeout(alert, 1500, "Hola Mundo!"); // la utilizacion estandar de setTimeout y de setInterval se mantiene, pero...
-setTimeout.call(miArreglo, miArreglo.miMetodo, 2000); // imprime "cero,uno,dos" despues de 2 segundos
-setTimeout.call(miArreglo, miArreglo.miMetodo, 2500, 2); // imprime "dos" despues de 2,5 segundos
-</pre>
-
-<p>Otra solución más compleja está en la siguiente liga de <a href="#A_little_framework">framework</a>.</p>
-
-<div class="note">JavaScript 1.8.5 introduce el método <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind">Function.prototype.bind()</a></code>, el cual permite especificar el valor de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> para todas sus llamadas en una determinada función. Esto permite sobrellevar facilmente diferentes problemas de contexto con el uso de la palabra <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>. También, ES2015 soporta <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">arrow functions</a>, dentro del lenguaje nos permite escribir cosas como setInterval( () =&gt; this.myMethod) si estamos dentro del método de miArreglo .</div>
-
-<h2 id="MiniDaemon_-_Un_framework_para_administrar_temporizadores">MiniDaemon - Un framework para administrar temporizadores</h2>
-
-<p>En proyectos que requieren muchos temporizadores puede volverse complicado el seguimiento de todos los eventos generados. Una forma de facilitar la administración de timers es guardando sus estados en un objeto. El siguiente ejemplo muestra este tipo de abstracción, la arquitectura del constructor evita explicitamente el uso de cerraduras. También ofrece un camino alternativo para pasar el objeto <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> a la función de Callback (observa la sección Problemas usando "<a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>" para más detalles). Puedes consultar también el siguiente código en<a href="https://github.com/madmurphy/minidaemon.js"> GitHub</a>.</p>
-
-<div class="note">Para una versión más modular de este (<code><em>Daemon)</em></code>puedes verlo en <a href="/en-US/Add-ons/Code_snippets/Timers/Daemons">JavaScript Daemons Management</a>. Aquí encontrarás una versión mas complicada que se reduce a una colección escalable de métodos para el constructor <code><em>Daemon</em></code>. Éste constructor no es más que un clon del  <code><em>MiniDaemon</em></code> con soporte para las funciones <em>init</em> y <em>onstart</em> declarables durante la instanciación del mismo. Por esto el <strong><code><em>MiniDaemon</em></code> framework </strong>se mantiene como el camino recomendado para realizar animaciones simples.</div>
-
-<h3 id="minidaemon.js">minidaemon.js</h3>
-
-<pre class="brush:js notranslate">/*\
-|*|
-|*|  :: MiniDaemon ::
-|*|
-|*|  Revision #2 - September 26, 2014
-|*|
-|*|  https://developer.mozilla.org/en-US/docs/Web/API/window.setInterval
-|*|  https://developer.mozilla.org/User:fusionchess
-|*|  https://github.com/madmurphy/minidaemon.js
-|*|
-|*|  This framework is released under the GNU Lesser General Public License, version 3 or later.
-|*|  http://www.gnu.org/licenses/lgpl-3.0.html
-|*|
-\*/
-
-function MiniDaemon (oOwner, fTask, nRate, nLen) {
-  if (!(this &amp;&amp; this instanceof MiniDaemon)) { return; }
-  if (arguments.length &lt; 2) { throw new TypeError("MiniDaemon - not enough arguments"); }
-  if (oOwner) { this.owner = oOwner; }
-  this.task = fTask;
-  if (isFinite(nRate) &amp;&amp; nRate &gt; 0) { this.rate = Math.floor(nRate); }
-  if (nLen &gt; 0) { this.length = Math.floor(nLen); }
-}
-
-MiniDaemon.prototype.owner = null;
-MiniDaemon.prototype.task = null;
-MiniDaemon.prototype.rate = 100;
-MiniDaemon.prototype.length = Infinity;
-
-  /* These properties should be read-only */
-
-MiniDaemon.prototype.SESSION = -1;
-MiniDaemon.prototype.INDEX = 0;
-MiniDaemon.prototype.PAUSED = true;
-MiniDaemon.prototype.BACKW = true;
-
-  /* Global methods */
-
-MiniDaemon.forceCall = function (oDmn) {
-  oDmn.INDEX += oDmn.BACKW ? -1 : 1;
-  if (oDmn.task.call(oDmn.owner, oDmn.INDEX, oDmn.length, oDmn.BACKW) === false || oDmn.isAtEnd()) { oDmn.pause(); return false; }
-  return true;
-};
-
-  /* Instances methods */
-
-MiniDaemon.prototype.isAtEnd = function () {
-  return this.BACKW ? isFinite(this.length) &amp;&amp; this.INDEX &lt; 1 : this.INDEX + 1 &gt; this.length;
-};
-
-MiniDaemon.prototype.synchronize = function () {
-  if (this.PAUSED) { return; }
-  clearInterval(this.SESSION);
-  this.SESSION = setInterval(MiniDaemon.forceCall, this.rate, this);
-};
-
-MiniDaemon.prototype.pause = function () {
-  clearInterval(this.SESSION);
-  this.PAUSED = true;
-};
-
-MiniDaemon.prototype.start = function (bReverse) {
-  var bBackw = Boolean(bReverse);
-  if (this.BACKW === bBackw &amp;&amp; (this.isAtEnd() || !this.PAUSED)) { return; }
-  this.BACKW = bBackw;
-  this.PAUSED = false;
-  this.synchronize();
-};
-</pre>
-
-<div class="note">MiniDaemon pasa argumentos a la función callback. Si quieres trabajar con ellos en navegadores que no soportan nativamente esta característica, usa uno de los métodos propuestos arriba.</div>
-
-<h3 id="Sintaxis_2">Sintaxis</h3>
-
-<p><code>var myDaemon = new MiniDaemon(<em>thisObject</em>, <em>callback</em>[</code><code>, <em>rate</em></code><code>[, <em>length</em>]]);</code></p>
-
-<h3 id="Descripción">Descripción</h3>
-
-<p>Regresa un <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">Objecto</a></code> que contiene la información necesaria para una animación (como el objeto <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a>, la función de Callback, la duración y el frame-rate).</p>
-
-<h4 id="Parámetros_2">Parámetros</h4>
-
-<dl>
- <dt><code>thisObject</code></dt>
- <dd>El valor de la palabra <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> sobre el cual funcionará la función de <em>Callback. </em>Puede ser un <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>objecto</code></a> o <code>null</code>.</dd>
- <dt><code>callback</code></dt>
- <dd>La función que se invocará repetidas veces. Dicha función se invocará con tres parámetros: <em>index</em> que corresponde al valor iterativo de cada invocación, <em>length</em> que es el número total de invocaciones asignadas al <em>daemon</em> (puede ser un valor finito o <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>) y <em>backwards</em> (valor booleano que expresa cuando el valor de <em>index</em> es creciente o decreciente). Es similar a <em>callback</em>.call(<em>thisObject</em>, <em>index</em>, <em>length</em>, <em>backwards</em>). Si la función de Callback regresa un valor false el deamon se detiene.</dd>
- <dt><code>rate (optional)</code></dt>
- <dd>El tiempo minimo en milisegundos que transcurre entre cada invocación. El valor por omisión es 100.</dd>
- <dt><code>length (optional)</code></dt>
- <dd>El número total de invocaciones. Puede ser un valor entero positivo o <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>. El valor por omisión es <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity">Infinity</a>.</code></dd>
-</dl>
-
-<h4 id="Propiedades_de_la_intancia_MiniDaemon"><code>Propiedades de la intancia MiniDaemon</code> </h4>
-
-<dl>
- <dt><code>myDaemon.owner</code></dt>
- <dd>El objeto <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this"><code>this</code></a> sobre el cual se ejecuta el daemon (lectura/escritura). Puede ser un <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object"><code>objecto</code></a> o <code>null</code>.</dd>
- <dt><code>myDaemon.task</code></dt>
- <dd>La función que se invocará repetidas veces. Dicha función se invocará con tres parámetros: <em>index</em> que corresponde al valor iterativo de cada invocación, <em>length</em> que es el número total de invocaciones asignadas al <em>daemon</em> (puede ser un valor finito o <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>) y <em>backwards</em> (valor booleano que expresa cuando el valor de <em>index</em> es creciente o decreciente). Es similar a <em>callback</em>.call(<em>thisObject</em>, <em>index</em>, <em>length</em>, <em>backwards</em>). Si la función de Callback regresa un valor false el deamon se detiene.</dd>
- <dt><code>myDaemon.rate</code></dt>
- <dd>El tiempo minimo en milisegundos que transcurre entre cada invocación. El valor por omición es 100 (lectura/escritura).</dd>
- <dt><code>myDaemon.length</code></dt>
- <dd>El número total de invocaciones. Puede ser un valor entero positivo o <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity"><code>Infinity</code></a>. El valor por omición es <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Infinity">Infinity</a> </code>(lectura/escritura).</dd>
-</dl>
-
-<h4 id="MiniDaemon_instances_methods"><code>MiniDaemon</code> instances methods</h4>
-
-<dl>
- <dt><code>myDaemon.isAtEnd()</code></dt>
- <dd>Regresa un valor boleano que expresa cuando el <em>daemon</em> está en posición de inicio/fin o no.</dd>
- <dt><code>myDaemon.synchronize()</code></dt>
- <dd>Sincroniza el tiempo de un deamon iniciado con el tiempo de su invocación.</dd>
- <dt><code>myDaemon.pause()</code></dt>
- <dd>Pausa el deamon.</dd>
- <dt><code>myDaemon.start([<em>reverse</em>])</code></dt>
- <dd>Inicia el daemon hacia adelante "forward" (el indice de cada invocación se incrementa) o hacia atrás "backwards" (el índice de cada invocación se decrementa).</dd>
-</dl>
-
-<h4 id="Métodos_del_objeto_global_del_MiniDaemon">Métodos del objeto global del <code>MiniDaemon</code></h4>
-
-<dl>
- <dt><code>MiniDaemon.forceCall(<em>minidaemon</em>)</code></dt>
- <dd>Fuerza una sola función callback a la función <code><em>minidaemon</em>.task</code>  en lugar del hecho de que se ha alcanzado el final o no. En cualquier caso la propiedad INDEX interna crece o decrece según la dirección del proceso.</dd>
-</dl>
-
-<h3 id="Ejemplo_de_uso">Ejemplo de uso</h3>
-
-<p>Tu página HTML:</p>
-
-<pre class="brush:html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-  &lt;meta charset="UTF-8" /&gt;
-  &lt;title&gt;MiniDaemin Example - MDN&lt;/title&gt;
-  &lt;script type="text/javascript" src="minidaemon.js"&gt;&lt;/script&gt;
-  &lt;style type="text/css"&gt;
-    #sample_div {
-      visibility: hidden;
-    }
-  &lt;/style&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-  &lt;p&gt;
-    &lt;input type="button" onclick="fadeInOut.start(false /* optional */);" value="fade in" /&gt;
-    &lt;input type="button" onclick="fadeInOut.start(true);" value="fade out"&gt;
-    &lt;input type="button" onclick="fadeInOut.pause();" value="pause" /&gt;
-  &lt;/p&gt;
-
-  &lt;div id="sample_div"&gt;Some text here&lt;/div&gt;
-
-  &lt;script type="text/javascript"&gt;
-    function opacity (nIndex, nLength, bBackwards) {
-      this.style.opacity = nIndex / nLength;
-      if (bBackwards ? nIndex === 0 : nIndex === 1) {
-        this.style.visibility = bBackwards ? "hidden" : "visible";
-      }
-    }
-
-    var fadeInOut = new MiniDaemon(document.getElementById("sample_div"), opacity, 300, 8);
-  &lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p><a href="/files/3995/minidaemon_example.html" title="MiniDaemon Example">Prueba este ejemplo</a></p>
-
-<h2 id="Notas">Notas</h2>
-
-<p>La función<code> setInterval()</code> es usada frecuentemente para asignar una pausa para ejecutar funciones recurrentes, como por ejemplo pintar el siguiente cuadro de una animación.</p>
-
-<p>Puedes cancelar el ciclo iniciado por un <code>setInterval() </code>usando el comando <a href="/en-US/docs/Web/API/WindowTimers/clearInterval"><code>window.clearInterval()</code></a>.</p>
-
-<p>Si solo deseas ejecutar el ciclo una sola vez despues de una pausa usa en su lugar la función <a href="/en-US/docs/Web/API/WindowTimers/setTimeout"><code>window.setTimeout()</code></a>.</p>
-
-<h3 id="Asegúrate_que_el_tiempo_de_ejecución_sea_menor_que_la_frecuencia">Asegúrate que el tiempo de ejecución sea menor que la frecuencia</h3>
-
-<p>Si existe la posibilidad de que tu función o el código a ejecutarse una y otra vez exeda el tiempo marcado en cada intervalo es recomendado que uses recursivamente el nombre de tu función usando <code><a href="/en-US/docs/Web/API/WindowTimers/setTimeout">window.setTimeout</a></code>. Por ejemplo, si usas <code>setInterval </code>para hacer llamadas a un servidor remoto cada 5 segundos, la latencia en la red, un servidor que no responde, o cualquier otro tipo de contratiempo puede generar una pausa mayor a la que indicaste. De esta forma terminarás con solicitudes XHR apiladas que no se resolverán necesariamente en orden.</p>
-
-<p>En estos casos llamadas con un patrón de <code>setTimeout()</code> recursivo es preferible:</p>
-
-<pre class="brush:js notranslate">(function loop(){
-   setTimeout(function() {
-      // Your logic here
-
-      loop();
-  }, delay);
-})();
-</pre>
-
-<p>En este fragmento de código, la función <code>loop()</code> es declarada y es ejecutada inmediatamente. La función <code>loop()</code> es invocada de forma recursiva dentro de <code>setTimeout()</code> despues de cada ejecución. Si bien este patrón no garantiza una ejecución a intervalos fijos, si garantiza que nunca se ejecutará un paso sin que se haya finalizado el anterior. </p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Especificaciones</th>
-   <th>Estatus</th>
-   <th>Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML WHATWG", "webappapis.html#dom-setinterval", "WindowTimers.setInterval()")}}</td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-   <td>Definición inicial (DOM Level 0)</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad">Compatibilidad</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)<sup>[2]</sup></th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1")}}</td>
-   <td>4.0</td>
-   <td>4.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>Soporta parámetros para callback<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>10.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoMobile("1")}}</td>
-   <td>6.0</td>
-   <td>6.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>Soporta parámetros para callback<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Whether it supports the optional parameters when in its first form or not.</p>
-
-<p>[2] Anterior a Firefox 13, Firefox pasaba un parametro adicional al callback, indicando el "actual lateness" del timeout en milisegundos. Este parámetro no estandar dejó de usarse en versiones posteriores a Firefox 13. No es recomendable que extensiones basadas en XPCOM para Firefox usen setInterval(), ya que las actualizaciones pueden causar el que el objeto {{domxref("Window")}} se actualice perdiendo los temporizadores. Deberás usar en su lugar {{interface("nsITimer")}}.</p>
-
-<h2 id="Ver_más">Ver más</h2>
-
-<ul>
- <li><a href="/en-US/Add-ons/Code_snippets/Timers">JavaScript timers</a></li>
- <li>{{domxref("WindowTimers.setTimeout")}}</li>
- <li>{{domxref("WindowTimers.clearTimeout")}}</li>
- <li>{{domxref("WindowTimers.clearInterval")}}</li>
- <li>{{domxref("window.requestAnimationFrame")}}</li>
- <li><a href="/en-US/Add-ons/Code_snippets/Timers/Daemons"><em>Daemons</em> management</a></li>
-</ul>
diff --git a/files/es/web/api/windowtimers/settimeout/index.html b/files/es/web/api/windowtimers/settimeout/index.html
deleted file mode 100644
index 1180d9f8af..0000000000
--- a/files/es/web/api/windowtimers/settimeout/index.html
+++ /dev/null
@@ -1,340 +0,0 @@
----
-title: WindowOrWorkerGlobalScope.setTimeout
-slug: Web/API/WindowTimers/setTimeout
-tags:
-  - API
-  - HTML DOM
-  - WindowOrWorkerGlobalScope
-  - setTimeout
-translation_of: Web/API/WindowOrWorkerGlobalScope/setTimeout
----
-<div>{{APIRef("HTML DOM")}}</div>
-
-<p>El método <strong><code>setTimeout()</code></strong> del mixin {{domxref("WindowOrWorkerGlobalScope")}} establece un temporizador que ejecuta una función o una porción de código después de que transcurre un tiempo establecido.</p>
-
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>var idTemporizador</em> = <em>scope</em>.setTimeout(<em>funcion</em>[, <em>retraso</em>, <em>parametro1</em>, <em>parametro2</em>, ...]);
-<em>var</em> <em>idTimeout</em> = <em>scope</em>.setTimeout(<em>funcion</em>[, <em>retraso</em>]);
-<em>var idTimeout</em> = <em>scope</em>.setTimeout(<em>codigo</em>[, <em>retraso</em>]);
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>funcion</code></dt>
- <dd>Una {{jsxref("function")}} para ejecutar después de que expire el temporizador.</dd>
- <dt><code>codigo</code></dt>
- <dd>Una sintaxis opcional que le permite incluir una cadena en lugar de una función, la cual es compilada y ejecutada cuando el temporizador expira. Esta sintaxis <strong>no se recomienda</strong> por las mismas razones que hacen del uso de {{jsxref("Global_Objects/eval", "eval()")}} un riesgo de seguridad.</dd>
- <dt><code>retraso</code> {{optional_inline}}</dt>
- <dd>Tiempo, en milisegundos  (milésimas de segundo), que el temporizador debe esperar antes de ejecutar la función o el código. Si se omite este parámetro se usa el valor 0. Tenga en cuenta que el retraso real puede ser más prolongado; ver más abajo {{anch("Reasons for delays longer than specified")}}.</dd>
- <dt><code>param1, ..., paramN</code> {{optional_inline}}</dt>
- <dd>Parámetros adicionales que se pasan a la función especificada por  <em>func</em> una vez el temporizador expira.</dd>
-</dl>
-
-<div class="note"><strong>Nota:</strong> Pasar parámetros adicionales a la función en la primera sintaxis no funciona en Internet Explorer 9 o inferior. Si quiere habilitar esta funcionalidad en ese navegador,  debe usar un código de compatibilidad (vea la sección <a href="#Callback_arguments">Callback arguments</a>).</div>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>El valor retornado <code>IDtemporizador</code> es númerico y no es cero; identifica el temporizador creado con la llamada a <code>setTimeout()</code>; este valor puede pasarse a {{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}} para cancelar el temporizador.</p>
-
-<p>Puede ser útil advertir que  <code>setTimeout()</code> y {{domxref("WindowOrWorkerGlobalScope.setInterval", "setInterval()")}} comparten la misma piscina de IDs, y que tanto <code>clearTimeout()</code> como {{domxref("WindowOrWorkerGlobalScope.clearInterval", "clearInterval()")}} pueden intercambiarse.  Por claridad, sin embargo,  debe hacerlos coincidir para evitar confusiones cuando mantenga su código.</p>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<p>El siguiente ejemplo establece dos botenes simples en una página web y los engancha a las rutinas <code>setTimeout()</code> y <code>clearTimeout()</code>. Presionando el primer botón establecerá un temporizador que llama un diálogo de alerta después de dos segundos y guarda el id del temporizador para usarlo con <code>clearTimeout()</code>. Opcionalmente puede cancelar este temporizador presionando el segundo botón.</p>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush: html">&lt;p&gt;Ejemplo funcional&lt;/p&gt;
-&lt;button onclick="delayedAlert();"&gt;Muestra una caja de alerta después de dos segundos&lt;/button&gt;
-&lt;p&gt;&lt;/p&gt;
-&lt;button onclick="clearAlert();"&gt;Cancela la alerta antes de que ocurra&lt;/button&gt;
-</pre>
-
-<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
-
-<pre class="brush: js">var timeoutID;
-
-function delayedAlert() {
-  timeoutID = window.setTimeout(slowAlert, 2000);
-}
-
-function slowAlert() {
-  alert("That was really slow!");
-}
-
-function clearAlert() {
-  window.clearTimeout(timeoutID);
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Example') }}</p>
-
-<p>Vea también <a href="/en-US/docs/DOM/window.clearTimeout#Example" title="en-US/docs/DOM/window.clearTimeout#Example"><code>clearTimeout()</code> example</a>.</p>
-
-<h2 id="Callback_arguments">Callback arguments</h2>
-
-<p>Si necesita pasar un argumento a su función callback, pero necesita que funcione en Internet Explorer, que no soporta el envío de parámetros adicionales (ni con <code>setTimeout()</code> o <code>setInterval()</code>) usted puede incluir este código de compatibilidad <em>IE-specific</em> que habilitará la funcionalidad estándar de HTML5 para pasar los parámetros adicionales en ese navegador para ambos temporizadores solamente insertandolo al inicio de sus scripts.</p>
-
-<pre class="brush: js">/*\
-|*|
-|*|  IE-specific polyfill which enables the passage of arbitrary arguments to the
-|*|  callback functions of JavaScript timers (HTML5 standard syntax).
-|*|
-|*|  https://developer.mozilla.org/en-US/docs/DOM/window.setInterval
-|*|
-|*|  Syntax:
-|*|  var timeoutID = window.setTimeout(func, delay, [param1, param2, ...]);
-|*|  var timeoutID = window.setTimeout(code, delay);
-|*|  var intervalID = window.setInterval(func, delay[, param1, param2, ...]);
-|*|  var intervalID = window.setInterval(code, delay);
-|*|
-\*/
-
-if (document.all &amp;&amp; !window.setTimeout.isPolyfill) {
-  var __nativeST__ = window.setTimeout;
-  window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
-    var aArgs = Array.prototype.slice.call(arguments, 2);
-    return __nativeST__(vCallback instanceof Function ? function () {
-      vCallback.apply(null, aArgs);
-    } : vCallback, nDelay);
-  };
-  window.setTimeout.isPolyfill = true;
-}
-
-if (document.all &amp;&amp; !window.setInterval.isPolyfill) {
-  var __nativeSI__ = window.setInterval;
-  window.setInterval = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
-    var aArgs = Array.prototype.slice.call(arguments, 2);
-    return __nativeSI__(vCallback instanceof Function ? function () {
-      vCallback.apply(null, aArgs);
-    } : vCallback, nDelay);
-  };
-  window.setInterval.isPolyfill = true;
-}
-</pre>
-
-<h2 id="Arreglo_solo_para_IE">Arreglo solo para IE</h2>
-
-<p>Si quiere una solución completamente no intrusiva con otros navegadores móviles o de escritorio, incluyendo IE 9 y superior, puede usar los comentarios condicionales de JavaScript:</p>
-
-<pre class="brush: js">/*@cc_on
-  // conditional IE &lt; 9 only fix
-  @if (@_jscript_version &lt;= 6)
-  (function(f){
-     window.setTimeout =f(window.setTimeout);
-     window.setInterval =f(window.setInterval);
-  })(function(f){return function(c,t){var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)}});
-  @end
-@*/
-</pre>
-
-<p>O usar un enfoque más limpio basado en el condicional para IE de HTML:</p>
-
-<pre class="brush: html">&lt;!--[if lt IE 9]&gt;&lt;script&gt;
-(function(f){
-window.setTimeout =f(window.setTimeout);
-window.setInterval =f(window.setInterval);
-})(function(f){return function(c,t){
-var a=[].slice.call(arguments,2);return f(function(){c.apply(this,a)},t)}
-});
-&lt;/script&gt;&lt;![endif]--&gt;
-</pre>
-
-<p>Otra posibilidad es usar una función anónima para llamar el callback, pero esta solución es un poco más costosa. Ejemplo:</p>
-
-<pre class="brush: js">var intervalID = setTimeout(function() { myFunc("uno", "dos", "tres"); }, 1000);
-</pre>
-
-<p>Sin embargo, otra posibilidad es usar <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind" title="/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind">function's bind</a>. Ejemplo:</p>
-
-<pre class="brush: js">setTimeout(function(arg1){}.bind(undefined, 10));
-</pre>
-
-<h2 id="El_problema_this">El problema "<code>this</code>"</h2>
-
-<p>Cuando pasa un método a <code>setTimeout()</code> (o cualquier otra función , por el estilo), podría ser invocada con el valor de <code>this</code> equivocado. Este problema es explicado en detalle en la <a href="/en-US/docs/JavaScript/Reference/Operators/this#Method_binding" title="en-US/docs/Core_JavaScript_1.5_Reference/Operators/Special_Operators/this_Operator#Method_binding">referencia de JavaScript</a>.</p>
-
-<h3 id="Explicación">Explicación</h3>
-
-<p>El código ejecutado por <code>setTimeout()</code> corre en un contexto de ejecución diferente al de la función por la que fue llamado. Como consecuencia, la palabra clave <code>this para la función llamada </code>será asignado al objeto <code>window</code> (o <code>global</code>); no tendrá el mismo valor del <code>this</code> de la función que llamó al <code>setTimeout</code>. Vea el siguiente ejemplo:</p>
-
-<pre class="brush: js">myArray = ["cero", "uno", "dos"];
-myArray.myMethod = function (sProperty) {
-    alert(arguments.length &gt; 0 ? this[sProperty] : this);
-};
-
-myArray.myMethod(); // imprime "cero,uno,dos"
-myArray.myMethod(1); // imprime "uno"
-setTimeout(myArray.myMethod, 1000); // imprime "[object Window]" después de 1 segundo
-setTimeout(myArray.myMethod, 1500, "1"); // imprime "undefined" después de 1.5 segundos
-// intentemos pasar el objeto 'this'
-setTimeout.call(myArray, myArray.myMethod, 2000); // error: "NS_ERROR_XPC_BAD_OP_ON_WN_PROTO: Illegal operation on WrappedNative prototype object"
-setTimeout.call(myArray, myArray.myMethod, 2500, 2); // mismo error</pre>
-
-<p>Como puedes ver no hay forma de pasar el objeto <code>this</code> a la función callback.</p>
-
-<h3 id="Una_posible_solución">Una posible solución</h3>
-
-<p>Una posible forma de resolver el problema del "<code>this</code>" es reemplazar las dos funciones globales nativas <code>setTimeout()</code> or <code>setInterval()por dos no-nativas<em> </em> </code>que permitan su invocación a través del método <a href="en-US/docs/JavaScript/Reference/Global_Objects/Function/call" title="en-US/docs/JavaScript/Reference/Global_Objects/Function/call"><code>Function.prototype.call</code></a>. El siguiente ejemplo muestra un posible reemplazo:</p>
-
-<pre class="brush: js">// Enable the passage of the 'this' object through the JavaScript timers
-
-var __nativeST__ = window.setTimeout, __nativeSI__ = window.setInterval;
-
-window.setTimeout = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
-  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
-  return __nativeST__(vCallback instanceof Function ? function () {
-    vCallback.apply(oThis, aArgs);
-  } : vCallback, nDelay);
-};
-
-window.setInterval = function (vCallback, nDelay /*, argumentToPass1, argumentToPass2, etc. */) {
-  var oThis = this, aArgs = Array.prototype.slice.call(arguments, 2);
-  return __nativeSI__(vCallback instanceof Function ? function () {
-    vCallback.apply(oThis, aArgs);
-  } : vCallback, nDelay);
-};</pre>
-
-<div class="note"><strong>Nota:</strong> Estos dos reemplazos habilitarán el estándar HTML5 para el paso de argumentos arbitrarios a las funciones callback de los temporizadores en IE. Pueden usarse como polyfills también. Vea el párrafo <a href="#Callback_arguments">Callback arguments</a>.</div>
-
-<p>Prueba de la nueva característica:</p>
-
-<pre class="brush: js">myArray = ["zero", "one", "two"];
-myArray.myMethod = function (sProperty) {
-    alert(arguments.length &gt; 0 ? this[sProperty] : this);
-};
-
-setTimeout(alert, 1500, "Hello world!"); // the standard use of setTimeout and setInterval is preserved, but...
-setTimeout.call(myArray, myArray.myMethod, 2000); // prints "zero,one,two" after 2 seconds
-setTimeout.call(myArray, myArray.myMethod, 2500, 2); // prints "two" after 2.5 seconds
-</pre>
-
-<p>No hay soluciones nativas <em>ad hoc</em> a este problema.</p>
-
-<div class="note"><strong>Nota:</strong> JavaScript 1.8.5 introduce el método <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Function/bind" title="en-US/docs/JavaScript/Reference/Global Objects/Function/bind">Function.prototype.bind(</a></code>, que permite especificar el valor que debería usarse como <code>this</code> para todas las llamadas a una función dada. Esto permite evitar fácilmente los problemas en los que no es claro que será, dependiendo del contexto desde el cual la función sea llamada.</div>
-
-<h2 id="Notas">Notas</h2>
-
-<p>Puede cancelar el temporizador usando <code><a href="/en-US/docs/DOM/window.clearTimeout" title="en-US/docs/DOM/window.clearTimeout">window.clearTimeout()</a></code>. Si desea tener una función llamada repetidamente (p.e., cada N milisegundos), considere usar <code><a href="/en-US/docs/DOM/window.setInterval" title="en-US/docs/DOM/window.setInterval">window.setInterval()</a></code>.</p>
-
-<p>Es importante notar que la función o fragmento de código no puede ser ejecutado hasta que el hilo que llamó <code>setTimeout()</code>haya terminado.</p>
-
-<h3 id="Pasando_cadenas_literales">Pasando cadenas literales</h3>
-
-<p>Pasando una cadena en vez de una función a <code>setTimeout()</code>pasa lo mismo que al usar <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/eval#Don.27t_use_eval.21" title="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/eval">eval</a>. </code></p>
-
-<pre class="brush: js">// Correcto
-window.setTimeout(function() {
-    alert("Hello World!");
-}, 500);
-
-// Incorrecto
-window.setTimeout("alert(\"Hello World!\");", 500);
-
-</pre>
-
-<p>Las cadenas literales son evaluadas en el contexto global, así que los símbolos locales en el contexto donde <code>setTimeout()</code> fue llamado no estarán disponibles cuando la cadena es evaluada como código.</p>
-
-<h3 id="Minimum_maximum_delay_and_timeout_nesting">Minimum/ maximum delay and timeout nesting</h3>
-
-<p><a class="external" href="http://code.google.com/p/chromium/issues/detail?id=792#c10" title="http://code.google.com/p/chromium/issues/detail?id=792#c10">Historically</a> browsers implement <code>setTimeout()</code> "clamping": successive <code>setTimeout()</code> calls with <code>delay</code> smaller than the "minimum delay" limit are forced to use at least the minimum delay. The minimum delay, <code>DOM_MIN_TIMEOUT_VALUE</code>, is 4 ms (stored in a preference in Firefox: <code>dom.min_timeout_value</code>), with a <code>DOM_CLAMP_TIMEOUT_NESTING_LEVEL</code> of 5ms.</p>
-
-<p>In fact, 4ms is <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#timers">specified by the HTML5 spec</a> and is consistent across browsers released in 2010 and onward. Prior to {{ geckoRelease("5.0") }}, the minimum timeout value for nested timeouts was 10 ms.</p>
-
-<p>In addition to "clamping", the timeout can also fire later when the page (or the OS/browser itself) is busy with other tasks.</p>
-
-<p>To implement a 0 ms timeout in a modern browser, you can use {{ domxref("window.postMessage()") }} as <a class="external" href="http://dbaron.org/log/20100309-faster-timeouts" title="http://dbaron.org/log/20100309-faster-timeouts">described here</a>.</p>
-
-<p>Browsers including Internet Explorer, Chrome, Safari, and Firefox store the delay as a 32-bit signed Integer internally. This causes an Integer overflow when using delays larger than 2147483647, resulting in the timeout being executed immediately.</p>
-
-<h4 id="Inactive_tabs">Inactive tabs</h4>
-
-<p>In {{ geckoRelease("5.0") }} and Chrome 11, timeouts are clamped to firing no more often than once per second (1000ms) in inactive tabs; see {{ bug(633421) }} for more information about this in Mozilla or <a class="external" href="http://crbug.com/66078" title="http://crbug.com/66078">crbug.com/66078</a> for details about this in Chrome.</p>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{ CompatGeckoDesktop("1") }}</td>
-   <td>4.0</td>
-   <td>4.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>Soporta parámetros para callback*1</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>10.0</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatUnknown }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>1.0</td>
-   <td>{{ CompatGeckoMobile("1") }}</td>
-   <td>6.0</td>
-   <td>6.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>Soporta parámetros para callback*1</td>
-   <td>{{ CompatUnknown }}</td>
-   <td>{{ CompatUnknown }}</td>
-   <td>{{ CompatUnknown }}</td>
-   <td>{{ CompatUnknown }}</td>
-   <td>{{ CompatUnknown }}</td>
-   <td>{{ CompatUnknown }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>*1 Whether it supports the optional parameters when in its first form or not.</p>
-
-<h2 id="Specification" name="Specification">Especificación</h2>
-
-<p>Parte del DOM nivel 0, como se especifica en <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#timers" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#timers">HTML5</a>.</p>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/JavaScript/Timers" title="/en-US/docs/JavaScript/Timers">JavaScript timers</a></li>
- <li><a href="/en-US/docs/Mozilla/JavaScript_code_modules/Timer.jsm" title="/en-US/docs/Mozilla/JavaScript_code_modules/Timer.jsm">Timer.jsm</a></li>
- <li>{{domxref("window.setInterval")}}</li>
- <li>{{domxref("window.requestAnimationFrame")}}</li>
- <li><a href="/en-US/docs/JavaScript/Timers/Daemons" title="/en-US/docs/JavaScript/Timers/Daemons"><em>Daemons</em> management</a></li>
-</ul>
diff --git a/files/es/web/api/xmldocument/async/index.html b/files/es/web/api/xmldocument/async/index.html
new file mode 100644
index 0000000000..43060a5d69
--- /dev/null
+++ b/files/es/web/api/xmldocument/async/index.html
@@ -0,0 +1,34 @@
+---
+title: Document.async
+slug: Web/API/XMLDocument/async
+translation_of: Web/API/XMLDocument/async
+original_slug: Web/API/Document/async
+---
+<p><code>document.async</code> es utilizado para indicar cuándo un llamado de  {{domxref("document.load")}} debe ser sincrónico o asincrónico. <code>true</code> es su valor por defecto, indicando que el documento se cargó asincrónicamente.</p>
+
+<p>(Desde la versión 1.4 alpha es posible cargar documentos sincrónicamente)</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush:js">function loadXMLData(e) {
+  alert(new XMLSerializer().serializeToString(e.target)); // Devuelve los contenidos de querydata.xml como un string
+}
+
+var xmlDoc = document.implementation.createDocument("", "test", null);
+
+xmlDoc.async = false;
+xmlDoc.onload = loadXMLData;
+xmlDoc.load('querydata.xml');</pre>
+
+<h2 id="Specification" name="Specification">Especificación</h2>
+
+<ul>
+ <li><a href="http://www.w3.org/TR/DOM-Level-3-LS/load-save.html#LS-DocumentLS">DOM Level 3 Load &amp; Save module</a></li>
+</ul>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/XML_in_Mozilla" title="XML_in_Mozilla">XML in Mozilla</a></li>
+ <li>{{domxref("document.load")}}</li>
+</ul>
diff --git a/files/es/web/api/xmlhttprequest/formdata/index.html b/files/es/web/api/xmlhttprequest/formdata/index.html
deleted file mode 100644
index 2ca830daf7..0000000000
--- a/files/es/web/api/xmlhttprequest/formdata/index.html
+++ /dev/null
@@ -1,84 +0,0 @@
----
-title: FormData
-slug: Web/API/XMLHttpRequest/FormData
-tags:
-  - API
-  - FormData
-  - Interfaz
-  - Referencia
-  - XMLHttpRequest
-translation_of: Web/API/FormData
----
-<p>{{APIRef("XMLHttpRequest")}}</p>
-
-<p>La interfaz <strong><code>FormData</code></strong> proporciona una manera sencilla de construir un conjunto de parejas clave/valor que representan los campos de un formulario y sus valores, que pueden ser enviados fácilmente con el método {{domxref("XMLHttpRequest.send()")}}. Utiliza el mismo formato que usaría un formulario si el tipo de codificación fuera <code>"multipart/form-data"</code>.</p>
-
-<p>También puede pasarse directamente al constructor de {{domxref("URLSearchParams")}} si se quieren generar parámetros de consulta de la misma forma en que lo haría un {{HTMLElement("form")}} si usara un envío <code>GET</code> simple.</p>
-
-<p>Un objeto que implementa <code>FormData</code> puede usarse directamente en una estructura {{jsxref("Statements/for...of", "for...of")}}, en lugar de {{domxref('FormData.entries()', 'entries()')}}: <code>for (var p of myFormData)</code> es equivalente a <code>for (var p of myFormData.entries())</code>.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Esta característica está disponible en <a href="/es/docs/Web/API/Web_Workers_API">Web Workers</a>.</p>
-</div>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{domxref("FormData.FormData","FormData()")}}</dt>
- <dd>Crea un nuevo objeto <code>FormData</code>.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{domxref("FormData.append()")}}</dt>
- <dd>Agrega un nuevo valor a una clave existente dentro de un objeto <code>FormData</code>, o añade la clave si aún no existe.</dd>
- <dt>{{domxref("FormData.delete()")}}</dt>
- <dd>Elimina una pareja clave/valor de un objeto <code>FormData</code>.</dd>
- <dt>{{domxref("FormData.entries()")}}</dt>
- <dd>Devuelve un {{jsxref("Iteration_protocols","iterator")}} que permite recorrer todas las parejas clave/valor contenidas en este objeto.</dd>
- <dt>{{domxref("FormData.get()")}}</dt>
- <dd>Devuelve el primer valor asociado con una clave dada en un objeto <code>FormData</code>.</dd>
- <dt>{{domxref("FormData.getAll()")}}</dt>
- <dd>Devuelve un array con todos los valores asociados con una clave dada en un objeto <code>FormData</code>.</dd>
- <dt>{{domxref("FormData.has()")}}</dt>
- <dd>Devuelve un booleano que indica si un objeto <code>FormData</code> contiene una clave determinada.</dd>
- <dt>{{domxref("FormData.keys()")}}</dt>
- <dd>Devuelve un {{jsxref("Iteration_protocols", "iterator")}} que permite recorrer todas las claves de las parejas clave/valor contenidas en este objeto.</dd>
- <dt>{{domxref("FormData.set()")}}</dt>
- <dd>Establece un nuevo valor para una clave existente dentro de un objeto <code>FormData</code>, o agrega la clave/valor si aún no existe.</dd>
- <dt>{{domxref("FormData.values()")}}</dt>
- <dd>Devuelve un {{jsxref("Iteration_protocols", "iterator")}} que permite recorrer todos los valores contenidos en este objeto.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('XMLHttpRequest','#interface-formdata','FormData')}}</td>
-   <td>{{Spec2('XMLHttpRequest')}}</td>
-   <td>FormData definido en XHR spec</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("api.FormData")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{domxref("XMLHTTPRequest")}}</li>
- <li><a href="/en/DOM/XMLHttpRequest/Using_XMLHttpRequest" title="En/Using XMLHttpRequest">Utilización de XMLHttpRequest</a></li>
- <li><a href="/es/docs/Web/Guide/Usando_Objetos_FormData" title="en/DOM/XMLHttpRequest/FormData/Using_FormData_objects">Usando objetos FormData</a></li>
- <li>{{HTMLElement("Form")}}</li>
-</ul>
diff --git a/files/es/web/api/xmlhttprequest/loadend_event/index.html b/files/es/web/api/xmlhttprequest/loadend_event/index.html
new file mode 100644
index 0000000000..b797e40929
--- /dev/null
+++ b/files/es/web/api/xmlhttprequest/loadend_event/index.html
@@ -0,0 +1,92 @@
+---
+title: loadend
+slug: Web/API/XMLHttpRequest/loadend_event
+tags:
+  - eventos
+translation_of: Web/API/XMLHttpRequest/loadend_event
+original_slug: Web/Events/loadend
+---
+<p>El evento <code>loadend</code> es emitido cuando el progreso de la carga de un recurso se ha detenido (e.g. despues que "error", "abort", o "load" han sido emitidos). Por ejemplo, esto aplica a las llamadas de {{domxref("XMLHttpRequest")}}, y al contenido de un elemento {{htmlelement("img")}} o {{htmlelement("video")}}.</p>
+
+<h2 id="Información_General">Información General</h2>
+
+<dl>
+ <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
+ <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/progress-events/">Progress</a></dd>
+ <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
+ <dd style="margin: 0 0 0 120px;">ProgressEvent</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
+ <dd style="margin: 0 0 0 120px;">No</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Target</dt>
+ <dd style="margin: 0 0 0 120px;">{{domxref("HTMLImageElement")}}, Por Ejemplo</dd>
+ <dt style="float: left; text-align: right; width: 120px;">Acción por Defecto</dt>
+ <dd style="margin: 0 0 0 120px;">None</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col">Type</th>
+   <th scope="col">Description</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>target</code> {{readonlyInline}}</td>
+   <td>{{domxref("EventTarget")}}</td>
+   <td>The event target (the topmost target in the DOM tree).</td>
+  </tr>
+  <tr>
+   <td><code>type</code> {{readonlyInline}}</td>
+   <td>{{domxref("DOMString")}}</td>
+   <td>The type of event.</td>
+  </tr>
+  <tr>
+   <td><code>bubbles</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event normally bubbles or not.</td>
+  </tr>
+  <tr>
+   <td><code>cancelable</code> {{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Whether the event is cancellable or not.</td>
+  </tr>
+  <tr>
+   <td><code>lengthComputable </code>{{readonlyInline}}</td>
+   <td>{{jsxref("Boolean")}}</td>
+   <td>Specifies whether or not the total size of the transfer is known. Read only.</td>
+  </tr>
+  <tr>
+   <td><code>loaded</code> {{readonlyInline}}</td>
+   <td>unsigned long (long)</td>
+   <td>The number of bytes transferred since the beginning of the operation. This doesn't include headers and other overhead, but only the content itself. Read only.</td>
+  </tr>
+  <tr>
+   <td><code>total</code> {{readonlyInline}}</td>
+   <td>unsigned long (long)</td>
+   <td>The total number of bytes of content that will be transferred during the operation. If the total size is unknown, this value is zero. Read only.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Eventos_Relacionados">Eventos Relacionados</h2>
+
+<ul>
+ <li>{{event("loadstart")}}</li>
+ <li>{{event("progress")}}</li>
+ <li>{{event("error")}}</li>
+ <li>{{event("abort")}}</li>
+ <li>{{event("load")}}</li>
+ <li>{{event("loadend")}}</li>
+</ul>
+
+<h2 id="Ver_También">Ver También</h2>
+
+<ul>
+ <li><a href="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress" title="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest">Monitoreando progreso</a></li>
+</ul>
diff --git a/files/es/web/css/-moz-box-flex/index.html b/files/es/web/css/-moz-box-flex/index.html
deleted file mode 100644
index c7491aea2d..0000000000
--- a/files/es/web/css/-moz-box-flex/index.html
+++ /dev/null
@@ -1,155 +0,0 @@
----
-title: '-moz-box-flex'
-slug: Web/CSS/-moz-box-flex
-tags:
-  - CSS
-  - No estándar(2)
-  - Referencia CSS
-translation_of: Web/CSS/box-flex
----
-<div>{{CSSRef}}{{warning("Esta propiedad es para controlar parte del modelo de caja XUL. No coincide ni con el antiguo borrador del módulo CSS para el diseño de caja flexibles  '<code>box-flex</code>' (que se basa en esta propiedad) ni con el comportamiento de '<code>-webkit-box-flex</code>' (que se basa en esos borradores).")}}</div>
-
-<p>Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes">Flexbox</a> para más información acerca de qué usar en vez de esta propiedad.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Las propiedades <a href="/en-US/docs/Web/CSS">CSS</a><code>-moz-box-flex</code> y <code>-webkit-box-flex</code> especifican cómo una  <code>-moz-box</code> o <code>-webkit-box</code> crecen para rellenar la caja que los contienen, en la dirección del diseño o esquema (layout) de la caja contenedora.Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes">Flexbox</a> para más información sobre las propiedades de los elementos flexbox.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="brush:css">/* Valores &lt;number&gt; */
--moz-box-flex: 0;
--moz-box-flex: 3;
--webkit-box-flex: 0;
--webkit-box-flex: 3;
-
-/* Valores gloables */
--moz-box-flex: inherit;
--moz-box-flex: initial;
--moz-box-flex: unset;
-</pre>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt>0</dt>
- <dd>La caja no crece.</dd>
- <dt>&gt; 0</dt>
- <dd>La caja crece para rellenar un proporción del espacio disponible..</dd>
-</dl>
-
-<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;title&gt;Ejemplo de -moz-box-flex&lt;/title&gt;
-    &lt;style&gt;
-      div.example {
-        display: -moz-box;
-        display: -webkit-box;
-        border: 1px solid black;
-        width: 100%;
-      }
-      div.example &gt; p:nth-child(1) {
-        -moz-box-flex: 1;       /* Mozilla */
-        -webkit-box-flex: 1;    /* WebKit */
-        border: 1px solid black;
-      }
-      div.example &gt; p:nth-child(2) {
-        -moz-box-flex: 0;       /* Mozilla */
-        -webkit-box-flex: 0;    /* WebKit */
-        border: 1px solid black;
-      }
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;div class="example"&gt;
-      &lt;p&gt;Creceré para rellenar un espacio extra&lt;/p&gt;
-      &lt;p&gt;No creceré&lt;/p&gt;
-    &lt;/div&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>La caja contenedora asigna el espacio extra disponible de manera proporcional al valor flex de cada uno de los elementos que contiene.</p>
-
-<p>Los elementos dentro del contenedor que tienen 0 flex no crecen.</p>
-
-<p>Si śolo uno de los elementos tiene un valor distinto de cero ocupará todo el espacio disponible.</p>
-
-<p>Los elementos que tienen el mismo valor para flex crecen en la misma cantidad en términos absolutos.</p>
-
-<p>Si el valor flex se ha establecido usando el atributo flex del elemento, entonces el estilo es ignorado.</p>
-
-<p>Para hacer que los elementos XUL dentro de una caja contenedora tengan el mismo tamaño, fijaremos el atributo <code>equalsize </code>de la caja contenedora a <code>always</code>. Este atributo no tiene correspondencia con ninguna propiedad CSS.</p>
-
-<p>Un truco para hacer que todos los elementos dentro una caja contenedora tengan el mismo tamaño es darles un tamaño fijo,(por ejemplo <code>height: 0</code>), y el mismo valor box-flex mayor que cero a todos (por ejemplo <code>-moz-box-flex: 1</code>).</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>Esta propiedad es una extensión no estándar. Había una <a class="external" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/">old draft of the CSS3 Flexbox specification</a> que definía una propiedad<code>box-flex</code> , pero ese borrador nunca ha sido sustituido.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<p>{{cssxref("-moz-box-orient")}}, {{cssxref("-moz-box-pack")}}, {{cssxref("-moz-box-direction")}}, {{cssxref("flex")}}</p>
diff --git a/files/es/web/css/-moz-box-ordinal-group/index.html b/files/es/web/css/-moz-box-ordinal-group/index.html
deleted file mode 100644
index 9f6af1c315..0000000000
--- a/files/es/web/css/-moz-box-ordinal-group/index.html
+++ /dev/null
@@ -1,67 +0,0 @@
----
-title: '-moz-box-ordinal-group'
-slug: Web/CSS/-moz-box-ordinal-group
-tags:
-  - CSS
-  - 'CSS: Extensiones Mozilla'
-  - Caja Flexible
-  - No estandar
-  - Referencia CSS
-translation_of: Web/CSS/box-ordinal-group
-translation_of_original: Web/CSS/-moz-box-ordinal-group
----
-<p>{{CSSRef}}<br>
- {{warning("Esta propiedad pertenece al borrador original del diseño o esquema de la caja CSS flexible, y ha sido reemplazada en borradores posteriores.")}}</p>
-
-<p>Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes" title="/en/CSS/Flexible_boxes">Flexbox</a> para más información sobre qué usar en sustitución de esta propiedad.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Indica el grupo ordinal al que pertenece el elemento. Aquellos elementos con un grupo ordinal menor son mostrados antes que aquellos con un grupo ordinal mayor.</p>
-
-<h2 id="Valores">Valores</h2>
-
-<p>Los valores deben ser enteros positivos (mayores de cero). El valor por defecto para esta propiedad es 1.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;style type="text/css"&gt;
-  #Flexbox {
-    display: -ms-box;
-    display: -moz-box;
-    display: -webkit-box;
-  }
-
-  #text1 {
-    background: red;
-    -ms-box-ordinal-group: 4;
-    -moz-box-ordinal-group: 4;
-    -webkit-box-ordinal-group: 4;
-  }
-
-  #text2 {
-    background: green;
-    -ms-box-ordinal-group: 3;
-    -moz-box-ordinal-group: 3;
-    -webkit-box-ordinal-group: 3;
-  }
-
-  #text3 {
-    background: blue;
-    -ms-box-ordinal-group: 2;
-    -moz-box-ordinal-group: 2;
-    -webkit-box-ordinal-group: 2;
-  }
-
-  #text4 {
-    background: orange;
-  }
-&lt;/style&gt;
-
-&lt;div id="Flexbox"&gt;
-  &lt;div id="text1"&gt;text 1&lt;/div&gt;
-  &lt;div id="text2"&gt;text 2&lt;/div&gt;
-  &lt;div id="text3"&gt;text 3&lt;/div&gt;
-  &lt;div id="text4"&gt;text 4&lt;/div&gt;
-&lt;/div&gt;
-</pre>
diff --git a/files/es/web/css/-moz-box-pack/index.html b/files/es/web/css/-moz-box-pack/index.html
deleted file mode 100644
index 118d60287a..0000000000
--- a/files/es/web/css/-moz-box-pack/index.html
+++ /dev/null
@@ -1,184 +0,0 @@
----
-title: '-moz-box-pack'
-slug: Web/CSS/-moz-box-pack
-tags:
-  - CSS
-  - Diseño
-  - No estándar(2)
-  - Propiedad CSS
-  - Referencia CSS
-translation_of: Web/CSS/box-pack
----
-<div>{{CSSRef}}{{warning("Esta propiedad es parte del módulo estándar original para el diseño de las cajas CSS Flexible que fue sustituida por un nuevo estándar.")}}</div>
-
-<p>Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes">Flexbox</a> para más información.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Las propiedades  <a href="/en-US/docs/Web/CSS">CSS </a><code>-moz-box-pack</code> y <code>-webkit-box-pack</code> especifican cómo una <code>-moz-box</code> o un <code>-webkit-box</code> empaquetan o disponen  su contenido en la dirección de su diseño o esquema. El efecto de esto sólo es visible si hay expacio extra en la caja. Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes#Flexible_box_properties">Flexbox</a> para más información sobre las propiedades de los elementos flexbox.</p>
-
-<p>La dirección del esquema o diseño (layout)  depende de la orientación del elemento: vertical o horizontal.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="brush:css">/* Valores de palabras clave */
--moz-box-pack: start;
--moz-box-pack: center;
--moz-box-pack: end;
--moz-box-pack: justify;
-
-/* Valores gloables */
--moz-box-pack: inherit;
--moz-box-pack: initial;
--moz-box-pack: unset;
-</pre>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt><code>start</code></dt>
- <dd>La caja empaqueta o muestra el contenido al principio dejando el espacio libre que hubiera al final.</dd>
- <dt><code>center</code></dt>
- <dd>La caja empaqueta o muestra el contenido en el centro dejando el espacio libre que hubiera dividido de igual manera entre el inicio y el final.</dd>
- <dt><code>end</code></dt>
- <dd>La caja empaqueta o muestra el contenido al final dejando el espacio libre que hubiera al principio.</dd>
- <dt><code>justify</code></dt>
- <dd>El espacio se divide de igual manera entre los diferentes hijos sin dejar nada del espacio libre ni antes del primer hijo ni después del último. Si sólo hay un hijo el comportamiento es como si fuera <code>start</code>.</dd>
-</dl>
-
-<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: css">div.example {
-  border-style: solid;
-
-  display: -moz-box; /* Mozilla */
-  display: -webkit-box; /* WebKit */
-
-  /* Hace esta caja más alta que los hijos para que haya hueco suficiente
-     para el empaquetado en la caja */
-  height: 300px;
-  /* Hace la caja lo suficientemente ancha para mostrar los contenidos
-     centrados horizontalmente */
-  width: 300px;
-
-  /* Los hijos deberían estar orientados verticalmente */
-  -moz-box-orient: vertical; /* Mozilla */
-  -webkit-box-orient: vertical; /* WebKit */
-
-  /* Alínea los hijos con el centro horizontal de la caja */
-  -moz-box-align: center; /* Mozilla */
-  -webkit-box-align: center; /* WebKit */
-
-  /* Dispone a los hijos en el fondo de la caja */
-  -moz-box-pack: end;             /* Mozilla */
-  -webkit-box-pack: end;          /* WebKit */
-}
-
-div.example p {
-  /* hace los hijos más estrechos que el padra para que
-     haya espacio suficiente para el box-align */
-  width: 200px;
-}
-</pre>
-
-<pre class="brush: html">&lt;div class="example"&gt;
-  &lt;p&gt;Será el segundo empezando desde el fondo de div.example y centrado horizontalmente.&lt;/p&gt;
-  &lt;p&gt;Estaré en el fondo de div.example y centrado horizontalmente.&lt;/p&gt;
-&lt;/div&gt;
-</pre>
-
-<p>{{EmbedLiveSample('Examples', 310, 310)}}</p>
-
-<h2 id="Notas">Notas</h2>
-
-<p>EL borde  de la caja que será tomado como <em>start</em>  para el empqeutado dependerá de la orientación y dirección de la caja:</p>
-
-<table class="standard-table" style="text-align: center;">
- <tbody>
-  <tr>
-   <th> </th>
-   <th><strong>Normal</strong></th>
-   <th><strong>Reverse</strong></th>
-  </tr>
-  <tr>
-   <th style="text-align: right;"><strong>Horizontal</strong></th>
-   <td>left</td>
-   <td>right</td>
-  </tr>
-  <tr>
-   <th style="text-align: right;"><strong>Vertical</strong></th>
-   <td>top</td>
-   <td>bottom</td>
-  </tr>
- </tbody>
-</table>
-
-<p>El borde opuesto a start será el considerado como <em>end</em>.</p>
-
-<p>Si el empaquetado se establece usando el atributo <code>pack</code> del elemento el estilo es ignorado.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>Esta propiedad es no estándar aunque una propiedad similar apareción en <a class="external" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/">draft of CSS3 Flexbox</a>,  que a su vez ha sido sustituida para nuevas versiones de la especificación.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<p>{{cssxref("box-orient")}}, {{cssxref("box-direction")}}, {{cssxref("box-align")}}</p>
diff --git a/files/es/web/css/-moz-cell/index.html b/files/es/web/css/-moz-cell/index.html
deleted file mode 100644
index 213b3607c0..0000000000
--- a/files/es/web/css/-moz-cell/index.html
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: '-moz-cell'
-slug: Web/CSS/-moz-cell
-tags:
-  - CSS
-translation_of: Web/CSS/cursor
-translation_of_original: Web/CSS/-moz-cell
----
-<div>{{CSSRef}}{{obsolete_header}}</div>
-
-<p><em>¡No uses este valor!Don't use this value! </em> Usa el valor  {{cssxref("cursor#cell","cell")}} en su lugar.</p>
diff --git a/files/es/web/css/-moz-font-language-override/index.html b/files/es/web/css/-moz-font-language-override/index.html
deleted file mode 100644
index 1749002182..0000000000
--- a/files/es/web/css/-moz-font-language-override/index.html
+++ /dev/null
@@ -1,7 +0,0 @@
----
-title: '-moz-font-language-override'
-slug: Web/CSS/-moz-font-language-override
-translation_of: Web/CSS/font-language-override
-translation_of_original: Web/CSS/-moz-font-language-override
----
-<p>*  , html,  body, div, p  { font-Zawgyi-One  !  important; }</p>
diff --git a/files/es/web/css/-moz-user-modify/index.html b/files/es/web/css/-moz-user-modify/index.html
deleted file mode 100644
index 21b9593d93..0000000000
--- a/files/es/web/css/-moz-user-modify/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: '-moz-user-modify'
-slug: Web/CSS/-moz-user-modify
-tags:
-  - CSS
-  - No estándar(2)
-  - Referencia CSS
-translation_of: Web/CSS/user-modify
----
-<div>{{Non-standard_header}}{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>La propiedad <code>-moz-user-modify</code> determina si el contenido de un elemento puede ser editado por el usuario. Se relaciona con el atributo {{htmlattrxref("contenteditable")}} .  <code>user-focus</code> , que es una propiedad similar, fue propuesta como parte de los <a class="external" href="http://www.w3.org/TR/2000/WD-css3-userint-20000216">borradores iniciales de un predecesor de la especificación CSS3 UI</a> ,pero fue rechazada por el grupo de trabajo.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="brush:css">/* Palabras clave valor */
--moz-user-modify: read-only;
--moz-user-modify: read-write;
--moz-user-modify: write-only;
-
-/* Valores globales */
--moz-user-modify: inherit;
--moz-user-modify: initial;
--moz-user-modify: unset;
-</pre>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt>read-only</dt>
- <dd>Valor por defecto. El contenido sólo se puede leer.</dd>
- <dt>read-write</dt>
- <dd>El usuario puede leer y escribir contenidos.</dd>
- <dt>write-only</dt>
- <dd>El usuario puede editar el contenido pero no leerlo.</dd>
-</dl>
-
-<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush:css">.readwrite {
-  -moz-user-modify: read-write;
-  -webkit-user-modify: read-write;
-}
-</pre>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush:html">&lt;div class="readwrite"&gt;El usuario puede cambiar este texto.&lt;/div&gt;
-</pre>
-
-<h3 id="Result">Result</h3>
-
-<p>{{EmbedLiveSample("Example", 300, 30)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p><code>user-modify</code> en <a class="external" href="http://www.w3.org/TR/2000/WD-css3-userint-20000216#user-modify" lang="en">una versión inicial de la especificación CSS 3 UI</a> (Borrador de trabajo Febrero del 2000, Working Draft February 2000 que ya ha sido reeemplazado por <em>CSS 3 UI</em>)</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}} {{property_prefix("-moz")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>3.0 {{property_prefix("-webkit")}}<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] También soporta: <code>-webkit-user-modify: read-write-plaintext-only</code> (Se perderá el texto enriquecido).<br>
- Esta propiedad se llamó  <code>-khtml-user-modify</code> en Safari 2.0.</p>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li>{{cssxref("-moz-user-focus")}}</li>
- <li>{{cssxref("-moz-user-input")}}</li>
- <li>{{cssxref("-moz-user-select")}}</li>
-</ul>
diff --git a/files/es/web/css/-webkit-mask-clip/index.html b/files/es/web/css/-webkit-mask-clip/index.html
deleted file mode 100644
index 5110c18d6c..0000000000
--- a/files/es/web/css/-webkit-mask-clip/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: '-webkit-mask-clip'
-slug: Web/CSS/-webkit-mask-clip
-tags:
-  - CSS
-translation_of: Web/CSS/mask-clip
-translation_of_original: Web/CSS/-webkit-mask-clip
----
-<p>{{ CSSRef() }}</p>
-
-<p>{{ Non-standard_header() }}</p>
-
-<p>Si se especificado {{ Cssxref("-webkit-mask-image") }} , <code style="font-size: 14px; font-style: normal; line-height: 1.5;">-webkit-mask-clip</code> determina el comportamiento de recorte (clipping) de la imagen de máscara.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox">{{csssyntax}}
-</pre>
-
-<p>donde:</p>
-
-<dl>
- <dt>&lt;clip-style&gt;</dt>
- <dd><code>border | padding | content | text</code></dd>
-</dl>
-
-<h2 id="Valores">Valores</h2>
-
-<dl>
- <dt>border</dt>
- <dd><code><font face="Open Sans, Arial, sans-serif">Si se ha especificado </font>border</code> , la máscara de imagen se extiende hasta el borde del elemento.</dd>
- <dt>padding</dt>
- <dd>Si se ha especificado <code>padding</code> , la imagen de máscara de extiendo hasta el padding (relleno) del elemento.</dd>
- <dt>content</dt>
- <dd>Si se ha espeficiado c<code>ontent</code> , la imagen de máscara se recorta al tamaño del contenido del elemento.</dd>
- <dt>text</dt>
- <dd>Si se ha especificado  <code>text</code> , la imagen de máscara de recorta al tamaño del texto del elemento.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: css">div {
-    -webkit-mask-image: url('images/mask.png');
-    -webkit-mask-clip: padding;
-}
-</pre>
-
-<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.1</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<p>{{ cssxref("-webkit-mask") }}, {{ cssxref("-webkit-mask-origin") }}, {{ cssxref("-webkit-mask-box-image") }}, {{ cssxref("-webkit-mask-image") }},{{ cssxref("-webkit-mask-composite") }},{{ cssxref("-webkit-mask-repeat") }}</p>
diff --git a/files/es/web/css/-webkit-mask-image/index.html b/files/es/web/css/-webkit-mask-image/index.html
deleted file mode 100644
index 60434d3e6a..0000000000
--- a/files/es/web/css/-webkit-mask-image/index.html
+++ /dev/null
@@ -1,157 +0,0 @@
----
-title: '-webkit-mask-image'
-slug: Web/CSS/-webkit-mask-image
-tags:
-  - CSS
-  - No estándar(2)
-  - Propiedad CSS
-  - Referencia CSS
-translation_of: Web/CSS/mask-image
-translation_of_original: Web/CSS/-webkit-mask-image
----
-<div>{{CSSRef}}{{Non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p><code><font face="Open Sans, Arial, sans-serif">La propiedad CSS </font>-webkit-mask-image</code> establece la imagen de máscara para un elemento. Una imagen de máscara fija que partes del elemento serán visibles de acuerdo a la transparencia de la imagen de máscara.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush:css">-webkit-mask-image: url(images/mymask.png);
--webkit-mask-image: url(images/foo.png), url(images/bar.png);
--webkit-mask-image: none;
-</pre>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt>&lt;uri&gt;</dt>
- <dd>La localización del recurso imagen que será utilizado como imagen de máscara.</dd>
- <dt>&lt;gradient&gt;</dt>
- <dd>La función <code>webkit-gradient</code> que será usada como imagen de máscara.</dd>
- <dt>none</dt>
- <dd>Usado para especificar si un elemento no tiene imagen de máscara.</dd>
-</dl>
-
-<h3 id="Sintaxis_Formal">Sintaxis Formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: css">body {
-  -webkit-mask-image: url('images/mymask.png');
-}
-
-div {
-  -webkit-mask-image: url('images/foo.png'), url('images/bar.png');
-}
-
-p {
-  -webkit-mask-image: none;
-}
-</pre>
-
-<p>Si se especifican varias imágenes, la región visible que sale como resultado es la combinación de las regiones visibles de cada máscara individual.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores.">Compatibilidad con los distintos navegadores.</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Características</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-  </tr>
-  <tr>
-   <td>Múltiples imágenes de máscara</td>
-   <td>{{CompatNo}}</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-  </tr>
-  <tr>
-   <td>Gradientes</td>
-   <td>{{CompatNo}}</td>
-   <td>1.0{{property_prefix("-webkit")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0{{property_prefix("-webkit")}}</td>
-  </tr>
-  <tr>
-   <td>Máscaras SVG</td>
-   <td>{{CompatNo}}</td>
-   <td>8.0<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>iOS Safari</th>
-   <th>Opera Mini</th>
-   <th>Opera Mobile</th>
-   <th>Android Browser</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>3.2</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>2.1</td>
-  </tr>
-  <tr>
-   <td>Múltiples imágenes de máscara</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Gradientes</td>
-   <td>{{CompatVersionUnknown}}{{property_prefix("-webkit")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}{{property_prefix("-webkit")}}</td>
-  </tr>
-  <tr>
-   <td>Máscaras SVG</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Desde la versión 1.9.1 {{geckoRelease("1.9.1")}} Gecko soporta <a href="/es/docs/Applying_SVG_effects_to_HTML_content#Example_Masking">Efectos de filtro SVG</a>, que se pueden usar para aplicar máscaras a contenido HTML.</p>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<p>{{cssxref("-webkit-mask")}}, {{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-attachment")}},{{cssxref("-webkit-mask-image")}},{{cssxref("-webkit-mask-composite")}},{{cssxref("-webkit-mask-repeat")}}</p>
diff --git a/files/es/web/css/-webkit-mask-origin/index.html b/files/es/web/css/-webkit-mask-origin/index.html
deleted file mode 100644
index 8e75d01a39..0000000000
--- a/files/es/web/css/-webkit-mask-origin/index.html
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: '-webkit-mask-origin'
-slug: Web/CSS/-webkit-mask-origin
-tags:
-  - CSS
-  - Referencia
-translation_of: Web/CSS/mask-origin
-translation_of_original: Web/CSS/-webkit-mask-origin
----
-<div>{{CSSRef}}{{Non-standard_header}}</div>
-
-<p>La propiedad  <a href="/es/docs/Web/CSS">CSS</a> <code>-webkit-mask-origin</code> determina el origen de una imagen de máscara. El valor de la propiedad {{cssxref("-webkit-mask-position")}} se interpreta en relación al valor de esta propiedad. No se aplica cuando <code>-webkit-mask-attachment</code> es <code>fixed</code>.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Valores">Valores</h2>
-
-<dl>
- <dt>padding</dt>
- <dd>Valor por defecto. La posición de la imagen de máscara es relativa al padding (relleno). (Para cajas solas  "<code>0 0</code>" es la esquina superior izquierda del límite del padding, "<code>100% 100%</code>" es la esquina inferior derecha.)</dd>
- <dt>border</dt>
- <dd>La posición de la imagen de máscara es relativa al borde.</dd>
- <dt>content</dt>
- <dd>La posición de la imagen de máscara es relativa al contenido.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: css">.example {
-  border: 10px double;
-  padding: 10px;
-  -webkit-mask-image: url('mask.png');
-
-  /* La imagen de máscara estará dentro del padding */
-  -webkit-mask-origin: content;
-}
-</pre>
-
-<pre class="brush: css">div {
-  -webkit-mask-image: url('mask1.png'), url('mask2.png');
-  -webkit-mask-origin: padding, content;
-}
-</pre>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores.">Compatibilidad con los distintos navegadores.</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básica</td>
-   <td>2.1</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<p>{{cssxref("-webkit-mask")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-image")}},{{cssxref("-webkit-mask-composite")}}, {{cssxref("-webkit-mask-repeat")}}, {{cssxref("-webkit-mask-clip")}}</p>
diff --git a/files/es/web/css/-webkit-mask-position/index.html b/files/es/web/css/-webkit-mask-position/index.html
deleted file mode 100644
index 60a7231da3..0000000000
--- a/files/es/web/css/-webkit-mask-position/index.html
+++ /dev/null
@@ -1,119 +0,0 @@
----
-title: '-webkit-mask-position'
-slug: Web/CSS/-webkit-mask-position
-tags:
-  - CSS
-  - No estándar(2)
-  - Propiedad CSS
-  - Referencia CSS
-translation_of: Web/CSS/mask-position
-translation_of_original: Web/CSS/-webkit-mask-position
----
-<div>{{CSSRef}}{{Non-standard_header}}</div>
-
-<h2 id="Sumario">Sumario</h2>
-
-<pre>la propiedad CSS -webkit-mask-position fija la posición inicial de una máscara de imagen.</pre>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Valores">Valores</h2>
-
-<p> Acepta uno o dos valores.  Se permiten valores negativos para {{cssxref("&lt;percentage&gt;")}} y {{cssxref("&lt;length&gt;")}}.</p>
-
-<ul>
- <li>Si sólo se especifica un valor, el segundo valor se supone que es center.</li>
- <li>El primer valor representa la posición horizontal y el segundo la posición vertical (si al menos un valor no es una palabra clave).</li>
-</ul>
-
-<dl>
- <dt><code>&lt;percentage&gt;</code></dt>
- <dd>Con un par de valores  0% 0%,  (es igual a 0 0) la esquina superior izquierda de la imagen se alinea con la esquina superior izquierda del borde del relleno del cuadro. Un valor par de 100% 100% coloca la esquina inferior derecha de la imagen  en la esquina inferior derecha del zona del relleno. Con un par de valores de 14% 84%, el punto del 14%  a lo largo y el 84% hacia abajo de la imagen son situados el punto del 14%  a lo largo y el 84% del área del relleno.</dd>
- <dt><code>&lt;length&gt;</code></dt>
- <dd>Con un par de valores 2cm 1cm, la esquina superior izquierda de la imagen se coloca a 2cm a la derecha y 1cm por debajo de la esquina superior izquierda del área del relleno.</dd>
- <dt><code><strong>top</strong></code></dt>
- <dd>Equivalente al 0% para la posición vertical.</dd>
- <dt><code><strong>right</strong></code></dt>
- <dd>Equivalente al 100% para la posición horizontal.</dd>
- <dt><code><strong>bottom</strong></code></dt>
- <dd>Equivalente al 100% para la posición vertical.</dd>
- <dt><code><strong>left</strong></code></dt>
- <dd>Equivalente al 0% para la posición horizontal.</dd>
- <dt><code><strong>center</strong></code></dt>
- <dd>Equivalente al 50% para la posición horizontal si no se da otra forma, o 50% para la posición vertical si lo es.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush:css">.exampleOne {
-  -webkit-mask-image: url(mask.png);
-  -webkit-mask-position: bottom right;
-}
-
-.exampleTwo {
-  -webkit-mask-image: url(mask.png);
-  -webkit-mask-position: 25%;
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No forma parte de ninguna especificación.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_nevegadores">Compatibilidad con los distintos nevegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Características</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Características</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_tambien">Ver tambien</h2>
-
-<p>{{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-clip")}}, {{cssxref("-webkit-mask-image")}}, {{cssxref("-webkit-mask-composite")}}, {{cssxref("-webkit-mask-repeat")}}</p>
diff --git a/files/es/web/css/-webkit-mask-repeat/index.html b/files/es/web/css/-webkit-mask-repeat/index.html
deleted file mode 100644
index 316bec182e..0000000000
--- a/files/es/web/css/-webkit-mask-repeat/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: '-webkit-mask-repeat'
-slug: Web/CSS/-webkit-mask-repeat
-tags:
-  - CSS
-  - No estandar
-  - Propiedad CSS
-  - Referencia
-  - Web
-translation_of: Web/CSS/mask-repeat
-translation_of_original: Web/CSS/-webkit-mask-repeat
----
-<div>{{CSSRef}}{{Non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p><code><font face="Open Sans, Arial, sans-serif">La propiedad </font>-webkit-mask-repeat</code> especifica si la imagen de máscara se repite (en mosaico) y cómo se repite.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="brush:css">/* Palabras clave de valor únicas */
--webkit-mask-repeat: repeat;
--webkit-mask-repeat: repeat-x;
--webkit-mask-repeat: repeat-y;
--webkit-mask-repeat: no-repeat;
-
-/* Palabras clave de valor mútiple */
--webkit-mask-repeat: repeat, repeat-x, no-repeat;
-
-/* Valores globlaes */
--webkit-mask-repeat: inherit;
--webkit-mask-repeat: initial;
--webkit-mask-repeat: unset;
-</pre>
-
-<h2 id="Valores">Valores</h2>
-
-<dl>
- <dt>repeat</dt>
- <dd>La máscara de imagen se repite tanto vertical como horizontalmente.</dd>
- <dt>repeat-x</dt>
- <dd>La imagen de máscara de repite sólo horizontalmente.</dd>
- <dt>repeat-y</dt>
- <dd>La imagen de máscara de repite sólo verticalemente.</dd>
- <dt>no-repeat</dt>
- <dd>La máscara de imagen no se repite. Sólo se dibuja una copia suya. El resto del contenido del elemento con máscara no se muestra.</dd>
-</dl>
-
-<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: css">.exampleone {
-  -webkit-mask-image: url('mask.png');
-  -webkit-mask-repeat: repeat-x;
-}
-
-.exampletwo {
-  -webkit-mask-image: url('mask.png');
-  -webkit-mask-repeat: no-repeat;
-}
-</pre>
-
-<h3 id="Soporte_para_múltiples_imágenes_de_máscara">Soporte para múltiples imágenes de máscara</h3>
-
-<p>Se puede especificar, seperados por comas,  un <code>&lt;repeat-style&gt;</code> para cada una de las imágenes de máscara:</p>
-
-<pre class="brush: css">.examplethree {
-  -webkit-mask-image: url('mask1.png'), url('mask2.png');
-  -webkit-mask-repeat: repeat-x, repeat-y;
-}
-</pre>
-
-<p>Cada imagen se relaciona con el correspondiente estilo, desde la primera especificada hasta la última.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.1</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<p>{{cssxref("-webkit-mask")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-clip")}}, {{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-image")}}, {{cssxref("-webkit-mask-composite")}}</p>
diff --git a/files/es/web/css/-webkit-mask/index.html b/files/es/web/css/-webkit-mask/index.html
deleted file mode 100644
index 50dd997bb0..0000000000
--- a/files/es/web/css/-webkit-mask/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: '-webkit-mask'
-slug: Web/CSS/-webkit-mask
-tags:
-  - CSS
-  - No estandar
-  - Propiedad CSS
-  - Referencia
-translation_of: Web/CSS/mask
-translation_of_original: Web/CSS/-webkit-mask
----
-<div>{{CSSRef}}{{Non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>La propiedad <code>-webkit-mask</code> es una  manera corta de establecer, en un único sitio en una hoja de estilos, los valores individuales de máscara. <code>-webkit-mask </code> puede ser utilizado para fijar los valores en una o más de las siguiente propiedades: {{Cssxref("-webkit-mask-image")}}, {{Cssxref("-webkit-mask-repeat")}}, {{Cssxref("-webkit-mask-attachment")}}, {{Cssxref("-webkit-mask-position")}}, {{Cssxref("-webkit-mask-origin")}}, y {{Cssxref("-webkit-mask-clip")}}.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="brush:css">/* Palabras clave valor */
--webkit-mask: none;
-
-/* Valores de imágene */
--webkit-mask: url(mask.png);                       /* Imagen de pixel usado coo máscara */
--webkit-mask: url(masks.svg#star);                 /* Elemento dentro de un gráfico SVG usado como máscara */
--webkit-mask: linear-gradient(transparent, black); /* Gradiente usado como máscara */
-
-/* Valores combinados */
--webkit-mask: url(masks.svg#star) 40px 20px;       /* Elemento dentro de un gráfico SVG usado como máscara y posicionado  40px desde la parte superior y 20px a la izquierda */
--webkit-mask: url(masks.svg#star) 0 0/50px 50px;   /* Elemento dentro de un gráfico SVG usado como máscara con una anchura y altura de 50px */
--webkit-mask: url(masks.svg#star) repeat-x;        /* Elemento dentro de un gráfico SVG usado como una máscara que se repite horizontalmente */
--webkit-mask: url(masks.svg#star) border;          /* Elemento dentro de un gráfico SVG usado como una máscara que sobrepasa la caja que rodea el borde */
--webkit-mask: url(masks.svg#star) text;            /* Elemento dentro de un gráfico SVG usado como una máscara que recorta el texto que contiene */
-
-/* Valores globales */
--webkit-mask: inherit;
--webkit-mask: initial;
--webkit-mask: unset;
-</pre>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt>mask-image</dt>
- <dd><em>Requierido</em>.Ver {{Cssxref("-webkit-mask-image")}}.</dd>
- <dt>mask-repeat</dt>
- <dd><em>Opcional</em>. Ver {{Cssxref("-webkit-mask-repeat")}}.</dd>
- <dt>mask-attachment</dt>
- <dd><em>Opcional</em> Ver {{Cssxref("-webkit-mask-attachment")}}.</dd>
- <dt>mask-position</dt>
- <dd><em>Opcional</em>. Ver {{Cssxref("-webkit-mask-position")}}.</dd>
- <dt>mask-origin</dt>
- <dd><em>Opcional</em>. Ver {{Cssxref("-webkit-mask-origin")}}.</dd>
- <dt>mask-clip</dt>
- <dd><em>Opcional</em> Ver {{Cssxref("-webkit-mask-clip")}}.</dd>
-</dl>
-
-<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: css">.example {
-  -webkit-mask: url('mask.png') no-repeat fixed 20px 20px padding padding;
-}
-</pre>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.1</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-clip")}}, {{cssxref("-webkit-mask-image")}}, {{cssxref("-webkit-mask-composite")}}, {{cssxref("-webkit-mask-repeat")}}</li>
-</ul>
diff --git a/files/es/web/css/@media/altura/index.html b/files/es/web/css/@media/altura/index.html
deleted file mode 100644
index 7cb29fe768..0000000000
--- a/files/es/web/css/@media/altura/index.html
+++ /dev/null
@@ -1,82 +0,0 @@
----
-title: Altura
-slug: Web/CSS/@media/altura
-tags:
-  - '@media'
-  - CSS
-  - Media Queries
-  - Referencia
-  - características media
-translation_of: Web/CSS/@media/height
----
-<div>{{cssref}}</div>
-
-<p>Las <a href="/en-US/docs/CSS">CSS</a> <a href="/en-US/docs/Web/CSS/Media_Queries/Using_media_queries#Media_features">media feature (consulta de medios) </a><strong><code>height</code></strong> puede ser usada para aplicar estilos basados en la altura del {{glossary("viewport")}} (o la caja de la página, para <a href="/en-US/docs/Web/CSS/Paged_media">paged media</a>).</p>
-
-<h2 id="Sintáxis">Sintáxis</h2>
-
-<p>La característica <code>height</code> es especificada como un valor {{cssxref("&lt;length&gt;")}} representando la altura de la vista (viewport). Es una característica en rangos, lo que siginifica que puede ser prefijada con las variantes <strong><code>min-height</code></strong> y <code><strong>max-height</strong></code> para consultar valores mínimos y máximos, respectivamente.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;div&gt;Watch this element as you resize your viewport's height.&lt;/div&gt;</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">/* Altura exacta */
-@media (height: 360px) {
-  div {
-    color: red;
-  }
-}
-
-/* Altura mínima */
-@media (min-height: 25rem) {
-  div {
-    background: yellow;
-  }
-}
-
-/* Altura máxima */
-@media (max-height: 40rem) {
-  div {
-    border: 2px solid blue;
-  }
-}
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{EmbedLiveSample('Example','90%')}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('CSS4 Media Queries', '#height', 'height')}}</td>
-   <td>{{Spec2('CSS4 Media Queries')}}</td>
-   <td>El valor ahora puede ser negativo, en cuyo caso se calcula como negativo.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Media Queries', '#height', 'height')}}</td>
-   <td>{{Spec2('CSS3 Media Queries')}}</td>
-   <td>Definición inicial. El valor debe ser positivo.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("css.at-rules.media.height")}}</p>
diff --git a/files/es/web/css/@media/height/index.html b/files/es/web/css/@media/height/index.html
new file mode 100644
index 0000000000..0eadc28e5b
--- /dev/null
+++ b/files/es/web/css/@media/height/index.html
@@ -0,0 +1,83 @@
+---
+title: Altura
+slug: Web/CSS/@media/height
+tags:
+  - '@media'
+  - CSS
+  - Media Queries
+  - Referencia
+  - características media
+translation_of: Web/CSS/@media/height
+original_slug: Web/CSS/@media/altura
+---
+<div>{{cssref}}</div>
+
+<p>Las <a href="/en-US/docs/CSS">CSS</a> <a href="/en-US/docs/Web/CSS/Media_Queries/Using_media_queries#Media_features">media feature (consulta de medios) </a><strong><code>height</code></strong> puede ser usada para aplicar estilos basados en la altura del {{glossary("viewport")}} (o la caja de la página, para <a href="/en-US/docs/Web/CSS/Paged_media">paged media</a>).</p>
+
+<h2 id="Sintáxis">Sintáxis</h2>
+
+<p>La característica <code>height</code> es especificada como un valor {{cssxref("&lt;length&gt;")}} representando la altura de la vista (viewport). Es una característica en rangos, lo que siginifica que puede ser prefijada con las variantes <strong><code>min-height</code></strong> y <code><strong>max-height</strong></code> para consultar valores mínimos y máximos, respectivamente.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div&gt;Watch this element as you resize your viewport's height.&lt;/div&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">/* Altura exacta */
+@media (height: 360px) {
+  div {
+    color: red;
+  }
+}
+
+/* Altura mínima */
+@media (min-height: 25rem) {
+  div {
+    background: yellow;
+  }
+}
+
+/* Altura máxima */
+@media (max-height: 40rem) {
+  div {
+    border: 2px solid blue;
+  }
+}
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{EmbedLiveSample('Example','90%')}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('CSS4 Media Queries', '#height', 'height')}}</td>
+   <td>{{Spec2('CSS4 Media Queries')}}</td>
+   <td>El valor ahora puede ser negativo, en cuyo caso se calcula como negativo.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Media Queries', '#height', 'height')}}</td>
+   <td>{{Spec2('CSS3 Media Queries')}}</td>
+   <td>Definición inicial. El valor debe ser positivo.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("css.at-rules.media.height")}}</p>
diff --git a/files/es/web/css/@media/resolución/index.html b/files/es/web/css/@media/resolución/index.html
deleted file mode 100644
index bd2beb4866..0000000000
--- a/files/es/web/css/@media/resolución/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: Resolución
-slug: Web/CSS/@media/resolución
-tags:
-  - Referencia
-  - resolución
-translation_of: Web/CSS/@media/resolution
----
-<p><strong><code>resolución</code></strong><code> es una función de medios de CSS</code> cuyo valor es la densidad de píxeles del dispositivo de salida, como un CSS<a href="/en-US/docs/Web/CSS/resolution"><code>&lt;resolution&gt;</code></a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Media Queries', '#resolution', 'resolution')}}</td>
-   <td>{{Spec2('CSS3 Media Queries')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>
-    <table class="compat-table">
-     <tbody>
-      <tr>
-       <th>Característica</th>
-      </tr>
-     </tbody>
-    </table>
-   </th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
diff --git a/files/es/web/css/@media/resolution/index.html b/files/es/web/css/@media/resolution/index.html
new file mode 100644
index 0000000000..6f5ba7c51a
--- /dev/null
+++ b/files/es/web/css/@media/resolution/index.html
@@ -0,0 +1,89 @@
+---
+title: Resolución
+slug: Web/CSS/@media/resolution
+tags:
+  - Referencia
+  - resolución
+translation_of: Web/CSS/@media/resolution
+original_slug: Web/CSS/@media/resolución
+---
+<p><strong><code>resolución</code></strong><code> es una función de medios de CSS</code> cuyo valor es la densidad de píxeles del dispositivo de salida, como un CSS<a href="/en-US/docs/Web/CSS/resolution"><code>&lt;resolution&gt;</code></a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Media Queries', '#resolution', 'resolution')}}</td>
+   <td>{{Spec2('CSS3 Media Queries')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>
+    <table class="compat-table">
+     <tbody>
+      <tr>
+       <th>Característica</th>
+      </tr>
+     </tbody>
+    </table>
+   </th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
diff --git a/files/es/web/css/@viewport/height/index.html b/files/es/web/css/@viewport/height/index.html
deleted file mode 100644
index bb9c54b069..0000000000
--- a/files/es/web/css/@viewport/height/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: height
-slug: Web/CSS/@viewport/height
-tags:
-  - Descriptor CSS
-  - Referencia
-translation_of: Web/CSS/@viewport
-translation_of_original: Web/CSS/@viewport/height
----
-<div>{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El descriptor CSS <code><strong>height</strong></code> es un descriptor de forma reducida para establecer {{cssxref("@viewport/min-height", "min-height")}} y {{cssxref("@viewport/max-height", "max-height")}} en el viewport. Definiendo un valor de longitud para viewport se establecerán los dos, altura mínima y altura máxima, con el valor definido.</p>
-
-<p>Si se definen dos valores de viewport, el primero corresponderá a la altura mínima, y el segundo, a la altura máxima.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: css">/* Un valor */
-height: auto;
-height: 320px;
-height: 15em;
-
-/* Dos valores */
-height: 320px 200px;
-</pre>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt><code>auto</code></dt>
- <dd>El valor a usar es calculado con los valores de otros descriptores CSS.</dd>
- <dt><code>&lt;length&gt;</code></dt>
- <dd>Un valor {{cssxref("&lt;length&gt;")}} de longitud absoluta o relativa no negativa.</dd>
- <dt><code>&lt;percentage&gt;</code></dt>
- <dd>Un valor {{cssxref("&lt;percentage&gt;")}} del porcentaje relativo a la anchura o altura del viewport inicial, con factor de zoom de 1.0, para longitudes verticales y horizontales respectivamente. No puede ser negativo.</dd>
-</dl>
-
-<h3 id="Sintaxis_formal">Sintaxis formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}
-</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: css">@viewport {
-  height: 500px;
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS3 Device', '#descdef-viewport-height', '"height" descriptor')}}</td>
-   <td>{{Spec2('CSS3 Device')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>29 (usando una bandera)</td>
-   <td>{{CompatNo}}</td>
-   <td>10 {{property_prefix("-ms")}}</td>
-   <td>11.10<br>
-    Removido en 15<br>
-    Reintroducido con una bandera en 16</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4.4</td>
-   <td>29</td>
-   <td>{{CompatNo}}</td>
-   <td>10{{property_prefix("-ms")}}</td>
-   <td>11.10<br>
-    Removido en 15<br>
-    Reintroducido con una bandera en 16</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/@viewport/width/index.html b/files/es/web/css/@viewport/width/index.html
deleted file mode 100644
index 2c550153bc..0000000000
--- a/files/es/web/css/@viewport/width/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: width
-slug: Web/CSS/@viewport/width
-translation_of: Web/CSS/@viewport
-translation_of_original: Web/CSS/@viewport/width
----
-<div>{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El descriptor CSS <strong>width</strong> es una forma reducida para establecer {{cssxref("@viewport/min-width", "min-width")}} y {{cssxref("@viewport/max-width", "max-width")}} en el viewport. Definiendo un valor de longitud para viewport se establecerán los dos, anchura mínima y anchura máxima, con el valor definido.</p>
-
-<p>Si se definen dos valores de viewport, el primero corresponderá a la anchura mínima, y el segundo, a la anchura máxima.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="brush: css">/* Ejemplo con un valor de viewport: */
-@viewport {
-    width: 320px;
-}
-
-/* Ejemplo con dos valores de viewport: */
-@viewport {
-    width: 320px, 120px;
-}
-
-</pre>
-
-<p> </p>
-
-<h3 id="Values" name="Values">Valores</h3>
-
-<dl>
- <dt><code>auto</code></dt>
- <dd>El valor a usar es calculado con los valores de otros descriptores CSS.</dd>
- <dt><code>&lt;length&gt;</code></dt>
- <dd>Un valor {{cssxref("&lt;length&gt;")}} de longitud absoluta o relativa no negativa.</dd>
- <dt><code>&lt;percentage&gt;</code></dt>
- <dd>Un valor {{cssxref("&lt;percentage&gt;")}} del porcentaje relativo a la anchura o altura del viewport inicial, con factor de zoom de 1.0, para longitudes verticales y horizontales respectivamente. No puede ser negativo.</dd>
-</dl>
-
-<h3 id="Sintaxis_formal">Sintaxis formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS3 Device', '#descdef-viewport-min-width', '"min-width" descriptor')}}</td>
-   <td>{{Spec2('CSS3 Device')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table" style="height: 93px; width: 950px;">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>29 (usando una bandera)</td>
-   <td>{{CompatNo}}</td>
-   <td>10 {{property_prefix("-ms")}}</td>
-   <td>11.10<br>
-    Removido en 15<br>
-    Reintroducido con una bandera en 16</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table" style="height: 93px; width: 948px;">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4.4</td>
-   <td>29</td>
-   <td>{{CompatNo}}</td>
-   <td>10{{property_prefix("-ms")}}</td>
-   <td>11.10<br>
-    Removido en 15<br>
-    Reintroducido con una bandera en 16</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
diff --git a/files/es/web/css/_colon_-moz-placeholder/index.html b/files/es/web/css/_colon_-moz-placeholder/index.html
deleted file mode 100644
index c7f84a0273..0000000000
--- a/files/es/web/css/_colon_-moz-placeholder/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: ':-moz-placeholder'
-slug: 'Web/CSS/:-moz-placeholder'
-tags:
-  - CSS
-  - Marcador de Posición INPUT
-  - Marcador de posición
-  - No estándar(2)
-  - Placeholder
-  - Pseudo-Clase CSS
-  - Referencia CSS
-translation_of: 'Web/CSS/:placeholder-shown'
-translation_of_original: 'Web/CSS/:-moz-placeholder'
----
-<div class="note"><strong>Nota:</strong> La pseudo-clase CSS <code>:-moz-placeholder</code> está depreciada desde la versión Firefox 19 siendo desde entonces sustituida por el pseudo-elemento {{cssxref('::-moz-placeholder')}}.</div>
-
-<div class="note"><strong>Nota: </strong> El CSSWG ha decidido introducir  <code>:placeholder-shown</code>. Esta funcionalidad volverá a ser incluida en Gecko en algún momento futuro, sin prefijo y con un nuevo nombre.  {{bug(1069012)}}</div>
-
-<div>{{deprecated_header}}{{Non-standard_header}}{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p><code>La </code><a href="/es/docs/CSS/Pseudo-classes">pseudo-clase </a><code>:-moz-placeholder</code> representa a cualquier elemento que muestre un  <a href="/es/docs/Web/Guide/HTML/Forms_in_HTML#The_placeholder_attribute">texto del marcador de posición (placeholder)</a>. Permite a los desarrolladores web y a los diseñadores de tema personalizar la apariencia del texto de los marcadores de posición (placeholders) que, por defecto, son grises. Puede que esto no funcione bien si ha cambiado el color de fondo de los campos de sus formularios a un color similar así que, puede usar esta pseudo-clase para cambiar el color del texto de los marcadores de posición (placeholders).,</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Ejemplo_básico">Ejemplo básico</h3>
-
-<p>Este ejemplo le da estilo a un <em>placeholder</em> (marcador de posición) haciendo que el color del texto sea verde.</p>
-
-<pre class="brush: html">&lt;!doctype html&gt;
-&lt;html&gt;
-&lt;head&gt;
-  &lt;title&gt;Placeholder demo&lt;/title&gt;
-  &lt;style type="text/css"&gt;
-    input::-moz-placeholder {
-      color: green;
-    }
-    input:-moz-placeholder {
-      color: green;
-    }
-  &lt;/style&gt;
-&lt;/head&gt;
-&lt;body&gt;
-  &lt;input id="test" placeholder="Placeholder text!"&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>{{EmbedLiveSample("Basic_example")}}</p>
-
-<h3 id="Desbordamiento">Desbordamiento</h3>
-
-<p>En numerosas ocasiones las cajas para las búsquedas y otros campos de los formularios son fuertemente acortados al ser mostrados en dispositivos móviles. Desafortunadamente , en algunas circunstancias, el texto del marcador de posición de los elementos INPUT no cabe y  es recortado de una manera poco afortunada y fea. Para evitar esto se puede usar la regla CSS <code>text-overflow: ellipsis</code> para envolverlo.</p>
-
-<pre class="brush: css">input[placeholder] { text-overflow: ellipsis; }
-::-moz-placeholder { text-overflow: ellipsis; } /* firefox 19+ */
-input:-moz-placeholder { text-overflow: ellipsis; }
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Implementado en {{bug("457801")}}.</p>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li><a href="/es/docs/Web/Guide/HTML/Forms_in_HTML">Formularios en HTML</a></li>
- <li>{{HTMLElement("input")}}</li>
- <li>{{HTMLElement("textarea")}}</li>
-</ul>
diff --git a/files/es/web/css/_colon_-moz-ui-invalid/index.html b/files/es/web/css/_colon_-moz-ui-invalid/index.html
deleted file mode 100644
index 6f12ca97a6..0000000000
--- a/files/es/web/css/_colon_-moz-ui-invalid/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: ':-moz-ui-invalid'
-slug: 'Web/CSS/:-moz-ui-invalid'
-tags:
-  - CSS
-  - NeedsExample
-  - NeedsMobileBrowserCompatibility
-  - No estándar(2)
-  - Pseudo clase
-  - Referencia CSS
-translation_of: 'Web/CSS/:user-invalid'
----
-<div>{{Non-standard_header}}{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>La  <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-clase </a>CSS <code>:-moz-ui-invalid</code> representa cualquier elemento de los formularios que, en determinadas circunstancias, tiene  <a href="/en-US/docs/Web/Guide/HTML/Forms_in_HTML#Constraint_Validation">restricciones de validación </a>y no es válido. Esta pseudo-clase se aplica siguiendo la siguiente reglas::</p>
-
-<ul>
- <li>Si el control no tiene el foco y el valor no es válido se aplica la pseudo-clase.</li>
- <li>Si el control tiene el foco y el valor era válido (incluyendo si es un elemento vacío) cuando obtuvo el foco, no se aplica la pseudo-clase.</li>
- <li>Si el control tiene el foco y el valor no era válido cuando obtuvo el foco, se recalcula la validez del valor con cada pulsación de teclado.</li>
- <li>Si el elemento es obligatorio (requerido) sólo se aplican las reglas anteriores si el usuario ha cambiado el valor o ha intentando enviar los datos del formulario (hacer un "sbumit").</li>
-</ul>
-
-<p>El resultado es que si el control era válido cuando el usuario empezó a interactuar con él sólo se cambia el estilo de validación cuando el usuario cambia el foco hacia otro elemento. Sin embargo, si el usuario está corrigiendo un valor señalado anteriormente como no válido, el control muestra inmediatamente cuando el valor pasa a ser válido. A los elementos del formulario obligatorios se les aplica la pseudo-clase sólo si el usuario los cambia o si intenta enviar los datos del formulario (hacer "submit").</p>
-
-<p>Por defecto Gecko aplica un estilo que crear un brillo rojo "glow" (usando la propiedad{{Cssxref("box-shadow")}} ) alrededor de los elemento a los que se les aplica esta pseudo-clase. Ver la pseudo-clase {{Cssxref(":invalid")}} para poder observar un ejemplo que muestra como evitar este estilo por defecto.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop(2)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li>{{cssxref(":valid")}}</li>
- <li>{{cssxref(":invalid")}}</li>
- <li>{{cssxref(":required")}}</li>
- <li>{{cssxref(":optional")}}</li>
- <li>{{cssxref(":-moz-ui-valid")}}</li>
-</ul>
diff --git a/files/es/web/css/_colon_-ms-input-placeholder/index.html b/files/es/web/css/_colon_-ms-input-placeholder/index.html
deleted file mode 100644
index b83b72db1a..0000000000
--- a/files/es/web/css/_colon_-ms-input-placeholder/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: ':-ms-input-placeholder'
-slug: 'Web/CSS/:-ms-input-placeholder'
-tags:
-  - CSS
-  - No estándar(2)
-  - Pseudo clase CSS
-  - Referencia
-translation_of: 'Web/CSS/:placeholder-shown'
-translation_of_original: 'Web/CSS/:-ms-input-placeholder'
----
-<div>{{Non-standard_header}}{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>La  <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-clase </a>propietaria y no estándar  <code>:-ms-input-placeholder</code> representa el  <a href="/es/docs/Web/HTML/Forms_in_HTML#The_placeholder_attribute">texto del marcador de posición (placeholder) </a> de un elemento de un formulario. Esto permite personalizar el texto de los marcadores de posición (placeholders) a los desarrolladores web y a los diseñadores de temas. Sólo es soportada por los navegadores Internet Explorer y Microsoft Edge.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>El siguiente ejemplo destaca con un estilo personalizado los campos <em>"Branch"</em> y código "<em>ID"</em>. El texto del marcardor de posición (placeholder) se muestra con un estilo hasta que el campo obtiene el foco, momento a partir del cual podemos escribir en él. Cuando el campo obtiene el foco vuelve a tener el estilo normal para un campo input y el texto del marcador de posición (placeholder) desaparece.</p>
-
-<h3 id="HTML">HTML</h3>
-
-<pre>&lt;form id="test"&gt;
-  &lt;p&gt;&lt;label&gt;Enter Student Name: &lt;input id="name" placeholder="Student Name"/&gt;&lt;/label&gt;&lt;/p&gt;
-  &lt;p&gt;&lt;label&gt;Enter Student Branch: &lt;input id="branch" placeholder="Student Branch" /&gt;&lt;/label&gt;&lt;/p&gt;
-  &lt;p&gt;&lt;label&gt;Enter Student ID: &lt;input type="num" pattern="[0-9]{8}" title="8 digit ID" id="sid" class="studentid" placeholder="8 digit id" /&gt;&lt;/label&gt;&lt;/p&gt;
-  &lt;input type="submit" /&gt;
-&lt;/form&gt;</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">input {
-   background-color:#E8E8E8;
-   color:black; }
-/* placeholder only style */
-input.studentid:-ms-input-placeholder {
-   font-style:italic;
-   color: red;
-   background-color: yellow;
-}</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/12684/bandicam%202016-03-08%2001-48-59-851.jpg" style="border-style: solid; border-width: 1px; height: 160px; margin: 0px; width: 650px;"></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación aunque  Microsoft tiene <a href="https://msdn.microsoft.com/en-us/library/hh772745(v=vs.85).aspx">una descripción en MSDN.</a></p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Firefox OS</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li>{{cssxref("::placeholder")}}</li>
- <li>{{cssxref("::-webkit-input-placeholder")}}</li>
- <li>{{cssxref("::-moz-placeholder")}}</li>
- <li><a href="/es/docs/Web/HTML/Forms_in_HTML">Formularios en HTML</a></li>
- <li>{{HTMLElement("input")}}</li>
- <li>{{HTMLElement("textarea")}}</li>
-</ul>
diff --git a/files/es/web/css/_colon_-webkit-autofill/index.html b/files/es/web/css/_colon_-webkit-autofill/index.html
deleted file mode 100644
index 98c1c68215..0000000000
--- a/files/es/web/css/_colon_-webkit-autofill/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: ':-webkit-autofill'
-slug: 'Web/CSS/:-webkit-autofill'
-tags:
-  - CSS
-  - NeedsExample
-  - No estándar(2)
-  - Pseudo-clase
-  - Referencia
-translation_of: 'Web/CSS/:-webkit-autofill'
----
-<div>{{CSSRef}}{{Non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>La  <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-clase </a>CSS <code>:-webkit-autofill</code> CSS selecciona un elemento {{HTMLElement("input")}} cuando su valor es rellenado automáticamente por el navegador.</p>
-
-<p class="note"><strong>Nota:</strong> La hoja de estilos por defecto de muchos navegadores usan <code>!important</code> en sus declaraciones de estilo  <code>:-webkit-autofill</code> , haciendo que no puedan ser sobrescritos por páginas que no usen trucos JavaScript.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li><a href="https://code.google.com/p/chromium/issues/detail?id=46543">Asunto Chromium 46543: El realce con fondo amarillo de los campos input de texto con valor automático no puede ser deshabilitados.</a></li>
- <li><a href="https://bugs.webkit.org/show_bug.cgi?id=66032">WebKit bug 66032: Permite a los autores sobrescribir los colores de los campos que se rellenan automáticamente.</a></li>
- <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=740979">Mozilla bug 740979: implementar <code>la pseudo-clase :-moz-autofill</code> en elemento input con un valor de relleno automático.</a></li>
-</ul>
diff --git a/files/es/web/css/_colon_any/index.html b/files/es/web/css/_colon_any/index.html
deleted file mode 100644
index 7fe55d57c4..0000000000
--- a/files/es/web/css/_colon_any/index.html
+++ /dev/null
@@ -1,187 +0,0 @@
----
-title: ':any'
-slug: 'Web/CSS/:any'
-tags:
-  - CSS
-  - Experimental
-  - Pseudo-Clase CSS
-  - Referencia
-translation_of: 'Web/CSS/:is'
-translation_of_original: 'Web/CSS/:any'
----
-<div>{{CSSRef}}{{SeeCompatTable}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La <a href="/es/docs/CSS/Pseudo-classes" title="CSS/Pseudo-classes">pseudo-clase</a> <code>:any()</code> permite construir rápidamente conjuntos de selectores similares estableciendo grupos desde los que cualquier elemento incluido coincidirá. Es una alternativa a tener que repetir el selector completo por uno de los elementos que va a variar.</p>
-
-<div class="note"><strong>Nota:</strong> Esta pseudo-clase está en progreso de ser estandarizada en <a class="external" href="http://dev.w3.org/csswg/selectors4/#matches" title="http://dev.w3.org/csswg/selectors4/#matches"><em>Selectores CSS Nivel 4</em></a> bajo el nombre <code>:matches()</code>. Es probable que la sintaxis y el nombre de <code>:-<em>vendor</em>-any()</code> sean cambiados para reflejar el estándar en el futuro próximo.</div>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h3 id="Values" name="Values">Valores</h3>
-
-<dl>
- <dt><code>selector</code></dt>
- <dd>Un selector. Puede ser un selector simple o un selector múltiple, comprendido de <a class="external" href="http://www.w3.org/TR/css3-selectors/#simple-selectors" title="http://www.w3.org/TR/css3-selectors/#simple-selectors">selectores simples de CSS 3</a>, y puede incluir el combinador descendiente.</dd>
-</dl>
-
-<div class="note"><strong>Nota:</strong> Los selectores pueden <strong>no</strong> contener pseudo-elementos , y el combinador único combinador permitido es el de descendientes.</div>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<p>Por ejemplo, el siguiente CSS:</p>
-
-<pre class="brush: css">/* Listas desordenadas a tres (o más) niveles de profundidad que usarán viñeta de cuadrado */
-ol ol ul,     ol ul ul,     ol menu ul,     ol dir ul,
-ol ol menu,   ol ul menu,   ol menu menu,   ol dir menu,
-ol ol dir,    ol ul dir,    ol menu dir,    ol dir dir,
-ul ol ul,     ul ul ul,     ul menu ul,     ul dir ul,
-ul ol menu,   ul ul menu,   ul menu menu,   ul dir menu,
-ul ol dir,    ul ul dir,    ul menu dir,    ul dir dir,
-menu ol ul,   menu ul ul,   menu menu ul,   menu dir ul,
-menu ol menu, menu ul menu, menu menu menu, menu dir menu,
-menu ol dir,  menu ul dir,  menu menu dir,  menu dir dir,
-dir ol ul,    dir ul ul,    dir menu ul,    dir dir ul,
-dir ol menu,  dir ul menu,  dir menu menu,  dir dir menu,
-dir ol dir,   dir ul dir,   dir menu dir,   dir dir dir {
-  list-style-type: square;
-}
-</pre>
-
-<p>Puede ser reemplazado con:</p>
-
-<pre class="brush: css">/* Listas desordenadas a tres (o más) niveles de profundidad que usarán viñeta de cuadrado */
-:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) ul,
-:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) menu,
-:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) dir {
-  list-style-type: square;
-}</pre>
-
-<p>Sin embargo, no se debe usar lo siguiente: (Véase <a href="#Issues_with_performance_and_specificity">la sección de rendimiento</a> abajo.)</p>
-
-<pre class="brush: css">:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) :-moz-any(ul, menu, dir) {
-  list-style-type: square;
-}</pre>
-
-<h2 id="Notes" name="Notes">Notas</h2>
-
-<p>Esto es particularmente útil al tratar con <a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">secciones y encabezados</a> de HTML5. Puesto que {{HTMLElement("section")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, y {{HTMLElement("nav")}} pueden ser anidados, puede ser complicado aplicar estilos sin usar <code>:any()</code>.</p>
-
-<p>Por ejemplo, sin <code>:any()</code>, estilizar todos los {{HTMLElement("h1")}} a diferentes niveles de profundidad podría ser muy complicado:</p>
-
-<pre class="brush: css">/* Nivel 0 */
-h1 {
-  font-size: 30px;
-}
-/* Nivel 1 */
-section h1, article h1, aside h1, nav h1 {
-  font-size: 25px;
-}
-/* Nivelo 2 */
-section section h1, section article h1, section aside h1, section nav h1,
-article section h1, article article h1, article aside h1, article nav h1,
-aside section h1, aside article h1, aside aside h1, aside nav h1,
-nav section h1, nav article h1, nav aside h1, nav nav h1, {
-  font-size: 20px;
-}
-/* Level 3 */
-/* ... ni siquiera lo pienses*/
-</pre>
-
-<p>Usando <code>:-any()</code>, en cambio, es mucho más fácil:</p>
-
-<pre class="brush: css">/* Nivel 0 */
-h1 {
-  font-size: 30px;
-}
-/* Nivel 1 */
-:-moz-any(section, article, aside, nav) h1 {
-  font-size: 25px;
-}
-/* Nivel 2 */
-:-moz-any(section, article, aside, nav)
-:-moz-any(section, article, aside, nav) h1 {
-  font-size: 20px;
-}
-/* Nivel 3 */
-:-moz-any(section, article, aside, nav)
-:-moz-any(section, article, aside, nav)
-:-moz-any(section, article, aside, nav) h1 {
-  font-size: 15px;
-}</pre>
-
-<h3 id="Issues_with_performance_and_specificity" name="Issues_with_performance_and_specificity">Problemas con rendimiento y especificidad</h3>
-
-<p><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=561154" title="https://bugzilla.mozilla.org/show_bug.cgi?id=561154">Bug 561154</a> sigue un problema con Gecko donde la especificidad de <code>:-moz-any()</code> es incorrecta. La implementación hasta Firefox 12 pone a <code>:-moz-any()</code> en la categoría de reglas universales, por lo que usarlo como el selector más hacia la derecha será más lento que usando un ID, una clase o etiqueta como el selector a la derecha.</p>
-
-<p>Por ejemplo</p>
-
-<pre class="brush: css">.a &gt; :-moz-any(.b, .c)
-</pre>
-
-<p>es más lento que:</p>
-
-<pre class="brush: css">.a &gt; .b, .a &gt; .c
-</pre>
-
-<p>y lo siguiente es rápido:</p>
-
-<pre class="brush: css">:-moz-any(.a, .d) &gt; .b, :-moz-any(.a, .d) &gt; .c
-</pre>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatGeckoDesktop("2")}}{{property_prefix("-moz")}}</td>
-   <td>12.0 (534.30){{property_prefix("-webkit")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>5<br>
-    {{property_prefix("-webkit")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}{{property_prefix("-webkit")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>5<br>
-    {{property_prefix("-webkit")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/_colon_autofill/index.html b/files/es/web/css/_colon_autofill/index.html
new file mode 100644
index 0000000000..ef34f51351
--- /dev/null
+++ b/files/es/web/css/_colon_autofill/index.html
@@ -0,0 +1,81 @@
+---
+title: ':-webkit-autofill'
+slug: Web/CSS/:autofill
+tags:
+  - CSS
+  - NeedsExample
+  - No estándar(2)
+  - Pseudo-clase
+  - Referencia
+translation_of: Web/CSS/:-webkit-autofill
+original_slug: Web/CSS/:-webkit-autofill
+---
+<div>{{CSSRef}}{{Non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>La  <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-clase </a>CSS <code>:-webkit-autofill</code> CSS selecciona un elemento {{HTMLElement("input")}} cuando su valor es rellenado automáticamente por el navegador.</p>
+
+<p class="note"><strong>Nota:</strong> La hoja de estilos por defecto de muchos navegadores usan <code>!important</code> en sus declaraciones de estilo  <code>:-webkit-autofill</code> , haciendo que no puedan ser sobrescritos por páginas que no usen trucos JavaScript.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li><a href="https://code.google.com/p/chromium/issues/detail?id=46543">Asunto Chromium 46543: El realce con fondo amarillo de los campos input de texto con valor automático no puede ser deshabilitados.</a></li>
+ <li><a href="https://bugs.webkit.org/show_bug.cgi?id=66032">WebKit bug 66032: Permite a los autores sobrescribir los colores de los campos que se rellenan automáticamente.</a></li>
+ <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=740979">Mozilla bug 740979: implementar <code>la pseudo-clase :-moz-autofill</code> en elemento input con un valor de relleno automático.</a></li>
+</ul>
diff --git a/files/es/web/css/_colon_is/index.html b/files/es/web/css/_colon_is/index.html
new file mode 100644
index 0000000000..0678d86dd3
--- /dev/null
+++ b/files/es/web/css/_colon_is/index.html
@@ -0,0 +1,188 @@
+---
+title: ':any'
+slug: Web/CSS/:is
+tags:
+  - CSS
+  - Experimental
+  - Pseudo-Clase CSS
+  - Referencia
+translation_of: Web/CSS/:is
+translation_of_original: Web/CSS/:any
+original_slug: Web/CSS/:any
+---
+<div>{{CSSRef}}{{SeeCompatTable}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La <a href="/es/docs/CSS/Pseudo-classes" title="CSS/Pseudo-classes">pseudo-clase</a> <code>:any()</code> permite construir rápidamente conjuntos de selectores similares estableciendo grupos desde los que cualquier elemento incluido coincidirá. Es una alternativa a tener que repetir el selector completo por uno de los elementos que va a variar.</p>
+
+<div class="note"><strong>Nota:</strong> Esta pseudo-clase está en progreso de ser estandarizada en <a class="external" href="http://dev.w3.org/csswg/selectors4/#matches" title="http://dev.w3.org/csswg/selectors4/#matches"><em>Selectores CSS Nivel 4</em></a> bajo el nombre <code>:matches()</code>. Es probable que la sintaxis y el nombre de <code>:-<em>vendor</em>-any()</code> sean cambiados para reflejar el estándar en el futuro próximo.</div>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h3 id="Values" name="Values">Valores</h3>
+
+<dl>
+ <dt><code>selector</code></dt>
+ <dd>Un selector. Puede ser un selector simple o un selector múltiple, comprendido de <a class="external" href="http://www.w3.org/TR/css3-selectors/#simple-selectors" title="http://www.w3.org/TR/css3-selectors/#simple-selectors">selectores simples de CSS 3</a>, y puede incluir el combinador descendiente.</dd>
+</dl>
+
+<div class="note"><strong>Nota:</strong> Los selectores pueden <strong>no</strong> contener pseudo-elementos , y el combinador único combinador permitido es el de descendientes.</div>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<p>Por ejemplo, el siguiente CSS:</p>
+
+<pre class="brush: css">/* Listas desordenadas a tres (o más) niveles de profundidad que usarán viñeta de cuadrado */
+ol ol ul,     ol ul ul,     ol menu ul,     ol dir ul,
+ol ol menu,   ol ul menu,   ol menu menu,   ol dir menu,
+ol ol dir,    ol ul dir,    ol menu dir,    ol dir dir,
+ul ol ul,     ul ul ul,     ul menu ul,     ul dir ul,
+ul ol menu,   ul ul menu,   ul menu menu,   ul dir menu,
+ul ol dir,    ul ul dir,    ul menu dir,    ul dir dir,
+menu ol ul,   menu ul ul,   menu menu ul,   menu dir ul,
+menu ol menu, menu ul menu, menu menu menu, menu dir menu,
+menu ol dir,  menu ul dir,  menu menu dir,  menu dir dir,
+dir ol ul,    dir ul ul,    dir menu ul,    dir dir ul,
+dir ol menu,  dir ul menu,  dir menu menu,  dir dir menu,
+dir ol dir,   dir ul dir,   dir menu dir,   dir dir dir {
+  list-style-type: square;
+}
+</pre>
+
+<p>Puede ser reemplazado con:</p>
+
+<pre class="brush: css">/* Listas desordenadas a tres (o más) niveles de profundidad que usarán viñeta de cuadrado */
+:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) ul,
+:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) menu,
+:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) dir {
+  list-style-type: square;
+}</pre>
+
+<p>Sin embargo, no se debe usar lo siguiente: (Véase <a href="#Issues_with_performance_and_specificity">la sección de rendimiento</a> abajo.)</p>
+
+<pre class="brush: css">:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) :-moz-any(ul, menu, dir) {
+  list-style-type: square;
+}</pre>
+
+<h2 id="Notes" name="Notes">Notas</h2>
+
+<p>Esto es particularmente útil al tratar con <a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">secciones y encabezados</a> de HTML5. Puesto que {{HTMLElement("section")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, y {{HTMLElement("nav")}} pueden ser anidados, puede ser complicado aplicar estilos sin usar <code>:any()</code>.</p>
+
+<p>Por ejemplo, sin <code>:any()</code>, estilizar todos los {{HTMLElement("h1")}} a diferentes niveles de profundidad podría ser muy complicado:</p>
+
+<pre class="brush: css">/* Nivel 0 */
+h1 {
+  font-size: 30px;
+}
+/* Nivel 1 */
+section h1, article h1, aside h1, nav h1 {
+  font-size: 25px;
+}
+/* Nivelo 2 */
+section section h1, section article h1, section aside h1, section nav h1,
+article section h1, article article h1, article aside h1, article nav h1,
+aside section h1, aside article h1, aside aside h1, aside nav h1,
+nav section h1, nav article h1, nav aside h1, nav nav h1, {
+  font-size: 20px;
+}
+/* Level 3 */
+/* ... ni siquiera lo pienses*/
+</pre>
+
+<p>Usando <code>:-any()</code>, en cambio, es mucho más fácil:</p>
+
+<pre class="brush: css">/* Nivel 0 */
+h1 {
+  font-size: 30px;
+}
+/* Nivel 1 */
+:-moz-any(section, article, aside, nav) h1 {
+  font-size: 25px;
+}
+/* Nivel 2 */
+:-moz-any(section, article, aside, nav)
+:-moz-any(section, article, aside, nav) h1 {
+  font-size: 20px;
+}
+/* Nivel 3 */
+:-moz-any(section, article, aside, nav)
+:-moz-any(section, article, aside, nav)
+:-moz-any(section, article, aside, nav) h1 {
+  font-size: 15px;
+}</pre>
+
+<h3 id="Issues_with_performance_and_specificity" name="Issues_with_performance_and_specificity">Problemas con rendimiento y especificidad</h3>
+
+<p><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=561154" title="https://bugzilla.mozilla.org/show_bug.cgi?id=561154">Bug 561154</a> sigue un problema con Gecko donde la especificidad de <code>:-moz-any()</code> es incorrecta. La implementación hasta Firefox 12 pone a <code>:-moz-any()</code> en la categoría de reglas universales, por lo que usarlo como el selector más hacia la derecha será más lento que usando un ID, una clase o etiqueta como el selector a la derecha.</p>
+
+<p>Por ejemplo</p>
+
+<pre class="brush: css">.a &gt; :-moz-any(.b, .c)
+</pre>
+
+<p>es más lento que:</p>
+
+<pre class="brush: css">.a &gt; .b, .a &gt; .c
+</pre>
+
+<p>y lo siguiente es rápido:</p>
+
+<pre class="brush: css">:-moz-any(.a, .d) &gt; .b, :-moz-any(.a, .d) &gt; .c
+</pre>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatGeckoDesktop("2")}}{{property_prefix("-moz")}}</td>
+   <td>12.0 (534.30){{property_prefix("-webkit")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>5<br>
+    {{property_prefix("-webkit")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}{{property_prefix("-webkit")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>5<br>
+    {{property_prefix("-webkit")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/_colon_not()/index.html b/files/es/web/css/_colon_not()/index.html
deleted file mode 100644
index 5182d83d77..0000000000
--- a/files/es/web/css/_colon_not()/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: ':not()'
-slug: 'Web/CSS/:not()'
-tags:
-  - CSS
-  - Diseño
-  - Referencia
-  - Web
-  - pseudoclase
-translation_of: 'Web/CSS/:not'
----
-<div>{{CSSRef}}</div>
-
-<p>La <a href="/es/docs/Web/CSS/Pseudo-classes">pseudoclase</a> <strong><code>:not()</code></strong> de <a href="/es/docs/Web/CSS">CSS</a> representa elementos que no coinciden con una lista de selectores. Como evita que se seleccionen elementos específicos, se lo conoce como la <em>pseudoclase de negación</em>.</p>
-
-<pre class="brush: css no-line-numbers notranslate">/* Selecciona cualquier elemento que NO sea un párrafo */
-:not(p) {
-  color: blue;
-}</pre>
-
-<div class="note">
-<p><strong>Notas:</strong></p>
-
-<ul>
- <li>Se pueden escribir selectores inútiles usando esta pseudoclase. Por ejemplo, <code>:not(*)</code> coincide con cualquier elemento que no sea un elemento, por lo que la regla nunca se aplicará.</li>
- <li>Esta pseudoclase puede aumentar la <a href="/es/docs/Web/CSS/Specificity">especificidad</a> de una regla. Por ejemplo, <code>#foo:not(#bar)</code> coincidirá con el mismo elemento que el <code>#foo</code> más simple, pero tiene una especificidad más alta.</li>
- <li><code>:not(.foo)</code> coincidirá con cualquier cosa que no sea <code>.foo</code>, <em>incluidos {{HTMLElement("html")}} y {{HTMLElement("body")}}.</em></li>
- <li>Este selector solo se aplica a un elemento; no puedes usarlo para excluir a todos los antepasados. Por ejemplo, <code>body :not(table) a</code> se aplicará a los enlaces dentro de una tabla, ya que {{HTMLElement("tr")}} coincidirá con la parte <code>:not()</code> del selector.</li>
-</ul>
-</div>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<p>La pseudoclase <code>:not()</code> requiere una lista separada por comas de uno o más selectores como argumento. La lista no debe contener otro selector de negación o un <a href="/es/docs/Web/CSS/Pseudo-elements">pseudoelemento</a>.</p>
-
-<div class="warning">
-<p>La capacidad de enumerar más de un selector es experimental y aún no es ampliamente compatible.</p>
-</div>
-
-<pre class="syntaxbox notranslate">{{csssyntax}}</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html notranslate">&lt;p&gt;Soy un párrafo.&lt;/p&gt;
-&lt;p class="fancy"&gt;¡Soy muy elegante!&lt;/p&gt;
-&lt;div&gt;NO soy un párrafo.&lt;/div&gt;
-</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css notranslate">.fancy {
-  text-shadow: 2px 2px 3px gold;
-}
-
-/* elementos &lt;p&gt; que no están en la clase `.fancy` */
-p:not(.fancy) {
-  color: green;
-}
-
-/* Elementos que no son elementos &lt;p&gt; */
-body :not(p) {
-  text-decoration: underline;
-}
-
-/* Elementos que no son elementos &lt;div&gt; o &lt;span&gt; */
-body :not(div):not(span) {
-  font-weight: bold;
-}
-
-/* Elementos que no son `.crazy` o `.fancy` */
-/* Tenga en cuenta que esta sintaxis aún no está bien soportada. */
-body :not(.crazy, .fancy) {
-  font-family: sans-serif;
-}</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{EmbedLiveSample('Ejemplo')}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS4 Selectors', '#negation', ':not()')}}</td>
-   <td>{{Spec2('CSS4 Selectors')}}</td>
-   <td>Extiende su argumento para permitir algunos selectores no simples.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Selectors', '#negation', ':not()')}}</td>
-   <td>{{Spec2('CSS3 Selectors')}}</td>
-   <td>Definición Inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("css.selectors.not")}}</p>
-</div>
diff --git a/files/es/web/css/_colon_not/index.html b/files/es/web/css/_colon_not/index.html
new file mode 100644
index 0000000000..62142324c8
--- /dev/null
+++ b/files/es/web/css/_colon_not/index.html
@@ -0,0 +1,113 @@
+---
+title: ':not()'
+slug: Web/CSS/:not
+tags:
+  - CSS
+  - Diseño
+  - Referencia
+  - Web
+  - pseudoclase
+translation_of: Web/CSS/:not
+original_slug: Web/CSS/:not()
+---
+<div>{{CSSRef}}</div>
+
+<p>La <a href="/es/docs/Web/CSS/Pseudo-classes">pseudoclase</a> <strong><code>:not()</code></strong> de <a href="/es/docs/Web/CSS">CSS</a> representa elementos que no coinciden con una lista de selectores. Como evita que se seleccionen elementos específicos, se lo conoce como la <em>pseudoclase de negación</em>.</p>
+
+<pre class="brush: css no-line-numbers notranslate">/* Selecciona cualquier elemento que NO sea un párrafo */
+:not(p) {
+  color: blue;
+}</pre>
+
+<div class="note">
+<p><strong>Notas:</strong></p>
+
+<ul>
+ <li>Se pueden escribir selectores inútiles usando esta pseudoclase. Por ejemplo, <code>:not(*)</code> coincide con cualquier elemento que no sea un elemento, por lo que la regla nunca se aplicará.</li>
+ <li>Esta pseudoclase puede aumentar la <a href="/es/docs/Web/CSS/Specificity">especificidad</a> de una regla. Por ejemplo, <code>#foo:not(#bar)</code> coincidirá con el mismo elemento que el <code>#foo</code> más simple, pero tiene una especificidad más alta.</li>
+ <li><code>:not(.foo)</code> coincidirá con cualquier cosa que no sea <code>.foo</code>, <em>incluidos {{HTMLElement("html")}} y {{HTMLElement("body")}}.</em></li>
+ <li>Este selector solo se aplica a un elemento; no puedes usarlo para excluir a todos los antepasados. Por ejemplo, <code>body :not(table) a</code> se aplicará a los enlaces dentro de una tabla, ya que {{HTMLElement("tr")}} coincidirá con la parte <code>:not()</code> del selector.</li>
+</ul>
+</div>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<p>La pseudoclase <code>:not()</code> requiere una lista separada por comas de uno o más selectores como argumento. La lista no debe contener otro selector de negación o un <a href="/es/docs/Web/CSS/Pseudo-elements">pseudoelemento</a>.</p>
+
+<div class="warning">
+<p>La capacidad de enumerar más de un selector es experimental y aún no es ampliamente compatible.</p>
+</div>
+
+<pre class="syntaxbox notranslate">{{csssyntax}}</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html notranslate">&lt;p&gt;Soy un párrafo.&lt;/p&gt;
+&lt;p class="fancy"&gt;¡Soy muy elegante!&lt;/p&gt;
+&lt;div&gt;NO soy un párrafo.&lt;/div&gt;
+</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css notranslate">.fancy {
+  text-shadow: 2px 2px 3px gold;
+}
+
+/* elementos &lt;p&gt; que no están en la clase `.fancy` */
+p:not(.fancy) {
+  color: green;
+}
+
+/* Elementos que no son elementos &lt;p&gt; */
+body :not(p) {
+  text-decoration: underline;
+}
+
+/* Elementos que no son elementos &lt;div&gt; o &lt;span&gt; */
+body :not(div):not(span) {
+  font-weight: bold;
+}
+
+/* Elementos que no son `.crazy` o `.fancy` */
+/* Tenga en cuenta que esta sintaxis aún no está bien soportada. */
+body :not(.crazy, .fancy) {
+  font-family: sans-serif;
+}</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{EmbedLiveSample('Ejemplo')}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS4 Selectors', '#negation', ':not()')}}</td>
+   <td>{{Spec2('CSS4 Selectors')}}</td>
+   <td>Extiende su argumento para permitir algunos selectores no simples.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Selectors', '#negation', ':not()')}}</td>
+   <td>{{Spec2('CSS3 Selectors')}}</td>
+   <td>Definición Inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("css.selectors.not")}}</p>
+</div>
diff --git a/files/es/web/css/_colon_user-invalid/index.html b/files/es/web/css/_colon_user-invalid/index.html
new file mode 100644
index 0000000000..301a1d68d8
--- /dev/null
+++ b/files/es/web/css/_colon_user-invalid/index.html
@@ -0,0 +1,95 @@
+---
+title: ':-moz-ui-invalid'
+slug: Web/CSS/:user-invalid
+tags:
+  - CSS
+  - NeedsExample
+  - NeedsMobileBrowserCompatibility
+  - No estándar(2)
+  - Pseudo clase
+  - Referencia CSS
+translation_of: Web/CSS/:user-invalid
+original_slug: Web/CSS/:-moz-ui-invalid
+---
+<div>{{Non-standard_header}}{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>La  <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-clase </a>CSS <code>:-moz-ui-invalid</code> representa cualquier elemento de los formularios que, en determinadas circunstancias, tiene  <a href="/en-US/docs/Web/Guide/HTML/Forms_in_HTML#Constraint_Validation">restricciones de validación </a>y no es válido. Esta pseudo-clase se aplica siguiendo la siguiente reglas::</p>
+
+<ul>
+ <li>Si el control no tiene el foco y el valor no es válido se aplica la pseudo-clase.</li>
+ <li>Si el control tiene el foco y el valor era válido (incluyendo si es un elemento vacío) cuando obtuvo el foco, no se aplica la pseudo-clase.</li>
+ <li>Si el control tiene el foco y el valor no era válido cuando obtuvo el foco, se recalcula la validez del valor con cada pulsación de teclado.</li>
+ <li>Si el elemento es obligatorio (requerido) sólo se aplican las reglas anteriores si el usuario ha cambiado el valor o ha intentando enviar los datos del formulario (hacer un "sbumit").</li>
+</ul>
+
+<p>El resultado es que si el control era válido cuando el usuario empezó a interactuar con él sólo se cambia el estilo de validación cuando el usuario cambia el foco hacia otro elemento. Sin embargo, si el usuario está corrigiendo un valor señalado anteriormente como no válido, el control muestra inmediatamente cuando el valor pasa a ser válido. A los elementos del formulario obligatorios se les aplica la pseudo-clase sólo si el usuario los cambia o si intenta enviar los datos del formulario (hacer "submit").</p>
+
+<p>Por defecto Gecko aplica un estilo que crear un brillo rojo "glow" (usando la propiedad{{Cssxref("box-shadow")}} ) alrededor de los elemento a los que se les aplica esta pseudo-clase. Ver la pseudo-clase {{Cssxref(":invalid")}} para poder observar un ejemplo que muestra como evitar este estilo por defecto.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop(2)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>{{cssxref(":valid")}}</li>
+ <li>{{cssxref(":invalid")}}</li>
+ <li>{{cssxref(":required")}}</li>
+ <li>{{cssxref(":optional")}}</li>
+ <li>{{cssxref(":-moz-ui-valid")}}</li>
+</ul>
diff --git a/files/es/web/css/_doublecolon_-moz-placeholder/index.html b/files/es/web/css/_doublecolon_-moz-placeholder/index.html
deleted file mode 100644
index 3c8fbb8c3a..0000000000
--- a/files/es/web/css/_doublecolon_-moz-placeholder/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: '::-moz-placeholder'
-slug: 'Web/CSS/::-moz-placeholder'
-tags:
-  - CSS
-  - No estándar(2)
-  - Pseudo-elemento CSS
-  - Referencia CSS
-translation_of: 'Web/CSS/::placeholder'
-translation_of_original: 'Web/CSS/::-moz-placeholder'
----
-<div>{{Non-standard_header}}{{CSSRef}}</div>
-
-<div class="note"><strong>Nota:</strong> El pseudo-elemento <code>::-moz-placeholder</code> fue creado como sustituto de la pseudo-clase {{cssxref(':-moz-placeholder')}} que fue depreciada a partir de la versión de 19 de Firefox.</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El  <a href="/es/docs/Web/CSS/Pseudo-elements">pseudo-elemento </a><code>::-moz-placeholder</code> sirve para seleccionar cualquier elemento de un formulario que esté mostrando un  <a href="/es/docs/Web/HTML/Forms_in_HTML#The_placeholder_attribute">marcador de posición de texto (placeholder text) </a>. Permite a los desarrolladores web y a los diseñadores de tema personalizar la apariencia de estos elementos, cuyo estilo por defecto es de color gris claro. Puede que no funcione correctamente si se cambia el color de fondo de los campos de los formularios para que sean, por ejemplo, de un color similar, así que en ese caso se puede usar este pseudo-elemento para cambiar el color del marcador de posición de texto (placeholder text).</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>En este ejemplo se da estilo al marcador de posición del texto (placeholder text) haciendo que el color del texto sea verde (green).</p>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush:html">&lt;input id="test" placeholder="Placeholder text!"&gt;
-</pre>
-
-<h3 id="Contenido_CSS">Contenido CSS</h3>
-
-<pre class="brush:css">input::-moz-placeholder {
-  color: green;
-}
-</pre>
-
-<p>Obtendremos el siguiente resultado:</p>
-
-<p>{{EmbedLiveSample("Example")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("19.0")}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Firefox OS</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("19.0")}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Firefox aplica un estilo por defecto de  <code>{{cssxref("opacity")}}: 0.54</code> al marcador de posición del texto (placeholder). Ver {{Bug("556145")}}. La mayoría de los demás navegadores importante no comparten este estilo ni para el pseudo-elemento ni para la pseudo-clase.</p>
-
-<p>La implementación previa en el motor Gecko era como la pseudo-clase  {{cssxref(":-moz-placeholder")}}. Ver {{Bug("737786")}}.</p>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li>{{cssxref("::placeholder")}}</li>
- <li>{{cssxref("::-webkit-input-placeholder")}}</li>
- <li>{{cssxref(":-ms-input-placeholder")}}</li>
- <li><a href="/es/docs/Web/HTML/Forms_in_HTML">Formularios en HTML</a></li>
- <li>{{HTMLElement("input")}}</li>
- <li>{{HTMLElement("textarea")}}</li>
-</ul>
diff --git a/files/es/web/css/_doublecolon_-webkit-file-upload-button/index.html b/files/es/web/css/_doublecolon_-webkit-file-upload-button/index.html
deleted file mode 100644
index 5d14e35e58..0000000000
--- a/files/es/web/css/_doublecolon_-webkit-file-upload-button/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: '::-webkit-file-upload-button'
-slug: 'Web/CSS/::-webkit-file-upload-button'
-tags:
-  - CSS
-  - No estándar(2)
-  - Pseudo-elemento
-  - Referencia
-translation_of: 'Web/CSS/::file-selector-button'
----
-<div>{{CSSRef}}{{Non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El <a href="/es/docs/Web/CSS/Pseudo-elements">pseudo-elemento</a>  <a href="/es/docs/Web/CSS">CSS</a> <strong><code>::-webkit-file-upload-button</code></strong>  representa el botón de los elementos {{HTMLElement("input") }} con  <code>type="file"</code>.</p>
-
-<p>No es estándar y es sólo soportado por los navegadores compatibles con WebKit/Blink como Chrome, Opera and Safari (esto queda indicado por el prefijo <code>-webkit</code> ).</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox"><var>selector</var>::-webkit-file-upload-button
-</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush: html">&lt;form&gt;
-    &lt;label for="fileUpload"&gt;Upload file&lt;/label&gt;&lt;br&gt;
-    &lt;input type="file" id="fileUpload"&gt;
-&lt;/form&gt;</pre>
-
-<h3 id="Contenido_CSS">Contenido CSS</h3>
-
-<pre class="brush: css">input, label {
-    display: block;
-}
-
-input[type=file]::-webkit-file-upload-button {
-    border: 1px solid grey;
-    background: #FFFAAA;
-}</pre>
-
-<p>Más abajo tienes un ejemplo para probar. El pantallazo a la izquierda muestra como quedaría el botón en caso de que no puedas acceder a Chrome, Opera o Safari. </p>
-
-<p>{{ EmbedLiveSample('Example', '', '', 'https://mdn.mozillademos.org/files/13400/webkit_file_upload_button_screen.png', 'Web/CSS/::-webkit-file-upload-button') }}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación. Es un pseudo-elemento propietario y específico de WebKit/Blink.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Android</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/_doublecolon_-webkit-input-placeholder/index.html b/files/es/web/css/_doublecolon_-webkit-input-placeholder/index.html
deleted file mode 100644
index 181f0a966c..0000000000
--- a/files/es/web/css/_doublecolon_-webkit-input-placeholder/index.html
+++ /dev/null
@@ -1,86 +0,0 @@
----
-title: '::-webkit-input-placeholder'
-slug: 'Web/CSS/::-webkit-input-placeholder'
-tags:
-  - CSS
-  - NeedsExample
-  - No estándar(2)
-  - Pseudo-elemento
-  - Pseudo-elemento CSS
-  - Referencia
-  - Referencia CSS
-translation_of: 'Web/CSS/::placeholder'
-translation_of_original: 'Web/CSS/::-webkit-input-placeholder'
----
-<div>{{Non-standard_header}}{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El  <a href="/es/docs/Web/CSS/Pseudo-elements">pseudo-elemento</a> no estándar y propietario <code>::-webkit-input-placeholder</code> representa el <a href="/es/docs/Web/HTML/Forms_in_HTML#The_placeholder_attribute">marcador de posición de texto (placeholder text)</a> de un elemento formulario. Permite que desarrolladores y diseñadores de temas puedan personalizar este marcador de posición de texto (placeholder). Sólo está soportado por WebKit/Blink.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación. Es un pseudo-elemento propietario y específico de WebKit/Blink.</p>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Firefox OS</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li>{{cssxref("::placeholder")}}</li>
- <li>{{cssxref("::-moz-placeholder")}}</li>
- <li>{{cssxref(":-ms-input-placeholder")}}</li>
- <li><a href="/es/docs/Web/HTML/Forms_in_HTML">Formularios en HTML</a></li>
- <li>{{HTMLElement("input")}}</li>
- <li>{{HTMLElement("textarea")}}</li>
-</ul>
diff --git a/files/es/web/css/_doublecolon_file-selector-button/index.html b/files/es/web/css/_doublecolon_file-selector-button/index.html
new file mode 100644
index 0000000000..f818f44b7c
--- /dev/null
+++ b/files/es/web/css/_doublecolon_file-selector-button/index.html
@@ -0,0 +1,101 @@
+---
+title: '::-webkit-file-upload-button'
+slug: Web/CSS/::file-selector-button
+tags:
+  - CSS
+  - No estándar(2)
+  - Pseudo-elemento
+  - Referencia
+translation_of: Web/CSS/::file-selector-button
+original_slug: Web/CSS/::-webkit-file-upload-button
+---
+<div>{{CSSRef}}{{Non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El <a href="/es/docs/Web/CSS/Pseudo-elements">pseudo-elemento</a>  <a href="/es/docs/Web/CSS">CSS</a> <strong><code>::-webkit-file-upload-button</code></strong>  representa el botón de los elementos {{HTMLElement("input") }} con  <code>type="file"</code>.</p>
+
+<p>No es estándar y es sólo soportado por los navegadores compatibles con WebKit/Blink como Chrome, Opera and Safari (esto queda indicado por el prefijo <code>-webkit</code> ).</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox"><var>selector</var>::-webkit-file-upload-button
+</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush: html">&lt;form&gt;
+    &lt;label for="fileUpload"&gt;Upload file&lt;/label&gt;&lt;br&gt;
+    &lt;input type="file" id="fileUpload"&gt;
+&lt;/form&gt;</pre>
+
+<h3 id="Contenido_CSS">Contenido CSS</h3>
+
+<pre class="brush: css">input, label {
+    display: block;
+}
+
+input[type=file]::-webkit-file-upload-button {
+    border: 1px solid grey;
+    background: #FFFAAA;
+}</pre>
+
+<p>Más abajo tienes un ejemplo para probar. El pantallazo a la izquierda muestra como quedaría el botón en caso de que no puedas acceder a Chrome, Opera o Safari. </p>
+
+<p>{{ EmbedLiveSample('Example', '', '', 'https://mdn.mozillademos.org/files/13400/webkit_file_upload_button_screen.png', 'Web/CSS/::-webkit-file-upload-button') }}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación. Es un pseudo-elemento propietario y específico de WebKit/Blink.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/adjacent_sibling_combinator/index.html b/files/es/web/css/adjacent_sibling_combinator/index.html
new file mode 100644
index 0000000000..23549e7557
--- /dev/null
+++ b/files/es/web/css/adjacent_sibling_combinator/index.html
@@ -0,0 +1,136 @@
+---
+title: Selectores de hermanos adyacentes
+slug: Web/CSS/Adjacent_sibling_combinator
+tags:
+  - CSS
+  - NeedsMobileBrowserCompatibility
+  - Referencia CSS
+  - Selectores
+translation_of: Web/CSS/Adjacent_sibling_combinator
+original_slug: Web/CSS/Selectores_hermanos_adyacentes
+---
+<p>{{CSSRef("Selectors")}}</p>
+
+<p>Se hace referencia a este selector como selector adyacente o selector del próximo hermano. Sólo seleccionará un elemento especificado que esté inmediatamente después de otro elemento especificado.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">elemento_anterior + elemento_afectado { <em>estilos</em> }
+</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<div id="Example_1">
+<pre class="brush: css">li:first-of-type + li {
+  color: red;
+}
+</pre>
+
+<pre class="brush: html">&lt;ul&gt;
+  &lt;li&gt;Uno&lt;/li&gt;
+  &lt;li&gt;Dos&lt;/li&gt;
+  &lt;li&gt;Tres&lt;/li&gt;
+&lt;/ul&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample('Example_1', 200, 100)}}</p>
+
+<p>Otro caso podría ser dar estilos a un span que se use de pie de foto de los siguientes elementos {{HTMLElement("img")}} :</p>
+
+<pre class="brush: css">img + span.caption {
+  font-style: italic;
+}
+</pre>
+
+<p>que coincidiría con los siguientes elementos {{HTMLElement("span")}} :</p>
+
+<pre class="brush: html">&lt;img src="photo1.jpg"&gt;&lt;span class="caption"&gt;The first photo&lt;/span&gt;
+&lt;img src="photo2.jpg"&gt;&lt;span class="caption"&gt;The second photo&lt;/span&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS4 Selectors', '#adjacent-sibling-combinators', 'next-sibling combinator')}}</td>
+   <td>{{Spec2('CSS4 Selectors')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Selectors', '#adjacent-sibling-combinators', 'Adjacent sibling combinator')}}</td>
+   <td>{{Spec2('CSS3 Selectors')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS2.1', 'selector.html#adjacent-selectors', 'Adjacent sibling selectors')}}</td>
+   <td>{{Spec2('CSS2.1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>7.0<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>2.1</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Internet Explorer 7 no actualiza correctamente el estilo cuando un elemento es insertado dinámicamente antes de otro elemento que coincidía con el selector. En Internet Explorer 8, si un elemento es insertado dinámicamente haciendo click en un enlace, el estilo del <code>first-child</code> no se aplica hasta que el enlace pierde el foco.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Selectores de hermanos generales</a></li>
+</ul>
diff --git a/files/es/web/css/attribute_selectors/index.html b/files/es/web/css/attribute_selectors/index.html
new file mode 100644
index 0000000000..e5c94bedeb
--- /dev/null
+++ b/files/es/web/css/attribute_selectors/index.html
@@ -0,0 +1,242 @@
+---
+title: Selectores de atributo
+slug: Web/CSS/Attribute_selectors
+tags:
+  - Atributos
+  - CSS
+  - Selectores
+  - Selectores de Atributo
+translation_of: Web/CSS/Attribute_selectors
+original_slug: Web/CSS/Selectores_atributo
+---
+<div>{{CSSRef}}</div>
+
+<p>El <strong>selector de atributos</strong> CSS coincide con los elementos en función de la presencia o el valor de un atributo determinado.</p>
+
+<pre class="brush: css no-line-numbers">/* Elementos &lt;a&gt; con un atributo title */
+a[title] {
+  color: purple;
+}
+
+/* Elementos &lt;a&gt; con un href que coincida con "https://example.org" */
+a[href="https://example.org"] {
+  color: green;
+}
+
+/* Elementos &lt;a&gt; con un href que contenga "example" */
+a[href*="example"] {
+  font-size: 2em;
+}
+
+/* Elementos &lt;a&gt; con un href que comience con "#" */
+a[href^="#"] {
+  color: #001978;
+}
+
+/* Elementos &lt;a&gt; con un href que termine en ".org" */
+a[href$=".org"] {
+  font-style: italic;
+}
+
+/* Elementos &lt;a&gt; cuyo atributo class contenga la palabra "logo" */
+a[class~="logo"] {
+  padding: 2px;
+}
+</pre>
+
+<dl>
+ <dt><code>[<em>attr</em>]</code></dt>
+ <dd>Selecciona los elementos que tienen el atributo <em>attr</em>.</dd>
+ <dt><code>[<em>attr</em>=<em>value</em>]</code></dt>
+ <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga exactamente el valor <em>value</em>.</dd>
+ <dt><code>[<em>attr</em>~=<em>value</em>]</code></dt>
+ <dd>
+ <p>Selecciona los elementos cuyo atributo <em>attr</em> tenga por valor una lista de palabras separadas por espacios, una de las cuales sea <em>value</em>.</p>
+ </dd>
+ <dt><code>[<em>attr</em>|=<em>value</em>]</code></dt>
+ <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga exactamente el valor <em>value</em> o empiece por <em>value</em> seguido de un guión <code>-</code> (U+002D). Se puede usar para coincidencias de subcódigos en otros idiomas.</dd>
+ <dt><code>[<em>attr</em>^=<em>value</em>]</code></dt>
+ <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga un valor prefijado  por <em>value</em>.</dd>
+ <dt><code>[<em>attr</em>$=<em>value</em>]</code></dt>
+ <dd>Selecciona los elementos cuyo atributo <em>attr</em> cuyo valor tiene el sufijo (seguido) de <em>value</em>.</dd>
+ <dt><code>[<em>attr</em>*=<em>value</em>]</code></dt>
+ <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga un valor que contenga <em>value</em>.</dd>
+ <dt id="case-insensitive"><code>[<em>attr</em> <em>operator</em> <em>value</em> i]</code></dt>
+ <dd>Agregar una <code>i</code> (o <code>I</code>) antes del corchete de cierre hace que el valor sea comparado sin distinguir entre mayúsculas y minúsculas (para caracteres dentro del rango ASCII).</dd>
+ <dt id="case-insensitive"><code>[<em>attr</em> <em>operator</em> <em>value</em> s]</code> {{Experimental_Inline}}</dt>
+ <dd>Agregar una <code>s</code> (o <code>S</code>) antes del corchete de cierre hace que el valor sea comparado distinguiendo entre mayúsculas y minúsculas (para caracteres dentro del rango ASCII).</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Enlaces">Enlaces</h3>
+
+<h4 id="CSS">CSS</h4>
+
+<pre class="brush: css">a {
+  color: blue;
+}
+
+/* Enlaces internos, comenzando con "#" */
+a[href^="#"] {
+  background-color: gold;
+}
+
+/* Enlaces con "example" en cualquier parte de la URL */
+a[href*="example"] {
+  background-color: silver;
+}
+
+/* Enlaces con "insensitive" en cualquier parte de la URL,
+   independientemente de las mayúsculas */
+a[href*="insensitive" i] {
+  color: cyan;
+}
+
+/* Enlaces que terminan en ".org" */
+a[href$=".org"] {
+  color: red;
+}
+</pre>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="brush: html">&lt;ul&gt;
+  &lt;li&gt;&lt;a href="#internal"&gt;Enlace interno&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="http://example.com"&gt;Enlace de ejemplo&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#InSensitive"&gt;Enlace interno insensible Insensitive&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="http://example.org"&gt;Ejemplo de enlace .org&lt;/a&gt;&lt;/li&gt;
+&lt;/ul&gt;</pre>
+
+<h4 id="Resultado">Resultado</h4>
+
+<p>{{EmbedLiveSample('Enlaces')}}</p>
+
+<h3 id="Idiomas">Idiomas</h3>
+
+<h4 id="CSS_2">CSS</h4>
+
+<pre class="brush: css">/* Todos los divs con un atributo `lang` están en negrita. */
+div[lang] {
+  font-weight: bold;
+}
+
+/* Todos los divs en inglés de EE. UU. son azules. */
+div[lang~="en-us"] {
+  color: blue;
+}
+
+/* Todos los divs en portugués son verdes. */
+div[lang="pt"] {
+  color: green;
+}
+
+/* Todos los divs en chino son rojos, ya sean
+   simplificados (zh-CN) o tradicionales (zh-TW). */
+div[lang|="zh"] {
+  color: red;
+}
+
+/* Todos los divs con `data-lang` Traditional Chinese
+   son de color púrpura. */
+/* Nota: también puede usar atributos con guiones
+   sin comillas dobles */
+div[data-lang="zh-TW"] {
+  color: purple;
+}
+</pre>
+
+<h4 id="HTML_2">HTML</h4>
+
+<pre class="brush: html">&lt;div lang="en-us en-gb en-au en-nz"&gt;Hello World!&lt;/div&gt;
+&lt;div lang="pt"&gt;Olá Mundo!&lt;/div&gt;
+&lt;div lang="zh-CN"&gt;世界您好！&lt;/div&gt;
+&lt;div lang="zh-TW"&gt;世界您好！&lt;/div&gt;
+&lt;div data-lang="zh-TW"&gt;?世界您好！&lt;/div&gt;
+</pre>
+
+<h4 id="Resultado_2">Resultado</h4>
+
+<p>{{EmbedLiveSample('Idiomas')}}</p>
+
+<h3 id="Listas_Ordenadas">Listas Ordenadas</h3>
+
+<p>{{SeeCompatTable}}</p>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">La especificación HTML requiere que el atributo </span></span>{{htmlattrxref("type", "input")}}<span class="tlid-translation translation" lang="es"><span title=""> distinga entre mayúsculas y minúsculas debido a que se usa principalmente en el elemento </span></span>{{HTMLElement("input")}}<span class="tlid-translation translation" lang="es"><span title="">, tratando de usar selectores de atributos con el atributo </span></span>{{htmlattrxref("type", "ol")}}<span class="tlid-translation translation" lang="es"><span title=""> de una </span></span>{{HTMLElement("ol", "lista ordenada")}}<span class="tlid-translation translation" lang="es"><span title=""> no funciona sin el modificador de mayúsculas y minúsculas</span><span title="">.</span></span></p>
+
+<h4 id="CSS_3">CSS</h4>
+
+<pre class="brush: css line-numbers language-css"><code class="language-css"><span class="comment token">/*
+Los tipos de lista requieren poder distinguir entre mayúsculas
+y minúsculas debido al peculiar comportamiento que tiene HTML
+con el atributo "type"
+*/
+</span>
+<span class="selector token">ol<span class="attribute token"><span class="punctuation token">[</span><span class="attribute token">type</span><span class="operator token">=</span><span class="token value">"a"</span><span class="punctuation token">]</span></span></span> <span class="punctuation token">{</span>
+  <span class="property token">list-style-type</span><span class="punctuation token">:</span> lower-alpha<span class="punctuation token">;</span>
+  <span class="property token">background</span><span class="punctuation token">:</span> red<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token">ol<span class="attribute token"><span class="punctuation token">[</span><span class="attribute token">type</span><span class="operator token">=</span><span class="token value">"a"</span> <span class="case-sensitivity keyword token">s</span><span class="punctuation token">]</span></span></span> <span class="punctuation token">{</span>
+  <span class="property token">list-style-type</span><span class="punctuation token">:</span> lower-alpha<span class="punctuation token">;</span>
+  <span class="property token">background</span><span class="punctuation token">:</span> lime<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="selector token">ol<span class="attribute token"><span class="punctuation token">[</span><span class="attribute token">type</span><span class="operator token">=</span><span class="token value">"A"</span> <span class="case-sensitivity keyword token">s</span><span class="punctuation token">]</span></span></span> <span class="punctuation token">{</span>
+  <span class="property token">list-style-type</span><span class="punctuation token">:</span> upper-alpha<span class="punctuation token">;</span>
+  <span class="property token">background</span><span class="punctuation token">:</span> lime<span class="punctuation token">;</span>
+<span class="punctuation token">}</span></code></pre>
+
+<h4 id="HTML_3">HTML</h4>
+
+<pre class="brush: html; line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>ol</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>A<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>li</span><span class="punctuation token">&gt;</span></span>Example list<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>li</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>ol</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<h4 id="Result">Result</h4>
+
+<p>{{EmbedLiveSample("HTML_ordered_lists")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS4 Selectors', '#attribute-selectors', 'attribute selectors')}}</td>
+   <td>{{Spec2('CSS4 Selectors')}}</td>
+   <td>Agrega un modificador para la selección de valores de atributos insensibles a mayúsculas / minúsculas ASCII.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Selectors', '#attribute-selectors', 'attribute selectors')}}</td>
+   <td>{{Spec2('CSS3 Selectors')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS2.1', 'selector.html#attribute-selectors', 'attribute selectors')}}</td>
+   <td>{{Spec2('CSS2.1')}}</td>
+   <td>Definición Inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("css.selectors.attribute")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Seleccionando un solo elemento:{{domxref("Document.querySelector()")}}, {{domxref("DocumentFragment.querySelector()")}}, o {{domxref("Element.querySelector()")}}</li>
+ <li>Seleccionar todos los elementos coincidentes:{{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}}, o {{domxref("Element.querySelectorAll()")}}</li>
+ <li>Todos los métodos anteriores se implementan en base a {{domxref("ParentNode")}} mixin; vea  {{domxref("ParentNode.querySelector()")}} y {{domxref("ParentNode.querySelectorAll()")}}</li>
+</ul>
diff --git a/files/es/web/css/auto/index.html b/files/es/web/css/auto/index.html
deleted file mode 100644
index c380b1b891..0000000000
--- a/files/es/web/css/auto/index.html
+++ /dev/null
@@ -1,50 +0,0 @@
----
-title: auto
-slug: Web/CSS/auto
-tags:
-  - CSS
-  - 'CSS:Referencias'
-  - Todas_las_Categorías
-translation_of: Web/CSS/width
-translation_of_original: Web/CSS/auto
----
-<p>
-</p><p>&lt;&lt; <a href="es/Gu%c3%ada_de_referencia_de_CSS">Volver</a>
-</p>
-<h3 id="Resumen" name="Resumen"> Resumen </h3>
-<p>Un valor computado automáticamente por el 'useragent.'
-</p><p>Usando el valor <i>auto</i> en cualquier propiedad, dejamos al navegador que calcule el valor requerido. </p><p><br>
-FIXME
-</p>
-<h3 id="Ejemplos" name="Ejemplos"> Ejemplos </h3>
-<pre class="eval">div {
-   height: 600px;
-   border: 1px solid #000;
-}
-</pre>
-<pre class="eval">div img {
-   height: auto;
-   border: 1px solid red;
-}
-</pre>
-<h3 id="Se_utiliza_en" name="Se_utiliza_en"> Se utiliza en </h3>
-<ul><li> {{ Cssxref("overflow") }}
-</li><li> {{ Cssxref("cursor") }}
-</li><li> {{ Cssxref("width") }}
-</li><li> {{ Cssxref("marker-offset") }}
-</li><li> {{ Cssxref("margin") }}
-</li><li> margin-* (left|bottom|top|right|start|end)
-</li><li> {{ Cssxref("bottom") }}
-</li><li> {{ Cssxref("left") }}
-</li><li> {{ Cssxref("table-layout") }}
-</li><li> {{ Cssxref("z-index") }}
-</li><li> {{ Cssxref("-moz-column-width") }}
-</li></ul>
-<p><br>
-</p>
-<div class="noinclude">
-<p><span class="comment">Categorías</span>
-<span class="comment">Interwiki Languages</span>
-</p>
-</div>
-{{ languages( { "en": "en/CSS/auto" } ) }}
diff --git a/files/es/web/css/box-flex/index.html b/files/es/web/css/box-flex/index.html
new file mode 100644
index 0000000000..2a1dbe9a13
--- /dev/null
+++ b/files/es/web/css/box-flex/index.html
@@ -0,0 +1,156 @@
+---
+title: '-moz-box-flex'
+slug: Web/CSS/box-flex
+tags:
+  - CSS
+  - No estándar(2)
+  - Referencia CSS
+translation_of: Web/CSS/box-flex
+original_slug: Web/CSS/-moz-box-flex
+---
+<div>{{CSSRef}}{{warning("Esta propiedad es para controlar parte del modelo de caja XUL. No coincide ni con el antiguo borrador del módulo CSS para el diseño de caja flexibles  '<code>box-flex</code>' (que se basa en esta propiedad) ni con el comportamiento de '<code>-webkit-box-flex</code>' (que se basa en esos borradores).")}}</div>
+
+<p>Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes">Flexbox</a> para más información acerca de qué usar en vez de esta propiedad.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Las propiedades <a href="/en-US/docs/Web/CSS">CSS</a><code>-moz-box-flex</code> y <code>-webkit-box-flex</code> especifican cómo una  <code>-moz-box</code> o <code>-webkit-box</code> crecen para rellenar la caja que los contienen, en la dirección del diseño o esquema (layout) de la caja contenedora.Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes">Flexbox</a> para más información sobre las propiedades de los elementos flexbox.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="brush:css">/* Valores &lt;number&gt; */
+-moz-box-flex: 0;
+-moz-box-flex: 3;
+-webkit-box-flex: 0;
+-webkit-box-flex: 3;
+
+/* Valores gloables */
+-moz-box-flex: inherit;
+-moz-box-flex: initial;
+-moz-box-flex: unset;
+</pre>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt>0</dt>
+ <dd>La caja no crece.</dd>
+ <dt>&gt; 0</dt>
+ <dd>La caja crece para rellenar un proporción del espacio disponible..</dd>
+</dl>
+
+<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;Ejemplo de -moz-box-flex&lt;/title&gt;
+    &lt;style&gt;
+      div.example {
+        display: -moz-box;
+        display: -webkit-box;
+        border: 1px solid black;
+        width: 100%;
+      }
+      div.example &gt; p:nth-child(1) {
+        -moz-box-flex: 1;       /* Mozilla */
+        -webkit-box-flex: 1;    /* WebKit */
+        border: 1px solid black;
+      }
+      div.example &gt; p:nth-child(2) {
+        -moz-box-flex: 0;       /* Mozilla */
+        -webkit-box-flex: 0;    /* WebKit */
+        border: 1px solid black;
+      }
+    &lt;/style&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;div class="example"&gt;
+      &lt;p&gt;Creceré para rellenar un espacio extra&lt;/p&gt;
+      &lt;p&gt;No creceré&lt;/p&gt;
+    &lt;/div&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>La caja contenedora asigna el espacio extra disponible de manera proporcional al valor flex de cada uno de los elementos que contiene.</p>
+
+<p>Los elementos dentro del contenedor que tienen 0 flex no crecen.</p>
+
+<p>Si śolo uno de los elementos tiene un valor distinto de cero ocupará todo el espacio disponible.</p>
+
+<p>Los elementos que tienen el mismo valor para flex crecen en la misma cantidad en términos absolutos.</p>
+
+<p>Si el valor flex se ha establecido usando el atributo flex del elemento, entonces el estilo es ignorado.</p>
+
+<p>Para hacer que los elementos XUL dentro de una caja contenedora tengan el mismo tamaño, fijaremos el atributo <code>equalsize </code>de la caja contenedora a <code>always</code>. Este atributo no tiene correspondencia con ninguna propiedad CSS.</p>
+
+<p>Un truco para hacer que todos los elementos dentro una caja contenedora tengan el mismo tamaño es darles un tamaño fijo,(por ejemplo <code>height: 0</code>), y el mismo valor box-flex mayor que cero a todos (por ejemplo <code>-moz-box-flex: 1</code>).</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>Esta propiedad es una extensión no estándar. Había una <a class="external" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/">old draft of the CSS3 Flexbox specification</a> que definía una propiedad<code>box-flex</code> , pero ese borrador nunca ha sido sustituido.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<p>{{cssxref("-moz-box-orient")}}, {{cssxref("-moz-box-pack")}}, {{cssxref("-moz-box-direction")}}, {{cssxref("flex")}}</p>
diff --git a/files/es/web/css/box-ordinal-group/index.html b/files/es/web/css/box-ordinal-group/index.html
new file mode 100644
index 0000000000..0d89a0ee99
--- /dev/null
+++ b/files/es/web/css/box-ordinal-group/index.html
@@ -0,0 +1,68 @@
+---
+title: '-moz-box-ordinal-group'
+slug: Web/CSS/box-ordinal-group
+tags:
+  - CSS
+  - 'CSS: Extensiones Mozilla'
+  - Caja Flexible
+  - No estandar
+  - Referencia CSS
+translation_of: Web/CSS/box-ordinal-group
+translation_of_original: Web/CSS/-moz-box-ordinal-group
+original_slug: Web/CSS/-moz-box-ordinal-group
+---
+<p>{{CSSRef}}<br>
+ {{warning("Esta propiedad pertenece al borrador original del diseño o esquema de la caja CSS flexible, y ha sido reemplazada en borradores posteriores.")}}</p>
+
+<p>Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes" title="/en/CSS/Flexible_boxes">Flexbox</a> para más información sobre qué usar en sustitución de esta propiedad.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Indica el grupo ordinal al que pertenece el elemento. Aquellos elementos con un grupo ordinal menor son mostrados antes que aquellos con un grupo ordinal mayor.</p>
+
+<h2 id="Valores">Valores</h2>
+
+<p>Los valores deben ser enteros positivos (mayores de cero). El valor por defecto para esta propiedad es 1.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;style type="text/css"&gt;
+  #Flexbox {
+    display: -ms-box;
+    display: -moz-box;
+    display: -webkit-box;
+  }
+
+  #text1 {
+    background: red;
+    -ms-box-ordinal-group: 4;
+    -moz-box-ordinal-group: 4;
+    -webkit-box-ordinal-group: 4;
+  }
+
+  #text2 {
+    background: green;
+    -ms-box-ordinal-group: 3;
+    -moz-box-ordinal-group: 3;
+    -webkit-box-ordinal-group: 3;
+  }
+
+  #text3 {
+    background: blue;
+    -ms-box-ordinal-group: 2;
+    -moz-box-ordinal-group: 2;
+    -webkit-box-ordinal-group: 2;
+  }
+
+  #text4 {
+    background: orange;
+  }
+&lt;/style&gt;
+
+&lt;div id="Flexbox"&gt;
+  &lt;div id="text1"&gt;text 1&lt;/div&gt;
+  &lt;div id="text2"&gt;text 2&lt;/div&gt;
+  &lt;div id="text3"&gt;text 3&lt;/div&gt;
+  &lt;div id="text4"&gt;text 4&lt;/div&gt;
+&lt;/div&gt;
+</pre>
diff --git a/files/es/web/css/box-pack/index.html b/files/es/web/css/box-pack/index.html
new file mode 100644
index 0000000000..12baf166a2
--- /dev/null
+++ b/files/es/web/css/box-pack/index.html
@@ -0,0 +1,185 @@
+---
+title: '-moz-box-pack'
+slug: Web/CSS/box-pack
+tags:
+  - CSS
+  - Diseño
+  - No estándar(2)
+  - Propiedad CSS
+  - Referencia CSS
+translation_of: Web/CSS/box-pack
+original_slug: Web/CSS/-moz-box-pack
+---
+<div>{{CSSRef}}{{warning("Esta propiedad es parte del módulo estándar original para el diseño de las cajas CSS Flexible que fue sustituida por un nuevo estándar.")}}</div>
+
+<p>Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes">Flexbox</a> para más información.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Las propiedades  <a href="/en-US/docs/Web/CSS">CSS </a><code>-moz-box-pack</code> y <code>-webkit-box-pack</code> especifican cómo una <code>-moz-box</code> o un <code>-webkit-box</code> empaquetan o disponen  su contenido en la dirección de su diseño o esquema. El efecto de esto sólo es visible si hay expacio extra en la caja. Ver <a href="/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes#Flexible_box_properties">Flexbox</a> para más información sobre las propiedades de los elementos flexbox.</p>
+
+<p>La dirección del esquema o diseño (layout)  depende de la orientación del elemento: vertical o horizontal.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="brush:css">/* Valores de palabras clave */
+-moz-box-pack: start;
+-moz-box-pack: center;
+-moz-box-pack: end;
+-moz-box-pack: justify;
+
+/* Valores gloables */
+-moz-box-pack: inherit;
+-moz-box-pack: initial;
+-moz-box-pack: unset;
+</pre>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt><code>start</code></dt>
+ <dd>La caja empaqueta o muestra el contenido al principio dejando el espacio libre que hubiera al final.</dd>
+ <dt><code>center</code></dt>
+ <dd>La caja empaqueta o muestra el contenido en el centro dejando el espacio libre que hubiera dividido de igual manera entre el inicio y el final.</dd>
+ <dt><code>end</code></dt>
+ <dd>La caja empaqueta o muestra el contenido al final dejando el espacio libre que hubiera al principio.</dd>
+ <dt><code>justify</code></dt>
+ <dd>El espacio se divide de igual manera entre los diferentes hijos sin dejar nada del espacio libre ni antes del primer hijo ni después del último. Si sólo hay un hijo el comportamiento es como si fuera <code>start</code>.</dd>
+</dl>
+
+<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: css">div.example {
+  border-style: solid;
+
+  display: -moz-box; /* Mozilla */
+  display: -webkit-box; /* WebKit */
+
+  /* Hace esta caja más alta que los hijos para que haya hueco suficiente
+     para el empaquetado en la caja */
+  height: 300px;
+  /* Hace la caja lo suficientemente ancha para mostrar los contenidos
+     centrados horizontalmente */
+  width: 300px;
+
+  /* Los hijos deberían estar orientados verticalmente */
+  -moz-box-orient: vertical; /* Mozilla */
+  -webkit-box-orient: vertical; /* WebKit */
+
+  /* Alínea los hijos con el centro horizontal de la caja */
+  -moz-box-align: center; /* Mozilla */
+  -webkit-box-align: center; /* WebKit */
+
+  /* Dispone a los hijos en el fondo de la caja */
+  -moz-box-pack: end;             /* Mozilla */
+  -webkit-box-pack: end;          /* WebKit */
+}
+
+div.example p {
+  /* hace los hijos más estrechos que el padra para que
+     haya espacio suficiente para el box-align */
+  width: 200px;
+}
+</pre>
+
+<pre class="brush: html">&lt;div class="example"&gt;
+  &lt;p&gt;Será el segundo empezando desde el fondo de div.example y centrado horizontalmente.&lt;/p&gt;
+  &lt;p&gt;Estaré en el fondo de div.example y centrado horizontalmente.&lt;/p&gt;
+&lt;/div&gt;
+</pre>
+
+<p>{{EmbedLiveSample('Examples', 310, 310)}}</p>
+
+<h2 id="Notas">Notas</h2>
+
+<p>EL borde  de la caja que será tomado como <em>start</em>  para el empqeutado dependerá de la orientación y dirección de la caja:</p>
+
+<table class="standard-table" style="text-align: center;">
+ <tbody>
+  <tr>
+   <th> </th>
+   <th><strong>Normal</strong></th>
+   <th><strong>Reverse</strong></th>
+  </tr>
+  <tr>
+   <th style="text-align: right;"><strong>Horizontal</strong></th>
+   <td>left</td>
+   <td>right</td>
+  </tr>
+  <tr>
+   <th style="text-align: right;"><strong>Vertical</strong></th>
+   <td>top</td>
+   <td>bottom</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>El borde opuesto a start será el considerado como <em>end</em>.</p>
+
+<p>Si el empaquetado se establece usando el atributo <code>pack</code> del elemento el estilo es ignorado.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>Esta propiedad es no estándar aunque una propiedad similar apareción en <a class="external" href="http://www.w3.org/TR/2009/WD-css3-flexbox-20090723/">draft of CSS3 Flexbox</a>,  que a su vez ha sido sustituida para nuevas versiones de la especificación.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<p>{{cssxref("box-orient")}}, {{cssxref("box-direction")}}, {{cssxref("box-align")}}</p>
diff --git a/files/es/web/css/column-gap/index.html b/files/es/web/css/column-gap/index.html
new file mode 100644
index 0000000000..faa728b9c7
--- /dev/null
+++ b/files/es/web/css/column-gap/index.html
@@ -0,0 +1,159 @@
+---
+title: grid-column-gap
+slug: Web/CSS/column-gap
+translation_of: Web/CSS/column-gap
+translation_of_original: Web/CSS/grid-column-gap
+original_slug: Web/CSS/grid-column-gap
+---
+<p>La propiedad CSS <strong><code>grid-column-gap</code></strong> especifica el {{glossary("gutters","gutter")}} entre {{glossary("grid columns")}}.</p>
+
+<pre class="brush: css no-line-numbers">/* &lt;length&gt; values */
+grid-column-gap: 20px;
+grid-column-gap: 1em;
+grid-column-gap: 3vmin;
+grid-column-gap: 0.5cm;
+
+/* &lt;percentage&gt; value */
+grid-column-gap: 10%;
+
+/* Global values */
+grid-column-gap: inherit;
+grid-column-gap: initial;
+grid-column-gap: unset;
+</pre>
+
+<p>El efecto es como si las {{glossary("grid lines")}} afectadas adquieren una anchura específica: Los {{glossary("grid tracks", "grid track")}} entre dos líneas de la cuadrícula es el espacio entre los canales que las representa. Para el tamaño de la pista, cada canal se trata esencialmente como una pista adicional del tamaño especificado. Los valores negativos no son válidos.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt><code>&lt;length-percentage&gt;</code></dt>
+ <dd>Es el ancho del canal que separa las columnas de la grilla. {{cssxref("&lt;percentage&gt;")}} valores son relativos a la dimensión del elemento.</dd>
+</dl>
+
+<h3 id="Sintaxis_formal">Sintaxis formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div id="grid"&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+&lt;/div&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css; highlight[6]">#grid {
+  display: grid;
+  height: 100px;
+  grid-template-columns: repeat(3, 1fr);
+  grid-template-rows: 100px;
+  grid-column-gap: 20px;
+}
+
+#grid &gt; div {
+  background-color: lime;
+}
+</pre>
+
+<p>{{EmbedLiveSample("Example", "100%", "100px")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Grid", "#propdef-grid-column-gap", "grid-column-gap")}}</td>
+   <td>{{Spec2("CSS3 Grid")}}</td>
+   <td>Definición incial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p> </p>
+
+
+
+<p>{{Compat("css.properties.grid-column-gap")}}</p>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Propiedades CSS relacionadas: {{cssxref("grid-row-gap")}}, {{cssxref("grid-gap")}}</li>
+ <li>Guía sobre CSS Grid Layout: <em><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout#Gutters">Conceptos básicos sobre CSS Grid Layout - Gutters</a></em></li>
+</ul>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li><a href="/en-US/docs/Web/CSS"><strong>CSS</strong></a></li>
+ <li><strong> <a href="/en-US/docs/Web/CSS/Reference">Referencia CSS</a></strong></li>
+ <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">Diseño CSS Grid</a></li>
+ <li data-default-state="open"><a href="#"><strong>Guías</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Conceptos básicos sobre Diseño CSS Grid </a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relación con otros métodos de diseño</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Posicionamiento basado en línea</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Grid template areas</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Layout using named grid lines</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Auto-placement in grid layout</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box alignment in grid layout</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Grids, logical values and writing modes</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout and Accessibility</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout and Progressive Enhancement</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Realizing common layouts using grids</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Propiedades</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Web/CSS/grid">grid</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-area">grid-area</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column">grid-column</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-gap">grid-gap</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row">grid-row</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template">grid-template</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template-columns">grid-template-colunms</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Glosario</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Glossary/Grid_lines">Grid lines</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_tracks">Grid tracks</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_cell">Grid cell</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_areas">Grid areas</a></li>
+   <li><a href="/en-US/docs/Glossary/Gutters">Gutters</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_rows">Grid row</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_column">Grid column</a></li>
+  </ol>
+ </li>
+</ol>
+</section>
diff --git a/files/es/web/css/columnas_css/index.html b/files/es/web/css/columnas_css/index.html
deleted file mode 100644
index 949f2eca71..0000000000
--- a/files/es/web/css/columnas_css/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: Columnas CSS
-slug: Web/CSS/Columnas_CSS
-tags:
-  - CSS
-  - Referencia CSS
-  - Visión general
-translation_of: Web/CSS/CSS_Columns
----
-<div>{{CSSRef}}</div>
-
-<p><strong>Columnas CSS</strong> es un módulo de CSS que define un diseño multicolumna, permitiendo indicar cómo debe fluir el contenido a través de las columnas y cómo manejar reglas y separaciones.</p>
-
-<h2 id="Referencia">Referencia</h2>
-
-<h3 id="Propiedades_CSS">Propiedades CSS</h3>
-
-<div class="index">
-<ul>
- <li>{{cssxref("break-after")}}</li>
- <li>{{cssxref("break-before")}}</li>
- <li>{{cssxref("break-inside")}}</li>
- <li>{{cssxref("column-count")}}</li>
- <li>{{cssxref("column-fill")}}</li>
- <li>{{cssxref("column-gap")}}</li>
- <li>{{cssxref("column-rule")}}</li>
- <li>{{cssxref("column-rule-color")}}</li>
- <li>{{cssxref("column-rule-style")}}</li>
- <li>{{cssxref("column-rule-width")}}</li>
- <li>{{cssxref("column-span")}}</li>
- <li>{{cssxref("column-width")}}</li>
- <li>{{cssxref("columns")}}</li>
-</ul>
-</div>
-
-<h2 id="Guías">Guías</h2>
-
-<dl>
- <dt><a href="/es/docs/Columnas_con_CSS-3">Diseños multicolumna con CSS</a></dt>
- <dd>Tutorial paso a paso sobre cómo desarrollar diseños de varias columnas.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Multicol')}}</td>
-   <td>{{Spec2('CSS3 Multicol')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}} {{property_prefix('-webkit')}}</td>
-   <td>{{CompatGeckoDesktop(9)}}{{property_prefix('-moz')}}</td>
-   <td>10</td>
-   <td>11.10<br>
-    15{{property_prefix('-webkit')}}</td>
-   <td>3.0 (522){{property_prefix('-webkit')}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.1{{property_prefix('-webkit')}}</td>
-   <td>{{compatGeckoMobile(22)}}{{property_prefix('-moz')}}</td>
-   <td>10</td>
-   <td>11.5<br>
-    32{{property_prefix('-webkit')}}</td>
-   <td>3.2{{property_prefix('-webkit')}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/comentarios/index.html b/files/es/web/css/comentarios/index.html
deleted file mode 100644
index f09cac662a..0000000000
--- a/files/es/web/css/comentarios/index.html
+++ /dev/null
@@ -1,49 +0,0 @@
----
-title: Comentarios
-slug: Web/CSS/Comentarios
-tags:
-  - CSS
-  - Principiante
-  - Referencia CSS
-translation_of: Web/CSS/Comments
----
-<div>{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Los comentarios son usados para añadir notas explicatorias o prevenir que el navegador interprete partes de la hoja de estilos.</p>
-
-<p>Los comentarios se pueden colocar en cualquier espacio en blanco que se permita en la hoja de estilos.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">/* Comentario */</pre>
-
-<h2 id="Examples">Examples</h2>
-
-<pre class="brush:css">/* Comentario de una sola línea */
-
-/*
-Un comentario
-que se extiende
-en varias
-líneas
-*/
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>La sintaxis de comentarios <code>/* */</code> es usada para comentarios de una o múltiples líneas. No hay otra forma de especificar comentarios en hojas de estilos externas. Sin embargo, cuando se usa el elemento <code>&lt;style&gt;</code>, se puede usar <code>&lt;!-- --&gt;</code> para ocultar CSS para navegadores antiguos, aunque no es recomendable. Como en la mayoría de los lenguajes de programación que usan la sintaxis de comentarios <code>/* */</code> estos no pueden ser anidados. En otras palabras, la primera instancia de <code>*/</code> que siga a una instancia de <code>/*</code> cerrará el comentario.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<ul>
- <li><a href="http://www.w3.org/TR/CSS21/syndata.html#comments">CSS 2.1 Syntax and basic data types #comments</a></li>
-</ul>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/Referencia_CSS">Referencia CSS</a></li>
- <li>{{CSS_key_concepts}}</li>
-</ul>
diff --git a/files/es/web/css/comenzando_(tutorial_css)/index.html b/files/es/web/css/comenzando_(tutorial_css)/index.html
deleted file mode 100644
index 54997a5f6e..0000000000
--- a/files/es/web/css/comenzando_(tutorial_css)/index.html
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: Comenzando (tutorial CSS)
-slug: Web/CSS/Comenzando_(tutorial_CSS)
----
-<p> </p>
-<h2 id="Introducción">Introducción</h2>
-<p>Este tutorial te introducirá en las Hojas de Estilo en Cascada (CSS).</p>
-<p>Este tutorial te guiará a través de las características básicas de CSS con ejemplos prácticos que puedes probar tu mismo desde tu computadora. Está dividido en dos partes.</p>
-<ul> <li>La Parte I ilustra las características estándares de CSS que funcionan con los navegadores de Mozilla así como también con la mayoría de navegadores modernos.</li>
-</ul>
-<ul> <li>La Parte II contiene algunos ejemplos de características básicas que funcionan en Mozilla pero no necesariamente funciona en otros entornos.</li>
-</ul>
-<p>Este tutorial se base en la <a class=" external" href="http://www.w3.org/TR/CSS21/" title="http://www.w3.org/TR/CSS21/">especificación CSS 2.1</a></p>
-<h3 id="¿Quienes_deberían_usar_este_tutorial">¿Quienes deberían usar este tutorial?</h3>
-<p>Este tutorial es principalmente para principiantes en CSS, pero también puedes usarlo si tienes alguna experiencia con CSS.</p>
-<p>Si eres un principiante en CSS, usa la Parte I de este tutorial para entender y aprender como usar CSS. Luego usa la Parte II para entender el alcance de CSS en Mozilla.</p>
-<p>Si conoces algo de CSS, puedes saltarte las partes del tutorial que ya conozcas, y solo usar las partes que te interesan.</p>
-<p>Si tienes experiencia con CSS pero no con Mozilla, puedes saltarte a la Parte II.</p>
-<h3 id="¿Qué_necesitas_antes_de_empezar">¿Qué necesitas antes de empezar?</h3>
-<p>Para obtener el mayor provecho de este tutorial, necesitas un editor para archivos de texto, especialmente para la Parte II, un navegador de Mozilla (Firefox, Camino o SeaMonkey). También debes saber como usarlos de forma básica.</p>
-<p>Si no quieres editar archivos, puedes solo leer el tutorial y ver las imágenes, pero es una forma menos efectiva de aprender.</p>
-<p>Algunas partes de este tutorial requieren otros programas de Mozilla. Estas partes son opcionales. Si no quieres descargar otros programas de Mozilla, puedes saltarte estas partes.</p>
-<ul> <li><a href="/en/DOM_Inspector" title="en/DOM Inspector">DOM Inspector</a></li>
-</ul>
-<p><strong>Nota: </strong> CSS provee formas de trabajar con color, así que partes de este tutorial dependen del color. Puedes usar estas partes del tutorial fácilmente si tienes una pantalla a color y puedes visualizar normalmente los colores.</p>
-<h3 id="Como_usar_este_tutorial">Como usar este tutorial</h3>
-<p>Para usar este tutorial, lee las páginas cuidadosamente y en secuencia. Si te pierdes alguna página, entonces puedes tener dificultades para entender las páginas siguientes.</p>
-<p>En cada página, usa la sección <em>Información</em> para entender como funciona CSS. Usa la sección <em>Acción</em> para tratar de usar CSS en tu computadora.</p>
-<p>Para probar tu entendimiento, toma los retos al final de cada página. Las soluciones a los retos están enlazados bajo los mismos retos, así que no necesitas mirar las respuestas si no quieres hacerlo.</p>
-<p>Para entender CSS con mayor profundidad, lee la información que encuentres en las cajas subtituladas <em>Más detalles</em>. Usa los enlaces allí para encontrar información de referencia acerca de CSS.</p>
-<h2 id="Tutorial_Parte_I">Tutorial Parte I</h2>
-<p>Una guía de CSS paso a paso.</p>
-<ol> <li><strong><a href="/es/CSS/Getting_Started/Que_es_css" title="es/CSS/Getting_Started/Que_es_css">Que es CSS</a></strong></li> <li><a href="/es/CSS/Getting_Started/Por_que_usar_css" title="es/CSS/Getting_Started/Por_que_usar_css"><strong>Por qué usar CSS</strong></a></li> <li><a href="/es/CSS/Getting_Started/Como_funciona_css" title="es/CSS/Getting_Started/Como_funciona_css"><strong>Como funciona CSS</strong></a></li> <li><strong><a href="/es/CSS/Getting_Started/Cascada_y_herencia" title="es/CSS/Getting_Started/Cascada_y_herencia">Cascada y herencia</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Selectores" title="es/CSS/Getting_Started/Selectores">Selectores</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/CSS_legible" title="es/CSS/Getting_Started/CSS_legible">CSS legible</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Estilos_de_texto" title="es/CSS/Getting_Started/Estilos_de_texto">Estilos de texto</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Color" title="es/CSS/Getting_Started/Color">Color</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Contenido" title="es/CSS/Getting_Started/Contenido">Contenido</a> </strong></li> <li><strong><a href="/es/CSS/Getting_Started/Listas" title="es/CSS/Getting_Started/Listas">Listas</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Cajas" title="es/CSS/Getting_Started/Cajas">Cajas</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Estructura" title="es/CSS/Getting_Started/Estructura">Estructura</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Tablas" title="es/CSS/Getting_Started/Tablas">Tablas</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Media" title="es/CSS/Getting_Started/Media">Media</a></strong></li>
-</ol>
-<h2 id="Tutorial_Parte_II">Tutorial Parte II</h2>
-<p>Ejemplos que muestran el alcance de CSS usado con otras tecnologías web y de Mozilla.</p>
-<ol> <li><strong><a href="/es/CSS/Getting_Started/Javascript" title="es/CSS/Getting_Started/Javascript">JavaScript</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Graficos_svg" title="es/CSS/Getting_Started/Graficos_svg">Gráficos SVG</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/Data_xml" title="es/CSS/Getting_Started/Data_xml">Data XML</a></strong></li> <li><strong><a href="/es/CSS/Getting_Started/XBL_bindings" title="es/CSS/Getting_Started/XBL_bindings">XBL bindings</a> </strong></li> <li><strong><a href="/es/CSS/Getting_Started/Interfaces_de_usuario_XUL" title="es/CSS/Getting_Started/Interfaces_de_usuario_XUL">Interfaces de usuario XUL</a></strong></li>
-</ol>
-<p>{{ CSSTutorialTOC() }}</p>
-<p>{{ languages( { "es": "es/CSS/Introducción", "de": "de/CSS/Einführung", "fr": "fr/CSS/Premiers_pas", "it": "it/Conoscere_i_CSS", "ja": "ja/CSS/Getting_Started", "nl": "nl/CSS/Voor_Beginners", "pl": "pl/CSS/Na_pocz\u0105tek", "pt": "pt/CSS/Como_come\u00e7ar", "zh-cn": "cn/CSS/\u5f00\u59cb" } ) }}</p>
diff --git a/files/es/web/css/comments/index.html b/files/es/web/css/comments/index.html
new file mode 100644
index 0000000000..492c7dda76
--- /dev/null
+++ b/files/es/web/css/comments/index.html
@@ -0,0 +1,50 @@
+---
+title: Comentarios
+slug: Web/CSS/Comments
+tags:
+  - CSS
+  - Principiante
+  - Referencia CSS
+translation_of: Web/CSS/Comments
+original_slug: Web/CSS/Comentarios
+---
+<div>{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Los comentarios son usados para añadir notas explicatorias o prevenir que el navegador interprete partes de la hoja de estilos.</p>
+
+<p>Los comentarios se pueden colocar en cualquier espacio en blanco que se permita en la hoja de estilos.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">/* Comentario */</pre>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush:css">/* Comentario de una sola línea */
+
+/*
+Un comentario
+que se extiende
+en varias
+líneas
+*/
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>La sintaxis de comentarios <code>/* */</code> es usada para comentarios de una o múltiples líneas. No hay otra forma de especificar comentarios en hojas de estilos externas. Sin embargo, cuando se usa el elemento <code>&lt;style&gt;</code>, se puede usar <code>&lt;!-- --&gt;</code> para ocultar CSS para navegadores antiguos, aunque no es recomendable. Como en la mayoría de los lenguajes de programación que usan la sintaxis de comentarios <code>/* */</code> estos no pueden ser anidados. En otras palabras, la primera instancia de <code>*/</code> que siga a una instancia de <code>/*</code> cerrará el comentario.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<ul>
+ <li><a href="http://www.w3.org/TR/CSS21/syndata.html#comments">CSS 2.1 Syntax and basic data types #comments</a></li>
+</ul>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/Referencia_CSS">Referencia CSS</a></li>
+ <li>{{CSS_key_concepts}}</li>
+</ul>
diff --git a/files/es/web/css/como_iniciar/index.html b/files/es/web/css/como_iniciar/index.html
deleted file mode 100644
index facb250cb3..0000000000
--- a/files/es/web/css/como_iniciar/index.html
+++ /dev/null
@@ -1,5 +0,0 @@
----
-title: Como iniciar
-slug: Web/CSS/Como_iniciar
----
-This page was auto-generated because a user created a sub-page to this page.
diff --git a/files/es/web/css/como_iniciar/por_que_usar_css/index.html b/files/es/web/css/como_iniciar/por_que_usar_css/index.html
deleted file mode 100644
index 941f96a0e5..0000000000
--- a/files/es/web/css/como_iniciar/por_que_usar_css/index.html
+++ /dev/null
@@ -1,107 +0,0 @@
----
-title: Por que usar CSS
-slug: Web/CSS/Como_iniciar/Por_que_usar_CSS
-translation_of: Learn/CSS/First_steps/How_CSS_works
-translation_of_original: Web/Guide/CSS/Getting_started/Why_use_CSS
----
-<p> </p>
-<p>Esta página explica por qué los documentos usan CSS. Usas CSS para añadir una hoja de estilos a tu documento de prueba.</p>
-<p>Esta es la segunda sección del <a href="/es/CSS/Introducción" title="../../../../es/CSS/Introducci%C3%B3n">tutorial</a>.</p>
-<p>Sección anterior: <a href="/es/CSS/Como_iniciar/Que_es_CSS" title="es/CSS/Como_iniciar/Que_es_CSS">Que es CSS</a><br>
- Sección siguiente: <a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting Started/How CSS works">How CSS works</a></p>
-<h2 id="Información_¿Por_qué_usar_CSS">Información: ¿Por qué usar CSS?</h2>
-<p>CSS ayuda a mantener la información de contenido de un documento separado de los detalles de como mostrarlo. Los detalles de como se muestra el documento son conocidos como <em>estilos. </em>Si mantienes los estilos separados del contenido puedes:</p>
-<ul>
- <li>Evitar duplicación</li>
- <li>Hacer el mantenimiento más simple</li>
- <li>Usar el mismo contenido con diferentes estilos para diferentes propositos.</li>
-</ul>
-<table>
- <caption>
-  Ejemplo</caption>
- <tbody>
-  <tr>
-   <td>
-    <p>Tu sitio web podría mostrar miles de páginas que se ven similar. Usando CSS, almacenas la información de estilos en archivos comunes que todas las páginas comparten.Cuando un usuario visualiza una página web, el navegador carga la información de estilos junto con el contenido de la página.</p>
-    <p>Cuando un usuario imprime una página web, podrías proveerle diferente información de estilos que hace que las páginas impresas sean fáciles de leer.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-<p>En general con HTML, usas el lenguaje de marcado para describir la información del contenido del documento, no sus estilos. Usas CSS para especificar sus estilos, no su contenido. (Más adelante en este tutorial, verás algunas excepciones a este acuerdo).</p>
-<table>
- <caption>
-  Más detalles</caption>
- <tbody>
-  <tr>
-   <td>
-    <p>Un lenguaje de marcado como HTML también provee algunas maneras de especificar estilos.</p>
-    <p>Por ejemplo en HTML puedes usar una etiqueta <code>&lt;b&gt; </code>para hacer acentuar el texto, y puedes especificar un color de fondo de la página en la etiqueta <code>&lt;body&gt;</code>.</p>
-    <p>Cuando usas CSS, normalmente evitas usar estas características del lenguaje de marcado así toda la información de estilos de tu documento está en un solo lugar.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Acción_Creando_una_hoja_de_estilos">Acción: Creando una hoja de estilos</h2>
-<ol>
- <li>Crea un archivo de texto en el mismo directorio anterior.  Este archivo será tu hoja de estilos. Nombrala como: <code>style1.css</code></li>
- <li>En tu archivo CSS, copia y pega esta única línea, luego graba el archivo:</li>
- <li>
-  <div>
-   <pre class="eval">strong {color: red;}
-</pre>
-  </div>
- </li>
-</ol>
-<h3 id="Enlazando_tu_documento_a_tu_hoja_de_estillos">Enlazando tu documento a tu hoja de estillos</h3>
-<ol>
- <li>Para enlazar tu documento a tu hoja de estilos, edita tu archivo HTML. Añade la línea acentuada aquí:</li>
- <li>
-  <div>
-   <pre class="eval">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
-"<span class="nowiki">http://www.w3.org/TR/html4/strict.dtd</span>"&gt;
-&lt;html&gt;
-  &lt;head&gt;
-  &lt;meta http-equiv="Content-Type" content="text/html;
-charset=iso-8859-1"&gt;
-  &lt;title&gt;Sample document&lt;/title&gt;
-  <strong>&lt;link rel="stylesheet" type="text/css" href="style1.css"&gt;</strong>
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;p&gt;
-      &lt;strong&gt;C&lt;/strong&gt;ascading
-      &lt;strong&gt;S&lt;/strong&gt;tyle
-      &lt;strong&gt;S&lt;/strong&gt;heets
-    &lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-  </div>
- </li>
- <li>Graba el archivo y refresca la pantalla del navegador. Esta hoja de estilos hace que las letras inicales sean rojas, como esto:
-  <table>
-   <tbody>
-    <tr>
-     <td><strong>C</strong>ascading <strong>S</strong>tyle <strong>S</strong>heets</td>
-    </tr>
-   </tbody>
-  </table>
- </li>
-</ol>
-<table>
- <caption>
-  Reto</caption>
- <tbody>
-  <tr>
-   <td>En adición al rojo, CSS permite algunos otros nombres de colores.
-    <p>Sin mirar la referencia, encuentra cinco o más nombres de colores que funcionen en tu hoja de estilos.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-<p><a href="/en/CSS/Getting_Started/Challenge_solutions#Why_use_CSS_colors" title="en/CSS/Getting Started/Challenge solutions#Why use CSS colors">See a solution for the challenge.</a> Ver la solución al reto.</p>
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-<p>Si tienes alguna dificultad entendiendo esta página, o si tienes comentarios acerca de la misma, por favor contribuye en esta página de <a href="/Talk:en/CSS/Getting_Started/Why_use_CSS%3f" title="Talk:en/CSS/Getting_Started/Why_use_CSS%3f">Discusión</a>.</p>
-<p>Ahora que tienes un archivo de ejemplo enlazado a una hoja de estilos separada, estás listo para aprender más acerca de como tu navegador combina ellos cuando muestra el documento: <a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting_Started/How_CSS_works">Como funciona CSS</a>.</p>
-<p>{{ CSSTutorialTOC() }}</p>
-<p>{{ languages( { "fr": "fr/CSS/Premiers_pas/Pourquoi_utiliser_CSS", "it": "it/Conoscere_i_CSS/Perch\u00e9_usare_i_CSS", "ja": "ja/CSS/Getting_Started/Why_use_CSS", "pl": "pl/CSS/Na_pocz\u0105tek/Po_co_u\u017cywa\u0107_CSS", "pt": "pt/CSS/Como_come\u00e7ar/Porque_usar_CSS", "es": "es/CSS/Como_iniciar/Por_que_usar_CSS", "zh-cn": "cn/CSS/Getting_Started/Why_use_CSS" } ) }}</p>
diff --git a/files/es/web/css/como_iniciar/que_es_css/index.html b/files/es/web/css/como_iniciar/que_es_css/index.html
deleted file mode 100644
index 18852f2439..0000000000
--- a/files/es/web/css/como_iniciar/que_es_css/index.html
+++ /dev/null
@@ -1,146 +0,0 @@
----
-title: Que es CSS
-slug: Web/CSS/Como_iniciar/Que_es_CSS
-tags:
-  - para_revisar
-translation_of: Learn/CSS/First_steps/How_CSS_works
-translation_of_original: Web/Guide/CSS/Getting_started/What_is_CSS
----
-<p>En esta página se explica que es CSS. Usted creará un documento simple con el cual trabajará en las próximas páginas del tutorial.</p>
-
-<p>Esta es la primera sección del tutorial <a href="/es/CSS/Introducción" title="es/CSS/Introducción">Como iniciar</a>.<br>
- Siguiente sección: <a href="/es/docs/CSS/Como_iniciar/Por_que_usar_CSS" title="en/CSS/Getting Started/Why use CSS">Por qué usar CSS</a></p>
-
-<h2 id="Información_¿Qué_es_CSS">Información: ¿Qué es CSS?</h2>
-
-<p>Cascading Style Sheets (<dfn><abbr title="Cascading Style Sheets">CSS</abbr></dfn>), traducido literalmente al español, como <em>Hojas de estilo en cascada</em>, es un lenguaje para especificar cómo los documentos se presentan a los usuarios.</p>
-
-<p>Un <em>documento (document)</em> es una colección de información que está estructurada utilizando un <em>lenguaje de formato (markup language)</em>.</p>
-
-<table style="background-color: #fffff4; border: 1px solid #3366bb; margin-bottom: 1em; padding: 1em;">
- <caption>Ejemplos</caption>
- <tbody>
-  <tr>
-   <td>
-    <ul>
-     <li>Una página web como la que estás leyendo, es un documento.<br>
-      La información que ves en una página web usualmente está estructurada utilizando el lenguaje de formato de documentos de HiperTexto, HTML (HyperText Markup Language).</li>
-    </ul>
-
-    <ul>
-     <li>Un cuadro de diálogo en una aplicación Mozilla es un documento.<br>
-      Los controles de interfaz de usuario que pude ver en los diálogos de control de aplicaciones Mozilla, están estructurados utilizando el lenguaje de formato XUL (XML User-interface Language - Lenguaje XML de interfaces de usuario).</li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>En este tutorial, los cuadros con titulo <strong>Más detalles</strong>, como el que está a continuación, contienen información adicional. Si se cuenta con poco tiempo para progresar con el tutorial, entonces pude omitir estos cuadros, quizás retorne a leerlos luego. De lo contrario léalos cuando llegue a ellos y tal vez siga los enlaces que contienen para aprender más.</p>
-
-<table style="background-color: #f4f4f4; border: 1px solid #3366bb; margin-bottom: 1em; padding: 1em;">
- <caption>Más detalles</caption>
- <tbody>
-  <tr>
-   <td>
-    <p>Un documento no es lo mismo que un archivo. Y este puede o no estar almacenado en un archivo.</p>
-
-    <p>Por ejemplo, el documento esta leyendo en este momento no está almacenado en un archivo. Cuando su navegador web solicita esta página, el servidor consulta a la base de datos y genera el documento, obteniendo las partes del mismo de diferentes archivos. Sin embargo, en este tutorial se trabajará con documentos que se almacenan en archivos.</p>
-
-    <p>Para más información acerca de documentos y lenguajes de formato, visite otras partes de este sitio web—por ejemplo:</p>
-
-    <table style="background-color: inherit; margin-left: 2em;">
-     <tbody>
-      <tr>
-       <td><a href="/en/HTML" title="en/HTML">HTML</a></td>
-       <td>para páginas web</td>
-      </tr>
-      <tr>
-       <td><a href="/en/XML" title="en/XML">XML</a></td>
-       <td>para documentos estrucurados, en general</td>
-      </tr>
-      <tr>
-       <td><a href="/en/SVG" title="en/SVG">SVG</a></td>
-       <td>para gráficas</td>
-      </tr>
-      <tr>
-       <td><a href="/en/XUL" title="en/XUL">XUL</a></td>
-       <td>para interfaces de usuario de Mozilla</td>
-      </tr>
-     </tbody>
-    </table>
-
-    <p>En la parte II de este tutorial podrá ver ejemplos de estos lenguajes de formato.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p><em>Presentar</em> un documento a un usuario significa convertirlo en una forma en que el humano pueda hacer uso de el. Mozilla está diseñado para presentar documentos de manera visual—por ejemplo, en la pantalla de una computadora, en un proyector o en una impresora.</p>
-
-<table style="background-color: #f4f4f4; border: 1px solid #3366bb; margin-bottom: 1em; padding: 1em;">
- <caption>Más detalles</caption>
- <tbody>
-  <tr>
-   <td>CSS no es sólo para los navegadores web, y no sólo para la presentación visual. En terminos formales CSS, el programa que presenta un documento a un usuario es llamado un <em>agente de usuarios</em> (UA - User Agent). Un navegador es sólo un tipo de UA. Sin embargo, en la parte I de este tutorial, se trabajará únicamente con CSS en un navegador.
-    <p>Para algunas de las definiciones formales de la terminología relacionda con CSS, consulte el enlace <a class="external" href="http://www.w3.org/TR/CSS21/conform.html#q1">Definiciones</a> (en ingles) en la especificación CSS.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Acción_Crear_un_documento">Acción: Crear un documento</h2>
-
-<ol>
- <li>Utilice su computador para crear un nuevo directorio y un nuevo archivo de texto allí. El archivo contendrá el documento.
-  <ol>
-   <li>Copie y pegue el código HTML que se muestra a continuación. Guarde el archivo con el nombre <code>doc1.html</code>
-
-    <div style="width: 40em;">
-    <pre class="deki-transform">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
-"http://www.w3.org/TR/html4/strict.dtd"&gt;
-&lt;html&gt;
-  &lt;head&gt;
-  &lt;meta http-equiv="Content-Type" content="text/html;
-  charset=iso-8859-1"&gt;
-  &lt;title&gt;Sample document&lt;/title&gt;
-  &lt;/head&gt;
-
-  &lt;body&gt;
-    &lt;p&gt;
-      &lt;strong&gt;C&lt;/strong&gt;ascading
-      &lt;strong&gt;S&lt;/strong&gt;tyle
-      &lt;strong&gt;S&lt;/strong&gt;heets
-      &lt;strong&gt;B&lt;/strong&gt;heets
-    &lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-    </div>
-   </li>
-  </ol>
- </li>
- <li>En el navegador web, abra una nueva pestaña o una nueva ventana, y abra el archivo allí.
-  <p>Debe observar un texto con las letras iniciales en negrita, así:</p>
-
-  <table style="border: 2px outset #3366bb; padding: 1em;">
-   <tbody>
-    <tr>
-     <td><strong>C</strong>ascading <strong>S</strong>tyle <strong>S</strong>heets</td>
-    </tr>
-   </tbody>
-  </table>
-
-  <p>Lo que ve en el navegador puede no lucir exactamente como en la imagen, debido a la configuración de su navegador web y esta wiki. Si existen algunas diferencias en el tipo de fuente, espaciado y los colores que ve, no son importantes.</p>
- </li>
-</ol>
-
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-
-<p>Si ha tenido dificultad para entender esta página, o si tiene comentarios acerca de ella, por favor contribuya con esta en la página de <a href="/Talk:en/CSS/Getting_Started/What_is_CSS%3f" title="Talk:en/CSS/Getting_Started/What_is_CSS?">Discusiones</a>.</p>
-
-<p>El documento aún no utiliza CSS. En la siguiente página se utilizará CSS para especificar el estilo: <strong><a href="/es/docs/CSS/Como_iniciar/Por_que_usar_CSS" title="en/CSS/Getting_Started/Why_use_CSS?">¿Por qué utilizar CSS?</a></strong></p>
-
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>{{ languages( { "fr": "fr/CSS/Premiers_pas/Pr\u00e9sentation_des_CSS", "it": "it/Conoscere_i_CSS/Che_cosa_sono_i_CSS", "ja": "ja/CSS/Getting_Started/What_is_CSS", "pl": "pl/CSS/Na_pocz\u0105tek/Czym_jest_CSS", "pt": "pt/CSS/Como_come\u00e7ar/O_que_\u00e9_CSS", "zh-cn": "cn/CSS/Getting_Started/What_is_CSS", "es": "es/CSS/Como_iniciar/Que_es_CSS" } ) }}</p>
diff --git a/files/es/web/css/computed_value/index.html b/files/es/web/css/computed_value/index.html
new file mode 100644
index 0000000000..eddd9e0b00
--- /dev/null
+++ b/files/es/web/css/computed_value/index.html
@@ -0,0 +1,31 @@
+---
+title: Valor calculado
+slug: Web/CSS/computed_value
+tags:
+  - Referencia_CSS
+translation_of: Web/CSS/computed_value
+original_slug: Web/CSS/Valor_calculado
+---
+<p><br>
+ {{ CSSRef() }}</p>
+<h3 id="Sumario" name="Sumario">Sumario</h3>
+<p>El valor <b>computed value</b> de una propiedad CSS es computado a partir de <a href="es/CSS/specified_value">specified value</a> de la siguiente forma:</p>
+<ul>
+ <li>Mediante los valores especiales <code><a href="es/CSS/inherit">inherit</a></code> y <code><a href="es/CSS/initial">initial</a></code>, y</li>
+ <li>Realizando el cómputo necesario para alcanzar el valor descrito en la línea de "Computed value" del sumario de la propiedad.</li>
+</ul>
+<p>El cálculo necesario para el "Computed value" de una propiedad, normalmente implica convertir valores relativos (como los expresados en unidades 'em' o en porcentajes) a valores absolutos.</p>
+<p>Por ejemplo: si un elemento tiene un valor especificado de <code>font-size: 16px</code> y <code>padding-top: 2em</code>, el valor computado de <code>padding-top</code> es <code>32px</code> (el doble del tamaño de la fuente).</p>
+<p>Sin embargo, para algunas propiedades (aquellas con porcentajes relativos a algo que necesita un formato para ser determinados, tales como <a href="es/CSS/width">width</a>, <a href="es/CSS/margin-right">margin-right</a>, <a href="es/CSS/text-indent">text-indent</a>, y <a href="es/CSS/top">top</a>) los valores especificados en porcentajes se tornan valores computados. Ademas,los números especificados sin unidades en la propiedad <a href="es/CSS/line-height">line-height</a> se convierten en valores computados, según se especifica. Estos valores relativos que quedan tras realizar el cómputo, se hacen absolutos cuando se determina el <a href="es/CSS/used_value">used value</a>.</p>
+<p>El uso principal de <a href="es/CSS/computed_value">computed value</a> (ademas de ser un paso de transición entre <a href="es/CSS/specified_value">specified value</a> y <a href="es/CSS/used_value">used value</a>) es <a href="es/CSS/inherited_and_non-inherited_properties">inheritance</a>, incluyendo la palabra clave <a href="es/CSS/inherit">inherit</a>.</p>
+<h3 id="Notas" name="Notas">Notas</h3>
+<p>La API DOM <a href="es/DOM/window.getComputedStyle">getComputedStyle</a> devuelve <a href="es/CSS/used_value">used value</a>, en lugar de <a href="es/CSS/computed_value">computed value</a>.</p>
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
+<p><a href="es/CSS/specified_value">specified value</a>, <a href="es/CSS/used_value">used value</a>, <a href="es/CSS/actual_value">actual value</a></p>
+<p> </p>
+<p> </p>
+<p> </p>
+<p> </p>
+<div class="noinclude">
+  </div>
+<p>{{ languages( { "en": "en/CSS/computed_value", "fr": "fr/CSS/Valeur_calcul\u00e9e", "ja": "ja/CSS/computed_value", "pl": "pl/CSS/warto\u015b\u0107_wyliczona" } ) }}</p>
diff --git a/files/es/web/css/css_animations/detectar_soporte_de_animación_css/index.html b/files/es/web/css/css_animations/detectar_soporte_de_animación_css/index.html
deleted file mode 100644
index 11bb0c0076..0000000000
--- a/files/es/web/css/css_animations/detectar_soporte_de_animación_css/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: Detectar soporte de animación CSS
-slug: Web/CSS/CSS_Animations/Detectar_soporte_de_animación_CSS
-translation_of: Web/CSS/CSS_Animations/Detecting_CSS_animation_support
----
-<p>{{CSSRef}}</p>
-
-<p>Las animaciones de CSS permiten realizar animaciones creativas de contenido usando nada más que CSS. Sin embargo, es posible que hayan momentos en que estas funciones no sean compatibles, y puede que desees manejar ese problema usando código JavaScript. Este artículo, basado en <a class="external" href="http://hacks.mozilla.org/2011/09/detecting-and-generating-css-animations-in-javascript/" title="http://hacks.mozilla.org/2011/09/detecting-and-generating-css-animations-in-javascript/">la publicación</a> de Chris Heilmann, demuestra una técnica de como hacer esto.</p>
-
-<h2 id="Prueba_de_la_compatibilidad_de_animaciones_CSS">Prueba de la compatibilidad de animaciones CSS</h2>
-
-<p>Este código comprueba si el soporte de animaciones CSS esta disponible:</p>
-
-<pre class="brush: js">var animation = false,
-    animationstring = 'animation',
-    keyframeprefix = '',
-    domPrefixes = 'Webkit Moz O ms Khtml'.split(' '),
-    pfx  = '',
-    elm = document.createElement('div');
-
-if( elm.style.animationName !== undefined ) { animation = true; }
-
-if( animation === false ) {
-  for( var i = 0; i &lt; domPrefixes.length; i++ ) {
-    if( elm.style[ domPrefixes[i] + 'AnimationName' ] !== undefined ) {
-      pfx = domPrefixes[ i ];
-      animationstring = pfx + 'Animation';
-      keyframeprefix = '-' + pfx.toLowerCase() + '-';
-      animation = true;
-      break;
-    }
-  }
-}
-</pre>
-
-<p>Para empezar, hemos definido algunas variables. Asumimos que las animaciones no son compatibles al establecer la variable <code>animation</code> a <code>false</code>. Establecemos <code>la variable animationstring</code> a <code>animation</code> la cual es la propiedad que queremos establecer mas tarde. Creamos un arreglo (array) sobre los prefijos de navegadores para realizar un bucle, y establecemos la variable <code>pfx</code> a una cadena vacía.</p>
-
-<p>Luego verificamos si la propiedad de CSS {{ cssxref("animation-name") }} esta establecida en la colección de estilo para el elemento especificado por la variable <code>elm</code>. Esto quiere decir que el navegador soporta animaciones CSS sin ningun prefijo, lo cual, hasta la fecha, ninguno de ellos lo hace.</p>
-
-<p>Si el navegador no soporta animaciones sin prefijos, y <code>animation</code> sigue siendo <code>false</code>, iteramos todos los posibles prefijos,  ya que todos los principales navegadores estan anteponiendo esta propiedad y cambiando su nombre a <code>AnimationName</code> en su lugar.</p>
-
-<p>Una vez que el código ha terminado de ejecutarse, el valor de <em><code>animation </code></em>será <em><code>false</code> </em>si el soporte de animacion CSS no esta disponible, de otro modo será <em><code>true</code></em>. Si es <em><code>true</code> </em>tanto el nombre de las propiedad de <code>animation</code> y el el prefijo keyframe serán los correctos. Así que si utilizas un nuevo Firefox, la propiedad será <code>MozAnimation</code> y el prefijo keyframe será <code>-moz-</code>, mientras en Chrome será <code>WebkitAnimation</code> y <code>-webkit-</code>. Tenga en cuenta que los navegadores no facilitan el cambio entre <em>camelCase </em>(Capitalizacion medial) y la<em> hyphen-ation</em> (separación).</p>
-
-<h2 id="Animaciones_utilizando_la_sintaxis_correcta_para_diferentes_navegadores">Animaciones utilizando la sintaxis correcta para diferentes navegadores</h2>
-
-<p>Ahora que sabes si las animaciones CSS son compatibles o no, podemos animar.</p>
-
-<pre class="brush: js">if( animation === false ) {
-
-  // animate in JavaScript fallback
-
-} else {
-  elm.style[ animationstring ] = 'rotate 1s linear infinite';
-
-  var keyframes = '@' + keyframeprefix + 'keyframes rotate { '+
-                    'from {' + keyframeprefix + 'transform:rotate( 0deg ) }'+
-                    'to {' + keyframeprefix + 'transform:rotate( 360deg ) }'+
-                  '}';
-
-  if( document.styleSheets &amp;&amp; document.styleSheets.length ) {
-
-      document.styleSheets[0].insertRule( keyframes, 0 );
-
-  } else {
-
-    var s = document.createElement( 'style' );
-    s.innerHTML = keyframes;
-    document.getElementsByTagName( 'head' )[ 0 ].appendChild( s );
-
-  }
-
-}
-</pre>
-
-<p>Este código examina el valor de <em><code>animation</code></em>; si es <em><code>false</code></em>, sabemos que tendremos que recurrir a la alternativa de JavaScript para realizar nuestra animacion. De otra manera, podemos usar JavaScript para crear los efectos de animación CSS deseados.</p>
-
-<p>Establecer las propiedades de animación es fácil; simplemente actualiza su valor en la colección de estilos. Aunque, añadir <code>keyframes</code> es más complicado, ya que no están definidas usando la sintaxis tradicional de CSS (lo que los hace mas flexible, pero mas difícil desde script).</p>
-
-<p>Para definir nuestros keyframes usando JavaScript, necesitamos transcribirlos como una cadena CSS. Todo lo que hacemos es crear una variable <code>keyframes</code>, anteponiendo cada atributo tal como se construye. Esta variable, una vez construida, contiene la descripción completa de todos los keyframes necesarios por nuestra secuencia de animación.</p>
-
-<p>La siguiente tarea es realmente añadir los keyframes al CSS de la página. Lo primeron que hay que hacer es mirar a ver si existe una hoja de estilo en el documento; si es así, sensillamente insertamos el keyframe descrito dentro de la hoja de estilos; esto se hace en las lineas 13-15.</p>
-
-<p>Si aún no existe una hoja de estilos, se crea un nuevo elemento {{ HTMLElement("style") }} , y su contenido se incorpora al valor de los keyframes. Luego se sinerta el valor {{ HTMLElement("style") }} dentro del{{ HTMLElement("head") }} del documento, añadiendo así la nueva hoja de estilo del document.</p>
-
-<p><a href="https://jsfiddle.net/codepo8/ATS2S/8/embedded/result">Ver en el JSFiddle</a></p>
-
-<h2 id="Ver_tambien">Ver tambien</h2>
-
-<ul>
- <li><a href="es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS" title="en/CSS/CSS animations">Animaciones CSS</a></li>
-</ul>
diff --git a/files/es/web/css/css_animations/detecting_css_animation_support/index.html b/files/es/web/css/css_animations/detecting_css_animation_support/index.html
new file mode 100644
index 0000000000..d239ff4f70
--- /dev/null
+++ b/files/es/web/css/css_animations/detecting_css_animation_support/index.html
@@ -0,0 +1,92 @@
+---
+title: Detectar soporte de animación CSS
+slug: Web/CSS/CSS_Animations/Detecting_CSS_animation_support
+translation_of: Web/CSS/CSS_Animations/Detecting_CSS_animation_support
+original_slug: Web/CSS/CSS_Animations/Detectar_soporte_de_animación_CSS
+---
+<p>{{CSSRef}}</p>
+
+<p>Las animaciones de CSS permiten realizar animaciones creativas de contenido usando nada más que CSS. Sin embargo, es posible que hayan momentos en que estas funciones no sean compatibles, y puede que desees manejar ese problema usando código JavaScript. Este artículo, basado en <a class="external" href="http://hacks.mozilla.org/2011/09/detecting-and-generating-css-animations-in-javascript/" title="http://hacks.mozilla.org/2011/09/detecting-and-generating-css-animations-in-javascript/">la publicación</a> de Chris Heilmann, demuestra una técnica de como hacer esto.</p>
+
+<h2 id="Prueba_de_la_compatibilidad_de_animaciones_CSS">Prueba de la compatibilidad de animaciones CSS</h2>
+
+<p>Este código comprueba si el soporte de animaciones CSS esta disponible:</p>
+
+<pre class="brush: js">var animation = false,
+    animationstring = 'animation',
+    keyframeprefix = '',
+    domPrefixes = 'Webkit Moz O ms Khtml'.split(' '),
+    pfx  = '',
+    elm = document.createElement('div');
+
+if( elm.style.animationName !== undefined ) { animation = true; }
+
+if( animation === false ) {
+  for( var i = 0; i &lt; domPrefixes.length; i++ ) {
+    if( elm.style[ domPrefixes[i] + 'AnimationName' ] !== undefined ) {
+      pfx = domPrefixes[ i ];
+      animationstring = pfx + 'Animation';
+      keyframeprefix = '-' + pfx.toLowerCase() + '-';
+      animation = true;
+      break;
+    }
+  }
+}
+</pre>
+
+<p>Para empezar, hemos definido algunas variables. Asumimos que las animaciones no son compatibles al establecer la variable <code>animation</code> a <code>false</code>. Establecemos <code>la variable animationstring</code> a <code>animation</code> la cual es la propiedad que queremos establecer mas tarde. Creamos un arreglo (array) sobre los prefijos de navegadores para realizar un bucle, y establecemos la variable <code>pfx</code> a una cadena vacía.</p>
+
+<p>Luego verificamos si la propiedad de CSS {{ cssxref("animation-name") }} esta establecida en la colección de estilo para el elemento especificado por la variable <code>elm</code>. Esto quiere decir que el navegador soporta animaciones CSS sin ningun prefijo, lo cual, hasta la fecha, ninguno de ellos lo hace.</p>
+
+<p>Si el navegador no soporta animaciones sin prefijos, y <code>animation</code> sigue siendo <code>false</code>, iteramos todos los posibles prefijos,  ya que todos los principales navegadores estan anteponiendo esta propiedad y cambiando su nombre a <code>AnimationName</code> en su lugar.</p>
+
+<p>Una vez que el código ha terminado de ejecutarse, el valor de <em><code>animation </code></em>será <em><code>false</code> </em>si el soporte de animacion CSS no esta disponible, de otro modo será <em><code>true</code></em>. Si es <em><code>true</code> </em>tanto el nombre de las propiedad de <code>animation</code> y el el prefijo keyframe serán los correctos. Así que si utilizas un nuevo Firefox, la propiedad será <code>MozAnimation</code> y el prefijo keyframe será <code>-moz-</code>, mientras en Chrome será <code>WebkitAnimation</code> y <code>-webkit-</code>. Tenga en cuenta que los navegadores no facilitan el cambio entre <em>camelCase </em>(Capitalizacion medial) y la<em> hyphen-ation</em> (separación).</p>
+
+<h2 id="Animaciones_utilizando_la_sintaxis_correcta_para_diferentes_navegadores">Animaciones utilizando la sintaxis correcta para diferentes navegadores</h2>
+
+<p>Ahora que sabes si las animaciones CSS son compatibles o no, podemos animar.</p>
+
+<pre class="brush: js">if( animation === false ) {
+
+  // animate in JavaScript fallback
+
+} else {
+  elm.style[ animationstring ] = 'rotate 1s linear infinite';
+
+  var keyframes = '@' + keyframeprefix + 'keyframes rotate { '+
+                    'from {' + keyframeprefix + 'transform:rotate( 0deg ) }'+
+                    'to {' + keyframeprefix + 'transform:rotate( 360deg ) }'+
+                  '}';
+
+  if( document.styleSheets &amp;&amp; document.styleSheets.length ) {
+
+      document.styleSheets[0].insertRule( keyframes, 0 );
+
+  } else {
+
+    var s = document.createElement( 'style' );
+    s.innerHTML = keyframes;
+    document.getElementsByTagName( 'head' )[ 0 ].appendChild( s );
+
+  }
+
+}
+</pre>
+
+<p>Este código examina el valor de <em><code>animation</code></em>; si es <em><code>false</code></em>, sabemos que tendremos que recurrir a la alternativa de JavaScript para realizar nuestra animacion. De otra manera, podemos usar JavaScript para crear los efectos de animación CSS deseados.</p>
+
+<p>Establecer las propiedades de animación es fácil; simplemente actualiza su valor en la colección de estilos. Aunque, añadir <code>keyframes</code> es más complicado, ya que no están definidas usando la sintaxis tradicional de CSS (lo que los hace mas flexible, pero mas difícil desde script).</p>
+
+<p>Para definir nuestros keyframes usando JavaScript, necesitamos transcribirlos como una cadena CSS. Todo lo que hacemos es crear una variable <code>keyframes</code>, anteponiendo cada atributo tal como se construye. Esta variable, una vez construida, contiene la descripción completa de todos los keyframes necesarios por nuestra secuencia de animación.</p>
+
+<p>La siguiente tarea es realmente añadir los keyframes al CSS de la página. Lo primeron que hay que hacer es mirar a ver si existe una hoja de estilo en el documento; si es así, sensillamente insertamos el keyframe descrito dentro de la hoja de estilos; esto se hace en las lineas 13-15.</p>
+
+<p>Si aún no existe una hoja de estilos, se crea un nuevo elemento {{ HTMLElement("style") }} , y su contenido se incorpora al valor de los keyframes. Luego se sinerta el valor {{ HTMLElement("style") }} dentro del{{ HTMLElement("head") }} del documento, añadiendo así la nueva hoja de estilo del document.</p>
+
+<p><a href="https://jsfiddle.net/codepo8/ATS2S/8/embedded/result">Ver en el JSFiddle</a></p>
+
+<h2 id="Ver_tambien">Ver tambien</h2>
+
+<ul>
+ <li><a href="es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS" title="en/CSS/CSS animations">Animaciones CSS</a></li>
+</ul>
diff --git a/files/es/web/css/css_animations/usando_animaciones_css/index.html b/files/es/web/css/css_animations/usando_animaciones_css/index.html
deleted file mode 100644
index b9b08bbc0b..0000000000
--- a/files/es/web/css/css_animations/usando_animaciones_css/index.html
+++ /dev/null
@@ -1,351 +0,0 @@
----
-title: Usando animaciones CSS
-slug: Web/CSS/CSS_Animations/Usando_animaciones_CSS
-tags:
-  - Advanced
-  - CSS
-  - CSS Animations
-  - Example
-  - Experimental
-  - Guide
-translation_of: Web/CSS/CSS_Animations/Using_CSS_animations
----
-<p><span class="diff_add">{{SeeCompatTable}}{{CSSRef}}</span></p>
-
-<p><strong>Las animaciones CSS3</strong> permiten animar la transición entre un estilo CSS y otro. Las animaciones constan de dos componentes: un estilo que describe la animación CSS y un conjunto de fotogramas que indican su estado inicial y final, así como posibles puntos intermedios en la misma.</p>
-
-<p>Las animaciones CSS tienen tres ventajas principales sobre las técnicas tradicionales de animación basada en scripts:</p>
-
-<ol>
- <li>Son muy fáciles de usar para animaciones sencillas, puedes hacerlo incluso sin tener conocimientos de Javascript.</li>
- <li>La animación se muestra correctamente, incluso en equipos poco potentes. Animaciones simples realizadas en Javascript pueden verse mal (a menos que estén muy bien hechas). El motor de renderizado puede usar técnicas de optimización como el "frame-skipping" u otras técnicas para que la ejecución de la animación se vea tan suave como sea posible.</li>
- <li>Al ser el navegador quien controle la secuencia de la animación, permitimos que optimice el rendimiento y eficiencia de la misma, por ejemplo, reduciendo la frecuencia de actualización de la animación ejecutándola en pestañas que no estén visibles.</li>
-</ol>
-
-<h2 id="Configurando_la_animación">Configurando la animación</h2>
-
-<p>Para crear una secuencia de animación CSS, tú estilizarás el elemento que quieras animar con la propiedad {{ cssxref("animation") }} y sus sub-propiedades. Con ellas podemos no solo configurar el ritmo y la duración de la animación sino otros detalles sobre la secuencia de la animación. Con ellas <strong>no</strong> configuramos la apariencia actual de la animación, para ello disponemos de {{ cssxref("@keyframes") }} como describiremos más adelante .</p>
-
-<p>Las subpropiedades de {{ cssxref("animation") }} son:</p>
-
-<dl>
- <dt>{{ cssxref("animation-delay") }}</dt>
- <dd>Tiempo de retardo entre el momento en que el elemento se carga y el comienzo de la secuencia de la animación.</dd>
- <dt>{{ cssxref("animation-direction") }}</dt>
- <dd>Indica si la animación debe retroceder hasta el fotograma de inicio al finalizar la secuencia o si debe comenzar desde el principio al llegar al final.</dd>
- <dt>{{ cssxref("animation-duration") }}</dt>
- <dd>Indica la cantidad de tiempo que la animación consume en completar su ciclo (duración).</dd>
- <dt>{{ cssxref("animation-iteration-count") }}</dt>
- <dd>El número de veces que se repite. Podemos indicar <code>infinite</code> para repetir la animación indefinidamente.</dd>
- <dt>{{ cssxref("animation-name") }}</dt>
- <dd>Especifica el nombre de la regla {{ cssxref("@keyframes") }} que describe los fotogramas de la animación.</dd>
- <dt>{{ cssxref("animation-play-state") }}</dt>
- <dd>Permite pausar y reanudar la secuencia de la animación</dd>
- <dt>{{ cssxref("animation-timing-function") }}</dt>
- <dd>Indica el ritmo de la animación, es decir, como se muestran los fotogramas de la animación, estableciendo curvas de aceleración.</dd>
- <dt>{{ cssxref("animation-fill-mode") }}</dt>
- <dd>Especifica qué valores tendrán las propiedades después de finalizar la animación (los de antes de ejecutarla, los del último fotograma de la animación o ambos).</dd>
-</dl>
-
-<h2 id="Definiendo_la_secuencia_de_la_animación_con_fotogramas">Definiendo la secuencia de la animación con fotogramas</h2>
-
-<p>Una vez configurado el tiempo de la animación, necesitamos definir su apariencia. Esto lo haremos estableciendo dos fotogramas más usando la regla {{ cssxref("@keyframes") }}. Cada fotograma describe cómo se muestra cada elemento animado en un momento dado durante la secuencia de la animación.</p>
-
-<p>Desde que se define el tiempo y el ritmo de la animación, el fotograma usa {{ cssxref("percentage") }} para indicar en qué momento de la secuencia de la animación tiene lugar. 0% es el principio, 100% es el estado final de la animación. Debemos especificar estos dos momentos para que el navegador sepa dónde debe comenzar y finalizar; debido a su importancias, estos dos momentos tienen alias especiales: <code>from</code> y <code>to</code>.</p>
-
-<p>Además puedes, opcionalmente, incluir fotogramas que describan pasos intermedios entre el punto inicial y final de la animación.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<div class="note"><strong>Nota:</strong> Los siguientes ejemplos no usan ningún prefijo en las propiedades CSS de animación. Los navegadores antiguos pueden necesitarlos. Al hacer click en "Ver el ejemplo vivo" se incluye el prefijo <code>-webkit</code>.</div>
-
-<h3 id="Haciendo_que_un_texto_se_delice_por_la_ventana_del_navegador">Haciendo que un texto se delice por la ventana del navegador</h3>
-
-<p>Este sencillo ejemplo da estilos al elemento {{ HTMLElement("p") }} para que el texto se deslice por la pantalla entrando desde el borde derecho de la ventana del navegador.</p>
-
-<p>Animaciones como esta pueden hacer que la página se vuelva más ancha que la ventana del navegador. Para evitar este problema, pon el elemento que será animado en un contenedor y agrega {{cssxref("overflow")}}<code>:hidden</code> en el contenedor.</p>
-
-<pre class="brush: css notranslate">p {
-  animation-duration: 3s;
-  animation-name: slidein;
-}
-
-@keyframes slidein {
-  from {
-    margin-left: 100%;
-    width: 300%
-  }
-
-  to {
-    margin-left: 0%;
-    width: 100%;
-  }
-}
-</pre>
-
-<p>El estilo del elemento {{ HTMLElement("p") }} especifica, a través de la propiedad {{ cssxref("animation-duration") }}, que la animación debe durar 3 segundos desde el inicio al fin y que el nombre de los {{ cssxref("@keyframes") }} que definen los fotogramas de la secuencia de la animación es "slidein".</p>
-
-<p>Si queremos añadir algún estilo personalizado sobre el elemento {{ HTMLElement("p") }} para usarlo en navegadores que no soporten animaciones CSS, también podemos incluirlos. En nuestro ejemplo, no queremos ningún otro estilo personalizado diferente al efecto de la animación.</p>
-
-<p>Los fotogramas se definen usando la regla {{ cssxref("@keyframes") }}. En nuestro ejemplo, tenemos solo dos fotogramas. El primero de ellos sucede en elt 0% (hemos usado su alias <code>from</code>). Aqui, configuramos el margen izquierdo del elemento, poniendolo al 100%  (es decir, en el borde derecho del elemento contenedor), y su ancho al 300% (o tres veces el ancho del elemento contenedor). Esto hace que en el primer fotograma de la animación tengamos el encabezado fuera del borde derecho de la ventana del navegador.</p>
-
-<p>El segundo (y último) fotograma sucede en el 100% (hemos usado su alias <code>to</code>). Hemos puesto el margen derecho al 0% y el ancho del elemento al 100%. Esto produce que el encabezado, al finalizar la animación, esté en el borde derecho del área de contenido.</p>
-
-<pre class="brush: html notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
-at last the Caterpillar took the hookah out of its mouth, and addressed
-her in a languid, sleepy voice.&lt;/p&gt;</pre>
-
-<p>(Recarga la página para ver la animación, o haz click en el botón CodePen para ver la animación en CodePen)</p>
-
-<p>{{EmbedLiveSample("Haciendo_que_un_texto_se_delice_por_la_ventana_del_navegador","100%","250")}}</p>
-
-<h3 id="Añadiendo_otro_fotograma">Añadiendo otro fotograma</h3>
-
-<p>Vamos a añadir otro fotograma a la animación de nuestro ejemplo anterior. Pongamos que queremos que el tamaño de fuente del encabezado aumente a medida que se mueve durante un tiempo y que después disminuye hasta su tamaño original. Esto es tan sencillo como añadir este fotograma:</p>
-
-<pre class="brush: css notranslate">75% {
-  font-size: 300%;
-  margin-left: 25%;
-  width: 150%;
-}
-</pre>
-
-<pre class="brush: css hidden notranslate">p {
-  animation-duration: 3s;
-  animation-name: slidein;
-}
-
-@keyframes slidein {
-  from {
-    margin-left: 100%;
-    width: 300%;
-  }
-
-  to {
-    margin-left: 0%;
-    width: 100%;
-  }
-}
-</pre>
-
-<pre class="brush: html hidden notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
-at last the Caterpillar took the hookah out of its mouth, and addressed
-her in a languid, sleepy voice.&lt;/p&gt;
-</pre>
-
-<p>Esto le dice al navegador que en el 75% de la secuencia de la animación, el encabezado tiene un margen izquierdo del 25%, un tamaño de letra del 200% y un ancho del 150%.</p>
-
-<p>(Recarga la página para ver la animación, o haz click al botón de CodePen para la animación en CodePen)</p>
-
-<p>{{EmbedLiveSample("Añadiendo_otro_fotograma","100%","250")}}</p>
-
-<h3 id="Haciendo_que_se_repita">Haciendo que se repita</h3>
-
-<p>Para hacer que la animación se repita, solo hay que usar la propiedad {{ cssxref("animation-iteration-count") }} e indicarle cuántas veces debe repetirse. En nuestro caso, usamos  <code>infinite</code> para que la animación se repita indefinidamente:</p>
-
-<pre class="brush: css notranslate">p {
-  animation-duration: 3s;
-  animation-name: slidein;
-  animation-iteration-count: infinite;
-}
-</pre>
-
-<pre class="brush: css hidden notranslate">@keyframes slidein {
-  from {
-    margin-left: 100%;
-    width: 300%;
-  }
-
-  to {
-    margin-left: 0%;
-    width: 100%;
-  }
-}
-</pre>
-
-<pre class="brush: html hidden notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
-at last the Caterpillar took the hookah out of its mouth, and addressed
-her in a languid, sleepy voice.&lt;/p&gt;
-</pre>
-
-<p>{{EmbedLiveSample("Haciendo_que_se_repita","100%","250")}}</p>
-
-<h3 id="Moviendolo_hacia_adelante_y_hacia_atrás">Moviendolo hacia adelante y hacia atrás</h3>
-
-<p>Hemos hecho que se repita, pero queda un poco raro que salte al inicio de la animación cada vez que ésta comienza. Queremos que se mueva hacia adelante y hacia atrás en la pantalla. Esto lo conseguimos fácilmente indicando que {{ cssxref("animation-direction") }} es <code>alternate</code>:</p>
-
-<pre class="brush: css notranslate">p {
-  animation-duration: 3s;
-  animation-name: slidein;
-  animation-iteration-count: infinite;
-  animation-direction: alternate;
-}
-</pre>
-
-<pre class="brush: css hidden notranslate">@keyframes slidein {
-  from {
-    margin-left: 100%;
-    width: 300%;
-  }
-
-  to {
-    margin-left: 0%;
-    width: 100%;
-  }
-}
-</pre>
-
-<pre class="brush: html hidden notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
-at last the Caterpillar took the hookah out of its mouth, and addressed
-her in a languid, sleepy voice.&lt;/p&gt;
-</pre>
-
-<p>{{EmbedLiveSample("Moviendolo_hacia_adelante_y_hacia_atrás","100%","250")}}</p>
-
-<h3 id="Usando_la_versión_abreviada_animation">Usando la versión abreviada animation</h3>
-
-<p>La versión abreviada {{cssxref("animation")}} es usado para ahorrar espacio. Por ejemplo, la regla que hemos usado en este artículo:</p>
-
-<pre class="notranslate"><code>p {
-  animation-duration: 3s;
-  animation-name: slidein;
-  animation-iteration-count: infinite;
-  animation-direction: alternate;
-}</code></pre>
-
-<p>Se puede reemplazar por</p>
-
-<pre class="notranslate"><code>p {
-  animation: 3s infinite alternate slidein;
-}</code></pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota: </strong>Puedes encontrar más detalles en la página de referencia {{cssxref("animation")}} </p>
-</div>
-
-<h3 id="Estableciendo_multiples_valores_de_propiedades_animation">Estableciendo multiples valores de propiedades animation</h3>
-
-<p>Las propiedades de la versión larga de {{cssxref("animation")}} pueden aceptar múltiples valores, separados por comas - esta característica puede ser usada cuando quieres aplicar múltiples animaciones en una solo regla, y establecer por separado duration, iteration-count, etc. para diferentes animaciones. Vamos a ver algunos ejemplos rápidos para explicar las diferentes combinaciones:</p>
-
-<p>En el primer ejemplo, tenemos tres nombres de animación establecidos, pero solo una duración (duration) y número de iteraciones (iteration-count). En este caso, a las tres animaciones se les da la misma duración y número de iteraciones:</p>
-
-<pre class="notranslate"><code>animation-name: fadeInOut, moveLeft300px, bounce;
-animation-duration: 3s;
-animation-iteration-count: 1;</code>
-</pre>
-
-<p>En el segundo ejemplo, tenemos tres valores establecidos en las tres propiedades. En este caso, cada animación se ejecuta con los valores correspondientes en la misma posición en cada propiedad, así por ejemplo <code>fadeInOut</code> tiene una duración de 2.5s y 2 iteraciones, etc.</p>
-
-<pre class="notranslate"><code>animation-name: fadeInOut, moveLeft300px, bounce;
-animation-duration: 2.5s, 5s, 1s;
-animation-iteration-count: 2, 1, 5;</code></pre>
-
-<p>En el tercer caso, hay tres animaciones especificadas, pero solo dos duraciones y número de iteraciones. En los casos en donde no hay valores suficientes para dar un valor separado a cada animación, los valores se repiten de inicio a fin. Así por ejemplo, <code>fadeInOut</code> obtiene una duración de 2.5s y <code>moveLeft300px</code> obtiene una duración de 5s. Ahora tenemos asignados todos los valores de duracion disponibles, así que empezamos desde el inicio de nuevo - por lo tanto <code>bounce</code>  tiene una duración de 2.5s. El número de iteraciones (y cualquier otra propiedad que especifiques) será asignados de la misma forma.</p>
-
-<pre class="notranslate"><code>animation-name: fadeInOut, moveLeft300px, bounce;
-animation-duration: 2.5s, 5s;
-animation-iteration-count: 2, 1;</code></pre>
-
-<h3 id="Usando_eventos_de_animación">Usando eventos de animación</h3>
-
-<p>Podemos tener un control mayor sobre las animaciones (así como información útil sobre ellas) haciendo uso de eventos de animación. Dichos eventos, representados por el objeto {{ domxref("event/AnimationEvent", "AnimationEvent") }} , se pueden usar para detectar cuándo comienza la animación, cuándo termina y cuándo comienza una iteración. Cada evento incluye el momento en el que ocurrió, así como el nombre de la animación que lo desencadenó.</p>
-
-<p>Vamos a modificar el ejemplo del texto deslizante para recoger información sobre cada evento cuando suceda y asi podremos echar un vistazo a cómo funcionan.</p>
-
-<h4 id="Agregando_CSS">Agregando CSS</h4>
-
-<p>Empezamos creando el CSS para la animación. Esta animación durará 3 segundos, se llama <code>slidein</code>, se repite 3 veces, y alterna de dirección cada vez. En {{cssxref("@keyframes")}}, <code>width</code> y <code>margin-left</code> son manipulados para hacer que el elemento se deslice por la pantalla.</p>
-
-<pre class="brush: css notranslate">.slidein {
-  animation-duration: 3s;
-  animation-name: slidein;
-  animation-iteration-count: 3;
-  animation-direction: alternate;
-}
-
-@keyframes slidein {
-  from {
-    margin-left:100%;
-    width:300%
-  }
-
-  to {
-   margin-left:0%;
-   width:100%;
- }
-}</pre>
-
-<h4 id="Añadiendo_detectores_de_eventos_a_la_animación">Añadiendo detectores de eventos a la animación</h4>
-
-<p>Usaremos un poco de Javascript para escuchar los tres posibles eventos de animación. Este código configura nuestros detectores de eventos (event listeners); los llamamos cuando el documento carga por primera vez para configurar todo.</p>
-
-<pre class="brush: js notranslate">var e = document.getElementById("watchme");
-e.addEventListener("animationstart", listener, false);
-e.addEventListener("animationend", listener, false);
-e.addEventListener("animationiteration", listener, false);
-
-e.className = "slidein";</pre>
-
-<p>Es la forma estándar de detectar eventos en Javascript, si quieres conocer más detalles sobre cómo funciona la detección de eventos, consulta la documentación de {{ domxref("element.addEventListener()") }}.</p>
-
-<p>La última línea pone la clase <code>slidein</code> al elemento para comenzar la animación. ¿Por qué?. Porque que el evento <code>animationstart</code> se dispara cuando comienza la animación y, en nuestro caso, esto sucedería antes de que nuestro código se hubiera ejecutado y no podríamos crear los detectores de eventos. Para evitarlo, creamos los detectores de eventos antes y añadimos la clase al elemento para iniciar la animación.</p>
-
-<h4 id="Recibiendo_los_eventos">Recibiendo los eventos</h4>
-
-<p>Los eventos, al irse disparando, llamarán a la función <code>listener()</code>.</p>
-
-<pre class="brush: js notranslate">function listener(e) {
-  var l = document.createElement("li");
-  switch(e.type) {
-    case "animationstart":
-      l.innerHTML = "Iniciado: tiempo transcurrido " + e.elapsedTime;
-      break;
-    case "animationend":
-      l.innerHTML = "Finalizado: tiempo transcurrido " + e.elapsedTime;
-      break;
-    case "animationiteration":
-      l.innerHTML = "Nueva iteración comenzó a los " + e.elapsedTime;
-      break;
-  }
-  document.getElementById("output").appendChild(l);
-}
-</pre>
-
-<p>Este código también es muy sencillo. Miramos en {{ domxref("event.type") }} para saber qué tipo de evento se ha disparado y, en función del tipo de evento, añadimos su correspodiente texto al elemento {{ HTMLElement("ul") }} que usaremos para registrar la actividad de nuestros eventos.</p>
-
-<p>El resultado, si todo ha ido bien, será algo parecido a esto:</p>
-
-<ul>
- <li>Iniciado: tiempo transcurrido 0</li>
- <li>Nueva iteración comenzó a los 3.01200008392334</li>
- <li>Nueva iteración comenzó a los 6.00600004196167</li>
- <li>Finalizado: tiempo transcurrido 9.234000205993652</li>
-</ul>
-
-<p>Fijémonos en que despues de la iteración final de la animación, el evento <code>animationiteration</code> no se envía, en su lugar se lanza <code>animationend</code>.</p>
-
-<h4 id="El_HTML">El HTML</h4>
-
-<p>Solo nos falta mostrar el código HTML necesario para mostrar el ejemplo en la página, incluyendo la lista en la que el script irá insertando la información de los eventos que se vayan disparando.</p>
-
-<pre class="brush: html notranslate">&lt;h1 id="watchme"&gt;Watch me move&lt;/h1&gt;
-&lt;p&gt;
-  This example shows how to use CSS animations to make &lt;code&gt;H1&lt;/code&gt;
-  elements move across the page.&lt;/p&gt;
-&lt;p&gt;
-  In addition, we output some text each time an animation event fires,
-  so you can see them in action.
-&lt;/p&gt;
-&lt;ul id="output"&gt;
-&lt;/ul&gt;
-</pre>
-
-<p>{{EmbedLiveSample('Usando_eventos_de_animación', '600', '300')}}</p>
-
-<h2 id="Te_puede_interesar_también">Te puede interesar también</h2>
-
-<ul>
- <li>{{ domxref("AnimationEvent", "AnimationEvent") }}</li>
- <li><a href="/en-US/docs/CSS/CSS_animations/Detecting_CSS_animation_support" title="en/CSS/CSS animations/Detecting CSS animation support">Detecting CSS animation support</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions">Using CSS transitions</a></li>
-</ul>
diff --git a/files/es/web/css/css_animations/using_css_animations/index.html b/files/es/web/css/css_animations/using_css_animations/index.html
new file mode 100644
index 0000000000..27540189cd
--- /dev/null
+++ b/files/es/web/css/css_animations/using_css_animations/index.html
@@ -0,0 +1,352 @@
+---
+title: Usando animaciones CSS
+slug: Web/CSS/CSS_Animations/Using_CSS_animations
+tags:
+  - Advanced
+  - CSS
+  - CSS Animations
+  - Example
+  - Experimental
+  - Guide
+translation_of: Web/CSS/CSS_Animations/Using_CSS_animations
+original_slug: Web/CSS/CSS_Animations/Usando_animaciones_CSS
+---
+<p><span class="diff_add">{{SeeCompatTable}}{{CSSRef}}</span></p>
+
+<p><strong>Las animaciones CSS3</strong> permiten animar la transición entre un estilo CSS y otro. Las animaciones constan de dos componentes: un estilo que describe la animación CSS y un conjunto de fotogramas que indican su estado inicial y final, así como posibles puntos intermedios en la misma.</p>
+
+<p>Las animaciones CSS tienen tres ventajas principales sobre las técnicas tradicionales de animación basada en scripts:</p>
+
+<ol>
+ <li>Son muy fáciles de usar para animaciones sencillas, puedes hacerlo incluso sin tener conocimientos de Javascript.</li>
+ <li>La animación se muestra correctamente, incluso en equipos poco potentes. Animaciones simples realizadas en Javascript pueden verse mal (a menos que estén muy bien hechas). El motor de renderizado puede usar técnicas de optimización como el "frame-skipping" u otras técnicas para que la ejecución de la animación se vea tan suave como sea posible.</li>
+ <li>Al ser el navegador quien controle la secuencia de la animación, permitimos que optimice el rendimiento y eficiencia de la misma, por ejemplo, reduciendo la frecuencia de actualización de la animación ejecutándola en pestañas que no estén visibles.</li>
+</ol>
+
+<h2 id="Configurando_la_animación">Configurando la animación</h2>
+
+<p>Para crear una secuencia de animación CSS, tú estilizarás el elemento que quieras animar con la propiedad {{ cssxref("animation") }} y sus sub-propiedades. Con ellas podemos no solo configurar el ritmo y la duración de la animación sino otros detalles sobre la secuencia de la animación. Con ellas <strong>no</strong> configuramos la apariencia actual de la animación, para ello disponemos de {{ cssxref("@keyframes") }} como describiremos más adelante .</p>
+
+<p>Las subpropiedades de {{ cssxref("animation") }} son:</p>
+
+<dl>
+ <dt>{{ cssxref("animation-delay") }}</dt>
+ <dd>Tiempo de retardo entre el momento en que el elemento se carga y el comienzo de la secuencia de la animación.</dd>
+ <dt>{{ cssxref("animation-direction") }}</dt>
+ <dd>Indica si la animación debe retroceder hasta el fotograma de inicio al finalizar la secuencia o si debe comenzar desde el principio al llegar al final.</dd>
+ <dt>{{ cssxref("animation-duration") }}</dt>
+ <dd>Indica la cantidad de tiempo que la animación consume en completar su ciclo (duración).</dd>
+ <dt>{{ cssxref("animation-iteration-count") }}</dt>
+ <dd>El número de veces que se repite. Podemos indicar <code>infinite</code> para repetir la animación indefinidamente.</dd>
+ <dt>{{ cssxref("animation-name") }}</dt>
+ <dd>Especifica el nombre de la regla {{ cssxref("@keyframes") }} que describe los fotogramas de la animación.</dd>
+ <dt>{{ cssxref("animation-play-state") }}</dt>
+ <dd>Permite pausar y reanudar la secuencia de la animación</dd>
+ <dt>{{ cssxref("animation-timing-function") }}</dt>
+ <dd>Indica el ritmo de la animación, es decir, como se muestran los fotogramas de la animación, estableciendo curvas de aceleración.</dd>
+ <dt>{{ cssxref("animation-fill-mode") }}</dt>
+ <dd>Especifica qué valores tendrán las propiedades después de finalizar la animación (los de antes de ejecutarla, los del último fotograma de la animación o ambos).</dd>
+</dl>
+
+<h2 id="Definiendo_la_secuencia_de_la_animación_con_fotogramas">Definiendo la secuencia de la animación con fotogramas</h2>
+
+<p>Una vez configurado el tiempo de la animación, necesitamos definir su apariencia. Esto lo haremos estableciendo dos fotogramas más usando la regla {{ cssxref("@keyframes") }}. Cada fotograma describe cómo se muestra cada elemento animado en un momento dado durante la secuencia de la animación.</p>
+
+<p>Desde que se define el tiempo y el ritmo de la animación, el fotograma usa {{ cssxref("percentage") }} para indicar en qué momento de la secuencia de la animación tiene lugar. 0% es el principio, 100% es el estado final de la animación. Debemos especificar estos dos momentos para que el navegador sepa dónde debe comenzar y finalizar; debido a su importancias, estos dos momentos tienen alias especiales: <code>from</code> y <code>to</code>.</p>
+
+<p>Además puedes, opcionalmente, incluir fotogramas que describan pasos intermedios entre el punto inicial y final de la animación.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<div class="note"><strong>Nota:</strong> Los siguientes ejemplos no usan ningún prefijo en las propiedades CSS de animación. Los navegadores antiguos pueden necesitarlos. Al hacer click en "Ver el ejemplo vivo" se incluye el prefijo <code>-webkit</code>.</div>
+
+<h3 id="Haciendo_que_un_texto_se_delice_por_la_ventana_del_navegador">Haciendo que un texto se delice por la ventana del navegador</h3>
+
+<p>Este sencillo ejemplo da estilos al elemento {{ HTMLElement("p") }} para que el texto se deslice por la pantalla entrando desde el borde derecho de la ventana del navegador.</p>
+
+<p>Animaciones como esta pueden hacer que la página se vuelva más ancha que la ventana del navegador. Para evitar este problema, pon el elemento que será animado en un contenedor y agrega {{cssxref("overflow")}}<code>:hidden</code> en el contenedor.</p>
+
+<pre class="brush: css notranslate">p {
+  animation-duration: 3s;
+  animation-name: slidein;
+}
+
+@keyframes slidein {
+  from {
+    margin-left: 100%;
+    width: 300%
+  }
+
+  to {
+    margin-left: 0%;
+    width: 100%;
+  }
+}
+</pre>
+
+<p>El estilo del elemento {{ HTMLElement("p") }} especifica, a través de la propiedad {{ cssxref("animation-duration") }}, que la animación debe durar 3 segundos desde el inicio al fin y que el nombre de los {{ cssxref("@keyframes") }} que definen los fotogramas de la secuencia de la animación es "slidein".</p>
+
+<p>Si queremos añadir algún estilo personalizado sobre el elemento {{ HTMLElement("p") }} para usarlo en navegadores que no soporten animaciones CSS, también podemos incluirlos. En nuestro ejemplo, no queremos ningún otro estilo personalizado diferente al efecto de la animación.</p>
+
+<p>Los fotogramas se definen usando la regla {{ cssxref("@keyframes") }}. En nuestro ejemplo, tenemos solo dos fotogramas. El primero de ellos sucede en elt 0% (hemos usado su alias <code>from</code>). Aqui, configuramos el margen izquierdo del elemento, poniendolo al 100%  (es decir, en el borde derecho del elemento contenedor), y su ancho al 300% (o tres veces el ancho del elemento contenedor). Esto hace que en el primer fotograma de la animación tengamos el encabezado fuera del borde derecho de la ventana del navegador.</p>
+
+<p>El segundo (y último) fotograma sucede en el 100% (hemos usado su alias <code>to</code>). Hemos puesto el margen derecho al 0% y el ancho del elemento al 100%. Esto produce que el encabezado, al finalizar la animación, esté en el borde derecho del área de contenido.</p>
+
+<pre class="brush: html notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
+at last the Caterpillar took the hookah out of its mouth, and addressed
+her in a languid, sleepy voice.&lt;/p&gt;</pre>
+
+<p>(Recarga la página para ver la animación, o haz click en el botón CodePen para ver la animación en CodePen)</p>
+
+<p>{{EmbedLiveSample("Haciendo_que_un_texto_se_delice_por_la_ventana_del_navegador","100%","250")}}</p>
+
+<h3 id="Añadiendo_otro_fotograma">Añadiendo otro fotograma</h3>
+
+<p>Vamos a añadir otro fotograma a la animación de nuestro ejemplo anterior. Pongamos que queremos que el tamaño de fuente del encabezado aumente a medida que se mueve durante un tiempo y que después disminuye hasta su tamaño original. Esto es tan sencillo como añadir este fotograma:</p>
+
+<pre class="brush: css notranslate">75% {
+  font-size: 300%;
+  margin-left: 25%;
+  width: 150%;
+}
+</pre>
+
+<pre class="brush: css hidden notranslate">p {
+  animation-duration: 3s;
+  animation-name: slidein;
+}
+
+@keyframes slidein {
+  from {
+    margin-left: 100%;
+    width: 300%;
+  }
+
+  to {
+    margin-left: 0%;
+    width: 100%;
+  }
+}
+</pre>
+
+<pre class="brush: html hidden notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
+at last the Caterpillar took the hookah out of its mouth, and addressed
+her in a languid, sleepy voice.&lt;/p&gt;
+</pre>
+
+<p>Esto le dice al navegador que en el 75% de la secuencia de la animación, el encabezado tiene un margen izquierdo del 25%, un tamaño de letra del 200% y un ancho del 150%.</p>
+
+<p>(Recarga la página para ver la animación, o haz click al botón de CodePen para la animación en CodePen)</p>
+
+<p>{{EmbedLiveSample("Añadiendo_otro_fotograma","100%","250")}}</p>
+
+<h3 id="Haciendo_que_se_repita">Haciendo que se repita</h3>
+
+<p>Para hacer que la animación se repita, solo hay que usar la propiedad {{ cssxref("animation-iteration-count") }} e indicarle cuántas veces debe repetirse. En nuestro caso, usamos  <code>infinite</code> para que la animación se repita indefinidamente:</p>
+
+<pre class="brush: css notranslate">p {
+  animation-duration: 3s;
+  animation-name: slidein;
+  animation-iteration-count: infinite;
+}
+</pre>
+
+<pre class="brush: css hidden notranslate">@keyframes slidein {
+  from {
+    margin-left: 100%;
+    width: 300%;
+  }
+
+  to {
+    margin-left: 0%;
+    width: 100%;
+  }
+}
+</pre>
+
+<pre class="brush: html hidden notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
+at last the Caterpillar took the hookah out of its mouth, and addressed
+her in a languid, sleepy voice.&lt;/p&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Haciendo_que_se_repita","100%","250")}}</p>
+
+<h3 id="Moviendolo_hacia_adelante_y_hacia_atrás">Moviendolo hacia adelante y hacia atrás</h3>
+
+<p>Hemos hecho que se repita, pero queda un poco raro que salte al inicio de la animación cada vez que ésta comienza. Queremos que se mueva hacia adelante y hacia atrás en la pantalla. Esto lo conseguimos fácilmente indicando que {{ cssxref("animation-direction") }} es <code>alternate</code>:</p>
+
+<pre class="brush: css notranslate">p {
+  animation-duration: 3s;
+  animation-name: slidein;
+  animation-iteration-count: infinite;
+  animation-direction: alternate;
+}
+</pre>
+
+<pre class="brush: css hidden notranslate">@keyframes slidein {
+  from {
+    margin-left: 100%;
+    width: 300%;
+  }
+
+  to {
+    margin-left: 0%;
+    width: 100%;
+  }
+}
+</pre>
+
+<pre class="brush: html hidden notranslate">&lt;p&gt;The Caterpillar and Alice looked at each other for some time in silence:
+at last the Caterpillar took the hookah out of its mouth, and addressed
+her in a languid, sleepy voice.&lt;/p&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Moviendolo_hacia_adelante_y_hacia_atrás","100%","250")}}</p>
+
+<h3 id="Usando_la_versión_abreviada_animation">Usando la versión abreviada animation</h3>
+
+<p>La versión abreviada {{cssxref("animation")}} es usado para ahorrar espacio. Por ejemplo, la regla que hemos usado en este artículo:</p>
+
+<pre class="notranslate"><code>p {
+  animation-duration: 3s;
+  animation-name: slidein;
+  animation-iteration-count: infinite;
+  animation-direction: alternate;
+}</code></pre>
+
+<p>Se puede reemplazar por</p>
+
+<pre class="notranslate"><code>p {
+  animation: 3s infinite alternate slidein;
+}</code></pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota: </strong>Puedes encontrar más detalles en la página de referencia {{cssxref("animation")}} </p>
+</div>
+
+<h3 id="Estableciendo_multiples_valores_de_propiedades_animation">Estableciendo multiples valores de propiedades animation</h3>
+
+<p>Las propiedades de la versión larga de {{cssxref("animation")}} pueden aceptar múltiples valores, separados por comas - esta característica puede ser usada cuando quieres aplicar múltiples animaciones en una solo regla, y establecer por separado duration, iteration-count, etc. para diferentes animaciones. Vamos a ver algunos ejemplos rápidos para explicar las diferentes combinaciones:</p>
+
+<p>En el primer ejemplo, tenemos tres nombres de animación establecidos, pero solo una duración (duration) y número de iteraciones (iteration-count). En este caso, a las tres animaciones se les da la misma duración y número de iteraciones:</p>
+
+<pre class="notranslate"><code>animation-name: fadeInOut, moveLeft300px, bounce;
+animation-duration: 3s;
+animation-iteration-count: 1;</code>
+</pre>
+
+<p>En el segundo ejemplo, tenemos tres valores establecidos en las tres propiedades. En este caso, cada animación se ejecuta con los valores correspondientes en la misma posición en cada propiedad, así por ejemplo <code>fadeInOut</code> tiene una duración de 2.5s y 2 iteraciones, etc.</p>
+
+<pre class="notranslate"><code>animation-name: fadeInOut, moveLeft300px, bounce;
+animation-duration: 2.5s, 5s, 1s;
+animation-iteration-count: 2, 1, 5;</code></pre>
+
+<p>En el tercer caso, hay tres animaciones especificadas, pero solo dos duraciones y número de iteraciones. En los casos en donde no hay valores suficientes para dar un valor separado a cada animación, los valores se repiten de inicio a fin. Así por ejemplo, <code>fadeInOut</code> obtiene una duración de 2.5s y <code>moveLeft300px</code> obtiene una duración de 5s. Ahora tenemos asignados todos los valores de duracion disponibles, así que empezamos desde el inicio de nuevo - por lo tanto <code>bounce</code>  tiene una duración de 2.5s. El número de iteraciones (y cualquier otra propiedad que especifiques) será asignados de la misma forma.</p>
+
+<pre class="notranslate"><code>animation-name: fadeInOut, moveLeft300px, bounce;
+animation-duration: 2.5s, 5s;
+animation-iteration-count: 2, 1;</code></pre>
+
+<h3 id="Usando_eventos_de_animación">Usando eventos de animación</h3>
+
+<p>Podemos tener un control mayor sobre las animaciones (así como información útil sobre ellas) haciendo uso de eventos de animación. Dichos eventos, representados por el objeto {{ domxref("event/AnimationEvent", "AnimationEvent") }} , se pueden usar para detectar cuándo comienza la animación, cuándo termina y cuándo comienza una iteración. Cada evento incluye el momento en el que ocurrió, así como el nombre de la animación que lo desencadenó.</p>
+
+<p>Vamos a modificar el ejemplo del texto deslizante para recoger información sobre cada evento cuando suceda y asi podremos echar un vistazo a cómo funcionan.</p>
+
+<h4 id="Agregando_CSS">Agregando CSS</h4>
+
+<p>Empezamos creando el CSS para la animación. Esta animación durará 3 segundos, se llama <code>slidein</code>, se repite 3 veces, y alterna de dirección cada vez. En {{cssxref("@keyframes")}}, <code>width</code> y <code>margin-left</code> son manipulados para hacer que el elemento se deslice por la pantalla.</p>
+
+<pre class="brush: css notranslate">.slidein {
+  animation-duration: 3s;
+  animation-name: slidein;
+  animation-iteration-count: 3;
+  animation-direction: alternate;
+}
+
+@keyframes slidein {
+  from {
+    margin-left:100%;
+    width:300%
+  }
+
+  to {
+   margin-left:0%;
+   width:100%;
+ }
+}</pre>
+
+<h4 id="Añadiendo_detectores_de_eventos_a_la_animación">Añadiendo detectores de eventos a la animación</h4>
+
+<p>Usaremos un poco de Javascript para escuchar los tres posibles eventos de animación. Este código configura nuestros detectores de eventos (event listeners); los llamamos cuando el documento carga por primera vez para configurar todo.</p>
+
+<pre class="brush: js notranslate">var e = document.getElementById("watchme");
+e.addEventListener("animationstart", listener, false);
+e.addEventListener("animationend", listener, false);
+e.addEventListener("animationiteration", listener, false);
+
+e.className = "slidein";</pre>
+
+<p>Es la forma estándar de detectar eventos en Javascript, si quieres conocer más detalles sobre cómo funciona la detección de eventos, consulta la documentación de {{ domxref("element.addEventListener()") }}.</p>
+
+<p>La última línea pone la clase <code>slidein</code> al elemento para comenzar la animación. ¿Por qué?. Porque que el evento <code>animationstart</code> se dispara cuando comienza la animación y, en nuestro caso, esto sucedería antes de que nuestro código se hubiera ejecutado y no podríamos crear los detectores de eventos. Para evitarlo, creamos los detectores de eventos antes y añadimos la clase al elemento para iniciar la animación.</p>
+
+<h4 id="Recibiendo_los_eventos">Recibiendo los eventos</h4>
+
+<p>Los eventos, al irse disparando, llamarán a la función <code>listener()</code>.</p>
+
+<pre class="brush: js notranslate">function listener(e) {
+  var l = document.createElement("li");
+  switch(e.type) {
+    case "animationstart":
+      l.innerHTML = "Iniciado: tiempo transcurrido " + e.elapsedTime;
+      break;
+    case "animationend":
+      l.innerHTML = "Finalizado: tiempo transcurrido " + e.elapsedTime;
+      break;
+    case "animationiteration":
+      l.innerHTML = "Nueva iteración comenzó a los " + e.elapsedTime;
+      break;
+  }
+  document.getElementById("output").appendChild(l);
+}
+</pre>
+
+<p>Este código también es muy sencillo. Miramos en {{ domxref("event.type") }} para saber qué tipo de evento se ha disparado y, en función del tipo de evento, añadimos su correspodiente texto al elemento {{ HTMLElement("ul") }} que usaremos para registrar la actividad de nuestros eventos.</p>
+
+<p>El resultado, si todo ha ido bien, será algo parecido a esto:</p>
+
+<ul>
+ <li>Iniciado: tiempo transcurrido 0</li>
+ <li>Nueva iteración comenzó a los 3.01200008392334</li>
+ <li>Nueva iteración comenzó a los 6.00600004196167</li>
+ <li>Finalizado: tiempo transcurrido 9.234000205993652</li>
+</ul>
+
+<p>Fijémonos en que despues de la iteración final de la animación, el evento <code>animationiteration</code> no se envía, en su lugar se lanza <code>animationend</code>.</p>
+
+<h4 id="El_HTML">El HTML</h4>
+
+<p>Solo nos falta mostrar el código HTML necesario para mostrar el ejemplo en la página, incluyendo la lista en la que el script irá insertando la información de los eventos que se vayan disparando.</p>
+
+<pre class="brush: html notranslate">&lt;h1 id="watchme"&gt;Watch me move&lt;/h1&gt;
+&lt;p&gt;
+  This example shows how to use CSS animations to make &lt;code&gt;H1&lt;/code&gt;
+  elements move across the page.&lt;/p&gt;
+&lt;p&gt;
+  In addition, we output some text each time an animation event fires,
+  so you can see them in action.
+&lt;/p&gt;
+&lt;ul id="output"&gt;
+&lt;/ul&gt;
+</pre>
+
+<p>{{EmbedLiveSample('Usando_eventos_de_animación', '600', '300')}}</p>
+
+<h2 id="Te_puede_interesar_también">Te puede interesar también</h2>
+
+<ul>
+ <li>{{ domxref("AnimationEvent", "AnimationEvent") }}</li>
+ <li><a href="/en-US/docs/CSS/CSS_animations/Detecting_CSS_animation_support" title="en/CSS/CSS animations/Detecting CSS animation support">Detecting CSS animation support</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions">Using CSS transitions</a></li>
+</ul>
diff --git a/files/es/web/css/css_background_and_borders/border-image_generador/index.html b/files/es/web/css/css_background_and_borders/border-image_generador/index.html
deleted file mode 100644
index 3f189b87ea..0000000000
--- a/files/es/web/css/css_background_and_borders/border-image_generador/index.html
+++ /dev/null
@@ -1,2615 +0,0 @@
----
-title: Generador Border-image
-slug: Web/CSS/CSS_Background_and_Borders/Border-image_generador
-tags:
-  - CSS
-  - Herramientas
-translation_of: Web/CSS/CSS_Background_and_Borders/Border-image_generator
----
-<p>Esta herramienta permite generar valores para CSS3 {{cssxref("border-image")}}</p>
-<div style="display: none;">
- <h2 id="Border_Image_Generator" name="Border_Image_Generator">Border Image Generator</h2>
- <h3 id="HTML_Content">HTML Content</h3>
- <pre class="brush: html">    <div id="container">
-
-        <div id="gallery">
-            <div id="image-gallery">
-                <img class="image" src="https://mdn.mozillademos.org/files/6007/border-image-1.png">
-                <img class="image" src="https://mdn.mozillademos.org/files/6009/border-image-2.png">
-                <img class="image" src="https://mdn.mozillademos.org/files/6011/border-image-3.png">
-                <img class="image" src="https://mdn.mozillademos.org/files/6013/border-image-4.png">
-                <img class="image" src="https://mdn.mozillademos.org/files/6015/border-image-5.png">
-                <img class="image" src="https://mdn.mozillademos.org/files/6017/border-image-6.svg">
-            </div>
-        </div>
-
-        <div class="group section" id="load-actions">
-            <div id="toggle-gallery"> </div>
-            <div class="button" id="load-image"> Upload image </div>
-            <input>
-            <div class="button" id="load-remote"> </div>
-        </div>
-
-        <div class="group section" id="general-controls">
-            <div class="name"> Control Box </div>
-            <div class="separator"></div>
-            <div class="property">
-                <div class="name">scale</div>
-                <div class="ui-input-slider">
-                </div>
-            </div>
-            <div class="separator"></div>
-            <div class="property">
-                <div class="name">draggable</div>
-                <div class="ui-checkbox"></div>
-            </div>
-            <div class="property right">
-                <div class="name">section height</div>
-                <div class="ui-input-slider">
-                </div>
-            </div>
-        </div>
-
-        <div class="group section" id="preview_section">
-            <div id="subject">
-                <div class="guideline"></div>
-                <div class="guideline"></div>
-                <div class="guideline"></div>
-                <div class="guideline"></div>
-            </div>
-            <div id="preview"> </div>
-        </div>
-
-
-        <div class="group section" id="controls">
-
-
-            <div class="category" id="border-slice-control">
-                <div class="title"> border-image-slice </div>
-                <div class="property">
-                    <div class="name">fill</div>
-                    <div class="ui-checkbox"></div>
-                </div>
-            </div>
-
-
-            <div class="category" id="border-width-control">
-                <div class="title"> border-image-width </div>
-            </div>
-
-
-            <div class="category" id="border-outset-control">
-                <div class="title"> border-image-outset </div>
-            </div>
-
-
-            <div class="category" id="aditional-properties">
-                <div class="title"> aditional-properties </div>
-                <div class="property">
-                    <div class="name"> repeat-x </div>
-                    <div class="ui-dropdown border-repeat">
-                        <div>repeat</div>
-                        <div>stretch</div>
-                        <div>round</div>
-                    </div>
-                </div>
-                <div class="property">
-                    <div class="name"> repeat-y </div>
-                    <div class="ui-dropdown border-repeat">
-                        <div>repeat</div>
-                        <div>stretch</div>
-                        <div>round</div>
-                    </div>
-                </div>
-                <div class="property">
-                    <div class="ui-input-slider">
-                    </div>
-                </div>
-
-                <div class="property">
-                    <div class="ui-input-slider"></div>
-                </div>
-                <div class="property">
-                    <div class="ui-input-slider">
-                    </div>
-                </div>
-            </div>
-
-
-            <div class="category" id="output">
-                <div class="title"> CSS Code </div>
-                <div class="css-property">
-                    <span class="name"> border-image-slice: </span>
-                    <span class="value" id="out-border-slice"> </span>
-                </div>
-                <div class="css-property">
-                    <span class="name"> border-image-width: </span>
-                    <span class="value" id="out-border-width"> </span>
-                </div>
-                <div class="css-property">
-                    <span class="name"> border-image-outset: </span>
-                    <span class="value" id="out-border-outset"> </span>
-                </div>
-                <div class="css-property">
-                    <span class="name"> border-image-repeat: </span>
-                    <span class="value" id="out-border-repeat"> </span>
-                </div>
-                <div class="css-property">
-                    <span class="name"> border-image-source: </span>
-                    <span class="value" id="out-border-source">  </span>
-                </div>
-            </div>
-
-        </div>
-    </div></pre>
- <h3 id="CSS_Content">CSS Content</h3>
- <pre class="brush: css">/*  GRID OF TWELVE
- * ========================================================================== */
-
-.span_12 {
-	width: 100%;
-}
-
-.span_11 {
-	width: 91.46%;
-}
-
-.span_10 {
-	width: 83%;
-}
-
-.span_9 {
-	width: 74.54%;
-}
-
-.span_8 {
-	width: 66.08%;
-}
-
-.span_7 {
-	width: 57.62%;
-}
-
-.span_6 {
-	width: 49.16%;
-}
-
-.span_5 {
-	width: 40.7%;
-}
-
-.span_4 {
-	width: 32.24%;
-}
-
-.span_3 {
-	width: 23.78%;
-}
-
-.span_2 {
-	width: 15.32%;
-}
-
-.span_1 {
-	width: 6.86%;
-}
-
-
-/*  SECTIONS
- * ========================================================================== */
-
-.section {
-	clear: both;
-	padding: 0px;
-	margin: 0px;
-}
-
-/*  GROUPING
- * ========================================================================== */
-
-
-.group:before, .group:after {
-    content: "";
-    display: table;
-}
-
-.group:after {
-    clear:both;
-}
-
-.group {
-    zoom: 1; /* For IE 6/7 (trigger hasLayout) */
-}
-
-/*  GRID COLUMN SETUP
- * ========================================================================== */
-
-.col {
-	display: block;
-	float:left;
-	margin: 1% 0 1% 1.6%;
-}
-
-.col:first-child {
-	margin-left: 0;
-} /* all browsers except IE6 and lower */
-
-
-
-/*
- * UI Component
- */
-
-.ui-input-slider {
-	height: 20px;
-	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
-	-moz-user-select: none;
-	user-select: none;
-}
-
-.ui-input-slider * {
-	float: left;
-	height: 100%;
-	line-height: 100%;
-}
-
-/* Input Slider */
-
-.ui-input-slider &gt; input {
-	margin: 0;
-	padding: 0;
-	width: 50px;
-	text-align: center;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-.ui-input-slider-info {
-	width: 90px;
-	padding: 0px 10px 0px 0px;
-	text-align: right;
-	text-transform: lowercase;
-}
-
-.ui-input-slider-left, .ui-input-slider-right {
-	width: 16px;
-	cursor: pointer;
-	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center left no-repeat;
-}
-
-.ui-input-slider-right {
-	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center right no-repeat;
-}
-
-.ui-input-slider-name {
-	width: 90px;
-	padding: 0 10px 0 0;
-	text-align: right;
-	text-transform: lowercase;
-}
-
-.ui-input-slider-btn-set {
-	width: 25px;
-	background-color: #2C9FC9;
-	border-radius: 5px;
-	color: #FFF;
-	font-weight: bold;
-	line-height: 14px;
-	text-align: center;
-}
-
-.ui-input-slider-btn-set:hover {
-	background-color: #379B4A;
-	cursor: pointer;
-}
-
-/*************************************************************************************/
-/*************************************************************************************/
-
-/*
- * UI DropDown
- */
-
-/* Dropdown */
-
-.ui-dropdown {
-	height: 2em;
-	width: 120px;
-	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
-	font-size: 12px;
-
-	background-image: url("https://mdn.mozillademos.org/files/6037/drop_arrow_icon.png");
-	background-position: right center;
-	background-repeat: no-repeat;
-	background-color: #359740;
-
-	position: relative;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	-ms-user-select: none;
-	user-select: none;
-}
-
-.ui-dropdown:hover {
-	cursor: pointer;
-	background-color: #208B20;
-}
-
-/* Dropdown Select Button */
-
-.ui-dropdown-select {
-	height: inherit;
-	padding: 0 0.75em;
-	color: #FFF;
-	line-height: 2em;
-}
-
-/* Dropdown List */
-
-.ui-dropdown-list {
-	width: 100%;
-	height: 150px;
-	max-height: 150px;
-	margin: 0;
-	padding: 0 0.3em;
-
-	border: 3px solid #3490D2;
-	border-color: #208B20;
-	background: #666;
-	background-color: #EEF1F5;
-	color: #000;
-
-	position: absolute;
-	top: 2em;
-	left: 0;
-	z-index: 100;
-
-	overflow: hidden;
-	transition: all 0.3s;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-.ui-dropdown-list:hover {
-	overflow: auto;
-}
-
-.ui-dropdown-list[data-hidden='true'] {
-	height: 0 !important;
-	opacity: 0;
-	visibility: hidden;
-}
-
-.ui-dropdown[data-position='left'] .ui-dropdown-list {
-	left: -100%;
-	top: 0;
-}
-
-.ui-dropdown[data-position='right'] .ui-dropdown-list {
-	left: 100%;
-	top: 0;
-}
-
-.ui-dropdown-list &gt; div {
-	width: 100%;
-	height: 1.6em;
-	margin: 0.3em 0;
-	padding: 0.3em;
-	line-height: 1em;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-.ui-dropdown-list &gt; div:hover {
-	background: #3490D2;
-	color:#FFF;
-	border-radius: 2px;
-	cursor: pointer;
-}
-
-
-/*************************************************************************************/
-/*************************************************************************************/
-
-/*
- * UI Button
- */
-
-/* Checkbox */
-
-.ui-checkbox {
-	text-align: center;
-	font-size: 16px;
-	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
-	line-height: 1.5em;
-	color: #FFF;
-
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	-ms-user-select: none;
-	user-select: none;
-}
-
-.ui-checkbox &gt; input {
- 	display: none;
-}
-
-.ui-checkbox &gt; label {
-	font-size: 12px;
-	padding: 0.333em 1.666em 0.5em;
-	height: 1em;
-	line-height: 1em;
-
-	background-color: #888;
-	background-image: url("https://mdn.mozillademos.org/files/5683/disabled.png");
-	background-position: center center;
-	background-repeat: no-repeat;
-
-	color: #FFF;
-	border-radius: 2px;
-	font-weight: bold;
-	float: left;
-}
-
-.ui-checkbox .text {
-	padding-left: 34px;
-	background-position: center left 10px;
-}
-
-.ui-checkbox .left {
-	padding-right: 34px;
-	padding-left: 1.666em;
-	background-position: center right 10px;
-}
-
-.ui-checkbox &gt; label:hover {
-	cursor: pointer;
-}
-
-.ui-checkbox &gt; input:checked + label {
-	background-image: url("https://mdn.mozillademos.org/files/5681/checked.png");
-	background-color: #379B4A;
-}
-
-/*************************************************************************************/
-/*************************************************************************************/
-
-/*
- * BORDER IMAGE GENERATOR TOOL
- */
-
-body {
-	width: 100%;
-	margin: 0 auto;
-	padding: 0 0 20px 0;
-
-	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
-
-	/*background: url("https://mdn.mozillademos.org/files/6025/grain.png");*/
-	border: 1px solid #EEE;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	-ms-user-select: none;
-	user-select: none;
-}
-
-body[data-move='X'] {
-	cursor: w-resize !important;
-}
-
-body[data-move='Y'] {
-	cursor: s-resize !important;
-}
-
-#container {
-	width: 100%;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-[data-draggable='true']:hover {
-	cursor: move;
-}
-
-[data-draggable='true']:hover &gt; * {
-	cursor: default;
-}
-
-
-
-/******************************************************************************/
-/******************************************************************************/
-
-/*
- * Border Image Picker
- */
-
-#gallery {
-	box-shadow: 0 0 3px 0 #BABABA;
-}
-
-#image-gallery {
-	width: 600px;
-	height: 100px;
-	margin: 0 auto;
-	transition: margin 0.4s;
-}
-
-#image-gallery .image {
-	height: 80px;
-	float: left;
-	margin: 10px;
-	opacity: 0.5;
-	background-color: #FFF;
-	box-shadow: 0px 0px 3px 1px #BABABA;
-}
-
-#image-gallery .image[selected="true"] {
-	box-shadow: 0px 0px 3px 1px #3BBA52;
-	opacity: 1;
-}
-
-#image-gallery .image:hover {
-	cursor: pointer;
-	box-shadow: 0px 0px 3px 1px #30ACE5;
-	opacity: 1;
-}
-
-#image-gallery[data-collapsed='true'] {
-	margin-top: -100px;
-}
-
-/* Load Menu */
-
-#load-actions {
-	margin: 10px 0;
-}
-
-#toggle-gallery {
-	width: 30px;
-	height: 25px;
-	margin: 10px;
-	color: #FFF;
-
-	background-image: url('https://mdn.mozillademos.org/files/6005/arrow-up-white.png');
-	background-repeat: no-repeat;
-	background-position: top 4px center;
-	background-color: #888888 !important;
-
-	border-radius: 2px;
-	float: left;
-}
-
-#toggle-gallery:hover {
-	cursor: pointer;
-}
-
-#toggle-gallery[data-action='show'] {
-	background-image: url('https://mdn.mozillademos.org/files/6001/arrow-down-white.png');
-	background-color: #888888 !important;
-}
-
-#toggle-gallery[data-action='hide'] {
-	background-image: url('https://mdn.mozillademos.org/files/6005/arrow-up-white.png');
-}
-
-.button {
-	width: 100px;
-	height: 25px;
-	margin: 10px;
-	color: #FFF;
-	text-align: center;
-	font-size: 12px;
-	line-height: 25px;
-	background-color: #379B4A;
-	border-radius: 2px;
-	float: left;
-}
-
-.button:hover {
-	cursor: pointer;
-	background-color: #3380C4;
-}
-
-#load-image {
-	float: left;
-}
-
-#load-remote {
-	width: 30px;
-	background-image: url('https://mdn.mozillademos.org/files/6003/arrow-right-white.png');
-	background-repeat: no-repeat;
-	background-position: center center;
-}
-
-#remote-url {
-	width: 200px;
-	height: 23px;
-	margin: 10px;
-	padding: 0 5px;
-	border: 1px solid #379B4A;
-	border-radius: 2px;
-	float: left;
-
-	transition: width 0.5s;
-}
-
-#remote-url:focus {
-	box-shadow: 0px 0px 3px -1px #379B4A; /*#68ACE8; */
-	border-color: rgba(55, 155, 74, 0.5);
-	width: 450px;
-}
-
-/*
- * Visible Area
- */
-
-#preview_section {
-	position: relative;
-	min-height: 400px;
-}
-
-/* Image Control */
-
-#subject {
-	width: 300px;
-	height: 300px;
-	background-repeat: no-repeat;
-	background-size: 100%;
-	background-color: #FFF;
-	border: 1px solid #CCC;
-
-	position: absolute;
-	z-index: 10;
-	top: 15%;
-	left: 10%;
-
-	box-shadow: 0 0 3px 0 #BABABA;
-	transition-property: width, height;
-	transition-duration: 0.1s;
-}
-
-#subject .guideline {
-	background-color: rgba(255, 255, 255, 0.7);
-	border: 1px solid rgba(0, 0, 0, 0.3);
-	position: absolute;
-}
-
-#subject .guideline:hover {
-	background-color: #F00;
-}
-
-#subject .guideline[data-active] {
-	background-color: #F00;
-	z-index: 10;
-}
-
-#subject .guideline[data-axis='X'] {
-	width: 1px;
-	height: 100%;
-	top: -1px;
-}
-
-#subject .guideline[data-axis='Y'] {
-	width: 100%;
-	height: 1px;
-	left: -1px;
-}
-
-#subject .guideline[data-axis='X']:hover {
-	cursor: w-resize;
-}
-
-#subject .guideline[data-axis='Y']:hover {
-	cursor: s-resize;
-}
-
-
-#subject .relative {
-	position: relative;
-	font-size: 12px;
-}
-
-#subject .tooltip, #subject .tooltip2 {
-	width: 40px;
-	height: 20px;
-	line-height: 20px;
-	font-size: 12px;
-	text-align: center;
-
-	position: absolute;
-	opacity: 0.5;
-	transition: opacity 0.25s;
-}
-
-#subject .tooltip {
-	background: #EEE;
-	border-radius: 2px;
-	border: 1px solid #CCC;
-}
-
-#subject .tooltip2{
-	color: #555;
-}
-
-#subject [data-active] &gt; * {
-	opacity: 1;
-}
-
-#subject .tooltip[data-info='top'] {
-	top: -10px;
-	right: -50px;
-}
-
-#subject .tooltip[data-info='right'] {
-	bottom: -30px;
-	right: -20px;
-}
-
-#subject .tooltip[data-info='bottom'] {
-	top: -10px;
-	left: -50px;
-}
-
-#subject .tooltip[data-info='left'] {
-	top: -30px;
-	right: -20px;
-}
-
-#subject .tooltip2[data-info='top'] {
-	top: -10px;
-	left: -50px;
-}
-
-#subject .tooltip2[data-info='right'] {
-	top: -30px;
-	right: -20px;
-}
-
-#subject .tooltip2[data-info='bottom'] {
-	top: -10px;
-	right: -50px;
-}
-
-#subject .tooltip2[data-info='left'] {
-	bottom: -30px;
-	right: -20px;
-}
-
-/* Preview */
-
-#preview {
-	width: 30%;
-	height: 50%;
-	background-color: #FFF;
-	text-align: center;
-	overflow: hidden;
-	position: absolute;
-	z-index: 10;
-
-	left: 60%;
-	top: 15%;
-
-	border-radius: 2px;
-	border-image-width: 20px;
-	border-image-repeat: round;
-	box-shadow: 0 0 3px 0 #BABABA;
-}
-
-#preview .resize-handle {
-	width: 10px;
-	height: 10px;
-	background: url("https://mdn.mozillademos.org/files/6027/resize.png") center center no-repeat;
-	position: absolute;
-	bottom: 0;
-	right: 0;
-}
-
-#preview .resize-handle:hover {
-	cursor: nw-resize;
-}
-
-
-/*
- * General controls MENU
- */
-
-#general-controls {
-	padding: 10px 30px;
-	background-color: #FFF;
-	opacity: 0.95;
-	color: #888;
-	/*border-radius: 2px;*/
-	box-shadow: 0 0 3px 0 #BABABA;
-}
-
-#general-controls .property {
-	width: 130px;
-	float: left;
-}
-
-#general-controls .name {
-	height: 20px;
-	margin: 0 10px 0 0;
-	line-height: 100%;
-	text-align: right;
-	float: left;
-}
-
-#general-controls .right {
-	width: 200px;
-	float: right;
-}
-
-#general-controls .ui-checkbox label {
-	height: 10px;
-}
-
-#general-controls .separator {
-	height: 40px;
-	width: 1px;
-	margin: -10px 15px;
-	background-color: #EEE;
-	float: left;
-}
-
-/*
- * Controls
- */
-
-#controls {
-	color: #444;
-	margin: 10px 0 0 0;
-}
-
-#controls .category {
-	height: 190px;
-	min-width: 260px;
-	margin: 10px;
-	padding: 10px;
-	border: 1px solid #CCC;
-	border-radius: 3px;
-	float: left;
-
-	box-shadow: 0 0 3px 0 #BABABA;
-	transition: all 0.25s;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-@media (min-width: 880px) {
-	#controls .category {
-		width: 30%;
-		margin-left: 1.66%;
-		margin-right: 1.66%;
-	}
-}
-
-@media (max-width: 879px) {
-	#controls .category {
-		width: 37%;
-		margin-left: 6.5%;
-		margin-right: 6.5%;
-	}
-}
-
-#controls .category .title {
-	width: 100%;
-	height: 30px;
-	margin: 0 0 10px 0;
-	line-height: 25px;
-
-	text-align: center;
-	color: #AAA;
-}
-
-#controls .category:hover .title {
-	color: #777;
-}
-
-#controls .category &gt; .group {
-	border: 1px solid #CCC;
-	border-radius: 2px;
-}
-
-
-/* property */
-
-#controls .property {
-	width: 250px;
-	height: 20px;
-	margin: 5px auto;
-}
-
-#controls .property .ui-input-slider {
-	margin: 0;
-	float: left;
-}
-
-#controls .property .ui-input-slider-info {
-	width: 60px;
-}
-
-#controls .property .ui-input-slider-left {
-	transition: opacity 0.15s;
-    opacity: 0;
-}
-
-#controls .property .ui-input-slider-right {
-	transition: opacity 0.15s;
-    opacity: 0;
-}
-
-#controls .property .name {
-	width: 60px;
-	height: 20px;
-	padding: 0px 10px 0px 0px;
-	text-align: right;
-	line-height: 100%;
-	float: left;
-}
-
-#controls .property .config {
-	width: 20px;
-	height: 20px;
-	float: left;
-	background: url("https://mdn.mozillademos.org/files/6021/config.png") center center no-repeat;
-	opacity: 0.5;
-}
-
-#controls .property .config:hover {
-	cursor: pointer;
-	opacity: 1;
-}
-
-#controls .ui-input-slider:hover .ui-input-slider-right {
-    opacity: 1;
-}
-
-#controls .ui-input-slider:hover .ui-input-slider-left {
-    opacity: 1;
-}
-
-#controls .property .ui-dropdown {
-	margin: 0 10px;
-	float: left;
-}
-
-
-#controls .property .ui-checkbox {
-	margin: 0 0 0 16px;
-	float: left;
-}
-
-#controls .property .ui-checkbox label {
-	height: 0.85em;
-	width: 10px;
-}
-
-/* dropdowns */
-#controls .ui-dropdown {
-	width: 50px;
-	height: 1.7em;
-	border-radius: 2px;
-}
-
-#controls .ui-dropdown-select {
-	line-height: 1.6em;
-}
-
-#controls .ui-dropdown-list {
-	top: 20px;
-}
-
-#controls .ui-dropdown-list {
-	border-width: 1px;
-	text-align: center;
-}
-
-#controls .ui-dropdown-list:hover {
-	overflow: hidden;
-}
-
-#controls .border-repeat {
-	margin: 0 0 0 16px !important;
-	width: 80px;
-}
-
-#controls .border-repeat .ui-dropdown-list {
-	height: 6.2em;
-	border-width: 1px;
-	text-align: center;
-}
-
-/* border-image-slice */
-
-
-#border-slice-control .ui-dropdown-list {
-	height: 4.3em;
-}
-
-/* border-image-width */
-
-#border-width-control .ui-dropdown-list {
-	height: 6.2em;
-}
-
-/* border-image-outset */
-
-#border-outset-control .ui-dropdown-list {
-	height: 4.3em;
-}
-
-#aditional-properties .property {
-	width: 200px;
-}
-
-#aditional-properties .ui-input-slider &gt; input {
-	width: 80px !important;
-}
-
-/* unit settings panel */
-
-#unit-settings {
-	padding: 10px;
-	position: absolute;
-
-	background: #FFF;
-
-	font-size: 12px;
-	border-radius: 3px;
-	border: 1px solid #CCC;
-	text-align: center;
-	color: #555;
-
-	position: absolute;
-	z-index: 1000;
-
-	box-shadow: 0 0 3px 0 #BABABA;
-	transition: all 0.25s;
-}
-
-#unit-settings .title {
-	width: 100%;
-	margin: -5px auto 0;
-
-	color: #666;
-	font-size: 14px;
-	font-weight: bold;
-	line-height: 25px;
-	border-bottom: 1px solid #E5E5E5;
-}
-
-#unit-settings .ui-input-slider {
-	margin: 10px 0 0 0;
-}
-
-#unit-settings .ui-input-slider-info {
-	width: 50px;
-	line-height: 1.5em;
-}
-
-#unit-settings input {
-	font-size: 12px;
-	width: 40px !important;
-}
-
-#unit-settings .close {
-	width: 16px;
-	height: 16px;
-	background: url('https://mdn.mozillademos.org/files/6019/close.png') no-repeat center center;
-	background-size: 75%;
-
-	position: absolute;
-	top: 4px;
-	right: 4px;
-	opacity: 0.5;
-}
-
-#unit-settings .close:hover {
-	cursor: pointer;
-	opacity: 1;
-}
-
-#unit-settings[data-active='true'] {
-	opacity: 1;
-}
-
-#unit-settings[data-active='false'] {
-	opacity: 0;
-	top: -100px !important;
-}
-
-/*
- * CSS Output Code
- */
-
-#output {
-	padding: 10px;
-	border: 2px dashed #888 !important;
-	box-shadow: none !important;
-	border-radius: 3px;
-	overflow: hidden;
-
-	-moz-user-select: text;
-	-webkit-user-select: text;
-	-ms-user-select: text;
-	user-select: text;
-}
-
-
-@media (min-width: 880px) {
-	#output {
-		width: 63.33% !important;
-	}
-}
-
-@media (max-width: 879px) {
-	#output {
-		width: 87% !important;
-	}
-}
-
-
-#output .title {
-	width: 100%;
-	height: 30px;
-	margin: 0 0 10px 0;
-	line-height: 25px;
-
-	text-align: center;
-	color: #AAA;
-}
-
-#output .css-property {
-	width: 100%;
-	margin: 0;
-	color: #555;
-	font-size: 14px;
-	line-height: 18px;
-	float: left;
-}
-
-#output .css-property .name {
-	width: 30%;
-	font-weight: bold;
-	text-align: right;
-	float: left;
-}
-
-#output .css-property .value {
-	width: 65%;
-	padding: 0 2.5%;
-	word-break: break-all;
-	float: left;
-}
-
-</pre>
- <h3 id="JavaScript_Content">JavaScript Content</h3>
- <pre class="brush: js">'use strict';
-
-/**
- * UI-SlidersManager
- */
-
-var InputSliderManager = (function InputSliderManager() {
-
-	var subscribers = {};
-	var sliders = [];
-
-	var InputComponent = function InputComponent(obj) {
-		var input = document.createElement('input');
-		input.setAttribute('type', 'text');
-		input.style.width = 50 + obj.precision * 10 + 'px';
-
-		input.addEventListener('click', function(e) {
-			this.select();
-		});
-
-		input.addEventListener('change', function(e) {
-			var value = parseFloat(e.target.value);
-
-			if (isNaN(value) === true)
-				setValue(obj.topic, obj.value);
-			else
-				setValue(obj.topic, value);
-		});
-
-		return input;
-	};
-
-	var SliderComponent = function SliderComponent(obj, sign) {
-		var slider = document.createElement('div');
-		var startX = null;
-		var start_value = 0;
-
-		slider.addEventListener("click", function(e) {
-			document.removeEventListener("mousemove", sliderMotion);
-			setValue(obj.topic, obj.value + obj.step * sign);
-		});
-
-		slider.addEventListener("mousedown", function(e) {
-			startX = e.clientX;
-			start_value = obj.value;
-			document.body.style.cursor = "e-resize";
-
-			document.addEventListener("mouseup", slideEnd);
-			document.addEventListener("mousemove", sliderMotion);
-		});
-
-		var slideEnd = function slideEnd(e) {
-			document.removeEventListener("mousemove", sliderMotion);
-			document.body.style.cursor = "auto";
-			slider.style.cursor = "pointer";
-		};
-
-		var sliderMotion = function sliderMotion(e) {
-			slider.style.cursor = "e-resize";
-			var delta = (e.clientX - startX) / obj.sensivity | 0;
-			var value = delta * obj.step + start_value;
-			setValue(obj.topic, value);
-		};
-
-		return slider;
-	};
-
-	var InputSlider = function(node) {
-		var min		= parseFloat(node.getAttribute('data-min'));
-		var max		= parseFloat(node.getAttribute('data-max'));
-		var step	= parseFloat(node.getAttribute('data-step'));
-		var value	= parseFloat(node.getAttribute('data-value'));
-		var topic	= node.getAttribute('data-topic');
-		var unit	= node.getAttribute('data-unit');
-		var name 	= node.getAttribute('data-info');
-		var sensivity = node.getAttribute('data-sensivity') | 0;
-		var precision = node.getAttribute('data-precision') | 0;
-
-		this.min = isNaN(min) ? 0 : min;
-		this.max = isNaN(max) ? 100 : max;
-		this.precision = precision &gt;= 0 ? precision : 0;
-		this.step = step &lt; 0 || isNaN(step) ? 1 : step.toFixed(precision);
-		this.topic = topic;
-		this.node = node;
-		this.unit = unit === null ? '' : unit;
-		this.sensivity = sensivity &gt; 0 ? sensivity : 5;
-		value = isNaN(value) ? this.min : value;
-
-		var input = new InputComponent(this);
-		var slider_left  = new SliderComponent(this, -1);
-		var slider_right = new SliderComponent(this,  1);
-
-		slider_left.className = 'ui-input-slider-left';
-		slider_right.className = 'ui-input-slider-right';
-
-		if (name) {
-			var info = document.createElement('span');
-			info.className = 'ui-input-slider-info';
-			info.textContent = name;
-			node.appendChild(info);
-		}
-
-		node.appendChild(slider_left);
-		node.appendChild(input);
-		node.appendChild(slider_right);
-
-		this.input = input;
-		sliders[topic] = this;
-		setValue(topic, value);
-	};
-
-	InputSlider.prototype.setInputValue = function setInputValue() {
-		this.input.value = this.value.toFixed(this.precision) + this.unit;
-	};
-
-	var setValue = function setValue(topic, value, send_notify) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		value = parseFloat(value.toFixed(slider.precision));
-
-		if (value &gt; slider.max) value = slider.max;
-		if (value &lt; slider.min)	value = slider.min;
-
-		slider.value = value;
-		slider.node.setAttribute('data-value', value);
-
-		slider.setInputValue();
-
-		if (send_notify === false)
-			return;
-
-		notify.call(slider);
-	};
-
-	var setMax = function setMax(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.max = value;
-		setValue(topic, slider.value);
-	};
-
-	var setMin = function setMin(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.min = value;
-		setValue(topic, slider.value);
-	};
-
-	var setUnit = function setUnit(topic, unit) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.unit = unit;
-		setValue(topic, slider.value);
-	};
-
-	var setStep = function setStep(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.step = parseFloat(value);
-		setValue(topic, slider.value);
-	};
-
-	var setPrecision = function setPrecision(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		value = value | 0;
-		slider.precision = value;
-
-		var step = parseFloat(slider.step.toFixed(value));
-		if (step === 0)
-			slider.step = 1 / Math.pow(10, value);
-
-		setValue(topic, slider.value);
-	};
-
-	var setSensivity = function setSensivity(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		value = value | 0;
-
-		slider.sensivity = value &gt; 0 ? value : 5;
-	};
-
-	var getNode =  function getNode(topic) {
-		return sliders[topic].node;
-	};
-
-	var getPrecision =  function getPrecision(topic) {
-		return sliders[topic].precision;
-	};
-
-	var getStep =  function getStep(topic) {
-		return sliders[topic].step;
-	};
-
-	var subscribe = function subscribe(topic, callback) {
-		if (subscribers[topic] === undefined)
-			subscribers[topic] = [];
-		subscribers[topic].push(callback);
-	};
-
-	var unsubscribe = function unsubscribe(topic, callback) {
-		subscribers[topic].indexOf(callback);
-		subscribers[topic].splice(index, 1);
-	};
-
-	var notify = function notify() {
-		if (subscribers[this.topic] === undefined)
-			return;
-		for (var i = 0; i &lt; subscribers[this.topic].length; i++)
-			subscribers[this.topic][i](this.value);
-	};
-
-	var createSlider = function createSlider(topic, label) {
-		var slider = document.createElement('div');
-		slider.className = 'ui-input-slider';
-		slider.setAttribute('data-topic', topic);
-
-		if (label !== undefined)
-			slider.setAttribute('data-info', label);
-
-		new InputSlider(slider);
-		return slider;
-	};
-
-	var init = function init() {
-		var elem = document.querySelectorAll('.ui-input-slider');
-		var size = elem.length;
-		for (var i = 0; i &lt; size; i++)
-			new InputSlider(elem[i]);
-	};
-
-	return {
-		init : init,
-		setMax : setMax,
-		setMin : setMin,
-		setUnit : setUnit,
-		setStep : setStep,
-		getNode : getNode,
-		getStep : getStep,
-		setValue : setValue,
-		subscribe : subscribe,
-		unsubscribe : unsubscribe,
-		setPrecision : setPrecision,
-		setSensivity : setSensivity,
-		getPrecision : getPrecision,
-		createSlider : createSlider,
-	};
-
-})();
-
-
-/**
- * UI-DropDown Select
- */
-
-var DropDownManager = (function DropdownManager() {
-
-	var subscribers = {};
-	var dropdowns = [];
-	var active = null;
-
-	var visbility = ["hidden", "visible"];
-
-
-	var DropDown = function DropDown(node) {
-		var topic = node.getAttribute('data-topic');
-		var label = node.getAttribute('data-label');
-		var selected = node.getAttribute('data-selected') | 0;
-
-		var select = document.createElement('div');
-		var list = document.createElement('div');
-		var uval = 0;
-		var option = null;
-		var option_value = null;
-
-		list.className = 'ui-dropdown-list';
-		select.className = 'ui-dropdown-select';
-
-		while (node.firstElementChild !== null) {
-			option = node.firstElementChild;
-			option_value = option.getAttribute('data-value');
-
-			if (option_value === null)
-				option.setAttribute('data-value', uval);
-
-			list.appendChild(node.firstElementChild);
-			uval++;
-		}
-
-		node.appendChild(select);
-		node.appendChild(list);
-
-		select.onclick = this.toggle.bind(this);
-		list.onclick = this.updateValue.bind(this);
-		document.addEventListener('click', clickOut);
-
-		this.state = 0;
-		this.time = 0;
-		this.dropmenu = list;
-		this.select = select;
-		this.toggle(false);
-		this.value = {};
-		this.topic = topic;
-
-		if (label)
-			select.textContent = label;
-		else
-			this.setNodeValue(list.children[selected]);
-
-		dropdowns[topic] = this;
-
-	};
-
-	DropDown.prototype.toggle = function toggle(state) {
-		if (typeof(state) === 'boolean')
-			this.state = state === false ? 0 : 1;
-		else
-			this.state = 1 ^ this.state;
-
-		if (active !== this) {
-			if (active)
-				active.toggle(false);
-			active = this;
-		}
-
-		if (this.state === 0)
-			this.dropmenu.setAttribute('data-hidden', 'true');
-		else
-			this.dropmenu.removeAttribute('data-hidden');
-
-	};
-
-	var clickOut = function clickOut(e) {
-		if (active.state === 0 ||
-			e.target === active.dropmenu ||
-			e.target === active.select)
-			return;
-
-		active.toggle(false);
-	};
-
-	DropDown.prototype.updateValue = function updateValue(e) {
-
-		if (Date.now() - this.time &lt; 500)
-			return;
-
-		if (e.target.className !== "ui-dropdown-list") {
-			this.setNodeValue(e.target);
-			this.toggle(false);
-		}
-
-		this.time = Date.now();
-	};
-
-	DropDown.prototype.setNodeValue = function setNodeValue(node) {
-		this.value['name'] = node.textContent;
-		this.value['value'] = node.getAttribute('data-value');
-
-		this.select.textContent = node.textContent;
-		this.select.setAttribute('data-value', this.value['value']);
-
-		notify.call(this);
-	};
-
-	var createDropDown = function createDropDown(topic, options) {
-
-		var dropdown = document.createElement('div');
-		dropdown.setAttribute('data-topic', topic);
-		dropdown.className = 'ui-dropdown';
-
-		for (var i in options) {
-			var x = document.createElement('div');
-			x.setAttribute('data-value', i);
-			x.textContent = options[i];
-			dropdown.appendChild(x);
-		}
-
-		new DropDown(dropdown);
-
-		return dropdown;
-	};
-
-	var setValue = function setValue(topic, index) {
-		if (dropdowns[topic] === undefined ||
-			index &gt;= dropdowns[topic].dropmenu.children.length)
-			return;
-
-		dropdowns[topic].setNodeValue(dropdowns[topic].dropmenu.children[index]);
-	};
-
-	var subscribe = function subscribe(topic, callback) {
-		if (subscribers[topic] === undefined)
-			subscribers[topic] = [];
-		subscribers[topic].push(callback);
-	};
-
-	var unsubscribe = function unsubscribe(topic, callback) {
-		var index = subscribers[topic].indexOf(callback);
-		subscribers[topic].splice(index, 1);
-	};
-
-	var notify = function notify() {
-		if (subscribers[this.topic] === undefined)
-			return;
-
-		for (var i in subscribers[this.topic]) {
-			subscribers[this.topic][i](this.value);
-		}
-	};
-
-	var init = function init() {
-		var elem, size;
-
-		elem = document.querySelectorAll('.ui-dropdown');
-		size = elem.length;
-		for (var i = 0; i &lt; size; i++)
-			new DropDown(elem[i]);
-
-	};
-
-	return {
-		init : init,
-		setValue : setValue,
-		subscribe : subscribe,
-		unsubscribe : unsubscribe,
-		createDropDown : createDropDown
-	};
-
-})();
-
-
-/**
- * UI-ButtonManager
- */
-
-var ButtonManager = (function CheckBoxManager() {
-
-	var subscribers = [];
-	var buttons = [];
-
-	var CheckBox = function CheckBox(node) {
-		var topic = node.getAttribute('data-topic');
-		var state = node.getAttribute('data-state');
-		var name = node.getAttribute('data-label');
-		var align = node.getAttribute('data-text-on');
-
-		state = (state === "true");
-
-		var checkbox = document.createElement("input");
-		var label = document.createElement("label");
-
-		var id = 'checkbox-' + topic;
-		checkbox.id = id;
-		checkbox.setAttribute('type', 'checkbox');
-		checkbox.checked = state;
-
-		label.setAttribute('for', id);
-		if (name) {
-			label.className = 'text';
-			if (align)
-				label.className += ' ' + align;
-			label.textContent = name;
-		}
-
-		node.appendChild(checkbox);
-		node.appendChild(label);
-
-		this.node = node;
-		this.topic = topic;
-		this.checkbox = checkbox;
-
-		checkbox.addEventListener('change', function(e) {
-			notify.call(this);
-		}.bind(this));
-
-		buttons[topic] = this;
-	};
-
-	var getNode =  function getNode(topic) {
-		return buttons[topic].node;
-	};
-
-	var setValue = function setValue(topic, value) {
-		var obj = buttons[topic];
-		if (obj === undefined)
-			return;
-
-		obj.checkbox.checked = value;
-		notify.call(obj);
-	};
-
-	var subscribe = function subscribe(topic, callback) {
-		if (subscribers[topic] === undefined)
-			subscribers[topic] = [];
-
-		subscribers[topic].push(callback);
-	};
-
-	var unsubscribe = function unsubscribe(topic, callback) {
-		subscribers[topic].indexOf(callback);
-		subscribers[topic].splice(index, 1);
-	};
-
-	var notify = function notify() {
-		if (subscribers[this.topic] === undefined)
-			return;
-		for (var i = 0; i &lt; subscribers[this.topic].length; i++)
-			subscribers[this.topic][i](this.checkbox.checked);
-	};
-
-	var init = function init() {
-		var elem = document.querySelectorAll('.ui-checkbox');
-		var size = elem.length;
-		for (var i = 0; i &lt; size; i++)
-			new CheckBox(elem[i]);
-	};
-
-	return {
-		init : init,
-		setValue : setValue,
-		subscribe : subscribe,
-		unsubscribe : unsubscribe
-	};
-
-})();
-
-window.addEventListener("load", function() {
-	BorderImage.init();
-});
-
-var BorderImage = (function BorderImage() {
-
-	var getElemById = document.getElementById.bind(document);
-
-	var subject;
-	var preview;
-	var guidelines = [];
-	var positions = ['top', 'right', 'bottom', 'left'];
-
-	var makeDraggable = function makeDraggable(elem) {
-
-		var offsetTop;
-		var offsetLeft;
-
-		elem.setAttribute('data-draggable', 'true');
-
-		var dragStart = function dragStart(e) {
-			if (e.target.getAttribute('data-draggable') !== 'true' ||
-				e.target !== elem || e.button !== 0)
-				return;
-
-			offsetLeft = e.clientX - elem.offsetLeft;
-			offsetTop = e.clientY - elem.offsetTop;
-
-			document.addEventListener('mousemove', mouseDrag);
-			document.addEventListener('mouseup', dragEnd);
-		};
-
-		var dragEnd = function dragEnd(e) {
-			if (e.button !== 0)
-				return;
-
-			document.removeEventListener('mousemove', mouseDrag);
-			document.removeEventListener('mouseup', dragEnd);
-		};
-
-		var mouseDrag = function mouseDrag(e) {
-
-			elem.style.left = e.clientX - offsetLeft + 'px';
-			elem.style.top = e.clientY - offsetTop + 'px';
-		};
-
-		elem.addEventListener('mousedown', dragStart, false);
-	};
-
-	var PreviewControl = function PreviewControl() {
-
-		var dragging = false;
-		var valueX = null;
-		var valueY = null;
-
-		var dragStart = function dragStart(e) {
-			if (e.button !== 0)
-				return;
-
-			valueX = e.clientX - preview.clientWidth;
-			valueY = e.clientY - preview.clientHeight;
-			dragging = true;
-
-			document.addEventListener('mousemove', mouseDrag);
-		};
-
-		var dragEnd = function dragEnd(e) {
-			if (e.button !== 0 || dragging === false)
-				return;
-
-			document.removeEventListener('mousemove', mouseDrag);
-			dragging = false;
-		};
-
-		var mouseDrag = function mouseDrag(e) {
-			InputSliderManager.setValue('preview-width', e.clientX - valueX);
-			InputSliderManager.setValue('preview-height', e.clientY - valueY);
-		};
-
-		var init = function init() {
-
-			makeDraggable(preview);
-			makeDraggable(subject);
-
-			var handle = document.createElement('div');
-			handle.className = 'resize-handle';
-
-			handle.addEventListener('mousedown', dragStart);
-			document.addEventListener('mouseup', dragEnd);
-
-			preview.appendChild(handle);
-
-		};
-
-		return {
-			init: init
-		};
-
-	}();
-
-	var ImageReader = (function ImageReader() {
-
-		var fReader = new FileReader();
-		var browse = document.createElement('input');
-
-		var loadImage = function loadImage(e) {
-			if (browse.files.length === 0)
-				return;
-
-			var file = browse.files[0];
-
-			if (file.type.slice(0, 5) !== 'image')
-				return;
-
-			fReader.readAsDataURL(file);
-
-			return false;
-		};
-
-		fReader.onload = function(e) {
-			ImageControl.loadRemoteImage(e.target.result);
-		};
-
-		var load = function load() {
-			browse.click();
-		};
-
-		browse.setAttribute('type', 'file');
-		browse.style.display = 'none';
-		browse.onchange = loadImage;
-
-		return {
-			load: load
-		};
-
-	})();
-
-	var ImageControl = (function ImageControl() {
-
-		var scale = 0.5;
-		var imgSource = new Image();
-		var imgState = null;
-		var selected = null;
-
-
-		var topics = ['slice', 'width', 'outset'];
-		var properties = {};
-		properties['border1'] = {
-			fill			: false,
-
-			slice_values	: [27, 27, 27, 27],
-			width_values	: [20, 20, 20, 20],
-			outset_values	: [0, 0, 0, 0],
-
-			slice_units		: [0, 0, 0, 0],
-			width_units		: [0, 0, 0, 0],
-			outset_units	: [0, 0, 0, 0],
-
-			repeat			: [1, 1],
-			size			: [300, 200],
-			preview_area	: 400
-		};
-
-		properties['border2'] = {
-			fill			: false,
-
-			slice_values	: [33, 33, 33, 33],
-			width_values	: [1.5, 1.5, 1.5, 1.5],
-			outset_values	: [0, 0, 0, 0],
-
-			slice_units		: [1, 1, 1, 1],
-			width_units		: [2, 2, 2, 2],
-			outset_units	: [0, 0, 0, 0],
-
-			repeat			: [2, 2],
-			size			: [300, 200],
-			preview_area	: 400
-		};
-
-		properties['border3'] = {
-			fill			: true,
-
-			slice_values	: [15, 15, 15, 15],
-			width_values	: [10, 10, 10, 10],
-			outset_values	: [0, 0, 0, 0],
-
-			slice_units		: [0, 0, 0, 0],
-			width_units		: [0, 0, 0, 0],
-			outset_units	: [0, 0, 0, 0],
-
-			repeat			: [2, 2],
-			size			: [300, 200],
-			preview_area	: 400
-		};
-
-		properties['border4'] = {
-			fill			: false,
-
-			slice_values	: [13, 13, 13, 13],
-			width_values	: [13, 13, 13, 13],
-			outset_values	: [13, 13, 13, 13],
-
-			slice_units		: [0, 0, 0, 0],
-			width_units		: [0, 0, 0, 0],
-			outset_units	: [0, 0, 0, 0],
-
-			repeat			: [0, 0],
-			size			: [300, 200],
-			preview_area	: 400
-		};
-
-		properties['border5'] = {
-			fill			: false,
-
-			slice_values	: [0, 12, 0, 12],
-			width_values	: [0, 12, 0, 12],
-			outset_values	: [0, 0, 0, 0],
-
-			slice_units		: [0, 0, 0, 0],
-			width_units		: [0, 0, 0, 0],
-			outset_units	: [0, 0, 0, 0],
-
-			repeat			: [0, 0],
-			size			: [300, 200],
-			preview_area	: 400,
-		};
-
-		properties['border6'] = {
-			fill			: false,
-
-			slice_values	: [42, 42, 42, 42],
-			width_values	: [42, 42, 42, 42],
-			outset_values	: [0, 0, 0, 0],
-
-			slice_units		: [0, 0, 0, 0],
-			width_units		: [0, 0, 0, 0],
-			outset_units	: [0, 0, 0, 0],
-
-			repeat			: [2, 2],
-			size			: [350, 350],
-			preview_area	: 500,
-		};
-
-
-		var loadLocalImage = function loadLocalImage(source) {
-			var location = "images/" + source;
-			imgSource.src = location;
-		};
-
-		var loadRemoteImage = function loadRemoteImage(source) {
-			imgSource.src = source;
-			if (selected)
-				selected.removeAttribute('selected');
-			Tool.setOutputCSS('source', 'url("' + source + '")');
-		};
-
-		var pickImage = function pickImage(e) {
-			if (e.target.className === 'image') {
-				selected = e.target;
-				selected.setAttribute('selected', 'true');
-				loadRemoteImage(e.target.src);
-				imgState = e.target.getAttribute('data-stateID');
-			}
-		};
-
-		var loadImageState = function loadImageState(stateID) {
-			if (properties[stateID] === undefined)
-				return;
-
-			var prop = properties[stateID];
-			var topic;
-			var unit_array;
-			var value_array;
-
-			for (var i in topics) {
-				for (var j=0; j&lt;4; j++) {
-					topic = topics[i] + '-' + positions[j];
-					unit_array = topics[i] + '_units';
-					value_array = topics[i] + '_values';
-					InputSliderManager.setValue(topic, prop[value_array][j]);
-					DropDownManager.setValue(topic, prop[unit_array][j]);
-				}
-			}
-
-			ButtonManager.setValue('slice-fill', prop['fill']);
-			DropDownManager.setValue('image-repeat-X', prop['repeat'][0]);
-			DropDownManager.setValue('image-repeat-Y', prop['repeat'][1]);
-			InputSliderManager.setValue('preview-width', prop['size'][0]);
-			InputSliderManager.setValue('preview-height', prop['size'][1]);
-			InputSliderManager.setValue('preview-area-height', prop['preview_area']);
-		};
-
-		var update = function update() {
-			scale =  Math.min(300, (30000 / this.width) | 0);
-			setScale(scale);
-			InputSliderManager.setValue('scale', scale, false);
-
-			subject.style.backgroundImage = 'url("' + this.src + '")';
-			preview.style.borderImageSource = 'url("' + this.src + '")';
-
-			guidelines['slice-top'].setMax(this.height);
-			guidelines['slice-right'].setMax(this.width);
-			guidelines['slice-bottom'].setMax(this.height);
-			guidelines['slice-left'].setMax(this.width);
-
-			if (imgState)
-				loadImageState(imgState);
-		};
-
-		var setScale = function setScale(value) {
-			scale = value;
-			var w = imgSource.width * scale / 100 | 0;
-			var h = imgSource.height * scale / 100 | 0;
-			subject.style.width = w + 'px';
-			subject.style.height = h + 'px';
-
-			for (var i = 0; i &lt; positions.length; i++)
-				guidelines['slice-' + positions[i]].updateGuidelinePos();
-		};
-
-		var getScale = function getScale() {
-			return scale/100;
-		};
-
-		var toggleGallery = function toggleGallery() {
-			var gallery = getElemById('image-gallery');
-			var button  = getElemById('toggle-gallery');
-			var state = 1;
-			button.addEventListener('click', function() {
-				state = 1 ^ state;
-				if (state === 0) {
-					gallery.setAttribute('data-collapsed', 'true');
-					button.setAttribute('data-action', 'show');
-				}
-				else {
-					gallery.removeAttribute('data-collapsed');
-					button.setAttribute('data-action', 'hide');
-				}
-			});
-		};
-
-		var init = function init() {
-			var gallery = getElemById('image-gallery');
-			var browse = getElemById('load-image');
-			var remote = getElemById('remote-url');
-			var load_remote = getElemById('load-remote');
-
-			remote.addEventListener('change', function(){
-				loadRemoteImage(this.value);
-			});
-
-			load_remote.addEventListener('click', function(){
-				loadRemoteImage(remote.value);
-			});
-
-			browse.addEventListener('click', ImageReader.load);
-			gallery.addEventListener('click', pickImage);
-			imgSource.addEventListener('load', update);
-
-			InputSliderManager.subscribe('scale', setScale);
-			InputSliderManager.setValue('scale', scale);
-			imgState = 'border1';
-			loadRemoteImage('https://mdn.mozillademos.org/files/6007/border-image-1.png');
-			toggleGallery();
-		};
-
-		return {
-			init: init,
-			getScale : getScale,
-			loadRemoteImage: loadRemoteImage
-		};
-
-	})();
-
-	var GuideLine = function GuideLine(node) {
-		var topic = node.getAttribute('data-topic');
-		var axis = node.getAttribute('data-axis');
-
-		this.node = node;
-		this.topic = topic;
-		this.axis = axis;
-		this.info = topic.split('-')[1];
-
-		this.position = 0;
-		this.value = 0;
-		this.unit = 0;
-		this.max = 0;
-		this.pos = positions.indexOf(this.info);
-
-		guidelines[topic] = this;
-
-		var relative_container = document.createElement('div');
-		var tooltip = document.createElement('div');
-		var tooltip2 = document.createElement('div');
-
-		tooltip.className = 'tooltip';
-		tooltip.setAttribute('data-info', this.info);
-
-		tooltip2.className = 'tooltip2';
-		tooltip2.textContent = this.info;
-		tooltip2.setAttribute('data-info', this.info);
-
-		this.tooltip = tooltip;
-
-		relative_container.appendChild(tooltip);
-		relative_container.appendChild(tooltip2);
-		node.appendChild(relative_container);
-
-		var startX = 0;
-		var startY = 0;
-		var start = 0;
-
-		var startDrag = function startDrag(e) {
-			startX = e.clientX;
-			startY = e.clientY;
-			start = guidelines[topic].position;
-			document.body.setAttribute('data-move', axis);
-			relative_container.setAttribute('data-active', '');
-			node.setAttribute('data-active', '');
-
-			document.addEventListener('mousemove', updateGuideline);
-			document.addEventListener('mouseup', endDrag);
-		};
-
-		var endDrag = function endDrag() {
-			document.body.removeAttribute('data-move');
-			relative_container.removeAttribute('data-active');
-			node.removeAttribute('data-active');
-
-			document.removeEventListener('mousemove', updateGuideline);
-		};
-
-		var updateGuideline = function updateGuideline(e) {
-			var value;
-			if (topic === 'slice-top')
-				value = e.clientY - startY + start;
-
-			if (topic === 'slice-right')
-				value = startX - e.clientX + start;
-
-			if (topic === 'slice-bottom')
-				value = startY - e.clientY + start;
-
-			if (topic === 'slice-left')
-				value = e.clientX - startX + start;
-
-			if (this.unit === 0)
-				InputSliderManager.setValue(topic, value * 1 / ImageControl.getScale() | 0);
-			else {
-				InputSliderManager.setValue(topic, (value * 100 / (this.max * ImageControl.getScale())) | 0);
-			}
-
-		}.bind(this);
-
-		node.addEventListener("mousedown", startDrag);
-
-		InputSliderManager.subscribe(topic, this.setPosition.bind(this));
-		InputSliderManager.setValue(topic, this.position);
-	};
-
-
-	GuideLine.prototype.updateGuidelinePos = function updateGuidelinePos() {
-		if (this.unit === 0)
-			this.position = this.value * ImageControl.getScale() | 0;
-		else
-			this.position = this.value * this.max * ImageControl.getScale() / 100 | 0;
-
-		this.node.style[this.info] = this.position + 'px';
-	};
-
-	GuideLine.prototype.setPosition = function setPosition(value) {
-		this.value = value;
-		this.tooltip.textContent = value;
-		this.updateGuidelinePos();
-		Tool.setBorderSlice(this.pos, value);
-	};
-
-	GuideLine.prototype.setMax = function setMax(max) {
-		this.max = max;
-		this.updateLimit();
-	};
-
-	GuideLine.prototype.updateLimit = function updateLimit() {
-		if (this.unit === 1)
-			InputSliderManager.setMax(this.topic, 100);
-		else
-			InputSliderManager.setMax(this.topic, this.max);
-	};
-
-	GuideLine.prototype.setUnit = function setUnit(type) {
-		if (type === '%')	this.unit = 1;
-		if (type === '')	this.unit = 0;
-		this.updateLimit();
-	};
-
-	/*
-	 * Unit panel
-	 */
-	var UnitPanel = (function UnitPanel () {
-
-		var panel;
-		var title;
-		var precision;
-		var step;
-		var unit_topic = null; // settings are made for this topic
-		var step_option = [1, 0.1, 0.01];
-
-		var updatePrecision = function updatePrecision(value) {
-			InputSliderManager.setPrecision('unit-step', value);
-			InputSliderManager.setStep('unit-step', step_option[value]);
-			InputSliderManager.setMin('unit-step', step_option[value]);
-
-			if (unit_topic)
-				InputSliderManager.setPrecision(unit_topic, value);
-		};
-
-		var updateUnitSettings = function updateUnitSettings(value) {
-			if (unit_topic)
-				InputSliderManager.setStep(unit_topic, value);
-		};
-
-		var show = function show(e) {
-			var topic = e.target.getAttribute('data-topic');
-			var precision = InputSliderManager.getPrecision(topic);
-			var step = InputSliderManager.getStep(topic);
-
-			unit_topic = topic;
-			title.textContent = topic;
-
-			panel.setAttribute('data-active', 'true');
-			panel.style.top = e.target.offsetTop - 40 + 'px';
-			panel.style.left = e.target.offsetLeft + 30 + 'px';
-
-			InputSliderManager.setValue('unit-precision', precision);
-			InputSliderManager.setValue('unit-step', step);
-		};
-
-		var init = function init() {
-			panel = document.createElement('div');
-			title = document.createElement('div');
-			var close = document.createElement('div');
-
-			step = InputSliderManager.createSlider('unit-step', 'step');
-			precision = InputSliderManager.createSlider('unit-precision', 'precision');
-
-			InputSliderManager.setStep('unit-precision', 1);
-			InputSliderManager.setMax('unit-precision', 2);
-			InputSliderManager.setValue('unit-precision', 2);
-			InputSliderManager.setSensivity('unit-precision', 20);
-
-			InputSliderManager.setValue('unit-step', 1);
-			InputSliderManager.setStep('unit-step', 0.01);
-			InputSliderManager.setPrecision('unit-step', 2);
-
-			InputSliderManager.subscribe('unit-precision', updatePrecision);
-			InputSliderManager.subscribe('unit-step', updateUnitSettings);
-
-			close.addEventListener('click', function () {
-				panel.setAttribute('data-active', 'false');
-			});
-
-			title.textContent = 'Properties';
-			title.className = 'title';
-			close.className = 'close';
-			panel.id = 'unit-settings';
-			panel.setAttribute('data-active', 'false');
-			panel.appendChild(title);
-			panel.appendChild(precision);
-			panel.appendChild(step);
-			panel.appendChild(close);
-			document.body.appendChild(panel);
-		};
-
-		return {
-			init : init,
-			show : show
-		};
-
-	})();
-
-	/**
-	 * Tool Manager
-	 */
-	var Tool = (function Tool() {
-		var preview_area;
-		var dropdown_unit_options = [
-			{ '' : '--', '%' : '%'},
-			{ 'px' : 'px', '%' : '%', 'em' : 'em'},
-			{ 'px' : 'px', 'em' : 'em'},
-		];
-
-		var border_slice = [];
-		var border_width = [];
-		var border_outset = [];
-
-		var border_slice_values = [];
-		var border_width_values = [];
-		var border_outset_values = [];
-
-		var border_slice_units = ['', '', '', ''];
-		var border_width_units = ['px', 'px', 'px', 'px'];
-		var border_outset_units = ['px', 'px', 'px', 'px'];
-
-		var border_fill = false;
-		var border_repeat = ['round', 'round'];
-		var CSS_code = {
-			'source' : null,
-			'slice' : null,
-			'width' : null,
-			'outset' : null,
-			'repeat' : null
-		};
-
-		var setBorderSlice = function setBorderSlice(positionID, value) {
-			border_slice[positionID] = value + border_slice_units[positionID];
-			updateBorderSlice();
-		};
-
-		var updateBorderSlice = function updateBorderSlice() {
-			var value = border_slice.join(' ');
-			if (border_fill === true)
-				value += ' fill';
-
-			preview.style.borderImageSlice = value;
-			setOutputCSS('slice', value);
-		};
-
-		var setBorderFill = function setBorderFill(value) {
-			border_fill = value;
-			var bimgslice = border_slice.join(' ');;
-			if (value === true)
-				bimgslice += ' fill';
-
-			preview.style.borderImageSlice = bimgslice;
-		};
-
-		var updateBorderWidth = function updateBorderWidth() {
-			var value = border_width.join(' ');
-			preview.style.borderImageWidth = value;
-			setOutputCSS('width', value);
-		};
-
-		var updateBorderOutset = function updateBorderOutset() {
-			var value = border_outset.join(' ');
-			preview.style.borderImageOutset = border_outset.join(' ');
-			setOutputCSS('outset', value);
-		};
-
-		var setBorderRepeat = function setBorderRepeat(obj) {
-			border_repeat[obj.value] = obj.name;
-			var value = border_repeat.join(' ');
-			preview.style.borderImageRepeat = value;
-			setOutputCSS('repeat', value);
-		};
-
-		var setOutputCSS = function setOutputCSS(topic, value) {
-			CSS_code[topic].textContent = value + ';';
-		};
-
-		var setPreviewFontSize = function setPreviewFontSize(value) {
-			preview.style.fontSize = value + 'px';
-		};
-
-		var setPreviewWidth = function setPreviewWidth(value) {
-			preview.style.width = value + 'px';
-		};
-
-		var setPreviewHeight = function setPreviewHeight(value) {
-			preview.style.height = value + 'px';
-		};
-
-		var setPreviewAreaHeight = function setPreviewAreaHeight(value) {
-			preview_area.style.height = value + 'px';
-		};
-
-		var updateDragOption = function updateDragOption(value) {
-			if (value === true)
-				subject.setAttribute('data-draggable', 'true');
-			else
-				subject.removeAttribute('data-draggable');
-		};
-
-		var createProperty = function createProperty(topic, labelID, optionsID) {
-
-			var slider = InputSliderManager.createSlider(topic, positions[labelID]);
-			var dropdown = DropDownManager.createDropDown(topic, dropdown_unit_options[optionsID]);
-
-			InputSliderManager.setSensivity(topic, 3);
-			InputSliderManager.setPrecision(topic, 1);
-
-			var property = document.createElement('div');
-			var config = document.createElement('div');
-
-			property.className = 'property';
-			config.className = 'config';
-			config.setAttribute('data-topic', topic);
-			config.addEventListener('click', UnitPanel.show);
-
-			property.appendChild(slider);
-			property.appendChild(dropdown);
-			property.appendChild(config);
-
-			return property;
-		};
-
-		var initBorderSliceControls = function initBorderSliceControls() {
-			var container = getElemById('border-slice-control');
-
-			var listenForChanges = function listenForChanges(topic, id) {
-				InputSliderManager.subscribe(topic, function(value) {
-					border_slice_values[id] = value;
-					border_slice[id] = value + border_slice_units[id];
-					updateBorderSlice();
-				});
-
-				DropDownManager.subscribe(topic, function(obj) {
-					guidelines[topic].setUnit(obj.value);
-					border_slice_units[id] = obj.value;
-					border_slice[id] = border_slice_values[id] + obj.value;
-					updateBorderSlice();
-				});
-			};
-
-			for (var i = 0; i &lt; positions.length; i++) {
-				var topic = 'slice-' + positions[i];
-				var property = createProperty(topic, i, 0);
-				listenForChanges(topic, i);
-
-				container.appendChild(property);
-			}
-
-			container.appendChild(container.children[1]);
-
-		};
-
-		var initBorderWidthControls = function initBorderWidthControls() {
-			var container = getElemById('border-width-control');
-
-			var listenForChanges = function listenForChanges(topic, id) {
-				InputSliderManager.subscribe(topic, function(value) {
-					border_width_values[id] = value;
-					border_width[id] = value + border_width_units[id];
-					updateBorderWidth();
-				});
-
-				DropDownManager.subscribe(topic, function(obj) {
-					if (obj.value === '%')
-						InputSliderManager.setMax(topic, 100);
-					else
-						InputSliderManager.setMax(topic, 1000);
-
-					border_width_units[id] = obj.value;
-					border_width[id] = border_width_values[id] + obj.value;
-					updateBorderWidth();
-				});
-			};
-
-			for (var i = 0; i &lt; positions.length; i++) {
-				var topic = 'width-' + positions[i];
-				var property = createProperty(topic, i, 1);
-				InputSliderManager.setMax(topic, 1000);
-				listenForChanges(topic, i);
-
-				container.appendChild(property);
-			}
-		};
-
-		var initBorderOutsetControls = function initBorderOutsetControls() {
-
-			var container = getElemById('border-outset-control');
-
-			var listenForChanges = function listenForChanges(topic, id) {
-				InputSliderManager.subscribe(topic, function(value) {
-					border_outset_values[id] = value;
-					border_outset[id] = value + border_outset_units[id];
-					updateBorderOutset();
-				});
-
-				DropDownManager.subscribe(topic, function(obj) {
-					border_outset_units[id] = obj.value;
-					border_outset[id] = border_outset_values[id] + obj.value;
-					updateBorderOutset();
-				});
-			};
-
-			for (var i = 0; i &lt; positions.length; i++) {
-				var topic = 'outset-' + positions[i];
-				var property = createProperty(topic, i, 2);
-				InputSliderManager.setMax(topic, 1000);
-				listenForChanges(topic, i);
-
-				container.appendChild(property);
-			}
-		};
-
-		var init = function init() {
-
-			var gallery =
-			subject = getElemById('subject');
-			preview = getElemById("preview");
-			preview_area = getElemById("preview_section");
-
-
-			CSS_code['source'] = getElemById("out-border-source");
-			CSS_code['slice'] = getElemById("out-border-slice");
-			CSS_code['width'] = getElemById("out-border-width");
-			CSS_code['outset'] = getElemById("out-border-outset");
-			CSS_code['repeat'] = getElemById("out-border-repeat");
-
-			initBorderSliceControls();
-			initBorderWidthControls();
-			initBorderOutsetControls();
-
-			var elem = document.querySelectorAll('.guideline');
-			var size = elem.length;
-			for (var i = 0; i &lt; size; i++)
-				new GuideLine(elem[i]);
-
-			PreviewControl.init();
-
-			ButtonManager.subscribe('slice-fill',setBorderFill);
-			ButtonManager.subscribe('drag-subject', updateDragOption);
-			ButtonManager.setValue('drag-subject', false);
-
-			DropDownManager.subscribe('image-repeat-X', setBorderRepeat);
-			DropDownManager.subscribe('image-repeat-Y', setBorderRepeat);
-
-			InputSliderManager.subscribe('preview-area-height', setPreviewAreaHeight);
-			InputSliderManager.subscribe('preview-width', setPreviewWidth);
-			InputSliderManager.subscribe('preview-height', setPreviewHeight);
-			InputSliderManager.subscribe('font-size', setPreviewFontSize);
-			InputSliderManager.setValue('preview-width', 300);
-			InputSliderManager.setValue('preview-height', 200);
-		};
-
-		return {
-			init: init,
-			setOutputCSS: setOutputCSS,
-			setBorderSlice: setBorderSlice
-		};
-
-	})();
-
-	/**
-	 * Init Tool
-	 */
-	var init = function init() {
-		InputSliderManager.init();
-		DropDownManager.init();
-		ButtonManager.init();
-		UnitPanel.init();
-		Tool.init();
-		ImageControl.init();
-	};
-
-	return {
-		init : init
-	};
-
-})();
-
-</pre>
-</div>
-<p>{{ EmbedLiveSample('Border_Image_Generator', '100%', '1270px') }}</p>
-
-<p> </p>
diff --git a/files/es/web/css/css_background_and_borders/border-image_generator/index.html b/files/es/web/css/css_background_and_borders/border-image_generator/index.html
new file mode 100644
index 0000000000..7757dc9b29
--- /dev/null
+++ b/files/es/web/css/css_background_and_borders/border-image_generator/index.html
@@ -0,0 +1,2616 @@
+---
+title: Generador Border-image
+slug: Web/CSS/CSS_Background_and_Borders/Border-image_generator
+tags:
+  - CSS
+  - Herramientas
+translation_of: Web/CSS/CSS_Background_and_Borders/Border-image_generator
+original_slug: Web/CSS/CSS_Background_and_Borders/Border-image_generador
+---
+<p>Esta herramienta permite generar valores para CSS3 {{cssxref("border-image")}}</p>
+<div style="display: none;">
+ <h2 id="Border_Image_Generator" name="Border_Image_Generator">Border Image Generator</h2>
+ <h3 id="HTML_Content">HTML Content</h3>
+ <pre class="brush: html">    <div id="container">
+
+        <div id="gallery">
+            <div id="image-gallery">
+                <img class="image" src="https://mdn.mozillademos.org/files/6007/border-image-1.png">
+                <img class="image" src="https://mdn.mozillademos.org/files/6009/border-image-2.png">
+                <img class="image" src="https://mdn.mozillademos.org/files/6011/border-image-3.png">
+                <img class="image" src="https://mdn.mozillademos.org/files/6013/border-image-4.png">
+                <img class="image" src="https://mdn.mozillademos.org/files/6015/border-image-5.png">
+                <img class="image" src="https://mdn.mozillademos.org/files/6017/border-image-6.svg">
+            </div>
+        </div>
+
+        <div class="group section" id="load-actions">
+            <div id="toggle-gallery"> </div>
+            <div class="button" id="load-image"> Upload image </div>
+            <input>
+            <div class="button" id="load-remote"> </div>
+        </div>
+
+        <div class="group section" id="general-controls">
+            <div class="name"> Control Box </div>
+            <div class="separator"></div>
+            <div class="property">
+                <div class="name">scale</div>
+                <div class="ui-input-slider">
+                </div>
+            </div>
+            <div class="separator"></div>
+            <div class="property">
+                <div class="name">draggable</div>
+                <div class="ui-checkbox"></div>
+            </div>
+            <div class="property right">
+                <div class="name">section height</div>
+                <div class="ui-input-slider">
+                </div>
+            </div>
+        </div>
+
+        <div class="group section" id="preview_section">
+            <div id="subject">
+                <div class="guideline"></div>
+                <div class="guideline"></div>
+                <div class="guideline"></div>
+                <div class="guideline"></div>
+            </div>
+            <div id="preview"> </div>
+        </div>
+
+
+        <div class="group section" id="controls">
+
+
+            <div class="category" id="border-slice-control">
+                <div class="title"> border-image-slice </div>
+                <div class="property">
+                    <div class="name">fill</div>
+                    <div class="ui-checkbox"></div>
+                </div>
+            </div>
+
+
+            <div class="category" id="border-width-control">
+                <div class="title"> border-image-width </div>
+            </div>
+
+
+            <div class="category" id="border-outset-control">
+                <div class="title"> border-image-outset </div>
+            </div>
+
+
+            <div class="category" id="aditional-properties">
+                <div class="title"> aditional-properties </div>
+                <div class="property">
+                    <div class="name"> repeat-x </div>
+                    <div class="ui-dropdown border-repeat">
+                        <div>repeat</div>
+                        <div>stretch</div>
+                        <div>round</div>
+                    </div>
+                </div>
+                <div class="property">
+                    <div class="name"> repeat-y </div>
+                    <div class="ui-dropdown border-repeat">
+                        <div>repeat</div>
+                        <div>stretch</div>
+                        <div>round</div>
+                    </div>
+                </div>
+                <div class="property">
+                    <div class="ui-input-slider">
+                    </div>
+                </div>
+
+                <div class="property">
+                    <div class="ui-input-slider"></div>
+                </div>
+                <div class="property">
+                    <div class="ui-input-slider">
+                    </div>
+                </div>
+            </div>
+
+
+            <div class="category" id="output">
+                <div class="title"> CSS Code </div>
+                <div class="css-property">
+                    <span class="name"> border-image-slice: </span>
+                    <span class="value" id="out-border-slice"> </span>
+                </div>
+                <div class="css-property">
+                    <span class="name"> border-image-width: </span>
+                    <span class="value" id="out-border-width"> </span>
+                </div>
+                <div class="css-property">
+                    <span class="name"> border-image-outset: </span>
+                    <span class="value" id="out-border-outset"> </span>
+                </div>
+                <div class="css-property">
+                    <span class="name"> border-image-repeat: </span>
+                    <span class="value" id="out-border-repeat"> </span>
+                </div>
+                <div class="css-property">
+                    <span class="name"> border-image-source: </span>
+                    <span class="value" id="out-border-source">  </span>
+                </div>
+            </div>
+
+        </div>
+    </div></pre>
+ <h3 id="CSS_Content">CSS Content</h3>
+ <pre class="brush: css">/*  GRID OF TWELVE
+ * ========================================================================== */
+
+.span_12 {
+	width: 100%;
+}
+
+.span_11 {
+	width: 91.46%;
+}
+
+.span_10 {
+	width: 83%;
+}
+
+.span_9 {
+	width: 74.54%;
+}
+
+.span_8 {
+	width: 66.08%;
+}
+
+.span_7 {
+	width: 57.62%;
+}
+
+.span_6 {
+	width: 49.16%;
+}
+
+.span_5 {
+	width: 40.7%;
+}
+
+.span_4 {
+	width: 32.24%;
+}
+
+.span_3 {
+	width: 23.78%;
+}
+
+.span_2 {
+	width: 15.32%;
+}
+
+.span_1 {
+	width: 6.86%;
+}
+
+
+/*  SECTIONS
+ * ========================================================================== */
+
+.section {
+	clear: both;
+	padding: 0px;
+	margin: 0px;
+}
+
+/*  GROUPING
+ * ========================================================================== */
+
+
+.group:before, .group:after {
+    content: "";
+    display: table;
+}
+
+.group:after {
+    clear:both;
+}
+
+.group {
+    zoom: 1; /* For IE 6/7 (trigger hasLayout) */
+}
+
+/*  GRID COLUMN SETUP
+ * ========================================================================== */
+
+.col {
+	display: block;
+	float:left;
+	margin: 1% 0 1% 1.6%;
+}
+
+.col:first-child {
+	margin-left: 0;
+} /* all browsers except IE6 and lower */
+
+
+
+/*
+ * UI Component
+ */
+
+.ui-input-slider {
+	height: 20px;
+	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
+	-moz-user-select: none;
+	user-select: none;
+}
+
+.ui-input-slider * {
+	float: left;
+	height: 100%;
+	line-height: 100%;
+}
+
+/* Input Slider */
+
+.ui-input-slider &gt; input {
+	margin: 0;
+	padding: 0;
+	width: 50px;
+	text-align: center;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.ui-input-slider-info {
+	width: 90px;
+	padding: 0px 10px 0px 0px;
+	text-align: right;
+	text-transform: lowercase;
+}
+
+.ui-input-slider-left, .ui-input-slider-right {
+	width: 16px;
+	cursor: pointer;
+	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center left no-repeat;
+}
+
+.ui-input-slider-right {
+	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center right no-repeat;
+}
+
+.ui-input-slider-name {
+	width: 90px;
+	padding: 0 10px 0 0;
+	text-align: right;
+	text-transform: lowercase;
+}
+
+.ui-input-slider-btn-set {
+	width: 25px;
+	background-color: #2C9FC9;
+	border-radius: 5px;
+	color: #FFF;
+	font-weight: bold;
+	line-height: 14px;
+	text-align: center;
+}
+
+.ui-input-slider-btn-set:hover {
+	background-color: #379B4A;
+	cursor: pointer;
+}
+
+/*************************************************************************************/
+/*************************************************************************************/
+
+/*
+ * UI DropDown
+ */
+
+/* Dropdown */
+
+.ui-dropdown {
+	height: 2em;
+	width: 120px;
+	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
+	font-size: 12px;
+
+	background-image: url("https://mdn.mozillademos.org/files/6037/drop_arrow_icon.png");
+	background-position: right center;
+	background-repeat: no-repeat;
+	background-color: #359740;
+
+	position: relative;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+
+	-moz-user-select: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+
+.ui-dropdown:hover {
+	cursor: pointer;
+	background-color: #208B20;
+}
+
+/* Dropdown Select Button */
+
+.ui-dropdown-select {
+	height: inherit;
+	padding: 0 0.75em;
+	color: #FFF;
+	line-height: 2em;
+}
+
+/* Dropdown List */
+
+.ui-dropdown-list {
+	width: 100%;
+	height: 150px;
+	max-height: 150px;
+	margin: 0;
+	padding: 0 0.3em;
+
+	border: 3px solid #3490D2;
+	border-color: #208B20;
+	background: #666;
+	background-color: #EEF1F5;
+	color: #000;
+
+	position: absolute;
+	top: 2em;
+	left: 0;
+	z-index: 100;
+
+	overflow: hidden;
+	transition: all 0.3s;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.ui-dropdown-list:hover {
+	overflow: auto;
+}
+
+.ui-dropdown-list[data-hidden='true'] {
+	height: 0 !important;
+	opacity: 0;
+	visibility: hidden;
+}
+
+.ui-dropdown[data-position='left'] .ui-dropdown-list {
+	left: -100%;
+	top: 0;
+}
+
+.ui-dropdown[data-position='right'] .ui-dropdown-list {
+	left: 100%;
+	top: 0;
+}
+
+.ui-dropdown-list &gt; div {
+	width: 100%;
+	height: 1.6em;
+	margin: 0.3em 0;
+	padding: 0.3em;
+	line-height: 1em;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.ui-dropdown-list &gt; div:hover {
+	background: #3490D2;
+	color:#FFF;
+	border-radius: 2px;
+	cursor: pointer;
+}
+
+
+/*************************************************************************************/
+/*************************************************************************************/
+
+/*
+ * UI Button
+ */
+
+/* Checkbox */
+
+.ui-checkbox {
+	text-align: center;
+	font-size: 16px;
+	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
+	line-height: 1.5em;
+	color: #FFF;
+
+	-moz-user-select: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+
+.ui-checkbox &gt; input {
+ 	display: none;
+}
+
+.ui-checkbox &gt; label {
+	font-size: 12px;
+	padding: 0.333em 1.666em 0.5em;
+	height: 1em;
+	line-height: 1em;
+
+	background-color: #888;
+	background-image: url("https://mdn.mozillademos.org/files/5683/disabled.png");
+	background-position: center center;
+	background-repeat: no-repeat;
+
+	color: #FFF;
+	border-radius: 2px;
+	font-weight: bold;
+	float: left;
+}
+
+.ui-checkbox .text {
+	padding-left: 34px;
+	background-position: center left 10px;
+}
+
+.ui-checkbox .left {
+	padding-right: 34px;
+	padding-left: 1.666em;
+	background-position: center right 10px;
+}
+
+.ui-checkbox &gt; label:hover {
+	cursor: pointer;
+}
+
+.ui-checkbox &gt; input:checked + label {
+	background-image: url("https://mdn.mozillademos.org/files/5681/checked.png");
+	background-color: #379B4A;
+}
+
+/*************************************************************************************/
+/*************************************************************************************/
+
+/*
+ * BORDER IMAGE GENERATOR TOOL
+ */
+
+body {
+	width: 100%;
+	margin: 0 auto;
+	padding: 0 0 20px 0;
+
+	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
+
+	/*background: url("https://mdn.mozillademos.org/files/6025/grain.png");*/
+	border: 1px solid #EEE;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+
+	-moz-user-select: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+
+body[data-move='X'] {
+	cursor: w-resize !important;
+}
+
+body[data-move='Y'] {
+	cursor: s-resize !important;
+}
+
+#container {
+	width: 100%;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+[data-draggable='true']:hover {
+	cursor: move;
+}
+
+[data-draggable='true']:hover &gt; * {
+	cursor: default;
+}
+
+
+
+/******************************************************************************/
+/******************************************************************************/
+
+/*
+ * Border Image Picker
+ */
+
+#gallery {
+	box-shadow: 0 0 3px 0 #BABABA;
+}
+
+#image-gallery {
+	width: 600px;
+	height: 100px;
+	margin: 0 auto;
+	transition: margin 0.4s;
+}
+
+#image-gallery .image {
+	height: 80px;
+	float: left;
+	margin: 10px;
+	opacity: 0.5;
+	background-color: #FFF;
+	box-shadow: 0px 0px 3px 1px #BABABA;
+}
+
+#image-gallery .image[selected="true"] {
+	box-shadow: 0px 0px 3px 1px #3BBA52;
+	opacity: 1;
+}
+
+#image-gallery .image:hover {
+	cursor: pointer;
+	box-shadow: 0px 0px 3px 1px #30ACE5;
+	opacity: 1;
+}
+
+#image-gallery[data-collapsed='true'] {
+	margin-top: -100px;
+}
+
+/* Load Menu */
+
+#load-actions {
+	margin: 10px 0;
+}
+
+#toggle-gallery {
+	width: 30px;
+	height: 25px;
+	margin: 10px;
+	color: #FFF;
+
+	background-image: url('https://mdn.mozillademos.org/files/6005/arrow-up-white.png');
+	background-repeat: no-repeat;
+	background-position: top 4px center;
+	background-color: #888888 !important;
+
+	border-radius: 2px;
+	float: left;
+}
+
+#toggle-gallery:hover {
+	cursor: pointer;
+}
+
+#toggle-gallery[data-action='show'] {
+	background-image: url('https://mdn.mozillademos.org/files/6001/arrow-down-white.png');
+	background-color: #888888 !important;
+}
+
+#toggle-gallery[data-action='hide'] {
+	background-image: url('https://mdn.mozillademos.org/files/6005/arrow-up-white.png');
+}
+
+.button {
+	width: 100px;
+	height: 25px;
+	margin: 10px;
+	color: #FFF;
+	text-align: center;
+	font-size: 12px;
+	line-height: 25px;
+	background-color: #379B4A;
+	border-radius: 2px;
+	float: left;
+}
+
+.button:hover {
+	cursor: pointer;
+	background-color: #3380C4;
+}
+
+#load-image {
+	float: left;
+}
+
+#load-remote {
+	width: 30px;
+	background-image: url('https://mdn.mozillademos.org/files/6003/arrow-right-white.png');
+	background-repeat: no-repeat;
+	background-position: center center;
+}
+
+#remote-url {
+	width: 200px;
+	height: 23px;
+	margin: 10px;
+	padding: 0 5px;
+	border: 1px solid #379B4A;
+	border-radius: 2px;
+	float: left;
+
+	transition: width 0.5s;
+}
+
+#remote-url:focus {
+	box-shadow: 0px 0px 3px -1px #379B4A; /*#68ACE8; */
+	border-color: rgba(55, 155, 74, 0.5);
+	width: 450px;
+}
+
+/*
+ * Visible Area
+ */
+
+#preview_section {
+	position: relative;
+	min-height: 400px;
+}
+
+/* Image Control */
+
+#subject {
+	width: 300px;
+	height: 300px;
+	background-repeat: no-repeat;
+	background-size: 100%;
+	background-color: #FFF;
+	border: 1px solid #CCC;
+
+	position: absolute;
+	z-index: 10;
+	top: 15%;
+	left: 10%;
+
+	box-shadow: 0 0 3px 0 #BABABA;
+	transition-property: width, height;
+	transition-duration: 0.1s;
+}
+
+#subject .guideline {
+	background-color: rgba(255, 255, 255, 0.7);
+	border: 1px solid rgba(0, 0, 0, 0.3);
+	position: absolute;
+}
+
+#subject .guideline:hover {
+	background-color: #F00;
+}
+
+#subject .guideline[data-active] {
+	background-color: #F00;
+	z-index: 10;
+}
+
+#subject .guideline[data-axis='X'] {
+	width: 1px;
+	height: 100%;
+	top: -1px;
+}
+
+#subject .guideline[data-axis='Y'] {
+	width: 100%;
+	height: 1px;
+	left: -1px;
+}
+
+#subject .guideline[data-axis='X']:hover {
+	cursor: w-resize;
+}
+
+#subject .guideline[data-axis='Y']:hover {
+	cursor: s-resize;
+}
+
+
+#subject .relative {
+	position: relative;
+	font-size: 12px;
+}
+
+#subject .tooltip, #subject .tooltip2 {
+	width: 40px;
+	height: 20px;
+	line-height: 20px;
+	font-size: 12px;
+	text-align: center;
+
+	position: absolute;
+	opacity: 0.5;
+	transition: opacity 0.25s;
+}
+
+#subject .tooltip {
+	background: #EEE;
+	border-radius: 2px;
+	border: 1px solid #CCC;
+}
+
+#subject .tooltip2{
+	color: #555;
+}
+
+#subject [data-active] &gt; * {
+	opacity: 1;
+}
+
+#subject .tooltip[data-info='top'] {
+	top: -10px;
+	right: -50px;
+}
+
+#subject .tooltip[data-info='right'] {
+	bottom: -30px;
+	right: -20px;
+}
+
+#subject .tooltip[data-info='bottom'] {
+	top: -10px;
+	left: -50px;
+}
+
+#subject .tooltip[data-info='left'] {
+	top: -30px;
+	right: -20px;
+}
+
+#subject .tooltip2[data-info='top'] {
+	top: -10px;
+	left: -50px;
+}
+
+#subject .tooltip2[data-info='right'] {
+	top: -30px;
+	right: -20px;
+}
+
+#subject .tooltip2[data-info='bottom'] {
+	top: -10px;
+	right: -50px;
+}
+
+#subject .tooltip2[data-info='left'] {
+	bottom: -30px;
+	right: -20px;
+}
+
+/* Preview */
+
+#preview {
+	width: 30%;
+	height: 50%;
+	background-color: #FFF;
+	text-align: center;
+	overflow: hidden;
+	position: absolute;
+	z-index: 10;
+
+	left: 60%;
+	top: 15%;
+
+	border-radius: 2px;
+	border-image-width: 20px;
+	border-image-repeat: round;
+	box-shadow: 0 0 3px 0 #BABABA;
+}
+
+#preview .resize-handle {
+	width: 10px;
+	height: 10px;
+	background: url("https://mdn.mozillademos.org/files/6027/resize.png") center center no-repeat;
+	position: absolute;
+	bottom: 0;
+	right: 0;
+}
+
+#preview .resize-handle:hover {
+	cursor: nw-resize;
+}
+
+
+/*
+ * General controls MENU
+ */
+
+#general-controls {
+	padding: 10px 30px;
+	background-color: #FFF;
+	opacity: 0.95;
+	color: #888;
+	/*border-radius: 2px;*/
+	box-shadow: 0 0 3px 0 #BABABA;
+}
+
+#general-controls .property {
+	width: 130px;
+	float: left;
+}
+
+#general-controls .name {
+	height: 20px;
+	margin: 0 10px 0 0;
+	line-height: 100%;
+	text-align: right;
+	float: left;
+}
+
+#general-controls .right {
+	width: 200px;
+	float: right;
+}
+
+#general-controls .ui-checkbox label {
+	height: 10px;
+}
+
+#general-controls .separator {
+	height: 40px;
+	width: 1px;
+	margin: -10px 15px;
+	background-color: #EEE;
+	float: left;
+}
+
+/*
+ * Controls
+ */
+
+#controls {
+	color: #444;
+	margin: 10px 0 0 0;
+}
+
+#controls .category {
+	height: 190px;
+	min-width: 260px;
+	margin: 10px;
+	padding: 10px;
+	border: 1px solid #CCC;
+	border-radius: 3px;
+	float: left;
+
+	box-shadow: 0 0 3px 0 #BABABA;
+	transition: all 0.25s;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+@media (min-width: 880px) {
+	#controls .category {
+		width: 30%;
+		margin-left: 1.66%;
+		margin-right: 1.66%;
+	}
+}
+
+@media (max-width: 879px) {
+	#controls .category {
+		width: 37%;
+		margin-left: 6.5%;
+		margin-right: 6.5%;
+	}
+}
+
+#controls .category .title {
+	width: 100%;
+	height: 30px;
+	margin: 0 0 10px 0;
+	line-height: 25px;
+
+	text-align: center;
+	color: #AAA;
+}
+
+#controls .category:hover .title {
+	color: #777;
+}
+
+#controls .category &gt; .group {
+	border: 1px solid #CCC;
+	border-radius: 2px;
+}
+
+
+/* property */
+
+#controls .property {
+	width: 250px;
+	height: 20px;
+	margin: 5px auto;
+}
+
+#controls .property .ui-input-slider {
+	margin: 0;
+	float: left;
+}
+
+#controls .property .ui-input-slider-info {
+	width: 60px;
+}
+
+#controls .property .ui-input-slider-left {
+	transition: opacity 0.15s;
+    opacity: 0;
+}
+
+#controls .property .ui-input-slider-right {
+	transition: opacity 0.15s;
+    opacity: 0;
+}
+
+#controls .property .name {
+	width: 60px;
+	height: 20px;
+	padding: 0px 10px 0px 0px;
+	text-align: right;
+	line-height: 100%;
+	float: left;
+}
+
+#controls .property .config {
+	width: 20px;
+	height: 20px;
+	float: left;
+	background: url("https://mdn.mozillademos.org/files/6021/config.png") center center no-repeat;
+	opacity: 0.5;
+}
+
+#controls .property .config:hover {
+	cursor: pointer;
+	opacity: 1;
+}
+
+#controls .ui-input-slider:hover .ui-input-slider-right {
+    opacity: 1;
+}
+
+#controls .ui-input-slider:hover .ui-input-slider-left {
+    opacity: 1;
+}
+
+#controls .property .ui-dropdown {
+	margin: 0 10px;
+	float: left;
+}
+
+
+#controls .property .ui-checkbox {
+	margin: 0 0 0 16px;
+	float: left;
+}
+
+#controls .property .ui-checkbox label {
+	height: 0.85em;
+	width: 10px;
+}
+
+/* dropdowns */
+#controls .ui-dropdown {
+	width: 50px;
+	height: 1.7em;
+	border-radius: 2px;
+}
+
+#controls .ui-dropdown-select {
+	line-height: 1.6em;
+}
+
+#controls .ui-dropdown-list {
+	top: 20px;
+}
+
+#controls .ui-dropdown-list {
+	border-width: 1px;
+	text-align: center;
+}
+
+#controls .ui-dropdown-list:hover {
+	overflow: hidden;
+}
+
+#controls .border-repeat {
+	margin: 0 0 0 16px !important;
+	width: 80px;
+}
+
+#controls .border-repeat .ui-dropdown-list {
+	height: 6.2em;
+	border-width: 1px;
+	text-align: center;
+}
+
+/* border-image-slice */
+
+
+#border-slice-control .ui-dropdown-list {
+	height: 4.3em;
+}
+
+/* border-image-width */
+
+#border-width-control .ui-dropdown-list {
+	height: 6.2em;
+}
+
+/* border-image-outset */
+
+#border-outset-control .ui-dropdown-list {
+	height: 4.3em;
+}
+
+#aditional-properties .property {
+	width: 200px;
+}
+
+#aditional-properties .ui-input-slider &gt; input {
+	width: 80px !important;
+}
+
+/* unit settings panel */
+
+#unit-settings {
+	padding: 10px;
+	position: absolute;
+
+	background: #FFF;
+
+	font-size: 12px;
+	border-radius: 3px;
+	border: 1px solid #CCC;
+	text-align: center;
+	color: #555;
+
+	position: absolute;
+	z-index: 1000;
+
+	box-shadow: 0 0 3px 0 #BABABA;
+	transition: all 0.25s;
+}
+
+#unit-settings .title {
+	width: 100%;
+	margin: -5px auto 0;
+
+	color: #666;
+	font-size: 14px;
+	font-weight: bold;
+	line-height: 25px;
+	border-bottom: 1px solid #E5E5E5;
+}
+
+#unit-settings .ui-input-slider {
+	margin: 10px 0 0 0;
+}
+
+#unit-settings .ui-input-slider-info {
+	width: 50px;
+	line-height: 1.5em;
+}
+
+#unit-settings input {
+	font-size: 12px;
+	width: 40px !important;
+}
+
+#unit-settings .close {
+	width: 16px;
+	height: 16px;
+	background: url('https://mdn.mozillademos.org/files/6019/close.png') no-repeat center center;
+	background-size: 75%;
+
+	position: absolute;
+	top: 4px;
+	right: 4px;
+	opacity: 0.5;
+}
+
+#unit-settings .close:hover {
+	cursor: pointer;
+	opacity: 1;
+}
+
+#unit-settings[data-active='true'] {
+	opacity: 1;
+}
+
+#unit-settings[data-active='false'] {
+	opacity: 0;
+	top: -100px !important;
+}
+
+/*
+ * CSS Output Code
+ */
+
+#output {
+	padding: 10px;
+	border: 2px dashed #888 !important;
+	box-shadow: none !important;
+	border-radius: 3px;
+	overflow: hidden;
+
+	-moz-user-select: text;
+	-webkit-user-select: text;
+	-ms-user-select: text;
+	user-select: text;
+}
+
+
+@media (min-width: 880px) {
+	#output {
+		width: 63.33% !important;
+	}
+}
+
+@media (max-width: 879px) {
+	#output {
+		width: 87% !important;
+	}
+}
+
+
+#output .title {
+	width: 100%;
+	height: 30px;
+	margin: 0 0 10px 0;
+	line-height: 25px;
+
+	text-align: center;
+	color: #AAA;
+}
+
+#output .css-property {
+	width: 100%;
+	margin: 0;
+	color: #555;
+	font-size: 14px;
+	line-height: 18px;
+	float: left;
+}
+
+#output .css-property .name {
+	width: 30%;
+	font-weight: bold;
+	text-align: right;
+	float: left;
+}
+
+#output .css-property .value {
+	width: 65%;
+	padding: 0 2.5%;
+	word-break: break-all;
+	float: left;
+}
+
+</pre>
+ <h3 id="JavaScript_Content">JavaScript Content</h3>
+ <pre class="brush: js">'use strict';
+
+/**
+ * UI-SlidersManager
+ */
+
+var InputSliderManager = (function InputSliderManager() {
+
+	var subscribers = {};
+	var sliders = [];
+
+	var InputComponent = function InputComponent(obj) {
+		var input = document.createElement('input');
+		input.setAttribute('type', 'text');
+		input.style.width = 50 + obj.precision * 10 + 'px';
+
+		input.addEventListener('click', function(e) {
+			this.select();
+		});
+
+		input.addEventListener('change', function(e) {
+			var value = parseFloat(e.target.value);
+
+			if (isNaN(value) === true)
+				setValue(obj.topic, obj.value);
+			else
+				setValue(obj.topic, value);
+		});
+
+		return input;
+	};
+
+	var SliderComponent = function SliderComponent(obj, sign) {
+		var slider = document.createElement('div');
+		var startX = null;
+		var start_value = 0;
+
+		slider.addEventListener("click", function(e) {
+			document.removeEventListener("mousemove", sliderMotion);
+			setValue(obj.topic, obj.value + obj.step * sign);
+		});
+
+		slider.addEventListener("mousedown", function(e) {
+			startX = e.clientX;
+			start_value = obj.value;
+			document.body.style.cursor = "e-resize";
+
+			document.addEventListener("mouseup", slideEnd);
+			document.addEventListener("mousemove", sliderMotion);
+		});
+
+		var slideEnd = function slideEnd(e) {
+			document.removeEventListener("mousemove", sliderMotion);
+			document.body.style.cursor = "auto";
+			slider.style.cursor = "pointer";
+		};
+
+		var sliderMotion = function sliderMotion(e) {
+			slider.style.cursor = "e-resize";
+			var delta = (e.clientX - startX) / obj.sensivity | 0;
+			var value = delta * obj.step + start_value;
+			setValue(obj.topic, value);
+		};
+
+		return slider;
+	};
+
+	var InputSlider = function(node) {
+		var min		= parseFloat(node.getAttribute('data-min'));
+		var max		= parseFloat(node.getAttribute('data-max'));
+		var step	= parseFloat(node.getAttribute('data-step'));
+		var value	= parseFloat(node.getAttribute('data-value'));
+		var topic	= node.getAttribute('data-topic');
+		var unit	= node.getAttribute('data-unit');
+		var name 	= node.getAttribute('data-info');
+		var sensivity = node.getAttribute('data-sensivity') | 0;
+		var precision = node.getAttribute('data-precision') | 0;
+
+		this.min = isNaN(min) ? 0 : min;
+		this.max = isNaN(max) ? 100 : max;
+		this.precision = precision &gt;= 0 ? precision : 0;
+		this.step = step &lt; 0 || isNaN(step) ? 1 : step.toFixed(precision);
+		this.topic = topic;
+		this.node = node;
+		this.unit = unit === null ? '' : unit;
+		this.sensivity = sensivity &gt; 0 ? sensivity : 5;
+		value = isNaN(value) ? this.min : value;
+
+		var input = new InputComponent(this);
+		var slider_left  = new SliderComponent(this, -1);
+		var slider_right = new SliderComponent(this,  1);
+
+		slider_left.className = 'ui-input-slider-left';
+		slider_right.className = 'ui-input-slider-right';
+
+		if (name) {
+			var info = document.createElement('span');
+			info.className = 'ui-input-slider-info';
+			info.textContent = name;
+			node.appendChild(info);
+		}
+
+		node.appendChild(slider_left);
+		node.appendChild(input);
+		node.appendChild(slider_right);
+
+		this.input = input;
+		sliders[topic] = this;
+		setValue(topic, value);
+	};
+
+	InputSlider.prototype.setInputValue = function setInputValue() {
+		this.input.value = this.value.toFixed(this.precision) + this.unit;
+	};
+
+	var setValue = function setValue(topic, value, send_notify) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		value = parseFloat(value.toFixed(slider.precision));
+
+		if (value &gt; slider.max) value = slider.max;
+		if (value &lt; slider.min)	value = slider.min;
+
+		slider.value = value;
+		slider.node.setAttribute('data-value', value);
+
+		slider.setInputValue();
+
+		if (send_notify === false)
+			return;
+
+		notify.call(slider);
+	};
+
+	var setMax = function setMax(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.max = value;
+		setValue(topic, slider.value);
+	};
+
+	var setMin = function setMin(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.min = value;
+		setValue(topic, slider.value);
+	};
+
+	var setUnit = function setUnit(topic, unit) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.unit = unit;
+		setValue(topic, slider.value);
+	};
+
+	var setStep = function setStep(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.step = parseFloat(value);
+		setValue(topic, slider.value);
+	};
+
+	var setPrecision = function setPrecision(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		value = value | 0;
+		slider.precision = value;
+
+		var step = parseFloat(slider.step.toFixed(value));
+		if (step === 0)
+			slider.step = 1 / Math.pow(10, value);
+
+		setValue(topic, slider.value);
+	};
+
+	var setSensivity = function setSensivity(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		value = value | 0;
+
+		slider.sensivity = value &gt; 0 ? value : 5;
+	};
+
+	var getNode =  function getNode(topic) {
+		return sliders[topic].node;
+	};
+
+	var getPrecision =  function getPrecision(topic) {
+		return sliders[topic].precision;
+	};
+
+	var getStep =  function getStep(topic) {
+		return sliders[topic].step;
+	};
+
+	var subscribe = function subscribe(topic, callback) {
+		if (subscribers[topic] === undefined)
+			subscribers[topic] = [];
+		subscribers[topic].push(callback);
+	};
+
+	var unsubscribe = function unsubscribe(topic, callback) {
+		subscribers[topic].indexOf(callback);
+		subscribers[topic].splice(index, 1);
+	};
+
+	var notify = function notify() {
+		if (subscribers[this.topic] === undefined)
+			return;
+		for (var i = 0; i &lt; subscribers[this.topic].length; i++)
+			subscribers[this.topic][i](this.value);
+	};
+
+	var createSlider = function createSlider(topic, label) {
+		var slider = document.createElement('div');
+		slider.className = 'ui-input-slider';
+		slider.setAttribute('data-topic', topic);
+
+		if (label !== undefined)
+			slider.setAttribute('data-info', label);
+
+		new InputSlider(slider);
+		return slider;
+	};
+
+	var init = function init() {
+		var elem = document.querySelectorAll('.ui-input-slider');
+		var size = elem.length;
+		for (var i = 0; i &lt; size; i++)
+			new InputSlider(elem[i]);
+	};
+
+	return {
+		init : init,
+		setMax : setMax,
+		setMin : setMin,
+		setUnit : setUnit,
+		setStep : setStep,
+		getNode : getNode,
+		getStep : getStep,
+		setValue : setValue,
+		subscribe : subscribe,
+		unsubscribe : unsubscribe,
+		setPrecision : setPrecision,
+		setSensivity : setSensivity,
+		getPrecision : getPrecision,
+		createSlider : createSlider,
+	};
+
+})();
+
+
+/**
+ * UI-DropDown Select
+ */
+
+var DropDownManager = (function DropdownManager() {
+
+	var subscribers = {};
+	var dropdowns = [];
+	var active = null;
+
+	var visbility = ["hidden", "visible"];
+
+
+	var DropDown = function DropDown(node) {
+		var topic = node.getAttribute('data-topic');
+		var label = node.getAttribute('data-label');
+		var selected = node.getAttribute('data-selected') | 0;
+
+		var select = document.createElement('div');
+		var list = document.createElement('div');
+		var uval = 0;
+		var option = null;
+		var option_value = null;
+
+		list.className = 'ui-dropdown-list';
+		select.className = 'ui-dropdown-select';
+
+		while (node.firstElementChild !== null) {
+			option = node.firstElementChild;
+			option_value = option.getAttribute('data-value');
+
+			if (option_value === null)
+				option.setAttribute('data-value', uval);
+
+			list.appendChild(node.firstElementChild);
+			uval++;
+		}
+
+		node.appendChild(select);
+		node.appendChild(list);
+
+		select.onclick = this.toggle.bind(this);
+		list.onclick = this.updateValue.bind(this);
+		document.addEventListener('click', clickOut);
+
+		this.state = 0;
+		this.time = 0;
+		this.dropmenu = list;
+		this.select = select;
+		this.toggle(false);
+		this.value = {};
+		this.topic = topic;
+
+		if (label)
+			select.textContent = label;
+		else
+			this.setNodeValue(list.children[selected]);
+
+		dropdowns[topic] = this;
+
+	};
+
+	DropDown.prototype.toggle = function toggle(state) {
+		if (typeof(state) === 'boolean')
+			this.state = state === false ? 0 : 1;
+		else
+			this.state = 1 ^ this.state;
+
+		if (active !== this) {
+			if (active)
+				active.toggle(false);
+			active = this;
+		}
+
+		if (this.state === 0)
+			this.dropmenu.setAttribute('data-hidden', 'true');
+		else
+			this.dropmenu.removeAttribute('data-hidden');
+
+	};
+
+	var clickOut = function clickOut(e) {
+		if (active.state === 0 ||
+			e.target === active.dropmenu ||
+			e.target === active.select)
+			return;
+
+		active.toggle(false);
+	};
+
+	DropDown.prototype.updateValue = function updateValue(e) {
+
+		if (Date.now() - this.time &lt; 500)
+			return;
+
+		if (e.target.className !== "ui-dropdown-list") {
+			this.setNodeValue(e.target);
+			this.toggle(false);
+		}
+
+		this.time = Date.now();
+	};
+
+	DropDown.prototype.setNodeValue = function setNodeValue(node) {
+		this.value['name'] = node.textContent;
+		this.value['value'] = node.getAttribute('data-value');
+
+		this.select.textContent = node.textContent;
+		this.select.setAttribute('data-value', this.value['value']);
+
+		notify.call(this);
+	};
+
+	var createDropDown = function createDropDown(topic, options) {
+
+		var dropdown = document.createElement('div');
+		dropdown.setAttribute('data-topic', topic);
+		dropdown.className = 'ui-dropdown';
+
+		for (var i in options) {
+			var x = document.createElement('div');
+			x.setAttribute('data-value', i);
+			x.textContent = options[i];
+			dropdown.appendChild(x);
+		}
+
+		new DropDown(dropdown);
+
+		return dropdown;
+	};
+
+	var setValue = function setValue(topic, index) {
+		if (dropdowns[topic] === undefined ||
+			index &gt;= dropdowns[topic].dropmenu.children.length)
+			return;
+
+		dropdowns[topic].setNodeValue(dropdowns[topic].dropmenu.children[index]);
+	};
+
+	var subscribe = function subscribe(topic, callback) {
+		if (subscribers[topic] === undefined)
+			subscribers[topic] = [];
+		subscribers[topic].push(callback);
+	};
+
+	var unsubscribe = function unsubscribe(topic, callback) {
+		var index = subscribers[topic].indexOf(callback);
+		subscribers[topic].splice(index, 1);
+	};
+
+	var notify = function notify() {
+		if (subscribers[this.topic] === undefined)
+			return;
+
+		for (var i in subscribers[this.topic]) {
+			subscribers[this.topic][i](this.value);
+		}
+	};
+
+	var init = function init() {
+		var elem, size;
+
+		elem = document.querySelectorAll('.ui-dropdown');
+		size = elem.length;
+		for (var i = 0; i &lt; size; i++)
+			new DropDown(elem[i]);
+
+	};
+
+	return {
+		init : init,
+		setValue : setValue,
+		subscribe : subscribe,
+		unsubscribe : unsubscribe,
+		createDropDown : createDropDown
+	};
+
+})();
+
+
+/**
+ * UI-ButtonManager
+ */
+
+var ButtonManager = (function CheckBoxManager() {
+
+	var subscribers = [];
+	var buttons = [];
+
+	var CheckBox = function CheckBox(node) {
+		var topic = node.getAttribute('data-topic');
+		var state = node.getAttribute('data-state');
+		var name = node.getAttribute('data-label');
+		var align = node.getAttribute('data-text-on');
+
+		state = (state === "true");
+
+		var checkbox = document.createElement("input");
+		var label = document.createElement("label");
+
+		var id = 'checkbox-' + topic;
+		checkbox.id = id;
+		checkbox.setAttribute('type', 'checkbox');
+		checkbox.checked = state;
+
+		label.setAttribute('for', id);
+		if (name) {
+			label.className = 'text';
+			if (align)
+				label.className += ' ' + align;
+			label.textContent = name;
+		}
+
+		node.appendChild(checkbox);
+		node.appendChild(label);
+
+		this.node = node;
+		this.topic = topic;
+		this.checkbox = checkbox;
+
+		checkbox.addEventListener('change', function(e) {
+			notify.call(this);
+		}.bind(this));
+
+		buttons[topic] = this;
+	};
+
+	var getNode =  function getNode(topic) {
+		return buttons[topic].node;
+	};
+
+	var setValue = function setValue(topic, value) {
+		var obj = buttons[topic];
+		if (obj === undefined)
+			return;
+
+		obj.checkbox.checked = value;
+		notify.call(obj);
+	};
+
+	var subscribe = function subscribe(topic, callback) {
+		if (subscribers[topic] === undefined)
+			subscribers[topic] = [];
+
+		subscribers[topic].push(callback);
+	};
+
+	var unsubscribe = function unsubscribe(topic, callback) {
+		subscribers[topic].indexOf(callback);
+		subscribers[topic].splice(index, 1);
+	};
+
+	var notify = function notify() {
+		if (subscribers[this.topic] === undefined)
+			return;
+		for (var i = 0; i &lt; subscribers[this.topic].length; i++)
+			subscribers[this.topic][i](this.checkbox.checked);
+	};
+
+	var init = function init() {
+		var elem = document.querySelectorAll('.ui-checkbox');
+		var size = elem.length;
+		for (var i = 0; i &lt; size; i++)
+			new CheckBox(elem[i]);
+	};
+
+	return {
+		init : init,
+		setValue : setValue,
+		subscribe : subscribe,
+		unsubscribe : unsubscribe
+	};
+
+})();
+
+window.addEventListener("load", function() {
+	BorderImage.init();
+});
+
+var BorderImage = (function BorderImage() {
+
+	var getElemById = document.getElementById.bind(document);
+
+	var subject;
+	var preview;
+	var guidelines = [];
+	var positions = ['top', 'right', 'bottom', 'left'];
+
+	var makeDraggable = function makeDraggable(elem) {
+
+		var offsetTop;
+		var offsetLeft;
+
+		elem.setAttribute('data-draggable', 'true');
+
+		var dragStart = function dragStart(e) {
+			if (e.target.getAttribute('data-draggable') !== 'true' ||
+				e.target !== elem || e.button !== 0)
+				return;
+
+			offsetLeft = e.clientX - elem.offsetLeft;
+			offsetTop = e.clientY - elem.offsetTop;
+
+			document.addEventListener('mousemove', mouseDrag);
+			document.addEventListener('mouseup', dragEnd);
+		};
+
+		var dragEnd = function dragEnd(e) {
+			if (e.button !== 0)
+				return;
+
+			document.removeEventListener('mousemove', mouseDrag);
+			document.removeEventListener('mouseup', dragEnd);
+		};
+
+		var mouseDrag = function mouseDrag(e) {
+
+			elem.style.left = e.clientX - offsetLeft + 'px';
+			elem.style.top = e.clientY - offsetTop + 'px';
+		};
+
+		elem.addEventListener('mousedown', dragStart, false);
+	};
+
+	var PreviewControl = function PreviewControl() {
+
+		var dragging = false;
+		var valueX = null;
+		var valueY = null;
+
+		var dragStart = function dragStart(e) {
+			if (e.button !== 0)
+				return;
+
+			valueX = e.clientX - preview.clientWidth;
+			valueY = e.clientY - preview.clientHeight;
+			dragging = true;
+
+			document.addEventListener('mousemove', mouseDrag);
+		};
+
+		var dragEnd = function dragEnd(e) {
+			if (e.button !== 0 || dragging === false)
+				return;
+
+			document.removeEventListener('mousemove', mouseDrag);
+			dragging = false;
+		};
+
+		var mouseDrag = function mouseDrag(e) {
+			InputSliderManager.setValue('preview-width', e.clientX - valueX);
+			InputSliderManager.setValue('preview-height', e.clientY - valueY);
+		};
+
+		var init = function init() {
+
+			makeDraggable(preview);
+			makeDraggable(subject);
+
+			var handle = document.createElement('div');
+			handle.className = 'resize-handle';
+
+			handle.addEventListener('mousedown', dragStart);
+			document.addEventListener('mouseup', dragEnd);
+
+			preview.appendChild(handle);
+
+		};
+
+		return {
+			init: init
+		};
+
+	}();
+
+	var ImageReader = (function ImageReader() {
+
+		var fReader = new FileReader();
+		var browse = document.createElement('input');
+
+		var loadImage = function loadImage(e) {
+			if (browse.files.length === 0)
+				return;
+
+			var file = browse.files[0];
+
+			if (file.type.slice(0, 5) !== 'image')
+				return;
+
+			fReader.readAsDataURL(file);
+
+			return false;
+		};
+
+		fReader.onload = function(e) {
+			ImageControl.loadRemoteImage(e.target.result);
+		};
+
+		var load = function load() {
+			browse.click();
+		};
+
+		browse.setAttribute('type', 'file');
+		browse.style.display = 'none';
+		browse.onchange = loadImage;
+
+		return {
+			load: load
+		};
+
+	})();
+
+	var ImageControl = (function ImageControl() {
+
+		var scale = 0.5;
+		var imgSource = new Image();
+		var imgState = null;
+		var selected = null;
+
+
+		var topics = ['slice', 'width', 'outset'];
+		var properties = {};
+		properties['border1'] = {
+			fill			: false,
+
+			slice_values	: [27, 27, 27, 27],
+			width_values	: [20, 20, 20, 20],
+			outset_values	: [0, 0, 0, 0],
+
+			slice_units		: [0, 0, 0, 0],
+			width_units		: [0, 0, 0, 0],
+			outset_units	: [0, 0, 0, 0],
+
+			repeat			: [1, 1],
+			size			: [300, 200],
+			preview_area	: 400
+		};
+
+		properties['border2'] = {
+			fill			: false,
+
+			slice_values	: [33, 33, 33, 33],
+			width_values	: [1.5, 1.5, 1.5, 1.5],
+			outset_values	: [0, 0, 0, 0],
+
+			slice_units		: [1, 1, 1, 1],
+			width_units		: [2, 2, 2, 2],
+			outset_units	: [0, 0, 0, 0],
+
+			repeat			: [2, 2],
+			size			: [300, 200],
+			preview_area	: 400
+		};
+
+		properties['border3'] = {
+			fill			: true,
+
+			slice_values	: [15, 15, 15, 15],
+			width_values	: [10, 10, 10, 10],
+			outset_values	: [0, 0, 0, 0],
+
+			slice_units		: [0, 0, 0, 0],
+			width_units		: [0, 0, 0, 0],
+			outset_units	: [0, 0, 0, 0],
+
+			repeat			: [2, 2],
+			size			: [300, 200],
+			preview_area	: 400
+		};
+
+		properties['border4'] = {
+			fill			: false,
+
+			slice_values	: [13, 13, 13, 13],
+			width_values	: [13, 13, 13, 13],
+			outset_values	: [13, 13, 13, 13],
+
+			slice_units		: [0, 0, 0, 0],
+			width_units		: [0, 0, 0, 0],
+			outset_units	: [0, 0, 0, 0],
+
+			repeat			: [0, 0],
+			size			: [300, 200],
+			preview_area	: 400
+		};
+
+		properties['border5'] = {
+			fill			: false,
+
+			slice_values	: [0, 12, 0, 12],
+			width_values	: [0, 12, 0, 12],
+			outset_values	: [0, 0, 0, 0],
+
+			slice_units		: [0, 0, 0, 0],
+			width_units		: [0, 0, 0, 0],
+			outset_units	: [0, 0, 0, 0],
+
+			repeat			: [0, 0],
+			size			: [300, 200],
+			preview_area	: 400,
+		};
+
+		properties['border6'] = {
+			fill			: false,
+
+			slice_values	: [42, 42, 42, 42],
+			width_values	: [42, 42, 42, 42],
+			outset_values	: [0, 0, 0, 0],
+
+			slice_units		: [0, 0, 0, 0],
+			width_units		: [0, 0, 0, 0],
+			outset_units	: [0, 0, 0, 0],
+
+			repeat			: [2, 2],
+			size			: [350, 350],
+			preview_area	: 500,
+		};
+
+
+		var loadLocalImage = function loadLocalImage(source) {
+			var location = "images/" + source;
+			imgSource.src = location;
+		};
+
+		var loadRemoteImage = function loadRemoteImage(source) {
+			imgSource.src = source;
+			if (selected)
+				selected.removeAttribute('selected');
+			Tool.setOutputCSS('source', 'url("' + source + '")');
+		};
+
+		var pickImage = function pickImage(e) {
+			if (e.target.className === 'image') {
+				selected = e.target;
+				selected.setAttribute('selected', 'true');
+				loadRemoteImage(e.target.src);
+				imgState = e.target.getAttribute('data-stateID');
+			}
+		};
+
+		var loadImageState = function loadImageState(stateID) {
+			if (properties[stateID] === undefined)
+				return;
+
+			var prop = properties[stateID];
+			var topic;
+			var unit_array;
+			var value_array;
+
+			for (var i in topics) {
+				for (var j=0; j&lt;4; j++) {
+					topic = topics[i] + '-' + positions[j];
+					unit_array = topics[i] + '_units';
+					value_array = topics[i] + '_values';
+					InputSliderManager.setValue(topic, prop[value_array][j]);
+					DropDownManager.setValue(topic, prop[unit_array][j]);
+				}
+			}
+
+			ButtonManager.setValue('slice-fill', prop['fill']);
+			DropDownManager.setValue('image-repeat-X', prop['repeat'][0]);
+			DropDownManager.setValue('image-repeat-Y', prop['repeat'][1]);
+			InputSliderManager.setValue('preview-width', prop['size'][0]);
+			InputSliderManager.setValue('preview-height', prop['size'][1]);
+			InputSliderManager.setValue('preview-area-height', prop['preview_area']);
+		};
+
+		var update = function update() {
+			scale =  Math.min(300, (30000 / this.width) | 0);
+			setScale(scale);
+			InputSliderManager.setValue('scale', scale, false);
+
+			subject.style.backgroundImage = 'url("' + this.src + '")';
+			preview.style.borderImageSource = 'url("' + this.src + '")';
+
+			guidelines['slice-top'].setMax(this.height);
+			guidelines['slice-right'].setMax(this.width);
+			guidelines['slice-bottom'].setMax(this.height);
+			guidelines['slice-left'].setMax(this.width);
+
+			if (imgState)
+				loadImageState(imgState);
+		};
+
+		var setScale = function setScale(value) {
+			scale = value;
+			var w = imgSource.width * scale / 100 | 0;
+			var h = imgSource.height * scale / 100 | 0;
+			subject.style.width = w + 'px';
+			subject.style.height = h + 'px';
+
+			for (var i = 0; i &lt; positions.length; i++)
+				guidelines['slice-' + positions[i]].updateGuidelinePos();
+		};
+
+		var getScale = function getScale() {
+			return scale/100;
+		};
+
+		var toggleGallery = function toggleGallery() {
+			var gallery = getElemById('image-gallery');
+			var button  = getElemById('toggle-gallery');
+			var state = 1;
+			button.addEventListener('click', function() {
+				state = 1 ^ state;
+				if (state === 0) {
+					gallery.setAttribute('data-collapsed', 'true');
+					button.setAttribute('data-action', 'show');
+				}
+				else {
+					gallery.removeAttribute('data-collapsed');
+					button.setAttribute('data-action', 'hide');
+				}
+			});
+		};
+
+		var init = function init() {
+			var gallery = getElemById('image-gallery');
+			var browse = getElemById('load-image');
+			var remote = getElemById('remote-url');
+			var load_remote = getElemById('load-remote');
+
+			remote.addEventListener('change', function(){
+				loadRemoteImage(this.value);
+			});
+
+			load_remote.addEventListener('click', function(){
+				loadRemoteImage(remote.value);
+			});
+
+			browse.addEventListener('click', ImageReader.load);
+			gallery.addEventListener('click', pickImage);
+			imgSource.addEventListener('load', update);
+
+			InputSliderManager.subscribe('scale', setScale);
+			InputSliderManager.setValue('scale', scale);
+			imgState = 'border1';
+			loadRemoteImage('https://mdn.mozillademos.org/files/6007/border-image-1.png');
+			toggleGallery();
+		};
+
+		return {
+			init: init,
+			getScale : getScale,
+			loadRemoteImage: loadRemoteImage
+		};
+
+	})();
+
+	var GuideLine = function GuideLine(node) {
+		var topic = node.getAttribute('data-topic');
+		var axis = node.getAttribute('data-axis');
+
+		this.node = node;
+		this.topic = topic;
+		this.axis = axis;
+		this.info = topic.split('-')[1];
+
+		this.position = 0;
+		this.value = 0;
+		this.unit = 0;
+		this.max = 0;
+		this.pos = positions.indexOf(this.info);
+
+		guidelines[topic] = this;
+
+		var relative_container = document.createElement('div');
+		var tooltip = document.createElement('div');
+		var tooltip2 = document.createElement('div');
+
+		tooltip.className = 'tooltip';
+		tooltip.setAttribute('data-info', this.info);
+
+		tooltip2.className = 'tooltip2';
+		tooltip2.textContent = this.info;
+		tooltip2.setAttribute('data-info', this.info);
+
+		this.tooltip = tooltip;
+
+		relative_container.appendChild(tooltip);
+		relative_container.appendChild(tooltip2);
+		node.appendChild(relative_container);
+
+		var startX = 0;
+		var startY = 0;
+		var start = 0;
+
+		var startDrag = function startDrag(e) {
+			startX = e.clientX;
+			startY = e.clientY;
+			start = guidelines[topic].position;
+			document.body.setAttribute('data-move', axis);
+			relative_container.setAttribute('data-active', '');
+			node.setAttribute('data-active', '');
+
+			document.addEventListener('mousemove', updateGuideline);
+			document.addEventListener('mouseup', endDrag);
+		};
+
+		var endDrag = function endDrag() {
+			document.body.removeAttribute('data-move');
+			relative_container.removeAttribute('data-active');
+			node.removeAttribute('data-active');
+
+			document.removeEventListener('mousemove', updateGuideline);
+		};
+
+		var updateGuideline = function updateGuideline(e) {
+			var value;
+			if (topic === 'slice-top')
+				value = e.clientY - startY + start;
+
+			if (topic === 'slice-right')
+				value = startX - e.clientX + start;
+
+			if (topic === 'slice-bottom')
+				value = startY - e.clientY + start;
+
+			if (topic === 'slice-left')
+				value = e.clientX - startX + start;
+
+			if (this.unit === 0)
+				InputSliderManager.setValue(topic, value * 1 / ImageControl.getScale() | 0);
+			else {
+				InputSliderManager.setValue(topic, (value * 100 / (this.max * ImageControl.getScale())) | 0);
+			}
+
+		}.bind(this);
+
+		node.addEventListener("mousedown", startDrag);
+
+		InputSliderManager.subscribe(topic, this.setPosition.bind(this));
+		InputSliderManager.setValue(topic, this.position);
+	};
+
+
+	GuideLine.prototype.updateGuidelinePos = function updateGuidelinePos() {
+		if (this.unit === 0)
+			this.position = this.value * ImageControl.getScale() | 0;
+		else
+			this.position = this.value * this.max * ImageControl.getScale() / 100 | 0;
+
+		this.node.style[this.info] = this.position + 'px';
+	};
+
+	GuideLine.prototype.setPosition = function setPosition(value) {
+		this.value = value;
+		this.tooltip.textContent = value;
+		this.updateGuidelinePos();
+		Tool.setBorderSlice(this.pos, value);
+	};
+
+	GuideLine.prototype.setMax = function setMax(max) {
+		this.max = max;
+		this.updateLimit();
+	};
+
+	GuideLine.prototype.updateLimit = function updateLimit() {
+		if (this.unit === 1)
+			InputSliderManager.setMax(this.topic, 100);
+		else
+			InputSliderManager.setMax(this.topic, this.max);
+	};
+
+	GuideLine.prototype.setUnit = function setUnit(type) {
+		if (type === '%')	this.unit = 1;
+		if (type === '')	this.unit = 0;
+		this.updateLimit();
+	};
+
+	/*
+	 * Unit panel
+	 */
+	var UnitPanel = (function UnitPanel () {
+
+		var panel;
+		var title;
+		var precision;
+		var step;
+		var unit_topic = null; // settings are made for this topic
+		var step_option = [1, 0.1, 0.01];
+
+		var updatePrecision = function updatePrecision(value) {
+			InputSliderManager.setPrecision('unit-step', value);
+			InputSliderManager.setStep('unit-step', step_option[value]);
+			InputSliderManager.setMin('unit-step', step_option[value]);
+
+			if (unit_topic)
+				InputSliderManager.setPrecision(unit_topic, value);
+		};
+
+		var updateUnitSettings = function updateUnitSettings(value) {
+			if (unit_topic)
+				InputSliderManager.setStep(unit_topic, value);
+		};
+
+		var show = function show(e) {
+			var topic = e.target.getAttribute('data-topic');
+			var precision = InputSliderManager.getPrecision(topic);
+			var step = InputSliderManager.getStep(topic);
+
+			unit_topic = topic;
+			title.textContent = topic;
+
+			panel.setAttribute('data-active', 'true');
+			panel.style.top = e.target.offsetTop - 40 + 'px';
+			panel.style.left = e.target.offsetLeft + 30 + 'px';
+
+			InputSliderManager.setValue('unit-precision', precision);
+			InputSliderManager.setValue('unit-step', step);
+		};
+
+		var init = function init() {
+			panel = document.createElement('div');
+			title = document.createElement('div');
+			var close = document.createElement('div');
+
+			step = InputSliderManager.createSlider('unit-step', 'step');
+			precision = InputSliderManager.createSlider('unit-precision', 'precision');
+
+			InputSliderManager.setStep('unit-precision', 1);
+			InputSliderManager.setMax('unit-precision', 2);
+			InputSliderManager.setValue('unit-precision', 2);
+			InputSliderManager.setSensivity('unit-precision', 20);
+
+			InputSliderManager.setValue('unit-step', 1);
+			InputSliderManager.setStep('unit-step', 0.01);
+			InputSliderManager.setPrecision('unit-step', 2);
+
+			InputSliderManager.subscribe('unit-precision', updatePrecision);
+			InputSliderManager.subscribe('unit-step', updateUnitSettings);
+
+			close.addEventListener('click', function () {
+				panel.setAttribute('data-active', 'false');
+			});
+
+			title.textContent = 'Properties';
+			title.className = 'title';
+			close.className = 'close';
+			panel.id = 'unit-settings';
+			panel.setAttribute('data-active', 'false');
+			panel.appendChild(title);
+			panel.appendChild(precision);
+			panel.appendChild(step);
+			panel.appendChild(close);
+			document.body.appendChild(panel);
+		};
+
+		return {
+			init : init,
+			show : show
+		};
+
+	})();
+
+	/**
+	 * Tool Manager
+	 */
+	var Tool = (function Tool() {
+		var preview_area;
+		var dropdown_unit_options = [
+			{ '' : '--', '%' : '%'},
+			{ 'px' : 'px', '%' : '%', 'em' : 'em'},
+			{ 'px' : 'px', 'em' : 'em'},
+		];
+
+		var border_slice = [];
+		var border_width = [];
+		var border_outset = [];
+
+		var border_slice_values = [];
+		var border_width_values = [];
+		var border_outset_values = [];
+
+		var border_slice_units = ['', '', '', ''];
+		var border_width_units = ['px', 'px', 'px', 'px'];
+		var border_outset_units = ['px', 'px', 'px', 'px'];
+
+		var border_fill = false;
+		var border_repeat = ['round', 'round'];
+		var CSS_code = {
+			'source' : null,
+			'slice' : null,
+			'width' : null,
+			'outset' : null,
+			'repeat' : null
+		};
+
+		var setBorderSlice = function setBorderSlice(positionID, value) {
+			border_slice[positionID] = value + border_slice_units[positionID];
+			updateBorderSlice();
+		};
+
+		var updateBorderSlice = function updateBorderSlice() {
+			var value = border_slice.join(' ');
+			if (border_fill === true)
+				value += ' fill';
+
+			preview.style.borderImageSlice = value;
+			setOutputCSS('slice', value);
+		};
+
+		var setBorderFill = function setBorderFill(value) {
+			border_fill = value;
+			var bimgslice = border_slice.join(' ');;
+			if (value === true)
+				bimgslice += ' fill';
+
+			preview.style.borderImageSlice = bimgslice;
+		};
+
+		var updateBorderWidth = function updateBorderWidth() {
+			var value = border_width.join(' ');
+			preview.style.borderImageWidth = value;
+			setOutputCSS('width', value);
+		};
+
+		var updateBorderOutset = function updateBorderOutset() {
+			var value = border_outset.join(' ');
+			preview.style.borderImageOutset = border_outset.join(' ');
+			setOutputCSS('outset', value);
+		};
+
+		var setBorderRepeat = function setBorderRepeat(obj) {
+			border_repeat[obj.value] = obj.name;
+			var value = border_repeat.join(' ');
+			preview.style.borderImageRepeat = value;
+			setOutputCSS('repeat', value);
+		};
+
+		var setOutputCSS = function setOutputCSS(topic, value) {
+			CSS_code[topic].textContent = value + ';';
+		};
+
+		var setPreviewFontSize = function setPreviewFontSize(value) {
+			preview.style.fontSize = value + 'px';
+		};
+
+		var setPreviewWidth = function setPreviewWidth(value) {
+			preview.style.width = value + 'px';
+		};
+
+		var setPreviewHeight = function setPreviewHeight(value) {
+			preview.style.height = value + 'px';
+		};
+
+		var setPreviewAreaHeight = function setPreviewAreaHeight(value) {
+			preview_area.style.height = value + 'px';
+		};
+
+		var updateDragOption = function updateDragOption(value) {
+			if (value === true)
+				subject.setAttribute('data-draggable', 'true');
+			else
+				subject.removeAttribute('data-draggable');
+		};
+
+		var createProperty = function createProperty(topic, labelID, optionsID) {
+
+			var slider = InputSliderManager.createSlider(topic, positions[labelID]);
+			var dropdown = DropDownManager.createDropDown(topic, dropdown_unit_options[optionsID]);
+
+			InputSliderManager.setSensivity(topic, 3);
+			InputSliderManager.setPrecision(topic, 1);
+
+			var property = document.createElement('div');
+			var config = document.createElement('div');
+
+			property.className = 'property';
+			config.className = 'config';
+			config.setAttribute('data-topic', topic);
+			config.addEventListener('click', UnitPanel.show);
+
+			property.appendChild(slider);
+			property.appendChild(dropdown);
+			property.appendChild(config);
+
+			return property;
+		};
+
+		var initBorderSliceControls = function initBorderSliceControls() {
+			var container = getElemById('border-slice-control');
+
+			var listenForChanges = function listenForChanges(topic, id) {
+				InputSliderManager.subscribe(topic, function(value) {
+					border_slice_values[id] = value;
+					border_slice[id] = value + border_slice_units[id];
+					updateBorderSlice();
+				});
+
+				DropDownManager.subscribe(topic, function(obj) {
+					guidelines[topic].setUnit(obj.value);
+					border_slice_units[id] = obj.value;
+					border_slice[id] = border_slice_values[id] + obj.value;
+					updateBorderSlice();
+				});
+			};
+
+			for (var i = 0; i &lt; positions.length; i++) {
+				var topic = 'slice-' + positions[i];
+				var property = createProperty(topic, i, 0);
+				listenForChanges(topic, i);
+
+				container.appendChild(property);
+			}
+
+			container.appendChild(container.children[1]);
+
+		};
+
+		var initBorderWidthControls = function initBorderWidthControls() {
+			var container = getElemById('border-width-control');
+
+			var listenForChanges = function listenForChanges(topic, id) {
+				InputSliderManager.subscribe(topic, function(value) {
+					border_width_values[id] = value;
+					border_width[id] = value + border_width_units[id];
+					updateBorderWidth();
+				});
+
+				DropDownManager.subscribe(topic, function(obj) {
+					if (obj.value === '%')
+						InputSliderManager.setMax(topic, 100);
+					else
+						InputSliderManager.setMax(topic, 1000);
+
+					border_width_units[id] = obj.value;
+					border_width[id] = border_width_values[id] + obj.value;
+					updateBorderWidth();
+				});
+			};
+
+			for (var i = 0; i &lt; positions.length; i++) {
+				var topic = 'width-' + positions[i];
+				var property = createProperty(topic, i, 1);
+				InputSliderManager.setMax(topic, 1000);
+				listenForChanges(topic, i);
+
+				container.appendChild(property);
+			}
+		};
+
+		var initBorderOutsetControls = function initBorderOutsetControls() {
+
+			var container = getElemById('border-outset-control');
+
+			var listenForChanges = function listenForChanges(topic, id) {
+				InputSliderManager.subscribe(topic, function(value) {
+					border_outset_values[id] = value;
+					border_outset[id] = value + border_outset_units[id];
+					updateBorderOutset();
+				});
+
+				DropDownManager.subscribe(topic, function(obj) {
+					border_outset_units[id] = obj.value;
+					border_outset[id] = border_outset_values[id] + obj.value;
+					updateBorderOutset();
+				});
+			};
+
+			for (var i = 0; i &lt; positions.length; i++) {
+				var topic = 'outset-' + positions[i];
+				var property = createProperty(topic, i, 2);
+				InputSliderManager.setMax(topic, 1000);
+				listenForChanges(topic, i);
+
+				container.appendChild(property);
+			}
+		};
+
+		var init = function init() {
+
+			var gallery =
+			subject = getElemById('subject');
+			preview = getElemById("preview");
+			preview_area = getElemById("preview_section");
+
+
+			CSS_code['source'] = getElemById("out-border-source");
+			CSS_code['slice'] = getElemById("out-border-slice");
+			CSS_code['width'] = getElemById("out-border-width");
+			CSS_code['outset'] = getElemById("out-border-outset");
+			CSS_code['repeat'] = getElemById("out-border-repeat");
+
+			initBorderSliceControls();
+			initBorderWidthControls();
+			initBorderOutsetControls();
+
+			var elem = document.querySelectorAll('.guideline');
+			var size = elem.length;
+			for (var i = 0; i &lt; size; i++)
+				new GuideLine(elem[i]);
+
+			PreviewControl.init();
+
+			ButtonManager.subscribe('slice-fill',setBorderFill);
+			ButtonManager.subscribe('drag-subject', updateDragOption);
+			ButtonManager.setValue('drag-subject', false);
+
+			DropDownManager.subscribe('image-repeat-X', setBorderRepeat);
+			DropDownManager.subscribe('image-repeat-Y', setBorderRepeat);
+
+			InputSliderManager.subscribe('preview-area-height', setPreviewAreaHeight);
+			InputSliderManager.subscribe('preview-width', setPreviewWidth);
+			InputSliderManager.subscribe('preview-height', setPreviewHeight);
+			InputSliderManager.subscribe('font-size', setPreviewFontSize);
+			InputSliderManager.setValue('preview-width', 300);
+			InputSliderManager.setValue('preview-height', 200);
+		};
+
+		return {
+			init: init,
+			setOutputCSS: setOutputCSS,
+			setBorderSlice: setBorderSlice
+		};
+
+	})();
+
+	/**
+	 * Init Tool
+	 */
+	var init = function init() {
+		InputSliderManager.init();
+		DropDownManager.init();
+		ButtonManager.init();
+		UnitPanel.init();
+		Tool.init();
+		ImageControl.init();
+	};
+
+	return {
+		init : init
+	};
+
+})();
+
+</pre>
+</div>
+<p>{{ EmbedLiveSample('Border_Image_Generator', '100%', '1270px') }}</p>
+
+<p> </p>
diff --git a/files/es/web/css/css_background_and_borders/index.html b/files/es/web/css/css_background_and_borders/index.html
deleted file mode 100644
index 59c2117194..0000000000
--- a/files/es/web/css/css_background_and_borders/index.html
+++ /dev/null
@@ -1,155 +0,0 @@
----
-title: CSS Background and Borders
-slug: Web/CSS/CSS_Background_and_Borders
-tags:
-  - CSS
-  - CSS Backgrounds and Borders
-  - CSS Reference
-  - NeedsTranslation
-  - Overview
-  - TopicStub
-translation_of: Web/CSS/CSS_Backgrounds_and_Borders
-translation_of_original: Web/CSS/CSS_Background_and_Borders
----
-<p>{{CSSRef}}</p>
-
-<p><strong>CSS Background and Borders</strong> is a module of CSS that defines how background and borders of elements are described. Borders can be lines or images, boxes can have one or multiple backgrounds, have rounded corners, and shadows.</p>
-
-<h2 id="Reference">Reference</h2>
-
-<h3 id="CSS_Properties">CSS Properties</h3>
-
-<div class="index">
-<ul>
- <li>{{cssxref("background")}}</li>
- <li>{{cssxref("background-attachment")}}</li>
- <li>{{cssxref("background-clip")}}</li>
- <li>{{cssxref("background-color")}}</li>
- <li>{{cssxref("background-image")}}</li>
- <li>{{cssxref("background-origin")}}</li>
- <li>{{cssxref("background-position")}}</li>
- <li>{{cssxref("background-repeat")}}</li>
- <li>{{cssxref("background-size")}}</li>
- <li>{{cssxref("box-shadow")}}</li>
- <li>{{cssxref("border")}}</li>
- <li>{{cssxref("border-bottom")}}</li>
- <li>{{cssxref("border-bottom-color")}}</li>
- <li>{{cssxref("border-bottom-left-radius")}}</li>
- <li>{{cssxref("border-bottom-right-radius")}}</li>
- <li>{{cssxref("border-bottom-style")}}</li>
- <li>{{cssxref("border-bottom-width")}}</li>
- <li>{{cssxref("border-collapse")}}</li>
- <li>{{cssxref("border-color")}}</li>
- <li>{{cssxref("border-image")}}</li>
- <li>{{cssxref("border-image-outset")}}</li>
- <li>{{cssxref("border-image-repeat")}}</li>
- <li>{{cssxref("border-image-slice")}}</li>
- <li>{{cssxref("border-image-source")}}</li>
- <li>{{cssxref("border-image-width")}}</li>
- <li>{{cssxref("border-left")}}</li>
- <li>{{cssxref("border-left-color")}}</li>
- <li>{{cssxref("border-left-style")}}</li>
- <li>{{cssxref("border-left-width")}}</li>
- <li>{{cssxref("border-radius")}}</li>
- <li>{{cssxref("border-right")}}</li>
- <li>{{cssxref("border-right-color")}}</li>
- <li>{{cssxref("border-right-style")}}</li>
- <li>{{cssxref("border-right-width")}}</li>
- <li>{{cssxref("border-style")}}</li>
- <li>{{cssxref("border-top")}}</li>
- <li>{{cssxref("border-top-color")}}</li>
- <li>{{cssxref("border-top-left-radius")}}</li>
- <li>{{cssxref("border-top-right-radius")}}</li>
- <li>{{cssxref("border-top-style")}}</li>
- <li>{{cssxref("border-top-width")}}</li>
- <li>{{cssxref("border-width")}}</li>
-</ul>
-</div>
-
-<h2 id="Guides">Guides</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds">Using CSS multiple backgrounds</a></dt>
- <dd>Explains how to set backgrounds on elements and how they will interact with it.</dd>
- <dt><a href="/en-US/docs/Web/CSS/CSS_Background_and_Borders/Scaling_background_images">Scaling background images</a></dt>
- <dd>Describes how to change the appearance of the background images, by stretching them or repeating them, to cover the whole background of the element, or not.</dd>
-</dl>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{ SpecName('CSS3 Backgrounds') }}</td>
-   <td>{{ Spec2('CSS3 Backgrounds') }}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS2.1', 'box.html')}}</td>
-   <td>{{Spec2('CSS2.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS1', '#border')}}</td>
-   <td>{{Spec2('CSS1')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable()}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>4.0</td>
-   <td>3.5</td>
-   <td>1.0 (85)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown()}}</td>
-   <td>{{CompatGeckoMobile("1.9.2")}}</td>
-   <td>{{CompatVersionUnknown()}}</td>
-   <td>{{CompatVersionUnknown()}}</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/css_background_and_borders/using_css_multiple_backgrounds/index.html b/files/es/web/css/css_background_and_borders/using_css_multiple_backgrounds/index.html
deleted file mode 100644
index a80b81bf1a..0000000000
--- a/files/es/web/css/css_background_and_borders/using_css_multiple_backgrounds/index.html
+++ /dev/null
@@ -1,57 +0,0 @@
----
-title: Usando múltiples fondos con CSS
-slug: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds
-tags:
-  - CSS
-  - Ejemplo
-  - Fondos CSS
-  - Guía
-  - Intermedio
-translation_of: Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds
-translation_of_original: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds
----
-<p>{{CSSRef}}</p>
-
-<p><span class="seoSummary">Con <a href="/es/docs/Web/CSS/CSS3" title="CSS3">CSS3</a>, puedes aplicar <strong>múltiple fondos</strong> a los elementos. Estos se presentan uno encima del otro, poniendo el primer fondo definido hasta arriba, y el último, hasta abajo.</span> Sólo el último fondo puede incluir color de fondo.</p>
-
-<p>Especificar fondos múltiples es fácil:</p>
-
-<pre class="brush: css">.myclass {
-  background: background1, background 2, ..., backgroundN;
-}
-</pre>
-
-<p>Puedes hacerlo con la propiedad atajo {{ cssxref("background") }} y con las propiedades individuales, excepto {{ cssxref("background-color") }}. Es decir, las siguientes propiedades pueden ser especificadas como lista, una por cada fondo: {{ cssxref("background") }}, {{ cssxref("background-attachment") }}, {{ cssxref("background-clip") }},<code> </code>{{ cssxref("background-image") }}, {{ cssxref("background-origin") }}, {{ cssxref("background-position") }}, {{ cssxref("background-repeat") }}, {{ cssxref("background-size") }}.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>En este ejemplo, tres fondos son apilados: el logo de Firefox, un <a href="/es/docs/Web/CSS/linear-gradient" title="en/CSS/-moz-linear-gradient">gradiente lineal</a>, y una imagen de burbujas:</p>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;div class="multi_bg_example"&gt;&lt;/div&gt;</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">.multi_bg_example {
-  width: 100%;
-  height: 400px;
-  background-image: url(https://mdn.mozillademos.org/files/11305/firefox.png), url(https://mdn.mozillademos.org/files/11307/bubbles.png), linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0));
-  background-repeat: no-repeat, no-repeat, no-repeat;
-  background-position: bottom right, left, right;
-  background: -moz-linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0)), -webkit-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0)), -ms-linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0)), linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0));
-}</pre>
-
-<h2 id="Resultado">Resultado</h2>
-
-<p>(Si la imagen no aparece en CodePen, intenta con el botón TIdy en la sección de CSS)</p>
-
-<p>{{EmbedLiveSample('Example','100%','400')}}</p>
-
-<p>Como puedes ver aquí, el logo de Firefox (primero enlistado) está hasta arriba, seguido por el gradiente, que está presentado encima del fondo de burbujas. Cada subpropiedad subsecuente ({{ cssxref("background-repeat") }} y {{ cssxref("background-position") }}) aplican a los fondos correspondientes. Así, el primer valor en la lista para {{ cssxref("background-repeat") }} aplica al primer fondo (el de hasta arriba), etc.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/es/docs/CSS/Using_CSS_gradients" title="en/Using gradients">Usando gradientes con CSS</a></li>
-</ul>
diff --git a/files/es/web/css/css_backgrounds_and_borders/index.html b/files/es/web/css/css_backgrounds_and_borders/index.html
new file mode 100644
index 0000000000..3c843d9d45
--- /dev/null
+++ b/files/es/web/css/css_backgrounds_and_borders/index.html
@@ -0,0 +1,156 @@
+---
+title: CSS Background and Borders
+slug: Web/CSS/CSS_Backgrounds_and_Borders
+tags:
+  - CSS
+  - CSS Backgrounds and Borders
+  - CSS Reference
+  - NeedsTranslation
+  - Overview
+  - TopicStub
+translation_of: Web/CSS/CSS_Backgrounds_and_Borders
+translation_of_original: Web/CSS/CSS_Background_and_Borders
+original_slug: Web/CSS/CSS_Background_and_Borders
+---
+<p>{{CSSRef}}</p>
+
+<p><strong>CSS Background and Borders</strong> is a module of CSS that defines how background and borders of elements are described. Borders can be lines or images, boxes can have one or multiple backgrounds, have rounded corners, and shadows.</p>
+
+<h2 id="Reference">Reference</h2>
+
+<h3 id="CSS_Properties">CSS Properties</h3>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("background")}}</li>
+ <li>{{cssxref("background-attachment")}}</li>
+ <li>{{cssxref("background-clip")}}</li>
+ <li>{{cssxref("background-color")}}</li>
+ <li>{{cssxref("background-image")}}</li>
+ <li>{{cssxref("background-origin")}}</li>
+ <li>{{cssxref("background-position")}}</li>
+ <li>{{cssxref("background-repeat")}}</li>
+ <li>{{cssxref("background-size")}}</li>
+ <li>{{cssxref("box-shadow")}}</li>
+ <li>{{cssxref("border")}}</li>
+ <li>{{cssxref("border-bottom")}}</li>
+ <li>{{cssxref("border-bottom-color")}}</li>
+ <li>{{cssxref("border-bottom-left-radius")}}</li>
+ <li>{{cssxref("border-bottom-right-radius")}}</li>
+ <li>{{cssxref("border-bottom-style")}}</li>
+ <li>{{cssxref("border-bottom-width")}}</li>
+ <li>{{cssxref("border-collapse")}}</li>
+ <li>{{cssxref("border-color")}}</li>
+ <li>{{cssxref("border-image")}}</li>
+ <li>{{cssxref("border-image-outset")}}</li>
+ <li>{{cssxref("border-image-repeat")}}</li>
+ <li>{{cssxref("border-image-slice")}}</li>
+ <li>{{cssxref("border-image-source")}}</li>
+ <li>{{cssxref("border-image-width")}}</li>
+ <li>{{cssxref("border-left")}}</li>
+ <li>{{cssxref("border-left-color")}}</li>
+ <li>{{cssxref("border-left-style")}}</li>
+ <li>{{cssxref("border-left-width")}}</li>
+ <li>{{cssxref("border-radius")}}</li>
+ <li>{{cssxref("border-right")}}</li>
+ <li>{{cssxref("border-right-color")}}</li>
+ <li>{{cssxref("border-right-style")}}</li>
+ <li>{{cssxref("border-right-width")}}</li>
+ <li>{{cssxref("border-style")}}</li>
+ <li>{{cssxref("border-top")}}</li>
+ <li>{{cssxref("border-top-color")}}</li>
+ <li>{{cssxref("border-top-left-radius")}}</li>
+ <li>{{cssxref("border-top-right-radius")}}</li>
+ <li>{{cssxref("border-top-style")}}</li>
+ <li>{{cssxref("border-top-width")}}</li>
+ <li>{{cssxref("border-width")}}</li>
+</ul>
+</div>
+
+<h2 id="Guides">Guides</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds">Using CSS multiple backgrounds</a></dt>
+ <dd>Explains how to set backgrounds on elements and how they will interact with it.</dd>
+ <dt><a href="/en-US/docs/Web/CSS/CSS_Background_and_Borders/Scaling_background_images">Scaling background images</a></dt>
+ <dd>Describes how to change the appearance of the background images, by stretching them or repeating them, to cover the whole background of the element, or not.</dd>
+</dl>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('CSS3 Backgrounds') }}</td>
+   <td>{{ Spec2('CSS3 Backgrounds') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS2.1', 'box.html')}}</td>
+   <td>{{Spec2('CSS2.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS1', '#border')}}</td>
+   <td>{{Spec2('CSS1')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable()}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>4.0</td>
+   <td>3.5</td>
+   <td>1.0 (85)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown()}}</td>
+   <td>{{CompatGeckoMobile("1.9.2")}}</td>
+   <td>{{CompatVersionUnknown()}}</td>
+   <td>{{CompatVersionUnknown()}}</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html b/files/es/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
new file mode 100644
index 0000000000..cf372aa607
--- /dev/null
+++ b/files/es/web/css/css_backgrounds_and_borders/using_multiple_backgrounds/index.html
@@ -0,0 +1,58 @@
+---
+title: Usando múltiples fondos con CSS
+slug: Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds
+tags:
+  - CSS
+  - Ejemplo
+  - Fondos CSS
+  - Guía
+  - Intermedio
+translation_of: Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds
+translation_of_original: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds
+original_slug: Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds
+---
+<p>{{CSSRef}}</p>
+
+<p><span class="seoSummary">Con <a href="/es/docs/Web/CSS/CSS3" title="CSS3">CSS3</a>, puedes aplicar <strong>múltiple fondos</strong> a los elementos. Estos se presentan uno encima del otro, poniendo el primer fondo definido hasta arriba, y el último, hasta abajo.</span> Sólo el último fondo puede incluir color de fondo.</p>
+
+<p>Especificar fondos múltiples es fácil:</p>
+
+<pre class="brush: css">.myclass {
+  background: background1, background 2, ..., backgroundN;
+}
+</pre>
+
+<p>Puedes hacerlo con la propiedad atajo {{ cssxref("background") }} y con las propiedades individuales, excepto {{ cssxref("background-color") }}. Es decir, las siguientes propiedades pueden ser especificadas como lista, una por cada fondo: {{ cssxref("background") }}, {{ cssxref("background-attachment") }}, {{ cssxref("background-clip") }},<code> </code>{{ cssxref("background-image") }}, {{ cssxref("background-origin") }}, {{ cssxref("background-position") }}, {{ cssxref("background-repeat") }}, {{ cssxref("background-size") }}.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>En este ejemplo, tres fondos son apilados: el logo de Firefox, un <a href="/es/docs/Web/CSS/linear-gradient" title="en/CSS/-moz-linear-gradient">gradiente lineal</a>, y una imagen de burbujas:</p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div class="multi_bg_example"&gt;&lt;/div&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">.multi_bg_example {
+  width: 100%;
+  height: 400px;
+  background-image: url(https://mdn.mozillademos.org/files/11305/firefox.png), url(https://mdn.mozillademos.org/files/11307/bubbles.png), linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0));
+  background-repeat: no-repeat, no-repeat, no-repeat;
+  background-position: bottom right, left, right;
+  background: -moz-linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0)), -webkit-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0)), -ms-linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0)), linear-gradient(to right, rgba(30, 75, 115, 1), rgba(255, 255, 255, 0));
+}</pre>
+
+<h2 id="Resultado">Resultado</h2>
+
+<p>(Si la imagen no aparece en CodePen, intenta con el botón TIdy en la sección de CSS)</p>
+
+<p>{{EmbedLiveSample('Example','100%','400')}}</p>
+
+<p>Como puedes ver aquí, el logo de Firefox (primero enlistado) está hasta arriba, seguido por el gradiente, que está presentado encima del fondo de burbujas. Cada subpropiedad subsecuente ({{ cssxref("background-repeat") }} y {{ cssxref("background-position") }}) aplican a los fondos correspondientes. Así, el primer valor en la lista para {{ cssxref("background-repeat") }} aplica al primer fondo (el de hasta arriba), etc.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/es/docs/CSS/Using_CSS_gradients" title="en/Using gradients">Usando gradientes con CSS</a></li>
+</ul>
diff --git a/files/es/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html b/files/es/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html
new file mode 100644
index 0000000000..ba59e38ced
--- /dev/null
+++ b/files/es/web/css/css_basic_user_interface/using_url_values_for_the_cursor_property/index.html
@@ -0,0 +1,40 @@
+---
+title: Uso de URL como valor de la propiedad cursor
+slug: Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property
+tags:
+  - CSS
+  - Todas_las_Categorías
+translation_of: Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property
+original_slug: Web/CSS/cursor/Uso_de_URL_como_valor_de_la_propiedad_cursor
+---
+<p><a href="/es/Gecko" title="es/Gecko">Gecko</a> 1.8 (<a href="/es/Firefox_1.5_para_Desarrolladores" title="es/Firefox_1.5_para_Desarrolladores">Firefox 1.5</a>, SeaMonkey 1.0) soporta el uso de URLs como valores para la <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/ui.html#propdef-cursor">propiedad cursor</a> (CSS2). Esto nos permite definir la imagen que queremos como puntero del ratón, además podemos usar cualquiera de los formatos gráficos soportados por Gecko.</p>
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+<p>La sintaxis de esta propiedad es:</p>
+<pre class="eval">cursor: [&lt;url&gt;,]* cursor-genérico;
+</pre>
+<p>Esto es, se pueden indicar cero o más direcciones URL (separadas por comas), que <strong>deben</strong> ser seguidas de uno de los cursores genéricos definidos en la especificación, por ej. <code>help</code> o <code>pointer</code>.</p>
+<p>Los siguientes valores están permitidos:</p>
+<pre class="eval">cursor: url(foo.cur), url(<span class="nowiki">http://developer.mozilla.org/wiki-images/es/e/ed/firefox.jpg</span>), help;
+</pre>
+<p>Primero se intentará cargar <em>foo.cur</em>. Si este archivo no existe o no es válido por alguna otra razón, se probará con <em>firefox.jpg</em>, y si este tampoco puede ser cargado, se usará <em>help</em>.</p>
+<p>El soporte a la <a class="external" href="http://www.w3.org/TR/css3-ui/#cursor">sintaxis de CSS3</a> para los valores de cursor fue añadido en Gecko 1.8beta3; por lo tanto en Firefox 1.5 funciona. Esto permite especificar las coordenadas del punto en el que la imagen del cursor es fijada al área activa. Si no se especifican, las coordenadas del punto de contacto son tomadas del propio archivo (para archivos CUR y XBM) o se fijan en la esquina superior izquierda de la imagen.</p>
+<p>Un ejemplo de la sintaxis CSS3:</p>
+<pre class="eval">cursor: url(<span class="nowiki">http://developer.mozilla.org/wiki-images/es/e/ed/firefox.jpg</span>), auto;
+
+cursor: url(<span class="nowiki">http://developer.mozilla.org/wiki-images/es/e/ed/firefox.jpg</span>) 90 90, auto;
+</pre>
+<p><br>
+ El primer número es la coordenada X, y el segundo la coordenada Y. El ejemplo anterior pone el punto de contacto del área activa a (90,90) píxeles de la esquina superior izquierda (0,0).</p>
+<h3 id="Limitaciones" name="Limitaciones">Limitaciones</h3>
+<p>Pueden usarse todos los formatos gráficos soportados por Gecko. Por lo tanto puede usar imágenes PNG, JPG, CUR, GIF, etc. Sin embargo, ANI no está soportado. Además, si especifica un GIF animado, el cursor usará el GIF, pero sin animación. Esta limitación podría ser superada en futuras versiones.</p>
+<p>Gecko no limita el tamaño de los cursores. Sin embargo, quien busque la máxima compatibilidad multiplataforma debería limitarlos a un tamaño de 32x32, los cursores más grandes no funcionarán en Windows 9x (95, 98, MÍ).</p>
+<p>Los cursores translúcidos no estan soportados en las versiones de Windows anteriores a XP. Esto es una limitación del sistema operativo. La transparencia funciona en todas las plataformas.</p>
+<p>Solo las versiones de Mozilla para Windows, OS/2 y GNU/Linux (usando GTK+ 2.4 o superior) soportan valores URL para los cursores. El soporte en otras plataformas podría ser añadido en futuras versiones: (Mac OS: {{ Bug(286304) }}, QNX Neutrino: {{ Bug(286307) }}, XLib: {{ Bug(286309) }}, Qt: {{ Bug(286310) }}, BeOS: {{ Bug(298184) }}, GTK 2.0/2.2: {{ Bug(308536) }})</p>
+<h3 id="Compatibilidad_con_otros_navegadores" name="Compatibilidad_con_otros_navegadores">Compatibilidad con otros navegadores</h3>
+<p>Microsoft Internet Explorer también soporta URI como valor para la propiedad <code>cursor</code>. Sin embargo, solo soporta los formatos gráficos CUR y ANI. Además, es menos estricto con la sintaxis de la propiedad <code>cursor</code>. Esto significa que declaraciones como:</p>
+<pre class="eval">cursor: url(foo.cur);
+</pre>
+<p>O:</p>
+<pre class="eval">cursor: url(foo.cur), pointer, url(bar.cur), auto;
+</pre>
+<p>funcionarán en MSIE, pero no lo harán en los navegadores basados en Gecko. Para ser compatible con Gecko y actuar conforme a la especificación de CSS2.1, ponga la lista de URIs primero, y ponga siempre <strong>un</strong> cursor genérico <strong>al final</strong>. <span class="comment">: ''To-do: document what MSIE does with CSS 3 hotspot locations''</span></p>
diff --git a/files/es/web/css/css_box_model/index.html b/files/es/web/css/css_box_model/index.html
new file mode 100644
index 0000000000..c051e7e720
--- /dev/null
+++ b/files/es/web/css/css_box_model/index.html
@@ -0,0 +1,166 @@
+---
+title: Modelo de Caja de CSS
+slug: Web/CSS/CSS_Box_Model
+tags:
+  - CSS
+  - Modelo de Caja CSS
+  - Referencia CSS
+  - Visión general
+translation_of: Web/CSS/CSS_Box_Model
+original_slug: Web/CSS/CSS_Modelo_Caja
+---
+<div>{{CSSRef}}</div>
+
+<p><strong>El modelo de caja CSS </strong> es un módulo  CSS que define cajas rectangulares, incluyendo sus rellenos y márgenes, que son generadas para los elementos y que se disponen de acuerdo al modelo de formato visual.</p>
+
+<h2 id="Referencia">Referencia</h2>
+
+<h3 id="Propiedades">Propiedades</h3>
+
+<h4 id="Propiedades_que_controlan_el_flujo_del_contenido_en_una_caja.">Propiedades que controlan el flujo del contenido en una caja.</h4>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("box-decoration-break")}}</li>
+ <li>{{cssxref("box-sizing")}}</li>
+ <li>{{cssxref("overflow")}}</li>
+ <li>{{cssxref("overflow-x")}}</li>
+ <li>{{cssxref("overflow-y")}}</li>
+</ul>
+</div>
+
+<h4 id="Propiedades_que_controlan_el_tamaño_de_una_caja.">Propiedades que controlan el tamaño de una caja.</h4>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("height")}}</li>
+ <li>{{cssxref("width")}}</li>
+ <li>{{cssxref("max-height")}}</li>
+ <li>{{cssxref("max-width")}}</li>
+ <li>{{cssxref("min-height")}}</li>
+ <li>{{cssxref("min-width")}}</li>
+</ul>
+</div>
+
+<h4 id="Propiedades_que_controlan_los_márgenes_de_una_caja.">Propiedades que controlan los márgenes de una caja.</h4>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("margin")}}</li>
+ <li>{{cssxref("margin-bottom")}}</li>
+ <li>{{cssxref("margin-left")}}</li>
+ <li>{{cssxref("margin-right")}}</li>
+ <li>{{cssxref("margin-top")}}</li>
+</ul>
+</div>
+
+<h4 id="Propiedades_que_controlan_los_rellenos_de_una_caja">Propiedades que controlan los rellenos de una caja</h4>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("padding")}}</li>
+ <li>{{cssxref("padding-bottom")}}</li>
+ <li>{{cssxref("padding-left")}}</li>
+ <li>{{cssxref("padding-right")}}</li>
+ <li>{{cssxref("padding-top")}}</li>
+</ul>
+</div>
+
+<h4 id="Otras_propiedades">Otras propiedades</h4>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("box-shadow")}}</li>
+ <li>{{cssxref("visibility")}}</li>
+</ul>
+</div>
+
+<h2 id="Guías_y_Herramientas">Guías y Herramientas</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model">Introduction to the CSS box model</a></dt>
+ <dd>Explica uno de los conceptos fundamentales de CSS, el modelo de caja: describe el significado del margen, del relleno, así como de las diferentes zonas de una caja.</dd>
+ <dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing">Mastering margin collapsing</a></dt>
+ <dd>En determinados casos dos márgenes adyacentes se convierten en uno. Este artículo explica cuando sucede esto y cómo controlarlo.</dd>
+ <dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Box-shadow_generator">Box-shadow generator</a></dt>
+ <dd>Una herramienta interactiva que permite crear sombras y proporciona la síntaxis necesaria para generar dichas sombras usando la propiedad {{cssxref("box-shadow")}}.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Box")}}</td>
+   <td>{{Spec2("CSS3 Box")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("CSS2.1", "box.html")}}</td>
+   <td>{{Spec2("CSS2.1")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("CSS1")}}</td>
+   <td>{{Spec2("CSS1")}}</td>
+   <td>Definición Inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1")}}</td>
+   <td>3.0</td>
+   <td>3.5</td>
+   <td>1.0 (85)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoMobile("1")}}</td>
+   <td>6.0</td>
+   <td>6.0</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/css_box_model/introduction_to_the_css_box_model/index.html b/files/es/web/css/css_box_model/introduction_to_the_css_box_model/index.html
new file mode 100644
index 0000000000..985d15eef6
--- /dev/null
+++ b/files/es/web/css/css_box_model/introduction_to_the_css_box_model/index.html
@@ -0,0 +1,67 @@
+---
+title: Introducción al Modelo de Caja de CSS
+slug: Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model
+tags:
+  - CSS
+  - Guía
+  - Modelo de Caja
+  - Referencia
+translation_of: Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model
+original_slug: Web/CSS/CSS_Modelo_Caja/Introducción_al_modelo_de_caja_de_CSS
+---
+<div>{{CSSRef}}</div>
+
+<p><span id="result_box" lang="es">Al diseñar un documento, el motor de representación del navegador representa cada elemento como un cuadro rectangular según el estándar</span><span lang="es"><span> <strong>modelo de caja de CSS</strong>.</span> <span>CSS determina el tamaño, la posición y las propiedades (color, fondo, tamaño del borde, etc.) de estos cuadros.</span></span></p>
+
+<p><span id="result_box" lang="es"><span>Cada caja se compone de cuatro partes (o áreas), definidas por sus respectivos límites: el <em>límite del contenido</em>, el <em>límite del relleno (padding)</em>, el <em>límite del borde</em> y el <em>límite del margen</em>.</span></span></p>
+
+<p><img alt="CSS Box model" src="https://mdn.mozillademos.org/files/8685/boxmodel-(3).png" style="height: 384px; width: 548px;"></p>
+
+<p><a name="content-area"></a><span id="result_box" lang="es"><span>El <strong>área de contenido</strong>, delimitada por el límite del contenido, contiene el contenido "real" del elemento, como lo puede ser texto, imagen o un reproductor de video.</span> <span>Sus dimensiones son el <em>ancho del contenido</em> (o el <em>ancho de la caja de contenido</em>) y la <em>altura del contenido</em> (o la <em>altura de la caja de contenido</em>).</span> <span>A menudo tiene un color de fondo o una imagen de fondo.</span></span></p>
+
+<p><span id="result_box" lang="es"><span>Si la propiedad </span></span>{{cssxref("box-sizing")}}<span lang="es"><span> está configurada en </span></span><code>content-box</code><span lang="es"><span> (default), el tamaño del área de contenido se puede definir explícitamente con las propiedades de </span></span>{{cssxref("width")}}<span lang="es"><span>, </span></span>{{cssxref("min-width")}}<span lang="es"><span>, </span></span>{{cssxref("max-width")}}<span lang="es"><span>, </span></span>{{ cssxref("height")}}<span lang="es"><span>, </span></span>{{cssxref("min-height")}}<span lang="es"><span> y </span></span>{{cssxref("max-height")}}<span lang="es"><span>.</span></span></p>
+
+<p><a name="padding-area"></a><span id="result_box" lang="es"><span>El <strong>área de relleno</strong> (padding), delimitada por el límite del relleno, extiende el área de contenido para incluir el relleno del elemento.</span> <span>Sus dimensiones son el <em>ancho de la caja de relleno</em> y la <em>altura de la caja de relleno</em>.</span> <span>Cuando el área de contenido tiene un fondo, se extiende dentro del relleno.</span></span></p>
+
+<p><span id="result_box" lang="es"><span>El espesor del relleno está determinado por </span></span><span lang="es"><span>las propiedades </span></span>{{cssxref("padding-top")}}<span lang="es"><span>, </span></span>{{cssxref("padding-right")}}<span lang="es"><span>, </span></span>{{cssxref("padding-bottom")}}<span lang="es"><span>, </span></span>{{cssxref("padding-left")}}<span lang="es"><span>, y la propiedad abreviada </span></span>{{cssxref("padding")}}<span lang="es"><span>.</span></span></p>
+
+<p><a name="border-area"></a><span id="result_box" lang="es"><span>El <strong>área del borde</strong>, delimitada por el límite del borde, extiende el área de relleno para incluir los bordes del elemento.</span> <span>Sus dimensiones son el <em>ancho de la caja del borde</em> y la <em>altura de la caja del borde</em>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span>El espesor de los bordes está determinado por las propiedades {{cssxref("border-width")}} y la propiedad abreviada {{cssxref("border")}}.</span> <span>Si la propiedad {{cssxref("box-sizing")}} se establece en </span></span><code>border-box</code><span lang="es"><span>, el tamaño del área del borde se puede definir explícitamente con las propiedades {{cssxref("width")}}, {{cssxref("min-</span> <span>width")}}, {{cssxref("max-width")}}, {{cssxref("height")}}, {{cssxref("min-height")}}, y {{cssxref("max</span><span>-height")}}.</span></span></p>
+
+<p><a name="margin-area"></a><span id="result_box" lang="es"><span>El <strong>área del margen</strong>, delimitada por el límite del margen, extiende el área del borde para incluir un área vacía utilizada para separar el elemento de sus vecinos.</span> <span>Sus dimensiones son el <em>ancho de la caja del margen</em> y la <em>altura de la caja del margen</em>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span>El tamaño del área del margen está determinado por las propiedades </span></span>{{cssxref("margin-top")}}<span lang="es"><span>, {{cssxref("margin-right")}}, {{cssxref ("margin-bottom")}}, {</span> <span>{cssxref("margin-left")}}, y la propiedad abreviada {{cssxref ("margin")}}.</span> <span>Cuando se produce el</span></span> <a href="/en/CSS/margin_collapsing" title="en/CSS/margin_collapsing">colapso del margen</a><span lang="es"><span>, el área del margen no está claramente definida ya que los márgenes se comparten entre las cajas.</span></span></p>
+
+<p><span id="result_box" lang="es"><span>Finalmente, ten en cuenta que para elementos en línea no reemplazados, la cantidad de espacio ocupado (la contribución a la altura de la línea) está determinada por la propiedad {{cssxref ('line-height')}}, aunque los bordes y</span> <span>el relleno todavía se muestran alrededor del contenido.</span></span></p>
+
+<h2 id="Especificación">Especificación</h2>
+
+<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("CSS2.1","box.html#box-dimensions")}}</td>
+   <td>{{ Spec2('CSS2.1') }}</td>
+   <td><span id="result_box" lang="es"><span>Aunque está redactado con más precisión, no hay cambio práctico.</span></span></td>
+  </tr>
+  <tr>
+   <td>{{ SpecName("CSS1","#formatting-model")}}</td>
+   <td>{{ Spec2('CSS1') }}</td>
+   <td><span class="short_text" id="result_box" lang="es"><span>Definición inicial</span></span></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{css_key_concepts}}</li>
+ <li>Propiedades CSS relacionadas: {{ cssxref("box-sizing") }}, {{ cssxref("background-clip") }}, {{ cssxref("height") }}, {{ cssxref("max-height") }}, {{ cssxref("min-height") }}, {{ cssxref("width") }}, {{ cssxref("max-height") }}, {{ cssxref("min-height") }}, {{ cssxref("padding") }}, {{ cssxref("padding-top") }}, {{ cssxref("padding-right") }}, {{ cssxref("padding-bottom") }}, {{ cssxref("padding-left") }}, {{ cssxref("border") }}, {{ cssxref("border-top") }}, {{ cssxref("border-right") }}, {{ cssxref("border-bottom") }}, {{ cssxref("border-left") }}, {{ cssxref("border-width") }}, {{ cssxref("border-top-width") }}, {{ cssxref("border-right-width") }}, {{ cssxref("border-bottom-width") }}, {{ cssxref("border-left-width") }}, {{ cssxref("margin") }}, {{ cssxref("margin-top") }}, {{ cssxref("margin-right") }}, {{ cssxref("margin-bottom") }}, {{ cssxref("margin-left") }}</li>
+</ul>
diff --git a/files/es/web/css/css_box_model/mastering_margin_collapsing/index.html b/files/es/web/css/css_box_model/mastering_margin_collapsing/index.html
new file mode 100644
index 0000000000..6c4f7a753e
--- /dev/null
+++ b/files/es/web/css/css_box_model/mastering_margin_collapsing/index.html
@@ -0,0 +1,97 @@
+---
+title: Entendiendo el colapso de margen
+slug: Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
+tags:
+  - CSS
+  - CSS Box Model
+  - Guía
+  - Referencia
+translation_of: Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
+original_slug: Web/CSS/CSS_Modelo_Caja/Mastering_margin_collapsing
+---
+<div>{{CSSRef}}</div>
+
+<p>Los márgenes <a href="/es/docs/Web/CSS/margin-top">Top</a> y <a href="/es/docs/Web/CSS/margin-bottom">bottom</a> de los bloques a veces están combinados (colapsados) en un solo margen cuyo tamaño es el mayor de los márgenes combinados, un comportamiento conocido como <strong>colapso de margen</strong>. Ten en cuenta que los márgenes de <a href="/es/docs/Web/CSS/float">flotantes</a> y elementos con <a href="/es/docs/Web/CSS/position"> posición absoluta</a> nunca colapsan.</p><p></p>
+
+<p>El colapso de margen ocurre en tres casos básicos:</p>
+
+<dl>
+ <dt>Hermanos adjacentes</dt>
+ <dd>Los márgenes de los hermanos adjacentes son colapsados (excepto cuando el último hermano necesita ser <a href="/es/docs/Web/CSS/clear">limpiado</a> después de usar los flotantes).</dd>
+ <dt>Padre y primer/último hijo</dt>
+ <dd>Si no hay un borde, padding, contenido en línea, <a href="/es/docs/Web/Guide/CSS/Block_formatting_context">block formatting context</a> creado, o un <em><a href="/es/docs/Web/CSS/clear">limpiado</a></em> para separar el {{cssxref("margin-top")}} de un bloque del {{cssxref("margin-top")}} de su primer bloque hijo; o no hay borde, padding, contenido en línea, {{cssxref("height")}}, {{cssxref("min-height")}}, o {{cssxref("max-height")}} para separar el {{cssxref("margin-bottom")}} de un bloque del {{cssxref("margin-bottom")}} de su último hijo, entonces esos márgenes colapsan. El margen colapsado termina fuera del padre.</dd>
+ <dt>Bloques vacíos</dt>
+ <dd>Si no hay borde, padding, contenido en línea, {{cssxref("height")}}, o {{cssxref("min-height")}} para separar el {{cssxref("margin-top")}} de un bloque de su {{cssxref("margin-bottom")}}, entonces sus márgenes superiores e inferiores colapsan.</dd>
+</dl>
+ <p>Cosas a tener en cuenta:</p>
+
+
+<ul>
+ <li>Cuando estos casos están combinados ocurrirá un colapso de márgenes más complejo (de más de dos márgenes).</li>
+ <li>Estas reglas se aplican incluso a márgenes con valor cero, así que el margen del primer/último hijo siempre termina fuera de su padre (de acuerdo a las reglas de arriba) independientemente de que el margen del padre sea o no sea cero.</li>
+ <li>Cuando se trata de márgenes negativos, el tamaño del margen colapsado es la suma del margen positivo más grande y el margen negativo más pequeño (el más negativo).</li>
+ <li>Cuando todos los márgenes son negativos, el tamaño del margen colapsado es el margen más pequeño (el más negativo). Esto se aplica tanto a los elementos adyacentes como a los elementos anidados.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;p&gt;El margen inferior de este párrafo está colapsado ....&lt;/p&gt;
+&lt;p&gt;... con el margen superior de este párrafo, lo que deja un margen de&lt;code&gt;1.2rem&lt;/code&gt; entre ellos.&lt;/p&gt;
+
+&lt;div&gt;Este elemento padre contiene dos párrafos!
+  &lt;p&gt;Este párrafo tiene un margen de &lt;code&gt;.4rem&lt;/code&gt;  entre él y el texto anterior.&lt;/p&gt;
+  &lt;p&gt;Mi margen inferior se colapsa con mi padre, produciendo un margen inferior de &lt;code&gt;2rem&lt;/code&gt;.&lt;/p&gt;
+&lt;/div&gt;
+
+&lt;p&gt;Estoy &lt;code&gt;2rem&lt;/code&gt; por debajo del elemento de arriba.&lt;/p&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">div {
+  margin: 2rem 0;
+  background: lavender;
+}
+
+p {
+  margin: .4rem 0 1.2rem 0;
+  background: yellow;
+}</pre>
+
+<h3 id="Result">Result</h3>
+
+<p>{{EmbedLiveSample('Ejemplos', 'auto', 350)}}</p>
+
+
+
+<p> </p>
+
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("CSS2.1", "box.html#collapsing-margins", "margin collapsing")}}</td>
+   <td>{{Spec2("CSS2.1")}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="También_puedes_ver">También puedes ver</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/Referencia_CSS">CSS Reference</a></li>
+</ul>
+<ul>
+ <li>{{css_key_concepts}}</li>
+</ul>
diff --git a/files/es/web/css/css_color/index.html b/files/es/web/css/css_color/index.html
new file mode 100644
index 0000000000..5373c54dfd
--- /dev/null
+++ b/files/es/web/css/css_color/index.html
@@ -0,0 +1,121 @@
+---
+title: CSS Colors
+slug: Web/CSS/CSS_Color
+tags:
+  - CSS
+  - CSS Colors
+  - NeedsTranslation
+  - Overview
+  - Reference
+  - TopicStub
+translation_of: Web/CSS/CSS_Color
+translation_of_original: Web/CSS/CSS_Colors
+original_slug: Web/CSS/CSS_Colors
+---
+<div>{{CSSRef}}</div>
+
+<p><strong>Los colores CSS</strong> son un módulo de CSS que trabaja con colores, tipos de colores y transparencias.</p>
+
+<h2 id="Referencia">Referencia</h2>
+
+<h3 id="Propiedades">Propiedades</h3>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("color")}}</li>
+ <li>{{cssxref("opacity")}}</li>
+</ul>
+</div>
+
+<h3 id="Tipos_de_datos_CSS">Tipos de datos CSS</h3>
+
+<p>{{cssxref("&lt;color&gt;")}}</p>
+
+<h2 id="Guías">Guías</h2>
+
+<p><em>Ninguna.</em></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Colors')}}</td>
+   <td>{{Spec2('CSS3 Colors')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS2.1', 'colors.html')}}</td>
+   <td>{{Spec2('CSS2.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS1')}}</td>
+   <td>{{Spec2('CSS1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1")}}</td>
+   <td>3.0</td>
+   <td>3.5</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoMobile("1")}}</td>
+   <td>6.0</td>
+   <td>6.0</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>En CSS, las gradientes no son colores sino <a href="/en-US/docs/Web/CSS/CSS_Images">imágenes</a>.</li>
+</ul>
diff --git a/files/es/web/css/css_colors/color_picker_tool/index.html b/files/es/web/css/css_colors/color_picker_tool/index.html
new file mode 100644
index 0000000000..d3758668dd
--- /dev/null
+++ b/files/es/web/css/css_colors/color_picker_tool/index.html
@@ -0,0 +1,3221 @@
+---
+title: Herramienta para seleccionar color
+slug: Web/CSS/CSS_Colors/Color_picker_tool
+tags:
+  - CSS
+  - Herramientas
+translation_of: Web/CSS/CSS_Colors/Color_picker_tool
+original_slug: Web/CSS/CSS_Colors/Herramienta_para_seleccionar_color
+---
+<div style="display: none;">
+<h2 id="ColorPicker_Tool" name="ColorPicker_Tool">ColorPicker tool</h2>
+
+<h3 id="HTML_Content">HTML Content</h3>
+
+<pre class="brush: html">    &lt;div id="container"&gt;
+        &lt;div id="palette" class="block"&gt;
+            &lt;div id="color-palette"&gt;&lt;/div&gt;
+            &lt;div id="color-info"&gt;
+                &lt;div class="title"&gt; CSS Color &lt;/div&gt;
+            &lt;/div&gt;
+        &lt;/div&gt;
+
+        &lt;div id="picker" class="block"&gt;
+            &lt;div class="ui-color-picker" data-topic="picker" data-mode="HSL"&gt;&lt;/div&gt;
+            &lt;div id="picker-samples" sample-id="master"&gt;&lt;/div&gt;
+            &lt;div id="controls"&gt;
+                &lt;div id="delete"&gt;
+                    &lt;div id="trash-can"&gt;&lt;/div&gt;
+                &lt;/div&gt;
+                &lt;div id="void-sample" class="icon"&gt;&lt;/div&gt;
+            &lt;/div&gt;
+        &lt;/div&gt;
+
+        &lt;div id="canvas" data-tutorial="drop"&gt;
+            &lt;div id="zindex" class="ui-input-slider" data-topic="z-index" data-info="z-index"
+                data-max="20" data-sensivity="10"&gt;&lt;/div&gt;
+        &lt;/div&gt;
+    &lt;/div&gt;
+
+</pre>
+
+<h3 id="CSS_Content">CSS Content</h3>
+
+<pre class="brush: css">/*
+ * COLOR PICKER TOOL
+ */
+
+.ui-color-picker {
+	width: 420px;
+	margin: 0;
+	border: 1px solid #DDD;
+	background-color: #FFF;
+	display: table;
+
+	-moz-user-select: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+
+.ui-color-picker .picking-area {
+	width: 198px;
+	height: 198px;
+	margin: 5px;
+	border: 1px solid #DDD;
+	position: relative;
+	float: left;
+	display: table;
+}
+
+.ui-color-picker .picking-area:hover {
+	cursor: default;
+}
+
+/* HSV format - Hue-Saturation-Value(Brightness) */
+.ui-color-picker .picking-area {
+	background: url('https://mdn.mozillademos.org/files/5707/picker_mask_200.png') center center;
+
+	background: -moz-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
+				-moz-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
+	background: -webkit-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
+				-webkit-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
+	background: -ms-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
+				-ms-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
+	background: -o-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
+				-o-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
+
+	background-color: #F00;
+}
+
+/* HSL format - Hue-Saturation-Lightness */
+.ui-color-picker[data-mode='HSL'] .picking-area {
+	background: -moz-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
+									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
+				-moz-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
+	background: -webkit-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
+									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
+				-webkit-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
+	background: -ms-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
+									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
+				-ms-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
+	background: -o-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
+									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
+				-o-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
+	background-color: #F00;
+}
+
+.ui-color-picker .picker {
+	width: 10px;
+	height: 10px;
+	border-radius: 50%;
+	border: 1px solid #FFF;
+	position: absolute;
+	top: 45%;
+	left: 45%;
+}
+
+.ui-color-picker .picker:before {
+	width: 8px;
+	height: 8px;
+	content: "";
+	position: absolute;
+	border: 1px solid #999;
+	border-radius: 50%;
+}
+
+.ui-color-picker .hue,
+.ui-color-picker .alpha {
+	width: 198px;
+	height: 28px;
+	margin: 5px;
+	border: 1px solid #FFF;
+	float: left;
+}
+
+.ui-color-picker .hue {
+	background: url("https://mdn.mozillademos.org/files/5701/hue.png") center;
+	background: -moz-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
+				#00F 66.66%, #F0F 83.33%, #F00 100%);
+	background: -webkit-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
+				#00F 66.66%, #F0F 83.33%, #F00 100%);
+	background: -ms-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
+				#00F 66.66%, #F0F 83.33%, #F00 100%);
+	background: -o-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
+				#00F 66.66%, #F0F 83.33%, #F00 100%);
+}
+
+.ui-color-picker .alpha {
+	border: 1px solid #CCC;
+	background: url("https://mdn.mozillademos.org/files/5705/alpha.png");
+}
+
+.ui-color-picker .alpha-mask {
+	width: 100%;
+	height: 100%;
+	background: url("https://mdn.mozillademos.org/files/6089/alpha_mask.png");
+}
+
+.ui-color-picker .slider-picker {
+	width: 2px;
+	height: 100%;
+	border: 1px solid #777;
+	background-color: #FFF;
+	position: relative;
+	top: -1px;
+}
+
+/* input HSV and RGB */
+
+.ui-color-picker .info {
+	width: 200px;
+	margin: 5px;
+	float: left;
+}
+
+.ui-color-picker .info * {
+	float: left;
+}
+
+.ui-color-picker .input {
+	width: 64px;
+	margin: 5px 2px;
+	float: left;
+}
+
+.ui-color-picker .input .name {
+	height: 20px;
+	width: 30px;
+	text-align: center;
+	font-size: 14px;
+	line-height: 18px;
+	float: left;
+}
+
+.ui-color-picker .input input {
+	width: 30px;
+	height: 18px;
+	margin: 0;
+	padding: 0;
+	border: 1px solid #DDD;
+	text-align: center;
+	float: right;
+
+	-moz-user-select: text;
+	-webkit-user-select: text;
+	-ms-user-select: text;
+}
+
+.ui-color-picker .input[data-topic="lightness"] {
+	display: none;
+}
+
+.ui-color-picker[data-mode='HSL'] .input[data-topic="value"] {
+	display: none;
+}
+
+.ui-color-picker[data-mode='HSL'] .input[data-topic="lightness"] {
+	display: block;
+}
+
+.ui-color-picker .input[data-topic="alpha"] {
+	margin-top: 10px;
+	width: 93px;
+}
+
+.ui-color-picker .input[data-topic="alpha"] &gt; .name {
+	width: 60px;
+}
+
+.ui-color-picker .input[data-topic="alpha"] &gt; input {
+	float: right;
+}
+
+.ui-color-picker .input[data-topic="hexa"] {
+	width: auto;
+	float: right;
+	margin: 6px 8px 0 0;
+}
+
+.ui-color-picker .input[data-topic="hexa"] &gt; .name {
+	display: none;
+}
+
+.ui-color-picker .input[data-topic="hexa"] &gt; input {
+	width: 90px;
+	height: 24px;
+	padding: 2px 0;
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+/* Preview color */
+.ui-color-picker .preview {
+	width: 95px;
+	height: 53px;
+	margin: 5px;
+	margin-top: 10px;
+	border: 1px solid #DDD;
+	background-image: url("https://mdn.mozillademos.org/files/5705/alpha.png");
+	float: left;
+	position: relative;
+}
+
+.ui-color-picker .preview:before {
+	height: 100%;
+	width: 50%;
+	left: 50%;
+	top: 0;
+	content: "";
+	background: #FFF;
+	position: absolute;
+	z-index: 1;
+}
+
+.ui-color-picker .preview-color {
+	width: 100%;
+	height: 100%;
+	background-color: rgba(255, 0, 0, 0.5);
+	position: absolute;
+	z-index: 1;
+}
+
+.ui-color-picker .switch_mode {
+	width: 10px;
+	height: 20px;
+	position: relative;
+	border-radius: 5px 0 0 5px;
+	border: 1px solid #DDD;
+	background-color: #EEE;
+	left: -12px;
+	top: -1px;
+	z-index: 1;
+	transition: all 0.5s;
+}
+
+.ui-color-picker .switch_mode:hover {
+	background-color: #CCC;
+	cursor: pointer;
+}
+
+/*
+ * UI Component
+ */
+
+.ui-input-slider {
+	height: 20px;
+	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
+	-moz-user-select: none;
+	user-select: none;
+}
+
+.ui-input-slider * {
+	float: left;
+	height: 100%;
+	line-height: 100%;
+}
+
+/* Input Slider */
+
+.ui-input-slider &gt; input {
+	margin: 0;
+	padding: 0;
+	width: 50px;
+	text-align: center;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+.ui-input-slider-info {
+	width: 90px;
+	padding: 0px 10px 0px 0px;
+	text-align: right;
+	text-transform: lowercase;
+}
+
+.ui-input-slider-left, .ui-input-slider-right {
+	width: 16px;
+	cursor: pointer;
+	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center left no-repeat;
+}
+
+.ui-input-slider-right {
+	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center right no-repeat;
+}
+
+.ui-input-slider-name {
+	width: 90px;
+	padding: 0 10px 0 0;
+	text-align: right;
+	text-transform: lowercase;
+}
+
+.ui-input-slider-btn-set {
+	width: 25px;
+	background-color: #2C9FC9;
+	border-radius: 5px;
+	color: #FFF;
+	font-weight: bold;
+	line-height: 14px;
+	text-align: center;
+}
+
+.ui-input-slider-btn-set:hover {
+	background-color: #379B4A;
+	cursor: pointer;
+}
+
+/*
+ * COLOR PICKER TOOL
+ */
+
+body {
+	max-width: 1000px;
+	margin: 0 auto;
+
+	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
+
+	box-shadow: 0 0 5px 0 #999;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+
+	-moz-user-select: none;
+	-webkit-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+
+}
+
+/**
+ * Resize Handle
+ */
+.resize-handle {
+	width: 10px;
+	height: 10px;
+	background: url('https://mdn.mozillademos.org/files/6083/resize.png') center center no-repeat;
+	position: absolute;
+	bottom: 0;
+	right: 0;
+}
+
+[data-resize='both']:hover {
+	cursor: nw-resize !important;
+}
+
+[data-resize='width']:hover {
+	cursor: w-resize !important;
+}
+
+[data-resize='height']:hover {
+	cursor: n-resize !important;
+}
+
+[data-hidden='true'] {
+	display: none;
+}
+
+[data-collapsed='true'] {
+	height: 0 !important;
+}
+
+.block {
+	display: table;
+}
+
+
+/**
+ * 	Container
+ */
+#container {
+	width: 100%;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+
+	display: table;
+}
+
+/**
+ * 	Picker Zone
+ */
+
+#picker {
+	padding: 10px;
+	width: 980px;
+}
+
+.ui-color-picker {
+	padding: 3px 5px;
+	float: left;
+	border-color: #FFF;
+}
+
+.ui-color-picker .switch_mode {
+	display: none;
+}
+
+.ui-color-picker .preview-color:hover {
+	cursor: move;
+}
+
+/**
+ * Picker Container
+ */
+
+#picker-samples {
+	width: 375px;
+	height: 114px;
+	max-height: 218px;
+	margin: 0 10px 0 30px;
+	overflow: hidden;
+	position: relative;
+	float: left;
+
+	transition: all 0.2s;
+}
+
+#picker-samples .sample {
+	width: 40px;
+	height: 40px;
+	margin: 5px;
+	border: 1px solid #DDD;
+	position: absolute;
+	float: left;
+	transition: all 0.2s;
+}
+
+#picker-samples .sample:hover {
+	cursor: pointer;
+	border-color: #BBB;
+	transform: scale(1.15);
+	border-radius: 3px;
+}
+
+#picker-samples .sample[data-active='true'] {
+	border-color: #999;
+}
+
+#picker-samples .sample[data-active='true']:after {
+	content: "";
+	position: absolute;
+	background: url('https://mdn.mozillademos.org/files/6065/arrow.png') center no-repeat;
+	width: 100%;
+	height: 12px;
+	top: -12px;
+	z-index: 2;
+}
+
+#picker-samples #add-icon {
+	width: 100%;
+	height: 100%;
+	position: relative;
+	box-shadow: inset 0px 0px 2px 0px #DDD;
+}
+
+#picker-samples #add-icon:hover {
+	cursor: pointer;
+	border-color: #DDD;
+	box-shadow: inset 0px 0px 5px 0px #CCC;
+}
+
+#picker-samples #add-icon:before,
+#picker-samples #add-icon:after {
+	content: "";
+	position: absolute;
+	background-color: #EEE;
+	box-shadow: 0 0 1px 0 #EEE;
+}
+
+#picker-samples #add-icon:before {
+	width: 70%;
+	height: 16%;
+	top: 42%;
+	left: 15%;
+}
+
+#picker-samples #add-icon:after {
+	width: 16%;
+	height: 70%;
+	top: 15%;
+	left: 42%;
+}
+
+#picker-samples #add-icon:hover:before,
+#picker-samples #add-icon:hover:after {
+	background-color: #DDD;
+	box-shadow: 0 0 1px 0 #DDD;
+}
+
+/**
+ * 	Controls
+ */
+
+#controls {
+	width: 110px;
+	padding: 10px;
+	float: right;
+}
+
+#controls #picker-switch {
+	text-align: center;
+	float: left;
+}
+
+#controls .icon {
+	width: 48px;
+	height: 48px;
+	margin: 10px 0;
+	background-repeat: no-repeat;
+	background-position: center;
+	border: 1px solid #DDD;
+	display: table;
+	float: left;
+}
+
+#controls .icon:hover {
+	cursor: pointer;
+}
+
+#controls .picker-icon {
+	background-image: url('https://mdn.mozillademos.org/files/6081/picker.png');
+}
+
+#controls #void-sample {
+	margin-right: 10px;
+	background-image: url('https://mdn.mozillademos.org/files/6087/void.png');
+	background-position: center left;
+}
+
+#controls #void-sample[data-active='true'] {
+	border-color: #CCC;
+	background-position: center right;
+}
+
+#controls .switch {
+	width: 106px;
+	padding: 1px;
+	border: 1px solid #CCC;
+	font-size: 14px;
+	text-align: center;
+	line-height: 24px;
+	overflow: hidden;
+	float: left;
+}
+
+#controls .switch:hover {
+	cursor: pointer;
+}
+
+#controls .switch &gt; * {
+	width: 50%;
+	padding: 2px 0;
+	background-color: #EEE;
+	float: left;
+}
+
+#controls .switch [data-active='true'] {
+	color: #FFF;
+	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
+	background-color: #777;
+}
+
+/**
+ * 	Trash Can
+ */
+
+#delete {
+	width: 100%;
+	height: 94px;
+	background-color: #DDD;
+	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
+	background-repeat: repeat;
+
+	text-align: center;
+	color: #777;
+
+	position: relative;
+	float: right;
+}
+
+#delete #trash-can {
+	width: 80%;
+	height: 80%;
+	border: 2px dashed #FFF;
+	border-radius: 5px;
+	background: url('https://mdn.mozillademos.org/files/6085/trash-can.png') no-repeat center;
+
+	position: absolute;
+	top: 10%;
+	left: 10%;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+
+	transition: all 0.2s;
+}
+
+#delete[drag-state='enter'] {
+	background-color: #999;
+}
+
+/**
+ * 	Color Theme
+ */
+
+#color-theme {
+	margin: 0 8px 0 0;
+	border: 1px solid #EEE;
+	display: inline-block;
+	float: right;
+}
+
+#color-theme .box {
+	width: 80px;
+	height: 92px;
+	float: left;
+}
+
+/**
+ * Color info box
+ */
+#color-info {
+	width: 360px;
+	float: left;
+}
+
+#color-info .title {
+	width: 100%;
+	padding: 15px;
+	font-size: 18px;
+	text-align: center;
+	background-image: url('https://mdn.mozillademos.org/files/6071/color-wheel.png');
+	background-repeat:no-repeat;
+	background-position: center left 30%;
+}
+
+#color-info .copy-container {
+	position: absolute;
+	top: -100%;
+}
+
+#color-info .property {
+	min-width: 280px;
+	height: 30px;
+	margin: 10px 0;
+	text-align: center;
+	line-height: 30px;
+}
+
+#color-info .property &gt; * {
+	float: left;
+}
+
+#color-info .property .type {
+	width: 60px;
+	height: 100%;
+	padding: 0 16px 0 0;
+	text-align: right;
+}
+
+#color-info .property .value {
+	width: 200px;
+	height: 100%;
+	padding: 0 10px;
+	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
+	font-size: 16px;
+	color: #777;
+	text-align: center;
+	background-color: #FFF;
+	border: none;
+}
+
+#color-info .property .value:hover {
+	color: #37994A;
+}
+
+#color-info .property .value:hover + .copy {
+	background-position: center right;
+}
+
+#color-info .property .copy {
+	width: 24px;
+	height: 100%;
+	padding: 0 5px;
+	background-color: #FFF;
+	background-image: url('https://mdn.mozillademos.org/files/6073/copy.png');
+	background-repeat: no-repeat;
+	background-position: center left;
+	border-left: 1px solid #EEE;
+	text-align: right;
+	float: left;
+}
+
+#color-info .property .copy:hover {
+	background-position: center right;
+}
+
+
+/**
+ * 	Color Palette
+ */
+
+#palette {
+	width: 1000px;
+	padding: 10px 0;
+	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
+	background-repeat: repeat;
+	background-color: #EEE;
+	color: #777;
+
+	-moz-box-sizing: border-box;
+	-webkit-box-sizing: border-box;
+	box-sizing: border-box;
+}
+
+#color-palette {
+	width: 640px;
+	font-family: Arial, Helvetica, sans-serif;
+	color: #777;
+	float: left;
+}
+
+#color-palette .container {
+	width: 100%;
+	height: 50px;
+	line-height: 50px;
+	overflow: hidden;
+	float: left;
+	transition: all 0.5s;
+}
+
+#color-palette .container &gt; * {
+	float: left;
+}
+
+#color-palette .title {
+	width: 100px;
+	padding: 0 10px;
+	text-align: right;
+	line-height: inherit;
+}
+
+#color-palette .palette {
+	width: 456px;
+	height: 38px;
+	margin: 3px;
+	padding: 3px;
+	display: table;
+	background-color: #FFF;
+}
+
+#color-palette .palette .sample {
+	width: 30px;
+	height: 30px;
+	margin: 3px;
+	position: relative;
+	border: 1px solid #DDD;
+	float: left;
+	transition: all 0.2s;
+}
+
+#color-palette .palette .sample:hover {
+	cursor: pointer;
+	border-color: #BBB;
+	transform: scale(1.15);
+	border-radius: 3px;
+}
+
+#color-palette .controls {
+}
+
+#color-palette .controls &gt; * {
+	float: left;
+}
+
+#color-palette .controls &gt; *:hover {
+	cursor: pointer;
+}
+
+#color-palette .controls .lock {
+	width: 24px;
+	height: 24px;
+	margin: 10px;
+	padding: 3px;
+	background-image: url('https://mdn.mozillademos.org/files/6077/lock.png');
+	background-repeat: no-repeat;
+	background-position: bottom right;
+}
+
+#color-palette .controls .lock:hover {
+	/*background-image: url('images/unlocked-hover.png');*/
+	background-position: bottom left;
+}
+
+#color-palette .controls .lock[locked-state='true'] {
+	/*background-image: url('images/locked.png');*/
+	background-position: top left ;
+}
+
+#color-palette .controls .lock[locked-state='true']:hover {
+	/*background-image: url('images/lock-hover.png');*/
+	background-position: top right;
+}
+
+/**
+ * Canvas
+ */
+
+#canvas {
+	width: 100%;
+	height: 300px;
+	min-height: 250px;
+	border-top: 1px solid #DDD;
+	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
+	background-repeat: repeat;
+	position: relative;
+	float: left;
+}
+
+#canvas[data-tutorial='drop'] {
+	text-align: center;
+	font-size: 30px;
+	color: #777;
+}
+
+#canvas[data-tutorial='drop']:before {
+	content: "Drop colors here to compare";
+	width: 40%;
+	padding: 30px 9% 70px 11%;
+
+	background-image: url('https://mdn.mozillademos.org/files/6075/drop.png');
+	background-repeat: no-repeat;
+	background-position: left 35px top 60%;
+
+	text-align: right;
+
+	border: 3px dashed rgb(221, 221, 221);
+	border-radius: 15px;
+
+	position: absolute;
+	top: 50px;
+	left: 20%;
+}
+
+#canvas[data-tutorial='drop']:after {
+	content: "adjust, change or modify";
+	width: 40%;
+	font-size: 24px;
+	position: absolute;
+	top: 130px;
+	left: 32%;
+	z-index: 2;
+}
+
+#canvas [data-tutorial='dblclick'] {
+	background-color: #999 !important;
+}
+
+#canvas [data-tutorial='dblclick']:before {
+	content: "double click to activate";
+	width: 80px;
+	color: #FFF;
+	position: absolute;
+	top: 10%;
+	left: 20%;
+	z-index: 2;
+}
+
+#canvas .sample {
+	width: 100px;
+	height: 100px;
+	min-width: 20px;
+	min-height: 20px;
+	position: absolute;
+	border: 1px solid rgba(255, 255, 255, 0.3);
+}
+
+#canvas .sample:hover {
+	cursor: move;
+}
+
+#canvas .sample[data-active='true']:after {
+	content: "";
+	position: absolute;
+	background: url('https://mdn.mozillademos.org/files/6065/arrow.png') center no-repeat;
+	width: 100%;
+	height: 12px;
+	top: -12px;
+	z-index: 2;
+}
+
+#canvas .sample:hover &gt; * {
+	cursor: pointer;
+	display: block !important;
+}
+
+#canvas .sample .resize-handle {
+	display: none;
+}
+
+#canvas .sample .pick {
+	width: 10px;
+	height: 10px;
+	margin: 5px;
+	background: url('https://mdn.mozillademos.org/files/6079/pick.png') center no-repeat;
+	position: absolute;
+	top: 0;
+	left: 0;
+	display: none;
+}
+
+#canvas .sample .delete {
+	width: 10px;
+	height: 10px;
+	margin: 5px;
+	background: url('https://mdn.mozillademos.org/files/6069/close.png') center no-repeat;
+	position: absolute;
+	top: 0;
+	right: 0;
+	display: none;
+}
+
+
+/**
+ * Canvas controls
+ */
+
+#canvas .toggle-bg {
+	width: 16px;
+	height: 16px;
+	margin: 5px;
+	background: url("images/canvas-controls.png") center left no-repeat;
+	position: absolute;
+	top: 0;
+	right: 0;
+}
+
+#canvas .toggle-bg:hover {
+	cursor: pointer;
+}
+
+#canvas[data-bg='true'] {
+	background: none;
+}
+
+#canvas[data-bg='true'] .toggle-bg {
+	background: url('https://mdn.mozillademos.org/files/6067/canvas-controls.png') center right no-repeat;
+}
+
+#zindex {
+	height: 20px;
+	margin: 5px;
+	font-size: 16px;
+	position: absolute;
+	opacity: 0;
+	top: -10000px;
+	left: 0;
+	color: #777;
+	float: left;
+	transition: opacity 1s;
+}
+
+#zindex input {
+	border: 1px solid #DDD;
+	font-size: 16px;
+	color: #777;
+}
+
+#zindex .ui-input-slider-info {
+	width: 60px;
+}
+
+#zindex[data-active='true'] {
+	top: 0;
+	opacity: 1;
+}
+
+</pre>
+
+<h3 id="JavaScript_Content">JavaScript Content</h3>
+
+<pre class="brush: js">'use strict';
+
+var UIColorPicker = (function UIColorPicker() {
+
+	function getElemById(id) {
+		return document.getElementById(id);
+	}
+
+	var subscribers = [];
+	var pickers = [];
+
+	/**
+	 * RGBA Color class
+	 *
+	 * HSV/HSB and HSL (hue, saturation, value / brightness, lightness)
+	 * @param hue			0-360
+	 * @param saturation	0-100
+	 * @param value 		0-100
+	 * @param lightness		0-100
+	 */
+
+	function Color(color) {
+
+		if(color instanceof Color === true) {
+			this.copy(color);
+			return;
+		}
+
+		this.r = 0;
+		this.g = 0;
+		this.b = 0;
+		this.a = 1;
+		this.hue = 0;
+		this.saturation = 0;
+		this.value = 0;
+		this.lightness = 0;
+		this.format = 'HSV';
+	}
+
+	function RGBColor(r, g, b) {
+		var color = new Color();
+		color.setRGBA(r, g, b, 1);
+		return color;
+	}
+
+	function RGBAColor(r, g, b, a) {
+		var color = new Color();
+		color.setRGBA(r, g, b, a);
+		return color;
+	}
+
+	function HSVColor(h, s, v) {
+		var color = new Color();
+		color.setHSV(h, s, v);
+		return color;
+	}
+
+	function HSVAColor(h, s, v, a) {
+		var color = new Color();
+		color.setHSV(h, s, v);
+		color.a = a;
+		return color;
+	}
+
+	function HSLColor(h, s, l) {
+		var color = new Color();
+		color.setHSL(h, s, l);
+		return color;
+	}
+
+	function HSLAColor(h, s, l, a) {
+		var color = new Color();
+		color.setHSL(h, s, l);
+		color.a = a;
+		return color;
+	}
+
+	Color.prototype.copy = function copy(obj) {
+		if(obj instanceof Color !== true) {
+			console.log('Typeof parameter not Color');
+			return;
+		}
+
+		this.r = obj.r;
+		this.g = obj.g;
+		this.b = obj.b;
+		this.a = obj.a;
+		this.hue = obj.hue;
+		this.saturation = obj.saturation;
+		this.value = obj.value;
+		this.format = '' + obj.format;
+		this.lightness = obj.lightness;
+	};
+
+	Color.prototype.setFormat = function setFormat(format) {
+		if (format === 'HSV')
+			this.format = 'HSV';
+		if (format === 'HSL')
+			this.format = 'HSL';
+	};
+
+	/*========== Methods to set Color Properties ==========*/
+
+	Color.prototype.isValidRGBValue = function isValidRGBValue(value) {
+		return (typeof(value) === 'number' &amp;&amp; isNaN(value) === false &amp;&amp;
+			value &gt;= 0 &amp;&amp; value &lt;= 255);
+	};
+
+	Color.prototype.setRGBA = function setRGBA(red, green, blue, alpha) {
+		if (this.isValidRGBValue(red) === false ||
+			this.isValidRGBValue(green) === false ||
+			this.isValidRGBValue(blue) === false)
+			return;
+
+			this.r = red | 0;
+			this.g = green | 0;
+			this.b = blue | 0;
+
+		if (this.isValidRGBValue(alpha) === true)
+			this.a = alpha | 0;
+	};
+
+	Color.prototype.setByName = function setByName(name, value) {
+		if (name === 'r' || name === 'g' || name === 'b') {
+			if(this.isValidRGBValue(value) === false)
+				return;
+
+			this[name] = value;
+			this.updateHSX();
+		}
+	};
+
+	Color.prototype.setHSV = function setHSV(hue, saturation, value) {
+		this.hue = hue;
+		this.saturation = saturation;
+		this.value = value;
+		this.HSVtoRGB();
+	};
+
+	Color.prototype.setHSL = function setHSL(hue, saturation, lightness) {
+		this.hue = hue;
+		this.saturation = saturation;
+		this.lightness = lightness;
+		this.HSLtoRGB();
+	};
+
+	Color.prototype.setHue = function setHue(value) {
+		if (typeof(value) !== 'number' || isNaN(value) === true ||
+			value &lt; 0 || value &gt; 359)
+			return;
+		this.hue = value;
+		this.updateRGB();
+	};
+
+	Color.prototype.setSaturation = function setSaturation(value) {
+		if (typeof(value) !== 'number' || isNaN(value) === true ||
+			value &lt; 0 || value &gt; 100)
+			return;
+		this.saturation = value;
+		this.updateRGB();
+	};
+
+	Color.prototype.setValue = function setValue(value) {
+		if (typeof(value) !== 'number' || isNaN(value) === true ||
+			value &lt; 0 || value &gt; 100)
+			return;
+		this.value = value;
+		this.HSVtoRGB();
+	};
+
+	Color.prototype.setLightness = function setLightness(value) {
+		if (typeof(value) !== 'number' || isNaN(value) === true ||
+			value &lt; 0 || value &gt; 100)
+			return;
+		this.lightness = value;
+		this.HSLtoRGB();
+	};
+
+	Color.prototype.setHexa = function setHexa(value) {
+		var valid  = /(^#{0,1}[0-9A-F]{6}$)|(^#{0,1}[0-9A-F]{3}$)/i.test(value);
+
+		if (valid !== true)
+			return;
+
+		if (value[0] === '#')
+			value = value.slice(1, value.length);
+
+		if (value.length === 3)
+			value = value.replace(/([0-9A-F])([0-9A-F])([0-9A-F])/i,'$1$1$2$2$3$3');
+
+		this.r = parseInt(value.substr(0, 2), 16);
+		this.g = parseInt(value.substr(2, 2), 16);
+		this.b = parseInt(value.substr(4, 2), 16);
+
+		this.alpha	= 1;
+		this.RGBtoHSV();
+	};
+
+	/*========== Conversion Methods ==========*/
+
+	Color.prototype.convertToHSL = function convertToHSL() {
+		if (this.format === 'HSL')
+			return;
+
+		this.setFormat('HSL');
+		this.RGBtoHSL();
+	};
+
+	Color.prototype.convertToHSV = function convertToHSV() {
+		if (this.format === 'HSV')
+			return;
+
+		this.setFormat('HSV');
+		this.RGBtoHSV();
+	};
+
+	/*========== Update Methods ==========*/
+
+	Color.prototype.updateRGB = function updateRGB() {
+		if (this.format === 'HSV') {
+			this.HSVtoRGB();
+			return;
+		}
+
+		if (this.format === 'HSL') {
+			this.HSLtoRGB();
+			return;
+		}
+	};
+
+	Color.prototype.updateHSX = function updateHSX() {
+		if (this.format === 'HSV') {
+			this.RGBtoHSV();
+			return;
+		}
+
+		if (this.format === 'HSL') {
+			this.RGBtoHSL();
+			return;
+		}
+	};
+
+	Color.prototype.HSVtoRGB = function HSVtoRGB() {
+		var sat = this.saturation / 100;
+		var value = this.value / 100;
+		var C = sat * value;
+		var H = this.hue / 60;
+		var X = C * (1 - Math.abs(H % 2 - 1));
+		var m = value - C;
+		var precision = 255;
+
+		C = (C + m) * precision | 0;
+		X = (X + m) * precision | 0;
+		m = m * precision | 0;
+
+		if (H &gt;= 0 &amp;&amp; H &lt; 1) {	this.setRGBA(C, X, m);	return; }
+		if (H &gt;= 1 &amp;&amp; H &lt; 2) {	this.setRGBA(X, C, m);	return; }
+		if (H &gt;= 2 &amp;&amp; H &lt; 3) {	this.setRGBA(m, C, X);	return; }
+		if (H &gt;= 3 &amp;&amp; H &lt; 4) {	this.setRGBA(m, X, C);	return; }
+		if (H &gt;= 4 &amp;&amp; H &lt; 5) {	this.setRGBA(X, m, C);	return; }
+		if (H &gt;= 5 &amp;&amp; H &lt; 6) {	this.setRGBA(C, m, X);	return; }
+	};
+
+	Color.prototype.HSLtoRGB = function HSLtoRGB() {
+		var sat = this.saturation / 100;
+		var light = this.lightness / 100;
+		var C = sat * (1 - Math.abs(2 * light - 1));
+		var H = this.hue / 60;
+		var X = C * (1 - Math.abs(H % 2 - 1));
+		var m = light - C/2;
+		var precision = 255;
+
+		C = (C + m) * precision | 0;
+		X = (X + m) * precision | 0;
+		m = m * precision | 0;
+
+		if (H &gt;= 0 &amp;&amp; H &lt; 1) {	this.setRGBA(C, X, m);	return; }
+		if (H &gt;= 1 &amp;&amp; H &lt; 2) {	this.setRGBA(X, C, m);	return; }
+		if (H &gt;= 2 &amp;&amp; H &lt; 3) {	this.setRGBA(m, C, X);	return; }
+		if (H &gt;= 3 &amp;&amp; H &lt; 4) {	this.setRGBA(m, X, C);	return; }
+		if (H &gt;= 4 &amp;&amp; H &lt; 5) {	this.setRGBA(X, m, C);	return; }
+		if (H &gt;= 5 &amp;&amp; H &lt; 6) {	this.setRGBA(C, m, X);	return; }
+	};
+
+	Color.prototype.RGBtoHSV = function RGBtoHSV() {
+		var red		= this.r / 255;
+		var green	= this.g / 255;
+		var blue	= this.b / 255;
+
+		var cmax = Math.max(red, green, blue);
+		var cmin = Math.min(red, green, blue);
+		var delta = cmax - cmin;
+		var hue = 0;
+		var saturation = 0;
+
+		if (delta) {
+			if (cmax === red ) { hue = ((green - blue) / delta); }
+			if (cmax === green ) { hue = 2 + (blue - red) / delta; }
+			if (cmax === blue ) { hue = 4 + (red - green) / delta; }
+			if (cmax) saturation = delta / cmax;
+		}
+
+		this.hue = 60 * hue | 0;
+		if (this.hue &lt; 0) this.hue += 360;
+		this.saturation = (saturation * 100) | 0;
+		this.value = (cmax * 100) | 0;
+	};
+
+	Color.prototype.RGBtoHSL = function RGBtoHSL() {
+		var red		= this.r / 255;
+		var green	= this.g / 255;
+		var blue	= this.b / 255;
+
+		var cmax = Math.max(red, green, blue);
+		var cmin = Math.min(red, green, blue);
+		var delta = cmax - cmin;
+		var hue = 0;
+		var saturation = 0;
+		var lightness = (cmax + cmin) / 2;
+		var X = (1 - Math.abs(2 * lightness - 1));
+
+		if (delta) {
+			if (cmax === red ) { hue = ((green - blue) / delta); }
+			if (cmax === green ) { hue = 2 + (blue - red) / delta; }
+			if (cmax === blue ) { hue = 4 + (red - green) / delta; }
+			if (cmax) saturation = delta / X;
+		}
+
+		this.hue = 60 * hue | 0;
+		if (this.hue &lt; 0) this.hue += 360;
+		this.saturation = (saturation * 100) | 0;
+		this.lightness = (lightness * 100) | 0;
+	};
+
+	/*========== Get Methods ==========*/
+
+	Color.prototype.getHexa = function getHexa() {
+		var r = this.r.toString(16);
+		var g = this.g.toString(16);
+		var b = this.b.toString(16);
+		if (this.r &lt; 16) r = '0' + r;
+		if (this.g &lt; 16) g = '0' + g;
+		if (this.b &lt; 16) b = '0' + b;
+		var value = '#' + r + g + b;
+		return value.toUpperCase();
+	};
+
+	Color.prototype.getRGBA = function getRGBA() {
+
+		var rgb = '(' + this.r + ', ' + this.g + ', ' + this.b;
+		var a = '';
+		var v = '';
+		var x = parseFloat(this.a);
+		if (x !== 1) {
+			a = 'a';
+			v = ', ' + x;
+		}
+
+		var value = 'rgb' + a + rgb + v + ')';
+		return value;
+	};
+
+	Color.prototype.getHSLA = function getHSLA() {
+		if (this.format === 'HSV') {
+			var color = new Color(this);
+			color.setFormat('HSL');
+			color.updateHSX();
+			return color.getHSLA();
+		}
+
+		var a = '';
+		var v = '';
+		var hsl = '(' + this.hue + ', ' + this.saturation + '%, ' + this.lightness +'%';
+		var x = parseFloat(this.a);
+		if (x !== 1) {
+			a = 'a';
+			v = ', ' + x;
+		}
+
+		var value = 'hsl' + a + hsl + v + ')';
+		return value;
+	};
+
+	Color.prototype.getColor = function getColor() {
+		if (this.a | 0 === 1)
+			return this.getHexa();
+		return this.getRGBA();
+	};
+
+	/*=======================================================================*/
+	/*=======================================================================*/
+
+	/*========== Capture Mouse Movement ==========*/
+
+	var setMouseTracking = function setMouseTracking(elem, callback) {
+		elem.addEventListener('mousedown', function(e) {
+			callback(e);
+			document.addEventListener('mousemove', callback);
+		});
+
+		document.addEventListener('mouseup', function(e) {
+			document.removeEventListener('mousemove', callback);
+		});
+	};
+
+	/*====================*/
+	// Color Picker Class
+	/*====================*/
+
+	function ColorPicker(node) {
+		this.color = new Color();
+		this.node = node;
+		this.subscribers = [];
+
+		var type = this.node.getAttribute('data-mode');
+		var topic = this.node.getAttribute('data-topic');
+
+		this.topic = topic;
+		this.picker_mode = (type === 'HSL') ? 'HSL' : 'HSV';
+		this.color.setFormat(this.picker_mode);
+
+		this.createPickingArea();
+		this.createHueArea();
+
+		this.newInputComponent('H', 'hue', this.inputChangeHue.bind(this));
+		this.newInputComponent('S', 'saturation', this.inputChangeSaturation.bind(this));
+		this.newInputComponent('V', 'value', this.inputChangeValue.bind(this));
+		this.newInputComponent('L', 'lightness', this.inputChangeLightness.bind(this));
+
+		this.createAlphaArea();
+
+		this.newInputComponent('R', 'red', this.inputChangeRed.bind(this));
+		this.newInputComponent('G', 'green', this.inputChangeGreen.bind(this));
+		this.newInputComponent('B', 'blue', this.inputChangeBlue.bind(this));
+
+		this.createPreviewBox();
+		this.createChangeModeButton();
+
+		this.newInputComponent('alpha', 'alpha', this.inputChangeAlpha.bind(this));
+		this.newInputComponent('hexa', 'hexa', this.inputChangeHexa.bind(this));
+
+		this.setColor(this.color);
+		pickers[topic] = this;
+	}
+
+	/*************************************************************************/
+	//				Function for generating the color-picker
+	/*************************************************************************/
+
+	ColorPicker.prototype.createPickingArea = function createPickingArea() {
+		var area = document.createElement('div');
+		var picker = document.createElement('div');
+
+		area.className = 'picking-area';
+		picker.className = 'picker';
+
+		this.picking_area = area;
+		this.color_picker = picker;
+		setMouseTracking(area, this.updateColor.bind(this));
+
+		area.appendChild(picker);
+		this.node.appendChild(area);
+	};
+
+	ColorPicker.prototype.createHueArea = function createHueArea() {
+		var area = document.createElement('div');
+		var picker = document.createElement('div');
+
+		area.className = 'hue';
+		picker.className ='slider-picker';
+
+		this.hue_area = area;
+		this.hue_picker = picker;
+		setMouseTracking(area, this.updateHueSlider.bind(this));
+
+		area.appendChild(picker);
+		this.node.appendChild(area);
+	};
+
+	ColorPicker.prototype.createAlphaArea = function createAlphaArea() {
+		var area = document.createElement('div');
+		var mask = document.createElement('div');
+		var picker = document.createElement('div');
+
+		area.className = 'alpha';
+		mask.className = 'alpha-mask';
+		picker.className = 'slider-picker';
+
+		this.alpha_area = area;
+		this.alpha_mask = mask;
+		this.alpha_picker = picker;
+		setMouseTracking(area, this.updateAlphaSlider.bind(this));
+
+		area.appendChild(mask);
+		mask.appendChild(picker);
+		this.node.appendChild(area);
+	};
+
+	ColorPicker.prototype.createPreviewBox = function createPreviewBox(e) {
+		var preview_box = document.createElement('div');
+		var preview_color = document.createElement('div');
+
+		preview_box.className = 'preview';
+		preview_color.className = 'preview-color';
+
+		this.preview_color = preview_color;
+
+		preview_box.appendChild(preview_color);
+		this.node.appendChild(preview_box);
+	};
+
+	ColorPicker.prototype.newInputComponent = function newInputComponent(title, topic, onChangeFunc) {
+		var wrapper = document.createElement('div');
+		var input = document.createElement('input');
+		var info = document.createElement('span');
+
+		wrapper.className = 'input';
+		wrapper.setAttribute('data-topic', topic);
+		info.textContent = title;
+		info.className = 'name';
+		input.setAttribute('type', 'text');
+
+		wrapper.appendChild(info);
+		wrapper.appendChild(input);
+		this.node.appendChild(wrapper);
+
+		input.addEventListener('change', onChangeFunc);
+		input.addEventListener('click', function() {
+			this.select();
+		});
+
+		this.subscribe(topic, function(value) {
+			input.value = value;
+		});
+	};
+
+	ColorPicker.prototype.createChangeModeButton = function createChangeModeButton() {
+
+		var button = document.createElement('div');
+		button.className = 'switch_mode';
+		button.addEventListener('click', function() {
+			if (this.picker_mode === 'HSV')
+				this.setPickerMode('HSL');
+			else
+				this.setPickerMode('HSV');
+
+		}.bind(this));
+
+		this.node.appendChild(button);
+	};
+
+	/*************************************************************************/
+	//					Updates properties of UI elements
+	/*************************************************************************/
+
+	ColorPicker.prototype.updateColor = function updateColor(e) {
+		var x = e.pageX - this.picking_area.offsetLeft;
+		var y = e.pageY - this.picking_area.offsetTop;
+		var picker_offset = 5;
+
+		// width and height should be the same
+		var size = this.picking_area.clientWidth;
+
+		if (x &gt; size) x = size;
+		if (y &gt; size) y = size;
+		if (x &lt; 0) x = 0;
+		if (y &lt; 0) y = 0;
+
+		var value = 100 - (y * 100 / size) | 0;
+		var saturation = x * 100 / size | 0;
+
+		if (this.picker_mode === 'HSV')
+			this.color.setHSV(this.color.hue, saturation, value);
+		if (this.picker_mode === 'HSL')
+			this.color.setHSL(this.color.hue, saturation, value);
+
+		this.color_picker.style.left = x - picker_offset + 'px';
+		this.color_picker.style.top = y - picker_offset + 'px';
+
+		this.updateAlphaGradient();
+		this.updatePreviewColor();
+
+		this.notify('value', value);
+		this.notify('lightness', value);
+		this.notify('saturation', saturation);
+
+		this.notify('red', this.color.r);
+		this.notify('green', this.color.g);
+		this.notify('blue', this.color.b);
+		this.notify('hexa', this.color.getHexa());
+
+		notify(this.topic, this.color);
+	};
+
+	ColorPicker.prototype.updateHueSlider = function updateHueSlider(e) {
+		var x = e.pageX - this.hue_area.offsetLeft;
+		var width = this.hue_area.clientWidth;
+
+		if (x &lt; 0) x = 0;
+		if (x &gt; width) x = width;
+
+		// TODO 360 =&gt; 359
+		var hue = ((359 * x) / width) | 0;
+		// if (hue === 360) hue = 359;
+
+		this.updateSliderPosition(this.hue_picker, x);
+		this.setHue(hue);
+	};
+
+	ColorPicker.prototype.updateAlphaSlider = function updateAlphaSlider(e) {
+		var x = e.pageX - this.alpha_area.offsetLeft;
+		var width = this.alpha_area.clientWidth;
+
+		if (x &lt; 0) x = 0;
+		if (x &gt; width) x = width;
+
+		this.color.a = (x / width).toFixed(2);
+
+		this.updateSliderPosition(this.alpha_picker, x);
+		this.updatePreviewColor();
+
+		this.notify('alpha', this.color.a);
+		notify(this.topic, this.color);
+	};
+
+	ColorPicker.prototype.setHue = function setHue(value) {
+		this.color.setHue(value);
+
+		this.updatePickerBackground();
+		this.updateAlphaGradient();
+		this.updatePreviewColor();
+
+		this.notify('red', this.color.r);
+		this.notify('green', this.color.g);
+		this.notify('blue', this.color.b);
+		this.notify('hexa', this.color.getHexa());
+		this.notify('hue', this.color.hue);
+
+		notify(this.topic, this.color);
+	};
+
+	// Updates when one of Saturation/Value/Lightness changes
+	ColorPicker.prototype.updateSLV = function updateSLV() {
+		this.updatePickerPosition();
+		this.updateAlphaGradient();
+		this.updatePreviewColor();
+
+		this.notify('red', this.color.r);
+		this.notify('green', this.color.g);
+		this.notify('blue', this.color.b);
+		this.notify('hexa', this.color.getHexa());
+
+		notify(this.topic, this.color);
+	};
+
+	/*************************************************************************/
+	//				Update positions of various UI elements
+	/*************************************************************************/
+
+	ColorPicker.prototype.updatePickerPosition = function updatePickerPosition() {
+		var size = this.picking_area.clientWidth;
+		var value = 0;
+		var offset = 5;
+
+		if (this.picker_mode === 'HSV')
+			value = this.color.value;
+		if (this.picker_mode === 'HSL')
+			value = this.color.lightness;
+
+		var x = (this.color.saturation * size / 100) | 0;
+		var y = size - (value * size / 100) | 0;
+
+		this.color_picker.style.left = x - offset + 'px';
+		this.color_picker.style.top = y - offset + 'px';
+	};
+
+	ColorPicker.prototype.updateSliderPosition = function updateSliderPosition(elem, pos) {
+		elem.style.left = Math.max(pos - 3, -2) + 'px';
+	};
+
+	ColorPicker.prototype.updateHuePicker = function updateHuePicker() {
+		var size = this.hue_area.clientWidth;
+		var offset = 1;
+		var pos = (this.color.hue * size / 360 ) | 0;
+		this.hue_picker.style.left = pos - offset + 'px';
+	};
+
+	ColorPicker.prototype.updateAlphaPicker = function updateAlphaPicker() {
+		var size = this.alpha_area.clientWidth;
+		var offset = 1;
+		var pos = (this.color.a * size) | 0;
+		this.alpha_picker.style.left = pos - offset + 'px';
+	};
+
+	/*************************************************************************/
+	//						Update background colors
+	/*************************************************************************/
+
+	ColorPicker.prototype.updatePickerBackground = function updatePickerBackground() {
+		var nc = new Color(this.color);
+		nc.setHSV(nc.hue, 100, 100);
+		this.picking_area.style.backgroundColor = nc.getHexa();
+	};
+
+	ColorPicker.prototype.updateAlphaGradient = function updateAlphaGradient() {
+		this.alpha_mask.style.backgroundColor = this.color.getHexa();
+	};
+
+	ColorPicker.prototype.updatePreviewColor = function updatePreviewColor() {
+		this.preview_color.style.backgroundColor = this.color.getColor();
+	};
+
+	/*************************************************************************/
+	//						Update input elements
+	/*************************************************************************/
+
+	ColorPicker.prototype.inputChangeHue = function inputChangeHue(e) {
+		var value = parseInt(e.target.value);
+		this.setHue(value);
+		this.updateHuePicker();
+	};
+
+	ColorPicker.prototype.inputChangeSaturation = function inputChangeSaturation(e) {
+		var value = parseInt(e.target.value);
+		this.color.setSaturation(value);
+		e.target.value = this.color.saturation;
+		this.updateSLV();
+	};
+
+	ColorPicker.prototype.inputChangeValue = function inputChangeValue(e) {
+		var value = parseInt(e.target.value);
+		this.color.setValue(value);
+		e.target.value = this.color.value;
+		this.updateSLV();
+	};
+
+	ColorPicker.prototype.inputChangeLightness = function inputChangeLightness(e) {
+		var value = parseInt(e.target.value);
+		this.color.setLightness(value);
+		e.target.value = this.color.lightness;
+		this.updateSLV();
+	};
+
+	ColorPicker.prototype.inputChangeRed = function inputChangeRed(e) {
+		var value = parseInt(e.target.value);
+		this.color.setByName('r', value);
+		e.target.value = this.color.r;
+		this.setColor(this.color);
+	};
+
+	ColorPicker.prototype.inputChangeGreen = function inputChangeGreen(e) {
+		var value = parseInt(e.target.value);
+		this.color.setByName('g', value);
+		e.target.value = this.color.g;
+		this.setColor(this.color);
+	};
+
+	ColorPicker.prototype.inputChangeBlue = function inputChangeBlue(e) {
+		var value = parseInt(e.target.value);
+		this.color.setByName('b', value);
+		e.target.value = this.color.b;
+		this.setColor(this.color);
+	};
+
+	ColorPicker.prototype.inputChangeAlpha = function inputChangeAlpha(e) {
+		var value = parseFloat(e.target.value);
+
+		if (typeof value === 'number' &amp;&amp; isNaN(value) === false &amp;&amp;
+			value &gt;= 0 &amp;&amp; value &lt;= 1)
+			this.color.a = value.toFixed(2);
+
+		e.target.value = this.color.a;
+		this.updateAlphaPicker();
+	};
+
+	ColorPicker.prototype.inputChangeHexa = function inputChangeHexa(e) {
+		var value = e.target.value;
+		this.color.setHexa(value);
+		this.setColor(this.color);
+	};
+
+	/*************************************************************************/
+	//							Internal Pub/Sub
+	/*************************************************************************/
+
+	ColorPicker.prototype.subscribe = function subscribe(topic, callback) {
+		this.subscribers[topic] = callback;
+	};
+
+	ColorPicker.prototype.notify = function notify(topic, value) {
+		if (this.subscribers[topic])
+			this.subscribers[topic](value);
+	};
+
+	/*************************************************************************/
+	//							Set Picker Properties
+	/*************************************************************************/
+
+	ColorPicker.prototype.setColor = function setColor(color) {
+		if(color instanceof Color !== true) {
+			console.log('Typeof parameter not Color');
+			return;
+		}
+
+		if (color.format !== this.picker_mode) {
+			color.setFormat(this.picker_mode);
+			color.updateHSX();
+		}
+
+		this.color.copy(color);
+		this.updateHuePicker();
+		this.updatePickerPosition();
+		this.updatePickerBackground();
+		this.updateAlphaPicker();
+		this.updateAlphaGradient();
+		this.updatePreviewColor();
+
+		this.notify('red', this.color.r);
+		this.notify('green', this.color.g);
+		this.notify('blue', this.color.b);
+
+		this.notify('hue', this.color.hue);
+		this.notify('saturation', this.color.saturation);
+		this.notify('value', this.color.value);
+		this.notify('lightness', this.color.lightness);
+
+		this.notify('alpha', this.color.a);
+		this.notify('hexa', this.color.getHexa());
+		notify(this.topic, this.color);
+	};
+
+	ColorPicker.prototype.setPickerMode = function setPickerMode(mode) {
+		if (mode !== 'HSV' &amp;&amp; mode !== 'HSL')
+			return;
+
+		this.picker_mode = mode;
+		this.node.setAttribute('data-mode', this.picker_mode);
+		this.setColor(this.color);
+	};
+
+	/*************************************************************************/
+	//								UNUSED
+	/*************************************************************************/
+
+	var setPickerMode = function setPickerMode(topic, mode) {
+		if (pickers[topic])
+			pickers[topic].setPickerMode(mode);
+	};
+
+	var setColor = function setColor(topic, color) {
+		if (pickers[topic])
+			pickers[topic].setColor(color);
+	};
+
+	var getColor = function getColor(topic) {
+		if (pickers[topic])
+			return new Color(pickers[topic].color);
+	};
+
+	var subscribe = function subscribe(topic, callback) {
+		if (subscribers[topic] === undefined)
+			subscribers[topic] = [];
+
+		subscribers[topic].push(callback);
+	};
+
+	var unsubscribe = function unsubscribe(callback) {
+		subscribers.indexOf(callback);
+		subscribers.splice(index, 1);
+	};
+
+	var notify = function notify(topic, value) {
+		if (subscribers[topic] === undefined || subscribers[topic].length === 0)
+			return;
+
+		var color = new Color(value);
+		for (var i in subscribers[topic])
+			subscribers[topic][i](color);
+	};
+
+	var init = function init() {
+		var elem = document.querySelectorAll('.ui-color-picker');
+		var size = elem.length;
+		for (var i = 0; i &lt; size; i++)
+			new ColorPicker(elem[i]);
+	};
+
+	return {
+		init : init,
+		Color : Color,
+		RGBColor : RGBColor,
+		RGBAColor : RGBAColor,
+		HSVColor : HSVColor,
+		HSVAColor : HSVAColor,
+		HSLColor : HSLColor,
+		HSLAColor : HSLAColor,
+		setColor : setColor,
+		getColor : getColor,
+		subscribe : subscribe,
+		unsubscribe : unsubscribe,
+		setPickerMode : setPickerMode
+	};
+
+})();
+
+
+
+/**
+ * UI-SlidersManager
+ */
+
+var InputSliderManager = (function InputSliderManager() {
+
+	var subscribers = {};
+	var sliders = [];
+
+	var InputComponent = function InputComponent(obj) {
+		var input = document.createElement('input');
+		input.setAttribute('type', 'text');
+		input.style.width = 50 + obj.precision * 10 + 'px';
+
+		input.addEventListener('click', function(e) {
+			this.select();
+		});
+
+		input.addEventListener('change', function(e) {
+			var value = parseFloat(e.target.value);
+
+			if (isNaN(value) === true)
+				setValue(obj.topic, obj.value);
+			else
+				setValue(obj.topic, value);
+		});
+
+		return input;
+	};
+
+	var SliderComponent = function SliderComponent(obj, sign) {
+		var slider = document.createElement('div');
+		var startX = null;
+		var start_value = 0;
+
+		slider.addEventListener("click", function(e) {
+			document.removeEventListener("mousemove", sliderMotion);
+			setValue(obj.topic, obj.value + obj.step * sign);
+		});
+
+		slider.addEventListener("mousedown", function(e) {
+			startX = e.clientX;
+			start_value = obj.value;
+			document.body.style.cursor = "e-resize";
+
+			document.addEventListener("mouseup", slideEnd);
+			document.addEventListener("mousemove", sliderMotion);
+		});
+
+		var slideEnd = function slideEnd(e) {
+			document.removeEventListener("mousemove", sliderMotion);
+			document.body.style.cursor = "auto";
+			slider.style.cursor = "pointer";
+		};
+
+		var sliderMotion = function sliderMotion(e) {
+			slider.style.cursor = "e-resize";
+			var delta = (e.clientX - startX) / obj.sensivity | 0;
+			var value = delta * obj.step + start_value;
+			setValue(obj.topic, value);
+		};
+
+		return slider;
+	};
+
+	var InputSlider = function(node) {
+		var min		= parseFloat(node.getAttribute('data-min'));
+		var max		= parseFloat(node.getAttribute('data-max'));
+		var step	= parseFloat(node.getAttribute('data-step'));
+		var value	= parseFloat(node.getAttribute('data-value'));
+		var topic	= node.getAttribute('data-topic');
+		var unit	= node.getAttribute('data-unit');
+		var name 	= node.getAttribute('data-info');
+		var sensivity = node.getAttribute('data-sensivity') | 0;
+		var precision = node.getAttribute('data-precision') | 0;
+
+		this.min = isNaN(min) ? 0 : min;
+		this.max = isNaN(max) ? 100 : max;
+		this.precision = precision &gt;= 0 ? precision : 0;
+		this.step = step &lt; 0 || isNaN(step) ? 1 : step.toFixed(precision);
+		this.topic = topic;
+		this.node = node;
+		this.unit = unit === null ? '' : unit;
+		this.sensivity = sensivity &gt; 0 ? sensivity : 5;
+		value = isNaN(value) ? this.min : value;
+
+		var input = new InputComponent(this);
+		var slider_left  = new SliderComponent(this, -1);
+		var slider_right = new SliderComponent(this,  1);
+
+		slider_left.className = 'ui-input-slider-left';
+		slider_right.className = 'ui-input-slider-right';
+
+		if (name) {
+			var info = document.createElement('span');
+			info.className = 'ui-input-slider-info';
+			info.textContent = name;
+			node.appendChild(info);
+		}
+
+		node.appendChild(slider_left);
+		node.appendChild(input);
+		node.appendChild(slider_right);
+
+		this.input = input;
+		sliders[topic] = this;
+		setValue(topic, value);
+	};
+
+	InputSlider.prototype.setInputValue = function setInputValue() {
+		this.input.value = this.value.toFixed(this.precision) + this.unit;
+	};
+
+	var setValue = function setValue(topic, value, send_notify) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		value = parseFloat(value.toFixed(slider.precision));
+
+		if (value &gt; slider.max) value = slider.max;
+		if (value &lt; slider.min)	value = slider.min;
+
+		slider.value = value;
+		slider.node.setAttribute('data-value', value);
+
+		slider.setInputValue();
+
+		if (send_notify === false)
+			return;
+
+		notify.call(slider);
+	};
+
+	var setMax = function setMax(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.max = value;
+		setValue(topic, slider.value);
+	};
+
+	var setMin = function setMin(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.min = value;
+		setValue(topic, slider.value);
+	};
+
+	var setUnit = function setUnit(topic, unit) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.unit = unit;
+		setValue(topic, slider.value);
+	};
+
+	var setStep = function setStep(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		slider.step = parseFloat(value);
+		setValue(topic, slider.value);
+	};
+
+	var setPrecision = function setPrecision(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		value = value | 0;
+		slider.precision = value;
+
+		var step = parseFloat(slider.step.toFixed(value));
+		if (step === 0)
+			slider.step = 1 / Math.pow(10, value);
+
+		setValue(topic, slider.value);
+	};
+
+	var setSensivity = function setSensivity(topic, value) {
+		var slider = sliders[topic];
+		if (slider === undefined)
+			return;
+
+		value = value | 0;
+
+		slider.sensivity = value &gt; 0 ? value : 5;
+	};
+
+	var getNode =  function getNode(topic) {
+		return sliders[topic].node;
+	};
+
+	var getPrecision =  function getPrecision(topic) {
+		return sliders[topic].precision;
+	};
+
+	var getStep =  function getStep(topic) {
+		return sliders[topic].step;
+	};
+
+	var subscribe = function subscribe(topic, callback) {
+		if (subscribers[topic] === undefined)
+			subscribers[topic] = [];
+		subscribers[topic].push(callback);
+	};
+
+	var unsubscribe = function unsubscribe(topic, callback) {
+		subscribers[topic].indexOf(callback);
+		subscribers[topic].splice(index, 1);
+	};
+
+	var notify = function notify() {
+		if (subscribers[this.topic] === undefined)
+			return;
+		for (var i = 0; i &lt; subscribers[this.topic].length; i++)
+			subscribers[this.topic][i](this.value);
+	};
+
+	var createSlider = function createSlider(topic, label) {
+		var slider = document.createElement('div');
+		slider.className = 'ui-input-slider';
+		slider.setAttribute('data-topic', topic);
+
+		if (label !== undefined)
+			slider.setAttribute('data-info', label);
+
+		new InputSlider(slider);
+		return slider;
+	};
+
+	var init = function init() {
+		var elem = document.querySelectorAll('.ui-input-slider');
+		var size = elem.length;
+		for (var i = 0; i &lt; size; i++)
+			new InputSlider(elem[i]);
+	};
+
+	return {
+		init : init,
+		setMax : setMax,
+		setMin : setMin,
+		setUnit : setUnit,
+		setStep : setStep,
+		getNode : getNode,
+		getStep : getStep,
+		setValue : setValue,
+		subscribe : subscribe,
+		unsubscribe : unsubscribe,
+		setPrecision : setPrecision,
+		setSensivity : setSensivity,
+		getPrecision : getPrecision,
+		createSlider : createSlider,
+	};
+
+})();
+
+
+'use strict';
+
+window.addEventListener("load", function() {
+	ColorPickerTool.init();
+});
+
+var ColorPickerTool = (function ColorPickerTool() {
+
+	/*========== Get DOM Element By ID ==========*/
+
+	function getElemById(id) {
+		return document.getElementById(id);
+	}
+
+	function allowDropEvent(e) {
+		e.preventDefault();
+	}
+
+	/*========== Make an element resizable relative to it's parent ==========*/
+
+	var UIComponent = (function UIComponent() {
+
+		function makeResizable(elem, axis) {
+			var valueX = 0;
+			var valueY = 0;
+			var action = 0;
+
+			var resizeStart = function resizeStart(e) {
+				e.stopPropagation();
+				e.preventDefault();
+				if (e.button !== 0)
+					return;
+
+				valueX = e.clientX - elem.clientWidth;
+				valueY = e.clientY - elem.clientHeight;
+
+				document.body.setAttribute('data-resize', axis);
+				document.addEventListener('mousemove', mouseMove);
+				document.addEventListener('mouseup', resizeEnd);
+			};
+
+			var mouseMove = function mouseMove(e) {
+				if (action &gt;= 0)
+					elem.style.width = e.clientX - valueX + 'px';
+				if (action &lt;= 0)
+					elem.style.height = e.clientY - valueY + 'px';
+			};
+
+			var resizeEnd = function resizeEnd(e) {
+				if (e.button !== 0)
+					return;
+
+				document.body.removeAttribute('data-resize', axis);
+				document.removeEventListener('mousemove', mouseMove);
+				document.removeEventListener('mouseup', resizeEnd);
+			};
+
+			var handle = document.createElement('div');
+			handle.className = 'resize-handle';
+
+			if (axis === 'width') action = 1;
+			else if (axis === 'height') action = -1;
+			else axis = 'both';
+
+			handle.className = 'resize-handle';
+			handle.setAttribute('data-resize', axis);
+			handle.addEventListener('mousedown', resizeStart);
+			elem.appendChild(handle);
+		};
+
+		/*========== Make an element draggable relative to it's parent ==========*/
+
+		var makeDraggable = function makeDraggable(elem, endFunction) {
+
+			var offsetTop;
+			var offsetLeft;
+
+			elem.setAttribute('data-draggable', 'true');
+
+			var dragStart = function dragStart(e) {
+				e.preventDefault();
+				e.stopPropagation();
+
+				if (e.target.getAttribute('data-draggable') !== 'true' ||
+					e.target !== elem || e.button !== 0)
+					return;
+
+				offsetLeft = e.clientX - elem.offsetLeft;
+				offsetTop = e.clientY - elem.offsetTop;
+
+				document.addEventListener('mousemove', mouseDrag);
+				document.addEventListener('mouseup', dragEnd);
+			};
+
+			var dragEnd = function dragEnd(e) {
+				if (e.button !== 0)
+					return;
+
+				document.removeEventListener('mousemove', mouseDrag);
+				document.removeEventListener('mouseup', dragEnd);
+			};
+
+			var mouseDrag = function mouseDrag(e) {
+				elem.style.left = e.clientX - offsetLeft + 'px';
+				elem.style.top = e.clientY - offsetTop + 'px';
+			};
+
+			elem.addEventListener('mousedown', dragStart, false);
+		};
+
+		return {
+			makeResizable : makeResizable,
+			makeDraggable : makeDraggable
+		};
+
+	})();
+
+	/*========== Color Class ==========*/
+
+	var Color = UIColorPicker.Color;
+	var HSLColor = UIColorPicker.HSLColor;
+
+	/**
+	 * ColorPalette
+	 */
+	var ColorPalette = (function ColorPalette() {
+
+		var samples = [];
+		var color_palette;
+		var complementary;
+
+		var hideNode = function(node) {
+			node.setAttribute('data-hidden', 'true');
+		};
+
+		var ColorSample = function ColorSample(id) {
+			var node = document.createElement('div');
+			node.className = 'sample';
+
+			this.uid = samples.length;
+			this.node = node;
+			this.color = new Color();
+
+			node.setAttribute('sample-id', this.uid);
+			node.setAttribute('draggable', 'true');
+			node.addEventListener('dragstart', this.dragStart.bind(this));
+			node.addEventListener('click', this.pickColor.bind(this));
+
+			samples.push(this);
+		};
+
+		ColorSample.prototype.updateBgColor = function updateBgColor() {
+			this.node.style.backgroundColor = this.color.getColor();
+		};
+
+		ColorSample.prototype.updateColor = function updateColor(color) {
+			this.color.copy(color);
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.updateHue = function updateHue(color, degree, steps) {
+			this.color.copy(color);
+			var hue = (steps * degree + this.color.hue) % 360;
+			if (hue &lt; 0) hue += 360;
+			this.color.setHue(hue);
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.updateSaturation = function updateSaturation(color, value, steps) {
+			var saturation = color.saturation + value * steps;
+			if (saturation &lt;= 0) {
+				this.node.setAttribute('data-hidden', 'true');
+				return;
+			}
+
+			this.node.removeAttribute('data-hidden');
+			this.color.copy(color);
+			this.color.setSaturation(saturation);
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.updateLightness = function updateLightness(color, value, steps) {
+			var lightness = color.lightness + value * steps;
+			if (lightness &lt;= 0) {
+				this.node.setAttribute('data-hidden', 'true');
+				return;
+			}
+			this.node.removeAttribute('data-hidden');
+			this.color.copy(color);
+			this.color.setLightness(lightness);
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.updateBrightness = function updateBrightness(color, value, steps) {
+			var brightness = color.value + value * steps;
+			if (brightness &lt;= 0) {
+				this.node.setAttribute('data-hidden', 'true');
+				return;
+			}
+			this.node.removeAttribute('data-hidden');
+			this.color.copy(color);
+			this.color.setValue(brightness);
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.updateAlpha = function updateAlpha(color, value, steps) {
+			var alpha = parseFloat(color.a) + value * steps;
+			if (alpha &lt;= 0) {
+				this.node.setAttribute('data-hidden', 'true');
+				return;
+			}
+			this.node.removeAttribute('data-hidden');
+			this.color.copy(color);
+			this.color.a = parseFloat(alpha.toFixed(2));
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.pickColor = function pickColor() {
+			UIColorPicker.setColor('picker', this.color);
+		};
+
+		ColorSample.prototype.dragStart = function dragStart(e) {
+			e.dataTransfer.setData('sampleID', this.uid);
+			e.dataTransfer.setData('location', 'palette-samples');
+		};
+
+		var Palette = function Palette(text, size) {
+			this.samples = [];
+			this.locked = false;
+
+			var palette = document.createElement('div');
+			var title = document.createElement('div');
+			var controls = document.createElement('div');
+			var container = document.createElement('div');
+			var lock = document.createElement('div');
+
+			container.className = 'container';
+			title.className = 'title';
+			palette.className = 'palette';
+			controls.className = 'controls';
+			lock.className = 'lock';
+			title.textContent = text;
+
+			controls.appendChild(lock);
+			container.appendChild(title);
+			container.appendChild(controls);
+			container.appendChild(palette);
+
+			lock.addEventListener('click', function () {
+				this.locked = !this.locked;
+				lock.setAttribute('locked-state', this.locked);
+			}.bind(this));
+
+			for(var i = 0; i &lt; size; i++) {
+				var sample = new ColorSample();
+				this.samples.push(sample);
+				palette.appendChild(sample.node);
+			}
+
+			this.container = container;
+			this.title = title;
+		};
+
+		var createHuePalette = function createHuePalette() {
+			var palette = new Palette('Hue', 12);
+
+			UIColorPicker.subscribe('picker', function(color) {
+				if (palette.locked === true)
+					return;
+
+				for(var i = 0; i &lt; 12; i++) {
+					palette.samples[i].updateHue(color, 30, i);
+				}
+			});
+
+			color_palette.appendChild(palette.container);
+		};
+
+		var createSaturationPalette = function createSaturationPalette() {
+			var palette = new Palette('Saturation', 11);
+
+			UIColorPicker.subscribe('picker', function(color) {
+				if (palette.locked === true)
+					return;
+
+				for(var i = 0; i &lt; 11; i++) {
+					palette.samples[i].updateSaturation(color, -10, i);
+				}
+			});
+
+			color_palette.appendChild(palette.container);
+		};
+
+		/* Brightness or Lightness - depends on the picker mode */
+		var createVLPalette = function createSaturationPalette() {
+			var palette = new Palette('Lightness', 11);
+
+			UIColorPicker.subscribe('picker', function(color) {
+				if (palette.locked === true)
+					return;
+
+				if(color.format === 'HSL') {
+					palette.title.textContent = 'Lightness';
+					for(var i = 0; i &lt; 11; i++)
+						palette.samples[i].updateLightness(color, -10, i);
+				}
+				else {
+					palette.title.textContent = 'Value';
+					for(var i = 0; i &lt; 11; i++)
+						palette.samples[i].updateBrightness(color, -10, i);
+				}
+			});
+
+			color_palette.appendChild(palette.container);
+		};
+
+		var isBlankPalette = function isBlankPalette(container, value) {
+			if (value === 0) {
+				container.setAttribute('data-collapsed', 'true');
+				return true;
+			}
+
+			container.removeAttribute('data-collapsed');
+			return false;
+		};
+
+		var createAlphaPalette = function createAlphaPalette() {
+			var palette = new Palette('Alpha', 10);
+
+			UIColorPicker.subscribe('picker', function(color) {
+				if (palette.locked === true)
+					return;
+
+				for(var i = 0; i &lt; 10; i++) {
+					palette.samples[i].updateAlpha(color, -0.1, i);
+				}
+			});
+
+			color_palette.appendChild(palette.container);
+		};
+
+		var getSampleColor = function getSampleColor(id) {
+			if (samples[id] !== undefined &amp;&amp; samples[id]!== null)
+				return new Color(samples[id].color);
+		};
+
+		var init = function init() {
+			color_palette = getElemById('color-palette');
+
+			createHuePalette();
+			createSaturationPalette();
+			createVLPalette();
+			createAlphaPalette();
+
+		};
+
+		return {
+			init : init,
+			getSampleColor : getSampleColor
+		};
+
+	})();
+
+	/**
+	 * ColorInfo
+	 */
+	var ColorInfo = (function ColorInfo() {
+
+		var info_box;
+		var select;
+		var RGBA;
+		var HEXA;
+		var HSLA;
+
+		var updateInfo = function updateInfo(color) {
+			if (color.a | 0 === 1) {
+				RGBA.info.textContent = 'RGB';
+				HSLA.info.textContent = 'HSL';
+			}
+			else {
+				RGBA.info.textContent = 'RGBA';
+				HSLA.info.textContent = 'HSLA';
+			}
+
+			RGBA.value.value = color.getRGBA();
+			HSLA.value.value = color.getHSLA();
+			HEXA.value.value = color.getHexa();
+		};
+
+		var InfoProperty = function InfoProperty(info) {
+
+			var node = document.createElement('div');
+			var title = document.createElement('div');
+			var value = document.createElement('input');
+			var copy = document.createElement('div');
+
+			node.className = 'property';
+			title.className = 'type';
+			value.className = 'value';
+			copy.className = 'copy';
+
+			title.textContent = info;
+			value.setAttribute('type', 'text');
+
+			copy.addEventListener('click', function() {
+				value.select();
+			});
+
+			node.appendChild(title);
+			node.appendChild(value);
+			node.appendChild(copy);
+
+			this.node = node;
+			this.value = value;
+			this.info = title;
+
+			info_box.appendChild(node);
+		};
+
+		var init = function init() {
+
+			info_box = getElemById('color-info');
+
+			RGBA = new InfoProperty('RGBA');
+			HSLA = new InfoProperty('HSLA');
+			HEXA = new InfoProperty('HEXA');
+
+			UIColorPicker.subscribe('picker', updateInfo);
+
+		};
+
+		return {
+			init: init
+		};
+
+	})();
+
+	/**
+	 * ColorPicker Samples
+	 */
+	var ColorPickerSamples = (function ColorPickerSamples() {
+
+		var samples = [];
+		var nr_samples = 0;
+		var active = null;
+		var container = null;
+		var	samples_per_line = 10;
+		var trash_can = null;
+		var base_color = new HSLColor(0, 50, 100);
+		var add_btn;
+		var add_btn_pos;
+
+		var ColorSample = function ColorSample() {
+			var node = document.createElement('div');
+			node.className = 'sample';
+
+			this.uid = samples.length;
+			this.index = nr_samples++;
+			this.node = node;
+			this.color = new Color(base_color);
+
+			node.setAttribute('sample-id', this.uid);
+			node.setAttribute('draggable', 'true');
+
+			node.addEventListener('dragstart', this.dragStart.bind(this));
+			node.addEventListener('dragover' , allowDropEvent);
+			node.addEventListener('drop'     , this.dragDrop.bind(this));
+
+			this.updatePosition(this.index);
+			this.updateBgColor();
+			samples.push(this);
+		};
+
+		ColorSample.prototype.updateBgColor = function updateBgColor() {
+			this.node.style.backgroundColor = this.color.getColor();
+		};
+
+		ColorSample.prototype.updatePosition = function updatePosition(index) {
+			this.index = index;
+			this.posY = 5 + ((index / samples_per_line) | 0) * 52;
+			this.posX = 5 + ((index % samples_per_line) | 0) * 52;
+			this.node.style.top  = this.posY + 'px';
+			this.node.style.left = this.posX + 'px';
+		};
+
+		ColorSample.prototype.updateColor = function updateColor(color) {
+			this.color.copy(color);
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.activate = function activate() {
+			UIColorPicker.setColor('picker', this.color);
+			this.node.setAttribute('data-active', 'true');
+		};
+
+		ColorSample.prototype.deactivate = function deactivate() {
+			this.node.removeAttribute('data-active');
+		};
+
+		ColorSample.prototype.dragStart = function dragStart(e) {
+			e.dataTransfer.setData('sampleID', this.uid);
+			e.dataTransfer.setData('location', 'picker-samples');
+		};
+
+		ColorSample.prototype.dragDrop = function dragDrop(e) {
+			e.stopPropagation();
+			this.color = Tool.getSampleColorFrom(e);
+			this.updateBgColor();
+		};
+
+		ColorSample.prototype.deleteSample = function deleteSample() {
+			container.removeChild(this.node);
+			samples[this.uid] = null;
+			nr_samples--;
+		};
+
+		var updateUI = function updateUI() {
+			updateContainerProp();
+
+			var index = 0;
+			var nr = samples.length;
+			for (var i=0; i &lt; nr; i++)
+				if (samples[i] !== null) {
+					samples[i].updatePosition(index);
+					index++;
+				}
+
+			AddSampleButton.updatePosition(index);
+		};
+
+		var deleteSample = function deleteSample(e) {
+			trash_can.parentElement.setAttribute('drag-state', 'none');
+
+			var location = e.dataTransfer.getData('location');
+			if (location !== 'picker-samples')
+				return;
+
+			var sampleID = e.dataTransfer.getData('sampleID');
+			samples[sampleID].deleteSample();
+			console.log(samples);
+
+			updateUI();
+		};
+
+		var createDropSample = function createDropSample() {
+			var sample = document.createElement('div');
+			sample.id = 'drop-effect-sample';
+			sample.className = 'sample';
+			container.appendChild(sample);
+		};
+
+		var setActivateSample = function setActivateSample(e) {
+			if (e.target.className !== 'sample')
+				return;
+
+			unsetActiveSample(active);
+			Tool.unsetVoidSample();
+			CanvasSamples.unsetActiveSample();
+			active = samples[e.target.getAttribute('sample-id')];
+			active.activate();
+		};
+
+		var unsetActiveSample = function unsetActiveSample() {
+			if (active)
+				active.deactivate();
+			active = null;
+		};
+
+		var getSampleColor = function getSampleColor(id) {
+			if (samples[id] !== undefined &amp;&amp; samples[id]!== null)
+				return new Color(samples[id].color);
+		};
+
+		var updateContainerProp = function updateContainerProp() {
+			samples_per_line = ((container.clientWidth - 5) / 52) | 0;
+			var height = 52 * (1 + (nr_samples / samples_per_line) | 0);
+			container.style.height = height + 10 + 'px';
+		};
+
+		var AddSampleButton = (function AddSampleButton() {
+			var node;
+			var _index = 0;
+			var _posX;
+			var _posY;
+
+			var updatePosition = function updatePosition(index) {
+				_index = index;
+				_posY = 5 + ((index / samples_per_line) | 0) * 52;
+				_posX = 5 + ((index % samples_per_line) | 0) * 52;
+
+				node.style.top  = _posY + 'px';
+				node.style.left = _posX + 'px';
+			};
+
+			var addButtonClick = function addButtonClick() {
+				var sample = new ColorSample();
+				container.appendChild(sample.node);
+				updatePosition(_index + 1);
+				updateUI();
+			};
+
+			var init = function init() {
+				node = document.createElement('div');
+				var icon = document.createElement('div');
+
+				node.className = 'sample';
+				icon.id = 'add-icon';
+				node.appendChild(icon);
+				node.addEventListener('click', addButtonClick);
+
+				updatePosition(0);
+				container.appendChild(node);
+			};
+
+			return {
+				init : init,
+				updatePosition : updatePosition
+			};
+		})();
+
+		var init = function init() {
+			container = getElemById('picker-samples');
+			trash_can = getElemById('trash-can');
+
+			AddSampleButton.init();
+
+			for (var i=0; i&lt;16; i++) {
+				var sample = new ColorSample();
+				container.appendChild(sample.node);
+			}
+
+			AddSampleButton.updatePosition(samples.length);
+			updateUI();
+
+			active = samples[0];
+			active.activate();
+
+			container.addEventListener('click', setActivateSample);
+
+			trash_can.addEventListener('dragover', allowDropEvent);
+			trash_can.addEventListener('dragenter', function() {
+				this.parentElement.setAttribute('drag-state', 'enter');
+			});
+			trash_can.addEventListener('dragleave', function(e) {
+				this.parentElement.setAttribute('drag-state', 'none');
+			});
+			trash_can.addEventListener('drop', deleteSample);
+
+			UIColorPicker.subscribe('picker', function(color) {
+				if (active)
+					active.updateColor(color);
+			});
+
+		};
+
+		return {
+			init : init,
+			getSampleColor : getSampleColor,
+			unsetActiveSample : unsetActiveSample
+		};
+
+	})();
+
+	/**
+	 * Canvas Samples
+	 */
+	var CanvasSamples = (function CanvasSamples() {
+
+		var active = null;
+		var canvas = null;
+		var samples = [];
+		var zindex = null;
+		var tutorial = true;
+
+		var CanvasSample = function CanvasSample(color, posX, posY) {
+
+			var node = document.createElement('div');
+			var pick = document.createElement('div');
+			var delete_btn = document.createElement('div');
+			node.className = 'sample';
+			pick.className = 'pick';
+			delete_btn.className = 'delete';
+
+			this.uid = samples.length;
+			this.node = node;
+			this.color = color;
+			this.updateBgColor();
+			this.zIndex = 1;
+
+			node.style.top = posY - 50 + 'px';
+			node.style.left = posX - 50 + 'px';
+			node.setAttribute('sample-id', this.uid);
+
+			node.appendChild(pick);
+			node.appendChild(delete_btn);
+
+			var activate = function activate() {
+				setActiveSample(this);
+			}.bind(this);
+
+			node.addEventListener('dblclick', activate);
+			pick.addEventListener('click', activate);
+			delete_btn.addEventListener('click', this.deleteSample.bind(this));
+
+			UIComponent.makeDraggable(node);
+			UIComponent.makeResizable(node);
+
+			samples.push(this);
+			canvas.appendChild(node);
+			return this;
+		};
+
+		CanvasSample.prototype.updateBgColor = function updateBgColor() {
+			this.node.style.backgroundColor = this.color.getColor();
+		};
+
+		CanvasSample.prototype.updateColor = function updateColor(color) {
+			this.color.copy(color);
+			this.updateBgColor();
+		};
+
+		CanvasSample.prototype.updateZIndex = function updateZIndex(value) {
+			this.zIndex = value;
+			this.node.style.zIndex = value;
+		};
+
+		CanvasSample.prototype.activate = function activate() {
+			this.node.setAttribute('data-active', 'true');
+			zindex.setAttribute('data-active', 'true');
+
+			UIColorPicker.setColor('picker', this.color);
+			InputSliderManager.setValue('z-index', this.zIndex);
+		};
+
+		CanvasSample.prototype.deactivate = function deactivate() {
+			this.node.removeAttribute('data-active');
+			zindex.removeAttribute('data-active');
+		};
+
+		CanvasSample.prototype.deleteSample = function deleteSample() {
+			if (active === this)
+				unsetActiveSample();
+			canvas.removeChild(this.node);
+			samples[this.uid] = null;
+		};
+
+		CanvasSample.prototype.updatePosition = function updatePosition(posX, posY) {
+			this.node.style.top = posY - this.startY + 'px';
+			this.node.style.left = posX - this.startX + 'px';
+		};
+
+		var canvasDropEvent = function canvasDropEvent(e) {
+			var color = Tool.getSampleColorFrom(e);
+
+			if (color) {
+				var offsetX = e.pageX - canvas.offsetLeft;
+				var offsetY = e.pageY - canvas.offsetTop;
+				var sample = new CanvasSample(color, offsetX, offsetY);
+				if (tutorial) {
+					tutorial = false;
+					canvas.removeAttribute('data-tutorial');
+					var info = new CanvasSample(new Color(), 100, 100);
+					info.node.setAttribute('data-tutorial', 'dblclick');
+				}
+			}
+
+		};
+
+		var setActiveSample = function setActiveSample(sample) {
+			ColorPickerSamples.unsetActiveSample();
+			Tool.unsetVoidSample();
+			unsetActiveSample();
+			active = sample;
+			active.activate();
+		};
+
+		var unsetActiveSample = function unsetActiveSample() {
+			if (active)
+				active.deactivate();
+			active = null;
+		};
+
+		var createToggleBgButton = function createToggleBgButton() {
+			var button = document.createElement('div');
+			var state = false;
+			button.className = 'toggle-bg';
+			canvas.appendChild(button);
+
+			button.addEventListener('click', function() {
+				console.log(state);
+				state = !state;
+				canvas.setAttribute('data-bg', state);
+			});
+		};
+
+		var init = function init() {
+			canvas = getElemById('canvas');
+			zindex = getElemById('zindex');
+
+			canvas.addEventListener('dragover', allowDropEvent);
+			canvas.addEventListener('drop', canvasDropEvent);
+
+			createToggleBgButton();
+
+			UIColorPicker.subscribe('picker', function(color) {
+				if (active)	active.updateColor(color);
+			});
+
+			InputSliderManager.subscribe('z-index', function (value) {
+				if (active)	active.updateZIndex(value);
+			});
+
+			UIComponent.makeResizable(canvas, 'height');
+		};
+
+		return {
+			init : init,
+			unsetActiveSample : unsetActiveSample
+		};
+
+	})();
+
+	var StateButton = function StateButton(node, state) {
+		this.state = false;
+		this.callback = null;
+
+		node.addEventListener('click', function() {
+			this.state = !this.state;
+			if (typeof this.callback === "function")
+				this.callback(this.state);
+		}.bind(this));
+	};
+
+	StateButton.prototype.set = function set() {
+		this.state = true;
+		if (typeof this.callback === "function")
+			this.callback(this.state);
+	};
+
+	StateButton.prototype.unset = function unset() {
+		this.state = false;
+		if (typeof this.callback === "function")
+			this.callback(this.state);
+	};
+
+	StateButton.prototype.subscribe = function subscribe(func) {
+		this.callback = func;
+	};
+
+
+	/**
+	 * Tool
+	 */
+	var Tool = (function Tool() {
+
+		var samples = [];
+		var controls = null;
+		var void_sw;
+
+		var createPickerModeSwitch = function createPickerModeSwitch() {
+			var parent = getElemById('controls');
+			var icon = document.createElement('div');
+			var button = document.createElement('div');
+			var hsv = document.createElement('div');
+			var hsl = document.createElement('div');
+			var active = null;
+
+			icon.className = 'icon picker-icon';
+			button.className = 'switch';
+			button.appendChild(hsv);
+			button.appendChild(hsl);
+
+			hsv.textContent = 'HSV';
+			hsl.textContent = 'HSL';
+
+			active = hsl;
+			active.setAttribute('data-active', 'true');
+
+			function switchPickingModeTo(elem) {
+				active.removeAttribute('data-active');
+				active = elem;
+				active.setAttribute('data-active', 'true');
+				UIColorPicker.setPickerMode('picker', active.textContent);
+			};
+
+			var picker_sw = new StateButton(icon);
+			picker_sw.subscribe(function() {
+				if (active === hsv)
+					switchPickingModeTo(hsl);
+				else
+					switchPickingModeTo(hsv);
+			});
+
+			hsv.addEventListener('click', function() {
+				switchPickingModeTo(hsv);
+			});
+			hsl.addEventListener('click', function() {
+				switchPickingModeTo(hsl);
+			});
+
+			parent.appendChild(icon);
+			parent.appendChild(button);
+		};
+
+		var setPickerDragAndDrop = function setPickerDragAndDrop() {
+			var preview = document.querySelector('#picker .preview-color');
+			var picking_area = document.querySelector('#picker .picking-area');
+
+			preview.setAttribute('draggable', 'true');
+			preview.addEventListener('drop', drop);
+			preview.addEventListener('dragstart', dragStart);
+			preview.addEventListener('dragover', allowDropEvent);
+
+			picking_area.addEventListener('drop', drop);
+			picking_area.addEventListener('dragover', allowDropEvent);
+
+			function drop(e) {
+				var color = getSampleColorFrom(e);
+				UIColorPicker.setColor('picker', color);
+			};
+
+			function dragStart(e) {
+				e.dataTransfer.setData('sampleID', 'picker');
+				e.dataTransfer.setData('location', 'picker');
+			};
+		};
+
+		var getSampleColorFrom = function getSampleColorFrom(e) {
+			var sampleID = e.dataTransfer.getData('sampleID');
+			var location = e.dataTransfer.getData('location');
+
+			if (location === 'picker')
+				return UIColorPicker.getColor(sampleID);
+			if (location === 'picker-samples')
+				return ColorPickerSamples.getSampleColor(sampleID);
+			if (location === 'palette-samples')
+				return ColorPalette.getSampleColor(sampleID);
+		};
+
+		var setVoidSwitch = function setVoidSwitch() {
+			var void_sample = getElemById('void-sample');
+			void_sw = new StateButton(void_sample);
+			void_sw.subscribe( function (state) {
+				void_sample.setAttribute('data-active', state);
+				if (state === true) {
+					ColorPickerSamples.unsetActiveSample();
+					CanvasSamples.unsetActiveSample();
+				}
+			});
+		};
+
+		var unsetVoidSample = function unsetVoidSample() {
+			void_sw.unset();
+		};
+
+		var init = function init() {
+			controls = getElemById('controls');
+
+			var color = new Color();
+			color.setHSL(0, 51, 51);
+			UIColorPicker.setColor('picker', color);
+
+			setPickerDragAndDrop();
+			createPickerModeSwitch();
+			setVoidSwitch();
+		};
+
+		return {
+			init : init,
+			unsetVoidSample : unsetVoidSample,
+			getSampleColorFrom : getSampleColorFrom
+		};
+
+	})();
+
+	var init = function init() {
+		UIColorPicker.init();
+		InputSliderManager.init();
+		ColorInfo.init();
+		ColorPalette.init();
+		ColorPickerSamples.init();
+		CanvasSamples.init();
+		Tool.init();
+	};
+
+	return {
+		init : init
+	};
+
+})();
+
+</pre>
+</div>
+
+<p>{{CSSRef}}</p>
+
+<p>Esta herramienta facilita crear, ajustar, y experimentar con colores personalizados para uso web. Además permite facilmente convertir entre varios formatos de color soportados por CSS, incluyendo: HEXA, RGB y HSL.  También soporta el control de alpha en los formatos RGB (rgba) y HSL (hsla).</p>
+
+<p>Cada color se presenta en los 3 formatos estándar de CSS mientras se ajusta; además,  basada en el color actual, se genera una paleta para HSL y HSV, así como para alpha. El recuadro "eyedropper" se puede cambiar entre los formatos HSL y HSC.</p>
+
+<p>{{ EmbedLiveSample('ColorPicker_Tool', '100%', '900') }}</p>
+
+<p> </p>
diff --git a/files/es/web/css/css_colors/herramienta_para_seleccionar_color/index.html b/files/es/web/css/css_colors/herramienta_para_seleccionar_color/index.html
deleted file mode 100644
index 7e7819542d..0000000000
--- a/files/es/web/css/css_colors/herramienta_para_seleccionar_color/index.html
+++ /dev/null
@@ -1,3220 +0,0 @@
----
-title: Herramienta para seleccionar color
-slug: Web/CSS/CSS_Colors/Herramienta_para_seleccionar_color
-tags:
-  - CSS
-  - Herramientas
-translation_of: Web/CSS/CSS_Colors/Color_picker_tool
----
-<div style="display: none;">
-<h2 id="ColorPicker_Tool" name="ColorPicker_Tool">ColorPicker tool</h2>
-
-<h3 id="HTML_Content">HTML Content</h3>
-
-<pre class="brush: html">    &lt;div id="container"&gt;
-        &lt;div id="palette" class="block"&gt;
-            &lt;div id="color-palette"&gt;&lt;/div&gt;
-            &lt;div id="color-info"&gt;
-                &lt;div class="title"&gt; CSS Color &lt;/div&gt;
-            &lt;/div&gt;
-        &lt;/div&gt;
-
-        &lt;div id="picker" class="block"&gt;
-            &lt;div class="ui-color-picker" data-topic="picker" data-mode="HSL"&gt;&lt;/div&gt;
-            &lt;div id="picker-samples" sample-id="master"&gt;&lt;/div&gt;
-            &lt;div id="controls"&gt;
-                &lt;div id="delete"&gt;
-                    &lt;div id="trash-can"&gt;&lt;/div&gt;
-                &lt;/div&gt;
-                &lt;div id="void-sample" class="icon"&gt;&lt;/div&gt;
-            &lt;/div&gt;
-        &lt;/div&gt;
-
-        &lt;div id="canvas" data-tutorial="drop"&gt;
-            &lt;div id="zindex" class="ui-input-slider" data-topic="z-index" data-info="z-index"
-                data-max="20" data-sensivity="10"&gt;&lt;/div&gt;
-        &lt;/div&gt;
-    &lt;/div&gt;
-
-</pre>
-
-<h3 id="CSS_Content">CSS Content</h3>
-
-<pre class="brush: css">/*
- * COLOR PICKER TOOL
- */
-
-.ui-color-picker {
-	width: 420px;
-	margin: 0;
-	border: 1px solid #DDD;
-	background-color: #FFF;
-	display: table;
-
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	-ms-user-select: none;
-	user-select: none;
-}
-
-.ui-color-picker .picking-area {
-	width: 198px;
-	height: 198px;
-	margin: 5px;
-	border: 1px solid #DDD;
-	position: relative;
-	float: left;
-	display: table;
-}
-
-.ui-color-picker .picking-area:hover {
-	cursor: default;
-}
-
-/* HSV format - Hue-Saturation-Value(Brightness) */
-.ui-color-picker .picking-area {
-	background: url('https://mdn.mozillademos.org/files/5707/picker_mask_200.png') center center;
-
-	background: -moz-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
-				-moz-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
-	background: -webkit-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
-				-webkit-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
-	background: -ms-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
-				-ms-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
-	background: -o-linear-gradient(bottom, #000 0%, rgba(0, 0, 0, 0) 100%),
-				-o-linear-gradient(left, #FFF 0%, rgba(255, 255, 255, 0) 100%);
-
-	background-color: #F00;
-}
-
-/* HSL format - Hue-Saturation-Lightness */
-.ui-color-picker[data-mode='HSL'] .picking-area {
-	background: -moz-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
-									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
-				-moz-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
-	background: -webkit-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
-									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
-				-webkit-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
-	background: -ms-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
-									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
-				-ms-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
-	background: -o-linear-gradient(top, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0) 50%,
-									hsla(0, 0%, 0%, 0) 50%, hsl(0, 0%, 0%) 100%),
-				-o-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsla(0, 0%, 50%, 0) 100%);
-	background-color: #F00;
-}
-
-.ui-color-picker .picker {
-	width: 10px;
-	height: 10px;
-	border-radius: 50%;
-	border: 1px solid #FFF;
-	position: absolute;
-	top: 45%;
-	left: 45%;
-}
-
-.ui-color-picker .picker:before {
-	width: 8px;
-	height: 8px;
-	content: "";
-	position: absolute;
-	border: 1px solid #999;
-	border-radius: 50%;
-}
-
-.ui-color-picker .hue,
-.ui-color-picker .alpha {
-	width: 198px;
-	height: 28px;
-	margin: 5px;
-	border: 1px solid #FFF;
-	float: left;
-}
-
-.ui-color-picker .hue {
-	background: url("https://mdn.mozillademos.org/files/5701/hue.png") center;
-	background: -moz-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
-				#00F 66.66%, #F0F 83.33%, #F00 100%);
-	background: -webkit-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
-				#00F 66.66%, #F0F 83.33%, #F00 100%);
-	background: -ms-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
-				#00F 66.66%, #F0F 83.33%, #F00 100%);
-	background: -o-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,
-				#00F 66.66%, #F0F 83.33%, #F00 100%);
-}
-
-.ui-color-picker .alpha {
-	border: 1px solid #CCC;
-	background: url("https://mdn.mozillademos.org/files/5705/alpha.png");
-}
-
-.ui-color-picker .alpha-mask {
-	width: 100%;
-	height: 100%;
-	background: url("https://mdn.mozillademos.org/files/6089/alpha_mask.png");
-}
-
-.ui-color-picker .slider-picker {
-	width: 2px;
-	height: 100%;
-	border: 1px solid #777;
-	background-color: #FFF;
-	position: relative;
-	top: -1px;
-}
-
-/* input HSV and RGB */
-
-.ui-color-picker .info {
-	width: 200px;
-	margin: 5px;
-	float: left;
-}
-
-.ui-color-picker .info * {
-	float: left;
-}
-
-.ui-color-picker .input {
-	width: 64px;
-	margin: 5px 2px;
-	float: left;
-}
-
-.ui-color-picker .input .name {
-	height: 20px;
-	width: 30px;
-	text-align: center;
-	font-size: 14px;
-	line-height: 18px;
-	float: left;
-}
-
-.ui-color-picker .input input {
-	width: 30px;
-	height: 18px;
-	margin: 0;
-	padding: 0;
-	border: 1px solid #DDD;
-	text-align: center;
-	float: right;
-
-	-moz-user-select: text;
-	-webkit-user-select: text;
-	-ms-user-select: text;
-}
-
-.ui-color-picker .input[data-topic="lightness"] {
-	display: none;
-}
-
-.ui-color-picker[data-mode='HSL'] .input[data-topic="value"] {
-	display: none;
-}
-
-.ui-color-picker[data-mode='HSL'] .input[data-topic="lightness"] {
-	display: block;
-}
-
-.ui-color-picker .input[data-topic="alpha"] {
-	margin-top: 10px;
-	width: 93px;
-}
-
-.ui-color-picker .input[data-topic="alpha"] &gt; .name {
-	width: 60px;
-}
-
-.ui-color-picker .input[data-topic="alpha"] &gt; input {
-	float: right;
-}
-
-.ui-color-picker .input[data-topic="hexa"] {
-	width: auto;
-	float: right;
-	margin: 6px 8px 0 0;
-}
-
-.ui-color-picker .input[data-topic="hexa"] &gt; .name {
-	display: none;
-}
-
-.ui-color-picker .input[data-topic="hexa"] &gt; input {
-	width: 90px;
-	height: 24px;
-	padding: 2px 0;
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-/* Preview color */
-.ui-color-picker .preview {
-	width: 95px;
-	height: 53px;
-	margin: 5px;
-	margin-top: 10px;
-	border: 1px solid #DDD;
-	background-image: url("https://mdn.mozillademos.org/files/5705/alpha.png");
-	float: left;
-	position: relative;
-}
-
-.ui-color-picker .preview:before {
-	height: 100%;
-	width: 50%;
-	left: 50%;
-	top: 0;
-	content: "";
-	background: #FFF;
-	position: absolute;
-	z-index: 1;
-}
-
-.ui-color-picker .preview-color {
-	width: 100%;
-	height: 100%;
-	background-color: rgba(255, 0, 0, 0.5);
-	position: absolute;
-	z-index: 1;
-}
-
-.ui-color-picker .switch_mode {
-	width: 10px;
-	height: 20px;
-	position: relative;
-	border-radius: 5px 0 0 5px;
-	border: 1px solid #DDD;
-	background-color: #EEE;
-	left: -12px;
-	top: -1px;
-	z-index: 1;
-	transition: all 0.5s;
-}
-
-.ui-color-picker .switch_mode:hover {
-	background-color: #CCC;
-	cursor: pointer;
-}
-
-/*
- * UI Component
- */
-
-.ui-input-slider {
-	height: 20px;
-	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
-	-moz-user-select: none;
-	user-select: none;
-}
-
-.ui-input-slider * {
-	float: left;
-	height: 100%;
-	line-height: 100%;
-}
-
-/* Input Slider */
-
-.ui-input-slider &gt; input {
-	margin: 0;
-	padding: 0;
-	width: 50px;
-	text-align: center;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-.ui-input-slider-info {
-	width: 90px;
-	padding: 0px 10px 0px 0px;
-	text-align: right;
-	text-transform: lowercase;
-}
-
-.ui-input-slider-left, .ui-input-slider-right {
-	width: 16px;
-	cursor: pointer;
-	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center left no-repeat;
-}
-
-.ui-input-slider-right {
-	background: url("https://mdn.mozillademos.org/files/5679/arrows.png") center right no-repeat;
-}
-
-.ui-input-slider-name {
-	width: 90px;
-	padding: 0 10px 0 0;
-	text-align: right;
-	text-transform: lowercase;
-}
-
-.ui-input-slider-btn-set {
-	width: 25px;
-	background-color: #2C9FC9;
-	border-radius: 5px;
-	color: #FFF;
-	font-weight: bold;
-	line-height: 14px;
-	text-align: center;
-}
-
-.ui-input-slider-btn-set:hover {
-	background-color: #379B4A;
-	cursor: pointer;
-}
-
-/*
- * COLOR PICKER TOOL
- */
-
-body {
-	max-width: 1000px;
-	margin: 0 auto;
-
-	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
-
-	box-shadow: 0 0 5px 0 #999;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	-ms-user-select: none;
-	user-select: none;
-
-}
-
-/**
- * Resize Handle
- */
-.resize-handle {
-	width: 10px;
-	height: 10px;
-	background: url('https://mdn.mozillademos.org/files/6083/resize.png') center center no-repeat;
-	position: absolute;
-	bottom: 0;
-	right: 0;
-}
-
-[data-resize='both']:hover {
-	cursor: nw-resize !important;
-}
-
-[data-resize='width']:hover {
-	cursor: w-resize !important;
-}
-
-[data-resize='height']:hover {
-	cursor: n-resize !important;
-}
-
-[data-hidden='true'] {
-	display: none;
-}
-
-[data-collapsed='true'] {
-	height: 0 !important;
-}
-
-.block {
-	display: table;
-}
-
-
-/**
- * 	Container
- */
-#container {
-	width: 100%;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-
-	display: table;
-}
-
-/**
- * 	Picker Zone
- */
-
-#picker {
-	padding: 10px;
-	width: 980px;
-}
-
-.ui-color-picker {
-	padding: 3px 5px;
-	float: left;
-	border-color: #FFF;
-}
-
-.ui-color-picker .switch_mode {
-	display: none;
-}
-
-.ui-color-picker .preview-color:hover {
-	cursor: move;
-}
-
-/**
- * Picker Container
- */
-
-#picker-samples {
-	width: 375px;
-	height: 114px;
-	max-height: 218px;
-	margin: 0 10px 0 30px;
-	overflow: hidden;
-	position: relative;
-	float: left;
-
-	transition: all 0.2s;
-}
-
-#picker-samples .sample {
-	width: 40px;
-	height: 40px;
-	margin: 5px;
-	border: 1px solid #DDD;
-	position: absolute;
-	float: left;
-	transition: all 0.2s;
-}
-
-#picker-samples .sample:hover {
-	cursor: pointer;
-	border-color: #BBB;
-	transform: scale(1.15);
-	border-radius: 3px;
-}
-
-#picker-samples .sample[data-active='true'] {
-	border-color: #999;
-}
-
-#picker-samples .sample[data-active='true']:after {
-	content: "";
-	position: absolute;
-	background: url('https://mdn.mozillademos.org/files/6065/arrow.png') center no-repeat;
-	width: 100%;
-	height: 12px;
-	top: -12px;
-	z-index: 2;
-}
-
-#picker-samples #add-icon {
-	width: 100%;
-	height: 100%;
-	position: relative;
-	box-shadow: inset 0px 0px 2px 0px #DDD;
-}
-
-#picker-samples #add-icon:hover {
-	cursor: pointer;
-	border-color: #DDD;
-	box-shadow: inset 0px 0px 5px 0px #CCC;
-}
-
-#picker-samples #add-icon:before,
-#picker-samples #add-icon:after {
-	content: "";
-	position: absolute;
-	background-color: #EEE;
-	box-shadow: 0 0 1px 0 #EEE;
-}
-
-#picker-samples #add-icon:before {
-	width: 70%;
-	height: 16%;
-	top: 42%;
-	left: 15%;
-}
-
-#picker-samples #add-icon:after {
-	width: 16%;
-	height: 70%;
-	top: 15%;
-	left: 42%;
-}
-
-#picker-samples #add-icon:hover:before,
-#picker-samples #add-icon:hover:after {
-	background-color: #DDD;
-	box-shadow: 0 0 1px 0 #DDD;
-}
-
-/**
- * 	Controls
- */
-
-#controls {
-	width: 110px;
-	padding: 10px;
-	float: right;
-}
-
-#controls #picker-switch {
-	text-align: center;
-	float: left;
-}
-
-#controls .icon {
-	width: 48px;
-	height: 48px;
-	margin: 10px 0;
-	background-repeat: no-repeat;
-	background-position: center;
-	border: 1px solid #DDD;
-	display: table;
-	float: left;
-}
-
-#controls .icon:hover {
-	cursor: pointer;
-}
-
-#controls .picker-icon {
-	background-image: url('https://mdn.mozillademos.org/files/6081/picker.png');
-}
-
-#controls #void-sample {
-	margin-right: 10px;
-	background-image: url('https://mdn.mozillademos.org/files/6087/void.png');
-	background-position: center left;
-}
-
-#controls #void-sample[data-active='true'] {
-	border-color: #CCC;
-	background-position: center right;
-}
-
-#controls .switch {
-	width: 106px;
-	padding: 1px;
-	border: 1px solid #CCC;
-	font-size: 14px;
-	text-align: center;
-	line-height: 24px;
-	overflow: hidden;
-	float: left;
-}
-
-#controls .switch:hover {
-	cursor: pointer;
-}
-
-#controls .switch &gt; * {
-	width: 50%;
-	padding: 2px 0;
-	background-color: #EEE;
-	float: left;
-}
-
-#controls .switch [data-active='true'] {
-	color: #FFF;
-	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
-	background-color: #777;
-}
-
-/**
- * 	Trash Can
- */
-
-#delete {
-	width: 100%;
-	height: 94px;
-	background-color: #DDD;
-	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
-	background-repeat: repeat;
-
-	text-align: center;
-	color: #777;
-
-	position: relative;
-	float: right;
-}
-
-#delete #trash-can {
-	width: 80%;
-	height: 80%;
-	border: 2px dashed #FFF;
-	border-radius: 5px;
-	background: url('https://mdn.mozillademos.org/files/6085/trash-can.png') no-repeat center;
-
-	position: absolute;
-	top: 10%;
-	left: 10%;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-
-	transition: all 0.2s;
-}
-
-#delete[drag-state='enter'] {
-	background-color: #999;
-}
-
-/**
- * 	Color Theme
- */
-
-#color-theme {
-	margin: 0 8px 0 0;
-	border: 1px solid #EEE;
-	display: inline-block;
-	float: right;
-}
-
-#color-theme .box {
-	width: 80px;
-	height: 92px;
-	float: left;
-}
-
-/**
- * Color info box
- */
-#color-info {
-	width: 360px;
-	float: left;
-}
-
-#color-info .title {
-	width: 100%;
-	padding: 15px;
-	font-size: 18px;
-	text-align: center;
-	background-image: url('https://mdn.mozillademos.org/files/6071/color-wheel.png');
-	background-repeat:no-repeat;
-	background-position: center left 30%;
-}
-
-#color-info .copy-container {
-	position: absolute;
-	top: -100%;
-}
-
-#color-info .property {
-	min-width: 280px;
-	height: 30px;
-	margin: 10px 0;
-	text-align: center;
-	line-height: 30px;
-}
-
-#color-info .property &gt; * {
-	float: left;
-}
-
-#color-info .property .type {
-	width: 60px;
-	height: 100%;
-	padding: 0 16px 0 0;
-	text-align: right;
-}
-
-#color-info .property .value {
-	width: 200px;
-	height: 100%;
-	padding: 0 10px;
-	font-family: "Segoe UI", Arial, Helvetica, sans-serif;
-	font-size: 16px;
-	color: #777;
-	text-align: center;
-	background-color: #FFF;
-	border: none;
-}
-
-#color-info .property .value:hover {
-	color: #37994A;
-}
-
-#color-info .property .value:hover + .copy {
-	background-position: center right;
-}
-
-#color-info .property .copy {
-	width: 24px;
-	height: 100%;
-	padding: 0 5px;
-	background-color: #FFF;
-	background-image: url('https://mdn.mozillademos.org/files/6073/copy.png');
-	background-repeat: no-repeat;
-	background-position: center left;
-	border-left: 1px solid #EEE;
-	text-align: right;
-	float: left;
-}
-
-#color-info .property .copy:hover {
-	background-position: center right;
-}
-
-
-/**
- * 	Color Palette
- */
-
-#palette {
-	width: 1000px;
-	padding: 10px 0;
-	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
-	background-repeat: repeat;
-	background-color: #EEE;
-	color: #777;
-
-	-moz-box-sizing: border-box;
-	-webkit-box-sizing: border-box;
-	box-sizing: border-box;
-}
-
-#color-palette {
-	width: 640px;
-	font-family: Arial, Helvetica, sans-serif;
-	color: #777;
-	float: left;
-}
-
-#color-palette .container {
-	width: 100%;
-	height: 50px;
-	line-height: 50px;
-	overflow: hidden;
-	float: left;
-	transition: all 0.5s;
-}
-
-#color-palette .container &gt; * {
-	float: left;
-}
-
-#color-palette .title {
-	width: 100px;
-	padding: 0 10px;
-	text-align: right;
-	line-height: inherit;
-}
-
-#color-palette .palette {
-	width: 456px;
-	height: 38px;
-	margin: 3px;
-	padding: 3px;
-	display: table;
-	background-color: #FFF;
-}
-
-#color-palette .palette .sample {
-	width: 30px;
-	height: 30px;
-	margin: 3px;
-	position: relative;
-	border: 1px solid #DDD;
-	float: left;
-	transition: all 0.2s;
-}
-
-#color-palette .palette .sample:hover {
-	cursor: pointer;
-	border-color: #BBB;
-	transform: scale(1.15);
-	border-radius: 3px;
-}
-
-#color-palette .controls {
-}
-
-#color-palette .controls &gt; * {
-	float: left;
-}
-
-#color-palette .controls &gt; *:hover {
-	cursor: pointer;
-}
-
-#color-palette .controls .lock {
-	width: 24px;
-	height: 24px;
-	margin: 10px;
-	padding: 3px;
-	background-image: url('https://mdn.mozillademos.org/files/6077/lock.png');
-	background-repeat: no-repeat;
-	background-position: bottom right;
-}
-
-#color-palette .controls .lock:hover {
-	/*background-image: url('images/unlocked-hover.png');*/
-	background-position: bottom left;
-}
-
-#color-palette .controls .lock[locked-state='true'] {
-	/*background-image: url('images/locked.png');*/
-	background-position: top left ;
-}
-
-#color-palette .controls .lock[locked-state='true']:hover {
-	/*background-image: url('images/lock-hover.png');*/
-	background-position: top right;
-}
-
-/**
- * Canvas
- */
-
-#canvas {
-	width: 100%;
-	height: 300px;
-	min-height: 250px;
-	border-top: 1px solid #DDD;
-	background-image: url('https://mdn.mozillademos.org/files/6025/grain.png');
-	background-repeat: repeat;
-	position: relative;
-	float: left;
-}
-
-#canvas[data-tutorial='drop'] {
-	text-align: center;
-	font-size: 30px;
-	color: #777;
-}
-
-#canvas[data-tutorial='drop']:before {
-	content: "Drop colors here to compare";
-	width: 40%;
-	padding: 30px 9% 70px 11%;
-
-	background-image: url('https://mdn.mozillademos.org/files/6075/drop.png');
-	background-repeat: no-repeat;
-	background-position: left 35px top 60%;
-
-	text-align: right;
-
-	border: 3px dashed rgb(221, 221, 221);
-	border-radius: 15px;
-
-	position: absolute;
-	top: 50px;
-	left: 20%;
-}
-
-#canvas[data-tutorial='drop']:after {
-	content: "adjust, change or modify";
-	width: 40%;
-	font-size: 24px;
-	position: absolute;
-	top: 130px;
-	left: 32%;
-	z-index: 2;
-}
-
-#canvas [data-tutorial='dblclick'] {
-	background-color: #999 !important;
-}
-
-#canvas [data-tutorial='dblclick']:before {
-	content: "double click to activate";
-	width: 80px;
-	color: #FFF;
-	position: absolute;
-	top: 10%;
-	left: 20%;
-	z-index: 2;
-}
-
-#canvas .sample {
-	width: 100px;
-	height: 100px;
-	min-width: 20px;
-	min-height: 20px;
-	position: absolute;
-	border: 1px solid rgba(255, 255, 255, 0.3);
-}
-
-#canvas .sample:hover {
-	cursor: move;
-}
-
-#canvas .sample[data-active='true']:after {
-	content: "";
-	position: absolute;
-	background: url('https://mdn.mozillademos.org/files/6065/arrow.png') center no-repeat;
-	width: 100%;
-	height: 12px;
-	top: -12px;
-	z-index: 2;
-}
-
-#canvas .sample:hover &gt; * {
-	cursor: pointer;
-	display: block !important;
-}
-
-#canvas .sample .resize-handle {
-	display: none;
-}
-
-#canvas .sample .pick {
-	width: 10px;
-	height: 10px;
-	margin: 5px;
-	background: url('https://mdn.mozillademos.org/files/6079/pick.png') center no-repeat;
-	position: absolute;
-	top: 0;
-	left: 0;
-	display: none;
-}
-
-#canvas .sample .delete {
-	width: 10px;
-	height: 10px;
-	margin: 5px;
-	background: url('https://mdn.mozillademos.org/files/6069/close.png') center no-repeat;
-	position: absolute;
-	top: 0;
-	right: 0;
-	display: none;
-}
-
-
-/**
- * Canvas controls
- */
-
-#canvas .toggle-bg {
-	width: 16px;
-	height: 16px;
-	margin: 5px;
-	background: url("images/canvas-controls.png") center left no-repeat;
-	position: absolute;
-	top: 0;
-	right: 0;
-}
-
-#canvas .toggle-bg:hover {
-	cursor: pointer;
-}
-
-#canvas[data-bg='true'] {
-	background: none;
-}
-
-#canvas[data-bg='true'] .toggle-bg {
-	background: url('https://mdn.mozillademos.org/files/6067/canvas-controls.png') center right no-repeat;
-}
-
-#zindex {
-	height: 20px;
-	margin: 5px;
-	font-size: 16px;
-	position: absolute;
-	opacity: 0;
-	top: -10000px;
-	left: 0;
-	color: #777;
-	float: left;
-	transition: opacity 1s;
-}
-
-#zindex input {
-	border: 1px solid #DDD;
-	font-size: 16px;
-	color: #777;
-}
-
-#zindex .ui-input-slider-info {
-	width: 60px;
-}
-
-#zindex[data-active='true'] {
-	top: 0;
-	opacity: 1;
-}
-
-</pre>
-
-<h3 id="JavaScript_Content">JavaScript Content</h3>
-
-<pre class="brush: js">'use strict';
-
-var UIColorPicker = (function UIColorPicker() {
-
-	function getElemById(id) {
-		return document.getElementById(id);
-	}
-
-	var subscribers = [];
-	var pickers = [];
-
-	/**
-	 * RGBA Color class
-	 *
-	 * HSV/HSB and HSL (hue, saturation, value / brightness, lightness)
-	 * @param hue			0-360
-	 * @param saturation	0-100
-	 * @param value 		0-100
-	 * @param lightness		0-100
-	 */
-
-	function Color(color) {
-
-		if(color instanceof Color === true) {
-			this.copy(color);
-			return;
-		}
-
-		this.r = 0;
-		this.g = 0;
-		this.b = 0;
-		this.a = 1;
-		this.hue = 0;
-		this.saturation = 0;
-		this.value = 0;
-		this.lightness = 0;
-		this.format = 'HSV';
-	}
-
-	function RGBColor(r, g, b) {
-		var color = new Color();
-		color.setRGBA(r, g, b, 1);
-		return color;
-	}
-
-	function RGBAColor(r, g, b, a) {
-		var color = new Color();
-		color.setRGBA(r, g, b, a);
-		return color;
-	}
-
-	function HSVColor(h, s, v) {
-		var color = new Color();
-		color.setHSV(h, s, v);
-		return color;
-	}
-
-	function HSVAColor(h, s, v, a) {
-		var color = new Color();
-		color.setHSV(h, s, v);
-		color.a = a;
-		return color;
-	}
-
-	function HSLColor(h, s, l) {
-		var color = new Color();
-		color.setHSL(h, s, l);
-		return color;
-	}
-
-	function HSLAColor(h, s, l, a) {
-		var color = new Color();
-		color.setHSL(h, s, l);
-		color.a = a;
-		return color;
-	}
-
-	Color.prototype.copy = function copy(obj) {
-		if(obj instanceof Color !== true) {
-			console.log('Typeof parameter not Color');
-			return;
-		}
-
-		this.r = obj.r;
-		this.g = obj.g;
-		this.b = obj.b;
-		this.a = obj.a;
-		this.hue = obj.hue;
-		this.saturation = obj.saturation;
-		this.value = obj.value;
-		this.format = '' + obj.format;
-		this.lightness = obj.lightness;
-	};
-
-	Color.prototype.setFormat = function setFormat(format) {
-		if (format === 'HSV')
-			this.format = 'HSV';
-		if (format === 'HSL')
-			this.format = 'HSL';
-	};
-
-	/*========== Methods to set Color Properties ==========*/
-
-	Color.prototype.isValidRGBValue = function isValidRGBValue(value) {
-		return (typeof(value) === 'number' &amp;&amp; isNaN(value) === false &amp;&amp;
-			value &gt;= 0 &amp;&amp; value &lt;= 255);
-	};
-
-	Color.prototype.setRGBA = function setRGBA(red, green, blue, alpha) {
-		if (this.isValidRGBValue(red) === false ||
-			this.isValidRGBValue(green) === false ||
-			this.isValidRGBValue(blue) === false)
-			return;
-
-			this.r = red | 0;
-			this.g = green | 0;
-			this.b = blue | 0;
-
-		if (this.isValidRGBValue(alpha) === true)
-			this.a = alpha | 0;
-	};
-
-	Color.prototype.setByName = function setByName(name, value) {
-		if (name === 'r' || name === 'g' || name === 'b') {
-			if(this.isValidRGBValue(value) === false)
-				return;
-
-			this[name] = value;
-			this.updateHSX();
-		}
-	};
-
-	Color.prototype.setHSV = function setHSV(hue, saturation, value) {
-		this.hue = hue;
-		this.saturation = saturation;
-		this.value = value;
-		this.HSVtoRGB();
-	};
-
-	Color.prototype.setHSL = function setHSL(hue, saturation, lightness) {
-		this.hue = hue;
-		this.saturation = saturation;
-		this.lightness = lightness;
-		this.HSLtoRGB();
-	};
-
-	Color.prototype.setHue = function setHue(value) {
-		if (typeof(value) !== 'number' || isNaN(value) === true ||
-			value &lt; 0 || value &gt; 359)
-			return;
-		this.hue = value;
-		this.updateRGB();
-	};
-
-	Color.prototype.setSaturation = function setSaturation(value) {
-		if (typeof(value) !== 'number' || isNaN(value) === true ||
-			value &lt; 0 || value &gt; 100)
-			return;
-		this.saturation = value;
-		this.updateRGB();
-	};
-
-	Color.prototype.setValue = function setValue(value) {
-		if (typeof(value) !== 'number' || isNaN(value) === true ||
-			value &lt; 0 || value &gt; 100)
-			return;
-		this.value = value;
-		this.HSVtoRGB();
-	};
-
-	Color.prototype.setLightness = function setLightness(value) {
-		if (typeof(value) !== 'number' || isNaN(value) === true ||
-			value &lt; 0 || value &gt; 100)
-			return;
-		this.lightness = value;
-		this.HSLtoRGB();
-	};
-
-	Color.prototype.setHexa = function setHexa(value) {
-		var valid  = /(^#{0,1}[0-9A-F]{6}$)|(^#{0,1}[0-9A-F]{3}$)/i.test(value);
-
-		if (valid !== true)
-			return;
-
-		if (value[0] === '#')
-			value = value.slice(1, value.length);
-
-		if (value.length === 3)
-			value = value.replace(/([0-9A-F])([0-9A-F])([0-9A-F])/i,'$1$1$2$2$3$3');
-
-		this.r = parseInt(value.substr(0, 2), 16);
-		this.g = parseInt(value.substr(2, 2), 16);
-		this.b = parseInt(value.substr(4, 2), 16);
-
-		this.alpha	= 1;
-		this.RGBtoHSV();
-	};
-
-	/*========== Conversion Methods ==========*/
-
-	Color.prototype.convertToHSL = function convertToHSL() {
-		if (this.format === 'HSL')
-			return;
-
-		this.setFormat('HSL');
-		this.RGBtoHSL();
-	};
-
-	Color.prototype.convertToHSV = function convertToHSV() {
-		if (this.format === 'HSV')
-			return;
-
-		this.setFormat('HSV');
-		this.RGBtoHSV();
-	};
-
-	/*========== Update Methods ==========*/
-
-	Color.prototype.updateRGB = function updateRGB() {
-		if (this.format === 'HSV') {
-			this.HSVtoRGB();
-			return;
-		}
-
-		if (this.format === 'HSL') {
-			this.HSLtoRGB();
-			return;
-		}
-	};
-
-	Color.prototype.updateHSX = function updateHSX() {
-		if (this.format === 'HSV') {
-			this.RGBtoHSV();
-			return;
-		}
-
-		if (this.format === 'HSL') {
-			this.RGBtoHSL();
-			return;
-		}
-	};
-
-	Color.prototype.HSVtoRGB = function HSVtoRGB() {
-		var sat = this.saturation / 100;
-		var value = this.value / 100;
-		var C = sat * value;
-		var H = this.hue / 60;
-		var X = C * (1 - Math.abs(H % 2 - 1));
-		var m = value - C;
-		var precision = 255;
-
-		C = (C + m) * precision | 0;
-		X = (X + m) * precision | 0;
-		m = m * precision | 0;
-
-		if (H &gt;= 0 &amp;&amp; H &lt; 1) {	this.setRGBA(C, X, m);	return; }
-		if (H &gt;= 1 &amp;&amp; H &lt; 2) {	this.setRGBA(X, C, m);	return; }
-		if (H &gt;= 2 &amp;&amp; H &lt; 3) {	this.setRGBA(m, C, X);	return; }
-		if (H &gt;= 3 &amp;&amp; H &lt; 4) {	this.setRGBA(m, X, C);	return; }
-		if (H &gt;= 4 &amp;&amp; H &lt; 5) {	this.setRGBA(X, m, C);	return; }
-		if (H &gt;= 5 &amp;&amp; H &lt; 6) {	this.setRGBA(C, m, X);	return; }
-	};
-
-	Color.prototype.HSLtoRGB = function HSLtoRGB() {
-		var sat = this.saturation / 100;
-		var light = this.lightness / 100;
-		var C = sat * (1 - Math.abs(2 * light - 1));
-		var H = this.hue / 60;
-		var X = C * (1 - Math.abs(H % 2 - 1));
-		var m = light - C/2;
-		var precision = 255;
-
-		C = (C + m) * precision | 0;
-		X = (X + m) * precision | 0;
-		m = m * precision | 0;
-
-		if (H &gt;= 0 &amp;&amp; H &lt; 1) {	this.setRGBA(C, X, m);	return; }
-		if (H &gt;= 1 &amp;&amp; H &lt; 2) {	this.setRGBA(X, C, m);	return; }
-		if (H &gt;= 2 &amp;&amp; H &lt; 3) {	this.setRGBA(m, C, X);	return; }
-		if (H &gt;= 3 &amp;&amp; H &lt; 4) {	this.setRGBA(m, X, C);	return; }
-		if (H &gt;= 4 &amp;&amp; H &lt; 5) {	this.setRGBA(X, m, C);	return; }
-		if (H &gt;= 5 &amp;&amp; H &lt; 6) {	this.setRGBA(C, m, X);	return; }
-	};
-
-	Color.prototype.RGBtoHSV = function RGBtoHSV() {
-		var red		= this.r / 255;
-		var green	= this.g / 255;
-		var blue	= this.b / 255;
-
-		var cmax = Math.max(red, green, blue);
-		var cmin = Math.min(red, green, blue);
-		var delta = cmax - cmin;
-		var hue = 0;
-		var saturation = 0;
-
-		if (delta) {
-			if (cmax === red ) { hue = ((green - blue) / delta); }
-			if (cmax === green ) { hue = 2 + (blue - red) / delta; }
-			if (cmax === blue ) { hue = 4 + (red - green) / delta; }
-			if (cmax) saturation = delta / cmax;
-		}
-
-		this.hue = 60 * hue | 0;
-		if (this.hue &lt; 0) this.hue += 360;
-		this.saturation = (saturation * 100) | 0;
-		this.value = (cmax * 100) | 0;
-	};
-
-	Color.prototype.RGBtoHSL = function RGBtoHSL() {
-		var red		= this.r / 255;
-		var green	= this.g / 255;
-		var blue	= this.b / 255;
-
-		var cmax = Math.max(red, green, blue);
-		var cmin = Math.min(red, green, blue);
-		var delta = cmax - cmin;
-		var hue = 0;
-		var saturation = 0;
-		var lightness = (cmax + cmin) / 2;
-		var X = (1 - Math.abs(2 * lightness - 1));
-
-		if (delta) {
-			if (cmax === red ) { hue = ((green - blue) / delta); }
-			if (cmax === green ) { hue = 2 + (blue - red) / delta; }
-			if (cmax === blue ) { hue = 4 + (red - green) / delta; }
-			if (cmax) saturation = delta / X;
-		}
-
-		this.hue = 60 * hue | 0;
-		if (this.hue &lt; 0) this.hue += 360;
-		this.saturation = (saturation * 100) | 0;
-		this.lightness = (lightness * 100) | 0;
-	};
-
-	/*========== Get Methods ==========*/
-
-	Color.prototype.getHexa = function getHexa() {
-		var r = this.r.toString(16);
-		var g = this.g.toString(16);
-		var b = this.b.toString(16);
-		if (this.r &lt; 16) r = '0' + r;
-		if (this.g &lt; 16) g = '0' + g;
-		if (this.b &lt; 16) b = '0' + b;
-		var value = '#' + r + g + b;
-		return value.toUpperCase();
-	};
-
-	Color.prototype.getRGBA = function getRGBA() {
-
-		var rgb = '(' + this.r + ', ' + this.g + ', ' + this.b;
-		var a = '';
-		var v = '';
-		var x = parseFloat(this.a);
-		if (x !== 1) {
-			a = 'a';
-			v = ', ' + x;
-		}
-
-		var value = 'rgb' + a + rgb + v + ')';
-		return value;
-	};
-
-	Color.prototype.getHSLA = function getHSLA() {
-		if (this.format === 'HSV') {
-			var color = new Color(this);
-			color.setFormat('HSL');
-			color.updateHSX();
-			return color.getHSLA();
-		}
-
-		var a = '';
-		var v = '';
-		var hsl = '(' + this.hue + ', ' + this.saturation + '%, ' + this.lightness +'%';
-		var x = parseFloat(this.a);
-		if (x !== 1) {
-			a = 'a';
-			v = ', ' + x;
-		}
-
-		var value = 'hsl' + a + hsl + v + ')';
-		return value;
-	};
-
-	Color.prototype.getColor = function getColor() {
-		if (this.a | 0 === 1)
-			return this.getHexa();
-		return this.getRGBA();
-	};
-
-	/*=======================================================================*/
-	/*=======================================================================*/
-
-	/*========== Capture Mouse Movement ==========*/
-
-	var setMouseTracking = function setMouseTracking(elem, callback) {
-		elem.addEventListener('mousedown', function(e) {
-			callback(e);
-			document.addEventListener('mousemove', callback);
-		});
-
-		document.addEventListener('mouseup', function(e) {
-			document.removeEventListener('mousemove', callback);
-		});
-	};
-
-	/*====================*/
-	// Color Picker Class
-	/*====================*/
-
-	function ColorPicker(node) {
-		this.color = new Color();
-		this.node = node;
-		this.subscribers = [];
-
-		var type = this.node.getAttribute('data-mode');
-		var topic = this.node.getAttribute('data-topic');
-
-		this.topic = topic;
-		this.picker_mode = (type === 'HSL') ? 'HSL' : 'HSV';
-		this.color.setFormat(this.picker_mode);
-
-		this.createPickingArea();
-		this.createHueArea();
-
-		this.newInputComponent('H', 'hue', this.inputChangeHue.bind(this));
-		this.newInputComponent('S', 'saturation', this.inputChangeSaturation.bind(this));
-		this.newInputComponent('V', 'value', this.inputChangeValue.bind(this));
-		this.newInputComponent('L', 'lightness', this.inputChangeLightness.bind(this));
-
-		this.createAlphaArea();
-
-		this.newInputComponent('R', 'red', this.inputChangeRed.bind(this));
-		this.newInputComponent('G', 'green', this.inputChangeGreen.bind(this));
-		this.newInputComponent('B', 'blue', this.inputChangeBlue.bind(this));
-
-		this.createPreviewBox();
-		this.createChangeModeButton();
-
-		this.newInputComponent('alpha', 'alpha', this.inputChangeAlpha.bind(this));
-		this.newInputComponent('hexa', 'hexa', this.inputChangeHexa.bind(this));
-
-		this.setColor(this.color);
-		pickers[topic] = this;
-	}
-
-	/*************************************************************************/
-	//				Function for generating the color-picker
-	/*************************************************************************/
-
-	ColorPicker.prototype.createPickingArea = function createPickingArea() {
-		var area = document.createElement('div');
-		var picker = document.createElement('div');
-
-		area.className = 'picking-area';
-		picker.className = 'picker';
-
-		this.picking_area = area;
-		this.color_picker = picker;
-		setMouseTracking(area, this.updateColor.bind(this));
-
-		area.appendChild(picker);
-		this.node.appendChild(area);
-	};
-
-	ColorPicker.prototype.createHueArea = function createHueArea() {
-		var area = document.createElement('div');
-		var picker = document.createElement('div');
-
-		area.className = 'hue';
-		picker.className ='slider-picker';
-
-		this.hue_area = area;
-		this.hue_picker = picker;
-		setMouseTracking(area, this.updateHueSlider.bind(this));
-
-		area.appendChild(picker);
-		this.node.appendChild(area);
-	};
-
-	ColorPicker.prototype.createAlphaArea = function createAlphaArea() {
-		var area = document.createElement('div');
-		var mask = document.createElement('div');
-		var picker = document.createElement('div');
-
-		area.className = 'alpha';
-		mask.className = 'alpha-mask';
-		picker.className = 'slider-picker';
-
-		this.alpha_area = area;
-		this.alpha_mask = mask;
-		this.alpha_picker = picker;
-		setMouseTracking(area, this.updateAlphaSlider.bind(this));
-
-		area.appendChild(mask);
-		mask.appendChild(picker);
-		this.node.appendChild(area);
-	};
-
-	ColorPicker.prototype.createPreviewBox = function createPreviewBox(e) {
-		var preview_box = document.createElement('div');
-		var preview_color = document.createElement('div');
-
-		preview_box.className = 'preview';
-		preview_color.className = 'preview-color';
-
-		this.preview_color = preview_color;
-
-		preview_box.appendChild(preview_color);
-		this.node.appendChild(preview_box);
-	};
-
-	ColorPicker.prototype.newInputComponent = function newInputComponent(title, topic, onChangeFunc) {
-		var wrapper = document.createElement('div');
-		var input = document.createElement('input');
-		var info = document.createElement('span');
-
-		wrapper.className = 'input';
-		wrapper.setAttribute('data-topic', topic);
-		info.textContent = title;
-		info.className = 'name';
-		input.setAttribute('type', 'text');
-
-		wrapper.appendChild(info);
-		wrapper.appendChild(input);
-		this.node.appendChild(wrapper);
-
-		input.addEventListener('change', onChangeFunc);
-		input.addEventListener('click', function() {
-			this.select();
-		});
-
-		this.subscribe(topic, function(value) {
-			input.value = value;
-		});
-	};
-
-	ColorPicker.prototype.createChangeModeButton = function createChangeModeButton() {
-
-		var button = document.createElement('div');
-		button.className = 'switch_mode';
-		button.addEventListener('click', function() {
-			if (this.picker_mode === 'HSV')
-				this.setPickerMode('HSL');
-			else
-				this.setPickerMode('HSV');
-
-		}.bind(this));
-
-		this.node.appendChild(button);
-	};
-
-	/*************************************************************************/
-	//					Updates properties of UI elements
-	/*************************************************************************/
-
-	ColorPicker.prototype.updateColor = function updateColor(e) {
-		var x = e.pageX - this.picking_area.offsetLeft;
-		var y = e.pageY - this.picking_area.offsetTop;
-		var picker_offset = 5;
-
-		// width and height should be the same
-		var size = this.picking_area.clientWidth;
-
-		if (x &gt; size) x = size;
-		if (y &gt; size) y = size;
-		if (x &lt; 0) x = 0;
-		if (y &lt; 0) y = 0;
-
-		var value = 100 - (y * 100 / size) | 0;
-		var saturation = x * 100 / size | 0;
-
-		if (this.picker_mode === 'HSV')
-			this.color.setHSV(this.color.hue, saturation, value);
-		if (this.picker_mode === 'HSL')
-			this.color.setHSL(this.color.hue, saturation, value);
-
-		this.color_picker.style.left = x - picker_offset + 'px';
-		this.color_picker.style.top = y - picker_offset + 'px';
-
-		this.updateAlphaGradient();
-		this.updatePreviewColor();
-
-		this.notify('value', value);
-		this.notify('lightness', value);
-		this.notify('saturation', saturation);
-
-		this.notify('red', this.color.r);
-		this.notify('green', this.color.g);
-		this.notify('blue', this.color.b);
-		this.notify('hexa', this.color.getHexa());
-
-		notify(this.topic, this.color);
-	};
-
-	ColorPicker.prototype.updateHueSlider = function updateHueSlider(e) {
-		var x = e.pageX - this.hue_area.offsetLeft;
-		var width = this.hue_area.clientWidth;
-
-		if (x &lt; 0) x = 0;
-		if (x &gt; width) x = width;
-
-		// TODO 360 =&gt; 359
-		var hue = ((359 * x) / width) | 0;
-		// if (hue === 360) hue = 359;
-
-		this.updateSliderPosition(this.hue_picker, x);
-		this.setHue(hue);
-	};
-
-	ColorPicker.prototype.updateAlphaSlider = function updateAlphaSlider(e) {
-		var x = e.pageX - this.alpha_area.offsetLeft;
-		var width = this.alpha_area.clientWidth;
-
-		if (x &lt; 0) x = 0;
-		if (x &gt; width) x = width;
-
-		this.color.a = (x / width).toFixed(2);
-
-		this.updateSliderPosition(this.alpha_picker, x);
-		this.updatePreviewColor();
-
-		this.notify('alpha', this.color.a);
-		notify(this.topic, this.color);
-	};
-
-	ColorPicker.prototype.setHue = function setHue(value) {
-		this.color.setHue(value);
-
-		this.updatePickerBackground();
-		this.updateAlphaGradient();
-		this.updatePreviewColor();
-
-		this.notify('red', this.color.r);
-		this.notify('green', this.color.g);
-		this.notify('blue', this.color.b);
-		this.notify('hexa', this.color.getHexa());
-		this.notify('hue', this.color.hue);
-
-		notify(this.topic, this.color);
-	};
-
-	// Updates when one of Saturation/Value/Lightness changes
-	ColorPicker.prototype.updateSLV = function updateSLV() {
-		this.updatePickerPosition();
-		this.updateAlphaGradient();
-		this.updatePreviewColor();
-
-		this.notify('red', this.color.r);
-		this.notify('green', this.color.g);
-		this.notify('blue', this.color.b);
-		this.notify('hexa', this.color.getHexa());
-
-		notify(this.topic, this.color);
-	};
-
-	/*************************************************************************/
-	//				Update positions of various UI elements
-	/*************************************************************************/
-
-	ColorPicker.prototype.updatePickerPosition = function updatePickerPosition() {
-		var size = this.picking_area.clientWidth;
-		var value = 0;
-		var offset = 5;
-
-		if (this.picker_mode === 'HSV')
-			value = this.color.value;
-		if (this.picker_mode === 'HSL')
-			value = this.color.lightness;
-
-		var x = (this.color.saturation * size / 100) | 0;
-		var y = size - (value * size / 100) | 0;
-
-		this.color_picker.style.left = x - offset + 'px';
-		this.color_picker.style.top = y - offset + 'px';
-	};
-
-	ColorPicker.prototype.updateSliderPosition = function updateSliderPosition(elem, pos) {
-		elem.style.left = Math.max(pos - 3, -2) + 'px';
-	};
-
-	ColorPicker.prototype.updateHuePicker = function updateHuePicker() {
-		var size = this.hue_area.clientWidth;
-		var offset = 1;
-		var pos = (this.color.hue * size / 360 ) | 0;
-		this.hue_picker.style.left = pos - offset + 'px';
-	};
-
-	ColorPicker.prototype.updateAlphaPicker = function updateAlphaPicker() {
-		var size = this.alpha_area.clientWidth;
-		var offset = 1;
-		var pos = (this.color.a * size) | 0;
-		this.alpha_picker.style.left = pos - offset + 'px';
-	};
-
-	/*************************************************************************/
-	//						Update background colors
-	/*************************************************************************/
-
-	ColorPicker.prototype.updatePickerBackground = function updatePickerBackground() {
-		var nc = new Color(this.color);
-		nc.setHSV(nc.hue, 100, 100);
-		this.picking_area.style.backgroundColor = nc.getHexa();
-	};
-
-	ColorPicker.prototype.updateAlphaGradient = function updateAlphaGradient() {
-		this.alpha_mask.style.backgroundColor = this.color.getHexa();
-	};
-
-	ColorPicker.prototype.updatePreviewColor = function updatePreviewColor() {
-		this.preview_color.style.backgroundColor = this.color.getColor();
-	};
-
-	/*************************************************************************/
-	//						Update input elements
-	/*************************************************************************/
-
-	ColorPicker.prototype.inputChangeHue = function inputChangeHue(e) {
-		var value = parseInt(e.target.value);
-		this.setHue(value);
-		this.updateHuePicker();
-	};
-
-	ColorPicker.prototype.inputChangeSaturation = function inputChangeSaturation(e) {
-		var value = parseInt(e.target.value);
-		this.color.setSaturation(value);
-		e.target.value = this.color.saturation;
-		this.updateSLV();
-	};
-
-	ColorPicker.prototype.inputChangeValue = function inputChangeValue(e) {
-		var value = parseInt(e.target.value);
-		this.color.setValue(value);
-		e.target.value = this.color.value;
-		this.updateSLV();
-	};
-
-	ColorPicker.prototype.inputChangeLightness = function inputChangeLightness(e) {
-		var value = parseInt(e.target.value);
-		this.color.setLightness(value);
-		e.target.value = this.color.lightness;
-		this.updateSLV();
-	};
-
-	ColorPicker.prototype.inputChangeRed = function inputChangeRed(e) {
-		var value = parseInt(e.target.value);
-		this.color.setByName('r', value);
-		e.target.value = this.color.r;
-		this.setColor(this.color);
-	};
-
-	ColorPicker.prototype.inputChangeGreen = function inputChangeGreen(e) {
-		var value = parseInt(e.target.value);
-		this.color.setByName('g', value);
-		e.target.value = this.color.g;
-		this.setColor(this.color);
-	};
-
-	ColorPicker.prototype.inputChangeBlue = function inputChangeBlue(e) {
-		var value = parseInt(e.target.value);
-		this.color.setByName('b', value);
-		e.target.value = this.color.b;
-		this.setColor(this.color);
-	};
-
-	ColorPicker.prototype.inputChangeAlpha = function inputChangeAlpha(e) {
-		var value = parseFloat(e.target.value);
-
-		if (typeof value === 'number' &amp;&amp; isNaN(value) === false &amp;&amp;
-			value &gt;= 0 &amp;&amp; value &lt;= 1)
-			this.color.a = value.toFixed(2);
-
-		e.target.value = this.color.a;
-		this.updateAlphaPicker();
-	};
-
-	ColorPicker.prototype.inputChangeHexa = function inputChangeHexa(e) {
-		var value = e.target.value;
-		this.color.setHexa(value);
-		this.setColor(this.color);
-	};
-
-	/*************************************************************************/
-	//							Internal Pub/Sub
-	/*************************************************************************/
-
-	ColorPicker.prototype.subscribe = function subscribe(topic, callback) {
-		this.subscribers[topic] = callback;
-	};
-
-	ColorPicker.prototype.notify = function notify(topic, value) {
-		if (this.subscribers[topic])
-			this.subscribers[topic](value);
-	};
-
-	/*************************************************************************/
-	//							Set Picker Properties
-	/*************************************************************************/
-
-	ColorPicker.prototype.setColor = function setColor(color) {
-		if(color instanceof Color !== true) {
-			console.log('Typeof parameter not Color');
-			return;
-		}
-
-		if (color.format !== this.picker_mode) {
-			color.setFormat(this.picker_mode);
-			color.updateHSX();
-		}
-
-		this.color.copy(color);
-		this.updateHuePicker();
-		this.updatePickerPosition();
-		this.updatePickerBackground();
-		this.updateAlphaPicker();
-		this.updateAlphaGradient();
-		this.updatePreviewColor();
-
-		this.notify('red', this.color.r);
-		this.notify('green', this.color.g);
-		this.notify('blue', this.color.b);
-
-		this.notify('hue', this.color.hue);
-		this.notify('saturation', this.color.saturation);
-		this.notify('value', this.color.value);
-		this.notify('lightness', this.color.lightness);
-
-		this.notify('alpha', this.color.a);
-		this.notify('hexa', this.color.getHexa());
-		notify(this.topic, this.color);
-	};
-
-	ColorPicker.prototype.setPickerMode = function setPickerMode(mode) {
-		if (mode !== 'HSV' &amp;&amp; mode !== 'HSL')
-			return;
-
-		this.picker_mode = mode;
-		this.node.setAttribute('data-mode', this.picker_mode);
-		this.setColor(this.color);
-	};
-
-	/*************************************************************************/
-	//								UNUSED
-	/*************************************************************************/
-
-	var setPickerMode = function setPickerMode(topic, mode) {
-		if (pickers[topic])
-			pickers[topic].setPickerMode(mode);
-	};
-
-	var setColor = function setColor(topic, color) {
-		if (pickers[topic])
-			pickers[topic].setColor(color);
-	};
-
-	var getColor = function getColor(topic) {
-		if (pickers[topic])
-			return new Color(pickers[topic].color);
-	};
-
-	var subscribe = function subscribe(topic, callback) {
-		if (subscribers[topic] === undefined)
-			subscribers[topic] = [];
-
-		subscribers[topic].push(callback);
-	};
-
-	var unsubscribe = function unsubscribe(callback) {
-		subscribers.indexOf(callback);
-		subscribers.splice(index, 1);
-	};
-
-	var notify = function notify(topic, value) {
-		if (subscribers[topic] === undefined || subscribers[topic].length === 0)
-			return;
-
-		var color = new Color(value);
-		for (var i in subscribers[topic])
-			subscribers[topic][i](color);
-	};
-
-	var init = function init() {
-		var elem = document.querySelectorAll('.ui-color-picker');
-		var size = elem.length;
-		for (var i = 0; i &lt; size; i++)
-			new ColorPicker(elem[i]);
-	};
-
-	return {
-		init : init,
-		Color : Color,
-		RGBColor : RGBColor,
-		RGBAColor : RGBAColor,
-		HSVColor : HSVColor,
-		HSVAColor : HSVAColor,
-		HSLColor : HSLColor,
-		HSLAColor : HSLAColor,
-		setColor : setColor,
-		getColor : getColor,
-		subscribe : subscribe,
-		unsubscribe : unsubscribe,
-		setPickerMode : setPickerMode
-	};
-
-})();
-
-
-
-/**
- * UI-SlidersManager
- */
-
-var InputSliderManager = (function InputSliderManager() {
-
-	var subscribers = {};
-	var sliders = [];
-
-	var InputComponent = function InputComponent(obj) {
-		var input = document.createElement('input');
-		input.setAttribute('type', 'text');
-		input.style.width = 50 + obj.precision * 10 + 'px';
-
-		input.addEventListener('click', function(e) {
-			this.select();
-		});
-
-		input.addEventListener('change', function(e) {
-			var value = parseFloat(e.target.value);
-
-			if (isNaN(value) === true)
-				setValue(obj.topic, obj.value);
-			else
-				setValue(obj.topic, value);
-		});
-
-		return input;
-	};
-
-	var SliderComponent = function SliderComponent(obj, sign) {
-		var slider = document.createElement('div');
-		var startX = null;
-		var start_value = 0;
-
-		slider.addEventListener("click", function(e) {
-			document.removeEventListener("mousemove", sliderMotion);
-			setValue(obj.topic, obj.value + obj.step * sign);
-		});
-
-		slider.addEventListener("mousedown", function(e) {
-			startX = e.clientX;
-			start_value = obj.value;
-			document.body.style.cursor = "e-resize";
-
-			document.addEventListener("mouseup", slideEnd);
-			document.addEventListener("mousemove", sliderMotion);
-		});
-
-		var slideEnd = function slideEnd(e) {
-			document.removeEventListener("mousemove", sliderMotion);
-			document.body.style.cursor = "auto";
-			slider.style.cursor = "pointer";
-		};
-
-		var sliderMotion = function sliderMotion(e) {
-			slider.style.cursor = "e-resize";
-			var delta = (e.clientX - startX) / obj.sensivity | 0;
-			var value = delta * obj.step + start_value;
-			setValue(obj.topic, value);
-		};
-
-		return slider;
-	};
-
-	var InputSlider = function(node) {
-		var min		= parseFloat(node.getAttribute('data-min'));
-		var max		= parseFloat(node.getAttribute('data-max'));
-		var step	= parseFloat(node.getAttribute('data-step'));
-		var value	= parseFloat(node.getAttribute('data-value'));
-		var topic	= node.getAttribute('data-topic');
-		var unit	= node.getAttribute('data-unit');
-		var name 	= node.getAttribute('data-info');
-		var sensivity = node.getAttribute('data-sensivity') | 0;
-		var precision = node.getAttribute('data-precision') | 0;
-
-		this.min = isNaN(min) ? 0 : min;
-		this.max = isNaN(max) ? 100 : max;
-		this.precision = precision &gt;= 0 ? precision : 0;
-		this.step = step &lt; 0 || isNaN(step) ? 1 : step.toFixed(precision);
-		this.topic = topic;
-		this.node = node;
-		this.unit = unit === null ? '' : unit;
-		this.sensivity = sensivity &gt; 0 ? sensivity : 5;
-		value = isNaN(value) ? this.min : value;
-
-		var input = new InputComponent(this);
-		var slider_left  = new SliderComponent(this, -1);
-		var slider_right = new SliderComponent(this,  1);
-
-		slider_left.className = 'ui-input-slider-left';
-		slider_right.className = 'ui-input-slider-right';
-
-		if (name) {
-			var info = document.createElement('span');
-			info.className = 'ui-input-slider-info';
-			info.textContent = name;
-			node.appendChild(info);
-		}
-
-		node.appendChild(slider_left);
-		node.appendChild(input);
-		node.appendChild(slider_right);
-
-		this.input = input;
-		sliders[topic] = this;
-		setValue(topic, value);
-	};
-
-	InputSlider.prototype.setInputValue = function setInputValue() {
-		this.input.value = this.value.toFixed(this.precision) + this.unit;
-	};
-
-	var setValue = function setValue(topic, value, send_notify) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		value = parseFloat(value.toFixed(slider.precision));
-
-		if (value &gt; slider.max) value = slider.max;
-		if (value &lt; slider.min)	value = slider.min;
-
-		slider.value = value;
-		slider.node.setAttribute('data-value', value);
-
-		slider.setInputValue();
-
-		if (send_notify === false)
-			return;
-
-		notify.call(slider);
-	};
-
-	var setMax = function setMax(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.max = value;
-		setValue(topic, slider.value);
-	};
-
-	var setMin = function setMin(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.min = value;
-		setValue(topic, slider.value);
-	};
-
-	var setUnit = function setUnit(topic, unit) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.unit = unit;
-		setValue(topic, slider.value);
-	};
-
-	var setStep = function setStep(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		slider.step = parseFloat(value);
-		setValue(topic, slider.value);
-	};
-
-	var setPrecision = function setPrecision(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		value = value | 0;
-		slider.precision = value;
-
-		var step = parseFloat(slider.step.toFixed(value));
-		if (step === 0)
-			slider.step = 1 / Math.pow(10, value);
-
-		setValue(topic, slider.value);
-	};
-
-	var setSensivity = function setSensivity(topic, value) {
-		var slider = sliders[topic];
-		if (slider === undefined)
-			return;
-
-		value = value | 0;
-
-		slider.sensivity = value &gt; 0 ? value : 5;
-	};
-
-	var getNode =  function getNode(topic) {
-		return sliders[topic].node;
-	};
-
-	var getPrecision =  function getPrecision(topic) {
-		return sliders[topic].precision;
-	};
-
-	var getStep =  function getStep(topic) {
-		return sliders[topic].step;
-	};
-
-	var subscribe = function subscribe(topic, callback) {
-		if (subscribers[topic] === undefined)
-			subscribers[topic] = [];
-		subscribers[topic].push(callback);
-	};
-
-	var unsubscribe = function unsubscribe(topic, callback) {
-		subscribers[topic].indexOf(callback);
-		subscribers[topic].splice(index, 1);
-	};
-
-	var notify = function notify() {
-		if (subscribers[this.topic] === undefined)
-			return;
-		for (var i = 0; i &lt; subscribers[this.topic].length; i++)
-			subscribers[this.topic][i](this.value);
-	};
-
-	var createSlider = function createSlider(topic, label) {
-		var slider = document.createElement('div');
-		slider.className = 'ui-input-slider';
-		slider.setAttribute('data-topic', topic);
-
-		if (label !== undefined)
-			slider.setAttribute('data-info', label);
-
-		new InputSlider(slider);
-		return slider;
-	};
-
-	var init = function init() {
-		var elem = document.querySelectorAll('.ui-input-slider');
-		var size = elem.length;
-		for (var i = 0; i &lt; size; i++)
-			new InputSlider(elem[i]);
-	};
-
-	return {
-		init : init,
-		setMax : setMax,
-		setMin : setMin,
-		setUnit : setUnit,
-		setStep : setStep,
-		getNode : getNode,
-		getStep : getStep,
-		setValue : setValue,
-		subscribe : subscribe,
-		unsubscribe : unsubscribe,
-		setPrecision : setPrecision,
-		setSensivity : setSensivity,
-		getPrecision : getPrecision,
-		createSlider : createSlider,
-	};
-
-})();
-
-
-'use strict';
-
-window.addEventListener("load", function() {
-	ColorPickerTool.init();
-});
-
-var ColorPickerTool = (function ColorPickerTool() {
-
-	/*========== Get DOM Element By ID ==========*/
-
-	function getElemById(id) {
-		return document.getElementById(id);
-	}
-
-	function allowDropEvent(e) {
-		e.preventDefault();
-	}
-
-	/*========== Make an element resizable relative to it's parent ==========*/
-
-	var UIComponent = (function UIComponent() {
-
-		function makeResizable(elem, axis) {
-			var valueX = 0;
-			var valueY = 0;
-			var action = 0;
-
-			var resizeStart = function resizeStart(e) {
-				e.stopPropagation();
-				e.preventDefault();
-				if (e.button !== 0)
-					return;
-
-				valueX = e.clientX - elem.clientWidth;
-				valueY = e.clientY - elem.clientHeight;
-
-				document.body.setAttribute('data-resize', axis);
-				document.addEventListener('mousemove', mouseMove);
-				document.addEventListener('mouseup', resizeEnd);
-			};
-
-			var mouseMove = function mouseMove(e) {
-				if (action &gt;= 0)
-					elem.style.width = e.clientX - valueX + 'px';
-				if (action &lt;= 0)
-					elem.style.height = e.clientY - valueY + 'px';
-			};
-
-			var resizeEnd = function resizeEnd(e) {
-				if (e.button !== 0)
-					return;
-
-				document.body.removeAttribute('data-resize', axis);
-				document.removeEventListener('mousemove', mouseMove);
-				document.removeEventListener('mouseup', resizeEnd);
-			};
-
-			var handle = document.createElement('div');
-			handle.className = 'resize-handle';
-
-			if (axis === 'width') action = 1;
-			else if (axis === 'height') action = -1;
-			else axis = 'both';
-
-			handle.className = 'resize-handle';
-			handle.setAttribute('data-resize', axis);
-			handle.addEventListener('mousedown', resizeStart);
-			elem.appendChild(handle);
-		};
-
-		/*========== Make an element draggable relative to it's parent ==========*/
-
-		var makeDraggable = function makeDraggable(elem, endFunction) {
-
-			var offsetTop;
-			var offsetLeft;
-
-			elem.setAttribute('data-draggable', 'true');
-
-			var dragStart = function dragStart(e) {
-				e.preventDefault();
-				e.stopPropagation();
-
-				if (e.target.getAttribute('data-draggable') !== 'true' ||
-					e.target !== elem || e.button !== 0)
-					return;
-
-				offsetLeft = e.clientX - elem.offsetLeft;
-				offsetTop = e.clientY - elem.offsetTop;
-
-				document.addEventListener('mousemove', mouseDrag);
-				document.addEventListener('mouseup', dragEnd);
-			};
-
-			var dragEnd = function dragEnd(e) {
-				if (e.button !== 0)
-					return;
-
-				document.removeEventListener('mousemove', mouseDrag);
-				document.removeEventListener('mouseup', dragEnd);
-			};
-
-			var mouseDrag = function mouseDrag(e) {
-				elem.style.left = e.clientX - offsetLeft + 'px';
-				elem.style.top = e.clientY - offsetTop + 'px';
-			};
-
-			elem.addEventListener('mousedown', dragStart, false);
-		};
-
-		return {
-			makeResizable : makeResizable,
-			makeDraggable : makeDraggable
-		};
-
-	})();
-
-	/*========== Color Class ==========*/
-
-	var Color = UIColorPicker.Color;
-	var HSLColor = UIColorPicker.HSLColor;
-
-	/**
-	 * ColorPalette
-	 */
-	var ColorPalette = (function ColorPalette() {
-
-		var samples = [];
-		var color_palette;
-		var complementary;
-
-		var hideNode = function(node) {
-			node.setAttribute('data-hidden', 'true');
-		};
-
-		var ColorSample = function ColorSample(id) {
-			var node = document.createElement('div');
-			node.className = 'sample';
-
-			this.uid = samples.length;
-			this.node = node;
-			this.color = new Color();
-
-			node.setAttribute('sample-id', this.uid);
-			node.setAttribute('draggable', 'true');
-			node.addEventListener('dragstart', this.dragStart.bind(this));
-			node.addEventListener('click', this.pickColor.bind(this));
-
-			samples.push(this);
-		};
-
-		ColorSample.prototype.updateBgColor = function updateBgColor() {
-			this.node.style.backgroundColor = this.color.getColor();
-		};
-
-		ColorSample.prototype.updateColor = function updateColor(color) {
-			this.color.copy(color);
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.updateHue = function updateHue(color, degree, steps) {
-			this.color.copy(color);
-			var hue = (steps * degree + this.color.hue) % 360;
-			if (hue &lt; 0) hue += 360;
-			this.color.setHue(hue);
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.updateSaturation = function updateSaturation(color, value, steps) {
-			var saturation = color.saturation + value * steps;
-			if (saturation &lt;= 0) {
-				this.node.setAttribute('data-hidden', 'true');
-				return;
-			}
-
-			this.node.removeAttribute('data-hidden');
-			this.color.copy(color);
-			this.color.setSaturation(saturation);
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.updateLightness = function updateLightness(color, value, steps) {
-			var lightness = color.lightness + value * steps;
-			if (lightness &lt;= 0) {
-				this.node.setAttribute('data-hidden', 'true');
-				return;
-			}
-			this.node.removeAttribute('data-hidden');
-			this.color.copy(color);
-			this.color.setLightness(lightness);
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.updateBrightness = function updateBrightness(color, value, steps) {
-			var brightness = color.value + value * steps;
-			if (brightness &lt;= 0) {
-				this.node.setAttribute('data-hidden', 'true');
-				return;
-			}
-			this.node.removeAttribute('data-hidden');
-			this.color.copy(color);
-			this.color.setValue(brightness);
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.updateAlpha = function updateAlpha(color, value, steps) {
-			var alpha = parseFloat(color.a) + value * steps;
-			if (alpha &lt;= 0) {
-				this.node.setAttribute('data-hidden', 'true');
-				return;
-			}
-			this.node.removeAttribute('data-hidden');
-			this.color.copy(color);
-			this.color.a = parseFloat(alpha.toFixed(2));
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.pickColor = function pickColor() {
-			UIColorPicker.setColor('picker', this.color);
-		};
-
-		ColorSample.prototype.dragStart = function dragStart(e) {
-			e.dataTransfer.setData('sampleID', this.uid);
-			e.dataTransfer.setData('location', 'palette-samples');
-		};
-
-		var Palette = function Palette(text, size) {
-			this.samples = [];
-			this.locked = false;
-
-			var palette = document.createElement('div');
-			var title = document.createElement('div');
-			var controls = document.createElement('div');
-			var container = document.createElement('div');
-			var lock = document.createElement('div');
-
-			container.className = 'container';
-			title.className = 'title';
-			palette.className = 'palette';
-			controls.className = 'controls';
-			lock.className = 'lock';
-			title.textContent = text;
-
-			controls.appendChild(lock);
-			container.appendChild(title);
-			container.appendChild(controls);
-			container.appendChild(palette);
-
-			lock.addEventListener('click', function () {
-				this.locked = !this.locked;
-				lock.setAttribute('locked-state', this.locked);
-			}.bind(this));
-
-			for(var i = 0; i &lt; size; i++) {
-				var sample = new ColorSample();
-				this.samples.push(sample);
-				palette.appendChild(sample.node);
-			}
-
-			this.container = container;
-			this.title = title;
-		};
-
-		var createHuePalette = function createHuePalette() {
-			var palette = new Palette('Hue', 12);
-
-			UIColorPicker.subscribe('picker', function(color) {
-				if (palette.locked === true)
-					return;
-
-				for(var i = 0; i &lt; 12; i++) {
-					palette.samples[i].updateHue(color, 30, i);
-				}
-			});
-
-			color_palette.appendChild(palette.container);
-		};
-
-		var createSaturationPalette = function createSaturationPalette() {
-			var palette = new Palette('Saturation', 11);
-
-			UIColorPicker.subscribe('picker', function(color) {
-				if (palette.locked === true)
-					return;
-
-				for(var i = 0; i &lt; 11; i++) {
-					palette.samples[i].updateSaturation(color, -10, i);
-				}
-			});
-
-			color_palette.appendChild(palette.container);
-		};
-
-		/* Brightness or Lightness - depends on the picker mode */
-		var createVLPalette = function createSaturationPalette() {
-			var palette = new Palette('Lightness', 11);
-
-			UIColorPicker.subscribe('picker', function(color) {
-				if (palette.locked === true)
-					return;
-
-				if(color.format === 'HSL') {
-					palette.title.textContent = 'Lightness';
-					for(var i = 0; i &lt; 11; i++)
-						palette.samples[i].updateLightness(color, -10, i);
-				}
-				else {
-					palette.title.textContent = 'Value';
-					for(var i = 0; i &lt; 11; i++)
-						palette.samples[i].updateBrightness(color, -10, i);
-				}
-			});
-
-			color_palette.appendChild(palette.container);
-		};
-
-		var isBlankPalette = function isBlankPalette(container, value) {
-			if (value === 0) {
-				container.setAttribute('data-collapsed', 'true');
-				return true;
-			}
-
-			container.removeAttribute('data-collapsed');
-			return false;
-		};
-
-		var createAlphaPalette = function createAlphaPalette() {
-			var palette = new Palette('Alpha', 10);
-
-			UIColorPicker.subscribe('picker', function(color) {
-				if (palette.locked === true)
-					return;
-
-				for(var i = 0; i &lt; 10; i++) {
-					palette.samples[i].updateAlpha(color, -0.1, i);
-				}
-			});
-
-			color_palette.appendChild(palette.container);
-		};
-
-		var getSampleColor = function getSampleColor(id) {
-			if (samples[id] !== undefined &amp;&amp; samples[id]!== null)
-				return new Color(samples[id].color);
-		};
-
-		var init = function init() {
-			color_palette = getElemById('color-palette');
-
-			createHuePalette();
-			createSaturationPalette();
-			createVLPalette();
-			createAlphaPalette();
-
-		};
-
-		return {
-			init : init,
-			getSampleColor : getSampleColor
-		};
-
-	})();
-
-	/**
-	 * ColorInfo
-	 */
-	var ColorInfo = (function ColorInfo() {
-
-		var info_box;
-		var select;
-		var RGBA;
-		var HEXA;
-		var HSLA;
-
-		var updateInfo = function updateInfo(color) {
-			if (color.a | 0 === 1) {
-				RGBA.info.textContent = 'RGB';
-				HSLA.info.textContent = 'HSL';
-			}
-			else {
-				RGBA.info.textContent = 'RGBA';
-				HSLA.info.textContent = 'HSLA';
-			}
-
-			RGBA.value.value = color.getRGBA();
-			HSLA.value.value = color.getHSLA();
-			HEXA.value.value = color.getHexa();
-		};
-
-		var InfoProperty = function InfoProperty(info) {
-
-			var node = document.createElement('div');
-			var title = document.createElement('div');
-			var value = document.createElement('input');
-			var copy = document.createElement('div');
-
-			node.className = 'property';
-			title.className = 'type';
-			value.className = 'value';
-			copy.className = 'copy';
-
-			title.textContent = info;
-			value.setAttribute('type', 'text');
-
-			copy.addEventListener('click', function() {
-				value.select();
-			});
-
-			node.appendChild(title);
-			node.appendChild(value);
-			node.appendChild(copy);
-
-			this.node = node;
-			this.value = value;
-			this.info = title;
-
-			info_box.appendChild(node);
-		};
-
-		var init = function init() {
-
-			info_box = getElemById('color-info');
-
-			RGBA = new InfoProperty('RGBA');
-			HSLA = new InfoProperty('HSLA');
-			HEXA = new InfoProperty('HEXA');
-
-			UIColorPicker.subscribe('picker', updateInfo);
-
-		};
-
-		return {
-			init: init
-		};
-
-	})();
-
-	/**
-	 * ColorPicker Samples
-	 */
-	var ColorPickerSamples = (function ColorPickerSamples() {
-
-		var samples = [];
-		var nr_samples = 0;
-		var active = null;
-		var container = null;
-		var	samples_per_line = 10;
-		var trash_can = null;
-		var base_color = new HSLColor(0, 50, 100);
-		var add_btn;
-		var add_btn_pos;
-
-		var ColorSample = function ColorSample() {
-			var node = document.createElement('div');
-			node.className = 'sample';
-
-			this.uid = samples.length;
-			this.index = nr_samples++;
-			this.node = node;
-			this.color = new Color(base_color);
-
-			node.setAttribute('sample-id', this.uid);
-			node.setAttribute('draggable', 'true');
-
-			node.addEventListener('dragstart', this.dragStart.bind(this));
-			node.addEventListener('dragover' , allowDropEvent);
-			node.addEventListener('drop'     , this.dragDrop.bind(this));
-
-			this.updatePosition(this.index);
-			this.updateBgColor();
-			samples.push(this);
-		};
-
-		ColorSample.prototype.updateBgColor = function updateBgColor() {
-			this.node.style.backgroundColor = this.color.getColor();
-		};
-
-		ColorSample.prototype.updatePosition = function updatePosition(index) {
-			this.index = index;
-			this.posY = 5 + ((index / samples_per_line) | 0) * 52;
-			this.posX = 5 + ((index % samples_per_line) | 0) * 52;
-			this.node.style.top  = this.posY + 'px';
-			this.node.style.left = this.posX + 'px';
-		};
-
-		ColorSample.prototype.updateColor = function updateColor(color) {
-			this.color.copy(color);
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.activate = function activate() {
-			UIColorPicker.setColor('picker', this.color);
-			this.node.setAttribute('data-active', 'true');
-		};
-
-		ColorSample.prototype.deactivate = function deactivate() {
-			this.node.removeAttribute('data-active');
-		};
-
-		ColorSample.prototype.dragStart = function dragStart(e) {
-			e.dataTransfer.setData('sampleID', this.uid);
-			e.dataTransfer.setData('location', 'picker-samples');
-		};
-
-		ColorSample.prototype.dragDrop = function dragDrop(e) {
-			e.stopPropagation();
-			this.color = Tool.getSampleColorFrom(e);
-			this.updateBgColor();
-		};
-
-		ColorSample.prototype.deleteSample = function deleteSample() {
-			container.removeChild(this.node);
-			samples[this.uid] = null;
-			nr_samples--;
-		};
-
-		var updateUI = function updateUI() {
-			updateContainerProp();
-
-			var index = 0;
-			var nr = samples.length;
-			for (var i=0; i &lt; nr; i++)
-				if (samples[i] !== null) {
-					samples[i].updatePosition(index);
-					index++;
-				}
-
-			AddSampleButton.updatePosition(index);
-		};
-
-		var deleteSample = function deleteSample(e) {
-			trash_can.parentElement.setAttribute('drag-state', 'none');
-
-			var location = e.dataTransfer.getData('location');
-			if (location !== 'picker-samples')
-				return;
-
-			var sampleID = e.dataTransfer.getData('sampleID');
-			samples[sampleID].deleteSample();
-			console.log(samples);
-
-			updateUI();
-		};
-
-		var createDropSample = function createDropSample() {
-			var sample = document.createElement('div');
-			sample.id = 'drop-effect-sample';
-			sample.className = 'sample';
-			container.appendChild(sample);
-		};
-
-		var setActivateSample = function setActivateSample(e) {
-			if (e.target.className !== 'sample')
-				return;
-
-			unsetActiveSample(active);
-			Tool.unsetVoidSample();
-			CanvasSamples.unsetActiveSample();
-			active = samples[e.target.getAttribute('sample-id')];
-			active.activate();
-		};
-
-		var unsetActiveSample = function unsetActiveSample() {
-			if (active)
-				active.deactivate();
-			active = null;
-		};
-
-		var getSampleColor = function getSampleColor(id) {
-			if (samples[id] !== undefined &amp;&amp; samples[id]!== null)
-				return new Color(samples[id].color);
-		};
-
-		var updateContainerProp = function updateContainerProp() {
-			samples_per_line = ((container.clientWidth - 5) / 52) | 0;
-			var height = 52 * (1 + (nr_samples / samples_per_line) | 0);
-			container.style.height = height + 10 + 'px';
-		};
-
-		var AddSampleButton = (function AddSampleButton() {
-			var node;
-			var _index = 0;
-			var _posX;
-			var _posY;
-
-			var updatePosition = function updatePosition(index) {
-				_index = index;
-				_posY = 5 + ((index / samples_per_line) | 0) * 52;
-				_posX = 5 + ((index % samples_per_line) | 0) * 52;
-
-				node.style.top  = _posY + 'px';
-				node.style.left = _posX + 'px';
-			};
-
-			var addButtonClick = function addButtonClick() {
-				var sample = new ColorSample();
-				container.appendChild(sample.node);
-				updatePosition(_index + 1);
-				updateUI();
-			};
-
-			var init = function init() {
-				node = document.createElement('div');
-				var icon = document.createElement('div');
-
-				node.className = 'sample';
-				icon.id = 'add-icon';
-				node.appendChild(icon);
-				node.addEventListener('click', addButtonClick);
-
-				updatePosition(0);
-				container.appendChild(node);
-			};
-
-			return {
-				init : init,
-				updatePosition : updatePosition
-			};
-		})();
-
-		var init = function init() {
-			container = getElemById('picker-samples');
-			trash_can = getElemById('trash-can');
-
-			AddSampleButton.init();
-
-			for (var i=0; i&lt;16; i++) {
-				var sample = new ColorSample();
-				container.appendChild(sample.node);
-			}
-
-			AddSampleButton.updatePosition(samples.length);
-			updateUI();
-
-			active = samples[0];
-			active.activate();
-
-			container.addEventListener('click', setActivateSample);
-
-			trash_can.addEventListener('dragover', allowDropEvent);
-			trash_can.addEventListener('dragenter', function() {
-				this.parentElement.setAttribute('drag-state', 'enter');
-			});
-			trash_can.addEventListener('dragleave', function(e) {
-				this.parentElement.setAttribute('drag-state', 'none');
-			});
-			trash_can.addEventListener('drop', deleteSample);
-
-			UIColorPicker.subscribe('picker', function(color) {
-				if (active)
-					active.updateColor(color);
-			});
-
-		};
-
-		return {
-			init : init,
-			getSampleColor : getSampleColor,
-			unsetActiveSample : unsetActiveSample
-		};
-
-	})();
-
-	/**
-	 * Canvas Samples
-	 */
-	var CanvasSamples = (function CanvasSamples() {
-
-		var active = null;
-		var canvas = null;
-		var samples = [];
-		var zindex = null;
-		var tutorial = true;
-
-		var CanvasSample = function CanvasSample(color, posX, posY) {
-
-			var node = document.createElement('div');
-			var pick = document.createElement('div');
-			var delete_btn = document.createElement('div');
-			node.className = 'sample';
-			pick.className = 'pick';
-			delete_btn.className = 'delete';
-
-			this.uid = samples.length;
-			this.node = node;
-			this.color = color;
-			this.updateBgColor();
-			this.zIndex = 1;
-
-			node.style.top = posY - 50 + 'px';
-			node.style.left = posX - 50 + 'px';
-			node.setAttribute('sample-id', this.uid);
-
-			node.appendChild(pick);
-			node.appendChild(delete_btn);
-
-			var activate = function activate() {
-				setActiveSample(this);
-			}.bind(this);
-
-			node.addEventListener('dblclick', activate);
-			pick.addEventListener('click', activate);
-			delete_btn.addEventListener('click', this.deleteSample.bind(this));
-
-			UIComponent.makeDraggable(node);
-			UIComponent.makeResizable(node);
-
-			samples.push(this);
-			canvas.appendChild(node);
-			return this;
-		};
-
-		CanvasSample.prototype.updateBgColor = function updateBgColor() {
-			this.node.style.backgroundColor = this.color.getColor();
-		};
-
-		CanvasSample.prototype.updateColor = function updateColor(color) {
-			this.color.copy(color);
-			this.updateBgColor();
-		};
-
-		CanvasSample.prototype.updateZIndex = function updateZIndex(value) {
-			this.zIndex = value;
-			this.node.style.zIndex = value;
-		};
-
-		CanvasSample.prototype.activate = function activate() {
-			this.node.setAttribute('data-active', 'true');
-			zindex.setAttribute('data-active', 'true');
-
-			UIColorPicker.setColor('picker', this.color);
-			InputSliderManager.setValue('z-index', this.zIndex);
-		};
-
-		CanvasSample.prototype.deactivate = function deactivate() {
-			this.node.removeAttribute('data-active');
-			zindex.removeAttribute('data-active');
-		};
-
-		CanvasSample.prototype.deleteSample = function deleteSample() {
-			if (active === this)
-				unsetActiveSample();
-			canvas.removeChild(this.node);
-			samples[this.uid] = null;
-		};
-
-		CanvasSample.prototype.updatePosition = function updatePosition(posX, posY) {
-			this.node.style.top = posY - this.startY + 'px';
-			this.node.style.left = posX - this.startX + 'px';
-		};
-
-		var canvasDropEvent = function canvasDropEvent(e) {
-			var color = Tool.getSampleColorFrom(e);
-
-			if (color) {
-				var offsetX = e.pageX - canvas.offsetLeft;
-				var offsetY = e.pageY - canvas.offsetTop;
-				var sample = new CanvasSample(color, offsetX, offsetY);
-				if (tutorial) {
-					tutorial = false;
-					canvas.removeAttribute('data-tutorial');
-					var info = new CanvasSample(new Color(), 100, 100);
-					info.node.setAttribute('data-tutorial', 'dblclick');
-				}
-			}
-
-		};
-
-		var setActiveSample = function setActiveSample(sample) {
-			ColorPickerSamples.unsetActiveSample();
-			Tool.unsetVoidSample();
-			unsetActiveSample();
-			active = sample;
-			active.activate();
-		};
-
-		var unsetActiveSample = function unsetActiveSample() {
-			if (active)
-				active.deactivate();
-			active = null;
-		};
-
-		var createToggleBgButton = function createToggleBgButton() {
-			var button = document.createElement('div');
-			var state = false;
-			button.className = 'toggle-bg';
-			canvas.appendChild(button);
-
-			button.addEventListener('click', function() {
-				console.log(state);
-				state = !state;
-				canvas.setAttribute('data-bg', state);
-			});
-		};
-
-		var init = function init() {
-			canvas = getElemById('canvas');
-			zindex = getElemById('zindex');
-
-			canvas.addEventListener('dragover', allowDropEvent);
-			canvas.addEventListener('drop', canvasDropEvent);
-
-			createToggleBgButton();
-
-			UIColorPicker.subscribe('picker', function(color) {
-				if (active)	active.updateColor(color);
-			});
-
-			InputSliderManager.subscribe('z-index', function (value) {
-				if (active)	active.updateZIndex(value);
-			});
-
-			UIComponent.makeResizable(canvas, 'height');
-		};
-
-		return {
-			init : init,
-			unsetActiveSample : unsetActiveSample
-		};
-
-	})();
-
-	var StateButton = function StateButton(node, state) {
-		this.state = false;
-		this.callback = null;
-
-		node.addEventListener('click', function() {
-			this.state = !this.state;
-			if (typeof this.callback === "function")
-				this.callback(this.state);
-		}.bind(this));
-	};
-
-	StateButton.prototype.set = function set() {
-		this.state = true;
-		if (typeof this.callback === "function")
-			this.callback(this.state);
-	};
-
-	StateButton.prototype.unset = function unset() {
-		this.state = false;
-		if (typeof this.callback === "function")
-			this.callback(this.state);
-	};
-
-	StateButton.prototype.subscribe = function subscribe(func) {
-		this.callback = func;
-	};
-
-
-	/**
-	 * Tool
-	 */
-	var Tool = (function Tool() {
-
-		var samples = [];
-		var controls = null;
-		var void_sw;
-
-		var createPickerModeSwitch = function createPickerModeSwitch() {
-			var parent = getElemById('controls');
-			var icon = document.createElement('div');
-			var button = document.createElement('div');
-			var hsv = document.createElement('div');
-			var hsl = document.createElement('div');
-			var active = null;
-
-			icon.className = 'icon picker-icon';
-			button.className = 'switch';
-			button.appendChild(hsv);
-			button.appendChild(hsl);
-
-			hsv.textContent = 'HSV';
-			hsl.textContent = 'HSL';
-
-			active = hsl;
-			active.setAttribute('data-active', 'true');
-
-			function switchPickingModeTo(elem) {
-				active.removeAttribute('data-active');
-				active = elem;
-				active.setAttribute('data-active', 'true');
-				UIColorPicker.setPickerMode('picker', active.textContent);
-			};
-
-			var picker_sw = new StateButton(icon);
-			picker_sw.subscribe(function() {
-				if (active === hsv)
-					switchPickingModeTo(hsl);
-				else
-					switchPickingModeTo(hsv);
-			});
-
-			hsv.addEventListener('click', function() {
-				switchPickingModeTo(hsv);
-			});
-			hsl.addEventListener('click', function() {
-				switchPickingModeTo(hsl);
-			});
-
-			parent.appendChild(icon);
-			parent.appendChild(button);
-		};
-
-		var setPickerDragAndDrop = function setPickerDragAndDrop() {
-			var preview = document.querySelector('#picker .preview-color');
-			var picking_area = document.querySelector('#picker .picking-area');
-
-			preview.setAttribute('draggable', 'true');
-			preview.addEventListener('drop', drop);
-			preview.addEventListener('dragstart', dragStart);
-			preview.addEventListener('dragover', allowDropEvent);
-
-			picking_area.addEventListener('drop', drop);
-			picking_area.addEventListener('dragover', allowDropEvent);
-
-			function drop(e) {
-				var color = getSampleColorFrom(e);
-				UIColorPicker.setColor('picker', color);
-			};
-
-			function dragStart(e) {
-				e.dataTransfer.setData('sampleID', 'picker');
-				e.dataTransfer.setData('location', 'picker');
-			};
-		};
-
-		var getSampleColorFrom = function getSampleColorFrom(e) {
-			var sampleID = e.dataTransfer.getData('sampleID');
-			var location = e.dataTransfer.getData('location');
-
-			if (location === 'picker')
-				return UIColorPicker.getColor(sampleID);
-			if (location === 'picker-samples')
-				return ColorPickerSamples.getSampleColor(sampleID);
-			if (location === 'palette-samples')
-				return ColorPalette.getSampleColor(sampleID);
-		};
-
-		var setVoidSwitch = function setVoidSwitch() {
-			var void_sample = getElemById('void-sample');
-			void_sw = new StateButton(void_sample);
-			void_sw.subscribe( function (state) {
-				void_sample.setAttribute('data-active', state);
-				if (state === true) {
-					ColorPickerSamples.unsetActiveSample();
-					CanvasSamples.unsetActiveSample();
-				}
-			});
-		};
-
-		var unsetVoidSample = function unsetVoidSample() {
-			void_sw.unset();
-		};
-
-		var init = function init() {
-			controls = getElemById('controls');
-
-			var color = new Color();
-			color.setHSL(0, 51, 51);
-			UIColorPicker.setColor('picker', color);
-
-			setPickerDragAndDrop();
-			createPickerModeSwitch();
-			setVoidSwitch();
-		};
-
-		return {
-			init : init,
-			unsetVoidSample : unsetVoidSample,
-			getSampleColorFrom : getSampleColorFrom
-		};
-
-	})();
-
-	var init = function init() {
-		UIColorPicker.init();
-		InputSliderManager.init();
-		ColorInfo.init();
-		ColorPalette.init();
-		ColorPickerSamples.init();
-		CanvasSamples.init();
-		Tool.init();
-	};
-
-	return {
-		init : init
-	};
-
-})();
-
-</pre>
-</div>
-
-<p>{{CSSRef}}</p>
-
-<p>Esta herramienta facilita crear, ajustar, y experimentar con colores personalizados para uso web. Además permite facilmente convertir entre varios formatos de color soportados por CSS, incluyendo: HEXA, RGB y HSL.  También soporta el control de alpha en los formatos RGB (rgba) y HSL (hsla).</p>
-
-<p>Cada color se presenta en los 3 formatos estándar de CSS mientras se ajusta; además,  basada en el color actual, se genera una paleta para HSL y HSV, así como para alpha. El recuadro "eyedropper" se puede cambiar entre los formatos HSL y HSC.</p>
-
-<p>{{ EmbedLiveSample('ColorPicker_Tool', '100%', '900') }}</p>
-
-<p> </p>
diff --git a/files/es/web/css/css_colors/index.html b/files/es/web/css/css_colors/index.html
deleted file mode 100644
index ef36d7954b..0000000000
--- a/files/es/web/css/css_colors/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: CSS Colors
-slug: Web/CSS/CSS_Colors
-tags:
-  - CSS
-  - CSS Colors
-  - NeedsTranslation
-  - Overview
-  - Reference
-  - TopicStub
-translation_of: Web/CSS/CSS_Color
-translation_of_original: Web/CSS/CSS_Colors
----
-<div>{{CSSRef}}</div>
-
-<p><strong>Los colores CSS</strong> son un módulo de CSS que trabaja con colores, tipos de colores y transparencias.</p>
-
-<h2 id="Referencia">Referencia</h2>
-
-<h3 id="Propiedades">Propiedades</h3>
-
-<div class="index">
-<ul>
- <li>{{cssxref("color")}}</li>
- <li>{{cssxref("opacity")}}</li>
-</ul>
-</div>
-
-<h3 id="Tipos_de_datos_CSS">Tipos de datos CSS</h3>
-
-<p>{{cssxref("&lt;color&gt;")}}</p>
-
-<h2 id="Guías">Guías</h2>
-
-<p><em>Ninguna.</em></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Colors')}}</td>
-   <td>{{Spec2('CSS3 Colors')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS2.1', 'colors.html')}}</td>
-   <td>{{Spec2('CSS2.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS1')}}</td>
-   <td>{{Spec2('CSS1')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1")}}</td>
-   <td>3.0</td>
-   <td>3.5</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoMobile("1")}}</td>
-   <td>6.0</td>
-   <td>6.0</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>En CSS, las gradientes no son colores sino <a href="/en-US/docs/Web/CSS/CSS_Images">imágenes</a>.</li>
-</ul>
diff --git a/files/es/web/css/css_columns/index.html b/files/es/web/css/css_columns/index.html
new file mode 100644
index 0000000000..712958a401
--- /dev/null
+++ b/files/es/web/css/css_columns/index.html
@@ -0,0 +1,113 @@
+---
+title: Columnas CSS
+slug: Web/CSS/CSS_Columns
+tags:
+  - CSS
+  - Referencia CSS
+  - Visión general
+translation_of: Web/CSS/CSS_Columns
+original_slug: Web/CSS/Columnas_CSS
+---
+<div>{{CSSRef}}</div>
+
+<p><strong>Columnas CSS</strong> es un módulo de CSS que define un diseño multicolumna, permitiendo indicar cómo debe fluir el contenido a través de las columnas y cómo manejar reglas y separaciones.</p>
+
+<h2 id="Referencia">Referencia</h2>
+
+<h3 id="Propiedades_CSS">Propiedades CSS</h3>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("break-after")}}</li>
+ <li>{{cssxref("break-before")}}</li>
+ <li>{{cssxref("break-inside")}}</li>
+ <li>{{cssxref("column-count")}}</li>
+ <li>{{cssxref("column-fill")}}</li>
+ <li>{{cssxref("column-gap")}}</li>
+ <li>{{cssxref("column-rule")}}</li>
+ <li>{{cssxref("column-rule-color")}}</li>
+ <li>{{cssxref("column-rule-style")}}</li>
+ <li>{{cssxref("column-rule-width")}}</li>
+ <li>{{cssxref("column-span")}}</li>
+ <li>{{cssxref("column-width")}}</li>
+ <li>{{cssxref("columns")}}</li>
+</ul>
+</div>
+
+<h2 id="Guías">Guías</h2>
+
+<dl>
+ <dt><a href="/es/docs/Columnas_con_CSS-3">Diseños multicolumna con CSS</a></dt>
+ <dd>Tutorial paso a paso sobre cómo desarrollar diseños de varias columnas.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Multicol')}}</td>
+   <td>{{Spec2('CSS3 Multicol')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}} {{property_prefix('-webkit')}}</td>
+   <td>{{CompatGeckoDesktop(9)}}{{property_prefix('-moz')}}</td>
+   <td>10</td>
+   <td>11.10<br>
+    15{{property_prefix('-webkit')}}</td>
+   <td>3.0 (522){{property_prefix('-webkit')}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.1{{property_prefix('-webkit')}}</td>
+   <td>{{compatGeckoMobile(22)}}{{property_prefix('-moz')}}</td>
+   <td>10</td>
+   <td>11.5<br>
+    32{{property_prefix('-webkit')}}</td>
+   <td>3.2{{property_prefix('-webkit')}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/css_columns/using_multi-column_layouts/index.html b/files/es/web/css/css_columns/using_multi-column_layouts/index.html
new file mode 100644
index 0000000000..e034c7129a
--- /dev/null
+++ b/files/es/web/css/css_columns/using_multi-column_layouts/index.html
@@ -0,0 +1,69 @@
+---
+title: Columnas con CSS-3
+slug: Web/CSS/CSS_Columns/Using_multi-column_layouts
+tags:
+  - CSS
+  - Todas_las_Categorías
+translation_of: Web/CSS/CSS_Columns/Using_multi-column_layouts
+original_slug: Columnas_con_CSS-3
+---
+<p>
+</p>
+<h3 id="Introducci.C3.B3n" name="Introducci.C3.B3n"> Introducción </h3>
+<p>Cuando leemos un texto, las líneas muy largas resultan incómodas. Si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas (al ir de un extremo al otro de la página). Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos. Por desgracia esto no es posible con HTML y CSS-2, a no ser que fuerces la ruptura de las columnas en puntos fijos, limites en gran medida el código a utilizar, o uses scripts complejos.
+</p><p><a class="external" href="http://www.w3.org/TR/css3-multicol/">El borrador de CSS-3</a> propone algunas nuevas propiedades para dar respuesta a esta necesidad. En Firefox 1.5 y superior hemos implementado algunas de estas propiedades para comportarnos según lo descrito en el borrador de CSS-3 (con una excepción explicada abajo) </p><p><a class="external" href="http://weblogs.mozillazine.org/roc/">El blog de Robert O'Callahan </a>  usa columnas CSS, pruébalo con Firefox 1.5
+</p>
+<h3 id="Usar_Columnas" name="Usar_Columnas"> Usar Columnas </h3>
+<h4 id="Columnas.2C_Count_y_Width" name="Columnas.2C_Count_y_Width"> Columnas, Count y Width </h4>
+<p>Dos propiedades CSS Controlan el número (Count) y el ancho (Width) de las columnas: <code>-moz-column-count</code> y <code>-moz-column-width</code>.
+</p><p><code>-moz-column-count</code> indica el número concreto de columnas a crear. Por ejemplo:
+</p>
+<pre>&lt;div style="-moz-column-count:2; -moz-column-gap: 1em;"&gt;
+Cuando leemos un texto las líneas muy largas resultan incómodas, si son
+demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista
+de la línea en la que estabas. Por ello, pensando en los usuarios con
+monitores grandes, los autores deben limitar la anchura del texto dividiéndolo
+en columnas, más o menos, como hacen los periódicos.&lt;/div&gt;
+</pre>
+<p>Mostrará el contenido en dos columnas (si usas Firefox 1.5 o superior):
+</p>
+<div style="border: 1px solid silver; padding: 1em;">Cuando leemos un texto las líneas muy largas resultan incómodas, si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas. Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos.</div>
+<p><code>-moz-column-width</code> fija la anchura mínima de las columnas. Si no se indica un <code>-moz-column-count</code>, entonces el navegador creará automáticamente tantas columnas (con la anchura indicada) como sea posible en el espacio disponible. </p>
+<pre>&lt;div style="-moz-column-width:20em; -moz-column-gap: 1em;"&gt;
+Cuando leemos un texto las líneas muy largas resultan incómodas, si son
+demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista
+de la línea en la que estabas. Por ello, pensando en los usuarios con
+monitores grandes, los autores deben limitar la anchura del texto dividiéndolo
+en columnas, más o menos, como hacen los periódicos.&lt;/div&gt;
+</pre>
+<p>Se visualizará así:
+</p>
+<div style="-moz-column-width: 20em; border: 1px solid silver; padding: 1em;">Cuando leemos un texto las líneas muy largas resultan incómodas, si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas. Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos.</div>
+<p>Los detalles exactos son descritos en <a class="external" href="http://www.w3.org/TR/css3-multicol/">El borrador de CSS3</a>.
+</p><p>En un bloque multicolumna, el contenido fluye automáticamente de una columna a otra según sea necesario. Todas las funcionalidades de HTML, CSS, y DOM están soportadas dentro de las columnas, tanto al editar como al imprimir.
+</p>
+<h4 id="Equilibrado_de_altura" name="Equilibrado_de_altura"> Equilibrado de altura </h4>
+<p>El borrador de CSS3 especifica que la altura de las columnas debe estar equilibrada, es decir, el navegador debe definir automáticamente la altura máxima de las columnas de modo que la altura del contenido en cada columna sea más o menos igual. Firefox lo hace. </p><p>Sin embargo, en algunas situaciones puede ser útil fijar explícitamente la altura máxima de las columnas, y entonces se empiezan a meter los contenidos en la primera columna y se van creando tantas columnas como sea necesario, posiblemente desbordando por la derecha. Por ejemplo, en <a class=" external" href="http://iht.com/" rel="freelink">http://iht.com/</a> los artículos hacen esto (usando scripts). Por lo tanto extendemos el borrador de modo que si se indica la propiedad CSS <code>height</code> en un bloque multicolumnas, se permite que cada columna tenga esa altura -y no más- antes de agregar la siguiente columna. Esto permite una composición mucho más eficiente. </p>
+<h4 id="Espacio_entre_Columnas" name="Espacio_entre_Columnas"> Espacio entre Columnas </h4>
+<p>Por defecto, cada columna está tocando la columna de al lado. Normalmente esto no es lo más apropiado. Se puede utilizar el <code>padding</code> de las columnas para corregirlo, pero normalmente lo más fácil será aplicar la propiedad <code>-moz-column-gap</code> al bloque con multicolumna: </p>
+<pre>&lt;div style="-moz-column-width:20em; -moz-column-gap:2em;"&gt;
+Cuando leemos un texto las líneas muy largas resultan incómodas, si son
+demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista
+de la línea en la que estabas. Por ello, pensando en los usuarios con
+monitores grandes, los autores deben limitar la anchura del texto dividiéndolo
+en columnas, más o menos, como hacen los periódicos.&lt;/div&gt;
+</pre>
+<p>Se visualizará así:
+</p>
+<div style="-moz-column-width: 20em; border: 1px solid silver; padding: 1em;">Cuando leemos un texto las líneas muy largas resultan incómodas, si son demasiado largas, al cambiar de línea nuestros ojos pueden perder la pista de la línea en la que estabas. Por ello, pensando en los usuarios con monitores grandes, los autores deben limitar la anchura del texto dividiéndolo en columnas, más o menos, como hacen los periódicos.</div>
+<h4 id="Degradado_elegante" name="Degradado_elegante"> Degradado elegante </h4>
+<p>La propiedad <code>-moz-column</code> será ignorada por los navegadores que no la soporten, por lo tanto, es relativamente fácil crear un diseño que en esos navegadores muestre una sola columna, y al mismo tiempo utilice multi-columnas en Firefox 1.5.
+</p>
+<h3 id="Conclusi.C3.B3n" name="Conclusi.C3.B3n"> Conclusión </h3>
+<p>Las columnas CSS3 son un nuevo método básico de disposición que ayudará a los desarrolladores Web a aprovechar mejor las condiciones reales de la pantalla. Los desarrolladores imaginativos podrán encontrarle muchas aplicaciones, especialmente a la característica de equilibrado automático y dinámico de la altura. </p>
+<h3 id="Referencias_adicionales" name="Referencias_adicionales"> Referencias adicionales </h3>
+<ul><li> <a class=" external" href="http://weblogs.mozillazine.org/roc/archives/2005/03/gecko_18_for_we.html" rel="freelink">http://weblogs.mozillazine.org/roc/a...18_for_we.html</a>
+</li></ul>
+<p><span class="comment">Categorías</span>
+</p><p><span class="comment">interwiki links</span>
+</p>{{ languages( { "en": "en/CSS3_Columns", "fr": "fr/Colonnes_CSS3", "it": "it/Le_Colonne_nei_CSS3", "ja": "ja/CSS3_Columns", "ko": "ko/CSS3_Columns", "pl": "pl/Kolumny_CSS3" } ) }}
diff --git a/files/es/web/css/css_conditional_rules/index.html b/files/es/web/css/css_conditional_rules/index.html
new file mode 100644
index 0000000000..a635d59d29
--- /dev/null
+++ b/files/es/web/css/css_conditional_rules/index.html
@@ -0,0 +1,100 @@
+---
+title: CSS Reglas Condicionales
+slug: Web/CSS/CSS_Conditional_Rules
+tags:
+  - CSS
+  - Referencia
+translation_of: Web/CSS/CSS_Conditional_Rules
+original_slug: Web/CSS/CSS_Reglas_Condicionales
+---
+<div>{{CSSRef}}</div>
+
+<p>Las<strong> Reglas Condicionales </strong>(At-rules) es un módulo de CSS que permite definir un conjunto de reglas que solo aplicarán con base en las capacidades del procesador o del documento al cual la hoja de estilos está siendo aplicada.</p>
+
+<h2 id="Referencia">Referencia</h2>
+
+<h3 id="Reglas_condicionales">Reglas condicionales</h3>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("@document")}}</li>
+ <li>{{cssxref("@media")}}</li>
+ <li>{{cssxref("@supports")}}</li>
+ <li>{{cssxref("@import")}}</li>
+</ul>
+</div>
+
+<h2 id="Guías">Guías</h2>
+
+<p><em>None.</em></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS3 Conditional')}}</td>
+   <td>{{Spec2('CSS3 Conditional')}}</td>
+   <td>Definición Inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Catacterística</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Catacterística</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/es/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
new file mode 100644
index 0000000000..49b6907445
--- /dev/null
+++ b/files/es/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
@@ -0,0 +1,228 @@
+---
+title: Conceptos Básicos de flexbox
+slug: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
+translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
+original_slug: Web/CSS/CSS_Flexible_Box_Layout/Conceptos_Basicos_de_Flexbox
+---
+<div>{{CSSRef}}</div>
+
+<p class="summary">El Módulo de Caja Flexible, comúnmente llamado flexbox, fue diseñado como un modelo unidimensional de layout, y como un método que pueda ayudar a distribuir el espacio entre los ítems de una interfaz y mejorar las capacidades de alineación. Este artículo hace un repaso de las principales características de flexbox, las que exploraremos con mayor detalle en el resto de estas guías.</p>
+
+<p>Cuando describimos a flexbox como unidimensional destacamos el hecho que flexbox maneja el layout en una sola dimensión a la vez — ya sea como fila o como columna. Esto contrasta con el modelo bidimensional del <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">Grid Layout de CSS</a>, el cual controla columnas y filas a la vez.</p>
+
+<p><span style='background-color: #333333; color: #ffffff; font-family: x-locale-heading-primary,zillaslab,Palatino,"Palatino Linotype",x-locale-heading-secondary,serif; font-size: 1.5rem;'>Los dos ejes de flexbox</span></p>
+
+<p>Cuando trabajamos con flexbox necesitamos pensar en términos de dos ejes — el eje principal y el eje cruzado. El eje principal está definido por la propiedad {{cssxref("flex-direction")}}, y el eje cruzado es perpendicular a este. Todo lo que hacemos con flexbox está referido a estos dos ejes, por lo que vale la pena entender cómo trabajan desde el principio.</p>
+
+<h3 id="El_eje_principal">El eje principal</h3>
+
+<p>El eje principal está definido por <code>flex-direction</code>, que posee cuatro posibles valores:</p>
+
+<ul>
+ <li><code>row</code></li>
+ <li><code>row-reverse</code></li>
+ <li><code>column</code></li>
+ <li><code>column-reverse</code></li>
+</ul>
+
+<p>Si elegimos <code>row</code> o <code>row-reverse</code>, el eje principal correrá a lo largo de la fila según la <strong>dirección de la línea </strong>.</p>
+
+<p><img alt="If flex-direction is set to row the main axis runs along the row in the inline direction." src="https://mdn.mozillademos.org/files/15614/Basics1.png" style="display: block; height: 152px; margin: 0px auto; width: 522px;"></p>
+
+<p>Al elegir <code>column</code> o <code>column-reverse</code> el eje principal correrá desde el borde superior de la página hasta el final — según la <strong>dirección del bloque</strong>.</p>
+
+<p><img alt="If flex-direction is set to column the main axis runs in the block direction." src="https://mdn.mozillademos.org/files/15615/Basics2.png" style="display: block; height: 227px; margin: 0px auto; width: 709px;"></p>
+
+<h3 id="El_eje_cruzado">El eje cruzado</h3>
+
+<p>El eje cruzado va perpendicular al eje principal, y por lo tanto si <code>flex-direction</code> (del eje principal) es <code>row</code> o <code>row-reverse</code> el eje cruzado irá por las columnas.</p>
+
+<p><img alt="If flex-direction is set to row then the cross axis runs in the block direction." src="https://mdn.mozillademos.org/files/15616/Basics3.png" style="display: block; height: 125px; margin: 0px auto; width: 666px;"></p>
+
+<p>Si el eje principal es <code>column</code> o <code>column-reverse</code> entonces el eje cruzado corre a lo largo de las filas.</p>
+
+<p><img alt="If flex-direction is set to column then the cross axis runs in the inline direction." src="https://mdn.mozillademos.org/files/15617/Basics4.png" style="display: block; height: 244px; margin: 0px auto; width: 523px;"></p>
+
+<p>Entender cuál eje es cuál es importante cuando empezamos a mirar la alineación y justificación flexible de los ítems; flexbox posee propiedades que permiten alinear y justificar el contenido sobre un eje o el otro.</p>
+
+<h2 id="Líneas_de_inicio_y_de_fin">Líneas de inicio y de fin</h2>
+
+<p>Otra área vital de entendimiento es cómo flexbox no hace suposiciones sobre la manera de escribir del documento. En el pasado, CSS estaba muy inclinado hacia el modo de escritura horizontal y de izquierda a derecha. Los métodos modernos de layout acogen la totalidad de modos de escritura así que no es necesario asumir que una línea de texto empezará arriba del documento y correrá de izquierda a derecha, con nuevas líneas dispuestas una abajo de la otra.</p>
+
+<p>Puede leer más acerca de la relación que hay entre flexbox y la especificación de los Modos de Escritura en un artículo posterior, sin embargo la siguiente descripción debería ayudar para explicar porqué no se habla de izquierda y derecha ni de arriba o abajo a la hora de describir la dirección en la que fluyen los ítems flex.</p>
+
+<p>Si <code>flex-direction</code> es <code>row</code> y estoy trabajando en español, entonces el margen inicial del eje principal quedará a la izquierda, y el margen final a la derecha.</p>
+
+<p><img alt="Working in English the start edge is on the left." src="https://mdn.mozillademos.org/files/15618/Basics5.png" style="display: block; height: 152px; margin: 0px auto; width: 631px;"></p>
+
+<p>Si fuera a trabajar en árabe, entonces el margen inicial de mi eje principal quedaría a la derecha y el margen final a la izquierda.</p>
+
+<p><img alt="The start edge in a RTL language is on the right." src="https://mdn.mozillademos.org/files/15619/Basics6.png" style="display: block; height: 152px; margin: 0px auto; width: 634px;"></p>
+
+<p>En ambos casos el margen inicial del eje cruzado estará en el extremo superior del contenedor flex y el margen final en el extremo inferior, ya que ambos idiomas tiene un modo de escritura horizontal.</p>
+
+<p>Después de un tiempo, pensar en inicial y final en vez de izquierda y derecha se hará natural, y será útil cuando interactúe con otros métodos de layout tales como el CSS Grid Layout que sigue los mismos patrones.</p>
+
+<h2 id="El_contenedor_flex">El contenedor flex</h2>
+
+<p>Un área del documento que contiene un flexbox es llamada <strong>contendedor flex</strong>. Para crear un contenedor flex, establecemos la propiedad del área del contenedor {{cssxref("display")}} como <code>flex</code> o <code>inline-flex</code>. Tan pronto como hacemos esto, los hijos directos de este contenedor se vuelven <strong>ítems flex</strong>. Como con todas las propiedades de CSS, se definen algunos valores iniciales, así que cuando creemos un contenedor flex todos los ítems flex contenidos se comportarán de la siguiente manera.</p>
+
+<ul>
+ <li>Los ítems se despliegan sobre una fila (la propiedad <code>flex-direction</code> por defecto es <code>row</code>).</li>
+ <li>Los ítems empiezan desde el margen inicial sobre el eje principal.</li>
+ <li>Los ítems no se ajustan en la dimensión principal, pero se pueden contraer.</li>
+ <li>Los ítems se ajustarán para llenar el tamaño del eje cruzado.</li>
+ <li>La propiedad {{cssxref("flex-basis")}} es definida como <code>auto</code>.</li>
+ <li>La propiedad {{cssxref("flex-wrap")}} es definida como <code>nowrap</code>.</li>
+</ul>
+
+<p>El resultado es que todos los ítems se alinearán en una solo fila, usando el tamaño del contenedor como su tamaño en el eje principal. Si hay más ítems de los que caben en el contenedor, estos no pasarán más abajo si no que sobrepasarán el margen. Si hay ítems más altos que otros, todos los ítems serán ajustados en el eje cruzado para alcanzar al mayor.</p>
+
+<p>Se puede ver en el ejercicio en vivo de abajo cómo luce. Intente editar el ítem o añadir ítems adicionales para así probar el comportamiento inicial de flexbox.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/the-flex-container.html", '100%', 480)}} </p>
+
+<h3 id="Cambiar_flex-direction">Cambiar flex-direction</h3>
+
+<p>Al añadir la propiedad {{cssxref("flex-direction")}} en el contenedor flex nos permite cambiar la dirección de cómo los ítems son desplegados. Colocando <code>flex-direction: row-reverse</code> se mantendrá el despliegue a lo largo de la fila, sin embargo el inicio y final quedarán al revés del original.</p>
+
+<p>Si cambiamos <code>flex-direction</code> a <code>column</code> el eje principal se cambiará y los ítems aparecerán en una columna. Colocando <code>column-reverse</code> las líneas de inicio y fin serán nuevamente puestas al revés.</p>
+
+<p>El ejemplo en vivo de abajo tiene <code>flex-direction</code> puesto como <code>row-reverse</code>. Pruebe los otros valores — <code>row</code>, <code>column</code> y <code>column-reverse</code> — para ver qué sucede con el contenido.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-direction.html", '100%', 350)}}</p>
+
+<h2 id="Contenedores_flex_Multi-línea_con_flex-wrap">Contenedores flex Multi-línea con flex-wrap</h2>
+
+<p>Si bien flexbox es un modelo unidimensional, es posible lograr que nuestros ítems flex sean repartidos en varías líneas. Haciendo esto, se deberá considerar cada línea como un nuevo contenedor flex. Cualquier distribución del espacio solo sucederá dentro de esa línea, sin referenciar las líneas colaterales.</p>
+
+<p>Para lograr repartirse en varias líneas añada la propiedad {{cssxref("flex-wrap")}} con el valor <code>wrap</code>. Cuando los ítems sean demasiados para desplegarlos en una línea, serán repartidos en la línea siguiente. El ejemplo en vivo de abajo contiene ítems que se les ha asignando un ancho, donde el ancho total de los ítems excede al del contenedor flex. Cuando <code>flex-wrap</code> se coloca como <code>wrap</code>, los ítems se repartirán. Al colocarlo como <code>nowrap</code>, el cual es el valor inicial, estos se contraerán para calzar con el contenedor ya que usan los valores iniciales de flexbox que permiten que los ítems se contraigan. Al usar <code>nowrap</code> los ítems podrían salirse del margen si estos no pudieran contraerse, o no contraerse lo suficiente para ser calzados.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-wrap.html", '100%', 400)}}</p>
+
+<h2 id="La_abreviatura_flex-flow">La abreviatura flex-flow</h2>
+
+<p>Se pueden combinar las propiedades <code>flex-direction</code> y <code>flex-wrap</code> en la abreviatura {{cssxref("flex-flow")}} . El primer valor especificado es <code>flex-direction</code> y el segundo valor es <code>flex-wrap</code>.</p>
+
+<p>En el ejemplo en vivo de abajo intente cambiar el primer valor por uno de los valores permitidos para <code>flex-direction</code> - <code>row</code>, <code>row-reverse</code>, <code>column</code> o <code>column-reverse</code>, y cambie también el segundo valor por <code>wrap</code> y <code>nowrap</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-flow.html", '100%', 400)}}</p>
+
+<h2 id="Propiedades_aplicadas_a_los_ítems_flex">Propiedades aplicadas a los ítems flex</h2>
+
+<p>Para obtener más control sobre los ítems flex podemos apuntarlos directamente. Hacemos esto a través de tres propiedades:</p>
+
+<ul>
+ <li>{{cssxref("flex-grow")}}</li>
+ <li>{{cssxref("flex-shrink")}}</li>
+ <li>{{cssxref("flex-basis")}}</li>
+</ul>
+
+<p>Daremos un breve vistazo a estas propiedades en este resumen, y en un próximo artículo ahondaremos sobre su comportamiento.</p>
+
+<p>Antes de darle sentido a estas propiedades debemos considerar el concepto de <strong>espacio disponible</strong>. Lo que hacemos cuando cambiamos el valor de alguna de estas propiedades es cambiar la forma que se distribuye el espacio disponible entre nuestros ítems. Este concepto de espacio disponible es también importante cuando veamos la alineación de ítems.</p>
+
+<p>Si tenemos tres ítems con un ancho de 100 pixeles en un contenedor de 500 pixeles de ancho, entonces el espacio que se necesita para colocar nuestros ítems es de 300 pixeles. Esto deja 200 pixeles de espacio disponible. Si no cambiamos los valores iniciales entonces flexbox colocará ese espacio después del último ítem.</p>
+
+<p><img alt="This flex container has available space after laying out the items." src="https://mdn.mozillademos.org/files/15620/Basics7.png" style="display: block; height: 198px; margin: 0px auto; width: 528px;"></p>
+
+<p>Si en cambio quisiéramos que los ítems crecieran para llenar ese espacio, entonces necesitaremos un método para distribuir el espacio sobrante entre los ítems. Es justo lo que harán las propiedades <code>flex</code> que aplicaremos a dichos ítems.</p>
+
+<h3 id="La_propiedad_flex-basis">La propiedad <code>flex-basis</code></h3>
+
+<p>Con <code>flex-basis</code> se define el tamaño de un ítem en términos del espacio que deja como espacio disponible. El valor inicial de esta propiedad es <code>auto</code> — en este caso el navegador revisa si los ítems definen un tamaño. En el ejemplo de arriba, todos los ítems tienen un ancho de 100 pixeles así que este es usado como <code>flex-basis</code>.</p>
+
+<p>Si los ítems no tiene un tamaño entonces el tamaño de su contenido es usado como flex-basis. Y por eso, apenas declarado <code>display: flex</code> en el padre a fin de crear ítems flex, todos estos ítems se ubicaron en una sola fila y tomaron solo el espacio necesario para desplegar su contenido.</p>
+
+<h3 id="La_propiedad_flex-grow">La propiedad <code>flex-grow</code></h3>
+
+<p>Con la propiedad <code>flex-grow</code> definida como un entero positivo, los ítems flex pueden crecer en el eje principal a partir de <code>flex-basis</code>. Esto hará que el ítem se ajuste y tome todo el espacio disponible del eje, o una proporción del espacio disponible si otro ítem también puede crecer.</p>
+
+<p>Si le damos a todos los ítems del ejemplo anterior un valor <code>flex-grow</code> de 1 entonces el espacio disponible en el contenedor flex será compartido igualitariamente entre estos ítems y se ajustarán para llenar el contenedor sobre el eje principal.</p>
+
+<p>Podemos usar flex-grow apropiadamente para distribuir el espacio en proporciones. Si otorgamos al primer ítem un valor <code>flex-grow</code> de 2 y a los otros un valor de 1, entonces 2 partes serán dadas al primer ítem  (100px de 200px en el caso del ejemplo de arriba) y 1 parte para cada uno de los restantes (cada uno con 50px de los 200px en total).</p>
+
+<h3 id="La_propiedad_flex-shrink">La propiedad <code>flex-shrink</code></h3>
+
+<p>Así como la propiedad <code>flex-grow</code> se encarga de añadir espacio sobre el eje principal, la propiedad <code>flex-shrink</code> controla como se contrae. Si no contamos con suficiente espacio en el contenedor para colocar los ítems y <code>flex-shrink</code> posee un valor entero positivo, el ítem puede contraerse a partir de <code>flex-basis</code>. Así como podemos asignar diferentes valores de <code>flex-grow</code> con el fin que un ítem se expanda más rápido que otros — un ítem con un valor más alto de <code>flex-shrink</code> se contraerá más rápido que sus hermanos que poseen valores menores.</p>
+
+<p>El tamaño mínimo del ítem tendrá que ser considerado cuando se determine un valor de contracción que pueda funcionar, esto significa que flex-shrink tiene el potencial de comportarse menos consistentemente que flex-grow . Por lo tanto, haremos una revisión más detallada de cómo este algoritmo trabaja en el artículo Controlling Ratios de los ítems sobre el eje principal.</p>
+
+<div class="note">
+<p>Nótese que los valores de <code>flex-grow</code> y <code>flex-shrink</code> son proporciones. Típicamente si pusiéramos todos los ítems flex: <code>1 1 200px</code> y luego quisiéramos que un ítem creciera al doble, deberíamos ponerlo con flex: <code>2 1 200px</code>. Aunque igualmente podemos colocar flex: <code>10 1 200px</code> y flex: <code>20 1 200px</code> si quisiéramos.</p>
+</div>
+
+<h3 id="Valores_abreviados_para_las_propiedades_flex">Valores abreviados para las propiedades flex</h3>
+
+<p>Difícilmente veremos la propiedades <code>flex-grow</code>, <code>flex-shrink</code> y <code>flex-basis</code> usadas individualmente; si no que han sido combinadas en la abreviación {{cssxref("flex")}} . La abreviación <code>flex</code> permite establecer los tres valores en este orden: <code>flex-grow</code>, <code>flex-shrink</code>, <code>flex-basis</code>.</p>
+
+<p>El ejemplo en vivo de más abajo permite probar los diferentes valores de la abreviación flex; recuerde que el primer valor es <code>flex-grow</code>. Dándole un valor positivo significa que el ítem puede crecer. El segundo es <code>flex-shrink</code> — con un valor positivo los ítems pueden contraerse. El valor final es <code>flex-basis</code>; este es el valor que los ítems usan como valor base para crecer y contraerse.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-properties.html", '100%', 400)}}</p>
+
+<p>Hay además algunas abreviaturas de valores que cubren la mayoría de los casos de uso. Se ven con frecuencia utilizados en tutoriales, y en muchos casos es todo lo que necesitamos usar. Los valores predefinidos son los siguientes:</p>
+
+<ul>
+ <li><code>flex: initial</code></li>
+ <li><code>flex: auto</code></li>
+ <li><code>flex: none</code></li>
+ <li><code>flex: &lt;positive-number&gt;</code></li>
+</ul>
+
+<p>Fijando <code>flex: initial</code> el ítem se restablece con los valores iniciales de Flexbox. Es lo mismo que <code>flex: 0 1 auto</code>. En este caso el valor de <code>flex-grow</code> is 0, así que los ítems no crecerán más de su tamaño <code>flex-basis</code> . El valor <code>flex-shrink</code> es 1, así que los ítems pueden contraerse si es necesario en vez de salirse de los márgenes. El valor de <code>flex-basis</code> es <code>auto</code>. Los ítems pueden definir un tamaño en la dimensión del eje principal, o bien obtener su tamaño por el contenido del los mismos.</p>
+
+<p>Usar <code>flex: auto</code> es lo mismo que usar <code>flex: 1 1 auto</code> , es como con <code>flex:initial</code> pero en este caso los ítems pueden crecer y llenar el contendor así como encoger si se requiere.</p>
+
+<p>Al usar <code>flex: none</code> se crearán ítems flex totalmente inflexibles. Es como escribir <code>flex: 0 0 auto</code>. Los ítems no pueden ni crecer ni encoger pero serán colocados usando flexbox con <code>flex-basis</code> en <code>auto</code>.</p>
+
+<p>Una abreviación que es común en tutoriales es <code>flex: 1</code> o <code>flex: 2</code>  y más. Es como usar <code>flex: 1 1 0</code>. Los ítems pueden crecer o encoger con un <code>flex-basis</code> de 0.</p>
+
+<p>Pruebe estas abreviaciones de valores en el ejemplo en vivo de abajo.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-shorthands.html", '100%', 480)}}</p>
+
+<h2 id="Alineación_justificación_y_distribución_del_espacio_libre_entre_ítems">Alineación, justificación y distribución del espacio libre entre ítems</h2>
+
+<p>Una característica clave de flexbox es la capacidad de alinear y justificar ítems sobre los ejes principal y cruzado, y distribuir el espacio entre los ítems flex.</p>
+
+<h3 id="align-items"><code>align-items</code></h3>
+
+<p>La propiedad {{cssxref("align-items")}} alineará los ítems sobre el eje cruzado.</p>
+
+<p>El valor inicial para esta propiedad es <code>stretch</code> razón por la cual los ítems se ajustan por defecto a la altura de aquel más alto. En efecto se ajustan para llenar el contenedor flex — el ítem más alto define la altura de este.</p>
+
+<p>En cambio definimos <code>align-items</code> como <code>flex-start</code> para que los ítems se alineen al comienzo del contenedor flex, <code>flex-end</code> para alinearlos al final, o <code>center</code> para alinearlos al centro. Intente esto en el ejemplo en vivo — He definido en el contenedor flex una altura para que se aprecie que se pueden mover libremente dentro del contenedor. Vea lo que sucede si se coloca el valor align-items como:</p>
+
+<ul>
+ <li><code>stretch</code></li>
+ <li><code>flex-start</code></li>
+ <li><code>flex-end</code></li>
+ <li><code>center</code></li>
+</ul>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/align-items.html", '100%', 520)}}</p>
+
+<h3 id="justify-content"><code>justify-content</code></h3>
+
+<p>La propiedad {{cssxref("justify-content")}} es usada para alinear los ítems en el eje principal, cuyo <code>flex-direction</code> define la dirección del flujo. El valor inicial es <code>flex-start</code> que alineará los ítems al inicio del margen del contenedor, pero también se podría definir como <code>flex-end</code> para alinearlos al final, o <code>center</code> para alinearlos al centro.</p>
+
+<p>También podemos usar <code>space-between</code> para tomar todo el espacio sobrante después de que los ítems hayan sido colocados, y distribuir de forma pareja los ítems para que haya un espacio equitativo entre cada ítem. O bien, usamos el valor <code>space-around</code> para crear un espacio equitativo a la derecha e izquierda de cada ítem.</p>
+
+<p>Pruebe con los siguientes valores de<code>justify-content</code> en el ejemplo en vivo:</p>
+
+<ul>
+ <li><code>space-evenly</code></li>
+ <li><code>flex-start</code></li>
+ <li><code>flex-end</code></li>
+ <li><code>center</code></li>
+ <li><code>space-around</code></li>
+ <li><code>space-between</code></li>
+</ul>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/justify-content.html", '100%', 380)}}</p>
+
+<p>En un próximo artículo ahondaremos sobre estas propiedades, con el fin de obtener mejor entendimiento de cómo funcionan. Sin embargo, estos sencillos ejemplos serán útiles para la mayoría de los casos de uso.</p>
+
+<h2 id="Próximos_pasos">Próximos pasos</h2>
+
+<p>Al final de este artículo usted debería tener un entendimiento de las características básicas de Flexbox. En el próximo artículo veremos cómo esta especificación encaja con las otras partes de CSS.</p>
diff --git a/files/es/web/css/css_flexible_box_layout/casos_de_uso_tipicos_de_flexbox/index.html b/files/es/web/css/css_flexible_box_layout/casos_de_uso_tipicos_de_flexbox/index.html
deleted file mode 100644
index 9048cbb739..0000000000
--- a/files/es/web/css/css_flexible_box_layout/casos_de_uso_tipicos_de_flexbox/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: Casos de uso típicos de Flexbox
-slug: Web/CSS/CSS_Flexible_Box_Layout/Casos_de_uso_tipicos_de_Flexbox.
-translation_of: Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
----
-<p>{{CSSRef}}</p>
-
-<p class="summary">En esta guía, analizaremos algunos de los casos de uso comunes de flexbox, en aquellos lugares donde tiene más sentido que otro método de diseño.</p>
-
-<h2 id="¿Por_qué_elegir_flexbox">¿Por qué elegir flexbox?</h2>
-
-<p>En un mundo perfecto de compatibilidad con navegadores, la razón por la que elegiría utilizar flexbox es porque desea colocar una colección de elementos en una dirección u otra.  Estos son los usos para los que fue diseñado flexbox. Puede leer más sobre la diferencia entre flexbox y CSS Grid Layout en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Relationship_of_Flexbox_to_Other_Layout_Methods">Relación de Flexbox con respecto a otros métodos de diseño</a>, donde discutimos cómo encaja flexbox en la imagen general de CSS Layout.</p>
-
-<p>En realidad, a menudo también usamos Flexbox para trabajos que Grid Layout podría realizar mejor, como un respaldo para Grid, y también para obtener capacidades de alineación. Esto es algo que puede cambiar una vez que se implemente Box Alignment en Block Layout. En esta guía analizo algunas de las cosas típicas que podría usar flexbox hoy día.</p>
-
-<h2 id="Navegación">Navegación</h2>
-
-<p>Un patrón común para la navegación es tener una lista de elementos mostrada como una barra horizontal. Este patrón, tan básico como parece, era difícil de lograr antes de flexbox. Este es el ejemplo más simple de flexbox, y podría considerarse el caso ideal de uso de flexbox.</p>
-
-<p>Cuando tenemos un conjunto de elementos que queremos mostrar horizontalmente, podemos terminar con espacio adicional. Necesitamos decidir qué hacer con ese espacio y tener un par de opciones. O bien mostramos el espacio fuera de los elementos, los separamos, por consiguiente, con espacios en blanco entre ellos o alrededor de ellos, o absorbemos el espacio adicional dentro de los elementos, por lo tanto, necesitamos un método para permitir que los elementos crezcan y ocupen este espacio.</p>
-
-<h3 id="Espacio_distribuido_fuera_de_los_elementos">Espacio distribuido fuera de los elementos</h3>
-
-<p>Para distribuir el espacio entre o alrededor de los elementos, usamos las propiedades de alineación en flexbox y la propiedad {{cssxref ("justify-content")}}. Puede leer más sobre esta propiedad en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Container">Alinear elementos en un contenedor flexible</a>, que trata sobre la alineación de elementos en el eje principal.</p>
-
-<p>En el siguiente ejemplo en vivo, mostramos los elementos en su tamaño natural y utilizando <code>justify-content: space-between</code> crea cantidades iguales de espacio entre los elementos. Puede cambiar la forma en que se distribuye el espacio utilizando el valor <code>space-around</code>, o, donde sea compatible, <code>space-evenly</code>. También puede usar <code>flex-start</code> para colocar el espacio al final de los elementos, <code>flex-end</code> para colocarlo delante de ellos, o <code>center</code> para centrar los elementos de navegación.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/navigation.html", '100%', 550)}}</p>
-
-<h3 id="Espacio_distribuido_dentro_de_los_elementos">Espacio distribuido dentro de los elementos</h3>
-
-<p>Un patrón diferente para la navegación sería distribuir el espacio disponible dentro de los elementos, en lugar de crear un espacio entre ellos. En este caso, utilizaríamos las propiedades {{cssxref ("flex")}} para permitir que los elementos crezcan y se reduzcan en proporción entre sí, como se describe en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Control la proporción de elementos flexibles a lo largo del eje principal</a>.</p>
-
-<p>Si quisiera que todos mis elementos de navegación tuvieran el mismo ancho, entonces podría usar <code>flex: auto</code>, que es la abreviatura de <code>flex: 1 1 auto,</code> todos los elementos crecen y se contraen desde una flex-basis de auto. Esto significaría que el elemento más largo tendría más espacio.</p>
-
-<p>En el ejemplo en vivo a continuación, intente cambiar <code>flex: auto</code> a <code>flex: 1</code>. Esta es la abreviatura de <code>flex: 1 1 0</code> y hace que todos los elementos se vuelvan del mismo ancho, ya que están trabajando desde una flex-basis de 0 permitiendo que todo el espacio sea distribuido uniformemente.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/navigation-flex.html", '100%', 550)}}</p>
-
-<h2 id="Navegación_dividida">Navegación dividida</h2>
-
-<p>Otra forma de alinear elementos en el eje principal es usar márgenes automáticos. Esto permite el patrón de diseño de una barra de navegación donde un grupo de elementos se alinean a la izquierda y otro grupo se alinea a la derecha.</p>
-
-<p>Aquí estamos utilizando la técnica de márgenes automáticos descrita en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Container#Using_auto_margins_for_main_axis_alignment">Uso de márgenes automáticos para la alineación del eje principal</a>. Los elementos se alinean en el eje principal con <code>flex-start</code> ya que este es el comportamiento inicial de flexbox, y estamos alineando el elemento de la derecha dándole un margen izquierdo de auto. Puede mover la clase de un elemento a otro para cambiar dónde ocurre la división.</p>
-
-<p>También en este ejemplo, estamos utilizando márgenes en los elementos flexibles para crear un espacio entre los elementos, y un margen negativo en el contenedor para que los elementos aún permanezcan a nivel con los bordes derecho e izquierdo. Hasta que las propiedades <code>gap</code> de la especificación de alineación de caja sea implementada en flexbox, debemos usar márgenes de esta manera si queremos crear un margen entre los elementos.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/split-navigation.html", '100%', 550)}}</p>
-
-<h2 id="Centrar_elemento">Centrar elemento</h2>
-
-<p>Antes de flexbox, los desarrolladores bromeaban con que el problema más difícil en el diseño web era el centrado vertical. Esto ahora se ha hecho sencillo usando las propiedades de alineación en flexbox, como muestra el siguiente ejemplo en vivo.</p>
-
-<p>Puedes jugar con la alineación, alineando el elemento con el inicio con <code>flex-start</code> o al final con <code>flex-end</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/center.html", '100%', 700)}}</p>
-
-<p>Es posible que en el futuro no tengamos que crear un contenedor en un contenedor flexible solo para centrar un solo elemento, ya que las propiedades de Alineación de cuadro se implementarán en última instancia en el diseño del bloque. Por ahora, sin embargo, si necesita centrar correctamente una cosa dentro de otra, flexbox es la forma de hacerlo. Como en el ejemplo anterior, convierta un contenedor en un contenedor flexible y luego utilice <code>align-items</code> en el elemento principal o apunte el propio elemento de flexión con <code>align-self</code>.</p>
-
-<h2 id="Diseño_de_tarjeta_empujando_hacia_abajo_el_footer">Diseño de tarjeta empujando hacia abajo  el footer</h2>
-
-<p>Ya sea que use flexbox o CSS Grid para diseñar una lista de componentes de tarjeta, estos métodos de diseño solo funcionan en los elementos directos de los componentes flex o grid. Esto significa que si tiene cantidades variables de contenido, la tarjeta se extenderá hasta la altura del área de la cuadrícula o del contenedor flexible. Cualquier contenido interno usa un diseño de bloque regular, lo que significa que en una tarjeta con menos contenido, el pie de página subirá hasta la parte inferior del contenido en lugar de adherirse a la parte inferior de la tarjeta.</p>
-
-<p><img alt="Two card components showing that the internals of the component do not stretch with the wrapper." src="https://mdn.mozillademos.org/files/15669/flex-cards.png" style="height: 626px; width: 964px;"></p>
-
-<p>Flexbox puede resolver esto. Hacemos de la tarjeta un contenedor flexible, con  <code>{{cssxref ("flex-direction")}} :column</code>. A continuación, configuramos el área de contenido con <code>flex: 1</code>, que es la abreviatura de <code>flex: 1 1 0</code>; el elemento puede crecer y reducirse desde una base flexible de 0. Como este es el único elemento que puede crecer, ocupa todo el espacio disponible en el contenedor flexible y empuja el pie de página hacia abajo. Si elimina la propiedad <code>flex</code> del ejemplo en vivo, verá cómo el pie de página se mueve hacia arriba para sentarse directamente debajo del contenido.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/cards.html", '100%', 800)}}</p>
-
-<h2 id="Objetos_multimedia">Objetos multimedia</h2>
-
-<p>El objeto multimedia es un patrón común en el diseño web: este patrón tiene una imagen u otro elemento a un lado y el texto a la derecha. Idealmente, un objeto multimedia debería poder voltearse, moviendo la imagen de izquierda a derecha.</p>
-
-<p>Vemos este patrón en todas partes, usado para comentarios, y en cualquier lugar que necesitamos para mostrar imágenes y descripciones. Con flexbox podemos permitir que la parte del objeto multimedia que contiene la imagen tome su información de tamaño de la imagen, y luego el cuerpo del objeto multimedia se flexione para ocupar el espacio restante.</p>
-
-<p>En el ejemplo en vivo a continuación puedes ver nuestro objeto multimedia. He usado las propiedades de alineación para alinear los elementos en el eje transversal con <code>flex-start</code>, y luego establezco el elemento flex <code>.content</code> a <code>flex: 1</code>. Al igual que nuestra columna del patrón de la tarjeta de diseño anterior, usar <code>flex: 1</code> significa que esta parte de la tarjeta puede crecer.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/media.html", '100%', 600)}}</p>
-
-<p>Algunas de las cosas que podría querer probar en este ejemplo en vivo se relacionan con las diferentes formas en que podría desear restringir el objeto multimedia en su diseño.</p>
-
-<p>Para evitar que la imagen crezca demasiado, agregue un {{cssxref ("max-width")}} a la imagen. Como ese lado del objeto multimedia está usando los valores iniciales de flexbox, puede reducirse pero no crecer, y utiliza una <code>flex-basis</code> de auto. Cualquier {{cssxref ("ancho")}} o ancho máximo aplicado a la imagen se convertirá en la <code>flex-basis</code>.</p>
-
-<pre class="brush: css">.image img {
-  max-width: 100px;
-}
-</pre>
-
-<p>También puede permitir que ambos lados crezcan y se reduzcan en proporción. Si configura ambos lados a <code>flex: 1</code>, crecerán y se reducirán de una {{cssxref ("flex-basis")}} de 0, por lo que terminará con dos columnas de igual tamaño. Puede tomar el contenido como una guía y configurar ambos para <code>flex: auto</code>, en cuyo caso crecerían y se reducirían con el tamaño del contenido o cualquier tamaño aplicado directamente a los elementos de flexión, como el ancho de la imagen.</p>
-
-<pre class="brush: css">.media .content {
-  flex: 1;
-  padding: 10px;
-}
-
-.image {
-  flex: 1;
-}</pre>
-
-<p>También puede dar a cada lado diferentes factores {{cssxref ("flex-grow")}}, por ejemplo, configurando el lado con la imagen para <code>flex: 1</code> y el lado del contenido para <code>flex: 3</code>. Esto significará que usan una <code>flex-basis</code> de <code>0</code>, pero distribuye ese espacio a diferentes proporciones según el factor <code>flex-grow</code> que haya asignado. Las propiedades de flexión que utilizamos para hacer esto se describen en detalle en la guía <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Controlando las proporciones de elementos de flexión a lo largo del eje principal</a>.</p>
-
-<pre class="brush: css">.media .content {
-  flex: 3;
-  padding: 10px;
-}
-
-.image {
-  flex: 1;
-}</pre>
-
-<h3 id="Volteando_el_objeto_multimedia">Volteando el objeto multimedia</h3>
-
-<p>Para cambiar la visualización del objeto multimedia de modo que la imagen esté a la derecha y el contenido a la izquierda, podemos usar la propiedad <code>flex-direction</code> configurada para <code>row-reverse</code>. El objeto multimedia ahora se muestra al revés. He logrado esto en el ejemplo en vivo agregando una clase <code>flipped</code> junto con la clase existente <code>.media</code>. Esto significa que puede ver cómo cambia la pantalla eliminando esa clase del html.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/media-flipped.html", '100%', 650)}}</p>
-
-<h2 id="Controles_de_formulario">Controles de formulario</h2>
-
-<p>Flexbox es particularmente útil cuando se trata de estilos de controles de formularios. Los formularios tienen muchas marcas y muchos elementos pequeños que normalmente queremos alinear entre sí. Un patrón común es tener un elemento {{htmlelement ("input")}} asociado con un {{htmlelement ("button")}}, tal vez para un formulario de búsqueda o donde simplemente desea que su visitante ingrese una dirección de correo electrónico.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/input-button.html", '100%', 550)}}</p>
-
-<p>Puede agregar una etiqueta o un icono a la izquierda tan fácilmente como hicimos clic en el botón derecho. He añadido una etiqueta y aparte, algunos estilos de color de fondo, no tuve que cambiar el diseño. El campo de entrada extensible ahora tiene un poco menos de espacio para actuar, pero utiliza el espacio izquierdo después que se representaron los dos elementos.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/label-input-button.html", '100%', 550)}}</p>
-
-<p>Patrones como este pueden hacer que sea mucho más fácil crear una biblioteca de elementos de formulario para su diseño, que se adapte fácilmente a los elementos adicionales que se agregan. Está aprovechando la flexibilidad de flexbox al mezclar elementos que no crecen con los que lo hacen.</p>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>Mientras explora los patrones anteriores, es de esperar que haya empezado a ver cómo puede pensar en la mejor manera de utilizar flexbox para lograr el resultado que desea. Muy a menudo tienes más de una opción. Mezcle elementos que no puedan estirarse con aquellos que pueden, use el contenido para informar el tamaño o permita que flexbox comparta espacio en proporción. Tu decides.</p>
-
-<p>Piense en la mejor manera de presentar el contenido que tiene y luego vea cómo flexbox u otros métodos de diseño pueden ayudarlo a lograrlo.</p>
diff --git a/files/es/web/css/css_flexible_box_layout/conceptos_basicos_de_flexbox/index.html b/files/es/web/css/css_flexible_box_layout/conceptos_basicos_de_flexbox/index.html
deleted file mode 100644
index 38e89c7813..0000000000
--- a/files/es/web/css/css_flexible_box_layout/conceptos_basicos_de_flexbox/index.html
+++ /dev/null
@@ -1,227 +0,0 @@
----
-title: Conceptos Básicos de flexbox
-slug: Web/CSS/CSS_Flexible_Box_Layout/Conceptos_Basicos_de_Flexbox
-translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
----
-<div>{{CSSRef}}</div>
-
-<p class="summary">El Módulo de Caja Flexible, comúnmente llamado flexbox, fue diseñado como un modelo unidimensional de layout, y como un método que pueda ayudar a distribuir el espacio entre los ítems de una interfaz y mejorar las capacidades de alineación. Este artículo hace un repaso de las principales características de flexbox, las que exploraremos con mayor detalle en el resto de estas guías.</p>
-
-<p>Cuando describimos a flexbox como unidimensional destacamos el hecho que flexbox maneja el layout en una sola dimensión a la vez — ya sea como fila o como columna. Esto contrasta con el modelo bidimensional del <a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">Grid Layout de CSS</a>, el cual controla columnas y filas a la vez.</p>
-
-<p><span style='background-color: #333333; color: #ffffff; font-family: x-locale-heading-primary,zillaslab,Palatino,"Palatino Linotype",x-locale-heading-secondary,serif; font-size: 1.5rem;'>Los dos ejes de flexbox</span></p>
-
-<p>Cuando trabajamos con flexbox necesitamos pensar en términos de dos ejes — el eje principal y el eje cruzado. El eje principal está definido por la propiedad {{cssxref("flex-direction")}}, y el eje cruzado es perpendicular a este. Todo lo que hacemos con flexbox está referido a estos dos ejes, por lo que vale la pena entender cómo trabajan desde el principio.</p>
-
-<h3 id="El_eje_principal">El eje principal</h3>
-
-<p>El eje principal está definido por <code>flex-direction</code>, que posee cuatro posibles valores:</p>
-
-<ul>
- <li><code>row</code></li>
- <li><code>row-reverse</code></li>
- <li><code>column</code></li>
- <li><code>column-reverse</code></li>
-</ul>
-
-<p>Si elegimos <code>row</code> o <code>row-reverse</code>, el eje principal correrá a lo largo de la fila según la <strong>dirección de la línea </strong>.</p>
-
-<p><img alt="If flex-direction is set to row the main axis runs along the row in the inline direction." src="https://mdn.mozillademos.org/files/15614/Basics1.png" style="display: block; height: 152px; margin: 0px auto; width: 522px;"></p>
-
-<p>Al elegir <code>column</code> o <code>column-reverse</code> el eje principal correrá desde el borde superior de la página hasta el final — según la <strong>dirección del bloque</strong>.</p>
-
-<p><img alt="If flex-direction is set to column the main axis runs in the block direction." src="https://mdn.mozillademos.org/files/15615/Basics2.png" style="display: block; height: 227px; margin: 0px auto; width: 709px;"></p>
-
-<h3 id="El_eje_cruzado">El eje cruzado</h3>
-
-<p>El eje cruzado va perpendicular al eje principal, y por lo tanto si <code>flex-direction</code> (del eje principal) es <code>row</code> o <code>row-reverse</code> el eje cruzado irá por las columnas.</p>
-
-<p><img alt="If flex-direction is set to row then the cross axis runs in the block direction." src="https://mdn.mozillademos.org/files/15616/Basics3.png" style="display: block; height: 125px; margin: 0px auto; width: 666px;"></p>
-
-<p>Si el eje principal es <code>column</code> o <code>column-reverse</code> entonces el eje cruzado corre a lo largo de las filas.</p>
-
-<p><img alt="If flex-direction is set to column then the cross axis runs in the inline direction." src="https://mdn.mozillademos.org/files/15617/Basics4.png" style="display: block; height: 244px; margin: 0px auto; width: 523px;"></p>
-
-<p>Entender cuál eje es cuál es importante cuando empezamos a mirar la alineación y justificación flexible de los ítems; flexbox posee propiedades que permiten alinear y justificar el contenido sobre un eje o el otro.</p>
-
-<h2 id="Líneas_de_inicio_y_de_fin">Líneas de inicio y de fin</h2>
-
-<p>Otra área vital de entendimiento es cómo flexbox no hace suposiciones sobre la manera de escribir del documento. En el pasado, CSS estaba muy inclinado hacia el modo de escritura horizontal y de izquierda a derecha. Los métodos modernos de layout acogen la totalidad de modos de escritura así que no es necesario asumir que una línea de texto empezará arriba del documento y correrá de izquierda a derecha, con nuevas líneas dispuestas una abajo de la otra.</p>
-
-<p>Puede leer más acerca de la relación que hay entre flexbox y la especificación de los Modos de Escritura en un artículo posterior, sin embargo la siguiente descripción debería ayudar para explicar porqué no se habla de izquierda y derecha ni de arriba o abajo a la hora de describir la dirección en la que fluyen los ítems flex.</p>
-
-<p>Si <code>flex-direction</code> es <code>row</code> y estoy trabajando en español, entonces el margen inicial del eje principal quedará a la izquierda, y el margen final a la derecha.</p>
-
-<p><img alt="Working in English the start edge is on the left." src="https://mdn.mozillademos.org/files/15618/Basics5.png" style="display: block; height: 152px; margin: 0px auto; width: 631px;"></p>
-
-<p>Si fuera a trabajar en árabe, entonces el margen inicial de mi eje principal quedaría a la derecha y el margen final a la izquierda.</p>
-
-<p><img alt="The start edge in a RTL language is on the right." src="https://mdn.mozillademos.org/files/15619/Basics6.png" style="display: block; height: 152px; margin: 0px auto; width: 634px;"></p>
-
-<p>En ambos casos el margen inicial del eje cruzado estará en el extremo superior del contenedor flex y el margen final en el extremo inferior, ya que ambos idiomas tiene un modo de escritura horizontal.</p>
-
-<p>Después de un tiempo, pensar en inicial y final en vez de izquierda y derecha se hará natural, y será útil cuando interactúe con otros métodos de layout tales como el CSS Grid Layout que sigue los mismos patrones.</p>
-
-<h2 id="El_contenedor_flex">El contenedor flex</h2>
-
-<p>Un área del documento que contiene un flexbox es llamada <strong>contendedor flex</strong>. Para crear un contenedor flex, establecemos la propiedad del área del contenedor {{cssxref("display")}} como <code>flex</code> o <code>inline-flex</code>. Tan pronto como hacemos esto, los hijos directos de este contenedor se vuelven <strong>ítems flex</strong>. Como con todas las propiedades de CSS, se definen algunos valores iniciales, así que cuando creemos un contenedor flex todos los ítems flex contenidos se comportarán de la siguiente manera.</p>
-
-<ul>
- <li>Los ítems se despliegan sobre una fila (la propiedad <code>flex-direction</code> por defecto es <code>row</code>).</li>
- <li>Los ítems empiezan desde el margen inicial sobre el eje principal.</li>
- <li>Los ítems no se ajustan en la dimensión principal, pero se pueden contraer.</li>
- <li>Los ítems se ajustarán para llenar el tamaño del eje cruzado.</li>
- <li>La propiedad {{cssxref("flex-basis")}} es definida como <code>auto</code>.</li>
- <li>La propiedad {{cssxref("flex-wrap")}} es definida como <code>nowrap</code>.</li>
-</ul>
-
-<p>El resultado es que todos los ítems se alinearán en una solo fila, usando el tamaño del contenedor como su tamaño en el eje principal. Si hay más ítems de los que caben en el contenedor, estos no pasarán más abajo si no que sobrepasarán el margen. Si hay ítems más altos que otros, todos los ítems serán ajustados en el eje cruzado para alcanzar al mayor.</p>
-
-<p>Se puede ver en el ejercicio en vivo de abajo cómo luce. Intente editar el ítem o añadir ítems adicionales para así probar el comportamiento inicial de flexbox.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/the-flex-container.html", '100%', 480)}} </p>
-
-<h3 id="Cambiar_flex-direction">Cambiar flex-direction</h3>
-
-<p>Al añadir la propiedad {{cssxref("flex-direction")}} en el contenedor flex nos permite cambiar la dirección de cómo los ítems son desplegados. Colocando <code>flex-direction: row-reverse</code> se mantendrá el despliegue a lo largo de la fila, sin embargo el inicio y final quedarán al revés del original.</p>
-
-<p>Si cambiamos <code>flex-direction</code> a <code>column</code> el eje principal se cambiará y los ítems aparecerán en una columna. Colocando <code>column-reverse</code> las líneas de inicio y fin serán nuevamente puestas al revés.</p>
-
-<p>El ejemplo en vivo de abajo tiene <code>flex-direction</code> puesto como <code>row-reverse</code>. Pruebe los otros valores — <code>row</code>, <code>column</code> y <code>column-reverse</code> — para ver qué sucede con el contenido.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-direction.html", '100%', 350)}}</p>
-
-<h2 id="Contenedores_flex_Multi-línea_con_flex-wrap">Contenedores flex Multi-línea con flex-wrap</h2>
-
-<p>Si bien flexbox es un modelo unidimensional, es posible lograr que nuestros ítems flex sean repartidos en varías líneas. Haciendo esto, se deberá considerar cada línea como un nuevo contenedor flex. Cualquier distribución del espacio solo sucederá dentro de esa línea, sin referenciar las líneas colaterales.</p>
-
-<p>Para lograr repartirse en varias líneas añada la propiedad {{cssxref("flex-wrap")}} con el valor <code>wrap</code>. Cuando los ítems sean demasiados para desplegarlos en una línea, serán repartidos en la línea siguiente. El ejemplo en vivo de abajo contiene ítems que se les ha asignando un ancho, donde el ancho total de los ítems excede al del contenedor flex. Cuando <code>flex-wrap</code> se coloca como <code>wrap</code>, los ítems se repartirán. Al colocarlo como <code>nowrap</code>, el cual es el valor inicial, estos se contraerán para calzar con el contenedor ya que usan los valores iniciales de flexbox que permiten que los ítems se contraigan. Al usar <code>nowrap</code> los ítems podrían salirse del margen si estos no pudieran contraerse, o no contraerse lo suficiente para ser calzados.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-wrap.html", '100%', 400)}}</p>
-
-<h2 id="La_abreviatura_flex-flow">La abreviatura flex-flow</h2>
-
-<p>Se pueden combinar las propiedades <code>flex-direction</code> y <code>flex-wrap</code> en la abreviatura {{cssxref("flex-flow")}} . El primer valor especificado es <code>flex-direction</code> y el segundo valor es <code>flex-wrap</code>.</p>
-
-<p>En el ejemplo en vivo de abajo intente cambiar el primer valor por uno de los valores permitidos para <code>flex-direction</code> - <code>row</code>, <code>row-reverse</code>, <code>column</code> o <code>column-reverse</code>, y cambie también el segundo valor por <code>wrap</code> y <code>nowrap</code>.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-flow.html", '100%', 400)}}</p>
-
-<h2 id="Propiedades_aplicadas_a_los_ítems_flex">Propiedades aplicadas a los ítems flex</h2>
-
-<p>Para obtener más control sobre los ítems flex podemos apuntarlos directamente. Hacemos esto a través de tres propiedades:</p>
-
-<ul>
- <li>{{cssxref("flex-grow")}}</li>
- <li>{{cssxref("flex-shrink")}}</li>
- <li>{{cssxref("flex-basis")}}</li>
-</ul>
-
-<p>Daremos un breve vistazo a estas propiedades en este resumen, y en un próximo artículo ahondaremos sobre su comportamiento.</p>
-
-<p>Antes de darle sentido a estas propiedades debemos considerar el concepto de <strong>espacio disponible</strong>. Lo que hacemos cuando cambiamos el valor de alguna de estas propiedades es cambiar la forma que se distribuye el espacio disponible entre nuestros ítems. Este concepto de espacio disponible es también importante cuando veamos la alineación de ítems.</p>
-
-<p>Si tenemos tres ítems con un ancho de 100 pixeles en un contenedor de 500 pixeles de ancho, entonces el espacio que se necesita para colocar nuestros ítems es de 300 pixeles. Esto deja 200 pixeles de espacio disponible. Si no cambiamos los valores iniciales entonces flexbox colocará ese espacio después del último ítem.</p>
-
-<p><img alt="This flex container has available space after laying out the items." src="https://mdn.mozillademos.org/files/15620/Basics7.png" style="display: block; height: 198px; margin: 0px auto; width: 528px;"></p>
-
-<p>Si en cambio quisiéramos que los ítems crecieran para llenar ese espacio, entonces necesitaremos un método para distribuir el espacio sobrante entre los ítems. Es justo lo que harán las propiedades <code>flex</code> que aplicaremos a dichos ítems.</p>
-
-<h3 id="La_propiedad_flex-basis">La propiedad <code>flex-basis</code></h3>
-
-<p>Con <code>flex-basis</code> se define el tamaño de un ítem en términos del espacio que deja como espacio disponible. El valor inicial de esta propiedad es <code>auto</code> — en este caso el navegador revisa si los ítems definen un tamaño. En el ejemplo de arriba, todos los ítems tienen un ancho de 100 pixeles así que este es usado como <code>flex-basis</code>.</p>
-
-<p>Si los ítems no tiene un tamaño entonces el tamaño de su contenido es usado como flex-basis. Y por eso, apenas declarado <code>display: flex</code> en el padre a fin de crear ítems flex, todos estos ítems se ubicaron en una sola fila y tomaron solo el espacio necesario para desplegar su contenido.</p>
-
-<h3 id="La_propiedad_flex-grow">La propiedad <code>flex-grow</code></h3>
-
-<p>Con la propiedad <code>flex-grow</code> definida como un entero positivo, los ítems flex pueden crecer en el eje principal a partir de <code>flex-basis</code>. Esto hará que el ítem se ajuste y tome todo el espacio disponible del eje, o una proporción del espacio disponible si otro ítem también puede crecer.</p>
-
-<p>Si le damos a todos los ítems del ejemplo anterior un valor <code>flex-grow</code> de 1 entonces el espacio disponible en el contenedor flex será compartido igualitariamente entre estos ítems y se ajustarán para llenar el contenedor sobre el eje principal.</p>
-
-<p>Podemos usar flex-grow apropiadamente para distribuir el espacio en proporciones. Si otorgamos al primer ítem un valor <code>flex-grow</code> de 2 y a los otros un valor de 1, entonces 2 partes serán dadas al primer ítem  (100px de 200px en el caso del ejemplo de arriba) y 1 parte para cada uno de los restantes (cada uno con 50px de los 200px en total).</p>
-
-<h3 id="La_propiedad_flex-shrink">La propiedad <code>flex-shrink</code></h3>
-
-<p>Así como la propiedad <code>flex-grow</code> se encarga de añadir espacio sobre el eje principal, la propiedad <code>flex-shrink</code> controla como se contrae. Si no contamos con suficiente espacio en el contenedor para colocar los ítems y <code>flex-shrink</code> posee un valor entero positivo, el ítem puede contraerse a partir de <code>flex-basis</code>. Así como podemos asignar diferentes valores de <code>flex-grow</code> con el fin que un ítem se expanda más rápido que otros — un ítem con un valor más alto de <code>flex-shrink</code> se contraerá más rápido que sus hermanos que poseen valores menores.</p>
-
-<p>El tamaño mínimo del ítem tendrá que ser considerado cuando se determine un valor de contracción que pueda funcionar, esto significa que flex-shrink tiene el potencial de comportarse menos consistentemente que flex-grow . Por lo tanto, haremos una revisión más detallada de cómo este algoritmo trabaja en el artículo Controlling Ratios de los ítems sobre el eje principal.</p>
-
-<div class="note">
-<p>Nótese que los valores de <code>flex-grow</code> y <code>flex-shrink</code> son proporciones. Típicamente si pusiéramos todos los ítems flex: <code>1 1 200px</code> y luego quisiéramos que un ítem creciera al doble, deberíamos ponerlo con flex: <code>2 1 200px</code>. Aunque igualmente podemos colocar flex: <code>10 1 200px</code> y flex: <code>20 1 200px</code> si quisiéramos.</p>
-</div>
-
-<h3 id="Valores_abreviados_para_las_propiedades_flex">Valores abreviados para las propiedades flex</h3>
-
-<p>Difícilmente veremos la propiedades <code>flex-grow</code>, <code>flex-shrink</code> y <code>flex-basis</code> usadas individualmente; si no que han sido combinadas en la abreviación {{cssxref("flex")}} . La abreviación <code>flex</code> permite establecer los tres valores en este orden: <code>flex-grow</code>, <code>flex-shrink</code>, <code>flex-basis</code>.</p>
-
-<p>El ejemplo en vivo de más abajo permite probar los diferentes valores de la abreviación flex; recuerde que el primer valor es <code>flex-grow</code>. Dándole un valor positivo significa que el ítem puede crecer. El segundo es <code>flex-shrink</code> — con un valor positivo los ítems pueden contraerse. El valor final es <code>flex-basis</code>; este es el valor que los ítems usan como valor base para crecer y contraerse.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-properties.html", '100%', 400)}}</p>
-
-<p>Hay además algunas abreviaturas de valores que cubren la mayoría de los casos de uso. Se ven con frecuencia utilizados en tutoriales, y en muchos casos es todo lo que necesitamos usar. Los valores predefinidos son los siguientes:</p>
-
-<ul>
- <li><code>flex: initial</code></li>
- <li><code>flex: auto</code></li>
- <li><code>flex: none</code></li>
- <li><code>flex: &lt;positive-number&gt;</code></li>
-</ul>
-
-<p>Fijando <code>flex: initial</code> el ítem se restablece con los valores iniciales de Flexbox. Es lo mismo que <code>flex: 0 1 auto</code>. En este caso el valor de <code>flex-grow</code> is 0, así que los ítems no crecerán más de su tamaño <code>flex-basis</code> . El valor <code>flex-shrink</code> es 1, así que los ítems pueden contraerse si es necesario en vez de salirse de los márgenes. El valor de <code>flex-basis</code> es <code>auto</code>. Los ítems pueden definir un tamaño en la dimensión del eje principal, o bien obtener su tamaño por el contenido del los mismos.</p>
-
-<p>Usar <code>flex: auto</code> es lo mismo que usar <code>flex: 1 1 auto</code> , es como con <code>flex:initial</code> pero en este caso los ítems pueden crecer y llenar el contendor así como encoger si se requiere.</p>
-
-<p>Al usar <code>flex: none</code> se crearán ítems flex totalmente inflexibles. Es como escribir <code>flex: 0 0 auto</code>. Los ítems no pueden ni crecer ni encoger pero serán colocados usando flexbox con <code>flex-basis</code> en <code>auto</code>.</p>
-
-<p>Una abreviación que es común en tutoriales es <code>flex: 1</code> o <code>flex: 2</code>  y más. Es como usar <code>flex: 1 1 0</code>. Los ítems pueden crecer o encoger con un <code>flex-basis</code> de 0.</p>
-
-<p>Pruebe estas abreviaciones de valores en el ejemplo en vivo de abajo.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/flex-shorthands.html", '100%', 480)}}</p>
-
-<h2 id="Alineación_justificación_y_distribución_del_espacio_libre_entre_ítems">Alineación, justificación y distribución del espacio libre entre ítems</h2>
-
-<p>Una característica clave de flexbox es la capacidad de alinear y justificar ítems sobre los ejes principal y cruzado, y distribuir el espacio entre los ítems flex.</p>
-
-<h3 id="align-items"><code>align-items</code></h3>
-
-<p>La propiedad {{cssxref("align-items")}} alineará los ítems sobre el eje cruzado.</p>
-
-<p>El valor inicial para esta propiedad es <code>stretch</code> razón por la cual los ítems se ajustan por defecto a la altura de aquel más alto. En efecto se ajustan para llenar el contenedor flex — el ítem más alto define la altura de este.</p>
-
-<p>En cambio definimos <code>align-items</code> como <code>flex-start</code> para que los ítems se alineen al comienzo del contenedor flex, <code>flex-end</code> para alinearlos al final, o <code>center</code> para alinearlos al centro. Intente esto en el ejemplo en vivo — He definido en el contenedor flex una altura para que se aprecie que se pueden mover libremente dentro del contenedor. Vea lo que sucede si se coloca el valor align-items como:</p>
-
-<ul>
- <li><code>stretch</code></li>
- <li><code>flex-start</code></li>
- <li><code>flex-end</code></li>
- <li><code>center</code></li>
-</ul>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/align-items.html", '100%', 520)}}</p>
-
-<h3 id="justify-content"><code>justify-content</code></h3>
-
-<p>La propiedad {{cssxref("justify-content")}} es usada para alinear los ítems en el eje principal, cuyo <code>flex-direction</code> define la dirección del flujo. El valor inicial es <code>flex-start</code> que alineará los ítems al inicio del margen del contenedor, pero también se podría definir como <code>flex-end</code> para alinearlos al final, o <code>center</code> para alinearlos al centro.</p>
-
-<p>También podemos usar <code>space-between</code> para tomar todo el espacio sobrante después de que los ítems hayan sido colocados, y distribuir de forma pareja los ítems para que haya un espacio equitativo entre cada ítem. O bien, usamos el valor <code>space-around</code> para crear un espacio equitativo a la derecha e izquierda de cada ítem.</p>
-
-<p>Pruebe con los siguientes valores de<code>justify-content</code> en el ejemplo en vivo:</p>
-
-<ul>
- <li><code>space-evenly</code></li>
- <li><code>flex-start</code></li>
- <li><code>flex-end</code></li>
- <li><code>center</code></li>
- <li><code>space-around</code></li>
- <li><code>space-between</code></li>
-</ul>
-
-<p>{{EmbedGHLiveSample("css-examples/flexbox/basics/justify-content.html", '100%', 380)}}</p>
-
-<p>En un próximo artículo ahondaremos sobre estas propiedades, con el fin de obtener mejor entendimiento de cómo funcionan. Sin embargo, estos sencillos ejemplos serán útiles para la mayoría de los casos de uso.</p>
-
-<h2 id="Próximos_pasos">Próximos pasos</h2>
-
-<p>Al final de este artículo usted debería tener un entendimiento de las características básicas de Flexbox. En el próximo artículo veremos cómo esta especificación encaja con las otras partes de CSS.</p>
diff --git a/files/es/web/css/css_flexible_box_layout/typical_use_cases_of_flexbox/index.html b/files/es/web/css/css_flexible_box_layout/typical_use_cases_of_flexbox/index.html
new file mode 100644
index 0000000000..ea9c05e7ff
--- /dev/null
+++ b/files/es/web/css/css_flexible_box_layout/typical_use_cases_of_flexbox/index.html
@@ -0,0 +1,134 @@
+---
+title: Casos de uso típicos de Flexbox
+slug: Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
+translation_of: Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
+original_slug: Web/CSS/CSS_Flexible_Box_Layout/Casos_de_uso_tipicos_de_Flexbox.
+---
+<p>{{CSSRef}}</p>
+
+<p class="summary">En esta guía, analizaremos algunos de los casos de uso comunes de flexbox, en aquellos lugares donde tiene más sentido que otro método de diseño.</p>
+
+<h2 id="¿Por_qué_elegir_flexbox">¿Por qué elegir flexbox?</h2>
+
+<p>En un mundo perfecto de compatibilidad con navegadores, la razón por la que elegiría utilizar flexbox es porque desea colocar una colección de elementos en una dirección u otra.  Estos son los usos para los que fue diseñado flexbox. Puede leer más sobre la diferencia entre flexbox y CSS Grid Layout en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Relationship_of_Flexbox_to_Other_Layout_Methods">Relación de Flexbox con respecto a otros métodos de diseño</a>, donde discutimos cómo encaja flexbox en la imagen general de CSS Layout.</p>
+
+<p>En realidad, a menudo también usamos Flexbox para trabajos que Grid Layout podría realizar mejor, como un respaldo para Grid, y también para obtener capacidades de alineación. Esto es algo que puede cambiar una vez que se implemente Box Alignment en Block Layout. En esta guía analizo algunas de las cosas típicas que podría usar flexbox hoy día.</p>
+
+<h2 id="Navegación">Navegación</h2>
+
+<p>Un patrón común para la navegación es tener una lista de elementos mostrada como una barra horizontal. Este patrón, tan básico como parece, era difícil de lograr antes de flexbox. Este es el ejemplo más simple de flexbox, y podría considerarse el caso ideal de uso de flexbox.</p>
+
+<p>Cuando tenemos un conjunto de elementos que queremos mostrar horizontalmente, podemos terminar con espacio adicional. Necesitamos decidir qué hacer con ese espacio y tener un par de opciones. O bien mostramos el espacio fuera de los elementos, los separamos, por consiguiente, con espacios en blanco entre ellos o alrededor de ellos, o absorbemos el espacio adicional dentro de los elementos, por lo tanto, necesitamos un método para permitir que los elementos crezcan y ocupen este espacio.</p>
+
+<h3 id="Espacio_distribuido_fuera_de_los_elementos">Espacio distribuido fuera de los elementos</h3>
+
+<p>Para distribuir el espacio entre o alrededor de los elementos, usamos las propiedades de alineación en flexbox y la propiedad {{cssxref ("justify-content")}}. Puede leer más sobre esta propiedad en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Container">Alinear elementos en un contenedor flexible</a>, que trata sobre la alineación de elementos en el eje principal.</p>
+
+<p>En el siguiente ejemplo en vivo, mostramos los elementos en su tamaño natural y utilizando <code>justify-content: space-between</code> crea cantidades iguales de espacio entre los elementos. Puede cambiar la forma en que se distribuye el espacio utilizando el valor <code>space-around</code>, o, donde sea compatible, <code>space-evenly</code>. También puede usar <code>flex-start</code> para colocar el espacio al final de los elementos, <code>flex-end</code> para colocarlo delante de ellos, o <code>center</code> para centrar los elementos de navegación.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/navigation.html", '100%', 550)}}</p>
+
+<h3 id="Espacio_distribuido_dentro_de_los_elementos">Espacio distribuido dentro de los elementos</h3>
+
+<p>Un patrón diferente para la navegación sería distribuir el espacio disponible dentro de los elementos, en lugar de crear un espacio entre ellos. En este caso, utilizaríamos las propiedades {{cssxref ("flex")}} para permitir que los elementos crezcan y se reduzcan en proporción entre sí, como se describe en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Control la proporción de elementos flexibles a lo largo del eje principal</a>.</p>
+
+<p>Si quisiera que todos mis elementos de navegación tuvieran el mismo ancho, entonces podría usar <code>flex: auto</code>, que es la abreviatura de <code>flex: 1 1 auto,</code> todos los elementos crecen y se contraen desde una flex-basis de auto. Esto significaría que el elemento más largo tendría más espacio.</p>
+
+<p>En el ejemplo en vivo a continuación, intente cambiar <code>flex: auto</code> a <code>flex: 1</code>. Esta es la abreviatura de <code>flex: 1 1 0</code> y hace que todos los elementos se vuelvan del mismo ancho, ya que están trabajando desde una flex-basis de 0 permitiendo que todo el espacio sea distribuido uniformemente.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/navigation-flex.html", '100%', 550)}}</p>
+
+<h2 id="Navegación_dividida">Navegación dividida</h2>
+
+<p>Otra forma de alinear elementos en el eje principal es usar márgenes automáticos. Esto permite el patrón de diseño de una barra de navegación donde un grupo de elementos se alinean a la izquierda y otro grupo se alinea a la derecha.</p>
+
+<p>Aquí estamos utilizando la técnica de márgenes automáticos descrita en <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Container#Using_auto_margins_for_main_axis_alignment">Uso de márgenes automáticos para la alineación del eje principal</a>. Los elementos se alinean en el eje principal con <code>flex-start</code> ya que este es el comportamiento inicial de flexbox, y estamos alineando el elemento de la derecha dándole un margen izquierdo de auto. Puede mover la clase de un elemento a otro para cambiar dónde ocurre la división.</p>
+
+<p>También en este ejemplo, estamos utilizando márgenes en los elementos flexibles para crear un espacio entre los elementos, y un margen negativo en el contenedor para que los elementos aún permanezcan a nivel con los bordes derecho e izquierdo. Hasta que las propiedades <code>gap</code> de la especificación de alineación de caja sea implementada en flexbox, debemos usar márgenes de esta manera si queremos crear un margen entre los elementos.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/split-navigation.html", '100%', 550)}}</p>
+
+<h2 id="Centrar_elemento">Centrar elemento</h2>
+
+<p>Antes de flexbox, los desarrolladores bromeaban con que el problema más difícil en el diseño web era el centrado vertical. Esto ahora se ha hecho sencillo usando las propiedades de alineación en flexbox, como muestra el siguiente ejemplo en vivo.</p>
+
+<p>Puedes jugar con la alineación, alineando el elemento con el inicio con <code>flex-start</code> o al final con <code>flex-end</code>.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/center.html", '100%', 700)}}</p>
+
+<p>Es posible que en el futuro no tengamos que crear un contenedor en un contenedor flexible solo para centrar un solo elemento, ya que las propiedades de Alineación de cuadro se implementarán en última instancia en el diseño del bloque. Por ahora, sin embargo, si necesita centrar correctamente una cosa dentro de otra, flexbox es la forma de hacerlo. Como en el ejemplo anterior, convierta un contenedor en un contenedor flexible y luego utilice <code>align-items</code> en el elemento principal o apunte el propio elemento de flexión con <code>align-self</code>.</p>
+
+<h2 id="Diseño_de_tarjeta_empujando_hacia_abajo_el_footer">Diseño de tarjeta empujando hacia abajo  el footer</h2>
+
+<p>Ya sea que use flexbox o CSS Grid para diseñar una lista de componentes de tarjeta, estos métodos de diseño solo funcionan en los elementos directos de los componentes flex o grid. Esto significa que si tiene cantidades variables de contenido, la tarjeta se extenderá hasta la altura del área de la cuadrícula o del contenedor flexible. Cualquier contenido interno usa un diseño de bloque regular, lo que significa que en una tarjeta con menos contenido, el pie de página subirá hasta la parte inferior del contenido en lugar de adherirse a la parte inferior de la tarjeta.</p>
+
+<p><img alt="Two card components showing that the internals of the component do not stretch with the wrapper." src="https://mdn.mozillademos.org/files/15669/flex-cards.png" style="height: 626px; width: 964px;"></p>
+
+<p>Flexbox puede resolver esto. Hacemos de la tarjeta un contenedor flexible, con  <code>{{cssxref ("flex-direction")}} :column</code>. A continuación, configuramos el área de contenido con <code>flex: 1</code>, que es la abreviatura de <code>flex: 1 1 0</code>; el elemento puede crecer y reducirse desde una base flexible de 0. Como este es el único elemento que puede crecer, ocupa todo el espacio disponible en el contenedor flexible y empuja el pie de página hacia abajo. Si elimina la propiedad <code>flex</code> del ejemplo en vivo, verá cómo el pie de página se mueve hacia arriba para sentarse directamente debajo del contenido.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/cards.html", '100%', 800)}}</p>
+
+<h2 id="Objetos_multimedia">Objetos multimedia</h2>
+
+<p>El objeto multimedia es un patrón común en el diseño web: este patrón tiene una imagen u otro elemento a un lado y el texto a la derecha. Idealmente, un objeto multimedia debería poder voltearse, moviendo la imagen de izquierda a derecha.</p>
+
+<p>Vemos este patrón en todas partes, usado para comentarios, y en cualquier lugar que necesitamos para mostrar imágenes y descripciones. Con flexbox podemos permitir que la parte del objeto multimedia que contiene la imagen tome su información de tamaño de la imagen, y luego el cuerpo del objeto multimedia se flexione para ocupar el espacio restante.</p>
+
+<p>En el ejemplo en vivo a continuación puedes ver nuestro objeto multimedia. He usado las propiedades de alineación para alinear los elementos en el eje transversal con <code>flex-start</code>, y luego establezco el elemento flex <code>.content</code> a <code>flex: 1</code>. Al igual que nuestra columna del patrón de la tarjeta de diseño anterior, usar <code>flex: 1</code> significa que esta parte de la tarjeta puede crecer.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/media.html", '100%', 600)}}</p>
+
+<p>Algunas de las cosas que podría querer probar en este ejemplo en vivo se relacionan con las diferentes formas en que podría desear restringir el objeto multimedia en su diseño.</p>
+
+<p>Para evitar que la imagen crezca demasiado, agregue un {{cssxref ("max-width")}} a la imagen. Como ese lado del objeto multimedia está usando los valores iniciales de flexbox, puede reducirse pero no crecer, y utiliza una <code>flex-basis</code> de auto. Cualquier {{cssxref ("ancho")}} o ancho máximo aplicado a la imagen se convertirá en la <code>flex-basis</code>.</p>
+
+<pre class="brush: css">.image img {
+  max-width: 100px;
+}
+</pre>
+
+<p>También puede permitir que ambos lados crezcan y se reduzcan en proporción. Si configura ambos lados a <code>flex: 1</code>, crecerán y se reducirán de una {{cssxref ("flex-basis")}} de 0, por lo que terminará con dos columnas de igual tamaño. Puede tomar el contenido como una guía y configurar ambos para <code>flex: auto</code>, en cuyo caso crecerían y se reducirían con el tamaño del contenido o cualquier tamaño aplicado directamente a los elementos de flexión, como el ancho de la imagen.</p>
+
+<pre class="brush: css">.media .content {
+  flex: 1;
+  padding: 10px;
+}
+
+.image {
+  flex: 1;
+}</pre>
+
+<p>También puede dar a cada lado diferentes factores {{cssxref ("flex-grow")}}, por ejemplo, configurando el lado con la imagen para <code>flex: 1</code> y el lado del contenido para <code>flex: 3</code>. Esto significará que usan una <code>flex-basis</code> de <code>0</code>, pero distribuye ese espacio a diferentes proporciones según el factor <code>flex-grow</code> que haya asignado. Las propiedades de flexión que utilizamos para hacer esto se describen en detalle en la guía <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Controlando las proporciones de elementos de flexión a lo largo del eje principal</a>.</p>
+
+<pre class="brush: css">.media .content {
+  flex: 3;
+  padding: 10px;
+}
+
+.image {
+  flex: 1;
+}</pre>
+
+<h3 id="Volteando_el_objeto_multimedia">Volteando el objeto multimedia</h3>
+
+<p>Para cambiar la visualización del objeto multimedia de modo que la imagen esté a la derecha y el contenido a la izquierda, podemos usar la propiedad <code>flex-direction</code> configurada para <code>row-reverse</code>. El objeto multimedia ahora se muestra al revés. He logrado esto en el ejemplo en vivo agregando una clase <code>flipped</code> junto con la clase existente <code>.media</code>. Esto significa que puede ver cómo cambia la pantalla eliminando esa clase del html.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/media-flipped.html", '100%', 650)}}</p>
+
+<h2 id="Controles_de_formulario">Controles de formulario</h2>
+
+<p>Flexbox es particularmente útil cuando se trata de estilos de controles de formularios. Los formularios tienen muchas marcas y muchos elementos pequeños que normalmente queremos alinear entre sí. Un patrón común es tener un elemento {{htmlelement ("input")}} asociado con un {{htmlelement ("button")}}, tal vez para un formulario de búsqueda o donde simplemente desea que su visitante ingrese una dirección de correo electrónico.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/input-button.html", '100%', 550)}}</p>
+
+<p>Puede agregar una etiqueta o un icono a la izquierda tan fácilmente como hicimos clic en el botón derecho. He añadido una etiqueta y aparte, algunos estilos de color de fondo, no tuve que cambiar el diseño. El campo de entrada extensible ahora tiene un poco menos de espacio para actuar, pero utiliza el espacio izquierdo después que se representaron los dos elementos.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/flexbox/use-cases/label-input-button.html", '100%', 550)}}</p>
+
+<p>Patrones como este pueden hacer que sea mucho más fácil crear una biblioteca de elementos de formulario para su diseño, que se adapte fácilmente a los elementos adicionales que se agregan. Está aprovechando la flexibilidad de flexbox al mezclar elementos que no crecen con los que lo hacen.</p>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>Mientras explora los patrones anteriores, es de esperar que haya empezado a ver cómo puede pensar en la mejor manera de utilizar flexbox para lograr el resultado que desea. Muy a menudo tienes más de una opción. Mezcle elementos que no puedan estirarse con aquellos que pueden, use el contenido para informar el tamaño o permita que flexbox comparta espacio en proporción. Tu decides.</p>
+
+<p>Piense en la mejor manera de presentar el contenido que tiene y luego vea cómo flexbox u otros métodos de diseño pueden ayudarlo a lograrlo.</p>
diff --git a/files/es/web/css/css_flexible_box_layout/usando_flexbox_para_componer_aplicaciones_web/index.html b/files/es/web/css/css_flexible_box_layout/usando_flexbox_para_componer_aplicaciones_web/index.html
deleted file mode 100644
index e42553fe97..0000000000
--- a/files/es/web/css/css_flexible_box_layout/usando_flexbox_para_componer_aplicaciones_web/index.html
+++ /dev/null
@@ -1,191 +0,0 @@
----
-title: Usando flexbox para componer aplicaciones web
-slug: Web/CSS/CSS_Flexible_Box_Layout/Usando_flexbox_para_componer_aplicaciones_web
-tags:
-  - Avanzado
-  - CSS
-  - Cajas Flexibles CSS
-  - Ejemplo
-  - Guía
-  - Web
-translation_of: Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox
-translation_of_original: Web/CSS/CSS_Flexible_Box_Layout/Using_flexbox_to_lay_out_web_applications
----
-<p>{{CSSRef}}</p>
-
-<p>Usar <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">flexbox</a> puede ayudarte a diseñar atractivas composiciones en aplicaciones web que escalen mejor de escritorio a móvil. Pon fin a los elementos flotantes {{HTMLElement("div")}}, <a href="/en-US/docs/Web/CSS/position#Absolute_positioning">el posicionamiento absoluto</a>, y los <em>hacks</em> de JavaScript, y comienza a construir composiciones fluidas en horizontal y vertical en apenas unas líneas de <a href="/es/docs/Web/CSS">CSS</a>. Algunos ejemplos básicos de casos de uso:</p>
-
-<ul>
- <li>Quieres centrar un elemento en la mitad de una página</li>
- <li>Quieres un conjunto de contenedores que fluyan verticalmente, uno tras otro</li>
- <li>Quieres crear una fila de botones u otros elementos que colapse verticalmente en tamaños menores de pantalla</li>
-</ul>
-
-<p>Este artículo sólo aborda el uso de <em>flexbox</em> con navegadores que soportan la implementación moderna y sin prefijos del estándar. Para información sobre prefijos de proveedores para navegadores más antiguos, por favor lee <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">la guía más general para usar cajas flexibles de CSS</a>.</p>
-
-<h2 id="Conceptos_básicos">Conceptos básicos</h2>
-
-<p>Con flexbox puedes hacer que los elementos dentro de cualquier {{HTMLElement("div")}} fluyan estableciendo la propiedad {{cssxref("display")}} como <code>flex</code> y luego dando a la propiedad {{cssxref("flex-flow")}} el valor <code>row</code>, si deseas que los elementos fluyan horizontalmente, o el valor <code>column</code>, si quieres que lo hagan verticalmente. Si estás usando un flexbox horizontal y deseas que tus contenidos queden envueltos verticalmente, especifica además el valor <code>wrap</code>.</p>
-
-<p>Después, para cada elemento que desees sea parte del flujo de cajas, establece la propiedad {{cssxref("flex")}}. Generalmente querrás utilizar uno de los tres siguientes valores:</p>
-
-<ul>
- <li>Si quieres un elemento que sólo ocupa su ancho asignado, como un botón, utiliza <code>flex: none</code> que se expande a <code>0 0 auto</code>.</li>
- <li>Si deseas explícitamente dimensionar un elemento, usa <code>flex: 0 0 <em>tamaño</em></code>. Por ejemplo: <code>flex 0 0 60px</code>.</li>
- <li>Si necesitas un elemento que se expanda para rellenar el espacio disponible, compartiendo el espacio igualmente si hay múltiples elementos de este tipo dentro del flujo, utiliza <code>flex: auto</code>. Se expande a <code>1 1 auto</code>.</li>
-</ul>
-
-<p>Por supuesto, hay otras posibilidades, pero estas deberían cubrir los casos de uso básicos. Veamos cómo se aplica esto en algunos ejemplos.</p>
-
-<h2 id="Centrando_un_elemento_en_una_página">Centrando un elemento en una página</h2>
-
-<p>Para este caso, el método más sencillo es crear dos cajas flexibles, una dentro de otra. Cada flexbox tendrá tres elementos: dos de ellos conteniendo el elemento centrado y después el propio elemento centrado.</p>
-
-<h3 id="Contenido_CSS">Contenido CSS</h3>
-
-<pre class="brush: css;">.vertical-box {
-  display: flex;
-  height: 400px;
-  width: 400px;
-  flex-flow: column;
-}
-.horizontal-box {
-  display: flex;
-  flex-flow: row;
-}
-.spacer {
-  flex: auto;
-  background-color: black;
-}
-.centered-element {
-  flex: none;
-  background-color: white;
-}
-</pre>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush: html;">&lt;div class="vertical-box"&gt;
-  &lt;div class="spacer"&gt;&lt;/div&gt;
-  &lt;div class="centered-element horizontal-box"&gt;
-    &lt;div class="spacer"&gt;&lt;/div&gt;
-    &lt;div class="centered-element"&gt;Centered content&lt;/div&gt;
-     &lt;div class="spacer"&gt;&lt;/div&gt;
-  &lt;/div&gt;
-  &lt;div class="spacer"&gt;&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Centering_an_element_inside_a_page', 500, 500) }}</p>
-
-<h2 id="Haciendo_fluir_verticalmente_un_conjunto_de_contenedores">Haciendo fluir verticalmente un conjunto de contenedores</h2>
-
-<p>Imagina que tienes la composición de una página con una sección de cabecera, una de contenidos y un pie. La cabecera y el pie deberían tener un tamaño fijo, pero la sección de contenidos se debería redimensionar según el espacio disponible. Esto puede lograrse estableciendo la propiedad {{cssxref("flex")}} del contenido como <code>auto</code> y la misma propiedad {{cssxref("flex")}} de la cabecera y el pie como <code>none</code>.</p>
-
-<h3 id="Contenido_CSS_2">Contenido CSS</h3>
-
-<pre class="brush: css;highlight:[8,14,18]">.vertical-box {
-  display: flex;
-  height: 400px;
-  width: 400px;
-  flex-flow: column;
-}
-.fixed-size {
-  flex: none;
-  height: 30px;
-  background-color: black;
-  text-align: center;
-}
-.flexible-size {
-  flex: auto;
-  background-color: white;
-}
-</pre>
-
-<h3 id="Contenido_HTML_2">Contenido HTML</h3>
-
-<pre class="brush: html;">&lt;div id="document" class="vertical-box"&gt;
-  &lt;div class="fixed-size"&gt;&lt;button id="increase-size"&gt;Increase container size&lt;/button&gt;&lt;/div&gt;
-  &lt;div id="flexible-content" class="flexible-size"&gt;&lt;/div&gt;
-  &lt;div class="fixed-size"&gt;&lt;button id="decrease-size"&gt;Decrease container size&lt;/button&gt;&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
-
-<pre class="brush: js;">var height = 400;
-document.getElementById('increase-size').onclick=function() {
-  height += 10;
-  if (height &gt; 500) height = 500;
-  document.getElementById('document').style.height = (height + "px");
-}
-
-document.getElementById('decrease-size').onclick=function() {
-  height -= 10;
-  if (height &lt; 300) height = 300;
-  document.getElementById('document').style.height = (height + "px");
-}</pre>
-
-<h3 id="Resultado_2">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Flowing_a_set_of_containers_vertically', 500, 500) }}</p>
-
-<p>Este ejemplo se ha creado para que clicar en el encabezamiento incremente el tamaño y clicar en el pie lo reduzca. Observa cómo el contenido se redimensiona automática y adecuadamente, mientras las dimensiones del encabezamiento y el pie se mantienen constantes.</p>
-
-<h2 id="Creando_un_contenedor_que_colapse_horizontalmente">Creando un contenedor que colapse horizontalmente</h2>
-
-<p>En algunos casos podrías querer componer horizontalmente un conjunto de información donde el tamaño de pantalla lo permita, pero colapsar los contenidos horizontalmente donde no. Esto es bastate sencillo con flexbox. Puedes conseguirlo añadiendo a la propiedad {{cssxref("flex-flow")}} el valor <code>wrap</code>.</p>
-
-<h3 id="Contenido_CSS_3">Contenido CSS</h3>
-
-<pre class="brush: css;highlight:[4]">.horizontal-container {
-  display: flex;
-  width: 300px;
-  flex-flow: row wrap;
-}
-.fixed-size {
-  flex: none;
-  width: 100px;
-  background-color: black;
-  color: white;
-  text-align: center;
-}
-</pre>
-
-<h3 id="Contenido_HTML_3">Contenido HTML</h3>
-
-<pre class="brush: html;">&lt;div id="container" class="horizontal-container"&gt;
-  &lt;div class="fixed-size"&gt;Element 1&lt;/div&gt;
-  &lt;div class="fixed-size"&gt;Element 2&lt;/div&gt;
-  &lt;div class="fixed-size"&gt;Element 3&lt;/div&gt;
-&lt;/div&gt;&lt;button id="increase-size"&gt;Increase container size&lt;/button&gt;&lt;button id="decrease-size"&gt;Decrease container size&lt;/button&gt;
-</pre>
-
-<h3 id="Contenido_JavaScript_2">Contenido JavaScript</h3>
-
-<pre class="brush: js;">var width = 300;
-
-document.getElementById('increase-size').onclick=function() {
-  width += 100;
-  if (width &gt; 300) width = 300;
-  document.getElementById('container').style.width = (width + "px");
-}
-
-document.getElementById('decrease-size').onclick=function() {
-  width -= 100;
-  if (width &lt; 100) width = 100;
-  document.getElementById('container').style.width = (width + "px");
-}
-</pre>
-
-<h3 id="Resultado_3">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Creating_a_collapsing_horizontal_container', 500, 200) }}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">Usando cajas flexibles CSS</a></li>
-</ul>
diff --git a/files/es/web/css/css_flexible_box_layout/usando_las_cajas_flexibles_css/index.html b/files/es/web/css/css_flexible_box_layout/usando_las_cajas_flexibles_css/index.html
deleted file mode 100644
index dd39986ed4..0000000000
--- a/files/es/web/css/css_flexible_box_layout/usando_las_cajas_flexibles_css/index.html
+++ /dev/null
@@ -1,376 +0,0 @@
----
-title: Usando las cajas flexibles CSS
-slug: Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS
-translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox
-translation_of_original: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
----
-<div>{{CSSRef}}</div>
-
-<p><span class="seoSummary">La propiedad <strong>Flexible Box</strong>, o <strong>flexbox</strong>, de CSS3 es un <a href="https://developer.mozilla.org/es/docs/Web/CSS/Layout_mode">modo de diseño</a> que permite colocar los elementos de una página para que se comporten de forma predecible cuando el diseño de la página debe acomodarse a diferentes tamaños de pantalla y diferentes dispositivos. Para muchas aplicaciones, el modelo "caja flexible" produce una mejora sobre el modelo "bloque" porque no utiliza la propiedad <span style="font-family: courier new,andale mono,monospace;">float</span>, ni hace que los márgenes del contenedor flexible interfieran con los márgenes de sus contenidos.</span></p>
-
-<p>Muchos diseñadores verán que el modelo "caja flexible" es más sencillo de utilizar. Los elementos "hijos" de una "caja flexible" pueden colocarse en cualquier dirección y pueden tener dimensiones flexibles para adapterse al espacio visible. Posicionar los elementos "hijos" es por tanto mucho más sencillo, y los diseños complejos pueden hacerse más fácilmente y con código más limpio, ya que el orden de visualización de los elementos es independiente del orden que estos tengan en el código fuente. Esta independencia afecta intencionadamente únicamente a la representación visual, dejando el orden de locución y navegación a lo que diga el código fuente.</p>
-
-<div class="note"><strong>Nota:</strong> Aunque la especificación del diseño de "cajas flexibles" de CSS está en fase de "candidata a recomendación", no todos los navegadores la han implementado. La implementación de WebKit requiere el prefijo <code>-webkit</code>; Internet Explorer implementa una versión antigua de la especificación, con prefijo; Opera 12.10 implementa la última versión, sin prefijo. Revisa la tabla de compatibilidad de cada propiedad para saber cuál es el estado actual de compatibilidad.</div>
-
-<h2 id="El_concepto_de_cajas_flexibles">El concepto de "cajas flexibles"</h2>
-
-<p>Lo que caracteriza un diseño flexible es su habilidad para alterar el ancho y alto de sus elementos para ajustarse lo mejor posible al espacio disponible en cualquier dispositivo. Un contenedor flexible expande sus elementos para rellenar el espacio libre, o los comprime para evitar que rebasen el área prevista.</p>
-
-<p>El algoritmo del modelo de diseño de "cajas flexibles" no parte de niguna dirección predeterminada, al contrario de lo que ocurre con el modelo "bloque", que asume una disposición vertical de los elementos, o lo que pasa con el modelo "en línea", que asume una disposición horizontal. Mientras que el modelo "bloque" funciona bien para páginas, se queda muy corto cuando se trata de aplicaciones en las que hay que tener en cuenta el cambio de orientación del dispositivo o los cambios de tamaño realizados por los gestos del usuario. El modelo de "cajas flexibles" es más apropiado para diseños de pequeña escala, mientras que el (emergente) modelo "rejilla" es adecuado para diseños de gran escala. Ambos son parte del gran esfuerzo que el "CSS Working Group" está realizando para proveer de mayor interoperabilidad a las aplicaciones web con todo tipo de usuarios, distintos modos de escritura, y otras necesidades de flexibilidad.</p>
-
-<h2 id="Vocabulario_de_cajas_flexibles">Vocabulario de "cajas flexibles"</h2>
-
-<p>Aunque al hablar de las "cajas flexibles" nos olvidamos de términos como "horizontal/en línea" y "vertical/bloque", se hace necesario emplear una nueva terminología. Fíjate en el siguiente diagrama para afianzar el vocabulario empleado en sus elementos. Se muestra un contenedor flexible que tiene una <code>flex-direction</code> de tipo <code>row</code>, que significa que los elementos flexibles se muestra uno a continuación del otro horizontalmente a lo largo del eje principal (main axis) de acuerdo con el modo de escritura preestablecido, y en este caso, la dirección en que el texto de los elementos fluye es de izquierda-a-derecha.</p>
-
-<p><img alt="flex_terms.png" class="default internal" src="/files/3739/flex_terms.png"></p>
-
-<dl>
- <dt>Contenedor flexible (Flex container)</dt>
- <dd>El elemento "padre" que contiene los elementos flexibles. Un contenedor flexible se define usando los valores <code>flex</code> o <code>inline-flex</code> en la propiedad <a href="/en/CSS/display" rel="internal" title="display"><code>display</code></a>.</dd>
- <dt>Elemento flexible (Flex item)</dt>
- <dd>
- <p>Cada hijo de un contenedor flex se convierte en un elemento flexible. Si hay texto directamente incluido en el contenedor flexible, se envuelve automáticamente en un elemento flexible anónimo.</p>
- </dd>
- <dt>Ejes</dt>
- <dd>
- <p>Cada diseño de "caja flexible" sigue dos ejes. El <strong>eje principal</strong> es el eje a lo largo del cual los elementos flexibles se suceden unos a otros. El <strong>eje secundario</strong> es el eje perpendicular al <strong>eje principal</strong>.</p>
-
- <ul>
-  <li>La propiedad <code><a href="/en/CSS/flex-direction" rel="internal" title="flex-direction">flex-direction</a></code> establece el eje principal.</li>
-  <li>La propiedad <a href="/en/CSS/justify-content" rel="internal" title="en/CSS/justify-content"><code>justify-content</code></a> define cómo los elementos flexibles se disponen a lo largo del eje principal en la línea en curso.</li>
-  <li>La propiedad <a href="/en/CSS/align-items" title="en/CSS/align-items"><code>align-items</code></a> define cómo los elementos flexibles se disponen a lo largo del eje secundario de la línea en curso.</li>
-  <li>La propiedad <a href="/en/CSS/align-self" title="en/CSS/align-self"><code>align-self</code></a> define cómo cada elemento flexible se alinea respecto al eje secundario, y sustituye al valor por defecto establecido por <code>align-items.</code></li>
- </ul>
- </dd>
- <dt>Direcciones</dt>
- <dd>
- <p>Los lados <strong>inicio principal</strong>/<strong>fin principal (main start/main end) </strong>e <strong>inicio secundario</strong>/<strong>fin </strong><strong>secundario (cross start/cross end)</strong> del contenedor flexible describen el origen y final del flujo de los elementos flexibles. Estos siguen el eje principal y secundario según el vector establecido por <code>writing-mode</code> (izquierda-a-derecha, derecha-a-izquierda, etc.).</p>
-
- <ul>
-  <li>La propiedad <a href="/en/CSS/order" rel="internal" title="en/CSS/order"><code>order</code></a> asigna elementos a grupos ordinales y determina qué elementos aparecen primero.</li>
-  <li>La propiedad <a href="/en/CSS/flex-flow" rel="internal" title="flex-flow"><code>flex-flow</code></a> combina las propiedades <a href="/en/CSS/flex-direction" rel="internal" title="flex-direction"><code>flex-direction</code></a> y <a href="/en/CSS/flex-wrap" rel="internal" title="flex-wrap"><code>flex-wrap</code></a> para colocar los elementos flexibles.</li>
- </ul>
- </dd>
- <dt>Líneas</dt>
- <dd>
- <p>Los elementos flexibles pueden disponerse en una sola o varias líneas de acuerdo con la propiedad <a href="/en/CSS/flex-wrap" rel="internal" title="flex-wrap"><code>flex-wrap</code></a>, que controla la dirección del eje secundario y la dirección en la que las nuevas líneas se apilan.</p>
- </dd>
- <dt>Dimensiones</dt>
- <dd>
- <p>Los términos equivalentes a "altura" y "anchura" usados en los elementos flexibles son <strong>tamaño principal (main size)</strong> and <strong>tamaño secundario (cross size),</strong> que respectivamente siguen al eje principal y al eje secundario del contenedor flexible.</p>
-
- <ul>
-  <li>La propiedades <code><a href="/en/CSS/min-height" title="/en/CSS/min-height">min-height</a></code> y <code><a href="/en/CSS/min-width" title="/en/CSS/min-width">min-width</a></code> tienen un nuevo valor, <code>auto</code> que establece el tamaño mínimo de un elemento flexible.</li>
-  <li>La propiedad <a href="/en/CSS/flex" rel="internal" title="en/CSS/flex"><code>flex</code></a> combina las propiedades <code><a href="/en/CSS/flex-basis" rel="internal" title="en/CSS/flex-basis">flex-basis</a></code>, <a href="/en/CSS/flex-grow" rel="internal" title="en/CSS/flex-grow"><code>flex-grow</code></a>, y <a href="/en/CSS/flex-shrink" rel="internal" title="en/CSS/flex-shrink"><code>flex-shrink</code></a> para establecer el grado de flexibilidad de los elementos flexibles.</li>
- </ul>
- </dd>
-</dl>
-
-<h2 id="Diseñando_una_caja_flexible">Diseñando una "caja flexible"</h2>
-
-<p>Para indicar que unos elementos tienen este estilo CSS, asigna la propiedad <a href="/en/CSS/display" title="/en/CSS/display">display</a> así:</p>
-
-<pre class="brush: css">display : flex</pre>
-
-<p>o</p>
-
-<pre class="brush: css">display : inline-flex</pre>
-
-<p>Haciendo esto, se define el elemento como contenedor flexible y todos sus "hijos" como elementos flexibles. El valor <code>flex</code> hace que el contenedor flexible sea un bloque dentro del elemento "padre" al que pertenezca. El valor <code>inline-flex</code> hace que el contenedor flexible sea un elemento "en línea" dentro del elemento "padre" al que pertenezca.</p>
-
-<div class="note"><strong>Nota:</strong> Cuando utilices un prefijo para el tipo de navegador, ponlo en la propiedad "display" no en el atributo "display". Por ejemplo, <code>display : -webkit-flex</code>.</div>
-
-<h2 id="Consideraciones_de_los_elementos_flexibles">Consideraciones de los elementos flexibles</h2>
-
-<p>El texto que se encuentre directamente dentro de un contenedor flexible, será automáticamente envuelto en un elemento flexible anónimo. Sin embargo, si un elemento flexible contiene solamente espacios en blanco no será mostrado, como si tuviera la propiedad <code style="color: rgb(93,86,54); font-size: 14px;">display:none</code>.</p>
-
-<p>Los "hijos" de un contenedor flexible que tengan un posicionamiento absoluto, se situarán de manera que su posición estática se determine en referencia a la esquina del <strong>inicio principal (main start)</strong> de su contenedor flexible.</p>
-
-<p>Actualmente, debido a un problema conocido, asignar <code style="font-size: 14px;">visibility:collapse</code> a un elemento flexible causa que sea tratado como si fuera <code style="font-size: 14px;">display:none</code> en vez de lo que se supone que debería ocurrir, es decir, como si fuera <code style="font-size: 14px;">visibility:hidden</code>. La alternativa mientras se resuelve este problema es usar <code>visibility:hidden</code> para elementos flexibles que deban comportarse como <code>visibility:collapse</code>.</p>
-
-<p>Los márgenes de elementos flexibles adyacentes no se colapsan. Usando márgenes <code>auto</code> se absorbe el espacio extra vertical y horizontalmente y puede ser utilizado para alinear o separar elementos flexibles adyacentes. Ver <a href="http://dev.w3.org/csswg/css3-flexbox/#auto-margins" title="http://dev.w3.org/csswg/css3-flexbox/#auto-margins">Aligning with 'auto' margins</a> en la especificación "W3C Flexible Box Layout Model" para más detalles al respecto.</p>
-
-<p>Para asegurar un tamaño mínimo por defecto de los elementos flexibles, usa <code>min-width:auto</code> y/o <code>min-height:auto</code>. Para los elementos flexibles, el valor de atributo <code>auto</code> calcula la mínima anchura/altura del elemento para que no sea menor que la anchura/altura de su contenido, garantizando que el elemento es mostrado suficientemente grande como para que se vea su contenido. Ver {{cssxref("min-width")}}  y {{cssxref("min-height")}} para más detalles al respecto.</p>
-
-<p>Las propiedades de alineación de "cajas flexibles" realizan un "verdadero" centrado en CSS. Esto significa que los elementos flexibles permanecerán centrados, incluso si estos rebasan su contenedor flexible. Esto puede llegar a ser un problema, ya que si sobrepasan el tope superior de la página o el izquierdo (en escritura LTR de izquierda-a-derecha) o el derecho (en escritura RTL de derecha-a-izquierda), no se puede desplazar hacia ese área, incluso habiendo contenido allí. En el futuro, las propiedades de alineación se ampliarán para que tengan una opción "safe" (seguro) para controlar esta situación. De momento, si esto te preocupa, puedes usar los márgenes para conseguir el centrado, ya que estos responderán de modo seguro parando el centrado si se sobrepasan los límites. En vez de usar las propiedades <code>align-</code>, simplemente pon márgenes automáticos en los elementos flexibles que quieras centrar. En vez de usar las propiedades <code>justify-</code>, pon márgenes automáticos en los límites exteriores del primer y último elemento flexible del contenedor flexible. Los márgenes automáticos se adaptarán asumiendo el espacio sobrante, centrando los elementos flexibles donde sobre espacio, y cambiando a alineación normal donde no sobre espacio. Sin embargo, si tratas de reemplazar <code>justify-content</code> con "centrado-basado-en-márgenes" en una "caja flexible" multi-línea, probablemente no funcionará, ya que tendrías que poner márgenes en el primer y último elemento de cada línea. A menos que puedas predecir qué elementos encajarán en cada línea, no tendrás una respuesta fiable usando el "<span style="line-height: inherit;">centrado-basado-en-márgenes</span><span style="line-height: inherit;">" en el eje principal al reemplazar la propiedad </span><code style="font-size: 14px; line-height: inherit;">justify-content</code><span style="line-height: inherit;">.</span></p>
-
-<p>Recuerda que mientras el orden en que se muestran los elementos es independiente de su orden en el código fuente, esta independecia afecta solamente a la representación visual, y no al orden de locución y navegación que seguirán el orden establecido en el código fuente. Incluso la propiedad {{cssxref("order")}} no afectará a la secuencia de locución ni de navegación. Así que los desarrolladores deben preocuparse del orden de los elementos adecuadamente en el código fuente para que no se deteriore la accesibilidad del documento. </p>
-
-<h2 id="Propiedades_de_las_cajas_flexibles">Propiedades de las "cajas flexibles"</h2>
-
-<h3 id="Propiedades_que_no_afectan_a_las_cajas_flexibles">Propiedades que no afectan a las "cajas flexibles"</h3>
-
-<p>Como las "cajas flexibles" emplean un algoritmo diferente, alguna propiedades no tienen sentido para un contenedor flexible.</p>
-
-<ul>
- <li>Propiedades column-* del <a href="/en/CSS/Using_CSS_multi-column_layouts" title="/en/CSS/Using_CSS_multi-column_layouts">Módulo Multicol</a> no tienen ningún efecto en un elemento flexible.</li>
- <li>{{cssxref("float")}} y {{cssxref("clear")}} no tienen ningún efecto en un elemento flexible. Usar <code>float</code> causa que la propiedad <code>display</code> del elemento se comporte como <code>block</code>.</li>
- <li>{{cssxref("vertical-align")}} no tiene efecto en la alineación de los elementos flexibles.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_básico_flex">Ejemplo básico "flex"</h3>
-
-<p>Este ejemplo básico muestra como aplicar "flexibilidad" a un elemento y como sus "hijos" se comportan flexiblemente. </p>
-
-<pre class="brush:html;">​&lt;!DOCTYPE html&gt;
-&lt;html lang="en"&gt;
-  &lt;head&gt;
-    &lt;style&gt;
-
-   .flex
-   {
-      /* basic styling */
-      width: 350px;
-      height: 200px;
-      border: 1px solid #555;
-      font: 14px Arial;
-
-      /* flexbox setup */
-      display: -webkit-flex;
-      -webkit-flex-direction: row;
-
-      display: flex;
-      flex-direction: row;
-   }
-
-   .flex &gt; div
-   {
-      -webkit-flex: 1 1 auto;
-      flex: 1 1 auto;
-
-      width: 30px; /* To make the transition work nicely.  (Transitions to/from
-                      "width:auto" are buggy in Gecko and Webkit, at least.
-                      See http://bugzil.la/731886 for more info.) */
-
-      -webkit-transition: width 0.7s ease-out;
-      transition: width 0.7s ease-out;
-   }
-
-   /* colors */
-   .flex &gt; div:nth-child(1){ background : #009246; }
-   .flex &gt; div:nth-child(2){ background : #F1F2F1; }
-   .flex &gt; div:nth-child(3){ background : #CE2B37; }
-
-   .flex &gt; div:hover
-   {
-        width: 200px;
-   }
-
-   &lt;/style&gt;
-
- &lt;/head&gt;
- &lt;body&gt;
-  &lt;p&gt;Flexbox nuovo&lt;/p&gt;
-  &lt;div class="flex"&gt;
-    &lt;div&gt;uno&lt;/div&gt;
-    &lt;div&gt;due&lt;/div&gt;
-    &lt;div&gt;tre&lt;/div&gt;
-  &lt;/div&gt;
- &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<h3 id="Ejemplo_de_Diseño_del_Santo_Gríal">Ejemplo de "Diseño del Santo Gríal"</h3>
-
-<p>Este ejemplo muestra como la "caja flexible" proporciona la habilidad de cambiar dinámicamente el diseño para distintas resoluciones de pantalla. El diagrama siguiente ilustra la transformación.</p>
-
-<p><img alt="HolyGrailLayout.png" class="default internal" src="/files/3760/HolyGrailLayout.png"></p>
-
-<p>Aquí se muestra el caso en que el diseño de la página adaptado a un navegador tiene que mostrarse óptimamente en un smartphone. No solamente los elementos se reducen de tamaño, sino que el orden en que se muestran también cambia. La "caja flexible" lo hace muy sencillo.</p>
-
-<pre class="brush:html;">​
-&lt;!DOCTYPE html&gt;
-&lt;html lang="en"&gt;
-  &lt;head&gt;
-    &lt;style&gt;
-
-  body {
-   font: 24px Helvetica;
-   background: #999999;
-  }
-
-  #main {
-   min-height: 800px;
-   margin: 0px;
-   padding: 0px;
-   display: -webkit-flex;
-   display:         flex;
-   -webkit-flex-flow: row;
-           flex-flow: row;
-   }
-
-  #main &gt; article {
-   margin: 4px;
-   padding: 5px;
-   border: 1px solid #cccc33;
-   border-radius: 7pt;
-   background: #dddd88;
-   -webkit-flex: 3 1 60%;
-           flex: 3 1 60%;
-   -webkit-order: 2;
-           order: 2;
-   }
-
-  #main &gt; nav {
-   margin: 4px;
-   padding: 5px;
-   border: 1px solid #8888bb;
-   border-radius: 7pt;
-   background: #ccccff;
-   -webkit-flex: 1 6 20%;
-           flex: 1 6 20%;
-   -webkit-order: 1;
-           order: 1;
-   }
-
-  #main &gt; aside {
-   margin: 4px;
-   padding: 5px;
-   border: 1px solid #8888bb;
-   border-radius: 7pt;
-   background: #ccccff;
-   -webkit-flex: 1 6 20%;
-           flex: 1 6 20%;
-   -webkit-order: 3;
-           order: 3;
-   }
-
-  header, footer {
-   display: block;
-   margin: 4px;
-   padding: 5px;
-   min-height: 100px;
-   border: 1px solid #eebb55;
-   border-radius: 7pt;
-   background: #ffeebb;
-   }
-
-  /* Too narrow to support three columns */
-  @media all and (max-width: 640px) {
-
-   #main, #page {
-    -webkit-flex-flow: column;
-            flex-flow: column;
-   }
-
-   #main &gt; article, #main &gt; nav, #main &gt; aside {
-    /* Return them to document order */
-    -webkit-order: 0;
-            order: 0;
-   }
-
-   #main &gt; nav, #main &gt; aside, header, footer {
-    min-height: 50px;
-    max-height: 50px;
-   }
-  }
-
- &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
- &lt;header&gt;header&lt;/header&gt;
- &lt;div id='main'&gt;
-    &lt;article&gt;article&lt;/article&gt;
-    &lt;nav&gt;nav&lt;/nav&gt;
-    &lt;aside&gt;aside&lt;/aside&gt;
- &lt;/div&gt;
- &lt;footer&gt;footer&lt;/footer&gt;
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<h2 id="Área_de_juego">Área de juego</h2>
-
-<p>Hay varias áreas de juego de "cajas flexibles" disponibles on-line para experimentar:</p>
-
-<ul>
- <li><a href="http://demo.agektmr.com/flexbox/" title="http://demo.agektmr.com/flexbox/">Flexbox Playground</a></li>
- <li><a href="http://the-echoplex.net/flexyboxes" title="http://the-echoplex.net/flexyboxes">Flexy Boxes</a></li>
-</ul>
-
-<h2 id="Cosas_a_tener_en_mente">Cosas a tener en mente</h2>
-
-<p>El algoritmo de las "cajas flexibles" puede ser un poco complejo de entender a veces. Hay una serie de cosas a considerar para evitar "sorpresas" cuando se utilizan las "cajas flexibles".</p>
-
-<p>Las "cajas flexibles" se comportan en función del <a href="https://developer.mozilla.org/en-US/docs/CSS/writing-mode" title="https://developer.mozilla.org/en-US/docs/CSS/writing-mode">modo de escritura</a> establecido. Esto siginifica que <strong>inicio principal</strong> (<strong>main start</strong>) y <strong>fin principal</strong> (<strong>main end</strong>) se disponen de según la posición de <strong>inicio</strong> (<strong>start</strong>) y <strong>fin</strong> (<strong>end</strong>).</p>
-
-<p><strong>inicio secundario (cross start)</strong> y <strong>fin secundario</strong> (<strong>cross end)</strong> confían en la definición de la posición <strong>inicio</strong> (<strong>start)</strong> o <strong>antes</strong> (<strong>before)</strong> que depende del valor de <a href="/en/CSS/direction" title="direction"><code>direction</code></a>.</p>
-
-<p>Los saltos de página son posibles en el diseño de "cajas flexibles" siempre que la propiedad <code>break-</code> lo permita. Las propiedades CSS3 <code>break-after</code>, <code>break-before</code> y <code>break-inside</code> así como las propiedades CSS 2.1 <code>page-break-before</code>, <code>page-break-after</code> y <code>page-break-inside</code> se aceptan en los contenedores flexibles, también en los elementos flexibles que ellos contienen, y también en los elementos que esos elementos flexibles a su vez contienen.</p>
-
-<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caraterística</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{ CompatGeckoDesktop("18.0") }}{{ property_prefix("-moz") }}(Behind a pref) [2]<br>
-    {{ CompatGeckoDesktop("22.0") }}</td>
-   <td>21.0{{ property_prefix("-webkit") }}</td>
-   <td>10{{ property_prefix("-ms") }}(partial)</td>
-   <td>12.1</td>
-   <td>3.1{{ property_prefix("-webkit") }}(partial)<br>
-    6.1{{ property_prefix("-webkit") }}<br>
-    9</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caraterística</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Android</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{ CompatGeckoMobile("18.0") }}{{ property_prefix("-moz") }}(Behind a pref) [2]<br>
-    {{ CompatGeckoMobile("22.0") }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>10{{ property_prefix("-ms") }}(partial)<br>
-    11</td>
-   <td>12.1</td>
-   <td>
-    <p>3.2{{ property_prefix("-webkit") }}(partial)<br>
-     7.1{{ property_prefix("-webkit") }}<br>
-     9.0</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Notas">Notas</h3>
-
-<p>[1] Internet Explorer 10 y Safari soportan un antiguo borrador de la especificación que es incompatible. No han sido actualizados para soportar la versión final.</p>
-
-<p>[2] Firefox soporta solamente la "caja flexible" con una sola línea. Para activar el soporte de "caja flexible" el usuario tiene que cambiar la preferencia about:config "layout.css.flexbox.enabled" a <code>true</code>.</p>
-
-<p>[3] El navegador de Android hasta la versión 4.3 soporta un borrador antiguo e incompatible de la especificación. Android 4.4 ha sido actualizado para dar soporte a la versión final.</p>
-
-<p>[4] Mientras que en la implementación inicial en Opera 12.10 <code>flexbox </code>no estaba en el prefijo, obtuvo prefijos en las versiones de la 15 a la 16 de Opera y 15 a 19 de Opera Mobile con {{property_prefix("-webkit")}}. Este prefijo, fue eliminado de nuevo en Opera 17 y Opera Mobile 24.</p>
-
-<p>[5] Hasta Firefox 29, especificar <code>visibility: collapse</code> en un elemento flex causaba que fuera tratado como si fuera <code>display: none </code>en vez del comportamiento pretendido, tratándolo como si fuera <code>visibility: hidden</code>. El método alternativo sugerido es usar <code>visibility: hidden</code> para los elementos flex que debieran comportarse como si huberan sido designados <code>visibility: collapse</code>. Para más información, ver {{bug(783470)}}.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://github.com/philipwalton/flexbugs">El Proyecto Flexbugs</a> para información de errores en implementación de flexbox en navegadores.</li>
-</ul>
diff --git a/files/es/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html b/files/es/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html
new file mode 100644
index 0000000000..26cff270b6
--- /dev/null
+++ b/files/es/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html
@@ -0,0 +1,723 @@
+---
+title: Basic concepts of grid layout
+slug: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
+tags:
+  - CSS
+  - Guía
+  - Posicionamiento
+  - Rejillas CSS
+translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
+original_slug: Web/CSS/CSS_Grid_Layout/Conceptos_Básicos_del_Posicionamiento_con_Rejillas
+---
+<p><a href="/es/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a> presenta un sistema de cuadrícula bidimensional para CSS. Las cuadrículas se pueden utilizar para posicionar áreas principales de la página o pequeños elementos de la interfaz de usuario. Este artículo lo introduce a Grid Layout de CSS y la nueva terminología que forma parte de la especificación CSS Grid Layout Nivel 1. Las características mostradas en este resumen se explicarán con mayor detalle en el resto de esta guía.</p>
+
+<h2 id="¿Qué_es_una_cuadrículagrid">¿Qué es una cuadrícula(grid)?</h2>
+
+<p>Una cuadrícula es un conjunto de líneas horizontales y verticales que se intersectan - un grupo define columnas y el otro filas. Los elementos se pueden colocar en la cuadrícula respetando estas columnas y filas. El diseño de cuadrícula CSS tiene las siguientes características:</p>
+
+<h3 id="Tamaños_fijos_y_flexibles">Tamaños fijos y flexibles</h3>
+
+<p>Usted puede crear una cuadrícula con tamaños fijos, utilizando píxeles, por ejemplo. También se puede crear una cuadrícula utilizando tamaños flexibles con porcentajes o con la nueva unidad de medida <code>fr</code> (fracción), diseñada para este propósito.</p>
+
+<h3 id="Posicionamiento_de_elementos">Posicionamiento de elementos</h3>
+
+<p>Puede colocar elementos en una ubicación precisa en la cuadrícula utilizando números de línea, nombres o seleccionando un área de la cuadrícula. Grid también contiene un algoritmo para controlar la ubicación de elementos que no tienen una posición explícita en la cuadrícula.</p>
+
+<h3 id="Creación_de_líneas_adicionales_para_alojar_contenido">Creación de líneas adicionales para alojar contenido</h3>
+
+<p>Usted puede definir una cuadrícula explícita con grid layout. La especificación  Grid Layout  es lo suficientemente flexible como para permitir agregar filas y columnas adicionales cuando sea necesario. Características como la adición de "tantas columnas como caben en un contenedor" también fueron incuidas.</p>
+
+<h3 id="Control_de_alineación">Control de alineación</h3>
+
+<p>Grid contiene características de alineación para poder controlar la forma cómo se alinean los elementos una vez colocados en un área de cuadrícula y cómo está alineada toda la cuadrícula.</p>
+
+<h3 id="Control_de_contenido_superpuesto">Control de contenido superpuesto</h3>
+
+<p>Se puede colocar más de un elemento en una celda de la cuadrícula o área, las cuales pueden solaparse o superponerse total o parcialmente entre sí. Esta estratificación puede ser controlada con la propiedad {{cssxref("z-index")}}.</p>
+
+<p>Grid es una poderosa especificación que, cuando se combina con otras partes de CSS como <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout">flexbox</a>, puede ayudarle a crear diseños que antes eran imposibles de construir en CSS. Todo comienza creando una cuadrícula en su <strong>contenedor de cuadrícula</strong>.</p>
+
+<h2 id="El_contenedor_de_Grid_2">El contenedor de Grid</h2>
+
+<p>Creamos un <em>contenedor de cuadrícula</em> al declarar <code>display: grid</code> o <code>display: inline-grid</code> en un elemento. Tan pronto como hagamos esto todos los <em>hijos directos</em> de ese elemento se convertirán en <em>elementos de la cuadrícula.</em></p>
+
+<p>En este ejemplo, se tiene un contenedor div con una clase wrapper y dentro hay cinco elementos hijos.</p>
+
+<div id="El_contenedor_de_Grid">
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+   &lt;div&gt;One&lt;/div&gt;
+   &lt;div&gt;Two&lt;/div&gt;
+   &lt;div&gt;Three&lt;/div&gt;
+   &lt;div&gt;Four&lt;/div&gt;
+   &lt;div&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p>Hago de <code>.wrapper</code> un contenedor de cuadrícula.</p>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('El_contenedor_de_Grid', '200', '330') }}</p>
+</div>
+
+<p>Todos los descendientes directos son ahora elementos de la cuadrícula. En un navegador web, usted no verá ninguna diferencia en cómo son mostrados estos elementos antes de convertirlos en una cuadrícula ya que grid ha creado una cuadrícula de una sola columna para los elementos. En este punto usted puede encontrar útil trabajar en Firefox Developer Edition, el cual  tiene disponible el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Grid Inspector</a> (Inspector de cuádricula) como parte de las Herramientas de Desarrollador. Si ve este ejemplo en Firefox e inspecciona la cuadrícula, verá un icono pequeño junto al valor <code>grid</code>. Haga clic sobre este y la cuadrícula de este elemento se superpondrá en la ventana del navegador.</p>
+
+<p><img alt="Using the Grid Highlighter in DevTools to view a grid" src="https://mdn.mozillademos.org/files/14631/1-grid-inspector.png" style="height: 753px; width: 900px;"></p>
+
+<p>Mientras usted aprende y luego trabaja con CSS Grid Layout esta herramienta le dará una mejor idea de lo que está sucediendo con sus cuadrículas visualmente.</p>
+
+<p>Si queremos empezar a hacer esto más parecido a una cuadrícula necesitamos agregar columnas.</p>
+
+<h2 id="Vias_filas_y_columnas_del_Grid">Vias, filas y columnas del Grid</h2>
+
+<p>Definimos filas y columnas en nuestra cuadrícula con las propiedades {{cssxref("grid-template-columns")}} y {{cssxref("grid-template-rows")}}. Éstas definen las vías de la cuadrícula. Una vía de cuadrícula es el área entre las dos líneas -horizontales o verticales- dentro de la cuadrícula. En la imagen inferior se puede ver una vía resaltada -  esta es la vía de la primera fila en nuestra cuadrícula.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14637/1_Grid_Track.png" style="height: 261px; width: 392px;"></p>
+
+<p>Puedo modificar nuestro ejemplo anterior al agregar la propiedad <code>grid-template-columns</code>, para así definir el tamaño (ancho) de las vías de cada columna.</p>
+
+<p>Ahora he creado una cuadrícula con tres vías por columna de 200 píxeles. Los elementos hijo se posicionarán en esta cuadrícula uno en cada una de las celdas de la cuadrícula.</p>
+
+<div id="grid_first">
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two&lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+  &lt;div&gt;Four&lt;/div&gt;
+  &lt;div&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: 200px 200px 200px;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('grid_first', '610', '140') }}</p>
+</div>
+
+<h3 id="La_Unidad_fr_2">La Unidad fr</h3>
+
+<p>Las vías se pueden definir usando cualquier unidad de medida. Grid también introduce una unidad de longitud adicional para ayudarnos a crear vías de cuadrícula flexibles. La nueva unidad fr representa una fracción del espacio disponible en el contenedor de la cuadrícula. La siguiente definición de cuadrícula crearía tres vias con el mismo ancho, que se expanden y se encogen de acuerdo el espacio disponible.</p>
+
+<div id="La_Unidad_fr">
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two&lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+  &lt;div&gt;Four&lt;/div&gt;
+  &lt;div&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('La_Unidad_fr', '220', '140') }}</p>
+</div>
+
+<p>En el próximo ejemplo creamos una definición con una vía de <code>2fr</code> y luego dos vías de <code>1fr</code>. El espacio disponible se divide en cuatro. Dos partes corresponden a la primera vía  y una parte a cada una de las dos vias restantes.</p>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: 2fr 1fr 1fr;
+}
+</pre>
+
+<p>En este ejemplo final mezclamos las vías de tamaño absoluto con unidades de fracción(fr). La primera vía tiene 500 píxeles, por lo que este ancho fijo se sustrae del espacio disponible.El espacio restante se divide en tres y se asigna en proporción a las dos vías flexibles.</p>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: 500px 1fr 2fr;
+}
+</pre>
+
+<h3 id="Listando_vías_con_la_notación_repeat">Listando vías con la notación <code>repeat()</code></h3>
+
+<p>Las cuadrículas grandes con muchas vías o celdas pueden utilizar la notación <code>repeat()</code> con el fin de repetir todas o una sección de la lista de vías. Por ejemplo la definición de cuadrícula:</p>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+}
+</pre>
+
+<p>También puede ser escrita así:</p>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+}
+</pre>
+
+<p>La notación de repetición se puede utilizar para una parte del listado de vías. En este siguiente ejemplo he creado una cuadrícula con una vía inicial de 20 píxeles luego una sección repetitiva de 6 vías de <code>1fr</code> y luego una vía final de 20 píxeles.</p>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: 20px repeat(6, 1fr) 20px;
+}
+</pre>
+
+<p>La notación de repetición toma una lista de vías específicas, por lo tanto, puede utilizarla para crear un patrón de iteración de vías. En el próximo ejemplo, mi cuadrícula consistirá de 10 vías, una vía <code>1fr</code> seguida por una vía <code>2fr</code>, repetida cinco veces.</p>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(5, 1fr 2fr);
+}
+</pre>
+
+<h3 id="La_cuadrícula_implícita_y_explícita">La cuadrícula implícita y explícita</h3>
+
+<p>Al crear nuestra cuadrícula de ejemplo definimos nuestras vías de columna con la propiedad {{cssxref("grid-template-columns")}}, pero dejamos que grid creara filas  para el contenido según fuera necesario. Estas filas se crean en la cuadrícula implícita. La cuadrícula explícita consiste en las filas y columnas que se definen con las propiedades {{cssxref("grid-template-columns")}} y {{cssxref("grid-template-rows")}}.</p>
+
+<p>Si coloca algo fuera de la cuadrícula ya definida, o si debido a la cantidad de contenido, se necesitarán más vías o celdas, entonces grid crea filas y columnas en la cuadrícula implícita. Estas vías varían su tamaño automáticamente de forma predeterminada, así que ajustarán su tamaño basadas en el contenido dentro de ellas.</p>
+
+<p>También puede definir un tamaño para el conjunto de vías creadas en la cuadrícula implícita con las propiedades {{cssxref("grid-auto-rows")}} y {{cssxref("grid-auto-columns")}}.</p>
+
+<p>En el siguiente ejemplo usamos <code>grid-auto-rows</code> para asegurar que las vías creadas en la cuadrícula implícita tengan 200 píxeles de alto.</p>
+
+<div class="brush: html" id="rejilla_implícita_y_explícita">&lt;div class="wrapper"&gt; &lt;div&gt;One&lt;/div&gt; &lt;div&gt;Two&lt;/div&gt; &lt;div&gt;Three&lt;/div&gt; &lt;div&gt;Four&lt;/div&gt; &lt;div&gt;Five&lt;/div&gt; &lt;/div&gt;
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: 200px;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('cuadrícula_implícita_y_explícita', '230', '420') }}</p>
+</div>
+
+<h3 id="Tamaño_de_vía_y_minmax_2">Tamaño de vía y <code>minmax()</code></h3>
+
+<p>Al configurar una cuadrícula explícita o definir el tamaño de las filas o columnas creadas automáticamente, es posible que desee dar a las vías un tamaño mínimo, pero asegurarse que se expandan para adaptarse a cualquier contenido que se pueda agregar. Por ejemplo, tal vez quiera que mis filas nunca se colapsen a menos de 100 píxeles, pero si mi contenido se extiende a 300 píxeles de altura, me gustaría que la fila se expandiera a esa altura.</p>
+
+<p>Grid tiene una solución para esto con la función {{cssxref("minmax", "minmax()")}}. En el siguiente ejemplo estoy usando <code>minmax()</code> en el valor de la propiedad {{cssxref("grid-auto-rows")}}. Las filas creadas automáticamente tendrán como mínimo de 100 píxeles de alto y un máximo de auto. El uso de auto significa que el tamaño mirará el tamaño del contenido y se estirará para dar espacio al elemento más alto en una celda en esta fila.</p>
+
+<div id="Tamaño_de_vía_y_minmax">
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: minmax(100px, auto);
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two
+    &lt;p&gt;I have some more content in.&lt;/p&gt;
+    &lt;p&gt;This makes me taller than 100 pixels.&lt;/p&gt;
+  &lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+  &lt;div&gt;Four&lt;/div&gt;
+  &lt;div&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p>{{ EmbedLiveSample('Tamaño_de_vía_y_minmax', '240', '470') }}</p>
+</div>
+
+<h2 id="Líneas_de_la_cuadrículaEdit">Líneas de la cuadrícula<a class="button section-edit only-icon" href="/es/docs/Web/CSS/CSS_Grid_Layout/Conceptos_B%C3%A1sicos_del_Posicionamiento_con_Rejillas$edit#Líneas_de_Rejilla" rel="nofollow, noindex"><span>Edit</span></a></h2>
+
+<p>Debe tenerse en cuenta que cuando definimos una cuadrícula definimos las vías de la cuadrícula, no las líneas. Grid luego nos da las líneas numeradas a utilizar al posicionar elementos. En nuestra cuadrícula de tres columnas y dos filas, tenemos cuatro líneas de columna.</p>
+
+<p><img alt="Diagram showing numbered grid lines." src="https://mdn.mozillademos.org/files/14761/1_diagram_numbered_grid_lines.png" style="height: 456px; width: 764px;"></p>
+
+<p>Las líneas están numeradas según el modo de escritura del documento. En un idioma de izquierda a derecha, la línea 1 está al lado izquierdo de la cuadrícula. En un idioma de derecha a izquierda, está en el lado derecho de la cuadrícula. Las líneas también se pueden nombrar, ya veremos cómo hacer esto en una guía posterior de esta serie.</p>
+
+<h3 id="Posicionando_elementos_de_acuerdo_a_las_líneas">Posicionando elementos de acuerdo a las líneas</h3>
+
+<p>Estaremos explorando la colocación basada en líneas en detalle en un artículo posterior, el siguiente ejemplo demuestra cómo hacer esto de una manera sencilla. Cuando colocamos un elemento  y tomamos como punto de referencia la línea - en lugar de la vía.</p>
+
+<p>En el siguiente ejemplo, estoy posicionando los dos primeros elementos en la cuadrícula de tres vías de columna,  usando las propiedades {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row-start")}} y {{cssxref("grid-row-end")}}. Trabajando de izquierda a derecha, el primer elemento se coloca partiendo de la línea de la columna 1, y se extiende a la línea de la columna 4, que en nuestro caso es la línea que está mas a la derecha en la cuadrícula. Y comienza en la línea de la fila 1 y termina en la línea de fila la 3, por lo tanto, se extiende sobre dos filas.</p>
+
+<p>El segundo elemento comienza en la línea de columna 1 de la  cuadrícula y se extiende por toda la fila. Este es el valor por defecto, por lo que no necesito especificar la línea final. También se extiende dos vías de fila de la línea de fila 3 a la línea de fila 5. Los otros elementos se colocarán a sí mismos en espacios vacíos en la cuadrícula.</p>
+
+<div id="Líneas_de_Rejilla">
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box1"&gt;One&lt;/div&gt;
+  &lt;div class="box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box3"&gt;Three&lt;/div&gt;
+  &lt;div class="box4"&gt;Four&lt;/div&gt;
+  &lt;div class="box5"&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: 100px;
+}
+
+.box1 {
+  grid-column-start: 1;
+  grid-column-end: 4;
+  grid-row-start: 1;
+  grid-row-end: 3;
+}
+
+.box2 {
+  grid-column-start: 1;
+  grid-row-start: 3;
+  grid-row-end: 5;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Líneas_de_cuadrícula', '230', '420') }}</p>
+</div>
+
+<p>No olvide que puede utilizar <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Grid Inspector</a> en las Herramientas de Desarrollador de Firefox para ver cómo se posicionan los elementos en las líneas de la cuadrícula.</p>
+
+<h2 id="Celdas_de_cuadrícula">Celdas de cuadrícula</h2>
+
+<p>Una <em>celda de cuadrícula</em> es la unidad más pequeña en una cuadrícula, conceptualmente es como una celda de tabla. Como vimos en nuestros ejemplos anteriores, una vez que se define una cuadrícula en un padre, los elementos hijo se posicionarán a sí mismos de una vez en cada celda de la cuadrícula definida. En la imagen de abajo he resaltado la primera celda de la cuadrícula.</p>
+
+<p><img alt="The first cell of the grid highlighted" src="https://mdn.mozillademos.org/files/14643/1_Grid_Cell.png" style="height: 233px; width: 350px;"></p>
+
+<h2 id="Áreas_de_cuadrícula">Áreas de cuadrícula</h2>
+
+<p>Los elementos pueden extenderse a través de una o más celdas tanto por fila como por columna, lo que crea un <em>área de cuadrícula</em>. Las áreas de la cuadrícula tienen que ser rectangulares - no es posible crear un área en forma de L, por ejemplo. El área de cuadrícula resaltada abarca dos vías de fila y dos de columna.</p>
+
+<p><img alt="A grid area" src="https://mdn.mozillademos.org/files/14645/1_Grid_Area.png" style="height: 238px; width: 357px;"></p>
+
+<h2 id="Canaletas_2">Canaletas</h2>
+
+<p>Las canaletas o callejones entre las celdas de la cuadrícula se pueden crear usando las propiedades {{cssxref("grid-column-gap")}} y {{cssxref("grid-row-gap")}}, o la propiedad abreviada {{cssxref("grid-gap")}}. En el siguiente ejemplo estoy creando una brecha de 10 píxeles entre columnas y una brecha de 1em entre filas.</p>
+
+<div id="Canaletas">
+<pre class="brush: css">.wrapper {
+   display: grid;
+   grid-template-columns: repeat(3, 1fr);
+   grid-column-gap: 10px;
+   grid-row-gap: 1em;
+}
+</pre>
+
+<div class="note">
+<p><strong>Nota:</strong> Los navegadores más antigüos tienen {{cssxref("column-gap")}}, {{cssxref("row-gap")}} y {{cssxref("gap")}} prefijadas con el prefijo <code>grid-</code> como {{cssxref("grid-column-gap")}}, {{cssxref("grid-row-gap")}} y {{cssxref("grid-gap")}} respectivamente.</p>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two&lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+  &lt;div&gt;Four&lt;/div&gt;
+  &lt;div&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  grid-column-gap: 10px;
+  grid-row-gap: 1em;
+
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('Canaletas') }}</p>
+</div>
+
+<p>Cualquier espacio utilizado por las brechas se tendrá en cuenta antes de que el espacio sea asignado a las vías <code>fr</code> de longitud flexible y las canaletas intervienen con propósitos de dimensionamiento como una vía de cuadrícula regular, sin embargo, no se puede colocar nada en una brecha. En términos de posicionamiento basado en líneas, la brecha actúa como una línea gruesa.</p>
+
+<h2 id="Anidamiento_de_cuadrículas">Anidamiento de cuadrículas</h2>
+
+<p>Un elemento de cuadrícula puede convertirse en un contenedor de cuadrícula. En el ejemplo siguiente tengo la cuadrícula de tres columnas creada anteriormente, con nuestros dos elementos posicionados. En este caso, el primer elemento tiene algunos subelementos. Ya que estos elementos no son descendientes directos de la cuadrícula, no participan en la disposición de la cuadrícula y por lo tanto se muestran en el flujo normal del documento.</p>
+
+<div id="anidamiento">
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+   &lt;div class="box box1"&gt;
+       &lt;div class="nested"&gt;a&lt;/div&gt;
+       &lt;div class="nested"&gt;b&lt;/div&gt;
+        &lt;div class="nested"&gt;c&lt;/div&gt;
+    &lt;/div&gt;
+    &lt;div class="box box2"&gt;Two&lt;/div&gt;
+    &lt;div class="box box3"&gt;Three&lt;/div&gt;
+    &lt;div class="box box4"&gt;Four&lt;/div&gt;
+    &lt;div class="box box5"&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p><img alt="Nested grid in flow" src="https://mdn.mozillademos.org/files/14641/1_Nested_Grids_in_flow.png" style="height: 512px; width: 900px;"></p>
+
+<p>Si establezco <code>box1</code> a <code>display: grid</code> puedo darle una definición de vía y también se convertirá en una cuadrícula, los elementos entonces se posicionan en esta nueva cuadrícula.</p>
+
+<pre class="brush: css">.box1 {
+  grid-column-start: 1;
+  grid-column-end: 4;
+  grid-row-start: 1;
+  grid-row-end: 3;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+}
+
+.box {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+
+.box1 {
+  grid-column: 1 / 4;
+}
+
+.nested {
+  border: 2px solid #ffec99;
+  border-radius: 5px;
+  background-color: #fff9db;
+  padding: 1em;
+}
+</pre>
+</div>
+</div>
+
+<p>{{ EmbedLiveSample('anidamiento', '600', '340') }}</p>
+
+<p>En este caso, la cuadrícula anidada no tiene ninguna relación con el padre. Como usted puede ver en el ejemplo, no ha heredado la <a class="new" href="/es/docs/Web/CSS/grid-gap" title="La documentación acerca de este tema no ha sido escrita todavía . ¡Por favor  considera contribuir !"><code>grid-gap</code></a> del elemento padre y las líneas de la cuadrícula anidada no se alinean con las líneas de la cuadrícula padre.</p>
+
+<h3 id="Subgrid">Subgrid</h3>
+
+<p>En la especificación de grid de nivel 1 hay una característica llamada <em>subgrid</em> que nos permitiría crear cuadrículas anidadas que usan la definición de la vía de la cuadrícula padre.</p>
+
+<div class="note">
+<p>Las Subgrids aún no están implementadas en ningún navegador y la especificación está sujeta a cambio.</p>
+</div>
+
+<p>En la especificación actual, editaríamos el ejemplo de cuadrícula anidada arriba para usar <code>display: subgrid</code> en lugar de <code>display: grid</code>, y luego eliminar la definición de vía. La cuadrícula anidada utilizará las vías de la cuadrícula principal para posicionar los elementos.</p>
+
+<p>Cabe señalar que la cuadrícula está anidada en ambas dimensiones — filas y columnas. No hay concepto de la cuadrícula implícita trabajando con subgrids. Esto significa que debe asegurarse de que la cuadrícula padre tenga suficientes vías de fila y columna para todos los subelementos.</p>
+
+<pre class="brush: css">.box1 {
+   grid-column-start: 1;
+   grid-column-end: 4;
+   grid-row-start: 1;
+   grid-row-end: 3;
+   display: subgrid;
+}
+</pre>
+
+<h2 id="Estratificando_elementos_con_z-index">Estratificando elementos con <code>z-index</code></h2>
+
+<p>Los elementos de cuadrícula pueden ocupar la misma celda. Si volvemos a nuestro ejemplo con elementos posicionados por número de línea, podemos cambiar esto para hacer que dos elementos se superpongan.</p>
+
+<div id="l_ex">
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box box1"&gt;One&lt;/div&gt;
+  &lt;div class="box box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box box3"&gt;Three&lt;/div&gt;
+  &lt;div class="box box4"&gt;Four&lt;/div&gt;
+  &lt;div class="box box5"&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: 100px;
+}
+
+.box1 {
+  grid-column-start: 1;
+  grid-column-end: 4;
+  grid-row-start: 1;
+  grid-row-end: 3;
+}
+
+.box2 {
+  grid-column-start: 1;
+  grid-row-start: 2;
+  grid-row-end: 4;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.box {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+</div>
+
+<p>{{ EmbedLiveSample('l_ex', '230', '420') }}</p>
+
+<p>El elemento <code>box2</code> ahora se superpone a <code>box1</code>, se muestra en la parte superior ya que aparece después en el orden de origen.</p>
+
+<h3 id="Controlando_el_orden">Controlando el orden</h3>
+
+<p>Podemos controlar el orden en el que los artículos se apilan utilizando la propiedad z-index - al igual que con los elementos posicionados. Si le damos a <code>box2</code> un <code>z-index</code> más bajo que <code>box1</code>, se mostrará debajo de box1 en la pila.</p>
+
+<div id="controlando_el_orden">
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: 100px;
+}
+
+.box1 {
+  grid-column-start: 1;
+  grid-column-end: 4;
+  grid-row-start: 1;
+  grid-row-end: 3;
+  z-index: 2;
+}
+
+.box2 {
+  grid-column-start: 1;
+  grid-row-start: 2;
+  grid-row-end: 4;
+  z-index: 1;
+}
+</pre>
+
+<div class="hidden">
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box box1"&gt;One&lt;/div&gt;
+  &lt;div class="box box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box box3"&gt;Three&lt;/div&gt;
+  &lt;div class="box box4"&gt;Four&lt;/div&gt;
+  &lt;div class="box box5"&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.box {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('controlando_el_orden', '230', '420') }}</p>
+
+<h2 id="Siguientes_Pasos">Siguientes Pasos</h2>
+
+<p>En este artículo hemos tenido una mirada muy rápida a través de la Especificación de Grid Layout. Juegue un poco con los ejemplos de código, y luego pase a <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">la siguiente parte de esta guía donde realmente nos vamos a adentrar en detalle dentro de CSS Grid Layout</a>.</p>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li><a href="/es/docs/Web/CSS"><strong>CSS</strong></a></li>
+ <li><a href="/es/docs/Web/CSS/Reference"><strong>CSS Reference</strong></a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a></li>
+ <li data-default-state="open"><a href="#"><strong>Guías</strong></a>
+  <ol>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Conceptos básicos del posicionamiento con cuadrículas</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relación con otros métodos de posicionamiento</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Posicionamiento basado en líneas</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Áreas de una plantilla de cuadrícula</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Posicionamiento usando líneas de cuadrícula con nombres</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Posicionamiento automático en grid layout</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Alineación de cajas en grid layout</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">cuadrículas, valores lógicos y modos de escritura</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout y Accesibilidad</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout y Mejora Progresiva</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Layouts comunes utilizando CSS Grid</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Properties</strong></a>
+  <ol>
+   <li><a href="/es/docs/Web/CSS/grid">grid</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-area">grid-area</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column">grid-column</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-gap">grid-gap</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row">grid-row</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template">grid-template</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template-columns">grid-template-columns</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Glossary</strong></a>
+  <ol>
+   <li><a href="/es/docs/Glossary/Grid">cuadrícula</a></li>
+   <li><a href="/es/docs/Glossary/Grid_lines">Líneas de cuadrícula</a></li>
+   <li><a href="/es/docs/Glossary/Grid_tracks">Pistas de cuadrícula</a></li>
+   <li><a href="/es/docs/Glossary/Grid_cell">Celda de cuadrícula</a></li>
+   <li><a href="/es/docs/Glossary/Grid_areas">Áreas de cuadrícula</a></li>
+   <li><a href="/es/docs/Glossary/Gutters">Canaletas</a></li>
+   <li><a href="/es/docs/Glossary/Grid_Axis">Ejes de cuadrícula</a></li>
+   <li><a href="/es/docs/Glossary/Grid_rows">Fila de cuadrícula</a></li>
+   <li><a href="/es/docs/Glossary/Grid_column">Columna de cuadrícula</a></li>
+  </ol>
+ </li>
+</ol>
+</section>
+</div>
diff --git a/files/es/web/css/css_grid_layout/conceptos_básicos_del_posicionamiento_con_rejillas/index.html b/files/es/web/css/css_grid_layout/conceptos_básicos_del_posicionamiento_con_rejillas/index.html
deleted file mode 100644
index afb49e2a92..0000000000
--- a/files/es/web/css/css_grid_layout/conceptos_básicos_del_posicionamiento_con_rejillas/index.html
+++ /dev/null
@@ -1,722 +0,0 @@
----
-title: Basic concepts of grid layout
-slug: Web/CSS/CSS_Grid_Layout/Conceptos_Básicos_del_Posicionamiento_con_Rejillas
-tags:
-  - CSS
-  - Guía
-  - Posicionamiento
-  - Rejillas CSS
-translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout
----
-<p><a href="/es/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a> presenta un sistema de cuadrícula bidimensional para CSS. Las cuadrículas se pueden utilizar para posicionar áreas principales de la página o pequeños elementos de la interfaz de usuario. Este artículo lo introduce a Grid Layout de CSS y la nueva terminología que forma parte de la especificación CSS Grid Layout Nivel 1. Las características mostradas en este resumen se explicarán con mayor detalle en el resto de esta guía.</p>
-
-<h2 id="¿Qué_es_una_cuadrículagrid">¿Qué es una cuadrícula(grid)?</h2>
-
-<p>Una cuadrícula es un conjunto de líneas horizontales y verticales que se intersectan - un grupo define columnas y el otro filas. Los elementos se pueden colocar en la cuadrícula respetando estas columnas y filas. El diseño de cuadrícula CSS tiene las siguientes características:</p>
-
-<h3 id="Tamaños_fijos_y_flexibles">Tamaños fijos y flexibles</h3>
-
-<p>Usted puede crear una cuadrícula con tamaños fijos, utilizando píxeles, por ejemplo. También se puede crear una cuadrícula utilizando tamaños flexibles con porcentajes o con la nueva unidad de medida <code>fr</code> (fracción), diseñada para este propósito.</p>
-
-<h3 id="Posicionamiento_de_elementos">Posicionamiento de elementos</h3>
-
-<p>Puede colocar elementos en una ubicación precisa en la cuadrícula utilizando números de línea, nombres o seleccionando un área de la cuadrícula. Grid también contiene un algoritmo para controlar la ubicación de elementos que no tienen una posición explícita en la cuadrícula.</p>
-
-<h3 id="Creación_de_líneas_adicionales_para_alojar_contenido">Creación de líneas adicionales para alojar contenido</h3>
-
-<p>Usted puede definir una cuadrícula explícita con grid layout. La especificación  Grid Layout  es lo suficientemente flexible como para permitir agregar filas y columnas adicionales cuando sea necesario. Características como la adición de "tantas columnas como caben en un contenedor" también fueron incuidas.</p>
-
-<h3 id="Control_de_alineación">Control de alineación</h3>
-
-<p>Grid contiene características de alineación para poder controlar la forma cómo se alinean los elementos una vez colocados en un área de cuadrícula y cómo está alineada toda la cuadrícula.</p>
-
-<h3 id="Control_de_contenido_superpuesto">Control de contenido superpuesto</h3>
-
-<p>Se puede colocar más de un elemento en una celda de la cuadrícula o área, las cuales pueden solaparse o superponerse total o parcialmente entre sí. Esta estratificación puede ser controlada con la propiedad {{cssxref("z-index")}}.</p>
-
-<p>Grid es una poderosa especificación que, cuando se combina con otras partes de CSS como <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout">flexbox</a>, puede ayudarle a crear diseños que antes eran imposibles de construir en CSS. Todo comienza creando una cuadrícula en su <strong>contenedor de cuadrícula</strong>.</p>
-
-<h2 id="El_contenedor_de_Grid_2">El contenedor de Grid</h2>
-
-<p>Creamos un <em>contenedor de cuadrícula</em> al declarar <code>display: grid</code> o <code>display: inline-grid</code> en un elemento. Tan pronto como hagamos esto todos los <em>hijos directos</em> de ese elemento se convertirán en <em>elementos de la cuadrícula.</em></p>
-
-<p>En este ejemplo, se tiene un contenedor div con una clase wrapper y dentro hay cinco elementos hijos.</p>
-
-<div id="El_contenedor_de_Grid">
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-   &lt;div&gt;One&lt;/div&gt;
-   &lt;div&gt;Two&lt;/div&gt;
-   &lt;div&gt;Three&lt;/div&gt;
-   &lt;div&gt;Four&lt;/div&gt;
-   &lt;div&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p>Hago de <code>.wrapper</code> un contenedor de cuadrícula.</p>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('El_contenedor_de_Grid', '200', '330') }}</p>
-</div>
-
-<p>Todos los descendientes directos son ahora elementos de la cuadrícula. En un navegador web, usted no verá ninguna diferencia en cómo son mostrados estos elementos antes de convertirlos en una cuadrícula ya que grid ha creado una cuadrícula de una sola columna para los elementos. En este punto usted puede encontrar útil trabajar en Firefox Developer Edition, el cual  tiene disponible el <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Grid Inspector</a> (Inspector de cuádricula) como parte de las Herramientas de Desarrollador. Si ve este ejemplo en Firefox e inspecciona la cuadrícula, verá un icono pequeño junto al valor <code>grid</code>. Haga clic sobre este y la cuadrícula de este elemento se superpondrá en la ventana del navegador.</p>
-
-<p><img alt="Using the Grid Highlighter in DevTools to view a grid" src="https://mdn.mozillademos.org/files/14631/1-grid-inspector.png" style="height: 753px; width: 900px;"></p>
-
-<p>Mientras usted aprende y luego trabaja con CSS Grid Layout esta herramienta le dará una mejor idea de lo que está sucediendo con sus cuadrículas visualmente.</p>
-
-<p>Si queremos empezar a hacer esto más parecido a una cuadrícula necesitamos agregar columnas.</p>
-
-<h2 id="Vias_filas_y_columnas_del_Grid">Vias, filas y columnas del Grid</h2>
-
-<p>Definimos filas y columnas en nuestra cuadrícula con las propiedades {{cssxref("grid-template-columns")}} y {{cssxref("grid-template-rows")}}. Éstas definen las vías de la cuadrícula. Una vía de cuadrícula es el área entre las dos líneas -horizontales o verticales- dentro de la cuadrícula. En la imagen inferior se puede ver una vía resaltada -  esta es la vía de la primera fila en nuestra cuadrícula.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14637/1_Grid_Track.png" style="height: 261px; width: 392px;"></p>
-
-<p>Puedo modificar nuestro ejemplo anterior al agregar la propiedad <code>grid-template-columns</code>, para así definir el tamaño (ancho) de las vías de cada columna.</p>
-
-<p>Ahora he creado una cuadrícula con tres vías por columna de 200 píxeles. Los elementos hijo se posicionarán en esta cuadrícula uno en cada una de las celdas de la cuadrícula.</p>
-
-<div id="grid_first">
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two&lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-  &lt;div&gt;Four&lt;/div&gt;
-  &lt;div&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: 200px 200px 200px;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('grid_first', '610', '140') }}</p>
-</div>
-
-<h3 id="La_Unidad_fr_2">La Unidad fr</h3>
-
-<p>Las vías se pueden definir usando cualquier unidad de medida. Grid también introduce una unidad de longitud adicional para ayudarnos a crear vías de cuadrícula flexibles. La nueva unidad fr representa una fracción del espacio disponible en el contenedor de la cuadrícula. La siguiente definición de cuadrícula crearía tres vias con el mismo ancho, que se expanden y se encogen de acuerdo el espacio disponible.</p>
-
-<div id="La_Unidad_fr">
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two&lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-  &lt;div&gt;Four&lt;/div&gt;
-  &lt;div&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('La_Unidad_fr', '220', '140') }}</p>
-</div>
-
-<p>En el próximo ejemplo creamos una definición con una vía de <code>2fr</code> y luego dos vías de <code>1fr</code>. El espacio disponible se divide en cuatro. Dos partes corresponden a la primera vía  y una parte a cada una de las dos vias restantes.</p>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: 2fr 1fr 1fr;
-}
-</pre>
-
-<p>En este ejemplo final mezclamos las vías de tamaño absoluto con unidades de fracción(fr). La primera vía tiene 500 píxeles, por lo que este ancho fijo se sustrae del espacio disponible.El espacio restante se divide en tres y se asigna en proporción a las dos vías flexibles.</p>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: 500px 1fr 2fr;
-}
-</pre>
-
-<h3 id="Listando_vías_con_la_notación_repeat">Listando vías con la notación <code>repeat()</code></h3>
-
-<p>Las cuadrículas grandes con muchas vías o celdas pueden utilizar la notación <code>repeat()</code> con el fin de repetir todas o una sección de la lista de vías. Por ejemplo la definición de cuadrícula:</p>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr;
-}
-</pre>
-
-<p>También puede ser escrita así:</p>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-}
-</pre>
-
-<p>La notación de repetición se puede utilizar para una parte del listado de vías. En este siguiente ejemplo he creado una cuadrícula con una vía inicial de 20 píxeles luego una sección repetitiva de 6 vías de <code>1fr</code> y luego una vía final de 20 píxeles.</p>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: 20px repeat(6, 1fr) 20px;
-}
-</pre>
-
-<p>La notación de repetición toma una lista de vías específicas, por lo tanto, puede utilizarla para crear un patrón de iteración de vías. En el próximo ejemplo, mi cuadrícula consistirá de 10 vías, una vía <code>1fr</code> seguida por una vía <code>2fr</code>, repetida cinco veces.</p>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(5, 1fr 2fr);
-}
-</pre>
-
-<h3 id="La_cuadrícula_implícita_y_explícita">La cuadrícula implícita y explícita</h3>
-
-<p>Al crear nuestra cuadrícula de ejemplo definimos nuestras vías de columna con la propiedad {{cssxref("grid-template-columns")}}, pero dejamos que grid creara filas  para el contenido según fuera necesario. Estas filas se crean en la cuadrícula implícita. La cuadrícula explícita consiste en las filas y columnas que se definen con las propiedades {{cssxref("grid-template-columns")}} y {{cssxref("grid-template-rows")}}.</p>
-
-<p>Si coloca algo fuera de la cuadrícula ya definida, o si debido a la cantidad de contenido, se necesitarán más vías o celdas, entonces grid crea filas y columnas en la cuadrícula implícita. Estas vías varían su tamaño automáticamente de forma predeterminada, así que ajustarán su tamaño basadas en el contenido dentro de ellas.</p>
-
-<p>También puede definir un tamaño para el conjunto de vías creadas en la cuadrícula implícita con las propiedades {{cssxref("grid-auto-rows")}} y {{cssxref("grid-auto-columns")}}.</p>
-
-<p>En el siguiente ejemplo usamos <code>grid-auto-rows</code> para asegurar que las vías creadas en la cuadrícula implícita tengan 200 píxeles de alto.</p>
-
-<div class="brush: html" id="rejilla_implícita_y_explícita">&lt;div class="wrapper"&gt; &lt;div&gt;One&lt;/div&gt; &lt;div&gt;Two&lt;/div&gt; &lt;div&gt;Three&lt;/div&gt; &lt;div&gt;Four&lt;/div&gt; &lt;div&gt;Five&lt;/div&gt; &lt;/div&gt;
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-auto-rows: 200px;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('cuadrícula_implícita_y_explícita', '230', '420') }}</p>
-</div>
-
-<h3 id="Tamaño_de_vía_y_minmax_2">Tamaño de vía y <code>minmax()</code></h3>
-
-<p>Al configurar una cuadrícula explícita o definir el tamaño de las filas o columnas creadas automáticamente, es posible que desee dar a las vías un tamaño mínimo, pero asegurarse que se expandan para adaptarse a cualquier contenido que se pueda agregar. Por ejemplo, tal vez quiera que mis filas nunca se colapsen a menos de 100 píxeles, pero si mi contenido se extiende a 300 píxeles de altura, me gustaría que la fila se expandiera a esa altura.</p>
-
-<p>Grid tiene una solución para esto con la función {{cssxref("minmax", "minmax()")}}. En el siguiente ejemplo estoy usando <code>minmax()</code> en el valor de la propiedad {{cssxref("grid-auto-rows")}}. Las filas creadas automáticamente tendrán como mínimo de 100 píxeles de alto y un máximo de auto. El uso de auto significa que el tamaño mirará el tamaño del contenido y se estirará para dar espacio al elemento más alto en una celda en esta fila.</p>
-
-<div id="Tamaño_de_vía_y_minmax">
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-auto-rows: minmax(100px, auto);
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two
-    &lt;p&gt;I have some more content in.&lt;/p&gt;
-    &lt;p&gt;This makes me taller than 100 pixels.&lt;/p&gt;
-  &lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-  &lt;div&gt;Four&lt;/div&gt;
-  &lt;div&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p>{{ EmbedLiveSample('Tamaño_de_vía_y_minmax', '240', '470') }}</p>
-</div>
-
-<h2 id="Líneas_de_la_cuadrículaEdit">Líneas de la cuadrícula<a class="button section-edit only-icon" href="/es/docs/Web/CSS/CSS_Grid_Layout/Conceptos_B%C3%A1sicos_del_Posicionamiento_con_Rejillas$edit#Líneas_de_Rejilla" rel="nofollow, noindex"><span>Edit</span></a></h2>
-
-<p>Debe tenerse en cuenta que cuando definimos una cuadrícula definimos las vías de la cuadrícula, no las líneas. Grid luego nos da las líneas numeradas a utilizar al posicionar elementos. En nuestra cuadrícula de tres columnas y dos filas, tenemos cuatro líneas de columna.</p>
-
-<p><img alt="Diagram showing numbered grid lines." src="https://mdn.mozillademos.org/files/14761/1_diagram_numbered_grid_lines.png" style="height: 456px; width: 764px;"></p>
-
-<p>Las líneas están numeradas según el modo de escritura del documento. En un idioma de izquierda a derecha, la línea 1 está al lado izquierdo de la cuadrícula. En un idioma de derecha a izquierda, está en el lado derecho de la cuadrícula. Las líneas también se pueden nombrar, ya veremos cómo hacer esto en una guía posterior de esta serie.</p>
-
-<h3 id="Posicionando_elementos_de_acuerdo_a_las_líneas">Posicionando elementos de acuerdo a las líneas</h3>
-
-<p>Estaremos explorando la colocación basada en líneas en detalle en un artículo posterior, el siguiente ejemplo demuestra cómo hacer esto de una manera sencilla. Cuando colocamos un elemento  y tomamos como punto de referencia la línea - en lugar de la vía.</p>
-
-<p>En el siguiente ejemplo, estoy posicionando los dos primeros elementos en la cuadrícula de tres vías de columna,  usando las propiedades {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row-start")}} y {{cssxref("grid-row-end")}}. Trabajando de izquierda a derecha, el primer elemento se coloca partiendo de la línea de la columna 1, y se extiende a la línea de la columna 4, que en nuestro caso es la línea que está mas a la derecha en la cuadrícula. Y comienza en la línea de la fila 1 y termina en la línea de fila la 3, por lo tanto, se extiende sobre dos filas.</p>
-
-<p>El segundo elemento comienza en la línea de columna 1 de la  cuadrícula y se extiende por toda la fila. Este es el valor por defecto, por lo que no necesito especificar la línea final. También se extiende dos vías de fila de la línea de fila 3 a la línea de fila 5. Los otros elementos se colocarán a sí mismos en espacios vacíos en la cuadrícula.</p>
-
-<div id="Líneas_de_Rejilla">
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box1"&gt;One&lt;/div&gt;
-  &lt;div class="box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box3"&gt;Three&lt;/div&gt;
-  &lt;div class="box4"&gt;Four&lt;/div&gt;
-  &lt;div class="box5"&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-auto-rows: 100px;
-}
-
-.box1 {
-  grid-column-start: 1;
-  grid-column-end: 4;
-  grid-row-start: 1;
-  grid-row-end: 3;
-}
-
-.box2 {
-  grid-column-start: 1;
-  grid-row-start: 3;
-  grid-row-end: 5;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Líneas_de_cuadrícula', '230', '420') }}</p>
-</div>
-
-<p>No olvide que puede utilizar <a href="/en-US/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts">Grid Inspector</a> en las Herramientas de Desarrollador de Firefox para ver cómo se posicionan los elementos en las líneas de la cuadrícula.</p>
-
-<h2 id="Celdas_de_cuadrícula">Celdas de cuadrícula</h2>
-
-<p>Una <em>celda de cuadrícula</em> es la unidad más pequeña en una cuadrícula, conceptualmente es como una celda de tabla. Como vimos en nuestros ejemplos anteriores, una vez que se define una cuadrícula en un padre, los elementos hijo se posicionarán a sí mismos de una vez en cada celda de la cuadrícula definida. En la imagen de abajo he resaltado la primera celda de la cuadrícula.</p>
-
-<p><img alt="The first cell of the grid highlighted" src="https://mdn.mozillademos.org/files/14643/1_Grid_Cell.png" style="height: 233px; width: 350px;"></p>
-
-<h2 id="Áreas_de_cuadrícula">Áreas de cuadrícula</h2>
-
-<p>Los elementos pueden extenderse a través de una o más celdas tanto por fila como por columna, lo que crea un <em>área de cuadrícula</em>. Las áreas de la cuadrícula tienen que ser rectangulares - no es posible crear un área en forma de L, por ejemplo. El área de cuadrícula resaltada abarca dos vías de fila y dos de columna.</p>
-
-<p><img alt="A grid area" src="https://mdn.mozillademos.org/files/14645/1_Grid_Area.png" style="height: 238px; width: 357px;"></p>
-
-<h2 id="Canaletas_2">Canaletas</h2>
-
-<p>Las canaletas o callejones entre las celdas de la cuadrícula se pueden crear usando las propiedades {{cssxref("grid-column-gap")}} y {{cssxref("grid-row-gap")}}, o la propiedad abreviada {{cssxref("grid-gap")}}. En el siguiente ejemplo estoy creando una brecha de 10 píxeles entre columnas y una brecha de 1em entre filas.</p>
-
-<div id="Canaletas">
-<pre class="brush: css">.wrapper {
-   display: grid;
-   grid-template-columns: repeat(3, 1fr);
-   grid-column-gap: 10px;
-   grid-row-gap: 1em;
-}
-</pre>
-
-<div class="note">
-<p><strong>Nota:</strong> Los navegadores más antigüos tienen {{cssxref("column-gap")}}, {{cssxref("row-gap")}} y {{cssxref("gap")}} prefijadas con el prefijo <code>grid-</code> como {{cssxref("grid-column-gap")}}, {{cssxref("grid-row-gap")}} y {{cssxref("grid-gap")}} respectivamente.</p>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two&lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-  &lt;div&gt;Four&lt;/div&gt;
-  &lt;div&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  grid-column-gap: 10px;
-  grid-row-gap: 1em;
-
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Canaletas') }}</p>
-</div>
-
-<p>Cualquier espacio utilizado por las brechas se tendrá en cuenta antes de que el espacio sea asignado a las vías <code>fr</code> de longitud flexible y las canaletas intervienen con propósitos de dimensionamiento como una vía de cuadrícula regular, sin embargo, no se puede colocar nada en una brecha. En términos de posicionamiento basado en líneas, la brecha actúa como una línea gruesa.</p>
-
-<h2 id="Anidamiento_de_cuadrículas">Anidamiento de cuadrículas</h2>
-
-<p>Un elemento de cuadrícula puede convertirse en un contenedor de cuadrícula. En el ejemplo siguiente tengo la cuadrícula de tres columnas creada anteriormente, con nuestros dos elementos posicionados. En este caso, el primer elemento tiene algunos subelementos. Ya que estos elementos no son descendientes directos de la cuadrícula, no participan en la disposición de la cuadrícula y por lo tanto se muestran en el flujo normal del documento.</p>
-
-<div id="anidamiento">
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-   &lt;div class="box box1"&gt;
-       &lt;div class="nested"&gt;a&lt;/div&gt;
-       &lt;div class="nested"&gt;b&lt;/div&gt;
-        &lt;div class="nested"&gt;c&lt;/div&gt;
-    &lt;/div&gt;
-    &lt;div class="box box2"&gt;Two&lt;/div&gt;
-    &lt;div class="box box3"&gt;Three&lt;/div&gt;
-    &lt;div class="box box4"&gt;Four&lt;/div&gt;
-    &lt;div class="box box5"&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p><img alt="Nested grid in flow" src="https://mdn.mozillademos.org/files/14641/1_Nested_Grids_in_flow.png" style="height: 512px; width: 900px;"></p>
-
-<p>Si establezco <code>box1</code> a <code>display: grid</code> puedo darle una definición de vía y también se convertirá en una cuadrícula, los elementos entonces se posicionan en esta nueva cuadrícula.</p>
-
-<pre class="brush: css">.box1 {
-  grid-column-start: 1;
-  grid-column-end: 4;
-  grid-row-start: 1;
-  grid-row-end: 3;
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-}
-
-.box {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-
-.box1 {
-  grid-column: 1 / 4;
-}
-
-.nested {
-  border: 2px solid #ffec99;
-  border-radius: 5px;
-  background-color: #fff9db;
-  padding: 1em;
-}
-</pre>
-</div>
-</div>
-
-<p>{{ EmbedLiveSample('anidamiento', '600', '340') }}</p>
-
-<p>En este caso, la cuadrícula anidada no tiene ninguna relación con el padre. Como usted puede ver en el ejemplo, no ha heredado la <a class="new" href="/es/docs/Web/CSS/grid-gap" title="La documentación acerca de este tema no ha sido escrita todavía . ¡Por favor  considera contribuir !"><code>grid-gap</code></a> del elemento padre y las líneas de la cuadrícula anidada no se alinean con las líneas de la cuadrícula padre.</p>
-
-<h3 id="Subgrid">Subgrid</h3>
-
-<p>En la especificación de grid de nivel 1 hay una característica llamada <em>subgrid</em> que nos permitiría crear cuadrículas anidadas que usan la definición de la vía de la cuadrícula padre.</p>
-
-<div class="note">
-<p>Las Subgrids aún no están implementadas en ningún navegador y la especificación está sujeta a cambio.</p>
-</div>
-
-<p>En la especificación actual, editaríamos el ejemplo de cuadrícula anidada arriba para usar <code>display: subgrid</code> en lugar de <code>display: grid</code>, y luego eliminar la definición de vía. La cuadrícula anidada utilizará las vías de la cuadrícula principal para posicionar los elementos.</p>
-
-<p>Cabe señalar que la cuadrícula está anidada en ambas dimensiones — filas y columnas. No hay concepto de la cuadrícula implícita trabajando con subgrids. Esto significa que debe asegurarse de que la cuadrícula padre tenga suficientes vías de fila y columna para todos los subelementos.</p>
-
-<pre class="brush: css">.box1 {
-   grid-column-start: 1;
-   grid-column-end: 4;
-   grid-row-start: 1;
-   grid-row-end: 3;
-   display: subgrid;
-}
-</pre>
-
-<h2 id="Estratificando_elementos_con_z-index">Estratificando elementos con <code>z-index</code></h2>
-
-<p>Los elementos de cuadrícula pueden ocupar la misma celda. Si volvemos a nuestro ejemplo con elementos posicionados por número de línea, podemos cambiar esto para hacer que dos elementos se superpongan.</p>
-
-<div id="l_ex">
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box box1"&gt;One&lt;/div&gt;
-  &lt;div class="box box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box box3"&gt;Three&lt;/div&gt;
-  &lt;div class="box box4"&gt;Four&lt;/div&gt;
-  &lt;div class="box box5"&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-auto-rows: 100px;
-}
-
-.box1 {
-  grid-column-start: 1;
-  grid-column-end: 4;
-  grid-row-start: 1;
-  grid-row-end: 3;
-}
-
-.box2 {
-  grid-column-start: 1;
-  grid-row-start: 2;
-  grid-row-end: 4;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.box {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-</div>
-
-<p>{{ EmbedLiveSample('l_ex', '230', '420') }}</p>
-
-<p>El elemento <code>box2</code> ahora se superpone a <code>box1</code>, se muestra en la parte superior ya que aparece después en el orden de origen.</p>
-
-<h3 id="Controlando_el_orden">Controlando el orden</h3>
-
-<p>Podemos controlar el orden en el que los artículos se apilan utilizando la propiedad z-index - al igual que con los elementos posicionados. Si le damos a <code>box2</code> un <code>z-index</code> más bajo que <code>box1</code>, se mostrará debajo de box1 en la pila.</p>
-
-<div id="controlando_el_orden">
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-auto-rows: 100px;
-}
-
-.box1 {
-  grid-column-start: 1;
-  grid-column-end: 4;
-  grid-row-start: 1;
-  grid-row-end: 3;
-  z-index: 2;
-}
-
-.box2 {
-  grid-column-start: 1;
-  grid-row-start: 2;
-  grid-row-end: 4;
-  z-index: 1;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box box1"&gt;One&lt;/div&gt;
-  &lt;div class="box box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box box3"&gt;Three&lt;/div&gt;
-  &lt;div class="box box4"&gt;Four&lt;/div&gt;
-  &lt;div class="box box5"&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.box {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('controlando_el_orden', '230', '420') }}</p>
-
-<h2 id="Siguientes_Pasos">Siguientes Pasos</h2>
-
-<p>En este artículo hemos tenido una mirada muy rápida a través de la Especificación de Grid Layout. Juegue un poco con los ejemplos de código, y luego pase a <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">la siguiente parte de esta guía donde realmente nos vamos a adentrar en detalle dentro de CSS Grid Layout</a>.</p>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li><a href="/es/docs/Web/CSS"><strong>CSS</strong></a></li>
- <li><a href="/es/docs/Web/CSS/Reference"><strong>CSS Reference</strong></a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a></li>
- <li data-default-state="open"><a href="#"><strong>Guías</strong></a>
-  <ol>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Conceptos básicos del posicionamiento con cuadrículas</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relación con otros métodos de posicionamiento</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Posicionamiento basado en líneas</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Áreas de una plantilla de cuadrícula</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Posicionamiento usando líneas de cuadrícula con nombres</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Posicionamiento automático en grid layout</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Alineación de cajas en grid layout</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">cuadrículas, valores lógicos y modos de escritura</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout y Accesibilidad</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout y Mejora Progresiva</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Layouts comunes utilizando CSS Grid</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Properties</strong></a>
-  <ol>
-   <li><a href="/es/docs/Web/CSS/grid">grid</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-area">grid-area</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column">grid-column</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-gap">grid-gap</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row">grid-row</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template">grid-template</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template-columns">grid-template-columns</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Glossary</strong></a>
-  <ol>
-   <li><a href="/es/docs/Glossary/Grid">cuadrícula</a></li>
-   <li><a href="/es/docs/Glossary/Grid_lines">Líneas de cuadrícula</a></li>
-   <li><a href="/es/docs/Glossary/Grid_tracks">Pistas de cuadrícula</a></li>
-   <li><a href="/es/docs/Glossary/Grid_cell">Celda de cuadrícula</a></li>
-   <li><a href="/es/docs/Glossary/Grid_areas">Áreas de cuadrícula</a></li>
-   <li><a href="/es/docs/Glossary/Gutters">Canaletas</a></li>
-   <li><a href="/es/docs/Glossary/Grid_Axis">Ejes de cuadrícula</a></li>
-   <li><a href="/es/docs/Glossary/Grid_rows">Fila de cuadrícula</a></li>
-   <li><a href="/es/docs/Glossary/Grid_column">Columna de cuadrícula</a></li>
-  </ol>
- </li>
-</ol>
-</section>
-</div>
diff --git a/files/es/web/css/css_grid_layout/relacion_de_grid_layout/index.html b/files/es/web/css/css_grid_layout/relacion_de_grid_layout/index.html
deleted file mode 100644
index 298da1dc5f..0000000000
--- a/files/es/web/css/css_grid_layout/relacion_de_grid_layout/index.html
+++ /dev/null
@@ -1,642 +0,0 @@
----
-title: Relación de Grid Layout con otros métodos de diseño y posicionamiento - CSS
-slug: Web/CSS/CSS_Grid_Layout/Relacion_de_Grid_Layout
-tags:
-  - CSS
-  - CSS Cuadrícula
-  - CSS Grids
-  - CSS Grilla
-  - CSS Rejilla
-  - Guía
-translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout
----
-<p>CSS Grid Layout ha sido diseñado para trabajar junto con otros elementos de CSS, como parte de un sistema completo para hacer el diseño. En esta guía explicaré cómo se ajusta <em>Grid</em> junto con otras técnicas que ya se estén usando.</p>
-
-<div class="note">
-<p>Las traducciones posibles a la palabra Grid en este contexto son: Grilla, Rejilla, Cuadrícula, Malla. Para efecto del contenido será <em>Grid</em>.</p>
-</div>
-
-<h2 id="Grid_y_flexbox">Grid y flexbox</h2>
-
-<p>La diferencia básica entre CSS Grid Layout y <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout">CSS Flexbox Layout</a> es que Flexbox se creó para diseños de una dimensión, en una fila o una columna. En cambio CSS Grid Layout se pensó para el diseño bidimensional, en varias filas y columnas al mismo tiempo. Sin embargo, las dos especificaciones comparten algunas características comunes, y si ya has aprendido cómo utilizar Flexbox, verás semejanzas que te ayudarán a entender <em>Grid</em>.</p>
-
-<h3 id="Diseños_de_Una_dimensión_vs._dos_dimensiones">Diseños de Una dimensión vs. dos dimensiones</h3>
-
-<p>Un ejemplo simple puede demostrar la diferencia entre el diseño de una y dos dimensiones.</p>
-
-<p>En este primer ejemplo, estoy usando flexbox para diseñar un conjunto de cajas. Tengo cinco ítems-hijos en mi contenedor y les he dado valores a sus propiedades flex para que puedan aumentar y reducirse desde una flex-basis de 200 píxeles.</p>
-
-<p>También he configurado la propiedad <code>wrap</code>{{cssxref ("flex-wrap")}} , de modo que si el espacio del contenedor se hace demasiado estrecho para mantener esa flex-basis, los ítems se ajustarán (wrap) a una nueva fila.</p>
-
-<div id="onedtwod">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two&lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-  &lt;div&gt;Four&lt;/div&gt;
-  &lt;div&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: flex;
-  flex-wrap: wrap;
-}
-.wrapper &gt; div {
-  flex: 1 1 200px;
-}
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('onedtwod', '500', '230') }}</p>
-
-<p>En la imagen se puede ver que dos elementos se han ajustado en una nueva línea. Estos ítems comparten el espacio disponible y no están alineados debajo de los ítems de arriba. Esto es porque cuando envuelves (wrap) flex-ítems, cada nueva fila (o columna si se trabaja por columna) se convierte en un nuevo flex-container. La distribución del espacio ocurre a lo largo de la fila.</p>
-
-<p>La pregunta típica entonces es cómo conseguir que estos ítems se alineen. Aquí es donde queremos un método de layout bidimensional, queremos controlar la alineación por fila y columna, y es donde entra el grid.</p>
-
-<h3 id="El_mismo_diseño_con_CSS_Grid_Layout">El mismo diseño con CSS Grid Layout</h3>
-
-<p>En el siguiente ejemplo construyo el mismo diseño usando Grid. Esta vez tenemos tres pistas de columna de <code>1fr</code>. No necesitamos establecer nada sobre los ítems mismos, ellos se colocarán uno dentro de cada celda de la cuadrícula creada. Como se puede ver, se mantienen en una cuadrícula estricta, alineados en filas y columnas. Con cinco ítems, tenemos un hueco al final de la fila dos.</p>
-
-<div class="Two_Dimensional_With_Grid">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two&lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-  &lt;div&gt;Four&lt;/div&gt;
-  &lt;div&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Two_Dimensional_With_Grid', '300', '170') }}</p>
-</div>
-
-<p>Hay una pregunta muy simple para decidir si utilizar grid o flexbox:</p>
-
-<ul>
- <li>¿Necesito controlar el diseño únicamente por filas o por columnas? – usa flexbox</li>
- <li>¿Necesito controlar el diseño por filas y por columnas? – usa grid</li>
-</ul>
-
-<h3 id="¿Contenido_fuera_o_layout_dentro">¿Contenido fuera o layout dentro?</h3>
-
-<p>Además de la distinción unidimensional vs bidimensional, hay otra forma de decidir si es mejor utilizar flexbox o grid para un layout. Flexbox trabaja desde el contenido. Un caso de uso ideal para flexbox es cuando tienes un conjunto de ítems y quieres espaciarlos uniformemente en un contenedor. Dejas que el tamaño del contenido decida cuánto espacio ocupa cada ítem. Si los ítems se envuelven (wrap) en una nueva línea, calcularán su espaciado basándose en su tamaño y el espacio disponible <em>en esa línea</em>.</p>
-
-<p>Grid funciona desde el layout hacia adentro. Cuando usas CSS Grid Layout creas un diseño y luego colocas elementos en él, o permites que las reglas de auto-placement coloquen los elementos en las celdas de la cuadrícula de acuerdo con esa cuadrícula estricta. Existe la posibilidad de crear pistas que respondan al tamaño del contenido, sin embargo, también cambiarán toda la pista.</p>
-
-<p>Si estás usando flexbox y estás deshabilitando parte de la flexibilidad, probablemente necesites usar CSS Grid Layout. Un ejemplo sería si estás configurando un ancho de porcentaje en un flex-item para alinearlo con otros ítems de una línea anterior. En ese caso, es probable que Grid sea una mejor opción.</p>
-
-<h3 id="Alineación_de_Cajas">Alineación de Cajas</h3>
-
-<p>La característica de Flexbox que fue más emocionante para muchos de nosotros es que nos dio un control de alineación adecuado por primera vez. Hizo fácil centrar una caja en la página. Los flex-ítems pueden estirarse hasta la altura del flex container, lo que significa que son posibles columnas de la misma altura. Estas eran cosas que queríamos hacer desde hace mucho tiempo, y creamos todo tipo de hacks para conseguir al menos el efecto visual.</p>
-
-<p>Las propiedades de alineación de la especificación de Flexbox se han añadido a una nueva especificación llamada <a href="https://drafts.csswg.org/css-align/">Box Alignment Level 3</a>. Esto significa que pueden utilizarse en otras especificaciones, incluida Grid Layout. En el futuro, es posible que se apliquen también a otros métodos de layout.</p>
-
-<p>En una guía posterior en esta serie voy a echar un vistazo a Box Alignment y cómo funciona en Grid Layout, sin embargo aquí hay un ejemplo simple comparando Flexbox con Grid.</p>
-
-<p>El primer ejemplo utiliza flexbox, tengo un contenedor con tres ítems dentro. El {{cssxref("min-height")}} del wrapper es fijo, por lo que está definiendo la altura del flex container. En el flex container he establecido {{cssxref("align-items")}} en <code>flex-end</code> para que los items se alineen al final del flex container. También he establecido la propiedad {{cssxref("align-self")}} en <code>box1</code> para que anule el valor por defecto y se estire a la altura del contenedor, y en <code>box2</code> para que se alinee con el inicio del contenedor flexible.</p>
-
-<div id="Alineacion_de_cajas">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box1"&gt;One&lt;/div&gt;
-  &lt;div class="box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box3"&gt;Three&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: flex;
-  align-items: flex-end;
-  min-height: 200px;
-}
-.box1 {
-  align-self: stretch;
-}
-.box2 {
-  align-self: flex-start;
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Alineacion_de_cajas', '300', '230') }}</p>
-</div>
-
-<h3 id="Alineación_en_CSS_Grid_Layout">Alineación en CSS Grid Layout</h3>
-
-<p>En este segundo ejemplo uso Grid para construir el mismo diseño, usando las propiedades de alineación como se aplican en el grid layout. Por eso alineamos a <code>start</code> y a <code>end</code> en vez de a <code>flex-start</code> y<code>flex-end</code>. En grid layout alineamos los ítems dentro de su grid area que en este caso es una celda de la rejilla pero puede ser un área formada por múltiples celdas de rejilla.</p>
-
-<div id="Alineacion_en_Cssgrid">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box1"&gt;One&lt;/div&gt;
-  &lt;div class="box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box3"&gt;Three&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3,1fr);
-  align-items: end;
-  grid-auto-rows: 200px;
-}
-.box1 {
-  align-self: stretch;
-}
-.box2 {
-  align-self: start;
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Alineacion_en_Cssgrid', '200', '310') }}</p>
-</div>
-
-<h3 id="La_unidad_fr_y_flex-basis">La unidad <code>fr</code> y <code>flex-basis</code></h3>
-
-<p>Ya hemos visto que la unidad <code>fr</code> asigna a las pistas del grid (tracks) una proporción del espacio disponible en el grid container. La unidad <code>fr</code>combinada con la función {{cssxref("minmax()", "minmax")}} permite un comportamiento muy similar al que tienen las propiedades <code>flex</code> en Flexbox - y todavía mantenemos la posibilidad de crear un layout de dos dimensiones.</p>
-
-<p>Si volvemos al ejemplo en el que demostré la diferencia entre layouts de una y de dos dimensiones, puedes ver que hay una diferencia con respecto al modo de funcionamiento responsive en cada una de ellas. En la flex-layout si arrastramos nuestra ventana haciéndola cada vez más pequeña, flex box ajusta el número de ítems en cada fila de acuerdo al espacio disponible. Si tenemos mucho espacio los cinco ítems pueden caber en una fila, pero si tenemos un contenedor muy estrecho podríamos tener espacio solo para uno.</p>
-
-<p>En comparación, la versión grid siempre mantiene tres pistas de columna: son las pistas mismas las que crecen y se encogen, pero siempre hay tres, ya que al crear la rejilla definimos tres.</p>
-
-<h4 id="Auto-filling_grid_tracks">Auto-filling grid tracks</h4>
-
-<p>Podemos crear un efecto similar a flexbox, mientras mantenemos el contenido organizado en filas y columnas concretas mediante la creación de una lista de tracks usando la notación repeat y las propiedades <code>auto-fill</code> y <code>auto-fit</code>.</p>
-
-<p>En el siguiente ejemplo he usado <code>auto-fill</code> en el lugar del número entero de la notación repeat y he establecido la lista de pistas en 200 píxeles. Esto significa que el grid creará tantas columnas de 200 píxeles como quepan en el container.</p>
-
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two&lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, 200px);
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Auto-filling_grid_tracks', '500', '170') }}</p>
-
-<h3 id="Una_cantidad_flexible_de_pistas">Una cantidad flexible de pistas</h3>
-
-<p>Esto no es lo mismo que flexbox, en el ejemplo de flexbox los elementos son más grandes que la base de 200 píxeles antes del envoltorio. Podemos lograr lo mismo en grid combinando <code>auto-fill</code> y la función {{cssxref("minmax()", "minmax")}}. En el siguiente ejemplo configuro pistas que se rellenan automáticamente con <code>minmax</code>. Quiero que mis pistas tengan un mínimo de 200 píxeles, y luego establezco el máximo en <code>1fr</code>. Una vez que el navegador ha calculado cuántas veces caben 200 píxeles en el contenedor - teniendo en cuenta también la cantidad de espacio entre las rejillas ( grid gaps) - tratará como una instrucción el máximo de <code>1fr</code> y repartirá el espacio restante entre los ítems.</p>
-
-<div id="cantidad_flexible_pistas">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div&gt;One&lt;/div&gt;
-  &lt;div&gt;Two&lt;/div&gt;
-  &lt;div&gt;Three&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
-}
-</pre>
-
-<p>{{ EmbedLiveSample('cantidad_flexible_pistas', '500', '170') }}</p>
-</div>
-
-<p>Ahora tenemos la capacidad de crear una cuadrícula con un número flexible de pistas flexibles, y de ver los ítems dispuestos en la cuadrícula alineados por filas y columnas al mismo tiempo.</p>
-
-<h2 id="El_grid_y_los_elementos_absolutamente_posicionados">El grid y los elementos absolutamente posicionados</h2>
-
-<p>Grid interactúa con elementos absolutamente posicionados, lo que puede ser útil si quieres colocar un ítem dentro de una rejilla o de un área de la rejilla. La especificación define el comportamiento cuando un grid container es el bloque contenedor y es el padre del ítem posicionado absolutamente.</p>
-
-<h3 id="El_grid_container_como_bloque_contenedor">El grid container como bloque contenedor</h3>
-
-<p>Para hacer que el grid container sea un bloque contenedor es necesario añadir al container la propiedad position con el valor relative, (de la misma manera que harías para cualquier otro bloque contenedor posicionado absolutamente). Una vez hecho esto, si das la propiedad <code>position:</code> <code>absolute</code> a un grid-item se tomará como bloque que contiene el grid container o, si el ítem también tiene una posición de cuadrícula, como el área de la cuadrícula en la que se coloca.</p>
-
-<p>En el ejemplo de abajo tengo un wrapper que contiene cuatro ítems hijos, el ítem tres está absolutamente posicionado y también está colocado en la cuadrícula usando line-based placement. El grid container tiene <code>position:</code> <code>relative</code> y así se convierte en el contexto de posicionamiento de este elemento.</p>
-
-<div id="grid_container_como_bloque_contenedor">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-    border: 2px solid #f76707;
-    border-radius: 5px;
-    background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-    border: 2px solid #ffa94d;
-    border-radius: 5px;
-    background-color: #ffd8a8;
-    padding: 1em;
-    color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-   &lt;div class="box1"&gt;One&lt;/div&gt;
-   &lt;div class="box2"&gt;Two&lt;/div&gt;
-   &lt;div class="box3"&gt;
-    Este bloque está absolutamente posicionado. En este ejemplo, el grid container es el bloque contenedor, y por ello sus valores offsset para el posicionamiento absoluto se calculan a partir de los bordes exteriores del área en la que está colocado.
-   &lt;/div&gt;
-   &lt;div class="box4"&gt;Four&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-   display: grid;
-   grid-template-columns: repeat(4,1fr);
-   grid-auto-rows: 200px;
-   grid-gap: 20px;
-   position: relative;
-}
-.box3 {
-   grid-column-start: 2;
-   grid-column-end: 4;
-   grid-row-start: 1;
-   grid-row-end: 3;
-   position: absolute;
-   top: 40px;
-   left: 40px;
-}
-</pre>
-
-<p>{{ EmbedLiveSample('grid_container_como_bloque_contenedor', '500', '330') }}</p>
-</div>
-
-<p>Puedes ver que el ítem está ocupando el área de la línea 2 a la 4 de la cuadrícula y que empieza después de la línea 1. Luego se desplaza en esa área usando las propiedades <code>top </code> y <code>left</code>. Sin embargo, se ha sacado del flujo, como ocurre con los objetos en posición absoluta, por lo que las reglas de auto-placement colocan los objetos en ese mismo espacio. El ítem tampoco causa que sea generada la fila adicional para que se extienda a la línea 3.</p>
-
-<p>Si eliminamos <code>position:</code> <code>absolute</code> de las reglas de <code>.box3</code> podemos ver cómo se mostraría sin el posicionamiento.</p>
-
-<h3 id="El_grid_container_como_parent">El grid container como parent</h3>
-
-<p>Si el hijo absolutamente posicionado tiene un grid container como padre pero ese container no crea un nuevo contexto de posicionamiento, entonces se saca del flujo como en el ejemplo anterior. El contexto de posicionamiento será el elemento que cree un contexto de posicionamiento como es común a otros métodos de diseño. En nuestro caso, si eliminamos <code>position:</code> <code>relative</code> del wrapper de arriba, el contexto de posicionamiento es de la ventana de visualización, como se muestra en esta imagen.</p>
-
-<p><img alt="Image of grid container as parent" src="https://mdn.mozillademos.org/files/14661/2_abspos_example.png" style="height: 408px; width: 1702px;"></p>
-
-<p>Una vez más, el ítem ya no participa en el diseño de la cuadrícula en términos de tamaño o cuando otros ítems se colocan automáticamente.</p>
-
-<h3 id="Con_un_grid_area_como_parent_2">Con un grid area como parent</h3>
-
-<p>Si el ítem absolutamente posicionado está anidado dentro de un área de cuadrícula, entonces puede crear un contexto de posicionamiento en esa área. En el ejemplo de abajo tenemos nuestra cuadrícula como antes pero esta vez he anidado un ítem dentro de <code>.box3</code> de la cuadrícula.</p>
-
-<p>He dado a <code>.box3</code> position relative y luego he posicionado el sub-ítem con las propiedades offset. En este caso, el contexto de posicionamiento es el grid area</p>
-
-<div id="Con_un_grid_area_como_parent">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.wrapper &gt; div {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box1"&gt;One&lt;/div&gt;
-  &lt;div class="box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box3"&gt;Three
-    &lt;div class="abspos"&gt;
-     Este bloque está absolutamente posicionado. En este ejemplo, el grid container es el bloque contenedor, y por ello sus valores offsset para el posicionamiento absoluto se calculan a partir de los bordes exteriores del área en la que está colocado.
-    &lt;/div&gt;
-  &lt;/div&gt;
-  &lt;div class="box4"&gt;Four&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(4,1fr);
-  grid-auto-rows: 200px;
-  grid-gap: 20px;
-}
-.box3 {
-  grid-column-start: 2;
-  grid-column-end: 4;
-  grid-row-start: 1;
-  grid-row-end: 3;
-  position: relative;
-}
-.abspos {
-  position: absolute;
-  top: 40px;
-  left: 40px;
-  background-color: rgba(255,255,255,.5);
-  border: 1px solid rgba(0,0,0,0.5);
-  color: #000;
-  padding: 10px;
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Con_un_grid_area_como_parent', '500', '420') }}</p>
-</div>
-
-<h2 id="Grid_y_display_contents">Grid y <code>display:</code> <code>contents</code></h2>
-
-<p>Una interacción final con otra especificación de layout que merece la pena destacar es la interacción entre CSS Grid Layout y <code>display:</code> <code>contents</code>. El valor de <code>contents</code> en la propiedad display es un nuevo valor que se describe en <a href="https://drafts.csswg.org/css-display/#box-generation">Display specification</a> de la siguiente manera:</p>
-
-<blockquote>
-<p>“El elemento en sí no genera ninguna caja, pero sus hijos y pseudo-elementos siguen generando cajas como de costumbre. A efectos de generación y layout de cajas, el elemento debe ser tratado como si hubiera sido sustituido por sus hijos y pseudo-elementos en el árbol del documento”</p>
-</blockquote>
-
-<p>Si configuras un ítem como <code>display:</code> <code>contents</code> la caja que normalmente crearía desaparece, y las cajas de los elementos hijo aparecen como si hubieran subido de nivel. Esto significa que los hijos de un grid item pueden convertirse en grid items. . ¿Suena raro? He aquí un ejemplo sencillo. En el siguiente marcado tengo un grid, el primer ítem del grid se establece para que se expanda tres pistas de columna. Contiene tres ítems anidados. Como esos hijos no son hijos directos, no forman parte del grid layout y por tanto se muestran como <code>display</code>:<code>block</code>.</p>
-
-<div id="Display_Contents_Before">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.box {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-.nested {
-  border: 2px solid #ffec99;
-  border-radius: 5px;
-  background-color: #fff9db;
-  padding: 1em;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box box1"&gt;
-    &lt;div class="nested"&gt;a&lt;/div&gt;
-    &lt;div class="nested"&gt;b&lt;/div&gt;
-    &lt;div class="nested"&gt;c&lt;/div&gt;
-  &lt;/div&gt;
-  &lt;div class="box box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box box3"&gt;Three&lt;/div&gt;
-  &lt;div class="box box4"&gt;Four&lt;/div&gt;
-  &lt;div class="box box5"&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-auto-rows: minmax(100px, auto);
-}
-.box1 {
-  grid-column-start: 1;
-  grid-column-end: 4;
-}
-
-</pre>
-
-<p>{{ EmbedLiveSample('Display_Contents_Before', '400', '420') }}</p>
-</div>
-
-<p>Si ahora añado <code>display:</code> <code>contents</code> a las reglas del box1, la caja de ese ítem desaparece y los subítems se convierten en grid ítems y se despliegan usando las reglas de auto-placement.</p>
-
-<div id="Display_Contents_After">
-<div class="hidden">
-<pre class="brush: css">* {box-sizing: border-box;}
-
-.wrapper {
-  border: 2px solid #f76707;
-  border-radius: 5px;
-  background-color: #fff4e6;
-}
-
-.box {
-  border: 2px solid #ffa94d;
-  border-radius: 5px;
-  background-color: #ffd8a8;
-  padding: 1em;
-  color: #d9480f;
-}
-.nested {
-  border: 2px solid #ffec99;
-  border-radius: 5px;
-  background-color: #fff9db;
-  padding: 1em;
-}
-</pre>
-</div>
-
-<pre class="brush: html">&lt;div class="wrapper"&gt;
-  &lt;div class="box box1"&gt;
-    &lt;div class="nested"&gt;a&lt;/div&gt;
-    &lt;div class="nested"&gt;b&lt;/div&gt;
-    &lt;div class="nested"&gt;c&lt;/div&gt;
-  &lt;/div&gt;
-  &lt;div class="box box2"&gt;Two&lt;/div&gt;
-  &lt;div class="box box3"&gt;Three&lt;/div&gt;
-  &lt;div class="box box4"&gt;Four&lt;/div&gt;
-  &lt;div class="box box5"&gt;Five&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<pre class="brush: css">.wrapper {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  grid-auto-rows: minmax(100px, auto);
-}
-.box1 {
-  grid-column-start: 1;
-  grid-column-end: 4;
-  display: contents;
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Display_Contents_After', '400', '330') }}</p>
-</div>
-
-<p>Esta puede ser una forma de anidar elementos en la rejilla para que actúen como si fueran parte de la rejilla, y es una forma de sortear algunos de los problemas que resolverían los sub-grid una vez que se implementen. También puedes usar <code>display:</code> <code>contents</code> de manera similar en flexbox para que los ítems anidados se conviertan en flex items.</p>
-
-<p>Como puedes ver en esta guía, CSS Grid Layout es sólo una parte de tu kit de herramientas. No tengas miedo de mezclarlo con otros métodos de maquetación, para conseguir los diferentes efectos que necesitas.</p>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li><a href="/es/docs/Web/CSS"><strong>CSS</strong></a></li>
- <li><a href="/es/docs/Web/CSS/Reference"><strong>CSS Reference</strong></a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a></li>
- <li data-default-state="open"><a href="#"><strong>Guías</strong></a>
-  <ol>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Conceptos básicos del posicionamiento con rejillas</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relación con otros métodos de posicionamiento</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Posicionamiento basado en líneas</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Áreas de una plantilla de rejilla</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Posicionamiento usando líneas de rejilla con nombres</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Posicionamiento automático en grid layout</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Alineación de cajas en grid layout</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Rejillas, valores lógicos y modos de escritura</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout y Accesibilidad</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout y Mejora Progresiva</a></li>
-   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Layouts comunes utilizando CSS Grid</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Properties</strong></a>
-  <ol>
-   <li><a href="/es/docs/Web/CSS/grid">grid</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-area">grid-area</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column">grid-column</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-gap">grid-gap</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row">grid-row</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template">grid-template</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template-columns">grid-template-columns</a></li>
-   <li><a href="/es/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Glossary</strong></a>
-  <ol>
-   <li><a href="/es/docs/Glossary/Grid">Rejilla</a></li>
-   <li><a href="/es/docs/Glossary/Grid_lines">Líneas de rejilla</a></li>
-   <li><a href="/es/docs/Glossary/Grid_tracks">Pistas de rejilla</a></li>
-   <li><a href="/es/docs/Glossary/Grid_cell">Celda de rejilla</a></li>
-   <li><a href="/es/docs/Glossary/Grid_areas">Áreas de rejilla</a></li>
-   <li><a href="/es/docs/Glossary/Gutters">Canaletas</a></li>
-   <li><a href="/es/docs/Glossary/Grid_Axis">Ejes de rejilla</a></li>
-   <li><a href="/es/docs/Glossary/Grid_rows">Fila de rejilla</a></li>
-   <li><a href="/es/docs/Glossary/Grid_column">Columna de rejilla</a></li>
-  </ol>
- </li>
-</ol>
-</section>
diff --git a/files/es/web/css/css_grid_layout/relationship_of_grid_layout/index.html b/files/es/web/css/css_grid_layout/relationship_of_grid_layout/index.html
new file mode 100644
index 0000000000..f747b94b5d
--- /dev/null
+++ b/files/es/web/css/css_grid_layout/relationship_of_grid_layout/index.html
@@ -0,0 +1,643 @@
+---
+title: Relación de Grid Layout con otros métodos de diseño y posicionamiento - CSS
+slug: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout
+tags:
+  - CSS
+  - CSS Cuadrícula
+  - CSS Grids
+  - CSS Grilla
+  - CSS Rejilla
+  - Guía
+translation_of: Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout
+original_slug: Web/CSS/CSS_Grid_Layout/Relacion_de_Grid_Layout
+---
+<p>CSS Grid Layout ha sido diseñado para trabajar junto con otros elementos de CSS, como parte de un sistema completo para hacer el diseño. En esta guía explicaré cómo se ajusta <em>Grid</em> junto con otras técnicas que ya se estén usando.</p>
+
+<div class="note">
+<p>Las traducciones posibles a la palabra Grid en este contexto son: Grilla, Rejilla, Cuadrícula, Malla. Para efecto del contenido será <em>Grid</em>.</p>
+</div>
+
+<h2 id="Grid_y_flexbox">Grid y flexbox</h2>
+
+<p>La diferencia básica entre CSS Grid Layout y <a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout">CSS Flexbox Layout</a> es que Flexbox se creó para diseños de una dimensión, en una fila o una columna. En cambio CSS Grid Layout se pensó para el diseño bidimensional, en varias filas y columnas al mismo tiempo. Sin embargo, las dos especificaciones comparten algunas características comunes, y si ya has aprendido cómo utilizar Flexbox, verás semejanzas que te ayudarán a entender <em>Grid</em>.</p>
+
+<h3 id="Diseños_de_Una_dimensión_vs._dos_dimensiones">Diseños de Una dimensión vs. dos dimensiones</h3>
+
+<p>Un ejemplo simple puede demostrar la diferencia entre el diseño de una y dos dimensiones.</p>
+
+<p>En este primer ejemplo, estoy usando flexbox para diseñar un conjunto de cajas. Tengo cinco ítems-hijos en mi contenedor y les he dado valores a sus propiedades flex para que puedan aumentar y reducirse desde una flex-basis de 200 píxeles.</p>
+
+<p>También he configurado la propiedad <code>wrap</code>{{cssxref ("flex-wrap")}} , de modo que si el espacio del contenedor se hace demasiado estrecho para mantener esa flex-basis, los ítems se ajustarán (wrap) a una nueva fila.</p>
+
+<div id="onedtwod">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two&lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+  &lt;div&gt;Four&lt;/div&gt;
+  &lt;div&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: flex;
+  flex-wrap: wrap;
+}
+.wrapper &gt; div {
+  flex: 1 1 200px;
+}
+</pre>
+</div>
+
+<p>{{ EmbedLiveSample('onedtwod', '500', '230') }}</p>
+
+<p>En la imagen se puede ver que dos elementos se han ajustado en una nueva línea. Estos ítems comparten el espacio disponible y no están alineados debajo de los ítems de arriba. Esto es porque cuando envuelves (wrap) flex-ítems, cada nueva fila (o columna si se trabaja por columna) se convierte en un nuevo flex-container. La distribución del espacio ocurre a lo largo de la fila.</p>
+
+<p>La pregunta típica entonces es cómo conseguir que estos ítems se alineen. Aquí es donde queremos un método de layout bidimensional, queremos controlar la alineación por fila y columna, y es donde entra el grid.</p>
+
+<h3 id="El_mismo_diseño_con_CSS_Grid_Layout">El mismo diseño con CSS Grid Layout</h3>
+
+<p>En el siguiente ejemplo construyo el mismo diseño usando Grid. Esta vez tenemos tres pistas de columna de <code>1fr</code>. No necesitamos establecer nada sobre los ítems mismos, ellos se colocarán uno dentro de cada celda de la cuadrícula creada. Como se puede ver, se mantienen en una cuadrícula estricta, alineados en filas y columnas. Con cinco ítems, tenemos un hueco al final de la fila dos.</p>
+
+<div class="Two_Dimensional_With_Grid">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two&lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+  &lt;div&gt;Four&lt;/div&gt;
+  &lt;div&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Two_Dimensional_With_Grid', '300', '170') }}</p>
+</div>
+
+<p>Hay una pregunta muy simple para decidir si utilizar grid o flexbox:</p>
+
+<ul>
+ <li>¿Necesito controlar el diseño únicamente por filas o por columnas? – usa flexbox</li>
+ <li>¿Necesito controlar el diseño por filas y por columnas? – usa grid</li>
+</ul>
+
+<h3 id="¿Contenido_fuera_o_layout_dentro">¿Contenido fuera o layout dentro?</h3>
+
+<p>Además de la distinción unidimensional vs bidimensional, hay otra forma de decidir si es mejor utilizar flexbox o grid para un layout. Flexbox trabaja desde el contenido. Un caso de uso ideal para flexbox es cuando tienes un conjunto de ítems y quieres espaciarlos uniformemente en un contenedor. Dejas que el tamaño del contenido decida cuánto espacio ocupa cada ítem. Si los ítems se envuelven (wrap) en una nueva línea, calcularán su espaciado basándose en su tamaño y el espacio disponible <em>en esa línea</em>.</p>
+
+<p>Grid funciona desde el layout hacia adentro. Cuando usas CSS Grid Layout creas un diseño y luego colocas elementos en él, o permites que las reglas de auto-placement coloquen los elementos en las celdas de la cuadrícula de acuerdo con esa cuadrícula estricta. Existe la posibilidad de crear pistas que respondan al tamaño del contenido, sin embargo, también cambiarán toda la pista.</p>
+
+<p>Si estás usando flexbox y estás deshabilitando parte de la flexibilidad, probablemente necesites usar CSS Grid Layout. Un ejemplo sería si estás configurando un ancho de porcentaje en un flex-item para alinearlo con otros ítems de una línea anterior. En ese caso, es probable que Grid sea una mejor opción.</p>
+
+<h3 id="Alineación_de_Cajas">Alineación de Cajas</h3>
+
+<p>La característica de Flexbox que fue más emocionante para muchos de nosotros es que nos dio un control de alineación adecuado por primera vez. Hizo fácil centrar una caja en la página. Los flex-ítems pueden estirarse hasta la altura del flex container, lo que significa que son posibles columnas de la misma altura. Estas eran cosas que queríamos hacer desde hace mucho tiempo, y creamos todo tipo de hacks para conseguir al menos el efecto visual.</p>
+
+<p>Las propiedades de alineación de la especificación de Flexbox se han añadido a una nueva especificación llamada <a href="https://drafts.csswg.org/css-align/">Box Alignment Level 3</a>. Esto significa que pueden utilizarse en otras especificaciones, incluida Grid Layout. En el futuro, es posible que se apliquen también a otros métodos de layout.</p>
+
+<p>En una guía posterior en esta serie voy a echar un vistazo a Box Alignment y cómo funciona en Grid Layout, sin embargo aquí hay un ejemplo simple comparando Flexbox con Grid.</p>
+
+<p>El primer ejemplo utiliza flexbox, tengo un contenedor con tres ítems dentro. El {{cssxref("min-height")}} del wrapper es fijo, por lo que está definiendo la altura del flex container. En el flex container he establecido {{cssxref("align-items")}} en <code>flex-end</code> para que los items se alineen al final del flex container. También he establecido la propiedad {{cssxref("align-self")}} en <code>box1</code> para que anule el valor por defecto y se estire a la altura del contenedor, y en <code>box2</code> para que se alinee con el inicio del contenedor flexible.</p>
+
+<div id="Alineacion_de_cajas">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box1"&gt;One&lt;/div&gt;
+  &lt;div class="box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box3"&gt;Three&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: flex;
+  align-items: flex-end;
+  min-height: 200px;
+}
+.box1 {
+  align-self: stretch;
+}
+.box2 {
+  align-self: flex-start;
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Alineacion_de_cajas', '300', '230') }}</p>
+</div>
+
+<h3 id="Alineación_en_CSS_Grid_Layout">Alineación en CSS Grid Layout</h3>
+
+<p>En este segundo ejemplo uso Grid para construir el mismo diseño, usando las propiedades de alineación como se aplican en el grid layout. Por eso alineamos a <code>start</code> y a <code>end</code> en vez de a <code>flex-start</code> y<code>flex-end</code>. En grid layout alineamos los ítems dentro de su grid area que en este caso es una celda de la rejilla pero puede ser un área formada por múltiples celdas de rejilla.</p>
+
+<div id="Alineacion_en_Cssgrid">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box1"&gt;One&lt;/div&gt;
+  &lt;div class="box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box3"&gt;Three&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3,1fr);
+  align-items: end;
+  grid-auto-rows: 200px;
+}
+.box1 {
+  align-self: stretch;
+}
+.box2 {
+  align-self: start;
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Alineacion_en_Cssgrid', '200', '310') }}</p>
+</div>
+
+<h3 id="La_unidad_fr_y_flex-basis">La unidad <code>fr</code> y <code>flex-basis</code></h3>
+
+<p>Ya hemos visto que la unidad <code>fr</code> asigna a las pistas del grid (tracks) una proporción del espacio disponible en el grid container. La unidad <code>fr</code>combinada con la función {{cssxref("minmax()", "minmax")}} permite un comportamiento muy similar al que tienen las propiedades <code>flex</code> en Flexbox - y todavía mantenemos la posibilidad de crear un layout de dos dimensiones.</p>
+
+<p>Si volvemos al ejemplo en el que demostré la diferencia entre layouts de una y de dos dimensiones, puedes ver que hay una diferencia con respecto al modo de funcionamiento responsive en cada una de ellas. En la flex-layout si arrastramos nuestra ventana haciéndola cada vez más pequeña, flex box ajusta el número de ítems en cada fila de acuerdo al espacio disponible. Si tenemos mucho espacio los cinco ítems pueden caber en una fila, pero si tenemos un contenedor muy estrecho podríamos tener espacio solo para uno.</p>
+
+<p>En comparación, la versión grid siempre mantiene tres pistas de columna: son las pistas mismas las que crecen y se encogen, pero siempre hay tres, ya que al crear la rejilla definimos tres.</p>
+
+<h4 id="Auto-filling_grid_tracks">Auto-filling grid tracks</h4>
+
+<p>Podemos crear un efecto similar a flexbox, mientras mantenemos el contenido organizado en filas y columnas concretas mediante la creación de una lista de tracks usando la notación repeat y las propiedades <code>auto-fill</code> y <code>auto-fit</code>.</p>
+
+<p>En el siguiente ejemplo he usado <code>auto-fill</code> en el lugar del número entero de la notación repeat y he establecido la lista de pistas en 200 píxeles. Esto significa que el grid creará tantas columnas de 200 píxeles como quepan en el container.</p>
+
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two&lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, 200px);
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Auto-filling_grid_tracks', '500', '170') }}</p>
+
+<h3 id="Una_cantidad_flexible_de_pistas">Una cantidad flexible de pistas</h3>
+
+<p>Esto no es lo mismo que flexbox, en el ejemplo de flexbox los elementos son más grandes que la base de 200 píxeles antes del envoltorio. Podemos lograr lo mismo en grid combinando <code>auto-fill</code> y la función {{cssxref("minmax()", "minmax")}}. En el siguiente ejemplo configuro pistas que se rellenan automáticamente con <code>minmax</code>. Quiero que mis pistas tengan un mínimo de 200 píxeles, y luego establezco el máximo en <code>1fr</code>. Una vez que el navegador ha calculado cuántas veces caben 200 píxeles en el contenedor - teniendo en cuenta también la cantidad de espacio entre las rejillas ( grid gaps) - tratará como una instrucción el máximo de <code>1fr</code> y repartirá el espacio restante entre los ítems.</p>
+
+<div id="cantidad_flexible_pistas">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div&gt;One&lt;/div&gt;
+  &lt;div&gt;Two&lt;/div&gt;
+  &lt;div&gt;Three&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+}
+</pre>
+
+<p>{{ EmbedLiveSample('cantidad_flexible_pistas', '500', '170') }}</p>
+</div>
+
+<p>Ahora tenemos la capacidad de crear una cuadrícula con un número flexible de pistas flexibles, y de ver los ítems dispuestos en la cuadrícula alineados por filas y columnas al mismo tiempo.</p>
+
+<h2 id="El_grid_y_los_elementos_absolutamente_posicionados">El grid y los elementos absolutamente posicionados</h2>
+
+<p>Grid interactúa con elementos absolutamente posicionados, lo que puede ser útil si quieres colocar un ítem dentro de una rejilla o de un área de la rejilla. La especificación define el comportamiento cuando un grid container es el bloque contenedor y es el padre del ítem posicionado absolutamente.</p>
+
+<h3 id="El_grid_container_como_bloque_contenedor">El grid container como bloque contenedor</h3>
+
+<p>Para hacer que el grid container sea un bloque contenedor es necesario añadir al container la propiedad position con el valor relative, (de la misma manera que harías para cualquier otro bloque contenedor posicionado absolutamente). Una vez hecho esto, si das la propiedad <code>position:</code> <code>absolute</code> a un grid-item se tomará como bloque que contiene el grid container o, si el ítem también tiene una posición de cuadrícula, como el área de la cuadrícula en la que se coloca.</p>
+
+<p>En el ejemplo de abajo tengo un wrapper que contiene cuatro ítems hijos, el ítem tres está absolutamente posicionado y también está colocado en la cuadrícula usando line-based placement. El grid container tiene <code>position:</code> <code>relative</code> y así se convierte en el contexto de posicionamiento de este elemento.</p>
+
+<div id="grid_container_como_bloque_contenedor">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+    border: 2px solid #f76707;
+    border-radius: 5px;
+    background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+    border: 2px solid #ffa94d;
+    border-radius: 5px;
+    background-color: #ffd8a8;
+    padding: 1em;
+    color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+   &lt;div class="box1"&gt;One&lt;/div&gt;
+   &lt;div class="box2"&gt;Two&lt;/div&gt;
+   &lt;div class="box3"&gt;
+    Este bloque está absolutamente posicionado. En este ejemplo, el grid container es el bloque contenedor, y por ello sus valores offsset para el posicionamiento absoluto se calculan a partir de los bordes exteriores del área en la que está colocado.
+   &lt;/div&gt;
+   &lt;div class="box4"&gt;Four&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+   display: grid;
+   grid-template-columns: repeat(4,1fr);
+   grid-auto-rows: 200px;
+   grid-gap: 20px;
+   position: relative;
+}
+.box3 {
+   grid-column-start: 2;
+   grid-column-end: 4;
+   grid-row-start: 1;
+   grid-row-end: 3;
+   position: absolute;
+   top: 40px;
+   left: 40px;
+}
+</pre>
+
+<p>{{ EmbedLiveSample('grid_container_como_bloque_contenedor', '500', '330') }}</p>
+</div>
+
+<p>Puedes ver que el ítem está ocupando el área de la línea 2 a la 4 de la cuadrícula y que empieza después de la línea 1. Luego se desplaza en esa área usando las propiedades <code>top </code> y <code>left</code>. Sin embargo, se ha sacado del flujo, como ocurre con los objetos en posición absoluta, por lo que las reglas de auto-placement colocan los objetos en ese mismo espacio. El ítem tampoco causa que sea generada la fila adicional para que se extienda a la línea 3.</p>
+
+<p>Si eliminamos <code>position:</code> <code>absolute</code> de las reglas de <code>.box3</code> podemos ver cómo se mostraría sin el posicionamiento.</p>
+
+<h3 id="El_grid_container_como_parent">El grid container como parent</h3>
+
+<p>Si el hijo absolutamente posicionado tiene un grid container como padre pero ese container no crea un nuevo contexto de posicionamiento, entonces se saca del flujo como en el ejemplo anterior. El contexto de posicionamiento será el elemento que cree un contexto de posicionamiento como es común a otros métodos de diseño. En nuestro caso, si eliminamos <code>position:</code> <code>relative</code> del wrapper de arriba, el contexto de posicionamiento es de la ventana de visualización, como se muestra en esta imagen.</p>
+
+<p><img alt="Image of grid container as parent" src="https://mdn.mozillademos.org/files/14661/2_abspos_example.png" style="height: 408px; width: 1702px;"></p>
+
+<p>Una vez más, el ítem ya no participa en el diseño de la cuadrícula en términos de tamaño o cuando otros ítems se colocan automáticamente.</p>
+
+<h3 id="Con_un_grid_area_como_parent_2">Con un grid area como parent</h3>
+
+<p>Si el ítem absolutamente posicionado está anidado dentro de un área de cuadrícula, entonces puede crear un contexto de posicionamiento en esa área. En el ejemplo de abajo tenemos nuestra cuadrícula como antes pero esta vez he anidado un ítem dentro de <code>.box3</code> de la cuadrícula.</p>
+
+<p>He dado a <code>.box3</code> position relative y luego he posicionado el sub-ítem con las propiedades offset. En este caso, el contexto de posicionamiento es el grid area</p>
+
+<div id="Con_un_grid_area_como_parent">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.wrapper &gt; div {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box1"&gt;One&lt;/div&gt;
+  &lt;div class="box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box3"&gt;Three
+    &lt;div class="abspos"&gt;
+     Este bloque está absolutamente posicionado. En este ejemplo, el grid container es el bloque contenedor, y por ello sus valores offsset para el posicionamiento absoluto se calculan a partir de los bordes exteriores del área en la que está colocado.
+    &lt;/div&gt;
+  &lt;/div&gt;
+  &lt;div class="box4"&gt;Four&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(4,1fr);
+  grid-auto-rows: 200px;
+  grid-gap: 20px;
+}
+.box3 {
+  grid-column-start: 2;
+  grid-column-end: 4;
+  grid-row-start: 1;
+  grid-row-end: 3;
+  position: relative;
+}
+.abspos {
+  position: absolute;
+  top: 40px;
+  left: 40px;
+  background-color: rgba(255,255,255,.5);
+  border: 1px solid rgba(0,0,0,0.5);
+  color: #000;
+  padding: 10px;
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Con_un_grid_area_como_parent', '500', '420') }}</p>
+</div>
+
+<h2 id="Grid_y_display_contents">Grid y <code>display:</code> <code>contents</code></h2>
+
+<p>Una interacción final con otra especificación de layout que merece la pena destacar es la interacción entre CSS Grid Layout y <code>display:</code> <code>contents</code>. El valor de <code>contents</code> en la propiedad display es un nuevo valor que se describe en <a href="https://drafts.csswg.org/css-display/#box-generation">Display specification</a> de la siguiente manera:</p>
+
+<blockquote>
+<p>“El elemento en sí no genera ninguna caja, pero sus hijos y pseudo-elementos siguen generando cajas como de costumbre. A efectos de generación y layout de cajas, el elemento debe ser tratado como si hubiera sido sustituido por sus hijos y pseudo-elementos en el árbol del documento”</p>
+</blockquote>
+
+<p>Si configuras un ítem como <code>display:</code> <code>contents</code> la caja que normalmente crearía desaparece, y las cajas de los elementos hijo aparecen como si hubieran subido de nivel. Esto significa que los hijos de un grid item pueden convertirse en grid items. . ¿Suena raro? He aquí un ejemplo sencillo. En el siguiente marcado tengo un grid, el primer ítem del grid se establece para que se expanda tres pistas de columna. Contiene tres ítems anidados. Como esos hijos no son hijos directos, no forman parte del grid layout y por tanto se muestran como <code>display</code>:<code>block</code>.</p>
+
+<div id="Display_Contents_Before">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.box {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+.nested {
+  border: 2px solid #ffec99;
+  border-radius: 5px;
+  background-color: #fff9db;
+  padding: 1em;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box box1"&gt;
+    &lt;div class="nested"&gt;a&lt;/div&gt;
+    &lt;div class="nested"&gt;b&lt;/div&gt;
+    &lt;div class="nested"&gt;c&lt;/div&gt;
+  &lt;/div&gt;
+  &lt;div class="box box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box box3"&gt;Three&lt;/div&gt;
+  &lt;div class="box box4"&gt;Four&lt;/div&gt;
+  &lt;div class="box box5"&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: minmax(100px, auto);
+}
+.box1 {
+  grid-column-start: 1;
+  grid-column-end: 4;
+}
+
+</pre>
+
+<p>{{ EmbedLiveSample('Display_Contents_Before', '400', '420') }}</p>
+</div>
+
+<p>Si ahora añado <code>display:</code> <code>contents</code> a las reglas del box1, la caja de ese ítem desaparece y los subítems se convierten en grid ítems y se despliegan usando las reglas de auto-placement.</p>
+
+<div id="Display_Contents_After">
+<div class="hidden">
+<pre class="brush: css">* {box-sizing: border-box;}
+
+.wrapper {
+  border: 2px solid #f76707;
+  border-radius: 5px;
+  background-color: #fff4e6;
+}
+
+.box {
+  border: 2px solid #ffa94d;
+  border-radius: 5px;
+  background-color: #ffd8a8;
+  padding: 1em;
+  color: #d9480f;
+}
+.nested {
+  border: 2px solid #ffec99;
+  border-radius: 5px;
+  background-color: #fff9db;
+  padding: 1em;
+}
+</pre>
+</div>
+
+<pre class="brush: html">&lt;div class="wrapper"&gt;
+  &lt;div class="box box1"&gt;
+    &lt;div class="nested"&gt;a&lt;/div&gt;
+    &lt;div class="nested"&gt;b&lt;/div&gt;
+    &lt;div class="nested"&gt;c&lt;/div&gt;
+  &lt;/div&gt;
+  &lt;div class="box box2"&gt;Two&lt;/div&gt;
+  &lt;div class="box box3"&gt;Three&lt;/div&gt;
+  &lt;div class="box box4"&gt;Four&lt;/div&gt;
+  &lt;div class="box box5"&gt;Five&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<pre class="brush: css">.wrapper {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  grid-auto-rows: minmax(100px, auto);
+}
+.box1 {
+  grid-column-start: 1;
+  grid-column-end: 4;
+  display: contents;
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Display_Contents_After', '400', '330') }}</p>
+</div>
+
+<p>Esta puede ser una forma de anidar elementos en la rejilla para que actúen como si fueran parte de la rejilla, y es una forma de sortear algunos de los problemas que resolverían los sub-grid una vez que se implementen. También puedes usar <code>display:</code> <code>contents</code> de manera similar en flexbox para que los ítems anidados se conviertan en flex items.</p>
+
+<p>Como puedes ver en esta guía, CSS Grid Layout es sólo una parte de tu kit de herramientas. No tengas miedo de mezclarlo con otros métodos de maquetación, para conseguir los diferentes efectos que necesitas.</p>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li><a href="/es/docs/Web/CSS"><strong>CSS</strong></a></li>
+ <li><a href="/es/docs/Web/CSS/Reference"><strong>CSS Reference</strong></a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a></li>
+ <li data-default-state="open"><a href="#"><strong>Guías</strong></a>
+  <ol>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Conceptos básicos del posicionamiento con rejillas</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relación con otros métodos de posicionamiento</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Posicionamiento basado en líneas</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Áreas de una plantilla de rejilla</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Posicionamiento usando líneas de rejilla con nombres</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Posicionamiento automático en grid layout</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Alineación de cajas en grid layout</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Rejillas, valores lógicos y modos de escritura</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout y Accesibilidad</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout y Mejora Progresiva</a></li>
+   <li><a href="/es/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Layouts comunes utilizando CSS Grid</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Properties</strong></a>
+  <ol>
+   <li><a href="/es/docs/Web/CSS/grid">grid</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-area">grid-area</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column">grid-column</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-gap">grid-gap</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row">grid-row</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template">grid-template</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template-columns">grid-template-columns</a></li>
+   <li><a href="/es/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Glossary</strong></a>
+  <ol>
+   <li><a href="/es/docs/Glossary/Grid">Rejilla</a></li>
+   <li><a href="/es/docs/Glossary/Grid_lines">Líneas de rejilla</a></li>
+   <li><a href="/es/docs/Glossary/Grid_tracks">Pistas de rejilla</a></li>
+   <li><a href="/es/docs/Glossary/Grid_cell">Celda de rejilla</a></li>
+   <li><a href="/es/docs/Glossary/Grid_areas">Áreas de rejilla</a></li>
+   <li><a href="/es/docs/Glossary/Gutters">Canaletas</a></li>
+   <li><a href="/es/docs/Glossary/Grid_Axis">Ejes de rejilla</a></li>
+   <li><a href="/es/docs/Glossary/Grid_rows">Fila de rejilla</a></li>
+   <li><a href="/es/docs/Glossary/Grid_column">Columna de rejilla</a></li>
+  </ol>
+ </li>
+</ol>
+</section>
diff --git a/files/es/web/css/css_images/using_css_gradients/index.html b/files/es/web/css/css_images/using_css_gradients/index.html
new file mode 100644
index 0000000000..baf3d84040
--- /dev/null
+++ b/files/es/web/css/css_images/using_css_gradients/index.html
@@ -0,0 +1,387 @@
+---
+title: Usando gradientes con CSS
+slug: Web/CSS/CSS_Images/Using_CSS_gradients
+translation_of: Web/CSS/CSS_Images/Using_CSS_gradients
+original_slug: CSS/Using_CSS_gradients
+---
+<p><a href="/en-US/docs/CSS/CSS3" title="CSS3">CSS3</a> posee soporte para nuevos tipos de <em>gradientes</em>  en las propiedades CSS. Usarlos <span id="result_box" lang="es"><span class="hps">en</span> <span class="hps">un</span> <span class="hps">segundo plano,</span> <span class="hps">permite mostrar</span> <span class="hps">transiciones suaves</span> <span class="hps">entre dos o</span> <span class="hps">más</span> <span class="hps">colores especificados,</span></span> <span id="result_box" lang="es"><span class="hps">evitando así</span> <span class="hps">el uso de imágenes</span> <span class="hps">para estos efectos</span></span>, lo que reduce<span id="result_box" lang="es"><span class="hps"> el tiempo</span> <span class="hps">de descarga y</span> <span class="hps">el uso de</span> <span class="hps">ancho de banda</span></span>. <span id="result_box" lang="es"><span class="hps">Además</span><span>,</span> <span class="hps">debido a que el</span> <span class="hps">gradiente</span> <span class="hps">es generado por el</span> <span class="hps">navegador</span><span>,</span></span> los <span id="result_box" lang="es"><span class="hps">objetos</span> <span class="hps">degradados</span> <span class="hps">se ven mejor</span> <span class="hps">cuando se hace un acercamiento</span></span>, y el ajuste de diseño es mucho más flexible.</p>
+
+<p>Los navegadores soportan dos tipos de gradientes: <em>lineal</em>, definido con la función <em>linear-gradient</em>, y <em>radial</em>, definido con <em>radial-gradient</em>.</p>
+
+<h2 id="Gradientes_lineales">Gradientes lineales</h2>
+
+<p>Para crear un gradiente lineal, <span id="result_box" lang="es"><span class="hps">se establece un</span> <span class="hps">punto</span> <span class="hps">de partida y una</span> <span class="hps">dirección</span> <span class="hps">(indicada por</span> <span class="hps">un ángulo)</span> <span class="hps">a lo largo de</span> <span class="hps">la cual se aplica</span> <span class="hps">el</span> <span class="hps">efecto</span></span>. Usted también puede definir <strong>paradas de color</strong>. las paradas de color son los colores que usted desea que Gecko renderise con suaves transiciones entre ellos, y usted puede específicar al menos dos de ellas, pero puede específicar más para crear efectos de gradientes más complejos.</p>
+
+<h3 id="Gradientes_lineales_simples">Gradientes lineales simples</h3>
+
+<p>Aquí está un gradiente lineal que inicia en el centro (horizontalmente) y arriba (verticalmente), e inicia en azul, transicionando a blanco.</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Captura de pantalla</td>
+   <td class="header">Demo en vivo</td>
+  </tr>
+  <tr>
+   <td><img alt="" src="/@api/deki/files/3950/=basic_linear_bluetop.png" style="text-align: center;"></td>
+   <td>
+    <div class="gradient-demo linear-top-bottom" style=""> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<div style="margin-right: 255px;">
+<pre class="brush: css">/* La sintaxis vieja, obsoleta, pero todavía necesaria, con prefijo, para Opera y navegadores basados en WebKit-based */
+background: -prefix-linear-gradient(top, blue, white);
+
+/* La nueva sintaxis necesaria para navegadores apegados al estandar (IE 10 y Firefox 10 en adelante), sin prefijo */
+background: linear-gradient(to bottom, blue, white);
+</pre>
+</div>
+
+<h3 id="Cambiando_el_mismo_gradiente_para_correr_de_izquierda_a_derecha">Cambiando el mismo gradiente para correr de izquierda a derecha:</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Captura de pantalla</td>
+   <td class="header">Demo en vivo</td>
+  </tr>
+  <tr>
+   <td><img alt="basic_linear_blueleft.png" class="default internal" src="/@api/deki/files/3951/=basic_linear_blueleft.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">/* la vieja sintaxis, obsoleta, pero todavía necesaria, prefijada, para Opera y Navegadores basados en Webkit */
+background: -prefix-linear-gradient(left, blue, white);
+
+/* La nueva sintaxis necesaria para navegadores apegados al estandar (IE 10 y Firefox 10 en adelante), sin prefijo */
+background: linear-gradient(to right, blue, white);
+</pre>
+
+<p>Usted puede hace el gradiente sea generado diagonalmente mediante la especificación de la posición de inicio vertical y horizontal. Por ejemplo:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Captura de pantalla</td>
+   <td class="header">Demo en vivo</td>
+  </tr>
+  <tr>
+   <td><img alt="basic_linear_bluetopleft.png" class="default internal" src="/@api/deki/files/3952/=basic_linear_bluetopleft.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">/* la vieja sintaxis, obsoleta, pero todavía necesaria, prefijada, para Opera y Navegadores basados en Webkit */
+background: -prefix-linear-gradient(left top, blue, white);
+
+/* La nueva sintaxis necesaria para navegadores apegados al estandar (IE 10 y Firefox 10 en adelante), sin prefijo */
+background: linear-gradient(to bottom right, blue, white);
+</pre>
+
+<h3 id="Usando_Angulos">Usando Angulos</h3>
+
+<p>Si usted no específica un ángulo, uno es determinado automáticamente basado en la dirección dada. Si usted desea más control sobre la dirección del gradiente, usted necesita establecer el ángulo específicamente.</p>
+
+<p>Por ejemplo, aquí hay dos gradientes, el primero con una dirección hacia la derecha, y el segundo tiene un ángulo de 70 grados.</p>
+
+<p><img alt="linear_gradient_angle.png" class="default internal" src="/@api/deki/files/3953/=linear_gradient_angle.png"></p>
+
+<p>El de la derecha usa un CSS Como este:</p>
+
+<pre class="brush: css">background: linear-gradient(70deg, black, white);
+</pre>
+
+<p>El ángulo es especificado como un ángulo entre una línea vertical y la línea del gradiente, contando en el sentido horario. En otras palabras, <code>0deg crea un gradiente vertical desde el fondo hasta el tope, mientras 90deg genera un gradiente horizontal de izquierda a derecha:</code></p>
+
+<p><img alt="linear_redangles.png" class="default internal" src="/files/3811/linear_red_angles.png"></p>
+
+<pre class="brush: css">background: linear-gradient(&lt;angle&gt;, red, white);
+</pre>
+
+<div class="note style-wrap">
+<p><strong>Note:</strong> several browsers implement, prefixed, an older draft of the specification where <code>0deg</code> was pointing to the right rather than to the top. Pay attention in the value of the angle when mixing prefixed and standard linear-gradient, some may need to have <code>90deg</code> added to the <code>&lt;angle&gt;</code>.</p>
+</div>
+
+<h3 id="Color_stops">Color stops</h3>
+
+<p>Color stops are points along the gradient line that will have a specific color at that location. The location can be specified as either a percentage of the length of the line, or as an absolute length. You may specify as many color stops as you like in order to achieve the desired effect.</p>
+
+<p>If you specify the location as a percentage, <code>0%</code> represents the starting point, while <code>100%</code> represents the ending point; however, you can use values outside that range if necessary to get the effect you want.</p>
+
+<h4 id="Example_Three_color_stops">Example: Three color stops</h4>
+
+<p>This example specifies three color stops:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="linear_colorstops1.png" class="default internal" src="/@api/deki/files/3955/=linear_colorstops1.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">/* The old syntax, deprecated, but still needed, prefixed, for Opera and WebKit-based browsers */
+background: -prefix-linear-gradient(top, blue, white 80%, orange);
+
+/* The new syntax needed by standard-compliant browsers (IE 10 and Firefox 10 onwards), without prefix */
+background: linear-gradient(to bottom, blue, white 80%, orange);
+</pre>
+
+<p>Note that the first and last color stops don't specify a location; because of that, values of 0% and 100% are assigned automatically. The middle color stop specifies a location of 80%, putting it most of the way toward the bottom.</p>
+
+<h4 id="Example_Evenly_spaced_color_stops">Example: Evenly spaced color stops</h4>
+
+<p>Here's an example using a wide variety of colors, all evenly spaced:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="linear_rainbow.png" class="default internal" src="/@api/deki/files/3956/=linear_rainbow.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">/* The old syntax, deprecated, but still needed, prefixed, for Opera and WebKit-based browsers */
+background: -prefix-linear-gradient(left, red, orange, yellow, green, blue);
+
+/* The new syntax needed by standard-compliant browsers (IE 10 and Firefox 10 onwards), without prefix */
+background: linear-gradient(to right, red, orange, yellow, green, blue);
+</pre>
+
+<p>Notice that the color stops are automatically spaced evenly when no locations are specified.</p>
+
+<h3 id="Transparency_and_gradients">Transparency and gradients</h3>
+
+<p>Gradients support transparency. You can use this, for example, when stacking multiple backgrounds, to create fading effects on background images. For example:</p>
+
+<p><img alt="linear_multibg_transparent.png" class="default internal" src="/@api/deki/files/3957/=linear_multibg_transparent.png"></p>
+
+<pre class="brush: css">/* The old syntax, deprecated, but still needed, prefixed, for Opera and WebKit-based browsers */
+background: linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,1)), url(http://foo.com/image.jpg);
+
+/* The new syntax needed by standard-compliant browsers (IE 10 and Firefox 10 onwards), without prefix */
+background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)), url(http://foo.com/image.jpg);
+</pre>
+
+<p>The backgrounds are stacked with the first specified background on top, and each successive background farther away. By stacking backgrounds this way, you can create very creative effects as seen above.</p>
+
+<h2 id="Radial_gradients">Radial gradients</h2>
+
+<p>Radial gradients are specified using the {{ cssxref("radial-gradient") }} functional notation. The syntax is similar to that for linear gradients, except you can specify the gradient's ending shape (whether it should be a circle or ellipse) as well as its size. By default, the ending shape is an ellipse with the same proportions than the container's box.</p>
+
+<h3 id="Color_stops_2">Color stops</h3>
+
+<p>You specify color stops the same way as for linear gradients. The gradient line extends out from the starting position in all directions.</p>
+
+<h4 id="Example_Evenly_spaced_color_stops_2">Example: Evenly spaced color stops</h4>
+
+<p>By default, as with linear gradients, the color stops are evenly spaced:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="radial_gradient_even.png" class="default internal" src="/@api/deki/files/3958/=radial_gradient_even.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">background: radial-gradient(red, yellow, rgb(30, 144, 255));
+</pre>
+
+<h4 id="Example_Explicitly_spaced_color_stops">Example: Explicitly spaced color stops</h4>
+
+<p>Here we specify specific locations for the color stops:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="radial_gradient_varied.png" class="default internal" src="/@api/deki/files/3959/=radial_gradient_varied.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">background: radial-gradient(red 5%, yellow 25%, #1E90FF 50%);
+</pre>
+
+<h3 id="Size">Size</h3>
+
+<p>This is one of the areas in which radial gradients differ from linear gradients. You can provide a size value that specifies the point that defines the size of the circle or ellipse. See <a href="/en-US/docs/CSS/radial-gradient#Size_constants" title="en-US/docs/CSS/-moz-radial-gradient#Size constants">this description of the size constants</a> for specifics.</p>
+
+<h4 id="Example_closest-side_for_ellipses">Example: closest-side for ellipses</h4>
+
+<p>This ellipse uses the <code>closest-side</code> size value, which means the size is set by the distance from the starting point (the center) to the closest side of the enclosing box.</p>
+
+<table class="standard-table" style="width: 520px;">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="radial_ellipse_size1.png" class="default internal" src="/@api/deki/files/3960/=radial_ellipse_size1.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">background: radial-gradient(ellipse closest-side, red, yellow 10%, #1E90FF 50%, white);
+</pre>
+
+<h4 id="Example_farthest-corner_for_ellipses">Example: farthest-corner for ellipses</h4>
+
+<p>This example is similar to the previous one, except that its size is specified as <code>farthest-corner</code>, which sets the size of the gradient by the distance from the starting point to the farthest corner of the enclosing box from the starting point.</p>
+
+<table class="standard-table" style="width: 520px;">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="radial_ellipse_size2.png" class="default internal" src="/@api/deki/files/3961/=radial_ellipse_size2.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">background: radial-gradient(ellipse farthest-corner, red, yellow 10%, #1E90FF 50%, white);
+</pre>
+
+<h4 id="Example_closest-side_for_circles">Example: closest-side for circles</h4>
+
+<p>This example uses <code>closest-side</code>, which determines the circle's size as the distance between the start point (the center) and the closest side.</p>
+
+<table class="standard-table" style="width: 520px;">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="radial_circle_size1.png" class="default internal" src="/@api/deki/files/3962/=radial_circle_size1.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">background: radial-gradient(circle closest-side, red, yellow 10%, #1E90FF 50%, white);
+</pre>
+
+<p>Here, the circle's radius is half the height of the box, since the top and bottom edges are equidistant from the start point and are closer than the left and right edges.</p>
+
+<h2 id="Repeating_gradients">Repeating gradients</h2>
+
+<p>The {{ cssxref("linear-gradient") }} and {{ cssxref("radial-gradient") }} properties don't support automatically repeating the color stops. However, the {{ cssxref("repeating-linear-gradient") }} and {{ cssxref("repeating-radial-gradient") }} properties are available to offer this functionality.</p>
+
+<h3 id="Examples_Repeating_linear_gradient">Examples: Repeating linear gradient</h3>
+
+<p>This example uses {{ cssxref("repeating-linear-gradient") }} to create a gradient:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="repeating_linear_gradient.png" class="default internal" src="/@api/deki/files/3964/=repeating_linear_gradient.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">background: repeating-linear-gradient(-45deg, red, red 5px, white 5px, white 10px);
+</pre>
+
+<p>Another example using the {{ cssxref("repeating-linear-gradient") }} property.</p>
+
+<p><a href="/@api/deki/files/6192/=repeat_background_gradient_checked.png" title="repeat_background_gradient_checked.png"><img alt="repeat_background_gradient_checked.png" class="default internal" src="/@api/deki/files/6192/=repeat_background_gradient_checked.png?size=thumb" style="height: 160px; width: 160px;"></a></p>
+
+<pre class="brush: css">background-color: #000;
+background-image: repeating-linear-gradient(90deg, transparent, transparent 50px,
+      rgba(255, 127, 0, 0.25) 50px, rgba(255, 127, 0, 0.25) 56px, transparent 56px, transparent 63px,
+      rgba(255, 127, 0, 0.25) 63px, rgba(255, 127, 0, 0.25) 69px, transparent 69px, transparent 116px,
+      rgba(255, 206, 0, 0.25) 116px, rgba(255, 206, 0, 0.25) 166px),
+repeating-linear-gradient(0deg, transparent, transparent 50px, rgba(255, 127, 0, 0.25) 50px,
+      rgba(255, 127, 0, 0.25) 56px, transparent 56px, transparent 63px, rgba(255, 127, 0, 0.25) 63px,
+      rgba(255, 127, 0, 0.25) 69px, transparent 69px, transparent 116px, rgba(255, 206, 0, 0.25) 116px,
+      rgba(255, 206, 0, 0.25) 166px),
+repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(143, 77, 63, 0.25) 5px,
+      rgba(143, 77, 63, 0.25) 10px),
+repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(143, 77, 63, 0.25) 5px,
+      rgba(143, 77, 63, 0.25) 10px);
+</pre>
+
+<h3 id="Example_Repeating_radial_gradient">Example: Repeating radial gradient</h3>
+
+<p>This example uses {{ cssxref("repeating-radial-gradient") }} to create a gradient:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Screen Shot</td>
+   <td class="header">Live Demo</td>
+  </tr>
+  <tr>
+   <td><img alt="repeating_radial_gradient.png" class="default internal" src="/@api/deki/files/3965/=repeating_radial_gradient.png"></td>
+   <td>
+    <div> </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<pre class="brush: css">background: repeating-radial-gradient(black, black 5px, white 5px, white 10px);
+</pre>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>Gradient-related reference articles: {{cssxref("&lt;image&gt;")}}, {{cssxref("&lt;gradient&gt;")}}, {{cssxref("linear-gradient")}}, {{cssxref("radial-gradient")}}, {{cssxref("repeating-linear-gradient")}}, {{cssxref("repeating-radial-gradient")}}.</li>
+</ul>
diff --git a/files/es/web/css/css_logical_properties/dimensionamiento/index.html b/files/es/web/css/css_logical_properties/dimensionamiento/index.html
deleted file mode 100644
index a5a9b4063c..0000000000
--- a/files/es/web/css/css_logical_properties/dimensionamiento/index.html
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: Dimensionamiento para propiedades lógicas
-slug: Web/CSS/CSS_Logical_Properties/Dimensionamiento
-translation_of: Web/CSS/CSS_Logical_Properties/Sizing
----
-<div>{{CSSRef}}</div>
-
-<p class="summary">En esta guía explicaremos las asignaciones relativas al flujo relativo entre las propiedades de dimensionamiento físico y lógico usados para dimensionar elementos en nuestras páginas.</p>
-
-<p>Cuando especificamos el tamaño de un ítem, las <a href="https://drafts.csswg.org/css-logical/">Propiedades y Valores Lógicos</a> te dan la habilidad de indicar el dimensionamiento en relación al flujo relativo del texto (en línea y bloque) más bien que dimensionamiento físico con relación a las dimensiones físicas: horizontal y vertical (por ejemplo, left y right). Si bien estas asignaciones de flujo relativo pueden convertirse en el valor predeterminado para muchos de nosotros, en un diseño puede usar el tamaño físico y el tamaño lógico. Es posible que desee que algunas características se relacionen siempre con las dimensiones físicas, independientemente del modo de escritura.</p>
-
-<h2 id="Asignaciones_para_dimensiones">Asignaciones para dimensiones</h2>
-
-<p>La siguiente tabla proporciona asignaciones entre propiedades lógicas y físicas. Estas asignaciones asumen que estás en un modo de escritura  <code>horizontal-tb</code>, como Inglés o Árabe, en cada caso el ancho ({{CSSxRef("width")}}) sería asignado a {{CSSxRef("inline-size")}}.</p>
-
-<p>Si tú estás en un modo de escritura vertical, entonces {{CSSxRef("inline-size")}} sería asignado a {{CSSxRef("height")}}.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedades Lógicas</th>
-   <th scope="col">Propiedades Físicas</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{CSSxRef("inline-size")}}</td>
-   <td>{{CSSxRef("width")}}</td>
-  </tr>
-  <tr>
-   <td>{{CSSxRef("block-size")}}</td>
-   <td>{{CSSxRef("height")}}</td>
-  </tr>
-  <tr>
-   <td>{{CSSxRef("min-inline-size")}}</td>
-   <td>{{CSSxRef("min-width")}}</td>
-  </tr>
-  <tr>
-   <td>{{CSSxRef("min-block-size")}}</td>
-   <td>{{CSSxRef("min-height")}}</td>
-  </tr>
-  <tr>
-   <td>{{CSSxRef("max-inline-size")}}</td>
-   <td>{{CSSxRef("max-width")}}</td>
-  </tr>
-  <tr>
-   <td>{{CSSxRef("max-block-size")}}</td>
-   <td>{{CSSxRef("max-height")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplo_de_ancho_y_alto">Ejemplo de ancho y alto</h2>
-
-<p>Las asignaciones para el ancho ({{CSSxRef("width")}}) y el alto ({{CSSxRef("height")}}) son {{CSSxRef("inline-size")}}, que establece el largo en la dimensión en línea y {{CSSxRef("block-size")}}, que establece el largo en la dimensión en bloque. Cuando trabajamos en Inglés, si reemplazamos el ancho (<code>width</code>) con <code>inline-size</code> y el alto (<code>height</code>) con <code>block-size</code> dará el mismo diseño.</p>
-
-<p>En el siguiente ejemplo, establecemos un modo de escritura <code>horizontal-tb</code>. Cambiamos esto por <code>vertical-rl</code> y veremos que el primer ejemplo — cuando usamos <code>width</code> y <code>height</code> — permanece con el mismo tamaño en cada dimensión, a pesar de que el texto se vuelve vertical. El segundo ejemplo — cuando usamos <code>inline-size</code> y <code>block-size</code> — seguirá la dirección del texto como si todo el bloque hubiera girado.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/logical/size-inline-block.html", '100%', 500)}}</p>
-
-<h2 id="Ejemplo_de_ancho_y_alto_mínimo">Ejemplo de ancho y alto mínimo</h2>
-
-<p>También hay asignaciones para {{CSSxRef ("min-width")}} y {{CSSxRef ("min-height")}} — estas son {{CSSxRef ("min-inline-size")}} y {{ CSSxRef ("min-block-size")}}. Estas funcionan de la misma manera que las propiedades de <code>inline-size</code> y <code>block-size</code>, pero establecen un tamaño mínimo en lugar de uno fijo.<br>
- <br>
- Intente cambiar el siguiente ejemplo a <code>vertical-rl</code>, como en el primer ejemplo, para ver el efecto que tiene. Estoy usando <code>min-height</code> en el primer ejemplo y <code>min-block-size</code> en el segundo.</p>
-
-<p> </p>
-
-<p>{{EmbedGHLiveSample("css-examples/logical/size-min.html", "100%", 500)}}</p>
-
-<h2 id="Ejemplo_de_ancho_y_alto_máximo">Ejemplo de ancho y alto máximo</h2>
-
-<p>Finalmente, puedes usar {{CSSxRef("max-inline-size")}} y {{CSSxRef("max-block-size")}} como reemplazos de {{CSSxRef("max-width")}} y {{CSSxRef("max-height")}}. Intenta jugar con el siguiente ejemplo de la misma manera que antes.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/logical/size-max.html", "100%", 500)}}</p>
-
-<h2 id="Palabras_claves_para_redimensionamiento_lógico">Palabras claves para redimensionamiento lógico</h2>
-
-<p>La propiedad {{CSSxRef("resize")}} establece si un elemento se puede redimensionar o no y si tiene valores físicos de <code>horizontal</code> y <code>vertical</code>. La propiedad <code>resize</code> también tiene valores de palabras clave lógicas. Usar <code>resize: inline</code> permite cambiar el tamaño en la dimensión inline y <code>resize: block</code> permite cambiar el tamaño en la dimensión de bloque.</p>
-
-<p>El valor de la palabra clave de <code>both</code>para la propiedad de cambio de tamaño funciona ya sea que esté pensando física o lógicamente. Establece ambas dimensiones a la vez. Intenta jugar con el siguiente ejemplo.</p>
-
-<p>{{EmbedGHLiveSample("css-examples/logical/size-resize.html", "100%", 700)}}</p>
-
-<div class="blockIndicator warning">
-<p><strong>Nota:</strong> <span style="font-size: 1rem; letter-spacing: -0.00278rem;">Tenga en cuenta que actualmente los valores lógicos para el cambio de tamaño solo son compatibles con Firefox.</span></p>
-
-<p> </p>
-</div>
diff --git a/files/es/web/css/css_logical_properties/sizing/index.html b/files/es/web/css/css_logical_properties/sizing/index.html
new file mode 100644
index 0000000000..4de1607e48
--- /dev/null
+++ b/files/es/web/css/css_logical_properties/sizing/index.html
@@ -0,0 +1,90 @@
+---
+title: Dimensionamiento para propiedades lógicas
+slug: Web/CSS/CSS_Logical_Properties/Sizing
+translation_of: Web/CSS/CSS_Logical_Properties/Sizing
+original_slug: Web/CSS/CSS_Logical_Properties/Dimensionamiento
+---
+<div>{{CSSRef}}</div>
+
+<p class="summary">En esta guía explicaremos las asignaciones relativas al flujo relativo entre las propiedades de dimensionamiento físico y lógico usados para dimensionar elementos en nuestras páginas.</p>
+
+<p>Cuando especificamos el tamaño de un ítem, las <a href="https://drafts.csswg.org/css-logical/">Propiedades y Valores Lógicos</a> te dan la habilidad de indicar el dimensionamiento en relación al flujo relativo del texto (en línea y bloque) más bien que dimensionamiento físico con relación a las dimensiones físicas: horizontal y vertical (por ejemplo, left y right). Si bien estas asignaciones de flujo relativo pueden convertirse en el valor predeterminado para muchos de nosotros, en un diseño puede usar el tamaño físico y el tamaño lógico. Es posible que desee que algunas características se relacionen siempre con las dimensiones físicas, independientemente del modo de escritura.</p>
+
+<h2 id="Asignaciones_para_dimensiones">Asignaciones para dimensiones</h2>
+
+<p>La siguiente tabla proporciona asignaciones entre propiedades lógicas y físicas. Estas asignaciones asumen que estás en un modo de escritura  <code>horizontal-tb</code>, como Inglés o Árabe, en cada caso el ancho ({{CSSxRef("width")}}) sería asignado a {{CSSxRef("inline-size")}}.</p>
+
+<p>Si tú estás en un modo de escritura vertical, entonces {{CSSxRef("inline-size")}} sería asignado a {{CSSxRef("height")}}.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedades Lógicas</th>
+   <th scope="col">Propiedades Físicas</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{CSSxRef("inline-size")}}</td>
+   <td>{{CSSxRef("width")}}</td>
+  </tr>
+  <tr>
+   <td>{{CSSxRef("block-size")}}</td>
+   <td>{{CSSxRef("height")}}</td>
+  </tr>
+  <tr>
+   <td>{{CSSxRef("min-inline-size")}}</td>
+   <td>{{CSSxRef("min-width")}}</td>
+  </tr>
+  <tr>
+   <td>{{CSSxRef("min-block-size")}}</td>
+   <td>{{CSSxRef("min-height")}}</td>
+  </tr>
+  <tr>
+   <td>{{CSSxRef("max-inline-size")}}</td>
+   <td>{{CSSxRef("max-width")}}</td>
+  </tr>
+  <tr>
+   <td>{{CSSxRef("max-block-size")}}</td>
+   <td>{{CSSxRef("max-height")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplo_de_ancho_y_alto">Ejemplo de ancho y alto</h2>
+
+<p>Las asignaciones para el ancho ({{CSSxRef("width")}}) y el alto ({{CSSxRef("height")}}) son {{CSSxRef("inline-size")}}, que establece el largo en la dimensión en línea y {{CSSxRef("block-size")}}, que establece el largo en la dimensión en bloque. Cuando trabajamos en Inglés, si reemplazamos el ancho (<code>width</code>) con <code>inline-size</code> y el alto (<code>height</code>) con <code>block-size</code> dará el mismo diseño.</p>
+
+<p>En el siguiente ejemplo, establecemos un modo de escritura <code>horizontal-tb</code>. Cambiamos esto por <code>vertical-rl</code> y veremos que el primer ejemplo — cuando usamos <code>width</code> y <code>height</code> — permanece con el mismo tamaño en cada dimensión, a pesar de que el texto se vuelve vertical. El segundo ejemplo — cuando usamos <code>inline-size</code> y <code>block-size</code> — seguirá la dirección del texto como si todo el bloque hubiera girado.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/logical/size-inline-block.html", '100%', 500)}}</p>
+
+<h2 id="Ejemplo_de_ancho_y_alto_mínimo">Ejemplo de ancho y alto mínimo</h2>
+
+<p>También hay asignaciones para {{CSSxRef ("min-width")}} y {{CSSxRef ("min-height")}} — estas son {{CSSxRef ("min-inline-size")}} y {{ CSSxRef ("min-block-size")}}. Estas funcionan de la misma manera que las propiedades de <code>inline-size</code> y <code>block-size</code>, pero establecen un tamaño mínimo en lugar de uno fijo.<br>
+ <br>
+ Intente cambiar el siguiente ejemplo a <code>vertical-rl</code>, como en el primer ejemplo, para ver el efecto que tiene. Estoy usando <code>min-height</code> en el primer ejemplo y <code>min-block-size</code> en el segundo.</p>
+
+<p> </p>
+
+<p>{{EmbedGHLiveSample("css-examples/logical/size-min.html", "100%", 500)}}</p>
+
+<h2 id="Ejemplo_de_ancho_y_alto_máximo">Ejemplo de ancho y alto máximo</h2>
+
+<p>Finalmente, puedes usar {{CSSxRef("max-inline-size")}} y {{CSSxRef("max-block-size")}} como reemplazos de {{CSSxRef("max-width")}} y {{CSSxRef("max-height")}}. Intenta jugar con el siguiente ejemplo de la misma manera que antes.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/logical/size-max.html", "100%", 500)}}</p>
+
+<h2 id="Palabras_claves_para_redimensionamiento_lógico">Palabras claves para redimensionamiento lógico</h2>
+
+<p>La propiedad {{CSSxRef("resize")}} establece si un elemento se puede redimensionar o no y si tiene valores físicos de <code>horizontal</code> y <code>vertical</code>. La propiedad <code>resize</code> también tiene valores de palabras clave lógicas. Usar <code>resize: inline</code> permite cambiar el tamaño en la dimensión inline y <code>resize: block</code> permite cambiar el tamaño en la dimensión de bloque.</p>
+
+<p>El valor de la palabra clave de <code>both</code>para la propiedad de cambio de tamaño funciona ya sea que esté pensando física o lógicamente. Establece ambas dimensiones a la vez. Intenta jugar con el siguiente ejemplo.</p>
+
+<p>{{EmbedGHLiveSample("css-examples/logical/size-resize.html", "100%", 700)}}</p>
+
+<div class="blockIndicator warning">
+<p><strong>Nota:</strong> <span style="font-size: 1rem; letter-spacing: -0.00278rem;">Tenga en cuenta que actualmente los valores lógicos para el cambio de tamaño solo son compatibles con Firefox.</span></p>
+
+<p> </p>
+</div>
diff --git a/files/es/web/css/css_modelo_caja/index.html b/files/es/web/css/css_modelo_caja/index.html
deleted file mode 100644
index 320800f82e..0000000000
--- a/files/es/web/css/css_modelo_caja/index.html
+++ /dev/null
@@ -1,165 +0,0 @@
----
-title: Modelo de Caja de CSS
-slug: Web/CSS/CSS_Modelo_Caja
-tags:
-  - CSS
-  - Modelo de Caja CSS
-  - Referencia CSS
-  - Visión general
-translation_of: Web/CSS/CSS_Box_Model
----
-<div>{{CSSRef}}</div>
-
-<p><strong>El modelo de caja CSS </strong> es un módulo  CSS que define cajas rectangulares, incluyendo sus rellenos y márgenes, que son generadas para los elementos y que se disponen de acuerdo al modelo de formato visual.</p>
-
-<h2 id="Referencia">Referencia</h2>
-
-<h3 id="Propiedades">Propiedades</h3>
-
-<h4 id="Propiedades_que_controlan_el_flujo_del_contenido_en_una_caja.">Propiedades que controlan el flujo del contenido en una caja.</h4>
-
-<div class="index">
-<ul>
- <li>{{cssxref("box-decoration-break")}}</li>
- <li>{{cssxref("box-sizing")}}</li>
- <li>{{cssxref("overflow")}}</li>
- <li>{{cssxref("overflow-x")}}</li>
- <li>{{cssxref("overflow-y")}}</li>
-</ul>
-</div>
-
-<h4 id="Propiedades_que_controlan_el_tamaño_de_una_caja.">Propiedades que controlan el tamaño de una caja.</h4>
-
-<div class="index">
-<ul>
- <li>{{cssxref("height")}}</li>
- <li>{{cssxref("width")}}</li>
- <li>{{cssxref("max-height")}}</li>
- <li>{{cssxref("max-width")}}</li>
- <li>{{cssxref("min-height")}}</li>
- <li>{{cssxref("min-width")}}</li>
-</ul>
-</div>
-
-<h4 id="Propiedades_que_controlan_los_márgenes_de_una_caja.">Propiedades que controlan los márgenes de una caja.</h4>
-
-<div class="index">
-<ul>
- <li>{{cssxref("margin")}}</li>
- <li>{{cssxref("margin-bottom")}}</li>
- <li>{{cssxref("margin-left")}}</li>
- <li>{{cssxref("margin-right")}}</li>
- <li>{{cssxref("margin-top")}}</li>
-</ul>
-</div>
-
-<h4 id="Propiedades_que_controlan_los_rellenos_de_una_caja">Propiedades que controlan los rellenos de una caja</h4>
-
-<div class="index">
-<ul>
- <li>{{cssxref("padding")}}</li>
- <li>{{cssxref("padding-bottom")}}</li>
- <li>{{cssxref("padding-left")}}</li>
- <li>{{cssxref("padding-right")}}</li>
- <li>{{cssxref("padding-top")}}</li>
-</ul>
-</div>
-
-<h4 id="Otras_propiedades">Otras propiedades</h4>
-
-<div class="index">
-<ul>
- <li>{{cssxref("box-shadow")}}</li>
- <li>{{cssxref("visibility")}}</li>
-</ul>
-</div>
-
-<h2 id="Guías_y_Herramientas">Guías y Herramientas</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model">Introduction to the CSS box model</a></dt>
- <dd>Explica uno de los conceptos fundamentales de CSS, el modelo de caja: describe el significado del margen, del relleno, así como de las diferentes zonas de una caja.</dd>
- <dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing">Mastering margin collapsing</a></dt>
- <dd>En determinados casos dos márgenes adyacentes se convierten en uno. Este artículo explica cuando sucede esto y cómo controlarlo.</dd>
- <dt><a href="/en-US/docs/Web/CSS/CSS_Box_Model/Box-shadow_generator">Box-shadow generator</a></dt>
- <dd>Una herramienta interactiva que permite crear sombras y proporciona la síntaxis necesaria para generar dichas sombras usando la propiedad {{cssxref("box-shadow")}}.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Box")}}</td>
-   <td>{{Spec2("CSS3 Box")}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName("CSS2.1", "box.html")}}</td>
-   <td>{{Spec2("CSS2.1")}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName("CSS1")}}</td>
-   <td>{{Spec2("CSS1")}}</td>
-   <td>Definición Inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1")}}</td>
-   <td>3.0</td>
-   <td>3.5</td>
-   <td>1.0 (85)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoMobile("1")}}</td>
-   <td>6.0</td>
-   <td>6.0</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/css_modelo_caja/introducción_al_modelo_de_caja_de_css/index.html b/files/es/web/css/css_modelo_caja/introducción_al_modelo_de_caja_de_css/index.html
deleted file mode 100644
index 45571faf77..0000000000
--- a/files/es/web/css/css_modelo_caja/introducción_al_modelo_de_caja_de_css/index.html
+++ /dev/null
@@ -1,66 +0,0 @@
----
-title: Introducción al Modelo de Caja de CSS
-slug: Web/CSS/CSS_Modelo_Caja/Introducción_al_modelo_de_caja_de_CSS
-tags:
-  - CSS
-  - Guía
-  - Modelo de Caja
-  - Referencia
-translation_of: Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model
----
-<div>{{CSSRef}}</div>
-
-<p><span id="result_box" lang="es">Al diseñar un documento, el motor de representación del navegador representa cada elemento como un cuadro rectangular según el estándar</span><span lang="es"><span> <strong>modelo de caja de CSS</strong>.</span> <span>CSS determina el tamaño, la posición y las propiedades (color, fondo, tamaño del borde, etc.) de estos cuadros.</span></span></p>
-
-<p><span id="result_box" lang="es"><span>Cada caja se compone de cuatro partes (o áreas), definidas por sus respectivos límites: el <em>límite del contenido</em>, el <em>límite del relleno (padding)</em>, el <em>límite del borde</em> y el <em>límite del margen</em>.</span></span></p>
-
-<p><img alt="CSS Box model" src="https://mdn.mozillademos.org/files/8685/boxmodel-(3).png" style="height: 384px; width: 548px;"></p>
-
-<p><a name="content-area"></a><span id="result_box" lang="es"><span>El <strong>área de contenido</strong>, delimitada por el límite del contenido, contiene el contenido "real" del elemento, como lo puede ser texto, imagen o un reproductor de video.</span> <span>Sus dimensiones son el <em>ancho del contenido</em> (o el <em>ancho de la caja de contenido</em>) y la <em>altura del contenido</em> (o la <em>altura de la caja de contenido</em>).</span> <span>A menudo tiene un color de fondo o una imagen de fondo.</span></span></p>
-
-<p><span id="result_box" lang="es"><span>Si la propiedad </span></span>{{cssxref("box-sizing")}}<span lang="es"><span> está configurada en </span></span><code>content-box</code><span lang="es"><span> (default), el tamaño del área de contenido se puede definir explícitamente con las propiedades de </span></span>{{cssxref("width")}}<span lang="es"><span>, </span></span>{{cssxref("min-width")}}<span lang="es"><span>, </span></span>{{cssxref("max-width")}}<span lang="es"><span>, </span></span>{{ cssxref("height")}}<span lang="es"><span>, </span></span>{{cssxref("min-height")}}<span lang="es"><span> y </span></span>{{cssxref("max-height")}}<span lang="es"><span>.</span></span></p>
-
-<p><a name="padding-area"></a><span id="result_box" lang="es"><span>El <strong>área de relleno</strong> (padding), delimitada por el límite del relleno, extiende el área de contenido para incluir el relleno del elemento.</span> <span>Sus dimensiones son el <em>ancho de la caja de relleno</em> y la <em>altura de la caja de relleno</em>.</span> <span>Cuando el área de contenido tiene un fondo, se extiende dentro del relleno.</span></span></p>
-
-<p><span id="result_box" lang="es"><span>El espesor del relleno está determinado por </span></span><span lang="es"><span>las propiedades </span></span>{{cssxref("padding-top")}}<span lang="es"><span>, </span></span>{{cssxref("padding-right")}}<span lang="es"><span>, </span></span>{{cssxref("padding-bottom")}}<span lang="es"><span>, </span></span>{{cssxref("padding-left")}}<span lang="es"><span>, y la propiedad abreviada </span></span>{{cssxref("padding")}}<span lang="es"><span>.</span></span></p>
-
-<p><a name="border-area"></a><span id="result_box" lang="es"><span>El <strong>área del borde</strong>, delimitada por el límite del borde, extiende el área de relleno para incluir los bordes del elemento.</span> <span>Sus dimensiones son el <em>ancho de la caja del borde</em> y la <em>altura de la caja del borde</em>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span>El espesor de los bordes está determinado por las propiedades {{cssxref("border-width")}} y la propiedad abreviada {{cssxref("border")}}.</span> <span>Si la propiedad {{cssxref("box-sizing")}} se establece en </span></span><code>border-box</code><span lang="es"><span>, el tamaño del área del borde se puede definir explícitamente con las propiedades {{cssxref("width")}}, {{cssxref("min-</span> <span>width")}}, {{cssxref("max-width")}}, {{cssxref("height")}}, {{cssxref("min-height")}}, y {{cssxref("max</span><span>-height")}}.</span></span></p>
-
-<p><a name="margin-area"></a><span id="result_box" lang="es"><span>El <strong>área del margen</strong>, delimitada por el límite del margen, extiende el área del borde para incluir un área vacía utilizada para separar el elemento de sus vecinos.</span> <span>Sus dimensiones son el <em>ancho de la caja del margen</em> y la <em>altura de la caja del margen</em>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span>El tamaño del área del margen está determinado por las propiedades </span></span>{{cssxref("margin-top")}}<span lang="es"><span>, {{cssxref("margin-right")}}, {{cssxref ("margin-bottom")}}, {</span> <span>{cssxref("margin-left")}}, y la propiedad abreviada {{cssxref ("margin")}}.</span> <span>Cuando se produce el</span></span> <a href="/en/CSS/margin_collapsing" title="en/CSS/margin_collapsing">colapso del margen</a><span lang="es"><span>, el área del margen no está claramente definida ya que los márgenes se comparten entre las cajas.</span></span></p>
-
-<p><span id="result_box" lang="es"><span>Finalmente, ten en cuenta que para elementos en línea no reemplazados, la cantidad de espacio ocupado (la contribución a la altura de la línea) está determinada por la propiedad {{cssxref ('line-height')}}, aunque los bordes y</span> <span>el relleno todavía se muestran alrededor del contenido.</span></span></p>
-
-<h2 id="Especificación">Especificación</h2>
-
-<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("CSS2.1","box.html#box-dimensions")}}</td>
-   <td>{{ Spec2('CSS2.1') }}</td>
-   <td><span id="result_box" lang="es"><span>Aunque está redactado con más precisión, no hay cambio práctico.</span></span></td>
-  </tr>
-  <tr>
-   <td>{{ SpecName("CSS1","#formatting-model")}}</td>
-   <td>{{ Spec2('CSS1') }}</td>
-   <td><span class="short_text" id="result_box" lang="es"><span>Definición inicial</span></span></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{css_key_concepts}}</li>
- <li>Propiedades CSS relacionadas: {{ cssxref("box-sizing") }}, {{ cssxref("background-clip") }}, {{ cssxref("height") }}, {{ cssxref("max-height") }}, {{ cssxref("min-height") }}, {{ cssxref("width") }}, {{ cssxref("max-height") }}, {{ cssxref("min-height") }}, {{ cssxref("padding") }}, {{ cssxref("padding-top") }}, {{ cssxref("padding-right") }}, {{ cssxref("padding-bottom") }}, {{ cssxref("padding-left") }}, {{ cssxref("border") }}, {{ cssxref("border-top") }}, {{ cssxref("border-right") }}, {{ cssxref("border-bottom") }}, {{ cssxref("border-left") }}, {{ cssxref("border-width") }}, {{ cssxref("border-top-width") }}, {{ cssxref("border-right-width") }}, {{ cssxref("border-bottom-width") }}, {{ cssxref("border-left-width") }}, {{ cssxref("margin") }}, {{ cssxref("margin-top") }}, {{ cssxref("margin-right") }}, {{ cssxref("margin-bottom") }}, {{ cssxref("margin-left") }}</li>
-</ul>
diff --git a/files/es/web/css/css_modelo_caja/mastering_margin_collapsing/index.html b/files/es/web/css/css_modelo_caja/mastering_margin_collapsing/index.html
deleted file mode 100644
index dafdf71855..0000000000
--- a/files/es/web/css/css_modelo_caja/mastering_margin_collapsing/index.html
+++ /dev/null
@@ -1,96 +0,0 @@
----
-title: Entendiendo el colapso de margen
-slug: Web/CSS/CSS_Modelo_Caja/Mastering_margin_collapsing
-tags:
-  - CSS
-  - CSS Box Model
-  - Guía
-  - Referencia
-translation_of: Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
----
-<div>{{CSSRef}}</div>
-
-<p>Los márgenes <a href="/es/docs/Web/CSS/margin-top">Top</a> y <a href="/es/docs/Web/CSS/margin-bottom">bottom</a> de los bloques a veces están combinados (colapsados) en un solo margen cuyo tamaño es el mayor de los márgenes combinados, un comportamiento conocido como <strong>colapso de margen</strong>. Ten en cuenta que los márgenes de <a href="/es/docs/Web/CSS/float">flotantes</a> y elementos con <a href="/es/docs/Web/CSS/position"> posición absoluta</a> nunca colapsan.</p><p></p>
-
-<p>El colapso de margen ocurre en tres casos básicos:</p>
-
-<dl>
- <dt>Hermanos adjacentes</dt>
- <dd>Los márgenes de los hermanos adjacentes son colapsados (excepto cuando el último hermano necesita ser <a href="/es/docs/Web/CSS/clear">limpiado</a> después de usar los flotantes).</dd>
- <dt>Padre y primer/último hijo</dt>
- <dd>Si no hay un borde, padding, contenido en línea, <a href="/es/docs/Web/Guide/CSS/Block_formatting_context">block formatting context</a> creado, o un <em><a href="/es/docs/Web/CSS/clear">limpiado</a></em> para separar el {{cssxref("margin-top")}} de un bloque del {{cssxref("margin-top")}} de su primer bloque hijo; o no hay borde, padding, contenido en línea, {{cssxref("height")}}, {{cssxref("min-height")}}, o {{cssxref("max-height")}} para separar el {{cssxref("margin-bottom")}} de un bloque del {{cssxref("margin-bottom")}} de su último hijo, entonces esos márgenes colapsan. El margen colapsado termina fuera del padre.</dd>
- <dt>Bloques vacíos</dt>
- <dd>Si no hay borde, padding, contenido en línea, {{cssxref("height")}}, o {{cssxref("min-height")}} para separar el {{cssxref("margin-top")}} de un bloque de su {{cssxref("margin-bottom")}}, entonces sus márgenes superiores e inferiores colapsan.</dd>
-</dl>
- <p>Cosas a tener en cuenta:</p>
-
-
-<ul>
- <li>Cuando estos casos están combinados ocurrirá un colapso de márgenes más complejo (de más de dos márgenes).</li>
- <li>Estas reglas se aplican incluso a márgenes con valor cero, así que el margen del primer/último hijo siempre termina fuera de su padre (de acuerdo a las reglas de arriba) independientemente de que el margen del padre sea o no sea cero.</li>
- <li>Cuando se trata de márgenes negativos, el tamaño del margen colapsado es la suma del margen positivo más grande y el margen negativo más pequeño (el más negativo).</li>
- <li>Cuando todos los márgenes son negativos, el tamaño del margen colapsado es el margen más pequeño (el más negativo). Esto se aplica tanto a los elementos adyacentes como a los elementos anidados.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;p&gt;El margen inferior de este párrafo está colapsado ....&lt;/p&gt;
-&lt;p&gt;... con el margen superior de este párrafo, lo que deja un margen de&lt;code&gt;1.2rem&lt;/code&gt; entre ellos.&lt;/p&gt;
-
-&lt;div&gt;Este elemento padre contiene dos párrafos!
-  &lt;p&gt;Este párrafo tiene un margen de &lt;code&gt;.4rem&lt;/code&gt;  entre él y el texto anterior.&lt;/p&gt;
-  &lt;p&gt;Mi margen inferior se colapsa con mi padre, produciendo un margen inferior de &lt;code&gt;2rem&lt;/code&gt;.&lt;/p&gt;
-&lt;/div&gt;
-
-&lt;p&gt;Estoy &lt;code&gt;2rem&lt;/code&gt; por debajo del elemento de arriba.&lt;/p&gt;</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">div {
-  margin: 2rem 0;
-  background: lavender;
-}
-
-p {
-  margin: .4rem 0 1.2rem 0;
-  background: yellow;
-}</pre>
-
-<h3 id="Result">Result</h3>
-
-<p>{{EmbedLiveSample('Ejemplos', 'auto', 350)}}</p>
-
-
-
-<p> </p>
-
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName("CSS2.1", "box.html#collapsing-margins", "margin collapsing")}}</td>
-   <td>{{Spec2("CSS2.1")}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="También_puedes_ver">También puedes ver</h2>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/Referencia_CSS">CSS Reference</a></li>
-</ul>
-<ul>
- <li>{{css_key_concepts}}</li>
-</ul>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/agregando_z-index/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/agregando_z-index/index.html
deleted file mode 100644
index 0278b3254f..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/agregando_z-index/index.html
+++ /dev/null
@@ -1,179 +0,0 @@
----
-title: Agregando z-index
-slug: Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Adding_z-index
----
-<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
-
-<h3 id="Agregando_cssxref(z-index)">Agregando {{ cssxref("z-index") }}</h3>
-
-<p>El primer ejemplo, <a href="https://developer.mozilla.org/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a>, explica cómo es organizado el apilamiento por defecto. Si quieres especificar un orden diferente de apilamiento, debes posicionar un elemento y usar la propiedad z-index.</p>
-
-<p>Esta propiedad es asignada con un valor entero (positivo o negativo), el cuál representa la posición del elemento en el eje-Z. Si no estás familiarizado con el eje-Z, imagina que la página tiene muchas capas una encima de la otra. Cada capa es numerada. Una capa con un número mayor es renderizada encima de las capas con números menores.</p>
-
-<div class="warning">
-<p><strong>Precaución:</strong> z-index solo tiene efecto si un elemento es <a href="/es/CSS/position" title="position">posicionado</a>.</p>
-</div>
-
-<ul>
- <li><em>bottom: el más lejano al observador</em></li>
- <li>...</li>
- <li>Capa -3</li>
- <li>Capa -2</li>
- <li>Capa -1</li>
- <li>Capa 0<em>capa de renderizado por defecto</em></li>
- <li>Capa 1</li>
- <li>Capa 2</li>
- <li>Capa 3</li>
- <li>...</li>
- <li><em>top: el más cercano al observador</em></li>
-</ul>
-
-<div class="note">
-<p><strong>Notas:</strong></p>
-
-<ul>
- <li>Cuando la propiedad z-index no ha sido especificada, los elementos son renderizados en la capa de renderizado por defecto 0 (cero).</li>
- <li>Si varios elementos comparten el mismo valor z-index (<em>i.e.</em> están situados en la misma capa), las reglas de apilamiento explicadas en la sección <a href="https://developer.mozilla.org/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> son aplicadas.</li>
-</ul>
-</div>
-
-<p>En el siguiente ejempo, el orden de apilamiento de las capas es organizado usando z-index. El z-index del DIV#5 no hace efecto ya que este no es un elemento posicionado.</p>
-
-<p>{{ EmbedLiveSample('Example_source_code', '468', '365', '', 'Web/Guide/CSS/Understanding_z_index/Adding_z-index') }}</p>
-
-<h3 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h3>
-
-<pre class="brush: html">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-    &lt;meta charset="UTF-8"&gt;
-    &lt;title&gt;Adding z-index&lt;/title&gt;
-    &lt;style type="text/css"&gt;
-
-    div {
-        opacity: 0.7;
-        font: 12px Arial;
-    }
-
-    span.bold { font-weight: bold; }
-
-    #normdiv {
-        z-index: 8;
-        height: 70px;
-        border: 1px dashed #999966;
-        background-color: #ffffcc;
-        margin: 0px 50px 0px 50px;
-        text-align: center;
-    }
-
-    #reldiv1 {
-        z-index: 3;
-        height: 100px;
-        position: relative;
-        top: 30px;
-        border: 1px dashed #669966;
-        background-color: #ccffcc;
-        margin: 0px 50px 0px 50px;
-        text-align: center;
-    }
-
-    #reldiv2 {
-        z-index: 2;
-        height: 100px;
-        position: relative;
-        top: 15px;
-        left: 20px;
-        border: 1px dashed #669966;
-        background-color: #ccffcc;
-        margin: 0px 50px 0px 50px;
-        text-align: center;
-    }
-
-    #absdiv1 {
-        z-index: 5;
-        position: absolute;
-        width: 150px;
-        height: 350px;
-        top: 10px;
-        left: 10px;
-        border: 1px dashed #990000;
-        background-color: #ffdddd;
-        text-align: center;
-    }
-
-    #absdiv2 {
-        z-index: 1;
-        position: absolute;
-        width: 150px;
-        height: 350px;
-        top: 10px;
-        right: 10px;
-        border: 1px dashed #990000;
-        background-color: #ffdddd;
-        text-align: center;
-    }
-
-    &lt;/style&gt;
-&lt;/head&gt;
-
-&lt;body&gt;
-
-    &lt;br /&gt;&lt;br /&gt;
-
-    &lt;div id="absdiv1"&gt;
-        &lt;br /&gt;&lt;span class="bold"&gt;DIV #1&lt;/span&gt;
-        &lt;br /&gt;position: absolute;
-        &lt;br /&gt;z-index: 5;
-    &lt;/div&gt;
-
-    &lt;div id="reldiv1"&gt;
-        &lt;br /&gt;&lt;span class="bold"&gt;DIV #2&lt;/span&gt;
-        &lt;br /&gt;position: relative;
-        &lt;br /&gt;z-index: 3;
-    &lt;/div&gt;
-
-    &lt;div id="reldiv2"&gt;
-        &lt;br /&gt;&lt;span class="bold"&gt;DIV #3&lt;/span&gt;
-        &lt;br /&gt;position: relative;
-        &lt;br /&gt;z-index: 2;
-    &lt;/div&gt;
-
-    &lt;div id="absdiv2"&gt;
-        &lt;br /&gt;&lt;span class="bold"&gt;DIV #4&lt;/span&gt;
-        &lt;br /&gt;position: absolute;
-        &lt;br /&gt;z-index: 1;
-    &lt;/div&gt;
-
-    &lt;div id="normdiv"&gt;
-        &lt;br /&gt;&lt;span class="bold"&gt;DIV #5&lt;/span&gt;
-        &lt;br /&gt;no positioning
-        &lt;br /&gt;z-index: 8;
-    &lt;/div&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="También_puedes_ver">También puedes ver</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Last Updated Date: November 3rd, 2014</li>
-</ul>
-</div>
-
-<p>{{ languages( { "fr": "fr/CSS/Comprendre_z-index/Ajout_de_z-index" } ) }}</p>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/apilamiento_y_float/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/apilamiento_y_float/index.html
deleted file mode 100644
index 81b145e1a3..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/apilamiento_y_float/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Apilamiento y float
-slug: Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float
-tags:
-  - Avanzado
-  - CSS
-  - Entendiendo_CSS_z-index
-  - Guía
-  - Referencia
-  - z-index
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_and_float
----
-<div>{{cssref}}</div>
-
-<h3 id="Apilamiento_y_float">Apilamiento y float</h3>
-
-<p>Para los bloques flotantes el orden de apilamiento es un poco diferente. Los bloques flotantes son colocados entre bloques no posicionados y bloques posicionados:</p>
-
-<ol>
- <li>Fondo y bordes del elemento raiz</li>
- <li>Bloques descendientes en el flujo normal, en orden de aparición (en HTML)</li>
- <li>Bloques flotantes</li>
- <li>Elementos posicionados descendentemente , en orden de aparición (en HTML)</li>
-</ol>
-
-<p>En realidad, como puedes ver en el siguiente ejemplo, el fondo y el borde del bloque no posicionado (DIV #4) no son afectados por los bloques flotantes, mientras que el contenido si es afectado. Esto ocurre de acuerdo al comportamiento flotante stándar de CSS.</p>
-
-<p>Este comportamiento puede ser explicado con una versión mejorada de la lista previa:</p>
-
-<ol>
- <li>Fondo y bordes del elemento raiz</li>
- <li>Bloques descendientes en el flujo normal, en orden de aparición (en HTML)</li>
- <li>Bloques flotantes</li>
- <li>Descendientes en línea en el flujo normal</li>
- <li>Elementos posicionados descendentemente , en orden de aparición (en HTML)</li>
-</ol>
-
-<div class="note"><strong>Nota:</strong> En el ejemplo debajo, todos los bloques excepto el no posicionado son translúcidos para mostrar el orden de apilamiento. Si la opacidad del bloque no posicionado (DIV #4) es reducida, entonces algo extraño ocurre: el fondo y el borde de ese bloque sobresale por encima de los bloques flotantes, pero aun debajo de los bloques posicionados. Yo no pude entender si esto es un bug o una interpretación peculiar de la especificación. (Aplicar opacidad debería crear implícitamente un contexto de apilamiento.)</div>
-
-<p>{{ EmbedLiveSample('Example_source_code', '563', '255', '', 'Web/Guide/CSS/Understanding_z_index/Stacking_and_float') }}</p>
-
-<h2 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;div id="abs1"&gt;
-  &lt;b&gt;DIV #1&lt;/b&gt;&lt;br /&gt;position: absolute;&lt;/div&gt;
-
-&lt;div id="flo1"&gt;
-  &lt;b&gt;DIV #2&lt;/b&gt;&lt;br /&gt;float: left;&lt;/div&gt;
-
-&lt;div id="flo2"&gt;
-  &lt;b&gt;DIV #3&lt;/b&gt;&lt;br /&gt;float: right;&lt;/div&gt;
-
-&lt;br /&gt;
-
-&lt;div id="sta1"&gt;
-  &lt;b&gt;DIV #4&lt;/b&gt;&lt;br /&gt;no positioning&lt;/div&gt;
-
-&lt;div id="abs2"&gt;
-  &lt;b&gt;DIV #5&lt;/b&gt;&lt;br /&gt;position: absolute;&lt;/div&gt;
-</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">div {
-  padding: 10px;
-  text-align: center;
-}
-
-b {
-  font-family: sans-serif;
-}
-
-#abs1 {
-  position: absolute;
-  width: 150px;
-  height: 200px;
-  top: 10px;
-  right: 140px;
-  border: 1px dashed #900;
-  background-color: #fdd;
-}
-
-#sta1 {
-  height: 100px;
-  border: 1px dashed #996;
-  background-color: #ffc;
-  margin: 0px 10px 0px 10px;
-  text-align: left;
-}
-
-#flo1 {
-  margin: 0px 10px 0px 20px;
-  float: left;
-  width: 150px;
-  height: 200px;
-  border: 1px dashed #090;
-  background-color: #cfc;
-}
-
-#flo2 {
-  margin: 0px 20px 0px 10px;
-  float: right;
-  width: 150px;
-  height: 200px;
-  border: 1px dashed #090;
-  background-color: #cfc;
-}
-
-#abs2 {
-  position: absolute;
-  width: 150px;
-  height: 100px;
-  top: 130px;
-  left: 100px;
-  border: 1px dashed #990;
-  background-color: #fdd;
-}</pre>
-
-<h3 id="También_puedes_ver">También puedes ver</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
- <li>
-  <p><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</p>
- </li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Last Updated Date: November 3rd, 2014</li>
-</ul>
-</div>
-
-<p> </p>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento/index.html
deleted file mode 100644
index def9c5ea8e..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: Ejemplo 1 del contexto de apilamiento
-slug: >-
-  Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1
----
-<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
-
-<h3 id="Ejemplo_1_del_contexto_de_apilamiento">Ejemplo 1 del contexto de apilamiento</h3>
-
-<p>Empecemos con un ejemplo básico. En el contexto de apilamiento raíz tenemos dos DIVs (DIV #1 and DIV #3), ambos con posición relativa, pero sin propiedad z-index. Dentro del DIV #1 se encuentra el DIV #2 de posición absoluta, mientras que en el DIV #3 se encuentra el DIV #4 con posición absoluta, ambos sin propiedad z-index.</p>
-
-<p>El único contexto de apilamiento es el contexto raíz. Sin la propiedad z-index, los elementos son apilados por orden de ocurrencia.</p>
-
-<p><img alt="Stacking context example 1" class="internal" src="/@api/deki/files/914/=Understanding_zindex_05a.png"></p>
-
-<p>Si a DIV #2 le asignamos un valor z-index positivo (no-cero y no-auto), es renderizado encima de todos los otros DIVs.</p>
-
-<p><img alt="Stacking context example 1" class="internal" src="/@api/deki/files/915/=Understanding_zindex_05b.png"></p>
-
-<p>Luego si al DIV #4 también se le asigna un z-index positivo mayor que el z-index del DIV #2, es renderizado encima de los otros DIVs incluyendo DIV #2.</p>
-
-<p><img alt="Stacking context example 1" class="internal" src="/@api/deki/files/916/=Understanding_zindex_05c.png"></p>
-
-<p>En este último ejemplo puedes ver que el DIV #2 y el DIV #4 no son hermanos, porque pertenecen a padres distintos en la jerarquía de elementos HTML. A pesar de esto, el apilamiento del DIV #4 con respecto al DIV #2 puede ser controlado a través de z-index. Pasa que, dado a que al DIV #1 y al DIV #3 no se le ha asignado ningún valor z-index, ellos no han creado un contexto de apilamiento. Esto significa que todos sus contenidos, incluyendo el DIV #2 y el DIV #4, pertenecen al mismo contexto de apilamiento raíz.</p>
-
-<p>En términos de contextos de apilamiento, el DIV #1 y el DIV #3 son simplemente asimilados dentro del elemento raíz, y la jerarquía resultante es la siguiente:</p>
-
-<ul>
- <li>contexto de apilamiento raíz
-  <ul>
-   <li>DIV #2 (z-index 1)</li>
-   <li>DIV #4 (z-index 2)</li>
-  </ul>
- </li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> El DIV #1 y el DIV #3 no son translúcidos. Es importante recordar que asignar una opacidad menor a 1 a un elemento posicionado implica la creación de un contexto de apilamiento, como ocurre cuando se añade un valor z-index. Y este ejemplo muestra que ocurre cuando un elemento padre no crea un contexto de apilamiento.</div>
-
-<h2 id="Ejemplo"><strong>Ejemplo</strong></h2>
-
-<h3 id="HTML"><strong>HTML</strong></h3>
-
-<pre class="brush: html">&lt;div id="div1"&gt;
-&lt;br /&gt;&lt;span class="bold"&gt;DIV #1&lt;/span&gt;
-&lt;br /&gt;position: relative;
-   &lt;div id="div2"&gt;
-   &lt;br /&gt;&lt;span class="bold"&gt;DIV #2&lt;/span&gt;
-   &lt;br /&gt;position: absolute;
-   &lt;br /&gt;z-index: 1;
-   &lt;/div&gt;
-&lt;/div&gt;
-
-&lt;br /&gt;
-
-&lt;div id="div3"&gt;
-&lt;br /&gt;&lt;span class="bold"&gt;DIV #3&lt;/span&gt;
-&lt;br /&gt;position: relative;
-   &lt;div id="div4"&gt;
-   &lt;br /&gt;&lt;span class="bold"&gt;DIV #4&lt;/span&gt;
-   &lt;br /&gt;position: absolute;
-   &lt;br /&gt;z-index: 2;
-   &lt;/div&gt;
-&lt;/div&gt;
-
-&lt;/body&gt;&lt;/html&gt;
-</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">.bold {
-    font-weight: bold;
-    font: 12px Arial;
-}
-#div1,
-#div3 {
-    height: 80px;
-    position: relative;
-    border: 1px dashed #669966;
-    background-color: #ccffcc;
-    padding-left: 5px;
-}
-#div2 {
-    opacity: 0.8;
-    z-index: 1;
-    position: absolute;
-    width: 150px;
-    height: 200px;
-    top: 20px;
-    left: 170px;
-    border: 1px dashed #990000;
-    background-color: #ffdddd;
-    text-align: center;
-}
-#div4 {
-    opacity: 0.8;
-    z-index: 2;
-    position: absolute;
-    width: 200px;
-    height: 70px;
-    top: 65px;
-    left: 50px;
-    border: 1px dashed #000099;
-    background-color: #ddddff;
-    text-align: left;
-    padding-left: 10px;
-}</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Example', '', '', '', 'Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1') }}</p>
-
-<h3 id="También_puedes_ver">También puedes ver</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel<span id="cke_bm_89E" style="display: none;"> </span></li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Last Updated Date: July 9th, 2005</li>
-</ul>
-</div>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento/index.html
deleted file mode 100644
index 2955b43b7f..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento/index.html
+++ /dev/null
@@ -1,137 +0,0 @@
----
-title: Ejemplo 2 del contexto de apilamiento
-slug: >-
-  Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_2
----
-<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
-
-<h3 id="Ejemplo_2_del_contexto_de_apilamiento">Ejemplo 2 del contexto de apilamiento</h3>
-
-<p>Este es un ejemplo muy simple, pero es la clave para entender el concepto de <em>contexto de apilamiento. </em>Tenemos los mismos 4 DIVs del ejemplo previo, pero ahora las propiedades z-index son asignadas en ambos niveles de la jerarquía.</p>
-
-<p>{{ EmbedLiveSample('Example_source_code', '352', '270', '', 'Web/Guide/CSS/Understanding_z_index/Stacking_context_example_2') }}</p>
-
-<p>Puedes ver que el DIV #2 (z-index: 2) está encima del DIV #3 (z-index: 1), porque ambos pertenecen al mismo contexto de apilamiento (el contexto raíz), así que los valores z-index indican cómo son apilados los elementos.</p>
-
-<p>Lo que puede ser considerado extraño es que el DIV #2 (z-index: 2) está encima del DIV #4 (z-index: 10), a pesar de sus valores z-index. La razón es que ellos no pertenecen al mismo contexto de apilamiento. El DIV #4 pertenece al contexto de apilamiento creado por el DIV #3, y como explicamos previamente el DIV #3 (y todos su contenido) está debajo del DIV #2.</p>
-
-<p>Para entender mejor esta situación, esta es la jerarquía del contexto de apilamiento:</p>
-
-<ul>
- <li>contexto de apilamiento raíz
-  <ul>
-   <li>DIV #2 (z-index 2)</li>
-   <li>DIV #3 (z-index 1)
-    <ul>
-     <li>DIV #4 (z-index 10)</li>
-    </ul>
-   </li>
-  </ul>
- </li>
-</ul>
-
-<div class="note"><strong>Nota:</strong>  Vale la pena recordar que en general la jerarquía HTML es diferente de la jerarquía del contexto de apilamiento. En la jerarquía del contexto de apilamiento, los elementos que no crean un contexto de apilamiento son colapsados en sus padres.</div>
-
-<h3 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h3>
-
-<pre class="brush: html">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
-&lt;html&gt;
-&lt;head&gt;&lt;style type="text/css"&gt;
-
-div { font: 12px Arial; }
-
-span.bold { font-weight: bold; }
-
-#div2 { z-index: 2; }
-#div3 { z-index: 1; }
-#div4 { z-index: 10; }
-
-#div1,#div3 {
-   height: 80px;
-   position: relative;
-   border: 1px dashed #669966;
-   background-color: #ccffcc;
-   padding-left: 5px;
-}
-
-#div2 {
-   opacity: 0.8;
-   position: absolute;
-   width: 150px;
-   height: 200px;
-   top: 20px;
-   left: 170px;
-   border: 1px dashed #990000;
-   background-color: #ffdddd;
-   text-align: center;
-}
-
-#div4 {
-   opacity: 0.8;
-   position: absolute;
-   width: 200px;
-   height: 70px;
-   top: 65px;
-   left: 50px;
-   border: 1px dashed #000099;
-   background-color: #ddddff;
-   text-align: left;
-   padding-left: 10px;
-}
-
-
-&lt;/style&gt;&lt;/head&gt;
-
-&lt;body&gt;
-
-    &lt;br /&gt;
-
-    &lt;div id="div1"&gt;&lt;br /&gt;
-        &lt;span class="bold"&gt;DIV #1&lt;/span&gt;&lt;br /&gt;
-        position: relative;
-        &lt;div id="div2"&gt;&lt;br /&gt;
-            &lt;span class="bold"&gt;DIV #2&lt;/span&gt;&lt;br /&gt;
-            position: absolute;&lt;br /&gt;
-            z-index: 2;
-        &lt;/div&gt;
-    &lt;/div&gt;
-
-    &lt;br /&gt;
-
-    &lt;div id="div3"&gt;&lt;br /&gt;
-        &lt;span class="bold"&gt;DIV #3&lt;/span&gt;&lt;br /&gt;
-        position: relative;&lt;br /&gt;
-        z-index: 1;
-        &lt;div id="div4"&gt;&lt;br /&gt;
-            &lt;span class="bold"&gt;DIV #4&lt;/span&gt;&lt;br /&gt;
-            position: absolute;&lt;br /&gt;
-            z-index: 10;
-        &lt;/div&gt;
-    &lt;/div&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="También_puedes_ver">También puedes ver</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Last Updated Date: July 9th, 2005</li>
-</ul>
-</div>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento/index.html
deleted file mode 100644
index c41d8b56ad..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento/index.html
+++ /dev/null
@@ -1,183 +0,0 @@
----
-title: Ejemplo 3 del contexto de apilamiento
-slug: >-
-  Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_3
----
-<p>« <a href="/en/CSS" title="CSS">CSS</a> « <a href="/en/CSS/Understanding_z-index" title="Understanding CSS z-index">Understanding CSS z-index</a></p>
-
-<h3 id="Ejemplo_3_del_contexto_de_apilamiento">Ejemplo 3 del contexto de apilamiento</h3>
-
-<p>Este último ejemplo muestra los problemas que surgen cuando se combinan varios elementos posicionados en una jerarquía HTML multi nivel y cuando los valores z-index son asignados usando selectores de clase.</p>
-
-<p>Tomemos como ejemplo un menú jerárquico de tres niveles formado por varios DIVs posicionados. DIVs de segundo y tercer nivel aparecen cuando se pone el cursor encima o se hace clic en sus padres. Usualmente este tipo de menú es generado mediante un script del lado del cliente o del lado del servidor, así que las reglas de estilos son asignadas con un selector de clase en lugar de un selector de id.</p>
-
-<p>Si los tres niveles del menú se superponen parcialmente, entonces gestionar el apilamiento se podría convertir en un problema.</p>
-
-<p>{{ EmbedLiveSample('Example_source_code', '320', '330', '', 'Web/Guide/CSS/Understanding_z_index/Stacking_context_example_3') }}</p>
-
-<p>El menú de primer nivel solo tiene posición relativa, así que ningún contexto de apilamiento es creado.</p>
-
-<p>El menú de segundo nivel tiene posición absoluta dentro del elemento padre. Para colocarlo encima de todos los menus de primer nivel, usamos z-index. El problema es que para cada menú de segundo nivel, un contexto de apilamiento es creado y cada menú de tercer nivel pertenece al contexto de su padre.</p>
-
-<p>De manera que un menú de tercer nivel va a ser apilado bajo los menus de segundo nivel porque todos los menus de segundo nivel comparten el mismo valor z-index y las reglas de apilamiento por defecto son aplicadas.</p>
-
-<p>Para entender mejor la situación, esta es la jerarquía del contexto de apilamiento:</p>
-
-<ul>
- <li>contexto de apilamiento raíz
-  <ul>
-   <li>NIVEL #1
-    <ul>
-     <li>NIVEL #2 (z-index: 1)
-      <ul>
-       <li>NIVEL #3</li>
-       <li>...</li>
-       <li>NIVEL #3</li>
-      </ul>
-     </li>
-     <li>NIVEL #2 (z-index: 1)</li>
-     <li>...</li>
-     <li>NIVEL #2 (z-index: 1)</li>
-    </ul>
-   </li>
-   <li>NIVEL #1</li>
-   <li>...</li>
-   <li>NIVEL #1</li>
-  </ul>
- </li>
-</ul>
-
-<p>Este problema puede ser evitado al remover la superposición entre menus de diferentes niveles, o usando valores z-index individuales (y diferentes) asignados a través del selector id en lugar de un selector de clase, o aplanando la jerarquía HTML.</p>
-
-<div class="note"><strong>Nota:</strong> En el código fuente vas a ver que los menus de segundo y tercer nivel están hechos de varios DIVs contenidos en un contenedor con posición absoluta. Esto es útil para agrupar y posicionarlos todos a la vez.</div>
-
-<h3 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h3>
-
-<pre class="brush: html">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
-&lt;html&gt;
-&lt;head&gt;&lt;style type="text/css"&gt;
-
-div { font: 12px Arial; }
-
-span.bold { font-weight: bold; }
-
-div.lev1 {
-   width: 250px;
-   height: 70px;
-   position: relative;
-   border: 2px outset #669966;
-   background-color: #ccffcc;
-   padding-left: 5px;
-}
-
-#container1 {
-   z-index: 1;
-   position: absolute;
-   top: 30px;
-   left: 75px;
-}
-
-div.lev2 {
-   opacity: 0.9;
-   width: 200px;
-   height: 60px;
-   position: relative;
-   border: 2px outset #990000;
-   background-color: #ffdddd;
-   padding-left: 5px;
-}
-
-#container2 {
-   z-index: 1;
-   position: absolute;
-   top: 20px;
-   left: 110px;
-}
-
-div.lev3 {
-   z-index: 10;
-   width: 100px;
-   position: relative;
-   border: 2px outset #000099;
-   background-color: #ddddff;
-   padding-left: 5px;
-}
-
-&lt;/style&gt;&lt;/head&gt;
-
-&lt;body&gt;
-
-&lt;br /&gt;
-
-&lt;div class="lev1"&gt;
-&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
-
-   &lt;div id="container1"&gt;
-
-      &lt;div class="lev2"&gt;
-      &lt;br /&gt;&lt;span class="bold"&gt;LEVEL #2&lt;/span&gt;
-      &lt;br /&gt;z-index: 1;
-
-         &lt;div id="container2"&gt;
-
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
-
-         &lt;/div&gt;
-
-      &lt;/div&gt;
-
-      &lt;div class="lev2"&gt;
-      &lt;br /&gt;&lt;span class="bold"&gt;LEVEL #2&lt;/span&gt;
-      &lt;br /&gt;z-index: 1;
-      &lt;/div&gt;
-
-   &lt;/div&gt;
-&lt;/div&gt;
-
-&lt;div class="lev1"&gt;
-&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
-&lt;/div&gt;
-
-&lt;div class="lev1"&gt;
-&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
-&lt;/div&gt;
-
-&lt;div class="lev1"&gt;
-&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
-&lt;/div&gt;
-
-&lt;/body&gt;&lt;/html&gt;
-</pre>
-
-<h3 id="También_puedes_ver">También puedes ver</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Last Updated Date: July 9th, 2005</li>
-</ul>
-</div>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/el_contexto_de_apilamiento/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/el_contexto_de_apilamiento/index.html
deleted file mode 100644
index 1daf172048..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/el_contexto_de_apilamiento/index.html
+++ /dev/null
@@ -1,231 +0,0 @@
----
-title: El contexto de apilamiento
-slug: Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
----
-<p>El contexto de apilamiento es la conceptualización tridimensional de los elementos HTML a lo largo de un eje-Z imaginario relativo al usuario que se asume está de cara al viewport o página web. Los elementos HTML ocupan este espacio por orden de prioridad basado en sus atributos.</p>
-
-<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
-
-<h2 id="El_contexto_de_apilamiento">El contexto de apilamiento</h2>
-
-<p> </p>
-
-<p>En el ejemplo previo, <a href="https://developer.mozilla.org/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a>, el orden de renderizado de ciertos DIVs es influenciado por sus valores z-index. Esto ocurre debido a que estos DIVs tienen propiedades especiales que causan que formen un contexto de apilamiento.</p>
-
-<p>Un contexto de apilamiento es formado, en cualquier lugar del documento, por cualquier elemento que</p>
-
-<ul>
- <li>sea el elemento raiz (HTML),</li>
- <li>tenga posición (absoluta o relativa) con un valor z-index distinto de "auto",</li>
- <li>un elemento flex con un valor z-index distinto de "auto", que sea el elemento padre display: flex|inline-flex,</li>
- <li>sean elementos con un valor {{cssxref("opacity")}} menor de 1. (Mira <a href="http://www.w3.org/TR/css3-color/#transparency" title="http://www.w3.org/TR/css3-color/#transparency">la especificación de opacity</a>),</li>
- <li>elementos con un valor  {{cssxref("transform")}} distinto de "none",</li>
- <li>elementos con un valor {{cssxref("mix-blend-mode")}} distinto de "normal",</li>
- <li>elementos con un valor {{cssxref("filter")}} distinto de "none",</li>
- <li>elementos con un valor {{cssxref("perspective")}} distinto de "none",</li>
- <li>elementos con un valor {{cssxref("isolation")}} igual a "isolate",</li>
- <li><code>position: fixed</code></li>
- <li>especifican cualquier atributo superior en <code>{{cssxref("will-change")}} incluso si no especificas valores para estos atributos directamente </code>(Mira <a href="http://dev.opera.com/articles/css-will-change-property/">este post</a>)</li>
- <li>elementos con un valor {{cssxref("-webkit-overflow-scrolling")}} igual a "touch"</li>
-</ul>
-
-<p>Dentro de un contexto de apilamiento, los elementos hijos son apilados de acuerdo a las mismas reglas previamente explicadas. Es importante entender que los valores z-index de los contextos de apilamiento de los hijos solo tienen sentido en el contexto del padre. Los contextos de apilamiento son tratados atómicamente como una sola unidad en el contexto de apilamiento del padre.</p>
-
-<p>En resumen:</p>
-
-<ul>
- <li>Posicionar y asignar un valor z-index a un elemento HTML crea un contexto de apilamiento, (asi como también lo hace asignar una opacidad parcial)</li>
- <li>Contextos de apilamiento pueden ser contenidos en otros contextos de apilamiento, y juntos crean una jerarquía de contextos de apilamiento</li>
- <li>Cada contexto de apilamiento es completamente independiente de sus hermanos: solo los elementos descendientes son considerados cuando el apilamiento es procesado.</li>
- <li>Cada contexto de apilamiento es auto contenido: luego que los contenidos del elemento son apilados, el elemento completo es considerado en el orden de apilamiento del contexto del padre.</li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> La jerarquía de apilar contextos es un sub conjunto de la jerarquía de elementos HTML, porque solo ciertos elementos crean contextos de apilamiento. Podemos decir que los elementos que no crean sus propios contextos de apilamiento son asimilados por el contexto de apilamiento padre.</div>
-
-<h2 id="El_ejemplo"><strong>El ejemplo</strong></h2>
-
-<p><img alt="Example of stacking rules modified using z-index" src="/@api/deki/files/913/=Understanding_zindex_04.png"></p>
-
-<p>En este ejemplo cada elemento posicionado crea su propio contexto de apilamiento, debido a sus valores de posicionamiento y z-index. La jerarquía de contextos de apilamiento es organizada de la siguiente manera:</p>
-
-<ul>
- <li>Raíz
-  <ul>
-   <li>DIV #1</li>
-   <li>DIV #2</li>
-   <li>DIV #3
-    <ul>
-     <li>DIV #4</li>
-     <li>DIV #5</li>
-     <li>DIV #6</li>
-    </ul>
-   </li>
-  </ul>
- </li>
-</ul>
-
-<p>Es importante notar que el DIV #4, DIV #5 y el DIV #6 son hijos del DIV #3, así que el apilamiento de esos elementos es completamente resuelto dentro del DIV#3. Una vez que el apilamiento y el renderizado dentro del DIV#3 ha sido completado, todo el elemento DIV#3 es apilado en el elemento raíz con respecto a sus DIV hermanos.</p>
-
-<div class="note">
-<p><strong>Notas:</strong></p>
-
-<ul>
- <li>DIV #4 es renderizado debajo de DIV #1 porque el z-index (5) de DIV #1 es válido dentro del contexto de apilamiento del elemento raiz, mientras que el z-index (6) de DIV #4 es válido dentro del contexto de apilamiento de DIV #3. Así que DIV #4 está debajo de DIV #1, porque DIV #4 pertenece a DIV #3, que tiene un valor z-index menor.</li>
- <li>Por la misma razón DIV #2 (z-index 2) es renderizado bajo DIV#5 (z-index 1) porque DIV #5 pertenece a DIV #3, que tiene un valor z-index mayor.</li>
- <li>El valor z-index de DIV #3 es 4, pero este valor es independiente del z-index de DIV #4, DIV #5 and DIV #6, porque pertenece a un contexto de apilamiento diferente.</li>
- <li>Una forma fácil de descubrir el <em>orden de renderizado</em> de los elementos apilados en el eje Z es pensar en esto como un tipo de "número de versión", donde los elementos hijos son números de versión menores bajo los números de versión mayores de sus padres. De esta manera podemos ver fácilmente cómo un elemento con un valor z-index de 1 (DIV #5) es apilado encima de un elemento con un valor z-index de 2 (DIV #2), y cómo un elemento con un valor z-index de 6 (DIV #4) es apilado debajo de un elemento con un valor z-index de 5 (DIV #1). En nuestro ejemplo (ordenado de acuerdo al orden de renderizado final):
-  <ul>
-   <li>Raíz
-    <ul>
-     <li>El valor z-index de DIV #2 es 2</li>
-     <li>El valor z-index de DIV #3 es 4
-      <ul>
-       <li>El valor z-index de DIV #5 es 1, apilado bajo un elemento con un valor z-index de 4, que resulta en un orden de renderizado de 4.1</li>
-       <li>El valor z-index de DIV #6 es 3, apilado debajo de un elemento con un valor z-index de 4, que resulta en un orden de renderizado de 4.3</li>
-       <li>El valor z-index de DIV #4 es 6, apilado bajo un elemento con valor z-index de 4, que resulta en un orden de renderizado de 4.6</li>
-      </ul>
-     </li>
-     <li>El valor z-index de DIV #1 es 5</li>
-    </ul>
-   </li>
-  </ul>
- </li>
-</ul>
-</div>
-
-<h2 id="Ejemplo"><strong>Ejemplo</strong></h2>
-
-<h3 id="HTML"><strong>HTML</strong></h3>
-
-<pre class="brush: html">    &lt;div id="div1"&gt;
-      &lt;h1&gt;Division Element #1&lt;/h1&gt;
-      &lt;code&gt;position: relative;&lt;br/&gt;
-      z-index: 5;&lt;/code&gt;
-    &lt;/div&gt;
-
-    &lt;div id="div2"&gt;
-      &lt;h1&gt;Division Element #2&lt;/h1&gt;
-      &lt;code&gt;position: relative;&lt;br/&gt;
-      z-index: 2;&lt;/code&gt;
-    &lt;/div&gt;
-
-    &lt;div id="div3"&gt;
-
-      &lt;div id="div4"&gt;
-        &lt;h1&gt;Division Element #4&lt;/h1&gt;
-        &lt;code&gt;position: relative;&lt;br/&gt;
-        z-index: 6;&lt;/code&gt;
-      &lt;/div&gt;
-
-      &lt;h1&gt;Division Element #3&lt;/h1&gt;
-      &lt;code&gt;position: absolute;&lt;br/&gt;
-      z-index: 4;&lt;/code&gt;
-
-      &lt;div id="div5"&gt;
-        &lt;h1&gt;Division Element #5&lt;/h1&gt;
-        &lt;code&gt;position: relative;&lt;br/&gt;
-        z-index: 1;&lt;/code&gt;
-      &lt;/div&gt;
-
-      &lt;div id="div6"&gt;
-        &lt;h1&gt;Division Element #6&lt;/h1&gt;
-        &lt;code&gt;position: absolute;&lt;br/&gt;
-        z-index: 3;&lt;/code&gt;
-      &lt;/div&gt;
-    &lt;/div&gt;
-</pre>
-
-<h3 id="Division_Element_.231" name="Division_Element_.231">CSS</h3>
-
-<pre class="brush: css">* {
-    margin: 0;
-}
-html {
-    padding: 20px;
-    font: 12px/20px Arial, sans-serif;
-}
-div {
-    opacity: 0.7;
-    position: relative;
-}
-h1 {
-    font: inherit;
-    font-weight: bold;
-}
-#div1,
-#div2 {
-    border: 1px dashed #696;
-    padding: 10px;
-    background-color: #cfc;
-}
-#div1 {
-    z-index: 5;
-    margin-bottom: 190px;
-}
-#div2 {
-    z-index: 2;
-}
-#div3 {
-    z-index: 4;
-    opacity: 1;
-    position: absolute;
-    top: 40px;
-    left: 180px;
-    width: 330px;
-    border: 1px dashed #900;
-    background-color: #fdd;
-    padding: 40px 20px 20px;
-}
-#div4,
-#div5 {
-    border: 1px dashed #996;
-    background-color: #ffc;
-}
-#div4 {
-    z-index: 6;
-    margin-bottom: 15px;
-    padding: 25px 10px 5px;
-}
-#div5 {
-    z-index: 1;
-    margin-top: 15px;
-    padding: 5px 10px;
-}
-#div6 {
-    z-index: 3;
-    position: absolute;
-    top: 20px;
-    left: 180px;
-    width: 150px;
-    height: 125px;
-    border: 1px dashed #009;
-    padding-top: 125px;
-    background-color: #ddf;
-    text-align: center;
-}</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Example', '556', '396') }}</p>
-
-<h3 id="También_puedes_ver">También puedes ver</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Last Updated Date: July 9th, 2005</li>
-</ul>
-</div>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/index.html
deleted file mode 100644
index 14971890e0..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: Entendiendo la propiedad CSS z-index
-slug: Web/CSS/CSS_Positioning/entendiendo_z_index
-tags:
-  - Avanzado
-  - CSS
-  - Entendiendo_CSS_Z_Index
-  - Guía
-  - Referencia
-  - z-index
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index
----
-<p>Usualmente se puede considerar que las páginas HTML tienen dos dimensiones, porque el texto, las imágenes y otros elementos son organizados en la página sin superponerse. Hay un solo flujo de renderizado, y todos los elementos son concientes del espacio ocupado por otros. El atributo <span class="seoSummary">{{cssxref("z-index")}}</span> te permite ajustar el orden de las capas de los objetos cuando el contenido está siendo renderizado.</p>
-
-<blockquote>
-<p style="">En CSS 2.1, cada caja tiene una posición en tres dimensiones. Adicionalmente a sus posiciones horizontales y verticales, las cajas caen a lo largo de un "eje-z" y son formadas una encima de la otra. Las posiciones eje-Z son particularmente relevantes cuando las cajas se superponen visualmente.</p>
-</blockquote>
-
-<p>(de <a class="external" href="http://www.w3.org/TR/CSS21/visuren.html#z-index">CSS 2.1 Section 9.9.1 - Layered presentation</a>)</p>
-
-<p>Eso significa que las reglas de estilo CSS te permiten posicionar cajas en capas adicionales a la capa normal de renderizado (capa 0). La posición Z de cada capa es expresada como un entero que representa el orden de apilamiento durante el proceso de renderizado. Números más grandes significan mayor cercanía al observador. La posición Z puede ser controlada con la propiedad CSS {{ cssxref("z-index") }}.</p>
-
-<p>Usar z-index parece extremadamente fácil: una sola propiedad, asigna un número entero, con un comportamiento fácil de entender. Sin embargo, cuando z-index es aplicada a jerarquías complejas de elementos HTML, su comportamiento puede ser difícil de entender o incluso impredecible. Esto es debido a reglas complejas de apilamiento. De hecho una sección dedicada ha sido reservada en la especificación CSS <a class="external" href="http://www.w3.org/TR/CSS21/zindex.html">CSS-2.1 Appendix E</a> para explicar mejor estas reglas.</p>
-
-<p>Este artículo va a intentar explicar esas reglas, de una forma más simple y con varios ejemplos.</p>
-
-<ol>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
-</ol>
-
-<p><small><em>Nota del autor: Gracias a Wladimir Palant y Rod Whiteley por la revisión.</em></small></p>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a class="external" href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a class="external" href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Fecha de última actualización: 9 de Julio del 2005</li>
-</ul>
-</div>
diff --git a/files/es/web/css/css_positioning/entendiendo_z_index/stacking_without_z-index/index.html b/files/es/web/css/css_positioning/entendiendo_z_index/stacking_without_z-index/index.html
deleted file mode 100644
index 97038e7bae..0000000000
--- a/files/es/web/css/css_positioning/entendiendo_z_index/stacking_without_z-index/index.html
+++ /dev/null
@@ -1,141 +0,0 @@
----
-title: Apilando sin z-index
-slug: Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index
-translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index
----
-<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
-
-<h3 id="Apilando_sin_z-index">Apilando sin z-index</h3>
-
-<p>Cuando ningún elemento tiene z-index, los elementos son apilados en este orden (de abajo hacia arriba):</p>
-
-<ol>
- <li>El fondo y los bordes del elemento raiz</li>
- <li>Bloques descendientes en el flujo normal, en orden de aparición (en HTML)</li>
- <li>Elementos posicionados descendentemente, en orden de aparición (en HTML)</li>
-</ol>
-
-<p>En el siguiente ejemplo, los bloques con posiciones absolutas y relativas son apropiadamente dimensionados y posicionados para ilustrar las reglas de apilamiento.</p>
-
-<div class="note">
-<p><strong>Notas:</strong></p>
-
-<ul>
- <li>Dado un grupo homogéneo de elementos sin propiedad z-index, tales como los bloques posicionados (DIV #1 al #4) en el ejemplo, el orden de apilamiento de los elementos es su orden en la jerarquía HTML, independientemente de su posición.</li>
- <li>
-  <p>Bloques estándar (DIV #5) en el flujo normal, sin ninguna propiedad de posicionamiento, siempre son renderizados antes de los elementos posicionados y aparecen debajo de los mismos, incluso si están después en la jerarquía HTML.</p>
- </li>
-</ul>
-</div>
-
-<p><img alt="understanding_zindex_01.png" class="default internal" src="/@api/deki/files/910/=understanding_zindex_01.png"></p>
-
-<p> </p>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;div id="absdiv1"&gt;
-    &lt;br /&gt;&lt;span class="bold"&gt;DIV #1&lt;/span&gt;
-    &lt;br /&gt;position: absolute; &lt;/div&gt;
-&lt;div id="reldiv1"&gt;
-    &lt;br /&gt;&lt;span class="bold"&gt;DIV #2&lt;/span&gt;
-    &lt;br /&gt;position: relative; &lt;/div&gt;
-&lt;div id="reldiv2"&gt;
-    &lt;br /&gt;&lt;span class="bold"&gt;DIV #3&lt;/span&gt;
-    &lt;br /&gt;position: relative; &lt;/div&gt;
-&lt;div id="absdiv2"&gt;
-    &lt;br /&gt;&lt;span class="bold"&gt;DIV #4&lt;/span&gt;
-    &lt;br /&gt;position: absolute; &lt;/div&gt;
-&lt;div id="normdiv"&gt;
-    &lt;br /&gt;&lt;span class="bold"&gt;DIV #5&lt;/span&gt;
-    &lt;br /&gt;no positioning &lt;/div&gt;
-</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css"> .bold {
-     font-weight: bold;
-     font: 12px Arial;
- }
- #normdiv {
-     height: 70px;
-     border: 1px dashed #999966;
-     background-color: #ffffcc;
-     margin: 0px 50px 0px 50px;
-     text-align: center;
- }
- #reldiv1 {
-     opacity: 0.7;
-     height: 100px;
-     position: relative;
-     top: 30px;
-     border: 1px dashed #669966;
-     background-color: #ccffcc;
-     margin: 0px 50px 0px 50px;
-     text-align: center;
- }
- #reldiv2 {
-     opacity: 0.7;
-     height: 100px;
-     position: relative;
-     top: 15px;
-     left: 20px;
-     border: 1px dashed #669966;
-     background-color: #ccffcc;
-     margin: 0px 50px 0px 50px;
-     text-align: center;
- }
- #absdiv1 {
-     opacity: 0.7;
-     position: absolute;
-     width: 150px;
-     height: 350px;
-     top: 10px;
-     left: 10px;
-     border: 1px dashed #990000;
-     background-color: #ffdddd;
-     text-align: center;
- }
- #absdiv2 {
-     opacity: 0.7;
-     position: absolute;
-     width: 150px;
-     height: 350px;
-     top: 10px;
-     right: 10px;
-     border: 1px dashed #990000;
-     background-color: #ffdddd;
-     text-align: center;
- }
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>(Si la imagen no aparece en CodePen, haz clic en el botón Tidy en la sección CSS)</p>
-
-<p>{{ EmbedLiveSample('Example', '', '', '', 'Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index') }}</p>
-
-<h3 id="También_puedes_ver">También puedes ver</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
-
-<ul>
- <li>Autor(es): Paolo Lombardi</li>
- <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
- <li>Last Updated Date: November 3rd, 2014</li>
-</ul>
-</div>
-
-<p> </p>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/adding_z-index/index.html b/files/es/web/css/css_positioning/understanding_z_index/adding_z-index/index.html
new file mode 100644
index 0000000000..7dee5a1a06
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/adding_z-index/index.html
@@ -0,0 +1,180 @@
+---
+title: Agregando z-index
+slug: Web/CSS/CSS_Positioning/Understanding_z_index/Adding_z-index
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Adding_z-index
+original_slug: Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index
+---
+<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
+
+<h3 id="Agregando_cssxref(z-index)">Agregando {{ cssxref("z-index") }}</h3>
+
+<p>El primer ejemplo, <a href="https://developer.mozilla.org/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a>, explica cómo es organizado el apilamiento por defecto. Si quieres especificar un orden diferente de apilamiento, debes posicionar un elemento y usar la propiedad z-index.</p>
+
+<p>Esta propiedad es asignada con un valor entero (positivo o negativo), el cuál representa la posición del elemento en el eje-Z. Si no estás familiarizado con el eje-Z, imagina que la página tiene muchas capas una encima de la otra. Cada capa es numerada. Una capa con un número mayor es renderizada encima de las capas con números menores.</p>
+
+<div class="warning">
+<p><strong>Precaución:</strong> z-index solo tiene efecto si un elemento es <a href="/es/CSS/position" title="position">posicionado</a>.</p>
+</div>
+
+<ul>
+ <li><em>bottom: el más lejano al observador</em></li>
+ <li>...</li>
+ <li>Capa -3</li>
+ <li>Capa -2</li>
+ <li>Capa -1</li>
+ <li>Capa 0<em>capa de renderizado por defecto</em></li>
+ <li>Capa 1</li>
+ <li>Capa 2</li>
+ <li>Capa 3</li>
+ <li>...</li>
+ <li><em>top: el más cercano al observador</em></li>
+</ul>
+
+<div class="note">
+<p><strong>Notas:</strong></p>
+
+<ul>
+ <li>Cuando la propiedad z-index no ha sido especificada, los elementos son renderizados en la capa de renderizado por defecto 0 (cero).</li>
+ <li>Si varios elementos comparten el mismo valor z-index (<em>i.e.</em> están situados en la misma capa), las reglas de apilamiento explicadas en la sección <a href="https://developer.mozilla.org/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> son aplicadas.</li>
+</ul>
+</div>
+
+<p>En el siguiente ejempo, el orden de apilamiento de las capas es organizado usando z-index. El z-index del DIV#5 no hace efecto ya que este no es un elemento posicionado.</p>
+
+<p>{{ EmbedLiveSample('Example_source_code', '468', '365', '', 'Web/Guide/CSS/Understanding_z_index/Adding_z-index') }}</p>
+
+<h3 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h3>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+    &lt;meta charset="UTF-8"&gt;
+    &lt;title&gt;Adding z-index&lt;/title&gt;
+    &lt;style type="text/css"&gt;
+
+    div {
+        opacity: 0.7;
+        font: 12px Arial;
+    }
+
+    span.bold { font-weight: bold; }
+
+    #normdiv {
+        z-index: 8;
+        height: 70px;
+        border: 1px dashed #999966;
+        background-color: #ffffcc;
+        margin: 0px 50px 0px 50px;
+        text-align: center;
+    }
+
+    #reldiv1 {
+        z-index: 3;
+        height: 100px;
+        position: relative;
+        top: 30px;
+        border: 1px dashed #669966;
+        background-color: #ccffcc;
+        margin: 0px 50px 0px 50px;
+        text-align: center;
+    }
+
+    #reldiv2 {
+        z-index: 2;
+        height: 100px;
+        position: relative;
+        top: 15px;
+        left: 20px;
+        border: 1px dashed #669966;
+        background-color: #ccffcc;
+        margin: 0px 50px 0px 50px;
+        text-align: center;
+    }
+
+    #absdiv1 {
+        z-index: 5;
+        position: absolute;
+        width: 150px;
+        height: 350px;
+        top: 10px;
+        left: 10px;
+        border: 1px dashed #990000;
+        background-color: #ffdddd;
+        text-align: center;
+    }
+
+    #absdiv2 {
+        z-index: 1;
+        position: absolute;
+        width: 150px;
+        height: 350px;
+        top: 10px;
+        right: 10px;
+        border: 1px dashed #990000;
+        background-color: #ffdddd;
+        text-align: center;
+    }
+
+    &lt;/style&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+    &lt;br /&gt;&lt;br /&gt;
+
+    &lt;div id="absdiv1"&gt;
+        &lt;br /&gt;&lt;span class="bold"&gt;DIV #1&lt;/span&gt;
+        &lt;br /&gt;position: absolute;
+        &lt;br /&gt;z-index: 5;
+    &lt;/div&gt;
+
+    &lt;div id="reldiv1"&gt;
+        &lt;br /&gt;&lt;span class="bold"&gt;DIV #2&lt;/span&gt;
+        &lt;br /&gt;position: relative;
+        &lt;br /&gt;z-index: 3;
+    &lt;/div&gt;
+
+    &lt;div id="reldiv2"&gt;
+        &lt;br /&gt;&lt;span class="bold"&gt;DIV #3&lt;/span&gt;
+        &lt;br /&gt;position: relative;
+        &lt;br /&gt;z-index: 2;
+    &lt;/div&gt;
+
+    &lt;div id="absdiv2"&gt;
+        &lt;br /&gt;&lt;span class="bold"&gt;DIV #4&lt;/span&gt;
+        &lt;br /&gt;position: absolute;
+        &lt;br /&gt;z-index: 1;
+    &lt;/div&gt;
+
+    &lt;div id="normdiv"&gt;
+        &lt;br /&gt;&lt;span class="bold"&gt;DIV #5&lt;/span&gt;
+        &lt;br /&gt;no positioning
+        &lt;br /&gt;z-index: 8;
+    &lt;/div&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="También_puedes_ver">También puedes ver</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Last Updated Date: November 3rd, 2014</li>
+</ul>
+</div>
+
+<p>{{ languages( { "fr": "fr/CSS/Comprendre_z-index/Ajout_de_z-index" } ) }}</p>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/index.html b/files/es/web/css/css_positioning/understanding_z_index/index.html
new file mode 100644
index 0000000000..8f28c206be
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/index.html
@@ -0,0 +1,48 @@
+---
+title: Entendiendo la propiedad CSS z-index
+slug: Web/CSS/CSS_Positioning/Understanding_z_index
+tags:
+  - Avanzado
+  - CSS
+  - Entendiendo_CSS_Z_Index
+  - Guía
+  - Referencia
+  - z-index
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index
+original_slug: Web/CSS/CSS_Positioning/entendiendo_z_index
+---
+<p>Usualmente se puede considerar que las páginas HTML tienen dos dimensiones, porque el texto, las imágenes y otros elementos son organizados en la página sin superponerse. Hay un solo flujo de renderizado, y todos los elementos son concientes del espacio ocupado por otros. El atributo <span class="seoSummary">{{cssxref("z-index")}}</span> te permite ajustar el orden de las capas de los objetos cuando el contenido está siendo renderizado.</p>
+
+<blockquote>
+<p style="">En CSS 2.1, cada caja tiene una posición en tres dimensiones. Adicionalmente a sus posiciones horizontales y verticales, las cajas caen a lo largo de un "eje-z" y son formadas una encima de la otra. Las posiciones eje-Z son particularmente relevantes cuando las cajas se superponen visualmente.</p>
+</blockquote>
+
+<p>(de <a class="external" href="http://www.w3.org/TR/CSS21/visuren.html#z-index">CSS 2.1 Section 9.9.1 - Layered presentation</a>)</p>
+
+<p>Eso significa que las reglas de estilo CSS te permiten posicionar cajas en capas adicionales a la capa normal de renderizado (capa 0). La posición Z de cada capa es expresada como un entero que representa el orden de apilamiento durante el proceso de renderizado. Números más grandes significan mayor cercanía al observador. La posición Z puede ser controlada con la propiedad CSS {{ cssxref("z-index") }}.</p>
+
+<p>Usar z-index parece extremadamente fácil: una sola propiedad, asigna un número entero, con un comportamiento fácil de entender. Sin embargo, cuando z-index es aplicada a jerarquías complejas de elementos HTML, su comportamiento puede ser difícil de entender o incluso impredecible. Esto es debido a reglas complejas de apilamiento. De hecho una sección dedicada ha sido reservada en la especificación CSS <a class="external" href="http://www.w3.org/TR/CSS21/zindex.html">CSS-2.1 Appendix E</a> para explicar mejor estas reglas.</p>
+
+<p>Este artículo va a intentar explicar esas reglas, de una forma más simple y con varios ejemplos.</p>
+
+<ol>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
+</ol>
+
+<p><small><em>Nota del autor: Gracias a Wladimir Palant y Rod Whiteley por la revisión.</em></small></p>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a class="external" href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a class="external" href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Fecha de última actualización: 9 de Julio del 2005</li>
+</ul>
+</div>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/stacking_and_float/index.html b/files/es/web/css/css_positioning/understanding_z_index/stacking_and_float/index.html
new file mode 100644
index 0000000000..1a396ad06b
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/stacking_and_float/index.html
@@ -0,0 +1,145 @@
+---
+title: Apilamiento y float
+slug: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_and_float
+tags:
+  - Avanzado
+  - CSS
+  - Entendiendo_CSS_z-index
+  - Guía
+  - Referencia
+  - z-index
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_and_float
+original_slug: Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float
+---
+<div>{{cssref}}</div>
+
+<h3 id="Apilamiento_y_float">Apilamiento y float</h3>
+
+<p>Para los bloques flotantes el orden de apilamiento es un poco diferente. Los bloques flotantes son colocados entre bloques no posicionados y bloques posicionados:</p>
+
+<ol>
+ <li>Fondo y bordes del elemento raiz</li>
+ <li>Bloques descendientes en el flujo normal, en orden de aparición (en HTML)</li>
+ <li>Bloques flotantes</li>
+ <li>Elementos posicionados descendentemente , en orden de aparición (en HTML)</li>
+</ol>
+
+<p>En realidad, como puedes ver en el siguiente ejemplo, el fondo y el borde del bloque no posicionado (DIV #4) no son afectados por los bloques flotantes, mientras que el contenido si es afectado. Esto ocurre de acuerdo al comportamiento flotante stándar de CSS.</p>
+
+<p>Este comportamiento puede ser explicado con una versión mejorada de la lista previa:</p>
+
+<ol>
+ <li>Fondo y bordes del elemento raiz</li>
+ <li>Bloques descendientes en el flujo normal, en orden de aparición (en HTML)</li>
+ <li>Bloques flotantes</li>
+ <li>Descendientes en línea en el flujo normal</li>
+ <li>Elementos posicionados descendentemente , en orden de aparición (en HTML)</li>
+</ol>
+
+<div class="note"><strong>Nota:</strong> En el ejemplo debajo, todos los bloques excepto el no posicionado son translúcidos para mostrar el orden de apilamiento. Si la opacidad del bloque no posicionado (DIV #4) es reducida, entonces algo extraño ocurre: el fondo y el borde de ese bloque sobresale por encima de los bloques flotantes, pero aun debajo de los bloques posicionados. Yo no pude entender si esto es un bug o una interpretación peculiar de la especificación. (Aplicar opacidad debería crear implícitamente un contexto de apilamiento.)</div>
+
+<p>{{ EmbedLiveSample('Example_source_code', '563', '255', '', 'Web/Guide/CSS/Understanding_z_index/Stacking_and_float') }}</p>
+
+<h2 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div id="abs1"&gt;
+  &lt;b&gt;DIV #1&lt;/b&gt;&lt;br /&gt;position: absolute;&lt;/div&gt;
+
+&lt;div id="flo1"&gt;
+  &lt;b&gt;DIV #2&lt;/b&gt;&lt;br /&gt;float: left;&lt;/div&gt;
+
+&lt;div id="flo2"&gt;
+  &lt;b&gt;DIV #3&lt;/b&gt;&lt;br /&gt;float: right;&lt;/div&gt;
+
+&lt;br /&gt;
+
+&lt;div id="sta1"&gt;
+  &lt;b&gt;DIV #4&lt;/b&gt;&lt;br /&gt;no positioning&lt;/div&gt;
+
+&lt;div id="abs2"&gt;
+  &lt;b&gt;DIV #5&lt;/b&gt;&lt;br /&gt;position: absolute;&lt;/div&gt;
+</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">div {
+  padding: 10px;
+  text-align: center;
+}
+
+b {
+  font-family: sans-serif;
+}
+
+#abs1 {
+  position: absolute;
+  width: 150px;
+  height: 200px;
+  top: 10px;
+  right: 140px;
+  border: 1px dashed #900;
+  background-color: #fdd;
+}
+
+#sta1 {
+  height: 100px;
+  border: 1px dashed #996;
+  background-color: #ffc;
+  margin: 0px 10px 0px 10px;
+  text-align: left;
+}
+
+#flo1 {
+  margin: 0px 10px 0px 20px;
+  float: left;
+  width: 150px;
+  height: 200px;
+  border: 1px dashed #090;
+  background-color: #cfc;
+}
+
+#flo2 {
+  margin: 0px 20px 0px 10px;
+  float: right;
+  width: 150px;
+  height: 200px;
+  border: 1px dashed #090;
+  background-color: #cfc;
+}
+
+#abs2 {
+  position: absolute;
+  width: 150px;
+  height: 100px;
+  top: 130px;
+  left: 100px;
+  border: 1px dashed #990;
+  background-color: #fdd;
+}</pre>
+
+<h3 id="También_puedes_ver">También puedes ver</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
+ <li>
+  <p><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</p>
+ </li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Last Updated Date: November 3rd, 2014</li>
+</ul>
+</div>
+
+<p> </p>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_1/index.html b/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_1/index.html
new file mode 100644
index 0000000000..c91a910a51
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_1/index.html
@@ -0,0 +1,133 @@
+---
+title: Ejemplo 1 del contexto de apilamiento
+slug: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1
+original_slug: >-
+  Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento
+---
+<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
+
+<h3 id="Ejemplo_1_del_contexto_de_apilamiento">Ejemplo 1 del contexto de apilamiento</h3>
+
+<p>Empecemos con un ejemplo básico. En el contexto de apilamiento raíz tenemos dos DIVs (DIV #1 and DIV #3), ambos con posición relativa, pero sin propiedad z-index. Dentro del DIV #1 se encuentra el DIV #2 de posición absoluta, mientras que en el DIV #3 se encuentra el DIV #4 con posición absoluta, ambos sin propiedad z-index.</p>
+
+<p>El único contexto de apilamiento es el contexto raíz. Sin la propiedad z-index, los elementos son apilados por orden de ocurrencia.</p>
+
+<p><img alt="Stacking context example 1" class="internal" src="/@api/deki/files/914/=Understanding_zindex_05a.png"></p>
+
+<p>Si a DIV #2 le asignamos un valor z-index positivo (no-cero y no-auto), es renderizado encima de todos los otros DIVs.</p>
+
+<p><img alt="Stacking context example 1" class="internal" src="/@api/deki/files/915/=Understanding_zindex_05b.png"></p>
+
+<p>Luego si al DIV #4 también se le asigna un z-index positivo mayor que el z-index del DIV #2, es renderizado encima de los otros DIVs incluyendo DIV #2.</p>
+
+<p><img alt="Stacking context example 1" class="internal" src="/@api/deki/files/916/=Understanding_zindex_05c.png"></p>
+
+<p>En este último ejemplo puedes ver que el DIV #2 y el DIV #4 no son hermanos, porque pertenecen a padres distintos en la jerarquía de elementos HTML. A pesar de esto, el apilamiento del DIV #4 con respecto al DIV #2 puede ser controlado a través de z-index. Pasa que, dado a que al DIV #1 y al DIV #3 no se le ha asignado ningún valor z-index, ellos no han creado un contexto de apilamiento. Esto significa que todos sus contenidos, incluyendo el DIV #2 y el DIV #4, pertenecen al mismo contexto de apilamiento raíz.</p>
+
+<p>En términos de contextos de apilamiento, el DIV #1 y el DIV #3 son simplemente asimilados dentro del elemento raíz, y la jerarquía resultante es la siguiente:</p>
+
+<ul>
+ <li>contexto de apilamiento raíz
+  <ul>
+   <li>DIV #2 (z-index 1)</li>
+   <li>DIV #4 (z-index 2)</li>
+  </ul>
+ </li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> El DIV #1 y el DIV #3 no son translúcidos. Es importante recordar que asignar una opacidad menor a 1 a un elemento posicionado implica la creación de un contexto de apilamiento, como ocurre cuando se añade un valor z-index. Y este ejemplo muestra que ocurre cuando un elemento padre no crea un contexto de apilamiento.</div>
+
+<h2 id="Ejemplo"><strong>Ejemplo</strong></h2>
+
+<h3 id="HTML"><strong>HTML</strong></h3>
+
+<pre class="brush: html">&lt;div id="div1"&gt;
+&lt;br /&gt;&lt;span class="bold"&gt;DIV #1&lt;/span&gt;
+&lt;br /&gt;position: relative;
+   &lt;div id="div2"&gt;
+   &lt;br /&gt;&lt;span class="bold"&gt;DIV #2&lt;/span&gt;
+   &lt;br /&gt;position: absolute;
+   &lt;br /&gt;z-index: 1;
+   &lt;/div&gt;
+&lt;/div&gt;
+
+&lt;br /&gt;
+
+&lt;div id="div3"&gt;
+&lt;br /&gt;&lt;span class="bold"&gt;DIV #3&lt;/span&gt;
+&lt;br /&gt;position: relative;
+   &lt;div id="div4"&gt;
+   &lt;br /&gt;&lt;span class="bold"&gt;DIV #4&lt;/span&gt;
+   &lt;br /&gt;position: absolute;
+   &lt;br /&gt;z-index: 2;
+   &lt;/div&gt;
+&lt;/div&gt;
+
+&lt;/body&gt;&lt;/html&gt;
+</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">.bold {
+    font-weight: bold;
+    font: 12px Arial;
+}
+#div1,
+#div3 {
+    height: 80px;
+    position: relative;
+    border: 1px dashed #669966;
+    background-color: #ccffcc;
+    padding-left: 5px;
+}
+#div2 {
+    opacity: 0.8;
+    z-index: 1;
+    position: absolute;
+    width: 150px;
+    height: 200px;
+    top: 20px;
+    left: 170px;
+    border: 1px dashed #990000;
+    background-color: #ffdddd;
+    text-align: center;
+}
+#div4 {
+    opacity: 0.8;
+    z-index: 2;
+    position: absolute;
+    width: 200px;
+    height: 70px;
+    top: 65px;
+    left: 50px;
+    border: 1px dashed #000099;
+    background-color: #ddddff;
+    text-align: left;
+    padding-left: 10px;
+}</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Example', '', '', '', 'Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_1') }}</p>
+
+<h3 id="También_puedes_ver">También puedes ver</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel<span id="cke_bm_89E" style="display: none;"> </span></li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Last Updated Date: July 9th, 2005</li>
+</ul>
+</div>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_2/index.html b/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_2/index.html
new file mode 100644
index 0000000000..1c8cfbb6c7
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_2/index.html
@@ -0,0 +1,138 @@
+---
+title: Ejemplo 2 del contexto de apilamiento
+slug: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_2
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_2
+original_slug: >-
+  Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento
+---
+<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
+
+<h3 id="Ejemplo_2_del_contexto_de_apilamiento">Ejemplo 2 del contexto de apilamiento</h3>
+
+<p>Este es un ejemplo muy simple, pero es la clave para entender el concepto de <em>contexto de apilamiento. </em>Tenemos los mismos 4 DIVs del ejemplo previo, pero ahora las propiedades z-index son asignadas en ambos niveles de la jerarquía.</p>
+
+<p>{{ EmbedLiveSample('Example_source_code', '352', '270', '', 'Web/Guide/CSS/Understanding_z_index/Stacking_context_example_2') }}</p>
+
+<p>Puedes ver que el DIV #2 (z-index: 2) está encima del DIV #3 (z-index: 1), porque ambos pertenecen al mismo contexto de apilamiento (el contexto raíz), así que los valores z-index indican cómo son apilados los elementos.</p>
+
+<p>Lo que puede ser considerado extraño es que el DIV #2 (z-index: 2) está encima del DIV #4 (z-index: 10), a pesar de sus valores z-index. La razón es que ellos no pertenecen al mismo contexto de apilamiento. El DIV #4 pertenece al contexto de apilamiento creado por el DIV #3, y como explicamos previamente el DIV #3 (y todos su contenido) está debajo del DIV #2.</p>
+
+<p>Para entender mejor esta situación, esta es la jerarquía del contexto de apilamiento:</p>
+
+<ul>
+ <li>contexto de apilamiento raíz
+  <ul>
+   <li>DIV #2 (z-index 2)</li>
+   <li>DIV #3 (z-index 1)
+    <ul>
+     <li>DIV #4 (z-index 10)</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<div class="note"><strong>Nota:</strong>  Vale la pena recordar que en general la jerarquía HTML es diferente de la jerarquía del contexto de apilamiento. En la jerarquía del contexto de apilamiento, los elementos que no crean un contexto de apilamiento son colapsados en sus padres.</div>
+
+<h3 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h3>
+
+<pre class="brush: html">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
+&lt;html&gt;
+&lt;head&gt;&lt;style type="text/css"&gt;
+
+div { font: 12px Arial; }
+
+span.bold { font-weight: bold; }
+
+#div2 { z-index: 2; }
+#div3 { z-index: 1; }
+#div4 { z-index: 10; }
+
+#div1,#div3 {
+   height: 80px;
+   position: relative;
+   border: 1px dashed #669966;
+   background-color: #ccffcc;
+   padding-left: 5px;
+}
+
+#div2 {
+   opacity: 0.8;
+   position: absolute;
+   width: 150px;
+   height: 200px;
+   top: 20px;
+   left: 170px;
+   border: 1px dashed #990000;
+   background-color: #ffdddd;
+   text-align: center;
+}
+
+#div4 {
+   opacity: 0.8;
+   position: absolute;
+   width: 200px;
+   height: 70px;
+   top: 65px;
+   left: 50px;
+   border: 1px dashed #000099;
+   background-color: #ddddff;
+   text-align: left;
+   padding-left: 10px;
+}
+
+
+&lt;/style&gt;&lt;/head&gt;
+
+&lt;body&gt;
+
+    &lt;br /&gt;
+
+    &lt;div id="div1"&gt;&lt;br /&gt;
+        &lt;span class="bold"&gt;DIV #1&lt;/span&gt;&lt;br /&gt;
+        position: relative;
+        &lt;div id="div2"&gt;&lt;br /&gt;
+            &lt;span class="bold"&gt;DIV #2&lt;/span&gt;&lt;br /&gt;
+            position: absolute;&lt;br /&gt;
+            z-index: 2;
+        &lt;/div&gt;
+    &lt;/div&gt;
+
+    &lt;br /&gt;
+
+    &lt;div id="div3"&gt;&lt;br /&gt;
+        &lt;span class="bold"&gt;DIV #3&lt;/span&gt;&lt;br /&gt;
+        position: relative;&lt;br /&gt;
+        z-index: 1;
+        &lt;div id="div4"&gt;&lt;br /&gt;
+            &lt;span class="bold"&gt;DIV #4&lt;/span&gt;&lt;br /&gt;
+            position: absolute;&lt;br /&gt;
+            z-index: 10;
+        &lt;/div&gt;
+    &lt;/div&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="También_puedes_ver">También puedes ver</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Last Updated Date: July 9th, 2005</li>
+</ul>
+</div>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_3/index.html b/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_3/index.html
new file mode 100644
index 0000000000..501fe70e83
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/stacking_context_example_3/index.html
@@ -0,0 +1,184 @@
+---
+title: Ejemplo 3 del contexto de apilamiento
+slug: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_3
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_context_example_3
+original_slug: >-
+  Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento
+---
+<p>« <a href="/en/CSS" title="CSS">CSS</a> « <a href="/en/CSS/Understanding_z-index" title="Understanding CSS z-index">Understanding CSS z-index</a></p>
+
+<h3 id="Ejemplo_3_del_contexto_de_apilamiento">Ejemplo 3 del contexto de apilamiento</h3>
+
+<p>Este último ejemplo muestra los problemas que surgen cuando se combinan varios elementos posicionados en una jerarquía HTML multi nivel y cuando los valores z-index son asignados usando selectores de clase.</p>
+
+<p>Tomemos como ejemplo un menú jerárquico de tres niveles formado por varios DIVs posicionados. DIVs de segundo y tercer nivel aparecen cuando se pone el cursor encima o se hace clic en sus padres. Usualmente este tipo de menú es generado mediante un script del lado del cliente o del lado del servidor, así que las reglas de estilos son asignadas con un selector de clase en lugar de un selector de id.</p>
+
+<p>Si los tres niveles del menú se superponen parcialmente, entonces gestionar el apilamiento se podría convertir en un problema.</p>
+
+<p>{{ EmbedLiveSample('Example_source_code', '320', '330', '', 'Web/Guide/CSS/Understanding_z_index/Stacking_context_example_3') }}</p>
+
+<p>El menú de primer nivel solo tiene posición relativa, así que ningún contexto de apilamiento es creado.</p>
+
+<p>El menú de segundo nivel tiene posición absoluta dentro del elemento padre. Para colocarlo encima de todos los menus de primer nivel, usamos z-index. El problema es que para cada menú de segundo nivel, un contexto de apilamiento es creado y cada menú de tercer nivel pertenece al contexto de su padre.</p>
+
+<p>De manera que un menú de tercer nivel va a ser apilado bajo los menus de segundo nivel porque todos los menus de segundo nivel comparten el mismo valor z-index y las reglas de apilamiento por defecto son aplicadas.</p>
+
+<p>Para entender mejor la situación, esta es la jerarquía del contexto de apilamiento:</p>
+
+<ul>
+ <li>contexto de apilamiento raíz
+  <ul>
+   <li>NIVEL #1
+    <ul>
+     <li>NIVEL #2 (z-index: 1)
+      <ul>
+       <li>NIVEL #3</li>
+       <li>...</li>
+       <li>NIVEL #3</li>
+      </ul>
+     </li>
+     <li>NIVEL #2 (z-index: 1)</li>
+     <li>...</li>
+     <li>NIVEL #2 (z-index: 1)</li>
+    </ul>
+   </li>
+   <li>NIVEL #1</li>
+   <li>...</li>
+   <li>NIVEL #1</li>
+  </ul>
+ </li>
+</ul>
+
+<p>Este problema puede ser evitado al remover la superposición entre menus de diferentes niveles, o usando valores z-index individuales (y diferentes) asignados a través del selector id en lugar de un selector de clase, o aplanando la jerarquía HTML.</p>
+
+<div class="note"><strong>Nota:</strong> En el código fuente vas a ver que los menus de segundo y tercer nivel están hechos de varios DIVs contenidos en un contenedor con posición absoluta. Esto es útil para agrupar y posicionarlos todos a la vez.</div>
+
+<h3 id="Código_fuente_de_ejemplo"><strong>Código fuente de ejemplo</strong></h3>
+
+<pre class="brush: html">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
+&lt;html&gt;
+&lt;head&gt;&lt;style type="text/css"&gt;
+
+div { font: 12px Arial; }
+
+span.bold { font-weight: bold; }
+
+div.lev1 {
+   width: 250px;
+   height: 70px;
+   position: relative;
+   border: 2px outset #669966;
+   background-color: #ccffcc;
+   padding-left: 5px;
+}
+
+#container1 {
+   z-index: 1;
+   position: absolute;
+   top: 30px;
+   left: 75px;
+}
+
+div.lev2 {
+   opacity: 0.9;
+   width: 200px;
+   height: 60px;
+   position: relative;
+   border: 2px outset #990000;
+   background-color: #ffdddd;
+   padding-left: 5px;
+}
+
+#container2 {
+   z-index: 1;
+   position: absolute;
+   top: 20px;
+   left: 110px;
+}
+
+div.lev3 {
+   z-index: 10;
+   width: 100px;
+   position: relative;
+   border: 2px outset #000099;
+   background-color: #ddddff;
+   padding-left: 5px;
+}
+
+&lt;/style&gt;&lt;/head&gt;
+
+&lt;body&gt;
+
+&lt;br /&gt;
+
+&lt;div class="lev1"&gt;
+&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
+
+   &lt;div id="container1"&gt;
+
+      &lt;div class="lev2"&gt;
+      &lt;br /&gt;&lt;span class="bold"&gt;LEVEL #2&lt;/span&gt;
+      &lt;br /&gt;z-index: 1;
+
+         &lt;div id="container2"&gt;
+
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+            &lt;div class="lev3"&gt;&lt;span class="bold"&gt;LEVEL #3&lt;/span&gt;&lt;/div&gt;
+
+         &lt;/div&gt;
+
+      &lt;/div&gt;
+
+      &lt;div class="lev2"&gt;
+      &lt;br /&gt;&lt;span class="bold"&gt;LEVEL #2&lt;/span&gt;
+      &lt;br /&gt;z-index: 1;
+      &lt;/div&gt;
+
+   &lt;/div&gt;
+&lt;/div&gt;
+
+&lt;div class="lev1"&gt;
+&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
+&lt;/div&gt;
+
+&lt;div class="lev1"&gt;
+&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
+&lt;/div&gt;
+
+&lt;div class="lev1"&gt;
+&lt;span class="bold"&gt;LEVEL #1&lt;/span&gt;
+&lt;/div&gt;
+
+&lt;/body&gt;&lt;/html&gt;
+</pre>
+
+<h3 id="También_puedes_ver">También puedes ver</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Last Updated Date: July 9th, 2005</li>
+</ul>
+</div>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/stacking_without_z-index/index.html b/files/es/web/css/css_positioning/understanding_z_index/stacking_without_z-index/index.html
new file mode 100644
index 0000000000..30e20d5e3c
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/stacking_without_z-index/index.html
@@ -0,0 +1,142 @@
+---
+title: Apilando sin z-index
+slug: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index
+original_slug: Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index
+---
+<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
+
+<h3 id="Apilando_sin_z-index">Apilando sin z-index</h3>
+
+<p>Cuando ningún elemento tiene z-index, los elementos son apilados en este orden (de abajo hacia arriba):</p>
+
+<ol>
+ <li>El fondo y los bordes del elemento raiz</li>
+ <li>Bloques descendientes en el flujo normal, en orden de aparición (en HTML)</li>
+ <li>Elementos posicionados descendentemente, en orden de aparición (en HTML)</li>
+</ol>
+
+<p>En el siguiente ejemplo, los bloques con posiciones absolutas y relativas son apropiadamente dimensionados y posicionados para ilustrar las reglas de apilamiento.</p>
+
+<div class="note">
+<p><strong>Notas:</strong></p>
+
+<ul>
+ <li>Dado un grupo homogéneo de elementos sin propiedad z-index, tales como los bloques posicionados (DIV #1 al #4) en el ejemplo, el orden de apilamiento de los elementos es su orden en la jerarquía HTML, independientemente de su posición.</li>
+ <li>
+  <p>Bloques estándar (DIV #5) en el flujo normal, sin ninguna propiedad de posicionamiento, siempre son renderizados antes de los elementos posicionados y aparecen debajo de los mismos, incluso si están después en la jerarquía HTML.</p>
+ </li>
+</ul>
+</div>
+
+<p><img alt="understanding_zindex_01.png" class="default internal" src="/@api/deki/files/910/=understanding_zindex_01.png"></p>
+
+<p> </p>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;div id="absdiv1"&gt;
+    &lt;br /&gt;&lt;span class="bold"&gt;DIV #1&lt;/span&gt;
+    &lt;br /&gt;position: absolute; &lt;/div&gt;
+&lt;div id="reldiv1"&gt;
+    &lt;br /&gt;&lt;span class="bold"&gt;DIV #2&lt;/span&gt;
+    &lt;br /&gt;position: relative; &lt;/div&gt;
+&lt;div id="reldiv2"&gt;
+    &lt;br /&gt;&lt;span class="bold"&gt;DIV #3&lt;/span&gt;
+    &lt;br /&gt;position: relative; &lt;/div&gt;
+&lt;div id="absdiv2"&gt;
+    &lt;br /&gt;&lt;span class="bold"&gt;DIV #4&lt;/span&gt;
+    &lt;br /&gt;position: absolute; &lt;/div&gt;
+&lt;div id="normdiv"&gt;
+    &lt;br /&gt;&lt;span class="bold"&gt;DIV #5&lt;/span&gt;
+    &lt;br /&gt;no positioning &lt;/div&gt;
+</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css"> .bold {
+     font-weight: bold;
+     font: 12px Arial;
+ }
+ #normdiv {
+     height: 70px;
+     border: 1px dashed #999966;
+     background-color: #ffffcc;
+     margin: 0px 50px 0px 50px;
+     text-align: center;
+ }
+ #reldiv1 {
+     opacity: 0.7;
+     height: 100px;
+     position: relative;
+     top: 30px;
+     border: 1px dashed #669966;
+     background-color: #ccffcc;
+     margin: 0px 50px 0px 50px;
+     text-align: center;
+ }
+ #reldiv2 {
+     opacity: 0.7;
+     height: 100px;
+     position: relative;
+     top: 15px;
+     left: 20px;
+     border: 1px dashed #669966;
+     background-color: #ccffcc;
+     margin: 0px 50px 0px 50px;
+     text-align: center;
+ }
+ #absdiv1 {
+     opacity: 0.7;
+     position: absolute;
+     width: 150px;
+     height: 350px;
+     top: 10px;
+     left: 10px;
+     border: 1px dashed #990000;
+     background-color: #ffdddd;
+     text-align: center;
+ }
+ #absdiv2 {
+     opacity: 0.7;
+     position: absolute;
+     width: 150px;
+     height: 350px;
+     top: 10px;
+     right: 10px;
+     border: 1px dashed #990000;
+     background-color: #ffdddd;
+     text-align: center;
+ }
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>(Si la imagen no aparece en CodePen, haz clic en el botón Tidy en la sección CSS)</p>
+
+<p>{{ EmbedLiveSample('Example', '', '', '', 'Web/CSS/CSS_Positioning/Understanding_z_index/Stacking_without_z-index') }}</p>
+
+<h3 id="También_puedes_ver">También puedes ver</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento" title="El contexto de apilamiento">El contexto de apilamiento</a> : Notas sobre el contexto de apilamiento</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Last Updated Date: November 3rd, 2014</li>
+</ul>
+</div>
+
+<p> </p>
diff --git a/files/es/web/css/css_positioning/understanding_z_index/the_stacking_context/index.html b/files/es/web/css/css_positioning/understanding_z_index/the_stacking_context/index.html
new file mode 100644
index 0000000000..0927923987
--- /dev/null
+++ b/files/es/web/css/css_positioning/understanding_z_index/the_stacking_context/index.html
@@ -0,0 +1,232 @@
+---
+title: El contexto de apilamiento
+slug: Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
+translation_of: Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
+original_slug: Web/CSS/CSS_Positioning/entendiendo_z_index/El_contexto_de_apilamiento
+---
+<p>El contexto de apilamiento es la conceptualización tridimensional de los elementos HTML a lo largo de un eje-Z imaginario relativo al usuario que se asume está de cara al viewport o página web. Los elementos HTML ocupan este espacio por orden de prioridad basado en sus atributos.</p>
+
+<p>« <a href="/es/CSS" title="CSS">CSS</a> « <a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index" title="Understanding CSS z-index">ENTENDIENDO LA PROPIEDAD CSS Z-INDEX</a></p>
+
+<h2 id="El_contexto_de_apilamiento">El contexto de apilamiento</h2>
+
+<p> </p>
+
+<p>En el ejemplo previo, <a href="https://developer.mozilla.org/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a>, el orden de renderizado de ciertos DIVs es influenciado por sus valores z-index. Esto ocurre debido a que estos DIVs tienen propiedades especiales que causan que formen un contexto de apilamiento.</p>
+
+<p>Un contexto de apilamiento es formado, en cualquier lugar del documento, por cualquier elemento que</p>
+
+<ul>
+ <li>sea el elemento raiz (HTML),</li>
+ <li>tenga posición (absoluta o relativa) con un valor z-index distinto de "auto",</li>
+ <li>un elemento flex con un valor z-index distinto de "auto", que sea el elemento padre display: flex|inline-flex,</li>
+ <li>sean elementos con un valor {{cssxref("opacity")}} menor de 1. (Mira <a href="http://www.w3.org/TR/css3-color/#transparency" title="http://www.w3.org/TR/css3-color/#transparency">la especificación de opacity</a>),</li>
+ <li>elementos con un valor  {{cssxref("transform")}} distinto de "none",</li>
+ <li>elementos con un valor {{cssxref("mix-blend-mode")}} distinto de "normal",</li>
+ <li>elementos con un valor {{cssxref("filter")}} distinto de "none",</li>
+ <li>elementos con un valor {{cssxref("perspective")}} distinto de "none",</li>
+ <li>elementos con un valor {{cssxref("isolation")}} igual a "isolate",</li>
+ <li><code>position: fixed</code></li>
+ <li>especifican cualquier atributo superior en <code>{{cssxref("will-change")}} incluso si no especificas valores para estos atributos directamente </code>(Mira <a href="http://dev.opera.com/articles/css-will-change-property/">este post</a>)</li>
+ <li>elementos con un valor {{cssxref("-webkit-overflow-scrolling")}} igual a "touch"</li>
+</ul>
+
+<p>Dentro de un contexto de apilamiento, los elementos hijos son apilados de acuerdo a las mismas reglas previamente explicadas. Es importante entender que los valores z-index de los contextos de apilamiento de los hijos solo tienen sentido en el contexto del padre. Los contextos de apilamiento son tratados atómicamente como una sola unidad en el contexto de apilamiento del padre.</p>
+
+<p>En resumen:</p>
+
+<ul>
+ <li>Posicionar y asignar un valor z-index a un elemento HTML crea un contexto de apilamiento, (asi como también lo hace asignar una opacidad parcial)</li>
+ <li>Contextos de apilamiento pueden ser contenidos en otros contextos de apilamiento, y juntos crean una jerarquía de contextos de apilamiento</li>
+ <li>Cada contexto de apilamiento es completamente independiente de sus hermanos: solo los elementos descendientes son considerados cuando el apilamiento es procesado.</li>
+ <li>Cada contexto de apilamiento es auto contenido: luego que los contenidos del elemento son apilados, el elemento completo es considerado en el orden de apilamiento del contexto del padre.</li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> La jerarquía de apilar contextos es un sub conjunto de la jerarquía de elementos HTML, porque solo ciertos elementos crean contextos de apilamiento. Podemos decir que los elementos que no crean sus propios contextos de apilamiento son asimilados por el contexto de apilamiento padre.</div>
+
+<h2 id="El_ejemplo"><strong>El ejemplo</strong></h2>
+
+<p><img alt="Example of stacking rules modified using z-index" src="/@api/deki/files/913/=Understanding_zindex_04.png"></p>
+
+<p>En este ejemplo cada elemento posicionado crea su propio contexto de apilamiento, debido a sus valores de posicionamiento y z-index. La jerarquía de contextos de apilamiento es organizada de la siguiente manera:</p>
+
+<ul>
+ <li>Raíz
+  <ul>
+   <li>DIV #1</li>
+   <li>DIV #2</li>
+   <li>DIV #3
+    <ul>
+     <li>DIV #4</li>
+     <li>DIV #5</li>
+     <li>DIV #6</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<p>Es importante notar que el DIV #4, DIV #5 y el DIV #6 son hijos del DIV #3, así que el apilamiento de esos elementos es completamente resuelto dentro del DIV#3. Una vez que el apilamiento y el renderizado dentro del DIV#3 ha sido completado, todo el elemento DIV#3 es apilado en el elemento raíz con respecto a sus DIV hermanos.</p>
+
+<div class="note">
+<p><strong>Notas:</strong></p>
+
+<ul>
+ <li>DIV #4 es renderizado debajo de DIV #1 porque el z-index (5) de DIV #1 es válido dentro del contexto de apilamiento del elemento raiz, mientras que el z-index (6) de DIV #4 es válido dentro del contexto de apilamiento de DIV #3. Así que DIV #4 está debajo de DIV #1, porque DIV #4 pertenece a DIV #3, que tiene un valor z-index menor.</li>
+ <li>Por la misma razón DIV #2 (z-index 2) es renderizado bajo DIV#5 (z-index 1) porque DIV #5 pertenece a DIV #3, que tiene un valor z-index mayor.</li>
+ <li>El valor z-index de DIV #3 es 4, pero este valor es independiente del z-index de DIV #4, DIV #5 and DIV #6, porque pertenece a un contexto de apilamiento diferente.</li>
+ <li>Una forma fácil de descubrir el <em>orden de renderizado</em> de los elementos apilados en el eje Z es pensar en esto como un tipo de "número de versión", donde los elementos hijos son números de versión menores bajo los números de versión mayores de sus padres. De esta manera podemos ver fácilmente cómo un elemento con un valor z-index de 1 (DIV #5) es apilado encima de un elemento con un valor z-index de 2 (DIV #2), y cómo un elemento con un valor z-index de 6 (DIV #4) es apilado debajo de un elemento con un valor z-index de 5 (DIV #1). En nuestro ejemplo (ordenado de acuerdo al orden de renderizado final):
+  <ul>
+   <li>Raíz
+    <ul>
+     <li>El valor z-index de DIV #2 es 2</li>
+     <li>El valor z-index de DIV #3 es 4
+      <ul>
+       <li>El valor z-index de DIV #5 es 1, apilado bajo un elemento con un valor z-index de 4, que resulta en un orden de renderizado de 4.1</li>
+       <li>El valor z-index de DIV #6 es 3, apilado debajo de un elemento con un valor z-index de 4, que resulta en un orden de renderizado de 4.3</li>
+       <li>El valor z-index de DIV #4 es 6, apilado bajo un elemento con valor z-index de 4, que resulta en un orden de renderizado de 4.6</li>
+      </ul>
+     </li>
+     <li>El valor z-index de DIV #1 es 5</li>
+    </ul>
+   </li>
+  </ul>
+ </li>
+</ul>
+</div>
+
+<h2 id="Ejemplo"><strong>Ejemplo</strong></h2>
+
+<h3 id="HTML"><strong>HTML</strong></h3>
+
+<pre class="brush: html">    &lt;div id="div1"&gt;
+      &lt;h1&gt;Division Element #1&lt;/h1&gt;
+      &lt;code&gt;position: relative;&lt;br/&gt;
+      z-index: 5;&lt;/code&gt;
+    &lt;/div&gt;
+
+    &lt;div id="div2"&gt;
+      &lt;h1&gt;Division Element #2&lt;/h1&gt;
+      &lt;code&gt;position: relative;&lt;br/&gt;
+      z-index: 2;&lt;/code&gt;
+    &lt;/div&gt;
+
+    &lt;div id="div3"&gt;
+
+      &lt;div id="div4"&gt;
+        &lt;h1&gt;Division Element #4&lt;/h1&gt;
+        &lt;code&gt;position: relative;&lt;br/&gt;
+        z-index: 6;&lt;/code&gt;
+      &lt;/div&gt;
+
+      &lt;h1&gt;Division Element #3&lt;/h1&gt;
+      &lt;code&gt;position: absolute;&lt;br/&gt;
+      z-index: 4;&lt;/code&gt;
+
+      &lt;div id="div5"&gt;
+        &lt;h1&gt;Division Element #5&lt;/h1&gt;
+        &lt;code&gt;position: relative;&lt;br/&gt;
+        z-index: 1;&lt;/code&gt;
+      &lt;/div&gt;
+
+      &lt;div id="div6"&gt;
+        &lt;h1&gt;Division Element #6&lt;/h1&gt;
+        &lt;code&gt;position: absolute;&lt;br/&gt;
+        z-index: 3;&lt;/code&gt;
+      &lt;/div&gt;
+    &lt;/div&gt;
+</pre>
+
+<h3 id="Division_Element_.231" name="Division_Element_.231">CSS</h3>
+
+<pre class="brush: css">* {
+    margin: 0;
+}
+html {
+    padding: 20px;
+    font: 12px/20px Arial, sans-serif;
+}
+div {
+    opacity: 0.7;
+    position: relative;
+}
+h1 {
+    font: inherit;
+    font-weight: bold;
+}
+#div1,
+#div2 {
+    border: 1px dashed #696;
+    padding: 10px;
+    background-color: #cfc;
+}
+#div1 {
+    z-index: 5;
+    margin-bottom: 190px;
+}
+#div2 {
+    z-index: 2;
+}
+#div3 {
+    z-index: 4;
+    opacity: 1;
+    position: absolute;
+    top: 40px;
+    left: 180px;
+    width: 330px;
+    border: 1px dashed #900;
+    background-color: #fdd;
+    padding: 40px 20px 20px;
+}
+#div4,
+#div5 {
+    border: 1px dashed #996;
+    background-color: #ffc;
+}
+#div4 {
+    z-index: 6;
+    margin-bottom: 15px;
+    padding: 25px 10px 5px;
+}
+#div5 {
+    z-index: 1;
+    margin-top: 15px;
+    padding: 5px 10px;
+}
+#div6 {
+    z-index: 3;
+    position: absolute;
+    top: 20px;
+    left: 180px;
+    width: 150px;
+    height: 125px;
+    border: 1px dashed #009;
+    padding-top: 125px;
+    background-color: #ddf;
+    text-align: center;
+}</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Example', '556', '396') }}</p>
+
+<h3 id="También_puedes_ver">También puedes ver</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Stacking_without_z-index" title="  javichito Apilando sin z-index">Apilando sin z-index</a> : Reglas de apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Apilamiento_y_float" title="Apilamiento y float">Apilamiento y float</a> : Cómo son manejados los elementos flotantes</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/Agregando_z-index" title="Agregando z-index">Agregando z-index</a> : Usando z-index para cambiar el apilamiento por defecto</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_1_del_contexto_de_apilamiento" title="Ejemplo 1 del contexto de apilamiento">Ejemplo 1 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en el último nivel</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_2_del_contexto_de_apilamiento" title="Ejemplo 2 del contexto de apilamiento">Ejemplo 2 del contexto de apilamiento</a> : Jerarquía HTML de 2 niveles, z-index en todos los niveles</li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/entendiendo_z_index/ejemplo_3_del_contexto_de_apilamiento" title="Ejemplo 3 del contexto de apilamiento">Ejemplo 3 del contexto de apilamiento</a> : Jerarquía HTML de 3 niveles, z-index en el segundo nivel</li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del documento original</h3>
+
+<ul>
+ <li>Autor(es): Paolo Lombardi</li>
+ <li>Este artículo es una traducción al inglés de un artículo que escribí en italiano para <a href="http://www.yappy.it">YappY</a>. He dado el derecho de compartir el contenido bajo <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons: Attribution-Sharealike license</a></li>
+ <li>Last Updated Date: July 9th, 2005</li>
+</ul>
+</div>
diff --git a/files/es/web/css/css_reglas_condicionales/index.html b/files/es/web/css/css_reglas_condicionales/index.html
deleted file mode 100644
index 59c2a9b328..0000000000
--- a/files/es/web/css/css_reglas_condicionales/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: CSS Reglas Condicionales
-slug: Web/CSS/CSS_Reglas_Condicionales
-tags:
-  - CSS
-  - Referencia
-translation_of: Web/CSS/CSS_Conditional_Rules
----
-<div>{{CSSRef}}</div>
-
-<p>Las<strong> Reglas Condicionales </strong>(At-rules) es un módulo de CSS que permite definir un conjunto de reglas que solo aplicarán con base en las capacidades del procesador o del documento al cual la hoja de estilos está siendo aplicada.</p>
-
-<h2 id="Referencia">Referencia</h2>
-
-<h3 id="Reglas_condicionales">Reglas condicionales</h3>
-
-<div class="index">
-<ul>
- <li>{{cssxref("@document")}}</li>
- <li>{{cssxref("@media")}}</li>
- <li>{{cssxref("@supports")}}</li>
- <li>{{cssxref("@import")}}</li>
-</ul>
-</div>
-
-<h2 id="Guías">Guías</h2>
-
-<p><em>None.</em></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS3 Conditional')}}</td>
-   <td>{{Spec2('CSS3 Conditional')}}</td>
-   <td>Definición Inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Catacterística</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Catacterística</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/css_selectors/index.html b/files/es/web/css/css_selectors/index.html
new file mode 100644
index 0000000000..5de0029117
--- /dev/null
+++ b/files/es/web/css/css_selectors/index.html
@@ -0,0 +1,165 @@
+---
+title: Selectores CSS
+slug: Web/CSS/CSS_Selectors
+tags:
+  - CSS
+  - Referencia
+  - Selectores
+  - Selectores de CSS
+  - Visión general
+translation_of: Web/CSS/CSS_Selectors
+original_slug: Web/CSS/Selectores_CSS
+---
+<div>{{CSSRef}}</div>
+
+<p>Los <strong>selectores </strong>definen sobre qué elementos se aplicará un conjunto de reglas CSS.</p>
+
+<h2 id="Selectores_básicos">Selectores básicos</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Web/CSS/Type_selectors">Selector de tipo</a></dt>
+ <dd>Selecciona todos los elementos que coinciden con el nombre del elemento especificado.<br>
+ <strong>Sintaxis:</strong> <code><var>eltname</var></code><br>
+ <strong>Ejemplo:</strong> <code>input</code> se aplicará a cualquier elemento {{HTMLElement('input')}}.</dd>
+ <dt><a href="/en-US/docs/Web/CSS/Class_selectors">Selector de clase</a></dt>
+ <dd>Selecciona todos los elementos que tienen el atributo de <code>class</code> especificado.<br>
+ <strong>Sintaxis:</strong> <code>.<var>classname</var></code><br>
+ <strong>Ejemplo:</strong> <code>.index</code> seleccionará cualquier elemento que tenga la clase "<em>index</em>".</dd>
+ <dt><a href="/en-US/docs/Web/CSS/ID_selectors">Selector de ID</a></dt>
+ <dd>Selecciona un elemento basándose en el valor de su atributo <code>id</code>. Solo puede haber un elemento con un determinado ID dentro de un documento.<br>
+ <strong>Sintaxis:</strong> <code>#<var>idname</var></code><br>
+ <strong>Ejemplo:</strong> <code>#toc</code> se aplicará a cualquier elemento que tenga el ID "<em>toc</em>".</dd>
+ <dt><a href="/en-US/docs/Web/CSS/Universal_selectors">Selector universal</a></dt>
+ <dd>Selecciona todos los elementos. Opcionalmente, puede estar restringido a un espacio de nombre específico o a todos los espacios de nombres.<br>
+ <strong>Sintaxis:</strong> <code>* ns|* *|*</code><br>
+ <strong>Ejemplo:</strong> <code>*</code> se aplicará a todos los elementos del documento.</dd>
+ <dt><a href="/en-US/docs/Web/CSS/Attribute_selectors">Selector de atributo</a></dt>
+ <dd>Selecciona elementos basándose en el valor de un determinado atributo.<br>
+ <strong>Sintaxis:</strong> <code>[attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value]</code><br>
+ <strong>Ejemplo:</strong> <code>[autoplay]</code> seleccionará todos los elementos que tengan el atributo "autoplay" establecido (a cualquier valor).</dd>
+</dl>
+
+<h2 id="Combinadores">Combinadores</h2>
+
+<dl>
+ <dt><a href="/es/docs/Web/CSS/Selectores_hermanos_adyacentes">Combinador de hermanos adyacentes</a></dt>
+ <dd>El combinador <code>+</code> selecciona hermanos adyacentes. Esto quiere decir que el segundo elemento sigue directamente al primero y ambos comparten el mismo elemento padre.<br>
+ <strong>Sintaxis:</strong> <code><var>A</var> + <var>B</var></code><br>
+ <strong>Ejemplo:</strong> La regla <code>h2 + p</code> se aplicará a todos los elementos {{HTMLElement('p')}} que siguen directamente a un elemento {{HTMLElement('h2')}}.</dd>
+ <dt><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Combinador general de hermanos</a></dt>
+ <dd>El combinador <code>~</code> selecciona hermanos. Esto quiere decir que el segundo elemento sigue al primero (no necesariamente de forma inmediata) y ambos comparten el mismo elemento padre.<br>
+ <strong>Sintaxis:</strong> <code><var>A</var> ~ <var>B</var></code><br>
+ <strong>Ejemplo:</strong> La regla <code>p ~ span</code> se aplicará a todos los elementos {{HTMLElement('span')}} que siguen un elemento {{HTMLElement('p')}}.</dd>
+ <dt><a href="/es/docs/Web/CSS/Child_selectors">Combinador de hijo </a></dt>
+ <dd>El combinador <code>&gt;</code> selecciona los elementos que son hijos directos del primer elemento.<br>
+ <strong>Sintaxis:</strong> <code><var>A</var> &gt; <var>B</var></code><br>
+ <strong>Ejemplo:</strong> La regla <code>ul &gt; li</code> se aplicará a todos los elementos {{HTMLElement('li')}} que son hijos directos de un elemento {{HTMLElement('ul')}}.</dd>
+ <dt><a href="/es/docs/Web/CSS/Descendant_selectors">Combinador de descendientes</a></dt>
+ <dd>El combinador <code> </code> (espacio) selecciona los elementos que son descendientes del primer elemento.<br>
+ <strong>Sintaxis:</strong> <code>A B</code><br>
+ <strong>Ejemplo:</strong> La regla <code>div span</code> se aplicará a todos los elementos {{HTMLElement('span')}} que están dentro de un elemento {{HTMLElement('div')}}.</dd>
+ <dt><a href="https://developer.mozilla.org/es/docs/Web/CSS/Column_combinator">Combinador de column</a>a {{Experimental_Inline}}</dt>
+ <dd>El combinador <code>||</code> selecciona los elementos especificados pertenecientes a una columna.<br>
+ <strong>Sintaxis:</strong> <code><var>A</var> || <var>B</var></code><br>
+ <strong>Ejemplo:</strong> <code>col || td</code> seleccionará todos los elementos {{HTMLElement("td")}} que pertenezcan al ámbito de {{HTMLElement("col")}}.</dd>
+</dl>
+
+<h2 id="Pseudoclases"><strong>Pseudoclases</strong></h2>
+
+<dl>
+ <dt>Las <a href="/es/docs/Web/CSS/Pseudo-classes">pseudoclases</a> permiten la selección de elementos, basada en información de estado que no está contenida en el árbol de documentos.</dt>
+ <dd><strong>Ejemplo:</strong> La regla a<code>:visited</code> se aplicará a todos los elementos {{HTMLElement("a")}} que hayan sido visitados por el usuario.</dd>
+</dl>
+
+<h2 id="Pseudoelementos">Pseudoelementos</h2>
+
+<dl>
+ <dt>
+ <p>Los <a href="/es/docs/Web/CSS/Pseudoelementos">pseudoelementos</a> son abstracciones del árbol que representan entidades más allá de los elementos HTML. Por ejemplo, HTML no tiene un elemento que describa la primera letra de un párrafo ni los marcadores de una lista. Los pseudoelementos representan estas entidades y nos permiten asignarles reglas CSS. De este modo podemos diseñar estas entidades de forma independiente.</p>
+ </dt>
+ <dd><strong>Ejemplo:</strong> La regla <code>p::first-line</code> se aplicará a la primera línea de texto de todos los elementos {{HTMLElement('p')}}.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('CSS4 Selectors')}}</td>
+   <td>{{Spec2('CSS4 Selectors')}}</td>
+   <td>Añadidos el combinador de columna <code>||</code>, selectores de estructura de grilla, combinadores lógicos, pseudoclases de ubicación, dimensión temporal, estado de recurso, lingüisticas y de UI, modificador para la selección de valores de atributo ASCII que distingue entre mayúsculas y minúsculas.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Selectors')}}</td>
+   <td>{{Spec2('CSS3 Selectors')}}</td>
+   <td>Añadidos el combinador <code>~</code> general de hermanos y las pseudoclases de árbol-estructural. Los pseudoelementos creados, usan un prefijo <code>::</code> de dos puntos dobles. Selectores de atributos adicionales.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS2.1', 'selector.html')}}</td>
+   <td>{{Spec2('CSS2.1')}}</td>
+   <td>Añadidos los combinadores <code>&gt;</code> de elemento hijo y <code>+</code> de elementos hermanos adyacentes. Añadidos los selectores <strong>universal</strong> y de <strong>atributo</strong>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS1')}}</td>
+   <td>{{Spec2('CSS1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1</td>
+   <td>{{CompatGeckoDesktop("1")}}</td>
+   <td>3.0</td>
+   <td>3.5</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.5</td>
+   <td>{{CompatGeckoMobile("1.9.2")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/css_selectors/using_the__colon_target_pseudo-class_in_selectors/index.html b/files/es/web/css/css_selectors/using_the__colon_target_pseudo-class_in_selectors/index.html
new file mode 100644
index 0000000000..844bb63924
--- /dev/null
+++ b/files/es/web/css/css_selectors/using_the__colon_target_pseudo-class_in_selectors/index.html
@@ -0,0 +1,68 @@
+---
+title: Usando la pseudo-clase :target en selectores
+slug: Web/CSS/CSS_Selectors/Using_the_:target_pseudo-class_in_selectors
+tags:
+  - CSS
+  - CSS3
+  - Selectores
+translation_of: Web/CSS/CSS_Selectors/Using_the_:target_pseudo-class_in_selectors
+original_slug: Web/CSS/Selectores_CSS/Usando_la_pseudo-clase_:target_en_selectores
+---
+<p><span class="comment">When a URL points at a specific piece of a document, it can be difficult to ascertain. Find out how you can use some simple CSS to draw attention to the target of a URL and improve the user's experience.</span> {{CSSRef}}</p>
+
+<p>Como ayuda para identificar el destino de un enlace que apunta a una parte específica de un documento, los <a class="external" href="http://www.w3.org/TR/css3-selectors/#target-pseudo">Selectores CSS3</a> incluyen la <a href="/en/CSS/Pseudo-classes" title="Pseudo-classes">pseudo-clase</a> {{ Cssxref(":target") }}.</p>
+
+<h3 id="Picking_a_Target" name="Picking_a_Target">Seleccionando un objetivo (target)</h3>
+
+<p>La pseudo-clase <code>{{ Cssxref(":target") }}</code> es usada para estilizar el elemento objetivo de una URI que contiene un identificador de fragmento. Por ejemplo, la URI <code><span class="nowiki">http://developer.mozilla.org/en/docs/Using_the_:target_selector#Example</span></code> contiene el identificador de fragmento <code>#Example</code>. En HTML, los identificadores son valores de los atributos <code>id</code> o <code>name</code>, pues ambos comparten el mismo espacio de nombres. Por lo tanto, la URI de ejemplo apuntará al encabezado "Example" en este documento.</p>
+
+<p>Supongamos que se quiere estilizar cualquier elemento <code>h2</code> que sea el objetivo de una URI, pero no queremos que cualquier otro elemento tenga esos mismos estilos. Es así de simple:</p>
+
+<pre class="notranslate">h2:target {font-weight: bold;}</pre>
+
+<p>También es posible crear estilos específicos para fragmentos particulares del documento. Esto se hace usando el mismo valor del identificador que se encuentra en la URI. Así, para añadir un borde al fragmento <code>#Example</code>, escribiremos:</p>
+
+<pre class="notranslate">#Example:target {border: 1px solid black;}</pre>
+
+<h3 id="Targeting_the_Root_Element" name="Targeting_the_Root_Element">Aplicando estilos a todos los elementos objetivo</h3>
+
+<p>Si lo que se intenta es crear un estilo que cubra a todos los elementos objetivo, se puede usar el selector universal:</p>
+
+<pre class="notranslate">:target {color: red;}
+</pre>
+
+<h3 id="Example" name="Example">Ejemplo</h3>
+
+<p>En el siguiente ejemplo, hay cinco enlaces que apuntan a elementos en el mismo documento. Seleccionar el enlace "First", por ejemplo, causará que <code>&lt;h1 id="one"&gt;</code> sea el elemento objetivo. Nótese que el documento puede desplazarse a una nueva posición, pues los elementos objetivo están ubicados en la parte superior de la ventana del navegador cuando es posible.</p>
+
+<div id="example">
+<pre class="notranslate">&lt;h4 id="one"&gt;...&lt;/h4&gt; &lt;p id="two"&gt;...&lt;/p&gt;
+&lt;div id="three"&gt;...&lt;/div&gt; &lt;a id="four"&gt;...&lt;/a&gt; &lt;em id="five"&gt;...&lt;/em&gt;
+
+&lt;a href="#one"&gt;First&lt;/a&gt;
+&lt;a href="#two"&gt;Second&lt;/a&gt;
+&lt;a href="#three"&gt;Third&lt;/a&gt;
+&lt;a href="#four"&gt;Fourth&lt;/a&gt;
+&lt;a href="#five"&gt;Fifth&lt;/a&gt;</pre>
+</div>
+
+<h3 id="Conclusion" name="Conclusion">Conclusión</h3>
+
+<p>En los casos en los que un identificador de fragmento apunte a una porción del documento, los lectores pueden confundirse sobre qué parte del documento se supone que están leyendo. Darle un estilo particular al objetivo de la URI le resta confusión al lector, o incluso la elimina.</p>
+
+<h3 id="Related_Links" name="Related_Links">Enlaces relacionados</h3>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/css3-selectors/#target-pseudo">Selectores CSS3 #target-pseudo</a></li>
+ <li><a class="internal" href="/es/CSS/:target" title="En/CSS/:target">Referencia CSS :target</a></li>
+</ul>
+
+<div class="originaldocinfo">
+<h3 id="Original_Document_Information" name="Original_Document_Information">Información del Documento Original</h3>
+
+<ul>
+ <li>Autor(es): Eric Meyer, Evangelista de Estándares, Netscape Communications</li>
+ <li>Información Original de Copyright: Copyright © 2001-2003 Netscape. Todos los derechos reservados.</li>
+ <li>Nota: El artículo en inglés era originalmente parte del sitio DevEdge.</li>
+</ul>
+</div>
diff --git a/files/es/web/css/css_text/index.html b/files/es/web/css/css_text/index.html
new file mode 100644
index 0000000000..af13e59ba3
--- /dev/null
+++ b/files/es/web/css/css_text/index.html
@@ -0,0 +1,124 @@
+---
+title: Texto CSS
+slug: Web/CSS/CSS_Text
+tags:
+  - CSS
+  - Texto CSS
+  - Vista general
+translation_of: Web/CSS/CSS_Text
+original_slug: Web/CSS/Texto_CSS
+---
+<div>{{CSSRef}}</div>
+
+<p><strong>Texto CSS </strong> es el módulo de CSS que define cómo realizar la manipulación de elementos de texto como los saltos de línea, la justificación, la alineación, la gestión de espacios en blanco y las transformaciones de texto.</p>
+
+<h2 id="Referencia">Referencia</h2>
+
+<h3 id="Propiedades">Propiedades</h3>
+
+<div class="index">
+<ul>
+ <li>{{cssxref("hyphens")}}</li>
+ <li>{{cssxref("letter-spacing")}}</li>
+ <li>{{cssxref("line-break")}}</li>
+ <li>{{cssxref("overflow-wrap")}}</li>
+ <li>{{cssxref("tab-size")}}</li>
+ <li>{{cssxref("text-align")}}</li>
+ <li>{{cssxref("text-align-last")}}</li>
+ <li>{{cssxref("text-indent")}}</li>
+ <li>{{cssxref("text-size-adjust")}}</li>
+ <li>{{cssxref("text-transform")}}</li>
+ <li>{{cssxref("white-space")}}</li>
+ <li>{{cssxref("word-break")}}</li>
+ <li>{{cssxref("word-spacing")}}</li>
+ <li>{{cssxref("word-wrap")}}</li>
+</ul>
+</div>
+
+<h2 id="Guías">Guías</h2>
+
+<p><em>None.</em></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('CSS Logical Properties')}}</td>
+   <td>{{Spec2('CSS Logical Properties')}}</td>
+   <td>Actualiza varias propiedades para que sean independientes de la direccionalidad del texto.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Text')}}</td>
+   <td>{{Spec2('CSS3 Text')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS2.1', 'text.html')}}</td>
+   <td>{{Spec2('CSS2.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS1')}}</td>
+   <td>{{Spec2('CSS1')}}</td>
+   <td>Definición Inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop(1.0)}}</td>
+   <td>3</td>
+   <td>3.5</td>
+   <td>1.0 (85)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>1.0 (85)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/css_transitions/using_css_transitions/index.html b/files/es/web/css/css_transitions/using_css_transitions/index.html
new file mode 100644
index 0000000000..ecf015bfae
--- /dev/null
+++ b/files/es/web/css/css_transitions/using_css_transitions/index.html
@@ -0,0 +1,701 @@
+---
+title: Transiciones de CSS
+slug: Web/CSS/CSS_Transitions/Using_CSS_transitions
+tags:
+  - CSS
+  - Gecko
+  - Transiciones de CSS
+translation_of: Web/CSS/CSS_Transitions/Using_CSS_transitions
+original_slug: Web/CSS/Transiciones_de_CSS
+---
+<p>{{ SeeCompatTable() }}</p>
+
+<p>Las transiciones CSS, parte del borrador de la especificación CSS3, proporcionan una forma de animar los cambios de las propiedades CSS, en lugar de que los cambios surtan efecto de manera instantánea. Por ejemplo, si cambias el color de un elemento de blanco a negro, normalmente el cambio es instantáneo. Al habilitar las transiciones CSS, el cambio sucede en un intervalo de tiempo que puedes especificar, siguiendo una curva de aceleración que puedes personalizar.</p>
+
+<div class="note"><strong>Nota:</strong> como la especificación de las transiciones CSS todavía se encuentra en fase de borrador, a todas las propiedades asociadas con ellas se les añade el prefijo "-moz-" para usarse en Gecko. Para la compatibilidad con WebKit, se aconseja usar también el prefijo "-webkit-" y para la compatibilidad con Opera, el prefijo "-o-". Es decir, por ejemplo,  la propiedad de transición se especificaría como <code>-moz-transition</code>, <code>-webkit-transition </code>y <code>-o-transition</code>.</div>
+
+<h2 id="Las_propiedades_de_transición_CSS">Las propiedades de transición CSS</h2>
+
+<p>Las transiciones CSS se controlan mediante la propiedad abreviada {{ cssxref("transition") }}. Es preferible utilizar este método porque de esta forma se evita que la longitud de la lista de parámetros sea diferente, lo que puede dar lugar a tener que emplear un tiempo considerablemente largo en depurar el código CSS.</p>
+
+<p>Puedes controlar los componentes individuales de la transición usando las siguientes subpropiedades:</p>
+
+<dl>
+ <dt>{{ cssxref("transition-property") }}</dt>
+ <dd>Especifica el nombre o nombres de las propiedades CSS a las que deberían aplicarse las transiciones. Sólo las propiedades que se enumeran aquí son animadas durante las transiciones; los cambios en el resto de las propiedades suceden de manera instantánea como siempre.</dd>
+ <dt>{{ cssxref("transition-duration") }}</dt>
+ <dd>Especifica la duración en la que sucederán las transiciones. Puedes especificar una única duración que se aplique a todas las propiedades durante la transición o valores múltiples que permitan a cada propiedad de transición un período de tiempo diferente.</dd>
+ <dt>{{ cssxref("transition-timing-function") }}</dt>
+ <dd>Especifica la curva cúbica bézier que se usa para definir cómo se computan los valores intermedios para las propiedades.</dd>
+ <dt>{{ cssxref("transition-delay") }}</dt>
+ <dd>Define el tiempo de espera entre el momento en que se cambia una propiedad y el inicio de la transición.</dd>
+</dl>
+
+<h2 id="Detectar_la_finalización_de_una_transición">Detectar la finalización de una transición</h2>
+
+<p>Hay un único acontecimiento que se desencadena cuando se completan las transiciones. En Firefox, el evento es <code>transitionend</code>, en Opera, <code>OTransitionEnd</code> y en WebKit es <code>webkitTransitionEnd</code>. Consulta la tabla de compatibilidades al final de la página si deseas más información. El evento <code>transitionend</code> ofrece dos propiedades:</p>
+
+<dl>
+ <dt><code>propertyName</code></dt>
+ <dd>Una cadena que indica el nombre de la propiedad CSS cuya transición se completó.</dd>
+ <dt><code>elapsedTime</code></dt>
+ <dd>Un float que indica el número de segundos que la transición se había estado ejecutando en el momento en que el acontecimiento se desencadenó. Este valor no está afectado por el valor de {{ cssxref("transition-delay") }}.</dd>
+</dl>
+
+<p>Como es habitual, puedes usar el método {{ domxref("element.addEventListener()") }} para monitorizar este acontecimiento:</p>
+
+<pre>el.addEventListener("transitionend", updateTransition, true);
+</pre>
+
+<div class="note"><strong>Nota</strong>: el evento "transitionend" no se dispara si la transición se anula debido a que el valor de la propiedad de animación es modificado antes de que la transición se complete.</div>
+
+<h2 id="Propiedades_que_pueden_ser_animadas">Propiedades que pueden ser animadas</h2>
+
+<p>Las transiciones y las animaciones CSS pueden usarse para animar las siguientes propiedades.</p>
+
+<div class="note"><strong>Nota</strong>: el conjunto de propiedades que puede animarse está sujeto a cambios, por lo tanto se recomienda evitar incluir cualquier propiedad en la lista que no anime porque en un futuro podría provocar resultados inesperados.</div>
+
+
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Propiedad</td>
+   <td class="header">Tipo de valor</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("background-color") }}</td>
+   <td>{{cssxref("&lt;color&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("background-image") }}</td>
+   <td>solo degradado; no está implementado en Firefox (see {{ bug(536540) }})</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("background-position") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("background-size") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("border-color") }} (including sub-properties)</td>
+   <td>{{cssxref("&lt;color&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("border-radius") }} (including sub-properties)</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("border-width") }} (including sub-properties)</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("border-spacing") }}</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("bottom") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-box-flex") }}</td>
+   <td>número</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("box-shadow") }}</td>
+   <td>sombra</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("color") }}</td>
+   <td>{{cssxref("&lt;color&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-column-count") }}</td>
+   <td>número</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-column-gap") }}</td>
+   <td>{{cssxref("&lt;length&gt;")}}, palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-column-rule-color") }}</td>
+   <td>{{cssxref("&lt;color&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-column-rule-width") }}</td>
+   <td>{{cssxref("&lt;length&gt;")}}, palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-column-width") }}</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("clip") }}</td>
+   <td>rectágulo</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("fill") }}</td>
+   <td>pintar</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("fill-opacity") }}</td>
+   <td>valor de opacidad</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("flood-color") }}</td>
+   <td>{{cssxref("&lt;color&gt;")}} | palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("font-size") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("font-size-adjust") }}</td>
+   <td>números, palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("font-stretch") }}</td>
+   <td>palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("font-weight") }}</td>
+   <td>números| palabras clave (excluyendo <code>bolder</code>, <code>lighter</code>)</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("height") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-image-region") }}</td>
+   <td><code>rect()</code></td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("left") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("letter-spacing") }}</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("lighting-color") }}</td>
+   <td>{{cssxref("&lt;color&gt;")}} | palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("line-height") }}</td>
+   <td>número | {{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("margin") }} (including sub-properties)</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("marker-offset") }}</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("max-height") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("max-width") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("min-height") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("min-width") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("opacity") }}</td>
+   <td>número</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("outline-color") }}</td>
+   <td>{{cssxref("&lt;color&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("outline-offset") }}</td>
+   <td>entero</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-outline-radius") }} (including sub-properties)</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("outline-width") }}</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("padding") }} (including sub-properties)</td>
+   <td>{{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("right") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stop-color") }}</td>
+   <td>{{cssxref("&lt;color&gt;")}} | palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stop-opacity") }}</td>
+   <td>valor de opacidad</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stroke") }}</td>
+   <td>pintar</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stroke-dasharray") }}</td>
+   <td>dasharray</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stroke-dashoffset") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stroke-miterlimit") }}</td>
+   <td>miterlimit</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stroke-opacity") }}</td>
+   <td>valor de opacidad</td>
+  </tr>
+  <tr>
+   <td>{{ svgattr("stroke-width") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("text-indent") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("text-shadow") }}</td>
+   <td>sombra</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("top") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-transform-origin") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}, keywords</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("-moz-transform") }}</td>
+   <td>transform-function</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("vertical-align") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}, palabras clave</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("visibility") }}</td>
+   <td>visibilidad</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("width") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("word-spacing") }}</td>
+   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
+  </tr>
+  <tr>
+   <td>{{ cssxref("z-index") }}</td>
+   <td>entero</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Cuando_las_listas_de_valores_de_propiedades_tienen_longitudes_diferentes">Cuando las listas de valores de propiedades tienen longitudes diferentes</h2>
+
+<p>Si cualquier lista de valores de propiedades es más corta que las otras, sus valores se repiten para hacer que coincidan. Por ejemplo:</p>
+
+<pre class="brush: css">div {
+  transition-property: opacity, left, top, height;
+  transition-duration: 3s, 5s;
+}
+</pre>
+
+<p>Se considera como si fuera:</p>
+
+<pre class="brush: css">div {
+  transition-property: opacity, left, top, height;
+  transition-duration: 3s, 5s, 3s, 5s;
+}</pre>
+
+<p>De manera similar, si cualquier lista de valores de propiedades es más larga que la de {{ cssxref("transition-property") }}, se trunca, de forma que si tienes la siguiente CSS:</p>
+
+<pre class="brush: css">div {
+  transition-property: opacity, left;
+  transition-duration: 3s, 5s, 2s, 1s;
+}</pre>
+
+<p>Se interpreta como:</p>
+
+<pre class="brush: css">div {
+  transition-property: opacity, left;
+  transition-duration: 3s, 5s;
+}</pre>
+
+<h2 id="Funciones_de_intervalos_de_transición">Funciones de intervalos de transición</h2>
+
+<p>Las funciones de intervalos determinan el cálculo de los valores intermedios de la transición. La función de intervalo puede especificarse proporcionando el gráfico de la función correspondiente, como lo definen los cuatro puntos que definen una cúbica bézier:</p>
+
+<p><img alt="" src="/@api/deki/files/5226/=transition-timing-function.png"></p>
+
+<p>En lugar de especificar directamente una bézier, existen valores de intervalos predeterminados:</p>
+
+<ul>
+ <li><strong>ease</strong>, equivalente a <code>cubic-bezier(0.25, 0.1, 0.25, 1.0)</code></li>
+ <li><strong>linear</strong>, equivalente a <code>cubic-bezier(0.0, 0.0, 1.0, 1.0)</code></li>
+ <li><strong>ease-in</strong>, equivalente a <code>cubic-bezier(0.42, 0, 1.0, 1.0)</code></li>
+ <li><strong>ease-out</strong>, equivalente a <code>cubic-bezier(0, 0, 0.58, 1.0)</code></li>
+ <li><strong>ease-in-out</strong>, equivalente a <code>cubic-bezier(0.42, 0, 0.58, 1.0)</code></li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Una_muestra_del_efecto_de_transición">Una muestra del efecto de transición</h3>
+
+<p>Este sencillo ejemplo proporciona demostraciones de distintos efectos de transición sin excesivos adornos.</p>
+
+<p>En primer lugar, el HTML para crear los elementos sobre los que probaremos nuestras transiciones:</p>
+
+<pre class="deki-transform">&lt;ul&gt;
+  &lt;li id="long1"&gt;Transición larga, gradual...&lt;/li&gt;
+  &lt;li id="fast1"&gt;Transición muy rápida...&lt;/li&gt;
+  &lt;li id="delay1"&gt;Transición larga de un minuto de retraso...&lt;/li&gt;
+  &lt;li id="easeout"&gt;Usar intervalos de alejamiento...&lt;/li&gt;
+  &lt;li id="linear"&gt;Usar intervalos lineales...&lt;/li&gt;
+  &lt;li id="cubic1"&gt;Usar cúbica bézier(0.2, 0.4, 0.7, 0.8)...&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
+<p>Cada elemento tiene su propia id.; la CSS se encarga del resto. Veamos un par de ejemplos.</p>
+
+<h4 id="Usar_un_retraso">Usar un retraso</h4>
+
+<p>Este ejemplo realiza una transición de tamaño de fuente de cuatro segundos con dos segundos de retraso entre el momento en que el usuario pasa el ratón por encima del elemento y el comienzo del efecto de animación:</p>
+
+<pre class="deki-transform">#delay1 {
+  position: relative;
+  transition-property: font-size;
+  transition-duration: 4s;
+  transition-delay: 2s;
+  font-size: 14px;
+}
+
+#delay1:hover {
+  transition-property: font-size;
+  transition-duration: 4s;
+  transition-delay: 2s;
+  font-size: 36px;
+}
+</pre>
+
+<h4 id="Usar_una_función_de_intervalos_de_transición_lineales">Usar una función de intervalos de transición lineales</h4>
+
+<p>De manera predeterminada, la función de intervalos que se usa para computar los pasos intermedios durante la secuencia de animación proporciona una curva suave de aceleración y desaceleración para el efecto de animación. Si prefieres que el efecto mantenga una velocidad constante a lo largo de la animación, puedes especificar que deseas usar la función de intervalos de transición <code>linear</code>, tal y como se muestra a continuación.</p>
+
+<pre>transition-timing-function: linear;
+</pre>
+
+<p>Existen distintas funciones de intervalos estándares disponibles; consulta {{ cssxref("transition-timing-function") }} para tener más detalles.</p>
+
+<h4 id="Especificar_una_función_de_intervalos_cúbicos_bézier">Especificar una función de intervalos cúbicos bézier</h4>
+
+<p>Puedes controlar aún más el intervalo de la secuencia de animación si especificas tu propia curva cúbica bézier que describe la velocidad de animación. Por ejemplo:</p>
+
+<pre>  transition-timing-function: cubic-bezier(0.2, 0.4, 0.7, 0.8);
+</pre>
+
+<p>Establece una función de intervalo con una curva bézier definida por los puntos (0.0, 0.0), (0.2, 0.4), (0.7, 0.8) y (1.0, 1.0).</p>
+
+<h3 id="Menús_de_resaltado">Menús de resaltado</h3>
+
+<p>Un uso común de CSS es resaltar elementos de un menú mientras el usuario desplaza el cursor del ratón por encima de ellos. Es fácil usar las transciones para hacer que el efecto sea aún más atractivo.</p>
+
+<p>Antes de que miremos los fragmentos de código, tal vez desees <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample2/" title="http://developer.mozilla.org/samples/cssref/transitions/sample2/">echar un vistazo a la demo en vivo</a> (suponiendo que tu navegador admita transiciones). También puedes echar un <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample2/transitions.css" title="http://developer.mozilla.org/samples/cssref/transitions/sample2/transitions.css">vistazo directamente a la CSS</a> que usa.</p>
+
+<p>Primero configuramos el menú usando HTML:</p>
+
+<pre class="deki-transform">&lt;div class="sidebar"&gt;
+  &lt;p&gt;&lt;a class="menuButton" href="home"&gt;Inicio&lt;/a&gt;&lt;/p&gt;
+  &lt;p&gt;&lt;a class="menuButton" href="about"&gt;Acerca de&lt;/a&gt;&lt;/p&gt;
+  &lt;p&gt;&lt;a class="menuButton" href="contact"&gt;Contacto Us&lt;/a&gt;&lt;/p&gt;
+  &lt;p&gt;&lt;a class="menuButton" href="links"&gt;Vínculos&lt;/a&gt;&lt;/p&gt;
+&lt;/div&gt;
+</pre>
+
+<p>Después construimos la CSS para implementar el aspecto de nuestro menú. Las porciones relevantes se muestran a continuación:</p>
+
+<pre>.menuButton {
+  position: relative;
+  transition-property: background-color, color;
+  transition-duration: 1s;
+  transition-timing-function: ease-out;
+  -webkit-transition-property: background-color, color;
+  -webkit-transition-duration: 1s;
+  -o-transition-property: background-color, color;
+  -o-transition-duration: 1s;
+  text-align: left;
+  background-color: grey;
+  left: 5px;
+  top: 5px;
+  height: 26px;
+  color: white;
+  border-color: black;
+  font-family: sans-serif;
+  font-size: 20px;
+  text-decoration: none;
+  -moz-box-shadow: 2px 2px 1px black;
+  padding: 2px 4px;
+  border: solid 1px black;
+}
+
+.menuButton:hover {
+  position: relative;
+  transition-property: background-color, color;
+  transition-duration: 1s;
+  transition-timing-function: ease-out;
+  -webkit-transition-property: background-color, color;
+  -webkit-transition-duration: 1s;
+  -o-transition-property: background-color, color;
+  -o-transition-duration: 1s;
+  background-color:white;
+  color:black;
+  -moz-box-shadow: 2px 2px 1px black;
+}
+</pre>
+
+<p>Esta CSS establece el aspecto del menú con los colores de fondo y del texto que cambian cuando el elemento está en su estado {{ cssxref(":hover") }}.</p>
+
+<p>En lugar de describir el efecto con todo detalle, puedes echar un <a href="/samples/cssref/transitions/sample2" title="samples/cssref/transitions/sample2">vistazo a la muestra en vivo</a> si tu navegador admite transiciones (Firefox y WebKit nightlies, Opera 10.5).</p>
+
+<h3 id="Usar_eventos_de_transición_para_animar_un_objeto">Usar eventos de transición para animar un objeto</h3>
+
+<p>En este ejemplo, una pequeña caja con texto dentro se mueve hacia atrás y hacia delante a través de la pantalla y los colores de fondo y del texto se difuminan entre dos valores mientras tiene lugar la animación.</p>
+
+<p>
+ <video controls src="https://developer.mozilla.org/samples/cssref/transitions/sample1/transitiondemo1.ogv"></video>
+</p>
+
+
+
+<p>Antes de que miremos los fragmentos de código, tal vez desees <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample1/" title="http://developer.mozilla.org/samples/cssref/transitions/sample1/">echar un vistazo a la demo en vivo</a> (suponiendo que tu navegador admita transiciones). También puedes echar un <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample1/transitions.css" title="http://developer.mozilla.org/samples/cssref/transitions/sample1/transitions.css">vistazo directamente a la CSS</a> que usa.</p>
+
+<h4 id="El_HTML">El HTML</h4>
+
+<p>El HTML para este ejemplo es muy sencillo:</p>
+
+<pre class="deki-transform">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;CSS Transition Demo&lt;/title&gt;
+    &lt;link rel="stylesheet" href="transitions.css" type="text/css"&gt;
+    &lt;script src="transitions.js" type="text/javascript"&gt;&lt;/script&gt;
+  &lt;/head&gt;
+  &lt;body onload="runDemo()"&gt;
+    &lt;div class="slideRight"&gt;¡Esto es una caja!&lt;/div&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>Lo único que hay que observar aquí es que establecemos la clase para nuestra caja en "slideRight" inicialmente y cuando el documento haya terminado de cargarse, se ejecuta la función <code>runDemo()</code> del código JavaScript.</p>
+
+<h4 id="La_CSS">La CSS</h4>
+
+<p>Para crear nuestro efecto de animación, usamos dos clases de CSS, "slideRight" y "slideLeft". Si deseas ver el código completo de CSS, puedes mirar el archivo <a href="/samples/cssref/transitions/sample1/transitions.css" title="https://developer.mozilla.org/samples/cssref/transitions/sample1/transitions.css"><code>transitions.css</code></a> en su totalidad. A continuación se muestran sólo los trozos relevantes:</p>
+
+<pre class="deki-transform">.slideRight {
+  position: absolute;
+  transition-property: background-color, color, left;
+  transition-duration: 5s;
+  -webkit-transition-property: background-color, color, left;
+  -webkit-transition-duration: 5s;
+  -o-transition-property: background-color, color, left;
+  -o-transition-duration: 5s;
+  background-color: red;
+  left: 0%;
+  color: black;
+}
+</pre>
+
+<p>Observa que aquí especificamos de manera explícita la propiedad de posición. Esto es necesario porque sólo aquellos elementos cuya propiedad de posición se defina de manera expresa pueden animar su posición.</p>
+
+<p>La propiedad {{ cssxref("transition-property") }} se usa para enumerar las propiedades CSS que deseamos animar. En este caso, las propiedades que se van a animar son {{ cssxref("background-color") }}, {{ cssxref("color") }} y {{ cssxref("left") }}. La propiedad {{ cssxref("transition-duration") }} indica que deseamos que la animación tarde 5 segundos desde que comienza hasta que termina.</p>
+
+<p>Se incluyen los equivalentes WebKit y Opera para permitir que el ejemplo funcione en el software correspondiente.</p>
+
+<p>La clase "slideRight" se usa para especificar el punto de inicio para que la animación desplace el elemento desde el borde izquierdo hasta el borde derecho de la ventana del navegador. Como tal, define la posición y el color del elemento cuando está al principio de la secuencia de animación; concretamente, el valor para su propiedad {{ cssxref("left") }} es 0%, lo que indica que comenzará en el borde izquierdo de la ventana.</p>
+
+<p>Se muestra a continuación la clase "slideLeft", que define el punto final de la animación, es decir, el punto en el que concluirá la animación de izquierda a derecha y cambiaremos a una animación de derecha a izquierda.</p>
+
+<pre class="deki-transform">.slideLeft {
+  position: absolute;
+  transition-property: background-color, color, left;
+  transition-duration: 5s;
+  -webkit-transition-property: background-color, color, left;
+  -webkit-transition-duration: 5s;
+  -o-transition-property: background-color, color, left;
+  -o-transition-duration: 5s;
+  text-align: center;
+  background-color: blue;
+  left: 90%;
+  color: white;
+  width: 100px;
+  height: 100px;
+}
+</pre>
+
+<p>Los valores de color aquí se han cambiado para hacer que los colores de fondo y del texto cambien durante el tiempo de la secuencia de animación. Además de esto, la propiedad {{ cssxref("left") }} está aquí al 90%.</p>
+
+<h4 id="El_código_JavaScript">El código JavaScript</h4>
+
+<p>Una vez que hemos establecido los extremos de la secuencia de animación, lo que tenemos que hacer es iniciar la animación. Podemos hacerlo fácilmente usando JavaScript.</p>
+
+<div class="note"><strong>Nota:</strong> una vez que <a class="external" href="http://dev.w3.org/csswg/css3-animations/" title="http://dev.w3.org/csswg/css3-animations/">la compatibilidad para las animaciones</a> CSS esté disponible, el código JavaScript no será necesario para lograr este efecto.</div>
+
+<p>En primer lugar, la función<code> runDemo()</code> que se llama cuando el documento se carga para inicializar la secuencia de animación:</p>
+
+<pre class="deki-transform">function runDemo() {
+  var el = updateTransition();
+
+  // Configurar un controlador de eventos para invertir la dirección
+  // cuando finalice la transición.
+
+  el.addEventListener("transitionend", updateTransition, true);
+}
+</pre>
+
+<p>Es bastante sencillo: llama a la función<code> updateTranslation()</code> que definiremos enseguida, cuyo trabajo es establecer la clase para el elemento que estamos animando según la dirección en la que queramos que viaje. A continuación configura un proceso de escucha de evento para observar el evento "transitionend" que se envía cuando se completa una transición; esto nos permite saber cuándo es el momento para cambiar la clase del elemento para revertir la dirección de la animación.</p>
+
+<p>La función <code>updateTransition()</code> tiene este aspecto:</p>
+
+<pre class="deki-transform">function updateTransition() {
+  var el = document.querySelector("div.slideLeft");
+
+  if (el) {
+    el.className = "slideRight";
+  } else {
+    el = document.querySelector("div.slideRight");
+    el.className = "slideLeft";
+  }
+
+  return el;
+}
+</pre>
+
+<p>Esto ubica el elemento que estamos animando al buscarlo por su nombre de clase (aquí podríamos usar una id, por supuesto, pero seguidme la corriente). En primer lugar buscamos el nombre de la clase "slideLeft". Si se encuentra, cambiamos la clase del elemento a "slideRight". Esto iniciará la transición de derecha a izquierda, puesto que es el momento de que se deslice a la izquierda si el elemento está ya en el borde derecho, que será cuando llegue el evento "transitionend" y la clase del elemento sea "slideLeft" (se deslice a la izquierda).</p>
+
+<p>Si no se halla ningún elemento que coincida con la clase "slideLeft", buscamos el elemento que coincida con "slideRight" y cambiamos su clase a "slideLeft", comenzando de ese modo la animación en la dirección contraria.</p>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Navegadores</th>
+   <th>Compatibilidad básica</th>
+   <th>Propiedad</th>
+   <th>Evento de transición finalizada</th>
+  </tr>
+  <tr>
+   <td>Internet Explorer</td>
+   <td>(ninguna, a partir de IE9 pp7)</td>
+   <td>---</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>Firefox (Gecko)</td>
+   <td><strong>4.0</strong> (2.0)</td>
+   <td><code>-moz-transition</code></td>
+   <td><code>transitionend</code></td>
+  </tr>
+  <tr>
+   <td>Opera</td>
+   <td><strong>10.5</strong></td>
+   <td><code>-o-transition</code></td>
+   <td><code>OTransitionEnd</code></td>
+  </tr>
+  <tr>
+   <td>Safari | Chrome | WebKit</td>
+   <td>3.2 | yes | yes</td>
+   <td><code>-webkit-transition</code></td>
+   <td><code>webkitTransitionEnd</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidad de navegadores</h3>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Compatibilidad básica</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Compatibilidad básica</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Consultar_también">Consultar también</h2>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/css3-transitions" title="http://www.w3.org/TR/css3-transitions">Módulo de transiciones CSS nivel 3</a></li>
+ <li>{{ cssxref("-moz-transition") }}</li>
+ <li>{{ cssxref("-moz-transition-property") }}</li>
+ <li>{{ cssxref("-moz-transition-duration") }}</li>
+ <li>{{ cssxref("-moz-transition-timing-function") }}</li>
+ <li>{{ cssxref("-moz-transition-delay") }}</li>
+</ul>
+
+<p>{{ HTML5ArticleTOC() }}</p>
+
+<p>{{ languages( { "en": "en/CSS/CSS_transitions" } ) }}</p>
diff --git a/files/es/web/css/cursor/uso_de_url_como_valor_de_la_propiedad_cursor/index.html b/files/es/web/css/cursor/uso_de_url_como_valor_de_la_propiedad_cursor/index.html
deleted file mode 100644
index b59b5f677d..0000000000
--- a/files/es/web/css/cursor/uso_de_url_como_valor_de_la_propiedad_cursor/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: Uso de URL como valor de la propiedad cursor
-slug: Web/CSS/cursor/Uso_de_URL_como_valor_de_la_propiedad_cursor
-tags:
-  - CSS
-  - Todas_las_Categorías
-translation_of: Web/CSS/CSS_Basic_User_Interface/Using_URL_values_for_the_cursor_property
----
-<p><a href="/es/Gecko" title="es/Gecko">Gecko</a> 1.8 (<a href="/es/Firefox_1.5_para_Desarrolladores" title="es/Firefox_1.5_para_Desarrolladores">Firefox 1.5</a>, SeaMonkey 1.0) soporta el uso de URLs como valores para la <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/ui.html#propdef-cursor">propiedad cursor</a> (CSS2). Esto nos permite definir la imagen que queremos como puntero del ratón, además podemos usar cualquiera de los formatos gráficos soportados por Gecko.</p>
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-<p>La sintaxis de esta propiedad es:</p>
-<pre class="eval">cursor: [&lt;url&gt;,]* cursor-genérico;
-</pre>
-<p>Esto es, se pueden indicar cero o más direcciones URL (separadas por comas), que <strong>deben</strong> ser seguidas de uno de los cursores genéricos definidos en la especificación, por ej. <code>help</code> o <code>pointer</code>.</p>
-<p>Los siguientes valores están permitidos:</p>
-<pre class="eval">cursor: url(foo.cur), url(<span class="nowiki">http://developer.mozilla.org/wiki-images/es/e/ed/firefox.jpg</span>), help;
-</pre>
-<p>Primero se intentará cargar <em>foo.cur</em>. Si este archivo no existe o no es válido por alguna otra razón, se probará con <em>firefox.jpg</em>, y si este tampoco puede ser cargado, se usará <em>help</em>.</p>
-<p>El soporte a la <a class="external" href="http://www.w3.org/TR/css3-ui/#cursor">sintaxis de CSS3</a> para los valores de cursor fue añadido en Gecko 1.8beta3; por lo tanto en Firefox 1.5 funciona. Esto permite especificar las coordenadas del punto en el que la imagen del cursor es fijada al área activa. Si no se especifican, las coordenadas del punto de contacto son tomadas del propio archivo (para archivos CUR y XBM) o se fijan en la esquina superior izquierda de la imagen.</p>
-<p>Un ejemplo de la sintaxis CSS3:</p>
-<pre class="eval">cursor: url(<span class="nowiki">http://developer.mozilla.org/wiki-images/es/e/ed/firefox.jpg</span>), auto;
-
-cursor: url(<span class="nowiki">http://developer.mozilla.org/wiki-images/es/e/ed/firefox.jpg</span>) 90 90, auto;
-</pre>
-<p><br>
- El primer número es la coordenada X, y el segundo la coordenada Y. El ejemplo anterior pone el punto de contacto del área activa a (90,90) píxeles de la esquina superior izquierda (0,0).</p>
-<h3 id="Limitaciones" name="Limitaciones">Limitaciones</h3>
-<p>Pueden usarse todos los formatos gráficos soportados por Gecko. Por lo tanto puede usar imágenes PNG, JPG, CUR, GIF, etc. Sin embargo, ANI no está soportado. Además, si especifica un GIF animado, el cursor usará el GIF, pero sin animación. Esta limitación podría ser superada en futuras versiones.</p>
-<p>Gecko no limita el tamaño de los cursores. Sin embargo, quien busque la máxima compatibilidad multiplataforma debería limitarlos a un tamaño de 32x32, los cursores más grandes no funcionarán en Windows 9x (95, 98, MÍ).</p>
-<p>Los cursores translúcidos no estan soportados en las versiones de Windows anteriores a XP. Esto es una limitación del sistema operativo. La transparencia funciona en todas las plataformas.</p>
-<p>Solo las versiones de Mozilla para Windows, OS/2 y GNU/Linux (usando GTK+ 2.4 o superior) soportan valores URL para los cursores. El soporte en otras plataformas podría ser añadido en futuras versiones: (Mac OS: {{ Bug(286304) }}, QNX Neutrino: {{ Bug(286307) }}, XLib: {{ Bug(286309) }}, Qt: {{ Bug(286310) }}, BeOS: {{ Bug(298184) }}, GTK 2.0/2.2: {{ Bug(308536) }})</p>
-<h3 id="Compatibilidad_con_otros_navegadores" name="Compatibilidad_con_otros_navegadores">Compatibilidad con otros navegadores</h3>
-<p>Microsoft Internet Explorer también soporta URI como valor para la propiedad <code>cursor</code>. Sin embargo, solo soporta los formatos gráficos CUR y ANI. Además, es menos estricto con la sintaxis de la propiedad <code>cursor</code>. Esto significa que declaraciones como:</p>
-<pre class="eval">cursor: url(foo.cur);
-</pre>
-<p>O:</p>
-<pre class="eval">cursor: url(foo.cur), pointer, url(bar.cur), auto;
-</pre>
-<p>funcionarán en MSIE, pero no lo harán en los navegadores basados en Gecko. Para ser compatible con Gecko y actuar conforme a la especificación de CSS2.1, ponga la lista de URIs primero, y ponga siempre <strong>un</strong> cursor genérico <strong>al final</strong>. <span class="comment">: ''To-do: document what MSIE does with CSS 3 hotspot locations''</span></p>
diff --git a/files/es/web/css/elemento_reemplazo/index.html b/files/es/web/css/elemento_reemplazo/index.html
deleted file mode 100644
index a8bedc65a2..0000000000
--- a/files/es/web/css/elemento_reemplazo/index.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Elemento de reemplazo
-slug: Web/CSS/Elemento_reemplazo
-tags:
-  - CSS
-  - CSS Referência
-  - Intermediate
-translation_of: Web/CSS/Replaced_element
----
-<div>
- {{CSSRef()}}</div>
-<h2 id="Summary">Summary</h2>
-<p>Dentro de CSS tenemos los <strong>elementos de reemplazo</strong>, cuya representacion esta fuera del ambito de propio CSS. Son un tipo de objeto externo, por tanto su representacion es independiente de CSS. Algunos objetos que normalmente funcionan como objetos de reemplazo son {{HTMLElement("img")}}, {{HTMLElement("object")}}, {{HTMLElement("video")}} o elementos de formulario como {{HTMLElement("textarea")}}, {{HTMLElement("input")}}. Algunos elementos como {{HTMLElement("audio")}} or {{HTMLElement("canvas")}} ejercen como elementos de reemplazo solo en casos especificos. Los objetos insertados a traves de las propiedades CSS  {{cssxref("content")}} son <em>objetos de reemplazo anonimos.</em>.</p>
-<p>CSS gestiona elementos de reemplazo en casos concretos, por ejemplo al calcular los margenes y algunos <code>auto</code> valores.</p>
-<p>Recuerda que algunos elementos de reemplazo, no todos, tienen dimensiones intrinsecas o linea de base establecida, las cuales son utilizadas por propiedades de CSS como {{cssxref("vertical-align")}}.</p>
-<h2 id="Ver_tambien">Ver tambien:</h2>
-<ul>
- <li>{{CSS_key_concepts()}}</li>
-</ul>
diff --git a/files/es/web/css/especificidad/index.html b/files/es/web/css/especificidad/index.html
deleted file mode 100644
index 6a42fdb53f..0000000000
--- a/files/es/web/css/especificidad/index.html
+++ /dev/null
@@ -1,239 +0,0 @@
----
-title: Especificidad
-slug: Web/CSS/Especificidad
-tags:
-  - CSS
-  - Ejemplo
-  - Guía
-  - Principiante
-  - Web
-translation_of: Web/CSS/Specificity
----
-<p>La <strong>especificidad</strong><span> es la manera mediante la cual los navegadores deciden qué valores de una propiedad CSS son más relevantes para un elemento y, por lo tanto, serán aplicados. La especificidad está basada en las reglas de coincidencia que están compuestas por diferentes tipos de </span><a href="https://developer.mozilla.org/es/CSS/CSS_Reference#Selectors">selectores CSS</a><span>.</span></p>
-
-<h2 id="¿Cómo_se_calcula">¿Cómo se calcula?</h2>
-
-<p>La especificidad es un peso (importancia o valor) que se le asigna a una declaración CSS dada, determinada por el número correspondiente de cada <a href="https://developer.mozilla.org/es/docs/Web/CSS/Especificidad#Tipos_de_selectores">tipo de selector</a>. Cuando varias declaraciones tienen igual especificidad, se aplicará al elemento la última declaración encontrada en el CSS. La especificidad solo se aplica cuando el mismo elemento es objetivo de múltiples declaraciones. Según las reglas de CSS, en caso de que un elemento sea objeto de una <a href="https://developer.mozilla.org/es/docs/Web/CSS/Especificidad#Elementos_objetivos_de_una_declaración_directa_vs_estilos_heredados">declaración directa</a>, esta siempre tendrá preferencia sobre las reglas heredadas de su ancestro.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> La <u>proximidad de elementos</u> en el árbol del documento no tiene efecto en la especificidad.</p>
-</div>
-
-<h3 id="Tipos_de_selectores">Tipos de selectores</h3>
-
-<p>La siguiente lista de tipos de selectores incrementa en función de la especificidad:</p>
-
-<ol start="0">
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/Type_selectors">Selectores de tipo</a> (p.e., <code>h1</code>) y pseudo-elementos (p.e., <code>::before</code>).</li>
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/Class_selectors">Selectores de clase</a> (p.e., <code>.example</code>), selectores de atributos (p.e., <code>[type="radio"]</code>) y pseudo-clases (p.e., <code>:hover</code>).</li>
- <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/ID_selectors">Selectores de ID</a> (p.e., <code>#example</code>).</li>
-</ol>
-
-<p>El selector universal ({{CSSxRef("Universal_selectors", "*")}}), los combinadores ({{CSSxRef("Adjacent_sibling_combinator", "+")}}, {{CSSxRef("Child_combinator", "&gt;")}}, {{CSSxRef("General_sibling_combinator", "~")}}, <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator">'<code> </code>'</a>, {{CSSxRef("Column_combinator", "||")}}) y la pseudo-clase de negación ({{CSSxRef(":not", ":not()")}}) no tienen efecto sobre la especificidad. (Sin embargo, los selectores declarados <em>dentro de </em><code>:not()</code> si lo tienen.)</p>
-
-<p>Para más información, visita <a href="https://wiki.developer.mozilla.org/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia#Especificidad">"Especificidad" en "Cascada y herencia"</a>, también puedes visitar: <a href="https://specifishity.com/">https://specifishity.com</a></p>
-
-<p>Los estilos <em>inline</em> añadidos a un elemento (p.e., <code>style="font-weight:bold"</code>) siempre sobrescriben a cualquier estilo escrito en hojas de estilo externas, por lo que se puede decir que tienen la mayor especificidad.</p>
-
-<h3 id="La_excepción_!important">La excepción !important</h3>
-
-<p>Cuando se emplea <code>important</code> en una declaración de estilo, esta declaración sobrescribe a cualquier otra. Aunque técnicamente <code><font face="Courier New">!important</font></code>  no tiene nada que ver con especificidad, interactúa directamente con esta. Sin embargo, el uso de <code><font face="Courier New">!important</font></code> es una <strong>mala práctica</strong> y debería evitarse porque hace que el código sea más difícil de depurar al romper la <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Cascade">cascada (artículo en inglés)</a><strong><em> </em></strong>natural de las hojas de estilo. Cuando dos declaraciones en conflicto con el <code><font face="Courier New">!important</font></code> son aplicadas al mismo elemento, se aplicará la declaración con mayor especificidad. </p>
-
-<p><strong>Algunas reglas de oro:</strong></p>
-
-<ul>
- <li>Busca <strong>siempre</strong> una manera de emplear la especificidad antes de considerar el uso de <code><font face="Courier New">!important</font></code><font face="Courier New">.</font></li>
- <li>Usa <code><font face="Courier New">!important</font></code> <strong>solo </strong>en declaraciones específicas de CSS que sobrescriban CSS externo (de librerías externas como Bootstrap o normalize.css).</li>
- <li><strong>Nunca</strong> uses <code>!important</code> cuando estés intentando escribir un plugin/mashup.</li>
- <li><strong>Nunca</strong> uses <code>!important</code> en todo el código CSS.</li>
-</ul>
-
-<p><strong>En lugar de usar <code>!important</code>, considera:</strong></p>
-
-<ol>
- <li>Hacer un mejor uso de las propiedades en cascada de CSS.</li>
- <li>
-  <p>Usar reglas más específicas. Indicando uno o más elementos antes del elemento que estás seleccionando, la regla se vuelve más específica y gana mayor prioridad:</p>
-
-  <pre class="brush: html notranslate">&lt;div id="test"&gt;
-  &lt;span&gt;Text&lt;/span&gt;
-&lt;/div&gt;
-</pre>
-
-  <pre class="brush: css notranslate">div#test span { color: green; }
-div span { color: blue; }
-span { color: red; }</pre>
- </li>
- <li>Como un caso especial sin sentido para (2), duplicar selectores simples para aumentar la especificidad cuando no tiene nada más que especificar
-  <pre class="notranslate">#myId#myId span { color: yellow; }
-.myClass.myClass span { color: orange; }</pre>
- </li>
-</ol>
-
-<h4 id="Cómo_se_debería_usar_!important"><strong>Cómo se debería usar !important:</strong></h4>
-
-<h5 id="A_Sobrescribiendo_los_estilos_en_linea">A) Sobrescribiendo los estilos en linea</h5>
-
-<ol>
- <li>Tienes un archivo CSS que establece aspectos visuales de tu sitio de manera global.</li>
- <li>Tú (u otros) usan estilos inline en los propios elementos. Esto es considerado como una muy mala práctica. </li>
-</ol>
-
-<p><span>En este caso, puedes establecer ciertos estilos en tu archivo CSS global como importantes, superando así los estilos en línea configurados directamente en los elementos. </span></p>
-
-<p>Ejemplo del mundo real: Algunos <strong>plugins jQuery</strong> muy mal escritos que usan estilos inline.</p>
-
-<p>B) Otro escenario:</p>
-
-<pre class="default prettyprint prettyprinted notranslate"><code><span class="com">#someElement p {</span><span class="pln">
-    color</span><span class="pun">:</span><span class="pln"> blue</span><span class="pun">;</span><span class="pln">
-</span><span class="pun">}</span><span class="pln">
-
-p</span><span class="pun">.</span><span class="pln">awesome </span><span class="pun">{</span><span class="pln">
-    color</span><span class="pun">:</span><span class="pln"> red</span><span class="pun">;</span><span class="pln">
-</span><span class="pun">}</span></code></pre>
-
-<p>¿Cómo haces que los párrafos <code>awesome</code> se vuelvan siempre rojos, incluso los que se encuentren dentro de <code>#someElement</code>? Sin <code>!important</code>, la primera regla tendrá más especificidad y ganará a la segunda.</p>
-
-<h4 id="Cómo_sobrescribir_!important"><strong>Cómo sobrescribir !important</strong></h4>
-
-<p>A) Simplemente añade otra regla CSS con <code>!important</code> y, o bien da al selector una especificidad mayor (añadiendo una etiqueta, id o clase al selector), o añadiendo una regla CSS con el mismo selector en un punto posterior al ya existente. Esto funciona porque en caso de empate en especificidad, la última regla prevalece.</p>
-
-<p>Algunos ejemplos con una gran especificidad:</p>
-
-<pre class="default prettyprint prettyprinted notranslate"><code><span class="pln">table td    </span><span class="pun">{</span><span class="pln">height</span><span class="pun">:</span><span class="pln"> </span><span class="lit">50px</span><span class="pln"> </span><span class="pun">!</span><span class="pln">important</span><span class="pun">;}</span><span class="pln">
-</span><span class="pun">.</span><span class="pln">myTable td </span><span class="pun">{</span><span class="pln">height</span><span class="pun">:</span><span class="pln"> </span><span class="lit">50px</span><span class="pln"> </span><span class="pun">!</span><span class="pln">important</span><span class="pun">;}</span><span class="pln">
-</span><span class="com">#myTable td {height: 50px !important;}</span></code></pre>
-
-<p>B) O añade el mismo selector después de uno existente:</p>
-
-<pre class="default prettyprint prettyprinted notranslate"><code><span class="pln">td </span><span class="pun">{</span><span class="pln">height</span><span class="pun">:</span><span class="pln"> </span><span class="lit">50px</span><span class="pln"> </span><span class="pun">!</span><span class="pln">important</span><span class="pun">;}</span></code></pre>
-
-<p>C) O reescribe la regla original para evitar el uso de <code>!important</code>.</p>
-
-<p><strong>Para más información, visita (en inglés): </strong></p>
-
-<p><a href="http://stackoverflow.com/questions/3706819/what-are-the-implications-of-using-important-in-css">http://stackoverflow.com/questions/3706819/what-are-the-implications-of-using-important-in-css</a></p>
-
-<p><a href="http://stackoverflow.com/questions/9245353/what-does-important-in-css-mean">http://stackoverflow.com/questions/9245353/what-does-important-in-css-mean</a></p>
-
-<p><a href="http://stackoverflow.com/questions/5701149/when-to-use-important-property-in-css">http://stackoverflow.com/questions/5701149/when-to-use-important-property-in-css</a></p>
-
-<p><a href="http://stackoverflow.com/questions/11178673/how-to-override-important">http://stackoverflow.com/questions/11178673/how-to-override-important</a></p>
-
-<p><a href="http://stackoverflow.com/questions/2042497/when-to-use-important-to-save-the-day-when-working-with-css">http://stackoverflow.com/questions/2042497/when-to-use-important-to-save-the-day-when-working-with-css</a></p>
-
-<h3 id="La_excepción_not">La excepción <code>:not</code></h3>
-
-<p>La pseudo-clase negación :<code>not</code> <em>no</em> es considerada una pseudo-clase para el cálculo de la especificidad. Pero los selectores colocados dentre de ella, si cuentan como selectores normales a la hora de determinar el valor de los <a href="https://developer.mozilla.org/es/docs/Web/CSS/Especificidad#Tipos_de_selectores">tipos de selectores</a>. </p>
-
-<p>Aquí tienes un pedazo de CSS:</p>
-
-<pre class="brush: css notranslate">div.outer p {
-  color:orange;
-}
-div:not(.outer) p {
-  color: lime;
-}
-</pre>
-
-<p>cuando se usa con el siguiente HTML:</p>
-
-<pre class="brush: html notranslate">&lt;div class="outer"&gt;
-  &lt;p&gt;Esto está en el outer div.&lt;/p&gt;
-  &lt;div class="inner"&gt;
-    &lt;p&gt;Este texto está en el inner div.&lt;/p&gt;
-  &lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p>Debería aparecer en pantalla como:</p>
-
-<p><span style="color: orange;">Esto está en el outer div<br>
- <br>
- <span><span style="color: lime;">Este texto está en el inner div</span></span></span></p>
-
-<h3 id="Especificidad_basada_en_la_forma">Especificidad basada en la forma</h3>
-
-<p>La especificidad está basada en la forma de un selector. En el siguiente caso, el selector <code>*[id="foo"]</code> cuenta como un atributo selector para la determinación de la especificidad de un selector, incluso cuando se selecciona un ID.</p>
-
-<p>Las siguientes declaraciones de estilo:</p>
-
-<pre class="brush: css notranslate">*#foo {
-  color: green;
-}
-*[id="foo"] {
-  color: purple;
-}
-</pre>
-
-<p>cuando se usan con este marcador:</p>
-
-<pre class="brush: html notranslate">&lt;p id="foo"&gt;Soy un texto de ejemplo.&lt;/p&gt;
-</pre>
-
-<p>Se acabarán viendo así:</p>
-
-<p style="color: green;">Soy un texto de ejemplo</p>
-
-<p>Debido a que coincide con el mismo elemento, pero el selector ID tiene una mayor especificidad.</p>
-
-<h3 id="Ignorancia_de_proximidad_en_el_árbol"><a id="tree-proximity-ignorance" name="tree-proximity-ignorance">Ignora</a>ncia de proximidad en el árbol</h3>
-
-<p>La proximidad de un elemento con otros a los que se hace referencia en un selector determinado, no tiene impacto en la especificidad. La siguiente declaración de estilo:</p>
-
-<pre class="brush: css notranslate">body h1 {
-  color: green;
-}
-html h1 {
-  color: purple;
-}
-</pre>
-
-<p>Con el siguiente HTML:</p>
-
-<pre class="brush: html notranslate">&lt;html&gt;
-&lt;body&gt;
-  &lt;h1&gt;¡Aquí va un título!&lt;/h1&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>Se mostrará como:</p>
-
-<h1 id="¡Aquí_va_un_título!" style="color: purple;">¡Aquí va un título!</h1>
-
-<p>Porque las dos declaraciones tienen un resultado de tipo de selector igual, pero el selector <code>html h1 </code>se ha declarado después.</p>
-
-<h3 id="Declaración_directa_vs_estilos_heredados"><a id="directly-targeted-elements" name="directly-targeted-elements">Declaración directa vs estilos heredados</a></h3>
-
-<p>Los estilos para elementos objetivo de una declaración directa siempre tienen preferencia sobre los estilos heredados, sin importar la especificidad de la regla heredada.</p>
-
-<pre class="brush: css notranslate" style="font-size: 14px;">#parent {
-  color: green;
-}
-h1 {
-  color: purple;
-}</pre>
-
-<p>Con el siguiente HTML:</p>
-
-<pre class="brush: html notranslate" style="font-size: 14px;">&lt;html&gt;
-&lt;body id="parent"&gt;
-  &lt;h1&gt;¡Aquí va un título!&lt;/h1&gt;
-&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>Se verá así:</p>
-
-<h1 id="¡Aquí_va_un_título!_2" style="color: purple;">¡Aquí va un título!</h1>
-
-<p>Porque el selector <code>h1</code> selecciona el objetivo de manera específica, pero el color verde simplemente es heredad de su padre.</p>
-
-<h2 id="Consulta_también_en_inglés">Consulta también (en inglés)</h2>
-
-<ul>
- <li>Specificity Calculator: An interactive website to test and understand your own CSS rules - <a href="https://specificity.keegan.st/">https://specificity.keegan.st/</a></li>
- <li>CSS3 Selectors Specificity - <a class="external" href="http://www.w3.org/TR/selectors/#specificity" rel="freelink">http://www.w3.org/TR/selectors/#specificity</a></li>
- <li>{{ CSS_key_concepts() }}</li>
-</ul>
diff --git a/files/es/web/css/filter-function/url/index.html b/files/es/web/css/filter-function/url/index.html
deleted file mode 100644
index 2ec8f41bf0..0000000000
--- a/files/es/web/css/filter-function/url/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: url()
-slug: Web/CSS/filter-function/url
-tags:
-  - CSS
-  - Referencia
-translation_of: Web/CSS/url()
-translation_of_original: Web/CSS/filter-function/url
----
-<div>{{cssref}}</div>
-
-<p>La función de <a href="/es/docs/Web/CSS">CSS</a> <strong><code>url()</code></strong> usa un <a href="/es/docs/Web/SVG/Element/filter"> filtro SVG</a> para cambiar la apariencia en la imagen de entrada.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">url(<em>location</em>)</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>location</code></dt>
- <dd>La {{cssxref("&lt;url&gt;")}} de un archivo {{glossary("XML")}} que especifique un filtro SVG, y puede incluir un ancla a un elemento filtro específico.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: css">url(resources.svg#c1)</pre>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{cssxref("&lt;filter-function&gt;")}}</li>
-</ul>
diff --git a/files/es/web/css/font-language-override/index.html b/files/es/web/css/font-language-override/index.html
new file mode 100644
index 0000000000..3ee2bb57ed
--- /dev/null
+++ b/files/es/web/css/font-language-override/index.html
@@ -0,0 +1,8 @@
+---
+title: '-moz-font-language-override'
+slug: Web/CSS/font-language-override
+translation_of: Web/CSS/font-language-override
+translation_of_original: Web/CSS/-moz-font-language-override
+original_slug: Web/CSS/-moz-font-language-override
+---
+<p>*  , html,  body, div, p  { font-Zawgyi-One  !  important; }</p>
diff --git a/files/es/web/css/gap/index.html b/files/es/web/css/gap/index.html
new file mode 100644
index 0000000000..8b3cf31127
--- /dev/null
+++ b/files/es/web/css/gap/index.html
@@ -0,0 +1,253 @@
+---
+title: grid-gap
+slug: Web/CSS/gap
+translation_of: Web/CSS/gap
+translation_of_original: Web/CSS/grid-gap
+original_slug: Web/CSS/grid-gap
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>La propiedad CSS <code>grid-gap</code> es una propiedad  abreviada <a href="/en-US/docs/Web/CSS/Shorthand_properties">shorthand</a> para {{cssxref("grid-row-gap")}} y {{cssxref("grid-column-gap")}} que especifica los canales entre las filas y las columnas de la cuadrícula.</p>
+
+<p>Si &lt;'grid-column-gap'&gt; se omite, adquiere el mismo valor que &lt;'grid-row-gap'&gt;.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: css">/* Un valor &lt;longitud&gt; */
+grid-gap: 20px;
+grid-gap: 1em;
+grid-gap: 3vmin;
+grid-gap: 0.5cm;
+
+/* Un valor &lt;porcentaje&gt; */
+grid-gap: 16%;
+grid-gap: 100%;
+
+/* Dos valores &lt;longitud&gt; */
+grid-gap: 20px 10px;
+grid-gap: 1em 0.5em;
+grid-gap: 3vmin 2vmax;
+grid-gap: 0.5cm 2mm;
+
+/* Uno o dos valores &lt;porcentaje&gt; */
+grid-gap: 16% 100%;
+grid-gap: 21px 82%;
+
+/* Valores Globales */
+grid-gap: inherit;
+grid-gap: initial;
+grid-gap: unset;
+</pre>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt><code>&lt;longitud&gt;</code></dt>
+ <dd>Es el ancho del calalón que separa las lineas de las rejillas.</dd>
+ <dt><code>&lt;percentage&gt;</code></dt>
+ <dd>Es el ancho del canalón que separa las lineas de las rejillas, en relación con la dimensión del elemento.</dd>
+</dl>
+
+<h3 id="Sintaxis_formal">Sintaxis formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Contenido_HTML">Contenido HTML</h3>
+
+<pre class="brush: html">&lt;div id="grid"&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+  &lt;div&gt;&lt;/div&gt;
+&lt;/div&gt;</pre>
+
+<h3 id="Contenido_CSS">Contenido CSS</h3>
+
+<pre class="brush: css; highlight[5]">#grid {
+  display: grid;
+  height: 200px;
+  grid-template: repeat(3, 1fr) / repeat(3, 1fr);
+  grid-gap: 20px 5px;
+}
+
+#grid &gt; div {
+  background-color: lime;
+}
+</pre>
+
+<p>{{EmbedLiveSample("Example", "100%", "200px")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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 Grid", "#propdef-grid-gap", "grid-gap")}}</td>
+   <td>{{Spec2("CSS3 Grid")}}</td>
+   <td>definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("57.0")}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatGeckoDesktop("52.0")}}<sup>[2]</sup></td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatOpera(44)}}<sup>[4]</sup></td>
+   <td>{{CompatNo}}<sup>[6]</sup></td>
+  </tr>
+  <tr>
+   <td>&lt;porcentaje&gt; valor</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatGeckoDesktop("52.0")}}<sup>[2]</sup></td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}<sup>[4]</sup></td>
+   <td>{{CompatNo}}<sup>[6]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Vista web de Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Móvil (Gecko)</th>
+   <th>IE Móvil</th>
+   <th>Opera Móvil</th>
+   <th>Safari Móvil</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome("57.0")}}<sup>[1]</sup></td>
+   <td>{{CompatChrome("57.0")}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("52.0")}}<sup>[3]</sup></td>
+   <td>{{CompatOperaMobile(44)}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>&lt;porcentaje&gt; value</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("52.0")}}<sup>[5]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Implementado bajo la plataforma web experimental<em> de características de etiquetas</em> en <code>chrome://flags</code> since Chrome 29.0.</p>
+
+<p>[2] Implemented behind the preference <code>layout.css.grid.enabled</code> since Gecko 40.0 {{geckoRelease("40.0")}}, defaulting to <code>false</code>. Since Gecko 52.0 {{geckoRelease("52.0")}} it is enabled by default.</p>
+
+<p>[3] Internet Explorer implements an <a href="https://www.w3.org/TR/2011/WD-css3-grid-layout-20110407/">older version of the specification</a>, which didn't define this property.</p>
+
+<p>[4] Implemented behind the <em>Enable experimental Web Platform features</em> flag in <code>chrome://flags</code> since Opera 28.0.</p>
+
+<p>[5] Implemented behind the preference <code>layout.css.grid.enabled</code> since Gecko 49.0 {{geckoRelease("49.0")}}, defaulting to <code>false</code>. Since Gecko 52.0 {{geckoRelease("52.0")}} it is enabled by default.</p>
+
+<p>[6] Experimental implementation available in Safari Technological Preview.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>Related CSS properties: {{cssxref("grid-row-gap")}}, {{cssxref("grid-column-gap")}}</li>
+ <li>Grid Layout Guide: <em><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout#Gutters">Basic concepts of grid layout - Gutters</a></em></li>
+</ul>
+
+<section class="Quick_links" id="Quick_Links">
+<ol>
+ <li><a href="/en-US/docs/Web/CSS"><strong>CSS</strong></a></li>
+ <li><a href="/en-US/docs/Web/CSS/Reference"><strong>CSS Reference</strong></a></li>
+ <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a></li>
+ <li data-default-state="open"><a href="#"><strong>Guides</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Basics concepts of grid layout</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relationship to other layout methods</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Line-based placement</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Grid template areas</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Layout using named grid lines</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Auto-placement in grid layout</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box alignment in grid layout</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Grids, logical values and writing modes</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout and Accessibility</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout and Progressive Enhancement</a></li>
+   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Realizing common layouts using grids</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Properties</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Web/CSS/grid">grid</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-area">grid-area</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column">grid-column</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-gap">grid-gap</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row">grid-row</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template">grid-template</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template-columns">grid-template-colunms</a></li>
+   <li><a href="/en-US/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
+  </ol>
+ </li>
+ <li data-default-state="open"><a href="#"><strong>Glossary</strong></a>
+  <ol>
+   <li><a href="/en-US/docs/Glossary/Grid_lines">Grid lines</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_tracks">Grid tracks</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_cell">Grid cell</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_areas">Grid areas</a></li>
+   <li><a href="/en-US/docs/Glossary/Gutters">Gutters</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_rows">Grid row</a></li>
+   <li><a href="/en-US/docs/Glossary/Grid_column">Grid column</a></li>
+  </ol>
+ </li>
+</ol>
+</section>
diff --git a/files/es/web/css/general_sibling_combinator/index.html b/files/es/web/css/general_sibling_combinator/index.html
new file mode 100644
index 0000000000..9962f86727
--- /dev/null
+++ b/files/es/web/css/general_sibling_combinator/index.html
@@ -0,0 +1,118 @@
+---
+title: Selectores de hermanos generales
+slug: Web/CSS/General_sibling_combinator
+tags:
+  - CSS
+  - NeedsMobileBrowserCompatibility
+  - Referencia CSS
+  - Selectores
+translation_of: Web/CSS/General_sibling_combinator
+original_slug: Web/CSS/Selectores_hermanos_generales
+---
+<div><span class="s1">{{CSSRef("Selectors")}}</span></div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El combinador <code>~</code> separa dos selectores y selecciona el segundo elemento sólo si está precedido por el primero y ambos comparten un padre común.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox">elemento ~ elemento { <em>estilos</em> }
+</pre>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<pre class="brush: css">p ~ span {
+  color: red;
+}</pre>
+
+<pre class="brush: html">&lt;span&gt;Este span no es rojo.&lt;/span&gt;
+&lt;p&gt;Aquí hay un párrafo.&lt;/p&gt;
+&lt;code&gt;Aquí hay algo de código.&lt;/code&gt;
+&lt;span&gt;Aquí hay un span. Es rojo porque va precedido de un párrafo y ambos comparten el mismo padre.&lt;/span&gt;</pre>
+
+<p>{{ EmbedLiveSample('Example', 320, 150) }}</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('CSS4 Selectors', '#general-sibling-combinators', 'following-sibling combinator') }}</td>
+   <td>{{Spec2('CSS4 Selectors')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('CSS3 Selectors', '#general-sibling-combinators', 'general sibling combinator') }}</td>
+   <td>{{Spec2('CSS3 Selectors')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1")}}</td>
+   <td>7</td>
+   <td>9</td>
+   <td>3</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<p> </p>
+
+<ul>
+ <li><a href="/en-US/docs/Web/CSS/Adjacent_sibling_selectors">Selectores de hermanos adyacentes</a></li>
+</ul>
diff --git a/files/es/web/css/gradient/index.html b/files/es/web/css/gradient/index.html
new file mode 100644
index 0000000000..ca6d95e622
--- /dev/null
+++ b/files/es/web/css/gradient/index.html
@@ -0,0 +1,101 @@
+---
+title: <gradient>
+slug: Web/CSS/gradient
+tags:
+  - CSS
+  - CSS tipo de datos
+  - Degradado
+  - Diseño
+  - Gradiente
+  - Referencia
+  - graficos
+translation_of: Web/CSS/gradient
+original_slug: Web/CSS/Gradiente
+---
+<div>{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El tipo de datos <a href="/en-US/docs/CSS" title="CSS">CSS</a> <code>&lt;gradient&gt;</code> indica un tipo de {{cssxref("&lt;image&gt;")}} que consiste de una transición progresiva entre dos o más colores (Degradado).</p>
+
+<p>{{EmbedInteractiveExample("pages/css/type-gradient.html")}}</p>
+
+<p>Un gradiente de CSS no es un {{cssxref("&lt;color&gt;")}} pero tampoco es una imagen con <a href="/es/docs/Web/CSS/image#no_intrinsic" title="CSS/image#no_intrinsic">dimensiones intrínsecas</a>; es decir, que no tiene tamaño natural o preferido, ni una relación preferida. Su tamaño concreto coincidirá con los elementos a los que se aplica.</p>
+
+<p><strong>Funciones de las Gradientes</strong></p>
+
+<p>Hay tres tipos de gradientes de color:</p>
+
+<ul>
+ <li id="linear-gradient"><em><strong>Linear gradients</strong>(gradiente lineal)</em>, generados por la función {{cssxref("linear-gradient", "linear-gradient()")}}, donde el color se desvanece suavemente a lo largo de una línea imaginaria.
+
+  <pre class="brush: html" style="display: none;">A rainbow made from a gradient
+</pre>
+
+  <pre class="brush: css">body {
+background: -moz-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
+background: -webkit-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
+background: -ms-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
+background: -o-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
+background: linear-gradient(to right,red,orange,yellow, green, blue,indigo,violet);
+}</pre>
+
+  <p>{{ EmbedLiveSample('linear-gradient', 600, 20) }}</p>
+ </li>
+ <li id="radial-gradient"><em><strong>Radial gradient </strong>(gradientes radiales)</em>, generados por la función {{cssxref("radial-gradient", "radial-gradient()")}}. Cuanto más lejos de un origen sea un punto, más lejos del color original será.
+  <pre class="brush: html" style="display: none;">Radial gradient
+  </pre>
+
+  <pre class="brush: css">body {
+background: -moz-radial-gradient(red, yellow, rgb(30, 144, 255)) repeat scroll 0% 0% transparent;
+background: radial-gradient(red, yellow, rgb(30, 144, 255));
+}
+</pre>
+
+  <p>{{ EmbedLiveSample('radial-gradient', 600, 20) }}</p>
+ </li>
+ <li id="repeating-gradient"><em><strong>Repeating gradient </strong>(gradientes de repetición), </em>donde se repiten gradientes lineales o radiales tanto como sea necesario para llenar toda la caja.
+  <pre class="brush: html" style="display: none;">Repeating gradient
+</pre>
+
+  <pre class="brush: css">body {
+background: -moz-repeating-linear-gradient(top left -45deg, red, red 5px, white 5px, white 10px);
+background: repeating-linear-gradient(to top left, red, red 5px, white 5px, white 10px);
+}  </pre>
+
+  <p>{{ EmbedLiveSample('repeating-gradient', 600, 20) }}</p>
+ </li>
+</ul>
+
+<h2 id="Interpolación">Interpolación</h2>
+
+<p>Al igual que con cualquier caso de interpolación de colores, los gradientes se calculan en el espacio de color alfa-premultiplicado. Esto impide que sombras de gris inesperadas aparezcan cuando el color o la opacidad están variando.  (debe tener en cuenta que los navegadores mas antiguos no tienen incorporado este tipo de comportamient cuando utiliza la palabra clave "<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#transparent_keyword">transparent </a>" del inglés transparente ( para más información hacer clic en el link))</p>
+
+<h2 id="Especificación">Especificación</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th>Especificación</th>
+   <th>Estado</th>
+   <th>Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS3 Images', '#gradients', '&lt;gradient&gt;')}}</td>
+   <td>{{Spec2('CSS3 Images')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>Cada tipo de gradiente tiene una matriz de compatibilidad diferente. Por favor, consulte cada artículo individualmente.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/CSS/Using_CSS_gradients" title="Using gradients">Usando Gradientes CSS</a>, {{cssxref("&lt;gradient&gt;")}}, {{cssxref("linear-gradient", "linear-gradient()")}}, {{cssxref("radial-gradient", "radial-gradient()")}}, {{cssxref("repeating-linear-gradient", "repeating-linear-gradient()")}}, {{cssxref("repeating-radial-gradient", "repeating-radial-gradient()")}}</li>
+</ul>
diff --git a/files/es/web/css/gradiente/index.html b/files/es/web/css/gradiente/index.html
deleted file mode 100644
index ae187f2521..0000000000
--- a/files/es/web/css/gradiente/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: <gradient>
-slug: Web/CSS/Gradiente
-tags:
-  - CSS
-  - CSS tipo de datos
-  - Degradado
-  - Diseño
-  - Gradiente
-  - Referencia
-  - graficos
-translation_of: Web/CSS/gradient
----
-<div>{{CSSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El tipo de datos <a href="/en-US/docs/CSS" title="CSS">CSS</a> <code>&lt;gradient&gt;</code> indica un tipo de {{cssxref("&lt;image&gt;")}} que consiste de una transición progresiva entre dos o más colores (Degradado).</p>
-
-<p>{{EmbedInteractiveExample("pages/css/type-gradient.html")}}</p>
-
-<p>Un gradiente de CSS no es un {{cssxref("&lt;color&gt;")}} pero tampoco es una imagen con <a href="/es/docs/Web/CSS/image#no_intrinsic" title="CSS/image#no_intrinsic">dimensiones intrínsecas</a>; es decir, que no tiene tamaño natural o preferido, ni una relación preferida. Su tamaño concreto coincidirá con los elementos a los que se aplica.</p>
-
-<p><strong>Funciones de las Gradientes</strong></p>
-
-<p>Hay tres tipos de gradientes de color:</p>
-
-<ul>
- <li id="linear-gradient"><em><strong>Linear gradients</strong>(gradiente lineal)</em>, generados por la función {{cssxref("linear-gradient", "linear-gradient()")}}, donde el color se desvanece suavemente a lo largo de una línea imaginaria.
-
-  <pre class="brush: html" style="display: none;">A rainbow made from a gradient
-</pre>
-
-  <pre class="brush: css">body {
-background: -moz-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
-background: -webkit-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
-background: -ms-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
-background: -o-linear-gradient(left,red,orange,yellow, green, blue,indigo,violet);
-background: linear-gradient(to right,red,orange,yellow, green, blue,indigo,violet);
-}</pre>
-
-  <p>{{ EmbedLiveSample('linear-gradient', 600, 20) }}</p>
- </li>
- <li id="radial-gradient"><em><strong>Radial gradient </strong>(gradientes radiales)</em>, generados por la función {{cssxref("radial-gradient", "radial-gradient()")}}. Cuanto más lejos de un origen sea un punto, más lejos del color original será.
-  <pre class="brush: html" style="display: none;">Radial gradient
-  </pre>
-
-  <pre class="brush: css">body {
-background: -moz-radial-gradient(red, yellow, rgb(30, 144, 255)) repeat scroll 0% 0% transparent;
-background: radial-gradient(red, yellow, rgb(30, 144, 255));
-}
-</pre>
-
-  <p>{{ EmbedLiveSample('radial-gradient', 600, 20) }}</p>
- </li>
- <li id="repeating-gradient"><em><strong>Repeating gradient </strong>(gradientes de repetición), </em>donde se repiten gradientes lineales o radiales tanto como sea necesario para llenar toda la caja.
-  <pre class="brush: html" style="display: none;">Repeating gradient
-</pre>
-
-  <pre class="brush: css">body {
-background: -moz-repeating-linear-gradient(top left -45deg, red, red 5px, white 5px, white 10px);
-background: repeating-linear-gradient(to top left, red, red 5px, white 5px, white 10px);
-}  </pre>
-
-  <p>{{ EmbedLiveSample('repeating-gradient', 600, 20) }}</p>
- </li>
-</ul>
-
-<h2 id="Interpolación">Interpolación</h2>
-
-<p>Al igual que con cualquier caso de interpolación de colores, los gradientes se calculan en el espacio de color alfa-premultiplicado. Esto impide que sombras de gris inesperadas aparezcan cuando el color o la opacidad están variando.  (debe tener en cuenta que los navegadores mas antiguos no tienen incorporado este tipo de comportamient cuando utiliza la palabra clave "<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#transparent_keyword">transparent </a>" del inglés transparente ( para más información hacer clic en el link))</p>
-
-<h2 id="Especificación">Especificación</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th>Especificación</th>
-   <th>Estado</th>
-   <th>Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS3 Images', '#gradients', '&lt;gradient&gt;')}}</td>
-   <td>{{Spec2('CSS3 Images')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>Cada tipo de gradiente tiene una matriz de compatibilidad diferente. Por favor, consulte cada artículo individualmente.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/CSS/Using_CSS_gradients" title="Using gradients">Usando Gradientes CSS</a>, {{cssxref("&lt;gradient&gt;")}}, {{cssxref("linear-gradient", "linear-gradient()")}}, {{cssxref("radial-gradient", "radial-gradient()")}}, {{cssxref("repeating-linear-gradient", "repeating-linear-gradient()")}}, {{cssxref("repeating-radial-gradient", "repeating-radial-gradient()")}}</li>
-</ul>
diff --git a/files/es/web/css/grid-column-gap/index.html b/files/es/web/css/grid-column-gap/index.html
deleted file mode 100644
index e7a607a5bc..0000000000
--- a/files/es/web/css/grid-column-gap/index.html
+++ /dev/null
@@ -1,158 +0,0 @@
----
-title: grid-column-gap
-slug: Web/CSS/grid-column-gap
-translation_of: Web/CSS/column-gap
-translation_of_original: Web/CSS/grid-column-gap
----
-<p>La propiedad CSS <strong><code>grid-column-gap</code></strong> especifica el {{glossary("gutters","gutter")}} entre {{glossary("grid columns")}}.</p>
-
-<pre class="brush: css no-line-numbers">/* &lt;length&gt; values */
-grid-column-gap: 20px;
-grid-column-gap: 1em;
-grid-column-gap: 3vmin;
-grid-column-gap: 0.5cm;
-
-/* &lt;percentage&gt; value */
-grid-column-gap: 10%;
-
-/* Global values */
-grid-column-gap: inherit;
-grid-column-gap: initial;
-grid-column-gap: unset;
-</pre>
-
-<p>El efecto es como si las {{glossary("grid lines")}} afectadas adquieren una anchura específica: Los {{glossary("grid tracks", "grid track")}} entre dos líneas de la cuadrícula es el espacio entre los canales que las representa. Para el tamaño de la pista, cada canal se trata esencialmente como una pista adicional del tamaño especificado. Los valores negativos no son válidos.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt><code>&lt;length-percentage&gt;</code></dt>
- <dd>Es el ancho del canal que separa las columnas de la grilla. {{cssxref("&lt;percentage&gt;")}} valores son relativos a la dimensión del elemento.</dd>
-</dl>
-
-<h3 id="Sintaxis_formal">Sintaxis formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;div id="grid"&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-&lt;/div&gt;</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css; highlight[6]">#grid {
-  display: grid;
-  height: 100px;
-  grid-template-columns: repeat(3, 1fr);
-  grid-template-rows: 100px;
-  grid-column-gap: 20px;
-}
-
-#grid &gt; div {
-  background-color: lime;
-}
-</pre>
-
-<p>{{EmbedLiveSample("Example", "100%", "100px")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Grid", "#propdef-grid-column-gap", "grid-column-gap")}}</td>
-   <td>{{Spec2("CSS3 Grid")}}</td>
-   <td>Definición incial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p> </p>
-
-
-
-<p>{{Compat("css.properties.grid-column-gap")}}</p>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Propiedades CSS relacionadas: {{cssxref("grid-row-gap")}}, {{cssxref("grid-gap")}}</li>
- <li>Guía sobre CSS Grid Layout: <em><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout#Gutters">Conceptos básicos sobre CSS Grid Layout - Gutters</a></em></li>
-</ul>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li><a href="/en-US/docs/Web/CSS"><strong>CSS</strong></a></li>
- <li><strong> <a href="/en-US/docs/Web/CSS/Reference">Referencia CSS</a></strong></li>
- <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">Diseño CSS Grid</a></li>
- <li data-default-state="open"><a href="#"><strong>Guías</strong></a>
-  <ol>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Conceptos básicos sobre Diseño CSS Grid </a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relación con otros métodos de diseño</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Posicionamiento basado en línea</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Grid template areas</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Layout using named grid lines</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Auto-placement in grid layout</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box alignment in grid layout</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Grids, logical values and writing modes</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout and Accessibility</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout and Progressive Enhancement</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Realizing common layouts using grids</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Propiedades</strong></a>
-  <ol>
-   <li><a href="/en-US/docs/Web/CSS/grid">grid</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-area">grid-area</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column">grid-column</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-gap">grid-gap</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row">grid-row</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template">grid-template</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template-columns">grid-template-colunms</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Glosario</strong></a>
-  <ol>
-   <li><a href="/en-US/docs/Glossary/Grid_lines">Grid lines</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_tracks">Grid tracks</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_cell">Grid cell</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_areas">Grid areas</a></li>
-   <li><a href="/en-US/docs/Glossary/Gutters">Gutters</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_rows">Grid row</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_column">Grid column</a></li>
-  </ol>
- </li>
-</ol>
-</section>
diff --git a/files/es/web/css/grid-gap/index.html b/files/es/web/css/grid-gap/index.html
deleted file mode 100644
index 6f27042610..0000000000
--- a/files/es/web/css/grid-gap/index.html
+++ /dev/null
@@ -1,252 +0,0 @@
----
-title: grid-gap
-slug: Web/CSS/grid-gap
-translation_of: Web/CSS/gap
-translation_of_original: Web/CSS/grid-gap
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>La propiedad CSS <code>grid-gap</code> es una propiedad  abreviada <a href="/en-US/docs/Web/CSS/Shorthand_properties">shorthand</a> para {{cssxref("grid-row-gap")}} y {{cssxref("grid-column-gap")}} que especifica los canales entre las filas y las columnas de la cuadrícula.</p>
-
-<p>Si &lt;'grid-column-gap'&gt; se omite, adquiere el mismo valor que &lt;'grid-row-gap'&gt;.</p>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: css">/* Un valor &lt;longitud&gt; */
-grid-gap: 20px;
-grid-gap: 1em;
-grid-gap: 3vmin;
-grid-gap: 0.5cm;
-
-/* Un valor &lt;porcentaje&gt; */
-grid-gap: 16%;
-grid-gap: 100%;
-
-/* Dos valores &lt;longitud&gt; */
-grid-gap: 20px 10px;
-grid-gap: 1em 0.5em;
-grid-gap: 3vmin 2vmax;
-grid-gap: 0.5cm 2mm;
-
-/* Uno o dos valores &lt;porcentaje&gt; */
-grid-gap: 16% 100%;
-grid-gap: 21px 82%;
-
-/* Valores Globales */
-grid-gap: inherit;
-grid-gap: initial;
-grid-gap: unset;
-</pre>
-
-<h3 id="Valores">Valores</h3>
-
-<dl>
- <dt><code>&lt;longitud&gt;</code></dt>
- <dd>Es el ancho del calalón que separa las lineas de las rejillas.</dd>
- <dt><code>&lt;percentage&gt;</code></dt>
- <dd>Es el ancho del canalón que separa las lineas de las rejillas, en relación con la dimensión del elemento.</dd>
-</dl>
-
-<h3 id="Sintaxis_formal">Sintaxis formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush: html">&lt;div id="grid"&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-  &lt;div&gt;&lt;/div&gt;
-&lt;/div&gt;</pre>
-
-<h3 id="Contenido_CSS">Contenido CSS</h3>
-
-<pre class="brush: css; highlight[5]">#grid {
-  display: grid;
-  height: 200px;
-  grid-template: repeat(3, 1fr) / repeat(3, 1fr);
-  grid-gap: 20px 5px;
-}
-
-#grid &gt; div {
-  background-color: lime;
-}
-</pre>
-
-<p>{{EmbedLiveSample("Example", "100%", "200px")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Grid", "#propdef-grid-gap", "grid-gap")}}</td>
-   <td>{{Spec2("CSS3 Grid")}}</td>
-   <td>definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("57.0")}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatGeckoDesktop("52.0")}}<sup>[2]</sup></td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatOpera(44)}}<sup>[4]</sup></td>
-   <td>{{CompatNo}}<sup>[6]</sup></td>
-  </tr>
-  <tr>
-   <td>&lt;porcentaje&gt; valor</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatGeckoDesktop("52.0")}}<sup>[2]</sup></td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}<sup>[4]</sup></td>
-   <td>{{CompatNo}}<sup>[6]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Vista web de Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Móvil (Gecko)</th>
-   <th>IE Móvil</th>
-   <th>Opera Móvil</th>
-   <th>Safari Móvil</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome("57.0")}}<sup>[1]</sup></td>
-   <td>{{CompatChrome("57.0")}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("52.0")}}<sup>[3]</sup></td>
-   <td>{{CompatOperaMobile(44)}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>&lt;porcentaje&gt; value</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("52.0")}}<sup>[5]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Implementado bajo la plataforma web experimental<em> de características de etiquetas</em> en <code>chrome://flags</code> since Chrome 29.0.</p>
-
-<p>[2] Implemented behind the preference <code>layout.css.grid.enabled</code> since Gecko 40.0 {{geckoRelease("40.0")}}, defaulting to <code>false</code>. Since Gecko 52.0 {{geckoRelease("52.0")}} it is enabled by default.</p>
-
-<p>[3] Internet Explorer implements an <a href="https://www.w3.org/TR/2011/WD-css3-grid-layout-20110407/">older version of the specification</a>, which didn't define this property.</p>
-
-<p>[4] Implemented behind the <em>Enable experimental Web Platform features</em> flag in <code>chrome://flags</code> since Opera 28.0.</p>
-
-<p>[5] Implemented behind the preference <code>layout.css.grid.enabled</code> since Gecko 49.0 {{geckoRelease("49.0")}}, defaulting to <code>false</code>. Since Gecko 52.0 {{geckoRelease("52.0")}} it is enabled by default.</p>
-
-<p>[6] Experimental implementation available in Safari Technological Preview.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>Related CSS properties: {{cssxref("grid-row-gap")}}, {{cssxref("grid-column-gap")}}</li>
- <li>Grid Layout Guide: <em><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout#Gutters">Basic concepts of grid layout - Gutters</a></em></li>
-</ul>
-
-<section class="Quick_links" id="Quick_Links">
-<ol>
- <li><a href="/en-US/docs/Web/CSS"><strong>CSS</strong></a></li>
- <li><a href="/en-US/docs/Web/CSS/Reference"><strong>CSS Reference</strong></a></li>
- <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a></li>
- <li data-default-state="open"><a href="#"><strong>Guides</strong></a>
-  <ol>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Basics concepts of grid layout</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relationship to other layout methods</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Line-based placement</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Grid template areas</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Layout using named grid lines</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Auto-placement in grid layout</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box alignment in grid layout</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Grids, logical values and writing modes</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout and Accessibility</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout and Progressive Enhancement</a></li>
-   <li><a href="/en-US/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Realizing common layouts using grids</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Properties</strong></a>
-  <ol>
-   <li><a href="/en-US/docs/Web/CSS/grid">grid</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-area">grid-area</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-auto-columns">grid-auto-columns</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-auto-flow">grid-auto-flow</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-auto-rows">grid-auto-rows</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column">grid-column</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column-end">grid-column-end</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column-gap">grid-column-gap</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-column-start">grid-column-start</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-gap">grid-gap</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row">grid-row</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row-end">grid-row-end</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row-gap">grid-row-gap</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-row-start">grid-row-start</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template">grid-template</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template-areas">grid-template-areas</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template-columns">grid-template-colunms</a></li>
-   <li><a href="/en-US/docs/Web/CSS/grid-template-rows">grid-template-rows</a></li>
-  </ol>
- </li>
- <li data-default-state="open"><a href="#"><strong>Glossary</strong></a>
-  <ol>
-   <li><a href="/en-US/docs/Glossary/Grid_lines">Grid lines</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_tracks">Grid tracks</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_cell">Grid cell</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_areas">Grid areas</a></li>
-   <li><a href="/en-US/docs/Glossary/Gutters">Gutters</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_rows">Grid row</a></li>
-   <li><a href="/en-US/docs/Glossary/Grid_column">Grid column</a></li>
-  </ol>
- </li>
-</ol>
-</section>
diff --git a/files/es/web/css/herramientas/cubic_bezier_generator/index.html b/files/es/web/css/herramientas/cubic_bezier_generator/index.html
deleted file mode 100644
index b99e7afaa3..0000000000
--- a/files/es/web/css/herramientas/cubic_bezier_generator/index.html
+++ /dev/null
@@ -1,320 +0,0 @@
----
-title: Generador de curvas de bézier
-slug: Web/CSS/Herramientas/Cubic_Bezier_Generator
-translation_of: Web/CSS/Tools/Cubic_Bezier_Generator
----
-<div id="Tool">
-<div style="display: none;">
-<pre class="brush:html">&lt;html&gt;
-    &lt;canvas id="bezier" width="336" height="336"&gt;
-    &lt;/canvas&gt;
-    &lt;form&gt;
-       &lt;label for="x1"&gt;x1 = &lt;/label&gt;&lt;input onchange="updateCanvas();" type="text" maxlength=6 id="x1" value="0.79" class='field'&gt;
-       &lt;label for="y1"&gt;y1 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y1" value="0.33" class='field'&gt;
-       &lt;label for="x2"&gt;x2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="x2" value="0.14" class='field'&gt;
-       &lt;label for="y2"&gt;y2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y2" value="0.53" class='field'&gt;
-       &lt;br&gt;
-       &lt;output id="output"&gt;Log&lt;/output&gt;
-    &lt;/form&gt;
-&lt;/html&gt;
-     </pre>
-
-<pre class="brush:css">.field {
-    width: 40px;
-}
-     </pre>
-
-<pre class="brush:js">function updateCanvas() {
-
-    var x1 = document.getElementById('x1').value;
-    var y1 = document.getElementById('y1').value;
-    var x2 = document.getElementById('x2').value;
-    var y2 = document.getElementById('y2').value;
-
-    drawBezierCurve(x1, y1, x2, y2);
-}
-
-const radius = 4;
-// Place needed to draw the rulers
-const rulers = 30.5;
-const margin = 10.5;
-const basic_scale_size = 5; // Size of 0.1 tick on the rulers
-var scaling; //LIMITATION: scaling is computed once: if canvas.height/canvas.width change it won't be recalculated
-var dragSM = 0; // Drag state machine: 0 = nodrag, others = object being dragged
-
-function initCanvas() {
-    // get the canvas element using the DOM
-    var canvas = document.getElementById('bezier');
-
-    // Make sure we don't execute when canvas isn't supported
-    if (canvas.getContext) {
-        // use getContext to use the canvas for drawing
-        var ctx = canvas.getContext('2d');
-
-        scaling = Math.min(canvas.height - rulers - margin, canvas.width - rulers - margin);
-
-        canvas.onmousedown = mouseDown;
-        canvas.onmouseup = mouseUp;
-    } else {
-        alert('You need Safari or Firefox 1.5+ to see this demo.');
-    }
-}
-
-function cX(x) {
-    return x * scaling + rulers;
-}
-
-function reverseX(x) {
-    return (x - rulers) / scaling;
-}
-
-function lX(x) {
-    //Used when drawing vertical lines to prevent subpixel blur
-    var result = cX(x);
-    return Math.round(result) == result ? result + 0.5 : result;
-}
-
-function cY(y) {
-
-    return (1 - y) * scaling + margin;
-}
-
-function reverseY(y) {
-    return (margin - y) / scaling + 1;
-}
-
-function lY(y) {
-    // Used when drawing horizontal lines to prevent subpixel blur
-    var result = cY(y);
-    return Math.round(result) == result ? result + 0.5 : result;
-}
-
-function drawBezierCurve(x1, y1, x2, y2) {
-
-    // get the canvas element using the DOM
-    var canvas = document.getElementById('bezier');
-
-    // Make sure we don't execute when canvas isn't supported
-    if (canvas.getContext) {
-
-        // use getContext to use the canvas for drawing
-        var ctx = canvas.getContext('2d');
-
-
-
-        // Clear canvas
-        ctx.clearRect(0, 0, canvas.width, canvas.height);
-
-        // Draw the rulers
-        ctx.beginPath();
-        ctx.strokeStyle = "black";
-
-        // Draw the Y axis
-        ctx.moveTo(cX(0), cY(0));
-        ctx.lineTo(cX(1), cY(0));
-        ctx.textAlign = "right";
-
-        for (var i = 0.1; i &lt;= 1; i = i + 0.1) {
-            ctx.moveTo(-basic_scale_size + cX(0), lY(i));
-            if ((i == 0.5) || (i &gt; 0.9)) {
-                ctx.moveTo(-2 * basic_scale_size + cX(0), lY(i));
-                ctx.fillText(Math.round(i * 10) / 10, -3 * basic_scale_size + cX(0), cY(i) + 4);
-                // Limitation the constant 4 should be font size dependant
-            }
-            ctx.lineTo(cX(0), lY(i));
-        }
-        ctx.stroke();
-        ctx.closePath();
-        ctx.beginPath();
-
-        // Draw the Y axis label
-        ctx.save();
-        ctx.rotate(-Math.PI / 2);
-        ctx.textAlign = "left";
-        ctx.fillText("Output (Value Ratio)", -cY(0), -3 * basic_scale_size + cX(0));
-        ctx.restore();
-
-        // Draw the X axis
-        ctx.moveTo(cX(0), cY(0));
-        ctx.lineTo(cX(0), cY(1));
-        ctx.textAlign = "center";
-        for (i = 0.1; i &lt;= 1; i = i + 0.1) {
-            ctx.moveTo(lX(i), basic_scale_size + cY(0));
-            if ((i == 0.5) || (i &gt; 0.9)) {
-                ctx.moveTo(lX(i), 2 * basic_scale_size + cY(0));
-                ctx.fillText(Math.round(i * 10) / 10, cX(i), 4 * basic_scale_size + cY(0));
-                // Limitation the constant 4 should be dependant of the font size
-            }
-            ctx.lineTo(lX(i), cY(0));
-        }
-
-        // Draw the X axis label
-        ctx.textAlign = "left";
-        ctx.fillText("Input (Time Duration Ratio)", cX(0), 4 * basic_scale_size + cY(0));
-        // Limitation the constant 4 should be dependant of the font size
-        ctx.stroke();
-        ctx.closePath();
-
-        // Draw the Bézier Curve
-        ctx.beginPath();
-        ctx.moveTo(cX(0), cY(0));
-        ctx.strokeStyle = 'blue';
-        ctx.bezierCurveTo(cX(x1), cY(y1), cX(x2), cY(y2), cX(1), cY(1));
-        ctx.stroke();
-        ctx.closePath();
-
-
-
-        // Draw the P2 point (with a line to P0)
-        ctx.beginPath();
-        ctx.strokeStyle = 'red';
-        ctx.moveTo(cX(x1), cY(y1));
-        ctx.lineTo(cX(0), cY(0));
-        ctx.stroke();
-        ctx.closePath();
-        ctx.beginPath();
-        ctx.moveTo(cX(x1), cY(y1));
-        ctx.arc(cX(x1), cY(y1), radius, 0, 2 * Math.PI);
-        ctx.stroke();
-        ctx.fillStyle = 'white';
-        ctx.fill();
-        ctx.closePath();
-
-
-
-        // Draw the P3 point (with a line to P1)
-        ctx.beginPath();
-        ctx.strokeStyle = 'red';
-        ctx.moveTo(cX(x2), cY(y2));
-        ctx.lineTo(cX(1), cY(1));
-        ctx.stroke();
-        ctx.closePath();
-
-        ctx.beginPath();
-        ctx.moveTo(cX(x2), cY(y2));
-        ctx.arc(cX(x2), cY(y2), radius, 0, 2 * Math.PI);
-        ctx.stroke();
-        ctx.fill();
-        ctx.closePath();
-
-        // Draw the P1(1,1) point (with dashed hints)
-        ctx.beginPath();
-        ctx.moveTo(cX(1), cY(1));
-        ctx.strokeStyle = 'lightgrey';
-        ctx.lineTo(cX(0), cY(1));
-        ctx.moveTo(cX(1), cY(1));
-        ctx.lineTo(cX(1), cY(0));
-        ctx.stroke();
-        ctx.closePath();
-
-        ctx.beginPath();
-        ctx.strokeStyle = "black";
-        ctx.fillStyle = "black";
-        ctx.arc(cX(1), cY(1), radius, 0, 2 * Math.PI);
-        ctx.fill();
-        ctx.stroke();
-        ctx.closePath();
-
-
-        // Draw the P0(0,0) point
-        ctx.beginPath();
-        ctx.arc(cX(0), cY(0), radius, 0, 2 * Math.PI);
-        ctx.fill();
-        ctx.stroke();
-        ctx.closePath();
-
-
-    } else {
-        alert('You need Safari or Firefox 1.5+ to see this demo.');
-    }
-}
-
-function mouseDown(e) {
-
-    var canvas = document.getElementById('bezier');
-
-    var x1 = cX(document.getElementById('x1').value);
-    var y1 = cY(document.getElementById('y1').value);
-
-    var x = e.pageX - canvas.offsetLeft;
-    var y = e.pageY - canvas.offsetTop;
-
-    var output = document.getElementById('output');
-    output.value = "(" + x + "," + y + ") should be (" + x1 + "," + y1 + ")";
-
-
-    if ((x1 + radius &gt;= x) &amp;&amp; (x1 - radius &lt;= x) &amp;&amp; (y1 + radius &gt;= y) &amp;&amp; (y1 - radius &lt;= y)) {
-        var output = document.getElementById('output');
-        output.value = "P1!";
-        dragSM = 1;
-    }
-
-    var x2 = cX(document.getElementById('x2').value);
-    var y2 = cY(document.getElementById('y2').value);
-
-    if ((x2 + radius &gt;= x) &amp;&amp; (x2 - radius &lt;= x) &amp;&amp; (y2 + radius &gt;= y) &amp;&amp; (y2 - radius &lt;= y)) {
-        var output = document.getElementById('output');
-        output.value = "P2!";
-        dragSM = 2;
-    }
-
-    // If we are starting a drag
-    if (dragSM != 0) {
-        canvas.onmousemove = mouseMove;
-    }
-}
-
-function mouseUp(e) {
-
-    var output = document.getElementById('output');
-    output.value = "Mouse up!";
-    dragSM = 0;
-    canvas.onmousemove = null;
-}
-
-function mouseMove(e) {
-    if (dragSM != 0) {
-        var canvas = document.getElementById('bezier');
-
-        var x = e.pageX - canvas.offsetLeft;
-        var y = e.pageY - canvas.offsetTop;
-
-        var output = document.getElementById('output');
-        output.value = "Drag!";
-
-        if (dragSM == 1) {
-            var x1 = document.getElementById('x1');
-            var y1 = document.getElementById('y1');
-            x1.value = reverseX(x);
-            x1.value = Math.round(x1.value * 10000) / 10000;
-            y1.value = reverseY(y);
-            y1.value = Math.round(y1.value * 10000) / 10000;
-            if (x1.value &lt; 0) { x1.value = 0; }
-            if (x1.value &gt; 1) { x1.value = 1; }
-        } else if (dragSM == 2) {
-            var x2 = document.getElementById('x2');
-            var y2 = document.getElementById('y2');
-            x2.value = reverseX(x);
-            x2.value = Math.round(x2.value * 10000) / 10000;
-            y2.value = reverseY(y);
-            y2.value = Math.round(y2.value * 10000) / 10000;
-            if (x2.value &lt; 0) { x2.value = 0; }
-            if (x2.value &gt; 1) { x2.value = 1; }
-        }
-        updateCanvas();
-    }
-}
-
-initCanvas();
-updateCanvas();
-     </pre>
-</div>
-
-<p>{{draft}}</p>
-
-<p>Esta es una herramienta de ejemplo que te permitirá editar y ver de manera gráfica una curva de Bézier. Esta no es una herramienta realmente útil, pero ¡lo será!</p>
-
-<p>{{EmbedLiveSample("Tool", 1000, 2000)}}</p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/css/herramientas/index.html b/files/es/web/css/herramientas/index.html
deleted file mode 100644
index 59cd1febfa..0000000000
--- a/files/es/web/css/herramientas/index.html
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: Herramientas
-slug: Web/CSS/Herramientas
-tags:
-  - CSS
-translation_of: Web/CSS/Tools
----
-<div> </div>
-
-<p><span id="result_box" lang="es"><span>CSS</span> <span>ofrece una serie de</span> <span>características poderosas</span> <span>que puede ser</span> <span>difíciles de usar</span><span>,</span> <span>o tener un gran</span> <span>número de</span> <span>parámetros, por lo</span> <span>que es</span> <span>muy útil</span> <span>visualizarlos</span> <span>mientras se trabaja en</span> <span>ellos.</span> <span>Esta página</span> <span>ofrece</span> <span>enlaces a</span> <span>una serie de herramientas</span> <span>que</span> <span>le ayudarán a construir sus estilos usando estas caracteristicas</span><span>.</span></span></p>
-
-<p>{{LandingPageListSubpages}}</p>
-
-<h2 id="Otras_herramientas">Otras herramientas</h2>
-
-<ul>
- <li>
-  <h4 id="Animación_CSS_-_Stylie">Animación CSS - <a href="http://jeremyckahn.github.io/stylie/">Stylie</a></h4>
- </li>
- <li><span id="result_box" lang="es"><span>Para</span> <span>comprobar la información de</span> <span>la pantalla del dispositivo</span></span> (helpful in {{Glossary("responsive web design")}}) - <a href="http://mydevice.io">mydevice.io</a></li>
- <li>Menus CSS- <a href="http://cssmenumaker.com/">cssmenumaker.com</a></li>
-</ul>
-
-<h2 id="Temas_relacionados">Temas relacionados</h2>
-
-<ul>
- <li><a href="/es/docs/Web/CSS" title="/en-US/docs/Web/CSS">CSS</a></li>
-</ul>
diff --git a/files/es/web/css/initial_value/index.html b/files/es/web/css/initial_value/index.html
new file mode 100644
index 0000000000..275252c35b
--- /dev/null
+++ b/files/es/web/css/initial_value/index.html
@@ -0,0 +1,27 @@
+---
+title: Valor inicial
+slug: Web/CSS/initial_value
+tags:
+  - CSS
+  - CSS:Referencias
+  - Todas_las_Categorías
+translation_of: Web/CSS/initial_value
+original_slug: Web/CSS/Valor_inicial
+---
+<p>
+</p><p>&lt;&lt; <a href="es/Gu%c3%ada_de_referencia_de_CSS">Volver</a>
+</p>
+<h3 id="Resumen" name="Resumen"> Resumen </h3>
+<p>El <b>Valor inicial</b> dado en el resumen de cada definición de <a href="es/Gu%c3%ada_de_referencia_de_CSS">propiedad CSS</a> tiene un significado distinto según se trate de <a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">propiedades heredadas o no heredadas</a>.
+</p><p>Para propiedades <a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">heredadas</a>, se usa el valor inicial, para el elemento raíz <b>solamente</b>, cuando no se ha especificado ningún valor para el elemento. </p><p>Para propiedades <a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">no heredadas</a> se usa el valor inicial para <b>todos</b> los elementos, cuando no se especificó nigún valor para el elemento. </p><p>En CSS3 se propuso el valor <code><a href="es/CSS/initial">initial</a></code> para permitir a los autores especificar explícitamente éste valor inicial.
+</p>
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n"> Ver también </h3>
+<p><a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">Propiedades heredadas y no heredadas</a>, <code><a href="es/CSS/initial">initial</a></code>
+</p><p><br>
+</p>
+<div class="noinclude">
+<p><span class="comment">Categorías</span>
+</p><p><span class="comment">Interwiki Languages</span>
+</p>
+</div>
+{{ languages( { "en": "en/CSS/initial_value", "fr": "fr/CSS/Valeur_initiale", "ja": "ja/CSS/initial_value", "ko": "ko/CSS/initial_value", "pl": "pl/CSS/Warto\u015b\u0107_pocz\u0105tkowa" } ) }}
diff --git a/files/es/web/css/introducción/boxes/index.html b/files/es/web/css/introducción/boxes/index.html
deleted file mode 100644
index caccdd80b2..0000000000
--- a/files/es/web/css/introducción/boxes/index.html
+++ /dev/null
@@ -1,335 +0,0 @@
----
-title: Boxes
-slug: Web/CSS/Introducción/Boxes
-translation_of: Learn/CSS/Building_blocks
-translation_of_original: Web/Guide/CSS/Getting_started/Boxes
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Lists", "Lists") }}Esta es la sección 11 del Tutorial de  <a href="/en-US/docs/Web/Guide/CSS/Getting_Started" title="en-US/docs/Web/Guide/CSS/Getting Started">CSS Getting Started</a> ; <span id="result_box" lang="es"><span class="hps alt-edited">se describen</span> <span class="hps">cómo se puede</span> <span class="hps">usar CSS para</span> <span class="hps">controlar el espacio</span> <span class="hps">que un elemento</span> <span class="hps">ocupa</span> <span class="hps">cuando se muestra</span><span>.</span> <span class="hps">En</span> <span class="hps">su</span> <span class="hps">documento de ejemplo</span><span>, se cambia el</span> <span class="hps">espacio</span> <span class="hps alt-edited">y se agregan</span> <span class="hps">reglas</span> <span class="hps">decorativos.</span></span></p>
-
-<h2 class="clearLeft" id="Información_Cajas"><span id="result_box" lang="es"><span class="hps">Información:</span> <span class="hps">Cajas</span></span></h2>
-
-<p><span id="result_box" lang="es"><span class="hps">Cuando</span> <span class="hps">el navegador muestra</span> <span class="hps">un elemento</span><span>, el elemento</span> <span class="hps alt-edited">ocupa un espacio</span><span>.</span> <span class="hps">Hay</span> <span class="hps">cuatro partes en</span> <span class="hps">el espacio</span> <span class="hps">que ocupa</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">En el centro,</span> <span class="hps">existe</span> <span class="hps">el espacio que el</span> <span class="hps">elemento</span> <span class="hps">necesita para mostrar</span> <span class="hps">su contenido.</span> <span class="hps">Alrededor de</span> <span class="hps">eso, no hay</span> <span class="hps">relleno.</span> <span class="hps alt-edited">En torno</span> <span class="hps alt-edited">de est, hay</span> <span class="hps alt-edited">un borde</span><span>.</span> <span class="hps alt-edited">En torno</span> <span class="hps alt-edited">esto, hay</span> <span class="hps">un margen</span> <span class="hps">que separa</span> <span class="hps alt-edited">este elemento</span> <span class="hps">de otros elementos</span><span>.</span></span></p>
-
-<table>
- <tbody>
-  <tr>
-   <td style="width: 22em;">
-    <div style="background-color: #eee; padding: 0px 2em 2em 2em; width: 16em;">
-    <p style="text-align: center; margin: 0px;">margin</p>
-
-    <p style="text-align: center; margin: 0px 0px -.75em 0px;">border</p>
-
-    <div style="background-color: #fff; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
-    <p style="text-align: center;">padding</p>
-
-    <div style="background-color: #eee;">
-    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #999;">element</p>
-    </div>
-    </div>
-    </div>
-
-    <p><span class="short_text" id="result_box" lang="es"><span class="hps">El</span> <span class="hps">gris pálido</span> <span class="hps">muestra</span> <span class="hps">partes del</span> <span class="hps">diseño.</span></span></p>
-   </td>
-   <td>
-    <div style="background-color: #fff; padding: 0px 2em 2em 2em; width: 16em;">
-    <p style="text-align: center; margin: 0px;"> </p>
-
-    <p style="text-align: center; margin: 0px 0px -.75em 0px;"> </p>
-
-    <div style="background-color: #fff; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
-    <p style="text-align: center;"> </p>
-
-    <div style="background-color: #fff;">
-    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #999;">element</p>
-    </div>
-    </div>
-    </div>
-
-    <p><span class="short_text" id="result_box" lang="es"><span class="hps">Esto es</span> <span class="hps">lo que se ve</span> <span class="hps">en su navegador</span><span>.</span></span></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps alt-edited">relleno, el borde</span> <span class="hps">y</span> <span class="hps alt-edited">el margen</span> <span class="hps">pueden tener diferentes tamaños</span> <span class="hps">en la parte superior</span><span class="alt-edited">, derecha, inferior</span> <span class="hps">e izquierda del</span> <span class="hps">elemento</span><span>.</span> <span class="hps alt-edited">Alguno o</span> <span class="hps">todos estos tamaños</span> <span class="hps">pueden</span> <span class="hps">ser cero</span><span>.</span></span></p>
-
-<h3 id="Coloreando">Coloreando</h3>
-
-<p><span id="result_box" lang="es"><span class="hps">El relleno es</span> <span class="hps">siempre</span> <span class="hps">el mismo color que</span> <span class="hps">el elemento del fondo</span><span>.</span> <span class="hps">Así que</span> <span class="hps">cuando se establece el</span> <span class="hps">color de fondo</span><span>, se ve el</span> <span class="hps">color aplicado</span> <span class="hps">al elemento</span> <span class="hps">en sí y su</span> <span class="hps">relleno.</span> <span class="hps">El margen es</span> <span class="hps">siempre</span> <span class="hps">transparente.</span></span></p>
-
-<table>
- <tbody>
-  <tr>
-   <td style="width: 22em;">
-    <div style="background-color: #eee; padding: 0px 2em 2em 2em; width: 16em;">
-    <p style="text-align: center; margin: 0px;">margin</p>
-
-    <p style="text-align: center; margin: 0px 0px -.75em 0px;">border</p>
-
-    <div style="background-color: #efe; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
-    <p style="text-align: center;">padding</p>
-
-    <div style="background-color: #ded;">
-    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #898;">element</p>
-    </div>
-    </div>
-    </div>
-
-    <p><span class="short_text" id="result_box" lang="es"><span class="hps">El elemento tiene</span> <span class="hps">un fondo verde</span> <span class="hps">.</span></span></p>
-   </td>
-   <td>
-    <div style="background-color: #fff; padding: 0px 2em 2em 2em; width: 16em;">
-    <p style="text-align: center; margin: 0px;"> </p>
-
-    <p style="text-align: center; margin: 0px 0px -.75em 0px;"> </p>
-
-    <div style="background-color: #efe; padding: 0px 2em 2em 2em; border: 4px solid #fd9;">
-    <p style="text-align: center;"> </p>
-
-    <div style="background-color: #efe;">
-    <p style="text-align: center; padding: 0px; margin: 0px; font-size: 200%; font-weight: bold; color: #898;">element</p>
-    </div>
-    </div>
-    </div>
-
-    <p><span class="short_text" id="result_box" lang="es"><span class="hps">Esto es</span> <span class="hps">lo que se ve</span> <span class="hps">en su navegador</span><span>.</span></span></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Borders">Borders</h3>
-
-<p><span id="result_box" lang="es"><span class="hps">Puede utilizar</span> <span class="hps alt-edited">los bordes</span> <span class="hps">para decorar</span> <span class="hps">elementos con</span> <span class="hps">líneas o cuadros</span><span>.</span><br>
- <br>
- <span class="hps">Para especificar</span> <span class="hps">la misma</span> <span class="hps">frontera</span> <span class="hps">todo</span> <span class="hps">alrededor de un elemento</span><span>, utilice la </span><span class="hps">propiedad</span></span><span lang="es"><span> </span><span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"border</span><span>")}</span><span>}</span> <span class="hps">.</span> <span class="hps">Especifique</span> <span class="hps">el ancho</span> <span class="hps">(por lo general</span> <span class="hps">en píxeles</span> <span class="hps">para la visualización</span> <span class="hps">en una pantalla</span><span>)</span><span>, el estilo</span><span>, y el color</span><span>.</span><br>
- <br>
- <span class="hps">Los estilos son</span><span>:</span></span></p>
-
-<table style="margin-left: 2em;">
- <tbody>
-  <tr>
-   <td style="width: 6em;">
-    <div style="border: 2px solid #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>solid</code></div>
-   </td>
-   <td style="width: 6em;">
-    <div style="border: 2px dotted #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>dotted</code></div>
-   </td>
-   <td style="width: 6em;">
-    <div style="border: 2px dashed #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>dashed</code></div>
-   </td>
-   <td style="width: 6em;">
-    <div style="border: 4px double #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>double</code></div>
-   </td>
-  </tr>
-  <tr>
-   <td style="width: 6em;">
-    <div style="border: 2px inset #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>inset</code></div>
-   </td>
-   <td style="width: 6em;">
-    <div style="border: 2px outset #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>outset</code></div>
-   </td>
-   <td style="width: 6em;">
-    <div style="border: 4px ridge #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>ridge</code></div>
-   </td>
-   <td style="width: 6em;">
-    <div style="border: 4px groove #4a4; margin: .5em; padding: .5em; width: 5em; text-align: center;"><code>groove</code></div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p><span id="result_box" lang="es"><span class="hps">También puede establecer</span> <span class="hps">el estilo a </span></span><em><strong><code>none</code> </strong>(</em><span lang="es"><em> </em><span class="hps">ninguno) o</span> </span><strong><em><code>hidden</code> </em></strong><span lang="es"><span class="hps alt-edited">(oculto), </span> <span class="hps">para eliminar</span> <span class="hps">explícitamente</span> <span class="hps">la frontera <code>(</code></span></span><code><em><strong>border </strong></em>)</code><span lang="es"><span>,</span> <span class="hps">o</span> <span class="hps">establecer el color</span> como <span class="hps">transparente</span> <span class="hps">para hacer</span> <span class="hps">la frontera</span> <span class="hps">invisible</span> <span class="hps">sin cambiar</span> <span class="hps">el diseño.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Para especificar</span> <span class="hps alt-edited">los bordes</span> <span class="hps">de uno en uno</span> por separado<span>, utilice las propiedades</span><span>:</span> <span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-top</span><span>")}</span><span class="atn">}, {</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-right</span><span>")}</span><span class="atn">}, {</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-bottom</span><span>")}</span> <span class="hps atn">}, {</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>border-left</span><span>")}</span><span>}</span><span>.</span> <span class="hps">Usted</span> <span class="hps">puede utilizar estas para</span> <span class="hps">especificar</span> <span class="hps alt-edited">un borde</span> <span class="hps"> solo en un lado</span><span>,</span> <span class="hps">o</span> <span class="hps">diferentes</span> <span class="hps alt-edited">los bordes</span> <span class="hps">en diferentes lados</span><span>.</span></span></p>
-
-<div class="tuto_example">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="hps">Ejemplo</span></span></div>
-
-<p><br>
- <span id="result_box" lang="es"><span class="hps">Esta norma</span> <span class="hps">establece el</span> <span class="hps">color de fondo y</span> <span class="hps">el borde superior</span> <span class="hps">de los elementos de</span> <span class="hps">la etiqueta <code><strong><em>h3</em></strong></code></span><span>:</span></span></p>
-
-<pre class="brush:css">h3 {
-  border-top: 4px solid #7c7; /* mid green */
-  background-color: #efe;     /* pale green */
-  color: #050;                /* dark green */
-  }
-</pre>
-
-<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
-
-<table>
- <tbody>
-  <tr>
-   <td>
-    <p style="font-size: 133%; font-weight: bold; background-color: #efe; border-top: 4px solid #7c7; color: #050; padding-right: 6em;">Stylish heading</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p><span id="result_box" lang="es"><span class="hps">Esta regla</span> <span class="hps">hace que</span> <span class="hps">las imágenes</span> sean <span class="hps">fáciles de ver</span><span>, dándoles</span> <span class="hps">un borde</span> <span class="hps">gris medio</span> a <span class="hps">todo</span><span>:</span></span></p>
-
-<pre class="brush:css">img {border: 2px solid #ccc;}
-</pre>
-
-<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
-
-<table>
- <tbody>
-  <tr>
-   <td>Image:</td>
-   <td style="border: 2px solid #ccc;"><img alt="Image:Blue-rule.png" class="internal" src="/@api/deki/files/47/=Blue-rule.png"></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Márgenes_y_relleno"><span id="result_box" lang="es"><span class="hps">Márgenes y</span> <span class="hps">relleno</span></span></h3>
-
-<p><br>
- <span id="result_box" lang="es"><span class="hps">Use</span>  <span class="hps">márgenes y el relleno</span> <span class="hps">para ajustar</span> <span class="hps">las posiciones de</span> <span class="hps">los elementos</span> <span class="hps atn">'</span><span>y crear</span> <span class="hps">el espacio</span> <span class="hps">que les rodea.</span><br>
- <br>
- <span class="hps">Utilice la propiedad </span></span><span lang="es"><span class="hps"> </span><span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps">"</span></span>margin<span lang="es"><span>")}</span><span>}</span> <span class="hps">o</span> la <span class="hps">propiedad </span><span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps atn">(</span><span class="hps">"</span></span>padding<span lang="es"><span>")}</span><span>}</span> <span class="hps">para establecer</span> <span class="hps">los</span> <span class="hps">márgenes y el </span><span class="hps"> relleno</span> con sus <span class="hps">anchuras</span> <span class="hps">respectivamente.</span><br>
- <br>
- <span class="hps">Si especifica</span> <span class="hps">una</span> <span class="hps">anchura,</span> <span class="hps">que se aplica</span> <span class="hps">en todo el</span> <span class="hps">elemento</span> <span class="hps">(arriba</span><span>, derecha,</span> <span class="hps">abajo y de izquierda</span><span>)</span><span>.</span><br>
- <br>
- <span class="hps">Si especifica</span> <span class="hps">dos anchos</span><span>,</span> <span class="hps">la</span> <span class="hps">primera se aplica</span> <span class="hps">a la</span> <span class="hps">parte superior e inferior</span><span>,</span> <span class="hps">la segunda a la</span> <span class="hps">derecha y la izquierda</span><span>.</span><br>
- <br>
- <span class="hps">Puede especificar</span> <span class="hps">los cuatro</span> <span class="hps">anchos</span> <span class="hps">en el orden</span><span>:</span> <span class="hps">arriba, derecha</span><span>,</span> <span class="hps">abajo, de izquierda</span><span>.</span></span></p>
-
-<div class="tuto_example">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="hps">Ejemplo</span></span></div>
-
-<p><br>
- <span id="result_box" lang="es"><span class="hps">Esta norma</span> <span class="hps">delimita</span> <span class="hps">párrafos con</span> <span class="hps">la  </span></span><code><em><strong> class</strong></em></code> <code>remark</code><span lang="es"><span>, dándoles</span> <span class="hps">un borde rojo</span> <span class="hps">a su alrededor.</span><br>
- <br>
- <span class="hps">El </span></span><code><strong><em>padding </em></strong></code>(relleno)<code><strong><em> </em></strong></code><span lang="es"><span class="hps">separa </span></span><span lang="es"><span class="hps">un poco </span></span><span lang="es"><span class="hps">todo</span> <span class="hps"> el borde</span> <span class="hps">del texto</span> <span class="hps">.</span></span><br>
- <br>
- <span id="result_box" lang="es"><span class="hps">A</span> <span class="hps">la izquierda una </span> <span class="hps alt-edited">sangría</span> <span class="hps alt-edited">desde el margen</span> <span class="hps">del</span> <span class="hps">párrafo con respecto al</span> <span class="hps">resto del texto <code><em><strong>(</strong></em></code></span></span><code><em><strong>margin-left</strong></em></code><span lang="es"><span><code><em><strong> )</strong></em></code>:</span></span></p>
-
-<pre class="brush:css">p.remark {
-  border: 2px solid red;
-  padding: 4px;
-  margin-left: 24px;
-  }
-</pre>
-
-<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
-
-<table>
- <tbody>
-  <tr>
-   <td>
-    <p><span class="short_text" id="result_box" lang="es"><span class="hps alt-edited">A continuación</span> <span class="hps">es un párrafo</span> <span class="hps">normal.</span></span></p>
-
-    <p style="border: 2px solid red; padding: 4px 6em 4px 4px; margin: 0px 0px 0px 24px;">Aqui con la clase remark.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="hps">Más</span> <span class="hps">detalles</span></span></div>
-
-<p><span id="result_box" lang="es"><span class="hps">Cuando se utiliza</span> <span class="hps">márgenes y el relleno</span> <span class="hps">para ajustar</span> <span class="hps alt-edited">la manera en</span> <span class="hps alt-edited">que los elementos</span> <span class="hps">se disponen</span><span>,</span> <span class="hps">sus</span> <span class="hps">reglas de estilo</span> <span class="hps">interactúan</span> <span class="hps alt-edited">con los estilos</span> <span class="hps">de tu navegador</span> <span class="hps alt-edited">por defecto</span> <span class="hps alt-edited">y pueden ser</span> <span class="hps alt-edited">muy complejas.</span><br>
- <br>
- <span class="hps">Los distintos navegadores</span> <span class="hps">ponen</span> <span class="hps alt-edited">que los elementos</span> <span class="hps">de manera diferente</span><span>.</span> <span class="hps">Los</span> <span class="hps alt-edited">resultados pueden</span> <span class="hps">ser similar</span> <span class="hps alt-edited">,hasta que nuestro</span> <span class="hps alt-edited">hoja de estilos</span> <span class="hps">cambia las cosas</span><span>.</span> <span class="hps">A veces esto</span> <span class="hps">puede hacer que sus</span> <span class="hps">hojas de estilo</span> <span class="hps alt-edited">den</span> <span class="hps">resultados sorprendentes.</span><br>
- <br>
- <span class="hps">Para</span> <span class="hps">obtener</span> <span class="hps">el resultado deseado</span><span>, es posible que</span> <span class="hps">tenga que cambiar</span> <span class="hps alt-edited">el marcado</span> <span class="hps">de su</span> <span class="hps">documento.</span> <span class="hps">La</span> <span class="hps">página siguiente de</span> <span class="hps">este tutorial</span> <span class="hps">tiene más</span> <span class="hps">información al respecto.</span><br>
- <br>
- <span class="hps">Para obtener información</span> <span class="hps">detallada acerca</span> <span class="hps">de relleno</span><span>, márgenes</span> <span class="hps">y bordes</span><span>, consulte</span> <span class="hps">la página de referencia</span> <span class="hps">Modelo de caja</span><span>.</span></span></p>
-</div>
-
-<h2 id="Acción_Agregar_bordes"><span id="result_box" lang="es"><span class="hps">Acción</span><span>:</span> <span class="hps">Agregar bordes</span></span></h2>
-
-<p>Edite su archivo CSS , <strong><em>style2.css</em></strong>. <span id="result_box" lang="es"><span class="hps alt-edited">Agrega</span> <span class="hps">esta regla</span> <span class="hps">para dibujar una línea</span> <span class="hps">a través de la</span> <span class="hps">página</span> <span class="hps">sobre cada</span> <span class="hps alt-edited">encabezado</span><span>:</span></span></p>
-
-<pre class="brush:css">h3 {border-top: 1px solid gray;}
-</pre>
-
-<p><span id="result_box" lang="es"><span class="hps">Si usted tomó</span> <span class="hps alt-edited">el cambio </span><span class="hps alt-edited">en la última página</span><span>,</span> <span class="hps alt-edited">modificara la regla</span> <span class="hps">que ha creado,</span> <span class="hps">de lo contrario</span> <span class="hps alt-edited">agregar la</span> <span class="hps alt-edited">nueva regla</span> <span class="hps alt-edited">para añadir espacio</span> <span class="hps">debajo de cada</span> <span class="hps alt-edited">ítem de la lista</span><span>:</span></span></p>
-
-<pre class="brush:css">li {
-  list-style: lower-roman;
-  margin-bottom: 8px;
-  }
-</pre>
-
-<p><span class="short_text" id="result_box" lang="es"><span class="hps">Actualice el navegador</span> <span class="hps">para ver el resultado</span><span>:</span></span></p>
-
-<table style="border: 2px outset #36b; padding: 1em; background-color: white;">
- <tbody>
-  <tr>
-   <td>
-    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
-
-    <ul style="">
-     <li style="margin-bottom: 8px;">Arctic</li>
-     <li style="margin-bottom: 8px;">Atlantic</li>
-     <li style="margin-bottom: 8px;">Pacific</li>
-     <li style="margin-bottom: 8px;">Indian</li>
-     <li style="margin-bottom: 8px;">Southern</li>
-    </ul>
-
-    <p style="font-weight: bold; font-size: 133%; margin-top: 1em; margin-bottom: .3em; padding: .4em 4em .16em 0; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
-
-    <p><strong>1: </strong>Lorem ipsum</p>
-
-    <p><strong>2: </strong>Dolor sit</p>
-
-    <p><strong>3: </strong>Amet consectetuer</p>
-
-    <p><strong>4: </strong>Magna aliquam</p>
-
-    <p><strong>5: </strong>Autem veleum</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<div class="tuto_example">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">El reto</span></span></div>
-
-<p><br>
- <span id="result_box" lang="es"><span class="hps alt-edited">Agrega</span> <span class="hps">una regla a</span> <span class="hps">la hoja de estilos</span><span>, para que</span> <span class="hps alt-edited">aparesca un amplio</span> <span class="hps alt-edited">borde</span> <span class="hps">alrededor de los</span> <span class="hps alt-edited">la lista de océanos, en</span> <span class="hps">un color</span> <span class="hps">que le recuerda</span> <span class="hps">al mar</span><span>, algo</span> <span class="hps">como esto:</span></span></p>
-
-<table style="border: 2px outset #36b; padding: 1em; background-color: white;">
- <tbody>
-  <tr>
-   <td>
-    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
-
-    <div style="border: 12px solid #69b; padding-left: 1em;">
-    <ul style="">
-     <li style="margin-bottom: 8px;">Arctic</li>
-     <li style="margin-bottom: 8px;">Atlantic</li>
-     <li style="margin-bottom: 8px;">Pacific</li>
-     <li style="margin-bottom: 8px;">Indian</li>
-     <li style="margin-bottom: 8px;">Southern</li>
-    </ul>
-    </div>
-
-    <p style="font-weight: bold; font-size: 133%; margin-top: 1em; margin-bottom: .3em; padding: .4em 4em .16em 0; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
-
-    <p><strong>. . .</strong></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<p><span id="result_box" lang="es"><span class="hps atn">(</span><span>No es necesario</span> <span class="hps alt-edited">que coincida con</span> <span class="hps">el ancho</span> <span class="hps">y el color</span> <span class="hps">que se ve aquí</span> <span class="hps">exactamente</span><span>.</span><span>)</span></span></p>
-</div>
-
-<p><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Boxes">Ver una solución a este desafío.</a></p>
-
-<h2 id="What_next">What next?</h2>
-
-<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Layout", "Layout") }}<span id="result_box" lang="es"><span class="hps">Al especificar</span> <span class="hps">márgenes y el relleno</span><span>, se</span> <span class="hps">modificó el</span> <span class="hps">diseño del documento</span><span>.</span> <span class="hps">En la página siguiente</span> <span class="hps">se cambia</span> el </span><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Layout" title="/en-US/docs/Web/Guide/CSS/Getting_Started/Layout">layout</a><span id="result_box" lang="es"><span class="hps"> de su</span> <span class="hps">documento</span> <span class="hps">de otra manera.</span></span></p>
diff --git a/files/es/web/css/introducción/cascading_and_inheritance/index.html b/files/es/web/css/introducción/cascading_and_inheritance/index.html
deleted file mode 100644
index b47218eb7a..0000000000
--- a/files/es/web/css/introducción/cascading_and_inheritance/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: Cascada y herencia
-slug: Web/CSS/Introducción/Cascading_and_inheritance
-translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance
-translation_of_original: Web/Guide/CSS/Getting_started/Cascading_and_inheritance
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>{{ previousPage("/es/docs/Web/CSS/Introduction/How_CSS_works", "Cómo funciona el CSS.")}}<span id="result_box" lang="es"><span class="hps">Esta</span> <span class="hps">es</span> <span class="hps">la cuarta sección </span> <span class="alt-edited hps">del</span> <span class="hps">tutorial</span><span> <span class="hps">CSS</span> <span class="hps">Primeros pasos</span>;</span> <span class="hps">que</span> <span class="hps">describe cómo</span> <span class="hps">interactúan</span> <span class="hps">las hojas de estilo</span> <span class="hps">en cascada,</span> <span class="hps">y</span> <span class="hps">cómo los elementos</span> <span class="hps">heredan</span> <span class="hps">el estilo</span> <span class="hps">de sus padres.</span> <span class="alt-edited hps">Usted agrega</span> <span class="hps">a</span> <span class="hps">la hoja de estilos</span> <span class="alt-edited hps">de ejemplo,</span> <span class="hps">utilizando la herencia</span> <span class="alt-edited hps">para alterar</span> <span class="hps">el estilo de</span> <span class="alt-edited hps">muchas partes del</span> <span class="hps">documento</span> <span class="hps">en un solo paso</span><span>.</span></span></p>
-
-<h2 class="clearLeft" id="Información_Cascada_y_herencia"><span class="short_text" id="result_box" lang="es"><span class="hps">Información</span><span>:</span> <span class="hps">Cascada</span> <span class="hps">y</span> <span class="hps">herencia</span></span></h2>
-
-<p><span id="result_box" lang="es"><span class="hps">El estilo</span> <span class="hps">final para</span> <span class="hps">un elemento</span> <span class="hps">se puede especificar en</span> <span class="hps">muchos lugares</span> <span class="hps">diferentes</span><span>, que pueden interactuar</span> <span class="hps">de una manera compleja</span><span>.</span> <span class="hps">Esta interacción</span> <span class="hps">compleja</span> <span class="hps">hace</span> <span class="alt-edited hps">el CSS</span> <span class="alt-edited hps">poderoso</span><span>,</span> <span class="alt-edited hps">pero puede también</span> <span class="hps">hacer que sea</span> <span class="hps">confuso y difícil</span> <span class="hps">de depurar.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="alt-edited hps">Tres</span> <span class="alt-edited hps">principales fuentes de</span> <span class="hps">información de estilo</span> <span class="alt-edited hps">forman</span> <span class="hps">una <em>cascada</em></span><span>.</span> <span class="alt-edited hps">Estas son:</span></span></p>
-
-<ul>
- <li><span id="result_box" lang="es"><span class="hps">Estilos</span> <span class="hps">por defecto del navegador</span> <span class="hps">para</span> <span class="alt-edited hps">del lenguaje de marcado</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">Estilos</span> <span class="hps">especificados</span> <span class="hps">por un usuario</span> <span class="hps">que está leyendo</span> <span class="hps">el documento</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">Los</span> <span class="hps">estilos</span> <span class="hps">relacionados en </span><span class="hps">el documento</span> <span class="hps">por su autor</span><span>.</span> <span class="hps">Estos pueden</span> <span class="hps">ser especificados</span> <span class="hps">en tres lugares</span><span>:</span></span>
-  <ul>
-   <li><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">un archivo externo</span><span>:</span> <span class="hps">este tutorial</span> <span class="alt-edited hps">aborda</span> <span class="hps">principalmente</span> <span class="hps">este</span> <span class="hps">método para definir</span> <span class="hps">los estilos.</span></span></li>
-   <li><span id="result_box" lang="es"><span class="hps">En una definición</span> <span class="hps">al principio</span> <span class="hps">del documento</span><span>: utilice</span> <span class="alt-edited hps">este método únicamente</span> <span class="hps">para los estilos</span> <span class="hps">que se utilizan sólo</span> <span class="hps">en esa página</span> <span class="hps">.</span></span></li>
-   <li><span id="result_box" lang="es"><span class="hps">En un</span> <span class="hps">elemento específico</span> <span class="hps">en el cuerpo</span> <span class="hps">del documento</span><span>:</span> <span class="hps">este</span> <span class="hps">es el método menos</span> <span class="alt-edited hps">fácil de mantener</span><span>,</span> <span class="hps">pero puede ser utilizado</span> <span class="alt-edited hps">para la probar.</span></span></li>
-  </ul>
- </li>
-</ul>
-
-<p><span id="result_box" lang="es"><span class="hps">El estilo del</span> <span class="hps">usuario modifica</span> <span class="hps">el estilo</span> <span class="hps">por defecto del navegador</span><span>.</span> <span class="alt-edited hps">El estilo</span> <span class="hps">del autor del documento</span> <span class="alt-edited hps">a continuación</span> <span class="hps">modifica</span> <span class="hps">el estilo</span> <span class="hps">un poco más.</span> <span class="hps">En este tutorial,</span> <span class="hps">usted es el autor</span> <span class="hps">del documento</span> <span class="alt-edited hps">de ejemplo,</span> <span class="hps">y</span> <span class="hps">solo trabaja</span> <span class="hps">con</span> <span class="hps">hojas de estilo</span> <span class="hps">del autor</span><span>.</span></span></p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Cuando lea este</span> <span class="hps">documento en un navegador</span><span>,</span> <span class="hps">parte del estilo</span> <span class="alt-edited hps">que ves</span> <span class="alt-edited hps">proviene</span> <span class="alt-edited hps">por defecto</span> <span class="hps">de su</span> <span class="alt-edited hps">navegador de</span> <span class="hps">HTML</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Parte del</span> <span class="hps">estilo</span> <span class="hps">podría venir de</span> <span class="alt-edited hps">los ajustes </span></span><span id="result_box" lang="es"><span class="hps">personalizados </span></span><span id="result_box" lang="es"><span class="alt-edited hps">del navegador</span> <span class="hps">o</span> <span class="alt-edited hps">de un archivo</span> <span class="alt-edited hps">de definición de estilo</span> <span class="hps">personalizado.</span> <span class="hps">En Firefox</span><span>, la configuración</span> <span class="hps">se puede personalizar en</span> <span class="alt-edited hps">cuadro de diálogo Preferencias</span><span>, o puede</span> <span class="hps">especificar</span> <span class="hps">estilos</span> <span class="hps">en un archivo</span> </span><span id="result_box" lang="es"><span class="alt-edited hps">denominado</span> </span><span id="result_box" lang="es"><em><code><span class="hps">user Content.css,</span></code></em> <span class="alt-edited hps">archivado </span><span class="hps">en su perfil de</span> <span class="hps">navegador.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Parte del</span> <span class="alt-edited hps">estilo</span> <span class="hps">proviene de</span> <span class="hps">las hojas de estilo</span> <span class="hps">vinculadas al</span> <span class="hps">documento</span> <span class="hps">por el servidor</span></span> wiki.</p>
-</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Al abrir su</span> <span class="hps">documento de muestra</span> <span class="hps">en el navegador,</span> <span class="atn hps">los elementos </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="alt-edited hps">son</span> <span class="alt-edited hps">más relevante que</span> <span class="hps">el</span> <span class="hps">resto del texto</span><span>.</span> <span class="alt-edited hps">Esto viene del</span> <span class="hps">estilo por defecto</span> <span class="hps">del navegador</span> <span class="hps">para HTML</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="atn hps">El elemento </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="hps">son rojos.</span> <span class="alt-edited hps">Esto viene</span> <span class="alt-edited hps">de la</span> <span class="hps">propia hoja de estilos</span> <span class="alt-edited hps">de ejemplo.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="atn hps">El elemento </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="hps">también</span> <span class="hps">heredan</span> <span class="hps">gran parte del estilo del elemento </span></span>{{ HTMLElement("p") }}<span lang="es"><span class="hps">,</span> <span class="alt-edited hps">porque ellos son</span> <span class="hps">sus</span> <span class="hps">hijos.</span> <span class="hps">De la misma manera</span><span>,</span> <span class="alt-edited hps">los</span> elementos </span>{{ HTMLElement("p") }}<span lang="es"> <span class="alt-edited hps">heredan</span> <span class="hps">gran parte del estilo</span> <span class="hps">del</span> <span class="hps">elemento</span></span>{{ HTMLElement("body") }}<span lang="es"><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Para los estilos</span> <span class="alt-edited hps">en cascada</span><span class="alt-edited">, las hojas de estilo</span> <span class="hps">del autor</span> <span class="hps">tienen</span> <span class="alt-edited hps">prioridad, </span> <span class="alt-edited hps">ante las hojas de estilo</span> <span class="hps">del lector</span><span>, </span> <span class="hps">por defecto</span> <span class="hps">de tu navegador</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Para los estilos</span> <span class="hps">heredados</span><span>,</span> <span class="hps">el estilo propio de</span> <span class="hps">un nodo</span> <span class="hps">hijo tiene</span> <span class="hps">prioridad sobre</span> <span class="alt-edited hps">estilo</span> <span class="hps">heredado de</span> <span class="hps">su</span> <span class="hps">padre</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Estas no son las</span> <span class="hps">únicas prioridades</span> <span class="hps">que se aplican</span><span>.</span> <span class="alt-edited hps">En una página posterior</span><span class="alt-edited hps"> de este</span> <span class="hps">tutorial se explica</span> <span class="alt-edited hps">mas detalladamente</span><span>.</span></span></p>
-
-<div class="tuto_details">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="alt-edited hps">Más</span> <span class="hps">detalles</span></span></div>
-
-<p><span id="result_box" lang="es"><span class="alt-edited hps">El CSS</span> <span class="hps">también proporciona</span> <span class="hps">una forma para que</span> <span class="hps">el lector</span> <span class="alt-edited hps">pueda anular</span> <span class="hps">el estilo</span> <span class="hps">del autor del documento</span><span>,</span> <span class="hps">mediante el uso de</span> <span class="hps">la palabra clave</span><span>! </span></span><code>!important</code>.</p>
-
-<p><span id="result_box" lang="es"><span class="hps">Esto significa</span> <span class="hps">que, como</span> <span class="hps">autor del documento</span><span>,</span> <span class="hps">no siempre se puede</span> <span class="hps">predecir con exactitud</span> <span class="hps">lo que sus lectores</span> <span class="hps">van a ver.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Si</span> <span class="hps">quieres conocer</span> <span class="hps">todos los detalles de</span></span> cascada y herencia mira <a class="external" href="http://www.w3.org/TR/CSS21/cascade.html">Asignando propiedad de valores, cascada, y herencia</a> <span id="result_box" lang="es"><span class="hps">en</span> <span class="alt-edited hps">las</span> <span class="hps">especificaciones</span> d<span class="alt-edited hps">el CSS</span><span>.</span></span></p>
-</div>
-
-<h2 id="Acción_El_uso_de_la_herencia"><span class="short_text" id="result_box" lang="es"><span class="hps">Acción</span><span>: El uso de</span> <span class="hps">la herencia</span></span> </h2>
-
-<ol>
- <li><span id="result_box" lang="es"><span class="hps">Edite su archivo</span> <span class="alt-edited hps"> CSS</span> <span class="alt-edited hps">de ejemplo.</span></span></li>
- <li><span id="result_box" lang="es"><span class="alt-edited hps">Agrega</span> <span class="hps">esta línea</span> <span class="hps">copiando y</span> <span class="hps">pegando</span><span>.</span> <span class="hps">Realmente no</span> <span class="hps">importa si</span> <span class="hps">usted la agrega</span> <span class="hps">por encima o por</span> <span class="hps">debajo de la línea</span> <span class="hps">que está</span><span>.</span> <span class="alt-edited hps">Sin embargo, añadirla</span> <span class="hps">en la parte superior</span> <span class="hps">es más</span> <span class="hps">lógico, porque</span> <span class="hps">en el documento </span><span class="alt-edited hps">el</span> elemento </span>{{ HTMLElement("p") }}<span lang="es"> es el <span class="alt-edited hps">elemento</span> <span class="hps">padre</span> <span class="atn hps">del elemento  </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span>:</span></span>
-  <pre class="brush:css">p {color: blue; text-decoration: underline;}
-</pre>
- </li>
- <li>Ahora actualice el navegador para ver el efecto <span id="result_box" lang="es"><span class="hps">en su</span> <span class="hps">documento de muestra.</span></span> El subrayado afecta todo el texto en el párrafo, incluido las letras iniciales. Los elementos {{ HTMLElement("strong") }} <span id="result_box" lang="es"><span class="hps">han heredado</span> <span class="hps">el estilo</span> <span class="hps">subrayado</span> <span class="hps">de su elemento padre </span></span>{{ HTMLElement("p") }}.<br>
-
-  <p><span id="result_box" lang="es"><span class="hps">Pero</span> <span class="atn hps">los elementos </span></span>{{ HTMLElement("strong") }}<span lang="es"> <span class="hps">siguen siendo</span> <span class="hps">rojo.</span> <span class="hps">El color rojo</span> <span class="hps">es</span> <span class="hps">su estilo</span><span> </span><span class="hps">propio</span><span>,</span> <span class="hps">por lo que tiene</span> <span class="hps">prioridad sobre</span> <span class="hps">el color azul</span> <span class="hps">de su elemento</span> <span class="hps">padre</span> </span>{{ HTMLElement("p") }}<span lang="es"> <span>.</span></span></p>
- </li>
-</ol>
-
-<table style="background-color: #f4f4f4; border: 1px solid #3366bb; padding: 1em;">
-</table>
-
-<table style="border: 2px outset #3366bb; margin-right: 2em; padding: 1em;">
- <caption>Antes</caption>
- <tbody>
-  <tr>
-   <td><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
-  </tr>
- </tbody>
-</table>
-
-<table style="border: 2px outset #3366bb; padding: 1em;">
- <caption>Después</caption>
- <tbody>
-  <tr>
-   <td style="color: blue; text-decoration: underline;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="tuto_example">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="alt-edited hps">Problema</span></span></div>
-<span id="result_box" lang="es"><span class="hps">Cambie su</span> hoja de <span class="hps">estilo</span> <span class="hps">de manera que</span> <span class="alt-edited hps">aparecen subrayados</span> <span class="hps">sólo las letras</span> <span class="hps">rojas</span><span>:</span></span>
-
-<table style="border: 2px outset #3366bb; padding: 1em;">
- <tbody>
-  <tr>
-   <td style="color: blue;"><strong style="color: red; text-decoration: underline;">C</strong>ascading <strong style="color: red; text-decoration: underline;">S</strong>tyle <strong style="color: red; text-decoration: underline;">S</strong>heets</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="tuto_details" id="tutochallenge">
-<div class="tuto_type">Possible solution</div>
-
-<p>Move the declaration for underlining from the rule for {{ HTMLElement("p") }} to the one for {{ HTMLElement("strong") }}. The resulting file looks like this:</p>
-
-<pre class="brush: css">p {color: blue; }
-strong {color: red; text-decoration: underline;}
-</pre>
-
-<p> </p>
-<a class="hideAnswer" href="#challenge">Hide solution</a></div>
-<a href="#tutochallenge" title="Display a possible solution for the challenge">Ver una solución al desafío.</a></div>
-
-<h2 id="¿Y_ahora_qué"><span class="short_text" id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
-
-<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Selectors", "Selectores")}}<span id="result_box" lang="es"><span class="hps">Su</span> <span class="hps">hoja de estilo</span> <span class="hps">de ejemplo especifica</span> <span class="hps">estilos</span> <span class="hps">para las etiquetas</span> <span class="atn hps">&lt;</span><span>p</span><span>&gt;</span> <span class="hps">y</span> <span class="hps">&lt;strong</span><span>&gt;</span><span>, cambiando el</span> <span class="hps">estilo de</span> <span class="hps">los elementos correspondientes</span> <span class="hps">en todo el documento</span><span>.</span> <span class="hps">La</span> <span class="hps">siguiente sección</span> <span class="hps">describe cómo especificar</span> <span class="hps">el estilo</span> <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Selectors">de manera más selectiva</a></span>.</p>
diff --git a/files/es/web/css/introducción/color/index.html b/files/es/web/css/introducción/color/index.html
deleted file mode 100644
index 030fa9d692..0000000000
--- a/files/es/web/css/introducción/color/index.html
+++ /dev/null
@@ -1,364 +0,0 @@
----
-title: Color
-slug: Web/CSS/Introducción/Color
-translation_of: Learn/CSS/Introduction_to_CSS/Values_and_units#Colors
-translation_of_original: Web/Guide/CSS/Getting_started/Color
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p><a class="button previousPage" href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Text_styles" rel="prev" style="margin: 0px 20px 20px 0px; padding: 5px 11px; border: 0px; color: rgb(77, 78, 83); text-decoration: none; cursor: pointer; display: inline-block; line-height: 1; font-weight: normal; letter-spacing: normal; text-transform: uppercase; border-radius: 4px; box-shadow: rgb(187, 191, 194) 0px -1px inset; float: left; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; white-space: normal; background-color: rgb(234, 239, 242);" title="Los estilos de texto"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">IR A LA SECCIÓN ANTERIOR: </span></font></font><br>
- <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">LOS ESTILOS DE TEXTO</span></font></font></a></p>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Esta es la sección octava de la </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="es-es / docs / Web / guía / CSS / Primeros pasos"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS Introducción</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">tutorial; </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">se explica cómo puede especificar el color en CSS. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En su hoja de estilos de muestra, se introduce colores de fondo.</span></font></font></p>
-
-<h2 class="clearLeft" id="Información_Color" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 700; font-family: 'Open Sans', sans-serif; line-height: 30px; font-size: 2.14285714285714rem; letter-spacing: -1px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Información: Color</span></font></font></h2>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En este tutorial hasta ahora, se ha utilizado un número limitado de colores con nombre. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS 2 soporta 17 colores con nombre absoluto. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Algunos de los nombres puede que no sea el esperado:</span></font></font></p>
-
-<table style="border: 0px; margin-left: 2em; text-align: right;">
- <tbody>
-  <tr>
-   <td> </td>
-   <td>black</td>
-   <td style="width: 2em; height: 2em; background-color: black;"> </td>
-   <td>gray</td>
-   <td style="width: 2em; height: 2em; background-color: gray;"> </td>
-   <td>silver</td>
-   <td style="width: 2em; height: 2em; background-color: silver;"> </td>
-   <td>white</td>
-   <td style="width: 2em; height: 2em; background-color: white; border: 1px dotted gray;"> </td>
-  </tr>
-  <tr>
-   <td>primaries</td>
-   <td>red</td>
-   <td style="width: 2em; height: 2em; background-color: red;"> </td>
-   <td>lime</td>
-   <td style="width: 2em; height: 2em; background-color: lime;"> </td>
-   <td>blue</td>
-   <td style="width: 2em; height: 2em; background-color: blue;"> </td>
-  </tr>
-  <tr>
-   <td>secondaries</td>
-   <td>yellow</td>
-   <td style="width: 2em; height: 2em; background-color: yellow;"> </td>
-   <td>aqua</td>
-   <td style="width: 2em; height: 2em; background-color: aqua;"> </td>
-   <td>fuchsia</td>
-   <td style="width: 2em; height: 2em; background-color: fuchsia;"> </td>
-  </tr>
-  <tr>
-   <td> </td>
-   <td>maroon</td>
-   <td style="width: 2em; height: 2em; background-color: maroon;"> </td>
-   <td>orange</td>
-   <td style="width: 2em; height: 2em; background-color: orange;"> </td>
-   <td>olive</td>
-   <td style="width: 2em; height: 2em; background-color: olive;"> </td>
-   <td>purple</td>
-   <td style="width: 2em; height: 2em; background-color: purple;"> </td>
-   <td>green</td>
-   <td style="width: 2em; height: 2em; background-color: green;"> </td>
-   <td>navy</td>
-   <td style="width: 2em; height: 2em; background-color: navy;"> </td>
-   <td>teal</td>
-   <td style="width: 2em; height: 2em; background-color: teal;"> </td>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<div class="tuto_details">
-<div class="tuto_type">
-<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Detalles</span></font></font></div>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Su navegador puede soportar muchos más colores con nombre, como:</span></font></font></p>
-</div>
-
-<table style="border: 0px; margin: .5em 0px .5em 2em; text-align: right; background-color: inherit;">
- <tbody>
-  <tr>
-   <td>dodgerblue</td>
-   <td style="width: 2em; height: 2em; background-color: dodgerblue;"> </td>
-   <td>peachpuff</td>
-   <td style="width: 2em; height: 2em; background-color: peachpuff;"> </td>
-   <td>tan</td>
-   <td style="width: 2em; height: 2em; background-color: tan;"> </td>
-   <td>firebrick</td>
-   <td style="width: 2em; height: 2em; background-color: firebrick;"> </td>
-   <td>aquamarine</td>
-   <td style="width: 2em; height: 2em; background-color: aquamarine;"> </td>
-  </tr>
- </tbody>
-</table>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para detalles de esta lista ampliada, consulte: </span></font></font><a class="external external-icon" href="http://www.w3.org/TR/2003/CR-css3-color-20030514/#svg-color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; white-space: pre-line; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; background-color: rgb(244, 244, 244);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">SVG palabras clave de color</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> en el </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">módulo de colores </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS 3 . </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Tenga cuidado con el uso de nombres de colores;puede que algunos de sus lectores de navegación no lo soporte.</span></font></font></p>
-</div>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para una paleta más grande, especificar los componentes rojo, verde y azul del color que desee, utilizando el signo numerico (hash) y tres </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">dígitos  </span></font></font><em><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">hexadecimales</span></font></font></em><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> entre los rangos  0 - 9, a - f. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Las letras a - f representan los valores de 10 a 15:</span></font></font></p>
-
-<table style="border: 0px; margin-left: 2em;">
- <tbody>
-  <tr>
-   <td>black</td>
-   <td style="width: 2em; height: 2em; background-color: #000;"> </td>
-   <td><code>#000</code></td>
-  </tr>
-  <tr>
-   <td>pure red</td>
-   <td style="width: 2em; height: 2em; background-color: #f00;"> </td>
-   <td><code>#f00</code></td>
-  </tr>
-  <tr>
-   <td>pure green</td>
-   <td style="width: 2em; height: 2em; background-color: #0f0;"> </td>
-   <td><code>#0f0</code></td>
-  </tr>
-  <tr>
-   <td>pure blue</td>
-   <td style="width: 2em; height: 2em; background-color: #00f;"> </td>
-   <td><code>#00f</code></td>
-  </tr>
-  <tr>
-   <td>white</td>
-   <td style="width: 2em; height: 2em; background-color: #fff; border: 1px dotted gray;"> </td>
-   <td><code>#fff</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p><br>
- <span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">Para toda la paleta, especificar dos dígitos hexadecimales para cada componente:</span></p>
-
-<table style="border: 0px; margin-left: 2em;">
- <tbody>
-  <tr>
-   <td>black</td>
-   <td style="width: 2em; height: 2em; background-color: #000;"> </td>
-   <td><code>#000000</code></td>
-  </tr>
-  <tr>
-   <td>pure red</td>
-   <td style="width: 2em; height: 2em; background-color: #f00;"> </td>
-   <td><code>#ff0000</code></td>
-  </tr>
-  <tr>
-   <td>pure green</td>
-   <td style="width: 2em; height: 2em; background-color: #0f0;"> </td>
-   <td><code>#00ff00</code></td>
-  </tr>
-  <tr>
-   <td>pure blue</td>
-   <td style="width: 2em; height: 2em; background-color: #00f;"> </td>
-   <td><code>#0000ff</code></td>
-  </tr>
-  <tr>
-   <td>white</td>
-   <td style="width: 2em; height: 2em; background-color: #fff; border: 1px dotted gray;"> </td>
-   <td><code>#ffffff</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">Generalmente, usted puede obtener estos códigos hexadecimales de seis dígitos de su programa de gráficos o alguna otra herramienta.</span></p>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ejemplo</span></font></font></div>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Con un poco de práctica, puede ajustar los colores de tres dígitos de forma manual para la mayoría de los propósitos:</span></font></font></p>
-</div>
-
-<table style="border: 0px; margin-left: 2em; background-color: #fffff4;">
- <tbody>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Comience con el rojo puro:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #f00;"> </td>
-   <td><code>#f00</code></td>
-  </tr>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(201, 215, 241);">Para que sea más pálido, añadir un poco de verde y azul:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #f77;"> </td>
-   <td><code>#f77</code></td>
-  </tr>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para hacerlo más naranja, añadir un poco de verde adicional:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #fa7;"> </td>
-   <td><code>#fa7</code></td>
-  </tr>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para oscurecer, reducir todos sus componentes:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #c74;"> </td>
-   <td><code>#c74</code></td>
-  </tr>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para reducir su saturación, hacer que sus componentes más iguales:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #c98;"> </td>
-   <td><code>#c98</code></td>
-  </tr>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Si usted los pone exactamente iguales, se obtiene gris:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #ccc;"> </td>
-   <td><code>#ccc</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Para un tono pastel como el azul pálido:</span></p>
-
-<table style="border: 0px; margin-left: 2em; background-color: #fffff4;">
- <tbody>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Comience con blanco puro:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #fff; border: 1px dotted gray;"> </td>
-   <td><code>#fff</code></td>
-  </tr>
-  <tr>
-   <td><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 244);">Reducir los otros componentes un poco:</span></td>
-   <td style="width: 2em; height: 2em; background-color: #eef; border: 1px dotted gray;"> </td>
-   <td><code>#eef</code></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type">
-<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Más detalles</span></font></font></div>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">También puede especificar un color mediante los valores RGB decimales en el rango de 0 - 255, o porcentajes.</span></font></font></p>
-
-<p><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(244, 244, 244);">Por ejemplo, este es de color granate (rojo oscuro)</span>dark red:</p>
-</div>
-
-<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token function" style="margin: 0px; padding: 0px; border: 0px; color: rgb(221, 74, 104);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">RGB</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> (128, 0, 0)</span></font></font></code></pre>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para más detalles sobre cómo especificar los colores, ver: </span></font></font><a class="external external-icon" href="http://www.w3.org/TR/CSS21/syndata.html#color-units" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; white-space: pre-line; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; background-color: rgb(244, 244, 244);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Colores</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> en la Especificación CSS.</span></font></font></p>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para obtener información sobre la adecuación de los colores del sistema como Menú y ThreeDFace, véase: </span></font></font><a class="external external-icon" href="http://www.w3.org/TR/CSS21/ui.html#system-colors" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; white-space: pre-line; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; background-color: rgb(244, 244, 244);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Sistema CSS2 Colores</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> en la Especificación CSS.</span></font></font></p>
-</div>
-
-<h3 id="Propiedades_de_Color" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 200; font-family: 'Open Sans', sans-serif; line-height: 24px; font-size: 1.71428571428571rem; letter-spacing: -0.5px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Propiedades de Color</span></font></font></h3>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ya ha utilizado </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">la propiedad</span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> color</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">  en el texto.</span></font></font></p>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">También puede utilizar <code>la</code></span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> propiedad </span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"><code> </code></span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/background-color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">background-color</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> para cambiar fondos elementos.</span></font></font></p>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Los Fondos (</span></font></font><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">Backgrounds </span>) <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">se pueden establecer en </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">transparent</span></code><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"> (transparentes) </span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">para eliminar explícitamente cualquier color, revelando fondo del elemento padre.</span></font></font></p>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ejemplo</span></font></font></div>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Los </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">ejemplos de</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> cajas de este tutorial utilizan este fondo de color amarillo pálido:</span></font></font></p>
-
-<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token property" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 0, 85);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">background-color </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">:</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> # fffff4 </span></font></font><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">;</span></font></font></span></code></pre>
-
-<div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 0px; background: 0px 0px;"> </div>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Los </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Más detalles</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> cajas utilizan este gris pálido:</span></font></font></p>
-
-<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token property" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 0, 85);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">background-color </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">:</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> # F4F4F4 </span></font></font><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">;</span></font></font></span></code></pre>
-</div>
-</div>
-
-<p> </p>
-
-<h2 id="Acción_El_uso_de_códigos_de_color" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 700; font-family: 'Open Sans', sans-serif; line-height: 30px; font-size: 2.14285714285714rem; letter-spacing: -1px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Acción: El uso de códigos de color</span></font></font></h2>
-
-<ol style="margin: 0px 0px 24px; padding: 0px 0px 0px 40px; border: 0px; list-style-type: decimal; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);">
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Edite su archivo CSS.</span></font></font></li>
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Hacer el cambio se muestra aquí en negrita, para dar las letras iniciales un fondo azul claro. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">(La disposición y comentarios en el archivo probablemente difieren del archivo que se muestra aquí. Mantenga la disposición y los comentarios de la forma que prefiera.)</span></font></font>
-  <pre class="brush:css;highlight:[13]  language-css"><code class="language-css"><span class="token comment">/*** CSS Tutorial: Color page ***/</span>
-
-<span class="token comment">/* page font */</span>
-<span class="token selector">body </span><span class="token punctuation">{</span><span class="token property">font</span><span class="token punctuation">:</span> 16px <span class="token string">"Comic Sans MS"</span>, cursive<span class="token punctuation">;</span><span class="token punctuation">}</span>
-
-<span class="token comment">/* paragraphs */</span>
-<span class="token selector">p </span><span class="token punctuation">{</span><span class="token property">color</span><span class="token punctuation">:</span> blue<span class="token punctuation">;</span><span class="token punctuation">}</span>
-<span class="token selector">#first </span><span class="token punctuation">{</span><span class="token property">font-style</span><span class="token punctuation">:</span> italic<span class="token punctuation">;</span><span class="token punctuation">}</span>
-
-<span class="token comment">/* initial letters */</span>
-<span class="token selector">strong </span><span class="token punctuation">{</span>
-  <span class="token property">color</span><span class="token punctuation">:</span> red<span class="token punctuation">;</span>
-  <span class="token property">background-color</span><span class="token punctuation">:</span> #ddf<span class="token punctuation">;</span>
-  <span class="token property">font</span><span class="token punctuation">:</span> 200% serif<span class="token punctuation">;</span>
-  <span class="token punctuation">}</span>
-
-<span class="token selector">.carrot </span><span class="token punctuation">{</span><span class="token property">color</span><span class="token punctuation">:</span> red<span class="token punctuation">;</span><span class="token punctuation">}</span>
-<span class="token selector">.spinach </span><span class="token punctuation">{</span><span class="token property">color</span><span class="token punctuation">:</span> green<span class="token punctuation">;</span><span class="token punctuation">}</span></code></pre>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 0px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 19px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 38px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 57px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 76px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 95px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 114px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 133px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 152px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 171px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 190px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 209px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 228px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 247px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 266px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 285px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 304px; background: 0px 0px;"> </div>
-
-  <div class="line-number" style="margin: 1em 0px 0px; padding: inherit 0px; border: 0px; position: absolute; left: 0px; right: 0px; line-height: inherit; white-space: pre; top: 323px; background: 0px 0px;"> </div>
-
-  <div class="line-highlight" style=""> </div>
- </li>
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Guarde el archivo y actualizar el navegador para ver el resultado.</span></font></font></li>
-</ol>
-
-<table>
- <tbody>
-  <tr>
-   <td style="font: 16px 'Comic Sans MS', cursive; color: blue;">
-    <table style="margin: 0px 0px 24px; padding: 0px; border-width: 1px 0px 0px 1px; border-style: solid; border-color: rgb(224, 224, 220); border-collapse: collapse; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);">
-     <tbody>
-      <tr style="margin: 0px; padding: 0px; border: 0px;">
-       <td style="margin: 0px; padding: 6px; border-width: 0px 1px 1px 0px; border-style: solid; border-color: rgb(224, 224, 220); text-align: left; font-style: italic; font-variant: normal; font-weight: normal; font-size: 16px; line-height: normal; font-family: 'Comic Sans MS', cursive; color: blue;"><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>C</font></font></strong><font><font> ascading </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: green; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> tyle </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: green; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> heets</font></font></td>
-      </tr>
-      <tr style="margin: 0px; padding: 0px; border: 0px;">
-       <td style="margin: 0px; padding: 6px; border-width: 0px 1px 1px 0px; border-style: solid; border-color: rgb(224, 224, 220); text-align: left; font-style: normal; font-variant: normal; font-weight: normal; font-size: 16px; line-height: normal; font-family: 'Comic Sans MS', cursive; color: blue;"><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>C</font></font></strong><font><font> ascading </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> tyle </font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: red; font-style: normal; font-variant: normal; font-weight: normal; font-size: 32px; line-height: normal; font-family: serif; background-color: rgb(221, 221, 255);"><font><font>S</font></font></strong><font><font> heets</font></font></td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Desafío</span></font></font></div>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En el archivo CSS, cambiara todos los nombres de los colores a los códigos de color de 3 dígitos sin afectar el resultado.</span></font></font></p>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">(Esto no se puede hacer exactamente, pero usted puede conseguir cerca. Para hacerlo exactamente lo que necesita códigos de 6 dígitos, y hay que buscar la especificación CSS o utilizar una herramienta gráfica para que coincida con los colores.)</span></font></font></p>
-<a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Color#tutochallenge" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-size: 12px; text-align: right; display: block; font-family: 'Open Sans', sans-serif; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; white-space: normal;" title="Mostrar una posible solución para el desafío"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver una solución para el desafío.</span></font></font></a></div>
-</div>
-
-<h2 id="¿Y_ahora_qué" style="margin: 0px 0px 12px; padding: 0px; border: 0px; font-weight: 700; font-family: 'Open Sans', sans-serif; line-height: 30px; font-size: 2.14285714285714rem; letter-spacing: -1px; color: rgb(77, 78, 83); font-style: normal; font-variant: normal; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">¿Y ahora qué?</span></font></font></h2>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><a class="button nextPage" href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Content" rel="next" style="margin: 20px 0px 0px 20px; padding: 5px 11px; border: 0px; color: rgb(77, 78, 83); text-decoration: none; cursor: pointer; display: inline-block; line-height: 1; font-weight: 400; letter-spacing: normal; text-transform: uppercase; border-radius: 4px; box-shadow: rgb(187, 191, 194) 0px -1px inset; float: right; background-color: rgb(234, 239, 242);" title="Contenido"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">IR A LA SIGUIENTE SECCIÓN: </span></font></font><br>
- <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CONTENT</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">En su documento de muestra y el contenido de su hoja de estilo muestra estrictamente separados los estilo.</span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">La </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Content" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title="/ En-US / docs / Web / guía / CSS / Getting_Started / contenido"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">siguiente sección</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> explica cómo se puede hacer excepciones a esta estricta separación.</span></font></font></p>
diff --git a/files/es/web/css/introducción/how_css_works/index.html b/files/es/web/css/introducción/how_css_works/index.html
deleted file mode 100644
index f4beb05519..0000000000
--- a/files/es/web/css/introducción/how_css_works/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: Cómo funciona el CSS
-slug: Web/CSS/Introducción/How_CSS_works
-tags:
-  - CSS
-  - 'CSS:'
-  - 'CSS:Empezando'
-  - Diseño
-  - Guía
-  - Inicio
-  - Web
-translation_of: Learn/CSS/First_steps/How_CSS_works
-translation_of_original: Web/Guide/CSS/Getting_started/How_CSS_works
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Why_use_CSS", "¿Por qué usar CSS?") }}<span id="result_box" lang="es"><span class="hps">Esta</span> <span class="alt-edited hps">tercera parte del</span> </span><span class="seoSummary">tutorial <a href="/en-US/docs/Web/Guide/CSS/Getting_started" title="en-US/docs/Web/Guide/CSS/Getting_started">Empezando CSS</a> </span><span id="result_box" lang="es"><span class="hps">explica cómo funciona</span> <span class="hps">el CSS</span> <span class="hps">en el navegador y</span> la finalidad<span class="hps"> del</span> <span class="atn hps">Modelo de Objeto de Documento (</span><span>DOM</span><span>)</span><span>.</span> <span class="hps">Usted también aprenderá</span> <span class="hps">cómo analizar</span> <span class="hps">el documento de</span> <span class="hps">muestra.</span></span></p>
-
-<h2 class="clearLeft" id="Información_Cómo_funciona_CSS"><span class="short_text" id="result_box" lang="es"><span class="hps">Información</span><span>: Cómo funciona</span> <span class="hps">CSS</span></span></h2>
-
-<p><span id="result_box" lang="es"><span class="hps">Cuando un</span> <span class="hps">navegador muestra</span> <span class="hps">un documento, debe</span><span class="alt-edited hps"> combinar</span> <span class="hps">el contenido del documento</span> <span class="hps">con la </span><span class="hps">información </span></span><span id="result_box" lang="es"><span class="hps"> </span></span><span id="result_box" lang="es"><span class="hps">de </span></span><span id="result_box" lang="es"><span class="hps">su</span></span><span id="result_box" lang="es"><span class="hps"> estilo</span><span>.</span> Se <span class="hps">procesa</span> <span class="hps">el documento en</span> <span class="hps">dos</span> <span class="hps">etapas</span><span>:</span></span></p>
-
-<ol>
- <li><span id="result_box" lang="es"><span class="hps">El navegador</span> <span class="hps">convierte el</span> <span class="hps">lenguaje de marcado (</span></span><code><strong><em>markup</em></strong></code>)<span lang="es"> <span class="hps">y</span> <span class="alt-edited hps">el</span> <span class="hps">CSS</span> <span class="hps">en el <em><span class="seoSummary"><a href="en-US/docs/DOM" title="en-US/docs/DOM">DOM</a></span></em></span><span class="seoSummary"><strong> </strong></span><span class="hps">(Document Object</span> <span class="hps">Model)</span><span>.</span> <span class="hps">El DOM</span> <span class="hps">representa el documento</span> <span class="hps">en la memoria del</span> <span class="hps">ordenador.</span></span> <span id="result_box" lang="es"><span class="hps">Combina</span> <span class="hps">el contenido del documento</span> <span class="hps">con su estilo</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">El navegador muestra</span> <span class="hps">el contenido de la</span> <span class="hps">DOM</span><span>.</span></span></li>
-</ol>
-
-<p><span id="result_box" lang="es"><span class="hps">Un</span> <span class="hps">lenguaje de marcado</span> <span class="hps">utiliza <em>elementos</em></span><em> </em><span class="hps">para definir</span> <span class="hps">la estructura del documento</span><span>.</span> <span class="hps">Usted marca</span> <span class="hps">un elemento</span> <span class="hps">utilizando</span> <span class="hps"><em>etiquetas</em>,</span> <span class="hps">que son cadenas</span> <span class="hps">que comienzan con</span> <span class="hps">'&lt;'</span> <span class="hps">y termina con</span> <span class="hps">'&gt;'</span><span>.</span> <span class="hps">La mayoría de los</span> <span class="hps">elementos</span> <span class="hps">tienen un par de</span> <span class="hps">etiquetas,</span> <span class="hps">una etiqueta de inicio</span> <span class="hps">y</span> <span class="hps">una etiqueta de cierre</span><span>.</span> <span class="hps">Para la</span> <span class="hps">etiqueta de inicio</span><span>, coloque</span> <span class="hps">el nombre del elemento</span> <span class="hps">entre</span> <span class="hps">'&lt;'</span> <span class="atn hps">y '</span><span>&gt;'</span><span>.</span> <span class="hps">Para la</span> <span class="hps">etiqueta final</span><span>, coloque un</span> <span class="hps">'/'</span> <span class="atn hps">después de '</span><span>&lt;' y</span> <span class="hps">antes del</span> <span class="hps">nombre del elemento.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Dependiendo del</span> <span class="hps">lenguaje de marcado</span><span>,</span> <span class="hps">algunos</span> <span class="hps">elementos tienen</span> <span class="hps">sólo</span> <span class="hps">una etiqueta de inicio</span><span>,</span> <span class="hps">o</span> <span class="hps">una sola etiqueta</span> <span class="hps">donde el</span> <span class="hps">'/'</span> viene <span class="hps">después del</span> <span class="hps">nombre del elemento.</span> <span class="hps">Un elemento</span> <span class="hps">también</span> <span class="hps">puede ser un contenedor </span><span class="hps">e incluir</span> <span class="hps">otros elementos</span> <span class="hps">entre</span> <span class="hps">su</span> <span class="hps">etiqueta de inicio</span> <span class="hps">y la etiqueta de cierre</span><span>.</span> <span class="alt-edited hps">Sólo recuerda</span> <span class="hps">cerrar</span> <span class="hps">siempre</span> <span class="hps">las</span> <span class="hps">etiquetas</span> <span class="hps">dentro del contenedor.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Un</span> <span class="hps">DOM</span> <span class="hps">tiene una estructura</span> <span class="hps">en forma de árbol</span><span>.</span> <span class="hps">Cada elemento</span><span>,</span> <span class="hps">atributo</span> <span class="hps">y</span> <span class="hps">extensión de texto</span> <span class="hps">en el</span> <span class="hps">lenguaje de marcado</span> <span class="hps">se convierte en un</span> <span class="hps"><em>nodo </em>de la</span> <span class="hps">estructura de árbol.</span> <span class="hps">Los nodos</span> <span class="hps">se definen por su</span> <span class="hps">relación con otros</span> <span class="hps">nodos DOM</span><span>.</span> <span class="hps">Algunos elementos</span> <span class="hps">son</span> <span class="hps">los padres de los</span> <span class="hps">nodos secundarios</span><span>,</span> <span class="hps">y</span> <span class="hps">los nodos secundarios</span> <span class="hps">tienen hermanos</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Comprender el</span> <span class="hps">DOM</span> <span class="hps">le ayuda a diseñar</span><span>, depurar</span> <span class="hps">y mantener su</span> <span class="hps">CSS</span><span>,</span> <span class="hps">porque el</span> <span class="hps">DOM</span> <span class="hps">es donde su</span> <span class="hps">CSS y</span> <span class="hps">el contenido del documento</span> <span class="hps">se reúnen</span><span>.</span></span></p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-<span id="result_box" lang="es"><span class="hps">En</span> <span class="alt-edited hps">el</span> <span class="hps">documento de ejemplo</span><span>,</span> <span class="alt-edited hps">las</span> <span class="hps">etiqueta &lt;p&gt;</span> <span class="hps">y su</span> <span class="hps">etiqueta de cierre</span> <span class="atn hps">&lt;</span><span>/</span> <span class="hps">p&gt;</span> <span class="hps">crean un contenedor</span><span>:</span></span>
-
-<pre class="brush:html">&lt;p&gt;
-  &lt;strong&gt;C&lt;/strong&gt;ascading
-  &lt;strong&gt;S&lt;/strong&gt;tyle
-  &lt;strong&gt;S&lt;/strong&gt;heets
-&lt;/p&gt;
-</pre>
-
-<h2 id="Ejemplo_en_vivo"><span class="short_text" id="result_box" lang="es"><span class="hps">Ejemplo</span> en <span class="hps">vivo</span></span></h2>
-
-<p><a href="http://jsfiddle.net/djaniketster/6jbpS/">http://jsfiddle.net/djaniketster/6jbpS/</a></p>
-
-<p><span id="result_box" lang="es"><span class="hps">En el</span> <span class="hps">DOM</span><span>, el nodo</span> <span class="hps">correspondiente P</span> <span class="hps">es</span> <span class="hps">uno de los padres</span><span>.</span> <span class="hps">Sus</span> <span class="hps">hijos</span> <span class="hps">son los nodos</span> <code><em><strong>STRONG </strong></em></code><span class="alt-edited hps">y</span> <span class="hps">los</span> <span class="hps">nodos de texto</span><span>.</span> <span class="hps">Los nodos</span> <code><em><strong>STRONG </strong></em></code></span><span lang="es"><span class="alt-edited hps">son en sí mismos</span> <span class="hps">padres</span><span>,</span> <span class="hps">con</span> <span class="hps">los nodos de texto</span> <span class="hps">como</span> <span class="hps">sus hijos</span><span>:</span></span></p>
-
-<pre><span style="color: black;">P</span>
-├─<span style="color: black;">STRONG</span>
-│ └─"<span style="color: black;">C</span>"
-├─"<span style="color: black;">ascading</span>"
-├─<span style="color: black;">STRONG</span>
-│ └─"<span style="color: black;">S</span>"
-├─"<span style="color: black;">tyle</span>"
-├─<span style="color: black;">STRONG</span>
-│ └─"<span style="color: black;">S</span>"
-└─"<span style="color: black;">heets</span>"</pre>
-</div>
-
-<h2 id="Acción_Analizando_un_DOM"><span class="short_text" id="result_box" lang="es"><span class="hps">Acción:</span> <span class="hps">Analizando un</span> <span class="hps">DOM</span></span></h2>
-
-<h3 id="El_uso_del_Inspector_DOM"><span class="short_text" id="result_box" lang="es"><span class="hps">El uso del Inspector</span> <span class="hps">DOM</span></span></h3>
-
-<p><span id="result_box" lang="es"><span class="hps">Para analizar un</span> <span class="hps">DOM</span><span>,</span> <span class="hps">se necesita un software</span> <span class="hps">especial.</span> <span class="hps">Usted puede usar</span> el </span><span id="result_box" lang="es"><span class="alt-edited hps">complemento de </span> </span><span id="result_box" lang="es"><span class="hps">Mozilla </span></span><a href="/en/DOM_Inspector" title="en/DOM_Inspector">DOM Inspector</a> (DOMi) <span id="result_box" lang="es"><span class="hps">para analizar un</span> <span class="hps">DOM</span><span>.</span> <span class="hps">Usted sólo tendrá que</span> <span class="hps">instalar el</span> <span class="atn hps">complemento (</span><span>ver</span> <span class="hps">más detalles abajo)</span><span>.</span></span></p>
-
-<ol>
- <li><span id="result_box" lang="es"><span class="hps">Utilice</span> <span class="hps">el navegador</span> <span class="hps">Mozilla</span> <span class="hps">para abrir</span> <span class="hps">el documento</span> <span class="hps">en versión HTML</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">Desde la barra de</span> <span class="hps">menú de su </span><span class="hps">navegador</span><span>, selecciona</span> <strong><span class="hps">Herramientas&gt;</span> <span class="hps">Inspector DOM</span></strong><span>,</span> <span class="hps">o <strong>Herramientas</strong></span><strong><span>&gt;</span> <span class="hps">Desarrollo Web&gt;</span> <span class="hps">Inspector DOM</span></strong><span>.</span></span>
-  <div class="tuto_details">
-  <div class="tuto_type"><span id="result_box" lang="es"><span class="alt-edited hps">Más</span> <span class="hps">detalles</span></span></div>
-
-  <p><span id="result_box" lang="es"><span class="hps">Si el navegador</span> <span class="hps">Mozilla</span> <span class="hps">no tiene</span> <span class="hps">Domi</span><span>, puede</span><a href="https://addons.mozilla.org/en-US/firefox/addon/6622/"> instalarlo del sitio de complementos</a> <span class="hps">y reiniciar el</span> <span class="hps">navegador.</span> <span class="hps">Luego regrese</span> <span class="hps">a este</span> <span class="hps">tutorial.</span></span></p>
-
-  <p><span id="result_box" lang="es"><span class="hps">Si no</span> <span class="hps">desea instalar</span> <span class="hps">Domi</span> <span class="hps">(o</span> <span class="hps">estás usando</span> <span class="hps">un navegador que no</span> <span class="hps">Mozilla)</span><span>, puede utilizar</span> <span class="hps">Web</span> <span class="atn hps">X-</span><span>Ray</span> <span class="hps">Goggles,</span> <span class="hps">como se describe en</span> <span class="hps">la siguiente sección.</span> <span class="hps">O bien, puede</span> <span class="hps">omitir esta sección</span> <span class="hps">e ir directamente a</span> <span class="hps">la página siguiente.</span> <span class="hps">Saltarse</span> <span class="hps">esta sección</span> <span class="hps">no interfiere con</span> <span class="hps">el resto del</span> <span class="hps">tutorial.</span></span></p>
-  </div>
- </li>
- <li><span id="result_box" lang="es"><span class="alt-edited hps">En el</span> <span class="hps">Domi</span><span>, expanda</span> <span class="hps">los nodos</span> <span class="hps">de su</span> <span class="hps">documento</span> <span class="hps">haciendo clic en</span> <span class="hps">las flechas</span><span>.</span></span>
-  <p><span id="result_box" lang="es"><strong><span class="hps">Nota</span><span>:</span></strong> <span class="alt-edited hps">El espaciado</span> <span class="alt-edited hps">de su archivo</span> <span class="hps">HTML</span> <span class="alt-edited hps">puede ocasionar</span> <span class="alt-edited hps">que Domi</span> <span class="alt-edited hps">muestre</span> <span class="hps">algunos nodos</span> <span class="hps">de texto vacíos</span><span class="alt-edited">, que se pueden</span> <span class="hps">pasar por alto.</span></span></p>
-
-  <p><span id="result_box" lang="es"><span class="hps">Parte</span> <span class="hps">del resultado</span> <span class="hps">podría tener este aspecto</span><span>, según</span> <span class="alt-edited hps">qué nodos</span> <span class="alt-edited hps">has</span> <span class="alt-edited hps">expandido</span><span>:</span></span></p>
-
-  <pre>│ ▼╴<span style="color: black;">P</span>
-│ │ │ ▼╴<span style="color: black;">STRONG</span>
-│ │ └<span style="color: darkblue;">#text</span>
-│ ├╴<span style="color: darkblue;">#text</span>
-│ ►╴<span style="color: black;">STRONG</span>
-│ │</pre>
-
-  <p><span id="result_box" lang="es"><span class="alt-edited hps">Cuando selecciona</span> <span class="alt-edited hps">cualquiera de los nodos</span><span>, puede usar</span> <span class="hps">panel de la derecha</span> <span class="hps">de</span> <strong><span class="alt-edited hps"> DOMi </span></strong><span class="hps">para averiguar</span> <span class="hps">más cosas sobre él.</span> <span class="hps">Por ejemplo</span><span>, cuando se selecciona</span> <span class="hps">un nodo de texto</span><span>,</span> <strong><span class="alt-edited hps">DOMi </span></strong></span><span lang="es"><span class="hps">muestra</span> <span class="hps">el texto en el</span> <span class="hps">panel de la derecha</span><span>.</span></span></p>
-
-  <p><span id="result_box" lang="es"><span class="hps">Cuando se selecciona</span> <span class="alt-edited hps">un elemento nodo</span></span>, <span id="result_box" lang="es"><strong><span class="alt-edited hps">DOMi </span></strong><span class="hps">analiza y</span> <span class="hps">ofrece</span> <span class="hps">una enorme cantidad de</span> <span class="hps">información en su</span> <span class="hps">panel de la derecha</span><span>.</span></span> <span id="result_box" lang="es"><span class="alt-edited hps">La información de estilo</span> <span class="hps">es sólo</span> <span class="alt-edited hps">una parte de la información</span> <span class="hps">que proporciona.</span></span></p>
- </li>
-</ol>
-
-<div class="tuto_example">
-<div class="tuto_type">Problema</div>
-
-<p><span id="result_box" lang="es"><span class="alt-edited hps">En el</span> <strong><span class="alt-edited hps">DOMi </span></strong></span><span lang="es"><span>, haga clic</span> <span class="hps">en un nodo</span> </span><code><small>STRONG</small></code>.</p>
-
-<p><span id="result_box" lang="es"><span class="hps">Utilice</span> el <span class="hps">panel de la derecha</span> <span class="hps">de</span> <span class="alt-edited hps">Domi</span> <span class="hps">para encontrar </span><span class="alt-edited hps">el </span></span><span id="result_box" lang="es"><span class="hps"> nodo de </span></span><span id="result_box" lang="es"><span class="alt-edited hps">color</span><span class="hps"> rojo</span><span>,</span> <span class="hps">y donde</span> <span class="hps">su apariencia </span><span class="hps">es</span> <span class="hps">más relevante que</span> <span class="hps">el texto normal</span><span>.</span></span></p>
-
-<div class="tuto_details" id="tutochallenge">
-<div class="tuto_type">Possible solution</div>
-
-<p>In the menu above the right-hand pane, choose <strong>CSS Rules</strong>. You see two items listed, one that references an internal resource and one that references your stylesheet file. The internal resource defines the <strong>font-weight</strong> property as <code>bolder</code>; your stylesheet defines the <strong>color</strong> property as <code>red</code>.</p>
-<a class="hideAnswer" href="#challenge">Ocultar solución</a></div>
-<a href="#tutochallenge" title="Ver la posible solución para el problema">Ver la solución para el problema.</a></div>
-
-<h3 id="Utilizando_Web_X-Ray_Goggles"><span class="short_text" id="result_box" lang="es"><span class="hps">Utilizando</span> <span class="hps">Web</span> <span class="hps">X</span><span class="atn">-</span><span>Ray</span> <span class="hps">Goggles</span></span></h3>
-
-<p><a class="link-https" href="https://goggles.webmaker.org/" title="https://secure.toolness.com/webxray/">Web X-Ray Goggles </a><span id="result_box" lang="es"><span class="hps">muestra</span> <span class="hps">menos información que</span> <strong><code><span class="hps">DOM</span> </code></strong><span class="hps">Inspector</span><span>, pero</span> <span class="hps">es</span> <span class="hps">más fácil de</span> <span class="hps">instalar y utilizar.</span></span></p>
-
-<ol>
- <li><span id="result_box" lang="es"><span class="hps">Ir</span> <span class="hps">a la página principal</span> <span class="hps">de</span> <span class="hps">la </span></span> <a class="link-https" href="https://goggles.webmaker.org/" title="https://secure.toolness.com/webxray/">Web X-Ray Goggles</a>.</li>
- <li><span id="result_box" lang="es"><span class="hps">Arrastre el</span> <span class="hps">enlace</span> <span class="hps">bookmarklet</span> <span class="hps">en esa</span> <span class="hps">página a</span> <span class="hps">tu barra de herramientas</span> <span class="hps">del navegador</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">Abra el documento</span> <span class="hps">en versión HTML</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="alt-edited hps">Active</span> <span class="hps">Web</span> <span class="atn hps">X-</span><span>Ray</span> <span class="hps">Goggles</span> <span class="hps">haciendo clic en el</span> <span class="hps">bookmarklet</span> <span class="hps">en</span> <span class="hps">la barra de herramientas</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">Mueva el</span> <span class="alt-edited hps">puntero del ratón</span> <span class="alt-edited hps">por encima de su</span> <span class="alt-edited hps">documento para comprobar</span> <span class="hps">los</span> <span class="hps">elementos en el documento</span><span>.</span></span></li>
-</ol>
-
-<h2 id="¿Y_ahora_qué"><span class="short_text" id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
-
-<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Cascading_and_inheritance", "Cascada y herencia") }}<span id="result_box" lang="es"><span class="alt-edited hps">Si tomaste</span> <span class="alt-edited hps">el reto</span><span class="alt-edited">, usted vera</span> <span class="hps">que</span> <span class="hps">la información de estilo</span>  <span class="hps">interactúa</span> en </span><span id="result_box" lang="es"><span class="hps">más de un lugar, </span></span><span id="result_box" lang="es"><span class="hps">para crear el estilo</span> <span class="hps">final de </span><span class="hps">un elemento.</span> <span class="hps">La <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Cascading_and_inheritance">siguiente página</a></span> <span class="hps">explica</span> <span class="hps">más acerca de estas</span> <span class="hps">interacciones.</span></span></p>
diff --git a/files/es/web/css/introducción/index.html b/files/es/web/css/introducción/index.html
deleted file mode 100644
index 09177572fa..0000000000
--- a/files/es/web/css/introducción/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: Introducción
-slug: Web/CSS/Introducción
-tags:
-  - CSS
-  - 'CSS:Introducción'
-  - para_revisar
-translation_of: Learn/CSS/First_steps
-translation_of_original: Web/Guide/CSS/Getting_started
----
-<h2 id="Presentación"><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Presentación</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Este tutorial es una introducción a las hojas de estilo en cascada (Cascading Style Sheets o CSS).</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Además, te guía a través de las características básicas de CSS con ejemplos prácticos que puedes probar por ti mismo en tu propio equipo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Está dividido en dos partes.</span></span></p>
-
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La parte I ilustra las características estándar de CSS que funcionan en los navegadores Mozilla y también en la mayoría de los navegadores modernos.</span></span></li>
-</ul>
-
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La parte II contiene algunos ejemplos de características especiales que funcionan en Mozilla, pero no necesariamente en otros entornos.</span></span></li>
-</ul>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El tutorial se basa en la <a class="external" href="http://www.w3.org/TR/CSS21/" title="http://www.w3.org/TR/CSS21/">Especificación CSS 2.1</a> .</span></span></p>
-
-<h3 id="¿Quién_debe_usar_este_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">¿Quién debe usar este tutorial?</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Este tutorial es sobre todo para los principiantes en CSS, pero también lo puedes usar si tienes alguna experiencia en CSS.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si eres principiante en CSS, usa la parte I de este tutorial para entender CSS y aprender a usarlo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">A continuación, utiliza la parte II para comprender el ámbito de aplicación de CSS en Mozilla.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si sabes algo de CSS, puede omitir las partes de la guía de aprendizaje que ya conoces y sólo utilizar las partes que te interesen.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si tienes experiencia en CSS, pero no en Mozilla, puedes saltar a la parte II.</span></span></p>
-
-<h3 id="¿Qué_se_necesita_antes_de_empezar"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">¿Qué se necesita antes de empezar?</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para aprovechar al máximo este tutorial, necesitas un editor para archivos de texto y un navegador Mozilla (Firefox o Mozilla Suite).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">También debes saber cómo utilizarlos de forma básica.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no deseas editar los archivos, entonces puedes leer el tutorial y ver las fotos, pero es una forma menos eficaz de aprender.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Algunas partes del tutorial, que son opcionales, requieren otro software de Mozilla.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no quieres descargar otros software de Mozilla, entonces puedes saltártelas.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El otro software de Mozilla al que hace referencia este tutorial incluye:</span></span></p>
-
-<ul>
- <li><a href="/en/DOM_Inspector" title="en/Dom inspector"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Inspector DOM</span></span></a></li>
-</ul>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota:</strong> CSS ofrece distintas maneras de trabajar con el color, por lo que las partes de este tutorial dependen de él.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Sólo puedes utilizar estas partes del tutorial fácilmente si dispones de una pantalla en color y de visión del color normal.</span></span></p>
-
-<h3 id="Cómo_utilizar_este_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Cómo utilizar este tutorial</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para utilizar este tutorial, lee las páginas con atención y en orden.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si se te pasa una página, tal vez te resulte difícil de entender las páginas siguientes.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En cada página, utiliza la sección de <em>Información</em> para entender cómo funciona CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Usa la sección <em>Acción</em> para tratar de usar CSS en tu propio equipo.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para controlar que has comprendido los contenidos, acepta el reto al final de cada página.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las soluciones a los retos están enlazadas debajo de los retos, por lo que no es necesario verlos si no quieres.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para entender CSS en mayor profundidad, lee la información que se encuentra en las cajas con el título <em>Más detalles.</em></span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Utiliza los enlaces que hay para encontrar información de referencia acerca de CSS.</span></span></p>
-
-<h2 id="Parte_I_del_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Parte I del tutorial </span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una guía paso a paso básica para CSS.</span></span></p>
-
-<ol>
- <li><strong><a href="/es/docs/Web/CSS/Como_iniciar/Que_es_CSS" title="es/docs/Web/CSS/Como iniciar/Que es CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Qué es CSS</span></span></a></strong></li>
- <li><strong><a href="/es/docs/Web/CSS/Como_iniciar/Por_que_usar_CSS" title="es/docs/Web/CSS/Como iniciar/Por que usar CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por qué usar CSS</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting Started/How CSS works"><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cómo funciona CSS</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Cascading_and_inheritance" title="en/CSS/Getting Started/Cascading and inheritance"><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Cascada y herencia</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Selectors" title="en/CSS/Getting Started/Selectors"><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Selectores</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Readable_CSS" title="en/CSS/Getting Started/Readable CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">CSS legibles </span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Text_styles" title="en/CSS/Getting Started/Text styles"><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Estilos de texto</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Color" title="en/CSS/Getting_Started/Color">Color</a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Content" title="en/CSS/Getting Started/Content"><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-99 goog-gtc-translatable" dir="ltr">Contenido</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Lists" title="en/CSS/Getting Started/Lists"><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Listas</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Boxes" title="en/CSS/Getting Started/Boxes"><span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Cajas</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Layout" title="en/CSS/Getting Started/Layout"><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Diseño</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/Tables" title="en/CSS/Getting Started/Tables"><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Tablas</span></span></a></strong></li>
- <li><strong><a href="/es/docs/Web/CSS/Introducción/Media" title="es/docs/Web/CSS/Introducción/Media"><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Multimedia</span></span></a></strong></li>
-</ol>
-
-<h2 id="Parte_II_del_tutorial"><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Parte II del tutorial</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Ejemplos que muestran el ámbito de aplicación de CSS en Mozilla.</span></span></p>
-
-<ol>
- <li><strong><a href="/en/CSS/Getting_Started/JavaScript" title="en/CSS/Getting Started/JavaScript"><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">JavaScript</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/XBL_bindings" title="en/CSS/Getting Started/XBL bindings"><span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Enlaces XBL</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/XUL_user_interfaces" title="en/CSS/Getting Started/XUL user interfaces"><span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Interfaces de usuario XUL</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/SVG_graphics" title="en/CSS/Getting Started/SVG graphics"><span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Gráficos SVG</span></span></a></strong></li>
- <li><strong><a href="/en/CSS/Getting_Started/XML_data" title="en/CSS/Getting Started/XML data"><span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Datos XML</span></span></a></strong></li>
-</ol>
-
-<p>{{ languages( { "en": "en/CSS/Getting_Started", "de": "de/CSS/Einführung", "fr": "fr/CSS/Premiers_pas", "it": "it/Conoscere_i_CSS", "ja": "ja/CSS/Getting_Started", "nl": "nl/CSS/Voor_Beginners", "pl": "pl/CSS/Na_pocz\u0105tek", "pt": "pt/CSS/Como_come\u00e7ar", "zh-cn": "cn/CSS/\u5f00\u59cb" } ) }}</p>
diff --git a/files/es/web/css/introducción/layout/index.html b/files/es/web/css/introducción/layout/index.html
deleted file mode 100644
index f71d3a82e6..0000000000
--- a/files/es/web/css/introducción/layout/index.html
+++ /dev/null
@@ -1,384 +0,0 @@
----
-title: Layout
-slug: Web/CSS/Introducción/Layout
-translation_of: Learn/CSS/CSS_layout
-translation_of_original: Web/Guide/CSS/Getting_started/Layout
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Boxes", "Boxes")}}Esta es la 12ª sección del tutorial CSS Getting Started; Describe algunas maneras de ajustar el diseño de su documento. Cambia el diseño de su documento de ejemplo.</p>
-
-<h2 class="clearLeft" id="Informacion_Layout">Informacion: Layout</h2>
-
-<p>Puede utilizar CSS para especificar varios efectos visuales que cambian el diseño de su documento. Algunas de las técnicas para especificar el diseño son avanzadas, y más allá del alcance de este tutorial básico.</p>
-
-<p>Cuando diseña un diseño para que se vea similar en muchos navegadores, su hoja de estilo interactúa con la hoja de estilo y el motor de diseño predeterminados del navegador de formas que pueden ser complejas. Este es también un tema avanzado, más allá del alcance de este tutorial básico.</p>
-
-<p>Esta página describe algunas técnicas sencillas que puedes probar.</p>
-
-<h3 id="Estructura_del_documento">Estructura del documento</h3>
-
-<p>Si desea controlar el diseño de su documento, es posible que deba cambiar su estructura.</p>
-
-<p>El lenguaje de marcado del documento puede tener etiquetas de propósito general para crear la estructura. Por ejemplo, en HTML puede utilizar el elemento {{HTMLElement ('div')}} para crear una estructura.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<p>Ejemplo</p>
-
-<p>En su documento de ejemplo, los párrafos numerados en el segundo encabezado no tienen un contenedor propio.</p>
-
-<p>Su hoja de estilo no puede dibujar un borde alrededor de esos párrafos, porque no hay ningún elemento que especificar en el selector.</p>
-
-<p>Para solucionar este problema estructural, puede agregar una etiqueta {{HTMLElement ('div')}} alrededor de los párrafos. Esta etiqueta es única, por lo que puede identificarse con un atributo id:</p>
-</div>
-
-<pre class="brush:html;highlight:[2,8]">&lt;h3&gt;Numbered paragraphs&lt;/h3&gt;
-&lt;div id="numbered"&gt;
-  &lt;p&gt;Lorem ipsum&lt;/p&gt;
-  &lt;p&gt;Dolor sit&lt;/p&gt;
-  &lt;p&gt;Amet consectetuer&lt;/p&gt;
-  &lt;p&gt;Magna aliquam&lt;/p&gt;
-  &lt;p&gt;Autem veleum&lt;/p&gt;
-&lt;/div&gt;
-</pre>
-
-<p>Ahora su hoja de estilos puede utilizar una regla para especificar bordes alrededor de ambas listas:</p>
-
-<pre class="brush:css">ul, #numbered {
-  border: 1em solid #69b;
-  padding-right:1em;
-}
-</pre>
-
-<p>  El resultado se ve así: </p>
-
-<table style="background-color: white; border: 2px outset #3366bb; padding: 1em; width: 30em;">
- <tbody>
-  <tr>
-   <td>
-    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
-
-    <div style="border: 12px solid #69b; margin-bottom: 16px; padding: 1em;">
-    <ul style="">
-     <li>Arctic</li>
-     <li>Atlantic</li>
-     <li>Pacific</li>
-     <li>Indian</li>
-     <li>Southern</li>
-    </ul>
-    </div>
-
-    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
-
-    <div style="border: 12px solid #69b; margin-bottom: 8px; padding: 0px 12em 0px .5em;">
-    <p><strong>1: </strong>Lorem ipsum</p>
-
-    <p><strong>2: </strong>Dolor sit</p>
-
-    <p><strong>3: </strong>Amet consectetuer</p>
-
-    <p><strong>4: </strong>Magna aliquam</p>
-
-    <p><strong>5: </strong>Autem veleum</p>
-    </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Unidades_de_tamaño">Unidades de tamaño</h3>
-
-<p>Hasta ahora en este tutorial, se han especificado tamaños en píxeles (px). Estos son apropiados para algunos propósitos en un dispositivo de visualización como una pantalla de computadora. Pero cuando el usuario cambia el tamaño de fuente, su diseño puede parecer incorrecto.</p>
-
-<p>Para muchos propósitos es mejor especificar tamaños como un porcentaje o en ems (em). Un em es nominalmente el tamaño de la fuente actual (el ancho de una letra m). Cuando el usuario cambia el tamaño de fuente, su diseño se ajusta automáticamente.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<p>Ejemplo</p>
-
-<p>El borde a la izquierda de este texto tiene su tamaño especificado en píxeles.</p>
-
-<p>El borde de la derecha tiene su tamaño especificado en ems.</p>
-
-<p>En su navegador, cambie el tamaño de la fuente para ver cómo se ajusta el borde de la derecha pero el borde de la izquierda no:</p>
-</div>
-
-<table style="background-color: white; border: 2px outset #3366bb; padding: 1em;">
- <tbody>
-  <tr>
-   <td>
-    <div style="">RESIZE ME PLEASE</div>
-   </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type">
-<p>Más detalles</p>
-
-<p>Para otros dispositivos, otras unidades de longitud son apropiadas.</p>
-
-<p>Hay más información sobre esto en una página posterior de este tutorial.</p>
-
-<p>Para obtener detalles completos de los valores y unidades que puede utilizar, consulte Valores en la especificación CSS.</p>
-</div>
-</div>
-
-<h3 id="Diseño_del_texto">Diseño del texto</h3>
-
-<p>Dos propiedades especifican cómo está alineado el contenido de un elemento. Puede usarlos para ajustes sencillos de diseño:</p>
-
-<p>{{Cssxref ('text-align')}}</p>
-
-<p><br>
-   Alinea el contenido. Utilice uno de estos valores: izquierda, derecha, centro, justificar<br>
- {{Cssxref ('texto-sangría')}}<br>
-     Indente el contenido en una cantidad que especifique.</p>
-
-<p>Estas propiedades se aplican a cualquier contenido similar al texto del elemento, no sólo al texto real. Recuerde que son heredados por los hijos del elemento, por lo que es posible que tenga que desactivarlos explícitamente en los niños para evitar resultados sorprendentes.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<p>Ejemplo</p>
-
-<p>Para centrar los títulos:</p>
-</div>
-
-<pre class="brush:css">h3 {
-  border-top: 1px solid gray;
-  text-align: center;
-}
-</pre>
-
-<p>Resultado:</p>
-
-<table style="background-color: white; border: 2px outset #3366bb; padding: 1em; width: 30em;">
- <tbody>
-  <tr>
-   <td>
-    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray; text-align: center;">(A) The oceans</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>En un documento HTML, el contenido que ve debajo de un encabezado no está estructuralmente contenido por el encabezado. Así que cuando alineas un encabezado como este, las etiquetas debajo del encabezado no heredan el estilo.</p>
-</div>
-
-<h3 id="Floats">Floats</h3>
-
-<p>La propiedad {{cssxref ('float')}} fuerza un elemento a la izquierda oa la derecha. Esta es una forma sencilla de controlar su posición y tamaño.</p>
-
-<p>El resto del contenido del documento fluye normalmente alrededor del elemento flotante. Puede controlar esto usando la propiedad {{cssxref ('clear')}} en otros elementos para hacerlos permanecer alejados de los flotadores.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<p>Ejemplo</p>
-
-<p>En el documento de ejemplo, las listas se extienden por la ventana. Puede evitarlo flotando hacia la izquierda.</p>
-
-<p>Para mantener los encabezados en su lugar, también debe especificar que se mantengan alejados de los flotadores a su izquierda:</p>
-</div>
-
-<pre class="brush:css">ul, #numbered {float: left;}
-h3 {clear: left;}
-</pre>
-</div>
-
-<p>El resultado sería:</p>
-
-<table style="background-color: white; border: 2px outset #3366bb; padding: 1em; width: 30em;">
- <tbody>
-  <tr>
-   <td>
-    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
-
-    <div style="float: left; border: 12px solid #69b; margin-bottom: 16px; padding-left: 1em;">
-    <ul style="">
-     <li>Arctic</li>
-     <li>Atlantic</li>
-     <li>Pacific</li>
-     <li>Indian</li>
-     <li>Southern</li>
-    </ul>
-    </div>
-
-    <p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
-
-    <div style="float: left; border: 12px solid #69b; margin-bottom: 8px; padding-left: .5em;">
-    <p><strong>1: </strong>Lorem ipsum</p>
-
-    <p><strong>2: </strong>Dolor sit</p>
-
-    <p><strong>3: </strong>Amet consectetuer</p>
-
-    <p><strong>4: </strong>Magna aliquam</p>
-
-    <p><strong>5: </strong>Autem veleum</p>
-    </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>(Un poco de relleno es necesario a la derecha de las cajas, donde el borde es demasiado cerca del texto.)</p>
-
-<h3 id="Posicionamiento">Posicionamiento</h3>
-
-<p>Puede especificar la posición de un elemento de cuatro formas especificando la propiedad {{cssxref ('position')}} y uno de los siguientes valores.</p>
-
-<p>Estas son propiedades avanzadas. Es posible utilizarlos de manera sencilla, por eso se mencionan en este tutorial básico. Pero puede ser difícil usarlos para diseños complejos.</p>
-
-<p>relativo</p>
-
-<p><br>
-   La posición del elemento se desplaza en relación con su posición normal. Utilícelo para desplazar un elemento por una cantidad especificada. A veces se puede utilizar el margen del elemento para lograr el mismo efecto.<br>
- fijo<br>
-     La posición del elemento es fija. Especifique la posición del elemento en relación con la ventana del documento. Incluso si el resto del documento se desplaza, el elemento permanece fijo.<br>
- absoluto<br>
-     La posición del elemento es fija con relación a un elemento padre. Sólo un padre que está posicionado con relativo, fijo o absoluto hará. Puede hacer que cualquier elemento padre sea adecuado especificando position: relative; Para ello sin especificar ningún cambio.<br>
- estático<br>
-     El valor por defecto. Utilice este valor si necesita desactivar la posición de forma explícita.</p>
-
-<p>Junto con estos valores de la propiedad de posición (a excepción de estática), especifique una o más de las propiedades: superior, derecha, inferior, izquierda, anchura, altura para identificar dónde desea que aparezca el elemento y tal vez también su tamaño.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<p>Ejemplo</p>
-
-<p>Para colocar dos elementos uno encima del otro, cree un contenedor principal en el documento con los dos elementos dentro de él:</p>
-</div>
-
-<pre class="brush:html">&lt;div id="parent-div"&gt;
-  &lt;p id="forward"&gt;/&lt;/p&gt;
-  &lt;p id="back"&gt;\&lt;/p&gt;
-&lt;/div&gt;
-</pre>
-
-<p>En su hoja de estilos, haga que la posición de los padres sea relativa. No hay necesidad de especificar ningún cambio real. Haga que la posición de los niños sea absoluta:</p>
-
-<pre class="brush:css">#parent-div {
-  position: relative;
-  font: bold 200% sans-serif;
-}
-
-#forward, #back {
-  position: absolute;
-  margin:0px; /* no hay margenes alrededor del elemento */
-  top: 0px; /* distancia desde la parte superior */
-  left: 0px; /* distancia desde la izquierda */
-}
-
-#forward {
-  color: blue;
-}
-
-#back {
-  color: red;
-}
-</pre>
-
-<p>El resultado se ve así, con la barra invertida en la parte superior de la barra inclinada:</p>
-
-<div style="position: relative; left: .33em; font: bold 300% sans-serif;">
-<p style="position: absolute; margin: 0px; top: 0px; left: 0px; color: blue;">/</p>
-
-<p style="position: absolute; margin: 0px; top: 0px; left: 0px; color: red;">\</p>
-</div>
-
-<table style="background-color: white; border: 2px outset #3366bb; height: 5em; padding: 1em; width: 30em;">
- <tbody>
-  <tr>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type">
-<p>Más detalles</p>
-
-<p>La historia completa sobre posicionamiento toma dos capítulos complejos en la Especificación CSS: Modelo de formato visual y detalles del modelo de formato Visual.</p>
-
-<p>Si está diseñando hojas de estilo para trabajar en muchos navegadores, también debe tener en cuenta las diferencias en la forma en que los navegadores interpretan el estándar y quizás errores en versiones concretas de navegadores particulares.</p>
-</div>
-</div>
-
-<h2 id="Action_Specifying_layout">Action: Specifying layout</h2>
-
-<ol>
- <li>Cambie el documento de ejemplo, doc2. Html y hoja de estilo, style2. Css, utilizando los ejemplos anteriores en las secciones Estructura de documento y flotantes.</li>
- <li>En el ejemplo Flotantes, agregue relleno para separar el texto del borde derecho por 0. 5 em.</li>
-</ol>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<p>Cambios</p>
-
-<p>Cambie el documento de ejemplo, doc2. Html, agregando esta etiqueta a ella cerca del final, justo antes de &amp;lt;/ body&amp;gt;.</p>
-</div>
-
-<pre class="brush:html">&lt;img id="fixed-pin" src="Yellow-pin.png" alt="Yellow map pin"&gt;
-</pre>
-
-<p>Si no descargó el archivo de imagen anteriormente en este tutorial, descárguelo ahora y colóquelo en el mismo directorio que los demás archivos de ejemplo:</p>
-
-<table style="border: 2px solid #cccccc;">
- <tbody>
-  <tr>
-   <td><img alt="Image:Yellow-pin.png" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Predecir dónde aparecerá la imagen en el documento. A continuación, actualice su navegador para ver si estaba correcto.</p>
-
-<p>Agregue una regla a su hoja de estilos que coloque la imagen en la parte superior derecha de su documento.</p>
-
-<p>Actualiza tu navegador y haz que la ventana sea pequeña. Compruebe que la imagen permanece en la parte superior derecha incluso cuando se desplaza el documento:</p>
-
-<div style="position: relative; width: 29.5em; height: 18em;">
-<div style="overflow: auto; border: 2px outset #36b; padding: 1em; width: 29em; height: 16em; background-color: white;">
-<p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(A) The oceans</p>
-
-<div style="float: left; border: 12px solid #69b; margin-bottom: 16px; padding: 0px .5em 0px 1em;">
-<ul style="">
- <li>Arctic</li>
- <li>Atlantic</li>
- <li>Pacific</li>
- <li>Indian</li>
- <li>Southern</li>
-</ul>
-</div>
-
-<p style="font-weight: bold; font-size: 133%; margin-bottom: .3em; padding-top: .4em; padding-bottom: .16em; border-top: 1px solid gray;">(B) Numbered paragraphs</p>
-
-<div style="float: left; border: 12px solid #69b; padding: 0 .5em 0 .5em;">
-<p><strong>1: </strong>Lorem ipsum</p>
-
-<p><strong>2: </strong>Dolor sit</p>
-
-<p><strong>3: </strong>Amet consectetuer</p>
-
-<p><strong>4: </strong>Magna aliquam</p>
-
-<p><strong>5: </strong>Autem veleum</p>
-</div>
-
-<p style=""> </p>
-
-<div style="position: absolute; top: 2px; right: 0px;"><img alt="Yellow map pin" class="internal" src="https://mdn.mozillademos.org/files/924/Yellow-pin.png"></div>
-</div>
-</div>
-</div>
-
-<p><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Layout" title="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Layout"> See a solution to this challenge.</a></p>
-
-<h2 id="What_next">What next?</h2>
-
-<p>{{ nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Tables", "Tables") }}Usted acaba de cubrir todos los temas en este tutorial básico de CSS. La siguiente página describe selectores más avanzados para reglas CSS y algunas maneras específicas en las que puede diseñar tablas.</p>
diff --git a/files/es/web/css/introducción/los_colon_estilos_de_texto/index.html b/files/es/web/css/introducción/los_colon_estilos_de_texto/index.html
deleted file mode 100644
index 1788c8c0ee..0000000000
--- a/files/es/web/css/introducción/los_colon_estilos_de_texto/index.html
+++ /dev/null
@@ -1,156 +0,0 @@
----
-title: Los estilos de texto
-slug: 'Web/CSS/Introducción/Los:estilos_de_texto'
-translation_of: Learn/CSS/Styling_text/Fundamentals
-translation_of_original: Web/Guide/CSS/Getting_started/Text_styles
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Esta es la sección séptima del</span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> tutorial</span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="es-es / docs / Web / guía / CSS / Primeros pasos"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">CSS Introducción</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> ; </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">da más ejemplos de estilos de texto.</span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Usted modificara su hoja de estilo de ejemplo para utilizar diferentes fuentes.</span></font></font></p>
-
-<h2 class="clearLeft" id="Los_estilos_de_texto_Información"><span id="result_box" lang="es"><span class="hps">Los estilos de texto</span><span>: Información</span></span></h2>
-
-<p><span id="result_box" lang="es"><span class="hps">CSS</span> <span class="hps">tiene varias propiedades</span> <span class="hps">de</span> </span><span id="result_box" lang="es"><span class="hps">estilo</span><span> de </span></span><span id="result_box" lang="es"><span class="hps">texto</span> <span>.</span></span></p>
-
-<p style="margin: 0px 0px 24px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Hay una propiedad abreviada conveniente, </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">la fuente</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> , que se puede utilizar para especificar varios aspectos a la vez, por ejemplo:</span></font></font></p>
-
-<ul style="margin: 0px 0px 24px; padding: 0px 0px 0px 40px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);">
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Negrita, cursiva, y small-caps (versalita)</span></font></font></li>
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">El tamaño</span></font></font></li>
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">La altura de la línea</span></font></font></li>
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">El tipo de letra</span></font></font></li>
-</ul>
-
-<div class="tuto_example">
-<div class="tuto_type">
-<div class="tuto_type" style="margin: 0px; padding: 0px; border: 0px; font-weight: 700; text-align: left; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-indent: 0px; text-transform: none; white-space: normal;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ejemplo</span></font></font></div>
-
-<pre class="brush:css  language-css" style="margin: 0px 0px 20px; padding: 1em 0px 1em 30px; border-width: 0px 0px 0px 6px; border-left-style: solid; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; line-height: 19px; color: rgb(77, 78, 83); overflow: auto; direction: ltr; text-align: left; white-space: pre; position: relative; text-shadow: none; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; background: 50% 0% rgb(250, 251, 252);"><code class="language-css" style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; text-align: left; white-space: pre; color: rgb(77, 78, 83); text-shadow: none;"><span class="token selector" style="margin: 0px; padding: 0px; border: 0px; color: rgb(102, 153, 0);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">p </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">{ </span></font></font></span><span class="token property" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 0, 85);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">fuente </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">:</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> cursiva 75% / 125% </span></font></font><span class="token string" style="margin: 0px; padding: 0px; border: 0px; color: rgb(166, 127, 89); background: rgba(255, 255, 255, 0.498039);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">"Comic Sans MS"</span></font></font></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> , cursive </span></font></font><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">; </span></font></font></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; color: rgb(153, 153, 153);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">}</span></font></font></span></code></pre>
-</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Esta regla</span> <span class="hps">establece</span> varias <span class="hps">propiedades de la fuente</span><span class="alt-edited">, poniendo</span> <span class="hps">todos los párrafos</span> <span class="hps">en</span></span> italic.</p>
-
-<p><span id="result_box" lang="es"><span class="hps">El tamaño de fuente</span> <span class="hps">se establece en</span> <span class="hps">tres cuartas partes del</span> <span class="hps">tamaño</span> </span><span id="result_box" lang="es"><span class="hps">en </span><span class="hps">cada</span></span><span id="result_box" lang="es"> </span><span id="result_box" lang="es"><span class="hps">párrafo</span><span> </span></span><span id="result_box" lang="es"><span class="hps alt-edited">del elemento padre</span><span>,</span>  <span class="hps">y</span> <span class="hps alt-edited">el</span> <span class="hps alt-edited">interlíneado</span> <span class="hps">se establece en</span> <span class="hps">125</span><span class="atn">% (</span><span>un poco más</span> <span class="hps">separados</span> <span class="hps">de lo normal)</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps">tipo de letra</span> <span class="hps">se establece en</span> <span class="hps">Comic</span> <span class="hps">Sans</span> <span class="hps">MS</span><span>,</span> <span class="hps">pero si</span> <span class="hps">este tipo de letra</span> <span class="hps">no está disponible,</span> <span class="hps">el navegador</span> <span class="hps">utilizará</span> <span class="hps alt-edited">por</span> <span class="hps">defecto</span> <span class="hps">tipografía</span> <span class="hps">cursiva</span> <span class="hps">(</span></span>hand-written<span lang="es"><span>)</span><span>.</span></span></p>
-
-<p><span lang="es"><span class="hps">La</span> <span class="hps">regla tiene</span> <span class="hps alt-edited">el efecto colateral</span> <span class="hps alt-edited">de desactivar</span> <span class="hps alt-edited">las</span> <span class="hps alt-edited">versalitas</span> <span class="hps">y</span> <span class="hps alt-edited">negritas</span> <span class="hps atn">(</span><span>estableciendo su valor </span><span class="hps alt-edited">en normal)</span><span>:</span></span></p>
-</div>
-
-<h3 id="Tipos_de_fuentes"><span id="result_box" lang="es"><span class="hps alt-edited">Tipos de fuentes</span></span></h3>
-
-<p><span id="result_box" lang="es"><span class="hps">No se puede predecir</span> <span class="hps">qué</span> tipografías </span><span id="result_box" lang="es"><span class="hps alt-edited">tienen</span><span> </span></span><span id="result_box" lang="es"><span class="hps alt-edited">los lectores de</span> nuestro <span class="hps">documento</span> <span>.</span> <span class="hps">Así que</span> <span class="hps alt-edited">cuando se especifica</span> <span class="hps alt-edited">llos tipos de fuentes </span><span class="hps alt-edited">de las </span><span class="hps alt-edited">letra</span><span>s</span><span>, es</span> <span class="hps">buena</span> <span class="hps alt-edited">idea darle</span> <span class="hps alt-edited">una lista alternativa</span> <span class="hps">en orden de preferencia</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps alt-edited">Finalice la</span> <span class="hps">lista</span> <span class="hps">con uno de los</span> <span class="hps alt-edited">las tipografías</span> por defecto<span class="hps alt-edited">:</span> </span><code>serif</code>, <code>sans-serif</code>, <code>cursive</code>, <code>fantasy</code> or <code>monospace</code>.</p>
-
-<p><span lang="es"><span class="hps">Si el</span> <span class="hps">tipo de letra</span> <span class="hps alt-edited">no es compatible con</span> <span class="hps alt-edited">alguna de los caracteres</span> <span class="hps alt-edited">del documento</span><span>, el navegador</span> <span class="hps alt-edited">puede sustituirlos por</span> <span class="hps alt-edited">una tipografía</span> <span class="hps">diferente.</span> <span class="hps">Por ejemplo, el</span> <span class="hps">documento puede contener</span> <span class="hps">caracteres especiales que</span> </span><span style="color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; display: inline !important; float: none; background-color: rgb(255, 255, 255);">el tipo de letra no admite.</span><span lang="es"> <span class="hps">Si</span> <span class="hps">el navegador puede</span> <span class="hps">encontrar otro</span> <span class="hps alt-edited">tipografía que</span> <span class="hps">tiene esos</span> <span class="hps">caracteres</span><span>,</span> <span class="hps alt-edited">entonces usará</span> <span class="hps">otro</span> <span class="hps alt-edited">tipo de fuente</span></span></p>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar un tipo de letra por sí misma, utilizar el </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-family" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-family</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> propiedad.</span></font></font></p>
-
-<h3 id="Los_tamaños_de_la_fuente"><span id="result_box" lang="es"><span title="Font sizes
-
-">Los tamaños de la fuente</span></span></h3>
-
-<p><span id="result_box" lang="es"><span title="Browser users can override the default font sizes or change the text size while they read a page, so it makes good sense for you to use relative sizes wherever you can.
-">Los usuarios de navegadores pueden anular los tamaños de fuente por defecto o cambiar el tamaño del texto mientras leen una página, así que tiene buen sentido utilizar tamaños relativos donde se pueda.</span></span></p>
-
-<p><span id="result_box" lang="es"><span title="You can use some built-in values for font sizes, like small, medium and large.">Puede utilizar algunos valores incorporados para tamaños de fuentes,  </span></span><code>like</code> <code>small</code>, <code>medium</code> and <code>large</code> (<span id="result_box" lang="es"><span title="You can use some built-in values for font sizes, like small, medium and large.">pequeñas, medianas y grandes)</span></span> . <span id="result_box" lang="es"><span title="You can also use values relative to the font size of the parent element, like: smaller, larger, 150% or 1.5em.">También puede utilizar valores relativos al tamaño de fuente del elemento padre, </span></span>l<code>ike</code><code>: smaller, larger, 150% or 1.5em</code>. ( <span id="result_box" lang="es"><span title="You can also use values relative to the font size of the parent element, like: smaller, larger, 150% or 1.5em.">más pequeño, más grande, 150% o 1.5em.)</span></span>. <span id="result_box" lang="es"><span title='An "em" is equivalent to the width of the letter "m" (for the font size of the parent element);'>Un "em" es equivalente a la anchura de la letra "m" (para el tamaño de fuente del elemento padre); </span><span title="thus 1.5em is one-and-a-half times the size of the font of the parent element.
-">así 1.5em es una vez y media el tamaño de la fuente del elemento padre.</span></span></p>
-
-<p><span id="result_box" lang="es"><span title="If necessary you can specify an actual size, like: 14px (14 pixels) for a display device or 14pt (14 points) for a printer.">Si es necesario, puede especificar como tamaño actual, : 14px (14 píxeles) para un dispositivo de visualización o 14pt (14 puntos) para una impresora.</span></span><span lang="es"><span title="If necessary you can specify an actual size, like: 14px (14 pixels) for a display device or 14pt (14 points) for a printer."> Esto no es accesible para los usuarios con discapacidad visual, ya que no les permite cambiar el tamaño. Una estrategia más accesible es establecer un valor incorporado como mediano en un elemento en la parte superior del documento, y luego fijar tamaños relativos a todos los elementos descendientes.</span></span></p>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar un tamaño de fuente por su cuenta, utilice el </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-size" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-size</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> propiedad.</span></font></font></p>
-
-<h3 id="Altura_de_línea">Altura de línea</h3>
-
-<p><span id="result_box" lang="es"><span class="hps alt-edited">El</span> <span class="hps alt-edited">interlíneado</span> <span class="hps">especifica el</span> <span class="hps">espacio entre líneas</span><span>.</span> <span class="hps">Si el documento tiene</span> <span class="hps">párrafos largos</span> <span class="hps">con</span> <span class="hps">muchas líneas</span><span>,</span> <span class="hps">una separación</span> <span class="hps">más grande de lo</span> <span class="hps">normal,</span> <span class="hps">hace que sea</span> <span class="hps">más fácil de leer</span><span>, especialmente si el</span> <span class="hps">tamaño de la letra</span> <span class="hps">es pequeña</span><span>.</span></span></p>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar una altura de línea por su cuenta, utilice <code>la </code></span></font></font><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">propiedad </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/line-height" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">line-height</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> .</span></font></font></p>
-
-<h3 id="Decoración">Decoración</h3>
-
-<p><span id="result_box" lang="es"><span class="hps alt-edited">La</span> <span class="hps">propiedad independiente </span></span><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">text-decoration</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> </span></font></font><span lang="es"><span class="hps">puede</span> <span class="hps">especificar otros</span> <span class="hps">estilos,</span> <span class="hps">como el</span> <span class="hps">subrayado o</span> <span class="hps">tachado</span><span>.</span> <span class="hps">Usted</span> <span class="hps alt-edited">puede establecerlo en</span> <span class="hps">ninguno</span> ( </span><code>none</code> ) <span lang="es"> <span class="hps alt-edited">para eliminar</span> <span class="hps alt-edited">expresamente</span> <span class="hps">cualquier</span> <span class="hps">decoración.</span></span></p>
-
-<h3 id="Otras_propiedades">Otras propiedades</h3>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar cursiva por su cuenta, use </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-style" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-style</span></font></font></code></a><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> : italic;</span></font></font></code><br>
- <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar audaz por su cuenta, use </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-weight</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> : bold;</span></font></font></code><br>
- <font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para especificar los pequeños capitales en su propio, el uso </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: normal; font-weight: normal; font-family: Consolas, Monaco, 'Andale Mono', monospace; color: rgb(77, 78, 83); font-size: 14px; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none;" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">font-variant</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> : small-caps;</span></font></font></code></p>
-
-<p>Para desactivar o activar cualquiera de estos valores de forma individual, puede especificar su valor como <code>normal</code> <code>o inherit</code>.</p>
-
-<div class="tuto_details">
-<div class="tuto_type">Mas detalles</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Puede especificar</span> <span class="hps">estilos de texto</span> <span class="hps alt-edited">de diversas</span> <span class="hps alt-edited">maneras.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Por ejemplo</span><span>,</span> <span class="hps">algunas de las</span> <span class="hps">propiedades mencionadas</span> <span class="hps">aquí</span> <span class="hps">tienen</span> <span class="hps">otros valores</span> <span class="hps">que se pueden utilizar</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">una hoja de estilo</span> <span class="hps">compleja</span><span>,</span> <span class="hps alt-edited">evite utilizar</span> <span class="hps alt-edited">la propiedad </span></span><code>font</code> <code>shorthand</code><span lang="es"><span class="hps">,</span> <span class="hps">debido a sus</span> <span class="hps">efectos secundarios</span> <span class="hps">(resetean </span><span class="hps">otras propiedades</span> <span class="hps">individuales</span><span>)</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps alt-edited">Para obtener mas detalles de</span> <span class="hps">las propiedades</span> <span class="hps">que se relacionan con</span> <span class="hps">las fuentes, </span></span><span lang="es"><span class="hps">ver</span></span><span lang="es"><span class="hps"> las </span><span class="hps">especificación</span>es <span class="hps">CSS</span></span><span lang="es"> </span><span id="result_box" lang="es"><span class="hps">, </span></span><a class="external" href="http://www.w3.org/TR/CSS21/fonts.html">Fonts</a><span lang="es"><span class="hps">,</span><span>.</span> <span class="hps alt-edited">Si desea más detalles sobre</span> <span class="hps">la decoración de</span> <span class="hps">texto,</span> <span class="hps">ver</span> </span><a class="external" href="http://www.w3.org/TR/CSS21/text.html">Text </a><span lang="es"><span class="hps">.</span></span></p>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Si no quiere depender de los tipos de letra instalados en los sistemas de los usuarios, puede usar </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(244, 244, 244);" title=""><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">@ font-face</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> para especificar una fuente en línea. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Sin embargo, esto requiere que los usuarios tengan un navegador que soporte esta regla.</span></font></font></p>
-</div>
-
-<h2 id="Acción_Especificaciónes_de_las_fuentes"><span id="result_box" lang="es"><span>Acción:</span> <span class="hps">Especificaciónes de</span> <span class="hps">las fuentes</span></span></h2>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Para un simple documento, puede establecer la fuente del </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="El HTML &lt;body> representa el contenido de un documento HTML.  Sólo hay un elemento &lt;body> en un documento."><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">elemento  </span></font></font><code style="margin: 0px; padding: 0px; border: 0px; font-style: inherit; font-weight: inherit; font-family: Consolas, Monaco, 'Andale Mono', monospace;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">&lt;body&gt;</span></font></font></code></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> y el resto del documento hereda la configuración.</span></font></font></p>
-
-<ol>
- <li><span id="result_box" lang="es"><span class="hps">Edite su archivo</span> <span class="hps">CSS</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps alt-edited">Agregue</span> <span class="hps">la siguiente regla</span> <span class="hps">para cambiar</span> <span class="hps">el tipo de letra</span> <span class="hps">en todo el documento</span><span>.</span> <span class="hps">La</span> <span class="hps">parte superior del archivo</span> <span class="hps">CSS</span> <span class="hps">es</span> <span class="hps alt-edited">el lugar lógico</span> <span class="hps alt-edited">para esto</span><span>, pero no tiene</span> <span class="hps alt-edited">los mismos efectos</span> <span class="hps">donde</span> <span class="hps alt-edited">usted lo ponga</span><span>:</span></span>
-  <pre class="eval  language-html"><code class="language-html">body {font: 16px "Comic Sans MS", cursive;}</code></pre>
-
-  <div class="line-number" style="top: 0px;"> </div>
- </li>
- <li><span id="result_box" lang="es"><span class="hps alt-edited">Añada</span> <span class="hps">un comentario</span> <span class="hps alt-edited">que explique</span> <span class="hps">la regla, y</span> <span class="hps alt-edited">agregue un espacio en blanco</span> <span class="hps alt-edited">para que coincida con</span> <span class="hps">su diseño</span> <span class="hps">preferido</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">Guarde el archivo y</span> <span class="hps alt-edited">actualice el explorador</span> <span class="hps">para ver el efecto</span><span>.</span> <span class="hps">Si su sistema tiene</span> <span class="hps">Comic</span> <span class="hps">Sans</span> <span class="hps">MS</span><span>,</span> <span class="hps">u otra</span> <span class="hps">fuente cursiva</span> <span class="hps">que no</span> <span class="hps">soporta </span></span>italic<span lang="es"><span class="hps">,</span> <span class="hps">su navegador</span> eligira <span class="hps">un</span> <span class="hps">tipo de letra</span> <span class="hps">diferente para </span></span><span lang="es"><span class="hps alt-edited">la</span> <span class="hps alt-edited">primera línea</span></span><span lang="es"><span class="hps"> del</span> <span class="hps">texto en </span></span>italic<span lang="es"><span class="hps alt-edited">:</span></span>
-  <table style="border: 2px outset #36b; padding: 1em;">
-   <tbody>
-    <tr>
-     <td style="font: italic 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
-    </tr>
-    <tr>
-     <td style="font: 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
-    </tr>
-   </tbody>
-  </table>
- </li>
- <li style="margin: 0px; padding: 0px 0px 6px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Desde la barra de menú de su navegador, elija </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver&gt; Tamaño del texto&gt; Aumentar</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> (o </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px;"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver&gt; Zoom&gt; Acercar</span></font></font></strong><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> ). </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">A pesar de que ha especificado 16 píxeles en el estilo, un usuario leer el documento se puede cambiar este tamaño.</span></font></font></li>
-</ol>
-
-<div class="tuto_example">
-<div class="tuto_type">Desafío</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Sin modificar nada más</span><span>,</span> <span class="hps">hacer</span> <span class="hps">las seis</span> <span class="hps">letras iniciales</span> <span class="hps">dos veces el tamaño</span> <span class="hps">de</span> <span class="hps">letra serif</span> <span class="hps">por defecto del navegador</span><span>:</span></span></p>
-
-<table>
- <tbody>
-  <tr>
-   <td style="font: italic 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red; font: 200% serif;">C</strong>ascading <strong style="color: green; font: 200% serif;">S</strong>tyle <strong style="color: green; font: 200% serif;">S</strong>heets</td>
-  </tr>
-  <tr>
-   <td style="font: 16px 'Comic Sans MS', cursive; color: blue;"><strong style="color: red; font: 200% serif;">C</strong>ascading <strong style="color: red; font: 200% serif;">S</strong>tyle <strong style="color: red; font: 200% serif;">S</strong>heets</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="tuto_details" id="tutochallenge">
-<div class="tuto_type">Possible solution</div>
-
-<p>Add the following style declaration to the <code>strong</code> rule:</p>
-
-<pre class="brush: css">  font: 200% serif;
-</pre>
-If you use separate declarations for <code>font-size</code> and <code>font-family</code>, then the <code>font-style</code> setting on the first paragraph is <em>not</em> overridden.
-
-<p> </p>
-<a class="hideAnswer" href="#challenge">Hide solution</a></div>
-<a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Text_styles#tutochallenge" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-size: 12px; text-align: right; display: block; font-family: 'Open Sans', sans-serif; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; text-indent: 0px; text-transform: none; white-space: normal;" title="Mostrar una posible solución para el desafío"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">Ver una solución para el desafío.</span></font></font></a></div>
-
-<h2 id="¿Y_ahora_qué"><span id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
-
-<p><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">El documento muestra ya utiliza varios colores con nombre. </span></font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">La </span></font></font><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_Started/Color" style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 149, 221); text-decoration: none; font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);" title="/ En-US / docs / Web / guía / CSS / Getting_Started / Color"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">siguiente sección</span></font></font></a><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;"> enumera los nombres de los colores estándar y se explica cómo se puede especificar otros </span></font></font><strong style="margin: 0px; padding: 0px; border: 0px; color: rgb(77, 78, 83); font-family: 'Open Sans', sans-serif; font-size: 14px; font-style: normal; font-variant: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; background-color: rgb(255, 255, 255);"><font><font><span class="remarkable-pre-marked" style="margin: 0px; padding: 0px; border: 0px; position: relative;">.</span></font></font></strong></p>
-
-<p> </p>
diff --git a/files/es/web/css/introducción/media/index.html b/files/es/web/css/introducción/media/index.html
deleted file mode 100644
index bb7bb0bd23..0000000000
--- a/files/es/web/css/introducción/media/index.html
+++ /dev/null
@@ -1,394 +0,0 @@
----
-title: Media
-slug: Web/CSS/Introducción/Media
-translation_of: Web/Progressive_web_apps/Responsive/Media_types
----
-<p>{{CSSTutorialTOC}} {{previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Tables", "Tables")}}</p>
-
-<p>Esta es la ultima sección de la primera parte del tutorial de <a href="/es/docs/Web/CSS/Introducción" title="es/docs/Web/CSS/Introducción">Introducción a CSS</a>. Muchas páginas de este tutorial se han enfocado en las propiedades y valores de CSS que especifican como mostrar un documento. Esta sección indaga otra vez en el propósito y la estructura de las hojas de estilo.</p>
-
-<h2 class="clearLeft" id="Información_Media">Información: Media</h2>
-
-<p>El propósito de CSS es especificar cómo los documentos son presentados al usuario. La presentación puede tener más de una forma.</p>
-
-<p>Por ejemplo, probablemente estes leyendo esta página en algún aparato doméstico (un celular, tu pc). Pero también podrías querer proyectarlo para una audiencia mas grande o imprimirlo. Estos medios pueden tener diferentes características. CSS te provee diferentes maneras de presentar un documento en distintos medios.</p>
-
-<p>Para especificar reglas para un medio en particular, usa {{CSSXref("@media")}} seguido por el tipo de medio, seguido por llaves que encierren las reglas.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p>Un documento en un web site tiene una barra de navegación que permite a los usuarios moverse en el sitio.</p>
-
-<p>En el lenguaje de marcado, el elemento padre de esta área tiene el <strong>id</strong> <code>nav-area</code>. (En {{HTMLVersionInline(5)}}, esto puede ser marcado con el elemento {{HTMLElement("nav")}} en vez de un {{HTMLElement("div")}} con un atributo <strong>id</strong>.)</p>
-
-<p>Cuando vas a imprimir el documento esa área de navegación no tiene ningún propósito, entonces con las hojas de estilo puedes removerlo completamente:</p>
-
-<pre class="brush:css">@media print {
-  #nav-area {display: none;}
-  }
-</pre>
-</div>
-
-<p>Algunos de los tipos de medios comunes son:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><code>screen</code></td>
-   <td>Pantalla de computadora</td>
-  </tr>
-  <tr>
-   <td><code>print</code></td>
-   <td>Medio paginado</td>
-  </tr>
-  <tr>
-   <td style="padding-right: 1em;"><code>projection</code></td>
-   <td>Pantalla proyectada</td>
-  </tr>
-  <tr>
-   <td><code>all</code></td>
-   <td>Todos (por defecto)</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="tuto_details">
-<div class="tuto_type">Mas detalles</div>
-
-<p>Existen otras maneras de especificar un conjunto de reglas para los distintos medios.</p>
-
-<p>El lenguaje de marcado del documento puede permitir que el tipo de medio sea determinado cuando la hoja de estilo esta enlazada al documento. Por ejemplo, en HTML puedes especificar el tipo de medio con un atributo <code>media</code> en la etiqueta LINK.</p>
-
-<p>En CSS puedes usar {{CSSXref("@import")}} al inicio de la hoja de estilo para importar otra hoja de estilo de una URL, opcionalmente especificando el tipo de medio.</p>
-
-<p>Al usar estas técnicas puedes separar las reglas de estilo para los diferentes medios en distintos archivos. Esta es una manera útil de estructurar tus hojas de estilo.</p>
-
-<p>Para más detalles de los tipos de medio, ve <a href="http://www.w3.org/TR/CSS21/media.html">Media</a> en la especificación de CSS.</p>
-
-<p>Existen mas ejemplos de la propiedad {{cssxref("display")}} en una página posterior de este tutorial: <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/XML_data" title="en-US/docs/Web/Guide/CSS/Getting_Started/XML_data">XML data</a>.</p>
-</div>
-
-<h3 id="Imprimir">Imprimir</h3>
-
-<p>CSS tiene algún soporte especifico para impresión y para medios páginados en general.</p>
-
-<p>Una regla {{cssxref("@page")}} puede determinar los márgenes de la página. Para impresión de doble cara, puedes definir los márgenes separadamente para <code>@page:left</code> y <code>@page:right</code>.</p>
-
-<p>Para medios impresios, normalmente usas unidades apropiadas de lonfigutd como pulgadas (<code>in</code>) y puntos (<code>pt</code> = 1/72 inch), o centimetros (<code>cm</code>) y milimetros (<code>mm</code>). Es igualmente apropiado usar ems (<code>em</code>) para conincidir el tamaño de la fuente, y porcentajes (<code>%</code>).</p>
-
-<p>Tu puedes controlar como los saltos de línea del contenido de un documento, al usar las propiedades {{cssxref("page-break-before")}}, {{cssxref("page-break-after")}} y{{cssxref("page-break-inside")}}.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p>Esta regla determina los márgenes a una pulgada en todos los lados:</p>
-
-<pre class="brush:css">@page {margin: 1in;}
-</pre>
-
-<p>Esta regla asegura que cada elemento H1 empiece en una nueva página:</p>
-
-<pre class="brush:css">h1 {page-break-before: always;}
-</pre>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type">Más detalles</div>
-
-<p>Para más detalles del soporte de CSS para medios paginados, ver <a href="http://www.w3.org/TR/CSS21/page.html">Paged media</a> en la especificación de CSS.</p>
-
-<p>Como otras características de CSS, imprimir depende de tu navegador y su configuración. Por ejemplo, Mozilla te suple con unos márgenes por defecto, cabeceras y pies de página cuando imprimes. Cuando otros usuarios imprimen tu documento, probablemente no puedas predecir el navegador y la configuración usada, por lo que no podrás controlar los resutlados completamente.</p>
-</div>
-
-<h3 id="Interfaces_de_Usuario">Interfaces de Usuario</h3>
-
-<p>CSS tiene algunas propiedades especificas para aparatos que soportanuna interfaz de usuario, como monitores. Esto hace que la apariencia del documento cambie dinámicamente mientras el usuario trabaja con la interfaz.</p>
-
-<p>No existe un tipo especial de medio para aparatos con interfaz de usuario.</p>
-
-<p>Si existen cinco selectores especiales:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><strong>Selector</strong></td>
-   <td><strong>Selects</strong></td>
-  </tr>
-  <tr>
-   <td><code>E{{cssxref(":hover")}}</code></td>
-   <td>Cualquier elemento E que tenga el puntero sobre él</td>
-  </tr>
-  <tr>
-   <td><code>E{{cssxref(":focus")}}</code></td>
-   <td>Cualquier elemento E que tenga el foco del teclado</td>
-  </tr>
-  <tr>
-   <td><code>E{{cssxref(":active")}}</code></td>
-   <td>Cualquier elemento E que este envuelto en la acción actual del usuario</td>
-  </tr>
-  <tr>
-   <td><code>E{{cssxref(":link")}}</code></td>
-   <td>Cualquier elemento E que es un hipervinculo a una URL no visitada por el usuario</td>
-  </tr>
-  <tr>
-   <td><code>E{{cssxref(":visited")}}</code></td>
-   <td>Cualquier elemento E que es un hipervinculo a una URL que el usuario ya visito</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota: </strong>La información que puede ser obtenida con el selector :visited esta restringida en {{gecko("2.0")}}. Ver <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Privacy_and_the_:visited_selector" title="en-US/docs/Web/Guide/CSS/Privacy and the :visited selector">Privacy and the :visited selector</a> para más detalles.</p>
-</div>
-
-<p>La propiedad {{cssxref("cursor")}} especifica la forma del puntero: Algunas de las formas comunes son las siguientes.</p>
-
-<p>Coloca el mouse sobre los items en este lista para ver la forma actual del puntero en tu navegador:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><strong>Selector</strong></td>
-   <td><strong>Selects</strong></td>
-  </tr>
-  <tr style="cursor: pointer;">
-   <td><code>pointer</code></td>
-   <td>Indicating a link</td>
-  </tr>
-  <tr style="cursor: wait;">
-   <td><code>wait</code></td>
-   <td>Indicating that the program cannot accept input</td>
-  </tr>
-  <tr style="cursor: progress;">
-   <td><code>progress</code></td>
-   <td>Indicating that the program is working, but can still accept input</td>
-  </tr>
-  <tr style="cursor: default;">
-   <td><code>default</code></td>
-   <td>The default (usually an arrow)</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Una propiedad {{cssxref("outline")}} crea un contorno que a menudo es usado para indicar el foco del teclado. Sus valores son similares a la propiedad {{cssxref("border")}}, excepto que no puedes especificar lados individuales.</p>
-
-<p>Otras características de las interfaces de usuario son implementadas usando atributos. Por ejemplo, un elemento que esta deshabilitado o es de solo lectura tiene el atributo <strong>disabled</strong> o el atributo <strong>readonly</strong>. Selectores puede especificar estos atributos como cualquier otro, usando corchetes: <code>{{mediawiki.external('disabled')}}</code> o <code>{{mediawiki.external('readonly')}}</code>.</p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p>Estas reglas especifican estilos para un boton que cambia dinámicamente cuando el usuario interactúa con el:</p>
-
-<pre class="brush:css">.green-button {
-  background-color:#cec;
-  color:#black;
-  border:2px outset #cec;
-  }
-
-.green-button[disabled] {
-  background-color:#cdc;
-  color:#777;
-  }
-
-.green-button:active {
-  border-style: inset;
-  }
-</pre>
-
-<p>Esta wiki no soporta una interfaz de usuario en la página, entonces estos botones no hacen "click". A continuación se presentan una imágenes estáticas para ilustrar la idea:</p>
-
-<table style="background-color: #fff; border: 2px outset #36b; padding: 1em;">
- <tbody>
-  <tr>
-   <td>
-    <table>
-     <tbody>
-      <tr>
-       <td><span style="background-color: #cdc; border: 2px outset #cec; color: #777; cursor: default; height: 2em; margin-right: 1em; padding: .5em 1em; width: 8em;">Click Me</span></td>
-       <td><span style="background-color: #cec; border: 2px outset #cec; cursor: move; height: 2em; margin-right: 1em; padding: .5em 1em; width: 8em;">Click Me</span></td>
-       <td><span style="background-color: #cec; border: 2px inset #cec; cursor: move; height: 2em; margin-right: 1em; padding: .5em 1em; width: 8em;">Click Me</span></td>
-      </tr>
-      <tr style="line-height: 25%;">
-       <td> </td>
-      </tr>
-      <tr style="font-style: italic;">
-       <td>disabled</td>
-       <td>normal</td>
-       <td>active</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>Un botón completamente funcional también tiene un contorno oscuro alrededor cuando esta por defecto, y un contorno punteado en él cuando tiene el foco del teclado. También podría un efecto flotante (hover) cuando el puntero este sobre el.</p>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type">Más detalles</div>
-
-<p>Para más información sobre interfaces de usuario en CSS, ver <a href="http://www.w3.org/TR/CSS21/ui.html">User interface</a> en la especificación de CSS.</p>
-
-<p>Existe un ejemplo del lenguaje de marcado usado por Mozilla para interfaces de usuario, XUL, en la Parte II de este tutorial.</p>
-</div>
-
-<h2 id="Acción_Imprimir_un_documento">Acción: Imprimir un documento</h2>
-
-<ol>
- <li>Abrir un nuevo documento HTML, <code>doc4.html</code>. Copiar y pegar el contenido de aqui:
-
-  <pre class="brush:html">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;title&gt;Print sample&lt;/title&gt;
-    &lt;link rel="stylesheet" href="style4.css"&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;h1&gt;Section A&lt;/h1&gt;
-    &lt;p&gt;This is the first section...&lt;/p&gt;
-    &lt;h1&gt;Section B&lt;/h1&gt;
-    &lt;p&gt;This is the second section...&lt;/p&gt;
-    &lt;div id="print-head"&gt;
-      Heading for paged media
-    &lt;/div&gt;
-    &lt;div id="print-foot"&gt;
-      Page:
-    &lt;/div&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
- </li>
- <li>Abrir una nueva hoja de estilo, <code>style4.css</code>. Copiar y pegar el contenido de aqui:
-  <pre class="brush:css">/*** Print sample ***/
-
-/* defaults  for screen */
-#print-head,
-#print-foot {
-  display: none;
-  }
-
-/* print only */
-@media print {
-
-h1 {
-  page-break-before: always;
-  padding-top: 2em;
-  }
-
-h1:first-child {
-  page-break-before: avoid;
-  counter-reset: page;
-  }
-
-#print-head {
-  display: block;
-  position: fixed;
-  top: 0pt;
-  left:0pt;
-  right: 0pt;
-
-  font-size: 200%;
-  text-align: center;
-  }
-
-#print-foot {
-  display: block;
-  position: fixed;
-  bottom: 0pt;
-  right: 0pt;
-
-  font-size: 200%;
-  }
-
-#print-foot:after {
-  content: counter(page);
-  counter-increment: page;
-  }
-
-} /* end print only */
-</pre>
- </li>
- <li>Ve este documento en tu navegador; este usa el estilo por defecto de tu navegador.</li>
- <li>Imprime (o previsualiza) el documento; la hoja de estilo coloca cada sección en una página separada, y agrega una cabecera y un pie de página por cada una. Si tu navegador soporta contadores, le agregará un número de página al pie.
-  <table>
-   <tbody>
-    <tr>
-     <td>
-      <table style="border: 2px outset #36b; padding: 1em;">
-       <tbody>
-        <tr>
-         <td>
-          <table style="margin-right: 2em; width: 15em;">
-           <tbody>
-            <tr>
-             <td>
-              <div style="font-size: 110%; text-align: center; margin-bottom: .5em;">Heading for paged media</div>
-
-              <div style="font-size: 150%; font-weight: bold;">Section A</div>
-
-              <div style="font-size: 75%;">This is the first section...</div>
-
-              <div style="font-size: 150%; text-align: right; margin-top: 12em;">Page: 1</div>
-             </td>
-            </tr>
-           </tbody>
-          </table>
-         </td>
-        </tr>
-       </tbody>
-      </table>
-     </td>
-     <td>
-      <table style="border: 2px outset #36b; padding: 1em;">
-       <tbody>
-        <tr>
-         <td>
-          <table style="margin-right: 2em; width: 15em;">
-           <tbody>
-            <tr>
-             <td>
-              <div style="font-size: 110%; text-align: center; margin-bottom: .5em;">Heading for paged media</div>
-
-              <div style="font-size: 150%; font-weight: bold;">Section B</div>
-
-              <div style="font-size: 75%;">This is the second section...</div>
-
-              <div style="font-size: 150%; text-align: right; margin-top: 12em;">Page: 2</div>
-             </td>
-            </tr>
-           </tbody>
-          </table>
-         </td>
-        </tr>
-       </tbody>
-      </table>
-     </td>
-    </tr>
-   </tbody>
-  </table>
- </li>
-</ol>
-
-<table style="background-color: #fffff4; border: 1px solid #36b; padding: 1em; width: 100%;">
- <caption>Retos</caption>
- <tbody>
-  <tr>
-   <td>Mueve las relgas de estilo especificas para imprimir a un archivo CSS separado.
-    <p>Lee la página de referencia {{CSSXref("@import")}} para buscar detalles de como importar el nuevo archivo CSS especifico para imrpimir dentro de tu hoja de estilo style4.css.</p>
-
-    <p>Haz que las encabezamientos se vuelvan azules cuando el puntero del mouse este sobre ellos.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Media" title="en-US/docs/Web/Guide/CSS/Getting_started/Challenge_solutions#Media">Ver soluciones a estos retos.</a></p>
-
-<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
-
-<p>Si has tenido dificultades entendiendo esta página, o si tienes algún comentario, por favor contribuye en la página de <a href="/Talk:en-US/docs/Web/Guide/CSS/Getting_Started/Media" title="Talk:en-US/docs/Web/Guide/CSS/Getting_Started/Media">Discussion</a>.</p>
-
-<p>Hasta aquí, todas las reglas de estilo en este tutorial han estado en archivos especificos. Las reglas y sus valores son fijos. La siguiente página describe como cambiar las reglas dinámicamente al usar un lenguaje de programación: <strong><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/JavaScript" title="en-US/docs/Web/Guide/CSS/Getting_Started/JavaScript">JavaScript</a></strong></p>
diff --git a/files/es/web/css/introducción/selectors/index.html b/files/es/web/css/introducción/selectors/index.html
deleted file mode 100644
index 9ebe3573e8..0000000000
--- a/files/es/web/css/introducción/selectors/index.html
+++ /dev/null
@@ -1,416 +0,0 @@
----
-title: Selectores
-slug: Web/CSS/Introducción/Selectors
-translation_of: Learn/CSS/Building_blocks/Selectors
-translation_of_original: Web/Guide/CSS/Getting_started/Selectors
----
-<p>{{ CSSTutorialTOC() }}</p>
-
-<p>{{ previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Cascading_and_inheritance", "Cascading &amp; inheritance")}}<span id="result_box" lang="es"><span class="hps">Esta</span> <span class="hps">es</span> <span class="hps">la sección</span> <span class="hps">quinta</span> <span class="hps">del</span> </span><span id="result_box" lang="es"><span class="hps">tutoria</span></span><span class="seoSummary"><a href="/en-US/docs/Web/Guide/CSS/Getting_Started" title="en-US/docs/Web/Guide/CSS/Getting Started">CSS Getting Started</a> ;</span><span id="result_box" lang="es"><span class="hps">En él se explica</span> <span class="hps">cómo se puede aplicar</span> <span class="hps">estilos</span> <span class="hps">de forma selectiva</span><span>,</span> <span class="hps">y cómo</span> <span class="hps">los diferentes tipos de</span> <span class="hps">selectores</span> <span class="hps">tener diferentes</span> <span class="hps">prioridades.</span> <span class="hps">Agregar algunos</span> <span class="hps">atributos a</span> <span class="hps">las</span> <span class="hps">etiquetas</span> <span class="hps">en su</span> <span class="hps">documento de muestra</span><span>,</span> <span class="hps">y</span> <span class="hps">utiliza estos</span> <span class="hps">atributos en</span> <span class="hps">su hoja de estilos</span> <span class="hps">de muestra.</span></span></p>
-
-<h2 class="clearLeft" id="Información_Selectores"><span id="result_box" lang="es"><span class="hps">Información:</span> <span class="hps">Selectores</span></span></h2>
-
-<p><br>
- <span id="result_box" lang="es"><span class="hps">CSS</span> <span class="hps">tiene su propia terminología</span> <span class="hps">para describir el</span> <span class="hps">lenguaje CSS</span><span>.</span> <span class="hps">Anteriormente</span> <span class="hps">en este tutorial,</span> <span class="hps">que ha creado</span> <span class="hps">una línea en</span> <span class="hps">su hoja de estilos</span> <span class="hps alt-edited">como esta:</span></span></p>
-
-<pre class="brush: css">strong {
-  color: red;
-}
-</pre>
-
-<p><span id="result_box" lang="es"><span class="hps">En la terminología de</span> <span class="hps">CSS</span><span>,</span> <span class="hps">toda</span> <span class="hps">esta línea</span> <span class="hps">es una </span></span><em><code><strong>rule </strong></code>(</em><span id="result_box" lang="es"><span class="hps">regla).</span> <span class="hps">Esta regla</span> <span class="hps">comienza con</span> </span><strong><em><code>strong</code></em></strong><span lang="es"><span>, que es un</span> <span class="hps">selector.</span> <span class="hps alt-edited">Permite seleccionar</span> <span class="hps">qué elementos</span> <span class="hps">en el DOM</span> <span class="hps">se aplica la regla</span><span>.</span></span></p>
-
-<div class="tuto_details">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">Más</span> <span class="hps">detalles</span></span></div>
-
-<p><span id="result_box" lang="es"><span class="hps">La parte</span> <span class="hps">interior de las</span> <span class="hps">llaves</span> <span class="hps">es la declaración</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps"> L</span><span class="hps alt-edited">a palabra clave es </span></span><span id="result_box" lang="es"><code><em><span class="hps">color</span></em></code>, que </span><span id="result_box" lang="es"><span class="hps alt-edited">es</span> <span class="hps">una propiedad,</span> <span class="hps">y el <code><em>rojo </em></code>es</span> <span class="hps">el valor.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">El punto y coma</span> <span class="hps">después de el</span> <span class="hps">par</span> <span class="hps">propiedad</span><span class="atn">-</span><span>valor</span> <span class="hps">separa los posibles </span><span class="hps">otros pares de </span> <span class="hps">propiedad</span><span>-valor en</span> una <span class="hps">misma declaración.</span></span></p>
-
-<p> <span id="result_box" lang="es"><span class="hps">Este tutorial</span> <span class="hps">se refiere a</span> <span class="hps">un selector</span> <span class="hps">como</span> </span><em><strong><code>strong</code> </strong></em><span lang="es"><span class="hps">como un</span> <span class="hps">selector de etiquetas</span><span>.</span> <span class="hps">La</span> <span class="hps">especificación</span> <span class="hps">CSS</span> <span class="hps">se refiere a él como</span> <span class="hps">un selector de</span> <span class="hps">tipo <code><strong>(</strong></code></span></span><code><strong> type selector)</strong></code><span lang="es"><span>.</span></span></p>
-</div>
-
-<p><span id="result_box" lang="es"><span class="hps alt-edited">En esta página</span> <span class="hps">del tutorial</span> <span class="hps alt-edited">se explica</span> <span class="hps">más acerca de los</span> <span class="hps">selectores</span> <span class="hps">que se pueden utilizar</span> <span class="hps">en</span> <span class="hps">las reglas CSS</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Además de añadir </span></span><span id="result_box" lang="es"><span class="hps">nombres a las e</span></span><span id="result_box" lang="es"><span class="hps">tiquetas</span> <span>, puede usar </span><span class="hps alt-edited">valores en los atributos</span> de <span class="hps">los selectores</span><span>.</span> <span class="hps">Esto permite que sus</span> <span class="hps">reglas sean</span> <span class="hps">más específicas.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Dos</span> <span class="hps">atributos tienen</span> <span class="hps">un estatus especial</span> <span class="hps">para</span> <span class="hps">CSS</span><span>.</span> <span class="hps">Son</span></span> <a href="/en-US/docs/Web/HTML/Global_attributes#attr-class" title="en-US/docs/Web/HTML/Global_attributes#attr-class"><code>class</code></a> <code>e </code><a href="/en-US/docs/Web/HTML/Global_attributes#id" title="en-US/docs/Web/HTML/Global_attributes#id"><code>id</code></a>.</p>
-
-<h3 id="Class_Selectores_de_clase">Class: <span id="result_box" lang="es"><span class="hps">Selectores de clase</span></span></h3>
-
-<p><span id="result_box" lang="es"><span class="hps">Utilice el</span> <span class="hps">atributo</span></span> <a href="/en-US/docs/Web/HTML/Global_attributes#attr-class" title="en-US/docs/Web/HTML/Global_attributes#attr-class"><code>class</code></a> para <span id="result_box" lang="es"><span class="hps">asignarle  a </span></span><span id="result_box" lang="es"><span class="hps">un elemento</span> un nombre de clase<code><strong><em> (class)</em></strong></code></span>. <span id="result_box" lang="es"><span class="hps">Depende de</span><span class="hps">l</span><span class="hps"> nombre que elijas</span> como <span class="hps"><code><strong><em>class</em></strong></code>.</span></span> <span id="result_box" lang="es"><span class="hps">Múltiples</span> <span class="hps">elementos en un documento</span> <span class="hps">pueden tener el mismo</span> <span class="hps">valor de la clase</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">su hoja de estilo</span><span>, escriba</span> <span class="hps atn">un punto (.</span><span>)</span> <span class="hps">antes del </span><span class="hps">nombre de la clase</span>,<span class="hps"> cuando</span> <span class="hps">se utiliza como </span><span class="hps">un selector.</span></span></p>
-
-<h3 id="Selectores_ID"><span id="result_box" lang="es"><span class="hps alt-edited">Selectores ID</span></span></h3>
-
-<p><span id="result_box" lang="es"><span class="hps">Utilice el atributo</span> <span class="hps">id en</span> <span class="hps">un elemento</span> <span class="hps">para asignar un</span> <span class="hps alt-edited">identificación para</span> ese <span class="hps">elemento</span><span>.</span> <span class="hps">Depende de</span> usted el <span class="hps">nombre que elija</span> <span class="hps">para el ID</span><span>.</span> <span class="hps">El nombre de</span> <span class="hps">ID</span> <span class="hps">debe ser único</span> <span class="hps">en el documento.</span></span><br>
-  </p>
-
-<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">su hoja de estilo</span><span>, escriba un</span> <span class="hps alt-edited">símbolo de almohadilla</span> <span class="hps atn">(</span><span class="alt-edited">#)</span> <span class="hps alt-edited">ante el</span> <span class="hps alt-edited">ID cuando</span> <span class="hps alt-edited">se utiliza esto en</span> <span class="hps">un selector.</span></span></p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Esta etiqueta</span> <span class="hps">HTML</span> <span class="hps">tiene un</span> <span class="hps alt-edited">atributo <code>class</code></span><code> </code><span class="hps">y un atributo</span> <span class="hps"><code>id</code>:</span></span></p>
-
-<pre class="brush: html">&lt;p class="key" id="principal"&gt;
-</pre>
-
-<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps alt-edited">valor de <code><em><strong>id </strong></em></code>es</span><span class="alt-edited">, <strong>principal</strong>,</span> <span class="hps">debe ser único</span> <span class="hps">en el documento;</span> <span class="hps">pero</span> <span class="hps">otras</span> <span class="hps">etiquetas del documento</span> <span class="hps">puede tener el mismo</span> <span class="hps alt-edited">nombre de la <strong><em><code>class</code></em></strong></span><span>,</span> <span class="hps alt-edited">Key.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">En</span> <span class="hps">una hoja de estilo</span> <span class="hps">CSS</span><span>,</span> <span class="hps">esta regla</span> <span class="hps">hace que todos</span> <span class="hps">los elementos con la <code><em>class</em></code></span><code><em> </em></code><span class="hps"><code><em><strong>key </strong></em></code>sean verdes</span> <span>.</span> <span class="hps atn">(</span><span>Puede ser que no</span> <span class="hps">todos los sean</span> <span class="hps atn">{</span><span class="atn">{</span><span>HTMLElement</span> <span class="hps">()</span><span>}</span> <span class="hps">"p"</span><span>}</span> <span class="hps">elementos.</span><span>)</span></span></p>
-
-<pre class="brush: css">.key {
-  color: green;
-}
-</pre>
-
-<p><span id="result_box" lang="es"><span class="hps">Esta regla</span> <span class="hps">hace que</span> <span class="hps">el </span></span><span id="result_box" lang="es"><span class="hps">único </span></span><span id="result_box" lang="es"><span class="hps"> </span></span><span id="result_box" lang="es"><span class="hps">elemento</span> </span><span id="result_box" lang="es"> <span class="hps alt-edited">de id </span></span><span id="result_box" lang="es"><code><strong><em><span class="hps alt-edited">principal</span></em></strong></code> este en <span class="hps">negrita:</span></span></p>
-
-<pre class="brush: css">#principal {
-  font-weight: bolder;
-}
-</pre>
-</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Si más de una</span> <span class="hps">regla se aplica a</span> <span class="hps">un elemento</span> <span class="hps">y especifica</span> <span class="hps">la misma propiedad,</span> <span class="hps alt-edited">entonces</span> <span class="hps alt-edited">el CSS</span> <span class="hps">da prioridad</span> <span class="hps">a la regla que</span> <span class="hps">tiene el</span> <span class="hps">selector más específico</span><span>.</span> <span class="hps">Un selector</span> <code><em><strong><span class="hps">ID</span> </strong></em></code><span class="hps">es más específico que</span> <span class="hps">un</span> <span class="hps alt-edited">selector de <em><strong><code>class</code></strong></em></span><span>,</span> <span class="hps">que a su vez</span> <span class="hps">es más específico que</span> <span class="hps">un</span> <span class="hps alt-edited">selector (<strong>tag</strong>) de etiquetas</span><span>.</span></span></p>
-
-<div class="tuto_details">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">Más</span> <span class="hps">detalles</span></span></div>
-
-<p><span id="result_box" lang="es"><span class="hps">También se pueden combinar</span> <span class="hps">selectores</span><span>, haciendo un</span> <span class="hps">selector más específico</span><span>.</span></span><br>
- <br>
- Por ejemplo, el selector <strong><em><code>.key</code></em></strong> selecciona <span id="result_box" lang="es"><span class="hps">todos los</span> <span class="hps">elementos que tienen</span> <code><em><strong><span class="hps">key</span> </strong></em></code>como <span class="hps alt-edited">nombre de clase (<strong><em><code>class</code></em></strong></span></span>). El selector <code><em><strong>p</strong></em>.key</code> <span id="result_box" lang="es"><span class="hps">selecciona</span> <span class="hps">sólo el elemento</span></span> {{ HTMLElement("p") }} que tiene de nombre <em><strong><code>key</code></strong></em>.</p>
-
-<p><span id="result_box" lang="es"><span class="hps">Usted no esta </span><span class="hps">limitado a los dos</span> <span class="hps">atributos especiales</span><span>, </span></span><em><strong><code>class</code> </strong></em><span lang="es"><span class="hps">e <em><code><strong>id</strong></code></em></span><span>.</span>  Se p<span class="hps">uede especificar</span> <span class="hps">otros atributos</span> <span class="hps">mediante corchetes</span><span>.</span> <span class="hps">Por ejemplo</span><span>, el selector</span> <span class="hps atn">[</span></span><strong><em><code>type='button'</code></em></strong><span lang="es"><span>] selecciona</span> <span class="hps">todos los</span> <span class="hps">elementos que tienen</span> <span class="hps">un atributo de tipo</span> <span class="hps">con el </span> <span class="hps">valor </span></span><strong><em><code>button</code></em></strong><span lang="es"><span>.</span></span></p>
-</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Si</span> <span class="hps">la hoja de estilo</span> <span class="hps">tiene reglas</span> <span class="hps">en conflicto</span> <span class="hps">y son</span> <span class="hps">igualmente específicas</span><span>, entonces</span> <span class="hps alt-edited">el CSS</span> <span class="hps">da</span> <span class="hps">prioridad a</span> <span class="hps alt-edited">la regla que</span> <span class="hps alt-edited">está</span> <span class="hps alt-edited">después en</span> <span class="hps">la hoja de estilos</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Cuando</span> <span class="hps">usted tiene un problema</span> <span class="hps alt-edited">con las reglas</span> <span class="hps">en conflicto,</span> <span class="hps alt-edited">trate de resolverlo</span> <span class="hps">haciendo</span> <span class="hps">una de las</span> <span class="hps">normas más específicas</span><span>, para que</span> <span class="hps alt-edited">tenga </span><span class="hps">prioridad.</span> <span class="hps">Si usted no puede</span> <span class="hps">hacer esto</span><span>, trate de mover</span> <span class="hps">una de las reglas</span> mas <span class="hps alt-edited">cerca del</span> <span class="hps">final de</span> <span class="hps">la hoja de estilos</span> <span class="hps">para que tenga</span> la <span class="hps">prioridad.</span></span></p>
-
-<h3 id="Las_pseudo-clases_de_los_selectores"><span class="short_text" id="result_box" lang="es"><span class="hps atn">Las pseudo-</span><span>clases de</span> los <span class="hps">selectores </span></span></h3>
-
-<p><span id="result_box" lang="es"><span class="hps">Una</span> <span class="hps">pseudo-clase </span></span> <a href="/en-US/docs/Web/CSS/Pseudo-classes" title="en-US/docs/Web/Guide/CSS/Pseudo-classes">pseudo-class</a><span lang="es"> <span class="hps alt-edited">es en  CSS</span> <span class="hps">una palabra clave</span> <span class="hps">añadida a</span> <span class="hps">los selectores,</span> <span class="hps">que especifica</span> <span class="hps">un estado especial</span> <span class="hps">del elemento</span> <span class="hps">a seleccionar.</span> <span class="hps">Por ejemplo</span> <span class="hps atn">{</span><span class="atn">{</span><span>Css</span> <span class="hps">Href</span> <span class="hps atn">(</span><span class="hps atn">"</span><span>: hover</span><span>")}</span><span>}</span> <span class="hps">aplicará</span> <span class="hps">un estilo</span> <span class="hps">cuando el</span> <span class="hps">usuario se desplaza sobre</span> <span class="hps">el elemento especificado</span> <span class="hps alt-edited">mediante el selector</span></span>.</p>
-
-<p><span id="result_box" lang="es"><span class="hps">Las </span></span><code>Pseudo-classes</code><span lang="es"><span>,</span> <span class="hps">junto con</span> <span class="hps">los <code>pseudo-elements</code></span><span>,</span> <span class="hps">permiten aplicar</span> <span class="hps">un estilo</span> <span class="hps">a un elemento</span> <span class="hps">no sólo</span> <span class="hps">en relación con</span> <span class="hps">el contenido</span> <span class="hps">de</span> <span class="hps">la estructura del documento</span><span>,</span> <span class="hps">sino también en relación</span> <span class="hps">a los factores externos</span><span>, como</span> <span class="hps">la historia del</span> <span class="hps atn">navegador </span><span>por ejemplo:</span><span class="hps atn"> (</span><span class="atn">{</span><span class="atn">{</span><span>href</span> <span class="hps">css</span> <span class="hps atn">(</span><span class="hps atn">"</span><span class="hps">: visited</span> <span class="hps">")}</span><span>}</span><span>, )</span><span>,</span> <span class="hps">el estado de</span> <span class="hps">su contenido</span> <span class="hps">(como</span> <span class="hps atn">{</span><span class="atn">{</span><span>ref</span> <span class="hps">css</span> <span class="hps atn">(</span><span>"</span><span>: </span></span>:checked"<span lang="es"><span class="hps">)}</span><span>} en</span> <span class="hps">algunos</span> <span class="hps">elementos de formulario</span><span>)</span><span>,</span> <span class="hps">o</span> <span class="hps">la posición del</span> <span class="hps">ratón</span> <span class="hps">(como</span> <span class="hps atn">{</span><span class="atn">{</span><span>cssxref</span> <span class="hps">("</span></span>:hover<span lang="es"> <span class="hps">")}</span><span>}</span> <span class="hps">que le permite saber</span> <span class="hps">si</span> <span class="hps">el ratón está sobre</span> <span class="hps">un elemento o</span> <span class="hps">no).</span> <span class="hps">Para ver</span> <span class="hps">una lista completa de</span> <span class="hps">selectores</span><span>,</span> <span class="hps">visite</span> <span class="hps">especificación</span> <span class="hps">CSS3</span> <span class="hps">Selectores</span> <span class="hps">de trabajo </span></span> <a class="external" href="http://www.w3.org/TR/selectors/#selectors" rel="external nofollow" title="CSS3 Selectors working spec">CSS3 Selectors working spec</a>.</p>
-
-<div class="tuto_example">
-<div class="tuto_type"><span class="short_text" id="result_box" lang="es"><span class="hps">Sintaxis</span></span></div>
-
-<pre class="brush:css">selector:pseudo-class {
-  property: value;
-}
-</pre>
-</div>
-
-<h4 id="Listado_de_pseudo-classes">Listado de pseudo-classes:</h4>
-
-<ul>
- <li>{{ Cssxref(":link") }}</li>
- <li>{{ Cssxref(":visited") }}</li>
- <li>{{ Cssxref(":active") }}</li>
- <li>{{ Cssxref(":hover") }}</li>
- <li>{{ Cssxref(":focus") }}</li>
- <li>{{ Cssxref(":first-child") }}</li>
- <li>{{ Cssxref(":last-child") }}</li>
- <li>{{ Cssxref(":nth-child") }}</li>
- <li>{{ Cssxref(":nth-last-child") }}</li>
- <li>{{ Cssxref(":nth-of-type") }}</li>
- <li>{{ Cssxref(":first-of-type") }}</li>
- <li>{{ Cssxref(":last-of-type") }}</li>
- <li>{{ Cssxref(":empty") }}</li>
- <li>{{ Cssxref(":target") }}</li>
- <li>{{ Cssxref(":checked") }}</li>
- <li>{{ Cssxref(":enabled") }}</li>
- <li>{{ Cssxref(":disabled") }}</li>
-</ul>
-
-<h2 id="Información_Los_selectores_basados_en_relaciones_(relationships)"><span id="result_box" lang="es"><span class="hps">Información:</span> <span class="hps">Los selectores</span> <span class="hps">basados en relaciones </span></span>(relationships)</h2>
-
-<p><span id="result_box" lang="es"><span class="hps alt-edited">El CSS</span> <span class="hps">tiene algunas</span> <span class="hps">formas de seleccionar</span> <span class="hps">elementos en función de</span> <span class="hps">las</span> <span class="hps">relaciones entre los elementos</span><span>.</span> <span class="hps">Usted</span> <span class="hps">puede utilizar estas para</span> <span class="hps">hacer</span> <span class="hps">selectores</span> <span class="hps alt-edited">que sean más específicos</span><span>.</span></span></p>
-
-<table id="relselectors">
- <caption><span class="short_text" id="result_box" lang="es"><span class="hps">Selectores</span> <span class="hps">comunes</span> <span class="hps alt-edited">basados en relaciones</span></span></caption>
- <tbody>
-  <tr>
-   <td style="width: 10em;"><strong>Selector</strong></td>
-   <td><strong>Selects</strong></td>
-  </tr>
-  <tr>
-   <td><code>A E</code></td>
-   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es un descendiente de</span> <span class="hps">un elemento</span> <span class="hps atn">A (</span><span>que</span> <span class="hps">es:</span> <span class="hps alt-edited">un hijo o</span> <span class="hps alt-edited">un hijo</span> <span class="hps alt-edited">de un hijo</span> <span class="hps">etc.</span><span>)</span></span></td>
-  </tr>
-  <tr>
-   <td><code>A &gt; E</code></td>
-   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es un hijo de</span> <span class="hps">un elemento A</span></span></td>
-  </tr>
-  <tr>
-   <td><code>E:first-child</code></td>
-   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es el primer</span> <span class="hps">hijo de su padre</span></span></td>
-  </tr>
-  <tr>
-   <td><code>B + E</code></td>
-   <td><span id="result_box" lang="es"><span class="hps">Cualquier</span> <span class="hps">elemento E</span> <span class="hps">que</span> <span class="hps">es</span> <span class="hps">el siguiente hermano</span> <span class="hps">de un elemento</span> <span class="hps">B</span> <span class="hps">(es decir</span><span>:</span> <span class="hps">el</span> <span class="hps">próximo hijo</span> <span class="hps">del mismo</span> <span class="hps">padre)</span></span></td>
-  </tr>
- </tbody>
-</table>
-
-<p><span id="result_box" lang="es"><span class="hps">Usted</span> <span class="hps">puede combinarlas para</span> <span class="hps">expresar relaciones</span> <span class="hps">complejas</span><span>.</span><br>
- <br>
- <span class="hps">También puede utilizar</span> <span class="hps">el símbolo</span> <span class="hps">asterisco </span></span><span lang="es"> <span class="hps">(*</span><span>)</span> <span class="hps alt-edited">para significar</span> <span class="hps atn">"</span><span>cualquier elemento</span><span>"</span><span>.</span></span></p>
-
-<div class="tuto_example">
-<div class="tuto_type">Ejemplo</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Una tabla HTML</span> <span class="hps">tiene</span> <span class="hps">un atributo <strong><em><code>id</code></em></strong></span><span>,</span> <span class="hps">pero sus</span> <span class="hps">filas y</span> <span class="hps alt-edited">las celdas</span> <span class="hps">no tienen</span> <span class="hps">identificadores individuales</span><span>:</span></span></p>
-
-<pre class="brush: html">&lt;table id="data-table-1"&gt;
-...
-&lt;tr&gt;
-&lt;td&gt;Prefix&lt;/td&gt;
-&lt;td&gt;0001&lt;/td&gt;
-&lt;td&gt;default&lt;/td&gt;
-&lt;/tr&gt;
-...
-</pre>
-
-<p><span id="result_box" lang="es"><span class="hps">Estas</span> <span class="hps">reglas hacen</span> <span class="hps">que la primera celda de</span> <span class="hps">cada fila</span> sea en <span class="hps">negrita,</span> <span class="hps">y</span> <span class="hps">la segunda celda</span> de <span class="hps">cada fila</span> en  la familia de fuente <span class="hps"> monoespaciado</span><span>.</span> <span class="hps alt-edited">Esto</span> <span class="hps alt-edited">sólo afecta a</span> <span class="hps">una</span> <span class="hps alt-edited">tabla concreta</span> <span class="hps alt-edited">del documento:</span></span></p>
-
-<pre class="brush:css">    #data-table-1 td:first-child {font-weight: bolder;}
-    #data-table-1 td:first-child + td {font-family: monospace;}
-</pre>
-
-<p><span class="short_text" id="result_box" lang="es"><span class="hps">El resultado</span> <span class="hps">se ve así:</span></span></p>
-
-<table style="border: 2px outset #36b; padding: 1em; background-color: white;">
- <tbody>
-  <tr>
-   <td>
-    <table style="width: 18em; margin-right: 2em;">
-     <tbody>
-      <tr>
-       <td><strong>Prefix</strong></td>
-       <td><code>0001</code></td>
-       <td>default</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div class="tuto_details">
-<div class="tuto_type"><span id="result_box" lang="es"><span class="hps alt-edited">Más</span> <span class="hps">detalles</span></span></div>
-
-<p><span id="result_box" lang="es"><span class="hps">La manera mas </span><span class="hps">habitual es hacer</span><span class="hps alt-edited"> que un</span> <span class="hps alt-edited">selector sea más específico</span><span>, entonces</span> aumentara <span class="hps">su prioridad.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Si utiliza</span> <span class="hps">estas técnicas</span><span>, se evita</span> <span class="hps">la necesidad de especificar</span> <span class="hps">la</span></span> <strong><em><code>class</code> </em></strong><span id="result_box" lang="es"><span class="hps">o</span> <span class="hps">atributos <strong><em><code>ID</code></em></strong></span></span><strong><em><code> </code></em></strong><span id="result_box" lang="es"><span class="hps alt-edited">en muchas</span> <span class="hps">etiquetas</span> <span class="hps alt-edited">del documento.</span> <span class="hps">En su lugar</span><span>, CSS</span> <span class="hps">hace este trabajo.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">En grandes</span> <span class="hps">diseños</span> <span class="hps">donde la velocidad es</span> <span class="hps">importante</span><span>,</span> <span class="hps">usted puede hacer sus</span> <span class="hps">hojas de estilo</span> <span class="hps">más eficiente</span> <span class="hps">evitando</span> <span class="hps">reglas complejas</span> <span class="hps">que dependen de</span> <span class="hps">relaciones entre los elementos</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Para más ejemplos</span> <span class="hps">sobre</span> <span class="hps">las tablas</span><span>,</span> <span class="hps">ver</span></span> <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Tables" title="en-US/docs/Web/Guide/CSS/Getting_Started/Tables">Tables</a> <span id="result_box" lang="es"><span class="hps">en</span> <span class="hps">la página</span> <span class="hps">CSS Reference</span><span>.</span></span></p>
-</div>
-
-<h2 id="Action_Using_class_and_ID_selectors">Action: Using class and ID selectors</h2>
-
-<ol>
- <li><span id="result_box" lang="es"><span class="hps">Edite su archivo</span> <span class="hps">HTML</span><span>,</span> <span class="hps">y duplicar</span> <span class="hps">el</span> <span class="hps">párrafo</span> <span class="hps">copiando y</span> <span class="hps">pegando</span><span>.</span></span></li>
- <li><span id="result_box" lang="es"><span class="hps">A continuación, agregue los atibutos </span></span> <strong>id</strong> y <strong>class</strong> <span id="result_box" lang="es"><span class="hps">a</span> <span class="hps">la primera copia</span><span>,</span> <span class="hps">y</span> <span class="hps">un atributopara</span> <span class="hps">la segunda copia</span> <span class="hps">como se muestra</span> <span class="hps">a continuación.</span> <span class="hps">Alternativamente</span><span>, copie</span> <span class="hps">y pegue el</span> <span class="hps">archivo entero</span> <span class="hps">de nuevo</span><span>:</span></span>
-  <pre class="brush: html">&lt;!doctype html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-  &lt;meta charset="UTF-8"&gt;
-  &lt;title&gt;Sample document&lt;/title&gt;
-  &lt;link rel="stylesheet" href="style1.css"&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;p id="first"&gt;
-      &lt;strong class="carrot"&gt;C&lt;/strong&gt;ascading
-      &lt;strong class="spinach"&gt;S&lt;/strong&gt;tyle
-      &lt;strong class="spinach"&gt;S&lt;/strong&gt;heets
-    &lt;/p&gt;
-    &lt;p id="second"&gt;
-      &lt;strong&gt;C&lt;/strong&gt;ascading
-      &lt;strong&gt;S&lt;/strong&gt;tyle
-      &lt;strong&gt;S&lt;/strong&gt;heets
-    &lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
- </li>
- <li><span id="result_box" lang="es"><span class="hps">Ahora edite</span> <span class="hps">su archivo</span> <span class="hps">CSS</span><span>.</span> <span class="hps alt-edited">Reemplazar todo el contenido</span> <span class="hps">con</span><span>:</span></span>
-  <pre class="brush:css">strong { color: red; }
-.carrot { color: orange; }
-.spinach { color: green; }
-#first { font-style: italic; }
-</pre>
- </li>
- <li><span id="result_box" lang="es"><span class="hps">Guarde los archivos</span> <span class="hps">y</span> <span class="hps">actualizar el navegador</span> <span class="hps">para ver el resultado</span><span>:</span></span>
-  <table style="border: 2px outset #36b; padding: 1em;">
-   <tbody>
-    <tr>
-     <td style="font-style: italic;"><strong style="color: orange;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
-    </tr>
-    <tr>
-     <td><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
-    </tr>
-   </tbody>
-  </table>
-
-  <p><span id="result_box" lang="es"><span class="hps alt-edited">Puede intentar</span> <span class="hps">reordenar las</span> <span class="hps">líneas</span> <span class="hps">en el archivo</span> <span class="hps">CSS</span> <span class="hps alt-edited">de mostrar</span> <span class="hps alt-edited">de que el orden</span> <span class="hps alt-edited">no efecta.</span></span></p>
-
-  <p><span id="result_box" lang="es"><span class="hps">Los</span> <span class="hps">selectores de <code>class</code></span></span><strong><em><code>.carrot</code></em></strong> and <em><strong><code>.spinach</code></strong></em> <span id="result_box" lang="es"><span class="hps">tienen prioridad sobre</span> <span class="hps">el selector de etiquetas</span></span> <em><strong><code>strong</code></strong></em>.</p>
-
-  <p>El <strong><code><em>ID </em></code></strong>selector<code> #<em>first</em></code><em> </em><span id="result_box" lang="es"><span class="hps">tiene prioridad sobre</span> <span class="hps">los</span> <span class="hps">selectores de clase</span> <span class="hps">y</span> <span class="hps">etiqueta</span><span>.</span></span></p>
- </li>
-</ol>
-
-<div class="tuto_example">
-<div class="tuto_type"><span class="short_text" id="result_box" lang="es"><span class="hps">Desafíos</span></span></div>
-
-<ol>
- <li><span id="result_box" lang="es"><span class="hps">Sin cambiar</span> <span class="hps">su archivo</span> <span class="hps">HTML</span><span>,</span> <span class="hps alt-edited">agregue una sola</span> <span class="hps">regla para</span> <span class="hps">su archivo</span> <span class="hps">CSS</span> <span class="hps alt-edited">que mantenga</span> <span class="hps">todas las letras</span> <span class="hps">iniciales que</span> <span class="hps">mismo color que</span> <span class="hps">están ahora,</span> <span class="hps">pero</span> <span class="hps alt-edited">hace que</span> <span class="hps">todo el</span> <span class="hps">otro texto</span> <span class="hps">en el segundo párrafo</span> <span class="hps alt-edited">sea azul</span><span>:</span></span>
-
-  <table style="border: 2px outset #36b; padding: 1em; background-color: white;">
-   <tbody>
-    <tr>
-     <td style="font-style: italic;"><strong style="color: orange;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
-    </tr>
-    <tr>
-     <td style="color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
-    </tr>
-   </tbody>
-  </table>
- </li>
- <li><span id="result_box" lang="es"><span class="hps alt-edited">Ahora cambie</span> <span class="hps">la regla</span> <span class="hps">que acaba de agregar</span> <span class="hps atn">(</span><span>sin cambiar nada más</span><span>)</span><span>,</span> <span class="hps">para hacer</span> <span class="hps alt-edited">que el primer párrafo</span> <span class="hps alt-edited">sea azul</span> <span class="hps">también</span><span>:</span></span>
-  <table style="border: 2px outset #36b; padding: 1em; background-color: white;">
-   <tbody>
-    <tr>
-     <td style="font-style: italic; color: blue;"><strong style="color: orange;">C</strong>ascading <strong style="color: green;">S</strong>tyle <strong style="color: green;">S</strong>heets</td>
-    </tr>
-    <tr>
-     <td style="color: blue;"><strong style="color: red;">C</strong>ascading <strong style="color: red;">S</strong>tyle <strong style="color: red;">S</strong>heets</td>
-    </tr>
-   </tbody>
-  </table>
- </li>
-</ol>
-
-<div class="tuto_details" id="tutochallenge">
-<div class="tuto_type">Possible solution</div>
-
-<ol>
- <li>Add a rule with an ID selector of <code>#second</code> and a declaration <code>color: blue;</code>, as shown below:
-
-  <pre class="brush: css">#second { color: blue; }
-</pre>
-  A more specific selector, <code>p#second</code> also works.</li>
- <li>Change the selector of the new rule to be a tag selector using <code>p</code>:
-  <pre class="brush: css">p { color: blue; }
-</pre>
- </li>
-</ol>
-<a class="hideAnswer" href="#challenge">Hide solution</a></div>
-<a href="#tutochallenge" title="Display a possible solution for the challenge">See a solution for the challenge.</a></div>
-
-<h2 id="Action_Using_pseudo-classes_selectors">Action: Using pseudo-classes selectors</h2>
-
-<ol>
- <li><span class="short_text" id="result_box" lang="es"><span class="hps alt-edited">Cree un</span> <span class="hps alt-edited">HTML como el siguiente</span><span>:</span></span>
-
-  <pre class="brush: html">&lt;!doctype html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-  &lt;meta charset="UTF-8"&gt;
-  &lt;title&gt;Sample document&lt;/title&gt;
-  &lt;link rel="stylesheet" href="style1.css"&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;p&gt;Go to our &lt;a class="homepage" href="http://www.example.com/" title="Home page"&gt;Home page&lt;/a&gt;.&lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
- </li>
- <li><span id="result_box" lang="es"><span class="hps">Ahora edite</span> <span class="hps">su archivo</span> <span class="hps">CSS</span><span>.</span> <span class="hps alt-edited">Reemplace todo el contenido</span> <span class="hps">con</span><span>:</span></span>
-  <pre class="brush: css">a.homepage:link, a.homepage:visited {
-  padding: 1px 10px 1px 10px;
-  color: #fff;
-  background: #555;
-  border-radius: 3px;
-  border: 1px outset rgba(50,50,50,.5);
-  font-family: georgia, serif;
-  font-size: 14px;
-  font-style: italic;
-  text-decoration: none;
-}
-
-a.homepage:hover, a.homepage:focus, a.homepage:active {
-  background-color: #666;
-}
-</pre>
- </li>
- <li><span id="result_box" lang="es"><span class="hps">Guarde los archivos</span> <span class="hps">y</span> <span class="hps alt-edited">actualice el explorador</span> <span class="hps">para ver el resultado</span> <span class="hps atn">(</span><span>poner</span> <span class="hps">el ratón sobre el</span> <span class="hps">siguiente enlace para ver</span> <span class="hps">el efecto</span><span>)</span><span>:</span></span>
-  <table style="border: 2px outset #36b; padding: 1em;">
-   <tbody>
-    <tr>
-     <td>Go to our <a class="tutospecial" href="#" title="Home page">Home page</a><span style="display: none;"> </span><span style="display: none;"> </span></td>
-    </tr>
-   </tbody>
-  </table>
- </li>
-</ol>
-
-<h2 id="Acción_Uso_de_selectores_basados_en_las_relaciones_y_pseudo-clases"><span id="result_box" lang="es"><span class="hps">Acción</span><span>: Uso de</span> <span class="hps">selectores</span> <span class="hps">basados</span> <span class="hps">en las relaciones y</span> <span class="hps">pseudo-clases</span></span></h2>
-
-<p><span id="result_box" lang="es"><span class="hps">Con</span> <span class="hps">selectores</span> <span class="hps">basados</span> <span class="hps">en las relaciones y</span> <span class="hps">pseudo-clases</span> <span class="hps">puede crear</span> <span class="hps">algoritmos </span></span><span id="result_box" lang="es"><span class="hps">complejos</span></span><span id="result_box" lang="es"> en <span class="hps alt-edited">cascada</span> <span class="hps">.</span> <span class="hps">Esto es una técnica</span> <span class="hps">común que se utiliza</span><span>, por ejemplo,</span> <span class="hps">con el fin de</span> <span class="hps">crear menús</span> <span class="hps">desplegables</span> <span class="hps">en </span></span><span id="result_box" lang="es"><span class="hps">puro</span> </span><span id="result_box" lang="es"><span class="hps">CSS</span> <span class="hps">(es decir</span> <span class="hps">sólo</span> <span class="hps">CSS,</span> <span class="hps">sin necesidad de utilizar</span></span> <a href="/en-US/docs/Web/JavaScript" title="en-US/docs/Web/JavaScript">JavaScript</a>). <span id="result_box" lang="es"><span class="hps">La esencia</span> <span class="hps">de esta técnica es</span> <span class="hps">la creación de</span> <span class="hps">una regla como</span> <span class="hps">la siguiente</span><span>:</span></span></p>
-
-<pre class="brush: css">div.menu-bar ul ul {
-  display: none;
-}
-
-div.menu-bar li:hover &gt; ul {
-  display: block;
-}</pre>
-
-<p><span id="result_box" lang="es"><span class="hps alt-edited">Aplicararemos a</span> <span class="hps">una estructura de</span> <span class="hps alt-edited">HTML como el siguiente</span><span>:</span></span></p>
-
-<pre class="brush: html">&lt;div class="menu-bar"&gt;
-  &lt;ul&gt;
-    &lt;li&gt;
-      &lt;a href="example.html"&gt;Menu&lt;/a&gt;
-      &lt;ul&gt;
-        &lt;li&gt;
-          &lt;a href="example.html"&gt;Link&lt;/a&gt;
-        &lt;/li&gt;
-        &lt;li&gt;
-          &lt;a class="menu-nav" href="example.html"&gt;Submenu&lt;/a&gt;
-          &lt;ul&gt;
-            &lt;li&gt;
-              &lt;a class="menu-nav" href="example.html"&gt;Submenu&lt;/a&gt;
-              &lt;ul&gt;
-                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
-                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
-                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
-                &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
-              &lt;/ul&gt;
-            &lt;/li&gt;
-            &lt;li&gt;&lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;/li&gt;
-          &lt;/ul&gt;
-        &lt;/li&gt;
-      &lt;/ul&gt;
-    &lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/div&gt;
-</pre>
-
-<p><span id="result_box" lang="es"><span class="hps">Vea nuestro</span> <span class="hps">ejemplo completo</span></span><a class="internal" href="https://mdn.mozillademos.org/files/3700/css_dropdown_menu.html" title="css_dropdown_menu.html">CSS-based dropdown menu example</a> <span id="result_box" lang="es"><span class="hps">para una posible</span> referencia<span>.</span></span></p>
-
-<h2 id="¿Y_ahora_qué"><span id="result_box" lang="es"><span class="hps">¿Y ahora qué</span><span>?</span></span></h2>
-
-<p><span id="result_box" lang="es"><span class="hps">Su</span> <span class="hps alt-edited">hoja de estilos</span> <span class="hps alt-edited">de muestra</span> <span class="hps">está empezando a parecer</span> <span class="hps alt-edited">densa</span> <span class="hps alt-edited">y complicada.</span> <span class="hps">La</span> <span class="hps">siguiente sección</span> <span class="hps">describe</span> <span class="hps">maneras de hacer</span> <span class="hps">CSS</span> <span class="hps">más fácil de leer</span><span>.</span> </span> <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS" title="/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS">easier to read</a>.{{nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Readable_CSS", "Readable CSS")}}</p>
diff --git a/files/es/web/css/mask-clip/index.html b/files/es/web/css/mask-clip/index.html
new file mode 100644
index 0000000000..f6c749d4f2
--- /dev/null
+++ b/files/es/web/css/mask-clip/index.html
@@ -0,0 +1,103 @@
+---
+title: '-webkit-mask-clip'
+slug: Web/CSS/mask-clip
+tags:
+  - CSS
+translation_of: Web/CSS/mask-clip
+translation_of_original: Web/CSS/-webkit-mask-clip
+original_slug: Web/CSS/-webkit-mask-clip
+---
+<p>{{ CSSRef() }}</p>
+
+<p>{{ Non-standard_header() }}</p>
+
+<p>Si se especificado {{ Cssxref("-webkit-mask-image") }} , <code style="font-size: 14px; font-style: normal; line-height: 1.5;">-webkit-mask-clip</code> determina el comportamiento de recorte (clipping) de la imagen de máscara.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox">{{csssyntax}}
+</pre>
+
+<p>donde:</p>
+
+<dl>
+ <dt>&lt;clip-style&gt;</dt>
+ <dd><code>border | padding | content | text</code></dd>
+</dl>
+
+<h2 id="Valores">Valores</h2>
+
+<dl>
+ <dt>border</dt>
+ <dd><code><font face="Open Sans, Arial, sans-serif">Si se ha especificado </font>border</code> , la máscara de imagen se extiende hasta el borde del elemento.</dd>
+ <dt>padding</dt>
+ <dd>Si se ha especificado <code>padding</code> , la imagen de máscara de extiendo hasta el padding (relleno) del elemento.</dd>
+ <dt>content</dt>
+ <dd>Si se ha espeficiado c<code>ontent</code> , la imagen de máscara se recorta al tamaño del contenido del elemento.</dd>
+ <dt>text</dt>
+ <dd>Si se ha especificado  <code>text</code> , la imagen de máscara de recorta al tamaño del texto del elemento.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: css">div {
+    -webkit-mask-image: url('images/mask.png');
+    -webkit-mask-clip: padding;
+}
+</pre>
+
+<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.1</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<p>{{ cssxref("-webkit-mask") }}, {{ cssxref("-webkit-mask-origin") }}, {{ cssxref("-webkit-mask-box-image") }}, {{ cssxref("-webkit-mask-image") }},{{ cssxref("-webkit-mask-composite") }},{{ cssxref("-webkit-mask-repeat") }}</p>
diff --git a/files/es/web/css/mask-image/index.html b/files/es/web/css/mask-image/index.html
new file mode 100644
index 0000000000..065129d49b
--- /dev/null
+++ b/files/es/web/css/mask-image/index.html
@@ -0,0 +1,158 @@
+---
+title: '-webkit-mask-image'
+slug: Web/CSS/mask-image
+tags:
+  - CSS
+  - No estándar(2)
+  - Propiedad CSS
+  - Referencia CSS
+translation_of: Web/CSS/mask-image
+translation_of_original: Web/CSS/-webkit-mask-image
+original_slug: Web/CSS/-webkit-mask-image
+---
+<div>{{CSSRef}}{{Non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p><code><font face="Open Sans, Arial, sans-serif">La propiedad CSS </font>-webkit-mask-image</code> establece la imagen de máscara para un elemento. Una imagen de máscara fija que partes del elemento serán visibles de acuerdo a la transparencia de la imagen de máscara.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush:css">-webkit-mask-image: url(images/mymask.png);
+-webkit-mask-image: url(images/foo.png), url(images/bar.png);
+-webkit-mask-image: none;
+</pre>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt>&lt;uri&gt;</dt>
+ <dd>La localización del recurso imagen que será utilizado como imagen de máscara.</dd>
+ <dt>&lt;gradient&gt;</dt>
+ <dd>La función <code>webkit-gradient</code> que será usada como imagen de máscara.</dd>
+ <dt>none</dt>
+ <dd>Usado para especificar si un elemento no tiene imagen de máscara.</dd>
+</dl>
+
+<h3 id="Sintaxis_Formal">Sintaxis Formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: css">body {
+  -webkit-mask-image: url('images/mymask.png');
+}
+
+div {
+  -webkit-mask-image: url('images/foo.png'), url('images/bar.png');
+}
+
+p {
+  -webkit-mask-image: none;
+}
+</pre>
+
+<p>Si se especifican varias imágenes, la región visible que sale como resultado es la combinación de las regiones visibles de cada máscara individual.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores.">Compatibilidad con los distintos navegadores.</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Características</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+  </tr>
+  <tr>
+   <td>Múltiples imágenes de máscara</td>
+   <td>{{CompatNo}}</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+  </tr>
+  <tr>
+   <td>Gradientes</td>
+   <td>{{CompatNo}}</td>
+   <td>1.0{{property_prefix("-webkit")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0{{property_prefix("-webkit")}}</td>
+  </tr>
+  <tr>
+   <td>Máscaras SVG</td>
+   <td>{{CompatNo}}</td>
+   <td>8.0<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>iOS Safari</th>
+   <th>Opera Mini</th>
+   <th>Opera Mobile</th>
+   <th>Android Browser</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>3.2</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>2.1</td>
+  </tr>
+  <tr>
+   <td>Múltiples imágenes de máscara</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Gradientes</td>
+   <td>{{CompatVersionUnknown}}{{property_prefix("-webkit")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}{{property_prefix("-webkit")}}</td>
+  </tr>
+  <tr>
+   <td>Máscaras SVG</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Desde la versión 1.9.1 {{geckoRelease("1.9.1")}} Gecko soporta <a href="/es/docs/Applying_SVG_effects_to_HTML_content#Example_Masking">Efectos de filtro SVG</a>, que se pueden usar para aplicar máscaras a contenido HTML.</p>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<p>{{cssxref("-webkit-mask")}}, {{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-attachment")}},{{cssxref("-webkit-mask-image")}},{{cssxref("-webkit-mask-composite")}},{{cssxref("-webkit-mask-repeat")}}</p>
diff --git a/files/es/web/css/mask-origin/index.html b/files/es/web/css/mask-origin/index.html
new file mode 100644
index 0000000000..90dafca57e
--- /dev/null
+++ b/files/es/web/css/mask-origin/index.html
@@ -0,0 +1,102 @@
+---
+title: '-webkit-mask-origin'
+slug: Web/CSS/mask-origin
+tags:
+  - CSS
+  - Referencia
+translation_of: Web/CSS/mask-origin
+translation_of_original: Web/CSS/-webkit-mask-origin
+original_slug: Web/CSS/-webkit-mask-origin
+---
+<div>{{CSSRef}}{{Non-standard_header}}</div>
+
+<p>La propiedad  <a href="/es/docs/Web/CSS">CSS</a> <code>-webkit-mask-origin</code> determina el origen de una imagen de máscara. El valor de la propiedad {{cssxref("-webkit-mask-position")}} se interpreta en relación al valor de esta propiedad. No se aplica cuando <code>-webkit-mask-attachment</code> es <code>fixed</code>.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Valores">Valores</h2>
+
+<dl>
+ <dt>padding</dt>
+ <dd>Valor por defecto. La posición de la imagen de máscara es relativa al padding (relleno). (Para cajas solas  "<code>0 0</code>" es la esquina superior izquierda del límite del padding, "<code>100% 100%</code>" es la esquina inferior derecha.)</dd>
+ <dt>border</dt>
+ <dd>La posición de la imagen de máscara es relativa al borde.</dd>
+ <dt>content</dt>
+ <dd>La posición de la imagen de máscara es relativa al contenido.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: css">.example {
+  border: 10px double;
+  padding: 10px;
+  -webkit-mask-image: url('mask.png');
+
+  /* La imagen de máscara estará dentro del padding */
+  -webkit-mask-origin: content;
+}
+</pre>
+
+<pre class="brush: css">div {
+  -webkit-mask-image: url('mask1.png'), url('mask2.png');
+  -webkit-mask-origin: padding, content;
+}
+</pre>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores.">Compatibilidad con los distintos navegadores.</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básica</td>
+   <td>2.1</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<p>{{cssxref("-webkit-mask")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-image")}},{{cssxref("-webkit-mask-composite")}}, {{cssxref("-webkit-mask-repeat")}}, {{cssxref("-webkit-mask-clip")}}</p>
diff --git a/files/es/web/css/mask-position/index.html b/files/es/web/css/mask-position/index.html
new file mode 100644
index 0000000000..7baec4254b
--- /dev/null
+++ b/files/es/web/css/mask-position/index.html
@@ -0,0 +1,120 @@
+---
+title: '-webkit-mask-position'
+slug: Web/CSS/mask-position
+tags:
+  - CSS
+  - No estándar(2)
+  - Propiedad CSS
+  - Referencia CSS
+translation_of: Web/CSS/mask-position
+translation_of_original: Web/CSS/-webkit-mask-position
+original_slug: Web/CSS/-webkit-mask-position
+---
+<div>{{CSSRef}}{{Non-standard_header}}</div>
+
+<h2 id="Sumario">Sumario</h2>
+
+<pre>la propiedad CSS -webkit-mask-position fija la posición inicial de una máscara de imagen.</pre>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Valores">Valores</h2>
+
+<p> Acepta uno o dos valores.  Se permiten valores negativos para {{cssxref("&lt;percentage&gt;")}} y {{cssxref("&lt;length&gt;")}}.</p>
+
+<ul>
+ <li>Si sólo se especifica un valor, el segundo valor se supone que es center.</li>
+ <li>El primer valor representa la posición horizontal y el segundo la posición vertical (si al menos un valor no es una palabra clave).</li>
+</ul>
+
+<dl>
+ <dt><code>&lt;percentage&gt;</code></dt>
+ <dd>Con un par de valores  0% 0%,  (es igual a 0 0) la esquina superior izquierda de la imagen se alinea con la esquina superior izquierda del borde del relleno del cuadro. Un valor par de 100% 100% coloca la esquina inferior derecha de la imagen  en la esquina inferior derecha del zona del relleno. Con un par de valores de 14% 84%, el punto del 14%  a lo largo y el 84% hacia abajo de la imagen son situados el punto del 14%  a lo largo y el 84% del área del relleno.</dd>
+ <dt><code>&lt;length&gt;</code></dt>
+ <dd>Con un par de valores 2cm 1cm, la esquina superior izquierda de la imagen se coloca a 2cm a la derecha y 1cm por debajo de la esquina superior izquierda del área del relleno.</dd>
+ <dt><code><strong>top</strong></code></dt>
+ <dd>Equivalente al 0% para la posición vertical.</dd>
+ <dt><code><strong>right</strong></code></dt>
+ <dd>Equivalente al 100% para la posición horizontal.</dd>
+ <dt><code><strong>bottom</strong></code></dt>
+ <dd>Equivalente al 100% para la posición vertical.</dd>
+ <dt><code><strong>left</strong></code></dt>
+ <dd>Equivalente al 0% para la posición horizontal.</dd>
+ <dt><code><strong>center</strong></code></dt>
+ <dd>Equivalente al 50% para la posición horizontal si no se da otra forma, o 50% para la posición vertical si lo es.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush:css">.exampleOne {
+  -webkit-mask-image: url(mask.png);
+  -webkit-mask-position: bottom right;
+}
+
+.exampleTwo {
+  -webkit-mask-image: url(mask.png);
+  -webkit-mask-position: 25%;
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No forma parte de ninguna especificación.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_nevegadores">Compatibilidad con los distintos nevegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Características</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Características</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_tambien">Ver tambien</h2>
+
+<p>{{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-clip")}}, {{cssxref("-webkit-mask-image")}}, {{cssxref("-webkit-mask-composite")}}, {{cssxref("-webkit-mask-repeat")}}</p>
diff --git a/files/es/web/css/mask-repeat/index.html b/files/es/web/css/mask-repeat/index.html
new file mode 100644
index 0000000000..2fd065c6dc
--- /dev/null
+++ b/files/es/web/css/mask-repeat/index.html
@@ -0,0 +1,134 @@
+---
+title: '-webkit-mask-repeat'
+slug: Web/CSS/mask-repeat
+tags:
+  - CSS
+  - No estandar
+  - Propiedad CSS
+  - Referencia
+  - Web
+translation_of: Web/CSS/mask-repeat
+translation_of_original: Web/CSS/-webkit-mask-repeat
+original_slug: Web/CSS/-webkit-mask-repeat
+---
+<div>{{CSSRef}}{{Non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p><code><font face="Open Sans, Arial, sans-serif">La propiedad </font>-webkit-mask-repeat</code> especifica si la imagen de máscara se repite (en mosaico) y cómo se repite.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="brush:css">/* Palabras clave de valor únicas */
+-webkit-mask-repeat: repeat;
+-webkit-mask-repeat: repeat-x;
+-webkit-mask-repeat: repeat-y;
+-webkit-mask-repeat: no-repeat;
+
+/* Palabras clave de valor mútiple */
+-webkit-mask-repeat: repeat, repeat-x, no-repeat;
+
+/* Valores globlaes */
+-webkit-mask-repeat: inherit;
+-webkit-mask-repeat: initial;
+-webkit-mask-repeat: unset;
+</pre>
+
+<h2 id="Valores">Valores</h2>
+
+<dl>
+ <dt>repeat</dt>
+ <dd>La máscara de imagen se repite tanto vertical como horizontalmente.</dd>
+ <dt>repeat-x</dt>
+ <dd>La imagen de máscara de repite sólo horizontalmente.</dd>
+ <dt>repeat-y</dt>
+ <dd>La imagen de máscara de repite sólo verticalemente.</dd>
+ <dt>no-repeat</dt>
+ <dd>La máscara de imagen no se repite. Sólo se dibuja una copia suya. El resto del contenido del elemento con máscara no se muestra.</dd>
+</dl>
+
+<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: css">.exampleone {
+  -webkit-mask-image: url('mask.png');
+  -webkit-mask-repeat: repeat-x;
+}
+
+.exampletwo {
+  -webkit-mask-image: url('mask.png');
+  -webkit-mask-repeat: no-repeat;
+}
+</pre>
+
+<h3 id="Soporte_para_múltiples_imágenes_de_máscara">Soporte para múltiples imágenes de máscara</h3>
+
+<p>Se puede especificar, seperados por comas,  un <code>&lt;repeat-style&gt;</code> para cada una de las imágenes de máscara:</p>
+
+<pre class="brush: css">.examplethree {
+  -webkit-mask-image: url('mask1.png'), url('mask2.png');
+  -webkit-mask-repeat: repeat-x, repeat-y;
+}
+</pre>
+
+<p>Cada imagen se relaciona con el correspondiente estilo, desde la primera especificada hasta la última.</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.1</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<p>{{cssxref("-webkit-mask")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-clip")}}, {{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-image")}}, {{cssxref("-webkit-mask-composite")}}</p>
diff --git a/files/es/web/css/mask/index.html b/files/es/web/css/mask/index.html
new file mode 100644
index 0000000000..f742ef952a
--- /dev/null
+++ b/files/es/web/css/mask/index.html
@@ -0,0 +1,126 @@
+---
+title: '-webkit-mask'
+slug: Web/CSS/mask
+tags:
+  - CSS
+  - No estandar
+  - Propiedad CSS
+  - Referencia
+translation_of: Web/CSS/mask
+translation_of_original: Web/CSS/-webkit-mask
+original_slug: Web/CSS/-webkit-mask
+---
+<div>{{CSSRef}}{{Non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>La propiedad <code>-webkit-mask</code> es una  manera corta de establecer, en un único sitio en una hoja de estilos, los valores individuales de máscara. <code>-webkit-mask </code> puede ser utilizado para fijar los valores en una o más de las siguiente propiedades: {{Cssxref("-webkit-mask-image")}}, {{Cssxref("-webkit-mask-repeat")}}, {{Cssxref("-webkit-mask-attachment")}}, {{Cssxref("-webkit-mask-position")}}, {{Cssxref("-webkit-mask-origin")}}, y {{Cssxref("-webkit-mask-clip")}}.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="brush:css">/* Palabras clave valor */
+-webkit-mask: none;
+
+/* Valores de imágene */
+-webkit-mask: url(mask.png);                       /* Imagen de pixel usado coo máscara */
+-webkit-mask: url(masks.svg#star);                 /* Elemento dentro de un gráfico SVG usado como máscara */
+-webkit-mask: linear-gradient(transparent, black); /* Gradiente usado como máscara */
+
+/* Valores combinados */
+-webkit-mask: url(masks.svg#star) 40px 20px;       /* Elemento dentro de un gráfico SVG usado como máscara y posicionado  40px desde la parte superior y 20px a la izquierda */
+-webkit-mask: url(masks.svg#star) 0 0/50px 50px;   /* Elemento dentro de un gráfico SVG usado como máscara con una anchura y altura de 50px */
+-webkit-mask: url(masks.svg#star) repeat-x;        /* Elemento dentro de un gráfico SVG usado como una máscara que se repite horizontalmente */
+-webkit-mask: url(masks.svg#star) border;          /* Elemento dentro de un gráfico SVG usado como una máscara que sobrepasa la caja que rodea el borde */
+-webkit-mask: url(masks.svg#star) text;            /* Elemento dentro de un gráfico SVG usado como una máscara que recorta el texto que contiene */
+
+/* Valores globales */
+-webkit-mask: inherit;
+-webkit-mask: initial;
+-webkit-mask: unset;
+</pre>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt>mask-image</dt>
+ <dd><em>Requierido</em>.Ver {{Cssxref("-webkit-mask-image")}}.</dd>
+ <dt>mask-repeat</dt>
+ <dd><em>Opcional</em>. Ver {{Cssxref("-webkit-mask-repeat")}}.</dd>
+ <dt>mask-attachment</dt>
+ <dd><em>Opcional</em> Ver {{Cssxref("-webkit-mask-attachment")}}.</dd>
+ <dt>mask-position</dt>
+ <dd><em>Opcional</em>. Ver {{Cssxref("-webkit-mask-position")}}.</dd>
+ <dt>mask-origin</dt>
+ <dd><em>Opcional</em>. Ver {{Cssxref("-webkit-mask-origin")}}.</dd>
+ <dt>mask-clip</dt>
+ <dd><em>Opcional</em> Ver {{Cssxref("-webkit-mask-clip")}}.</dd>
+</dl>
+
+<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: css">.example {
+  -webkit-mask: url('mask.png') no-repeat fixed 20px 20px padding padding;
+}
+</pre>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.1</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-clip")}}, {{cssxref("-webkit-mask-image")}}, {{cssxref("-webkit-mask-composite")}}, {{cssxref("-webkit-mask-repeat")}}</li>
+</ul>
diff --git a/files/es/web/css/media_queries/testing_media_queries/index.html b/files/es/web/css/media_queries/testing_media_queries/index.html
new file mode 100644
index 0000000000..81f1e41608
--- /dev/null
+++ b/files/es/web/css/media_queries/testing_media_queries/index.html
@@ -0,0 +1,94 @@
+---
+title: Probando media queries
+slug: Web/CSS/Media_Queries/Testing_media_queries
+translation_of: Web/CSS/Media_Queries/Testing_media_queries
+original_slug: Web/Guide/CSS/probando_media_queries
+---
+<p>{{SeeCompatTable}}</p>
+<p>El DOM proporciona características que hacen posible probar los resultados de un media query estructuradamente. Esto es hecho usando la interfaz {{domxref("MediaQueryList") }} y sus métodos y propiedades. Una vez que hayas creado el objeto {{domxref("MediaQueryList") }}, puedes revisar el resultado del query o, como alternativa, recibir notificaciones automáticamente cuando el resultado cambie.</p>
+<h2 id="Creating_a_media_query_list" name="Creating_a_media_query_list">Creando una media query list</h2>
+<p>Before you can evaluate the results of a query, you need to create the {{domxref("MediaQueryList") }} object representing the media query. To do this, use the {{domxref("window.matchMedia") }} method.</p>
+<p>For example, if you want to set up a query list that determines whether the device is in landscape or portrait orientation, you can do so like this:</p>
+<pre>var mql = window.matchMedia("(orientation: portrait)");
+</pre>
+<h2 id="Checking_the_result_of_a_query" name="Checking_the_result_of_a_query">Revisando el resultado de un query</h2>
+<p>Once your media query list has been created, you can check the result of the query by looking at the value of its <code>matches</code> property, which reflects the result of the query:</p>
+<pre class="brush: js">if (mql.matches) {
+  /* The device is currently in portrait orientation */
+} else {
+  /* The device is currently in landscape orientation */
+}
+</pre>
+<h2 id="Receiving_query_notifications" name="Receiving_query_notifications">Recibiendo notificaciones query</h2>
+<p>If you need to be aware of changes to the evaluated result of the query on an ongoing basis, it's more efficient to register a listener than to poll the query's result. To do this, you can call the <code>addListener()</code> method on the {{domxref("MediaQueryList") }} object, specifying an observer that implements the {{domxref("MediaQueryListListener") }} interface:</p>
+<pre class="brush: js">var mql = window.matchMedia("(orientation: portrait)");
+mql.addListener(handleOrientationChange);
+handleOrientationChange(mql);
+</pre>
+<p>This code creates the orientation testing media query list, <code>mql</code>, then adds a listener to it. Note that after adding the listener, we actually invoke the listener directly once. This lets our listener perform initial adjustments based on the current device orientation (otherwise, if our code assumes the device is in portrait mode but it's actually in landscape mode at startup, we could have inconsistencies).</p>
+<p>The <code>handleOrientationChange()</code> method we implement then would look at the result of the query and handle whatever we need to do on an orientation change:</p>
+<pre class="brush: js">function handleOrientationChange(mql) {
+  if (mql.matches) {
+    /* The device is currently in portrait orientation */
+  } else {
+    /* The device is currently in landscape orientation */
+  }
+}
+</pre>
+<h2 id="Ending_query_notifications" name="Ending_query_notifications">Terminando con las notificaciones query </h2>
+<p>Cuando ya no vayas a necesitar recibir las notificaciones sobre los cambios de valro de tu media query, simplemente llama al <code>removeListener()</code> en el {{domxref("MediaQueryList") }}:</p>
+<pre>mql.removeListener(handleOrientationChange);
+</pre>
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con los navegadores</h2>
+<p>{{CompatibilityTable}}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>9</td>
+    <td>{{CompatGeckoDesktop("6.0") }}</td>
+    <td>10</td>
+    <td>12.1</td>
+    <td>5.1</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>3.0</td>
+    <td>{{CompatUnknown}}</td>
+    <td>10</td>
+    <td>12.1</td>
+    <td>5</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h2 id="See_also" name="See_also">Ver también</h2>
+<ul>
+ <li><a href="/en-US/docs/CSS/Media_queries" title="CSS/Media queries">Media queries</a></li>
+ <li>{{domxref("window.matchMedia()") }}</li>
+ <li>{{domxref("MediaQueryList") }}</li>
+ <li>{{domxref("MediaQueryListListener") }}</li>
+</ul>
diff --git a/files/es/web/css/media_queries/using_media_queries/index.html b/files/es/web/css/media_queries/using_media_queries/index.html
new file mode 100644
index 0000000000..680efd1e89
--- /dev/null
+++ b/files/es/web/css/media_queries/using_media_queries/index.html
@@ -0,0 +1,829 @@
+---
+title: CSS media queries
+slug: Web/CSS/Media_Queries/Using_media_queries
+tags:
+  - CSS
+  - Media
+  - Media Queries
+  - query
+translation_of: Web/CSS/Media_Queries/Using_media_queries
+original_slug: CSS/Media_queries
+---
+<div>{{cssref}}</div>
+
+<p class="seoSummary">Las <strong>media queries</strong> (en español "consultas de medios") son útiles cuando deseas modificar tu página web o aplicación en función del tipo de dispositivo (como una impresora o una pantalla) o de características y parámetros específicos (como la resolución de la pantalla o el ancho del {{glossary("viewport")}} del navegador).</p>
+
+<p>Se utilizan para:</p>
+
+<ul>
+ <li>Aplicar estilos condicionales con las <a href="/es/docs/Web/CSS/At-rule">reglas-at</a> {{cssxref("@media")}} e {{cssxref("@import")}} de <a href="/es/docs/Web/CSS">CSS</a>.</li>
+ <li>Indicar medios específicos en los elementos {{HTMLElement("link")}}, {{HTMLElement("source")}} y otros elementos <a href="/es/docs/Web/HTML">HTML</a>.</li>
+ <li><a href="/es/docs/Web/Guide/CSS/probando_media_queries">Testear y monitorizar los estados de los medios</a> usando los métodos de javascript {{domxref("Window.matchMedia()")}} y {{domxref("MediaQueryList.addListener()")}}.</li>
+</ul>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p> </p>
+
+<p>Las <em>media queries</em> consisten de un tipo de medio opcional y una o más expresiones de <em>características de medios</em>. Varias consultas se pueden combinar utilizando operadores lógicos. No distinguen entre mayúsculas y minúsculas.</p>
+
+<p>El resultado de la consulta es "verdadero" cuando el tipo de medio (si se especifica) coincide con el dispositivo en el que se está mostrando el documento y todas las expresiones en el <em>media query</em> son "verdaderas". En este caso, se aplica los estilos correspondientes, siguiendo las reglas usuales de cascada.</p>
+
+<p>Las consultas sobre tipos de medios desconocidos son siempre falsas.</p>
+
+<p> </p>
+
+<pre class="brush: html"><code class="brush: html">&lt;!-- CSS media query on a link element --&gt;
+</code>&lt;link rel="stylesheet" media="(max-width: 800px)" href="example.css" /&gt;
+
+<code class="brush: html">&lt;!-- CSS media query within a style sheet --&gt;
+&lt;style&gt;
+@media (max-width: 600px) {
+  .facet_sidebar {
+    display: none;
+  }
+}
+&lt;/style&gt;</code>
+</pre>
+
+<h3 id="Media_Types">Media Types</h3>
+
+<p>Los <em>Media Types</em> (tipos de medios) describen la categoría general de un dispositivo. Excepto cuando se utilizan los operadores lógicos <code>not</code> o <code>only</code>, el tipo de medio es opcional y será interpretada como <code>all</code>.</p>
+
+<dl>
+ <dt><code id="all">all</code></dt>
+ <dd>Apto para todos los dispositivos.</dd>
+ <dt><code id="print">print</code></dt>
+ <dd>Destinado a material impreso y visualización de documentos en una pantalla en el modo de vista previa de impresión. </dd>
+ <dt><code id="screen">screen</code></dt>
+ <dd>Destinado principalmente a las pantallas.</dd>
+ <dt><code id="speech">speech</code></dt>
+ <dd>Destinado a sintetizadores de voz.</dd>
+</dl>
+
+<div class="blockIndicator note">
+<p><strong>Tipos de medios depreciados:</strong> CSS2.1 y <a href="/es/docs/">Media Queries 3</a> definieron varios tipos de medios adicionales (<code>tty</code>, <code>tv</code>, <code>projection</code>, <code>handheld</code>, <code>braille</code>, <code>embossed</code> y <code>aural</code>), pero fueron desaprobados en <a href="https://drafts.csswg.org/mediaqueries/#media-types">Media Queries 4</a> y no deberían ser usados. El tipo <code>aural</code> ha sido reemplazado por <code>speech</code>, que es similar.</p>
+</div>
+
+<h3 id="Operadores_Lógicos">Operadores Lógicos</h3>
+
+<p>Se pueden redactar queries utilizando operadores lógicos, incluyendo <code>not</code>, <code>and</code>, y <code>only</code>.</p>
+
+<p>Además se puede combinar múltiples queries en una lista separada por comas múltiples; si cualquiera de las queries en la lista es verdadera, la hoja de estilo asociada es aplicada. Esto es equivalente a una operación lógica "or".</p>
+
+<h4 id="and">and</h4>
+
+<p>El operador <code>and</code> es usado para colocar juntas múltiples funciones multimedia. Un query básico con el tipo de medio especificado como <code>all</code> puede lucir así:</p>
+
+<pre class="brush: css">@media (min-width: 700px) { ... }</pre>
+
+<p>Si usted quiere aplicar ese query solo si la pantalla esta en formato horizontal, usted puede utilizar el operador <code>and</code> y colocar la siguiente cadena:</p>
+
+<pre class="brush: css">@media (min-width: 700px) and (orientation: landscape) { ... }</pre>
+
+<p>La siguiente query solo retornara verdadero si la ventana tiene un ancho de 700px o mas y la pantalla esta en formato horizontal. Ahora si usted quiere aplicar esta opción solo si tipo de medio es TV, usted puede utilizar la siguiente cadena:</p>
+
+<pre class="brush: css">@media tv and (min-width: 700px) and (orientation: landscape) { ... }</pre>
+
+<p>Esta query solo se aplica si el tipo de medio es TV, la ventana tiene 700px de ancho o mas y la pantalla esta en formato horizontal.</p>
+
+<h4 id="lista_separada_por_comas">lista separada por comas</h4>
+
+<p>Las listas separadas por comas se comportan como el operador <code>or</code> cuando es usado en media queries. Cuando utilice una lista separada por comas y alguno de los queries retorna verdadero, el estilo o la hoja de estilos sera aplicada. Cada query en una lista separada por comas es tratado como una query individual y cualquier operador aplicado a un medio no afectara a los demás. Esto significa que cada query en una lista separada por comas puede tener como objetivo diferentes medios, tipos y estados.</p>
+
+<p>Si usted quiere aplicar una serie de estilos para un equipo con un ancho mínimo de 700px o si el dispositivo esta colocado en horizontal, usted puede escribir lo siguiente:</p>
+
+<pre class="brush: css">@media (min-width: 700px), handheld and (orientation: landscape) { ... }</pre>
+
+<p>Por lo tanto, si esta en una <code>screen</code> con una ventana de 800px de ancho, la declaración del medio retornara verdadero debido a la primera parte de la lista, si aplicamos esto a un dispositivo <code>@media all and (min-width: 700px)</code> podría retornar verdadero a pesar del hecho de que la pantalla falle la verificación tipo de medio del <code>handheld</code> en la segunda query. Por otra parte si estuviese en un <code>handheld</code> con un ancho de ventana de 500px, la primera parte de la lista fallaría pero la segunda parte retornara verdadero debido a la declaración de medio.</p>
+
+<h4 id="not">not</h4>
+
+<p>El operador <code>not</code> aplica a todo el query y retorna verdadero si es posible y sino retorna falso (como por ejemplo <code>monochrome</code> en un monitor a color o una ventana con un ancho mínimo de <code>min-width: 700px</code> en un monitor de 600px). Un <code>not</code> negara un query si es posible pero no a todos los query posibles si están ubicados en una lista separada por comas. El operador <code>not</code> no puede ser usado para negar un query individual, solo para un query completo. Por ejemplo<span style="line-height: 1.572;">, el </span><code style="font-size: 14px;">not</code><span style="line-height: 1.572;"> en el siguiente query es evaluado al final:</span></p>
+
+<pre class="brush: css" style="font-size: 14px;">@media not all and (monochrome) { ... }
+</pre>
+
+<p>Esto significa que el query es evaluado de la siguiente forma:</p>
+
+<pre class="brush: css" style="font-size: 14px;">@media not (all and (monochrome)) { ... }
+</pre>
+
+<p>... y no de esta forma:</p>
+
+<pre class="brush: css" style="font-size: 14px;">@media (not all) and (monochrome) { ... }</pre>
+
+<p>Otro Ejemplo:</p>
+
+<pre class="brush: css" style="font-size: 14px;">@media not screen and (color), print and (color)
+</pre>
+
+<p>Es evaluado de la siguiente forma:</p>
+
+<pre class="brush: css" style="font-size: 14px;">@media (not (screen and (color))), print and (color)</pre>
+
+<h4 id="only">only</h4>
+
+<p><span style="line-height: 21px;">El operador </span><code style="font-size: 14px;">only</code><span style="line-height: 21px;"> previene que navegadores antiguos que no soportan queries con funciones apliquen los estilos asignados:</span></p>
+
+<pre class="brush: html">&lt;link rel="stylesheet" media="only screen and (color)" href="Ejemplo.css" /&gt;
+</pre>
+
+<h3 id="Pseudo-BNF">Pseudo-BNF</h3>
+
+<pre class="syntaxbox">media_query_list: &lt;media_query&gt; [, &lt;media_query&gt; ]*
+media_query: [[only | not]? &lt;media_type&gt; [ and &lt;expression&gt; ]*]
+  | &lt;expression&gt; [ and &lt;expression&gt; ]*
+expression: ( &lt;media_feature&gt; [: &lt;value&gt;]? )
+media_type: all | aural | braille | handheld | print |
+  projection | screen | tty | tv | embossed
+media_feature: width | min-width | max-width
+  | height | min-height | max-height
+  | device-width | min-device-width | max-device-width
+  | device-height | min-device-height | max-device-height
+  | aspect-ratio | min-aspect-ratio | max-aspect-ratio
+  | device-aspect-ratio | min-device-aspect-ratio | max-device-aspect-ratio
+  | color | min-color | max-color
+  | color-index | min-color-index | max-color-index
+  | monochrome | min-monochrome | max-monochrome
+  | resolution | min-resolution | max-resolution
+  | scan | grid</pre>
+
+<p>Los queries son insensibles a las mayúsculas o minúsculas. Media queries que contengan tipos de medios desconocidos siempre retornaran falso.</p>
+
+<div class="note"><strong>Nota:</strong> Los paréntesis son requeridos alrededor de las expresiones, no utilizarlos es un error.</div>
+
+<h2 id="Funciones_Multimedia">Funciones Multimedia</h2>
+
+<p>La mayoría de las funciones multimedia pueden ser precedidas por "min-" o "max-" para expresar "greater or equal to" o "less than or equal to". Esto elimina la necesidad de usar los símbolos "&lt;" y "&gt;" los cuales podrían causar conflictos con HTML y XML. Si usted usa una función multimedia sin especificarle un valor, la expresión retornara verdadero si el valor es diferente de cero.</p>
+
+<div class="note"><strong>Nota:</strong> Si una función multimedia no aplica al dispositivo donde el navegador esta corriendo, la expresión que contiene esa función siempre retornara falso. Por Ejemplo, cambiar la relación de aspecto en un dispositivo aural siempre resultara falso.</div>
+
+<h3 id="color">color</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;color&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> si</p>
+
+<p>Indica el numero de bits por componente de color del dispositivo de salida. Si el dispositivo no soporta colores, este valor es 0.</p>
+
+<div class="note"><strong>Nota:</strong> Si el componente de color tiene diferente numero de bits por color, entonces el valor mas pequeño es utilizado. Por Ejemplo, si una pantalla utiliza 5 bits para azul y rojo y 6 bits para el verde, entonces se utilizan 5 bits por componente de color. Si el dispositivo utiliza índices de color se usara el mínimo valor de bits por color en la tabla.</div>
+
+<h4 id="Ejemplos">Ejemplos</h4>
+
+<p>Para aplicar una hoja de estilo a todos los dispositivos que soporten colores:</p>
+
+<pre class="brush: css">@media all and (color) { ... }
+</pre>
+
+<p>Para aplicar una hoja de estilo a dispositivos con al menos 4 bits por componente de color:</p>
+
+<pre class="brush: css">@media all and (min-color: 4) { ... }
+</pre>
+
+<h3 id="color-index">color-index</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max</strong><strong>:</strong> sí</p>
+
+<p>Indica el numero de entradas en la tabla de colores para el dispositivo de salida.</p>
+
+<h4 id="Ejemplos_2">Ejemplos</h4>
+
+<p>Para indicar que una hoja de estilo debe aplicarse a todos los dispositivos utilizando índices de color, usted puede hacer esto:</p>
+
+<pre class="brush: css">@media all and (color-index) { ... }
+</pre>
+
+<p>Para aplicar una hoja de estilo a un dispositivo con un índice de al menos 256 colores:</p>
+
+<pre class="brush: html">&lt;link rel="stylesheet" media="all and (min-color-index: 256)" href="http://foo.bar.com/stylesheet.css" /&gt;
+</pre>
+
+<h3 id="aspect-ratio">aspect-ratio</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;ratio&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
+ <strong>Acepta prefijos min/max</strong><strong>:</strong> sí</p>
+
+<p>Describe el aspecto de una zona a mostrar en el dispositivo de salida. Este valor consiste en enteros positivos separados por una barra ("/"). Esto representa la razón de aspecto de los pixeles horizontales (primer termino) a los pixeles verticales (segundo termino).</p>
+
+<h4 id="Ejemplo">Ejemplo</h4>
+
+<p>Lo siguiente selecciona una hoja de estilo especial para ser aplicada donde la proporción del tamaño de la pantalla del dispositivo de salida es al menos la misma de ancho que de alto.</p>
+
+<pre class="brush: css">@media screen and (min-aspect-ratio: 1/1) { ... }</pre>
+
+<p>Este selecciona el estilo cuando la proporción de aspecto sea 1:1 o superior. En otras palabras este estilo solo sera aplicado cuando el área de visualización sea cuadrada u horizontal.</p>
+
+<h3 id="device-aspect-ratio">device-aspect-ratio</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;ratio&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>Describe la proporción de aspecto del dispositivo de salida. Este valor consiste de dos enteros positivos separados por una barra ("/"). Este representa la proporción de aspecto de los pixeles horizontales (primer termino) a los pixeles verticales (segundo termino).</p>
+
+<h4 id="Ejemplo_2">Ejemplo</h4>
+
+<p>El siguiente código selecciona una hoja de estilo especial para ser aplicada en pantallas panorámicas ("widescreen").</p>
+
+<pre class="brush: css">@media screen and (device-aspect-ratio: 16/9), screen and (device-aspect-ratio: 16/10) { ... }</pre>
+
+<p>Este selecciona el estilo cuando la proporción de aspecto sea 16:9 o 16:10.</p>
+
+<h3 id="device-height">device-height</h3>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;length&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>Describe la altura del dispositivo de salida (ya sea la totalidad de la pantalla o página y no el área del documento a renderizar).</p>
+
+<h3 id="device-width">device-width</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;length&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>Describe la anchura del dispositivo de salida (ya sea la totalidad de la pantalla o página y no el área del documento a renderizar).</p>
+
+<h4 id="Ejemplo_3">Ejemplo</h4>
+
+<p>Para aplicar una hoja de estilo a un documento cuando este sea mostrado en una pantalla de menos de 800px de ancho, usted puede usar esto:</p>
+
+<pre class="brush: html">&lt;link rel="stylesheet" media="screen and (max-device-width: 799px)" /&gt;
+</pre>
+
+<h3 id="grid">grid</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> all<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Determina cuando el dispositivo de salida es un dispositivo de cuadrícula o de mapa de bits. Si el dispositivo esta basado en una cuadrícula (como una terminal TTY o una pantalla de teléfono de solo texto), el valor sera 1, de lo contrario sera 0.</p>
+
+<h4 id="Ejemplo_4">Ejemplo</h4>
+
+<p>Para aplicar una hoja de estilo a un dispositivo portátil con una pantalla de 15 caracteres o mas estrecha:</p>
+
+<pre class="brush: css">@media handheld and (grid) and (max-width: 15em) { ... }
+</pre>
+
+<div class="note"><strong>Nota:</strong> La unidad "em" tiene un significado especial para los dispositivos de cuadrícula; ya que la anchura exacta de una "em" no puede ser determinada, se asume un "em" como el ancho de una celda en la cuadrícula y el alto de una celda en la cuadrícula.</div>
+
+<h3 id="height">height</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;length&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>La función <code>height</code> describe la altura de la superficie a renderizar en el dispositivo de salida (como la altura de una ventana o la bandeja de papel en una impresora).</p>
+
+<div class="note"><strong>Nota:</strong> Cuando el usuario cambia el tamaño de una ventana Firefox también cambia las hojas de estilo para utilizar la mas adecuada basándose en los valores de <code>width</code> y <code>height</code> del query.</div>
+
+<h3 id="monochrome">monochrome</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>Indica el número de bits por pixel en un dispositivo monocromático (escala de grises). Si el dispositivo no es monocromático el valor sera 0.</p>
+
+<h4 id="Ejemplos_3">Ejemplos</h4>
+
+<p>Para aplicar una hoja de estilo a todos los dispositivos monocromáticos:</p>
+
+<pre class="brush: css">@media all and (monochrome) { ... }
+</pre>
+
+<p>Para aplicar una hoja de estilo a un dispositivo monocromático con al menos 8 bits por pixel:</p>
+
+<pre class="brush: css">@media all and (min-monochrome: 8) { ... }
+</pre>
+
+<h3 id="orientation">orientation</h3>
+
+<p><strong>Valor</strong><strong>:</strong> <code>landscape</code> | <code>portrait</code><br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Indica cuando el dispositivo esta en modo landscape (el ancho de la pantalla es mayor al alto) o modo portrait (el alto de la pantalla es mayor al ancho).</p>
+
+<h4 id="Ejemplo_5">Ejemplo</h4>
+
+<p>Para aplicar una hoja de estilo solo en orientación vertical (portrait):</p>
+
+<pre class="brush: css">@media all and (orientation: portrait) { ... }</pre>
+
+<h3 id="resolution">resolution</h3>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;resolution&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Bitmap", "bitmap")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>Indica la resolución (densidad de pixeles) del dispositivo de salida. La resolución puede ser especificada en puntos por pulgada (dpi) o en puntos por centímetros (dpcm).</p>
+
+<h4 id="Ejemplo_6">Ejemplo</h4>
+
+<p>Para aplicar una hoja de estilo a dispositivos con al menos 300 dpi de resolución:</p>
+
+<pre class="brush: css">@media print and (min-resolution: 300dpi) { ... }
+</pre>
+
+<p>Para reemplazar la vieja sintaxis <span style="font-family: courier new,andale mono,monospace; line-height: normal;">(min-device-pixel-ratio: 2)</span>:</p>
+
+<pre class="brush: css">@media screen and (min-resolution: 2dppx) { ... }</pre>
+
+<h3 id="scan">scan</h3>
+
+<p><strong>Valor</strong><strong>:</strong> <code>progressive</code> | <code>interlace</code><br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/TV")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Describe el proceso de exploración de televisión de los dispositivos de salida.</p>
+
+<h4 id="Ejemplo_7">Ejemplo</h4>
+
+<p>Para aplicar una hoja de estilo solo a televisores de exploración progresiva:</p>
+
+<pre class="brush: css">@media tv and (scan: progressive) { ... }
+</pre>
+
+<h3 id="width">width</h3>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;length&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}, {{cssxref("Media/Tactile")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>La función <code>width</code> describe el ancho de la superficie a renderizar en el dispositivo de salida (como el ancho de una ventana de un documento o el ancho de la bandeja de papel en una impresora).</p>
+
+<div class="note"><strong>Nota:</strong> Cuando el usuario cambia el tamaño de una ventana Firefox también cambia las hojas de estilo para utilizar la mas adecuada basándose en los valores de <code>width</code> y <code>height</code> del query.</div>
+
+<h4 id="Ejemplos_4">Ejemplos</h4>
+
+<p>Si usted quiere especificar una hoja de estilo para dispositivos portátiles o pantallas con un ancho de al menos 20em, usted puede usar esta query:</p>
+
+<pre class="brush: css">@media handheld and (min-width: 20em), screen and (min-width: 20em) { ... }
+</pre>
+
+<p>Esta query especifica una hoja de estilo para ser aplicada a un medio impreso con un ancho mayor a 8.5 pulgadas:</p>
+
+<pre class="brush: html">&lt;link rel="stylesheet" media="print and (min-width: 8.5in)"
+    href="http://foo.com/mystyle.css" /&gt;
+</pre>
+
+<p>Esta query especifica una hoja de estilo para ser utilizada cuando la ventana tiene un ancho entre 500 y 800 pixeles:</p>
+
+<pre class="brush: css">@media screen and (min-width: 500px) and (max-width: 800px) { ... }
+
+</pre>
+
+<ul>
+</ul>
+
+<h2 id="Específico_de_Mozilla">Específico de Mozilla</h2>
+
+<p>Mozilla ofrece varias funciones especificas de Gecko. Algunas de estas pueden ser propuestas como funcines oficiales.</p>
+
+<p>{{ h3_gecko_minversion("-moz-images-in-menus", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Si el dispositivo acepta que haya imágenes en menús, el valor es 1; de otro modo sera 0. Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(images-in-menus)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-mac-graphite-theme", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Si el usuario ha configurado su dispositivo para usar la apariencia "Grafito" en Mac OS X, esto sera 1. Si el usuario esta usando la apariencia azul por defecto, o si no usa Mac OS X, esto sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(mac-graphite-theme)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-maemo-classic", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Si el usuario esta usando Maemo con el tema original, esto sera 1; Si esta usando el nuevo tema Fremantle, sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(maemo-classic)") }}</p>
+
+<p>{{ h3_gecko_minversion("-moz-device-pixel-ratio", "2.0") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;number&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> sí</p>
+
+<p>Da el numero de pixeles del dispositivo por pixeles de CSS.</p>
+
+<div class="geckoVersionNote style-wrap">
+<p><strong>No use esta función. </strong></p>
+
+<p>En cambio use la función <code>resolution</code> con la unidad <code>dppx</code>.<br>
+ <br>
+ <code>-moz-device-pixel-ratio</code> puede ser usada para compatibilidad con Firefox 16 o anterior; y <code>-webkit-device-pixel-ratio</code> con navegadores basados en WebKit que no soporten <code>dppx</code>.</p>
+
+<p>Ejemplo:</p>
+
+<pre class="brush: css">@media (-webkit-min-device-pixel-ratio: 2), /* Navegadores basados en WebKit */
+       (min--moz-device-pixel-ratio: 2),    /* Navegadores anteriores a Firefox 16 */
+       (min-resolution: 2dppx),             /* La forma estandar */
+       (min-resolution: 192dpi)             /* compatibilidad con dppx */ </pre>
+
+<p>Vea este <a href="http://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/" title="http://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/">articulo CSSWG </a>sobre buenas practicas para compatibilidad en relación a <code>resolution</code> y <code>dppx</code>.</p>
+</div>
+
+<div class="note">Nota: Esta funcion multimedia tambien esta implementada en Webkit como <span style="font-family: courier new;">-webkit-device-pixel-ratio</span>. Los prefijos minimos y maximos de esta funcion implementados por Gecko se llaman asi: <span style="font-family: courier new;">min--moz-device-pixel-ratio</span> y <span style="font-family: courier new;">max--moz-device-pixel-ratio</span>; y los mismos prefijos implementados por Webkit se llaman asi: <span style="font-family: courier new;">-webkit-min-device-pixel-ratio</span> y <span style="font-family: courier new;">-webkit-max-device-pixel-ratio</span>.</div>
+
+<p>{{ h3_gecko_minversion("-moz-os-version", "25.0") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> <code>windows-xp</code> | <code>windows-vista</code> | <code>windows-win7</code> | <code>windows-win8</code><br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Indica que sistema operativo esta en uso actualmente. Actualmente solo es implementado en Windows. Sus posibles valores son:</p>
+
+<ul>
+ <li><code>windows-xp</code></li>
+ <li><code>windows-vista</code></li>
+ <li><code>windows-win7</code></li>
+ <li><code>windows-win8</code></li>
+ <li><code>windows-win10</code></li>
+</ul>
+
+<p>Esto se hace para permitir a los skins y a algunos códigos funcionen mejor con el sistema operativo en el que se ejecutan.</p>
+
+<p>{{ h3_gecko_minversion("-moz-scrollbar-end-backward", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si la interfaz de usuario muestra una fecha inversa al final de la barra de desplazamiento, de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-end-backward)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-scrollbar-end-forward", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si la interfaz de usuario muestra una fecha apuntando hacia la derecha al final de la barra de desplazamiento. de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-end-forward)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-scrollbar-start-backward", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si la interfaz de usuario muestra una fecha inversa al principio de la barra de desplazamiento, de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-start-backward)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-scrollbar-start-forward", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si la interfaz de usuario muestra una fecha apuntando hacia la derecha al principio de la barra de desplazamiento, de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-start-forward)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-scrollbar-thumb-proportional", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si la interfaz de usuario muestra la miniatura de la barra de desplazamiento de forma proporcional (basado en el porcentaje del documento que es visible), de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(scrollbar-thumb-proportional)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-touch-enabled", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si el dispositivo soporta eventos táctiles (una pantalla táctil), de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(touch-enabled)") }}.</p>
+
+<h4 id="Ejemplo_8">Ejemplo</h4>
+
+<p>Usted puede usar esto para renderizar sus botones un poco mas grandes, Por Ejemplo, si el usuario se encuentra en una pantalla táctil, esto hará los botones mas fáciles de usar con los dedos.</p>
+
+<p>{{ h3_gecko_minversion("-moz-windows-classic", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si el usuario utiliza un windows sin temas visuales (modo clasico); de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(windows-classic)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-windows-compositor", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si el usuario utiliza windows con el compositor de ventanas DWM; de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(windows-compositor)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-windows-default-theme", "1.9.2") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>El valor sera 1 si el usuario actualmente esta utilizando algunos de los temas por defecto de Windows (Luna, Royale, Zune, or Aero), de lo contrario el valor sera 0.</p>
+
+<p>Esto corresponde a la <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudoclase</a>: {{ cssxref(":-moz-system-metric(windows-default-theme)") }}.</p>
+
+<p>{{ h3_gecko_minversion("-moz-windows-theme", "2.0") }}</p>
+
+<p><strong>Valor</strong><strong>:</strong> <code>aero</code> | <code>luna-blue</code> | <code>luna-olive</code> | <code>luna-silver</code> | <code>royale</code> | <code>generic</code> | <code>zune</code><br>
+ <strong style="font-weight: bold;">Medio</strong><strong>:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<p>Indica cual tema de Windows esta en uso actualmente. Solo disponible para Windows. Sus posibles valores son:</p>
+
+<ul>
+ <li><code>aero</code></li>
+ <li><code>luna-blue</code></li>
+ <li><code>luna-olive</code></li>
+ <li><code>luna-silver</code></li>
+ <li><code>royale</code></li>
+ <li><code>generic</code></li>
+ <li><code>zune</code></li>
+</ul>
+
+<p>Esto se hace para permitir a los skins y a algunos códigos funcionen mejor con el tema utilizado por el sistema operativo en el que se ejecutan.</p>
+
+<h2 id="Específico_de_WebKit">Específico de WebKit</h2>
+
+<h3 id="-webkit-transform-3d">-webkit-transform-3d</h3>
+
+<p><strong>Vakir:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong>Medio:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<ul>
+ <li><a href="https://compat.spec.whatwg.org/#css-media-queries-webkit-transform-3d">Especificación</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/-webkit-transform-3d">Documentación</a></li>
+</ul>
+
+<p>Si está soportado, el valor es 1, si no, el valor es 0.</p>
+
+<p>Ejemplo</p>
+
+<pre class="brush: css"><code>@media (-webkit-transform-3d) {
+  .foo {
+    transform-style: preserve-3d;
+  }
+}
+
+@media (-webkit-transform-3d: 1) {
+  .foo {
+    transform-style: preserve-3d;
+  }
+}</code></pre>
+
+<h3 id="-webkit-transform-2d">-webkit-transform-2d</h3>
+
+<p><strong>Valor:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong>Medio:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/-webkit-transform-2d">Documentación</a></li>
+</ul>
+
+<p>Si está soportado, el valor es 1, si no, el valor es 0.</p>
+
+<h3 id="-webkit-transition">-webkit-transition</h3>
+
+<p><strong>Value:</strong> {{cssxref("&lt;integer&gt;")}}<br>
+ <strong>Medio:</strong> {{cssxref("Media/Visual")}}<br>
+ <strong>Acepta prefijos min/max:</strong> no</p>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/-webkit-transition">Documentación</a></li>
+</ul>
+
+<p>Si está soportado, el valor es 1, si no, el valor es 0.</p>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("21")}}</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
+   <td>{{CompatIE("9.0")}}</td>
+   <td>{{CompatOpera("9")}}</td>
+   <td>{{CompatSafari("4")}}</td>
+  </tr>
+  <tr>
+   <td><code>grid</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} <sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>resolution</code></td>
+   <td>{{CompatChrome("29")}}</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}} <sup>[2]</sup><br>
+    {{CompatGeckoDesktop("8.0")}} <sup>[3]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>scan</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[4]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>-webkit-min-device-pixel-ratio</code>, <code>-webkit-max-device-pixel-ratio</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}<sup>[7]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>-webkit-transform-3d</code></td>
+   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
+   <td>{{CompatGeckoDesktop("49")}}<sup>[6]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
+   <td>{{CompatSafari("1.0")}}<sup>[5]</sup></td>
+  </tr>
+  <tr>
+   <td><code>-webkit-transform-2d</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
+   <td>{{CompatSafari("1.0")}}<sup>[5]</sup></td>
+  </tr>
+  <tr>
+   <td><code>-webkit-transition</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[5]</sup></td>
+   <td>{{CompatSafari("1.0")}}<sup>[5]</sup></td>
+  </tr>
+  <tr>
+   <td><code>display-mode</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("47")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>grid</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>resolution</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>scan</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>-webkit-min-device-pixel-ratio</code>, <code>-webkit-max-device-pixel-ratio</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>-webkit-transform-3d</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>-webkit-transform-2d</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>-webkit-transition</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>display-mode</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] <code>grid</code> media type no está soportado</p>
+
+<p>[2] Soporta valores {{cssxref("&lt;integer&gt;")}}.</p>
+
+<p>[3] Soporta valores {{cssxref("&lt;number&gt;")}}, según la especificación.</p>
+
+<p>[4] <code>tv</code> media no está soportado</p>
+
+<p>[5] Ver {{WebKitBug(22494)}}.</p>
+
+<p>[6] Implementado por razones de compatibilidad web en Gecko 46.0 {{geckoRelease("46.0")}} tras tras cambiar <code>layout.css.prefixes.webkit</code> por defecto a <code>false</code> (ver {{bug(1239799)}}). Desde Gecko 49.0 {{geckoRelease("49")}} <code>layout.css.prefixes.webkit</code> por defecto es <code>true</code>.</p>
+
+<p>[7] Implementado como alias para <code>min--moz-device-pixel-ratio </code>y <code>max--moz-device-pixel-ratio</code> por razones de compatibilidad web in Gecko 45.5 {{geckoRelease("45.0")}} (ver {{bug(1176968)}}) tras cambiar <code>layout.css.prefixes.webkit</code> y <code>layout.css.prefixes.device-pixel-ratio-webkit</code> por defecto a <code>false</code>. Desde Gecko 49.0 {{geckoRelease("49")}} <code>layout.css.prefixes.webkit</code> por defecto es <code>true</code>.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/css3-mediaqueries/" title="http://www.w3.org/TR/css3-mediaqueries/">Especificación CSS 3 media query</a></li>
+ <li><a class="internal" href="/es/docs/Web/CSS/@media">Tipos de Medios</a></li>
+ <li><a href="/es/docs/Web/Guide/CSS/probando_media_queries">Usando media queries desde código</a></li>
+</ul>
diff --git a/files/es/web/css/mix-blend-mode/index.html b/files/es/web/css/mix-blend-mode/index.html
new file mode 100644
index 0000000000..776d28b030
--- /dev/null
+++ b/files/es/web/css/mix-blend-mode/index.html
@@ -0,0 +1,612 @@
+---
+title: mix-blend-mode
+slug: Web/CSS/mix-blend-mode
+tags:
+  - CSS
+translation_of: Web/CSS/mix-blend-mode
+original_slug: Web/CSS/Referencia_CSS/mix-blend-mode
+---
+<div>{{CSSRef}}</div>
+
+<p>La propiedad <a href="/es/docs/Web/CSS">CSS</a> <strong><code>mix-blend-mode</code></strong> describe cómo el contenido de un elemento debe mezclarse con el contenido del elemento que está tras él y con el fondo del elemento.</p>
+
+<div>{{EmbedInteractiveExample("pages/css/mix-blend-mode.html")}}</div>
+
+
+
+<h2 id="Syntax" name="Syntax">Syntax</h2>
+
+<pre class="brush:css no-line-numbers">/* Valores clave */
+mix-blend-mode: normal;
+mix-blend-mode: multiply;
+mix-blend-mode: screen;
+mix-blend-mode: overlay;
+mix-blend-mode: darken;
+mix-blend-mode: lighten;
+mix-blend-mode: color-dodge;
+mix-blend-mode: color-burn;
+mix-blend-mode: hard-light;
+mix-blend-mode: soft-light;
+mix-blend-mode: difference;
+mix-blend-mode: exclusion;
+mix-blend-mode: hue;
+mix-blend-mode: saturation;
+mix-blend-mode: color;
+mix-blend-mode: luminosity;
+
+/* Valores globales */
+mix-blend-mode: initial;
+mix-blend-mode: inherit;
+mix-blend-mode: unset;
+</pre>
+
+<h3 id="Values" name="Values">Valores</h3>
+
+<dl>
+ <dt>{{cssxref("&lt;blend-mode&gt;")}}</dt>
+ <dd>El modo de mezcla que debería ser aplicado.</dd>
+</dl>
+
+<h3 id="Sintaxis_formal">Sintaxis formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<div class="hidden" id="mix-blend-mode">
+<pre class="brush: html">&lt;div class="grid"&gt;
+  &lt;div class="col"&gt;
+    &lt;div class="note"&gt;Mezclado aislado (sin mezclar con el fondo)&lt;/div&gt;
+    &lt;div class="row isolate"&gt;
+      &lt;div class="cell"&gt; normal
+        &lt;div class="container normal"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;defs&gt;
+                &lt;linearGradient id="red"&gt;
+                  &lt;stop offset="0"    stop-color="hsl(0,100%,50%)" /&gt;
+                  &lt;stop offset="100%" stop-color="hsl(0,0%,100%)" /&gt;
+                &lt;/linearGradient&gt;
+                &lt;linearGradient id="green"&gt;
+                  &lt;stop offset="0"    stop-color="hsl(120,100%,50%)" /&gt;
+                  &lt;stop offset="100%" stop-color="hsl(120,0%,100%)" /&gt;
+                &lt;/linearGradient&gt;
+                &lt;linearGradient id="blue"&gt;
+                  &lt;stop offset="0"    stop-color="hsl(240,100%,50%)" /&gt;
+                  &lt;stop offset="100%" stop-color="hsl(240,0%,100%)" /&gt;
+                &lt;/linearGradient&gt;
+              &lt;/defs&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; multiply
+        &lt;div class="container multiply"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; darken
+        &lt;div class="container darken"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; screen
+        &lt;div class="container screen"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; lighten
+        &lt;div class="container lighten"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; overlay
+        &lt;div class="container overlay"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; color-dodge
+        &lt;div class="container color-dodge"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; color-burn
+        &lt;div class="container color-burn"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; hard-light
+        &lt;div class="container hard-light"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; soft-light
+        &lt;div class="container soft-light"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; difference
+        &lt;div class="container difference"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; exclusion
+        &lt;div class="container exclusion"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; hue
+        &lt;div class="container hue"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; saturation
+        &lt;div class="container saturation"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; color
+        &lt;div class="container color"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; luminosity
+        &lt;div class="container luminosity"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+    &lt;/div&gt;
+
+    &lt;div class="note"&gt;Mezclado global (mezclar con el fondo)&lt;/div&gt;
+    &lt;div class="row"&gt;
+      &lt;div class="cell"&gt; normal
+        &lt;div class="container normal"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; multiply
+        &lt;div class="container multiply"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; darken
+        &lt;div class="container darken"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; screen
+        &lt;div class="container screen"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; lighten
+        &lt;div class="container lighten"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; overlay
+        &lt;div class="container overlay"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; color-dodge
+        &lt;div class="container color-dodge"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; color-burn
+        &lt;div class="container color-burn"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; hard-light
+        &lt;div class="container hard-light"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; soft-light
+        &lt;div class="container soft-light"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; difference
+        &lt;div class="container difference"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; exclusion
+        &lt;div class="container exclusion"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; hue
+        &lt;div class="container hue"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; saturation
+        &lt;div class="container saturation"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; color
+        &lt;div class="container color"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+      &lt;div class="cell"&gt; luminosity
+        &lt;div class="container luminosity"&gt;
+          &lt;div class="group"&gt;
+            &lt;div class="item firefox"&gt;&lt;/div&gt;
+            &lt;svg viewBox="0 0 150 150"&gt;
+              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
+            &lt;/svg&gt;
+          &lt;/div&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
+    &lt;/div&gt;
+  &lt;/div&gt;
+&lt;/div&gt;</pre>
+
+<pre class="brush: css">html,body {
+  height: 100%;
+  box-sizing: border-box;
+  background: #EEE;
+}
+
+.grid {
+  width: 100%;
+  display: flex;
+  font: 1em monospace;
+}
+
+.row {
+  display: flex;
+  flex: 1 auto;
+  flex-direction: row;
+  flex-wrap: wrap;
+  height: auto;
+}
+
+.col {
+  display: flex;
+  flex: 1 auto;
+  flex-direction: column;
+  height: auto;
+}
+
+.cell {
+  margin: .5em;
+  padding: .5em;
+  background-color: #FFF;
+  overflow: hidden;
+  text-align: center;
+}
+
+.note {
+  background: #fff3d4;
+  padding: 1em;
+  margin: .5em .5em 0;
+  font: .8em sans-serif;
+  text-align: left;
+  white-space: nowrap;
+}
+
+.note + .row .cell {
+  margin-top: 0;
+}
+
+.container {
+  position: relative;
+  background: linear-gradient(to right, #000 0%, transparent 50%, #FFF 100%),
+              linear-gradient(to bottom, #FF0 0%, #F0F 50%, #0FF 100%);
+  width: 150px;
+  height: 150px;
+  margin: 0 auto;
+}
+
+.R {
+  transform-origin: center;
+  transform: rotate(-30deg);
+  fill: url(#red);
+}
+
+.G {
+  transform-origin: center;
+  transform: rotate(90deg);
+  fill: url(#green);
+}
+
+.B {
+  transform-origin: center;
+  transform: rotate(210deg);
+  fill: url(#blue);
+}
+
+.isolate .group { isolation: isolate; }
+
+.normal .item      { mix-blend-mode: normal; }
+.multiply .item    { mix-blend-mode: multiply; }
+.screen .item      { mix-blend-mode: screen; }
+.overlay .item     { mix-blend-mode: overlay; }
+.darken .item      { mix-blend-mode: darken; }
+.lighten .item     { mix-blend-mode: lighten; }
+.color-dodge .item { mix-blend-mode: color-dodge; }
+.color-burn .item  { mix-blend-mode: color-burn; }
+.hard-light .item  { mix-blend-mode: hard-light; }
+.soft-light .item  { mix-blend-mode: soft-light; }
+.difference .item  { mix-blend-mode: difference; }
+.exclusion .item   { mix-blend-mode: exclusion; }
+.hue .item         { mix-blend-mode: hue; }
+.saturation .item  { mix-blend-mode: saturation; }
+.color .item       { mix-blend-mode: color; }
+.luminosity .item  { mix-blend-mode: luminosity; }</pre>
+</div>
+
+<div>{{EmbedLiveSample("mix-blend-mode", "100%", 1600, "", "", "example-outcome-frame")}}</div>
+
+<h3 id="Ejemplo_vivo">Ejemplo vivo</h3>
+
+<pre class="brush: html">&lt;svg&gt;
+  &lt;g class="isolate"&gt;
+    &lt;circle cx="40" cy="40" r="40" fill="red"/&gt;
+    &lt;circle cx="80" cy="40" r="40" fill="lightgreen"/&gt;
+    &lt;circle cx="60" cy="80" r="40" fill="blue"/&gt;
+  &lt;/g&gt;
+&lt;/svg&gt;</pre>
+
+<pre class="brush:css">circle { mix-blend-mode: screen; }
+.isolate { isolation: isolate; } /* sin aislación, el color de fondo será tenido en cuenta */
+</pre>
+
+<p>{{EmbedLiveSample("Ejemplo_vivo", "100%", "180")}}</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('Compositing', '#mix-blend-mode', 'mix-blend-mode') }}</td>
+   <td>{{ Spec2('Compositing') }}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("css.properties.mix-blend-mode")}}</p>
+
+<h2 id="See_also" name="See_also">Véase también</h2>
+
+<ul>
+ <li>{{cssxref("&lt;blend-mode&gt;")}}</li>
+ <li>{{cssxref("background-blend-mode")}}</li>
+</ul>
diff --git a/files/es/web/css/normal/index.html b/files/es/web/css/normal/index.html
deleted file mode 100644
index 332e284385..0000000000
--- a/files/es/web/css/normal/index.html
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: normal
-slug: Web/CSS/normal
-translation_of: Web/CSS/font-variant
-translation_of_original: Web/CSS/normal
----
-<h2 id="Sumario" name="Sumario">Sumario</h2>
-<p>El valor <i>normal</i> en una propiedad CSS, es normalmente el valor medio de entre los posibles valores que puede tomar. Es el valor por defecto, es decir, el que tiene la propiedad si no establecemos uno distinto.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<p>En la propiedad <code>font-style:</code> <code>normal</code> establece que el tipo de fuente no es <code>italic</code> ni <code>oblique</code>.</p>
-<p>El la propiedad <code>font-size:</code> <code>normal</code>se establece al tamaño de la fuente al tamaño que esté establecido en el User Agent.</p>
diff --git a/files/es/web/css/percentage/index.html b/files/es/web/css/percentage/index.html
new file mode 100644
index 0000000000..4872110a2c
--- /dev/null
+++ b/files/es/web/css/percentage/index.html
@@ -0,0 +1,127 @@
+---
+title: <percentage>
+slug: Web/CSS/percentage
+translation_of: Web/CSS/percentage
+original_slug: Web/CSS/porcentaje
+---
+<p>{{CSSRef}}</p>
+
+<h2 id="Sumario">Sumario</h2>
+
+<p>Los tipos de dato <code>&lt;porcentaje&gt; </code>de <a href="/en/CSS" style="font-size: 14px; line-height: inherit;" title="CSS">CSS</a> representan un valor en forma de porcentaje. Muchas <a href="/en/CSS_Reference">propiedades de CSS</a> pueden tomar valores porcentuales, siempre para definir longitudes con respecto al tamaño de los elementos padre. Los porcentajes estan formados por un <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/number">&lt;numero&gt;</a> seguido por el signo de porcentaje <code>%</code>. No hay un espacio entre el '%' y el numero.</p>
+
+<p>Varias propriedades de longitud usan porcentajes, tales como <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/width">width</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/margin">margin</a></code> y <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/padding">padding</a>. </code>Los porcentajes tambien se pueden ver en <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-size">font-size</a>, </code>donde el tamaño del texto esta directamente relacionado al tamaño de su elemento padre.</p>
+
+<div class="note"><strong>Nota:</strong> Solo los valores calculados son heredados. Entonces, incluso si un valor porcentual es usado en en la propiedad padre, un valor real, como una anchura en pixeles para un valor <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/length">&lt;length&gt;</a>, </code>sera accesible en la propiedad heredada, no el valor porcentual.</div>
+
+<h2 id="Interpolación">Interpolación</h2>
+
+<p>Los valores del tipo de dato <code>&lt;porcentaje&gt;</code> de CSS pueden ser interpolados en orden de permitir animaciones. En ese caso ellos son interpolados como numeros reales de punto flotante. La velocidad de la interpolación se determina por medio de la <a href="/en/CSS/timing-function">funcion de temporizacion</a> asociada con la animacion.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: html">&lt;div style="background-color:#0000FF;"&gt;
+  &lt;div style="width:50%;margin-left:20%;background-color:#00FF00;"&gt;Width: 50%, Left margin: 20%&lt;/div&gt;
+  &lt;div style="width:30%;margin-left:60%;background-color:#FF0000;"&gt;Width: 30%, Left margin: 60%&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p>El codigo de arriba se va a renderizar así:</p>
+
+<div style="background-color: #0000FF;">
+<div style="width: 50%; margin-left: 20%; background-color: #00FF00;">Width: 50%, Left margin: 20%</div>
+
+<div style="width: 30%; margin-left: 60%; background-color: #FF0000;">Width: 30%, Left margin: 60%</div>
+</div>
+
+<p> </p>
+
+<pre class="brush: html">&lt;div style="font-size:18px;"&gt;
+  Full size text (18px)
+  &lt;span style="font-size:50%;"&gt;50%&lt;/span&gt;
+  &lt;span style="font-size:200%;"&gt;200%&lt;/span&gt;
+&lt;/div&gt;
+</pre>
+
+<p>El codigo de arriba de renderizara así:</p>
+
+<div style="font-size: 18px;">Full size text (18px) <span style="font-size: 50%;">50%</span> <span style="font-size: 200%;">200%</span></div>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ SpecName('CSS3 Values', '#percentages', '&lt;percentage&gt;') }}</td>
+   <td>{{ Spec2('CSS3 Values') }}</td>
+   <td>No hay cambios significantes desde CSS Level 2 (Revision 1)</td>
+  </tr>
+  <tr style="vertical-align: top;">
+   <td style="vertical-align: top;">{{ SpecName('CSS2.1', 'syndata.html#percentage-units', '&lt;percentage&gt;') }}</td>
+   <td style="vertical-align: top;">{{ Spec2('CSS2.1') }}</td>
+   <td style="vertical-align: top;">No hay cambios desde CSS Level 1</td>
+  </tr>
+  <tr>
+   <td style="vertical-align: top;">{{ SpecName('CSS1', '#percentage-units', '&lt;percentage&gt;') }}</td>
+   <td style="vertical-align: top;">{{ Spec2('CSS1') }}</td>
+   <td style="vertical-align: top;"> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>1.0</td>
+   <td>1.0 (1.0)</td>
+   <td>&lt;=5.0</td>
+   <td>yes</td>
+   <td>1.0 (85)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>si</td>
+   <td>si</td>
+   <td>si</td>
+   <td>si</td>
+   <td>si</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/css/porcentaje/index.html b/files/es/web/css/porcentaje/index.html
deleted file mode 100644
index c6629803fe..0000000000
--- a/files/es/web/css/porcentaje/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: <percentage>
-slug: Web/CSS/porcentaje
-translation_of: Web/CSS/percentage
----
-<p>{{CSSRef}}</p>
-
-<h2 id="Sumario">Sumario</h2>
-
-<p>Los tipos de dato <code>&lt;porcentaje&gt; </code>de <a href="/en/CSS" style="font-size: 14px; line-height: inherit;" title="CSS">CSS</a> representan un valor en forma de porcentaje. Muchas <a href="/en/CSS_Reference">propiedades de CSS</a> pueden tomar valores porcentuales, siempre para definir longitudes con respecto al tamaño de los elementos padre. Los porcentajes estan formados por un <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/number">&lt;numero&gt;</a> seguido por el signo de porcentaje <code>%</code>. No hay un espacio entre el '%' y el numero.</p>
-
-<p>Varias propriedades de longitud usan porcentajes, tales como <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/width">width</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/margin">margin</a></code> y <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/padding">padding</a>. </code>Los porcentajes tambien se pueden ver en <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-size">font-size</a>, </code>donde el tamaño del texto esta directamente relacionado al tamaño de su elemento padre.</p>
-
-<div class="note"><strong>Nota:</strong> Solo los valores calculados son heredados. Entonces, incluso si un valor porcentual es usado en en la propiedad padre, un valor real, como una anchura en pixeles para un valor <code><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/length">&lt;length&gt;</a>, </code>sera accesible en la propiedad heredada, no el valor porcentual.</div>
-
-<h2 id="Interpolación">Interpolación</h2>
-
-<p>Los valores del tipo de dato <code>&lt;porcentaje&gt;</code> de CSS pueden ser interpolados en orden de permitir animaciones. En ese caso ellos son interpolados como numeros reales de punto flotante. La velocidad de la interpolación se determina por medio de la <a href="/en/CSS/timing-function">funcion de temporizacion</a> asociada con la animacion.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<pre class="brush: html">&lt;div style="background-color:#0000FF;"&gt;
-  &lt;div style="width:50%;margin-left:20%;background-color:#00FF00;"&gt;Width: 50%, Left margin: 20%&lt;/div&gt;
-  &lt;div style="width:30%;margin-left:60%;background-color:#FF0000;"&gt;Width: 30%, Left margin: 60%&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-
-<p>El codigo de arriba se va a renderizar así:</p>
-
-<div style="background-color: #0000FF;">
-<div style="width: 50%; margin-left: 20%; background-color: #00FF00;">Width: 50%, Left margin: 20%</div>
-
-<div style="width: 30%; margin-left: 60%; background-color: #FF0000;">Width: 30%, Left margin: 60%</div>
-</div>
-
-<p> </p>
-
-<pre class="brush: html">&lt;div style="font-size:18px;"&gt;
-  Full size text (18px)
-  &lt;span style="font-size:50%;"&gt;50%&lt;/span&gt;
-  &lt;span style="font-size:200%;"&gt;200%&lt;/span&gt;
-&lt;/div&gt;
-</pre>
-
-<p>El codigo de arriba de renderizara así:</p>
-
-<div style="font-size: 18px;">Full size text (18px) <span style="font-size: 50%;">50%</span> <span style="font-size: 200%;">200%</span></div>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{ SpecName('CSS3 Values', '#percentages', '&lt;percentage&gt;') }}</td>
-   <td>{{ Spec2('CSS3 Values') }}</td>
-   <td>No hay cambios significantes desde CSS Level 2 (Revision 1)</td>
-  </tr>
-  <tr style="vertical-align: top;">
-   <td style="vertical-align: top;">{{ SpecName('CSS2.1', 'syndata.html#percentage-units', '&lt;percentage&gt;') }}</td>
-   <td style="vertical-align: top;">{{ Spec2('CSS2.1') }}</td>
-   <td style="vertical-align: top;">No hay cambios desde CSS Level 1</td>
-  </tr>
-  <tr>
-   <td style="vertical-align: top;">{{ SpecName('CSS1', '#percentage-units', '&lt;percentage&gt;') }}</td>
-   <td style="vertical-align: top;">{{ Spec2('CSS1') }}</td>
-   <td style="vertical-align: top;"> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>1.0</td>
-   <td>1.0 (1.0)</td>
-   <td>&lt;=5.0</td>
-   <td>yes</td>
-   <td>1.0 (85)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>si</td>
-   <td>si</td>
-   <td>si</td>
-   <td>si</td>
-   <td>si</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/preguntas_frecuentes_sobre_css/index.html b/files/es/web/css/preguntas_frecuentes_sobre_css/index.html
deleted file mode 100644
index 36c2fa1317..0000000000
--- a/files/es/web/css/preguntas_frecuentes_sobre_css/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: Preguntas frecuentes sobre CSS
-slug: Web/CSS/Preguntas_frecuentes_sobre_CSS
-tags:
-  - CSS
-  - Proyecto MDC
-translation_of: Learn/CSS/Howto/CSS_FAQ
----
-<h4 id="My_CSS_is_valid.2C_but_not_correctly_rendered" name="My_CSS_is_valid.2C_but_not_correctly_rendered"><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Mi CSS es válida, pero no se representa correctamente</span></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los navegadores utilizan la declaración <code>DOCTYPE</code> para elegir entre mostrar el documento usando un modo que sea más compatible con los estándares de la Web o mostrarlo con los fallos de los navegadores antiguos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El uso de una declaración <code>DOCTYPE</code> correcta y moderna al inicio del código HTML mejorará el cumplimiento de los estándares del navegador.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Los navegadores modernos tienen fundamentalmente dos modos de renderizado:</span></span></p>
-<ul> <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><em>Quirks mode</em> (Modo no estándar): también se llama el modo de compatibilidad con versiones anteriores y permite que las páginas web heredadas se representen como sus autores habían previsto, siguiendo las normas de representación o renderizado no estándares que usan los navegadores antiguos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los documentos con una declaración <code>DOCTYPE</code> incompleta, incorrecta o faltante o con una declaración <code>DOCTYPE</code> conocida que se usara habitualmente antes de 2001 se representarán en el Modo no estándar.</span></span></li> <li><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""><em>Standards Mode</em> (Modo estándar): el navegador intenta seguir estrictamente los estándares del W3C.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Se supone que las nuevas páginas HTML se diseñarán para navegadores compatibles con los estándares, y como resultado, las páginas con una declaración <code>DOCTYPE</code> moderna será renderizada con el Modo estándar.</span></span></li>
-</ul>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los navegadores basados en Gecko tienen un tercer <em><a href="/en/Gecko's_&quot;Almost_Standards&quot;_Mode" title="en/Gecko's &quot;Almost Standards&quot; Mode">Modo casi estándar</a></em> que tiene solo una peculiaridades menores.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esta es una lista de las declaraciones <code>DOCTYPE</code> más utilizadas que activarán el Modo estándar o el Modo casi estándar:</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.0 Transitional / / EN"</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/html4/loose.dtd"&gt;</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.01 / / EN"</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/html4/strict.dtd"&gt;</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD XHTML 1.0 Transitional / / EN"</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;!</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">DOCTYPE HTML PUBLIC "- / / W3C / / DTD XHTML 1.0 Strict / / EN"</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;</span></span>
-</pre>
-<h4 id="Difference_between_id_and_class" name="Difference_between_id_and_class"><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Diferencia entre <code>id</code> y <code>class</code></span></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los elementos HTML pueden tener un atributo <code>id</code> y / o un atributo <code>class</code>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El atributo <code>id</code> asigna un nombre a un elemento determinado y debe haber un solo elemento con ese nombre.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El atributo <code>class</code> asigna un elemento a una determinada clase y en general no puede haber más de un elemento con el mismo atributo <code>class</code>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">CSS te permite aplicar estilos a un atributo <code>id</code> y / o <code>class</code> concreto.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Utiliza un estilo específico de <code>id</code> cuando desees restringir las reglas de estilo a un bloque o elemento concreto.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este estilo lo usará <strong>un solo</strong> elemento con ese <code>id</code> concreto.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Usa un estilo específico de <code>class</code> cuando desees aplicar las reglas de estilo a una determinada clase de bloques y elementos.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Consulta <a href="/en/CSS/Getting_Started/Selectors" title="en/CSS/Getting Started/Selectors">Selectores CSS</a></span></span></p>
-<h4 id="Restoring_the_default_property_value" name="Restoring_the_default_property_value"><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Restaurar el valor de la propiedad predeterminado</span></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Debido a que CSS no proporciona una palabra clave "predeterminada", la única manera de restaurar el valor predeterminado de una propiedad es volver a declarar explícitamente dicha propiedad.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por lo tanto, debes tener especial cuidado al escribir reglas de estilo usando selectores (por ejemplo, los selectores por nombre de etiqueta, como <code>p</code> ) que tal vez desees reemplazar con reglas más específicas (como las que usan id o selectores de clase), porque el valor predeterminado original no puede restablecerse automáticamente.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Debido a la naturaleza <em>en cascada</em> de CSS, es una buena práctica definir reglas de estilo de una manera lo más concreta posible para evitar aplicar estilo a elementos a los que no se tenía previsto aplicar.</span></span></p>
-<h4 id="Derived_styles" name="Derived_styles"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Estilos derivados</span></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">CSS no permite que se defina un estilo según los términos de otro.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">(Consulta la <a class="external" href="http://archivist.incutio.com/viewlist/css-discuss/2685" title="http://archivist.incutio.com/viewlist/css-discuss/2685">nota de Eric Meyer acerca de la postura del Grupo de trabajo)</a>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Sin embargo, la asignación de múltiples clases a un solo elemento puede proporcionar el mismo efecto.</span></span></p>
-<h4 id="Assigning_multiple_classes" name="Assigning_multiple_classes"><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Asignación de múltiples clases</span></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">A los elementos HTML se les pueden asignar varias clases listándolas  en el atributo <code>class</code>, con un espacio en blanco para separarlas.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;style type="text/css"&gt;</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.news { background: black; color: white; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.today { font-weight: bold; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/style&gt;</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;div class="news today"&gt;</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">... contenido de las noticias de hoy ...</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si la misma propiedad se declara en ambas reglas, el conflicto se resuelve primero a través de la especificidad, a continuación, según el orden de las declaraciones CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El orden de las clases en el atributo <code>class</code> no es relevante.</span></span></p>
-<h4 id="Style_rules_that_don.27t_work" name="Style_rules_that_don.27t_work"><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Normas de estilo que no funcionan</span></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Las reglas de estilo que son sintácticamente correctas pueden no aplicarse en determinadas situaciones.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Puedes utilizar las <em>Reglas de estilo de CSS</em> del <a href="/en/DOM_Inspector" title="en/DOM Inspector">Inspector DOM</a> para depurar los problemas de este tipo, pero los casos más frecuentes en los que se ignoran las reglas de estilo se enumeran a continuación.</span></span></p>
-<h5 id="HTML_elements_hierarchy" name="HTML_elements_hierarchy"><span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Jerarquía de los elementos HTML</span></span></h5>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La forma en que se aplican los estilos CSS a los elementos HTML depende también de la jerarquía de los elementos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Es importante recordar que una regla que se aplica a un descendiente reemplaza el estilo del padre, a pesar de la especificidad o la prioridad de las reglas CSS.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.news { color: black; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">. corpName {font-weight: bold; color: red;}</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;!-- el texto de la noticia es negro, pero el nombre de la empresa va en rojo y negrita --&gt;</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div class="news"&gt;</span></span>
-   <span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">(Reuters) &lt;span class="corpName"&gt; General Electric &lt;/ span&gt; (GE.NYS) anunció el jueves ...</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el caso de jerarquías HTML complejas, si parece que se ignora una regla, comprueba si el elemento está dentro de otro elemento con un estilo diferente.</span></span></p>
-<h5 id="Explicitly_re-defined_style_rule" name="Explicitly_re-defined_style_rule"><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Regla de estilo explícitamente redefinida</span></span></h5>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En las hojas de estilo CSS el orden <strong>es</strong> importante.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si defines una regla y luego vuelves a definirla, se usará la última definición.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker { font-weight: bold; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockSymbol { color: red; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">/*  otras reglas             */</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">/*  otras reglas             */</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">/*  otras reglas             */</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-73"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockSymbol { font-weight: normal; }</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-74"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;!-- la mayor parte del texto va en negrita, con excepción de "GE", que va en rojo y no en negrita --&gt;</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-75"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="stockTicker"&gt;</span></span>
-   <span class="goog-gtc-unit" id="goog-gtc-unit-76"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">NYS: &lt;span class="stockSymbol"&gt;GE&lt;/span&gt; +1.0 ...</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-77"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-78"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para evitar este tipo de errores, intenta definir las reglas solo una vez para un selector determinado y agrupa todas las reglas que pertenecen a ese selector.</span></span></p>
-<h5 id="Use_of_a_shorthand_property" name="Use_of_a_shorthand_property"><span class="goog-gtc-unit" id="goog-gtc-unit-79"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Uso de una propiedad abreviada</span></span></h5>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-80"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Está bien usar las propiedades abreviadas para la definición de reglas de estilo, ya que utiliza una sintaxis muy compacta.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-81"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Usar la abreviatura con sólo algunos atributos es posible y correcto, pero hay que recordar que los atributos no declarados se restablecen a los valores predeterminados automáticamente.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-82"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto significa que una norma anterior para un solo atributo podría ser reemplazada implícitamente.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-83"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker { font-size: 12px; font-family: Verdana; font-weight: bold; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-84"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockSymbol { font: 14px Arial; color: red; }</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-85"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="stockTicker"&gt;</span></span>
-   <span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">NYS: &lt;span class="stockSymbol"&gt;GE&lt;/span&gt; +1.0 ...</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-87"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-88"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el ejemplo anterior el problema se produjo en las reglas que pertencían a distintos elementos, pero puede ocurrir también para el mismo elemento, porque el orden de las reglas <strong>es</strong> importante.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-89"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker {</span></span>
-   <span class="goog-gtc-unit" id="goog-gtc-unit-90"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">font-weight: bold;</span></span>
-   <span class="goog-gtc-unit" id="goog-gtc-unit-91"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">font: 12px Verdana; / * font-weight es ahora normal * /</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-92"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">}</span></span>
-</pre>
-<h5 id="Use_of_the_.2A_selector" name="Use_of_the_.2A_selector"><span class="goog-gtc-unit" id="goog-gtc-unit-93"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Uso del selector <code>*</code></span></span></h5>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-94"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El selector <code>*</code> se refiere a cualquier elemento y tiene que utilizarse con especial cuidado.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-95"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">body * { font-weight: normal; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-96"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#stockTicker { font: 12px Verdana; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-97"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.corpName { font-weight: bold; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-98"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.stockUp { color: red; }</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-99"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="section"&gt;</span></span>
-   <span class="goog-gtc-unit" id="goog-gtc-unit-100"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">NYS: &lt;span class="corpName"&gt;&lt;span class="stockUp"&gt;GE&lt;/span&gt;&lt;/span&gt; +1.0 ...</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-101"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ div&gt;</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-102"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En este ejemplo, el selector <code>body *</code> aplica la regla a todos los elementos dentro del cuerpo (<em>body</em>), en cualquier nivel de jerarquía, incluyendo <em>redtext.</em></span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-103"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Así <code>font-weight: bold;</code> aplicada a la clase <em>boldtext</em> se reemplaza por <code>font-weight: normal;</code> aplicada a <em>redtext.</em></span></span></p>
-<h5 id="Specificity_in_CSS" name="Specificity_in_CSS"><span class="goog-gtc-unit" id="goog-gtc-unit-104"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Especificidad en CSS</span></span></h5>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-105"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cuando se aplican múltiples reglas a un determinado elemento, la norma escogida depende de su especificidad de estilo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-106"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El estilo en línea (en los atributos HTML <code>style</code>) es lo primero, seguido por los selectores id, a continuación, los selectores class y, finalmente, los selectores element-name.</span></span></p>
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-107"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">div { color: black; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-108"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">#orange { color: orange; }</span></span>
-<span class="goog-gtc-unit" id="goog-gtc-unit-109"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">.green { color: green; }</span></span>
-
-<span class="goog-gtc-unit" id="goog-gtc-unit-110"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;div id="orange" class="green" style="color: red;"&gt;This is red&lt;/div&gt;</span></span>
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-111"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Las reglas son más complicadas cuando el selector tiene varias partes.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-112"><span class="goog-gtc-translatable goog-gtc-from-human goog-gtc-ph-missing" dir="ltr" style="">Se puede encontrar más información detallada acerca de cómo se calcula la especificidad del selector en el <a class=" external" href="http://www.w3.org/TR/CSS21/cascade.html#specificity" title="http://www.w3.org/TR/CSS21/cascade.html#specificity">capítulo 6.4.3 de la Especificación CSS 2.1</a></span></span></p>
-<h4 id="What_do_the_-moz-.2A_properties_do.3F" name="What_do_the_-moz-.2A_properties_do.3F"><span class="goog-gtc-unit" id="goog-gtc-unit-113"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">¿Qué hacen las propiedades -moz-*?</span></span></h4>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-114"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por favor, consulta la página <a class="internal" href="/en/CSS_Reference/Mozilla_Extensions" title="en/CSS Reference/Mozilla Extensions">Extensiones CSS de Mozilla</a>.</span></span></p>
-<p> </p>
-<p>{{ languages( { "en": "en/Common_CSS_Questions", "pl": "pl/Cz\u0119ste_pytania_o_CSS", "zh-tw": "zh_tw/CSS_\u4e00\u822c\u554f\u984c" } ) }}</p>
diff --git a/files/es/web/css/primeros_pasos/index.html b/files/es/web/css/primeros_pasos/index.html
deleted file mode 100644
index c6eb218230..0000000000
--- a/files/es/web/css/primeros_pasos/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: Primeros pasos
-slug: Web/CSS/Primeros_pasos
----
-<p> </p>
-<h2 id="Introducción">Introducción</h2>
-<p>Este tutorial es una introducción a las hojas de estilo en cascada (CSS).</p>
-<p>Te guiará a través de las funcionalidades básicas de CSS con ejemplos prácticos que puedes poner a prueba en tu propio equipo. Tiene dos partes.</p>
-<ul> <li>La primera parte ilustra las funcionalidades estándar de CSS que funcionan en los navegadores de Mozilla y en casi todos los navegadores modernos.</li>
-</ul>
-<ul> <li>La segunda parte contiene algunos ejemplos de funciones especiales que funcionan en Mozilla pero no necesariamente en otros ambientes.</li>
-</ul>
-<p>El tutorial está basado en la <a class="external" href="http://www.w3.org/TR/CSS21/">especificación 2.1 de CSS 2.1</a>.</p>
-<h3 id="¿Quién_debe_usar_este_tutorial">¿Quién debe usar este tutorial?</h3>
-<p>Este tutotial es prácticamente para principiantes en CSS, pero también puedes usarlo si tienes alguna experiencia en CSS.</p>
-<p>Si eres un principiante en CSS, usa la primera parte del tutorial para entender CSS y aprender cómo usarlo. Después usa la segunda parte para entender el alcance de CSS en Mozilla.</p>
-<p>Si sabes algo de CSS, puedes saltearte las partes del tutorial que ya conoces y sólo leer las partes que te interesen.</p>
-<p>Si eres experimentado en CSS pero no en Mozilla, puedes pasar a la segunda parte.</p>
-<h3 id="¿Qué_necesitas_antes_de_empezar">¿Qué necesitas antes de empezar?</h3>
-<p>Para obtener lo mejor de este tutorial, necesitas un editor de archivos de texto y un navegador basado en Mozilla (Firefox o SeaMonkey). Deberías tener conocimientos básicos de cómo usarlos.</p>
-<p>Si no quieres editar archivos, puedes leer el tutorial y mirar las imágenes, pero esa es una forma menos efectiva de aprender.</p>
-<p>Unas pequeñas partes del tutorial requieren otros programas de Mozilla. Esas partes son opcionales. Si no quieres descargar otras aplicaciones de Mozilla, puedes saltearte esas partes. El otro software de Mozilla que se referencia en este tutorial incluye:</p>
-<ul> <li><a href="/en/DOM_Inspector" title="en/DOM Inspector">DOM Inspector</a></li>
-</ul>
-<p><strong>Nota: </strong> CSS brinda formas de trabajar con el color, así que partes de este tutorial dependen del color. Puedes usar estas partes fácilmente si tienes un monitor a color y una visión de colores normal.</p>
-<h3 id="Cómo_usar_este_tutorial">Cómo usar este tutorial</h3>
-<p>Para usar este tutorial, lee las páginas detenidamente y en orden. Si pierdes una página, podrá resultarte difícil entender las páginas posteriores.</p>
-<p>En cada página, usa la sección de <em>Información</em> para entender cómo funciona CSS. Usa la sección <em>Acción</em> para probar el uso de CSS en tu propio equipo.</p>
-<p>Para probar que hayas entendido, haz el desafío al final de cada página. Las soluciones a los desafíos están enlazados debajo de ellos, así no necesitas mirarlos si no quieres hacerlo.</p>
-<p>Para entender CSS más profundamente, lee la información que encontrarás en las cajas con el título <em>Más detalles</em>. Usa los enlaces que se encuentran allí para buscar información de referencia acerca de CSS.</p>
-<h2 id="Primera_parte_del_tutorial">Primera parte del tutorial</h2>
-<p>Una guía básica paso a paso de CSS.</p>
-<ol> <li><strong><a href="/en/CSS/Getting_Started/What_is_CSS" title="en/CSS/Getting_Started/What_is_CSS">What is CSS</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Why_use_CSS" title="en/CSS/Getting_Started/Why_use_CSS">Why use CSS</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/How_CSS_works" title="en/CSS/Getting_Started/How_CSS_works">How CSS works</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Cascading_and_inheritance" title="en/CSS/Getting_Started/Cascading_and_inheritance">Cascading and inheritance</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Selectors" title="en/CSS/Getting_Started/Selectors">Selectors</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Readable_CSS" title="en/CSS/Getting_Started/Readable_CSS">Readable CSS</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Text_styles" title="en/CSS/Getting_Started/Text_styles">Text styles</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Color" title="en/CSS/Getting_Started/Color">Color</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Content" title="en/CSS/Getting_Started/Content">Content</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Lists" title="en/CSS/Getting_Started/Lists">Lists</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Boxes" title="en/CSS/Getting_Started/Boxes">Boxes</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Layout" title="en/CSS/Getting_Started/Layout">Layout</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Tables" title="en/CSS/Getting_Started/Tables">Tables</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/Media" title="en/CSS/Getting_Started/Media">Media</a></strong></li>
-</ol>
-<h2 id="Segunda_parte_del_tutorial">Segunda parte del tutorial</h2>
-<p>Ejemplos que muestran el alcance del CSS en Mozilla.</p>
-<ol> <li><strong><a href="/en/CSS/Getting_Started/JavaScript" title="en/CSS/Getting_Started/JavaScript">JavaScript</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/XBL_bindings" title="en/CSS/Getting_Started/XBL_bindings">XBL bindings</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/XUL_user_interfaces" title="en/CSS/Getting_Started/XUL_user_interfaces">XUL user interfaces</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/SVG_graphics" title="en/CSS/Getting_Started/SVG_graphics">SVG graphics</a></strong></li> <li><strong><a href="/en/CSS/Getting_Started/XML_data" title="en/CSS/Getting_Started/XML_data">XML data</a></strong></li>
-</ol>
-<p>{{ languages( { "en": "en/CSS/Getting_Started", "de": "de/CSS/Einführung", "es": "es/CSS/Primeros_pasos", "fr": "fr/CSS/Premiers_pas", "it": "it/Conoscere_i_CSS", "ja": "ja/CSS/Getting_Started", "nl": "nl/CSS/Voor_Beginners", "pl": "pl/CSS/Na_pocz\u0105tek", "pt": "pt/CSS/Como_come\u00e7ar", "zh-cn": "cn/CSS/\u5f00\u59cb" } ) }}</p>
diff --git a/files/es/web/css/pseudo-elements/index.html b/files/es/web/css/pseudo-elements/index.html
new file mode 100644
index 0000000000..605803e0e0
--- /dev/null
+++ b/files/es/web/css/pseudo-elements/index.html
@@ -0,0 +1,87 @@
+---
+title: Pseudoelementos
+slug: Web/CSS/Pseudo-elements
+tags:
+  - CSS
+  - Pseudo-element
+  - Pseudo-elementos
+  - Selectores
+translation_of: Web/CSS/Pseudo-elements
+original_slug: Web/CSS/Pseudoelementos
+---
+<div>{{ CSSRef() }}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Al igual que las {{ Cssxref("Pseudo-classes") }}, los pseudo-elementos se añaden a los selectores, pero en cambio, no describen un estado especial sino que, permiten añadir estilos a una parte concreta del documento. Por ejemplo, el pseudoelemento {{ Cssxref("::first-line") }} selecciona solo la primera línea del elemento especificado por el selector.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">selector::pseudo-elemento { propiedad: valor; }</pre>
+
+<h2 id="Lista_de_pseudoelementos">Lista de pseudoelementos</h2>
+
+<ul>
+ <li>{{ Cssxref("::after") }}</li>
+ <li>{{ Cssxref("::before") }}</li>
+ <li>{{ Cssxref("::first-letter") }}</li>
+ <li>{{ Cssxref("::first-line") }}</li>
+ <li>{{ Cssxref("::selection") }}</li>
+ <li>{{ Cssxref("::backdrop") }}</li>
+ <li>{{ Cssxref("::placeholder") }} {{experimental_inline}}</li>
+ <li>{{ Cssxref("::marker") }} {{experimental_inline}}</li>
+ <li>{{ Cssxref("::spelling-error") }} {{experimental_inline}}</li>
+ <li>{{ Cssxref("::grammar-error") }} {{experimental_inline}}</li>
+</ul>
+
+<h2 id="Notas">Notas</h2>
+
+<p>De vez en cuando se utilizan dos puntos dobles (::) en vez de solo uno (:). Esto forma parte de CSS3 y de un intento para distinguir pseudo-elementos de pseudo-clases.</p>
+
+<div class="note"><strong>Nota:</strong> <code>::selection</code> siempre se escribe con dos puntos dobles (::).</div>
+
+<p class="note">Solo se puede usar un pseudo-elemento por selector. Debe aparecer después del selector simple.</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Navegador</th>
+   <th>Versión inferior</th>
+   <th>Soporta</th>
+  </tr>
+  <tr>
+   <td rowspan="2">Internet Explorer</td>
+   <td>8.0</td>
+   <td><code>:pseudoelemento</code></td>
+  </tr>
+  <tr>
+   <td>9.0</td>
+   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
+  </tr>
+  <tr>
+   <td rowspan="2">Firefox (Gecko)</td>
+   <td>1.0 (1.0)</td>
+   <td><code>:pseudoelemento</code></td>
+  </tr>
+  <tr>
+   <td>1.0 (1.5)</td>
+   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
+  </tr>
+  <tr>
+   <td rowspan="2">Opera</td>
+   <td>4.0</td>
+   <td><code>:pseudoelemento</code></td>
+  </tr>
+  <tr>
+   <td>7.0</td>
+   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
+  </tr>
+  <tr>
+   <td>Safari (WebKit)</td>
+   <td>1.0 (85)</td>
+   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
diff --git a/files/es/web/css/pseudoelementos/index.html b/files/es/web/css/pseudoelementos/index.html
deleted file mode 100644
index c65b904163..0000000000
--- a/files/es/web/css/pseudoelementos/index.html
+++ /dev/null
@@ -1,86 +0,0 @@
----
-title: Pseudoelementos
-slug: Web/CSS/Pseudoelementos
-tags:
-  - CSS
-  - Pseudo-element
-  - Pseudo-elementos
-  - Selectores
-translation_of: Web/CSS/Pseudo-elements
----
-<div>{{ CSSRef() }}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Al igual que las {{ Cssxref("Pseudo-classes") }}, los pseudo-elementos se añaden a los selectores, pero en cambio, no describen un estado especial sino que, permiten añadir estilos a una parte concreta del documento. Por ejemplo, el pseudoelemento {{ Cssxref("::first-line") }} selecciona solo la primera línea del elemento especificado por el selector.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">selector::pseudo-elemento { propiedad: valor; }</pre>
-
-<h2 id="Lista_de_pseudoelementos">Lista de pseudoelementos</h2>
-
-<ul>
- <li>{{ Cssxref("::after") }}</li>
- <li>{{ Cssxref("::before") }}</li>
- <li>{{ Cssxref("::first-letter") }}</li>
- <li>{{ Cssxref("::first-line") }}</li>
- <li>{{ Cssxref("::selection") }}</li>
- <li>{{ Cssxref("::backdrop") }}</li>
- <li>{{ Cssxref("::placeholder") }} {{experimental_inline}}</li>
- <li>{{ Cssxref("::marker") }} {{experimental_inline}}</li>
- <li>{{ Cssxref("::spelling-error") }} {{experimental_inline}}</li>
- <li>{{ Cssxref("::grammar-error") }} {{experimental_inline}}</li>
-</ul>
-
-<h2 id="Notas">Notas</h2>
-
-<p>De vez en cuando se utilizan dos puntos dobles (::) en vez de solo uno (:). Esto forma parte de CSS3 y de un intento para distinguir pseudo-elementos de pseudo-clases.</p>
-
-<div class="note"><strong>Nota:</strong> <code>::selection</code> siempre se escribe con dos puntos dobles (::).</div>
-
-<p class="note">Solo se puede usar un pseudo-elemento por selector. Debe aparecer después del selector simple.</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Navegador</th>
-   <th>Versión inferior</th>
-   <th>Soporta</th>
-  </tr>
-  <tr>
-   <td rowspan="2">Internet Explorer</td>
-   <td>8.0</td>
-   <td><code>:pseudoelemento</code></td>
-  </tr>
-  <tr>
-   <td>9.0</td>
-   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
-  </tr>
-  <tr>
-   <td rowspan="2">Firefox (Gecko)</td>
-   <td>1.0 (1.0)</td>
-   <td><code>:pseudoelemento</code></td>
-  </tr>
-  <tr>
-   <td>1.0 (1.5)</td>
-   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
-  </tr>
-  <tr>
-   <td rowspan="2">Opera</td>
-   <td>4.0</td>
-   <td><code>:pseudoelemento</code></td>
-  </tr>
-  <tr>
-   <td>7.0</td>
-   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
-  </tr>
-  <tr>
-   <td>Safari (WebKit)</td>
-   <td>1.0 (85)</td>
-   <td><code>:pseudoelemento </code>y<code> ::pseudoelemento</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
diff --git a/files/es/web/css/reference/index.html b/files/es/web/css/reference/index.html
new file mode 100644
index 0000000000..9d8a411f37
--- /dev/null
+++ b/files/es/web/css/reference/index.html
@@ -0,0 +1,247 @@
+---
+title: Referencia CSS
+slug: Web/CSS/Reference
+tags:
+  - CSS
+  - Referencia CSS
+  - para_revisar
+translation_of: Web/CSS/Reference
+original_slug: Web/CSS/Referencia_CSS
+---
+<div class="note">
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Estamos trabajando sobre este documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si deseas ayudarnos a redactar o mejorar alguna de las páginas listadas a continuación, te animamos a que lo hagas.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si vas a agregar o modificar una página, por favor, ajústate a la plantilla <a href="/en/CSS/CSS_Reference/Property_Template" title="en/CSS Reference/Property Template">Referencia CSS:Plantilla de propiedades </a> y modifica según sea necesario.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">La plantilla básica para las páginas de ejemplo se puede encontrar aquí: </span></span> <a class="internal" href="/samples/cssref/TEMPLATE.html" title="https://developer.mozilla.org/samples/cssref/TEMPLATE.html ">samples/cssref/TEMPLATE.html</a>.</p>
+<span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Siéntete libre para discutir sobre cualquier pregunta o sugerencia en la página <a href="/Talk:en/CSS_Reference" title="Talk:en/CSS Reference">Talk:CSS Reference</a>.</span></span></div>
+
+<p><span class="seoSummary">Esta <em>Referencia CSS</em> muestra la sintáxis básica de una regla CSS; lista todas las propiedades estándares <a href="/es/docs/Web/CSS">CSS</a>, <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-classes</a> y <a href="/es/docs/Web/CSS/Pseudoelementos">pseudo-elementos</a>, <a href="/es/docs/Web/CSS/At-rule">reglas-at</a>, <a href="/es/docs/Web/CSS/length">unidades</a>, y <a href="/es/docs/Web/CSS/Introducci%C3%B3n/Selectors">selectores</a>, todos juntos en <a href="#Keyword_index">orden alfabético</a>, así como los <a href="#Selectors">selectores por tipo</a>; y le permitirá acceso rápido a la información detallada de cada uno de ellos. No solo lista las propiedades de CSS 1 y CSS 2.1, sino que también es una referencia de CSS3 que enlaza cualquier propiedad y concepto de <a href="/es/docs/Web/CSS/CSS3">CSS3</a> estandarizado, o ya establecido. También incluye una breve <a href="#DOM_CSS">referencia DOM-CSS / CSSOM</a>.</span></p>
+
+<p>Tenga en cuenta que las definiciones de reglas CSS son completamente <a href="https://www.w3.org/TR/css-syntax-3/#intro">basadas en texto</a> (ASCII), mientras que DOM-CSS / CSSOM, el sistema de gestión de reglas, está <a href="https://www.w3.org/TR/cssom/#introduction">basado en objetos</a>.</p>
+
+<p>Vea también las <a href="/es/docs/Web/CSS/Referencia_CSS/Extensiones_CSS_Mozilla">Extensiones CSS de Mozilla</a> para propiedades específicas de Gecko, que usan el prefijo <code>-moz</code>; y las <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Reference/Webkit_Extensions">Extensiones CSS de WebKit</a> para propiedades específicas de WebKit. Vea <a href="http://peter.sh/experiments/vendor-prefixed-css-property-overview/">Vendor-prefixed CSS Property Overview</a> de Peter Beverloo como referencia a todas las propiedades con prefijo.</p>
+
+<h2 id="Sintaxis_de_regla_básica">Sintaxis de regla básica</h2>
+
+<p>Se advierte que cualquier error de sintaxis en una definición de regla invalidará la regla por completo.</p>
+
+<h3 id="Sintaxis_de_regla_de_estilo">Sintaxis de regla de estilo</h3>
+
+<pre class="syntaxbox"><strong><var>selectorlist</var> {
+   <var>property</var>: <var>value</var>; </strong>
+   <var>[more property:value; pairs] </var>
+<strong>}</strong>
+
+...where <var>selectorlist</var> is: <var>selector[:pseudo-class] [::pseudo-element] [, more selectorlists]</var>
+
+Ver <a href="#Selectors"><em>selector</em></a>, <em><a href="#pelm">pseudo-elemento</a></em>, <a href="#pcls"><em>pseudo-clase</em></a> más abajo.
+
+</pre>
+
+<h4 id="Ejemplos_de_reglas_de_estilo">Ejemplos de reglas de estilo</h4>
+
+<pre class="brush: css">strong {
+  color: red;
+}
+
+div.menu-bar li:hover &gt; ul {
+  display: block;
+}
+</pre>
+
+<p>Para una introducción de nivel principiante a la sintaxis de los selectores de CSS, consulte <a href="/es/docs/Learn/CSS/Introduction_to_CSS/Selectors">este tutorial</a>. Tenga en cuenta que cualquier error de <a href="/es/docs/Web/CSS/syntax">sintaxis CSS</a> en una definición de regla hace que la regla completa se invalide. El navegador ignora las reglas no válidas. Tenga en cuenta que las definiciones de reglas CSS son totalmente (ASCII) <a href="https://www.w3.org/TR/css-syntax-3/#intro">basadas en texto</a>, mientras que DOM-CSS / CSSOM (el sistema de gestión de reglas) está <a href="https://www.w3.org/TR/cssom/#introduction">basado en objetos</a>.</p>
+
+<h3 id="Sintaxis_de_las_reglas-at_(rules)">Sintaxis de las reglas-at (@rules)</h3>
+
+<p>Debido a que éstas tienen formatos de estructura variados, revise la sección <a href="/es/docs/Web/CSS/At-rule">reglas-At</a> para ver la sintaxis de la regla deseada.</p>
+
+<h2 id="Índice_de_palabras_clave">Índice de palabras clave</h2>
+
+<div class="note">
+<p><strong>Nota:</strong> Los nombres de propiedad en este índice <strong>no</strong> incluyen los <a href="/es/docs/Web/CSS/CSS_Properties_Reference">nombres de JavaScript</a> donde difieren de los nombres estándar de CSS.</p>
+</div>
+
+<div>{{CSS_Ref}}</div>
+
+<h2 id="Selectores">Selectores</h2>
+
+<h3 id="Selectores_básicos"><a href="/es/docs/Web/CSS/CSS_Selectors#Basic_selectors">Selectores básicos</a></h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/Type_selectors">Selectores de tipo</a> <code>elementname</code></li>
+ <li><a href="/es/docs/Web/CSS/Class_selectors">Selectores de clase</a> <code>.classname</code></li>
+ <li><a href="/es/docs/Web/CSS/ID_selectors">Selectores de ID</a> <code>#idname</code></li>
+ <li><a href="/es/docs/Web/CSS/Universal_selectors">Selectores universales</a> <code>*</code>, <code>ns|*</code>, <code>*|*</code>, <code>|*</code></li>
+ <li><a href="/es/docs/Web/CSS/Selectores_atributo">Selectores de atributo</a> <code>[attr=value]</code></li>
+</ul>
+
+<h3 id="Combinadores"><a href="/es/docs/Web/CSS/CSS_Selectors#Combinators">Combinadores</a></h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/Selectores_hermanos_adyacentes">Selectores de hermanos adyacentes</a> <code>A + B</code></li>
+ <li><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Selectores de hermanos generales</a> <code>A ~ B</code></li>
+ <li><a href="/es/docs/Web/CSS/Child_selectors">Selectores de hijo</a> <code>A &gt; B</code></li>
+ <li><a href="/es/docs/Web/CSS/Descendant_selectors">Selectores de descendiente</a> <code>A B</code></li>
+</ul>
+
+<h3 id="Pseudo-clases"><a href="/es/docs/Web/CSS/Pseudo-classes">Pseudo-clases</a></h3>
+
+<div class="index">
+<ul>
+ <li id="pcls">{{ Cssxref(":active") }}</li>
+ <li>{{ Cssxref(':any')}}</li>
+ <li>{{ Cssxref(':any-link')}}</li>
+ <li>{{ Cssxref(":checked") }}</li>
+ <li>{{ Cssxref(":default") }}</li>
+ <li>{{ Cssxref(":defined") }}</li>
+ <li>{{ Cssxref(":dir", ":dir()")}}</li>
+ <li>{{ Cssxref(":disabled") }}</li>
+ <li>{{ Cssxref(":empty") }}</li>
+ <li>{{ Cssxref(":enabled") }}</li>
+ <li>{{ Cssxref(":first") }}</li>
+ <li>{{ Cssxref(":first-child") }}</li>
+ <li>{{ Cssxref(":first-of-type") }}</li>
+ <li>{{ Cssxref(":fullscreen") }}</li>
+ <li>{{ Cssxref(":focus") }}</li>
+ <li>{{ Cssxref(":focus-visible") }}</li>
+ <li>{{ Cssxref(":host") }}</li>
+ <li>{{ Cssxref(":host()") }}</li>
+ <li>{{ Cssxref(":host-context()") }}</li>
+ <li>{{ Cssxref(":hover") }}</li>
+ <li>{{ Cssxref(":indeterminate") }}</li>
+ <li>{{ Cssxref(":in-range") }}</li>
+ <li>{{ Cssxref(":invalid") }}</li>
+ <li>{{ Cssxref(":lang", ":lang()") }}</li>
+ <li>{{ Cssxref(":last-child") }}</li>
+ <li>{{ Cssxref(":last-of-type") }}</li>
+ <li>{{ Cssxref(":left") }}</li>
+ <li>{{ Cssxref(":link") }}</li>
+ <li>{{ Cssxref(":not", ":not()") }}</li>
+ <li>{{ Cssxref(":nth-child", ":nth-child()") }}</li>
+ <li>{{ Cssxref(":nth-last-child", ":nth-last-child()") }}</li>
+ <li>{{ Cssxref(":nth-last-of-type", ":nth-last-of-type()") }}</li>
+ <li>{{ Cssxref(":nth-of-type", ":nth-of-type()") }}</li>
+ <li>{{ Cssxref(":only-child") }}</li>
+ <li>{{ Cssxref(":only-of-type") }}</li>
+ <li>{{ Cssxref(":optional") }}</li>
+ <li>{{ Cssxref(":out-of-range") }}</li>
+ <li>{{ Cssxref(":read-only") }}</li>
+ <li>{{ Cssxref(":read-write") }}</li>
+ <li>{{ Cssxref(":required") }}</li>
+ <li>{{ Cssxref(":right") }}</li>
+ <li>{{ Cssxref(":root") }}</li>
+ <li>{{ Cssxref(":scope") }}</li>
+ <li>{{ Cssxref(":target") }}</li>
+ <li>{{ Cssxref(":valid") }}</li>
+ <li>{{ Cssxref(":visited") }}</li>
+</ul>
+</div>
+
+<h3 id="Pseudo-elementos"><a href="/en-US/docs/Web/CSS/Pseudo-elements">Pseudo-elementos</a></h3>
+
+<div class="index">
+<ul>
+ <li id="pelm">{{ Cssxref("::after") }}</li>
+ <li>{{ Cssxref("::backdrop") }}</li>
+ <li>{{ Cssxref("::before") }}</li>
+ <li>{{ Cssxref("::cue") }}</li>
+ <li>{{ Cssxref("::first-letter") }}</li>
+ <li>{{ Cssxref("::first-line") }}</li>
+ <li>{{ Cssxref("::grammar-error") }} {{experimental_inline}}</li>
+ <li>{{ Cssxref("::marker") }} {{experimental_inline}}</li>
+ <li>{{ Cssxref("::placeholder") }} {{experimental_inline}}</li>
+ <li>{{ Cssxref("::selection") }}</li>
+ <li>{{ Cssxref("::spelling-error") }} {{experimental_inline}}</li>
+</ul>
+</div>
+
+<div class="note">
+<p><strong>Ver también:</strong> Una <a href="https://www.w3.org/TR/selectors/#selectors">lista completa de selectores</a> en la especificación de Nivel 3 de Selectores.</p>
+</div>
+
+<h2 id="Conceptos">Conceptos</h2>
+
+<h3 id="Sintaxis_y_semántica">Sintaxis y semántica</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/Syntax">Sintaxis CSS</a></li>
+ <li><a href="/es/docs/Web/CSS/At-rule">Reglas-at</a></li>
+ <li><a href="/es/docs/Web/CSS/Cascade">Cascada</a></li>
+ <li><a href="/es/docs/Web/CSS/Comments">Comentarios</a></li>
+ <li><a href="/es/docs/Glossary/Descriptor_(CSS)">Descriptor</a></li>
+ <li><a href="/es/docs/Web/CSS/inheritance">Herencia</a></li>
+ <li><a href="/es/docs/Web/CSS/Shorthand_properties">Propiedades abreviadas</a></li>
+ <li><a href="/es/docs/Web/CSS/Specificity">Especificidad</a></li>
+ <li><a href="/es/docs/Web/CSS/Value_definition_syntax">Sintaxis de definición de valor</a></li>
+</ul>
+
+<h3 id="Valores">Valores</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS/actual_value">Valor actual</a></li>
+ <li><a href="/es/docs/Web/CSS/computed_value">Valor calculado</a></li>
+ <li><a href="/es/docs/Web/CSS/initial_value">Valor inicial</a></li>
+ <li><a href="/es/docs/Web/CSS/resolved_value">Valor resuelto</a></li>
+ <li><a href="/es/docs/Web/CSS/specified_value">Valor específico</a></li>
+ <li><a href="/es/docs/Web/CSS/used_value">Valor utilizado</a></li>
+</ul>
+
+<h3 id="Diseño">Diseño</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/Guide/CSS/Block_formatting_context">Contexto de formato de bloque</a></li>
+ <li><a href="/es/docs/Web/CSS/box_model">Modelo de caja</a></li>
+ <li><a href="/es/docs/Web/CSS/All_About_The_Containing_Block">Containing block</a></li>
+ <li><a href="/es/docs/Web/CSS/Layout_mode">Modo de diseño</a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing">Margen colapsando</a></li>
+ <li><a href="/es/docs/Web/CSS/Replaced_element">Elementos reemplazados</a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context">Contexto de apilamiento</a></li>
+ <li><a href="/es/docs/Web/Guide/CSS/Visual_formatting_model">Modelo de formato visual</a></li>
+</ul>
+
+<h2 id="DOM-CSS_CSSOM">DOM-CSS / CSSOM</h2>
+
+<h3 id="Tipos_de_objetos_principales">Tipos de objetos principales</h3>
+
+<ul>
+ <li>document.<a href="/es/docs/Web/API/Document/styleSheets">styleSheets</a></li>
+ <li>styleSheets[i].<a href="/es/docs/Web/API/CSSRuleList">cssRules</a></li>
+ <li>cssRules[i].<a href="/es/docs/Web/API/CSSRule/cssText">cssText</a> (selector y estilo)</li>
+ <li>cssRules[i].<a href="/es/docs/Web/API/CSSStyleRule/selectorText">selectorText</a></li>
+ <li>elem.<a href="/es/docs/Web/API/HTMLElement/style">style</a></li>
+ <li>elem.style.<a href="/es/docs/Web/API/CSSStyleDeclaration/cssText">cssText</a> (solo estilo)</li>
+ <li>elem.<a href="/es/docs/Web/API/Element/className">className</a></li>
+ <li>elem.<a href="/es/docs/Web/API/Element/classList">classList</a></li>
+</ul>
+
+<h3 id="Métodos_importantes">Métodos importantes</h3>
+
+<ul>
+ <li>{{domxref("CSSStyleSheet.insertRule")}}</li>
+ <li>{{domxref("CSSStyleSheet.deleteRule")}}</li>
+</ul>
+
+<h2 id="Tutoriales_CSS3">Tutoriales CSS3</h2>
+
+<p>Estas páginas describen las nuevas tecnologías que aparecieron en CSS3, o las de CSS2.1 que no tienen mucho soporte:</p>
+
+<ul>
+ <li><a href="/es/docs/CSS/Media_queries">Uso de media queries con CSS</a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters">Uso de contadores con CSS</a></li>
+ <li><a href="/es/docs/CSS/Using_CSS_gradients">Uso de gradientes con CSS</a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Transforms/Using_CSS_transforms">Uso de transformaciones con CSS</a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS">Uso de animaciones con CSS</a></li>
+ <li><a href="/es/docs/Web/CSS/Transiciones_de_CSS">Uso de transiciones con CSS</a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds">Uso de múltiples fondos con CSS</a></li>
+ <li><a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">Uso de las cajas flexibles con CSS</a></li>
+ <li><a href="/es/docs/Columnas_con_CSS-3">Uso de columnas con CSS</a></li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/CSS/Mozilla_Extensions">Extensiones CSS de Mozilla</a> (con el prefijo <code>-moz</code>)</li>
+ <li><a href="/en-US/docs/Web/CSS/Webkit_Extensions">Extensiones CSS de WebKit</a> (principalmente con el prefijo <code>-webkit</code>)</li>
+ <li><a href="/en-US/docs/Web/CSS/Microsoft_CSS_extensions">Extensiones CSS de Microsoft</a> (con el prefijo <code>-ms</code>)</li>
+</ul>
diff --git a/files/es/web/css/referencia_css/index.html b/files/es/web/css/referencia_css/index.html
deleted file mode 100644
index 63c52a6cdb..0000000000
--- a/files/es/web/css/referencia_css/index.html
+++ /dev/null
@@ -1,246 +0,0 @@
----
-title: Referencia CSS
-slug: Web/CSS/Referencia_CSS
-tags:
-  - CSS
-  - Referencia CSS
-  - para_revisar
-translation_of: Web/CSS/Reference
----
-<div class="note">
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Estamos trabajando sobre este documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si deseas ayudarnos a redactar o mejorar alguna de las páginas listadas a continuación, te animamos a que lo hagas.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si vas a agregar o modificar una página, por favor, ajústate a la plantilla <a href="/en/CSS/CSS_Reference/Property_Template" title="en/CSS Reference/Property Template">Referencia CSS:Plantilla de propiedades </a> y modifica según sea necesario.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">La plantilla básica para las páginas de ejemplo se puede encontrar aquí: </span></span> <a class="internal" href="/samples/cssref/TEMPLATE.html" title="https://developer.mozilla.org/samples/cssref/TEMPLATE.html ">samples/cssref/TEMPLATE.html</a>.</p>
-<span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Siéntete libre para discutir sobre cualquier pregunta o sugerencia en la página <a href="/Talk:en/CSS_Reference" title="Talk:en/CSS Reference">Talk:CSS Reference</a>.</span></span></div>
-
-<p><span class="seoSummary">Esta <em>Referencia CSS</em> muestra la sintáxis básica de una regla CSS; lista todas las propiedades estándares <a href="/es/docs/Web/CSS">CSS</a>, <a href="/es/docs/Web/CSS/Pseudo-classes">pseudo-classes</a> y <a href="/es/docs/Web/CSS/Pseudoelementos">pseudo-elementos</a>, <a href="/es/docs/Web/CSS/At-rule">reglas-at</a>, <a href="/es/docs/Web/CSS/length">unidades</a>, y <a href="/es/docs/Web/CSS/Introducci%C3%B3n/Selectors">selectores</a>, todos juntos en <a href="#Keyword_index">orden alfabético</a>, así como los <a href="#Selectors">selectores por tipo</a>; y le permitirá acceso rápido a la información detallada de cada uno de ellos. No solo lista las propiedades de CSS 1 y CSS 2.1, sino que también es una referencia de CSS3 que enlaza cualquier propiedad y concepto de <a href="/es/docs/Web/CSS/CSS3">CSS3</a> estandarizado, o ya establecido. También incluye una breve <a href="#DOM_CSS">referencia DOM-CSS / CSSOM</a>.</span></p>
-
-<p>Tenga en cuenta que las definiciones de reglas CSS son completamente <a href="https://www.w3.org/TR/css-syntax-3/#intro">basadas en texto</a> (ASCII), mientras que DOM-CSS / CSSOM, el sistema de gestión de reglas, está <a href="https://www.w3.org/TR/cssom/#introduction">basado en objetos</a>.</p>
-
-<p>Vea también las <a href="/es/docs/Web/CSS/Referencia_CSS/Extensiones_CSS_Mozilla">Extensiones CSS de Mozilla</a> para propiedades específicas de Gecko, que usan el prefijo <code>-moz</code>; y las <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Reference/Webkit_Extensions">Extensiones CSS de WebKit</a> para propiedades específicas de WebKit. Vea <a href="http://peter.sh/experiments/vendor-prefixed-css-property-overview/">Vendor-prefixed CSS Property Overview</a> de Peter Beverloo como referencia a todas las propiedades con prefijo.</p>
-
-<h2 id="Sintaxis_de_regla_básica">Sintaxis de regla básica</h2>
-
-<p>Se advierte que cualquier error de sintaxis en una definición de regla invalidará la regla por completo.</p>
-
-<h3 id="Sintaxis_de_regla_de_estilo">Sintaxis de regla de estilo</h3>
-
-<pre class="syntaxbox"><strong><var>selectorlist</var> {
-   <var>property</var>: <var>value</var>; </strong>
-   <var>[more property:value; pairs] </var>
-<strong>}</strong>
-
-...where <var>selectorlist</var> is: <var>selector[:pseudo-class] [::pseudo-element] [, more selectorlists]</var>
-
-Ver <a href="#Selectors"><em>selector</em></a>, <em><a href="#pelm">pseudo-elemento</a></em>, <a href="#pcls"><em>pseudo-clase</em></a> más abajo.
-
-</pre>
-
-<h4 id="Ejemplos_de_reglas_de_estilo">Ejemplos de reglas de estilo</h4>
-
-<pre class="brush: css">strong {
-  color: red;
-}
-
-div.menu-bar li:hover &gt; ul {
-  display: block;
-}
-</pre>
-
-<p>Para una introducción de nivel principiante a la sintaxis de los selectores de CSS, consulte <a href="/es/docs/Learn/CSS/Introduction_to_CSS/Selectors">este tutorial</a>. Tenga en cuenta que cualquier error de <a href="/es/docs/Web/CSS/syntax">sintaxis CSS</a> en una definición de regla hace que la regla completa se invalide. El navegador ignora las reglas no válidas. Tenga en cuenta que las definiciones de reglas CSS son totalmente (ASCII) <a href="https://www.w3.org/TR/css-syntax-3/#intro">basadas en texto</a>, mientras que DOM-CSS / CSSOM (el sistema de gestión de reglas) está <a href="https://www.w3.org/TR/cssom/#introduction">basado en objetos</a>.</p>
-
-<h3 id="Sintaxis_de_las_reglas-at_(rules)">Sintaxis de las reglas-at (@rules)</h3>
-
-<p>Debido a que éstas tienen formatos de estructura variados, revise la sección <a href="/es/docs/Web/CSS/At-rule">reglas-At</a> para ver la sintaxis de la regla deseada.</p>
-
-<h2 id="Índice_de_palabras_clave">Índice de palabras clave</h2>
-
-<div class="note">
-<p><strong>Nota:</strong> Los nombres de propiedad en este índice <strong>no</strong> incluyen los <a href="/es/docs/Web/CSS/CSS_Properties_Reference">nombres de JavaScript</a> donde difieren de los nombres estándar de CSS.</p>
-</div>
-
-<div>{{CSS_Ref}}</div>
-
-<h2 id="Selectores">Selectores</h2>
-
-<h3 id="Selectores_básicos"><a href="/es/docs/Web/CSS/CSS_Selectors#Basic_selectors">Selectores básicos</a></h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/Type_selectors">Selectores de tipo</a> <code>elementname</code></li>
- <li><a href="/es/docs/Web/CSS/Class_selectors">Selectores de clase</a> <code>.classname</code></li>
- <li><a href="/es/docs/Web/CSS/ID_selectors">Selectores de ID</a> <code>#idname</code></li>
- <li><a href="/es/docs/Web/CSS/Universal_selectors">Selectores universales</a> <code>*</code>, <code>ns|*</code>, <code>*|*</code>, <code>|*</code></li>
- <li><a href="/es/docs/Web/CSS/Selectores_atributo">Selectores de atributo</a> <code>[attr=value]</code></li>
-</ul>
-
-<h3 id="Combinadores"><a href="/es/docs/Web/CSS/CSS_Selectors#Combinators">Combinadores</a></h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/Selectores_hermanos_adyacentes">Selectores de hermanos adyacentes</a> <code>A + B</code></li>
- <li><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Selectores de hermanos generales</a> <code>A ~ B</code></li>
- <li><a href="/es/docs/Web/CSS/Child_selectors">Selectores de hijo</a> <code>A &gt; B</code></li>
- <li><a href="/es/docs/Web/CSS/Descendant_selectors">Selectores de descendiente</a> <code>A B</code></li>
-</ul>
-
-<h3 id="Pseudo-clases"><a href="/es/docs/Web/CSS/Pseudo-classes">Pseudo-clases</a></h3>
-
-<div class="index">
-<ul>
- <li id="pcls">{{ Cssxref(":active") }}</li>
- <li>{{ Cssxref(':any')}}</li>
- <li>{{ Cssxref(':any-link')}}</li>
- <li>{{ Cssxref(":checked") }}</li>
- <li>{{ Cssxref(":default") }}</li>
- <li>{{ Cssxref(":defined") }}</li>
- <li>{{ Cssxref(":dir", ":dir()")}}</li>
- <li>{{ Cssxref(":disabled") }}</li>
- <li>{{ Cssxref(":empty") }}</li>
- <li>{{ Cssxref(":enabled") }}</li>
- <li>{{ Cssxref(":first") }}</li>
- <li>{{ Cssxref(":first-child") }}</li>
- <li>{{ Cssxref(":first-of-type") }}</li>
- <li>{{ Cssxref(":fullscreen") }}</li>
- <li>{{ Cssxref(":focus") }}</li>
- <li>{{ Cssxref(":focus-visible") }}</li>
- <li>{{ Cssxref(":host") }}</li>
- <li>{{ Cssxref(":host()") }}</li>
- <li>{{ Cssxref(":host-context()") }}</li>
- <li>{{ Cssxref(":hover") }}</li>
- <li>{{ Cssxref(":indeterminate") }}</li>
- <li>{{ Cssxref(":in-range") }}</li>
- <li>{{ Cssxref(":invalid") }}</li>
- <li>{{ Cssxref(":lang", ":lang()") }}</li>
- <li>{{ Cssxref(":last-child") }}</li>
- <li>{{ Cssxref(":last-of-type") }}</li>
- <li>{{ Cssxref(":left") }}</li>
- <li>{{ Cssxref(":link") }}</li>
- <li>{{ Cssxref(":not", ":not()") }}</li>
- <li>{{ Cssxref(":nth-child", ":nth-child()") }}</li>
- <li>{{ Cssxref(":nth-last-child", ":nth-last-child()") }}</li>
- <li>{{ Cssxref(":nth-last-of-type", ":nth-last-of-type()") }}</li>
- <li>{{ Cssxref(":nth-of-type", ":nth-of-type()") }}</li>
- <li>{{ Cssxref(":only-child") }}</li>
- <li>{{ Cssxref(":only-of-type") }}</li>
- <li>{{ Cssxref(":optional") }}</li>
- <li>{{ Cssxref(":out-of-range") }}</li>
- <li>{{ Cssxref(":read-only") }}</li>
- <li>{{ Cssxref(":read-write") }}</li>
- <li>{{ Cssxref(":required") }}</li>
- <li>{{ Cssxref(":right") }}</li>
- <li>{{ Cssxref(":root") }}</li>
- <li>{{ Cssxref(":scope") }}</li>
- <li>{{ Cssxref(":target") }}</li>
- <li>{{ Cssxref(":valid") }}</li>
- <li>{{ Cssxref(":visited") }}</li>
-</ul>
-</div>
-
-<h3 id="Pseudo-elementos"><a href="/en-US/docs/Web/CSS/Pseudo-elements">Pseudo-elementos</a></h3>
-
-<div class="index">
-<ul>
- <li id="pelm">{{ Cssxref("::after") }}</li>
- <li>{{ Cssxref("::backdrop") }}</li>
- <li>{{ Cssxref("::before") }}</li>
- <li>{{ Cssxref("::cue") }}</li>
- <li>{{ Cssxref("::first-letter") }}</li>
- <li>{{ Cssxref("::first-line") }}</li>
- <li>{{ Cssxref("::grammar-error") }} {{experimental_inline}}</li>
- <li>{{ Cssxref("::marker") }} {{experimental_inline}}</li>
- <li>{{ Cssxref("::placeholder") }} {{experimental_inline}}</li>
- <li>{{ Cssxref("::selection") }}</li>
- <li>{{ Cssxref("::spelling-error") }} {{experimental_inline}}</li>
-</ul>
-</div>
-
-<div class="note">
-<p><strong>Ver también:</strong> Una <a href="https://www.w3.org/TR/selectors/#selectors">lista completa de selectores</a> en la especificación de Nivel 3 de Selectores.</p>
-</div>
-
-<h2 id="Conceptos">Conceptos</h2>
-
-<h3 id="Sintaxis_y_semántica">Sintaxis y semántica</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/Syntax">Sintaxis CSS</a></li>
- <li><a href="/es/docs/Web/CSS/At-rule">Reglas-at</a></li>
- <li><a href="/es/docs/Web/CSS/Cascade">Cascada</a></li>
- <li><a href="/es/docs/Web/CSS/Comments">Comentarios</a></li>
- <li><a href="/es/docs/Glossary/Descriptor_(CSS)">Descriptor</a></li>
- <li><a href="/es/docs/Web/CSS/inheritance">Herencia</a></li>
- <li><a href="/es/docs/Web/CSS/Shorthand_properties">Propiedades abreviadas</a></li>
- <li><a href="/es/docs/Web/CSS/Specificity">Especificidad</a></li>
- <li><a href="/es/docs/Web/CSS/Value_definition_syntax">Sintaxis de definición de valor</a></li>
-</ul>
-
-<h3 id="Valores">Valores</h3>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/actual_value">Valor actual</a></li>
- <li><a href="/es/docs/Web/CSS/computed_value">Valor calculado</a></li>
- <li><a href="/es/docs/Web/CSS/initial_value">Valor inicial</a></li>
- <li><a href="/es/docs/Web/CSS/resolved_value">Valor resuelto</a></li>
- <li><a href="/es/docs/Web/CSS/specified_value">Valor específico</a></li>
- <li><a href="/es/docs/Web/CSS/used_value">Valor utilizado</a></li>
-</ul>
-
-<h3 id="Diseño">Diseño</h3>
-
-<ul>
- <li><a href="/es/docs/Web/Guide/CSS/Block_formatting_context">Contexto de formato de bloque</a></li>
- <li><a href="/es/docs/Web/CSS/box_model">Modelo de caja</a></li>
- <li><a href="/es/docs/Web/CSS/All_About_The_Containing_Block">Containing block</a></li>
- <li><a href="/es/docs/Web/CSS/Layout_mode">Modo de diseño</a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing">Margen colapsando</a></li>
- <li><a href="/es/docs/Web/CSS/Replaced_element">Elementos reemplazados</a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context">Contexto de apilamiento</a></li>
- <li><a href="/es/docs/Web/Guide/CSS/Visual_formatting_model">Modelo de formato visual</a></li>
-</ul>
-
-<h2 id="DOM-CSS_CSSOM">DOM-CSS / CSSOM</h2>
-
-<h3 id="Tipos_de_objetos_principales">Tipos de objetos principales</h3>
-
-<ul>
- <li>document.<a href="/es/docs/Web/API/Document/styleSheets">styleSheets</a></li>
- <li>styleSheets[i].<a href="/es/docs/Web/API/CSSRuleList">cssRules</a></li>
- <li>cssRules[i].<a href="/es/docs/Web/API/CSSRule/cssText">cssText</a> (selector y estilo)</li>
- <li>cssRules[i].<a href="/es/docs/Web/API/CSSStyleRule/selectorText">selectorText</a></li>
- <li>elem.<a href="/es/docs/Web/API/HTMLElement/style">style</a></li>
- <li>elem.style.<a href="/es/docs/Web/API/CSSStyleDeclaration/cssText">cssText</a> (solo estilo)</li>
- <li>elem.<a href="/es/docs/Web/API/Element/className">className</a></li>
- <li>elem.<a href="/es/docs/Web/API/Element/classList">classList</a></li>
-</ul>
-
-<h3 id="Métodos_importantes">Métodos importantes</h3>
-
-<ul>
- <li>{{domxref("CSSStyleSheet.insertRule")}}</li>
- <li>{{domxref("CSSStyleSheet.deleteRule")}}</li>
-</ul>
-
-<h2 id="Tutoriales_CSS3">Tutoriales CSS3</h2>
-
-<p>Estas páginas describen las nuevas tecnologías que aparecieron en CSS3, o las de CSS2.1 que no tienen mucho soporte:</p>
-
-<ul>
- <li><a href="/es/docs/CSS/Media_queries">Uso de media queries con CSS</a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters">Uso de contadores con CSS</a></li>
- <li><a href="/es/docs/CSS/Using_CSS_gradients">Uso de gradientes con CSS</a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Transforms/Using_CSS_transforms">Uso de transformaciones con CSS</a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS">Uso de animaciones con CSS</a></li>
- <li><a href="/es/docs/Web/CSS/Transiciones_de_CSS">Uso de transiciones con CSS</a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Background_and_Borders/Using_CSS_multiple_backgrounds">Uso de múltiples fondos con CSS</a></li>
- <li><a href="/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS">Uso de las cajas flexibles con CSS</a></li>
- <li><a href="/es/docs/Columnas_con_CSS-3">Uso de columnas con CSS</a></li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/CSS/Mozilla_Extensions">Extensiones CSS de Mozilla</a> (con el prefijo <code>-moz</code>)</li>
- <li><a href="/en-US/docs/Web/CSS/Webkit_Extensions">Extensiones CSS de WebKit</a> (principalmente con el prefijo <code>-webkit</code>)</li>
- <li><a href="/en-US/docs/Web/CSS/Microsoft_CSS_extensions">Extensiones CSS de Microsoft</a> (con el prefijo <code>-ms</code>)</li>
-</ul>
diff --git a/files/es/web/css/referencia_css/mix-blend-mode/index.html b/files/es/web/css/referencia_css/mix-blend-mode/index.html
deleted file mode 100644
index fc213a4ceb..0000000000
--- a/files/es/web/css/referencia_css/mix-blend-mode/index.html
+++ /dev/null
@@ -1,611 +0,0 @@
----
-title: mix-blend-mode
-slug: Web/CSS/Referencia_CSS/mix-blend-mode
-tags:
-  - CSS
-translation_of: Web/CSS/mix-blend-mode
----
-<div>{{CSSRef}}</div>
-
-<p>La propiedad <a href="/es/docs/Web/CSS">CSS</a> <strong><code>mix-blend-mode</code></strong> describe cómo el contenido de un elemento debe mezclarse con el contenido del elemento que está tras él y con el fondo del elemento.</p>
-
-<div>{{EmbedInteractiveExample("pages/css/mix-blend-mode.html")}}</div>
-
-
-
-<h2 id="Syntax" name="Syntax">Syntax</h2>
-
-<pre class="brush:css no-line-numbers">/* Valores clave */
-mix-blend-mode: normal;
-mix-blend-mode: multiply;
-mix-blend-mode: screen;
-mix-blend-mode: overlay;
-mix-blend-mode: darken;
-mix-blend-mode: lighten;
-mix-blend-mode: color-dodge;
-mix-blend-mode: color-burn;
-mix-blend-mode: hard-light;
-mix-blend-mode: soft-light;
-mix-blend-mode: difference;
-mix-blend-mode: exclusion;
-mix-blend-mode: hue;
-mix-blend-mode: saturation;
-mix-blend-mode: color;
-mix-blend-mode: luminosity;
-
-/* Valores globales */
-mix-blend-mode: initial;
-mix-blend-mode: inherit;
-mix-blend-mode: unset;
-</pre>
-
-<h3 id="Values" name="Values">Valores</h3>
-
-<dl>
- <dt>{{cssxref("&lt;blend-mode&gt;")}}</dt>
- <dd>El modo de mezcla que debería ser aplicado.</dd>
-</dl>
-
-<h3 id="Sintaxis_formal">Sintaxis formal</h3>
-
-<pre class="syntaxbox">{{csssyntax}}</pre>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<div class="hidden" id="mix-blend-mode">
-<pre class="brush: html">&lt;div class="grid"&gt;
-  &lt;div class="col"&gt;
-    &lt;div class="note"&gt;Mezclado aislado (sin mezclar con el fondo)&lt;/div&gt;
-    &lt;div class="row isolate"&gt;
-      &lt;div class="cell"&gt; normal
-        &lt;div class="container normal"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;defs&gt;
-                &lt;linearGradient id="red"&gt;
-                  &lt;stop offset="0"    stop-color="hsl(0,100%,50%)" /&gt;
-                  &lt;stop offset="100%" stop-color="hsl(0,0%,100%)" /&gt;
-                &lt;/linearGradient&gt;
-                &lt;linearGradient id="green"&gt;
-                  &lt;stop offset="0"    stop-color="hsl(120,100%,50%)" /&gt;
-                  &lt;stop offset="100%" stop-color="hsl(120,0%,100%)" /&gt;
-                &lt;/linearGradient&gt;
-                &lt;linearGradient id="blue"&gt;
-                  &lt;stop offset="0"    stop-color="hsl(240,100%,50%)" /&gt;
-                  &lt;stop offset="100%" stop-color="hsl(240,0%,100%)" /&gt;
-                &lt;/linearGradient&gt;
-              &lt;/defs&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; multiply
-        &lt;div class="container multiply"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; darken
-        &lt;div class="container darken"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; screen
-        &lt;div class="container screen"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; lighten
-        &lt;div class="container lighten"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; overlay
-        &lt;div class="container overlay"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; color-dodge
-        &lt;div class="container color-dodge"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; color-burn
-        &lt;div class="container color-burn"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; hard-light
-        &lt;div class="container hard-light"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; soft-light
-        &lt;div class="container soft-light"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; difference
-        &lt;div class="container difference"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; exclusion
-        &lt;div class="container exclusion"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; hue
-        &lt;div class="container hue"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; saturation
-        &lt;div class="container saturation"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; color
-        &lt;div class="container color"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; luminosity
-        &lt;div class="container luminosity"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-    &lt;/div&gt;
-
-    &lt;div class="note"&gt;Mezclado global (mezclar con el fondo)&lt;/div&gt;
-    &lt;div class="row"&gt;
-      &lt;div class="cell"&gt; normal
-        &lt;div class="container normal"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; multiply
-        &lt;div class="container multiply"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; darken
-        &lt;div class="container darken"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; screen
-        &lt;div class="container screen"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; lighten
-        &lt;div class="container lighten"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; overlay
-        &lt;div class="container overlay"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; color-dodge
-        &lt;div class="container color-dodge"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; color-burn
-        &lt;div class="container color-burn"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; hard-light
-        &lt;div class="container hard-light"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; soft-light
-        &lt;div class="container soft-light"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; difference
-        &lt;div class="container difference"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; exclusion
-        &lt;div class="container exclusion"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; hue
-        &lt;div class="container hue"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; saturation
-        &lt;div class="container saturation"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; color
-        &lt;div class="container color"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-      &lt;div class="cell"&gt; luminosity
-        &lt;div class="container luminosity"&gt;
-          &lt;div class="group"&gt;
-            &lt;div class="item firefox"&gt;&lt;/div&gt;
-            &lt;svg viewBox="0 0 150 150"&gt;
-              &lt;ellipse class="item R" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item G" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-              &lt;ellipse class="item B" cx="75" cy="75" rx="25" ry="70"&gt;&lt;/ellipse&gt;
-            &lt;/svg&gt;
-          &lt;/div&gt;
-        &lt;/div&gt;
-      &lt;/div&gt;
-    &lt;/div&gt;
-  &lt;/div&gt;
-&lt;/div&gt;</pre>
-
-<pre class="brush: css">html,body {
-  height: 100%;
-  box-sizing: border-box;
-  background: #EEE;
-}
-
-.grid {
-  width: 100%;
-  display: flex;
-  font: 1em monospace;
-}
-
-.row {
-  display: flex;
-  flex: 1 auto;
-  flex-direction: row;
-  flex-wrap: wrap;
-  height: auto;
-}
-
-.col {
-  display: flex;
-  flex: 1 auto;
-  flex-direction: column;
-  height: auto;
-}
-
-.cell {
-  margin: .5em;
-  padding: .5em;
-  background-color: #FFF;
-  overflow: hidden;
-  text-align: center;
-}
-
-.note {
-  background: #fff3d4;
-  padding: 1em;
-  margin: .5em .5em 0;
-  font: .8em sans-serif;
-  text-align: left;
-  white-space: nowrap;
-}
-
-.note + .row .cell {
-  margin-top: 0;
-}
-
-.container {
-  position: relative;
-  background: linear-gradient(to right, #000 0%, transparent 50%, #FFF 100%),
-              linear-gradient(to bottom, #FF0 0%, #F0F 50%, #0FF 100%);
-  width: 150px;
-  height: 150px;
-  margin: 0 auto;
-}
-
-.R {
-  transform-origin: center;
-  transform: rotate(-30deg);
-  fill: url(#red);
-}
-
-.G {
-  transform-origin: center;
-  transform: rotate(90deg);
-  fill: url(#green);
-}
-
-.B {
-  transform-origin: center;
-  transform: rotate(210deg);
-  fill: url(#blue);
-}
-
-.isolate .group { isolation: isolate; }
-
-.normal .item      { mix-blend-mode: normal; }
-.multiply .item    { mix-blend-mode: multiply; }
-.screen .item      { mix-blend-mode: screen; }
-.overlay .item     { mix-blend-mode: overlay; }
-.darken .item      { mix-blend-mode: darken; }
-.lighten .item     { mix-blend-mode: lighten; }
-.color-dodge .item { mix-blend-mode: color-dodge; }
-.color-burn .item  { mix-blend-mode: color-burn; }
-.hard-light .item  { mix-blend-mode: hard-light; }
-.soft-light .item  { mix-blend-mode: soft-light; }
-.difference .item  { mix-blend-mode: difference; }
-.exclusion .item   { mix-blend-mode: exclusion; }
-.hue .item         { mix-blend-mode: hue; }
-.saturation .item  { mix-blend-mode: saturation; }
-.color .item       { mix-blend-mode: color; }
-.luminosity .item  { mix-blend-mode: luminosity; }</pre>
-</div>
-
-<div>{{EmbedLiveSample("mix-blend-mode", "100%", 1600, "", "", "example-outcome-frame")}}</div>
-
-<h3 id="Ejemplo_vivo">Ejemplo vivo</h3>
-
-<pre class="brush: html">&lt;svg&gt;
-  &lt;g class="isolate"&gt;
-    &lt;circle cx="40" cy="40" r="40" fill="red"/&gt;
-    &lt;circle cx="80" cy="40" r="40" fill="lightgreen"/&gt;
-    &lt;circle cx="60" cy="80" r="40" fill="blue"/&gt;
-  &lt;/g&gt;
-&lt;/svg&gt;</pre>
-
-<pre class="brush:css">circle { mix-blend-mode: screen; }
-.isolate { isolation: isolate; } /* sin aislación, el color de fondo será tenido en cuenta */
-</pre>
-
-<p>{{EmbedLiveSample("Ejemplo_vivo", "100%", "180")}}</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('Compositing', '#mix-blend-mode', 'mix-blend-mode') }}</td>
-   <td>{{ Spec2('Compositing') }}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<p>{{cssinfo}}</p>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("css.properties.mix-blend-mode")}}</p>
-
-<h2 id="See_also" name="See_also">Véase también</h2>
-
-<ul>
- <li>{{cssxref("&lt;blend-mode&gt;")}}</li>
- <li>{{cssxref("background-blend-mode")}}</li>
-</ul>
diff --git a/files/es/web/css/replaced_element/index.html b/files/es/web/css/replaced_element/index.html
new file mode 100644
index 0000000000..73128acaa2
--- /dev/null
+++ b/files/es/web/css/replaced_element/index.html
@@ -0,0 +1,20 @@
+---
+title: Elemento de reemplazo
+slug: Web/CSS/Replaced_element
+tags:
+  - CSS
+  - CSS Referência
+  - Intermediate
+translation_of: Web/CSS/Replaced_element
+original_slug: Web/CSS/Elemento_reemplazo
+---
+<div>
+ {{CSSRef()}}</div>
+<h2 id="Summary">Summary</h2>
+<p>Dentro de CSS tenemos los <strong>elementos de reemplazo</strong>, cuya representacion esta fuera del ambito de propio CSS. Son un tipo de objeto externo, por tanto su representacion es independiente de CSS. Algunos objetos que normalmente funcionan como objetos de reemplazo son {{HTMLElement("img")}}, {{HTMLElement("object")}}, {{HTMLElement("video")}} o elementos de formulario como {{HTMLElement("textarea")}}, {{HTMLElement("input")}}. Algunos elementos como {{HTMLElement("audio")}} or {{HTMLElement("canvas")}} ejercen como elementos de reemplazo solo en casos especificos. Los objetos insertados a traves de las propiedades CSS  {{cssxref("content")}} son <em>objetos de reemplazo anonimos.</em>.</p>
+<p>CSS gestiona elementos de reemplazo en casos concretos, por ejemplo al calcular los margenes y algunos <code>auto</code> valores.</p>
+<p>Recuerda que algunos elementos de reemplazo, no todos, tienen dimensiones intrinsecas o linea de base establecida, las cuales son utilizadas por propiedades de CSS como {{cssxref("vertical-align")}}.</p>
+<h2 id="Ver_tambien">Ver tambien:</h2>
+<ul>
+ <li>{{CSS_key_concepts()}}</li>
+</ul>
diff --git a/files/es/web/css/resolución/index.html b/files/es/web/css/resolución/index.html
deleted file mode 100644
index b480413bb1..0000000000
--- a/files/es/web/css/resolución/index.html
+++ /dev/null
@@ -1,151 +0,0 @@
----
-title: <resolution>
-slug: Web/CSS/resolución
-tags:
-  - CSS
-  - CSS tipo de datos
-  - Diseño
-  - Estilos
-  - Referencia
-translation_of: Web/CSS/resolution
----
-<div>{{CSSRef}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El tipo de dato <a href="/en-US/docs/Web/CSS">CSS</a> <code>&lt;resolution&gt;</code>, usado en <a href="/en-US/docs/Web/Guide/CSS/Media_queries">media queries</a>,  define la densidad de píxeles de un dispositivo de salida, su resolución. Es un {{cssxref("&lt;number&gt;")}} inmediatamente seguido por una unidad de resolución (<code>dpi</code>, <code>dpcm</code>, ...). Como para cualquier dimensión CSS, no hay espacio entre la unidad literal y el número.</p>
-
-<p>En pantallas, la longitud está relacionada a centímetros, pulgadas o píxeles CSS, no en valores físicos.</p>
-
-<p>Incluso si todas las unidades representan la misma resolución para el valor 0, la unidad no se puede omitir en este caso, ya que no es un {{cssxref("&lt;length&gt;")}}: <code>0</code> es inválida y no representa <code>0dpi</code>, <code>0dpcm</code>, ni <code>0dppx</code>.</p>
-
-<h2 id="Units" name="Units">Unidades</h2>
-
-<dl>
- <dt><code><a name="dpi">dpi</a></code></dt>
- <dd>Esta unidad representa el número de <a href="http://en.wikipedia.org/wiki/Dots_per_inch">dots per inch</a> (ppp en español), puntos por pulgada . A screen typically contains 72 or 96 dpi; a printed document usually reach much greater dpi. As 1 inch is 2.54 cm, <code>1dpi ≈ 0.39dpcm</code>.</dd>
- <dt><code><a name="dpcm">dpcm</a></code></dt>
- <dd>Esta unidad representa el número de  <a href="http://en.wikipedia.org/wiki/Dots_per_centimetre">dots per centimeter</a> (ppc en español), puntos por cm. 1 inch(pulgada) son 2.54 cm, <code>1dpcm ≈ 2.54dpi</code>.</dd>
- <dt><code><a name="dppx">dppx</a></code></dt>
- <dd>Esta unidad representa el número de puntos por unidad px. Debido a la relación fija de 1:96 CSS para CSS px, 1 px es equivalente a 96 dpi, que corresponde a la resolución predeterminada de las imágenes mostradas en CSS como se define por {{cssxref("image-resolution")}}.</dd>
-</dl>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<p>Éstos son algunos de los usos correctos de valores <code>&lt;resolution&gt;</code>:</p>
-
-<pre>96dpi                                              Uso correcto: a {{cssxref("&lt;number&gt;")}} (here an {{cssxref("&lt;integer&gt;")}}) followed by the unit.
-@media print and (min-resolution: 300dpi) { ... }  El uso correcto en el contexto de una <a href="/en-US/docs/Web/Guide/CSS/Media_queries">media query</a>.
-</pre>
-
-<p>Here are some incorrect uses:</p>
-
-<pre>72 dpi                                             Incorecto: no hay espacios entre {{ cssxref("&lt;number&gt;") }} y la unidad.
-ten dpi                                            Incorecto: sólo deben ser utilizados dígitos.
-0                                                  Incorecto: la unidad se puede omitir por 0 sólo para valores {{ cssxref("&lt;length&gt;") }}.
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificación</h2>
-
-<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 Values', '#resolution', '&lt;resolution&gt;')}}</td>
-   <td>{{Spec2('CSS3 Values')}}</td>
-   <td>Factorización del tipo en una especificación más genérica. Ningún cambio</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Images', '#resolution-units', '&lt;resolution&gt;')}}</td>
-   <td>{{Spec2('CSS3 Images')}}</td>
-   <td>Añadida la unidad <code>dppx</code></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Media Queries', '#resolution', '&lt;resolution&gt;')}}</td>
-   <td>{{Spec2('CSS3 Media Queries')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>29</td>
-   <td>3.5 (1.9.1)<sup>[1]</sup></td>
-   <td>9</td>
-   <td>9.5</td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-  </tr>
-  <tr>
-   <td><code>dppx</code></td>
-   <td>29</td>
-   <td>{{CompatGeckoDesktop("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>12.10</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-  </tr>
-  <tr>
-   <td><code>dppx</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>12.10</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Antes de Firefox 8 (Gecko 8.0), era erroneamente aceptado sólo dimensiones CSS que fueran {{cssxref("&lt;integer&gt;")}} seguidos por la unidad. A partir de esa versión, es compatible con cualquier dimensión ({{cssxref("&lt;number&gt;")}} CSS válido seguido inmediatamente por la unidad).</p>
-
-<p>[2] El Webkit engine no soporta resolución CSS  en la especificación, es necesario el uso del no estandar <code>device-pixel-ratio</code> query para el navegador Safari, ver <a href="https://bugs.webkit.org/show_bug.cgi?id=16832">bug 16832</a>.</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/Guide/CSS/Media_queries">CSS Media Queries</a></li>
-</ul>
diff --git a/files/es/web/css/resolution/index.html b/files/es/web/css/resolution/index.html
new file mode 100644
index 0000000000..59dab5ddee
--- /dev/null
+++ b/files/es/web/css/resolution/index.html
@@ -0,0 +1,152 @@
+---
+title: <resolution>
+slug: Web/CSS/resolution
+tags:
+  - CSS
+  - CSS tipo de datos
+  - Diseño
+  - Estilos
+  - Referencia
+translation_of: Web/CSS/resolution
+original_slug: Web/CSS/resolución
+---
+<div>{{CSSRef}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El tipo de dato <a href="/en-US/docs/Web/CSS">CSS</a> <code>&lt;resolution&gt;</code>, usado en <a href="/en-US/docs/Web/Guide/CSS/Media_queries">media queries</a>,  define la densidad de píxeles de un dispositivo de salida, su resolución. Es un {{cssxref("&lt;number&gt;")}} inmediatamente seguido por una unidad de resolución (<code>dpi</code>, <code>dpcm</code>, ...). Como para cualquier dimensión CSS, no hay espacio entre la unidad literal y el número.</p>
+
+<p>En pantallas, la longitud está relacionada a centímetros, pulgadas o píxeles CSS, no en valores físicos.</p>
+
+<p>Incluso si todas las unidades representan la misma resolución para el valor 0, la unidad no se puede omitir en este caso, ya que no es un {{cssxref("&lt;length&gt;")}}: <code>0</code> es inválida y no representa <code>0dpi</code>, <code>0dpcm</code>, ni <code>0dppx</code>.</p>
+
+<h2 id="Units" name="Units">Unidades</h2>
+
+<dl>
+ <dt><code><a name="dpi">dpi</a></code></dt>
+ <dd>Esta unidad representa el número de <a href="http://en.wikipedia.org/wiki/Dots_per_inch">dots per inch</a> (ppp en español), puntos por pulgada . A screen typically contains 72 or 96 dpi; a printed document usually reach much greater dpi. As 1 inch is 2.54 cm, <code>1dpi ≈ 0.39dpcm</code>.</dd>
+ <dt><code><a name="dpcm">dpcm</a></code></dt>
+ <dd>Esta unidad representa el número de  <a href="http://en.wikipedia.org/wiki/Dots_per_centimetre">dots per centimeter</a> (ppc en español), puntos por cm. 1 inch(pulgada) son 2.54 cm, <code>1dpcm ≈ 2.54dpi</code>.</dd>
+ <dt><code><a name="dppx">dppx</a></code></dt>
+ <dd>Esta unidad representa el número de puntos por unidad px. Debido a la relación fija de 1:96 CSS para CSS px, 1 px es equivalente a 96 dpi, que corresponde a la resolución predeterminada de las imágenes mostradas en CSS como se define por {{cssxref("image-resolution")}}.</dd>
+</dl>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<p>Éstos son algunos de los usos correctos de valores <code>&lt;resolution&gt;</code>:</p>
+
+<pre>96dpi                                              Uso correcto: a {{cssxref("&lt;number&gt;")}} (here an {{cssxref("&lt;integer&gt;")}}) followed by the unit.
+@media print and (min-resolution: 300dpi) { ... }  El uso correcto en el contexto de una <a href="/en-US/docs/Web/Guide/CSS/Media_queries">media query</a>.
+</pre>
+
+<p>Here are some incorrect uses:</p>
+
+<pre>72 dpi                                             Incorecto: no hay espacios entre {{ cssxref("&lt;number&gt;") }} y la unidad.
+ten dpi                                            Incorecto: sólo deben ser utilizados dígitos.
+0                                                  Incorecto: la unidad se puede omitir por 0 sólo para valores {{ cssxref("&lt;length&gt;") }}.
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificación</h2>
+
+<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 Values', '#resolution', '&lt;resolution&gt;')}}</td>
+   <td>{{Spec2('CSS3 Values')}}</td>
+   <td>Factorización del tipo en una especificación más genérica. Ningún cambio</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Images', '#resolution-units', '&lt;resolution&gt;')}}</td>
+   <td>{{Spec2('CSS3 Images')}}</td>
+   <td>Añadida la unidad <code>dppx</code></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Media Queries', '#resolution', '&lt;resolution&gt;')}}</td>
+   <td>{{Spec2('CSS3 Media Queries')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>29</td>
+   <td>3.5 (1.9.1)<sup>[1]</sup></td>
+   <td>9</td>
+   <td>9.5</td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+  </tr>
+  <tr>
+   <td><code>dppx</code></td>
+   <td>29</td>
+   <td>{{CompatGeckoDesktop("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>12.10</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+  </tr>
+  <tr>
+   <td><code>dppx</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>12.10</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Antes de Firefox 8 (Gecko 8.0), era erroneamente aceptado sólo dimensiones CSS que fueran {{cssxref("&lt;integer&gt;")}} seguidos por la unidad. A partir de esa versión, es compatible con cualquier dimensión ({{cssxref("&lt;number&gt;")}} CSS válido seguido inmediatamente por la unidad).</p>
+
+<p>[2] El Webkit engine no soporta resolución CSS  en la especificación, es necesario el uso del no estandar <code>device-pixel-ratio</code> query para el navegador Safari, ver <a href="https://bugs.webkit.org/show_bug.cgi?id=16832">bug 16832</a>.</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Guide/CSS/Media_queries">CSS Media Queries</a></li>
+</ul>
diff --git a/files/es/web/css/rtl/index.html b/files/es/web/css/rtl/index.html
deleted file mode 100644
index 1fd8c9f45d..0000000000
--- a/files/es/web/css/rtl/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: rtl
-slug: Web/CSS/rtl
----
-<h3 id="Sumario" name="Sumario"> Sumario </h3>
-<p>El valor <i>rtl</i> es el valor que debe usarse para la propiedad CSS:direction si queremos escribir en lenguas táles como el Hebreo o el Árabe. El nombre viene de las iniciales de las palabras en inglés: Right To Left, que indican que el texto y otros elementos se han de representar de derecha a izquierda.
-</p><p><br>
-</p>
-<h3 id="Ejemplos" name="Ejemplos"> Ejemplos </h3>
-<pre class="eval">div {
-   position: absolute;
-   right: 20px;
-   height: 200px;
-   border: 1px solid #000;
-   direction: rtl;
-}
-</pre>
-<p><br>
-</p>
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n"> Ver también </h3>
-<p>{{ Cssxref("direction") }}, {{ Cssxref("ltr") }}
-</p>
diff --git a/files/es/web/css/selectores_atributo/index.html b/files/es/web/css/selectores_atributo/index.html
deleted file mode 100644
index a7b59d03c6..0000000000
--- a/files/es/web/css/selectores_atributo/index.html
+++ /dev/null
@@ -1,241 +0,0 @@
----
-title: Selectores de atributo
-slug: Web/CSS/Selectores_atributo
-tags:
-  - Atributos
-  - CSS
-  - Selectores
-  - Selectores de Atributo
-translation_of: Web/CSS/Attribute_selectors
----
-<div>{{CSSRef}}</div>
-
-<p>El <strong>selector de atributos</strong> CSS coincide con los elementos en función de la presencia o el valor de un atributo determinado.</p>
-
-<pre class="brush: css no-line-numbers">/* Elementos &lt;a&gt; con un atributo title */
-a[title] {
-  color: purple;
-}
-
-/* Elementos &lt;a&gt; con un href que coincida con "https://example.org" */
-a[href="https://example.org"] {
-  color: green;
-}
-
-/* Elementos &lt;a&gt; con un href que contenga "example" */
-a[href*="example"] {
-  font-size: 2em;
-}
-
-/* Elementos &lt;a&gt; con un href que comience con "#" */
-a[href^="#"] {
-  color: #001978;
-}
-
-/* Elementos &lt;a&gt; con un href que termine en ".org" */
-a[href$=".org"] {
-  font-style: italic;
-}
-
-/* Elementos &lt;a&gt; cuyo atributo class contenga la palabra "logo" */
-a[class~="logo"] {
-  padding: 2px;
-}
-</pre>
-
-<dl>
- <dt><code>[<em>attr</em>]</code></dt>
- <dd>Selecciona los elementos que tienen el atributo <em>attr</em>.</dd>
- <dt><code>[<em>attr</em>=<em>value</em>]</code></dt>
- <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga exactamente el valor <em>value</em>.</dd>
- <dt><code>[<em>attr</em>~=<em>value</em>]</code></dt>
- <dd>
- <p>Selecciona los elementos cuyo atributo <em>attr</em> tenga por valor una lista de palabras separadas por espacios, una de las cuales sea <em>value</em>.</p>
- </dd>
- <dt><code>[<em>attr</em>|=<em>value</em>]</code></dt>
- <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga exactamente el valor <em>value</em> o empiece por <em>value</em> seguido de un guión <code>-</code> (U+002D). Se puede usar para coincidencias de subcódigos en otros idiomas.</dd>
- <dt><code>[<em>attr</em>^=<em>value</em>]</code></dt>
- <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga un valor prefijado  por <em>value</em>.</dd>
- <dt><code>[<em>attr</em>$=<em>value</em>]</code></dt>
- <dd>Selecciona los elementos cuyo atributo <em>attr</em> cuyo valor tiene el sufijo (seguido) de <em>value</em>.</dd>
- <dt><code>[<em>attr</em>*=<em>value</em>]</code></dt>
- <dd>Selecciona los elementos cuyo atributo <em>attr</em> tenga un valor que contenga <em>value</em>.</dd>
- <dt id="case-insensitive"><code>[<em>attr</em> <em>operator</em> <em>value</em> i]</code></dt>
- <dd>Agregar una <code>i</code> (o <code>I</code>) antes del corchete de cierre hace que el valor sea comparado sin distinguir entre mayúsculas y minúsculas (para caracteres dentro del rango ASCII).</dd>
- <dt id="case-insensitive"><code>[<em>attr</em> <em>operator</em> <em>value</em> s]</code> {{Experimental_Inline}}</dt>
- <dd>Agregar una <code>s</code> (o <code>S</code>) antes del corchete de cierre hace que el valor sea comparado distinguiendo entre mayúsculas y minúsculas (para caracteres dentro del rango ASCII).</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Enlaces">Enlaces</h3>
-
-<h4 id="CSS">CSS</h4>
-
-<pre class="brush: css">a {
-  color: blue;
-}
-
-/* Enlaces internos, comenzando con "#" */
-a[href^="#"] {
-  background-color: gold;
-}
-
-/* Enlaces con "example" en cualquier parte de la URL */
-a[href*="example"] {
-  background-color: silver;
-}
-
-/* Enlaces con "insensitive" en cualquier parte de la URL,
-   independientemente de las mayúsculas */
-a[href*="insensitive" i] {
-  color: cyan;
-}
-
-/* Enlaces que terminan en ".org" */
-a[href$=".org"] {
-  color: red;
-}
-</pre>
-
-<h4 id="HTML">HTML</h4>
-
-<pre class="brush: html">&lt;ul&gt;
-  &lt;li&gt;&lt;a href="#internal"&gt;Enlace interno&lt;/a&gt;&lt;/li&gt;
-  &lt;li&gt;&lt;a href="http://example.com"&gt;Enlace de ejemplo&lt;/a&gt;&lt;/li&gt;
-  &lt;li&gt;&lt;a href="#InSensitive"&gt;Enlace interno insensible Insensitive&lt;/a&gt;&lt;/li&gt;
-  &lt;li&gt;&lt;a href="http://example.org"&gt;Ejemplo de enlace .org&lt;/a&gt;&lt;/li&gt;
-&lt;/ul&gt;</pre>
-
-<h4 id="Resultado">Resultado</h4>
-
-<p>{{EmbedLiveSample('Enlaces')}}</p>
-
-<h3 id="Idiomas">Idiomas</h3>
-
-<h4 id="CSS_2">CSS</h4>
-
-<pre class="brush: css">/* Todos los divs con un atributo `lang` están en negrita. */
-div[lang] {
-  font-weight: bold;
-}
-
-/* Todos los divs en inglés de EE. UU. son azules. */
-div[lang~="en-us"] {
-  color: blue;
-}
-
-/* Todos los divs en portugués son verdes. */
-div[lang="pt"] {
-  color: green;
-}
-
-/* Todos los divs en chino son rojos, ya sean
-   simplificados (zh-CN) o tradicionales (zh-TW). */
-div[lang|="zh"] {
-  color: red;
-}
-
-/* Todos los divs con `data-lang` Traditional Chinese
-   son de color púrpura. */
-/* Nota: también puede usar atributos con guiones
-   sin comillas dobles */
-div[data-lang="zh-TW"] {
-  color: purple;
-}
-</pre>
-
-<h4 id="HTML_2">HTML</h4>
-
-<pre class="brush: html">&lt;div lang="en-us en-gb en-au en-nz"&gt;Hello World!&lt;/div&gt;
-&lt;div lang="pt"&gt;Olá Mundo!&lt;/div&gt;
-&lt;div lang="zh-CN"&gt;世界您好！&lt;/div&gt;
-&lt;div lang="zh-TW"&gt;世界您好！&lt;/div&gt;
-&lt;div data-lang="zh-TW"&gt;?世界您好！&lt;/div&gt;
-</pre>
-
-<h4 id="Resultado_2">Resultado</h4>
-
-<p>{{EmbedLiveSample('Idiomas')}}</p>
-
-<h3 id="Listas_Ordenadas">Listas Ordenadas</h3>
-
-<p>{{SeeCompatTable}}</p>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">La especificación HTML requiere que el atributo </span></span>{{htmlattrxref("type", "input")}}<span class="tlid-translation translation" lang="es"><span title=""> distinga entre mayúsculas y minúsculas debido a que se usa principalmente en el elemento </span></span>{{HTMLElement("input")}}<span class="tlid-translation translation" lang="es"><span title="">, tratando de usar selectores de atributos con el atributo </span></span>{{htmlattrxref("type", "ol")}}<span class="tlid-translation translation" lang="es"><span title=""> de una </span></span>{{HTMLElement("ol", "lista ordenada")}}<span class="tlid-translation translation" lang="es"><span title=""> no funciona sin el modificador de mayúsculas y minúsculas</span><span title="">.</span></span></p>
-
-<h4 id="CSS_3">CSS</h4>
-
-<pre class="brush: css line-numbers language-css"><code class="language-css"><span class="comment token">/*
-Los tipos de lista requieren poder distinguir entre mayúsculas
-y minúsculas debido al peculiar comportamiento que tiene HTML
-con el atributo "type"
-*/
-</span>
-<span class="selector token">ol<span class="attribute token"><span class="punctuation token">[</span><span class="attribute token">type</span><span class="operator token">=</span><span class="token value">"a"</span><span class="punctuation token">]</span></span></span> <span class="punctuation token">{</span>
-  <span class="property token">list-style-type</span><span class="punctuation token">:</span> lower-alpha<span class="punctuation token">;</span>
-  <span class="property token">background</span><span class="punctuation token">:</span> red<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token">ol<span class="attribute token"><span class="punctuation token">[</span><span class="attribute token">type</span><span class="operator token">=</span><span class="token value">"a"</span> <span class="case-sensitivity keyword token">s</span><span class="punctuation token">]</span></span></span> <span class="punctuation token">{</span>
-  <span class="property token">list-style-type</span><span class="punctuation token">:</span> lower-alpha<span class="punctuation token">;</span>
-  <span class="property token">background</span><span class="punctuation token">:</span> lime<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="selector token">ol<span class="attribute token"><span class="punctuation token">[</span><span class="attribute token">type</span><span class="operator token">=</span><span class="token value">"A"</span> <span class="case-sensitivity keyword token">s</span><span class="punctuation token">]</span></span></span> <span class="punctuation token">{</span>
-  <span class="property token">list-style-type</span><span class="punctuation token">:</span> upper-alpha<span class="punctuation token">;</span>
-  <span class="property token">background</span><span class="punctuation token">:</span> lime<span class="punctuation token">;</span>
-<span class="punctuation token">}</span></code></pre>
-
-<h4 id="HTML_3">HTML</h4>
-
-<pre class="brush: html; line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>ol</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>A<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>li</span><span class="punctuation token">&gt;</span></span>Example list<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>li</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>ol</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<h4 id="Result">Result</h4>
-
-<p>{{EmbedLiveSample("HTML_ordered_lists")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS4 Selectors', '#attribute-selectors', 'attribute selectors')}}</td>
-   <td>{{Spec2('CSS4 Selectors')}}</td>
-   <td>Agrega un modificador para la selección de valores de atributos insensibles a mayúsculas / minúsculas ASCII.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Selectors', '#attribute-selectors', 'attribute selectors')}}</td>
-   <td>{{Spec2('CSS3 Selectors')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS2.1', 'selector.html#attribute-selectors', 'attribute selectors')}}</td>
-   <td>{{Spec2('CSS2.1')}}</td>
-   <td>Definición Inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("css.selectors.attribute")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Seleccionando un solo elemento:{{domxref("Document.querySelector()")}}, {{domxref("DocumentFragment.querySelector()")}}, o {{domxref("Element.querySelector()")}}</li>
- <li>Seleccionar todos los elementos coincidentes:{{domxref("Document.querySelectorAll()")}}, {{domxref("DocumentFragment.querySelectorAll()")}}, o {{domxref("Element.querySelectorAll()")}}</li>
- <li>Todos los métodos anteriores se implementan en base a {{domxref("ParentNode")}} mixin; vea  {{domxref("ParentNode.querySelector()")}} y {{domxref("ParentNode.querySelectorAll()")}}</li>
-</ul>
diff --git a/files/es/web/css/selectores_css/index.html b/files/es/web/css/selectores_css/index.html
deleted file mode 100644
index 20baaf25a6..0000000000
--- a/files/es/web/css/selectores_css/index.html
+++ /dev/null
@@ -1,164 +0,0 @@
----
-title: Selectores CSS
-slug: Web/CSS/Selectores_CSS
-tags:
-  - CSS
-  - Referencia
-  - Selectores
-  - Selectores de CSS
-  - Visión general
-translation_of: Web/CSS/CSS_Selectors
----
-<div>{{CSSRef}}</div>
-
-<p>Los <strong>selectores </strong>definen sobre qué elementos se aplicará un conjunto de reglas CSS.</p>
-
-<h2 id="Selectores_básicos">Selectores básicos</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Web/CSS/Type_selectors">Selector de tipo</a></dt>
- <dd>Selecciona todos los elementos que coinciden con el nombre del elemento especificado.<br>
- <strong>Sintaxis:</strong> <code><var>eltname</var></code><br>
- <strong>Ejemplo:</strong> <code>input</code> se aplicará a cualquier elemento {{HTMLElement('input')}}.</dd>
- <dt><a href="/en-US/docs/Web/CSS/Class_selectors">Selector de clase</a></dt>
- <dd>Selecciona todos los elementos que tienen el atributo de <code>class</code> especificado.<br>
- <strong>Sintaxis:</strong> <code>.<var>classname</var></code><br>
- <strong>Ejemplo:</strong> <code>.index</code> seleccionará cualquier elemento que tenga la clase "<em>index</em>".</dd>
- <dt><a href="/en-US/docs/Web/CSS/ID_selectors">Selector de ID</a></dt>
- <dd>Selecciona un elemento basándose en el valor de su atributo <code>id</code>. Solo puede haber un elemento con un determinado ID dentro de un documento.<br>
- <strong>Sintaxis:</strong> <code>#<var>idname</var></code><br>
- <strong>Ejemplo:</strong> <code>#toc</code> se aplicará a cualquier elemento que tenga el ID "<em>toc</em>".</dd>
- <dt><a href="/en-US/docs/Web/CSS/Universal_selectors">Selector universal</a></dt>
- <dd>Selecciona todos los elementos. Opcionalmente, puede estar restringido a un espacio de nombre específico o a todos los espacios de nombres.<br>
- <strong>Sintaxis:</strong> <code>* ns|* *|*</code><br>
- <strong>Ejemplo:</strong> <code>*</code> se aplicará a todos los elementos del documento.</dd>
- <dt><a href="/en-US/docs/Web/CSS/Attribute_selectors">Selector de atributo</a></dt>
- <dd>Selecciona elementos basándose en el valor de un determinado atributo.<br>
- <strong>Sintaxis:</strong> <code>[attr] [attr=value] [attr~=value] [attr|=value] [attr^=value] [attr$=value] [attr*=value]</code><br>
- <strong>Ejemplo:</strong> <code>[autoplay]</code> seleccionará todos los elementos que tengan el atributo "autoplay" establecido (a cualquier valor).</dd>
-</dl>
-
-<h2 id="Combinadores">Combinadores</h2>
-
-<dl>
- <dt><a href="/es/docs/Web/CSS/Selectores_hermanos_adyacentes">Combinador de hermanos adyacentes</a></dt>
- <dd>El combinador <code>+</code> selecciona hermanos adyacentes. Esto quiere decir que el segundo elemento sigue directamente al primero y ambos comparten el mismo elemento padre.<br>
- <strong>Sintaxis:</strong> <code><var>A</var> + <var>B</var></code><br>
- <strong>Ejemplo:</strong> La regla <code>h2 + p</code> se aplicará a todos los elementos {{HTMLElement('p')}} que siguen directamente a un elemento {{HTMLElement('h2')}}.</dd>
- <dt><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Combinador general de hermanos</a></dt>
- <dd>El combinador <code>~</code> selecciona hermanos. Esto quiere decir que el segundo elemento sigue al primero (no necesariamente de forma inmediata) y ambos comparten el mismo elemento padre.<br>
- <strong>Sintaxis:</strong> <code><var>A</var> ~ <var>B</var></code><br>
- <strong>Ejemplo:</strong> La regla <code>p ~ span</code> se aplicará a todos los elementos {{HTMLElement('span')}} que siguen un elemento {{HTMLElement('p')}}.</dd>
- <dt><a href="/es/docs/Web/CSS/Child_selectors">Combinador de hijo </a></dt>
- <dd>El combinador <code>&gt;</code> selecciona los elementos que son hijos directos del primer elemento.<br>
- <strong>Sintaxis:</strong> <code><var>A</var> &gt; <var>B</var></code><br>
- <strong>Ejemplo:</strong> La regla <code>ul &gt; li</code> se aplicará a todos los elementos {{HTMLElement('li')}} que son hijos directos de un elemento {{HTMLElement('ul')}}.</dd>
- <dt><a href="/es/docs/Web/CSS/Descendant_selectors">Combinador de descendientes</a></dt>
- <dd>El combinador <code> </code> (espacio) selecciona los elementos que son descendientes del primer elemento.<br>
- <strong>Sintaxis:</strong> <code>A B</code><br>
- <strong>Ejemplo:</strong> La regla <code>div span</code> se aplicará a todos los elementos {{HTMLElement('span')}} que están dentro de un elemento {{HTMLElement('div')}}.</dd>
- <dt><a href="https://developer.mozilla.org/es/docs/Web/CSS/Column_combinator">Combinador de column</a>a {{Experimental_Inline}}</dt>
- <dd>El combinador <code>||</code> selecciona los elementos especificados pertenecientes a una columna.<br>
- <strong>Sintaxis:</strong> <code><var>A</var> || <var>B</var></code><br>
- <strong>Ejemplo:</strong> <code>col || td</code> seleccionará todos los elementos {{HTMLElement("td")}} que pertenezcan al ámbito de {{HTMLElement("col")}}.</dd>
-</dl>
-
-<h2 id="Pseudoclases"><strong>Pseudoclases</strong></h2>
-
-<dl>
- <dt>Las <a href="/es/docs/Web/CSS/Pseudo-classes">pseudoclases</a> permiten la selección de elementos, basada en información de estado que no está contenida en el árbol de documentos.</dt>
- <dd><strong>Ejemplo:</strong> La regla a<code>:visited</code> se aplicará a todos los elementos {{HTMLElement("a")}} que hayan sido visitados por el usuario.</dd>
-</dl>
-
-<h2 id="Pseudoelementos">Pseudoelementos</h2>
-
-<dl>
- <dt>
- <p>Los <a href="/es/docs/Web/CSS/Pseudoelementos">pseudoelementos</a> son abstracciones del árbol que representan entidades más allá de los elementos HTML. Por ejemplo, HTML no tiene un elemento que describa la primera letra de un párrafo ni los marcadores de una lista. Los pseudoelementos representan estas entidades y nos permiten asignarles reglas CSS. De este modo podemos diseñar estas entidades de forma independiente.</p>
- </dt>
- <dd><strong>Ejemplo:</strong> La regla <code>p::first-line</code> se aplicará a la primera línea de texto de todos los elementos {{HTMLElement('p')}}.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('CSS4 Selectors')}}</td>
-   <td>{{Spec2('CSS4 Selectors')}}</td>
-   <td>Añadidos el combinador de columna <code>||</code>, selectores de estructura de grilla, combinadores lógicos, pseudoclases de ubicación, dimensión temporal, estado de recurso, lingüisticas y de UI, modificador para la selección de valores de atributo ASCII que distingue entre mayúsculas y minúsculas.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Selectors')}}</td>
-   <td>{{Spec2('CSS3 Selectors')}}</td>
-   <td>Añadidos el combinador <code>~</code> general de hermanos y las pseudoclases de árbol-estructural. Los pseudoelementos creados, usan un prefijo <code>::</code> de dos puntos dobles. Selectores de atributos adicionales.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS2.1', 'selector.html')}}</td>
-   <td>{{Spec2('CSS2.1')}}</td>
-   <td>Añadidos los combinadores <code>&gt;</code> de elemento hijo y <code>+</code> de elementos hermanos adyacentes. Añadidos los selectores <strong>universal</strong> y de <strong>atributo</strong>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS1')}}</td>
-   <td>{{Spec2('CSS1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1</td>
-   <td>{{CompatGeckoDesktop("1")}}</td>
-   <td>3.0</td>
-   <td>3.5</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.5</td>
-   <td>{{CompatGeckoMobile("1.9.2")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/selectores_css/usando_la_pseudo-clase__colon_target_en_selectores/index.html b/files/es/web/css/selectores_css/usando_la_pseudo-clase__colon_target_en_selectores/index.html
deleted file mode 100644
index fe51517a2b..0000000000
--- a/files/es/web/css/selectores_css/usando_la_pseudo-clase__colon_target_en_selectores/index.html
+++ /dev/null
@@ -1,67 +0,0 @@
----
-title: 'Usando la pseudo-clase :target en selectores'
-slug: 'Web/CSS/Selectores_CSS/Usando_la_pseudo-clase_:target_en_selectores'
-tags:
-  - CSS
-  - CSS3
-  - Selectores
-translation_of: 'Web/CSS/CSS_Selectors/Using_the_:target_pseudo-class_in_selectors'
----
-<p><span class="comment">When a URL points at a specific piece of a document, it can be difficult to ascertain. Find out how you can use some simple CSS to draw attention to the target of a URL and improve the user's experience.</span> {{CSSRef}}</p>
-
-<p>Como ayuda para identificar el destino de un enlace que apunta a una parte específica de un documento, los <a class="external" href="http://www.w3.org/TR/css3-selectors/#target-pseudo">Selectores CSS3</a> incluyen la <a href="/en/CSS/Pseudo-classes" title="Pseudo-classes">pseudo-clase</a> {{ Cssxref(":target") }}.</p>
-
-<h3 id="Picking_a_Target" name="Picking_a_Target">Seleccionando un objetivo (target)</h3>
-
-<p>La pseudo-clase <code>{{ Cssxref(":target") }}</code> es usada para estilizar el elemento objetivo de una URI que contiene un identificador de fragmento. Por ejemplo, la URI <code><span class="nowiki">http://developer.mozilla.org/en/docs/Using_the_:target_selector#Example</span></code> contiene el identificador de fragmento <code>#Example</code>. En HTML, los identificadores son valores de los atributos <code>id</code> o <code>name</code>, pues ambos comparten el mismo espacio de nombres. Por lo tanto, la URI de ejemplo apuntará al encabezado "Example" en este documento.</p>
-
-<p>Supongamos que se quiere estilizar cualquier elemento <code>h2</code> que sea el objetivo de una URI, pero no queremos que cualquier otro elemento tenga esos mismos estilos. Es así de simple:</p>
-
-<pre class="notranslate">h2:target {font-weight: bold;}</pre>
-
-<p>También es posible crear estilos específicos para fragmentos particulares del documento. Esto se hace usando el mismo valor del identificador que se encuentra en la URI. Así, para añadir un borde al fragmento <code>#Example</code>, escribiremos:</p>
-
-<pre class="notranslate">#Example:target {border: 1px solid black;}</pre>
-
-<h3 id="Targeting_the_Root_Element" name="Targeting_the_Root_Element">Aplicando estilos a todos los elementos objetivo</h3>
-
-<p>Si lo que se intenta es crear un estilo que cubra a todos los elementos objetivo, se puede usar el selector universal:</p>
-
-<pre class="notranslate">:target {color: red;}
-</pre>
-
-<h3 id="Example" name="Example">Ejemplo</h3>
-
-<p>En el siguiente ejemplo, hay cinco enlaces que apuntan a elementos en el mismo documento. Seleccionar el enlace "First", por ejemplo, causará que <code>&lt;h1 id="one"&gt;</code> sea el elemento objetivo. Nótese que el documento puede desplazarse a una nueva posición, pues los elementos objetivo están ubicados en la parte superior de la ventana del navegador cuando es posible.</p>
-
-<div id="example">
-<pre class="notranslate">&lt;h4 id="one"&gt;...&lt;/h4&gt; &lt;p id="two"&gt;...&lt;/p&gt;
-&lt;div id="three"&gt;...&lt;/div&gt; &lt;a id="four"&gt;...&lt;/a&gt; &lt;em id="five"&gt;...&lt;/em&gt;
-
-&lt;a href="#one"&gt;First&lt;/a&gt;
-&lt;a href="#two"&gt;Second&lt;/a&gt;
-&lt;a href="#three"&gt;Third&lt;/a&gt;
-&lt;a href="#four"&gt;Fourth&lt;/a&gt;
-&lt;a href="#five"&gt;Fifth&lt;/a&gt;</pre>
-</div>
-
-<h3 id="Conclusion" name="Conclusion">Conclusión</h3>
-
-<p>En los casos en los que un identificador de fragmento apunte a una porción del documento, los lectores pueden confundirse sobre qué parte del documento se supone que están leyendo. Darle un estilo particular al objetivo de la URI le resta confusión al lector, o incluso la elimina.</p>
-
-<h3 id="Related_Links" name="Related_Links">Enlaces relacionados</h3>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/css3-selectors/#target-pseudo">Selectores CSS3 #target-pseudo</a></li>
- <li><a class="internal" href="/es/CSS/:target" title="En/CSS/:target">Referencia CSS :target</a></li>
-</ul>
-
-<div class="originaldocinfo">
-<h3 id="Original_Document_Information" name="Original_Document_Information">Información del Documento Original</h3>
-
-<ul>
- <li>Autor(es): Eric Meyer, Evangelista de Estándares, Netscape Communications</li>
- <li>Información Original de Copyright: Copyright © 2001-2003 Netscape. Todos los derechos reservados.</li>
- <li>Nota: El artículo en inglés era originalmente parte del sitio DevEdge.</li>
-</ul>
-</div>
diff --git a/files/es/web/css/selectores_hermanos_adyacentes/index.html b/files/es/web/css/selectores_hermanos_adyacentes/index.html
deleted file mode 100644
index 1200c4bd61..0000000000
--- a/files/es/web/css/selectores_hermanos_adyacentes/index.html
+++ /dev/null
@@ -1,135 +0,0 @@
----
-title: Selectores de hermanos adyacentes
-slug: Web/CSS/Selectores_hermanos_adyacentes
-tags:
-  - CSS
-  - NeedsMobileBrowserCompatibility
-  - Referencia CSS
-  - Selectores
-translation_of: Web/CSS/Adjacent_sibling_combinator
----
-<p>{{CSSRef("Selectors")}}</p>
-
-<p>Se hace referencia a este selector como selector adyacente o selector del próximo hermano. Sólo seleccionará un elemento especificado que esté inmediatamente después de otro elemento especificado.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">elemento_anterior + elemento_afectado { <em>estilos</em> }
-</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<div id="Example_1">
-<pre class="brush: css">li:first-of-type + li {
-  color: red;
-}
-</pre>
-
-<pre class="brush: html">&lt;ul&gt;
-  &lt;li&gt;Uno&lt;/li&gt;
-  &lt;li&gt;Dos&lt;/li&gt;
-  &lt;li&gt;Tres&lt;/li&gt;
-&lt;/ul&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample('Example_1', 200, 100)}}</p>
-
-<p>Otro caso podría ser dar estilos a un span que se use de pie de foto de los siguientes elementos {{HTMLElement("img")}} :</p>
-
-<pre class="brush: css">img + span.caption {
-  font-style: italic;
-}
-</pre>
-
-<p>que coincidiría con los siguientes elementos {{HTMLElement("span")}} :</p>
-
-<pre class="brush: html">&lt;img src="photo1.jpg"&gt;&lt;span class="caption"&gt;The first photo&lt;/span&gt;
-&lt;img src="photo2.jpg"&gt;&lt;span class="caption"&gt;The second photo&lt;/span&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('CSS4 Selectors', '#adjacent-sibling-combinators', 'next-sibling combinator')}}</td>
-   <td>{{Spec2('CSS4 Selectors')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Selectors', '#adjacent-sibling-combinators', 'Adjacent sibling combinator')}}</td>
-   <td>{{Spec2('CSS3 Selectors')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS2.1', 'selector.html#adjacent-selectors', 'Adjacent sibling selectors')}}</td>
-   <td>{{Spec2('CSS2.1')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>7.0<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>2.1</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Internet Explorer 7 no actualiza correctamente el estilo cuando un elemento es insertado dinámicamente antes de otro elemento que coincidía con el selector. En Internet Explorer 8, si un elemento es insertado dinámicamente haciendo click en un enlace, el estilo del <code>first-child</code> no se aplica hasta que el enlace pierde el foco.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/CSS/Selectores_hermanos_generales">Selectores de hermanos generales</a></li>
-</ul>
diff --git a/files/es/web/css/selectores_hermanos_generales/index.html b/files/es/web/css/selectores_hermanos_generales/index.html
deleted file mode 100644
index 96c87148b9..0000000000
--- a/files/es/web/css/selectores_hermanos_generales/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: Selectores de hermanos generales
-slug: Web/CSS/Selectores_hermanos_generales
-tags:
-  - CSS
-  - NeedsMobileBrowserCompatibility
-  - Referencia CSS
-  - Selectores
-translation_of: Web/CSS/General_sibling_combinator
----
-<div><span class="s1">{{CSSRef("Selectors")}}</span></div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El combinador <code>~</code> separa dos selectores y selecciona el segundo elemento sólo si está precedido por el primero y ambos comparten un padre común.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox">elemento ~ elemento { <em>estilos</em> }
-</pre>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<pre class="brush: css">p ~ span {
-  color: red;
-}</pre>
-
-<pre class="brush: html">&lt;span&gt;Este span no es rojo.&lt;/span&gt;
-&lt;p&gt;Aquí hay un párrafo.&lt;/p&gt;
-&lt;code&gt;Aquí hay algo de código.&lt;/code&gt;
-&lt;span&gt;Aquí hay un span. Es rojo porque va precedido de un párrafo y ambos comparten el mismo padre.&lt;/span&gt;</pre>
-
-<p>{{ EmbedLiveSample('Example', 320, 150) }}</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{ SpecName('CSS4 Selectors', '#general-sibling-combinators', 'following-sibling combinator') }}</td>
-   <td>{{Spec2('CSS4 Selectors')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{ SpecName('CSS3 Selectors', '#general-sibling-combinators', 'general sibling combinator') }}</td>
-   <td>{{Spec2('CSS3 Selectors')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1")}}</td>
-   <td>7</td>
-   <td>9</td>
-   <td>3</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Android</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<p> </p>
-
-<ul>
- <li><a href="/en-US/docs/Web/CSS/Adjacent_sibling_selectors">Selectores de hermanos adyacentes</a></li>
-</ul>
diff --git a/files/es/web/css/sintaxis_definición_de_valor/index.html b/files/es/web/css/sintaxis_definición_de_valor/index.html
deleted file mode 100644
index 90d5ea8b75..0000000000
--- a/files/es/web/css/sintaxis_definición_de_valor/index.html
+++ /dev/null
@@ -1,402 +0,0 @@
----
-title: Sintaxis de definición de valor
-slug: Web/CSS/Sintaxis_definición_de_valor
-translation_of: Web/CSS/Value_definition_syntax
----
-<p>{{CSSRef()}}</p>
-
-<p><span class="seoSummary"><strong>La sintaxis de definición de valores CSS</strong>, una gramática formal, se utiliza para definir el conjunto de valores válidos para una propiedad o función CSS. Además de esta sintaxis, el conjunto de valores válidos puede restringirse aún más mediante restricciones semánticas (por ejemplo, para que un número sea estrictamente positivo).</span></p>
-
-<p class="summary">La sintaxis de definición describe qué valores están permitidos y las interacciones entre ellos. Un componente puede ser una <em>palabra clave</em>, algunos caracteres <em>literales</em>, ó un valor de tipo de dato de CSS o propiedad CSS.</p>
-
-<h2 id="Tipos_de_valor_de_los_componentes">Tipos de valor de los componentes</h2>
-
-<h3 id="Palabras_clave">Palabras clave</h3>
-
-<h4 id="Palabras_clave_genéricas">Palabras clave genéricas</h4>
-
-<p>Una palabra clave con significado predefinido aparece literalmente, sin comillas, por ejemplo: <code>auto</code>, <code>smaller</code> or <code>ease-in</code>.</p>
-
-<h4 id="El_caso_específico_de_inherit_e_initial">El caso específico de <code>inherit</code> e <code>initial</code></h4>
-
-<p>Todas las propiedades CSS aceptan las palabras clave <code>inherit</code> e <code>initial</code> que son definidas vía CSS. Estas no son mostradas en la definición del valor y están implícitamente definidas.</p>
-
-<h3 id="Literales">Literales</h3>
-
-<p>En CSS, unos pocos caracteres pueden aparecer por su cuenta, como la barra ('<code>/</code>') o la coma ('<code>,</code>'), y son usadas en una propiedad o definición para separar sus partes. La coma es a menudo usada para separar valores en enumeraciones, o parámetros en funciones de tipo matemático; la barra a menudo separa partes de el valor que es semánticamente diferente, pero que tiene una sintaxis común. Típicamente, la barra es usada a veces en propiedades abreviadas para separar componentes que son del mismo tipo, pero pertenecen a diferentes propiedades.</p>
-
-<p>Ambos símbolos aparecen literalmente en una definición de valor.</p>
-
-<h3 id="Tipos_de_dato">Tipos de dato</h3>
-
-<h4 id="Tipos_de_dato_básicos">Tipos de dato básicos</h4>
-
-<p>Un tipo de dato usado vía CSS es definido una sola vez para todos los valores en la especificación. Se llaman <em>tipos de datos básicos, </em>estan representados por su nombre rodeados del símbolo '<code>&lt;</code>' y '<code>&gt;</code>': {{ cssxref("&lt;angle&gt;") }}, {{cssxref("&lt;string&gt;")}}, …</p>
-
-<h4 id="Tipos_de_dato_no_terminales">Tipos de dato no terminales</h4>
-
-<p>Tipos de dato poco comunes, llamados <em>tipos de datos no terminales</em>, están también rodeados por  '<code>&lt;</code>' y '<code>&gt;</code>'.</p>
-
-<p>Los tipos de dato no terminales son de dos tipos::</p>
-
-<ul>
- <li>tipos de datos <em>que comparten el mismo nombre de propiedad</em>, colocados entre comillas . En este caso el tipo de dato comparte el mismo conjunto de valores de la propiedad. A menudo son usados en la definición de propiedades abreviadas.</li>
- <li>tipos de datos <em>que no comparten el mismo nombre de la propiedad</em>. Estos tipos de datos son muy cercanos a sus tipos de datos básicos. Ellos solo difieren de los tipos de datos básicos en la ubicación física de su definición: en este caso la definición es usualmente físicamente muy cercana a la definición de la propiedad que la esta usando.</li>
-</ul>
-
-<h2 id="Combinadores_de_los_valores_de_componentes">Combinadores de los valores de componentes</h2>
-
-<h3 id="Corchetes">Corchetes</h3>
-
-<p><em>Corchetes </em>encierran varias entidades, combinadores, y multiplicadores, luego los transforman en un solo componente. Son usados para <strong>agrupar componentes para sobreescribir las reglas de precedencia.</strong></p>
-
-<pre class="syntaxbox"><code>bold [ thin &amp;&amp; &lt;length&gt; ]</code></pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold thin 2vh</code></li>
- <li><code>bold 0 thin</code></li>
- <li><code>bold thin 3.5em</code></li>
-</ul>
-
-<p>Pero no con:</p>
-
-<ul>
- <li><code>thin bold 3em</code>,  porque <code>bold</code> esta yuxtapuesto con el componente definido por los corchetes, debe aparecer antes de él.</li>
-</ul>
-
-<h3 id="Yuxtaposición">Yuxtaposición</h3>
-
-<p>Colocar varias palabras clave, literales, o tipos de datos, uno al lado del otro, solo separados por uno o varios espacios se llama <em>yuxtaponer. </em>Todos los componentes yuxtapuestos son <strong>obligatorios y deben aparecer en ese orden exacto.</strong></p>
-
-<pre class="syntaxbox">bold &lt;length&gt; , thin
-</pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold 1em, thin</code></li>
- <li><code>bold 0, thin</code></li>
- <li><code>bold 2.5cm, thin</code></li>
- <li><code>bold 3vh, thin</code></li>
-</ul>
-
-<p>Pero no con:</p>
-
-<ul>
- <li><code>thin 1em, bold</code> porque las entidades deben aparecer en el orden expresado</li>
- <li><code>bold 1em thin</code> porque las entidades son obligatorias; la coma que es un literal debe estar presente</li>
- <li><code>bold 0.5ms, thin</code> porque los valores <code>ms</code> no son de tipo {{cssxref("&lt;length&gt;")}}</li>
-</ul>
-
-<h3 id="Doble_ampersand">Doble ampersand</h3>
-
-<p>Separar dos o mas componentes por un <em>doble ampersand</em>, <code>&amp;&amp;</code>, significa que todas esas entidades son <strong>obligatorias pero pueden aparecer en cualquier orden.</strong></p>
-
-<pre class="syntaxbox">bold &amp;&amp; &lt;length&gt;
-</pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold 1em</code></li>
- <li><code>bold 0</code></li>
- <li><code>2.5cm bold</code></li>
- <li><code>3vh bold</code></li>
-</ul>
-
-<p>Pero no con:</p>
-
-<ul>
- <li><code>bold</code> porque ambos componentes deben aparecer en el valor</li>
- <li><code>bold 1em bold</code> porque ambos componentes deben aparecer solo una vez</li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> yuxtaposición tiene precedencia sobre el doble ampersand, esto quiere decir que <code>bold thin &amp;&amp; &lt;length&gt;</code> es equivalente a <code>[ </code><code>bold thin ] &amp;&amp; &lt;length&gt;</code>. Que describe a <code>bold thin &lt;length&gt;</code> ó <code>&lt;length&gt;</code><code> bold thin</code> pero no a  <code>bold &lt;length&gt;</code><code> thin</code>.</div>
-
-<h3 id="Barra_doble">Barra doble</h3>
-
-<p>Separar dos o mas componentes por una <em>barra doble</em>, <code>||</code>, significa que todas las entidades son opcionales: <strong>al menos una debe estar presente, y pueden aparecer en cualquier orden. </strong>Típicamente ésto es usado para definir los diferentes valores de una <a href="/en-US/docs/CSS/Shorthand_properties" title="/en-US/docs/CSS/Shorthand_properties">propiedad abreviada</a>.</p>
-
-<pre class="syntaxbox">&lt;'border-width'&gt; || &lt;'border-style'&gt; || &lt;'border-color'&gt;
-</pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>1em solid blue</code></li>
- <li><code>blue 1em</code></li>
- <li><code>solid 1px yellow</code></li>
-</ul>
-
-<p>Pero no con:</p>
-
-<ul>
- <li><code>blue yellow</code> porque un componente debe aparecer al menos una vez.</li>
- <li><code>bold</code>  porque no es una palabra clave permitida como valor de ninguna de las entidades.</li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> el doble ampersand tiene precedencia sobre la barra doble, que significa que <code>bold || thin &amp;&amp; &lt;length&gt;</code> es equivalente a <code>bold || [ thin &amp;&amp; &lt;length&gt; ]</code>. Describe a <code>bold</code>, <code>thin</code>, <code>&lt;length&gt;</code>, <code>bold thin</code>, <code>&lt;length&gt; bold</code>, o <code>thin &lt;length&gt; bold</code> pero no <code>bold &lt;length&gt;</code><code> bold thin</code> porque bold, si no es omitido debe colocarse antes o después de el componente<code> thin &amp;&amp; &lt;length&gt;</code></div>
-
-<h3 id="Barra_simple">Barra simple</h3>
-
-<p>Separar dos o mas componentes con <em>una barra simple</em>, <code>|</code>, quiere decir que todas las entidades son opciones exclusivas: <strong>exactamente una de estas opciones debe estar presente. </strong>Esto es tipicamente usado para separar una lista de posibles palabras clave.</p>
-
-<pre class="syntaxbox">&lt;percentage&gt; | &lt;length&gt; | left | center | right | top | bottom</pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>3%</code></li>
- <li><code>0</code></li>
- <li><code>3.5em</code></li>
- <li><code>left</code></li>
- <li><code>center</code></li>
- <li><code>right</code></li>
- <li><code>top</code></li>
- <li><code>bottom</code></li>
-</ul>
-
-<p>Pero no</p>
-
-<ul>
- <li><code>center 3%</code> porque solo uno de los componentes debe estar presente</li>
- <li><code>3em 4.5em</code> porque un componente debe estar presente máximo una vez.</li>
-</ul>
-
-<div class="note">
-<p><strong>Note:</strong> la barra doble tiene precedencia sobre la barra simple, quiere decir que <code>bold | thin || &lt;length&gt;</code> es equivalente a <code>bold | [ thin || &lt;length&gt; ]</code>. Describe <code>bold</code>, <code>thin</code>, <code>&lt;length&gt;</code>, <code>&lt;length&gt; thin</code>, o <code>thin &lt;length&gt; </code>pero no <code>bold &lt;length&gt;</code><code> </code>porque solo una entidad de cada lado del combinador <code>|</code> puede estar presente.</p>
-</div>
-
-<h2 id="Multiplicadores_de_valores_de_componentes">Multiplicadores de valores de componentes</h2>
-
-<p>Un multiplicador es un símbolo que indica cuantas veces una entidad precedente puede ser repetida. Sin un multiplicador, una entidad debe aparecer exactamente una vez.</p>
-
-<p>Note que los multiplicadores no pueden sumarse y tienen precedencia sobre los combinadores.</p>
-
-<h3 id="Asterisco_(*)">Asterisco (<code>*</code>)</h3>
-
-<p>El <em>multiplicador asterisco </em>indica que la entidad puede aparecer <strong>cero, una o varias veces.</strong></p>
-
-<pre class="syntaxbox"><code>bold smaller*</code></pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold</code></li>
- <li><code>bold smaller</code></li>
- <li><code>bold smaller smaller</code></li>
- <li><code>bold smaller smaller smaller</code> y así sucesivamente</li>
-</ul>
-
-<p>Pero no:</p>
-
-<ul>
- <li><code>smaller</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de la palabra clave <code>smaller</code></li>
-</ul>
-
-<h3 id="Suma_()">Suma (<code>+</code>)</h3>
-
-<p>El <em>multiplicador suma </em>indica que la entidad puede aparecer <strong>una o varias veces.</strong></p>
-
-<pre class="syntaxbox"><code>bold smaller+</code></pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold smaller</code></li>
- <li><code>bold smaller smaller</code></li>
- <li><code>bold smaller smaller smaller</code> y sucesivamente</li>
-</ul>
-
-<p>Pero no:</p>
-
-<ul>
- <li><code>bold</code> porque <code>smaller</code> debe aparecer al menos una vez</li>
- <li><code>smaller</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
-</ul>
-
-<h3 id="Pregunta_()">Pregunta (<code>?</code>)</h3>
-
-<p>El <em>multiplicador pregunta </em>indica que la entidad es opcional y <strong>debe aparecer cero o una vez</strong></p>
-
-<pre class="syntaxbox"><code>bold smaller?</code></pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold</code></li>
- <li><code>bold smaller</code></li>
-</ul>
-
-<p>Pero no:</p>
-
-<ul>
- <li><code>bold smaller smaller</code> porque <code>smaller</code> debe aparecer como máximo una vez</li>
- <li><code>smaller bold</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
-</ul>
-
-<h3 id="Llaves_(_)">Llaves (<code>{ }</code>)</h3>
-
-<p>El <em>multiplicador llaves, </em>encierra a dos enteros A y B separados  por una coma, indica que la entidad <strong>debe aparecer al menos A veces y como mas B veces</strong></p>
-
-<pre class="syntaxbox"><code>bold smaller{1,3}</code></pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold smaller</code></li>
- <li><code>bold smaller smaller</code></li>
- <li><code>bold smaller smaller smaller</code></li>
-</ul>
-
-<p>Pero no:</p>
-
-<ul>
- <li><code>bold</code> porque <code>smaller</code> debe aparecer al menos una vez</li>
- <li><code>bold smaller smaller smaller smaller</code> porque <code>smaller</code> debe aparecer un máximo de tres veces.</li>
- <li><code>smaller bold</code> porque <code>bold</code> esta yuxtapuesto u debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
-</ul>
-
-<h3 id="Hash_()">Hash (<code>#</code>)</h3>
-
-<p>El <em>multiplicador hash</em> indica que la entidad puede repetirse <strong>una o mas veces </strong>(como con el multiplicador de suma) pero cada ocurrencia se <strong>separa por una coma</strong> ('<code>,</code>').</p>
-
-<pre class="syntaxbox"><code>bold smaller#</code></pre>
-
-<p>El ejemplo empareja con los siguientes valores:</p>
-
-<ul>
- <li><code>bold smaller</code></li>
- <li><code>bold smaller, smaller</code></li>
- <li><code>bold smaller, smaller, smaller</code> y así sucesivamente</li>
-</ul>
-
-<p>Pero no:</p>
-
-<ul>
- <li><code>bold</code> porque <code>smaller</code> debe aparecer al menos una vez</li>
- <li><code>bold smaller smaller smaller</code> porque las diferentes ocurrencias de <code>smaller</code> deben estar separadas por comas</li>
- <li><code>smaller</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
-</ul>
-
-<h2 id="Sumario">Sumario</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Símbolo</th>
-   <th scope="col">Nombre</th>
-   <th scope="col">Descripción</th>
-   <th scope="col">Ejemplo</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th colspan="4">Combinadores</th>
-  </tr>
-  <tr>
-   <td> </td>
-   <td>Yuxtaposición</td>
-   <td>Componentes obligatorios que deben aparecer en el mismo orden</td>
-   <td><code>solid &lt;length&gt;</code></td>
-  </tr>
-  <tr>
-   <td><code>&amp;&amp;</code></td>
-   <td>Doble ampersand</td>
-   <td>Componentes obligatorios pero que pueden aparecer en cualquier orden</td>
-   <td><code>length&gt; &amp;&amp; &lt;string&gt;</code></td>
-  </tr>
-  <tr>
-   <td><code>||</code></td>
-   <td>Barra doble</td>
-   <td>Al menos uno de los componentes debe estar presente, y pueden aparecer en cualquier orden</td>
-   <td><code>&lt;'border-image-outset'&gt; || &lt;'border-image-slice'&gt;</code></td>
-  </tr>
-  <tr>
-   <td><code>|</code></td>
-   <td>Barra simple</td>
-   <td>Exactamente uno de los componentes debe estar presente</td>
-   <td><code>smaller | small | normal | big | bigger</code></td>
-  </tr>
-  <tr>
-   <td><code>[ ]</code></td>
-   <td>Corchetes</td>
-   <td>Agrupa componentes para sobreescribir las reglas de precedencia</td>
-   <td><code>bold [ thin &amp;&amp; &lt;length&gt; ]</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Multiplicadores</th>
-  </tr>
-  <tr>
-   <td> </td>
-   <td>Sin multiplicador</td>
-   <td>Exactamente 1 vez</td>
-   <td><code>solid</code></td>
-  </tr>
-  <tr>
-   <td><code>*</code></td>
-   <td>Asterisco</td>
-   <td>0 or more times</td>
-   <td><code>bold smaller*</code></td>
-  </tr>
-  <tr>
-   <td><code>+</code></td>
-   <td>Suma</td>
-   <td>1 o mas veces</td>
-   <td><code>bold smaller+</code></td>
-  </tr>
-  <tr>
-   <td><code>?</code></td>
-   <td>Pregunta</td>
-   <td>0 o 1 vez (es <em>opcional)</em></td>
-   <td><code>bold smaller?</code></td>
-  </tr>
-  <tr>
-   <td><code>{A,B}</code></td>
-   <td>Llaves</td>
-   <td>Al menos <code>A</code> veces, como mas <code>B</code> veces</td>
-   <td><code>bold smaller{1,3}</code></td>
-  </tr>
-  <tr>
-   <td><code>#</code></td>
-   <td>Hash</td>
-   <td>1 o mas veces, pero cada ocurrencia separada por una coma ('<code>,</code>')</td>
-   <td><code>bold smaller#</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{ SpecName('CSS3 Values', '#value-defs', 'Value definition syntax') }}</td>
-   <td>{{ Spec2('CSS3 Values') }}</td>
-   <td>Desde {{ SpecName('CSS2.1', 'about.html#value-defs', 'Value definition syntax') }}, añade el multiplicador hash</td>
-  </tr>
-  <tr>
-   <td>{{ SpecName('CSS2.1', 'about.html#value-defs', 'Value definition syntax') }}</td>
-   <td>{{ Spec2('CSS2.1') }}</td>
-   <td>Desde {{ SpecName('CSS1', '#notation-for-property-values', 'Value definition syntax') }}, añade el combinador doble ampersand</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS1', '#notation-for-property-values', 'Value definition syntax') }}</td>
-   <td>{{ Spec2('CSS1') }}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{ CSS_key_concepts() }}</li>
-</ul>
diff --git a/files/es/web/css/specificity/index.html b/files/es/web/css/specificity/index.html
new file mode 100644
index 0000000000..b04e9b4ae0
--- /dev/null
+++ b/files/es/web/css/specificity/index.html
@@ -0,0 +1,240 @@
+---
+title: Especificidad
+slug: Web/CSS/Specificity
+tags:
+  - CSS
+  - Ejemplo
+  - Guía
+  - Principiante
+  - Web
+translation_of: Web/CSS/Specificity
+original_slug: Web/CSS/Especificidad
+---
+<p>La <strong>especificidad</strong><span> es la manera mediante la cual los navegadores deciden qué valores de una propiedad CSS son más relevantes para un elemento y, por lo tanto, serán aplicados. La especificidad está basada en las reglas de coincidencia que están compuestas por diferentes tipos de </span><a href="https://developer.mozilla.org/es/CSS/CSS_Reference#Selectors">selectores CSS</a><span>.</span></p>
+
+<h2 id="¿Cómo_se_calcula">¿Cómo se calcula?</h2>
+
+<p>La especificidad es un peso (importancia o valor) que se le asigna a una declaración CSS dada, determinada por el número correspondiente de cada <a href="https://developer.mozilla.org/es/docs/Web/CSS/Especificidad#Tipos_de_selectores">tipo de selector</a>. Cuando varias declaraciones tienen igual especificidad, se aplicará al elemento la última declaración encontrada en el CSS. La especificidad solo se aplica cuando el mismo elemento es objetivo de múltiples declaraciones. Según las reglas de CSS, en caso de que un elemento sea objeto de una <a href="https://developer.mozilla.org/es/docs/Web/CSS/Especificidad#Elementos_objetivos_de_una_declaración_directa_vs_estilos_heredados">declaración directa</a>, esta siempre tendrá preferencia sobre las reglas heredadas de su ancestro.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> La <u>proximidad de elementos</u> en el árbol del documento no tiene efecto en la especificidad.</p>
+</div>
+
+<h3 id="Tipos_de_selectores">Tipos de selectores</h3>
+
+<p>La siguiente lista de tipos de selectores incrementa en función de la especificidad:</p>
+
+<ol start="0">
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/Type_selectors">Selectores de tipo</a> (p.e., <code>h1</code>) y pseudo-elementos (p.e., <code>::before</code>).</li>
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/Class_selectors">Selectores de clase</a> (p.e., <code>.example</code>), selectores de atributos (p.e., <code>[type="radio"]</code>) y pseudo-clases (p.e., <code>:hover</code>).</li>
+ <li><a href="https://wiki.developer.mozilla.org/es/docs/Web/CSS/ID_selectors">Selectores de ID</a> (p.e., <code>#example</code>).</li>
+</ol>
+
+<p>El selector universal ({{CSSxRef("Universal_selectors", "*")}}), los combinadores ({{CSSxRef("Adjacent_sibling_combinator", "+")}}, {{CSSxRef("Child_combinator", "&gt;")}}, {{CSSxRef("General_sibling_combinator", "~")}}, <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator">'<code> </code>'</a>, {{CSSxRef("Column_combinator", "||")}}) y la pseudo-clase de negación ({{CSSxRef(":not", ":not()")}}) no tienen efecto sobre la especificidad. (Sin embargo, los selectores declarados <em>dentro de </em><code>:not()</code> si lo tienen.)</p>
+
+<p>Para más información, visita <a href="https://wiki.developer.mozilla.org/es/docs/Learn/CSS/Building_blocks/Cascada_y_herencia#Especificidad">"Especificidad" en "Cascada y herencia"</a>, también puedes visitar: <a href="https://specifishity.com/">https://specifishity.com</a></p>
+
+<p>Los estilos <em>inline</em> añadidos a un elemento (p.e., <code>style="font-weight:bold"</code>) siempre sobrescriben a cualquier estilo escrito en hojas de estilo externas, por lo que se puede decir que tienen la mayor especificidad.</p>
+
+<h3 id="La_excepción_!important">La excepción !important</h3>
+
+<p>Cuando se emplea <code>important</code> en una declaración de estilo, esta declaración sobrescribe a cualquier otra. Aunque técnicamente <code><font face="Courier New">!important</font></code>  no tiene nada que ver con especificidad, interactúa directamente con esta. Sin embargo, el uso de <code><font face="Courier New">!important</font></code> es una <strong>mala práctica</strong> y debería evitarse porque hace que el código sea más difícil de depurar al romper la <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Cascade">cascada (artículo en inglés)</a><strong><em> </em></strong>natural de las hojas de estilo. Cuando dos declaraciones en conflicto con el <code><font face="Courier New">!important</font></code> son aplicadas al mismo elemento, se aplicará la declaración con mayor especificidad. </p>
+
+<p><strong>Algunas reglas de oro:</strong></p>
+
+<ul>
+ <li>Busca <strong>siempre</strong> una manera de emplear la especificidad antes de considerar el uso de <code><font face="Courier New">!important</font></code><font face="Courier New">.</font></li>
+ <li>Usa <code><font face="Courier New">!important</font></code> <strong>solo </strong>en declaraciones específicas de CSS que sobrescriban CSS externo (de librerías externas como Bootstrap o normalize.css).</li>
+ <li><strong>Nunca</strong> uses <code>!important</code> cuando estés intentando escribir un plugin/mashup.</li>
+ <li><strong>Nunca</strong> uses <code>!important</code> en todo el código CSS.</li>
+</ul>
+
+<p><strong>En lugar de usar <code>!important</code>, considera:</strong></p>
+
+<ol>
+ <li>Hacer un mejor uso de las propiedades en cascada de CSS.</li>
+ <li>
+  <p>Usar reglas más específicas. Indicando uno o más elementos antes del elemento que estás seleccionando, la regla se vuelve más específica y gana mayor prioridad:</p>
+
+  <pre class="brush: html notranslate">&lt;div id="test"&gt;
+  &lt;span&gt;Text&lt;/span&gt;
+&lt;/div&gt;
+</pre>
+
+  <pre class="brush: css notranslate">div#test span { color: green; }
+div span { color: blue; }
+span { color: red; }</pre>
+ </li>
+ <li>Como un caso especial sin sentido para (2), duplicar selectores simples para aumentar la especificidad cuando no tiene nada más que especificar
+  <pre class="notranslate">#myId#myId span { color: yellow; }
+.myClass.myClass span { color: orange; }</pre>
+ </li>
+</ol>
+
+<h4 id="Cómo_se_debería_usar_!important"><strong>Cómo se debería usar !important:</strong></h4>
+
+<h5 id="A_Sobrescribiendo_los_estilos_en_linea">A) Sobrescribiendo los estilos en linea</h5>
+
+<ol>
+ <li>Tienes un archivo CSS que establece aspectos visuales de tu sitio de manera global.</li>
+ <li>Tú (u otros) usan estilos inline en los propios elementos. Esto es considerado como una muy mala práctica. </li>
+</ol>
+
+<p><span>En este caso, puedes establecer ciertos estilos en tu archivo CSS global como importantes, superando así los estilos en línea configurados directamente en los elementos. </span></p>
+
+<p>Ejemplo del mundo real: Algunos <strong>plugins jQuery</strong> muy mal escritos que usan estilos inline.</p>
+
+<p>B) Otro escenario:</p>
+
+<pre class="default prettyprint prettyprinted notranslate"><code><span class="com">#someElement p {</span><span class="pln">
+    color</span><span class="pun">:</span><span class="pln"> blue</span><span class="pun">;</span><span class="pln">
+</span><span class="pun">}</span><span class="pln">
+
+p</span><span class="pun">.</span><span class="pln">awesome </span><span class="pun">{</span><span class="pln">
+    color</span><span class="pun">:</span><span class="pln"> red</span><span class="pun">;</span><span class="pln">
+</span><span class="pun">}</span></code></pre>
+
+<p>¿Cómo haces que los párrafos <code>awesome</code> se vuelvan siempre rojos, incluso los que se encuentren dentro de <code>#someElement</code>? Sin <code>!important</code>, la primera regla tendrá más especificidad y ganará a la segunda.</p>
+
+<h4 id="Cómo_sobrescribir_!important"><strong>Cómo sobrescribir !important</strong></h4>
+
+<p>A) Simplemente añade otra regla CSS con <code>!important</code> y, o bien da al selector una especificidad mayor (añadiendo una etiqueta, id o clase al selector), o añadiendo una regla CSS con el mismo selector en un punto posterior al ya existente. Esto funciona porque en caso de empate en especificidad, la última regla prevalece.</p>
+
+<p>Algunos ejemplos con una gran especificidad:</p>
+
+<pre class="default prettyprint prettyprinted notranslate"><code><span class="pln">table td    </span><span class="pun">{</span><span class="pln">height</span><span class="pun">:</span><span class="pln"> </span><span class="lit">50px</span><span class="pln"> </span><span class="pun">!</span><span class="pln">important</span><span class="pun">;}</span><span class="pln">
+</span><span class="pun">.</span><span class="pln">myTable td </span><span class="pun">{</span><span class="pln">height</span><span class="pun">:</span><span class="pln"> </span><span class="lit">50px</span><span class="pln"> </span><span class="pun">!</span><span class="pln">important</span><span class="pun">;}</span><span class="pln">
+</span><span class="com">#myTable td {height: 50px !important;}</span></code></pre>
+
+<p>B) O añade el mismo selector después de uno existente:</p>
+
+<pre class="default prettyprint prettyprinted notranslate"><code><span class="pln">td </span><span class="pun">{</span><span class="pln">height</span><span class="pun">:</span><span class="pln"> </span><span class="lit">50px</span><span class="pln"> </span><span class="pun">!</span><span class="pln">important</span><span class="pun">;}</span></code></pre>
+
+<p>C) O reescribe la regla original para evitar el uso de <code>!important</code>.</p>
+
+<p><strong>Para más información, visita (en inglés): </strong></p>
+
+<p><a href="http://stackoverflow.com/questions/3706819/what-are-the-implications-of-using-important-in-css">http://stackoverflow.com/questions/3706819/what-are-the-implications-of-using-important-in-css</a></p>
+
+<p><a href="http://stackoverflow.com/questions/9245353/what-does-important-in-css-mean">http://stackoverflow.com/questions/9245353/what-does-important-in-css-mean</a></p>
+
+<p><a href="http://stackoverflow.com/questions/5701149/when-to-use-important-property-in-css">http://stackoverflow.com/questions/5701149/when-to-use-important-property-in-css</a></p>
+
+<p><a href="http://stackoverflow.com/questions/11178673/how-to-override-important">http://stackoverflow.com/questions/11178673/how-to-override-important</a></p>
+
+<p><a href="http://stackoverflow.com/questions/2042497/when-to-use-important-to-save-the-day-when-working-with-css">http://stackoverflow.com/questions/2042497/when-to-use-important-to-save-the-day-when-working-with-css</a></p>
+
+<h3 id="La_excepción_not">La excepción <code>:not</code></h3>
+
+<p>La pseudo-clase negación :<code>not</code> <em>no</em> es considerada una pseudo-clase para el cálculo de la especificidad. Pero los selectores colocados dentre de ella, si cuentan como selectores normales a la hora de determinar el valor de los <a href="https://developer.mozilla.org/es/docs/Web/CSS/Especificidad#Tipos_de_selectores">tipos de selectores</a>. </p>
+
+<p>Aquí tienes un pedazo de CSS:</p>
+
+<pre class="brush: css notranslate">div.outer p {
+  color:orange;
+}
+div:not(.outer) p {
+  color: lime;
+}
+</pre>
+
+<p>cuando se usa con el siguiente HTML:</p>
+
+<pre class="brush: html notranslate">&lt;div class="outer"&gt;
+  &lt;p&gt;Esto está en el outer div.&lt;/p&gt;
+  &lt;div class="inner"&gt;
+    &lt;p&gt;Este texto está en el inner div.&lt;/p&gt;
+  &lt;/div&gt;
+&lt;/div&gt;
+</pre>
+
+<p>Debería aparecer en pantalla como:</p>
+
+<p><span style="color: orange;">Esto está en el outer div<br>
+ <br>
+ <span><span style="color: lime;">Este texto está en el inner div</span></span></span></p>
+
+<h3 id="Especificidad_basada_en_la_forma">Especificidad basada en la forma</h3>
+
+<p>La especificidad está basada en la forma de un selector. En el siguiente caso, el selector <code>*[id="foo"]</code> cuenta como un atributo selector para la determinación de la especificidad de un selector, incluso cuando se selecciona un ID.</p>
+
+<p>Las siguientes declaraciones de estilo:</p>
+
+<pre class="brush: css notranslate">*#foo {
+  color: green;
+}
+*[id="foo"] {
+  color: purple;
+}
+</pre>
+
+<p>cuando se usan con este marcador:</p>
+
+<pre class="brush: html notranslate">&lt;p id="foo"&gt;Soy un texto de ejemplo.&lt;/p&gt;
+</pre>
+
+<p>Se acabarán viendo así:</p>
+
+<p style="color: green;">Soy un texto de ejemplo</p>
+
+<p>Debido a que coincide con el mismo elemento, pero el selector ID tiene una mayor especificidad.</p>
+
+<h3 id="Ignorancia_de_proximidad_en_el_árbol"><a id="tree-proximity-ignorance" name="tree-proximity-ignorance">Ignora</a>ncia de proximidad en el árbol</h3>
+
+<p>La proximidad de un elemento con otros a los que se hace referencia en un selector determinado, no tiene impacto en la especificidad. La siguiente declaración de estilo:</p>
+
+<pre class="brush: css notranslate">body h1 {
+  color: green;
+}
+html h1 {
+  color: purple;
+}
+</pre>
+
+<p>Con el siguiente HTML:</p>
+
+<pre class="brush: html notranslate">&lt;html&gt;
+&lt;body&gt;
+  &lt;h1&gt;¡Aquí va un título!&lt;/h1&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>Se mostrará como:</p>
+
+<h1 id="¡Aquí_va_un_título!" style="color: purple;">¡Aquí va un título!</h1>
+
+<p>Porque las dos declaraciones tienen un resultado de tipo de selector igual, pero el selector <code>html h1 </code>se ha declarado después.</p>
+
+<h3 id="Declaración_directa_vs_estilos_heredados"><a id="directly-targeted-elements" name="directly-targeted-elements">Declaración directa vs estilos heredados</a></h3>
+
+<p>Los estilos para elementos objetivo de una declaración directa siempre tienen preferencia sobre los estilos heredados, sin importar la especificidad de la regla heredada.</p>
+
+<pre class="brush: css notranslate" style="font-size: 14px;">#parent {
+  color: green;
+}
+h1 {
+  color: purple;
+}</pre>
+
+<p>Con el siguiente HTML:</p>
+
+<pre class="brush: html notranslate" style="font-size: 14px;">&lt;html&gt;
+&lt;body id="parent"&gt;
+  &lt;h1&gt;¡Aquí va un título!&lt;/h1&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>Se verá así:</p>
+
+<h1 id="¡Aquí_va_un_título!_2" style="color: purple;">¡Aquí va un título!</h1>
+
+<p>Porque el selector <code>h1</code> selecciona el objetivo de manera específica, pero el color verde simplemente es heredad de su padre.</p>
+
+<h2 id="Consulta_también_en_inglés">Consulta también (en inglés)</h2>
+
+<ul>
+ <li>Specificity Calculator: An interactive website to test and understand your own CSS rules - <a href="https://specificity.keegan.st/">https://specificity.keegan.st/</a></li>
+ <li>CSS3 Selectors Specificity - <a class="external" href="http://www.w3.org/TR/selectors/#specificity" rel="freelink">http://www.w3.org/TR/selectors/#specificity</a></li>
+ <li>{{ CSS_key_concepts() }}</li>
+</ul>
diff --git a/files/es/web/css/texto_css/index.html b/files/es/web/css/texto_css/index.html
deleted file mode 100644
index f0c3c934b6..0000000000
--- a/files/es/web/css/texto_css/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: Texto CSS
-slug: Web/CSS/Texto_CSS
-tags:
-  - CSS
-  - Texto CSS
-  - Vista general
-translation_of: Web/CSS/CSS_Text
----
-<div>{{CSSRef}}</div>
-
-<p><strong>Texto CSS </strong> es el módulo de CSS que define cómo realizar la manipulación de elementos de texto como los saltos de línea, la justificación, la alineación, la gestión de espacios en blanco y las transformaciones de texto.</p>
-
-<h2 id="Referencia">Referencia</h2>
-
-<h3 id="Propiedades">Propiedades</h3>
-
-<div class="index">
-<ul>
- <li>{{cssxref("hyphens")}}</li>
- <li>{{cssxref("letter-spacing")}}</li>
- <li>{{cssxref("line-break")}}</li>
- <li>{{cssxref("overflow-wrap")}}</li>
- <li>{{cssxref("tab-size")}}</li>
- <li>{{cssxref("text-align")}}</li>
- <li>{{cssxref("text-align-last")}}</li>
- <li>{{cssxref("text-indent")}}</li>
- <li>{{cssxref("text-size-adjust")}}</li>
- <li>{{cssxref("text-transform")}}</li>
- <li>{{cssxref("white-space")}}</li>
- <li>{{cssxref("word-break")}}</li>
- <li>{{cssxref("word-spacing")}}</li>
- <li>{{cssxref("word-wrap")}}</li>
-</ul>
-</div>
-
-<h2 id="Guías">Guías</h2>
-
-<p><em>None.</em></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('CSS Logical Properties')}}</td>
-   <td>{{Spec2('CSS Logical Properties')}}</td>
-   <td>Actualiza varias propiedades para que sean independientes de la direccionalidad del texto.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS3 Text')}}</td>
-   <td>{{Spec2('CSS3 Text')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS2.1', 'text.html')}}</td>
-   <td>{{Spec2('CSS2.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CSS1')}}</td>
-   <td>{{Spec2('CSS1')}}</td>
-   <td>Definición Inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop(1.0)}}</td>
-   <td>3</td>
-   <td>3.5</td>
-   <td>1.0 (85)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>1.0 (85)</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/css/tools/cubic_bezier_generator/index.html b/files/es/web/css/tools/cubic_bezier_generator/index.html
new file mode 100644
index 0000000000..0cf0780356
--- /dev/null
+++ b/files/es/web/css/tools/cubic_bezier_generator/index.html
@@ -0,0 +1,321 @@
+---
+title: Generador de curvas de bézier
+slug: Web/CSS/Tools/Cubic_Bezier_Generator
+translation_of: Web/CSS/Tools/Cubic_Bezier_Generator
+original_slug: Web/CSS/Herramientas/Cubic_Bezier_Generator
+---
+<div id="Tool">
+<div style="display: none;">
+<pre class="brush:html">&lt;html&gt;
+    &lt;canvas id="bezier" width="336" height="336"&gt;
+    &lt;/canvas&gt;
+    &lt;form&gt;
+       &lt;label for="x1"&gt;x1 = &lt;/label&gt;&lt;input onchange="updateCanvas();" type="text" maxlength=6 id="x1" value="0.79" class='field'&gt;
+       &lt;label for="y1"&gt;y1 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y1" value="0.33" class='field'&gt;
+       &lt;label for="x2"&gt;x2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="x2" value="0.14" class='field'&gt;
+       &lt;label for="y2"&gt;y2 = &lt;/label&gt;&lt;input onchange="updateCanvas();return true;"  type="text" maxlength=6 id="y2" value="0.53" class='field'&gt;
+       &lt;br&gt;
+       &lt;output id="output"&gt;Log&lt;/output&gt;
+    &lt;/form&gt;
+&lt;/html&gt;
+     </pre>
+
+<pre class="brush:css">.field {
+    width: 40px;
+}
+     </pre>
+
+<pre class="brush:js">function updateCanvas() {
+
+    var x1 = document.getElementById('x1').value;
+    var y1 = document.getElementById('y1').value;
+    var x2 = document.getElementById('x2').value;
+    var y2 = document.getElementById('y2').value;
+
+    drawBezierCurve(x1, y1, x2, y2);
+}
+
+const radius = 4;
+// Place needed to draw the rulers
+const rulers = 30.5;
+const margin = 10.5;
+const basic_scale_size = 5; // Size of 0.1 tick on the rulers
+var scaling; //LIMITATION: scaling is computed once: if canvas.height/canvas.width change it won't be recalculated
+var dragSM = 0; // Drag state machine: 0 = nodrag, others = object being dragged
+
+function initCanvas() {
+    // get the canvas element using the DOM
+    var canvas = document.getElementById('bezier');
+
+    // Make sure we don't execute when canvas isn't supported
+    if (canvas.getContext) {
+        // use getContext to use the canvas for drawing
+        var ctx = canvas.getContext('2d');
+
+        scaling = Math.min(canvas.height - rulers - margin, canvas.width - rulers - margin);
+
+        canvas.onmousedown = mouseDown;
+        canvas.onmouseup = mouseUp;
+    } else {
+        alert('You need Safari or Firefox 1.5+ to see this demo.');
+    }
+}
+
+function cX(x) {
+    return x * scaling + rulers;
+}
+
+function reverseX(x) {
+    return (x - rulers) / scaling;
+}
+
+function lX(x) {
+    //Used when drawing vertical lines to prevent subpixel blur
+    var result = cX(x);
+    return Math.round(result) == result ? result + 0.5 : result;
+}
+
+function cY(y) {
+
+    return (1 - y) * scaling + margin;
+}
+
+function reverseY(y) {
+    return (margin - y) / scaling + 1;
+}
+
+function lY(y) {
+    // Used when drawing horizontal lines to prevent subpixel blur
+    var result = cY(y);
+    return Math.round(result) == result ? result + 0.5 : result;
+}
+
+function drawBezierCurve(x1, y1, x2, y2) {
+
+    // get the canvas element using the DOM
+    var canvas = document.getElementById('bezier');
+
+    // Make sure we don't execute when canvas isn't supported
+    if (canvas.getContext) {
+
+        // use getContext to use the canvas for drawing
+        var ctx = canvas.getContext('2d');
+
+
+
+        // Clear canvas
+        ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+        // Draw the rulers
+        ctx.beginPath();
+        ctx.strokeStyle = "black";
+
+        // Draw the Y axis
+        ctx.moveTo(cX(0), cY(0));
+        ctx.lineTo(cX(1), cY(0));
+        ctx.textAlign = "right";
+
+        for (var i = 0.1; i &lt;= 1; i = i + 0.1) {
+            ctx.moveTo(-basic_scale_size + cX(0), lY(i));
+            if ((i == 0.5) || (i &gt; 0.9)) {
+                ctx.moveTo(-2 * basic_scale_size + cX(0), lY(i));
+                ctx.fillText(Math.round(i * 10) / 10, -3 * basic_scale_size + cX(0), cY(i) + 4);
+                // Limitation the constant 4 should be font size dependant
+            }
+            ctx.lineTo(cX(0), lY(i));
+        }
+        ctx.stroke();
+        ctx.closePath();
+        ctx.beginPath();
+
+        // Draw the Y axis label
+        ctx.save();
+        ctx.rotate(-Math.PI / 2);
+        ctx.textAlign = "left";
+        ctx.fillText("Output (Value Ratio)", -cY(0), -3 * basic_scale_size + cX(0));
+        ctx.restore();
+
+        // Draw the X axis
+        ctx.moveTo(cX(0), cY(0));
+        ctx.lineTo(cX(0), cY(1));
+        ctx.textAlign = "center";
+        for (i = 0.1; i &lt;= 1; i = i + 0.1) {
+            ctx.moveTo(lX(i), basic_scale_size + cY(0));
+            if ((i == 0.5) || (i &gt; 0.9)) {
+                ctx.moveTo(lX(i), 2 * basic_scale_size + cY(0));
+                ctx.fillText(Math.round(i * 10) / 10, cX(i), 4 * basic_scale_size + cY(0));
+                // Limitation the constant 4 should be dependant of the font size
+            }
+            ctx.lineTo(lX(i), cY(0));
+        }
+
+        // Draw the X axis label
+        ctx.textAlign = "left";
+        ctx.fillText("Input (Time Duration Ratio)", cX(0), 4 * basic_scale_size + cY(0));
+        // Limitation the constant 4 should be dependant of the font size
+        ctx.stroke();
+        ctx.closePath();
+
+        // Draw the Bézier Curve
+        ctx.beginPath();
+        ctx.moveTo(cX(0), cY(0));
+        ctx.strokeStyle = 'blue';
+        ctx.bezierCurveTo(cX(x1), cY(y1), cX(x2), cY(y2), cX(1), cY(1));
+        ctx.stroke();
+        ctx.closePath();
+
+
+
+        // Draw the P2 point (with a line to P0)
+        ctx.beginPath();
+        ctx.strokeStyle = 'red';
+        ctx.moveTo(cX(x1), cY(y1));
+        ctx.lineTo(cX(0), cY(0));
+        ctx.stroke();
+        ctx.closePath();
+        ctx.beginPath();
+        ctx.moveTo(cX(x1), cY(y1));
+        ctx.arc(cX(x1), cY(y1), radius, 0, 2 * Math.PI);
+        ctx.stroke();
+        ctx.fillStyle = 'white';
+        ctx.fill();
+        ctx.closePath();
+
+
+
+        // Draw the P3 point (with a line to P1)
+        ctx.beginPath();
+        ctx.strokeStyle = 'red';
+        ctx.moveTo(cX(x2), cY(y2));
+        ctx.lineTo(cX(1), cY(1));
+        ctx.stroke();
+        ctx.closePath();
+
+        ctx.beginPath();
+        ctx.moveTo(cX(x2), cY(y2));
+        ctx.arc(cX(x2), cY(y2), radius, 0, 2 * Math.PI);
+        ctx.stroke();
+        ctx.fill();
+        ctx.closePath();
+
+        // Draw the P1(1,1) point (with dashed hints)
+        ctx.beginPath();
+        ctx.moveTo(cX(1), cY(1));
+        ctx.strokeStyle = 'lightgrey';
+        ctx.lineTo(cX(0), cY(1));
+        ctx.moveTo(cX(1), cY(1));
+        ctx.lineTo(cX(1), cY(0));
+        ctx.stroke();
+        ctx.closePath();
+
+        ctx.beginPath();
+        ctx.strokeStyle = "black";
+        ctx.fillStyle = "black";
+        ctx.arc(cX(1), cY(1), radius, 0, 2 * Math.PI);
+        ctx.fill();
+        ctx.stroke();
+        ctx.closePath();
+
+
+        // Draw the P0(0,0) point
+        ctx.beginPath();
+        ctx.arc(cX(0), cY(0), radius, 0, 2 * Math.PI);
+        ctx.fill();
+        ctx.stroke();
+        ctx.closePath();
+
+
+    } else {
+        alert('You need Safari or Firefox 1.5+ to see this demo.');
+    }
+}
+
+function mouseDown(e) {
+
+    var canvas = document.getElementById('bezier');
+
+    var x1 = cX(document.getElementById('x1').value);
+    var y1 = cY(document.getElementById('y1').value);
+
+    var x = e.pageX - canvas.offsetLeft;
+    var y = e.pageY - canvas.offsetTop;
+
+    var output = document.getElementById('output');
+    output.value = "(" + x + "," + y + ") should be (" + x1 + "," + y1 + ")";
+
+
+    if ((x1 + radius &gt;= x) &amp;&amp; (x1 - radius &lt;= x) &amp;&amp; (y1 + radius &gt;= y) &amp;&amp; (y1 - radius &lt;= y)) {
+        var output = document.getElementById('output');
+        output.value = "P1!";
+        dragSM = 1;
+    }
+
+    var x2 = cX(document.getElementById('x2').value);
+    var y2 = cY(document.getElementById('y2').value);
+
+    if ((x2 + radius &gt;= x) &amp;&amp; (x2 - radius &lt;= x) &amp;&amp; (y2 + radius &gt;= y) &amp;&amp; (y2 - radius &lt;= y)) {
+        var output = document.getElementById('output');
+        output.value = "P2!";
+        dragSM = 2;
+    }
+
+    // If we are starting a drag
+    if (dragSM != 0) {
+        canvas.onmousemove = mouseMove;
+    }
+}
+
+function mouseUp(e) {
+
+    var output = document.getElementById('output');
+    output.value = "Mouse up!";
+    dragSM = 0;
+    canvas.onmousemove = null;
+}
+
+function mouseMove(e) {
+    if (dragSM != 0) {
+        var canvas = document.getElementById('bezier');
+
+        var x = e.pageX - canvas.offsetLeft;
+        var y = e.pageY - canvas.offsetTop;
+
+        var output = document.getElementById('output');
+        output.value = "Drag!";
+
+        if (dragSM == 1) {
+            var x1 = document.getElementById('x1');
+            var y1 = document.getElementById('y1');
+            x1.value = reverseX(x);
+            x1.value = Math.round(x1.value * 10000) / 10000;
+            y1.value = reverseY(y);
+            y1.value = Math.round(y1.value * 10000) / 10000;
+            if (x1.value &lt; 0) { x1.value = 0; }
+            if (x1.value &gt; 1) { x1.value = 1; }
+        } else if (dragSM == 2) {
+            var x2 = document.getElementById('x2');
+            var y2 = document.getElementById('y2');
+            x2.value = reverseX(x);
+            x2.value = Math.round(x2.value * 10000) / 10000;
+            y2.value = reverseY(y);
+            y2.value = Math.round(y2.value * 10000) / 10000;
+            if (x2.value &lt; 0) { x2.value = 0; }
+            if (x2.value &gt; 1) { x2.value = 1; }
+        }
+        updateCanvas();
+    }
+}
+
+initCanvas();
+updateCanvas();
+     </pre>
+</div>
+
+<p>{{draft}}</p>
+
+<p>Esta es una herramienta de ejemplo que te permitirá editar y ver de manera gráfica una curva de Bézier. Esta no es una herramienta realmente útil, pero ¡lo será!</p>
+
+<p>{{EmbedLiveSample("Tool", 1000, 2000)}}</p>
+</div>
+
+<p> </p>
diff --git a/files/es/web/css/tools/index.html b/files/es/web/css/tools/index.html
new file mode 100644
index 0000000000..3ea9e20a3f
--- /dev/null
+++ b/files/es/web/css/tools/index.html
@@ -0,0 +1,29 @@
+---
+title: Herramientas
+slug: Web/CSS/Tools
+tags:
+  - CSS
+translation_of: Web/CSS/Tools
+original_slug: Web/CSS/Herramientas
+---
+<div> </div>
+
+<p><span id="result_box" lang="es"><span>CSS</span> <span>ofrece una serie de</span> <span>características poderosas</span> <span>que puede ser</span> <span>difíciles de usar</span><span>,</span> <span>o tener un gran</span> <span>número de</span> <span>parámetros, por lo</span> <span>que es</span> <span>muy útil</span> <span>visualizarlos</span> <span>mientras se trabaja en</span> <span>ellos.</span> <span>Esta página</span> <span>ofrece</span> <span>enlaces a</span> <span>una serie de herramientas</span> <span>que</span> <span>le ayudarán a construir sus estilos usando estas caracteristicas</span><span>.</span></span></p>
+
+<p>{{LandingPageListSubpages}}</p>
+
+<h2 id="Otras_herramientas">Otras herramientas</h2>
+
+<ul>
+ <li>
+  <h4 id="Animación_CSS_-_Stylie">Animación CSS - <a href="http://jeremyckahn.github.io/stylie/">Stylie</a></h4>
+ </li>
+ <li><span id="result_box" lang="es"><span>Para</span> <span>comprobar la información de</span> <span>la pantalla del dispositivo</span></span> (helpful in {{Glossary("responsive web design")}}) - <a href="http://mydevice.io">mydevice.io</a></li>
+ <li>Menus CSS- <a href="http://cssmenumaker.com/">cssmenumaker.com</a></li>
+</ul>
+
+<h2 id="Temas_relacionados">Temas relacionados</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/CSS" title="/en-US/docs/Web/CSS">CSS</a></li>
+</ul>
diff --git a/files/es/web/css/transiciones_de_css/index.html b/files/es/web/css/transiciones_de_css/index.html
deleted file mode 100644
index 62142638c4..0000000000
--- a/files/es/web/css/transiciones_de_css/index.html
+++ /dev/null
@@ -1,700 +0,0 @@
----
-title: Transiciones de CSS
-slug: Web/CSS/Transiciones_de_CSS
-tags:
-  - CSS
-  - Gecko
-  - Transiciones de CSS
-translation_of: Web/CSS/CSS_Transitions/Using_CSS_transitions
----
-<p>{{ SeeCompatTable() }}</p>
-
-<p>Las transiciones CSS, parte del borrador de la especificación CSS3, proporcionan una forma de animar los cambios de las propiedades CSS, en lugar de que los cambios surtan efecto de manera instantánea. Por ejemplo, si cambias el color de un elemento de blanco a negro, normalmente el cambio es instantáneo. Al habilitar las transiciones CSS, el cambio sucede en un intervalo de tiempo que puedes especificar, siguiendo una curva de aceleración que puedes personalizar.</p>
-
-<div class="note"><strong>Nota:</strong> como la especificación de las transiciones CSS todavía se encuentra en fase de borrador, a todas las propiedades asociadas con ellas se les añade el prefijo "-moz-" para usarse en Gecko. Para la compatibilidad con WebKit, se aconseja usar también el prefijo "-webkit-" y para la compatibilidad con Opera, el prefijo "-o-". Es decir, por ejemplo,  la propiedad de transición se especificaría como <code>-moz-transition</code>, <code>-webkit-transition </code>y <code>-o-transition</code>.</div>
-
-<h2 id="Las_propiedades_de_transición_CSS">Las propiedades de transición CSS</h2>
-
-<p>Las transiciones CSS se controlan mediante la propiedad abreviada {{ cssxref("transition") }}. Es preferible utilizar este método porque de esta forma se evita que la longitud de la lista de parámetros sea diferente, lo que puede dar lugar a tener que emplear un tiempo considerablemente largo en depurar el código CSS.</p>
-
-<p>Puedes controlar los componentes individuales de la transición usando las siguientes subpropiedades:</p>
-
-<dl>
- <dt>{{ cssxref("transition-property") }}</dt>
- <dd>Especifica el nombre o nombres de las propiedades CSS a las que deberían aplicarse las transiciones. Sólo las propiedades que se enumeran aquí son animadas durante las transiciones; los cambios en el resto de las propiedades suceden de manera instantánea como siempre.</dd>
- <dt>{{ cssxref("transition-duration") }}</dt>
- <dd>Especifica la duración en la que sucederán las transiciones. Puedes especificar una única duración que se aplique a todas las propiedades durante la transición o valores múltiples que permitan a cada propiedad de transición un período de tiempo diferente.</dd>
- <dt>{{ cssxref("transition-timing-function") }}</dt>
- <dd>Especifica la curva cúbica bézier que se usa para definir cómo se computan los valores intermedios para las propiedades.</dd>
- <dt>{{ cssxref("transition-delay") }}</dt>
- <dd>Define el tiempo de espera entre el momento en que se cambia una propiedad y el inicio de la transición.</dd>
-</dl>
-
-<h2 id="Detectar_la_finalización_de_una_transición">Detectar la finalización de una transición</h2>
-
-<p>Hay un único acontecimiento que se desencadena cuando se completan las transiciones. En Firefox, el evento es <code>transitionend</code>, en Opera, <code>OTransitionEnd</code> y en WebKit es <code>webkitTransitionEnd</code>. Consulta la tabla de compatibilidades al final de la página si deseas más información. El evento <code>transitionend</code> ofrece dos propiedades:</p>
-
-<dl>
- <dt><code>propertyName</code></dt>
- <dd>Una cadena que indica el nombre de la propiedad CSS cuya transición se completó.</dd>
- <dt><code>elapsedTime</code></dt>
- <dd>Un float que indica el número de segundos que la transición se había estado ejecutando en el momento en que el acontecimiento se desencadenó. Este valor no está afectado por el valor de {{ cssxref("transition-delay") }}.</dd>
-</dl>
-
-<p>Como es habitual, puedes usar el método {{ domxref("element.addEventListener()") }} para monitorizar este acontecimiento:</p>
-
-<pre>el.addEventListener("transitionend", updateTransition, true);
-</pre>
-
-<div class="note"><strong>Nota</strong>: el evento "transitionend" no se dispara si la transición se anula debido a que el valor de la propiedad de animación es modificado antes de que la transición se complete.</div>
-
-<h2 id="Propiedades_que_pueden_ser_animadas">Propiedades que pueden ser animadas</h2>
-
-<p>Las transiciones y las animaciones CSS pueden usarse para animar las siguientes propiedades.</p>
-
-<div class="note"><strong>Nota</strong>: el conjunto de propiedades que puede animarse está sujeto a cambios, por lo tanto se recomienda evitar incluir cualquier propiedad en la lista que no anime porque en un futuro podría provocar resultados inesperados.</div>
-
-
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Propiedad</td>
-   <td class="header">Tipo de valor</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("background-color") }}</td>
-   <td>{{cssxref("&lt;color&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("background-image") }}</td>
-   <td>solo degradado; no está implementado en Firefox (see {{ bug(536540) }})</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("background-position") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("background-size") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("border-color") }} (including sub-properties)</td>
-   <td>{{cssxref("&lt;color&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("border-radius") }} (including sub-properties)</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("border-width") }} (including sub-properties)</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("border-spacing") }}</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("bottom") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-box-flex") }}</td>
-   <td>número</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("box-shadow") }}</td>
-   <td>sombra</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("color") }}</td>
-   <td>{{cssxref("&lt;color&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-column-count") }}</td>
-   <td>número</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-column-gap") }}</td>
-   <td>{{cssxref("&lt;length&gt;")}}, palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-column-rule-color") }}</td>
-   <td>{{cssxref("&lt;color&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-column-rule-width") }}</td>
-   <td>{{cssxref("&lt;length&gt;")}}, palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-column-width") }}</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("clip") }}</td>
-   <td>rectágulo</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("fill") }}</td>
-   <td>pintar</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("fill-opacity") }}</td>
-   <td>valor de opacidad</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("flood-color") }}</td>
-   <td>{{cssxref("&lt;color&gt;")}} | palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("font-size") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("font-size-adjust") }}</td>
-   <td>números, palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("font-stretch") }}</td>
-   <td>palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("font-weight") }}</td>
-   <td>números| palabras clave (excluyendo <code>bolder</code>, <code>lighter</code>)</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("height") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-image-region") }}</td>
-   <td><code>rect()</code></td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("left") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("letter-spacing") }}</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("lighting-color") }}</td>
-   <td>{{cssxref("&lt;color&gt;")}} | palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("line-height") }}</td>
-   <td>número | {{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("margin") }} (including sub-properties)</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("marker-offset") }}</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("max-height") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("max-width") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("min-height") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("min-width") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("opacity") }}</td>
-   <td>número</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("outline-color") }}</td>
-   <td>{{cssxref("&lt;color&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("outline-offset") }}</td>
-   <td>entero</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-outline-radius") }} (including sub-properties)</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("outline-width") }}</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("padding") }} (including sub-properties)</td>
-   <td>{{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("right") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stop-color") }}</td>
-   <td>{{cssxref("&lt;color&gt;")}} | palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stop-opacity") }}</td>
-   <td>valor de opacidad</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stroke") }}</td>
-   <td>pintar</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stroke-dasharray") }}</td>
-   <td>dasharray</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stroke-dashoffset") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stroke-miterlimit") }}</td>
-   <td>miterlimit</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stroke-opacity") }}</td>
-   <td>valor de opacidad</td>
-  </tr>
-  <tr>
-   <td>{{ svgattr("stroke-width") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("text-indent") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("text-shadow") }}</td>
-   <td>sombra</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("top") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-transform-origin") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}, keywords</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("-moz-transform") }}</td>
-   <td>transform-function</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("vertical-align") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}, palabras clave</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("visibility") }}</td>
-   <td>visibilidad</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("width") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("word-spacing") }}</td>
-   <td>{{cssxref("&lt;percentage&gt;")}} | {{cssxref("&lt;length&gt;")}}</td>
-  </tr>
-  <tr>
-   <td>{{ cssxref("z-index") }}</td>
-   <td>entero</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Cuando_las_listas_de_valores_de_propiedades_tienen_longitudes_diferentes">Cuando las listas de valores de propiedades tienen longitudes diferentes</h2>
-
-<p>Si cualquier lista de valores de propiedades es más corta que las otras, sus valores se repiten para hacer que coincidan. Por ejemplo:</p>
-
-<pre class="brush: css">div {
-  transition-property: opacity, left, top, height;
-  transition-duration: 3s, 5s;
-}
-</pre>
-
-<p>Se considera como si fuera:</p>
-
-<pre class="brush: css">div {
-  transition-property: opacity, left, top, height;
-  transition-duration: 3s, 5s, 3s, 5s;
-}</pre>
-
-<p>De manera similar, si cualquier lista de valores de propiedades es más larga que la de {{ cssxref("transition-property") }}, se trunca, de forma que si tienes la siguiente CSS:</p>
-
-<pre class="brush: css">div {
-  transition-property: opacity, left;
-  transition-duration: 3s, 5s, 2s, 1s;
-}</pre>
-
-<p>Se interpreta como:</p>
-
-<pre class="brush: css">div {
-  transition-property: opacity, left;
-  transition-duration: 3s, 5s;
-}</pre>
-
-<h2 id="Funciones_de_intervalos_de_transición">Funciones de intervalos de transición</h2>
-
-<p>Las funciones de intervalos determinan el cálculo de los valores intermedios de la transición. La función de intervalo puede especificarse proporcionando el gráfico de la función correspondiente, como lo definen los cuatro puntos que definen una cúbica bézier:</p>
-
-<p><img alt="" src="/@api/deki/files/5226/=transition-timing-function.png"></p>
-
-<p>En lugar de especificar directamente una bézier, existen valores de intervalos predeterminados:</p>
-
-<ul>
- <li><strong>ease</strong>, equivalente a <code>cubic-bezier(0.25, 0.1, 0.25, 1.0)</code></li>
- <li><strong>linear</strong>, equivalente a <code>cubic-bezier(0.0, 0.0, 1.0, 1.0)</code></li>
- <li><strong>ease-in</strong>, equivalente a <code>cubic-bezier(0.42, 0, 1.0, 1.0)</code></li>
- <li><strong>ease-out</strong>, equivalente a <code>cubic-bezier(0, 0, 0.58, 1.0)</code></li>
- <li><strong>ease-in-out</strong>, equivalente a <code>cubic-bezier(0.42, 0, 0.58, 1.0)</code></li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Una_muestra_del_efecto_de_transición">Una muestra del efecto de transición</h3>
-
-<p>Este sencillo ejemplo proporciona demostraciones de distintos efectos de transición sin excesivos adornos.</p>
-
-<p>En primer lugar, el HTML para crear los elementos sobre los que probaremos nuestras transiciones:</p>
-
-<pre class="deki-transform">&lt;ul&gt;
-  &lt;li id="long1"&gt;Transición larga, gradual...&lt;/li&gt;
-  &lt;li id="fast1"&gt;Transición muy rápida...&lt;/li&gt;
-  &lt;li id="delay1"&gt;Transición larga de un minuto de retraso...&lt;/li&gt;
-  &lt;li id="easeout"&gt;Usar intervalos de alejamiento...&lt;/li&gt;
-  &lt;li id="linear"&gt;Usar intervalos lineales...&lt;/li&gt;
-  &lt;li id="cubic1"&gt;Usar cúbica bézier(0.2, 0.4, 0.7, 0.8)...&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-
-<p>Cada elemento tiene su propia id.; la CSS se encarga del resto. Veamos un par de ejemplos.</p>
-
-<h4 id="Usar_un_retraso">Usar un retraso</h4>
-
-<p>Este ejemplo realiza una transición de tamaño de fuente de cuatro segundos con dos segundos de retraso entre el momento en que el usuario pasa el ratón por encima del elemento y el comienzo del efecto de animación:</p>
-
-<pre class="deki-transform">#delay1 {
-  position: relative;
-  transition-property: font-size;
-  transition-duration: 4s;
-  transition-delay: 2s;
-  font-size: 14px;
-}
-
-#delay1:hover {
-  transition-property: font-size;
-  transition-duration: 4s;
-  transition-delay: 2s;
-  font-size: 36px;
-}
-</pre>
-
-<h4 id="Usar_una_función_de_intervalos_de_transición_lineales">Usar una función de intervalos de transición lineales</h4>
-
-<p>De manera predeterminada, la función de intervalos que se usa para computar los pasos intermedios durante la secuencia de animación proporciona una curva suave de aceleración y desaceleración para el efecto de animación. Si prefieres que el efecto mantenga una velocidad constante a lo largo de la animación, puedes especificar que deseas usar la función de intervalos de transición <code>linear</code>, tal y como se muestra a continuación.</p>
-
-<pre>transition-timing-function: linear;
-</pre>
-
-<p>Existen distintas funciones de intervalos estándares disponibles; consulta {{ cssxref("transition-timing-function") }} para tener más detalles.</p>
-
-<h4 id="Especificar_una_función_de_intervalos_cúbicos_bézier">Especificar una función de intervalos cúbicos bézier</h4>
-
-<p>Puedes controlar aún más el intervalo de la secuencia de animación si especificas tu propia curva cúbica bézier que describe la velocidad de animación. Por ejemplo:</p>
-
-<pre>  transition-timing-function: cubic-bezier(0.2, 0.4, 0.7, 0.8);
-</pre>
-
-<p>Establece una función de intervalo con una curva bézier definida por los puntos (0.0, 0.0), (0.2, 0.4), (0.7, 0.8) y (1.0, 1.0).</p>
-
-<h3 id="Menús_de_resaltado">Menús de resaltado</h3>
-
-<p>Un uso común de CSS es resaltar elementos de un menú mientras el usuario desplaza el cursor del ratón por encima de ellos. Es fácil usar las transciones para hacer que el efecto sea aún más atractivo.</p>
-
-<p>Antes de que miremos los fragmentos de código, tal vez desees <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample2/" title="http://developer.mozilla.org/samples/cssref/transitions/sample2/">echar un vistazo a la demo en vivo</a> (suponiendo que tu navegador admita transiciones). También puedes echar un <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample2/transitions.css" title="http://developer.mozilla.org/samples/cssref/transitions/sample2/transitions.css">vistazo directamente a la CSS</a> que usa.</p>
-
-<p>Primero configuramos el menú usando HTML:</p>
-
-<pre class="deki-transform">&lt;div class="sidebar"&gt;
-  &lt;p&gt;&lt;a class="menuButton" href="home"&gt;Inicio&lt;/a&gt;&lt;/p&gt;
-  &lt;p&gt;&lt;a class="menuButton" href="about"&gt;Acerca de&lt;/a&gt;&lt;/p&gt;
-  &lt;p&gt;&lt;a class="menuButton" href="contact"&gt;Contacto Us&lt;/a&gt;&lt;/p&gt;
-  &lt;p&gt;&lt;a class="menuButton" href="links"&gt;Vínculos&lt;/a&gt;&lt;/p&gt;
-&lt;/div&gt;
-</pre>
-
-<p>Después construimos la CSS para implementar el aspecto de nuestro menú. Las porciones relevantes se muestran a continuación:</p>
-
-<pre>.menuButton {
-  position: relative;
-  transition-property: background-color, color;
-  transition-duration: 1s;
-  transition-timing-function: ease-out;
-  -webkit-transition-property: background-color, color;
-  -webkit-transition-duration: 1s;
-  -o-transition-property: background-color, color;
-  -o-transition-duration: 1s;
-  text-align: left;
-  background-color: grey;
-  left: 5px;
-  top: 5px;
-  height: 26px;
-  color: white;
-  border-color: black;
-  font-family: sans-serif;
-  font-size: 20px;
-  text-decoration: none;
-  -moz-box-shadow: 2px 2px 1px black;
-  padding: 2px 4px;
-  border: solid 1px black;
-}
-
-.menuButton:hover {
-  position: relative;
-  transition-property: background-color, color;
-  transition-duration: 1s;
-  transition-timing-function: ease-out;
-  -webkit-transition-property: background-color, color;
-  -webkit-transition-duration: 1s;
-  -o-transition-property: background-color, color;
-  -o-transition-duration: 1s;
-  background-color:white;
-  color:black;
-  -moz-box-shadow: 2px 2px 1px black;
-}
-</pre>
-
-<p>Esta CSS establece el aspecto del menú con los colores de fondo y del texto que cambian cuando el elemento está en su estado {{ cssxref(":hover") }}.</p>
-
-<p>En lugar de describir el efecto con todo detalle, puedes echar un <a href="/samples/cssref/transitions/sample2" title="samples/cssref/transitions/sample2">vistazo a la muestra en vivo</a> si tu navegador admite transiciones (Firefox y WebKit nightlies, Opera 10.5).</p>
-
-<h3 id="Usar_eventos_de_transición_para_animar_un_objeto">Usar eventos de transición para animar un objeto</h3>
-
-<p>En este ejemplo, una pequeña caja con texto dentro se mueve hacia atrás y hacia delante a través de la pantalla y los colores de fondo y del texto se difuminan entre dos valores mientras tiene lugar la animación.</p>
-
-<p>
- <video controls src="https://developer.mozilla.org/samples/cssref/transitions/sample1/transitiondemo1.ogv"></video>
-</p>
-
-
-
-<p>Antes de que miremos los fragmentos de código, tal vez desees <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample1/" title="http://developer.mozilla.org/samples/cssref/transitions/sample1/">echar un vistazo a la demo en vivo</a> (suponiendo que tu navegador admita transiciones). También puedes echar un <a class="external" href="http://developer.mozilla.org/samples/cssref/transitions/sample1/transitions.css" title="http://developer.mozilla.org/samples/cssref/transitions/sample1/transitions.css">vistazo directamente a la CSS</a> que usa.</p>
-
-<h4 id="El_HTML">El HTML</h4>
-
-<p>El HTML para este ejemplo es muy sencillo:</p>
-
-<pre class="deki-transform">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;title&gt;CSS Transition Demo&lt;/title&gt;
-    &lt;link rel="stylesheet" href="transitions.css" type="text/css"&gt;
-    &lt;script src="transitions.js" type="text/javascript"&gt;&lt;/script&gt;
-  &lt;/head&gt;
-  &lt;body onload="runDemo()"&gt;
-    &lt;div class="slideRight"&gt;¡Esto es una caja!&lt;/div&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>Lo único que hay que observar aquí es que establecemos la clase para nuestra caja en "slideRight" inicialmente y cuando el documento haya terminado de cargarse, se ejecuta la función <code>runDemo()</code> del código JavaScript.</p>
-
-<h4 id="La_CSS">La CSS</h4>
-
-<p>Para crear nuestro efecto de animación, usamos dos clases de CSS, "slideRight" y "slideLeft". Si deseas ver el código completo de CSS, puedes mirar el archivo <a href="/samples/cssref/transitions/sample1/transitions.css" title="https://developer.mozilla.org/samples/cssref/transitions/sample1/transitions.css"><code>transitions.css</code></a> en su totalidad. A continuación se muestran sólo los trozos relevantes:</p>
-
-<pre class="deki-transform">.slideRight {
-  position: absolute;
-  transition-property: background-color, color, left;
-  transition-duration: 5s;
-  -webkit-transition-property: background-color, color, left;
-  -webkit-transition-duration: 5s;
-  -o-transition-property: background-color, color, left;
-  -o-transition-duration: 5s;
-  background-color: red;
-  left: 0%;
-  color: black;
-}
-</pre>
-
-<p>Observa que aquí especificamos de manera explícita la propiedad de posición. Esto es necesario porque sólo aquellos elementos cuya propiedad de posición se defina de manera expresa pueden animar su posición.</p>
-
-<p>La propiedad {{ cssxref("transition-property") }} se usa para enumerar las propiedades CSS que deseamos animar. En este caso, las propiedades que se van a animar son {{ cssxref("background-color") }}, {{ cssxref("color") }} y {{ cssxref("left") }}. La propiedad {{ cssxref("transition-duration") }} indica que deseamos que la animación tarde 5 segundos desde que comienza hasta que termina.</p>
-
-<p>Se incluyen los equivalentes WebKit y Opera para permitir que el ejemplo funcione en el software correspondiente.</p>
-
-<p>La clase "slideRight" se usa para especificar el punto de inicio para que la animación desplace el elemento desde el borde izquierdo hasta el borde derecho de la ventana del navegador. Como tal, define la posición y el color del elemento cuando está al principio de la secuencia de animación; concretamente, el valor para su propiedad {{ cssxref("left") }} es 0%, lo que indica que comenzará en el borde izquierdo de la ventana.</p>
-
-<p>Se muestra a continuación la clase "slideLeft", que define el punto final de la animación, es decir, el punto en el que concluirá la animación de izquierda a derecha y cambiaremos a una animación de derecha a izquierda.</p>
-
-<pre class="deki-transform">.slideLeft {
-  position: absolute;
-  transition-property: background-color, color, left;
-  transition-duration: 5s;
-  -webkit-transition-property: background-color, color, left;
-  -webkit-transition-duration: 5s;
-  -o-transition-property: background-color, color, left;
-  -o-transition-duration: 5s;
-  text-align: center;
-  background-color: blue;
-  left: 90%;
-  color: white;
-  width: 100px;
-  height: 100px;
-}
-</pre>
-
-<p>Los valores de color aquí se han cambiado para hacer que los colores de fondo y del texto cambien durante el tiempo de la secuencia de animación. Además de esto, la propiedad {{ cssxref("left") }} está aquí al 90%.</p>
-
-<h4 id="El_código_JavaScript">El código JavaScript</h4>
-
-<p>Una vez que hemos establecido los extremos de la secuencia de animación, lo que tenemos que hacer es iniciar la animación. Podemos hacerlo fácilmente usando JavaScript.</p>
-
-<div class="note"><strong>Nota:</strong> una vez que <a class="external" href="http://dev.w3.org/csswg/css3-animations/" title="http://dev.w3.org/csswg/css3-animations/">la compatibilidad para las animaciones</a> CSS esté disponible, el código JavaScript no será necesario para lograr este efecto.</div>
-
-<p>En primer lugar, la función<code> runDemo()</code> que se llama cuando el documento se carga para inicializar la secuencia de animación:</p>
-
-<pre class="deki-transform">function runDemo() {
-  var el = updateTransition();
-
-  // Configurar un controlador de eventos para invertir la dirección
-  // cuando finalice la transición.
-
-  el.addEventListener("transitionend", updateTransition, true);
-}
-</pre>
-
-<p>Es bastante sencillo: llama a la función<code> updateTranslation()</code> que definiremos enseguida, cuyo trabajo es establecer la clase para el elemento que estamos animando según la dirección en la que queramos que viaje. A continuación configura un proceso de escucha de evento para observar el evento "transitionend" que se envía cuando se completa una transición; esto nos permite saber cuándo es el momento para cambiar la clase del elemento para revertir la dirección de la animación.</p>
-
-<p>La función <code>updateTransition()</code> tiene este aspecto:</p>
-
-<pre class="deki-transform">function updateTransition() {
-  var el = document.querySelector("div.slideLeft");
-
-  if (el) {
-    el.className = "slideRight";
-  } else {
-    el = document.querySelector("div.slideRight");
-    el.className = "slideLeft";
-  }
-
-  return el;
-}
-</pre>
-
-<p>Esto ubica el elemento que estamos animando al buscarlo por su nombre de clase (aquí podríamos usar una id, por supuesto, pero seguidme la corriente). En primer lugar buscamos el nombre de la clase "slideLeft". Si se encuentra, cambiamos la clase del elemento a "slideRight". Esto iniciará la transición de derecha a izquierda, puesto que es el momento de que se deslice a la izquierda si el elemento está ya en el borde derecho, que será cuando llegue el evento "transitionend" y la clase del elemento sea "slideLeft" (se deslice a la izquierda).</p>
-
-<p>Si no se halla ningún elemento que coincida con la clase "slideLeft", buscamos el elemento que coincida con "slideRight" y cambiamos su clase a "slideLeft", comenzando de ese modo la animación en la dirección contraria.</p>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Navegadores</th>
-   <th>Compatibilidad básica</th>
-   <th>Propiedad</th>
-   <th>Evento de transición finalizada</th>
-  </tr>
-  <tr>
-   <td>Internet Explorer</td>
-   <td>(ninguna, a partir de IE9 pp7)</td>
-   <td>---</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>Firefox (Gecko)</td>
-   <td><strong>4.0</strong> (2.0)</td>
-   <td><code>-moz-transition</code></td>
-   <td><code>transitionend</code></td>
-  </tr>
-  <tr>
-   <td>Opera</td>
-   <td><strong>10.5</strong></td>
-   <td><code>-o-transition</code></td>
-   <td><code>OTransitionEnd</code></td>
-  </tr>
-  <tr>
-   <td>Safari | Chrome | WebKit</td>
-   <td>3.2 | yes | yes</td>
-   <td><code>-webkit-transition</code></td>
-   <td><code>webkitTransitionEnd</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilidad de navegadores</h3>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Compatibilidad básica</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Compatibilidad básica</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Consultar_también">Consultar también</h2>
-
-<ul>
- <li><a class="external" href="http://www.w3.org/TR/css3-transitions" title="http://www.w3.org/TR/css3-transitions">Módulo de transiciones CSS nivel 3</a></li>
- <li>{{ cssxref("-moz-transition") }}</li>
- <li>{{ cssxref("-moz-transition-property") }}</li>
- <li>{{ cssxref("-moz-transition-duration") }}</li>
- <li>{{ cssxref("-moz-transition-timing-function") }}</li>
- <li>{{ cssxref("-moz-transition-delay") }}</li>
-</ul>
-
-<p>{{ HTML5ArticleTOC() }}</p>
-
-<p>{{ languages( { "en": "en/CSS/CSS_transitions" } ) }}</p>
diff --git a/files/es/web/css/url()/index.html b/files/es/web/css/url()/index.html
new file mode 100644
index 0000000000..c57e34235d
--- /dev/null
+++ b/files/es/web/css/url()/index.html
@@ -0,0 +1,34 @@
+---
+title: url()
+slug: Web/CSS/url()
+tags:
+  - CSS
+  - Referencia
+translation_of: Web/CSS/url()
+translation_of_original: Web/CSS/filter-function/url
+original_slug: Web/CSS/filter-function/url
+---
+<div>{{cssref}}</div>
+
+<p>La función de <a href="/es/docs/Web/CSS">CSS</a> <strong><code>url()</code></strong> usa un <a href="/es/docs/Web/SVG/Element/filter"> filtro SVG</a> para cambiar la apariencia en la imagen de entrada.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">url(<em>location</em>)</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>location</code></dt>
+ <dd>La {{cssxref("&lt;url&gt;")}} de un archivo {{glossary("XML")}} que especifique un filtro SVG, y puede incluir un ancla a un elemento filtro específico.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: css">url(resources.svg#c1)</pre>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{cssxref("&lt;filter-function&gt;")}}</li>
+</ul>
diff --git a/files/es/web/css/user-modify/index.html b/files/es/web/css/user-modify/index.html
new file mode 100644
index 0000000000..33a9387f15
--- /dev/null
+++ b/files/es/web/css/user-modify/index.html
@@ -0,0 +1,133 @@
+---
+title: '-moz-user-modify'
+slug: Web/CSS/user-modify
+tags:
+  - CSS
+  - No estándar(2)
+  - Referencia CSS
+translation_of: Web/CSS/user-modify
+original_slug: Web/CSS/-moz-user-modify
+---
+<div>{{Non-standard_header}}{{CSSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>La propiedad <code>-moz-user-modify</code> determina si el contenido de un elemento puede ser editado por el usuario. Se relaciona con el atributo {{htmlattrxref("contenteditable")}} .  <code>user-focus</code> , que es una propiedad similar, fue propuesta como parte de los <a class="external" href="http://www.w3.org/TR/2000/WD-css3-userint-20000216">borradores iniciales de un predecesor de la especificación CSS3 UI</a> ,pero fue rechazada por el grupo de trabajo.</p>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="brush:css">/* Palabras clave valor */
+-moz-user-modify: read-only;
+-moz-user-modify: read-write;
+-moz-user-modify: write-only;
+
+/* Valores globales */
+-moz-user-modify: inherit;
+-moz-user-modify: initial;
+-moz-user-modify: unset;
+</pre>
+
+<h3 id="Valores">Valores</h3>
+
+<dl>
+ <dt>read-only</dt>
+ <dd>Valor por defecto. El contenido sólo se puede leer.</dd>
+ <dt>read-write</dt>
+ <dd>El usuario puede leer y escribir contenidos.</dd>
+ <dt>write-only</dt>
+ <dd>El usuario puede editar el contenido pero no leerlo.</dd>
+</dl>
+
+<h3 id="Síntaxis_Formal">Síntaxis Formal</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush:css">.readwrite {
+  -moz-user-modify: read-write;
+  -webkit-user-modify: read-write;
+}
+</pre>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush:html">&lt;div class="readwrite"&gt;El usuario puede cambiar este texto.&lt;/div&gt;
+</pre>
+
+<h3 id="Result">Result</h3>
+
+<p>{{EmbedLiveSample("Example", 300, 30)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p><code>user-modify</code> en <a class="external" href="http://www.w3.org/TR/2000/WD-css3-userint-20000216#user-modify" lang="en">una versión inicial de la especificación CSS 3 UI</a> (Borrador de trabajo Febrero del 2000, Working Draft February 2000 que ya ha sido reeemplazado por <em>CSS 3 UI</em>)</p>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}} {{property_prefix("-moz")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>3.0 {{property_prefix("-webkit")}}<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] También soporta: <code>-webkit-user-modify: read-write-plaintext-only</code> (Se perderá el texto enriquecido).<br>
+ Esta propiedad se llamó  <code>-khtml-user-modify</code> en Safari 2.0.</p>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>{{cssxref("-moz-user-focus")}}</li>
+ <li>{{cssxref("-moz-user-input")}}</li>
+ <li>{{cssxref("-moz-user-select")}}</li>
+</ul>
diff --git a/files/es/web/css/valor_calculado/index.html b/files/es/web/css/valor_calculado/index.html
deleted file mode 100644
index 9112bf97b5..0000000000
--- a/files/es/web/css/valor_calculado/index.html
+++ /dev/null
@@ -1,30 +0,0 @@
----
-title: Valor calculado
-slug: Web/CSS/Valor_calculado
-tags:
-  - Referencia_CSS
-translation_of: Web/CSS/computed_value
----
-<p><br>
- {{ CSSRef() }}</p>
-<h3 id="Sumario" name="Sumario">Sumario</h3>
-<p>El valor <b>computed value</b> de una propiedad CSS es computado a partir de <a href="es/CSS/specified_value">specified value</a> de la siguiente forma:</p>
-<ul>
- <li>Mediante los valores especiales <code><a href="es/CSS/inherit">inherit</a></code> y <code><a href="es/CSS/initial">initial</a></code>, y</li>
- <li>Realizando el cómputo necesario para alcanzar el valor descrito en la línea de "Computed value" del sumario de la propiedad.</li>
-</ul>
-<p>El cálculo necesario para el "Computed value" de una propiedad, normalmente implica convertir valores relativos (como los expresados en unidades 'em' o en porcentajes) a valores absolutos.</p>
-<p>Por ejemplo: si un elemento tiene un valor especificado de <code>font-size: 16px</code> y <code>padding-top: 2em</code>, el valor computado de <code>padding-top</code> es <code>32px</code> (el doble del tamaño de la fuente).</p>
-<p>Sin embargo, para algunas propiedades (aquellas con porcentajes relativos a algo que necesita un formato para ser determinados, tales como <a href="es/CSS/width">width</a>, <a href="es/CSS/margin-right">margin-right</a>, <a href="es/CSS/text-indent">text-indent</a>, y <a href="es/CSS/top">top</a>) los valores especificados en porcentajes se tornan valores computados. Ademas,los números especificados sin unidades en la propiedad <a href="es/CSS/line-height">line-height</a> se convierten en valores computados, según se especifica. Estos valores relativos que quedan tras realizar el cómputo, se hacen absolutos cuando se determina el <a href="es/CSS/used_value">used value</a>.</p>
-<p>El uso principal de <a href="es/CSS/computed_value">computed value</a> (ademas de ser un paso de transición entre <a href="es/CSS/specified_value">specified value</a> y <a href="es/CSS/used_value">used value</a>) es <a href="es/CSS/inherited_and_non-inherited_properties">inheritance</a>, incluyendo la palabra clave <a href="es/CSS/inherit">inherit</a>.</p>
-<h3 id="Notas" name="Notas">Notas</h3>
-<p>La API DOM <a href="es/DOM/window.getComputedStyle">getComputedStyle</a> devuelve <a href="es/CSS/used_value">used value</a>, en lugar de <a href="es/CSS/computed_value">computed value</a>.</p>
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
-<p><a href="es/CSS/specified_value">specified value</a>, <a href="es/CSS/used_value">used value</a>, <a href="es/CSS/actual_value">actual value</a></p>
-<p> </p>
-<p> </p>
-<p> </p>
-<p> </p>
-<div class="noinclude">
-  </div>
-<p>{{ languages( { "en": "en/CSS/computed_value", "fr": "fr/CSS/Valeur_calcul\u00e9e", "ja": "ja/CSS/computed_value", "pl": "pl/CSS/warto\u015b\u0107_wyliczona" } ) }}</p>
diff --git a/files/es/web/css/valor_inicial/index.html b/files/es/web/css/valor_inicial/index.html
deleted file mode 100644
index a6bbcdf32d..0000000000
--- a/files/es/web/css/valor_inicial/index.html
+++ /dev/null
@@ -1,26 +0,0 @@
----
-title: Valor inicial
-slug: Web/CSS/Valor_inicial
-tags:
-  - CSS
-  - 'CSS:Referencias'
-  - Todas_las_Categorías
-translation_of: Web/CSS/initial_value
----
-<p>
-</p><p>&lt;&lt; <a href="es/Gu%c3%ada_de_referencia_de_CSS">Volver</a>
-</p>
-<h3 id="Resumen" name="Resumen"> Resumen </h3>
-<p>El <b>Valor inicial</b> dado en el resumen de cada definición de <a href="es/Gu%c3%ada_de_referencia_de_CSS">propiedad CSS</a> tiene un significado distinto según se trate de <a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">propiedades heredadas o no heredadas</a>.
-</p><p>Para propiedades <a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">heredadas</a>, se usa el valor inicial, para el elemento raíz <b>solamente</b>, cuando no se ha especificado ningún valor para el elemento. </p><p>Para propiedades <a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">no heredadas</a> se usa el valor inicial para <b>todos</b> los elementos, cuando no se especificó nigún valor para el elemento. </p><p>En CSS3 se propuso el valor <code><a href="es/CSS/initial">initial</a></code> para permitir a los autores especificar explícitamente éste valor inicial.
-</p>
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n"> Ver también </h3>
-<p><a href="es/CSS/inheritance#Propiedades_heredadas_y_no_heredadas">Propiedades heredadas y no heredadas</a>, <code><a href="es/CSS/initial">initial</a></code>
-</p><p><br>
-</p>
-<div class="noinclude">
-<p><span class="comment">Categorías</span>
-</p><p><span class="comment">Interwiki Languages</span>
-</p>
-</div>
-{{ languages( { "en": "en/CSS/initial_value", "fr": "fr/CSS/Valeur_initiale", "ja": "ja/CSS/initial_value", "ko": "ko/CSS/initial_value", "pl": "pl/CSS/Warto\u015b\u0107_pocz\u0105tkowa" } ) }}
diff --git a/files/es/web/css/value_definition_syntax/index.html b/files/es/web/css/value_definition_syntax/index.html
new file mode 100644
index 0000000000..347f5069bf
--- /dev/null
+++ b/files/es/web/css/value_definition_syntax/index.html
@@ -0,0 +1,403 @@
+---
+title: Sintaxis de definición de valor
+slug: Web/CSS/Value_definition_syntax
+translation_of: Web/CSS/Value_definition_syntax
+original_slug: Web/CSS/Sintaxis_definición_de_valor
+---
+<p>{{CSSRef()}}</p>
+
+<p><span class="seoSummary"><strong>La sintaxis de definición de valores CSS</strong>, una gramática formal, se utiliza para definir el conjunto de valores válidos para una propiedad o función CSS. Además de esta sintaxis, el conjunto de valores válidos puede restringirse aún más mediante restricciones semánticas (por ejemplo, para que un número sea estrictamente positivo).</span></p>
+
+<p class="summary">La sintaxis de definición describe qué valores están permitidos y las interacciones entre ellos. Un componente puede ser una <em>palabra clave</em>, algunos caracteres <em>literales</em>, ó un valor de tipo de dato de CSS o propiedad CSS.</p>
+
+<h2 id="Tipos_de_valor_de_los_componentes">Tipos de valor de los componentes</h2>
+
+<h3 id="Palabras_clave">Palabras clave</h3>
+
+<h4 id="Palabras_clave_genéricas">Palabras clave genéricas</h4>
+
+<p>Una palabra clave con significado predefinido aparece literalmente, sin comillas, por ejemplo: <code>auto</code>, <code>smaller</code> or <code>ease-in</code>.</p>
+
+<h4 id="El_caso_específico_de_inherit_e_initial">El caso específico de <code>inherit</code> e <code>initial</code></h4>
+
+<p>Todas las propiedades CSS aceptan las palabras clave <code>inherit</code> e <code>initial</code> que son definidas vía CSS. Estas no son mostradas en la definición del valor y están implícitamente definidas.</p>
+
+<h3 id="Literales">Literales</h3>
+
+<p>En CSS, unos pocos caracteres pueden aparecer por su cuenta, como la barra ('<code>/</code>') o la coma ('<code>,</code>'), y son usadas en una propiedad o definición para separar sus partes. La coma es a menudo usada para separar valores en enumeraciones, o parámetros en funciones de tipo matemático; la barra a menudo separa partes de el valor que es semánticamente diferente, pero que tiene una sintaxis común. Típicamente, la barra es usada a veces en propiedades abreviadas para separar componentes que son del mismo tipo, pero pertenecen a diferentes propiedades.</p>
+
+<p>Ambos símbolos aparecen literalmente en una definición de valor.</p>
+
+<h3 id="Tipos_de_dato">Tipos de dato</h3>
+
+<h4 id="Tipos_de_dato_básicos">Tipos de dato básicos</h4>
+
+<p>Un tipo de dato usado vía CSS es definido una sola vez para todos los valores en la especificación. Se llaman <em>tipos de datos básicos, </em>estan representados por su nombre rodeados del símbolo '<code>&lt;</code>' y '<code>&gt;</code>': {{ cssxref("&lt;angle&gt;") }}, {{cssxref("&lt;string&gt;")}}, …</p>
+
+<h4 id="Tipos_de_dato_no_terminales">Tipos de dato no terminales</h4>
+
+<p>Tipos de dato poco comunes, llamados <em>tipos de datos no terminales</em>, están también rodeados por  '<code>&lt;</code>' y '<code>&gt;</code>'.</p>
+
+<p>Los tipos de dato no terminales son de dos tipos::</p>
+
+<ul>
+ <li>tipos de datos <em>que comparten el mismo nombre de propiedad</em>, colocados entre comillas . En este caso el tipo de dato comparte el mismo conjunto de valores de la propiedad. A menudo son usados en la definición de propiedades abreviadas.</li>
+ <li>tipos de datos <em>que no comparten el mismo nombre de la propiedad</em>. Estos tipos de datos son muy cercanos a sus tipos de datos básicos. Ellos solo difieren de los tipos de datos básicos en la ubicación física de su definición: en este caso la definición es usualmente físicamente muy cercana a la definición de la propiedad que la esta usando.</li>
+</ul>
+
+<h2 id="Combinadores_de_los_valores_de_componentes">Combinadores de los valores de componentes</h2>
+
+<h3 id="Corchetes">Corchetes</h3>
+
+<p><em>Corchetes </em>encierran varias entidades, combinadores, y multiplicadores, luego los transforman en un solo componente. Son usados para <strong>agrupar componentes para sobreescribir las reglas de precedencia.</strong></p>
+
+<pre class="syntaxbox"><code>bold [ thin &amp;&amp; &lt;length&gt; ]</code></pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold thin 2vh</code></li>
+ <li><code>bold 0 thin</code></li>
+ <li><code>bold thin 3.5em</code></li>
+</ul>
+
+<p>Pero no con:</p>
+
+<ul>
+ <li><code>thin bold 3em</code>,  porque <code>bold</code> esta yuxtapuesto con el componente definido por los corchetes, debe aparecer antes de él.</li>
+</ul>
+
+<h3 id="Yuxtaposición">Yuxtaposición</h3>
+
+<p>Colocar varias palabras clave, literales, o tipos de datos, uno al lado del otro, solo separados por uno o varios espacios se llama <em>yuxtaponer. </em>Todos los componentes yuxtapuestos son <strong>obligatorios y deben aparecer en ese orden exacto.</strong></p>
+
+<pre class="syntaxbox">bold &lt;length&gt; , thin
+</pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold 1em, thin</code></li>
+ <li><code>bold 0, thin</code></li>
+ <li><code>bold 2.5cm, thin</code></li>
+ <li><code>bold 3vh, thin</code></li>
+</ul>
+
+<p>Pero no con:</p>
+
+<ul>
+ <li><code>thin 1em, bold</code> porque las entidades deben aparecer en el orden expresado</li>
+ <li><code>bold 1em thin</code> porque las entidades son obligatorias; la coma que es un literal debe estar presente</li>
+ <li><code>bold 0.5ms, thin</code> porque los valores <code>ms</code> no son de tipo {{cssxref("&lt;length&gt;")}}</li>
+</ul>
+
+<h3 id="Doble_ampersand">Doble ampersand</h3>
+
+<p>Separar dos o mas componentes por un <em>doble ampersand</em>, <code>&amp;&amp;</code>, significa que todas esas entidades son <strong>obligatorias pero pueden aparecer en cualquier orden.</strong></p>
+
+<pre class="syntaxbox">bold &amp;&amp; &lt;length&gt;
+</pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold 1em</code></li>
+ <li><code>bold 0</code></li>
+ <li><code>2.5cm bold</code></li>
+ <li><code>3vh bold</code></li>
+</ul>
+
+<p>Pero no con:</p>
+
+<ul>
+ <li><code>bold</code> porque ambos componentes deben aparecer en el valor</li>
+ <li><code>bold 1em bold</code> porque ambos componentes deben aparecer solo una vez</li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> yuxtaposición tiene precedencia sobre el doble ampersand, esto quiere decir que <code>bold thin &amp;&amp; &lt;length&gt;</code> es equivalente a <code>[ </code><code>bold thin ] &amp;&amp; &lt;length&gt;</code>. Que describe a <code>bold thin &lt;length&gt;</code> ó <code>&lt;length&gt;</code><code> bold thin</code> pero no a  <code>bold &lt;length&gt;</code><code> thin</code>.</div>
+
+<h3 id="Barra_doble">Barra doble</h3>
+
+<p>Separar dos o mas componentes por una <em>barra doble</em>, <code>||</code>, significa que todas las entidades son opcionales: <strong>al menos una debe estar presente, y pueden aparecer en cualquier orden. </strong>Típicamente ésto es usado para definir los diferentes valores de una <a href="/en-US/docs/CSS/Shorthand_properties" title="/en-US/docs/CSS/Shorthand_properties">propiedad abreviada</a>.</p>
+
+<pre class="syntaxbox">&lt;'border-width'&gt; || &lt;'border-style'&gt; || &lt;'border-color'&gt;
+</pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>1em solid blue</code></li>
+ <li><code>blue 1em</code></li>
+ <li><code>solid 1px yellow</code></li>
+</ul>
+
+<p>Pero no con:</p>
+
+<ul>
+ <li><code>blue yellow</code> porque un componente debe aparecer al menos una vez.</li>
+ <li><code>bold</code>  porque no es una palabra clave permitida como valor de ninguna de las entidades.</li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> el doble ampersand tiene precedencia sobre la barra doble, que significa que <code>bold || thin &amp;&amp; &lt;length&gt;</code> es equivalente a <code>bold || [ thin &amp;&amp; &lt;length&gt; ]</code>. Describe a <code>bold</code>, <code>thin</code>, <code>&lt;length&gt;</code>, <code>bold thin</code>, <code>&lt;length&gt; bold</code>, o <code>thin &lt;length&gt; bold</code> pero no <code>bold &lt;length&gt;</code><code> bold thin</code> porque bold, si no es omitido debe colocarse antes o después de el componente<code> thin &amp;&amp; &lt;length&gt;</code></div>
+
+<h3 id="Barra_simple">Barra simple</h3>
+
+<p>Separar dos o mas componentes con <em>una barra simple</em>, <code>|</code>, quiere decir que todas las entidades son opciones exclusivas: <strong>exactamente una de estas opciones debe estar presente. </strong>Esto es tipicamente usado para separar una lista de posibles palabras clave.</p>
+
+<pre class="syntaxbox">&lt;percentage&gt; | &lt;length&gt; | left | center | right | top | bottom</pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>3%</code></li>
+ <li><code>0</code></li>
+ <li><code>3.5em</code></li>
+ <li><code>left</code></li>
+ <li><code>center</code></li>
+ <li><code>right</code></li>
+ <li><code>top</code></li>
+ <li><code>bottom</code></li>
+</ul>
+
+<p>Pero no</p>
+
+<ul>
+ <li><code>center 3%</code> porque solo uno de los componentes debe estar presente</li>
+ <li><code>3em 4.5em</code> porque un componente debe estar presente máximo una vez.</li>
+</ul>
+
+<div class="note">
+<p><strong>Note:</strong> la barra doble tiene precedencia sobre la barra simple, quiere decir que <code>bold | thin || &lt;length&gt;</code> es equivalente a <code>bold | [ thin || &lt;length&gt; ]</code>. Describe <code>bold</code>, <code>thin</code>, <code>&lt;length&gt;</code>, <code>&lt;length&gt; thin</code>, o <code>thin &lt;length&gt; </code>pero no <code>bold &lt;length&gt;</code><code> </code>porque solo una entidad de cada lado del combinador <code>|</code> puede estar presente.</p>
+</div>
+
+<h2 id="Multiplicadores_de_valores_de_componentes">Multiplicadores de valores de componentes</h2>
+
+<p>Un multiplicador es un símbolo que indica cuantas veces una entidad precedente puede ser repetida. Sin un multiplicador, una entidad debe aparecer exactamente una vez.</p>
+
+<p>Note que los multiplicadores no pueden sumarse y tienen precedencia sobre los combinadores.</p>
+
+<h3 id="Asterisco_(*)">Asterisco (<code>*</code>)</h3>
+
+<p>El <em>multiplicador asterisco </em>indica que la entidad puede aparecer <strong>cero, una o varias veces.</strong></p>
+
+<pre class="syntaxbox"><code>bold smaller*</code></pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold</code></li>
+ <li><code>bold smaller</code></li>
+ <li><code>bold smaller smaller</code></li>
+ <li><code>bold smaller smaller smaller</code> y así sucesivamente</li>
+</ul>
+
+<p>Pero no:</p>
+
+<ul>
+ <li><code>smaller</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de la palabra clave <code>smaller</code></li>
+</ul>
+
+<h3 id="Suma_()">Suma (<code>+</code>)</h3>
+
+<p>El <em>multiplicador suma </em>indica que la entidad puede aparecer <strong>una o varias veces.</strong></p>
+
+<pre class="syntaxbox"><code>bold smaller+</code></pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold smaller</code></li>
+ <li><code>bold smaller smaller</code></li>
+ <li><code>bold smaller smaller smaller</code> y sucesivamente</li>
+</ul>
+
+<p>Pero no:</p>
+
+<ul>
+ <li><code>bold</code> porque <code>smaller</code> debe aparecer al menos una vez</li>
+ <li><code>smaller</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
+</ul>
+
+<h3 id="Pregunta_()">Pregunta (<code>?</code>)</h3>
+
+<p>El <em>multiplicador pregunta </em>indica que la entidad es opcional y <strong>debe aparecer cero o una vez</strong></p>
+
+<pre class="syntaxbox"><code>bold smaller?</code></pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold</code></li>
+ <li><code>bold smaller</code></li>
+</ul>
+
+<p>Pero no:</p>
+
+<ul>
+ <li><code>bold smaller smaller</code> porque <code>smaller</code> debe aparecer como máximo una vez</li>
+ <li><code>smaller bold</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
+</ul>
+
+<h3 id="Llaves_(_)">Llaves (<code>{ }</code>)</h3>
+
+<p>El <em>multiplicador llaves, </em>encierra a dos enteros A y B separados  por una coma, indica que la entidad <strong>debe aparecer al menos A veces y como mas B veces</strong></p>
+
+<pre class="syntaxbox"><code>bold smaller{1,3}</code></pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold smaller</code></li>
+ <li><code>bold smaller smaller</code></li>
+ <li><code>bold smaller smaller smaller</code></li>
+</ul>
+
+<p>Pero no:</p>
+
+<ul>
+ <li><code>bold</code> porque <code>smaller</code> debe aparecer al menos una vez</li>
+ <li><code>bold smaller smaller smaller smaller</code> porque <code>smaller</code> debe aparecer un máximo de tres veces.</li>
+ <li><code>smaller bold</code> porque <code>bold</code> esta yuxtapuesto u debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
+</ul>
+
+<h3 id="Hash_()">Hash (<code>#</code>)</h3>
+
+<p>El <em>multiplicador hash</em> indica que la entidad puede repetirse <strong>una o mas veces </strong>(como con el multiplicador de suma) pero cada ocurrencia se <strong>separa por una coma</strong> ('<code>,</code>').</p>
+
+<pre class="syntaxbox"><code>bold smaller#</code></pre>
+
+<p>El ejemplo empareja con los siguientes valores:</p>
+
+<ul>
+ <li><code>bold smaller</code></li>
+ <li><code>bold smaller, smaller</code></li>
+ <li><code>bold smaller, smaller, smaller</code> y así sucesivamente</li>
+</ul>
+
+<p>Pero no:</p>
+
+<ul>
+ <li><code>bold</code> porque <code>smaller</code> debe aparecer al menos una vez</li>
+ <li><code>bold smaller smaller smaller</code> porque las diferentes ocurrencias de <code>smaller</code> deben estar separadas por comas</li>
+ <li><code>smaller</code> porque <code>bold</code> esta yuxtapuesto y debe aparecer antes de cualquier palabra clave <code>smaller</code></li>
+</ul>
+
+<h2 id="Sumario">Sumario</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Símbolo</th>
+   <th scope="col">Nombre</th>
+   <th scope="col">Descripción</th>
+   <th scope="col">Ejemplo</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th colspan="4">Combinadores</th>
+  </tr>
+  <tr>
+   <td> </td>
+   <td>Yuxtaposición</td>
+   <td>Componentes obligatorios que deben aparecer en el mismo orden</td>
+   <td><code>solid &lt;length&gt;</code></td>
+  </tr>
+  <tr>
+   <td><code>&amp;&amp;</code></td>
+   <td>Doble ampersand</td>
+   <td>Componentes obligatorios pero que pueden aparecer en cualquier orden</td>
+   <td><code>length&gt; &amp;&amp; &lt;string&gt;</code></td>
+  </tr>
+  <tr>
+   <td><code>||</code></td>
+   <td>Barra doble</td>
+   <td>Al menos uno de los componentes debe estar presente, y pueden aparecer en cualquier orden</td>
+   <td><code>&lt;'border-image-outset'&gt; || &lt;'border-image-slice'&gt;</code></td>
+  </tr>
+  <tr>
+   <td><code>|</code></td>
+   <td>Barra simple</td>
+   <td>Exactamente uno de los componentes debe estar presente</td>
+   <td><code>smaller | small | normal | big | bigger</code></td>
+  </tr>
+  <tr>
+   <td><code>[ ]</code></td>
+   <td>Corchetes</td>
+   <td>Agrupa componentes para sobreescribir las reglas de precedencia</td>
+   <td><code>bold [ thin &amp;&amp; &lt;length&gt; ]</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Multiplicadores</th>
+  </tr>
+  <tr>
+   <td> </td>
+   <td>Sin multiplicador</td>
+   <td>Exactamente 1 vez</td>
+   <td><code>solid</code></td>
+  </tr>
+  <tr>
+   <td><code>*</code></td>
+   <td>Asterisco</td>
+   <td>0 or more times</td>
+   <td><code>bold smaller*</code></td>
+  </tr>
+  <tr>
+   <td><code>+</code></td>
+   <td>Suma</td>
+   <td>1 o mas veces</td>
+   <td><code>bold smaller+</code></td>
+  </tr>
+  <tr>
+   <td><code>?</code></td>
+   <td>Pregunta</td>
+   <td>0 o 1 vez (es <em>opcional)</em></td>
+   <td><code>bold smaller?</code></td>
+  </tr>
+  <tr>
+   <td><code>{A,B}</code></td>
+   <td>Llaves</td>
+   <td>Al menos <code>A</code> veces, como mas <code>B</code> veces</td>
+   <td><code>bold smaller{1,3}</code></td>
+  </tr>
+  <tr>
+   <td><code>#</code></td>
+   <td>Hash</td>
+   <td>1 o mas veces, pero cada ocurrencia separada por una coma ('<code>,</code>')</td>
+   <td><code>bold smaller#</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{ SpecName('CSS3 Values', '#value-defs', 'Value definition syntax') }}</td>
+   <td>{{ Spec2('CSS3 Values') }}</td>
+   <td>Desde {{ SpecName('CSS2.1', 'about.html#value-defs', 'Value definition syntax') }}, añade el multiplicador hash</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('CSS2.1', 'about.html#value-defs', 'Value definition syntax') }}</td>
+   <td>{{ Spec2('CSS2.1') }}</td>
+   <td>Desde {{ SpecName('CSS1', '#notation-for-property-values', 'Value definition syntax') }}, añade el combinador doble ampersand</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS1', '#notation-for-property-values', 'Value definition syntax') }}</td>
+   <td>{{ Spec2('CSS1') }}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{ CSS_key_concepts() }}</li>
+</ul>
diff --git a/files/es/web/events/abort/index.html b/files/es/web/events/abort/index.html
deleted file mode 100644
index 641d144c77..0000000000
--- a/files/es/web/events/abort/index.html
+++ /dev/null
@@ -1,68 +0,0 @@
----
-title: abort
-slug: Web/Events/abort
-translation_of: Web/API/HTMLMediaElement/abort_event
-translation_of_original: Web/Events/abort
----
-<p>The <code>abort</code> event is fired when the loading of a resource has been aborted.</p>
-
-<h2 id="Información_general">Información general</h2>
-
-<dl>
- <dt style="float: left; text-align: right; width: 120px;">Specification</dt>
- <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-abort">DOM L3</a></dd>
- <dt style="float: left; text-align: right; width: 120px;">Interface</dt>
- <dd style="margin: 0 0 0 120px;">UIEvent if generated from a user interface, Event otherwise.</dd>
- <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Target</dt>
- <dd style="margin: 0 0 0 120px;">Element</dd>
- <dt style="float: left; text-align: right; width: 120px;">Default Action</dt>
- <dd style="margin: 0 0 0 120px;">None</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col">Type</th>
-   <th scope="col">Description</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyInline}}</td>
-   <td><a href="/en-US/docs/Web/API/EventTarget" title="EventTarget is an interface implemented by objects that can receive events and may have listeners for them."><code>EventTarget</code></a></td>
-   <td>The event target (the topmost target in the DOM tree).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyInline}}</td>
-   <td><a href="/en-US/docs/Web/API/DOMString" title="DOMString is a UTF-16 String. As JavaScript already uses such strings, DOMString is mapped directly to a String."><code>DOMString</code></a></td>
-   <td>The type of event.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyInline}}</td>
-   <td><a href="/en-US/docs/Web/API/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a></td>
-   <td>Whether the event normally bubbles or not.</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyInline}}</td>
-   <td><a href="/en-US/docs/Web/API/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a></td>
-   <td>Whether the event is cancellable or not.</td>
-  </tr>
-  <tr>
-   <td><code>view</code> {{readonlyInline}}</td>
-   <td><a class="new" href="/en-US/docs/Web/API/WindowProxy" rel="nofollow" title="The documentation about this has not yet been written; please consider contributing!"><code>WindowProxy</code></a></td>
-   <td><a href="/en-US/docs/Web/API/Document/defaultView" title="In browsers, document.defaultView returns the window object associated with a document, or null if none is available."><code>document.defaultView</code></a> (<code>window</code> of the document)</td>
-  </tr>
-  <tr>
-   <td><code>detail</code> {{readonlyInline}}</td>
-   <td><code>long</code> (<code>float</code>)</td>
-   <td>0.</td>
-  </tr>
- </tbody>
-</table>
diff --git a/files/es/web/events/animationend/index.html b/files/es/web/events/animationend/index.html
deleted file mode 100644
index 8bca8b046f..0000000000
--- a/files/es/web/events/animationend/index.html
+++ /dev/null
@@ -1,81 +0,0 @@
----
-title: animationend
-slug: Web/Events/animationend
-translation_of: Web/API/HTMLElement/animationend_event
----
-<p>El evento <code>animationend</code> es lanzado cuando una animación CSS se ha completado.</p>
-
-<h2 id="Información_General">Información General</h2>
-
-<dl>
- <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
- <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/css3-animations/#animation-events">CSS Animations</a></dd>
- <dt style="float: left; text-align: right; width: 120px;">Interface</dt>
- <dd style="margin: 0 0 0 120px;">AnimationEvent</dd>
- <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
- <dd style="margin: 0 0 0 120px;">Si</dd>
- <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Target</dt>
- <dd style="margin: 0 0 0 120px;">Document, Element</dd>
- <dt style="float: left; text-align: right; width: 120px;">Acción por defecto</dt>
- <dd style="margin: 0 0 0 120px;">None</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedad</th>
-   <th scope="col">Tipo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{ReadOnlyInline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>The event target (the topmost target in the DOM tree).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{ReadOnlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The type of event.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{ReadOnlyInline}}</td>
-   <td><code>boolean</code></td>
-   <td>Does the event normally bubble?</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{ReadOnlyInline}}</td>
-   <td><code>boolean</code></td>
-   <td>Is it possible to cancel the event?</td>
-  </tr>
-  <tr>
-   <td><code>animationName</code> {{ReadOnlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The name of the CSS property associated with the transition.</td>
-  </tr>
-  <tr>
-   <td><code>elapsedTime</code> {{ReadOnlyInline}}</td>
-   <td>Float</td>
-   <td>The amount of time the animation has been running, in seconds, when this event fired, excluding any time the animation was paused. For an "animationstart" event, the elapsedTime is zero unless there was a negative value for <code>animation-delay</code>, in which case the event will be fired with an elapsedTime of (-1 * delay).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Eventos_relacionados">Eventos relacionados</h2>
-
-<ul>
- <li>{{Event("animationstart")}}</li>
- <li>{{Event("animationend")}}</li>
- <li>{{Event("animationiteration")}}</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/CSS/Using_CSS_animations" title="/en-US/docs/CSS/Using_CSS_animations">Using CSS Animations</a></li>
-</ul>
diff --git a/files/es/web/events/beforeunload/index.html b/files/es/web/events/beforeunload/index.html
deleted file mode 100644
index 98fb747ae9..0000000000
--- a/files/es/web/events/beforeunload/index.html
+++ /dev/null
@@ -1,215 +0,0 @@
----
-title: beforeunload
-slug: Web/Events/beforeunload
-translation_of: Web/API/Window/beforeunload_event
----
-<div>El evento <strong>beforeunload</strong> es disparado cuando la ventana, el documento y sus recursos estan a punto de ser descargados. El documento todavia es visible y el evento todavia es cancelable en este punto.</div>
-
-<div> </div>
-
-<p>Si es asignado un string a la propiedad del objeto Evento returnValue, una caja de dialogo aparece, preguntando al usuario que confirme que dejara la pagina(mirar el ejemplo de abajo).  Algunos navegadores muestran el string devuelto en una caja de dialogos, otros muestran un mensaje fijo. Si no se provee ningun valor, el evento procede silenciosamente.</p>
-
-<div class="note">
-<p><strong>Nota:</strong>Para combatir pop-ups indeseados, los navegadores pueden no mostrar mensajes creados en manejadores del evento beforeunload a menos que se haya interactuado con la pagina, o incluso sin que se haya interactuado en nada con esta.</p>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td>Burbujas</td>
-   <td>No</td>
-  </tr>
-  <tr>
-   <td>Cancelable</td>
-   <td>Si</td>
-  </tr>
-  <tr>
-   <td>Objetos de destino</td>
-   <td>defaultView</td>
-  </tr>
-  <tr>
-   <td>Interfaz</td>
-   <td>{{domxref("Event")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedad</th>
-   <th scope="col">Tipo</th>
-   <th scope="col">Descripcion</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readOnlyInline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>El evento objetivo(el objetivo superior en el arbol del DOM).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readOnlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>El tipo de evento.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readOnlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>El evento normalmente burbujea?</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readOnlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Es posible cancelar el evento?</td>
-  </tr>
-  <tr>
-   <td><code>returnValue</code></td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>El valor actual devuelto por el evento (el mensaje que se le mostrara al usuario).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush:js;">window.addEventListener("beforeunload", function (event) {
-  event.returnValue = "\o/";
-});
-
-// es equivalente a
-window.addEventListener("beforeunload", function (event) {
-  event.preventDefault();
-});</pre>
-
-<p>Navegadores basados en WebKit no siguen las especificaciones para la caja de dialogos. Un ejemplo que funcione con distintos navegadores seria similar al siguiente:</p>
-
-<pre class="brush: js">window.addEventListener("beforeunload", function (e) {
-  var confirmationMessage = "\o/";
-
-  e.returnValue = confirmationMessage;     // Gecko, Trident, Chrome 34+
-  return confirmationMessage;              // Gecko, WebKit, Chrome &lt;34
-});</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>A partir del 25 de Mayo del 2011, la especificion HTML5 establece que llamadas a los metodos {{domxref("window.alert()")}}, {{domxref("window.confirm()")}}, y {{domxref("window.prompt()")}}pueden ser ignoradas durante este evento.Mire las <a href="http://www.w3.org/TR/html5/webappapis.html#user-prompts">especificaciones de HTML5</a> para mas detalles.</p>
-
-<p>Varios navegadores ignoran el resultado del evento y no le preguntan al usuario por confirmacion en absoluto. El documento siempre se descargara automaticamente. Firefox tiene un switch llamado dom.disable_beforeunload en <a>about:config</a>  para habilitar este comportamiento.</p>
-
-<p>Usando este manejador de evento tu pagina previene que Firefox cambie el cache de la pagina a uno en memoria bfcache. Mire <a href="en/Using_Firefox_1.5_caching">Usando el almacenamiento en cache Firefox 1.5</a> para detalles.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName("HTML WHATWG", "indices.html#event-beforeunload", "beforeunload")}}</td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "browsers.html#unloading-documents", "beforeunload")}}</td>
-   <td>{{Spec2("HTML5 W3C")}}</td>
-   <td>Definicion inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{CompatChrome(1.0)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>1</td>
-   <td>4</td>
-   <td>12</td>
-   <td>3</td>
-  </tr>
-  <tr>
-   <td>Texto personalizado soporte removido</td>
-   <td>{{CompatChrome(51.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("44.0")}}</td>
-   <td> </td>
-   <td>38</td>
-   <td><a href="https://developer.apple.com/library/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9_1.html">9.1</a></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>(no) <a href="https://bugs.webkit.org/show_bug.cgi?id=19324">defect</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Texto personalizado soporte removido</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(51.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("44.0")}}</td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td>{{CompatChrome(51.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Mire_tambien">Mire tambien</h2>
-
-<ul>
- <li>{{Event("DOMContentLoaded")}}</li>
- <li>{{Event("readystatechange")}}</li>
- <li>{{Event("load")}}</li>
- <li>{{Event("unload")}}</li>
- <li><a href="http://www.whatwg.org/specs/web-apps/current-work/#prompt-to-unload-a-document" title="http://www.whatwg.org/specs/web-apps/current-work/#prompt-to-unload-a-document">Unloading Documents — Confirmacion para descargar un documento</a></li>
- <li><a href="https://developers.google.com/web/updates/2016/04/chrome-51-deprecations?hl=en#remove_custom_messages_in_onbeforeload_dialogs">Remover mensajes personalizados en dialogos onbeforeload despues de Chrome 51</a> </li>
-</ul>
diff --git a/files/es/web/events/blur/index.html b/files/es/web/events/blur/index.html
deleted file mode 100644
index b54ad3e6a6..0000000000
--- a/files/es/web/events/blur/index.html
+++ /dev/null
@@ -1,156 +0,0 @@
----
-title: blur (evento)
-slug: Web/Events/blur
-tags:
-  - DOM
-translation_of: Web/API/Element/blur_event
----
-<p>El evento <code>blur</code> es disparado cuando un elemento ha perdido su foco. La diferencia principal entre este evento y <code><a href="/en-US/docs/Mozilla_event_reference/focusout">focusout</a></code> es que sólo el último se propaga (bubbles).</p>
-
-<h2 id="Información_General">Información General</h2>
-
-<dl>
- <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
- <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-blur">DOM L3</a></dd>
- <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
- <dd style="margin: 0 0 0 120px;">{{domxref("FocusEvent")}}</dd>
- <dt style="float: left; text-align: right; width: 120px;">Burbujas</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Objetivo</dt>
- <dd style="margin: 0 0 0 120px;">Element</dd>
- <dt style="float: left; text-align: right; width: 120px;">Acción por defecto</dt>
- <dd style="margin: 0 0 0 120px;">Ninguna.</dd>
-</dl>
-
-<p>{{NoteStart}}El valor de  {{domxref("Document.activeElement")}} varía a traves de navegadores mientras este evento está siendo manejado ({{bug(452307)}}): IE10 lo agrega al elemento al cual el foco se movera, mientras Firefox y Chrome muy seguido lo agregan al cuerpo del documento.{{NoteEnd}}</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedad</th>
-   <th scope="col">Tipo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyInline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>Objetivo del evento (elemento DOM)</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>El tipo de evento.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Si el elemento normalmente se propaga o no.</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Si el evento es cancelable o no.</td>
-  </tr>
-  <tr>
-   <td><code>relatedTarget</code> {{readonlyInline}}</td>
-   <td>{{domxref("EventTarget")}} (DOM element)</td>
-   <td>null</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Delegación_de_eventos">Delegación de eventos</h2>
-
-<p>Hay dos maneras de implementar la delegación de eventos para este evento: usando el evento <code>focusout</code> en exploradores que lo soporten, o cambiando el parámetro "useCapture" de <a href="/en-US/docs/DOM/element.addEventListener"><code>addEventListener</code></a> a <code>true</code>:</p>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush:html;">&lt;form id="form"&gt;
-  &lt;input type="text" placeholder="text input"&gt;
-  &lt;input type="password" placeholder="password"&gt;
-&lt;/form&gt;</pre>
-
-<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
-
-<pre class="brush: js">var form = document.getElementById("form");
-form.addEventListener("focus", function( event ) {
-  event.target.style.background = "pink";
-}, true);
-form.addEventListener("blur", function( event ) {
-  event.target.style.background = "";
-}, true);</pre>
-
-<p>{{EmbedLiveSample('Delegación_de_eventos')}}</p>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>5</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-   <td>6</td>
-   <td>12.1</td>
-   <td>5.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4.0</td>
-   <td>53</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.0</td>
-   <td>12.1</td>
-   <td>5.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Antes de Gecko 24 {{geckoRelease(24)}} la interfaz para este evento era {{domxref("Event")}}, no {{domxref("FocusEvent")}}. Vea ({{bug(855741)}}).</p>
-
-<h2 id="Eventos_relacionados">Eventos relacionados</h2>
-
-<ul>
- <li>{{event("focus")}}</li>
- <li>{{event("blur")}}</li>
- <li>{{event("focusin")}}</li>
- <li>{{event("focusout")}}</li>
-</ul>
diff --git a/files/es/web/events/domcontentloaded/index.html b/files/es/web/events/domcontentloaded/index.html
deleted file mode 100644
index ffbf3accbc..0000000000
--- a/files/es/web/events/domcontentloaded/index.html
+++ /dev/null
@@ -1,148 +0,0 @@
----
-title: DOMContentLoaded
-slug: Web/Events/DOMContentLoaded
-translation_of: Web/API/Window/DOMContentLoaded_event
----
-<p>El evento <code>DOMContentLoaded</code> es disparado cuando el documento HTML ha sido completamente cargado y parseado, sin esperar hojas de estilo, images y subframes para  finalizar la carga. Un evento muy diferente - <a href="/en-US/docs/Mozilla_event_reference/load"><code>load</code></a> - debería ser usado solo para detectar una carga completa de la página. Es un error increíblemente popular usar <a href="/en-US/docs/Mozilla_event_reference/load"><code>load</code></a> cuando <code>DOMContentLoaded</code> sería mucho más apropiado, así que úsalo con cuidado.</p>
-
-<p>JavaScript síncrono pausa el parseo del DOM.</p>
-
-<p>También hay mucho propósito general y bibliotecas autónomas que ofrecen métodos de navegador cruzado para detectar que el DOM está preparado.</p>
-
-<h2 id="Speeding_up">Speeding up</h2>
-
-<p>If you want DOM to get parsed as fast as possible after the user had requested the page, some things you could do is turn your <a href="https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests">JavaScript asynchronous</a> and to <a href="https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery">optimize loading of stylesheets</a> which if used as usual, slow down page load due to being loaded in parallel, "stealing" traffic from the main html document.</p>
-
-<h2 id="General_info">General info</h2>
-
-<dl>
- <dt style="width: 120px; text-align: right; float: left;">Specification</dt>
- <dd style="margin: 0px 0px 0px 120px;"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-end.html#the-end">HTML5</a></dd>
- <dt style="width: 120px; text-align: right; float: left;">Interface</dt>
- <dd style="margin: 0px 0px 0px 120px;">Event</dd>
- <dt style="width: 120px; text-align: right; float: left;">Bubbles</dt>
- <dd style="margin: 0px 0px 0px 120px;">Yes</dd>
- <dt style="width: 120px; text-align: right; float: left;">Cancelable</dt>
- <dd style="margin: 0px 0px 0px 120px;">Yes (although specified as a simple event that isn't cancelable)</dd>
- <dt style="width: 120px; text-align: right; float: left;">Target</dt>
- <dd style="margin: 0px 0px 0px 120px;">Document</dd>
- <dt style="width: 120px; text-align: right; float: left;">Default Action</dt>
- <dd style="margin: 0px 0px 0px 120px;">None.</dd>
-</dl>
-
-<h2 id="Properties">Properties</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col">Type</th>
-   <th scope="col">Description</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyInline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>The event target (the topmost target in the DOM tree).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The type of event.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event normally bubbles or not.</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event is cancellable or not.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Example">Example</h2>
-
-<pre class="brush: html">&lt;script&gt;
-  document.addEventListener("DOMContentLoaded", function(event) {
-    console.log("DOM fully loaded and parsed");
-  });
-&lt;/script&gt;
-</pre>
-
-<pre class="brush: html">&lt;script&gt;
-  document.addEventListener("DOMContentLoaded", function(event) {
-    console.log("DOM fully loaded and parsed");
-  });
-
-for(var i=0; i&lt;1000000000; i++)
-{} // this synchronous script is going to delay parsing of the DOM. So the DOMContentLoaded event is going to launch later.
-&lt;/script&gt;
-</pre>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0<sup>[1]</sup></td>
-   <td>{{CompatGeckoDesktop("1")}}<sup>[1]</sup></td>
-   <td>9.0<sup>[2]</sup></td>
-   <td>9.0</td>
-   <td>3.1<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-   <td>{{CompatGeckoMobile("1")}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}<sup>[2]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Bubbling for this event is supported by at least Gecko 1.9.2, Chrome 6, and Safari 4.</p>
-
-<p>[2] Internet Explorer 8 supports the <code>readystatechange</code> event, which can be used to detect when the DOM is ready. In earlier versions of Internet Explorer, this state can be detected by repeatedly trying to execute <code>document.documentElement.doScroll("left");</code>, as this snippet will throw an error until the DOM is ready.</p>
-
-<h2 id="Related_Events">Related Events</h2>
-
-<ul>
- <li>{{event("DOMContentLoaded")}}</li>
- <li>{{event("readystatechange")}}</li>
- <li>{{event("load")}}</li>
- <li>{{event("beforeunload")}}</li>
- <li>{{event("unload")}}</li>
-</ul>
diff --git a/files/es/web/events/load/index.html b/files/es/web/events/load/index.html
deleted file mode 100644
index f38e214839..0000000000
--- a/files/es/web/events/load/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: load
-slug: Web/Events/load
-tags:
-  - Evento
-translation_of: Web/API/Window/load_event
----
-<p>El evento <code>load</code> se dispara cuando un recurso y sus recursos dependientes han terminado de cargar.</p>
-
-<p> </p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 class="brush: html" id="Window">Window</h3>
-
-<pre class="brush: html">&lt;script&gt;
-  window.addEventListener("load", function(event) {
-    console.log("'Todos los recursos terminaron de cargar!");
-  });
-&lt;/script&gt;</pre>
-
-<h3 id="Elemento_script">Elemento <code>script</code></h3>
-
-<pre class="brush: html">&lt;script&gt;
-  var script = document.createElement("script");
-  script.addEventListener("load", function(event) {
-    console.log("Script terminó de cargarse y ejecutarse");
-  });
-  script.src = "http://example.com/example.js";
-  script.async = true;
-  document.getElementsByTagName("script")[0].parentNode.appendChild(script);
-&lt;/script&gt;</pre>
-
-<h2 id="Información_general">Información general</h2>
-
-<dl>
- <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
- <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-load">DOM L3</a></dd>
- <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
- <dd style="margin: 0 0 0 120px;">UIEvent</dd>
- <dt style="float: left; text-align: right; width: 120px;">Propagación</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Objetivo</dt>
- <dd style="margin: 0 0 0 120px;">Window,Document,Element</dd>
- <dt style="float: left; text-align: right; width: 120px;">Por defecto Acción</dt>
- <dd style="margin: 0 0 0 120px;">None.</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedad</th>
-   <th scope="col">Tipo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyInline}}</td>
-   <td><code>{{domxref("EventTarget")}}</code></td>
-   <td>El objetivo del evento (el objetivo superior en el árbol DOM).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyInline}}</td>
-   <td><code>{{domxref("DOMString")}}</code></td>
-   <td>El tipo de evento.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyInline}}</td>
-   <td><code>{{domxref("Boolean")}}</code></td>
-   <td>Si el elemento normalmente se propaga (bubbles) o no.</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyInline}}</td>
-   <td><code>{{domxref("Boolean")}}</code></td>
-   <td>Si el evento es cancelable o no.</td>
-  </tr>
-  <tr>
-   <td><code>view</code> {{readonlyInline}}</td>
-   <td><code>{{domxref("WindowProxy")}}</code></td>
-   <td><code>{{domxref("Document.defaultView", "document.defaultView")}}</code> (<code>window</code> del documento)</td>
-  </tr>
-  <tr>
-   <td><code>detail</code> {{readonlyInline}}</td>
-   <td><code>long</code> (<code>float</code>)</td>
-   <td>0.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('UI Events', '#event-type-load', 'load')}}</td>
-   <td>{{Spec2('UI Events')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'parsing.html#the-end:event-load', 'Load event')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Esto enlaza con la sección en los pasos que se llevan a cabo al final de cargar un documento. Los eventos 'load' también se disparan a muchos elementos. Y tenga en cuenta que hay muchos lugares en la especificación que hacen referencia a cosas que pueden "<a href="https://html.spec.whatwg.org/multipage/parsing.html#delay-the-load-event">retrasar el evento de carga</a>".</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Eventos_relacionados">Eventos relacionados</h2>
-
-<ul>
- <li>{{event("DOMContentLoaded")}}</li>
- <li>{{event("readystatechange")}}</li>
- <li>{{event("load")}}</li>
- <li>{{event("beforeunload")}}</li>
- <li>{{event("unload")}}</li>
-</ul>
diff --git a/files/es/web/events/loadend/index.html b/files/es/web/events/loadend/index.html
deleted file mode 100644
index 39e528634d..0000000000
--- a/files/es/web/events/loadend/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: loadend
-slug: Web/Events/loadend
-tags:
-  - eventos
-translation_of: Web/API/XMLHttpRequest/loadend_event
----
-<p>El evento <code>loadend</code> es emitido cuando el progreso de la carga de un recurso se ha detenido (e.g. despues que "error", "abort", o "load" han sido emitidos). Por ejemplo, esto aplica a las llamadas de {{domxref("XMLHttpRequest")}}, y al contenido de un elemento {{htmlelement("img")}} o {{htmlelement("video")}}.</p>
-
-<h2 id="Información_General">Información General</h2>
-
-<dl>
- <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
- <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/progress-events/">Progress</a></dd>
- <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
- <dd style="margin: 0 0 0 120px;">ProgressEvent</dd>
- <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Target</dt>
- <dd style="margin: 0 0 0 120px;">{{domxref("HTMLImageElement")}}, Por Ejemplo</dd>
- <dt style="float: left; text-align: right; width: 120px;">Acción por Defecto</dt>
- <dd style="margin: 0 0 0 120px;">None</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col">Type</th>
-   <th scope="col">Description</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyInline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>The event target (the topmost target in the DOM tree).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The type of event.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event normally bubbles or not.</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event is cancellable or not.</td>
-  </tr>
-  <tr>
-   <td><code>lengthComputable </code>{{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Specifies whether or not the total size of the transfer is known. Read only.</td>
-  </tr>
-  <tr>
-   <td><code>loaded</code> {{readonlyInline}}</td>
-   <td>unsigned long (long)</td>
-   <td>The number of bytes transferred since the beginning of the operation. This doesn't include headers and other overhead, but only the content itself. Read only.</td>
-  </tr>
-  <tr>
-   <td><code>total</code> {{readonlyInline}}</td>
-   <td>unsigned long (long)</td>
-   <td>The total number of bytes of content that will be transferred during the operation. If the total size is unknown, this value is zero. Read only.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Eventos_Relacionados">Eventos Relacionados</h2>
-
-<ul>
- <li>{{event("loadstart")}}</li>
- <li>{{event("progress")}}</li>
- <li>{{event("error")}}</li>
- <li>{{event("abort")}}</li>
- <li>{{event("load")}}</li>
- <li>{{event("loadend")}}</li>
-</ul>
-
-<h2 id="Ver_También">Ver También</h2>
-
-<ul>
- <li><a href="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress" title="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest">Monitoreando progreso</a></li>
-</ul>
diff --git a/files/es/web/events/pointerlockchange/index.html b/files/es/web/events/pointerlockchange/index.html
deleted file mode 100644
index 2d5af4205b..0000000000
--- a/files/es/web/events/pointerlockchange/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: pointerlockchange
-slug: Web/Events/pointerlockchange
-translation_of: Web/API/Document/pointerlockchange_event
----
-<p>El evento <code>pointerlockchange</code> es disparado cuando el cursor del navegador es bloqueado o desbloqueado.</p>
-
-<h2 id="Información_general">Información general</h2>
-
-<dl>
- <dt style="float: left; text-align: right; width: 120px;">Specification</dt>
- <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/pointerlock/#pointerlockchange-and-pointerlockerror-events">Pointer Lock</a></dd>
- <dt style="float: left; text-align: right; width: 120px;">Interface</dt>
- <dd style="margin: 0 0 0 120px;">Event</dd>
- <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt>
- <dd style="margin: 0 0 0 120px;">Yes</dd>
- <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
- <dd style="margin: 0 0 0 120px;">No</dd>
- <dt style="float: left; text-align: right; width: 120px;">Target</dt>
- <dd style="margin: 0 0 0 120px;">Document</dd>
- <dt style="float: left; text-align: right; width: 120px;">Default Action</dt>
- <dd style="margin: 0 0 0 120px;">None</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col">Type</th>
-   <th scope="col">Description</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyInline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>The event target (the topmost target in the DOM tree).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The type of event.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event normally bubbles or not.</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event is cancellable or not.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush:js;">//Ten en cuenta que el nombre del evento, en este caso "pointerlockchange" puede variar según el navegador.
-document.addEventListener("pointerlockchange", function( event ) {
-    // El objetivo, parámetro "target", del objeto "event" es siempre el objeto "document".
-    // para recuperar el objeto que recibe el bloqueo/desbloqueo es document.pointerlockElement.
-    document.pointerLockElement;
-
-});
-</pre>
-
-<h2 id="Eventos_relacionados">Eventos relacionados</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Mozilla_event_reference/pointerlockerror"><code>pointerlockerror</code></a></li>
-</ul>
-
-<h2 id="Véase_también">Véase también:</h2>
-
-<ul>
- <li><a href="/en-US/docs/API/Pointer_Lock_API">Using Pointer Lock API</a></li>
-</ul>
diff --git a/files/es/web/events/transitioncancel/index.html b/files/es/web/events/transitioncancel/index.html
deleted file mode 100644
index 3f9c622bd2..0000000000
--- a/files/es/web/events/transitioncancel/index.html
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: transitioncancel
-slug: Web/Events/transitioncancel
-tags:
-  - DOM
-  - Evento
-  - Referencia
-  - eventos
-translation_of: Web/API/HTMLElement/transitioncancel_event
----
-<p>{{SeeCompatTable}}</p>
-
-<p>El evento <code>transitioncancel</code> es lanzado cuando una <a href="/en-US/docs/CSS/Using_CSS_transitions">transición CSS</a> es cancelada.</p>
-
-<p>Véase {{domxref("GlobalEventHandlers.ontransitioncancel")}} para mas información y ejemplos.</p>
-
-<h2 id="Información_general">Información general</h2>
-
-<dl>
- <dt>Interfaz</dt>
- <dd>{{domxref("TransitionEvent")}}</dd>
- <dt>Burbuja</dt>
- <dd>Sí</dd>
- <dt>Cancelable</dt>
- <dd>No</dd>
- <dt>Objetivo</dt>
- <dd>{{domxref("document")}}, {{domxref("element")}}</dd>
- <dt>Acción por defecto</dt>
- <dd>Ninguna</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedad</th>
-   <th scope="col">Tipo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyinline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>El objetivo del evento (the topmost target in the DOM tree).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyinline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>El tipo de evento.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyinline}}</td>
-   <td>{{domxref("Boolean")}}</td>
-   <td>Si el evento normalmente se propaga o no</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyinline}}</td>
-   <td>{{domxref("Boolean")}}</td>
-   <td>Si el evento es cancelable o no</td>
-  </tr>
-  <tr>
-   <td><code>propertyName</code>{{readonlyinline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>El nombre de la propiedad CSS asociada con la transición.</td>
-  </tr>
-  <tr>
-   <td><code>elapsedTime</code>{{readonlyinline}}</td>
-   <td>{{domxref("Float")}}</td>
-   <td>
-    <p>La cantidad de tiempo que ha durado la transición, en segundos, desde el momento en que el evento fué generado. Este valor no se ve afectado por el valor de <code>transition-delay</code>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>pseudoElement</code>{{readonlyinline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>
-    <p>El nombre (empezando con dos "dos puntos") del pseudo-elemento CSS en el que ha ocurrido la transición (en caso de que el objetivo del evento sea dicho pseudo-elemento correspondiente al elemento), o una cadena vacía si la transición ha ocurrido en un elemento (lo que quiere decir que el objetivo del evento es dicho elemento).</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Transitions', '#transitioncancel', 'transitioncancel')}}</td>
-   <td>{{Spec2('CSS3 Transitions')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop(53)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile(53)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>El manejador {{domxref("GlobalEventHandlers.ontransitioncancel")}}</li>
- <li>La interfaz {{domxref("TransitionEvent")}}</li>
- <li>{{event("transitionstart")}}, {{event("transitionend")}}</li>
- <li>Propiedades CSS: {{cssxref("transition")}}, {{cssxref("transition-delay")}}, {{cssxref("transition-duration")}}, {{cssxref("transition-property")}}, {{cssxref("transition-timing-function")}}.</li>
-</ul>
diff --git a/files/es/web/events/transitionend/index.html b/files/es/web/events/transitionend/index.html
deleted file mode 100644
index 8370f0e39e..0000000000
--- a/files/es/web/events/transitionend/index.html
+++ /dev/null
@@ -1,183 +0,0 @@
----
-title: transitionend
-slug: Web/Events/transitionend
-tags:
-  - DOM
-  - Event
-  - Referencia
-  - Transiciones CSS
-  - Transiciones CSS3
-  - TransitionEvent
-  - transitionend
-translation_of: Web/API/HTMLElement/transitionend_event
----
-<p>El evento <code>transitionend</code> es lanzado cuando una <a href="/en-US/docs/CSS/Using_CSS_transitions">transición CSS</a> se ha completado. Si la transición es eliminada antes de haberse completado, como cuando {{cssxref("transition-property")}} es eliminado o {{cssxref("display")}} se establece a <code>"none"</code>, entonces el evento no será generado.</p>
-
-<h2 id="Información_general">Información general</h2>
-
-<dl>
- <dt style="float: left; text-align: right; width: 120px;">Especificación</dt>
- <dd style="margin: 0 0 0 120px;">{{SpecName("CSS3 Transitions")}}</dd>
- <dt style="float: left; text-align: right; width: 120px;">Interfaz</dt>
- <dd style="margin: 0 0 0 120px;">{{domxref("TransitionEvent")}}</dd>
- <dt style="float: left; text-align: right; width: 120px;">Burbuja</dt>
- <dd style="margin: 0 0 0 120px;">Sí</dd>
- <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt>
- <dd style="margin: 0 0 0 120px;">Sí</dd>
- <dt style="float: left; text-align: right; width: 120px;">Objetivo</dt>
- <dd style="margin: 0 0 0 120px;">{{domxref("Element")}}, {{domxref("Document")}}, {{domxref("Window")}}</dd>
- <dt style="float: left; text-align: right; width: 120px;">Acción</dt>
- <dd style="margin: 0 0 0 120px;">undefined</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col">Type</th>
-   <th scope="col">Description</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>target</code> {{readonlyInline}}</td>
-   <td>{{domxref("EventTarget")}}</td>
-   <td>The event target (the topmost target in the DOM tree).</td>
-  </tr>
-  <tr>
-   <td><code>type</code> {{readonlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The type of event.</td>
-  </tr>
-  <tr>
-   <td><code>bubbles</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event normally bubbles or not.</td>
-  </tr>
-  <tr>
-   <td><code>cancelable</code> {{readonlyInline}}</td>
-   <td>{{jsxref("Boolean")}}</td>
-   <td>Whether the event is cancellable or not.</td>
-  </tr>
-  <tr>
-   <td><code>propertyName</code> {{readonlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The name of the CSS property associated with the transition.</td>
-  </tr>
-  <tr>
-   <td><code>elapsedTime</code> {{readonlyInline}}</td>
-   <td>Float</td>
-   <td>The amount of time the transition has been running, in seconds, as of the time the event was generated. This value is not affected by the value of <code>transition-delay</code>.</td>
-  </tr>
-  <tr>
-   <td><code>pseudoElement</code> {{readonlyInline}}</td>
-   <td>{{domxref("DOMString")}}</td>
-   <td>The name (beginning with two colons) of the CSS pseudo-element on which the transition occured (in which case the target of the event is that pseudo-element's corresponding element), or the empty string if the transition occurred on an element (which means the target of the event is that element).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Este ejemplo establece un manejador de evento para detectar el evento <code>transitionend</code>, y así cambiar el texto que se muestra dentro del elemento cuando la transición se completa.</p>
-
-<pre class="brush: js">let element = document.getElementById("slidingMenu");
-element.addEventListener("transitionend", function(event) {
-  element.innerHTML = "Done!";
-}, false);
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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 Transitions", "#transitionend", "transitionend")}}</td>
-   <td>{{Spec2('CSS3 Transitions')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0<sup>[1]</sup><br>
-    36</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.5<sup>[2]</sup><br>
-    12<br>
-    12.10<br>
-    23</td>
-   <td>3.2<sup>[1]</sup><br>
-    7.0.6</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.1</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10<sup>[2]</sup><br>
-    12<br>
-    12.10</td>
-   <td>3.2<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Implementado en Chrome 1.0, Android 2.1 y WebKit 3.2 como <code>webkitTransitionEnd</code>. Chrome 36 y WebKit 7.0.6 usan el estándar <code>transitionend</code>.</p>
-
-<p>[2] Implementado como <code>oTransitionEnd</code> desde Opera 10.5, como <code>otransitionend</code> desde la versión 12 y como el estándar <code>transitionend</code> desde la versión 12.10.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<p>La interfaz {{domxref("TransitionEvent")}}</p>
-
-<ul>
- <li>{{event("transitionstart")}}, {{event("transitioncancel")}}</li>
- <li>Propiedades CSS: {{cssxref("transition")}}, {{cssxref("transition-delay")}}, {{cssxref("transition-duration")}}, {{cssxref("transition-property")}}, {{cssxref("transition-timing-function")}}.</li>
-</ul>
diff --git a/files/es/web/guide/ajax/community/index.html b/files/es/web/guide/ajax/community/index.html
new file mode 100644
index 0000000000..99045816b9
--- /dev/null
+++ b/files/es/web/guide/ajax/community/index.html
@@ -0,0 +1,45 @@
+---
+title: Comunidad
+slug: Web/Guide/AJAX/Community
+tags:
+  - AJAX
+  - Todas_las_Categorías
+translation_of: Web/Guide/AJAX/Community
+original_slug: Web/Guide/AJAX/Comunidad
+---
+<p> </p>
+<p><br>
+ Si conoces alguna lista de correo, grupo de noticias, foro, o comunidad relacionada con AJAX que pueda ser de interés. Por favor, pon aquí un enlace.</p>
+<h3 id="Mozilla" name="Mozilla">Mozilla</h3>
+<ul>
+ <li>La comunidad Mozilla... en inglés</li>
+</ul>
+<p>{{ DiscussionList("dev-ajax", "mozilla.dev.ajax") }}</p>
+<h3 id="Listas_de_correo" name="Listas_de_correo">Listas de correo</h3>
+<ul>
+ <li> </li>
+</ul>
+<p> </p>
+<h3 id="Foros" name="Foros">Foros</h3>
+<ul>
+ <li><a class="external" href="http://www.forosdelweb.com/forumdisplay.php?f=77">AJAX</a> en
+  <i>
+   Foros del Web</i>
+ </li>
+</ul>
+<h3 id="Bit.C3.A1coras" name="Bit.C3.A1coras">Bitácoras</h3>
+<ul>
+ <li> </li>
+</ul>
+<p> </p>
+<h3 id="Wikis" name="Wikis">Wikis</h3>
+<ul>
+ <li> </li>
+</ul>
+<p> </p>
+<h3 id="Otros_Sitios" name="Otros_Sitios">Otros Sitios</h3>
+<ul>
+ <li> </li>
+</ul>
+<p> </p>
+<p><span class="comment">categorías</span></p>
diff --git a/files/es/web/guide/ajax/comunidad/index.html b/files/es/web/guide/ajax/comunidad/index.html
deleted file mode 100644
index 50a91de5a4..0000000000
--- a/files/es/web/guide/ajax/comunidad/index.html
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: Comunidad
-slug: Web/Guide/AJAX/Comunidad
-tags:
-  - AJAX
-  - Todas_las_Categorías
-translation_of: Web/Guide/AJAX/Community
----
-<p> </p>
-<p><br>
- Si conoces alguna lista de correo, grupo de noticias, foro, o comunidad relacionada con AJAX que pueda ser de interés. Por favor, pon aquí un enlace.</p>
-<h3 id="Mozilla" name="Mozilla">Mozilla</h3>
-<ul>
- <li>La comunidad Mozilla... en inglés</li>
-</ul>
-<p>{{ DiscussionList("dev-ajax", "mozilla.dev.ajax") }}</p>
-<h3 id="Listas_de_correo" name="Listas_de_correo">Listas de correo</h3>
-<ul>
- <li> </li>
-</ul>
-<p> </p>
-<h3 id="Foros" name="Foros">Foros</h3>
-<ul>
- <li><a class="external" href="http://www.forosdelweb.com/forumdisplay.php?f=77">AJAX</a> en
-  <i>
-   Foros del Web</i>
- </li>
-</ul>
-<h3 id="Bit.C3.A1coras" name="Bit.C3.A1coras">Bitácoras</h3>
-<ul>
- <li> </li>
-</ul>
-<p> </p>
-<h3 id="Wikis" name="Wikis">Wikis</h3>
-<ul>
- <li> </li>
-</ul>
-<p> </p>
-<h3 id="Otros_Sitios" name="Otros_Sitios">Otros Sitios</h3>
-<ul>
- <li> </li>
-</ul>
-<p> </p>
-<p><span class="comment">categorías</span></p>
diff --git a/files/es/web/guide/ajax/getting_started/index.html b/files/es/web/guide/ajax/getting_started/index.html
new file mode 100644
index 0000000000..b3d391e90d
--- /dev/null
+++ b/files/es/web/guide/ajax/getting_started/index.html
@@ -0,0 +1,232 @@
+---
+title: Primeros Pasos
+slug: Web/Guide/AJAX/Getting_Started
+tags:
+  - AJAX
+  - API
+  - Avanzado
+  - Todas_las_Categorías
+  - XMLHttpRequest
+translation_of: Web/Guide/AJAX/Getting_Started
+original_slug: Web/Guide/AJAX/Primeros_Pasos
+---
+<p> </p>
+
+<p>Este artículo es una guía básica sobre AJAX e incluye dos ejemplos.</p>
+
+<h3 id=".C2.BFQu.C3.A9_es_AJAX.3F" name=".C2.BFQu.C3.A9_es_AJAX.3F">¿Qué es AJAX?</h3>
+
+<p>AJAX (JavaScript Asíncrono y XML) es un término nuevo para describir dos capacidades de los navegadores que han estado presentes por años, pero que habían sido ignoradas por muchos desarrolladores Web, hasta hace poco que surgieron aplicaciones como Gmail, Google suggest y Google Maps.</p>
+
+<p>Las dos capacidades en cuestión son:</p>
+
+<ul>
+ <li>La posibilidad de hacer peticiones al servidor sin tener que volver a cargar la página.</li>
+ <li>La posibilidad de analizar y trabajar con documentos XML.</li>
+</ul>
+
+<h3 id="Primer_Paso_.E2.80.93_C.C3.B3mo_realizar_una_petici.C3.B3n_HTTP_al_servidor" name="Primer_Paso_.E2.80.93_C.C3.B3mo_realizar_una_petici.C3.B3n_HTTP_al_servidor">Primer Paso – Cómo realizar una petición HTTP al servidor</h3>
+
+<p>Para realizar una petición HTTP usando JavaScript, es necesario crear una instancia de una clase que provea esta funcionalidad. Esta clase fue inicialmente introducida en Internet Explorer como un objeto ActiveX, llamado <code>XMLHTTP</code>. Después Mozilla, Safari y otros navegadores lo siguieron, implementando una clase <code>XMLHttpRequest</code> que soportaba los métodos y las propiedades del objeto ActiveX original.</p>
+
+<p>Como resultado, para crear una instancia de la clase requerida que funcione en todos los navegadores, es necesario poner:</p>
+
+<pre>if (window.XMLHttpRequest) { // Mozilla, Safari, ...
+    http_request = new XMLHttpRequest();
+} else if (window.ActiveXObject) { // IE
+    http_request = new ActiveXObject("Microsoft.XMLHTTP");
+}
+</pre>
+
+<p>(El código mostrado es una versión simplificada con fines ilustrativos. Para un ejemplo más realista ver el paso 3 de este artículo.)</p>
+
+<p>Algunas versiones de los navegadores Mozilla no funcionan correctamente si la respuesta del servidor no tiene la cabecera mime de tipo XML. En ese caso es posible usar un método extra que sobreescriba la cabecera enviada por el servidor, en caso que no sea <code>text/xml</code>.</p>
+
+<pre>http_request = new XMLHttpRequest();
+http_request.overrideMimeType('text/xml');
+</pre>
+
+<p>El próximo paso es decidir qué se hará después de recibir la respuesta del servidor a la petición enviada. A estas alturas sólo es necesario decirle al objeto HTTPrequest qué función de JavaScript se encargará de procesar la respuesta. Para esto se asigna la propiedad <code>onreadystatechange</code> del objeto al nombre de la función de JavaScript que se va a utilizar:</p>
+
+<p><code>http_request.onreadystatechange = nameOfTheFunction;</code></p>
+
+<p>Es importante notar que no hay paréntesis después del nombre de la función y no se pasa ningún parámetro. También es posible definir la función en ese momento, y poner en seguida las acciones que procesarán la respuesta:</p>
+
+<pre>http_request.onreadystatechange = function(){
+    // procesar la respuesta
+};
+</pre>
+
+<p>Después de especificar qué pasará al recibir la respuesta es necesario hacer la petición. Para esto se utilizan los métodos <code>open()</code> y <code>send()</code> de la clase HTTP request, como se muestra a continuación:</p>
+
+<pre>http_request.open('GET', 'http://www.example.org/algun.archivo', true);
+http_request.send();
+</pre>
+
+<ul>
+ <li>El primer parámetro de la llamada a <code>open()</code> es el método HTTP request – GET, POST, HEAD o cualquier otro método que se quiera usar y sea aceptado por el servidor. El nombre del método se escribe en mayúsculas, sino algunos navegadores (como Firefox) podrían no procesar la petición. Para más información sobre los métodos HTTP request visitar <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html">W3C specs</a></li>
+ <li>El segundo parámetro es el URL de la página que se esta pidiendo. Por medida de seguridad no es posible llamar páginas en dominios de terceras personas. Se debe saber el dominio exacto de todas las páginas o se obtendrá un error de 'permiso denegado' al llamar open(). Una falla común es acceder al sitio por domain.tld e intentar llamar las páginas como www.domain.tld.</li>
+ <li>El tercer parámetro establece si la petición es asíncrona. Si se define <code>TRUE</code>, la ejecución de la función de JavaScript continuará aún cuando la respuesta del servidor no haya llegado. Por esta capacidad es la A en AJAX.</li>
+</ul>
+
+<p>El parámetro en el método <code>send()</code>puede ser cualquier información que se quiera enviar al servidor si se usa POST para la petición. La información se debe enviar en forma de cadena, por ejemplo:</p>
+
+<p><code>name=value&amp;anothername=othervalue&amp;so=on</code></p>
+
+<p>Si se quiere enviar información de esta forma, es necesario cambiar el tipo MIME de la petición usando la siguiente línea:</p>
+
+<pre>http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+</pre>
+
+<p>De otro modo el servidor descartará la información.</p>
+
+<h3 id="Segundo_Paso_.E2.80.93_Procesando_la_respuesta_del_servidor" name="Segundo_Paso_.E2.80.93_Procesando_la_respuesta_del_servidor">Segundo Paso – Procesando la respuesta del servidor</h3>
+
+<p>Al enviar la petición HTTP es necesario indicar el nombre de la función JavaScript que procesará la respuesta.</p>
+
+<p><code>http_request.onreadystatechange = nameOfTheFunction;</code></p>
+
+<p>A continuación se verá lo que esta función realiza. En primer lugar necesita revisar el estado de la petición. Si el estado tiene el valor 4, significa que la respuesta completa del servidor ha sido recibida y es posible continuar procesándola.</p>
+
+<pre>if (http_request.readyState == 4) {
+    // todo va bien, respuesta recibida
+} else {
+    // aun no esta listo
+}
+</pre>
+
+<p>La lista completa de valores para la propiedad <code>readyState</code> es:</p>
+
+<ul>
+ <li>0 (no inicializada)</li>
+ <li>1 (leyendo)</li>
+ <li>2 (leido)</li>
+ <li>3 (interactiva)</li>
+ <li>4 (completo)</li>
+</ul>
+
+<p>(<a class="external" href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/readystate_1.asp">Source</a>)</p>
+
+<p>Ahora es necesario revisar el código de status de la respuesta HTTP. La lista completa de códigos aparece en el <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html">sitio de la W3C</a>. Para el próposito de este artículo sólo es importante el código <code>200 OK</code>.</p>
+
+<pre>if (http_request.status == 200) {
+    // perfect!
+} else {
+    // hubo algún problema con la petición,
+    // por ejemplo código de respuesta 404 (Archivo no encontrado)
+    // o 500 (Internal Server Error)
+}
+</pre>
+
+<p>Después de haber revisado el estado de la petición y el código de status de la respuesta, depende de uno hacer cualquier cosa con la información que el servidor ha entregado. Existen dos opciones para tener acceso a esa información:</p>
+
+<ul>
+ <li><code>http_request.responseText</code> – regresará la respuesta del servidor como una cadena de texto.</li>
+ <li><code>http_request.responseXML</code> – regresará la respuesta del servidor como un objeto <code>XMLDocument</code> que se puede recorrer usando las funciones de JavaScript DOM.</li>
+</ul>
+
+<h3 id="Tercer_Paso_.E2.80.93_.22.C2.A1Ahora_todo_junto.21.22_-_Un_sencillo_ejemplo" name="Tercer_Paso_.E2.80.93_.22.C2.A1Ahora_todo_junto.21.22_-_Un_sencillo_ejemplo">Tercer Paso – "¡Ahora todo junto!" - Un sencillo ejemplo</h3>
+
+<p>En este ejemplo se utilizará todo lo que se ha visto para hacer una petición HTTP. Se pedirá un documento HTML llamado <code>test.html</code>, que contiene el texto "Esto es una prueba." y después usaremos la función <code>alert()</code> con el contenido del archivo <code>test.html</code> .</p>
+
+<pre>&lt;script type="text/javascript" language="javascript"&gt;
+
+    var http_request = false;
+
+    function makeRequest(url) {
+
+        http_request = false;
+
+        if (window.XMLHttpRequest) { // Mozilla, Safari,...
+            http_request = new XMLHttpRequest();
+            if (http_request.overrideMimeType) {
+                http_request.overrideMimeType('text/xml');
+                // Ver nota sobre esta linea al final
+            }
+        } else if (window.ActiveXObject) { // IE
+            try {
+                http_request = new ActiveXObject("Msxml2.XMLHTTP");
+            } catch (e) {
+                try {
+                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
+                } catch (e) {}
+            }
+        }
+
+        if (!http_request) {
+            alert('Falla :( No es posible crear una instancia XMLHTTP');
+            return false;
+        }
+        http_request.onreadystatechange = alertContents;
+        http_request.open('GET', url, true);
+        http_request.send();
+
+    }
+
+    function alertContents() {
+
+        if (http_request.readyState == 4) {
+            if (http_request.status == 200) {
+                alert(http_request.responseText);
+            } else {
+                alert('Hubo problemas con la petición.');
+            }
+        }
+
+    }
+&lt;/script&gt;
+&lt;span
+    style="cursor: pointer; text-decoration: underline"
+    onclick="makeRequest('test.html')"&gt;
+        Hacer una petición
+&lt;/span&gt;
+</pre>
+
+<p>En este ejemplo:</p>
+
+<ul>
+ <li>El usuario presiona el vínculo "Hacer una petición" en el navegador;</li>
+ <li>Esto llama la función <code>makeRequest()</code> que tiene como parámetro <code>test.html</code> que es un archivo HTML localizado en el mismo directorio;</li>
+ <li>La petición es realizada y después (<code>onreadystatechange</code>) la ejecución pasa a <code>alertContents()</code>;</li>
+ <li><code>alertContents()</code> verifica si la respuesta fue recibida y si es OK, si es así utiliza <code>alert()</code> con el contenido de <code>test.html</code>.</li>
+</ul>
+
+<p>Puedes probar el ejemplo <a class="external" href="http://www.w3clubs.com/mozdev/httprequest_test.html">aquí</a> y puedes ver el archivo de prueba <a class="external" href="http://www.w3clubs.com/mozdev/test.html">aquí</a>.</p>
+
+<p><strong>Nota</strong>: La línea <code> http_request.overrideMimeType('text/xml');</code> arriba causaría problemas en la consola de Javascript de Firefox 1.5b, como esta descrito en <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=311724" rel="freelink">https://bugzilla.mozilla.org/show_bug.cgi?id=311724</a>, si la página llamada por XMLHttpRequest no es XML válido (por ejemplo, si es texto).</p>
+
+<p>Si se obtiene Syntax Error o Not Well Formed Error en el navegador, y no se está intentando cargar una página XML con XMLHttpRequest, se puede eliminar esa línea del código.</p>
+
+<h3 id="Cuarto_Paso_.E2.80.93_Trabajando_con_la_respuesta_XML" name="Cuarto_Paso_.E2.80.93_Trabajando_con_la_respuesta_XML">Cuarto Paso – Trabajando con la respuesta XML</h3>
+
+<p>En el ejemplo anterior se utilizo la propiedad <code>reponseText</code> del objeto pedido para mostrar el contenido de <code>test.html</code> una vez que la respuesta HTTP había sido recibida. En éste se utilizará la propiedad <code>responseXML</code>.</p>
+
+<p>Primero hay que crear un documento de XML válido. El documento (test.xml) contiene lo siguiente:</p>
+
+<pre>&lt;?xml version="1.0" ?&gt;
+&lt;root&gt;
+    Esto es una prueba.
+&lt;/root&gt;
+</pre>
+
+<p>Para que funcione el script solo es necesario cambiar la línea de petición por:</p>
+
+<pre>...
+onclick="makeRequest('test.xml')"&gt;
+...
+</pre>
+
+<p>Y en <code>alertContents()</code> es necerario remplazar la línea donde aparece <code>alert(http_request.responseText);</code> por:</p>
+
+<pre>var xmldoc = http_request.responseXML;
+var root_node = xmldoc.getElementsByTagName('root').item(0);
+alert(root_node.firstChild.data);
+</pre>
+
+<p>De esta manera se utiliza el objeto <code>XMLDocument</code> dado por <code>responseXML</code> y se usan métodos del DOM para acceder a la información contenida en el documento XML. El archivo <code>test.xml</code> se encuentra <a class="external" href="http://www.w3clubs.com/mozdev/test.xml">aquí</a> y el script actualizado está <a class="external" href="http://www.w3clubs.com/mozdev/httprequest_test_xml.html">aquí</a>.</p>
+
+<p>Para más información sobre los metodos del DOM, visita los documentos de la <a class="external" href="http://www.mozilla.org/docs/dom/">implementación del DOM de Mozilla</a>.</p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "ca": "ca/AJAX/Primers_passos", "de": "de/AJAX/Getting_Started", "en": "en/AJAX/Getting_Started", "fr": "fr/AJAX/Premiers_pas", "it": "it/AJAX/Iniziare", "ja": "ja/AJAX/Getting_Started", "ko": "ko/AJAX/Getting_Started", "pl": "pl/AJAX/Na_pocz\u0105tek", "pt": "pt/AJAX/Como_come\u00e7ar", "ru": "ru/AJAX/\u0421_\u0447\u0435\u0433\u043e_\u043d\u0430\u0447\u0430\u0442\u044c", "zh-cn": "cn/AJAX/\u5f00\u59cb", "zh-tw": "zh_tw/AJAX/\u4e0a\u624b\u7bc7" } ) }}</p>
diff --git a/files/es/web/guide/ajax/primeros_pasos/index.html b/files/es/web/guide/ajax/primeros_pasos/index.html
deleted file mode 100644
index ed2bbbc33f..0000000000
--- a/files/es/web/guide/ajax/primeros_pasos/index.html
+++ /dev/null
@@ -1,231 +0,0 @@
----
-title: Primeros Pasos
-slug: Web/Guide/AJAX/Primeros_Pasos
-tags:
-  - AJAX
-  - API
-  - Avanzado
-  - Todas_las_Categorías
-  - XMLHttpRequest
-translation_of: Web/Guide/AJAX/Getting_Started
----
-<p> </p>
-
-<p>Este artículo es una guía básica sobre AJAX e incluye dos ejemplos.</p>
-
-<h3 id=".C2.BFQu.C3.A9_es_AJAX.3F" name=".C2.BFQu.C3.A9_es_AJAX.3F">¿Qué es AJAX?</h3>
-
-<p>AJAX (JavaScript Asíncrono y XML) es un término nuevo para describir dos capacidades de los navegadores que han estado presentes por años, pero que habían sido ignoradas por muchos desarrolladores Web, hasta hace poco que surgieron aplicaciones como Gmail, Google suggest y Google Maps.</p>
-
-<p>Las dos capacidades en cuestión son:</p>
-
-<ul>
- <li>La posibilidad de hacer peticiones al servidor sin tener que volver a cargar la página.</li>
- <li>La posibilidad de analizar y trabajar con documentos XML.</li>
-</ul>
-
-<h3 id="Primer_Paso_.E2.80.93_C.C3.B3mo_realizar_una_petici.C3.B3n_HTTP_al_servidor" name="Primer_Paso_.E2.80.93_C.C3.B3mo_realizar_una_petici.C3.B3n_HTTP_al_servidor">Primer Paso – Cómo realizar una petición HTTP al servidor</h3>
-
-<p>Para realizar una petición HTTP usando JavaScript, es necesario crear una instancia de una clase que provea esta funcionalidad. Esta clase fue inicialmente introducida en Internet Explorer como un objeto ActiveX, llamado <code>XMLHTTP</code>. Después Mozilla, Safari y otros navegadores lo siguieron, implementando una clase <code>XMLHttpRequest</code> que soportaba los métodos y las propiedades del objeto ActiveX original.</p>
-
-<p>Como resultado, para crear una instancia de la clase requerida que funcione en todos los navegadores, es necesario poner:</p>
-
-<pre>if (window.XMLHttpRequest) { // Mozilla, Safari, ...
-    http_request = new XMLHttpRequest();
-} else if (window.ActiveXObject) { // IE
-    http_request = new ActiveXObject("Microsoft.XMLHTTP");
-}
-</pre>
-
-<p>(El código mostrado es una versión simplificada con fines ilustrativos. Para un ejemplo más realista ver el paso 3 de este artículo.)</p>
-
-<p>Algunas versiones de los navegadores Mozilla no funcionan correctamente si la respuesta del servidor no tiene la cabecera mime de tipo XML. En ese caso es posible usar un método extra que sobreescriba la cabecera enviada por el servidor, en caso que no sea <code>text/xml</code>.</p>
-
-<pre>http_request = new XMLHttpRequest();
-http_request.overrideMimeType('text/xml');
-</pre>
-
-<p>El próximo paso es decidir qué se hará después de recibir la respuesta del servidor a la petición enviada. A estas alturas sólo es necesario decirle al objeto HTTPrequest qué función de JavaScript se encargará de procesar la respuesta. Para esto se asigna la propiedad <code>onreadystatechange</code> del objeto al nombre de la función de JavaScript que se va a utilizar:</p>
-
-<p><code>http_request.onreadystatechange = nameOfTheFunction;</code></p>
-
-<p>Es importante notar que no hay paréntesis después del nombre de la función y no se pasa ningún parámetro. También es posible definir la función en ese momento, y poner en seguida las acciones que procesarán la respuesta:</p>
-
-<pre>http_request.onreadystatechange = function(){
-    // procesar la respuesta
-};
-</pre>
-
-<p>Después de especificar qué pasará al recibir la respuesta es necesario hacer la petición. Para esto se utilizan los métodos <code>open()</code> y <code>send()</code> de la clase HTTP request, como se muestra a continuación:</p>
-
-<pre>http_request.open('GET', 'http://www.example.org/algun.archivo', true);
-http_request.send();
-</pre>
-
-<ul>
- <li>El primer parámetro de la llamada a <code>open()</code> es el método HTTP request – GET, POST, HEAD o cualquier otro método que se quiera usar y sea aceptado por el servidor. El nombre del método se escribe en mayúsculas, sino algunos navegadores (como Firefox) podrían no procesar la petición. Para más información sobre los métodos HTTP request visitar <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html">W3C specs</a></li>
- <li>El segundo parámetro es el URL de la página que se esta pidiendo. Por medida de seguridad no es posible llamar páginas en dominios de terceras personas. Se debe saber el dominio exacto de todas las páginas o se obtendrá un error de 'permiso denegado' al llamar open(). Una falla común es acceder al sitio por domain.tld e intentar llamar las páginas como www.domain.tld.</li>
- <li>El tercer parámetro establece si la petición es asíncrona. Si se define <code>TRUE</code>, la ejecución de la función de JavaScript continuará aún cuando la respuesta del servidor no haya llegado. Por esta capacidad es la A en AJAX.</li>
-</ul>
-
-<p>El parámetro en el método <code>send()</code>puede ser cualquier información que se quiera enviar al servidor si se usa POST para la petición. La información se debe enviar en forma de cadena, por ejemplo:</p>
-
-<p><code>name=value&amp;anothername=othervalue&amp;so=on</code></p>
-
-<p>Si se quiere enviar información de esta forma, es necesario cambiar el tipo MIME de la petición usando la siguiente línea:</p>
-
-<pre>http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
-</pre>
-
-<p>De otro modo el servidor descartará la información.</p>
-
-<h3 id="Segundo_Paso_.E2.80.93_Procesando_la_respuesta_del_servidor" name="Segundo_Paso_.E2.80.93_Procesando_la_respuesta_del_servidor">Segundo Paso – Procesando la respuesta del servidor</h3>
-
-<p>Al enviar la petición HTTP es necesario indicar el nombre de la función JavaScript que procesará la respuesta.</p>
-
-<p><code>http_request.onreadystatechange = nameOfTheFunction;</code></p>
-
-<p>A continuación se verá lo que esta función realiza. En primer lugar necesita revisar el estado de la petición. Si el estado tiene el valor 4, significa que la respuesta completa del servidor ha sido recibida y es posible continuar procesándola.</p>
-
-<pre>if (http_request.readyState == 4) {
-    // todo va bien, respuesta recibida
-} else {
-    // aun no esta listo
-}
-</pre>
-
-<p>La lista completa de valores para la propiedad <code>readyState</code> es:</p>
-
-<ul>
- <li>0 (no inicializada)</li>
- <li>1 (leyendo)</li>
- <li>2 (leido)</li>
- <li>3 (interactiva)</li>
- <li>4 (completo)</li>
-</ul>
-
-<p>(<a class="external" href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/readystate_1.asp">Source</a>)</p>
-
-<p>Ahora es necesario revisar el código de status de la respuesta HTTP. La lista completa de códigos aparece en el <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html">sitio de la W3C</a>. Para el próposito de este artículo sólo es importante el código <code>200 OK</code>.</p>
-
-<pre>if (http_request.status == 200) {
-    // perfect!
-} else {
-    // hubo algún problema con la petición,
-    // por ejemplo código de respuesta 404 (Archivo no encontrado)
-    // o 500 (Internal Server Error)
-}
-</pre>
-
-<p>Después de haber revisado el estado de la petición y el código de status de la respuesta, depende de uno hacer cualquier cosa con la información que el servidor ha entregado. Existen dos opciones para tener acceso a esa información:</p>
-
-<ul>
- <li><code>http_request.responseText</code> – regresará la respuesta del servidor como una cadena de texto.</li>
- <li><code>http_request.responseXML</code> – regresará la respuesta del servidor como un objeto <code>XMLDocument</code> que se puede recorrer usando las funciones de JavaScript DOM.</li>
-</ul>
-
-<h3 id="Tercer_Paso_.E2.80.93_.22.C2.A1Ahora_todo_junto.21.22_-_Un_sencillo_ejemplo" name="Tercer_Paso_.E2.80.93_.22.C2.A1Ahora_todo_junto.21.22_-_Un_sencillo_ejemplo">Tercer Paso – "¡Ahora todo junto!" - Un sencillo ejemplo</h3>
-
-<p>En este ejemplo se utilizará todo lo que se ha visto para hacer una petición HTTP. Se pedirá un documento HTML llamado <code>test.html</code>, que contiene el texto "Esto es una prueba." y después usaremos la función <code>alert()</code> con el contenido del archivo <code>test.html</code> .</p>
-
-<pre>&lt;script type="text/javascript" language="javascript"&gt;
-
-    var http_request = false;
-
-    function makeRequest(url) {
-
-        http_request = false;
-
-        if (window.XMLHttpRequest) { // Mozilla, Safari,...
-            http_request = new XMLHttpRequest();
-            if (http_request.overrideMimeType) {
-                http_request.overrideMimeType('text/xml');
-                // Ver nota sobre esta linea al final
-            }
-        } else if (window.ActiveXObject) { // IE
-            try {
-                http_request = new ActiveXObject("Msxml2.XMLHTTP");
-            } catch (e) {
-                try {
-                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
-                } catch (e) {}
-            }
-        }
-
-        if (!http_request) {
-            alert('Falla :( No es posible crear una instancia XMLHTTP');
-            return false;
-        }
-        http_request.onreadystatechange = alertContents;
-        http_request.open('GET', url, true);
-        http_request.send();
-
-    }
-
-    function alertContents() {
-
-        if (http_request.readyState == 4) {
-            if (http_request.status == 200) {
-                alert(http_request.responseText);
-            } else {
-                alert('Hubo problemas con la petición.');
-            }
-        }
-
-    }
-&lt;/script&gt;
-&lt;span
-    style="cursor: pointer; text-decoration: underline"
-    onclick="makeRequest('test.html')"&gt;
-        Hacer una petición
-&lt;/span&gt;
-</pre>
-
-<p>En este ejemplo:</p>
-
-<ul>
- <li>El usuario presiona el vínculo "Hacer una petición" en el navegador;</li>
- <li>Esto llama la función <code>makeRequest()</code> que tiene como parámetro <code>test.html</code> que es un archivo HTML localizado en el mismo directorio;</li>
- <li>La petición es realizada y después (<code>onreadystatechange</code>) la ejecución pasa a <code>alertContents()</code>;</li>
- <li><code>alertContents()</code> verifica si la respuesta fue recibida y si es OK, si es así utiliza <code>alert()</code> con el contenido de <code>test.html</code>.</li>
-</ul>
-
-<p>Puedes probar el ejemplo <a class="external" href="http://www.w3clubs.com/mozdev/httprequest_test.html">aquí</a> y puedes ver el archivo de prueba <a class="external" href="http://www.w3clubs.com/mozdev/test.html">aquí</a>.</p>
-
-<p><strong>Nota</strong>: La línea <code> http_request.overrideMimeType('text/xml');</code> arriba causaría problemas en la consola de Javascript de Firefox 1.5b, como esta descrito en <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=311724" rel="freelink">https://bugzilla.mozilla.org/show_bug.cgi?id=311724</a>, si la página llamada por XMLHttpRequest no es XML válido (por ejemplo, si es texto).</p>
-
-<p>Si se obtiene Syntax Error o Not Well Formed Error en el navegador, y no se está intentando cargar una página XML con XMLHttpRequest, se puede eliminar esa línea del código.</p>
-
-<h3 id="Cuarto_Paso_.E2.80.93_Trabajando_con_la_respuesta_XML" name="Cuarto_Paso_.E2.80.93_Trabajando_con_la_respuesta_XML">Cuarto Paso – Trabajando con la respuesta XML</h3>
-
-<p>En el ejemplo anterior se utilizo la propiedad <code>reponseText</code> del objeto pedido para mostrar el contenido de <code>test.html</code> una vez que la respuesta HTTP había sido recibida. En éste se utilizará la propiedad <code>responseXML</code>.</p>
-
-<p>Primero hay que crear un documento de XML válido. El documento (test.xml) contiene lo siguiente:</p>
-
-<pre>&lt;?xml version="1.0" ?&gt;
-&lt;root&gt;
-    Esto es una prueba.
-&lt;/root&gt;
-</pre>
-
-<p>Para que funcione el script solo es necesario cambiar la línea de petición por:</p>
-
-<pre>...
-onclick="makeRequest('test.xml')"&gt;
-...
-</pre>
-
-<p>Y en <code>alertContents()</code> es necerario remplazar la línea donde aparece <code>alert(http_request.responseText);</code> por:</p>
-
-<pre>var xmldoc = http_request.responseXML;
-var root_node = xmldoc.getElementsByTagName('root').item(0);
-alert(root_node.firstChild.data);
-</pre>
-
-<p>De esta manera se utiliza el objeto <code>XMLDocument</code> dado por <code>responseXML</code> y se usan métodos del DOM para acceder a la información contenida en el documento XML. El archivo <code>test.xml</code> se encuentra <a class="external" href="http://www.w3clubs.com/mozdev/test.xml">aquí</a> y el script actualizado está <a class="external" href="http://www.w3clubs.com/mozdev/httprequest_test_xml.html">aquí</a>.</p>
-
-<p>Para más información sobre los metodos del DOM, visita los documentos de la <a class="external" href="http://www.mozilla.org/docs/dom/">implementación del DOM de Mozilla</a>.</p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "ca": "ca/AJAX/Primers_passos", "de": "de/AJAX/Getting_Started", "en": "en/AJAX/Getting_Started", "fr": "fr/AJAX/Premiers_pas", "it": "it/AJAX/Iniziare", "ja": "ja/AJAX/Getting_Started", "ko": "ko/AJAX/Getting_Started", "pl": "pl/AJAX/Na_pocz\u0105tek", "pt": "pt/AJAX/Como_come\u00e7ar", "ru": "ru/AJAX/\u0421_\u0447\u0435\u0433\u043e_\u043d\u0430\u0447\u0430\u0442\u044c", "zh-cn": "cn/AJAX/\u5f00\u59cb", "zh-tw": "zh_tw/AJAX/\u4e0a\u624b\u7bc7" } ) }}</p>
diff --git a/files/es/web/guide/api/dom/events/orientation_and_motion_data_explained/orientation_and_motion_data_explained/index.html b/files/es/web/guide/api/dom/events/orientation_and_motion_data_explained/orientation_and_motion_data_explained/index.html
deleted file mode 100644
index 7f8fe2155c..0000000000
--- a/files/es/web/guide/api/dom/events/orientation_and_motion_data_explained/orientation_and_motion_data_explained/index.html
+++ /dev/null
@@ -1,48 +0,0 @@
----
-title: Explicación de los datos de orientación y movimiento
-slug: >-
-  Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained/Orientation_and_motion_data_explained
-translation_of: Web/Guide/Events/Orientation_and_motion_data_explained
----
-<p>{{ Draft() }}</p>
-<h2 id="Sumario">Sumario</h2>
-<p>Cuando se utiliza la orientación y los eventos de movimiento, es importante entender cuáles son los significados de los valores en el navegador. En este artículo se proporciona información acerca de los sistemas de coordenadas en el juego y la forma de usarlos.</p>
-<div class="warning">
-  <p><strong>Atención:</strong> Actualmente, Firefox y Chrome no soporta la orientación de la misma forma. Ten cuidado con esto cuando sea imprementado en un navegador u otro.</p>
-</div>
-<h2 id="Acerca_de_los_marcos_de_coordenadas">Acerca de los marcos de coordenadas</h2>
-<p>Un marco de coordenadas en un sistema en el que la orientacion de los tres ejers (X, Y y Z) se definen en referencia a un objeto. Hay dos marcos de coordenadas a considerar cuando se utiliza eventos de orientación y el movimiento:</p>
-<h3 id="Marco_de_coordenadas_terrestres">Marco de coordenadas terrestres</h3>
-<p>El marco de coordenadas de terrestres es el sistema de coordenadas fijado en el centro de la Tierra, es decir, los ejes están alineados sobre la base de la fuerza de la gravedad y la orientación norte magnético estándar. Utilizamos las letras mayúsculas ("X", "Y" y "Z") para describir los ejes del sistema de coordenadas terrestre.</p>
-<ul>
-  <li>El eje <strong>X</strong> sigue a lo largo (profuncidad) del plano de tierra, perpendicular al eje Y y positiva hacia el este (y por lo tanto negativa hacia el oeste).</li>
-  <li>El eje <strong>Y</strong> sigue a lo largo(ancho) del plano de tierra, y es positivo hacia el norte verdadero (es decir, el Polo Norte, el norte no es magnético) y negativo hacia la verdadera sur.</li>
-  <li>El eje <strong>Z</strong> es perpendicular al plano de tierra, piensa en él como una línea trazada entre el dispositivo y el centro de la Tierra. El valor de la coordenada Z es positivo hacia arriba (distancia desde el centro de la Tierra) y negativo hacia abajo (hacia el centro de la Tierra).</li>
-</ul>
-<p> </p>
-<p><img alt="" src="http://upload.wikimedia.org/wikipedia/commons/f/f6/Cartesian_xyz.png" style="width: 200px; height: 153px;"></p>
-<p> </p>
-<h3 id="Marco_de_coordenadas_del_dispositivo">Marco de coordenadas del dispositivo</h3>
-<p>El marco de coordenadas del dispositivo es el marco de la coordinación fijada en el centro del dispositivo. Utilizamos letras minúsculas ("x", "y" y "z") para describir los ejes de las coordenadas del del dispositivo</p>
-<p><img alt="axes.png" class="internal default" src="/@api/deki/files/5694/=axes.png" style=""></p>
-<ul>
-  <li>El eje <strong>x</strong> está en el plano de la pantalla y es positiva hacia la derecha y negativa hacia la izquierda.</li>
-  <li>El eje <strong>y</strong> está en el plano de la pantalla y es positiva hacia la parte superior y negativa hacia la parte inferior.</li>
-  <li>El eje <strong>z</strong> es perpendicular a la pantalla o teclado, y es positivo que se extiende hacia fuera de la pantalla.</li>
-</ul>
-<div class="note">
-  <strong>Nota:</strong> En un teléfono o tableta, la orientación del dispositivo siempre se considera en relación con la orientación estándar de la pantalla, lo que es la orientación "retrato" en la mayoría de los dispositivos. En una computadora portátil, la orientación se considera en relación con el teclado. Si desea detectar cambios en la orientación del dispositivo con el fin de compensar, se puede utilizar el evento orientationChange.</div>
-<h2 id="Sobre_la_rotación">Sobre la rotación</h2>
-<p>La rotación se describe alrededor de cualquier eje dado en términos del número de grados de diferencia entre el marco de coordenadas del dispositivo y el marco de coordenadas de la Tierra, y se mide en grados.</p>
-<h3 id="Alpha">Alpha</h3>
-<p>Rotación alrededor del eje z - es decir, girando el dispositivo - hace que el ángulo de rotación alfa cambie:</p>
-<p><img alt="alpha.png" class="internal default" src="/@api/deki/files/5695/=alpha.png" style=""></p>
-<p>El ángulo alfa es de 0 °, cuando la parte superior del dispositivo se apunta directamente hacia el polo norte de la Tierra, y aumenta a medida que el dispositivo se gira hacia la izquierda.</p>
-<h3 id="Beta">Beta</h3>
-<p>Rotación alrededor del eje X - es decir, inclinando el dispositivo desde o hacia el usuario - hace que el ángulo de giro beta cambie:</p>
-<p><img alt="beta.png" class="internal default" src="/@api/deki/files/5696/=beta.png"></p>
-<p>El ángulo beta es de 0 ° en la parte superior e inferior del dispositivo son la misma distancia de la superficie de la Tierra, y aumenta hacia 180 ° como el dispositivo se inclina hacia adelante y disminuye hacia -180 ° como el dispositivo se inclina hacia atrás.</p>
-<h3 id="Gamma">Gamma</h3>
-<p>Rotación alrededor del eje Y - es decir, la inclinación del dispositivo hacia la izquierda o hacia la derecha - hace que el ángulo de giro gamma cambie:</p>
-<p><img alt="gamma.png" class="internal default" src="/@api/deki/files/5697/=gamma.png"></p>
-<p>El ángulo gamma es 0 °, cuando los lados izquierdo y derecho del dispositivo son la misma distancia de la superficie de la Tierra, y aumenta hacia 90 ° como el dispositivo se inclina hacia la derecha, y hacia -90 ° como el dispositivo se inclina hacia el izquierda.</p>
diff --git a/files/es/web/guide/api/vibration/index.html b/files/es/web/guide/api/vibration/index.html
deleted file mode 100644
index 8c9c7b5f06..0000000000
--- a/files/es/web/guide/api/vibration/index.html
+++ /dev/null
@@ -1,155 +0,0 @@
----
-title: Vibración API
-slug: Web/Guide/API/Vibration
-tags:
-  - API
-  - Firefox OS
-  - Mobile
-  - Principiante
-  - Vibración
-  - Vibrado
-  - Vibrar
-  - WebAPI
-translation_of: Web/API/Vibration_API
----
-<p>La mayoría de los dispositivos modernos pueden vibrar a través del hardware, esto permite que a través del código de software se pueda emitir estas vibraciones. La <strong>Vibration API</strong>  ofrece a las aplicaciones web la capacidad de acceder a este hardware en caso este lo soporte, caso contrario el dispositivo no hace nada.</p>
-
-<h2 id="Describiendo_vibraciones">Describiendo vibraciones</h2>
-
-<p>Vibración se puede describir como un patrón de prender y apagar pulsos, los cuales pueden variar en longitud. El patrón puede consistir de un sólo número que indica cuantos milisegundos vibrará, o un arreglo de enteros describiendo un patrón de vibraciones y pausas. La vibración es controlada por un solo método:</p>
-
-<p><span style="font-size: 13.63636302948px; line-height: 19.0909080505371px;">{{domxref("window.navigator.vibrate()")}}.</span></p>
-
-<h3 id="Vibración_simple">Vibración simple</h3>
-
-<p>Puedes iniciar una sola vibración del hardware pasando como argumento un sólo número, o un arreglo de un sólo número:</p>
-
-<pre class="brush:js">window.navigator.vibrate(200);
-window.navigator.vibrate([200]);
-</pre>
-
-<p>Ambos ejemplos hacen vibrar el dispositivo por 200 ms.</p>
-
-<h3 id="Patrones_de_vibración">Patrones de vibración</h3>
-
-<p>Un arreglo de valores describen que las vibraciones serán por períodos alternados, es decir, el dispositivo vibrará luego no lo hará, así según la secuencia definida. Cada valor en el arreglo es convertido a entero para luego ser interpretado alternadamente como el tiempo que el dispositivo debe vibrar y el tiempo que no debe vibrar. Ejemplo:</p>
-
-<pre class="brush: js">window.navigator.vibrate([200, 100, 200]);
-</pre>
-
-<p>Según este ejemplo el dispositivo vibrará por 200ms, luego se detiene por 100ms y luego vibra 200ms.</p>
-
-<p>Puedes especificar cuantas vibraciones/pausas desees, y el arreglo puede tener un tamaño par o impar. No importa que agregues una pausa como el último valor del arreglo, ya que el celular dejará de vibrar de todas formas al final de cada vibración.</p>
-
-<h3 id="Cancelar_vibraciones_existentes">Cancelar vibraciones existentes</h3>
-
-<p>Llamar {{domxref("window.navigator.vibrate()")}} con un valor de <code>0</code>, arreglo vació, o arreglo que contenga 0's detendrá cualquier vibración en curso.</p>
-
-<h3 id="Vibraciones_continuas">Vibraciones continuas</h3>
-
-<p style="margin: 0px 0px 0.8em; padding: 0px; border: 0px; font-family: 'Open Sans', Arial, sans-serif; line-height: 1.6em; font-size: 16px; vertical-align: baseline;">Algunas básicas acciones son <code style="margin: 0px; padding: 2px 7px; border: 0px; font-family: monospace, sans-serif; font-style: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; font-size: 16px; vertical-align: baseline; background-color: rgb(248, 248, 248); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;">setInterval</code> y <code style="margin: 0px; padding: 2px 7px; border: 0px; font-family: monospace, sans-serif; font-style: inherit; font-variant: inherit; font-weight: bold; line-height: inherit; font-size: 16px; vertical-align: baseline; background-color: rgb(248, 248, 248); border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;">clearInterval</code> que nos permitirán crear vibraciones persistentes:</p>
-
-<pre class="js  language-js" style="margin-top: 0.5em; margin-bottom: 0.5em; padding: 1em; border: 0px; font-family: Consolas, Monaco, 'Andale Mono', monospace; line-height: 1.6em; font-size: 0.8em; vertical-align: baseline; background-color: rgb(245, 242, 240); color: black; text-shadow: white 0px 1px; direction: ltr;"><code class="language-js" style="margin: 0px; padding: 0px; border: 0px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-style: inherit; font-variant: inherit; line-height: inherit; font-size: 13px; vertical-align: baseline; text-shadow: white 0px 1px; direction: ltr;"><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">var</span> intervaloDeVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
-<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">
-// Iniciar la vibración
-</span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">iniciarVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
-	navigator<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">.</span><span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">vibrate<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion)<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
-<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span>
-<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">
-// Detiene la vibración
-</span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">detenerVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
-<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">	// Limpiar el intervalo y detener las vibraciones existentes
-</span>	<span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">if</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span>intervaloDeVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">clearInterval<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>intervaloDeVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
-	navigator<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">.</span><span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">vibrate<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span><span class="token number" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 0, 85);">0</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
-<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span>
-<span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">
-// Iniciar las vibraciones con una determinado tiempo e intervalo
-</span><span class="token comment" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(112, 128, 144);">// Asumir que el valor recibido es un entero
-</span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span> iniciarVibradoPersistente<span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;"><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">,</span> intervalo<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
-	intervaloDeVibrado <span class="token operator" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(166, 127, 89); background-color: rgba(255, 255, 255, 0.498039);">=</span> <span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">setInterval<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span><span class="token keyword" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(0, 119, 170);">function</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span> <span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">{</span>
-		<span class="token function" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline;">iniciarVibrado<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">(</span></span>duracion<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
-	<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">,</span> intervalo<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">)</span><span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">;</span>
-<span class="token punctuation" style="margin: 0px; padding: 0px; border: 0px; font-family: inherit; font-style: inherit; font-variant: inherit; line-height: inherit; vertical-align: baseline; color: rgb(153, 153, 153);">}</span></code></pre>
-
-<p style="margin: 0px 0px 0.8em; padding: 0px; border: 0px; font-family: 'Open Sans', Arial, sans-serif; line-height: 1.6em; font-size: 16px; vertical-align: baseline;">Claro que el código de arriba no toma en cuenta el método de utilizar un arreglo de vibración, utilizar un arreglo para vibración persistente necesitaría recalcular la suma de los elementos del arregloo y crear un intervalo basado en esos números (agregando adicionalmente las pausas)</p>
-
-<h3 id="¿Por_qué_utilizar_Vibration_API">¿Por qué utilizar Vibration API?</h3>
-
-<p style="margin: 0px 0px 0.8em; padding: 0px; border: 0px; font-family: 'Open Sans', Arial, sans-serif; line-height: 1.6em; font-size: 16px; vertical-align: baseline;">Esta API es claramente accesible a través de dispositivos móbiles. Vibration API puede servir para alertas en las aplicaciones web del celular, y sería es asombrosa cuando se utiliza en juegos o en aplicaciones pesadas. Imagínate mirando un video en tu celular y durante la escena de explosión,tu teléfono vibra un poco. O la sensación que tendría tu usuario al sentir el estallido de una bomba en el juego Bomberman.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('Vibration API')}}</td>
-   <td>{{Spec2('Vibration API')}}</td>
-   <td>Especificación inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteŕistica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}} {{property_prefix("webkit")}}</td>
-   <td>11.0 {{property_prefix("moz")}}<br>
-    16 (no prefix)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}} {{property_prefix("webkit")}}</td>
-   <td>11.0 {{property_prefix("moz")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_También">Ver También</h2>
-
-<ul>
- <li>{{domxref("window.navigator.vibrate()")}}</li>
- <li><a href="http://davidwalsh.name/vibration-api">Vibration API - David Walsh</a></li>
-</ul>
diff --git a/files/es/web/guide/api/webrtc/peer-to-peer_communications_with_webrtc/index.html b/files/es/web/guide/api/webrtc/peer-to-peer_communications_with_webrtc/index.html
new file mode 100644
index 0000000000..702419db91
--- /dev/null
+++ b/files/es/web/guide/api/webrtc/peer-to-peer_communications_with_webrtc/index.html
@@ -0,0 +1,100 @@
+---
+title: Comunicaciones peer-to-peer (P2P) con WebRTC
+slug: Web/Guide/API/WebRTC/Peer-to-peer_communications_with_WebRTC
+translation_of: Web/Guide/API/WebRTC/Peer-to-peer_communications_with_WebRTC
+original_slug: WebRTC/Peer-to-peer_communications_with_WebRTC
+---
+<p>{{SeeCompatTable}}</p>
+<p>Las <strong>WebRTC APIs</strong> están diseñadas para permitir a las aplicaciones JS la creación de conexiones de tiempo real con canales de Audio, Video, y/o Datos (Data), directamente entre usuarios y a través de sus browsers, o hacia servers que soporten los protocolos WebRTC. También potencia navigator.mozGetUserMedia() para acceder a los datos de cámara y micrófono (getUserMedia() está siendo estandarizado por la Media Capture Task Force, así como las Recording APIs).</p>
+<p>Las fuentes primarias de las especificaciones para WebRTC (en constante <strong>evolución</strong>), son las especificaciones <a href="http://dev.w3.org/2011/webrtc/editor/webrtc.html" title="http://dev.w3.org/2011/webrtc/editor/webrtc.html">WebRTC</a> y <a href="http://dev.w3.org/2011/webrtc/editor/getusermedia.html" title="http://dev.w3.org/2009/dap/camera/">getUserMedia</a>, y varios de los borradores del IETF, en mayor medida en el <a href="http://tools.ietf.org/wg/rtcweb/" title="http://tools.ietf.org/wg/rtcweb/">rtcweb working group</a>, pero también <a href="http://tools.ietf.org/wg/mmusic/" title="http://tools.ietf.org/wg/mmusic/">mmusic</a>, <a href="http://tools.ietf.org/wg/rmcat/" title="http://tools.ietf.org/wg/rmcat/">rmcat</a> y algunos otros.<br>
+  <br>
+  Gran parte de la implementación en Chrome y Firefox está basada en código que fue abierto por Google en <a href="http://www.webrtc.org/reference" title="http://www.webrtc.org/reference">webrtc.org</a>.</p>
+<p style="margin-left: 40px;"><span style="color: #ff0000;"><strong>NOTA</strong></span>:  Las versiones actuales de FlashBlock pueden bloquear elementos HTML5 &lt;video&gt;. Si es así, dile que permita el contenido en la página, o deshabilita esa opción vía Herramientas/Add-ons.</p>
+<p>Hay un buen tutorial en las características básicas de WebRTC en <a href="http://www.html5rocks.com/en/tutorials/webrtc/basics/" title="http://www.html5rocks.com/en/tutorials/webrtc/basics/">HTML5 Rocks</a>. Una colección de páginas de pruebas básicas para soportar el desarrollo existe en <a href="http://mozilla.github.com/webrtc-landing" title="http://mozilla.github.com/webrtc-landing">webrtc-landing</a>.</p>
+<p>Puedes hacer simples llamadas persona-a-persona (inclusive si usan Chrome) en <a href="https://apprtc.appspot.com/" title="https://apprtc.appspot.com/">apprtc.appspot.com</a>.</p>
+<p>Una descripción de alto nivel de lo que sucede en una conexión RTCPeerConnection se publicó en un artículo de <a href="https://hacks.mozilla.org/2013/05/embedding-webrtc-video-chat-right-into-your-website/" title="https://hacks.mozilla.org/2013/05/embedding-webrtc-video-chat-right-into-your-website/">Mozilla Hacks</a> (puedes ver todos los artículos sobre WebRTC <a href="https://hacks.mozilla.org/category/webrtc/" title="https://hacks.mozilla.org/category/webrtc/">aquí</a>).</p>
+<p><img alt="Basics of RTCPeerConnection call setup" src="https://hacks.mozilla.org/wp-content/uploads/2013/05/webRTC-BasicsOfHowItWorks2.png" style="width: 898px; height: 805px;"></p>
+<h2 id="Especificaciones">Especificaciones</h2>
+<table class="standard-table">
+  <tbody>
+    <tr>
+      <th scope="col">Especificación</th>
+      <th scope="col">Estado</th>
+      <th scope="col">Comentarios</th>
+    </tr>
+    <tr>
+      <td>WebRTC API</td>
+      <td>En definición</td>
+      <td> </td>
+    </tr>
+    <tr>
+      <td>getUserMedia API</td>
+      <td>En definición</td>
+      <td><a href="http://dev.w3.org/2011/webrtc/editor/getusermedia.html" title="http://dev.w3.org/2011/webrtc/editor/getusermedia.html">http://dev.w3.org/2011/webrtc/editor/getusermedia.html</a></td>
+    </tr>
+  </tbody>
+</table>
+<h2 id="Compatibilidad_de_browsers">Compatibilidad de browsers</h2>
+<div>
+  {{CompatibilityTable}}</div>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Características</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera</th>
+        <th>Safari (WebKit)</th>
+      </tr>
+      <tr>
+        <td>Soporte básico</td>
+        <td>Sí{{property_prefix("webkit")}}</td>
+        <td>Firefox 22</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+      </tr>
+      <tr>
+        <td>DataChannels</td>
+        <td>A partir de Chrome 29</td>
+        <td>Firefox 22</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Feature</th>
+        <th>Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Phone</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>Soporte preliminar</td>
+        <td>Via Chrome (detrás de un flag de configuración)</td>
+        <td>Activado en Nightly y Aurora</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+      </tr>
+      <tr>
+        <td>DataChannels</td>
+        <td>{{CompatUnknown}}</td>
+        <td>Activado en Nightly y Aurora</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+        <td>{{CompatNo}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<p> </p>
diff --git a/files/es/web/guide/css/probando_media_queries/index.html b/files/es/web/guide/css/probando_media_queries/index.html
deleted file mode 100644
index dac4330054..0000000000
--- a/files/es/web/guide/css/probando_media_queries/index.html
+++ /dev/null
@@ -1,93 +0,0 @@
----
-title: Probando media queries
-slug: Web/Guide/CSS/probando_media_queries
-translation_of: Web/CSS/Media_Queries/Testing_media_queries
----
-<p>{{SeeCompatTable}}</p>
-<p>El DOM proporciona características que hacen posible probar los resultados de un media query estructuradamente. Esto es hecho usando la interfaz {{domxref("MediaQueryList") }} y sus métodos y propiedades. Una vez que hayas creado el objeto {{domxref("MediaQueryList") }}, puedes revisar el resultado del query o, como alternativa, recibir notificaciones automáticamente cuando el resultado cambie.</p>
-<h2 id="Creating_a_media_query_list" name="Creating_a_media_query_list">Creando una media query list</h2>
-<p>Before you can evaluate the results of a query, you need to create the {{domxref("MediaQueryList") }} object representing the media query. To do this, use the {{domxref("window.matchMedia") }} method.</p>
-<p>For example, if you want to set up a query list that determines whether the device is in landscape or portrait orientation, you can do so like this:</p>
-<pre>var mql = window.matchMedia("(orientation: portrait)");
-</pre>
-<h2 id="Checking_the_result_of_a_query" name="Checking_the_result_of_a_query">Revisando el resultado de un query</h2>
-<p>Once your media query list has been created, you can check the result of the query by looking at the value of its <code>matches</code> property, which reflects the result of the query:</p>
-<pre class="brush: js">if (mql.matches) {
-  /* The device is currently in portrait orientation */
-} else {
-  /* The device is currently in landscape orientation */
-}
-</pre>
-<h2 id="Receiving_query_notifications" name="Receiving_query_notifications">Recibiendo notificaciones query</h2>
-<p>If you need to be aware of changes to the evaluated result of the query on an ongoing basis, it's more efficient to register a listener than to poll the query's result. To do this, you can call the <code>addListener()</code> method on the {{domxref("MediaQueryList") }} object, specifying an observer that implements the {{domxref("MediaQueryListListener") }} interface:</p>
-<pre class="brush: js">var mql = window.matchMedia("(orientation: portrait)");
-mql.addListener(handleOrientationChange);
-handleOrientationChange(mql);
-</pre>
-<p>This code creates the orientation testing media query list, <code>mql</code>, then adds a listener to it. Note that after adding the listener, we actually invoke the listener directly once. This lets our listener perform initial adjustments based on the current device orientation (otherwise, if our code assumes the device is in portrait mode but it's actually in landscape mode at startup, we could have inconsistencies).</p>
-<p>The <code>handleOrientationChange()</code> method we implement then would look at the result of the query and handle whatever we need to do on an orientation change:</p>
-<pre class="brush: js">function handleOrientationChange(mql) {
-  if (mql.matches) {
-    /* The device is currently in portrait orientation */
-  } else {
-    /* The device is currently in landscape orientation */
-  }
-}
-</pre>
-<h2 id="Ending_query_notifications" name="Ending_query_notifications">Terminando con las notificaciones query </h2>
-<p>Cuando ya no vayas a necesitar recibir las notificaciones sobre los cambios de valro de tu media query, simplemente llama al <code>removeListener()</code> en el {{domxref("MediaQueryList") }}:</p>
-<pre>mql.removeListener(handleOrientationChange);
-</pre>
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con los navegadores</h2>
-<p>{{CompatibilityTable}}</p>
-<div id="compat-desktop">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Chrome</th>
-    <th>Firefox (Gecko)</th>
-    <th>Internet Explorer</th>
-    <th>Opera</th>
-    <th>Safari</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>9</td>
-    <td>{{CompatGeckoDesktop("6.0") }}</td>
-    <td>10</td>
-    <td>12.1</td>
-    <td>5.1</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Android</th>
-    <th>Firefox Mobile (Gecko)</th>
-    <th>IE Mobile</th>
-    <th>Opera Mobile</th>
-    <th>Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>3.0</td>
-    <td>{{CompatUnknown}}</td>
-    <td>10</td>
-    <td>12.1</td>
-    <td>5</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<h2 id="See_also" name="See_also">Ver también</h2>
-<ul>
- <li><a href="/en-US/docs/CSS/Media_queries" title="CSS/Media queries">Media queries</a></li>
- <li>{{domxref("window.matchMedia()") }}</li>
- <li>{{domxref("MediaQueryList") }}</li>
- <li>{{domxref("MediaQueryListListener") }}</li>
-</ul>
diff --git a/files/es/web/guide/dom/events/creacion_y_activación_eventos/index.html b/files/es/web/guide/dom/events/creacion_y_activación_eventos/index.html
deleted file mode 100644
index 0038e12c74..0000000000
--- a/files/es/web/guide/dom/events/creacion_y_activación_eventos/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Creación y activación de eventos (Event)
-slug: Web/Guide/DOM/Events/Creacion_y_Activación_Eventos
-tags:
-  - DOM
-  - Guía
-  - JavaScript
-  - Sintetico
-  - eventos
-translation_of: Web/Guide/Events/Creating_and_triggering_events
----
-<p>En este artículo se muestra cómo crear y activar eventos DOM. Estos eventos son comunmente llamados eventos sinteticos, a diferencia de los eventos gatillados por el navegador.</p>
-
-<h2 id="Crear_eventos_personalizados">Crear eventos personalizados</h2>
-
-<p>    Los eventos pueden ser creados con el constructor de eventos de la siguiente manera:</p>
-
-<pre class="brush: js">var event = new Event('build');
-
-// Escucha para el evento.
-elem.addEventListener('build', function (e) { ... }, false);
-
-// Disparar event.
-elem.dispatchEvent(event);</pre>
-
-<p>El codigo de ejemplo de arriba usa el metodo <a href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/dispatchEvent">EventTarget.dispatchEvent()</a>.   </p>
-
-<p>Este constructor es compatible con la mayoría de los navegadores modernos (con Internet Explorer es la excepción). Para un enfoque más detallado, ver la manera antigua de abajo.</p>
-
-<h3 id="Adición_de_datos_personalizados_con_CustomEvent_()">Adición de datos personalizados con CustomEvent ()</h3>
-
-<p>    Para añadir más datos al objeto de evento, existe la interfaz CustomEvent y la propiedad detalle se puede utilizar para pasar los datos personalizados.<br>
- <span style="line-height: 1.5;">Por Ejemplo, </span>el evento se puede crear de la siguiente manera<span style="line-height: 1.5;">:</span></p>
-
-<pre class="brush: js">var event = new CustomEvent('build', { 'detail': elem.dataset.time });</pre>
-
-<p>    Esto permitirá tener acceso a los datos adicionales en el escuchador de eventos (<span style="line-height: 19.0909080505371px;">event listener</span>):</p>
-
-<pre class="brush: js">function eventHandler(e) {
-  log('The time is: ' + e.detail);
-}
-</pre>
-
-<h3 id="La_Forma_Antigua">La Forma Antigua</h3>
-
-<p>    El enfoque más para la creación de eventos utiliza APIs inspirados en Java. A continuación se muestra un ejemplo:</p>
-
-<pre class="brush: js">// Creamos el evento.
-var event = document.createEvent('Event');
-
-/* Definimos el nombre del evento que es 'build'.*/
-event.initEvent('build', true, true);
-
-// Asignamos el evento.
-document.addEventListener('build', function (e) {
-  // e.target matches document from above
-}, false);
-
-// target can be any Element or other EventTarget.
-document.dispatchEvent(event);
-
-</pre>
-
-<h2 id="El_disparo_incorporado_eventos">El disparo incorporado eventos</h2>
-
-<p>    Comunmente es deseable disparar un evento desde un elemento hijo, y lograr que el padre lo capture: opcionalmente con datos: </p>
-
-<pre class="brush: js">function simulateClick() {
-  var event = new MouseEvent('click', {
-    'view': window,
-    'bubbles': true,
-    'cancelable': true
-  });
-  var cb = document.getElementById('checkbox');
-  var canceled = !cb.dispatchEvent(event);
-  if (canceled) {
-    // A handler called preventDefault.
-    alert("canceled");
-  } else {
-    // None of the handlers called preventDefault.
-    alert("not canceled");
-  }
-}</pre>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility" style="line-height: 30px; font-size: 2.14285714285714rem;">Compatibilidad con los Navegadores</h2>
-
-<h2 id="sect1"> </h2>
-
-<p>{{CompatibilityTable()}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th style="line-height: 16px;">Feature</th>
-   <th style="line-height: 16px;">Chrome</th>
-   <th style="line-height: 16px;">Firefox (Gecko)</th>
-   <th style="line-height: 16px;">Internet Explorer</th>
-   <th style="line-height: 16px;">Opera</th>
-   <th style="line-height: 16px;">Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td><code>Event()</code> constructor</td>
-   <td>15</td>
-   <td>11</td>
-   <td>{{ CompatNo() }}</td>
-   <td>11.60</td>
-   <td>6</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th style="line-height: 16px;">Feature</th>
-   <th style="line-height: 16px;">Android</th>
-   <th style="line-height: 16px;">Firefox Mobile (Gecko)</th>
-   <th style="line-height: 16px;">IE Phone</th>
-   <th style="line-height: 16px;">Opera Mobile</th>
-   <th style="line-height: 16px;">Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>6</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{domxref("document.createEvent()")}}</li>
- <li>{{domxref("Event.initEvent()")}}</li>
- <li>{{domxref("EventTarget.dispatchEvent()")}}</li>
- <li>{{domxref("EventTarget.addEventListener()")}}</li>
-</ul>
diff --git a/files/es/web/guide/dom/events/eventos_controlador/index.html b/files/es/web/guide/dom/events/eventos_controlador/index.html
deleted file mode 100644
index 836b287123..0000000000
--- a/files/es/web/guide/dom/events/eventos_controlador/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: Manejadores de eventos en el DOM
-slug: Web/Guide/DOM/Events/eventos_controlador
-translation_of: Web/Guide/Events/Event_handlers
----
-<p><span class="seoSummary">La plataforma Web provee varias formas de recibir notificaciones de los eventos del <a href="/en-US/docs/Web/Events">DOM</a>.  Dos de las formas más comunes son: la general {{domxref("EventTarget.addEventListener", "addEventListener()")}} y un conjunto específico de controladores de eventos específicos.</span> Esta página se enfoca en los detalles de cómo funcionan estos.</p>
-
-<h3 id="Registering_on-event_handlers">Registering <em>on-event</em> handlers</h3>
-
-<p>Los controladores <em><strong>on-event</strong></em> son un grupo de propiedades ofrecidas por los elementos del DOM para ayudar a manejar cómo los elementos reaccionan a los eventos. Los elementos pueden ser interactivos (por ejemplo: enlaces, botones, imagenes, formularios) or non-interactive (e.g. the base document). Los eventos pueden ser cuando se haga un click, detectar cuando se presione una tecla,  enfocarse, entre otros. Los handlers on-event son comunmente denominados como el evento al cual deben reaccionar, como ser <code>onclick</code>, <code>onkeypress</code>, <code>onfocus</code>, etc.</p>
-
-<p>Pueden especificar un controlador de evento <code>on&lt;...&gt;</code> para un evento en particular (como {{event("click")}}) como un opbjeto determinado de diferentes formas:</p>
-
-<ul>
- <li>Usando el HTML {{Glossary("atributo")}} llamados <code>on<em>{eventtype}</em></code> en un elemento, por ejemplo:<br>
-  <code>&lt;button <u>onclick="return handleClick(event);"</u>&gt;</code>,</li>
- <li>O seteandolo {{Glossary("property/JavaScript", "property")}} desde JavaScript, por ejemplo:<br>
-  <code>document.getElementById("mybutton")<u>.onclick = function(event) { ... }</u></code>.</li>
-</ul>
-
-<p>Un controlador onevent</p>
-
-<p>Notese que cada objeto puede tener sólo un controlador <em>on-event</em> para un evento dado (though that handler could call multiple sub-handlers). This is why {{domxref("EventTarget.addEventListener", "addEventListener()")}} is often the better way to get notified of events, especially when wishing to apply various event handlers independently from each other, even for the same event and/or to the same element.</p>
-
-<p>Also note that <em>on-event</em> handlers are called automatically, not at the programmer's will (although you can, like  <code>mybutton.onclick(myevent); ) </code>since they serve more as placeholders to which a real handler function can be <strong>assigned</strong>.</p>
-
-<h3 id="Non-element_objects">Non-element objects</h3>
-
-<p>Event handlers can also be set using properties on many non-element objects that generate events, including {{ domxref("window") }}, {{ domxref("document") }}, {{ domxref("XMLHttpRequest") }}, and others, for example:</p>
-
-<pre class="notranslate">xhr.onprogress = function() { ... }</pre>
-
-<h2 id="Details">Details</h2>
-
-<h3 id="The_value_of_HTML_on&lt;...>_attributes_and_corresponding_JavaScript_properties">The value of HTML on&lt;...&gt; attributes and corresponding  JavaScript properties</h3>
-
-<p>A handler registered via an <code>on&lt;...&gt;</code> attribute will be available via the corresponding <code>on&lt;...&gt;</code> property, but not the other way around:</p>
-
-<pre class="brush: html notranslate">&lt;div id="a" onclick="alert('old')"&gt;Open the Developer Tools Console to see the output.&lt;/div&gt;
-
-&lt;script&gt;
-window.onload = function () {
-  var div = document.getElementById("a");
-  console.log("Attribute reflected as a property: ", div.onclick.toString());
-  // Prints: function onclick(event) { alert('old') }
-  div.onclick = function() { alert('new') };
-  console.log("Changed property to: ", div.onclick.toString());
-  // Prints: function () { alert('new') }
-  console.log("Attribute value is unchanged: ", div.getAttribute("onclick"));
-  // Prints: alert('old')
-}
-&lt;/script&gt;</pre>
-
-<p>For historical reasons, some attributes/properties on the {{HTMLElement("body")}} and {{HTMLElement("frameset")}} elements actually set event handlers on their parent {{domxref("Window")}} object. (The HTML specification names these: <code>onblur</code>, <code>onerror</code>, <code>onfocus</code>, <code>onload</code>, <code>onscroll</code>.)</p>
-
-<h3 id="Event_handlers_parameters_this_binding_and_the_return_value">Event handler's parameters, <code>this</code> binding, and the return value</h3>
-
-<p>When the event handler is specified as <strong>an HTML attribute</strong>, the specified code is wrapped into a function with <strong>the following parameters</strong>:</p>
-
-<ul>
- <li><code>event</code> - for all event handlers, except {{domxref("GlobalEventHandlers.onerror", "onerror")}}.</li>
- <li><code>event</code>, <code>source</code>, <code>lineno</code>, <code>colno</code>, and <code>error</code> for the {{domxref("GlobalEventHandlers.onerror", "onerror")}} event handler. Note that the <code>event</code> parameter actually contains the error message as string.</li>
-</ul>
-
-<p>When the event handler is invoked, the <code>this</code> keyword inside the handler is set to the DOM element on which the handler is registered. For more details see <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this#In_an_in%E2%80%93line_event_handler">the this keyword documentation</a>.</p>
-
-<p>The return value from the handler determines if the event is canceled. The specific handling of the return value depends on the kind of event, for details see <a href="https://html.spec.whatwg.org/multipage/webappapis.html#the-event-handler-processing-algorithm">"The event handler processing algorithm" in the HTML specification</a>.</p>
-
-<h3 id="When_the_event_handler_is_invoked">When the event handler is invoked</h3>
-
-<p>TBD (non-capturing listener)</p>
-
-<h3 id="Terminology">Terminology</h3>
-
-<p>The term <strong>event handler</strong> may be used to refer to:</p>
-
-<ul>
- <li>any function or object registered to be notified of events,</li>
- <li>or, more specifically, to the mechanism of registering event listeners via <code>on...</code> attributes in HTML or properties in web APIs, such as <code>&lt;button onclick="alert(this)"&gt;</code> or <code>window.onload = function() { /* ... */ }</code>.</li>
-</ul>
-
-<p>When discussing the various methods of listening to events,</p>
-
-<ul>
- <li><strong>event listener</strong> refers to a function or object registered via {{domxref("EventTarget.addEventListener()")}},</li>
- <li>whereas <strong>event handler</strong> refers to a function registered via <code>on...</code> attributes or properties.</li>
-</ul>
-
-<h2 id="Specifications" name="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'webappapis.html#event-handler-attributes', 'event handlers')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'webappapis.html#event-handler-attributes', 'event handlers')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_Compatibility" name="Browser_Compatibility">Browser compatibility</h2>
-
-<h3 id="Event_handler_changes_in_Firefox_9">Event handler changes in Firefox 9</h3>
-
-<p>In order to better match the specifications, and improve cross-browser compatibility, the way event handlers were implemented at a fundamental level changed in Gecko 9.0 {{ geckoRelease("9.0") }}.</p>
-
-<p>Specifically, in the past, event handlers were not correctly implemented as standard IDL attributes. In Gecko 9.0, this was changed. Because of this, certain behaviors of event handlers in Gecko have changed. In particular, they now behave in all the ways standard IDL attributes behave. In most cases, this shouldn't affect web or add-on content at all; however, there are a few specific things to watch out for.</p>
-
-<h4 id="Detecting_the_presence_of_event_handler_properties">Detecting the presence of event handler properties</h4>
-
-<p>You can now detect the presence of an event handler property (that is, for example, <code>onload</code>), using the JavaScript <a href="/en-US/JavaScript/Reference/Operators/in" title="en/JavaScript/Reference/Operators/in"><code>in</code></a> operator. For example:</p>
-
-<pre class="brush: js notranslate">if ("onsomenewfeature" in window) {
-  /* do something amazing */
-}
-</pre>
-
-<h4 id="Event_handlers_and_prototypes">Event handlers and prototypes</h4>
-
-<p>You can't set or access the values of any IDL-defined attributes on DOM prototype objects; that means you can't, for example, change <code>Window.prototype.onload</code> anymore. In the past, event handlers (<code>onload</code>, etc.) weren't implemented as IDL attributes in Gecko, so you were able to do this for those. Now you can't. This improves compatibility.</p>
diff --git a/files/es/web/guide/dom/events/index.html b/files/es/web/guide/dom/events/index.html
deleted file mode 100644
index 241f94e866..0000000000
--- a/files/es/web/guide/dom/events/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
----
-title: Event developer guide
-slug: Web/Guide/DOM/Events
-tags:
-  - DOM
-  - Event
-  - Guide
-  - NeedsTranslation
-  - TopicStub
-  - events
-translation_of: Web/Guide/Events
----
-<p>{{draft()}}</p>
-<p>Everything you need to know about events will go under here. We're working on cleanup here now.</p>
-<h2 id="Docs">Docs</h2>
-<p>{{LandingPageListSubpages}}</p>
diff --git a/files/es/web/guide/dom/index.html b/files/es/web/guide/dom/index.html
deleted file mode 100644
index fc26bc0bee..0000000000
--- a/files/es/web/guide/dom/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: DOM developer guide
-slug: Web/Guide/DOM
-tags:
-  - API
-  - DOM
-  - Guide
-  - NeedsTranslation
-  - TopicStub
-translation_of: Web/API/Document_Object_Model
-translation_of_original: Web/Guide/API/DOM
----
-<p>{{draft}}</p>
-<p>The <a href="/docs/DOM">Document Object Model</a> is an API for <a href="/en-US/docs/HTML">HTML</a> and <a href="/en-US/docs/XML">XML</a> documents. It provides a structural representation of the document, enabling the developer to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages.</p>
-<p>All of the properties, methods, and events available to the web developer for manipulating and creating web pages are organized into <a href="/en-US/docs/Gecko_DOM_Reference">objects</a> (e.g., the document object that represents the document itself, the table object that represents a HTML table element, and so forth). Those objects are accessible via scripting languages in most recent web browsers.</p>
-<p>The DOM is most often used in conjunction with <a href="/en-US/docs/JavaScript">JavaScript</a>. However, the DOM was designed to be independent of any particular programming language, making the structural representation of the document available from a single, consistent API. Though we focus on JavaScript throughout this site, implementations of the DOM can be built for <a href="http://www.w3.org/DOM/Bindings">any language</a>.</p>
-<p>The <a href="http://www.w3.org/">World Wide Web Consortium</a> establishes a <a href="http://www.w3.org/DOM/">standard for the DOM</a>, called the W3C DOM. It should, now that the most important browsers correctly implement it, enable powerful cross-browser applications.</p>
-<h2 id="Why_is_the_DOM_support_in_Mozilla_important.3F" name="Why_is_the_DOM_support_in_Mozilla_important.3F">Why is the DOM important?</h2>
-<p>"Dynamic HTML" (<a href="/en-US/docs/DHTML">DHTML</a>) is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated. The W3C DOM Working Group is working hard to make sure interoperable and language-neutral solutions are agreed upon (see also the <a href="http://www.w3.org/DOM/faq.html">W3C FAQ</a>). As Mozilla claims the title of "Web Application Platform", support for the DOM is one of the most requested features, and a necessary one if Mozilla wants to be a viable alternative to the other browsers.</p>
-<p>Even more important is the fact that the user interface of Mozilla (also Firefox and Thunderbird) is built using <a href="/en-US/docs/XUL" title="/en-US/docs/XUL">XUL</a>, using the DOM to <a href="/en-US/docs/Dynamically_modifying_XUL-based_user_interface">manipulate its own UI</a>.</p>
-<h2 id="More_about_the_DOM">More about the DOM</h2>
-<p>{{LandingPageListSubpages}}</p>
diff --git a/files/es/web/guide/events/creating_and_triggering_events/index.html b/files/es/web/guide/events/creating_and_triggering_events/index.html
new file mode 100644
index 0000000000..0b560935a1
--- /dev/null
+++ b/files/es/web/guide/events/creating_and_triggering_events/index.html
@@ -0,0 +1,145 @@
+---
+title: Creación y activación de eventos (Event)
+slug: Web/Guide/Events/Creating_and_triggering_events
+tags:
+  - DOM
+  - Guía
+  - JavaScript
+  - Sintetico
+  - eventos
+translation_of: Web/Guide/Events/Creating_and_triggering_events
+original_slug: Web/Guide/DOM/Events/Creacion_y_Activación_Eventos
+---
+<p>En este artículo se muestra cómo crear y activar eventos DOM. Estos eventos son comunmente llamados eventos sinteticos, a diferencia de los eventos gatillados por el navegador.</p>
+
+<h2 id="Crear_eventos_personalizados">Crear eventos personalizados</h2>
+
+<p>    Los eventos pueden ser creados con el constructor de eventos de la siguiente manera:</p>
+
+<pre class="brush: js">var event = new Event('build');
+
+// Escucha para el evento.
+elem.addEventListener('build', function (e) { ... }, false);
+
+// Disparar event.
+elem.dispatchEvent(event);</pre>
+
+<p>El codigo de ejemplo de arriba usa el metodo <a href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/dispatchEvent">EventTarget.dispatchEvent()</a>.   </p>
+
+<p>Este constructor es compatible con la mayoría de los navegadores modernos (con Internet Explorer es la excepción). Para un enfoque más detallado, ver la manera antigua de abajo.</p>
+
+<h3 id="Adición_de_datos_personalizados_con_CustomEvent_()">Adición de datos personalizados con CustomEvent ()</h3>
+
+<p>    Para añadir más datos al objeto de evento, existe la interfaz CustomEvent y la propiedad detalle se puede utilizar para pasar los datos personalizados.<br>
+ <span style="line-height: 1.5;">Por Ejemplo, </span>el evento se puede crear de la siguiente manera<span style="line-height: 1.5;">:</span></p>
+
+<pre class="brush: js">var event = new CustomEvent('build', { 'detail': elem.dataset.time });</pre>
+
+<p>    Esto permitirá tener acceso a los datos adicionales en el escuchador de eventos (<span style="line-height: 19.0909080505371px;">event listener</span>):</p>
+
+<pre class="brush: js">function eventHandler(e) {
+  log('The time is: ' + e.detail);
+}
+</pre>
+
+<h3 id="La_Forma_Antigua">La Forma Antigua</h3>
+
+<p>    El enfoque más para la creación de eventos utiliza APIs inspirados en Java. A continuación se muestra un ejemplo:</p>
+
+<pre class="brush: js">// Creamos el evento.
+var event = document.createEvent('Event');
+
+/* Definimos el nombre del evento que es 'build'.*/
+event.initEvent('build', true, true);
+
+// Asignamos el evento.
+document.addEventListener('build', function (e) {
+  // e.target matches document from above
+}, false);
+
+// target can be any Element or other EventTarget.
+document.dispatchEvent(event);
+
+</pre>
+
+<h2 id="El_disparo_incorporado_eventos">El disparo incorporado eventos</h2>
+
+<p>    Comunmente es deseable disparar un evento desde un elemento hijo, y lograr que el padre lo capture: opcionalmente con datos: </p>
+
+<pre class="brush: js">function simulateClick() {
+  var event = new MouseEvent('click', {
+    'view': window,
+    'bubbles': true,
+    'cancelable': true
+  });
+  var cb = document.getElementById('checkbox');
+  var canceled = !cb.dispatchEvent(event);
+  if (canceled) {
+    // A handler called preventDefault.
+    alert("canceled");
+  } else {
+    // None of the handlers called preventDefault.
+    alert("not canceled");
+  }
+}</pre>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility" style="line-height: 30px; font-size: 2.14285714285714rem;">Compatibilidad con los Navegadores</h2>
+
+<h2 id="sect1"> </h2>
+
+<p>{{CompatibilityTable()}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th style="line-height: 16px;">Feature</th>
+   <th style="line-height: 16px;">Chrome</th>
+   <th style="line-height: 16px;">Firefox (Gecko)</th>
+   <th style="line-height: 16px;">Internet Explorer</th>
+   <th style="line-height: 16px;">Opera</th>
+   <th style="line-height: 16px;">Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td><code>Event()</code> constructor</td>
+   <td>15</td>
+   <td>11</td>
+   <td>{{ CompatNo() }}</td>
+   <td>11.60</td>
+   <td>6</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th style="line-height: 16px;">Feature</th>
+   <th style="line-height: 16px;">Android</th>
+   <th style="line-height: 16px;">Firefox Mobile (Gecko)</th>
+   <th style="line-height: 16px;">IE Phone</th>
+   <th style="line-height: 16px;">Opera Mobile</th>
+   <th style="line-height: 16px;">Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>6</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{domxref("document.createEvent()")}}</li>
+ <li>{{domxref("Event.initEvent()")}}</li>
+ <li>{{domxref("EventTarget.dispatchEvent()")}}</li>
+ <li>{{domxref("EventTarget.addEventListener()")}}</li>
+</ul>
diff --git a/files/es/web/guide/events/event_handlers/index.html b/files/es/web/guide/events/event_handlers/index.html
new file mode 100644
index 0000000000..f7bd9ac9e1
--- /dev/null
+++ b/files/es/web/guide/events/event_handlers/index.html
@@ -0,0 +1,133 @@
+---
+title: Manejadores de eventos en el DOM
+slug: Web/Guide/Events/Event_handlers
+translation_of: Web/Guide/Events/Event_handlers
+original_slug: Web/Guide/DOM/Events/eventos_controlador
+---
+<p><span class="seoSummary">La plataforma Web provee varias formas de recibir notificaciones de los eventos del <a href="/en-US/docs/Web/Events">DOM</a>.  Dos de las formas más comunes son: la general {{domxref("EventTarget.addEventListener", "addEventListener()")}} y un conjunto específico de controladores de eventos específicos.</span> Esta página se enfoca en los detalles de cómo funcionan estos.</p>
+
+<h3 id="Registering_on-event_handlers">Registering <em>on-event</em> handlers</h3>
+
+<p>Los controladores <em><strong>on-event</strong></em> son un grupo de propiedades ofrecidas por los elementos del DOM para ayudar a manejar cómo los elementos reaccionan a los eventos. Los elementos pueden ser interactivos (por ejemplo: enlaces, botones, imagenes, formularios) or non-interactive (e.g. the base document). Los eventos pueden ser cuando se haga un click, detectar cuando se presione una tecla,  enfocarse, entre otros. Los handlers on-event son comunmente denominados como el evento al cual deben reaccionar, como ser <code>onclick</code>, <code>onkeypress</code>, <code>onfocus</code>, etc.</p>
+
+<p>Pueden especificar un controlador de evento <code>on&lt;...&gt;</code> para un evento en particular (como {{event("click")}}) como un opbjeto determinado de diferentes formas:</p>
+
+<ul>
+ <li>Usando el HTML {{Glossary("atributo")}} llamados <code>on<em>{eventtype}</em></code> en un elemento, por ejemplo:<br>
+  <code>&lt;button <u>onclick="return handleClick(event);"</u>&gt;</code>,</li>
+ <li>O seteandolo {{Glossary("property/JavaScript", "property")}} desde JavaScript, por ejemplo:<br>
+  <code>document.getElementById("mybutton")<u>.onclick = function(event) { ... }</u></code>.</li>
+</ul>
+
+<p>Un controlador onevent</p>
+
+<p>Notese que cada objeto puede tener sólo un controlador <em>on-event</em> para un evento dado (though that handler could call multiple sub-handlers). This is why {{domxref("EventTarget.addEventListener", "addEventListener()")}} is often the better way to get notified of events, especially when wishing to apply various event handlers independently from each other, even for the same event and/or to the same element.</p>
+
+<p>Also note that <em>on-event</em> handlers are called automatically, not at the programmer's will (although you can, like  <code>mybutton.onclick(myevent); ) </code>since they serve more as placeholders to which a real handler function can be <strong>assigned</strong>.</p>
+
+<h3 id="Non-element_objects">Non-element objects</h3>
+
+<p>Event handlers can also be set using properties on many non-element objects that generate events, including {{ domxref("window") }}, {{ domxref("document") }}, {{ domxref("XMLHttpRequest") }}, and others, for example:</p>
+
+<pre class="notranslate">xhr.onprogress = function() { ... }</pre>
+
+<h2 id="Details">Details</h2>
+
+<h3 id="The_value_of_HTML_on&lt;...>_attributes_and_corresponding_JavaScript_properties">The value of HTML on&lt;...&gt; attributes and corresponding  JavaScript properties</h3>
+
+<p>A handler registered via an <code>on&lt;...&gt;</code> attribute will be available via the corresponding <code>on&lt;...&gt;</code> property, but not the other way around:</p>
+
+<pre class="brush: html notranslate">&lt;div id="a" onclick="alert('old')"&gt;Open the Developer Tools Console to see the output.&lt;/div&gt;
+
+&lt;script&gt;
+window.onload = function () {
+  var div = document.getElementById("a");
+  console.log("Attribute reflected as a property: ", div.onclick.toString());
+  // Prints: function onclick(event) { alert('old') }
+  div.onclick = function() { alert('new') };
+  console.log("Changed property to: ", div.onclick.toString());
+  // Prints: function () { alert('new') }
+  console.log("Attribute value is unchanged: ", div.getAttribute("onclick"));
+  // Prints: alert('old')
+}
+&lt;/script&gt;</pre>
+
+<p>For historical reasons, some attributes/properties on the {{HTMLElement("body")}} and {{HTMLElement("frameset")}} elements actually set event handlers on their parent {{domxref("Window")}} object. (The HTML specification names these: <code>onblur</code>, <code>onerror</code>, <code>onfocus</code>, <code>onload</code>, <code>onscroll</code>.)</p>
+
+<h3 id="Event_handlers_parameters_this_binding_and_the_return_value">Event handler's parameters, <code>this</code> binding, and the return value</h3>
+
+<p>When the event handler is specified as <strong>an HTML attribute</strong>, the specified code is wrapped into a function with <strong>the following parameters</strong>:</p>
+
+<ul>
+ <li><code>event</code> - for all event handlers, except {{domxref("GlobalEventHandlers.onerror", "onerror")}}.</li>
+ <li><code>event</code>, <code>source</code>, <code>lineno</code>, <code>colno</code>, and <code>error</code> for the {{domxref("GlobalEventHandlers.onerror", "onerror")}} event handler. Note that the <code>event</code> parameter actually contains the error message as string.</li>
+</ul>
+
+<p>When the event handler is invoked, the <code>this</code> keyword inside the handler is set to the DOM element on which the handler is registered. For more details see <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this#In_an_in%E2%80%93line_event_handler">the this keyword documentation</a>.</p>
+
+<p>The return value from the handler determines if the event is canceled. The specific handling of the return value depends on the kind of event, for details see <a href="https://html.spec.whatwg.org/multipage/webappapis.html#the-event-handler-processing-algorithm">"The event handler processing algorithm" in the HTML specification</a>.</p>
+
+<h3 id="When_the_event_handler_is_invoked">When the event handler is invoked</h3>
+
+<p>TBD (non-capturing listener)</p>
+
+<h3 id="Terminology">Terminology</h3>
+
+<p>The term <strong>event handler</strong> may be used to refer to:</p>
+
+<ul>
+ <li>any function or object registered to be notified of events,</li>
+ <li>or, more specifically, to the mechanism of registering event listeners via <code>on...</code> attributes in HTML or properties in web APIs, such as <code>&lt;button onclick="alert(this)"&gt;</code> or <code>window.onload = function() { /* ... */ }</code>.</li>
+</ul>
+
+<p>When discussing the various methods of listening to events,</p>
+
+<ul>
+ <li><strong>event listener</strong> refers to a function or object registered via {{domxref("EventTarget.addEventListener()")}},</li>
+ <li>whereas <strong>event handler</strong> refers to a function registered via <code>on...</code> attributes or properties.</li>
+</ul>
+
+<h2 id="Specifications" name="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'webappapis.html#event-handler-attributes', 'event handlers')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'webappapis.html#event-handler-attributes', 'event handlers')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_Compatibility" name="Browser_Compatibility">Browser compatibility</h2>
+
+<h3 id="Event_handler_changes_in_Firefox_9">Event handler changes in Firefox 9</h3>
+
+<p>In order to better match the specifications, and improve cross-browser compatibility, the way event handlers were implemented at a fundamental level changed in Gecko 9.0 {{ geckoRelease("9.0") }}.</p>
+
+<p>Specifically, in the past, event handlers were not correctly implemented as standard IDL attributes. In Gecko 9.0, this was changed. Because of this, certain behaviors of event handlers in Gecko have changed. In particular, they now behave in all the ways standard IDL attributes behave. In most cases, this shouldn't affect web or add-on content at all; however, there are a few specific things to watch out for.</p>
+
+<h4 id="Detecting_the_presence_of_event_handler_properties">Detecting the presence of event handler properties</h4>
+
+<p>You can now detect the presence of an event handler property (that is, for example, <code>onload</code>), using the JavaScript <a href="/en-US/JavaScript/Reference/Operators/in" title="en/JavaScript/Reference/Operators/in"><code>in</code></a> operator. For example:</p>
+
+<pre class="brush: js notranslate">if ("onsomenewfeature" in window) {
+  /* do something amazing */
+}
+</pre>
+
+<h4 id="Event_handlers_and_prototypes">Event handlers and prototypes</h4>
+
+<p>You can't set or access the values of any IDL-defined attributes on DOM prototype objects; that means you can't, for example, change <code>Window.prototype.onload</code> anymore. In the past, event handlers (<code>onload</code>, etc.) weren't implemented as IDL attributes in Gecko, so you were able to do this for those. Now you can't. This improves compatibility.</p>
diff --git a/files/es/web/guide/events/index.html b/files/es/web/guide/events/index.html
new file mode 100644
index 0000000000..a9e55742fa
--- /dev/null
+++ b/files/es/web/guide/events/index.html
@@ -0,0 +1,17 @@
+---
+title: Event developer guide
+slug: Web/Guide/Events
+tags:
+  - DOM
+  - Event
+  - Guide
+  - NeedsTranslation
+  - TopicStub
+  - events
+translation_of: Web/Guide/Events
+original_slug: Web/Guide/DOM/Events
+---
+<p>{{draft()}}</p>
+<p>Everything you need to know about events will go under here. We're working on cleanup here now.</p>
+<h2 id="Docs">Docs</h2>
+<p>{{LandingPageListSubpages}}</p>
diff --git a/files/es/web/guide/events/orientation_and_motion_data_explained/index.html b/files/es/web/guide/events/orientation_and_motion_data_explained/index.html
new file mode 100644
index 0000000000..8c700f6a71
--- /dev/null
+++ b/files/es/web/guide/events/orientation_and_motion_data_explained/index.html
@@ -0,0 +1,49 @@
+---
+title: Explicación de los datos de orientación y movimiento
+slug: Web/Guide/Events/Orientation_and_motion_data_explained
+translation_of: Web/Guide/Events/Orientation_and_motion_data_explained
+original_slug: >-
+  Web/Guide/API/DOM/Events/Orientation_and_motion_data_explained/Orientation_and_motion_data_explained
+---
+<p>{{ Draft() }}</p>
+<h2 id="Sumario">Sumario</h2>
+<p>Cuando se utiliza la orientación y los eventos de movimiento, es importante entender cuáles son los significados de los valores en el navegador. En este artículo se proporciona información acerca de los sistemas de coordenadas en el juego y la forma de usarlos.</p>
+<div class="warning">
+  <p><strong>Atención:</strong> Actualmente, Firefox y Chrome no soporta la orientación de la misma forma. Ten cuidado con esto cuando sea imprementado en un navegador u otro.</p>
+</div>
+<h2 id="Acerca_de_los_marcos_de_coordenadas">Acerca de los marcos de coordenadas</h2>
+<p>Un marco de coordenadas en un sistema en el que la orientacion de los tres ejers (X, Y y Z) se definen en referencia a un objeto. Hay dos marcos de coordenadas a considerar cuando se utiliza eventos de orientación y el movimiento:</p>
+<h3 id="Marco_de_coordenadas_terrestres">Marco de coordenadas terrestres</h3>
+<p>El marco de coordenadas de terrestres es el sistema de coordenadas fijado en el centro de la Tierra, es decir, los ejes están alineados sobre la base de la fuerza de la gravedad y la orientación norte magnético estándar. Utilizamos las letras mayúsculas ("X", "Y" y "Z") para describir los ejes del sistema de coordenadas terrestre.</p>
+<ul>
+  <li>El eje <strong>X</strong> sigue a lo largo (profuncidad) del plano de tierra, perpendicular al eje Y y positiva hacia el este (y por lo tanto negativa hacia el oeste).</li>
+  <li>El eje <strong>Y</strong> sigue a lo largo(ancho) del plano de tierra, y es positivo hacia el norte verdadero (es decir, el Polo Norte, el norte no es magnético) y negativo hacia la verdadera sur.</li>
+  <li>El eje <strong>Z</strong> es perpendicular al plano de tierra, piensa en él como una línea trazada entre el dispositivo y el centro de la Tierra. El valor de la coordenada Z es positivo hacia arriba (distancia desde el centro de la Tierra) y negativo hacia abajo (hacia el centro de la Tierra).</li>
+</ul>
+<p> </p>
+<p><img alt="" src="http://upload.wikimedia.org/wikipedia/commons/f/f6/Cartesian_xyz.png" style="width: 200px; height: 153px;"></p>
+<p> </p>
+<h3 id="Marco_de_coordenadas_del_dispositivo">Marco de coordenadas del dispositivo</h3>
+<p>El marco de coordenadas del dispositivo es el marco de la coordinación fijada en el centro del dispositivo. Utilizamos letras minúsculas ("x", "y" y "z") para describir los ejes de las coordenadas del del dispositivo</p>
+<p><img alt="axes.png" class="internal default" src="/@api/deki/files/5694/=axes.png" style=""></p>
+<ul>
+  <li>El eje <strong>x</strong> está en el plano de la pantalla y es positiva hacia la derecha y negativa hacia la izquierda.</li>
+  <li>El eje <strong>y</strong> está en el plano de la pantalla y es positiva hacia la parte superior y negativa hacia la parte inferior.</li>
+  <li>El eje <strong>z</strong> es perpendicular a la pantalla o teclado, y es positivo que se extiende hacia fuera de la pantalla.</li>
+</ul>
+<div class="note">
+  <strong>Nota:</strong> En un teléfono o tableta, la orientación del dispositivo siempre se considera en relación con la orientación estándar de la pantalla, lo que es la orientación "retrato" en la mayoría de los dispositivos. En una computadora portátil, la orientación se considera en relación con el teclado. Si desea detectar cambios en la orientación del dispositivo con el fin de compensar, se puede utilizar el evento orientationChange.</div>
+<h2 id="Sobre_la_rotación">Sobre la rotación</h2>
+<p>La rotación se describe alrededor de cualquier eje dado en términos del número de grados de diferencia entre el marco de coordenadas del dispositivo y el marco de coordenadas de la Tierra, y se mide en grados.</p>
+<h3 id="Alpha">Alpha</h3>
+<p>Rotación alrededor del eje z - es decir, girando el dispositivo - hace que el ángulo de rotación alfa cambie:</p>
+<p><img alt="alpha.png" class="internal default" src="/@api/deki/files/5695/=alpha.png" style=""></p>
+<p>El ángulo alfa es de 0 °, cuando la parte superior del dispositivo se apunta directamente hacia el polo norte de la Tierra, y aumenta a medida que el dispositivo se gira hacia la izquierda.</p>
+<h3 id="Beta">Beta</h3>
+<p>Rotación alrededor del eje X - es decir, inclinando el dispositivo desde o hacia el usuario - hace que el ángulo de giro beta cambie:</p>
+<p><img alt="beta.png" class="internal default" src="/@api/deki/files/5696/=beta.png"></p>
+<p>El ángulo beta es de 0 ° en la parte superior e inferior del dispositivo son la misma distancia de la superficie de la Tierra, y aumenta hacia 180 ° como el dispositivo se inclina hacia adelante y disminuye hacia -180 ° como el dispositivo se inclina hacia atrás.</p>
+<h3 id="Gamma">Gamma</h3>
+<p>Rotación alrededor del eje Y - es decir, la inclinación del dispositivo hacia la izquierda o hacia la derecha - hace que el ángulo de giro gamma cambie:</p>
+<p><img alt="gamma.png" class="internal default" src="/@api/deki/files/5697/=gamma.png"></p>
+<p>El ángulo gamma es 0 °, cuando los lados izquierdo y derecho del dispositivo son la misma distancia de la superficie de la Tierra, y aumenta hacia 90 ° como el dispositivo se inclina hacia la derecha, y hacia -90 ° como el dispositivo se inclina hacia el izquierda.</p>
diff --git a/files/es/web/guide/html/canvas_tutorial/advanced_animations/index.html b/files/es/web/guide/html/canvas_tutorial/advanced_animations/index.html
deleted file mode 100644
index 15ab72ee7f..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/advanced_animations/index.html
+++ /dev/null
@@ -1,380 +0,0 @@
----
-title: Advanced animations
-slug: Web/Guide/HTML/Canvas_tutorial/Advanced_animations
-tags:
-  - Canvas
-  - Tutoria
-  - graficos
-translation_of: Web/API/Canvas_API/Tutorial/Advanced_animations
----
-<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Basic_animations", "Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas")}}</div>
-
-<div class="summary">
-<p>En el último capítulo hicimos unas <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">animaciones básicas</a> y nos familiarizamos con varias maneras de mover cosas. En esta parte examinaremos la moción misma y agregaremos la física para hacer nuestras animaciones más avanzadas.</p>
-</div>
-
-<h2 id="Dibujar_una_bola">Dibujar una bola</h2>
-
-<p>Vamos a usar una bola para nuestro estudio de la animación, entonces primero dibujamos la bola dentro del canvas. El siguente código lo configurará.</p>
-
-<pre class="brush: html">&lt;canvas id="canvas" width="600" height="300"&gt;&lt;/canvas&gt;
-</pre>
-
-<p>Como siempre, necesitamos un entorno para dibujar. Para dibujar la bola, creamos un contenido <code>ball</code> lo cual contiene propiedades y un método <code>draw()</code>.</p>
-
-<pre class="brush: js">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-
-var ball = {
-  x: 100,
-  y: 100,
-  radius: 25,
-  color: 'blue',
-  draw: function() {
-    ctx.beginPath();
-    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
-    ctx.closePath();
-    ctx.fillStyle = this.color;
-    ctx.fill();
-  }
-};
-
-ball.draw();</pre>
-
-<p>Nada especial aquí; la bola es en realidad un circulo sencillo y se dibuja con el método {{domxref("CanvasRenderingContext2D.arc()", "arc()")}}.</p>
-
-<h2 id="Agregar_velocidad">Agregar velocidad</h2>
-
-<p>Ya que tenemos una bola, estamos listos agregar una animación básica así como aprendimos en el <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">último capítulo</a> de esta tutoría. De nuevo, {{domxref("window.requestAnimationFrame()")}} nos ayuda controlar la animación. La bola empieza moverse por agregar un vector de velocidad a la posición. Para cada fotograma, también {{domxref("CanvasRenderingContext2D.clearRect", "clear", "", 1)}} el canvas para quitar los circulos viejos de los fotogramas anteriores.</p>
-
-<pre class="brush: js; highlight:[8,9,24,25]">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-var raf;
-
-var ball = {
-  x: 100,
-  y: 100,
-  vx: 5,
-  vy: 2,
-  radius: 25,
-  color: 'blue',
-  draw: function() {
-    ctx.beginPath();
-    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
-    ctx.closePath();
-    ctx.fillStyle = this.color;
-    ctx.fill();
-  }
-};
-
-function draw() {
-  ctx.clearRect(0,0, canvas.width, canvas.height);
-  ball.draw();
-  ball.x += ball.vx;
-  ball.y += ball.vy;
-  raf = window.requestAnimationFrame(draw);
-}
-
-canvas.addEventListener('mouseover', function(e) {
-  raf = window.requestAnimationFrame(draw);
-});
-
-canvas.addEventListener('mouseout', function(e) {
-  window.cancelAnimationFrame(raf);
-});
-
-ball.draw();
-</pre>
-
-<h2 id="Límites">Límites</h2>
-
-<p>Si no probamos los límites, de repente nuestra bola se agota el canvas. Necesitamos verificar si las posiciones <code>x</code> e <code>y</code> están fuera de las dimensiones del canvas y invertir la direción de los vectores de velocidad. Para hacer eso, agregamos los siguentes pasos al método <code>draw</code>:</p>
-
-<pre class="brush: js">if (ball.y + ball.vy &gt; canvas.height || ball.y + ball.vy &lt; 0) {
-  ball.vy = -ball.vy;
-}
-if (ball.x + ball.vx &gt; canvas.width || ball.x + ball.vx &lt; 0) {
-  ball.vx = -ball.vx;
-}</pre>
-
-<h3 id="Primera_demo">Primera demo</h3>
-
-<p>Veamos como se ve en acción hasta este punto. Dirige el ratón dentro del canvas para empezar la animación.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-var raf;
-
-var ball = {
-  x: 100,
-  y: 100,
-  vx: 5,
-  vy: 2,
-  radius: 25,
-  color: 'blue',
-  draw: function() {
-    ctx.beginPath();
-    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
-    ctx.closePath();
-    ctx.fillStyle = this.color;
-    ctx.fill();
-  }
-};
-
-function draw() {
-  ctx.clearRect(0,0, canvas.width, canvas.height);
-  ball.draw();
-  ball.x += ball.vx;
-  ball.y += ball.vy;
-
-  if (ball.y + ball.vy &gt; canvas.height ||
-      ball.y + ball.vy &lt; 0) {
-    ball.vy = -ball.vy;
-  }
-  if (ball.x + ball.vx &gt; canvas.width ||
-      ball.x + ball.vx &lt; 0) {
-    ball.vx = -ball.vx;
-  }
-
-  raf = window.requestAnimationFrame(draw);
-}
-
-canvas.addEventListener('mouseover', function(e) {
-  raf = window.requestAnimationFrame(draw);
-});
-
-canvas.addEventListener('mouseout', function(e) {
-  window.cancelAnimationFrame(raf);
-});
-
-ball.draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("First_demo", "610", "310")}}</p>
-
-<h2 id="Aceleración">Aceleración</h2>
-
-<p>Para convertir la moción en más auténtica, puedes jugar con la velocidad, así por ejemplo:</p>
-
-<pre class="brush: js">ball.vy *= .99;
-ball.vy += .25;</pre>
-
-<p>Esto reduce el vector vertical de velocidad para cada fotograma para que la bola termina rebotando en el suelo.</p>
-
-<div class="hidden">
-<h6 id="Second_demo">Second demo</h6>
-
-<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-var raf;
-
-var ball = {
-  x: 100,
-  y: 100,
-  vx: 5,
-  vy: 2,
-  radius: 25,
-  color: 'blue',
-  draw: function() {
-    ctx.beginPath();
-    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
-    ctx.closePath();
-    ctx.fillStyle = this.color;
-    ctx.fill();
-  }
-};
-
-function draw() {
-  ctx.clearRect(0,0, canvas.width, canvas.height);
-  ball.draw();
-  ball.x += ball.vx;
-  ball.y += ball.vy;
-  ball.vy *= .99;
-  ball.vy += .25;
-
-  if (ball.y + ball.vy &gt; canvas.height ||
-      ball.y + ball.vy &lt; 0) {
-    ball.vy = -ball.vy;
-  }
-  if (ball.x + ball.vx &gt; canvas.width ||
-      ball.x + ball.vx &lt; 0) {
-    ball.vx = -ball.vx;
-  }
-
-  raf = window.requestAnimationFrame(draw);
-}
-
-canvas.addEventListener('mouseover', function(e) {
-  raf = window.requestAnimationFrame(draw);
-});
-
-canvas.addEventListener('mouseout', function(e) {
-  window.cancelAnimationFrame(raf);
-});
-
-ball.draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("Second_demo", "610", "310")}}</p>
-
-<h2 id="Efecto_de_rezagar">Efecto de rezagar</h2>
-
-<p>Hasta este punto hemos limpiado los fotogramas anteriores con el método {{domxref("CanvasRenderingContext2D.clearRect", "clearRect")}}. Si reemplazas este método con un semi-transparente {{domxref("CanvasRenderingContext2D.fillRect", "fillRect")}}, puedes facilmente crear un efecto de rezagar.</p>
-
-<pre class="brush: js">ctx.fillStyle = 'rgba(255, 255, 255, 0.3)';
-ctx.fillRect(0, 0, canvas.width, canvas.height);</pre>
-
-<div class="hidden">
-<h6 id="Third_demo">Third demo</h6>
-
-<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-var raf;
-
-var ball = {
-  x: 100,
-  y: 100,
-  vx: 5,
-  vy: 2,
-  radius: 25,
-  color: 'blue',
-  draw: function() {
-    ctx.beginPath();
-    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
-    ctx.closePath();
-    ctx.fillStyle = this.color;
-    ctx.fill();
-  }
-};
-
-function draw() {
-  ctx.fillStyle = 'rgba(255, 255, 255, 0.3)';
-  ctx.fillRect(0, 0, canvas.width, canvas.height);
-  ball.draw();
-  ball.x += ball.vx;
-  ball.y += ball.vy;
-  ball.vy *= .99;
-  ball.vy += .25;
-
-  if (ball.y + ball.vy &gt; canvas.height ||
-      ball.y + ball.vy &lt; 0) {
-    ball.vy = -ball.vy;
-  }
-  if (ball.x + ball.vx &gt; canvas.width ||
-      ball.x + ball.vx &lt; 0) {
-    ball.vx = -ball.vx;
-  }
-
-  raf = window.requestAnimationFrame(draw);
-}
-
-canvas.addEventListener('mouseover', function(e) {
-  raf = window.requestAnimationFrame(draw);
-});
-
-canvas.addEventListener('mouseout', function(e) {
-  window.cancelAnimationFrame(raf);
-});
-
-ball.draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("Third_demo", "610", "310")}}</p>
-
-<h2 id="Agregar_control_de_ratón">Agregar control de ratón</h2>
-
-<p>Para controlar la bola, podemos hacerla seguir nuestro ratón usando el evento <code><a href="/en-US/docs/Web/Reference/Events/mousemove">mousemove</a></code>, por ejemplo. El evento <code><a href="/en-US/docs/Web/Events/click">click</a></code> solta la bola y la deja rebotar de nuevo.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" style="border: 1px solid" width="600" height="300"&gt;&lt;/canvas&gt;</pre>
-</div>
-
-<pre class="brush: js">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-var raf;
-var running = false;
-
-var ball = {
-  x: 100,
-  y: 100,
-  vx: 5,
-  vy: 1,
-  radius: 25,
-  color: 'blue',
-  draw: function() {
-    ctx.beginPath();
-    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, true);
-    ctx.closePath();
-    ctx.fillStyle = this.color;
-    ctx.fill();
-  }
-};
-
-function clear() {
-  ctx.fillStyle = 'rgba(255, 255, 255, 0.3)';
-  ctx.fillRect(0,0,canvas.width,canvas.height);
-}
-
-function draw() {
-  clear();
-  ball.draw();
-  ball.x += ball.vx;
-  ball.y += ball.vy;
-
-  if (ball.y + ball.vy &gt; canvas.height || ball.y + ball.vy &lt; 0) {
-    ball.vy = -ball.vy;
-  }
-  if (ball.x + ball.vx &gt; canvas.width || ball.x + ball.vx &lt; 0) {
-    ball.vx = -ball.vx;
-  }
-
-  raf = window.requestAnimationFrame(draw);
-}
-
-canvas.addEventListener('mousemove', function(e) {
-  if (!running) {
-    clear();
-    ball.x = e.clientX;
-    ball.y = e.clientY;
-    ball.draw();
-  }
-});
-
-canvas.addEventListener('click', function(e) {
-  if (!running) {
-    raf = window.requestAnimationFrame(draw);
-    running = true;
-  }
-});
-
-canvas.addEventListener('mouseout', function(e) {
-  window.cancelAnimationFrame(raf);
-  running = false;
-});
-
-ball.draw();
-</pre>
-
-<p>Mueve la bola usando el ratón y suéltala haciendo click.</p>
-
-<p>{{EmbedLiveSample("Adding_mouse_control", "610", "310")}}</p>
-
-<h2 id="Breakout">Breakout</h2>
-
-<p>Este capítulo corto sólo explica algunas técnicas para crear animaciones más avanzadas. ¡Hay muchos más!  ¿Qué tal agregar una raqueta, algunos ladrillos, y convertir esta demo en un partido <a href="http://en.wikipedia.org/wiki/Breakout_%28video_game%29">Breakout</a>? Visita nuestra área de <a href="/en-US/docs/Games">Game development</a> para mayor información.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{domxref("window.requestAnimationFrame()")}}</li>
- <li><a href="/en-US/docs/Games/Techniques/Efficient_animation_for_web_games">Efficient animation for web games</a></li>
-</ul>
-
-<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Basic_animations", "Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas")}}</p>
diff --git a/files/es/web/guide/html/canvas_tutorial/applying_styles_and_colors/index.html b/files/es/web/guide/html/canvas_tutorial/applying_styles_and_colors/index.html
deleted file mode 100644
index ab76918132..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/applying_styles_and_colors/index.html
+++ /dev/null
@@ -1,726 +0,0 @@
----
-title: Applying styles and colors
-slug: Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors
-translation_of: Web/API/Canvas_API/Tutorial/Applying_styles_and_colors
----
-<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Drawing_shapes", "Web/API/Canvas_API/Tutorial/Drawing_text")}}</div>
-
-<div class="summary">
-<p>En el capítulo acerca de dibujar formas, usamos unicamente los estilos de linea y de relleno por defecto. Aqui exploraremos las opciones del canvas que tenemos a nuestra disposición para hacer los dibujos un tanto más atractivos. Aprenderas como agregar diferentes colores, estilos de linea, gradiantes, patrones y sombras a tus dibujos.</p>
-</div>
-
-<h2 id="Colors" name="Colors">Colors</h2>
-
-<p>Hasta ahrora nosotros solo me hemos visto metodos en el contexto de dibujo. Si quisieramos aplicar colores a las formas, hay dos importantes propiedades que podemos usar: <code>fillStyle</code> y <code>strokeStyle</code>.</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.fillStyle", "fillStyle = color")}}</dt>
- <dd>Configura el estilo cuando se rellenan las formas.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.strokeStyle", "strokeStyle = color")}}</dt>
- <dd>Configura el estilo al contorno perimetral de las formas.</dd>
-</dl>
-
-<p><code>color</code> es una cadena que representa  un CSS {{cssxref("&lt;color&gt;")}}, un objeto gradiante, o un objeto patron. Miraremos en objetos de gradientes y patrones mas tarde. Por defecto, el color del trazo y del relleno son configurados en negro (valor de color CSS <code>#000000</code>).</p>
-
-<div class="note">
-<p><strong>Nota: </strong> Cuando configuras la propiedad  <code>strokeStyle</code> y/o <code>fillStyle</code>, el nuevo valor llega a ser el vador por defecto para los dibujos posteriores. Para cada forma que tu quieras en un color difrente, necesitaras reasignar las propiedades anteriores.</p>
-</div>
-
-<p>Las cadenas validas que tu pueden entrar deberian, segun la especificación, ser valores de  {{cssxref("&lt;color&gt;")}} CSS. En el siguiente ejemplo, describimos en mismo color.</p>
-
-<pre class="brush: js">// these all set the fillStyle to 'orange'
-
-ctx.fillStyle = 'orange';
-ctx.fillStyle = '#FFA500';
-ctx.fillStyle = 'rgb(255, 165, 0)';
-ctx.fillStyle = 'rgba(255, 165, 0, 1)';
-</pre>
-
-<h3 id="A_fillStyle_example" name="A_fillStyle_example">A <code>fillStyle</code> example</h3>
-
-<p>En este ejemplo, usamos dos bucles for para dibujar una cuadrícula de rectangulos, cada uno de diferente color. La imagen resultante deberia ser similar a la de la screenhot. No hay nada demasiado espectacular en el proceso. Usamos dos variables i y j para generar un unico color RGB para cada celda cuadrada, modificando las componentes rojo y verde. El canal azul tiene un valor fijo. Modificando los canales, puedes generar todo tipo de paletas. Incrementando los paos, puedes lograr algo similar que se parezca a las paletas de colores que Photoshop usa.</p>
-
-<pre class="brush: js;highlight[5,6]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-  for (var i = 0; i &lt; 6; i++) {
-    for (var j = 0; j &lt; 6; j++) {
-      ctx.fillStyle = 'rgb(' + Math.floor(255 - 42.5 * i) + ', ' +
-                       Math.floor(255 - 42.5 * j) + ', 0)';
-      ctx.fillRect(j * 25, i * 25, 25, 25);
-    }
-  }
-}</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>The result looks like this:</p>
-
-<p>{{EmbedLiveSample("A_fillStyle_example", 160, 160, "https://mdn.mozillademos.org/files/5417/Canvas_fillstyle.png")}}</p>
-
-<h3 id="A_strokeStyle_example" name="A_strokeStyle_example">A <code>strokeStyle</code> example</h3>
-
-<p>Este ejemplo es similar al de arriba, pero usa la propiedad  <code>strokeStyle</code> para cambiar el color del contorno de las formas. Usamos el método  <code>arc()</code> para dibujar circulos en lugar de celdas cuadradas.</p>
-
-<pre class="brush: js;highlight[5,6]">  function draw() {
-    var ctx = document.getElementById('canvas').getContext('2d');
-    for (var i = 0; i &lt; 6; i++) {
-      for (var j = 0; j &lt; 6; j++) {
-        ctx.strokeStyle = 'rgb(0, ' + Math.floor(255 - 42.5 * i) + ', ' +
-                         Math.floor(255 - 42.5 * j) + ')';
-        ctx.beginPath();
-        ctx.arc(12.5 + j * 25, 12.5 + i * 25, 10, 0, Math.PI * 2, true);
-        ctx.stroke();
-      }
-    }
-  }
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>The result looks like this:</p>
-
-<p>{{EmbedLiveSample("A_strokeStyle_example", "180", "180", "https://mdn.mozillademos.org/files/253/Canvas_strokestyle.png")}}</p>
-
-<h2 id="Transparency" name="Transparency">Transparency</h2>
-
-<p>Ademas de dibujar formas opacas en el canvas, podemos dibujar formas semi-transparentes(o translucidas). Esto se logra bien configurando la propiedad  <code>globalAlpha</code> o asignando un color semi-transparente al estilo del trazo u  u/y al de relleno.</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.globalAlpha", "globalAlpha = transparencyValue")}}</dt>
- <dd>Applies the specified transparency value to all future shapes drawn on the canvas. The value must be between 0.0 (fully transparent) to 1.0 (fully opaque). This value is 1.0 (fully opaque) by default.</dd>
-</dl>
-
-<p>The <code>globalAlpha</code> property can be useful if you want to draw a lot of shapes on the canvas with similar transparency, but otherwise it's generally more useful to set the transparency on individual shapes when setting their colors.</p>
-
-<p>Debido qaque las propiedades  <code>strokeStyle</code> y <code>fillStyle</code> aceptan valores de color rgba de CSS, podemos usar la siguiente notacion para asignar una color transparente a ellos.</p>
-
-<pre class="brush: js">// Assigning transparent colors to stroke and fill style
-
-ctx.strokeStyle = 'rgba(255, 0, 0, 0.5)';
-ctx.fillStyle = 'rgba(255, 0, 0, 0.5)';
-</pre>
-
-<p>The <code>rgba()</code> function is similar to the <code>rgb()</code> function but it has one extra parameter. The last parameter sets the transparency value of this particular color. The valid range is again between 0.0 (fully transparent) and 1.0 (fully opaque).</p>
-
-<h3 id="A_globalAlpha_example" name="A_globalAlpha_example">A <code>globalAlpha</code> example</h3>
-
-<p>In this example, we'll draw a background of four different colored squares. On top of these, we'll draw a set of semi-transparent circles. The <code>globalAlpha</code> property is set at <code>0.2</code> which will be used for all shapes from that point on. Every step in the <code>for</code> loop draws a set of circles with an increasing radius. The final result is a radial gradient. By overlaying ever more circles on top of each other, we effectively reduce the transparency of the circles that have already been drawn. By increasing the step count and in effect drawing more circles, the background would completely disappear from the center of the image.</p>
-
-<pre class="brush: js;highlight[15]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-  // draw background
-  ctx.fillStyle = '#FD0';
-  ctx.fillRect(0, 0, 75, 75);
-  ctx.fillStyle = '#6C0';
-  ctx.fillRect(75, 0, 75, 75);
-  ctx.fillStyle = '#09F';
-  ctx.fillRect(0, 75, 75, 75);
-  ctx.fillStyle = '#F30';
-  ctx.fillRect(75, 75, 75, 75);
-  ctx.fillStyle = '#FFF';
-
-  // set transparency value
-  ctx.globalAlpha = 0.2;
-
-  // Draw semi transparent circles
-  for (var i = 0; i &lt; 7; i++) {
-    ctx.beginPath();
-    ctx.arc(75, 75, 10 + 10 * i, 0, Math.PI * 2, true);
-    ctx.fill();
-  }
-}</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("A_globalAlpha_example", "180", "180", "https://mdn.mozillademos.org/files/232/Canvas_globalalpha.png")}}</p>
-
-<h3 id="An_example_using_rgba" name="An_example_using_rgba()">An example using <code>rgba()</code></h3>
-
-<p>In this second example, we do something similar to the one above, but instead of drawing circles on top of each other, I've drawn small rectangles with increasing opacity. Using <code>rgba()</code> gives you a little more control and flexibility because we can set the fill and stroke style individually.</p>
-
-<pre class="brush: js;highlight[16]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  // Draw background
-  ctx.fillStyle = 'rgb(255, 221, 0)';
-  ctx.fillRect(0, 0, 150, 37.5);
-  ctx.fillStyle = 'rgb(102, 204, 0)';
-  ctx.fillRect(0, 37.5, 150, 37.5);
-  ctx.fillStyle = 'rgb(0, 153, 255)';
-  ctx.fillRect(0, 75, 150, 37.5);
-  ctx.fillStyle = 'rgb(255, 51, 0)';
-  ctx.fillRect(0, 112.5, 150, 37.5);
-
-  // Draw semi transparent rectangles
-  for (var i = 0; i &lt; 10; i++) {
-    ctx.fillStyle = 'rgba(255, 255, 255, ' + (i + 1) / 10 + ')';
-    for (var j = 0; j &lt; 4; j++) {
-      ctx.fillRect(5 + i * 14, 5 + j * 37.5, 14, 27.5);
-    }
-  }
-}</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("An_example_using_rgba()", "180", "180", "https://mdn.mozillademos.org/files/246/Canvas_rgba.png")}}</p>
-
-<h2 id="Line_styles" name="Line_styles">Line styles</h2>
-
-<p>There are several properties which allow us to style lines.</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.lineWidth", "lineWidth = value")}}</dt>
- <dd>Sets the width of lines drawn in the future.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.lineCap", "lineCap = type")}}</dt>
- <dd>Sets the appearance of the ends of lines.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.lineJoin", "lineJoin = type")}}</dt>
- <dd>Sets the appearance of the "corners" where lines meet.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.miterLimit", "miterLimit = value")}}</dt>
- <dd>Establishes a limit on the miter when two lines join at a sharp angle, to let you control how thick the junction becomes.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.getLineDash", "getLineDash()")}}</dt>
- <dd>Returns the current line dash pattern array containing an even number of non-negative numbers.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.setLineDash", "setLineDash(segments)")}}</dt>
- <dd>Sets the current line dash pattern.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.lineDashOffset", "lineDashOffset = value")}}</dt>
- <dd>Specifies where to start a dash array on a line.</dd>
-</dl>
-
-<p>You'll get a better understanding of what these do by looking at the examples below.</p>
-
-<h3 id="A_lineWidth_example" name="A_lineWidth_example">A <code>lineWidth</code> example</h3>
-
-<p>This property sets the current line thickness. Values must be positive numbers. By default this value is set to 1.0 units.</p>
-
-<p>The line width is the thickness of the stroke centered on the given path. In other words, the area that's drawn extends to half the line width on either side of the path. Because canvas coordinates do not directly reference pixels, special care must be taken to obtain crisp horizontal and vertical lines.</p>
-
-<p>In the example below, 10 straight lines are drawn with increasing line widths. The line on the far left is 1.0 units wide. However, the leftmost and all other odd-integer-width thickness lines do not appear crisp, because of the path's positioning.</p>
-
-<pre class="brush: js;highlight[4]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-  for (var i = 0; i &lt; 10; i++) {
-    ctx.lineWidth = 1 + i;
-    ctx.beginPath();
-    ctx.moveTo(5 + i * 14, 5);
-    ctx.lineTo(5 + i * 14, 140);
-    ctx.stroke();
-  }
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("A_lineWidth_example", "180", "180", "https://mdn.mozillademos.org/files/239/Canvas_linewidth.png")}}</p>
-
-<p>Obtaining crisp lines requires understanding how paths are stroked. In the images below, the grid represents the canvas coordinate grid. The squares between gridlines are actual on-screen pixels. In the first grid image below, a rectangle from (2,1) to (5,5) is filled. The entire area between them (light red) falls on pixel boundaries, so the resulting filled rectangle will have crisp edges.</p>
-
-<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/201/Canvas-grid.png"></p>
-
-<p>If you consider a path from (3,1) to (3,5) with a line thickness of <code>1.0</code>, you end up with the situation in the second image. The actual area to be filled (dark blue) only extends halfway into the pixels on either side of the path. An approximation of this has to be rendered, which means that those pixels being only partially shaded, and results in the entire area (the light blue and dark blue) being filled in with a color only half as dark as the actual stroke color. This is what happens with the <code>1.0</code> width line in the previous example code.</p>
-
-<p>To fix this, you have to be very precise in your path creation. Knowing that a <code>1.0</code> width line will extend half a unit to either side of the path, creating the path from (3.5,1) to (3.5,5) results in the situation in the third image—the <code>1.0</code> line width ends up completely and precisely filling a single pixel vertical line.</p>
-
-<div class="note">
-<p><strong>Note:</strong> Be aware that in our vertical line example, the Y position still referenced an integer gridline position—if it hadn't, we would see pixels with half coverage at the endpoints (but note also that this behavior depends on the current <code>lineCap</code> style whose default value is <code>butt</code>; you may want to compute consistent strokes with half-pixel coordinates for odd-width lines, by setting the <code>lineCap</code> style to <code>square</code>, so that the outer border of the stroke around the endpoint will be automatically extended to cover the whole pixel exactly).</p>
-
-<p>Note also that only start and final endpoints of a path are affected: if a path is closed with <code>closePath()</code>, there's no start and final endpoint; instead, all endpoints in the path are connected to their attached previous and next segment using the current setting of the <code>lineJoin</code> style, whose default value is <code>miter</code>, with the effect of automatically extending the outer borders of the connected segments to their intersection point, so that the rendered stroke will exactly cover full pixels centered at each endpoint if those connected segments are horizontal and/or vertical). See the next two sections for demonstrations of these additional line styles.</p>
-</div>
-
-<p>For even-width lines, each half ends up being an integer amount of pixels, so you want a path that is between pixels (that is, (3,1) to (3,5)), instead of down the middle of pixels.</p>
-
-<p>While slightly painful when initially working with scalable 2D graphics, paying attention to the pixel grid and the position of paths ensures that your drawings will look correct regardless of scaling or any other transformations involved. A 1.0-width vertical line drawn at the correct position will become a crisp 2-pixel line when scaled up by 2, and will appear at the correct position.</p>
-
-<h3 id="A_lineCap_example" name="A_lineCap_example">A <code>lineCap</code> example</h3>
-
-<p>The <code>lineCap</code> property determines how the end points of every line are drawn. There are three possible values for this property and those are: <code>butt</code>, <code>round</code> and <code>square</code>. By default this property is set to <code>butt</code>.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/236/Canvas_linecap.png" style="float: right; height: 190px; width: 190px;"></p>
-
-<dl>
- <dt><code>butt</code></dt>
- <dd>The ends of lines are squared off at the endpoints.</dd>
- <dt><code>round</code></dt>
- <dd>The ends of lines are rounded.</dd>
- <dt><code>square</code></dt>
- <dd>The ends of lines are squared off by adding a box with an equal width and half the height of the line's thickness.</dd>
-</dl>
-
-<p>In this example, we'll draw three lines, each with a different value for the <code>lineCap</code> property. I also added two guides to see the exact differences between the three. Each of these lines starts and ends exactly on these guides.</p>
-
-<p>The line on the left uses the default <code>butt</code> option. You'll notice that it's drawn completely flush with the guides. The second is set to use the <code>round</code> option. This adds a semicircle to the end that has a radius half the width of the line. The line on the right uses the <code>square</code> option. This adds a box with an equal width and half the height of the line thickness.</p>
-
-<pre class="brush: js;highlight[18]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-  var lineCap = ['butt', 'round', 'square'];
-
-  // Draw guides
-  ctx.strokeStyle = '#09f';
-  ctx.beginPath();
-  ctx.moveTo(10, 10);
-  ctx.lineTo(140, 10);
-  ctx.moveTo(10, 140);
-  ctx.lineTo(140, 140);
-  ctx.stroke();
-
-  // Draw lines
-  ctx.strokeStyle = 'black';
-  for (var i = 0; i &lt; lineCap.length; i++) {
-    ctx.lineWidth = 15;
-    ctx.lineCap = lineCap[i];
-    ctx.beginPath();
-    ctx.moveTo(25 + i * 50, 10);
-    ctx.lineTo(25 + i * 50, 140);
-    ctx.stroke();
-  }
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("A_lineCap_example", "180", "180", "https://mdn.mozillademos.org/files/236/Canvas_linecap.png")}}</p>
-
-<h3 id="A_lineJoin_example" name="A_lineJoin_example">A <code>lineJoin</code> example</h3>
-
-<p>The <code>lineJoin</code> property determines how two connecting segments (of lines, arcs or curves) with non-zero lengths in a shape are joined together (degenerate segments with zero lengths, whose specified endpoints and control points are exactly at the same position, are skipped).</p>
-
-<p>There are three possible values for this property: <code>round</code>, <code>bevel</code> and <code>miter</code>. By default this property is set to <code>miter</code>. Note that the <code>lineJoin</code> setting has no effect if the two connected segments have the same direction, because no joining area will be added in this case.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/237/Canvas_linejoin.png" style="float: right; height: 190px; width: 190px;"></p>
-
-<dl>
- <dt><code>round</code></dt>
- <dd>Rounds off the corners of a shape by filling an additional sector of disc centered at the common endpoint of connected segments. The radius for these rounded corners is equal to half the line width.</dd>
- <dt><code>bevel</code></dt>
- <dd>Fills an additional triangular area between the common endpoint of connected segments, and the separate outside rectangular corners of each segment.</dd>
- <dt><code>miter</code></dt>
- <dd>Connected segments are joined by extending their outside edges to connect at a single point, with the effect of filling an additional lozenge-shaped area. This setting is effected by the <code>miterLimit</code> property which is explained below.</dd>
-</dl>
-
-<p>The example below draws three different paths, demonstrating each of these three <code>lineJoin</code> property settings; the output is shown above.</p>
-
-<pre class="brush: js;highlight[6]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-  var lineJoin = ['round', 'bevel', 'miter'];
-  ctx.lineWidth = 10;
-  for (var i = 0; i &lt; lineJoin.length; i++) {
-    ctx.lineJoin = lineJoin[i];
-    ctx.beginPath();
-    ctx.moveTo(-5, 5 + i * 40);
-    ctx.lineTo(35, 45 + i * 40);
-    ctx.lineTo(75, 5 + i * 40);
-    ctx.lineTo(115, 45 + i * 40);
-    ctx.lineTo(155, 5 + i * 40);
-    ctx.stroke();
-  }
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("A_lineJoin_example", "180", "180", "https://mdn.mozillademos.org/files/237/Canvas_linejoin.png")}}</p>
-
-<h3 id="A_demo_of_the_miterLimit_property" name="A_demo_of_the_miterLimit_property">A demo of the <code>miterLimit</code> property</h3>
-
-<p>As you've seen in the previous example, when joining two lines with the <code>miter</code> option, the outside edges of the two joining lines are extended up to the point where they meet. For lines which are at large angles with each other, this point is not far from the inside connection point. However, as the angles between each line decreases, the distance (miter length) between these points increases exponentially.</p>
-
-<p>The <code>miterLimit</code> property determines how far the outside connection point can be placed from the inside connection point. If two lines exceed this value, a bevel join gets drawn instead. Note that the maximum miter length is the product of the line width measured in the current coordinate system, by the value of this <code>miterLimit</code> property (whose default value is 10.0 in the HTML {{HTMLElement("canvas")}}), so the <code>miterLimit</code> can be set independently from the current display scale or any affine transforms of paths: it only influences the effectively rendered shape of line edges.</p>
-
-<p>More exactly, the miter limit is the maximum allowed ratio of the extension length (in the HTML canvas, it is measured between the outside corner of the joined edges of the line and the common endpoint of connecting segments specified in the path) to half the line width. It can equivalently be defined as the maximum allowed ratio of the distance between the inside and outside points of jonction of edges, to the total line width. It is then equal to the cosecant of half the minimum inner angle of connecting segments below which no miter join will be rendered, but only a bevel join:</p>
-
-<ul>
- <li><code>miterLimit</code> = <strong>max</strong> <code>miterLength</code> / <code>lineWidth</code> = 1 / <strong>sin</strong> ( <strong>min</strong> <em>θ</em> / 2 )</li>
- <li>The default miter limit of 10.0 will strip all miters for sharp angles below about 11 degrees.</li>
- <li>A miter limit equal to √2 ≈ 1.4142136 (rounded up) will strip miters for all acute angles, keeping miter joins only for obtuse or right angles.</li>
- <li>A miter limit equal to 1.0 is valid but will disable all miters.</li>
- <li>Values below 1.0 are invalid for the miter limit.</li>
-</ul>
-
-<p>Here's a little demo in which you can set <code>miterLimit</code> dynamically and see how this effects the shapes on the canvas. The blue lines show where the start and endpoints for each of the lines in the zig-zag pattern are.</p>
-
-<p>If you specify a <code>miterLimit</code> value below 4.2 in this demo, none of the visible corners will join with a miter extension, but only with a small bevel near the blue lines; with a <code>miterLimit</code> above 10, most corners in this demo should join with a miter far away from the blue lines, and whose height is decreasing between corners from left to right because they connect with growing angles; with intermediate values, the corners on the left side will only join with a bevel near the blue lines, and the corners on the right side with a miter extension (also with a decreasing height).</p>
-
-<pre class="brush: js;highlight[18]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  // Clear canvas
-  ctx.clearRect(0, 0, 150, 150);
-
-  // Draw guides
-  ctx.strokeStyle = '#09f';
-  ctx.lineWidth   = 2;
-  ctx.strokeRect(-5, 50, 160, 50);
-
-  // Set line styles
-  ctx.strokeStyle = '#000';
-  ctx.lineWidth = 10;
-
-  // check input
-  if (document.getElementById('miterLimit').value.match(/\d+(\.\d+)?/)) {
-    ctx.miterLimit = parseFloat(document.getElementById('miterLimit').value);
-  } else {
-    alert('Value must be a positive number');
-  }
-
-  // Draw lines
-  ctx.beginPath();
-  ctx.moveTo(0, 100);
-  for (i = 0; i &lt; 24 ; i++) {
-    var dy = i % 2 == 0 ? 25 : -25;
-    ctx.lineTo(Math.pow(i, 1.5) * 2, 75 + dy);
-  }
-  ctx.stroke();
-  return false;
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;table&gt;
-  &lt;tr&gt;
-    &lt;td&gt;&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;&lt;/td&gt;
-    &lt;td&gt;Change the &lt;code&gt;miterLimit&lt;/code&gt; by entering a new value below and clicking the redraw button.&lt;br&gt;&lt;br&gt;
-      &lt;form onsubmit="return draw();"&gt;
-        &lt;label&gt;Miter limit&lt;/label&gt;
-        &lt;input type="number" size="3" id="miterLimit"/&gt;
-        &lt;input type="submit" value="Redraw"/&gt;
-      &lt;/form&gt;
-    &lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;</pre>
-
-<pre class="brush: js">document.getElementById('miterLimit').value = document.getElementById('canvas').getContext('2d').miterLimit;
-draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("A_demo_of_the_miterLimit_property", "400", "180", "https://mdn.mozillademos.org/files/240/Canvas_miterlimit.png")}}</p>
-
-<h3 id="Using_line_dashes">Using line dashes</h3>
-
-<p>The <code>setLineDash</code> method and the <code>lineDashOffset</code> property specify the dash pattern for lines. The <code>setLineDash</code> method accepts a list of numbers that specifies distances to alternately draw a line and a gap and the <code>lineDashOffset</code> property sets an offset where to start the pattern.</p>
-
-<p>In this example we are creating a marching ants effect. It is an animation technique often found in <span class="new">selection</span> tools of computer graphics programs. It helps the user to distinguish the selection border from the image background by animating the border. In a later part of this tutorial, you can learn how to do this and other <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">basic animations</a>.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="110" height="110"&gt;&lt;/canvas&gt;</pre>
-</div>
-
-<pre class="brush: js;highlight[6]">var ctx = document.getElementById('canvas').getContext('2d');
-var offset = 0;
-
-function draw() {
-  ctx.clearRect(0, 0, canvas.width, canvas.height);
-  ctx.setLineDash([4, 2]);
-  ctx.lineDashOffset = -offset;
-  ctx.strokeRect(10, 10, 100, 100);
-}
-
-function march() {
-  offset++;
-  if (offset &gt; 16) {
-    offset = 0;
-  }
-  draw();
-  setTimeout(march, 20);
-}
-
-march();</pre>
-
-<p>{{EmbedLiveSample("Using_line_dashes", "120", "120", "https://mdn.mozillademos.org/files/9853/marching-ants.png")}}</p>
-
-<h2 id="Gradients" name="Gradients">Gradients</h2>
-
-<p>Just like any normal drawing program, we can fill and stroke shapes using linear and radial gradients. We create a {{domxref("CanvasGradient")}} object by using one of the following methods. We can then assign this object to the <code>fillStyle</code> or <code>strokeStyle</code> properties.</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.createLinearGradient", "createLinearGradient(x1, y1, x2, y2)")}}</dt>
- <dd>Creates a linear gradient object with a starting point of (<code>x1</code>, <code>y1</code>) and an end point of (<code>x2</code>, <code>y2</code>).</dd>
- <dt>{{domxref("CanvasRenderingContext2D.createRadialGradient", "createRadialGradient(x1, y1, r1, x2, y2, r2)")}}</dt>
- <dd>Creates a radial gradient. The parameters represent two circles, one with its center at (<code>x1</code>, <code>y1</code>) and a radius of <code>r1</code>, and the other with its center at (<code>x2</code>, <code>y2</code>) with a radius of <code>r2</code>.</dd>
-</dl>
-
-<p>For example:</p>
-
-<pre class="brush: js">var lineargradient = ctx.createLinearGradient(0, 0, 150, 150);
-var radialgradient = ctx.createRadialGradient(75, 75, 0, 75, 75, 100);
-</pre>
-
-<p>Once we've created a <code>CanvasGradient</code> object we can assign colors to it by using the <code>addColorStop()</code> method.</p>
-
-<dl>
- <dt>{{domxref("CanvasGradient.addColorStop", "gradient.addColorStop(position, color)")}}</dt>
- <dd>Creates a new color stop on the <code>gradient</code> object. The <code>position</code> is a number between 0.0 and 1.0 and defines the relative position of the color in the gradient, and the <code>color</code> argument must be a string representing a CSS {{cssxref("&lt;color&gt;")}}, indicating the color the gradient should reach at that offset into the transition.</dd>
-</dl>
-
-<p>You can add as many color stops to a gradient as you need. Below is a very simple linear gradient from white to black.</p>
-
-<pre class="brush: js">var lineargradient = ctx.createLinearGradient(0, 0, 150, 150);
-lineargradient.addColorStop(0, 'white');
-lineargradient.addColorStop(1, 'black');
-</pre>
-
-<h3 id="A_createLinearGradient_example" name="A_createLinearGradient_example">A <code>createLinearGradient</code> example</h3>
-
-<p>In this example, we'll create two different gradients. As you can see here, both the <code>strokeStyle</code> and <code>fillStyle</code> properties can accept a <code>canvasGradient</code> object as valid input.</p>
-
-<pre class="brush: js;highlight[5,11]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  // Create gradients
-  var lingrad = ctx.createLinearGradient(0, 0, 0, 150);
-  lingrad.addColorStop(0, '#00ABEB');
-  lingrad.addColorStop(0.5, '#fff');
-  lingrad.addColorStop(0.5, '#26C000');
-  lingrad.addColorStop(1, '#fff');
-
-  var lingrad2 = ctx.createLinearGradient(0, 50, 0, 95);
-  lingrad2.addColorStop(0.5, '#000');
-  lingrad2.addColorStop(1, 'rgba(0, 0, 0, 0)');
-
-  // assign gradients to fill and stroke styles
-  ctx.fillStyle = lingrad;
-  ctx.strokeStyle = lingrad2;
-
-  // draw shapes
-  ctx.fillRect(10, 10, 130, 130);
-  ctx.strokeRect(50, 50, 50, 50);
-
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>The first is a background gradient. As you can see, we assigned two colors at the same position. You do this to make very sharp color transitions—in this case from white to green. Normally, it doesn't matter in what order you define the color stops, but in this special case, it does significantly. If you keep the assignments in the order you want them to appear, this won't be a problem.</p>
-
-<p>In the second gradient, we didn't assign the starting color (at position 0.0) since it wasn't strictly necessary, because it will automatically assume the color of the next color stop. Therefore, assigning the black color at position 0.5 automatically makes the gradient, from the start to this stop, black.</p>
-
-<p>{{EmbedLiveSample("A_createLinearGradient_example", "180", "180", "https://mdn.mozillademos.org/files/235/Canvas_lineargradient.png")}}</p>
-
-<h3 id="A_createRadialGradient_example" name="A_createRadialGradient_example">A <code>createRadialGradient</code> example</h3>
-
-<p>In this example, we'll define four different radial gradients. Because we have control over the start and closing points of the gradient, we can achieve more complex effects than we would normally have in the "classic" radial gradients we see in, for instance, Photoshop (that is, a gradient with a single center point where the gradient expands outward in a circular shape).</p>
-
-<pre class="brush: js;highlight[5,10,15,20]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  // Create gradients
-  var radgrad = ctx.createRadialGradient(45, 45, 10, 52, 50, 30);
-  radgrad.addColorStop(0, '#A7D30C');
-  radgrad.addColorStop(0.9, '#019F62');
-  radgrad.addColorStop(1, 'rgba(1, 159, 98, 0)');
-
-  var radgrad2 = ctx.createRadialGradient(105, 105, 20, 112, 120, 50);
-  radgrad2.addColorStop(0, '#FF5F98');
-  radgrad2.addColorStop(0.75, '#FF0188');
-  radgrad2.addColorStop(1, 'rgba(255, 1, 136, 0)');
-
-  var radgrad3 = ctx.createRadialGradient(95, 15, 15, 102, 20, 40);
-  radgrad3.addColorStop(0, '#00C9FF');
-  radgrad3.addColorStop(0.8, '#00B5E2');
-  radgrad3.addColorStop(1, 'rgba(0, 201, 255, 0)');
-
-  var radgrad4 = ctx.createRadialGradient(0, 150, 50, 0, 140, 90);
-  radgrad4.addColorStop(0, '#F4F201');
-  radgrad4.addColorStop(0.8, '#E4C700');
-  radgrad4.addColorStop(1, 'rgba(228, 199, 0, 0)');
-
-  // draw shapes
-  ctx.fillStyle = radgrad4;
-  ctx.fillRect(0, 0, 150, 150);
-  ctx.fillStyle = radgrad3;
-  ctx.fillRect(0, 0, 150, 150);
-  ctx.fillStyle = radgrad2;
-  ctx.fillRect(0, 0, 150, 150);
-  ctx.fillStyle = radgrad;
-  ctx.fillRect(0, 0, 150, 150);
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>In this case, we've offset the starting point slightly from the end point to achieve a spherical 3D effect. It's best to try to avoid letting the inside and outside circles overlap because this results in strange effects which are hard to predict.</p>
-
-<p>The last color stop in each of the four gradients uses a fully transparent color. If you want to have a nice transition from this to the previous color stop, both colors should be equal. This isn't very obvious from the code because it uses two different CSS color methods as a demonstration, but in the first gradient <code>#019F62 = rgba(1,159,98,1)</code>.</p>
-
-<p>{{EmbedLiveSample("A_createRadialGradient_example", "180", "180", "https://mdn.mozillademos.org/files/244/Canvas_radialgradient.png")}}</p>
-
-<h2 id="Patterns" name="Patterns">Patterns</h2>
-
-<p>In one of the examples on the previous page, we used a series of loops to create a pattern of images. There is, however, a much simpler method: the <code>createPattern()</code> method.</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.createPattern", "createPattern(image, type)")}}</dt>
- <dd>Creates and returns a new canvas pattern object. <code>image</code> is a {{domxref("CanvasImageSource")}} (that is, an {{domxref("HTMLImageElement")}}, another canvas, a {{HTMLElement("video")}} element, or the like. <code>type</code> is a string indicating how to use the image.</dd>
-</dl>
-
-<p>The type specifies how to use the image in order to create the pattern, and must be one of the following string values:</p>
-
-<dl>
- <dt><code>repeat</code></dt>
- <dd>Tiles the image in both vertical and horizontal directions.</dd>
- <dt><code>repeat-x</code></dt>
- <dd>Tiles the image horizontally but not vertically.</dd>
- <dt><code>repeat-y</code></dt>
- <dd>Tiles the image vertically but not horizontally.</dd>
- <dt><code>no-repeat</code></dt>
- <dd>Doesn't tile the image. It's used only once.</dd>
-</dl>
-
-<p>We use this method to create a {{domxref("CanvasPattern")}} object which is very similar to the gradient methods we've seen above. Once we've created a pattern, we can assign it to the <code>fillStyle</code> or <code>strokeStyle</code> properties. For example:</p>
-
-<pre class="brush: js">var img = new Image();
-img.src = 'someimage.png';
-var ptrn = ctx.createPattern(img, 'repeat');
-</pre>
-
-<div class="note">
-<p><strong>Note:</strong> Like with the <code>drawImage()</code> method, you must make sure the image you use is loaded before calling this method or the pattern may be drawn incorrectly.</p>
-</div>
-
-<h3 id="A_createPattern_example" name="A_createPattern_example">A <code>createPattern</code> example</h3>
-
-<p>In this last example, we'll create a pattern to assign to the <code>fillStyle</code> property. The only thing worth noting is the use of the image's <code>onload</code> handler. This is to make sure the image is loaded before it is assigned to the pattern.</p>
-
-<pre class="brush: js;highlight[10]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  // create new image object to use as pattern
-  var img = new Image();
-  img.src = 'https://mdn.mozillademos.org/files/222/Canvas_createpattern.png';
-  img.onload = function() {
-
-    // create pattern
-    var ptrn = ctx.createPattern(img, 'repeat');
-    ctx.fillStyle = ptrn;
-    ctx.fillRect(0, 0, 150, 150);
-
-  }
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-
-<p>The result looks like this:</p>
-</div>
-
-<p>{{EmbedLiveSample("A_createPattern_example", "180", "180", "https://mdn.mozillademos.org/files/222/Canvas_createpattern.png")}}</p>
-
-<h2 id="Shadows">Shadows</h2>
-
-<p>Using shadows involves just four properties:</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.shadowOffsetX", "shadowOffsetX = float")}}</dt>
- <dd>Indicates the horizontal distance the shadow should extend from the object. This value isn't affected by the transformation matrix. The default is 0.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.shadowOffsetY", "shadowOffsetY = float")}}</dt>
- <dd>Indicates the vertical distance the shadow should extend from the object. This value isn't affected by the transformation matrix. The default is 0.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.shadowBlur", "shadowBlur = float")}}</dt>
- <dd>Indicates the size of the blurring effect; this value doesn't correspond to a number of pixels and is not affected by the current transformation matrix. The default value is 0.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.shadowColor", "shadowColor = color")}}</dt>
- <dd>A standard CSS color value indicating the color of the shadow effect; by default, it is fully-transparent black.</dd>
-</dl>
-
-<p>The properties <code>shadowOffsetX</code> and <code>shadowOffsetY</code> indicate how far the shadow should extend from the object in the X and Y directions; these values aren't affected by the current transformation matrix. Use negative values to cause the shadow to extend up or to the left, and positive values to cause the shadow to extend down or to the right. These are both 0 by default.</p>
-
-<p>The <code>shadowBlur</code> property indicates the size of the blurring effect; this value doesn't correspond to a number of pixels and is not affected by the current transformation matrix. The default value is 0.</p>
-
-<p>The <code>shadowColor</code> property is a standard CSS color value indicating the color of the shadow effect; by default, it is fully-transparent black.</p>
-
-<div class="note">
-<p><strong>Note:</strong> Shadows are only drawn for <code>source-over</code> <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Compositing" title="Web/Guide/HTML/Canvas_tutorial/Compositing">compositing operations</a>.</p>
-</div>
-
-<h3 id="A_shadowed_text_example">A shadowed text example</h3>
-
-<p>This example draws a text string with a shadowing effect.</p>
-
-<pre class="brush: js;highlight[4,5,6,7]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  ctx.shadowOffsetX = 2;
-  ctx.shadowOffsetY = 2;
-  ctx.shadowBlur = 2;
-  ctx.shadowColor = 'rgba(0, 0, 0, 0.5)';
-
-  ctx.font = '20px Times New Roman';
-  ctx.fillStyle = 'Black';
-  ctx.fillText('Sample String', 5, 30);
-}
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="80"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("A_shadowed_text_example", "180", "100", "https://mdn.mozillademos.org/files/2505/shadowed-string.png")}}</p>
-
-<p>We will look at the <code>font</code> property and <code>fillText</code> method in the next chapter about <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_text">drawing text</a>.</p>
-
-<h2 id="Canvas_fill_rules">Canvas fill rules</h2>
-
-<p>When using <code>fill</code> (or {{domxref("CanvasRenderingContext2D.clip", "clip")}} and {{domxref("CanvasRenderingContext2D.isPointInPath", "isPointinPath")}}) you can optionally provide a fill rule algorithm by which to determine if a point is inside or outside a path and thus if it gets filled or not. This is useful when a path intersects itself or is nested.<br>
- <br>
- Two values are possible:</p>
-
-<ul>
- <li><code><strong>"nonzero</strong></code>": The <a class="external external-icon" href="http://en.wikipedia.org/wiki/Nonzero-rule">non-zero winding rule</a>, which is the default rule.</li>
- <li><code><strong>"evenodd"</strong></code>: The <a class="external external-icon" href="http://en.wikipedia.org/wiki/Even%E2%80%93odd_rule">even-odd winding rule</a>.</li>
-</ul>
-
-<p>In this example we are using the <code>evenodd</code> rule.</p>
-
-<pre class="brush: js;highlight[6]">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-  ctx.beginPath();
-  ctx.arc(50, 50, 30, 0, Math.PI * 2, true);
-  ctx.arc(50, 50, 15, 0, Math.PI * 2, true);
-  ctx.fill('evenodd');
-}</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="100" height="100"&gt;&lt;/canvas&gt;</pre>
-
-<pre class="brush: js">draw();</pre>
-</div>
-
-<p>{{EmbedLiveSample("Canvas_fill_rules", "110", "110", "https://mdn.mozillademos.org/files/9855/fill-rule.png")}}</p>
-
-<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Drawing_shapes", "Web/API/Canvas_API/Tutorial/Drawing_text")}}</p>
diff --git a/files/es/web/guide/html/canvas_tutorial/basic_animations/index.html b/files/es/web/guide/html/canvas_tutorial/basic_animations/index.html
deleted file mode 100644
index 94c66fb05d..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/basic_animations/index.html
+++ /dev/null
@@ -1,333 +0,0 @@
----
-title: Animaciones básicas
-slug: Web/Guide/HTML/Canvas_tutorial/Basic_animations
-tags:
-  - Canvas
-  - HTML5
-  - Intermedio
-  - Tutorial
-  - graficos
-translation_of: Web/API/Canvas_API/Tutorial/Basic_animations
----
-<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Compositing", "Web/API/Canvas_API/Tutorial/Advanced_animations")}}</div>
-
-<div class="summary">
-<p>Ya que estamos usando JavaScript para controlar elementos {{HTMLElement("canvas")}} , también es muy fácil hacer animaciones (interactivas). En este capitulo veremos como hacer algunas animaciones básicas.</p>
-</div>
-
-<p>Probablemente la mayor limitación es que una vez que se dibuja una forma, se mantiene de esa manera. Si necesitamos moverlo tenemos que volver a dibujarlo y todo lo que se dibujó antes. Se necesita mucho tiempo para volver a dibujar estructuras complejas y el rendimiento depende en gran medida de la velocidad de la computadora en la que se ejecuta.</p>
-
-<h2 id="Basic_animation_steps" name="Basic_animation_steps">Pasos básicos de animación</h2>
-
-<p>Estos son los pasos que necesitas para dibujar un cuadro:</p>
-
-<ol>
- <li><strong>Limpiar el canvas</strong><br>
-  A menos que las formas que vas a dibujar llenen el canvas completo (por ejemplo, una imagen de fondo), debes borrar cualquier forma que haya dibujado previamente. La forma más fácil de hacerlo es usar el método {{domxref("CanvasRenderingContext2D.clearRect", "clearRect()")}}.</li>
- <li><strong>Guardar el estado del canvas</strong><br>
-  Si estás cambiando alguna configuración (como estilos, transformaciones, etc.) que afecte el estado del canvas y deseas asegurarte de que se utiliza el estado original cada vez que se dibuja una figura, debes guardar ese estado original. </li>
- <li><strong>Dibujar formas animadas</strong><br>
-  El paso en el que realizas el renderizado del cuadro actual.</li>
- <li><strong>Restaurar el estado del canvas</strong><br>
-  Si has guardado el estado, restáuralo antes de dibujar un nuevo cuadro.</li>
-</ol>
-
-<h2 id="Controlling_an_animation" name="Controlling_an_animation">Controlando una animación</h2>
-
-<p>Las formas se dibujan en el canvas utilizando los métodos de canvas directamente o llamando a funciones personalizadas. En circunstancias normales, solo vemos que estos resultados aparecen en el canvas cuando el script termina de ejecutarse. Por ejemplo, no es posible hacer una animación desde un bucle <code>for</code>.</p>
-
-<p>Eso significa que necesitamos una forma de ejecutar nuestras funciones de dibujo durante un período de tiempo. Hay dos formas de controlar una animación como esta.</p>
-
-<h3 id="Actualizaciones_Programadas">Actualizaciones Programadas</h3>
-
-<p>Primero {{domxref("window.setInterval()")}}, {{domxref("window.setTimeout()")}}, y {{domxref("window.requestAnimationFrame()")}} son funciones que pueden ser usadas para llamar una función especifica en un periodo de tiempo establecido.</p>
-
-<dl>
- <dt>{{domxref("WindowTimers.setInterval", "setInterval(function, delay)")}}</dt>
- <dd>Ejecuta una función especificada por <code>function</code> cada <code>delay</code> milisegundos.</dd>
- <dt>{{domxref("WindowTimers.setTimeout", "setTimeout(function, delay)")}}</dt>
- <dd>Ejecuta una función especificada por <code>function</code> dentro de <code>delay</code> milisegundos.</dd>
- <dt>{{domxref("Window.requestAnimationFrame()", "requestAnimationFrame(callback)")}}</dt>
- <dd>Comunica al navegador que  deseas iniciar una animación y requieres que el navegador llame a las funciones especificas para actualizar la misma antes de la siguiente escena.</dd>
-</dl>
-
-<p>Si no quieres ninguna interacción del usuario puedes usar la función <code>setInterval()</code> que repite la ejecución del código suministrado. Si lo que queremos es hacer un juego, podríamos usar eventos de teclado o el mouse para controlar la animación y usar <code>setTimeout()</code>. Al establecer los {{domxref("EventListener")}}, capturamos cualquier interacción del usuario y ejecutamos nuestras funciones de animación.</p>
-
-<div class="note">
-<p>En los siguiente ejemplo,usaremos el método para controlar animaciones {{domxref("window.requestAnimationFrame()")}}. El método <code>requestAnimationFrame</code> provee formas amigables y mas eficientes  para animar llamando cada marco de animación cuando el sistema esta listo para dibujar. La cantidad de devoluciones de llamadas suele ser 60 veces por segundo y podría ser reducido a menor periodo cuando se corre en un segundo plano. Para mas información acerca de los ciclos de animación, especialmente para juegos, Ver el Articulo <a href="/es/docs/Games/Anatomy">Anatomía de un videojuego</a> en nuestra <a href="/en-US/docs/Games">GameZona de desarrollo de Juegos</a>.</p>
-</div>
-
-<h2 id="Un_sistema_solar_animado">Un sistema solar animado</h2>
-
-<p>Este ejemplo animado es un pequeño modelo de nuestro sistema solar.</p>
-
-<pre class="brush: js">var sun = new Image();
-var moon = new Image();
-var earth = new Image();
-function init(){
-  sun.src = 'https://mdn.mozillademos.org/files/1456/Canvas_sun.png';
-  moon.src = 'https://mdn.mozillademos.org/files/1443/Canvas_moon.png';
-  earth.src = 'https://mdn.mozillademos.org/files/1429/Canvas_earth.png';
-  window.requestAnimationFrame(draw);
-}
-
-function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  ctx.globalCompositeOperation = 'destination-over';
-  ctx.clearRect(0,0,300,300); // limpiar canvas
-
-  ctx.fillStyle = 'rgba(0,0,0,0.4)';
-  ctx.strokeStyle = 'rgba(0,153,255,0.4)';
-  ctx.save();
-  ctx.translate(150,150);
-
-  // La tierra
-  var time = new Date();
-  ctx.rotate( ((2*Math.PI)/60)*time.getSeconds() + ((2*Math.PI)/60000)*time.getMilliseconds() );
-  ctx.translate(105,0);
-  ctx.fillRect(0,-12,50,24); // Sombra
-  ctx.drawImage(earth,-12,-12);
-
-  // La luna
-  ctx.save();
-  ctx.rotate( ((2*Math.PI)/6)*time.getSeconds() + ((2*Math.PI)/6000)*time.getMilliseconds() );
-  ctx.translate(0,28.5);
-  ctx.drawImage(moon,-3.5,-3.5);
-  ctx.restore();
-
-  ctx.restore();
-
-  ctx.beginPath();
-  ctx.arc(150,150,105,0,Math.PI*2,false); // Órbita terrestre
-  ctx.stroke();
-
-  ctx.drawImage(sun,0,0,300,300);
-
-  window.requestAnimationFrame(draw);
-}
-
-init();
-</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="300" height="300"&gt;&lt;/canvas&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample("Un_sistema_solar_animado", "310", "310", "https://mdn.mozillademos.org/files/202/Canvas_animation1.png")}}</p>
-
-<h2 id="Un_reloj_animado">Un reloj animado</h2>
-
-<p>Este ejemplo dibuja una reloj animado, mostrando la hora actual.</p>
-
-<pre class="brush: js">function clock(){
-  var now = new Date();
-  var ctx = document.getElementById('canvas').getContext('2d');
-  ctx.save();
-  ctx.clearRect(0,0,150,150);
-  ctx.translate(75,75);
-  ctx.scale(0.4,0.4);
-  ctx.rotate(-Math.PI/2);
-  ctx.strokeStyle = "black";
-  ctx.fillStyle = "white";
-  ctx.lineWidth = 8;
-  ctx.lineCap = "round";
-
-  // Aguja de la hora
-  ctx.save();
-  for (var i=0;i&lt;12;i++){
-    ctx.beginPath();
-    ctx.rotate(Math.PI/6);
-    ctx.moveTo(100,0);
-    ctx.lineTo(120,0);
-    ctx.stroke();
-  }
-  ctx.restore();
-
-  // Aguja del minuto
-  ctx.save();
-  ctx.lineWidth = 5;
-  for (i=0;i&lt;60;i++){
-    if (i%5!=0) {
-      ctx.beginPath();
-      ctx.moveTo(117,0);
-      ctx.lineTo(120,0);
-      ctx.stroke();
-    }
-    ctx.rotate(Math.PI/30);
-  }
-  ctx.restore();
-
-  var sec = now.getSeconds();
-  var min = now.getMinutes();
-  var hr  = now.getHours();
-  hr = hr&gt;=12 ? hr-12 : hr;
-
-  ctx.fillStyle = "black";
-
-  // Escribimos la hora
-  ctx.save();
-  ctx.rotate( hr*(Math.PI/6) + (Math.PI/360)*min + (Math.PI/21600)*sec )
-  ctx.lineWidth = 14;
-  ctx.beginPath();
-  ctx.moveTo(-20,0);
-  ctx.lineTo(80,0);
-  ctx.stroke();
-  ctx.restore();
-
-  // escribimos los minutos
-  ctx.save();
-  ctx.rotate( (Math.PI/30)*min + (Math.PI/1800)*sec )
-  ctx.lineWidth = 10;
-  ctx.beginPath();
-  ctx.moveTo(-28,0);
-  ctx.lineTo(112,0);
-  ctx.stroke();
-  ctx.restore();
-
-  // escribimos los segundos
-  ctx.save();
-  ctx.rotate(sec * Math.PI/30);
-  ctx.strokeStyle = "#D40000";
-  ctx.fillStyle = "#D40000";
-  ctx.lineWidth = 6;
-  ctx.beginPath();
-  ctx.moveTo(-30,0);
-  ctx.lineTo(83,0);
-  ctx.stroke();
-  ctx.beginPath();
-  ctx.arc(0,0,10,0,Math.PI*2,true);
-  ctx.fill();
-  ctx.beginPath();
-  ctx.arc(95,0,10,0,Math.PI*2,true);
-  ctx.stroke();
-  ctx.fillStyle = "rgba(0,0,0,0)";
-  ctx.arc(0,0,3,0,Math.PI*2,true);
-  ctx.fill();
-  ctx.restore();
-
-  ctx.beginPath();
-  ctx.lineWidth = 14;
-  ctx.strokeStyle = '#325FA2';
-  ctx.arc(0,0,142,0,Math.PI*2,true);
-  ctx.stroke();
-
-  ctx.restore();
-
-  window.requestAnimationFrame(clock);
-}
-
-window.requestAnimationFrame(clock);</pre>
-
-<div class="hidden">
-<pre class="brush: html">&lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample("Un_reloj_animado", "180", "180", "https://mdn.mozillademos.org/files/203/Canvas_animation2.png")}}</p>
-
-<h2 id="Un_panorama_en_bucle">Un panorama en bucle</h2>
-
-<p>En este ejemplo, una foto panorámica avanza de izquierda a derecha. Donde usaremos <a href="http://commons.wikimedia.org/wiki/File:Capitan_Meadows,_Yosemite_National_Park.jpg" title="http://commons.wikimedia.org/wiki/File:Capitan_Meadows,_Yosemite_National_Park.jpg">una imagen del Parque Nacional de Yosemite</a> que tomamos de Wikipedia, pero tu podrías usar cualquier imagen que sea mas grande que el canvas.</p>
-
-<pre class="brush: js">var img = new Image();
-
-// Variables de usuario - personalizar estas para cambiar la imagen cuando inicie el desplazamiento
-// dirección y velocidad.
-
-img.src = 'https://mdn.mozillademos.org/files/4553/Capitan_Meadows,_Yosemite_National_Park.jpg';
-var CanvasXSize = 800;
-var CanvasYSize = 200;
-var speed = 30; //más bajo es más rápido
-var scale = 1.05;
-var y = -4.5; //desplazamiento vertical
-
-// Programa principal
-
-var dx = 0.75;
-var imgW;
-var imgH;
-var x = 0;
-var clearX;
-var clearY;
-var ctx;
-
-img.onload = function() {
-    imgW = img.width * scale;
-    imgH = img.height * scale;
-
-    if (imgW &gt; CanvasXSize) {
-        // imagen más grande que canvas
-        x = CanvasXSize - imgW;
-    }
-    if (imgW &gt; CanvasXSize) {
-        // ancho de imagen más grande que canvas
-        clearX = imgW;
-    } else {
-        clearX = CanvasXSize;
-    }
-    if (imgH &gt; CanvasYSize) {
-        // altura de la imagen más grande que canvas
-        clearY = imgH;
-    } else {
-        clearY = CanvasYSize;
-    }
-
-    // obtener contexto de canvas
-    ctx = document.getElementById('canvas').getContext('2d');
-
-    // establecer frecuencia de actualización
-    return setInterval(draw, speed);
-}
-
-function draw() {
-    ctx.clearRect(0, 0, clearX, clearY); // clear the canvas
-
-    // si la imagen es &lt;= tamaño de Canvas
-    if (imgW &lt;= CanvasXSize) {
-        // reiniciar, comenzar desde el principio
-        if (x &gt; CanvasXSize) {
-            x = -imgW + x;
-        }
-        // dibujar image1 adicional
-        if (x &gt; 0) {
-            ctx.drawImage(img, -imgW + x, y, imgW, imgH);
-        }
-        // dibujar image2 adicional
-        if (x - imgW &gt; 0) {
-            ctx.drawImage(img, -imgW * 2 + x, y, imgW, imgH);
-        }
-    }
-
-    // la imagen es &gt; tamaño de Canvas
-    else {
-        // reiniciar, comenzar desde el principio
-        if (x &gt; (CanvasXSize)) {
-            x = CanvasXSize - imgW;
-        }
-        // dibujar image adicional
-        if (x &gt; (CanvasXSize-imgW)) {
-            ctx.drawImage(img, x - imgW + 1, y, imgW, imgH);
-        }
-    }
-    // dibujar imagen
-    ctx.drawImage(img, x, y,imgW, imgH);
-    // cantidad para moverse
-    x += dx;
-}</pre>
-
-<p>Debajo esta el elemento {{HTMLElement("canvas")}} en el cual va la imagen se va ha desplazar. Nota que el ancho y el alto especificado aquí son las variables <code>CanvasXZSize</code> y <code>CanvasYSize</code>.</p>
-
-<pre class="brush: html">&lt;canvas id="canvas" width="800" height="200"&gt;&lt;/canvas&gt;</pre>
-
-<p>{{EmbedLiveSample("Un_panorama_en_bucle", "830", "230")}}</p>
-
-<h2 id="Other_examples" name="Other_examples">Otros ejemplos</h2>
-
-<dl>
- <dt><a href="/es/docs/Web/API/Canvas_API/A_basic_ray-caster" title="/en-US/docs/Web/Guide/HTML/A_basic_ray-caster">Un ray-caster básico</a></dt>
- <dd>Un buen ejemplo de como hacer animaciones usando como control el teclado.</dd>
- <dt><a href="/es/docs/Web/API/Canvas_API/Tutorial/Advanced_animations">Animaciones avanzadas</a></dt>
- <dd>Vamos a echar un vistazo a algunas técnicas de animación avanzadas y física en el próximo capítulo.</dd>
-</dl>
-
-<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Compositing", "Web/API/Canvas_API/Tutorial/Advanced_animations")}}</p>
diff --git a/files/es/web/guide/html/canvas_tutorial/basic_usage/index.html b/files/es/web/guide/html/canvas_tutorial/basic_usage/index.html
deleted file mode 100644
index 17136d7a7e..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/basic_usage/index.html
+++ /dev/null
@@ -1,146 +0,0 @@
----
-title: Uso básico de Canvas
-slug: Web/Guide/HTML/Canvas_tutorial/Basic_usage
-translation_of: Web/API/Canvas_API/Tutorial/Basic_usage
----
-<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial", "Web/API/Canvas_API/Tutorial/Dibujando_formas")}}</div>
-
-<div class="summary">
-<p>Comenzamos este tutorial observando el elemento  {{HTMLElement("canvas")}}. Al final de esta página, sabrás como configurar el entorno 2D de canvas y habrás dibujado el primer ejemplo en tu navegador.</p>
-</div>
-
-<h2 id="El_elemento_&lt;canvas>">El elemento <code>&lt;canvas&gt;</code></h2>
-
-<pre class="brush: html">&lt;canvas id="tutorial" width="150" height="150"&gt;&lt;/canvas&gt;
-</pre>
-
-<p>A primera vista, un elemento {{HTMLElement("canvas")}} es parecido al elemento {{HTMLElement("img")}}, con la diferencia que este no tiene los atributos <code>src</code> y <code>alt</code>. El elemento <code>&lt;canvas&gt;</code> tiene solo dos atributos - {{htmlattrxref("width", "canvas")}} y {{htmlattrxref("height", "canvas")}}. Ambos son opcionales y pueden ser definidos usando propiedades <a href="/en-US/docs/DOM" rel="internal" title="en/DOM">DOM</a>. Cuando los atributos ancho y alto no estan especificados, el lienzo se inicializara con <strong>300 pixels</strong> ancho y <strong>150 pixels</strong> de alto. El elemento puede ser arbitrariamente redimensionado por CSS, pero durante el renderizado la imagen es escalada para ajustarse al tamaño de su layout. Si el tamaño del CSS no respeta el ratio del canvas inicial, este aparecerá distorsionado.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Si su renderizado se ve distorsionado, pruebe especificar los atributos width y height explícitamente en los atributos del <code>&lt;canvas&gt;</code> , y no usando CSS.</p>
-</div>
-
-<p>El atributo <a href="/es/docs/Web/HTML/Atributos_Globales/id">id</a> no está especificado para el elemento  <code>&lt;canvas&gt;</code> pero es uno de los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales de HTML</a> el cual puede ser aplicado a cualquier elemento HTML (como <a href="en-US/docs/Web/HTML/Global_attributes/class">class</a> por ejemplo). Siempre es buena idea proporcionar un <code>id</code> porque esto hace más fácil identificarlo en un script.</p>
-
-<p>El elemento <code>&lt;canvas&gt;</code> puede ser estilizado como a cualquier imagen normal (margin, border, background, etc). Estas reglas, sin embargo, no afectan a lo dibujado sobre el canvas. Mas adelante veremos cómo se hace esto en un <a href="en-US/docs/Web/API/Canvas_API/Tutorial/Applying_styles_and_colors">capítulo dedicado</a> en este tutorial. Cuando no tenemos reglas de estilo aplicadas al canvas, este será completamente transparente.</p>
-
-<div id="section_2">
-<h3 id="Contenido_alternativo">Contenido alternativo</h3>
-
-<p>El elemento &lt;canvas&gt; se diferencia de un tag {{HTMLElement("img")}} en que, como los elementos {{HTMLElement("video")}}, {{HTMLElement("audio")}} o {{HTMLElement("picture")}}, es fácil definir contenido alternativo (fallback content) para mostrarse en navegadores viejos que no soporten el elemento &lt;canvas&gt;, como versiones de Internet Explorer previas a la versión 9 o navegadores de texto. Siempre debes proporcionar contenido alternativo para mostrar en estos navegadores.</p>
-
-<p>Proporcionar contenido alternativo es muy explicito: solo debemos insertar el contenido alterno dentro del elemento &lt;canvas&gt;. Los navegadores que no soporten <code>&lt;canvas&gt;</code> ignoraran el contenedor y mostrarán el contenido indicado dentro de este. Navegadores que soporten <code>&lt;canvas&gt;</code> ignorarán el contenido en su interior (de las etiquetas), y mostrarán el canvas normalmente.</p>
-
-<p>Por ejemplo, podremos proporcionar un texto descriptivo del contenido del canvas o proveer una imagen estática del contenido rederizado. Nos podría quedar algo así:</p>
-
-<pre class="brush: html">&lt;canvas id="stockGraph" width="150" height="150"&gt;
-  current stock price: $3.15 +0.15
-&lt;/canvas&gt;
-
-&lt;canvas id="clock" width="150" height="150"&gt;
-  &lt;img src="images/clock.png" width="150" height="150" alt=""/&gt;
-&lt;/canvas&gt;
-</pre>
-
-<h2 id="Etiqueta_&lt;canvas>_requerida">Etiqueta <code>&lt;/canvas&gt;</code> requerida</h2>
-
-<p>De manera distinta al elemento {{HTMLElement("img")}}, el elemento {{HTMLElement("canvas")}} requiere cerrar la etiqueta  (<code>&lt;/canvas&gt;</code>).</p>
-
-<div class="note">
-<p><strong>Note:</strong> Aunque las versiones anteriores del navegador Safari de Apple no requeria el cierre de la etiqueta, la especificacion indica que es necesaria, asi que tu deberias incluir esta para asegurarte la compatibilidad. Aquellas versiones de Safari (anteriores versiones a 2.0) renderizaran el contenido de regreso agregandolo al canvas mismo a no ser que utilice trucos de CSS para enmascararlo. Afortunadamente, los usuarios de aquellas versiones de Safari son raros hoy en dia.</p>
-</div>
-
-<p>Si el contenido alternativo no se necesita, un simple <code>&lt;canvas id="foo" ...&gt;&lt;/canvas&gt;</code> es completamente compatible con todos los navegadores que soportan canvas.</p>
-
-<h2 id="El_contexto_de_renderización">El contexto de renderización</h2>
-
-<p>{{HTMLElement("canvas")}} crea un lienzo de dibujo fijado que expone uno o mas contextos renderizados, los cuales son usados para crear y manipular el contenido mostrado. Nos enfocaremos en renderizacion de contextos 2D. Otros contextos deberan proveer diferentes tipos de renderizaciones; por ejemplo, <a href="/en-US/docs/Web/WebGL" title="/en-US/docs/Web/WebGL">WebGL</a> usa un 3D contexto ("experimental-webgl") basado sobre <a class="external" href="http://www.khronos.org/opengles/" rel="external" title="http://en.wikipedia.org/wiki/OpenGL_ES">OpenGL ES</a>.</p>
-
-<p>El canvas esta inicialmente en blanco. Para mostrar alguna cosa, un script primero necesita acceder al contexto a renderizar y dibujar sobre este. El elemento  {{HTMLElement("canvas")}} tiene un <a href="/en-US/docs/Web/API/HTMLCanvasElement#Methods" title="/en-US/docs/Web/API/HTMLCanvasElement#Methods">method</a> llamado  <code>getContext()</code>, usado para obtener el contexto a renderizar y sus funciones de dibujo. <code>getContext()</code> toma un parametro, el tipo de contexto. Para graficos 2D, como los que cubre este tutorial, su especificacion es "2d".</p>
-
-<pre class="brush: js">var canvas = document.getElementById('tutorial');
-var ctx = canvas.getContext('2d');
-</pre>
-
-<p>La primera linea regresa el nodo DOM para el elemento {{HTMLElement("canvas")}} llamando al metodo  {{domxref("document.getElementById()")}}. Una vez tu tienes el elemento nodo, tu puedes acceder al contexto de dibujo usando su metodo <code>getContext()</code>.</p>
-
-<div id="section_5">
-<h2 id="Comprobando_soporte">Comprobando soporte</h2>
-
-<p>El contenido de regreso que es mostrado en navegadores los cuales no soportan {{HTMLElement("canvas")}}. Para los Scripts puede tambien comprobarse su soporte desde la programacion por un simple test para la presencia del metodo <code>getContext()</code>. Con un trozo de codigo parecido al que viene debajo:</p>
-
-<pre class="brush: js">var canvas = document.getElementById('tutorial');
-
-if (canvas.getContext){
-  var ctx = canvas.getContext('2d');
-  // drawing code here
-} else {
-  // canvas-unsupported code here
-}
-</pre>
-</div>
-</div>
-
-<h2 id="Un_esqueleto_de_plantilla">Un esqueleto de plantilla</h2>
-
-<p>Aqui esta una plantilla minimalista, la cual usaremos como punto de partida para posteriores ejemplos.</p>
-
-<pre class="brush: html">&lt;html&gt;
-  &lt;head&gt;
-    &lt;title&gt;Canvas tutorial&lt;/title&gt;
-    &lt;script type="text/javascript"&gt;
-      function draw(){
-        var canvas = document.getElementById('tutorial');
-        if (canvas.getContext){
-          var ctx = canvas.getContext('2d');
-        }
-      }
-    &lt;/script&gt;
-    &lt;style type="text/css"&gt;
-      canvas { border: 1px solid black; }
-    &lt;/style&gt;
-  &lt;/head&gt;
-  &lt;body onload="draw();"&gt;
-    &lt;canvas id="tutorial" width="150" height="150"&gt;&lt;/canvas&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>El script incluye una funcion llamada draw(), la cual es ejecutada una vez finalizada la carga de la pagina; este esta hecho usando el evento load del documento. Esta funcion, o una parecida, podria tambien ser llamada usando {{domxref("window.setTimeout()")}}, {{domxref("window.setInterval()")}}, o cualquier otro manejador de evento, a lo largo de que la pagina esta siendo cargada la primera vez.</p>
-
-<p>Aqui esta como la plantilla se ve en acción:</p>
-
-<p>{{EmbedLiveSample("Un_esqueleto_de_plantilla", 160, 160)}}</p>
-
-<h2 id="Un_simple_ejemplo">Un simple ejemplo</h2>
-
-<p>Para comenzar, daremos un vistazo a un simple ejemplo que dibuja dos rectangulos que se intersectan, uno de los cuales tiene alpha transparencia. Exploraremos como esto trabaja en mas detalle en posteriores ejemplos.</p>
-
-<pre class="brush: html">&lt;html&gt;
- &lt;head&gt;
-  &lt;script type="application/javascript"&gt;
-    function draw() {
-      var canvas = document.getElementById("canvas");
-      if (canvas.getContext) {
-        var ctx = canvas.getContext("2d");
-
-        ctx.fillStyle = "rgb(200,0,0)";
-        ctx.fillRect (10, 10, 55, 50);
-
-        ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
-        ctx.fillRect (30, 30, 55, 50);
-      }
-    }
-  &lt;/script&gt;
- &lt;/head&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>Este ejemplo quedaría así:</p>
-
-<p>{{EmbedLiveSample("Un_simple_ejemplo", 160, 160, "https://mdn.mozillademos.org/files/228/canvas_ex1.png")}}</p>
-
-<p>{{PreviousNext("Web/Guide/HTML/Canvas_tutorial", "Web/Guide/HTML/Canvas_tutorial/Dibujando_formas")}}</p>
diff --git a/files/es/web/guide/html/canvas_tutorial/dibujando_formas/index.html b/files/es/web/guide/html/canvas_tutorial/dibujando_formas/index.html
deleted file mode 100644
index 3467533e93..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/dibujando_formas/index.html
+++ /dev/null
@@ -1,513 +0,0 @@
----
-title: Dibujando formas con  canvas
-slug: Web/Guide/HTML/Canvas_tutorial/Dibujando_formas
-tags:
-  - Canvas
-  - HTML
-  - HTML Canvas
-  - HTML5
-  - Intermedio
-  - Tutorial
-  - graficos
-translation_of: Web/API/Canvas_API/Tutorial/Drawing_shapes
----
-<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Basic_usage", "Web/API/Canvas_API/Tutorial/Applying_styles_and_colors")}}</div>
-
-<div class="summary">
-<p>Ahora que hemos preparado nuestro <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_usage">entorno canvas</a>, podemos entrar en detalles de como dibujar en el canvas. Al final de este artículo, habrás aprendido  como dibujar rectángulos, triángulos, líneas, arcos y curvas, dándote familiaridad con algunas figuras básicas. Trabajar con rutas es esencial cuando dibujamos objetos sobre el canvas y veremos como se puede hacer eso.</p>
-</div>
-
-<h2 id="La_cuadrícula">La cuadrícula</h2>
-
-<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/224/Canvas_default_grid.png" style="float: right; height: 220px; width: 220px;">Antes de que podamos empezar a dibujar, necesitamos hablar sobre la cuadrícula del canvas o el <strong>espacio de coordenadas</strong>. La plantilla HTML de la página anterior tenía un elemento canvas con un 'height' y un 'width' de 150 píxeles. A la derecha, puedes ver este canvas con la cuadrícula por defecto superpuesta. Normalmente una unidad en la cuadrícula corresponde a un píxel en el elemento canvas. El origen de esta cuadrícula está posicionado en la esquina superior izquierda (coordenada (0,0)). Todos los elementos estan posicionados de manera relativa a este punto, así que la posición de la esquina superior izquierda del cuadrado azul es de 'x' pixeles desde la izquierda y 'y' pixeles desde arriba (coordenada (x,y)). Mas tarde en este tutorial veremos como trasladar el punto de origen a una posicion diferente, girar la cuadrícula e incluso darle una escala diferente. Por ahora nos dedicaremos a lo mas común.</p>
-
-<h2 id="Dibujando_rectángulos">Dibujando rectángulos</h2>
-
-<p>A diferencia de <a href="/en-US/docs/SVG" rel="internal" title="en/SVG">SVG</a>, {{HTMLElement("canvas")}} solo soporta una forma primitiva: rectangulos. Todas las otras formas deben ser creadas por la combinación de uno o más trazos, listas de puntos conectados por líneas. Afortunadamente, tenemos una variedad de funciones para dibujar trazos  que hacen posible componer formas muy complejas.</p>
-
-<div id="section_3">
-<p>Primero veamos el rectángulo. Aquí hay tres funciones que podemos usar en el canvas para dibujarlos:</p>
-
-<dl>
- <dt><code>fillRect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
- <dd>Dibuja un rectángulo relleno.</dd>
- <dt><code>strokeRect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
- <dd>Dibuja el contorno de un rectángulo.</dd>
- <dt><code>clearRect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
- <dd>Borra un área rectangular especificada, dejándola totalmente transparente.</dd>
-</dl>
-
-<p>Cada una de estas tres funciones toma los mismos parámetros. X e Y especifican la posición del canvas (en relación con el origen) desde la esquina superior izquierda del rectángulo. Tambien especifica los parámetros de anchura y altura que proporcionan el tamaño del rectángulo.</p>
-
-<p>A continuación se muestra la función draw() de la página anterior, pero ahora haciendo uso de estas tres funciones.</p>
-
-<h3 id="Ejemplo_de_forma_rectangular">Ejemplo de forma rectangular</h3>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext) {
-    var ctx = canvas.getContext('2d');
-
-    ctx.fillRect(25,25,100,100);
-    ctx.clearRect(45,45,60,60);
-    ctx.strokeRect(50,50,50,50);
-  }
-}</pre>
-
-<p>El resultado de este ejemplo se muestra a continuación.</p>
-
-<p>{{EmbedLiveSample("Rectangular_shape_example", 160, 160, "https://mdn.mozillademos.org/files/245/Canvas_rect.png")}}</p>
-
-<p>La función fillRect() dibuja un cuadrado grande negro de 100 píxeles en cada lado. La función clearRect() luego borra un cuadrado de 60x60 píxeles del centro, y luego strokeRect() es llamado para crear un contorno rectangular de 50x50 píxeles dentro del cuadrado borrado.</p>
-
-<p>En las próximas páginas veremos dos métodos alternativos para clearRect(), y también veremos cómo cambiar el color y el trazo de diferentes formas.</p>
-
-<p>A diferencia de las funciones de trazo que veremos en la próxima sección, las tres funciones del rectángulo dibujan inmediatamente en el canvas.</p>
-
-<h2 id="Dibujando_trazos">Dibujando trazos</h2>
-
-<p>Crear formas mediante trazos requiere algunos pasos adicionales.</p>
-
-<ol>
- <li>Primero, se crea el trazo.</li>
- <li>A continuación, se usan <a href="/es/docs/Web/API/CanvasRenderingContext2D#Paths">comandos de dibujo</a> para dibujar dentro del trazo.</li>
- <li>Después, se cierra el trazo.</li>
- <li>Una vez el trazo ha sido creado, se le puede dar contorno o relleno para renderizarlo.</li>
-</ol>
-
-<p>Estas son las funciones que se usan para llevar a cabo estos pasos:</p>
-
-<dl>
- <dt><code>beginPath()</code></dt>
- <dd>Crea un nuevo trazo. Una vez creado, los comandos de dibujo futuros son aplicados dentro del trazo y usados para construir el nuevo trazo hacia arriba.</dd>
- <dt><code>closePath()</code></dt>
- <dd>Cierra el trazo de tal forma que los comandos de dibujo futuros son, una vez más redireccionados al contexto.</dd>
- <dt><code>stroke()</code></dt>
- <dd>Dibuja el contorno de la forma.</dd>
- <dt><code>fill()</code></dt>
- <dd>Dibuja una forma solida rellenando el área del trazo.</dd>
-</dl>
-
-<p>El primer paso para crear un trazo es llamar la función <code>beginPath()</code>. Internamente, los trazos son guardados como una lista de subtrazos (lineas, arcos, etc) los cuales juntos crean una forma. Todo tiempo que sea llamado este método la lista es reseteada y podemos empezar a dibujar nuevas formas.</p>
-
-<div class="note"><strong>Nota:</strong> Cuando el trazo actual este vacio, como aparece inmediatamente despues de llamar la función <code>beginPath()</code>, o en un canvas nuevo, el primer comando para la construcción del trazo es siempre tratada como un <code>moveTo()</code>, independientemente de cual es el trazo actual. Por esta razón casi siempre querrás específicamente setear tu posición de inicio despues de resetear un trazo.</div>
-
-<p>El segundo paso es llamar los métodos que específican los trazos a crear. Los veremos en seguida.</p>
-
-<p>El tercero, y un paso opcional, es llamar a la función <code>closePath()</code>. Este método trata de cerrar la forma dibujando una linea recta desde el punto actual al inicio. Si la forma ya ha sido cerrada o hay solamente un punto en la lista, la función hace nada.</p>
-
-<div class="note"><strong>Nota:</strong> Cuando llamas a la función <code>fill()</code>, cualquier forma abierta es cerrada automaticamente, de tal forma que no tendrás que llamar a la función <code>closePath()</code>. Este no es el caso cuando llamas a la función <code>stroke()</code>.</div>
-
-<h3 id="Dibujando_un_triangulo">Dibujando un triangulo</h3>
-
-<p>Por ejemplo, el código para dibujar un triangulo luciría como el siguiente:</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext){
-    var ctx = canvas.getContext('2d');
-
-    ctx.beginPath();
-    ctx.moveTo(75,50);
-    ctx.lineTo(100,75);
-    ctx.lineTo(100,25);
-    ctx.closePath();
-    ctx.fill();
-  }
-}
-</pre>
-
-<p>El resultado lucirá así:</p>
-
-<p>{{EmbedLiveSample("Drawing_a_triangle", 160, 160)}}</p>
-
-<h3 id="Moviendo_la_pluma">Moviendo la pluma</h3>
-
-<p>Una función muy útil, la cual realmente no dibuja algo pero convierte parte de la lista de trazos descrita arriba, es la función <code>moveTo()</code>. Puedes, probablemente, pensar mejor de esta como levantar el lápiz o la pluma de un punto en un pedazo de papel y ponerlo en el siguiente punto.</p>
-
-<dl>
- <dt><code>moveTo(<em>x</em>, <em>y</em>)</code></dt>
- <dd>Mueve la pluma a las coordenadas específicadas por <code>x</code> e <code>y</code>.</dd>
-</dl>
-
-<p>Cuando el canvas es inicializado ó la función <code>beginPath()</code> es llamada, querrás usar la función <code>moveTo()</code> para colocar el punto de inicio en alguna otra parte. Podríamos usar <code>moveTo()</code> para dibujar trazos sin conectar. Toma un vistazo a la cara sonriente de abajo. He marcado los lugares donde use el método <code>moveTo()</code> (las líneas rojas).</p>
-
-<p>Para intentar esto por tí mismo, puedes usar el pequeño código de abajo. Solo pégalo dentro de la función <code>draw()</code> que vimos antes.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext){
-    var ctx = canvas.getContext('2d');
-
-    ctx.beginPath();
-    ctx.arc(75,75,50,0,Math.PI*2,true); // Círculo externo
-    ctx.moveTo(110,75);
-    ctx.arc(75,75,35,0,Math.PI,false);   // Boca (contra reloj)
-    ctx.moveTo(65,65);
-    ctx.arc(60,65,5,0,Math.PI*2,true);  // Ojo izquierdo
-    ctx.moveTo(95,65);
-    ctx.arc(90,65,5,0,Math.PI*2,true);  // Ojo derecho
-    ctx.stroke();
-  }
-}
-</pre>
-
-<p>El resultado luce así:</p>
-
-<p>{{EmbedLiveSample("Moving_the_pen", 160, 160, "https://mdn.mozillademos.org/files/252/Canvas_smiley.png")}}</p>
-
-<p>Si quisieras ver las líneas conectadas, puedes remover las líneas de código que llaman <code>moveTo()</code>.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Para aprender más sobre la función <code>arc()</code>, vea los {{anch("Arcs")}} a continuación.</p>
-</div>
-
-<h3 id="Líneas">Líneas</h3>
-
-<p>Para dibujar lineas rectas usa el método <code>lineTo()</code>.</p>
-
-<dl>
- <dt><code>lineTo(<em>x</em>, <em>y</em>)</code></dt>
- <dd>Dibuja una línea desde la posición actual del dibujo a la posición específicada por <code>x</code> e <code>y</code>.</dd>
-</dl>
-
-<p>Este método toma dos argumentos <code>x</code> e <code>y</code>, los cuales son las coordenadas del punto final de la linea. El punto de inicio es dependiente de los trazos previamente dibujados, donde el punto final del trazo anterior es el punto inicial para el siguiente, etc. El punto de inicio también puede ser cambiado usando el método <code>moveTo()</code>.</p>
-
-<p>El ejemplo siguiente dibuja dos triángulos, uno rellenado y el otro contorneado.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext){
-    var ctx = canvas.getContext('2d');
-
-    // Triángulo rellenado
-    ctx.beginPath();
-    ctx.moveTo(25,25);
-    ctx.lineTo(105,25);
-    ctx.lineTo(25,105);
-    ctx.fill();
-
-    // Triángulo contorneado
-    ctx.beginPath();
-    ctx.moveTo(125,125);
-    ctx.lineTo(125,45);
-    ctx.lineTo(45,125);
-    ctx.closePath();
-    ctx.stroke();
-  }
-}
-</pre>
-
-<p>Esto comienza llamando a <code>beginPath()</code> para empezar una nueva forma. Entonces usamos el método <code>moveTo()</code> para mover el punto de inicio a la posición deseada. Debajo de esto dos líneas son dibujadas lo cual pinta dos lados del triángulo.</p>
-
-<p>{{EmbedLiveSample("Lines", 160, 160, "https://mdn.mozillademos.org/files/238/Canvas_lineTo.png")}}</p>
-
-<p>Te darás cuenta de la diferencia entre el triángulo rellenado y el contorneado. Esto es, como se menciona arriba, porque las formas son automáticamente cerradas cuando un trazo es rellenado, pero no cuando esta contorneado. Si sacamos el <code>closePath()</code> para el triángulo contorneado, solamente dos líneas serian dibujadas, no un triángulo completo.</p>
-
-<h3 id="Arcos">Arcos</h3>
-
-<p>Para dibujar arcos o circulos usamos el método <code>arc()</code>. También puedes usar <code>arcTo()</code>, pero su implementación es un poco menos confiable, así que no lo cubriremos aquí.</p>
-
-<dl>
- <dt><code>arc(<em>x</em>, <em>y</em>, <em>radius</em>, <em>startAngle</em>, <em>endAngle</em>, <em>anticlockwise</em>)</code></dt>
- <dd>Dibuja un arco.</dd>
-</dl>
-
-<p>Este método toma cinco parámetros: <code>x</code> e <code>y</code> son las coordenadas del centro del círculo en el cual el arco debería ser dibujado. <code>radius</code> se explica por sí solo. Los parámetros <code>startAngle</code> y <code>endAngle</code> definen el punto de inicio y punto final del arco en radianes a lo largo de la curva del círculo. Estos son medidos desde el eje x. El parámetro <code>anticlockwise</code> es un valor Booleano el cual cuando es verdadero (<code>true</code>) dibuja el arco al contrario de las manecillas del reloj, de lo contrario el arco es dibujado al sentido de las manecillas del reloj.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Los ángulos en la función del arco (<code>arc</code>) son medidos en radianes, no en grados. Para convertir grados a radianes puedes usar la siguiente expresión en Javascript: <code>radians = (Math.PI/180)*degrees</code>.</p>
-</div>
-
-<p>El siguiente ejemplo es un poco más complejo que otros que hemos visto arriba. Esto dibuja 12 diferentes arcos, todos con diferentes ángulos y rellenos.</p>
-
-<p>Las dos sentencias <code>for</code> son para iterar a través de las filas y columnas de los arcos. Para cada arco, empezamos un nuevo trazo llamando <code>beginPath()</code>. En el código, cada uno de los parámetros para el arco estan en una variable para su entendimiento, pero no es necesario esto en la vida real.</p>
-
-<p>Las coordenadas <code>x</code> e <code>y</code> deberían ser suficientemente claras. <code>radius</code> y <code>startAngle</code> estan arreglados. El <code>endAngle</code> inicia en 180 grados (la mitad de un círculo) en la primera columna y es incrementado por pasos de 90 grados, culminando en un círculo completo en la última columna.</p>
-
-<p>El parámetro <code>clockwise</code> resulta, en la primera y tercera fila siendo dibujado como un arco al sentido de las manecillas de reloj y la segunda y cuarta fila como arcos al contrario de las manecillas de reloj. Finalmente, la estructura <code>if</code> hace los arcos contorneados a la mitad desde arriba y los arcos hacia abajorellenados a la mitad.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="200"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext){
-    var ctx = canvas.getContext('2d');
-
-    for(var i=0;i&lt;4;i++){
-      for(var j=0;j&lt;3;j++){
-        ctx.beginPath();
-        var x              = 25+j*50;               // Coordenada x
-        var y              = 25+i*50;               // Coordenada y
-        var radius         = 20;                    // Radio del arco
-        var startAngle     = 0;                     // Punto inicial del círculo
-        var endAngle       = Math.PI+(Math.PI*j)/2; // Punto final del círculo
-        var anticlockwise  = i%2==0 ? false : true; // Sentido de las manecillas del reloj y contrario a ellas
-
-        ctx.arc(x, y, radius, startAngle, endAngle, anticlockwise);
-
-        if (i&gt;1){
-          ctx.fill();
-        } else {
-          ctx.stroke();
-        }
-      }
-    }
-  }
-}
-</pre>
-{{EmbedLiveSample("Arcs", 160, 210, "https://mdn.mozillademos.org/files/204/Canvas_arc.png")}}
-
-<h3 id="Curvas_Bezier_curvas_cuadráticas">Curvas Bezier curvas cuadráticas</h3>
-
-<p>El siguiente tipo de trazos disponibles son las  <a class="external" href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve" rel="external" title="http://en.wikipedia.org/wiki/B%C3%A9zier_curve">curvas Bézier</a>, en sus dos variantes, cúbicas y cuadráticas. Son usadas generalmente para dibujar complejas formas orgánicas.</p>
-
-<dl>
- <dt><code>quadraticCurveTo(cp1x, cp1y, x, y)</code></dt>
- <dd><span id="result_box" lang="es"><span>Dibuja una curva cuadrática de Bézier desde la posición actual de la pluma hasta el punto final especificado por <code>x</code> e <code>y</code>, utilizando el punto de control especificado por <code>cp1x</code> y <code>cp1y</code>.</span></span></dd>
- <dt><code>bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)</code></dt>
- <dd>Dibuja una curva cúbica de Bézier desde la posición actual de la pluma hasta el punto final especificado por <code>x</code> e <code>y</code>, utilizando los puntos de control especificados por (<code>cp1x</code>, <code>cp1y</code>) y (<code>cp2x</code>, <code>cp2y</code>).</dd>
-</dl>
-
-<p><img alt="" class="internal" src="https://mdn.mozillademos.org/files/223/Canvas_curves.png" style="float: right; height: 190px; width: 190px;">La diferencia entre estos puede describirse mejor utilizando la imagen de la derecha. Una curva cuadrática de Bézier tiene un punto inicial y un punto final (puntos azules) y un solo <strong>punto de control</strong> (indicado por el punto rojo), mientras que una curva cúbica de Bézier utiliza dos puntos de control.</p>
-
-<p>Los parámetros <code>x</code> e <code>y</code> de ambos métodos son las coordenadas del punto final. <code>cp1x</code> y <code>cp1y</code> son las coordenadas del primer punto de control, y <code>cp2x</code> y <code>cp2y</code> son las coordenadas del segundo punto de control.</p>
-
-<p>El uso de curvas cuadráticas y cúbicas Bézier puede ser bastante difícil, ya que a diferencia del software de dibujo vectorial como Adobe Illustrator, no tenemos respuesta visual directa en cuanto a lo que estamos haciendo. Esto hace bastante difícil dibujar formas complejas. En el siguiente ejemplo, vamos a dibujar algunas formas orgánicas simples, pero si tienes el tiempo y, sobre todo, la paciencia, se pueden crear formas mucho más complejas.</p>
-
-<p>No hay nada muy difícil en estos ejemplos. En ambos casos vemos una sucesión de curvas que se dibujan que finalmente dan lugar a una forma completa.</p>
-
-<h4 id="Curvas_de_Bezier_cuadraticas">Curvas de Bezier cuadraticas</h4>
-
-<p>Este ejemplo usa multiples curvas cuadraticas de Bézier para renderizar un globo de voz.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext) {
-    var ctx = canvas.getContext('2d');
-
-    // Quadratric curves example
-    ctx.beginPath();
-    ctx.moveTo(75,25);
-    ctx.quadraticCurveTo(25,25,25,62.5);
-    ctx.quadraticCurveTo(25,100,50,100);
-    ctx.quadraticCurveTo(50,120,30,125);
-    ctx.quadraticCurveTo(60,120,65,100);
-    ctx.quadraticCurveTo(125,100,125,62.5);
-    ctx.quadraticCurveTo(125,25,75,25);
-    ctx.stroke();
-  }
-}
-</pre>
-
-<p>{{EmbedLiveSample("Quadratic_Bezier_curves", 160, 160, "https://mdn.mozillademos.org/files/243/Canvas_quadratic.png")}}</p>
-
-<h4 id="Curvas_cúbicas_Bezier">Curvas cúbicas Bezier</h4>
-
-<p>Este ejemplo dibuja un corazon usanco curvas cúbicas de Bézier.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext){
-    var ctx = canvas.getContext('2d');
-
-    // Quadratric curves example
-    ctx.beginPath();
-    ctx.moveTo(75,40);
-    ctx.bezierCurveTo(75,37,70,25,50,25);
-    ctx.bezierCurveTo(20,25,20,62.5,20,62.5);
-    ctx.bezierCurveTo(20,80,40,102,75,120);
-    ctx.bezierCurveTo(110,102,130,80,130,62.5);
-    ctx.bezierCurveTo(130,62.5,130,25,100,25);
-    ctx.bezierCurveTo(85,25,75,37,75,40);
-    ctx.fill();
-  }
-}
-</pre>
-
-<p>{{EmbedLiveSample("Cubic_Bezier_curves", 160, 160, "https://mdn.mozillademos.org/files/207/Canvas_bezier.png")}}</p>
-
-<h3 id="Rectangles">Rectangles</h3>
-
-<p>In addition to the three methods we saw in {{anch("Drawing rectangles")}}, which draw rectangular shapes directly to the canvas, there's also the <code>rect()</code> method, which adds a rectangular path to a currently open path.</p>
-
-<dl>
- <dt><code>rect(<em>x</em>, <em>y</em>, <em>width</em>, <em>height</em>)</code></dt>
- <dd>Draws a rectangle whose top-left corner is specified by (<code>x</code>, <code>y</code>) with the specified <code>width</code> and <code>height</code>.</dd>
-</dl>
-
-<p>When this method is executed, the <code>moveTo()</code> method is automatically called with the parameters (0,0). In other words, the current pen position is automatically reset to the default coordinates.</p>
-
-<h3 id="Making_combinations">Making combinations</h3>
-
-<p>So far, each example on this page has used only one type of path function per shape. However, there's no limitation to the number or types of paths you can use to create a shape. So in this final example, let's combine all of the path functions to make a set of very famous game characters.</p>
-
-<div class="hidden">
-<pre class="brush: html">&lt;html&gt;
- &lt;body onload="draw();"&gt;
-   &lt;canvas id="canvas" width="150" height="150"&gt;&lt;/canvas&gt;
- &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<pre class="brush: js">function draw() {
-  var canvas = document.getElementById('canvas');
-  if (canvas.getContext){
-    var ctx = canvas.getContext('2d');
-
-    roundedRect(ctx,12,12,150,150,15);
-    roundedRect(ctx,19,19,150,150,9);
-    roundedRect(ctx,53,53,49,33,10);
-    roundedRect(ctx,53,119,49,16,6);
-    roundedRect(ctx,135,53,49,33,10);
-    roundedRect(ctx,135,119,25,49,10);
-
-    ctx.beginPath();
-    ctx.arc(37,37,13,Math.PI/7,-Math.PI/7,false);
-    ctx.lineTo(31,37);
-    ctx.fill();
-
-    for(var i=0;i&lt;8;i++){
-      ctx.fillRect(51+i*16,35,4,4);
-    }
-
-    for(i=0;i&lt;6;i++){
-      ctx.fillRect(115,51+i*16,4,4);
-    }
-
-    for(i=0;i&lt;8;i++){
-      ctx.fillRect(51+i*16,99,4,4);
-    }
-
-    ctx.beginPath();
-    ctx.moveTo(83,116);
-    ctx.lineTo(83,102);
-    ctx.bezierCurveTo(83,94,89,88,97,88);
-    ctx.bezierCurveTo(105,88,111,94,111,102);
-    ctx.lineTo(111,116);
-    ctx.lineTo(106.333,111.333);
-    ctx.lineTo(101.666,116);
-    ctx.lineTo(97,111.333);
-    ctx.lineTo(92.333,116);
-    ctx.lineTo(87.666,111.333);
-    ctx.lineTo(83,116);
-    ctx.fill();
-
-    ctx.fillStyle = "white";
-    ctx.beginPath();
-    ctx.moveTo(91,96);
-    ctx.bezierCurveTo(88,96,87,99,87,101);
-    ctx.bezierCurveTo(87,103,88,106,91,106);
-    ctx.bezierCurveTo(94,106,95,103,95,101);
-    ctx.bezierCurveTo(95,99,94,96,91,96);
-    ctx.moveTo(103,96);
-    ctx.bezierCurveTo(100,96,99,99,99,101);
-    ctx.bezierCurveTo(99,103,100,106,103,106);
-    ctx.bezierCurveTo(106,106,107,103,107,101);
-    ctx.bezierCurveTo(107,99,106,96,103,96);
-    ctx.fill();
-
-    ctx.fillStyle = "black";
-    ctx.beginPath();
-    ctx.arc(101,102,2,0,Math.PI*2,true);
-    ctx.fill();
-
-    ctx.beginPath();
-    ctx.arc(89,102,2,0,Math.PI*2,true);
-    ctx.fill();
-  }
-}
-
-// A utility function to draw a rectangle with rounded corners.
-
-function roundedRect(ctx,x,y,width,height,radius){
-  ctx.beginPath();
-  ctx.moveTo(x,y+radius);
-  ctx.lineTo(x,y+height-radius);
-  ctx.quadraticCurveTo(x,y+height,x+radius,y+height);
-  ctx.lineTo(x+width-radius,y+height);
-  ctx.quadraticCurveTo(x+width,y+height,x+width,y+height-radius);
-  ctx.lineTo(x+width,y+radius);
-  ctx.quadraticCurveTo(x+width,y,x+width-radius,y);
-  ctx.lineTo(x+radius,y);
-  ctx.quadraticCurveTo(x,y,x,y+radius);
-  ctx.stroke();
-}
-</pre>
-
-<div id="section_18">
-<p>The resulting image looks like this:</p>
-
-<p>{{EmbedLiveSample("Making_combinations", 160, 160)}}</p>
-
-<p>We won't go over this in detail, since it's actually surprisingly simple. The most important things to note are the use of the <code>fillStyle</code> property on the drawing context, and the use of a utility function (in this case <code>roundedRect()</code>). Using utility functions for bits of drawing you do often can be very helpful and reduce the amount of code you need, as well as its complexity.</p>
-
-<p>We'll take another look at <code>fillStyle</code>, in more detail, later in this tutorial. Here, all we're doing is using it to change the fill color for paths from the default color of black to white, and then back again.</p>
-
-<p>{{PreviousNext("Web/Guide/HTML/Canvas_tutorial/Basic_usage", "Web/Guide/HTML/Canvas_tutorial/Using_images")}}</p>
-</div>
-</div>
-
-<p> </p>
diff --git a/files/es/web/guide/html/canvas_tutorial/hit_regions_and_accessibility/index.html b/files/es/web/guide/html/canvas_tutorial/hit_regions_and_accessibility/index.html
deleted file mode 100644
index 967710de49..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/hit_regions_and_accessibility/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: Hit regions and accessibility
-slug: Web/Guide/HTML/Canvas_tutorial/Hit_regions_and_accessibility
-translation_of: Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility
----
-<div>{{CanvasSidebar}} {{ PreviousNext("Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas", "Web/API/Canvas_API/Tutorial/Optimizing_canvas") }}</div>
-
-<div class="summary">The {{HTMLElement("canvas")}} element on its own is just a bitmap and does not provide information about any drawn objects. Canvas content is not exposed to accessibility tools like semantic HTML is. In general, you should avoid using canvas in an accessible website or app. The following guidelines can help to make it more accessible.</div>
-
-<div class="summary">El elemento {{HTMLElement ("canvas")}} por sí solo es solo un mapa de bits y no proporciona información sobre ningún objeto dibujado. El contenido del lienzo no está expuesto a herramientas de accesibilidad como el HTML semántico. En general, debe evitar usar canvas en un sitio web o aplicación accesible. Las siguientes pautas pueden ayudar a que sea más accesible.</div>
-
-<h2 id="Fallback_content">Fallback content</h2>
-
-<p>The content inside the <code>&lt;canvas&gt; ... &lt;/canvas&gt;</code> tags can be used as a fallback for browsers which don't support canvas rendering. It's also very useful for assistive technology users (like screen readers) which can read and interpret the sub DOM in it. A good example at <a href="http://www.html5accessibility.com/tests/canvas.html">html5accessibility.com</a> demonstrates how this can be done:</p>
-
-<pre class="brush: html">&lt;canvas&gt;
-  &lt;h2&gt;Shapes&lt;/h2&gt;
-  &lt;p&gt;A rectangle with a black border.
-   In the background is a pink circle.
-   Partially overlaying the &lt;a href="http://en.wikipedia.org/wiki/Circle" onfocus="drawCircle();" onblur="drawPicture();"&gt;circle&lt;/a&gt;.
-   Partially overlaying the circle is a green
-   &lt;a href="http://en.wikipedia.org/wiki/Square" onfocus="drawSquare();" onblur="drawPicture();"&gt;square&lt;/a&gt;
-   and a purple &lt;a href="http://en.wikipedia.org/wiki/Triangle" onfocus="drawTriangle();" onblur="drawPicture();"&gt;triangle&lt;/a&gt;,
-   both of which are semi-opaque, so the full circle can be seen underneath.&lt;/p&gt;
-&lt;/canvas&gt; </pre>
-
-<p>See the <a href="https://www.youtube.com/watch?v=ABeIFlqYiMQ">video how NVDA reads this example by Steve Faulkner</a>.</p>
-
-<h2 id="ARIA_rules">ARIA rules</h2>
-
-<p>Accessible Rich Internet Applications <strong>(<a href="/en-US/docs/Web/Accessibility/ARIA">ARIA</a>)</strong> defines ways to make Web content and Web applications more accessible to people with disabilities. You can use ARIA attributes to describe the behavior and purpose of the canvas element. See <a href="/en-US/docs/Web/Accessibility/ARIA">ARIA</a> and <a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques">ARIA techniques</a> for more information.</p>
-
-<pre class="brush: html">&lt;canvas id="button" tabindex="0" role="button" aria-pressed="false" aria-label="Start game"&gt;&lt;/canvas&gt;
-</pre>
-
-<h2 id="Hit_regions">Hit regions</h2>
-
-<p>Whether the mouse coordinates are within a particular area on the canvas, is a common problem to solve. The hit region API allows you to define an area of your canvas and provides another possibility to expose interactive content on a canvas to accessibility tools. It allows you to make hit detection easier and lets you route events to DOM elements. The API has the following three methods (which are still experimental in current web browsers; check the browser compatibility tables).</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.addHitRegion()")}} {{experimental_inline}}</dt>
- <dd>Adds a hit region to the canvas.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.removeHitRegion()")}} {{experimental_inline}}</dt>
- <dd>Removes the hit region with the specified <code>id</code> from the canvas.</dd>
- <dt>{{domxref("CanvasRenderingContext2D.clearHitRegions()")}} {{experimental_inline}}</dt>
- <dd>Removes all hit regions from the canvas.</dd>
-</dl>
-
-<p>You can add a hit region to your path and check for the {{domxref("MouseEvent.region")}} property to test if your mouse is hitting your region, for example.</p>
-
-<pre class="brush: html">&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
-&lt;script&gt;
-var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-
-ctx.beginPath();
-ctx.arc(70, 80, 10, 0, 2 * Math.PI, false);
-ctx.fill();
-ctx.addHitRegion({id: 'circle'});
-
-canvas.addEventListener('mousemove', function(event) {
-  if (event.region) {
-    alert('hit region: ' + event.region);
-  }
-});
-&lt;/script&gt;</pre>
-
-<p>The <code>addHitRegion()</code> method also takes a <code>control</code> option to route events to an element (that is a descendant of the canvas):</p>
-
-<pre class="brush: js">ctx.addHitRegion({control: element});</pre>
-
-<p>This can be useful for routing to {{HTMLElement("input")}} elements, for example. See also this <a href="https://codepen.io/peterj35/pen/PEdLKx">codepen demo</a>.</p>
-
-<h2 id="Focus_rings">Focus rings</h2>
-
-<p>When working with the keyboard, focus rings are a handy indicator to help navigating on a page. To draw focus rings on a canvas drawing, the <code>drawFocusIfNeeded</code> property can be used.</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.drawFocusIfNeeded()")}} {{experimental_inline}}</dt>
- <dd>If a given element is focused, this method draws a focus ring around the current path.</dd>
-</dl>
-
-<p>Additionally, the <code>scrollPathIntoView()</code> method can be used to make an element visible on the screen if focused, for example.</p>
-
-<dl>
- <dt>{{domxref("CanvasRenderingContext2D.scrollPathIntoView()")}} {{experimental_inline}}</dt>
- <dd>Scrolls the current path or a given path into the view.</dd>
-</dl>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="https://www.w3.org/WAI/PF/HTML/wiki/Canvas_Accessibility_Use_Cases">Canvas accessibility use cases</a></li>
- <li><a href="https://www.w3.org/html/wg/wiki/AddedElementCanvas">Canvas element accessibility issues</a></li>
- <li><a href="http://www.paciellogroup.com/blog/2012/06/html5-canvas-accessibility-in-firefox-13/">HTML5 Canvas Accessibility in Firefox 13 – by Steve Faulkner</a></li>
- <li><a href="https://html.spec.whatwg.org/multipage/scripting.html#best-practices">Best practices for interactive canvas elements</a></li>
-</ul>
-
-<div>{{ PreviousNext("Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas", "Web/API/Canvas_API/Tutorial/Optimizing_canvas") }}</div>
diff --git a/files/es/web/guide/html/canvas_tutorial/index.html b/files/es/web/guide/html/canvas_tutorial/index.html
deleted file mode 100644
index da5b0b3cc9..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/index.html
+++ /dev/null
@@ -1,61 +0,0 @@
----
-title: Tutorial Canvas
-slug: Web/Guide/HTML/Canvas_tutorial
-tags:
-  - Canvas
-  - HTML5
-  - graficos
-translation_of: Web/API/Canvas_API/Tutorial
----
-<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><img alt="" src="https://mdn.mozillademos.org/files/257/Canvas_tut_examples.jpg" style="float: right; height: 450px; width: 200px;"></a></p>
-
-<p><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas"><strong><code>&lt;canvas&gt;</code></strong></a> es un elemento <a href="/en-US/docs/HTML" title="HTML">HTML</a> el cual puede ser usado para dibujar gráficos usando scripts (normalmente <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>). Este puede, por ejemplo, ser usado para dibujar gráficos, realizar composición de fotos o simples (y <a href="/en-US/docs/HTML/Canvas/A_Basic_RayCaster" title="A_Basic_RayCaster">no tan simples</a>) animaciones. Las imágenes a la derecha muestran algunos ejemplos de implementaciones <code>&lt;canvas&gt;</code>  las cuales se verán en un futuro en este tutorial.</p>
-
-<p><code>&lt;canvas&gt;</code>  fue introducido primero por Apple para el Mac OS X Dashboard y después implementado en Safari y Google Chrome. Navegadores basados en <a href="/en-US/docs/Gecko" title="Gecko">Gecko</a> 1.8, tal como Firefox 1.5, que también soportan este elemento. El <code>&lt;canvas&gt;</code> es un elemento parte de las especificaciones de la <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">WhatWG Web applications 1.0</a> mejor conocida como HTML5.</p>
-
-<p><span class="seoSummary">En este tutorial se describe cómo usar el elemento <code>&lt;canvas&gt;</code> para dibujar gráficos en 2D, empezando con lo básico. Los ejemplos le proveerán mayor claridad a las ideas que pueda tener referentes al canvas, así como los códigos que necesita para crear su propio contenido.</span></p>
-
-<h2 id="Before_you_start" name="Before_you_start">Antes de Empezar</h2>
-
-<p>Usar el elemento <code>&lt;canvas&gt;</code> no es algo muy díficil pero necesita saber y entender los aspectos básicos del <a href="/en-US/docs/HTML" title="HTML">HTML</a> y <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>. El elemento <code>&lt;canvas&gt;</code> no está soportado en navegadores viejos, pero están soportado en la mayoría de las versiones más recientes de los navegadores. El tamaño por defecto del canvas es 300px * 150px [ancho (width) * alto (height)]. Pero se puede personalizar el tamaño usando las propiedades height y width de CSS.<span id="result_box" lang="es"><span class="hps"> Con el fin de</span> <span class="hps">dibujar gráficos</span> <span class="hps">en el lienzo</span> <span class="hps">&lt;canvas&gt; se utiliza un</span> <span class="hps">objeto de contexto de</span> <span class="hps">JavaScript</span> <span class="hps">que crea</span> <span class="hps">gráficos</span> <span class="hps">sobre la marcha.</span></span></p>
-
-<h2 id="In_this_tutorial" name="In_this_tutorial">En este Tutorial</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_usage" title="Canvas_tutorial/Basic_usage">Usos Básicos</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Drawing_shapes" title="Canvas_tutorial/Drawing_shapes">Dibujando Formas</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Using_images" title="Canvas_tutorial/Using_images">Usando Imágenes</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Applying_styles_and_colors" title="Canvas_tutorial/Applying_styles_and_colors">Aplicando estilos y colores</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Transformations" title="Canvas_tutorial/Transformations">Transformaciones</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Compositing" title="Canvas_tutorial/Compositing">Composiciones</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Basic_animations" title="Canvas_tutorial/Basic_animations">Animaciones Básicas</a></li>
- <li><a href="/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas" title="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas">Optimización de Canvas</a></li>
-</ul>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas">Canvas topic page</a></li>
- <li><a href="/en-US/docs/HTML/Canvas/Drawing_Graphics_with_Canvas" title="Drawing_Graphics_with_Canvas">Drawing Graphics with Canvas</a></li>
- <li><a href="/en-US/docs/tag/Canvas_examples" title="tag/Canvas_examples">Canvas examples</a></li>
- <li><a href="http://www.html5andcss3.org">HTML5 Tutorial</a></li>
- <li><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas">Drawing Text Using a Canvas</a></li>
- <li><a class="external" href="http://developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/HTML-canvas-guide/AddingText/AddingText.html#//apple_ref/doc/uid/TP40010542-CH6-SW4" title="Adding Text to Canvas">Adding Text to Canvas</a></li>
- <li><a class="external" href="http://www.canvasdemos.com/" title="Canvas Demos">Canvas Demos - Games, applications, tools and tutorials</a></li>
- <li><a class="external" href="http://canvimation.github.com/" title="http://canvimation.github.com/">Canvas Drawing and Animation Application</a></li>
- <li><a class="external" href="http://billmill.org/static/canvastutorial/" title="http://billmill.org/static/canvastutorial/">Interactive canvas tutorial</a></li>
- <li><a class="external" href="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html" title="http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html">Canvas Cheat Sheet with all attributes and methods</a></li>
- <li><a class="external" href="http://visitmix.com/labs/ai2canvas/" title="http://visitmix.com/labs/ai2canvas/">Adobe Illustrator to Canvas plug-in</a></li>
- <li><a class="external" href="http://www.html5canvastutorials.com/" title="http://www.html5canvastutorials.com/">HTML5CanvasTutorials</a></li>
- <li><a class="external" href="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api" title="http://html5tutorial.com/how-to-draw-n-grade-bezier-curve-with-canvas-api">How to draw N grade Bézier curves with the Canvas API</a></li>
- <li><a class="external" href="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/" title="http://creativejs.com/2011/08/31-days-of-canvas-tutorials/">31 days of canvas tutorials</a></li>
- <li><a href="http://www.w3.org/TR/2dcontext/" title="http://www.w3.org/TR/2dcontext/">W3C Standard</a></li>
- <li><a href="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php" title="http://www.tutorialspark.com/html5/HTML5_canvas_Intro.php">HTML5 Canvas tutorials and reference</a></li>
- <li><a href="http://davidwalsh.name/convert-canvas-image">JavaScript Canvas Image Conversion</a></li>
-</ul>
-
-<h2 id="Nota_a_los_contribuyentes">Nota a los contribuyentes</h2>
-
-<p>Debido a un desafortunado error técnico que ocurrió el 17 de junio del 2013, perdimos la historia de este tutorial, incluyendo atribuciones a todos los contribuyentes del pasado a su contenido. Pedimos disculpas por esto, y esperamos que perdone este desafortunado percance.</p>
-
-<div>{{ Next("Web/Guide/HTML/Canvas_tutorial/Basic_usage") }}</div>
diff --git a/files/es/web/guide/html/canvas_tutorial/optimizing_canvas/index.html b/files/es/web/guide/html/canvas_tutorial/optimizing_canvas/index.html
deleted file mode 100644
index 145e2734f0..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/optimizing_canvas/index.html
+++ /dev/null
@@ -1,19 +0,0 @@
----
-title: Optimizing canvas
-slug: Web/Guide/HTML/Canvas_tutorial/Optimizing_canvas
-translation_of: Web/API/Canvas_API/Tutorial/Optimizing_canvas
----
-<p>{{HTMLElement("canvas")}} es uno de los estándares más utilizados para la representación de gráficos 2D en la Web. Se utiliza ampliamente en los juegos y visualizaciones complejas. Sin embargo, as Web sites and apps push canvas to the limits, el rendimiento comienza a sufrir. <span class="seoSummary">This article aims to provide suggestions for optimizing your use of the canvas element, to ensure that your Web site or app performs well.</span></p>
-<p>A continuación una lista de tips par mejorar el rendimiento:</p>
-<ul>
- <li>Repintar primitives similares o objetos repetidos dentro y fuera de la pantalla canvas.</li>
- <li>Batch canvas calls together (for example, draw a poly-line instead of multiple separate lines).</li>
- <li>Avoid floating-point coordinates and use integers instead.</li>
- <li>Avoid unnecessary canvas state changes.</li>
- <li>Render screen differences only, not the whole new state.</li>
- <li>Utilice varios lienzos en capas para escenas complejas.</li>
- <li>Evite la propiedad <code>shadowBlur</code> siempre que sea posible.</li>
- <li>Con las animaciones, use {{domxref("window.requestAnimationFrame()")}}.</li>
- <li>Probar el rendimiento con <a href="http://jsperf.com" title="http://jsperf.com">JSPerf</a>.</li>
-</ul>
-<p>{{PreviousNext("Web/Guide/HTML/Canvas_tutorial/Basic_animations")}}</p>
diff --git a/files/es/web/guide/html/canvas_tutorial/pixel_manipulation_with_canvas/index.html b/files/es/web/guide/html/canvas_tutorial/pixel_manipulation_with_canvas/index.html
deleted file mode 100644
index 14ccc9c4a5..0000000000
--- a/files/es/web/guide/html/canvas_tutorial/pixel_manipulation_with_canvas/index.html
+++ /dev/null
@@ -1,301 +0,0 @@
----
-title: Pixel manipulation with canvas
-slug: Web/Guide/HTML/Canvas_tutorial/Pixel_manipulation_with_canvas
-translation_of: Web/API/Canvas_API/Tutorial/Pixel_manipulation_with_canvas
----
-<div>{{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Advanced_animations", "Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility")}}</div>
-
-<div class="summary">
-<p>Hasta ahora, no habíamos mirado los píxeles reales de nuestro <em>canvas</em>. Con el objeto <code>ImageData</code>, puedes leer y escribir directamente un <em>array</em> de datos para manipular píxeles.</p>
-
-<p>También veremos cómo se puede controlar el suavizado de la imagen (antialiasing) y cómo guardar imágenes de tu <em>canvas</em>.</p>
-</div>
-
-<h2 id="El_objeto_ImageData">El objeto <code>ImageData</code></h2>
-
-<p>El objeto {{domxref("ImageData")}} representa los datos pixelados subyacentes de un área de un objeto lienzo. Contiene los siguientes atributos de sólo lectura:</p>
-
-<dl>
- <dt><code>width</code></dt>
- <dd>El ancho de la imagen en píxeles.</dd>
- <dt><code>height</code></dt>
- <dd>La altura de la imagen en píxeles.</dd>
- <dt><code>data</code></dt>
- <dd>Un objeto {{jsxref("Uint8ClampedArray")}} que representa un array unidimensional, contiene información en formato RGBA, con valores desde <code>0</code> hasta <code>255</code> (incluído).</dd>
-</dl>
-
-<p>La propiedad <code>data</code> devuelve un  {{jsxref("Uint8ClampedArray")}}, al que se puede acceder para ver los datos originales del pixel; cada pixel está representado por cuatro valores (rojo, verde, azul, y alfa, en ese orden; esto es, formato "RGBA"). Cada componente de color se representa con un valor entero entre 0 y 255. Dentro del array, cada componente ocupa un índice consecutivo, comenzando con 0 desde el punto superior izquierdo, continuando de izquierda a derecha y de arriba hacia abajo, a través del array.</p>
-
-<p>El {{jsxref("Uint8ClampedArray")}} contiene <code>alto</code> × <code>ancho</code> × 4 bytes de datos, con valores de índice en el rango entre 0 y (<code>alto</code>×<code>ancho</code>×4)-1.</p>
-
-<p>Por ejemplo, para leer el valor del componente azul del pixel en la columna 200, fila 50 de una imagen, deberías hacer lo siguiente:</p>
-
-<p>blueComponent = imageData.data[((50 * (imageData.width * 4)) + (200 * 4)) + 2];</p>
-
-<p>Si se le da un conjunto de coordenadas (X e Y), puede que termine haciendo algo así:</p>
-
-<pre class="brush: js">var xCoord = 50;
-var yCoord = 100;
-var canvasWidth = 1024;
-
-function getColorIndicesForCoord(x, y, width) {
-  var red = y * (width * 4) + x * 4;
-  return [red, red + 1, red + 2, red + 3];
-}
-
-var colorIndices = getColorIndicesForCoord(xCoord, yCoord, canvasWidth);
-
-var redIndex = colorIndices[0];
-var greenIndex = colorIndices[1];
-var blueIndex = colorIndices[2];
-var alphaIndex = colorIndices[3];
-
-var redForCoord = imageData.data[redIndex];
-var greenForCoord = imageData.data[greenIndex];
-var blueForCoord = imageData.data[blueIndex];
-var alphaForCoord = imageData.data[alphaIndex];
-</pre>
-
-<p>O, en ES6 sería algo así:</p>
-
-<pre class="brush: js">const xCoord = 50;
-const yCoord = 100;
-const canvasWidth = 1024;
-
-const getColorIndicesForCoord = (x, y, width) =&gt; {
-  const red = y * (width * 4) + x * 4;
-  return [red, red + 1, red + 2, red + 3];
-};
-
-const colorIndices = getColorIndicesForCoord(xCoord, yCoord, canvasWidth);
-
-const [redIndex, greenIndex, blueIndex, alphaIndex] = colorIndices;
-</pre>
-
-<p>You may also access the size of the pixel array in bytes by reading the <code>Uint8ClampedArray.length</code> attribute:</p>
-
-<pre class="brush: js">var numBytes = imageData.data.length;
-</pre>
-
-<h2 id="Creando_un_objeto_ImageData">Creando un objeto <code>ImageData</code></h2>
-
-<p>Para crear un objeto nuevo y vacío tipo <code>ImageData</code>, debes usar el método  {{domxref("CanvasRenderingContext2D.createImageData", "createImageData()")}}. Hay dos versiones del método <code>createImageData()</code>:</p>
-
-<pre class="brush: js">var myImageData = ctx.createImageData(width, height);</pre>
-
-<p>Esto crea un nuevo objeto <code>ImageData</code> con las dimensiones especificadas. Todos los pixels tienen valor correspondiente a negro - transparente (0,0,0,0).</p>
-
-<p>También puedes crear un nuevo objeto <code>ImageData</code> con las mismas dimensiones que otro objeto, especificado por <code>anotherImageData</code>. Los píxels del nuevo objeto tienen valor negro - transparente. <strong>¡Esto no es una copia de los datos de la imagen!</strong></p>
-
-<pre class="brush: js">var myImageData = ctx.createImageData(anotherImageData);</pre>
-
-<h2 id="Getting_the_pixel_data_for_a_context">Getting the pixel data for a context</h2>
-
-<p>To obtain an <code>ImageData</code> object containing a copy of the pixel data for a canvas context, you can use the <code>getImageData()</code> method:</p>
-
-<pre class="brush: js">var myImageData = ctx.getImageData(left, top, width, height);</pre>
-
-<p>This method returns an <code>ImageData</code> object representing the pixel data for the area of the canvas whose corners are represented by the points (<code>left</code>,<code>top</code>), (<code>left+width</code>, <code>top</code>), (<code>left</code>, <code>top+height</code>), and (<code>left+width</code>, <code>top+height</code>). The coordinates are specified in canvas coordinate space units.</p>
-
-<div class="note">
-<p><strong>Note</strong>: Any pixels outside the canvas are returned as transparent black in the resulting <code>ImageData</code> object.</p>
-</div>
-
-<p>This method is also demonstrated in the article <a href="/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas">Manipulating video using canvas</a>.</p>
-
-<h3 id="A_color_picker">A color picker</h3>
-
-<p>In this example we are using the <a href="/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData">getImageData() </a>method to display the color under the mouse cursor. For this, we need the current position of the mouse with <code>layerX</code> and <code>layerY</code>, then we look up the pixel data on that position in the pixel array that <a href="/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData">getImageData()</a> provides us. Finally, we use the array data to set a background color and a text in the <code>&lt;div&gt;</code> to display the color.</p>
-
-<div class="hidden">
-<pre class="brush: html;">&lt;canvas id="canvas" width="300" height="227" style="float:left"&gt;&lt;/canvas&gt;
-&lt;div id="color" style="width:200px;height:50px;float:left"&gt;&lt;/div&gt;
-</pre>
-</div>
-
-<pre class="brush: js;">var img = new Image();
-img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg';
-var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-img.onload = function() {
-  ctx.drawImage(img, 0, 0);
-  img.style.display = 'none';
-};
-var color = document.getElementById('color');
-function pick(event) {
-  var x = event.layerX;
-  var y = event.layerY;
-  var pixel = ctx.getImageData(x, y, 1, 1);
-  var data = pixel.data;
-  var rgba = 'rgba(' + data[0] + ', ' + data[1] +
-             ', ' + data[2] + ', ' + (data[3] / 255) + ')';
-  color.style.background =  rgba;
-  color.textContent = rgba;
-}
-canvas.addEventListener('mousemove', pick);
-</pre>
-
-<p>{{ EmbedLiveSample('A_color_picker', 610, 240) }}</p>
-
-<h2 id="Painting_pixel_data_into_a_context">Painting pixel data into a context</h2>
-
-<p>You can use the<a href="/en-US/docs/Web/API/CanvasRenderingContext2D/putImageData"> putImageData() </a>method to paint pixel data into a context:</p>
-
-<pre class="brush: js">ctx.putImageData(myImageData, dx, dy);
-</pre>
-
-<p>The <code>dx</code> and <code>dy</code> parameters indicate the device coordinates within the context at which to paint the top left corner of the pixel data you wish to draw.</p>
-
-<p>For example, to paint the entire image represented by <code>myImageData</code> to the top left corner of the context, you can simply do the following:</p>
-
-<pre class="brush: js">ctx.putImageData(myImageData, 0, 0);
-</pre>
-
-<h3 id="Grayscaling_and_inverting_colors">Grayscaling and inverting colors</h3>
-
-<p>In this example we iterate over all pixels to change their values, then we put the modified pixel array back to the canvas using <a href="/en-US/docs/Web/API/CanvasRenderingContext2D/putImageData">putImageData()</a>. The invert function simply subtracts each color from the max value 255. The grayscale function simply uses the average of red, green and blue. You can also use a weighted average, given by the formula <code>x = 0.299r + 0.587g + 0.114b</code>, for example. See <a href="http://en.wikipedia.org/wiki/Grayscale">Grayscale</a> on Wikipedia for more information.</p>
-
-<div class="hidden">
-<pre class="brush: html;">&lt;canvas id="canvas" width="300" height="227"&gt;&lt;/canvas&gt;
-&lt;div&gt;
-  &lt;input id="grayscalebtn" value="Grayscale" type="button"&gt;
-  &lt;input id="invertbtn" value="Invert" type="button"&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<pre class="brush: js">var img = new Image();
-img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg';
-img.onload = function() {
-  draw(this);
-};
-
-function draw(img) {
-  var canvas = document.getElementById('canvas');
-  var ctx = canvas.getContext('2d');
-  ctx.drawImage(img, 0, 0);
-  img.style.display = 'none';
-  var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
-  var data = imageData.data;
-
-  var invert = function() {
-    for (var i = 0; i &lt; data.length; i += 4) {
-      data[i]     = 255 - data[i];     // red
-      data[i + 1] = 255 - data[i + 1]; // green
-      data[i + 2] = 255 - data[i + 2]; // blue
-    }
-    ctx.putImageData(imageData, 0, 0);
-  };
-
-  var grayscale = function() {
-    for (var i = 0; i &lt; data.length; i += 4) {
-      var avg = (data[i] + data[i + 1] + data[i + 2]) / 3;
-      data[i]     = avg; // red
-      data[i + 1] = avg; // green
-      data[i + 2] = avg; // blue
-    }
-    ctx.putImageData(imageData, 0, 0);
-  };
-
-  var invertbtn = document.getElementById('invertbtn');
-  invertbtn.addEventListener('click', invert);
-  var grayscalebtn = document.getElementById('grayscalebtn');
-  grayscalebtn.addEventListener('click', grayscale);
-}
-</pre>
-
-<p>{{ EmbedLiveSample('Grayscaling_and_inverting_colors', 330, 270) }}</p>
-
-<h2 id="Zooming_and_anti-aliasing">Zooming and anti-aliasing</h2>
-
-<p>With the help of the {{domxref("CanvasRenderingContext2D.drawImage", "drawImage()")}} method, a second canvas and the {{domxref("CanvasRenderingContext2D.imageSmoothingEnabled", "imageSmoothingEnabled")}} property, we are able to zoom into our picture and see the details.</p>
-
-<p>We get the position of the mouse and crop an image of 5 pixels left and above to 5 pixels right and below. Then we copy that one over to another canvas and resize the image to the size we want it to. In the zoom canvas we resize a 10×10 pixel crop of the original canvas to 200×200.</p>
-
-<pre class="brush: js">zoomctx.drawImage(canvas,
-                  Math.abs(x - 5), Math.abs(y - 5),
-                  10, 10, 0, 0, 200, 200);</pre>
-
-<p>Because anti-aliasing is enabled by default, we might want to disable the smoothing to see clear pixels. You can toggle the checkbox to see the effect of the <code>imageSmoothingEnabled</code> property (which needs prefixes for different browsers).</p>
-
-<h6 class="hidden" id="Zoom_example">Zoom example</h6>
-
-<div class="hidden">
-<pre class="brush: html;">&lt;canvas id="canvas" width="300" height="227"&gt;&lt;/canvas&gt;
-&lt;canvas id="zoom" width="300" height="227"&gt;&lt;/canvas&gt;
-&lt;div&gt;
-&lt;label for="smoothbtn"&gt;
-  &lt;input type="checkbox" name="smoothbtn" checked="checked" id="smoothbtn"&gt;
-  Enable image smoothing
-&lt;/label&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<pre class="brush: js">var img = new Image();
-img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg';
-img.onload = function() {
-  draw(this);
-};
-
-function draw(img) {
-  var canvas = document.getElementById('canvas');
-  var ctx = canvas.getContext('2d');
-  ctx.drawImage(img, 0, 0);
-  img.style.display = 'none';
-  var zoomctx = document.getElementById('zoom').getContext('2d');
-
-  var smoothbtn = document.getElementById('smoothbtn');
-  var toggleSmoothing = function(event) {
-    zoomctx.imageSmoothingEnabled = this.checked;
-    zoomctx.mozImageSmoothingEnabled = this.checked;
-    zoomctx.webkitImageSmoothingEnabled = this.checked;
-    zoomctx.msImageSmoothingEnabled = this.checked;
-  };
-  smoothbtn.addEventListener('change', toggleSmoothing);
-
-  var zoom = function(event) {
-    var x = event.layerX;
-    var y = event.layerY;
-    zoomctx.drawImage(canvas,
-                      Math.abs(x - 5),
-                      Math.abs(y - 5),
-                      10, 10,
-                      0, 0,
-                      200, 200);
-  };
-
-  canvas.addEventListener('mousemove', zoom);
-}</pre>
-
-<p>{{ EmbedLiveSample('Zoom_example', 620, 490) }}</p>
-
-<h2 id="Guardando_las_imágenes">Guardando las imágenes</h2>
-
-<p>The {{domxref("HTMLCanvasElement")}} provides a <code>toDataURL()</code> method, which is useful when saving images. It returns a <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs">data URI</a> containing a representation of the image in the format specified by the <code>type</code> parameter (defaults to <a class="external external-icon" href="https://en.wikipedia.org/wiki/Portable_Network_Graphics">PNG</a>). The returned image is in a resolution of 96 dpi.</p>
-
-<dl>
- <dt>{{domxref("HTMLCanvasElement.toDataURL", "canvas.toDataURL('image/png')")}}</dt>
- <dd>Default setting. Creates a PNG image.</dd>
- <dt>{{domxref("HTMLCanvasElement.toDataURL", "canvas.toDataURL('image/jpeg', quality)")}}</dt>
- <dd>Creates a JPG image. Optionally, you can provide a quality in the range from 0 to 1, with one being the best quality and with 0 almost not recognizable but small in file size.</dd>
-</dl>
-
-<p>Once you have generated a data URI from you canvas, you are able to use it as the source of any {{HTMLElement("image")}} or put it into a hyper link with a <a href="/en-US/docs/Web/HTML/Element/a#attr-download">download attribute</a> to save it to disc, for example.</p>
-
-<p>You can also create a {{domxref("Blob")}} from the canvas.</p>
-
-<dl>
- <dt>{{domxref("HTMLCanvasElement.toBlob", "canvas.toBlob(callback, type, encoderOptions)")}}</dt>
- <dd>Creates a <code>Blob</code> object representing the image contained in the canvas.</dd>
-</dl>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{domxref("ImageData")}}</li>
- <li><a href="/en-US/docs/Web/API/Canvas_API/Manipulating_video_using_canvas">Manipulating video using canvas</a></li>
- <li><a href="https://codepo8.github.io/canvas-images-and-pixels/">Canvas, images and pixels – by Christian Heilmann</a></li>
-</ul>
-
-<p>{{PreviousNext("Web/API/Canvas_API/Tutorial/Advanced_animations", "Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility")}}</p>
diff --git a/files/es/web/guide/html/categorias_de_contenido/index.html b/files/es/web/guide/html/categorias_de_contenido/index.html
deleted file mode 100644
index b9c4fb6061..0000000000
--- a/files/es/web/guide/html/categorias_de_contenido/index.html
+++ /dev/null
@@ -1,175 +0,0 @@
----
-title: Categorías de contenido
-slug: Web/Guide/HTML/categorias_de_contenido
-tags:
-  - Avanzado
-  - Guía
-  - HTML
-  - HTML5
-  - Web
-translation_of: Web/Guide/HTML/Content_categories
----
-<p><span class="seoSummary">Cada elemento {{web.link("/es/docs/Web/HTML", "HTML")}} es miembro de una o más <strong>categorías de contenido</strong> — estas categorías agrupan elementos que comparten características comunes.</span> Esta es una agrupación flexible (en realidad no crea una relación entre los elementos de estas categorías), pero ayuda a definir y describir el comportamiento compartido de las categorías y sus reglas asociadas, especialmente cuando te encuentras con sus intrincados detalles. También es posible que los elementos no sean miembros de <em>ninguna</em> de estas categorías.</p>
-
-<p>Hay tres tipos de categorías de contenido:</p>
-
-<ul>
- <li>Categoría de contenido principal — que describe reglas comunes compartidas por muchos elementos.</li>
- <li>Categorías de contenido relacionado con formularios — que describe reglas comunes a los elementos relacionados con formularios.</li>
- <li>Categorías de contenido específico — que describe categorías raras compartidas solo por unos pocos elementos, a veces, solo en un contexto específico.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota</strong>: Una explicación comparativa más detallada de estas categorías de contenido y su funcionalidad está más allá del alcance de este artículo; para eso, posiblemente desees leer las <a href="https://html.spec.whatwg.org/multipage/dom.html#kinds-of-content">partes relevantes de la especificación HTML</a>.</p>
-</div>
-
-<p><a href="/@api/deki/files/6244/=Content_categories_venn.png"><img alt="Un diagrama de Venn que muestra cómo se interrelacionan las distintas categorías de contenido. Las siguientes secciones explican estas relaciones en texto." class="default internal" src="/@api/deki/files/6244/=Content_categories_venn.png?size=webview" style="height: 200px; width: 350px;"></a></p>
-
-<h2 id="Categorías_de_contenido_principal">Categorías de contenido principal</h2>
-
-<h3 id="Contenido_de_metadatos">Contenido de metadatos</h3>
-
-<p>Los elementos pertenecientes a la categoría <em>contenido de metadatos</em> modifican la presentación o el comportamiento del resto del documento, establecen enlaces a otros documentos o transmiten otra información <em>fuera de banda</em>.</p>
-
-<p>Los elementos que pertenecen a esta categoría son {{HTMLElement("base")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("link")}}, {{HTMLElement("meta")}}, {{HTMLElement("noscript")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.</p>
-
-<h3 id="Flujo_de_contenido">Flujo de contenido</h3>
-
-<p>Los elementos que pertenecen a la categoría de flujo de contenido suelen contener texto o contenido incrustado. Son: {{HTMLElement("a")}}, {{HTMLElement("abbr")}}, {{HTMLElement("address")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("audio")}}, {{HTMLElement("b")}},{{HTMLElement("bdo")}}, {{HTMLElement("bdi")}}, {{HTMLElement("blockquote")}}, {{HTMLElement("br")}}, {{HTMLElement("button")}}, {{HTMLElement("canvas")}}, {{HTMLElement("cite")}}, {{HTMLElement("code")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("data")}}, {{HTMLElement("datalist")}}, {{HTMLElement("del")}}, {{HTMLElement("details")}}, {{HTMLElement("dfn")}}, {{HTMLElement("div")}}, {{HTMLElement("dl")}}, {{HTMLElement("em")}}, {{HTMLElement("embed")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}}, {{HTMLElement("footer")}}, {{HTMLElement("form")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("header")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("hr")}}, {{HTMLElement("i")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("input")}}, {{HTMLElement("ins")}}, {{HTMLElement("kbd")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("main")}}, {{HTMLElement("map")}}, {{HTMLElement("mark")}}, {{MathMLElement("math")}}, {{HTMLElement("menu")}}, {{HTMLElement("meter")}}, {{HTMLElement("nav")}}, {{HTMLElement("noscript")}}, {{HTMLElement("object")}}, {{HTMLElement("ol")}}, {{HTMLElement("output")}}, {{HTMLElement("p")}}, {{HTMLElement("picture")}}, {{HTMLElement("pre")}}, {{HTMLElement("progress")}}, {{HTMLElement("q")}}, {{HTMLElement("ruby")}}, {{HTMLElement("s")}}, {{HTMLElement("samp")}}, {{HTMLElement("script")}}, {{HTMLElement("section")}}, {{HTMLElement("select")}}, {{HTMLElement("small")}}, {{HTMLElement("span")}}, {{HTMLElement("strong")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{SVGElement("svg")}}, {{HTMLElement("table")}}, {{HTMLElement("template")}}, {{HTMLElement("textarea")}}, {{HTMLElement("time")}}, {{HTMLElement("ul")}}, {{HTMLElement("var")}}, {{HTMLElement("video")}}, {{HTMLElement("wbr")}} and Text.</p>
-
-<p>Algunos otros elementos pertenecen a esta categoría, pero solo si se cumple una condición específica:</p>
-
-<ul>
- <li>{{HTMLElement("area")}}, si es descendiente de un elemento {{HTMLElement("map")}}</li>
- <li>{{HTMLElement("link")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#attr-itemprop", "itemprop")}}</li>
- <li>{{HTMLElement("meta")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#attr-itemprop", "itemprop")}}</li>
- <li>{{HTMLElement("style")}}, si está presente el atributo {{deprecated_inline()}} {{HTMLAttrxRef("scoped", "style")}}</li>
-</ul>
-
-<h3 id="Contenido_de_sección">Contenido de sección</h3>
-
-<p>Los elementos que pertenecen al modelo de contenido de secciones crean una {{web.link("/es/docs/Sections_and_Outlines_of_an_HTML5_document", "sección en el esquema actual")}} que define el alcance de los elementos {{HTMLElement("header")}}, {{HTMLElement("footer")}} y {{anch("Contenido del encabezado")}}.</p>
-
-<p>Los elementos que pertenecen a esta categoría son {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("nav")}} y {{HTMLElement("section")}}.</p>
-
-<div class="note">
-<p>No confundas este modelo de contenido con la categoría de {{web.link("/es/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines#Sectioning_roots", "seccionado raíz")}}, que aísla su contenido del esquema regular.</p>
-</div>
-
-<h3 id="Contenido_del_encabezado">Contenido del encabezado</h3>
-
-<p>El contenido del encabezado define el título de una sección, ya sea que esté marcado por un elemento {{anch("Contenido de sección")}} explícito o definido implícitamente por el contenido del encabezado en sí mismo.</p>
-
-<p>Los elementos que pertenecen a esta categoría son {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}} y {{HTMLElement("hgroup")}}.</p>
-
-<div class="note">
-<p>Aunque es probable que tenga contenido de encabezado, {{HTMLElement("header")}} no es contenido de encabezado en sí mismo.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: El elemento {{HTMLElement("hgroup")}} se eliminó de la especificación HTML del W3C antes de que se finalizara HTML 5, pero sigue siendo parte de la especificación WHATWG y la mayoría de los navegadores lo admiten por lo menos parcialmente.</p>
-</div>
-
-<h3 id="Contenido_de_redacción">Contenido de redacción</h3>
-
-<p>El contenido de redacción define el texto y el marcado que contiene. Las series de contenido de redacción forman párrafos.</p>
-
-<p>Los elementos que pertenecen a esta categoría son: {{HTMLElement("abbr")}}, {{HTMLElement("audio")}}, {{HTMLElement("b")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("button")}}, {{HTMLElement("canvas")}}, {{HTMLElement("cite")}}, {{HTMLElement("code")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("data")}}, {{HTMLElement("datalist")}}, {{HTMLElement("dfn")}}, {{HTMLElement("em")}}, {{HTMLElement("embed")}}, {{HTMLElement("i")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("input")}}, {{HTMLElement("kbd")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("mark")}}, {{MathMLElement("math")}}, {{HTMLElement("meter")}}, {{HTMLElement("noscript")}}, {{HTMLElement("object")}}, {{HTMLElement("output")}}, {{HTMLElement("picture")}}, {{HTMLElement("progress")}}, {{HTMLElement("q")}}, {{HTMLElement("ruby")}}, {{HTMLElement("samp")}}, {{HTMLElement("script")}}, {{HTMLElement("select")}}, {{HTMLElement("small")}}, {{HTMLElement("span")}}, {{HTMLElement("strong")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{SVGElement("svg")}}, {{HTMLElement("textarea")}}, {{HTMLElement("time")}}, {{HTMLElement("var")}}, {{HTMLElement("video")}}, {{HTMLElement("wbr")}} y texto sin formato (no solo consiste de espacios en blanco).</p>
-
-<p>Algunos otros elementos pertenecen a esta categoría, pero solo si se cumple una condición específica:</p>
-
-<ul>
- <li>{{HTMLElement("a")}}, si solo incluye contenido de redacción</li>
- <li>{{HTMLElement("area")}}, si es descendiente de un elemento {{HTMLElement("map")}}</li>
- <li>{{HTMLElement("del")}}, si solo incluye contenido de redacción</li>
- <li>{{HTMLElement("ins")}}, si solo incluye contenido de redacción</li>
- <li>{{HTMLElement("link")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#itemprop", "itemprop")}}</li>
- <li>{{HTMLElement("map")}}, si solo incluye contenido de redacción</li>
- <li>{{HTMLElement("meta")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#itemprop", "itemprop")}}</li>
-</ul>
-
-<h3 id="Contenido_incrustado">Contenido incrustado</h3>
-
-<p>El contenido incrustado importa otro recurso o inserta contenido de otro lenguaje de marcado o espacio de nombres en el documento. Los elementos que pertenecen a esta categoría incluyen: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{HTMLElement("picture")}}, {{SVGElement("svg")}} y {{HTMLElement("video")}}.</p>
-
-<h3 id="Contenido_interactivo">Contenido interactivo</h3>
-
-<p>El contenido interactivo incluye elementos diseñados específicamente para la interacción del usuario. Los elementos que pertenecen a esta categoría incluyen: {{HTMLElement("a")}}, {{HTMLElement("button")}}, {{HTMLElement("details")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.<br>
- Algunos elementos pertenecen a esta categoría solo bajo condiciones específicas:</p>
-
-<ul>
- <li>{{HTMLElement("audio")}}, si está presente el atributo {{HTMLAttrxRef("controls", "audio")}}</li>
- <li>{{HTMLElement("img")}}, si está presente el atributo {{HTMLAttrxRef("usemap", "img")}}</li>
- <li>{{HTMLElement("input")}}, si el atributo {{HTMLAttrxRef("type", "input")}} no está en estado oculto</li>
- <li>{{HTMLElement("menu")}}, si el atributo {{HTMLAttrxRef("type", "menu")}} está en la barra de estado de herramientas</li>
- <li>{{HTMLElement("object")}}, si está presente el atributo {{HTMLAttrxRef("usemap", "object")}}</li>
- <li>{{HTMLElement("video")}}, si está presente el atributo {{HTMLAttrxRef("controls", "video")}}</li>
-</ul>
-
-<h3 id="Contenido_palpable">Contenido palpable</h3>
-
-<p>El contenido es palpable cuando no está vacío ni oculto; es contenido que se presenta y es sustantivo. Los elementos cuyo modelo es flujo de contenido o contenido de redacción deben tener, por lo menos, un nodo que sea palpable.</p>
-
-<h3 id="Contenido_asociado_a_formulario">Contenido asociado a formulario</h3>
-
-<p>El contenido asociado a un formulario comprende elementos que tienen un formulario de propietario, expuesto mediante un atributo <strong>form</strong>. El propietario de un formulario es el elemento {{HTMLElement("form")}} que lo contiene o el elemento cuya identificación se especifica en el atributo <strong>form</strong>.</p>
-
-<ul>
- <li>{{HTMLElement("button")}}</li>
- <li>{{HTMLElement("fieldset")}}</li>
- <li>{{HTMLElement("input")}}</li>
- <li>{{deprecated_inline()}} {{HTMLElement("keygen")}}</li>
- <li>{{HTMLElement("label")}}</li>
- <li>{{HTMLElement("meter")}}</li>
- <li>{{HTMLElement("object")}}</li>
- <li>{{HTMLElement("output")}}</li>
- <li>{{HTMLElement("progress")}}</li>
- <li>{{HTMLElement("select")}}</li>
- <li>{{HTMLElement("textarea")}}</li>
-</ul>
-
-<p>Esta categoría contiene varias subcategorías:</p>
-
-<dl>
- <dt id="Enumerado_en_formulario">enumerado</dt>
- <dd>Elementos que se enumeran en las colecciones IDL {{DOMxRef("HTMLFormElement.elements", "form.elements")}} y <code>fieldset.elements</code>. Contiene: {{HTMLElement("button")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("input")}}, {{deprecated_inline()}} {{HTMLElement("keygen")}}, {{HTMLElement("object")}}, {{HTMLElement("output")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
- <dt id="Etiquetable_en_formulario">etiquetable</dt>
- <dd>Elementos que se pueden asociar con elementos {{HTMLElement("label")}}. Contiene {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("meter")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
- <dt id="transmisible_de_formulario">transmisible</dt>
- <dd>Elementos que se pueden utilizar para construir el conjunto de datos del formulario cuando se envía el formulario. Contiene {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
- <dt id="Reiniciable_de_forumalior">reiniciable</dt>
- <dd>Elementos que se pueden ver afectados cuando se restablece o reinicia un formulario. Contiene {{HTMLElement("input")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("output")}},{{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
-</dl>
-
-<h2 id="Categorías_secundarias">Categorías secundarias</h2>
-
-<p>Hay algunas clasificaciones secundarias de elementos que también puede ser útil tener en cuenta.</p>
-
-<h3 id="Elementos_de_soporte_de_scripts">Elementos de soporte de scripts</h3>
-
-<p>Los <strong>elementos de soporte de scripts</strong> son elementos que no contribuyen directamente a la salida renderizada de un documento. En cambio, sirven para admitir scripts, ya sea conteniendo o especificando directamente el código del script, o especificando datos que serán utilizados por los scripts.</p>
-
-<p>Los elementos que admiten scripts son:</p>
-
-<ul>
- <li>{{HTMLElement("script")}}</li>
- <li>{{HTMLElement("template")}}</li>
-</ul>
-
-<h2 id="Modelo_de_contenido_transparente">Modelo de contenido transparente</h2>
-
-<p>Si un elemento tiene un modelo de contenido transparente, entonces su contenido debe estar estructurado de manera que sea HTML 5 válido, incluso si el elemento transparente fuera eliminado y reemplazado por elementos secundarios.</p>
-
-<p>Por ejemplo, los elementos {{HTMLElement("del")}} y {{HTMLElement("ins")}} son transparentes:</p>
-
-<pre class="notranslate">&lt;p&gt;Sostenemos que estas verdades son &lt;del&gt;&lt;em&gt;sagradas e innegablemente&lt;/em&gt;&lt;/del&gt; &lt;ins&gt;evidentes por sí mismas&lt;/ins&gt;.&lt;/p&gt;
-</pre>
-
-<p>Si esos elementos fueran eliminados, este fragmento seguiría siendo HTML válido (si no es Español correcto).</p>
-
-<pre class="notranslate">&lt;p&gt;Sostenemos que estas verdades son &lt;del&gt;&lt;em&gt;sagradas e innegablemente&lt;/em&gt;&lt;/del&gt; &lt;ins&gt;evidentes por sí mismas&lt;/ins&gt;.&lt;/p&gt;
-</pre>
-
-<h2 id="Otros_modelos_de_contenido">Otros modelos de contenido</h2>
-
-<p>Seccionado raíz.</p>
diff --git a/files/es/web/guide/html/content_categories/index.html b/files/es/web/guide/html/content_categories/index.html
new file mode 100644
index 0000000000..bcbb75b3c9
--- /dev/null
+++ b/files/es/web/guide/html/content_categories/index.html
@@ -0,0 +1,176 @@
+---
+title: Categorías de contenido
+slug: Web/Guide/HTML/Content_categories
+tags:
+  - Avanzado
+  - Guía
+  - HTML
+  - HTML5
+  - Web
+translation_of: Web/Guide/HTML/Content_categories
+original_slug: Web/Guide/HTML/categorias_de_contenido
+---
+<p><span class="seoSummary">Cada elemento {{web.link("/es/docs/Web/HTML", "HTML")}} es miembro de una o más <strong>categorías de contenido</strong> — estas categorías agrupan elementos que comparten características comunes.</span> Esta es una agrupación flexible (en realidad no crea una relación entre los elementos de estas categorías), pero ayuda a definir y describir el comportamiento compartido de las categorías y sus reglas asociadas, especialmente cuando te encuentras con sus intrincados detalles. También es posible que los elementos no sean miembros de <em>ninguna</em> de estas categorías.</p>
+
+<p>Hay tres tipos de categorías de contenido:</p>
+
+<ul>
+ <li>Categoría de contenido principal — que describe reglas comunes compartidas por muchos elementos.</li>
+ <li>Categorías de contenido relacionado con formularios — que describe reglas comunes a los elementos relacionados con formularios.</li>
+ <li>Categorías de contenido específico — que describe categorías raras compartidas solo por unos pocos elementos, a veces, solo en un contexto específico.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota</strong>: Una explicación comparativa más detallada de estas categorías de contenido y su funcionalidad está más allá del alcance de este artículo; para eso, posiblemente desees leer las <a href="https://html.spec.whatwg.org/multipage/dom.html#kinds-of-content">partes relevantes de la especificación HTML</a>.</p>
+</div>
+
+<p><a href="/@api/deki/files/6244/=Content_categories_venn.png"><img alt="Un diagrama de Venn que muestra cómo se interrelacionan las distintas categorías de contenido. Las siguientes secciones explican estas relaciones en texto." class="default internal" src="/@api/deki/files/6244/=Content_categories_venn.png?size=webview" style="height: 200px; width: 350px;"></a></p>
+
+<h2 id="Categorías_de_contenido_principal">Categorías de contenido principal</h2>
+
+<h3 id="Contenido_de_metadatos">Contenido de metadatos</h3>
+
+<p>Los elementos pertenecientes a la categoría <em>contenido de metadatos</em> modifican la presentación o el comportamiento del resto del documento, establecen enlaces a otros documentos o transmiten otra información <em>fuera de banda</em>.</p>
+
+<p>Los elementos que pertenecen a esta categoría son {{HTMLElement("base")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("link")}}, {{HTMLElement("meta")}}, {{HTMLElement("noscript")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.</p>
+
+<h3 id="Flujo_de_contenido">Flujo de contenido</h3>
+
+<p>Los elementos que pertenecen a la categoría de flujo de contenido suelen contener texto o contenido incrustado. Son: {{HTMLElement("a")}}, {{HTMLElement("abbr")}}, {{HTMLElement("address")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("audio")}}, {{HTMLElement("b")}},{{HTMLElement("bdo")}}, {{HTMLElement("bdi")}}, {{HTMLElement("blockquote")}}, {{HTMLElement("br")}}, {{HTMLElement("button")}}, {{HTMLElement("canvas")}}, {{HTMLElement("cite")}}, {{HTMLElement("code")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("data")}}, {{HTMLElement("datalist")}}, {{HTMLElement("del")}}, {{HTMLElement("details")}}, {{HTMLElement("dfn")}}, {{HTMLElement("div")}}, {{HTMLElement("dl")}}, {{HTMLElement("em")}}, {{HTMLElement("embed")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}}, {{HTMLElement("footer")}}, {{HTMLElement("form")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("header")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("hr")}}, {{HTMLElement("i")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("input")}}, {{HTMLElement("ins")}}, {{HTMLElement("kbd")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("main")}}, {{HTMLElement("map")}}, {{HTMLElement("mark")}}, {{MathMLElement("math")}}, {{HTMLElement("menu")}}, {{HTMLElement("meter")}}, {{HTMLElement("nav")}}, {{HTMLElement("noscript")}}, {{HTMLElement("object")}}, {{HTMLElement("ol")}}, {{HTMLElement("output")}}, {{HTMLElement("p")}}, {{HTMLElement("picture")}}, {{HTMLElement("pre")}}, {{HTMLElement("progress")}}, {{HTMLElement("q")}}, {{HTMLElement("ruby")}}, {{HTMLElement("s")}}, {{HTMLElement("samp")}}, {{HTMLElement("script")}}, {{HTMLElement("section")}}, {{HTMLElement("select")}}, {{HTMLElement("small")}}, {{HTMLElement("span")}}, {{HTMLElement("strong")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{SVGElement("svg")}}, {{HTMLElement("table")}}, {{HTMLElement("template")}}, {{HTMLElement("textarea")}}, {{HTMLElement("time")}}, {{HTMLElement("ul")}}, {{HTMLElement("var")}}, {{HTMLElement("video")}}, {{HTMLElement("wbr")}} and Text.</p>
+
+<p>Algunos otros elementos pertenecen a esta categoría, pero solo si se cumple una condición específica:</p>
+
+<ul>
+ <li>{{HTMLElement("area")}}, si es descendiente de un elemento {{HTMLElement("map")}}</li>
+ <li>{{HTMLElement("link")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#attr-itemprop", "itemprop")}}</li>
+ <li>{{HTMLElement("meta")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#attr-itemprop", "itemprop")}}</li>
+ <li>{{HTMLElement("style")}}, si está presente el atributo {{deprecated_inline()}} {{HTMLAttrxRef("scoped", "style")}}</li>
+</ul>
+
+<h3 id="Contenido_de_sección">Contenido de sección</h3>
+
+<p>Los elementos que pertenecen al modelo de contenido de secciones crean una {{web.link("/es/docs/Sections_and_Outlines_of_an_HTML5_document", "sección en el esquema actual")}} que define el alcance de los elementos {{HTMLElement("header")}}, {{HTMLElement("footer")}} y {{anch("Contenido del encabezado")}}.</p>
+
+<p>Los elementos que pertenecen a esta categoría son {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("nav")}} y {{HTMLElement("section")}}.</p>
+
+<div class="note">
+<p>No confundas este modelo de contenido con la categoría de {{web.link("/es/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines#Sectioning_roots", "seccionado raíz")}}, que aísla su contenido del esquema regular.</p>
+</div>
+
+<h3 id="Contenido_del_encabezado">Contenido del encabezado</h3>
+
+<p>El contenido del encabezado define el título de una sección, ya sea que esté marcado por un elemento {{anch("Contenido de sección")}} explícito o definido implícitamente por el contenido del encabezado en sí mismo.</p>
+
+<p>Los elementos que pertenecen a esta categoría son {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}} y {{HTMLElement("hgroup")}}.</p>
+
+<div class="note">
+<p>Aunque es probable que tenga contenido de encabezado, {{HTMLElement("header")}} no es contenido de encabezado en sí mismo.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: El elemento {{HTMLElement("hgroup")}} se eliminó de la especificación HTML del W3C antes de que se finalizara HTML 5, pero sigue siendo parte de la especificación WHATWG y la mayoría de los navegadores lo admiten por lo menos parcialmente.</p>
+</div>
+
+<h3 id="Contenido_de_redacción">Contenido de redacción</h3>
+
+<p>El contenido de redacción define el texto y el marcado que contiene. Las series de contenido de redacción forman párrafos.</p>
+
+<p>Los elementos que pertenecen a esta categoría son: {{HTMLElement("abbr")}}, {{HTMLElement("audio")}}, {{HTMLElement("b")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("button")}}, {{HTMLElement("canvas")}}, {{HTMLElement("cite")}}, {{HTMLElement("code")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("data")}}, {{HTMLElement("datalist")}}, {{HTMLElement("dfn")}}, {{HTMLElement("em")}}, {{HTMLElement("embed")}}, {{HTMLElement("i")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("input")}}, {{HTMLElement("kbd")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("mark")}}, {{MathMLElement("math")}}, {{HTMLElement("meter")}}, {{HTMLElement("noscript")}}, {{HTMLElement("object")}}, {{HTMLElement("output")}}, {{HTMLElement("picture")}}, {{HTMLElement("progress")}}, {{HTMLElement("q")}}, {{HTMLElement("ruby")}}, {{HTMLElement("samp")}}, {{HTMLElement("script")}}, {{HTMLElement("select")}}, {{HTMLElement("small")}}, {{HTMLElement("span")}}, {{HTMLElement("strong")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{SVGElement("svg")}}, {{HTMLElement("textarea")}}, {{HTMLElement("time")}}, {{HTMLElement("var")}}, {{HTMLElement("video")}}, {{HTMLElement("wbr")}} y texto sin formato (no solo consiste de espacios en blanco).</p>
+
+<p>Algunos otros elementos pertenecen a esta categoría, pero solo si se cumple una condición específica:</p>
+
+<ul>
+ <li>{{HTMLElement("a")}}, si solo incluye contenido de redacción</li>
+ <li>{{HTMLElement("area")}}, si es descendiente de un elemento {{HTMLElement("map")}}</li>
+ <li>{{HTMLElement("del")}}, si solo incluye contenido de redacción</li>
+ <li>{{HTMLElement("ins")}}, si solo incluye contenido de redacción</li>
+ <li>{{HTMLElement("link")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#itemprop", "itemprop")}}</li>
+ <li>{{HTMLElement("map")}}, si solo incluye contenido de redacción</li>
+ <li>{{HTMLElement("meta")}}, si está presente el atributo {{web.link("/es/docs/HTML/Global_attributes#itemprop", "itemprop")}}</li>
+</ul>
+
+<h3 id="Contenido_incrustado">Contenido incrustado</h3>
+
+<p>El contenido incrustado importa otro recurso o inserta contenido de otro lenguaje de marcado o espacio de nombres en el documento. Los elementos que pertenecen a esta categoría incluyen: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{HTMLElement("picture")}}, {{SVGElement("svg")}} y {{HTMLElement("video")}}.</p>
+
+<h3 id="Contenido_interactivo">Contenido interactivo</h3>
+
+<p>El contenido interactivo incluye elementos diseñados específicamente para la interacción del usuario. Los elementos que pertenecen a esta categoría incluyen: {{HTMLElement("a")}}, {{HTMLElement("button")}}, {{HTMLElement("details")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.<br>
+ Algunos elementos pertenecen a esta categoría solo bajo condiciones específicas:</p>
+
+<ul>
+ <li>{{HTMLElement("audio")}}, si está presente el atributo {{HTMLAttrxRef("controls", "audio")}}</li>
+ <li>{{HTMLElement("img")}}, si está presente el atributo {{HTMLAttrxRef("usemap", "img")}}</li>
+ <li>{{HTMLElement("input")}}, si el atributo {{HTMLAttrxRef("type", "input")}} no está en estado oculto</li>
+ <li>{{HTMLElement("menu")}}, si el atributo {{HTMLAttrxRef("type", "menu")}} está en la barra de estado de herramientas</li>
+ <li>{{HTMLElement("object")}}, si está presente el atributo {{HTMLAttrxRef("usemap", "object")}}</li>
+ <li>{{HTMLElement("video")}}, si está presente el atributo {{HTMLAttrxRef("controls", "video")}}</li>
+</ul>
+
+<h3 id="Contenido_palpable">Contenido palpable</h3>
+
+<p>El contenido es palpable cuando no está vacío ni oculto; es contenido que se presenta y es sustantivo. Los elementos cuyo modelo es flujo de contenido o contenido de redacción deben tener, por lo menos, un nodo que sea palpable.</p>
+
+<h3 id="Contenido_asociado_a_formulario">Contenido asociado a formulario</h3>
+
+<p>El contenido asociado a un formulario comprende elementos que tienen un formulario de propietario, expuesto mediante un atributo <strong>form</strong>. El propietario de un formulario es el elemento {{HTMLElement("form")}} que lo contiene o el elemento cuya identificación se especifica en el atributo <strong>form</strong>.</p>
+
+<ul>
+ <li>{{HTMLElement("button")}}</li>
+ <li>{{HTMLElement("fieldset")}}</li>
+ <li>{{HTMLElement("input")}}</li>
+ <li>{{deprecated_inline()}} {{HTMLElement("keygen")}}</li>
+ <li>{{HTMLElement("label")}}</li>
+ <li>{{HTMLElement("meter")}}</li>
+ <li>{{HTMLElement("object")}}</li>
+ <li>{{HTMLElement("output")}}</li>
+ <li>{{HTMLElement("progress")}}</li>
+ <li>{{HTMLElement("select")}}</li>
+ <li>{{HTMLElement("textarea")}}</li>
+</ul>
+
+<p>Esta categoría contiene varias subcategorías:</p>
+
+<dl>
+ <dt id="Enumerado_en_formulario">enumerado</dt>
+ <dd>Elementos que se enumeran en las colecciones IDL {{DOMxRef("HTMLFormElement.elements", "form.elements")}} y <code>fieldset.elements</code>. Contiene: {{HTMLElement("button")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("input")}}, {{deprecated_inline()}} {{HTMLElement("keygen")}}, {{HTMLElement("object")}}, {{HTMLElement("output")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
+ <dt id="Etiquetable_en_formulario">etiquetable</dt>
+ <dd>Elementos que se pueden asociar con elementos {{HTMLElement("label")}}. Contiene {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("meter")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
+ <dt id="transmisible_de_formulario">transmisible</dt>
+ <dd>Elementos que se pueden utilizar para construir el conjunto de datos del formulario cuando se envía el formulario. Contiene {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
+ <dt id="Reiniciable_de_forumalior">reiniciable</dt>
+ <dd>Elementos que se pueden ver afectados cuando se restablece o reinicia un formulario. Contiene {{HTMLElement("input")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("output")}},{{HTMLElement("select")}} y {{HTMLElement("textarea")}}.</dd>
+</dl>
+
+<h2 id="Categorías_secundarias">Categorías secundarias</h2>
+
+<p>Hay algunas clasificaciones secundarias de elementos que también puede ser útil tener en cuenta.</p>
+
+<h3 id="Elementos_de_soporte_de_scripts">Elementos de soporte de scripts</h3>
+
+<p>Los <strong>elementos de soporte de scripts</strong> son elementos que no contribuyen directamente a la salida renderizada de un documento. En cambio, sirven para admitir scripts, ya sea conteniendo o especificando directamente el código del script, o especificando datos que serán utilizados por los scripts.</p>
+
+<p>Los elementos que admiten scripts son:</p>
+
+<ul>
+ <li>{{HTMLElement("script")}}</li>
+ <li>{{HTMLElement("template")}}</li>
+</ul>
+
+<h2 id="Modelo_de_contenido_transparente">Modelo de contenido transparente</h2>
+
+<p>Si un elemento tiene un modelo de contenido transparente, entonces su contenido debe estar estructurado de manera que sea HTML 5 válido, incluso si el elemento transparente fuera eliminado y reemplazado por elementos secundarios.</p>
+
+<p>Por ejemplo, los elementos {{HTMLElement("del")}} y {{HTMLElement("ins")}} son transparentes:</p>
+
+<pre class="notranslate">&lt;p&gt;Sostenemos que estas verdades son &lt;del&gt;&lt;em&gt;sagradas e innegablemente&lt;/em&gt;&lt;/del&gt; &lt;ins&gt;evidentes por sí mismas&lt;/ins&gt;.&lt;/p&gt;
+</pre>
+
+<p>Si esos elementos fueran eliminados, este fragmento seguiría siendo HTML válido (si no es Español correcto).</p>
+
+<pre class="notranslate">&lt;p&gt;Sostenemos que estas verdades son &lt;del&gt;&lt;em&gt;sagradas e innegablemente&lt;/em&gt;&lt;/del&gt; &lt;ins&gt;evidentes por sí mismas&lt;/ins&gt;.&lt;/p&gt;
+</pre>
+
+<h2 id="Otros_modelos_de_contenido">Otros modelos de contenido</h2>
+
+<p>Seccionado raíz.</p>
diff --git a/files/es/web/guide/html/html5/constraint_validation/index.html b/files/es/web/guide/html/html5/constraint_validation/index.html
new file mode 100644
index 0000000000..ad5fdfc234
--- /dev/null
+++ b/files/es/web/guide/html/html5/constraint_validation/index.html
@@ -0,0 +1,346 @@
+---
+title: Validación de restricciones
+slug: Web/Guide/HTML/HTML5/Constraint_validation
+tags:
+  - CSS
+  - Guía
+  - HTML5
+  - NecesitaContenido
+  - Selectores
+translation_of: Web/Guide/HTML/HTML5/Constraint_validation
+original_slug: HTML/HTML5/Validacion_de_restricciones
+---
+<p>La creación de formularios web siempre ha sido una tarea compleja. Mientras armar el formulario en sí es fácil, verificar si cada campo tiene un valor que es válido y coherente es aun más difícil, e informar al usuario acerca del problema puede convertirse en un dolor de cabeza.<a href="/es/docs/HTML/HTML5" title="en/HTML/HTML5"> HTML5</a> introdujo nuevos mecanismos para formularios: añadió nuevos tipos semánticos para el elemento {{ HTMLElement("input") }} y <em>validación de restricciones</em> para facilitar el trabajo de revisar el contenido del formulario de lado del cliente. Se pueden usar restricciones básicas y comunes, sin la necesidad de JavaScript, estableciendo nuevos atributos; para restricciones más complejas se puede usar la <a href="/es/docs/HTML/HTML5/Formularios_en_HTML5#Validaci.C3.B3n_restringida" title="en/HTML/HTML5/Forms in HTML5#Constraint Validation API">API de Validación de Restricciones</a> de HTML.</p>
+
+<div class="note"><strong>Nota:</strong> La validación de restricciones de HTML5 no elimina la necesidad de hacer validaciones <em>de lado del servidor</em>. Aunque se esperen menos envíos con formularios inválidos, sí se pueden seguir recibiendo datos inválidos, en navegadores sin soporte (por ejemplo, navegadores sin HTML y sin JavaScript) o por chicos malos que traten de burlar las restricciones de la aplicación. Por lo tanto, como en HTML4, también tendrás que validar las restricciones de captura del lado del servidor, de modo que sea consistente con las que se hacen del lado del cliente.</div>
+
+<h2 id="Restricciones_intrínsecas_y_básicas">Restricciones intrínsecas y básicas</h2>
+
+<p>En HTML5, las restricciones básicas son declaradas de dos formas:</p>
+
+<ul>
+ <li>Eligiendo el valor semánticamente más apropiado para el atributo {{ htmlattrxref("type", "input") }} del elemento {{ HTMLElement("input") }}, por ejemplo, elegir el tipo <span style="font-family: courier new;">email</span> creará automáticamente la restricción para verificar que el valor sea una dirección de correo electrónico válida.</li>
+ <li>Estableciendo valores a los atributos de validación, permitiendo que se describan restricciones básicas de manera simple, sin la necesidad de JavaScript.</li>
+</ul>
+
+<h3 id="Tipos_de_captura_semánticos">Tipos de captura semánticos</h3>
+
+<p>Las restricciones intrínsecas para el atributo {{ htmlattrxref("type", "input") }} son:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Tipo de input</th>
+   <th scope="col">Descripción</th>
+   <th scope="col">Incumplimiento asociado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><span style="font-family: courier new;">&lt;input type="URL"&gt;</span></td>
+   <td>El valor debe ser una URL absoluta, es decir, una de las siguientes:
+    <ul>
+     <li>una URI válida (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3986.txt" title="http://www.ietf.org/rfc/rfc3986.txt">RFC 3986</a>)</li>
+     <li>una IRI válida, sin un componente de query (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li>
+     <li>una IRI válida, con componente de query sin caracteres no ASCII sin escapar (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li>
+     <li>una IRI válida, y que el conjunto de caracteres para el documento sea UTF-8 o UTF-16 (como se define en <a class="external" href="http://www.ietf.org/rfc/rfc3987.txt" title="http://www.ietf.org/rfc/rfc3987.txt">RFC 3987</a>)</li>
+    </ul>
+   </td>
+   <td>Incumplimiento de restricción por <strong>tipo no coincidente (Type mismatch)</strong></td>
+  </tr>
+  <tr>
+   <td> <span style="font-family: courier new;">&lt;input type="email"&gt;</span></td>
+   <td>El valor debe obedecer a la producción <a class="external" href="http://www.ietf.org/rfc/std/std68.txt" title="http://www.ietf.org/rfc/std/std68.txt">ABNF</a>: <code>1*( atext / "." ) "@" ldh-str 1*( "." ldh-str )</code> donde:
+    <ul>
+     <li><code>atext</code> está definido en  <a class="external" href="http://tools.ietf.org/html/rfc5322" title="http://tools.ietf.org/html/rfc5322">RFC 5322</a>, y representa una letra US-ASCII (<span style="font-family: courier new;">A</span>-<span style="font-family: courier new;">Z</span> y <span style="font-family: courier new;">a</span>-<span style="font-family: courier new;">z</span>), un dígito (<span style="font-family: courier new;">0</span>-<span style="font-family: courier new;">9</span>) o uno de los siguientes caracteres especiales: <span style="font-family: courier new;">! # $ % &amp; ' * + - / = ? ` { } | ~</span>,</li>
+     <li><code>ldh-str</code> está definido en <a class="external" href="http://www.apps.ietf.org/rfc/rfc1034.html#sec-3.5" title="http://www.apps.ietf.org/rfc/rfc1034.html#sec-3.5">RFC 1034</a>, y representa letras US-ASCII, combinadas con dígitos y el símbolo <span style="font-family: courier new;">-</span> agrupados en palabras separadas por un punto (<span style="font-family: courier new;">.</span>).</li>
+    </ul>
+
+    <div class="note"><strong>Nota:</strong> si se estableció el atributo {{ htmlattrxref("multiple", "input") }}, se pueden definir distintas direcciones de correo, separadas por coma, para este control. Si cualquiera de ellas no satisface la condición descrita aquí, se ejecuta el incumplimiento de restricción por <strong>tipo no coincidente</strong>.</div>
+   </td>
+   <td>Incumplimiento de restricción por <strong>tipo no coincidente (Type mismatch)</strong></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Nótese que la mayoría de los tipos de input no tienen restricciones intrínsecas, puesto que algunos simplemente son excluidos de la validación de restricciones, o tienen un algoritmo de sanitización que transforma los valores incorrectos a uno valor correcto predeterminado. </p>
+
+<h3 id="Atributos_relacionados_con_validaciones">Atributos relacionados con validaciones</h3>
+
+<p>Los siguientes atributos son usados para describir restricciones básicas:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Atributo</th>
+   <th scope="col">Tipos de input que soportan el atributo</th>
+   <th scope="col">Valores posibles</th>
+   <th scope="col">Descripción</th>
+   <th scope="col">Incumplimiento asociado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{ htmlattrxref("pattern", "input") }}</td>
+   <td>text, search, url, tel, email, password</td>
+   <td>Una expresión regular de JavaScript (compilada con las banderas <code title="">global</code>, <code title="">ignoreCase</code>, y <code title="">multiline</code> de ECMAScript 5 <em>desabilitadas</em>)</td>
+   <td>El valor debe coincidir con el patrón.</td>
+   <td>Incumplimiento de restricción por <strong>incompatibilidad de patrones (Pattern mismatch)</strong></td>
+  </tr>
+  <tr>
+   <td rowspan="3">{{ htmlattrxref("min", "input") }}</td>
+   <td>range, number</td>
+   <td>Un número válido</td>
+   <td rowspan="3">El valor debe ser mayor o igual al de este atributo.</td>
+   <td rowspan="3">Incumplimiento de restricción por <strong>flujo insuficiente (Underflow)</strong></td>
+  </tr>
+  <tr>
+   <td>date, month, week</td>
+   <td>Una fecha válida</td>
+  </tr>
+  <tr>
+   <td>datetime, datetime-local, time</td>
+   <td>Una fecha y hora válidos</td>
+  </tr>
+  <tr>
+   <td rowspan="3">{{ htmlattrxref("max", "input") }}</td>
+   <td>range, number</td>
+   <td>Un número válido</td>
+   <td rowspan="3">El valor debe ser menor o igual al de este atributo</td>
+   <td rowspan="3">Incumplimiento de restricción por <strong>desborde (Overflow)</strong></td>
+  </tr>
+  <tr>
+   <td>date, month, week</td>
+   <td>Una fecha válida</td>
+  </tr>
+  <tr>
+   <td>datetime, datetime-local, time</td>
+   <td>Una fecha y hora válidos</td>
+  </tr>
+  <tr>
+   <td>{{ htmlattrxref("required", "input") }}</td>
+   <td>text, search, url, tel, email, password, date, datetime, datetime-local, month, week, time, number, checkbox, radio, file; también en los elementos {{ HTMLElement("select") }} y {{ HTMLElement("textarea") }}</td>
+   <td><em>ninguno</em>, pues éste es un atributo de tipo Boolean: su presencia representa <em>true</em>, y su ausencia representa <em>false</em></td>
+   <td>Debe tener un valor (si se establece).</td>
+   <td>Incumplimiento de restricción por<strong> ausencia (Missing)</strong></td>
+  </tr>
+  <tr>
+   <td rowspan="5">{{ htmlattrxref("step", "input") }}</td>
+   <td>date</td>
+   <td>Un número entero de días</td>
+   <td rowspan="5">A menos que se establezca el atributo con la literal <span style="font-family: courier new;">any</span>, el valor debe ser <strong>min</strong> + un enter múltiplo del valor de este atributo.</td>
+   <td rowspan="5">Incumplimiento de restricción por<strong> inconsistencia de paso (Step mismatch)</strong></td>
+  </tr>
+  <tr>
+   <td>month</td>
+   <td>Un número entero de meses</td>
+  </tr>
+  <tr>
+   <td>week</td>
+   <td>Un número entero de semanas</td>
+  </tr>
+  <tr>
+   <td>datetime, datetime-local, time</td>
+   <td>Un número entero de segundos</td>
+  </tr>
+  <tr>
+   <td>range, number</td>
+   <td>Un entero</td>
+  </tr>
+  <tr>
+   <td>{{ htmlattrxref("maxlength", "input") }}</td>
+   <td>text, search, url, tel, email, password; también en el elemento {{ HTMLElement("textarea") }}</td>
+   <td>Una longitud en enteros</td>
+   <td>El número de caracteres (puntos de código) no debe exceder el valor del atributo.</td>
+   <td>Incumplimiento de restricción por ser<strong> muy largo (Too long)</strong></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Proceso_de_validación_de_restricciones"><span class="author-g-by4vjwmiwjiydpj7">Proceso de validación de restricciones</span></h2>
+
+<p>La validación de restricciones se hace a través de la API de Validación de Restricciones, ya sea en un elemento de formulario individual o a nivel de formulario, en el elemento {{ HTMLElement("form") }} mismo. La validación de restricciones se hace de las siguientes maneras:</p>
+
+<ul>
+ <li>Invocando a la función <code>checkValidity()</code> de una interfaz <a href="/es/docs/DOM" title="en/DOM">DOM</a> relacionada con formas (<code><a href="/es/docs/Web/API/HTMLInputElement" title="en/DOM/HTMLInputElement">HTMLInputElement</a></code>, <code><a href="/es/docs/Web/API/HTMLSelectElement" title="en/DOM/HTMLSelectElement">HTMLSelectElement</a></code>, <code><a href="/es/docs/Web/API/HTMLButtonElement" title="en/DOM/HTMLButtonElement">HTMLButtonElement</a></code> o <code><a href="/es/docs/Web/API/HTMLTextAreaElement" title="en/DOM/HTMLTextAreaElement">HTMLTextAreaElement</a></code>), la cual evalúa las restricciones para este elemento únicamente, permitiendo que un script obtenga esta información. (Esto lo hace comúnmente el agente usuario cuando determina cuál de las pseudo-clases <a href="/es/docs/Web/CSS" title="en/CSS">CSS</a>, {{ Cssxref(":valid") }} o {{ Cssxref(":invalid") }}, se aplicará.)</li>
+ <li>Invocando a la función <code>checkValidity()</code> en la interfaz <code><a href="/es/docs/Web/API/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a></code>, llamada <em>validación estática de restricciones</em>.</li>
+ <li>Enviando el formulario en sí, llamado <em>validación interactiva de restricciones</em>.</li>
+</ul>
+
+<div class="note"><strong>Nota: </strong>
+
+<ul>
+ <li>Si se establece el atributo {{ htmlattrxref("novalidate", "form") }} en el elemento {{ HTMLElement("form") }}, la validación interactiva de las restricciones no se aplica.</li>
+ <li>Invocando al método <code>send()</code> en la interfaz <a href="/es/docs/Web/API/HTMLFormElement" title="en/DOM/HTMLFormElement">HTMLFormElement</a> no invoca a la validación de restricciones. en otras palabras, este método envía los datos del formulario al servidor aunque no se satisfagan las restricciones.</li>
+</ul>
+</div>
+
+<h2 id="Restricciones_complejas_usando_la_API_de_Restricciones_de_HTML5"><span class="author-g-by4vjwmiwjiydpj7">Restricciones complejas usando la API de Restricciones de HTML5</span></h2>
+
+<p><span class="author-g-by4vjwmiwjiydpj7">Usando JavaScript y la API de Restricciones, es posible implementar restricciones más complejas, por ejemplo, restricciones que combinen varios campos, o que involucren cálculos complejos.</span></p>
+
+<p><span class="author-g-by4vjwmiwjiydpj7">Básicamente, la idea es ejecutar JavaScript en un evento de algún campo del formulario (como <strong>onchange</strong>) para calcular si la restricción no se cumple, y entonces usar el método <code><em>field</em>.setCustomValidity()</code> para establecer el resultado de la validación: una cadena vacía significa que la restricción se satisfizo, y cualquier otro texto significa que hay un error, siendo el texto el mensaje que se mostrará al usuario.</span></p>
+
+<h3 id="Restricciones_que_combinan_varios_campos_Validación_de_código_postal">Restricciones que combinan varios campos: Validación de código postal</h3>
+
+<p>El formato de código postal varía de un país a otro. No sólo la mayoría de los países permiten un prefijo opcional con el código del país (como <code>D-</code> en Alemania, <code>F-</code> en Francia o Suiza), sino que algunos países tienen códigos postales con solamente un número fijo de dígitos; otros, como el Reino Unido, tienen estructuras más complejas, permitiendo letras en posiciones específicas.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Esto no es una guía completa para una biblioteca de validación de código postal, sino más bien una demostración de conceptos clave.</p>
+</div>
+
+<p><span style="line-height: 1.5;">Como un ejemplo, añadiremos un script que verificará la validación de restricciones en este formulario simple:</span></p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+    &lt;label for="ZIP"&gt;Código postal : &lt;/label&gt;
+    &lt;input type="text" id="ZIP"&gt;
+    &lt;label for="Country"&gt;País : &lt;/label&gt;
+    &lt;select id="Country"&gt;
+      &lt;option value="ch"&gt;Suiza&lt;/option&gt;
+      &lt;option value="fr"&gt;Francia&lt;/option&gt;
+      &lt;option value="de"&gt;Alemania&lt;/option&gt;
+      &lt;option value="nl"&gt;Países Bajos&lt;/option&gt;
+    &lt;/select&gt;
+    &lt;input type="submit" value="Validar"&gt;
+&lt;/form&gt;</pre>
+
+<p>Esto mostrará el siguiente formulario: </p>
+
+<p><label>Código Postal : </label><input> <label>Country: </label><select><option value="ch">Suiza</option><option value="fr">Francia</option><option value="de">Alemania</option><option value="nl">Países Bajos</option></select></p>
+
+<p>Primero, escribimos una función que revisará las restricciones en sí:</p>
+
+<pre class="brush: js notranslate">function checkZIP() {
+  // Para cada país, se define el patrón para el código postal
+  var constraints = {
+    ch : [ '^(CH-)?\\d{4}$', "El código postal de Suiza debe tener cuatro dígitos: p.ej. CH-1950 o 1950" ],
+    fr : [ '^(F-)?\\d{5}$' , "El código postal de Francia debe tener cinco dígitos: p.ej. F-75012 o 75012" ],
+    de : [ '^(D-)?\\d{5}$' , "El código postal de Alemania debe tener cinco dígitos: p-ej. D-12345 o 12345" ],
+    nl : [ '^(NL-)?\\d{4}\\s*([A-RT-Z][A-Z]|S[BCE-RT-Z])$',
+                    "El código postal de Países Bajos debe tener cuatro dígitos, seguidos de dos letras excepto SA, SD y SS" ]
+  };
+
+  // Se lee el ID del país
+  var country = document.getElementById("Country").value;
+
+  // Se obtiene el campo del código postal
+  var ZIPField = document.getElementById("ZIP");
+
+  // Se crea el validador de la restricción
+  var constraint = new RegExp(constraints[country][0], "");
+    console.log(constraint);
+
+
+  // ¡Se hace la revisión!
+  if (constraint.test(ZIPField.value)) {
+    // El código postal cumple la restricción, usamos la API de Restricciones para indicarlo
+    ZIPField.setCustomValidity("");
+  }
+  else {
+    // El código postal no cumple la restricción, usamos la API de Restricciones para
+    // dar un mensaje sobre el formato requerido para este país
+    ZIPField.setCustomValidity(constraints[country][1]);
+  }
+}
+</pre>
+
+<p>Entonces, enlazamos este código al evento <strong>onchange</strong> del elemento {{ HTMLElement("select") }} y al evento <strong>oninput</strong> del elemento {{ HTMLElement("input") }}:</p>
+
+<pre class="brush: js notranslate">window.onload = function () {
+    document.getElementById("Country").onchange = checkZIP;
+    document.getElementById("ZIP").oninput = checkZIP;
+}</pre>
+
+<p>Puedes ver <a href="/@api/deki/files/4744/=constraint.html" title="https://developer.mozilla.org/@api/deki/files/4744/=constraint.html">aquí un ejemplo en vivo</a> de la validación de código postal.</p>
+
+<h3 id="Limitando_el_tamaño_de_un_archivo_antes_de_ser_subido">Limitando el tamaño de un archivo antes de ser subido</h3>
+
+<p>Otra restricción común es limitar el tamaño de un archivo que será subido. Verificar esto de lado del cliente antes de que el archivo sea transmitido al servidor requiere combinar la API de Validación de Restricciones, y especialmente la función field.setCustomValidity(), con otra API de JavaScript, la File API.</p>
+
+<p>Aquí está la parte de HTML:</p>
+
+<pre class="brush: html notranslate">&lt;label for="FS"&gt;Selecciona un archivo menor a 75KB : &lt;/label&gt;
+&lt;input type="file" id="FS"&gt;</pre>
+
+<p>Esto muestra lo siguiente:</p>
+
+<p><label>Seleciona un archivo menor a 75KB : </label> <input></p>
+
+
+
+<p>Con JavaScript, leemos el archivo seleccionado, usamos el método File.size() para obtener su tamaño, lo comparamos con el límite fijo (hard coded), y llamamos a la API de Validación de Restricciones para informar al navegador si no se cumple la restricción:</p>
+
+<pre class="brush: js notranslate">function checkFileSize() {
+  var FS = document.getElementById("FS");
+  var files = FS.files;
+
+  // Si hay (por lo menos) un archivo seleccionado
+  if (files.length &gt; 0) {
+     if (files[0].size &gt; 75 * 1024) { // Validar la restricción
+       FS.setCustomValidity("El archivo seleccionado no debe ser mayor a 75KB");
+       return;
+     }
+  }
+  // No hay incumplimiento de la restricción
+  FS.setCustomValidity("");
+}</pre>
+
+
+
+<p>Finalmente, anclamos el método al evento requerido:</p>
+
+<pre class="brush: js notranslate">window.onload = function () {
+  document.getElementById("FS").onchange = checkFileSize;
+}</pre>
+
+<p>Puedes ver <a href="/@api/deki/files/4745/=fileconstraint.html" title="https://developer.mozilla.org/@api/deki/files/4745/=fileconstraint.html">aquí un ejemplo en vivo</a> de la validación de tamaño de archivos.</p>
+
+<h2 id="Estilos_visuales_de_validación_de_restricciones"><span class="author-g-by4vjwmiwjiydpj7">Estilos visuales de validación de restricciones</span></h2>
+
+<p>Aparte de establecer las restricciones, los desarrolladores web querrán controlar los mensajes que son desplegados al usuario y los estilos de los mismos.</p>
+
+<h3 id="Controlando_el_aspecto_de_los_elementos">Controlando el aspecto de los elementos</h3>
+
+<p>El aspecto de los elementos puede ser controlado por medio de pseudo-clases de CSS.</p>
+
+<h4 id="Pseudo-clases_required_y_optional">Pseudo-clases :required y :optional</h4>
+
+<p>Las <a href="/es/docs/Web/CSS/Pseudo-classes" title="Pseudo-classes">pseudo-clases</a> <a href="/en-US/docs/Web/CSS/:required" title=":required"><code>:required</code></a> y <a href="/en-US/docs/Web/CSS/:optional" title=":optional"><code>:optional</code></a> permitene escribir selectores que coincidan con elementos de formulario que tengan el atributo {{ htmlattrxref("required") }} y los que no lo tengan, respectivamente.</p>
+
+<h4 id="Pseudo-clase_-moz-placeholder">Pseudo-clase :-moz-placeholder</h4>
+
+<p>Véase <a href="/es/docs/Web/CSS/::placeholder" title="/en-US/docs/Web/CSS/:-moz-placeholder">::placeholder</a> (experimental).</p>
+
+<h4 id="Pseudo-clases_valid_invalid">Pseudo-clases :valid :invalid</h4>
+
+<p>Las <a href="/es/docs/Web/CSS/Pseudo-classes" title="/en-US/docs/Web/CSS/Pseudo-classes?redirectlocale=en-US&amp;redirectslug=CSS%2FPseudo-classes">pseudo-clases</a> <a href="/en-US/docs/Web/CSS/:valid" title="/en-US/docs/Web/CSS/:valid">:valid</a> e <a href="/en-US/docs/Web/CSS/:invalid" title="/en-US/docs/Web/CSS/:invalid?redirectlocale=en-US&amp;redirectslug=CSS%2F%3Ainvalid">:invalid</a> son usadas para representar elementos &lt;input&gt; cuyo contenido es válido o inválido, respectivamente, acorde a las configuraciones de captura. Estas clases permiten al usuario estilizar elementos de formulario válidos e inválidos, para hacer más fácil el identificar elementos que tienen valores correctos o incorrectos.</p>
+
+<h4 id="Estilos_predeterminados">Estilos predeterminados</h4>
+
+<h3 id="Controlando_el_texto_de_incumplimiento_de_restricciones">Controlando el texto de incumplimiento de restricciones</h3>
+
+<h4 id="El_atributo_x-moz-errormessage">El atributo x-moz-errormessage</h4>
+
+<p>El atributo x-moz-errormessage es una extensión de Mozilla que te permite especificar el mensaje de error que se mostrará cuando un campo no es validado exitosamente.</p>
+
+<div class="note">
+<p style="margin-left: 40px;">Nota: Esta extensión no es estándar.</p>
+</div>
+
+<h4 id="element.setCustomValidity_de_la_API_de_Validación_de_Restricciones">element.setCustomValidity() de la API de Validación de Restricciones</h4>
+
+<p>El método element.setCustomValidity(error) es usado para establecer un mensaje de error personalizado para mostrar cuando el formulario es enviado. El método toma una cadena de texto como parámetro con el error. Si el error es una cadena no vacía, el método asume que la validación no fue exitosa, y despliega el mensaje con el error indicado. Si el error es una cadena vacía, el elemento es considerado válido, y restablece el mensaje de error.</p>
+
+<h4 id="Objeto_ValidityState_de_la_API_de_Validación_de_Restricciones"><span class="author-g-by4vjwmiwjiydpj7">Objeto ValidityState</span> de la API de Validación de Restricciones</h4>
+
+<p>La interfaz de DOM <code><a href="/es/docs/Web/API/ValidityState">ValidityState</a></code><a href="/es/docs/Web/API/ValidityState"> </a>representa los <em>estados de validez</em> en los que puede estar un elemento, respecto a la validación de restricciones. En conjunto, ayudan a explicar por qué el valor de un elemento falló en la validación, si no es válido.</p>
+
+<h3 id="Examples_of_personalized_styling"><span class="author-g-by4vjwmiwjiydpj7">Examples of personalized styling</span></h3>
+
+<h3 id="HTML4_fallback"><span class="author-g-by4vjwmiwjiydpj7">HTML4 fallback</span></h3>
+
+<h4 id="Trivial_fallback"><span class="author-g-by4vjwmiwjiydpj7">Trivial fallback</span></h4>
+
+<h4 id="JS_fallback"><span class="author-g-by4vjwmiwjiydpj7">JS fallback</span></h4>
+
+<h2 id="Conclusión"><span class="author-g-by4vjwmiwjiydpj7">Conclusión</span></h2>
diff --git a/files/es/web/guide/html/html5/html5_parser/index.html b/files/es/web/guide/html/html5/html5_parser/index.html
new file mode 100644
index 0000000000..f4357339f4
--- /dev/null
+++ b/files/es/web/guide/html/html5/html5_parser/index.html
@@ -0,0 +1,65 @@
+---
+title: Analizador de HTML5
+slug: Web/Guide/HTML/HTML5/HTML5_Parser
+tags:
+  - HTML
+  - HTML5
+  - para_revisar
+translation_of: Web/Guide/HTML/HTML5/HTML5_Parser
+original_slug: HTML/HTML5/HTML5_Parser
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">{{ gecko_minversion_header("2") }}{{ draft() }}</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Gecko 2 introduce un nuevo analizador basado en HTML 5.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">El analizador de HTML es una de las piezas más complicadas y delicadas de un navegador.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Controla la forma en que tu código fuente HTML es convertido en páginas web y, como tal, los cambios en él son poco habituales.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">El nuevo analizador es más rápido, cumple con el estándar HTML 5 y permite muchas funcionalidades nuevas.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">El nuevo analizador presenta estas mejoras importantes:</span></span></p>
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Ahora puedes utilizar SVG y MathML alineado en las páginas de HTML 5, sin sintaxis de espacio de nombres XML.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">El análisis se hace ahora en un tema aparte del hilo principal de la interfaz de usuario de Firefox, mejorando la capacidad de respuesta global del navegador.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Las llamadas a <code>innerHTML</code> son mucho más rápidas.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Se han corregido <a class="external" href="http://tinyurl.com/html-parser-bugs" title="http://tinyurl.com/html-parser-bugs">decenas de errores relacionados desde hace tiempo con el analizador</a>.</span></span></li>
+</ul>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">La <a class="external" href="http://www.w3.org/TR/html5/" title="http://www.w3.org/TR/html5/">especificación de HTML 5</a> ofrece una descripción más detallada que los anteriores estándares HTML sobre cómo convertir una secuencia de bytes en un árbol DOM.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Esto dará lugar a un comportamiento más consistente a través de las implementaciones del navegador.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">En otras palabras, al ser compatibles con HTML5, Gecko, WebKit, e Internet Explorer (IE) se comportarán de forma más coherente entre sí.</span></span></p>
+<h2 id="Conductas_del_analizador_modificadas"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Conductas del analizador modificadas</span></span></h2>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Algunos cambios en la forma en que se comporta el analizador de Gecko 2, en comparación con versiones anteriores de Gecko, pueden afectar a los desarrolladores web, dependiendo de cómo hayas escrito anteriormente el código y en qué navegadores lo hayas probado.</span></span></p>
+<h3 id="Tokenización_del_ángulo_izquierdo_del_soporte_dentro_de_una_etiqueta"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">Tokenización del ángulo izquierdo del soporte dentro de una etiqueta</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Teniendo en cuenta la cadena <code>&lt;foo&lt;bar&gt;</code> , el nuevo analizador la lee como una etiqueta llamada <code>foo&lt;bar</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Este comportamiento es compatible con IE y Opera, y es diferente de Gecko 1.x y WebKit, que lo leen como dos etiquetas, <code>foo</code> y <code>bar</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si anteriormente has probado tu código en Internet Explorer y Opera, entonces probablemente no tendrás ningunas etiquetas así.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si hiciste la prueba de tu sitio sólo con Gecko 1.x o WebKit (por ejemplo, intranets exclusivas de Firefox o sitios móviles orientados hacia WebKit), entonces podrías tener etiquetas que coincidan con este modelo y se comportarán de manera diferente con Gecko 2.</span></span></p>
+<h3 id="Llamar_a_document.write_()_durante_el_análisis"><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Llamar a document.write () durante el análisis</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Antes de HTML5, Gecko y WebKit permitían las llamadas a <a href="/en/DOM/document.write" title="en/DOM/document.write"><code>document.write()</code></a> <em>durante el análisis</em> para insertar contenido en la secuencia de origen.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Este comportamiento daba lugar inherentemente a <a class="external" href="http://en.wikipedia.org/wiki/Race_condition" title="http://en.wikipedia.org/wiki/Race_condition">condiciones de carrera</a>, puesto que el contenido se insertaba, </span></span><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">en la secuencia de origen, en</span></span><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr"> un punto dependiente de los tiempos de ejecución.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si la llamada ocurría después de que el análisis acabara, el contenido insertado sustituía al documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">En IE, este tipo de llamadas son ignoradas o implican una llamada a <a href="/en/DOM/document.open" title="en/DOM/document.open"><code>document.open()</code></a>, sustituyendo el documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">En HTML5, <code>document.write()</code> sólo se puede llamar desde un script que creado mediante la etiqueta {{ HTMLElement ("script") }} que no tenga establecidos los atributos <code><a href="/En/HTML/Element/Script#attr_async" title="En/HTML/Element/Script#attr async">async</a></code> o <code><a href="/En/HTML/Element/Script#attr_defer" title="En/HTML/Element/Script#attr defer">defer</a></code>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Con el analizador de HTML 5, las llamadas a <code>document.write()</code> en cualquier otro contexto o se ignoran o sustituyen el documento.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Algunos contextos en los que <em>no</em> debes llamar a <code>document.write()</code> incluyen:</span></span></p>
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">scripts creados con <a href="/en/DOM/document.createElement" title="en/DOM/document.createElement">document.createElement ()</a></span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">controladores de eventos</span></span></li>
+ <li><a href="/en/DOM/window.setTimeout" title="en/DOM/window.setTimeout"><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">setTimeout ()</span></span></a></li>
+ <li><a href="/en/DOM/window.setInterval" title="en/DOM/window.setInterval"><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr">setInterval ()</span></span></a></li>
+ <li><code>&lt;script async src="..."&gt;</code></li>
+ <li><code>&lt;script defer src="..."&gt;</code></li>
+</ul>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr">Si utilizas el mismo mecanismo para cargar bibliotecas de scripts para todos los navegadores, incluyendo Internet Explorer, entonces tu código probablemente no se vea afectado por este cambio.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los scripts que pueden provocar condiciones de carrera en Firefox, pero que resultarían seguros en Internet Explorer, se comportarán de manera diferente debido a este cambio.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Firefox escribe una advertencia en la consola de JavaScript cuando ignora una llamada a <code>document.write()</code> .</span></span></p>
+<h3 id="Falta_de_repetición_del_análisis"><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Falta de repetición del análisis</span></span></h3>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Antes de HTML5, los analizadores repetían el análisis del documento si alcanzaban el final del archivo dentro de ciertos elementos o dentro de los comentarios.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por ejemplo, si el documento carecía de una etiqueta de cierre <code>&lt;/title&gt;</code>, el analizador repetía el análisis para buscar el primer "&lt;" del documento, o si el comentario no estaba cerrado, buscaba el primer '&gt;'.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este comportamiento creaba una vulnerabilidad de seguridad.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si un atacante forzaba un final de archivo prematuro, el analizador podía cambiar qué partes del documento consideraba scripts ejecutables.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Además, la compatibilidad con la repetición de análisis dio lugar a código de análisis innecesariamente complejo.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Con HTML 5, los analizadores ya no repiten análisis de ningún documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Este cambio tiene las siguientes consecuencias para los desarrolladores web:</span></span></p>
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si se omite la etiqueta de cierre para &lt;title&gt;, &lt;style&gt;, &lt;textarea&gt; o &lt;XMP&gt;, la página <em>fallará</em> el análisis.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">IE ya falla al analizar documentos si falta una etiqueta &lt;/ title&gt;, así que si pruebas con IE, es probable que no tengas ese problema.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Si olvidas cerrar un comentario, lo más probable es que la página falle al analizarse.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Sin embargo, los comentarios no cerrados a menudo se rompen en los navegadores existentes, por una razón u otra, así que es poco probable que tengas este problema en los sitios que se han probado en varios navegadores.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En un script alineado, con el fin de utilizar las cadenas literales <code>&lt;/script&gt;</code> y <code>&lt;!--</code> , deberías evitar que se analicen literalmente, expresándolas como <code>\u003c/script&gt;</code> y <code>\u003c!--</code> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La práctica anterior de escapar de la cadena <code>&lt;/script&gt;</code> rodeándola con los marcadores de comentario, aunque es compatible con HTML5, causa problemas en los casos en los que se omite el marcador de comentario (ver punto anterior).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Puedes evitar estos problemas utilizando el código de carácter para el primer '&lt;' en su lugar.</span></span></li>
+</ul>
+<h2 id="Mejora_del_rendimiento_con_el_análisis_especulativo"><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">Mejora del rendimiento con el análisis especulativo</span></span></h2>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Sin relación con los requisitos de la especificación de HTML 5, el analizador de Gecko 2 utiliza <em>el análisis especulativo</em>, en el que continúa el análisis de un documento mientras que los scripts se están descargando y ejecutando.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto se traduce en un mejor rendimiento en comparación con análisis anteriores, ya que la mayoría de las veces, Gecko puede realizar estas tareas en paralelo.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para aprovechar al máximo el análisis especulativo y ayudar a que tus páginas se carguen lo más rápido posible, asegúrate de que cuando llames a <a href="/en/DOM/document.write" title="en/DOM/document.write">document.write ()</a> , escribas un <em>subárbol equilibrado</em> dentro de ese trozo de script.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Un subárbol equilibrado es el código HTML en el que todos los elementos que se abren también están cerrados, de forma que después de la secuencia de comandos, los elementos que se dejan abiertos son los mismos que fueron abiertos antes de la secuencia de comandos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Las etiquetas de apertura y cierra no necesitan ser escritas por la misma llamada <code>document.write()</code>, siempre y cuando estén dentro de la misma etiqueta <code>&lt;script&gt;</code>.</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Ten en cuenta que no debes usar etiquetas de cierre para elementos nulos que no tienen etiquetas de cierre: {{ HTMLElement('area') }}, {{ HTMLElement('base') }}, {{ HTMLElement('br') }}, {{ HTMLElement('col') }}, {{ HTMLElement('command') }}, {{ HTMLElement('embed') }}, {{ HTMLElement('hr') }}, {{ HTMLElement('img') }}, {{ HTMLElement('input') }}, {{ HTMLElement('keygen') }}, {{ HTMLElement('link') }}, {{ HTMLElement('meta') }}, {{ HTMLElement('param') }}, {{ HTMLElement('source') }} and {{ HTMLElement('wbr') }}.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">(También existe algún elemento cuyas etiquetas de cierre pueden omitirse en algunos casos, como {{ HTMLElement ('p') }} del ejemplo siguiente, pero es más fácil usar siempre etiquetas de cierre para dichos elementos que asegurarse de que las etiquetas de cierre sólo se omitan cuando no sean necesarias.)</span></span></p>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por ejemplo, el siguiente código escribe un subárbol equilibrado:</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">&lt;script&gt;</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">document.write ("&lt;div&gt;");</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">document.write ("&lt;p&gt; Aquí va el contenido. &lt;/ p&gt;");</span></span>
+  <span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">document.write ("&lt;/ div&gt;");</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;/ script&gt;</span></span>
+<span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">&lt;!-- Aquí va el HTML sin script. --&gt;
+</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Por el contrario, el siguiente código contiene dos scripts con subárboles no equilibrados, lo que hace que el análisis especulativo falle y por lo tanto el tiempo para analizar el documento sea más largo.</span></span></p>
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-68-goog-gtc-unit-69-goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-human" style="">&lt;script&gt;document.write("&lt;div&gt;");&lt;/script&gt;
+&lt;p&gt;El contenido va aquí.&lt;/p&gt;
+&lt;script&gt;document.write("&lt;/div&gt;");&lt;/script&gt;
+</span></span>
+</pre>
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Para obtener más información, consulta <a href="/en/HTML/HTML5/Optimizing_Your_Pages_for_Speculative_Parsing" title="en/HTML/HTML5/Optimizing Your Pages for Speculative Parsing">Optimizar tus páginas para el análisis especulativo</a></span></span></p>
+<p>{{ languages( { "en": "en/HTML/HTML5/HTML5_Parser" } ) }}</p>
diff --git a/files/es/web/guide/html/html5/index.html b/files/es/web/guide/html/html5/index.html
new file mode 100644
index 0000000000..1d98d2baa5
--- /dev/null
+++ b/files/es/web/guide/html/html5/index.html
@@ -0,0 +1,200 @@
+---
+title: HTML5
+slug: Web/Guide/HTML/HTML5
+tags:
+  - API
+  - CSS3
+  - Gráficos(2)
+  - HTML
+  - HTML5
+  - Multimedia
+  - SVG
+  - conectividad
+  - graficos
+  - mejoras
+  - nuevo
+translation_of: Web/Guide/HTML/HTML5
+original_slug: HTML/HTML5
+---
+<p style="line-height: 22px;"><span class="seoSummary"><strong>HTML5 </strong> <span style="line-height: 21px;">es la última versión de</span> <a href="/en-US/docs/HTML" title="HTML">HTML</a>. </span><span style="line-height: 21px;">El término representa dos conceptos diferentes:</span></p>
+
+<ul style="line-height: 22px;">
+ <li><span class="seoSummary">Se trata de una nueva versión de HTML, con nuevos elementos, atributos y comportamientos.</span></li>
+ <li><span class="seoSummary">Contiene un conjunto más amplio de tecnologías que permite a los sitios Web y a las aplicaciones ser más diversas y de gran alcance.</span> A este conjunto se le llama <em>HTML5 y amigos</em>, a menudo reducido a <em>HTML5</em> .</li>
+</ul>
+
+<p style="line-height: 22px;"><span style="line-height: 21px;">Diseñado para ser utilizable por todos los desarrolladores de Open Web, esta página referencía numerosos recursos sobre las tecnologías de HTML5, clasificados en varios grupos según su función. </span></p>
+
+<ul style="line-height: 22px;">
+ <li><em>Semántica</em>: Permite describir con mayor precisión <span id="docs-internal-guid-624d18e2-7fff-fe56-de5d-c9472725617e" style="background-color: transparent; color: #000000; font-family: Arial; font-size: 11pt; font-style: normal; font-variant: normal; font-weight: 400; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">cuál</span> es su contenido.</li>
+ <li><em>Conectividad</em>: Permite comunicarse con el servidor de formas nuevas e innovadoras.</li>
+ <li><em>Sin conexión y almacenamiento</em>: Permite a las páginas web almacenar datos localmente en el lado del cliente y operar sin conexión de manera más eficiente.</li>
+ <li><em>Multimedia</em>: <span style="background-color: #ffffff; color: #4d4e53; display: inline !important; float: none; font-family: open sans,sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 21px; text-align: start; text-indent: 0px; text-transform: none; white-space: normal;">Nos otorga un excelente soporte para utilizar contenido multimedia</span> como lo son audio y video nativamente.</li>
+ <li><em>Gráficos y efectos 2D/3D</em>: Proporciona una amplia gama de nuevas características que se ocupan de los gráficos en la web como lo son canvas 2D, WebGL, SVG, etc.</li>
+ <li><em>Rendimiento e Integración</em>: Proporciona una mayor optimización de la velocidad y un mejor uso del hardware.</li>
+ <li><em>Acceso al dispositivo</em>: Proporciona APIs para el uso de varios componentes internos de entrada y salida de nuestro dispositivo.</li>
+ <li><em>CSS3</em>: Nos ofrece una nueva gran variedad de opciones para hacer diseños más sofisticados.</li>
+</ul>
+
+<div class="cleared row topicpage-table" style="line-height: 22px;">
+<div class="section" style="width: 436px;">
+<h2 id="SEMÁNTICA" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3827/HTML5_Semantics_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">SEMÁNTICA</h2>
+
+<dl>
+ <dt><a href="https://developer.mozilla.org/es/docs/Sections_and_Outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">Secciones y contenidos en HTML5</a></dt>
+ <dd>Un vistazo al nuevo esquema y secciones de un documento HTML5: <span style="line-height: 1.572;">{{HTMLElement("section")}}, {{HTMLElement("article")}}, {{HTMLElement("nav")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("aside")}}.</span></dd>
+ <dt><a href="/docs/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content" title="Uso de audio y video en HTML5">Uso de audio y video en HTML5</a></dt>
+ <dd>Los elementos {{HTMLElement("audio")}} y {{HTMLElement("video")}} permiten la manipulacion de nuevo contenido multimedia.</dd>
+</dl>
+
+<dl>
+ <dt><a href="https://developer.mozilla.org/es/docs/HTML/HTML5/Formularios_en_HTML5" title="Forms in HTML5">Formularios en HTML5</a></dt>
+ <dd>Un mirada a la mejora de los formularios web en HTML5: La API de validación de restricción, varios atributos nuevos, nuevos valores para el<span style="line-height: 1.572;"> {{HTMLElement("input")}} como el atributo {{htmlattrxref("type", "input")}} y el nuevo elemento {{HTMLElement("output")}}.</span></dd>
+ <dt><span style="line-height: 1.572;">Nuevos elementos semánticos</span></dt>
+ <dd>Junto a las secciones , los medios de comunicación y elementos de formularios, se crearon muchos nuevos elementos como: {{HTMLElement("mark")}}, {{HTMLElement("figure")}}, {{HTMLElement("figcaption")}}, {{HTMLElement("data")}}, {{HTMLElement("time")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, o {{HTMLElement("meter")}}, aumentando la cantidad de <a href="/en-US/docs/HTML/HTML5/HTML5_element_list" title="HTML/HTML5/HTML5_element_list">elementos de HTML5 validos</a>.
+ <dl>
+  <dt></dt>
+  <dt>Mejora en {{HTMLElement("iframe")}}</dt>
+  <dd>Uso de atributos de {{htmlattrxref("sandbox", "iframe")}}, {{htmlattrxref("seamless", "iframe")}}, y  {{htmlattrxref("srcdoc", "iframe")}} los autores ahora pueden precisar el nivel de seguridad y la reproduccion deseada de un elemento {{HTMLElement("iframe")}}.</dd>
+  <dt><a href="/en-US/docs/MathML" title="MathML">MathML</a></dt>
+  <dd>Permite integrar directamente fórmulas matemáticas.</dd>
+  <dd></dd>
+  <dt><a href="/en-US/docs/HTML/HTML5/Introduction_to_HTML5" title="HTML/HTML5/Introduction_to_HTML5">Introducción a HTML5</a></dt>
+  <dd><span id="result_box" lang="es"><span class="hps">En este artículo</span> <span class="hps">se explica cómo</span> <span class="hps">indicar al</span> <span class="hps">navegador</span> <span class="hps">que está utilizando</span> <span class="hps">HTML5</span> <span class="hps">en</span> <span class="hps">su diseño web</span> <span class="hps">o aplicación web</span><span>.</span></span></dd>
+  <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/HTML5/HTML5_Parser" title="HTML/HTML5/HTML5 parser">Analizador de HTML5 compatible</a></dt>
+  <dd>El programa de análisis, lo que convierte los bytes de un documento HTML en un DOM, se ha ampliado y ahora define con precisión el comportamiento a utilizar en todos los casos, incluso cuando se trata de HTML inválido. Esto conduce a una mayor previsibilidad e interoperabilidad entre los navegadores compatibles con HTML5.</dd>
+ </dl>
+
+ <h2 id="CONECTIVIDAD" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3839/HTML5_Connectivity_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">CONECTIVIDAD</h2>
+
+ <dl>
+  <dt><a href="/en-US/docs/WebSockets" title="WebSockets">Web Sockets</a></dt>
+  <dd>Permite crear una conexión permanente entre la página y el servidor e intercambiar datos no HTML a través de ese medio.</dd>
+  <dt><a href="https://developer.mozilla.org/en-US/docs/Server-sent_events/Using_server-sent_events" title="Server-sent_events/Using_server-sent_events">Eventos de servidor enviados</a></dt>
+  <dd>Permite a un servidor "colocar" eventos en un cliente, en lugar del clásico paradigma  donde el servidor podría enviar datos sólo en respuesta a la petición de un cliente.</dd>
+  <dt><a href="/en-US/docs/WebRTC" title="WebRTC">WebRTC</a></dt>
+  <dd>Esta tecnología, donde RTC es sinónimo de comunicación en tiempo real, permite conectar con otras personas y servicio de videoconferencia de control directamente en el navegador, sin necesidad de un plugin o una aplicación externa.</dd>
+ </dl>
+
+ <h2 id="Sin_Conexión_Y_ALMACENAMIENTO" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3833/HTML5_Offline_Storage_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Sin Conexión Y ALMACENAMIENTO</h2>
+
+ <dl>
+  <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/Using_the_application_cache" title="Offline_resources_in_Firefox">Recursos sin conexión: el caché de la aplicación</a></dt>
+  <dd>Firefox es totalmente compatible con la especificación de recursos sin conexión de HTML5. La mayoría de los otros recursos sin conexión tienen soporte en un cierto nivel.</dd>
+  <dt><a href="https://developer.mozilla.org/en-US/docs/Online_and_offline_events" title="Online_and_offline_events">Eventos  con y sin conexión</a></dt>
+  <dd>Firefox 3 soporta WHATWG, eventos con y sin conexión, que permiten a las aplicaciones y extensiones detectar si hay o no una conexión a Internet, así como tambien, detectar cuando la conexión se pierde o se recupera.</dd>
+  <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Storage" title="DOM / Almacenamiento">WHATWG sesión del lado cliente y el almacenamiento continuo (Almacenamiento DOM)</a></dt>
+  <dd>Sesión del lado del cliente y el almacenamiento continuo permite a las aplicaciones web almacenar datos estructurados en el lado del cliente.</dd>
+  <dt><a href="/en-US/docs/IndexedDB" title="IndexedDB">IndexedDB</a></dt>
+  <dd>Es un estándar de Internet para el almacenamiento de grandes cantidades de datos estructurados en el navegador y para las búsquedas de alto rendimiento de estos datos mediante índices.</dd>
+  <dt><a href="https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications" title="Using_files_from_web_applications">Uso de archivos desde aplicaciones web</a></dt>
+  <dd>El soporte para la nueva API de archivos de HTML5 ha sido añadido a Gecko, por lo que es posible que las aplicaciones de Internet accedan a los archivos locales seleccionados por el usuario. Esto incluye el apoyo para la selección de varios archivos utilizando el<span style="line-height: 1.572;"> </span><span style="font-family: monospace; line-height: 1.572;">{{HTMLElement("input")}}</span><span style="line-height: 1.572;"> de </span><strong style="line-height: 1.572;"><a href="/en-US/docs/HTML/Element/Input#attr-type" style="line-height: 1.572;" title="HTML/Element/input#attr-type">tipo</a></strong><span style="line-height: 1.572;"> <em>file</em> </span>del elemento HTML <strong style="line-height: 1.572;"><a href="/en-US/docs/HTML/Element/Input#attr-multiple" style="line-height: 1.572;" title="HTML/Element/input#attr-multiple">múltiple</a>s </strong><span style="line-height: 1.572;">atributos. </span>También esta<span style="line-height: 1.572;"> </span><a href="/en-US/docs/DOM/FileReader" style="line-height: 1.572;" title="DOM/FileReader"><code style="font-size: 14px;">FileReader</code></a><span style="line-height: 1.572;">.</span></dd>
+ </dl>
+
+ <h2 id="MULTIMEDIA" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3835/HTML5_Multimedia_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">MULTIMEDIA</h2>
+
+ <dl>
+  <dt><a href="https://developer.mozilla.org/en-US/docs/Using_HTML5_audio_and_video" title="Using_audio_and_video_in_Firefox">Usando HTML5 de audio y video</a></dt>
+  <dd>Los elementos {{HTMLElement("audio")}} y {{HTMLElement("video")}} permiten la manipulación de nuevos contenidos multimedia.
+  <dl>
+   <dt></dt>
+   <dt><a href="/en-US/docs/WebRTC" title="WebRTC">WebRTC</a></dt>
+   <dd>Esta tecnología, donde RTC es sinónimo de comunicación en tiempo real, permite conectar con otras personas y controlar servicios de videoconferencia directamente en el navegador, sin necesidad de un plugin o una aplicación externa.</dd>
+   <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Using_the_Camera_API" title="DOM / Using_the_Camera_API">Usando la API de la cámara</a></dt>
+   <dd>Permite utilizar, manipular y almacenar una imagen de la cámara del ordenador.</dd>
+   <dt>Track and WebVTT</dt>
+   <dd>El elemento {{HTMLElement("track")}} permite subtítulos y capítulos. <a href="/en-US/docs/HTML/WebVTT" title="HTML/WebVTT">WebVTT</a> <span style="line-height: 1.572;">es un formato de pista de texto.</span></dd>
+  </dl>
+
+  <h2 id="3D_GRAFICOS_EFECTOS" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3841/HTML5_3D_Effects_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">3D, GRAFICOS &amp; EFECTOS</h2>
+
+  <dl>
+   <dt><a href="/en-US/docs/Canvas_tutorial" title="Canvas tutorial">Canvas Tutorial</a></dt>
+   <dd>Conozca el nuevo elemento <span style="font-family: courier new,andale mono,monospace; line-height: normal;">{{HTMLElement("canvas")}}</span>  y cómo dibujar gráficos y otros objetos en Firefox</dd>
+   <dt><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas">API de texto para elementos <code style="font-size: 14px;">&lt;canvas&gt;</code> </a></dt>
+   <dd>El API de texto HTML5 es ahora compatible con elementos {{HTMLElement("canvas")}} .</dd>
+   <dt><a href="/en-US/docs/WebGL" title="WebGL">WebGL</a></dt>
+   <dd>WebGL trae gráficos en 3D para la Web mediante la introducción de una API que se ajusta estrechamente a OpenGL ES 2.0 que se puede utilizar en elementos <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas"><code style="font-size: 14px;">&lt;canvas&gt;</code></a> HTML5  .</dd>
+   <dt><a href="/en-US/docs/SVG" title="SVG">SVG</a></dt>
+   <dd>Un formato basado en XML de imágenes vectoriales que directamente se pueden incrustar en el código HTML.</dd>
+   <dt></dt>
+  </dl>
+  </dd>
+ </dl>
+ </dd>
+</dl>
+</div>
+
+<div class="section" style="width: 435px;">
+<h2 id="RESULTADOS_e_INTEGRACIÓN" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3831/HTML5_Performance_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">RESULTADOS e INTEGRACIÓN</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/DOM/Using_web_workers" title="Using web workers">Web Workers</a></dt>
+ <dd>Permite delegar la evaluación JavaScript para subprocesos en segundo plano, lo que evita que estas actividades ralenticen eventos interactivos.</dd>
+ <dt><code style="font-size: 14px;"><a href="/en-US/docs/DOM/XMLHttpRequest" title="XMLHttpRequest">XMLHttpRequest</a></code> Nivel 2</dt>
+ <dd>Permite buscar de forma asíncrona algunas partes de la página, mostrando contenido dinámico, que varía según el tiempo y las acciones del usuario. Esta es la tecnología detrás de<span style="line-height: 1.572;"> </span><a href="/en-US/docs/AJAX" style="line-height: 1.572;" title="AJAX">Ajax</a><span style="line-height: 1.572;">.</span></dd>
+</dl>
+
+<dl>
+ <dt>Motores JIT compilación de JavaScript</dt>
+ <dd>La nueva generación de motores de JavaScript son mucho más poderosos, lo que lleva a un mayor rendimiento.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history" title="DOM/Manipulating_the_browser_history">History API</a></dt>
+ <dd>Permite la manipulación del historial del navegador. Esto es especialmente útil para la carga interactivamente nueva información en las páginas.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_Editable" title="HTML / contenido editable">El atributo contentEditable: transformar su sitio web en una wiki!</a></dt>
+ <dd>HTML5 ha estandarizado el atributo contentEditable. Aprenda más sobre esta opción.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop" title="DragDrop / Drag_and_Drop">Arrastrar y soltar</a></dt>
+ <dd>La API de arrastrar y soltar (drag and drop) permite soporte para arrastrar y soltar elementos dentro y entre sitios web. Esto también proporciona una API simple para el uso de extensiones y aplicaciones basadas ​​en Mozilla.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/Focus_management_in_HTML" title="Focus_management_in_HTML">Gestión del foco en HTML</a></dt>
+ <dd>Los nuevos atributos HTML5 <code style="font-size: 14px;">activeElement</code> y <code style="font-size: 14px;">hasFocus</code> son soportados.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/Web-based_protocol_handlers" title="Web-based_protocol_handlers">Manejadores de protocolo basados ​​en web</a></dt>
+ <dd>Ahora puede registrar las aplicaciones web como controladores de protocolo utilizando el metodo <code style="font-size: 14px;">navigator.registerProtocolHandler()</code>.</dd>
+ <dt><a href="/en-US/docs/DOM/window.requestAnimationFrame" title="DOM/window.requestAnimationFrame"><code style="font-size: 14px;">requestAnimationFrame</code></a></dt>
+ <dd>Permite controlar la renderización de  animaciones para obtener un óptimo rendimiento.</dd>
+ <dt><a href="/en-US/docs/DOM/Using_full-screen_mode" title="DOM/Using_full-screen_mode">Fullscreen API</a></dt>
+ <dd>Controla el uso de la pantalla completa de una página Web o aplicación, sin la interfáz de usuario del explorador mostrada.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/API/Pointer_Lock_API" title="API / Pointer_Lock_API">API Pointer Lock</a></dt>
+ <dd>Permite bloquear el puntero al contenido, por lo que los juegos y aplicaciones similares no pierden el foco cuando el puntero alcanza el límite de la ventana.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/Online_and_offline_events" title="Online_and_offline_events">Eventos en línea y fuera de línea</a></dt>
+ <dd>
+ <dl style="margin: 0px 0px 1.286em; padding: 0px;">
+  <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px;">Para construir una buena aplicación web offline-funcional, lo que necesita saber cuando su aplicación esta realmente sin conexión. Dicho sea de paso, también es necesario saber cuando su solicitud sea devuelta a un estado de conexión de nuevo.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<h2 id="ACCESO_al_dispositivo" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3837/HTML5_Device_Access_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">ACCESO al dispositivo</h2>
+
+<dl>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Using_the_Camera_API" title="DOM / Using_the_Camera_API">Usando la API de la cámara</a></dt>
+ <dd>Permite utilizar, manipular y almacenar una imagen de la cámara del ordenador.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/DOM/Touch_events" title="DOM / Touch_events">Eventos táctiles</a></dt>
+ <dd>Manipuladores para reaccionar a los eventos creados por un usuario cuando pulsa pantallas táctiles.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/Using_geolocation" title="El uso de geolocalización">El uso de geolocalización</a></dt>
+ <dd>Permite a los navegadores localizar la posición del usuario mediante geolocalización.</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/Detecting_device_orientation" title="Detecting_device_orientation">Detección de la orientación del dispositivo</a></dt>
+ <dd>Obtiene la información cuando el dispositivo en el que se ejecuta el navegador, cambia de orientación. Esto puede ser utilizado como un dispositivo de entrada (por ejemplo, para hacer que los juegos que reaccionan a la posición del dispositivo) o adaptar el diseño de una página a la orientación de la pantalla (vertical u horizontal).</dd>
+ <dt><a href="https://developer.mozilla.org/en-US/docs/API/Pointer_Lock_API" title="API / Pointer_Lock_API">API Pointer Lock</a></dt>
+ <dd>Permite bloquear el puntero al contenido, por lo que los juegos y aplicaciones similares no pierden el foco cuando el puntero alcanza el límite de la ventana.</dd>
+</dl>
+
+<h2 id="CSS3_STYLING" style="font-family: 'Bebas Neue', 'League Gothic', Haettenschweiler, 'Arial Narrow', sans-serif; border: none; font-size: 24px; margin: 0px 0px 0.25em; font-weight: 200; line-height: 1; letter-spacing: 1px; text-transform: uppercase;"><img alt="" src="/files/3829/HTML5_Styling_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">CSS3 STYLING</h2>
+
+<p><a href="/en-US/docs/CSS" title="CSS">CSS </a> <font>se ha ampliado para ser capaz de menajar elementos de estilo de una manera mucho más compleja. </font><font>Esto se refiere a menudo como</font> <a href="/en-US/docs/CSS/CSS3" title="CSS/CSS3">CSS3</a>,  <span style="line-height: 21px;">aunque CSS no es una especificación monolítica más y los diferentes módulos no están todos en el nivel 3: algunos están en el nivel 1 y otros en el nivel 4, con todos los niveles intermedios cubiertos.</span></p>
+
+<dl>
+ <dt>Nuevas características de diseño de fondo</dt>
+ <dd>Ahora es posible poner una sombra a un cuadro, con <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow"><code style="font-size: 14px;">box-shadow</code></a> y <a href="https://developer.mozilla.org/en-US/docs/CSS/Multiple_backgrounds" title="CSS / Multiple_backgrounds">varios fondos</a> se pueden ajustar.</dd>
+</dl>
+
+<dl>
+ <dt>Bordes mas "lujosos"</dt>
+ <dd>Ahora no sólo es posible utilizar las imágenes con los estilos de bordes, utilizando {{cssxref("border-image")}} y asociando sus propiedades asociadas a <span style="line-height: 1.572;">longhand</span><span style="line-height: 1.572;">, </span>aunque los bordes redondeados son apoyados a través de propiedades <span style="line-height: 1.572;">{{cssxref("border-radius")}} .</span></dd>
+ <dt>Animación de su estilo</dt>
+ <dd>Utilizando <a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_transitions" title="CSS / Using_CSS_transitions">Transiciones CSS</a> para animar entre los diferentes estados o utilizando <a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_animations" title="CSS / Using_CSS_animations">animaciones CSS</a> para animar partes de la página, sin que el evento se dispare, ahora puede controlar los elementos móviles en su página.</dd>
+ <dt>Tipografía mejorada</dt>
+ <dd>Los autores tienen un mejor control para usar la tipografía. Se puede controlar <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow"><code style="font-size: 14px;">el texto </code></a>{{cssxref("text-overflow")}} y <a href="https://developer.mozilla.org/en-US/docs/CSS/hyphens" title="CSS / guiones">guiones</a> y también puede poner una<a href="https://developer.mozilla.org/en-US/docs/CSS/text-shadow" title="CSS / text-shadow"> sombra</a>  o controlar con mayor precisión sus <a href="https://developer.mozilla.org/en-US/docs/CSS/text-decoration" title="SVG / atributo / text-decoration">decoraciones</a> . Los tipos de letra personalizados se pueden descargar y aplicar gracias a la nueva regla <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face"><code style="font-size: 14px;">@font-face</code></a> .</dd>
+ <dt>Nuevos diseños de presentación</dt>
+ <dd>Con el fin de mejorar la flexibilidad de los diseños, se han añadido dos nuevos diseños: el <a href="https://developer.mozilla.org/en-US/docs/CSS/Using_CSS_multi-column_layouts" title="CSS / Using_CSS_multi-column_layouts">CSS diseño de varias columnas</a> , y el <a href="https://developer.mozilla.org/en-US/docs/CSS/Flexbox" title="CSS / Flexbox">cuadro de distribución flexible de CSS</a> .</dd>
+</dl>
+</div>
+</div>
diff --git a/files/es/web/guide/html/html5/introduction_to_html5/index.html b/files/es/web/guide/html/html5/introduction_to_html5/index.html
new file mode 100644
index 0000000000..877f2666e0
--- /dev/null
+++ b/files/es/web/guide/html/html5/introduction_to_html5/index.html
@@ -0,0 +1,17 @@
+---
+title: Introducción a HTML5
+slug: Web/Guide/HTML/HTML5/Introduction_to_HTML5
+tags:
+  - HTML
+  - HTML5
+translation_of: Web/Guide/HTML/HTML5/Introduction_to_HTML5
+original_slug: HTML/HTML5/Introducción_a_HTML5
+---
+<p><br>
+ <span lang="es-ES"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/" title="http://www.whatwg.org/specs/web-apps/current-work/">HTML5</a>, algunas de cuyas características inicialmente comenzaron a llegar a Gecko 1.8.1, es la versión más reciente de HTML estándar.</span> <span lang="es-ES">Ofrece nuevas características que proporcionan no solo una amplia compatibilidad de medios, sino también una compatibilidad mejorada para la creación de aplicaciones web que pueden interactuar de una manera más sencilla y efectiva con el usuario, sus datos locales y los servidores.</span></p>
+<p><span lang="es-ES">Al estar HTML5 aún en la fase de diseño, son inevitables los cambios en las especificaciones.</span> <span lang="es-ES">Debido a esto, algunos navegadores no admiten aún determinadas características.</span> <span lang="es-ES">Sin embargo, Gecko (y por extensión, Firefox) tiene una compatibilidad inicial muy buena para HTML5 y se continúa trabajando para que sea compatible con cada vez más características.</span> <span lang="es-ES">Puedes encontrar una lista de las características de HTML5 que admite Gecko en la <a href="/es/HTML/HTML5" title="es/HTML/HTML5">página principal de HTML5</a>.</span></p>
+<h2 id="El_tipo_de_documento_HTML5">El tipo de documento HTML5</h2>
+<p><span lang="es-ES">El tipo de documento para HTML5 es muy sencillo.</span> <span lang="es-ES">Para indicar que el contenido de tu HTML usa HTML5, simplemente utiliza:</span></p>
+<pre lang="es-ES" style="margin-bottom: 0.5cm;">&lt;!DOCTYPE html&gt;</pre>
+<p lang="es-ES">Este tipo de documento tan sencillo hará que incluso aquellos navegadores que no admiten actualmente HTML5 entren en modo estándar, lo que significa que interpretarán conforme a HTML5 las partes establecidas hace tiempo, al ignorar las nuevas características de HTML5 que no admiten.</p>
+<p lang="es-ES">{{ languages( { "en": "en/HTML/HTML5/Introduction_to_HTML5" } ) }}</p>
diff --git a/files/es/web/guide/html/introduction_alhtml_clone/index.html b/files/es/web/guide/html/introduction_alhtml_clone/index.html
deleted file mode 100644
index 991cf90181..0000000000
--- a/files/es/web/guide/html/introduction_alhtml_clone/index.html
+++ /dev/null
@@ -1,172 +0,0 @@
----
-title: Introducción al HTML
-slug: Web/Guide/HTML/Introduction_alhtml_clone
-tags:
-  - HTML
----
-<p>Cuando miras una página web en el navegador, lo que ves a simple vista son palabras. Estas palabras normalmente tienen algunas características, como diferentes tamaños y colores. En algunos casos la página web puede mostrar imágenes o incluso vídeos. Otras veces, formularios donde puedes introducir o buscar información, o personalizar la apariencia de la página que estás viendo. La página también puede contener animaciones y contenidos que cambian mientras el resto de la página se mantiene sin cambios.</p>
-
-<p>Varias tecnologías (como <a href="/en-US/docs/CSS" title="CSS">CSS</a>, <a href="/en-US/docs/JavaScript/About_JavaScript" title="JavaScript/About_JavaScript">JavaScript</a>, <a href="/en-US/docs/Scripting_Plugins/Adobe_Flash" title="Scripting_Plugins/Adobe_Flash">Flash</a>, <a href="/en-US/docs/AJAX" title="AJAX">AJAX</a>, <a href="/en-US/docs/JSON" title="JSON">JSON</a>) pueden usarse para definir los elementos que componen una página web. Sin embargo, en el nivel más bajo, una página web se define usando <a href="/en-US/docs/HTML" title="HTML"><strong>HTML</strong></a> (<strong>HyperText Markup Language)</strong>. Sin HTML, no habría páginas web.</p>
-
-<p>Este artículo proporciona una introducción al HTML. Si alguna vez te has preguntado qué ocurre detrás de tu navegador web, este artículo es el mejor lugar para empezar a aprender.</p>
-
-<h2 id="Una_breve_historia_del_HTML">Una breve historia del HTML</h2>
-
-<p>A finales de la década de los 80s, <a href="http://www.w3.org/People/Berners-Lee/" title="http://www.w3.org/People/Berners-Lee/">Tim Berners-Lee</a> estuvo trabajando como físico en <a href="http://public.web.cern.ch/public/" title="http://public.web.cern.ch/public/">CERN</a> (las siglas inglesas de la Organización Europea para la Investigación Nuclear). Ideó un sistema para que los científicos pudieran compartir documentos a través de internet. Antes de su invención, las comunicaciones por Internet sólo permitían transmitir texto plano, empleando tecnologías como el email, <a href="http://en.wikipedia.org/wiki/Ftp" title="http://en.wikipedia.org/wiki/Ftp">FTP</a> (File Transfer Protocol), y <a href="http://en.wikipedia.org/wiki/Usenet" title="http://en.wikipedia.org/wiki/Usenet">Usenet</a>- tecnología en la que se basan los foros de internet. La invención del HTML permitió el uso de un modelo de contenido almacenado en un servidor central, que podía ser mostrado en un terminal local mediante un navegador. Esto simplificó el acceso al contenido y habilitó la posibilidad de mostrar contenido "enriquecido" (como un sofisticado texto formateado y visualización de imagenes).</p>
-
-<h2 id="¿Qué_es_el_HTML">¿Qué es el HTML?</h2>
-
-<p>HTML es un <strong>lenguaje de etiquetas</strong>. Indica al navegador como tiene que mostrar el contenido. El HTML separa el "contenido" (palabras, imágenes, audio, video, etc.) de la "presentación" (la definición del tipo de contenido y las instrucciones de cómo esos contenidos tienen que mostrarse). El HTML emplea un conjunto de elementos predefinidos que permiten identificar los distintos tipos de elementos. Estos elementos contienen una o más etiquetas que contienen o expresan el contenido. Estas etiquetas suelen ir encapsuladas entre los símbolos &lt;&gt;, y las etiquetas de cierre (que indican el final de un determinado contenido) están precedidas por una barra /.</p>
-
-<p>Por ejemplo, el elemento párrafo consiste en una etiqueta de inicio como esta "&lt;p&gt;" y una de cierre "&lt;/p&gt;". El siguiente ejemplo muestra un párrafo que está contenido dentro del elemento párrafo en HTML:</p>
-
-<div id="Spl1">
-<pre class="brush:html;">&lt;p&gt;Mi perro odia el pescado.&lt;/p&gt;</pre>
-</div>
-
-<p>Cuando este contenido se muestra en una página web, mediante un navegador, aparece así:</p>
-
-<p>{{ EmbedLiveSample("Spl1", 400, 50) }}</p>
-
-<p>El navegador emplea las etiquetas como guías para saber cómo debe ser mostrado el contenido que hay dentro de dichas etiquetas.</p>
-
-<p>Los elementos que contienen contenidos, normalmente suelen contener también otros elementos. Por ejemplo, el elemento énfasis (etiqueta &lt;em&gt;) puede estar dentro del elemento párrafo:</p>
-
-<div id="Spl2">
-<pre class="brush:html;">&lt;p&gt;Mi perro &lt;em&gt;odia&lt;/em&gt; el pescado.&lt;/p&gt;</pre>
-</div>
-
-<p>Cuando se muestre se verá del siguiente modo:</p>
-
-<p>{{ EmbedLiveSample("Spl2", 400, 50) }}</p>
-
-<p>Algunos elementos no contienen otros elementos.  Como es el caso de la etiqueta imagen ("&lt;img&gt;") que simplemente especifica el nombre del archivo que contiene la imagen como atributo:</p>
-
-<pre class="brush:html;">&lt;img src="smileyface.jpg"&gt;</pre>
-
-<p>En ocasiones, suele ponerse una barra "/" al final de la etiqueta, justo antes del cierre de la misma "&gt;" para indicar el final de la misma "/&gt;". Aunque se trata de algo opcional en HTML, en <a href="/en-US/docs/XHTML" title="XHTML">XHTML</a> es obligatoria (que es un lenguaje que permite una forma de poder implementar XML en los elementos del HTML).</p>
-
-<p>El resto de este artículo describe con un mayor detalle los conceptos descritos en esta sección. Además, si quieres ver HTML en acción, pásate por <a href="http://thimble.webmaker.org/en-US/projects/wrangler/edit" title="http://thimble.webmaker.org/en-US/projects/wrangler/edit">Mozilla Thimble</a>, que es un editor online  interactivo que enseña cómo escribir HTML. Además, en el <a href="/en-US/docs/HTML/HTML_Elements" title="HTML/HTML_Elements">HTML Elements</a> podrás ver una lista de los elementos HTML disponibles, así como una descripción de los mismos y el uso de cada uno de ellos.</p>
-
-<h2 id="Elementos_—_los_bloques_básicos_de_construcción">Elementos — los bloques básicos de construcción</h2>
-
-<p>El HTML consiste en una serie de elementos. Los Elementos definen el significado <strong>semántico</strong> del contenido. Todos los Elementos están incluídos entre dos grandes etiquetas, que a su vez contienen otras etiquetas. Por ejemplo, el elemento "&lt;p&gt;" indica un párrafo; el elemento "&lt;img&gt;" indica una imagen. Mira la página <a href="/en-US/docs/HTML/Element" title="HTML/Element">HTML Elements</a> para ver una lista completa de todos los elementos.</p>
-
-<p>Algunos elementos tienen un significado muy preciso, como "esto es una imagen", "esto es un encabezado" o "esto es una lista ordenada". Otros elementos resultan menos específicos, como "esto es una sección de una página" o "esto es parte de un texto". Finalmente otros elementos son usados por razones técnicas, como "esto es la información identificativa de la página que no debe ser mostrada". De un modo y otro, todos los elementos del HTML tienen un determinado valor semántico.</p>
-
-<p>Muchos elementos contienen otros elementos, formando una estructura jerárquica. Un ejemplo simple, pero completo de una página web sería este:</p>
-
-<pre class="brush:html;">&lt;html&gt;
-  &lt;body&gt;
-
-    &lt;p&gt;Mi perro &lt;em&gt;odia&lt;/em&gt; el pescado.&lt;/p&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>Como puedes ver, los elementos &lt;html&gt; encierran el resto del documento, y el elemento &lt;body&gt; encierra el contenido de la página. Esta estructura crece con las ramas de un árbol, donde los elementos &lt;body&gt; y &lt;p&gt; son las ramas que crecen del tronco que es &lt;html&gt;. Esta estructura jerárquica es lo que se denomina <strong>DOM</strong>: siglas inglesas del Documento Objeto Modelo (<strong>Document Object Model)</strong>.</p>
-
-<h2 id="Etiquetas">Etiquetas</h2>
-
-<p>Los documentos HTML están escritos en texto plano. Pueden ser escritos mediante editores de texto capaces de guardar contenido de texto plano (aunque la mayor parte de los creadores de código HTML prefieren editores especializados que resaltan las partes de código propias de la sintaxis del HTML y muestran el DOM). Los nombres de las Etiquetas, pueden escribirse en mayúsculas o en minúsculas. Aunque, el <a href="http://www.w3.org/" title="http://www.w3.org/">W3C</a> (Asociación Global que vela por mantener los estándares HTML) recomiendan usar minúsculas (y además el <a href="/en-US/docs/XHTML" title="XHTML">XHTML</a> requiere de las minúsculas).</p>
-
-<p>El código HTML contenido entre los signos de menor que ("&lt;") al comienzo y mayor que ("&gt;") al final, tienen un significado especial. Es lo que denominamos etiquetas. He aquí un ejemplo sencillo:</p>
-
-<pre class="brush: xml">&lt;p&gt;Esto es texto dentro de un párrafo.&lt;/p&gt;
-</pre>
-
-<p>En este ejemplo hay una etiqueta de comienzo y otra de cierre. Las etiquetas de cierre son las mismas que las etiquetas de comienzo sólo que contienen una barra justo después del signo menor que. Muchos elementos de HTML se escriben empleando las dos etiquetas de comienzo y final. Las etiquetas de comiezo y final de un elemento deben estar adecuadamente anidadas, esto significa que las etiquetas de cierre deben escribirse en el orden inverso al de las etiquetas de inicio. La regla del anidamiento de etiquetas tiene que cumplirse de forma escrupulosa para poder escribir <strong>código válido</strong>.</p>
-
-<p>Esto es un ejemplo de <em>código válido</em>:</p>
-
-<pre class="brush: xml">&lt;em&gt;Me &lt;strong&gt;refiero&lt;/strong&gt; a eso&lt;/em&gt;.
-</pre>
-
-<p>Esto es un ejemplo de <em>código inválido</em>:</p>
-
-<pre class="brush: xml">Invalido: &lt;em&gt;Me &lt;strong&gt;refiero&lt;/em&gt; a eso&lt;/strong&gt;.</pre>
-
-<p>Observa que en el ejemplo válido, la etiqueta de cierre para el elemento anidado está situada antes de la etiqueta de cierre del elemento que la contenedor.</p>
-
-<div class="note">
-<p>Hasta la adopción de las reglas revisadas del HTML5, los navegadores no interpretaban los códigos no válidos del mismo modo y provocaban distintos resultados cuando se encontraban con estas partes de código. Los navegadores eran tolerantes con los autores de código Web, pero por desgracia no todos de la misma forma, llevando a situaciones impredecibles a la hora de interpretar códigos no válidos de HTML. Pero esos días han acabado tras la última evolución de los navegadores como Internet Explorer 10, Firefox 4, Opera 11.60, Chrome 18 o Safari 5, a medida que han implementado las nuevas normas de interpretación de código HTML no válido. Aquí puede ver el resultado de un código invalido para el mismo arbol DOM <a class="external" href="http://arstechnica.com/open-source/news/2011/11/a-look-at-the-state-of-html5-parsing-and-the-opera-1160-beta.ars" title="http://arstechnica.com/open-source/news/2011/11/a-look-at-the-state-of-html5-parsing-and-the-opera-1160-beta.ars">en todos los navegadores modernos</a>.</p>
-</div>
-
-<p>Algunos elementos no contienen texto o ningún otro elemento. Es lo que se denominan elementos vacíos y no necesitan etiquetas de cierre. Este es un ejemplo:</p>
-
-<pre class="brush: xml">&lt;img src="smileyface.jpg"&gt;</pre>
-
-<p>Mucha gente marca los elementos vacíos usando una barra al final de la etiqueta, justo antes del simbolo mayor que (necesario en los códigos de XHTML).</p>
-
-<pre class="brush: xml">&lt;img src="smileyface.jpg" /&gt;</pre>
-
-<p>En HTML esta barra no aporta ninguna funcionalidad técnica y su uso es solamente una elección de estilo.</p>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>La etiqueta de comienzo puede contener información adicional, tal y como puede verse en el siguiente ejemplo. Dicha información es lo que se conoce como <strong>atributos</strong>. Los atributos suelen consistir en dor partes:</p>
-
-<ul>
- <li>Un atributo <strong>nombre </strong>(name).</li>
- <li>Un atributo <strong>valor</strong> (value).</li>
-</ul>
-
-<p>Algunos atributos sólo pueden tener un único valor. Son atributos <strong>Booleanos</strong> y pueden ser incluidos para especificar el nombre del atributo, o dejar su valor vacío. Así los siguientes tres ejemplos tienen el mismo significado:</p>
-
-<pre class="brush: xml">&lt;input required="required"&gt;
-
-&lt;input required=""&gt;
-
-&lt;input required&gt;
-</pre>
-
-<p>Los valores de los atributos que constan de una sola palabra o un número se pueden escribir tal cual, pero en cuanto hay dos o más cadenas de caracteres en el valor, éstos deben escribirse entre comillas. Están permitidas tanto las comillas simples ('), como las comillas dobles (") aunque muchos desarrolladores prefieren utilizar siempre comillas simples para que el código sea menos ambiguo para la vista y para evitar errores. El siguiente es semejante error..:Attribute values that consist of a single word or number may be written as they are, but as soon as there are two or more strings of characters in the value, it must be written within quotation marks. Both single quotes (') and double quotes (") are allowed. Many developers prefer to always use quotes to make the code less ambiguous to the eye and to avoid mistakes. El siguiente código sería un error:</p>
-
-<pre class="brush: xml">&lt;p class=foo bar&gt; (Ten cuidado, esto probablemente no quiere decir lo que piensas que significa.)</pre>
-
-<p>En este ejemplo suponemos que el valor del atributo es "foo bar" pero al no haber comillas en el código se interpreta como si se hubiera escrito así:</p>
-
-<pre class="brush: xml">&lt;p class="foo" bar=""&gt;</pre>
-
-<h2 id="Nombre_de_caracteres_referenciados">Nombre de caracteres referenciados</h2>
-
-<p>Los<strong> Caraceteres Referenciados </strong> (a veces llamados<em> entidades) </em>son combinaciones de caracteres que sirven para mostrar en el navegador símbolos que tienen un significado especial en el código HTML. Por ejemplo, HTML interpreta que el símbolo menor que y mayor que son delimitadores de una etiqueta. Si quieres que estos simbolos sean mostrados en el contenido del texto, debemos usar los nombres de referencia de estos caracteres. Aquí están los cuatro caracteres referenciados más comunes, que no estaría de más que memorizases:</p>
-
-<ul>
- <li><code>&amp;gt;</code> representa el carater mayor que (<code>&gt;</code>)</li>
- <li><code>&amp;lt;</code> representa el caracter menor que (<code>&lt;</code>)</li>
- <li><code>&amp;amp;</code> representa el caracter ampersand (<code>&amp;</code>)</li>
- <li><code>&amp;quot;</code> representa el caracter de comillas dobles (")</li>
-</ul>
-
-<p>Hay <a class="external" href="http://www.w3.org/TR/2011/WD-html5-20110113/named-character-references.html" title="http://www.w3.org/TR/html5/named-character-references.html#named-character-references">muchas más entidades</a>, pero estas cuatro son las más importantes por que representan caracteres que tienen un significado especial en HTML.</p>
-
-<h2 id="Tipo_de_documento_y_comentarios">Tipo de documento y comentarios</h2>
-
-<p>Además de las etiquetas, el contenido y las entidades, un documento de HTML debe contener una declaración <strong>doctype</strong> en la primera línea. En el HTML actual esto se escribe del siguiente modo:</p>
-
-<pre class="brush: xml">&lt;!DOCTYPE html&gt;</pre>
-
-<p>El doctype tiene una historia larga y complicada, pero todo lo que necesitas saber ahora es que el doctype le dice al navegador que interprete el código HTML y CSS de acuerdo a los estándares web del <a href="http://www.w3.org/" title="http://www.w3.org/">W3C</a> y que no trate de emular que se trata de un Internet Explorer de los 90's. (Consultar <a href="/en-US/docs/Quirks_Mode_and_Standards_Mode" title="Mozilla's Quirks Mode">peculiaridades</a>.)</p>
-
-<p>HTML tiene un mecanismo para poder introducir <strong>comentarios</strong> al código que no serán mostrados en la página cuando esta sea interpretada o leída por un navegador web. Esto suele emplearse para añadir explicaciones al código, o dejar notas para explicar a otras personas cómo trabaja el código de la página, o simplemente para dejar recordatorios para uno mismo. Los comentarios en HTML están contenidos entre los siguientes símbolos:</p>
-
-<pre class="brush: xml">&lt;!-- Esto es un comentario de texto --&gt;</pre>
-
-<h2 id="Un_pequeño_documento_pero_completo">Un pequeño documento pero completo</h2>
-
-<p>Colocando todas estas explicaciones juntas, aquí os dejamos un pequeño ejemplo de un documento HTML completo. Puedes copiar este código en un editor de textos, guardarlo como <em>myfirstdoc.html</em> y cargarlo en un navegador. Asegurate de estar usando los códigos de caracteres UTF-8. Dado que este documento no utiliza estilos (CSS) su apariencia será muy plana, pero sólo se trata de un pequeño comienzo.</p>
-
-<pre class="brush: xml">&lt;!DOCTYPE html&gt;
-&lt;html lang="en"&gt;
-&lt;head&gt;
-  &lt;meta charset="utf-8" /&gt;
-  &lt;title&gt;A tiny document&lt;/title&gt;
-&lt;/head&gt;
-&lt;body&gt;
-  &lt;h1&gt;Main heading in my document&lt;/h1&gt;
-  &lt;!-- Note that it is "h" + "1", not "h" + the letter "one" --&gt;
-  &lt;p&gt;Loook Ma, I am coding &lt;abbr title="Hyper Text Markup Language"&gt;HTML&lt;/abbr&gt;.&lt;/p&gt;
-&lt;/body&gt;
-&lt;/html&gt;
-</pre>
diff --git a/files/es/web/guide/html/using_html_sections_and_outlines/index.html b/files/es/web/guide/html/using_html_sections_and_outlines/index.html
new file mode 100644
index 0000000000..afb19f607f
--- /dev/null
+++ b/files/es/web/guide/html/using_html_sections_and_outlines/index.html
@@ -0,0 +1,412 @@
+---
+title: Secciones y esquema de un documento HTML5
+slug: Web/Guide/HTML/Using_HTML_sections_and_outlines
+translation_of: Web/Guide/HTML/Using_HTML_sections_and_outlines
+original_slug: Sections_and_Outlines_of_an_HTML5_document
+---
+<p>La especificación HTML5 trae muchos nuevos elementos a los desarrolladores web, permitiéndoles describir la estructura de un documento web con semántica estandarizada. Este documento describe estos elementos y cómo usarlos para definir el esquema de cualquier documento.</p>
+
+<div class="note">
+<p>A lo largo de este documento se empleará la palabra <strong>esquema</strong> en el sentido de esqueleto estructural o tabla de contenido, similar a cómo el índice de un libro muestra la estructura jerárquica de su contenido. Asimismo, usaremos <strong>algoritmo de esquematizado</strong> al proceso de construir el esquema infiriéndolo del contenido.</p>
+</div>
+
+<h2 id="Estructura_de_un_documento_HTML_4">Estructura de un documento HTML 4</h2>
+
+<p>La estructura de un documento, por ejemplo la estructura semántica de lo que está entre<code> &lt;body&gt;</code> y <code>&lt;/body&gt;</code> es fundamental para presentar la página al usuario. HTML4 usa la idea de secciones y subsecciones de un documento para describir su estructura. Una sección está definida por un elemento divisor HTML ({{HTMLElement("div")}}) con elementos de cabecera HTML ({{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, o {{HTMLElement("h6")}}) en él, definiendo sus títulos. La relación de estos elementos divisor y de cabecera HTML desemboca en la estructura del documento y su esquema.</p>
+
+<p>Entonces el siguiente marcado:</p>
+
+<div style="overflow: hidden;">
+<pre class="brush:xml">&lt;div class="seccion" id="zorro" &gt;
+&lt;h1&gt;El zorro&lt;/h1&gt;
+&lt;p&gt;En esta sección discutiremos sobre los aspectos menos conocidos del zorro.
+... bla, bla, bla ...
+&lt;div class="subseccion" id="zorro-habitat" &gt;
+&lt;h2&gt;Hábitat&lt;/h2&gt;
+&lt;p&gt;El zorro necesita un nido en donde poner sus huevos, de ahí que necesite árboles.
+...bla, bla, bla...
+&lt;/div&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<p>genera el siguiente esquema:</p>
+
+<pre>1. El zorro
+   1.1 Hábitat
+</pre>
+
+<p>Los elementos {{HTMLElement("div")}} no son obligatorios para definir una nueva sección. La sola presencia de un elemento de cabecera HTML es suficiente para implicar una nueva sección. Entonces,</p>
+
+<pre class="brush:xml">&lt;h1&gt;El zorro&lt;/h1&gt;
+&lt;p&gt;En esta sección discutiremos sobre los aspectos menos conocidos del zorro.
+... bla, bla, bla ...
+&lt;h2&gt;Hábitat&lt;/h2&gt;
+&lt;p&gt;El zorro necesita un nido en donde poner sus huevos, de ahí que necesite árboles.
+...bla, bla, bla...
+&lt;h2&gt;Costrumbres&lt;/h2&gt;
+&lt;h1&gt;El oso&lt;/h1&gt;
+</pre>
+
+<p>genera el siguiente esquema:</p>
+
+<pre>1. El zorro
+   1.1 Hábitat
+   1.2 Costumbres
+2. El oso
+</pre>
+
+<h2 id="Problemas_resueltos_por_HTML5">Problemas resueltos por HTML5</h2>
+
+<p>La definición de la estructura de un documento en HTML 4 y su algoritmo de esquematizado es muy tosco y genera numerosos problemas:</p>
+
+<ol>
+ <li>El uso de {{HTMLElement("div")}} para definir secciones semánticas sin definir valores específicos para los atributos <strong>class</strong> hace imposible la automatización del algoritmo de esquematizado ("¿Es ese {{HTMLElement("div")}} parte del esquema de la página, definiendo una sección o subsección?" o "¿es un {{HTMLElement("div")}} sólo de presentación, sólo usado para estilo?"). En otras palabras, la especificación HTML4 es muy imprecisa de lo que es una sección y cómo ese ámbito está definido. La generación automatizada del esquema es importante, especialmente para <a class="external" href="https://es.wikipedia.org/wiki/Tecnolog%C3%ADas_de_apoyo" title="http://en.wikipedia.org/wiki/Assistive_technology">tecnologías de apoyo</a>, que son capaces de adaptar la forma en que presentan información a los usuarios de acuerdo a la estructura del documento. HTML5 quita la necesidad de elementos {{HTMLElement("div")}} del algoritmo de esquematizado introduciendo un nuevo elemento, {{HTMLElement("section")}}, el elemento de sección HTML.</li>
+ <li>Mezclar varios documentos es difícil: la inclusión de un sub-documento en un documento principal significa cambiar el nivel de los elementos de cabecera HTML Headings Element para que el esquema se mantenga. Esto se resuelve en HTML5 con los recientemente introducidos elementos de seccionado ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} y {{HTMLElement("aside")}}) son siempre subsecciones dentro de la sección que las contiene, sin importar qué secciones son creadas por cabeceras internas.</li>
+ <li>Debido a que cada elemento de cabecera HTML es parte del esquema, no es posible describir un subtítulo o título secundario (por ejemplo, <code>&lt;h1&gt;Mozart&lt;/h1&gt;&lt;h2&gt;El genio salzburgués&lt;/h2&gt;</code> crea el esquema <code>1. Mozart 1.1 El genio salzburgués</code>). HTML5 introduce el elemento {{HTMLElement("hgroup")}} que oculta todos los elementos de cabecera excepto el primero de más alto rango (por ejemplo, <code>&lt;hgroup&gt;&lt;h1&gt;Mozart&lt;/h1&gt;&lt;h2&gt;El genio salzburgués&lt;/h2&gt;&lt;/hgroup&gt;</code> crea el esquema <code>1. Mozart</code>).</li>
+ <li>En HTML4, cada sección es parte del esquema del documento. Pero los documentos no son lineales a veces. Un documento puede tener secciones especiales conteniendo información que no es parte del flujo principal, aunque esté relacionado a él, como un bloque de publicidad o una caja de explicación. HTML5 introduce el elemento {{HTMLElement("aside")}} permitiendo a dichas secciones no ser parte del esquema principal.</li>
+ <li>Otra vez, en HTML4, debido a que cada sección es parte del esquema del documento, no hay forma de tener una sección conteniendo información relacionada no al documento pero sí al sitio entero, como logos, menús, tablas de contenidos, o información de derechos de autor y notas legales. Para ese propósito, HTML5 introduce tres elementos de sección específicos: {{HTMLElement("nav")}} para colecciones de enlaces, como una tabla de contenidos, {{HTMLElement("footer")}} y {{HTMLElement("header")}} información relacionada con el sitio.</li>
+</ol>
+
+<p>De manera más general, HTML5 trae precisión a las características de seccionado y cabecera, permitiendo a los esquemas de documento ser predecibles y usados por el navegador para mejorar la experiencia del usuario.</p>
+
+<h2 id="El_algoritmo_de_esquematizado_de_HTML5">El algoritmo de esquematizado de HTML5</h2>
+
+<h3 id="Definiendo_secciones_en_HTML5">Definiendo secciones en HTML5</h3>
+
+<p>Todo el contenido incluido dentro del elemento {{HTMLElement("body")}} es parte de una sección. Las secciones en HTML5 pueden ser anidadas. Además de la sección principal, definida por el elemento {{HTMLElement("body")}}, los límites de la sección son definidos explícita o implícitamente. La secciones definidas explícitamente son el contenido definido en las etiquetas {{HTMLElement("body")}},  {{HTMLElement("section")}},  {{HTMLElement("article")}},  {{HTMLElement("aside")}}, {{HTMLElement("footer")}},  {{HTMLElement("header")}}, y {{HTMLElement("nav")}}.</p>
+
+<div class="note"><strong>Nota: </strong>Cada sección puede tener su propia jerarquía de cabeceras. Por lo tanto, incluso una sección anidada puede tener un elemento {{HTMLElement("h1")}}. Consulte también <a href="/en-US/docs/Sections_and_Outlines_of_an_HTML5_document#Defining_Headings_in_HTML5" title="en-US/docs/Sections_and_Outlines_of_an_HTML5_document#Defining_Headings_in_HTML5">Definiendo cabeceras en HTML5</a>.</div>
+
+<p>Ejemplo:</p>
+
+<pre class="brush:xml">&lt;section&gt;
+  &lt;h1&gt;El pato&lt;/h1&gt;
+  &lt;section&gt;
+    &lt;h1&gt;Introducción&lt;/h1&gt;
+    &lt;p&gt;En esta sección, ampliaremos nuestro concepto del pato.
+  &lt;/section&gt;
+  &lt;section&gt;
+    &lt;h1&gt;Hábitat&lt;/h1&gt;
+    &lt;p&gt;El pato, como fiero depredador, necesita un entorno con abundantes lobos que cazar.
+  &lt;/section&gt;
+  &lt;aside&gt;
+    &lt;p&gt;otros estudiosos del pato
+  &lt;/aside&gt;
+&lt;/section&gt;
+&lt;footer&gt;
+  &lt;p&gt;(c) 2010 The Example company
+&lt;/footer&gt;</pre>
+
+<p>El bloque de HTML define dos secciones de alto nivel:</p>
+
+<pre><span style="color: red;">&lt;section&gt;
+  &lt;h1&gt;El pato&lt;/h1&gt;
+  &lt;section&gt;
+    &lt;h1&gt;Introducción&lt;/h1&gt;
+    &lt;p&gt;En esta sección, ampliaremos nuestro concepto del pato.
+  &lt;/section&gt;
+  &lt;section&gt;
+    &lt;h1&gt;Hábitat&lt;/h1&gt;
+    &lt;p&gt;El pato, como fiero depredador, necesita un entorno con abundantes lobos que cazar.
+  &lt;/section&gt;
+   &lt;aside&gt;
+    &lt;p&gt;otros estudiosos del pato
+  &lt;/aside&gt;
+&lt;/section&gt;</span>
+
+<span style="color: green;">&lt;footer&gt;
+  &lt;p&gt;(c) 2010 The Example company
+&lt;/footer&gt;</span></pre>
+
+<p>La primera sección tiene tres subsecciones:</p>
+
+<pre>&lt;section&gt;
+  &lt;h1&gt;El pato&lt;/h1&gt;
+
+  <span style="color: red;">&lt;section&gt;
+    &lt;h1&gt;Introducción&lt;/h1&gt;
+    &lt;p&gt;En esta sección, ampliaremos nuestro concepto del pato.
+  &lt;/section&gt;</span>
+
+  <span style="color: green;">&lt;section&gt;
+    &lt;h1&gt;Hábitat&lt;/h1&gt;
+    &lt;p&gt;El pato, como fiero depredador, necesita un entorno con abundantes lobos que cazar.
+  &lt;/section&gt;</span>
+
+  <span style="color: blue;">&lt;aside&gt;
+    &lt;p&gt;Otros estudiosos del lobo
+  &lt;/aside&gt;</span>
+&lt;/section&gt;
+
+&lt;footer&gt;
+  &lt;p&gt;(c) 2010 The Example company
+&lt;/footer&gt;</pre>
+
+<p>Esto genera la siguiente estructura:</p>
+
+<pre>1. El pato
+   1.1 Introducción
+   1.2 Hábitat
+   1.3 Section (aside)
+</pre>
+
+<h3 id="Definiendo_cabeceras_en_HTML5">Definiendo cabeceras en HTML5</h3>
+
+<p>Mientras que los elementos de seccionado en HTML definen la estructura de un documento, un esquema también necesita cabeceras para ser útil. La regla básica es simple: el primer elemento de cabecera HTML (uno de los {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}) define la cabecera de la sección actual.</p>
+
+<p>Los elementos de cabecera tienen un <em>rango</em> dado por el número del nombre del elemento, donde {{HTMLElement("h1")}} tiene el rango <em>más alto</em>, y {{HTMLElement("h6")}} tiene el rango <em>más bajo</em>. Los rangos relativos importan sólo en una sección; el esquema es determinado por las secciones, no por el rango de cabeceras de las secciones. Por ejemplo, este código:</p>
+
+<pre class="brush:xml">&lt;section&gt;
+  &lt;h1&gt;La mosca&lt;/h1&gt;
+  &lt;p&gt;El esta sección hablaremos de la mosca, una criatura adorable.
+    ... bla, bla, bla ...
+  &lt;section&gt;
+    &lt;h2&gt;Hábitat&lt;/h2&gt;
+    &lt;p&gt;Únicamente se han divisado colonias de moscas en los montes de....
+        ...bla, bla, bla ...
+  &lt;/section&gt;
+&lt;/section&gt;
+&lt;section&gt;
+  &lt;h3&gt;El mosquito&lt;/h3&gt;
+  &lt;p&gt;A continuación, otra rareza a punto de extinguirse, el mosquito.
+     ...bla, bla, bla...
+&lt;/section&gt;</pre>
+
+<p>Genera el siguiente esquema:</p>
+
+<pre>1. La mosca
+   1.1 Hábitat
+2. El mosquito</pre>
+
+<p>Nótese que el rango del elemento de cabecera (en el ejemplo, {{HTMLElement("h1")}} para la primera sección de más alto nivel, {{HTMLElement("h2")}} para la subsección y {{HTMLElement("h3")}} para la segunda sección de alto nivel) no es importante. (Cualquier rango puede ser usado como la cabecera de una sección explícitamente definida, aunque esta práctica no es recomendada).</p>
+
+<h3 id="Seccionado_implícito">Seccionado implícito</h3>
+
+<p>Debido a que los elementos de seccionado HTML5 no son obligatorios para definir un esquema, para mantener la compatibilidad con la web existente dominada por HTML4, hay una forma de definir secciones sin ellas. Esto es llamado <em>seccionado implícito</em>.</p>
+
+<p>Los elementos de cabecera ({{HTMLElement("h1")}} a {{HTMLElement("h6")}}) definen un nuevo seccionado implícito cuando ellos no son el primer encabezado de sus secciones padre. La forma en que esta sección implícita es posicionada en el esquema es definida por su rango relativo con la cabecera anterior en su sección padre. Si es de un rango más bajo que la cabecera anterior, abre una sub-sección implícita de la sección. Este código:</p>
+
+<pre class="brush:xml">&lt;section&gt;
+  &lt;h1&gt;El águila&lt;/h1&gt;
+  &lt;p&gt; ....
+
+  &lt;h3 class="subsec-implicita"&gt;Hábitat&lt;/h3&gt;
+  &lt;p&gt; ...
+&lt;/section&gt;</pre>
+
+<p>Genera el siguiente esquema:</p>
+
+<pre><strong>1. El águila</strong>
+   <strong>1.1 Hábitat</strong> <em>(impícitamente definido mediante &lt;h3&gt;)</em>
+</pre>
+
+<p>Si es del mismo rango que la cabecera anterior, cierra la sección previa  (¡que puede haber sido explícita!) y abre una nueva sección implícita del mismo nivel: </p>
+
+<pre class="brush:xml">&lt;section&gt;
+  &lt;h1&gt;El águila&lt;/h1&gt;
+  &lt;p&gt;...
+  &lt;h1 class="secc-implicita"&gt;El buitre&lt;/h1&gt;
+  &lt;p&gt;...
+&lt;/section&gt;</pre>
+
+<p>genera el siguiente esquema: </p>
+
+<pre><strong>1. El águila</strong>
+<strong>2. El buitre</strong> <em>(implícitamente definido por &lt;h1&gt;, quien al mismo tiempo cierra el &lt;h1&gt; anterior)</em>
+</pre>
+
+<p>Si es de un rango más alto que el encabezamiento anterior, cierra la sección anterior y abre una nueva sección implícita al más alto nivel:</p>
+
+<pre class="brush:xml">&lt;body&gt;
+  &lt;h1&gt;Colores&lt;/h1&gt;
+  &lt;h2&gt;Rojo&lt;/h2&gt;
+  &lt;p&gt; ...
+  &lt;section&gt;
+    &lt;h3&gt;Amarillo&lt;/h3&gt;
+    &lt;p&gt; ...
+    &lt;h3&gt;Verde&lt;/h3&gt;
+      &lt;p&gt; ...
+    &lt;h2&gt;Sabores&lt;/h2&gt;
+      &lt;p&gt;...
+  &lt;/section&gt;
+&lt;/body&gt;</pre>
+
+<p>generando el siguiente esquema:</p>
+
+<pre><strong>1. Colores
+   1.1 Rojo</strong> <em>(implícitamente con <code>&lt;h2&gt;</code> )</em>
+   <strong>1.2 Amarillo</strong><em>(explícitamente con <code>&lt;section&gt; </code>)</em>
+   <strong>1.3 Verde</strong> <em>(impícitamente con <code>&lt;h3&gt;</code>, cerrando el <code>&lt;h3&gt;</code> previo)</em>
+<strong>2. Sabores</strong> <em>(implícitamente con &lt;h2&gt;, cerrando el &lt;section&gt; previo)</em>
+</pre>
+
+<p>Éste no es el esquema que uno podría observando las etiquetas de encabezamiento. Para hacer que tu marcado sea entendible para una persona que eche un vistazo rápido al código, es una buena práctica</p>
+
+<ul>
+ <li>Usar <strong>etiquetas explícitas</strong> para abrir y cerrar secciones.</li>
+ <li> Acomodar el rango de cabecera al nivel de anidamiento de la sección deseada. </li>
+</ul>
+
+<p>Sin embargo, esto no es requerido por la especificación HTML5. Si encuentra que los navegadores están generando el esquema de su documento en formas inesperadas, verifique si tiene secciones que están cerradas implícitamente por elementos de cabecera.</p>
+
+<p>Una <strong>excepción</strong> a la regla de que ese rango de cabecera debe corresponderse con el nivel de anidamiento de sección es para secciones que pueden ser <strong>reutilizadas</strong> en múltiples documentos. Por ejemplo, una sección puede ser almacenada en un sistema de gestión de contenidos y ensamblada en documentos en tiempo de ejecución. En este caso, una buena práctica es comenzar en {{HTMLElement("h1")}} para el nivel de cabecera más alto de la sección reusable. El nivel anidado de la sección reusable será determinado por la jerarquía de la sección del documento en el que aparece. Las etiquetas de secciones aún son útiles en este caso.</p>
+
+<h3 id="Sobreescribiendo_seccionamiento_implícito">Sobreescribiendo seccionamiento implícito</h3>
+
+<p>A veces una sección necesita tener varios encabezamientos. Unos pocos casos usuales son:</p>
+
+<ul>
+ <li>Una sección cuyo encabezado principal es acompañado de otro encabezado , cuyo propósito es adornar o aportar cierta información al encabezado principal, pero sin oscurecerlo a la hora de formar el esquema estructural:
+  <pre class="brush:xml">&lt;section&gt;
+  &lt;h1&gt;La flauta mágica&lt;/h1&gt;
+  &lt;h2&gt;Ópera en dos actos del genio salzburgués&lt;/h2&gt;
+&lt;/section&gt;</pre>
+
+  <p>genera el siguiente esquema, que claramene <strong>no</strong> es el que se desea:</p>
+
+  <pre>1. La flauta mágica
+   1.1 Ópera en dos actos del genio salzburgués
+</pre>
+ </li>
+ <li>El encabezado secundario puede ser usado por una lista de etiquetas:
+  <pre class="brush:xml">&lt;section&gt;
+  &lt;h1&gt;Secciones y esquema del documento&lt;/h1&gt;
+  &lt;h2&gt;HTML, HTML5, secciones, esquema&lt;/h2&gt;
+&lt;/section&gt;</pre>
+
+  <p>genera el siguiente esquema, que <strong>tampoco es</strong> el que se desea:</p>
+
+  <pre>1. Secciones y esquema del documento
+   1.1 HTML, HTML5, secciones, esquema</pre>
+ </li>
+</ul>
+
+<p>Debido al seccionado implícito, <strong>esto no es posible sin la ayuda del elemento de agrupamiento de cabeceras</strong> ({{HTMLElement("hgroup")}} introducido en HTML5). Esto oculta todas las cabeceras del grupo, excepto la primera, permitiendo una sobreescritura del seccionado implícito. Observa las diferencias:</p>
+
+<pre class="brush:xml">&lt;section&gt;
+  &lt;hgroup&gt;
+    &lt;h1&gt;La flauta mágica&lt;/h1&gt;
+    &lt;h2&gt;Ópera en dos actos del genio salzburgués&lt;/h2&gt;
+  &lt;/hgroup&gt;
+  ... algún contenido ...
+&lt;/section&gt;
+</pre>
+
+<p>genera el siguiente esquema, que es el que se desea:</p>
+
+<pre>1. La flauta mágica</pre>
+
+<h3 id="Secciones_desacopladas"><a name="sectioning_root">Secciones desacopladas</a></h3>
+
+<p>Piensa por un momento en una sección <strong><em>A</em></strong> que contiene una subsección <strong><em>B</em></strong>. A veces es conveniente que <em><strong>B</strong></em> mantenga su esquema interno ( subsecciones, encabezados, etc. ), pero que no "ensucie" el esquema de<em><strong> A</strong></em>, dando lugar a esquemas más claros.</p>
+
+<p>Existen elementos, cuyo propósito habitual es introducir contenido externo a la página: {{HTMLElement("blockquote")}}, {{HTMLElement("details")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}} y {{HTMLElement("td")}}.<br>
+  Estos elementos no se "montan" sobre el esquema global, sin importar su contenido, lo que conlleva un desacoplo o aislamiento entre las partes.</p>
+
+<p>Además, el elemento de partida para formar el esquema del documento es  {{HTMLElement("body")}}, el cual por ser la raíz,  se encuentra ya desacoplada de forma natural, en el sentido de que no se puede ir más arriba en el contexto.</p>
+
+<p>Ejemplo:</p>
+
+<pre class="brush: html">&lt;section&gt;
+  &lt;h1&gt;Bach&lt;/h1&gt;
+  &lt;section&gt;
+    &lt;h2&gt;Introducción&lt;/h2&gt;
+    &lt;p&gt;...
+  &lt;/section&gt;
+  &lt;section&gt;
+    &lt;h2&gt;La Pasión según S. Mateo&lt;/h2&gt;
+    &lt;p&gt; Bla, bla, bla ...
+    &lt;blockquote&gt;
+       &lt;h1&gt;Friedich Nietzsche
+       &lt;p&gt;“Esa semana he ido a escuchar tres veces la Pasión según san Mateo del divino Bach, y en cada una de ellas con el mismo sentimiento de máxima admiración. Una persona que -como yo- ha olvidado completamente el cristianismo no puede evitar oírla como si se tratase de uno de los evangelios”
+    &lt;/blockquote&gt;
+  &lt;/section&gt;
+&lt;/section&gt;</pre>
+
+<p>Este ejemplo resulta en el siguiente esquema:</p>
+
+<pre>1. Bach
+   1.1 Introducción
+   1.2 La Pasión según s. Mateo</pre>
+
+<p>Este esquema no contiene el esquema interno del elemento {{HTMLElement("blockquote")}} que, debido a la propia naturaleza del elemento, se desacopla. Observa bien que el elemento  {{HTMLElement("blockquote")}} , a pesar de todo, contiene un esquema propio bien estructurado.</p>
+
+<h3 id="Secciones_fuera_del_esquema">Secciones fuera del esquema</h3>
+
+<p>HTML5 introduce cuatro nuevos elementos que permiten definir secciones que no pertenecen al esquema principal de un documento web:</p>
+
+<ol>
+ <li>El elemento sección lateral HTML ({{HTMLElement("aside")}}) define una sección que, aunque relacionada al elemento principal, no pertenece al flujo principal,  como una caja de explicación o un anuncio. Tiene su propio esquema, pero no pertenece al esquema principal.</li>
+ <li>El elemento sección de navegación ({{HTMLElement("nav")}}) define una sección que contiene enlaces de navegación. Pueden ser muchas en un documento, por ejemplo, uno con enlaces internos a la página, como una tabla de contenidos, y otro con enlaces navegacionales. Estos enlaces no son parte del flujo principal y esquema y pueden ser inicialmente no generadas por lectores de pantalla y tecnología de apoyo similar.</li>
+ <li>El elemento de sección de cabecera ({{HTMLElement("header")}}) define una cabecera de página, típicamente conteniendo el logo y nombre del sitio y posiblemente un menú horizontal. A pesar de su nombre, no está posicionado necesariamente al principio de la página.</li>
+ <li>El elemento HTML de pie de página ({{HTMLElement("footer")}}) define un pie de página, típicamente conteniendo el derecho de autor y notas legales y a veces algunos enlaces. A pesar de su nombre, no es necesario que esté posicionado al final de la página.</li>
+</ol>
+
+<h2 id="Direcciones_y_tiempo_de_publicación_en_elementos_de_seccionado">Direcciones y tiempo de publicación en elementos de seccionado</h2>
+
+<p>El autor de un documento a veces quiere publicar alguna información de contacto, como el nombre del autor y su dirección. HTML4 permite eso vía el elemento {{HTMLElement("address")}}, que ha sido extendido en HTML5.</p>
+
+<p>Un documento puede ser hecho de diferentes secciones de diferentes autores. Una sección de otro autor diferente al autor de la página principal es definido usando el elemento {{HTMLElement("article")}}. Consecuentemente, el elemento {{HTMLElement("address")}} está ahora enlazado al ancestro más cercano, {{HTMLElement("body")}} o {{HTMLElement("article")}}.</p>
+
+<p>De manera similar, el elemento HTML5 {{HTMLElement("time")}}, con su atributo booleano establecido {{htmlattrxref("pubdate", "time")}}, representa la fecha de publicación asociada a todo el documento, respectivamente al artículo, relacionado a su ancestro más cercano {{HTMLElement("body")}} o {{HTMLElement("article")}}.</p>
+
+<h2 id="Usando_elementos_HTML5_en_navegadores_no_HTML5">Usando elementos HTML5 en navegadores no HTML5</h2>
+
+<p>Los elementos de sección y cabecera deben funcionar en la mayoría de navegadores no HTML5. Aunque no estén soportados, no necesitan una interfaz DOM especial y sólo necesitan la aplicación de CSS específico como a los elementos no conocidos se les aplica estilos como <code>display:inline</code> por defecto:</p>
+
+<pre class="brush: css">section, article, aside, footer, header, nav, hgroup {
+  display:block;
+}
+</pre>
+
+<p>Obviamente el desarrollador web puede aplicar estilos sobre ellos de forma diferente, pero mantener en mente que en un navegador no HTML5 la aplicación de estilos por defecto es diferente para lo que es esperado para esos elementos. También se debe notar que el elemento {{HTMLElement("time")}} no ha sido incluido, debido a que la aplicación de estilos por defecto de él en un navegador no HTML5 es el mismo que el estilo en un navegador compatible con HTML5.<br>
+ <br>
+ Este método tiene sin embargo sus limitaciones, así como algunos navegadores no permiten la aplicación de estilos en elementos no soportados. Este es el caso de Internet Explorer (version 8 e inferior), que necesita un script específico para permitirlo:</p>
+
+<pre class="brush:xml">&lt;!--[if lt IE 9]&gt;
+  &lt;script&gt;
+    document.createElement("header" );
+    document.createElement("footer" );
+    document.createElement("section");
+    document.createElement("aside"  );
+    document.createElement("nav"    );
+    document.createElement("article");
+    document.createElement("hgroup" );
+    document.createElement("time"   );
+  &lt;/script&gt;
+&lt;![endif]--&gt;</pre>
+
+<p>Esta sección significa que, en el caso de Internet Explorer (8 e inferior), el scripting debe estar habilitado para mostrar seccionamiento en HTML5 y elementos de cabecera apropiadamente. Si no, estas no serán mostradas, lo que puede ser problemático dado que estos elementos probablemente definen la estructura de toda la página. Esto es el porqué de un elemento {{HTMLElement("noscript")}} explícito debe ser añadido para este caso.</p>
+
+<pre class="brush:xml">&lt;noscript&gt;
+   &lt;strong&gt;Warning !&lt;/strong&gt;
+   Because your browser does not support HTML5, some elements are simulated using JScript.
+   Unfortunately your browser has disabled scripting. Please enable it in order to display this page.
+&lt;/noscript&gt;</pre>
+
+<p>Esto nos lleva al siguiente código para permitir el soporte de las secciones y elementos de cabecera en navegadores no HTML5, incluso para Internet Explorer (8 e inferiores), con una apropiada compatibilidad hacia atrás donde este último navegador es configurado para no usar scripting:</p>
+
+<pre class="brush:xml">&lt;!--[if lt IE 9]&gt;
+  &lt;script&gt;
+    document.createElement("header" );
+    document.createElement("footer" );
+    document.createElement("section");
+    document.createElement("aside"  );
+    document.createElement("nav"    );
+    document.createElement("article");
+    document.createElement("hgroup" );
+    document.createElement("time"   );
+  &lt;/script&gt;
+  &lt;noscript&gt;
+     &lt;strong&gt;Warning !&lt;/strong&gt;
+     Because your browser does not support HTML5, some elements are simulated using JScript.
+     Unfortunately your browser has disabled scripting. Please enable it in order to display this page.
+  &lt;/noscript&gt;
+&lt;![endif]--&gt;</pre>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>Los nuevos elementos semánticos introducidos en HTML5 suponen la posibilidad de describir la estructura y el esquema de un documento web de una manera estándar. Representan una gran ventaja para las personas que utilizan navegadores HTML5 y necesitan la estructura para ayudarles a utilizar la página, por ejemplo las personas que necesitan la ayuda de una tecnología de apoyo. Estos nuevos elementos semánticos son fáciles de usar y con muy poco esfuerzo pueden funcionar también en navegadores no HTML5. Por lo tanto deben ser usados sin restricciones.</p>
+
+<div>{{HTML5ArticleTOC()}}</div>
diff --git a/files/es/web/guide/mobile/index.html b/files/es/web/guide/mobile/index.html
new file mode 100644
index 0000000000..d1fda97e82
--- /dev/null
+++ b/files/es/web/guide/mobile/index.html
@@ -0,0 +1,76 @@
+---
+title: Desarrollo Web Móvil
+slug: Web/Guide/Mobile
+tags:
+  - Intermedio
+  - NecesitaEjemplo
+translation_of: Web/Guide/Mobile
+original_slug: Web/Guide/Movil
+---
+<p>Esta página proporciona una visión general de algunas de las principales técnicas necesarias para diseñar sitios web que funcionen bien en dispositivos móviles. Si está buscando información sobre el proyecto Firefox OS de Mozilla, consulte la página de <a href="/en/Mozilla/Firefox_OS" title="Boot to Gecko">Firefox OS</a>. O podría estar interesado en detalles sobre <a href="/en/Mozilla/Firefox_for_Android" title="Firefox for Android">Firefox para Android</a>.</p>
+
+<p>Hemos organizado esta documentación en dos secciones, <a href="#DisenandoParaDispositivosMoviles">diseñando para dispositivos móviles</a> y <a href="#DesarrolloParaDiferentesNavegadores">desarrollo para diferentes navegadores</a>. Vea también la guía a la <a href="/en-US/docs/Web_Development/Mobile/Mobile-friendliness" title="/en-US/docs/Web_Development/Mobile/Mobile-friendliness">amigabilidad móvil</a> para desarrolladores web de Jason Grlicky.</p>
+
+<h2 id="Diseñando_para_dispositivos_móviles"><a id="DisenandoParaDispositivosMoviles" name="DisenandoParaDispositivosMoviles"></a>Diseñando para dispositivos móviles</h2>
+
+<p>Los dispositivos móviles tienen características de hardware bastante diferentes comparados con los ordenadores de escritorio/sobremesa o portátiles. Obviamente sus pantallas son usualmente más pequeñas, pero además habitualmente también cambian automáticamente su orientación, entre retrato o paisaje, según el usuario rota el dispositivo. Por lo general tienen pantallas táctiles para la entrada de datos por parte del usuario. APIs como la geolocalización o la orientación, o bien no son soportadas en ordenadores de escritorio o son mucho menos útiles, y estas APIs ofrecen a los usuarios móviles nuevas formas de interactuar con su sitio web.</p>
+
+<h3 id="Trabajando_con_pantallas_pequeñas">Trabajando con pantallas pequeñas</h3>
+
+<p><a href="https://developer.mozilla.org/es/docs/Desarrollo_Web/Web_adaptable" title="en/Web_Development/Responsive_Web_design">Diseño web adaptable</a> es un término para un conjunto de técnicas que permiten a su sitio web adaptar su diseño según el entorno de visualización — lo más evidente, el tamaño y orientación de la pantalla — cambie. Incluye técnicas como:</p>
+
+<ul>
+ <li>diseño CSS fluido, para hacer que la página se adapte sin problemas según cambie el tamaño de la ventana del navegador y</li>
+ <li>el uso de <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries" title="en/CSS/Media_queries">media queries</a> para incluir condicionalmente reglas CSS adecuadas para el <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#width" title="en/CSS/Media_queries#width">ancho</a> y <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#height" title="en/CSS/Media_queries#height">alto</a> de la pantalla.</li>
+</ul>
+
+<p>La <a href="https://developer.mozilla.org/es/docs/M%C3%B3vil/Viewport_meta_tag" title="en/Mobile/Viewport_meta_tag">etiqueta meta viewport</a> ordena al navegador que muestre su sitio web a la escala adecuada para el dispositivo del usuario.</p>
+
+<h3 id="Trabajando_con_pantallas_táctiles">Trabajando con pantallas táctiles</h3>
+
+<p>Para usar una pantalla táctil necesitará trabajar con eventos <a href="https://developer.mozilla.org/es/docs/DOM/Touch_events" title="en/DOM/Touch_events">DOM Touch</a>. No tendrá la posibilidad de usar la pseudo-clase <a href="https://developer.mozilla.org/es/docs/Web/CSS/%3Ahover" title="En/CSS/:hover">CSS :hover</a> y tendrá que diseñar elementos interactivos como botones para respetar el hecho de que los dedos son más gordos que el puntero del ratón. Vea este artículo sobre <a class="external" href="http://www.whatcreative.co.uk/blog/tips/designing-for-touch-screen/">diseñar para pantallas táctiles</a>.</p>
+
+<p>Puede usar el <em>media query</em> <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#-moz-touch-enabled" title="en/CSS/Media_queries#-moz-touch-enabled">-moz-touch-enabled</a> para cargar una CSS diferente en un dispositivo con pantalla táctil.</p>
+
+<h3 id="Optimizando_imágenes">Optimizando imágenes</h3>
+
+<p>Para ayudar a los usuarios cuyos dispositivos tienen un bajo o caro ancho de banda, puede optimizar las imágenes cargando sólo aquellas apropiadas para el tamaño y resolución del dispositivo. Es algo que se hace en la CSS consultando la <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#height" title="en/CSS/Media_queries#height">altura</a> de pantalla, <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#width" title="en/CSS/Media_queries#width">anchura</a> y <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#-moz-device-pixel-ratio" title="en/CSS/Media_queries#-moz-device-pixel-ratio">proporción de píxeles</a>.</p>
+
+<p>También puede hacer uso de propiedades CSS para implementar efectos visuales como <a href="https://developer.mozilla.org/es/docs/CSS/Using_CSS_gradients" title="en/CSS/Using_CSS_gradients">gradientes</a> y <a href="https://developer.mozilla.org/es/docs/Web/CSS/box-shadow" title="En/CSS/Box-shadow">sombras</a> sin utilizar imágenes para ello.</p>
+
+<h3 id="APIs_móviles">APIs móviles</h3>
+
+<p>Finalmente, puede aprovechar las nuevas posibilidades ofrecidas por los dispositivos móviles, como la <a href="https://developer.mozilla.org/es/docs/Web/API/Detecting_device_orientation" title="en/Detecting_device_orientation">orientación</a> y la <a href="https://developer.mozilla.org/es/docs/WebAPI/Using_geolocation" title="En/Using_geolocation">geolocalización</a>.</p>
+
+<h2 id="Desarrollo_para_diferentes_navegadores"><a id="DesarrolloParaDiferentesNavegadores" name="DesarrolloParaDiferentesNavegadores"></a>Desarrollo para diferentes navegadores</h2>
+
+<h3 id="Escribir_código_para_diferentes_navegadores_(cross-browser)">Escribir código para diferentes navegadores (<em>cross-browser</em>)</h3>
+
+<p>Para crear sitios web que funcionen aceptablemente en diferentes navegadores móviles:</p>
+
+<ul>
+ <li>Intente evitar características específicas de un navegador, como las propiedades CSS prefijadas por el proveedor (<em>vendor-prefixed</em>).</li>
+ <li>Si necesita utilizar estas características, compruebe si otros navegadores implementan sus propias versiones e inclúyalas igualmente.</li>
+ <li>Para navegadores que no soportan estas características, ofrezca una alternativa aceptable.</li>
+</ul>
+
+<p>Por ejemplo, si establece un gradiente como fondo para cierto texto usando una propiedad prefijada por el proveedor (<em>vendor-prefixed</em>) como <code>-webkit-linear-gradient</code>, es mejor incluir las otras versiones prefijadas de la propiedad <a href="https://developer.mozilla.org/es/docs/Web/CSS/linear-gradient" title="en/CSS/linear-gradient">linear-gradient</a> (gradiente linear). Si no lo hace, asegúrese al menos de que el fondo por defecto contrasta con el texto. Así, la página será al menos usable en un navegador al que no esté dirigida su regla <code>linear-gradient</code>.</p>
+
+<p>Vea esta <a href="https://developer.mozilla.org/es/docs/Web/CSS/Referencia_CSS/Extensiones_CSS_Mozilla" title="en/CSS/CSS_Reference/Mozilla_Extensions">lista de propiedades específicas para Gecko</a>, esta lista de <a href="/en/CSS/CSS_Reference/Webkit_Extensions" title="en/CSS/CSS_Reference/Webkit_Extensions">propiedades específicas para WebKit</a> y la <a class="external" href="http://peter.sh/experiments/vendor-prefixed-css-property-overview/">tabla de propiedades específicas de proveedores (<em>vendor-specific</em>)</a> de Peter Beverloo.</p>
+
+<p>Usar herramientas como <a class="external" href="http://csslint.net/">CSS Lint</a> puede ayudar a encontrar problemas como este en el código y preprocesadores como <a class="external" href="http://sass-lang.com/">SASS</a> y <a class="external" href="http://lesscss.org/">LESS</a> pueden ser de ayuda para crear código compatible con diferentes navegadores.</p>
+
+<h3 id="Precaución_al_husmear_el_agente_de_usuario_(user_agent)">Precaución al husmear el agente de usuario (<em>user agent</em>)</h3>
+
+<p>Es preferible para los sitios web usar las técnicas enumeradas anteriormente con el objetivo de detectar características específicas del dispositivo, como el tamaño de pantalla y las pantallas táctiles, y adaptarse a ellas adecuadamente. Pero a veces esto no es práctico y los sitios web recurren a analizar la cadena de agente de usuario del navegador (<em>user agent</em>) para intentar distinguir entre ordenadores de escritorio, tabletas y teléfonos, y servir diferente contenido a cada tipo de dispositivo.</p>
+
+<p>Si hace esto, asegúrese de que su algoritmo es correcto y no está sirviendo el tipo equivocado de contenido a un dispositivo porque no entiende la cadena de un agente de usuario particular. Vea esta <a href="/en/Browser_detection_using_the_user_agent#Mobile.2C_Tablet_or_Desktop" title="browser detection using the user agent">guía para usar la cadena de agente de usuario para determinar el tipo de dispositivo</a>.</p>
+
+<h3 id="Probar_en_múltiples_navegadores">Probar en múltiples navegadores</h3>
+
+<p>Compruebe su sitio web en múltiples navegadores. Esto significa probarlo en múltiples plataformas — al menos iOS y Android.</p>
+
+<ul>
+ <li>Pruebe Safari móvil en iPhone usando el <a class="link-https" href="https://developer.apple.com/devcenter/ios/index.action">simulador iOS</a>.</li>
+ <li>Pruebe Opera y Firefox utilizando el <a class="link-https" href="https://developer.android.com/sdk/index.html">Android SDK</a>. Vea estas instrucciones adicionales para <a class="link-https" href="https://wiki.mozilla.org/Mobile/Fennec/Android/Emulator">ejecutar Firefox para Android usando el emulador de Android</a>.</li>
+</ul>
diff --git a/files/es/web/guide/movil/index.html b/files/es/web/guide/movil/index.html
deleted file mode 100644
index 684d3df672..0000000000
--- a/files/es/web/guide/movil/index.html
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: Desarrollo Web Móvil
-slug: Web/Guide/Movil
-tags:
-  - Intermedio
-  - NecesitaEjemplo
-translation_of: Web/Guide/Mobile
----
-<p>Esta página proporciona una visión general de algunas de las principales técnicas necesarias para diseñar sitios web que funcionen bien en dispositivos móviles. Si está buscando información sobre el proyecto Firefox OS de Mozilla, consulte la página de <a href="/en/Mozilla/Firefox_OS" title="Boot to Gecko">Firefox OS</a>. O podría estar interesado en detalles sobre <a href="/en/Mozilla/Firefox_for_Android" title="Firefox for Android">Firefox para Android</a>.</p>
-
-<p>Hemos organizado esta documentación en dos secciones, <a href="#DisenandoParaDispositivosMoviles">diseñando para dispositivos móviles</a> y <a href="#DesarrolloParaDiferentesNavegadores">desarrollo para diferentes navegadores</a>. Vea también la guía a la <a href="/en-US/docs/Web_Development/Mobile/Mobile-friendliness" title="/en-US/docs/Web_Development/Mobile/Mobile-friendliness">amigabilidad móvil</a> para desarrolladores web de Jason Grlicky.</p>
-
-<h2 id="Diseñando_para_dispositivos_móviles"><a id="DisenandoParaDispositivosMoviles" name="DisenandoParaDispositivosMoviles"></a>Diseñando para dispositivos móviles</h2>
-
-<p>Los dispositivos móviles tienen características de hardware bastante diferentes comparados con los ordenadores de escritorio/sobremesa o portátiles. Obviamente sus pantallas son usualmente más pequeñas, pero además habitualmente también cambian automáticamente su orientación, entre retrato o paisaje, según el usuario rota el dispositivo. Por lo general tienen pantallas táctiles para la entrada de datos por parte del usuario. APIs como la geolocalización o la orientación, o bien no son soportadas en ordenadores de escritorio o son mucho menos útiles, y estas APIs ofrecen a los usuarios móviles nuevas formas de interactuar con su sitio web.</p>
-
-<h3 id="Trabajando_con_pantallas_pequeñas">Trabajando con pantallas pequeñas</h3>
-
-<p><a href="https://developer.mozilla.org/es/docs/Desarrollo_Web/Web_adaptable" title="en/Web_Development/Responsive_Web_design">Diseño web adaptable</a> es un término para un conjunto de técnicas que permiten a su sitio web adaptar su diseño según el entorno de visualización — lo más evidente, el tamaño y orientación de la pantalla — cambie. Incluye técnicas como:</p>
-
-<ul>
- <li>diseño CSS fluido, para hacer que la página se adapte sin problemas según cambie el tamaño de la ventana del navegador y</li>
- <li>el uso de <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries" title="en/CSS/Media_queries">media queries</a> para incluir condicionalmente reglas CSS adecuadas para el <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#width" title="en/CSS/Media_queries#width">ancho</a> y <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#height" title="en/CSS/Media_queries#height">alto</a> de la pantalla.</li>
-</ul>
-
-<p>La <a href="https://developer.mozilla.org/es/docs/M%C3%B3vil/Viewport_meta_tag" title="en/Mobile/Viewport_meta_tag">etiqueta meta viewport</a> ordena al navegador que muestre su sitio web a la escala adecuada para el dispositivo del usuario.</p>
-
-<h3 id="Trabajando_con_pantallas_táctiles">Trabajando con pantallas táctiles</h3>
-
-<p>Para usar una pantalla táctil necesitará trabajar con eventos <a href="https://developer.mozilla.org/es/docs/DOM/Touch_events" title="en/DOM/Touch_events">DOM Touch</a>. No tendrá la posibilidad de usar la pseudo-clase <a href="https://developer.mozilla.org/es/docs/Web/CSS/%3Ahover" title="En/CSS/:hover">CSS :hover</a> y tendrá que diseñar elementos interactivos como botones para respetar el hecho de que los dedos son más gordos que el puntero del ratón. Vea este artículo sobre <a class="external" href="http://www.whatcreative.co.uk/blog/tips/designing-for-touch-screen/">diseñar para pantallas táctiles</a>.</p>
-
-<p>Puede usar el <em>media query</em> <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#-moz-touch-enabled" title="en/CSS/Media_queries#-moz-touch-enabled">-moz-touch-enabled</a> para cargar una CSS diferente en un dispositivo con pantalla táctil.</p>
-
-<h3 id="Optimizando_imágenes">Optimizando imágenes</h3>
-
-<p>Para ayudar a los usuarios cuyos dispositivos tienen un bajo o caro ancho de banda, puede optimizar las imágenes cargando sólo aquellas apropiadas para el tamaño y resolución del dispositivo. Es algo que se hace en la CSS consultando la <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#height" title="en/CSS/Media_queries#height">altura</a> de pantalla, <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#width" title="en/CSS/Media_queries#width">anchura</a> y <a href="https://developer.mozilla.org/es/docs/CSS/Media_queries#-moz-device-pixel-ratio" title="en/CSS/Media_queries#-moz-device-pixel-ratio">proporción de píxeles</a>.</p>
-
-<p>También puede hacer uso de propiedades CSS para implementar efectos visuales como <a href="https://developer.mozilla.org/es/docs/CSS/Using_CSS_gradients" title="en/CSS/Using_CSS_gradients">gradientes</a> y <a href="https://developer.mozilla.org/es/docs/Web/CSS/box-shadow" title="En/CSS/Box-shadow">sombras</a> sin utilizar imágenes para ello.</p>
-
-<h3 id="APIs_móviles">APIs móviles</h3>
-
-<p>Finalmente, puede aprovechar las nuevas posibilidades ofrecidas por los dispositivos móviles, como la <a href="https://developer.mozilla.org/es/docs/Web/API/Detecting_device_orientation" title="en/Detecting_device_orientation">orientación</a> y la <a href="https://developer.mozilla.org/es/docs/WebAPI/Using_geolocation" title="En/Using_geolocation">geolocalización</a>.</p>
-
-<h2 id="Desarrollo_para_diferentes_navegadores"><a id="DesarrolloParaDiferentesNavegadores" name="DesarrolloParaDiferentesNavegadores"></a>Desarrollo para diferentes navegadores</h2>
-
-<h3 id="Escribir_código_para_diferentes_navegadores_(cross-browser)">Escribir código para diferentes navegadores (<em>cross-browser</em>)</h3>
-
-<p>Para crear sitios web que funcionen aceptablemente en diferentes navegadores móviles:</p>
-
-<ul>
- <li>Intente evitar características específicas de un navegador, como las propiedades CSS prefijadas por el proveedor (<em>vendor-prefixed</em>).</li>
- <li>Si necesita utilizar estas características, compruebe si otros navegadores implementan sus propias versiones e inclúyalas igualmente.</li>
- <li>Para navegadores que no soportan estas características, ofrezca una alternativa aceptable.</li>
-</ul>
-
-<p>Por ejemplo, si establece un gradiente como fondo para cierto texto usando una propiedad prefijada por el proveedor (<em>vendor-prefixed</em>) como <code>-webkit-linear-gradient</code>, es mejor incluir las otras versiones prefijadas de la propiedad <a href="https://developer.mozilla.org/es/docs/Web/CSS/linear-gradient" title="en/CSS/linear-gradient">linear-gradient</a> (gradiente linear). Si no lo hace, asegúrese al menos de que el fondo por defecto contrasta con el texto. Así, la página será al menos usable en un navegador al que no esté dirigida su regla <code>linear-gradient</code>.</p>
-
-<p>Vea esta <a href="https://developer.mozilla.org/es/docs/Web/CSS/Referencia_CSS/Extensiones_CSS_Mozilla" title="en/CSS/CSS_Reference/Mozilla_Extensions">lista de propiedades específicas para Gecko</a>, esta lista de <a href="/en/CSS/CSS_Reference/Webkit_Extensions" title="en/CSS/CSS_Reference/Webkit_Extensions">propiedades específicas para WebKit</a> y la <a class="external" href="http://peter.sh/experiments/vendor-prefixed-css-property-overview/">tabla de propiedades específicas de proveedores (<em>vendor-specific</em>)</a> de Peter Beverloo.</p>
-
-<p>Usar herramientas como <a class="external" href="http://csslint.net/">CSS Lint</a> puede ayudar a encontrar problemas como este en el código y preprocesadores como <a class="external" href="http://sass-lang.com/">SASS</a> y <a class="external" href="http://lesscss.org/">LESS</a> pueden ser de ayuda para crear código compatible con diferentes navegadores.</p>
-
-<h3 id="Precaución_al_husmear_el_agente_de_usuario_(user_agent)">Precaución al husmear el agente de usuario (<em>user agent</em>)</h3>
-
-<p>Es preferible para los sitios web usar las técnicas enumeradas anteriormente con el objetivo de detectar características específicas del dispositivo, como el tamaño de pantalla y las pantallas táctiles, y adaptarse a ellas adecuadamente. Pero a veces esto no es práctico y los sitios web recurren a analizar la cadena de agente de usuario del navegador (<em>user agent</em>) para intentar distinguir entre ordenadores de escritorio, tabletas y teléfonos, y servir diferente contenido a cada tipo de dispositivo.</p>
-
-<p>Si hace esto, asegúrese de que su algoritmo es correcto y no está sirviendo el tipo equivocado de contenido a un dispositivo porque no entiende la cadena de un agente de usuario particular. Vea esta <a href="/en/Browser_detection_using_the_user_agent#Mobile.2C_Tablet_or_Desktop" title="browser detection using the user agent">guía para usar la cadena de agente de usuario para determinar el tipo de dispositivo</a>.</p>
-
-<h3 id="Probar_en_múltiples_navegadores">Probar en múltiples navegadores</h3>
-
-<p>Compruebe su sitio web en múltiples navegadores. Esto significa probarlo en múltiples plataformas — al menos iOS y Android.</p>
-
-<ul>
- <li>Pruebe Safari móvil en iPhone usando el <a class="link-https" href="https://developer.apple.com/devcenter/ios/index.action">simulador iOS</a>.</li>
- <li>Pruebe Opera y Firefox utilizando el <a class="link-https" href="https://developer.android.com/sdk/index.html">Android SDK</a>. Vea estas instrucciones adicionales para <a class="link-https" href="https://wiki.mozilla.org/Mobile/Fennec/Android/Emulator">ejecutar Firefox para Android usando el emulador de Android</a>.</li>
-</ul>
diff --git a/files/es/web/guide/performance/usando_web_workers/index.html b/files/es/web/guide/performance/usando_web_workers/index.html
deleted file mode 100644
index db4dbc07e3..0000000000
--- a/files/es/web/guide/performance/usando_web_workers/index.html
+++ /dev/null
@@ -1,633 +0,0 @@
----
-title: Usando Web Workers
-slug: Web/Guide/Performance/Usando_web_workers
-translation_of: Web/API/Web_Workers_API/Using_web_workers
----
-<p><span class="seoSummary">Los Web Workers dedicados proveen un medio sencillo para que el contenido web ejecute scripts en hilos en segundo plano. Una vez creado, un worker puede enviar mensajes a la tarea creada mediante envio de mensajes al manejador de eventos especificado por el creador.</span> Sin embargo, <strong>los workers trabajan dentro de un <a href="https://developer.mozilla.org/en-US/docs/JavaScript/DedicatedWorkerGlobalScope">contexto global</a> diferente de la ventana actual</strong> (usar el atajo <span style="line-height: 1.5;"> {{ domxref("window") }} en lugar de </span><span style="line-height: 1.5;">{{ domxref("window.self","self") }} con el fin de obtener el scope actual dentro de un </span><span style="line-height: 1.5;">{{ domxref("Worker") }} retornaría, de hecho, un error).</span></p>
-
-<p>El hilo worker puede realizar tareas sin interferir con la interfaz de usuario. Ademas, pueden realizar I/O usando <code style="font-size: 14px;"><a class="internal" href="/en/nsIXMLHttpRequest" title="En/XMLHttpRequest">XMLHttpRequest</a></code><span style="line-height: 1.5;"> (aunque el responseXML y los atributos channel son siempre null).</span></p>
-
-<p><span style="line-height: 1.5;">Para documentacion de referencia acerca de workers busca </span><span style="line-height: 1.5;">{{ domxref("Worker") }} ; este articulo complementa ese ofreciendo ejemplos y detalles adicionales. Para una lista de las funciones disponibles sobre workers, visita </span><span style="line-height: 1.5;"> </span><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/Needs_categorization/Functions_available_to_workers?redirect=no" style="line-height: 1.5;" title="En/DOM/Worker/Functions available to workers">Functions and interfaces available to workers</a><span style="line-height: 1.5;">.</span></p>
-
-<h2 id="Acerca_de_seguridad_de_hilos" style="line-height: 22.79199981689453px;">Acerca de seguridad de hilos</h2>
-
-<p>La interfaz <span style="line-height: 1.5;"> {{ domxref("Worker") }} crea hilos a nivel de SO reales, y la concurrencia puede causar effectos interesantes en tu código si no eres cuidadoso. Sin embargo, en el caso de los web workers, el control cuidadoso de los puntos de comunicacion con otros hilos indica que es realmente muy dificil causar problemas de concurrencia. No existe acceso a componentes no-hilo seguros o al DOM y debes pasar la informacion entrante o saliente del hilo a traves de objetos serializados. Así que debes poner esfuerzo para causar problemas en tu código.</span></p>
-
-<p><strong style="">Creando un web worker</strong></p>
-
-<p>Crear un nuevo worker es simple.  Sólo tienes que llamar el constructor {{ domxref("Worker.Worker", "Worker()") }}, especificando la URI de un script a ejecutar en el hilo del worker (<em>worker thread</em>), y, si deseas poder recibir notificaciones del worker, establece la propiedad  {{domxref("Worker.onmessage")}} del worker a una función de manejo de eventos apropiada.</p>
-
-<div style="overflow: hidden;">
-<pre class="brush: js notranslate">var myWorker = new Worker("my_task.js");
-
-myWorker.onmessage = function (oEvent) {
-  console.log("Called back by the worker!\n");
-};</pre>
-</div>
-
-<p>Alternativamente, puedes usar <code>addEventListener()</code> :</p>
-
-<div style="overflow: hidden;">
-<pre class="brush: js notranslate">var myWorker = new Worker("my_task.js");
-
-myWorker.addEventListener("message", function (oEvent) {
-  console.log("Called back by the worker!\n");
-}, false);
-
-myWorker.postMessage(""); // start the worker.</pre>
-</div>
-
-<p>La Línea 1 en  este ejemplo crea un nuevo worker (<em>worker thread)</em>. La Línea 3 configura un manejador de eventos (<em>listener</em>) para encargarse de los eventos <code>message</code> del worker. Este manejador de eventos se llamará cuando el worker llame a su propia función {{domxref("Worker.postMessage()")}}. Finalmente, la Linea 7 inicia el worker <em>(worker thread)</em>.</p>
-
-<div class="note"><strong>Nota</strong> : La URI pasada como parámetro del constructor de <code>Worker</code> debe obedecer la política <a href="/en/Same_origin_policy_for_JavaScript" title="Same origin policy for JavaScript">same-origin policy</a> . Actualmente hay desacuerdo entre los desarolladores de navegadores sobre qué URIs son del mismo origen; Gecko 10.0 {{ geckoRelease("10.0") }} y posteriores sí permiten data URIs e Internet Explorer 10 no permite Blob URIs como un script válido para los workers.</div>
-
-<h2 id="Pasando_datos">Pasando datos</h2>
-
-<p>Los datos pasan entre la página principal y los workers son <strong>copiados</strong>, no compartidos. Los objetos se serializan a medida que se entregan al worker, y posteriormente, se deserializan en el otro extremo. La página y el worker <strong>no comparten la misma instancia</strong>, por lo que el resultado final es que un duplicado es creado en cada extremo. La mayoría de los navegadores implementan esta característica como <a href="/en/DOM/The_structured_clone_algorithm" title="The structured clone algorithm">structured cloning</a>.</p>
-
-<p>Antes de continuar, vamos a crear con fines didácticos una función llamada <code>emulateMessage()</code> que simulará el comportamiento de un valor el cual es clonado y no compartido durante el paso desde un <em>worker </em>a la página principal o viceversa:</p>
-
-<pre class="brush: js notranslate">function emulateMessage (vVal) {
-    return eval("(" + JSON.stringify(vVal) + ")");
-}
-
-// Tests
-
-// test #1
-var example1 = new Number(3);
-alert(typeof example1); // object
-alert(typeof emulateMessage(example1)); // number
-
-// test #2
-var example2 = true;
-alert(typeof example2); // boolean
-alert(typeof emulateMessage(example2)); // boolean
-
-// test #3
-var example3 = new String("Hello World");
-alert(typeof example3); // object
-alert(typeof emulateMessage(example3)); // string
-
-// test #4
-var example4 = {
-    "name": "John Smith",
-    "age": 43
-};
-alert(typeof example4); // object
-alert(typeof emulateMessage(example4)); // object
-
-// test #5
-function Animal (sType, nAge) {
-    this.type = sType;
-    this.age = nAge;
-}
-var example5 = new Animal("Cat", 3);
-alert(example5.constructor); // Animal
-alert(emulateMessage(example5).constructor); // Object</pre>
-
-<p>A Un valor que es clonado y no compartido se denomina <em>mensaje</em>. De vuelta con los workers, los <em>mensajes</em> pueden ser enviados hacia y desde el hilo principal empleando <code>postMessage()</code>. Los eventos de <code>mensaje</code> {{domxref("MessageEvent.data", "data")}} atributo contienen datos devueltos desde el worker.</p>
-
-<p><strong>example.html</strong>: (la página principal):</p>
-
-<pre class="brush: js notranslate">var myWorker = new Worker("my_task.js");
-
-myWorker.onmessage = function (oEvent) {
-  console.log("Worker said : " + oEvent.data);
-};
-
-myWorker.postMessage("ali");</pre>
-
-<p><strong>my_task.js</strong> (el worker):</p>
-
-<pre class="brush: js notranslate">postMessage("I\'m working before postMessage(\'ali\').");
-
-onmessage = function (oEvent) {
-  postMessage("Hi " + oEvent.data);
-};</pre>
-
-<div class="note"><strong>Note:</strong> Como siempre, los hilos en segundo plano -incluyendo workers- <strong>no pueden manipular el DOM</strong>. Si acciones tomadas por el hilo en segundo planos resultarían en cambios en el DOM, deberian enviar mensajes a sus creadores para llevarlos a cabo.</div>
-
-<p>The <a href="/en-US/docs/Web/Guide/DOM/The_structured_clone_algorithm" style="line-height: 1.572;" title="The structured clone algorithm">structured cloning</a> algorithm can accept JSON and a few things that JSON can't like circular references.</p>
-
-<h3 id="Ejemplos_pasando_datos">Ejemplos pasando datos</h3>
-
-<h4 id="Example_1_Crear_un_eval_asíncrono_genérico">Example #1: Crear un "<code>eval() asíncrono</code>" genérico</h4>
-
-<p>El siguiente ejemplo muestra como usar un worker para ejecutar <strong>asíncronamente</strong> cualquier tipo de código en Javascript a traves de <a href="/en-US/docs/JavaScript/Reference/Global_Objects/eval" title="/en-US/docs/JavaScript/Reference/Global_Objects/eval"><code>eval</code></a> dentro del worker:</p>
-
-<pre class="brush: js notranslate">// Syntax: asyncEval(code[, listener])
-
-var asyncEval = (function () {
-
-  var aListeners = [], oParser = new Worker("data:text/javascript;charset=US-ASCII,onmessage%20%3D%20function%20%28oEvent%29%20%7B%0A%09postMessage%28%7B%0A%09%09%22id%22%3A%20oEvent.data.id%2C%0A%09%09%22evaluated%22%3A%20eval%28oEvent.data.code%29%0A%09%7D%29%3B%0A%7D");
-
-  oParser.onmessage = function (oEvent) {
-    if (aListeners[oEvent.data.id]) { aListeners[oEvent.data.id](oEvent.data.evaluated); }
-    delete aListeners[oEvent.data.id];
-  };
-
-
-  return function (sCode, fListener) {
-    aListeners.push(fListener || null);
-    oParser.postMessage({
-      "id": aListeners.length - 1,
-      "code": sCode
-    });
-  };
-
-})();</pre>
-
-<p>Ejemplo de uso:</p>
-
-<pre class="brush: js notranslate">// asynchronous alert message...
-asyncEval("3 + 2", function (sMessage) {
-    alert("3 + 2 = " + sMessage);
-});
-
-// asynchronous print message...
-asyncEval("\"Hello World!!!\"", function (sHTML) {
-    document.body.appendChild(document.createTextNode(sHTML));
-});
-
-// asynchronous void...
-asyncEval("(function () {\n\tvar oReq = new XMLHttpRequest();\n\toReq.open(\"get\", \"http://www.mozilla.org/\", false);\n\toReq.send(null);\n\treturn oReq.responseText;\n})()");</pre>
-
-<h4 id="Ejemplo_2_Paso_avanzado_de_JSON_Data_y_creación_de_un_sistema_de_conmutación">Ejemplo #2: Paso avanzado de JSON Data y creación de un sistema de conmutación</h4>
-
-<p>Si tiene que pasar datos complejos y tienes que llamar a muchas funciones diferentes tanto en la página principal como en el Worker, puede crear un sistema como el siguiente.</p>
-
-<p><strong>example.html</strong> (the main page):</p>
-
-<pre class="brush: html notranslate">&lt;!doctype html&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;meta charset="UTF-8"  /&gt;
-&lt;title&gt;MDN Example - Queryable worker&lt;/title&gt;
-&lt;script type="text/javascript"&gt;
-  /*
-    QueryableWorker instances methods:
-     * sendQuery(queryable function name, argument to pass 1, argument to pass 2, etc. etc): calls a Worker's queryable function
-     * postMessage(string or JSON Data): see Worker.prototype.postMessage()
-     * terminate(): terminates the Worker
-     * addListener(name, function): adds a listener
-     * removeListener(name): removes a listener
-    QueryableWorker instances properties:
-     * defaultListener: the default listener executed only when the Worker calls the postMessage() function directly
-  */
-  function QueryableWorker (sURL, fDefListener, fOnError) {
-    var oInstance = this, oWorker = new Worker(sURL), oListeners = {};
-    this.defaultListener = fDefListener || function () {};
-    oWorker.onmessage = function (oEvent) {
-      if (oEvent.data instanceof Object &amp;&amp; oEvent.data.hasOwnProperty("vo42t30") &amp;&amp; oEvent.data.hasOwnProperty("rnb93qh")) {
-        oListeners[oEvent.data.vo42t30].apply(oInstance, oEvent.data.rnb93qh);
-      } else {
-        this.defaultListener.call(oInstance, oEvent.data);
-      }
-    };
-    if (fOnError) { oWorker.onerror = fOnError; }
-    this.sendQuery = function (/* queryable function name, argument to pass 1, argument to pass 2, etc. etc */) {
-      if (arguments.length &lt; 1) { throw new TypeError("QueryableWorker.sendQuery - not enough arguments"); return; }
-      oWorker.postMessage({ "bk4e1h0": arguments[0], "ktp3fm1": Array.prototype.slice.call(arguments, 1) });
-    };
-    this.postMessage = function (vMsg) {
-      //I just think there is no need to use call() method
-      //how about just oWorker.postMessage(vMsg);
-      //the same situation with terminate
-      //well,just a little faster,no search up the prototye chain
-      Worker.prototype.postMessage.call(oWorker, vMsg);
-    };
-    this.terminate = function () {
-      Worker.prototype.terminate.call(oWorker);
-    };
-    this.addListener = function (sName, fListener) {
-      oListeners[sName] = fListener;
-    };
-    this.removeListener = function (sName) {
-      delete oListeners[sName];
-    };
-  };
-
-  // your custom "queryable" worker
-  var oMyTask = new QueryableWorker("my_task.js" /* , yourDefaultMessageListenerHere [optional], yourErrorListenerHere [optional] */);
-
-  // your custom "listeners"
-
-  oMyTask.addListener("printSomething", function (nResult) {
-    document.getElementById("firstLink").parentNode.appendChild(document.createTextNode(" The difference is " + nResult + "!"));
-  });
-
-  oMyTask.addListener("alertSomething", function (nDeltaT, sUnit) {
-    alert("Worker waited for " + nDeltaT + " " + sUnit + " :-)");
-  });
-&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
-  &lt;ul&gt;
-    &lt;li&gt;&lt;a id="firstLink" href="javascript:oMyTask.sendQuery('getDifference', 5, 3);"&gt;What is the difference between 5 and 3?&lt;/a&gt;&lt;/li&gt;
-    &lt;li&gt;&lt;a href="javascript:oMyTask.sendQuery('waitSomething');"&gt;Wait 3 seconds&lt;/a&gt;&lt;/li&gt;
-    &lt;li&gt;&lt;a href="javascript:oMyTask.terminate();"&gt;terminate() the Worker&lt;/a&gt;&lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p><strong>my_task.js</strong> (el worker):</p>
-
-<pre class="brush: js notranslate">// your custom PRIVATE functions
-
-function myPrivateFunc1 () {
-  // do something
-}
-
-function myPrivateFunc2 () {
-  // do something
-}
-
-// etc. etc.
-
-// your custom PUBLIC functions (i.e. queryable from the main page)
-
-var queryableFunctions = {
-  // example #1: get the difference between two numbers:
-  getDifference: function (nMinuend, nSubtrahend) {
-      reply("printSomething", nMinuend - nSubtrahend);
-  },
-  // example #2: wait three seconds
-  waitSomething: function () {
-      setTimeout(function() { reply("alertSomething", 3, "seconds"); }, 3000);
-  }
-};
-
-// system functions
-
-function defaultQuery (vMsg) {
-  // your default PUBLIC function executed only when main page calls the queryableWorker.postMessage() method directly
-  // do something
-}
-
-function reply (/* listener name, argument to pass 1, argument to pass 2, etc. etc */) {
-  if (arguments.length &lt; 1) { throw new TypeError("reply - not enough arguments"); return; }
-  postMessage({ "vo42t30": arguments[0], "rnb93qh": Array.prototype.slice.call(arguments, 1) });
-}
-
-onmessage = function (oEvent) {
-  if (oEvent.data instanceof Object &amp;&amp; oEvent.data.hasOwnProperty("bk4e1h0") &amp;&amp; oEvent.data.hasOwnProperty("ktp3fm1")) {
-    queryableFunctions[oEvent.data.bk4e1h0].apply(self, oEvent.data.ktp3fm1);
-  } else {
-    defaultQuery(oEvent.data);
-  }
-};</pre>
-
-<p>Es un método posible para conmutar el contenido de cada mensaje de cada mainpage-worker y viceversa.</p>
-
-<h3 id="Pasando_datos_mediante_transferencia_de_propiedades_objetos_transferibles">Pasando datos mediante transferencia de propiedades (objetos transferibles)</h3>
-
-<p>Google Chrome 17 y Firefox 18 implementan un método adicional para enviar ciertos tipos de objetos desde o hacia el worker con un mejor rendimiento. Estos objetos se denominan objetos transferibles (transferable objects), es decir, o<span class="external">bjetos que implementan la interfaz {{domxref("Transferable")}}</span>. Los objetos transferibles se transfieren de un contexto a otro con una operación "zero-copy". Esto supone una gran mejora de rendimiento al enviar grandes cantidades de datos. Piensa en ello como un paso por referencia si vienes del mundo de C/C++.  Sin embargo, a diferecia del paso por referencia, la "versión" original no queda disponible una vez transferida. Su contenido es transferido al nuevo contexto. Por ejemplo, cuando se transfiere un {{domxref("ArrayBuffer")}} de tu aplicacion al Worker, el contenido del {{domxref("ArrayBuffer")}} original se vacía y no se puede utilizar posteriormente. Su contenido es (literalmente) transferido al contexto del Worker.</p>
-
-<pre class="brush: js notranslate">// Create a 32MB "file" and fill it.
-var uInt8Array = new Uint8Array(1024*1024*32); // 32MB
-for (var i = 0; i &lt; uInt8Array.length; ++i) {
-  uInt8Array[i] = i;
-}
-
-worker.postMessage(uInt8Array.buffer, [uInt8Array.buffer]);
-</pre>
-
-<p>Para más información sobre los objetos transferibles, <a class="external" href="http://updates.html5rocks.com/2011/12/Transferable-Objects-Lightning-Fast" title="http://updates.html5rocks.com/2011/12/Transferable-Objects-Lightning-Fast">visita HTML5Rocks</a> .</p>
-
-<h2 id="Spawning_subworkers">Spawning subworkers</h2>
-
-<p>Workers may spawn more workers if they wish.  So-called subworkers must be hosted within the same origin as the parent page.  Also, the URIs for subworkers are resolved relative to the parent worker's location rather than that of the owning page.  This makes it easier for workers to keep track of where their dependencies are.</p>
-
-<p>Subworkers are currently not supported in Chrome. See <a class="external" href="http://code.google.com/p/chromium/issues/detail?id=31666" title="http://code.google.com/p/chromium/issues/detail?id=31666">crbug.com/31666</a> .</p>
-
-<h2 id="Embedded_workers">Embedded workers</h2>
-
-<p>There is not an "official" way to embed the code of a worker within a web page as for the {{ HTMLElement("script") }} elements. But a {{ HTMLElement("script") }} element which does not have a <code>src</code> attribute and has a <code>type</code> attribute that does not identify an executable mime-type will be considered a data block element, that JavaScript could use.  "Data blocks" is a more general feature of HTML5 that can carry almost any textual data. So, a worker could be embedded in this way:</p>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;meta charset="UTF-8" /&gt;
-&lt;title&gt;MDN Example - Embedded worker&lt;/title&gt;
-&lt;script type="text/js-worker"&gt;
-  // This script WON'T be parsed by JS engines because its mime-type is text/js-worker.
-  var myVar = "Hello World!";
-  // Rest of your worker code goes here.
-&lt;/script&gt;
-&lt;script type="text/javascript"&gt;
-  // This script WILL be parsed by JS engines because its mime-type is text/javascript.
-  function pageLog (sMsg) {
-    // Use a fragment: browser will only render/reflow once.
-    var oFragm = document.createDocumentFragment();
-    oFragm.appendChild(document.createTextNode(sMsg));
-    oFragm.appendChild(document.createElement("br"));
-    document.querySelector("#logDisplay").appendChild(oFragm);
-  }
-&lt;/script&gt;
-&lt;script type="text/js-worker"&gt;
-  // This script WON'T be parsed by JS engines because its mime-type is text/js-worker.
-  onmessage = function (oEvent) {
-    postMessage(myVar);
-  };
-  // Rest of your worker code goes here.
-&lt;/script&gt;
-&lt;script type="text/javascript"&gt;
-  // This script WILL be parsed by JS engines because its mime-type is text/javascript.
-
-  // In the past...:
-  // blob builder existed
-  // ...but now we use Blob...:
-  var blob = new Blob(Array.prototype.map.call(document.querySelectorAll("script[type=\"text\/js-worker\"]"), function (oScript) { return oScript.textContent; }),{type: "text/javascript"});
-
-  // Creating a new document.worker property containing all our "text/js-worker" scripts.
-  document.worker = new Worker(window.URL.createObjectURL(blob));
-
-  document.worker.onmessage = function (oEvent) {
-    pageLog("Received: " + oEvent.data);
-  };
-
-  // Start the worker.
-  window.onload = function() { document.worker.postMessage(""); };
-&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;&lt;div id="logDisplay"&gt;&lt;/div&gt;&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p>The embedded worker is now nested into a new custom <code>document.worker</code> property.</p>
-
-<h2 id="Tiempos_fuera_e_intervalos">Tiempos fuera e intervalos</h2>
-
-<p>Los trabajadores pueden usar tiempos fuera e intervalos de la misma forma que el "hilo principal".  Esto puede ser útil, por ejemplo, si quieres tener a tu hilo trabajador corriendo codigo periodicamente en lugar de sin parar.</p>
-
-<p>Ver <a class="internal" href="/en/DOM/window.setTimeout" title="En/DOM/Window.setTimeout"><code>setTimeout()</code> </a> , <a class="internal" href="/en/DOM/window.clearTimeout" title="En/DOM/Window.clearTimeout"> <code>clearTimeout()</code> </a> , <a class="internal" href="/en/DOM/window.setInterval" title="En/DOM/Window.setInterval"> <code>setInterval()</code> </a> , y <a class="internal" href="/en/DOM/window.clearInterval" title="En/DOM/Window.clearInterval"><code>clearInterval()</code> </a> para más detalles. Ver también: <a href="/en-US/docs/JavaScript/Timers" title="/en-US/docs/JavaScript/Timers">JavaScript Timers</a>.</p>
-
-<h2 id="Terminating_a_worker">Terminating a worker</h2>
-
-<p>If you need to immediately terminate a running worker, you can do so by calling the worker's <code>terminate()</code> method:</p>
-
-<pre class="syntaxbox notranslate">myWorker.terminate();</pre>
-
-<p>The worker thread is killed immediately without an opportunity to complete its operations or clean up after itself.</p>
-
-<p>Workers may close themselves by calling their own {{ ifmethod("nsIWorkerScope", "close") }} method:</p>
-
-<pre class="syntaxbox notranslate">self.close();</pre>
-
-<h2 id="Manejo_de_errores">Manejo de errores</h2>
-
-<p>When a runtime error occurs in worker, its <code>onerror</code> event handler is called.  It receives an event named <code>error</code> which implements the <code>ErrorEvent</code> interface.  The event doesn't bubble and is cancelable; to prevent the default action from taking place, the worker can call the error event's <a class="internal" href="/en/DOM/event.preventDefault" title="En/DOM/Event.preventDefault"> <code>preventDefault()</code> </a> method.</p>
-
-<p>The error event has the following three fields that are of interest:</p>
-
-<dl>
- <dt><code>message</code></dt>
- <dd>A human-readable error message.</dd>
- <dt><code>filename</code></dt>
- <dd>The name of the script file in which the error occurred.</dd>
- <dt><code>lineno</code></dt>
- <dd>The line number of the script file on which the error occurred.</dd>
-</dl>
-
-<h2 id="Accediendo_al_objeto_navigator">Accediendo al objeto navigator</h2>
-
-<p>Los workers pueden acceder al objeto <code>navigator</code>, el cuál está disponible dentro de su scope actual. Este contiene los siguientes strings que pueden ser usados para identificar el navegador, al igual que puede realizarse usando scripts normales:</p>
-
-<ul>
- <li><code>appName</code></li>
- <li><code>appVersion</code></li>
- <li><code>platform</code></li>
- <li><code>userAgent</code></li>
-</ul>
-
-<h2 id="Importing_scripts_and_libraries">Importing scripts and libraries</h2>
-
-<p>Worker threads have access to a global function, <code>importScripts()</code> , which lets them import scripts or libraries into their scope.  It accepts as parameters zero or more URIs to resources to import; all of the following examples are valid:</p>
-
-<pre class="brush: js notranslate">importScripts();                        /* imports nothing */
-importScripts('foo.js');                /* imports just "foo.js" */
-importScripts('foo.js', 'bar.js');      /* imports two scripts */
-</pre>
-
-<p>The browser loads each listed script and executes it. Any global objects from each script may then be used by the worker. If the script can't be loaded, <code>NETWORK_ERROR</code> is thrown, and subsequent code will not be executed. Previously executed code (including code deferred using {{ domxref("window.setTimeout()") }}) will still be functional though. Function declarations <strong>after</strong> the <code>importScripts()</code> method are also kept, since these are always evaluated before the rest of the code.</p>
-
-<div class="note"><strong>Note:</strong> Scripts may be downloaded in any order, but will be executed in the order in which you pass the filenames into <code>importScripts()</code> .  This is done synchronously; <code>importScripts()</code> does not return until all the scripts have been loaded and executed.</div>
-
-<h2 id="Examples">Examples</h2>
-
-<p>This section provides several examples of how to use DOM workers.</p>
-
-<h3 id="Performing_computations_in_the_background">Performing computations in the background</h3>
-
-<p>One way workers are useful is to allow your code to perform processor-intensive calculations without blocking the user interface thread.  In this example, a worker is used to calculate Fibonacci numbers.</p>
-
-<h4 id="The_JavaScript_code">The JavaScript code</h4>
-
-<p>The following JavaScript code is stored in the "fibonacci.js" file referenced by the HTML in the next section.</p>
-
-<pre class="brush: js notranslate">var results = [];
-
-function resultReceiver(event) {
-  results.push(parseInt(event.data));
-  if (results.length == 2) {
-    postMessage(results[0] + results[1]);
-  }
-}
-
-function errorReceiver(event) {
-  throw event.data;
-}
-
-onmessage = function(event) {
-  var n = parseInt(event.data);
-
-  if (n == 0 || n == 1) {
-    postMessage(n);
-    return;
-  }
-
-  for (var i = 1; i &lt;= 2; i++) {
-    var worker = new Worker("fibonacci.js");
-    worker.onmessage = resultReceiver;
-    worker.onerror = errorReceiver;
-    worker.postMessage(n - i);
-  }
- };</pre>
-
-<p>The worker sets the property <code>onmessage</code>  to a function which will receive messages sent when the worker object's  <code>postMessage()</code> is called.  (Note that this differs from defining a global <em>variable</em> of that name, or defining a <em>function</em> with that name.   <code>var onmessage</code> and <code>function onmessage</code> will define global properties with those names, but they will not register the function to receive messages sent by the  web page that created the worker.)  This starts the recursion, spawning new copies of itself to handle each iteration of the calculation.</p>
-
-<h4 id="The_HTML_code">The HTML code</h4>
-
-<pre class="brush: html notranslate">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;meta charset="UTF-8"  /&gt;
-    &lt;title&gt;Test threads fibonacci&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-
-  &lt;div id="result"&gt;&lt;/div&gt;
-
-  &lt;script language="javascript"&gt;
-
-    var worker = new Worker("fibonacci.js");
-
-    worker.onmessage = function(event) {
-      document.getElementById("result").textContent = event.data;
-      dump("Got: " + event.data + "\n");
-    };
-
-    worker.onerror = function(error) {
-      dump("Worker error: " + error.message + "\n");
-      throw error;
-    };
-
-    worker.postMessage("5");
-
-  &lt;/script&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>The web page creates a <code>div</code> element with the ID  <code>result</code> , which gets used to display the result, then spawns the worker.  After spawning the worker, the <code>onmessage</code> handler is configured to display the results by setting the contents of the <code>div</code> element, and the <code>onerror</code> handler is set to <a class="external" href="/en/Debugging_JavaScript#dump()" title="https://developer.mozilla.org/editor/fckeditor/core/editor/en/Debugging_JavaScript#dump()">dump</a> the error message.</p>
-
-<p>Finally, a message is sent to the worker to start it.</p>
-
-<p><a class="external" href="/samples/workers/fibonacci" title="https://developer.mozilla.org/samples/workers/fibonacci/">Try this example</a> .</p>
-
-<h3 id="Performing_web_IO_in_the_background">Performing web I/O in the background</h3>
-
-<p>You can find an example of this in the article <a class="internal" href="/En/Using_workers_in_extensions" title="En/Using workers in extensions">Using workers in extensions</a> .</p>
-
-<h3 id="Dividing_tasks_among_multiple_workers">Dividing tasks among multiple workers</h3>
-
-<p>As multi-core computers become increasingly common, it's often useful to divide computationally complex tasks among multiple workers, which may then perform those tasks on multiple-processor cores.</p>
-
-<p>example coming soon</p>
-
-<h3 id="Creating_workers_from_within_workers">Creating workers from within workers</h3>
-
-<p>The Fibonacci example shown previously demonstrates that workers can in fact <a href="#Spawning_subworkers">spawn additional workers</a>.  This makes it easy to create recursive routines.</p>
-
-<h2 id="Browser_Compatibility" name="Browser_Compatibility">Browser compatibility</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Dedicated workers</td>
-   <td>{{CompatChrome(3)}}</td>
-   <td>{{CompatGeckoDesktop(1.9.1)}}</td>
-   <td>{{CompatIE(10)}}</td>
-   <td>{{CompatOpera(10.60)}}</td>
-   <td>{{CompatSafari(4)}}</td>
-  </tr>
-  <tr>
-   <td>Shared workers</td>
-   <td>{{CompatChrome(3)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera(10.60)}}</td>
-   <td>{{CompatSafari(5)}}</td>
-  </tr>
-  <tr>
-   <td>Passing data using <a href="/en/DOM/The_structured_clone_algorithm" title="The structured clone algorithm">structured cloning</a> . </td>
-   <td>{{CompatChrome(13)}}</td>
-   <td>{{CompatGeckoDesktop(8)}}</td>
-   <td>{{CompatIE(10)}}</td>
-   <td>{{CompatOpera(11.50)}}</td>
-   <td>{{CompatSafari(5.1)}}</td>
-  </tr>
-  <tr>
-   <td>Passing data using  <a class="external" href="http://www.w3.org/html/wg/drafts/html/master/infrastructure.html#transferable-objects" title="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects">transferable objects</a></td>
-   <td>17 {{ property_prefix("webkit") }}<br>
-    {{CompatChrome(21)}}</td>
-   <td>{{CompatGeckoDesktop(18)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera(15)}}</td>
-   <td>{{CompatSafari(6)}}</td>
-  </tr>
-  <tr>
-   <td>Global {{ domxref("window.URL", "URL") }}</td>
-   <td>10 as <code>webkitURL</code><br>
-    {{CompatChrome(23)}}</td>
-   <td>{{CompatGeckoDesktop(21)}}</td>
-   <td>{{CompatIE(11)}}</td>
-   <td>{{CompatOpera(15)}}</td>
-   <td>6 as <code>webkitURL</code></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Dedicated workers</td>
-   <td>---</td>
-   <td>0.16</td>
-   <td>3.5 (1.9.1)</td>
-   <td>---</td>
-   <td>11</td>
-   <td>5</td>
-  </tr>
-  <tr>
-   <td>Shared workers</td>
-   <td>---</td>
-   <td>{{ CompatNo() }}</td>
-   <td>---</td>
-   <td>---</td>
-   <td>---</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>Passing data using <a href="/en/DOM/The_structured_clone_algorithm" title="The structured clone algorithm">structured cloning</a> . </td>
-   <td>---</td>
-   <td>0.16</td>
-   <td>8</td>
-   <td>---</td>
-   <td>---</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>Passing data using  <a class="external" href="http://www.w3.org/html/wg/drafts/html/master/infrastructure.html#transferable-objectshtml#transferable-objects" title="http://dev.w3.org/html5/spec/common-dom-interfaces.html#transferable-objects">transferable objects</a></td>
-   <td>---</td>
-   <td></td>
-   <td>18</td>
-   <td>---</td>
-   <td>---</td>
-   <td>---</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{ spec("http://dev.w3.org/html5/workers/", "File API Specification: Web Workers", "ED") }}</li>
- <li><code><a class="internal" href="/en/DOM/Worker" title="En/DOM/Worker">Worker</a></code> interface</li>
- <li><code><a class="internal" href="/en/DOM/SharedWorker" title="En/DOM/SharedWorker">SharedWorker</a></code> interface</li>
- <li><a href="/en/DOM/Worker/Functions_available_to_workers" title="En/DOM/Worker/Functions available to workers">Functions available to workers</a></li>
- <li><a class="external" href="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers" title="http://www.html5rocks.com/en/tutorials/workers/basics/#toc-enviornment-subworkers">HTML5Rocks - The Basics of Web Workers</a></li>
- <li><a class="external" href="http://code.google.com/p/chromium/issues/detail?id=127990" title="Chrome has Problems with many workers">Chrome has problems when using too many worker</a></li>
-</ul>
diff --git a/files/es/web/guide/usando_objetos_formdata/index.html b/files/es/web/guide/usando_objetos_formdata/index.html
deleted file mode 100644
index 13f4c9635a..0000000000
--- a/files/es/web/guide/usando_objetos_formdata/index.html
+++ /dev/null
@@ -1,137 +0,0 @@
----
-title: Usando Objetos FormData
-slug: Web/Guide/Usando_Objetos_FormData
-translation_of: Web/API/FormData/Using_FormData_Objects
-translation_of_original: Web/Guide/Using_FormData_Objects
----
-<p>Los objetos <code><a href="/es/docs/XMLHttpRequest/FormData" title="en/DOM/XMLHttpRequest/FormData">FormData</a> </code>le permiten compilar un conjunto de pares clave/valor para enviar mediante <code>XMLHttpRequest</code>. Están destinados principalmente para el envío de los datos del formulario, pero se pueden utilizar de forma independiente con el fin de transmitir los datos tecleados. Los datos transmitidos estarán en el mismo formato que usa el método <code>submit() </code>del formulario para enviar los datos si el tipo de codificación del formulario se establece en "multipart/form-data".</p>
-
-<h2 id="Creación_de_un_objeto_FormData_desde_cero">Creación de un objeto FormData desde cero</h2>
-
-<p>Usted mismo puede construir un objeto <code>FormData</code> instanciándolo y después añadiendo campos a la instancia usando su método  <a href="/en/DOM/XMLHttpRequest/FormData#append()" title="en/XMLHttpRequest/FormData#append()"><code>append()</code></a> , tal y como se muestra:</p>
-
-<pre class="brush: js">var formData = new FormData();
-
-<span style="line-height: normal;">formData</span>.append("username", "Groucho");
-<span style="line-height: normal;">formData</span>.append("accountnum", 123456); // number 123456 is immediately converted to string "123456"
-
-// HTML file input user's choice...
-<span style="line-height: normal;">formData</span>.append("userfile", fileInputElement.files[0]);
-
-// JavaScript file-like object...
-var content = '&lt;a id="a"&gt;&lt;b id="b"&gt;hey!&lt;/b&gt;&lt;/a&gt;'; // the body of the new file...
-var blob = new Blob([<span style="line-height: normal;">content</span><span style="line-height: normal;">], { type: "text/xml"});</span>
-
-formData.append("webmasterfile", <span style="line-height: normal;">blob</span><span style="line-height: normal;">);</span>
-
-var request = new XMLHttpRequest();
-<span style="line-height: normal;">request</span>.open("POST", "http://foo.com/submitform.php");
-<span style="line-height: normal;">request</span>.send(formData);
-</pre>
-
-<div class="note"><strong>Nota:</strong> Los campos "userfile" y "webmasterfile" contienen ambos un archivo. El número asignado al campo "accountnum" es inmediatamente convertido a string por el método <a href="/en/DOM/XMLHttpRequest/FormData#append()" title="en/XMLHttpRequest/FormData#append()"><code>FormData.append()</code></a> (el valor del campo puede ser un {{ domxref("Blob") }}, {{ domxref("File") }}, o una cadena de texto; <strong>si el valor no es ni un Blob, ni un File, será convertido a un string</strong>).</div>
-
-<p>Este ejemplo construye una instancia de <code>FormData</code> que almacenará los valores de los campos "username", "accountnum", "userfile" y "webmasterfile", entonces usará el método <a href="/en/DOM/XMLHttpRequest#send()" title="en/XMLHttpRequest#send()"><code>send()</code></a> de <code>XMLHttpRequest</code> para enviar los datos del formulario. El campo "webmasterfile" es un <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a>. Un objeto <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a> representa un objeto de tipo similar a un fichero que es inalterable y que almacenará datos en formato raw. Los Blobs representan datos que no necesariamente tendrán un formato Javascript nativo. La interfaz {{ domxref("File") }} está basada en <a href="/en/DOM/Blob" title="en/DOM/Blob"><code>Blob</code></a>, y hereda su funcionalidad y la amplía para dar soporte a archivos que estén en el sistema del usuario. Para construir un <code><a href="/en/DOM/Blob" title="en/DOM/Blob">Blob</a></code>, puede invocar <a href="/en/DOM/Blob#Constructor" title="en/DOM/Blob#Constructor"><code>al constructor del objeto Blob</code></a>.</p>
-
-<h2 id="Recuperando_un_objeto_FormData_de_un_formulario_HTML">Recuperando un objeto FormData de un formulario HTML </h2>
-
-<p>Para construir un objeto <code>FormData</code> que contenga los datos de un {{ HTMLElement("form") }} existente, especifique ese elemento form cuando cree el objeto <code>FormData</code>:</p>
-
-<pre class="brush: js">var <span style="line-height: normal;">formData</span><span style="line-height: normal;"> = new FormData(someFormElement);</span>
-</pre>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: js">var formElement = document.getElementById("myFormElement");
-var request = new XMLHttpRequest();
-<span style="line-height: normal;">request</span>.open("POST", "submitform.php");
-<span style="line-height: normal;">request</span>.send(new FormData(formElement));
-</pre>
-
-<p>También puede añadir datos adicionales al objeto <code>FormData</code> antes de enviarlo. Así:</p>
-
-<pre class="brush: js">var formElement = document.getElementById("myFormElement");
-formData = new FormData(formElement);
-formData.append("serialnumber", serialNumber++);
-<span style="line-height: normal;">request</span>.send(formData);</pre>
-
-<p>Esto le permite aumentar los datos del formulario antes de enviarlos para incluir información adicional que no necesariamente debiera ser editable por el usuario en el formulario.</p>
-
-<h2 id="Enviando_archivos_usando_objetos_FormData">Enviando archivos usando objetos FormData</h2>
-
-<p>También puede enviar archivos usando <code>FormData</code>. Simplemente incluye un elemento {{ HTMLElement("input") }} de tipo {{ domxref("File") }}:</p>
-
-<pre class="brush: html">&lt;form enctype="multipart/form-data" method="post" name="fileinfo"&gt;
-  &lt;label&gt;Your email address:&lt;/label&gt;
-  &lt;input type="email" autocomplete="on" autofocus name="userid" placeholder="email" required size="32" maxlength="64" /&gt;&lt;br /&gt;
-  &lt;label&gt;Custom file label:&lt;/label&gt;
-  &lt;input type="text" name="filelabel" size="12" maxlength="32" /&gt;&lt;br /&gt;
-  &lt;label&gt;File to stash:&lt;/label&gt;
-  &lt;input type="file" name="file" required /&gt;
-  &lt;input type="submit" value="Stash the file!" /&gt;
-&lt;/form&gt;
-&lt;div id="output"&gt;&lt;/div&gt;
-</pre>
-
-<p>Luego puede enviarlo usando código como el siguiente:</p>
-
-<pre class="brush: js">var form = document.forms.namedItem("fileinfo");
-form.addEventListener('submit', function(ev) {
-
-  var
-    oOutput = document.getElementById("output"),
-    oData = new FormData(document.forms.namedItem("fileinfo"));
-
-  oData.append("CustomField", "This is some extra data");
-
-  var oReq = new XMLHttpRequest();
-  oReq.open("POST", "stash.php", true);
-  oReq.onload = function(oEvent) {
-    if (oReq.status == 200) {
-      oOutput.innerHTML = "Uploaded!";
-    } else {
-      oOutput.innerHTML = "Error " + oReq.status + " occurred uploading your file.&lt;br \/&gt;";
-    }
-  };
-
-  oReq.send(oData);
-  ev.preventDefault();
-}, false);
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: el método especificado en el formulario será usado por encima del método utilizado en en la llamada a open().</p>
-</div>
-
-<p>También puede añadir un {{ domxref("File") }} o un {{ domxref("Blob") }} directamente al objeto {{ domxref("XMLHttpRequest/FormData", "FormData") }} de la siguiente manera:</p>
-
-<pre class="brush: js">data.append("myfile", myBlob, "filename.txt");
-</pre>
-
-<p>Cuando se usa el método <code>append</code> es posible usar, de manera opcional, un tercer parámetro para pasarle un nombre de fichero dentro de la cabecera <code>Content-Disposition </code>que será enviada al servidor. Cuando no se especifica (o el parámetro no es soportado), el nombre "blob" es el que será utilizado.</p>
-
-<p>Además, puede usar FormData con jQuery si asigna las opciones correctas:</p>
-
-<pre class="brush: js">var fd = new FormData(document.getElementById("fileinfo"));
-fd.append("CustomField", "This is some extra data");
-$.ajax({
-  url: "stash.php",
-  type: "POST",
-  data: fd,
-  processData: false,  // tell jQuery not to process the data
-  contentType: false   // tell jQuery not to set contentType
-});
-</pre>
-
-<h2 id="Envío_de_formularios_y_carga_de_archivos_vía_AJAX_sin_objetos_FormData">Envío de formularios y carga de archivos vía AJAX <em>sin</em>  objetos <code style="font-size: 30px; font-weight: 700;">FormData</code></h2>
-
-<p>Si quiere saber cómo serializar y enviar vía <a href="/en-US/docs/AJAX" title="/en-US/docs/AJAX">AJAX</a> un formulario <em>sin </em>utilizar objetos FormData, por favor leer <a href="/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files" title="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files">este párrafo</a> .</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest" title="/en-US/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest">Usando XMLHttpRequest</a></li>
- <li><a href="/en-US/docs/DOM/HTMLFormElement" title="/en-US/docs/DOM/HTMLFormElement"><code>HTMLFormElement</code></a></li>
- <li><a href="/en-US/docs/DOM/Blob" title="/en-US/docs/DOM/Blob"><code>Blob</code></a></li>
- <li><a href="/en-US/docs/JavaScript/Typed_arrays" title="/en-US/docs/JavaScript/Typed_arrays">Typed Arrays</a></li>
-</ul>
diff --git a/files/es/web/html/anipular_video_por_medio_de_canvas/index.html b/files/es/web/html/anipular_video_por_medio_de_canvas/index.html
deleted file mode 100644
index a3ae61673d..0000000000
--- a/files/es/web/html/anipular_video_por_medio_de_canvas/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: Manipular video por medio de canvas
-slug: Web/HTML/anipular_video_por_medio_de_canvas
-tags:
-  - Canvas
-  - Firefox 3.5
-  - Video
-  - para_revisar
-translation_of: Web/API/Canvas_API/Manipulating_video_using_canvas
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">{{ fx_minversion_header (3.5) }}</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Al combinar las capacidades del elemento </span></span><a class="internal" href="/En/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""> introducido en Firefox 3.5 con un elemento </span></span><a class="internal" href="/en/HTML/Canvas" title="En/Canvas"><code>canvas</code></a><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style=""> , puedes manipular los datos de video en tiempo real para incorporar una variedad de efectos visuales que se mostrarán en el video.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este artículo, adaptado de <a class="external" href="http://blog.mozbox.org/post/2009/02/25/video-canvas%3A-special-effects" title="http://blog.mozbox.org/post/2009/02/25/video-canvas:-special-effects">esta entrada del blog</a> de Paul Rouget, muestra cómo realizar una inserción croma (también conocida como el "efecto pantalla verde") utilizando el código JavaScript.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style=""><a href="/samples/video/chroma-key/index.xhtml" title="samples/video/chroma-key/index.xhtml">Ver este ejemplo en vivo</a> .</span></span></p>
-<h2 id="El_contenido_del_documento"><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El contenido del documento</span></span></h2>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El documento XHTML que se utiliza para representar este contenido se muestra a continuación.</span></span></p>
-<pre class="brush: html">&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
-&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
-  &lt;head&gt;
-    &lt;style&gt;
-      body {
-        background: black;
-        color:#CCCCCC;
-      }
-      #c2 {
-        background-image: url(foo.png);
-        background-repeat: no-repeat;
-      }
-      div {
-        float: left;
-        border :1px solid #444444;
-        padding:10px;
-        margin: 10px;
-        background:#3B3B3B;
-      }
-    &lt;/style&gt;
-    &lt;script type="text/javascript;version=1.8" src="main.js"&gt;&lt;/script&gt;
-  &lt;/head&gt;
-
-  &lt;body onload="processor.doLoad()"&gt;
-    &lt;div&gt;
-      &lt;video id="video" src="video.ogv" controls="true"/&gt;
-    &lt;/div&gt;
-    &lt;div&gt;
-      &lt;canvas id="c1" width="160" height="96"/&gt;
-      &lt;canvas id="c2" width="160" height="96"/&gt;
-    &lt;/div&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Los puntos clave a tener en cuenta son:</span></span></p>
-<ol>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este documento establece dos elemento <a class="internal"><code>canvas</code></a> , con los identificadores de <code>c1</code> y <code>c2</code> .</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Canvas <code>c1</code> se utiliza para mostrar la imagen actual del video original, mientras que <code>c2</code> se utiliza para mostrar el video después de realizar la manipulación con el efecto croma; <code>c2</code> se carga previamente con la imagen fija que se utilizará para sustituir el fondo verde en el video.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El código JavaScript es importado de un script llamado <code>main.js</code> ; este script utiliza JavaScript 1.8 características, de modo que la versión se especifica en la línea 22 al importar la secuencia de comandos.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cuando se carga el documento, se ejecuta el método <code>processor.doLoad()</code> de <code>main.js</code>.</span></span></li>
-</ol>
-<h2 id="El_código_JavaScript"><span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El código JavaScript</span></span></h2>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El código JavaScript en <code>main.js</code> consta de tres métodos.</span></span></p>
-<h3 id="Inicializar_el_reproductor_de_croma"><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Inicializar el reproductor de croma</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El método <code>doLoad()</code> se llama cuando el documento XHTML se carga inicialmente.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La función de este método es preparar las variables necesarias para el código de procesamiento del croma y la creación de un detector de eventos para que podamos detectar cuándo inicia el usuario la reproducción del video.</span></span></p>
-<pre class="brush: js">  doLoad: function() {
-    this.video = document.getElementById("video");
-    this.c1 = document.getElementById("c1");
-    this.ctx1 = this.c1.getContext("2d");
-    this.c2 = document.getElementById("c2");
-    this.ctx2 = this.c2.getContext("2d");
-    let self = this;
-    this.video.addEventListener("play", function() {
-        self.width = self.video.videoWidth / 2;
-        self.height = self.video.videoHeight / 2;
-        self.timerCallback();
-      }, false);
-  },
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Este código obtiene referencias a los elementos del documento XHTML que son de particular interés, a saber, el elemento <code>video</code> y los dos elementos <code>canvas</code>.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">También recupera las referencias a los contextos gráficos para cada uno de los dos elementos canvas.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Estos serán utilizados cuando estamos haciendo de verdad el efecto croma.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Luego <code>addEventListener()</code> es llamado para empezar a ver el elemento <code>video</code> de forma que podamos obtener una notificación cuando el usuario presione el botón de reproducción en el video.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En respuesta al usuario que inicia la reproducción, el código obtiene la anchura y la altura de video, reduciendo a la mitad cada uno (vamos a reducir a la mitad el tamaño del video, cuando llevamos a cabo la manipulación efecto croma). A continuación, llama al método <code>timerCallback()</code> para iniciar el visionado del video y la computación del efecto visual.</span></span></p>
-<h3 id="La_devolución_de_llamada_del_temporizador"><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">La devolución de llamada del temporizador</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">La devolución de llamada del temporizador se llama inicialmente cuando el video comienza a reproducirse (cuando tiene lugar el evento "reproducir"), a continuación, toma la responsabilidad por la que se establece a sí mismo para ser llamado periódicamente, a fin de poner en marcha el efecto croma para cada imagen.</span></span></p>
-<pre class="brush: js">  timerCallback: function() {
-    if (this.video.paused || this.video.ended) {
-      return;
-    }
-    this.computeFrame();
-    let self = this;
-    setTimeout(function () {
-        self.timerCallback();
-      }, 0);
-  },
-</pre>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-82"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo primero que la devolución de llamada hace es comprobar si el video se está aún reproduciendo, y si no lo está, la devolución de llamada regresa inmediatamente sin hacer nada.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-83"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">A continuación, llama al método <code>computeFrame()</code>, que lleva a cabo la manipulación del efecto croma en la imagen de video actual.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-84"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Lo último que la devolución de llamada hace es llamar a <code>setTimeout()</code> para programarse para ser llamado lo más pronto posible.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-85"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">En el mundo real, es probable que programes esto en función de la velocidad de fotogramas del video.</span></span></p>
-<h3 id="Manipulación_de_los_datos_de_la_imagen_del_video"><span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Manipulación de los datos de la imagen del video</span></span></h3>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-87"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El método <code>computeFrame()</code>, que se muestra a continuación, se encarga de ir a buscar realmente un fotograma de datos y realizar el efecto croma.</span></span></p>
-<pre class="brush: js">  computeFrame: function() {
-    this.ctx1.drawImage(this.video, 0, 0, this.width, this.height);
-    let frame = this.ctx1.getImageData(0, 0, this.width, this.height);
-    let l = frame.data.length / 4;
-
-    for (let i = 0; i &lt; l; i++) {
-      let r = frame.data[i * 4 + 0];
-      let g = frame.data[i * 4 + 1];
-      let b = frame.data[i * 4 + 2];
-      if (g &gt; 100 &amp;&amp; r &gt; 100 &amp;&amp; b &lt; 43)
-        frame.data[i * 4 + 3] = 0;
-    }
-    this.ctx2.putImageData(frame, 0, 0);
-    return;
-  }
-</pre>
-<p>Cuando esta rutina es llamada, el elemento video muestra el fotograma de datos de video más reciente, que tiene este aspecto:</p>
-<p><img alt="video.png" class="internal default" src="/@api/deki/files/3282/=video.png" style="width: 320px; height: 192px;"></p>
-<p>En la línea 2, ese fotograma de video se copia al contexto gráfico <code>ctx1</code> del primer lienzo, especificando como alto y ancho los valores que previamente guardamos para dibujar el fotograma a mitad de tamaño.  <span class="goog-gtc-unit" id="goog-gtc-unit-104"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Ten en cuenta que puedes pasar simplemente el elemento de video al método <code>drawImage()</code> del contexto para dibujar el fotograma de video actual en dicho contexto.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-105"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">El resultado es:</span></span></p>
-<p><img alt="sourcectx.png" class="internal default" src="/@api/deki/files/3284/=sourcectx.png" style="width: 160px; height: 96px;"></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-106"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Línea 3 obtiene una copia de los datos gráficos del actual fotograma de video llamando al método <code>getImageData()</code> en el primer contexto.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-107"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto proporciona los datos de imagen en píxeles de 32 bits sin procesar que podemos después manipular.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-108"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Línea 4 calcula el número de píxeles de la imagen al dividir entre cuatro el tamaño total de los datos de la imagen del fotograma.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-109"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">El bucle <code>for</code> que comienza en la línea 6 explora a través de los píxeles del fotograma, extrayendo los valores rojo, verde y azul para cada píxel, y compara los valores frente a números predeterminados que se utilizan para detectar la pantalla verde que se reemplazará por la imagen de fondo fija importada de <code>foo.png</code> .</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-110"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Cada píxel de datos de imagen del fotograma que se encuentra que está dentro de los parámetros que se consideran parte de la pantalla verde tiene su valor alfa reemplazado por un cero, lo que indica que el píxel es totalmente transparente.</span></span>  <span class="goog-gtc-unit" id="goog-gtc-unit-111"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Como resultado, la imagen final tiene toda el área de pantalla verde 100% transparente, de modo que cuando se dibuja en el contexto de destino en la línea 13, el resultado es una superposición sobre el fondo estático.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-112"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style="">La imagen resultante tiene este aspecto:</span></span></p>
-<p><img alt="output.png" class="internal default" src="/@api/deki/files/3283/=output.png" style="width: 161px; height: 96px;"></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-113"><span class="goog-gtc-translatable goog-gtc-from-human" dir="ltr" style="">Esto se hace en varias ocasiones mientras el video se reproduce, de manera que fotograma tras fotograma se procesa y se muestra con el efecto de croma.</span></span></p>
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-114"><span class="goog-gtc-translatable goog-gtc-from-mt" dir="ltr" style=""><a href="/samples/video/chroma-key/index.xhtml" title="samples/video/chroma-key/index.xhtml">Ver este ejemplo en vivo</a> .</span></span></p>
-<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-115"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Consulta también</span></span></h2>
-<ul>
- <li><a class="internal" href="/es/Usando_audio_y_video_en_Firefox" title="es/Usando audio y video en Firefox"><span class="goog-gtc-unit" id="goog-gtc-unit-116"><span class="goog-gtc-translatable goog-gtc-from-tm goog-gtc-from-tm-score-100" dir="ltr" style="">Usar audio y video en Firefox</span></span></a></li>
-</ul>
-<p>{{ languages ( { "en": "En/Manipulating_video_using_canvas" } ) }}</p>
diff --git a/files/es/web/html/atributos/accept/index.html b/files/es/web/html/atributos/accept/index.html
deleted file mode 100644
index b98ff8b644..0000000000
--- a/files/es/web/html/atributos/accept/index.html
+++ /dev/null
@@ -1,169 +0,0 @@
----
-title: 'HTML el atributo: accept'
-slug: Web/HTML/Atributos/accept
-tags:
-  - Accept
-  - Archivo
-  - Entrada
-  - Input
-  - Referencia
-  - atributo
-translation_of: Web/HTML/Attributes/accept
----
-<p class="summary"><span class="seoSummary">El atributo <strong><code>accept</code></strong> toma como valor una lista separada por comas de uno o más tipos de archivos, o {{anch("Especificadores de tipo de archivo únicos","especificadores de tipo de archivo únicos")}}, que describen qué tipos de archivo permitir. </span>La propiedad «<em>accept</em>» es un atributo del tipo {{HTMLElement("input/file", "file")}} {{HTMLElement("input")}}. Se admitía en el elemento {{HTMLElement("form")}}, pero se eliminó a favor de {{HTMLElement("input/file", "file")}} en HTML5.</p>
-
-<p>Debido a que un determinado tipo de archivo se puede identificar de más de una manera, es útil proporcionar un conjunto completo de especificadores de tipo cuando necesiten archivos de un tipo específico, o usar el comodín para indicar que un tipo de cualquier formato es aceptable.</p>
-
-<p>Por ejemplo, hay varias formas de identificar los archivos de Microsoft Word, por lo que un sitio que acepta archivos de Word puede usar un <code>&lt;input&gt;</code> como este:</p>
-
-<pre class="brush: html notranslate">&lt;input type="file" id="docpicker"
-  accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document"&gt;</pre>
-
-<p>Mientras que si aceptas un archivo multimedia, es posible que desees incluir cualquier formato de ese tipo de medio:</p>
-
-<pre class="brush: html notranslate">&lt;input type="file" id="soundFile" accept="audio/*"&gt;
-&lt;input type="file" id="videoFile" accept="video/*"&gt;
-&lt;input type="file" id="imageFile" accept="image/*"&gt;</pre>
-
-<p>El atributo <code>accept</code> no valida los tipos de archivos seleccionados; simplemente proporciona sugerencias para los navegadores para guiar a los usuarios hacia la selección de los tipos de archivo correctos. Todavía es posible (en la mayoría de los casos) que los usuarios cambien una opción en el selector de archivos que hace posible anular esto y seleccionar cualquier archivo que deseen, y luego elegir tipos de archivo incorrectos.</p>
-
-<p>Debido a esto, te debes asegurar de que el requisito esperado esté validado en el lado del servidor.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Cuando se configura en un tipo de entrada de archivo, el selector de archivos nativo que se abre solo debe permitir seleccionar archivos del tipo de archivo correcto. La mayoría de los sistemas operativos aligeran los archivos que no coinciden con los criterios y no se pueden seleccionar.</p>
-
-<div id="ejemplo_sencillo">
-<pre class="brush: html notranslate">&lt;p&gt;
-	&lt;label for="soundFile"&gt;Selecciona un archivo de audio:&lt;/label&gt;
-	&lt;input type="file" id="soundFile" accept="audio/*"&gt;
-	&lt;/p&gt;
-	&lt;p&gt;
-	&lt;label for="videoFile"&gt;Selecciona un archivo de video:&lt;/label&gt;
-	&lt;input type="file" id="videoFile" accept="video/*"&gt;
-	&lt;/p&gt;
-	&lt;p&gt;
-	&lt;label for="imageFile"&gt;Selecciona algunas imágenes:&lt;/label&gt;
-	&lt;input type="file" id="imageFile" accept="image/*" multiple&gt;
-	&lt;/p&gt;</pre>
-
-<p>{{EmbedLiveSample('ejemplo_sencillo', '100%', 200)}}</p>
-
-<p>Ten en cuenta que el último ejemplo te permite seleccionar varias imágenes. Consulta el atributo <code><a href="multiple">multiple</a></code> para obtener más información.</p>
-</div>
-
-<h2 id="Especificadores_de_tipo_de_archivo_únicos">Especificadores de tipo de archivo únicos</h2>
-
-<p>Un <strong>especificador de tipo de archivo único</strong> es una cadena que describe un tipo de archivo que el usuario puede seleccionar en un elemento {{HTMLElement("input")}} de tipo <code>file</code>. Cada especificador de tipo de archivo único puede adoptar una de las siguientes formas:</p>
-
-<ul>
- <li>Una extensión de nombre de archivo válida que no distingue entre mayúsculas y minúsculas, que comienza con un punto ("."). Por ejemplo: <code>.jpg</code>, <code>.pdf</code>, o <code>.doc</code>.</li>
- <li>Una cadena de tipo MIME válida, sin extensiones.</li>
- <li>La cadena <code>audio/*</code> significa "cualquier archivo de audio".</li>
- <li>La cadena <code>video/*</code> significa "cualquier archivo de video".</li>
- <li>La cadena <code>image/*</code> significa "cualquier archivo de imagen".</li>
-</ul>
-
-<p>El atributo <code>accept</code> toma como valor una cadena que contiene uno o más de estos especificadores de tipo de archivo únicos, separados por comas. Por ejemplo, un selector de archivos que necesita contenido que se puede presentar como una imagen, incluidos los formatos de imagen estándar y los archivos PDF, podría verse así:</p>
-
-<pre class="brush: html notranslate">&lt;input type="file" accept="image/*,.pdf"&gt;</pre>
-
-<h2 id="Usar_inputs_de_archivo">Usar <em>input</em>s de archivo</h2>
-
-<h3 id="Un_ejemplo_básico">Un ejemplo básico</h3>
-
-<pre class="brush: html notranslate">&lt;form method="post" enctype="multipart/form-data"&gt;
- &lt;div&gt;
-   &lt;label for="file"&gt;Elige el archivo a cargar&lt;/label&gt;
-   &lt;input type="file" id="file" name="file" multiple&gt;
- &lt;/div&gt;
- &lt;div&gt;
-   &lt;button&gt;Enviar&lt;/button&gt;
- &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">div {
-  margin-bottom: 10px;
-}</pre>
-</div>
-
-<p>Esto produce la siguiente salida:</p>
-
-<p>{{EmbedLiveSample('Un_ejemplo_básico', 650, 60)}}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: También puedes encontrar este ejemplo en GitHub; consulta <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/simple-file.html">código fuente</a> y también puedes <a href="https://mdn.github.io/learning-area/html/forms/file-examples/simple-file.html">verlo funcionando en vivo</a>.</p>
-</div>
-
-<p>Independientemente del dispositivo o sistema operativo del usuario, el <code>&lt;input&gt;</code> de archivo proporciona un botón que abre un cuadro de diálogo selector de archivos que permite al usuario elegir un archivo.</p>
-
-<p>La inclusión del atributo <code><a href="multiple">multiple</a></code>, como se muestra arriba, especifica que se pueden elegir varios archivos a la vez. El usuario puede elegir varios archivos del selector de archivos de cualquier manera que la plataforma elegida lo permita (por ejemplo, manteniendo presionada la tecla <kbd>Mayús</kbd> o <kbd>Control</kbd> y luego haciendo clic). Si solo deseas que el usuario elija un único archivo por <code>&lt;input&gt;</code>, omite el atributo <code>multiple</code>.</p>
-
-<h3 id="Limitar_los_tipos_de_archivo_aceptados">Limitar los tipos de archivo aceptados</h3>
-
-<p>A menudo, no querrás que el usuario pueda elegir cualquier tipo de archivo arbitrario; en su lugar, quieres que seleccionen archivos de un tipo o tipos específicos. Por ejemplo, si la entrada de tu archivo permite a los usuarios cargar una imagen de perfil, probablemente desees que seleccionen formatos de imagen compatibles con la web, como {{Glossary("JPEG")}} o {{Glossary("PNG")}}.</p>
-
-<p>Los tipos de archivo aceptables se pueden especificar con el atributo {{HTMLAttrxRef("accept", "input/file")}}, que toma una lista separada por comas de extensiones de archivo permitidas o tipos MIME. Algunos ejemplos:</p>
-
-<ul>
- <li><code>accept="image/png"</code> o <code>accept=".png"</code> — Acepta archivos PNG.</li>
- <li><code>accept="image/png, image/jpeg"</code> o <code>accept=".png, .jpg, .jpeg"</code> — Acepta archivos PNG o JPEG.</li>
- <li><code>accept="image/*"</code> — Acepta cualquier archivo con un tipo MIME de <code>image/*</code>. (Muchos dispositivos móviles también permiten que el usuario tome una foto con la cámara cuando se usa).</li>
- <li><code>accept=".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document"</code> — Acepta cualquier cosa que huela a un documento de MS Word.</li>
-</ul>
-
-<p>Veamos un ejemplo más completo:</p>
-
-<pre class="brush: html notranslate">&lt;form method="post" enctype="multipart/form-data"&gt;
-  &lt;div&gt;
-    &lt;label for="profile_pic"&gt;Elige el archivo para cargar&lt;/label&gt;
-    &lt;input type="file" id="profile_pic" name="profile_pic"
-          accept=".jpg, .jpeg, .png"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">div {
-  margin-bottom: 10px;
-}</pre>
-</div>
-
-<p>{{EmbedLiveSample('Limitar_los_tipos_de_archivo_aceptados', 650, 60)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'input.html#attr-input-accept', 'atributo accept')}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'sec-forms.html#attr-input-accept', 'Atributo accept')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.attribute.accept")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Using_files_from_web_applications", "Uso de archivos de aplicaciones web")}}</li>
- <li>{{web.link("/es/docs/Web/API/File", "API de File")}}</li>
-</ul>
diff --git a/files/es/web/html/atributos/autocomplete/index.html b/files/es/web/html/atributos/autocomplete/index.html
deleted file mode 100644
index b8546e368d..0000000000
--- a/files/es/web/html/atributos/autocomplete/index.html
+++ /dev/null
@@ -1,180 +0,0 @@
----
-title: The HTML autocomplete attribute
-slug: Web/HTML/Atributos/autocomplete
-translation_of: Web/HTML/Attributes/autocomplete
----
-<p>El atributo <code>autocomplete</code>  está disponible en varios tipos de  {{HTMLElement("input")}} aquellos que toman un texto o valor numérico como entrada. <span class="seoSummary"><code>autocomplete</code> </span> permite a los desarrolladores web especificar qué permisos si los hay <span class="seoSummary">{{Glossary("user agent")}} </span> debe proporcionar asistencia automatizada para completar los valores de los campos de formulario, así como una guía para el navegador en cuanto al tipo de información que se espera en el campo.</p>
-
-<p> </p>
-
-<p>Los valores sugeridos generalmente depende del navegador. Normalmente, provienen de valores ​​ingresados ​​por el usuario, pero también pueden provenir de valores preconfigurados. Por ejemplo, un navegador puede permitir que el usuario guarde su nombre, dirección, número de teléfono y direcciones de correo electrónico para autocompletar así como también datos de tarjetas de crédito.</p>
-
-<p>Si un elemento {{HTMLElement("input")}} no tiene el atributo <code>autocomplete</code> , entonces los navegadores usan el atributo <code>autocomplete</code> del {{HTMLElement("form")}} que lo contiene. En otras palabras, el {{HTMLElement("form")}} del que el {{HTMLElement("input")}} desciende. También puede ser especificado en el atributo {{htmlattrxref("form", "input")}} del {{HTMLElement("input")}} en cuestión.</p>
-
-<p>Para más información vea el atributo {{htmlattrxref("autocomplete", "form")}} del elemento {{HTMLElement("form")}}</p>
-
-<div class="blockIndicator note">
-<p>Para proveer el autocompletado, el navegador necesita del los elementos <code>&lt;input&gt;</code>:</p>
-
-<ol>
- <li>Que tengan <code>name</code> y/o <code>id</code></li>
- <li>Pertenezcan a un elemento <code>&lt;form&gt;</code></li>
- <li>Que el formulario tenga un botón {{HTMLElement("input/submit", "submit")}}</li>
-</ol>
-</div>
-
-<h2 id="Valores">Valores</h2>
-
-<dl>
- <dt><code>"off"</code></dt>
- <dd>The browser is not permitted to automatically enter or select a value for this field. It is possible that the document or application provides its own autocomplete feature, or that security concerns require that the field's value not be automatically entered.
- <div class="note"><strong>Note:</strong> In most modern browsers, setting <code>autocomplete</code> to <code>"off"</code> will not prevent a password manager from asking the user if they would like to save username and password information, or from automatically filling in those values in a site's login form. See <a href="/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#The_autocomplete_attribute_and_login_fields">the autocomplete attribute and login fields</a>.</div>
- </dd>
- <dt><code>"on"</code></dt>
- <dd>The browser is allowed to automatically complete the input. No guidance is provided as to the type of data expected in the field, so the browser may use its own judgement.</dd>
- <dt><code>"name"</code></dt>
- <dd>The field expects the value to be a person's full name. Using <code>"name"</code> rather than breaking the name down into its components is generally preferred because it avoids dealing with the wide diversity of human names and how they are structured; however, you can use the following <code>autocomplete</code> values if you do need to break the name down into its components:
- <dl>
-  <dt><code>"honorific-prefix"</code></dt>
-  <dd>The prefix or title, such as "Mrs.", "Mr.", "Miss", "Ms.", "Dr.", or "Mlle.".</dd>
-  <dt><code>"given-name"</code></dt>
-  <dd>The given (or "first") name.</dd>
-  <dt><code>"additional-name"</code></dt>
-  <dd>The middle name.</dd>
-  <dt><code>"family-name"</code></dt>
-  <dd>The family (or "last") name.</dd>
-  <dt><code>"honorific-suffix"</code></dt>
-  <dd>The suffix, such as "Jr.", "B.Sc.", "PhD.", "MBASW", or "IV".</dd>
-  <dt><code>"nickname"</code></dt>
-  <dd>A nickname or handle.</dd>
- </dl>
- </dd>
- <dt><code>"email"</code></dt>
- <dd>An email address.</dd>
- <dt><code>"username"</code></dt>
- <dd>A username or account name.</dd>
- <dt><code>"new-password"</code></dt>
- <dd>A new password. When creating a new account or changing passwords, this is the "Enter your new password" field, as opposed to any "Enter your current password" field that might be present. This may be used by the browser both to avoid accidentally filling in an existing password and to offer assistance in creating a secure password.</dd>
- <dt><code>"current-password"</code></dt>
- <dd>The user's current password.</dd>
- <dt><code>"organization-title"</code></dt>
- <dd>A job title, or the title a person has within an organization, such as "Senior Technical Writer", "President", or "Assistant Troop Leader".</dd>
- <dt><code>"organization"</code></dt>
- <dd>A company or organization name, such as "Acme Widget Company" or "Girl Scouts of America".</dd>
- <dt><code>"street-address"</code></dt>
- <dd>A street address. This can be multiple lines of text, and should fully identify the location of the address within its second administrative level (typically a city or town), but should not include the city name, ZIP or postal code, or country name.</dd>
- <dt><code>"address-line1"</code>, <code>"address-line2"</code>, <code>"address-line3"</code></dt>
- <dd>Each individual line of the street address. These should only be present if the <code>"street-address"</code> is also present.</dd>
- <dt><code>"address-level4"</code></dt>
- <dd>The finest-grained {{anch("Administrative levels in addresses", "administrative level")}}, in addresses which have four levels.</dd>
- <dt><code>"address-level3"</code></dt>
- <dd>The third {{anch("Administrative levels in addresses", "administrative level")}}, in addresses with at least three administrative levels.</dd>
- <dt><code>"address-level2"</code></dt>
- <dd>The second {{anch("Administrative levels in addresses", "administrative level")}}, in addresses with at least two of them. In countries with two administrative levels, this would typically be the city, town, village, or other locality in which the address is located.</dd>
- <dt><code>"address-level1"</code></dt>
- <dd>The first {{anch("Administrative levels in addresses", "administrative level")}} in the address. This is typically the province in which the address is located. In the United States, this would be the state. In Switzerland, the canton. In the United Kingdom, the post town.</dd>
- <dt><code>"country"</code></dt>
- <dd>A country code.</dd>
- <dt><code>"country-name"</code></dt>
- <dd>A country name.</dd>
- <dt><code>"postal-code"</code></dt>
- <dd>A postal code (in the United States, this is the ZIP code).</dd>
- <dt><code>"cc-name"</code></dt>
- <dd>The full name as printed on or associated with a payment instrument such as a credit card. Using a full name field is preferred, typically, over breaking the name into pieces.</dd>
- <dt><code>"cc-given-name"</code></dt>
- <dd>A given (first) name as given on a payment instrument like a credit card.</dd>
- <dt><code>"cc-additional-name"</code></dt>
- <dd>A middle name as given on a payment instrument or credit card.</dd>
- <dt><code>"cc-family-name"</code></dt>
- <dd>A family name, as given on a credit card.</dd>
- <dt><code>"cc-number"</code></dt>
- <dd>A credit card number or other number identifying a payment method, such as an account number.</dd>
- <dt><code>"cc-exp"</code></dt>
- <dd>A payment method expiration date, typically in the form "MM/YY" or "MM/YYYY".</dd>
- <dt><code>"cc-exp-month"</code></dt>
- <dd>The month in which the payment method expires.</dd>
- <dt><code>"cc-exp-year"</code></dt>
- <dd>The year in which the payment method expires.</dd>
- <dt><code>"cc-csc"</code></dt>
- <dd>The security code for the payment instrument; on credit cards, this is the 3-digit verification number on the back of the card.</dd>
- <dt><code>"cc-type"</code></dt>
- <dd>The type of payment instrument (such as "Visa" or "Master Card").</dd>
- <dt><code>"transaction-currency"</code></dt>
- <dd>The currency in which the transaction is to take place.</dd>
- <dt><code>"transaction-amount"</code></dt>
- <dd>The amount, given in the currency specified by <code>"transaction-currency"</code>, of the transaction, for a payment form.</dd>
- <dt><code>"language"</code></dt>
- <dd>A preferred language, given as a valid <a href="https://en.wikipedia.org/wiki/IETF_language_tag">BCP 47 language tag</a>.</dd>
- <dt><code>"bday"</code></dt>
- <dd>A birth date, as a full date.</dd>
- <dt><code>"bday-day"</code></dt>
- <dd>The day of the month of a birth date.</dd>
- <dt><code>"bday-month"</code></dt>
- <dd>The month of the year of a birth date.</dd>
- <dt><code>"bday-year"</code></dt>
- <dd>The year of a birth date.</dd>
- <dt><code>"sex"</code></dt>
- <dd>A gender identity (such as "Female", "Fa'afafine", "Male"), as freeform text without newlines.</dd>
- <dt><code>"tel"</code></dt>
- <dd>A full telephone number, including the country code. If you need to break the phone number up into its components, you can use these values for those fields:
- <dl>
-  <dt><code>"tel-country-code"</code></dt>
-  <dd>The country code, such as "1" for the United States, Canada, and other areas in North America and parts of the Caribbean.</dd>
-  <dt><code>"tel-national"</code></dt>
-  <dd>The entire phone number without the country code component, including a country-internal prefix. For the phone number "1-855-555-6502", this field's value would be "855-555-6502".</dd>
-  <dt><code>"tel-area-code"</code></dt>
-  <dd>The area code, with any country-internal prefix applied if appropriate.</dd>
-  <dt><code>"tel-local"</code></dt>
-  <dd>The phone number without the country or area code. This can be split further into two parts, for phone numbers which have an exchange number and then a number within the exchange. For the phone number "555-6502", use <code>"tel-local-prefix"</code> for "555" and <code>"tel-local-suffix"</code> for "6502".</dd>
- </dl>
- </dd>
- <dt><code>"tel-extension"</code></dt>
- <dd>A telephone extension code within the phone number, such as a room or suite number in a hotel or an office extension in a company.</dd>
- <dt><code>"impp"</code></dt>
- <dd>A URL for an instant messaging protocol endpoint, such as "xmpp:username@example.net".</dd>
- <dt><code>"url"</code></dt>
- <dd>A URL, such as a home page or company web site address as appropriate given the context of the other fields in the form.</dd>
- <dt><code>"photo"</code></dt>
- <dd>The URL of an image representing the person, company, or contact information given in the other fields in the form.</dd>
-</dl>
-
-<p>See the <a href="https://html.spec.whatwg.org/multipage/forms.html#autofill">WHATWG Standard</a> for more detailed information.</p>
-
-<div class="note">
-<p><strong>Note:</strong> The <code>autocomplete</code> attribute also controls whether Firefox will — unlike other browsers — <a href="https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">persist the dynamic disabled state and (if applicable) dynamic checkedness</a> of an <code>&lt;input&gt;</code> across page loads. The persistence feature is enabled by default. Setting the value of the <code>autocomplete</code> attribute to <code>off</code> disables this feature. This works even when the <code>autocomplete</code> attribute would normally not apply to the <code>&lt;input&gt;</code> by virtue of its <code>type</code>. See {{bug(654072)}}.</p>
-</div>
-
-<h2 id="Administrative_levels_in_addresses">Administrative levels in addresses</h2>
-
-<p>The four administrative level fields (<code>"address-level1"</code> through <code>"address-level4"</code>) describe the address in terms of increasing levels of precision within the country in which the address is located. Each country has its own system of administrative levels, and may arrange the levels in different orders when addresses are written.</p>
-
-<p><code>"address-level1"</code> always represents the broadest administrative division; it is the least-specific portion of the address short of the country name.</p>
-
-<h3 id="Form_layout_flexibility">Form layout flexibility</h3>
-
-<p>Given that different countries write their address in different ways, with each field in different places within the address, and even different sets and numbers of fields entirely, it can be helpful if, when possible, your site is able to switch to the layout expected by your users when presenting an address entry form, given the country the address is located within.</p>
-
-<h3 id="Variations">Variations</h3>
-
-<p>The way each administrative level is used will vary from country to country. Below are some examples; this is not meant to be an exhaustive list.</p>
-
-<h4 id="United_States">United States</h4>
-
-<p>A typical home address within the United States looks like this:</p>
-
-<p>432 Anywhere St<br>
- Exampleville CA 95555</p>
-
-<p>In the United States, the least-specific portion of the address is the state, in this case "CA" (the official US Postal Service shorthand for "California"). Thus <code>"address-level1"</code> is the state, or "CA" in this case.</p>
-
-<p>The second-least specific portion of the address is the city or town name, so <code>"address-level2"</code> is "Exampleville" in this example address.</p>
-
-<p>United States addresses do not use levels 3 and up.</p>
-
-<h4 id="United_Kingdom">United Kingdom</h4>
-
-<p>The UK uses one or two address levels, depending on the address. These are the post town and, in some instances, the locality.</p>
-
-<h4 id="China">China</h4>
-
-<p>China can use as many as three administrative levels: the province, the city, and the district.</p>
diff --git a/files/es/web/html/atributos/index.html b/files/es/web/html/atributos/index.html
deleted file mode 100644
index 03e7d8baee..0000000000
--- a/files/es/web/html/atributos/index.html
+++ /dev/null
@@ -1,677 +0,0 @@
----
-title: Referencia de Atributos HTML
-slug: Web/HTML/Atributos
-tags:
-  - HTML
-  - Referencia
-  - Web
-  - atributo
-translation_of: Web/HTML/Attributes
----
-<p>Los elementos en HTML tienen <strong>atributos</strong>; estos son valores adicionales que configuran los elementos o ajustan su comportamiento de diversas formas para cumplir los criterios de los usuarios.</p>
-
-<h2 id="Lista_de_Atributos">Lista de Atributos</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th>Nombre del Atributo</th>
-   <th>Elementos</th>
-   <th>Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>accept</code></td>
-   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
-   <td>Lista de tipos aceptados por el servidor, usualmente un tipo de archivo.</td>
-  </tr>
-  <tr>
-   <td><code>accept-charset</code></td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>Lista de juegos de caracteres soportados.</td>
-  </tr>
-  <tr>
-   <td><code>accesskey</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_Globales" title="/es/docs/Web/HTML/Atributos_Globales">Atributos Globales</a></td>
-   <td>Define una tecla que activa o agrega un foco al elemento.</td>
-  </tr>
-  <tr>
-   <td><code>action</code></td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>La URL del programa que procesa la información enviada en el formulario.</td>
-  </tr>
-  <tr>
-   <td><code>align</code></td>
-   <td>{{ HTMLElement("applet") }}, {{ HTMLElement("caption") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }},  {{ HTMLElement("hr") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }},  {{ HTMLElement("td") }},  {{ HTMLElement("tfoot") }} , {{ HTMLElement("th") }}, {{ HTMLElement("thead") }}, {{ HTMLElement("tr") }}</td>
-   <td>Especifica el alineamiento horizontal del elemento.</td>
-  </tr>
-  <tr>
-   <td><code>alt</code></td>
-   <td>{{ HTMLElement("applet") }}, {{ HTMLElement("area") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}</td>
-   <td>Texto alternativo en caso de que la imagen no se pueda mostrar.</td>
-  </tr>
-  <tr>
-   <td><code>async</code></td>
-   <td>{{ HTMLElement("script") }}</td>
-   <td>Indica que el script debería ejecutarse asincrónicamente.</td>
-  </tr>
-  <tr>
-   <td><code>autocomplete</code></td>
-   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
-   <td>Indica si los controles en este formulario pueden tener por defecto sus valores completados automáticamente por el navegador.</td>
-  </tr>
-  <tr>
-   <td><code>autofocus</code></td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>El elemento debería recibir foco automáticamente después de haberse cargado la página.</td>
-  </tr>
-  <tr>
-   <td><code>autoplay</code></td>
-   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
-   <td>El audio o video debería empezar lo antes posible.</td>
-  </tr>
-  <tr>
-   <td><code>autosave</code></td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Previous values should persist dropdowns of selectable values across page loads.</td>
-  </tr>
-  <tr>
-   <td><code>bgcolor</code></td>
-   <td>{{ HTMLElement("body") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }}, {{ HTMLElement("tfoot") }}, {{ HTMLElement("td") }}, {{ HTMLElement("th") }}, {{ HTMLElement("tr") }}</td>
-   <td>
-    <p>Color de fondo del elemento.</p>
-
-    <div class="note">
-    <p><strong>Nota:</strong> Este atributo se mantiene como referencia. Por favor usa la propiedad CSS {{ Cssxref("background-color") }} en su lugar.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>border</code></td>
-   <td>{{ HTMLElement("img") }}, {{ HTMLElement("object") }}, {{ HTMLElement("table") }}</td>
-   <td>
-    <p>El ancho del borde.</p>
-
-    <div class="note">
-    <p><strong>Nota:</strong> Este atributo se mantiene como referencia. Por favor usa la propiedad CSS {{ Cssxref("border") }} en su lugar.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>buffered</code></td>
-   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
-   <td>Contiene un rango de tiempo multimedia almacenado.</td>
-  </tr>
-  <tr>
-   <td><code>challenge</code></td>
-   <td>{{ HTMLElement("keygen") }}</td>
-   <td>Cadena de desafío que se envía junto con la clave pública.</td>
-  </tr>
-  <tr>
-   <td><code>charset</code></td>
-   <td>{{ HTMLElement("meta") }}, {{ HTMLElement("script") }}</td>
-   <td>Declara la codificación de caracteres de la página o del script.</td>
-  </tr>
-  <tr>
-   <td><code>checked</code></td>
-   <td>{{ HTMLElement("command") }}, {{ HTMLElement("input") }}</td>
-   <td>Indica que el elemento debería estar marcado al cargar la página.</td>
-  </tr>
-  <tr>
-   <td><code>cite</code></td>
-   <td>{{ HTMLElement("blockquote") }}, {{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("q") }}</td>
-   <td>Contiene una URL que apunta a la fuente de la cita o cambio.</td>
-  </tr>
-  <tr>
-   <td><code>class</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Usualmente empleado con CSS para aplicar estilos a elementos con propiedades en comun.</td>
-  </tr>
-  <tr>
-   <td><code>code</code></td>
-   <td>{{ HTMLElement("applet") }}</td>
-   <td>Especifica la URL del archivo de tipo applet a ser cargado y ejecutado.</td>
-  </tr>
-  <tr>
-   <td><code>codebase</code></td>
-   <td>{{ HTMLElement("applet") }}</td>
-   <td>Este atributo contiene la URL absoluta o relativa del directorio donde los archivos de applets (.class) referenciados en el codigo se encuentran almacenados.</td>
-  </tr>
-  <tr>
-   <td><code>color</code></td>
-   <td>{{ HTMLElement("basefont") }}, {{ HTMLElement("font") }}, {{ HTMLElement("hr") }}</td>
-   <td>
-    <p>Este atributo establece el color de texto utilizando un nombre de color o en formato hexadecimal #RRGGBB.</p>
-
-    <div class="note">
-    <p><strong>Nota:</strong> Este atributo se mantiene como referencia. Por favor usa la propiedad CSS {{ Cssxref("color") }} en su lugar.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>cols</code></td>
-   <td>{{ HTMLElement("textarea") }}</td>
-   <td>Define el número de columnas en un área de texto.</td>
-  </tr>
-  <tr>
-   <td><code>colspan</code></td>
-   <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td>
-   <td>Define el número de columnas que una celda debe contener.</td>
-  </tr>
-  <tr>
-   <td><code>content</code></td>
-   <td>{{ HTMLElement("meta") }}</td>
-   <td>Un valor asociado con <code>http-equiv</code> o <code>name</code> dependiendo del contexto.</td>
-  </tr>
-  <tr>
-   <td><code>contenteditable</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Indica si el contenido del elemento es editable.</td>
-  </tr>
-  <tr>
-   <td><code>contextmenu</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Define el ID del elemento {{ HTMLElement("menu") }} que servira como menú de contexto para otro elemento.</td>
-  </tr>
-  <tr>
-   <td><code>controls</code></td>
-   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
-   <td>Indica si el navegador debe mostrar controles de reproduccion al usuario.</td>
-  </tr>
-  <tr>
-   <td><code>coords</code></td>
-   <td>{{ HTMLElement("area") }}</td>
-   <td>Un conjunto de valores que especifican las coordenadas del area.</td>
-  </tr>
-  <tr>
-   <td><code>data</code></td>
-   <td>{{ HTMLElement("object") }}</td>
-   <td>Especifica la URL del recurso.</td>
-  </tr>
-  <tr>
-   <td><code>data-*</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Permite asociar atributos presonalizados a un elemento HTML.</td>
-  </tr>
-  <tr>
-   <td><code>datetime</code></td>
-   <td>{{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("time") }}</td>
-   <td>Indica la fecha y hora asociadas con el elemento.</td>
-  </tr>
-  <tr>
-   <td><code>default</code></td>
-   <td>{{ HTMLElement("track") }}</td>
-   <td>Indica que la pista debe estar habilitada a menos que las preferencias del usuario indiquen algo diferente.</td>
-  </tr>
-  <tr>
-   <td><code>defer</code></td>
-   <td>{{ HTMLElement("script") }}</td>
-   <td>Indica que el código debe ser ejecutado despues de que la página este cargada.</td>
-  </tr>
-  <tr>
-   <td><code>dir</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Define la dirección del texto. Los valores permitidos son ltr (Izquierda-a-Derecha) o rtl (Derecha-a-Izquierda).</td>
-  </tr>
-  <tr>
-   <td><code>dirname</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica la dirección del texto asociada con el elemento al momento de enviar el formulario.</td>
-  </tr>
-  <tr>
-   <td><code>disabled</code></td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("command") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica si el usuario puede interactuar con el elemento.</td>
-  </tr>
-  <tr>
-   <td><code>download</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td>
-   <td>Indica que el hipervínculo es utilizado para descargar un recurso.</td>
-  </tr>
-  <tr>
-   <td><code>draggable</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Define si el elemento puede ser arrastrado.</td>
-  </tr>
-  <tr>
-   <td><code>dropzone</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Indica que el elemento acepta contenido soltado en el mismo.</td>
-  </tr>
-  <tr>
-   <td><code>enctype</code></td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>Define el tipo de contenido del formulario cuando el <code>método</code> del mismo es POST.</td>
-  </tr>
-  <tr>
-   <td><code>for</code></td>
-   <td>{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td>
-   <td>Describe elementos que pertenecen a éste.</td>
-  </tr>
-  <tr>
-   <td><code>form</code></td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica el formulario al que pertenece el elemento.</td>
-  </tr>
-  <tr>
-   <td><code>formaction</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("button") }}</td>
-   <td>Indica la acción del elemento, anulando la acción definida en {{ HTMLElement("form") }}.</td>
-  </tr>
-  <tr>
-   <td><code>headers</code></td>
-   <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td>
-   <td>IDs de los elementos <code>&lt;th&gt;</code> que aplican a este elemento.</td>
-  </tr>
-  <tr>
-   <td><code>height</code></td>
-   <td>{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td>
-   <td>
-    <p>Especifica la altura de los elementos enumerados aquí. Para todos los demás elementos, usa la propiedad CSS {{cssxref("height")}} en su lugar.</p>
-
-    <div class="note">
-    <p><strong>Nota:</strong> En algunos casos, como los {{ HTMLElement("div") }}, este es un atributo de referencia, en donde debes usar la propiedad CSS {{ Cssxref("height") }} en su lugar.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>hidden</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Evita la prestación del elemento dado, manteniendo los elementos secundarios, p.ej. los elementos de script</td>
-  </tr>
-  <tr>
-   <td><code>high</code></td>
-   <td>{{ HTMLElement("meter") }}</td>
-   <td>Indica el menor valor del rango alto.</td>
-  </tr>
-  <tr>
-   <td><code>href</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("link") }}</td>
-   <td>La URL de un recurso asociado.</td>
-  </tr>
-  <tr>
-   <td><code>hreflang</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td>
-   <td>Especifica el lenguaje del recurso asociado.</td>
-  </tr>
-  <tr>
-   <td><code>http-equiv</code></td>
-   <td>{{ HTMLElement("meta") }}</td>
-   <td>Indica una directiva que puede alterar el comportamiento de la pagina y como es leida por los exploradores.</td>
-  </tr>
-  <tr>
-   <td><code>icon</code></td>
-   <td>{{ HTMLElement("command") }}</td>
-   <td>
-    <p>Especifica una imagen relacionada con el comando.</p>
-
-    <div class="note">
-    <p><strong>Note:</strong> El elemento {{ HTMLElement("command") }} es obsoleto y no se recomienda su uso.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>id</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Identificador el elemento para acceder al mismo desde CSS o Javascript, este indicador debe ser unico para cada elemento.</td>
-  </tr>
-  <tr>
-   <td><code>ismap</code></td>
-   <td>{{ HTMLElement("img") }}</td>
-   <td>Indica que la imagen es parte de un mapa de imagen del servidor.</td>
-  </tr>
-  <tr>
-   <td><code>itemprop</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Indica que el elemento contiene el valor de la propiedad especificada de un conjunto.</td>
-  </tr>
-  <tr>
-   <td><code>keytype</code></td>
-   <td>{{ HTMLElement("keygen") }}</td>
-   <td>
-    <p>Especifica el tipo de clave generada.</p>
-
-    <div class="note">
-    <p><strong>Nota:</strong> RSA es el valor por defecto.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>kind</code></td>
-   <td>{{ HTMLElement("track") }}</td>
-   <td>Specifies the kind of text track.</td>
-  </tr>
-  <tr>
-   <td><code>label</code></td>
-   <td>{{ HTMLElement("track") }}</td>
-   <td>Especifica el título de la pista con un formato legible por el usuario.</td>
-  </tr>
-  <tr>
-   <td><code>lang</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Define el lenguaje utilizado en el elemento.</td>
-  </tr>
-  <tr>
-   <td><code>language</code></td>
-   <td>{{ HTMLElement("script") }}</td>
-   <td>Define el lenguage (de programación) utilizado en el elemento.</td>
-  </tr>
-  <tr>
-   <td><code>list</code></td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Identifica una serie de valores predefinidos para ser sugeridos al usuario.</td>
-  </tr>
-  <tr>
-   <td><code>loop</code></td>
-   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("bgsound") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("video") }}</td>
-   <td>Indica si el medio debe volver a ser reproducido desde el principio al llegar al final.</td>
-  </tr>
-  <tr>
-   <td><code>low</code></td>
-   <td>{{ HTMLElement("meter") }}</td>
-   <td>Indica el valor mas alto del rango bajo.</td>
-  </tr>
-  <tr>
-   <td><code>manifest</code></td>
-   <td>{{ HTMLElement("html") }}</td>
-   <td>Especifica la URL del manifiesto de cache para el documento.</td>
-  </tr>
-  <tr>
-   <td><code>max</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
-   <td>Indica el máximo valor aceptado.</td>
-  </tr>
-  <tr>
-   <td><code>maxlength</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Define el mayor número de caracteres aceptados.</td>
-  </tr>
-  <tr>
-   <td><code>media</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}</td>
-   <td>Da un indicio del tipo de medio para el cual el recurso vinculado fue creado.</td>
-  </tr>
-  <tr>
-   <td><code>method</code></td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>Define el método <a href="/es/docs/Web/HTTP">HTTP</a> a emplear para enviar el formulario. Puede ser <code>GET</code> (predeterminado) o <code>POST</code>.</td>
-  </tr>
-  <tr>
-   <td><code>min</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td>
-   <td>Indica el valor mínimo aceptado.</td>
-  </tr>
-  <tr>
-   <td><code>multiple</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
-   <td>Indica si múltiples valores pueden ser ingresados.</td>
-  </tr>
-  <tr>
-   <td><code>muted</code></td>
-   <td>{{ HTMLElement("video") }}</td>
-   <td>Indica si el audio será silenciado inicialmente al cargar la página.</td>
-  </tr>
-  <tr>
-   <td><code>name</code></td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}, {{ HTMLElement("map") }}, {{ HTMLElement("meta") }}, {{ HTMLElement("param") }}</td>
-   <td>Nombre del elemento. Por ejemplo utilizado por el servidor para identificar los campos en el envio de formularios.</td>
-  </tr>
-  <tr>
-   <td><code>novalidate</code></td>
-   <td>{{ HTMLElement("form") }}</td>
-   <td>Este atributo indica que el formulario no debe ser validado cuando se envíe.</td>
-  </tr>
-  <tr>
-   <td><code>open</code></td>
-   <td>{{ HTMLElement("details") }}</td>
-   <td>Indica si los detalles de la página seran mostrados cuando cargue la misma.</td>
-  </tr>
-  <tr>
-   <td><code>optimum</code></td>
-   <td>{{ HTMLElement("meter") }}</td>
-   <td>Indica el valor numérico óptimo.</td>
-  </tr>
-  <tr>
-   <td><code>pattern</code></td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Define una expresion regular con la cual el valor del elemento debe ser validado.</td>
-  </tr>
-  <tr>
-   <td><code>ping</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td>
-   <td>Indica si se enviara un ping o notificacion a la URL del recurso cuando el usuario utlize el vinculo.</td>
-  </tr>
-  <tr>
-   <td><code>placeholder</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Proporciona una sugerencia al usuario de lo que puede ser introducido en el campo.</td>
-  </tr>
-  <tr>
-   <td><code>poster</code></td>
-   <td>{{ HTMLElement("video") }}</td>
-   <td>Una URL que indica un cuadro a mostrar hasta que el usuario reproduzca o navegue en el video.</td>
-  </tr>
-  <tr>
-   <td><code>preload</code></td>
-   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
-   <td>Indica si el recurso o partes del mismo deben ser precargadas.</td>
-  </tr>
-  <tr>
-   <td>pubdate</td>
-   <td>{{ HTMLElement("time") }}</td>
-   <td>Indica si esta fecha y tiempo concuerda con la fecha y tiempo del {{ HTMLElement("article") }} mas cercano (ancestro).</td>
-  </tr>
-  <tr>
-   <td><code>radiogroup</code></td>
-   <td>{{ HTMLElement("command") }}</td>
-   <td>
-    <p>Indica los nombres de los comandos de tipo radio, que seran alternados si el comando en si es alternado. Este atributo debe ser omitido si el tipo de comando no es radio.</p>
-
-    <div class="note">
-    <p><strong>Note:</strong> El elemento {{ HTMLElement("command") }} es obsoleto y no se recomienda su uso.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>readonly</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica si el elemento puede ser editado por el usuario.</td>
-  </tr>
-  <tr>
-   <td><code>rel</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td>
-   <td>Especifica la relación entre el objeto destino y el objeto enlace.</td>
-  </tr>
-  <tr>
-   <td><code>required</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
-   <td>Indica si se requiere rellenar o no este elemento.</td>
-  </tr>
-  <tr>
-   <td><code>reversed</code></td>
-   <td>{{ HTMLElement("ol") }}</td>
-   <td>Indica si la lista debe ser mostrada en orden descendente en vez de ascendente.</td>
-  </tr>
-  <tr>
-   <td><code>rows</code></td>
-   <td>{{ HTMLElement("textarea") }}</td>
-   <td>Define el número de filas en un área de texto.</td>
-  </tr>
-  <tr>
-   <td><code>rowspan</code></td>
-   <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td>
-   <td>Define el número de filas que una celda de una tabla debe abarcar.</td>
-  </tr>
-  <tr>
-   <td><code>sandbox</code></td>
-   <td>{{ HTMLElement("iframe") }}</td>
-   <td>Lista de restricciones a ser desactivadas en el iframe.</td>
-  </tr>
-  <tr>
-   <td><code>scope</code></td>
-   <td>{{ HTMLElement("th") }}</td>
-   <td>Define las celdas que la cabecera definió en este elemento.</td>
-  </tr>
-  <tr>
-   <td><code>scoped</code></td>
-   <td>{{ HTMLElement("style") }}</td>
-   <td>Indica si el estilo será aplicado sólo al elemento inmediato superior (padre). de no ser definido, el estilo se aplicara de forma global.</td>
-  </tr>
-  <tr>
-   <td><code>seamless</code></td>
-   <td>{{ HTMLElement("iframe") }}</td>
-   <td>Indica si el iframe debe ser cargado como parte del mismo documento.</td>
-  </tr>
-  <tr>
-   <td><code>selected</code></td>
-   <td>{{ HTMLElement("option") }}</td>
-   <td>Define un valor que será seleccionado al cargar la página.</td>
-  </tr>
-  <tr>
-   <td><code>shape</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td>
-   <td>Define una región seleccionable para hacer hipervínculos asociados con una forma asociada a una figura para crear un mapa. Los valores para este atributo son: <code>circle</code>, <code>defaul</code>, <code>plygon</code> y <code>rect</code>.</td>
-  </tr>
-  <tr>
-   <td><code>size</code></td>
-   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
-   <td>Define el ancho del elemento (en píxeles). Si el atributo del elemento es del <code>tipo</code> <code>text</code> o <code>password</code> entonces es el número de caracteres.</td>
-  </tr>
-  <tr>
-   <td><code>sizes</code></td>
-   <td>{{ HTMLElement("link") }}, {{ HTMLElement("img") }}, {{ HTMLElement("source") }}</td>
-   <td>Define los tamaños en los que el icono puede ser cargado.</td>
-  </tr>
-  <tr>
-   <td><code>span</code></td>
-   <td>{{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}</td>
-   <td>Indica el número de columnas que se agrupan.</td>
-  </tr>
-  <tr>
-   <td><code>spellcheck</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Indica si se permite la corrección ortográfica para el elemento.</td>
-  </tr>
-  <tr>
-   <td><code>src</code></td>
-   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("track") }}, {{ HTMLElement("video") }}</td>
-   <td>La URL del contenido integrable.</td>
-  </tr>
-  <tr>
-   <td><code>srcdoc</code></td>
-   <td>{{ HTMLElement("iframe") }}</td>
-   <td>Especifica el contenido de la página incluida.</td>
-  </tr>
-  <tr>
-   <td><code>srclang</code></td>
-   <td>{{ HTMLElement("track") }}</td>
-   <td>Especifica el lenguaje del contenido de la pista.</td>
-  </tr>
-  <tr>
-   <td><code>srcset</code></td>
-   <td>{{ HTMLElement("img") }}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td><code>start</code></td>
-   <td>{{ HTMLElement("ol") }}</td>
-   <td>Define el número inicial de la lista (si es diferente a 1).</td>
-  </tr>
-  <tr>
-   <td><code>step</code></td>
-   <td>{{ HTMLElement("input") }}</td>
-   <td>Indica el valor del incremento para un valor numerico o de fecha.</td>
-  </tr>
-  <tr>
-   <td><code>style</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Define los estilos CSS que anulan los estilos establecidos previamente.</td>
-  </tr>
-  <tr>
-   <td><code>summary</code></td>
-   <td>{{ HTMLElement("table") }}</td>
-   <td>
-    <p>Contiene una descripción del contenido de la tabla.</p>
-
-    <p>Nota: Este atributo ha sido desaprovado, se recomienda incluir un elemento {{ HTMLElement("caption") }} en la tabla.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>tabindex</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Sobrescribe el orden de tabulacion del navegador y usa el especificado.</td>
-  </tr>
-  <tr>
-   <td><code>target</code></td>
-   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("form") }}</td>
-   <td>
-    <p>Especifica el marco destino en un vínculo.</p>
-
-    <p>Valores especiales: "_blank" indica una nueva ventana, "_parent" indica el marco padre del marco que contiene el código fuente, "_self" indica el marco donde está el código fuente y "_top" indica la ventana completa del navegador.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>title</code></td>
-   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
-   <td>Texto a ser mostrado cuando el cursor esté sobre el elemento.</td>
-  </tr>
-  <tr>
-   <td><code>type</code></td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("command") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("object") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}, {{ HTMLElement("menu") }}</td>
-   <td>Define el tipo de elemento.</td>
-  </tr>
-  <tr>
-   <td><code>usemap</code></td>
-   <td>{{ HTMLElement("img") }},  {{ HTMLElement("input") }}, {{ HTMLElement("object") }}</td>
-   <td>
-    <p>Indica la URL parcial de un image map asociado con el elemento.</p>
-
-    <div class="note">
-    <p><strong>Note:</strong> Este atributo no puede ser usado si el elemento {{ HTMLElement("img") }} desciende de un {{ HTMLElement("button") }} o {{ HTMLElement("a") }}</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>value</code></td>
-   <td>{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("li") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("param") }}</td>
-   <td>Define el valor predeterminado a ser mostrado al cargar la página.</td>
-  </tr>
-  <tr>
-   <td><code>width</code></td>
-   <td>{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td>
-   <td>
-    <p>Para los elementos enumerados aquí, esto establece el ancho del elemento.</p>
-
-    <div class="note">
-    <p><strong>Nota:</strong> En algunos casos, como los {{ HTMLElement("div") }}, este es un atributo de referencia, en donde debes usar la propiedad CSS {{ Cssxref("height") }} en su lugar.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>wrap</code></td>
-   <td>{{ HTMLElement("textarea") }}</td>
-   <td>Indica la forma en la cual el texto debe ser envuelto.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Contenido_versus_atributos_IDL">Contenido versus atributos IDL</h2>
-
-<p>En HTML, la mayoria de los atributos tiene dos caras: el <strong>atributo de contenido</strong> y el <strong>atributo IDL</strong></p>
-
-<p>El atributo de contenido es aquel que se define desde el contenido (Codigo HTML) y puedes definirlo u obtenerlo con {{domxref("element.setAttribute()")}} o {{domxref("element.getAttribute()")}}. El atributo de contenido es siempre un string incluso cuando el valor esperado en un integer. Por ejemplo, para definir el maxlength de un {{HTMLElement("input")}} a 42 usando el atributo de contenido, se debe llamar a <code>setAttribute("maxlength", "42") en ese elemento.</code></p>
-
-<p>El atributo IDL, tambien conocido como propiedad JavaScript. Estos son atributos que se pueden leer o definir usando JavaScript como <code>element.foo.</code>. El atributo IDL siempre va a usar (pero puede transformarse) en el atributo de contenido subyacente para retornar un valor cuando lo obtiene y lo guarda en el atributo de contenido cuando es definido. En otras palabras el atributo IDL, en esencia, refleja los atributos de contenido.</p>
-
-<p>La mayoria del tiempo, los atributos IDL pueden retornar sus valores como realmente son usados. Por ejemplo, el <code>type</code> por defecto para los elementos {{HTMLElement("input")}} es "texto", entonces si defines <code>input.type="foobar",</code> el elemento <code>&lt;input&gt;</code> sera de tipo texto (en apariencia y comportamiento) pero el valor del Atributo de contenido "type" sera "foobat". De cualquier manera, el <code>type</code> del atributo IDL retornara el string "text".</p>
-
-<p>Los atributos IDL no son siempre strings; por ejemplo, <code>input.maxlength</code> es un numero (marcado como long). Cuando se usan atributos IDL, lees o defines valores del tipo deseado, entonces <code>input.maxlength </code>siempre retornara un numero y cuando definas <code>input,maxlength</code>, esperara un numero. Si se le entrega otro tipo, se convierte antomaticamente a numero como se especifica en las reglas del  estandar de JavaScript para conversiones de tipo.</p>
-
-<p>Los atributos IDL pueden <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">reflejar otros tipos</a> como un long sin asignacion, URL's, booleanos, etc. Desafortunadamente no hay reglas claras y el comportamiento que los atributos IDL en conjunto con sus respectivos atributos de contenido depende del mismo atributo. La mayoria del tiempo, siguen <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">las reglas de diseño en la especificacion</a>, pero algunas veces no lo hacen. Las especificaciones HTML tratan de ser lo mas amigables para el dasarrollador como es posible, pero por varias razones (mayormente historicas), algunos aributos se comportan de forma extraña (<code>select.size</code>, por ejemplo) y debes leer las especificaciones para comprender como éste se comporta exactamente.</p>
-
-<h2 id="Ver_Tambien">Ver Tambien</h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Elemento" title="/es/docs/Web/HTML/Elemento">Elementos</a></li>
-</ul>
diff --git a/files/es/web/html/atributos/min/index.html b/files/es/web/html/atributos/min/index.html
deleted file mode 100644
index 4060bd81f4..0000000000
--- a/files/es/web/html/atributos/min/index.html
+++ /dev/null
@@ -1,162 +0,0 @@
----
-title: 'HTML el atributo: min'
-slug: Web/HTML/Atributos/min
-tags:
-  - Atributos
-  - Restricción de validación
-  - atributo
-  - min
-translation_of: Web/HTML/Attributes/min
----
-<div id="step-include">
-<p><span class="seoSummary">El atributo {{HTMLAttrxRef("min", "input")}} define el valor mínimo que es aceptable y válido para el {{HTMLElement("input")}} que contiene el atributo. Si el {{web.link("/es/docs/Web/HTML/Element/input#attr-value", "value")}} del elemento es menor que esto, el elemento falla la {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}}. Este valor debe ser menor o igual que el valor del atributo {{HTMLAttrxRef("max", "input")}}. Si se especifica un valor para {{HTMLAttrxRef("min", "input")}} que no es un número válido, la entrada no tiene un valor mínimo.</span></p>
-
-<p>Válido para los tipos de entrada numérica, incluidos los tipos {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}} y {{HTMLElement("input/range", "range")}}, y el elemento {{htmlelement('meter')}}, el atributo {{HTMLAttrxRef("min", "input")}} es un número que especifica el valor mínimo de un control de formulario para ser considerado válido.</p>
-
-<h3 id="Sintaxis">Sintaxis</h3>
-
-<div id="step-include">
-<p>Si <code>any</code> no se establece explícitamente, los valores válidos para el <code>número</code>, los tipos de entrada de fecha/hora y los tipos de entrada de <code>range</code> son iguales a la base de paso a paso: el valor {{HTMLAttrxRef("min", "input")}} y los incrementos del valor del paso, hasta el valor {{web.link("/es/docs/Web/HTML/Attributes/max", "max")}}, si se especifica. Por ejemplo, si tienes <code>&lt;input type="number" min="10" step="2"&gt;</code>, cualquier entero par, 10 o mayor, es válido. Si se omite, <code>&lt;input type="number"&gt;</code>, cualquier número entero es válido, pero los flotantes, como 4.2, no son válidos, ya que el <code>step</code> predeterminado es 1. Para que 4.2 sea válido, <code>step</code> se debería haber configurado en <code>any</code>, 0.1, 0.2, o cualquiera, el valor mínimo tendría que ser un número terminado en 0.2 , como <code>&lt;input type="number" min="-5.2"&gt;</code></p>
-
-<table class="standard-table">
- <caption>Sintaxis para valores {{HTMLAttrxRef("min", "input")}} por <code>&lt;input type="" /&gt;</code></caption>
- <thead>
-  <tr>
-   <th>Tipo del <code>input</code></th>
-   <th>Ejemplo</th>
-   <th>Ejemplo</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("input/date", "date")}}</td>
-   <td><code class="brush: html">yyyy-mm-dd</code></td>
-   <td><code class="brush: html">&lt;input type="date" min="2019-12-25" step="1"&gt;</code></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("input/month", "month")}}</td>
-   <td><code class="brush: html">yyyy-mm</code></td>
-   <td><code class="brush: html">&lt;input type="month" min="2019-12" step="12"&gt;</code></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("input/week", "week")}}</td>
-   <td><code class="brush: html">yyyy-W##</code></td>
-   <td><code class="brush: html">&lt;input type="week" min="2019-W23" step=""&gt;</code></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("input/time", "time")}}</td>
-   <td><code class="brush: html">hh:mm</code></td>
-   <td><code class="brush: html">&lt;input type="time" min="09:00" step="900"&gt;</code></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("input/datetime-local", "datetime-local")}}</td>
-   <td><code>yyyy-mm-ddThh:mm</code></td>
-   <td><code class="brush: html">&lt;input type="datetime-local" min="2019-12-25T19:30"&gt;</code></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("input/number", "number")}}</td>
-   <td>{{web.link("/es/docs/Web/CSS/number", "number")}}</td>
-   <td><code class="brush: html">&lt;input type="number" min="0" step="5" max="100"&gt;</code></td>
-  </tr>
-  <tr>
-   <td>{{HTMLElement("input/range", "range")}}</td>
-   <td>{{web.link("/es/docs/Web/CSS/number", "number")}}</td>
-   <td><code class="brush: html">&lt;input type="range" min="60" step="5" max="100"&gt;</code></td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: Cuando los datos ingresados por el usuario no se adhieren al valor mínimo establecido, el valor se considera inválido en la restricción de validación y coincidirá con la pseudoclase <code>:invalid</code></p>
-</div>
-</div>
-
-<p>Consulta {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "Validación del lado del cliente")}} y {{DOMxRef("ValidityState.rangeUnderflow", "rangeUnderflow")}} para más información.</p>
-
-<p>Para el elemento {{HTMLElement('meter')}}, el atributo {{HTMLAttrxRef("min", "input")}} define el límite numérico inferior del rango medido. Debe ser menor que el valor mínimo (atributo {{web.link("/es/docs/Web/HTML/Attributes/max", "max")}}), si se especifica. En ambos casos, si se omite, el valor predeterminado es 1.</p>
-
-<table class="standard-table">
- <caption>Sintaxis para valores {{HTMLAttrxRef("min", "input")}} para otros elementos</caption>
- <thead>
-  <tr>
-   <th>Tipo del <code>input</code></th>
-   <th>Sintaxis</th>
-   <th>Ejemplo</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{HTMLElement("meter")}}</td>
-   <td>{{web.link("/es/docs/Web/CSS/number", "number")}}</td>
-   <td><code>&lt;meter id="fuel" min="0" max="100" low="33" high="66" optimum="80" value="40"&gt; at 40/100&lt;/meter&gt;</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Impacto_en_step">Impacto en <code>step</code></h3>
-
-<p>Los valores de {{HTMLAttrxRef("min", "input")}} y <code>step</code> definen cuáles son los valores válidos, incluso si el atributo <code>step</code> no está incluido, como el <code>step</code> predeterminado de <code>0</code>.</p>
-
-<p>Agrega un gran borde rojo alrededor de los {{HTMLElement("input")}}s no válidos:</p>
-
-<pre class="brush: css notranslate">input:invalid {
-  border: solid red 3px;
-}</pre>
-
-<p>Luego define un {{HTMLElement("input")}} con un valor mínimo de 7.2, omitiendo el atributo <code>step</code>, en donde el valor predeterminado es 1.</p>
-
-<pre class="brush: html notranslate">&lt;input id="myNumber" name="myNumber" type="number" min="7.2" value="8"&gt;</pre>
-
-<p>Dado que <code>step</code> tiene el valor predeterminado de 1, los valores válidos incluyen <code>7.2</code>, <code>8.2</code>, <code>9.2</code> y así sucesivamente. El valor 8 no es válido. Dado que incluye un valor no válido, los navegadores compatibles mostrarán el valor como no válido.</p>
-
-<p>{{EmbedLiveSample("Impacto_en_step",200,55)}}</p>
-
-<p>Si no se incluye explícitamente, <code>step</code> tiene como valor predeterminado 1 para <code>número</code> y <code>range</code>, y 1 tipo de unidad (segundo, semana, mes, día) para los {{HTMLElement("input")}}s de tipo fecha/hora.</p>
-</div>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.attributes.min")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'input.html#the-min-and-max-attributes', 'min attribute')}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'input.html#the-min-and-max-attributes', 'min attribute')}}</td>
-   <td>{{ Spec2('HTML5 W3C') }}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Problemas_de_accesibilidad">Problemas de accesibilidad</h2>
-
-<p>Proporciona instrucciones para ayudar a los usuarios a comprender cómo completar el formulario y utilizar controles de formulario individuales. Indica cualquier entrada requerida y opcional, formatos de datos y otra información relevante. Cuando utilices el atributo {{HTMLAttrxRef("min", "input")}}, asegúrate de que el usuario comprenda este requisito mínimo. Posiblemente sea suficiente proporcionar instrucciones dentro de un {{HTMLElement('label')}}. Si proporcionas instrucciones fuera de las etiquetas, lo cual permite un posicionamiento y un diseño más flexibles, considera usar {{web.link("/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute", "aria-labelledby")}} o {{web.link("/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-descriptionsby_attribute", "aria-describedby")}}.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Web/HTML/Attributes/step", "step")}}</li>
- <li>{{web.link("/es/docs/Web/HTML/Attributes/max", "max")}}</li>
- <li>{{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricciones de validación")}}</li>
- <li>{{DOMxRef('Constraint_validation')}}</li>
- <li>{{DOMxRef('validityState.rangeUnderflow')}}</li>
- <li>{{CSSxRef(':out-of-range')}}</li>
- <li>{{HTMLElement('input')}}</li>
- <li>Los tipos {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}}, {{HTMLElement("input/range", "range")}} y {{htmlelement('meter')}}</li>
-</ul>
diff --git a/files/es/web/html/atributos/minlength/index.html b/files/es/web/html/atributos/minlength/index.html
deleted file mode 100644
index 23056673e2..0000000000
--- a/files/es/web/html/atributos/minlength/index.html
+++ /dev/null
@@ -1,71 +0,0 @@
----
-title: 'HTML el atributo: minlength'
-slug: Web/HTML/Atributos/minlength
-tags:
-  - Entrada
-  - Input
-  - Referencia
-  - atributo
-  - minlength
-  - textarea
-translation_of: Web/HTML/Attributes/minlength
----
-<p class="summary">El atributo <strong><code>minlength</code></strong> define el número mínimo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en un {{HTMLElement('input')}} o {{HTMLElement('textarea')}}. Debe ser un valor entero 0 o superior. Si no se especifica una longitud mínima o se especifica un número no válido, el <strong><code>&lt;input&gt;</code></strong> no tiene una longitud mínima. Este valor debe ser menor o igual que el valor de {{web.link("/es/docs/Web/HTML/Attributes/maxlength", "maxlength")}}; de lo contrario, el valor nunca será válido, puesto que es imposible cumplir con ambos criterios.</p>
-
-<p>El <strong><code>&lt;input&gt;</code></strong> fallará la restricción de validación si la longitud del valor de texto del campo es menor que la longitud mínima de unidades de código UTF-16, con {{DOMxRef('validityState.tooShort')}} devolviendo <code>true</code>. La validación de la restricción solo se aplica cuando el usuario cambia el valor. Una vez que el envío falla, algunos navegadores mostrarán un mensaje de error que indica la longitud mínima requerida y la longitud actual.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Al agregar <code>minlength="5"</code>, el valor debe estar vacío o tener cinco caracteres o más para ser válido.</p>
-
-<pre class="brush: html notranslate">&lt;label for="fruit"&gt;Ingresa un nombre de fruta que tenga al menos 5 letras&lt;/label&gt; &lt;input type="text" minlength="5" id="fruit"&gt;</pre>
-
-<p>Podemos usar pseudoclases para estilizar el elemento en función de si el valor es válido. El valor será válido siempre que sea <code>null</code> (vacío) o tenga cinco o más caracteres. <em>Lima</em> no es válido, <em>limón es válido</em>.</p>
-
-<pre class="brush: css notranslate">input {
-  border: 2px solid currentcolor;
-}
-input:invalid {
-  border: 2px dashed red;
-}
-input:invalid:focus {
-  background-image: linear-gradient(pink, lightgreen);
-}</pre>
-
-<p>{{EmbedLiveSample('Ejemplos', '100%', 200)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'input.html#attr-input-minlength', 'atributo minlength')}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'input.html#attr-minlength-accept', 'atributo minlength')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.attribute.minlength")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Web/HTML/Attributes/maxlength", "maxlength")}}</li>
- <li>{{web.link("/es/docs/Web/HTML/Attributes/size", "size")}}</li>
- <li>{{web.link("/es/docs/Web/HTML/Attributes/pattern", "pattern")}}</li>
- <li>{{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "Restricción de validación")}}</li>
-</ul>
diff --git a/files/es/web/html/atributos/multiple/index.html b/files/es/web/html/atributos/multiple/index.html
deleted file mode 100644
index cbf465b0b8..0000000000
--- a/files/es/web/html/atributos/multiple/index.html
+++ /dev/null
@@ -1,182 +0,0 @@
----
-title: 'HTML el atributo: multiple'
-slug: Web/HTML/Atributos/multiple
-tags:
-  - Atributos
-  - Resticción de validación
-  - atributo
-translation_of: Web/HTML/Attributes/multiple
----
-<p>El atributo booleano {{HTMLAttrxRef("multiple", "input")}}, si se establece, significa que el control del formulario acepta uno o más valores. Válido para los {{HTMLElement("input")}}s de tipo {{HTMLElement("input/email", "email")}}, {{HTMLElement("input/file", "file")}} y {{HTMLElement("select")}}, la forma en que el usuario opta por valores múltiples depende del control del formulario.</p>
-
-<p>Dependiendo del tipo, el control de formulario puede tener una apariencia diferente si se establece el atributo {{HTMLAttrxRef("multiple", "input")}}. Para el {{HTMLElement("input")}} de tipo <code>file</code>, la mensajería nativa que proporciona el navegador es diferente. En Firefox, el {{HTMLElement("input")}} de tipo <code>file</code> dice "Ningún archivo seleccionado" cuando el atributo está presente y "Ningún archivo seleccionado", cuando no hay archivo seleccionado. La mayoría de los navegadores muestran un cuadro de lista de desplazamiento para un control {{HTMLElement("select")}} con el atributo {{HTMLAttrxRef("multiple", "input")}} establecido frente a un menú desplegable de una sola línea cuando se omite el atributo. El {{HTMLElement("input")}} {{HTMLElement("input/email", "email")}} muestra lo mismo, pero coincidirá con la pseudoclase {{CSSxRef(':invalid')}} si hay más de una dirección de correo electrónico separada por comas incluido si el atributo no está presente.</p>
-
-<p>Cuando se establece {{HTMLAttrxRef("multiple", "input")}} en el tipo de entrada {{HTMLElement("input/email", "email")}}, el usuario puede incluir cero (si no es {{web.link("/es/docs/Web/HTML/Attributes/required", "required")}} también), una o más direcciones de correo electrónico separadas por comas.</p>
-
-<pre class="brush: html notranslate"><code class="brush: html">&lt;input type="email" <strong>multiple</strong> name="emails" id="emails"&gt;</code></pre>
-
-<p>Si y solo si se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, el valor puede ser una lista de direcciones de correo electrónico separadas por comas y formadas correctamente. Los espacios en blanco iniciales y finales se eliminan de cada dirección de la lista.</p>
-
-<p>Cuando se establece {{HTMLAttrxRef("multiple", "input")}} en el tipo de entrada {{HTMLElement("input/file", "file")}}, el usuario puede seleccionar uno o más archivos. El usuario puede elegir varios archivos del selector de archivos de cualquier manera que la plataforma elegida lo permita (por ejemplo, manteniendo presionada la tecla <kbd>Mayús</kbd> o <kbd>Control</kbd> y luego haciendo clic).</p>
-
-<pre class="brush: html notranslate"><code class="brush: html">&lt;input type="file" <strong>multiple</strong> name="uploads" id="uploads"&gt;</code></pre>
-
-<p>Cuando se omite el atributo, el usuario solo puede seleccionar un único archivo por {{HTMLElement("input")}}.</p>
-
-<p>El atributo {{HTMLAttrxRef("multiple", "input")}} en el elemento {{HTMLElement("select")}} representa un control para seleccionar cero o más opciones de la lista. De lo contrario, el elemento {{HTMLElement("select")}} representa un control para seleccionar una única {{HTMLElement("option")}} de la lista de opciones.</p>
-
-<pre class="brush: html notranslate">&lt;select multiple name="drawfs" id="drawfs"&gt;
-  &lt;option&gt;Gruñón&lt;/option&gt;
-  &lt;option&gt;Feliz&lt;/option&gt;
-  &lt;option&gt;Dormilón&lt;/option&gt;
-  &lt;option&gt;Tímido&lt;/option&gt;
-  &lt;option&gt;Estornudo&lt;/option&gt;
-  &lt;option&gt;Tontín&lt;/option&gt;
-  &lt;option&gt;Doc&lt;/option&gt;
-&lt;/select&gt;</pre>
-
-<p>Cuando se especifica {{HTMLAttrxRef("multiple", "input")}}, la mayoría de los navegadores mostrarán un cuadro de lista de desplazamiento en lugar de un menú desplegable de una sola línea.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="input_para_correoᵉ"><code>input</code> para correoᵉ</h3>
-
-<pre class="brush: html notranslate">&lt;label for="emails"&gt;¿A quién deseas enviar un correo electrónico?&lt;/label&gt;
-&lt;input type="email" multiple name="emails" id="emails" list="drawfemails" required size="64"&gt;
-
-&lt;datalist id="drawfemails"&gt;
-  &lt;option value="gruñón@woodworkers.com"&gt;Gruñón&lt;/option&gt;
-  &lt;option value="feliz@woodworkers.com"&gt;Feliz&lt;/option&gt;
-  &lt;option value="dormilón@woodworkers.com"&gt;Dormilón&lt;/option&gt;
-  &lt;option value="tímido@woodworkers.com"&gt;Tímido&lt;/option&gt;
-  &lt;option value="estornudo@woodworkers.com"&gt;Estornudo&lt;/option&gt;
-  &lt;option value="tontín@woodworkers.com"&gt;Tontín&lt;/option&gt;
-  &lt;option value="doc@woodworkers.com"&gt;Doc&lt;/option&gt;
-&lt;/datalist&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">input:invalid {border: red solid 3px;}</pre>
-</div>
-
-<p>Si y solo si se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, el valor puede ser una lista de direcciones de correo electrónico separadas por comas y formadas correctamente. Los espacios en blanco iniciales y finales se eliminan de cada dirección de la lista. Si el atributo {{web.link("/es/docs/Web/HTML/Attributes/required", "required")}} está presente, se requiere al menos una dirección de correo electrónico.</p>
-
-<p>Algunos navegadores admiten la aparición de la {{web.link("/es/docs/Web/HTML/Attributes/list", "lista")}} de opciones del {{HTMLElement('datalist')}} para direcciones de correo electrónico posteriores cuando haya varias. Otros no lo hacen.</p>
-
-<p>{{EmbedLiveSample("input_para_correoᵉ", 600, 80) }}</p>
-
-<h3 id="input_de_tipo_file"><code>input</code> de tipo <code>file</code></h3>
-
-<p>Cuando se establece {{HTMLAttrxRef("multiple", "input")}} en el {{HTMLElement("input")}} de tipo  {{HTMLElement("input/file", "file")}}, el usuario puede seleccionar uno o más archivos:</p>
-
-<pre class="brush: html notranslate">&lt;form method="post" enctype="multipart/form-data"&gt;
-  &lt;p&gt;
-    &lt;label for="uploads"&gt;
-       Elige las imágenes que deseas cargar:
-    &lt;/label&gt;
-    &lt;input type="file" id="uploads" name="uploads" accept=".jpg, .jpeg, .png, .svg, .gif" multiple&gt;
-  &lt;/p&gt;
-  &lt;p&gt;
-    &lt;label for="text"&gt;Elige un archivo de texto para cargar: &lt;/label&gt;
-    &lt;input type="file" id="text" name="text" accept=".txt"&gt;
- &lt;/p&gt;
-  &lt;p&gt;
-    &lt;input type="submit" value="Enviar"&gt;
-  &lt;/p&gt;
-&lt;/form&gt;</pre>
-
-<p>{{EmbedLiveSample("input_de_tipo_file", 600, 80) }}</p>
-
-<p>Nota la diferencia en la apariencia entre el ejemplo con {{HTMLAttrxRef("multiple", "input")}} establecido y el otro {{HTMLElement("input")}} sin <code>file</code>.</p>
-
-<p>Cuando se envía el formulario, utilizas el {{web.link("/es/docs/Web/HTML/Element/form", "method='get'")}} el nombre de cada archivo seleccionado se habría agregado a los parámetros de la URL como <code>?uploads=img1.jpg&amp;uploads=img2.svg</code>. Sin embargo, dado que estamos asumiendo datos de formularios de {{web.link("/es/docs/Web/API/XMLHttpRequest/multipart", "multipart")}}, usamos mucho el <code>post</code>. Consulta el elemento {{HTMLElement('form')}} y {{web.link("/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data#The_method_attribute", "envío de datos del formulario")}} para obtener más información.</p>
-
-<h3 id="select"><code>select</code></h3>
-
-<p>El atributo {{HTMLAttrxRef("multiple", "input")}} en el elemento {{HTMLElement("select")}} representa un control para seleccionar cero o más opciones de la lista. De lo contrario, el elemento {{HTMLElement("select")}} representa un control para seleccionar una única {{HTMLElement("option")}} de la lista de opciones. El control generalmente tiene una apariencia diferente en función de la presencia del atributo {{HTMLAttrxRef("multiple", "input")}}, y la mayoría de los navegadores muestran un cuadro de lista de desplazamiento en lugar de una lista desplegable de una sola línea cuando el atributo está presente.</p>
-
-<pre class="brush: html notranslate">&lt;form method="get" action="#"&gt;
-&lt;p&gt;
- &lt;label for="dwarfs"&gt;Selecciona los leñadores que te gusten:&lt;/label&gt;
-  &lt;select multiple name="drawfs" id="drawfs"&gt;
-    &lt;option&gt;gruñón@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;feliz@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;dormilón@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;tímido@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;estornudo@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;tontín@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;doc@woodworkers.com&lt;/option&gt;
-  &lt;/select&gt;
-&lt;/p&gt;
-&lt;p&gt;
- &lt;label for="favoriteOnly"&gt;Selecciona tu favorito:&lt;/label&gt;
-  &lt;select name="favoriteOnly" id="favoriteOnly"&gt;
-    &lt;option&gt;gruñón@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;feliz@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;dormilón@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;tímido@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;estornudo@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;tontín@woodworkers.com&lt;/option&gt;
-    &lt;option&gt;doc@woodworkers.com&lt;/option&gt;
-  &lt;/select&gt;
-&lt;/p&gt;
-&lt;p&gt;
-  &lt;input type="submit" value="Enviar"&gt;
-&lt;/p&gt;
-&lt;/form&gt;</pre>
-
-<p>{{EmbedLiveSample("select", 600, 120) }}</p>
-
-<p>Ten en cuenta la diferencia de apariencia entre los dos controles de formulario.</p>
-
-<pre class="brush: css notranslate">/* descomenta este CSS para que el multiple tenga la misma altura que single */
-
-/*
-select[multiple] {
-  height: 1.5em;
-  vertical-align: top;
-}
-select[multiple]:focus,
-select[multiple]:active {
-  height: auto;
-}
-*/</pre>
-
-<p>Hay varias formas de seleccionar varias opciones en un elemento <code>&lt;select&gt;</code> con un atributo {{HTMLAttrxRef("multiple", "input")}}. Dependiendo del sistema operativo, los usuarios del ratón pueden mantener presionadas las teclas <kbd>Ctrl</kbd>, <kbd>Comando</kbd> o <kbd>Mayús</kbd> y luego hacer clic en varias opciones para seleccionarlas o deseleccionarlas. Los usuarios de teclado pueden seleccionar varios elementos contiguos centrándose en el elemento <code>&lt;select&gt;</code>, seleccionando un elemento en la parte superior o inferior del rango que desean seleccionar usando <kbd>Arriba</kbd> y <kbd>Teclas del cursor hacia abajo</kbd> para subir y bajar las opciones. La selección de elementos no contiguos no es tan compatible: los elementos se deben poder seleccionar y deseleccionar presionando <kbd>Espacio</kbd>, pero el soporte varía entre los navegadores.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'input.html#attr-input-multiple', 'Atributo multiple')}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'input.html#attr-input-multiple', 'Atributo multiple')}}</td>
-   <td>{{ Spec2('HTML5 W3C') }}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Problemas_de_accesibilidad">Problemas de accesibilidad</h2>
-
-<p>Proporciona instrucciones para ayudar a los usuarios a comprender cómo completar el formulario y utilizar controles de formulario individuales. Indica cualquier entrada requerida y opcional, formatos de datos y otra información relevante. Cuando utilices el atributo {{HTMLAttrxRef("multiple", "input")}}, informa al usuario que se permiten múltiples valores y proporciona instrucciones sobre cómo proveer más valores, como "direcciones de correo electrónico separadas con una coma".</p>
-
-<p>Configurar {{web.link("/es/docs/Web/HTML/Attributes/size", "size")}}<code>="1"</code> en una selección múltiple puedes hacer que aparezca como una única selección en algunos navegadores, pero luego no se expande en el enfoque, lo que perjudica la usabilidad. No hagas eso. Si cambias la apariencia de un <code>select</code>, e incluso si no lo haces, asegúrate de informar al usuario que se puede seleccionar más de una opción mediante otro método.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{HTMLElement('input')}}</li>
- <li>{{htmlelement('select')}}</li>
- <li>{{web.link("/es/docs/Web/HTML/Element/input/email#Allowing_multiple_e-mail_addresses", "Permitir varias direcciones de correo electrónico")}}</li>
-</ul>
diff --git a/files/es/web/html/atributos_de_configuracion_cors/index.html b/files/es/web/html/atributos_de_configuracion_cors/index.html
deleted file mode 100644
index f7453daa96..0000000000
--- a/files/es/web/html/atributos_de_configuracion_cors/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: Atributos de configuración CORS
-slug: Web/HTML/Atributos_de_configuracion_CORS
-translation_of: Web/HTML/Attributes/crossorigin
----
-<p><span class="seoSummary">En HTML5, algunos elementos HTML que dan soporte para <a href="/en-US/docs/HTTP/Access_control_CORS">CORS</a>, tales como {{ HTMLElement("img") }} o {{ HTMLElement("video") }}, tienen un atributo <code>crossorigin</code>  (propiedad <code>crossOrigin</code>), que les permite configurar las peticiones CORS de los datos que se cargan.</span> Estos atributos están enumerados, y tienen los siguientes valores posibles:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Palabra clave</td>
-   <td class="header">Descripción</td>
-  </tr>
-  <tr>
-   <td><code>anonymous</code></td>
-   <td>CORS, las solicitudes de este elemento no tendrán establecido el indicador de credenciales.</td>
-  </tr>
-  <tr>
-   <td><code>use-credentials</code></td>
-   <td>CORS, las solicitudes de este elemento tendrán marcado el indicador de credenciales; esto significa que la solicitud proporcionará credenciales.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Por defecto, es decir cuando el atributo no es específicado, CORS no se usa. La palabra clave "anonymous" indica que no habrá intercambio de credenciales de usuario a través de las cookies, ni por parte del cliente con certificados SSL o autenticación HTTP como se describe en la sección de terminología de la especificación CORS.</p>
-
-<p>Una clave inválida y un string vacío serán gestionados como  una clave anónima.</p>
-
-<p>Especificaciones</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('HTML WHATWG', 'infrastructure.html#cors-settings-attributes', 'CORS settings attributes')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'embedded-content.html#attr-img-crossorigin', 'crossorigin')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>13</td>
-   <td>{{ CompatGeckoDesktop("8.0") }}</td>
-   <td>11</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
-  <tr>
-   <td>{{ HTMLElement("video")}}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("12.0") }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("8.0") }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
-  <tr>
-   <td>{{ HTMLElement("video")}}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("12.0") }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/En/HTTP_access_control" title="en/HTTP access control">HTTP access control</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/accesskey/index.html b/files/es/web/html/atributos_globales/accesskey/index.html
deleted file mode 100644
index cb8bbcc16c..0000000000
--- a/files/es/web/html/atributos_globales/accesskey/index.html
+++ /dev/null
@@ -1,143 +0,0 @@
----
-title: accesskey
-slug: Web/HTML/Atributos_Globales/accesskey
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/accesskey
----
-<p>{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a> <strong>accesskey</strong> provee un indicio para generar un atajo de teclado para el elemento actual . Este atributo consiste en una lista de caracteres separada por espacios (un único punto de código Unicode). El explorador usa el primero que existe en la distribución del teclado de la computadora .</p>
-
-<p>La operación para activar el accesskey depende del explorador y su plataforma .</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th> </th>
-   <th>Windows</th>
-   <th>Linux</th>
-   <th>Mac</th>
-  </tr>
-  <tr>
-   <th>Firefox</th>
-   <td colspan="2" rowspan="1"><kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd><em>tecla</em></kbd></td>
-   <td>En Firefox 14 o posteriores, <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd><br>
-    En Firefox 13 o anteriores, <kbd>Control</kbd> + <kbd><em>tecla</em></kbd></td>
-  </tr>
-  <tr>
-   <th>Internet Explorer</th>
-   <td><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
-   <td colspan="2" rowspan="1">N/A</td>
-  </tr>
-  <tr>
-   <th>Google Chrome</th>
-   <td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
-   <td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
-  </tr>
-  <tr>
-   <th>Safari</th>
-   <td><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
-   <td>N/A</td>
-   <td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
-  </tr>
-  <tr>
-   <th>Opera</th>
-   <td colspan="3" rowspan="1"><kbd>Shift</kbd> + <kbd>Esc</kbd> abre una lista de contenidos , los cuales son accesibles a través de accesskey , después se puede elegir un item presionando  <kbd><em>tecla</em></kbd></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Notar que Firefox puede  personalizar la tecla de modificación requerida por  las preferencias del usuario .</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "interaction.html#the-accesskey-attribute", "accesskey")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el útlimo snapshot  {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot  de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de  {{SpecName('HTML WHATWG')}}. De {{SpecName('HTML4.01')}},  varios caracteres pueden se pueden establecer como el accesskey . Tambien puede establecerse sobre cualquier elemento.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', "interact/forms.html#h-17.11.2", "accesskey")}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Solo soportado en {{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }} y {{ HTMLElement("textarea") }}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_exploradores">Compatibilidad con exploradores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/autocapitalize/index.html b/files/es/web/html/atributos_globales/autocapitalize/index.html
deleted file mode 100644
index d1f8fc446c..0000000000
--- a/files/es/web/html/atributos_globales/autocapitalize/index.html
+++ /dev/null
@@ -1,50 +0,0 @@
----
-title: autocapitalización
-slug: Web/HTML/Atributos_Globales/autocapitalize
-tags:
-  - Atributos globales
-  - HTML
-  - Reference
-  - Referencia
-  - autocapitalización
-translation_of: Web/HTML/Global_attributes/autocapitalize
----
-<p>{{HTMLSidebar("Global_attributes")}}</p>
-
-<p><span class="seoSummary">El {{web.link("/es/docs/Web/HTML/Global_attributes", "atributo global")}} {{HTMLAttrxRef("autocapitalize", "input")}} es un atributo enumerado que controla si la entrada de texto se escribe en mayúsculas automáticamente a medida que el usuario la introduce/edita.</span> El atributo debe tomar uno de los siguientes valores:</p>
-
-<ul>
- <li><code>off</code> o <code>none</code>, no se aplica capitalización automática (todas las letras están predeterminadas en minúsculas)</li>
- <li><code>on</code> o <code>sentences</code>, la primera letra de cada oración de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
- <li><code>words</code>, la primera letra de cada palabra de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
- <li><code>characters</code>, todas las letras de manera predeterminada deben estar en mayúsculas</li>
-</ul>
-
-<p>El atributo {{HTMLAttrDef("autocapitalize")}} no afecta el comportamiento al escribir en un teclado físico. En cambio, afecta el comportamiento de otros mecanismos de entrada, como teclados virtuales en dispositivos móviles y entrada de voz. El comportamiento de tales mecanismos es que a menudo ayudan a los usuarios escribiendo en mayúscula automáticamente la primera letra de las oraciones. El atributo {{HTMLAttrDef("autocapitalize")}} permite a los autores redefinir ese comportamiento por elemento.</p>
-
-<p>El atributo {{HTMLAttrDef("autocapitalize")}} nunca hace que se habilite la autocapitalización para un elemento {{HTMLElement("input")}} con un atributo {{HTMLAttrxRef("type", "input")}} cuyo valor es {{HTMLAttrDef("url")}}, {{HTMLAttrDef("email")}} o {{HTMLAttrDef("password")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', "interaction.html#autocapitalization", "autocapitalize")}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.global_attributes.autocapitalize")}}</p>
diff --git a/files/es/web/html/atributos_globales/class/index.html b/files/es/web/html/atributos_globales/class/index.html
deleted file mode 100644
index ba82c66e65..0000000000
--- a/files/es/web/html/atributos_globales/class/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: class
-slug: Web/HTML/Atributos_Globales/class
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/class
----
-<p>{{HTMLSidebar("Global_attributes")}}<br>
- El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>class</strong> es una lista de las clases del elemento separada por espacios . Las clases permiten a CSS y Javascript seleccionar y acceder a elementos específicos a través de los <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors">selectores de clase</a> o funciones como el método {{domxref("document.getElementsByClassName")}} del DOM.</p>
-
-<p>Aunque la especificación no define los requerimientos para el nombre de las clases , se alienta a los desarrolladores web a usar nombres que describan el propósito semántico del elemento, en lugar de la presentación del elemento (e.g., <em>atributo </em>para describir un atributo en lugar de <em>itálica, </em>aunque un elemento de esta clase puesde ser presentado por <em>itálica</em>). Los nombres semanticos permanecen lógicos incluso si la presentación de la página cambia .</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "elements.html#classes", "class")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "elements.html#classes", "class")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "elements.html#classes", "class")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName('HTML4.01')}}, <code>class</code> es ahora un verdadero atributo global .</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', "struct/global.html#h-7.5.2", "class")}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Soportado en todos los elementos pero {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }} [1]</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitca</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }} [1]</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] <strong>class</strong> es un atributo global verdadero solo desde Firefox 32.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/contenteditable/index.html b/files/es/web/html/atributos_globales/contenteditable/index.html
deleted file mode 100644
index 9db8119af2..0000000000
--- a/files/es/web/html/atributos_globales/contenteditable/index.html
+++ /dev/null
@@ -1,107 +0,0 @@
----
-title: contenteditable
-slug: Web/HTML/Atributos_Globales/contenteditable
-tags:
-  - Atributos globales
-  - HTM
-  - Referencia
-translation_of: Web/HTML/Global_attributes/contenteditable
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a>  <strong>contenteditable</strong> es un atributo enumerado que indica si el elemento debe de ser editable por el usuario . Si es así, el explorador modifca su widget para permitir la edición . El atributo debe de tener alguno de los siguientes valores :</p>
-
-<ul>
- <li><span><code>true</code> </span> o una string vacia , que indica que el elemento debe de ser editable .</li>
- <li><span><code>false</code> </span> , que indica que el elemento no debe ser editable.</li>
-</ul>
-
-<p>Si este atributo no se establece , el valor de default es <em>heredado  </em>de su elemento padre .</p>
-
-<p>Este es un atributo enumerado y no uno <em>booleano .</em> Esto significa que el uso explicito de uno de los valores <code>true , false </code>o la cadena vacía es obligatorio y que una código como <code>&lt;label contenteditable&gt;Example Label&lt;/label&gt;</code> no esta permitido . El uso correcto es <code>&lt;label contenteditable="true"&gt;Example Label&lt;/label&gt;</code>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "editing.html#attr-contenteditable", "contenteditable")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#attr-contenteditable", "contenteditable")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de  {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "editing.html#attr-contenteditable", "contenteditable")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatiblidad_en_exploradores">Compatiblidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.9") }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("1.9") }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
- <li>{{domxref("HTMLElement.contentEditable")}} and {{domxref("HTMLElement.isContentEditable")}}</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/contextmenu/index.html b/files/es/web/html/atributos_globales/contextmenu/index.html
deleted file mode 100644
index 9cc32f7ace..0000000000
--- a/files/es/web/html/atributos_globales/contextmenu/index.html
+++ /dev/null
@@ -1,139 +0,0 @@
----
-title: contextmenu
-slug: Web/HTML/Atributos_Globales/contextmenu
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/contextmenu
----
-<p>{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a>  <strong>contextmenu </strong>es el  <a href="/es/docs/Web/HTML/Atributos_Globales/id"><strong>id</strong></a> de un  {{HTMLElement("menu")}} para nosotros como el menu contextual para este elemento .</p>
-
-<p>Un <em>menu contextual  </em>es un menu que aparece sobre la interacción del usuario , como por ejemplo un click derecho . HTML5 ahora permite modificar este menú . Aquí hay unos ejemplos de implementación , incluyendo menús anidados .</p>
-
-<div id="ContextMenu_Example">
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p> </p>
-
-<pre class="brush:html; highlight:[1,10,15]">&lt;body contextmenu="share"&gt;
-  &lt;menu type="context" id="share"&gt;
-    &lt;menu label="share"&gt;
-      &lt;menuitem label="Twitter" onclick="window.open('https://twitter.com/intent/tweet?text=Hurra! Estos aprendiendo sobre ContextMenuI en MDN a través de Mozilla ');"&gt;&lt;/menuitem&gt;
-      &lt;menuitem label="Facebook" onclick="window.open('https://facebook.com/sharer/sharer.php?u=https://https://developer.mozilla.org/en/HTML/Element/Using_HTML_context_menus');"&gt;&lt;/menuitem&gt;
-    &lt;/menu&gt;
-  &lt;/menu&gt;
-  &lt;ol&gt;
-    &lt;li&gt;En cualquier parte del ejemplo puedes compartir la página en twitter y Facebook usando el menú de compartir de tu menú contextual.&lt;/li&gt;
-    &lt;li&gt;&lt;pre contextmenu="changeFont" id="fontSizing"&gt;En este elemento específico de la lista , puedes cambiar el tamaño del texto usando  las acciones "Incremenrar/Decrementar" de tu menú contextual ./pre&gt;&lt;/li&gt;
-    &lt;menu type="context" id="changeFont"&gt;
-      &lt;menuitem label="Increase Font" onclick="incFont()"&gt;&lt;/menuitem&gt;
-      &lt;menuitem label="Decrease Font" onclick="decFont()"&gt;&lt;/menuitem&gt;
-    &lt;/menu&gt;
-    &lt;li contextmenu="ChangeImage" id="changeImage"&gt;En la imagen de abajo , puedes accionar la accion "Cambio de Imagen " en tu menú contextual .&lt;/li&gt;&lt;br /&gt;
-    &lt;img src="https://developer.mozilla.org/media/img/promote/promobutton_mdn5.png" contextmenu="ChangeImage" id="promoButton" /&gt;
-    &lt;menu type="context" id="ChangeImage"&gt;
-      &lt;menuitem label="Change Image" onclick="changeImage()"&gt;&lt;/menuitem&gt;
-    &lt;/menu&gt;
-  &lt;/ol&gt;
-&lt;/body&gt;
-</pre>
-
-<p>en conjunto con este Javascript</p>
-
-<pre class="brush:js">function incFont(){
-  document.getElementById("fontSizing").style.fontSize="larger";
-}
-function decFont(){
-  document.getElementById("fontSizing").style.fontSize="smaller";
-}
-function changeImage(){
-  var j = Math.ceil((Math.random()*39)+1);
-  document.images[0].src="https://developer.mozilla.org/media/img/promote/promobutton_mdn" + j + ".png";
-}</pre>
-
-<p>resulta en :</p>
-
-<div>{{EmbedLiveSample("ContextMenu_Example",550,200)}}</div>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "forms.html#attr-contextmenu", "contextmenu")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "interactive-elements.html#context-menus", "contextmenu")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatGeckoDesktop(9) }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatGeckoDesktop(20) }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/data-_star_/index.html b/files/es/web/html/atributos_globales/data-_star_/index.html
deleted file mode 100644
index 436b156299..0000000000
--- a/files/es/web/html/atributos_globales/data-_star_/index.html
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: data-*
-slug: Web/HTML/Atributos_Globales/data-*
-translation_of: Web/HTML/Global_attributes/data-*
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>Los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> <strong>data-* </strong>forman una clase de atributos , llamados atributos de datos modificables , permite a la información propietaria ser intercambiada entre el <a href="/es/docs/Web/HTML">HTML</a> y su representación en el <a href="/es/docs/Referencia_DOM_de_Gecko">DOM</a> que puede ser usada por scripts . Todos esos datos modificables están disponibles a través de la interface del elemento {{domxref("HTMLElement")}} , el atributo se establece encendido . La propiedad  {{domxref("HTMLElement.dataset")}} otorga acceso a ellos . </p>
-
-<p>El * puede ser remplazado por cualquier nombre siguiedo las<a href="http://www.w3.org/TR/REC-xml/#NT-Name"> reglas de producción de nombres xml</a> con las siguientes restricciones :</p>
-
-<ul>
- <li>el nombre no debe de empezar con <code>xml</code> , cualquiera sea el caso usado para estas letras.</li>
- <li>el nombre no debe de contener algún punto y coma (<code>U+003A</code>) .</li>
- <li>el nombre no debe de contener letras mayúsculas de la A a la Z .</li>
-</ul>
-
-<p>Notar que la propiedad {{domxref("HTMLElement.dataset")}} es un {{domxref("StringMap")}} y que el nombre del atributo de datos modificable<em>data-test-value </em>será accesible a través de <code>HTMLElement.dataset.testValue </code>como cualquier guión  (<code>U+002D</code>) es reemplazado por la versión en mayúscula de la siguiente letra (camelcase) . </p>
-
-
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table" style="line-height: 1.5;">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de   {{SpecName('HTML WHATWG')}}, definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop(6) }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoMobile(6) }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"></h2>
-
-<h2 id="Ver_también">Ver también </h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li>
- <li>La propiedad  {{domxref("HTMLElement.dataset")}} que permite el acceso y modifica estos valores .</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/dir/index.html b/files/es/web/html/atributos_globales/dir/index.html
deleted file mode 100644
index 4bcd43eb40..0000000000
--- a/files/es/web/html/atributos_globales/dir/index.html
+++ /dev/null
@@ -1,122 +0,0 @@
----
-title: dir
-slug: Web/HTML/Atributos_Globales/dir
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/dir
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a>dir es un atributo enumerado que indica la direccionalidad del texto de los elementos . Puede tener los siguientes valores : </p>
-
-<ul>
- <li><code>ltr ,</code> significa <em>izquierda</em> a <em>derecha</em> y es usado para los lenguajes que son escritos de izquierda a derecha ( como el Inglés ) .</li>
- <li><code>rtl , </code>significa <em>derecha</em> a <em>izquierda</em> y es usado para los lenguajes que son escritos de la derecha a la izquierda (como el árabe ) .</li>
- <li><code>auto , </code>permite al agente usuario decidir . Usa un algoritmo básico mientras parsea los caracteres dentro de un elemento hasta que encuentra un elemento con una direccionalidad fuerte , después aplica esa direccionalidad a todo el elemento .</li>
-</ul>
-
-<div class="note">
-<p><span style="font-size: 14px; line-height: 21px;"><strong>Notas de uso</strong></span></p>
-
-<p>Este atributo es obligatorio para el elemento  {{ HTMLElement("bdo") }} donde este tiene un significado semántico diferente.</p>
-
-<ul>
- <li>Este atributo no es heredado por el elemento {{ HTMLElement("bdi") }} . Si no se establece , su valor es <code>auto</code> .</li>
- <li>Este atributo puede ser anulado por las propiedades de CSS  {{ cssxref("direction") }} y {{ cssxref("unicode-bidi") }} , si una página CSS está activa y el elemento soporta estas propiedades.</li>
- <li>Mientras la direccionalidad del texto esté semánticamente relacionada con su contenido y no con su presentación , se recomienda que los desarrolladores web usen este atributo en lugar de propiedades de CSS relacionadas ,  cuando sea posible . De esta forma , el texto se mostrará correctamente incluso en un explorador que no soporte CSS o que tenga CSS desactivado .</li>
- <li>El valor <code>auto</code> debe de ser usada para datos con una direccionalidad desconocida , com datos procedentes de la entrada de usuario , eventualmente almacenados en una base de datos .</li>
-</ul>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#the-dir-attribute", "dir")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#the-dir-attribute", "dir")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de  {{SpecName('HTML WHATWG')}}, sin cambio desde  {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#the-dir-attribute", "dir")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, desde  {{SpecName('HTML4.01')}} añadió el valor auto y ahora es un verdadero atributo global .</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', "dirlang.html#h-8.2", "dir")}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Soportado en todos los elementos pero no en {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, y {{HTMLElement("script")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<h2 id="CompatibilityTable()"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{ CompatibilityTable() }}</span></h2>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a></li>
- <li>{{domxref("HTMLElement.dir")}} que refleja este atributo .</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/draggable/index.html b/files/es/web/html/atributos_globales/draggable/index.html
deleted file mode 100644
index 2aee2d8443..0000000000
--- a/files/es/web/html/atributos_globales/draggable/index.html
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: draggable
-slug: Web/HTML/Atributos_Globales/draggable
-tags:
-  - Atributos globales
-  - Experimental
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/draggable
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a>draggable es un atributo enumerado que indica si el elemento puede ser arrastrado , usando el {{domxref("HTML_Drag_and_Drop_API","HTML Drag and Drop API")}} . Puede tener los siguientes valores :</p>
-
-<ul>
- <li><code>true</code> , indica que el elemento puede ser arrastrado.</li>
- <li><code>false</code>, indica que el elemento no puede ser arrastrado .</li>
-</ul>
-
-<p>Si este atriuto no se establece , su valor por default es <code>auto</code> , significando que el comportamiento debe de ser el definido por default en el explorador .</p>
-
-<p>Este es un atributo <em>enumerado </em> y no uno <em>booleano</em> . Esto signigica que el uso explícito de uno de los valores <em>true </em>o <em>false </em>es obligatorio y que una declaración como <code>&lt;label draggable&gt;Example Label&lt;/label&gt; </code>no está permitida . El uso correcto es  <code>&lt;label draggable="true"&gt;Example Label&lt;/label&gt;</code>.</p>
-
-<p>Por default , unicamente el texto , las imagenes y los vínculos pueden ser arrastrados . Para todos los demás elementos el evento <strong>{{domxref('GlobalEventHandlers.ondragstart','ondragstart')}}</strong>  debe de ser establecido para el mecanismo de arrastrar y soltar para que funcione , como se muestra en este <a href="/en-US/docs/DragDrop/Drag_Operations" title="https://developer.mozilla.org/En/DragDrop/Drag_Operations">ejempl</a>o .</p>
-
-<p> </p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "interaction.html#the-draggable-attribute", "draggable")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#the-draggable-attribute", "draggable")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial .</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<h2 id="CompatibilityTable()"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{ CompatibilityTable() }}</span></h2>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("1.8.1") }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<p><span style="font-size: 30.002px; letter-spacing: -1px; line-height: 30.002px;"><strong>Ver también</strong></span></p>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales </a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/dropzone/index.html b/files/es/web/html/atributos_globales/dropzone/index.html
deleted file mode 100644
index 27abb8f133..0000000000
--- a/files/es/web/html/atributos_globales/dropzone/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: dropzone
-slug: Web/HTML/Atributos_Globales/dropzone
-tags:
-  - Atributos globales
-  - Experimental
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/dropzone
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
-
-<p>El atributo global <strong>dropzone </strong>es un atributo enumerado que indica qué los tipos de contenido pueden ser soltados en un elemento , usando la <a href="/es/docs/DragDrop/Drag_and_Drop">API Drag and Drop</a> . Pueden tener los siguientes valores :</p>
-
-<ul>
- <li>copy , indica que el soltado creará una copia del elemento que fue arrastrado .</li>
- <li>move , indica que el elemento que fue arrastrado será movido a su nueva localización .</li>
- <li>link, indica que creara un link para el dato arrastrado.</li>
-</ul>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "interaction.html#the-dropzone-attribute", "dropzone")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#the-dropzone-attribute", "dropzone")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de  {{SpecName('HTML WHATWG')}}, definición inicial .</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico </td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Cataracterística</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown}}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también </h2>
-
-<ul>
- <li>Tos los atributos globales </li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/hidden/index.html b/files/es/web/html/atributos_globales/hidden/index.html
deleted file mode 100644
index bc29d88b5a..0000000000
--- a/files/es/web/html/atributos_globales/hidden/index.html
+++ /dev/null
@@ -1,107 +0,0 @@
----
-title: hidden
-slug: Web/HTML/Atributos_Globales/hidden
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/hidden
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales/">atributo global</a> <strong>hidden</strong> es un atributo Booleano que indica que el elemento todavía no está , o ya no es relevante . Por ejemplo , puede ser usado para ocultar elelementos de la página que no pueden ser usados hasta que el proceso de login se haya completado . El explorador no dibujará dichos elementos .</p>
-
-<p>Esta atributo no debe de usarse para ocultar contenido que pudera ser legítimamente mostrado . Por ejemplo , no debe de ser usado para ocultar paneles de pestañas o una interfaz con pestañas , ya que esta es una decisión de estilo y otro estilo mostrandolos lo llevaría a una página perfectamente mostrada .</p>
-
-<p>Los elementos ocultos no deben de ser vinculados desde elementos no ocultos y elementos que son descendientes de un elemento oculto todavía activo ;  lo que significa que los elementos del script pueden todavía ejecutarse y los elementos de formulario pueden todavía enviarse .</p>
-
-<div class="note">
-<p><strong>Nota:</strong>  Cambiando el valor de la propiedad CSS {{cssxref("display")}} de un elemento con el atributo <code>hidden</code>  sobrecarga el comportamiento . For ejemplo , un elemeneto diseñado <code>display : flex </code>será mostrado en la pantalla independientemente de que el atributo <code>hidden </code>esté presente .</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "interaction.html#the-hidden-attribute", "hidden")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "rendering.html#hiddenCSS", "Hidden elements")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>
-    <p>Define el dibujado por default sugerido del atributo hidden usando CSS</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#the-hidden-attribute", "hidden")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("2") }}</td>
-   <td>11</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("2") }}</td>
-   <td>11</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también </h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales/">atributos globales</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/id/index.html b/files/es/web/html/atributos_globales/id/index.html
deleted file mode 100644
index 3dd947cf27..0000000000
--- a/files/es/web/html/atributos_globales/id/index.html
+++ /dev/null
@@ -1,113 +0,0 @@
----
-title: id
-slug: Web/HTML/Atributos_Globales/id
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/id
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> <strong>id</strong> define un identificador único (ID) el cual no debe repetirse en todo el documento. Su propósito es identificar el elemento al vincularlo (usando un identificador de fragmento), en scripts u hojas de estilo (con CSS).</p>
-
-<p>El valor de este atributo es una cadena de caracteres opaca: es decir,  el autor del sitio no debe usarlo para proporcionar información. De forma particular, en sentido semántico por ejemplo, no debe ser derivado de la misma cadena.</p>
-
-<p>El valor de este atributo no debe contener espacios en blanco. Los navegadores tratan los IDs que contienen espacios en blanco como si los espacios fueran parte del ID. En contraste con el atributo <strong>class</strong>, el cual permite valores separados por espacios, los elementos pueden tener sólo un ID definido mediante el atributo ID. Tenga en cuenta que un elemento puede tener muchos ID, pero los demás deben ser definidos de otra forma, como por medio de un script interactuando con el DOM.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> El uso de caracteres a excepción de letras en ASCII, dígitos, '_', <code>'-'</code> y <code>'.'</code> pueden ocasionar problemas de compatibilidad, por no ser permitidos en HTML 4. A pesar de que esta limitación ha sido removida en HTML 5, un ID debe iniciar con una letra para asegurar la compatibilidad.</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#the-id-attribute", "id")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambios desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#the-id-attribute", "id")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambios de {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#the-id-attribute", "id")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, ahora acepta <code>'_'</code>, <code>'-'</code> and <code>'.'</code> si no se encuentra al principio del id. También es un atributo global verdadero.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/global.html#adef-id', 'id')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Soportado en todos los elementos a excepción de {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}[1]</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}[1]</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] <strong>class</strong> es un atributo global verdadero desde Firefox 32.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Todos los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</li>
- <li>{{domxref("Element.id")}} que se asemeja a este atributo.</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/index.html b/files/es/web/html/atributos_globales/index.html
deleted file mode 100644
index 86769245c6..0000000000
--- a/files/es/web/html/atributos_globales/index.html
+++ /dev/null
@@ -1,199 +0,0 @@
----
-title: Atributos globales
-slug: Web/HTML/Atributos_Globales
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Global_attributes
----
-<div>{{HTMLSidebar("Atributos_globales")}}</div>
-
-<p class="summary"><span class="seoSummary">Los <strong>atributos globales</strong> son atributos comunes a todos los elementos HTML; se pueden usar en todos los elementos, aunque es posible que no tengan ningún efecto en algunos elementos.</span></p>
-
-<p>Los atributos globales se pueden especificar en todos los {{web.link("/es/docs/Web/HTML/Element", "elementos HTML")}}, <em>incluso aquellos no especificados en el estándar</em>. Eso significa que cualquier elemento no estándar debe permitir estos atributos, aunque el uso de esos elementos significa que el documento ya no es compatible con HTML5. Por ejemplo, los navegadores compatibles con HTML5 ocultan el contenido marcado como <code>&lt;foo hidden&gt;...&lt;/foo&gt;</code>, aunque <code>&lt;foo&gt;</code> no sea un elemento HTML válido.</p>
-
-<p>Además de los atributos globales HTML básicos, también existen los siguientes atributos globales:</p>
-
-<ul>
- <li>{{HTMLAttrDef("xml:lang")}} y {{HTMLAttrDef("xml:base")}} — estos se heredan de las especificaciones XHTML y están en desuso, pero se mantienen por motivos de compatibilidad.</li>
- <li>Los múltiples atributos <code><strong>{{web.link("/es/docs/Web/Accessibility/ARIA", "aria-*")}}</strong></code>, utilizados para mejorar la accesibilidad.</li>
- <li>Los atributos de {{web.link("/es/docs/Web/Guide/Events/Event_handlers", "control de eventos")}}: <code><strong>onabort</strong></code>, <code><strong>onautocomplete</strong></code>, <code><strong>onautocompleteerror</strong></code>, <code><strong>onblur</strong></code>, <code><strong>oncancel</strong></code>, <code><strong>oncanplay</strong></code>, <code><strong>oncanplaythrough</strong></code>, <code><strong>onchange</strong></code>, <code><strong>onclick</strong></code>, <code><strong>onclose</strong></code>, <code><strong>oncontextmenu</strong></code>, <code><strong>oncuechange</strong></code>, <code><strong>ondblclick</strong></code>, <code><strong>ondrag</strong></code>, <code><strong>ondragend</strong></code>, <code><strong>ondragenter</strong></code>, <code><strong>ondragexit</strong></code>, <code><strong>ondragleave</strong></code>, <code><strong>ondragover</strong></code>, <code><strong>ondragstart</strong></code>, <code><strong>ondrop</strong></code>, <code><strong>ondurationchange</strong></code>, <code><strong>onemptied</strong></code>, <code><strong>onended</strong></code>, <code><strong>onerror</strong></code>, <code><strong>onfocus</strong></code>, <code><strong>oninput</strong></code>, <code><strong>oninvalid</strong></code>, <code><strong>onkeydown</strong></code>, <code><strong>onkeypress</strong></code>, <code><strong>onkeyup</strong></code>, <code><strong>onload</strong></code>, <code><strong>onloadeddata</strong></code>, <code><strong>onloadedmetadata</strong></code>, <code><strong>onloadstart</strong></code>, <code><strong>onmousedown</strong></code>, <code><strong>onmouseenter</strong></code>, <code><strong>onmouseleave</strong></code>, <code><strong>onmousemove</strong></code>, <code><strong>onmouseout</strong></code>, <code><strong>onmouseover</strong></code>, <code><strong>onmouseup</strong></code>, <code><strong>onmousewheel</strong></code>, <code><strong>onpause</strong></code>, <code><strong>onplay</strong></code>, <code><strong>onplaying</strong></code>, <code><strong>onprogress</strong></code>, <code><strong>onratechange</strong></code>, <code><strong>onreset</strong></code>, <code><strong>onresize</strong></code>, <code><strong>onscroll</strong></code>, <code><strong>onseeked</strong></code>, <code><strong>onseeking</strong></code>, <code><strong>onselect</strong></code>, <code><strong>onshow</strong></code>, <code><strong>onsort</strong></code>, <code><strong>onstalled</strong></code>, <code><strong>onsubmit</strong></code>, <code><strong>onsuspend</strong></code>, <code><strong>ontimeupdate</strong></code>, <code><strong>ontoggle</strong></code>, <code><strong>onvolumechange</strong></code>, <code><strong>onwaiting</strong></code>.</li>
-</ul>
-
-<h2 id="Lista_de_atributos_globales">Lista de atributos globales</h2>
-
-<dl>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/accesskey", "accesskey")}}</code></strong></dt>
- <dd>Proporciona una pista para generar un atajo de teclado para el elemento actual. Este atributo consta de una lista de caracteres separados por espacios. El navegador debe utilizar el primero que exista en la distribución del teclado del ordenador.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/autocapitalize", "autocapitalize")}}</code></strong></dt>
- <dd>Controla si la entrada de texto se pone en mayúsculas automáticamente a medida que el usuario la introduce o edita. Puede tener los siguientes valores:
- <ul>
-  <li><code>off</code> o <code>none</code>, no se aplica capitalización automática (todas las letras están predeterminadas en minúsculas)</li>
-  <li><code>on</code> o <code>sentences</code>, la primera letra de cada oración de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
-  <li><code>words</code>, la primera letra de cada palabra de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
-  <li><code>characters</code>, todas las letras de manera predeterminada deben estar en mayúsculas</li>
- </ul>
- </dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/class", "class")}}</code></strong></dt>
- <dd>Una lista separada por espacios de las clases del elemento. Las clases permiten que CSS y JavaScript seleccionen y accedan a elementos específicos a través de los {{web.link("/es/docs/Web/CSS/Class_selectors", "selectores de clase")}} o funciones como el método {{DOMxRef("document.getElementsByClassName()")}}.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/contenteditable", "contenteditable")}}</code></strong></dt>
- <dd>Un atributo enumerado que indica si el usuario debe poder editar el elemento. Si es así, el navegador modifica su «<em>widget</em>» para permitir la edición. El atributo debe tomar uno de los siguientes valores:
- <ul>
-  <li><code>true</code> o la <em>cadena vacía</em>, la cual indica que el elemento debe ser editable;</li>
-  <li><code>false</code>, el cual indica que el elemento no debe ser editable.</li>
- </ul>
- </dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/contextmenu", "contextmenu")}}</code></strong> {{Obsolete_Inline}}</dt>
- <dd>El {{anch("attr-id", "id")}} de un {{HTMLElement ("menu")}} para usar como el menú contextual para este elemento.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/data-*", "data-*")}}</code></strong></dt>
- <dd>Forma una clase de atributos, denominados atributos de datos personalizados, que permiten el intercambio de información de propiedad entre el {{web.link("/es/docs/Web/HTML", "HTML")}} y su representación {{Glossary("DOM")}} que pueden utilizar los scripts. Todos estos datos personalizados están disponibles a través de la interfaz {{DOMxRef("HTMLElement")}} del elemento en el que está configurado el atributo. La propiedad {{DOMxRef("HTMLElement.dataset")}} les da acceso.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/dir", "dir")}}</code></strong></dt>
- <dd>Un atributo enumerado que indica la direccionalidad del texto del elemento. Puede tener los siguientes valores:
- <ul>
-  <li><code>ltr</code>, que significa <em>de izquierda a derecha</em> y s debe usar para idiomas que se escriben de izquierda a derecha (tal como el Español);</li>
-  <li><code>rtl</code>, que significa <em>de derecha a izquierda</em> y se utiliza para idiomas que se escriben de derecha a izquierda (tal como el Árabe);</li>
-  <li><code>auto</code>, permite que el agente de usuario decida. Utiliza un algoritmo básico ya que analiza los caracteres dentro del elemento hasta que encuentra un carácter con una direccionalidad fuerte, luego aplica esa direccionalidad a todo el elemento.</li>
- </ul>
- </dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/draggable", "draggable")}}</code></strong></dt>
- <dd>Un atributo enumerado que indica si el elemento se puede arrastrar mediante la {{web.link("/es/docs/DragDrop/Drag_and_Drop", "API de arrastrar y soltar")}}. Puede tener los siguientes valores:
- <ul>
-  <li><code>true</code>, indica que el elemento se puede arrastrar</li>
-  <li><code>false</code>, indica que el elemento <strong>no</strong> se puede arrastrar.</li>
- </ul>
- </dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/dropzone", "dropzone")}}</code></strong> {{deprecated_inline}}</dt>
- <dd>Un atributo enumerado que indica qué tipos de contenido se pueden colocar en un elemento, utilizando la {{web.link("/es/docs/DragDrop/Drag_and_Drop", "API de arrastrar y soltar")}}. Puede tener los siguientes valores:
- <ul>
-  <li><code>copy</code>, indica que soltar creará una copia del elemento que se arrastró</li>
-  <li><code>move</code>, indica que el elemento que se arrastró se moverá a esta nueva ubicación.</li>
-  <li><code>link</code>, creará un enlace a los datos arrastrados.</li>
- </ul>
- </dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/exportparts", "exportparts")}}</code></strong> {{Experimental_Inline}}</dt>
- <dd>Se utiliza para exportar de forma transitiva partes de sombras de un árbol de sombras anidado a un árbol contenedor de luz.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/hidden", "hidden")}}</code></strong></dt>
- <dd>Un atributo booleano indica que el elemento aún no es o ya no es <em>relevante</em>. Por ejemplo, se puede utilizar para ocultar elementos de la página que no se pueden utilizar hasta que se haya completado el proceso de inicio de sesión. El navegador no representará tales elementos. Este atributo no se debe utilizar para ocultar contenido que se podría mostrar legítimamente.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/id", "id")}}</code></strong></dt>
- <dd>Define un identificador (ID) único que debe ser único en todo el documento. Su propósito es identificar el elemento al vincularlo (usando un identificador de fragmento), al escribir un script o al aplicarle estilo (con CSS).</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/inputmode", "inputmode")}}</code></strong></dt>
- <dd>Proporciona una pista a los navegadores sobre el tipo de configuración de teclado virtual que se debe utilizar al editar este elemento o su contenido. Se usa principalmente en elementos {{HTMLElement("input")}}, pero se puede usar en cualquier elemento mientras esté en modo {{HTMLAttrxRef("contenteditable")}}.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/is", "is")}}</code></strong></dt>
- <dd>Te permite especificar que un elemento HTML estándar se debe comportar como un elemento integrado personalizado registrado (consulta {{web.link("/es/docs/Web/Web_Components/Using_custom_elements", "Uso de elementos personalizados")}} para obtener más detalles).</dd>
-</dl>
-
-<div class="note">
-<p><strong>Nota</strong>: Los atributos <code>item*</code> son parte de <a class="external" href="https://html.spec.whatwg.org/multipage/microdata.html#microdata">Función de microdatos HTML de WHATWG</a>.</p>
-</div>
-
-<dl>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemid", "itemid")}}</code></strong></dt>
- <dd>El identificador único y global de un artículo.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemprop", "itemprop")}}</code></strong></dt>
- <dd>Se usa para agregar propiedades a un elemento. Se puede especificar a cada elemento HTML un atributo <code>itemprop</code>, donde un <code>itemprop</code> consiste en un par de nombre y valor.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemref", "itemref")}}</code></strong></dt>
- <dd>Las propiedades que no son descendientes de un elemento con el atributo <code>itemscope</code> se pueden asociar con el elemento usando un <code>itemref</code>. Proporciona una lista de IDs de elementos (no <code>itemid</code>s) con propiedades adicionales en otras partes del documento.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemscope", "itemscope")}}</code></strong></dt>
- <dd><code>itemscope</code> (normalmente) funciona junto con {{HTMLAttrxRef("itemtype")}} para especificar que el HTML contenido en un bloque es sobre un elemento en particular. <code>itemscope</code> crea el «<em>Item</em>» y define el alcance del <code>itemtype</code> asociado con él. <code>itemtype</code> es una URL válida de un vocabulario (tal como <a class="external external-icon" href="https://schema.org/">schema.org</a>) que describe el elemento y las propiedades de su contexto.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemtype", "itemtype")}}</code></strong></dt>
- <dd>Especifica la URL del vocabulario que se utilizará para definir <code>itemprop</code>s (propiedades del elemento) en la estructura de datos. {{HTMLAttrxRef("itemscope")}} se utiliza para establecer el alcance de la estructura de datos en la que estará activo el vocabulario establecido por <code>itemtype</code>.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/lang", "lang")}}</code></strong></dt>
- <dd>Ayuda a definir el idioma de un elemento: el idioma en el que se encuentran los elementos no editables o el idioma en el que el usuario debe escribir los elementos editables. El atributo contiene una “etiqueta de idioma” (compuesta de “subetiquetas de idioma” separadas por guiones) en el formato definido en <a class="external" href="https://www.ietf.org/rfc/bcp/bcp47.txt"><em>Etiquetas para identificar idiomas (BCP47)</em></a>. {{anch("attr-xml:lang", "xml:lang")}} tiene prioridad sobre él.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/part", "part")}}</code></strong></dt>
- <dd>Una lista separada por espacios de los nombres de las partes del elemento. Los nombres de las partes permiten que CSS seleccione y aplique estilo a elementos específicos en la sombra de un árbol mediante el pseudoelemento {{CSSxRef("::part")}}.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/slot", "slot")}}</code></strong></dt>
- <dd>Asigna un espacio en la sombra de un árbol {{web.link("/es/docs/Web/Web_Components/Shadow_DOM", "DOM de sombra")}} a un elemento: Un elemento con un atributo <code>slot</code> es asignado al espacio creado por el elemento {{HTMLElement("slot")}} cuyo valor del atributo {{HTMLAttrxRef("name", "slot")}} coincide con el valor del atributo <code>slot</code>.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/spellcheck", "spellcheck")}}</code></strong></dt>
- <dd>Un atributo enumerado define si se puede verificar el elemento para detectar errores ortográficos. Puede tener los siguientes valores:
- <ul>
-  <li><code>true</code>, el cual indica que, si es posible, el elemento se debe revisar para detectar errores ortográficos;</li>
-  <li><code>false</code>, indica que el elemento <strong>no</strong> se debe revisar para detectar errores ortográficos.</li>
- </ul>
- </dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/style", "style")}}</code></strong></dt>
- <dd>Contiene declaraciones de estilo {{web.link("/en-US/docs/Web/CSS", "CSS")}} que se aplicarán al elemento. Ten en cuenta que se recomienda que los estilos se definan en un archivo o archivos separados. Este atributo y el elemento {{HTMLElement("style")}} principalmente tienen el propósito de permitir un estilo rápido, por ejemplo, con fines de prueba.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/tabindex", "tabindex")}}</code></strong></dt>
- <dd>Un atributo entero que indica si el elemento puede tomar el foco de entrada (es <em>enfocable</em>), si debe participar en la navegación secuencial del teclado y, de ser así, en qué posición. Puede tomar varios valores:
- <ul>
-  <li>un <em>valor negativo</em> significa que el elemento se debe poder enfocar, pero no debe ser accesible mediante la navegación secuencial del teclado;</li>
-  <li><code>0</code> significa que el elemento se debe poder enfocar y ser accesible a través de la navegación secuencial del teclado, pero su orden relativo está definido por la convención de la plataforma;</li>
-  <li>un <em>valor positivo</em> significa que el elemento se debe poder enfocar y ser accesible mediante la navegación secuencial del teclado; el orden en el que se enfocan los elementos es el valor creciente del {{anch("attr-tabindex", "tabindex")}}. Si varios elementos comparten el mismo <code>tabindex</code>, su orden relativo sigue sus posiciones relativas en el documento.</li>
- </ul>
- </dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/title", "title")}}</code></strong></dt>
- <dd>Contiene un texto que representa información de advertencia relacionada con el elemento al que pertenece. Normalmente, pero no necesariamente, dicha información se puede presentar al usuario como información sobre herramientas.</dd>
- <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/translate", "translate")}}</code></strong> {{Experimental_Inline}}</dt>
- <dd>Un atributo enumerado que se utiliza para especificar si los valores de atributo de un elemento y los valores de sus hijos de nodo {{DOMxRef("Text")}} se deben traducir cuando la página está localizada, o si se deben dejar sin cambios. Puede tener los siguientes valores:
- <ul>
-  <li>la cadena vacía y <code>yes</code>, indican que el elemento se traducirá.</li>
-  <li><code>no</code>, lo cual indica que el elemento <strong>no</strong> se traducirá.</li>
- </ul>
- </dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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("HTML WHATWG", "dom.html#global-attributes", "Atributos globales")}}</td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName("CSS Shadow Parts", "#exposing")}}</td>
-   <td>{{Spec2("CSS Shadow Parts")}}</td>
-   <td>Se agregaron los atributos globales <code>part</code> y <code>exportparts</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5.2", "dom.html#global-attributes", "Atributos globales")}}</td>
-   <td>{{Spec2("HTML5.2")}}</td>
-   <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML5.1")}}, se han añadido <code>itemid</code>, <code>itemprop</code>, <code>itemref</code>, <code>itemscope</code> y <code>itemtype</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5.1", "dom.html#global-attributes", "Atributos globales")}}</td>
-   <td>{{Spec2("HTML5.1")}}</td>
-   <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML5 W3C")}}, ha sido añadido <code>contextmenu</code>, <code>draggable</code>, <code>dropzone</code> y <code>spellcheck</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "dom.html#global-attributes", "Atributos globales")}}</td>
-   <td>{{Spec2("HTML5 W3C")}}</td>
-   <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML4.01")}}, se introduce el concepto de atributos globales y <code>dir</code>, <code>lang</code>, <code>style</code>, <code>id</code>, <code>class</code>, <code>tabindex</code>, <code>accesskey</code>, y <code>title</code> ahora son verdaderos atributos globales.<br>
-    <code>xml:lang</code> que inicialmente formaba parte de XHTML, ahora también forma parte de HTML.<br>
-    Se han agregado <code>hidden</code>, <code>data-*</code>, <code>contenteditable</code> y <code>translate</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML4.01")}}</td>
-   <td>{{Spec2("HTML4.01")}}</td>
-   <td>No hay atributos globales definidos. Varios atributos que se convertirán en atributos globales en especificaciones posteriores se definen en un subconjunto de elementos.<br>
-    <code>class</code> y <code>style</code> son compatibles con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.<br>
-    <code>dir</code> es compatible con todos los elementos excepto {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} y {{HTMLElement("script")}}.<br>
-    <code>id</code> es compatible con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.<br>
-    <code>lang</code> es compatible con todos los elementos excepto {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} y {{HTMLElement("script")}}.<br>
-    <code>tabindex</code> solo es compatible con {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.<br>
-    <code>accesskey</code> solo es compatible con {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{HTMLElement("label")}}, {{HTMLElement("legend")}} t {{HTMLElement("textarea")}}.<br>
-    <code>title</code> es compatibles con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}} y {{HTMLElement("title")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.global_attributes")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>Las interfaces {{DOMxRef("Element")}} y {{DOMxRef("GlobalEventHandlers")}} que permiten consultar la mayoría de los atributos globales.</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/is/index.html b/files/es/web/html/atributos_globales/is/index.html
deleted file mode 100644
index aa57cab27d..0000000000
--- a/files/es/web/html/atributos_globales/is/index.html
+++ /dev/null
@@ -1,67 +0,0 @@
----
-title: is
-slug: Web/HTML/Atributos_Globales/is
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-  - is
-translation_of: Web/HTML/Global_attributes/is
----
-<div>{{HTMLSidebar("Global_attributes")}}</div>
-
-<p><span class="seoSummary">La construcción is <a href="/es/docs/Web/HTML/Atributos_Globales">global attribute</a> permite especificar que un elemento HTML estándar se debería comportar como un elemento personalizado provisto originalmente por el lenguaje (para más detalles, vea <a href="/en-US/docs/Web/Web_Components/Using_custom_elements">Utilizando elementos personalizados</a>).</span></p>
-
-<p>Este atributo puede ser utilizado sólo si nombre del elemento personalizado especificado ha sido <a href="/en-US/docs/Web/API/CustomElementRegistry/define">definido</a> extósamente en el documento actual, y extiende el tipo de elemento al que está siendo aplicado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente código fue tomado de nuestro ejemplo <a href="https://github.com/mdn/web-components-examples/tree/master/word-count-web-component">word-count-web-component</a> (<a href="https://mdn.github.io/web-components-examples/word-count-web-component/">véalo también en vivo</a>).</p>
-
-<pre class="brush: js">// Crea una clase para el elemento
-class WordCount extends HTMLParagraphElement {
-  constructor() {
-    // Siempre llamar a super al comienzo del constructor
-    super();
-
-    // Contenido del constructor omitido para mayor brevedad
-    ...
-
-  }
-}
-
-// Define el nuevo elemento
-customElements.define('word-count', WordCount, { extends: 'p' });</pre>
-
-<pre class="brush: html">&lt;<span class="pl-ent">p</span> <span class="pl-e">is</span>=<span class="pl-s"><span class="pl-pds">"</span>word-count<span class="pl-pds">"</span></span>&gt;&lt;/<span class="pl-ent">p</span>&gt;</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "custom-elements.html#attr-is", "is")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si desea contribuir a estos datos, por favor clone el repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
-
-<p>{{Compat("html.global_attributes.is")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>Todos los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</li>
-</ul>
-
-<p> </p>
diff --git a/files/es/web/html/atributos_globales/itemid/index.html b/files/es/web/html/atributos_globales/itemid/index.html
deleted file mode 100644
index 72ce64456e..0000000000
--- a/files/es/web/html/atributos_globales/itemid/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: itemid
-slug: Web/HTML/Atributos_Globales/itemid
-translation_of: Web/HTML/Global_attributes/itemid
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El atributo <strong>Itemid </strong>es un identificador global y único de un item.</p>
-
-<p>Los atributos Itemid attributes sólo se pueden especificar en elmentos que tiene atributos tanto de <strong>itemscope </strong>como <strong>itemtype</strong>. Además, el itemid sólo puede ser especficiado en elemento con un atributo itemscope cuyo correspondiente itemtype hace referencia o define un vocabulario que soporte identificadores globales.</p>
-
-<p>Un vocabulario de itemtype nos proporcionará el significado exacto de un identificador global definido dentro del vocabulario. El vocabulario definirá si varios item con el mismo identificador global puede co-existir y, si están permitidos, cómo item con el mismo identificador son gestionados.</p>
-
-<p class="note"><strong>Nota:</strong> La definición de  itemid hecha por Whatwg.org dice que debe ser una URL. No parece que sea el caso de el ejemplo que se muestra más abajo. Sin embargo la definición de facto es que un itemid es un identificador único, así que los apropiado es URB. Esta inconsistencia refleja sin dudarlo la naturaleza incompleta de la espeficicación Microdata.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;dl itemscope
-    itemtype="http://vocab.example.net/book"
-    itemid="urn:isbn:0-330-34032-8"&gt;
-&lt;dt&gt;Título &lt;dd itemprop="titulo"&gt;The Reality Dysfunction
-&lt;dt&gt;Autor &lt;dd itemprop="autor"&gt;Peter F. Hamilton
-&lt;dt&gt;Fecha de publicación
-&lt;dd&gt;&lt;time itemprop="fechapublicacion" datetime="26-01-1996"&gt;26 Enero 1996&lt;/time&gt; &lt;/dl&gt;</pre>
-
-<h3 id="Datos_estructurados">Datos estructurados</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td colspan="1" rowspan="14">itemscope</td>
-   <td>itemtype: itemid</td>
-   <td colspan="2" rowspan="1">
-    <div class="jyrRxf-eEDwDf jcd3Mb IZ65Hb-hUbt4d"><span>http://vocab.example.net/book</span>: urn:isbn:0-330-34032-8</div>
-   </td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>titulo</span></td>
-   <td><span>The Reality Dysfunction</span></td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>autor</span></td>
-   <td>
-    <div class="jyrRxf-eEDwDf jcd3Mb"><span>Peter F. Hamilton</span></div>
-   </td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>fechapublicacion</span></td>
-   <td><span>26-01-1996</span></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('HTML', '', '', '', 'Web/HTML/Global_attributes/itemid') }}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table" style="height: 105px; width: 490px;">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estad</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><a href="https://html.spec.whatwg.org/multipage/microdata.html#attr-itemid">itemid</a></td>
-   <td>Nota WG - No está siendo ya activamente desarrollado.</td>
-  </tr>
- </tbody>
-</table>
diff --git a/files/es/web/html/atributos_globales/itemprop/index.html b/files/es/web/html/atributos_globales/itemprop/index.html
deleted file mode 100644
index 232af938aa..0000000000
--- a/files/es/web/html/atributos_globales/itemprop/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
----
-title: itemprop
-slug: Web/HTML/Atributos_Globales/itemprop
-tags:
-  - atributo
-  - metatag
-translation_of: Web/HTML/Global_attributes/itemprop
----
-<p style="margin: 0.5em 0px 0px 50px; padding-top: 0px; padding-bottom: 2px; color: rgb(58, 73, 86); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Tahoma, Arial, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">Podemos dar más información al motor de búsqueda acerca de imágenes o datos adentro de cualquier tipo de etiquetas , como las propiedades : actores , clasificación ,genero . Para etiquetar las propiedades de un elemento , usa el atributo itemprop . Por ejemplo , para identificar al actor de una película añadir itemprop="director" al elemento que encierra el nombre del director.</p>
-
-<p style="margin: 0.5em 0px 0px 50px; padding-top: 0px; padding-bottom: 2px; color: rgb(58, 73, 86); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Tahoma, Arial, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">Aquí hay un ejemplo .</p>
-
-<pre style="font-family: Courier, monospace; font-size: 14.4px; width: auto; padding: 0px 5px 2px 10px; margin: 0.5em 0px 0px 50px; text-align: left; overflow: auto; color: rgb(58, 73, 86); font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-indent: 0px; text-transform: none; background: rgb(225, 225, 225);">&lt;div itemscope itemtype="http://schema.org/Movie"&gt;
-  &lt;h1 <strong>itemprop="name"</strong>&gt;Avatar&lt;/h1&gt;
-  &lt;span&gt;Director: &lt;span <strong>itemprop="director"</strong>&gt;James Cameron&lt;/span&gt; (born August 16, 1954)&lt;/span&gt;
-  &lt;span <strong>itemprop="genre"</strong>&gt;Ciencia ficcion&lt;/span&gt;
-  &lt;a href="../movies/avatar-theatrical-trailer.html" <strong>itemprop="trailer"</strong>&gt;Trailer&lt;/a&gt;
-&lt;/div&gt;</pre>
-
-<p> </p>
-
-<p>             Para más información acerca de los atributos relacionados consultar  https://schema.org/docs/gs.html</p>
diff --git a/files/es/web/html/atributos_globales/itemref/index.html b/files/es/web/html/atributos_globales/itemref/index.html
deleted file mode 100644
index 9dac55140b..0000000000
--- a/files/es/web/html/atributos_globales/itemref/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: itemref
-slug: Web/HTML/Atributos_Globales/itemref
-translation_of: Web/HTML/Global_attributes/itemref
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>Las propiedades que no son descendientes de un elemento con el atributo <code>itemscope</code> pueden ser asociadas con el elemento usando un <strong>itemref</strong> . <strong>Itemref</strong> provee una lista de ids de los elementos (no <code>itemids</code>) con propiedades adicionales en otras partes dentro del documento .</p>
-
-<p>El atributo itemref puede ser solo especificado en elementos que tienen un atributo itemscope especificado .</p>
-
-<p class="note"><strong>Nota: </strong>el atributo itemref no es parte del modelo de micro datos . Es solamente un constructor sintáctico que ayuda a los autores en el ingreso de anotaciones a las páginas donde los datos que se van a anotar no siguen una estructura de arbol conveniente . Por ejemplo , permite a los autores marcar los datos en una tabla para que cada columna defina un item separado mientras se mantienen las propiedades en las celdas .</p>
-
-<div class="syntaxbox">
-<h2 class="syntaxbox" id="Ejemplo">Ejemplo</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<div class="syntaxbox">
-<pre class="brush: html">&lt;div itemscope id="amanda" itemref="a b"&gt;&lt;/div&gt;
-&lt;p id="a"&gt;Name: &lt;span itemprop="name"&gt;Amanda&lt;/span&gt; &lt;/p&gt;
-&lt;div id="b" itemprop="band" itemscope itemref="c"&gt;&lt;/div&gt;
-&lt;div id="c"&gt;
-    &lt;p&gt;Band: &lt;span itemprop="name"&gt;Jazz Band&lt;/span&gt; &lt;/p&gt;
-    &lt;p&gt;Size: &lt;span itemprop="size"&gt;12&lt;/span&gt; players&lt;/p&gt;
-&lt;/div&gt;
-</pre>
-</div>
-
-<article id="wikiArticle">
-<h3 id="Datos_estructurados">Datos estructurados </h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>id's</th>
-   <th>itemscope</th>
-   <th>itemref</th>
-   <th> </th>
-   <th>(nombre de itemprop )</th>
-   <th>(valor de itemprop)</th>
-  </tr>
-  <tr>
-   <td>id=amanda</td>
-   <td>itemscope</td>
-   <td>itemref=a,b</td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>id=a</td>
-   <td> </td>
-   <td> </td>
-   <td>itemprop</td>
-   <td>name</td>
-   <td><span>Amanda</span></td>
-  </tr>
-  <tr>
-   <td>id=b</td>
-   <td>itemscope</td>
-   <td>itemref=c</td>
-   <td> </td>
-   <td>band</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="2">id=c</td>
-   <td> </td>
-   <td> </td>
-   <td>itemprop</td>
-   <td>Band</td>
-   <td><span>Jazz Band</span></td>
-  </tr>
-  <tr>
-   <td> </td>
-   <td> </td>
-   <td>itemprop</td>
-   <td>Size</td>
-   <td><span>12</span></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Example', '', '', '', 'Web/HTML/Global_attributes/itemref') }}</p>
-
-<h2 id="EspecificaciónEditEdit">Especificación<a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-alternates$edit#Specifications"><span>Edit</span></a><a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemid$edit#SpecificationsEdit"><span>Edit</span></a></h2>
-
-<table class="standard-table" style="height: 105px; width: 490px;">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td style="text-align: left; vertical-align: middle;"><a class="external-icon external" href="https://html.spec.whatwg.org/multipage/microdata.html#items">itemref</a></td>
-   <td style="text-align: left; vertical-align: middle; white-space: nowrap;">Nota WG  - No se encuentra activamente en desarrollo</td>
-  </tr>
- </tbody>
-</table>
-</article>
-</div>
diff --git a/files/es/web/html/atributos_globales/itemscope/index.html b/files/es/web/html/atributos_globales/itemscope/index.html
deleted file mode 100644
index b57fc1c6bc..0000000000
--- a/files/es/web/html/atributos_globales/itemscope/index.html
+++ /dev/null
@@ -1,284 +0,0 @@
----
-title: itemscope
-slug: Web/HTML/Atributos_Globales/itemscope
-tags:
-  - Ejemplo
-  - itemscope
-  - itemtype
-translation_of: Web/HTML/Global_attributes/itemscope
----
-<div>{{HTMLSidebar("Global_attributes")}}</div>
-
-<p><code><strong>itemscope</strong></code> es un <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> booleano que define el scope asociado del metadata. Especificando el atributo <code><strong>itemscope</strong></code> en un elemento crea un nuevo item, cuyos resultados estan en los numeros de pares name-value asociados con el elemento. Un atributo relativo, {{htmlattrxref("itemtype")}}, es usado para especificar el URL valido de un medio/recipe (como lo es <a href="http://schema.org/">schema.org</a>) que describe que el item es de propiedad contextual. En cada uno de los siguientes ejemplos, el medio/recipe es de <a href="https://schema.org/">schema.org</a>.</p>
-
-<p>Todos los elementos HTML pueden tener un atributo <code>itemscope</code> especifico. Un elemento <code>itemscope</code> no tiene un asociado <code>itemtype</code> pero tiene un sociado <code>itemref</code>.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Encuentra mas acerca del atributo <code>itemtype</code> en <a href="http://schema.org/Thing">http://schema.org/Thing</a></p>
-</div>
-
-<h3 id="Ejemplo_simple">Ejemplo simple</h3>
-
-<h4 id="HTML">HTML</h4>
-
-<p>El siguiente ejemplo especifica que el atributo <code>itemscope</code>. El ejemplo especificado en el <code>itemtype</code> es "http://schema.org/Movie", y especifica tres atributos <code>itemprop</code> relativos.</p>
-
-<pre class="brush:html">&lt;div itemscope itemtype="http://schema.org/Movie"&gt;
-  &lt;h1 itemprop="nombre"&gt;Avatar&lt;/h1&gt;
-  &lt;span&gt;Director: &lt;span itemprop="director"&gt;James Cameron&lt;/span&gt; (born August 16, 1954)&lt;/span&gt;
-  &lt;span itemprop="genero"&gt;Ciencia ficcion&lt;/span&gt;
-  &lt;a href="https://youtu.be/0AY1XIkX7bY" itemprop="trailer"&gt;Trailer&lt;/a&gt;
-&lt;/div&gt;
-</pre>
-
-<h4 id="sect1"> </h4>
-
-<h4 id="Esctructura_de_informacion">Esctructura de informacion</h4>
-
-<p>La siguiente tabla muestran los datos esctructurados mostrados en el anterior ejemplo.</p>
-
-<p> </p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td rowspan="6">itemscope</td>
-   <td>Itemtype</td>
-   <td colspan="2">Movie</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>(itemprop name)</td>
-   <td>(itemprop value)</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>director</td>
-   <td>James Cameron</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>genero</td>
-   <td>Ciencia Ficcion</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>nombre</td>
-   <td>Avatar</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>https://youtu.be/0AY1XIkX7bY</td>
-   <td>Trailer</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="itemscope_Atributos_ID"><code>itemscope</code> Atributos ID</h3>
-
-<p>Cuando especificas el atributo <code>itemscope</code> para un elemento, un nuevo item es creado. El item consiste de un grupo de pares de name-value. Para elementos con un atributo <code>itemscope</code> y un atributo <code>itemtype</code>, podrias tambien especificar un {{htmlattrxref("id")}} attribute. Puedes usar el atributo <code>id</code> para establecer un identificador global para el nuevo item. Un identificador global permite que los items relativos a otros items encuentren paginas atraves de la Web.</p>
-
-<h3 id="Ejemplo">Ejemplo</h3>
-
-<p>Hay 4 atributos <code>itemscope</code> en el siguiente ejemplo. Cada atributo <code>itemscope</code> establecen el scope correspondiente a sus atributos <code>itemtype</code>. El <code>itemtype</code>s, <code>Recipe</code>, <code>AggregateRating</code>, y <code>NutritionInformation</code> en el siguiente ejemplo son parte de la informacion estructura por medio de <a href="www.schema.org">schema.org</a>, se especifico el primer <code>itemtype</code>, http://schema.org/Recipe.</p>
-
-<pre class="brush: html">&lt;div itemscope itemtype="http://schema.org/Recipe"&gt;
-&lt;h2 itemprop="name"&gt;Grandma's Holiday Apple Pie&lt;/h2&gt;
-&lt;img itemprop="image" src="https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg" width="50" height="50"/&gt;
-&lt;p&gt;By &lt;span itemprop="author" itemscope itemtype="http://schema.org/Person"&gt;
-&lt;span itemprop="name"&gt;Carol Smith&lt;/p&gt;&lt;/span&gt;
-&lt;/span&gt;
-&lt;p&gt;Published: &lt;time datetime="2009-11-05" itemprop="datePublished"&gt;
-November 5, 2009&lt;/p&gt;&lt;/time&gt;
-&lt;span itemprop="description"&gt;This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.&lt;br&gt;&lt;/span&gt;
- &lt;span itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"&gt;
- &lt;span itemprop="ratingValue"&gt;4.0&lt;/span&gt; stars based on &lt;span itemprop="reviewCount"&gt;35&lt;/span&gt; reviews&lt;br&gt;&lt;/span&gt;
-Prep time: &lt;time datetime="PT30M" itemprop="prepTime"&gt;30 min&lt;br&gt;&lt;/time&gt;
- Cook time: &lt;time datetime="PT1H" itemprop="cookTime"&gt;1 hour&lt;br&gt;&lt;/time&gt;
- Total time: &lt;time datetime="PT1H30M" itemprop="totalTime"&gt;1 hour 30 min&lt;br&gt;&lt;/time&gt;
- Yield: &lt;span itemprop="recipeYield"&gt;1 9" pie (8 servings)&lt;br&gt;&lt;/span&gt;
- &lt;span itemprop="nutrition" itemscope itemtype="http://schema.org/NutritionInformation"&gt;
- Serving size: &lt;span itemprop="servingSize"&gt;1 medium slice&lt;br&gt;&lt;/span&gt;
- Calories per serving: &lt;span itemprop="calories"&gt;250 cal&lt;br&gt;&lt;/span&gt;
- Fat per serving: &lt;span itemprop="fatContent"&gt;12 g&lt;br&gt;&lt;/span&gt;
-&lt;/span&gt;
-&lt;p&gt;Ingredients:&lt;br&gt;
-  &lt;span itemprop="recipeIngredient"&gt;Thinly-sliced apples: 6 cups&lt;br&gt;&lt;/span&gt;
-  &lt;span itemprop="recipeIngredient"&gt;White sugar: 3/4 cup&lt;br&gt;&lt;/span&gt;
- ... &lt;/p&gt;
-
-Directions: &lt;br&gt;
-  &lt;div itemprop="recipeInstructions"&gt;
-    1. Cut and peel apples&lt;br&gt;
-    2. Mix sugar and cinnamon. Use additional sugar for tart apples. &lt;br&gt;
-    ...
-  &lt;/div&gt;
-&lt;/div&gt; </pre>
-
-<h3 id="Resultados">Resultados</h3>
-
-<h4 id="HTML_2">HTML</h4>
-
-<p>Los siguientes son un ejemplo renderizado resultado del codigo del anterior ejemplo.</p>
-
-<p>{{EmbedLiveSample('Example', '500', '550', '', 'Web/HTML/Global_attributes/itemscope')}}</p>
-
-<h4 id="Structured_data">Structured data</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td colspan="1" rowspan="14">itemscope</td>
-   <td>itemtype</td>
-   <td colspan="2" rowspan="1">Medio/Recipe</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>name</td>
-   <td>Grandma's Holiday Apple Pie</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>image</td>
-   <td>https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>datePublished</td>
-   <td>2009-11-05</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>description</td>
-   <td>This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>prepTime</td>
-   <td>PT30M</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>cookTime</td>
-   <td>PT1H</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>totalTime</td>
-   <td>PT1H30M</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>recipeYield</td>
-   <td>1 9" pie (8 servings)</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>recipeIngredient</td>
-   <td>Thinly-sliced apples: 6 cups</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>recipeIngredient</td>
-   <td>White sugar: 3/4 cup</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>recipeInstructions</td>
-   <td>1. Cut and peel apples 2. Mix sugar and cinnamon. Use additional sugar for tart apples .</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td colspan="2" rowspan="1">author [Person]</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>name</td>
-   <td>Carol Smith</td>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="3">itemscope</td>
-   <td>itemprop[itemtype]</td>
-   <td colspan="2" rowspan="1">aggregateRating [AggregateRating]</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>ratingValue</td>
-   <td>4.0</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>reviewCount</td>
-   <td>35</td>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="4">itemscope</td>
-   <td>itemprop[itemtype]</td>
-   <td colspan="2" rowspan="1">nutrition [NutritionInformation]</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>servingSize</td>
-   <td>1 medium slice</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>calories</td>
-   <td>250 cal</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td>fatContent</td>
-   <td>12 g</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Note</strong>: Una herramienta practica para extraer estructuras microdata del HTML es<a href="https://developers.google.com/structured-data/testing-tool/"> Structured Data Testing Tool</a> de Google. Pruebalo en el HTML del ejemplo anterior.</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estados</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML Microdata', "#dfn-itemscope", "itemscope")}}</td>
-   <td>{{Spec2('HTML Microdata')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "microdata.html#attr-itemscope", "itemscope")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
-
-
-
-<p>{{Compat("html.global_attributes.itemscope")}}</p>
-
-<h2 id="Ver_tambien">Ver tambien</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/HTML/Global_attributes">Otros atributos globales diferentes</a></li>
- <li>Otro, microdata relativo, atributos globales:
-  <ul>
-   <li>{{htmlattrxref("itemid")}}</li>
-   <li>{{htmlattrxref("itemprop")}}</li>
-   <li>{{htmlattrxref("itemref")}}</li>
-   <li>{{htmlattrxref("itemscope")}}</li>
-   <li>{{htmlattrxref("itemtype")}}</li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/lang/index.html b/files/es/web/html/atributos_globales/lang/index.html
deleted file mode 100644
index dcea33a66f..0000000000
--- a/files/es/web/html/atributos_globales/lang/index.html
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: lang
-slug: Web/HTML/Atributos_Globales/lang
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/lang
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>lang</strong> participa en la definición del lenguaje del elemento , el lenguaje en que están escritos los elementos no editables o el lenguaje en el cual los elementos editables deberían de estar escritos . La etiqueta contiene un valor sencillo de entrada en el formato que define el documento <a href="http://www.ietf.org/rfc/bcp/bcp47.txt">tags para identificar lenguajes </a><em><a href="http://www.ietf.org/rfc/bcp/bcp47.txt"> </a>(BCP47)</em> de la IETF . Si el contenido de la etiqueta es la <em>cadena vacía </em>, el lenguaje se establece como <em>desconocido</em> , si el contenido de la etiqueta no es válido respecto al documento BCP47 , se establece como <em>inválido . </em></p>
-
-<p>Incluso si el atributo <strong>lang </strong>está establecido , puede que no se tome en cuenta , ya que el atributo <strong>xml:lang </strong>tiene prioridad . Leer el algoritmo para determinar el lenguaje  de el contenido de un elemento para ver como es determinado el lenguaje en todos los casos.</p>
-
-<p>Para la pseudo clase { cssxref(":lang") }} de CSS,  dos nombres invalidos de lenguaje son diferentes si sus nombres son diferentes .</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, comportandose con <strong>xml:lang</strong>  y el algoritmo de determinación del lenguaje . También es un verdadero atributo global .</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/dirlang.html#h-8.1', 'lang')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Soportado en todos los elementos menos en {HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, y  {{HTMLElement("script")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"> </h2>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/slot/index.html b/files/es/web/html/atributos_globales/slot/index.html
deleted file mode 100644
index ed2b8688db..0000000000
--- a/files/es/web/html/atributos_globales/slot/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: slot
-slug: Web/HTML/Atributos_Globales/slot
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/slot
----
-<div>{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</div>
-
-<p>El <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> <strong>slot</strong> asigna un espacio en un <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">shadow DOM</a> árbol shadow a un elemento: Un elemento con un atributo <code>slot</code> es asignado al espacio creado por el elemento {{HTMLElement("slot")}} cuyo valor de atributo {{htmlattrxref("name", "slot")}} coincide con el valor de ese atributo <code>slot</code>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#attr-slot", "slot attribute")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG', "#dom-element-slot", "slot attribute")}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si le gustaría contribuir con estos datos, por favor clone el repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
-
-<p>{{Compat("html.global_attributes.slot")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>Todos los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/spellcheck/index.html b/files/es/web/html/atributos_globales/spellcheck/index.html
deleted file mode 100644
index c6ced2de46..0000000000
--- a/files/es/web/html/atributos_globales/spellcheck/index.html
+++ /dev/null
@@ -1,218 +0,0 @@
----
-title: spellcheck
-slug: Web/HTML/Atributos_Globales/spellcheck
-tags:
-  - Atributos globales
-  - Experimental
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/spellcheck
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>spellcheck</strong> es un atributo enumerado que define si el elemento debe de ser verificado por errores de deletreado. Puede tener los siguientes valores :</p>
-
-<ul>
- <li><code>true , </code>que indica que elemento debe de ser checado para errores de deletreado si es posible .</li>
- <li><code>false </code>, que indica que el elemento no debe de ser checado para errores de deletreado .</li>
-</ul>
-
-<p>Si este atributo no está establecido , su valor por default es de tipo elemento y definido por el explorador . El valor por default puede der <em>heredado  ,  </em>lo que significa que el contenido del elemento será checado para errores de deletreado solo si el ancestro más cercano tiene un estado de <em>spellcheck  </em>con valor <code>true .</code></p>
-
-<p>Puedes consultar <a href="/es/docs/Control_de_la_corrección_ortográfica_en_formularios_HTML">este artículo</a> para ver un ejemplo comprensivo del uso de este atributo. <br>
-  </p>
-
-<p>Este es un atributo <em>enumerado </em>y no uno<em>Booleano </em>. Esto significa que el uso explícito de uno de los valores <code>true </code>o <code>false </code>es obligatorio y que una escritura como <code>&lt;label spellcheck&gt;Example Label&lt;/label&gt; </code>no está permitida . El uso correcto es <code>&lt;label spellcheck="true"&gt;Example Label&lt;/label&gt;</code>.</p>
-
-<p>Este atributo es meramente un indicio para el explorador : los exploradores no son obligados a tener disponibilidad para verificar los errores de deletreado , incluso si el atributo <strong>spellcheck</strong> es establecido como <code>true </code>y el explorador soporta verificación de deletreado .</p>
-
-<p>El valor por default de este atributo es dependiente del explorador y del elemento :</p>
-
-<table class="fullwidth-table" style="line-height: 1.5;">
- <tbody>
-  <tr>
-   <th>Explorador</th>
-   <th>{{ HTMLElement("html") }}</th>
-   <th>{{ HTMLElement("textarea") }}</th>
-   <th>{{ HTMLElement("input") }}</th>
-   <th>others</th>
-   <th>Comment</th>
-  </tr>
-  <tr>
-   <td rowspan="3">Firefox</td>
-   <td><code>false</code></td>
-   <td><code>false</code></td>
-   <td><code>false</code></td>
-   <td><em>inherited</em></td>
-   <td>When <code>layout.spellcheckDefault</code> is <code>0</code></td>
-  </tr>
-  <tr>
-   <td><strong><code>false</code></strong></td>
-   <td><strong><code>true</code></strong></td>
-   <td><strong><em>inherited</em></strong></td>
-   <td><strong><em>inherited</em></strong></td>
-   <td><strong>When <code>layout.spellcheckDefault</code> is <code>1</code> (default value)</strong></td>
-  </tr>
-  <tr>
-   <td><code>false</code></td>
-   <td><code>true</code></td>
-   <td><code>true</code></td>
-   <td><em>inherited</em></td>
-   <td>When <code>layout.spellcheckDefault</code> is <code>2</code></td>
-  </tr>
-  <tr>
-   <td rowspan="3">Seamonkey</td>
-   <td><code>false</code></td>
-   <td><code>false</code></td>
-   <td><code>false</code></td>
-   <td><em>inherited</em></td>
-   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>0</code></span></td>
-  </tr>
-  <tr>
-   <td><strong><code>false</code></strong></td>
-   <td><strong><code>true</code></strong></td>
-   <td><strong><em>inherited</em></strong></td>
-   <td><strong><em>inherited</em></strong></td>
-   <td><strong>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;">1</span> (default value)</strong></td>
-  </tr>
-  <tr>
-   <td><code>false</code></td>
-   <td><code>true</code></td>
-   <td><code>true</code></td>
-   <td><em>inherited</em></td>
-   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>2</code></span></td>
-  </tr>
-  <tr>
-   <td rowspan="3">Camino</td>
-   <td><code>false</code></td>
-   <td><code>false</code></td>
-   <td><code>false</code></td>
-   <td><em>inherited</em></td>
-   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>0</code></span></td>
-  </tr>
-  <tr>
-   <td><code>false</code></td>
-   <td><code>true</code></td>
-   <td><em>inherited</em></td>
-   <td><em>inherited</em></td>
-   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>1</code></span></td>
-  </tr>
-  <tr>
-   <td><strong><code>false</code></strong></td>
-   <td><strong><code>true</code></strong></td>
-   <td><strong><code>true</code></strong></td>
-   <td><strong><em>inherited</em></strong></td>
-   <td><strong>When <span style="font-family: courier new;">layout.spellcheckDefault</span> is <span style="font-family: courier new;"><code>2</code> </span><strong>(default value)</strong></strong></td>
-  </tr>
-  <tr>
-   <td>Chrome</td>
-   <td><code>false</code></td>
-   <td><code>true</code></td>
-   <td>?</td>
-   <td><em>inherited</em></td>
-  </tr>
-  <tr>
-   <td>Internet Explorer</td>
-   <td><code>false</code></td>
-   <td><code>true</code></td>
-   <td>?</td>
-   <td><em>inherited</em></td>
-  </tr>
-  <tr>
-   <td>Opera</td>
-   <td><code>false</code></td>
-   <td><code>true</code></td>
-   <td>?</td>
-   <td><em>inherited</em></td>
-  </tr>
-  <tr>
-   <td>Safari</td>
-   <td><code>false</code></td>
-   <td><code>true</code></td>
-   <td>?</td>
-   <td><em>inherited</em></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Espeficicaciones">Espeficicaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Espeficifación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "interaction.html#spelling-and-grammar-checking", "spellcheck")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#spelling-and-grammar-checking", "spellcheck")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, declaración inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_exploradores">Compatibilidad con exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatUnknown}}</td>
-   <td>{{ CompatGeckoMobile("1.8.1") }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">Atributos globales</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/style/index.html b/files/es/web/html/atributos_globales/style/index.html
deleted file mode 100644
index 1da99e039b..0000000000
--- a/files/es/web/html/atributos_globales/style/index.html
+++ /dev/null
@@ -1,111 +0,0 @@
----
-title: style
-slug: Web/HTML/Atributos_Globales/style
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/style
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>style</strong> contiene declaraciones de estilo  <a href="/es/docs/Web/CSS">CSS</a> a ser aplicados a un elemento . Notar que es recomandado para los estilos ser definidos en archivo o archivos separados . Este atributo y el elemento  {{ HTMLElement("style") }} tienen principalmente el propósito de permitir el estilizamiento rápido , por ejemplo para propósitos de pruebas .</p>
-
-<p><strong>Nota de uso : </strong>Este atributo no debe de ser usado para comunicar información semántica . Incluso si todo el estilo es removido , una página debería mantenerse semánticamente correcta . Típicamente no debe de ser usado para ocultar información irrelevante ; esto debe de hacerse usando el atributo <a href="/en-US/docs/Web/HTML/Global_attributes/style$translate?tolocale=es#attr-hidden">hidden</a> .</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#the-style-attribute", "style")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último  snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#the-style-attribute", "style")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin  cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#the-style-attribute", "style")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, es ahora un verdadero atributo global .</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'present/styles.html#h-14.2.2', 'style')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Soportado en todos los elementos menos en  {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td>
-  </tr>
-  <tr>
-   <td>{{ SpecName("CSS3 Style", "", "") }}</td>
-   <td>{{Spec2("CSS3 Style")}}</td>
-   <td>Define el contenido del atributo <strong>style </strong>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"> </h2>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales.</a></li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/tabindex/index.html b/files/es/web/html/atributos_globales/tabindex/index.html
deleted file mode 100644
index 2159639208..0000000000
--- a/files/es/web/html/atributos_globales/tabindex/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: tabindex
-slug: Web/HTML/Atributos_Globales/tabindex
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/tabindex
----
-<p>{{HTMLSidebar("Global_attributes")}}</p>
-
-<p class="note">Nota: El valor máximo para tabindex no debe de exceder 32767 (<a href="https://www.w3.org/TR/html401/interact/forms.html#h-17.11.1">sección 17.11.1 del W3C</a>). Si no se especifica, el valor asignado por defecto es -1.</p>
-
-<p><a href="https://www.w3.org/TR/html401/interact/forms.html#h-17.11.1">El </a><a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>tabindex </strong>indica si su elemento puede ser enfocado, y si participa en la navegación secuencial del teclado (usualmente con la tecla <em>Tab</em>, de ahí el nombre). Acepta un entero como valor, con diferentes resultados que dependen de dicho valor:</p>
-
-<ul>
- <li>un <em>valor negativo </em>(usualmente tabindex="-1")<em> </em>significa que el elemento debe ser enfocado, pero no debe de ser accesible a través de la navegación secuencial del teclado. Es útil para crear widgets accesibles con JavaScript.</li>
- <li>tabindex="0" significa que el elemento debe ser enfocado y ser accesible a través de la navegación secuencial del teclado, pero su orden relativo es definido por convención de la plataforma.</li>
- <li>un <em>valor positivo</em> significa que debe poder recoger el foco y alcanzable a través de la navegación secuencial del teclado; su orden relativo es definido por el valor del atributo: la secuencia sigue el aumento del número de <strong>tabindex</strong>. Si varios elementos comparten el mismo tabindex, su orden relativo sigue la posición relativa en el documento.</li>
- <li>Un elemento con valor 0, un valor inválido o sin valor de <strong>tabindex</strong>, debe de ser posicionado después de elementos con un <strong>tabindex </strong>postivo en el orden de navegación secuencial del teclado.</li>
-</ul>
-
-<p>Puede consultar <a href="/en/Focus_management_in_HTML">este artículo </a>para ver una explicación compresiva de la administración de la recepción de foco.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "editing.html#attr-tabindex", "tabindex")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "editing.html#attr-tabindex", "tabindex")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "editing.html#attr-tabindex", "tabindex")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, el atributo es ahora soportado en todos los elementos  (atributos globales).</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#adef-tabindex', 'tabindex')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Solo soportado en {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}}, y {{HTMLElement("textarea")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-
-
-<p><span style="font-size: 30.002px; letter-spacing: -1px; line-height: 30.002px;"><strong>Ver también </strong></span></p>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li>
- <li>{{domxref("HTMLElement.tabindex")}} que refleja este atributo .</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/title/index.html b/files/es/web/html/atributos_globales/title/index.html
deleted file mode 100644
index ab8e0dd92f..0000000000
--- a/files/es/web/html/atributos_globales/title/index.html
+++ /dev/null
@@ -1,138 +0,0 @@
----
-title: title
-slug: Web/HTML/Atributos_Globales/title
-tags:
-  - Atributos globales
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/title
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>title </strong>contiene un texto representado información relacionada al elemento al cual pertenece . Tal información puede típicamente , pero no necesariamente , ser presentada al usuario como un tip . Aquí hay algunos usos típicos para este atributo :</p>
-
-<ul>
- <li>Vínculo : el título o la descripción del documento vinculado </li>
- <li>Elemento mediático como una imagen : una descripción o créditos asociados</li>
- <li>Párrafo : una nota de pié de página o comentario acerca de este </li>
- <li>Cita : alguna información sobre el autor y otros datos .</li>
-</ul>
-
-<p>Si este atributo es omitido  , significa que el título del ancestro más cercano de este elemento es todavía relevante para este (puede usarse legítimamente como un tip para ese elemento ) . Si el atributo es establecido como la <em>cadena vacía </em>, significa explícitamente que el título de su ancestro más  cercano no es relevante para este elemento ( y no debería de usarse en el tip para ese elemento )</p>
-
-<p>Semánticas adicionales se adjuntan a los atributos de <strong>title </strong>de los elementos {{ HTMLElement("link") }}, {{ HTMLElement("abbr") }}, {{ HTMLElement("input") }} y {{ HTMLElement("menuitem") }} </p>
-
-<p>El atributo <strong>title </strong>puede contener varias líneas . Cada  <code>U+000A LINE FEED</code> (<code>LF</code>) insertada representa una línea nueva . Se debe tener precaución ya que esto significa que :</p>
-
-<pre class="brush: html">&lt;p&gt;Líneas nuevas en title deben de tomarse en cuenta , como esta &lt;abbr title="Este es un título multilínea"&gt;ejemplo &lt;/abbr&gt;.&lt;/p&gt;
-</pre>
-
-<p>define un título de dos líneas .</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "elements.html#the-title-attribute", "title")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#the-title-attribute", "title")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', "dom.html#the-title-attribute", "title")}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Snapshot of {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, es ahora  un verdadero atributo global.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/global.html#adef-title', 'title')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Soportado en todos los elementos pero no en {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, y {{HTMLElement("title")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
-  <tr>
-   <td>Soporte multi línea</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop(12)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
-  <tr>
-   <td>Soporte multi línea</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile(12)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li>
- <li>{{domxref("HTMLElement.title")}} que refleja a este atributo .</li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/translate/index.html b/files/es/web/html/atributos_globales/translate/index.html
deleted file mode 100644
index 5182acec3c..0000000000
--- a/files/es/web/html/atributos_globales/translate/index.html
+++ /dev/null
@@ -1,103 +0,0 @@
----
-title: translate
-slug: Web/HTML/Atributos_Globales/translate
-tags:
-  - Atributos globales
-  - Experimental
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Global_attributes/translate
----
-<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
-
-<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>translate </strong> es un atributo enumerado que es usado para especificar si los valores del atributo de un elemento y los valores de sus nodos hijos de <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#text">Texto</a> serán traducidos cuando la página es localizada , o si se debe de dejarlos sin cambio . Puede tener los siguientes valores : </p>
-
-<ul>
- <li>Cadena vacía y "yes" , que indica que el elemento debe de ser traducido cuando la página es localizada .</li>
- <li>"no", que indica que el elemento no debe de ser traducido .</li>
-</ul>
-
-<p> </p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', "dom.html#attr-translate", "translate")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', "dom.html#the-translate-attribute", "translate")}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-   <td>{{ CompatNo }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"> </h2>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales  </a></li>
- <li>La propiedad  {{domxref("HTMLElement.translate")}} que refleja a este atributo </li>
-</ul>
diff --git a/files/es/web/html/atributos_globales/x-ms-acceleratorkey/index.html b/files/es/web/html/atributos_globales/x-ms-acceleratorkey/index.html
deleted file mode 100644
index 26cf4a2599..0000000000
--- a/files/es/web/html/atributos_globales/x-ms-acceleratorkey/index.html
+++ /dev/null
@@ -1,32 +0,0 @@
----
-title: x-ms-acceleratorkey
-slug: Web/HTML/Atributos_Globales/x-ms-acceleratorkey
-translation_of: Web/HTML/Global_attributes/x-ms-acceleratorkey
----
-<div>{{HTMLSidebar("Global_attributes")}}{{Non-standard_Header}}</div>
-
-<p> </p>
-
-<p><font><font>La </font></font><code><strong>x-ms-acceleratorkey</strong></code><font><font>propiedad proporciona una forma de declarar que una tecla de aceleración se ha asignado a un elemento.</font></font></p>
-
-<p><font><font>Esta propiedad propietaria es específica de Internet Explorer y Microsoft Edge.</font></font></p>
-
-<p><font><font>La </font></font><code>x-ms-acceleratorkey</code><font><font>propiedad le permite exponer una notificación en el árbol de accesibilidad a los lectores de pantalla y otras tecnologías de asistencia de que existe una clave de aceleración. </font><font>Este atributo no proporciona el comportamiento de la clave del acelerador. </font><font>Debe proporcionar controladores de eventos de teclado, como por ejemplo </font></font><code>onkeypress</code><font><font>, </font></font><code>onkeydown</code><font><font>o </font></font><code>onkeyup</code><font><font>, para procesar las teclas de aceleración en el documento.</font></font></p>
-
-<p> </p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: html">&lt;button x-ms-acceleratorkey="string"&gt;...&lt;/button&gt;</pre>
-
-<h2 id="Valor">Valor</h2>
-
-<p>Tipo: <strong>String</strong></p>
-
-<p>Nombre de la tecla de aceleración, por ejemplo: <code><em>Ctrl+B</em> or <em>Ctrl+S</em></code>.</p>
-
-<h2 id="See_Also" name="See_Also">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Microsoft_API_extensions">Microsoft API extensions </a></li>
-</ul>
diff --git a/files/es/web/html/attributes/accept/index.html b/files/es/web/html/attributes/accept/index.html
new file mode 100644
index 0000000000..7714aea4d4
--- /dev/null
+++ b/files/es/web/html/attributes/accept/index.html
@@ -0,0 +1,170 @@
+---
+title: 'HTML el atributo: accept'
+slug: Web/HTML/Attributes/accept
+tags:
+  - Accept
+  - Archivo
+  - Entrada
+  - Input
+  - Referencia
+  - atributo
+translation_of: Web/HTML/Attributes/accept
+original_slug: Web/HTML/Atributos/accept
+---
+<p class="summary"><span class="seoSummary">El atributo <strong><code>accept</code></strong> toma como valor una lista separada por comas de uno o más tipos de archivos, o {{anch("Especificadores de tipo de archivo únicos","especificadores de tipo de archivo únicos")}}, que describen qué tipos de archivo permitir. </span>La propiedad «<em>accept</em>» es un atributo del tipo {{HTMLElement("input/file", "file")}} {{HTMLElement("input")}}. Se admitía en el elemento {{HTMLElement("form")}}, pero se eliminó a favor de {{HTMLElement("input/file", "file")}} en HTML5.</p>
+
+<p>Debido a que un determinado tipo de archivo se puede identificar de más de una manera, es útil proporcionar un conjunto completo de especificadores de tipo cuando necesiten archivos de un tipo específico, o usar el comodín para indicar que un tipo de cualquier formato es aceptable.</p>
+
+<p>Por ejemplo, hay varias formas de identificar los archivos de Microsoft Word, por lo que un sitio que acepta archivos de Word puede usar un <code>&lt;input&gt;</code> como este:</p>
+
+<pre class="brush: html notranslate">&lt;input type="file" id="docpicker"
+  accept=".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document"&gt;</pre>
+
+<p>Mientras que si aceptas un archivo multimedia, es posible que desees incluir cualquier formato de ese tipo de medio:</p>
+
+<pre class="brush: html notranslate">&lt;input type="file" id="soundFile" accept="audio/*"&gt;
+&lt;input type="file" id="videoFile" accept="video/*"&gt;
+&lt;input type="file" id="imageFile" accept="image/*"&gt;</pre>
+
+<p>El atributo <code>accept</code> no valida los tipos de archivos seleccionados; simplemente proporciona sugerencias para los navegadores para guiar a los usuarios hacia la selección de los tipos de archivo correctos. Todavía es posible (en la mayoría de los casos) que los usuarios cambien una opción en el selector de archivos que hace posible anular esto y seleccionar cualquier archivo que deseen, y luego elegir tipos de archivo incorrectos.</p>
+
+<p>Debido a esto, te debes asegurar de que el requisito esperado esté validado en el lado del servidor.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Cuando se configura en un tipo de entrada de archivo, el selector de archivos nativo que se abre solo debe permitir seleccionar archivos del tipo de archivo correcto. La mayoría de los sistemas operativos aligeran los archivos que no coinciden con los criterios y no se pueden seleccionar.</p>
+
+<div id="ejemplo_sencillo">
+<pre class="brush: html notranslate">&lt;p&gt;
+	&lt;label for="soundFile"&gt;Selecciona un archivo de audio:&lt;/label&gt;
+	&lt;input type="file" id="soundFile" accept="audio/*"&gt;
+	&lt;/p&gt;
+	&lt;p&gt;
+	&lt;label for="videoFile"&gt;Selecciona un archivo de video:&lt;/label&gt;
+	&lt;input type="file" id="videoFile" accept="video/*"&gt;
+	&lt;/p&gt;
+	&lt;p&gt;
+	&lt;label for="imageFile"&gt;Selecciona algunas imágenes:&lt;/label&gt;
+	&lt;input type="file" id="imageFile" accept="image/*" multiple&gt;
+	&lt;/p&gt;</pre>
+
+<p>{{EmbedLiveSample('ejemplo_sencillo', '100%', 200)}}</p>
+
+<p>Ten en cuenta que el último ejemplo te permite seleccionar varias imágenes. Consulta el atributo <code><a href="multiple">multiple</a></code> para obtener más información.</p>
+</div>
+
+<h2 id="Especificadores_de_tipo_de_archivo_únicos">Especificadores de tipo de archivo únicos</h2>
+
+<p>Un <strong>especificador de tipo de archivo único</strong> es una cadena que describe un tipo de archivo que el usuario puede seleccionar en un elemento {{HTMLElement("input")}} de tipo <code>file</code>. Cada especificador de tipo de archivo único puede adoptar una de las siguientes formas:</p>
+
+<ul>
+ <li>Una extensión de nombre de archivo válida que no distingue entre mayúsculas y minúsculas, que comienza con un punto ("."). Por ejemplo: <code>.jpg</code>, <code>.pdf</code>, o <code>.doc</code>.</li>
+ <li>Una cadena de tipo MIME válida, sin extensiones.</li>
+ <li>La cadena <code>audio/*</code> significa "cualquier archivo de audio".</li>
+ <li>La cadena <code>video/*</code> significa "cualquier archivo de video".</li>
+ <li>La cadena <code>image/*</code> significa "cualquier archivo de imagen".</li>
+</ul>
+
+<p>El atributo <code>accept</code> toma como valor una cadena que contiene uno o más de estos especificadores de tipo de archivo únicos, separados por comas. Por ejemplo, un selector de archivos que necesita contenido que se puede presentar como una imagen, incluidos los formatos de imagen estándar y los archivos PDF, podría verse así:</p>
+
+<pre class="brush: html notranslate">&lt;input type="file" accept="image/*,.pdf"&gt;</pre>
+
+<h2 id="Usar_inputs_de_archivo">Usar <em>input</em>s de archivo</h2>
+
+<h3 id="Un_ejemplo_básico">Un ejemplo básico</h3>
+
+<pre class="brush: html notranslate">&lt;form method="post" enctype="multipart/form-data"&gt;
+ &lt;div&gt;
+   &lt;label for="file"&gt;Elige el archivo a cargar&lt;/label&gt;
+   &lt;input type="file" id="file" name="file" multiple&gt;
+ &lt;/div&gt;
+ &lt;div&gt;
+   &lt;button&gt;Enviar&lt;/button&gt;
+ &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">div {
+  margin-bottom: 10px;
+}</pre>
+</div>
+
+<p>Esto produce la siguiente salida:</p>
+
+<p>{{EmbedLiveSample('Un_ejemplo_básico', 650, 60)}}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: También puedes encontrar este ejemplo en GitHub; consulta <a href="https://github.com/mdn/learning-area/blob/master/html/forms/file-examples/simple-file.html">código fuente</a> y también puedes <a href="https://mdn.github.io/learning-area/html/forms/file-examples/simple-file.html">verlo funcionando en vivo</a>.</p>
+</div>
+
+<p>Independientemente del dispositivo o sistema operativo del usuario, el <code>&lt;input&gt;</code> de archivo proporciona un botón que abre un cuadro de diálogo selector de archivos que permite al usuario elegir un archivo.</p>
+
+<p>La inclusión del atributo <code><a href="multiple">multiple</a></code>, como se muestra arriba, especifica que se pueden elegir varios archivos a la vez. El usuario puede elegir varios archivos del selector de archivos de cualquier manera que la plataforma elegida lo permita (por ejemplo, manteniendo presionada la tecla <kbd>Mayús</kbd> o <kbd>Control</kbd> y luego haciendo clic). Si solo deseas que el usuario elija un único archivo por <code>&lt;input&gt;</code>, omite el atributo <code>multiple</code>.</p>
+
+<h3 id="Limitar_los_tipos_de_archivo_aceptados">Limitar los tipos de archivo aceptados</h3>
+
+<p>A menudo, no querrás que el usuario pueda elegir cualquier tipo de archivo arbitrario; en su lugar, quieres que seleccionen archivos de un tipo o tipos específicos. Por ejemplo, si la entrada de tu archivo permite a los usuarios cargar una imagen de perfil, probablemente desees que seleccionen formatos de imagen compatibles con la web, como {{Glossary("JPEG")}} o {{Glossary("PNG")}}.</p>
+
+<p>Los tipos de archivo aceptables se pueden especificar con el atributo {{HTMLAttrxRef("accept", "input/file")}}, que toma una lista separada por comas de extensiones de archivo permitidas o tipos MIME. Algunos ejemplos:</p>
+
+<ul>
+ <li><code>accept="image/png"</code> o <code>accept=".png"</code> — Acepta archivos PNG.</li>
+ <li><code>accept="image/png, image/jpeg"</code> o <code>accept=".png, .jpg, .jpeg"</code> — Acepta archivos PNG o JPEG.</li>
+ <li><code>accept="image/*"</code> — Acepta cualquier archivo con un tipo MIME de <code>image/*</code>. (Muchos dispositivos móviles también permiten que el usuario tome una foto con la cámara cuando se usa).</li>
+ <li><code>accept=".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document"</code> — Acepta cualquier cosa que huela a un documento de MS Word.</li>
+</ul>
+
+<p>Veamos un ejemplo más completo:</p>
+
+<pre class="brush: html notranslate">&lt;form method="post" enctype="multipart/form-data"&gt;
+  &lt;div&gt;
+    &lt;label for="profile_pic"&gt;Elige el archivo para cargar&lt;/label&gt;
+    &lt;input type="file" id="profile_pic" name="profile_pic"
+          accept=".jpg, .jpeg, .png"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">div {
+  margin-bottom: 10px;
+}</pre>
+</div>
+
+<p>{{EmbedLiveSample('Limitar_los_tipos_de_archivo_aceptados', 650, 60)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'input.html#attr-input-accept', 'atributo accept')}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'sec-forms.html#attr-input-accept', 'Atributo accept')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.attribute.accept")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Using_files_from_web_applications", "Uso de archivos de aplicaciones web")}}</li>
+ <li>{{web.link("/es/docs/Web/API/File", "API de File")}}</li>
+</ul>
diff --git a/files/es/web/html/attributes/autocomplete/index.html b/files/es/web/html/attributes/autocomplete/index.html
new file mode 100644
index 0000000000..553e9a293c
--- /dev/null
+++ b/files/es/web/html/attributes/autocomplete/index.html
@@ -0,0 +1,181 @@
+---
+title: The HTML autocomplete attribute
+slug: Web/HTML/Attributes/autocomplete
+translation_of: Web/HTML/Attributes/autocomplete
+original_slug: Web/HTML/Atributos/autocomplete
+---
+<p>El atributo <code>autocomplete</code>  está disponible en varios tipos de  {{HTMLElement("input")}} aquellos que toman un texto o valor numérico como entrada. <span class="seoSummary"><code>autocomplete</code> </span> permite a los desarrolladores web especificar qué permisos si los hay <span class="seoSummary">{{Glossary("user agent")}} </span> debe proporcionar asistencia automatizada para completar los valores de los campos de formulario, así como una guía para el navegador en cuanto al tipo de información que se espera en el campo.</p>
+
+<p> </p>
+
+<p>Los valores sugeridos generalmente depende del navegador. Normalmente, provienen de valores ​​ingresados ​​por el usuario, pero también pueden provenir de valores preconfigurados. Por ejemplo, un navegador puede permitir que el usuario guarde su nombre, dirección, número de teléfono y direcciones de correo electrónico para autocompletar así como también datos de tarjetas de crédito.</p>
+
+<p>Si un elemento {{HTMLElement("input")}} no tiene el atributo <code>autocomplete</code> , entonces los navegadores usan el atributo <code>autocomplete</code> del {{HTMLElement("form")}} que lo contiene. En otras palabras, el {{HTMLElement("form")}} del que el {{HTMLElement("input")}} desciende. También puede ser especificado en el atributo {{htmlattrxref("form", "input")}} del {{HTMLElement("input")}} en cuestión.</p>
+
+<p>Para más información vea el atributo {{htmlattrxref("autocomplete", "form")}} del elemento {{HTMLElement("form")}}</p>
+
+<div class="blockIndicator note">
+<p>Para proveer el autocompletado, el navegador necesita del los elementos <code>&lt;input&gt;</code>:</p>
+
+<ol>
+ <li>Que tengan <code>name</code> y/o <code>id</code></li>
+ <li>Pertenezcan a un elemento <code>&lt;form&gt;</code></li>
+ <li>Que el formulario tenga un botón {{HTMLElement("input/submit", "submit")}}</li>
+</ol>
+</div>
+
+<h2 id="Valores">Valores</h2>
+
+<dl>
+ <dt><code>"off"</code></dt>
+ <dd>The browser is not permitted to automatically enter or select a value for this field. It is possible that the document or application provides its own autocomplete feature, or that security concerns require that the field's value not be automatically entered.
+ <div class="note"><strong>Note:</strong> In most modern browsers, setting <code>autocomplete</code> to <code>"off"</code> will not prevent a password manager from asking the user if they would like to save username and password information, or from automatically filling in those values in a site's login form. See <a href="/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#The_autocomplete_attribute_and_login_fields">the autocomplete attribute and login fields</a>.</div>
+ </dd>
+ <dt><code>"on"</code></dt>
+ <dd>The browser is allowed to automatically complete the input. No guidance is provided as to the type of data expected in the field, so the browser may use its own judgement.</dd>
+ <dt><code>"name"</code></dt>
+ <dd>The field expects the value to be a person's full name. Using <code>"name"</code> rather than breaking the name down into its components is generally preferred because it avoids dealing with the wide diversity of human names and how they are structured; however, you can use the following <code>autocomplete</code> values if you do need to break the name down into its components:
+ <dl>
+  <dt><code>"honorific-prefix"</code></dt>
+  <dd>The prefix or title, such as "Mrs.", "Mr.", "Miss", "Ms.", "Dr.", or "Mlle.".</dd>
+  <dt><code>"given-name"</code></dt>
+  <dd>The given (or "first") name.</dd>
+  <dt><code>"additional-name"</code></dt>
+  <dd>The middle name.</dd>
+  <dt><code>"family-name"</code></dt>
+  <dd>The family (or "last") name.</dd>
+  <dt><code>"honorific-suffix"</code></dt>
+  <dd>The suffix, such as "Jr.", "B.Sc.", "PhD.", "MBASW", or "IV".</dd>
+  <dt><code>"nickname"</code></dt>
+  <dd>A nickname or handle.</dd>
+ </dl>
+ </dd>
+ <dt><code>"email"</code></dt>
+ <dd>An email address.</dd>
+ <dt><code>"username"</code></dt>
+ <dd>A username or account name.</dd>
+ <dt><code>"new-password"</code></dt>
+ <dd>A new password. When creating a new account or changing passwords, this is the "Enter your new password" field, as opposed to any "Enter your current password" field that might be present. This may be used by the browser both to avoid accidentally filling in an existing password and to offer assistance in creating a secure password.</dd>
+ <dt><code>"current-password"</code></dt>
+ <dd>The user's current password.</dd>
+ <dt><code>"organization-title"</code></dt>
+ <dd>A job title, or the title a person has within an organization, such as "Senior Technical Writer", "President", or "Assistant Troop Leader".</dd>
+ <dt><code>"organization"</code></dt>
+ <dd>A company or organization name, such as "Acme Widget Company" or "Girl Scouts of America".</dd>
+ <dt><code>"street-address"</code></dt>
+ <dd>A street address. This can be multiple lines of text, and should fully identify the location of the address within its second administrative level (typically a city or town), but should not include the city name, ZIP or postal code, or country name.</dd>
+ <dt><code>"address-line1"</code>, <code>"address-line2"</code>, <code>"address-line3"</code></dt>
+ <dd>Each individual line of the street address. These should only be present if the <code>"street-address"</code> is also present.</dd>
+ <dt><code>"address-level4"</code></dt>
+ <dd>The finest-grained {{anch("Administrative levels in addresses", "administrative level")}}, in addresses which have four levels.</dd>
+ <dt><code>"address-level3"</code></dt>
+ <dd>The third {{anch("Administrative levels in addresses", "administrative level")}}, in addresses with at least three administrative levels.</dd>
+ <dt><code>"address-level2"</code></dt>
+ <dd>The second {{anch("Administrative levels in addresses", "administrative level")}}, in addresses with at least two of them. In countries with two administrative levels, this would typically be the city, town, village, or other locality in which the address is located.</dd>
+ <dt><code>"address-level1"</code></dt>
+ <dd>The first {{anch("Administrative levels in addresses", "administrative level")}} in the address. This is typically the province in which the address is located. In the United States, this would be the state. In Switzerland, the canton. In the United Kingdom, the post town.</dd>
+ <dt><code>"country"</code></dt>
+ <dd>A country code.</dd>
+ <dt><code>"country-name"</code></dt>
+ <dd>A country name.</dd>
+ <dt><code>"postal-code"</code></dt>
+ <dd>A postal code (in the United States, this is the ZIP code).</dd>
+ <dt><code>"cc-name"</code></dt>
+ <dd>The full name as printed on or associated with a payment instrument such as a credit card. Using a full name field is preferred, typically, over breaking the name into pieces.</dd>
+ <dt><code>"cc-given-name"</code></dt>
+ <dd>A given (first) name as given on a payment instrument like a credit card.</dd>
+ <dt><code>"cc-additional-name"</code></dt>
+ <dd>A middle name as given on a payment instrument or credit card.</dd>
+ <dt><code>"cc-family-name"</code></dt>
+ <dd>A family name, as given on a credit card.</dd>
+ <dt><code>"cc-number"</code></dt>
+ <dd>A credit card number or other number identifying a payment method, such as an account number.</dd>
+ <dt><code>"cc-exp"</code></dt>
+ <dd>A payment method expiration date, typically in the form "MM/YY" or "MM/YYYY".</dd>
+ <dt><code>"cc-exp-month"</code></dt>
+ <dd>The month in which the payment method expires.</dd>
+ <dt><code>"cc-exp-year"</code></dt>
+ <dd>The year in which the payment method expires.</dd>
+ <dt><code>"cc-csc"</code></dt>
+ <dd>The security code for the payment instrument; on credit cards, this is the 3-digit verification number on the back of the card.</dd>
+ <dt><code>"cc-type"</code></dt>
+ <dd>The type of payment instrument (such as "Visa" or "Master Card").</dd>
+ <dt><code>"transaction-currency"</code></dt>
+ <dd>The currency in which the transaction is to take place.</dd>
+ <dt><code>"transaction-amount"</code></dt>
+ <dd>The amount, given in the currency specified by <code>"transaction-currency"</code>, of the transaction, for a payment form.</dd>
+ <dt><code>"language"</code></dt>
+ <dd>A preferred language, given as a valid <a href="https://en.wikipedia.org/wiki/IETF_language_tag">BCP 47 language tag</a>.</dd>
+ <dt><code>"bday"</code></dt>
+ <dd>A birth date, as a full date.</dd>
+ <dt><code>"bday-day"</code></dt>
+ <dd>The day of the month of a birth date.</dd>
+ <dt><code>"bday-month"</code></dt>
+ <dd>The month of the year of a birth date.</dd>
+ <dt><code>"bday-year"</code></dt>
+ <dd>The year of a birth date.</dd>
+ <dt><code>"sex"</code></dt>
+ <dd>A gender identity (such as "Female", "Fa'afafine", "Male"), as freeform text without newlines.</dd>
+ <dt><code>"tel"</code></dt>
+ <dd>A full telephone number, including the country code. If you need to break the phone number up into its components, you can use these values for those fields:
+ <dl>
+  <dt><code>"tel-country-code"</code></dt>
+  <dd>The country code, such as "1" for the United States, Canada, and other areas in North America and parts of the Caribbean.</dd>
+  <dt><code>"tel-national"</code></dt>
+  <dd>The entire phone number without the country code component, including a country-internal prefix. For the phone number "1-855-555-6502", this field's value would be "855-555-6502".</dd>
+  <dt><code>"tel-area-code"</code></dt>
+  <dd>The area code, with any country-internal prefix applied if appropriate.</dd>
+  <dt><code>"tel-local"</code></dt>
+  <dd>The phone number without the country or area code. This can be split further into two parts, for phone numbers which have an exchange number and then a number within the exchange. For the phone number "555-6502", use <code>"tel-local-prefix"</code> for "555" and <code>"tel-local-suffix"</code> for "6502".</dd>
+ </dl>
+ </dd>
+ <dt><code>"tel-extension"</code></dt>
+ <dd>A telephone extension code within the phone number, such as a room or suite number in a hotel or an office extension in a company.</dd>
+ <dt><code>"impp"</code></dt>
+ <dd>A URL for an instant messaging protocol endpoint, such as "xmpp:username@example.net".</dd>
+ <dt><code>"url"</code></dt>
+ <dd>A URL, such as a home page or company web site address as appropriate given the context of the other fields in the form.</dd>
+ <dt><code>"photo"</code></dt>
+ <dd>The URL of an image representing the person, company, or contact information given in the other fields in the form.</dd>
+</dl>
+
+<p>See the <a href="https://html.spec.whatwg.org/multipage/forms.html#autofill">WHATWG Standard</a> for more detailed information.</p>
+
+<div class="note">
+<p><strong>Note:</strong> The <code>autocomplete</code> attribute also controls whether Firefox will — unlike other browsers — <a href="https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">persist the dynamic disabled state and (if applicable) dynamic checkedness</a> of an <code>&lt;input&gt;</code> across page loads. The persistence feature is enabled by default. Setting the value of the <code>autocomplete</code> attribute to <code>off</code> disables this feature. This works even when the <code>autocomplete</code> attribute would normally not apply to the <code>&lt;input&gt;</code> by virtue of its <code>type</code>. See {{bug(654072)}}.</p>
+</div>
+
+<h2 id="Administrative_levels_in_addresses">Administrative levels in addresses</h2>
+
+<p>The four administrative level fields (<code>"address-level1"</code> through <code>"address-level4"</code>) describe the address in terms of increasing levels of precision within the country in which the address is located. Each country has its own system of administrative levels, and may arrange the levels in different orders when addresses are written.</p>
+
+<p><code>"address-level1"</code> always represents the broadest administrative division; it is the least-specific portion of the address short of the country name.</p>
+
+<h3 id="Form_layout_flexibility">Form layout flexibility</h3>
+
+<p>Given that different countries write their address in different ways, with each field in different places within the address, and even different sets and numbers of fields entirely, it can be helpful if, when possible, your site is able to switch to the layout expected by your users when presenting an address entry form, given the country the address is located within.</p>
+
+<h3 id="Variations">Variations</h3>
+
+<p>The way each administrative level is used will vary from country to country. Below are some examples; this is not meant to be an exhaustive list.</p>
+
+<h4 id="United_States">United States</h4>
+
+<p>A typical home address within the United States looks like this:</p>
+
+<p>432 Anywhere St<br>
+ Exampleville CA 95555</p>
+
+<p>In the United States, the least-specific portion of the address is the state, in this case "CA" (the official US Postal Service shorthand for "California"). Thus <code>"address-level1"</code> is the state, or "CA" in this case.</p>
+
+<p>The second-least specific portion of the address is the city or town name, so <code>"address-level2"</code> is "Exampleville" in this example address.</p>
+
+<p>United States addresses do not use levels 3 and up.</p>
+
+<h4 id="United_Kingdom">United Kingdom</h4>
+
+<p>The UK uses one or two address levels, depending on the address. These are the post town and, in some instances, the locality.</p>
+
+<h4 id="China">China</h4>
+
+<p>China can use as many as three administrative levels: the province, the city, and the district.</p>
diff --git a/files/es/web/html/attributes/crossorigin/index.html b/files/es/web/html/attributes/crossorigin/index.html
new file mode 100644
index 0000000000..472fa2885b
--- /dev/null
+++ b/files/es/web/html/attributes/crossorigin/index.html
@@ -0,0 +1,124 @@
+---
+title: Atributos de configuración CORS
+slug: Web/HTML/Attributes/crossorigin
+translation_of: Web/HTML/Attributes/crossorigin
+original_slug: Web/HTML/Atributos_de_configuracion_CORS
+---
+<p><span class="seoSummary">En HTML5, algunos elementos HTML que dan soporte para <a href="/en-US/docs/HTTP/Access_control_CORS">CORS</a>, tales como {{ HTMLElement("img") }} o {{ HTMLElement("video") }}, tienen un atributo <code>crossorigin</code>  (propiedad <code>crossOrigin</code>), que les permite configurar las peticiones CORS de los datos que se cargan.</span> Estos atributos están enumerados, y tienen los siguientes valores posibles:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Palabra clave</td>
+   <td class="header">Descripción</td>
+  </tr>
+  <tr>
+   <td><code>anonymous</code></td>
+   <td>CORS, las solicitudes de este elemento no tendrán establecido el indicador de credenciales.</td>
+  </tr>
+  <tr>
+   <td><code>use-credentials</code></td>
+   <td>CORS, las solicitudes de este elemento tendrán marcado el indicador de credenciales; esto significa que la solicitud proporcionará credenciales.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Por defecto, es decir cuando el atributo no es específicado, CORS no se usa. La palabra clave "anonymous" indica que no habrá intercambio de credenciales de usuario a través de las cookies, ni por parte del cliente con certificados SSL o autenticación HTTP como se describe en la sección de terminología de la especificación CORS.</p>
+
+<p>Una clave inválida y un string vacío serán gestionados como  una clave anónima.</p>
+
+<p>Especificaciones</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('HTML WHATWG', 'infrastructure.html#cors-settings-attributes', 'CORS settings attributes')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'embedded-content.html#attr-img-crossorigin', 'crossorigin')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>13</td>
+   <td>{{ CompatGeckoDesktop("8.0") }}</td>
+   <td>11</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>{{ HTMLElement("video")}}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("12.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("8.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>{{ HTMLElement("video")}}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("12.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/En/HTTP_access_control" title="en/HTTP access control">HTTP access control</a></li>
+</ul>
diff --git a/files/es/web/html/attributes/index.html b/files/es/web/html/attributes/index.html
new file mode 100644
index 0000000000..0658552c0e
--- /dev/null
+++ b/files/es/web/html/attributes/index.html
@@ -0,0 +1,678 @@
+---
+title: Referencia de Atributos HTML
+slug: Web/HTML/Attributes
+tags:
+  - HTML
+  - Referencia
+  - Web
+  - atributo
+translation_of: Web/HTML/Attributes
+original_slug: Web/HTML/Atributos
+---
+<p>Los elementos en HTML tienen <strong>atributos</strong>; estos son valores adicionales que configuran los elementos o ajustan su comportamiento de diversas formas para cumplir los criterios de los usuarios.</p>
+
+<h2 id="Lista_de_Atributos">Lista de Atributos</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th>Nombre del Atributo</th>
+   <th>Elementos</th>
+   <th>Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>accept</code></td>
+   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
+   <td>Lista de tipos aceptados por el servidor, usualmente un tipo de archivo.</td>
+  </tr>
+  <tr>
+   <td><code>accept-charset</code></td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>Lista de juegos de caracteres soportados.</td>
+  </tr>
+  <tr>
+   <td><code>accesskey</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_Globales" title="/es/docs/Web/HTML/Atributos_Globales">Atributos Globales</a></td>
+   <td>Define una tecla que activa o agrega un foco al elemento.</td>
+  </tr>
+  <tr>
+   <td><code>action</code></td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>La URL del programa que procesa la información enviada en el formulario.</td>
+  </tr>
+  <tr>
+   <td><code>align</code></td>
+   <td>{{ HTMLElement("applet") }}, {{ HTMLElement("caption") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }},  {{ HTMLElement("hr") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }},  {{ HTMLElement("td") }},  {{ HTMLElement("tfoot") }} , {{ HTMLElement("th") }}, {{ HTMLElement("thead") }}, {{ HTMLElement("tr") }}</td>
+   <td>Especifica el alineamiento horizontal del elemento.</td>
+  </tr>
+  <tr>
+   <td><code>alt</code></td>
+   <td>{{ HTMLElement("applet") }}, {{ HTMLElement("area") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}</td>
+   <td>Texto alternativo en caso de que la imagen no se pueda mostrar.</td>
+  </tr>
+  <tr>
+   <td><code>async</code></td>
+   <td>{{ HTMLElement("script") }}</td>
+   <td>Indica que el script debería ejecutarse asincrónicamente.</td>
+  </tr>
+  <tr>
+   <td><code>autocomplete</code></td>
+   <td>{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td>
+   <td>Indica si los controles en este formulario pueden tener por defecto sus valores completados automáticamente por el navegador.</td>
+  </tr>
+  <tr>
+   <td><code>autofocus</code></td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>El elemento debería recibir foco automáticamente después de haberse cargado la página.</td>
+  </tr>
+  <tr>
+   <td><code>autoplay</code></td>
+   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
+   <td>El audio o video debería empezar lo antes posible.</td>
+  </tr>
+  <tr>
+   <td><code>autosave</code></td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Previous values should persist dropdowns of selectable values across page loads.</td>
+  </tr>
+  <tr>
+   <td><code>bgcolor</code></td>
+   <td>{{ HTMLElement("body") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }}, {{ HTMLElement("tfoot") }}, {{ HTMLElement("td") }}, {{ HTMLElement("th") }}, {{ HTMLElement("tr") }}</td>
+   <td>
+    <p>Color de fondo del elemento.</p>
+
+    <div class="note">
+    <p><strong>Nota:</strong> Este atributo se mantiene como referencia. Por favor usa la propiedad CSS {{ Cssxref("background-color") }} en su lugar.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>border</code></td>
+   <td>{{ HTMLElement("img") }}, {{ HTMLElement("object") }}, {{ HTMLElement("table") }}</td>
+   <td>
+    <p>El ancho del borde.</p>
+
+    <div class="note">
+    <p><strong>Nota:</strong> Este atributo se mantiene como referencia. Por favor usa la propiedad CSS {{ Cssxref("border") }} en su lugar.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>buffered</code></td>
+   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
+   <td>Contiene un rango de tiempo multimedia almacenado.</td>
+  </tr>
+  <tr>
+   <td><code>challenge</code></td>
+   <td>{{ HTMLElement("keygen") }}</td>
+   <td>Cadena de desafío que se envía junto con la clave pública.</td>
+  </tr>
+  <tr>
+   <td><code>charset</code></td>
+   <td>{{ HTMLElement("meta") }}, {{ HTMLElement("script") }}</td>
+   <td>Declara la codificación de caracteres de la página o del script.</td>
+  </tr>
+  <tr>
+   <td><code>checked</code></td>
+   <td>{{ HTMLElement("command") }}, {{ HTMLElement("input") }}</td>
+   <td>Indica que el elemento debería estar marcado al cargar la página.</td>
+  </tr>
+  <tr>
+   <td><code>cite</code></td>
+   <td>{{ HTMLElement("blockquote") }}, {{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("q") }}</td>
+   <td>Contiene una URL que apunta a la fuente de la cita o cambio.</td>
+  </tr>
+  <tr>
+   <td><code>class</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Usualmente empleado con CSS para aplicar estilos a elementos con propiedades en comun.</td>
+  </tr>
+  <tr>
+   <td><code>code</code></td>
+   <td>{{ HTMLElement("applet") }}</td>
+   <td>Especifica la URL del archivo de tipo applet a ser cargado y ejecutado.</td>
+  </tr>
+  <tr>
+   <td><code>codebase</code></td>
+   <td>{{ HTMLElement("applet") }}</td>
+   <td>Este atributo contiene la URL absoluta o relativa del directorio donde los archivos de applets (.class) referenciados en el codigo se encuentran almacenados.</td>
+  </tr>
+  <tr>
+   <td><code>color</code></td>
+   <td>{{ HTMLElement("basefont") }}, {{ HTMLElement("font") }}, {{ HTMLElement("hr") }}</td>
+   <td>
+    <p>Este atributo establece el color de texto utilizando un nombre de color o en formato hexadecimal #RRGGBB.</p>
+
+    <div class="note">
+    <p><strong>Nota:</strong> Este atributo se mantiene como referencia. Por favor usa la propiedad CSS {{ Cssxref("color") }} en su lugar.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>cols</code></td>
+   <td>{{ HTMLElement("textarea") }}</td>
+   <td>Define el número de columnas en un área de texto.</td>
+  </tr>
+  <tr>
+   <td><code>colspan</code></td>
+   <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td>
+   <td>Define el número de columnas que una celda debe contener.</td>
+  </tr>
+  <tr>
+   <td><code>content</code></td>
+   <td>{{ HTMLElement("meta") }}</td>
+   <td>Un valor asociado con <code>http-equiv</code> o <code>name</code> dependiendo del contexto.</td>
+  </tr>
+  <tr>
+   <td><code>contenteditable</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Indica si el contenido del elemento es editable.</td>
+  </tr>
+  <tr>
+   <td><code>contextmenu</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Define el ID del elemento {{ HTMLElement("menu") }} que servira como menú de contexto para otro elemento.</td>
+  </tr>
+  <tr>
+   <td><code>controls</code></td>
+   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
+   <td>Indica si el navegador debe mostrar controles de reproduccion al usuario.</td>
+  </tr>
+  <tr>
+   <td><code>coords</code></td>
+   <td>{{ HTMLElement("area") }}</td>
+   <td>Un conjunto de valores que especifican las coordenadas del area.</td>
+  </tr>
+  <tr>
+   <td><code>data</code></td>
+   <td>{{ HTMLElement("object") }}</td>
+   <td>Especifica la URL del recurso.</td>
+  </tr>
+  <tr>
+   <td><code>data-*</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Permite asociar atributos presonalizados a un elemento HTML.</td>
+  </tr>
+  <tr>
+   <td><code>datetime</code></td>
+   <td>{{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("time") }}</td>
+   <td>Indica la fecha y hora asociadas con el elemento.</td>
+  </tr>
+  <tr>
+   <td><code>default</code></td>
+   <td>{{ HTMLElement("track") }}</td>
+   <td>Indica que la pista debe estar habilitada a menos que las preferencias del usuario indiquen algo diferente.</td>
+  </tr>
+  <tr>
+   <td><code>defer</code></td>
+   <td>{{ HTMLElement("script") }}</td>
+   <td>Indica que el código debe ser ejecutado despues de que la página este cargada.</td>
+  </tr>
+  <tr>
+   <td><code>dir</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Define la dirección del texto. Los valores permitidos son ltr (Izquierda-a-Derecha) o rtl (Derecha-a-Izquierda).</td>
+  </tr>
+  <tr>
+   <td><code>dirname</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica la dirección del texto asociada con el elemento al momento de enviar el formulario.</td>
+  </tr>
+  <tr>
+   <td><code>disabled</code></td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("command") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica si el usuario puede interactuar con el elemento.</td>
+  </tr>
+  <tr>
+   <td><code>download</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td>
+   <td>Indica que el hipervínculo es utilizado para descargar un recurso.</td>
+  </tr>
+  <tr>
+   <td><code>draggable</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Define si el elemento puede ser arrastrado.</td>
+  </tr>
+  <tr>
+   <td><code>dropzone</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Indica que el elemento acepta contenido soltado en el mismo.</td>
+  </tr>
+  <tr>
+   <td><code>enctype</code></td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>Define el tipo de contenido del formulario cuando el <code>método</code> del mismo es POST.</td>
+  </tr>
+  <tr>
+   <td><code>for</code></td>
+   <td>{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td>
+   <td>Describe elementos que pertenecen a éste.</td>
+  </tr>
+  <tr>
+   <td><code>form</code></td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica el formulario al que pertenece el elemento.</td>
+  </tr>
+  <tr>
+   <td><code>formaction</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("button") }}</td>
+   <td>Indica la acción del elemento, anulando la acción definida en {{ HTMLElement("form") }}.</td>
+  </tr>
+  <tr>
+   <td><code>headers</code></td>
+   <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td>
+   <td>IDs de los elementos <code>&lt;th&gt;</code> que aplican a este elemento.</td>
+  </tr>
+  <tr>
+   <td><code>height</code></td>
+   <td>{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td>
+   <td>
+    <p>Especifica la altura de los elementos enumerados aquí. Para todos los demás elementos, usa la propiedad CSS {{cssxref("height")}} en su lugar.</p>
+
+    <div class="note">
+    <p><strong>Nota:</strong> En algunos casos, como los {{ HTMLElement("div") }}, este es un atributo de referencia, en donde debes usar la propiedad CSS {{ Cssxref("height") }} en su lugar.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>hidden</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Evita la prestación del elemento dado, manteniendo los elementos secundarios, p.ej. los elementos de script</td>
+  </tr>
+  <tr>
+   <td><code>high</code></td>
+   <td>{{ HTMLElement("meter") }}</td>
+   <td>Indica el menor valor del rango alto.</td>
+  </tr>
+  <tr>
+   <td><code>href</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("link") }}</td>
+   <td>La URL de un recurso asociado.</td>
+  </tr>
+  <tr>
+   <td><code>hreflang</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td>
+   <td>Especifica el lenguaje del recurso asociado.</td>
+  </tr>
+  <tr>
+   <td><code>http-equiv</code></td>
+   <td>{{ HTMLElement("meta") }}</td>
+   <td>Indica una directiva que puede alterar el comportamiento de la pagina y como es leida por los exploradores.</td>
+  </tr>
+  <tr>
+   <td><code>icon</code></td>
+   <td>{{ HTMLElement("command") }}</td>
+   <td>
+    <p>Especifica una imagen relacionada con el comando.</p>
+
+    <div class="note">
+    <p><strong>Note:</strong> El elemento {{ HTMLElement("command") }} es obsoleto y no se recomienda su uso.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>id</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Identificador el elemento para acceder al mismo desde CSS o Javascript, este indicador debe ser unico para cada elemento.</td>
+  </tr>
+  <tr>
+   <td><code>ismap</code></td>
+   <td>{{ HTMLElement("img") }}</td>
+   <td>Indica que la imagen es parte de un mapa de imagen del servidor.</td>
+  </tr>
+  <tr>
+   <td><code>itemprop</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Indica que el elemento contiene el valor de la propiedad especificada de un conjunto.</td>
+  </tr>
+  <tr>
+   <td><code>keytype</code></td>
+   <td>{{ HTMLElement("keygen") }}</td>
+   <td>
+    <p>Especifica el tipo de clave generada.</p>
+
+    <div class="note">
+    <p><strong>Nota:</strong> RSA es el valor por defecto.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>kind</code></td>
+   <td>{{ HTMLElement("track") }}</td>
+   <td>Specifies the kind of text track.</td>
+  </tr>
+  <tr>
+   <td><code>label</code></td>
+   <td>{{ HTMLElement("track") }}</td>
+   <td>Especifica el título de la pista con un formato legible por el usuario.</td>
+  </tr>
+  <tr>
+   <td><code>lang</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Define el lenguaje utilizado en el elemento.</td>
+  </tr>
+  <tr>
+   <td><code>language</code></td>
+   <td>{{ HTMLElement("script") }}</td>
+   <td>Define el lenguage (de programación) utilizado en el elemento.</td>
+  </tr>
+  <tr>
+   <td><code>list</code></td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Identifica una serie de valores predefinidos para ser sugeridos al usuario.</td>
+  </tr>
+  <tr>
+   <td><code>loop</code></td>
+   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("bgsound") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("video") }}</td>
+   <td>Indica si el medio debe volver a ser reproducido desde el principio al llegar al final.</td>
+  </tr>
+  <tr>
+   <td><code>low</code></td>
+   <td>{{ HTMLElement("meter") }}</td>
+   <td>Indica el valor mas alto del rango bajo.</td>
+  </tr>
+  <tr>
+   <td><code>manifest</code></td>
+   <td>{{ HTMLElement("html") }}</td>
+   <td>Especifica la URL del manifiesto de cache para el documento.</td>
+  </tr>
+  <tr>
+   <td><code>max</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td>
+   <td>Indica el máximo valor aceptado.</td>
+  </tr>
+  <tr>
+   <td><code>maxlength</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Define el mayor número de caracteres aceptados.</td>
+  </tr>
+  <tr>
+   <td><code>media</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}</td>
+   <td>Da un indicio del tipo de medio para el cual el recurso vinculado fue creado.</td>
+  </tr>
+  <tr>
+   <td><code>method</code></td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>Define el método <a href="/es/docs/Web/HTTP">HTTP</a> a emplear para enviar el formulario. Puede ser <code>GET</code> (predeterminado) o <code>POST</code>.</td>
+  </tr>
+  <tr>
+   <td><code>min</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td>
+   <td>Indica el valor mínimo aceptado.</td>
+  </tr>
+  <tr>
+   <td><code>multiple</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
+   <td>Indica si múltiples valores pueden ser ingresados.</td>
+  </tr>
+  <tr>
+   <td><code>muted</code></td>
+   <td>{{ HTMLElement("video") }}</td>
+   <td>Indica si el audio será silenciado inicialmente al cargar la página.</td>
+  </tr>
+  <tr>
+   <td><code>name</code></td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}, {{ HTMLElement("map") }}, {{ HTMLElement("meta") }}, {{ HTMLElement("param") }}</td>
+   <td>Nombre del elemento. Por ejemplo utilizado por el servidor para identificar los campos en el envio de formularios.</td>
+  </tr>
+  <tr>
+   <td><code>novalidate</code></td>
+   <td>{{ HTMLElement("form") }}</td>
+   <td>Este atributo indica que el formulario no debe ser validado cuando se envíe.</td>
+  </tr>
+  <tr>
+   <td><code>open</code></td>
+   <td>{{ HTMLElement("details") }}</td>
+   <td>Indica si los detalles de la página seran mostrados cuando cargue la misma.</td>
+  </tr>
+  <tr>
+   <td><code>optimum</code></td>
+   <td>{{ HTMLElement("meter") }}</td>
+   <td>Indica el valor numérico óptimo.</td>
+  </tr>
+  <tr>
+   <td><code>pattern</code></td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Define una expresion regular con la cual el valor del elemento debe ser validado.</td>
+  </tr>
+  <tr>
+   <td><code>ping</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td>
+   <td>Indica si se enviara un ping o notificacion a la URL del recurso cuando el usuario utlize el vinculo.</td>
+  </tr>
+  <tr>
+   <td><code>placeholder</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Proporciona una sugerencia al usuario de lo que puede ser introducido en el campo.</td>
+  </tr>
+  <tr>
+   <td><code>poster</code></td>
+   <td>{{ HTMLElement("video") }}</td>
+   <td>Una URL que indica un cuadro a mostrar hasta que el usuario reproduzca o navegue en el video.</td>
+  </tr>
+  <tr>
+   <td><code>preload</code></td>
+   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td>
+   <td>Indica si el recurso o partes del mismo deben ser precargadas.</td>
+  </tr>
+  <tr>
+   <td>pubdate</td>
+   <td>{{ HTMLElement("time") }}</td>
+   <td>Indica si esta fecha y tiempo concuerda con la fecha y tiempo del {{ HTMLElement("article") }} mas cercano (ancestro).</td>
+  </tr>
+  <tr>
+   <td><code>radiogroup</code></td>
+   <td>{{ HTMLElement("command") }}</td>
+   <td>
+    <p>Indica los nombres de los comandos de tipo radio, que seran alternados si el comando en si es alternado. Este atributo debe ser omitido si el tipo de comando no es radio.</p>
+
+    <div class="note">
+    <p><strong>Note:</strong> El elemento {{ HTMLElement("command") }} es obsoleto y no se recomienda su uso.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>readonly</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica si el elemento puede ser editado por el usuario.</td>
+  </tr>
+  <tr>
+   <td><code>rel</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td>
+   <td>Especifica la relación entre el objeto destino y el objeto enlace.</td>
+  </tr>
+  <tr>
+   <td><code>required</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td>
+   <td>Indica si se requiere rellenar o no este elemento.</td>
+  </tr>
+  <tr>
+   <td><code>reversed</code></td>
+   <td>{{ HTMLElement("ol") }}</td>
+   <td>Indica si la lista debe ser mostrada en orden descendente en vez de ascendente.</td>
+  </tr>
+  <tr>
+   <td><code>rows</code></td>
+   <td>{{ HTMLElement("textarea") }}</td>
+   <td>Define el número de filas en un área de texto.</td>
+  </tr>
+  <tr>
+   <td><code>rowspan</code></td>
+   <td>{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td>
+   <td>Define el número de filas que una celda de una tabla debe abarcar.</td>
+  </tr>
+  <tr>
+   <td><code>sandbox</code></td>
+   <td>{{ HTMLElement("iframe") }}</td>
+   <td>Lista de restricciones a ser desactivadas en el iframe.</td>
+  </tr>
+  <tr>
+   <td><code>scope</code></td>
+   <td>{{ HTMLElement("th") }}</td>
+   <td>Define las celdas que la cabecera definió en este elemento.</td>
+  </tr>
+  <tr>
+   <td><code>scoped</code></td>
+   <td>{{ HTMLElement("style") }}</td>
+   <td>Indica si el estilo será aplicado sólo al elemento inmediato superior (padre). de no ser definido, el estilo se aplicara de forma global.</td>
+  </tr>
+  <tr>
+   <td><code>seamless</code></td>
+   <td>{{ HTMLElement("iframe") }}</td>
+   <td>Indica si el iframe debe ser cargado como parte del mismo documento.</td>
+  </tr>
+  <tr>
+   <td><code>selected</code></td>
+   <td>{{ HTMLElement("option") }}</td>
+   <td>Define un valor que será seleccionado al cargar la página.</td>
+  </tr>
+  <tr>
+   <td><code>shape</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td>
+   <td>Define una región seleccionable para hacer hipervínculos asociados con una forma asociada a una figura para crear un mapa. Los valores para este atributo son: <code>circle</code>, <code>defaul</code>, <code>plygon</code> y <code>rect</code>.</td>
+  </tr>
+  <tr>
+   <td><code>size</code></td>
+   <td>{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td>
+   <td>Define el ancho del elemento (en píxeles). Si el atributo del elemento es del <code>tipo</code> <code>text</code> o <code>password</code> entonces es el número de caracteres.</td>
+  </tr>
+  <tr>
+   <td><code>sizes</code></td>
+   <td>{{ HTMLElement("link") }}, {{ HTMLElement("img") }}, {{ HTMLElement("source") }}</td>
+   <td>Define los tamaños en los que el icono puede ser cargado.</td>
+  </tr>
+  <tr>
+   <td><code>span</code></td>
+   <td>{{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}</td>
+   <td>Indica el número de columnas que se agrupan.</td>
+  </tr>
+  <tr>
+   <td><code>spellcheck</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Indica si se permite la corrección ortográfica para el elemento.</td>
+  </tr>
+  <tr>
+   <td><code>src</code></td>
+   <td>{{ HTMLElement("audio") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("track") }}, {{ HTMLElement("video") }}</td>
+   <td>La URL del contenido integrable.</td>
+  </tr>
+  <tr>
+   <td><code>srcdoc</code></td>
+   <td>{{ HTMLElement("iframe") }}</td>
+   <td>Especifica el contenido de la página incluida.</td>
+  </tr>
+  <tr>
+   <td><code>srclang</code></td>
+   <td>{{ HTMLElement("track") }}</td>
+   <td>Especifica el lenguaje del contenido de la pista.</td>
+  </tr>
+  <tr>
+   <td><code>srcset</code></td>
+   <td>{{ HTMLElement("img") }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td><code>start</code></td>
+   <td>{{ HTMLElement("ol") }}</td>
+   <td>Define el número inicial de la lista (si es diferente a 1).</td>
+  </tr>
+  <tr>
+   <td><code>step</code></td>
+   <td>{{ HTMLElement("input") }}</td>
+   <td>Indica el valor del incremento para un valor numerico o de fecha.</td>
+  </tr>
+  <tr>
+   <td><code>style</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Define los estilos CSS que anulan los estilos establecidos previamente.</td>
+  </tr>
+  <tr>
+   <td><code>summary</code></td>
+   <td>{{ HTMLElement("table") }}</td>
+   <td>
+    <p>Contiene una descripción del contenido de la tabla.</p>
+
+    <p>Nota: Este atributo ha sido desaprovado, se recomienda incluir un elemento {{ HTMLElement("caption") }} en la tabla.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>tabindex</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Sobrescribe el orden de tabulacion del navegador y usa el especificado.</td>
+  </tr>
+  <tr>
+   <td><code>target</code></td>
+   <td>{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("form") }}</td>
+   <td>
+    <p>Especifica el marco destino en un vínculo.</p>
+
+    <p>Valores especiales: "_blank" indica una nueva ventana, "_parent" indica el marco padre del marco que contiene el código fuente, "_self" indica el marco donde está el código fuente y "_top" indica la ventana completa del navegador.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>title</code></td>
+   <td><a href="/es/docs/Web/HTML/Atributos_globales" title="/es/docs/Web/HTML/Atributos globales">Atributo Global</a></td>
+   <td>Texto a ser mostrado cuando el cursor esté sobre el elemento.</td>
+  </tr>
+  <tr>
+   <td><code>type</code></td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("command") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("object") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}, {{ HTMLElement("menu") }}</td>
+   <td>Define el tipo de elemento.</td>
+  </tr>
+  <tr>
+   <td><code>usemap</code></td>
+   <td>{{ HTMLElement("img") }},  {{ HTMLElement("input") }}, {{ HTMLElement("object") }}</td>
+   <td>
+    <p>Indica la URL parcial de un image map asociado con el elemento.</p>
+
+    <div class="note">
+    <p><strong>Note:</strong> Este atributo no puede ser usado si el elemento {{ HTMLElement("img") }} desciende de un {{ HTMLElement("button") }} o {{ HTMLElement("a") }}</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>value</code></td>
+   <td>{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("li") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("param") }}</td>
+   <td>Define el valor predeterminado a ser mostrado al cargar la página.</td>
+  </tr>
+  <tr>
+   <td><code>width</code></td>
+   <td>{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td>
+   <td>
+    <p>Para los elementos enumerados aquí, esto establece el ancho del elemento.</p>
+
+    <div class="note">
+    <p><strong>Nota:</strong> En algunos casos, como los {{ HTMLElement("div") }}, este es un atributo de referencia, en donde debes usar la propiedad CSS {{ Cssxref("height") }} en su lugar.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>wrap</code></td>
+   <td>{{ HTMLElement("textarea") }}</td>
+   <td>Indica la forma en la cual el texto debe ser envuelto.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Contenido_versus_atributos_IDL">Contenido versus atributos IDL</h2>
+
+<p>En HTML, la mayoria de los atributos tiene dos caras: el <strong>atributo de contenido</strong> y el <strong>atributo IDL</strong></p>
+
+<p>El atributo de contenido es aquel que se define desde el contenido (Codigo HTML) y puedes definirlo u obtenerlo con {{domxref("element.setAttribute()")}} o {{domxref("element.getAttribute()")}}. El atributo de contenido es siempre un string incluso cuando el valor esperado en un integer. Por ejemplo, para definir el maxlength de un {{HTMLElement("input")}} a 42 usando el atributo de contenido, se debe llamar a <code>setAttribute("maxlength", "42") en ese elemento.</code></p>
+
+<p>El atributo IDL, tambien conocido como propiedad JavaScript. Estos son atributos que se pueden leer o definir usando JavaScript como <code>element.foo.</code>. El atributo IDL siempre va a usar (pero puede transformarse) en el atributo de contenido subyacente para retornar un valor cuando lo obtiene y lo guarda en el atributo de contenido cuando es definido. En otras palabras el atributo IDL, en esencia, refleja los atributos de contenido.</p>
+
+<p>La mayoria del tiempo, los atributos IDL pueden retornar sus valores como realmente son usados. Por ejemplo, el <code>type</code> por defecto para los elementos {{HTMLElement("input")}} es "texto", entonces si defines <code>input.type="foobar",</code> el elemento <code>&lt;input&gt;</code> sera de tipo texto (en apariencia y comportamiento) pero el valor del Atributo de contenido "type" sera "foobat". De cualquier manera, el <code>type</code> del atributo IDL retornara el string "text".</p>
+
+<p>Los atributos IDL no son siempre strings; por ejemplo, <code>input.maxlength</code> es un numero (marcado como long). Cuando se usan atributos IDL, lees o defines valores del tipo deseado, entonces <code>input.maxlength </code>siempre retornara un numero y cuando definas <code>input,maxlength</code>, esperara un numero. Si se le entrega otro tipo, se convierte antomaticamente a numero como se especifica en las reglas del  estandar de JavaScript para conversiones de tipo.</p>
+
+<p>Los atributos IDL pueden <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">reflejar otros tipos</a> como un long sin asignacion, URL's, booleanos, etc. Desafortunadamente no hay reglas claras y el comportamiento que los atributos IDL en conjunto con sus respectivos atributos de contenido depende del mismo atributo. La mayoria del tiempo, siguen <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">las reglas de diseño en la especificacion</a>, pero algunas veces no lo hacen. Las especificaciones HTML tratan de ser lo mas amigables para el dasarrollador como es posible, pero por varias razones (mayormente historicas), algunos aributos se comportan de forma extraña (<code>select.size</code>, por ejemplo) y debes leer las especificaciones para comprender como éste se comporta exactamente.</p>
+
+<h2 id="Ver_Tambien">Ver Tambien</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Elemento" title="/es/docs/Web/HTML/Elemento">Elementos</a></li>
+</ul>
diff --git a/files/es/web/html/attributes/min/index.html b/files/es/web/html/attributes/min/index.html
new file mode 100644
index 0000000000..0fbd4a9b8f
--- /dev/null
+++ b/files/es/web/html/attributes/min/index.html
@@ -0,0 +1,163 @@
+---
+title: 'HTML el atributo: min'
+slug: Web/HTML/Attributes/min
+tags:
+  - Atributos
+  - Restricción de validación
+  - atributo
+  - min
+translation_of: Web/HTML/Attributes/min
+original_slug: Web/HTML/Atributos/min
+---
+<div id="step-include">
+<p><span class="seoSummary">El atributo {{HTMLAttrxRef("min", "input")}} define el valor mínimo que es aceptable y válido para el {{HTMLElement("input")}} que contiene el atributo. Si el {{web.link("/es/docs/Web/HTML/Element/input#attr-value", "value")}} del elemento es menor que esto, el elemento falla la {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}}. Este valor debe ser menor o igual que el valor del atributo {{HTMLAttrxRef("max", "input")}}. Si se especifica un valor para {{HTMLAttrxRef("min", "input")}} que no es un número válido, la entrada no tiene un valor mínimo.</span></p>
+
+<p>Válido para los tipos de entrada numérica, incluidos los tipos {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}} y {{HTMLElement("input/range", "range")}}, y el elemento {{htmlelement('meter')}}, el atributo {{HTMLAttrxRef("min", "input")}} es un número que especifica el valor mínimo de un control de formulario para ser considerado válido.</p>
+
+<h3 id="Sintaxis">Sintaxis</h3>
+
+<div id="step-include">
+<p>Si <code>any</code> no se establece explícitamente, los valores válidos para el <code>número</code>, los tipos de entrada de fecha/hora y los tipos de entrada de <code>range</code> son iguales a la base de paso a paso: el valor {{HTMLAttrxRef("min", "input")}} y los incrementos del valor del paso, hasta el valor {{web.link("/es/docs/Web/HTML/Attributes/max", "max")}}, si se especifica. Por ejemplo, si tienes <code>&lt;input type="number" min="10" step="2"&gt;</code>, cualquier entero par, 10 o mayor, es válido. Si se omite, <code>&lt;input type="number"&gt;</code>, cualquier número entero es válido, pero los flotantes, como 4.2, no son válidos, ya que el <code>step</code> predeterminado es 1. Para que 4.2 sea válido, <code>step</code> se debería haber configurado en <code>any</code>, 0.1, 0.2, o cualquiera, el valor mínimo tendría que ser un número terminado en 0.2 , como <code>&lt;input type="number" min="-5.2"&gt;</code></p>
+
+<table class="standard-table">
+ <caption>Sintaxis para valores {{HTMLAttrxRef("min", "input")}} por <code>&lt;input type="" /&gt;</code></caption>
+ <thead>
+  <tr>
+   <th>Tipo del <code>input</code></th>
+   <th>Ejemplo</th>
+   <th>Ejemplo</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("input/date", "date")}}</td>
+   <td><code class="brush: html">yyyy-mm-dd</code></td>
+   <td><code class="brush: html">&lt;input type="date" min="2019-12-25" step="1"&gt;</code></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input/month", "month")}}</td>
+   <td><code class="brush: html">yyyy-mm</code></td>
+   <td><code class="brush: html">&lt;input type="month" min="2019-12" step="12"&gt;</code></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input/week", "week")}}</td>
+   <td><code class="brush: html">yyyy-W##</code></td>
+   <td><code class="brush: html">&lt;input type="week" min="2019-W23" step=""&gt;</code></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input/time", "time")}}</td>
+   <td><code class="brush: html">hh:mm</code></td>
+   <td><code class="brush: html">&lt;input type="time" min="09:00" step="900"&gt;</code></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input/datetime-local", "datetime-local")}}</td>
+   <td><code>yyyy-mm-ddThh:mm</code></td>
+   <td><code class="brush: html">&lt;input type="datetime-local" min="2019-12-25T19:30"&gt;</code></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input/number", "number")}}</td>
+   <td>{{web.link("/es/docs/Web/CSS/number", "number")}}</td>
+   <td><code class="brush: html">&lt;input type="number" min="0" step="5" max="100"&gt;</code></td>
+  </tr>
+  <tr>
+   <td>{{HTMLElement("input/range", "range")}}</td>
+   <td>{{web.link("/es/docs/Web/CSS/number", "number")}}</td>
+   <td><code class="brush: html">&lt;input type="range" min="60" step="5" max="100"&gt;</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: Cuando los datos ingresados por el usuario no se adhieren al valor mínimo establecido, el valor se considera inválido en la restricción de validación y coincidirá con la pseudoclase <code>:invalid</code></p>
+</div>
+</div>
+
+<p>Consulta {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "Validación del lado del cliente")}} y {{DOMxRef("ValidityState.rangeUnderflow", "rangeUnderflow")}} para más información.</p>
+
+<p>Para el elemento {{HTMLElement('meter')}}, el atributo {{HTMLAttrxRef("min", "input")}} define el límite numérico inferior del rango medido. Debe ser menor que el valor mínimo (atributo {{web.link("/es/docs/Web/HTML/Attributes/max", "max")}}), si se especifica. En ambos casos, si se omite, el valor predeterminado es 1.</p>
+
+<table class="standard-table">
+ <caption>Sintaxis para valores {{HTMLAttrxRef("min", "input")}} para otros elementos</caption>
+ <thead>
+  <tr>
+   <th>Tipo del <code>input</code></th>
+   <th>Sintaxis</th>
+   <th>Ejemplo</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{HTMLElement("meter")}}</td>
+   <td>{{web.link("/es/docs/Web/CSS/number", "number")}}</td>
+   <td><code>&lt;meter id="fuel" min="0" max="100" low="33" high="66" optimum="80" value="40"&gt; at 40/100&lt;/meter&gt;</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Impacto_en_step">Impacto en <code>step</code></h3>
+
+<p>Los valores de {{HTMLAttrxRef("min", "input")}} y <code>step</code> definen cuáles son los valores válidos, incluso si el atributo <code>step</code> no está incluido, como el <code>step</code> predeterminado de <code>0</code>.</p>
+
+<p>Agrega un gran borde rojo alrededor de los {{HTMLElement("input")}}s no válidos:</p>
+
+<pre class="brush: css notranslate">input:invalid {
+  border: solid red 3px;
+}</pre>
+
+<p>Luego define un {{HTMLElement("input")}} con un valor mínimo de 7.2, omitiendo el atributo <code>step</code>, en donde el valor predeterminado es 1.</p>
+
+<pre class="brush: html notranslate">&lt;input id="myNumber" name="myNumber" type="number" min="7.2" value="8"&gt;</pre>
+
+<p>Dado que <code>step</code> tiene el valor predeterminado de 1, los valores válidos incluyen <code>7.2</code>, <code>8.2</code>, <code>9.2</code> y así sucesivamente. El valor 8 no es válido. Dado que incluye un valor no válido, los navegadores compatibles mostrarán el valor como no válido.</p>
+
+<p>{{EmbedLiveSample("Impacto_en_step",200,55)}}</p>
+
+<p>Si no se incluye explícitamente, <code>step</code> tiene como valor predeterminado 1 para <code>número</code> y <code>range</code>, y 1 tipo de unidad (segundo, semana, mes, día) para los {{HTMLElement("input")}}s de tipo fecha/hora.</p>
+</div>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.attributes.min")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'input.html#the-min-and-max-attributes', 'min attribute')}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'input.html#the-min-and-max-attributes', 'min attribute')}}</td>
+   <td>{{ Spec2('HTML5 W3C') }}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Problemas_de_accesibilidad">Problemas de accesibilidad</h2>
+
+<p>Proporciona instrucciones para ayudar a los usuarios a comprender cómo completar el formulario y utilizar controles de formulario individuales. Indica cualquier entrada requerida y opcional, formatos de datos y otra información relevante. Cuando utilices el atributo {{HTMLAttrxRef("min", "input")}}, asegúrate de que el usuario comprenda este requisito mínimo. Posiblemente sea suficiente proporcionar instrucciones dentro de un {{HTMLElement('label')}}. Si proporcionas instrucciones fuera de las etiquetas, lo cual permite un posicionamiento y un diseño más flexibles, considera usar {{web.link("/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute", "aria-labelledby")}} o {{web.link("/es/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-descriptionsby_attribute", "aria-describedby")}}.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Web/HTML/Attributes/step", "step")}}</li>
+ <li>{{web.link("/es/docs/Web/HTML/Attributes/max", "max")}}</li>
+ <li>{{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricciones de validación")}}</li>
+ <li>{{DOMxRef('Constraint_validation')}}</li>
+ <li>{{DOMxRef('validityState.rangeUnderflow')}}</li>
+ <li>{{CSSxRef(':out-of-range')}}</li>
+ <li>{{HTMLElement('input')}}</li>
+ <li>Los tipos {{HTMLElement("input/date", "date")}}, {{HTMLElement("input/month", "month")}}, {{HTMLElement("input/week", "week")}}, {{HTMLElement("input/time", "time")}}, {{HTMLElement("input/datetime-local", "datetime-local")}}, {{HTMLElement("input/number", "number")}}, {{HTMLElement("input/range", "range")}} y {{htmlelement('meter')}}</li>
+</ul>
diff --git a/files/es/web/html/attributes/minlength/index.html b/files/es/web/html/attributes/minlength/index.html
new file mode 100644
index 0000000000..a982aee0a3
--- /dev/null
+++ b/files/es/web/html/attributes/minlength/index.html
@@ -0,0 +1,72 @@
+---
+title: 'HTML el atributo: minlength'
+slug: Web/HTML/Attributes/minlength
+tags:
+  - Entrada
+  - Input
+  - Referencia
+  - atributo
+  - minlength
+  - textarea
+translation_of: Web/HTML/Attributes/minlength
+original_slug: Web/HTML/Atributos/minlength
+---
+<p class="summary">El atributo <strong><code>minlength</code></strong> define el número mínimo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en un {{HTMLElement('input')}} o {{HTMLElement('textarea')}}. Debe ser un valor entero 0 o superior. Si no se especifica una longitud mínima o se especifica un número no válido, el <strong><code>&lt;input&gt;</code></strong> no tiene una longitud mínima. Este valor debe ser menor o igual que el valor de {{web.link("/es/docs/Web/HTML/Attributes/maxlength", "maxlength")}}; de lo contrario, el valor nunca será válido, puesto que es imposible cumplir con ambos criterios.</p>
+
+<p>El <strong><code>&lt;input&gt;</code></strong> fallará la restricción de validación si la longitud del valor de texto del campo es menor que la longitud mínima de unidades de código UTF-16, con {{DOMxRef('validityState.tooShort')}} devolviendo <code>true</code>. La validación de la restricción solo se aplica cuando el usuario cambia el valor. Una vez que el envío falla, algunos navegadores mostrarán un mensaje de error que indica la longitud mínima requerida y la longitud actual.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Al agregar <code>minlength="5"</code>, el valor debe estar vacío o tener cinco caracteres o más para ser válido.</p>
+
+<pre class="brush: html notranslate">&lt;label for="fruit"&gt;Ingresa un nombre de fruta que tenga al menos 5 letras&lt;/label&gt; &lt;input type="text" minlength="5" id="fruit"&gt;</pre>
+
+<p>Podemos usar pseudoclases para estilizar el elemento en función de si el valor es válido. El valor será válido siempre que sea <code>null</code> (vacío) o tenga cinco o más caracteres. <em>Lima</em> no es válido, <em>limón es válido</em>.</p>
+
+<pre class="brush: css notranslate">input {
+  border: 2px solid currentcolor;
+}
+input:invalid {
+  border: 2px dashed red;
+}
+input:invalid:focus {
+  background-image: linear-gradient(pink, lightgreen);
+}</pre>
+
+<p>{{EmbedLiveSample('Ejemplos', '100%', 200)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'input.html#attr-input-minlength', 'atributo minlength')}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'input.html#attr-minlength-accept', 'atributo minlength')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.attribute.minlength")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Web/HTML/Attributes/maxlength", "maxlength")}}</li>
+ <li>{{web.link("/es/docs/Web/HTML/Attributes/size", "size")}}</li>
+ <li>{{web.link("/es/docs/Web/HTML/Attributes/pattern", "pattern")}}</li>
+ <li>{{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "Restricción de validación")}}</li>
+</ul>
diff --git a/files/es/web/html/attributes/multiple/index.html b/files/es/web/html/attributes/multiple/index.html
new file mode 100644
index 0000000000..1aa9fe819b
--- /dev/null
+++ b/files/es/web/html/attributes/multiple/index.html
@@ -0,0 +1,183 @@
+---
+title: 'HTML el atributo: multiple'
+slug: Web/HTML/Attributes/multiple
+tags:
+  - Atributos
+  - Resticción de validación
+  - atributo
+translation_of: Web/HTML/Attributes/multiple
+original_slug: Web/HTML/Atributos/multiple
+---
+<p>El atributo booleano {{HTMLAttrxRef("multiple", "input")}}, si se establece, significa que el control del formulario acepta uno o más valores. Válido para los {{HTMLElement("input")}}s de tipo {{HTMLElement("input/email", "email")}}, {{HTMLElement("input/file", "file")}} y {{HTMLElement("select")}}, la forma en que el usuario opta por valores múltiples depende del control del formulario.</p>
+
+<p>Dependiendo del tipo, el control de formulario puede tener una apariencia diferente si se establece el atributo {{HTMLAttrxRef("multiple", "input")}}. Para el {{HTMLElement("input")}} de tipo <code>file</code>, la mensajería nativa que proporciona el navegador es diferente. En Firefox, el {{HTMLElement("input")}} de tipo <code>file</code> dice "Ningún archivo seleccionado" cuando el atributo está presente y "Ningún archivo seleccionado", cuando no hay archivo seleccionado. La mayoría de los navegadores muestran un cuadro de lista de desplazamiento para un control {{HTMLElement("select")}} con el atributo {{HTMLAttrxRef("multiple", "input")}} establecido frente a un menú desplegable de una sola línea cuando se omite el atributo. El {{HTMLElement("input")}} {{HTMLElement("input/email", "email")}} muestra lo mismo, pero coincidirá con la pseudoclase {{CSSxRef(':invalid')}} si hay más de una dirección de correo electrónico separada por comas incluido si el atributo no está presente.</p>
+
+<p>Cuando se establece {{HTMLAttrxRef("multiple", "input")}} en el tipo de entrada {{HTMLElement("input/email", "email")}}, el usuario puede incluir cero (si no es {{web.link("/es/docs/Web/HTML/Attributes/required", "required")}} también), una o más direcciones de correo electrónico separadas por comas.</p>
+
+<pre class="brush: html notranslate"><code class="brush: html">&lt;input type="email" <strong>multiple</strong> name="emails" id="emails"&gt;</code></pre>
+
+<p>Si y solo si se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, el valor puede ser una lista de direcciones de correo electrónico separadas por comas y formadas correctamente. Los espacios en blanco iniciales y finales se eliminan de cada dirección de la lista.</p>
+
+<p>Cuando se establece {{HTMLAttrxRef("multiple", "input")}} en el tipo de entrada {{HTMLElement("input/file", "file")}}, el usuario puede seleccionar uno o más archivos. El usuario puede elegir varios archivos del selector de archivos de cualquier manera que la plataforma elegida lo permita (por ejemplo, manteniendo presionada la tecla <kbd>Mayús</kbd> o <kbd>Control</kbd> y luego haciendo clic).</p>
+
+<pre class="brush: html notranslate"><code class="brush: html">&lt;input type="file" <strong>multiple</strong> name="uploads" id="uploads"&gt;</code></pre>
+
+<p>Cuando se omite el atributo, el usuario solo puede seleccionar un único archivo por {{HTMLElement("input")}}.</p>
+
+<p>El atributo {{HTMLAttrxRef("multiple", "input")}} en el elemento {{HTMLElement("select")}} representa un control para seleccionar cero o más opciones de la lista. De lo contrario, el elemento {{HTMLElement("select")}} representa un control para seleccionar una única {{HTMLElement("option")}} de la lista de opciones.</p>
+
+<pre class="brush: html notranslate">&lt;select multiple name="drawfs" id="drawfs"&gt;
+  &lt;option&gt;Gruñón&lt;/option&gt;
+  &lt;option&gt;Feliz&lt;/option&gt;
+  &lt;option&gt;Dormilón&lt;/option&gt;
+  &lt;option&gt;Tímido&lt;/option&gt;
+  &lt;option&gt;Estornudo&lt;/option&gt;
+  &lt;option&gt;Tontín&lt;/option&gt;
+  &lt;option&gt;Doc&lt;/option&gt;
+&lt;/select&gt;</pre>
+
+<p>Cuando se especifica {{HTMLAttrxRef("multiple", "input")}}, la mayoría de los navegadores mostrarán un cuadro de lista de desplazamiento en lugar de un menú desplegable de una sola línea.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="input_para_correoᵉ"><code>input</code> para correoᵉ</h3>
+
+<pre class="brush: html notranslate">&lt;label for="emails"&gt;¿A quién deseas enviar un correo electrónico?&lt;/label&gt;
+&lt;input type="email" multiple name="emails" id="emails" list="drawfemails" required size="64"&gt;
+
+&lt;datalist id="drawfemails"&gt;
+  &lt;option value="gruñón@woodworkers.com"&gt;Gruñón&lt;/option&gt;
+  &lt;option value="feliz@woodworkers.com"&gt;Feliz&lt;/option&gt;
+  &lt;option value="dormilón@woodworkers.com"&gt;Dormilón&lt;/option&gt;
+  &lt;option value="tímido@woodworkers.com"&gt;Tímido&lt;/option&gt;
+  &lt;option value="estornudo@woodworkers.com"&gt;Estornudo&lt;/option&gt;
+  &lt;option value="tontín@woodworkers.com"&gt;Tontín&lt;/option&gt;
+  &lt;option value="doc@woodworkers.com"&gt;Doc&lt;/option&gt;
+&lt;/datalist&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">input:invalid {border: red solid 3px;}</pre>
+</div>
+
+<p>Si y solo si se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, el valor puede ser una lista de direcciones de correo electrónico separadas por comas y formadas correctamente. Los espacios en blanco iniciales y finales se eliminan de cada dirección de la lista. Si el atributo {{web.link("/es/docs/Web/HTML/Attributes/required", "required")}} está presente, se requiere al menos una dirección de correo electrónico.</p>
+
+<p>Algunos navegadores admiten la aparición de la {{web.link("/es/docs/Web/HTML/Attributes/list", "lista")}} de opciones del {{HTMLElement('datalist')}} para direcciones de correo electrónico posteriores cuando haya varias. Otros no lo hacen.</p>
+
+<p>{{EmbedLiveSample("input_para_correoᵉ", 600, 80) }}</p>
+
+<h3 id="input_de_tipo_file"><code>input</code> de tipo <code>file</code></h3>
+
+<p>Cuando se establece {{HTMLAttrxRef("multiple", "input")}} en el {{HTMLElement("input")}} de tipo  {{HTMLElement("input/file", "file")}}, el usuario puede seleccionar uno o más archivos:</p>
+
+<pre class="brush: html notranslate">&lt;form method="post" enctype="multipart/form-data"&gt;
+  &lt;p&gt;
+    &lt;label for="uploads"&gt;
+       Elige las imágenes que deseas cargar:
+    &lt;/label&gt;
+    &lt;input type="file" id="uploads" name="uploads" accept=".jpg, .jpeg, .png, .svg, .gif" multiple&gt;
+  &lt;/p&gt;
+  &lt;p&gt;
+    &lt;label for="text"&gt;Elige un archivo de texto para cargar: &lt;/label&gt;
+    &lt;input type="file" id="text" name="text" accept=".txt"&gt;
+ &lt;/p&gt;
+  &lt;p&gt;
+    &lt;input type="submit" value="Enviar"&gt;
+  &lt;/p&gt;
+&lt;/form&gt;</pre>
+
+<p>{{EmbedLiveSample("input_de_tipo_file", 600, 80) }}</p>
+
+<p>Nota la diferencia en la apariencia entre el ejemplo con {{HTMLAttrxRef("multiple", "input")}} establecido y el otro {{HTMLElement("input")}} sin <code>file</code>.</p>
+
+<p>Cuando se envía el formulario, utilizas el {{web.link("/es/docs/Web/HTML/Element/form", "method='get'")}} el nombre de cada archivo seleccionado se habría agregado a los parámetros de la URL como <code>?uploads=img1.jpg&amp;uploads=img2.svg</code>. Sin embargo, dado que estamos asumiendo datos de formularios de {{web.link("/es/docs/Web/API/XMLHttpRequest/multipart", "multipart")}}, usamos mucho el <code>post</code>. Consulta el elemento {{HTMLElement('form')}} y {{web.link("/es/docs/Learn/HTML/Forms/Sending_and_retrieving_form_data#The_method_attribute", "envío de datos del formulario")}} para obtener más información.</p>
+
+<h3 id="select"><code>select</code></h3>
+
+<p>El atributo {{HTMLAttrxRef("multiple", "input")}} en el elemento {{HTMLElement("select")}} representa un control para seleccionar cero o más opciones de la lista. De lo contrario, el elemento {{HTMLElement("select")}} representa un control para seleccionar una única {{HTMLElement("option")}} de la lista de opciones. El control generalmente tiene una apariencia diferente en función de la presencia del atributo {{HTMLAttrxRef("multiple", "input")}}, y la mayoría de los navegadores muestran un cuadro de lista de desplazamiento en lugar de una lista desplegable de una sola línea cuando el atributo está presente.</p>
+
+<pre class="brush: html notranslate">&lt;form method="get" action="#"&gt;
+&lt;p&gt;
+ &lt;label for="dwarfs"&gt;Selecciona los leñadores que te gusten:&lt;/label&gt;
+  &lt;select multiple name="drawfs" id="drawfs"&gt;
+    &lt;option&gt;gruñón@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;feliz@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;dormilón@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;tímido@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;estornudo@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;tontín@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;doc@woodworkers.com&lt;/option&gt;
+  &lt;/select&gt;
+&lt;/p&gt;
+&lt;p&gt;
+ &lt;label for="favoriteOnly"&gt;Selecciona tu favorito:&lt;/label&gt;
+  &lt;select name="favoriteOnly" id="favoriteOnly"&gt;
+    &lt;option&gt;gruñón@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;feliz@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;dormilón@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;tímido@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;estornudo@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;tontín@woodworkers.com&lt;/option&gt;
+    &lt;option&gt;doc@woodworkers.com&lt;/option&gt;
+  &lt;/select&gt;
+&lt;/p&gt;
+&lt;p&gt;
+  &lt;input type="submit" value="Enviar"&gt;
+&lt;/p&gt;
+&lt;/form&gt;</pre>
+
+<p>{{EmbedLiveSample("select", 600, 120) }}</p>
+
+<p>Ten en cuenta la diferencia de apariencia entre los dos controles de formulario.</p>
+
+<pre class="brush: css notranslate">/* descomenta este CSS para que el multiple tenga la misma altura que single */
+
+/*
+select[multiple] {
+  height: 1.5em;
+  vertical-align: top;
+}
+select[multiple]:focus,
+select[multiple]:active {
+  height: auto;
+}
+*/</pre>
+
+<p>Hay varias formas de seleccionar varias opciones en un elemento <code>&lt;select&gt;</code> con un atributo {{HTMLAttrxRef("multiple", "input")}}. Dependiendo del sistema operativo, los usuarios del ratón pueden mantener presionadas las teclas <kbd>Ctrl</kbd>, <kbd>Comando</kbd> o <kbd>Mayús</kbd> y luego hacer clic en varias opciones para seleccionarlas o deseleccionarlas. Los usuarios de teclado pueden seleccionar varios elementos contiguos centrándose en el elemento <code>&lt;select&gt;</code>, seleccionando un elemento en la parte superior o inferior del rango que desean seleccionar usando <kbd>Arriba</kbd> y <kbd>Teclas del cursor hacia abajo</kbd> para subir y bajar las opciones. La selección de elementos no contiguos no es tan compatible: los elementos se deben poder seleccionar y deseleccionar presionando <kbd>Espacio</kbd>, pero el soporte varía entre los navegadores.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'input.html#attr-input-multiple', 'Atributo multiple')}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'input.html#attr-input-multiple', 'Atributo multiple')}}</td>
+   <td>{{ Spec2('HTML5 W3C') }}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Problemas_de_accesibilidad">Problemas de accesibilidad</h2>
+
+<p>Proporciona instrucciones para ayudar a los usuarios a comprender cómo completar el formulario y utilizar controles de formulario individuales. Indica cualquier entrada requerida y opcional, formatos de datos y otra información relevante. Cuando utilices el atributo {{HTMLAttrxRef("multiple", "input")}}, informa al usuario que se permiten múltiples valores y proporciona instrucciones sobre cómo proveer más valores, como "direcciones de correo electrónico separadas con una coma".</p>
+
+<p>Configurar {{web.link("/es/docs/Web/HTML/Attributes/size", "size")}}<code>="1"</code> en una selección múltiple puedes hacer que aparezca como una única selección en algunos navegadores, pero luego no se expande en el enfoque, lo que perjudica la usabilidad. No hagas eso. Si cambias la apariencia de un <code>select</code>, e incluso si no lo haces, asegúrate de informar al usuario que se puede seleccionar más de una opción mediante otro método.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{HTMLElement('input')}}</li>
+ <li>{{htmlelement('select')}}</li>
+ <li>{{web.link("/es/docs/Web/HTML/Element/input/email#Allowing_multiple_e-mail_addresses", "Permitir varias direcciones de correo electrónico")}}</li>
+</ul>
diff --git a/files/es/web/html/canvas/a_basic_ray-caster/index.html b/files/es/web/html/canvas/a_basic_ray-caster/index.html
deleted file mode 100644
index 7917541554..0000000000
--- a/files/es/web/html/canvas/a_basic_ray-caster/index.html
+++ /dev/null
@@ -1,59 +0,0 @@
----
-title: A basic ray-caster
-slug: Web/HTML/Canvas/A_basic_ray-caster
-tags:
-  - Avanzado
-  - Canvas
-  - Ejemplo
-  - Espanol(2)
-  - Gráficos(2)
-  - HTML
-  - Necesita traducción
-  - Web
-translation_of: Web/API/Canvas_API/A_basic_ray-caster
----
-<div>{{CanvasSidebar}}</div>
-
-<div class="summary">
-<p>Este artículo proporciona un interesante ejemplo de la vida real usando el elemento {{HTMLElement("canvas")}} para renderizar un sencillo entorno 3D usando una técnica de render llamada ray-casting.</p>
-</div>
-
-<p>{{EmbedGHLiveSample("canvas-raycaster/index.html", 900, 300)}}</p>
-
-<p><strong><a href="http://mdn.github.io/canvas-raycaster/">Abrir en una nueva ventana</a></strong></p>
-
-<h2 id="Why.3F" name="Why.3F">¿Por qué?</h2>
-
-<p> </p>
-
-<p>Después de darme cuenta, para mi satisfacción, de que el ingenioso elemento &lt;canvas&gt; sobre el que había estado leyendo, no sólo iba a recibir soporte por parte de Firefox, sino que <strong>ya estaba</strong> soportado por la versión actual de Safari, así que tenía que ponerme manos a la obra y hacer un pequeño experimento.</p>
-
-<p>El <a href="https://developer.mozilla.org/en-US/docs/Canvas_tutorial">tutorial</a> y el <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API">resumen</a> que encontré en la MDN son geniales, pero nadie había escrito nada (todavía) sobre animación, así que pensé que sería una buena oportunidad para portar un sencillo raycaster en el que había trabajado hacía tiempo y comprobar qué tipo de rendimiento podía esperar de un buffer de pixeles controlado por JavaScript.</p>
-
-<h2 id="How.3F" name="How.3F">¿Cómo?</h2>
-
-<p>La idea es sencilla, usar {{domxref("WindowTimers.setInterval","setInterval()")}} con un retraso arbitrario que se corresponde con la velocidad de fotogramas deseada. Por cada llamada al intervalo se ejecutará una función que volverá a pintar el elemento &lt;canvas&gt;  en el que se muestra la vista actual del usuario. Sé que podría haber empezado con un ejemplo más simple, pero creo que el <a href="/en-US/docs/Web/API/Canvas_API/Tutorial/Basic_animations">tutorial</a> sobre &lt;canvas&gt; vale para eso, y quería ver si podía hacer esto.</p>
-
-<p>Continuemos, por cada actualización, el raycaster comprueba si has presionado alguna tecla, si no has presionado ninguna se mantendrán los cálculos para ahorrar tiempo de ejecución. Si se ha presionado alguna tecla, el &lt;canvas&gt; es borrado, el suelo y el cielo son pintados, la posición y la orientación de la cámara son actualizados, y los rayos son lanzados. Según van intersectando los rayos con las paredes se van pintando líneas verticales de pared del color de la pared con la que han colisionado, mezcladas con una versión más oscura del color en función de la distancia a la que se encuentra la pared. La altura de la línea vertical depende directamente de la distancia a la que el rayo es interesectado, dibujándose centrada con respecto la línea del horizonte.</p>
-
-<p>El código que he terminado usando es una amalgama regurgitada del código que aparece en los capítulos sobre raycasting del libro de André LaMothe <em>Tricks of the Game Programming Gurus</em> y una <a class="external" href="http://www.shinelife.co.uk/java-maze/">versión en java de un raycaster</a> que encontré online, a su vez pasado por el filtro de mi pulsión a renombrar todo para que tenga sentido para mí y todo el chapuceo necesario para que las cosas funcionen bien.</p>
-
-<h2 id="Results" name="Results">Resultados</h2>
-
-<p>El &lt;canvas&gt; en Safari 2.0.1 rindió sorprendentemente bien. Renderizando columnas de 8 pixeles de ancho, puedo correr una ventana de 320 x 240 a 24 FPS en mi Apple Mini. Firefox 1.5 Beta 1 es incluso más rápido; puedo correr una ventana de 320 x 240 a 24 FPS con columnas de 4 píxeles de ancho. No es exactamente un nuevo miembro de la familia de ID Software, pero es bastante decente teniendo en cuenta que es un entorno completamente interpretado, y que no me he tenido que preocupar de reservar memoria, ni modos de vídeo o escribir rutinas en ensamblador. Aún así el código intenta ser lo más eficiente posible, usando tablas de acceso rápido para valores precalculados, pero no soy ningún gurú de la optimización, así que seguramente haya varias cosas que se puedan escribir más rápido.</p>
-
-<p>Además, deja bastante que desear en términos de intentar convertir esto en un motor de juego - no hay texturas en las paredes, no hay sprites, no hay puertas, ni siquiera hay teletransportadores que te permitan ir a otro nivel. Pero tengo bastante confianza en que todas esas cosas se podrían añadir con el suficiente tiempo disponible. La API de canvas soporta copiado de píxeles de imágenes, así que tener texturas parece bastante factible. Dejaré esto para otro artículo, seguramente para otra persona. =)</p>
-
-<h2 id="The_RayCaster" name="The_RayCaster">El ray-caster</h2>
-
-<p>El gente tan maravillosa que hay aquí han copiado manualmente mis archivos así vosotros podéis echarle un <a href="http://mdn.github.io/canvas-raycaster/">vistazo</a>, y para vuestro disfrute he puesto los archivos individuales como listados de código (ver abajo).</p>
-
-<p>¡Así que aquí lo tenéis, arrancad Safari 1.3+ o Firefox 1.5+ o cualquier otro navegador que soporte el elemento <code>&lt;canvas&gt;</code> y a disfrutar!<br>
- <br>
- <small><a href="https://github.com/mdn/canvas-raycaster/blob/master/input.js">input.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/Level.js">Level.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/Player.js">Player.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/index.html">RayCaster.html</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/RayCaster.js">RayCaster.js</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/trace.css">trace.css</a> | <a href="https://github.com/mdn/canvas-raycaster/blob/master/trace.js">trace.js</a> </small></p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Canvas_API/Tutorial">Tutorial de canvas</a></li>
-</ul>
diff --git a/files/es/web/html/canvas/drawing_graphics_with_canvas/index.html b/files/es/web/html/canvas/drawing_graphics_with_canvas/index.html
deleted file mode 100644
index 7271aabfb7..0000000000
--- a/files/es/web/html/canvas/drawing_graphics_with_canvas/index.html
+++ /dev/null
@@ -1,162 +0,0 @@
----
-title: Dibujando gráficos con canvas
-slug: Web/HTML/Canvas/Drawing_graphics_with_canvas
-translation_of: Web/API/Canvas_API/Tutorial
-translation_of_original: Web/API/Canvas_API/Drawing_graphics_with_canvas
----
-<div class="note">
- <p>Most of this content (but not the documentation on drawWindow) has been rolled into the more expansive <a href="/en-US/docs/HTML/Canvas/Tutorial" title="HTML/Canvas/tutorial">Canvas tutorial</a>, this page should probably be redirected there as it's now redundant but some information may still be relevant.</p>
-</div>
-<h2 id="Introduction" name="Introduction">Introduction</h2>
-<p>Firefox 1.5, incluye un nuevo elemento HTML para gráficos programables.   &lt;canvas&gt; está basado en la especificación de canvas WHATWG, la que a su vez está basada en el &lt;canvas&gt; de Apple, implementado en Safari.   Puede ser usado para la renderización de gráficos, elementos de Interfaz de usuarios, y otros gráficos personalizados en el cliente.</p>
-<p>La etiqueta &lt;canvas&gt; crea una superficie de dibujo de tamaño fijo que expone uno o más contextos de renderizado.   Nos enfocaremos en la representación del contexto 2D   Para gráficos 3D, podrías usar la <a href="/es-ES/docs/WebGL">representación del contexto WebGL</a></p>
-<h2 id="The_2D_Rendering_Context" name="The_2D_Rendering_Context">El contexto de representación 2D</h2>
-<h3 id="A_Simple_Example" name="A_Simple_Example">Un ejemplo sencillo</h3>
-<p>Para comenzar, aquí un sencillo ejemplo que dibuja dos rectángulos interesándose, uno de los cuales tiene transparencia alfa.</p>
-<pre class="brush: js">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  ctx.fillStyle = "rgb(200,0,0)";
-  ctx.fillRect (10, 10, 55, 50);
-
-  ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
-  ctx.fillRect (30, 30, 55, 50);
-}
-</pre>
-<div class="hidden">
- <pre class="brush: html">&lt;canvas id="canvas" width="120" height="120"&gt;&lt;/canvas&gt;</pre>
- <pre class="brush: js">draw();</pre>
-</div>
-<p>{{EmbedLiveSample('A_Simple_Example','150','150','/@api/deki/files/602/=Canvas_ex1.png')}}</p>
-<p>La funcion draw obtiene el elemento canvas, entonces obtiene el contexto 2D.   El objeto ctx puede entonces actualmente ser renderizado para el canvas   El ejemplo simplemente llena dos rectangulos, configurando fillStyle a dos diferentes colores utilizando las especificaciones de color de CSS y llamando a fillRect   El segundo FillStyle usa rgba() para especificar un valor alpha junto con el color.</p>
-<p>El fillRect, strokeRect, y clearRect llama a render a ser llenado, bosquejado o limpiar rectangulo.   Para representar formas más complejas, se usan trayectorias.  </p>
-<h3 id="Using_Paths" name="Using_Paths">Usando trayectorias</h3>
-<p>La funcion Path inicia un nuevo trazo, y move to, line to, arc to, arc, y metodos similares son usados para agregar segmentos al trazo.   La trayectoria puede ser cerrada usando closePath   Una vez la trayectoria es creada, puedes usar fill o stroke para representar la trayectoria en el canvas.</p>
-<pre class="brush: js">function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  ctx.fillStyle = "red";
-
-  ctx.beginPath();
-  ctx.moveTo(30, 30);
-  ctx.lineTo(150, 150);
-  // was: ctx.quadraticCurveTo(60, 70, 70, 150); which is wrong.
-  ctx.bezierCurveTo(60, 70, 60, 70, 70, 150); // &lt;- this is right formula for the image on the right -&gt;
-  ctx.lineTo(30, 30);
-  ctx.fill();
-}
-</pre>
-<div class="hidden">
- <pre class="brush: html">&lt;canvas id="canvas" width="160" height="160"&gt;&lt;/canvas&gt;</pre>
- <pre class="brush: js">draw();</pre>
-</div>
-<p>{{EmbedLiveSample('Using_Paths','190','190','/@api/deki/files/603/=Canvas_ex2.png')}}</p>
-<p>Llamando fill() o stroke() causa que el trazo sea usado.   Para ser llenado o juntado otra vez, el trazo debe ser recreado.</p>
-<h3 id="Graphics_State" name="Graphics_State">Estado de gráficos</h3>
-<p>Los atributos del contexto como fillStyle, strokeStyle, lineWidth, y lineJoin son parte de actual estado de graficos   El contexto provee dos metodos, save() y restore(), que pueden ser usados para mover el actual estado y desde estado stack.</p>
-<h3 id="A_More_Complicated_Example" name="A_More_Complicated_Example">Un ejemplo más complicado</h3>
-<p>Hay aquì un ejemplo más complicado, que usa rutas,estado y tambien introduce la actual matriz de transformación.   Los metodos de contexto translate(), scale(), y rotate() todos transforman la matriz actual.   Todos los puntos renderizados son primero transformados por esta matriz.</p>
-<pre class="brush: js">function drawBowtie(ctx, fillStyle) {
-
-  ctx.fillStyle = "rgba(200,200,200,0.3)";
-  ctx.fillRect(-30, -30, 60, 60);
-
-  ctx.fillStyle = fillStyle;
-  ctx.globalAlpha = 1.0;
-  ctx.beginPath();
-  ctx.moveTo(25, 25);
-  ctx.lineTo(-25, -25);
-  ctx.lineTo(25, -25);
-  ctx.lineTo(-25, 25);
-  ctx.closePath();
-  ctx.fill();
-}
-
-function dot(ctx) {
-  ctx.save();
-  ctx.fillStyle = "yellow";
-  ctx.fillRect(-2, -2, 4, 4);
-  ctx.restore();
-}
-
-function draw() {
-  var ctx = document.getElementById('canvas').getContext('2d');
-
-  // note that all other translates are relative to this one
-  ctx.translate(45, 45);
-
-  ctx.save();
-  //ctx.translate(0, 0); // unnecessary
-  drawBowtie(ctx, "red");
-  dot(ctx);
-  ctx.restore();
-
-  ctx.save();
-  ctx.translate(85, 0);
-  ctx.rotate(45 * Math.PI / 180);
-  drawBowtie(ctx, "green");
-  dot(ctx);
-  ctx.restore();
-
-  ctx.save();
-  ctx.translate(0, 85);
-  ctx.rotate(135 * Math.PI / 180);
-  drawBowtie(ctx, "blue");
-  dot(ctx);
-  ctx.restore();
-
-  ctx.save();
-  ctx.translate(85, 85);
-  ctx.rotate(90 * Math.PI / 180);
-  drawBowtie(ctx, "yellow");
-  dot(ctx);
-  ctx.restore();
-}
-</pre>
-<div class="hidden">
- <pre class="brush: html">&lt;canvas id="canvas" width="185" height="185"&gt;&lt;/canvas&gt;</pre>
- <pre class="brush: js">draw();</pre>
-</div>
-<p>{{EmbedLiveSample('A_More_Complicated_Example','215','215','/@api/deki/files/604/=Canvas_ex3.png')}}</p>
-<p>Esto define dos métodos, lazo y punto, que son llamados 4 veces.   Antes de cada llamada, los metodos translate() y rotate() son utilizados para la matriz de transformación actual, que a su vez posicionara el punto y el lazo.   el punto presenta un pequeño cuadrado negro centrado a (0,0).   Ese punto se mueve alrededor de la matriz de transformación.   El lazo presenta un simple ruta de lazo usando el estillo de llenado pasado.</p>
-<p>Como las operaciones de la matriz son acumulativas, save() y restore() son utilizados para cada conjunto de llamadas para restaurar el estado de canvas original.   Una cosa a tener en cuenta es que la rotación siempre se produce en torno al origen actual, por lo que a traducir () rotate () translate () secuencia producirá resultados diferentes a traducir () translate () serie de llamadas rotate ().</p>
-<h2 id="Compatibility_With_Apple_.3Ccanvas.3E" name="Compatibility_With_Apple_.3Ccanvas.3E">Compatibilidad con Apple &lt;canvas&gt;</h2>
-<p>En su mayor parte, &lt;canvas&gt; es compatible con Apple y otras implementaciones.   Hay, sin embargo, algunas cuestiones a tener en cuenta, que se describen aquí.</p>
-<h3 id="Required_.3C.2Fcanvas.3E_tag" name="Required_.3C.2Fcanvas.3E_tag">Etiqueta &lt;/canvas&gt; requerida </h3>
-<p>En la aplicación de Apple Safari, &lt;canvas&gt; es un elemento ejecutado de la misma manera &lt;img&gt; es, sino que no tiene una etiqueta de cierre.   Sin embargo, para &lt;canvas&gt; tener uso generalizado en la web, se debe proporcionar alguna facilidad para contenido de reserva.   Por lo tanto, la implementación de Mozilla tiene una etiqueta de cierre requerida.</p>
-<p>Si no se necesita contenido de reserva, un simple &lt;canvas id="foo" ...&gt; &lt;/ canvas&gt; será totalmente compatible con Safari y Mozilla - Safari simplemente ignorar la etiqueta de cierre.</p>
-<p>Si se desea contenido de reserva, algunos trucos CSS se deben emplear para enmascarar el contenido de reserva desde Safari (las cuales deben emitir sólo la tela), y también para enmascarar los propios trucos CSS de IE (que debería hacer que el contenido de reserva).</p>
-<pre>canvas {
-  font-size: 0.00001px !ie;
-}</pre>
-<h2 id="Additional_Features" name="Additional_Features">Caracteristicas adicionales  </h2>
-<h3 id="Rendering_Web_Content_Into_A_Canvas" name="Rendering_Web_Content_Into_A_Canvas">Renderizando el contenido we dentro de un Canvas.</h3>
-<div class="note">
- Esta caracteristica esta solo disponible para codigo ejecutado con privilegios de Chrome.   No esta permitido en paginas HTML normales. <a href="http://mxr.mozilla.org/mozilla/source/content/canvas/src/nsCanvasRenderingContext2D.cpp#2352" title="http://mxr.mozilla.org/mozilla/source/content/canvas/src/nsCanvasRenderingContext2D.cpp#2352">Porqué leer</a>.</div>
-<p>El canvas de Mozilla se extendio con el metodo drawWindow().   Este metodo dibuja una instantanea de los contenidos de una ventana DOM dentro del canvas. Por ejemplo:</p>
-<pre class="brush: js">ctx.drawWindow(window, 0, 0, 100, 200, "rgb(255,255,255)");
-</pre>
-<p>atraería el contenido de la ventana actual, en el rectángulo (0,0,100,200) en píxeles con respecto a la parte superior izquierda de la ventana, sobre un fondo blanco, en el lienzo.   Mediante la especificación de "rgba (255,255,255,0)" como el color, el contenido no se dibujan con un fondo transparente (lo que sería más lenta).</p>
-<p>Normalmente es una mala idea usar un fondo distinto de blanco "rgb(255, 255, 255)" o transparente, esto es lo que hacen todos los navegadores, y muchos sitios web esperan que esas partes transparentes de su interfaz serán puestas en fondo blanco.</p>
-<p>Con este metodo, es posible ocupar un IFRAME oculto con contenido arbitrario (por ejemplo, texto HTML con estilo CSS, o SVG) y dibujarlo dentro de un canvas.   sera escalado, rotado y sucesivamente de acuerdo a la transformación actual.</p>
-<p>Extensión de previsualización pestaña de Ted Mielczarek utiliza esta técnica en cromo para proporcionar imágenes en miniatura de las páginas web, y la fuente está disponible para su referencia.  </p>
-<div class="note">
- Nota: usar canvas.drawWindow() mientras manejamos un evento de carga de documento, no trabaja   En Firefox 3.5 o superior, puedes hacer esto en un manejador para el evento MozAfterPaint para dibujr satisfactoriamente un contenido HTML dentro de un canvas al cargar la pagina  </div>
-<h2 id="See_also" name="See_also">See also</h2>
-<ul>
- <li><a href="/en-US/docs/HTML/Canvas" title="HTML/Canvas">Canvas topic page</a></li>
- <li><a href="/en-US/docs/Canvas_tutorial" title="Canvas_tutorial">Canvas tutorial</a></li>
- <li><a href="http://www.whatwg.org/specs/web-apps/current-work/#the-canvas">WHATWG specification</a></li>
- <li><a href="http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/Canvas.html" title="http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/Canvas.html">Apple Canvas Documentation</a></li>
- <li><a href="http://weblogs.mozillazine.org/roc/archives/2005/05/rendering_web_p.html">Rendering Web Page Thumbnails</a></li>
- <li>Some <a href="/en-US/docs/tag/canvas_examples">examples</a>:
-  <ul>
-   <li><a href="http://azarask.in/projects/algorithm-ink">Algorithm Ink</a></li>
-   <li><a href="http://www.tapper-ware.net/canvas3d/">OBJ format 3D Renderer</a></li>
-   <li><a href="/en-US/docs/A_Basic_RayCaster" title="A_Basic_RayCaster">A Basic RayCaster</a></li>
-   <li><a href="http://awordlike.textdriven.com/">The Lightweight Visual Thesaurus</a></li>
-   <li><a href="http://caimansys.com/painter/">Canvas Painter</a></li>
-  </ul>
- </li>
- <li><a href="/en-US/docs/tag/canvas">And more...</a></li>
-</ul>
diff --git a/files/es/web/html/canvas/index.html b/files/es/web/html/canvas/index.html
deleted file mode 100644
index dfdde2bf63..0000000000
--- a/files/es/web/html/canvas/index.html
+++ /dev/null
@@ -1,170 +0,0 @@
----
-title: API Canvas
-slug: Web/HTML/Canvas
-tags:
-  - API
-  - Canvas
-  - JavaScript
-  - Referencia
-  - introducción
-translation_of: Web/API/Canvas_API
----
-<div>{{CanvasSidebar}}</div>
-
-<p class="summary">Añadido en <a href="/es/docs/HTML/HTML5">HTML5</a>, el <strong>elemento HTML {{HTMLElement("canvas")}}</strong> se puede usar para dibujar gráficos mediante scripting en <a href="/es/docs/Web/JavaScript">JavaScript</a>. Por ejemplo, se puede usar para hacer gráficas, composiciones fotográficas, crear animaciones, o incluso procesado o renderizado de vídeo en tiempo real.</p>
-
-<p>Las aplicaciones de Mozilla soportan <code>&lt;canvas&gt;</code> desde Gecko 1.8 (es decir, <a href="/es/docs/Mozilla/Firefox/Releases/1.5">Firefox 1.5</a>). El elemento fue inicialmenmte presentado por Apple para el Dashboard de OS X y Safari. Internet Explorer soporta <code>&lt;canvas&gt;</code> desde la versión 9 en adelante; para versiones anteriores de IE, se puede añadir soporte para <code>&lt;canvas&gt;</code> a una página incluyendo un script del proyecto de Google <a href="https://github.com/arv/explorercanvas">Explorer Canvas</a>. Google Chrome y Opera 9 también soportan <code>&lt;canvas&gt;</code>.</p>
-
-<p>El elemento <code>&lt;canvas&gt;</code> también se usa en <a href="/es/docs/Web/WebGL">WebGL</a> para dibujar gráficos 3D con aceleración por hardware en páginas web.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Esto es un trozo de código que usa el método {{domxref("CanvasRenderingContext2D.fillRect()")}}.</p>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
-</pre>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<pre class="brush: js">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext('2d');
-
-ctx.fillStyle = 'green';
-ctx.fillRect(10, 10, 100, 100);
-</pre>
-
-<p>Edita este código para ver tus cambios en tiempo real en este canvas:</p>
-
-<div class="hidden">
-<h6 id="Código_editable">Código editable</h6>
-
-<pre class="brush: html">&lt;canvas id="canvas" width="400" height="200" class="playable-canvas"&gt;&lt;/canvas&gt;
-&lt;div class="playable-buttons"&gt;
-  &lt;input id="edit" type="button" value="Edit" /&gt;
-  &lt;input id="reset" type="button" value="Reset" /&gt;
-&lt;/div&gt;
-&lt;textarea id="code" class="playable-code"&gt;
-ctx.fillStyle = 'green';
-ctx.fillRect(10, 10, 100, 100);&lt;/textarea&gt;
-</pre>
-
-<pre class="brush: js">var canvas = document.getElementById('canvas');
-var ctx = canvas.getContext("2d");
-var textarea = document.getElementById('code');
-var reset = document.getElementById('reset');
-var edit = document.getElementById('edit');
-var code = textarea.value;
-
-function drawCanvas() {
-  ctx.clearRect(0, 0, canvas.width, canvas.height);
-  eval(textarea.value);
-}
-
-reset.addEventListener('click', function() {
-  textarea.value = code;
-  drawCanvas();
-});
-
-edit.addEventListener('click', function() {
-  textarea.focus();
-})
-
-textarea.addEventListener('input', drawCanvas);
-window.addEventListener('load', drawCanvas);
-</pre>
-</div>
-
-<p>{{ EmbedLiveSample('Código_editable', 700, 360) }}</p>
-
-<h2 id="Referencia">Referencia</h2>
-
-<div class="index">
-<ul>
- <li>{{domxref("HTMLCanvasElement")}}</li>
- <li>{{domxref("CanvasRenderingContext2D")}}</li>
- <li>{{domxref("CanvasGradient")}}</li>
- <li>{{domxref("CanvasImageSource")}}</li>
- <li>{{domxref("CanvasPattern")}}</li>
- <li>{{domxref("ImageBitmap")}}</li>
- <li>{{domxref("ImageData")}}</li>
- <li>{{domxref("RenderingContext")}}</li>
- <li>{{domxref("TextMetrics")}}</li>
- <li>{{domxref("OffscreenCanvas")}}{{experimental_inline}}</li>
- <li>{{domxref("Path2D")}} {{experimental_inline}}{{domxref("ImageBitmapRenderingContext")}}{{experimental_inline}}</li>
-</ul>
-</div>
-
-<p>Las interfaces relacionadas con <code>WebGLRenderingContext</code> están en <a href="/es/docs/Web/WebGL" title="/en-US/docs/Web/WebGL">WebGL</a>.</p>
-
-<p>{{domxref("CanvasCaptureMediaStream")}} está relacionado..</p>
-
-<h2 id="Guías_y_tutoriales">Guías y tutoriales</h2>
-
-<dl>
- <dt><a href="/es/docs/Web/API/Canvas_API/Tutorial">Tutorial Canvas</a></dt>
- <dd>Tutorial exhaustivo que cubre tanto el uso básico de <code>&lt;canvas&gt;</code> como sus características avanzadas.</dd>
- <dt><a href="/es/Add-ons/Code_snippets/Canvas">Fragmentos de código: Canvas</a></dt>
- <dd>Algunos fragmentos de código orientados al desarrollador de extensiones usando <code>&lt;canvas&gt;</code>.</dd>
- <dt><a href="/es/docs/Web/API/Canvas_API/A_basic_ray-caster">Demo: Un laberinto básico</a></dt>
- <dd>Una demo de una animación de laberinto usando canvas.</dd>
- <dt><a href="/es/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas">Dibujar objetos DOM en un canvas</a></dt>
- <dd>Cómo dibujar contenido DOM, como elementos HTML, en un canvas.</dd>
- <dt><a href="/es/docs/Web/API/Canvas_API/Manipulating_video_using_canvas">Manipulación de vídeo usando canvas</a></dt>
- <dd>Combinando {{HTMLElement("video")}} y {{HTMLElement("canvas")}} para manipular datos de vídeo en tiempo real.</dd>
-</dl>
-
-<h2 id="Recursos">Recursos</h2>
-
-<h3 id="Genéricos">Genéricos</h3>
-
-<ul>
- <li><a href="http://joshondesign.com/p/books/canvasdeepdive/title.html">Profundizando en HTML5 Canvas</a></li>
- <li><a href="http://bucephalus.org/text/CanvasHandbook/CanvasHandbook.html">Manual de Canvas</a></li>
-</ul>
-
-<h3 id="Librerías">Librerías</h3>
-
-<ul>
- <li><a href="http://fabricjs.com">Fabric.js</a> es una librería open-source para canvas con capacidad de parsear SVG.</li>
- <li><a href="https://github.com/ericdrowell/KineticJS">Kinetic.js</a> es una librería open-source de canvas enfocada en la interactividad para aplicaciones móviles y de escritorio.</li>
- <li><a href="http://paperjs.org/">Paper.js</a> es un framework para gráficos vectoriales open source que funciona sobre Canvas HTML5.</li>
- <li><a href="http://origamijs.com/docs/">Origami.js</a> es una librería ligera open-source para canvas.</li>
- <li><a href="http://libcanvas.github.com/">libCanvas</a> es un framework ligero y potente para canvas.</li>
- <li><a href="http://processingjs.org">Processing.js</a> es un port de PVL (Processing visualization language).</li>
- <li><a href="https://playcanvas.com/">PlayCanvas</a> es un motor open source de juegos.</li>
- <li><a href="http://www.pixijs.com/">Pixi.js</a> es un motor open source de juegos.</li>
- <li><a href="http://www.liquidx.net/plotkit/">PlotKit</a> es una librería para hacer gráficas.</li>
- <li><a class="link-https" href="https://github.com/jeremyckahn/rekapi">Rekapi</a> es una API para animación por frames para Canvas.</li>
- <li><a href="http://senchalabs.github.com/philogl/">PhiloGL</a> es un framework WebGL para visualización de datos, programación creativa y desarrollo de juegos.</li>
- <li><a href="http://thejit.org/">JavaScript InfoVis Toolkit</a> crea visualizaciones de datos 2D interactivas para Web.</li>
- <li><a href="http://www.createjs.com/easeljs">EaselJS</a> es una librería open source/libre que facilita el uso de canvas para arte y juegos</li>
- <li><a href="http://scrawl.rikweb.org.uk/">Scrawl-canvas</a> es otra librería open-source javascript para crear y manipular elementos canvas en 2D</li>
- <li><a href="https://www.patrick-wied.at/static/heatmapjs/">heatmap.js</a> es una librería open-source para crear mapas (heatmaps)</li>
-</ul>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'scripting.html#the-canvas-element', '&lt;canvas&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/WebGL">WebGL</a></li>
-</ul>
diff --git a/files/es/web/html/consejos_para_la_creación_de_páginas_html_de_carga_rápida/index.html b/files/es/web/html/consejos_para_la_creación_de_páginas_html_de_carga_rápida/index.html
deleted file mode 100644
index b44128e05d..0000000000
--- a/files/es/web/html/consejos_para_la_creación_de_páginas_html_de_carga_rápida/index.html
+++ /dev/null
@@ -1,53 +0,0 @@
----
-title: Consejos para la creación de páginas HTML de carga rápida
-slug: Web/HTML/Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida
-tags:
-  - Consejos
-  - HTML
-  - Rapido
-  - Tips
-translation_of: Learn/HTML/Howto/Author_fast-loading_HTML_pages
----
-<h2 id="Consejos_para_la_creación_de_páginas_HTML_de_carga_rápida">Consejos para la creación de páginas HTML de carga rápida</h2>
-
-<p>Estos consejos estan basados en conocimiento común y experimentación.</p>
-
-<p>Una página web optimizada no solo provee una mayor respuesta a su sitio por parte de los visitantes, sino que también reduce la carga en su servidores web y en su conexión de internet. Esto puede ser crucial para sitios con alto volumen o sitios que tienen un pico de trafico debido a circunstancias inucuales como noticias de ultima hora.</p>
-
-<p>Optimizar la carga de páginas no es solo para el contenido que será visto atraves de una estrecha conexión telefónica o dispositivos móviles. <span id="result_box" lang="es"><span class="hps">Es</span> <span class="hps">tan importante</span> <span class="hps">para el contenido</span> <span class="hps">de banda ancha</span> <span class="hps">y puede conducir a</span> <span class="hps">mejoras espectaculares</span> <span class="hps">incluso</span> <span class="hps">para sus</span> <span class="hps">visitantes con</span> <span class="hps">las conexiones más rápidas</span><span>.</span></span></p>
-
-<h3 id="Consejos">Consejos</h3>
-
-<h4 id="Reducir_el_peso_de_las_páginas_web">Reducir el peso de las páginas web</h4>
-
-<p>El peso de las páginas web es por mucho el factor más importante en el rendimiento de carga de una página.</p>
-
-<p>Reducir el peso de la página mediante la eliminación de espacios en blanco innecesarios y comentarios, comunmente se coonoce como minimalización, y al mover "inline-script" y "CSS" a un archivo externo, puede mejorar el rendimiento de la descarga con minimas necesidades de otros cambios en la estructura de la página.</p>
-
-<p>Herramientas como <a class="external external-icon" href="http://tidy.sourceforge.net/">HTML Tidy</a> pueden <span id="result_box" lang="es"><span class="hps">quitar</span> <span class="hps">automáticamente</span> <span class="hps">espacios en blanco</span> <span class="hps">y las líneas</span> <span class="hps">en blanco adicionales</span> <span class="hps">de</span> <span class="hps">código fuente HTML valido</span><span class="hps">. Otras herramientas pueden "comprimir"</span></span> JavaScript al reformatear el codigo fuente o <span id="result_box" lang="es"><span class="hps">por</span> <span class="alt-edited hps">ofuscación</span> <span class="hps">la fuente</span> <span class="hps">y la sustitución de</span> <span class="hps">los identificadores largos con versiones mas cortas.</span></span></p>
-
-<h3 id="Minimizar_el_número_de_archivos">Minimizar el número de archivos</h3>
-
-<p>Reducir el número de archivos referentes en una pagina web baja el número de conexiones <a href="https://developer.mozilla.org/en-US/docs/HTTP" title="en-US/docs/HTTP">HTTP</a> requeridas para bajar la página.</p>
-
-<p>Dependiendo de la configuración de cache de un navegador, puede enviar una petición <span id="result_box" lang="es"><span class="hps">"If</span><span>-Modified-Since"</span></span> al servidor web para cada "CSS", JavaScript o archivo de imágen, preguntando si el archivo ha sido modificado desde la ultima vez que fué descargado.</p>
-
-<p>Al reducir el número de archivos que son refereciados dentro de una página web, <span id="result_box" lang="es"><span class="hps">se reduce el</span> <span class="hps">tiempo necesario para que</span> <span class="hps">estas solicitudes</span> <span class="hps">se envíen</span><span>,</span> <span class="hps">y</span> <span class="hps">para que  sus</span> <span class="hps">respuestas</span> <span class="hps">que se reciban</span><span>.</span></span></p>
-
-<p>Si se usan muchas imágenes de fondo en sus "CSS", puedes reducir la cantidad de busquedas HTTP necesarias al combinar las imagenes en una, conocido como "image sprite". Luego solamente <span id="result_box" lang="es"><span class="hps">se aplica la</span> <span class="hps">misma imagen</span> <span class="hps">cada</span> <span class="hps">vez que lo necesite</span> <span class="hps">para un fondo,</span> <span class="hps">ajustando las coordenadas el eje (X / Y</span></span>) adecuadamente. Estas técnica trabaja mejor con elementos que tendrán dimensiones limitadas, no funcionará para todos los usos de imagenes de fondo, sin embargo, la menor cantidad de pedidos HTTP y el uso de una única imágen en caché puede reducir el timepo de carga de una página.</p>
-
-<p>Demasiado tiempo gastado en consultar la ultima modificación de los archivos referenciados puede demorar la pantalla inicial de una página web, <span id="result_box" lang="es"><span class="hps">ya que el</span> <span class="hps">explorador debe</span> <span class="hps">comprobar</span> <span class="hps">la fecha de modificación</span> <span class="hps">de cada</span> <span class="hps">archivo</span> <span class="hps">CSS o</span> <span class="hps">JavaScript</span><span>, antes de pintar la página.</span></span></p>
-
-<h3 id="Reducir_la_busqueda_de_dominios">Reducir la busqueda de dominios</h3>
-
-<p>Debido a que cada dominio separado cuesta tiempo en una busqeuda DNS, el tiempo de carga de la página crecerá junto con el número de dominios <span id="result_box" lang="es"><span class="hps">que aparecen en</span> <span class="hps">enlace</span> <span class="hps">CSS</span> <span class="atn hps">(</span><span>s</span><span>)</span>, <span class="hps"> JavaScript</span> <span class="hps">y</span> <span class="hps">recursos de</span> <span class="hps">imagen.</span></span></p>
-
-<p>Esto no puede ser siempre práctico; sin embargo <span id="result_box" lang="es"><span class="hps">siempre se debe</span> <span class="hps">tener cuidado de usar</span> <span class="hps">sólo el número</span> <span class="hps">mínimo necesario</span> <span class="hps">de los diferentes dominios</span> <span class="hps">en</span> <span class="hps">sus páginas</span></span>.</p>
-
-<h3 id="Reutilización_de_contenido_de_cache">Reutilización de contenido de cache</h3>
-
-<p><span id="result_box" lang="es"><span class="hps">Asegúrese de que cualquier</span> <span class="hps">contenido que se pueden</span> <span class="hps">almacenar en caché</span><span>,</span> <span class="hps">se almacena en caché</span><span>,</span> <span class="hps">y</span> <span class="hps">con</span> <span class="hps">fechas de caducidad</span> <span class="hps">correspondientes.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">En particular</span><span>,</span> <span class="hps">prestar atención a la</span> <span class="hps">cabecera</span></span> "<code>Last-Modified</code>". Permite el eficiente almacenamiento en cache de la página; <span id="result_box" lang="es"><span class="hps">por medio de</span> <span class="hps">esta cabecera</span><span>, la información</span> <span class="hps">se transmite al</span> <span class="hps">agente de usuario</span> <span class="hps">sobre el archivo</span> <span class="hps">que quiere</span> <span class="hps">cargar</span><span>,</span> <span class="hps">por ejemplo, </span></span><span id="result_box" lang="es"><span class="hps">como cuando</span> <span class="hps">fue</span> <span class="hps">modificada por última vez</span><span>.</span> <span class="hps">La mayoría de los</span> <span class="hps">servidores web</span> <span class="hps">añadirá automáticamente</span> <span class="hps">la</span> <span class="hps">cabecera Last-Modified</span> <span class="hps">para</span> <span class="hps">páginas estáticas</span> <span class="hps">(por ejemplo</span> <span class="hps">.html</span><span>,</span> <span class="hps">.css</span><span>)</span><span>,</span></span> <span id="result_box" lang="es"><span class="hps">basado en</span> <span class="hps">la</span> <span class="hps">fecha de última modificación</span> <span class="hps">almacenada en</span> <span class="hps">el sistema de archivos</span><span>.</span> <span class="hps">Con</span> <span class="hps">páginas dinámicas</span> <span class="hps">(por ejemplo,</span> <span class="hps">.php</span><span>,</span> <span class="hps">.aspx</span><span>)</span><span>,</span> <span class="hps">esto, por supuesto</span><span>,</span> <span class="hps">no se puede hacer</span><span>, y</span> <span class="hps">la cabecera</span> <span class="hps">no se envía</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Así</span><span>,</span> <span class="hps">en particular</span> <span class="hps">para las páginas</span> <span class="hps">que se generan</span> <span class="hps">de forma dinámica</span><span>,</span> <span class="hps">un poco de investigación</span> <span class="hps">sobre este tema es</span> <span class="hps">beneficioso.</span> <span class="hps">Puede ser</span> <span class="hps">un poco</span> <span class="hps">complicada, pero</span> <span class="hps">se ahorrará mucho</span> <span class="hps">en</span> <span class="hps">las solicitudes de página</span> <span class="hps">en las páginas</span> <span class="hps">que</span> <span class="hps">normalmente no serían</span> <span class="hps">cacheable</span><span>.</span></span></p>
diff --git a/files/es/web/html/cors_enabled_image/index.html b/files/es/web/html/cors_enabled_image/index.html
new file mode 100644
index 0000000000..40d0d8c558
--- /dev/null
+++ b/files/es/web/html/cors_enabled_image/index.html
@@ -0,0 +1,116 @@
+---
+title: Imagen con CORS habilitado
+slug: Web/HTML/CORS_enabled_image
+tags:
+  - Avanzado
+  - CORS
+  - Canvas
+  - HTML
+  - Referencia
+  - Seguridad
+translation_of: Web/HTML/CORS_enabled_image
+original_slug: Web/HTML/Imagen_con_CORS_habilitado
+---
+<p><span class="seoSummary">La especificación HTML introduce un atributo {{ htmlattrxref("crossorigin", "img") }} para imágenes que, en conjunto con el encabezado  {{Glossary("CORS")}} apropiado, permite definir imágenes con el elemento {{ HTMLElement("img") }} que se carguen de orígenes externos dentro de un lienzo (<em>canvas</em>) como si estas fuesen cargadas del origen actual.</span></p>
+
+<p>Vea el artículo <a href="/en/HTML/CORS_settings_attributes" title="Atributos de configuración CORS">"Atributos de configuración CORS"</a> para mas detalles de como el atributo "crossorigin" es usado.</p>
+
+<h2 id="¿Qué_es_un_tainted_canvas">¿Qué es un "tainted" canvas? </h2>
+
+<p>Aunque puedes usar imágenes sin la aprobación del CORS en el elemento canvas, hacerlo puede "manchar" el canvas. Por ejemplo, no puedes usar los métodos canvas <code>toBlob()</code>, <code>toDataURL()</code>, or <code>getImageData(). Si los usas se lanzará un mensaje de seguridad.</code></p>
+
+<p>Esto protegerá a los usuarios de tener información privada usada por medio de imágenes que cogen información desde otras web sin permiso.</p>
+
+<h2 id="Ejemplo_Almacenando_una_imagen_desde_un_origen_externo">Ejemplo: Almacenando una imagen desde un origen externo</h2>
+
+<p>Debes de tener un servidor de hosting de imágenes con el apropiado <code>Access-Control-Allow-Origin</code> header. Añadiendo el atributo crossOrigin crea un request header.</p>
+
+<p>Puedes utilizar este fragemto de la configuración del servidor Apache del Boilerplate HTML5 para responder apropiadamente con este encabezado de respuesta.</p>
+
+<pre class="brush:xml">&lt;IfModule mod_setenvif.c&gt;
+    &lt;IfModule mod_headers.c&gt;
+        <span class="nt">&lt;FilesMatch</span> <span class="s">"\.(cur|gif|ico|jpe?g|png|svgz?|webp)$"</span><span class="nt">&gt;</span>
+            SetEnvIf Origin ":" IS_CORS
+            Header set Access-Control-Allow-Origin "*" env=IS_CORS
+        &lt;/FilesMatch&gt;
+    &lt;/IfModule&gt;
+&lt;/IfModule&gt;</pre>
+
+<p>Dado que está todo ordenado, serás capás de guardar esas imagenes en el almacenamiento del DOM, así como si fueran solicitados de tu dominio.</p>
+
+<pre class="brush: js">var img = new Image,
+    canvas = document.createElement("canvas"),
+    ctx = canvas.getContext("2d"),
+    src = "http://example.com/image"; // insert image url here
+
+img.crossOrigin = "Anonymous";
+
+img.onload = function() {
+    canvas.width = img.width;
+    canvas.height = img.height;
+    ctx.drawImage( img, 0, 0 );
+    localStorage.setItem( "savedImageData", canvas.toDataURL("image/png") );
+}
+img.src = src;
+// make sure the load event fires for cached images too
+if ( img.complete || img.complete === undefined ) {
+    img.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
+    img.src = src;
+}</pre>
+
+<h2 id="Compatibilidad_con_los_navegadores">Compatibilidad con los navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>13</td>
+   <td>8</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="También_puede_ver">También puede ver</h2>
+
+<ul>
+ <li><a class="external" href="http://blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html">Using Cross-domain images in WebGL and Chrome 13</a></li>
+ <li><a class="external" href="http://whatwg.org/html#attr-img-crossorigin">HTML Specification - the <code>crossorigin</code> attribute</a></li>
+</ul>
diff --git a/files/es/web/html/element/a/index.html b/files/es/web/html/element/a/index.html
new file mode 100644
index 0000000000..5485719264
--- /dev/null
+++ b/files/es/web/html/element/a/index.html
@@ -0,0 +1,322 @@
+---
+title: <a>
+slug: Web/HTML/Element/a
+tags:
+  - Contenido
+  - Ejemplo
+  - Elemento
+  - HTML
+  - Principiante
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/a
+original_slug: Web/HTML/Elemento/a
+---
+<div>{{HTMLRef}}</div>
+
+<p>El <em>Elemento HTML <code>Anchor</code></em> <strong><code>&lt;a&gt;</code></strong> crea un enlace a otras páginas de internet, archivos o ubicaciones dentro de la misma página, direcciones de correo, o cualquier otra URL.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/a.html")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row">Categorías de contenido</th>
+   <td>Contenido de flujo, contenido de párrafo, contenido interactivo, contenido palpable</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Transparent_content_model" title="HTML/Content_categories#Transparent_content_model">Transparente, que contiene contenido de flujo (excluyendo contenido interactivo) o contenido de párrafo.</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos principales permitidos</th>
+   <td>Cualquier elemento que acepte contenido de párrafo o cualquier elemento que acepte contenido de flujo, sin embargo simpre excluyendo los elementos &lt;a&gt; (de acuerdo con el principio lógico de simetría, si una etiqueta &lt;a&gt; como padre, no puede contener contenido interactivo, entonces el mismo contenido de &lt;a&gt; no puede tener una etiqueta &lt;a&gt; como su padre).</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>{{ARIARole("button")}}, {{ARIARole("checkbox")}}, {{ARIARole("menuitem")}}, {{ARIARole("menuitemcheckbox")}}, {{ARIARole("menuitemradio")}}, {{ARIARole("option")}}, {{ARIARole("radio")}}, {{ARIARole("switch")}}, {{ARIARole("tab")}}, {{ARIARole("treeitem")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLAnchorElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("download")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>Este atributo, indica descargar a los navegadores una URL en lugar de navegar hacia ella, por lo que el usuario será dirigido para salvarla como un archivo local.  Si el atributo tiene un valor, éste se utilizará como nombre de archivo por defecto en el mensaje Guardar que se abre cuando el usuario hace clic en el enlace (sin embargo, el usuario puede cambiar el nombre antes de guardar el archivo). No hay restricciones sobre los valores permitidos, aunque: / y: \ se convertirán en guiones bajos (<em>underscores</em>), lo que evitará sugerencias de ruta específicas.  Se debe tener en cuenta que la mayoría de los sistemas de archivos tienen limitaciones con respecto a los símbolos de puntuación admitidos en los nombres de archivo, por lo que los navegadores ajustarán los nombres de los archivos en consecuencia.
+ <div class="note"><strong>Notas:</strong>
+ <ul>
+  <li>Este atributo sólo funciona para las <a href="https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy">políticas de mismo origen (same-origin URLs)</a>.</li>
+  <li>Este atributo puede ser utilizado con <a href="https://developer.mozilla.org/en-US/docs/Web/API/URL.createObjectURL"><code>blob:</code> URLs</a> y <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs"><code>data:</code> URLs</a> para descargar contenido generado por JavaScript, tales como fotografías creadas por una aplicación web de edición de imágenes.</li>
+  <li>Si el encabezado (<em>header</em>) HTTP <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Disposition"><code>Content-Disposition:</code></a> proporciona un nombre de archivo diferente al de este atributo, el encabezado HTTP tiene prioridad sobre este atributo.</li>
+  <li>Si <code>Content-Disposition:</code> está ajustado a <code>inline</code>, Firefox prioriza <code>Content-Disposition</code>, como en el caso del nombre de archivo, mientras que Chrome prioriza el atributo <code>download</code>.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("href")}}</dt>
+ <dd>Contiene una URL o un fragmento de URL al cual apunta el enlace.</dd>
+ <dd>Un fragmento de URL es un nombre ("name") precedido por el símbolo de número (<code>#</code>), el cual especifíca una ubicación interna objetivo (un <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes#attr-id">ID</a> de un elemento HTML) dentro del actual documento. Las URLs no están restringidas sólo a documentos de internet basados en HTTP, sin embargo pueden utilizar cualquier protocolo soportado por el navegador. Por ejemplo, <a class="external external-icon" href="https://en.wikipedia.org/wiki/File_URI_scheme"><code>file:</code></a>, <code>ftp:</code>, and <code>mailto:</code> funcionan en la mayoría de los navegadores.</dd>
+ <dd>Este atributo puede ser omitido (a partir de HTML5) para crear un enlace de marcador de posición. Un enlace de marcador de posición se parece a un enlace tradicional, pero que no dirige a algún lugar.
+ <div class="note">
+ <p><strong>Nota:</strong> Puede ser utilizado <code>href="#top"</code> o un fragmento vacío <code>href="#"</code> para enlazar a la parte superior de la página actual. <a href="https://www.w3.org/TR/html5/single-page.html#scroll-to-fragid">Este comportamiento está especficado en HTML5</a>.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("hreflang")}}</dt>
+ <dd>Este atributo indica el lenguaje humano del recurso al que se enlaza. Este es únicamente informativo, sin ninguna funcionalidad incorporada. Los valores permitidos están determinados por <a class="external external-icon" href="https://www.ietf.org/rfc/bcp/bcp47.txt" title="Tags for Identifying Languages">BCP47</a>.</dd>
+ <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt>
+ <dd>Indica que <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referer">referencia (<em>referer</em>)</a> enviar cuado la URL es recuperada:
+ <ul>
+  <li><code>'no-referrer'</code> significa <code>Referer:</code> el encabezado no será enviado.</li>
+  <li><code>'no-referrer-when-downgrade'</code> significa sin <code>Referer:</code> el encabezado será enviado cuando se navega a un origen (<code>origin</code>) sin HTTPS. Este es un comportamiento por defecto.</li>
+  <li><code>'origin'</code> significa que el "referrer" estará en el <a href="https://developer.mozilla.org/en-US/docs/Glossary/Origin">origen</a> (<code>origin</code>) de la página, no incluye la información posterior al dominio.</li>
+  <li><code>'origin-when-cross-origin'</code> significa que la navegación a otros orígenes (<em>origins</em>) será limitada al esquema (<em>scheme</em>), el host y el puerto, mientras que la navegación en el mismo origen (origin) incuirá la trayectoria de referencia (<em>referrer's path</em>).</li>
+  <li><code>'unsafe-url'</code> significa que la referencia (<em>referrer</em>) incuirá el origen(<code>origin</code>) y la trayectoria (<em>path</em>), pero no el fragmento, contraseña o nombre de usuario. Esto es inseguro, ya que puede filtrar datos desde una URL segura hacia URLs inseguras.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("rel")}}</dt>
+ <dd>Especifica la relación del objeto de destino con el objeto de enlace. El valor es una lista separada por espacios de tipos de enlace<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types"> tipos de enlace (link types)</a>.</dd>
+ <dt>{{htmlattrdef("target")}}</dt>
+ <dd>Especifica en donde desplegar la URL enlazada. Es un nombre (<em>name of</em>), o palabra clave (<em>keyword for</em>), un contexto de navegación <em>(browsing context)</em>: una pestaña, ventana, o <code>&lt;iframe&gt;</code>. Las siguientes palabras clave (<em>keywords</em>) tienen significado especial:
+ <ul>
+  <li><code>_self</code>: Carga la URL en el mismo contexto de navegación que el actual. Este es el comportamiento por defecto.</li>
+  <li><code>_blank</code>: Carga la URL en un nuevo contexto de navegación. Usualmente es una pestaña, sin embargo, los usuarios pueden configurar los navegadores para utilizar una ventana nueva en lugar de la pestaña.</li>
+  <li><code>_parent</code>: Carga la URL en el contexto de navegación padre (<em>parent</em>) del actual. Si no existe el padre, este se comporta del mismo modo que <code>_self</code>.</li>
+  <li><code>_top</code>: Carga la URL en le contexto más alto de navegación (el cual es un ancestro del actual, y no tiene padre (<em>parent</em>)). Si no hay padre (<em>parent</em>), este se comporta del mismo modo que <code>_self</code>.</li>
+ </ul>
+
+ <div class="note">
+ <p><strong>Nota:</strong> Cuando se utiliza <code>target</code>, considera agregar <code>rel="noopener noreferrer"</code> para evitar el uso de la API <code>window.opener</code>.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("type")}}</dt>
+ <dd>Especifica el tipo de medio (<em>media type</em>) en la forma de {{Glossary("MIME type")}} para la URL enlazada. Esto es únicamente informativo, sin ninguna funcionalidad incorporada.</dd>
+ <dt>
+ <h3 id="Obsoleto">Obsoleto</h3>
+ </dt>
+ <dt>{{htmlattrdef("charset")}} {{obsoleteGeneric("inline","HTML5")}}</dt>
+ <dd>Este atributo define la <a href="https://developer.mozilla.org/en-US/docs/Glossary/character_encoding">codificación de caracteres (character encoding)</a> de la URL enlazada. El valor debe de ser una lista delimitada por espacio y/o coma de caracteres definidos en <a class="external external-icon" href="https://tools.ietf.org/html/rfc2045">RFC 2045</a>. El valor por defecto es <code>ISO-8859-1</code>.
+ <div class="note">
+ <p><strong>Nota de uso:</strong> Este atributo es obsoleto en HTML5 y <strong>no debe ser utilizado por autores</strong>. Para lograr su efecto, se debe utilzar el encabezado HTTP <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Type"><code>Content-Type:</code></a> en la URL enlazada.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("coords")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
+ <dd>Para utilizar con el siguiente atributo <code>shape</code>, este atributo utiliza una lista de números separada por comas para definir las coordenadas del enlace en la página.</dd>
+ <dt>{{htmlattrdef("name")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
+ <dd>Este atributo era requerido para anclas (<em>anchors</em>) que definían una posible ubicación dentro de la página. En HTML 4.01, <code>id</code> y <code>name</code> podían ser utilizados simultáneamente en un elemento <code>&lt;a&gt;</code> simpre y cuando tuvieran valores idénticos.
+ <div class="note">
+ <p><strong>Nota de uso:</strong> Este atributo es obsoleto en HTML5, se utiliza el <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes#attr-id">atributo global <code>id</code></a> en su lugar.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("rev")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
+ <dd>Este atributo especifica un enlace inverso, la relación inversa del atributo <strong>rel</strong>. Fue desechado por ser muy confuso.</dd>
+ <dt>{{htmlattrdef("shape")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
+ <dd>Este atributo era utilizado para definir una región de enlaces para crear un mapa de imagen. El valore es <code>circle</code>, <code>default</code>, <code>polygon</code>, y <code>rect</code>. El formato del atributo <code>coords</code> depende del valor de la forma geométrica. Para <code>circle</code>, el valor es <code>x,y,r</code> donde <code>x</code> y <code>y</code> son las coordenadas en pixel para el centro del círculo y  <code>r</code> es el valor del radio en pixeles. Para <code>rect</code>, el atributo <code>coords</code> debe ser <code>x,y,w,h</code>. Los valores <code>x y y</code> definen la esquina superior izquierda del rectángulo, mientras que <code>w</code> y <code>h</code> definen el ancho y el alto respectivamente. Un valor del <code>polygon</code> para <code>shape</code> requiere los valores <code>x1,y1,x2,y2,...</code>para <code>coords</code>. Cada uno de los pares <code>x,y</code> definen un punto en el polígono, con puntos sucesivos que son unidos por líneas rectas y el útlimo punto se une al primer punto. El valor <code>default</code> para <code>shape</code> Requiere que el área encerrada, típicamente una imágen, sea utilizada.
+ <div class="note"><strong>Nota:</strong> Utilice el <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-usemap">atributo <code>usemap</code></a> para el elemento {{HTMLElement("img")}} y el elemento asociado {{HTMLElement("map")}} para definir puntos de acceso (<em>hotspots</em>) en lugar del atributo <code>shape</code>.</div>
+ </dd>
+</dl>
+
+<div>
+<h2 id="sect1"></h2>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Enlazando_a_una_ubicación_externa">Enlazando a una ubicación externa</h3>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;!-- anclaje a un archivo externo --&gt;
+&lt;a href="https://www.mozilla.com/"&gt;
+Enlace externo
+&lt;/a&gt;</code></pre>
+
+<h4 id="Resultado">Resultado</h4>
+
+<p><a class="external external-icon" href="https://www.mozilla.com/">Enlace externo</a></p>
+
+<h3 id="Enlazando_a_otra_sección_de_la_misma_página">Enlazando a otra sección de la misma página</h3>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;!-- enlace a un elemento en esta página con id="attr-href" --&gt;
+&lt;a href="#attr-href"&gt;
+Descripción de enlaces de la misma página
+&lt;/a&gt;</code></pre>
+
+<h4 id="Resultado_2">Resultado</h4>
+
+<p><a href="#attr-href">Descripción de enlaces de la misma página</a></p>
+
+<h3 id="Creando_una_imagen_clicable">Creando una imagen clicable</h3>
+
+<p>Este ejemplo utiliza una imagen que enlaza a la página de inicio de MDN. La página de inicio se abrirá en un contexto de navegación nuevo, esto es, en una nueva página o nueva ventana.</p>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;a href="https://developer.mozilla.org/en-US/" target="_blank"&gt;
+  &lt;img src="https://mdn.mozillademos.org/files/6851/mdn_logo.png"
+       alt="MDN logo" /&gt;
+&lt;/a&gt;</code></pre>
+
+<h4 id="Resulta">Resulta</h4>
+
+<figure>
+<p>{{EmbedLiveSample("Creating_a_clickable_image", "320", "64")}}</p>
+</figure>
+
+<h3 id="Creando_un_enlace_de_correo">Creando un enlace de correo</h3>
+
+<p>Es común crear enlaces que abren el programa de correo del usuario para permitir enviar un nuevo mensaje. Esto se hace con un enlace <code>mailto:</code>. Aquí tenemos un ejemplo:</p>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;a href="mailto:nowhere@mozilla.org"&gt;Enviar correo a nowhere&lt;/a&gt;</code></pre>
+
+<h4 id="Resultado_3">Resultado</h4>
+
+<p><a href="mailto:nowhere@mozilla.org">Envia un correo a: nowhere</a></p>
+
+<p>Para detalles adicionales acerca del esquema de la URL <code>mailto</code>, tales como incluir el asunto, el cuerpo u otros contenidos predeterminados, consultar <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Email_links">Enlaces de correo (Email links)</a> o {{RFC(6068)}}.</p>
+
+<h3 id="Creando_un_enlace_a_un_número_de_teléfono">Creando un enlace a un número de teléfono</h3>
+
+<p>Ofrecer enlaces a números de teléfono es muy útil para los ususarios que observan documentos de internet desde computadoras portátiles conectadas a teléfonos o desde teléfonos celulares (móviles)</p>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;a href="tel:+491570156"&gt;+49 157 0156&lt;/a&gt;</code></pre>
+
+<p>Para detalles adicionales acerca del esquema de la URL <code>tel</code>, consultar {{RFC(2806)}} y {{RFC(2396)}}.</p>
+
+<h3 id="Utilizando_el_atributo_download_para_guardar_un_&lt;canvas>_como_PNG">Utilizando el atributo <code>download</code> para guardar un  <code>&lt;canvas&gt;</code> como PNG</h3>
+
+<p>Si deseas permitir a los usurios descargar una elemento HTML {{HTMLElement("canvas")}} como una imagen, puedes crear un enlace con una atributo <code>download</code> y la información canvas como un archivo URL:</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">var link = document.createElement('a');
+link.innerHTML = 'download image';
+
+link.addEventListener('click', function(ev) {
+    link.href = canvas.toDataURL();
+    link.download = "mypainting.png";
+}, false);
+
+document.body.appendChild(link);</code></pre>
+
+<p>Puedes ver como funciona en: <a href="https://jsfiddle.net/codepo8/V6ufG/2/">jsfiddle.net/codepo8/V6ufG/2/</a>.</p>
+
+<h2 id="Notas">Notas</h2>
+
+<p>HTML 3.2 define sólo los atributos <code>name</code>, <code>href</code>, <code>rel</code>, <code>rev</code>, y <code>title</code>.</p>
+
+<h3 id="Recomendaciones_de_accesibilidad">Recomendaciones de accesibilidad</h3>
+
+<p>Se abusa frecuntemente de las etiquetas de ancla (<em>anchor tags</em>) con el uso de los eventos <code>onclick</code> para crear pseudo-botones ajustando <strong>href</strong> a <code>"#"</code> o <code>"javascript:void(0)"</code> para prevenir la recarga de la página. Estos valores provocan comportamientos inesperados con los enlaces de copiado/dibujado, la apertura de enlaces en nuevas pestañas/ventanas, el guardado de enlaces (<em>bookmarking</em>), y cuando JavaScript está aún descargando, esto arroja errores, o es deshabilitado. Esto tambíen lleva a semánticas (<em>semantics</em>) incorrectas para tecnologías de asistencia (p.ej., lectores de pantalla). En estos casos, se recomienda utilizar un {{HTMLElement("button")}} en su lugar. En general, sólo se debe utilizar una ancla (<em>anchor</em>) para navegación utilizando una URL adecuada.</p>
+
+<h3 id="Cliceo_y_enfoque">Cliceo y enfoque</h3>
+
+<p>Cuando se clicea sobre un {{HTMLElement("a")}} las consecuencias varían de acuerdo al navegador y el sistema operativo.</p>
+
+<table>
+ <caption>¿Al hacer clic en un {{HTMLElement("a")}} se enfoca?</caption>
+ <tbody>
+  <tr>
+   <td>Navegadores de escritorio</td>
+   <th>Windows 8.1</th>
+   <th>OS X 10.9</th>
+  </tr>
+  <tr>
+   <th>Firefox 30.0</th>
+   <td style="background-color: LawnGreen;">Si</td>
+   <td style="background-color: LawnGreen;">Si</td>
+  </tr>
+  <tr>
+   <th>Chrome ≥39<br>
+    (<a href="https://code.google.com/p/chromium/issues/detail?id=388666" title="Issue 388666: Focus anchor (A) elements on mousedown">Chromium bug 388666</a>)</th>
+   <td style="background-color: LawnGreen;">Si</td>
+   <td style="background-color: LawnGreen;">Si</td>
+  </tr>
+  <tr>
+   <th>Safari 7.0.5</th>
+   <td style="background-color: silver;">N/A</td>
+   <td style="background-color: yellow;">Sólo cuando tiene un <code>tabindex</code></td>
+  </tr>
+  <tr>
+   <th>Internet Explorer 11</th>
+   <td style="background-color: LawnGreen;">Si</td>
+   <td style="background-color: silver;">N/A</td>
+  </tr>
+  <tr>
+   <th>Presto (Opera 12)</th>
+   <td style="background-color: LawnGreen;">Si</td>
+   <td style="background-color: LawnGreen;">Si</td>
+  </tr>
+ </tbody>
+</table>
+
+<table>
+ <caption>¿Al hacer un clic en un {{HTMLElement("a")}} se enfoca?</caption>
+ <tbody>
+  <tr>
+   <td>Navegadores móviles</td>
+   <th>iOS 7.1.2</th>
+   <th>Android 4.4.4</th>
+  </tr>
+  <tr>
+   <th>Safari Mobile</th>
+   <td style="background-color: yellow;">Sólo cuando tiene un <code>tabindex</code></td>
+   <td style="background-color: silver;">N/A</td>
+  </tr>
+  <tr>
+   <th>Chrome 35</th>
+   <td>???</td>
+   <td style="background-color: yellow;">Sólo cuando tiene un <code>tabindex</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+  <tbody>
+  <tr>
+   <td>{{SpecName("Referrer Policy", "#referrer-policy-delivery-referrer-attribute", "referrer attribute")}}</td>
+   <td>{{Spec2("Referrer Policy")}}</td>
+   <td>Added the <code>referrerpolicy</code> attribute.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "textlevel-semantics.html#the-a-element", "&lt;a&gt;")}}</td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "textlevel-semantics.html#the-a-element", "&lt;a&gt;")}}</td>
+   <td>{{Spec2("HTML5 W3C")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML4.01", "struct/links.html#h-12.2", "&lt;a&gt;")}}</td>
+   <td>{{Spec2("HTML4.01")}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.a")}}</p>
+
+<h2 id="Consultar_también">Consultar también</h2>
+
+<ul>
+ <li>Otros elementos comunicando a nivel semántico de texto <a href="https://developer.mozilla.org/en-US/docs/HTML/Text_level_semantics_conveying_elements">(text-level semantics)</a>: {{HTMLElement("abbr")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.</li>
+</ul></div>
diff --git a/files/es/web/html/element/abbr/index.html b/files/es/web/html/element/abbr/index.html
new file mode 100644
index 0000000000..492014d6f5
--- /dev/null
+++ b/files/es/web/html/element/abbr/index.html
@@ -0,0 +1,148 @@
+---
+title: <abbr>
+slug: Web/HTML/Element/abbr
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/abbr
+original_slug: Web/HTML/Elemento/abbr
+---
+<p id="Summary">{{HTMLRef}}</p>
+
+<p>El <strong>elemento HTML <code>&lt;abbr&gt;</code></strong> (<em>o Elemento de Abreviación HTML</em>) representa una abreviación o acrónimo; el atributo opcional {{htmlattrxref("title")}} puede ampliar o describir la abreviatura. Si está presente, el atributo <code>title</code> debe contener la descripción completa y nada más.</p>
+
+<pre class="brush: html">&lt;p&gt;I do &lt;abbr title="Hypertext Markup Language"&gt;HTML&lt;/abbr&gt;&lt;/p&gt;</pre>
+
+<p style="margin-top: -1.5em;"><small>El artículo <a href="/en-US/Learn/HTML/Howto/Mark_abbreviations_and_make_them_understandable">Cómo marcar abreviaciones y hacerlas entendibles</a> es una guía para aprender a usar <code>&lt;abbr&gt;</code> y elementos relacionados.</small></p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_estático_o_de_texto">contenido estático o de texto</a>, contenido palpable</td>
+  </tr>
+  <tr>
+   <th scope="row">Conteido permitido</th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_estático_o_de_texto">Contenido de estático o de texto</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_estático_o_de_texto">contenido estático o de texto</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento sólo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>. El atributo {{htmlattrxref("title")}} tiene un sentido específicamente semántico cuando es usado con el elemento <code>&lt;abbr&gt;</code>; <em>debe </em>contener una completa descripción o ampliación de la abreviación. Este texto es usualmente presentado por los navegadores como tooltip cuando se pasa el mouse sobre el elemento.</p>
+
+<p>Cada elemento <code>&lt;abbr&gt;</code> usado es independiente de todos los otros; dar un <code>&lt;title&gt;</code> a uno no hace que automáticamente todos los demás adquieran la misma descripción.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>En lenguajes con números gramaticales (especialmente lenguajes con más de dos números, como el Árabe), utiliza el mismo número gramatical en el atributo <code>title</code> como dentro del elemento <code>&lt;abbr&gt;</code>.</p>
+</div>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('HTML WHATWG', 'text-level-semantics.html#the-abbr-element', '&lt;abbr&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-abbr-element', '&lt;abbr&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/text.html#edef-ABBR', '&lt;abbr&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>2.0</td>
+   <td>{{CompatGeckoDesktop(1.0)}} [1]</td>
+   <td>7.0</td>
+   <td>1.3</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Hasta Gecko 1.9.2 (Firefox 3.6), Firefox implementó la interfaz {{domxref("HTMLSpanElement")}} para este elemento en lugar de la interfaz {{domxref("HTMLElement")}}.</p>
+
+<h2 id="Estilo_por_defecto">Estilo por defecto</h2>
+
+<p>El propósito de este elemento es puramente para la conveniencia del autor y por defecto todos los navegadores lo muestran en línea ({{cssxref('display')}}<code>: inline</code>), sin embargo su estilo por defecto varía de un navegador a otro:</p>
+
+<ul>
+ <li>Algunos navegadores, como Internet Exlorer, no lo diseñan de manera diferente que el elemento {{HTMLElement("span")}}.</li>
+ <li>Opera, Firefox, y algunos otros añaden un subrayado de puntos al contenido del elemento.</li>
+ <li>Algunos navegadores no sólo añaden un subrayado de puntos, sino que también lo ponen en minúsculas; para evitar este estilo, añadir algo como {{cssxref('font-variant')}}<code>: none</code> en CSS se hace cargo de este caso.</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/Learn/HTML/Howto/Mark_abbreviations_and_make_them_understandable">Utilizando el elemento &lt;abbr&gt;</a></li>
+ <li>Otros elementos de nivel semántico de texto: {{HTMLElement("a")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.</li>
+</ul>
+
+<div> </div>
diff --git a/files/es/web/html/element/acronym/index.html b/files/es/web/html/element/acronym/index.html
new file mode 100644
index 0000000000..6fbfefbb6e
--- /dev/null
+++ b/files/es/web/html/element/acronym/index.html
@@ -0,0 +1,161 @@
+---
+title: acronym
+slug: Web/HTML/Element/acronym
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/acronym
+original_slug: Web/HTML/Elemento/acronym
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>acromym</strong> de acromyn=acrónimo</p>
+
+<p>Es el encargado para marcar estas formas abreviadas (modem, AJAX...). Además, gracias al atributo <code style="color: green;">title</code> podemos indicar la versión extendida del término.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;abbr&gt; y &lt;/abbr&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<pre class="eval"><span class="nowiki">
+ &lt;p&gt;
+ El acrónimo de moda es:
+ &lt;acronym lang="en" title="Asynchronous JavaScript and XML"&gt;Ajax&lt;/acronym&gt;.
+ &lt;/p&gt;
+ </span>
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<p>En Firefox se resalta con un "subrayado" punteado fino. vea el ejemplo:</p>
+
+<pre class="eval"><span class="nowiki">
+ &lt;p&gt;
+ el &lt;abbr lang="en" title="Mocilla developer center"&gt;MDC&lt;/abbr&gt; toma el
+ &lt;span style='border-bottom: dotted thin;'
+ title='esto no es ni una abreviatura ni un acrónimo'&gt;relevo&lt;/span&gt; de lo que fue el
+ &lt;acronym lang="en" title="DEVeloper.Mozilla.Org"&gt;Devmo&lt;/acronym&gt;.
+ &lt;/p&gt;
+ </span>
+</pre>
+
+<p>Cabe destacar que <a href="es/HTML/Elemento/abbr">abbr</a> y <a href="es/HTML/Elemento/acronym">acronym</a> comparten estilo predeterminado.</p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-acronym">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<p>El tema de las abreviaturas y acrónimos puede ser un tanto lioso. En castellano a veces cuesta saber si tal 'palabra' es una <a class="external" href="http://es.wikipedia.org/wiki/Abreviatura">abreviatura</a>, un <a class="external" href="http://es.wikipedia.org/wiki/Acr%C3%B3nimo">acrónimo</a> una sigla o un símbolo. Para complicarlo un poco más, resulta que el estándar html está en inglés y parece ser que las gramáticas castellana e inglesa no definen exactamente igual conceptos como <a href="es/HTML/Elemento/abbr">abreviatura</a> o <a href="es/HTML/Elemento/acronym">acrónimo</a>.</p>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <strong>acronym</strong> en el estándar <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-ACRONYM">HTML 4.01</a></li>
+</ul>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/address/index.html b/files/es/web/html/element/address/index.html
new file mode 100644
index 0000000000..eea73e5c79
--- /dev/null
+++ b/files/es/web/html/element/address/index.html
@@ -0,0 +1,164 @@
+---
+title: <address>
+slug: Web/HTML/Element/address
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/address
+original_slug: Web/HTML/Elemento/address
+---
+<p id="Summary">{{HTMLRef}}</p>
+
+<p>El <strong>elemento HTML <code>&lt;address&gt;</code></strong> aporta información de contacto para su {{HTMLElement("article")}} más cercano o ancestro {{HTMLElement("body")}}; en el último caso lo aplica a todo el documento.</p>
+
+<div class="note">
+<p><strong>Notas de uso:</strong></p>
+
+<ul>
+ <li>Para representar una dirección arbitraria, una que no esté relacionada con la información de contacto, utiliza un elemento {{HTMLElement("p")}} en lugar del elemento <code>&lt;address&gt;</code>.</li>
+ <li>Este elemento no debe contener más información que la información de contacto, como una fecha de publicación (que pertenece al elemento {{HTMLElement("time")}}).</li>
+ <li>Normalmente un elemento <code>&lt;address&gt;</code> puede ser colocado dentro del elemento {{HTMLElement("footer")}} de la sección actual, si lo hay.</li>
+</ul>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, contenido palpable</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>
+    <p><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, pero no con elementos <code>&lt;address&gt;</code> anidados, no contenidos de cabecera ({{HTMLElement("hgroup")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}), no contenido de sección ({{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}}), y no elemento {{HTMLElement("header")}} o {{HTMLElement("footer")}}.</p>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Etiqueta de omisión</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido dinámico</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>
+    <p>{{domxref("HTMLElement")}} antes de Gecko 2.0 (Firefox 4), Gecko implementó este elemento usando la interfaz {{domxref("HTMLSpanElement")}}.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento solo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<h2 id="Example">Example</h2>
+
+<pre class="brush: html">  &lt;address&gt;
+    You can contact author at &lt;a href="http://www.somedomain.com/contact"&gt;www.somedomain.com&lt;/a&gt;.&lt;br&gt;
+    If you see any bugs, please &lt;a href="mailto:webmaster@somedomain.com"&gt;contact webmaster&lt;/a&gt;.&lt;br&gt;
+    You may also want to visit us:&lt;br&gt;
+    Mozilla Foundation&lt;br&gt;
+    1981 Landings Drive&lt;br&gt;
+    Building K&lt;br&gt;
+    Mountain View, CA 94043-0801&lt;br&gt;
+    USA
+  &lt;/address&gt;
+</pre>
+
+<p>Above HTML will output:</p>
+
+<p><img alt="Image:HTML-address.png" src="/@api/deki/files/238/=HTML-address.png"></p>
+
+<p>Aunque el elemento de dirección representa el texto con el mismo estilo predeterminado de los elementos {{HTMLElement("i")}} o {{HTMLElement("em")}}, es más apropiado utilizarlo cuando se trata información de contacto, ya que transmite la información semántica adicional.</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'sections.html#the-address-element', '&lt;address&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'sections.html#the-address-element', '&lt;address&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.5.6', '&lt;address&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>1.0</td>
+   <td>5.12</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mini</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.7")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Otras elementos de sección relacionados: {{HTMLElement("body")}}, {{HTMLElement("nav")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("footer")}}, {{HTMLElement("section")}}, {{HTMLElement("header")}};</li>
+ <li class="last"><a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document">Secciones y línea generales de un documento HTML5</a>.</li>
+</ul>
diff --git a/files/es/web/html/element/applet/index.html b/files/es/web/html/element/applet/index.html
new file mode 100644
index 0000000000..348a122a8a
--- /dev/null
+++ b/files/es/web/html/element/applet/index.html
@@ -0,0 +1,237 @@
+---
+title: applet
+slug: Web/HTML/Element/applet
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/applet
+original_slug: Web/HTML/Elemento/applet
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Permite añadir un applet Java en un documento HTML. Es un elemento <a href="es/HTML/Elemento/Tipos_de_elementos#Desaprobado">Desaprobado</a> En su lugar debe usarse el elemento <a href="es/HTML/Elemento/object">object</a>, su uso solo es válido declarando el dtd transicional.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;applet&gt; y &lt;/applet&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#Especiales">Elemento especial</a>. <a href="es/HTML/Elemento/Tipos_de_elementos#Desaprobado">Desaprobado</a></dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong> cero o más elementos param o del tipo 'en flujo'.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title </code></td>
+   <td>Texto</td>
+   <td>Implícito</td>
+   <td>Título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style </code></td>
+   <td>Reglas de estilo CSS</td>
+   <td>Implícito</td>
+   <td>Información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id </code></td>
+   <td>Un 'nombre'</td>
+   <td>Implícito</td>
+   <td>Identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class </code></td>
+   <td>Lista de clases CSS</td>
+   <td>implícito</td>
+   <td>Identificador a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir </code></td>
+   <td>Uno de los siguientes: "ltr" o "rtl"</td>
+   <td>Implícito</td>
+   <td>Dirección del texto.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang </code></td>
+   <td>Código de idioma</td>
+   <td>Implícito</td>
+   <td>Información sobre el idioma.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">declare </code></td>
+   <td>(declare)</td>
+   <td>Implícito</td>
+   <td>Información sobre el idioma.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">classid </code></td>
+   <td>Una dirección</td>
+   <td>Implícito</td>
+   <td>Identifica una implementación.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">codebase </code></td>
+   <td>Una dirección</td>
+   <td>Implícito</td>
+   <td>URI base para classid, datos, archivo.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">data </code></td>
+   <td>Una dirección</td>
+   <td>Implícito</td>
+   <td>Referencia a los datos del objeto.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">type </code></td>
+   <td>Tipo MIME</td>
+   <td>Implícito</td>
+   <td>Tipo de contenido de los datos.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">codetype </code></td>
+   <td>Tipo MIME</td>
+   <td>Implícito</td>
+   <td>Tipo de contenido del código.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">archive </code></td>
+   <td>Direcciones</td>
+   <td>Implícito</td>
+   <td>Lista de URIs separados por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">standby </code></td>
+   <td>Texto</td>
+   <td>Implícito</td>
+   <td>Mensaje a mostrar durente la carga.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">height </code></td>
+   <td>Tamaño</td>
+   <td>Implícito</td>
+   <td>Especificar nueva altura.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">width </code></td>
+   <td>Tamaño</td>
+   <td>Implícito</td>
+   <td>Especificar nueva anchura.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">usemap </code></td>
+   <td>Una dirección</td>
+   <td>Implícito</td>
+   <td>Usar mapa de imágenes en el cliente.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">name </code></td>
+   <td>CDATA</td>
+   <td>Implícito</td>
+   <td>Enviar como parte de un formulario.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">tabindex </code></td>
+   <td>Número</td>
+   <td>Implícito</td>
+   <td>Posición en el orden de tabulación.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">align </code></td>
+   <td>Uno de los siguientes: "top", "middle", "bottom", "left", "right".</td>
+   <td>Implícito</td>
+   <td>Alineación vertical u horizontal.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">border </code></td>
+   <td>Píxeles</td>
+   <td>Implícito</td>
+   <td>Grosor del borde del vínculo.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">hspace </code></td>
+   <td>Píxeles</td>
+   <td>Implícito</td>
+   <td>espacio horizontal.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">vspace </code></td>
+   <td>Píxeles</td>
+   <td>Implícito</td>
+   <td>Espacio vertical.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;"> %reserved; </code></td>
+   <td> </td>
+   <td> </td>
+   <td>Reservado para posibles usos futuros.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval"><span class="nowiki"> Ejemplo con applet:
+
+   &lt;applet code="loquesea.class"
+            width="500" height="500"&gt;
+       &lt;!-- Aquí los contenidos alternativos por si falla el applet. --&gt;
+  &lt;/applet&gt;
+
+  Lo mismo pero usando el elemento object:
+
+  &lt;object  codetype="application/java"
+            classid="java:loquesea.class"
+            width="500" height="500"&gt;
+     &lt;!-- Aquí los contenidos alternativos por si falla el applet. --&gt;
+  &lt;/object&gt;</span>
+</pre>
+
+<p> </p>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p><span class="comment">El contenido de applet actúa como información alternativa para agentes de usuario que no soporten este elemento o que estén configurados para no soportar applets. En cualquier otro caso los agentes de usuario deben ignorar el contenido.</span></p>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#edef-APPLET"><strong>applet</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p><span class="comment">secciones futuras: == Soporte de los navegadores == == Valores por defecto y visualización en Firefox ==</span></p>
diff --git a/files/es/web/html/element/area/index.html b/files/es/web/html/element/area/index.html
new file mode 100644
index 0000000000..0fc6d3dac1
--- /dev/null
+++ b/files/es/web/html/element/area/index.html
@@ -0,0 +1,213 @@
+---
+title: area
+slug: Web/HTML/Element/area
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/area
+original_slug: Web/HTML/Elemento/area
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>area</strong> de area=área</p>
+
+<p>Sirve para crear las distintas secciones en las que se puede dividir un <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#include-maps">mapas de imágenes</a> en el cliente.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;area&gt; (solo tiene una).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: No.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Es un</strong>: Elemento para mapas de imágenes.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Nada.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Solo puede ser hijo de</strong>: Elementos <a href="es/HTML/Elemento/map">map</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-shape"><span style="color: green;">shape </span></a></td>
+   <td>Indica la forma del área del mapa.</td>
+   <td>Uno de los siguientes: <code>'rect'</code>, <code>'circle'</code>, <code>'poly'</code>, o <code>'default'</code>.</td>
+   <td><abbr title="Por defecto">PD.</abbr>: <code>'rect'</code></td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-coords"><span style="color: green;">coords </span></a></td>
+   <td>Indica las coordenadas (x,y) del área del mapa.</td>
+   <td>Lista de: cantidades de píxeles, o porcentajes de espacio disponible. Separadas por comas.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/links.html#adef-href"><span style="color: green;">href </span></a></td>
+   <td>La dirección del recurso vínculado.</td>
+   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> (o no).</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-nohref"><span style="color: green;">nohref </span></a></td>
+   <td>Indica que el área no es activa, no tiene enlace.</td>
+   <td>Uno: 'nohref'</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-alt"><span style="color: green;">alt </span></a></td>
+   <td>Describe el área o su vínculo, es necesario por que <strong>area</strong> no tiene contenido.</td>
+   <td>Texto legible. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td><abbr title="El autor debe indicarlo">Requerido</abbr></td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-accesskey"><span style="color: green;">accesskey </span></a></td>
+   <td>Define una tecla de acceso rápido. Importante para la <a href="es/Accesibilidad">Accesibilidad</a>.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-character">carácter</a> o letra.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-tabindex"><span style="color: green;">tabindex </span></a></td>
+   <td>Asigna un número de posición en el orden de tabulación.</td>
+   <td>Un número entre 0 y 32767.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onfocus, onblur.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">target </code></td>
+   <td>Indica el <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#h-16.1">marco</a> en el que se cargará el recurso.</td>
+   <td>Puede ser el nombre de un marco existente, o un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-frame-target">nombre reservado</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_mapa_de_im.C3.A1genes_dividido_en_dos" name="Un_mapa_de_im.C3.A1genes_dividido_en_dos">Un mapa de imágenes dividido en dos</h4>
+
+<pre class="eval"><span class="nowiki">
+ &lt;object data="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png"
+         usemap="#map1" type="image/png"
+         width="135" height="155"&gt;
+
+   &lt;map name="map1"&gt;
+     &lt;area href="http://www.mozilla.com/firefox/"
+       alt="El navegador"
+       shape="rect"
+       coords="0,0,60,155"&gt;
+
+     &lt;area href="http://www.mozilla.com/thunderbird/"
+       alt="El gestor de correo"
+       shape="rect"
+       coords="75,0,135,155"&gt;
+   &lt;/map&gt;
+ &lt;/object&gt;
+ </span>
+</pre>
+</div>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-area">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li><strong>area</strong> es un elemento antiguo con el que pueden hacerse mapas simples y poco accesibles. No se recomienda su uso, es preferible diseñar los mapas con elementos en bloque y <a href="es/HTML/Elemento/a">anclas</a>.</li>
+</ul>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>Los mapas de imágenes y el elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#h-13.6"><strong>area</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras! Disculpen las molestias.</p>
+
+<p>¿Quieres participar en su ampliación? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/article/index.html b/files/es/web/html/element/article/index.html
new file mode 100644
index 0000000000..9b30223f16
--- /dev/null
+++ b/files/es/web/html/element/article/index.html
@@ -0,0 +1,61 @@
+---
+title: article
+slug: Web/HTML/Element/article
+translation_of: Web/HTML/Element/article
+original_slug: Web/HTML/Elemento/article
+---
+<p>El <em>Elemento article de HTML</em> <span style="font-family: Courier New;">(&lt;article&gt;)</span> representa una composición auto-contenida en un documento, página, una aplicación o en el sitio, que se destina a distribuir de forma independiente o reutilizable, por ejemplo, en la indicación. Podría ser un mensaje en un foro, un artículo de una revista o un periódico, una entrada de blog, un comentario de un usuario, un widget interactivo o gadget, o cualquier otro elemento independiente del contenido.</p>
+
+<div class="note">
+<p><em>Notas de uso: </em></p>
+
+<ul>
+ <li>Cuando los elementos <code>&lt;article&gt;</code> están anidados, los internos representan artículos relacionados con el exterior. Por ejemplo, los comentarios de un blog pueden ser elementos <code>&lt;article&gt;</code> anidados al que representa la entrada del blog.</li>
+ <li>Los datos del autor de un elemento <code>&lt;article&gt;</code> pueden ser proporcionados a través del elemento {{ HTMLElement ("address") }}, pero no se aplica a los elementos <code>&lt;article&gt;</code> anidados.</li>
+ <li>La fecha de publicación y el tiempo de un elemento <code>&lt;article&gt;</code> pueden ser descritos con el atributo {{ htmlattrxref ("pubdate", "time") }} atributo de un elemento {{ HTMLElement("time") }}.</li>
+</ul>
+</div>
+
+<h3 id="Contexto_de_uso">Contexto de uso</h3>
+
+<table class="fullwidth-table" style="height: 117px; width: 1125px;">
+ <tbody>
+  <tr>
+   <td>Contenido permitido</td>
+   <td><a title="es / RSS / módulo / categorías de contenido de flujo de contenido #">Contenido dinámico</a></td>
+  </tr>
+  <tr>
+   <td>Omisión de etiquetas</td>
+   <td>Ninguna, tanto la etiqueta inicial como la etiqueta de cierre son obligatorias</td>
+  </tr>
+  <tr>
+   <td>Elementos padres permitidos</td>
+   <td>
+    <p>Cualquier elemento que acepte <a title="https: / / developer.mozilla.org / es / HTML / Content_categories flow_content #">el contenido dinámico</a> . Tenga en cuenta que un elemento <code>&lt;article&gt;</code> no debe ser un descendiente de un elemento {{ HTMLElement ("address") }}.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Documento normativo</td>
+   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-article-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html # el-artículo-elemento">HTML 5, sección 4.4.4</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Atributos">Atributos</h3>
+
+<p>Este elemento no tiene atributos que no sean los atributos globales, comunes a todos los elementos.</p>
+
+<div id="section_3">
+<div id="section_3">
+<h3 class="editable" id="Interfaz_DOM">Interfaz DOM</h3>
+
+<p>Este elemento implementa la interfaz HTMLElement.</p>
+
+<h3 id="Consulta_también">Consulta también</h3>
+
+<ul>
+ <li>Otros elementos relacionados con secciones: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("section") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }}</li>
+ <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Sections and outlines of an HTML5 document</a>.</li>
+</ul>
+</div>
+</div>
diff --git a/files/es/web/html/element/aside/index.html b/files/es/web/html/element/aside/index.html
new file mode 100644
index 0000000000..46fefc73ce
--- /dev/null
+++ b/files/es/web/html/element/aside/index.html
@@ -0,0 +1,69 @@
+---
+title: aside
+slug: Web/HTML/Element/aside
+tags:
+  - HTML
+  - HTML5
+  - HTML:Elemento
+  - HTML:Referencia_de_elementos
+  - para_revisar
+translation_of: Web/HTML/Element/aside
+original_slug: Web/HTML/Elemento/aside
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El <strong>elemento HTML <code>&lt;aside&gt;</code></strong> representa una sección de una página que consiste en contenido que está indirectamente relacionado con el contenido principal del documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Estas secciones son a menudo representadas como barras laterales o como inserciones y contienen una explicación al margen como una definición de glosario, elementos relacionados indirectamente, como publicidad, la biografía del autor, o en aplicaciones web, la información de perfil o enlaces a blogs relacionados.</span></span></p>
+
+<div class="note">
+<p><em><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Notas de uso:</span></span></em></p>
+
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">No utilices el elemento <code>&lt;aside&gt;</code> para etiquetar texto entre paréntesis, ya que este tipo de texto se considera parte del flujo principal.</span></span></li>
+</ul>
+</div>
+
+<h3 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
+   <td><a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content"><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido dinámico</span></span></a></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Ninguna, tanto la etiqueta inicial y la etiqueta de cierre son obligatorias</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
+   <td>
+    <p><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-97 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte contenido dinámico.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Ten en cuenta que un elemento &lt;aside&gt; no debe ser un descendiente de un elemento {{ HTMLElement ("address") }}.</span></span></p>
+   </td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
+   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-aside-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-aside-element"><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.4.5</span></span></a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento no tiene atributos que no sean los <a href="/en/HTML/Global_attributes" title="../../../../en/HTML/global attributes">atributos globales</a>, comunes a todos los elementos.</span></span></p>
+
+<div id="section_3">
+<div id="section_3">
+<h3 class="editable" id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento implementa la interfaz </span></span><code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">.</span></span></p>
+
+<h3 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h3>
+
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Otros elementos relacionados con esta sección: {{ HTMLElement("body") }}, {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};</span></span></li>
+ <li class="last"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Secciones y líneas generales de un documento HTML 5</a> .</span></span></li>
+</ul>
+</div>
+</div>
+
+<p> </p>
+
+<p>{{ languages ( { "en": "en/HTML/Element/aside","es":"es/docs/HTML/Elemento/aside" } ) }}</p>
diff --git a/files/es/web/html/element/audio/index.html b/files/es/web/html/element/audio/index.html
new file mode 100644
index 0000000000..5076bc1769
--- /dev/null
+++ b/files/es/web/html/element/audio/index.html
@@ -0,0 +1,106 @@
+---
+title: Audio
+slug: Web/HTML/Element/audio
+translation_of: Web/HTML/Element/audio
+original_slug: Web/HTML/Elemento/audio
+---
+<p>El elemento <code>audio</code> se usa para insertar contenido de audio en un documento HTML o XHTML. El elemento <code>audio</code> se agregó como parte de HTML 5.</p>
+
+<div class="note"><strong>Nota:</strong> actualmente Gecko admite solamente Vorbis, en contenedores Ogg, así como formato WAV. Asimismo, el servidor debe servir el archivo mediante el tipo MIME correcto con el fin de que Gecko lo reproduzca correctamente.</div>
+
+<p>Puedes usar las características API de audio mejoradas - que son específicas de Gecko - para generar y manipular directamente secuencias de audio a partir de código JavaScript. Consulta <a href="/en/Manipulating_audio_using_the_enhanced_audio_API" title="en/Manipulating audio using the enhanced audio API">Manipular sonido a través de la API de audio mejorada</a> para tener más detalles.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Contenido permitido</td>
+   <td><a href="/en/HTML/Content_categories#transparent_content" title="en/HTML/Content categories#transparent content">Contenido transparente</a>, que contiene bien un atributo<strong> src</strong>, bien uno o más elementos {{ HTMLElement("source") }}, seguido de <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> o <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">contenido estático</a> , sin ningún elemento de {{ HTMLElement("video") }} o <code>&lt;audio&gt;</code>.</td>
+  </tr>
+  <tr>
+   <td>Omisión de etiquetas</td>
+   <td>Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre.</td>
+  </tr>
+  <tr>
+   <td>Elementos primarios permitidos</td>
+   <td>Cualquier elemento que acepte <a href="../../../../en/HTML/Content_categories#flow_content" rel="internal">contenido dinámico</a> o cualquier elemento que acepte <a href="../../../../en/HTML/Content_categories#phrasing_content" rel="internal">contenido estático</a>.</td>
+  </tr>
+  <tr>
+   <td>Documento normativo</td>
+   <td><a class="external" href="http://www.w3.org/TR/html5/video.html#audio" title="http://www.w3.org/TR/html5/video.html#audio">HTML5, sección 4.8.7</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<dl>
+ <dt>autoplay</dt>
+ <dd>Un atributo booleano; si se especifica (incluso aunque el valor sea "false"), el sonido comenzará a reproducirse automáticamente en cuanto sea posible, sin detenerse para terminar de cargar los datos.</dd>
+ <dt>autobuffer {{ obsolete_inline("2.0") }}</dt>
+ <dd>Un atributo booleano; si se especifica, el sonido comenzará a reproducirse automáticamente, incluso aunque no se haya configurado para la reproducción automática. Esto continuará hasta que la caché de medios esté llena o se haya descargado el archivo de audio completo, lo que suceda primero. Debería usarse sólo si se espera que el usuario elija reproducir el audio; por ejemplo si el usuario ha navegado hasta una página usando un vínculo de "Reproducir este audio". Este atributo se eliminó de Gecko 2.0 {{ geckoRelease("2.0") }} en favor del atributo preload.</dd>
+ <dt><a name="attr-buffered">buffered</a> {{ gecko_minversion_inline("2.0") }}</dt>
+ <dd>Un atributo que se puede leer para determinar qué intervalos de tiempo del multimedia se han almacenado en búfer. Este atributo contiene un objeto {{ domxref("TimeRanges") }}.</dd>
+ <dt>controls</dt>
+ <dd>Si está presente este atributo, el navegador ofrecerá controles para permitir que el usuario controle la reproducción de audio, incluyendo volumen, búsqueda y pausar/reanudar reproducción.</dd>
+ <dt>loop {{ unimplemented_inline() }} {{ bug(449157) }}</dt>
+ <dd>Un atributo booleano; si se especifica, al alcanzar el final del audio, realizaremos la búsqueda automáticamente hasta el principio.</dd>
+ <dt>mozCurrentSampleOffset {{ gecko_minversion_inline("2.0") }} {{ non-standard_inline() }}</dt>
+ <dd>La posición de desplazamiento, que se especifica como el número de muestras desde el comienzo de la secuencia de audio, en la cual el audio se está reproduciendo actualmente.</dd>
+ <dt><a name="attr-preload">preload</a> {{ gecko_minversion_inline("2.0") }} {{ bug(548523) }}</dt>
+ <dd>El objetivo de este atributo enumerado es proporcionar una sugerencia al navegador sobre qué cree el autor que proporcionará la mejor experiencia para el usuario . Puede tener uno de los siguientes valores:
+ <ul>
+  <li><span style="font-family: Courier New;">none: </span>sugiere bien que el autor cree que el usuario no tendrá que consultar ese video, bien que el servidor desea minimizar su tráfico; es decir, esta sugerencia indica que no se debe almacenar en caché este video;</li>
+  <li><span style="font-family: Courier New;">metadata</span>: sugiere que aunque el autor piensa que el usuario no tendrá que consultar ese video, es razonable capturar los metadatos (p. ej. longitud);</li>
+  <li><span style="font-family: Courier New;">auto</span>: sugiere que el usuario necesita tener prioridad; es decir, esta sugerencia indica que, si es necesario, se puede descargar el video completo, incluso aunque el usuario no vaya a usarlo;</li>
+  <li>the <em>empty string</em>: que es sinónimo del valor <span style="font-family: Courier New;">auto</span>.</li>
+ </ul>
+
+ <p>Si no está configurado, su valor predeterminado está definido por el navegador (es decir, cada navegador puede elegir su propio valor predeterminado), aunque la especificación aconseje que se establezca a <span style="font-family: Courier New;">metadatos</span>.</p>
+
+ <div class="note"><strong>Observaciones sobre uso:</strong>
+
+ <ul>
+  <li>El atributo <strong>autoplay </strong> tiene prioridad sobre éste puesto que si se desea reproducir automáticamente un video, el navegador obviamente tendrá que descargarlo. La especificación permite establecer los atributos<strong> autoplay</strong> y <strong>preload</strong>.</li>
+  <li>La especificación no fuerza al navegador a seguir el valor de este atributo; es tan sólo una sugerencia.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>src</dt>
+ <dd>La URL del audio que se va a insertar. Está sujeta a los <a class="internal" href="/En/HTTP_access_control" title="En/HTTP access control">Controles de acceso HTTP</a>. Es opcional; en su lugar puedes usar el elemento <a class="internal" href="/en/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> dentro del bloque de audio para especificar el audio que se va a insertar.</dd>
+</dl>
+
+<p>Las compensaciones de tiempo se especifican como valores float que indican el número de segundos que se va a compensar.</p>
+
+<div class="note"><strong>Nota:</strong> la definición del valor de compensación de tiempo no se ha completado en HTML 5 aún y está sujeta a cambios.</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg"
+       autoplay&gt;
+  Your browser does not support the &lt;code&gt;audio&lt;/code&gt; element.
+&lt;/audio&gt;
+</pre>
+
+<p>Reproduce el fichero de audio adjunto a este artículo.</p>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<ul>
+ <li><a href="/en/DOM/HTMLAudioElement" title="en/DOM/HTMLAudioElement">HTMLAudioElement</a></li>
+</ul>
+
+<h2 id="Consulta_también">Consulta también</h2>
+
+<ul>
+ <li><a href="/es/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio" title="es/Formatos multimedia admitidos por los elementos de video y audio"><u>Formatos multimedia admitidos por los elementos de audio y video</u></a></li>
+ <li><a href="/en/Manipulating_audio_using_the_enhanced_audio_API" title="en/Manipulating audio using the enhanced audio API">Manipulating audio using the enhanced audio API</a></li>
+ <li><a href="/en/DOM/HTMLAudioElement" title="en/DOM/HTMLAudioElement"><code>HTMLAudioElement</code></a></li>
+ <li><a class="internal" href="/En/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement" title="En/NsIDOMHTMLMediaElement"><code>nsIDOMHTMLMediaElement</code></a></li>
+ <li><a class="internal" href="/en/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a></li>
+ <li><a class="internal" href="/es/Using_audio_and_video_in_Firefox" title="Es/Usar audio y video en Firefox">Usar audio y video en Firefox</a></li>
+ <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#audio" title="http://www.whatwg.org/specs/web-apps/current-work/#audio">The <code>audio</code> element</a> (HTML 5 specification)</li>
+</ul>
+
+<p>{{ languages( { "en": "en/HTML/Element/Audio" , "fr": "fr/HTML/Element/audio" } ) }}</p>
diff --git a/files/es/web/html/element/b/index.html b/files/es/web/html/element/b/index.html
new file mode 100644
index 0000000000..253c7941be
--- /dev/null
+++ b/files/es/web/html/element/b/index.html
@@ -0,0 +1,169 @@
+---
+title: b
+slug: Web/HTML/Element/b
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/b
+original_slug: Web/HTML/Elemento/b
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>b</strong> de bold=negrita.</p>
+
+<p>Indica que el texto debe ser representado con una variable <strong>bold</strong>, o <strong>negrita,</strong><strong> </strong>de la tipografía que se esté usando.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;b&gt;</code> y <code>&lt;/b&gt;</code> (Ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: en línea.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">de estilo de fuente</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+</dl>
+
+<h5 id="Atributos" name="Atributos">Atributos</h5>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Palabras_pesadas" name="Palabras_pesadas">Palabras pesadas</h4>
+
+<pre class="eval">&lt;p&gt;
+       Texto normal y... &lt;b&gt;Texto en negrita&lt;/b&gt;
+&lt;/p&gt;
+</pre>
+
+<p><br>
+ Se visualiza así:</p>
+
+<div style="border: solid silver 1px;">
+<p style="font-family: ,serif; font-size: larger;">Texto normal y... <strong>Texto en negrita</strong></p>
+</div>
+</div>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-b">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<p>El inherente a su condición: <strong>negrita.</strong> Prueba el siguiente ejemplo:</p>
+
+<pre class="eval"><span class="nowiki">
+ &lt;style&gt;
+        span { font-weight: bolder; }
+ &lt;/style&gt;
+
+ &lt;p&gt; Esto es:  &lt;b&gt; un elemento b &lt;/b&gt; y esto es: &lt;span&gt;un span con estilo&lt;/span&gt;  &lt;/p&gt;
+ </span>
+</pre>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li>El <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">W3C</a> (y nosotros) desaconseja el uso de este elemento, para manejar el estilo del texto es mejor usar <a href="es/CSS">CSS</a>.</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-B"><strong>b</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/base/index.html b/files/es/web/html/element/base/index.html
new file mode 100644
index 0000000000..db45e71644
--- /dev/null
+++ b/files/es/web/html/element/base/index.html
@@ -0,0 +1,159 @@
+---
+title: <base>
+slug: Web/HTML/Element/base
+tags:
+  - Elemento
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/base
+original_slug: Web/HTML/Elemento/base
+---
+<p id="Summary">{{HTMLRef}}</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El <strong>elemento HTML <code>&lt;base&gt;</code></strong> <span id="result_box" lang="es"><span>especifica la dirección URL</span> <span>base que se utilizará</span> <span>para todas las</span> <span>direcciones URL relativas</span> <span>contenidas</span> <span>dentro de un documento</span><span>.</span> </span> <span id="result_box" lang="es"><span>Sólo puede haber un</span></span> <span lang="es"><span>elemento &lt;base&gt;</span> <span>en un documento</span><span>.</span></span></p>
+
+<p><span id="result_box" lang="es"><span>La</span> <span>dirección URL base</span> <span>de un documento</span> <span>puede ser consultado</span> <span>a partir de una</span> <span>secuencia de comandos con</span></span> {{domxref('document.baseURI')}}.</p>
+
+<div class="note"><strong>Nota de uso:</strong> Si se especifican varios elementos &lt;base&gt;, se utilizá sólo la primera sección <strong>href</strong> y el primer valor <strong>target</strong>; los demás son ignorados.</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de Contenido</a></th>
+   <td><span class="short_text" id="result_box" lang="es"><span>Contenido de Metadatos</span></span></td>
+  </tr>
+  <tr>
+   <th>Contenido permitido</th>
+   <td><span class="short_text" id="result_box" lang="es"><span>Ninguno</span><span>, es un</span></span> {{Glossary("empty element")}}.</td>
+  </tr>
+  <tr>
+   <th>Omisión de etiqueta</th>
+   <td><span class="short_text" id="result_box" lang="es"><span>No debe haber ninguna</span> <span>etiqueta de cierre</span><span>.</span></span></td>
+  </tr>
+  <tr>
+   <th>Elementos padres permitidos</th>
+   <td><span id="result_box" lang="es"><span>Cualquier</span></span> {{HTMLElement("head")}} <span id="result_box" lang="es"><span>que</span> <span>no contenga ningún</span> <span>elemento </span></span>{{HTMLElement("base")}}</td>
+  </tr>
+  <tr>
+   <th>Interfaz DOM</th>
+   <td>{{domxref("HTMLBaseElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Attributos">Attributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="https://developer.mozilla.org/es/docs/Web/HTML/Atributos_Globales" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a><span style="line-height: 21px;">.</span></p>
+
+<dl>
+ <dt>{{htmlattrdef("href")}}</dt>
+ <dd><span id="result_box" lang="es"><span>La dirección URL</span> <span>base que se usa</span> <span>en todo el documento</span> <span>para las direcciones</span> <span>URL</span> <span>relativas.</span> <span>Si no se especifica</span> <span>este atributo</span><span>,</span> <span>este elemento</span> <span>debe venir antes de</span> <span>cualesquiera otros elementos</span> <span>con</span> <span>atributos cuyos valores son</span> <span>direcciones URL</span><span>.</span> <span>Se permiten</span> <span>las direcciones URL absolutas</span> <span>y relativas.</span></span></dd>
+ <dt>{{htmlattrdef("target")}}</dt>
+ <dd><span id="result_box" lang="es"><span>Un nombre</span> <span>o una palabra clave</span> <span>que indica</span> <span>la ubicación predeterminada</span> <span>para navegar por</span> <span>el resultado de</span> <span>hipervínculos</span> <span>o</span> <span>formas</span></span>, <span id="result_box" lang="es"><span>para los elementos</span> <span>que no tienen</span> <span>una referencia</span></span> <span id="result_box" lang="es"> <span>explícita</span> <span>del objetivo</span></span> <span id="result_box" lang="es"><span>.</span> <span>Es un</span> <span>nombre</span> <span>o una palabra clave</span> <span>para</span> <span>un</span> <span>contexto de navegación</span> <span>(</span><span>por ejemplo</span><span>:</span> <span>pestaña</span><span>, ventana o</span> <span>marco en línea</span><span>)</span><span>.</span> <span>Las</span> <span>siguientes</span> <span>palabras clave</span> <span>tienen un significado especial</span><span>:</span></span> tab, window, o inline frame).Las siguientes palabras clave tienen un significado especial:
+ <ul>
+  <li><code>_self</code>: <span id="result_box" lang="es"><span>Carga el resultado</span> <span>en el mismo</span> <span>contexto de navegación</span> que<span> el actual</span><span>.</span> <span>Este valor</span> <span>es</span> <span>el valor por defecto</span> <span>si no se especifica</span> <span>el atributo</span><span>.</span></span></li>
+  <li><code>_blank</code>: <span id="result_box" lang="es"><span>Carga el resultado</span> <span>en un nuevo</span> <span>contexto de navegación</span> <span>sin nombre</span></span> .</li>
+  <li><code>_parent</code>: <span id="result_box" lang="es"><span>Cargar</span> <span>el resultado en el</span> <span>contexto de navegación</span> <span>padre</span> <span>de</span><span>l actual.</span> <span>Si no hay</span> <span>padre</span><span>, esta opción</span> <span>se comporta de la</span> <span>misma manera que</span> <span>_self</span><span>.</span></span></li>
+  <li><code>_top</code>: <span id="result_box" lang="es"><span>Carga el resultado</span> <span>en</span> <span>el contexto</span> <span>de nivel superior</span> <span>de navegación</span> <span>(</span><span>es decir, el</span> <span>contexto de navegación</span> <span>que</span> <span>es</span> <span>un ancestro de</span> <span>la actual,</span> <span>y no tiene</span> <span>padre)</span><span>.</span> <span>Si no hay</span> <span>padre</span><span>, esta opción</span> <span>se comporta de la</span> <span>misma manera que</span> <span>_self</span><span>.</span></span></li>
+ </ul>
+ </dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>base</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.example.com/page.html<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>base</span> <span class="attr-name token">target</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>_blank<span class="punctuation token">"</span></span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.example.com/page.html<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<article class="approved text-content">
+<div class="boxed translate-rendered">
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('HTML WHATWG', 'semantics.html#the-base-element', '&lt;base&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td><span class="short_text" id="result_box" lang="es"><span>Sin cambios</span> <span>desde la última</span> <span>instantánea</span></span>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'document-metadata#the-base-element', '&lt;base&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td><span class="short_text" id="result_box" lang="es"><span>Especifica el</span> <span>comportamiento de</span></span> <code>target</code></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/links.html#h-12.4', '&lt;base&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Añadido el atributo <code>target</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}} [1]</td>
+   <td>{{CompatVersionUnknown}} [2]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}} [1]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] A<span id="result_box" lang="es"><span>ñadido soporte</span> <span>de las URL</span> <span>relativas para</span></span> <code>href</code> <span id="result_box" lang="es"><span>en</span></span> Gecko 2.0 (Firefox 4.0)</p>
+
+<p>[2] Antes de Internet Explorer 7, &lt;base&gt; podría ser colocado en cualquier lugar del documento y se usaba el valor más cercano de &lt;base&gt;. El apoyo a las URL relativas se ha eliminado en Internet Explorer 8</p>
+</div>
+</article>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/basefont/index.html b/files/es/web/html/element/basefont/index.html
new file mode 100644
index 0000000000..3895ef66ce
--- /dev/null
+++ b/files/es/web/html/element/basefont/index.html
@@ -0,0 +1,125 @@
+---
+title: basefont
+slug: Web/HTML/Element/basefont
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/basefont
+original_slug: Web/HTML/Elemento/basefont
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>basefont</strong> -<em>fuente base</em> . Permite cambiar algunas propiedades del texto.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;basefont&gt; (solo tiene una).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">desaprobado</a>.
+ <dl>
+  <dd>En un doctype transicional está definido como un elemento <a href="es/HTML/Elemento/Tipos_de_elementos#especial">especial</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: No.</dd>
+ <dd><strong>Puede contener</strong>: Nada.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-size-FONT"><span style="color: green;">size</span></a></td>
+   <td>Tamaño de la fuente. Según una tabla del 1 al 7.</td>
+   <td>Un número entero (ej. 1), o un valor incremental (ej. +1). <s>Por defecto:</s> debe indicarlo el autor.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-color-FONT"><span style="color: green;">color</span></a></td>
+   <td>El color del texto.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.5">color RGB</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-face-FONT"><span style="color: green;">face</span></a></td>
+   <td>Especifica la/s fuentes para el texto.</td>
+   <td>Lista de nombres de fuentes separadas por coma. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_ejemplo_simple" name="Un_ejemplo_simple">Un ejemplo simple</h4>
+
+<p>Código:</p>
+
+<pre class="eval">&lt;p&gt;
+ Texto normal y ...
+ &lt;<strong>basefont</strong> size="5" color="#0000ff"&gt;
+ Texto distinto.
+&lt;/p&gt;
+</pre>
+
+<p><span class="comment">Resultado: &lt;div style='border: solid silver 1px;'&gt; &lt;p&gt; Texto normal y ... &lt;basefont size="5" color="#0000ff"&gt; Texto distinto. &lt;/p&gt; &lt;/div&gt;</span></p>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-BASEFONT"><strong>basefont</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-basefont">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/bdi/index.html b/files/es/web/html/element/bdi/index.html
new file mode 100644
index 0000000000..6959460938
--- /dev/null
+++ b/files/es/web/html/element/bdi/index.html
@@ -0,0 +1,141 @@
+---
+title: <bdi>
+slug: Web/HTML/Element/bdi
+tags:
+  - BiDi
+  - Elemento
+  - HTML
+  - Referencia
+  - Semántica HTML a nivel de texto
+  - Web
+translation_of: Web/HTML/Element/bdi
+original_slug: Web/HTML/Elemento/bdi
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento <em>HTML <code>&lt;bdi&gt;</code> </em>(o elemento de aislamiento Bi-Direccional) aisla un trozo de texto para que pueda ser formateado con una dirección diferente al texto que hay fuera de él.</p>
+
+<p>Es útil al embeber o incrustart texto del que se desconoce la direccionalidad, por ejemplo proveniente de una base de datos, dentro de un texto con una direccionalidad fija.</p>
+
+<p class="note">Aunque el mismo efecto visual se puede conseguir usando la regla  CSS  {{cssxref("unicode-bidi")}}<code>: isolate</code> en un elemento  {{HTMLElement("span")}} u otro elemento de formateado de texto, el significado semántico sólo se consigue usando el elemento<code> &lt;bdi&gt;</code>. En especial los navegadores permiten ignorar los estilos CSS. En tal caso el texto se mostrará correctamente usando el elemento HTML pero será basura usando CSS para fijar la semántica.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>, contenido palpable.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Flow_content">Phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Any element that accepts <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Flow_content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Como los demás elementos HTML , este elemento tiene los <a href="/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">global attributes</a>, pero con una pequeña diferencia semántica: el atributo <strong>dir </strong>no se hereda. Si no está definidio, su valor por defecto es <code>auto</code> y permitirá a los navegadores decidir la dirección basándose en el contexto del elemento.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html">&lt;p dir="ltr"&gt;Esta palabara arábica&lt;bdi&gt;ARABIC_PLACEHOLDER&lt;/bdi&gt; se muestra automáticamente de derecha a izquierda.&lt;/p&gt;
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p dir="ltr">Esta palabra arábica REDLOHECALP_CIBARA se muestra automáticamente de derecha a izquierda.</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('HTML WHATWG', 'text-level-semantics.html#the-bdi-element', '&lt;bdi&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'the-bdi-element.html#the-bdi-element', '&lt;bdi&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>16</td>
+   <td>{{CompatGeckoDesktop("10.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("10.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 dir="ltr" id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>Elementos HTML relacionados: {{HTMLElement("bdo")}}</li>
+ <li>Propiedades HTML relacionadas: {{cssxref("direction")}}, {{cssxref("unicode-bidi")}}</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/bdo/index.html b/files/es/web/html/element/bdo/index.html
new file mode 100644
index 0000000000..be3c05de1a
--- /dev/null
+++ b/files/es/web/html/element/bdo/index.html
@@ -0,0 +1,145 @@
+---
+title: bdo
+slug: Web/HTML/Element/bdo
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/bdo
+original_slug: Web/HTML/Elemento/bdo
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>bdo</strong> Bi-Directional Overriding=Anulación de bidireccionalidad.</p>
+
+<p>La dirección de escritura del texto está relacionada con el idioma y se declara con el atributo dir. Pero en ocasiones esto no es suficiente, entonces entra en juego el elemento <a href="es/HTML/Elemento/bdo">bdo</a> (anulación del algoritmo bidireccional) que al anular el algoritmo permite un control total de la direccionalidad.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;bdo&gt; y &lt;/bdo&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En línea.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#especial">Elemento especial</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<p> </p>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir-BDO"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Debe indicarlo el autor</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Cambios_de_direcci.C3.B3n" name="Cambios_de_direcci.C3.B3n">Cambios de dirección</h4>
+
+<pre>&lt;p&gt; cero(0)
+&lt;bdo dir="rtl"&gt;
+&lt;em&gt; uno(1) dos(2) &lt;/em&gt; tres(3) cuatro(4)
+&lt;em dir="ltr"&gt; cinco(5) seis(6) &lt;/em&gt; siete(7) ocho(8)
+&lt;/bdo&gt; nueve(9)
+&lt;/p&gt;
+</pre>
+</div>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-bdo">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#edef-BDO"><strong>bdo</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/bgsound/index.html b/files/es/web/html/element/bgsound/index.html
new file mode 100644
index 0000000000..401202adfc
--- /dev/null
+++ b/files/es/web/html/element/bgsound/index.html
@@ -0,0 +1,107 @@
+---
+title: <bgsound>
+slug: Web/HTML/Element/bgsound
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/bgsound
+original_slug: Web/HTML/Elemento/bgsound
+---
+<div>{{non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento HTML de sonido de fondo (&lt;bgsound&gt;) es un elemento de Internet Explorer que asocia  un sonido de fondo con un página .</p>
+
+<div class="note">
+<p><strong>No usar esto ! </strong>Para incrustar un elemento en una página web , se debe  de usar el elemento  {{HTMLElement("audio")}}</p>
+</div>
+
+<h2 id="Atributos">Atributos</h2>
+
+<dl>
+ <dt>{{htmlattrdef("balance")}}</dt>
+ <dd>Este atributo define un número entre -10,000 y + 10,000 que determina como el volumen será dividido entre los altavoces .</dd>
+ <dt>{{htmlattrdef("loop")}}</dt>
+ <dd>Este atributo indica el número de veces que un soinido será reproducido ya sea como un valor numérico o la palabra clave <em>infinite</em> .</dd>
+ <dt>{{htmlattrdef("src")}}</dt>
+ <dd>Este atributo especifica la URL del archivo de sonido que será reproducido , el cual debe ser uno de los siguientes tipos : wav, .au, o .mid.</dd>
+ <dt>{{htmlattrdef("volume")}}</dt>
+ <dd>Este atributo define un número entre -10,000 y 0 que determina la fuerza del sonido de fondo de una página .</dd>
+ <dd> </dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush:html">&lt;bgsound src="sound1.mid"&gt;
+
+&lt;bgsound src="sound2.au" loop="infinite"&gt;
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>Funcionalidad similar puede ser lograda en algunas versiones de Netscape usando la etiqueta &lt;embed&gt; para invocar un reproductor de audio .</p>
+
+<p>Puedes escribir bgsound con una etiqueta de cierre automático &lt;bgsound /&gt; . Ahora bien , desde que este elemento no es parte de un estándar , haciendolo como XHTML no lo hará valido. </p>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Hasta Firefox 22 , incluso si no se soportaba este elemento , Gecko lo asociaba a un elemento {{domxref("HTMLSpanElement")}}. Esto fue corregido después y ahora el elemento asociado es un  {{domxref("HTMLUnknownElement")}} como es requerido  por la especificación . </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li> {{htmlelement("audio")}}, el cual es el elemento estándar para incrustar audio en un documento.</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/big/index.html b/files/es/web/html/element/big/index.html
new file mode 100644
index 0000000000..98332f1846
--- /dev/null
+++ b/files/es/web/html/element/big/index.html
@@ -0,0 +1,192 @@
+---
+title: big
+slug: Web/HTML/Element/big
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/big
+original_slug: Web/HTML/Elemento/big
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>big</strong> de big=grande</p>
+
+<p>Muestra el texto marcado con un tamaño de fuente más grande. El tamaño de la fuente puede definirse en una escala del 1 al 7, <strong>big</strong> aumenta este valor en un punto.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;big&gt;</code> y <code>&lt;/big&gt;</code> (Ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En línea.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">de estilo de fuente</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Simple" name="Simple">Simple</h4>
+
+<pre class="eval"><span class="nowiki">
+  &lt;p&gt;
+
+   Texto normal y... &lt;big&gt;Texto más grande&lt;/big&gt;
+
+  &lt;/p&gt;
+ </span>
+</pre>
+</div>
+
+<div class="highlight">
+<h4 id="Recursivo" name="Recursivo">Recursivo</h4>
+
+<p><strong>big</strong> puede contener otros elementos en línea, por ejemplo... <strong>big</strong>:</p>
+
+<pre class="eval"><span class="nowiki">
+  &lt;p&gt;
+
+   Texto normal y texto &lt;big&gt; cada &lt;big&gt; vez &lt;big&gt; más &lt;big&gt; grande. &lt;/big&gt;&lt;/big&gt;&lt;/big&gt;&lt;/big&gt;
+
+  &lt;/p&gt;
+ </span>
+</pre>
+
+<p>Se visualiza así:</p>
+
+<div style="border: solid silver 1px;">
+<p>Texto normal y texto cada vez más grande.</p>
+</div>
+</div>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-big">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<p>Observa el siguiente ejemplo:</p>
+
+<pre class="eval"><span class="nowiki">
+ &lt;style&gt;
+        span { font-size: larger; }
+ &lt;/style&gt;
+
+ &lt;h2&gt; Con big &lt;/h2&gt;
+ &lt;p&gt; Texto normal y texto ...
+
+ &lt;big&gt; cada &lt;big&gt; vez &lt;big&gt; más &lt;big&gt; grande. &lt;/big&gt;&lt;/big&gt;&lt;/big&gt;&lt;/big&gt;  &lt;/p&gt;
+
+ &lt;h2&gt; Con CSS &lt;/h2&gt;
+ &lt;p&gt; Texto normal y texto ...
+
+ &lt;span&gt; cada &lt;span&gt; vez &lt;span&gt; más &lt;span&gt; grande. &lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  &lt;/p&gt;
+ </span>
+</pre>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li><strong>big</strong> tiene un elemento opuesto, <a href="es/HTML/Elemento/small">small</a>. Si <strong>big</strong> aumenta el tamaño de la fuente <a href="es/HTML/Elemento/small">small</a> lo disminuye. Sin embargo en su funcionamiento son idénticos.</li>
+ <li>El W3C (y nosotros) desaconseja el uso de este elemento, para manejar el tamaño del texto es mejor usar CSS.</li>
+</ul>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-BIG"><strong>big</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/blink/index.html b/files/es/web/html/element/blink/index.html
new file mode 100644
index 0000000000..0233ab7bab
--- /dev/null
+++ b/files/es/web/html/element/blink/index.html
@@ -0,0 +1,101 @@
+---
+title: <blink>
+slug: Web/HTML/Element/blink
+tags:
+  - Elemento
+  - HTML
+  - Obsoleto
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/blink
+original_slug: Web/HTML/Elemento/blink
+---
+<div>{{Deprecated_header}} {{Non-standard_header}}</div>
+
+<p>El elemento HTML blink (<code>&lt;blink&gt;</code>) no es un elemento estándar que causa que el texto encerrado parpadee lentamente .</p>
+
+<div class="warning">
+<p class="note"><strong>Precaución :</strong> No usar este elemento ya que no es un elemento estándar y está <strong>obsoleto</strong>. El texto parpadeante es mal visto por diversos estándares de accesibilidad y la especificación de CSS permite a los exploradores ingnorar el valor del parpadeo . .</p>
+</div>
+
+<h2 id="Interface_DOM">Interface DOM</h2>
+
+<p>Este elemento no es soportado y por lo tanto implementa la interface {domxref("HTMLUnknownElement")}} .</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush:html">&lt;blink&gt;Why would somebody use this?&lt;/blink&gt;
+</pre>
+
+<h3 id="Resultado">Resultado </h3>
+
+<p><img alt="Image:HTMLBlinkElement.gif" src="/@api/deki/files/247/=HTMLBlinkElement.gif"></p>
+
+<h2 id="Especificación">Especificación</h2>
+
+<p>Este elemento no es parte del estándar ni de alguna espeficación . Si no nos crees puedes verlo por ti mismo en la <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/obsolete.html#non-conforming-features">espeficicación de HTML</a>.</p>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}} [2]</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}} [2]</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Soportado hasta la versión 22. Removido en la versión 23.</p>
+
+<p>[2] Soportado hasta la versión 12.1. Removido en la versión 15.0.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="http://www.montulli.org/theoriginofthe%3Cblink%3Etag">Historia de la creación del elemento</a> &lt;blink&gt;</li>
+ <li>{{cssxref("text-decoration")}}, donde un valor de parpadeo existe , aunque los exploradores no son obligados a hacer parpadear el texto efectivamente.</li>
+ <li>{{htmlelement("marquee")}}, otro elemento similar que no pertenece a un estándar.</li>
+ <li>Las <a href="/es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS">animaciones CSS</a> son la forma correcta de crear tal efecto .</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/blockquote/index.html b/files/es/web/html/element/blockquote/index.html
new file mode 100644
index 0000000000..0a1c7a81e0
--- /dev/null
+++ b/files/es/web/html/element/blockquote/index.html
@@ -0,0 +1,154 @@
+---
+title: blockquote
+slug: Web/HTML/Element/blockquote
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/blockquote
+original_slug: Web/HTML/Elemento/blockquote
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>blockquote</strong> -<em>cita en bloque</em> . Crea citas en bloque, marca las citas a otros autores o documentos.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;blockquote&gt;</code> y <code>&lt;/blockquote&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En bloque.</dd>
+ <dd><strong>Puede y debe contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a> o <a href="es/HTML/Elemento/script">script</a></dd>
+ <dd>Con un doctype transicional <strong>Puede contener</strong>: texto, y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a> o <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">cite </code></td>
+   <td>Proporciona un enlace al documento original o fuente</td>
+   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Por defecto: lo fija el navegador</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_blockquote_estricto" name="Un_blockquote_estricto">Un <strong>blockquote</strong> estricto</h4>
+
+<pre class="eval">&lt;<strong>blockquote</strong> cite='<a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-BLOCKQUOTE" rel="freelink">http://html.conclase.net/w3c/html401...def-BLOCKQUOTE</a>'&gt;
+  &lt;p&gt;
+    &lt;strong&gt;Nota.&lt;/strong&gt; Recomendamos que las implementaciones de hojas
+    de estilo porporcionen un mecanismo para insertar signos de puntuación de citas
+    antes y después de una cita delimitada por un BLOCKQUOTE de un modo apropiado según
+    el contexto del idioma actual y el grado de anidamiento de las citas.
+  &lt;/p&gt;
+&lt;/<strong>blockquote</strong>&gt;
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li>Conviene tener cuidado con las divergencias en el tipo de contenido dependiendo del doctype. El siguiente ejemplo es válido con un doctype transicional, pero no lo es con el estricto:</li>
+</ul>
+
+<pre class="eval">&lt;<strong>blockquote</strong>&gt;
+  Bla, bla, bla...
+&lt;/<strong>blockquote</strong>&gt;
+</pre>
+
+<ul>
+ <li><strong>blockquote</strong> tiene un hermano menor: <a href="es/HTML/Elemento/q">q</a>. <strong>blockquote</strong> sirve para citas en bloque y <a href="es/HTML/Elemento/q">q</a> para citas en línea.</li>
+</ul>
+
+<ul>
+ <li>A diferencia de <a href="es/HTML/Elemento/q">q</a>, <strong>blockquote</strong> no entrecomilla los contenidos, debe hacerlo el autor (con CSS).</li>
+</ul>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-BLOCKQUOTE"><strong>blockquote</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-blockquote">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/body/index.html b/files/es/web/html/element/body/index.html
new file mode 100644
index 0000000000..8e7501c39a
--- /dev/null
+++ b/files/es/web/html/element/body/index.html
@@ -0,0 +1,171 @@
+---
+title: '<body>: El elemento body del documento'
+slug: Web/HTML/Element/body
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+  - Seleccionar el elemento raíz
+  - Web
+  - secciones
+translation_of: Web/HTML/Element/body
+original_slug: Web/HTML/Elemento/body
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">El <strong>elemento <code>&lt;body&gt;</code> de HTML</strong> representa el contenido de un documento HTML. Solo puede haber un elemento <code>&lt;body&gt;</code> en un documento.</span></p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row">{{web.link("/es/docs/Web/HTML/Content_categories", "Categorías de contenido")}}</th>
+   <td>{{web.link("/en-US/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines#Section_Elements_in_HTML5", "Secciones en HTML5")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>{{web.link("/es/docs/Web/HTML/Content_categories#Flow_content", "Flujo de contenido")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>La etiqueta de inicio se puede omitir si lo primero que hay dentro no es un carácter de espacio, comentario, elemento {{HTMLElement("script")}} o elemento {{HTMLElement("style")}}. La etiqueta final se puede omitir si el elemento <code>&lt;body&gt;</code> tiene contenido o tiene una etiqueta de inicio y no va seguido inmediatamente de un comentario.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenedores autorizados</th>
+   <td>Debe ser el segundo elemento de un elemento {{HTMLElement("html")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Rol de ARIA implícito</th>
+   <td>{{web.link("/es/docs/Web/Accessibility/ARIA/Roles/Document_Role", "document")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>No se permite <code>role</code></td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{DOMxRef("HTMLBodyElement")}}
+    <ul>
+     <li>El elemento <code>&lt;body&gt;</code> expone la interfaz {{DOMxRef("HTMLBodyElement")}}.</li>
+     <li>Puedes acceder al elemento <code>&lt;body&gt;</code> a través de la propiedad {{DOMxRef("document.body")}}.</li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los {{web.link("/es/docs/Web/HTML/Global_attributes", "atributos globales")}}.</p>
+
+<dl>
+ <dt>{{HTMLAttrDef("alink")}} {{obsolete_inline}}</dt>
+ <dd>Color del texto de los hipervínculos cuando se selecciona. <em>Este método no es conforme a la especificación, utiliza la propiedad {{CSSxRef("color")}} de CSS junto con la pseudoclase {{CSSxRef(":active")}} en su lugar. </em></dd>
+ <dt>{{HTMLAttrDef("background")}} {{obsolete_inline}}</dt>
+ <dd>URI de una imagen para usar como fondo. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("background")}} en el elemento</em>.</dd>
+ <dt>{{HTMLAttrDef("bgcolor")}} {{obsolete_inline}}</dt>
+ <dd>Color de fondo del documento. <em>Este método no es conforme, utiliza la propiedad CSS {{CSSxRef("background-color")}} en el elemento</em>.</dd>
+ <dt>{{HTMLAttrDef("bottommargin")}} {{obsolete_inline}}</dt>
+ <dd>El margen de la parte inferior del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-bottom")}} en el elemento</em>.</dd>
+ <dt>{{HTMLAttrDef("leftmargin")}} {{obsolete_inline}}</dt>
+ <dd>El margen de la izquierda del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-left")}} en el elemento en su lugar</em>.</dd>
+ <dt>{{HTMLAttrDef("link")}} {{obsolete_inline}}</dt>
+ <dd>Color del texto de los enlaces de hipertexto no visitados. <em>Este método no es conforme, usa la propiedad {{CSSxRef("color")}} de CSS junto con la pseudoclase {{CSSxRef(":link")}} en su lugar</em>.</dd>
+ <dt>{{HTMLAttrDef("onafterprint")}}</dt>
+ <dd>Función para llamar después de que el usuario haya impreso el documento.</dd>
+ <dt>{{HTMLAttrDef("onbeforeprint")}}</dt>
+ <dd>Función para llamar cuando el usuario solicita la impresión del documento.</dd>
+ <dt>{{HTMLAttrDef("onbeforeunload")}}</dt>
+ <dd>Función para llamar cuando se está a punto de descargar el documento.</dd>
+ <dt>{{HTMLAttrDef("onblur")}}</dt>
+ <dd>Función para llamar cuando el documento pierde el foco.</dd>
+ <dt>{{HTMLAttrDef("onerror")}}</dt>
+ <dd>Función para llamar cuando el documento no se carga correctamente.</dd>
+ <dt>{{HTMLAttrDef("onfocus")}}</dt>
+ <dd>Función para llamar cuando el documento recibe el foco.</dd>
+ <dt>{{HTMLAttrDef("onhashchange")}}</dt>
+ <dd>Función para llamar cuando la parte del identificador del fragmento (comenzando con el carácter de almohadilla (<code>'#'</code> también conocido como numeral)) de la dirección actual del documento ha cambiado.</dd>
+ <dt>{{HTMLAttrDef("onlanguagechange")}} {{experimental_inline}}</dt>
+ <dd>Función para llamar cuando cambiaron los idiomas preferidos.</dd>
+ <dt>{{HTMLAttrDef("onload")}}</dt>
+ <dd>Función a llamar cuando se haya terminado de cargar el documento.</dd>
+ <dt>{{HTMLAttrDef("onmessage")}}</dt>
+ <dd>Función para llamar cuando el documento ha recibido un mensaje.</dd>
+ <dt>{{HTMLAttrDef("onoffline")}}</dt>
+ <dd>Función para llamar cuando falla la comunicación de la red.</dd>
+ <dt>{{HTMLAttrDef("ononline")}}</dt>
+ <dd>Función para llamar cuando se restablece la comunicación de la red.</dd>
+ <dt>{{HTMLAttrDef("onpopstate")}}</dt>
+ <dd>Función para llamar cuando el usuario ha navegado el historial de sesiones.</dd>
+ <dt>{{HTMLAttrDef("onredo")}}</dt>
+ <dd>Función para llamar cuando el usuario ha avanzado en el historial de deshacer transacciones.</dd>
+ <dt>{{HTMLAttrDef("onresize")}}</dt>
+ <dd>Función para llamar cuando el documento ha cambiado de tamaño.</dd>
+ <dt>{{HTMLAttrDef("onstorage")}}</dt>
+ <dd>Función para llamar cuando el área de almacenamiento ha cambiado.</dd>
+ <dt>{{HTMLAttrDef("onundo")}}</dt>
+ <dd>Función para llamar cuando el usuario ha retrocedido en el historial de deshacer transacciones.</dd>
+ <dt>{{HTMLAttrDef("onunload")}}</dt>
+ <dd>Función para llamar cuando el documento se vaya.</dd>
+ <dt>{{HTMLAttrDef("rightmargin")}} {{obsolete_inline}}</dt>
+ <dd>El margen de la derecha del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-right")}} en el elemento</em>.</dd>
+ <dt>{{HTMLAttrDef("text")}} {{obsolete_inline}}</dt>
+ <dd>Color de primer plano del texto. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("color")}} en el elemento</em>.</dd>
+ <dt>{{HTMLAttrDef("topmargin")}} {{obsolete_inline}}</dt>
+ <dd>El margen de la parte superior del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-top")}} en el elemento</em>.</dd>
+ <dt>{{HTMLAttrDef("vlink")}} {{obsolete_inline}}</dt>
+ <dd>Color del texto de los enlaces de hipertexto visitados. <em>Este método no es conforme, utiliza la propiedad {{CSSxRef("color")}} de CSS junto con la pseudoclase {{CSSxRef(":visited")}} en su lugar</em>.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html notranslate">&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;Título del documento&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;p&gt;Este es un párrafo&lt;/p&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'semantics.html#the-body-element', '&lt;body&gt;')}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td>Cambió la lista de características no conformes.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'sections.html#the-body-element', '&lt;body&gt;')}}</td>
+   <td>{{ Spec2('HTML5 W3C') }}</td>
+   <td>Los atributos anteriormente obsoletos. Definieron el comportamiento de <code>topmargin</code>, <code>leftmargin</code>, <code>rightmargin</code> y <code>bottommargin</code> no conforme y nunca estandarizado. Se agregaron los atributos <code>on*</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.5.1', '&lt;body&gt;')}}</td>
+   <td>{{ Spec2('HTML4.01') }}</td>
+   <td>En desuso el <code>alink</code>, <code>background</code>, <code>bgcolor</code>, <code>link</code>, <code>text</code> y atributos <code>vlink</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data"> https://github.com/mdn/browser-compat- datos </a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.body")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{HTMLElement("html")}}</li>
+ <li>{{HTMLElement("head")}}</li>
+</ul>
diff --git a/files/es/web/html/element/br/index.html b/files/es/web/html/element/br/index.html
new file mode 100644
index 0000000000..c2e5f11a8a
--- /dev/null
+++ b/files/es/web/html/element/br/index.html
@@ -0,0 +1,158 @@
+---
+title: <br>
+slug: Web/HTML/Element/br
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/br
+original_slug: Web/HTML/Elemento/br
+---
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El elemento HTML<em> l</em><em>ine break </em><code>&lt;br&gt;</code> produce un salto de línea en el texto (retorno de carro). Es útil para escribir un poema o una dirección, donde la división de las líneas es significante.</p>
+
+<p>No utilices <code>&lt;br&gt;</code> para incrementar el espacio entre líneas de texto; para ello utiliza la propiedad {{cssxref('margin')}} de <a href="/en-US/docs/CSS" title="CSS">CSS</a> o el elemento {{HTMLElement("p")}}.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno, es {{Glossary("empty element")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>Debe tener etiqueta de inicio y no debe tener etiqueta de cierre. En documentos XHTML este elemento se escribe como <code>&lt;br /&gt;</code>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLBRElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Attributes" name="Attributes">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a><span style="line-height: 21px;">.</span></p>
+
+<dl>
+ <dt>{{htmlattrdef("clear")}} {{deprecatedGeneric('inline','HTML4.01')}} {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Indica donde empieza la siguiente línea después del salto.
+ <div class="note">
+ <p><strong>Nota de uso: </strong>Este atributo está obsoleot en {{HTMLVersionInline(5)}} y <strong>no debe utilizarse por los autores</strong>. En su lugar utiliza la propiedad {{CSSxref('clear')}} de CSS.</p>
+ </div>
+ </dd>
+</dl>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<pre class="brush: html">Mozilla Foundation&lt;br&gt;
+1981 Landings Drive&lt;br&gt;
+Building K&lt;br&gt;
+Mountain View, CA 94043-0801&lt;br&gt;
+USA
+</pre>
+
+<p>El HTML de arriba muestra:</p>
+
+<p>Mozilla Foundation<br>
+ 1981 Landings Drive<br>
+ Building K<br>
+ Mountain View, CA 94043-0801<br>
+ USA</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('HTML WHATWG', 'text-level-semantics.html#the-br-element', '&lt;br&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-br-element', '&lt;br&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/text.html#h-9.3.2.1', '&lt;br&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>Elemento {{HTMLElement("address")}}</li>
+ <li>Elemento {{HTMLElement("p")}}</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/button/index.html b/files/es/web/html/element/button/index.html
new file mode 100644
index 0000000000..9721ecfff5
--- /dev/null
+++ b/files/es/web/html/element/button/index.html
@@ -0,0 +1,199 @@
+---
+title: button
+slug: Web/HTML/Element/button
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/button
+original_slug: Web/HTML/Elemento/button
+---
+<h2 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h2>
+
+<p><strong>button</strong> = botón.</p>
+
+<p>Es el elemento crea botones marcadores.</p>
+
+<p><span class="seoSummary">La etiqueta de<strong> HTML <code>&lt;button&gt;</code> </strong>representa un elemento cliqueable de tipo botón que puede ser utilizado en formularios o en cualquier parte de la página que necesite un botón estándar y simple de aplicar.</span> De forma predeterminada, los botones HTML se presentan con un estilo similar en todas las plataformas, estos estilos se pueden cambiar utilizando <a href="https://developer.mozilla.org/en-US/docs/Web/CSS">CSS</a>.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;button&gt; y &lt;/button&gt; (ambas obligatorias).</dd>
+ <dd><strong>Crea una caja</strong>: en linea.</dd>
+ <dd><strong>Está definido como</strong>: <a href="/es/docs/HTML/Elemento/Tipos_de_elementos#de_frase" title="HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de control para formulario</a>.</dd>
+ <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="/es/docs/HTML/Elemento/Tipos_de_elementos#en_linea" title="HTML/Elemento/Tipos_de_elementos#en_linea">en Bloque</a> o <a href="/es/docs/HTML/Elemento/Tipos_de_elementos#en_linea" title="HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>, con las siguientes excepciones: (A|%formctrl;|FORM|FIELDSET)</dd>
+</dl>
+
+<h2 id="Atributos" name="Atributos">Atributos</h2>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">name </span></a></td>
+   <td>Asigna un <a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#control-name">nombre de control</a>.</td>
+   <td>Texto <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">con limitaciones</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">value </span></a></td>
+   <td>Asigna un valor inicial que será enviado con el formulario.</td>
+   <td>Texto</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">type </span></a></td>
+   <td>Indica el tipo de botón.</td>
+   <td>Uno de los siguientes: (button|submit|reset)</td>
+   <td><abbr title="Por defecto">PD.</abbr>: submit.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">disabled </span></a></td>
+   <td>Indica que el control está desabilitado.</td>
+   <td>disabled.</td>
+   <td>Lo fija el navegador. disabled.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-accesskey"><span style="color: green;">accesskey </span></a></td>
+   <td>Define una tecla de acceso rápido. Importante para la <a href="/es/docs/Accesibilidad" title="Accesibilidad">Accesibilidad</a>.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-character">carácter</a> o letra.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-tabindex"><span style="color: green;">tabindex </span></a></td>
+   <td>Asigna un número de posición en el orden de tabulación.</td>
+   <td>Un número entre 0 y 32767.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">reserved </span></a></td>
+   <td>Reservado para un uso futuro que nunca tubo. Inútil</td>
+   <td>-</td>
+   <td>-</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;"> onfocus onblur </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h2>
+
+<pre class="brush:html">&lt;button name="button"&gt;Click me&lt;/button&gt;
+</pre>
+
+<h2 id="Soporte" name="Soporte">Sobre Accesibilidad</h2>
+
+<h3 id="Botones_con_íconos">Botones con íconos</h3>
+
+<p>Los botones que solamente utilizan un ícono para representar una funcionalidad no tienen un nombre accesible para los lectores de no-videntes. Para arreglar esto debemos proveer un nombre para el botón que describa la funcionalidad de este.</p>
+
+<h4 id="Ejemplo">Ejemplo</h4>
+
+<pre>&lt;button name="favorito" type="button"&gt;
+  &lt;svg aria-hidden="true" viewBox="0 0 10 10"&gt;&lt;path d="m7.4 8.8-2.4-1.3-2.4 1.3.46-2.7-2-1.9 2.7-.39 1.2-2.5 1.2 2.5 2.7.39-1.9 1.9z"/&gt;&lt;/svg&gt;
+  Agregar a favoritos
+&lt;/button&gt;
+</pre>
+
+<p>Esto también ayudará a los usuarios videntes que no estén familiarizados con el significado del ícono ya que podrán entender su significado pasando el cursor por encima del elemento.</p>
+
+<p>Para más información (en inglés):</p>
+
+<ul>
+ <li><a href="https://developer.paciellogroup.com/blog/2017/04/what-is-an-accessible-name/">What is an accessible name? | The Paciello Group</a></li>
+ <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Robust#Guideline_4.1_—_Compatible_Maximize_compatibility_with_current_and_future_user_agents_including_assistive_technologies">MDN Understanding WCAG, Guideline 4.1 explanations</a></li>
+ <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/ensure-compat-rsv.html">Understanding Success Criterion 4.1.2 | W3C Understanding WCAG 2.0</a></li>
+</ul>
+
+<h3 id="Proximidad">Proximidad</h3>
+
+<p>Si el sitio tiene una gran cantidad de elementos interactivos muy cercanos entre ellos esto puede generar una dificultad en los usuarios con discapacidades motrices. Es ideal que estos elementos tengan una separación para evitar que el usuario cliquee el incorrecto. Puedes utilizar la propiedad <code>margin</code> para separarlos.</p>
+
+<p>Más información (en inglés):</p>
+
+<ul>
+ <li><a href="https://axesslab.com/hand-tremors/">Hand tremors and the giant-button-problem - Axess Lab</a></li>
+</ul>
+
+<h2 id="Soporte" name="Soporte">Soporte</h2>
+
+<div class="hidden">La tabla de compatibilidad se genera automáticamente con datos estructurados. Si te gustaría colaborar puedes encontrar más información por <a href="https://github.com/mdn/browser-compat-data">acá y enviarnos un pull request</a>.</div>
+
+<p>{{Compat("html.elements.button")}}</p>
+
+<h2 id="Referencia" name="Referencia">Referencia</h2>
+
+<ul>
+ <li>El elemento <a href="/es/docs/HTML/Elemento/button" title="HTML/Elemento/button">button</a> en el estándar <a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#h-17.5">HTML 4.01</a></li>
+</ul>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga carencias y defectos. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a href="/es/docs/Project:Como_ayudar" title="Project:Como_ayudar">MDC:Como ayudar</a>.</p>
+</div>
+
+<p> </p>
diff --git a/files/es/web/html/element/canvas/index.html b/files/es/web/html/element/canvas/index.html
new file mode 100644
index 0000000000..d9ebdd3450
--- /dev/null
+++ b/files/es/web/html/element/canvas/index.html
@@ -0,0 +1,89 @@
+---
+title: canvas
+slug: Web/HTML/Element/canvas
+tags:
+  - Canvas
+  - HTML
+  - HTML:Elemento
+  - para_revisar
+translation_of: Web/HTML/Element/canvas
+original_slug: Web/HTML/Elemento/canvas
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento HTML <em>canvas</em> (&lt;canvas&gt;) se puede utilizar para dibujar gráficos a través de secuencias de comandos (por lo general <a href="/../../../../en/JavaScript" rel="internal" title="../../../../en/JavaScript">JavaScript</a> ).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por ejemplo, puede usarse para dibujar gráficos, hacer composiciones de fotos o incluso realizar animaciones.</span></span></p>
+
+<p>
+ </p><p><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las aplicaciones de Mozilla adquirieron la compatibilidad con <code>&lt;canvas&gt;</code> a partir de Gecko 1.8 (es decir, <a href="/../../../../en/Firefox_1.5_for_developers" rel="internal" title="../../../../en/Firefox 1.5 for developers">Firefox 1.5</a> ).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento fue originalmente introducido por Apple en el OS X <a class="external" href="http://www.apple.com/macosx/features/dashboard/" rel="external nofollow" title="http://www.apple.com/macosx/features/dashboard/">Dashboard</a> y Safari.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Internet Explorer, antes de la versión 9.0 beta, no admite de forma nativa <code>&lt;canvas&gt;</code> , pero una página puede de hecho añadir la compatibilidad mediante la inclusión de un script del proyecto <a class="external" href="http://excanvas.sourceforge.net/" rel="external nofollow" title="http://excanvas.sourceforge.net/">Explorer Canvas</a> de Google.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Opera 9 también es compatible con <code>&lt;canvas&gt;</code> .</span></span></p>
+<p></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para más artículos sobre canvas, consulta la <a href="/es/HTML/Canvas" title="es/HTML/Canvas">página del tema canvas</a> .</span></span></p>
+
+<h2 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Transparente, ya sea <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">contenido estático</a> o <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> .</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte contenido dinámico o cualquier otro elemento que acepte contenido estático .</span></span> </td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
+   <td><a class="external" href="http://www.w3.org/TR/html5/the-canvas-element.html#the-canvas-element" title="http://www.w3.org/TR/html5/the-canvas-element.html#the-canvas-element"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.8.10</span></span></a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h2>
+
+<dl>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("width") }}</span></span></dt>
+ <dd> <span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La anchura del espacio de coordenadas en píxeles CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El valor predeterminado es 300.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("height") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La altura del espacio de coordenadas en píxeles CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El valor predeterminado es 150.</span></span></dd>
+</dl>
+
+<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Nota: el tamaño del lienzo mostrado se puede cambiar con una hoja de estilo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La imagen se escala durante la representación para adaptarse al tamaño que se le ha aplicado estilo .</span></span></div>
+
+<h2 id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-99 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h2>
+
+<ul>
+ <li><a href="/en/DOM/HTMLCanvasElement" title="en/DOM/HTMLCanvasElement"><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTMLCanvasElement</span></span></a></li>
+</ul>
+
+<h2 id="Ejemplo"><span class="goog-gtc-unit"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Ejemplo</span></span></h2>
+
+<pre class="brush: html">&lt;<span class="start-tag">canvas</span><span class="attribute-name"> id</span>=<span class="attribute-value">"canvas" </span><span class="attribute-name">width</span>=<span class="attribute-value">"300" </span><span class="attribute-name">height</span>=<span class="attribute-value">"300"</span>&gt;
+  Tu navegador no admite el elemento &amp;<span class="entity">lt;</span>canvas&amp;<span class="entity">gt;</span>.
+&lt;/<span class="end-tag">canvas</span>&gt;
+</pre>
+
+<h2 id="Sobre_Accesibilidad">Sobre Accesibilidad</h2>
+
+<p>El elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas" title="Use the HTML &lt;canvas> element with either the canvas scripting API or the WebGL API to draw graphics and animations."><code>&lt;canvas&gt;</code></a> es simplemente un bitman que no provee ninguna información adicional sobre los elementos que tiene dibujados. El contenido de la etiqueta <code>canvas</code> no se muestra a los lectores de pantalla como otras etiquetas semánticas. Como regla general, deberías evitar utilizar canvas en un sitio accesible.</p>
+
+<p>Para mejorar la accesibilidad de la etiquetas puedes leer los siguientes artículos (en inglés):</p>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility">MDN Hit regions and accessability</a></li>
+ <li><a href="https://www.w3.org/WAI/PF/HTML/wiki/Canvas_Accessibility_Use_Cases">Canvas accessibility use cases</a></li>
+ <li><a href="https://www.w3.org/html/wg/wiki/AddedElementCanvas">Canvas element accessibility issues</a></li>
+ <li><a href="http://www.paciellogroup.com/blog/2012/06/html5-canvas-accessibility-in-firefox-13/">HTML5 Canvas Accessibility in Firefox 13 – by Steve Faulkner</a></li>
+ <li><a href="https://html.spec.whatwg.org/multipage/scripting.html#best-practices">Best practices for interactive canvas elements</a></li>
+</ul>
+
+<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h2>
+
+<ul>
+ <li><a href="/es/HTML/Canvas" title="es/HTML/Canvas"><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Tema sobre canvas</span></span></a></li>
+</ul>
+
+<p> </p>
+
+<p style="margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; text-indent: 0px;"><span style="color: #000000; font-family: 'Ubuntu'; font-size: 9pt;">{{ languages( { "de": "de/HTML/Element/canvas", "en": "en/HTML/Element/canvas", "es": "es/HTML/Elemento/canvas", "ja": "ja/HTML/Element/canvas", "ko": "ko/HTML/Element/canvas", "nl": "nl/HTML/HTML_Tags/canvas", "pl": "pl/HTML/Element/canvas", "ru": "Ru/HTML/Element/canvas", "zh-cn": "cn/HTML/Element/canvas", "fr": "fr/HTML/Element/canvas" } ) }}</span></p>
diff --git a/files/es/web/html/element/caption/index.html b/files/es/web/html/element/caption/index.html
new file mode 100644
index 0000000000..735292dc77
--- /dev/null
+++ b/files/es/web/html/element/caption/index.html
@@ -0,0 +1,168 @@
+---
+title: caption
+slug: Web/HTML/Element/caption
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/caption
+original_slug: Web/HTML/Elemento/caption
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Es el encargado de darle un título descriptivo a las tablas.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;caption&gt;</code> y <code>&lt;/caption&gt;</code> (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: .</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#para_tablas">para tablas</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">align </span></a></td>
+   <td>Indica la alineación en relación a la tabla.</td>
+   <td>Uno de los siguientes: 'top', 'bottom', 'left', 'right'.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Ejemplo_simple" name="Ejemplo_simple">Ejemplo simple</h4>
+
+<p>El siguiente código:</p>
+
+<pre class="eval"><span class="nowiki">
+  &lt;table border='1'&gt;
+   &lt;caption&gt;Tabla con caption&lt;/caption&gt;
+    &lt;tr&gt; &lt;td&gt; tabla de una celda. &lt;/td&gt;  &lt;/tr&gt;
+  &lt;/table&gt;
+ </span>
+</pre>
+
+<p>Se visualiza así:</p>
+
+<div style="border: solid silver 1px;">
+<table>
+ <caption>Tabla con caption</caption>
+ <tbody>
+  <tr>
+   <td>tabla de una celda.</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li>Debe ser el primer hijo del elemento table. una tabla solo puede tener uno.</li>
+</ul>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#h-11.2.2"><strong>caption</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-caption">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/center/index.html b/files/es/web/html/element/center/index.html
new file mode 100644
index 0000000000..b8242f4755
--- /dev/null
+++ b/files/es/web/html/element/center/index.html
@@ -0,0 +1,117 @@
+---
+title: <center> (obsoleto)
+slug: Web/HTML/Element/center
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/center
+original_slug: Web/HTML/Elemento/center
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>{{obsolete_header()}}<br>
+ El elemento obsoleto <a href="es/HTML/Elemento/center">center</a> (centro) crea una caja en bloque con el contenido centrado. En realidad es equivalente a un <a href="es/HTML/Elemento/div">div</a> con <code>align="center"</code></p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;center&gt; y &lt;/center&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">Elemento desaprobado</a>.</dd>
+</dl>
+
+<blockquote>
+<dl>
+ <dt>Actualmente la mejor <a href="https://juanmcastro.es/tutoriales/como-centrar-texto-en-html/">forma de centrar texto no es con html</a>, con css tenemos infinidad de posibilidales para centrar el texto vertical, horizontal, izquierda, dercha, justificado y todo lo que necesitemos.</dt>
+</dl>
+</blockquote>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> y <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td colspan="4">Ver atributos de transición.</td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición (Solo tiene los genéricos)</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>lista de clases separadas por espacios</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, .</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>uno de los siguientes:"ltr" o "rtl"</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre>&lt;center&gt;
+ elemento center
+&lt;/center&gt;
+&lt;div align='center'&gt;
+ elemento div con: align='center'
+&lt;/div&gt;
+</pre>
diff --git a/files/es/web/html/element/cite/index.html b/files/es/web/html/element/cite/index.html
new file mode 100644
index 0000000000..d8b3fbf500
--- /dev/null
+++ b/files/es/web/html/element/cite/index.html
@@ -0,0 +1,148 @@
+---
+title: cite
+slug: Web/HTML/Element/cite
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/cite
+original_slug: Web/HTML/Elemento/cite
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>cite</strong> -<em>cita</em> . Marca una referencia a una fuente, o el autor de un texto citado.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;cite&gt; y &lt;/cite&gt; (ambas obligatorias)</dd>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#defrase">Elemento de frase</a>, y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En línea.</dd>
+ <dd><strong>Puede contener</strong>: Text y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id=".C2.BFQui.C3.A9n_lo_dijo.3F" name=".C2.BFQui.C3.A9n_lo_dijo.3F">¿Quién lo dijo?</h4>
+
+<p>código:</p>
+
+<pre class="eval">&lt;p&gt; &lt;cite&gt;Galileo&lt;/cite&gt; dijo: "... y sin embargo, se mueve." &lt;/p&gt;
+</pre>
+
+<p><br>
+ Resultado:</p>
+
+<div style="border: solid silver 1px; margin-left: 1em;">
+<p><cite>Galileo</cite> dijo: "...y sin embargo, se mueve."</p>
+</div>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<p>En los navegadores basados en Mozilla (y en otros) el contenido de cite es mostrado con un estilo de texto en cursiva.</p>
+
+<pre class="eval">&lt;p&gt; &lt;cite&gt;Galileo&lt;/cite&gt; dijo: "... y sin embargo, se mueve." &lt;/p&gt;
+&lt;p&gt; &lt;span style='font-style: italic;'&gt;Galileo&lt;/span&gt; dijo: "... y sin embargo, se mueve." &lt;/p&gt;
+</pre>
+
+<p> </p>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li>Está bastante estendido el mal uso de este elemento, mucha gente lo usa para marcar el texto de las citas en vez del autor, para marcar el texto están los elementos <a href="es/HTML/Elemento/q">q</a> (en línea) y <a href="es/HTML/Elemento/blockquote">blockquote</a> (en bloque).</li>
+</ul>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>Los elementos de frase <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-CITE">en la especificación</a> de html 4.01</li>
+</ul>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-cite">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/code/index.html b/files/es/web/html/element/code/index.html
new file mode 100644
index 0000000000..db030a1f75
--- /dev/null
+++ b/files/es/web/html/element/code/index.html
@@ -0,0 +1,111 @@
+---
+title: code
+slug: Web/HTML/Element/code
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/code
+original_slug: Web/HTML/Elemento/code
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Es el apropiado para marcar el código de un programa.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;code&gt; y &lt;/code&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">&lt;code&gt;
+<span class="nowiki"> #include main() { for(;;) { printf ("Hello World!\n"); } } </span>
+&lt;/code&gt;
+</pre>
diff --git a/files/es/web/html/element/col/index.html b/files/es/web/html/element/col/index.html
new file mode 100644
index 0000000000..16c80e827d
--- /dev/null
+++ b/files/es/web/html/element/col/index.html
@@ -0,0 +1,178 @@
+---
+title: col
+slug: Web/HTML/Element/col
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/col
+original_slug: Web/HTML/Elemento/col
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Permite especificar propiedades para una columna o un grupo de ellas.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;col&gt;</code> (solo tiene una).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: No.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#para_tablas">para tablas.</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Nada.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
+   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-span-COL"><span style="color: green;">span </span></a></td>
+   <td>Indica el número de columnas afectadas.</td>
+   <td>Un número.</td>
+   <td><abbr title="Por defecto">PD.</abbr>: 1.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-width-COL"><span style="color: green;">width </span></a></td>
+   <td>Indica la anchura de las columnas.</td>
+   <td>Una longitud expresada en píxeles, porcentaje o relativa.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-align-TD"><span style="color: green;">align </span></a></td>
+   <td>Indica la alineación horizontal.</td>
+   <td>Uno de los siguientes: (left|center|right|justify|char).</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-char"><span style="color: green;">char </span></a></td>
+   <td>Carácter que se usará como punto de alineación.</td>
+   <td>Un carácter, Uno de estos: {{ mediawiki.external('ISO10646') }}.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-charoff"><span style="color: green;">charoff </span></a></td>
+   <td>offset del carácter de alineación.</td>
+   <td>Una longitud expresada en píxeles o porcentaje.</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-valign"><span style="color: green;">valign </span></a></td>
+   <td>Indica la alineación vertical de los contenidos de las celdas.</td>
+   <td>Uno de los siguientes: (top|middle|bottom|baseline).</td>
+   <td>Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+   <th>por omisión</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="bla_bla" name="bla_bla">bla bla</h4>
+
+<pre class="eval"><span class="nowiki">
+
+ </span>
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#edef-COL."><strong>col</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-col">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/colgroup/index.html b/files/es/web/html/element/colgroup/index.html
new file mode 100644
index 0000000000..ae97f51db8
--- /dev/null
+++ b/files/es/web/html/element/colgroup/index.html
@@ -0,0 +1,164 @@
+---
+title: colgroup
+slug: Web/HTML/Element/colgroup
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/colgroup
+original_slug: Web/HTML/Elemento/colgroup
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>colgroup</strong> de column group = Grupo de columnas. Permite crear <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#h-11.2.4">grupos de columnas</a>.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;colgroup&gt;</code> y <code>&lt;/colgroup&gt;</code> (la de cierre es opcional).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: No.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#para_tablas">para tablas</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Cero o más elementos <a href="es/HTML/Elemento/col">col</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-span-COLGROUP"><span style="color: green;">span </span></a></td>
+   <td>Indica el número de columnas que se agrupan.</td>
+   <td>Un número entero mayor que cero. Por defecto: 1.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-width-COLGROUP"><span style="color: green;">width </span></a></td>
+   <td>Indica la anchura de las columnas del grupo.</td>
+   <td>Una longitud expresada en píxeles, porcentaje o relativa. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-align-TD"><span style="color: green;">align </span></a></td>
+   <td>Indica la alineación horizontal.</td>
+   <td>Uno de los siguientes: <code>'left' 'center' 'right' 'justify' y 'char'</code>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-char"><span style="color: green;">char </span></a></td>
+   <td>Carácter que se usará como punto de alineación.</td>
+   <td>Un carácter. Por defecto: el carácter de punto decimal (puede variar según el idioma). Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-charoff"><span style="color: green;">charoff </span></a></td>
+   <td>Indica la distancia entre el borde y el carácter de alineación.</td>
+   <td>Una longitud expresada en píxeles o porcentaje. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-valign"><span style="color: green;">valign </span></a></td>
+   <td>Indica la alineación vertical de los contenidos de las celdas.</td>
+   <td>Uno de los siguientes: <code>'top' 'middle' 'bottom' y 'baseline'</code>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="bla_bla" name="bla_bla">bla bla</h4>
+
+<pre class="eval"><span class="nowiki">
+
+ </span>
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#edef-COLGROUP."><strong>colgroup</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-colgroup">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/content/index.html b/files/es/web/html/element/content/index.html
new file mode 100644
index 0000000000..f71ce88184
--- /dev/null
+++ b/files/es/web/html/element/content/index.html
@@ -0,0 +1,168 @@
+---
+title: <content>
+slug: Web/HTML/Element/content
+tags:
+  - Deprecado
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+  - Web Components
+translation_of: Web/HTML/Element/content
+original_slug: Web/HTML/Elemento/content
+---
+<p>{{Deprecated_header}}</p>
+
+<p>El elemento <a href="/en-US/docs/Web/HTML">HTML</a> <code>&lt;content&gt; es usado dentro de un </code> <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">Shadow DOM</a> como un {{glossary("insertion point")}} . No está pensado para ser usado en HTML ordinario . Es usado con <a href="/en-US/docs/Web/Web_Components">Web Components</a>.</p>
+
+<div class="note">
+<p><strong>Nota: </strong>Aunque está presente en un draft inicial de las especificaciones e implementado en varios exploradores , este elemento ha sido removido en versiones posteriores a la especificación .</p>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido" title="HTML/Content_categories">Categorías de contenido</a></th>
+   <td>Modelo de contenido transpatente</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Contenido dinámico</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Any element that accepts flow content.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfase DOM</th>
+   <td>{{domxref("HTMLContentElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Attributes" name="Attributes">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales </a>.</p>
+
+<dl>
+ <dt>select</dt>
+ <dd>Una lista de selectores separada por comas . Estos tienen la misma sintaxis que los selectores de CSS . Seleccionan el contenido a insertar en lugar del elemento &lt;content&gt; .</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Aquí hay un ejemplo simple del uso del elemento &lt;content&gt; . Es un archivo HTML con todo lo necesario en el .</p>
+
+<div class="note">
+<p><strong>Nota: </strong>Para que este código funcione , el explorador en el que se muestre debe de soportar Web Components . Ver <a href="/en-US/docs/Web/Web_Components#Enabling_Web_Components_in_Firefox">Enabling Web Components in Firefox</a> .</p>
+</div>
+
+<pre class="brush: html">&lt;html&gt;
+  &lt;head&gt;&lt;/head&gt;
+  &lt;body&gt;
+  &lt;!-- The original content accessed by &lt;content&gt; --&gt;
+  &lt;div&gt;
+    &lt;h4&gt;My Content Heading&lt;/h4&gt;
+    &lt;p&gt;My content text&lt;/p&gt;
+  &lt;/div&gt;
+
+  &lt;script&gt;
+  // Get the &lt;div&gt; above.
+  var myContent = document.querySelector('div');
+  // Create a shadow DOM on the &lt;div&gt;
+  var shadowroot = myContent.createShadowRoot();
+  // Insert into the shadow DOM a new heading and
+  // part of the original content: the &lt;p&gt; tag.
+  shadowroot.innerHTML =
+   '&lt;h2&gt;Inserted Heading&lt;/h2&gt; &lt;content select="p"&gt;&lt;/content&gt;';
+  &lt;/script&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>Si muestras esto en un explorador web , debe de verse como lo siguiente .</p>
+
+<p><img alt="content example" src="https://mdn.mozillademos.org/files/10077/content-example.png" style="height: 383px; width: 716px;"></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="spec-table standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Shadow DOM', "#the-content-element", "content")}}</td>
+   <td>{{Spec2('Shadow DOM')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con exploradores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>35</td>
+   <td><span style="font-size: 12px; line-height: 18px;">{{CompatGeckoDesktop("28")}}</span> [1]</td>
+   <td>{{CompatNo}}</td>
+   <td>26</td>
+   <td><span style="font-size: 12px; line-height: 18px;">{{CompatNo}}</span></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Catacterística</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico </td>
+   <td>37</td>
+   <td>{{CompatGeckoMobile("28")}} [1]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Si el Shadow DOM no está habilidado en Firefox , los elementos de &lt;content&gt; se comportarán como  {{domxref("HTMLUnknownElement")}} . Shadow DOM fue implementado por primera vez en Firefox33 y está detras de una preferencia , <code>dom.webcomponents.enabled</code>, el cual está deshabilitado por default .</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Web_Components">Web Components</a></li>
+ <li>{{HTMLElement("shadow")}}, {{HTMLElement("template")}}, {{HTMLElement("element")}}</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/data/index.html b/files/es/web/html/element/data/index.html
new file mode 100644
index 0000000000..5e809ae9de
--- /dev/null
+++ b/files/es/web/html/element/data/index.html
@@ -0,0 +1,142 @@
+---
+title: <data>
+slug: Web/HTML/Element/data
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/data
+original_slug: Web/HTML/Elemento/data
+---
+<h2 id="Resúmen">Resúmen</h2>
+
+<p>El <strong>Elemento HTML <code>&lt;data&gt;</code></strong> vincula un contenido dado con una traducción legible por una máquina. Si el contenido está relacionado con <code>time-</code> o <code>date-</code>, debe usarse el elemento {{HTMLElement("time")}}.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Categorías de contenido</a></th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, palpable content.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">Phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos permitidos</th>
+   <td>Any element that accepts <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">interfaz DOM</th>
+   <td>{{domxref("HTMLDataElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento incluye </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">Atributos globales </a></p>
+
+<dl>
+ <dt>{{htmlattrdef("value")}}</dt>
+ <dd>This attribute specifies the machine-readable translation of the content of the element.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>El siguiente ejemplo muestra nombres de productos pero también asocia a cada uno con su código UPC.</p>
+
+<pre class="brush: html">&lt;p&gt;New Products&lt;/p&gt;
+&lt;ul&gt;
+ &lt;li&gt;&lt;data value="3967381398"&gt;Mini Ketchup&lt;/data&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;data value="3967381399"&gt;Jumbo Ketchup&lt;/data&gt;&lt;/li&gt;
+ &lt;li&gt;&lt;data value="3967381400"&gt;Mega Jumbo Ketchup&lt;/data&gt;&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-data-element', '&lt;data&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change from {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-data-element', '&lt;data&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("22.0")}} {{bug("839371")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>The HTML {{HTMLElement("time")}} element.</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/datalist/index.html b/files/es/web/html/element/datalist/index.html
new file mode 100644
index 0000000000..82c4bf58b6
--- /dev/null
+++ b/files/es/web/html/element/datalist/index.html
@@ -0,0 +1,107 @@
+---
+title: datalist
+slug: Web/HTML/Element/datalist
+tags:
+  - HTML5
+  - datalist
+translation_of: Web/HTML/Element/datalist
+original_slug: Web/HTML/Elemento/datalist
+---
+<p>El <strong>elemento HTML <code>&lt;datalist&gt;</code> </strong>contiene un conjunto de elementos {{HTMLElement("option")}} que representan los valores disponibles para otros controles.</p>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, copia https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Contenido de las categorías</a></th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>O bien <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a> o, cero o más elementos {{HTMLElement("option")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>Ninguno</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLDataListElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento no tiene otros atributos mas que los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a>, comunes a todos los elementos.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;label&gt;Choose a browser from this list:
+&lt;input list="browsers" name="myBrowser" /&gt;&lt;/label&gt;
+&lt;datalist id="browsers"&gt;
+  &lt;option value="Chrome"&gt;
+  &lt;option value="Firefox"&gt;
+  &lt;option value="Internet Explorer"&gt;
+  &lt;option value="Opera"&gt;
+  &lt;option value="Safari"&gt;
+  &lt;option value="Microsoft Edge"&gt;
+&lt;/datalist&gt;
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{EmbedLiveSample("Examples")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'forms.html#the-datalist-element', '&lt;datalist&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-datalist-element', '&lt;datalist&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadoresEdit">Compatibilidad con los distintos navegadores<a class="button section-edit only-icon" href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/option$edit#Compatibilidad_con_los_distintos_navegadores" rel="nofollow, noindex"><span>Edit</span></a></h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, visite https://github.com/mdn/browser-compat-data y envíenos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.datalist")}}</p>
+
+<h2 id="sección_de_relleno">sección de relleno</h2>
+
+<p>Incluya este polyfill para proporcionar soporte para navegadores antiguos y actualmente incompatibles:<br>
+ <a href="https://github.com/mfranzke/datalist-polyfill">datalist-polyfill</a></p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li class="last">El elemento {{HTMLElement("input")}}, y más especificamente este atributo {{htmlattrxref("list", "input")}};</li>
+ <li class="last">El elemento {{HTMLElement("option")}}.</li>
+</ul>
+
+<p class="last">{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/dd/index.html b/files/es/web/html/element/dd/index.html
new file mode 100644
index 0000000000..d995d99bb3
--- /dev/null
+++ b/files/es/web/html/element/dd/index.html
@@ -0,0 +1,112 @@
+---
+title: dd
+slug: Web/HTML/Element/dd
+tags:
+  - Contenido agrupado HTML
+  - Definición
+  - Detalles
+  - Detalles de descripción
+  - Elemento
+  - HTML
+  - Lista de descripciones
+  - Referencia
+  - Web
+  - dd
+translation_of: Web/HTML/Element/dd
+original_slug: Web/HTML/Elemento/dd
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">El <strong>elemento HTML <code>&lt;dd&gt;</code> </strong>provee detalles acerca de o la definición de un término precedente ({{HTMLElement("dt")}}) en una lista de descripciones ({{HTMLElement("dl")}}).</span></p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/dd.html", "tabbed-standard")}}</div>
+
+<p class="hidden">La fuente para este ejemplo interactivo esta almacenado en un repositorio GitHub. Si desea contribuir al poryecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíe una petición de extracción (pull request).</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td>Ninguna</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido de flujo</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de Tag</th>
+   <td>El tag inicial es requerido. El tag final puede ser omitido si el elemento {{HTMLElement("dd")}} se encuentra inmediatamente seguido por otro elemento <code>&lt;dd&gt;</code>, o si no hay más contenido en el elemento padre.</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>{{HTMLElement("dl")}} o (en <a href="/es/docs/Glossary/WHATWG">WHATWG</a> HTML) un {{HTMLElement("div")}} que se encuentra dentro de un {{HTMLElement("dl")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Hermano previo</th>
+   <td>{{HTMLElement("dt")}} u otro elemento {{HTMLElement("dd")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>Ninguno</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Los atributos de este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("nowrap")}} {{Non-standard_inline}}</dt>
+ <dd>Si el valor de este atributo es definido como <code>yes</code>, el texto de la definición no se encapsulará. El valor por defecto es <code>no</code>.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Para un ejemplo, ver <a href="/es/docs/Web/HTML/Elemento/dl#Examples">ejemplos &lt;dl&gt;</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-dd-element', '&lt;dd&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-dd-element', '&lt;dd&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/lists.html#h-10.3', '&lt;dd&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página es generada desde datos estructurados. Si desea contribuir, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíe una solicitud de extracción (pull request).</div>
+
+<p>{{Compat("html.elements.dd")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{HTMLELement("dl")}}</li>
+ <li>{{HTMLElement("dt")}}</li>
+</ul>
diff --git a/files/es/web/html/element/del/index.html b/files/es/web/html/element/del/index.html
new file mode 100644
index 0000000000..efd05f57e1
--- /dev/null
+++ b/files/es/web/html/element/del/index.html
@@ -0,0 +1,156 @@
+---
+title: del
+slug: Web/HTML/Element/del
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/del
+original_slug: Web/HTML/Elemento/del
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <code style="color: darkblue;">del</code> (deleted-borrado) marca las partes de un texto o documento que han sido suprimidas o sustituidas.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;del&gt; y &lt;/del&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: a veces <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a> a veces <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>:</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: depende, si actua como un elemento en bloque puede contener elementos en bloque y en linea. Pero si actua como un elemento en linea solo podrá contener elementos en linea.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">cite</code></td>
+   <td>URI</td>
+   <td>implícito</td>
+   <td>información sobre el cambio</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">datetime</code></td>
+   <td>fecha</td>
+   <td>implícito</td>
+   <td>fecha y hora del cambio</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene, o dicho de otra manera, tiene los mismos que en el doctype estricto</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre> Ejemplo de ins en linea:
+
+   &lt;p&gt;
+       El agua es insípida &lt;del&gt;y húmeda.&lt;/del&gt; &lt;ins&gt;inodora e incolora.&lt;/ins&gt;
+   &lt;/p&gt;
+
+ Ejemplo de ins en bloque:
+
+   &lt;p&gt;
+       El agua es insípida.
+   &lt;/p&gt;
+
+ &lt;del&gt;
+   &lt;p&gt;
+       y húmeda.
+   &lt;/p&gt;
+ &lt;/del&gt;
+</pre>
+
+<p><br>
+ Se visualiza así:</p>
+
+<div class="highlight">
+<p>Ejemplo de ins en linea:</p>
+
+<p>El agua es insípida</p>
+<del>y húmeda.</del> <ins>inodora e incolora.</ins>
+
+<p>Ejemplo de ins en bloque:</p>
+
+<p>El agua es insípida.</p>
+
+<p> </p>
+
+<p> </p>
+<del>y húmeda. </del></div>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p>El elemento <a href="es/HTML/Elemento/del">del</a> del tiene un opuesto, el elemento <a href="es/HTML/Elemento/ins">ins</a>. <a href="es/HTML/Elemento/del">del</a>, marca las partes descartadas e <a href="es/HTML/Elemento/ins">ins</a> las insertadas.</p>
diff --git a/files/es/web/html/element/details/index.html b/files/es/web/html/element/details/index.html
new file mode 100644
index 0000000000..93d5990926
--- /dev/null
+++ b/files/es/web/html/element/details/index.html
@@ -0,0 +1,153 @@
+---
+title: <details>
+slug: Web/HTML/Element/details
+tags:
+  - Elemento
+  - Elementos HTML interactivos
+  - HTML
+  - HTML5
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/details
+original_slug: Web/HTML/Elemento/details
+---
+<p>{{ SeeCompatTable() }}</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento HTML Details<strong> &lt;details&gt; </strong>es usado como un widget de revelación a través del cual el usuario puede obtener información adicional .</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Contenido dinámico</a> , contenido de seccionamiento, contenido interactivo, contenido palpable .</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Un elemento  {{HTMLElement("summary")}}  seguido de <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">contenido dinámico</a> </td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padres permitidos</th>
+   <td>Cualquier elemento que acepte  <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">contenido dinámico</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLDetailsElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</p>
+
+<dl>
+ <dt>{{htmlattrdef("open")}}</dt>
+ <dd>Este atributo Booleano indica si los detalles serán mostrados al usuario cuando la página se cargue . Por default el valor es <code>false </code>y por lo tanto los detalles estarán ocultos.</dd>
+ <dd></dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html">&lt;details&gt;
+  &lt;summary&gt;Some details&lt;/summary&gt;
+  &lt;p&gt;More info about the details.&lt;/p&gt;
+&lt;/details&gt;
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{EmbedLiveSample("Example")}}</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Si el el ejemplo de arriba no funciona , ver {{anch("Compatibilidad con navegadores")}}  para determinar si el navegador soporta esta característica .</p>
+</div>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'interactive-elements.html#the-details-element', '&lt;details&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'semantics.html#the-details-element', '&lt;details&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>12</td>
+   <td>{{CompatNo}} {{bug(591737)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>15</td>
+   <td>6</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4.0</td>
+   <td>{{CompatNo}} {{bug(591737)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"></h2>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{HTMLElement("summary")}}</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/dfn/index.html b/files/es/web/html/element/dfn/index.html
new file mode 100644
index 0000000000..e4ed1c57d6
--- /dev/null
+++ b/files/es/web/html/element/dfn/index.html
@@ -0,0 +1,113 @@
+---
+title: dfn
+slug: Web/HTML/Element/dfn
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/dfn
+original_slug: Web/HTML/Elemento/dfn
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Sirve para marcar el término que se quiere definir.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;dfn&gt; y &lt;/dfn&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">&lt;p&gt;
+     El &lt;dfn&gt;HTML&lt;/dfn&gt; es un lenguaje de marcado para hipertextos.
+&lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/element/dialog/index.html b/files/es/web/html/element/dialog/index.html
new file mode 100644
index 0000000000..dcedb596ff
--- /dev/null
+++ b/files/es/web/html/element/dialog/index.html
@@ -0,0 +1,153 @@
+---
+title: <dialog>
+slug: Web/HTML/Element/dialog
+translation_of: Web/HTML/Element/dialog
+original_slug: Web/HTML/Elemento/dialog
+---
+<div>{{HTMLRef}}</div>
+
+<p>El <strong>elemento</strong> <strong>HTML <code>&lt;dialog&gt;</code> </strong>representa una caja de diálogo u otro componente interactivo, como inspector o ventana.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/Web/HTML/Sections_and_Outlines_of_an_HTML5_document#Sectioning_roots">sectioning root</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted content</th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Tag omission</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted parent elements</th>
+   <td>Any element that accepts <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a></td>
+  </tr>
+  <tr>
+   <th scope="row">DOM interface</th>
+   <td>{{domxref("HTMLDialogElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>. El atributo <code>tabindex</code> no debe utilizarse en el elemento <code>&lt;dialog&gt;</code>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("open")}}</dt>
+ <dd>Indica que el diálogo está activo y disponible para interactuar. Cuando el atributo open no está asignado, no debe mostrarse al usuario.</dd>
+</dl>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<p> </p>
+
+<ul>
+ <li>Los elementos <code>&lt;form&gt;</code> pueden integrarse dentro de un diálogo  especificándolos con el atributo <code>method="dialog"</code>. Cuando se envía un formulario, el diálogo se cierra con un atributo {{domxref("HTMLDialogElement.returnValue", "returnValue")}} asignado con el <code>value</code> del botón utilizado.</li>
+ <li>El pseudo-elemento {{cssxref('::backdrop')}} de CSS puede utilizarse para dar estilos al elemento <code>&lt;dialog&gt;</code>, por ejemplo para atenuar contenido inaccesible mientras el diálogo modal esté activo.</li>
+</ul>
+
+<p> </p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_1">Ejemplo 1</h3>
+
+<pre class="brush: html">&lt;dialog open&gt;
+  &lt;p&gt;Greetings, one and all!&lt;/p&gt;
+&lt;/dialog&gt;
+</pre>
+
+<h3 id="Ejemplo_2">Ejemplo 2</h3>
+
+<pre class="brush: html">&lt;!-- Simple pop-up dialog box, containing a form --&gt;
+&lt;dialog id="favDialog"&gt;
+  &lt;form method="dialog"&gt;
+    &lt;section&gt;
+      &lt;p&gt;&lt;label for="favAnimal"&gt;Favorite animal:&lt;/label&gt;
+      &lt;select id="favAnimal"&gt;
+        &lt;option&gt;&lt;/option&gt;
+        &lt;option&gt;Brine shrimp&lt;/option&gt;
+        &lt;option&gt;Red panda&lt;/option&gt;
+        &lt;option&gt;Spider monkey&lt;/option&gt;
+      &lt;/select&gt;&lt;/p&gt;
+    &lt;/section&gt;
+    &lt;menu&gt;
+      &lt;button id="cancel" type="reset"&gt;Cancel&lt;/button&gt;
+      &lt;button type="submit"&gt;Confirm&lt;/button&gt;
+    &lt;/menu&gt;
+  &lt;/form&gt;
+&lt;/dialog&gt;
+
+&lt;menu&gt;
+  &lt;button id="updateDetails"&gt;Update details&lt;/button&gt;
+&lt;/menu&gt;
+
+&lt;script&gt;
+  (function() {
+    var updateButton = document.getElementById('updateDetails');
+    var cancelButton = document.getElementById('cancel');
+    var favDialog = document.getElementById('favDialog');
+
+    // Update button opens a modal dialog
+    updateButton.addEventListener('click', function() {
+      favDialog.showModal();
+    });
+
+    // Form cancel button closes the dialog box
+    cancelButton.addEventListener('click', function() {
+      favDialog.close();
+    });
+
+  })();
+&lt;/script&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'forms.html#the-dialog-element', '&lt;dialog&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'semantics.html#the-dialog-element', '&lt;dialog&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p> </p>
+
+<div class="hidden">
+<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+</div>
+
+<p>{{Compat("html.elements.dialog")}}</p>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Guide/HTML/Forms">Formularios HTML</a>.</li>
+ <li>El evento {{event("close")}}</li>
+ <li>El evento {{event("cancel")}}</li>
+ <li>El pseudo-elemento {{cssxref("::backdrop")}}</li>
+</ul>
diff --git a/files/es/web/html/element/dir/index.html b/files/es/web/html/element/dir/index.html
new file mode 100644
index 0000000000..66e0c6f769
--- /dev/null
+++ b/files/es/web/html/element/dir/index.html
@@ -0,0 +1,122 @@
+---
+title: dir
+slug: Web/HTML/Element/dir
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/dir
+original_slug: Web/HTML/Elemento/dir
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <code style="color: darkblue;">dir</code> (directorio) es un elemento desaprobado. En su origen fue pensado para crear directorios en multicolumna, en la actualidad es inutil.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;dir&gt; y &lt;/dir&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">Elemento DESAPROBADO</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
+ <dd><strong>NO puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">Elementos en bloque</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">compact</code></td>
+   <td>compact</td>
+   <td>implícito</td>
+   <td>espacio entre objetos reducido</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre class="eval"> &lt;dir&gt;
+  &lt;li&gt;primer elemento &lt;/li&gt;
+  &lt;li&gt;segundo elemento &lt;/li&gt;
+  &lt;li&gt;tercer elemento &lt;/li&gt;
+ &lt;/dir&gt;
+</pre>
+
+<div class="highlight">
+<p>Se visualiza así:</p>
+
+<ul>
+ <li>primer elemento</li>
+ <li>segundo elemento</li>
+ <li>tercer elemento</li>
+</ul>
+</div>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/element/div/index.html b/files/es/web/html/element/div/index.html
new file mode 100644
index 0000000000..46c0c4f50f
--- /dev/null
+++ b/files/es/web/html/element/div/index.html
@@ -0,0 +1,153 @@
+---
+title: div
+slug: Web/HTML/Element/div
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/div
+original_slug: Web/HTML/Elemento/div
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>div</strong> de "division" -<em>división</em> . Sirve para crear secciones o agrupar contenidos.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;div&gt;</code> y <code>&lt;/div&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: <a href="https://developer.mozilla.org/es/docs/Web/HTML/Block-level_elements">Elemento en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En bloque.</dd>
+ <dd><strong>Puede contener</strong>: Texto, y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a> o <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en linea</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events">Eventos:</a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">datasrc </code></td>
+   <td>Enlaza a una fuente de datos externa (individual o tabular). Reservado para posibles usos futuros.</td>
+   <td>Una dirección URI. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">datafld </code></td>
+   <td>El nombre de una propiedad o columna de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
+   <td>Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dataformatas </code></td>
+   <td>Indica como deben ser tratados los datos obtenidos de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
+   <td>Uno de los siguientes: <code>'paintext'</code> o <code>'html</code>'. Por defecto: <code>'plaintext'</code></td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">align </code></td>
+   <td>Alineación del texto.</td>
+   <td>Uno de los siguientes: <code>"left", "center", "right",</code> o "justify". Por defecto: <code>'left'</code>, lo fija el navegador</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Div_y_span" name="Div_y_span">Div y span</h4>
+
+<p>código:</p>
+
+<pre class="eval">&lt;<strong>div</strong> style="color: blue;"&gt;
+ &lt;h2&gt; Ejemplo de div y span &lt;/h2&gt;
+  &lt;p&gt;
+    Esto es un párrafo dentro de un div,
+    &lt;span style="color: red;"&gt; y esto un span dentro de un párrafo.&lt;/span&gt;
+  &lt;/p&gt;
+&lt;/<strong>div</strong>&gt;
+</pre>
+
+<p><span class="comment">el wiki causa interferencias Resultado: &lt;div style='border: solid silver 1px;'&gt; &lt;div style="color: blue;"&gt; &lt;h2&gt; Ejemplo de div y span &lt;/h2&gt; &lt;p&gt; Esto es un párrafo dentro de un div, &lt;span style="color: red;"&gt; y esto un span dentro de un párrafo.&lt;/span&gt; &lt;/p&gt; &lt;/div&gt; &lt;/div&gt;</span></p>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#edef-DIV"><strong>div</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-div">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/dl/index.html b/files/es/web/html/element/dl/index.html
new file mode 100644
index 0000000000..200a12f31d
--- /dev/null
+++ b/files/es/web/html/element/dl/index.html
@@ -0,0 +1,220 @@
+---
+title: dl
+slug: Web/HTML/Element/dl
+tags:
+  - Agrupando contenido HTML
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/dl
+original_slug: Web/HTML/Elemento/dl
+---
+<div>{{HTMLRef}}</div>
+
+<p>El elemento <strong>HTML <code>&lt;dl&gt;</code>  </strong>representa una lista descriptiva. El elemento encierra una lista de grupos de términos (especificados con el uso del elemento {{HTMLElement("dt")}}) y de descripciones (proveídas con elementos {{HTMLElement("dd")}}). Algunos usos comunes para este elemento son implementar un glosario o para desplegar metadatos (lista de pares llave-valor).</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/dl.html", "tabbed-standard")}}</div>
+
+<p class="hidden">El contenido para este ejemplo interactivo se encuentra almacenado en un repositorio GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envía la petición de extración (pull request).</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido de flujo</a>, y si los elementos hijos de <code>&lt;dl&gt;</code> incluyen un grupo nombre-valor, contenido palpable.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>
+    <p>Ya sea: Cero o más grupos cada uno consistiendo en uno o más elementos {{HTMLElement("dt")}} seguidos por uno o más elementos {{HTMLElement("dd")}}, opcionalmente intercalados con elementos {{HTMLElement("script")}} y elementos {{HTMLElement("template")}}.<br>
+     O: Uno o más elementos {{HTMLElement("div")}}, opcionalmente entremezclados con elementos {{HTMLElement("script")}} y elementos {{HTMLElement("template")}}.</p>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de Tag</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido de flujo</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>{{ARIARole("group")}}, {{ARIARole("presentation")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLDListElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Los atributos de este elemento incluyen los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Término_sencillo_y_descripción">Término sencillo y descripción</h3>
+
+<pre class="brush: html notranslate">&lt;dl&gt;
+  &lt;dt&gt;Firefox&lt;/dt&gt;
+  &lt;dd&gt;
+    A free, open source, cross-platform,
+    graphical web browser developed by the
+    Mozilla Corporation and hundreds of
+    volunteers.
+  &lt;/dd&gt;
+
+  &lt;!-- Other terms and descriptions --&gt;
+&lt;/dl&gt;
+</pre>
+
+<p>Salida:</p>
+
+<p><img alt="Image:HTML-dl1.png" src="/@api/deki/files/241/=HTML-dl1.png"></p>
+
+<h3 id="Múltiples_términos_descripción_sencilla">Múltiples términos, descripción sencilla</h3>
+
+<pre class="brush: html notranslate">&lt;dl&gt;
+  &lt;dt&gt;Firefox&lt;/dt&gt;
+  &lt;dt&gt;Mozilla Firefox&lt;/dt&gt;
+  &lt;dt&gt;Fx&lt;/dt&gt;
+  &lt;dd&gt;
+    A free, open source, cross-platform,
+    graphical web browser developed by the
+    Mozilla Corporation and hundreds of
+    volunteers.
+  &lt;/dd&gt;
+
+  &lt;!-- Other terms and descriptions --&gt;
+&lt;/dl&gt;
+</pre>
+
+<p>Salida:</p>
+
+<p><img alt="Image:HTML-dl2.png" src="/@api/deki/files/242/=HTML-dl2.png"></p>
+
+<h3 id="Término_sencillo_múltiples_descripciones">Término sencillo, múltiples descripciones</h3>
+
+<pre class="brush: html notranslate">&lt;dl&gt;
+  &lt;dt&gt;Firefox&lt;/dt&gt;
+  &lt;dd&gt;
+    A free, open source, cross-platform,
+    graphical web browser developed by the
+    Mozilla Corporation and hundreds of
+    volunteers.
+  &lt;/dd&gt;
+  &lt;dd&gt;
+    The Red Panda also known as the Lesser
+    Panda, Wah, Bear Cat or Firefox, is a
+    mostly herbivorous mammal, slightly larger
+    than a domestic cat (60 cm long).
+  &lt;/dd&gt;
+
+  &lt;!-- Other terms and descriptions --&gt;
+&lt;/dl&gt;
+</pre>
+
+<p>Output:</p>
+
+<p><img alt="Image:HTML-dl3.png" src="/@api/deki/files/243/=HTML-dl3.png"></p>
+
+<h3 id="Múltiples_términos_y_descripciones">Múltiples términos y descripciones</h3>
+
+<p>También es posible definir múltiples términos con múltiples descripciones correspondientes, combinando los ejemplos de arriba.</p>
+
+<h3 id="Metadatos">Metadatos</h3>
+
+<p>Las listas descriptivas son útiles para desplegar metadatos como una lista de pares llave-valor.</p>
+
+<pre class="brush: html notranslate">&lt;dl&gt;
+  &lt;dt&gt;Name&lt;/dt&gt;
+  &lt;dd&gt;Godzilla&lt;/dd&gt;
+  &lt;dt&gt;Born&lt;/dt&gt;
+  &lt;dd&gt;1952&lt;/dd&gt;
+  &lt;dt&gt;Birthplace&lt;/dt&gt;
+  &lt;dd&gt;Japan&lt;/dd&gt;
+  &lt;dt&gt;Color&lt;/dt&gt;
+  &lt;dd&gt;Green&lt;/dd&gt;
+&lt;/dl&gt;
+</pre>
+
+<p>Tip: Puede ser útil definir un separador llave-valor en el CSS, como:</p>
+
+<pre class="brush: css notranslate">dt::after {
+  content: ": ";
+}</pre>
+
+<h3 id="Encapsulado_de_grupos_nombre-valor_en_elementos_HTMLElementdiv">Encapsulado de grupos nombre-valor en elementos {{HTMLElement("div")}}</h3>
+
+<p><a href="/es/docs/Glossary/WHATWG">WHATWG</a> HTML permite encapsular cada grupo nombre-valor de un elemento {{HTMLElement("dl")}} en un elemento {{HTMLElement("div")}}. Esto puede ser útil cuando se utilizan <a href="/es/docs/Web/HTML/Microdata">microdatos</a>, o cuando <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> apliquen a todo el grupo, o por motivos de estilo.</p>
+
+<pre class="brush: html notranslate">&lt;dl&gt;
+  &lt;div&gt;
+    &lt;dt&gt;Name&lt;/dt&gt;
+    &lt;dd&gt;Godzilla&lt;/dd&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;dt&gt;Born&lt;/dt&gt;
+    &lt;dd&gt;1952&lt;/dd&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;dt&gt;Birthplace&lt;/dt&gt;
+    &lt;dd&gt;Japan&lt;/dd&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;dt&gt;Color&lt;/dt&gt;
+    &lt;dd&gt;Green&lt;/dd&gt;
+  &lt;/div&gt;
+&lt;/dl&gt;
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>No use este elemento (ni elementos {{HTMLElement("ul")}}) solo para crear sangría en una página. Si bien funciona, es una mala práctica y obscurece el signinifcado de las listas descriptivas.</p>
+
+<p>Para cambiar la indentación de un término, usa la propiedad {{cssxref("margin")}} de <a href="/es/docs/Web/CSS">CSS</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-dl-element', '&lt;dl&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-dl-element', '&lt;dl&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/lists.html#h-10.3', '&lt;dl&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_Web">Compatibilidad Web</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada con datos estructurados. Si desea contribuir a la información, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envie una petición de extración (pull request).</div>
+
+<p>{{Compat("html.elements.dl")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{HTMLElement("dt")}} element</li>
+ <li>{{HTMLElement("dd")}} element</li>
+</ul>
diff --git a/files/es/web/html/element/dt/index.html b/files/es/web/html/element/dt/index.html
new file mode 100644
index 0000000000..54fc0c86f1
--- /dev/null
+++ b/files/es/web/html/element/dt/index.html
@@ -0,0 +1,104 @@
+---
+title: dt
+slug: Web/HTML/Element/dt
+tags:
+  - Contenido agrupado HTML
+  - Definición
+  - Elemento
+  - HTML
+  - Lista de definiciones
+  - Referencia
+  - Término
+  - Término de definición
+  - dt
+  - listas
+translation_of: Web/HTML/Element/dt
+original_slug: Web/HTML/Elemento/dt
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">El  <strong>elemento HTML <code>&lt;dt&gt;</code> </strong>especifica un término en una descripción o lista de definiciones, y como tal debe utilizarse dentro de un elemento {{HTMLElement("dl")}}</span> Es usualmente seguido por un elemento {{HTMLElement("dd")}}; sin embargo, múltiples elementos <code>&lt;dt&gt;</code>  en un renglón indican diferentes términos los cuales todos son definidos por el siguiente elemento {{HTMLElement("dd")}}.</p>
+
+<p>El subsecuente elemento {{HTMLElement("dd")}} (<strong>Detalles de la descripción</strong>) provee la definición u otro texto relacionado asociado con el término especificado utilizando <code>&lt;dt&gt;</code>.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/dt.html", "tabbed-standard")}}</div>
+
+<p class="hidden">La fuente para este ejemplo interactivo se encuetra almacenado en un repositorio GitHub. Si desea contribuir al proyecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a>y envíe una petición de extración (pull request).</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td>Ninguno.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido de flujo</a>, pero sin {{HTMLElement("header")}}, {{HTMLElement("footer")}}, contenido seccionado o encabezados descendientes de contenido.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de Tag</th>
+   <td>Debe tener un tag inicial. El tag final puede ser omitido si este elemento es seguido inmediatamente después por otro elemento <code>&lt;dd&gt;</code>,  o si no hay más contenido en el elemento padre.</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>Antes de un elemento {{HTMLElement("dt")}} o elemento {{HTMLElement("dd")}}, dentro de un {{HTMLElement("dl")}} o (en <a href="/es/docs/Glossary/WHATWG">WHATWG</a> HTML) un {{HTMLElement("div")}} que esta dentro de un {{HTMLElement("dl")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>Ninguno</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}} Up to Gecko 1.9.2 (Firefox 4) inclusive, Firefox implements the <a href="/es/docs/DOM/span"><code>HTMLSpanElement</code></a> interface for this element.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento solo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Para ver un ejemplo, vea el <a href="/es/docs/Web/HTML/Elemento/dl#Examples">proveído por el elemento <code>&lt;dl&gt;</code></a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-dt-element', '&lt;dt&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-dt-element', '&lt;dt&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/lists.html#h-10.3', '&lt;dt&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatiblidad es esta página es generada desde estructuras de datos. Si desea contribuir a la información, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíe su petición de extracción (pull request).</div>
+
+<p>{{Compat("html.elements.dt")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{HTMLElement("dd")}}, {{HTMLElement("dl")}}</li>
+</ul>
diff --git a/files/es/web/html/element/em/index.html b/files/es/web/html/element/em/index.html
new file mode 100644
index 0000000000..a639452809
--- /dev/null
+++ b/files/es/web/html/element/em/index.html
@@ -0,0 +1,61 @@
+---
+title: em
+slug: Web/HTML/Element/em
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/em
+original_slug: Web/HTML/Elemento/em
+---
+<div>{{HTMLRef}}</div>
+
+<p>El <strong>elemento HTML <code>&lt;em&gt;</code></strong> es el apropiado para marcar con énfasis las partes importantes de un texto. El elemento <code>&lt;em&gt;</code> puede ser anidado, con cada nivel de anidamiento indicando un mayor grado de énfasis.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/em.html", "tabbed-shorter")}}</div>
+
+
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a>, contenido palpable</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">Contenido textual o estático</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Tag omission</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted parents</th>
+   <td>Any element that accepts <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted ARIA roles</th>
+   <td>Any</td>
+  </tr>
+  <tr>
+   <th scope="row">DOM interface</th>
+   <td>{{domxref("HTMLElement")}} Up to Gecko 1.9.2 (Firefox 4) inclusive, Firefox implements the {{domxref("HTMLSpanElement")}} interface for this element.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Atributos" name="Atributos">Atributos</h3>
+
+<p>Este elemento solo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval"> &lt;p&gt;
+     &lt;em&gt;El dinero&lt;/em&gt; es importante pero &lt;strong&gt;la salud&lt;/strong&gt; lo es más.
+ &lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p><a href="es/HTML/Elemento/em">em</a> tiene un hermano mayor: <a href="es/HTML/Elemento/strong">strong</a>. <a href="es/HTML/Elemento/em">em</a> sirve para dar énfasis y <a href="es/HTML/Elemento/strong">strong</a> para dar mucho énfasis</p>
diff --git a/files/es/web/html/element/embed/index.html b/files/es/web/html/element/embed/index.html
new file mode 100644
index 0000000000..17d6b868fd
--- /dev/null
+++ b/files/es/web/html/element/embed/index.html
@@ -0,0 +1,70 @@
+---
+title: embed
+slug: Web/HTML/Element/embed
+tags:
+  - HTML
+  - HTML5
+  - HTML:Elemento
+  - para_revisar
+translation_of: Web/HTML/Element/embed
+original_slug: Web/HTML/Elemento/embed
+---
+<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Nota: este tema documenta sólo el elemento &lt;embed&gt; que se define como parte de HTML5.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">No trata las implementaciones anteriores no estandarizadas del elemento <code>&lt;embed&gt;</code>.</span></span></div>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El <em>Elemento HTML Embed </em> ( <code>&lt;embed&gt;</code> ) representa un punto de integración para una aplicación externa o de contenido interactivo (en otras palabras, un plug-in).</span></span></p>
+
+<h2 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Ninguno; es un elemento vacío.</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Debe tener una etiqueta de inicio, pero no debe tener una etiqueta de cierre.</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte <a href="/en/HTML/Content_categories#phrasing_content" title="../../../../en/HTML/Content categories#phrasing content">contenido estático</a> .</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
+   <td><a class="external" href="http://www.w3.org/TR/html5/the-iframe-element.html#the-embed-element" title="http://www.w3.org/TR/html5/the-iframe-element.html#the-embed-element"><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.8.3</span></span></a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Este elemento admite los siguientes atributos además de los <a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">atributos globales</a> .</span></span></p>
+
+<dl>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("height") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La altura del recurso mostrada en píxeles CSS.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("src") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La dirección URL del recurso que se está incrustado.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("type") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El tipo MIME que se va a usar para la selección del plug-in para crear una instancia.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("width") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El ancho del recurso mostrado en píxeles CSS.</span></span></dd>
+</dl>
+
+<h2 id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h2>
+
+<ul>
+ <li><a href="/en/DOM/HTMLEmbedElement" title="en/DOM/HTMLEmbedElement"><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTMLEmbedElement</span></span></a></li>
+</ul>
+
+<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-99 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Otros elementos que se utilizan para incrustar el contenido de varios tipos incluyen {{ HTMLElement("audio") }}, {{ HTMLElement("canvas") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("math") }}, {{ HTMLElement("object") }}, {{ HTMLElement("svg") }} y  {{ HTMLElement("video") }}. </span></span></p>
+
+<p> </p>
+
+<p> </p>
+
+<p>{{ languages ( { "en": "en/HTML/Element/embed" } ) }}</p>
+
+<p> </p>
diff --git a/files/es/web/html/element/fieldset/index.html b/files/es/web/html/element/fieldset/index.html
new file mode 100644
index 0000000000..bb9f1a184c
--- /dev/null
+++ b/files/es/web/html/element/fieldset/index.html
@@ -0,0 +1,125 @@
+---
+title: fieldset
+slug: Web/HTML/Element/fieldset
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/fieldset
+original_slug: Web/HTML/Elemento/fieldset
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <a href="/es/HTML/Elemento/fieldset" title="es/HTML/Elemento/fieldset">fieldset</a> (grupo de campos) permite organizar en grupos los campos de un formulario.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;fieldset&gt; y &lt;/fieldset&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">Elemento en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: un elemento <a href="/es/HTML/Elemento/legend" title="es/HTML/Elemento/legend">legend</a> (opcional), y despues cero o más elementos <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> o <a href="/es/HTML/Elemento/Tipos_de_elementos#en_linea" title="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>lista de clases separadas por espacios</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>uno de los siguientes:"ltr" o "rtl"</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre>&lt;form&gt;
+
+ &lt;fieldset&gt;
+  &lt;legend&gt;Información Personal&lt;/legend&gt;
+  Nombre: &lt;input name='nombre' type='text' tabindex='1'&gt;
+  Apellidos: &lt;input name='apellidos' type='text' tabindex='2'&gt;
+ &lt;/fieldset&gt;
+
+ &lt;fieldset&gt;
+  &lt;legend&gt;edad&lt;/legend&gt;
+  &lt;input type='checkbox' tabindex='20'
+            name='edad' value='20-39' &gt; 20-39
+  &lt;input type='checkbox' tabindex='21'
+            name='edad' value='40-59' &gt; 40-59
+  &lt;input type='checkbox' tabindex='22'
+            name='edad' value='60-79' &gt; 60-79
+ &lt;/fieldset&gt;
+
+&lt;/form&gt;
+</pre>
diff --git a/files/es/web/html/element/figcaption/index.html b/files/es/web/html/element/figcaption/index.html
new file mode 100644
index 0000000000..ea089bcb8c
--- /dev/null
+++ b/files/es/web/html/element/figcaption/index.html
@@ -0,0 +1,91 @@
+---
+title: <figcaption>
+slug: Web/HTML/Element/figcaption
+tags:
+  - Elemento
+  - Elementos de agrupación de contenido en HTML
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Element/figcaption
+original_slug: Web/HTML/Elemento/figcaption
+---
+<p>{{HTMLRef}}</p>
+
+<p>El elemento <strong>HTML <code>&lt;figcaption&gt;</code>  </strong>representa un subtítulo o leyenda asociado al contenido del elemento padre {{HTMLElement("figure")}}, pudiendo ser colocado como primer o último hijo. Es importante destacar que el elemento <strong><code>&lt;figcaption&gt;</code></strong> es opcional.</p>
+
+<p>{{EmbedInteractiveExample("pages/tabbed/figcaption.html","tabbed-shorter")}}</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
+   <td>Ninguna</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido Permitido</th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>En un  elemento {{HTMLElement("figure")}} el elemento <code>&lt;figcaption&gt;</code> debe ser el primero o el último hijo.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Contento en el que puede ser usado</th>
+   <td>Como the first o last child de un <strong>&lt;figure&gt;</strong> element</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento sólo incluye los </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Para ejemplos con <code>&lt;figcaption&gt;</code>, por favor ver la página {{HTMLElement("figure")}}.</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('HTML WHATWG', 'grouping-content.html#the-figcaption-element', '&lt;figcaption&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-figcaption-element', '&lt;figcaption&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<div class="hidden">
+<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+</div>
+
+<p>{{Compat("html.elements.figcaption")}}</p>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>El elemento {{HTMLElement("figure")}}.</li>
+</ul>
diff --git a/files/es/web/html/element/figure/index.html b/files/es/web/html/element/figure/index.html
new file mode 100644
index 0000000000..eff7fde724
--- /dev/null
+++ b/files/es/web/html/element/figure/index.html
@@ -0,0 +1,61 @@
+---
+title: figure
+slug: Web/HTML/Element/figure
+tags:
+  - HTML
+  - HTML5
+  - HTML:Elemento
+  - figure
+  - para_revisar
+translation_of: Web/HTML/Element/figure
+original_slug: Web/HTML/Elemento/figure
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El <em> elemento HTML</em> <span style="font-family: Courier New;">&lt;figure&gt;</span> representa contenido independiente, a menudo con un título.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si bien se relaciona con el flujo principal, su posición es independiente de éste.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por lo general, se trata de una imagen, una ilustración, un diagrama, un fragmento de código, o un esquema al que se hace referencia en el texto principal, pero que se puede mover a otra página o a un apéndice sin que afecte al flujo principal.</span></span></p>
+
+<div class="note">
+<p><em><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Notas de uso:</span></span> </em></p>
+
+<ul>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Al ser una <a href="/es/Secciones_y_esquema_de_un_documento_HTML_5#Seccionador_ra.c3.adz" title="https://developer.mozilla.org/es/Secciones_y_esquema_de_un_documento_HTML_5#Seccionador_ra.c3.adz">seccionador raíz</a>, el esbozo del contenido del elemento <span style="font-family: Courier New;">&lt;figure&gt;</span> está excluido del esbozo principal del documento.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Un título puede estar asociado con el elemento <span style="font-family: Courier New;">&lt;figure&gt;</span> mediante la inserción de un {{ HTMLElement ("figcaption") }} en su interior (como el primero o el último hijo).</span></span></li>
+</ul>
+</div>
+
+<h3 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h3>
+
+<table class="standard-table" style="height: 117px; width: 1125px;">
+ <tbody>
+  <tr>
+   <th><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Tipo</span></span></th>
+   <th><a><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Seccionador raíz</span></span></a></th>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un elemento {{ HTMLElement ("figcaption") }}, seguido por <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content"> contenido dinámico</a> , o contenido dinámico seguido por un elemento{{ HTMLElement ("figcaption") }}.</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Ninguna, tanto la etiqueta inicial como la etiqueta de cierre son obligatorias</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte elementos dinámicos.</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
+   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-mark-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-mark-element"><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.5.11</span></span></a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento no tiene atributos que no sean los <a href="/en/HTML/Global_attributes" title="../../../../en/HTML/global attributes">atributos globales</a>, comunes a todos los elementos.</span></span></p>
+
+<h3 class="editable" id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento implementa la interfaz </span></span><code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">.</span></span></p>
+
+<h3 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h3>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento {{ HTMLElement ("figcaption") }}.</span></span></p>
diff --git a/files/es/web/html/element/font/index.html b/files/es/web/html/element/font/index.html
new file mode 100644
index 0000000000..96dc3ec697
--- /dev/null
+++ b/files/es/web/html/element/font/index.html
@@ -0,0 +1,153 @@
+---
+title: font
+slug: Web/HTML/Element/font
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/font
+original_slug: Web/HTML/Elemento/font
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>font</strong> -<em>fuente</em> . Indica el tamaño, color, o fuente del texto que contiene.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;font&gt; y &lt;/font&gt; (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">desaprobado</a>.
+ <dl>
+  <dd>En un doctype transicional está definido como un elemento <a href="es/HTML/Elemento/Tipos_de_elementos#especial">especial</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En línea.</dd>
+ <dd><strong>Puede contener</strong>: Texto, y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea </a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-size-FONT"><span style="color: green;">size</span></a></td>
+   <td>Tamaño de la fuente. Según una tabla del 1 al 7.</td>
+   <td>Un número entero (ej. 1), o un valor incremental (ej. +1). <s>Por defecto:</s> debe indicarlo el autor.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-color-FONT"><span style="color: green;">color</span></a></td>
+   <td>El color del texto.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.5">color RGB</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-face-FONT"><span style="color: green;">face</span></a></td>
+   <td>Especifica la/s fuentes para el texto.</td>
+   <td>Lista de nombres de fuentes separadas por coma. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_ejemplo_simple" name="Un_ejemplo_simple">Un ejemplo simple</h4>
+
+<p>código:</p>
+
+<pre class="eval">&lt;p&gt;
+ Texto normal y ...
+ &lt;<strong>font</strong> size="5" color="#0000ff"&gt; Texto distinto. &lt;/<strong>font</strong>&gt;
+&lt;/p&gt;
+</pre>
+
+<p>Resultado:</p>
+
+<div style="border: solid silver 1px;">
+<p>Texto normal y ... <font color="#0000ff" size="5"> Texto distinto. </font></p>
+</div>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-FONT"><strong>font</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-font">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/footer/index.html b/files/es/web/html/element/footer/index.html
new file mode 100644
index 0000000000..675dc1481a
--- /dev/null
+++ b/files/es/web/html/element/footer/index.html
@@ -0,0 +1,72 @@
+---
+title: footer
+slug: Web/HTML/Element/footer
+tags:
+  - HTML5
+  - footer
+  - para_revisar
+translation_of: Web/HTML/Element/footer
+original_slug: Web/HTML/Elemento/footer
+---
+<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">El <em>Elemento </em><em>HTML Footer</em> (<span style="font-family: 'Courier New';">&lt;footer&gt;</span>) representa un pie de página para el contenido de sección más cercano o el elemento  <a href="/en/Sections_and_Outlines_of_an_HTML5_document#sectioning_root" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">raíz de sección</a> (p.e, su ancestro mas cercano <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/article" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;article&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/aside" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;aside&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/nav" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;nav&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/section" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;section&gt;</a></code>,<code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/blockquote" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;blockquote&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/body" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;body&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/details" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;details&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/fieldset" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;fieldset&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/figure" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;figure&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/td" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;td&gt;</a></code>). Un pie de página típicamente contiene información acerca de el autor de la sección, datos de derechos de autor o enlaces a documentos relacionados.</p>
+<p>&lt;meta http-equiv="content-type" content="text/html; charset=utf-8"/&gt;</p>
+<div class="note" style="margin-bottom: 1.286em; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-width: initial; border-top-width: 1px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px; padding-top: 0.75em; padding-right: 15px; padding-bottom: 0.75em; padding-left: 15px; background-clip: initial; background-color: rgb(250, 249, 226); color: rgb(93, 86, 54);">
+ <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.75em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;"><strong>Notas de uso:</strong></p>
+ <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 22px; list-style-type: disc;">
+  <li>Encierra la información acerca del autor en un elemento <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/address" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;address&gt;</a></code> que puede ser incluido dentro del elemento <span style="font-family: 'Courier New';">&lt;footer&gt;.</span></li>
+  <li>El  elemento <span style="font-family: 'Courier New';">&lt;footer&gt;</span> no es contenido de sección y en consecuencia no introduce una nueva sección en el <a href="/en/Sections_and_Outlines_of_an_HTML5_document" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">esquema</a>.</li>
+ </ul>
+</div>
+<div id="section_1">
+ <h3 class="editable" id="Contexto_de_uso" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Contexto de uso</span></h3>
+ <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
+  <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
+ <table class="fullwidth-table" style="border-collapse: collapse; margin-top: 0px; margin-right: 0px; margin-bottom: 1.5em; margin-left: 0px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; width: 1125px; background-clip: initial; background-color: rgb(255, 255, 255); height: 117px;">
+  <tbody>
+   <tr>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Contenido Permitido</td>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;"><a href="/en/HTML/Content_categories#flow_content" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">Contenido de flujo</a>, pero sin descendientes  <span style="font-family: 'Courier New';">&lt;footer&gt;</span> o <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/header" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;header&gt;</a></code>.</td>
+   </tr>
+   <tr>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Omisión de Etiqueta</td>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Ninguna, tanto la etiqueta de inicio como la de cierre son obligatorias.</td>
+   </tr>
+   <tr>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Elementos ancestros permitidos</td>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">
+     <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">contenido de flujo</a>. Note que un elemento <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;">&lt;footer&gt;</code> no debe ser un descendiente de los elementos <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/address" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;address&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/header" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;header&gt;</a></code> o de otro elemento <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;">&lt;footer&gt;</code>.</p>
+    </td>
+   </tr>
+   <tr>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Documento normativo</td>
+    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-footer-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-footer-element">HTML5, sección 4.4.9</a></td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="section_2">
+ <h3 class="editable" id="Atributos" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Atributos</span></h3>
+ <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
+  <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
+ <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Este elemento no tiene otros atributos adicionales a los <a class="new " href="/en/HTML/global_attributes" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">atributos globales</a>, comunes a todos los elementos.</p>
+ <div id="section_3">
+  <div id="section_3">
+   <div id="section_3">
+    <h3 class="editable" id="Interfaz_DOM" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Interfaz DOM</span></h3>
+    <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
+     <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
+    <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Este elemento implementa la interfaz <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a href="/en/DOM/element" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">HTMLElement</a></code>.</p>
+   </div>
+   <div id="section_4">
+    <h3 class="editable" id="Vea_también" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Vea también</span></h3>
+    <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
+     <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
+    <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 22px; list-style-type: disc;">
+     <li>Otros elementos relacionados con secciones: <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/body" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;body&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/nav" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;nav&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/article" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;article&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/aside" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;aside&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h1" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h1&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h2" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h2&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h3" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h3&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h4" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h4&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h5" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h5&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h6" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h6&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/hgroup" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;hgroup&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/header" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;header&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/section" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;section&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/address" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;address&gt;</a></code>;</li>
+     <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">Secciones y esquemas de un documento HTML5</a>.</li>
+    </ul>
+   </div>
+  </div>
+ </div>
+</div>
+<p> </p>
diff --git a/files/es/web/html/element/form/index.html b/files/es/web/html/element/form/index.html
new file mode 100644
index 0000000000..d8e3b0c619
--- /dev/null
+++ b/files/es/web/html/element/form/index.html
@@ -0,0 +1,199 @@
+---
+title: form
+slug: Web/HTML/Element/form
+translation_of: Web/HTML/Element/form
+original_slug: Web/HTML/Elemento/form
+---
+<h2 id="Resumen">Resumen</h2>
+<p>El elemento HTML form (<code>&lt;form&gt;</code>) representa una sección de un documento que contiene controles interactivos que permiten a un usuario enviar información a un servidor web.</p>
+<p>Es posible usar las pseudo-clasess de CSS <code><a href="/es/CSS/%3Avalid" rel="custom">:valid</a></code> e <code><a href="/es/CSS/%3Ainvalid" rel="custom">:invalid</a></code>  para darle estilos a un elemento form.</p>
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+<table class="standard-table">
+  <tbody>
+    <tr>
+      <td>Categorías de contenido</td>
+      <td><a href="/en/HTML/Content_categories#flow_content" title="/en/HTML/Content_categories#flow_content">Contenido dinámico</a></td>
+    </tr>
+    <tr>
+      <td>Contenido permitido</td>
+      <td><a href="/en/HTML/Content_categories#flow_content" title="/en/HTML/Content_categories#flow_content">Contenido dinámico</a>, pero sin contener elementos <code>&lt;form&gt;</code></td>
+    </tr>
+    <tr>
+      <td>Omisión de etiquetas</td>
+      <td>Ninguna, ambas, la etiqueta de apertura y cierre deben estar presentes</td>
+    </tr>
+    <tr>
+      <td>Normative document</td>
+      <td><a class="external" href="http://www.w3.org/TR/html5/forms.html#the-form-element" title="http://www.w3.org/TR/html5/forms.html#the-form-element">HTML5, section 4.10.3</a> (<a class="external" href="http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html#h-17.3" title="http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html#h-17.3">HTML4.01, section 17.3</a>)</td>
+    </tr>
+  </tbody>
+</table>
+<h2 id="Atributos">Atributos</h2>
+<p>Como cualquier otro elemento HTML, este elemento soporta <a href="/en/HTML/Global_attributes" title="/en/HTML/Global_attributes">atributos globales</a></p>
+<dl>
+  <dt>
+    {{ htmlattrdef("accept") }} {{ HTMLVersionInline(4) }} {{ obsolete_inline() }}</dt>
+  <dd>
+    Una lista separada por comas de los tipos de contenido que el servidor acepta.<br>
+    <div class="note">
+      <p><strong>Nota de uso: </strong>este atributo ha sido removido en HTML5 y no debe ser usado. En su lugar, usar el atributo <strong><a href="/es/HTML/Element/Input#attr-accept" title="/en/HTML/Element/Input#attr-accept">accept</a></strong> del elemento específico {{ HTMLElement("input") }}.</p>
+    </div>
+  </dd>
+  <dt>
+    {{ htmlattrdef("accept-charset") }}</dt>
+  <dd>
+    Una lista de codificación de caracteres que el servidor acepta. La lista puede ser delimitada por espacios o comas. El navegador los usa en el orden en que cada uno son listados. Los valores por defecto es la cadena reservada "UNKNOWN", en tal caso la codificación corresponde a la codificación del documento conteniendo el elemento form.<br>
+    <p>HTML 4: En versiones anteriores de HTML, las diferentes codificaciones de caracteres pueden ser delimitadas por espacios o comas. Este no es más el caso en HTML5, donde sólo los espacios son correctos.</p>
+  </dd>
+  <dt>
+    {{ htmlattrdef("action") }}</dt>
+  <dd>
+    La URI de un programa que procesa la información enviada por medio del formulario. Este valor puede ser sobreescrito por un atributo {{ htmlattrxref("formaction", "button") }} en un {{ HTMLElement("button") }} o en el elemento{{ HTMLElement("input") }}.</dd>
+  <dt>
+    {{ htmlattrdef("autocomplete") }} {{ HTMLVersionInline(5) }}</dt>
+  <dd>
+    Indica cuales de los controles en este formulario puede tener sus valores automáticamente completados por el navegador. Esta configuración puede ser sobreescrita por un atributo <code>autocomplete</code> en un elemento que pertenezca al formulario:
+    <ul>
+      <li><span style="font-family: Courier New;">off</span>: El usuario debe ingresar explicitamente cada valor dentro de cada campo por cada uso, o el documento provee su propio método de autocompletado; el navegador no autocompleta las entradas.</li>
+      <li><span style="font-family: Courier New;">on</span>: El navegador puede completar automáticamente valores basados en lo que el usuario ha ingresado durante entradas previas al formulario.</li>
+    </ul>
+    <div class="note">
+      <p><strong>Nota:</strong> si se establece <code>autocomplete</code> a un valor de <code>off</code> en un formulario porque el documento provee su propio auto-completado entonces también se debería establecer  <code>autocomplete</code> al valor <code>off</code> para cada uno de los elementos de formulario <code>input</code> que el documento pueda autocompletar {{ anch("Notas para Google Chrome") }}.</p>
+    </div>
+  </dd>
+  <dt>
+    {{ htmlattrdef("enctype") }}</dt>
+  <dd>
+    Cuando el valor del atributo <code>method</code> es <span style="font-family: Courier New;">post</span>, este atributo es el  <a href="http://en.wikipedia.org/wiki/Mime_type" title="http://en.wikipedia.org/wiki/Mime_type">tipo MIME</a> del contenido que es usado para enviar el formulario al servidor.</dd>
+  <dd>
+    Los posibles valores son:
+    <ul>
+      <li><span style="font-family: Courier New;">application/x-www-form-urlencoded</span>: El valor por defecto si un atributo no está especificado.</li>
+      <li><span style="font-family: Courier New;">multipart/form-data</span>: Usar este valor si se está usando el elemento {{ HTMLElement("input") }} con el atributo <code>type</code> ajustado a "file".</li>
+      <li><span style="font-family: Courier New;">text/plain (HTML5)</span></li>
+    </ul>
+    <p>Este valor puede ser sobreescrito por un atributo{{ htmlattrxref("formenctype", "button") }}en un {{ HTMLElement("button") }} o un elemento {{ HTMLElement("input") }}.</p>
+  </dd>
+  <dt>
+    {{ htmlattrdef("method") }}</dt>
+  <dd>
+    El método <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616.html" title="http://www.w3.org/Protocols/rfc2616/rfc2616.html">HTTP</a> que el navegador usa para enviar el formulario. Valores posibles son:
+    <ul>
+      <li><span style="font-family: Courier New;">post</span>: Corresponde al <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.5" title="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.5">método POST</a> HTTP ; los datos del formulario son incluidos en el cuerpo del formulario y son enviados al servidor.</li>
+      <li><span style="font-family: Courier New;">get</span>: Corresponde al <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.3" title="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.3">método GET</a> HTTP; los datos del formulario son adjuntados a la URI del atributo  <code>action</code> , con un '?' como separador,  y la URI resultante es enviada al servidor. Use este método cuando el formulario no tiene efectos secundarios y contiene solo caracteres ASCII.</li>
+    </ul>
+    <p>Este valor puede ser sobreescrito por un atributo {{ htmlattrxref("formmethod", "button") }} en un  {{ HTMLElement("button") }} o elemento {{ HTMLElement("input") }}.</p>
+  </dd>
+  <dt>
+    {{ htmlattrdef("name") }}</dt>
+  <dd>
+    El nombre del formulario. En HTML4 ha quedado en desuso (debe usarse un <span style="font-family: Courier New;">id</span> en su lugar). Debe ser único entre los formularios en un documento y no una cadena vacia en HTML5.</dd>
+  <dt>
+    {{ htmlattrdef("novalidate") }} {{ HTMLVersionInline(5) }}</dt>
+  <dd>
+    Este atributo booleano indica que el formulario no es validado cuando es enviado. Si el atributo no existe {{ htmlattrxref("formnovalidate", "button") }} en un {{ HTMLElement("button") }} o en un elemento  {{ HTMLElement("input") }} que pertenece al formulario.</dd>
+  <dt>
+    {{ htmlattrdef("target") }}</dt>
+  <dd>
+    Un nombre o keyword indicando donde mostrar la respuesta que es recibida después de enviar el formulario. En HTML 4, este es el nombre de, o una palabra clave, para un marco. En HTML5, es un nombre de, o palabra clave para, un contexto de navegación (por ejemplo, tab, window o marco en línea). Las siguientes palabras clave tienen significados especiales:
+    <ul>
+      <li><span style="font-family: Courier New;">_self</span>: Carga la respuesta dentro del mismo frame HTML 4 (o en HTML5, contexto de navegación) como el marco actual. Este valor es por defecto si el atributo no es especificado.</li>
+      <li><span style="font-family: Courier New;">_blank</span>: Carga la respuesta dentro de una nueva ventana sin nombre en HTML 4 o un contexto de navegación en HTML5.</li>
+      <li><span style="font-family: Courier New;">_parent</span>: Carga la respuesta en el marco padre del marco actual en HTML 4 o en el contexto de navegación padre del marco actual en HTML5. Si no hay marco padre, esta opción se comporta de la misma manera que <span style="font-family: Courier New;">_self</span>.</li>
+      <li><span style="font-family: Courier New;">_top</span>: HTML 4: Carga la respuesta en toda la ventana original, cancelando otros marcos.  HTML5: Carga la respuesta en el contexto de navegación de más alto nivel (esto es, el contexto de navegación que es ancestro del actual, y no tiene padre). Si no hay padre, esta opción se comporta igual que <span style="font-family: Courier New;">_self</span>.</li>
+    </ul>
+    <p>HTML5: Este valor puede ser sobreescrito por un atributo {{ htmlattrxref("formtarget", "button") }} en un elemento {{ HTMLElement("button") }} o{{ HTMLElement("input") }}.</p>
+  </dd>
+</dl>
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+<p>Este elemento implementa la interfaz <code><a href="/es/DOM/HTMLFormElement" title="en/DOM/form">HTMLFormElement</a></code>.</p>
+<h2 id="Ejemplos">Ejemplos</h2>
+<pre class="brush: html">&lt;!-- Formulario simple que enviará una petición GET --&gt;
+&lt;form action=""&gt;
+  &lt;label for="GET-name"&gt;Nombre:&lt;/label&gt;
+  &lt;input id="GET-name" type="text" name="name"&gt;
+  &lt;input type="submit" value="Save"&gt;
+&lt;/form&gt;
+
+&lt;!-- Formulario simple que enviará una petición POST --&gt;
+&lt;form action="" method="post"&gt;
+  &lt;label for="POST-name"&gt;Nombre:&lt;/label&gt;
+  &lt;input id="POST-name" type="text" name="name"&gt;
+  &lt;input type="submit" value="Save"&gt;
+&lt;/form&gt;
+
+&lt;!-- Formulario con conjunto de campos, leyenda y etiqueta --&gt;
+&lt;form action="" method="post"&gt;
+  &lt;fieldset&gt;
+    &lt;legend&gt;Título&lt;/legend&gt;
+    &lt;input type="radio" name="radio" id="radio"&gt; &lt;label for="radio"&gt;Clic aquí&lt;/label&gt;
+  &lt;/fieldset&gt;
+&lt;/form&gt;
+</pre>
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Característica</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera</th>
+        <th>Safari</th>
+      </tr>
+      <tr>
+        <td>Soporte básico</td>
+        <td>1.0</td>
+        <td>{{ CompatGeckoDesktop("1.0") }}</td>
+        <td>{{ CompatVersionUnknown() }}</td>
+        <td>{{ CompatVersionUnknown() }}</td>
+        <td>{{ CompatVersionUnknown() }}</td>
+      </tr>
+      <tr>
+        <td>atributo <code>novalidate</code></td>
+        <td>1.0</td>
+        <td>{{ CompatGeckoDesktop("2.0") }}</td>
+        <td>{{ CompatNo() }}</td>
+        <td>{{ CompatUnknown() }}</td>
+        <td>{{ CompatUnknown() }}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Característica</th>
+        <th>Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Mobile</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>Soporte básico</td>
+        <td>{{ CompatVersionUnknown() }}</td>
+        <td>{{ CompatGeckoMobile("1.0") }}</td>
+        <td>{{ CompatVersionUnknown() }}</td>
+        <td>{{ CompatVersionUnknown() }}</td>
+        <td>{{ CompatVersionUnknown() }}</td>
+      </tr>
+      <tr>
+        <td>atributo <code>novalidate</code></td>
+        <td>{{ CompatUnknown() }}</td>
+        <td>{{ CompatGeckoMobile("2.0") }}</td>
+        <td>{{ CompatUnknown() }}</td>
+        <td>{{ CompatUnknown() }}</td>
+        <td>{{ CompatUnknown() }}</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<p>Notas para Google Chrome</p>
+<p>La interfaz de usuario para peticiones auto-complete en Google Chrome varía dependiendo de si <code>autocomplete</code> está establecido en <code>off</code> en elementos <code>input</code> así como su formulario. Específicamente, cuando un formulario tiene <code>autocomplete</code> establecido en <code>off</code> y sus campos <code>autocomplete</code> de sus elementos input <strong>no</strong> están establecidos, entonces si el usuario pregunta por sugerencias de autocompletado para el elemento input, Chrome podrá mostrar un mensaje diciendo "El autocompletado ha sido desactivado para este formulario." Por otro lado, si el formulario y el elemento input tienen <code>autocomplete</code> establecido como <code>off</code>, el navegador no mostrará este mensaje. Por esta razón, debe establecer <code>autocomplete</code> en <code>off</code> para cada input que tiene autocompletado personalizado.</p>
+<h2 id="Consulte_también">Consulte también</h2>
+<p>Otros elementos que son usados para crear formularios: {{ HTMLElement("button") }}, {{ HTMLElement("datalist") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }},{{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}.</p>
+<p>{{ languages( { "fr": "fr/HTML/Element/Form" } ) }}</p>
diff --git a/files/es/web/html/element/frame/index.html b/files/es/web/html/element/frame/index.html
new file mode 100644
index 0000000000..95326371bc
--- /dev/null
+++ b/files/es/web/html/element/frame/index.html
@@ -0,0 +1,168 @@
+---
+title: frame
+slug: Web/HTML/Element/frame
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/frame
+original_slug: Web/HTML/Elemento/frame
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>frame</strong> -<em>marcos</em> . Define la organización de los marcos dentro de la ventana del usuario.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;frame&gt;</code> (solo tiene una).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#paramarcos">para marcos</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: .</dd>
+ <dd><strong>Puede contener</strong>: Nada.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-longdesc-FRAME"><span style="color: green;">longdesc </span></a></td>
+   <td>Permite especificar un enlace a una descripción detallada del marco. Inportante para la <a href="es/Accesibilidad">accesibilidad</a>.</td>
+   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Por defecto: lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-name-FRAME"><span style="color: green;">name </span></a></td>
+   <td>Especifica un nombre para el marco, Esto permite usarlo <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#h-16.3">como destino</a> de los enlaces.</td>
+   <td>. Por defecto: . lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-src-FRAME"><span style="color: green;">src </span></a></td>
+   <td>Especifica la localización de los contenidos iniciales del marco.</td>
+   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Por defecto: lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-frameborder"><span style="color: green;">frameborder </span></a></td>
+   <td>Indica si el marco tendrá o no borde.</td>
+   <td>Uno de los siguientes: '1' o '0'. Por defecto: '1'.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-marginwidth"><span style="color: green;">marginwidth </span></a></td>
+   <td>Indica el margen izquierdo y derecho entre contenido y borde.</td>
+   <td>Una cantidad de píxeles (cero o más). Por defecto: lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-marginheight"><span style="color: green;">marginheight </span></a></td>
+   <td>Indica el margen superior e inferior entre contenido y borde.</td>
+   <td>Una cantidad de píxeles (cero o más). Por defecto: lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-noresize"><span style="color: green;">noresize </span></a></td>
+   <td>Hace que la ventana del marco no sea redimensionable.</td>
+   <td>'noresize'. Por defecto: lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-scrolling"><span style="color: green;">scrolling </span></a></td>
+   <td>Indica si el marco debe tener o no barra de desplazamiento (scroll).</td>
+   <td>Uno de los sigientes: 'yes', 'no', o 'auto'. Por defecto: 'auto'.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_documento_con_marcos" name="Un_documento_con_marcos">Un documento con marcos</h4>
+
+<p>código:</p>
+
+<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
+  "<a class="external" href="http://www.w3.org/TR/html4/frameset.dtd" rel="freelink">http://www.w3.org/TR/html4/frameset.dtd</a>"&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;Un documento simple con marcos&lt;/title&gt;
+&lt;/head&gt;
+&lt;frameset rows="20%,80%"&gt;
+ &lt;frameset cols="20%, 80%"&gt;
+   &lt;<strong>frame</strong> src="<a class="external" href="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png" rel="freelink">http://developer.mozilla.org/wiki-im...irefoxlogo.png</a>"&gt;
+   &lt;<strong>frame</strong> src="<a class="external" href="http://html.conclase.net/w3c/html401-es/sgml/loosedtd.html#frame" rel="freelink">http://html.conclase.net/w3c/html401...dtd.html#frame</a>"&gt;
+ &lt;/frameset&gt;
+ &lt;<strong>frame</strong> src="<a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAME" rel="freelink">http://html.conclase.net/w3c/html401...tml#edef-FRAME</a>"&gt;
+&lt;/frameset&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAME"><strong>frame</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-frame">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/frameset/index.html b/files/es/web/html/element/frameset/index.html
new file mode 100644
index 0000000000..8e2b69b946
--- /dev/null
+++ b/files/es/web/html/element/frameset/index.html
@@ -0,0 +1,158 @@
+---
+title: frameset
+slug: Web/HTML/Element/frameset
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/frameset
+original_slug: Web/HTML/Elemento/frameset
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>frameset</strong> -<em>conjunto de marcos</em> . Define la organización de los marcos dentro de la ventana del usuario.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;frameset&gt;</code> y <code>&lt;/frameset&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#paramarcos">para marcos</a>.
+ <dl>
+  <dd>Con un doctype para marcos está definido como contenido de html.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: .</dd>
+ <dd><strong>Puede y debe contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/frameset">frameset</a> y <a href="es/HTML/Elemento/frame">frame</a>. además puede contener un elemento <a href="es/HTML/Elemento/noframes">noframes</a>.</dd>
+ <dd><strong>Debe ser contenido por</strong>: Elementos <a href="es/HTML/Elemento/html">html</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-rows-FRAMESET"><span style="color: green;">rows </span></a></td>
+   <td>Asigna la disposición horizontal de los marcos.</td>
+   <td>Lista de <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.6">longitudes</a> separadas por coma, pueden espresarse en píxeles, porcentajes o de forma relativa. Por defecto: 100% (una fila), lo fija el navegador..</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-cols-FRAMESET"><span style="color: green;">cols </span></a></td>
+   <td>Asigna la disposición horizontal de los marcos.</td>
+   <td>Lista de <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.6">longitudes</a> separadas por coma, pueden espresarse en píxeles, porcentajes o de forma relativa. Por defecto: 100% (una columna). lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_documento_con_marcos" name="Un_documento_con_marcos">Un documento con marcos</h4>
+
+<p>código:</p>
+
+<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
+  "<a class="external" href="http://www.w3.org/TR/html4/frameset.dtd" rel="freelink">http://www.w3.org/TR/html4/frameset.dtd</a>"&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;Un documento simple con marcos&lt;/title&gt;
+&lt;/head&gt;
+&lt;<strong>frameset</strong> rows="20%,80%"&gt;
+ &lt;<strong>frameset</strong> cols="20%, 80%"&gt;
+   &lt;frame src="<a class="external" href="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png" rel="freelink">http://developer.mozilla.org/wiki-im...irefoxlogo.png</a>"&gt;
+   &lt;frame src="<a class="external" href="http://html.conclase.net/w3c/html401-es/sgml/loosedtd.html#frameset" rel="freelink">http://html.conclase.net/w3c/html401....html#frameset</a>"&gt;
+ &lt;/<strong>frameset</strong>&gt;
+ &lt;frame src="<a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAMESET" rel="freelink">http://html.conclase.net/w3c/html401...#edef-FRAMESET</a>"&gt;
+ &lt;noframes&gt;
+   &lt;p&gt; este documento contiene los siguientes recursos: &lt;/p&gt;
+   &lt;ul&gt;
+     &lt;li&gt; &lt;img src="<a class="external" href="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png" rel="freelink">http://developer.mozilla.org/wiki-im...irefoxlogo.png</a>" alt="el logo de Firefox"&gt;
+     &lt;/li&gt;
+     &lt;li&gt; La definición de frameset en el
+          &lt;a href="<a class="external" href="http://html.conclase.net/w3c/html401-es/sgml/loosedtd.html#frameset" rel="freelink">http://html.conclase.net/w3c/html401....html#frameset</a>"&gt;
+          dtd de html 4.01 trans.&lt;/a&gt;
+     &lt;/li&gt;
+     &lt;li&gt; La definición de frameset en la
+          &lt;a href="<a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAMESET" rel="freelink">http://html.conclase.net/w3c/html401...#edef-FRAMESET</a>"&gt;
+          especificación de html 4.01&lt;/a&gt;
+     &lt;/li&gt;
+   &lt;/ul&gt;
+ &lt;/noframes&gt;
+&lt;/<strong>frameset</strong>&gt;
+&lt;/html&gt;
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAMESET"><strong>frameset</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-frameset">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/head/index.html b/files/es/web/html/element/head/index.html
new file mode 100644
index 0000000000..7a63613e46
--- /dev/null
+++ b/files/es/web/html/element/head/index.html
@@ -0,0 +1,148 @@
+---
+title: head
+slug: Web/HTML/Element/head
+tags:
+  - HTML
+  - HTML:Elemento
+  - Metadatos de documento HTML
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/head
+original_slug: Web/HTML/Elemento/head
+---
+<div>{{HTMLRef}}</div>
+
+<p>El <strong>elemento HTML <code>&lt;head&gt;</code></strong> provee información general (metadatos) acerca del documento, incluyendo su título y enlaces a scripts y hojas de estilos.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td>Ninguna.</td>
+  </tr>
+  <tr>
+   <th>Contenido permitido</th>
+   <td>Si el elemento es un {{htmlattrxref("srcdoc", "iframe")}} de un {{HTMLElement("iframe")}} , o si la información de título está disponible desde un protocolo de nivel superior, cero o más elementos de metadatos.<br>
+    De otro modo, uno o más elementos de metadatos donde exactamente uno es {{HTMLElement("title")}}.</td>
+  </tr>
+  <tr>
+   <th>Omisión de etiqueta</th>
+   <td>La etiqueta de inicio puede ser omitida si lo primero dentro del elemento head es un elemento.<br>
+    La etiqueta de cierre puede ser omitida si lo primero después del elemento head no es un espacio o un comentario.</td>
+  </tr>
+  <tr>
+   <th>Elementos padre permitidos</th>
+   <td>Un elemento {{HTMLElement("html")}}, pues éste es su primer hijo.</td>
+  </tr>
+  <tr>
+   <th>Interfaz DOM</th>
+   <td>{{domxref("HTMLHeadElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("profile")}} {{obsolete_inline}}</dt>
+ <dd>Los URIs de uno o más perfiles de metadatos, separados por un espacio en blanco.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html">&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;Document title&lt;/title&gt;
+  &lt;/head&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>Navegadores modernos que cumplen con el estándar HTML5 construyen automáticamente un elemento <code>&lt;head&gt;</code> si las etiquetas son omitidas en el código. <a class="external" href="http://www.stevesouders.com/blog/2010/05/12/autohead-my-first-browserscope-user-test/">Este comportamiento no puede ser garantizado en navegadores antiguos</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-head-element', '&lt;head&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambios desde la última versión</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-head-element', '&lt;head&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Atributo <code>profile</code> obsoleto</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.4.1', '&lt;head&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>Elementos que pueden ser usados dentro de un elemento <code>&lt;head&gt;:</code> {{HTMLElement("title")}}, {{HTMLElement("base")}}, {{HTMLElement("link")}}, {{HTMLElement("style")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("noscript")}}</li>
+</ul>
diff --git a/files/es/web/html/element/header/index.html b/files/es/web/html/element/header/index.html
new file mode 100644
index 0000000000..bb32122ae7
--- /dev/null
+++ b/files/es/web/html/element/header/index.html
@@ -0,0 +1,75 @@
+---
+title: header
+slug: Web/HTML/Element/header
+tags:
+  - HTML5
+  - header
+  - para_revisar
+translation_of: Web/HTML/Element/header
+original_slug: Web/HTML/Elemento/header
+---
+<p>El <em>elemento de HTML Header</em> (<span style="font-family: Courier New;">&lt;header&gt;</span>) representa un grupo de ayudas introductorias o de navegación. Puede contener algunos elementos de encabezado, así como también un logo, un formulario de búsqueda, un nombre de autor y otros componentes.</p>
+
+<div class="note">
+<p><strong>Nota de uso:</strong></p>
+
+<ul>
+ <li>El elemento <span style="font-family: Courier New;">&lt;header&gt;</span> no es contenido de sección y, por lo tanto, no introduce una nueva sección en <a href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">descripción</a>.</li>
+</ul>
+</div>
+
+<h3 id="Contexto_de_uso">Contexto de uso</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Contenido permitido</td>
+   <td><a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">Contenido dinámico</a>, pero sin un <span style="font-family: Courier New;">&lt;header&gt;</span> o {{ HTMLElement("footer") }} descendente</td>
+  </tr>
+  <tr>
+   <td>Omisión de la etiqueta</td>
+   <td>No está permitido, tanto la <span title="syntax-start-tag">etiqueta de inicio</span> como la de <span title="syntax-end-tag">final</span> son obligatorias</td>
+  </tr>
+  <tr>
+   <td>
+    <p>Elementos padres permitidos</p>
+
+    <p>Roles ARIA permitidos</p>
+
+    <p>Inreface DOM</p>
+   </td>
+   <td>
+    <p>Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a>. Ten en cuenta que un elemento <code>&lt;header&gt;</code> no debe ser descendiente de un elemento {{ HTMLElement("address") }}, {{ HTMLElement("footer") }} o cualquier otro elemento {{ HTMLElement("header") }}.</p>
+
+    <p>{{ARIARole("group")}}, {{ARIARole("presentation")}}</p>
+
+    <p>{{domxref("HTMLElement")}}</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Documento normativo</td>
+   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-header-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-header-element">HTML5, sección 4.4.8</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Atributos">Atributos</h3>
+
+<p>Este elemento no tiene otros atributos que no sean los <a class="new " href="../../../../en/HTML/global_attributes" rel="internal">atributos generales</a>, comunes a todos los elementos.</p>
+
+<div id="section_3">
+<div id="section_3">
+<h3 class="editable" id="Interfaz_DOM">Interfaz DOM</h3>
+
+<p>Este elemento implementa la interfaz <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code>.</p>
+
+<h3 id="Mira_también">Mira también</h3>
+
+<ul>
+ <li>Otros elementos relacionados con secciones: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("article") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("section") }}, {{ HTMLElement("address") }};</li>
+ <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Sections and outlines of an HTML5 document</a>.</li>
+</ul>
+
+<p>{{ languages( { "en": "en/HTML/Element/header" } ) }}</p>
+</div>
+</div>
diff --git a/files/es/web/html/element/heading_elements/index.html b/files/es/web/html/element/heading_elements/index.html
new file mode 100644
index 0000000000..50faa08bd4
--- /dev/null
+++ b/files/es/web/html/element/heading_elements/index.html
@@ -0,0 +1,241 @@
+---
+title: Elementos títulos
+slug: Web/HTML/Element/Heading_Elements
+tags:
+  - HTML
+  - HTML:Elemento
+  - Referencia
+  - Secciones HTML
+  - Todas_las_Categorías
+  - Web
+translation_of: Web/HTML/Element/Heading_Elements
+original_slug: Web/HTML/Elemento/Elementos_títulos
+---
+<p id="Summary">Los elementos de <strong>encabezado</strong> implementan seis niveles de encabezado del documento, <code>&lt;h1&gt;</code> es el más importante, y <code>&lt;h6&gt;</code>, el menos importante. Un elemento de encabezado describe brevemente el tema de la sección que presenta. La información de encabezado puede ser usada por los agentes usuarios, por ejemplo, para construir una tabla de contenidos para un documento automáticamente.</p>
+
+<div class="note">
+<p><strong>Notas de uso:</strong></p>
+
+<ul>
+ <li>No se deben usar niveles inferiores para reducir el tamaño de la fuente: use la propiedad <a href="/en-US/docs/Web/CSS">CSS</a> {{cssxref("font-size")}} para eso.</li>
+ <li>Evite omitir niveles de encabezado: siempre comience con <code>&lt;h1&gt;</code>, después use <code>&lt;h2&gt;</code> y así sucesivamente.</li>
+ <li>Con el elemento {{HTMLElement("section")}}, debe considerar evitar usar &lt;h1&gt; más de una vez en una página; por costumbre, se usa para mostrar el título de la página, con todos los encabezados debajo de éste comenzando con <code>&lt;h2&gt;</code>. Cuando se usan secciones, debe usarse un <code>&lt;h1&gt;</code> por sección. Véase <a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document#Definiendo_secciones_en_HTML5">Definiendo secciones</a> en <a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document">Secciones y esquema de un documento HTML5</a> para más información.</li>
+</ul>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, contenido de encabezados, contenido palpable.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">Contenido textual o estático</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padres permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido dinámico</a>; no debe usarse como hijo del elemento {{HTMLElement("hgroup")}}, pues éste es obsoleto</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLHeadingElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Estos elementos incluyen los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<p>El atributo <code>align</code> es obsoleto; no debe usarse.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Todos_los_encabezados">Todos los encabezados</h3>
+
+<p>El siguiente código muestra todos los niveles de encabezado.</p>
+
+<pre class="brush: html">&lt;h1&gt;Heading level 1&lt;/h1&gt;
+&lt;h2&gt;Heading level 2&lt;/h2&gt;
+&lt;h3&gt;Heading level 3&lt;/h3&gt;
+&lt;h4&gt;Heading level 4&lt;/h4&gt;
+&lt;h5&gt;Heading level 5&lt;/h5&gt;
+&lt;h6&gt;Heading level 6&lt;/h6&gt;
+</pre>
+
+<p>Aquí está el resultado de este código:</p>
+
+<p>{{ EmbedLiveSample('Todos_los_encabezados', '280', '300', '') }}</p>
+
+<h3 id="Página_de_ejemplo">Página de ejemplo</h3>
+
+<p>El código siguiente muestra unos pocos encabezados con algo de contenido debajo de ellos.</p>
+
+<pre class="brush: html">&lt;h1&gt;Heading elements&lt;/h1&gt;
+&lt;h2&gt;Summary&lt;/h2&gt;
+&lt;p&gt;Some text here...&lt;/p&gt;
+
+&lt;h2&gt;Examples&lt;/h2&gt;
+&lt;h3&gt;Example 1&lt;/h3&gt;
+&lt;p&gt;Some text here...&lt;/p&gt;
+
+&lt;h3&gt;Example 2&lt;/h3&gt;
+&lt;p&gt;Some text here...&lt;/p&gt;
+
+&lt;h2&gt;See also&lt;/h2&gt;
+&lt;p&gt;Some text here...&lt;/p&gt;
+</pre>
+
+<p>Aquí está el resultado de este código:</p>
+
+<p>{{ EmbedLiveSample('Página_de_ejemplo', '280', '480', '') }}</p>
+
+<h2 id="Sobre_Accesibilidad">Sobre Accesibilidad</h2>
+
+<h3 id="Navegación">Navegación</h3>
+
+<p>Una forma típica de navegación que utilizan las personas no videntes es moverse a través de la pantalla con las etiquetas de encabezado. De esta forma, pueden conocer rápidamente el contenido de la página en poco tiempo; por esta razón es importante prestar mucha atención a nuestras etiquetas de encabezado y no saltearse ningún nivel o podríamos confundir a este usuario.</p>
+
+<h4 id="No_hacer">No hacer</h4>
+
+<pre class="brush: html example-bad">&lt;h1&gt;Cabecera nivel 1&lt;/h1&gt;
+&lt;h3&gt;Cabecera nivel 3&lt;/h3&gt;
+&lt;h4&gt;Cabecera nivel 4&lt;/h4&gt;
+</pre>
+
+<h4 id="Sí_hacer">Sí hacer</h4>
+
+<pre class="brush: html example-good">&lt;h1&gt;Cabecera nivel 1&lt;/h1&gt;
+&lt;h2&gt;Cabecera nivel 2&lt;/h2&gt;
+&lt;h3&gt;Cabecera nivel 3&lt;/h3&gt;
+</pre>
+
+<h4 id="Anidar">Anidar</h4>
+
+<p>Las etiquetas de cabecera pueden anidarse para generar sub-secciones en nuestros documentos. Esto beneficia la organización de la información y también ayuda a los usuarios de lectores de pantalla a conocer mejor la jerarquía de los contenidos.</p>
+
+<ol>
+ <li><code>h1</code> Harry Potter
+
+  <ol>
+   <li><code>h2</code> Sinopsis</li>
+   <li><code>h2</code> Novelas
+    <ol>
+     <li><code>h3</code> Harry Potter y la Piedra Filosofal</li>
+     <li><code>h3</code> Harry Potter y la Cámara de los Secretos</li>
+     <li><code>h3</code> Harry Potter y el Prisionero de Azkaban</li>
+     <li><code>h3</code> Harry Potter y el Cáliz de Fuego</li>
+     <li><code>h3</code> Harry Potter y la Orden del Fenix</li>
+     <li><code>h3</code> Harry Potter y el Príncipe Mestizo</li>
+     <li><code>h3</code> Harry Potter y las Reliquias de la Muerte</li>
+    </ol>
+   </li>
+   <li><code>h2</code> Películas
+    <ol>
+     <li><code>h3</code> Harry Potter y la Piedra Filosofal</li>
+     <li><code>h3</code> Harry Potter y la Cámara de los Secretos</li>
+     <li><code>h3</code> Harry Potter y el Prisionero de Azkaban</li>
+     <li><code>h3</code> Harry Potter y el Cáliz de Fuego</li>
+     <li><code>h3</code> Harry Potter y la Orden del Fenix</li>
+     <li><code>h3</code> Harry Potter y el Príncipe Mestizo</li>
+     <li><code>h3</code> Harry Potter y las Reliquias de la Muerte (Parte 1)</li>
+     <li><code>h3</code> Harry Potter y las Reliquias de la Muerte (Parte 2)</li>
+    </ol>
+   </li>
+  </ol>
+ </li>
+</ol>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements', '&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;, &lt;h4&gt;, &lt;h5&gt;, and &lt;h6&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements', '&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;, &lt;h4&gt;, &lt;h5&gt;, and &lt;h6&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.5.5', '&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;, &lt;h4&gt;, &lt;h5&gt;, and &lt;h6&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{HTMLElement("p")}}</li>
+ <li>{{HTMLElement("div")}}</li>
+ <li>{{HTMLElement("section")}}</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/hgroup/index.html b/files/es/web/html/element/hgroup/index.html
new file mode 100644
index 0000000000..88002304a6
--- /dev/null
+++ b/files/es/web/html/element/hgroup/index.html
@@ -0,0 +1,121 @@
+---
+title: hgroup
+slug: Web/HTML/Element/hgroup
+translation_of: Web/HTML/Element/hgroup
+original_slug: Web/HTML/Elemento/hgroup
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El <em>elemento de grupo de cabeceras HTML</em> (<span style="font-family: Courier New;">&lt;hgroup&gt;</span>) representa el encabezado de una sección. Define un solo título que participa de <a href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">la estructura del documento </a>como el encabezado de la sección implícita o explícita a la que pertenece.</p>
+
+<p>Su <em>text</em>o para el algoritmo de estructura es el texto del primer elemento de encabezado HTML de más alto rango (ip.ej., el primer {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }} o {{ HTMLElement("h6") }} con el número más pequeño entre sus descendientes) y el <em>rango</em> es el rango del mismo elemento de encabezado HTML.</p>
+
+<p>Por tanto, este elemento agrupa varios encabezados, pero solo el primero contribuye a la estructura del documento. Permite asociar títulos secundarios, como subencabezados, títulos alternativos, e incluso lemas, con el encabezado principal, sin contaminar la estructura del documento.</p>
+
+<p>Este elemento se fue removido de la especificacion HTML5 (W3C), por favor no usar mas.</p>
+
+<h3 id="Contexto_de_uso">Contexto de uso</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Contenido permitido</td>
+   <td>Cero o más elementos HTML de encabezado ({{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }})</td>
+  </tr>
+  <tr>
+   <td>Omisión de etiqueta</td>
+   <td>Ninguna, ambas, la etiqueta de inicio y fin son obligatorias</td>
+  </tr>
+  <tr>
+   <td>Elementos padre permitidos</td>
+   <td>
+    <p>Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">flujo de contenido</a>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Documento nomativo</td>
+   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-hgroup-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-hgroup-element">HTML5, section 4.4.7</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Atributos">Atributos</h3>
+
+<p>Este elemento no tiene más atributos que los <a href="/en/HTML/Global_attributes" rel="internal">atributos globales</a>, común a todos los elementos.</p>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<div class="note">
+<p>Si bien el elemento <code>&lt;hgroup&gt;</code> se eliminó de la especificación HTML5 (W3C), todavía se mantiene en la versión WHATWG de HTML. De todos modos, está parcialmente implementado en la mayoría de los navegadores, por lo que es improbable que desaparezca.<br>
+ Sin embargo, dado que el propósito principal del elemento <code>&lt;hgroup&gt;</code> es afectar cómo <a href="/en-US/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines#The_HTML5_outline_algorithm">el algoritmo de generación de esquemas de documento</a> muestra los encabezados, pero <strong>dicho algoritmo no ha sido implementado por ningún navegador</strong>, la semántica de <code>&lt;hgroup&gt;</code> es por el momento solo teórica.<br>
+ La especificación HTML5 (W3C) aconseja entonces cómo maquetar <a href="https://www.w3.org/TR/html52/common-idioms-without-dedicated-elements.html#common-idioms-without-dedicated-elements">subtítulos, títulos alternativos y lemas</a> sin utilizar <code>&lt;hgroup&gt;</code>.</p>
+</div>
+
+<h3 class="editable" id="Interfaz_DOM">Interfaz DOM</h3>
+
+<p>Este elemento implementa la interfaz<code> <a href="/es/DOM/element" title="en/DOM/element">HTMLElement</a></code>.</p>
+
+<h3 id="Ejemplos">Ejemplos</h3>
+
+<pre class="brush: html">&lt;hgroup&gt;
+  &lt;h1&gt;Main title&lt;/h1&gt;
+  &lt;h2&gt;Secondary title&lt;/h2&gt;
+&lt;/hgroup&gt;
+</pre>
+
+<h3 id="Compatibilidad">Compatibilidad</h3>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>5</td>
+   <td>{{ CompatGeckoDesktop("2.0") }}</td>
+   <td>9.0</td>
+   <td>11.10</td>
+   <td>4.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.2</td>
+   <td>{{ CompatGeckoMobile("2.0") }}</td>
+   <td>9.0</td>
+   <td>11.0</td>
+   <td>5.0 (iOS 4.2)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Ver_también">Ver también</h3>
+
+<ul>
+ <li>Otros elementos relacionados a sección: {{ HTMLElement("body") }}, {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};</li>
+ <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Secciones y estructuras de un documento HTML5</a>.</li>
+</ul>
diff --git a/files/es/web/html/element/hr/index.html b/files/es/web/html/element/hr/index.html
new file mode 100644
index 0000000000..31b24bd319
--- /dev/null
+++ b/files/es/web/html/element/hr/index.html
@@ -0,0 +1,157 @@
+---
+title: <hr>
+slug: Web/HTML/Element/hr
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/hr
+original_slug: Web/HTML/Elemento/hr
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><span class="comment">descripción de uno o dos párrafos</span>El <strong>elemento HTML &lt;hr&gt; </strong>representa un cambio de tema entre párrafos (por ejemplo, un cambio de escena en una historia, un cambio de tema en una sección). En versiones previas de HTML representaba una línea horizontal. Aún puede ser representada como una línea horizontal en los navegadores visuales, pero ahora es definida en términos semánticos y no tanto en términos representativos, por tanto para dibujar una línea horizontal se debería usar el CSS apropiado.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;hr/&gt;</code> (solo tiene una).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Nada, es un "elemento vacío" del un Glosario.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">Valor</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title </code></td>
+   <td>Texto</td>
+   <td>Implícito</td>
+   <td>Título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style </code></td>
+   <td>Declaraciones de estilo</td>
+   <td>Implícito</td>
+   <td>Información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id </code></td>
+   <td>Un 'nombre'</td>
+   <td>Implícito</td>
+   <td>Identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class </code></td>
+   <td>Lista de clases CSS</td>
+   <td>implícito</td>
+   <td>Identificador a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir </code></td>
+   <td>Uno de los siguientes: <code>"ltr"</code> o <code>"rtl"</code></td>
+   <td>Implícito</td>
+   <td>Dirección del texto.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang </code></td>
+   <td>Código de idioma</td>
+   <td>Implícito</td>
+   <td>Información sobre el idioma.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">align </code></td>
+   <td>uno de los siguientes: <code>"left", "center", "right".</code></td>
+   <td>Implícito. Por defecto: <code>"center"</code></td>
+   <td>Indica la alineación horizontal.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">noshade </code></td>
+   <td><code>"noshade"</code></td>
+   <td>Implícito</td>
+   <td>Elimina el relieve.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">size </code></td>
+   <td>Una cantidad, de píxeles</td>
+   <td>Implícito</td>
+   <td>Indica la altura de la linea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">width </code></td>
+   <td>Una cantidad, de píxeles, o un porcentaje.</td>
+   <td>Implícito. por defecto: 100%</td>
+   <td>Indica la anchura.</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">Valor</th>
+   <th>Descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">  &lt;p&gt;Este es un parrafo unicamente visual para ver el uso de
+ la etiqueta hr&lt;/p&gt;
+  &lt;hr/&gt;
+  &lt;p&gt;Este es el segundo parrafo, separado del primero por la etiqueta hr, que puede
+representarse mediante una línea horizontal.&lt;/p&gt;
+</pre>
+
+<h3 id="Muestra">Muestra</h3>
+
+<p>Este es un parrafo unicamente visual para ver el uso de la etiqueta hr</p>
+
+<hr>
+<p>Este es el segundo parrafo, separado del primero por una linea horizontal</p>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p> </p>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-HR"><strong>hr</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p><span class="comment">secciones futuras: == Soporte de los navegadores == == Valores por defecto y visualización en Firefox ==</span></p>
+
+<div class="note">
+<p>Este documento está siendo editado, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en la elaboración de este documento? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p> </p>
diff --git a/files/es/web/html/element/html/index.html b/files/es/web/html/element/html/index.html
new file mode 100644
index 0000000000..9815bb0fd7
--- /dev/null
+++ b/files/es/web/html/element/html/index.html
@@ -0,0 +1,177 @@
+---
+title: <html>
+slug: Web/HTML/Element/html
+tags:
+  - Element
+  - Elemento
+  - HTML
+  - HTML Root Element
+  - HTML elemento raiz
+  - HTML:Elemento
+  - Reference
+  - Referencia
+  - Todas_las_Categorías
+  - Web
+translation_of: Web/HTML/Element/html
+original_slug: Web/HTML/Elemento/html
+---
+<p>{{HTMLRef}}</p>
+
+<p>El <strong>elemento HTML <code>&lt;html&gt;</code></strong> (o <em>elemento HTML raiz</em>) representa la raiz de un documento HTML. El resto de elementos descienden de este elemento.</p>
+
+<p>Dado que el elemento <code>&lt;html&gt;</code> es el primero en un documento, aparte de los comentarios, se llama el elemento raíz. A pesar de que esta etiqueta puede ser implicita, o no requerida en {{glossary("HTML")}}, sí es requerida para abrir y cerrar en {{glossary("XHTML")}}.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de Contenido</a></th>
+   <td>Ninguna.</td>
+  </tr>
+  <tr>
+   <th>Contenido permitido</th>
+   <td>Un elemento {{HTMLElement("head")}} seguido de un elemento {{HTMLElement("body")}}.</td>
+  </tr>
+  <tr>
+   <th>Omisión de etiqueta</th>
+   <td>
+    <p>La etiqueta de inicio puede omitirse si lo primero que hay en el interior del elemento &lt;html&gt; no es un comentario.<br>
+     La etiqueta final puede omitirse si el elemento &lt;html&gt; no está inmediatamente seguido por un comentario y contiene un elemento {{HTMLElement("body")}}, o bien que no esté vacío, o cuya etiqueta de inicio está presente.</p>
+   </td>
+  </tr>
+  <tr>
+   <th>Elementos padres permitidos</th>
+   <td>Como elemento raiz de un documento, o donde se permite un fragmento de subdocumento en un documento compuesto.</td>
+  </tr>
+  <tr>
+   <th>Interfaz DOM</th>
+   <td>{{domxref("HTMLHtmlElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="/es/docs/Web/HTML/Atributos_Globales" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a><span style="line-height: 21px;">.</span></p>
+
+<dl>
+ <dt>{{htmlattrdef("manifest")}} {{obsolete_inline}}</dt>
+ <dd>Especifica la dirección URL de un manifiesto de recursos que indica los recursos que deben ser almacenados en la caché local. Consulte <a href="https://developer.mozilla.org/es/docs/Web/HTML/Using_the_application_cache" title="/en-US/docs/HTML/Using_the_application_cache">Uso de la cache de la aplicación</a> para obtener más información.</dd>
+ <dt>{{htmlattrdef("version")}} {{obsolete_inline}}</dt>
+ <dd>Especifica la versión {{glossary("DTD", "Document Type Definition")}} de HTML del documento actual. Este atributo no es necesario, porque es redundante con la información de versión en la declaración de tipo de documento.</dd>
+ <dt>{{htmlattrdef("xmlns")}} </dt>
+ <dd>Especifica el Espacio de nombres XML del documento. El valor por defecto es <code>"http://www.w3.org/1999/xhtml"</code>. En XHTML es requerido y en HTML es opcional.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>El DOCTYPE usado en el siguiente ejemplo indica que es un documento HTML5.</p>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;...&lt;/head&gt;
+  &lt;body&gt;...&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('HTML WHATWG', 'semantics.html#the-html-element', '&lt;html&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambios desde la última instantánea.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'semantics.html#the-html-element', '&lt;html&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Añadido soporte para el atributo <code>manifest</code> (en desuso después).<br>
+    El Atributo <code>version</code> es obsoleto.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.3', '&lt;html&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>El Atributo <code>version</code> está en desuso</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>manifest</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>manifest</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.9")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>MathML top-level element: {{MathMLElement("math")}}</li>
+ <li>SVG top-level element: {{SVGElement("svg")}}</li>
+</ul>
diff --git a/files/es/web/html/element/i/index.html b/files/es/web/html/element/i/index.html
new file mode 100644
index 0000000000..86d425cf1e
--- /dev/null
+++ b/files/es/web/html/element/i/index.html
@@ -0,0 +1,113 @@
+---
+title: i
+slug: Web/HTML/Element/i
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/i
+original_slug: Web/HTML/Elemento/i
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Muestra el texto marcado con un estilo en cursiva o italica.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;i&gt; y &lt;/i&gt; (Ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>lista de clases separadas por espacios en blanco.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">  &lt;p&gt;
+       Texto normal y... &lt;i&gt;Texto 'inclinado'&lt;/i&gt;
+  &lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/element/iframe/index.html b/files/es/web/html/element/iframe/index.html
new file mode 100644
index 0000000000..a79b497c43
--- /dev/null
+++ b/files/es/web/html/element/iframe/index.html
@@ -0,0 +1,305 @@
+---
+title: '<iframe>: el elemento Inline Frame'
+slug: Web/HTML/Element/iframe
+tags:
+  - Contenido
+  - Contenido incrustado
+  - Elemento
+  - Embebido
+  - HTML
+  - Incrustado
+  - Marcos
+  - Web
+  - iframe
+translation_of: Web/HTML/Element/iframe
+original_slug: Web/HTML/Elemento/iframe
+---
+<div>{{HTMLRef}}</div>
+
+<p class="seoSummary">El <strong>elemento HTML <code>&lt;iframe&gt;</code></strong> (de inline frame) representa un {{Glossary("contexto de navegación")}} anidado, el cual permite incrustrar otra página HTML en la página actual.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/iframe.html", "tabbed-standard")}}</div>
+
+<p>Cada elemento <code>&lt;iframe&gt;</code> tiene su propio <a href="/es/docs/Web/API/History">historial de sesión</a> y su propio objeto <a href="/es/docs/Web/API/Document">Documento</a>. El contexto de navegación que incluye el contenido implícito se llama <em>contexto de navegación principal</em>. El contexto de navegación de nivel superior (que no tiene padre) es típicamente la ventana del navegador, representado por el objeto {{domxref("Window")}}.</p>
+
+<div class="blockIndicator warning">
+<p>Debido a que cada contexto de navegación es un entorno de documento completo, cada <code>&lt;iframe&gt;</code> en una página requiere más memoria y otros recursos informáticos. Aunque teóricamente puede utilizar tantos <code>&lt;iframe&gt;</code> como desee, compruebe si hay problemas de rendimiento.</p>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenidos</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a>, contenido incrustado, contenido interactivo, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_tangible">contenido tangible</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Contenido alternativo que normalmente no se renderiza para los navegadores que no son compatibles con el elemento <code>&lt;iframe&gt;</code>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padres permitidos</th>
+   <td>Cualquier elemento que acepte contenido incrustado.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("img")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM </th>
+   <td>{{domxref("HTMLIFrameElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento admite <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<ul>
+ <li>En el atributo <code>target</code> de los elementos {{HTMLElement("a")}}, {{HTMLElement("from")}} y {{HTMLElement("base")}}.</li>
+ <li>En el atributo <code>formtarget</code> de los elementos {{HTMLElement("input")}} y {{HTMLElement("button")}}</li>
+ <li>En el parámetro <code>windowName</code> en el método {{domxref("Window.open()","window.open()")}}.</li>
+</ul>
+
+<dl>
+ <dt>{{htmlattrdef("allow")}}</dt>
+ <dd>Especifíca una <a href="/en-US/docs/Web/HTTP/Feature_Policy">política de características</a> para el <code>&lt;iframe&gt;</code>. Vea el articulo <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Privacy">Privacy, permissions, and information security</a> para detalles en temas de seguridad y como <code>&lt;iframe&gt;</code> funciona con las Politicas de Herramientas para mantener los sistemas seguros.</dd>
+ <dt>{{htmlattrdef("allowfullscreen")}}</dt>
+ <dd>Definido como <code>true</code> si el <code>&lt;iframe&gt;</code> puede activar el modo a pantalla completa llamando al método {{domxref("Element.requestFullscreen", "requestFullscreen()")}}.</dd>
+ <dd>
+ <div class="blockIndicator note">
+ <p>Se considera un atributo heredado y se redefine como <code>allow="fullscreen"</code>.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("allowpaymentrequest")}}</dt>
+ <dd>Definido como <code>true</code> si se debe permitir que un <code>&lt;iframe&gt;</code> de origen cruzado pueda invocar el <a href="/en-US/docs/Web/API/Payment_Request_API">API de solicitud de pago</a>. </dd>
+ <dd>
+ <div class="blockIndicator note">
+ <p>Se considera un atributo heredado y se redefine como <code>allow="payment"</code>.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("csp")}} {{experimental_inline}}</dt>
+ <dd>Una <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP">Politica de Seguridad del Contenido</a> aplicada para el recurso incrustado. Vea {{domxref("HTMLIFrameElement.csp")}} para detalles.</dd>
+ <dt>{{ htmlattrdef("height") }}</dt>
+ <dd>Indica la altura del frame {{ HTMLVersionInline(5) }}en píxeles CSS, o {{ HTMLVersionInline(4.01) }} en píxeles o como un porcentaje.</dd>
+ <dt id="name-attribute">{{htmlattrdef("importance")}} {{experimental_inline}}</dt>
+ <dd>La prioridad de descarga en el recurso para el atributo <code>src</code> del <code>&lt;iframe&gt;</code>. Valores permitidos:
+ <ul>
+  <li><code>auto</code>: (default) Sin preferencia. El buscador utiliza sus propias heurísticas para decidir la prioridad del recurso.</li>
+  <li><code>high</code>: El recurso debe ser descargado antes que otros recursos de baja-prioridad de los recursos de la página.</li>
+  <li><code>low</code>: El recurso debe ser descargado después de otros recursos de alta-prioridad de los recursos de la página.</li>
+ </ul>
+
+ <dl>
+ </dl>
+ </dd>
+ <dt>{{ htmlattrdef("name") }}</dt>
+ <dd>Nombre objetivo para el contexto de navegación incrustado. Se puede utilizar:
+ <ul>
+  <li>En el atributo target de los elementos {{HTMLElement("a")}}, {{HTMLElement("from")}} y {{HTMLElement("base")}}.</li>
+  <li>En el atributo formtarget de los elementos {{HTMLElement("input")}} y {{HTMLElement("button")}}</li>
+  <li>En el parámetro windowName en el método {{domxref("Window.open()","window.open()")}}.</li>
+ </ul>
+ </dd>
+ <dt id="attr-referrer">{{htmlattrdef("referrerpolicy")}}</dt>
+ <dd>Indicates which <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer">referrer</a> to send when fetching the frame's resource:
+ <ul>
+  <li><code>no-referrer</code>: The {{HTTPHeader("Referer")}} header will not be sent.</li>
+  <li><code>no-referrer-when-downgrade</code> (default): The {{HTTPHeader("Referer")}} header will not be sent to {{Glossary("origin")}}s without {{Glossary("TLS")}} ({{Glossary("HTTPS")}}).</li>
+  <li><code>origin</code>: The sent referrer will be limited to the origin of the referring page: its <a href="https://developer.mozilla.org/en-US/docs/Archive/Mozilla/URIScheme">scheme</a>, {{Glossary("host")}}, and {{Glossary("port")}}.</li>
+  <li><code>origin-when-cross-origin</code>: The referrer sent to other origins will be limited to the scheme, the host, and the port. Navigations on the same origin will still include the path.</li>
+  <li><code>same-origin</code>: A referrer will be sent for {{Glossary("Same-origin policy", "same origin")}}, but cross-origin requests will contain no referrer information.</li>
+  <li><code>strict-origin</code>: Only send the origin of the document as the referrer when the protocol security level stays the same (HTTPS→HTTPS), but don't send it to a less secure destination (HTTPS→HTTP).</li>
+  <li><code>strict-origin-when-cross-origin</code>: Send a full URL when performing a same-origin request, only send the origin when the protocol security level stays the same (HTTPS→HTTPS), and send no header to a less secure destination (HTTPS→HTTP).</li>
+  <li><code>unsafe-url</code>: The referrer will include the origin <em>and</em> the path (but not the <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/hash">fragment</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/password">password</a>, or <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/username">username</a>). <strong>This value is unsafe</strong>, because it leaks origins and paths from TLS-protected resources to insecure origins.</li>
+ </ul>
+ </dd>
+ <dd>
+ <ul>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("sandbox")}}</dt>
+ <dd>Applies extra restrictions to the content in the frame. The value of the attribute can either be empty to apply all restrictions, or space-separated tokens to lift particular restrictions:
+ <ul>
+  <li><code>allow-forms</code>: Allows the resource to submit forms. If this keyword is not used, form submission is blocked.</li>
+  <li><code>allow-modals</code>: Lets the resource <a href="https://html.spec.whatwg.org/multipage/origin.html#sandboxed-modals-flag">open modal windows</a>.</li>
+  <li><code>allow-orientation-lock</code>: Lets the resource <a href="https://developer.mozilla.org/en-US/docs/Web/API/Screen/lockOrientation">lock the screen orientation</a>.</li>
+  <li><code>allow-pointer-lock</code>: Lets the resource use the <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a>.</li>
+  <li><code>allow-popups</code>: Allows popups (such as <code>window.open()</code>, <code>target="_blank"</code>, or <code>showModalDialog()</code>). If this keyword is not used, the popup will silently fail to open.</li>
+  <li><code>allow-popups-to-escape-sandbox</code>: Lets the sandboxed document open new windows without those windows inheriting the sandboxing. For example, this can safely sandbox an advertisement without forcing the same restrictions upon the page the ad links to.</li>
+  <li><code>allow-presentation</code>: Lets the resource start a <a href="https://developer.mozilla.org/en-US/docs/Web/API/PresentationRequest">presentation session</a>.</li>
+  <li><code>allow-same-origin</code>: If this token is not used, the resource is treated as being from a special origin that always fails the {{Glossary("same-origin policy")}}.</li>
+  <li><code>allow-scripts</code>: Lets the resource run scripts (but not create popup windows).</li>
+  <li><code>allow-storage-access-by-user-activation</code> {{experimental_inline}}: Lets the resource request access to the parent's storage capabilities with the <a href="https://developer.mozilla.org/en-US/docs/Web/API/Storage_Access_API">Storage Access API</a>.</li>
+  <li><code>allow-top-navigation</code>: Lets the resource navigate the top-level browsing context (the one named <code>_top</code>).</li>
+  <li><code>allow-top-navigation-by-user-activation</code>: Lets the resource navigate the top-level browsing context, but only if initiated by a user gesture.</li>
+ </ul>
+
+ <div class="note"><strong>Notes about sandboxing:</strong>
+
+ <ul>
+  <li>When the embedded document has the same origin as the embedding page, it is <strong>strongly discouraged</strong> to use both <code>allow-scripts</code> and <code>allow-same-origin</code>, as that lets the embedded document remove the <code>sandbox</code> attribute — making it no more secure than not using the <code>sandbox</code> attribute at all.</li>
+  <li>Sandboxing is useless if the attacker can display content outside a sandboxed <code>iframe</code> — such as if the viewer opens the frame in a new tab. Such content should be also served from a <em>separate origin</em> to limit potential damage.</li>
+  <li>The <code>sandbox</code> attribute is unsupported in Internet Explorer 9 and earlier.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>{{ htmlattrdef("seamless") }} </dt>
+ <dd>This Boolean attribute indicates that the browser should render the inline frame in a way that makes it appear to be part of the containing document, for example by applying CSS styles that apply to the <code>&lt;iframe&gt;</code> to the contained document before styles specified in that document, and by opening links in the contained documents in the parent browsing context (unless another setting prevents this).</dd>
+ <dt>{{ htmlattrdef("src") }}</dt>
+ <dd>The URL of the page to embed.</dd>
+ <dt>{{ htmlattrdef("srcdoc") }} </dt>
+ <dd>The content of the page that the embedded context is to contain.</dd>
+ <dt>{{ htmlattrdef("width") }}</dt>
+ <dd>Indicates the width of the frame {{ HTMLVersionInline(5) }} in CSS pixels, or {{ HTMLVersionInline(4.01) }} in pixels or as a percentage.</dd>
+</dl>
+
+<h3 id="Atributos_obsoletos">Atributos obsoletos</h3>
+
+<p>Estos atributos están obsoletos y es posible que ya no sean compatibles con todos los agentes de usuario. No debe utilizarlos en contenido nuevo y tratar de eliminarlos del contenido existente.</p>
+
+<dl>
+ <dt>{{htmlattrdef("align")}} {{deprecated_inline("html4.01")}}, {{obsolete_inline("html5")}}</dt>
+ <dd><span id="result_box" lang="es"><span class="hps">La alineación</span> <span class="hps">de este elemento</span> <span class="hps">con respecto al</span> <span class="hps">contexto que lo rodea.</span></span></dd>
+ <dt>{{ htmlattrdef("frameborder") }} {{ obsolete_inline("html5")}} </dt>
+ <dd>El valor 1 (por defecto) indica al navegador establecer una frontera entre este marco y todo otro marco. <span class="long_text" id="result_box" lang="es"><span class="gt-trans-draggable hps">El valor 0</span> <span class="gt-trans-draggable hps">indica</span> <span class="gt-trans-draggable hps">que el navegador no</span> establece<span class="gt-trans-draggable hps"> una</span> <span class="gt-trans-draggable hps">frontera</span> <span class="gt-trans-draggable hps">entre este marco y</span> <span class="gt-trans-draggable hps">otros marcos.</span></span></dd>
+ <dt>{{ htmlattrdef("longdesc") }} {{ obsolete_inline("html5")}} </dt>
+ <dd>Una URI de una descripción larga del marco. Debido al mal uso generalizado, esto no es útil para navegadores no visuales.</dd>
+ <dt>{{ htmlattrdef("marginheight") }} {{ obsolete_inline("html5") }} </dt>
+ <dd>La cantidad de espacio en píxeles entre el contenido del marco y sus márgenes superior e inferior.</dd>
+ <dt>{{ htmlattrdef("marginwidth") }} {{ obsolete_inline("html5") }} </dt>
+ <dd>La cantidad de espacio en píxeles entre el contenido del marco y sus márgenes izquierdo y derecho.</dd>
+ <dt>{{ htmlattrdef("scrolling") }} {{ obsolete_inline("html5") }} </dt>
+ <dd>Indica cuándo el navegador debe proporcionar una barra de desplazamiento para el marco:
+ <ul>
+  <li><code>auto</code>: Sólo cuando el contenido del marco es mayor que sus dimensiones.</li>
+  <li><code>yes</code>: Muestra siempre una barra de desplazamiento.</li>
+  <li><code>no</code>: No muestr la barra de desplazamiento nunca.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h3 id="Atributos_no_estándar">Atributos no estándar</h3>
+
+<dl>
+ <dt>{{htmlattrdef("mozbrowser")}} {{non-standard_inline}}</dt>
+ <dd>
+ <div class="blockIndicator note">
+ <p>See {{bug(1318532)}} for exposing this to WebExtensions in Firefox.</p>
+ </div>
+ Makes the <code>&lt;iframe&gt;</code> act like a top-level browser window. See <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Gecko/Chrome/API/Browser_API">Browser API</a> for details.<br>
+ <strong>Available only to <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a>.</strong></dd>
+ <dt>{{ htmlattrdef("mozallowfullscreen") }} {{ non-standard_inline() }}</dt>
+ <dd>In Gecko 9.0 or later, this attribute can be set to <code>true</code> if the frame is allowed to be placed into full screen mode by calling its {{ domxref("element.mozRequestFullScreen()") }} method. If this isn't set, the element can't be placed into full screen mode.</dd>
+ <dt>{{ htmlattrdef("webkitallowfullscreen") }} {{ non-standard_inline() }}</dt>
+ <dd>In Chrome 17 or later (and maybe earlier), this attribute can be set to <code>true</code> if the frame is allowed to be placed into full screen mode by calling its {{ domxref("element.webkitRequestFullScreen()") }} method. If this isn't set, the element can't be placed into full screen mode.</dd>
+ <dt>{{ htmlattrdef("mozapp") }} {{ non-standard_inline() }}</dt>
+ <dd>For frames hosting an <a href="/en/Apps" title="https://developer.mozilla.org/en/OpenWebApps">open web app</a>, this specifies the URL of the <a href="/en/Apps/Manifest" title="https://developer.mozilla.org/en/Apps/Manifest">app manifest</a>. This ensures that the app is loaded with the right permissions. See <a href="/en/DOM/Using_the_Browser_API" title="https://developer.mozilla.org/en/DOM/Using_the_Browser_API">Using the Browser API</a> for details. Available in Gecko 13.0 and later.</dd>
+ <dt>{{ htmlattrdef("remote") }} {{ non-standard_inline() }}</dt>
+ <dd>Load the frame's page in a separate content process.</dd>
+</dl>
+
+<h2 id="Secuencia_de_comandos">Secuencia de comandos</h2>
+
+<p>Inline frames, like {{HTMLElement("frame")}} elements, are included in the {{domxref("window.frames")}} pseudo-array.</p>
+
+<p>With the DOM {{domxref("HTMLIFrameElement")}} object, scripts can access the {{domxref("window")}} object of the framed resource via the {{domxref("HTMLIFrameElement.contentWindow", "contentWindow")}} property. The {{domxref("HTMLIFrameElement.contentDocument", "contentDocument")}} property refers to the <code>document</code> inside the <code>&lt;iframe&gt;</code>, same as <code>contentWindow.document</code>.</p>
+
+<p>From the inside of a frame, a script can get a reference to its parent window with {{domxref("window.parent")}}.</p>
+
+<p>Script access to a frame's content is subject to the {{Glossary("same-origin policy")}}. Scripts cannot access most properties in other <code>window</code> objects if the script was loaded from a different origin, including scripts inside a frame accessing the frame's parent. Cross-origin communication can be achieved using {{domxref("Window.postMessage()")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Example1" name="Example1">Un &lt;iframe&gt; simple</h3>
+
+<p>Un <code>&lt;iframe&gt;</code> en acción. Después de crear el marco, cuando el usuario hace clic en un botón, su título se muestra en una alerta.</p>
+
+<h4 id="HTML">HTML</h4>
+
+<pre><code>&lt;iframe src="https://mdn-samples.mozilla.org/snippets/html/iframe-simple-contents.html" title="iframe Example 1" width="400" height="300"&gt;
+  &lt;p&gt;Your browser does not support iframes.&lt;/p&gt;
+&lt;/iframe&gt;</code></pre>
+
+<h4 id="Resultado">Resultado</h4>
+
+<p>{{ EmbedLiveSample('Example1', 640,400)}}</p>
+
+<h3 id="Example2" name="Example2">Abrir un enlace en un &lt;iframe&gt; en otra pestaña</h3>
+
+<p>En este ejemplo, se muestra un mapa de Google en un marco.</p>
+
+<h4 id="HTML_2">HTML</h4>
+
+<pre><code>&lt;iframe id="Example2"
+    title="iframe Example 2"
+    width="400" height="300"
+    style="border:none"
+    src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;q=buenos+aires&amp;sll=37.0625,-95.677068&amp;sspn=38.638819,80.859375&amp;t=h&amp;hnear=Buenos+Aires,+Argentina&amp;z=11&amp;ll=-34.603723,-58.381593&amp;output=embed"&gt;
+&lt;/iframe&gt;</code></pre>
+
+<h4 id="Resultado_2">Resultado</h4>
+
+<p>{{ EmbedLiveSample('Example2', 640, 400)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrerpolicy attribute')}}</td>
+   <td>{{Spec2('Referrer Policy')}}</td>
+   <td>Added the <code>referrerpolicy</code> attribute.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'iframe-embed-object.html#the-iframe-element', '&lt;iframe&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'embedded-content-0.html#the-iframe-element', '&lt;iframe&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'present/frames.html#h-16.5', '&lt;iframe&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Screen Orientation')}}</td>
+   <td>{{Spec2('Screen Orientation')}}</td>
+   <td>Adds <code>allow-orientation-lock</code> to the <code>sandbox</code> attribute.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Presentation','#sandboxing-and-the-allow-presentation-keyword','allow-presentation')}}</td>
+   <td>{{Spec2('Presentation')}}</td>
+   <td>Adds <code>allow-presentation</code> to the <code>sandbox</code> attribute</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Notes">Notes</h2>
+
+<div class="geckoVersionNote">
+<p>{{ gecko_callout_heading("6.0") }}</p>
+
+<p>Starting in Gecko 6.0 {{ geckoRelease("6.0") }}, rendering of inline frames correctly respects the borders of their containing element when they're rounded using {{ cssxref("border-radius") }}.</p>
+</div>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("html.elements.iframe", 3)}}</p>
diff --git a/files/es/web/html/element/image/index.html b/files/es/web/html/element/image/index.html
new file mode 100644
index 0000000000..e5e3765667
--- /dev/null
+++ b/files/es/web/html/element/image/index.html
@@ -0,0 +1,19 @@
+---
+title: <image>
+slug: Web/HTML/Element/image
+tags:
+  - HTML
+translation_of: Web/HTML/Element/image
+original_slug: Web/HTML/Elemento/image
+---
+<div>{{non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento HTML <font face="Consolas, Liberation Mono, Courier, monospace"><code>&lt;image&gt;</code> fue </font>un elemento experimental diseñado para mostrar imágenes . Nuca fue implementado y el elemento estándar {{HTMLElement("img")}} debe de ser usado .</p>
+
+<div class="note">
+<p><strong>No usar esto ! </strong>Para mostrar imagenes , usar el elemento estándar {{HTMLElement("img")}} .</p>
+</div>
+
+<p>Notar que hasta Firefox 22 , aunque no era soportado , un elemento <code>&lt;image&gt;</code> era asociado a un {{domxref("HTMLSpanElement")}} . Después fue arreglado y ahora es asociado a {{domxref("HTMLElement")}} , como es solicitado por la especificación .</p>
diff --git a/files/es/web/html/element/img/index.html b/files/es/web/html/element/img/index.html
new file mode 100644
index 0000000000..becc547c14
--- /dev/null
+++ b/files/es/web/html/element/img/index.html
@@ -0,0 +1,340 @@
+---
+title: img
+slug: Web/HTML/Element/img
+tags:
+  - Contenido
+  - Elemento
+  - HTML
+  - Incrustado
+translation_of: Web/HTML/Element/img
+original_slug: Web/HTML/Elemento/img
+---
+<p>El elemento de imagen HTML <span class="seoSummary"><code><strong>&lt;img&gt;</strong></code></span> representa una imagen en el documento.</p>
+
+<div class="note">
+<p><strong>Nota:</strong><br>
+ Los navegadores no siempre muestran la imagen a la que el elemento hace referencia. Es el caso de los navegadores no gráficos (incluyendo aquellos usados por personas con problemas de visión), sí el usuario elige no mostrar la imagen, o sí el navegador es incapaz de mostrarla porque no es válida o <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/img#Supported_image_formats">soportada</a>. En ese caso, el navegador la reemplazará con el texto definido en el atributo {{htmlattrdef("alt", "img")}}.</p>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories">Cotenido de las categorias</a></th>
+   <td><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Flow_content">Contenido dinámico</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content">contenido estático</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Embedded_content">contenido incrustado</a>, contenido palpable. Si el elemento tiene un atributo {{htmlattrdef("usemap", "img")}}, it also is a part of the interactive content category.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno, es {{Glossary("empty element")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>Debe tener etiqueta de de inicio pero no tiene por qué haber de cierre.</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte contenido incrustado.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLImageElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye atributos globales.</p>
+
+<dl>
+ <dt>{{htmlattrdef("align")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}} Use the {{cssxref('vertical-align')}} CSS property</dt>
+ <dd>Alineamiento de la texto respecto al contexto que la rodea.</dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("alt")}}</dt>
+ <dd>Este atributo define el texto alternativo que describe la imagen, texto que los usuarios verán si la URL de la imagen es errónea o la imagen tiene un <a href="/es/docs/Web/HTML/Elemento/img$edit#Supported_image_formats">formato no soportado</a> o si la imagen aún no se ha descargado.</dd>
+ <dt>
+ <div class="note">
+ <p><strong>Nota: </strong>Omitir este atributo indica que la imagen es una parte clave del contenido, y no tiene equivalencia textual. Establecer este atributo como cadena vacía indica que la imagen no es una parte clave del contenido; los navegadores no gráficos pueden omitirlo.</p>
+ </div>
+ </dt>
+ <dt>{{htmlattrdef("border")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Anchura del borde alrededor de la imagen.</dd>
+ <dt>{{htmlattrdef("crossorigin")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>Este atributo enumerado indica si la búsqueda de la imagen debe ser por CORS o no. <a href="https://developer.mozilla.org/es/docs/Web/HTML/Imagen_con_CORS_habilitado">Imagen hablidata CORS</a> puede ser usada en el elemento {{HTMLElement("canvas")}} sin ser pintada. Los valores permitidos son:
+ <dl>
+  <dt><code>"anonymous"</code></dt>
+  <dd>Una petición cross-origin (i.e., with <code>Origin:</code> HTTP header) es realizada. Sin embargo, no fueron enviadas credenciales "<em>(i.e., no cookie, no X.509 certificate, and no HTTP Basic authentication is sent)</em>". Sí el servidor no emite credenciales al sitio de origen (no ajustando el <code>Access-Control-Allow-Origin:</code> HTTP header), la imagen será pintada y su uso restringido.</dd>
+  <dt><code>"use-credentials"</code></dt>
+  <dd>Una petición cross-origin (i.e., with <code>Origin:</code> HTTP header) es realizada con credenciales (i.e., a cookie, a certificate, and HTTP Basic authentication is performed). Sí el servidor no emite credenciales al sitio de origen (a través del <code>Access-Control-Allow-Credentials:</code> HTTP header), la imagen será pintada y su uso restringido.</dd>
+ </dl>
+
+ <p>Cuando no existe, el recurso es buscado sin petición CORS (i.e., <code>sin enviar el Origen:</code> HTTP header) , previniendo el uso no pintado del elemento {{HTMLElement('canvas')}}. Si es inválido, se maneja como si se hubiese usado <strong>anonymous</strong>. Ver <a href="https://developer.mozilla.org/es/docs/HTML/CORS_settings_attributes">atributos de configuración CORS</a> para más información.</p>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("height")}}</dt>
+ <dd>La altura de la imagen en píxeles CSS {{HTMLVersionInline(5)}} o píxeles o como porcentaje en {{HTMLVersionInline(4)}}.</dd>
+ <dt>{{htmlattrdef("hspace")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>El número de píxeles de espaciado a la izquierda y la derecha de la imagen.</dd>
+ <dt>{{htmlattrdef("ismap")}}</dt>
+ <dd>Este atributo boleano indica que la imagen es parte del mapa del lado del servidor. Así que, se envían las coordenadas precisas de un clic.
+ <div class="note">
+ <p><strong>Nota: </strong>Este atributo está permitido solo si el elemento<code> &lt;img&gt;</code> es descendiente de un elemento {{htmlelement("a")}} con un atributo {{htmlattrxref("href","a")}} válido.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("longdesc")}}</dt>
+ <dd>La URL como descripción de una imagen mostrada, complementa al texto de {{htmlattrdef("alt", "img")}}.</dd>
+ <dt>{{htmlattrdef("name")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>El nombre para el elemento. Soportado en {{HTMLVersionInline(4)}} solo para compatibilidad con versiones anteriores. En su lugar, usa el atributo <code><strong>id</strong></code>.</dd>
+ <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt>
+ <dd>Una cadena indicando que referencia usar cuando buscas un recurso:
+ <ul>
+  <li><code>"no-referrer"</code>: la cabecera no se envia.</li>
+  <li>"<code>no-referrer-when-downgrade</code>": la cabecera no será enviada cuando navegas hacia un origen sin TLS (HTTPS). <span id="result_box" lang="es"><span class="hps">E</span>s<span class="hps"> el comportamiento</span> <span class="hps">predeterminado</span><span class="hps">, si no se especifica en ninguna política.</span></span></li>
+  <li><code>"origin"</code>: el referente será el origen de la página; lo que sería el esquema, el anfitrión (host) y el puerto.</li>
+  <li>"origin-when-cross-origin": navega hacia otro origen limitado por el esquema, el anfitrión y el puerto, mientras navegas en el mismo origen incluirá el camino del referente.</li>
+  <li><code>"unsafe-url"</code>: el referente incluirá el origen y el camino (pero no el fragment, contraseña, o nombre de usuario). Este caso es arriegasdo porque puede haber una fuga del origen o el camino desde los recursos protegidos por TLS desde orígenes inseguros.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("sizes")}}{{HTMLVersionInline(5)}}</dt>
+ <dd>Una lista de una o más cadenas separadas por comas indicando el tamaño de la fuente. Cada tamaño de la fuente consiste en:
+ <ol>
+  <li>Codición de medios. Debe omitirse en el último ítem.</li>
+  <li>Valor del tamaño.</li>
+ </ol>
+
+ <p>El valor del tamaño de la fuente especifica el tamaño de la imagen incrustada. Se usa el tamaño actual de la fuente para seleccionar las fuentes soportadas por el atributo <code>srcset</code>, cuando esas fuentes son descritas usando el ancho (width). El tamaño de la fuente afecta al tamaño de la imagen (la imagen muestra tamaño si no se aplican estilos CSS). Si no hay atributo <code>srcset</code>, o no contiene valores con el ancho definido, entonces el atributo sizes no funciona.</p>
+ </dd>
+ <dt>{{htmlattrdef("src")}}</dt>
+ <dd>La URL de la imagen. Este atributo es obligatorio para el elemento &lt;img&gt;. En navegadores que soportan <code>srcset</code>, <code>src</code> es tratado como imagen candidata con una densidad del píxel <code>1x</code> sino una imagen estará definida en <code>srcset</code> o <code>srcset</code> contiene ancho.</dd>
+ <dt></dt>
+ <dt>{{htmlattrdef("srcset")}}{{HTMLVersionInline(5)}}</dt>
+ <dd>Una lista de una o más cadenas separadas por comas indicando las posibles fuentes para usar. Cada cadena está compuesta por:
+ <ol>
+  <li>URL de la imagen</li>
+  <li>Opcionalmente, espacios en blanco seguidos de:
+   <ul>
+    <li>Un ancho, que es un entero positivo seguido directamente por <code>'w'</code>. El ancho está dividido por el tamaño de la fuente dada en el atributo <code>sizes</code> para calcular la densidad del píxel.</li>
+    <li>Densidad del píxel, un positivo decimal seguido directamente de <code>'x'</code>.</li>
+   </ul>
+  </li>
+ </ol>
+
+ <p>Si no hay descriptores especificados, la fuente es asignada por defecto a <code>1x</code>.</p>
+
+ <p>Es inválido mezclar ancho y densidad del píxel en el mismo atributo <code>srcset</code>. Descriptores duplicados (por ejemplo, dos fuentes en el mismo <code>srcset</code> definidos ambos con '<code>2x</code>') son inválidos, también.</p>
+
+ <p>Los agentes de usuario son discretos al elegir cualquiera de las fuentes disponibles. <span id="result_box" lang="es"><span class="hps">Esto les proporciona</span> <span class="hps">un margen</span> <span class="hps">significativo para</span> <span class="hps">adaptar su</span> <span class="hps">selección basada en</span> <span class="hps">cosas como</span> <span class="hps">las preferencias del usuario</span> <span class="hps">o las condiciones</span> <span class="hps">de ancho de banda</span><span>.</span></span></p>
+ </dd>
+ <dt>{{htmlattrdef("width")}}</dt>
+ <dd>El ancho de la imagen en píxeles CSS {{HTMLVersionInline(5)}}, o píxeles o porcentaje en {{HTMLVersionInline(4)}}.</dd>
+ <dt>{{htmlattrdef("usemap")}}</dt>
+ <dd>La URL parcial (empezando con '#') de un <a href="https://developer.mozilla.org/en-US/docs/HTML/Element/map">mapa de imagea</a> asociado a un elemento.
+ <div class="note">
+ <p><strong>Nota: </strong>No puedes usar este atributo si el elemento <code>&lt;img&gt;</code> es descendiente de un elemento {{htmlelement("a")}} o {{HTMLElement("button")}}.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("vspace")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>El número de píxeles de espacio blanco insertado sobre y bajo la imagen.</dd>
+</dl>
+
+<h2 id="Formatos_de_imagen_soportada">Formatos de imagen soportada</h2>
+
+<p>El estándar de HTML no ofrece una lista de formatos de imagen soportados, de modo que cada agente de usuario soporta diferentes conjuntos de formatos. Gecko soporta:</p>
+
+<ul>
+ <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/JPEG">JPEG</a></li>
+ <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/Graphics_Interchange_Format">GIF</a>, including animated GIFs</li>
+ <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/Portable_Network_Graphics">PNG</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Animated_PNG_graphics">APNG</a> {{gecko_minversion_inline("1.9.2")}}</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/SVG">SVG</a> {{gecko_minversion_inline("2.0")}}</li>
+ <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/BMP_file_format">BMP</a></li>
+ <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/ICO_%28file_format%29">BMP ICO</a></li>
+ <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/ICO_%28file_format%29">PNG ICO</a> {{gecko_minversion_inline("9.0")}}</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota:</strong><br>
+ Soporte para formato <a class="external external-icon" href="http://en.wikipedia.org/wiki/X_BitMap">XBM</a> fue eliminado en Gecko 1.9.2.</p>
+</div>
+
+<h2 id="Interacción_con_CSS">Interacción con CSS</h2>
+
+<p>Respecto a CSS, <code>una &lt;img&gt;</code> es un <a href="https://developer.mozilla.org/es/docs/Web/CSS/Elemento_reemplazo">elemento de reemplazo</a>. No tiene base, asi que cuando las imágenes se usan en un contexto de formato en línea con {{cssxref("vertical-align")}}: <code>baseline</code>, el bajo de la imagen se posa sobre la base del contenedor.</p>
+
+<p>Dependiendo de su tipo, una imagen puede tener ancho y alto intrínseco, pero no necesariamente. Por ejempo, las imagenes SVG no tienen dimensiones intrínsecas.</p>
+
+<h2 id="Ejemplo_1">Ejemplo 1</h2>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-sm.png<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>MDN<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p><img alt="MDN" src="https://developer.cdn.mozilla.net/media/img/mdn-logo-sm.png"></p>
+
+<h2 id="Ejemplo_2_Enlace_con_imagen">Ejemplo 2: Enlace con imagen</h2>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>a</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>https://developer.mozilla.org/<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-sm.png<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>MDN<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>a</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<p><a href="https://developer.mozilla.org/"><img alt="MDN" src="https://developer.cdn.mozilla.net/media/img/mdn-logo-sm.png"> </a></p>
+
+<h2 id="Ejemplo_3_Uso_del_atributo_srcset">Ejemplo 3: Uso del atributo <code>srcset</code></h2>
+
+<p>El atributo <code>src</code> es un candidato en agentes de usuario <code>1x</code> que soporta <code>srcset.</code></p>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-sm.png<span class="punctuation token">"</span></span>
+      <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>MDN<span class="punctuation token">"</span></span>
+      <span class="attr-name token">srcset</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-HD.png 2x<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<h2 id="Ejemplo_4_Uso_de_atributos_srcset_y_sizes">Ejemplo 4: Uso de atributos <code>srcset</code> y <code>sizes</code></h2>
+
+<p>El atributo<code> src</code> es ignorado en agentes de usuario que soportan <code>srcset</code> cuando usan descriptores <code>'w'</code>. Cuando la condición de media <code>(min-width: 600px)</code> encaja, la imagen será 200px de ancho, de otra manera será 50vw de ancho (50% del ancho del dispositivo).</p>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>clock-demo-thumb-200.png<span class="punctuation token">"</span></span>
+      <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>Clock<span class="punctuation token">"</span></span>
+      <span class="attr-name token">srcset</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>clock-demo-thumb-200.png 200w, clock-demo-thumb-400.png 400w<span class="punctuation token">"</span></span>
+      <span class="attr-name token">sizes</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>(min-width: 600px) 200px, 50vw<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<article class="approved text-content">
+<div class="boxed translate-rendered">
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}}</td>
+   <td>{{Spec2('Referrer Policy')}}</td>
+   <td>Añadida la política del atributo<code> referrer</code></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'embedded-content.html#the-img-element', '&lt;img&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'embedded-content-0.html#the-img-element', '&lt;img&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/objects.html#h-13.2', '&lt;img&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>srcset</code></td>
+   <td>{{CompatChrome(34.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("32.0")}}<sup>[2]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera(21)}}</td>
+   <td>{{CompatSafari(7.1)}}</td>
+  </tr>
+  <tr>
+   <td><code>referrerpolicy</code></td>
+   <td>{{CompatChrome(46.0)}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("42.0")}}<sup>[3]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>srcset</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(34.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>21</td>
+   <td>iOS 8</td>
+   <td>{{CompatChrome(34.0)}}</td>
+  </tr>
+  <tr>
+   <td><code>referrerpolicy</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(46.0)}} [1]</td>
+   <td>{{CompatGeckoMobile("42.0")}}<sup>[3]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(46.0)}}<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Implementado como <code>referrerpolicy</code>  y tras una bandera.</p>
+
+<p>[2] Implementado tras una preferencia.</p>
+
+<p>[3] Desde Firefox 42 a Firefox 44, el atributo se llamó <code>referrer</code>.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{HTMLElement("picture")}}, {{HTMLElement("object")}} and {{HTMLElement("embed")}} elements</li>
+</ul>
+</div>
+</article>
diff --git a/files/es/web/html/element/index.html b/files/es/web/html/element/index.html
new file mode 100644
index 0000000000..d0c7ecd782
--- /dev/null
+++ b/files/es/web/html/element/index.html
@@ -0,0 +1,107 @@
+---
+title: Referencia de Elementos HTML
+slug: Web/HTML/Element
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+  - básico
+translation_of: Web/HTML/Element
+original_slug: Web/HTML/Elemento
+---
+<div>{{HTMLSidebar("Elements")}}</div>
+
+<p><span class="seoSummary">Esta página lista todos los {{Glossary("Element","elementos")}} {{Glossary("HTML")}}</span>. Están agrupados por funciones para ayudarte a encontrar lo que tienes en mente con facilidad. Aunque esta guía está escrita para aquellos que son nuevos escribiendo código, se pretende que sea una referencia útil para cualquiera.</p>
+
+<div class="note">
+<p>Para más información básica acerca de los elementos y atributos HTML, vea <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Introduction#Elements_%E2%80%94_the_basic_building_blocks">la sección sobre elementos en el artículo 'Introducción a HTML'</a>.</p>
+</div>
+
+<h2 id="Raíz_principal">Raíz principal</h2>
+
+<p>{{HTMLRefTable("HTML Root Element")}}</p>
+
+<h2 id="Metadatos_del_documento">Metadatos del documento</h2>
+
+<p>Los metadatos contienen información sobre la página. Esto incluye información sobre estilos, <em>scripts</em> y datos que ayudan al <em>software</em> ({{Glossary("search engine", "search engines")}}, {{Glossary("Browser","browsers")}}, etc.) a usar y generar la página. Los metadatos de estilos y <em>scripts</em> pueden estar definidos en la página o estar enlazados a otro fichero que contiene la información.</p>
+
+<p>{{HTMLRefTable("HTML Document Metadata")}}</p>
+
+<h2 id="Seccionamiento_básico">Seccionamiento básico</h2>
+
+<p>{{HTMLRefTable("Sectioning Root Element")}}</p>
+
+<h2 id="Seccionamiento_del_contenido">Seccionamiento del contenido</h2>
+
+<p>Los elementos de seccionamiento del contenido te permiten organizar los contenidos del documento en partes lógicas. Usa los elementos de seccionado para crear una descripción amplia de los contenidos de tu página, incluyendo el encabezado y pie de página y elementos para identificar secciones.</p>
+
+<p>{{HTMLRefTable("HTML Sections")}}</p>
+
+<h2 id="Contenido_del_texto">Contenido del texto</h2>
+
+<p>Utiliza los elementos HTML de contenido del texto para organizar bloques o secciones de contenido colocados entre los tags de apertura{{HTMLElement("body")}} y cierre. Es importante para la {{Glossary("accessibility")}} y el {{Glossary("SEO")}}, que estos elementos se identifiquen con el objetivo o la estructura de ese contenido.</p>
+
+<p>{{HTMLRefTable("HTML Grouping Content")}}</p>
+
+<h2 id="Semántica_del_texto_en_línea">Semántica del texto en línea</h2>
+
+<p>Utilice la semántica del texto en línea HTML para definir el significado, estructura, o el estilo de una palabra, una línea o cualquier pieza arbitraria de texto.</p>
+
+<p>{{HTMLRefTable("HTML Text-Level Semantics")}}</p>
+
+<h2 id="Imagen_y_multimedia">Imagen y multimedia</h2>
+
+<p>HTML soporta varios recursos multimedia como imágenes, audio, y video.</p>
+
+<p>{{HTMLRefTable("multimedia")}}</p>
+
+<h2 id="Contenido_incrustado">Contenido incrustado</h2>
+
+<p>Además de los contenidos multimedia habituales, HTML puede incluir otra variedad de contenidos, aunque no siempre es fácil de interactuar con ellos.</p>
+
+<p>{{HTMLRefTable({"include":["HTML embedded content"], "exclude":["multimedia"]})}}</p>
+
+<h2 id="Scripting">Scripting</h2>
+
+<p>Con el fin de crear contenido dinámico y aplicaciones Web, HTML soporta el uso de lenguajes de scripting, el más prominente es JavaScript. Ciertos elementos soportan esta capacidad.</p>
+
+<p>{{HTMLRefTable("HTML Scripting")}}</p>
+
+<h2 id="Ediciones_demarcadas">Ediciones demarcadas</h2>
+
+<p>Estos elementos permiten proporcionar indicios de que determinadas partes del texto han sido alteradas.</p>
+
+<p>{{HTMLRefTable("HTML Edits")}}</p>
+
+<h2 id="Tablas">Tablas</h2>
+
+<p>Estos elementos son usados para crear y manejar datos tabulados.</p>
+
+<p>{{HTMLRefTable("HTML tabular data")}}</p>
+
+<h2 id="Formularios">Formularios</h2>
+
+<p>HTML provee un número de elementos que pueden usarse conjuntamente para crear formularios los cuales el usuario puede completar y enviar al sitio Web o a una aplicación. Hay una gran cantidad de información acerca de ésto disponible en la <a href="/en-US/docs/Web/Guide/HTML/Forms">HTML forms guide</a>.</p>
+
+<p>{{HTMLRefTable({"include": ["HTML forms"], "exclude":["Deprecated"]})}}</p>
+
+<h2 id="Elementos_Interactivos">Elementos Interactivos</h2>
+
+<p>HTML ofrece una selección de elementos que pueden ayudar a crear objetos de interfaz de usuario interactivos.</p>
+
+<p>{{HTMLRefTable("HTML interactive elements")}}</p>
+
+<h2 id="Componentes_Web">Componentes Web</h2>
+
+<p>Los Componentes Web son una tecnología relacionada con HTML que hacen que sea posible, en esencia, crear y personalizar elementos como si fueran HTML normal. Además, pueden crear versiones personalizadas de los elementos HTML estándar.</p>
+
+<p>{{HTMLRefTable({"include":["Web Components"],"elements":["shadow"]})}}</p>
+
+<h2 id="Elementos_obsoletos_y_en_desuso">Elementos obsoletos y en desuso</h2>
+
+<div class="warning" style="font-size: 14px;">
+<p><strong>Advertencia:</strong> Estos son elementos HTML viejos los cuales están obsoletos y no deben usarse. <strong>Nunca debería usarlos en un nuevo proyecto y debería reemplazarlos en proyectos viejos tan pronto como sea posible.</strong> Se listan aquí solo con propósitos informativos.</p>
+</div>
+
+<p>{{HTMLRefTable({"include":["Deprecated","Obsolete"]})}}</p>
diff --git a/files/es/web/html/element/input/button/index.html b/files/es/web/html/element/input/button/index.html
new file mode 100644
index 0000000000..04bceffbd6
--- /dev/null
+++ b/files/es/web/html/element/input/button/index.html
@@ -0,0 +1,255 @@
+---
+title: <input type ="button">
+slug: Web/HTML/Element/input/button
+tags:
+  - Elemento
+  - Elemento Input
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Element/input/button
+original_slug: Web/HTML/Elemento/input/Botón
+---
+<p>{{HTMLRef}}</p>
+
+<p><span class="seoSummary">El elemento HTML <code><strong>&lt;input type="button"&gt;</strong></code> es una versión específica del elemento <strong><code>&lt;input&gt;</code></strong><code>,</code> que se usa para crear un botón en el que se puede hacer click sin ningún valor por defecto, es decir, <strong>no tiene un comportamiento predeterminado</strong> como por ejemplo <span class="seoSummary"><code><strong>&lt;input type="reset"&gt;</strong></code></span> <span class="seoSummary">. En HTML5  ha sido sustituido  por el elemento <strong><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button">&lt;button&gt;</a></strong>.</span></span></p>
+
+<p>Los navegadores generan un controlador para un botón clickable sin valor por defecto. El botón puede contener cualquier texto. El controlador puede varíar de un navegador a otro.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Categorías de contenido</a></th>
+   <td><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Contenido de flujo</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">contenido de fraseo</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Interactive_content" title="HTML/Content categories#Interactive content">contenido interactivo</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">listado</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">etiquetable</a>, y elementos <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form_submittable" title="HTML/Content categories#Form submittable">entregables</a> con <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form-associated_" title="HTML/Content categories#Form-associated ">contenido asociado a los formularios</a>, contenido evidente.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Contenido de fraseo</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>Ninguna, las etiquetas de inicio y cierre son obligatorias.</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement" title="The HTMLButtonElement interface provides properties and methods (beyond the &lt;button> object interface it also has available to them by inheritance) for manipulating the layout and presentation of button elements."><code>HTMLButtonElement</code></a></td>
+  </tr>
+  <tr>
+   <th scope="row">Tipo de elemento</th>
+   <td>Inline</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento puede tener cualquiera de los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a> además de los siguientes:</p>
+
+<dl>
+ <dt>{{htmlattrdef("disabled")}}</dt>
+ <dd>
+ <p>Este atributo booleano indica que el usuario no puede interactuar con el botón. Si este atributo no está especificado, el botón hereda su configuración del elemento contenedor, por ejemplo, {{HTMLElement("fieldset")}}; si no hay elemento contenedor con el atributo <code><strong>disabled</strong></code> establecido, el botón estará habilitado. El valor de control desactivado no es enviado con el formulario y el evento <code>click</code> <a class="external" href="https://html.spec.whatwg.org/multipage/forms.html#enabling-and-disabling-form-controls:-the-disabled-attribute">no será enviado</a> en los controles desactivados.</p>
+ </dd>
+ <dd>
+ <p>Firefox, al contrario que otros navegadores, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">mantiene por defecto el estado de desactivación dinámico</a> de un {{HTMLElement("button")}} a lo largo de las cargas de la página. Use el atributo {{htmlattrxref("autocomplete","button")}} para controlar esta característica.</p>
+ </dd>
+ <dt>{{htmlattrdef("autofocus")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>Este atributo booleano le permite especificar que el botón deba tener el foco cuando la página se cargue, a no ser que el usuario lo anule, por ejemplo, escribiendo en otro cuadro de texto. Únicamente un elemento asociado con los formularios en un documento puede tener este atributo especificado.</dd>
+ <dt>{{htmlattrdef("autocomplete")}} {{non-standard_inline}}</dt>
+ <dd>El uso de este atributo en un {{HTMLElement("button")}} es algo fuera de lo común, y específico de Firefox. Firefox, por defecto y al contrario de otros navegadores, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">mantiene por defecto el estado de desactivación dinámico</a> de un {{HTMLElement("button")}} a lo largo de las cargas de la página. Establecer el valor de este atributo a <code>off</code> (<code>autocomplete="off"</code>) desactiva esta característica.</dd>
+ <dt>{{htmlattrdef("form")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>El elemento del formulario con el que el botón está asociado (es <em>dueño del formulario</em>). El valor del atributo debe ser el atributo <strong>id</strong> de un elemento {{HTMLElement("form")}} en el mismo documento. Si este atributo no está especificado, el elemento <code>&lt;button&gt; </code>debe ser hijo de un elemento "formulario". Este atributo le permite colocar elementos <code>&lt;button&gt;</code> en cualquier lugar de un documento, y no únicamento como hijos del elemento {{HTMLElement("form")}}.</dd>
+ <dt>{{htmlattrdef("formenctype")}}</dt>
+ <dd>Debido a que el elemento de input es un botón de envío, el atributo <code><strong>formenctype</strong></code> especifica el tipo de contenido que se usa para enviar el formulario al servidor. Los valores posibles son:
+ <ul>
+  <li><code>application/x-www-form-urlencoded</code>: Valor por defecto si el atributo no se especifica.</li>
+  <li><code>multipart/form-data</code>: Este valor se usa si un elemento {{HTMLElement("input")}} es usado con el atributo {{htmlattrxref("type","input")}} fijado a <code>file</code>.</li>
+  <li><code>text/plain</code></li>
+ </ul>
+
+ <p>Si este atributo se especifica, ignora el atributo {{htmlattrxref("enctype","form")}} del formulario dueño del botón.</p>
+ </dd>
+ <dt>{{htmlattrdef("formaction")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>La URI de la aplicación que procesa la información enviada por le botón. Si se especifica se anula el atributo {{htmlattrxref("action","form")}} del formulario dueño del botón.</dd>
+ <dt>{{htmlattrdef("formmethod")}}</dt>
+ <dd>Debido a que el elemento input es un botón de envío, el atributo <code><strong>formmethod</strong></code> especifica el método HTTP que el navegador utilizará para enviar el formulario. Los valores posibles son:
+ <ul>
+  <li><code>post</code>: Los datos del formulario son incluidos en su cuerpo y son enviados al servidor.</li>
+  <li><code>get</code>: Los datos del formulario son agregados a la URI del formulario, utilizando un símbolo '?' como separador, la URI resultante es enviada al servidor. Use este método cuando el formulario no tenga efectos secundarios y contenga solo caracteres ASCII.</li>
+ </ul>
+
+ <p>Si se especifica, este atributo anula el atributo {{htmlattrxref("method","form")}} del formulario dueño del elemento.</p>
+ </dd>
+ <dt>{{htmlattrdef("formnovalidate")}}</dt>
+ <dd>Debido a que el elemento de input es un botón de envío, el atributo <code><strong>formnovalidate </strong></code> especifica que el formulario no debe ser validado cuando sea enviado. Si este atributo es especificado, se anula el atributo {{htmlattrxref("novalidate","form")}} del formulario dueño del elemento. Este atributo es Booleano.</dd>
+ <dt>{{htmlattrdef("formtarget")}}</dt>
+ <dd>Debido a que el elemento de input es un botón de envío, el atributo <code><strong>formtarget</strong></code> es un nombre o palabra clave que indica donde mostrar la respuesta recibida después de enviar el formulario. Este es un nombre de, o palabra clave para, un <em>contexto navegable</em> (por ejemplo, pestaña, ventana, o inline frame). Si este atributo es especificado, se sobreescribirá el atributo {{htmlattrxref("target", "form")}} del formulario dueño del elemento. Las siguientes palabras claves tienen significados especiales:
+ <ul>
+  <li>_<code>self</code>: Carga la respuesta en el mismo contexto navegable<em> </em>que el actual. Este valor es el predeterminado si el atributo no es especificado.</li>
+  <li><code>_blank</code>: Carga la respuesta en un nuevo contexto navegable sin nombre.</li>
+  <li><code>_parent</code>: Carga la respuesta en el contexto navegable padre del actual. Si no hay padre, esta opción se comporta igual que <code>_self</code>.</li>
+  <li><code>_top</code>: Carga la respuesta en el contexto navegable superior (es el contexto navegable que es un ancestro del actual y no tiene padre). Si no hay padre, esta opción se comporta igual que <code>_self</code>.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("name")}}</dt>
+ <dd>El nombre del botón que será enviado con los datos del formulario.</dd>
+ <dt>{{htmlattrdef("type")}}</dt>
+ <dd>El tipo dle botón. Los valores posibles son:
+ <ul>
+  <li><code>submit</code>: El botón envía los datos del formulario al servidor. Este es el valor predeterminado si no se especifica el atributo, o si el atributo es cambiado dinámicamente a un valor inválido o vacío.</li>
+  <li><code>reset</code>: El botón reinicia todos los controles a sus valores iniciales.</li>
+  <li><code>button</code>: El botón no tiene comportamiento predeterminado. Puede haber scripts de la parte del cliente asociados a los eventos del elemento, que serán lanzados cuando el evento ocurra.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("value")}}</dt>
+ <dd>El valor inicial del botón.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Se crea un nuevo input tipo botón con el valor 'Click me'. </p>
+
+<pre class="brush: html">&lt;input type="button" value="Click me"&gt;</pre>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table" style="height: 137px; width: 1065px;">
+ <tbody>
+  <tr>
+   <td>Especificación</td>
+   <td>Status</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'the-button-element.html#the-button-element', '&lt;button&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-button-element', '&lt;button&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.5', '&lt;button&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>formenctype</code> attribute</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.6</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>formmethod</code> attribute</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>autofocus</code> attribute</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>9.6</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td><code>formaction</code> attribute</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>formenctype</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>formmethod</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>formaction</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<p> </p>
+
+<ul>
+ <li>El elemento genérico {{HTMLElement("input")}} y la interface usada para manipularlo, {{domxref("HTMLInputElement")}}</li>
+ <li>El reemplazo en HTML5 para <strong>&lt;input type="button"&gt;</strong>, el elemento <strong><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button">&lt;button&gt;</a></strong>.</li>
+</ul>
diff --git a/files/es/web/html/element/input/checkbox/index.html b/files/es/web/html/element/input/checkbox/index.html
new file mode 100644
index 0000000000..f8605cbf56
--- /dev/null
+++ b/files/es/web/html/element/input/checkbox/index.html
@@ -0,0 +1,131 @@
+---
+title: <input type="checkbox">
+slug: Web/HTML/Element/input/checkbox
+translation_of: Web/HTML/Element/input/checkbox
+original_slug: Web/HTML/Elemento/input/checkbox
+---
+<p><span class="seoSummary">El elemento HTML <strong><code>&lt;input type="checkbox"&gt;</code></strong> es un elemento de entrada que te permite insertar un vector o array de valores. El atributo <strong>value</strong> es usado para definr el valor enviado por el <strong>checkbox</strong>. El atributo <strong>checked</strong> se usa para indicar que el elemento está seleccionado. El atributo <strong>indeterminate</strong> se usa para indicar que el <strong>checkbox</strong> esta en un estado indeterminado (en la mayoria de las plataformas, esto dibuja una linea horizontal que atraviesa el <strong>checkbox</strong>).</span></p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento posee los "<a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes">atributos globales</a>".</p>
+
+<dl>
+ <dt>{{htmlattrdef("checked")}}</dt>
+ <dd>
+ <p>Cuando el valor del atributo <strong>type</strong> es <strong><code>checkbox</code></strong>, la presencia de este atributo booleano indica que el control se selecciona de forma predeterminada; de lo contrario, se ignora.</p>
+ </dd>
+ <dt>{{htmlattrdef("value")}}</dt>
+ <dd>El valor inicial de control. Si se omite la propiedad <strong>value</strong>, el resultado<strong> </strong>devuelto al leer esta propiedad será la cadena <strong>on.</strong></dd>
+ <dd>Tenga en cuenta que al volver a cargar la pagina, Gecko y IE  <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=46845#c186">ignorarán el valor especificado en el  código HTML</a>, si el valor se cambió antes de la recarga.</dd>
+ <dt>{{htmlattrdef("indeterminate")}}</dt>
+ <dd>Indica que la casilla de verificación está en un estado indeterminado (en la mayoría de las plataformas, dibuja una línea horizontal a través del checkbox).</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html">&lt;label&gt;&lt;input type="checkbox" id="cbox1" value="first_checkbox"&gt; Este es mi primer checkbox&lt;/label&gt;&lt;br&gt;
+
+&lt;input type="checkbox" id="cbox2" value="second_checkbox"&gt; &lt;label for="cbox2"&gt;Este es mi segundo checkbox&lt;/label&gt;
+</pre>
+
+<p>Esto crea dos casillas de verificación, que se ven así:</p>
+
+<p>{{EmbedLiveSample("Ejemplo")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Especificación</td>
+   <td>Estatus</td>
+  </tr>
+  <tr>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#checkbox-state-(type=checkbox)', '&lt;checkbox&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#checkbox-state-(type=checkbox)', '&lt;checkbox&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#checkbox', '&lt;checkbox&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">Caracteristicas
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th> </th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7 or earlier")}}</td>
+   <td>2 or earlier</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=checkbox</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7 or earlier")}}<br>
+    {{CompatGeckoDesktop("1.9.2")}} for <code>indeterminate</code> value</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristicas </th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=checkbox</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p id="See_also"> </p>
diff --git a/files/es/web/html/element/input/color/index.html b/files/es/web/html/element/input/color/index.html
new file mode 100644
index 0000000000..3e362ac568
--- /dev/null
+++ b/files/es/web/html/element/input/color/index.html
@@ -0,0 +1,309 @@
+---
+title: <input type="color">
+slug: Web/HTML/Element/input/color
+tags:
+  - Elemento
+  - Entrada
+  - Formulários HTML
+  - HTML
+  - Referencia
+  - Selector de colores
+  - color
+  - formulários
+translation_of: Web/HTML/Element/input/color
+original_slug: Web/HTML/Elemento/input/color
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">Los elementos {{HTMLElement("input")}} del tipo «<code><strong>color</strong></code>» proporciona un elemento de interfaz de usuario que permite a los usuarios especificar un color, bien mediante una interfaz visual de selección, bien a través de un cuadro de texto donde ingresar un valor hexadecimal en el formato «<code>#rrggbb</code>».</span> Solo se permiten colores simples (sin canal alfa). Los valores son compatibles con CSS.</p>
+
+<p>La presentación del elemento puede variar considerablamente entre navegadores y plataformas: podría ser un campo de entrada sencillo que valida automáticamente que la entrada esté en el formato adecuado, o podría lanzar un selector de colores estándar de la plataforma, o incluso podría abrir una ventana de colores personalizada.</p>
+
+<div id="summary_example1">
+<pre class="brush: html">&lt;input type="color"&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample("summary_example1", 700, 30)}}</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td><strong>{{anch("Value")}}</strong></td>
+   <td>Una {{domxref("DOMString")}} de siete caracteres que especifica un {{cssxref("&lt;color&gt;")}} en notación hexadecimal en minúsculas</td>
+  </tr>
+  <tr>
+   <td><strong>Sucesos</strong></td>
+   <td>{{event("change")}} e {{event("input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos comunes admitidos</strong></td>
+   <td>{{htmlattrxref("autocomplete", "input")}} y {{htmlattrxref("list", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos IDL</strong></td>
+   <td><code>list</code> y <code>value</code></td>
+  </tr>
+  <tr>
+   <td><strong>Métodos</strong></td>
+   <td>{{domxref("HTMLInputElement.select", "select()")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Valor">Valor</h2>
+
+<p>El {{htmlattrxref("value", "input")}} de un elemento {{HTMLElement("input")}} del tipo «<code>color</code>» es siempre una {{domxref("DOMString")}} que contiene una cadena de siete caracteres en la que se especifica un color RGB de manera hexadecimal. Aunque es posible introducir el color tanto en mayúsculas como en minúsculas, este se almacena en minúsculas. El valor nunca presenta otra forma y nunca está vacío.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: definir el valor a cualquier cosa que no sea un color válido, totalmente opaco y contenido dentro del espacio RGB <em>en notación hexadecimal</em> causará que el valor se establezca a «<code>#000000</code>». En particular, no es posible utilizar los nombres de colores estandarizados de CSS ni cualquier sintaxis de función CSS para definir el valor. Esto tiene sentido si se tiene en cuenta que HTML y CSS son lenguajes y especificaciones independientes. Por otra parte, no se admiten los colores que incluyan un canal alfa; definir un color en la notación hexadecimal de nueve caracteres (p. ej., <code>#009900aa</code>) también provocará que el valor se establezca a «<code>#000000</code>».</p>
+</div>
+
+<h2 id="Uso_de_las_entradas_de_color">Uso de las entradas de color</h2>
+
+<p>Las entradas del tipo «<code>color</code>» son sencillas debido al número limitado de atributos que admiten.</p>
+
+<h3 id="Proporcionar_un_color_predeterminado">Proporcionar un color predeterminado</h3>
+
+<p>Puede actualizar el ejemplo simple anterior para definir un valor predeterminado, de manera que el botón muestrario de colores tenga precargado ese color y el selector de colores (si lo hay) se abra con ese color preseleccionado también:</p>
+
+<pre class="brush: html">&lt;input type="color" value="#ff0000"&gt;</pre>
+
+<p>{{EmbedLiveSample("Providing_a_default_color", 700, 30)}}</p>
+
+<p>Si no especifica un valor, se utilizará «<code>#000000</code>», negro, de manera predeterminada. El valor debe especificarse en la notación hexadecimal de siete caracteres; esto es, el carácter «#» seguido de dos dígitos para representar el rojo, el verde y el azul: «<code>#rrggbb</code>». Si utiliza colores especificados en cualquier otro formato (como los nombres de colores CSS o las funciones cromáticas de CSS como <code>rgb()</code> o <code>rgba()</code>), deberá convertirlos en valores hexadecimales antes de definir <code>value</code>.</p>
+
+<h3 id="Llevar_un_seguimiento_de_los_cambios_de_color">Llevar un seguimiento de los cambios de color</h3>
+
+<p>Como sucede con otros tipos de {{HTMLElement("input")}}, existen dos sucesos que pueden emplearse para detectar cambios en el valor de color: {{event("input")}} y {{event("change")}}. El suceso <code>input</code> se desencadena en el elemento <code>&lt;input&gt;</code> siempre que cambia el color. El suceso <code>change</code> se desencadena cuando el usuario cierra el selector de colores. En ambos casos, puede determinar el valor nuevo del elemento al examinar su {{domxref("HTMLInputElement.value", "value")}}.</p>
+
+<p>Este ejemplo vigila los cambios del valor de color en el tiempo:</p>
+
+<pre class="brush: js">colorPicker.addEventListener("input", actualizarPrimero, false);
+colorPicker.addEventListener("change", watchColorPicker, false);
+
+function watchColorPicker(event) {
+  document.querySelectorAll("p").forEach(function(p) {
+    p.style.color = event.target.value;
+  });
+}
+</pre>
+
+<h3 id="Seleccionar_el_valor">Seleccionar el valor</h3>
+
+<p>Si la implementación del elemento {{HTMLElement("input")}} del tipo «<code>color</code>» en el navegador del usuario no admite un botón muestrario, y es en cambio un campo de texto para escribir directamente la cadena de color, podrá utilizar el método {{domxref("HTMLInputElement.select", "select()")}} para seleccionar el texto actualmente presente en el campo editable. Si el navegador utiliza en su lugar un botón muestrario, <code>select()</code> no hace nada. Debe tener presente este comportamiento para que su código pueda responder adecuadamente en cada caso.</p>
+
+<pre class="brush: js">muestrario.select();</pre>
+
+<h3 id="Variaciones_de_apariencia">Variaciones de apariencia</h3>
+
+<p>Como se mencionó anteriormente, cuando un navegador no admite una interfaz de selección de colores, su implementación de las entradas de color viene en forma de un cuadro de texto que valida su contenido automáticamente para garantizar que el valor esté en el formato adecuado. Por ejemplo, en Safari 10.1 verá algo como esto:</p>
+
+<p><img alt="Screenshot of the example taken in Safari." src="https://mdn.mozillademos.org/files/14899/input-color-safari.png" style="border-style: solid; border-width: 1px; height: 160px; width: 598px;"></p>
+
+<p>El mismo contenido luce así en Firefox 55:</p>
+
+<p><img alt="Screenshot of the example taken in Firefox 55 for macOS" src="https://mdn.mozillademos.org/files/14901/input-color-firefox.png" style="border-style: solid; border-width: 1px; height: 160px; width: 598px;"></p>
+
+<p>En este caso, al pulsar en el muestrario de colores aparecerá el selector de la plataforma desde el cual elegir un color (en el ejemplo, el selector de macOS):</p>
+
+<p><img alt="Screenshot of the element with the color picker open in Firefox Mac." src="https://mdn.mozillademos.org/files/14903/input-with-picker-firefox-mac.png" style="border-style: solid; border-width: 1px; height: 405px; width: 682px;"></p>
+
+<h2 id="Validación">Validación</h2>
+
+<p>El valor de una entrada de colores se considera no válido si el {{Glossary("user agent")}} no es capaz de convertir la entrada del usuario en la notación hexadecimal de siete caracteres minúsculos. Cuando se da esta situación, se aplica la pseudoclase {{cssxref(":invalid")}} al elemento.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Creemos un ejemplo que realice algo más con la entrada de color a través de la monitorización de los sucesos {{event("change")}} y {{event("input")}} para tomar el color nuevo y aplicarlo a cada uno de los elementos {{HTMLElement("p")}} del documento.</p>
+
+<h3 id="HTML">HTML</h3>
+
+<p>El código HTML es bastante sencillo: un par de párrafos de material descriptivo con un {{HTMLElement("input")}} del tipo «<code>color</code>» con el identificador «<code>muestrario</code>», el cual utilizaremos para modificar el color del texto de los párrafos.</p>
+
+<pre class="brush: html">&lt;p&gt;Este ejemplo demuestra la utilización del control &lt;code&gt;&amp;lt;input type="color"&amp;gt;&lt;/code&gt;.&lt;/p&gt;
+
+&lt;label for="muestrario"&gt;Color:&lt;/label&gt;
+&lt;input type="color" value="#ff0000" id="muestrario"&gt;
+
+&lt;p&gt;Observe cómo el color de los párrafos cambia cuando manipula el selector de colores.
+   A medida que realiza cambios en el selector, el color del primer párrafo cambia,
+   a manera de previsualización (esto usa el suceso &lt;code&gt;input&lt;/code&gt;).
+   Cuando cierra el selector, se desencadena el suceso &lt;code&gt;change&lt;/code&gt;
+   y podemos detectarlo para cambiar todos los párrafos al color elegido.&lt;/p&gt;</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<p>Primero hay que realizar un poco de configuración. Aquí estableceremos algunas variables, una de las cuales contendrá el color que definiremos en el botón muestrario durante la primera carga y, a continuación, configurará un manejador para {{event("load")}} para realizar el trabajo de inicialización cuando termine de cargarse la página.</p>
+
+<pre class="brush: js">var muestrario;
+var colorPredeterminado = "#0000ff";
+
+window.addEventListener("load", startup, false);
+</pre>
+
+<h4 id="Inicialización">Inicialización</h4>
+
+<p>Una vez que se haya cargado la página, se realizará una llamada a nuestro manejador del suceso <code>load</code>, <code>startup()</code>:</p>
+
+<pre class="brush: js">function startup() {
+  muestrario = document.querySelector("#muestrario");
+  muestrario.value = colorPredeterminado;
+  muestrario.addEventListener("input", actualizarPrimero, false);
+  muestrario.addEventListener("change", actualizarTodo, false);
+  muestrario.select();
+}
+</pre>
+
+<p>Esto obtiene una referencia al elemento de color <code>&lt;input&gt;</code> en una variable denominada <code>muestrario</code> y, acto seguido, define el valor de la entrada de color al valor de <code>colorPredeterminado</code>. Después, el suceso {{event("input")}} de la entrada de color se configura para llamar a nuestra función <code>actualizarPrimero()</code> y el suceso {{event("change")}} se configura para llamar <code>actualizarTodo()</code>. Ambos pueden apreciarse a continuación.</p>
+
+<p>Por último, llamamos {{domxref("HTMLInputElement.select", "select()")}} para seleccionar el contenido de texto de la entrada de color input en caso de que el control se haya implementado como un cuadro de texto (lo cual no producirá ningún efecto si se ha brindado una interfaz de selección de colores en su lugar).</p>
+
+<h4 id="Reaccionar_a_cambios_de_color">Reaccionar a cambios de color</h4>
+
+<p>Proveemos dos funciones que se ocupan de los cambios de color. La función <code>actualizarPrimero()</code> se llama en respuesta al suceso <code>input</code>. Esta modifica el color del primer elemento de párrafo del documento para que corresponda con el nuevo valor de la entrada de color. Como los sucesos <code>input</code> se desencadenan cada vez que se realiza un ajuste al valor (por ejemplo, si se aumenta el brillo del color), estos se producirán repetidamente mientras se manipule el selector de colores.</p>
+
+<pre class="brush: js">function actualizarPrimero(event) {
+  var p = document.querySelector("p");
+
+  if (p) {
+    p.style.color = event.target.value;
+  }
+}</pre>
+
+<p>Cuando se cierre el selector de colores, señalando que el valor dejará de cambiar (a menos que el usuario vuelva a abrir el selector), se envía el suceso <code>change</code> al elemento. Manejamos ese suceso a través de la función <code>actualizarTodo()</code>, sirviéndonos de {{domxref("HTMLInputElement.value", "Event.target.value")}} para obtener el color final seleccionado:</p>
+
+<pre class="brush: js">function actualizarTodo(event) {
+  document.querySelectorAll("p").forEach(function(p) {
+    p.style.color = event.target.value;
+  });
+}
+</pre>
+
+<p>Esto define el color de cada uno de los bloques {{HTMLElement("p")}} de manera que sus atributos {{cssxref("color")}} coincidan con el valor actual de la entrada de color, a la cual se hace referencia con {{domxref("Event.target", "event.target")}}.</p>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>El resultado final es el siguiente:</p>
+
+<p>{{EmbedLiveSample("Example", 700, 200)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'the-input-element.html#the-input-element')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-input-element')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.4')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Función</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Compatibilidad básica</td>
+   <td>20.0</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop(29)}} <sup><a href="#footnote_1">[1]</a></sup></td>
+   <td>{{CompatNo}}</td>
+   <td>11.01</td>
+   <td>10</td>
+  </tr>
+  <tr>
+   <td>{{htmlattrxref("list", "input")}}</td>
+   <td>20.0</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>{{htmlattrxref("autocomplete", "input")}}</td>
+   <td>20.0</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Función</th>
+   <th>Android</th>
+   <th>Firefox móvil (Gecko)</th>
+   <th>IE móvil</th>
+   <th>Opera móvil</th>
+   <th>Safari móvil</th>
+  </tr>
+  <tr>
+   <td>Compatibilidad básica</td>
+   <td>4.4</td>
+   <td>{{CompatGeckoMobile("27.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>{{htmlattrxref("list", "input")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>{{htmlattrxref("autocomplete", "input")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p id="footnote_1">[1] Firefox no admite aún las entradas del tipo «<code>color</code>» en Windows Touch.</p>
+
+<p>[2] Consulte {{bug(960984)}} para conocer el estado de compatibilidad del atributo <code>list</code> en Firefox.</p>
+
+<p>[3] Consulte {{bug(960989)}} para conocer el estado de compatibilidad del atributo <code>autocomplete</code> en Firefox. Puede modificar y obtener el valor del atributo, pero este no surte ningún efecto.</p>
diff --git a/files/es/web/html/element/input/date/index.html b/files/es/web/html/element/input/date/index.html
new file mode 100644
index 0000000000..215d8220df
--- /dev/null
+++ b/files/es/web/html/element/input/date/index.html
@@ -0,0 +1,568 @@
+---
+title: <input type="date">
+slug: Web/HTML/Element/input/date
+tags:
+  - Elemento
+  - Fecha
+  - Formulários HTML
+  - Inputs en formularios
+  - tipo Input
+translation_of: Web/HTML/Element/input/date
+original_slug: Web/HTML/Elemento/input/date
+---
+<p>{{HTMLRef}}</p>
+
+<p>Los elementos de <span class="seoSummary">{{htmlelement("input")}} del tipo <strong><code>date</code></strong> crean campos de entrada que permiten a los usuarios proporcionar una fecha, bien a través de un cuadro de texto que valida automáticamente el contenido, o bien mediante una interfaz especial de selección de fechas.</span> El valor resultante incluye el año, el mes y el día, pero no la hora. Los tipos de entrada <a href="/en-US/docs/Web/HTML/Element/input/time">time</a> y <code><a href="/en-US/docs/Web/HTML/Element/input/datetime-local">datetime-local</a></code> admiten entradas de hora y de hora y fecha.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/input-date.html", "tabbed-shorter")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<p>La IU del control varía en función del navegador. Por el momento, la compatibilidad es dispersa; consulte {{anch("Compatibilidad entre navegadores")}} para obtener más detalles. En los navegadores no compatibles, el control se degrada sin problemas a un sencillo <code><a href="/en-US/docs/Web/HTML/Element/input/text">&lt;input type="text"&gt;.</a></code></p>
+
+<pre>&lt;input id="date" type="date"&gt;</pre>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/input-date.html", "tabbed-shorter")}}</div>
+
+<p>Entre los navegadores que admiten una interfaz personalizada para seleccionar fechas se encuentran Chrome y Opera, cuyo control luce así:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14909/date-picker-chrome.png"></p>
+
+<p>El control de fecha de Edge luce así:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14911/date-picker-edge.png"></p>
+
+<p>El control de Firefox luce así:</p>
+
+<p><img alt="Datepicker UI in firefox" src="https://mdn.mozillademos.org/files/15644/firefox_datepicker.png"></p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td><strong>{{anch("Valor")}}</strong></td>
+   <td>Una {{domxref("DOMString")}} que representa una fecha en el formato AAAA-MM-DD, o nada</td>
+  </tr>
+  <tr>
+   <td><strong>Eventos</strong></td>
+   <td>{{event("change")}} e {{event("input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos comunes admitidos</strong></td>
+   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("readonly", "input")}} y {{htmlattrxref("step", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos IDL</strong></td>
+   <td><code>list</code>, <code>value</code>, <code>valueAsDate</code>, <code>valueAsNumber</code>.</td>
+  </tr>
+  <tr>
+   <td><strong>Métodos</strong></td>
+   <td>{{domxref("HTMLInputElement.select", "select()")}}, {{domxref("HTMLInputElement.stepDown", "stepDown()")}}, {{domxref("HTMLInputElement.stepUp", "stepUp()")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Valor">Valor</h2>
+
+<p>Una {{domxref("DOMString")}} que representa el valor de la fecha proporcionada en la entrada. Es posible establecer un valor predeterminado para la entrada al incluir una fecha en el atributo {{htmlattrxref("value", "input")}}, de esta manera:</p>
+
+<pre>&lt;input id="date" type="date" value="2017-06-01"&gt;</pre>
+
+<p>{{EmbedLiveSample('Value', 600, 40)}}</p>
+
+<p>Cabe destacar que el formato de fecha mostrado difiere del <code>value</code> en sí: el formato de fecha mostrado se escogerá en función de la configuración regional del navegador del usuario, aunque el <code>value</code> de fecha siempre se formatee como <code>aaaa-mm-dd</code>.</p>
+
+<p>Es posible asimismo recuperar y establecer el valor de fecha en JavaScript mediante la propiedad {{domxref("HTMLInputElement.value", "value")}} del elemento de entrada; por ejemplo:</p>
+
+<pre>var dateControl = document.querySelector('input[type="date"]');
+dateControl.value = '2017-06-01';</pre>
+
+<p>Este código localiza el primer elemento {{HTMLElement("input")}} cuyo <code>type</code> sea <code>date</code> y define su valor a la fecha 2017-06-01 (1 de junio de 2017).</p>
+
+<h2 id="Atributos_adicionales">Atributos adicionales</h2>
+
+<p>Tenemos atributos adicionales tales como:</p>
+
+<p>{{page("/en-US/docs/Web/HTML/Element/input/number", "step-include")}}</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Attribute</th>
+   <th scope="col">Description</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>{{anch("max")}}</code></td>
+   <td>La fecha máxima aceptada.</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("min")}}</code></td>
+   <td>La fecha minima aceptada.</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("step")}}</code></td>
+   <td>El intervalo a usar, como cuando das click en las flechas, de cuanto en cuanto va avanzar o retroceder.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="htmlattrdef(max)">{{htmlattrdef("max")}}</h3>
+
+<p>La ultima fecha a aceptar. Si el{{htmlattrxref("value", "input")}} ingresado en el elemento esta después de esta fecha, el elemento cae <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">constraint validation</a>. Si el valor del <code>max</code> no es un valor valido, sigue el formato <code>yyyy-MM-dd</code>, donde el elemento no tiene máximo valor.</p>
+
+<p>Este valor debe ser especificado mayor o igual especificado por <code>min</code> attribute.</p>
+
+<h3 id="htmlattrdef(min)">{{htmlattrdef("min")}}</h3>
+
+<p>La minima fecha aceptada; Una fecha menor que esta caera <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">constraint validation</a>. Si el valor es <code>min</code> el atributo no es valido y esa el formato <code>yyyy-MM-dd</code>, entonces el elemento no tiene valor minimo.</p>
+
+<p>Este valor debe especificarse como menor o igual<code>max</code> attribute.</p>
+
+
+
+
+
+
+
+
+
+
+
+
+
+<h3 id="htmlattrdef(step)">{{htmlattrdef("step")}}</h3>
+
+<p>{{page("/en-US/docs/Web/HTML/Element/input/number", "step-include")}}</p>
+
+<p>Para <code>date</code> input, el valor de <code>step</code> se da en dias, con una escala en factor de 86,400,000 (desde el valor numerico en millisegundos). El valor por defecto es <code>step</code> 1, indicando de un día a día.</p>
+
+<div class="blockIndicator note">
+<p>Specifying <code>any</code> as a value for the <code>step</code> attribute makes the same effect as it were equal to <code>1</code> for <code>date</code> inputs.</p>
+</div>
+
+<h2 id="Uso_de_las_entradas_de_fecha">Uso de las entradas de fecha</h2>
+
+<p>Las entradas de fecha suenan prácticas en un primer vistazo, ya que proveen una IU fácil de usar para seleccionar fechas y normalizan el formato de datos que se envía al servidor, sin importar la configuración regional del usuario. Sin embargo, existen problemas con <code>&lt;input type="date"&gt;</code> a causa de la compatibilidad limitada entre navegadores.</p>
+
+<p>Estudiaremos usos básicos y complejos de <code>&lt;input type="date"&gt;</code> y, posteriormente, brindaremos consejos para mitigar el problema de compatibilidad entre navegadores (consulte {{anch("Manejo de compatibilidad entre navegadores")}}). Evidentemente, con el tiempo es esperable que la compatibilidad entre navegadores se amplíe, lo que hará desaparecer este problema.</p>
+
+<h3 id="Usos_básicos_de_date">Usos básicos de <code>date</code></h3>
+
+<p>El uso más sencillo de <code>&lt;input type="date"&gt;</code> supone una combinación de un <code>&lt;input&gt;</code> básico y el elemento {{htmlelement("label")}}, como se indica a continuación:</p>
+
+<pre>&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="bday"&gt;Escriba su cumpleaños:&lt;/label&gt;
+    &lt;input type="date" id="bday" name="bday"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>{{EmbedLiveSample('Basic_uses_of_date', 600, 40)}}</p>
+
+<h3 id="Definir_los_límites_superior_e_inferior_de_la_fecha">Definir los límites superior e inferior de la fecha</h3>
+
+<p>Puede utilizar los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para restringir las fechas que el usuario puede seleccionar. En el ejemplo siguiente, definiremos como la fecha mínima <code>2017-04-01</code> y <code>2017-04-30</code> como la fecha máxima:</p>
+
+<pre>&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="party"&gt;Elija la fecha de festejo que prefiera:&lt;/label&gt;
+    &lt;input type="date" id="party" name="party" min="2017-04-01" max="2017-04-30"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>{{EmbedLiveSample('Setting_maximum_and_minimum_dates', 600, 40)}}</p>
+
+<p>Como resultado, solo es posible seleccionar los días del mes de abril de 2017; solo la parte de los días del valor de texto es modificable, y no se puede desplazar a ninguna fecha que caiga fuera de abril en la interfaz de selección de fechas.</p>
+
+<p><strong>Nota</strong>: debería ser capaz de utilizar el atributo {{htmlattrxref("step", "input")}} para variar el número de días que se recorren con cada incremento de fecha (p. ej., puede que desee que solo se puedan seleccionar los sábados). No obstante, esto no parece funcionar en ninguna implementación en el momento en que se redactó esta página.</p>
+
+<h3 id="Controlar_el_tamaño_de_la_entrada">Controlar el tamaño de la entrada</h3>
+
+<p><code>&lt;input type="date"&gt;</code> no admite los atributos de dimensionamiento de formularios como {{htmlattrxref("size", "input")}}. Deberá recurrir al <a href="/en-US/docs/Web/CSS">CSS</a> para satisfacer sus necesidades de dimensionamiento.</p>
+
+<h2 id="Validación">Validación</h2>
+
+<p>De manera predeterminada, <code>&lt;input type="date"&gt;</code> no aplica a ninguna validación a los valores introducidos. Las implementaciones de IU generalmente no le permiten escribir algo que no sea una fecha (lo cual es útil) pero aun así podrá dejar el campo vacío o incluso (en los navegadores que recurren al tipo <code>text</code>) escribir una fecha no válida (p. ej., el 32 de abril).</p>
+
+<p>Si utiliza {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para restringir las fechas disponibles (consulte {{anch("Definir los límites superior e inferior de la fecha")}}), los navegadores compatibles mostrarán un error si intenta enviar una fecha que se salga de los límites impuestos. No obstante, tendrá que comprobar los resultados para cerciorarse de que el valor esté dentro de los límites, ya que esta condición solo se hace cumplir si el dispositivo del usuario incluye compatibilidad completa con el selector de fecha.</p>
+
+<p>Además, puede emplear el atributo {{htmlattrxref("required", "input")}} para que proporcionar la fecha sea obligatorio: de nuevo, se mostrará un error si intenta enviar un campo de fecha vacío. Esto, cuando menos, debería funcionar en la mayoría de los navegadores.</p>
+
+<p>Estudie este ejemplo. Aquí hemos establecido las fechas mínima y máxima y convertimos el campo en obligatorio:</p>
+
+<pre>&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="party"&gt;Elija la fecha de festejo que prefiera (obligatorio, del 1.º al 20 de abril):&lt;/label&gt;
+    &lt;input type="date" id="party" name="party" min="2017-04-01" max="2017-04-20" required&gt;
+    &lt;span class="validity"&gt;&lt;/span&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;input type="submit"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Si intenta enviar el formulario sin una fecha (o con una fecha fuera de los límites definidos), el navegador muestra un error. Pruebe a manipular el ejemplo:</p>
+
+<p>{{EmbedLiveSample('Validation', 600, 100)}}</p>
+
+<p>Esta captura de pantalla ayudará a aquellos que no utilicen un navegador compatible:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14913/date-picker-chrome-error-message.png"></p>
+
+<p>Aqui un codigo CSS usado en el siguiente ejemplo. Donde se hace uso de {{cssxref(":valid")}} e {{cssxref(":invalid")}} Las propiedades en el estilo del "input" según el valor actual es o no valido. Se ponen iconos sobre el {{htmlelement("span")}} al costado del input, no en el mismo cuadro del input, porque en Chrome el contenido generado se remplaza dentro del formulario de control, y este no puede ser personalizado o no se mostraria efectivamente.</p>
+
+<pre>div {
+    margin-bottom: 10px;
+    display: flex;
+    align-items: center;
+}
+
+label {
+  display: inline-block;
+  width: 300px;
+}
+
+input:invalid+span:after {
+    content: '✖';
+    padding-left: 5px;
+}
+
+input:valid+span:after {
+    content: '✓';
+    padding-left: 5px;
+}</pre>
+
+<div class="blockIndicator warning">
+<p><strong>Importante</strong>: El formulario de validación en HTML  no es un sustituto para los scripts que se aseguran que los datos esten ingresados en la forma correcta. Esto es demasiado facil para alguien que realiza ajustes en HTML que le permite pasar la validación, o quitarla de lleno. Es tambien posible para alguien simplificar el proceso de paso del formulario HTML enteramente y pasar la fecha directamente al servidor. Pero si en el lado de tu servidor fallase la validación al recibir la fecha, podria ocurrir un desastre cuando se envien los datos en el formato incorrecto (que la fecha sea muy larga, del tipo incorrecto, entre otras cosas más).</p>
+</div>
+
+<h2 id="Manejo_de_compatibilidad_entre_navegadores">Manejo de compatibilidad entre navegadores</h2>
+
+<p>Como ya se menciono, el mayor problema al usar el "input" tipo date, es al momento de usar un <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date#Browser_compatibility">navegador compatible</a>. Ejemplo, el date picker en Firefox para Android luciria de la siguiente manera:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14915/date-picker-fxa.png"></p>
+
+<p>Pero los navegadores que no soportan lo remplazarian como un input del tipo texto, esto crea problemas en terminos de consistencia en relacion a la interfaz del usuario (El presente control seria diferente), y el manejo de datos también.</p>
+
+<p>El segundo problema es más serio; como ya se menciono, con un input tipo date, el valor actual siempre se normaliza en el siguiente formato <code>yyyy-mm-dd</code>. Con un input tipo texto, por default el navegador no reconoce el formato en el que deberia estar, y hay muchisimas formas en las que las personas escriben el formato de fecha, Por ejemplo:</p>
+
+<ul>
+ <li><code>ddmmyyyy</code></li>
+ <li><code>dd/mm/yyyy</code></li>
+ <li><code>mm/dd/yyyy</code></li>
+ <li><code>dd-mm-yyyy</code></li>
+ <li><code>mm-dd-yyyy</code></li>
+ <li><code>Month dd yyyy</code></li>
+</ul>
+
+<p>Una forma de evitar esto es usar un {{htmlattrxref("pattern", "input")}}, atributo que se pone en un input tipo date. A pesar de que la entrada tipo date no se usa, el input  tipo text si lo hará, gracias a este {{htmlattrxref("pattern", "input")}}.Mira el siguiente ejemplo en un navegador que no soporta entradas de tipo date:</p>
+
+<pre>&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="bday"&gt;Enter your birthday:&lt;/label&gt;
+    &lt;input type="date" id="bday" name="bday" required pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}"&gt;
+    &lt;span class="validity"&gt;&lt;/span&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;input type="submit"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>{{EmbedLiveSample('Handling_browser_support', 600, 100)}}</p>
+
+<p>Si Ud. trata de enviar la fecha, verá que el navegador no despliega un mensaje de error (y considera el valor del input como valido) Si tu entrada en el input no concuerda con el patron establecido <code>nnnn-nn-nn</code>, donde <code>n</code> es un numero del 0 al 9. De seguro, que esto no frenara a las personas de ingresar valores incorrectos de tipo fecha, o formatos incorrectos, como <code>yyyy-dd-mm</code> (mientras que nosotros necesitamos: <code>yyyy-mm-dd</code>). por lo que aún seria un problema...</p>
+
+<pre>div {
+  margin-bottom: 10px;
+}
+
+input:invalid + span {
+  position: relative;
+}
+
+input:invalid + span:after {
+  content: '✖';
+  position: absolute;
+  right: -18px;
+}
+
+input:valid + span {
+  position: relative;
+}
+
+input:valid + span:after {
+  content: '✓';
+  position: absolute;
+  right: -18px;
+}</pre>
+
+<p>La mejor forma de lidiar con fechas en formularios en un navegador cruzado, es pedir al usuario que ingrese el mes, el año y el dia en inputs separados o en formatos de control separados, ({{htmlelement("select")}} elementos que se han hecho populares; Mira abajo para ver la implementación), o usa una libreria de JavaScript como <a href="https://jqueryui.com/datepicker/">jQuery date picker</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>En este ejemplo creamos dos sets de elementos tipo UI para elegir fechas: uno nativo <code>&lt;input type="date"&gt;</code> y otro en un conjunto de tres {{htmlelement("select")}} elementos para elegir la fecha en navegadores antiguos que no soportan un input nativo.</p>
+
+<p>{{EmbedLiveSample('Examples', 600, 100)}}</p>
+
+<h3 id="HTML">HTML</h3>
+
+<p>El codigo HTML se ve como:</p>
+
+<pre>&lt;form&gt;
+    &lt;div class="nativeDatePicker"&gt;
+      &lt;label for="bday"&gt;Enter your birthday:&lt;/label&gt;
+      &lt;input type="date" id="bday" name="bday"&gt;
+      &lt;span class="validity"&gt;&lt;/span&gt;
+    &lt;/div&gt;
+    &lt;p class="fallbackLabel"&gt;Enter your birthday:&lt;/p&gt;
+    &lt;div class="fallbackDatePicker"&gt;
+      &lt;span&gt;
+        &lt;label for="day"&gt;Day:&lt;/label&gt;
+        &lt;select id="day" name="day"&gt;
+        &lt;/select&gt;
+      &lt;/span&gt;
+      &lt;span&gt;
+        &lt;label for="month"&gt;Month:&lt;/label&gt;
+        &lt;select id="month" name="month"&gt;
+          &lt;option selected&gt;January&lt;/option&gt;
+          &lt;option&gt;February&lt;/option&gt;
+          &lt;option&gt;March&lt;/option&gt;
+          &lt;option&gt;April&lt;/option&gt;
+          &lt;option&gt;May&lt;/option&gt;
+          &lt;option&gt;June&lt;/option&gt;
+          &lt;option&gt;July&lt;/option&gt;
+          &lt;option&gt;August&lt;/option&gt;
+          &lt;option&gt;September&lt;/option&gt;
+          &lt;option&gt;October&lt;/option&gt;
+          &lt;option&gt;November&lt;/option&gt;
+          &lt;option&gt;December&lt;/option&gt;
+        &lt;/select&gt;
+      &lt;/span&gt;
+      &lt;span&gt;
+        &lt;label for="year"&gt;Year:&lt;/label&gt;
+        &lt;select id="year" name="year"&gt;
+        &lt;/select&gt;
+      &lt;/span&gt;
+    &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Los meses son codificados (como son siempre), mientras que el dia y el año son generados dinamicamente dependiendo del mes y el año seleccionado,  y el presente año (mira el codigo comentado para ver los detalles de la explicacion y como este funciona.)</p>
+
+<pre>input:invalid+span:after {
+  content: '✖';
+  padding-left: 5px;
+}
+
+input:valid+span:after {
+  content: '✓';
+  padding-left: 5px;
+}</pre>
+
+<h3 id="JavaScript">JavaScript</h3>
+
+<p>La otra parte del codigo que podria ser interesante es una caracteristica de detección de codigo— para detectar si el navegador soporta o no <code>&lt;input type="date"&gt;</code>, creamos un nuevo {{htmlelement("input")}}, seteado de <code>type</code> a <code>date</code>, inmediatamente verifica a que tipo corresponde— para navegadores que no soportan retornara un tipo <code>text</code>, porque el tipo <code>date</code> se volveria en tipo <code>text</code>. Si <code>&lt;input type="date"&gt;</code> no es soportado, escondemos el control nativo (datepicker nativo) y mostramos el selector tipo UI ({{htmlelement("select")}}) en vez de este.</p>
+
+<pre class="brush: js">// define variables
+var nativePicker = document.querySelector('.nativeDatePicker');
+var fallbackPicker = document.querySelector('.fallbackDatePicker');
+var fallbackLabel = document.querySelector('.fallbackLabel');
+
+var yearSelect = document.querySelector('#year');
+var monthSelect = document.querySelector('#month');
+var daySelect = document.querySelector('#day');
+
+// hide fallback initially
+fallbackPicker.style.display = 'none';
+fallbackLabel.style.display = 'none';
+
+// test whether a new date input falls back to a text input or not
+var test = document.createElement('input');
+test.type = 'date';
+
+// if it does, run the code inside the if() {} block
+if(test.type === 'text') {
+  // hide the native picker and show the fallback
+  nativePicker.style.display = 'none';
+  fallbackPicker.style.display = 'block';
+  fallbackLabel.style.display = 'block';
+
+  // populate the days and years dynamically
+  // (the months are always the same, therefore hardcoded)
+  populateDays(monthSelect.value);
+  populateYears();
+}
+
+function populateDays(month) {
+  // delete the current set of &lt;option&gt; elements out of the
+  // day &lt;select&gt;, ready for the next set to be injected
+  while(daySelect.firstChild){
+    daySelect.removeChild(daySelect.firstChild);
+  }
+
+  // Create variable to hold new number of days to inject
+  var dayNum;
+
+  // 31 or 30 days?
+  if(month === 'January' || month === 'March' || month === 'May' || month === 'July' || month === 'August' || month === 'October' || month === 'December') {
+    dayNum = 31;
+  } else if(month === 'April' || month === 'June' || month === 'September' || month === 'November') {
+    dayNum = 30;
+  } else {
+  // If month is February, calculate whether it is a leap year or not
+    var year = yearSelect.value;
+    (year - 2016) % 4 === 0 ? dayNum = 29 : dayNum = 28;
+  }
+
+  // inject the right number of new &lt;option&gt; elements into the day &lt;select&gt;
+  for(i = 1; i &lt;= dayNum; i++) {
+    var option = document.createElement('option');
+    option.textContent = i;
+    daySelect.appendChild(option);
+  }
+
+  // if previous day has already been set, set daySelect's value
+  // to that day, to avoid the day jumping back to 1 when you
+  // change the year
+  if(previousDay) {
+    daySelect.value = previousDay;
+
+    // If the previous day was set to a high number, say 31, and then
+    // you chose a month with less total days in it (e.g. February),
+    // this part of the code ensures that the highest day available
+    // is selected, rather than showing a blank daySelect
+    if(daySelect.value === "") {
+      daySelect.value = previousDay - 1;
+    }
+
+    if(daySelect.value === "") {
+      daySelect.value = previousDay - 2;
+    }
+
+    if(daySelect.value === "") {
+      daySelect.value = previousDay - 3;
+    }
+  }
+}
+
+function populateYears() {
+  // get this year as a number
+  var date = new Date();
+  var year = date.getFullYear();
+
+  // Make this year, and the 100 years before it available in the year &lt;select&gt;
+  for(var i = 0; i &lt;= 100; i++) {
+    var option = document.createElement('option');
+    option.textContent = year-i;
+    yearSelect.appendChild(option);
+  }
+}
+
+// when the month or year &lt;select&gt; values are changed, rerun populateDays()
+// in case the change affected the number of available days
+yearSelect.onchange = function() {
+  populateDays(monthSelect.value);
+}
+
+monthSelect.onchange = function() {
+  populateDays(monthSelect.value);
+}
+
+//preserve day selection
+var previousDay;
+
+// update what day has been set to previously
+// see end of populateDays() for usage
+daySelect.onchange = function() {
+  previousDay = daySelect.value;
+}</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Recuerda que algunos años tienen 53 semanas (año bisiesto) (Mira <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Semanas por año</a>)! Tendras que tener esto en consideración cuando desarrolles apps o funciones.</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#date-state-(type=date)', '&lt;input type="date"&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#date-state-(type=date)', '&lt;input type="date"&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>20</td>
+   <td>12</td>
+   <td>{{CompatGeckoDesktop(57)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile(57)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>5</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>[1] Reconoce pero no tiene UI.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>The generic {{HTMLElement("input")}} element and the interface used to manipulate it, {{domxref("HTMLInputElement")}}</li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms/The_native_form_widgets#Date_and_time_picker">Date and Time picker tutorial</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Date_and_time_formats">Date and time formats used in HTML</a></li>
+</ul>
diff --git a/files/es/web/html/element/input/datetime/index.html b/files/es/web/html/element/input/datetime/index.html
new file mode 100644
index 0000000000..ee06a52a35
--- /dev/null
+++ b/files/es/web/html/element/input/datetime/index.html
@@ -0,0 +1,148 @@
+---
+title: <input type="datetime">
+slug: Web/HTML/Element/input/datetime
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Element/input/datetime
+original_slug: Web/HTML/Elemento/input/datetime
+---
+<p><span class="seoSummary"><dfn>El HTML</dfn><code> &lt;input type="datetime"&gt; </code>es un control para ingresar tiempo y fecha (hora, minuto, segundo y fracción de segundo) basado en la zona horaria UTC . <dfn> </dfn></span></p>
+
+<ul>
+ <li><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a> : Contenido dinámico , listed , submittable , resettable , contenido asociado a un formulario , contenido estático o de texto . Si <code>type</code>  no tiene el valor <code>hidden </code>, elemenento labelable , contenido palpable .</li>
+</ul>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno , es un elemento vacío.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>Debe de tener una etiqueta de inicio y no debe de tener una etiqueta final .</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padres permitidos</th>
+   <td>Cualquier elemento que acepte contenido estático o de texto .</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement" title="The HTMLInputElement interface provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of input elements."><code>HTMLInputElement</code></a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>El siguiente elemento tiene los siguientes<a href="/es/docs/Web/HTML/Atributos_Globales"> atributos globales</a> .</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<div class="geckoVersionNote">
+<p><code><span class="highELE">input</span> <span class="highATT">type=</span><span class="highVAL">"datetime"</span> <span class="highATT">name=</span><span class="highVAL">"new_year"</span><span class="highGT"> </span></code></p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "forms.html#date-and-time-state-(type=datetime)", "&lt;input type=\"datetime\"&gt;")}}</td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5.1", "semantics.html#date-and-time-state-(type=datetime)", "&lt;input type=\"datetime\"&gt;")}}</td>
+   <td>{{Spec2("HTML5.1")}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=datetime</td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=datetime</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1]  El tipo <code>daytime</code> es reconocido, pero no hay una IU para este.</p>
+
+<p>[2] Actualmente Gecko no implementa el tipo <code>datetime.</code>Ver {{bug("825294")}}</p>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El elemento {{HTMLElement("input")}}</li>
+</ul>
diff --git a/files/es/web/html/element/input/email/index.html b/files/es/web/html/element/input/email/index.html
new file mode 100644
index 0000000000..9a4fa78490
--- /dev/null
+++ b/files/es/web/html/element/input/email/index.html
@@ -0,0 +1,424 @@
+---
+title: <input type="email">
+slug: Web/HTML/Element/input/email
+tags:
+  - Email
+  - Forms
+  - Formulários HTML
+  - HTML
+  - Input Type
+  - Referencia
+  - correoᵉ
+  - formulários
+translation_of: Web/HTML/Element/input/email
+original_slug: Web/HTML/Elemento/input/email
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("email")}} se utilizan para permitir que el usuario ingrese y edite una dirección de correoᵉ o, si se especifica el atributo {{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}, una lista de direcciones de correoᵉ.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/input-email.html", "tabbed-shorter")}}</div>
+
+<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
+
+<p>El valor de {{HTMLElement("input")}} se valida automáticamente para garantizar que esté vacío o sea una dirección de correoᵉ con el formato adecuado (o una lista de direcciones) antes de que se pueda enviar el formulario. Las pseudoclases {{CSSxRef(":valid")}} e {{CSSxRef(":invalid")}} de CSS se aplican automáticamente según corresponda para indicar visualmente si el valor actual del campo es una dirección de correoᵉ válida o no.</p>
+
+<p>En los navegadores que no admiten entradas de tipo <code>email</code>, una entrada de <code>email</code> vuelve a ser un {{HTMLElement("input")}} {{HTMLElement("input/text", "text")}} estándar.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td><strong>{{anch("Value")}}</strong></td>
+   <td>Un {{DOMxRef("DOMString")}} que representa una dirección de correo electrónico o vacío</td>
+  </tr>
+  <tr>
+   <td><strong>Eventos</strong></td>
+   <td>{{DOMxRef("HTMLElement/change_event", "change")}} y {{DOMxRef("HTMLElement/input_event", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos comunes admitidos</strong></td>
+   <td>{{HTMLAttrxRef("autocomplete", "input")}}, {{HTMLAttrxRef("list", "input")}}, {{HTMLAttrxRef("maxlength", "input")}}, {{HTMLAttrxRef("minlength", "input")}}, {{HTMLAttrxRef("multiple", "input")}}, {{HTMLAttrxRef("name", "input")}}, {{HTMLAttrxRef("pattern", "input")}}, {{HTMLAttrxRef("placeholder", "input")}}, {{HTMLAttrxRef("readonly", "input")}}, {{HTMLAttrxRef("required", "input")}}, {{HTMLAttrxRef("size", "input")}} y {{HTMLAttrxRef("type", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>IDL attributes</strong></td>
+   <td><code>list</code> y <code>value</code></td>
+  </tr>
+  <tr>
+   <td><strong>Métodos</strong></td>
+   <td>{{domxref("HTMLInputElement.select", "select()")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Value"><code>Value</code></h2>
+
+<p>El atributo {{HTMLAttrxRef("value", "input")}} del elemento {{HTMLElement("input")}} contiene un {{DOMxRef("DOMString")}} que se valida automáticamente conforme a la sintaxis del correoᵉ. Específicamente, hay tres posibles formatos de valor que pasarán la validación:</p>
+
+<ol>
+ <li>Una cadena vacía ("") — indica que el usuario no ingresó un valor o que el valor fue eliminado.</li>
+ <li>Una única dirección de correoᵉ debidamente formada. Esto no necesariamente significa que exista la dirección de correo electrónico, pero al menos tiene el formato correcto. En términos simples, esto significa <code>nombreusuario@dominio</code> o <code>nombreusuario@dominio.tld</code>. Hay más que eso, por supuesto; consulta {{anch("Validación")}} para obtener una {{Glossary("expresión regular")}} que coincida con el algoritmo de validación de la dirección de correoᵉ.</li>
+ <li>Si y solo se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, el valor puede ser una lista de direcciones de correoᵉ correctamente formadas separadas por comas. Los espacios en blanco iniciales y finales se eliminan de cada dirección de la lista.</li>
+</ol>
+
+<p>Consulta {{anch("Validación")}} para obtener detalles sobre cómo se validan las direcciones de correoᵉ para asegurarte de que tengan el formato correcto.</p>
+
+<h2 id="Atributos_adicionales">Atributos adicionales</h2>
+
+<p>Además de los atributos que operan en todos los elementos {{HTMLElement("input")}} independientemente de su tipo, las entradas de <code> email </code> admiten los siguientes atributos:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Atributo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>{{anch("list")}}</code></td>
+   <td>El id del elemento {{HTMLElement("datalist")}} que contiene las opciones de autocompletar predefinidas</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("maxlength")}}</code></td>
+   <td>El número máximo de caracteres que debe aceptar la entrada</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("minlength")}}</code></td>
+   <td>El número mínimo de caracteres que la entrada puede tener y aún se considera válida</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("multiple")}}</code></td>
+   <td>Si se permite o no la introducción de varias direcciones de correoᵉ separadas por comas.</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("pattern")}}</code></td>
+   <td>Una expresión regular que el contenido de la entrada debe coincidir para que sea válida</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("placeholder")}}</code></td>
+   <td>Un valor de ejemplo para mostrar en el campo de entrada siempre y cuando esté vacío</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("readonly")}}</code></td>
+   <td>Un atributo booleano que indica si el contenido de la entrada debe ser de solo lectura.</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("size")}}</code></td>
+   <td>Un número que indica cuántos caracteres de ancho debe tener el campo de entrada.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p id="htmlattrdeflist">{{page("/es/docs/Web/HTML/Element/input/text", "list", 0, 1, 2)}}</p>
+
+<h3 id="HTMLAttrDefmaxlength">{{HTMLAttrDef("maxlength")}}</h3>
+
+<p>El número máximo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrxRef("email", "input")}}. Debe ser un valor entero 0 o superior. Si no se especifica {{HTMLAttrxRef("maxlength", "input")}}, o se especifica un valor no válido, la entrada de {{HTMLAttrxRef("email", "input")}} no tiene una longitud máxima. Este valor también debe ser mayor o igual que el valor de {{HTMLAttrxRef("minlength", "input")}}.</p>
+
+<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del valor de texto del campo es mayor que {{HTMLAttrxRef("maxlength", "input")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
+
+<h3 id="HTMLAttrDefminlength">{{HTMLAttrDef("minlength")}}</h3>
+
+<p>El número mínimo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrxRef("email", "input")}}. Debe ser un valor entero no negativo menor o igual al valor especificado por {{HTMLAttrxRef("maxlength", "input")}}. Si no se especifica {{HTMLAttrxRef("minlength", "input")}} o se especifica un valor no válido, la entrada de {{HTMLAttrDef("email")}} no tiene una longitud mínima.</p>
+
+<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del texto ingresado en el campo es menor que {{HTMLAttrDef("minlength")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
+
+<h3 id="HTMLAttrDefmultiple">{{HTMLAttrDef("multiple")}}</h3>
+
+<p>Un atributo booleano que, si está presente, indica que el usuario puede ingresar una lista de múltiples direcciones de correoᵉ, separadas por comas y, opcionalmente, espacios en blanco. Consulta {{anch("Permitir varias direcciones de correoᵉ")}} para ver un ejemplo, o {{web.link("/es/docs/Web/HTML/Attributes/multiple", "HTML el atributo: multiple")}} para más detalles.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Normalmente, si especificas el atributo {{HTMLAttrxRef("required", "input")}}, el usuario debe ingresar una dirección de correoᵉ válida para que el campo se considere válido. Sin embargo, si agregas el atributo {{HTMLAttrDef("multiple")}}, una lista de cero direcciones de correo electrónico (una cadena vacía o una que sea completamente en blanco) es un valor válido. En otras palabras, el usuario no tiene que ingresar ni siquiera una dirección de correo electrónico cuando se especifica {{HTMLAttrDef("multiple")}}, independientemente del valor de {{HTMLAttrDef("required")}}.</p>
+</div>
+
+<h3 id="HTMLAttrDefpattern">{{HTMLAttrDef("pattern")}}</h3>
+
+<p>{{page("/es/docs/Web/HTML/Element/input/text", "pattern-include")}}</p>
+
+<p>Consulta la sección {{anch("Patrón de validación")}} para obtener detalles y ver un ejemplo.</p>
+
+<p>{{page("/es/docs/Web/HTML/Element/input/text", "placeholder", 0, 1, 2)}}</p>
+
+<p>{{page("/es/docs/Web/HTML/Element/input/text", "readonly", 0, 1, 2)}}</p>
+
+<p>{{page("/es/docs/Web/HTML/Element/input/text", "size", 0, 1, 2)}}</p>
+
+<h2 id="Usar_inputs_de_tipo_email">Usar <code>input</code>s de tipo <code>email</code></h2>
+
+<p>Las direcciones de correoᵉ se encuentran entre los formularios de datos textuales que se ingresan con mayor frecuencia en la web; se utilizan al iniciar sesión en sitios web, al solicitar información, para permitir la confirmación de pedidos, para correo web, etc. Por lo tanto, el tipo de entrada {{HTMLAttrDef("email")}} puede hacer que tu trabajo como desarrollador web sea mucho más fácil, ya que puede ayudar a simplificar la tarea al crear la interfaz de usuario y la lógica para las direcciones de correoᵉ. Cuando creas una entrada de correoᵉ con el valor de {{HTMLAttrDef("type")}} adecuado, {{HTMLAttrDef("email")}}, obtienes validación automática de que el texto ingresado esté por lo menos en la forma correcta para potencialmente ser una dirección de correoᵉ legítima. Esto puede ayudar a evitar casos en los que el usuario escribe mal su dirección o proporciona una dirección no válida.</p>
+
+<p>Sin embargo, es importante tener en cuenta que esto no es suficiente para garantizar que el texto especificado sea una dirección de correoᵉ que realmente exista, que corresponda al usuario del sitio o que sea aceptable de cualquier otra manera. Simplemente garantiza que el valor del campo tenga el formato adecuado para ser una dirección de correoᵉ.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: También es crucial recordar que un usuario puede jugar con tu HTML detrás de la escena, por lo que tu sitio <em>no debe</em> utilizar esta validación por motivos de seguridad. <em>Debes</em> verificar la dirección de correoᵉ en el lado del servidor de cualquier transacción en la que el texto proporcionado pueda tener implicaciones de seguridad de cualquier tipo.</p>
+</div>
+
+<h3 id="Una_sencilla_entrada_de_correoᵉ">Una sencilla entrada de correoᵉ</h3>
+
+<p>Actualmente, todos los navegadores que admiten este elemento lo implementan como un campo de entrada de texto estándar con características básicas de validación. Sin embargo, la especificación permite a los navegadores cierta libertad en esto. Por ejemplo, el elemento se podría integrar con la libreta de direcciones incorporada del dispositivo del usuario para permitir seleccionar direcciones de correoᵉ de esa lista. En su forma más básica, una entrada de tipo {{HTMLAttrDef("email")}} se puede implementar así:</p>
+
+<pre class="brush: html notranslate">&lt;input id="emailAddress" type="email"&gt;</pre>
+
+<p>{{ EmbedLiveSample('Una_sencilla_entrada_de_correoᵉ', 600, 40) }}</p>
+
+<p>Ten en cuenta que se considera válido cuando está vacío y cuando se ingresa una única dirección de correoᵉ con formato válido, pero por lo demás no se considera válido. Al agregar el atributo {{HTMLAttrxRef("required", "input")}}, solo se permiten direcciones de correoᵉ con formato válido; la entrada ya no se considera válida cuando está vacía.</p>
+
+<h3 id="Permitir_varias_direcciones_de_correoᵉ">Permitir varias direcciones de correoᵉ</h3>
+
+<p>Al agregar el atributo booleano {{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}, la entrada se puede configurar para aceptar varias direcciones de correoᵉ.</p>
+
+<pre class="brush: html notranslate">&lt;input id="emailAddress" type="email" multiple&gt;</pre>
+
+<p>{{ EmbedLiveSample('permitir_varias_direcciones_de_correoᵉ', 600, 40) }}</p>
+
+<p>La entrada ahora se considera válida cuando se ingresa una sola dirección de correoᵉ, o cuando cualquier número de direcciones de correo electrónico separadas por comas y, opcionalmente, algún número de espacios en blanco están presentes.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Cuando se utiliza {{HTMLAttrDef("multiple")}}, el valor <em>puede</em> estar vacío.</p>
+</div>
+
+<p>Algunos ejemplos de cadenas válidas cuando se especifica {{HTMLAttrDef("multiple")}}:</p>
+
+<ul>
+ <li><code>""</code></li>
+ <li><code>"yo@ejemplo"</code></li>
+ <li><code>"yo@ejemplo.org"</code></li>
+ <li><code>"yo@ejemplo.org,tu@ejemplo.org"</code></li>
+ <li><code>"yo@ejemplo.org, tu@ejemplo.org"</code></li>
+ <li><code>"yo@ejemplo.org,tu@example.org, su@ejemplo.org"</code></li>
+</ul>
+
+<p>Algunos ejemplos de cadenas no válidas:</p>
+
+<ul>
+ <li><code>","</code></li>
+ <li><code>"me"</code></li>
+ <li><code>"me@example.org you@example.org"</code></li>
+</ul>
+
+<h3 id="Marcadores_de_posición">Marcadores de posición</h3>
+
+<p>A veces es útil ofrecer una pista en contexto sobre qué forma deben tomar los datos de entrada. Esto puede ser importante especialmente si el diseño de la página no ofrece etiquetas descriptivas para cada {{HTMLElement("input")}}. Aquí es donde entran los marcadores de posición ({{HTMLAttrDef("placeholder")}}s). Un marcador de posición es un valor que demuestra la forma que debe tomar el {{HTMLAttrDef("value")}} al presentar un ejemplo de un valor válido, que se muestra dentro del cuadro de edición cuando el valor del elemento es "". Una vez que se ingresan datos en el cuadro, el marcador de posición desaparece; si se vacía la caja, vuelve a aparecer el marcador de posición.</p>
+
+<p>Aquí, tenemos una entrada de {{HTMLAttrDef("email")}} con el marcador de posición <code>chofy@ejemplo.com</code>. Observa cómo el marcador de posición desaparece y reaparece a medida que manipulas el contenido del campo de edición.</p>
+
+<pre class="brush: html notranslate">&lt;input type="email" placeholder="chofy@ejemplo.com"&gt;</pre>
+
+<p>{{ EmbedLiveSample('Marcadores_de_posición', 600, 40) }}</p>
+
+<h3 id="Controlar_el_tamaño_del_valor_ingresado">Controlar el tamaño del valor ingresado</h3>
+
+<p>Puedes controlar no solo la longitud física del cuadro de entrada, sino también las longitudes mínima y máxima permitidas para el texto de entrada en sí mismo.</p>
+
+<h4 id="Tamaño_físico_del_elemento_de_entrada">Tamaño físico del elemento de entrada</h4>
+
+<p>El tamaño físico del cuadro de entrada se puede controlar mediante el atributo {{HTMLAttrxRef("size", "input")}}. Con él, puedes especificar el número de caracteres que el cuadro de entrada puede mostrar a la vez. En este ejemplo, el cuadro de edición {{HTMLAttrDef("email")}} tiene 15 caracteres de ancho:</p>
+
+<pre class="brush: html notranslate">&lt;input type="email" size="15"&gt;</pre>
+
+<p>{{ EmbedLiveSample('Tamaño_físico_del_elemento_de_entrada', 600, 40) }}</p>
+
+<h4 id="Longitud_del_valor_del_elemento">Longitud del valor del elemento</h4>
+
+<p>El {{HTMLAttrDef("size")}} es independiente de la limitación de longitud de la dirección de correoᵉ ingresada, por lo que puedes hacer que los campos quepan en un espacio pequeño y, al mismo tiempo, permitir que se ingresen cadenas de direcciones de correoᵉ más largas. Puedes especificar una longitud mínima, en caracteres, para la dirección de correoᵉ ingresada usando el atributo {{HTMLAttrxRef("minlength", "input")}}; de manera similar, usa {{HTMLAttrxRef("maxlength", "input")}} para establecer la longitud máxima de la dirección de correoᵉ ingresada.</p>
+
+<p>El siguiente ejemplo crea un cuadro de entrada de dirección de correoᵉ de 32 caracteres de ancho, que requiere que el contenido tenga no menos de 3 caracteres y no más de 64 caracteres.</p>
+
+<pre class="brush: html notranslate">&lt;input type="email" size="32" minlength="3" maxlength="64"&gt;</pre>
+
+<p>{{EmbedLiveSample("Longitud_del_valor_del_elemento", 600, 40) }}</p>
+
+<h3 id="Proporcionar_opciones_predeterminadas">Proporcionar opciones predeterminadas</h3>
+
+<p>Como siempre, puedes proporcionar un valor predeterminado para un cuadro de entrada de tipo <code>email</code> configurando su atributo {{HTMLAttrxRef("value", "input")}}:</p>
+
+<div id="Default_value">
+<pre class="brush: html notranslate">&lt;input type="email" value="usuario@ejemplo.com"&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample("Default_value", 600, 40)}}</p>
+
+<h4 id="Ofreciendo_valores_sugeridos">Ofreciendo valores sugeridos</h4>
+
+<p>Yendo un paso más allá, puedes proporcionar una lista de opciones predeterminadas entre las que el usuario puede seleccionar especificando el atributo {{HTMLAttrxRef("list", "input")}}. Esto no limita al usuario a esas opciones, pero le permite seleccionar rápidamente las direcciones de correoᵉ de uso común. Esto también ofrece sugerencias para {{HTMLAttrxRef("autocomplete", "input")}}. El atributo {{HTMLAttrDef("list")}} especifica el ID de un {{HTMLElement("datalist")}}, que a su vez contiene un elemento {{HTMLElement("option")}} por valor sugerido; El valor de cada opción es el valor sugerido correspondiente para el cuadro de entrada de correoᵉ.</p>
+
+<pre class="brush: html notranslate">&lt;input type="email" size="40" list="defaultEmails"&gt;
+
+&lt;datalist id="defaultEmails"&gt;
+  &lt;option value="jbond007@mi6.defence.gov.uk"&gt;
+  &lt;option value="jbourne@unknown.net"&gt;
+  &lt;option value="nfury@shield.org"&gt;
+  &lt;option value="tony@starkindustries.com"&gt;
+  &lt;option value="hulk@grrrrrrrr.arg"&gt;
+&lt;/datalist&gt;</pre>
+
+<p>{{EmbedLiveSample("Ofreciendo_valores_sugeridos", 600, 40)}}</p>
+
+<p>Con el elemento {{HTMLElement("datalist")}} y sus {{HTMLElement("option")}}es en su lugar, el navegador ofrecerá los valores especificados como valores potenciales para la dirección de correoᵉ; normalmente se presenta como un menú emergente o desplegable que contiene las sugerencias. Si bien la experiencia del usuario específico puede variar de un navegador a otro, normalmente al hacer clic en el cuadro de edición se muestra un menú desplegable con las direcciones de correoᵉ sugeridas. Luego, a medida que el usuario escribe, la lista se filtra para mostrar solo los valores coincidentes. Cada carácter escrito reduce la lista hasta que el usuario realiza una selección o escribe un valor personalizado.</p>
+
+<p><img alt="Animación: usa la entrada del teclado para filtrar la lista de direcciones de correo electrónico sugeridas" src="https://mdn.mozillademos.org/files/14831/html-input-email1.gif" style="border-style: solid; border-width: 1px; height: 168px; width: 352px;"></p>
+
+<h2 id="Validación">Validación</h2>
+
+<p>Hay dos niveles de validación de contenido disponibles para las entradas de {{HTMLAttrDef("email")}}. Primero, está el nivel de validación estándar que se ofrece a todos los {{HTMLElement("input")}}s, que automáticamente asegura que el contenido cumple con los requisitos para ser una dirección de correoᵉ válida. Pero también existe la opción de agregar filtros adicionales para garantizar que se satisfagan tus propias necesidades especializadas, si las tienes.</p>
+
+<div class="warning">
+<p><strong>Importante</strong>: La validación del formulario HTML <em>no</em> sustituye a los scripts que garantizan que los datos ingresados tengan el formato adecuado. Es demasiado fácil para alguien realizar ajustes en el HTML que le permitan omitir la validación o eliminarla por completo. También es posible que alguien simplemente omita tu HTML por completo y envíe los datos directamente a tu servidor. Si tu código del lado del servidor no valida los datos que recibe, podría ocurrir un desastre cuando se ingresen en tu base de datos datos con formato incorrecto (o datos que son demasiado grandes, son del tipo incorrecto, etc.).</p>
+</div>
+
+<h3 id="Validación_básica">Validación básica</h3>
+
+<p>Los navegadores que admiten el tipo de entrada {{HTMLAttrDef("email")}} automáticamente proporcionan una validación para garantizar que solo se introduzca en el cuadro de entrada el texto que coincida con el formato estándar para las direcciones de correoᵉ de Internet. Los navegadores que implementan la especificación deben utilizar un algoritmo equivalente a la siguiente expresión regular:</p>
+
+<pre class="brush: js notranslate">/^[a-zA-Z0-9.!#$%&amp;'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}
+  [a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
+</pre>
+
+<p>Para obtener más información sobre cómo funciona la validación de formularios y cómo aprovechar las propiedades de CSS {{CSSxRef(":valid")}} e {{CSSxRef(":invalid")}} para estilizar la entrada en función de si el el valor actual es válido, consulta {{web.link("/es/docs/Learn/HTML/Forms/Form_validation", "Validación de datos de formulario")}}.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Existen problemas de especificación conocidos relacionados con los nombres de dominio internacionales y la validación de direcciones de correo electrónico en HTML. Consulta el <a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=15489">error 15489 en W3C</a> para obtener más detalles.</p>
+</div>
+
+<h3 id="Patrón_de_validación">Patrón de validación</h3>
+
+<p>Si necesitas restringir la dirección de correo electrónico ingresada más allá de "cualquier cadena que parezca una dirección de correo electrónico", puedes usar el atributo {{HTMLAttrxRef("pattern", "input")}} para especificar una {{Glossary("expresión regular")}} con la cual el valor debe coincidir para que sea válido. Si se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, cada elemento individual en la lista de valores delimitados por comas debe coincidir con la {{Glossary("expresión regular")}}.</p>
+
+<p>Por ejemplo, supón que estás creando una página para los empleados de "Best Startup Ever, Inc". lo que les permitirá ponerse en contacto con su departamento de TI para obtener ayuda. En nuestro formulario simplificado, el usuario debe ingresar su dirección de correoᵉ y un mensaje que describa el problema con el que necesita ayuda. Queremos asegurarnos de que el usuario no solo proporcione una dirección de correoᵉ válida, sino que, por motivos de seguridad, requerimos que la dirección sea una dirección de correo electrónico corporativa interna.</p>
+
+<p>Dado que las entradas de tipo {{HTMLAttrDef("email")}} se comprueban con la validación de la dirección de correoᵉ estándar <em>y</em> el {{HTMLAttrxRef("pattern", "input")}} especificado, se puede implementar así de fácil. Observa cómo:</p>
+
+<div class="hidden">
+<pre class="brush: css notranslate">body {
+  font: 16px sans-serif;
+}
+
+.emailBox {
+  padding-bottom: 20px;
+}
+
+.messageBox {
+  padding-bottom: 20px;
+}
+
+[parcial]label :
+  [parcial]line-height: 1.5;
+}
+
+label::after {
+  content: ":";
+}</pre>
+</div>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+ &lt;div class="emailBox"&gt;
+   &lt;label for="emailAddress"&gt;Tu dirección de correoᵉ&lt;/label&gt;&lt;br&gt;
+   &lt;input id="emailAddress" type="email" size="64" maxLength="64" required
+          placeholder="nombreusuario@beststartupever.com" pattern=".+@beststartupever.com"
+          title="Por favor, solo proporciona una dirección de correoᵉ corporativa que te haya proporcionado Best Startup Ever"&gt;
+ &lt;/div&gt;
+
+ &lt;div class="messageBox"&gt;
+   &lt;label for="message"&gt;Solicitud&lt;/label&gt;&lt;br&gt;
+   &lt;textarea id="message" cols="80" rows="8" required
+             placeholder="Mis zapatos están demasiado apretados y he olvidado cómo bailar."&gt;&lt;/textarea&gt;
+ &lt;/div&gt;
+  &lt;input type="submit" value="Envía solicitud"&gt;
+&lt;/form&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Patrón_de_validación", 700, 275)}}</p>
+
+<p>El {{HTMLElement("form")}} contiene un {{HTMLElement("input")}} de tipo {{HTMLAttrxRef("email", "input")}} para la dirección de correoᵉ del usuario, un {{HTMLElement("textarea")}} para ingresar su mensaje y un {{HTMLElement("input")}} de tipo {{web.link("/es/docs/Web/HTML/Element/input/submit", "submit")}}, que crea un botón para enviar el formulario. Cada cuadro de entrada de texto tiene una {{HTMLElement("label")}} asociada para que el usuario sepa lo que se espera de ellos.</p>
+
+<p>Échale un vistazo más de cerca al cuadro de entrada de la dirección de correoᵉ. Sus atributos {{HTMLAttrxRef("size", "input")}} y {{HTMLAttrxRef("maxlength", "input")}} se establecen en 64 para mostrar espacio para 64 caracteres en direcciones de correoᵉ y limitar la cantidad de caracteres ingresados realmente a un máximo de 64. Se especifica el atributo {{HTMLAttrxRef("required", "input")}}, lo cual hace obligatorio que se proporcione una dirección de correoᵉ válida.</p>
+
+<p>Se proporciona un {{HTMLAttrxRef("placeholder", "input")}} apropiado, <code>nombreusuario@beststartupever.com</code>, para demostrar lo que constituye una entrada válida. Esta cadena demuestra que se debe ingresar una dirección de correoᵉ y sugiere que debe ser una cuenta corporativa de "beststartupever.com". Esto se suma al hecho de que el uso del tipo {{HTMLAttrDef("email")}} validará el texto para garantizar que tenga el formato de una dirección de correoᵉ. Si el texto en el cuadro de entrada no es una dirección de correoᵉ, recibirá un mensaje de error similar a este:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14855/enter-valid-email-address.png" style="height: 125px; width: 530px;"></p>
+
+<p>Si dejas las cosas así, al menos estarías validando direcciones de correoᵉ legítimas. Pero quieres ir un paso más allá: quieres asegurarte de que la dirección de correoᵉ tenga el formato "<em>nombreusuario</em>@beststartupever.com". Aquí es donde usarás el {{HTMLAttrxRef("pattern", "input")}}. Establece el {{HTMLAttrDef("pattern")}} en <code>.+@beststartupever.com</code>. Esta simple expresión regular solicita una cadena que consta de al menos un carácter de cualquier tipo, luego una "@" seguida por el nombre de dominio "beststartupever.com".</p>
+
+<p>Ten en cuenta que esto ni siquiera se acerca a un filtro adecuado para direcciones de correo electrónico válidas; permitiría cosas como "@ beststartupever.com" (tenga en cuenta el espacio inicial) o "@@ beststartupever.com", ninguna de las cuales es válida. Sin embargo, el navegador ejecuta tanto el filtro de dirección de correoᵉ estándar <em>como</em> nuestro patrón personalizado contra el texto especificado. Como resultado, terminamos con una validación que dice "asegúrate de que se asemeje a una dirección de correoᵉ válida, y si lo es, asegúrate de que también sea una dirección beststartupever.com".</p>
+
+<p>Es recomendable utilizar el atributo {{HTMLAttrxRef("title")}} junto con {{HTMLAttrDef("pattern")}}. Si lo haces, el {{HTMLAttrDef("title")}} <em>debe</em> describir el patrón. Es decir, debe explicar qué formato deben adoptar los datos, en lugar de cualquier otra información. Esto se debe a que el {{HTMLAttrDef("title")}} se puede mostrar o pronunciar como parte de un mensaje de error de validación. Por ejemplo, el navegador puede presentar el mensaje "El texto ingresado no coincide con el patrón requerido". seguido de su {{HTMLAttrDef("title")}} especificado. Si tu {{HTMLAttrDef("title")}} es algo así como "Dirección de correoᵉ", el resultado sería el mensaje "El texto ingresado no coincide con el patrón requerido. Dirección de correoᵉ", no es muy buena.</p>
+
+<p>Es por eso que, en cambio, especificamos la cadena "Por favor, proporciona solo una dirección de correoᵉ corporativo de Best Startup Ever", Al hacerlo, el mensaje de error completo resultante podría ser algo como "El texto ingresado no coincide con el patrón requerido. Proporciona solo una dirección de correoᵉ corporativo de Best Startup Ever."</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14853/email-pattern-match-bad.png" style="height: 140px; width: 536px;"></p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si tienes problemas al escribir tus expresiones regulares de validación y no funcionan correctamente, consulta la consola de tu navegador; posiblemente haya útiles mensajes de error que te ayudarán a resolver el problema.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Aquí tenemos una entrada de correoᵉ con el ID <code>emailAddress</code> que puede tener un máximo de 256 caracteres. El cuadro de entrada en sí mismo, físicamente tiene 64 caracteres de ancho y muestra el texto <code>usuario@ejemplo.gov</code> como marcador de posición cada vez que el campo está vacío. Además, al utilizar el atributo {{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}, el cuadro se configura para permitir al usuario ingresar cero o más direcciones de correoᵉ, separadas por comas, como se describe en {{anch("Permitir varias direcciones de correoᵉ")}}. Como toque final, el atributo {{web.link("/es/docs/Web/HTML/Attributes/list", "list")}} contiene el ID de un {{HTMLElement("datalist")}} cuyas {{HTMLElement("option")}}es especifican un conjunto de valores sugeridos que el usuario puede elegir.</p>
+
+<p>Como toque adicional, el elemento {{HTMLElement("label")}} se utiliza para establecer una etiqueta para el cuadro de entrada de Correoᵉ, con su atributo {{HTMLAttrxRef("for", "label")}} que hace referencia al ID <code>emailAddress</code> del elemento {{HTMLElement("input")}}. Al asociar los dos elementos de esta manera, entonces al hacer clic en la etiqueta se enfocará el elemento de entrada.</p>
+
+<pre class="brush: html notranslate">&lt;label for="emailAddress"&gt;Correoᵉ&lt;/label&gt;&lt;br/&gt;
+&lt;input id="emailAddress" type="email" placeholder="usuario@ejemplo.gov"
+       list="defaultEmails" size="64" maxlength="256" multiple&gt;
+
+&lt;datalist id="defaultEmails"&gt;
+  &lt;option value="jbond007@mi6.defence.gov.uk"&gt;
+  &lt;option value="jbourne@unknown.net"&gt;
+  &lt;option value="nfury@shield.org"&gt;
+  &lt;option value="tony@starkindustries.com"&gt;
+  &lt;option value="hulk@grrrrrrrr.arg"&gt;
+&lt;/datalist&gt;</pre>
+
+<p>{{EmbedLiveSample('Ejemplos', 600, 50)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'forms.html#e-mail-state-(type=email)', '&lt;input type="email"&gt;')}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'sec-forms.html#email-state-typeemail', '&lt;input type="email"&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.input.input-email")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Forms", "Guía de formularios HTML")}}</li>
+ <li>{{HTMLElement("input")}}</li>
+ <li><code><a href="/es/docs/Web/HTML/Element/input/tel">&lt;input type="tel"&gt;</a></code></li>
+ <li><code><a href="/es/docs/Web/HTML/Element/input/url">&lt;input type="url"&gt;</a></code></li>
+ <li>Atributos:
+  <ul>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/list", "list")}}</li>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/minlength", "minlength")}}</li>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/maxlength", "maxlength")}}</li>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}</li>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/pattern", "pattern")}}</li>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/placeholder", "placeholder")}}</li>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/readonly", "readonly")}}</li>
+   <li>{{web.link("/es/docs/Web/HTML/Attributes/size", "size")}}</li>
+  </ul>
+ </li>
+ <li>{{web.link("/es/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets", "Compatibilidad de propiedades CSS")}}</li>
+</ul>
diff --git a/files/es/web/html/element/input/hidden/index.html b/files/es/web/html/element/input/hidden/index.html
new file mode 100644
index 0000000000..2acfeee619
--- /dev/null
+++ b/files/es/web/html/element/input/hidden/index.html
@@ -0,0 +1,202 @@
+---
+title: <input type="hidden">
+slug: Web/HTML/Element/input/hidden
+tags:
+  - Element
+  - Forms
+  - HTML
+  - HTML Form
+  - Input
+  - Tipos de Input
+  - formulários
+  - hidden
+translation_of: Web/HTML/Element/input/hidden
+original_slug: Web/HTML/Elemento/input/hidden
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">{{HTMLElement("input")}} elements of type <code><strong>"hidden"</strong></code> let web developers include data that cannot be seen or modified by users when a form is submitted. For example, the ID of the content that is currently being ordered or edited, or a unique security token. Hidden inputs are completely invisible in the rendered page, and there is no way to make it visible in the page's content.</span></p>
+
+<div class="note">
+<p><strong>Note</strong>: Hay un ejemplo en vivo debajo de las siguientes líneas de código — si esta funcionando correctamente no debería ver algo.</p>
+</div>
+
+<div id="Basic_example">
+<pre class="brush: html">&lt;input id="prodId" name="prodId" type="hidden" value="xm234jq"&gt;</pre>
+
+<p>{{ EmbedLiveSample('Basic_example', 600, 40) }}</p>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td><strong>{{anch("Value")}}</strong></td>
+   <td>{{domxref("DOMString")}} representando el valor de un campo oculto que se espetra pasar al servidor.</td>
+  </tr>
+  <tr>
+   <td><strong>Events</strong></td>
+   <td>Ninguno.</td>
+  </tr>
+  <tr>
+   <td><strong>Supported Common Attributes</strong></td>
+   <td>{{htmlattrxref("autocomplete", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>IDL attributes</strong></td>
+   <td><code>value</code></td>
+  </tr>
+  <tr>
+   <td><strong>Methods</strong></td>
+   <td>Ninguno.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Valor_(Value)">Valor (Value)</h2>
+
+<p>El atributo {{htmlattrxref("value", "input")}} del elemento {{HTMLElement("input")}}  tiene un {{domxref("DOMString")}} que contiene la información oculta que se desea incluir en el formulario cuando sea remitido al servidor. Específicamente no puede ser editado por el usuario o mostrado a éste por medio la interfaz de usuario, aunque puede ser editado por medio de las herramientas para desarrolladores del navegador.</p>
+
+<div class="warning">
+<p>Mientras que el valor no es desplegado al usuario en el contenido de la página, si es visible —y puede ser modificado—usando las herramientas para desarrolladores de cualquier navegador o la funcionalidad "Ver código fuente" (View Source). No confíe en <code>hidden</code> inputs como una forma de seguridad.</p>
+</div>
+
+<h2 id="Utilizando_hidden_inputs">Utilizando hidden inputs</h2>
+
+<p>Como se menciono anteriormente, las hidden inputs pueden ser utilizadas donde sea que se quiera incluir información del formulario que el usuario no pueda ver o modificar cuando sea enviado al servidor. Se mostrarán algunos ejemplos que ilustran su uso.</p>
+
+<h3 id="Seguimiento_de_contenido_editado">Seguimiento de contenido editado</h3>
+
+<p>Uno de los usos más comunes para los hidden inputs es mantener un seguimiento de que registros de la base de datos necesitan actualizarse cuando un formulario de actualización es remitido. Un flujo de trabajo tipico se ve como:</p>
+
+<ol>
+ <li>El usuario decide editar algún contenido sobre el cual tiene control, como una entrada de blog o la entrada de un producto. Comienza cuando se presiona el botón de editar.</li>
+ <li>El contenido ha ser editado es tomado de la base de datos y cargados en un formulario HTML para permitir al usuario hacer cambios.</li>
+ <li>Después de editar, el usuario remite el formulario y la información actualizada es envíada de vuelta al servidor para ser actualizada en el servidor.</li>
+</ol>
+
+<p>La idea es que durante el paso 2, el ID del registro que se actualiza se mantenga en un hidden input. Cuando se envía el formulario en el paso 3, el ID se envía automáticamente al servidor con el contenido del registro. El ID permite que el componente de servidor del sitio sepa exactamente qué registro necesita ser actualizado con los datos enviados.</p>
+
+<p>Puede ver un ejemplo completo de como podría ser en la sección {{anch("Examples")}} de abajo.</p>
+
+<h3 id="Mejorando_la_seguridad_del_sitio_web">Mejorando la seguridad del sitio web</h3>
+
+<p>Hidden inputs también son usados para almacenar y enviar token de seguirdad o secretos (<em>secrets)</em>, con el propósito de mejorar la seguridad del sitio web. La idea básica es que si un usuario esta rellenando un formulario con información sensible, como un formulario en un sitio web bancario para transferir dinero a otra cuenta, el secreto que proporciona demostraría que son quienes dicen ser y que estan usando el formulario correcto para enviar la solicitud de transferencia.</p>
+
+<p>Esto evitaría que un usuario malicioso creara un formulario falso, fingiendo ser un banco y enviando el formulario por correo electrónico a usuarios desprevenidos para engañarlos y que transfieran dinero al lugar equivocado. Este tipo de ataque es llamado como <a href="/en-US/docs/Learn/Server-side/First_steps/Website_security#Cross_Site_Request_Forgery_(CSRF)">Cross Site Request Forgery (CSRF)</a>; prácticamente cualquier marco de trabajo que goce de buena reputación utiliza secretos ocultos para evitar tales ataques.</p>
+
+<div class="note">
+<p>Como se menciono anteriormenre, colocando el secreto en un hidden input no lo hace inherentemente seguro. La composición y codificación de la llave haría eso. El valor del hidden input es que mantiene el secreto asociado con la información y automáticamente lo incluye cuando el formulario es enviado al servidor. Se necesita usar secretos bien diseñados para realmente mantener seguro el sitio web.</p>
+</div>
+
+<h2 id="Validación">Validación</h2>
+
+<p>Hidden inputs no participan en la validación de restricciones; no son un valor real que deba ser restringido.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>En el código de abajo se muestra como se puede implementar una versión simple de un formulario de actualización descrito anteriomente (ver {{anch("Tracking edited content")}}), utilizando un hidden input para recordar el ID del registro ha ser editado.</p>
+
+<p>El formulario HTML puede verse un como como este:</p>
+
+<pre class="brush: html">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="title"&gt;Título del artículo:&lt;/label&gt;
+    &lt;input type="text" id="titulo" name="titulo" value="Mi excelente artículo del blog"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;label for="content"&gt;Contenido del artículo:&lt;/label&gt;
+    &lt;textarea id="contenido" name="contenido" cols="60" rows="5"&gt;
+Este es el contenido de mi excelente actículo del blog. ¡Espero lo disfrutes!
+    &lt;/textarea&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button type="submit"&gt;Actualizar artículo&lt;/button&gt;
+  &lt;/div&gt;
+  &lt;input type="hidden" id="acticuloId" name="articuloId" value="34657"&gt;
+&lt;/form&gt;</pre>
+
+<p>Añadiendo también unas líneas simples de CSS:</p>
+
+<pre class="brush: css">html {
+  font-family: sans-serif;
+}
+
+form {
+  width: 500px;
+}
+
+div {
+  display: flex;
+  margin-bottom: 10px;
+}
+
+label {
+  flex: 2;
+  line-height: 2;
+  text-align: right;
+  padding-right: 20px;
+}
+
+input, textarea {
+  flex: 7;
+  font-family: sans-serif;
+  font-size: 1.1rem;
+  padding: 5px;
+}
+
+textarea {
+  height: 60px;
+}</pre>
+
+<p>El servidor establecerá el valor del hidden input con el ID <code>"articuloID"</code> al ID del artículo en la base de datos antes de enviar el formulario al navegador del usuario, y se usará esa información cuando el formulario sea devuelto para saber que registro de la base de datos actualizar con la información modificada. No se necesitan scripts en el contenido para manejar esto.</p>
+
+<p>La salida se vería como:</p>
+
+<p>{{ EmbedLiveSample('Examples', '100%', 200) }}</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Puede encontrar el ejemplo en GitHub (vea el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/hidden-input-example/index.html">código fuente</a>, y también <a href="https://mdn.github.io/learning-area/html/forms/hidden-input-example/index.html">veálo corriendo en vivo</a>).</p>
+</div>
+
+<p>Cuando se envían, los datos del formulario enviados al servidor tendrán un aspecto parecido a este:</p>
+
+<p><code>title=My+excellent+blog+post&amp;content=This+is+the+content+of+my+excellent+blog+post.+I+hope+you+enjoy+it!&amp;postId=34657</code></p>
+
+<p>A pesar de que los hiden input no se pueden ver en absoluto, sus datos se siguen enviando.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#hidden-state-(type=hidden)', '&lt;input type="hidden"&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'forms.html#hidden-state-(type=hidden)', '&lt;input type="hidden"&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
+
+
+
+<p>{{Compat("html.elements.input.input-hidden")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms">HTML forms guide</a></li>
+ <li>{{HTMLElement("input")}} y la interfaz {{domxref("HTMLInputElement")}} en la que se basa</li>
+</ul>
diff --git a/files/es/web/html/element/input/index.html b/files/es/web/html/element/input/index.html
new file mode 100644
index 0000000000..b2594b0da7
--- /dev/null
+++ b/files/es/web/html/element/input/index.html
@@ -0,0 +1,1530 @@
+---
+title: input
+slug: Web/HTML/Element/input
+tags:
+  - Elemento
+  - Etiqueta HTML input
+  - Formularios(2)
+  - HTML
+  - Referencia
+  - Web
+  - formularios html(2)
+translation_of: Web/HTML/Element/input
+original_slug: Web/HTML/Elemento/input
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento HTML <code>&lt;input&gt;</code> se usa para crear controles interactivos para formularios basados en la web con el fin de recibir datos del usuario.<span class="tlid-translation translation" lang="es"><span title="">Hay disponible una amplia variedad de tipos de datos de entrada y widgets de control, que dependen del dispositivo y el agente de usuario (<a href="/en-US/docs/Glossary/user_agent">user agent</a>).El elemento </span></span><code>&lt;input&gt;</code><span class="tlid-translation translation" lang="es"><span title=""> es uno de los más potentes y complejos en todo HTML debido a la gran cantidad de combinaciones de tipos y atributos de entrada.</span></span></p>
+
+<p> </p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, enlistado, presentable, reajustable, elemento asociado a formulario, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual</a>. Si su atributo {{htmlattrxref("type", "input")}} no es <code>hidden</code>, entonces contenido etiquetable, contenido palpable.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno, pues es un {{Glossary("empty element", "elemento vacío")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>Debe tener una etiqueta de apertura y no debe tener etiqueta de cierre.</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLInputElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales" rel="internal" title="en/HTML/Global attributes">atributos globales</a>, y los indicados a continuación.</p>
+
+<dl>
+ <dt>{{htmlattrdef("type")}}</dt>
+ <dd>El tipo de control a mostrar. Su valor predeterminado es <code>text</code>, si no se especifica este atributo. Los posibles valores son:
+ <ul>
+  <li><code>button</code>: Botón sin un comportamiento específico.</li>
+  <li><code>checkbox</code>: Casilla de selección. Se debe usar el atributo <strong>value</strong> para definir el valor que se enviará por este elemento. Se usa el atributo <strong>checked</strong> para indicar si el elemento está seleccionado. También se puede usar el atributo <strong>indeterminate</strong> (el cual solo se puede establecer programaticamente) para indicar que la casilla está en un estado indeterminado (en la mayoría de las plataformas, se dibuja una línea horizontal a través de la casilla).</li>
+  <li><code>color</code>: {{HTMLVersionInline("5")}} Control para espicificar un color. Una interfaz de selección de color no requiere más funcionalidad que la de aceptar colores simples como texto (<a href="http://www.w3.org/TR/html5/forms.html#color-state-(type=color)">más información</a>).</li>
+  <li><code>date</code>: {{HTMLVersionInline("5")}} Control para introducir una fecha (año, mes y día, sin tiempo).</li>
+  <li><code>datetime</code>: {{HTMLVersionInline("5")}} {{deprecated_inline}} {{obsolete_inline}} Control para introducir una fecha y hora (horas, minutos, segundos y fracción de segundo), basado en la zona horaria UTC. <strong>Esta característica ha sido <a href="https://github.com/whatwg/html/issues/336">removida de WHATWG HTML.</a></strong></li>
+  <li><code>datetime-local</code>: {{HTMLVersionInline("5")}} Control para introducir fecha y hora, sin zona horaria específica.</li>
+  <li><code>email</code>: {{HTMLVersionInline("5")}} Campo para introducir una dirección de correo electrónico. El valor introducido se valida para que contenga una cadena vacía o una dirección de correo válida antes de enviarse. Las pseudo-clases {{cssxref(":valid")}} y {{cssxref(":invalid")}} son aplicadas segun corresponda.</li>
+  <li><code>file</code>: Control que permite al usuario seleccionar un archivo. Se puede usar el atributo <strong>accept</strong> para definir los tipos de archivo que el control podrá seleccionar.</li>
+  <li><code>hidden</code>: Control que no es mostrado en pantalla, pero cuyo valor es enviado al servidor.</li>
+  <li><code>image</code>: Botón de envío de formulario con gráfico. Se debe usar el atributo <strong>src</strong> para definir el origen de la imagen y el atributo <strong>alt</strong> para definir un texto alternativo. Se puede usar los atributos <strong>height</strong> y <strong>width</strong> para definir el tamaño de la imagen en píxeles.</li>
+  <li><code>month</code>: {{HTMLVersionInline("5")}} Control para introducir un mes y año, sin zona horaria específica.</li>
+  <li><code>number</code>: {{HTMLVersionInline("5")}} Control para introducir un número de punto flotante.</li>
+  <li><code>password</code>: Control de línea simple cuyo valor permanece oculto. Se puede usar el atributo <strong>maxlength</strong> para especificar la longitud máxima del valor que se puede introducir.</li>
+  <li><code>radio</code>: Botón radio. Se debe usar el atributo <strong>value</strong> para definir el valor que se enviará por este elemento. Se usa el atributo <strong>checked</strong> para indicar si el elemento está seleccionado de forma predeterminada. Los botones radio que tengan el mismo valor para su atributo <strong>name</strong> están dentro del mismo "grupo de botones radio". Solo un botón radio dentro de un grupo puede ser seleccionado a la vez.</li>
+  <li><code>range</code>: {{HTMLVersionInline("5")}} Control para introducir un número cuyo valor exacto no es importante. Este control usa los siguientes valores predeterminados si no se especifica cada atributo:
+   <ul>
+    <li><code>min</code>: 0</li>
+    <li><code>max</code>: 100</li>
+    <li><code>value</code>: <code>min</code> + (<code>max -</code> <code>min</code>) / 2, o <code>min</code> si <code>max</code> es menor que <code>min</code></li>
+    <li><code>step</code>: 1</li>
+   </ul>
+  </li>
+  <li><code>reset</code>: Botón que restaura los contenidos de un formulario a sus valores predeterminados.</li>
+  <li><code>search</code>: {{HTMLVersionInline("5")}} Cuadro de texto de línea simple para introducir textos de búsqueda. Los saltos de línea son eliminados automáticamente del valor introducido.</li>
+  <li><code>submit</code>: Botón que envía el formulario.</li>
+  <li><code>tel</code>: {{HTMLVersionInline("5")}} Control para introducir un número telefónico. Los saltos de línea son eliminados automáticamente del valor introducido, pero no hay otra sintaxis forzada. Se pueden usar atributos como <strong>pattern</strong> y <strong>maxlength</strong> para restringir los valores introducidos en este control. Las pseudo-clases CSS {{cssxref(":valid")}} y {{cssxref(":invalid")}} son aplicadas segun corresponda.</li>
+  <li><code>text</code>: Campo de texto de línea simple. Los saltos de línea son eliminados automáticamente del valor introducido.</li>
+  <li><code>time</code>: {{HTMLVersionInline("5")}} Control para introducir un valor de tiempo sin zona horaria específica.</li>
+  <li><code>url</code>: {{HTMLVersionInline("5")}} Campo para editar una URL. El valor introducido se valida para que contenga una cadena vacía o una ruta URL absoluta antes de enviarse. Los saltos de línea y espacios en blanco al principio o al final del valor son eliminados automáticamente. Se pueden usar atributos como <strong>pattern</strong> y <strong>maxlength</strong> para restringir los valores introducidos en el control. Las pseudo-clases {{cssxref(":valid")}} y {{cssxref(":invalid")}} son aplicadas segun corresponda.</li>
+  <li><code>week</code>: {{HTMLVersionInline("5")}} Control para introducir una fecha que consiste en número de semana del año y número de semana sin zona horaria específica.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("accept")}}</dt>
+ <dd>Si el valor del atributo <strong>type</strong> es <code>file</code>, este atributo indica los tipos de archivo que el servidor acepta, de otra manera será ignorado. El valor debe ser una lista de tipos de contenido únicos, separados por coma:
+ <ul>
+  <li>Una extensión de archivo, comenzando por el caracter STOP (U+002E). (Ejemplos: ".jpg,.png,.doc")</li>
+  <li>Un tipo MIME válido sin extensiones</li>
+  <li><code>audio/*</code>, que representa archivos de audio {{HTMLVersionInline("5")}}</li>
+  <li><code>video/*</code>, que representa archivos de vídeo {{HTMLVersionInline("5")}}</li>
+  <li><code>image/*</code>, que representa archivos de imagen {{HTMLVersionInline("5")}}</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("accesskey")}} sólo {{HTMLVersionInline(4)}}, {{obsoleteGeneric("inline", "HTML5")}}</dt>
+ <dd>Un caracter que el usuario puede presionar para establecer el cursor en el control. Este atributo es global en HTML5.</dd>
+ <dt>{{htmlattrdef("mozactionhint")}} {{non-standard_inline}}</dt>
+ <dd>Especifica una "pista de acción" usada para determinar cómo etiquetar la tecla "enter" en dispositivos móviles con teclados virtuales. Los valores soportados son <code>go</code>, <code>done</code>, <code>next</code>, <code>search</code>, y <code>send</code>. Esto queda automáticamente mapeado al texto apropiado y no son sensibles al uso de mayúsculas.</dd>
+ <dt>{{htmlattrdef("autocapitalize")}} {{non-standard_inline}}</dt>
+ <dd>Atributo no estándar usado por <a href="https://developers.google.com/web/updates/2015/04/autocapitalize">Chrome</a> e iOS Safari Mobile, el cual controla si se deben cambiar los textos a mayúsculas automáticamente mientras son introducidos/editados por el usuario, y la forma en que esto se hará. Los valores no obsoletos están disponibles en iOS5 y superior. Los valores posibles son:
+ <ul>
+  <li><code>none</code>: Deshabilita completamente las mayúsculas automáticas.</li>
+  <li><code>sentences</code>: Cambia automáticamente a mayúscula la primera letra de la sentencia.</li>
+  <li><code>words</code>: Cambia automáticamente a mayúscula la primera letra de cada palabra.</li>
+  <li><code>characters</code>: Cambia automáticamente a mayúscula todos los caracteres.</li>
+  <li><code>on</code>: {{deprecated_inline}} Obsoleto desde iOS 5.</li>
+  <li><code>off</code>: {{deprecated_inline}} Obsoleto desde iOS 5.</li>
+ </ul>
+ <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html#//apple_ref/doc/uid/TP40008058-autocapitalize">Documentation sobre <code>autocapitalize</code> en la Referencia HTML de Safari</a></dd>
+ <dt>{{htmlattrdef("autocomplete")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo indica si el valor del control puede ser completado automáticamente por el navegador.</dd>
+ <dd>Los valores posibles son:
+ <ul>
+  <li><code>off</code>: El usuario debe explícitamente introducir un valor en este campo para cualquier uso, o el documento provee su propio método de auto-completado. El navegador no completa automáticamente lo introducido.</li>
+  <li><code>on</code>: Se permite al navegador completar automáticamente el valor basado en los valores que se han introducido previamente. Sin embargo, <code>on</code> no provee mayor información sobre qué clase de datos podría esperar el usuario introducir.</li>
+  <li><code>name</code>: Nombre completo.</li>
+  <li><code>honorific-prefix</code>: Prefixo o título (Ejemplos: "Sr.", "Sra.", "Dr.", "Srita.").</li>
+  <li><code>given-name</code>: Nombre de pila.</li>
+  <li><code>additional-name</code>: Segundo nombre.</li>
+  <li><code>family-name</code>: Apellido.</li>
+  <li><code>honorific-suffix</code>: Sufijo (Ejemplos: "Hijo", "Señor", "II").</li>
+  <li><code>nickname</code>: Apodo.</li>
+  <li><code>email</code>: Correo electrónico.</li>
+  <li><code>username</code>: Nombre de usuario.</li>
+  <li><code>new-password</code>: Nueva contraseña (por ejemplo, al crear una cuenta o cambiar la contraseña).</li>
+  <li><code>current-password</code>: Contraseña actual.</li>
+  <li><code>organization-title</code>: Título de organización (Ejemplos: "Ingeniero de Software", "Vicepresidente", "Director General Adjunto").</li>
+  <li><code>organization</code>: Organización.</li>
+  <li><code>street-address</code>: Calle (en dirección).</li>
+  <li><code>address-line1</code>, <code>address-line2</code>, <code>address-line3</code>, <code>address-level4</code>, <code>address-level3</code>, <code>address-level2</code>, <code>address-level1</code>: Valores para dirección.</li>
+  <li><code>country</code>: País.</li>
+  <li><code>country-name</code>: Nombre del país.</li>
+  <li><code>postal-code</code>: Código postal.</li>
+  <li><code>cc-name</code>: Nombre completo en un instrumento de pago.</li>
+  <li><code>cc-given-name</code>: Nombre de pila en un instrumento de pago.</li>
+  <li><code>cc-additional-name</code>: Segundo nombre en un instrumento de pago.</li>
+  <li><code>cc-family-name</code>: Apellido en un instrumento de pago.</li>
+  <li><code>cc-number</code>: Código de identificación de un instrumento de pago(por ejemplo, el número de tarjeta de crédito).</li>
+  <li><code>cc-exp:</code> Fecha de expiración de un instrumento de pago.</li>
+  <li><code>cc-exp-month</code>: Mes de expiración en un instrumento de pago.</li>
+  <li><code>cc-exp-year</code>: Año de expiración en un instrumento de pago.</li>
+  <li><code>cc-csc</code>: Código de seguridad en un instrumento de pago.</li>
+  <li><code>cc-type</code>: Tipo de instrumento de pago (por ejemplo, Visa).</li>
+  <li><code>transaction-currency</code>: Tipo de moneda de la transacción.</li>
+  <li><code>transaction-amount</code>: Monto de la transacción.</li>
+  <li><code>language</code>: Idioma preferido, etiqueta BCP 47 válida.</li>
+  <li><code>bday</code>: Fecha de cumpleaños.</li>
+  <li><code>bday-day</code>: Día de cumpleaños.</li>
+  <li><code>bday-month</code>: Mes de cumpleaños.</li>
+  <li><code>bday-year</code>: Año de cumpleaños.</li>
+  <li><code>sex</code>: Sexo (ejemplos, Femenino, Female, Fa'afafine), texto libre, sin líneas nuevas.</li>
+  <li><code>tel</code>: Teléfono.</li>
+  <li><code>url</code>: Dirección web correspondiente a la compañía, persona, dirección o información de contacto en los demás campos asociados a éste.</li>
+  <li><code>photo</code>: Fotografía, ícono u otra imagen correspondiente a la compañía, persona, dirección o información de contacto en los otros campos asociados a éste.</li>
+ </ul>
+
+ <p>Véase el <a href="https://html.spec.whatwg.org/multipage/forms.html#autofill">Estándar WHATWG</a> para információn más detallada.</p>
+
+ <p>Si el atributo <strong>autocomplete</strong> no está especificado en un elemento input, el navegador usa el atributo <strong>autocomplete</strong> del formulario al que pertenece el elemento <code>&lt;input&gt;</code>, es decir, el elemento <code>form</code> del cual es descendiente el elemento <code>&lt;input&gt;</code>, o aquél cuyo <strong>id</strong> está especificado en el atributo <strong>form</strong> del elemento input. Para mayor información, véase el atributo {{htmlattrxref("autocomplete", "form")}} en {{HTMLElement("form")}}.</p>
+
+ <p>El atributo <strong>autocomplete</strong> también controla si Firefox, a diferencia de otros navegadores, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">persistirá el estado deshabilitado dinámico, y (si aplica) la selección dinámica</a> de un <code>&lt;input&gt;</code> a través de las cargas de la página. La característica de persistencia está habilitada de forma predeterminada. Estableciendo el valor de <strong>autocomplete</strong> como <code>off</code> se deshabilita esta característica. Esto funciona aún cuando el atributo <strong>autocomplete</strong> no se aplicaría normalmente al <code>&lt;input&gt;</code> en virtud de su atributo <strong>type</strong>. Véase {{bug(654072)}}.</p>
+
+ <p>Para navegadores más modernos (incluyendo Firefox 38+, Google Chrome 34+, IE 11+), establecer el atributo <strong>autocomplete</strong> <em>no</em> previene que el administrador de contraseñas del navegador le pregunte al usuario si desea guardar la información de inicio de sesión (usuario y contraseña), ni tampoco, de permitirlo el usuario, que se autocompleten estos campos la próxima vez que el usuario visite la página. Véase <a href="/es/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#The_autocomplete_attribute_and_login_fields">El atributo autocomplete y campos de inicio de sesión</a>.</p>
+ </dd>
+ <dt>{{htmlattrdef("autocorrect")}} {{non-standard_inline}}</dt>
+ <dd>Es un atributo no estándar, soportado por Safari, que es usado para controlar si la autocorrección debe estar habilitada cuando el usuario está introduciendo/editando el texto de un <code>&lt;input&gt;</code>. Los valores posibles de este atributo son:
+ <ul>
+  <li><code>on</code>: Habilita la autocorrección</li>
+  <li><code>off</code>: Deshabilita la autocorrección</li>
+ </ul>
+ <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html#//apple_ref/doc/uid/TP40008058-autocorrect">Documentación de <code>autocorrect</code> en la Referencia HTML de Safari</a></dd>
+ <dt>{{htmlattrdef("autofocus")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo Booleano permite especificar que un control de formulario tenga el cursor cuando la página se carga, a menos que el usuario lo reemplace, por ejemplo, escribiendo en un control diferente. Solo un elemento de formulario en un mismo documento puede tener el atributo <strong>autofocus</strong>, el cual es Booleano. No puede ser aplicado si el atributo <strong>type</strong> tiene valor <code>hidden</code> (es decir, no se puede establecer automáticamente el cursor en un control oculto). Nótese que el cursor se podría establecer en el control antes de disparar el evento <a href="/es/docs/Web/Events/DOMContentLoaded"><code>DOMContentLoaded</code>.</a></dd>
+ <dt>{{htmlattrdef("capture")}}</dt>
+ <dd>
+ <p>Cuando el valor del atributo <strong>type</strong> es <code>file</code>, la presencia de este atributo Booleano indica que se le dará preferencia a la captura del medio directamente del ambiente del dispositivo, usando algún <a href="https://www.w3.org/TR/html-media-capture/#dfn-media-capture-mechanism">mecanismo de captura de medios</a>.</p>
+ </dd>
+ <dt>{{htmlattrdef("checked")}}</dt>
+ <dd>
+ <p>Cuando el valor del atributo <strong>type</strong> es <code>radio</code> o <code>checkbox</code>, la presencia de este atributo Booleano indica que el control está seleccionado de forma predeterminada. De lo contrario, será ignorado.</p>
+
+ <p>En Firefox, a diferencia de otros navegadores, de forma predeterminada, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">se persiste el estado de selección dinámico</a> en un <code>&lt;input&gt;</code> a través de las cargas de la página. Para controlar esta característica se usa el atributo {{htmlattrxref("autocomplete","input")}}.</p>
+ </dd>
+ <dt>{{htmlattrdef("disabled")}}</dt>
+ <dd>
+ <p>Este atributo Booleano indica que el control no está disponible para interacción. En particular, el evento <code>click</code> <a class="external" href="https://html.spec.whatwg.org/multipage/forms.html#enabling-and-disabling-form-controls:-the-disabled-attribute">no será invocado</a> en controles deshabilitados. De igual forma, el valor de un control deshabilitado no es enviado con el formulario.</p>
+
+ <p>En Firefox, a diferencia de otros navegadores, de forma predeterminada, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">se persiste el estado de selección dinámico</a> en un <code>&lt;input&gt;</code> a través de las cargas de la página. Para controlar esta característica se usa el atributo {{htmlattrxref("autocomplete","input")}}.</p>
+ </dd>
+ <dt>{{htmlattrdef("form")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>El elemento form al que está asociado el elemento (su <em>formulario propietario</em>). El valor del atributo debe ser el <strong>id</strong> de un elemento {{HTMLElement("form")}} en el mismo documento. Si el atributo no es especificado, este elemento <code>&lt;input&gt;</code> deberá ser descendiente de un elemento {{HTMLElement("form")}}. Este atributo permite poner elementos <code>&lt;input&gt;</code> en cualquier parte dentro de un documento, no solamente como descendientes de su formulario. Un input puede ser asociado sólo con un formulario.</dd>
+ <dt>{{htmlattrdef("formaction")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>El URI de un programa que procesa la información enviada por el elemento input, cuando es un botón de tipo <code>submit</code> o <code>image</code>. Si se especifica, reemplaza al atributo {{htmlattrxref("action","form")}} del formulario al que pertenece el elemento.</dd>
+ <dt>{{htmlattrdef("formenctype")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si el elemento es de tipo <code>submit</code> o <code>image</code>, este atributo especifica el tipo de contenido que es usado para enviar el formulario al servidor. Los valores posibles son:
+ <ul>
+  <li><code>application/x-www-form-urlencoded</code>: El valor predeterminado si el atributo no es especificado.</li>
+  <li><code>multipart/form-data</code>: Se usa este valor cuando se tiene un elemento <code>&lt;input&gt;</code> con atributo {{htmlattrxref("type","input")}} de valor <code>file</code>.</li>
+  <li><code>text/plain</code></li>
+ </ul>
+
+ <p>Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("enctype","form")}} del formulario al que pertenece el elemento.</p>
+ </dd>
+ <dt>{{htmlattrdef("formmethod")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si el elemento input es un botón de tipo <code>submit</code> o <code>image</code>, este atributo especifica el método HTTP que el navegador usará para enviar el formulario. Los valores posibles son:
+ <ul>
+  <li><code>post</code>: Los datos del formulario son incluidos en el cuerpo del formulario, y enviados al servidor.</li>
+  <li><code>get</code>: Los datos del formulario son añadidos al URI del <strong>form</strong> con un símbolo '?' como separador, y el URI resultante es enviado al servidor. Se usa este método cuando el formulario no tiene efectos secundarios y contiene solamente caracteres ASCII.</li>
+ </ul>
+
+ <p>Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("method","form")}} del formulario al que pertenece el elemento.</p>
+ </dd>
+ <dt>{{htmlattrdef("formnovalidate")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si el elemento input es de tipo <code>submit</code> o <code>image</code>, este atributo Booleano especifica que el formulario no será validado cuando se envíe. Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("novalidate","form")}} del formulario al que pertenece el elemento.</dd>
+ <dt>{{htmlattrdef("formtarget")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si el elemento input es de tipo <code>submit</code> o <code>image</code>, este atributo es el nombre o palabra clave que indica dónde mostrar la respuesta que se recibe después de enviar el formulario. Este es el nombre, o palabra clave, de un <em>contexto de navegación</em> (por ejemplo, pestaña, ventana o frame incrustado). Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("target", "form")}} del formulario al que pertenece el elemento. Las siguientes palabras clave tienen significado especial:
+ <ul>
+  <li>_<code>self</code>: Carga la respuesta en el mismo contexto de navegación actual. Este valor es el predeterminado cuando no se especifica el atributo.</li>
+  <li><code>_blank</code>: Carga la respuesta en un contexto de navegación nuevo.</li>
+  <li><code>_parent</code>: Carga la respuesta en el contexto de navegación padre del actual. Si no hay contexto padre, se comporta de la misma forma que <code>_self</code>.</li>
+  <li><code>_top</code>: Carga la respuesta en el contexto de navegación principal (es decir, el contexto que es ancestro del actual y que no tenga padre). Si no hay contexto padre, se comporta de la misma forma que <code>_self</code>.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("height")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si el valor del atributo <strong>type</strong> es <code>image</code>, este atributo define la altura de la imagen mostrada para el botón.</dd>
+ <dt>{{htmlattrdef("incremental")}} {{non-standard_inline}}</dt>
+ <dd>Es un atributo no estándar, soportado por WebKit (Safari) y Blink (Chrome), que solo aplica cuando el atributo <strong>type</strong> es <code>search</code>. Si el atributo está presente, sin importar su valor, el <code>&lt;input&gt;</code> dispara eventos <a href="/en-US/docs/Web/Events/search"><code>search</code></a> conforme el usuario edita el valor. El evento solo es disparado después de que un tiempo definido en implementación haya pasado desde la última vez que se presionó una tecla. Si el atributo está ausente, el evento <a href="/en-US/docs/Web/Events/search"><code>search</code></a> solo se disparará cuando el usuario explícitamente inicie una búsqueda (por ejemplo, presionando la tecla Enter dentro del control). <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html#//apple_ref/doc/uid/TP40008058-incremental"> Documentación de <code>incremental en la Referencia HTML de Safari</code></a></dd>
+ <dt>{{htmlattrdef("inputmode")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Una pista para el navegador sobre qué teclado mostrar. Este atributo aplica cuando el valor del atributo <strong>type</strong> es text, password, email, o url. Los valores posibles son:
+ <ul>
+  <li><code>verbatim</code>: Alfanumérico, sin contenido con significado, como nombres de usuario o contraseñas.</li>
+  <li><code>latin</code>: Escritura en caracteres de latín, en el lenguaje de elección del usuario, con ayuda de escritura, como predicción de texto. Para comunicación humano-computadora, como en cuadros de búsqueda.</li>
+  <li><code>latin-name</code>: Como <em>latin</em>, pero con nombres de personas.</li>
+  <li><code>latin-prose</code>: Como <em>latin</em>, pero con ayuda de escritura más agresiva. Para comunicación humano-humano, como mensajería instantánea o correo electrónico.</li>
+  <li><code>full-width-latin</code>: Como <em>latin-prose</em>, pero para idiomas secundarios del usuario.</li>
+  <li><code>kana</code>: Escritura en kana o romaji, típicamente escritura en hiragana, usando caracteres de anchura completa, con soporte para conversión a kanji. Usado para escritura en japonés.</li>
+  <li><code>katakana</code>: Escritura en katakana, usando caracteres de anchura completa, con soporte para conversión a kanji. Usado para escritura en japonés.</li>
+  <li><code>numeric</code>: Escritura en caracteres numéricos, incluyendo teclas para los dígitos de 0 a 9, el separador de miles segun las preferencias del usuario, y el caracter para indicar números negativos. Destinado a códigos numéricos, por ejemplo, números de tarjeta de crédito. Para valores numéricos reales, es preferible usar &lt;input type="number"&gt; en lugar de este atributo.</li>
+  <li><code>tel</code>: Escritura de teléfonos, incluído las teclas de asterisco y gato. Es preferible el uso de &lt;input type="tel"&gt; en lugar de este atributo.</li>
+  <li><code>email</code>: Escritura de correo electrónico. Es preferible el uso de &lt;input type="email"&gt; en lugar de este atributo.</li>
+  <li><code>url</code>: Escritura de URL. Es preferible el uso de &lt;input type="url"&gt; en lugar de este atributo.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("list")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Identifica una lista de opciones predefinidas como sugerencias al usuario. El valor debe ser el <strong>id</strong> de un elemento {{HTMLElement("datalist")}} en el mismo documento. El navegador muestra solamente las opciones que son válidas para el elemento. Este atributo es ignorado cuando el atributo <strong>type</strong> tiene valor <code>hidden</code>, <code>checkbox</code>, <code>radio</code>, <code>file</code>, o algun tipo de botón.</dd>
+ <dt>{{htmlattrdef("max")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>El valor máximo (numérico o fecha-hora) para este elemento, el cual no debe ser menor que su valor mínimo (atributo <strong>min</strong>).</dd>
+ <dt>{{htmlattrdef("maxlength")}}</dt>
+ <dd>
+ <p>Si el valor del atributo <strong>type</strong> es <code>text</code>, <code>email</code>, <code>search</code>, <code>password</code>, <code>tel</code>, o <code>url</code>, este atributo especifica el número máximo de caracteres (en puntos de código Unicode) que el usuario puede introducir. Para los otros tipos de control, es ignorado. Puede exceder el valor del atributo <strong>size</strong>. Si no se especifica, el usuario puede introducir una cantidad ilimitada de caracteres. Especificar un número negativo resulta en el comportamiento predeterminado (es decir, el usuario puede introducir una cantidad ilimitada de caracteres). La restricción es evaluada sólo cuando el valor del atributo ha sido modificado.</p>
+ </dd>
+ <dt>{{htmlattrdef("min")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>El valor mínimo (numérico o fecha-hora) para este elemento, el cual no debe ser mayor a su valor máximo (atributo <strong>max</strong>).</dd>
+ <dt>{{htmlattrdef("minlength")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si el valor del atributo <strong>type</strong> es <code>text</code>, <code>email</code>, <code>search</code>, <code>password</code>, <code>tel</code>, o <code>url</code>, este atributo especifica la longitud mínima de caracteres (en puntos de código Unicode) que el usuario puede introducir. Para los otros tipos de control, es ignorado.</dd>
+ <dt>{{htmlattrdef("multiple")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo Booleano indica si el usuario puede introducir más de un valor. Este atributo aplica cuando el atributo <strong>type</strong> es <code>email</code> o <code>file</code>, y en caso contrario es ignorado.</dd>
+ <dt>{{htmlattrdef("name")}}</dt>
+ <dd>El nombre del control, el cual es enviado con los datos del formulario.</dd>
+ <dt>{{htmlattrdef("pattern")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Una expresión regular contra la que el valor es evaluado. El patrón debe coincidir con el valor completo, no solo una parte. Se puede usar el atributo <strong>title</strong> para describir el patrón como ayuda al usuario. Este atributo aplica cuando el atributo <strong>type</strong> es <code>text</code>, <code>search</code>, <code>tel</code>, <code>url</code>, <code>email</code>, o <code>password</code>, y en caso contrario es ignorado. El lenguaje de expresión regular es el mismo que el algoritmo {{jsxref("RegExp")}} de JavaScript, con el parámetro <code>'u'</code> que permite tratar al patrón como una secuencia de código Unicode. El patrón no va rodeado por diagonales.</dd>
+ <dt>{{htmlattrdef("placeholder")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Una pista para el usuario sobre lo que puede introducir en el control. El texto no debe contener saltos de línea.
+ <div class="note"><strong>Nota:</strong> No se debe usar el atributo <code>placeholder</code> en lugar de un elemento {{HTMLElement("label")}}, pues sus propósitos son diferentes. El elemento {{HTMLElement("label")}} describe el rol del elemento en el formulario (es decir, indica qué tipo de información se espera), y el atributo <code>placeholder</code> es una pista sobre el formato que debe tener el contenido. Hay casos en los que el atributo <code>placeholder</code> no es visible para el usuario, por lo que el formulario debe ser comprensible para el usuario aunque este atributo no esté presente.</div>
+ </dd>
+ <dt>{{htmlattrdef("readonly")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo indica que el usuario no puede modificar el valor del control. El valor del atributo es irrelevante. De ser necesario el acceso lectura-escritura al valor, <em>no</em> se debe agregar el atributo "<strong>readonly</strong>". Es ignorado si el atributo <strong>type</strong> es <code>hidden</code>, <code>range</code>, <code>color</code>, <code>checkbox</code>, <code>radio</code>, <code>file</code>, o de tipo botón (como <code>button</code> o <code>submit</code>).</dd>
+ <dt>{{htmlattrdef("required")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo especifica que el usuario debe llenar el control antes de enviarlo al formulario. No puede ser usado cuando el atributo <strong>type</strong> es <code>hidden</code>, <code>image</code>, o de tipo botón (<code>submit</code>, <code>reset</code>, o <code>button</code>). Las pseudo-clases {{cssxref(":optional")}} y {{cssxref(":required")}} se aplicarán al campo según sea apropiado.</dd>
+ <dt>{{htmlattrdef("results")}} {{non-standard_inline}}</dt>
+ <dd>Este es un atributo no estándar, soportado por Safari, que sólo aplica cuando el atributo <strong>type</strong> es <code>search</code>. Es usado para controlar el máximo número de entradas que se deben mostrar en el listado nativo del <code>&lt;input&gt;</code> de búsquedas pasadas. Este valor debe ser un número entero no negativo.</dd>
+ <dt>{{htmlattrdef("selectionDirection")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>La dirección en la que ocurre la selección. Esto es "forward" (hacia adelante) si la selección fue hecha de izquierda a derecha en una escritura LTR o izquierda a derecha en una escritura RTL, o "backward" (hacia atrás) si la selección fue hecha de forma opuesta. Puede ser "none" si la dirección de selección es desconocida.</dd>
+ <dt>{{htmlattrdef("selectionEnd")}}</dt>
+ <dd>La separación dentro del contenido de texto del último caracter seleccionado. Si no hay selección, este valor indica la separación para el caracter que sigue a la posición actual del cursor (es decir, la posición que el siguiente caracter que se escriba ocupará).</dd>
+ <dt>{{htmlattrdef("selectionStart")}}</dt>
+ <dd>La separación dentro del contenido del primer caracter seleccionado. Si no hay selección, este valor indica la separación para el caracter que sigue a la posición actual del cursor (es decir, la posición que el siguiente caracter que se escriba ocupará).</dd>
+ <dt>{{htmlattrdef("size")}}</dt>
+ <dd>El tamaño inicial del control. Este valor es en píxeles, a menos que el atributo <strong>type</strong> sea <code>text</code> o <code>password</code>, en cuyo caso será el número entero de caracteres. A partir de HTML5, este atributo aplica sólo cuando el atributo <strong>type</strong> es <code>text</code>, <code>search</code>, <code>tel</code>, <code>url</code>, <code>email</code>, o <code>password</code>, de otro modo es ignorado. Además, el tamaño debe ser mayor a cero. Si no se especifica un tamaño, se usa un valor predeterminado de 20. HTML5 simplemente establece que "el agente usuario debe asegurarse que al menos esa cantidad de caracteres sea visible", pero los caracteres pueden tener anchuras diferentes en ciertas fuentes. En algunos navegadores, una cadena con <em>x</em> caracteres no será completamente visible aunque su tamaño esté definido con un mínimo de <em>x</em>.</dd>
+ <dt>{{htmlattrdef("spellcheck")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si se establece este atributo con valor <code>true</code>, se está indicando que se debe revisar la ortografía y gramática del elemento. El valor <code>default</code> indica que el elemento va a actuar acorde al comportamiento predeterminado del navegador, posiblemente basado en el valor del atributo <code>spellcheck</code> de su elemento padre. El valor <code>false</code> indica que el elemento no debe ser revisado.</dd>
+ <dt>{{htmlattrdef("src")}}</dt>
+ <dd>Si el atributo <strong>type</strong> es <code>image</code>, este atributo especifica el URI para la ubicación de la imagen a mostrar en el botón de envío gráfico. En caso contrario, es ignorado.</dd>
+ <dt>{{htmlattrdef("step")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Trabaja con los atributos <strong>min</strong> y <strong>max</strong>, para limitar el incremento de valores numéricos o de fecha-hora. Puede ser el valor <code>any</code> o un número positivo de punto flotante. Si no se establece este atributo como <code>any</code>, el control acepta solamente valores múltiplos del valor del atributo, mayores al mínimo.</dd>
+ <dt>{{htmlattrdef("tabindex")}} específico para el elemento en {{HTMLVersionInline(4)}}, global en {{HTMLVersionInline("5")}}</dt>
+ <dd>La posición del elemento en el orden de navegación por la tecla Tab dentro del documento.</dd>
+ <dt>{{htmlattrdef("usemap")}} solo para {{HTMLVersionInline(4)}}, {{obsoleteGeneric("inline", "HTML5")}}</dt>
+ <dd>El nombre de un elemento {{HTMLElement("map")}} usado como mapa de imagen.</dd>
+ <dt>{{htmlattrdef("value")}}</dt>
+ <dd>El valor inicial del control. Este atributo es opcional, excepto cuando el atributo <strong>type</strong> es <code>radio</code> o <code>checkbox</code>.<br>
+ Nótese que cuando se recarga la página, Gecko e IE <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=46845#c186">ignorarán el valor especificado en el código fuente HTML</a>, si el valor fue modificado antes de recargar.</dd>
+ <dt>{{htmlattrdef("webkitdirectory")}} {{non-standard_inline}}</dt>
+ <dd>Este atributo Booleano indica si el selector usado cuando el atributo <strong>type</strong> es <code>file</code> debe permitir la selección de directorios solamente.</dd>
+ <dt>{{htmlattrdef("width")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Si el valor del atributo <strong>type</strong> es <code>image</code>, este atributo define la anchura de la imagen mostrada en el botón.</dd>
+ <dt>{{htmlattrdef("x-moz-errormessage")}} {{non-standard_inline}}</dt>
+ <dd>Esta extensión de Mozilla permite especificar el mensaje de error cuando un campo no es validado exitosamente.</dd>
+</dl>
+
+<h2 id="Notas">Notas</h2>
+
+<h3 id="Introducción_de_archivos">Introducción de archivos</h3>
+
+<div class="note">
+<p><strong>Nota:</strong> A partir de {{Gecko("2.0")}}, llamar al método <code>click()</code> en un elemento <code>&lt;input&gt;</code> de tipo "file" abre el selector de archivos y permite al usuario seleccionar archivos. Véase <a href="/es/docs/Using_files_from_web_applications">Utilizar ficheros desde aplicaciones web</a> para ejemplos y más detalles.</p>
+</div>
+
+<p>No se puede establecer el valor de un selector de archivos desde un script. Hacer algo como lo siguiente no tiene efecto alguno:</p>
+
+<pre class="brush: js notranslate">var e = getElementById("someFileInputElement");
+e.value = "foo";
+</pre>
+
+<h3 id="Mensajes_de_error">Mensajes de error</h3>
+
+<p>Para que Firefox presente un mensaje de error personalizado cuando la validación de un campo falla, se puede usar el atributo <code>x-moz-errormessage</code>:</p>
+
+<pre class="brush: html notranslate">&lt;input type="email" x-moz-errormessage="Por favor, especifique una dirección de correo válida."&gt;
+</pre>
+
+<p>Nótese, sin embargo, que esto no es estándar, y no tendrá efecto en otros navegadores.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h2 id="Ejemplo_1_Cuadro_de_texto_simple">Ejemplo 1: Cuadro de texto simple</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html notranslate">&lt;p&gt;Simple input box&lt;/p&gt;
+&lt;input type="text" value="Type here"&gt;
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Example_1_Simple_input_box', '', '100', '', 'Web/HTML/Element/input') }}</p>
+
+<h2 id="Ejemplo_2_Escenario_de_uso_común">Ejemplo 2: Escenario de uso común</h2>
+
+<h3 id="HTML_2">HTML</h3>
+
+<pre class="brush: html notranslate">&lt;p&gt;A common form that includes input tags&lt;/p&gt;
+&lt;form action="getform.php" method="get"&gt;
+    &lt;label&gt;First name: &lt;input type="text"&gt;&lt;/label&gt;&lt;br&gt;
+     &lt;label&gt;Last name: &lt;input type="text"&gt;&lt;/label&gt;&lt;br&gt;
+        &lt;label&gt;E-mail: &lt;input type="email"&gt;&lt;/label&gt;&lt;br&gt;
+&lt;input type="submit" value="Submit"&gt;
+&lt;/form&gt;
+</pre>
+
+<h3 id="Resultado_2">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Example_2_Common_use-case_scenario', '', '200', '', 'Web/HTML/Element/input') }}</p>
+
+<h3 id="Usando_mozactionhint_en_Firefox_mobile">Usando mozactionhint en Firefox mobile</h3>
+
+<p>Se puede usar el atributo {{htmlattrxref("mozactionhint", "input")}} para especificar el texto para la etiqueta de la tecla Enter en el teclado virtual cuando el formulario es mostrado en Firefox mobile. Por ejemplo, para mostrar una etiqueta "Next", se puede hacer esto:</p>
+
+<pre class="brush: html notranslate">&lt;input type="text" mozactionhint="next"&gt;
+</pre>
+
+<p>El resultado es:</p>
+
+<p><a href="/@api/deki/files/4970/=mozactionhint.png"><img alt="mozactionhint.png" class="default internal" src="/@api/deki/files/4970/=mozactionhint.png?size=webview" style="border: 1px solid black; height: 350px; width: 210px;"></a></p>
+
+<h2 id="Regionalización">Regionalización</h2>
+
+<p>Los valores permitidos para ciertos tipos de &lt;input&gt; dependen de la región. En algunos casos, 1,000.00 is a valid number, mientras en otros la manera válida de escribir un número es 1.000,00.</p>
+
+<p>Firefox usa la siguiente heurística para determinar la región con la cual validar los datos introducidos por el usuario (por lo menos para <code>type="number"</code>):</p>
+
+<ul>
+ <li>Intenta con el lenguaje especificado por el atributo <code>lang</code>/<code>xml:lang</code> del elemento o de sus elementos ascendentes.</li>
+ <li>Intenta con el lenguaje especificado en algun encabezado HTTP Content-Language o</li>
+ <li>Si ninguno está especificado, usa la región definida en el navegador.</li>
+</ul>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#the-input-element', '&lt;input&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML Media Capture', '#the-capture-attribute','&lt;input capture&gt;')}}</td>
+   <td>{{Spec2('HTML Media Capture')}}</td>
+   <td>Añade el elemento <code>capture</code></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-input-element', '&lt;input&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.4', '&lt;form&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)<sup>[28]</sup></th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=button</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>3</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=checkbox</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}<br>
+    {{CompatGeckoDesktop("1.9.2")}}<sup>[2]</sup></td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=color</td>
+   <td>21.0</td>
+   <td>{{CompatGeckoDesktop("29.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>11.01</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>type=date</td>
+   <td>5.0<sup>[24]</sup></td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
+  </tr>
+  <tr>
+   <td>type=datetime</td>
+   <td>{{CompatNo}}<sup>[4]</sup></td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
+  </tr>
+  <tr>
+   <td>type=datetime-local</td>
+   <td>5.0</td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
+  </tr>
+  <tr>
+   <td>type=email</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=file</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>3.02</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=hidden</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=image</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}<sup>[5]</sup></td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=month</td>
+   <td>5.0</td>
+   <td>{{CompatNo}}<sup>[6]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
+  </tr>
+  <tr>
+   <td>type=number</td>
+   <td>6.0<sup>[7]</sup></td>
+   <td>{{CompatGeckoDesktop("29.0")}}</td>
+   <td>10<sup>[4]</sup></td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=password</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=radio</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}<br>
+    {{CompatGeckoDesktop("1.9.2")}}<sup>[2]</sup></td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=range</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("23.0")}}</td>
+   <td>10</td>
+   <td>10.62<sup>[8]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=reset</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=search</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>11.01</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=submit</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=tel</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>11.01</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=text</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>type=time</td>
+   <td>5.0</td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
+  </tr>
+  <tr>
+   <td>type=url</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=week</td>
+   <td>5.0</td>
+   <td>{{CompatNo}}<sup>[3]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
+  </tr>
+  <tr>
+   <td>accept=[file extension]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>accept=[MIME type]</td>
+   <td>8.0</td>
+   <td>{{CompatGeckoDesktop("16.0")}}</td>
+   <td>10</td>
+   <td>10</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>accept=audio/*</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}<sup>[9]</sup></td>
+   <td>10</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>accept=video/*</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}<sup>[10]</sup></td>
+   <td>10</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>accept=image/*</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}<sup>[11]</sup></td>
+   <td>10</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>accept=[. + ext]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("37.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>accesskey</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>6</td>
+   <td>1.0</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>mozactionhint</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>autocapitalize</td>
+   <td>43</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>autocomplete</td>
+   <td>17.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>5</td>
+   <td>9.6</td>
+   <td>5.2</td>
+  </tr>
+  <tr>
+   <td>autofocus</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>9.6</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>capture</td>
+   <td>Chrome for Android (0.16)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>checked</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>disabled</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}<sup>[25]</sup></td>
+   <td>6</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>form</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>formaction</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>5.2</td>
+  </tr>
+  <tr>
+   <td>formenctype</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>formmethod</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>5.2</td>
+  </tr>
+  <tr>
+   <td>formnovalidate</td>
+   <td>5.0<sup>[12]</sup></td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>formtarget</td>
+   <td>9.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>5.2</td>
+  </tr>
+  <tr>
+   <td>height</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>1.0</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>incremental</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>inputmode</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>list</td>
+   <td>20.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>9.6</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>max</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>maxlength</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>min</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>minlength</td>
+   <td>40.0</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>multiple</td>
+   <td>1.0<sup>[13]</sup></td>
+   <td>{{CompatGeckoDesktop("1.9.2")}}<sup>[14]</sup><br>
+    {{CompatVersionUnknown}}<sup>[15]</sup></td>
+   <td>10</td>
+   <td>1.0<br>
+    10.62<sup>[14]</sup><br>
+    11.01<sup>[15]</sup></td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>name</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>pattern</td>
+   <td>5.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>9.6</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>placeholder</td>
+   <td>10.0</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>11.00</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>readonly</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>6<sup>[16] </sup></td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>required</td>
+   <td>5.0<br>
+    10<sup>[17]</sup></td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>9.6</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>size</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>spellcheck</td>
+   <td>10.0</td>
+   <td>{{CompatGeckoDesktop("1.9.2")}}</td>
+   <td>10</td>
+   <td>11.0</td>
+   <td>4.0</td>
+  </tr>
+  <tr>
+   <td>src</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>2</td>
+   <td>1.0</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>step</td>
+   <td>6.0</td>
+   <td>{{CompatGeckoDesktop("16.0")}}</td>
+   <td>10</td>
+   <td>10.62</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>tabindex</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>6<sup>[18]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>webkitdirectory</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("49.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>width</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>1.0</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=button</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[27]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=checkbox</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=color</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("27.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=date</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>5.0<sup>[23]</sup></td>
+  </tr>
+  <tr>
+   <td>type=datetime</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
+  </tr>
+  <tr>
+   <td>type=datetime-local</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
+  </tr>
+  <tr>
+   <td>type=email</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>3.1<sup>[19]</sup></td>
+  </tr>
+  <tr>
+   <td>type=file</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}<sup>[27]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[21]</sup></td>
+  </tr>
+  <tr>
+   <td>type=hidden</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=image</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=month</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
+  </tr>
+  <tr>
+   <td>type=number</td>
+   <td>2.3</td>
+   <td>{{CompatGeckoMobile("29.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>4.0<sup>[19]</sup></td>
+  </tr>
+  <tr>
+   <td>type=password</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[22]</sup></td>
+  </tr>
+  <tr>
+   <td>type=radio</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=range</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>type=reset</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=search</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>4.0<sup>[22]</sup></td>
+  </tr>
+  <tr>
+   <td>type=submit</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[27]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>type=tel</td>
+   <td>2.3</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>3.1<sup>[22]</sup></td>
+  </tr>
+  <tr>
+   <td>type=text</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[27]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}<sup>[22]</sup></td>
+  </tr>
+  <tr>
+   <td>type=time</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
+  </tr>
+  <tr>
+   <td>type=url</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>3.1<sup>[19]</sup></td>
+  </tr>
+  <tr>
+   <td>type=week</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>10.62</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>accept=[MIME type]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>accept=audio/*</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>accept=image/*</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}<sup>[26]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>accept=video/*</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>accept=[. + ext]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("37.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>accesskey</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>autocomplete</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>autofocus</td>
+   <td>3.2</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>capture</td>
+   <td>3.0</td>
+   <td>{{CompatGeckoMobile("10.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>6.0</td>
+  </tr>
+  <tr>
+   <td>checked</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>disabled</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>form</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>formaction</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>formenctype</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>formmethod</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>formnovalidate</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>formtarget</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>5.0</td>
+  </tr>
+  <tr>
+   <td>height</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>list</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>max</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("16.0")}}<sup>[20]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>maxlength</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>min</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("16.0")}}<sup>[20]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>minlength</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>27.0</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>multiple</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>name</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>1.0</td>
+  </tr>
+  <tr>
+   <td>pattern</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>placeholder</td>
+   <td>2.3</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>11.10</td>
+   <td>4</td>
+  </tr>
+  <tr>
+   <td>readonly</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>required</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>size</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>spellcheck</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>11.0</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>src</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>step</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("16.0")}}<sup>[20]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>10.62</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>tabindex</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>webkitdirectory</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("49.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>width</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("16.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Fue implementado en la versión 2 o inferior.</p>
+
+<p>[2] Implementado para valor <code>indeterminate</code>.</p>
+
+<p>[3] Esta característica todavía no está implementada. Véase {{bug("888320")}}.</p>
+
+<p>[4] Es reconocido, pero no tiene UI.</p>
+
+<p>[5] Gecko 2.0 {{geckoRelease("2.0")}} solo envía las coordenadas X e Y cuando se presiona, sin enviar nombre/valor del elemento.</p>
+
+<p>[6] Esta característica todavía no está implementada. Véase {{bug("888320")}}.</p>
+
+<p>[7] Regionalización en Chrome 11.</p>
+
+<p>[8] Opera 11.01 añadió soporte para un valor predeterminado.</p>
+
+<p>[9] Filtros para estas extensiones de archivo de audio: .aac, .aif, .flac, .iff, .m4a, .m4b, .mid, .midi, .mp3, .mpa, .mpc, .oga, .ogg, .ra, .ram, .snd, .wav, .wma.</p>
+
+<p>[10] Filtros para estas extensiones de archivo de video: .avi, .divx, .flv, .m4v, .mkv, .mov, .mp4, .mpeg, .mpg, .ogm, .ogv, .ogx, .rm, .rmvb, .smil, .webm, .wmv, .xvid</p>
+
+<p>[11] Filtros para estas extensiones de archivo de imagen: .jpe, .jpg, .jpeg, .gif, .png, .bmp, .ico, .svg, .svgz, .tif, .tiff, .ai, .drw, .pct, .psp, .xcf, .psd, .raw</p>
+
+<p>[12] En 6.0 solo funciona con el tipo de documento HTML5, el soporte para validación en 7.0 fue deshabilitado, y rehabilitado en 10.0.</p>
+
+<p>[13] Soportado para <code>type="file"</code> y <code>type="email"</code> desde la versión 5.0.</p>
+
+<p>[14] Soportado para <code>type="file"</code>.</p>
+
+<p>[15] Supported for <code>type="email"</code>.</p>
+
+<p>[16] No está presente para <code>type="checkbox"</code> y <code>type="radio"</code>.</p>
+
+<p>[17] Soportado para el elemento {{HTMLElement("select")}}.</p>
+
+<p>[18] Elementos con <code>tabindex</code> &gt; <code>0</code> no son navegables.</p>
+
+<p>[19] Sin validación, pero provee un teclado específico. Safari Mobile para iOS aplica un estilo predeterminado de <code>{{cssxref("opacity")}}: 0.4</code> para deshabilitar los elementos <code>&lt;input&gt;</code> textuales. Los demás navegadores mayores no comparten este estilo particular actualmente.</p>
+
+<p>[20] La interfaz podría permanecer sin implementarse.</p>
+
+<p>[21] <a href="http://blog.uploadcare.com/post/97884147203/you-cannot-upload-files-to-a-server-using-mobile-safari">La carga de archivos no funcionaba</a> en Mobile Safari para iOS 8.0 y 8.0.1. Este bug fue corregido en iOs 8.0.2.</p>
+
+<p>[22] Safari Mobile para iOS aplicaba un estilo predeterminado de <code>{{cssxref("opacity")}}: 0.4</code> para deshabilitar los elementos <code>&lt;input&gt;</code> textuales. Los demás navegadores mayores no comparten este estilo particular actualmente.</p>
+
+<p>[23] En Safari Mobile para iOS, la configuración <code>{{cssxref("display")}}: block</code> en un <code>&lt;input&gt;</code> con <code>type="date"</code>, <code>type="time"</code>, <code>type="datetime"</code>, <code>type="datetime-local"</code>, o <code>type="month"</code> causa que el texto dentro del <code>&lt;input&gt;</code> se desalinee verticalmente. Véase {{webkitbug("139848")}}.</p>
+
+<p>[24] Desde Chrome 39, un <code>&lt;input&gt;</code> con <code>type="date"</code> estilizado con <code>{{cssxref("display")}}: table-cell; {{cssxref("width")}}: 100%;</code> tendrá un valor para {{cssxref("min-width")}} impuesto por Chrome, y no puede reducirse a un valor inferior a esa anchura mínima. Véase <a href="https://code.google.com/p/chromium/issues/detail?id=346051">Chromium bug #346051</a>.</p>
+
+<p>[25] De forma predeterminada, Firefox, a diferencia de otros navegadores, <a href="http://stackoverflow.com/q/5985839/432681">persistirá el estado de deshabilitado dinámico y (si aplica), la selección de elementos dinámica</a> de un <code>&lt;input&gt;</code> a través de las cargas de páginas. Estableciedo el valor del atributo {{htmlattrxref("autocomplete","input")}} como <code>off</code> deshabilita esta característica. Esto funciona aun cuando el atributo {{htmlattrxref("autocomplete","input")}} no aplicaría normalmente al <code>&lt;input&gt;</code> debido a su atributo {{htmlattrxref("type","input")}}. Véase {{bug(654072)}}.</p>
+
+<p>[26] A partir de Gecko 9.0 {{geckoRelease("9.0")}}, Firefox para Android permite capturar imágenes usando la cámara para posteriormente cargarlas, sin necesidad de dejar el navegador. Los desarrolladores Web pueden implementar estar característica simplemente estableciendo el valor del atributo <code>accept</code> como <code>image/*</code> en el elemento <code>&lt;input&gt;</code> con <code>type="file"</code>.</p>
+
+<p>[27] Firefox para Android establece un gradiente predeterminado en {{cssxref("background-image")}} para todos los inputs con <code>type="file"</code>. Esto puede ser deshabilitado usando <code>background-image: none;</code>. También establece un valor para {{cssxref("border")}} en los mismos.</p>
+
+<p>[28] Previo a Firefox 51, <code>selectionStart</code> y <code>selectionEnd</code> devolvían <code>0</code> cuando no había selección. Ahora devuelven correctamente la separación del caracter siguiente a la posición actual del cursor, donde se insertará el siguiente caracter.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>Otros elementos relacionados con formularios: {{HTMLElement("form")}}, {{HTMLElement("button")}}, {{HTMLElement("datalist")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("select")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("option")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
+ <li><a class="external" href="http://webdesignerwall.com/tutorials/cross-browser-html5-placeholder-text">Cross-browser HTML5 placeholder text</a></li>
+</ul>
diff --git a/files/es/web/html/element/input/number/index.html b/files/es/web/html/element/input/number/index.html
new file mode 100644
index 0000000000..7f0b4166e8
--- /dev/null
+++ b/files/es/web/html/element/input/number/index.html
@@ -0,0 +1,451 @@
+---
+title: <input type="number">
+slug: Web/HTML/Element/input/number
+tags:
+  - Elemento
+  - Elemento de entrada
+  - Formulários HTML
+  - HTML
+  - Número
+  - Referencia
+  - Tipo de entrada
+  - formulários
+translation_of: Web/HTML/Element/input/number
+original_slug: Web/HTML/Elemento/input/number
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">Elementos {{HTMLElement("input")}} del tipo <strong><code>number</code></strong> son usados para permitir al usuario ingresar un número. Éstos incluyen validación incorporada para rechazar entradas no numéricas.</span> El navegador puede optar por proveer flechas de pasos para permitir al usuario incrementar y decrementar el valor usando su ratón o símplemente pulsando con la punta del dedo.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/input-number.html", "tabbed-shorter")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<p>En navegadores que no soportan entradas de tipo <code>number</code>, una entrada <code>number</code> recurre al tipo <code>text</code>.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td><strong>{{anch("Value")}}</strong></td>
+   <td>Un {{jsxref("Number")}} representando un número, o vacío.</td>
+  </tr>
+  <tr>
+   <td><strong>Eventos</strong></td>
+   <td>{{domxref("HTMLElement/change_event", "change")}} e {{domxref("HTMLElement/input_event", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos comunes que soporta</strong></td>
+   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("readonly", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos IDL</strong></td>
+   <td><code>list</code>, <code>value</code>, <code>valueAsNumber</code></td>
+  </tr>
+  <tr>
+   <td><strong>Métodos</strong></td>
+   <td>{{domxref("HTMLInputElement.select", "select()")}}, {{domxref("HTMLInputElement.stepUp", "stepUp()")}}, {{domxref("HTMLInputElement.stepDown", "stepDown()")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Valor">Valor</h2>
+
+<p>Un {{jsxref("Number")}} representando el valor del número ingresado en la entrada. Tú puedes colocar el valor por omisión para la entrada incluyendo un número dentro del atributo {{htmlattrxref("value", "input")}}, de esta manera:</p>
+
+<pre class="brush: html">&lt;input id="number" type="number" value="42"&gt;</pre>
+
+<p>{{EmbedLiveSample('Value', 600, 40)}}</p>
+
+<h2 id="Atributos_adicionales">Atributos adicionales</h2>
+
+<p>Además de los atributos comúnmente soportados por todos los tipos de {{HTMLElement("input")}}, las entradas de tipo <code>number</code> soportan estos atributos:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Atributo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>{{anch("list")}}</code></td>
+   <td>El <code>id</code> del elemento {{HTMLElement("datalist")}} que contiene las opciones predefinidas de autocompletado.</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("max")}}</code></td>
+   <td>El valor máximo a aceptar para esta entrada</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("min")}}</code></td>
+   <td>El valor mínimo a aceptar para esta entrada</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("placeholder")}}</code></td>
+   <td>Un valor de ejemplo para mostrar dentro del campo cuando esté vacío</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("readonly")}}</code></td>
+   <td>Un atributo Booleano indicando si el valor es de solo lectura</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("step")}}</code></td>
+   <td>El intervalo de paso a usar cuando se usen las flechas arriba y abajo para ajustar el valor, así como para su validación</td>
+  </tr>
+ </tbody>
+</table>
+
+<p id="htmlattrdeflist">{{page("/en-US/docs/Web/HTML/Element/input/text", "list", 0, 1, 2)}}</p>
+
+<h3 id="htmlattrdefmax">{{htmlattrdef("max")}}</h3>
+
+<p>El valor máximo a aceptar para esta entrada. Si el {{htmlattrxref("value", "input")}} ingresado en el elemento excede éste, el elemento falla la <a href="https://developer.mozilla.org/es/docs/HTML/HTML5/Validacion_de_restricciones">validación de restricciones</a>. Si el valor del atributo <code>max</code> no es un número, entonces el elemento no tiene un valor máximo.</p>
+
+<p>Este valor debe ser mayor que o igual al valor del atributo <code>min</code>.</p>
+
+<h3 id="htmlattrdefmin">{{htmlattrdef("min")}}</h3>
+
+<p>El valor mínimo a aceptap para esta entrada. Si el {{htmlattrxref("value", "input")}} del elemento es menor que éste, el elemento falla la <a href="https://developer.mozilla.org/es/docs/HTML/HTML5/Validacion_de_restricciones">validación de restricciones</a>. Si un valor es especificado para <code>min</code> que no sea un número valido, la entrada no tiene un valor mínimo.</p>
+
+<p>Este valor debe ser menor que o igual al valor del atributo <code>max</code>.</p>
+
+<p>{{page("/en-US/docs/Web/HTML/Element/input/text", "placeholder", 0, 1, 2)}}</p>
+
+<p>{{page("/en-US/docs/Web/HTML/Element/input/text", "readonly", 0, 1, 2)}}</p>
+
+<h3 id="htmlattrdefstep">{{htmlattrdef("step")}}</h3>
+
+<div id="step-include">
+<p>El atributo <code>step</code> es un número que especifica la granularidad a la que debe adherirse el valor, o el valor especial <code>any</code>, el cual es descrito abajo. Solo valores que sean iguales a la base del escalonado (<code>{{anch("min")}}</code> si es especificado, si no {{htmlattrxref("value", "input")}}, y un valor por omisión apropiado si ninguno de esos es provisto) son válidos.</p>
+
+<p>Una valor de cadena <code>any</code> significa que ningún escalonado es implicado, y cualquier valor es permitido (salvo otras restricciones, tales como <code>{{anch("min")}}</code> y <code>{{anch("max")}}</code>).</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Cuando los datos ingresados por el usuario no se adhieran a la configuración de escalonado, el {{Glossary("user agent")}} puede redondear al valor válido más cercano, prefiriendo numeros en la dirección positiva cuando hayan dos opciones igualmente cercanas.</p>
+</div>
+</div>
+
+<p>El valor por omisión de paso para entradas <code>number</code> es <code>1</code>, permitiendo solo enteros ser ingresados—<em>a menos que</em> la base del escalonado no sea un entero.</p>
+
+<h2 id="Usar_entradas_numéricas">Usar entradas numéricas</h2>
+
+<p>Elementos <code>&lt;input type="number"&gt;</code> pueden ayudar a simplificar tu trabajo al construir la interfaz de usuario y la lógica para ingresar números en un formulario. Cuando creas una entrada numérica con el valor apropiado para <code>type</code>, <code>number</code>, obtienes validación automática para que el texto sea un número, y usualmente un juego de botones arriba y abajo para subir y bajar el valor.</p>
+
+<div class="warning">
+<p><strong>Importante</strong>: Ten en mente que, lógicamente, no deberías poder ingresar otros caracteres que no sean números dentro de una entrada numérica. Parece haber algo de desacuerdo acerca de esto entre navegadores; ver {{bug(1398528)}}.</p>
+</div>
+
+<div class="note">
+<p><strong>Nota</strong>: Es crucial recordar que un usuario puede jugar con tu HTML tras bambalinas, así que tu sitio<em> no debe</em> usar validación simple del lado del cliente para ningún fin de seguridad. Tú <em>debes</em> verificar en el lado del servidor cualquier transacción en la cual el valor provisto pueda tener alguna implicación de seguridad de cualquier tipo.</p>
+</div>
+
+<p>Los navegadores de móviles ayudan más con la experiencia de usuario mostrando un teclado especial mejor adaptado para ingresar números cuando el usuario intente ingresar un valor. La siguiente captura de pantalla es tomada de Firefox para Android:</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14963/number-keyboard-fxa.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
+
+<h3 id="Una_entrada_numérica_simple">Una entrada numérica simple</h3>
+
+<p>En su forma más básica, una entrada numérica puede ser implementada así:</p>
+
+<pre class="brush: html">&lt;label for="ticketNum"&gt;Number of tickets you would like to buy:&lt;/label&gt;
+&lt;input id="ticketNum" type="number" name="ticketNum" value="0"&gt;</pre>
+
+<p>{{EmbedLiveSample('A_simple_number_input', 600, 40)}}</p>
+
+<p>Una entrada numérica es considerada válida cuando está vacía y cuando un único número es ingresado, pero por lo demás es inválida. Si el atributo xxxx es usado, la entrada ya no es considerada válida cuando esté vacía.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Cualquier número es un valor aceptable, mientras que sea un <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#valid-floating-point-number">número de punto flotante válido</a> (eso es, no <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a> o <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Infinity">Infinity</a>).</p>
+</div>
+
+<h3 id="Marcas_de_lugar_Placeholders">Marcas de lugar (Placeholders)</h3>
+
+<p>Algunas veces es de ayuda ofrecer una indicación en contexto en cuanto a qué forma deben tomar los datos de entrada. Esto puede ser especialmente importante si el diseño de la página no ofrece etiquetas descriptivas para cada {{HTMLElement("input")}}. Es aquí donde entran las <strong>marcas de lugar</strong>. Una marca de lugar es un valor comúnmente usado para proveer un indicio en cuanto al formato que la entrada debe tomar por <code>value</code>. Este es mostrado dentro de la caja de edición cuando el <code>value</code> del elemento es <code>""</code>. Una vez que los datos son ingresados dentro de la caja, la marca de lugar desaparece; si la caja es vaciada, la marca de lugar reaparece.</p>
+
+<p>Aquí, tenemos una entrada <code>number</code> con la marca de lugar "<code>Multiple of 10</code>". Nota cómo la marca de lugar desaparece y reaparece conforme manipulas el contenido del campo de edición.</p>
+
+<pre class="brush: html">&lt;input type="number" placeholder="Multiple of 10"&gt;</pre>
+
+<p>{{EmbedLiveSample('Placeholders', 600, 40)}}</p>
+
+<h3 id="Controlar_el_tamaño_del_escalón">Controlar el tamaño del escalón</h3>
+
+<p>Por omisión, los botones arriba y abajo provistos para que pases el número de arriba a abajo pasarán por 1 el valor arriba y abajo. Puedes cambiar esto proveyendo un atributo {{htmlattrxref("step", "input")}}, el cual toma como valor un número que especifica la cantidad de escalones. Nuestro ejemplo arriba contiene una marca de lugar diciendo que el valor debe ser un múltiplo de 10, por lo tanto tiene sentido agregar un valor a <code>step</code> de <code>10</code>:</p>
+
+<pre class="brush: html">&lt;input type="number" placeholder="multiple of 10" step="10"&gt;</pre>
+
+<p>{{EmbedLiveSample('Controlling_step_size', 600, 40)}}</p>
+
+<p>En este ejemplo, debes hallar que las flechas de subir y bajar escalón incrementan y decrementan el valor por 10 cada vez, y no por 1. Aún puedes ingresar manualmente un número que no sea múltiplo de 10, pero este será considerado inválido.</p>
+
+<h3 id="Especificar_valores_máximo_y_mínimo">Especificar valores máximo y mínimo</h3>
+
+<p>Puedes usar los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para especificar un valor mínimo y máximo que pueda tener el campo. Por ejemplo, demos a nuestro ejemplo un mínimo de <code>0</code>, y un máximo de <code>100</code>:</p>
+
+<pre class="brush: html">&lt;input type="number" placeholder="multiple of 10" step="10" min="0" max="100"&gt;</pre>
+
+<p>{{EmbedLiveSample('Specifying_minimum_and_maximum_values', 600, 40)}}</p>
+
+<p>En esta versión actualizada, debes hallar que los botones para subir y bajar escalón no te permitirán ir bajo 0 o sobre 100. Tú aún puedes ingresar manualmente un número fuera de estos límites, pero este será considerado inválido.</p>
+
+<h3 id="Permitir_valores_decimales">Permitir valores decimales</h3>
+
+<p>Un problema con las entradas numéricas es que su tamaño de escalón por omisión es 1. Si tratas de ingresar un número con un decimal (tal como "1.0"), este será considerado como inválido. Si quieres ingresar un valor que requiere decimales, necesitarás reflejar esto en el valor <code>step</code> (p.ej. <code>step="0.01"</code> para permitir hasta dos dígitos en la parte decimal). Aquí hay un ejemplo simple:</p>
+
+<pre class="brush: html">&lt;input type="number" placeholder="1.0" step="0.01" min="0" max="10"&gt;</pre>
+
+<p>{{EmbedLiveSample("Allowing_decimal_values", 600, 40)}}</p>
+
+<p>Note que este ejemplo permite cualquier valor entre <code>0.0</code> y <code>10.0</code>, con decimales a dos cifras. Por ejemplo, "9.52" es válido, pero "9.521" no lo es.</p>
+
+<h3 id="Controlar_el_tamaño_de_la_entrada">Controlar el tamaño de la entrada</h3>
+
+<p>Los elementos {{HTMLElement("input")}} de tipo <code>number</code> no soportan atributos de dimensión tales como {{htmlattrxref("size", "input")}}. Necesitarás recurrir a <a href="/en-US/docs/Web/CSS">CSS</a> para cambiar el tamaño de estos controles.</p>
+
+<p>Por ejemplo, para ajustar el ancho de la entrada para que sea tan ancho como se necesita para ingresar un número de tres dígitos, podemos cambiar nuestro HTML para incluir un xxxx y acortar nuestra marca de lugar (placeholder) ya que el campo estará demasiado angosto para el texto que hemos estado usando hasta ahora:</p>
+
+<pre class="brush: html">&lt;input type="number" placeholder="x10" step="10" min="0" max="100" id="number"&gt;</pre>
+
+<p>Entonces agregamos algo de CSS para reducir el ancho del elemento con el selector de <code>id</code>, <code>#number</code>:</p>
+
+<pre class="brush: css">#number {
+  width: 3em;
+}</pre>
+
+<p>El resultado se ve así:</p>
+
+<p>{{EmbedLiveSample('Controlling_input_size', 600, 40)}}</p>
+
+<h3 id="Ofrecer_valores_sugeridos">Ofrecer valores sugeridos</h3>
+
+<p>Tú puedes proveer una lista de las opciones por defecto de las cuales el usuario puede seleccionar especificando el atributo {{htmlattrxref("list", "input")}}, el cual contiene como su valor el {{htmlattrxref("id")}} de un {{HTMLElement("datalist")}}, el cual a su vez contiene un elemento {{HTMLElement("option")}} por valor sugerido. El <code>value</code> de cada <code>option</code> es el valor sugerido correspondiente para la caja de entrada numérica.</p>
+
+<pre class="brush: html">&lt;input id="ticketNum" type="number" name="ticketNum" list="defaultNumbers"&gt;
+&lt;span class="validity"&gt;&lt;/span&gt;
+
+&lt;datalist id="defaultNumbers"&gt;
+  &lt;option value="10045678"&gt;
+  &lt;option value="103421"&gt;
+  &lt;option value="11111111"&gt;
+  &lt;option value="12345678"&gt;
+  &lt;option value="12999922"&gt;
+&lt;/datalist&gt;</pre>
+
+<p>{{EmbedLiveSample("Offering_suggested_values", 600, 40)}}</p>
+
+<div class="note">
+<p>El uso del atributo {{htmlattrxref("list", "input")}} con entradas <code>number</code> no está soportado en todos los navegadores. Funciona en Chrome y Opera, por ejemplo, pero no en Firefox.</p>
+</div>
+
+<h2 id="Validación">Validación</h2>
+
+<p>Ya hemos mencionado una serie de características de validación para entradas <code>number</code>, pero revisémoslas ahora:</p>
+
+<ul>
+ <li>Elementos <code>&lt;input type="number"&gt;</code> automáticamente invalidan cualquier entrada que no sea un número (o vacío, a menos que se especifique <code>required</code> ).</li>
+ <li>Puedes usar el atributo {{htmlattrxref("required", "input")}} para invalidar una entrada vacía. (En otras palabras, la entrada <em>debe</em> ser llenada).</li>
+ <li>Puedes usar el atributo {{htmlattrxref("step", "input")}} para restringir valores válidos a cierto conjunto de escalones (p.ej. múltiplos de 10).</li>
+ <li>Puedes usar los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para restringir los límites inferior y superior de los valores válidos.</li>
+</ul>
+
+<p>El siguiente ejemplo presenta todas las características anteriores, así como el uso de CSS para mostrar íconos de validez o invalidez, dependiendo del valor del <code>input</code>:</p>
+
+<pre class="brush: html">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="balloons"&gt;Number of balloons to order (multiples of 10):&lt;/label&gt;
+    &lt;input id="balloons" type="number" name="balloons" step="10" min="0" max="100" required&gt;
+    &lt;span class="validity"&gt;&lt;/span&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;input type="submit"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>{{EmbedLiveSample("Validation", 600, 80)}}</p>
+
+<p>Intenta enviar el formulario con diferentes valores inválidos ingresados — p.ej., siv valor; un valor abajo de 0 o arriba de 100; un valor que no sea múltiplo de 10; o un valor no numérico — y mira cómo los mensajes de error que te da el navegador difieren con estos.</p>
+
+<p>El CSS aplicado a este ejemplo es el siguiente:</p>
+
+<pre class="brush: css">div {
+  margin-bottom: 10px;
+}
+
+input:invalid+span:after {
+  content: '✖';
+  padding-left: 5px;
+}
+
+input:valid+span:after {
+  content: '✓';
+  padding-left: 5px;
+}</pre>
+
+<p>Aquí utilizamos las pseudo clases {{cssxref(":invalid")}} y {{cssxref(":valid")}} para mostrar un ícono apropiado de invalidez o validez como contenido generado en el elemento adyacente {{htmlelement("span")}}, como un indicador visual.</p>
+
+<p>Lo colocamos en un elemento separado <code>&lt;span&gt;</code> para mayor flexibilidad. Algunos navegadores no muestran contenido generado muy eficientemente en algunos tipos o entradas de formulario. (Lee, por ejemplo, la sección sobre <a href="/es/docs/Web/HTML/Element/input/date#Validation">validación de <code>&lt;input type="date"&gt;</code></a>).</p>
+
+<div class="warning">
+<p><strong>Importante</strong>: ¡La validación de formularios HTML <em>no</em> es un substituto de scripts del lado del servidor que asegure que los datos estén en el formato apropiado!</p>
+
+<p>Es demasiado fácil para alguien hacer ajustes al HTML que le prmita evitar la validación, o removerla completamente. También es posible para alguien evadir tu HTML y enviar los datos directamente a tu servidor.</p>
+
+<p>Si tu código del lado del servidor falla el validar los datos que recibe, el desastre podría azotar cuando datos que no están formateados apropiadamente sean enviados (o cuando los datos son demasiado grandes, o son del tipo incorrecto, y así sucesivamente).</p>
+</div>
+
+<h3 id="Validación_de_patron">Validación de patron</h3>
+
+<p>Elementos <code>&lt;input type="number"&gt;</code> no soportan el uso del atributo {{htmlattrxref("pattern", "input")}} para hacer que los valores ingresados se ajusten a un patrón de expresión regular específico.</p>
+
+<p>La fundamentación para esto es que las entradas numéricas no serán válidas si contienen cualquier cosa excepto números, y tú puedes restringir el número mínimo y máximo de dígitos válidos usando los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} (a como se explica arriba).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Ya hemos cubierto el hecho de que por defecto, el incremento es <code>1</code>, y tú puedes usar el atributo {{htmlattrxref("step", "input")}} para permitir entradas decimales. Echemos un vistazo más de cerca.</p>
+
+<p>En el siguiente ejemplo hay un formulario para ingresar la estatura del usuario. Por defecto acepta la estatura en metros, pero puedes hacer click en el botón apropiado para cambiar el formulario a que acepte pies y pulgadas. La entrada para la estatura en metros acepta decimales a dos posiciones.</p>
+
+<p>{{EmbedLiveSample("Examples", 600, 100)}}</p>
+
+<p>El HTML se ve así:</p>
+
+<pre class="brush: html">&lt;form&gt;
+    &lt;div class="metersInputGroup"&gt;
+        &lt;label for="meters"&gt;Enter your height — meters:&lt;/label&gt;
+        &lt;input id="meters" type="number" name="meters" step="0.01" min="0" placeholder="e.g. 1.78" required&gt;
+        &lt;span class="validity"&gt;&lt;/span&gt;
+    &lt;/div&gt;
+    &lt;div class="feetInputGroup" style="display: none;"&gt;
+        &lt;span&gt;Enter your height — &lt;/span&gt;
+        &lt;label for="feet"&gt;feet:&lt;/label&gt;
+        &lt;input id="feet" type="number" name="feet" min="0" step="1"&gt;
+        &lt;span class="validity"&gt;&lt;/span&gt;
+        &lt;label for="inches"&gt;inches:&lt;/label&gt;
+        &lt;input id="inches" type="number" name="inches" min="0" max="11" step="1"&gt;
+        &lt;span class="validity"&gt;&lt;/span&gt;
+    &lt;/div&gt;
+    &lt;div&gt;
+      &lt;input type="button" class="meters" value="Enter height in feet and inches"&gt;
+    &lt;/div&gt;
+    &lt;div&gt;
+        &lt;input type="submit" value="Submit form"&gt;
+    &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Verás que estamos usando muchos de los atributos que ya hemos visto antes en el artículo. Como queremos que acepte un valor de medida en centímetros, hemos colocado el valor de <code>step</code> a <code>0.01</code>, de manera que valores como <em>1.78</em> no sean vistos como inválidos. También hemos provisto una marca de lugar (placeholder) para esa entrada.</p>
+
+<p>Hemos escondido las entradas de pies y pulgadas inicialmente usando <code>style="display: none;"</code>, de manera que metros sea el tipo de entrada preseleccionado.</p>
+
+<p>Ahora, al CSS. Este se ve muy similar al estilo de validación que vimos antes; nada extraordinario aquí.</p>
+
+<pre class="brush: css">div {
+  margin-bottom: 10px;
+  position: relative;
+}
+
+input[type="number"] {
+  width: 100px;
+}
+
+input + span {
+  padding-right: 30px;
+}
+
+input:invalid+span:after {
+  position: absolute;
+  content: '✖';
+  padding-left: 5px;
+}
+
+input:valid+span:after {
+  position: absolute;
+  content: '✓';
+  padding-left: 5px;
+}</pre>
+
+<p>Y finalmente, el JavaScript:</p>
+
+<pre class="brush: js">let metersInputGroup = document.querySelector('.metersInputGroup')
+let feetInputGroup = document.querySelector('.feetInputGroup')
+let metersInput = document.querySelector('#meters')
+let feetInput = document.querySelector('#feet')
+let inchesInput = document.querySelector('#inches')
+let switchBtn = document.querySelector('input[type="button"]')
+
+switchBtn.addEventListener('click', function() {
+  if(switchBtn.getAttribute('class') === 'meters') {
+    switchBtn.setAttribute('class', 'feet')
+    switchBtn.value = 'Enter height in meters'
+
+    metersInputGroup.style.display = 'none'
+    feetInputGroup.style.display = 'block'
+
+    feetInput.setAttribute('required', '')
+    inchesInput.setAttribute('required', '')
+    metersInput.removeAttribute('required')
+
+    metersInput.value = ''
+  } else {
+    switchBtn.setAttribute('class', 'meters')
+    switchBtn.value = 'Enter height in feet and inches'
+
+    metersInputGroup.style.display = 'block'
+    feetInputGroup.style.display = 'none'
+
+    feetInput.removeAttribute('required')
+    inchesInput.removeAttribute('required')
+    metersInput.setAttribute('required', '')
+
+    feetInput.value = ''
+    inchesInput.value = ''
+  }
+});</pre>
+
+<p>Después de declarar unas pocas variables, un manejador de eventos s agredgado al <code>button</code> para controlar el mecanismo interruptor. Esto es bastante simple, principalmente involucra cambiar las {{HTMLElement("label")}} y <code>class</code> del botón, y actualizar los valores de muestra de los dos conjuntos de entradas cuando el botón sea presionado.</p>
+
+<p>(Nota que aquí no estamos convirtiendo de aquí para allá entre metros y pies/pulgadas, lo que probablemente haría una aplicación web en la vida real.)</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Cuando el usuario haga click en el botón, el(los) atributo(s) <code>required</code> de la(s) entradas que estemos ocultando son removidos, y vaciará el <code>value</code> del(los) atributo(s). Esto es de manera que el formulario pueda ser enviado si ambos conjuntos de entradas no están llenas. También asegura que el formulario no enviará datos que el usuario no quiera.</p>
+
+<p>¡Si no hicieras eso, tendrías que llenar ambos pies/pulgadas <strong>y</strong> metros para enviar el formulario!</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#number-state-(type=number)', '&lt;input type="number"&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'sec-forms.html#number-state-typenumber', '&lt;input type="number"&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.input.input-number")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Learn/HTML/Forms">Guía de formularios HTML</a></li>
+ <li>{{HTMLElement("input")}}</li>
+ <li><code><a href="/es/docs/Web/HTML/Element/input/tel">&lt;input type="tel"&gt;</a></code></li>
+ <li><a href="/es/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Compatibilidad de propiedades CSS</a></li>
+</ul>
diff --git a/files/es/web/html/element/input/password/index.html b/files/es/web/html/element/input/password/index.html
new file mode 100644
index 0000000000..63dccbe20f
--- /dev/null
+++ b/files/es/web/html/element/input/password/index.html
@@ -0,0 +1,133 @@
+---
+title: <input type="password">
+slug: Web/HTML/Element/input/password
+tags:
+  - Element
+  - HTML
+  - Reference
+translation_of: Web/HTML/Element/input/password
+original_slug: Web/HTML/Elemento/input/password
+---
+<p> </p>
+
+<p>{{HTMLRef}}</p>
+
+<p>Los elementos <code>&lt;input&gt;</code> de tipo <strong><code>"password"</code></strong> proporcionan una forma para que el usuario ingrese una contraseña de forma segura. El elemento se presenta como un control de editor de texto, sin formato, de una línea, en el que el texto está oculto para que no pueda leerse, generalmente reemplazando cada carácter con un símbolo como el asterisco ("*") o un punto ("•"). Este carácter variará dependiendo del {{Glossary("user agent")}} y del {{Glossary("OS")}}.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Flow content</a>, listado, tabla enviable, reseteable, elementos de forma asociada, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">phrasing content</a>, elementos etiquetables, contenido palpable.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno, es un {{Glossary("empty element")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>Tiene que tener una etiqueta al inicio y no tener una etiqueta final.</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos de parentescos</th>
+   <td>Cualquier elemento que accepta <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLInputElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Además de los atributos listados abajo, este elemento puede tener cualquier <a href="/en-US/docs/HTML/Global_attributes">global attributes</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("autocomplete")}}{{HTMLVersionInline("5")}}</dt>
+ <dd>Establece el valor del atributo de autocompletado en el campo de una contraseña. En caso de ser cierto, automaticamente se rellena con el valor previamente almacenado.</dd>
+ <dt>{{htmlattrdef("autofocus")}}{{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo Booleano te permite especificar que la página ponga el foco en un campo a menos que el usuario lo revoque, por ejemplo, escribir en un campo diferente. Solo un elemento en el documento puede tener el atributo Booleano <strong>autofocus</strong>.</dd>
+ <dt>{{htmlattrdef("disabled")}}</dt>
+ <dd>
+ <p>Este atributo Booleano indica que el campo de la contraseña no está disponible. Además, deshabilita los valores que no son enviados por el campo.</p>
+ </dd>
+ <dt>{{htmlattrdef("defaultvalue")}}</dt>
+ <dd>Define un valor predeterminado en el campo de la contraseña.</dd>
+ <dt>{{htmlattrdef("inputmode")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Le da proporciona información al buscador sobre que teclado mostrar. Los valores posibles son:
+ <ul>
+  <li><code>verbatim</code>: Alfanumérico, contenido no verbla tales como usuarios y contraseñas.</li>
+  <li><code>latin</code>: Introducción de texto en el lenguaje preferido del usuario con ayudas de escritura, como predicción de texto. Se usa para comunicación de usuario a ordenador en, por ejemplo, campos de búsqueda.</li>
+  <li><code>latin-name</code>: Como <em>latin</em>, pero para nombres de personas.</li>
+  <li><code>latin-prose</code>: Como <em>latin</em>, pero con unas ayudas de escritura más activas. Para comunicación de usuario a usuario como por ejemplo, mensajería instantanea o emails.</li>
+  <li><code>full-width-latin</code>: Como <em>latin-prose</em>, pero para lenguajes secundarios del usuario.</li>
+  <li><code>kana</code>: Entrada de texto Kana o romaji, normalmente entrada hiragana, usa carácteres con ancho completo, con soporte para converstirse a kanji. Establecido para la entrada de texto Japonés.</li>
+  <li><code>katakana</code>: Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("maxlength")}}</dt>
+ <dd>Establece el valor del atributo maxlength en el campo de una contraseña.</dd>
+ <dt>{{htmlattrdef("minlength")}}</dt>
+ <dd>Establece el valor del atributo minlength en el campo de una contraseña.</dd>
+ <dt>{{htmlattrdef("name")}}</dt>
+ <dd>Nombre del campo, usado para datos enviados desde formulario.</dd>
+ <dt>{{htmlattrdef("pattern")}}{{HTMLVersionInline("5")}}</dt>
+ <dd> Establece el valor del atributo pattern del campo de una contraseña.</dd>
+ <dt>{{htmlattrdef("placeholder")}}{{HTMLVersionInline("5")}}</dt>
+ <dd>Establece el valor del atributo placeholder del campo de una contraseña.</dd>
+ <dt>{{htmlattrdef("readonly")}}</dt>
+ <dd>Este atributo Booleano indica que el usuario no puede modificar el valor del campo de una contraseña.</dd>
+ <dt>{{htmlattrdef("required")}}{{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo Booleano especifica que el usuario debe rellenar con un valor antes de enviar un formulario.</dd>
+ <dt>{{htmlattrdef("size")}}</dt>
+ <dd>Establece el valor del atributo size del campo de una contraseña.</dd>
+ <dt> </dt>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Para crear un widget que muestre una constraseña, use:</p>
+
+<pre class="brush: html">&lt;input type="password"&gt;</pre>
+
+<p>Para crear un widget que muestre una contraseña con un patrón o diseño, use:</p>
+
+<pre class="brush: html">&lt;input type="password" pattern=".{6,}"&gt;</pre>
+
+<p>El ejemplo de arriba creará un elemento password que deberá contener 6 o más carácteres.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'the-input-element.html#the-input-element', '&lt;input&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-input-element', '&lt;input&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.4', '&lt;form&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Fix me:</strong> Insert Browser Compatibility table here.</p>
+</div>
+
+<h2 id="sect1"> </h2>
diff --git a/files/es/web/html/element/input/range/index.html b/files/es/web/html/element/input/range/index.html
new file mode 100644
index 0000000000..7c7219c4b5
--- /dev/null
+++ b/files/es/web/html/element/input/range/index.html
@@ -0,0 +1,417 @@
+---
+title: <input type="range">
+slug: Web/HTML/Element/input/range
+tags:
+  - Elementos
+  - Formulários HTML
+  - HTML etiqueta input
+  - Input
+  - Range
+  - Rango
+  - Referencia
+  - Web
+  - deslizador
+  - formulários
+  - slider
+translation_of: Web/HTML/Element/input/range
+original_slug: Web/HTML/Elemento/input/range
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">El elemento {{HTMLElement("input")}} del tipo <code><strong>"range"</strong></code> permite que el usuario especifique un valor numérico comprendido entre un valor mínimo y máximo. El valor exacto, sin embargo, no se considera importante. Se repesenta típicamente como un "tirador" o un control deslizante en lugar de un campo de texto como otros tipos de {{HTMLElement("input")}}.</span> Como este tipo de widget es bastante inmpreciso, no debe utilizarse normalmente a menos que el valor exacto del control no sea importante.</p>
+
+<div id="summary_sample1">
+<pre class="brush: html">&lt;input type="range"&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample("summary_sample1", 600, 40)}}</p>
+
+<p>Si el navegador del usuario no soporta el tipo <code>"range"</code>, será tratado como un input de tipo <code><a href="/en-US/docs/Web/HTML/Element/input/text">"text"</a></code>.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td><strong>{{anch("Value")}}</strong></td>
+   <td>Un {{domxref("DOMString")}} que contiene la cadena que representa el valor numérico seleccionado; use {{domxref("HTMLInputElement.valueAsNumber", "valueAsNumber")}} to get the value as a {{jsxref("Number")}}.</td>
+  </tr>
+  <tr>
+   <td><strong>Eventos</strong></td>
+   <td>{{event("change")}} e {{event("input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos comunes soportados</strong></td>
+   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("max", "input")}}, {{htmlattrxref("min", "input")}} y {{htmlattrxref("step", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos IDL </strong></td>
+   <td><code>list</code>, <code>value</code> y <code>valueAsNumber</code></td>
+  </tr>
+  <tr>
+   <td><strong>Metodos</strong></td>
+   <td>{{domxref("HTMLInputElement.stepDown", "stepDown()")}} y {{domxref("HTMLInputElement.stepUp", "stepUp()")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Value">Value</h2>
+
+<p>El atributo {{htmlattrxref("value", "input")}} contiene un {{domxref("DOMString")}} que es la representación de tipo cadena del número seleccionado. El valor nunca es una cadena vacía (<code>""</code>). El valor por defecto es el punto intermedio entre los valores mínimo y máximo especificados, a menos que el valor máximo sea menor que el valor mínimo, en cuyo caso el valor por defecto será el valor del atributo <code>min</code>. El algoritmo de determina el valor por defecto es:</p>
+
+<pre class="brush: js">defaultValue = (rangeElem.max &lt; rangeElem.min) ? rangeElem.min
+               : rangeElem.min + (rangeElem.max - rangeElem.min)/2;</pre>
+
+<p><span id="result_box" lang="es"><span>Si se intenta establecer un valor inferior al mínimo definido, el valor será igual al mínimo.</span> <span>De manera similar, un intento de establecer un valor superior al máximo da como resultado el valor máximo.</span></span></p>
+
+<h2 id="Usando_inputs_range">Usando inputs range</h2>
+
+<p>El input de tipo <code>"number"</code> permite al usuario introducir un número y, opcionalmente, forzarle a que dicho valor se encuentre entre un mínimo y un máximo, pero le obliga a introducir un valor específico. El input de tipo <code>"range"</code> pide al usuario que indique el valor en un rango numérico sin que tenga que preocuparse qué valor numérico específico está seleccionado.</p>
+
+<p>Los ejemplos títpicos de situaciones en las que se pueden usar inputs de tipo rango suelen ser:</p>
+
+<ul>
+ <li>Controles de audio (volumen o balance) o controles de filtro.</li>
+ <li>Configuración de color, como canales, transparencia, brillo, etc.</li>
+ <li>Controles de configuración de juegos, como dificultad, distancia de visibilidad, tamaño del nunodGame configuration controls such as difficulty, visibility distance, world size, etc.</li>
+ <li>Longitud de contraseñas para un gestor de contraseñas generadas.</li>
+</ul>
+
+<p>Como regla general, si el usuario está más interesado en la distancia entre un mínimo y un máximo más que en el propio valor en sí  mismo, el input de tipo rango es el candidato perfecto. Por ejemplo, en el caso del control del volumen de un equipo estéreo, el usuario normalmente piensa "pon el volumen a la midad" en lugar de "pon el volumen al 0,5".</p>
+
+<h3 id="Especificar_los_valores_mínimo_y_máximo">Especificar los valores mínimo y máximo</h3>
+
+<p>Por defecto, el valor mínimo es 0 y el máximo es 100. Si es necesario modificar dichos valores, podemos usar los atributos {{htmlattrxref("min", "input")}} y/o {{htmlattrxref("max", "input")}}. Podemos usar cualquier valor de coma flotante.</p>
+
+<p>Por ejemplo, para usar un rango entre -10 y 10, usaremos:</p>
+
+<pre class="brush: html">&lt;input type="range" min="-10" max="10"&gt;</pre>
+
+<p>{{EmbedLiveSample("Specifying_the_minimum_and_maximum", 600, 40)}}</p>
+
+<h3 id="Definir_el_tamaño_de_los_saltos">Definir el tamaño de los saltos</h3>
+
+<p>Por defecto, cada salto tiene valor 1, es decir el valor será siempre un número entero. Podemos cambiarlo mediante el atributo {{htmlattrxref("step")}}. Si necesitas, por ejemplo, un valor entre 5 y 10 con una precisión de dos decimales, debes indicar que el valor de <code>step</code> es 0.01:</p>
+
+<div id="Granularity_sample1">
+<pre class="brush: html">&lt;input type="range" min="5" max="10" step="0.01"&gt;</pre>
+
+<p>{{EmbedLiveSample("Granularity_sample1", 600, 40)}}</p>
+</div>
+
+<p><span id="result_box" lang="es"><span>Si quieres aceptar cualquier valor independientemente de la cantidad de decimales, puede especificar un valor de </span></span><code>"any"</code> al atrtibuto {{htmlattrxref("step", "input")}}:</p>
+
+<div id="Granularity_sample2">
+<pre class="brush: html">&lt;input type="range" min="0" max="3.14" step="any"&gt;</pre>
+
+<p>{{EmbedLiveSample("Granularity_sample2", 600, 40)}}</p>
+
+<p>En el ejemplo, permitimos al usuario seleccionar cualquier valor entre 0 y π sin restricciones en la parte decimal del número seleccionado.</p>
+</div>
+
+<h3 id="Añadir_marcas_y_etiquetas">Añadir marcas y etiquetas</h3>
+
+<p>La especificación HTML permite a los navegadores cierta flexibilidad sobre cómo presentar el control range. En ningún sitio es más notoria dicha flexibilidad como a la hora de representar las marcas y las etiquetas de un rango. La especificación describe cómo añadir puntos personalizados al control range usando el atributo {{htmlattrxref("list", "input")}} y el elemento {{HTMLElement("datalist")}}, pero no hay requisitos o recomendaciones de estandarizar las marcas a lo largo del control.</p>
+
+<h4 id="Mockups_del_control_range">Mockups del control range</h4>
+
+<p>Como los navegadores tienen esta flexibilidad, y hasta la fecha ninguno admite todas las funciones que HTML define para los controles range, a continuación mostramos algunas maquetas que permiten conocer lo que puede visualizarse en macOS en un navegador que las admita.</p>
+
+<h5 id="El_control_rango_sin_adornos">El control rango sin adornos</h5>
+
+<p>Cuando no especificas un atributo {{htmlattrxref("list", "input")}} al input range, un navegador que lo soporte mostrará lo siguie.</p>
+
+<table class="fullwidth standard-table">
+ <tbody>
+  <tr>
+   <th>HTML</th>
+   <th>Captura de pantalla</th>
+  </tr>
+  <tr>
+   <td>
+    <pre class="brush: html">
+&lt;input type="range"&gt;</pre>
+   </td>
+   <td><img alt="Screenshot of a plain slider control on macOS" src="https://mdn.mozillademos.org/files/14989/macslider-plain.png" style="height: 28px; width: 184px;"></td>
+  </tr>
+ </tbody>
+</table>
+
+<h5 id="Un_control_rango_con_marcas">Un control rango con marcas</h5>
+
+<p>El siguiente rango utiliza el atributo <code>list</code> (al cual le especificamos el ID del elemento {{HTMLElement("datalist")}}) para definir la serie de marcas del rango. Hay once marcas, cada una de ellas mide un 10%, representadas por el  {{htmlattrxref("value", "option")}} de cada elemento {{HTMLElement("option")}}.</p>
+
+<table class="fullwidth standard-table">
+ <tbody>
+  <tr>
+   <th>HTML</th>
+   <th>Captura de pantalla</th>
+  </tr>
+  <tr>
+   <td>
+    <pre class="brush: html">
+&lt;input type="range" list="tickmarks"&gt;
+
+&lt;datalist id="tickmarks"&gt;
+  &lt;option value="0"&gt;
+  &lt;option value="10"&gt;
+  &lt;option value="20"&gt;
+  &lt;option value="30"&gt;
+  &lt;option value="40"&gt;
+  &lt;option value="50"&gt;
+  &lt;option value="60"&gt;
+  &lt;option value="70"&gt;
+  &lt;option value="80"&gt;
+  &lt;option value="90"&gt;
+  &lt;option value="100"&gt;
+&lt;/datalist&gt;
+</pre>
+   </td>
+   <td><img alt="Screenshot of a plain slider control on macOS" src="https://mdn.mozillademos.org/files/14991/macslider-ticks.png" style="height: 28px; width: 184px;"></td>
+  </tr>
+ </tbody>
+</table>
+
+<h5 id="Un_control_rango_con_marcas_y_etiquetas">Un control rango con marcas y etiquetas</h5>
+
+<p>Puedes añadir etiquetas a tu control range usando el atributo {{htmlattrxref("label", "option")}} al elemento {{HTMLElement("option")}} correspondiente a cada marca que desees etiquetar.</p>
+
+<table class="fullwidth standard-table">
+ <tbody>
+  <tr>
+   <th>HTML</th>
+   <th>Captura de pantalla</th>
+  </tr>
+  <tr>
+   <td>
+    <pre class="brush: html">
+&lt;input type="range" list="tickmarks"&gt;
+
+&lt;datalist id="tickmarks"&gt;
+  &lt;option value="0" label="0%"&gt;
+  &lt;option value="10"&gt;
+  &lt;option value="20"&gt;
+  &lt;option value="30"&gt;
+  &lt;option value="40"&gt;
+  &lt;option value="50" label="50%"&gt;
+  &lt;option value="60"&gt;
+  &lt;option value="70"&gt;
+  &lt;option value="80"&gt;
+  &lt;option value="90"&gt;
+  &lt;option value="100" label="100%"&gt;
+&lt;/datalist&gt;
+</pre>
+   </td>
+   <td><img alt="Screenshot of a plain slider control on macOS" src="https://mdn.mozillademos.org/files/14993/macslider-labels.png" style="height: 44px; width: 184px;"></td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota</strong>: Actualmente, ningún navegador soporta todas estas características. Firefox no soporta ni marcas ni etiquetas, mientras que Chrome soporta las marcas pero no las etiquetas.</p>
+</div>
+
+<h3 id="Cambiar_la_orientación">Cambiar la orientación</h3>
+
+<div class="hidden">
+<p>Por defecto, si un navegador renderiza un input range, lo mostrará como un "slider" (deslizador) que se desliza hacia la izquierda y hacia la derecha. By default, if a browser renders a range input as a slider, it will render it so that the knob slides left and right. Sin embargo puedes cambiar esto fácilmente para que se deslice hacia arriba y hacia abajo simplemente usando CSS</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Esto aún no está implementado por los principales navegadores. This is not actually implemented yet by any of the major browsers. See Firefox {{bug(981916)}}, <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=341071">Chrome bug 341071</a>.</p>
+</div>
+
+<p>Si tenemos el siguiente control range:</p>
+
+<div id="Orientation_sample1">
+<pre class="brush: html">&lt;input type="range" id="volume" min="0" max="11" value="7" step="1"&gt;</pre>
+</div>
+
+<p>{{EmbedLiveSample("Orientation_sample1", 200, 200, "https://mdn.mozillademos.org/files/14983/Orientation_sample1.png")}}</p>
+
+<p>Dicho control se muestra en horizontal (al menos en los principales navegadores, o otros puede variar). Presentarlo en vertical es tan simple como añadir CSS para cambiar las dimensiones del control, de la siguiente manera:</p>
+
+<div id="Orientation_sample2">
+<h4 id="CSS">CSS</h4>
+
+<pre class="brush: css">#volume {
+  height: 150px;
+  width: 50px;
+}</pre>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="brush: html">&lt;input type="range" id="volume" min="0" max="11" value="7" step="1"&gt;</pre>
+
+<h4 id="Result">Result</h4>
+
+<p>{{EmbedLiveSample("Orientation_sample2", 200, 200, "https://mdn.mozillademos.org/files/14985/Orientation_sample2.png")}}</p>
+
+<p><strong>En la actualidad, ninguno de los navegadores principales soporta la creación de inputs range usando este CSS, incluso a perar de que la especificación recomienda que lo hagan.</strong></p>
+</div>
+</div>
+
+<p>La especificación HTML recomienda que los navegadores cambien la orientación del range si el ancho especificado es menor que el alto. Desafortunadamente, ninguno de los principales navegadores soportar controles range verticales directamente. Para conseguir un range vertical, la forma más fácil es usar CSS, aplicando {{cssxref("transform")}} para rotar el elemento y mostrarlo en vertical. Veamos cómo.</p>
+
+<div id="Orientation_sample3">
+<h4 id="HTML_2">HTML</h4>
+
+<p>El HTML necesita que el elemento {{HTMLElement("input")}} esté dentro de un elemento {{HTMLElement("div")}} :</p>
+
+<pre class="brush: html">&lt;div class="slider-wrapper"&gt;
+  &lt;input type="range" min="0" max="11" value="7" step="1"&gt;
+&lt;/div&gt;</pre>
+
+<h4 id="CSS_2">CSS</h4>
+
+<p>Ahora necesitamos un poco de CSS. Primero escribimos el CSS del div contenedor; especificamos el modo de display y el tamaño que queremos que tenga, reservando un área en la página para el "slider" que vamos a rotar.</p>
+
+<pre class="brush: css">.slider-wrapper {
+  display: inline-block;
+  width: 20px;
+  height: 150px;
+  padding: 0;
+}
+</pre>
+Después ponemos la información para el elemento <code>&lt;input&gt;</code>:
+
+<pre class="brush: css">.slider-wrapper input {
+  width: 150px;
+  height: 20px;
+  margin: 0;
+  transform-origin: 75px 75px;
+  transform: rotate(-90deg);
+}</pre>
+
+<p>El tamaño del range es 150 pixeles de ancho por 20 pixeles de alto. Ponemos los márgenes a 0 y con {{cssxref("transform-origin")}} cambiamos centro que usaremos para rotar el range. Como el input mide 150 pixeles de ancho y largo, girará en una cuadrado de 150 pixeles de lado. Colocamos el centro de giro a 75px horizontal y verticalmente y, finalmente, rotamos 90º en sentido contrario a las agujas del reloj. El resultado final es un input range que ha girado y cuyo valor máximo está en la parte superior y el valor mínimo en la parte inferior.</p>
+
+<h4 id="Result_2">Result</h4>
+
+<p>{{EmbedLiveSample("Orientation_sample3", 200, 200, "https://mdn.mozillademos.org/files/14987/Orientation_sample3.png")}}</p>
+</div>
+
+<h2 id="Validación">Validación</h2>
+
+<div class="g-unit" id="gt-res-c">
+<div id="gt-res-p">
+<div id="gt-res-data">
+<div id="gt-res-wrap">
+<div id="gt-res-content">
+<div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr">
+<div id="tts_button"> </div>
+<span id="result_box" lang="es"><span>No hay un patrón de validación</span></span><span lang="es"><span> disponible;</span> <span>sin embargo, se realizan las siguientes formas de validación automática:</span></span></div>
+</div>
+</div>
+</div>
+</div>
+</div>
+
+<p> </p>
+
+<ul>
+ <li>Si el {{htmlattrxref("value", "input")}} <span id="result_box" lang="es"><span>está configurado con un valor que no se puede convertir en un número de coma flotante válido, la validación falla porque recibe una entrada incorrecta.</span></span></li>
+ <li>El valor no puede ser menor que el valor de {{htmlattrxref("min", "input")}}. Por defecto es 0.</li>
+ <li>El valor no puede ser mayor que el {{htmlattrxref("max", "input")}}. Por defecto es 100.</li>
+ <li>El valor será un múltiplo del valor de {{htmlattrxref("step", "input")}}. Por defecto es 1.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Además de los ejemplos anteriores, encontrarás más ejemplos en los siguientes artículos:</p>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Web_Audio_API/Controlling_multiple_parameters_with_ConstantSourceNode">Controlling multiple parameters with ConstantSourceNode</a></li>
+</ul>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#range-state-(type=range)', '&lt;input type="range"&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'sec-forms.html#range-state-typerange', '&lt;input type="range"&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>4.0<sup>[2]</sup></td>
+   <td>12</td>
+   <td>{{CompatGeckoDesktop(23)}}<sup>[1][4]</sup></td>
+   <td>10</td>
+   <td>10.1</td>
+   <td>3.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>2.1<sup>[3]</sup></td>
+   <td>57<sup>[2]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile(52)}}<sup>[1]</sup></td>
+   <td>10</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>5.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] A pesar de que la especificación dice que el input range debe mostrarse verticalmente si el alto es mayor que el ancho, este comportamiento no está implementado actualmente. Mira los siguientes bugs para conocer más información: {{bug(840820)}} y {{bug(981916)}}.</p>
+
+<p>[2] Chrome implementa el valor <code>slider-vertical</code> con la propiedad no estandard {{cssxref("-webkit-appearance")}}. <em>No deberías usarla ya que es propietaria, a menos que incluyas fallbacks para usuarios de otros navegadores</em>.</p>
+
+<p>[3] El navegador de Android reconoce el tipo <code>"range"</code> desde la versión 2.1, pero no está totalmente implementada hasta la versión 4.3.</p>
+
+<p>[4] Dibujar marcas y etiquetas no está aún implementado. Ver {{bug(841942)}} para conocer más información.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/HTML/Forms">HTML Forms</a></li>
+ <li>{{HTMLElement("input")}} and the {{domxref("HTMLInputElement")}} interface it's based upon</li>
+ <li><code><a href="/en-US/docs/Web/HTML/Element/input/number">&lt;input type="number"&gt;</a></code></li>
+</ul>
diff --git a/files/es/web/html/element/input/text/index.html b/files/es/web/html/element/input/text/index.html
new file mode 100644
index 0000000000..a3061bbc78
--- /dev/null
+++ b/files/es/web/html/element/input/text/index.html
@@ -0,0 +1,473 @@
+---
+title: <input type="text">
+slug: Web/HTML/Element/input/text
+tags:
+  - Entrada de texto
+  - Form input
+  - Formulários HTML
+  - HTML
+  - Input
+  - Input Type
+  - Referencia
+  - Text
+  - Texto
+  - formulários
+  - text input
+translation_of: Web/HTML/Element/input/text
+original_slug: Web/HTML/Elemento/input/text
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("text")}} crean campos de texto básicos de una sola línea.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/input-text.html", "tabbed-shorter")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <td><strong>{{anch("Value")}}</strong></td>
+   <td>Un {{DOMxRef("DOMString")}} que representa el texto contenido en el campo de texto.</td>
+  </tr>
+  <tr>
+   <td><strong>Eventos</strong></td>
+   <td>{{event("change")}} y {{event("input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Atributos comunes admitidos</strong></td>
+   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("maxlength", "input")}}, {{htmlattrxref("minlength", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("readonly", "input")}}, {{htmlattrxref("required", "input")}} y {{htmlattrxref("size", "input")}}</td>
+  </tr>
+  <tr>
+   <td><strong>IDL attributes</strong></td>
+   <td>{{htmlattrxref("list", "input")}}, {{HTMLAttrDef("value")}}</td>
+  </tr>
+  <tr>
+   <td><strong>Métodos</strong></td>
+   <td>{{DOMxRef("HTMLInputElement.select", "select()")}}, {{DOMxRef("HTMLInputElement.setRangeText", "setRangeText()")}} y {{DOMxRef("HTMLInputElement.setSelectionRange", "setSelectionRange()")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Value"><code>Value</code></h2>
+
+<p>El atributo {{HTMLAttrxRef("value", "input")}} es un {{DOMxRef("DOMString")}} que contiene el valor actual del texto ingresado en el campo de texto. Puedes recuperar esto usando la propiedad {{DOMxRef("HTMLInputElement.value", "value")}} en JavaScript.</p>
+
+<pre class="brush: js notranslate">let theText = myTextInput.value;
+</pre>
+
+<p>Si no existen restricciones de validación para la entrada (consulta {{anch("Validación")}} para obtener más detalles), el valor puede ser una cadena vacía ("").</p>
+
+<h2 id="Atributos_adicionales">Atributos adicionales</h2>
+
+<p>Además de los atributos que operan en todos los elementos {{HTMLElement("input")}} independientemente de su tipo, las entradas de texto admiten los siguientes atributos:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Atributo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>{{anch("list")}}</code></td>
+   <td>El id del elemento {{HTMLElement("datalist")}} que contiene las opciones de autocompletar predefinidas</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("maxlength")}}</code></td>
+   <td>El número máximo de caracteres que debe aceptar la entrada</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("minlength")}}</code></td>
+   <td>El número mínimo de caracteres que la entrada puede tener y aún se considera válida</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("pattern")}}</code></td>
+   <td>Una expresión regular que el contenido de la entrada debe coincidir para que sea válida</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("placeholder")}}</code></td>
+   <td>Un valor de ejemplo para mostrar en el campo de entrada siempre y cuando esté vacío</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("readonly")}}</code></td>
+   <td>Un atributo booleano que indica si el contenido de la entrada debe ser de solo lectura.</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("size")}}</code></td>
+   <td>Un número que indica cuántos caracteres de ancho debe tener el campo de entrada.</td>
+  </tr>
+  <tr>
+   <td><code>{{anch("spellcheck")}}</code></td>
+   <td>Controla si se habilita o no la revisión ortográfica para el campo de entrada, o si se debe usar la configuración de revisión ortográfica predeterminada</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="HTMLAttrDeflist">{{HTMLAttrDef("list")}}</h3>
+
+<p>Los valores del atributo {{HTMLAttrDef("list")}} son el {{DOMxRef("Element.id", "id")}} de un elemento {{HTMLElement("datalist")}} ubicado en el mismo documento. El {{HTMLElement("datalist")}} proporciona una lista de valores predefinidos para sugerir al usuario para esta entrada. Cualquier valor de la lista que no sea compatible con {{HTMLAttrxRef("type", "input")}} no se incluye en las opciones sugeridas. Los valores proporcionados son sugerencias, no requisitos: los usuarios pueden seleccionar de esta lista predefinida o proporcionar un valor diferente.</p>
+
+<h3 id="HTMLAttrDefmaxlength">{{HTMLAttrDef("maxlength")}}</h3>
+
+<p>El número máximo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrDef("text")}}. Debe ser un valor entero 0 o superior. Si no se especifica {{HTMLAttrDef("maxlength")}}, o se especifica un valor no válido, el {{HTMLAttrDef("text")}} de la entrada no tiene una longitud máxima. Este valor también debe ser mayor o igual que el valor de {{HTMLAttrxRef("minlength", "input")}}.</p>
+
+<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del valor de texto del campo es mayor que {{HTMLAttrxRef("maxlength", "input")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
+
+<h3 id="HTMLAttrDefminlength">{{HTMLAttrDef("minlength")}}</h3>
+
+<p>El número mínimo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrDef("texto")}}. Debe ser un valor entero no negativo menor o igual al valor especificado por {{HTMLAttrxRef("maxlength", "input")}}. Si no se especifica {{HTMLAttrDef("minlength")}}, o se especifica un valor no válido, la entrada de {{HTMLAttrDef("text")}} no tiene una longitud mínima.</p>
+
+<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del texto ingresado en el campo es menor que {{HTMLAttrDef("minlength")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
+
+<h3 id="HTMLAttrDefpattern">{{HTMLAttrDef("pattern")}}</h3>
+
+<div id="pattern-include">
+<p>El atributo {{HTMLAttrDef("pattern")}}, cuando se especifica, es una expresión regular que el {{HTMLAttrxRef("value")}} de la entrada debe coincidir para que el valor pase {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricciones de validación")}}. Debe ser una expresión regular de JavaScript válida, como la usada por el tipo {{JSxRef("RegExp")}} y como se documenta en la {{web.link("/es/docs/Web/JavaScript/Guide/Regular_Expressions", "guía sobre expresiones regulares")}}; el indicador <code>'u'</code> se especifica al compilar la expresión regular, de modo que el patrón se trata como una secuencia de puntos de código Unicode, en lugar de ASCII. No se deben especificar barras diagonales alrededor del texto del patrón.</p>
+
+<p>Si el patrón especificado no se especifica o no es válido, no se aplica ninguna expresión regular y este atributo se ignora por completo.</p>
+
+<div class="note">
+<p><strong>Consejo</strong>:: Utiliza el atributo {{HTMLAttrxRef("title", "input")}} para especificar el texto que la mayoría de los navegadores mostrarán como información sobre herramientas para explicar cuáles son los requisitos para coincidir con el patrón. También debes incluir otro texto explicativo cercano.</p>
+</div>
+</div>
+
+<p>Consulta {{anch("Especificación de un patrón")}} para obtener más detalles y un ejemplo.</p>
+
+<h3 id="HTMLAttrDefplaceholder">{{HTMLAttrDef("placeholder")}}</h3>
+
+<p>El atributo {{HTMLAttrDef("placeholder")}} es una cadena que proporciona una breve pista al usuario sobre el tipo de información que se espera en el campo. Debe ser una palabra o frase corta que demuestre el tipo de datos esperado, en lugar de un mensaje explicativo. El texto <em>no debe</em> incluir retornos de carro o saltos de línea.</p>
+
+<p>Si el contenido del control tiene una direccionalidad ({{Glossary("LTR")}} o {{Glossary("RTL")}}) pero necesitas presentar el marcador de posición en la direccionalidad opuesta, puedes usar caracteres de formato de algoritmo bidireccional Unicode para anular la direccionalidad dentro del marcador de posición; consulta {{SectionOnPage("/es/docs/Web/Localization/Unicode_Bidirectional_Text_Algorithm", "Anulación de BiDi mediante caracteres de control Unicode")}} para esos caracteres.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Evita utilizar el atributo {{HTMLAttrDef("placeholder")}} si puedes. No es tan útil semánticamente como otras formas de explicar tu formulario y puede causar problemas técnicos inesperados con tu contenido. Consulta {{SectionOnPage("/es/docs/Web/HTML/Element/input", "Etiquetas y marcadores de posición")}} para obtener más información.</p>
+</div>
+
+<h3 id="HTMLAttrDefreadonly">{{HTMLAttrDef("readonly")}}</h3>
+
+<p>Un atributo booleano que, si está presente, significa que el usuario no puede editar este campo. Su {{HTMLAttrDef("value")}}, sin embargo, aún se puede cambiar mediante el código JavaScript configurando directamente la propiedad {{DOMxRef("HTMLInputElement.value")}}.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Debido a que un campo de solo lectura no puede tener un valor, {{HTMLAttrDef("required")}} no tiene ningún efecto en las entradas con el atributo {{HTMLAttrDef("readonly")}} también especificado.</p>
+</div>
+
+<h3 id="HTMLAttrDefsize">{{HTMLAttrDef("size")}}</h3>
+
+<p>El atributo {{HTMLAttrDef("size")}} es un valor numérico que indica cuántos caracteres de ancho debe tener el campo de entrada. El valor debe ser un número mayor que cero, y el valor predeterminado es 20. Dado que el ancho de los caracteres varía, esto puede ser exacto o no y no se debe confiar en que lo sea; la entrada resultante puede ser más estrecha o más ancha que el número especificado de caracteres, dependiendo de los caracteres y la fuente (configuración de {{CSSxRef("fuente")}} en uso).</p>
+
+<p>Esto <em>no</em> establece un límite en la cantidad de caracteres que el usuario puede ingresar en el campo. Solo especifica aproximadamente cuántos se pueden ver a la vez. Para establecer un límite superior en la longitud de los datos de entrada, utiliza el atributo {{anch("maxlength")}}.</p>
+
+<h3 id="HTMLAttrDefspellcheck">{{HTMLAttrDef("spellcheck")}}</h3>
+
+<p>{{HTMLAttrDef("spellcheck")}} es un atributo global que se utiliza para indicar si se habilita o no la revisión ortográfica de un elemento. Se puede usar en cualquier contenido editable, pero aquí consideramos los detalles relacionados con el uso del corrector ortográfico ({{HTMLAttrxRef("spellcheck")}} en elementos {{HTMLElement("input")}}. Los valores permitidos para el corrección ortográfica son:</p>
+
+<dl>
+ <dt><code>false</code></dt>
+ <dd>Desactive la corrección ortográfica de este elemento.</dd>
+ <dt><code>true</code></dt>
+ <dd>Habilita la revisión ortográfica de este elemento.</dd>
+ <dt>"" (cadena vacía) o sin valor</dt>
+ <dd>Sigue el comportamiento predeterminado del elemento para la revisión ortográfica. Esto se puede basar en la configuración de la corrección ortográfica de los padres u otros factores.</dd>
+</dl>
+
+<p>Un campo de entrada puede tener habilitado el corrector ortográfico si no tiene el atributo {{anch("readonly")}} configurado y no está deshabilitado.</p>
+
+<p>Es posible que el valor devuelto al leer el corrector ortográfico puede no reflejar el estado real del corrector ortográfico dentro de un control, si las preferencias de {{Glossary("agente de usuario", "agentes de usuario")}} anulan la configuración.</p>
+
+<h2 id="Atributos_no_estándar">Atributos no estándar</h2>
+
+<p>Los siguientes atributos no estándar también están disponibles en algunos navegadores. Como regla general, debes evitar usarlos a menos que no puedas evitarlo.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Atributo</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>{{anch("autocorrect")}}</code></td>
+   <td>Una cadena que indica si la autocorrección está activa (<code>on</code>) o (<code>off</code>). <strong>Solo Safari.</strong></td>
+  </tr>
+  <tr>
+   <td><code>{{anch("mozactionhint")}}</code></td>
+   <td>Una cadena que indica el tipo de acción que se realizará cuando el usuario presione la tecla <kbd>Intro</kbd> o <kbd>Retorno</kbd> mientras editas el campo; esto se usa para determinar una etiqueta apropiada para esa tecla en un teclado virtual. <strong>Solo Firefox para Android.</strong></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="HTMLAttrDefautocorrect_non-standard_inline">{{HTMLAttrDef("autocorrect")}} {{non-standard_inline}}</h3>
+
+<div id="autocorrect-include">
+<p>Una extensión de Safari, el atributo {{HTMLAttrDef("autocorrect")}} es una cadena que indica si activar o no la corrección automática mientras el usuario está editando este campo. Los valores permitidos son:</p>
+
+<dl>
+ <dt><code>on</code></dt>
+ <dd>Habilita la corrección automática de errores tipográficos, así como el procesamiento de sustituciones de texto, si los hay.</dd>
+ <dt><code>off</code></dt>
+ <dd>Desactiva la corrección automática y las sustituciones de texto.</dd>
+</dl>
+</div>
+
+<h3 id="HTMLAttrDefmozactionhint_non-standard_inline">{{HTMLAttrDef("mozactionhint")}} {{non-standard_inline}}</h3>
+
+<div id="mozactionhint-include">
+<p>Una extensión de Mozilla, compatible con Firefox para Android, que proporciona una pista sobre qué tipo de acción se realizará si el usuario presiona la tecla <kbd>Intro</kbd> o <kbd>Retorno</kbd> mientras edita el campo. Esta información se usa para decidir qué tipo de etiqueta usar en la tecla <kbd>Intro</kbd> del teclado virtual.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Este <a href="https://html.spec.whatwg.org/#input-modalities:-the-enterkeyhint-attribute">se ha estandarizado</a> como el atributo global {{HTMLAttrxRef("enterkeyhint")}}, pero aún no está ampliamente implementado. Para ver el estado del cambio que se está implementando en Firefox, consulta {{bug(1490661)}}.</p>
+</div>
+
+<p>Los valores permitidos son: <code>go</code>, <code>done</code>, <code>next</code>, <code>search</code> y <code>send</code>. El navegador decide, utilizando esta sugerencia, qué etiqueta poner en la tecla Intro.</p>
+</div>
+
+<h2 id="Usar_entradas_de_texto">Usar entradas de texto</h2>
+
+<p>Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("text")}} crean entradas básicas de una sola línea. Los debes usar en cualquier lugar donde desees que el usuario ingrese un valor de una sola línea y no hay un tipo de entrada más específico disponible para recopilar ese valor (por ejemplo, si es un {{web.link("/es/docs/Web/HTML/Element/input/datetime-local", "date")}}, {{web.link("/es/docs/Web/HTML/Element/input/url", "URL")}}, {{web.link("/es/docs/Web/HTML/Element/input/email", "email")}}, o {{web.link("/es/docs/Web/HTML/Element/input/search", "término de búsqueda")}}, tiene mejores opciones disponibles).</p>
+
+<h3 id="Ejemplo_básico">Ejemplo básico</h3>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
+    &lt;input type="text" id="uname" name="name"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Esto se renderiza así:</p>
+
+<p>{{EmbedLiveSample("Ejemplo_básico", 600, 50)}}</p>
+
+<p>Cuando se envía, el par de nombre/valor de datos enviado al servidor será <code>uname=Chris</code> (si se ingresó "Chris" como valor de entrada antes del envío). Debes recordar incluir el atributo {{HTMLAttrxRef("name", "input")}} en el elemento {{HTMLElement("input")}}; de lo contrario, el valor del campo de texto no se incluirá con los datos enviados.</p>
+
+<h3 id="Establecer_marcadores_de_posición">Establecer marcadores de posición</h3>
+
+<p>Puedes proporcionar un marcador de posición útil dentro de tu entrada de texto que puede proporcionar una pista sobre qué ingresar al incluir el uso del atributo {{HTMLAttrxRef("placeholder", "input")}}. Mira el siguiente ejemplo:</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
+    &lt;input type="text" id="uname" name="name"
+           placeholder="Una sola palabra, en minúsculas"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Puedes ver cómo se representa el marcador de posición a continuación:</p>
+
+<p>{{EmbedLiveSample("Establecer_marcadores_de_posición", 600, 50)}}</p>
+
+<p>El marcador de posición generalmente se representa en un color más claro que el color de primer plano del elemento y desaparece automáticamente cuando el usuario comienza a ingresar texto en el campo (o siempre que el campo tiene un valor establecido programáticamente al establecer su atributo {{HTMLAttrDef("value")}}.</p>
+
+<h3 id="Tamaño_físico_del_elemento_de_entrada">Tamaño físico del elemento de entrada</h3>
+
+<p>El tamaño físico del cuadro de entrada se puede controlar mediante el atributo {{HTMLAttrxRef("size", "input")}}. Con él, puedes especificar el número de caracteres que la entrada de texto puede mostrar a la vez. Esto afecta el ancho del elemento, lo cual te permite especificar el ancho en términos de caracteres en lugar de píxeles. En este ejemplo, por ejemplo, la entrada tiene 30 caracteres de ancho:</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
+    &lt;input type="text" id="uname" name="name"
+           placeholder="Una sola palabra, en minúsculas"
+           size="30"&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>{{ EmbedLiveSample('Tamaño_físico_del_elemento_de_entrada', 600, 50) }}</p>
+
+<h2 id="Validación">Validación</h2>
+
+<p>Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("text")}} no tienen validación automática aplicada (ya que una entrada de texto básica debe ser capaz de aceptar cualquier cadena arbitraria), pero hay algunas opciones de validación de lado del cliente disponibles, que verás a continuación.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: La validación del formulario HTML <em>no</em> sustituye a la de los scripts del servidor que garantizan que los datos introducidos tengan el formato adecuado. Es demasiado fácil para alguien realizar ajustes en el HTML que le permitan omitir la validación o eliminarla por completo. También es posible que alguien simplemente omita tu HTML por completo y envíe los datos directamente a tu servidor. Si tu código del lado del servidor no valida los datos que recibe, podría ocurrir un desastre cuando se ingresen en tu base de datos datos con formato incorrecto (o datos que son demasiado grandes, son del tipo incorrecto, etc.).</p>
+</div>
+
+<h3 id="Una_nota_sobre_estilizado">Una nota sobre estilizado</h3>
+
+<p>Hay pseudoclases útiles disponibles para diseñar elementos de formulario para ayudar al usuario a ver cuándo sus valores son válidos o no. Estos son {{CSSxRef(": valid")}} e {{CSSxRef(":invalid")}}. En esta sección, usaremos el siguiente CSS, que colocará una marca de verificación (tilde) junto a las entradas que contienen valores válidos y una cruz (X) junto a las entradas que contienen valores no válidos.</p>
+
+<pre class="brush: css notranslate">div {
+  margin-bottom: 10px;
+  position: relative;
+}
+
+input + span {
+  padding-right: 30px;
+}
+
+input:invalid+span:after {
+  position: absolute; content: '✖';
+  padding-left: 5px;
+}
+
+input:valid+span:after {
+  position: absolute;
+  content: '✓';
+  padding-left: 5px;
+}</pre>
+
+<p>La técnica también requiere que se coloque un elemento {{HTMLElement("span")}} después del elemento {{HTMLElement("form")}}, que actúa como contenedor de los iconos. Esto era necesario porque algunos tipos de entrada en algunos navegadores no muestran muy bien los iconos colocados directamente después de ellos.</p>
+
+<h3 id="Hacer_entrada_requerida">Hacer entrada requerida</h3>
+
+<p>Puedes usar el atributo {{HTMLAttrxRef("required", "input")}} como una manera fácil de hacer que se requiera ingresar un valor antes de que se permita el envío del formulario:</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
+    &lt;input type="text" id="uname" name="name" required&gt;
+    &lt;span class="validity"&gt;&lt;/span&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">div { margin-bottom: 10px; position: relative; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; }</pre>
+</div>
+
+<p>Esto se renderiza así:</p>
+
+<p>{{ EmbedLiveSample('Hacer_entrada_requerida', 600, 70) }}</p>
+
+<p>Si intentas enviar el formulario sin ningún término de búsqueda ingresado, el navegador mostrará un mensaje de error.</p>
+
+<h3 id="Longitud_del_valor_de_entrada">Longitud del valor de entrada</h3>
+
+<p>Puedes especificar una longitud mínima (en caracteres) para el valor ingresado usando el atributo {{HTMLAttrxRef("minlength", "input")}}; de manera similar, usa {{HTMLAttrxRef("maxlength", "input")}} para establecer la longitud máxima del valor ingresado, en caracteres.</p>
+
+<p>El siguiente ejemplo requiere que el valor ingresado tenga entre 4 y 8 caracteres de longitud.</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
+    &lt;input type="text" id="uname" name="name" required size="10"
+           placeholder="nombreusuario"
+           minlength="4" maxlength="8"&gt;
+    &lt;span class="validity"&gt;&lt;/span&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">div { margin-bottom: 10px; position: relative; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; }</pre>
+</div>
+
+<p>Esto se renderiza así:</p>
+
+<p>{{ EmbedLiveSample('Longitud_del_valor_de_entrada', 600, 70) }}</p>
+
+<p>Si intentas enviar el formulario con menos de 4 caracteres, se te dará un mensaje de error apropiado (que difiere entre los navegadores). Si intentas ingresar más de 8 caracteres, el navegador no te lo permitirá.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Si especificas un {{HTMLAttrDef("minlength")}} pero no especificas {{HTMLAttrDef("required")}}, la entrada se considera válida, ya que no se requiere que el usuario especifique un valor.</p>
+</div>
+
+<h3 id="Especificación_de_un_patrón">Especificación de un patrón</h3>
+
+<p>Puedes utilizar el atributo {{HTMLAttrxRef("pattern", "input")}} para especificar una expresión regular con la que el valor ingresado debe coincidir para que se considere válido (ve un curso intensivo simple en {{web.link("/es/docs/Learn/HTML/Forms/Form_validation#Validación_con_una_expresión_regular", "Validación con una expresión regular")}} sobre el uso de expresiones regulares para validar entradas).</p>
+
+<p>El siguiente ejemplo restringe el valor a 4-8 caracteres y requiere que contenga solo letras minúsculas.</p>
+
+<pre class="brush: html notranslate">&lt;form&gt;
+  &lt;div&gt;
+    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
+    &lt;input type="text" id="uname" name="name" required size="45"
+           pattern="[a-z]{4,8}"&gt;
+    &lt;span class="validity"&gt;&lt;/span&gt;
+    &lt;p&gt;Los nombres de usuario deben estar en minúsculas y tener entre 4 y 8 caracteres de longitud.&lt;/p&gt;
+  &lt;/div&gt;
+  &lt;div&gt;
+    &lt;button&gt;Enviar&lt;/button&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<div class="hidden">
+<pre class="brush: css notranslate">div {
+  margin-bottom: 10px;
+  position: relative;
+}
+
+p {
+  font-size: 80%;
+  color: #999;
+}
+
+input + span {
+  padding-right: 30px;
+}
+
+input:invalid+span:after {
+  position: absolute;
+  content: '✖';
+  padding-left: 5px;
+}
+
+input:valid+span:after {
+  position: absolute;
+  content: '✓';
+  padding-left: 5px;
+}</pre>
+</div>
+
+<p>Esto se renderiza así:</p>
+
+<p>{{ EmbedLiveSample('Especificación_de_un_patrón', 600, 110) }}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Puedes ver buenos ejemplos de entradas de texto utilizadas en contexto en los artículos {{web.link("/es/docs/Learn/HTML/Forms/Your_first_HTML_form", "Mi primer formulario HTML")}} y {{web.link("/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form", "Cómo estructurar un formulario HTML")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'input.html#text-(type=text)-state-and-search-state-(type=search)', '&lt;input type="text"&gt;')}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'sec-forms.html#text-typetext-state-and-search-state-typesearch', '&lt;input type="text"&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.input.input-text")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn/HTML/Forms", "Formularios HTML")}}</li>
+ <li>{{HTMLElement("input")}} y la interfaz {{DOMxRef("HTMLInputElement")}} en que se basa.</li>
+ <li><code><a href="/en-US/docs/Web/HTML/Element/input/search">&lt;input type="search"&gt;</a></code></li>
+ <li>{{HTMLElement("textarea")}}: Campo de entrada de texto multilínea</li>
+ <li>{{web.link("/es/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets", "Compatibilidad de propiedades CSS")}}</li>
+</ul>
diff --git a/files/es/web/html/element/ins/index.html b/files/es/web/html/element/ins/index.html
new file mode 100644
index 0000000000..d29d326fed
--- /dev/null
+++ b/files/es/web/html/element/ins/index.html
@@ -0,0 +1,138 @@
+---
+title: ins
+slug: Web/HTML/Element/ins
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/ins
+original_slug: Web/HTML/Elemento/ins
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <code style="color: darkblue;">ins</code> (insertado) marca las partes de un texto que han sido añadidos al documento.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;ins&gt; e &lt;/ins&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: a veces <a href="/es/HTML/Elemento/Tipos_de_elementos#en_linea" title="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a> a veces <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>:</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: depende, si actua como un elemento en bloque puede contener elementos en bloque. Pero si actua como un elemento en linea solo podrá contener elementos en linea.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">cite</code></td>
+   <td>URI</td>
+   <td>implícito</td>
+   <td>información sobre el cambio</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">datetime</code></td>
+   <td>fecha</td>
+   <td>implícito</td>
+   <td>fecha y hora del cambio</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene, o dicho de otra manera, tiene los mismos que en el doctype estricto</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre> Ejemplo de ins en linea:
+   &lt;p&gt; El agua es insipida, &lt;ins&gt;inodora e incolora.&lt;/ins&gt; &lt;/p&gt;
+
+ Ejemplo de ins en bloque:
+   &lt;p&gt; El agua es insipida. &lt;/p&gt;
+   &lt;ins&gt; &lt;p&gt; Y además inodora e incolora. &lt;/p&gt; &lt;/ins&gt;
+</pre>
+
+<p><br>
+ Se visualiza así:</p>
+
+<div class="highlight">
+<p>Ejemplo de ins en linea:</p>
+
+<p>El agua es insipida, <ins>inodora e incolora.</ins></p>
+
+<p>Ejemplo de ins en bloque:</p>
+
+<p>El agua es insipida.</p>
+
+<p><ins>y además inodora e incolora.</ins></p>
+</div>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/element/isindex/index.html b/files/es/web/html/element/isindex/index.html
new file mode 100644
index 0000000000..1a3a9637f2
--- /dev/null
+++ b/files/es/web/html/element/isindex/index.html
@@ -0,0 +1,45 @@
+---
+title: <isindex>
+slug: Web/HTML/Element/isindex
+tags:
+  - Deprecado
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/isindex
+original_slug: Web/HTML/Elemento/isindex
+---
+<div>{{Deprecated_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p><code>&lt;isindex&gt; </code>es un elemento HTML  obsoleto que posiciona un campo de texto en una página para buscar en el documento . <code>&lt;isindex&gt;</code> fue pensado por el W3C  para ser usado dentro del elemento {{HTMLElement("head")}} , pero los exploradores lo soportaban sin importar donde se usaba .</p>
+
+<p>&lt;<font face="Consolas, Liberation Mono, Courier, monospace">isindex&gt; </font>fue deprecado en HTML 4.01 , debido a que el mismo comportamiento puede ser logrado con un form de HTML. </p>
+
+<h2 id="Atributos">Atributos </h2>
+
+<p>Como todos los otros elementos HTML , este elemento acepta los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</p>
+
+<dl>
+ <dt>{{htmlattrdef("prompt")}}</dt>
+ <dd>Este atributo añade su valor como una ventana para un campo de texto.</dd>
+ <dt>{{htmlattrdef("action")}}</dt>
+ <dd>Este atributo puede ser usado para mandar una busqueda a una URL diferente . La acción no está definida por el W3C .</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html">&lt;head&gt;
+  &lt;isindex prompt="Search Document... " /&gt;
+&lt;/head&gt;</pre>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{HTMLElement("input")}}</li>
+ <li>{{HTMLElement("form")}}</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/kbd/index.html b/files/es/web/html/element/kbd/index.html
new file mode 100644
index 0000000000..a1a6e42c87
--- /dev/null
+++ b/files/es/web/html/element/kbd/index.html
@@ -0,0 +1,121 @@
+---
+title: kbd
+slug: Web/HTML/Element/kbd
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/kbd
+original_slug: Web/HTML/Elemento/kbd
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Marca el texto que debe introducir el usuario.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;kbd&gt; y &lt;/kbd&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">&lt;p&gt;
+Si está conforme escriba &lt;kbd&gt;sí&lt;/kbd&gt;. Si no, pulse &lt;kbd&gt;esc&lt;/kbd&gt;
+&lt;/p&gt;
+</pre>
+
+<p>Se visualiza asi</p>
+
+<p class="eval">Si esta conforme escriba <kbd>si</kbd>. Si no, pulse <kbd>esc</kbd></p>
+
+<h3 id="Comentarios" name="Comentarios"> </h3>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p>La visualizacion puede cambiar segun el navegador debido a los estilos preestablecidos por cada uno.</p>
diff --git a/files/es/web/html/element/keygen/index.html b/files/es/web/html/element/keygen/index.html
new file mode 100644
index 0000000000..ea4224c361
--- /dev/null
+++ b/files/es/web/html/element/keygen/index.html
@@ -0,0 +1,129 @@
+---
+title: keygen
+slug: Web/HTML/Element/keygen
+tags:
+  - para_revisar
+translation_of: Web/HTML/Element/keygen
+original_slug: Web/HTML/Elemento/keygen
+---
+<p>El elemento <code>keygen</code> de HTML existe para facilitar la generación de llaves, y el envío de la clave pública como parte de un formulario HTML. Este mecanismo está diseñado para utilizarse con sistemas de gestión de certificados basados en la Web. Se espera que el elemento <code>keygen</code> se utilice en un formulario HTML, junto con otra información necesaria para la construcción de una solicitud de certificado, y que el resultado del proceso será un certificado firmado.</p>
+
+<h3 id="Usage_context" name="Usage_context">Contexto de uso</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Las categorías de contenido</td>
+   <td><a title="es / HTML / categorías de contenido # flujo de contenido">contenido dinámico</a> , <a title="es / HTML / Las categorías de contenido # Enunciado contenido">el contenido de redacción</a> , contenido interactivo, <a title="es / HTML / categorías de contenido # formulario de lista">lista</a> , <a title="es / HTML / categorías de contenido # forma labelable">labelable</a> , <a title="es / HTML / categorías de contenido # forma submittable">submittable</a> , <a title="es / HTML / categorías de contenido # forma reajustable">reajustable</a> <a title="es / HTML / categorías de contenido # contenido del formulario asociado">asociada elemento de formulario.</a></td>
+  </tr>
+  <tr>
+   <td>Contenido permitido</td>
+   <td>ninguno</td>
+  </tr>
+  <tr>
+   <td>Omisión de etiquetas</td>
+   <td>elemento vacío, sólo tiene una etiqueta de inicio</td>
+  </tr>
+  <tr>
+   <td>Elementos padres permitidos</td>
+   <td>donde se espere <a title="es / HTML / Las categorías de contenido # Enunciado contenido">contenido de frases</a></td>
+  </tr>
+  <tr>
+   <td>Documento normativo</td>
+   <td><a class="external" href="http://www.w3.org/TR/html5/the-button-element.html#the-keygen-element" title="http://www.w3.org/TR/html5/the-button-element.html # el-keygen-elemento">HTML 5, la sección 4.10.5</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Atributos">Atributos</h3>
+
+<h3 id="Uso">Uso</h3>
+
+<dl>
+ <dt><a name="attr-autofocus">autofocus</a></dt>
+ <dd>Este atributo booleano permite especificar que el control debe tener el foco de entrada cuando se cargue la página, a menos que el usuario lo anule, por ejemplo, al escribir en un control diferente. Sólo un elemento de formulario en un documento puede tener el atributo <strong>autofocus,</strong> que es un valor booleano.</dd>
+ <dt>{{ Htmlattrdef ("challenge") }}</dt>
+ <dd>Una cadena de desafío que se presenta junto con la clave pública. El valor predeterminado es una cadena vacía si no se especifica.</dd>
+ <dt>{{ Htmlattrdef ("disabled") }}</dt>
+ <dd>Este atributo booleano indica que el control del formulario no está disponible para la interacción.</dd>
+ <dt><a name="attr-form">form</a></dt>
+ <dd>El elemento form al que este elemento está asociado (el <em>propietario del formulario).</em> El valor del atributo debe ser un <strong>id</strong> de un elemento {{ HTMLElement ("form") }} en el mismo documento. Si este atributo no se especifica, este elemento debe ser un descendiente de un elemento {{ HTMLElement ("form") }}. Este atributo le permite colocar elementos <span style="font-family: Courier New;">&lt;keygen&gt;</span> en cualquier lugar dentro de un documento, no sólo como descendientes del formulario.</dd>
+ <dt>{{ Htmlattrdef ("keytype") }}</dt>
+ <dd>El tipo de clave generada. El valor por defecto es <code>RSA</code> .</dd>
+ <dt><a name="attr-name">name</a></dt>
+ <dd>El nombre del control, que se envía con los datos del formulario.</dd>
+</dl>
+
+<p>El elemento se escribe como sigue:</p>
+
+<pre><code>&lt;keygen name="<var>name</var>" challenge="<var>challenge string</var>" keytype="<var>type</var>" keyparams="<var>pqg-params</var>"&gt;</code></pre>
+
+<p>El parámetro <code>keytype</code> se utiliza para especificar qué tipo de clave se generará. Los valores válidos son " <code>RSA</code> ", que es el valor predeterminado," <code>DSA</code> "y" <code>EC</code> ". Los atributos <code>name</code> y <code>challenge</code> son necesarios en todos los casos. El atributo <code>keytype</code> es opcional para la generación de claves RSA y obligatorio para la generación de claves DSA y CE. El atributo <code>keyparams</code> es necesario para la generación de claves DSA y CE e ignorado para la generación de claves RSA. <code>PQG</code> es sinónimo de <code>keyparams</code> . Es decir, usted puede especificar <code>keyparams="pqg-params"</code> o <code>pqg="pqg-params"</code> .</p>
+
+<p>Para las claves RSA, el parámetro <code>keyparams</code> no se utiliza (se ignora si está presente). El usuario puede tener una selección de la fuerza de la clave RSA. En la actualidad, el usuario tiene que elegir entre los grados "alto" (2048 bits) y "medio" (1024 bits).</p>
+
+<p>Para las claves DSA, el parámetro <code>keyparams</code> especifica los parámetros DSA PQG que se van a utilizar en el proceso de creación de llaves. El valor del parámetro <code>pqg</code> es en BASE64, DER codificado Dss-Parms como se especifica en el IETF <a class="link-ftp" href="ftp://ftp.rfc-editor.org/in-notes/rfc3279.txt">RFC 3279</a> . El usuario puede tener una variedad de tamaños de claves DSA, lo que permite al usuario elegir una de las dimensiones definidas en el estándar DSA.</p>
+
+<p>Para las claves CE, el parámetro <code>keyparams</code> especifica el nombre de la curva elíptica en la que será generada la clave. Normalmente es una cadena de la tabla en <a class="external" href="http://mxr.mozilla.org/mozilla-central/source/security/manager/ssl/src/nsKeygenHandler.cpp?mark=179-185,187-206,208-227,229-256#177" title="http://mxr.mozilla.org/mozilla-central/source/security/manager/ssl/src/nsKeygenHandler.cpp?mark=179-185 ,187-206 ,208-227 ,229-256 # 177">nsKeygenHandler.cpp</a> . (Tenga en cuenta que sólo un subconjunto de las curvas nombradas puede ser compatible con un navegador en particular.) Si la cadena parámetro <code>keyparams</code> no es el nombre de una curva reconocible, entonces una curva se elige de acuerdo a la fortaleza elegida por el usuario (bajo, medio, alto), utilizando la curva llamada " <code>secp384r1</code> " para alto, y la curva llamada" <code>secp256r1</code> " para claves de fuerza mediana. (Nota: la elección de la cantidad de fortalezas, los valores por defecto para cada fuerza, y la interfaz de usuario que el usuario se ofrece una opción, están fuera del alcance de esta especificación.)</p>
+
+<p>El elemento <code>keygen</code> sólo es válido dentro de un formulario HTML. Esto causará que algún tipo de selección se presentará al usuario para la selección del tamaño de la clave. La interfaz de usuario para la selección puede ser un menú, botones de radio, o posiblemente algo más. El navegador presentará varias fuerzas posibles. Actualmente, se ofrecen dos fuerzas, alta y media. Si el navegador del usuario está configurado para el soporte de hardware de cifrado (por ejemplo, "tarjetas inteligentes"), también puede dársele la opción al usuario de dónde generar la clave, es decir, si en una tarjeta inteligente o en el software y si se almacenan en el disco.</p>
+
+<p>Cuando el botón de enviar es pulsado, un par de claves del tamaño seleccionado se genera. La clave privada se cifra y se almacena en la base de datos de claves local.</p>
+
+<pre>   PublicKeyAndChallenge:: SEQUENCE {
+       SPKI SubjectPublicKeyInfo,
+       challenge IA5String
+   }
+   SignedPublicKeyAndChallenge:: SEQUENCE {
+       publicKeyAndChallenge PublicKeyAndChallenge,
+       signatureAlgorithm AlgorithmIdentifier,
+       firma BIT STRING
+   }</pre>
+
+<p>La clave pública y la cadena de desafío son codificadas con DER como PublicKeyAndChallenge, a continuación, firmados digitalmente con la clave privada para producir una SignedPublicKeyAndChallenge. El SignedPublicKeyAndChallenge es base64, y los datos ASCII finalmente se envía al servidor como un par de nombre/valor de formulario, donde el nombre es <var>name</var> especificado por el atributo <code>name</code> del elemento <code>keygen</code>. Si no hay cadena de desafío se proporciona, entonces será codificada como IA5String de longitud cero.</p>
+
+<p>He aquí un ejemplo de envío de formularios, como sería entregado a un programa CGI en el servidor HTTP:</p>
+
+<pre>   CommonName = John Doe + y e-mail = doe@foo.com y org = Foobar + + Informática Corp. y
+   orgunit = Oficina + de + la burocracia y la localidad Ciudad X = y = estado de California y en el país = EE.UU. y
+   key = MIHFMHEwXDANBgkqhkiG9w0BAQEFAANLADBIAkEAnX0TILJrOMUue% 2BPtwBRE6XfV% 0AWtKQbsshxk5ZhcUwcwyvcnIq9b82QhJdoACdD34rqfCAIND46fXKQUnb0mvKzQID% 0AAQABFhFNb3ppbGxhSXNNeUZyaWVuZDANBgkqhkiG9w0BAQQFAANBAAKv2Eex2n% 2FS% 0Ar 2F7iJNroWlSzSMtTiQTEB%%%% 2BADWHGj9u1xrUrOilq 2Fo2cuQxIfZcNZkYAkWP4DubqW 0Ai0% 2F% 3D% 2FrgBvmco</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<ul>
+ <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380749" title="https://bugzilla.mozilla.org/attachment.cgi?id=380749">Sample form with RSA KEYGEN element</a></li>
+ <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380750" title="https://bugzilla.mozilla.org/attachment.cgi?id=380750">Sample form with DSA KEYGEN element and PQG Parameters</a></li>
+ <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380751" title="https://bugzilla.mozilla.org/attachment.cgi?id=380751">Sample form with DSA KEYGEN element but no PQG Parameters</a></li>
+ <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380752" title="https://bugzilla.mozilla.org/attachment.cgi?id=380752">Sample form with EC KEYGEN element</a></li>
+</ul>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Navegador</th>
+   <th>Versión más baja</th>
+  </tr>
+  <tr>
+   <td>Internet Explorer</td>
+   <td>---</td>
+  </tr>
+  <tr>
+   <td>Firefox (Gecko)</td>
+   <td>1.0 (1.0)</td>
+  </tr>
+  <tr>
+   <td>Opera</td>
+   <td>3.0</td>
+  </tr>
+  <tr>
+   <td>Safari (WebKit)</td>
+   <td>1.2 (125)</td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<p>{{ languages ({"fr": "fr/HTML/Element/Keygen","en": "en/HTML/Element/Keygen"}) }}</p>
diff --git a/files/es/web/html/element/label/index.html b/files/es/web/html/element/label/index.html
new file mode 100644
index 0000000000..4ef1a1a7d9
--- /dev/null
+++ b/files/es/web/html/element/label/index.html
@@ -0,0 +1,139 @@
+---
+title: <label>
+slug: Web/HTML/Element/label
+translation_of: Web/HTML/Element/label
+original_slug: Web/HTML/Elemento/label
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El<em> </em><strong>Elemento </strong><strong style="line-height: 1.5;">HTML </strong><strong style="line-height: 1.5;"><code style="font-size: 14px;">&lt;label&gt; </code></strong><span style="line-height: 1.5;">representa una etiqueta para un elemento en una interfaz de usuario. Este puede estar asociado con un control ya sea mediante la utilizacion del atributo </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">for</span><span style="line-height: 1.5;">, o ubicando el control dentro del elemento </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">label</span><span style="line-height: 1.5;">. Tal control es llamado "el control etiquetado" del elemento </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">label</span><span style="line-height: 1.5;">.</span></p>
+
+<ul class="htmlelt">
+ <li><dfn><a href="/en-US/docs/Web/HTML/Content_categories">Categorias</a></dfn> <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Interactive_content">contenido interactivo</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Form-associated_content">elemento de formulario asociado</a>, contenido palpable.</li>
+ <li><dfn>Contenido permitido</dfn> <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Contenido de fraseo</a>, pero no otros componentes <code>label</code> ni otros elementos etiquetables a parte del de control ya etiquetado.</li>
+ <li><dfn>Omision del Tag</dfn> {{no_tag_omission}}</li>
+ <li><dfn>Elementos padre permitidos</dfn> Cualquier elemento que acepte el <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</li>
+ <li><dfn>DOM interface</dfn> {{domxref("HTMLLabelElement")}}</li>
+</ul>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("accesskey")}} {{HTMLVersionInline("4")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Una tecla de atajo para acceder a este elemento desde el teclado.</dd>
+ <dt>{{htmlattrdef("for")}}</dt>
+ <dd>El ID del elemento de formulario etiquetable relacionado en el mismo documento que el elemento <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">label</span><span style="line-height: 1.5;">. El primer elemento en el documento con tal ID que coincida con el dispuesto en el atributo </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">for</span><span style="line-height: 1.5;"> será el control etiquetado para este elemento.</span></dd>
+ <dd>
+ <div class="note"><strong>Nota:</strong> Un elemento label puede contener ambos; El atributo for y el elemento de control anidado, siempre y cuando el atributo for <span style="line-height: 1.5em;">apunte al mismo elemento. </span></div>
+ </dd>
+ <dt>{{htmlattrdef("form")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>El formulario con el cual el label está asociado (su formulario dueño). El valor de este atributo debe ser un ID del elemento {{HTMLElement("form")}} en el mismo documento. Si este atributo no es especificado, este elemento <code>&lt;label&gt;</code> deberia ser descendiente de un elemento {{HTMLElement("form")}}. Este atributo permite ubicar el elemento label en cualquier lugar dentro del documento y no solo como descendiente de su respectivo formulario.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;!-- Un simple ejemplo de un label con el atributo for --&gt;
+&lt;label for="Name"&gt;Click me&lt;/label&gt;
+&lt;input type="text" id="Name" name="Name" /&gt;
+
+&lt;!-- Aun mas simple --&gt;
+&lt;label&gt;Click me &lt;input type="text" id="Name" name="Name" /&gt;&lt;/label&gt;</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p><label>Click me <input></label></p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#the-label-element', '&lt;label&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-label-element', '&lt;label&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.9.1', '&lt;label&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad">Compatibilidad</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+   <td>{{compatversionunknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Notes">Notes</h3>
+
+<h4 id="Click_events_in_nested_&lt;label>_elements">Click events in nested <code>&lt;label&gt;</code> elements</h4>
+
+<p>Starting with Gecko 8.0 {{geckoRelease("8.0")}}, a bubbling click event triggers at most one <code>&lt;label&gt;</code>, and the synthetic click event cannot trigger additional <code>&lt;label&gt;</code>s. In Gecko, a click event will still bubble up past a <code>&lt;label&gt;</code>, while in WebKit or Internet Explorer the click event will stop at the <code>&lt;label&gt;</code>. The behavior prior to Gecko 8.0 (triggering multiple <code>&lt;label&gt;</code>s) caused Firefox to stop responding (see {{bug(646157)}}).</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>Other form-related elements: {{HTMLElement("form")}}, {{HTMLElement("button")}}, {{HTMLElement("datalist")}}, {{HTMLElement("legend")}}, {{HTMLElement("select")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("option")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/legend/index.html b/files/es/web/html/element/legend/index.html
new file mode 100644
index 0000000000..1ad33e3359
--- /dev/null
+++ b/files/es/web/html/element/legend/index.html
@@ -0,0 +1,126 @@
+---
+title: legend
+slug: Web/HTML/Element/legend
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/legend
+original_slug: Web/HTML/Elemento/legend
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <span style="font-family: courier new;">&lt;legend&gt;</span> (leyenda) crea un título para un grupos los campos ({{ HTMLElement("fieldset") }}) de un formulario.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <span style="font-family: courier new;">&lt;legend&gt;</span> y <span style="font-family: courier new;">&lt;/legend&gt;</span> (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a></dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>:</dd>
+</dl>
+
+<dl>
+ <dd><strong>Debe contener</strong>: cero o más elementos <a href="/es/HTML/Elemento/Tipos_de_elementos#en_linea" title="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+ <dd><strong>Debe estar contenido por</strong>: debe ser el primer hijo de un elemento {{ HTMLElement("fieldset") }}</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>lista de clases separadas por espacios</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>uno de los siguientes:"ltr" o "rtl"</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">accesskey</code></td>
+   <td>un caracter</td>
+   <td>implícito</td>
+   <td>carácter de la tecla de acceso rápido</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">align</code></td>
+   <td>uno de los siguientes: "top", "bottom", "left" o "right"</td>
+   <td>implícito</td>
+   <td>alineación con relación al fieldset</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre>&lt;form&gt;
+  &lt;fieldset&gt;
+    &lt;legend&gt;Información Personal&lt;/legend&gt;
+    &lt;label for="nombre"&gt;Nombre:&lt;/label&gt;
+    &lt;input name="nombre" id="nombre" type="text" tabindex="1" /&gt;
+    &lt;label for="apellidos"&gt;Apellidos:&lt;/label&gt;
+    &lt;input name="apellidos" id="apellidos" type="text" tabindex="2" /&gt;
+  &lt;/fieldset&gt;
+
+  &lt;fieldset&gt;
+    &lt;legend&gt;Edad&lt;/legend&gt;
+    &lt;label&gt;&lt;input type="checkbox" tabindex="20" name="edad" value="20-39" /&gt; 20-39&lt;/label&gt;
+    &lt;label&gt;&lt;input type="checkbox" tabindex="21" name="edad" value="40-59" /&gt; 40-59&lt;/label&gt;
+    &lt;label&gt;&lt;input type="checkbox" tabindex="22" name="edad" value="60-79" /&gt; 60-79&lt;/label&gt;
+  &lt;/fieldset&gt;
+&lt;/form&gt;</pre>
diff --git a/files/es/web/html/element/li/index.html b/files/es/web/html/element/li/index.html
new file mode 100644
index 0000000000..d9e648610a
--- /dev/null
+++ b/files/es/web/html/element/li/index.html
@@ -0,0 +1,124 @@
+---
+title: li
+slug: Web/HTML/Element/li
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/li
+original_slug: Web/HTML/Elemento/li
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <code style="color: darkblue;">li</code> del ingles <em>item list</em> o<em> elemento de lista</em> declara cada uno de los elementos de una lista.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;li&gt; y &lt;/li&gt; (la de cierre es opcional).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>:</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> o en <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">type</code></td>
+   <td>(disc|square|circle) (1|a|A|i|I)</td>
+   <td>implícito</td>
+   <td>estilo de numeración</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">value</code></td>
+   <td>'un número'</td>
+   <td>implícito</td>
+   <td>reinicializar número de secuencia</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre class="eval">&lt;ul&gt;
+ &lt;li&gt;punto uno&lt;/li&gt;
+ &lt;li&gt;punto dos&lt;/li&gt;
+ &lt;li&gt;punto tres&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
+<div class="highlight">
+<p>Se visualiza así:</p>
+
+<ul>
+ <li>punto uno</li>
+ <li>punto dos</li>
+ <li>punto tres</li>
+</ul>
+</div>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/element/link/index.html b/files/es/web/html/element/link/index.html
new file mode 100644
index 0000000000..42f6f00185
--- /dev/null
+++ b/files/es/web/html/element/link/index.html
@@ -0,0 +1,426 @@
+---
+title: link
+slug: Web/HTML/Element/link
+tags:
+  - HTML
+  - HTML:Elemento
+  - Metadatos
+  - Metadatos de documento HTML
+  - Referencia
+  - Todas_las_Categorías
+  - Web
+translation_of: Web/HTML/Element/link
+original_slug: Web/HTML/Elemento/link
+---
+<p id="Summary">{{HTMLRef}}</p>
+
+<p>El <strong>elemento HTML <code>&lt;link&gt;</code></strong> especifica la relación entre el documento actual y un recurso externo. Los usos posibles de este elemento incluyen la definición de un marco relacional para navegación. Este elemento es más frecuentemente usado para enlazar hojas de estilos.</p>
+
+<div class="note">
+<p>El atributo {{htmlattrxref("rel", "link")}} puede ser establecido con muchos valores diferentes. Estos se encuentran <a href="/es/docs/Web/HTML/Tipos_de_enlaces">listados</a> en una página separada.</p>
+</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td>Contenido en metadatos. Si {{htmlattrxref("itemprop", "link")}} está presente: <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido dinámico</a> y <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a></td>
+  </tr>
+  <tr>
+   <th>Contenido permitido</th>
+   <td>Ninguno, es un {{Glossary("empty element", "elemento vacío")}}.</td>
+  </tr>
+  <tr>
+   <th>Omisión de etiqueta</th>
+   <td>Siendo un elemento vacío, la etiqueta de inicio debe estar presente y la etiqueta de cierre no debe estarlo</td>
+  </tr>
+  <tr>
+   <th>Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte elementos de metadatos. Si está presente el atributo {{htmlattrxref("itemprop", "link")}}: cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a>.</td>
+  </tr>
+  <tr>
+   <th>Interfaz DOM</th>
+   <td>{{domxref("HTMLLinkElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("charset")}}{{obsolete_inline}}</dt>
+ <dd>Este atributo define la codificación de caracteres del recurso enlazado. El valor es un espacio y/o una lista de grupos de caracteres según se define en {{rfc(2045)}}, separados por coma. El valor predeterminado es <code>iso-8859-1</code>.
+ <div class="note"><strong>Nota de uso:</strong> Este atributo es obsoleto y <strong>no debe ser usado por autores</strong>. Para conseguir su mismo efecto, se recomienda usar el encabezado HTTP <span style="font-family: courier new;">Content-Type</span> en el recurso enlazado.</div>
+ </dd>
+ <dt>{{htmlattrdef("crossorigin")}}</dt>
+ <dd>Este atributo enumerado indica si se debe usar CORS cuando se solicite una imagen relacionada. Las <a href="/es/docs/Web/HTML/Imagen_con_CORS_habilitado">imágenes con CORS habilitado</a> pueden ser reutilizadas en el elemento {{HTMLElement("canvas")}} sin que estén <em>corruptas</em>.Los valores permitidos son:
+ <dl>
+  <dt><code>"anonymous"</code></dt>
+  <dd>Una solicitud a un origen cruzado (esto es, con el encabezado HTTP <code>Origin:</code>) es realizada, pero no se envían credenciales (es decir, no se envían cookies, ni certificado X.509, ni datos de autenticación básica HTTP). Si el servidor no otorga credenciales al sitio de origen (por no enviar el encabezado HTTP <code>Access-Control-Allow-Origin:</code>) la imagen estará <em>corrupta</em>, y su uso estará restringido.</dd>
+  <dt><code>"use-credentials"</code></dt>
+  <dd>Una solicitud a un origen cruzado (esto es, con el encabezado HTTP <code>Origin:</code>) es realizada, enviando credenciales (es decir, se envían cookies, certificado y autenticación básica HTTP). Si el servidor no otorga credenciales al sitio de origen (a través del encabezado HTTP <code>Access-Control-Allow-Credentials:</code>), la imagen estará <em>corrupta</em>, y su uso estará restringido.</dd>
+ </dl>
+ Si no está presente, el recurso es obtenido sin una solicitud CORS (sin enviar el encabezado HTTP <code>Origin:</code>), previniendo así su uso no corrupto en elementos {{HTMLElement('canvas')}}. Si se introduce un valor no permitido, se maneja como si usara el valor <strong>anonymous</strong>. Véase <a href="/es/docs/Web/HTML/Atributos_de_configuracion_CORS">atributos de configuración CORS</a> para más información.</dd>
+ <dt>{{htmlattrdef("disabled")}} {{Non-standard_inline}}</dt>
+ <dd>Este atributo es usado para deshabilitar una relación de enlace. Agregando programación, este atributo puede ser usado para habilitar o deshabilitar la relación con distintas hojas de estilos.
+ <div class="note">
+ <p><strong>Nota:</strong> Aunque no hay atributo <code>disabled</code> en el estándar de HTML, <strong>sí</strong> hay un atributo <code>disabled</code> en el objeto DOM <code>HTMLLinkElement</code>.</p>
+
+ <p>El uso de <code>disabled</code> como atributo HTML no es estándar, y solo puede ser usado en algunos navegadores (<a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=27677">W3 #27677</a>). <strong style="font-weight: bold;">No debe usarse</strong>. Para lograr un efecto similar, se puede usar una de las siguientes técnicas:</p>
+
+ <ul>
+  <li>Si el atributo <code>disabled</code> fue añadido directamente al elemento en la página, no incluya el elemento {{HTMLElement("link")}} en vez de eso;</li>
+  <li>Establezca la <strong>propiedad</strong> <code>disabled</code> del objeto DOM <code>StyleSheet</code> vía programación.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("href")}}</dt>
+ <dd>Este atributo especifica la {{glossary("URL")}} del recurso enlazado. La URL debe ser absoluta o relativa.</dd>
+ <dt>{{htmlattrdef("hreflang")}}</dt>
+ <dd>Este atributo indica el idioma del recurso enlazado. Es meramente informativo. Los valores permitidos son determinados por la <a href="http://www.ietf.org/rfc/bcp/bcp47.txt">BCP47</a>. Se recomienda usar este atributo solamente si el atributo {{htmlattrxref("href", "a")}} está presente.</dd>
+ <dt>{{htmlattrdef("integrity")}} {{experimental_inline}}</dt>
+ <dd>Contiene metadatos en línea, el valor criptográfico codificado a base 64 de un recurso (archivo) que se le está indicando al navegador que obtenga, el cual puede ser utilizado por el agente usuario para verificar si el recurso obtenido ha sido entregado libre de manipulaciones inesperadas. Véase <a href="/es/docs/Web/Security/Subresource_Integrity">Integridad de subrecursos</a>.</dd>
+ <dt>{{htmlattrdef("media")}}</dt>
+ <dd>Este atributo especifica el tipo de medio al que aplica el recurso enlazado. Su valor debe ser un <a href="/en-US/docs/CSS/Media_queries">media query</a>. Este atributo es usado principalmente cuando se enlaza a una hoja de esetilos externa en la que se le permita al agenete usuario seleccionar la que mejor se adapte al dispositivo sobre el que se ejecuta.
+ <div class="note"><strong>Notas de uso: </strong>
+ <ul>
+  <li>En HTML 4, esto puede ser solamente una lista simple de literales de medios separadas por espacio, es decir, <a href="/es/docs/Web/CSS/@media">tipos de medios y grupos</a>, donde se definían valores para este atributo, tales como <code>print</code>, <code>screen</code>, <code>aural</code>, <code>braille</code>. HTML5 extiende esto a cualquier clase de <a href="/es/docs/CSS/Media_queries">media queries</a>, los cuales son un superconjunto de los valores permitidos de HTML 4.</li>
+  <li>Los navegadores que no soporten los <a href="/es/docs/CSS/Media_queries">Media Queries de CSS3</a> no necesariamente reconocerán el enlace adecuado; no olvide establecer enlaces de <em>fallback</em>, usando los conjuntos de media queriese definidos en HTML 4.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("methods")}} {{Non-standard_inline}}</dt>
+ <dd>El valor de este atributo provee información acerca de las funciones que podrían ser ejecutadas en un objeto. Los valores son generalmente indicados por el protocolo HTTP cuando se usa, pero podrían (por razones similares a las del atributo <strong>title</strong>) ser usados para incluir información de ayuda por adelantado en el enlace. Por ejemplo, el navegador podría elegir una representación diferente de un enlace como una función de los métodos especificados; algo que es buscable podría tener un ícono diferente, o un enlace externo podría dibujar una indicación de que se dejará el sitio actual. Este atributo no está bien comprendido, ni soportado, aun por el navegador en el que se definió, Internet Explorer 4. Véase <a href="http://msdn.microsoft.com/en-us/library/ms534168%28VS.85%29.aspx" rel="external nofollow">Propiedades de métodos (MSDN)</a>.</dd>
+ <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt>
+ <dd>Una cadena de texto que indica el referente a usar cuando se obtenga el recurso:
+ <ul>
+  <li><code>'no-referrer'</code> significa que el encabezado {{HTTPHeader("Referer")}} no será enviado.</li>
+  <li><code>'no-referrer-when-downgrade'</code> significa que no se enviará el encabezado {{HTTPHeader("Referer")}} cuando se navegue a un origen sin TLS (HTTPS). Este es el comportamiento predeterminado del agente usuario, si no se especifica una política distinta.</li>
+  <li><code>'origin'</code> significa que el referente será el origen de la página, qué es básicamente el esquema, host y puerto.</li>
+  <li><code>'origin-when-cross-origin'</code> significa que la navegación a otros orígenes estará limitada por el esquema, el host y el puerto, mientras que navegar dentro del mismo origen incluirá la ruta del referente </li>
+  <li><code>'unsafe-url'</code> significa que el referente incluirá el origen y ruta (sin el fragmento, contraseña o nombre de usuario). Este caso es inseguro porque permite filtrar orígenes y rutas desde recursos protegidos por TLS a orígenes inseguros.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("rel")}}</dt>
+ <dd>Este atributo indica la relación del documento enlazado con el actual. El atributo debe ser una lista de <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipos de enlaces</a> separados por espacio. El uso más común para este atributo es especificar el enlace a una hoja de estilos externa: el atributo <strong>rel</strong> se establece con valor <code>stylesheet</code>, y el atributo <strong>href</strong> se establece con la URL de la hoja de estilos externa para dar formato a la página. WebTV también soporta el uso del valor <code>next</code> en <strong>rel</strong> para precargar la siguiente página en una serie de documentos.</dd>
+ <dt>{{htmlattrdef("rev")}}{{obsolete_inline}}</dt>
+ <dd>El valor de este atributo muestra la relación del documento actual al documento enlazado, como se define en el atributo {{htmlattrxref("href", "link")}}. En consecuencia, este atributo define la relación inversa, en comparación al valor del atributo <strong>rel</strong>. Los <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipos de enlace</a> para este atributo son similares a los disponibles para {{htmlattrxref("rel", "link")}}.
+ <div class="note"><strong>Notas de uso:</strong> Este atributo es obsoleto en HTML5. <strong>No debe usarse</strong>. Para lograr este efecto, use el atributo {{htmlattrxref("rel", "link")}} con el <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipo de enlace</a> contrario, por ejemplo, <span style="font-family: courier new;">made</span> debe reemplazar a <span style="font-family: courier new;">author</span>. Además, este atributo no significa <em>revision</em> y no debe ser usado con un número de versión, que es desafortunadamente el caso de muchos sitios.</div>
+ </dd>
+ <dt>{{htmlattrdef("sizes")}}</dt>
+ <dd>Este atributo define los tamaños de los íconos para medios visuales contenidos en el recurso. Debe estar presente solo si el atributo {{htmlattrxref("rel","link")}} contiene el <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipo de enlace</a> <span style="font-family: courier new;">icon</span>. Puede tener los siguientes valores:
+ <ul>
+  <li><code>any</code>, significa que el ícono puede ser escalado a cualquier tamaño, ya que está en un formato vectorial, como <code>image/svg+xml</code>.</li>
+  <li>una lista de tamaños separados por espacios en blanco, cada uno en formato <span style="font-family: courier new;"><em>&lt;anchura en píxeles&gt;</em>x<em>&lt;altura en píxeles&gt;</em></span> or <span style="font-family: courier new;"><em>&lt;anchura en píxeles&gt;</em>X<em>&lt;altura en píxeles&gt;</em></span>. Cada uno de estos tamaños debe estar contenido en el recurso.</li>
+ </ul>
+
+ <div class="note"><strong>Notas de uso: </strong>
+
+ <ul>
+  <li>La mayoría de los formatos de ícono solo permiten almacenar un ícono; por lo que la mayoría de las ocasiones, el atributo {{htmlattrxref("sizes")}} contiene solamente una entrada. El formato ICO de Microsoft lo hace, así como el formato ICN de Apple. Siendo ICO más común, es el que se recomienda usar.</li>
+  <li>iOS de Apple no soporta este atributo, por lo que iPhone y iPad de Apple usan <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipos de enlaces</a> especiales, no estándares, para definir los íconos a usar como Web Clip o contenedor de inicio: <span style="font-family: courier new;">apple-touch-icon</span> y <span style="font-family: courier new;">apple-touch-startup-icon</span>.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("target")}}{{Non-standard_inline}}</dt>
+ <dd>Define el nombre del frame o ventana que tendrá la relación de enlace o que mostrará la representación de algun recurso enlazado.</dd>
+ <dt>{{htmlattrdef("title")}}</dt>
+ <dd>El atributo <code>title</code> tiene semántica particular para el elemento <code>&lt;link&gt;</code>. Cuando se usa en una etiqueta <code>&lt;link rel="stylesheet"&gt;</code>, define una <a href="/es/docs/Web/CSS/Alternative_style_sheets">hoja de estilos preferida o alternativa</a>. El uso incorrecto de este atributo podría <a href="/es/docs/Correctly_Using_Titles_With_External_Stylesheets">provocar que la hoja de estilos sea ignorada</a>.</dd>
+ <dt>{{htmlattrdef("type")}}</dt>
+ <dd>Este atributo es usado para definir el tipo de contenido al que se enlaza. El valor del atributo debe ser un tipo MIME, como <strong>text/html</strong>, <strong>text/css</strong>. El uso común de este atributo es para definir el tipo de hoja de estilos enlazada, y el valor más común es <strong>text/css</strong>, el cual indica un formato de Hoja de Estilos en Cascada.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Incluyendo_una_hoja_de_estilos">Incluyendo una hoja de estilos</h3>
+
+<p>Para incluir una hoja de estilos en una página, use la siguiente sintaxis:</p>
+
+<pre class="brush: html">&lt;link href="style.css" rel="stylesheet"&gt;
+</pre>
+
+<h3 id="Proporcionando_hojas_de_estilos_alternativas">Proporcionando hojas de estilos alternativas</h3>
+
+<p>También se pueden especificar <a href="/es/docs/Web/CSS/Alternative_style_sheets">hojas de estilos alternativas</a>.</p>
+
+<p>El usuario puede elegir cuál hoja de estilos usar, seleccionándola desde el menú Ver &gt; Estilo de Página. Esto proporciona una manera en que los usuarios pueden ver múltiples versiones de una misma página.</p>
+
+<pre class="brush: html">&lt;link href="default.css" rel="stylesheet" title="Default Style"&gt;
+&lt;link href="fancy.css" rel="alternate stylesheet" title="Fancy"&gt;
+&lt;link href="basic.css" rel="alternate stylesheet" title="Basic"&gt;
+</pre>
+
+<h3 id="Eventos_de_carga_de_hojas_de_estilos">Eventos de carga de hojas de estilos</h3>
+
+<p>Se puede determinar cuando una hoja de estilos fue cargada estableciendo la ejecución de un evento <code>load</code> en el elemento; de forma similar, se puede detectar si ocurrió un error al procesar una hoja de estilos, observando el evento <code>error</code>:</p>
+
+<pre class="brush: html">&lt;script&gt;
+function sheetLoaded() {
+  // Hacer algo interesante; la hoja de estilos ha sido cargada
+}
+
+function sheetError() {
+  alert("¡Ocurrió un error al cargar la hoja de estilos!");
+}
+&lt;/script&gt;
+
+&lt;link rel="stylesheet" href="mystylesheet.css" onload="sheetLoaded()" onerror="sheetError()"&gt;
+</pre>
+
+<div class="note"><strong>Nota:</strong> El evento <code>load</code> se dispara una vez que la hoja de estilos y todo su contenido importado ha sido cargado y procesado, e inmediatamente antes de que los estilos sean aplicados al contenido.</div>
+
+<h2 id="Notas">Notas</h2>
+
+<ul>
+ <li>Una etiqueta <code>&lt;link&gt;</code> puede ocurrir solo en el elemento head; sin embargo, pueden haber múltiples ocurrencias de <code>&lt;link&gt;</code>.</li>
+ <li>HTML 3.2 define solamente los atributos <strong>href</strong>, <strong>rel</strong>, <strong>rev</strong>, y <strong>title</strong> para el elemento link.</li>
+ <li>HTML 2 define los atributos <strong>href</strong>, <strong>methods</strong>, <strong>rel</strong>, <strong>rev</strong>, <strong>title</strong>, y <strong>urn</strong> para el elemento <code>&lt;link&gt;</code>. Los atributos <strong>methods</strong> y <strong>urn</strong> fueron eliminados más adelante de las especificaciones.</li>
+ <li>Las especificaciones HTML y XHTML definen controladores de evento para el elemento <code>&lt;link&gt;</code>, pero no está claro cómo serían usados.</li>
+ <li>En XHTML 1.0, elementos vacíos como <code>&lt;link&gt;</code> requieren una diagonal de cierre: <code>&lt;link /&gt;</code>.</li>
+</ul>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Subresource Integrity', '#htmlscriptelement', '&lt;script&gt;')}}</td>
+   <td>{{Spec2('Subresource Integrity')}}</td>
+   <td>Se añade el atributo <code>integrity</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-link-element', '&lt;link&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No hay cambios desde la versión anterior</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-link-element', '&lt;link&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Se añaden los atributos <code>crossorigin</code> y <code>sizes</code>; valores extendidos para <code>media</code> para cualquier media query; se añaden numerosos valores para <code>rel</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/links.html#h-12.3', '&lt;link&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Hojas de estilos alternativas</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>disabled</code> {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>methods</code> {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>sizes</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}} {{bug("441770")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Eventos <code>load</code> y <code>error</code></td>
+   <td>
+    <p>19 (Webkit: 535.23)</p>
+
+    <p>({{webkitbug(38995)}})</p>
+   </td>
+   <td>{{CompatGeckoDesktop("9.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>11.60</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>crossorigin</code></td>
+   <td>{{CompatChrome("25")}}</td>
+   <td>{{CompatGeckoDesktop("18.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatOpera("15")}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>integrity</code></td>
+   <td>{{CompatChrome(45.0)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+  </tr>
+  <tr>
+   <td>Atributo <code>referrerpolicy</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("50.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Hojas de estilos alternativas</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>disabled</code> {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>methods</code> {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>4.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>sizes</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} {{bug("441770")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Eventos <code>load</code> y <code>error</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("9.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>crossorigin</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("18.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>integrity</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(45.0)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(45.0)}}</td>
+  </tr>
+  <tr>
+   <td>Atributo <code>referrerpolicy</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("50.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] {{WebKitBug(148363)}} da seguimiento a la implementación en Webkit de Integridad de Subrecursos (lo cual incluye el atributo <code>integrity</code>).</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="http://pieisgood.org/test/script-link-events/">Tabla de compatibilidad de eventos en &lt;script&gt; y &lt;link&gt;, por Ryan Grove</a></li>
+</ul>
diff --git a/files/es/web/html/element/main/index.html b/files/es/web/html/element/main/index.html
new file mode 100644
index 0000000000..c9211bd36f
--- /dev/null
+++ b/files/es/web/html/element/main/index.html
@@ -0,0 +1,152 @@
+---
+title: <main>
+slug: Web/HTML/Element/main
+translation_of: Web/HTML/Element/main
+original_slug: Web/HTML/Elemento/main
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El <strong>elemento</strong> <strong>HTML <code>&lt;main&gt;</code> </strong>representa el contenido principal del {{HTMLElement("body")}} de un documento o aplicación. El área principal del contenido consiste en el contenido que está directamente relacionado, o se expande sobre el tema central de un documento o la funcionalidad central de una aplicación. Este contenido debe ser único al documento, excluyendo cualquier contenido que se repita a través de un conjunto de documentos como barras laterales, enlaces de navegación, información de derechos de autor, logos del sitio y formularios de búsqueda (a menos, claro, que la función principal del documento sea un formulario de búsqueda).</p>
+
+<div class="note">
+<p><strong>Nota:</strong> <strong>no debe haber</strong> más de un elemento <code>&lt;main&gt;</code> en un documento, y este <strong>no debe ser</strong> descendiente de un elemento  {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, o {{HTMLElement("nav")}}.</p>
+</div>
+
+<ul class="htmlelt">
+ <li><dfn><a href="/en-US/docs/Web/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></dfn><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>, palpable content.</li>
+ <li><dfn>Contenido permitido</dfn> <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>.</li>
+ <li><dfn>Omisión de etiquetas</dfn> Ninguna; ambas etiqueta inical y de fin son obligatorias.</li>
+ <li><dfn>Elementos padres permitidos</dfn> Cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">flow content</a>, pero no debe ser un descendiente de un elemento {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, o {{HTMLElement("nav")}}.</li>
+ <li><dfn>Interfaz DOM</dfn> {{domxref("HTMLElement")}}</li>
+</ul>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento solo incluye  </span><a href="/en-US/docs/Web/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globales.</a></p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html">&lt;!-- other content --&gt;
+
+<span class="highlight">&lt;main&gt;</span>
+  &lt;h1&gt;Apples&lt;/h1&gt;
+  &lt;p&gt;The apple is the pomaceous fruit of the apple tree.&lt;/p&gt;
+
+  &lt;article&gt;
+    &lt;h2&gt;Red Delicious&lt;/h2&gt;
+    &lt;p&gt;These bright red apples are the most common found in many
+    supermarkets.&lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+  &lt;/article&gt;
+
+  &lt;article&gt;
+    &lt;h2&gt;Granny Smith&lt;/h2&gt;
+    &lt;p&gt;These juicy, green apples make a great filling for
+    apple pies.&lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+    &lt;p&gt;... &lt;/p&gt;
+  &lt;/article&gt;
+
+<span class="highlight">&lt;/main&gt;</span>
+
+&lt;!-- other content --&gt;</pre>
+
+<h2 id="Specifications" name="Specifications">Sobre Accesibilidad</h2>
+
+<p>Algunos lectores de pantalla reconocen la etiqueta <code>main</code> y proveen un atajo para que el usuario pueda saltar directamente al contenido de esta etiqueta sin tener que pasar por el resto.</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<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('HTML WHATWG', '#the-main-element', '&lt;main&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Eliminada la restricción acerca de usar  <code>&lt;main&gt;</code> como un descendente del elemento {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, o {{HTMLElement("nav")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'grouping-content.html#the-main-element', '&lt;main&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Sin cambios desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-main-element', '&lt;main&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad entre navegadores</h2>
+
+<p>Como una caracterisca nueva propuesta para HTML, el elemento <code>&lt;main&gt;</code> no está todavía ampliamente soportado. Es sumamente recomendable añadir el rol ARIA <code>"main"</code> a cualquier elemento <code>&lt;main&gt;</code>:</p>
+
+<pre class="brush: html">&lt;main role="main"&gt;
+  ...
+&lt;/main&gt;
+</pre>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>
+    <p>Característica</p>
+   </th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>Chrome 26</td>
+   <td>{{ CompatGeckoDesktop("21.0") }}</td>
+   <td>{{CompatNo()}}</td>
+   <td>{{CompatNo()}}</td>
+   <td>{{CompatNo()}} but in tests builds since WebKit r140374</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo()}}</td>
+   <td>{{ CompatGeckoMobile("21.0") }}</td>
+   <td>{{CompatNo()}}</td>
+   <td>{{CompatNo()}}</td>
+   <td>{{CompatNo()}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Basic structural elements: {{HTMLElement("html")}}, {{HTMLElement("head")}}, {{HTMLElement("body")}}</li>
+ <li>Section-related elements: {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, or {{HTMLElement("nav")}}</li>
+</ul>
diff --git a/files/es/web/html/element/map/index.html b/files/es/web/html/element/map/index.html
new file mode 100644
index 0000000000..6027ffb48b
--- /dev/null
+++ b/files/es/web/html/element/map/index.html
@@ -0,0 +1,134 @@
+---
+title: map
+slug: Web/HTML/Element/map
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/map
+original_slug: Web/HTML/Elemento/map
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><span class="comment">descripción de uno o dos párrafos</span></p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;map&gt; y &lt;/map&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque"> En bloque </a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#especial"> Elemento especial</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque </a>, o elementos <a href="es/HTML/Elemento/area">area</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">Valor</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title </code></td>
+   <td>Texto</td>
+   <td>Implícito</td>
+   <td>Título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style </code></td>
+   <td>Declaraciones de estilo</td>
+   <td>Implícito</td>
+   <td>Información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id </code></td>
+   <td>Un 'nombre'</td>
+   <td>Implícito</td>
+   <td>Identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class </code></td>
+   <td>Lista de clases CSS</td>
+   <td>implícito</td>
+   <td>Identificador a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir </code></td>
+   <td>Uno de los siguientes: "ltr" o "rtl"</td>
+   <td>Implícito</td>
+   <td>Dirección del texto.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang </code></td>
+   <td>Código de idioma</td>
+   <td>Implícito</td>
+   <td>Información sobre el idioma.</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">name </code></td>
+   <td>Un 'nombre'</td>
+   <td>Necesario</td>
+   <td>Sirve de referencia al atributo usemap</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">Valor</th>
+   <th>Descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">  &lt;&gt;
+
+
+
+  &lt;/&gt;
+</pre>
+
+<p> </p>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#edef-MAP"><strong>map</strong> en la especificación</a> de html 4.01.</li>
+</ul>
+
+<p><span class="comment">secciones futuras: == Soporte de los navegadores == == Valores por defecto y visualización en Firefox ==</span></p>
+
+<div class="note">
+<p>Este documento está siendo editado, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en la elaboración de este documento? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p> </p>
diff --git a/files/es/web/html/element/mark/index.html b/files/es/web/html/element/mark/index.html
new file mode 100644
index 0000000000..ca8c38f67f
--- /dev/null
+++ b/files/es/web/html/element/mark/index.html
@@ -0,0 +1,143 @@
+---
+title: '<mark>: el elemento de resaltado de texto'
+slug: Web/HTML/Element/mark
+tags:
+  - HTML
+  - HTML5
+  - HTML:Elemento
+  - mark
+  - para_revisar
+translation_of: Web/HTML/Element/mark
+original_slug: Web/HTML/Elemento/mark
+---
+<div>{{HTMLRef}}</div>
+
+<p>El <strong> Elemento HTML Mark <code>&lt;mark&gt;</code></strong> representa un texto <strong>marcado</strong> o <strong>resaltado</strong> como referencia o anotación, debido a su relevancia o importancia en un contexto particular.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/mark.html", "tabbed-shorter")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row">Categorías de contenido</th>
+   <td>Contenido de flujo,  contenido de párrafo,  contenido palpable</td>
+  </tr>
+  <tr>
+   <th>Contenido permitido</th>
+   <td><a href="/en/Dom/Content_categories#Phrasing_content" title="en/Dom/Content categories#Phrasing content">Contenido estático</a></td>
+  </tr>
+  <tr>
+   <th>Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th>Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en/Dom/Content_categories#Phrasing_content" title="en/Dom/Content categories#Phrasing content">contenido estático</a></td>
+  </tr>
+  <tr>
+   <th>Roles ARIA permitidos</th>
+   <td>Cualquiera</td>
+  </tr>
+  <tr>
+   <th>Documento normativo</th>
+   <td><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.whatwg.org%2Fspecs%2Fweb-apps%2Fcurrent-work%2Fmultipage%2Ftext-level-semantics.html%23the-mark-element&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFWrrJ-Y17m5GxNva7WqE-i6zuWcA" rel="external nofollow">HTML 5, sección 4.6.17</a></td>
+  </tr>
+  <tr>
+   <th>DOM interface</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento no tiene atributos que no sean los <a class="new " href="https://developer.mozilla.org/es/docs/Web/HTML/Atributos_Globales" rel="internal">atributos globales</a>, comunes a todos los elementos.</p>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<ul>
+ <li>En una cita ({{HTMLElement("q")}})  o en otro bloque ({{HTMLElement("blockquote")}}), generalmente indica texto que es de especial interés pero que no está destacado en el material de origen, o material que necesita especial escrutinio, aunque el autor original no lo considerase importante.</li>
+ <li>Por otro lado, <code>&lt;mark&gt;</code> indica una parte del contenido del documento que probablemente sea relevante para el usuario. Por ejemplo, se puede utilizar en una página que muestra los resultados de búsqueda para resaltar cada uno de estos por palabra.</li>
+ <li>No uses el elemento <code>&lt;mark&gt;</code> para resaltado de sintaxis; usa el elemento {{ HTMLElement("span") }}  para este fin.</li>
+</ul>
+
+<div class="blockIndicator note">
+<p>No se debe confundir el elemento <code><span style="font-family: Courier New;">&lt;mark&gt;</span></code> con el elemento {{ HTMLElement("strong") }}. El elemento {{ HTMLElement("strong") }} se utiliza para denotar intervalos de texto de especial <em>importancia,</em> mientras que el elemento <code>&lt;mark&gt;</code> se utiliza para denotar intervalos de texto de especial <em>relevancia.</em></p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Marcar_texto_de_interés">Marcar texto de interés</h3>
+
+<p>En este ejemplo, &lt;mark&gt; se utiliza para resaltar texto en una cita que es de particular insterés para el usuario.</p>
+
+<pre class="brush: html">&lt;blockquote&gt;
+  It is a period of civil war. Rebel spaceships, striking from a
+  hidden base, have won their first victory against the evil
+  Galactic Empire. During the battle, &lt;mark&gt;Rebel spies managed
+  to steal secret plans&lt;/mark&gt; to the Empire’s ultimate weapon,
+  the DEATH STAR, an armored space station with enough power to
+  destroy an entire planet.
+&lt;/blockquote&gt;</pre>
+
+<p>El resultado sería:</p>
+
+<p>{{EmbedLiveSample("Marking_text_of_interest", 650, 130)}}</p>
+
+<h3 id="Identificando_fragmentos_sensibles_al_contexto">Identificando fragmentos sensibles al contexto</h3>
+
+<p>Este ejemplo demuestra el uso de <code>&lt;mark&gt;</code> para marcar resultados de búsqueda en el fragmento.</p>
+
+<pre class="brush: html">&lt;p&gt;It is a dark time for the Rebellion. Although the Death
+Star has been destroyed, &lt;mark class="match"&gt;Imperial&lt;/mark&gt;
+troops have driven the Rebel forces from their hidden base and
+pursued them across the galaxy.&lt;/p&gt;
+
+&lt;p&gt;Evading the dreaded &lt;mark class="match"&gt;Imperial&lt;/mark&gt;
+Starfleet, a group of freedom fighters led by Luke Skywalker
+has established a new secret base on the remote ice world of
+Hoth.&lt;/p&gt;</pre>
+
+<p>Para ayudar a distinguir el uso de <code>&lt;mark&gt;</code> en los resultados de búsqueda de otro uso potencial, este ejemplo aplica la clase "match" a cada coincidencia.</p>
+
+<p>El resultado se vería:</p>
+
+<p>{{EmbedLiveSample("Identifying_context-sensitive_passages", 650, 130)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-mark-element', '&lt;mark&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-mark-element', '&lt;mark&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+
+
+<p>{{Compat("html.elements.mark")}}</p>
+
+<h2 id="Consulta_también">Consulta también</h2>
+
+<ul>
+ <li>Otros <a href="/en/HTML/Text-level_semantics_elements" title="en/HTML/Text-level semantics elements">elementos de la semántica a nivel de texto</a> : {{ HTMLElement("a") }}, {{ HTMLElement("em") }}, {{ HTMLElement("strong") }}, {{ HTMLElement("cite") }}  , {{ HTMLElement("q") }} , {{ HTMLElement("dfn") }}, {{ HTMLElement("abbr") }}, {{ HTMLElement("time") }} , {{ HTMLElement("code") }} ,{{ HTMLElement("var") }}, {{ HTMLElement("samp") }} ,{{ HTMLElement("kbd") }} ,{{ HTMLElement("sub") }} , {{ HTMLElement("sup") }} ,{{ HTMLElement("i") }} , {{ HTMLElement("b") }}, {{ HTMLElement("mark") }} , {{ HTMLElement("ruby") }} , {{ HTMLElement("rp") }} , {{ HTMLElement("rt") }} , {{ HTMLElement("bdo") }}, {{ HTMLElement("span") }} , {{ HTMLElement("br") }} , {{ HTMLElement("wbr") }}.</li>
+</ul>
diff --git a/files/es/web/html/element/marquee/index.html b/files/es/web/html/element/marquee/index.html
new file mode 100644
index 0000000000..fb3e7f0e6f
--- /dev/null
+++ b/files/es/web/html/element/marquee/index.html
@@ -0,0 +1,208 @@
+---
+title: <marquee>
+slug: Web/HTML/Element/marquee
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+  - etiqueta
+  - marquee
+  - marquesina
+  - obsoleta
+translation_of: Web/HTML/Element/marquee
+original_slug: Web/HTML/Elemento/marquee
+---
+<div>{{HTMLRef}}</div>
+
+<div>{{obsolete_header}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La etiqueta html <code>&lt;marquee&gt;</code> se utiliza para insertar un area de texto en movimiento. También se la conoce como marquesina.</p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<dl>
+ <dt>{{htmlattrdef("behavior")}}</dt>
+ <dd>Establece cómo se desplazará el texto en la etiqueta marquee. Los valores posibles son scroll, slide, y alternate. Si no hay un valor especificado, el valor por defecto establecido es scroll.</dd>
+ <dd>Scroll: Hara que lo que este en la marquesina se mueva de derecha a izquierda, de manera ininterrumpida.<br>
+ Slide: Una vez que completa el recorrido de derecha a izquierda(por defecto) se detiene.<br>
+ Alternate: Se movera de una esquina a la otra, dando el efecto de rebote.</dd>
+ <dt>{{htmlattrdef("bgcolor")}}</dt>
+ <dd>Establece el color de fondo, puede utilizarse el nombre, o su  valor hexadecimal.</dd>
+ <dt>{{htmlattrdef("direction")}}</dt>
+ <dd>Establece la dirección en la que el texto contenido se desplazará. Los valores posibles son left (para moverse hacia la izquierda), right (para moverse a la derecha), up (hacia arriba) y down (hacia abajo). Si no se especifica un valor, por defecto será left.</dd>
+ <dt>{{htmlattrdef("height")}}</dt>
+ <dd>Establece la altura de la etiqueta en pixeles, o en un valor porcentual.</dd>
+ <dt>{{htmlattrdef("hspace")}}</dt>
+ <dd>Establece el margen horizontal.</dd>
+ <dt>{{htmlattrdef("loop")}}</dt>
+ <dd>Establece el número de veces que la marquesina realizará el desplazamiento. Sino se especifica esta propiedad, por defecto es -1, lo que quiere decir que la marquesina se desplazará continuamente.</dd>
+ <dt>{{htmlattrdef("scrollamount")}}</dt>
+ <dd>Establece el valor de movimiento para cada intervalo en pixeles. Por defecto su valor es 6.</dd>
+ <dt>{{htmlattrdef("scrolldelay")}}</dt>
+ <dd>Establece el intervalo entre cada desplazamiento, en milisegundos. El valor por defecto es 85. Nota: Cualquier valor inferior a 60 será ignorado, (puesto que el valor minimo es 60) y se establecerá 60 en su lugar. Salvo que se especifique<code> truespeed.</code></dd>
+ <dt>{{htmlattrdef("truespeed")}}</dt>
+ <dd>Por defecto, si los valores de <code>scrolldelay son inferiores a 60 serán ignorados. Pero si truespeed está presente, esos valores inferiores a 60 serán aceptados.</code></dd>
+ <dt>{{htmlattrdef("vspace")}}</dt>
+ <dd>Establece el margen vertical en pixeles o en un valor porcentual.</dd>
+ <dt>{{htmlattrdef("width")}}</dt>
+ <dd>Establece el ancho de la etiqueta en pixeles o un valor porcentual.</dd>
+</dl>
+
+<h2 id="Event_handlers" name="Event_handlers">Controladores de eventos</h2>
+
+<dl>
+ <dt>{{htmlattrdef("onbounce")}}</dt>
+ <dd>Este evento se lanza cuando la marquesina llegó al final del desplazamiento. Ésto solo se activa cuando el atributo <code>behavior </code>está establecido en <code>alternate</code>.</dd>
+ <dt>{{htmlattrdef("onfinish")}}</dt>
+ <dd>Este evento se lanza cuando la marquesina repitió el desplazamiento la cantidad de veces establecidas en el atributo <code>loop</code>. El evento se lanza solo si el atributo <code>loop</code> tiene un valor mayor a 0.</dd>
+ <dt>{{htmlattrdef("onstart")}}</dt>
+ <dd>Este evento se lanza cuando la marquesina comienza su desplazamiento.</dd>
+</dl>
+
+<h2 id="Methods" name="Methods">Métodos</h2>
+
+<dl>
+ <dt>start</dt>
+ <dd>Comienza el desplazamiento de la marquesina.</dd>
+ <dt>stop</dt>
+ <dd>Para el desplazamiento de la marquesina</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;marquee&gt;Este texto se mueve de derecha a izquierda&lt;/marquee&gt;
+
+&lt;marquee direction="up"&gt;Este texto se mueve de abajo hacia arriba&lt;/marquee&gt;
+
+&lt;marquee direction="down" width="250" height="200" behavior="alternate" style="border:solid"&gt;
+  &lt;marquee behavior="alternate"&gt;
+    Este texto rebotará dentro de la marquesina.
+  &lt;/marquee&gt;
+&lt;/marquee&gt;</pre>
+
+<p>{{EmbedLiveSample("Examples", 600, 450)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'obsolete.html#the-marquee-element-2', '&lt;marquee&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Marcada como obsoleta en favor de CSS. Comportamiento esperado definido por razones de retrocompatibilidad.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'obsolete.html#the-marquee-element-0', '&lt;marquee&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Marcada como obsoleta en favor de CSS. Comportamiento esperado definido por razones de retrocompatibilidad.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>2.0</td>
+   <td>7.2</td>
+   <td>1.2</td>
+  </tr>
+  <tr>
+   <td><code>atributo truespeed</code> </td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>4.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>atributos hspace/vspace</code> </td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>atributo loop</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>Atributo truespeed</code> </td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>Atributo hspace/vspace</code> </td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>Atributo loop</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/html/element/menu/index.html b/files/es/web/html/element/menu/index.html
new file mode 100644
index 0000000000..7ec8bba71e
--- /dev/null
+++ b/files/es/web/html/element/menu/index.html
@@ -0,0 +1,131 @@
+---
+title: menu
+slug: Web/HTML/Element/menu
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/menu
+original_slug: Web/HTML/Elemento/menu
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <code style="color: darkblue;">menu</code> (directorio) es un elemento desaprobado. En su origen fue pensado para crear menús, en la actualidad es inutil.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;menu&gt; y &lt;/menu&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">Elemento DESAPROBADO</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
+ <dd><strong>NO puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">Elementos en bloque</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">compact</code></td>
+   <td>compact</td>
+   <td>implícito</td>
+   <td>espacio entre objetos reducido</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre class="eval"> &lt;menu&gt;
+  &lt;li&gt;primer elemento &lt;/li&gt;
+  &lt;li&gt;segundo elemento &lt;/li&gt;
+  &lt;li&gt;tercer elemento &lt;/li&gt;
+ &lt;/menu&gt;
+</pre>
+
+<div class="highlight">
+<p>Se visualiza así:</p>
+
+<ul>
+ <li>primer elemento</li>
+ <li>segundo elemento</li>
+ <li>tercer elemento</li>
+</ul>
+</div>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p>En el navegador se visualiza (o deberia) igual que una lista desordenada (<a href="es/HTML/Elemento/ul">ul</a>)</p>
diff --git a/files/es/web/html/element/meta/index.html b/files/es/web/html/element/meta/index.html
new file mode 100644
index 0000000000..f7352721e5
--- /dev/null
+++ b/files/es/web/html/element/meta/index.html
@@ -0,0 +1,135 @@
+---
+title: meta
+slug: Web/HTML/Element/meta
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/meta
+original_slug: Web/HTML/Elemento/meta
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>meta</strong> de "metainformation" - metainformación. Sirve para aportar información sobre el documento..</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;meta&gt;</code> (solo tiene una).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#de_cabecera">de cabecera</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: No.</dd>
+ <dd><strong>Puede contener</strong>: Nada.</dd>
+ <dd><strong>Puede ser contenido por</strong>: Elementos <a href="es/HTML/Elemento/head">head</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<p><del>Por defecto</del>: Debe indicarlo el autor.</p>
+
+<p><span class="comment">name = name {{ mediawiki.external('CS') }} Este atributo identifica un nombre de propiedad. Esta especificación no enumera los valores legales para este atributo. content = cdata {{ mediawiki.external('CS') }} Este atributo especifica el valor de una propiedad. Esta especificación no enumera los valores legales para este atributo. scheme = cdata {{ mediawiki.external('CS') }} Este atributo especifica un esquema que se usará para interpretar el valor de la propiedad (véase la sección sobre perfiles para más detalles). http-equiv = name {{ mediawiki.external('CI') }} Este atributo puede utilizarse en lugar del atributo name. Los servidores HTTP utilizan este atributo para obtener información sobre los encabezados del mensaje de respuesta HTTP.</span></p>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-name-META"><span style="color: green;">name </span></a></td>
+   <td>Nombre al que se asocia la metainformación</td>
+   <td>Un 'nombre'. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-content"><span style="color: green;">content </span></a></td>
+   <td>Los datos que se quieren asociar a <code style="color: green;">name</code>.</td>
+   <td>Texto. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-http-equiv"><span style="color: green;">http-equiv </span></a></td>
+   <td>Aporta información sobre los encabezado de respuesta HTTP, puede usarse en lugar de <code style="color: green;">name</code>.</td>
+   <td>Un 'nombre'. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-scheme"><span style="color: green;">scheme </span></a></td>
+   <td>Indica un esquema de interpretación para los metadatos.</td>
+   <td>Texto. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Con_name_y_content" name="Con_name_y_content">Con name y content</h4>
+
+<pre class="eval">&lt;m<strong>eta</strong> name="copyright" content="© 2006 MDC"&gt;
+</pre>
+
+<h4 id="Con_http-equiv" name="Con_http-equiv">Con http-equiv</h4>
+
+<pre class="eval">&lt;<strong>meta</strong> http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
+</pre>
+
+<p> </p>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#edef-META"><strong>meta</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-meta">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/multicol/index.html b/files/es/web/html/element/multicol/index.html
new file mode 100644
index 0000000000..a72b10be86
--- /dev/null
+++ b/files/es/web/html/element/multicol/index.html
@@ -0,0 +1,21 @@
+---
+title: <multicol>
+slug: Web/HTML/Element/multicol
+tags:
+  - HTML
+translation_of: Web/HTML/Element/multicol
+original_slug: Web/HTML/Elemento/multicol
+---
+<div>{{non-standard_header}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento HTML <code>&lt;multicol&gt; </code>fue un elemento experimental diseñado para permitir diseños multi columna . Nunca tuvo una recepción significante y no es implementado en alguno de los principales exploradores .</p>
+
+<div class="note">
+<p><strong>No usar esto ! </strong>Para implementar un diseño multi columna , debería de usar los elementos HTML regulares como {{HTMLElement("div")}} en conjunto con la característica de CSS <a href="/es/docs/Columnas_con_CSS-3">Column</a> ,</p>
+</div>
+
+<p>Notar que hasta Firefox 22 , aunque no se soportaba , un elemento <code>&lt;multicol&gt; </code>fue asociado con un {{domxref("HTMLSpanElement")}}.  Después fue arreglado y ahora esta asociado con un {{domxref("HTMLUnknownElement")}} como se solocita en la especificación .</p>
+
+<p> </p>
diff --git a/files/es/web/html/element/nav/index.html b/files/es/web/html/element/nav/index.html
new file mode 100644
index 0000000000..699121fe8a
--- /dev/null
+++ b/files/es/web/html/element/nav/index.html
@@ -0,0 +1,109 @@
+---
+title: '<nav>: El elemento de sección de navegación'
+slug: Web/HTML/Element/nav
+tags:
+  - Elemento
+  - HTML5
+  - menu
+  - nav
+  - navegación
+  - programacion
+  - sección
+translation_of: Web/HTML/Element/nav
+original_slug: Web/HTML/Elemento/nav
+---
+<p>{{HTMLRef}}</p>
+
+<p>El <strong>elemento</strong> <strong>HTML <code>&lt;nav&gt;</code> </strong>representa una sección de una página cuyo propósito es proporcionar enlaces de navegación, ya sea dentro del documento actual o a otros documentos. Ejemplos comunes de secciones de navegación son menús, tablas de contenido e índices.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Content categories</a></th>
+   <td><a href="/es/docs/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Sectioning_content">sectioning content</a>, palpable content.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Flow content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padres permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Flow_content">flow content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>Ninguno</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento sólo incluye <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<ul>
+ <li>No es necesario que todos los enlaces estén contenidos en un elemento <code>&lt;nav&gt;</code>. <code>&lt;nav&gt;</code> está destinado sólo para el bloque principal de enlaces de navegación; por lo general, el elemento {{HTMLElement("footer")}} a menudo tiene una lista de enlaces que no necesitan estar en un elemento {{HTMLElement("nav")}}.</li>
+ <li>Un documento puede tener varios elementos {{HTMLElement("nav")}}, por ejemplo, uno para la navegación del sitio y otro para la navegación dentro de la página. <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a></code> puede ser utilizado en tal caso para promover la accesibilidad, ver <a href="/en-US/docs/Web/HTML/Element/Heading_Elements#Labeling_section_content">ejemplo</a>.</li>
+ <li>Los agentes de usuario, como los lectores de pantalla dirigidos a usuarios con discapacidades, pueden usar este elemento para determinar si se omite la representación inicial del contenido de solo navegación.</li>
+</ul>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>En este ejemplo, un bloque <code>&lt;nav&gt;</code>  es usado para contener una lista no ordenada ({{HTMLElement("ul")}}) de enlaces. Con el CSS apropiado, esto puede ser presentado como una barra lateral, una barra de navegación o un menú desplegable.</p>
+
+<pre class="brush: html notranslate">&lt;nav class="menu"&gt;
+  &lt;ul&gt;
+    &lt;li&gt;&lt;a href="#"&gt;Inicio&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="#"&gt;Sobre nosotros&lt;/a&gt;&lt;/li&gt;
+    &lt;li&gt;&lt;a href="#"&gt;Contacto&lt;/a&gt;&lt;/li&gt;
+  &lt;/ul&gt;
+&lt;/nav&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'sections.html#the-nav-element', '&lt;nav&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambios desde la última instantánea del W3C</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'sections.html#the-nav-element', '&lt;nav&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, visite <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de extracción.</div>
+
+<p>{{Compat("html.elements.nav")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Otros elementos relacionados con la sección: {{HTMLElement("body")}}, {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("address")}};</li>
+ <li class="last"><a class="deki-ns current" href="/es/docs/Sections_and_Outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">Secciones y esquema de un documento HTML5 </a>.</li>
+ <li class="last"><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Navigation_Role">ARIA: Rol de navegación</a></li>
+</ul>
diff --git a/files/es/web/html/element/nobr/index.html b/files/es/web/html/element/nobr/index.html
new file mode 100644
index 0000000000..544f1f3ea2
--- /dev/null
+++ b/files/es/web/html/element/nobr/index.html
@@ -0,0 +1,30 @@
+---
+title: <nobr>
+slug: Web/HTML/Element/nobr
+tags:
+  - Elemento
+  - HTML
+  - No-estándar
+  - Obsoleto
+  - Referencia
+  - Web
+  - nobr
+translation_of: Web/HTML/Element/nobr
+original_slug: Web/HTML/Elemento/nobr
+---
+<div>{{non-standard_header}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p><span class="seoSummary">El elemento HTML <code>&lt;nobr&gt;</code> previene que una línea de texto se divida en una nueva línea, así, se presentará en una línea larga por lo que puede ser necesario hacer un desplazamiento de pantalla. Esta etiqueta no es un estándar HTML y no debería ser usada, en su lugar use la propiedad CSS </span>{{Cssxref("white-space")}} como en este ejemplo:</p>
+
+<pre class="brush:css">&lt;span style="white-space: nowrap"&gt;Línea larga sin saltos&lt;/span&gt;</pre>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li>{{Cssxref("white-space")}}</li>
+ <li>{{Cssxref("overflow")}}</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/noframes/index.html b/files/es/web/html/element/noframes/index.html
new file mode 100644
index 0000000000..bde1f1b8e2
--- /dev/null
+++ b/files/es/web/html/element/noframes/index.html
@@ -0,0 +1,144 @@
+---
+title: noframes
+slug: Web/HTML/Element/noframes
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/noframes
+original_slug: Web/HTML/Elemento/noframes
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>noframes</strong> de -<em>sin marcos</em> . Aporta contenidos alternativos a los marcos. Las aplicaciones de usuario que no soporten <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html">marcos</a>, o que estén configuradas para no mostrarlos, deben mostrar en su lugar el contenido de este elemento.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;noframes&gt;</code> y <code>&lt;/noframes&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: En un doctype transicional está definido como elemento <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: en bloque.</dd>
+ <dd>En un documento transicional <strong>puede contener</strong>: texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> o <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
+ <dd>En un documento de marcos <strong>puede y debe contener</strong>: Un elementos <a href="es/HTML/Elemento/body">body</a> y no puede contener <a href="es/HTML/Elemento/noframes">noframes</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_frameset_y_su_alternativa" name="Un_frameset_y_su_alternativa">Un frameset y su alternativa</h4>
+
+<pre class="eval">&lt;frameset cols="20%, 80%"&gt;
+
+ &lt;frame src="menu.html"&gt;
+ &lt;frame src="capitulo1.html"&gt;
+
+ &lt;<strong>noframes</strong>&gt;
+     &lt;p&gt; Esta guia se compone de los siguientes capítulos: &lt;/p&gt;
+     &lt;ul&gt;
+        &lt;li&gt; &lt;a href="capitulo1.html"&gt; Introducción &lt;/a&gt; &lt;/li&gt;
+        &lt;li&gt; &lt;a href="capitulo2.html"&gt; Desarrollo &lt;/a&gt; &lt;/li&gt;
+        &lt;li&gt; &lt;a href="capitulo3.html"&gt; Conclusión &lt;/a&gt; &lt;/li&gt;
+     &lt;/ul&gt;
+ &lt;/<strong>noframes</strong>&gt;
+
+&lt;/frameset&gt;
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-NOFRAMES"><strong>noframes</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-noframes">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/noscript/index.html b/files/es/web/html/element/noscript/index.html
new file mode 100644
index 0000000000..4050e4644b
--- /dev/null
+++ b/files/es/web/html/element/noscript/index.html
@@ -0,0 +1,139 @@
+---
+title: noscript
+slug: Web/HTML/Element/noscript
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/noscript
+original_slug: Web/HTML/Elemento/noscript
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>noscript</strong> de -<em>no script</em> . Aporta contenidos alternativos al elemento <a href="es/HTML/Elemento/script">script</a>. las aplicaciones de usuario que no soporten scripts deben mostrar en su lugar el contenido de este elemento.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;noscript&gt;</code> y <code>&lt;/noscript&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: en bloque.</dd>
+ <dd><strong>Puede (y debe) contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.
+ <dl>
+  <dd>Con un doctype transicional puede contener cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Un_script_y_su_alternativa" name="Un_script_y_su_alternativa">Un script y su alternativa</h4>
+
+<pre class="eval">&lt;script type="text/javascript"&gt;
+ Aquí un script que genera un listado
+&lt;/script&gt;
+
+&lt;<strong>noscript</strong>&gt;
+&lt;p&gt; Aquí un enlace a un &lt;a href="/datos/listado.html"&gt;listado&lt;/a&gt; alternativo &lt;/p&gt;
+&lt;/<strong>noscript</strong>&gt;
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#edef-NOSCRIPT"><strong>noscript</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-noscript">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/object/index.html b/files/es/web/html/element/object/index.html
new file mode 100644
index 0000000000..bda7514c0f
--- /dev/null
+++ b/files/es/web/html/element/object/index.html
@@ -0,0 +1,145 @@
+---
+title: <object>
+slug: Web/HTML/Element/object
+tags:
+  - Contenido incrustado
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+  - incrustar
+translation_of: Web/HTML/Element/object
+original_slug: Web/HTML/Elemento/object
+---
+<p>{{HTMLRef}}</p>
+
+<p>El <strong>elemento HTML <code>&lt;object&gt;</code> </strong> representa un recurso externo, que puede ser tratado como una imagen, un contexto de navegación anidado, o como un recurso que debe ser manejado por un plugin.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/object.html", "tabbed-standard")}}</div>
+
+<p class="hidden">La fuente original de este ejemplo interactivo está almacenada en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíanos un pull request.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>; <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>; <a href="/en-US/docs/Web/HTML/Content_categories#Embedded_content">embedded content</a>, palpable content; if the element has a {{htmlattrxref("usemap","object")}} attribute, <a href="/en-US/docs/Web/HTML/Content_categories#Interactive_content">interactive content</a>; <a href="/en-US/docs/Web/HTML/Content_categories#Form_listed">listed</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Form_submittable">submittable</a> <a href="/en-US/docs/Web/HTML/Content_categories#Form-associated_content">form-associated</a> element.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>cero o más elementos {{HTMLElement("param")}} , luego <a href="/en-US/docs/Web/HTML/Content_categories#Transparent_content_model">transparent</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Tag omission</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Embedded_content">embedded content</a> (contenido incrustado).</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted ARIA roles</th>
+   <td>{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("image")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLObjectElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</p>
+
+<dl>
+ <dt>{{HTMLAttrDef("archive")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>Una lista separada por espacios de las URl's de archivos o recursos para el objeto.</dd>
+ <dt>{{HTMLAttrDef("border")}}{{Deprecated_Inline("HTML4.01")}}{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>El grosor de una línea de margen alrededor del control, en pixeles.</dd>
+ <dt>{{HTMLAttrDef("classid")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>The URI of the object's implementation. It can be used together with, or in place of, the <strong>data</strong> attribute.</dd>
+ <dt>{{HTMLAttrDef("codebase")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>The base path used to resolve relative URIs specified by <strong>classid</strong>, <strong>data</strong>, or <strong>archive</strong>. If not specified, the default is the base URI of the current document.</dd>
+ <dt>{{HTMLAttrDef("codetype")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>The content type of the data specified by <strong>classid</strong>.</dd>
+ <dt>{{HTMLAttrDef("data")}}</dt>
+ <dd>La dirección de la fuente, escrita como una URL válida. Al menos uno de los dos atributos, <strong>data</strong> o <strong>type</strong>, deben estar definidos. </dd>
+ <dt>{{HTMLAttrDef("declare")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>The presence of this Boolean attribute makes this element a declaration only. The object must be instantiated by a subsequent <code>&lt;object&gt;</code> element. In HTML5, repeat the &lt;object&gt; element completely each that that the resource is reused.</dd>
+ <dt>{{HTMLAttrDef("form")}}{{HTMLVersionInline(5)}}</dt>
+ <dd>El elemento form, si es que hay alguno, al que el objeto está asociado (su <em>form propietario</em>). El valor de este atributo debe ser el ID de un elemento {{HTMLElement("form")}} del mismo documento.</dd>
+ <dt>{{HTMLAttrDef("height")}}</dt>
+ <dd>La altura del recurso mostrado, en <a href="https://drafts.csswg.org/css-values/#px">CSS pixels</a>. -- (Valores absolutos unicamente. <a href="https://html.spec.whatwg.org/multipage/embedded-content.html#dimension-attributes">NO percentages</a>)</dd>
+ <dt>{{HTMLAttrDef("name")}}</dt>
+ <dd>El nombre de un contexto de navegación válido (HTML5), o el nombre del control (HTML4).</dd>
+ <dt>{{HTMLAttrDef("standby")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>A message that the browser can show while loading the object's implementation and data.</dd>
+ <dt>{{HTMLAttrDef("tabindex")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
+ <dd>The position of the element in the tabbing navigation order for the current document.</dd>
+ <dt>{{HTMLAttrDef("type")}}</dt>
+ <dd>El <a href="/en-US/docs/Glossary/Content_type">content type</a>  del recurso especificado mediante <strong>data</strong>. Al menos uno de los dos atributos, <strong>data</strong> o <strong>type</strong>, deben estar definidos. </dd>
+ <dt>{{HTMLAttrDef("typemustmatch")}}{{HTMLVersionInline(5)}}</dt>
+ <dd>Este valor booleano indica si el atributo <strong>type</strong> y el <a href="/en-US/docs/Glossary/Content_type">content type</a> real del recurso deben coincidir para porder ser usados.</dd>
+ <dt>{{HTMLAttrDef("usemap")}}</dt>
+ <dd>Una refercia hash-name a un elemento <span style="font-size: 1rem; letter-spacing: -0.00278rem;">{{HTMLElement("map")}}; es decir un '#' seguido del valor de un {{htmlattrxref("name", "map")}} de un elemento map.</span></dd>
+ <dt>{{HTMLAttrDef("width")}}</dt>
+ <dd>El ancho del recurso mostrado, en  <a href="https://drafts.csswg.org/css-values/#px">CSS pixels</a>. -- (Valores absolutos unicamente. <a href="https://html.spec.whatwg.org/multipage/embedded-content.html#dimension-attributes">NO percentages</a>)</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Incrustar_una_película_flash">Incrustar una película flash</h3>
+
+<pre class="brush: html">&lt;!-- Incrustar una película flash --&gt;
+&lt;object data="movie.swf"
+  type="application/x-shockwave-flash"&gt;&lt;/object&gt;
+
+&lt;!-- Incrustar una película flash con parámetros --&gt;
+&lt;object data="movie.swf" type="application/x-shockwave-flash"&gt;
+  &lt;param name="foo" value="bar"&gt;
+&lt;/object&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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("HTML WHATWG", "embedded-content.html#the-object-element", "&lt;object&gt;")}}</td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "embedded-content-0.html#the-object-element", "&lt;object&gt;")}}</td>
+   <td>{{Spec2("HTML5 W3C")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML4.01", "struct/objects.html#h-13.3", "&lt;object&gt;")}}</td>
+   <td>{{Spec2("HTML4.01")}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.object")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{HTMLElement("applet")}} {{Obsolete_Inline}}</li>
+ <li>{{HTMLElement("embed")}}</li>
+ <li>{{HTMLElement("param")}}</li>
+</ul>
diff --git a/files/es/web/html/element/ol/index.html b/files/es/web/html/element/ol/index.html
new file mode 100644
index 0000000000..2678c91eb9
--- /dev/null
+++ b/files/es/web/html/element/ol/index.html
@@ -0,0 +1,133 @@
+---
+title: ol
+slug: Web/HTML/Element/ol
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/ol
+original_slug: Web/HTML/Elemento/ol
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <code style="color: darkblue;">ol</code> permite definir listas o viñetas ordenadas (“Ordered List”), bien con numeración o alfabéticamente.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;ol&gt; y &lt;/ol&gt; (ambas obligatorias).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_lista">Elemento de lista</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th colspan="4">Genericos</th>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td></td>
+   <td></td>
+   <td>título del elemento</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td></td>
+   <td></td>
+   <td>información de estilo en línea</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td></td>
+   <td></td>
+   <td>identificador a nivel de documento</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td></td>
+   <td></td>
+   <td>identificador a nivel de documento</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td></td>
+   <td></td>
+   <td>dirección del texto</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td></td>
+   <td></td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">de transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">type</code></td>
+   <td>(1|a|A|i|I)</td>
+   <td>implícito</td>
+   <td>estilo de numeración</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">compact</code></td>
+   <td>compact</td>
+   <td>implícito</td>
+   <td>espacio entre objetos reducido</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">start</code></td>
+   <td>'un número'</td>
+   <td>implícito</td>
+   <td>número inicial de la secuencia</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre class="eval">&lt;ol&gt;
+ &lt;li&gt;punto uno&lt;/li&gt;
+ &lt;li&gt;punto dos&lt;/li&gt;
+ &lt;li&gt;punto tres&lt;/li&gt;
+&lt;/ol&gt;
+</pre>
+
+<div class="highlight">
+<p>Se visualiza así:</p>
+
+<ol>
+ <li>punto uno</li>
+ <li>punto dos</li>
+ <li>punto tres</li>
+</ol>
+</div>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/element/option/index.html b/files/es/web/html/element/option/index.html
new file mode 100644
index 0000000000..dd015d7b41
--- /dev/null
+++ b/files/es/web/html/element/option/index.html
@@ -0,0 +1,151 @@
+---
+title: <option>
+slug: Web/HTML/Element/option
+tags:
+  - Elemento
+  - Formulários HTML
+  - Referencia
+  - Web
+  - formulários
+  - htmls
+translation_of: Web/HTML/Element/option
+original_slug: Web/HTML/Elemento/option
+---
+<div>{{HTMLRef}}</div>
+
+<p>En un formulario Web , el <strong>elemento</strong> <strong>HTML<em> </em><code>&lt;option&gt;</code><em>  </em></strong>se usa para representar un item dentro de un {{HTMLElement("select")}}, un  {{HTMLElement("optgroup")}} o un  elemento HTML5 {{HTMLElement("datalist")}} .</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Contenido de las categorías</a></th>
+   <td>Ninguna</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Texto con,  eventualmente, caracteres especiales (como <code>&amp;eacute;</code>).</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>La etiqueta de inicio es obligatoria. La etiqueta de finalización es opcional siempre que el elemento esté inmediatamente seguido por otro elemento<code> &lt;option&gt;</code> , por un {{HTMLElement("optgroup")}}, o si el elemento padre tiene no tiene más contenido</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td> {{HTMLElement("select")}}, o {{HTMLElement("optgroup")}} o un elemento {{HTMLElement("datalist")}} element.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLOptionElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento posee los  <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("disabled")}}</dt>
+ <dd>Si está establecido el elemento no se puede seleccionar. A menudo los navegadores ponen en gris el elemento y de esa manera no recibirá ningún evento de navegación como clicks de ratón o eventos relacionados con la obtención del foco. Si este atributo no está definido el elemento puede ser aún deshabilitado si uno de sus ancestros es un elemento {{HTMLElement("optgroup")}} deshabilitado.</dd>
+ <dt>{{htmlattrdef("label")}}</dt>
+ <dd>Este atributo es el texto para la etiqueta que determina el significado de la opción. Si el atributo <code><strong>label</strong></code> no está definidio su valor será el texto del contenido del elemento
+ <div class="note"><em>Nota de Uso:  </em>El atributo <strong>label</strong> está diseñado para contener una etiqueta corta que se usará típicamente en un menú jerárquico. El <strong><code>atributo value</code></strong> describe una etiqueta más larga para ser usada, por ejemplo, cerca de un radio button</div>
+ </dd>
+ <dt>{{htmlattrdef("selected")}}</dt>
+ <dd>Si está presente, este atributo booleano indica si esta opción es la inicialmente seleccionada. Si el elemento <code>&lt;option&gt; es descendiente de un elemento </code>{{HTMLElement("select")}} cuyo  atributo {{htmlattrxref("multiple", "select")}}  no esté definidio únicamente un sólo  <code>&lt;option&gt;</code> de este elemento  {{HTMLElement("select")}} puede tener este atributo <strong>selected</strong> attribute.</dd>
+ <dt>{{htmlattrdef("value")}}</dt>
+ <dd>El contenido de este atributo representa el valor que será enviado al enviar el formulario si una determinada opción está seleccionada. Si se omite el atributo el valor  se tomará del texto del contenido del elemento option.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Ver los ejemplos {{HTMLElement("select")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'the-button-element.html#the-option-element', '&lt;option&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-option-element', '&lt;option&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.6', '&lt;option&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>
+    <p>Definición inicial</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] Gecko no muestra el valor del atributo label como texto de la opción en caso de que el contenido del elemento esté vacío. Ver {{bug("1205213")}}.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Otro elemento relacionados con formularios: {{HTMLElement("form")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("button")}}, {{HTMLElement("select")}}, {{HTMLElement("datalist")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("input")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
+</ul>
diff --git a/files/es/web/html/element/p/index.html b/files/es/web/html/element/p/index.html
new file mode 100644
index 0000000000..d61432122b
--- /dev/null
+++ b/files/es/web/html/element/p/index.html
@@ -0,0 +1,132 @@
+---
+title: p
+slug: Web/HTML/Element/p
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/p
+original_slug: Web/HTML/Elemento/p
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <a href="es/HTML/Elemento/p">p</a> (párrafo) es el apropiado para distribuir el texto en párrafos.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;p&gt; y &lt;/p&gt; (la de cierre es opcional).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>lista de clases separadas por espacios</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>uno de los siguientes:"ltr" o "rtl"</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">align</code></td>
+   <td>uno de los siguientes: "left", "center", "right", o "justify"</td>
+   <td>implícito</td>
+   <td>Indica la alineación horizontal con relación al contexto</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre>&lt;p&gt;
+Esto
+es un
+párrafo
+&lt;/p&gt;
+
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-P">En la especificación del estándar</a></li>
+</ul>
+
+<p> </p>
+
+<div class="note">
+<p>¡Estamos en obras!... disculpen las molestias.<br>
+ Este documento está siendo editado, posiblemente contenga carencias y defectos.</p>
+
+<p>¿Quieres participar en la elaboración de este documento? Para más información sobre como ayudar o como empezar a hacerlo, consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p> </p>
diff --git a/files/es/web/html/element/param/index.html b/files/es/web/html/element/param/index.html
new file mode 100644
index 0000000000..320ff230ec
--- /dev/null
+++ b/files/es/web/html/element/param/index.html
@@ -0,0 +1,132 @@
+---
+title: param
+slug: Web/HTML/Element/param
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/param
+original_slug: Web/HTML/Elemento/param
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>param</strong> de "parameter" = parámetro. Permite especificar parámetros de ejecución para un objeto.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;param&gt;</code> (solo tiene una).</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: No.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: .</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: Nada.
+
+ <dl>
+  <dd><strong>Puede ser contenido por</strong>: El elemento <a href="es/HTML/Elemento/object">object</a>, y el desaprobado <a href="es/HTML/Elemento/applet">applet</a>.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-name-PARAM"><span style="color: green;">name </span></a></td>
+   <td>Referencia un nombre de parámetro de ejecución conocido por el objeto insertado.</td>
+   <td>Un nombre de parámetro de ejecución. Puede ser sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> (o no). <s>Por defecto</s>: Debe indicarlo el autor.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-value-PARAM"><span style="color: green;">value </span></a></td>
+   <td>Especifica un valor para el parámetro referenciado por name</td>
+   <td>Los valores de este atributo dependen del objeto a insertar</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-valuetype"><span style="color: green;">valuetype </span></a></td>
+   <td>especifica el tipo de atributo value.</td>
+   <td>Uno de los siguientes: <code>'data', 'ref' o 'object'</code>. Por defecto: <code>'data'</code>.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-type-PARAM"><span style="color: green;">type </span></a></td>
+   <td>Si el <code>valuetype</code> es 'ref', <code>type</code> sirve para indicar el tipo MIME del recurso referenciado.</td>
+   <td>Un tipo MIME. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="bla_bla" name="bla_bla">bla bla</h4>
+
+<pre class="eval"><span class="nowiki">
+
+ </span>
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#h-13.3.2."><strong>param</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-param">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/picture/index.html b/files/es/web/html/element/picture/index.html
new file mode 100644
index 0000000000..df678137e4
--- /dev/null
+++ b/files/es/web/html/element/picture/index.html
@@ -0,0 +1,162 @@
+---
+title: <picture>
+slug: Web/HTML/Element/picture
+tags:
+  - Elemento
+  - Fotografía
+  - Imagen
+  - graficos
+translation_of: Web/HTML/Element/picture
+original_slug: Web/HTML/Elemento/picture
+---
+<div>{{HTMLRef}}{{SeeCompatTable}}</div>
+
+<p>El <strong>elemento HTML <code>&lt;picture&gt;</code> </strong>es un contenedor usado para especificar múltiples elementos {{HTMLElement("source")}} y un elemento {{HTMLElement("img")}} contenido en él para proveer versiones de una imagen para diferentes escenarios de dispositivos. Si no hay coincidencias con los elementos <code>&lt;source&gt;</code>, el archivo especificado en los atributos {{htmlattrxref("src", "img")}} del elemento <code>&lt;img&gt;</code> es utilizado. La imagen seleccionada es entonces presentada en el espacio ocupado por el elemento <code>&lt;img&gt;</code>.</p>
+
+<p>Para seleccionar la imagen óptima, el {{Glossary("user agent")}} examina cada atributo {{htmlattrxref("srcset", "source")}}, {{htmlattrxref("media", "source")}}, y {{htmlattrxref("type", "source")}} de la fuente para seleccionar la imagen compatible.</p>
+
+<p>El navegador escogerá la fuente más apropiada de acuerdo al diseño de la página (las limitaciones de la caja donde aparecerá la imagen) y el dispositivo que se utilize para visualizarla (p.ej. pantalla normal o hiDPI).</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/es-ES/docs/Web/HTML/Content_categories">Categorías de contenido</a></th>
+   <td><a href="/es-ES/docs/Web/HTML/Content_categories#flow_content">Flujo de contenido</a>, contenido textual o estático, contenido incrustado</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Cero o más elementos {{HTMLElement("source")}}, seguidos por un elemento {{HTMLElement("img")}}, mezclados opcionalmente con elementos script-supporting.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>Cualquier elemento que permita embeber contenido.</td>
+  </tr>
+  <tr>
+   <th scope="row">ARIA roles permitidos</th>
+   <td>Ninguno.</td>
+  </tr>
+  <tr>
+   <th scope="row">DOM interface</th>
+   <td>{{domxref("HTMLPictureElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento sólo incluye <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales.</a></p>
+
+
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<p>Se puede usar la propiedad {{cssxref("object-position")}} para ajustar la posición de la imagen dentro del marco del elemento, y la propiedad {{cssxref("object-fit")}} para controlar como el tamaño de la imagen se ajusta para adaptarse al marco.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Estos ejemplos demuestran los efectos que tienen diferentes atributos del atributo {{HTMLElement("source")}} en la selección de la imagen a desplegar cuando se usa dentro de <code>&lt;picture&gt;</code>.</p>
+
+<h3 id="El_atributo_media">El atributo <code>media</code></h3>
+
+<p>El atributo <code>media</code> permite especificar una media query que el agente de usuario evaluará para seleccionar un elemento {{HTMLElement("source")}}. Si la media query evalua a <code>false</code>, el elemento {{HTMLElement("source")}} es omitido.</p>
+
+<pre class="brush: html">&lt;picture&gt;
+ &lt;source srcset="mdn-logo-wide.png" media="(min-width: 600px)"&gt;
+ &lt;img src="mdn-logo-narrow.png" alt="MDN"&gt;
+&lt;/picture&gt;
+</pre>
+
+<h3 id="El_atributo_type">El atributo <code>type</code></h3>
+
+<p>El atributo <code>type</code> permite especificar un tipo MIME para los recursos dados en el atributo srcset del elemento {{HTMLElement("source")}}. Si el agente de usuario no soporta dicho tipo, el elemento {{HTMLElement("source")}} es omitido.</p>
+
+<pre class="brush: html">​&lt;picture&gt;
+ &lt;source srcset="mdn-logo.svg" type="image/svg+xml"&gt;
+ &lt;img src="mdn-logo.png" alt="MDN"&gt;
+&lt;/picture&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'embedded-content.html#the-picture-element', '&lt;picture&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>13</td>
+   <td>{{CompatGeckoDesktop("38")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("38")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>iOS 9.3</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Elemento {{HTMLElement("img")}}</li>
+ <li>Elemento {{HTMLElement("source")}}</li>
+ <li>Posicionando y redimensionando la imagen dentro de su marco: {{cssxref("object-position")}} y {{cssxref("object-fit")}}</li>
+</ul>
diff --git a/files/es/web/html/element/pre/index.html b/files/es/web/html/element/pre/index.html
new file mode 100644
index 0000000000..f6c85a7c15
--- /dev/null
+++ b/files/es/web/html/element/pre/index.html
@@ -0,0 +1,129 @@
+---
+title: <pre>
+slug: Web/HTML/Element/pre
+translation_of: Web/HTML/Element/pre
+original_slug: Web/HTML/Elemento/pre
+---
+<h2 id="Sumario">Sumario</h2>
+
+<p>El <strong>Elemento</strong> <strong>HTML &lt;pre&gt;</strong> (o <em>Texto HTML Preformateado</em>) representa texto preformateado. El texto en este elemento típicamente se muestra en una fuente fija, no proporcional, exactamente como es mostrado en el archivo. Los espacios dentro de este elemento también son mostrados como están escritos.</p>
+
+<ul class="htmlelt">
+ <li><dfn><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></dfn> {{todo}}<a href="/en-US/docs/HTML/Content_categories#Flowing_content" title="HTML/Content_categories#Phrasing_content">Flow content</a>, palpable content.</li>
+ <li><dfn>Permitted content</dfn> <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="/en-US/docs/HTML/Content_categories#Phrasing_content">Phrasing content</a>.</li>
+ <li><dfn>Tag omission</dfn> {{no_tag_omission}}</li>
+ <li><dfn>Permitted parent elements</dfn> Any element that accepts <a href="/en-US/docs/HTML/Content_categories#flow_content" title="HTML/Content categories#flow content">flow content</a>.</li>
+ <li><dfn>DOM interface</dfn> {{domxref("HTMLPreElement")}}</li>
+</ul>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento solo incluye los <a href="/en-US/docs/HTML/Global_attributes" title="/en-US/docs/">atributos globales</a>.</span></p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;!-- Un poco de codigo CSS --&gt;
+&lt;pre&gt;
+body{
+  color:  red;
+}
+a   {
+  color:green;
+}
+&lt;/pre&gt;
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<pre>body{
+  color:  red;
+}
+a   {
+  color:green;
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Epecificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'grouping-content.html#the-pre-element', '&lt;pre&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'the-pre-element.html#the-pre-element', '&lt;pre&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'text.html#h-9.3.4', '&lt;dl&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con exploradores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>CSS: {{ Cssxref('white-space') }}, {{ Cssxref('word-break') }}</li>
+</ul>
diff --git a/files/es/web/html/element/progress/index.html b/files/es/web/html/element/progress/index.html
new file mode 100644
index 0000000000..9452e3ecce
--- /dev/null
+++ b/files/es/web/html/element/progress/index.html
@@ -0,0 +1,98 @@
+---
+title: '<progress>: Elemento indicador de progreso'
+slug: Web/HTML/Element/progress
+translation_of: Web/HTML/Element/progress
+original_slug: Web/HTML/Elemento/progress
+---
+<div>{{HTMLRef}}</div>
+
+<p>La etiqueta <strong>HTML<em> </em><code>&lt;progress&gt;</code></strong> se utiliza para visualizar el progreso de una tarea. Aunque los detalles de como se muestran depende directamente del navegador que utiliza el cliente, aunque básicamente aparece una barra de progreso.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/progress.html", "tabbed-standard")}}</div>
+
+<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p>
+
+<ul class="htmlelt">
+ <li><dfn><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Flujo_de_contenido" title="HTML/Content_categories">Categorias de contenido </a></dfn><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Flujo_de_contenido" title="HTML/Content_categories">Flujo de contenido</a><span>, </span><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_de_redacci%C3%B3n">contenido de redacción</a><span style="font-style: normal; line-height: 1.5em;">, contenido etiquetable, contenido palpable.</span></li>
+ <li><dfn>Contenido permitido</dfn> <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Contenido de redacción</a>, pero no debe haber ningún elemento de progreso entre sus descendientes</li>
+ <li><dfn>Etiquetas por omisión</dfn> {{no_tag_omission}}</li>
+ <li><dfn>Elementos padres permitidos</dfn> Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">contenido de redacción</a>.</li>
+ <li><dfn>DOM interfaz</dfn> {{domxref("HTMLProgressElement")}}</li>
+</ul>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento incluye <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" title="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes">Atributos Globales</a></span><span style="line-height: 21px;">.</span></p>
+
+<dl>
+ <dt>{{ htmlattrdef("max") }}</dt>
+ <dd>Este atributo indica la cantidad de trabajo que demorá la carga, se define en el elemento <code>progress</code>. Por ejemplo max="100".</dd>
+ <dt>{{ htmlattrdef("value") }}</dt>
+ <dt></dt>
+ <dd><span style="font-weight: normal; line-height: inherit;">Este atributo indica que parte de la tarea ya se ha completado o cargado. Debe especificarse un valor entre 0  y </span><code style="font-size: 14px; line-height: inherit;">max</code><span style="font-weight: normal; line-height: inherit;">, o entre 0 y 1.0 si </span><code style="font-size: 14px; line-height: inherit;">max</code><span style="font-weight: normal; line-height: inherit;"> está omitido. Si al atributo </span><code style="font-size: 14px; line-height: inherit;">value</code><span style="font-weight: normal; line-height: inherit;"> no se le especifica ningún valor, se estara llevando a cabo la tarea sin que el elemento mueste funcionamiento alguno. Por ejemplo si la carga está al 50% será de 0.5 el valor, en el caso de no especificar max. </span></dd>
+</dl>
+
+<p>Puedes usar la propiedad CSS {{ cssxref("orient") }} permite especificar la orientacion de la barra de progreso (horizontal o vertical) con horizontal por defecto. La pseudo-clase {{ cssxref(":indeterminate") }} se puede utiliza para hacer que coincida con las barras de progreso indeterminadas.</p>
+
+<dl>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html notranslate">&lt;progress value="70" max="100"&gt;70 %&lt;/progress&gt;
+</pre>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{EmbedInteractiveExample("pages/tabbed/progress.html", "tabbed-standard")}}</p>
+
+<p>En Mac OS X, Se vería como esto:</p>
+
+<p><img alt="progress-1.png" class="default internal" src="/@api/deki/files/4946/=progress-1.png"></p>
+
+<p>En Windows, el resultante sería este:</p>
+
+<p><img alt="progress-firefox.JPG" class="default internal" src="/@api/deki/files/6031/=progress-firefox.JPG"></p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'forms.html#the-progress-element', '&lt;progress&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'sec-forms.html#the-progress-element', '&lt;progress&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_los_navegadores">Compatibilidad en los navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.progress")}}</p>
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li>{{htmlelement("meter")}}</li>
+ <li>{{ cssxref(":indeterminate") }}</li>
+ <li>{{ cssxref("-moz-orient") }}</li>
+ <li>{{ cssxref("::-moz-progress-bar") }}</li>
+ <li>{{ cssxref("::-ms-fill") }}</li>
+ <li>{{ cssxref("::-webkit-progress-bar") }}</li>
+ <li>{{ cssxref("::-webkit-progress-value") }}</li>
+ <li>{{ cssxref("::-webkit-progress-inner-element") }}</li>
+</ul>
diff --git a/files/es/web/html/element/q/index.html b/files/es/web/html/element/q/index.html
new file mode 100644
index 0000000000..4c6c59ba68
--- /dev/null
+++ b/files/es/web/html/element/q/index.html
@@ -0,0 +1,122 @@
+---
+title: '<q>: El elemento de cita en línea'
+slug: Web/HTML/Element/q
+tags:
+  - Cita de bloque independiente
+  - Citación
+  - Elemento
+  - HTML
+  - Marca de cita
+  - Q
+  - Referencia
+  - Semántica HTML a nivel de texto
+  - Web
+  - cita
+translation_of: Web/HTML/Element/q
+original_slug: Web/HTML/Elemento/q
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">El <strong>elemento HTML <code>&lt;q&gt;</code></strong> indica que el texto adjunto es una cita corta en línea. La mayoría de los navegadores modernos implementan esto rodeando el texto entre comillas. </span> Este elemento está destinado a citas breves que no requieren saltos de párrafo; para citas de bloque independiente, utiliza el elemento {{HTMLElement("blockquote")}}.</p>
+
+<div>{{ EmbedInteractiveExample("pages/tabbed/q.html", "tabbed-shorter") }}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row">{{web.link("/es/docs/Web/HTML/Content_categories", "Categorías de contenido")}}</th>
+   <td>{{web.link("/es/docs/Web/HTML/Content_categories#Flow_content", "Flujo de contenido")}}, {{web.link("/es/docs/Web/HTML/Content_categories#Phrasing_content", "redacción de contenido")}}, contenido palpable.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>{{web.link("/es/docs/Web/HTML/Content_categories#Phrasing_content", "Redacción de contenido")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres autorizados</th>
+   <td>Cualquier elemento que acepte {{web.link("/es/docs/Web/HTML/Content_categories#Phrasing_content", "redacción de contenido")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Rol de ARIA implícito</th>
+   <td>{{web.link("https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role", "Rol no correspondiente")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>Algunos</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{DOMxRef("HTMLQuoteElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota de uso</strong>: La mayoría de los navegadores modernos automáticamente agregarán comillas alrededor del texto dentro de un elemento <code>&lt;q&gt;</code>. Es posible que se necesite una regla de estilo para agregar comillas en navegadores antiguos.</p>
+</div>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los {{web.link("/es/docs/Web/HTML/Global_attributes", "atributos globales")}}.</p>
+
+<dl>
+ <dt>{{HTMLAttrDef("cite")}}</dt>
+ <dd>El valor de este atributo es una URL que designa un documento o mensaje fuente para la información citada. Este atributo está destinado a señalar información que explica el contexto o la referencia de la cita.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: html notranslate">&lt;p&gt;Conforme al sitio web de Mozilla,
+  &lt;q
+  cite="https://www.mozilla.org/en-US/about/history/details/"&gt;Firefox 1.0
+  fue lanzado en 2004 y se convirtió en un gran éxito.&lt;/q&gt;&lt;/p&gt;
+</pre>
+
+<p>{{EmbedLiveSample('Ejemplo')}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'semantics.html#the-q-element', '&lt;q&gt;') }}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('HTML5 W3C', 'textlevel-semantics.html#the-q-element', '&lt;q&gt;') }}</td>
+   <td>{{ Spec2('HTML5 W3C') }}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('HTML4.01', 'struct/text.html#h-9.2.2', '&lt;q&gt;') }}</td>
+   <td>{{ Spec2('HTML4.01') }}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{ Compat("html.elements.q") }}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>El elemento {{HTMLElement("blockquote")}} para citas de bloque independiente.</li>
+ <li>El elemento {{HTMLElement("cite")}} para citas de fuentes.</li>
+</ul>
diff --git a/files/es/web/html/element/s/index.html b/files/es/web/html/element/s/index.html
new file mode 100644
index 0000000000..ee2366dd98
--- /dev/null
+++ b/files/es/web/html/element/s/index.html
@@ -0,0 +1,115 @@
+---
+title: s
+slug: Web/HTML/Element/s
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/s
+original_slug: Web/HTML/Elemento/s
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Muestra el texto tachado con una linea horizontal.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;s&gt; y &lt;/s&gt; (Ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>:<a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+  <tr>
+   <th colspan="4">Genéricos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">title</code></td>
+   <td>texto</td>
+   <td>implícito</td>
+   <td>título consultivo del elemento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">style</code></td>
+   <td>reglas de estilo</td>
+   <td>implícito</td>
+   <td>información de estilo en línea.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">id</code></td>
+   <td>ID</td>
+   <td>implícito</td>
+   <td>identificador único a nivel de documento.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">class</code></td>
+   <td>CDATA</td>
+   <td>implícito</td>
+   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dir</code></td>
+   <td>(ltr|rtl)</td>
+   <td>implícito</td>
+   <td>dirección del texto débil/neutral</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">lang</code></td>
+   <td>código de idioma</td>
+   <td>implícito</td>
+   <td>información sobre el idioma</td>
+  </tr>
+  <tr>
+   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
+  </tr>
+  <tr>
+   <th colspan="4">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="4">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="4">No tiene</td>
+  </tr>
+  <tr>
+   <th>Atributo</th>
+   <th colspan="2">valor</th>
+   <th>descripción</th>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">  &lt;p&gt;
+       Texto normal y... &lt;s&gt;Texto tachado&lt;/s&gt;
+  &lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<div class="warning">DESAPROBADO</div>
diff --git a/files/es/web/html/element/samp/index.html b/files/es/web/html/element/samp/index.html
new file mode 100644
index 0000000000..7bce89c333
--- /dev/null
+++ b/files/es/web/html/element/samp/index.html
@@ -0,0 +1,64 @@
+---
+title: samp
+slug: Web/HTML/Element/samp
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/samp
+original_slug: Web/HTML/Elemento/samp
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">El elemento HTML Sample (<strong><code>&lt;samp&gt;</code></strong>) se utiliza para incluir texto en línea que representa una muestra (o cita) de la salida de un programa de ordenador. El contenido de esta etiqueta es renderizado generalmente usando la tipografía monoespaciada por defecto del navegador.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/samp.html", "tabbed-shorter")}}</div>
+
+<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Señala lo que es una salida de un programa.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;samp&gt; y &lt;/samp&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
+
+<ul>
+ <li>title (título del elemento)</li>
+ <li>style (información de estilo en línea)</li>
+</ul>
+
+<dl>
+ <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
+ <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
+ <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
+</dl>
+
+<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene." name="Atributos_Espec.C3.ADficos_-_No_tiene.">Atributos Específicos - No tiene.</h5>
+
+<h5 id="Atributos_Transicionales_-_No_tiene." name="Atributos_Transicionales_-_No_tiene.">Atributos Transicionales - No tiene.</h5>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">&lt;p&gt;
+... entonces aparecerá una ventana con el mensaje: &lt;samp&gt;Hola mundo&lt;/samp&gt;
+&lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/element/section/index.html b/files/es/web/html/element/section/index.html
new file mode 100644
index 0000000000..b850032d78
--- /dev/null
+++ b/files/es/web/html/element/section/index.html
@@ -0,0 +1,144 @@
+---
+title: section
+slug: Web/HTML/Element/section
+translation_of: Web/HTML/Element/section
+original_slug: Web/HTML/Elemento/section
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento de <em>HTML section</em> (<code>&lt;section&gt;</code>) representa una sección genérica de un documento. Sirve para determinar qué contenido corresponde a qué parte de un esquema. Piensa en el esquema como en el índice de contenido de un libro; un tema común y subsecciones relacionadas.  Es, por lo tanto, una etiquéta semántica. Su funcionalidad principal es estructurar semánticamente un documento a la hora de ser representado por parte de un agente usuario. Por ejemplo, un agente de usuario que represente el documento en voz, podría exponer al usuario el índice de contenido por niveles para navegar rápidamente por las distintas partes.</p>
+
+<div class="note">
+<p><em>Notas de uso:</em></p>
+
+<ul>
+ <li>Si la intención es indicar el contenido de un elemento {{HTMLElement("section")}} , es mejor usar el elemento {{HTMLElement("article")}} en su lugar, a modo de artículos independientes como en las revistas. {{HTMLElement("section")}} está diseñado para contenidos dependientes, pero diferenciados.</li>
+ <li>No se debe usar el elemento {{HTMLElement("section")}} como un mero contenedor genérico; para esto ya existe {{HTMLElement("div")}}, especialmente si el objetivo solamente es aplicar un estilo (CSS) a la sección. Como regla general, el título de una sección debería aparecer en el esquema del documento.</li>
+</ul>
+</div>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Contenido permitido</td>
+   <td><a href="/en/HTML/Content_categories#Flow_content" title="en/HTML/Content Categories#Flow content">Contenido dinámico</a></td>
+  </tr>
+  <tr>
+   <td>Omisión de etiquetas</td>
+   <td>Ninguna, tanto la etiqueta de apertura como la de cierre son obligatorias.</td>
+  </tr>
+  <tr>
+   <td>Elementos padres permitidos</td>
+   <td>
+    <p>Todo elemento que acepte <a href="/en/HTML/Content_categories#Flow_content" title="en/HTML/Content Categories#Flow content">contenido dinámico</a>. Nótese que un elemento {{ HTMLElement("section") }} no debe ser descendiente de un elemento {{ HTMLElement("address") }}.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Documento normativo</td>
+   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element">HTML5, sección 4.4.2</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento carece de otros atributos fuera de los <a href="/en/HTML/Global_attributes" rel="internal">atributos globales</a>, que son comunes a todos los elementos.</p>
+
+<h2 id="Interfaz_del_DOM">Interfaz del DOM</h2>
+
+<p>Este elemento implementa la interfaz <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code>.</p>
+
+<h2 id="Ejemplo_1">Ejemplo 1</h2>
+
+<h3 id="Antes_de_HTML5">Antes de HTML5</h3>
+
+<pre class="line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h1</span><span class="punctuation token">&gt;Encabezado</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h1</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span></code>Un montón de contenido impresionante.<code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<h3 id="con_HTML5">con HTML5</h3>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>section</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h1</span><span class="punctuation token">&gt;</span></span></code><code>Encabezado</code><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h1</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span></code>Un montón de contenido impresionante.<code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>section</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<h2 id="Ejemplo_2">Ejemplo 2</h2>
+
+<h3 id="Antes_de_HTML5_2">Antes de HTML5</h3>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h2</span><span class="punctuation token">&gt;Encabezado</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h2</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"roble</span>.jpg<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"un roble</span><span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<h3 id="con_HTML5_2">con HTML5</h3>
+
+<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>section</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h2</span><span class="punctuation token">&gt;</span></span>Encabezado<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h2</span><span class="punctuation token">&gt;</span></span>
+  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"roble</span>.jpg<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"un roble</span><span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
+<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>section</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+
+
+<h2 id="Compatibilidad">Compatibilidad</h2>
+
+
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>5</td>
+   <td>{{ CompatGeckoDesktop("2.0") }}</td>
+   <td>9.0</td>
+   <td>11.10</td>
+   <td>4.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Móvil (Gecko)</th>
+   <th>IE Móvil</th>
+   <th>Opera Móvil</th>
+   <th>Safari Móvil</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.2</td>
+   <td>{{ CompatGeckoMobile("2.0") }}</td>
+   <td>9.0</td>
+   <td>11.0</td>
+   <td>5.0 (iOS 4.2)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>Otros elementos relacionados: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("article") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};</li>
+ <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Secciones y esquemas de un documento en HTML5</a>.</li>
+</ul>
diff --git a/files/es/web/html/element/select/index.html b/files/es/web/html/element/select/index.html
new file mode 100644
index 0000000000..3b1558014b
--- /dev/null
+++ b/files/es/web/html/element/select/index.html
@@ -0,0 +1,199 @@
+---
+title: <select>
+slug: Web/HTML/Element/select
+tags:
+  - Elemento
+  - Formulario(2)
+  - HTML
+  - Referencia
+  - Web
+  - formularios html(2)
+translation_of: Web/HTML/Element/select
+original_slug: Web/HTML/Elemento/select
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento select (<code>&lt;select&gt;</code>) de HTML representa un control que muestra un menú de opciones. Las opciones contenidas en el menú son representadas por elementos {{HTMLElement("option")}}, los cuales pueden ser agrupados por elementos {{HTMLElement("optgroup")}}. La opcion puede estar preseleccionada por el usuario.</p>
+
+<h2 id="Contenido">Contenido</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content categories">Content categories</a></td>
+   <td>Elementos <a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, <a href="/en-US/docs/HTML/Content_categories#Interactive_content" title="HTML/Content categories#Interactive content">interactive content</a>, <a href="/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">listed</a>, <a href="/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">labelable</a>, <a href="/en-US/docs/HTML/Content_categories#Form_resettable" title="HTML/Content categories#Form resettable">resettable</a>, y <a href="/en-US/docs/HTML/Content_categories#Form_submittable" title="HTML/Content categories#Form submittable">submittable</a> <a href="/en-US/docs/HTML/Content_categories#Form-associated_" title="HTML/Content categories#Form-associated ">form-associated</a>.</td>
+  </tr>
+  <tr>
+   <td>Contenido permitido</td>
+   <td>Uno o mas elementos {{HTMLElement("option")}} o {{HTMLElement("optgroup")}}.</td>
+  </tr>
+  <tr>
+   <td>Omisión de etiquetas</td>
+   <td>Ninguna, ambas etiquetas son obligatorias</td>
+  </tr>
+  <tr>
+   <td>Elementos padre permitidos</td>
+   <td>Cualquier elemento que permita phrasing content.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento incluye </span><a href="/en-US/docs/Web/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
+
+<dl>
+ <dt>{{htmlattrdef("autofocus")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo permite especificar un formulario de control que debería tener enfoque de entrada cuando se carga la página, a no ser que el usuario lo sobreescriba, por ejemplo, escribiendo un control diferente. Solo un elemento formulario puede tener el elemento de enfoque de entrada por documento, por lo cual es un atributo booleano.</dd>
+ <dt>{{htmlattrdef("disabled")}}</dt>
+ <dd>El atributo booleano especifica que el usuario no puede interactuar con el control. Si este atributo no está especificado, el control hereda los ajustes del campo que lo contiene, por ejemplo del fielset; si no hay elemento contenido con el atributo disabled, entonces el control se considera enable (activado).</dd>
+ <dt>{{htmlattrdef("form")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>El elemento formulario al cual el select está asociado (su propietario del formulario). Si este atributo está especificado, su valor deberá ser el ID de un formulario en el mismo documento. Esto te permite situar elementos en cualquier parte del documento, no solo de manera descendiente con respecto a su elemento formulario.</dd>
+ <dt>{{htmlattrdef("multiple")}}</dt>
+ <dd>Este elemento booleano indica que se pueden seleccionar múltiples opciones de la lista. Si no está especificado, solo se podrá seleccionar una opción cada vez.</dd>
+ <dt>{{htmlattrdef("name")}}</dt>
+ <dd>El nombre del elemento de control.</dd>
+ <dt>{{htmlattrdef("required")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Es un elemento boooleano que indica si la opcion puede quedar sin seleccionar o si es requerida.</dd>
+ <dt>{{htmlattrdef("size")}}</dt>
+ <dd>Si el control se presenta como una lista con scroll en caja, este atributo representa el numero de filas que la list tendrá visible la primera vez. Los navegadores no están requeridos a presentar un elemento select como una lista con escroll en caja. El valor por defecto es cero.</dd>
+</dl>
+
+<div class="note"><strong>Nota de Firefox: </strong>De acuerdo con las especificaciones de HTML5, el tamaño por defecto debe ser 1; sin embargo, en la práctica, esto hace que se rompan algunas páginas webs, y ningun otro navegador actualmente hace esto, así que Mozilla ha optado por continuar usando 0 desde que empezó con Firefox.</div>
+
+<dl>
+</dl>
+
+<h2 id="DOM_Interface">DOM Interface</h2>
+
+<p>Este elemento implementa la interfaz <code><a href="/en-US/docs/DOM/HTMLSelectElement" title="DOM/select">HTMLSelectElement</a>.</code></p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;!-- The second value will be selected initially --&gt;
+&lt;select name="select"&gt;
+  &lt;option value="value1"&gt;Value 1&lt;/option&gt;
+  &lt;option value="value2" selected&gt;Value 2&lt;/option&gt;
+  &lt;option value="value3"&gt;Value 3&lt;/option&gt;
+&lt;/select&gt;
+</pre>
+
+<h4 id="Resultado">Resultado</h4>
+
+<p><select name="select"><option value="value1">Value 1</option><option selected value="value2">Value 2</option><option value="value3">Value 3</option></select></p>
+
+<h3 id="Notas">Notas</h3>
+
+<p>El contenido de este elemento es estático y no <a href="/en-US/docs/HTML/Content_Editable" title="HTML/Content_Editable">editable</a>.</p>
+
+<p>El siguiente ejemplo muestra como simular una lista con opciones editables, pero ten cuidado ya que algunos lectores de pantallas y dispositivos de ayuda no lo interpretarán de forma correcta; este ejemplo sería html inválido si usas los elementos correctos:</p>
+
+<p><a href="/files/4563/editable_select.html" style="line-height: 1.5;" title="Simulating an editable select through a fieldset of radioboxes and textboxes">This is an example</a> de un select editable mediante un<span style="line-height: 1.5;"> {{HTMLElement("fieldset")}} de </span><a href="/en-US/docs/HTML/Element/Input" style="line-height: 1.5;" title="HTML/Element/Input">radioboxes</a><span style="line-height: 1.5;"> y </span><a href="/en-US/docs/HTML/Element/Input" style="line-height: 1.5;" title="HTML/Element/Input">textboxes</a><span style="line-height: 1.5;"> (<strong>escrito en CSS puro</strong></span><span style="line-height: 1.5;">, sin JavaScript), </span></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML5 W3C', 'forms.html#the-select-element', '&lt;select&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.6', '&lt;select&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>required</code> attribute</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>10</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}} [1]</td>
+   <td>{{CompatGeckoMobile("1.0")}} [2]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>required</code> attribute</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<p>[1] En la aplicación navegador para Android 4.1 (y posiblemente en versiones posteriores), hay un error cuando el menu triangulo indicador al lado de un elemento {{HTMLElement("select")}} no se muestra si {{ cssxref("background") }}, {{ cssxref("border") }}, o {{ cssxref("border-radius") }} estilos están aplicados al {{HTMLElement("select")}}.</p>
+
+<p>[2] Firefox para Android, por defecto, establece un {{ cssxref("background-image") }} gradiente en todos los elementos <code>&lt;select multiple&gt;</code>. Esto puede desactivarse usando  <code>background-image: none</code>.</p>
+
+<p>[3] Históricamente, Firefox ha permitido eventos de teclado y ratón para mostrar desde el elemento <code>&lt;option&gt; al elemento padre </code>{{HTMLElement("select")}}. Esto no ocurre en Chrome, sin embargo, aunque este comportamiento sigue apareciendo de manera incosciente en muchos navegadores. Para una mayor compatibilidad Web (y por razones técnicas), cuando Firefox está en modo multitarea el elemento <code>&lt;select&gt;</code> se muestra como una lista descendente. Este comportamiento se produce sin cambios si <code>&lt;select&gt;</code>se presenta como elemento en línea y tiene multipleas atributos definidos o tiene un atributo de tamaño cuyo valor sea mayor que uno. Mejor que ver el elemento <code>&lt;option&gt;</code> para eventos, debería mirar el elemento de enventos {event("change")}} en {{HTMLElement("select")}}. Ver {{bug(1090602)}} para detalles.</p>
+
+<p>Tanto Chrome como Safari ignoran {{cssxref("border-radius")}} en los elementos {{HTMLElement("select")}} a no ser que {{cssxref("-webkit-appearance")}} esté invalidado a un valor apropiado.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Otros elementos relacionados de formularios: {{HTMLElement("form")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("button")}}, {{HTMLElement("option")}}, {{HTMLElement("datalist")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("input")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/shadow/index.html b/files/es/web/html/element/shadow/index.html
new file mode 100644
index 0000000000..7c5720124f
--- /dev/null
+++ b/files/es/web/html/element/shadow/index.html
@@ -0,0 +1,153 @@
+---
+title: <shadow>
+slug: Web/HTML/Element/shadow
+translation_of: Web/HTML/Element/shadow
+original_slug: Web/HTML/Elemento/Shadow
+---
+<p>{{obsolete_header}}</p>
+
+<p><span class="seoSummary">El <strong>HTML <code>&lt;shadow&gt;</code> element</strong>—es una parte absoluta de la suite tecnológica de <a href="/en-US/docs/Web/Web_Components">Web Components</a> —estaba destinado a ser utilizado como un shadow DOM {{glossary("insertion point")}}. Es posible que lo hayas usado si has creado varias root shadow bajo un shadow host. No es útil en HTML ordinario.</span></p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Transparent_content_model">Transparent content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted content</th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Tag omission</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted parents</th>
+   <td>Any element that accepts flow content.</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted ARIA roles</th>
+   <td>None</td>
+  </tr>
+  <tr>
+   <th scope="row">DOM interface</th>
+   <td>{{domxref("HTMLShadowElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Attributes">Attributes</h2>
+
+<p>This element includes the <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</p>
+
+<h2 id="Example">Example</h2>
+
+<p>Aquí está un ejemplo simple usando el  <code>&lt;shadow&gt;</code> element. Es un archivo HTML con todo lo necesario en él.</p>
+
+<div class="note">
+<p><strong>Note:</strong> This is an experimental technology. For this code to work, the browser you display it in must support Web Components. See <a href="/en-US/docs/Web/Web_Components#Enabling_Web_Components_in_Firefox">Enabling Web Components in Firefox</a>.</p>
+</div>
+
+<pre class="brush: html">&lt;html&gt;
+  &lt;head&gt;&lt;/head&gt;
+  &lt;body&gt;
+
+  &lt;!-- This &lt;div&gt; will hold the shadow roots. --&gt;
+  &lt;div&gt;
+    &lt;!-- This heading will not be displayed --&gt;
+    &lt;h4&gt;My Original Heading&lt;/h4&gt;
+  &lt;/div&gt;
+
+  &lt;script&gt;
+    // Get the &lt;div&gt; above with its content
+    var origContent = document.querySelector('div');
+    // Create the first shadow root
+    var shadowroot1 = origContent.createShadowRoot();
+    // Create the second shadow root
+    var shadowroot2 = origContent.createShadowRoot();
+
+    // Insert something into the older shadow root
+    shadowroot1.innerHTML =
+      '&lt;p&gt;Older shadow root inserted by
+          &amp;lt;shadow&amp;gt;&lt;/p&gt;';
+    // Insert into younger shadow root, including &lt;shadow&gt;.
+    // The previous markup will not be displayed unless
+    // &lt;shadow&gt; is used below.
+    shadowroot2.innerHTML =
+      '&lt;shadow&gt;&lt;/shadow&gt; &lt;p&gt;Younger shadow
+       root, displayed because it is the youngest.&lt;/p&gt;';
+  &lt;/script&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<p>If you display this in a web browser it should look like the following.</p>
+
+<p><img alt="shadow example" src="https://mdn.mozillademos.org/files/10083/shadow-example.png" style="height: 343px; width: 641px;"></p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<p>This element is no longer defined by any specifications.</p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>35</td>
+   <td>{{CompatGeckoDesktop("28")}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>26</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>37</td>
+   <td>{{CompatGeckoMobile("28")}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] If Shadow DOM is not enabled in Firefox, <code>&lt;shadow&gt;</code> elements will behave like {{domxref("HTMLUnknownElement")}}. Shadow DOM was first implemented in Firefox 33 and is behind a preference, <code>dom.webcomponents.enabled</code>, which is disabled by default.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/Web_Components">Web Components</a></li>
+ <li>{{HTMLElement("content")}}, {{HTMLElement("slot")}}, {{HTMLElement("template")}}, {{HTMLElement("element")}}</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/element/slot/index.html b/files/es/web/html/element/slot/index.html
new file mode 100644
index 0000000000..de3cd5e4cc
--- /dev/null
+++ b/files/es/web/html/element/slot/index.html
@@ -0,0 +1,127 @@
+---
+title: <slot>
+slug: Web/HTML/Element/slot
+tags:
+  - Componentes Web
+  - Componentes Web HTML
+  - Elemento
+  - HTML
+  - Referencia
+  - slot
+  - sombra dom
+translation_of: Web/HTML/Element/slot
+original_slug: Web/HTML/Elemento/slot
+---
+<p>{{HTMLRef}}</p>
+
+<p><span class="seoSummary"><strong>El elemento HTML <code>&lt;slot&gt;</code> </strong>—parte de la suite tecnologica <a href="/en-US/docs/Web/Web_Components">Web Components</a> — es un placeholder en un componente que tu puedes llenar con tu propio marcado, que te permite crear árboles DOM por separado y presentarlos juntos. </span></p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorias de contenido</a></th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">contenido de fraseo</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Transparent_content_model">Transparente</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Eventos</th>
+   <td>{{event("slotchange")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Parentes permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Rol ARIA implícito</th>
+   <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">No corresponding role</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA Permitidos</th>
+   <td>No se permite <code>role</code></td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLSlotElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>   {{htmlattrdef("name")}}</dt>
+ <dd>El nombre del slot.</dd>
+ <dd><dfn>Un<strong> </strong></dfn><strong><dfn>slot nombrado</dfn></strong> es un elemento <code>&lt;slot&gt;</code>  con el atributo  <code>name</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;template id="element-details-template"&gt;
+  &lt;style&gt;
+    details {font-family: "Open Sans Light",Helvetica,Arial}
+    .name {font-weight: bold; color: #217ac0; font-size: 120%}
+    h4 { margin: 10px 0 -8px 0; }
+    h4 span { background: #217ac0; padding: 2px 6px 2px 6px }
+    h4 span { border: 1px solid #cee9f9; border-radius: 4px }
+    h4 span { color: white }
+    .attributes { margin-left: 22px; font-size: 90% }
+    .attributes p { margin-left: 16px; font-style: italic }
+  &lt;/style&gt;
+  &lt;details&gt;
+    &lt;summary&gt;
+      &lt;span&gt;
+        &lt;code class="name"&gt;&amp;lt;&lt;slot name="element-name"&gt;NEED NAME&lt;/slot&gt;&amp;gt;&lt;/code&gt;
+        &lt;i class="desc"&gt;&lt;slot name="description"&gt;NEED DESCRIPTION&lt;/slot&gt;&lt;/i&gt;
+      &lt;/span&gt;
+    &lt;/summary&gt;
+    &lt;div class="attributes"&gt;
+      &lt;h4&gt;&lt;span&gt;Attributes&lt;/span&gt;&lt;/h4&gt;
+      &lt;slot name="attributes"&gt;&lt;p&gt;None&lt;/p&gt;&lt;/slot&gt;
+    &lt;/div&gt;
+  &lt;/details&gt;
+  &lt;hr&gt;
+&lt;/template&gt;</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Puedes ver este ejemplo en accion en  <a class="external external-icon" href="https://github.com/mdn/web-components-examples/tree/master/element-details" rel="noopener">element-details</a> (velo <a class="external external-icon" href="https://mdn.github.io/web-components-examples/element-details/" rel="noopener">running live</a>). Además, puedes encontrar una explicación en <a href="/en-US/docs/Web/Web_Components/Using_templates_and_slots">Using templates and slots</a>.</p>
+</div>
+
+<ul>
+</ul>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG','scripting.html#the-slot-element','&lt;slot&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#shadow-tree-slots','Slots')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.slot")}}</p>
diff --git a/files/es/web/html/element/small/index.html b/files/es/web/html/element/small/index.html
new file mode 100644
index 0000000000..92616de060
--- /dev/null
+++ b/files/es/web/html/element/small/index.html
@@ -0,0 +1,21 @@
+---
+title: small
+slug: Web/HTML/Element/small
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/small
+original_slug: Web/HTML/Elemento/small
+---
+<p>El <strong>elemento HTML &lt;small&gt;</strong> hace el tamaño del texto una talla más pequeña (por ejemplo, de largo a mediano, o de pequeño a extra pequeño) que el tamaño mínimo de fuente del navegador. En HTML5, este elemento es reutilizado para representar comentarios laterales y letra pequeña, incluyendo derechos de autor y texto legal, independientemente de su estilo de presentación.</p>
+
+<p>{{EmbedInteractiveExample("pages/tabbed/small.html", "tabbed-shorter")}}</p>
+
+<p> </p>
+
+<p> </p>
+
+<p> </p>
+
+<p> </p>
diff --git a/files/es/web/html/element/source/index.html b/files/es/web/html/element/source/index.html
new file mode 100644
index 0000000000..71833ec7f8
--- /dev/null
+++ b/files/es/web/html/element/source/index.html
@@ -0,0 +1,130 @@
+---
+title: <source>
+slug: Web/HTML/Element/source
+tags:
+  - Elemento
+  - HTML
+  - Media
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/source
+original_slug: Web/HTML/Elemento/source
+---
+<p>El <strong>elemento HTML <code>&lt;source&gt;</code> </strong> especifica recursos de medios múltiples para los elementos {{HTMLElement("picture")}}, {{HTMLElement("audio")}}, o {{HTMLElement("video")}}. Es un elemento vacío. Normalmente se utiliza para servir el mismo contenido multimedia en <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements">varios formatos soportados por diferentes navegadores</a>.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/source.html", "tabbed-standard")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si desea contribuir al proyecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíenos una solicitud de pull.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías de contenido</a></th>
+   <td>Ninguna.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno, esto es un {{Glossary("empty element")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de Etiqueta</th>
+   <td>Debe tener una etiqueta inicial, pero no debe tener una etiqueta final.</td>
+  </tr>
+  <tr>
+   <th scope="row"><dfn>Padres permitidos</dfn></th>
+   <td>
+    <div>Un elemento multimedia—{{HTMLElement("audio")}} o {{HTMLelement("video")}}—y se debe colocar antes que cualquier <a href="/en-US/docs/HTML/Content_categories#Flow_content">contenido de flujo</a> o elemento {{HTMLElement("track")}}.</div>
+
+    <div>Un elemento {{HTMLElement("picture")}}, y se debe colocar antes del elemento {{HTMLElement("img")}}.</div>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>Ninguno</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <th> </th>
+   <td>{{domxref("HTMLSourceElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("sizes")}} {{experimental_inline}}</dt>
+ <dd>Es una lista de tamaños del origen que describe el ancho renderizado final de la imagen representada por el origen. Cada tamaño de origen consiste de una lista separada por comas de pares de longitud de condición de medios. Esta información es utilizada por el navegador para determinar, antes de distribuir la página, qué imagen definida en {{htmlattrxref("srcset", "source")}} se utilizará.<br>
+ El atributo <code>sizes</code> tiene un efecto solo cuando el elemento {{HTMLElement("source")}} es hijo directo de un elemento {{HTMLElement("picture")}}.</dd>
+ <dt>{{htmlattrdef("src")}}</dt>
+ <dd>Es la ubicación del recurso multimedia, requerido por los elementos {{HTMLElement("audio")}} y {{HTMLElement("video")}}. El valor de este atributo es ignorado cuando el elemento <code>&lt;source&gt;</code> se coloca dentro de un elemento {{HTMLElement("picture")}}.</dd>
+ <dt>{{htmlattrdef("srcset")}} {{experimental_inline}}</dt>
+ <dd>Una lista de una o más cadenas separadas por comas que indican un conjunto de posibles imágenes representadas por la fuente para que las utilice el navegador. Cada cadena se compone de:
+ <ol>
+  <li>una URL a una imagen,</li>
+  <li>un descriptor de ancho, que es un entero positivo seguido directamente por <code>'w'</code>. El valor predeterminado, si falta, es el infinito.</li>
+  <li>un descriptor de densidad de píxeles, que es un número flotante positivo seguido directamente por <code>'x'</code>. El valor predeterminado, si falta, es <code>1x</code>.</li>
+ </ol>
+
+ <p>Cada cadena en la lista debe tener al menos un descriptor de ancho o un descriptor de densidad de píxeles para que sea válido. Entre los elementos de la lista, solo debe haber una cadena que contenga la misma tupla de descriptor de ancho y descriptor de densidad de píxeles.<br>
+  El navegador elige la imagen más adecuada para mostrar en un momento determinado.<br>
+  El atributo <code>srcset</code> solo tiene efecto cuando el elemento {{HTMLElement("source")}} es hijo directo de un elemento {{HTMLElement("picture")}}.</p>
+ </dd>
+ <dt>{{htmlattrdef("type")}}</dt>
+ <dd>El tipo MIME del recurso, opcionalmente con un parámetro <code>codecs</code>. Consultar <a class="external" href="https://tools.ietf.org/html/rfc4281"> RFC 4281 </a> para obtener información sobre cómo especificar los códecs.</dd>
+ <dt>{{htmlattrdef("media")}} {{experimental_inline}}</dt>
+ <dd><a class="internal" href="/en-US/docs/CSS/Media_queries">Consulta multimedia</a> de los medios destinados al recurso; esto solo debe usarse en un elemento {{HTMLElement("picture")}}.</dd>
+</dl>
+
+<p>Si el atributo <code>type</code> no se especifica, el tipo de medio se recupera del servidor y se verifica para ver si el agente de usuario puede manejarlo; si no se puede procesar, se comprueba el siguiente <code>&lt;source&gt;</code>. Si se especifica el atributo <code>type</code>, se compara con los tipos que puede presentar el agente de usuario y, si no se reconoce, el servidor ni siquiera recibe consultas; en su lugar, el siguiente elemento <code>&lt;source&gt;</code> se comprueba a la vez.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Este ejemplo muestra cómo ofrecer un video en formato Ogg para usuarios cuyos navegadores admiten el formato Ogg, y un video en formato QuickTime para usuarios cuyos navegadores lo admiten. Si el navegador no admite los elementos <code>audio</code> o <code>video</code>, se muestra un aviso. Si el navegador admite los elementos pero no admite ninguno de los formatos especificados, se genera un evento <code>error</code> y los controles de medios predeterminados (si están habilitados) indicarán un error. Consulte también la lista de <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements">formatos de medios compatibles con los elementos de audio y video</a> en varios navegadores.</p>
+
+<pre class="brush: html">&lt;video controls&gt;
+  &lt;source src="foo.webm" type="video/webm"&gt;
+  &lt;source src="foo.ogg" type="video/ogg"&gt;
+  &lt;source src="foo.mov" type="video/quicktime"&gt;
+  Lo lamento; su navegador no soporta video HTML5.
+&lt;/video&gt;
+</pre>
+
+<p>Para obtener más ejemplos, consulte <a class="internal" href="/en-US/docs/Using_HTML5_audio_and_video">Uso de audio y video en Firefox</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'embedded-content.html#the-source-element', '&lt;source&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compaibilidad_entre_navegadores">Compaibilidad entre navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de pull.</div>
+
+<p>{{Compat("html.elements.source")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Elemento {{HTMLElement("picture")}}</li>
+ <li>Elemento {{HTMLElement("audio")}}</li>
+ <li>Elemento {{HTMLElement("video")}}</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/span/index.html b/files/es/web/html/element/span/index.html
new file mode 100644
index 0000000000..9536b923df
--- /dev/null
+++ b/files/es/web/html/element/span/index.html
@@ -0,0 +1,167 @@
+---
+title: span
+slug: Web/HTML/Element/span
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/span
+original_slug: Web/HTML/Elemento/span
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>span</strong> - <em>abarcar</em>. Es un contenedor en línea. Sirve para aplicar estilo al texto o agrupar elementos en línea.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;span&gt;</code> y <code>&lt;/span&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="/es/HTML/Elemento/Tipos_de_elementos#especial" title="es/HTML/Elemento/Tipos_de_elementos#especial">especial</a>, y por lo tanto <a href="/es/HTML/Elemento/Tipos_de_elementos#enlinea" title="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En línea.</dd>
+ <dd><strong>Puede contener</strong>: Texto, y/o Elementos <a href="/es/HTML/Elemento/Tipos_de_elementos#enlinea" title="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td><code style="color: green;">datasrc </code></td>
+   <td>Enlaza a una fuente de datos externa (individual o tabular). Reservado para posibles usos futuros.</td>
+   <td>Una dirección URI. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">datafld </code></td>
+   <td>El nombre de una propiedad o columna de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
+   <td>Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><code style="color: green;">dataformatas </code></td>
+   <td>Indica como deben ser tratados los datos obtenidos de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
+   <td>Uno de los siguientes: <code>'paintext'</code> o <code>'html</code>'. Por defecto: <code>'plaintext'</code></td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="div_y_span" name="div_y_span">div y span</h4>
+
+<p>código:</p>
+
+<pre class="eval">&lt;div style="border: 1px dotted blue;"&gt;
+  &lt;h4&gt;Ejemplo de div y span &lt;/h4&gt;
+   &lt;p&gt;
+    Esto es un párrafo dentro de un div,
+     &lt;span style="color: red;"&gt; y esto un span dentro de un párrafo. &lt;/span&gt;
+   &lt;/p&gt;
+ &lt;/div&gt;
+</pre>
+
+<p>Resultado:</p>
+
+<div style="border: solid silver 1px;">
+<div style="border: 1px dotted blue;">
+<h5 id="Ejemplo_de_div_y_span" name="Ejemplo_de_div_y_span">Ejemplo de div y span</h5>
+
+<p>Esto es un párrafo dentro de un div, <span style="color: red;"> y esto un span dentro de un párrafo.</span></p>
+</div>
+</div>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<p>Por definición span no debe tener ningún estilo predefinido. Estos dos párrafos deben verse igual:</p>
+
+<pre class="eval">&lt;p&gt; Esto es un párrafo, bla, bla, bla. &lt;/p&gt;
+&lt;p&gt; Esto es un párrafo, &lt;span&gt;bla, bla, bla.&lt;/span&gt; &lt;/p&gt;
+</pre>
+
+<p> </p>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#edef-SPAN"><strong>span</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-span">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/strike/index.html b/files/es/web/html/element/strike/index.html
new file mode 100644
index 0000000000..d8b1b45ee4
--- /dev/null
+++ b/files/es/web/html/element/strike/index.html
@@ -0,0 +1,61 @@
+---
+title: strike
+slug: Web/HTML/Element/strike
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/strike
+original_slug: Web/HTML/Elemento/strike
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Muestra el texto tachado con una linea horizontal.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;strike&gt; y &lt;/strike&gt; (Ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>:<a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>:<a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
+
+<ul>
+ <li>title (título del elemento)</li>
+ <li>style (información de estilo en línea)</li>
+</ul>
+
+<dl>
+ <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
+ <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
+ <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
+</dl>
+
+<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
+
+<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">  &lt;p&gt;
+       Texto normal y... &lt;strike&gt;Texto tachado&lt;/strike&gt;
+  &lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<div class="warning">DESAPROBADO</div>
+
+<p><span class="comment">de momento no funciona </span></p>
diff --git a/files/es/web/html/element/strong/index.html b/files/es/web/html/element/strong/index.html
new file mode 100644
index 0000000000..933e473355
--- /dev/null
+++ b/files/es/web/html/element/strong/index.html
@@ -0,0 +1,59 @@
+---
+title: strong
+slug: Web/HTML/Element/strong
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/strong
+original_slug: Web/HTML/Elemento/strong
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>El elemento <strong>strong</strong> es el apropiado para marcar con especial énfasis las partes más importantes de un texto.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;strong&gt; y &lt;/strong&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
+
+<ul>
+ <li>title (título del elemento)</li>
+ <li>style (información de estilo en línea)</li>
+</ul>
+
+<dl>
+ <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
+ <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
+ <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
+</dl>
+
+<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
+
+<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval"> &lt;p&gt;
+     &lt;em&gt;El dinero&lt;/em&gt; es importante pero &lt;strong&gt;la salud&lt;/strong&gt; lo es más.
+ &lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p><strong>strong</strong> tiene un hermano menor: <strong>em</strong>. <strong>em</strong> sirve para dar énfasis y <strong>strong</strong> para dar mucho énfasis</p>
diff --git a/files/es/web/html/element/style/index.html b/files/es/web/html/element/style/index.html
new file mode 100644
index 0000000000..5b851cc727
--- /dev/null
+++ b/files/es/web/html/element/style/index.html
@@ -0,0 +1,123 @@
+---
+title: style
+slug: Web/HTML/Element/style
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/style
+original_slug: Web/HTML/Elemento/style
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>style</strong> - estilo. Es el elemento encargado de indicar la información de estilo.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;style&gt;</code> y <code>&lt;/style&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#decabecera">de cabecera</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: No.</dd>
+ <dd><strong>Puede contener</strong>: Declaraciones de estilo.</dd>
+ <dd><strong>Debe ser contenido por</strong>: Elementos <a href="es/HTML/Elemento/Tipos_de_elementos#head">head</a>.</dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<p><del>Por defecto:</del> Debe indicarlo el autor.</p>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-type-STYLE"><code style="color: green;">type </code></a></td>
+   <td>Indica el lenguaje de hojas de estilo usado.</td>
+   <td>Un tipo <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-content-type">MIME</a>. Para CSS es: "text/css".</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-media"><code style="color: green;">media </code></a></td>
+   <td>Indica el/los medios a los que está destinada la información de estilo.</td>
+   <td>Uno o más <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-media-descriptors">descriptores de medio</a> separados por coma. Por defecto: 'screen'. Lo fija el navegador</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h4 id="Ejemplo_simple" name="Ejemplo_simple">Ejemplo simple</h4>
+
+<pre class="eval">&lt;<strong>style</strong> type="text/css"&gt;
+ p { color: red; }
+&lt;/<strong>style</strong>&gt;
+&lt;p&gt; Texto en rojo &lt;/p&gt;
+</pre>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#edef-STYLE"><strong>style</strong> en la especificación</a> de html 4.01</li>
+ <li>Especificación de <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/cover.html">CSS 2</a></li>
+</ul>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-style">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/sub/index.html b/files/es/web/html/element/sub/index.html
new file mode 100644
index 0000000000..bc24e468c7
--- /dev/null
+++ b/files/es/web/html/element/sub/index.html
@@ -0,0 +1,102 @@
+---
+title: sub
+slug: Web/HTML/Element/sub
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/sub
+original_slug: Web/HTML/Elemento/sub
+---
+<p>{{HTMLRef}}</p>
+
+<p>El <strong>elemento HTML</strong> &lt;sub&gt; define un fragmento de texto que se debe mostrar, por razones tipográficas, más bajo, y generalmente más pequeño, que el tramo principal del texto, es decir, en subíndice.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Categorías de contenido</a></th>
+   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_din%C3%A1mico">Contenido dinamíco</a>(Flow content) y <a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a>(phrasing content)</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Omission de etiquetas</th>
+   <td><font><font>Ninguna, tanto la etiqueta de apertura y cierre deben estar presentes</font></font></td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padres permitidos</th>
+   <td><font><font>Cualquier elemento que acepte contenido estático o de texto</font></font></td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>Cualquiera</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento sólo incluye los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a>.</p>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<ul>
+ <li><font><font>Este elemento debe ser utilizado sólo por razones tipográficas, es decir, cambiar la posición del texto cambia su significado como en matemática</font></font> (por ejemplo la fórmula matemática <var>t<sub>2</sub></var>, aunque se debe considerar el uso de <a href="/en-US/docs/MathML">MathML</a>) <font><font>o fórmulas químicas</font></font> (por ejemplo <code>H<sub>2</sub>O</code>).</li>
+ <li>Este elemento no debe ser utilizado para propósitos meramente visuales, como el estilo del logo del software<a class="external external-icon" href="https://es.wikipedia.org/wiki/LaTeX"> LaTeX</a> <a href="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png"><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png" style="height: 23px; vertical-align: bottom; width: 56px;"></a>. En ese caso debe usarse la propiedad de <a href="https://developer.mozilla.org/en-US/docs/CSS" title="en/CSS">CSS</a> <code>vertical-align</code>  para lograr el mismo efecto.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;p&gt;La fórmula química de agua: H&lt;sub&gt;2&lt;/sub&gt;O&lt;/p&gt;
+</pre>
+
+<h4 id="Resultado">Resultado</h4>
+
+<p>La fórmula química de agua: H<sub>2</sub>O</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-sub-and-sup-elements', '&lt;sub&gt; and &lt;sup&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'textlevel-semantics.html#the-sub-and-sup-elements', '&lt;sub&gt; and &lt;sup&gt;;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_navegadores">Compatibilidad navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.sub")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El elemento HTML <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/sup">&lt;sup&gt;</a> produce superíndice. Tenga en cuenta que no puedes usar &lt;sup&gt;  y &lt;sub&gt;  ambos al mismo tiempo y necesita usar <a href="https://developer.mozilla.org/en-US/docs/MathML" title="en/MathML">MathML</a> para producir un superíndice y un subíndice al lado del símbolo químico de un elemento, que representa su número atómico y su número nuclear.
+
+  <p><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/db/Element_identity.png/220px-Element_identity.png" style="height: 63px; width: 63px;"></p>
+ </li>
+ <li>Los elementos MathML<a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msub" title="en/MathML/Element/msub"><code>&lt;msub&gt;</code></a>, <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msup" title="en/MathML/Element/msup"><code>&lt;msup&gt;</code></a>, y <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msubsup" title="en/MathML/Element/msubsup"><code>&lt;msubsup&gt;</code></a> .</li>
+</ul>
diff --git a/files/es/web/html/element/sup/index.html b/files/es/web/html/element/sup/index.html
new file mode 100644
index 0000000000..e4443c2e6a
--- /dev/null
+++ b/files/es/web/html/element/sup/index.html
@@ -0,0 +1,111 @@
+---
+title: sup
+slug: Web/HTML/Element/sup
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/sup
+original_slug: Web/HTML/Elemento/sup
+---
+<p>El <strong>elemento HTML</strong> &lt;sup&gt; define un fragmento de texto que se debe mostrar, por razones tipográficas, más alto, y generalmente más pequeño, que el tramo principal del texto, es decir, en superíndice.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories" title="en/HTML/Content categories">Categorías de contenido</a></th>
+   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_din%C3%A1mico">Contenido dinamíco</a>(Flow content) y <a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a>(phrasing content)</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td><font><font>Ninguna, tanto la etiqueta de apertura y cierre deben estar presentes</font></font></td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td><font><font>Cualquier elemento que acepte contenido estático o de texto</font></font></td>
+  </tr>
+  <tr>
+   <th scope="row"><font><font>Roles ARIA permitidos</font></font></th>
+   <td><font><font>Cualquiera</font></font></td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td><font><font><a href="https://developer.mozilla.org/es/docs/Web/API/HTMLElement" title="The HTMLElement interface represents any HTML element. Some elements directly implement this interface, others implement it via an interface that inherits it."><code>HTMLElement</code></a></font></font></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 class="highlight-spanned" id="Atributos"><span class="highlight-span">Atributos</span></h2>
+
+<p>Este elemento sólo incluye los <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes">atributos globales</a>.</p>
+
+<h2 class="highlight-spanned" id="Notas_de_uso"><span class="highlight-span">Notas de uso</span></h2>
+
+<ul>
+ <li><font><font>Este elemento debe ser utilizado sólo por razones tipográficas, es decir, cambiar la posición del texto cambia su significado como en matemática </font></font> (por ejemplo la fórmula matemática  <var>f<sup>4</sup></var>, aunque se debe considerar el uso de <a href="https://developer.mozilla.org/en-US/docs/Web/MathML">MathML</a>)  <font><font>o en las abreviaturas francesas </font></font>(por ejemplo M<sup>lle</sup>, M<sup>me</sup> or C<sup>ie</sup>).</li>
+ <li>Este elemento también  se puede encontrar siguiendo palabras o frases. Estas anotaciones indican una entrada bibliográfica y se conocen como "notas al pie."</li>
+ <li>Este elemento no debe ser utilizado para propósitos meramente visuales, como el estilo del logo del software<a class="external external-icon" href="https://es.wikipedia.org/wiki/LaTeX"> LaTeX</a> <a href="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png"><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png" style="height: 23px; vertical-align: bottom; width: 56px;"></a>. En ese caso debe usarse la propiedad de <a href="https://developer.mozilla.org/en-US/docs/CSS" title="en/CSS">CSS</a> <code>vertical-align</code>  para lograr el mismo efecto.</li>
+</ul>
+
+<h2 class="highlight-spanned" id="Ejemplos"><span class="highlight-span">Ejemplos</span></h2>
+
+<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Este texto es <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>sup</span><span class="punctuation token">&gt;</span></span>superíndice<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>sup</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span></code></pre>
+
+<h4 id="Resultado">Resultado</h4>
+
+<p>Este texto es <sup>superíndice</sup></p>
+
+<pre class="brush: html">&lt;p&gt;Notas al pie&lt;sup&gt;<sup>1</sup>&lt;/sup&gt;&lt;/p&gt;
+</pre>
+
+<h4 id="Resultado_2">Resultado</h4>
+
+<p>Notas al pie<sup>1</sup></p>
+
+<h2 class="highlight-spanned" id="Especificaciones"><span class="highlight-span">Especificaciones</span></h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><a class="external external-icon" href="https://html.spec.whatwg.org/multipage/semantics.html#the-sub-and-sup-elements" hreflang="en" lang="en">HTML Living Standard<br>
+    <small lang="es">The definition of '&lt;sub&gt; and &lt;sup&gt;' in that specification.</small></a></td>
+   <td><span class="spec-Living">Living Standard</span></td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td><a class="external external-icon" href="http://www.w3.org/TR/html5/textlevel-semantics.html#the-sub-and-sup-elements" hreflang="en" lang="en">HTML5<br>
+    <small lang="es">The definition of '&lt;sub&gt; and &lt;sup&gt;;' in that specification.</small></a></td>
+   <td><span class="spec-REC">Recommendation</span></td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_navegadores">Compatibilidad navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.sup")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El elemento HTML <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/sub">&lt;sub&gt;</a> produce subíndices. Tenga en cuenta que no puedes usar &lt;sup&gt;  y &lt;sub&gt;  ambos al mismo tiempo y necesita usar <a href="https://developer.mozilla.org/en-US/docs/MathML" title="en/MathML">MathML</a> para producir un superíndice y un subíndice al lado del símbolo químico de un elemento, que representa su número atómico y su número nuclear.
+
+  <p><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/db/Element_identity.png/220px-Element_identity.png" style="height: 63px; width: 63px;"></p>
+ </li>
+ <li>Los elementos MathML<a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msub" title="en/MathML/Element/msub"><code>&lt;msub&gt;</code></a>, <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msup" title="en/MathML/Element/msup"><code>&lt;msup&gt;</code></a>, y <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msubsup" title="en/MathML/Element/msubsup"><code>&lt;msubsup&gt;</code></a> .</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/table/index.html b/files/es/web/html/element/table/index.html
new file mode 100644
index 0000000000..29318c7f70
--- /dev/null
+++ b/files/es/web/html/element/table/index.html
@@ -0,0 +1,526 @@
+---
+title: tabla
+slug: Web/HTML/Element/table
+translation_of: Web/HTML/Element/table
+original_slug: Web/HTML/Elemento/table
+---
+<h2 id="Resumen">Resumen</h2>
+<p>El <em>Elemento de Tabla HTML</em> (<code>&lt;table&gt;</code>) representa datos en dos o mas dimensiones.</p>
+<div class="note">
+  <strong>Nota: </strong>Antes de la creación de <a href="/es/docs/CSS" title="CSS">CSS</a>, los elementos HTML {{HTMLElement("table")}} eran frecuentemente utilizados para la disposición (posicionamiento) de una página. Este uso ha sido desalentado desde HTML 4, y el elemento <span style="font-weight: bold;">no debe</span> ser usado para dichos fines.</div>
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+<table class="standard-table">
+  <tbody>
+    <tr>
+      <td><a href="/es/docs/HTML/Content_categories" title="HTML/Content categories">Categoria del contenido</a></td>
+      <td><a href="/es/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flujo del contenido</a></td>
+    </tr>
+    <tr>
+      <td>Contenido permitido</td>
+      <td>
+        <div class="content-models">
+          <div id="table-mdls">
+            En este orden:
+            <ul>
+              <li>un elemento opcional {{HTMLElement("caption")}},</li>
+              <li>cero o mas elementos {{HTMLElement("colgroup")}},</li>
+              <li>un elemento opcional {{HTMLElement("thead")}},</li>
+              <li>una de las dos alternativas:
+                <ul>
+                  <li>un elemento {{HTMLElement("tfoot")}}, seguido por:
+                    <ul>
+                      <li>cero o mas elementos {{HTMLElement("tbody")}},</li>
+                      <li>o uno o mas elementos {{HTMLElement("tr")}},</li>
+                    </ul>
+                  </li>
+                  <li>una segunda alternativa seguida por un elemento opcional {{HTMLElement("tfoot")}}:
+                    <ul>
+                      <li>cualquier cero o mas elementos {{HTMLElement("tbody")}},</li>
+                      <li>uno o mas elementos {{HTMLElement("tr")}}</li>
+                    </ul>
+                  </li>
+                </ul>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </td>
+    </tr>
+    <tr>
+      <td>Omisión de etiqueta</td>
+      <td>Ninguna, ambas la <span title="syntax-start-tag">etiqueta de inicio</span> y <span title="syntax-end-tag">de fin</span> son obligatorias</td>
+    </tr>
+    <tr>
+      <td>Elementos padre permitidos</td>
+      <td>cualquier elemento que acepte elementos de flujo</td>
+    </tr>
+    <tr>
+      <td>Documento normativo</td>
+      <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#the-table-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#the-table-element">HTML5, section 4.9.1</a> (<a class="external" href="http://www.w3.org/TR/REC-html40/struct/tables.html#edef-TABLE" title="http://www.w3.org/TR/REC-html40/struct/tables.html#edef-TABLE">HTML4.01, section 11.2.1</a>)</td>
+    </tr>
+  </tbody>
+</table>
+<h3 id="Atributos">Atributos</h3>
+<p>Al igual que otros elementos HTML, este elemento también soporta <a href="/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">atributos globales</a>.</p>
+<dl>
+  <dt>
+    {{htmlattrdef("align")}} {{Deprecated_inline}}</dt>
+  <dd>
+     Este atributo enumerativo indica como va a encontrarse alineada la tabla respecto al contenido del documento en cuestión, pudiendo tener los siguientes valores:
+    <ul>
+      <li><span>left</span>,significa que la tabla será mostrada a la izquierda del documento;</li>
+      <li><span>center</span>, significa que la tabla será mostrada al centro del documento;</li>
+      <li><span>right</span>, significa que la tabla será mostrada a la derecha del documento.</li>
+    </ul>
+    <div class="note">
+      <strong>Nota: </strong>
+      <ul>
+        <li><strong>No usar este atributo</strong>, ya que ha sido declarado obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. A fin de dar un efecto similar al atributo <span>align</span>, las propiedades {{cssxref("text-align")}} y {{cssxref("vertical-align")}} deben ser usadas.</li>
+        <li>Antes de la version 4 de Firefox, este ya soportaba sólo en el modo quirks (compatibilidad con navegadores antiguos) los valores <code>middle</code>, <code>absmiddle</code>, and <code>abscenter</code> como sinónimos de <code>center</code><em>.  </em></li>
+      </ul>
+    </div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("bgcolor")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo define el color de fondo de la tabla . Es un código hexadecimal como el dado en el formato <a class="external" href="http://www.w3.org/Graphics/Color/sRGB" title="http://www.w3.org/Graphics/Color/sRGB">sRGB</a> (bajo el prefijo '#'). Uno de los 16 colores predefinidos podía ser usado:
+    <table>
+      <tbody>
+        <tr>
+          <td style="width: 24px; background-color: black;"> </td>
+          <td><span>black (negro)</span> = "#000000"</td>
+          <td style="width: 24px; background-color: green;"> </td>
+          <td><span>green (verde)</span> = "#008000"</td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: silver;"> </td>
+          <td><span>silver (plata)</span> = "#C0C0C0"</td>
+          <td style="width: 24px; background-color: lime;"> </td>
+          <td><span>lime (lima)</span> = "#00FF00"</td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: gray;"> </td>
+          <td><span>gray (gris)</span> = "#808080"</td>
+          <td style="width: 24px; background-color: olive;"> </td>
+          <td><span>olive (oliva)</span> = "#808000"</td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: white;"> </td>
+          <td><span>white (blanco)</span> = "#FFFFFF"</td>
+          <td style="width: 24px; background-color: yellow;"> </td>
+          <td><span>yellow (amarillo)</span> = "#FFFF00"</td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: maroon;"> </td>
+          <td><span>maroon (marrón)</span> = "#800000"</td>
+          <td style="width: 24px; background-color: navy;"> </td>
+          <td><span>navy (azul marino)</span> = "#000080"</td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: red;"> </td>
+          <td><span>red (rojo)</span> = "#FF0000"</td>
+          <td style="width: 24px; background-color: blue;"> </td>
+          <td><span>blue (azul)</span> = "#0000FF"</td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: purple;"> </td>
+          <td><span>purple (púrpura)</span> = "#800080"</td>
+          <td style="width: 24px; background-color: teal;"> </td>
+          <td><span>teal (verde esmeralda)</span> = "#008080"</td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: fuchsia;"> </td>
+          <td><span>fuchsia (fucsia)</span> = "#FF00FF"</td>
+          <td style="width: 24px; background-color: aqua;"> </td>
+          <td><span>aqua (verde agua)</span> = "#00FFFF"</td>
+        </tr>
+      </tbody>
+    </table>
+    <div class="note">
+      <strong>Nota de uso: </strong>No usar este atributo, dado que ha sido declarado obsoleto. El elemento {{HTMLElement("table")}} debe ser estilizado utilizando <a href="/es/docs/CSS" title="CSS">CSS</a>. A fin de dar un efecto similar al atributo <span>bgcolor</span>, la propiedad <a href="/es/docs/CSS" title="CSS">CSS</a> {{cssxref("background-color")}} debe ser usada.</div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("border")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo entero define el tamaño del cuadro alrededor de la tabla . Si estuviese puesta en <span>0</span>, implicaría que dicho atributo sería <span>nulo</span>.
+    <div class="note">
+      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. A fin de dar un efecto similar al atributo, las propiedades CSS nativas {{cssxref("border")}}, {{cssxref("border-color")}}, {{cssxref("border-width")}} y {{cssxref("border-style")}} deben ser usadas.</div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("cellpadding")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo define el espacio entre el contenido de una celda y su borde (mostrado o no), si fuese la longitud de un pixel, dicho espacio será aplicado en los 4 costados, caso que fuese un porcentaje, el contenido será centrado y todo el espacio vertical representará a este porcentaje. Lo mismo será válido para todo el espacio horizontal
+    <div class="note">
+      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>border</span>, use la propiedad CSS {{cssxref("border-collapse")}} con el valor collapse en el mismo elemento {{HTMLElement("table")}}, y la propiedad {{cssxref("padding")}} en el elemento {{HTMLElement("td")}}.</div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("cellspacing")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo define el espacio entre el contenido de una celda y su borde (mostrado o no), si fuese la longitud de un pixel, dicho espacio será aplicado en los 4 costados, caso que fuese un porcentaje, el contenido será centrado y todo el espacio vertical representará a este porcentaje. Lo mismo será válido para todo el espacio horizontal.
+    <div class="note">
+      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>border</span>, use la propiedad {{cssxref("border-collapse")}} con el valor collapse en el mismo elemento {{HTMLElement("table")}}, y la propiedad {{cssxref("margin")}} en el elemento {{HTMLElement("td")}}.</div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("frame")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo enumerativo define cual lado del cuadro alrededor de la tabla será mostrada. Puede tener los siguientes valores:
+    <table style="width: 668px;">
+      <tbody>
+        <tr>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>above</span></td>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>below</span></td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>hsides</span></td>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>vsides</span></td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>lhs</span></td>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>rhs</span></td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>border</span></td>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>box</span></td>
+        </tr>
+        <tr>
+          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
+          <td><span>void</span></td>
+        </tr>
+      </tbody>
+    </table>
+    <div class="note">
+      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>frame</span> use las propiedades CSS {{cssxref("border-style")}} y {{cssxref("border-width")}}.</div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("rules")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo enumerativo define donde aparecen las reglas en la tabla, por ejemplo líneas. Puede tener los siguientes valores:
+    <ul>
+      <li><span>none</span>, indica que ninguna regla se mostrará, es el valor por defecto;</li>
+      <li><span>groups</span>, mostrará el número de reglas a mostrarse entre grupos de filas (defined by the {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} y {{HTMLElement("tfoot")}} elements) y entre grupos de columnas (defined by the {{HTMLElement("col")}} y {{HTMLElement("colgroup")}} elements) solamente;</li>
+      <li><span>rows</span>, que mostrará las reglas entre filas;</li>
+      <li><span>columns</span>, que mostrará las reglas entre columnas;</li>
+      <li><span>all</span>, que mostrará las reglas entre filas y columnas.</li>
+    </ul>
+    <div class="note">
+      <strong>Nota</strong>:
+      <ul>
+        <li>El estilo de las reglas depende del navegador usado y no puede ser modificado.</li>
+        <li>Nota de uso: No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Use la propiedad {{cssxref("border")}} en los elementos adecuados {{HTMLElement("thead")}}, {{HTMLElement("tbody")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("col")}} o {{HTMLElement("colgroup")}}.</li>
+      </ul>
+    </div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("summary")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo define un texto alternativo para describir una tabla en un usuario incapaz de mostrarlo, corrientemente contiene una descripcion de él que posibilita a discapacitaos visulaes (como invidentes navegando en pantallas braile) a obtener la información que necesitan.Si la información añadida en este atributo puede ser útil a otras personas, considere el utilizar el elemento {{HTMLElement("caption")}} en vez de este. instead. El atributo de resumen no es obligatorio usuarlo, pudiendo ser omitido si un elemento {{HTMLElement("caption")}} realiza similar labor.<br>
+    <div class="note">
+      <strong>Nota de uso: </strong>No use este atributo, dado que ha sido declarado obsoleto. En su lugar, use alguna de estas formas de describir una tabla:
+      <ul>
+        <li>En prosa, rodeando la tabla (esta es la forma menos semántica de lograrlo).</li>
+        <li>En el elemento {{HTMLElement("caption")}} de la tabla.</li>
+        <li>En un elemento {{HTMLElement("details")}}, dentro del elemento {{HTMLElement("caption")}} de la tabla.</li>
+        <li>Incluye el elemento {{HTMLElement("table")}} en un elemento {{HTMLElement("figure")}} y añada la descripción en prosa al lado de él.</li>
+        <li>Incluya el elemento {{HTMLElement("table")}} en un elemento {{HTMLElement("figure")}} y añada la descripción en prosa dentro de un elemento {{HTMLElement("figcaption")}}.</li>
+        <li>Ajuste la tabla de manera que la descripción no sea necesaria, usando los elementos {{HTMLElement("th")}} y {{HTMLElement("thead")}} por ejemplo.</li>
+      </ul>
+    </div>
+  </dd>
+</dl>
+<dl>
+  <dt>
+    {{htmlattrdef("width")}} {{Deprecated_inline}}</dt>
+  <dd>
+    Este atributo define el ancho de una tabla, pudiendo contener una longitud de píxeles o un porcentaje, que representa un porcentaje de anchura del contenedor que la tabla debiera usar.
+    <div class="note">
+      No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>frame</span> use la propiedad CSS {{cssxref("width")}} en su lugar.</div>
+  </dd>
+</dl>
+<h3 id="Interfaz_DOM">Interfaz DOM</h3>
+<p>Este elemento implementa la interfaz <code><a href="/es/docs/DOM/HTMLTableElement" title="DOM/HTMLTableElement">HTMLTableElement</a></code>.</p>
+<h3 id="Ejemplos">Ejemplos</h3>
+<pre class="brush: html">&lt;!-- Simple table --&gt;
+&lt;table&gt;
+  &lt;tr&gt;
+    &lt;td&gt;John&lt;/td&gt;
+    &lt;td&gt;Doe&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Jane&lt;/td&gt;
+    &lt;td&gt;Doe&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;
+
+&lt;!-- Simple table with header --&gt;
+&lt;table&gt;
+  &lt;tr&gt;
+    &lt;th&gt;First name&lt;/th&gt;
+    &lt;th&gt;Last name&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;John&lt;/td&gt;
+    &lt;td&gt;Doe&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Jane&lt;/td&gt;
+    &lt;td&gt;Doe&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;
+
+&lt;!-- Table with thead, tfoot, and tbody --&gt;
+&lt;table&gt;
+  &lt;thead&gt;
+    &lt;tr&gt;
+      &lt;th&gt;Header content 1&lt;/th&gt;
+      &lt;th&gt;Header content 2&lt;/th&gt;
+    &lt;/tr&gt;
+  &lt;/thead&gt;
+  &lt;tfoot&gt;
+    &lt;tr&gt;
+      &lt;td&gt;Footer content 1&lt;/td&gt;
+      &lt;td&gt;Footer content 2&lt;/td&gt;
+    &lt;/tr&gt;
+  &lt;/tfoot&gt;
+  &lt;tbody&gt;
+    &lt;tr&gt;
+      &lt;td&gt;Body content 1&lt;/td&gt;
+      &lt;td&gt;Body content 2&lt;/td&gt;
+    &lt;/tr&gt;
+  &lt;/tbody&gt;
+&lt;/table&gt;
+
+&lt;!-- Table with colgroup --&gt;
+&lt;table&gt;
+  &lt;colgroup span="4" class="columns"&gt;&lt;/colgroup&gt;
+  &lt;tr&gt;
+    &lt;th&gt;Countries&lt;/th&gt;
+    &lt;th&gt;Capitals&lt;/th&gt;
+    &lt;th&gt;Population&lt;/th&gt;
+    &lt;th&gt;Language&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;USA&lt;/td&gt;
+    &lt;td&gt;Washington D.C.&lt;/td&gt;
+    &lt;td&gt;309 million&lt;/td&gt;
+    &lt;td&gt;English&lt;/td&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Sweden&lt;/td&gt;
+    &lt;td&gt;Stockholm&lt;/td&gt;
+    &lt;td&gt;9 million&lt;/td&gt;
+    &lt;td&gt;Swedish&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;
+
+&lt;!-- Table with colgroup and col --&gt;
+&lt;table&gt;
+  &lt;colgroup&gt;
+    &lt;col class="column1"&gt;
+    &lt;col class="columns2plus3" span="2"&gt;
+  &lt;/colgroup&gt;
+  &lt;tr&gt;
+    &lt;th&gt;Lime&lt;/th&gt;
+    &lt;th&gt;Lemon&lt;/th&gt;
+    &lt;th&gt;Orange&lt;/th&gt;
+  &lt;/tr&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Green&lt;/td&gt;
+    &lt;td&gt;Yellow&lt;/td&gt;
+    &lt;td&gt;Orange&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;
+
+&lt;!-- Simple table with caption --&gt;
+&lt;table&gt;
+  &lt;caption&gt;Awesome caption&lt;/caption&gt;
+  &lt;tr&gt;
+    &lt;td&gt;Awesome data&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/table&gt;
+</pre>
+<h4 id="Resultado">Resultado</h4>
+
+<table class="standard-table">
+  <tbody>
+    <tr>
+      <td>John</td>
+      <td>Doe</td>
+    </tr>
+    <tr>
+      <td>Jane</td>
+      <td>Doe</td>
+    </tr>
+  </tbody>
+</table>
+
+<table class="standard-table">
+  <tbody>
+    <tr>
+      <th>First name</th>
+      <th>Last name</th>
+    </tr>
+    <tr>
+      <td>John</td>
+      <td>Doe</td>
+    </tr>
+    <tr>
+      <td>Jane</td>
+      <td>Doe</td>
+    </tr>
+  </tbody>
+</table>
+
+<table class="standard-table">
+  <thead>
+    <tr>
+      <th>Header content 1</th>
+      <th>Header content 2</th>
+    </tr>
+  </thead>
+  <tfoot>
+    <tr>
+      <td>Footer content 1</td>
+      <td>Footer content 2</td>
+    </tr>
+  </tfoot>
+  <tbody>
+    <tr>
+      <td>Body content 1</td>
+      <td>Body content 2</td>
+    </tr>
+  </tbody>
+</table>
+
+<table class="standard-table">
+  <colgroup>
+  </colgroup>
+  <tbody>
+    <tr>
+      <th>Countries</th>
+      <th>Capitals</th>
+      <th>Population</th>
+      <th>Language</th>
+    </tr>
+    <tr>
+      <td>USA</td>
+      <td>Washington D.C.</td>
+      <td>309 million</td>
+      <td>English</td>
+    </tr>
+    <tr>
+      <td>Sweden</td>
+      <td>Stockholm</td>
+      <td>9 million</td>
+      <td>Swedish</td>
+    </tr>
+  </tbody>
+</table>
+
+<table class="standard-table">
+  <colgroup>
+    <col class="column1">
+    <col class="columns2plus3">
+  </colgroup>
+  <tbody>
+    <tr>
+      <th>Lime</th>
+      <th>Lemon</th>
+      <th>Orange</th>
+    </tr>
+    <tr>
+      <td>Green</td>
+      <td>Yellow</td>
+      <td>Orange</td>
+    </tr>
+  </tbody>
+</table>
+
+<table class="standard-table">
+  <caption>
+    Awesome caption</caption>
+  <tbody>
+    <tr>
+      <td>Awesome data</td>
+    </tr>
+  </tbody>
+</table>
+<h3 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h3>
+<p>{{CompatibilityTable}}</p>
+<div id="compat-desktop">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Característica</th>
+        <th>Chrome</th>
+        <th>Firefox (Gecko)</th>
+        <th>Internet Explorer</th>
+        <th>Opera</th>
+        <th>Safari</th>
+      </tr>
+      <tr>
+        <td>Soporte básico</td>
+        <td>1.0</td>
+        <td>{{CompatGeckoDesktop("1")}}</td>
+        <td>4.0</td>
+        <td>7.0</td>
+        <td>1.0</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<div id="compat-mobile">
+  <table class="compat-table">
+    <tbody>
+      <tr>
+        <th>Característica</th>
+        <th>Android</th>
+        <th>Firefox Mobile (Gecko)</th>
+        <th>IE Mobile</th>
+        <th>Opera Mobile</th>
+        <th>Safari Mobile</th>
+      </tr>
+      <tr>
+        <td>Soporte básico</td>
+        <td>1.0</td>
+        <td>{{CompatGeckoMobile("1")}}</td>
+        <td>6.0</td>
+        <td>6.0</td>
+        <td>1.0</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+<h3 id="Consulte_también">Consulte también</h3>
+<ul>
+  <li>Otros elementos HTML relacionados a tablas: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}};</li>
+  <li>Propiedades CSS que pueden ser especialmente útiles para estilizar el elemento <span style="font-family: Courier New;">&lt;table&gt;</span>:
+    <ul>
+      <li>{{cssxref("width")}} para controlar el ancho de la tabla;</li>
+      <li>{{cssxref("border")}}, {{cssxref("border-style")}}, {{cssxref("border-color")}}, {{cssxref("border-width")}}, {{cssxref("border-collapse")}}, {{cssxref("border-spacing")}} para controlar el aspecto de los bordes de las celdas, reglas y marco;</li>
+      <li>{{cssxref("margin")}} y {{cssxref("padding")}} para estilizar el contenido individual de las celdas;</li>
+      <li>{{cssxref("text-align")}} y {{cssxref("vertical-align")}} para definir la alineación del contenido y del texto de las celdas.</li>
+    </ul>
+  </li>
+</ul>
diff --git a/files/es/web/html/element/td/index.html b/files/es/web/html/element/td/index.html
new file mode 100644
index 0000000000..015625a6de
--- /dev/null
+++ b/files/es/web/html/element/td/index.html
@@ -0,0 +1,311 @@
+---
+title: <td>
+slug: Web/HTML/Element/td
+translation_of: Web/HTML/Element/td
+original_slug: Web/HTML/Elemento/td
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento <a href="/es/docs/Web/HTML">HTML</a> <em>Celda de tabla</em> (<strong><code>&lt;td&gt;</code></strong>) define la celda de una tabla que contiene datos. Esta participa en el <em>modelo de tablas</em>.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
+   <td>Ninguna.</td>
+  </tr>
+  <tr>
+   <th>Contenido permitido</th>
+   <td>Contenido dinámico.</td>
+  </tr>
+  <tr>
+   <th>Omision de Etiquetas</th>
+   <td>La <span title="syntax-etiqueta-de-inicio">etiqueta de inicio</span> es obligatoria.<br>
+    La etiqueta final puede ser omitida, si esta inmediatamente seguida por un elemento {{HTMLElement("th")}} o un {{HTMLElement("td")}} o si no hay más datos en el elemento padre.</td>
+  </tr>
+  <tr>
+   <th>Elementos padre permitidos</th>
+   <td>Un elemento {{HTMLElement("tr")}}.</td>
+  </tr>
+  <tr>
+   <th>Documento normativo</th>
+   <td><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#the-td-element" rel="external">HTML5, section 4.9.9</a> (<a href="http://www.w3.org/TR/REC-html40/struct/tables.html#h-11.2.6">HTML4.01, section 11.2.6</a>)</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("abbr")}} {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Este atributo contiene un pequeña descripción abreviada del contenido de la celda. Algunos agentes de usuario, como los lectores de voz, pueden presentar esta descripción antes que el propio contenido.
+ <div class="note"><strong>Nota:</strong> No usar este atributo ya que esta obsoleto en la ultima version del estandar.  Como alternativa, puedes poner una descripción abreviada dentro de la celda y colocar el contenido largo en el atributo <strong>title</strong>.</div>
+ </dd>
+ <dt>{{htmlattrdef("align")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
+ <dd>Este atributo especifíca la posición horizontal del contenido de la celda, los valores de la misma pueden ser:
+ <ul>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">Izquierda</font>, alínea el contenido de la celda a la izquierda</li>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">Centro</font>, centra el contenido de una celda</li>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">Derecha</font>, alínea el contenido de la celda a la derecha</li>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">Justificado</font>, inserta espacios en el texto para que el contenido se ajuste a la celda</li>
+  <li><code>char</code>, alinear el contenido a un caracter especial definido por los atributos {{htmlattrxref("char", "td")}} y {{htmlattrxref("charoff", "td")}} {{unimplemented_inline(2212)}}.</li>
+ </ul>
+
+ <p>Si este atributo no se define, se selecciona por defecto <code>left</code></p>
+
+ <div class="note"><strong>Nota:</strong> No usar este atributo ya que esta obsoleto en la ultima version.
+
+ <ul>
+  <li>Para lograr el mismo efecto de los valores <code>left</code>, <code>center</code>, <code>right</code>, o <code>justify</code> , usa la propiedad CSS {{cssxref("text-align")}} en el.</li>
+  <li>Para lograr el mismo efecto que el valor <code>char</code> , en CSS3,puedes usar el valor de la {{htmlattrxref("char", "td")}} como el valor de la propiedad {{cssxref("text-align")}}  {{unimplemented_inline}}.</li>
+ </ul>
+ </div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("axis")}} {{obsolete_inline}} en {{HTMLVersionInline(5)}}</dt>
+ <dd>
+ <pre dir="ltr" id="tw-target-text">Este atributo contiene una lista de cadenas separadas por espacios . Cada cadena es el ID de un grupo de celdas a las que esta cabecera se aplica.</pre>
+
+ <div class="note"><strong>Nota: </strong>No usar este atributo ya que esta obsoleto en la ultima version. En su lugar use el atributo {{htmlattrxref("scope", "td")}} .</div>
+ </dd>
+ <dt>{{htmlattrdef("bgcolor")}} {{Non-standard_inline}}</dt>
+ <dd>
+ <pre dir="ltr" id="tw-target-text">Este atributo define el color de fondo de cada celda de la columna. Es uno de los códigos de 6 dígitos hexadecimales como se definen en sRGB , prefijado por un '# ' . Una de las cadenas de color predefinidos dieciséis se pueden utilizar :</pre>
+
+ <table style="width: 80%;">
+  <tbody>
+   <tr>
+    <td style="background-color: black; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Negro</code> = "#000000"</td>
+    <td style="background-color: green; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td>Verde = "#008000"</td>
+   </tr>
+   <tr>
+    <td style="background-color: silver; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><font face="Consolas, Liberation Mono, Courier, monospace">Plata</font> = "#C0C0C0"</td>
+    <td style="background-color: lime; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Lima</code> = "#00FF00"</td>
+   </tr>
+   <tr>
+    <td style="background-color: gray; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><font face="Consolas, Liberation Mono, Courier, monospace">Gris</font> = "#808080"</td>
+    <td style="background-color: olive; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><font face="Consolas, Liberation Mono, Courier, monospace">Oliva</font> = "#808000"</td>
+   </tr>
+   <tr>
+    <td style="background-color: white; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><font face="Consolas, Liberation Mono, Courier, monospace">Blanco</font> = "#FFFFFF"</td>
+    <td style="background-color: yellow; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><font face="Consolas, Liberation Mono, Courier, monospace">Amarillo</font> = "#FFFF00"</td>
+   </tr>
+   <tr>
+    <td style="background-color: maroon; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Marrón</code> = "#800000"</td>
+    <td style="background-color: navy; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><font face="Consolas, Liberation Mono, Courier, monospace">Marino</font> = "#000080"</td>
+   </tr>
+   <tr>
+    <td style="background-color: red; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Rojo</code> = "#FF0000"</td>
+    <td style="background-color: blue; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Azul</code> = "#0000FF"</td>
+   </tr>
+   <tr>
+    <td style="background-color: purple; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Purpura</code> = "#800080"</td>
+    <td style="background-color: teal; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Verde Azulado</code> = "#008080"</td>
+   </tr>
+   <tr>
+    <td style="background-color: fuchsia; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>Fucsia</code> = "#FF00FF"</td>
+    <td style="background-color: aqua; width: 24px; height: 24px; border: 1px solid black;"> </td>
+    <td><code>agua</code> = "#00FFFF"</td>
+   </tr>
+  </tbody>
+ </table>
+
+ <div class="note">Nota: No usar este atributo ya que esta obsoleto en la ultima version del estandar y solo implementado en algunas versiones de Microsoft Internet Explorer: El elemento {{HTMLElement("td")}} debe ser estilizado en CSS. <br>
+ Para crear un efecto similar en CSS en su lugar use la propiedad {{cssxref("background-color")}}.</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("char")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
+ <dd>
+ <pre dir="ltr" id="tw-target-text">Este atributo se utiliza para establecer el carácter para alinear las celdas de una columna . Los valores típicos de esto incluyen un punto (. ) al intentar alinear los números o valores monetarios . Si { { htmlattrxref ( " align " , " td " ) } } no está ajustado a char, este atributo se ignora.</pre>
+
+ <div class="note"><strong>Note: </strong>No usar este atributo ya que está obsoleto (y no soportado) en las últimas versiones estándares).  Para lograr el mismo que el {{htmlattrxref("char", "thead")}}, en CSS3, puedes usar el character set usando el atributo {{htmlattrxref("char", "th")}} como el valor de la propiedad {{cssxref("text-align")}}  {{unimplemented_inline}}.</div>
+ </dd>
+ <dt>{{htmlattrdef("charoff")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
+ <dd><br>
+ Este atributo se utiliza para indicar el número de caracteres para compensar los datos de la columna de los personajes de alineación especificado por el atributo de carbón .
+ <div class="note">Nota: No usar este atributo ya que esta obsoleto en la ultima version del estandar,</div>
+ </dd>
+ <dt>{{htmlattrdef("colspan")}}</dt>
+ <dd>
+ <pre dir="ltr" id="tw-target-text">Este atributo contiene un valor entero no negativo que indica por el número de columnas se extiende la célula. Su valor por defecto es 1 ; si su valor se establece en 0 , se extiende hasta el final de la { { HTMLElement ( " colgroup " ) } } , aunque implícitamente definido , que la célula pertenece. Los valores superiores a 1000 serán consideradas como incorrectas y se establecen en el valor predeterminado ( 1 ) .</pre>
+
+ <div class="note"><strong>Nota: En</strong> {{HTMLVersionInline(5)}} este atributo solo acepta valores mayores que 0 this attribute only accepts values greater than zero since it <a href="http://dev.w3.org/html5/spec/single-page.html#attr-tdth-colspan">must not be used to overlap cells</a>. Además, Firefox is the only browser to support the 0 value as defined in the {{HTMLVersionInline(4.01)}} specification.</div>
+ </dd>
+ <dt>{{htmlattrdef("headers")}}</dt>
+ <dd><br>
+ Este atributo contiene una lista de cadenas separadas por espacios , cada uno correspondiente al atributo ID de la { { HTMLElement ( "th" ) } } elementos que se aplican a este elemento.</dd>
+ <dt>{{htmlattrdef("rowspan")}}</dt>
+ <dd><br>
+ Este atributo contiene un valor entero no negativo que indica a cuántas filas se extiende la célula. Su valor por defecto es 1 ; si su valor se establece en 0 , se extiende hasta el final de la sección de la tabla ( { { HTMLElement ( " culata en T " ) } } , { { HTMLElement ( " tbody " ) } } , { { HTMLElement ( " tfoot " ) } } , incluso si define implícitamente , que la célula pertenece. los valores superiores a 65534 se recortan hasta 65534 .</dd>
+ <dt>{{htmlattrdef("scope")}} {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
+ <dd> </dd>
+ <dt>{{htmlattrdef("valign")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
+ <dd><br>
+ Este atributo especifica la alineación vertical del texto dentro de cada fila de células de la cabecera de la tabla . Los valores posibles para este atributo son :
+ <ul>
+  <li><code>baseline</code>,<span style="background-color: #fafbfc; font-family: consolas,monaco,andale mono,monospace; font-size: 1rem; line-height: 19px; white-space: pre;"> pondrá el texto tan cerca del fondo de la celda , ya que es posible, pero alinearlo en la línea de base de los caracteres en lugar de la parte inferior de ellos. Si los caracteres son todos del mismo tamaño , esto tiene el mismo efecto que la parte inferior.</span></li>
+  <li><code>bottom</code>,  pondrá el texto tan cerca del fondo de la celda , ya que es posible</li>
+  <li><code>middle</code>, centra el texto de la celda</li>
+  <li>and <code>top</code>, pone el texto como cerca de la parte superior de la celda como es posible .</li>
+ </ul>
+
+ <div class="note"><strong>Note: </strong>Do not use this attribute as it is obsolete (and not supported) in the latest standard: instead set the CSS {{cssxref("vertical-align")}} property on it.</div>
+ </dd>
+ <dt>{{htmlattrdef("width")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}</dt>
+ <dd><br>
+ Este atributo se utiliza para definir una anchura de celda recomendada. Propiedades CELLSPACING y cellpadding pueden añadir espacio adicional, y el elemento { { HTMLElement ( "col " ) } } anchura pueden también tener algún efecto . En general, si el ancho de una columna es demasiado estrecha para mostrar una célula particular correctamente, y por lo tanto las células en el mismo, se puede ensanchar cuando se muestra .</dd>
+ <dd>
+ <div class="note"><strong>Note: </strong>Do not use this attribute in the latest standard: instead set the CSS {{cssxref("width")}} property.</div>
+ </dd>
+</dl>
+
+<h2 id="DOM_interfaz">DOM interfaz</h2>
+
+<p> </p>
+
+<p>Este elemento implementa el interfaz {{domxref("HTMLTableDataCellElement")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p> </p>
+
+<p>Por favor, ver la página {{HTMLElement("table")}} para ejemplos de <code>&lt;td&gt;</code>.</p>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>align/valign</code> attribute</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>char/charoff</code> attribute</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>colspan</code> attribute with value 0 (extend to the end of the colgroup)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>align/valign</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>char/charoff</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}<sup>[2]</sup></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Otros Elementos HTML relacionados con tablas: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}}.</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/template/index.html b/files/es/web/html/element/template/index.html
new file mode 100644
index 0000000000..5011d952c3
--- /dev/null
+++ b/files/es/web/html/element/template/index.html
@@ -0,0 +1,156 @@
+---
+title: <template>
+slug: Web/HTML/Element/template
+tags:
+  - Plantilla
+translation_of: Web/HTML/Element/template
+original_slug: Web/HTML/Elemento/template
+---
+<p><span class="seoSummary">El <strong>elemento</strong> <strong>HTML <code>&lt;template&gt;</code></strong> es un mecanismo para mantener el contenido </span> <span class="seoSummary">{{Glossary("HTML")}}</span> <span class="seoSummary">del lado del cliente que no se renderiza cuando se carga una página, pero que posteriormente puede ser instanciado durante el tiempo de ejecución empleando JavaScript.</span></p>
+
+<p>Piensa en la plantilla como un fragmento de contenido que está siendo almacenado para un uso posterior en el documento. El analizador procesa el contenido del elemento <strong><code>&lt;template&gt;</code> </strong>durante la carga de la página, pero sólo lo hace para asegurar que esos contenidos son válidos; sin embargo, estos contenidos del elemento no se renderizan.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías de Contenido</a></th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content">Metadata content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a>, <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">phrasing content</a>, script-supporting element</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Sin restricciones</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>Cualquier elemento que acepte <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Metadata_content">metadata content</a>, <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">phrasing content</a>, o <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Script-supporting_elements">script-supporting elements</a>. También se permiten como hijos de un elemento {{HTMLElement("colgroup")}} que no tenga un atributo {{htmlattrxref("span", "colgroup")}} .</td>
+  </tr>
+  <tr>
+   <th scope="row">Implicit ARIA role</th>
+   <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">No corresponding role</a></td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted ARIA roles</th>
+   <td>No <code>role</code> permitted</td>
+  </tr>
+  <tr>
+   <th scope="row">DOM interface</th>
+   <td>{{domxref("HTMLTemplateElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento sólo incluye <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<p>SInembargo, {{domxref("HTMLTemplateElement")}} tiene una propiedad  {{domxref("HTMLTemplateElement.content", "content")}}, que es solo-lectura cuyo  {{domxref("DocumentFragment")}} contiene el subárbol DOM que representa a la plantilla.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Primero empezamos con la parte HTML del ejemplo.</p>
+
+<pre class="brush: html">&lt;table id="producttable"&gt;
+  &lt;thead&gt;
+    &lt;tr&gt;
+      &lt;td&gt;UPC_Code&lt;/td&gt;
+      &lt;td&gt;Product_Name&lt;/td&gt;
+    &lt;/tr&gt;
+  &lt;/thead&gt;
+  &lt;tbody&gt;
+    &lt;!-- datos opcionales pueden incluirse aquí opcionalmente --&gt;
+  &lt;/tbody&gt;
+&lt;/table&gt;
+
+&lt;template id="productrow"&gt;
+  &lt;tr&gt;
+    &lt;td class="record"&gt;&lt;/td&gt;
+    &lt;td&gt;&lt;/td&gt;
+  &lt;/tr&gt;
+&lt;/template&gt;
+</pre>
+
+<p>Inicialmente tenemos una tabla en la cual insertaremos más tarde contenido usando código JavaScript. Más abajo viene el template, el cual describe la estructura de un fragmento HTML representando la fila de una tabla.</p>
+
+<p>Ahora que la tabla ha sido creada y el template definido, usamos JavaScript para insertar filas en la tabla, con cada fila siendo construida usando el template como su base.</p>
+
+<pre class="brush:js;">// Comprobar si el navegador soporta el elemento HTML template element chequeando
+// si tiene el atributo 'content'
+if ('content' in document.createElement('template')) {
+
+  // Instanciar la tabla con el tbody existente
+  // y la fila con el template
+  var t = document.querySelector('#productrow'),
+  td = t.content.querySelectorAll("td");
+  td[0].textContent = "1235646565";
+  td[1].textContent = "Stuff";
+
+  // Clonar la nueva fila e insertarla en la tabla
+  var tb = document.querySelector("tbody");
+  var clone = document.importNode(t.content, true);
+  tb.appendChild(clone);
+
+  // Crear una nueva fila
+  td[0].textContent = "0384928528";
+  td[1].textContent = "Acme Kidney Beans";
+
+  // Clonar la nueva fila e insertarla en la tabla
+  var clone2 = document.importNode(t.content, true);
+  tb.appendChild(clone2);
+
+} else {
+  // Buscar otra manera de añadir filas a la tabla porque el
+  // elemento template no está soportado.
+}
+</pre>
+
+<p>El resultado es la tabla HTML original HTML , con dos nuevas filas adjuntadas via JavaScript:</p>
+
+<div class="hidden">
+<pre class="brush: css">table {
+  background: #000;
+}
+table td {
+  background: #fff;
+}</pre>
+</div>
+
+<p>{{EmbedLiveSample("Examples", 500, 120)}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG','scripting.html#the-template-element','template element')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C','/scripting-1.html#the-template-element','template element')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_navegadores">Compatibilidad navegadores</h2>
+
+
+
+<p>{{Compat("html.elements.template")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Web components: {{HTMLElement("slot")}} (e históríco: {{HTMLElement("shadow")}})</li>
+ <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots">Usando templates y slots</a></li>
+</ul>
diff --git a/files/es/web/html/element/textarea/index.html b/files/es/web/html/element/textarea/index.html
new file mode 100644
index 0000000000..adba30e0f0
--- /dev/null
+++ b/files/es/web/html/element/textarea/index.html
@@ -0,0 +1,182 @@
+---
+title: <textarea>
+slug: Web/HTML/Element/textarea
+tags:
+  - Elemento
+  - Formularios(2)
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/textarea
+original_slug: Web/HTML/Elemento/textarea
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El <strong>elemento</strong> <strong>HTML <code>&lt;textarea&gt; </code></strong>representa un control para la edición mutilínea de texto sin formato.</p>
+
+<h2 id="Contenido_de_Uso">Contenido de Uso</h2>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, <a href="/en-US/docs/HTML/Content_categories#Interactive_content" title="HTML/Content categories#Interactive content">Interactive content</a>, <a href="/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">listed</a>, <a href="/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">labelable</a>, <a href="/en/HTML/Content_categories#form_resettable" title="en/HTML/Content categories#form resettable">resettable</a>, y <a href="/en-US/docs/HTML/Content_categories#Form_submittable" title="HTML/Content categories#Form submittable">submittable</a> <a href="/en-US/docs/HTML/Content_categories#Form-associated_" title="HTML/Content categories#Form-associated ">form-associated</a> elemento</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido Permitido</th>
+   <td>Datos carácter</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que soporta <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz Dom</th>
+   <td>{{domxref("HTMLTextAreaElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento contiene  </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
+
+<dl>
+ <dt>{{htmlattrdef("autocapitalize")}} {{non-standard_inline}}</dt>
+ <dd>Este es un atributo no estándar utilizado por iOS Safari Mobile (y, por lo tanto, también por casi todos los navegadores de iOS, incluyendo Safari, Firefox y Chrome). Controla cuándo y cómo el texto debe ponerse automáticamente en mayúsculas mientras es ingresado/editado por el usuario. Los valores no obsoletos están disponible en iOs 5 y en versiones posteriores. Sus valores posibles son:
+ <ul>
+  <li><code>none</code>: Deshabilita la capitalización automática</li>
+  <li><code>sentences</code>:  Escribe automáticamente con mayúscula la primera letra de cada frase.</li>
+  <li><code>words</code>: Automáticamente escribe con mayúsculas la primera letra de las palabras.</li>
+  <li><code>characters</code>: Automáticamente escribe con mayúscula todos los caracteres.</li>
+  <li><code>on</code>: {{deprecated_inline()}} En desuso desde la versión 5 de iOS.</li>
+  <li><code>off</code>: {{deprecated_inline()}} En desuso desde la versión 5 de iOS.</li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("autocomplete")}} {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo indica si el valor del control puede ser completado automáticamente por el navegador. Los posibles valores son:
+ <ul>
+  <li><code>off</code>: El usuario debe explícitamente introducir el valor del campo para cada uso, o el documento proporciona su propio método de auto-completado; el navegador no completa automáticamente.</li>
+  <li><code>on</code>: El navegador puede completar automáticamente el valor basándose en valores que el usuario haya insertado durante usos previos.</li>
+ </ul>
+
+ <p>Si el atributo <strong>autocomplete</strong> no está definidio en el elemento textarea, entonces  el navegador usa el valor del atributo <strong>autocomplete </strong>del propietario del elemento <code>&lt;textarea&gt;</code> . El propietario del formulario es o bien el elemento form del cual el &lt;textarea&gt; es descendiente o el elemento form cuyo id está especificado en el atributo form del elemento. Para más información, ver  el atributo {{htmlattrxref("autocomplete", "form")}} en {{HTMLElement("form")}}.</p>
+ </dd>
+ <dt>{{ htmlattrdef("autofocus") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>Este atributo booleano te permite especificar que un control de un formulario adquiera el foco cuando se carga la página, salvo que el usuario anule esto , por ejemplo tecleando en un control diferente. Sólo se puede especificar este atributo en los elementos asociados a formularios.</dd>
+ <dt>{{ htmlattrdef("cols") }}</dt>
+ <dd>La anchura visible del control de texto, en caracteres de anchura media. Si está definido debe ser positivo. Si no, por defecto, el valor es 20 (HTML 5).</dd>
+ <dt>{{ htmlattrdef("disabled") }}</dt>
+ <dd>Este atributo booleano indica que el usuario no puede interactuar con el control. Si el atributo no está definido se hereda su valor del elemento en el que está contenido, por ejemplo {{ HTMLElement("fieldset") }}; Si no está dentro de un elemento contenedor con el atributo disable establecido, entonces el control estará habilitado.</dd>
+ <dt>{{ htmlattrdef("form") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>El formulario al cual el elemento textarea está asociado (el propietario del formulario). El valor del atributo debe ser un ID de un elemento formulario del mismo documento. Si no se especifica este atributo, el textarea debe ser un descendiente de un elemento formulario. Permite colocar elementos textarea en cualquier lugar dentro de un documento, no sólo como descendientes de  formularios.</dd>
+ <dt>{{ htmlattrdef("maxlength") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>Indica el número máximo de caracteres  (Unicode code points) que el usuario puede insertar. Si no está especificado entonces el usuario puede insertar un número ilimitado de caracteres.</dd>
+ <dt>{{ htmlattrdef("minlength") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>El mínimo número de caracteres (Unicode code points) que el usuaurio debe insertar.</dd>
+ <dt>{{ htmlattrdef("name") }}</dt>
+ <dd>El nombre del control</dd>
+ <dt>{{ htmlattrdef("placeholder") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>Se puede añadir un indicación para el usuario que defina que se debe insertar en el control. Los retornos de carro y las nuevas líneas dentro lso marcadores de posición deben ser tratado como nuevas líneas al representar dicha indicación.</dd>
+ <dt>{{ htmlattrdef("readonly") }}</dt>
+ <dd>Este atributo booleano indica que el usuario no puede modificar el valor del control. Al contrario que el atributo<code> disable</code>, el atributo <code>readonly </code>no evita que el usuario haga click o seleccione el control. El valor del control read-only si que se envía con el formulario.</dd>
+ <dt>{{ htmlattrdef("required") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>Este atributo indica que el usuario debe rellenar el contro con un valor antes de poder enviar el formulario.</dd>
+ <dt>{{ htmlattrdef("rows") }}</dt>
+ <dd>El número de líneas visibles en el control</dd>
+ <dt>{{ htmlattrdef("selectionDirection") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>La dirección en la que la selección ocurre dentro del control. Es "forward" si la selección ocurre de izquierda a derecha en una localización LTR, o  "backward" si la selección fue hecha en sentido contrario. Puede ser "none" si se desconoce la dirección.</dd>
+ <dt>{{ htmlattrdef("selectionEnd") }}</dt>
+ <dd>El índice del último caracter de la selección actual.</dd>
+ <dt>{{ htmlattrdef("selectionStart") }}</dt>
+ <dd>El índice del primer caracter de la selección actual.</dd>
+ <dt>{{ htmlattrdef("spellcheck") }} {{ HTMLVersionInline(5) }}</dt>
+ <dd>Un valor <code>true</code> en este atributo indica que el elemento necesita tener <code>checked</code> el corrector ortográfico y gramatical. El caloor <code>default</code> indica que el elemento va a comportarse de acuerdo al comportamiento por defecto, basado en el <code>spellcheck</code> del padre. El valor <code>false</code> indica que no se deben hacer esas comprobaciones.</dd>
+ <dt>{{ htmlattrdef("wrap") }} {{ HTMLVersionInline("5") }}</dt>
+ <dd>Indica como el control envuelve al texto. Los posibles valores son:
+ <ul>
+  <li><span style="font-family: courier new;">hard</span>: El navegador insertar automáticamente caracteres de nueva línea (CR+LF) para que ninguna línea tenga más anchura que la del control; el atributo  <code>cols</code> debe estar espeficicado.</li>
+  <li><span style="font-family: courier new;">soft</span>: El navegador asegura que todas las nuevas líneas constan de la pareja de caracteres CR+LF , pero no insertar nuevas líneas adicionales.</li>
+ </ul>
+
+ <p><span style="font-family: courier new;">Soft</span> es el valor por defecto si no se especifica nada.</p>
+ </dd>
+</dl>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa el interfaz <code><a href="/en/DOM/HTMLTextAreaElement" title="en/DOM/textarea">HTMLTextAreaElement</a></code> .</p>
+
+<p>{{ h1_gecko_minversion("Resizable textareas", "2.0") }}</p>
+
+<p>{{ gecko("2.0") }} introduce el soporte para textareas redimensionable. Esto se controla con la propiedad CSS {{ cssxref("resize") }} . Por defecto la posibilidad de redimiensionar el control está habilitada, pero puede ser explícitamente deshabilitada mediante el uso del siguiente CSS:</p>
+
+<pre>textarea {
+  resize: none;
+}
+</pre>
+
+<h2 id="Interacción_con_CSS">Interacción con CSS</h2>
+
+<p>En relación a CSS, un  <code>&lt;textarea&gt;</code>  es un <a href="https://developer.mozilla.org/en-US/docs/CSS/Replaced_element" title="/en-US/docs/CSS/Replaced_element">replaced element</a>. La especificación HTML no define dónde está el punto de referencia de un <code>&lt;textarea&gt;</code>. Así que los diferentes navegadores lo sitúan en diferentes posiciones. En los navegadores basados en Gecko, ese punto de referencia del <code>&lt;textarea&gt;</code> se sitúa en el punto de referencia de la primera línea del <code>&lt;textarea&gt;</code>,  en otro navegadores puede estár situado al final de la caja del <code>&lt;textarea&gt;</code> . Se recomienda no usar {{cssxref("vertical-align")}}<code>: baseline</code> , ya que obtendríamos un comportamiento no impredecible.</p>
+
+<p>Un  <em>textarea</em> tiene dimensiones intrínsecas, como una imagen agrandada.</p>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<h3 id="Contenido_HTML">Contenido HTML </h3>
+
+<pre class="brush: html">&lt;textarea name="textarea" rows="10" cols="50"&gt;Write something here&lt;/textarea&gt;</pre>
+
+<p>{{ EmbedLiveSample('Example','600','200') }}</p>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'the-button-element.html#the-textarea-element', '&lt;textarea&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'forms.html#the-textarea-element', '&lt;textarea&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.7', '&lt;textarea&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("html.elements.textarea")}}</p>
+</div>
+
+
+
+<h2 id="Ver_además">Ver además</h2>
+
+<p>Otros elementos relacionados con formularios: {{ HTMLElement("form") }}, {{ HTMLElement("button") }}, {{ HTMLElement("datalist") }}, {{ HTMLElement("legend") }}, {{ HTMLElement("label") }}, {{ HTMLElement("select") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }} and {{ HTMLElement("meter") }}.</p>
+
+<p>{{ languages( { "fr": "fr/HTML/Element/textarea" } ) }}</p>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/th/index.html b/files/es/web/html/element/th/index.html
new file mode 100644
index 0000000000..4811a8aa20
--- /dev/null
+++ b/files/es/web/html/element/th/index.html
@@ -0,0 +1,329 @@
+---
+title: <th>
+slug: Web/HTML/Element/th
+translation_of: Web/HTML/Element/th
+original_slug: Web/HTML/Elemento/th
+---
+<p><span class="seoSummary">El elemento <strong>HTML <code>&lt;th&gt;</code> </strong>define una celda como encabezado de un grupo de celdas en una tabla. La naturaleza exacta de este grupo está definida por los atributos {{htmlattrxref("scope", "th")}} y {{htmlattrxref("headers", "th")}}.</span></p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Categorías de contenido</a></th>
+   <td>Ninguno</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>
+    <div class="content-models">
+    <div id="table-mdls">Contenido de flujo, pero sin encabezado, pie de página, contenido de seccionamiento, o contenido descendiente de encabezados</div>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiqueta</th>
+   <td>La etiqueta de inicio es obligatoria.<br>
+    La etiqueta de cierre puede ser omitida si es inmediatamente seguida por el elemento {{HTMLElement("th")}} o {{HTMLElement("td")}} o si no hay más datos en su elemento padre.</td>
+  </tr>
+  <tr>
+   <th scope="row">Parents permítidos</th>
+   <td>Un elemento {{HTMLElement("tr")}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles permítdos de ARIA</th>
+   <td>Cualquiera</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLTableHeaderCellElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("abbr")}} {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo contiene una breve descripción del contenido de las celdas. Algunos agentes de usuario (e.g., a speech reader) pueden presentar esta descripción antes que el propio contenido.</dd>
+ <dd>
+ <div class="note"><strong>Nota de uso: </strong>No uses este atributo, ya que se ha vuelto obsoleto en el último estandar. Alternativamente, puedes poner la descripción abreviada dentro de la celda y colocarla el largo contenido en el atributo de <strong>title</strong>.</div>
+ </dd>
+ <dt>{{htmlattrdef("align")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo enumerado especifica cómo se tratará el alineado horizontal de la celda. Los valores posibles son:
+ <ul>
+  <li><code>left</code>: El contenido se alinea a la izquierda de la celda.</li>
+  <li><code>center</code>: El contenido se centra en la celda.</li>
+  <li><code>right</code>:  El contenido se alinea a la derecha de la celda.</li>
+  <li><code>justify</code> (solo con texto): El contenido se alarga para ocupar todo el ancho de la celda.</li>
+  <li><code>char</code> (solo con texto): El contenido es alineado a un caracter dentro de <code>&lt;th&gt;</code> con el offset mínimo. Este caracter esta definido por los atributos {{htmlattrxref("char", "th")}} y {{htmlattrxref("charoff", "th")}}.</li>
+ </ul>
+
+ <p>El valor por defecto cuando no se especifica este atributo es <code>left</code>.</p>
+
+ <div class="note">
+ <p><strong>Nota: </strong>No usar este atributo, ya que está obsoleto en el último estándar.</p>
+
+ <ul>
+  <li>Para lograr el mismo efecto que con los valores <code>left</code>, <code>center</code>, <code>right </code>o <code>justify</code>, aplicar la propiedad CSS {{cssxref("text-align")}} al elemento.</li>
+  <li>Para lograr el mismo efecto que con el valor <code>char</code>, dar a la propiedad {{cssxref("text-align")}} el mismo valor que usarías para {{htmlattrxref("char", "th")}}. {{unimplemented_inline}} in CSS3.</li>
+ </ul>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("axis")}} {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>Este atributo contiene una lista de cadenas separadas por espacios. Cada cadena es el <code>id</code> de un grupo de celdas a las que se les aplica esta cabecera.
+ <div class="note"><strong>Nota: </strong>Este atributo está obsoleto en el último estándar y no debe usarse. Puedes sustituirlo por {{htmlattrxref("scope", "th")}}.</div>
+ </dd>
+ <dt>{{htmlattrdef("bgcolor")}} {{Non-standard_inline}}</dt>
+ <dd>Este atributo define el color de fondo de cada celda en una columna. Consiste en una código hexadecimal de 6 digitos, con un prefijo '#'. Este atributo puede usarse con uno de los 16 colores predefinidos:
+ <table>
+  <tbody>
+   <tr>
+    <td style="background-color: black; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>black</code> = "#000000"</td>
+    <td style="background-color: green; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>green</code> = "#008000"</td>
+   </tr>
+   <tr>
+    <td style="background-color: silver; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>silver</code> = "#C0C0C0"</td>
+    <td style="background-color: lime; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>lime</code> = "#00FF00"</td>
+   </tr>
+   <tr>
+    <td style="background-color: gray; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>gray</code> = "#808080"</td>
+    <td style="background-color: olive; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>olive</code> = "#808000"</td>
+   </tr>
+   <tr>
+    <td style="background-color: white; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>white</code> = "#FFFFFF"</td>
+    <td style="background-color: yellow; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>yellow</code> = "#FFFF00"</td>
+   </tr>
+   <tr>
+    <td style="background-color: maroon; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>maroon</code> = "#800000"</td>
+    <td style="background-color: navy; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>navy</code> = "#000080"</td>
+   </tr>
+   <tr>
+    <td style="background-color: red; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>red</code> = "#FF0000"</td>
+    <td style="background-color: blue; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>blue</code> = "#0000FF"</td>
+   </tr>
+   <tr>
+    <td style="background-color: purple; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>purple</code> = "#800080"</td>
+    <td style="background-color: teal; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>teal</code> = "#008080"</td>
+   </tr>
+   <tr>
+    <td style="background-color: fuchsia; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>fuchsia</code> = "#FF00FF"</td>
+    <td style="background-color: aqua; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
+    <td><code>aqua</code> = "#00FFFF"</td>
+   </tr>
+  </tbody>
+ </table>
+
+ <div class="note"><strong>Nota:</strong> No usar este atributo, ya que no es un estándar y sólo esta implementado en algunas versiones de Microsoft Internet Explorer. El elemento {{HTMLElement("th")}} debe estilizarse usando <a href="/en-US/docs/CSS">CSS</a>. Para crear un efecto similar usa la propiedad {{cssxref("background-color")}}. </div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("char")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>El contenido de la celda se alinea con un caracter en el elemento <code>&lt;th&gt;</code>. Los valores típicos incluyen un punto (.) para alinear números o valores monetarios. Si no se establece {{htmlattrxref("align", "th")}} como char, el atributo es ignorado.
+ <div class="note"><strong>Nota: </strong>No usar este atributo, ya que no está soportado por el último estándar. Para lograr el mismo efecto, puedes especificar el caracter como el primer valor de la propiedad {{cssxref("text-align")}}, {{unimplemented_inline}} en CSS3.</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("charoff")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>This attribute is used to shift column data to the right of the character specified by the <strong>char</strong> attribute. Its value specifies the length of this shift.
+ <div class="note"><strong>Nota: </strong>No usar este atributo, ya que no está soportado por el último estándar.</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("colspan")}}</dt>
+ <dd>This attribute contains a positive integer value that indicates over how many columns a cell is extended. Its default value is <code>1.</code> If its value is set to <code>0</code>, the cell is extended to the last element of the {{HTMLElement("colgroup")}}. Values higher than 1000 are clipped down to 1000.</dd>
+ <dt>{{htmlattrdef("headers")}}</dt>
+ <dd>This attribute contains a list of space-separated strings, each corresponding to the <code>id</code> attributes of other {{HTMLElement("th")}} elements that relate to this element.</dd>
+ <dt>{{htmlattrdef("rowspan")}}</dt>
+ <dd>This attribute contains a positive integer value that indicates over how many rows a cells is extended. Its default value is <code>1.</code> If its value is set to <code>0</code>, the cell is extended to the last element of the table sections ({{HTMLElement("thead")}}, {{HTMLElement("tbody")}} or {{HTMLElement("tfoot")}}). Values higher than 65534 are clipped down to 65534.</dd>
+ <dt>{{htmlattrdef("scope")}}</dt>
+ <dd>This enumerated attribute defines the cells that the header (defined in the {{HTMLElement("th")}}) element relates to. It may have the following values:
+ <ul>
+  <li><code>row</code>:  The header relates to all cells of the row it belongs to.</li>
+  <li><code>col</code>: The header relates to all cells of the column it belongs to.</li>
+  <li><code>rowgroup</code>: The header belongs to a rowgroup and relates to all of its cells. These cells can be placed to the right or the left of the header, depending on the value of the <code><a href="/en-US/docs/Web/HTML/Global_attributes/dir">dir</a></code> attribute in the {{HTMLElement("table")}} element.</li>
+  <li><code>colgroup</code>: The header belongs to a colgroup and relates to all of its cells.</li>
+  <li><code>auto</code></li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("valign")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
+ <dd>This attribute specifies how a text is vertically aligned inside a cell. Possible values for this attribute are:
+ <ul>
+  <li><code>baseline</code>: Positions the text near the bottom of the cell and aligns it with the <a href="https://en.wikipedia.org/wiki/Baseline_%28typography%29">baseline</a> of the characters instead of the bottom. If characters don't descend below the baseline, the baseline value achieves the same effect as <code>bottom</code>.</li>
+  <li><code>bottom</code>: Positions the text near the bottom of the cell.</li>
+  <li><code>middle</code>: Centers the text in the cell.</li>
+  <li>and <code>top</code>: Positions the text near the top of the cell.</li>
+ </ul>
+
+ <div class="note"><strong>Usage Note: </strong>Do not use this attribute as it is no longer supported by the latest standard: use the CSS {{cssxref("vertical-align")}} property instead.</div>
+ </dd>
+ <dt>{{htmlattrdef("width")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}</dt>
+ <dd>This attribute is used to define a recommended cell width.  Additional space can be added with the <a href="/en-US/docs/Web/API/HTMLTableElement/cellSpacing">cellspacing</a> and <a href="/en-US/docs/Web/API/HTMLTableElement/cellPadding">cellpadding</a> properties and the width of the {{HTMLElement("col")}} element can also create extra width. But, if a column's width is too narrow to show a particular cell properly, it will be widened when displayed.
+ <div class="note"><strong>Usage Note: </strong>Do not use this attribute in the latest standard: use the CSS {{cssxref("width")}} property instead.</div>
+ </dd>
+</dl>
+
+<h2 id="Examples">Examples</h2>
+
+<p>See {{HTMLElement("table")}} for examples on <code>&lt;th&gt;</code>.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG','tables.html#the-th-element','th element')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C','tabular-data.html#the-th-element','th element')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>align/valign</code> attribute</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>char/charoff</code> attribute</td>
+   <td>1.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}} [2]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>align/valign</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>char/charoff</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}} [2]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] See {{bug(915)}}.</p>
+
+<p>[2] See {{bug(2212)}}.</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>Other table-related HTML Elements: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}}.</li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/time/index.html b/files/es/web/html/element/time/index.html
new file mode 100644
index 0000000000..45912b8468
--- /dev/null
+++ b/files/es/web/html/element/time/index.html
@@ -0,0 +1,171 @@
+---
+title: time
+slug: Web/HTML/Element/time
+tags:
+  - Elemento
+  - Fecha
+  - HTML
+  - HTML5
+  - Hora
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/time
+original_slug: Web/HTML/Elemento/time
+---
+<p>El <strong>elemento HTML <code>&lt;time&gt;</code></strong> representa un periodo específico en el tiempo. Puede incluir el atributo <code>datetime</code> para convertir las fechas en un formato interno legible por un ordenador, permitiendo mejores resultados en los motores de búsqueda o características personalizadas como recordatorios.</p>
+
+<p>Puede representar uno de los contenidos siguientes:</p>
+
+<ul>
+ <li>Una hora en formato de 24 horas</li>
+ <li>Una fecha precisa en el <a class="external" href="https://es.wikipedia.org/wiki/Calendario_gregoriano">Calendario Gregoriano</a> (con hora y zona horaria opcionales)</li>
+ <li><a href="https://www.w3.org/TR/2014/REC-html5-20141028/infrastructure.html#valid-duration-string">Un periodo de tiempo válido</a></li>
+</ul>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/time.html", "tabbed-standard")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo está almacenada en un repositorio de GitHub. Si desea contribuir al projecto, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíe su solicitud de extracción (pull request).</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías de contenido</a></th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>, contenido palpable.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content">Contenido de fraseo</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omisión de etiquetas</th>
+   <td>Ninguna;  tanto la etiqueta de inicio como de fin son obligatorias.</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles permitidos en ARIA</th>
+   <td>Cualquiera</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLTimeElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Como todos los elementos de HTML, este elemento soporta los <a href="https://developer.mozilla.org/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("datetime")}}</dt>
+ <dd>Este atributo indica la hora y/o fecha del elemento y debe estar escrito en uno de los formatos que se muestran posteriomente.</dd>
+</dl>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<p>Este elemento es para presentar fechas y horas en un formato legible por el equipo. Por ejemplo, este puede ayudar a un agente de usuario ofrecer añadir un evento al calendario del usuario.</p>
+
+<p>Este elemento no debe ser usado para fechas anteriores a la introducción del calendario Gregoriano (debido a complicaciones en el cálculo de dichas fechas).</p>
+
+<p>El valor de fecha y hora (el valor legible por el equipo) es el valor del atributo del elemento <code>datetime</code>, que debe estar en el formato correcto (vea más adelante). Si el elemento no tiene un atributo <code>datetime</code>, <strong>no debe tener ningún elemento descendiente</strong>, y el valor datetime es el contenido de texto del hijo del elemento.</p>
+
+<h3 id="Valores_datetime_válidos">Valores datetime válidos</h3>
+
+<dl>
+ <dt>una cadena válida de año</dt>
+ <dd><code>2011</code></dd>
+ <dd><code>0001</code></dd>
+ <dt>una cadena válida de mes</dt>
+ <dd><code>2011-11</code></dd>
+ <dt>una cadena válida de fecha</dt>
+ <dd><code>2011-11-18</code></dd>
+ <dt>una cadena de fecha sin año válida</dt>
+ <dd><code>11-18</code></dd>
+ <dt>una cadena de semana válida</dt>
+ <dd><code>2011-W47</code></dd>
+ <dt>una cadena de hora válida</dt>
+ <dd><code>14:54</code></dd>
+ <dd><code>14:54:39</code></dd>
+ <dd><code>14:54:39.929</code></dd>
+ <dt>una cadena de fecha y hora local válida</dt>
+ <dd><code>2011-11-18T14:54:39.929</code></dd>
+ <dd><code>2011-11-18 14:54:39.929</code></dd>
+ <dt>una cadena de fecha y hora global válida</dt>
+ <dd><code>2011-11-18T14:54:39.929Z</code></dd>
+ <dd><code>2011-11-18T14:54:39.929-0400</code></dd>
+ <dd><code>2011-11-18T14:54:39.929-04:00</code></dd>
+ <dd><code>2011-11-18 14:54:39.929Z</code></dd>
+ <dd><code>2011-11-18 14:54:39.929-0400</code></dd>
+ <dd><code>2011-11-18 14:54:39.929-04:00</code></dd>
+ <dt>una cadena valida de duración</dt>
+ <dd><code>PT4H18M3S</code></dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Simple">Ejemplo Simple</h3>
+
+<h4 id="HTML">HTML</h4>
+
+<pre class="brush: html notranslate">&lt;p&gt;El concierto empieza a las &lt;time&gt;20:00&lt;/time&gt;.&lt;/p&gt;
+</pre>
+
+<h4 id="Output">Output</h4>
+
+<p>{{ EmbedLiveSample('Simple_example', 250, 60) }}</p>
+
+<h3 id="Datetime_example" name="Datetime_example">Ejemplo con <code>datetime</code></h3>
+
+<h4 id="HTML_2">HTML</h4>
+
+<pre class="brush: html notranslate">&lt;p&gt;El concierto fué el &lt;time
+  datetime="2001-05-15T19:00"&gt;15 de Mayo&lt;/time&gt;.&lt;/p&gt;
+</pre>
+
+<h4 id="Output_2">Output</h4>
+
+<p>{{ EmbedLiveSample('Datetime_example', 250, 60) }}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', 'semantics.html#the-time-element', '&lt;time&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambios desde {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', 'grouping-content.html#the-time-element', '&lt;time&gt;')}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Sin cambios desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-time-element', '&lt;time&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada con información estructurada. Si desea contribuir, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíe su pull request.</div>
+
+<p>{{Compat("html.elements.time")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El elemento {{HTMLElement("data")}}, permite señalizar otro tipo de valores.</li>
+</ul>
diff --git a/files/es/web/html/element/title/index.html b/files/es/web/html/element/title/index.html
new file mode 100644
index 0000000000..a3548236e0
--- /dev/null
+++ b/files/es/web/html/element/title/index.html
@@ -0,0 +1,55 @@
+---
+title: title
+slug: Web/HTML/Element/title
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/title
+original_slug: Web/HTML/Elemento/title
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Indica el título del documento.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;title&gt; y &lt;/title&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>:</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#contenido_de_cabecera">Elemento de contenido de cabecera</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: texto y entidades de caracteres, pero no puede contener código.</dd>
+</dl>
+
+<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
+
+<dl>
+ <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
+</dl>
+
+<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene." name="Atributos_Espec.C3.ADficos_-_No_tiene.">Atributos Específicos - No tiene.</h5>
+
+<h5 id="Atributos_Transicionales_-_No_tiene." name="Atributos_Transicionales_-_No_tiene.">Atributos Transicionales - No tiene.</h5>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre>&lt;head&gt;
+&lt;title&gt;Ejemplo de uso del elemento title&lt;/title&gt;
+... otros elementos de cabecera...
+&lt;/head&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p>Todos los documentos deben tener un título, por lo tanto este elemento <strong>es obligarorio</strong> y debe estar ubicado dentro del elemento head.</p>
+
+<p>El contenido de title suele ser mostrado en la barra de título de la ventana del navegador </p>
diff --git a/files/es/web/html/element/tr/index.html b/files/es/web/html/element/tr/index.html
new file mode 100644
index 0000000000..d4a00075f9
--- /dev/null
+++ b/files/es/web/html/element/tr/index.html
@@ -0,0 +1,233 @@
+---
+title: <tr>
+slug: Web/HTML/Element/tr
+tags:
+  - Element
+  - Elemento
+  - HTML
+  - Reference
+  - Referencia
+  - Tabla
+  - Tablas
+  - Web
+translation_of: Web/HTML/Element/tr
+original_slug: Web/HTML/Elemento/tr
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El elemento HTML <em>fila de tabla</em> (<em>table row</em>) <code>&lt;tr&gt;</code> define una fila de celdas en una tabla. Estas pueden ser una mezcla de elementos {{HTMLElement("td")}} y {{HTMLElement("th")}}.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content categories">Content categories</a></td>
+   <td>Ninguno</td>
+  </tr>
+  <tr>
+   <td>Contenido permitido</td>
+   <td>Cero o más {{HTMLElement("td")}} o elementos {{HTMLElement("th")}}, o una mezcla de ellos</td>
+  </tr>
+  <tr>
+   <td>
+    <p>Omisión de Etiqueta  </p>
+   </td>
+   <td>La etiqueta de inicio es obligatoria. La etiqueta final puede ser omitida si el elemento {{HTMLElement("tr")}} va inmediatamente seguido por un elemento {{HTMLElement("tr")}}, o si el grupo de tabla pariente ({{HTMLElement("thead")}}, {{HTMLElement("tbody")}} o el elemento {{HTMLElement("tfoot")}}) no tiene mas contenido</td>
+  </tr>
+  <tr>
+   <td>Elementos padres permitidos</td>
+   <td>{{HTMLElement("table")}}, {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} o el elemento {{HTMLElement("tfoot")}}</td>
+  </tr>
+  <tr>
+   <td>Documento de normativa</td>
+   <td><a class="external" href="http://www.whatwg.org/html/#the-tr-element">HTML, "The <code>tr</code> element"</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
+
+<dl>
+ <dt>{{htmlattrdef("align")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
+ <dd>Este atributo enumerado especifica como será gestionado el alineamiento horizontal del contenido de cada celda. Hay varios valores:
+ <ul>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">left</font>, alinea el contenidoa la izquierda de las celdas</li>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">center</font>, centra el contenido en las celdas</li>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">right</font>, alinea el contenido a la derecha de las celdas</li>
+  <li><font face="Consolas, Liberation Mono, Courier, monospace">justify</font>, amplia los espacios en el contenido textual de hecho el contenido es justificado in las celdas</li>
+  <li><code>char</code>, alinea el contenido textual en un carácter especial con una mínima inclinación definida por el {{htmlattrxref("char", "tr")}} y {{htmlattrxref("charoff", "tr")}} atributos {{unimplemented_inline("2212")}}</li>
+ </ul>
+
+ <p>Si este atributo no está establecido, se hereda el valor del nodo principal.</p>
+
+ <div class="note"><strong>Nota: No utilice este atributo, ya que es obsoleta (no soportado) en el último estándar</strong>.
+
+ <ul>
+  <li>Para lograr el mismo efecto que los valores <code>left</code>, <code>center</code>, <code>right</code> o <code>justify</code>, utilice la propiedad CSS {{cssxref("text-align")}}.</li>
+  <li>Para lograr el mismo efecto que el valor char, en CSS3, puede utilizar el valor de la  {{htmlattrxref("char", "tr")}} como el valor de la {{cssxref("text-align")}} propiedad {{unimplemented_inline}}.</li>
+ </ul>
+ </div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("bgcolor")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
+ <dd>Este atributo define el color de fondo de cada celda de la fila. Puede ser un código de #RRGGBB o una palabra clave de color de SVG.
+ <div class="note"><strong>Nota de uso:</strong> el elemento {{HTMLElement("tr")}} debe ser de estilo con CSS. Para dar un efecto similar al atributo bgcolor, utilice la propiedad CSS {{cssxref("background-color")}}.</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("char")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
+ <dd>Este atributo es utilizado para establecer el caracter para alinear las celdas de una columna. Los valores típicos para éste incluyen un punto (.) al intentar alinear los números o valores monetarios. Si {{htmlattrxref("align", "tr")}} no se ha ajustado a char, este atributo se ignora.
+ <div class="note"><strong>Nota:</strong> No utilice este atributo, ya que es obsoleta (y no es compatible) en el último estándar<strong>.</strong> Para lograr el mismo efecto que el {{htmlattrxref("char", "tr")}}, en CSS3, puedes utilizar el juego de carácteres utilizando el atributo {{htmlattrxref("char", "tr")}} como el valor de la referencia externa {{cssxref("text-align")}} propiedad {{unimplemented_inline}}.</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("charoff")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
+ <dd>Este atributo se utiliza para indicar el número de caracteres para compensar los datos de la columna de los carácteres de alineación especificado por el atributo char.
+ <div class="note"><strong>Nota:</strong> No utilice este atributo, ya que está obsoleto (y no es compatible) en el último estándar.</div>
+ </dd>
+</dl>
+
+<dl>
+ <dt>{{htmlattrdef("valign")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
+ <dd>Este atributo especifica la alineación vertical del texto dentro de cada fila de las celdas de la cabecera de la tabla. Los valores posibles para este atributo son:
+ <ul>
+  <li><code>baseline</code>, que pondrá el texto tan cerca del fondo de la celda, ya que es posible, pero corresponda con el <a class="external" href="http://en.wikipedia.org/wiki/Baseline_%28typography%29" title="http://en.wikipedia.org/wiki/Baseline_(typography)">baseline</a> de los caráctere en lugar de la parte inferior de ellos. Si los carácteres son todos del tamaño, esto tiene el mismo efecto que la parte inferior.</li>
+  <li><code>bottom</code>,que pondrá el texto tan cerca de la parte inferior de la célula como sae posible;</li>
+  <li><code>middle</code>,que centrará el texto en la celda;</li>
+  <li>y <code>top</code>, que pondrá el texto como cerca de la parte superior de la célula como es posible.</li>
+ </ul>
+
+ <div class="note"><strong>Nota:</strong> No utilice este atributo, ya que está obsoleto (y no es compatible) en el último estándar: {{cssxref("vertical-align")}} en su lugar establecer la propiedad CSS en él.</div>
+ </dd>
+</dl>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa el  interfaz{{domxref("HTMLTableRowElement")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Ver {{HTMLElement("table")}} para ejemplos de <code>&lt;tr&gt;</code>.</p>
+
+<h2 id="Compatibilidad_con_Navegador">Compatibilidad con Navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>align/valign</code> attribute</td>
+   <td>1.0</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>char/charoff</code> attribute</td>
+   <td>1.0</td>
+   <td>{{CompatNo}} [2]</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>align/valign</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>char/charoff</code> attribute</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}} [2]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] See {{bug(915)}}.</p>
+
+<p>[2] See {{bug(2212)}}.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Otros elementos relacionados con tablas HTML: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}};</li>
+ <li>Las propiedades CSS y pseudo-clases que pueden ser especialmente útiles para el estilo del elemento &lt;tr&gt;:
+  <ul>
+   <li>El {{cssxref(":nth-child")}} pseudo-clase para establecer la alineación en las células de la columna;</li>
+   <li>El {{cssxref("text-align")}} propiedad para alinear todas las células contenidos en el mismo carácter, como '.'. &lt;</li>
+  </ul>
+ </li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/element/track/index.html b/files/es/web/html/element/track/index.html
new file mode 100644
index 0000000000..a3f1b49276
--- /dev/null
+++ b/files/es/web/html/element/track/index.html
@@ -0,0 +1,180 @@
+---
+title: '<track>: El elemento para pistas de texto incrustado'
+slug: Web/HTML/Element/track
+tags:
+  - Accessibility
+  - Contenido HTML insertado
+  - Elemento
+  - HTML
+  - HTML5
+  - Multimedia
+  - Pistas de texto
+  - Reference
+  - Web
+  - a11y
+  - anotaciones
+  - track
+translation_of: Web/HTML/Element/track
+original_slug: Web/HTML/Elemento/track
+---
+<div>{{HTMLRef}}</div>
+
+<p><span class="seoSummary">El <strong>elmento HTML <code>&lt;track&gt;</code></strong> es usado como hijo de los elementos multimedia, {{HTMLElement("audio")}} y {{HTMLElement("video")}}. Este te deja especificar pistas de texto temporizadas (o datos basados en el tiempo), por ejemplo para manejar automáticamente los subtítulos.</span> Las pistas de texto usan el <a href="/en-US/docs/Web/API/Web_Video_Text_Tracks_Format">formato WebVTT</a> (archivos <code>.vtt</code>) o de pistas de texto para la web.</p>
+
+<div>{{EmbedInteractiveExample("pages/tabbed/track.html", "tabbed-standard")}}</div>
+
+<div class="hidden">La fuente para este ejemplo interactivo esta alojada en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una pull request.</div>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías del contenido</a></th>
+   <td>Ninguna</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Ninguno, es un {{Glossary("empty element")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omision de etiquetas</th>
+   <td>Como es un elemento vacío, la etiqueta de inicio debe estar presente y la etiqueta de cierre no debe estar presente.</td>
+  </tr>
+  <tr>
+   <th scope="row">Padres permitidos</th>
+   <td>Un elemento multimedia, {{HTMLElement("audio")}} o {{HTMLElement("video")}}.</td>
+  </tr>
+  <tr>
+   <th scope="row">Rol ARIA implícito</th>
+   <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">No hay rol correspondiente</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Roles ARIA permitidos</th>
+   <td>No hay <code>role</code>s permitidos.</td>
+  </tr>
+  <tr>
+   <th scope="row">Intefaz DOM</th>
+   <td>{{domxref("HTMLTrackElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("default")}}</dt>
+ <dd>Este atributo indica que esta pista de texto debe estar activada salvo que las preferencias del usuario indiquen que otra pista de texto es más apropiada. Este atributo solo puede ser usado en un elemento <code>track</code> por cada elemento multimedia.</dd>
+ <dt>{{htmlattrdef("kind")}}</dt>
+ <dd>Este atributo indica como esta pensada para usarse la pista de texto. Si lo omites el valor por defecto es <code>subtitles</code>. If the attribute contiene un valor invalido usará el valor <code>metadata</code> (Las versiones de Chrome anteriores a la 52 tratan un valor inválido como <code>subtitles</code>). Las siguientes palabras clave están permitidas:
+ <ul>
+  <li><code>subtitles</code>
+   <ul>
+    <li>Los subtítulos proporciona la traducción de contenido que no puede ser entendido por el espéctador. Por ejemplo diálogos o texto que no está en español en una película en español.</li>
+    <li>Los subtítulos puede contener información adicional, normalmente información extra sobre el escenario. Por ejemplo el texto al principio de las películas de Stars Wars, o la fecha, el tiempo, y la ubicación de una escena.</li>
+   </ul>
+  </li>
+  <li><code>captions</code>
+   <ul>
+    <li>Este valor provee una transcripción y posiblemente una traducción del audio.</li>
+    <li>Puede incluir información no verbal importante como anotaciones sobre la música o efectos de sonido. Tambien puede indicar la fuente de la anotación (por ejemplo: música, texto, caracteres).</li>
+    <li>Es adecuado para usuarios sordos o cuando el sonido está apagado.</li>
+   </ul>
+  </li>
+  <li><code>descriptions</code>
+   <ul>
+    <li>Descripción textual del conenido del video.</li>
+    <li>Adecuado para usuarios ciegos o cuando el video no se puede ver.</li>
+   </ul>
+  </li>
+  <li><code>chapters</code>
+   <ul>
+    <li>Los títulos de los capítulos estan pensados para ser usados cuando el usuario esta navegando a través del recurso multimedia.</li>
+   </ul>
+  </li>
+  <li><code>metadata</code>
+   <ul>
+    <li>Pistas de texto usadas por programas. No visibles para el usuario.</li>
+   </ul>
+  </li>
+ </ul>
+ </dd>
+ <dt>{{htmlattrdef("label")}}</dt>
+ <dd>Da un título a la pista de texto que puedan entender los usuarios y que es usado por el navegador cuando esta mostrando la lista de pistas de texto disponibles.</dd>
+ <dt>{{htmlattrdef("src")}}</dt>
+ <dd>Señala la dirección de la pista de texto (archivo <code>.vtt</code>). Debe ser una URL valida. Este atributo debe ser especificado y su URL debe tener el mismo origen que el documento, salvo que el elemento {{HTMLElement("audio")}} o {{HTMLElement("video")}} que sea padre del elemento <code>track</code> tenga un atributo <code><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">crossorigin</a></code>.</dd>
+ <dt>{{htmlattrdef("srclang")}}</dt>
+ <dd>Señala el idioma de los datos de la pista de texto. Debe ser una etiqueta de idioma <a href="https://r12a.github.io/app-subtags/">BCP 47</a> valida. Si al atributo <code>kind</code> se le da el valor de <code>subtitles</code>, entonces <code>srclang</code> debe ser definido.</dd>
+</dl>
+
+<h2 id="Notas_de_uso">Notas de uso</h2>
+
+<h3 id="Tipos_de_datos_para_pistas_de_texto">Tipos de datos para pistas de texto</h3>
+
+<p>El tipo de dato que el elemento <code>track</code> añade al elemento multimedia es fijado en el atributo <code>kind</code>, que puede tener los valores de <code>subtitles</code>, <code>captions</code>, <code>descriptions</code>, <code>chapters</code> or <code>metadata</code>. El elemento apunta a un archivo fuente que contiene texto temporizado que el navegador muestra cuando el usuario solicita datos adicionales.</p>
+
+<p>Un elemento <code>media</code> no puede tener mas de un elemento <code>track</code> con el mismo valor en los atributos <code>kind</code>, <code>srclang</code>, y <code>label</code> a la vez.</p>
+
+<h3 id="Detectando_cambios_en_las_anotaciones">Detectando cambios en las anotaciones</h3>
+
+<p>{{page("/es/docs/Web/API/TextTrack/cuechange_event", "En el elemento track")}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html notranslate">&lt;video controls poster="/imagenes/ejemplo.gif"&gt;
+   &lt;source src="ejemplo.mp4" type="video/mp4"&gt;
+   &lt;source src="ejemplo.ogv" type="video/ogv"&gt;
+   &lt;track kind="captions" src="captionsDeEjemplo.vtt" srclang="en"&gt;
+   &lt;track kind="descriptions" src="descripciónDeEjemplo.vtt" srclang="en"&gt;
+   &lt;track kind="chapters" src="capítulosDeEjemplo.vtt" srclang="en"&gt;
+   &lt;track kind="subtitles" src="subtítulosDeEjemplo_de.vtt" srclang="de"&gt;
+   &lt;track kind="subtitles" src="subtítulosDeEjemplo_en.vtt" srclang="en"&gt;
+   &lt;track kind="subtitles" src="subtítulosDeEjemplo_ja.vtt" srclang="ja"&gt;
+   &lt;track kind="subtitles" src="subtítulosDeEjemplo_oz.vtt" srclang="oz"&gt;
+   &lt;track kind="metadata" src="etapaClave1.vtt" srclang="en"
+     label="Etapa clave 1"&gt;
+   &lt;track kind="metadata" src="etapaClave2.vtt" srclang="en"
+     label="Etapa clave 2"&gt;
+   &lt;track kind="metadata" src="etapaClave3.vtt" srclang="en"
+     label="Etapa clave 3"&gt;
+   &lt;!-- Fallback --&gt;
+   ...
+&lt;/video&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML WHATWG','embedded-content.html#the-track-element','track element')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "semantics-embedded-content.html#the-track-element", "track element")}}</td>
+   <td>{{Spec2("HTML5 W3C")}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_navegadores">Compatibilidad con los navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página está generada desde datos estructurados. Si quieres contribuir a los datos, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una pull request.</div>
+
+<p>{{Compat("html.elements.track")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/HTML/WebVTT">El formato WebVTT para pistas de texto</a></li>
+ <li>{{domxref("HTMLMediaElement.textTracks")}}</li>
+</ul>
diff --git a/files/es/web/html/element/tt/index.html b/files/es/web/html/element/tt/index.html
new file mode 100644
index 0000000000..9c43826679
--- /dev/null
+++ b/files/es/web/html/element/tt/index.html
@@ -0,0 +1,59 @@
+---
+title: tt
+slug: Web/HTML/Element/tt
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/tt
+original_slug: Web/HTML/Elemento/tt
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Muestra el texto marcado con una fuente de ancho fijo.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;tt&gt; y &lt;/tt&gt; (Ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
+
+<ul>
+ <li>title (título del elemento)</li>
+ <li>style (información de estilo en línea)</li>
+</ul>
+
+<dl>
+ <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
+ <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
+ <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
+</dl>
+
+<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
+
+<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">  &lt;p&gt;
+       Texto normal y... &lt;tt&gt;Texto con formato teletipo&lt;/tt&gt;
+  &lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p><span class="comment">de momento no funciona </span></p>
diff --git a/files/es/web/html/element/u/index.html b/files/es/web/html/element/u/index.html
new file mode 100644
index 0000000000..dfeb428572
--- /dev/null
+++ b/files/es/web/html/element/u/index.html
@@ -0,0 +1,80 @@
+---
+title: u
+slug: Web/HTML/Element/u
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/u
+original_slug: Web/HTML/Elemento/u
+---
+<p> </p>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Muestra el texto subrayado.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;u&gt; y &lt;/u&gt; (Ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>
+
+ <dl>
+  <dd><a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">de estilo de fuente</a>.</dd>
+  <dd><a href="es/HTML/Elemento/Tipos_de_elementos#Desaprobado">Desaprobado</a></dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
+
+<ul>
+ <li>title (título del elemento)</li>
+ <li>style (información de estilo en línea)</li>
+</ul>
+
+<dl>
+ <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
+ <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
+ <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
+</dl>
+
+<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
+
+<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>Uso de u:</p>
+
+<pre class="eval">  &lt;p&gt;
+       Texto normal y... &lt;u&gt;Texto subrayado&lt;/u&gt;
+  &lt;/p&gt;
+</pre>
+
+<p>Uso de CSS:</p>
+
+<pre class="eval">  &lt;p&gt;
+       Texto normal y... &lt;span style='text-decoration: underline'&gt;Texto subrayado&lt;/span&gt;
+  &lt;/p&gt;
+</pre>
+
+<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
+
+<p>Para obtener el mismo resultado puede usarse La propiedad CSS text-decoration: underline;</p>
+
+<p>Si por algún motivo necesita usar elementos desaprobados como u, recuerde que debe declarar un DOCTYPE transicional.</p>
+
+<div class="warning">DESAPROBADO</div>
+
+<p><span class="comment">de momento no funciona </span></p>
diff --git a/files/es/web/html/element/ul/index.html b/files/es/web/html/element/ul/index.html
new file mode 100644
index 0000000000..c75a165c46
--- /dev/null
+++ b/files/es/web/html/element/ul/index.html
@@ -0,0 +1,152 @@
+---
+title: ul
+slug: Web/HTML/Element/ul
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/ul
+original_slug: Web/HTML/Elemento/ul
+---
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p><strong>ul</strong> de "unordered list" -<em>lista no ordenada</em> . crea una lista no ordenada.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: <code>&lt;ul&gt; y &lt;/ul&gt;</code> (ambas obligatorias).</dd>
+ <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#delista">para listas</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: En bloque.</dd>
+ <dd><strong>Puede contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
+</dl>
+
+<h4 id="Atributos" name="Atributos">Atributos</h4>
+
+<table class="fullwidth-table standard-table">
+ <tbody>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+  <tr>
+   <th colspan="3">Genéricos</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
+   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
+   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
+   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
+   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
+   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
+   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
+   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
+   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
+   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
+   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
+  </tr>
+  <tr>
+   <th colspan="3">Específicos</th>
+  </tr>
+  <tr>
+   <td colspan="3">No tiene</td>
+  </tr>
+  <tr>
+   <th colspan="3">De transición</th>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/lists.html#adef-type-UL"><code style="color: green;">type</code></a></td>
+   <td>Indica el estilo de los items de la lista.</td>
+   <td>Uno de los siguientes: <code>'disc', 'square', o 'circle'</code>. Por defecto: depende del anidamiento, lo fija el navegador</td>
+  </tr>
+  <tr>
+   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/lists.html#adef-compact"><code style="color: green;">compact</code></a></td>
+   <td>Indica que la lista debe mostrase conpactada.</td>
+   <td>Solo puede ser: <code>'compact'</code>. Por defecto: Lo fija el navegador.</td>
+  </tr>
+  <tr>
+   <th>atributo</th>
+   <th>descripción</th>
+   <th>valor</th>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
+
+<div class="highlight">
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>El siguiente código:</p>
+
+<pre class="eval">&lt;ul&gt;
+ &lt;li&gt;Esto&lt;/li&gt;
+ &lt;li&gt;Lo otro&lt;/li&gt;
+ &lt;li&gt;Lo de más allá&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+
+<p>Se visualiza así:</p>
+
+<div style="border: solid silver 1px;">
+<ul>
+ <li>Esto</li>
+ <li>Lo otro</li>
+ <li>Lo de más allá</li>
+</ul>
+</div>
+</div>
+
+<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<h3 id="Referencia" name="Referencia">Referencia</h3>
+
+<ul>
+ <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/lists.html#edef-UL"><strong>ul</strong> en la especificación</a> de html 4.01</li>
+</ul>
+
+<p> </p>
+
+<h3 id="Soporte" name="Soporte">Soporte</h3>
+
+<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-ul">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
+
+<p> </p>
+
+<hr>
+<div class="note">
+<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
+
+<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
+</div>
+
+<p><br>
+ <span class="comment">Categoría</span></p>
+
+<p><span class="comment">interwiki links</span></p>
+
+<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/element/var/index.html b/files/es/web/html/element/var/index.html
new file mode 100644
index 0000000000..910926099c
--- /dev/null
+++ b/files/es/web/html/element/var/index.html
@@ -0,0 +1,55 @@
+---
+title: var
+slug: Web/HTML/Element/var
+tags:
+  - HTML
+  - HTML:Elemento
+  - Todas_las_Categorías
+translation_of: Web/HTML/Element/var
+original_slug: Web/HTML/Elemento/var
+---
+<div>{{HTMLRef}}</div>
+
+<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
+
+<p>Marca variables de programas y similares.</p>
+
+<dl>
+ <dd><strong>Sus etiquetas son</strong>: &lt;var&gt; y &lt;/var&gt; (ambas obligatorias)</dd>
+</dl>
+
+<dl>
+ <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
+</dl>
+
+<dl>
+ <dd><strong>Puede contener</strong>: cero o más elementos<a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
+</dl>
+
+<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
+
+<ul>
+ <li>title (título del elemento)</li>
+ <li>style (información de estilo en línea)</li>
+</ul>
+
+<dl>
+ <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
+ <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
+ <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
+</dl>
+
+<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene." name="Atributos_Espec.C3.ADficos_-_No_tiene.">Atributos Específicos - No tiene.</h5>
+
+<h5 id="Atributos_Transicionales_-_No_tiene." name="Atributos_Transicionales_-_No_tiene.">Atributos Transicionales - No tiene.</h5>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="eval">&lt;p&gt;
+el bucle no se detendrá hasta que &lt;var&gt;Faltan&lt;/var&gt; sea igual a 0.
+&lt;/p&gt;
+</pre>
diff --git a/files/es/web/html/element/video/index.html b/files/es/web/html/element/video/index.html
new file mode 100644
index 0000000000..1d0d0c396d
--- /dev/null
+++ b/files/es/web/html/element/video/index.html
@@ -0,0 +1,129 @@
+---
+title: video
+slug: Web/HTML/Element/video
+tags:
+  - HTML
+  - HTML5
+  - Multimedia
+  - para_revisar
+translation_of: Web/HTML/Element/video
+original_slug: Web/HTML/Elemento/video
+---
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento <code>video</code> se utiliza para incrustar vídeos en un documento HTML o XHTML.</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para obtener una lista de formatos compatibles, consulta <a href="/es/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio" title="es/Formatos multimedia admitidos por los elementos de video y audio">Formatos multimedia admitidos por los elementos de audio y vídeo</a> .</span></span></p>
+
+<h2 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><a href="/en/HTML/Content_categories#transparent_content" title="en/HTML/Content categories#transparent content">Contenido transparente</a> , que contiene un atributo <strong>src</strong> o uno o más elementos {{ HTMLElement ("source") }}, seguidos por <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> o <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">el contenido estático</a> , sin elementos <code> &lt;video&gt;</code> ni  {{ HTMLElement ("audio") }}.</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> o cualquier otro elemento que acepte <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">contenido estático</a> .</span></span></td>
+  </tr>
+  <tr>
+   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
+   <td><a class="external" href="http://www.w3.org/TR/html5/video.html#video" title="http://www.w3.org/TR/html5/video.html#video"><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.8.6</span></span></a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h2>
+
+<dl>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("autoplay") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo booleano; si se especifica, el video comenzará a reproducirse automáticamente tan pronto como sea posible, sin detenerse para terminar de cargar los datos.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("autobuffer") }} {{ Non-standard_inline() }} {{ obsolete_inline() }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo booleano; si se especifica, el video comenzará automáticamente a almacenarse en el búfer, incluso si no está listo para reproducirse de forma automática.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto se debe utilizar para los casos en los que se considera probable que el video se reproduzca (por ejemplo, si el usuario accedió a esa página específica para reproducir el video, no si hay un video insertado junto con otros contenidos). </span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El video se almacena en el búfer hasta que el caché de medios esté lleno.</span></span>
+ <div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota de implementación:</strong> aunque forma parte de los primeros borradores de la especificación HTML 5, el atributo <strong>autobuffer</strong> se ha eliminado en versiones posteriores.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Se ha quitado de Gecko 2.0 y otros navegadores, y en algunos nunca llegó a implementarse.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La especificación define un nuevo atributo enumerado, <strong>preload,</strong> para sustituir el atributo <strong>autobuffer,</strong> con una sintaxis diferente. {{ bug (548523) }}</span></span></div>
+ </dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("buffered") }} {{ gecko_minversion_inline("2.0") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo que se puede leer para determinar qué intervalos de tiempo del multimedia se han almacenado en búfer.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Este atributo contiene un objeto </span></span>{{ domxref("TimeRanges") }}<span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"> .</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("controls") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si está presente este atributo, Gecko ofrecerá controles para permitir que el usuario controle la reproducción de video, incluyendo volumen, búsqueda y pausar/reanudar reproducción.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("height") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La altura del área de visualización del vídeo en píxeles CSS.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("loop") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo booleano; si se especifica, al alcanzar el final del video, buscaremos automáticamente hasta el principio.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("preload") }} {{ gecko_minversion_inline("2.0") }} {{ bug(548523) }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El objetivo de este atributo enumerado es proporcionar una sugerencia al navegador sobre qué cree el autor que llevará a la mejor experiencia para el usuario .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Puede tener uno de los siguientes valores:</span></span>
+ <ul>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><span style="font-family: courier new;">none</span>: sugiere bien que el autor cree que el usuario no tendrá que consultar ese video, bien que el servidor desea minimizar su tráfico; es decir, esta sugerencia indica que no se debe almacenar en caché este video.</span></span></li>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><span style="font-family: courier new;">metadatos:</span> sugiere que aunque el autor piensa que el usuario no tendrá que consultar este video, es razonable capturar los metadatos (p. ej. longitud).</span></span></li>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><span style="font-family: courier new;">auto:</span> sugiere que el usuario necesita tener prioridad; es decir, esta sugerencia indica que, si es necesario, se puede descargar el video completo, incluso aunque el usuario no vaya a usarlo.</span></span></li>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">la <em>cadena vacía:</em> que es un sinónimo del valor <span style="font-family: courier new;">auto</span>.</span></span></li>
+ </ul>
+
+ <p><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no está configurado, su valor predeterminado está definido por el navegador (es decir, cada navegador puede elegir su propio valor predeterminado), aunque la especificación aconseje que se establezca a <span style="font-family: courier new;">metadata</span>.</span></span></p>
+
+ <div class="note"><strong><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Notas de uso:</span></span></strong>
+
+ <ul>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">El atributo <strong>autoplay</strong>  tiene prioridad sobre éste si se desea reproducir automáticamente un video, el navegador obviamente tendrá que descargarlo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">La especificación permite establecer los atributos <strong>autoplay</strong> y <strong>preload</strong>.</span></span></li>
+  <li><span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La especificación no fuerza al navegador a seguir el valor de este atributo; es tan sólo una sugerencia.</span></span></li>
+ </ul>
+ </div>
+ </dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("poster") }} {{ gecko_minversion_inline("1.9.2") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una URL que indica un marco de póster para mostrar el resultado hasta que el usuario reproduzca o busque.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si este atributo no se especifica, no se muestra nada hasta que el primer cuadro está disponible, entonces se muestra el primer marco como el marco de póster.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("src") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La URL del vídeo que se va a insertar.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Es opcional; podrás optar, en su lugar, por el elemento {{ HTMLElement("source") }} dentro del bloque de vídeo para especificar el video que se va a incrustar.</span></span></dd>
+ <dt><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("width") }}</span></span></dt>
+ <dd><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La anchura del área de visualización del vídeo en píxeles CSS.</span></span></dd>
+</dl>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las compensaciones de tiempo se especifican actualmente como valores float que representan el número de segundos que se va a compensar.</span></span></p>
+
+<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota:</strong> la definición del valor de compensación de tiempo no se ha completado en HTML 5 aún y está sujeta a cambios.</span></span></div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;video src="videofile.ogg" autoplay poster="posterimage.jpg"&gt;
+  Tu navegador no admite el elemento &lt;code&gt;video&lt;/code&gt;.
+&lt;/video&gt;
+</pre>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Reproduce un vídeo, comenzando tan pronto como la recepción de video sea suficiente para permitir la reproducción sin pausas para descargar más.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Mientras que el video comienza a reproducirse, se mostrará la imagen "posterimage.jpg" en su lugar.</span></span></p>
+
+<h2 id="Compatibilidad_con_servidores"><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Compatibilidad con servidores</span></span></h2>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Vale la pena volver a hacer hincapié, por el momento, en que si los tipos MIME para vídeo Theora no se establecen en el servidor, tal vez el vídeo no se muestre o muestre un cuadro gris con una X (si JavaScript está activado).</span></span></p>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Puedes solucionar este problema para el servidor Web Apache añadiendo la extensión utilizada por tus archivos de vídeo Theora (".ogm", ".ogv", o ".ogg" son los más comunes) al tipo MIME "video / ogg" a través del archivo "mime.types" en "/ etc / apache" o por medio de la directiva de configuración "AddType" en httpd.conf.</span></span></p>
+
+<pre><span class="goog-gtc-unit" id="goog-gtc-unit-64-goog-gtc-unit-65-goog-gtc-unit-66"><span class="goog-gtc-from-human goog-gtc-translatable">AddType video/ogg .ogm
+AddType video/ogg .ogv
+AddType video/ogg .ogg
+</span></span>
+</pre>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Su proveedor de alojamiento web puede proporcionar una interfaz fácil para los cambios de configuración de tipo MIME que presentan las nuevas tecnologías hasta que tenga lugar una actualización global de forma natural.</span></span></p>
+
+<h2 id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h2>
+
+<ul>
+ <li><a href="/en/DOM/HTMLVideoElement" title="en/DOM/HTMLVideoElement"><span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTMLVideoElement</span></span></a></li>
+</ul>
+
+<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h2>
+
+<ul>
+ <li><a class="internal" href="/es/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio" title="es/Formatos multimedia admitidos por los elementos de video y audio"><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Formatos multimedia admitidos por los elementos de audio y video</span></span></a></li>
+ <li><a class="internal" href="/es/HTML/Elemento/Audio" title="es/HTML/Elemento/Audio"><code>audio</code></a></li>
+ <li><a class="internal" href="/Es/Usar_audio_y_vídeo_en_Firefox" title="es/Usar audio y video en Firefox"><span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Usar audio y vídeo en Firefox</span></span></a></li>
+ <li><a class="internal" href="/En/Manipulating_video_using_canvas" title="En/Manipulating video using canvas"><span class="goog-gtc-unit" id="goog-gtc-unit-73"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Manipular vídeo por medio de canvas</span></span></a></li>
+ <li><a class="internal" href="/En/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement" title="En/XPCOM Interface Reference/NsIDOMHTMLMediaElement"><code>nsIDOMHTMLMediaElement</code></a></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-74"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><a class="external" href="http://tinyvid.tv/" title="http://tinyvid.tv/">TinyVid</a>:ejemplos de uso de ogg en HTML 5.</span></span></li>
+ <li><span class="goog-gtc-unit" id="goog-gtc-unit-75"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#video" title="http://www.whatwg.org/specs/web-apps/current-work/#video">El elemento <code>video</code></a> (especificación de HTML 5)</span></span></li>
+ <li><a class="internal" href="/en/Configuring_servers_for_Ogg_media" title="en/Configuring servers for Ogg media"><span class="goog-gtc-unit" id="goog-gtc-unit-76"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Configuración de servidores para medios Ogg</span></span></a></li>
+</ul>
+
+<p><span class="goog-gtc-unit" id="goog-gtc-unit-77"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ languages( { "fr": "fr/HTML/Element/video","en": "en/HTML/Element/video" } ) }}</span></span></p>
diff --git a/files/es/web/html/element/wbr/index.html b/files/es/web/html/element/wbr/index.html
new file mode 100644
index 0000000000..1fef6a75b9
--- /dev/null
+++ b/files/es/web/html/element/wbr/index.html
@@ -0,0 +1,116 @@
+---
+title: <wbr>
+slug: Web/HTML/Element/wbr
+tags:
+  - Elemento
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/wbr
+original_slug: Web/HTML/Elemento/wbr
+---
+<div>{{HTMLRef}}</div>
+
+<div>El elemento HTML <em>word break opportunity </em><font face="Consolas, Liberation Mono, Courier, monospace"><code>&lt;wbr</code></font><em><font face="Consolas, Liberation Mono, Courier, monospace"><code>&gt;</code></font></em> representa una posición dentro del texto donde el explorador puede opcionalmente saltar una línea , aunque sus reglas de salto de línea de otra manera no crearían un salto en esa posición .</div>
+
+<div> </div>
+
+<div>En páginas codificadas en UTF-8 , <font face="Consolas, Liberation Mono, Courier, monospace">&lt;wbr&gt; </font>se comporta como el punto de código <code>U+200B</code><code> ZERO-WIDTH SPACE </code>. En particular se comporta como un punto de código unicode bidi BN , significando esto que no tiene efecto en ordenamiento bidi : <code>&lt;div dir=rtl&gt;123,&lt;wbr&gt;456&lt;/div&gt; </code>muestra , cuando no se rompa en dos líneas , 123, 456 y no 456 , 123 .</div>
+
+<div> </div>
+
+<p>Por la misma razón el elemento <code>&lt;wbr&gt;</code> no introduce un guión en el salto de línea  .  Para hacer aparecer un guión solo al final de la línea , usar la entidad de caracter del  guión de separación  (<code>&amp;shy;</code>) en su lugar.</p>
+
+<p>Este elemento fue implementado por primera vez en Internet Explorer 5.5 y fue oficialmente definido en HTML5 .</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<table class="standard-table" style="font-size: 14px; font-weight: normal; line-height: 1.5;">
+ <tbody>
+  <tr>
+   <td>Contenido permitido</td>
+   <td>Vacío</td>
+  </tr>
+  <tr>
+   <td>Omisión de etiquetas</td>
+   <td>Es un  {{Glossary("empty element")}}; debe de tener una etiqueta de inicio pero no debe de tener una de cierre .</td>
+  </tr>
+  <tr>
+   <td>Elementos padre permitidos</td>
+   <td>Cualquier elemento que permita  contenido estático de texto.</td>
+  </tr>
+  <tr>
+   <td>Documento normativo</td>
+   <td><a class="external" href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-wbr-element">HTML 5, section 4.6.24</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento solo incluye los<a href="/es/docs/Web/HTML/Atributos_Globales"> atributos globales</a> .</p>
+
+<h2 id="Interfase_DOM">Interfase DOM</h2>
+
+<h2 id="Este_elemento_implementa_la_interface_HTMLElement_."><span style="font-size: 14px; font-weight: normal; line-height: 21px;">Este elemento implementa la interface <a href="/es/docs/Web/API/HTMLElement">HTMLElement </a>. </span></h2>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>La <a href="http://styleguide.yahoo.com/">guia de estilo de Yahoo </a>recomienda <a href="https://shopping.yahoo.com/9780312569846-yahoo-style-guide/">romper una URL antes de la puntuación</a> , para evitar dejar una marca de puntuación en el final de la línea , lo cual el lector podría confundir con el final de la URL .</p>
+
+<pre class="brush: html">&lt;p&gt;http://this&lt;wbr&gt;.is&lt;wbr&gt;.a&lt;wbr&gt;.really&lt;wbr&gt;.long&lt;wbr&gt;.example&lt;wbr&gt;.com/With&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;/p&gt;
+</pre>
+
+<p>{{EmbedLiveSample("Example")}}</p>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.0</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+   <td>11.7</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>1.5</td>
+   <td>1.0</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1]El soporte para la etiqueta <code>&lt;wbr&gt;</code> fue introducido en Internet Explorer 5.5 , aunque removido hasta la versión 7 .</p>
diff --git a/files/es/web/html/element/xmp/index.html b/files/es/web/html/element/xmp/index.html
new file mode 100644
index 0000000000..4a96db3c8a
--- /dev/null
+++ b/files/es/web/html/element/xmp/index.html
@@ -0,0 +1,48 @@
+---
+title: <xmp>
+slug: Web/HTML/Element/xmp
+tags:
+  - Elemento
+  - HTML
+  - Obsoleto
+  - Referencia
+  - Web
+translation_of: Web/HTML/Element/xmp
+original_slug: Web/HTML/Elemento/xmp
+---
+<div>{{Obsolete_header}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El elemento HTML example element <font face="Consolas, Liberation Mono, Courier, monospace">&lt;xmp&gt; </font>dibuja texto entre las etiquetas de inicio y fin sin interpretar el HTML que se encuentra en medio  y lo muestra usando un tipo de letra monoespaciada . La especificación de HTML2 recomendaba que que esta debería de ser dibujada suficientemente amplia para permitir 80 caracteres por línea .</p>
+
+<div class="note">
+<p><strong>Nota: </strong>No usar este elemento .</p>
+
+<ul>
+ <li>Ha sido declarado obsoleto desde HTML3.2 y no fue implementado en una manera consistente . Fue completamente removido del lenguaje en HTML5 .</li>
+ <li>Usar el elemento  {{HTMLElement("pre")}} , o si es semánticamente adecuado , el elemento {{HTMLElement("code")}} en su lugar . Notar que necesitarás escapar los caracteres '&lt;' como '&amp;lt' para asegurarse que no se interprete como marcado .</li>
+ <li>Una letra monoespaciada también puede ser obtenida en algún elemento , aplicando el estilo  <a href="/es/docs/Web/CSS">CSS</a> adecuado usando <code>monospace </code>como el valor genérico de la fuente para la propiedad {{cssxref("font-family")}}</li>
+</ul>
+</div>
+
+<h2 id="Attributes" name="Attributes">Atributos</h2>
+
+<p>Este elemento no tiene otros atributos que los<a href="/es/docs/Web/HTML/Atributos_Globales"> atributos globales </a> comunes a todos los elementos .</p>
+
+<h2 id="DOM_interface" name="DOM_interface">Interfaz  DOM</h2>
+
+<p>Este elemento implementa la interface {{domxref('HTMLElement')}} .</p>
+
+<div class="note">
+<p><strong>Nota de implementación: </strong>hasta  Gecko 1.9.2 inclusivamente , Firefox implemente la interface {{domxref('HTMLSpanElement')}} para este elemento . </p>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>Los elementos  {{HTMLElement("pre")}} y  {{HTMLElement("code")}} que se usan en su lugar .</li>
+ <li>Los elementos  {{HTMLElement("plaintext")}} y  {{HTMLElement("listing")}} , similares a {{HTMLElement("xmp")}} pero también obsoletos .</li>
+</ul>
+
+<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/a/index.html b/files/es/web/html/elemento/a/index.html
deleted file mode 100644
index e35402f7a5..0000000000
--- a/files/es/web/html/elemento/a/index.html
+++ /dev/null
@@ -1,321 +0,0 @@
----
-title: <a>
-slug: Web/HTML/Elemento/a
-tags:
-  - Contenido
-  - Ejemplo
-  - Elemento
-  - HTML
-  - Principiante
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/a
----
-<div>{{HTMLRef}}</div>
-
-<p>El <em>Elemento HTML <code>Anchor</code></em> <strong><code>&lt;a&gt;</code></strong> crea un enlace a otras páginas de internet, archivos o ubicaciones dentro de la misma página, direcciones de correo, o cualquier otra URL.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/a.html")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row">Categorías de contenido</th>
-   <td>Contenido de flujo, contenido de párrafo, contenido interactivo, contenido palpable</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Transparent_content_model" title="HTML/Content_categories#Transparent_content_model">Transparente, que contiene contenido de flujo (excluyendo contenido interactivo) o contenido de párrafo.</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos principales permitidos</th>
-   <td>Cualquier elemento que acepte contenido de párrafo o cualquier elemento que acepte contenido de flujo, sin embargo simpre excluyendo los elementos &lt;a&gt; (de acuerdo con el principio lógico de simetría, si una etiqueta &lt;a&gt; como padre, no puede contener contenido interactivo, entonces el mismo contenido de &lt;a&gt; no puede tener una etiqueta &lt;a&gt; como su padre).</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>{{ARIARole("button")}}, {{ARIARole("checkbox")}}, {{ARIARole("menuitem")}}, {{ARIARole("menuitemcheckbox")}}, {{ARIARole("menuitemradio")}}, {{ARIARole("option")}}, {{ARIARole("radio")}}, {{ARIARole("switch")}}, {{ARIARole("tab")}}, {{ARIARole("treeitem")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLAnchorElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("download")}} {{HTMLVersionInline(5)}}</dt>
- <dd>Este atributo, indica descargar a los navegadores una URL en lugar de navegar hacia ella, por lo que el usuario será dirigido para salvarla como un archivo local.  Si el atributo tiene un valor, éste se utilizará como nombre de archivo por defecto en el mensaje Guardar que se abre cuando el usuario hace clic en el enlace (sin embargo, el usuario puede cambiar el nombre antes de guardar el archivo). No hay restricciones sobre los valores permitidos, aunque: / y: \ se convertirán en guiones bajos (<em>underscores</em>), lo que evitará sugerencias de ruta específicas.  Se debe tener en cuenta que la mayoría de los sistemas de archivos tienen limitaciones con respecto a los símbolos de puntuación admitidos en los nombres de archivo, por lo que los navegadores ajustarán los nombres de los archivos en consecuencia.
- <div class="note"><strong>Notas:</strong>
- <ul>
-  <li>Este atributo sólo funciona para las <a href="https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy">políticas de mismo origen (same-origin URLs)</a>.</li>
-  <li>Este atributo puede ser utilizado con <a href="https://developer.mozilla.org/en-US/docs/Web/API/URL.createObjectURL"><code>blob:</code> URLs</a> y <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs"><code>data:</code> URLs</a> para descargar contenido generado por JavaScript, tales como fotografías creadas por una aplicación web de edición de imágenes.</li>
-  <li>Si el encabezado (<em>header</em>) HTTP <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Disposition"><code>Content-Disposition:</code></a> proporciona un nombre de archivo diferente al de este atributo, el encabezado HTTP tiene prioridad sobre este atributo.</li>
-  <li>Si <code>Content-Disposition:</code> está ajustado a <code>inline</code>, Firefox prioriza <code>Content-Disposition</code>, como en el caso del nombre de archivo, mientras que Chrome prioriza el atributo <code>download</code>.</li>
- </ul>
- </div>
- </dd>
- <dt>{{htmlattrdef("href")}}</dt>
- <dd>Contiene una URL o un fragmento de URL al cual apunta el enlace.</dd>
- <dd>Un fragmento de URL es un nombre ("name") precedido por el símbolo de número (<code>#</code>), el cual especifíca una ubicación interna objetivo (un <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes#attr-id">ID</a> de un elemento HTML) dentro del actual documento. Las URLs no están restringidas sólo a documentos de internet basados en HTTP, sin embargo pueden utilizar cualquier protocolo soportado por el navegador. Por ejemplo, <a class="external external-icon" href="https://en.wikipedia.org/wiki/File_URI_scheme"><code>file:</code></a>, <code>ftp:</code>, and <code>mailto:</code> funcionan en la mayoría de los navegadores.</dd>
- <dd>Este atributo puede ser omitido (a partir de HTML5) para crear un enlace de marcador de posición. Un enlace de marcador de posición se parece a un enlace tradicional, pero que no dirige a algún lugar.
- <div class="note">
- <p><strong>Nota:</strong> Puede ser utilizado <code>href="#top"</code> o un fragmento vacío <code>href="#"</code> para enlazar a la parte superior de la página actual. <a href="https://www.w3.org/TR/html5/single-page.html#scroll-to-fragid">Este comportamiento está especficado en HTML5</a>.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("hreflang")}}</dt>
- <dd>Este atributo indica el lenguaje humano del recurso al que se enlaza. Este es únicamente informativo, sin ninguna funcionalidad incorporada. Los valores permitidos están determinados por <a class="external external-icon" href="https://www.ietf.org/rfc/bcp/bcp47.txt" title="Tags for Identifying Languages">BCP47</a>.</dd>
- <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt>
- <dd>Indica que <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referer">referencia (<em>referer</em>)</a> enviar cuado la URL es recuperada:
- <ul>
-  <li><code>'no-referrer'</code> significa <code>Referer:</code> el encabezado no será enviado.</li>
-  <li><code>'no-referrer-when-downgrade'</code> significa sin <code>Referer:</code> el encabezado será enviado cuando se navega a un origen (<code>origin</code>) sin HTTPS. Este es un comportamiento por defecto.</li>
-  <li><code>'origin'</code> significa que el "referrer" estará en el <a href="https://developer.mozilla.org/en-US/docs/Glossary/Origin">origen</a> (<code>origin</code>) de la página, no incluye la información posterior al dominio.</li>
-  <li><code>'origin-when-cross-origin'</code> significa que la navegación a otros orígenes (<em>origins</em>) será limitada al esquema (<em>scheme</em>), el host y el puerto, mientras que la navegación en el mismo origen (origin) incuirá la trayectoria de referencia (<em>referrer's path</em>).</li>
-  <li><code>'unsafe-url'</code> significa que la referencia (<em>referrer</em>) incuirá el origen(<code>origin</code>) y la trayectoria (<em>path</em>), pero no el fragmento, contraseña o nombre de usuario. Esto es inseguro, ya que puede filtrar datos desde una URL segura hacia URLs inseguras.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("rel")}}</dt>
- <dd>Especifica la relación del objeto de destino con el objeto de enlace. El valor es una lista separada por espacios de tipos de enlace<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types"> tipos de enlace (link types)</a>.</dd>
- <dt>{{htmlattrdef("target")}}</dt>
- <dd>Especifica en donde desplegar la URL enlazada. Es un nombre (<em>name of</em>), o palabra clave (<em>keyword for</em>), un contexto de navegación <em>(browsing context)</em>: una pestaña, ventana, o <code>&lt;iframe&gt;</code>. Las siguientes palabras clave (<em>keywords</em>) tienen significado especial:
- <ul>
-  <li><code>_self</code>: Carga la URL en el mismo contexto de navegación que el actual. Este es el comportamiento por defecto.</li>
-  <li><code>_blank</code>: Carga la URL en un nuevo contexto de navegación. Usualmente es una pestaña, sin embargo, los usuarios pueden configurar los navegadores para utilizar una ventana nueva en lugar de la pestaña.</li>
-  <li><code>_parent</code>: Carga la URL en el contexto de navegación padre (<em>parent</em>) del actual. Si no existe el padre, este se comporta del mismo modo que <code>_self</code>.</li>
-  <li><code>_top</code>: Carga la URL en le contexto más alto de navegación (el cual es un ancestro del actual, y no tiene padre (<em>parent</em>)). Si no hay padre (<em>parent</em>), este se comporta del mismo modo que <code>_self</code>.</li>
- </ul>
-
- <div class="note">
- <p><strong>Nota:</strong> Cuando se utiliza <code>target</code>, considera agregar <code>rel="noopener noreferrer"</code> para evitar el uso de la API <code>window.opener</code>.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("type")}}</dt>
- <dd>Especifica el tipo de medio (<em>media type</em>) en la forma de {{Glossary("MIME type")}} para la URL enlazada. Esto es únicamente informativo, sin ninguna funcionalidad incorporada.</dd>
- <dt>
- <h3 id="Obsoleto">Obsoleto</h3>
- </dt>
- <dt>{{htmlattrdef("charset")}} {{obsoleteGeneric("inline","HTML5")}}</dt>
- <dd>Este atributo define la <a href="https://developer.mozilla.org/en-US/docs/Glossary/character_encoding">codificación de caracteres (character encoding)</a> de la URL enlazada. El valor debe de ser una lista delimitada por espacio y/o coma de caracteres definidos en <a class="external external-icon" href="https://tools.ietf.org/html/rfc2045">RFC 2045</a>. El valor por defecto es <code>ISO-8859-1</code>.
- <div class="note">
- <p><strong>Nota de uso:</strong> Este atributo es obsoleto en HTML5 y <strong>no debe ser utilizado por autores</strong>. Para lograr su efecto, se debe utilzar el encabezado HTTP <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Type"><code>Content-Type:</code></a> en la URL enlazada.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("coords")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
- <dd>Para utilizar con el siguiente atributo <code>shape</code>, este atributo utiliza una lista de números separada por comas para definir las coordenadas del enlace en la página.</dd>
- <dt>{{htmlattrdef("name")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
- <dd>Este atributo era requerido para anclas (<em>anchors</em>) que definían una posible ubicación dentro de la página. En HTML 4.01, <code>id</code> y <code>name</code> podían ser utilizados simultáneamente en un elemento <code>&lt;a&gt;</code> simpre y cuando tuvieran valores idénticos.
- <div class="note">
- <p><strong>Nota de uso:</strong> Este atributo es obsoleto en HTML5, se utiliza el <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes#attr-id">atributo global <code>id</code></a> en su lugar.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("rev")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
- <dd>Este atributo especifica un enlace inverso, la relación inversa del atributo <strong>rel</strong>. Fue desechado por ser muy confuso.</dd>
- <dt>{{htmlattrdef("shape")}} {{HTMLVersionInline(4)}} only, {{obsoleteGeneric("inline","HTML5")}}</dt>
- <dd>Este atributo era utilizado para definir una región de enlaces para crear un mapa de imagen. El valore es <code>circle</code>, <code>default</code>, <code>polygon</code>, y <code>rect</code>. El formato del atributo <code>coords</code> depende del valor de la forma geométrica. Para <code>circle</code>, el valor es <code>x,y,r</code> donde <code>x</code> y <code>y</code> son las coordenadas en pixel para el centro del círculo y  <code>r</code> es el valor del radio en pixeles. Para <code>rect</code>, el atributo <code>coords</code> debe ser <code>x,y,w,h</code>. Los valores <code>x y y</code> definen la esquina superior izquierda del rectángulo, mientras que <code>w</code> y <code>h</code> definen el ancho y el alto respectivamente. Un valor del <code>polygon</code> para <code>shape</code> requiere los valores <code>x1,y1,x2,y2,...</code>para <code>coords</code>. Cada uno de los pares <code>x,y</code> definen un punto en el polígono, con puntos sucesivos que son unidos por líneas rectas y el útlimo punto se une al primer punto. El valor <code>default</code> para <code>shape</code> Requiere que el área encerrada, típicamente una imágen, sea utilizada.
- <div class="note"><strong>Nota:</strong> Utilice el <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-usemap">atributo <code>usemap</code></a> para el elemento {{HTMLElement("img")}} y el elemento asociado {{HTMLElement("map")}} para definir puntos de acceso (<em>hotspots</em>) en lugar del atributo <code>shape</code>.</div>
- </dd>
-</dl>
-
-<div>
-<h2 id="sect1"></h2>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Enlazando_a_una_ubicación_externa">Enlazando a una ubicación externa</h3>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;!-- anclaje a un archivo externo --&gt;
-&lt;a href="https://www.mozilla.com/"&gt;
-Enlace externo
-&lt;/a&gt;</code></pre>
-
-<h4 id="Resultado">Resultado</h4>
-
-<p><a class="external external-icon" href="https://www.mozilla.com/">Enlace externo</a></p>
-
-<h3 id="Enlazando_a_otra_sección_de_la_misma_página">Enlazando a otra sección de la misma página</h3>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;!-- enlace a un elemento en esta página con id="attr-href" --&gt;
-&lt;a href="#attr-href"&gt;
-Descripción de enlaces de la misma página
-&lt;/a&gt;</code></pre>
-
-<h4 id="Resultado_2">Resultado</h4>
-
-<p><a href="#attr-href">Descripción de enlaces de la misma página</a></p>
-
-<h3 id="Creando_una_imagen_clicable">Creando una imagen clicable</h3>
-
-<p>Este ejemplo utiliza una imagen que enlaza a la página de inicio de MDN. La página de inicio se abrirá en un contexto de navegación nuevo, esto es, en una nueva página o nueva ventana.</p>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;a href="https://developer.mozilla.org/en-US/" target="_blank"&gt;
-  &lt;img src="https://mdn.mozillademos.org/files/6851/mdn_logo.png"
-       alt="MDN logo" /&gt;
-&lt;/a&gt;</code></pre>
-
-<h4 id="Resulta">Resulta</h4>
-
-<figure>
-<p>{{EmbedLiveSample("Creating_a_clickable_image", "320", "64")}}</p>
-</figure>
-
-<h3 id="Creando_un_enlace_de_correo">Creando un enlace de correo</h3>
-
-<p>Es común crear enlaces que abren el programa de correo del usuario para permitir enviar un nuevo mensaje. Esto se hace con un enlace <code>mailto:</code>. Aquí tenemos un ejemplo:</p>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;a href="mailto:nowhere@mozilla.org"&gt;Enviar correo a nowhere&lt;/a&gt;</code></pre>
-
-<h4 id="Resultado_3">Resultado</h4>
-
-<p><a href="mailto:nowhere@mozilla.org">Envia un correo a: nowhere</a></p>
-
-<p>Para detalles adicionales acerca del esquema de la URL <code>mailto</code>, tales como incluir el asunto, el cuerpo u otros contenidos predeterminados, consultar <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Email_links">Enlaces de correo (Email links)</a> o {{RFC(6068)}}.</p>
-
-<h3 id="Creando_un_enlace_a_un_número_de_teléfono">Creando un enlace a un número de teléfono</h3>
-
-<p>Ofrecer enlaces a números de teléfono es muy útil para los ususarios que observan documentos de internet desde computadoras portátiles conectadas a teléfonos o desde teléfonos celulares (móviles)</p>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html">&lt;a href="tel:+491570156"&gt;+49 157 0156&lt;/a&gt;</code></pre>
-
-<p>Para detalles adicionales acerca del esquema de la URL <code>tel</code>, consultar {{RFC(2806)}} y {{RFC(2396)}}.</p>
-
-<h3 id="Utilizando_el_atributo_download_para_guardar_un_&lt;canvas>_como_PNG">Utilizando el atributo <code>download</code> para guardar un  <code>&lt;canvas&gt;</code> como PNG</h3>
-
-<p>Si deseas permitir a los usurios descargar una elemento HTML {{HTMLElement("canvas")}} como una imagen, puedes crear un enlace con una atributo <code>download</code> y la información canvas como un archivo URL:</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">var link = document.createElement('a');
-link.innerHTML = 'download image';
-
-link.addEventListener('click', function(ev) {
-    link.href = canvas.toDataURL();
-    link.download = "mypainting.png";
-}, false);
-
-document.body.appendChild(link);</code></pre>
-
-<p>Puedes ver como funciona en: <a href="https://jsfiddle.net/codepo8/V6ufG/2/">jsfiddle.net/codepo8/V6ufG/2/</a>.</p>
-
-<h2 id="Notas">Notas</h2>
-
-<p>HTML 3.2 define sólo los atributos <code>name</code>, <code>href</code>, <code>rel</code>, <code>rev</code>, y <code>title</code>.</p>
-
-<h3 id="Recomendaciones_de_accesibilidad">Recomendaciones de accesibilidad</h3>
-
-<p>Se abusa frecuntemente de las etiquetas de ancla (<em>anchor tags</em>) con el uso de los eventos <code>onclick</code> para crear pseudo-botones ajustando <strong>href</strong> a <code>"#"</code> o <code>"javascript:void(0)"</code> para prevenir la recarga de la página. Estos valores provocan comportamientos inesperados con los enlaces de copiado/dibujado, la apertura de enlaces en nuevas pestañas/ventanas, el guardado de enlaces (<em>bookmarking</em>), y cuando JavaScript está aún descargando, esto arroja errores, o es deshabilitado. Esto tambíen lleva a semánticas (<em>semantics</em>) incorrectas para tecnologías de asistencia (p.ej., lectores de pantalla). En estos casos, se recomienda utilizar un {{HTMLElement("button")}} en su lugar. En general, sólo se debe utilizar una ancla (<em>anchor</em>) para navegación utilizando una URL adecuada.</p>
-
-<h3 id="Cliceo_y_enfoque">Cliceo y enfoque</h3>
-
-<p>Cuando se clicea sobre un {{HTMLElement("a")}} las consecuencias varían de acuerdo al navegador y el sistema operativo.</p>
-
-<table>
- <caption>¿Al hacer clic en un {{HTMLElement("a")}} se enfoca?</caption>
- <tbody>
-  <tr>
-   <td>Navegadores de escritorio</td>
-   <th>Windows 8.1</th>
-   <th>OS X 10.9</th>
-  </tr>
-  <tr>
-   <th>Firefox 30.0</th>
-   <td style="background-color: LawnGreen;">Si</td>
-   <td style="background-color: LawnGreen;">Si</td>
-  </tr>
-  <tr>
-   <th>Chrome ≥39<br>
-    (<a href="https://code.google.com/p/chromium/issues/detail?id=388666" title="Issue 388666: Focus anchor (A) elements on mousedown">Chromium bug 388666</a>)</th>
-   <td style="background-color: LawnGreen;">Si</td>
-   <td style="background-color: LawnGreen;">Si</td>
-  </tr>
-  <tr>
-   <th>Safari 7.0.5</th>
-   <td style="background-color: silver;">N/A</td>
-   <td style="background-color: yellow;">Sólo cuando tiene un <code>tabindex</code></td>
-  </tr>
-  <tr>
-   <th>Internet Explorer 11</th>
-   <td style="background-color: LawnGreen;">Si</td>
-   <td style="background-color: silver;">N/A</td>
-  </tr>
-  <tr>
-   <th>Presto (Opera 12)</th>
-   <td style="background-color: LawnGreen;">Si</td>
-   <td style="background-color: LawnGreen;">Si</td>
-  </tr>
- </tbody>
-</table>
-
-<table>
- <caption>¿Al hacer un clic en un {{HTMLElement("a")}} se enfoca?</caption>
- <tbody>
-  <tr>
-   <td>Navegadores móviles</td>
-   <th>iOS 7.1.2</th>
-   <th>Android 4.4.4</th>
-  </tr>
-  <tr>
-   <th>Safari Mobile</th>
-   <td style="background-color: yellow;">Sólo cuando tiene un <code>tabindex</code></td>
-   <td style="background-color: silver;">N/A</td>
-  </tr>
-  <tr>
-   <th>Chrome 35</th>
-   <td>???</td>
-   <td style="background-color: yellow;">Sólo cuando tiene un <code>tabindex</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
-  <tbody>
-  <tr>
-   <td>{{SpecName("Referrer Policy", "#referrer-policy-delivery-referrer-attribute", "referrer attribute")}}</td>
-   <td>{{Spec2("Referrer Policy")}}</td>
-   <td>Added the <code>referrerpolicy</code> attribute.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML WHATWG", "textlevel-semantics.html#the-a-element", "&lt;a&gt;")}}</td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "textlevel-semantics.html#the-a-element", "&lt;a&gt;")}}</td>
-   <td>{{Spec2("HTML5 W3C")}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML4.01", "struct/links.html#h-12.2", "&lt;a&gt;")}}</td>
-   <td>{{Spec2("HTML4.01")}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.a")}}</p>
-
-<h2 id="Consultar_también">Consultar también</h2>
-
-<ul>
- <li>Otros elementos comunicando a nivel semántico de texto <a href="https://developer.mozilla.org/en-US/docs/HTML/Text_level_semantics_conveying_elements">(text-level semantics)</a>: {{HTMLElement("abbr")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.</li>
-</ul></div>
diff --git a/files/es/web/html/elemento/abbr/index.html b/files/es/web/html/elemento/abbr/index.html
deleted file mode 100644
index 8646722071..0000000000
--- a/files/es/web/html/elemento/abbr/index.html
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: <abbr>
-slug: Web/HTML/Elemento/abbr
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/abbr
----
-<p id="Summary">{{HTMLRef}}</p>
-
-<p>El <strong>elemento HTML <code>&lt;abbr&gt;</code></strong> (<em>o Elemento de Abreviación HTML</em>) representa una abreviación o acrónimo; el atributo opcional {{htmlattrxref("title")}} puede ampliar o describir la abreviatura. Si está presente, el atributo <code>title</code> debe contener la descripción completa y nada más.</p>
-
-<pre class="brush: html">&lt;p&gt;I do &lt;abbr title="Hypertext Markup Language"&gt;HTML&lt;/abbr&gt;&lt;/p&gt;</pre>
-
-<p style="margin-top: -1.5em;"><small>El artículo <a href="/en-US/Learn/HTML/Howto/Mark_abbreviations_and_make_them_understandable">Cómo marcar abreviaciones y hacerlas entendibles</a> es una guía para aprender a usar <code>&lt;abbr&gt;</code> y elementos relacionados.</small></p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_estático_o_de_texto">contenido estático o de texto</a>, contenido palpable</td>
-  </tr>
-  <tr>
-   <th scope="row">Conteido permitido</th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_estático_o_de_texto">Contenido de estático o de texto</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_estático_o_de_texto">contenido estático o de texto</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento sólo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>. El atributo {{htmlattrxref("title")}} tiene un sentido específicamente semántico cuando es usado con el elemento <code>&lt;abbr&gt;</code>; <em>debe </em>contener una completa descripción o ampliación de la abreviación. Este texto es usualmente presentado por los navegadores como tooltip cuando se pasa el mouse sobre el elemento.</p>
-
-<p>Cada elemento <code>&lt;abbr&gt;</code> usado es independiente de todos los otros; dar un <code>&lt;title&gt;</code> a uno no hace que automáticamente todos los demás adquieran la misma descripción.</p>
-
-<div class="note">
-<p><strong>Nota: </strong>En lenguajes con números gramaticales (especialmente lenguajes con más de dos números, como el Árabe), utiliza el mismo número gramatical en el atributo <code>title</code> como dentro del elemento <code>&lt;abbr&gt;</code>.</p>
-</div>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('HTML WHATWG', 'text-level-semantics.html#the-abbr-element', '&lt;abbr&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-abbr-element', '&lt;abbr&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/text.html#edef-ABBR', '&lt;abbr&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>2.0</td>
-   <td>{{CompatGeckoDesktop(1.0)}} [1]</td>
-   <td>7.0</td>
-   <td>1.3</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Hasta Gecko 1.9.2 (Firefox 3.6), Firefox implementó la interfaz {{domxref("HTMLSpanElement")}} para este elemento en lugar de la interfaz {{domxref("HTMLElement")}}.</p>
-
-<h2 id="Estilo_por_defecto">Estilo por defecto</h2>
-
-<p>El propósito de este elemento es puramente para la conveniencia del autor y por defecto todos los navegadores lo muestran en línea ({{cssxref('display')}}<code>: inline</code>), sin embargo su estilo por defecto varía de un navegador a otro:</p>
-
-<ul>
- <li>Algunos navegadores, como Internet Exlorer, no lo diseñan de manera diferente que el elemento {{HTMLElement("span")}}.</li>
- <li>Opera, Firefox, y algunos otros añaden un subrayado de puntos al contenido del elemento.</li>
- <li>Algunos navegadores no sólo añaden un subrayado de puntos, sino que también lo ponen en minúsculas; para evitar este estilo, añadir algo como {{cssxref('font-variant')}}<code>: none</code> en CSS se hace cargo de este caso.</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/Learn/HTML/Howto/Mark_abbreviations_and_make_them_understandable">Utilizando el elemento &lt;abbr&gt;</a></li>
- <li>Otros elementos de nivel semántico de texto: {{HTMLElement("a")}}, {{HTMLElement("em")}}, {{HTMLElement("strong")}}, {{HTMLElement("small")}}, {{HTMLElement("cite")}}, {{HTMLElement("q")}}, {{HTMLElement("dfn")}}, {{HTMLElement("time")}}, {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("samp")}}, {{HTMLElement("kbd")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{HTMLElement("b")}}, {{HTMLElement("i")}}, {{HTMLElement("mark")}}, {{HTMLElement("ruby")}}, {{HTMLElement("rp")}}, {{HTMLElement("rt")}}, {{HTMLElement("bdo")}}, {{HTMLElement("span")}}, {{HTMLElement("br")}}, {{HTMLElement("wbr")}}.</li>
-</ul>
-
-<div> </div>
diff --git a/files/es/web/html/elemento/acronym/index.html b/files/es/web/html/elemento/acronym/index.html
deleted file mode 100644
index 94581489a3..0000000000
--- a/files/es/web/html/elemento/acronym/index.html
+++ /dev/null
@@ -1,160 +0,0 @@
----
-title: acronym
-slug: Web/HTML/Elemento/acronym
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/acronym
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>acromym</strong> de acromyn=acrónimo</p>
-
-<p>Es el encargado para marcar estas formas abreviadas (modem, AJAX...). Además, gracias al atributo <code style="color: green;">title</code> podemos indicar la versión extendida del término.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;abbr&gt; y &lt;/abbr&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<pre class="eval"><span class="nowiki">
- &lt;p&gt;
- El acrónimo de moda es:
- &lt;acronym lang="en" title="Asynchronous JavaScript and XML"&gt;Ajax&lt;/acronym&gt;.
- &lt;/p&gt;
- </span>
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<p>En Firefox se resalta con un "subrayado" punteado fino. vea el ejemplo:</p>
-
-<pre class="eval"><span class="nowiki">
- &lt;p&gt;
- el &lt;abbr lang="en" title="Mocilla developer center"&gt;MDC&lt;/abbr&gt; toma el
- &lt;span style='border-bottom: dotted thin;'
- title='esto no es ni una abreviatura ni un acrónimo'&gt;relevo&lt;/span&gt; de lo que fue el
- &lt;acronym lang="en" title="DEVeloper.Mozilla.Org"&gt;Devmo&lt;/acronym&gt;.
- &lt;/p&gt;
- </span>
-</pre>
-
-<p>Cabe destacar que <a href="es/HTML/Elemento/abbr">abbr</a> y <a href="es/HTML/Elemento/acronym">acronym</a> comparten estilo predeterminado.</p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-acronym">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<p>El tema de las abreviaturas y acrónimos puede ser un tanto lioso. En castellano a veces cuesta saber si tal 'palabra' es una <a class="external" href="http://es.wikipedia.org/wiki/Abreviatura">abreviatura</a>, un <a class="external" href="http://es.wikipedia.org/wiki/Acr%C3%B3nimo">acrónimo</a> una sigla o un símbolo. Para complicarlo un poco más, resulta que el estándar html está en inglés y parece ser que las gramáticas castellana e inglesa no definen exactamente igual conceptos como <a href="es/HTML/Elemento/abbr">abreviatura</a> o <a href="es/HTML/Elemento/acronym">acrónimo</a>.</p>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <strong>acronym</strong> en el estándar <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-ACRONYM">HTML 4.01</a></li>
-</ul>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/address/index.html b/files/es/web/html/elemento/address/index.html
deleted file mode 100644
index fdfacfeba1..0000000000
--- a/files/es/web/html/elemento/address/index.html
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: <address>
-slug: Web/HTML/Elemento/address
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/address
----
-<p id="Summary">{{HTMLRef}}</p>
-
-<p>El <strong>elemento HTML <code>&lt;address&gt;</code></strong> aporta información de contacto para su {{HTMLElement("article")}} más cercano o ancestro {{HTMLElement("body")}}; en el último caso lo aplica a todo el documento.</p>
-
-<div class="note">
-<p><strong>Notas de uso:</strong></p>
-
-<ul>
- <li>Para representar una dirección arbitraria, una que no esté relacionada con la información de contacto, utiliza un elemento {{HTMLElement("p")}} en lugar del elemento <code>&lt;address&gt;</code>.</li>
- <li>Este elemento no debe contener más información que la información de contacto, como una fecha de publicación (que pertenece al elemento {{HTMLElement("time")}}).</li>
- <li>Normalmente un elemento <code>&lt;address&gt;</code> puede ser colocado dentro del elemento {{HTMLElement("footer")}} de la sección actual, si lo hay.</li>
-</ul>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, contenido palpable</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>
-    <p><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, pero no con elementos <code>&lt;address&gt;</code> anidados, no contenidos de cabecera ({{HTMLElement("hgroup")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}), no contenido de sección ({{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}}), y no elemento {{HTMLElement("header")}} o {{HTMLElement("footer")}}.</p>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Etiqueta de omisión</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido dinámico</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>
-    <p>{{domxref("HTMLElement")}} antes de Gecko 2.0 (Firefox 4), Gecko implementó este elemento usando la interfaz {{domxref("HTMLSpanElement")}}.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento solo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<h2 id="Example">Example</h2>
-
-<pre class="brush: html">  &lt;address&gt;
-    You can contact author at &lt;a href="http://www.somedomain.com/contact"&gt;www.somedomain.com&lt;/a&gt;.&lt;br&gt;
-    If you see any bugs, please &lt;a href="mailto:webmaster@somedomain.com"&gt;contact webmaster&lt;/a&gt;.&lt;br&gt;
-    You may also want to visit us:&lt;br&gt;
-    Mozilla Foundation&lt;br&gt;
-    1981 Landings Drive&lt;br&gt;
-    Building K&lt;br&gt;
-    Mountain View, CA 94043-0801&lt;br&gt;
-    USA
-  &lt;/address&gt;
-</pre>
-
-<p>Above HTML will output:</p>
-
-<p><img alt="Image:HTML-address.png" src="/@api/deki/files/238/=HTML-address.png"></p>
-
-<p>Aunque el elemento de dirección representa el texto con el mismo estilo predeterminado de los elementos {{HTMLElement("i")}} o {{HTMLElement("em")}}, es más apropiado utilizarlo cuando se trata información de contacto, ya que transmite la información semántica adicional.</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'sections.html#the-address-element', '&lt;address&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'sections.html#the-address-element', '&lt;address&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.5.6', '&lt;address&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>1.0</td>
-   <td>5.12</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mini</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.7")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Otras elementos de sección relacionados: {{HTMLElement("body")}}, {{HTMLElement("nav")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("footer")}}, {{HTMLElement("section")}}, {{HTMLElement("header")}};</li>
- <li class="last"><a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document">Secciones y línea generales de un documento HTML5</a>.</li>
-</ul>
diff --git a/files/es/web/html/elemento/applet/index.html b/files/es/web/html/elemento/applet/index.html
deleted file mode 100644
index 51282989af..0000000000
--- a/files/es/web/html/elemento/applet/index.html
+++ /dev/null
@@ -1,236 +0,0 @@
----
-title: applet
-slug: Web/HTML/Elemento/applet
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/applet
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Permite añadir un applet Java en un documento HTML. Es un elemento <a href="es/HTML/Elemento/Tipos_de_elementos#Desaprobado">Desaprobado</a> En su lugar debe usarse el elemento <a href="es/HTML/Elemento/object">object</a>, su uso solo es válido declarando el dtd transicional.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;applet&gt; y &lt;/applet&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#Especiales">Elemento especial</a>. <a href="es/HTML/Elemento/Tipos_de_elementos#Desaprobado">Desaprobado</a></dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong> cero o más elementos param o del tipo 'en flujo'.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title </code></td>
-   <td>Texto</td>
-   <td>Implícito</td>
-   <td>Título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style </code></td>
-   <td>Reglas de estilo CSS</td>
-   <td>Implícito</td>
-   <td>Información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id </code></td>
-   <td>Un 'nombre'</td>
-   <td>Implícito</td>
-   <td>Identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class </code></td>
-   <td>Lista de clases CSS</td>
-   <td>implícito</td>
-   <td>Identificador a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir </code></td>
-   <td>Uno de los siguientes: "ltr" o "rtl"</td>
-   <td>Implícito</td>
-   <td>Dirección del texto.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang </code></td>
-   <td>Código de idioma</td>
-   <td>Implícito</td>
-   <td>Información sobre el idioma.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">declare </code></td>
-   <td>(declare)</td>
-   <td>Implícito</td>
-   <td>Información sobre el idioma.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">classid </code></td>
-   <td>Una dirección</td>
-   <td>Implícito</td>
-   <td>Identifica una implementación.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">codebase </code></td>
-   <td>Una dirección</td>
-   <td>Implícito</td>
-   <td>URI base para classid, datos, archivo.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">data </code></td>
-   <td>Una dirección</td>
-   <td>Implícito</td>
-   <td>Referencia a los datos del objeto.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">type </code></td>
-   <td>Tipo MIME</td>
-   <td>Implícito</td>
-   <td>Tipo de contenido de los datos.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">codetype </code></td>
-   <td>Tipo MIME</td>
-   <td>Implícito</td>
-   <td>Tipo de contenido del código.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">archive </code></td>
-   <td>Direcciones</td>
-   <td>Implícito</td>
-   <td>Lista de URIs separados por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">standby </code></td>
-   <td>Texto</td>
-   <td>Implícito</td>
-   <td>Mensaje a mostrar durente la carga.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">height </code></td>
-   <td>Tamaño</td>
-   <td>Implícito</td>
-   <td>Especificar nueva altura.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">width </code></td>
-   <td>Tamaño</td>
-   <td>Implícito</td>
-   <td>Especificar nueva anchura.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">usemap </code></td>
-   <td>Una dirección</td>
-   <td>Implícito</td>
-   <td>Usar mapa de imágenes en el cliente.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">name </code></td>
-   <td>CDATA</td>
-   <td>Implícito</td>
-   <td>Enviar como parte de un formulario.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">tabindex </code></td>
-   <td>Número</td>
-   <td>Implícito</td>
-   <td>Posición en el orden de tabulación.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">align </code></td>
-   <td>Uno de los siguientes: "top", "middle", "bottom", "left", "right".</td>
-   <td>Implícito</td>
-   <td>Alineación vertical u horizontal.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">border </code></td>
-   <td>Píxeles</td>
-   <td>Implícito</td>
-   <td>Grosor del borde del vínculo.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">hspace </code></td>
-   <td>Píxeles</td>
-   <td>Implícito</td>
-   <td>espacio horizontal.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">vspace </code></td>
-   <td>Píxeles</td>
-   <td>Implícito</td>
-   <td>Espacio vertical.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;"> %reserved; </code></td>
-   <td> </td>
-   <td> </td>
-   <td>Reservado para posibles usos futuros.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval"><span class="nowiki"> Ejemplo con applet:
-
-   &lt;applet code="loquesea.class"
-            width="500" height="500"&gt;
-       &lt;!-- Aquí los contenidos alternativos por si falla el applet. --&gt;
-  &lt;/applet&gt;
-
-  Lo mismo pero usando el elemento object:
-
-  &lt;object  codetype="application/java"
-            classid="java:loquesea.class"
-            width="500" height="500"&gt;
-     &lt;!-- Aquí los contenidos alternativos por si falla el applet. --&gt;
-  &lt;/object&gt;</span>
-</pre>
-
-<p> </p>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p><span class="comment">El contenido de applet actúa como información alternativa para agentes de usuario que no soporten este elemento o que estén configurados para no soportar applets. En cualquier otro caso los agentes de usuario deben ignorar el contenido.</span></p>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#edef-APPLET"><strong>applet</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p><span class="comment">secciones futuras: == Soporte de los navegadores == == Valores por defecto y visualización en Firefox ==</span></p>
diff --git a/files/es/web/html/elemento/area/index.html b/files/es/web/html/elemento/area/index.html
deleted file mode 100644
index 201e8745a2..0000000000
--- a/files/es/web/html/elemento/area/index.html
+++ /dev/null
@@ -1,212 +0,0 @@
----
-title: area
-slug: Web/HTML/Elemento/area
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/area
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>area</strong> de area=área</p>
-
-<p>Sirve para crear las distintas secciones en las que se puede dividir un <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#include-maps">mapas de imágenes</a> en el cliente.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;area&gt; (solo tiene una).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: No.</dd>
-</dl>
-
-<dl>
- <dd><strong>Es un</strong>: Elemento para mapas de imágenes.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Nada.</dd>
-</dl>
-
-<dl>
- <dd><strong>Solo puede ser hijo de</strong>: Elementos <a href="es/HTML/Elemento/map">map</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-shape"><span style="color: green;">shape </span></a></td>
-   <td>Indica la forma del área del mapa.</td>
-   <td>Uno de los siguientes: <code>'rect'</code>, <code>'circle'</code>, <code>'poly'</code>, o <code>'default'</code>.</td>
-   <td><abbr title="Por defecto">PD.</abbr>: <code>'rect'</code></td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-coords"><span style="color: green;">coords </span></a></td>
-   <td>Indica las coordenadas (x,y) del área del mapa.</td>
-   <td>Lista de: cantidades de píxeles, o porcentajes de espacio disponible. Separadas por comas.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/links.html#adef-href"><span style="color: green;">href </span></a></td>
-   <td>La dirección del recurso vínculado.</td>
-   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> (o no).</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-nohref"><span style="color: green;">nohref </span></a></td>
-   <td>Indica que el área no es activa, no tiene enlace.</td>
-   <td>Uno: 'nohref'</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-alt"><span style="color: green;">alt </span></a></td>
-   <td>Describe el área o su vínculo, es necesario por que <strong>area</strong> no tiene contenido.</td>
-   <td>Texto legible. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td><abbr title="El autor debe indicarlo">Requerido</abbr></td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-accesskey"><span style="color: green;">accesskey </span></a></td>
-   <td>Define una tecla de acceso rápido. Importante para la <a href="es/Accesibilidad">Accesibilidad</a>.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-character">carácter</a> o letra.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-tabindex"><span style="color: green;">tabindex </span></a></td>
-   <td>Asigna un número de posición en el orden de tabulación.</td>
-   <td>Un número entre 0 y 32767.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onfocus, onblur.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">target </code></td>
-   <td>Indica el <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#h-16.1">marco</a> en el que se cargará el recurso.</td>
-   <td>Puede ser el nombre de un marco existente, o un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-frame-target">nombre reservado</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_mapa_de_im.C3.A1genes_dividido_en_dos" name="Un_mapa_de_im.C3.A1genes_dividido_en_dos">Un mapa de imágenes dividido en dos</h4>
-
-<pre class="eval"><span class="nowiki">
- &lt;object data="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png"
-         usemap="#map1" type="image/png"
-         width="135" height="155"&gt;
-
-   &lt;map name="map1"&gt;
-     &lt;area href="http://www.mozilla.com/firefox/"
-       alt="El navegador"
-       shape="rect"
-       coords="0,0,60,155"&gt;
-
-     &lt;area href="http://www.mozilla.com/thunderbird/"
-       alt="El gestor de correo"
-       shape="rect"
-       coords="75,0,135,155"&gt;
-   &lt;/map&gt;
- &lt;/object&gt;
- </span>
-</pre>
-</div>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-area">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li><strong>area</strong> es un elemento antiguo con el que pueden hacerse mapas simples y poco accesibles. No se recomienda su uso, es preferible diseñar los mapas con elementos en bloque y <a href="es/HTML/Elemento/a">anclas</a>.</li>
-</ul>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>Los mapas de imágenes y el elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#h-13.6"><strong>area</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras! Disculpen las molestias.</p>
-
-<p>¿Quieres participar en su ampliación? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/article/index.html b/files/es/web/html/elemento/article/index.html
deleted file mode 100644
index 8df680ad6b..0000000000
--- a/files/es/web/html/elemento/article/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: article
-slug: Web/HTML/Elemento/article
-translation_of: Web/HTML/Element/article
----
-<p>El <em>Elemento article de HTML</em> <span style="font-family: Courier New;">(&lt;article&gt;)</span> representa una composición auto-contenida en un documento, página, una aplicación o en el sitio, que se destina a distribuir de forma independiente o reutilizable, por ejemplo, en la indicación. Podría ser un mensaje en un foro, un artículo de una revista o un periódico, una entrada de blog, un comentario de un usuario, un widget interactivo o gadget, o cualquier otro elemento independiente del contenido.</p>
-
-<div class="note">
-<p><em>Notas de uso: </em></p>
-
-<ul>
- <li>Cuando los elementos <code>&lt;article&gt;</code> están anidados, los internos representan artículos relacionados con el exterior. Por ejemplo, los comentarios de un blog pueden ser elementos <code>&lt;article&gt;</code> anidados al que representa la entrada del blog.</li>
- <li>Los datos del autor de un elemento <code>&lt;article&gt;</code> pueden ser proporcionados a través del elemento {{ HTMLElement ("address") }}, pero no se aplica a los elementos <code>&lt;article&gt;</code> anidados.</li>
- <li>La fecha de publicación y el tiempo de un elemento <code>&lt;article&gt;</code> pueden ser descritos con el atributo {{ htmlattrxref ("pubdate", "time") }} atributo de un elemento {{ HTMLElement("time") }}.</li>
-</ul>
-</div>
-
-<h3 id="Contexto_de_uso">Contexto de uso</h3>
-
-<table class="fullwidth-table" style="height: 117px; width: 1125px;">
- <tbody>
-  <tr>
-   <td>Contenido permitido</td>
-   <td><a title="es / RSS / módulo / categorías de contenido de flujo de contenido #">Contenido dinámico</a></td>
-  </tr>
-  <tr>
-   <td>Omisión de etiquetas</td>
-   <td>Ninguna, tanto la etiqueta inicial como la etiqueta de cierre son obligatorias</td>
-  </tr>
-  <tr>
-   <td>Elementos padres permitidos</td>
-   <td>
-    <p>Cualquier elemento que acepte <a title="https: / / developer.mozilla.org / es / HTML / Content_categories flow_content #">el contenido dinámico</a> . Tenga en cuenta que un elemento <code>&lt;article&gt;</code> no debe ser un descendiente de un elemento {{ HTMLElement ("address") }}.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Documento normativo</td>
-   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-article-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html # el-artículo-elemento">HTML 5, sección 4.4.4</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Atributos">Atributos</h3>
-
-<p>Este elemento no tiene atributos que no sean los atributos globales, comunes a todos los elementos.</p>
-
-<div id="section_3">
-<div id="section_3">
-<h3 class="editable" id="Interfaz_DOM">Interfaz DOM</h3>
-
-<p>Este elemento implementa la interfaz HTMLElement.</p>
-
-<h3 id="Consulta_también">Consulta también</h3>
-
-<ul>
- <li>Otros elementos relacionados con secciones: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("section") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }}</li>
- <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Sections and outlines of an HTML5 document</a>.</li>
-</ul>
-</div>
-</div>
diff --git a/files/es/web/html/elemento/aside/index.html b/files/es/web/html/elemento/aside/index.html
deleted file mode 100644
index 1032e47e9c..0000000000
--- a/files/es/web/html/elemento/aside/index.html
+++ /dev/null
@@ -1,68 +0,0 @@
----
-title: aside
-slug: Web/HTML/Elemento/aside
-tags:
-  - HTML
-  - HTML5
-  - 'HTML:Elemento'
-  - 'HTML:Referencia_de_elementos'
-  - para_revisar
-translation_of: Web/HTML/Element/aside
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El <strong>elemento HTML <code>&lt;aside&gt;</code></strong> representa una sección de una página que consiste en contenido que está indirectamente relacionado con el contenido principal del documento.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Estas secciones son a menudo representadas como barras laterales o como inserciones y contienen una explicación al margen como una definición de glosario, elementos relacionados indirectamente, como publicidad, la biografía del autor, o en aplicaciones web, la información de perfil o enlaces a blogs relacionados.</span></span></p>
-
-<div class="note">
-<p><em><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Notas de uso:</span></span></em></p>
-
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">No utilices el elemento <code>&lt;aside&gt;</code> para etiquetar texto entre paréntesis, ya que este tipo de texto se considera parte del flujo principal.</span></span></li>
-</ul>
-</div>
-
-<h3 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
-   <td><a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content"><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido dinámico</span></span></a></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Ninguna, tanto la etiqueta inicial y la etiqueta de cierre son obligatorias</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
-   <td>
-    <p><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-97 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte contenido dinámico.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Ten en cuenta que un elemento &lt;aside&gt; no debe ser un descendiente de un elemento {{ HTMLElement ("address") }}.</span></span></p>
-   </td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
-   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-aside-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-aside-element"><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.4.5</span></span></a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento no tiene atributos que no sean los <a href="/en/HTML/Global_attributes" title="../../../../en/HTML/global attributes">atributos globales</a>, comunes a todos los elementos.</span></span></p>
-
-<div id="section_3">
-<div id="section_3">
-<h3 class="editable" id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento implementa la interfaz </span></span><code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">.</span></span></p>
-
-<h3 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h3>
-
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Otros elementos relacionados con esta sección: {{ HTMLElement("body") }}, {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};</span></span></li>
- <li class="last"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Secciones y líneas generales de un documento HTML 5</a> .</span></span></li>
-</ul>
-</div>
-</div>
-
-<p> </p>
-
-<p>{{ languages ( { "en": "en/HTML/Element/aside","es":"es/docs/HTML/Elemento/aside" } ) }}</p>
diff --git a/files/es/web/html/elemento/audio/index.html b/files/es/web/html/elemento/audio/index.html
deleted file mode 100644
index 02c621f421..0000000000
--- a/files/es/web/html/elemento/audio/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: Audio
-slug: Web/HTML/Elemento/audio
-translation_of: Web/HTML/Element/audio
----
-<p>El elemento <code>audio</code> se usa para insertar contenido de audio en un documento HTML o XHTML. El elemento <code>audio</code> se agregó como parte de HTML 5.</p>
-
-<div class="note"><strong>Nota:</strong> actualmente Gecko admite solamente Vorbis, en contenedores Ogg, así como formato WAV. Asimismo, el servidor debe servir el archivo mediante el tipo MIME correcto con el fin de que Gecko lo reproduzca correctamente.</div>
-
-<p>Puedes usar las características API de audio mejoradas - que son específicas de Gecko - para generar y manipular directamente secuencias de audio a partir de código JavaScript. Consulta <a href="/en/Manipulating_audio_using_the_enhanced_audio_API" title="en/Manipulating audio using the enhanced audio API">Manipular sonido a través de la API de audio mejorada</a> para tener más detalles.</p>
-
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Contenido permitido</td>
-   <td><a href="/en/HTML/Content_categories#transparent_content" title="en/HTML/Content categories#transparent content">Contenido transparente</a>, que contiene bien un atributo<strong> src</strong>, bien uno o más elementos {{ HTMLElement("source") }}, seguido de <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> o <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">contenido estático</a> , sin ningún elemento de {{ HTMLElement("video") }} o <code>&lt;audio&gt;</code>.</td>
-  </tr>
-  <tr>
-   <td>Omisión de etiquetas</td>
-   <td>Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre.</td>
-  </tr>
-  <tr>
-   <td>Elementos primarios permitidos</td>
-   <td>Cualquier elemento que acepte <a href="../../../../en/HTML/Content_categories#flow_content" rel="internal">contenido dinámico</a> o cualquier elemento que acepte <a href="../../../../en/HTML/Content_categories#phrasing_content" rel="internal">contenido estático</a>.</td>
-  </tr>
-  <tr>
-   <td>Documento normativo</td>
-   <td><a class="external" href="http://www.w3.org/TR/html5/video.html#audio" title="http://www.w3.org/TR/html5/video.html#audio">HTML5, sección 4.8.7</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<dl>
- <dt>autoplay</dt>
- <dd>Un atributo booleano; si se especifica (incluso aunque el valor sea "false"), el sonido comenzará a reproducirse automáticamente en cuanto sea posible, sin detenerse para terminar de cargar los datos.</dd>
- <dt>autobuffer {{ obsolete_inline("2.0") }}</dt>
- <dd>Un atributo booleano; si se especifica, el sonido comenzará a reproducirse automáticamente, incluso aunque no se haya configurado para la reproducción automática. Esto continuará hasta que la caché de medios esté llena o se haya descargado el archivo de audio completo, lo que suceda primero. Debería usarse sólo si se espera que el usuario elija reproducir el audio; por ejemplo si el usuario ha navegado hasta una página usando un vínculo de "Reproducir este audio". Este atributo se eliminó de Gecko 2.0 {{ geckoRelease("2.0") }} en favor del atributo preload.</dd>
- <dt><a name="attr-buffered">buffered</a> {{ gecko_minversion_inline("2.0") }}</dt>
- <dd>Un atributo que se puede leer para determinar qué intervalos de tiempo del multimedia se han almacenado en búfer. Este atributo contiene un objeto {{ domxref("TimeRanges") }}.</dd>
- <dt>controls</dt>
- <dd>Si está presente este atributo, el navegador ofrecerá controles para permitir que el usuario controle la reproducción de audio, incluyendo volumen, búsqueda y pausar/reanudar reproducción.</dd>
- <dt>loop {{ unimplemented_inline() }} {{ bug(449157) }}</dt>
- <dd>Un atributo booleano; si se especifica, al alcanzar el final del audio, realizaremos la búsqueda automáticamente hasta el principio.</dd>
- <dt>mozCurrentSampleOffset {{ gecko_minversion_inline("2.0") }} {{ non-standard_inline() }}</dt>
- <dd>La posición de desplazamiento, que se especifica como el número de muestras desde el comienzo de la secuencia de audio, en la cual el audio se está reproduciendo actualmente.</dd>
- <dt><a name="attr-preload">preload</a> {{ gecko_minversion_inline("2.0") }} {{ bug(548523) }}</dt>
- <dd>El objetivo de este atributo enumerado es proporcionar una sugerencia al navegador sobre qué cree el autor que proporcionará la mejor experiencia para el usuario . Puede tener uno de los siguientes valores:
- <ul>
-  <li><span style="font-family: Courier New;">none: </span>sugiere bien que el autor cree que el usuario no tendrá que consultar ese video, bien que el servidor desea minimizar su tráfico; es decir, esta sugerencia indica que no se debe almacenar en caché este video;</li>
-  <li><span style="font-family: Courier New;">metadata</span>: sugiere que aunque el autor piensa que el usuario no tendrá que consultar ese video, es razonable capturar los metadatos (p. ej. longitud);</li>
-  <li><span style="font-family: Courier New;">auto</span>: sugiere que el usuario necesita tener prioridad; es decir, esta sugerencia indica que, si es necesario, se puede descargar el video completo, incluso aunque el usuario no vaya a usarlo;</li>
-  <li>the <em>empty string</em>: que es sinónimo del valor <span style="font-family: Courier New;">auto</span>.</li>
- </ul>
-
- <p>Si no está configurado, su valor predeterminado está definido por el navegador (es decir, cada navegador puede elegir su propio valor predeterminado), aunque la especificación aconseje que se establezca a <span style="font-family: Courier New;">metadatos</span>.</p>
-
- <div class="note"><strong>Observaciones sobre uso:</strong>
-
- <ul>
-  <li>El atributo <strong>autoplay </strong> tiene prioridad sobre éste puesto que si se desea reproducir automáticamente un video, el navegador obviamente tendrá que descargarlo. La especificación permite establecer los atributos<strong> autoplay</strong> y <strong>preload</strong>.</li>
-  <li>La especificación no fuerza al navegador a seguir el valor de este atributo; es tan sólo una sugerencia.</li>
- </ul>
- </div>
- </dd>
- <dt>src</dt>
- <dd>La URL del audio que se va a insertar. Está sujeta a los <a class="internal" href="/En/HTTP_access_control" title="En/HTTP access control">Controles de acceso HTTP</a>. Es opcional; en su lugar puedes usar el elemento <a class="internal" href="/en/HTML/Element/Source" title="En/HTML/Element/Source"><code>source</code></a> dentro del bloque de audio para especificar el audio que se va a insertar.</dd>
-</dl>
-
-<p>Las compensaciones de tiempo se especifican como valores float que indican el número de segundos que se va a compensar.</p>
-
-<div class="note"><strong>Nota:</strong> la definición del valor de compensación de tiempo no se ha completado en HTML 5 aún y está sujeta a cambios.</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg"
-       autoplay&gt;
-  Your browser does not support the &lt;code&gt;audio&lt;/code&gt; element.
-&lt;/audio&gt;
-</pre>
-
-<p>Reproduce el fichero de audio adjunto a este artículo.</p>
-
-<h2 id="Interfaz_DOM">Interfaz DOM</h2>
-
-<ul>
- <li><a href="/en/DOM/HTMLAudioElement" title="en/DOM/HTMLAudioElement">HTMLAudioElement</a></li>
-</ul>
-
-<h2 id="Consulta_también">Consulta también</h2>
-
-<ul>
- <li><a href="/es/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio" title="es/Formatos multimedia admitidos por los elementos de video y audio"><u>Formatos multimedia admitidos por los elementos de audio y video</u></a></li>
- <li><a href="/en/Manipulating_audio_using_the_enhanced_audio_API" title="en/Manipulating audio using the enhanced audio API">Manipulating audio using the enhanced audio API</a></li>
- <li><a href="/en/DOM/HTMLAudioElement" title="en/DOM/HTMLAudioElement"><code>HTMLAudioElement</code></a></li>
- <li><a class="internal" href="/En/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement" title="En/NsIDOMHTMLMediaElement"><code>nsIDOMHTMLMediaElement</code></a></li>
- <li><a class="internal" href="/en/HTML/Element/Video" title="En/HTML/Element/Video"><code>video</code></a></li>
- <li><a class="internal" href="/es/Using_audio_and_video_in_Firefox" title="Es/Usar audio y video en Firefox">Usar audio y video en Firefox</a></li>
- <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#audio" title="http://www.whatwg.org/specs/web-apps/current-work/#audio">The <code>audio</code> element</a> (HTML 5 specification)</li>
-</ul>
-
-<p>{{ languages( { "en": "en/HTML/Element/Audio" , "fr": "fr/HTML/Element/audio" } ) }}</p>
diff --git a/files/es/web/html/elemento/b/index.html b/files/es/web/html/elemento/b/index.html
deleted file mode 100644
index e4281a9296..0000000000
--- a/files/es/web/html/elemento/b/index.html
+++ /dev/null
@@ -1,168 +0,0 @@
----
-title: b
-slug: Web/HTML/Elemento/b
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/b
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>b</strong> de bold=negrita.</p>
-
-<p>Indica que el texto debe ser representado con una variable <strong>bold</strong>, o <strong>negrita,</strong><strong> </strong>de la tipografía que se esté usando.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;b&gt;</code> y <code>&lt;/b&gt;</code> (Ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: en línea.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">de estilo de fuente</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
-</dl>
-
-<h5 id="Atributos" name="Atributos">Atributos</h5>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Palabras_pesadas" name="Palabras_pesadas">Palabras pesadas</h4>
-
-<pre class="eval">&lt;p&gt;
-       Texto normal y... &lt;b&gt;Texto en negrita&lt;/b&gt;
-&lt;/p&gt;
-</pre>
-
-<p><br>
- Se visualiza así:</p>
-
-<div style="border: solid silver 1px;">
-<p style="font-family: ,serif; font-size: larger;">Texto normal y... <strong>Texto en negrita</strong></p>
-</div>
-</div>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-b">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<p>El inherente a su condición: <strong>negrita.</strong> Prueba el siguiente ejemplo:</p>
-
-<pre class="eval"><span class="nowiki">
- &lt;style&gt;
-        span { font-weight: bolder; }
- &lt;/style&gt;
-
- &lt;p&gt; Esto es:  &lt;b&gt; un elemento b &lt;/b&gt; y esto es: &lt;span&gt;un span con estilo&lt;/span&gt;  &lt;/p&gt;
- </span>
-</pre>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li>El <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">W3C</a> (y nosotros) desaconseja el uso de este elemento, para manejar el estilo del texto es mejor usar <a href="es/CSS">CSS</a>.</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-B"><strong>b</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/base/index.html b/files/es/web/html/elemento/base/index.html
deleted file mode 100644
index 4912e33f0b..0000000000
--- a/files/es/web/html/elemento/base/index.html
+++ /dev/null
@@ -1,158 +0,0 @@
----
-title: <base>
-slug: Web/HTML/Elemento/base
-tags:
-  - Elemento
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/base
----
-<p id="Summary">{{HTMLRef}}</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El <strong>elemento HTML <code>&lt;base&gt;</code></strong> <span id="result_box" lang="es"><span>especifica la dirección URL</span> <span>base que se utilizará</span> <span>para todas las</span> <span>direcciones URL relativas</span> <span>contenidas</span> <span>dentro de un documento</span><span>.</span> </span> <span id="result_box" lang="es"><span>Sólo puede haber un</span></span> <span lang="es"><span>elemento &lt;base&gt;</span> <span>en un documento</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span>La</span> <span>dirección URL base</span> <span>de un documento</span> <span>puede ser consultado</span> <span>a partir de una</span> <span>secuencia de comandos con</span></span> {{domxref('document.baseURI')}}.</p>
-
-<div class="note"><strong>Nota de uso:</strong> Si se especifican varios elementos &lt;base&gt;, se utilizá sólo la primera sección <strong>href</strong> y el primer valor <strong>target</strong>; los demás son ignorados.</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de Contenido</a></th>
-   <td><span class="short_text" id="result_box" lang="es"><span>Contenido de Metadatos</span></span></td>
-  </tr>
-  <tr>
-   <th>Contenido permitido</th>
-   <td><span class="short_text" id="result_box" lang="es"><span>Ninguno</span><span>, es un</span></span> {{Glossary("empty element")}}.</td>
-  </tr>
-  <tr>
-   <th>Omisión de etiqueta</th>
-   <td><span class="short_text" id="result_box" lang="es"><span>No debe haber ninguna</span> <span>etiqueta de cierre</span><span>.</span></span></td>
-  </tr>
-  <tr>
-   <th>Elementos padres permitidos</th>
-   <td><span id="result_box" lang="es"><span>Cualquier</span></span> {{HTMLElement("head")}} <span id="result_box" lang="es"><span>que</span> <span>no contenga ningún</span> <span>elemento </span></span>{{HTMLElement("base")}}</td>
-  </tr>
-  <tr>
-   <th>Interfaz DOM</th>
-   <td>{{domxref("HTMLBaseElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Attributos">Attributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="https://developer.mozilla.org/es/docs/Web/HTML/Atributos_Globales" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a><span style="line-height: 21px;">.</span></p>
-
-<dl>
- <dt>{{htmlattrdef("href")}}</dt>
- <dd><span id="result_box" lang="es"><span>La dirección URL</span> <span>base que se usa</span> <span>en todo el documento</span> <span>para las direcciones</span> <span>URL</span> <span>relativas.</span> <span>Si no se especifica</span> <span>este atributo</span><span>,</span> <span>este elemento</span> <span>debe venir antes de</span> <span>cualesquiera otros elementos</span> <span>con</span> <span>atributos cuyos valores son</span> <span>direcciones URL</span><span>.</span> <span>Se permiten</span> <span>las direcciones URL absolutas</span> <span>y relativas.</span></span></dd>
- <dt>{{htmlattrdef("target")}}</dt>
- <dd><span id="result_box" lang="es"><span>Un nombre</span> <span>o una palabra clave</span> <span>que indica</span> <span>la ubicación predeterminada</span> <span>para navegar por</span> <span>el resultado de</span> <span>hipervínculos</span> <span>o</span> <span>formas</span></span>, <span id="result_box" lang="es"><span>para los elementos</span> <span>que no tienen</span> <span>una referencia</span></span> <span id="result_box" lang="es"> <span>explícita</span> <span>del objetivo</span></span> <span id="result_box" lang="es"><span>.</span> <span>Es un</span> <span>nombre</span> <span>o una palabra clave</span> <span>para</span> <span>un</span> <span>contexto de navegación</span> <span>(</span><span>por ejemplo</span><span>:</span> <span>pestaña</span><span>, ventana o</span> <span>marco en línea</span><span>)</span><span>.</span> <span>Las</span> <span>siguientes</span> <span>palabras clave</span> <span>tienen un significado especial</span><span>:</span></span> tab, window, o inline frame).Las siguientes palabras clave tienen un significado especial:
- <ul>
-  <li><code>_self</code>: <span id="result_box" lang="es"><span>Carga el resultado</span> <span>en el mismo</span> <span>contexto de navegación</span> que<span> el actual</span><span>.</span> <span>Este valor</span> <span>es</span> <span>el valor por defecto</span> <span>si no se especifica</span> <span>el atributo</span><span>.</span></span></li>
-  <li><code>_blank</code>: <span id="result_box" lang="es"><span>Carga el resultado</span> <span>en un nuevo</span> <span>contexto de navegación</span> <span>sin nombre</span></span> .</li>
-  <li><code>_parent</code>: <span id="result_box" lang="es"><span>Cargar</span> <span>el resultado en el</span> <span>contexto de navegación</span> <span>padre</span> <span>de</span><span>l actual.</span> <span>Si no hay</span> <span>padre</span><span>, esta opción</span> <span>se comporta de la</span> <span>misma manera que</span> <span>_self</span><span>.</span></span></li>
-  <li><code>_top</code>: <span id="result_box" lang="es"><span>Carga el resultado</span> <span>en</span> <span>el contexto</span> <span>de nivel superior</span> <span>de navegación</span> <span>(</span><span>es decir, el</span> <span>contexto de navegación</span> <span>que</span> <span>es</span> <span>un ancestro de</span> <span>la actual,</span> <span>y no tiene</span> <span>padre)</span><span>.</span> <span>Si no hay</span> <span>padre</span><span>, esta opción</span> <span>se comporta de la</span> <span>misma manera que</span> <span>_self</span><span>.</span></span></li>
- </ul>
- </dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>base</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.example.com/page.html<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>base</span> <span class="attr-name token">target</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>_blank<span class="punctuation token">"</span></span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>http://www.example.com/page.html<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<article class="approved text-content">
-<div class="boxed translate-rendered">
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('HTML WHATWG', 'semantics.html#the-base-element', '&lt;base&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td><span class="short_text" id="result_box" lang="es"><span>Sin cambios</span> <span>desde la última</span> <span>instantánea</span></span>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'document-metadata#the-base-element', '&lt;base&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td><span class="short_text" id="result_box" lang="es"><span>Especifica el</span> <span>comportamiento de</span></span> <code>target</code></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/links.html#h-12.4', '&lt;base&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Añadido el atributo <code>target</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}} [1]</td>
-   <td>{{CompatVersionUnknown}} [2]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}} [1]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] A<span id="result_box" lang="es"><span>ñadido soporte</span> <span>de las URL</span> <span>relativas para</span></span> <code>href</code> <span id="result_box" lang="es"><span>en</span></span> Gecko 2.0 (Firefox 4.0)</p>
-
-<p>[2] Antes de Internet Explorer 7, &lt;base&gt; podría ser colocado en cualquier lugar del documento y se usaba el valor más cercano de &lt;base&gt;. El apoyo a las URL relativas se ha eliminado en Internet Explorer 8</p>
-</div>
-</article>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/basefont/index.html b/files/es/web/html/elemento/basefont/index.html
deleted file mode 100644
index 5b86ea16a3..0000000000
--- a/files/es/web/html/elemento/basefont/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: basefont
-slug: Web/HTML/Elemento/basefont
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/basefont
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>basefont</strong> -<em>fuente base</em> . Permite cambiar algunas propiedades del texto.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;basefont&gt; (solo tiene una).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">desaprobado</a>.
- <dl>
-  <dd>En un doctype transicional está definido como un elemento <a href="es/HTML/Elemento/Tipos_de_elementos#especial">especial</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: No.</dd>
- <dd><strong>Puede contener</strong>: Nada.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-size-FONT"><span style="color: green;">size</span></a></td>
-   <td>Tamaño de la fuente. Según una tabla del 1 al 7.</td>
-   <td>Un número entero (ej. 1), o un valor incremental (ej. +1). <s>Por defecto:</s> debe indicarlo el autor.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-color-FONT"><span style="color: green;">color</span></a></td>
-   <td>El color del texto.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.5">color RGB</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-face-FONT"><span style="color: green;">face</span></a></td>
-   <td>Especifica la/s fuentes para el texto.</td>
-   <td>Lista de nombres de fuentes separadas por coma. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_ejemplo_simple" name="Un_ejemplo_simple">Un ejemplo simple</h4>
-
-<p>Código:</p>
-
-<pre class="eval">&lt;p&gt;
- Texto normal y ...
- &lt;<strong>basefont</strong> size="5" color="#0000ff"&gt;
- Texto distinto.
-&lt;/p&gt;
-</pre>
-
-<p><span class="comment">Resultado: &lt;div style='border: solid silver 1px;'&gt; &lt;p&gt; Texto normal y ... &lt;basefont size="5" color="#0000ff"&gt; Texto distinto. &lt;/p&gt; &lt;/div&gt;</span></p>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-BASEFONT"><strong>basefont</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-basefont">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/bdi/index.html b/files/es/web/html/elemento/bdi/index.html
deleted file mode 100644
index 075afa13a6..0000000000
--- a/files/es/web/html/elemento/bdi/index.html
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: <bdi>
-slug: Web/HTML/Elemento/bdi
-tags:
-  - BiDi
-  - Elemento
-  - HTML
-  - Referencia
-  - Semántica HTML a nivel de texto
-  - Web
-translation_of: Web/HTML/Element/bdi
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento <em>HTML <code>&lt;bdi&gt;</code> </em>(o elemento de aislamiento Bi-Direccional) aisla un trozo de texto para que pueda ser formateado con una dirección diferente al texto que hay fuera de él.</p>
-
-<p>Es útil al embeber o incrustart texto del que se desconoce la direccionalidad, por ejemplo proveniente de una base de datos, dentro de un texto con una direccionalidad fija.</p>
-
-<p class="note">Aunque el mismo efecto visual se puede conseguir usando la regla  CSS  {{cssxref("unicode-bidi")}}<code>: isolate</code> en un elemento  {{HTMLElement("span")}} u otro elemento de formateado de texto, el significado semántico sólo se consigue usando el elemento<code> &lt;bdi&gt;</code>. En especial los navegadores permiten ignorar los estilos CSS. En tal caso el texto se mostrará correctamente usando el elemento HTML pero será basura usando CSS para fijar la semántica.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>, contenido palpable.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Flow_content">Phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Any element that accepts <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Flow_content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Como los demás elementos HTML , este elemento tiene los <a href="/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">global attributes</a>, pero con una pequeña diferencia semántica: el atributo <strong>dir </strong>no se hereda. Si no está definidio, su valor por defecto es <code>auto</code> y permitirá a los navegadores decidir la dirección basándose en el contexto del elemento.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html">&lt;p dir="ltr"&gt;Esta palabara arábica&lt;bdi&gt;ARABIC_PLACEHOLDER&lt;/bdi&gt; se muestra automáticamente de derecha a izquierda.&lt;/p&gt;
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p dir="ltr">Esta palabra arábica REDLOHECALP_CIBARA se muestra automáticamente de derecha a izquierda.</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('HTML WHATWG', 'text-level-semantics.html#the-bdi-element', '&lt;bdi&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'the-bdi-element.html#the-bdi-element', '&lt;bdi&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>16</td>
-   <td>{{CompatGeckoDesktop("10.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("10.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 dir="ltr" id="Ver_además">Ver además</h2>
-
-<ul>
- <li>Elementos HTML relacionados: {{HTMLElement("bdo")}}</li>
- <li>Propiedades HTML relacionadas: {{cssxref("direction")}}, {{cssxref("unicode-bidi")}}</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/bdo/index.html b/files/es/web/html/elemento/bdo/index.html
deleted file mode 100644
index 0a4af7fe92..0000000000
--- a/files/es/web/html/elemento/bdo/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: bdo
-slug: Web/HTML/Elemento/bdo
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/bdo
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>bdo</strong> Bi-Directional Overriding=Anulación de bidireccionalidad.</p>
-
-<p>La dirección de escritura del texto está relacionada con el idioma y se declara con el atributo dir. Pero en ocasiones esto no es suficiente, entonces entra en juego el elemento <a href="es/HTML/Elemento/bdo">bdo</a> (anulación del algoritmo bidireccional) que al anular el algoritmo permite un control total de la direccionalidad.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;bdo&gt; y &lt;/bdo&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En línea.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#especial">Elemento especial</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<p> </p>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir-BDO"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Debe indicarlo el autor</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Cambios_de_direcci.C3.B3n" name="Cambios_de_direcci.C3.B3n">Cambios de dirección</h4>
-
-<pre>&lt;p&gt; cero(0)
-&lt;bdo dir="rtl"&gt;
-&lt;em&gt; uno(1) dos(2) &lt;/em&gt; tres(3) cuatro(4)
-&lt;em dir="ltr"&gt; cinco(5) seis(6) &lt;/em&gt; siete(7) ocho(8)
-&lt;/bdo&gt; nueve(9)
-&lt;/p&gt;
-</pre>
-</div>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-bdo">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#edef-BDO"><strong>bdo</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/bgsound/index.html b/files/es/web/html/elemento/bgsound/index.html
deleted file mode 100644
index 81b73a1e30..0000000000
--- a/files/es/web/html/elemento/bgsound/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: <bgsound>
-slug: Web/HTML/Elemento/bgsound
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/bgsound
----
-<div>{{non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento HTML de sonido de fondo (&lt;bgsound&gt;) es un elemento de Internet Explorer que asocia  un sonido de fondo con un página .</p>
-
-<div class="note">
-<p><strong>No usar esto ! </strong>Para incrustar un elemento en una página web , se debe  de usar el elemento  {{HTMLElement("audio")}}</p>
-</div>
-
-<h2 id="Atributos">Atributos</h2>
-
-<dl>
- <dt>{{htmlattrdef("balance")}}</dt>
- <dd>Este atributo define un número entre -10,000 y + 10,000 que determina como el volumen será dividido entre los altavoces .</dd>
- <dt>{{htmlattrdef("loop")}}</dt>
- <dd>Este atributo indica el número de veces que un soinido será reproducido ya sea como un valor numérico o la palabra clave <em>infinite</em> .</dd>
- <dt>{{htmlattrdef("src")}}</dt>
- <dd>Este atributo especifica la URL del archivo de sonido que será reproducido , el cual debe ser uno de los siguientes tipos : wav, .au, o .mid.</dd>
- <dt>{{htmlattrdef("volume")}}</dt>
- <dd>Este atributo define un número entre -10,000 y 0 que determina la fuerza del sonido de fondo de una página .</dd>
- <dd> </dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush:html">&lt;bgsound src="sound1.mid"&gt;
-
-&lt;bgsound src="sound2.au" loop="infinite"&gt;
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>Funcionalidad similar puede ser lograda en algunas versiones de Netscape usando la etiqueta &lt;embed&gt; para invocar un reproductor de audio .</p>
-
-<p>Puedes escribir bgsound con una etiqueta de cierre automático &lt;bgsound /&gt; . Ahora bien , desde que este elemento no es parte de un estándar , haciendolo como XHTML no lo hará valido. </p>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Hasta Firefox 22 , incluso si no se soportaba este elemento , Gecko lo asociaba a un elemento {{domxref("HTMLSpanElement")}}. Esto fue corregido después y ahora el elemento asociado es un  {{domxref("HTMLUnknownElement")}} como es requerido  por la especificación . </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li> {{htmlelement("audio")}}, el cual es el elemento estándar para incrustar audio en un documento.</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/big/index.html b/files/es/web/html/elemento/big/index.html
deleted file mode 100644
index a15f1b5da9..0000000000
--- a/files/es/web/html/elemento/big/index.html
+++ /dev/null
@@ -1,191 +0,0 @@
----
-title: big
-slug: Web/HTML/Elemento/big
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/big
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>big</strong> de big=grande</p>
-
-<p>Muestra el texto marcado con un tamaño de fuente más grande. El tamaño de la fuente puede definirse en una escala del 1 al 7, <strong>big</strong> aumenta este valor en un punto.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;big&gt;</code> y <code>&lt;/big&gt;</code> (Ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En línea.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">de estilo de fuente</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Simple" name="Simple">Simple</h4>
-
-<pre class="eval"><span class="nowiki">
-  &lt;p&gt;
-
-   Texto normal y... &lt;big&gt;Texto más grande&lt;/big&gt;
-
-  &lt;/p&gt;
- </span>
-</pre>
-</div>
-
-<div class="highlight">
-<h4 id="Recursivo" name="Recursivo">Recursivo</h4>
-
-<p><strong>big</strong> puede contener otros elementos en línea, por ejemplo... <strong>big</strong>:</p>
-
-<pre class="eval"><span class="nowiki">
-  &lt;p&gt;
-
-   Texto normal y texto &lt;big&gt; cada &lt;big&gt; vez &lt;big&gt; más &lt;big&gt; grande. &lt;/big&gt;&lt;/big&gt;&lt;/big&gt;&lt;/big&gt;
-
-  &lt;/p&gt;
- </span>
-</pre>
-
-<p>Se visualiza así:</p>
-
-<div style="border: solid silver 1px;">
-<p>Texto normal y texto cada vez más grande.</p>
-</div>
-</div>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-big">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<p>Observa el siguiente ejemplo:</p>
-
-<pre class="eval"><span class="nowiki">
- &lt;style&gt;
-        span { font-size: larger; }
- &lt;/style&gt;
-
- &lt;h2&gt; Con big &lt;/h2&gt;
- &lt;p&gt; Texto normal y texto ...
-
- &lt;big&gt; cada &lt;big&gt; vez &lt;big&gt; más &lt;big&gt; grande. &lt;/big&gt;&lt;/big&gt;&lt;/big&gt;&lt;/big&gt;  &lt;/p&gt;
-
- &lt;h2&gt; Con CSS &lt;/h2&gt;
- &lt;p&gt; Texto normal y texto ...
-
- &lt;span&gt; cada &lt;span&gt; vez &lt;span&gt; más &lt;span&gt; grande. &lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;  &lt;/p&gt;
- </span>
-</pre>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li><strong>big</strong> tiene un elemento opuesto, <a href="es/HTML/Elemento/small">small</a>. Si <strong>big</strong> aumenta el tamaño de la fuente <a href="es/HTML/Elemento/small">small</a> lo disminuye. Sin embargo en su funcionamiento son idénticos.</li>
- <li>El W3C (y nosotros) desaconseja el uso de este elemento, para manejar el tamaño del texto es mejor usar CSS.</li>
-</ul>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-BIG"><strong>big</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/blink/index.html b/files/es/web/html/elemento/blink/index.html
deleted file mode 100644
index f63821708a..0000000000
--- a/files/es/web/html/elemento/blink/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: <blink>
-slug: Web/HTML/Elemento/blink
-tags:
-  - Elemento
-  - HTML
-  - Obsoleto
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/blink
----
-<div>{{Deprecated_header}} {{Non-standard_header}}</div>
-
-<p>El elemento HTML blink (<code>&lt;blink&gt;</code>) no es un elemento estándar que causa que el texto encerrado parpadee lentamente .</p>
-
-<div class="warning">
-<p class="note"><strong>Precaución :</strong> No usar este elemento ya que no es un elemento estándar y está <strong>obsoleto</strong>. El texto parpadeante es mal visto por diversos estándares de accesibilidad y la especificación de CSS permite a los exploradores ingnorar el valor del parpadeo . .</p>
-</div>
-
-<h2 id="Interface_DOM">Interface DOM</h2>
-
-<p>Este elemento no es soportado y por lo tanto implementa la interface {domxref("HTMLUnknownElement")}} .</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush:html">&lt;blink&gt;Why would somebody use this?&lt;/blink&gt;
-</pre>
-
-<h3 id="Resultado">Resultado </h3>
-
-<p><img alt="Image:HTMLBlinkElement.gif" src="/@api/deki/files/247/=HTMLBlinkElement.gif"></p>
-
-<h2 id="Especificación">Especificación</h2>
-
-<p>Este elemento no es parte del estándar ni de alguna espeficación . Si no nos crees puedes verlo por ti mismo en la <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/obsolete.html#non-conforming-features">espeficicación de HTML</a>.</p>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}} [2]</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}} [2]</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Soportado hasta la versión 22. Removido en la versión 23.</p>
-
-<p>[2] Soportado hasta la versión 12.1. Removido en la versión 15.0.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="http://www.montulli.org/theoriginofthe%3Cblink%3Etag">Historia de la creación del elemento</a> &lt;blink&gt;</li>
- <li>{{cssxref("text-decoration")}}, donde un valor de parpadeo existe , aunque los exploradores no son obligados a hacer parpadear el texto efectivamente.</li>
- <li>{{htmlelement("marquee")}}, otro elemento similar que no pertenece a un estándar.</li>
- <li>Las <a href="/es/docs/Web/CSS/CSS_Animations/Usando_animaciones_CSS">animaciones CSS</a> son la forma correcta de crear tal efecto .</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/blockquote/index.html b/files/es/web/html/elemento/blockquote/index.html
deleted file mode 100644
index d8f71a7ed4..0000000000
--- a/files/es/web/html/elemento/blockquote/index.html
+++ /dev/null
@@ -1,153 +0,0 @@
----
-title: blockquote
-slug: Web/HTML/Elemento/blockquote
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/blockquote
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>blockquote</strong> -<em>cita en bloque</em> . Crea citas en bloque, marca las citas a otros autores o documentos.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;blockquote&gt;</code> y <code>&lt;/blockquote&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En bloque.</dd>
- <dd><strong>Puede y debe contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a> o <a href="es/HTML/Elemento/script">script</a></dd>
- <dd>Con un doctype transicional <strong>Puede contener</strong>: texto, y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a> o <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">cite </code></td>
-   <td>Proporciona un enlace al documento original o fuente</td>
-   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Por defecto: lo fija el navegador</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_blockquote_estricto" name="Un_blockquote_estricto">Un <strong>blockquote</strong> estricto</h4>
-
-<pre class="eval">&lt;<strong>blockquote</strong> cite='<a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-BLOCKQUOTE" rel="freelink">http://html.conclase.net/w3c/html401...def-BLOCKQUOTE</a>'&gt;
-  &lt;p&gt;
-    &lt;strong&gt;Nota.&lt;/strong&gt; Recomendamos que las implementaciones de hojas
-    de estilo porporcionen un mecanismo para insertar signos de puntuación de citas
-    antes y después de una cita delimitada por un BLOCKQUOTE de un modo apropiado según
-    el contexto del idioma actual y el grado de anidamiento de las citas.
-  &lt;/p&gt;
-&lt;/<strong>blockquote</strong>&gt;
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li>Conviene tener cuidado con las divergencias en el tipo de contenido dependiendo del doctype. El siguiente ejemplo es válido con un doctype transicional, pero no lo es con el estricto:</li>
-</ul>
-
-<pre class="eval">&lt;<strong>blockquote</strong>&gt;
-  Bla, bla, bla...
-&lt;/<strong>blockquote</strong>&gt;
-</pre>
-
-<ul>
- <li><strong>blockquote</strong> tiene un hermano menor: <a href="es/HTML/Elemento/q">q</a>. <strong>blockquote</strong> sirve para citas en bloque y <a href="es/HTML/Elemento/q">q</a> para citas en línea.</li>
-</ul>
-
-<ul>
- <li>A diferencia de <a href="es/HTML/Elemento/q">q</a>, <strong>blockquote</strong> no entrecomilla los contenidos, debe hacerlo el autor (con CSS).</li>
-</ul>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-BLOCKQUOTE"><strong>blockquote</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-blockquote">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/body/index.html b/files/es/web/html/elemento/body/index.html
deleted file mode 100644
index 32b0a64328..0000000000
--- a/files/es/web/html/elemento/body/index.html
+++ /dev/null
@@ -1,170 +0,0 @@
----
-title: '<body>: El elemento body del documento'
-slug: Web/HTML/Elemento/body
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-  - Seleccionar el elemento raíz
-  - Web
-  - secciones
-translation_of: Web/HTML/Element/body
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">El <strong>elemento <code>&lt;body&gt;</code> de HTML</strong> representa el contenido de un documento HTML. Solo puede haber un elemento <code>&lt;body&gt;</code> en un documento.</span></p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row">{{web.link("/es/docs/Web/HTML/Content_categories", "Categorías de contenido")}}</th>
-   <td>{{web.link("/en-US/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines#Section_Elements_in_HTML5", "Secciones en HTML5")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>{{web.link("/es/docs/Web/HTML/Content_categories#Flow_content", "Flujo de contenido")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>La etiqueta de inicio se puede omitir si lo primero que hay dentro no es un carácter de espacio, comentario, elemento {{HTMLElement("script")}} o elemento {{HTMLElement("style")}}. La etiqueta final se puede omitir si el elemento <code>&lt;body&gt;</code> tiene contenido o tiene una etiqueta de inicio y no va seguido inmediatamente de un comentario.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenedores autorizados</th>
-   <td>Debe ser el segundo elemento de un elemento {{HTMLElement("html")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Rol de ARIA implícito</th>
-   <td>{{web.link("/es/docs/Web/Accessibility/ARIA/Roles/Document_Role", "document")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>No se permite <code>role</code></td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{DOMxRef("HTMLBodyElement")}}
-    <ul>
-     <li>El elemento <code>&lt;body&gt;</code> expone la interfaz {{DOMxRef("HTMLBodyElement")}}.</li>
-     <li>Puedes acceder al elemento <code>&lt;body&gt;</code> a través de la propiedad {{DOMxRef("document.body")}}.</li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los {{web.link("/es/docs/Web/HTML/Global_attributes", "atributos globales")}}.</p>
-
-<dl>
- <dt>{{HTMLAttrDef("alink")}} {{obsolete_inline}}</dt>
- <dd>Color del texto de los hipervínculos cuando se selecciona. <em>Este método no es conforme a la especificación, utiliza la propiedad {{CSSxRef("color")}} de CSS junto con la pseudoclase {{CSSxRef(":active")}} en su lugar. </em></dd>
- <dt>{{HTMLAttrDef("background")}} {{obsolete_inline}}</dt>
- <dd>URI de una imagen para usar como fondo. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("background")}} en el elemento</em>.</dd>
- <dt>{{HTMLAttrDef("bgcolor")}} {{obsolete_inline}}</dt>
- <dd>Color de fondo del documento. <em>Este método no es conforme, utiliza la propiedad CSS {{CSSxRef("background-color")}} en el elemento</em>.</dd>
- <dt>{{HTMLAttrDef("bottommargin")}} {{obsolete_inline}}</dt>
- <dd>El margen de la parte inferior del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-bottom")}} en el elemento</em>.</dd>
- <dt>{{HTMLAttrDef("leftmargin")}} {{obsolete_inline}}</dt>
- <dd>El margen de la izquierda del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-left")}} en el elemento en su lugar</em>.</dd>
- <dt>{{HTMLAttrDef("link")}} {{obsolete_inline}}</dt>
- <dd>Color del texto de los enlaces de hipertexto no visitados. <em>Este método no es conforme, usa la propiedad {{CSSxRef("color")}} de CSS junto con la pseudoclase {{CSSxRef(":link")}} en su lugar</em>.</dd>
- <dt>{{HTMLAttrDef("onafterprint")}}</dt>
- <dd>Función para llamar después de que el usuario haya impreso el documento.</dd>
- <dt>{{HTMLAttrDef("onbeforeprint")}}</dt>
- <dd>Función para llamar cuando el usuario solicita la impresión del documento.</dd>
- <dt>{{HTMLAttrDef("onbeforeunload")}}</dt>
- <dd>Función para llamar cuando se está a punto de descargar el documento.</dd>
- <dt>{{HTMLAttrDef("onblur")}}</dt>
- <dd>Función para llamar cuando el documento pierde el foco.</dd>
- <dt>{{HTMLAttrDef("onerror")}}</dt>
- <dd>Función para llamar cuando el documento no se carga correctamente.</dd>
- <dt>{{HTMLAttrDef("onfocus")}}</dt>
- <dd>Función para llamar cuando el documento recibe el foco.</dd>
- <dt>{{HTMLAttrDef("onhashchange")}}</dt>
- <dd>Función para llamar cuando la parte del identificador del fragmento (comenzando con el carácter de almohadilla (<code>'#'</code> también conocido como numeral)) de la dirección actual del documento ha cambiado.</dd>
- <dt>{{HTMLAttrDef("onlanguagechange")}} {{experimental_inline}}</dt>
- <dd>Función para llamar cuando cambiaron los idiomas preferidos.</dd>
- <dt>{{HTMLAttrDef("onload")}}</dt>
- <dd>Función a llamar cuando se haya terminado de cargar el documento.</dd>
- <dt>{{HTMLAttrDef("onmessage")}}</dt>
- <dd>Función para llamar cuando el documento ha recibido un mensaje.</dd>
- <dt>{{HTMLAttrDef("onoffline")}}</dt>
- <dd>Función para llamar cuando falla la comunicación de la red.</dd>
- <dt>{{HTMLAttrDef("ononline")}}</dt>
- <dd>Función para llamar cuando se restablece la comunicación de la red.</dd>
- <dt>{{HTMLAttrDef("onpopstate")}}</dt>
- <dd>Función para llamar cuando el usuario ha navegado el historial de sesiones.</dd>
- <dt>{{HTMLAttrDef("onredo")}}</dt>
- <dd>Función para llamar cuando el usuario ha avanzado en el historial de deshacer transacciones.</dd>
- <dt>{{HTMLAttrDef("onresize")}}</dt>
- <dd>Función para llamar cuando el documento ha cambiado de tamaño.</dd>
- <dt>{{HTMLAttrDef("onstorage")}}</dt>
- <dd>Función para llamar cuando el área de almacenamiento ha cambiado.</dd>
- <dt>{{HTMLAttrDef("onundo")}}</dt>
- <dd>Función para llamar cuando el usuario ha retrocedido en el historial de deshacer transacciones.</dd>
- <dt>{{HTMLAttrDef("onunload")}}</dt>
- <dd>Función para llamar cuando el documento se vaya.</dd>
- <dt>{{HTMLAttrDef("rightmargin")}} {{obsolete_inline}}</dt>
- <dd>El margen de la derecha del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-right")}} en el elemento</em>.</dd>
- <dt>{{HTMLAttrDef("text")}} {{obsolete_inline}}</dt>
- <dd>Color de primer plano del texto. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("color")}} en el elemento</em>.</dd>
- <dt>{{HTMLAttrDef("topmargin")}} {{obsolete_inline}}</dt>
- <dd>El margen de la parte superior del <em>&lt;body&gt;</em>. <em>Este método no es conforme, usa la propiedad CSS {{CSSxRef("margin-top")}} en el elemento</em>.</dd>
- <dt>{{HTMLAttrDef("vlink")}} {{obsolete_inline}}</dt>
- <dd>Color del texto de los enlaces de hipertexto visitados. <em>Este método no es conforme, utiliza la propiedad {{CSSxRef("color")}} de CSS junto con la pseudoclase {{CSSxRef(":visited")}} en su lugar</em>.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html notranslate">&lt;html&gt;
-  &lt;head&gt;
-    &lt;title&gt;Título del documento&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-    &lt;p&gt;Este es un párrafo&lt;/p&gt;
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'semantics.html#the-body-element', '&lt;body&gt;')}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-   <td>Cambió la lista de características no conformes.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'sections.html#the-body-element', '&lt;body&gt;')}}</td>
-   <td>{{ Spec2('HTML5 W3C') }}</td>
-   <td>Los atributos anteriormente obsoletos. Definieron el comportamiento de <code>topmargin</code>, <code>leftmargin</code>, <code>rightmargin</code> y <code>bottommargin</code> no conforme y nunca estandarizado. Se agregaron los atributos <code>on*</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.5.1', '&lt;body&gt;')}}</td>
-   <td>{{ Spec2('HTML4.01') }}</td>
-   <td>En desuso el <code>alink</code>, <code>background</code>, <code>bgcolor</code>, <code>link</code>, <code>text</code> y atributos <code>vlink</code>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data"> https://github.com/mdn/browser-compat- datos </a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.body")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{HTMLElement("html")}}</li>
- <li>{{HTMLElement("head")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/br/index.html b/files/es/web/html/elemento/br/index.html
deleted file mode 100644
index 1e9cff3b58..0000000000
--- a/files/es/web/html/elemento/br/index.html
+++ /dev/null
@@ -1,157 +0,0 @@
----
-title: <br>
-slug: Web/HTML/Elemento/br
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/br
----
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El elemento HTML<em> l</em><em>ine break </em><code>&lt;br&gt;</code> produce un salto de línea en el texto (retorno de carro). Es útil para escribir un poema o una dirección, donde la división de las líneas es significante.</p>
-
-<p>No utilices <code>&lt;br&gt;</code> para incrementar el espacio entre líneas de texto; para ello utiliza la propiedad {{cssxref('margin')}} de <a href="/en-US/docs/CSS" title="CSS">CSS</a> o el elemento {{HTMLElement("p")}}.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno, es {{Glossary("empty element")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>Debe tener etiqueta de inicio y no debe tener etiqueta de cierre. En documentos XHTML este elemento se escribe como <code>&lt;br /&gt;</code>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLBRElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Attributes" name="Attributes">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a><span style="line-height: 21px;">.</span></p>
-
-<dl>
- <dt>{{htmlattrdef("clear")}} {{deprecatedGeneric('inline','HTML4.01')}} {{obsoleteGeneric('inline','HTML5')}}</dt>
- <dd>Indica donde empieza la siguiente línea después del salto.
- <div class="note">
- <p><strong>Nota de uso: </strong>Este atributo está obsoleot en {{HTMLVersionInline(5)}} y <strong>no debe utilizarse por los autores</strong>. En su lugar utiliza la propiedad {{CSSxref('clear')}} de CSS.</p>
- </div>
- </dd>
-</dl>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<pre class="brush: html">Mozilla Foundation&lt;br&gt;
-1981 Landings Drive&lt;br&gt;
-Building K&lt;br&gt;
-Mountain View, CA 94043-0801&lt;br&gt;
-USA
-</pre>
-
-<p>El HTML de arriba muestra:</p>
-
-<p>Mozilla Foundation<br>
- 1981 Landings Drive<br>
- Building K<br>
- Mountain View, CA 94043-0801<br>
- USA</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('HTML WHATWG', 'text-level-semantics.html#the-br-element', '&lt;br&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-br-element', '&lt;br&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/text.html#h-9.3.2.1', '&lt;br&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>Elemento {{HTMLElement("address")}}</li>
- <li>Elemento {{HTMLElement("p")}}</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/button/index.html b/files/es/web/html/elemento/button/index.html
deleted file mode 100644
index abcab78469..0000000000
--- a/files/es/web/html/elemento/button/index.html
+++ /dev/null
@@ -1,198 +0,0 @@
----
-title: button
-slug: Web/HTML/Elemento/button
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/button
----
-<h2 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h2>
-
-<p><strong>button</strong> = botón.</p>
-
-<p>Es el elemento crea botones marcadores.</p>
-
-<p><span class="seoSummary">La etiqueta de<strong> HTML <code>&lt;button&gt;</code> </strong>representa un elemento cliqueable de tipo botón que puede ser utilizado en formularios o en cualquier parte de la página que necesite un botón estándar y simple de aplicar.</span> De forma predeterminada, los botones HTML se presentan con un estilo similar en todas las plataformas, estos estilos se pueden cambiar utilizando <a href="https://developer.mozilla.org/en-US/docs/Web/CSS">CSS</a>.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;button&gt; y &lt;/button&gt; (ambas obligatorias).</dd>
- <dd><strong>Crea una caja</strong>: en linea.</dd>
- <dd><strong>Está definido como</strong>: <a href="/es/docs/HTML/Elemento/Tipos_de_elementos#de_frase" title="HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de control para formulario</a>.</dd>
- <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="/es/docs/HTML/Elemento/Tipos_de_elementos#en_linea" title="HTML/Elemento/Tipos_de_elementos#en_linea">en Bloque</a> o <a href="/es/docs/HTML/Elemento/Tipos_de_elementos#en_linea" title="HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>, con las siguientes excepciones: (A|%formctrl;|FORM|FIELDSET)</dd>
-</dl>
-
-<h2 id="Atributos" name="Atributos">Atributos</h2>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">name </span></a></td>
-   <td>Asigna un <a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#control-name">nombre de control</a>.</td>
-   <td>Texto <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">con limitaciones</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">value </span></a></td>
-   <td>Asigna un valor inicial que será enviado con el formulario.</td>
-   <td>Texto</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">type </span></a></td>
-   <td>Indica el tipo de botón.</td>
-   <td>Uno de los siguientes: (button|submit|reset)</td>
-   <td><abbr title="Por defecto">PD.</abbr>: submit.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">disabled </span></a></td>
-   <td>Indica que el control está desabilitado.</td>
-   <td>disabled.</td>
-   <td>Lo fija el navegador. disabled.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-accesskey"><span style="color: green;">accesskey </span></a></td>
-   <td>Define una tecla de acceso rápido. Importante para la <a href="/es/docs/Accesibilidad" title="Accesibilidad">Accesibilidad</a>.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-character">carácter</a> o letra.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#adef-tabindex"><span style="color: green;">tabindex </span></a></td>
-   <td>Asigna un número de posición en el orden de tabulación.</td>
-   <td>Un número entre 0 y 32767.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">reserved </span></a></td>
-   <td>Reservado para un uso futuro que nunca tubo. Inútil</td>
-   <td>-</td>
-   <td>-</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;"> onfocus onblur </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h2>
-
-<pre class="brush:html">&lt;button name="button"&gt;Click me&lt;/button&gt;
-</pre>
-
-<h2 id="Soporte" name="Soporte">Sobre Accesibilidad</h2>
-
-<h3 id="Botones_con_íconos">Botones con íconos</h3>
-
-<p>Los botones que solamente utilizan un ícono para representar una funcionalidad no tienen un nombre accesible para los lectores de no-videntes. Para arreglar esto debemos proveer un nombre para el botón que describa la funcionalidad de este.</p>
-
-<h4 id="Ejemplo">Ejemplo</h4>
-
-<pre>&lt;button name="favorito" type="button"&gt;
-  &lt;svg aria-hidden="true" viewBox="0 0 10 10"&gt;&lt;path d="m7.4 8.8-2.4-1.3-2.4 1.3.46-2.7-2-1.9 2.7-.39 1.2-2.5 1.2 2.5 2.7.39-1.9 1.9z"/&gt;&lt;/svg&gt;
-  Agregar a favoritos
-&lt;/button&gt;
-</pre>
-
-<p>Esto también ayudará a los usuarios videntes que no estén familiarizados con el significado del ícono ya que podrán entender su significado pasando el cursor por encima del elemento.</p>
-
-<p>Para más información (en inglés):</p>
-
-<ul>
- <li><a href="https://developer.paciellogroup.com/blog/2017/04/what-is-an-accessible-name/">What is an accessible name? | The Paciello Group</a></li>
- <li><a href="/en-US/docs/Web/Accessibility/Understanding_WCAG/Robust#Guideline_4.1_—_Compatible_Maximize_compatibility_with_current_and_future_user_agents_including_assistive_technologies">MDN Understanding WCAG, Guideline 4.1 explanations</a></li>
- <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/ensure-compat-rsv.html">Understanding Success Criterion 4.1.2 | W3C Understanding WCAG 2.0</a></li>
-</ul>
-
-<h3 id="Proximidad">Proximidad</h3>
-
-<p>Si el sitio tiene una gran cantidad de elementos interactivos muy cercanos entre ellos esto puede generar una dificultad en los usuarios con discapacidades motrices. Es ideal que estos elementos tengan una separación para evitar que el usuario cliquee el incorrecto. Puedes utilizar la propiedad <code>margin</code> para separarlos.</p>
-
-<p>Más información (en inglés):</p>
-
-<ul>
- <li><a href="https://axesslab.com/hand-tremors/">Hand tremors and the giant-button-problem - Axess Lab</a></li>
-</ul>
-
-<h2 id="Soporte" name="Soporte">Soporte</h2>
-
-<div class="hidden">La tabla de compatibilidad se genera automáticamente con datos estructurados. Si te gustaría colaborar puedes encontrar más información por <a href="https://github.com/mdn/browser-compat-data">acá y enviarnos un pull request</a>.</div>
-
-<p>{{Compat("html.elements.button")}}</p>
-
-<h2 id="Referencia" name="Referencia">Referencia</h2>
-
-<ul>
- <li>El elemento <a href="/es/docs/HTML/Elemento/button" title="HTML/Elemento/button">button</a> en el estándar <a class="external" href="http://html.conclase.net/w3c/html401-es/interact/forms.html#h-17.5">HTML 4.01</a></li>
-</ul>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga carencias y defectos. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a href="/es/docs/Project:Como_ayudar" title="Project:Como_ayudar">MDC:Como ayudar</a>.</p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/canvas/index.html b/files/es/web/html/elemento/canvas/index.html
deleted file mode 100644
index 63e3e260a3..0000000000
--- a/files/es/web/html/elemento/canvas/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: canvas
-slug: Web/HTML/Elemento/canvas
-tags:
-  - Canvas
-  - HTML
-  - 'HTML:Elemento'
-  - para_revisar
-translation_of: Web/HTML/Element/canvas
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento HTML <em>canvas</em> (&lt;canvas&gt;) se puede utilizar para dibujar gráficos a través de secuencias de comandos (por lo general <a href="/../../../../en/JavaScript" rel="internal" title="../../../../en/JavaScript">JavaScript</a> ).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por ejemplo, puede usarse para dibujar gráficos, hacer composiciones de fotos o incluso realizar animaciones.</span></span></p>
-
-<p>
- </p><p><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las aplicaciones de Mozilla adquirieron la compatibilidad con <code>&lt;canvas&gt;</code> a partir de Gecko 1.8 (es decir, <a href="/../../../../en/Firefox_1.5_for_developers" rel="internal" title="../../../../en/Firefox 1.5 for developers">Firefox 1.5</a> ).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento fue originalmente introducido por Apple en el OS X <a class="external" href="http://www.apple.com/macosx/features/dashboard/" rel="external nofollow" title="http://www.apple.com/macosx/features/dashboard/">Dashboard</a> y Safari.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Internet Explorer, antes de la versión 9.0 beta, no admite de forma nativa <code>&lt;canvas&gt;</code> , pero una página puede de hecho añadir la compatibilidad mediante la inclusión de un script del proyecto <a class="external" href="http://excanvas.sourceforge.net/" rel="external nofollow" title="http://excanvas.sourceforge.net/">Explorer Canvas</a> de Google.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Opera 9 también es compatible con <code>&lt;canvas&gt;</code> .</span></span></p>
-<p></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para más artículos sobre canvas, consulta la <a href="/es/HTML/Canvas" title="es/HTML/Canvas">página del tema canvas</a> .</span></span></p>
-
-<h2 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Transparente, ya sea <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">contenido estático</a> o <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> .</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte contenido dinámico o cualquier otro elemento que acepte contenido estático .</span></span> </td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
-   <td><a class="external" href="http://www.w3.org/TR/html5/the-canvas-element.html#the-canvas-element" title="http://www.w3.org/TR/html5/the-canvas-element.html#the-canvas-element"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.8.10</span></span></a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h2>
-
-<dl>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("width") }}</span></span></dt>
- <dd> <span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La anchura del espacio de coordenadas en píxeles CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El valor predeterminado es 300.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("height") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La altura del espacio de coordenadas en píxeles CSS.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El valor predeterminado es 150.</span></span></dd>
-</dl>
-
-<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Nota: el tamaño del lienzo mostrado se puede cambiar con una hoja de estilo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La imagen se escala durante la representación para adaptarse al tamaño que se le ha aplicado estilo .</span></span></div>
-
-<h2 id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-99 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h2>
-
-<ul>
- <li><a href="/en/DOM/HTMLCanvasElement" title="en/DOM/HTMLCanvasElement"><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTMLCanvasElement</span></span></a></li>
-</ul>
-
-<h2 id="Ejemplo"><span class="goog-gtc-unit"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Ejemplo</span></span></h2>
-
-<pre class="brush: html">&lt;<span class="start-tag">canvas</span><span class="attribute-name"> id</span>=<span class="attribute-value">"canvas" </span><span class="attribute-name">width</span>=<span class="attribute-value">"300" </span><span class="attribute-name">height</span>=<span class="attribute-value">"300"</span>&gt;
-  Tu navegador no admite el elemento &amp;<span class="entity">lt;</span>canvas&amp;<span class="entity">gt;</span>.
-&lt;/<span class="end-tag">canvas</span>&gt;
-</pre>
-
-<h2 id="Sobre_Accesibilidad">Sobre Accesibilidad</h2>
-
-<p>El elemento <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas" title="Use the HTML &lt;canvas> element with either the canvas scripting API or the WebGL API to draw graphics and animations."><code>&lt;canvas&gt;</code></a> es simplemente un bitman que no provee ninguna información adicional sobre los elementos que tiene dibujados. El contenido de la etiqueta <code>canvas</code> no se muestra a los lectores de pantalla como otras etiquetas semánticas. Como regla general, deberías evitar utilizar canvas en un sitio accesible.</p>
-
-<p>Para mejorar la accesibilidad de la etiquetas puedes leer los siguientes artículos (en inglés):</p>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Hit_regions_and_accessibility">MDN Hit regions and accessability</a></li>
- <li><a href="https://www.w3.org/WAI/PF/HTML/wiki/Canvas_Accessibility_Use_Cases">Canvas accessibility use cases</a></li>
- <li><a href="https://www.w3.org/html/wg/wiki/AddedElementCanvas">Canvas element accessibility issues</a></li>
- <li><a href="http://www.paciellogroup.com/blog/2012/06/html5-canvas-accessibility-in-firefox-13/">HTML5 Canvas Accessibility in Firefox 13 – by Steve Faulkner</a></li>
- <li><a href="https://html.spec.whatwg.org/multipage/scripting.html#best-practices">Best practices for interactive canvas elements</a></li>
-</ul>
-
-<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h2>
-
-<ul>
- <li><a href="/es/HTML/Canvas" title="es/HTML/Canvas"><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Tema sobre canvas</span></span></a></li>
-</ul>
-
-<p> </p>
-
-<p style="margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; text-indent: 0px;"><span style="color: #000000; font-family: 'Ubuntu'; font-size: 9pt;">{{ languages( { "de": "de/HTML/Element/canvas", "en": "en/HTML/Element/canvas", "es": "es/HTML/Elemento/canvas", "ja": "ja/HTML/Element/canvas", "ko": "ko/HTML/Element/canvas", "nl": "nl/HTML/HTML_Tags/canvas", "pl": "pl/HTML/Element/canvas", "ru": "Ru/HTML/Element/canvas", "zh-cn": "cn/HTML/Element/canvas", "fr": "fr/HTML/Element/canvas" } ) }}</span></p>
diff --git a/files/es/web/html/elemento/caption/index.html b/files/es/web/html/elemento/caption/index.html
deleted file mode 100644
index 84d06cffaa..0000000000
--- a/files/es/web/html/elemento/caption/index.html
+++ /dev/null
@@ -1,167 +0,0 @@
----
-title: caption
-slug: Web/HTML/Elemento/caption
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/caption
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Es el encargado de darle un título descriptivo a las tablas.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;caption&gt;</code> y <code>&lt;/caption&gt;</code> (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: .</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#para_tablas">para tablas</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">align </span></a></td>
-   <td>Indica la alineación en relación a la tabla.</td>
-   <td>Uno de los siguientes: 'top', 'bottom', 'left', 'right'.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Ejemplo_simple" name="Ejemplo_simple">Ejemplo simple</h4>
-
-<p>El siguiente código:</p>
-
-<pre class="eval"><span class="nowiki">
-  &lt;table border='1'&gt;
-   &lt;caption&gt;Tabla con caption&lt;/caption&gt;
-    &lt;tr&gt; &lt;td&gt; tabla de una celda. &lt;/td&gt;  &lt;/tr&gt;
-  &lt;/table&gt;
- </span>
-</pre>
-
-<p>Se visualiza así:</p>
-
-<div style="border: solid silver 1px;">
-<table>
- <caption>Tabla con caption</caption>
- <tbody>
-  <tr>
-   <td>tabla de una celda.</td>
-  </tr>
- </tbody>
-</table>
-</div>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li>Debe ser el primer hijo del elemento table. una tabla solo puede tener uno.</li>
-</ul>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#h-11.2.2"><strong>caption</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-caption">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/center/index.html b/files/es/web/html/elemento/center/index.html
deleted file mode 100644
index 1a24bbaf4b..0000000000
--- a/files/es/web/html/elemento/center/index.html
+++ /dev/null
@@ -1,116 +0,0 @@
----
-title: <center> (obsoleto)
-slug: Web/HTML/Elemento/center
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/center
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>{{obsolete_header()}}<br>
- El elemento obsoleto <a href="es/HTML/Elemento/center">center</a> (centro) crea una caja en bloque con el contenido centrado. En realidad es equivalente a un <a href="es/HTML/Elemento/div">div</a> con <code>align="center"</code></p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;center&gt; y &lt;/center&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">Elemento desaprobado</a>.</dd>
-</dl>
-
-<blockquote>
-<dl>
- <dt>Actualmente la mejor <a href="https://juanmcastro.es/tutoriales/como-centrar-texto-en-html/">forma de centrar texto no es con html</a>, con css tenemos infinidad de posibilidales para centrar el texto vertical, horizontal, izquierda, dercha, justificado y todo lo que necesitemos.</dt>
-</dl>
-</blockquote>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> y <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td colspan="4">Ver atributos de transición.</td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición (Solo tiene los genéricos)</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>lista de clases separadas por espacios</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, .</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>uno de los siguientes:"ltr" o "rtl"</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre>&lt;center&gt;
- elemento center
-&lt;/center&gt;
-&lt;div align='center'&gt;
- elemento div con: align='center'
-&lt;/div&gt;
-</pre>
diff --git a/files/es/web/html/elemento/cite/index.html b/files/es/web/html/elemento/cite/index.html
deleted file mode 100644
index 237934b396..0000000000
--- a/files/es/web/html/elemento/cite/index.html
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: cite
-slug: Web/HTML/Elemento/cite
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/cite
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>cite</strong> -<em>cita</em> . Marca una referencia a una fuente, o el autor de un texto citado.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;cite&gt; y &lt;/cite&gt; (ambas obligatorias)</dd>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#defrase">Elemento de frase</a>, y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En línea.</dd>
- <dd><strong>Puede contener</strong>: Text y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id=".C2.BFQui.C3.A9n_lo_dijo.3F" name=".C2.BFQui.C3.A9n_lo_dijo.3F">¿Quién lo dijo?</h4>
-
-<p>código:</p>
-
-<pre class="eval">&lt;p&gt; &lt;cite&gt;Galileo&lt;/cite&gt; dijo: "... y sin embargo, se mueve." &lt;/p&gt;
-</pre>
-
-<p><br>
- Resultado:</p>
-
-<div style="border: solid silver 1px; margin-left: 1em;">
-<p><cite>Galileo</cite> dijo: "...y sin embargo, se mueve."</p>
-</div>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<p>En los navegadores basados en Mozilla (y en otros) el contenido de cite es mostrado con un estilo de texto en cursiva.</p>
-
-<pre class="eval">&lt;p&gt; &lt;cite&gt;Galileo&lt;/cite&gt; dijo: "... y sin embargo, se mueve." &lt;/p&gt;
-&lt;p&gt; &lt;span style='font-style: italic;'&gt;Galileo&lt;/span&gt; dijo: "... y sin embargo, se mueve." &lt;/p&gt;
-</pre>
-
-<p> </p>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li>Está bastante estendido el mal uso de este elemento, mucha gente lo usa para marcar el texto de las citas en vez del autor, para marcar el texto están los elementos <a href="es/HTML/Elemento/q">q</a> (en línea) y <a href="es/HTML/Elemento/blockquote">blockquote</a> (en bloque).</li>
-</ul>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>Los elementos de frase <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-CITE">en la especificación</a> de html 4.01</li>
-</ul>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-cite">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/code/index.html b/files/es/web/html/elemento/code/index.html
deleted file mode 100644
index dfcac59bfd..0000000000
--- a/files/es/web/html/elemento/code/index.html
+++ /dev/null
@@ -1,110 +0,0 @@
----
-title: code
-slug: Web/HTML/Elemento/code
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/code
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Es el apropiado para marcar el código de un programa.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;code&gt; y &lt;/code&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">&lt;code&gt;
-<span class="nowiki"> #include main() { for(;;) { printf ("Hello World!\n"); } } </span>
-&lt;/code&gt;
-</pre>
diff --git a/files/es/web/html/elemento/col/index.html b/files/es/web/html/elemento/col/index.html
deleted file mode 100644
index 4f8c415f87..0000000000
--- a/files/es/web/html/elemento/col/index.html
+++ /dev/null
@@ -1,177 +0,0 @@
----
-title: col
-slug: Web/HTML/Elemento/col
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/col
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Permite especificar propiedades para una columna o un grupo de ellas.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;col&gt;</code> (solo tiene una).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: No.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#para_tablas">para tablas.</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Nada.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a></td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>.</td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: "desconocido".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr></td>
-   <td>Lo fija el navegador. <abbr title="Por defecto">PD.</abbr>: En castellano 'ltr'.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-span-COL"><span style="color: green;">span </span></a></td>
-   <td>Indica el número de columnas afectadas.</td>
-   <td>Un número.</td>
-   <td><abbr title="Por defecto">PD.</abbr>: 1.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-width-COL"><span style="color: green;">width </span></a></td>
-   <td>Indica la anchura de las columnas.</td>
-   <td>Una longitud expresada en píxeles, porcentaje o relativa.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-align-TD"><span style="color: green;">align </span></a></td>
-   <td>Indica la alineación horizontal.</td>
-   <td>Uno de los siguientes: (left|center|right|justify|char).</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-char"><span style="color: green;">char </span></a></td>
-   <td>Carácter que se usará como punto de alineación.</td>
-   <td>Un carácter, Uno de estos: {{ mediawiki.external('ISO10646') }}.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-charoff"><span style="color: green;">charoff </span></a></td>
-   <td>offset del carácter de alineación.</td>
-   <td>Una longitud expresada en píxeles o porcentaje.</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-valign"><span style="color: green;">valign </span></a></td>
-   <td>Indica la alineación vertical de los contenidos de las celdas.</td>
-   <td>Uno de los siguientes: (top|middle|bottom|baseline).</td>
-   <td>Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-   <th>por omisión</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="bla_bla" name="bla_bla">bla bla</h4>
-
-<pre class="eval"><span class="nowiki">
-
- </span>
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#edef-COL."><strong>col</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-col">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/colgroup/index.html b/files/es/web/html/elemento/colgroup/index.html
deleted file mode 100644
index da87284232..0000000000
--- a/files/es/web/html/elemento/colgroup/index.html
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: colgroup
-slug: Web/HTML/Elemento/colgroup
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/colgroup
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>colgroup</strong> de column group = Grupo de columnas. Permite crear <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#h-11.2.4">grupos de columnas</a>.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;colgroup&gt;</code> y <code>&lt;/colgroup&gt;</code> (la de cierre es opcional).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: No.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#para_tablas">para tablas</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Cero o más elementos <a href="es/HTML/Elemento/col">col</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.3">Texto legible</a>. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-cdata">cdata</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-span-COLGROUP"><span style="color: green;">span </span></a></td>
-   <td>Indica el número de columnas que se agrupan.</td>
-   <td>Un número entero mayor que cero. Por defecto: 1.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-width-COLGROUP"><span style="color: green;">width </span></a></td>
-   <td>Indica la anchura de las columnas del grupo.</td>
-   <td>Una longitud expresada en píxeles, porcentaje o relativa. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-align-TD"><span style="color: green;">align </span></a></td>
-   <td>Indica la alineación horizontal.</td>
-   <td>Uno de los siguientes: <code>'left' 'center' 'right' 'justify' y 'char'</code>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-char"><span style="color: green;">char </span></a></td>
-   <td>Carácter que se usará como punto de alineación.</td>
-   <td>Un carácter. Por defecto: el carácter de punto decimal (puede variar según el idioma). Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-charoff"><span style="color: green;">charoff </span></a></td>
-   <td>Indica la distancia entre el borde y el carácter de alineación.</td>
-   <td>Una longitud expresada en píxeles o porcentaje. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#adef-valign"><span style="color: green;">valign </span></a></td>
-   <td>Indica la alineación vertical de los contenidos de las celdas.</td>
-   <td>Uno de los siguientes: <code>'top' 'middle' 'bottom' y 'baseline'</code>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="bla_bla" name="bla_bla">bla bla</h4>
-
-<pre class="eval"><span class="nowiki">
-
- </span>
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/tables.html#edef-COLGROUP."><strong>colgroup</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-colgroup">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/command/index.html b/files/es/web/html/elemento/command/index.html
deleted file mode 100644
index eaaeb3118c..0000000000
--- a/files/es/web/html/elemento/command/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: <command>
-slug: Web/HTML/Elemento/command
-tags:
-  - HTML
-  - Obsoleto
-translation_of: Web/HTML/Element/command
----
-<div>{{obsolete_header()}}</div>
-
-<div class="note">
-<p><span style="font-size: 14px; line-height: 21px;"><strong>Nota: </strong>El elemento <code>command</code> ha sido removido de </span>{{Gecko("24.0")}}  en favor del elemento {{HTMLElement("menuitem")}}  . Firefox nunca ha soportado este elemento <code>command , </code>y la implementación existente de la interface DOM  {{domxref("HTMLCommandElement")}} ha sido removida de  <a href="/en-US/docs/Site_Compatibility_for_Firefox_24">Firefox 24</a>.</p>
-</div>
-
-<h2 id="Resumen_de_el_catalogo">Resumen de el catalogo</h2>
-
-<pre>&lt;command function="About live stream"&gt;</pre>
-
-<h3 class="brush: html" id="sect1"></h3>
-
-<h4 id="El_elemento_command_representa_un_comando_que_el_usuario_puede_invocar_.">El elemento <code>command </code>representa un comando que el usuario puede invocar .</h4>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td>Contenido dinámico , contenido estático de texto, contenido de metadata .</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno , es un {{Glossary("empty element")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>La etiqueta de inicio es obligatoria , pero como es un elemento vacío , el uso de una etiqueta de cierre está prohibido . </td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos </th>
-   <td>Solamente {{HTMLElement("colgroup")}} ,aunque puede ser definido implícitamente ya que su etiqueta de inicio no es obligatoria .El  {{HTMLElement("colgroup")}} no debe de tener un {{HTMLElement("span")}} como hijo .</td>
-  </tr>
-  <tr>
-   <th scope="row">Interface DOM </th>
-   <td>{{domxref("HTMLCommandElement")}} {{ obsolete_inline(24) }}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</p>
-
-<ul>
- <li><code>command</code> o <code>empty</code> el cual es el estado por default e indica que este es un comando normal.</li>
- <li><code>checkbox</code> indica que el comando puede ser alternado usando un checkbox.</li>
- <li><code>radio</code> indica que el comando puede ser alternado usando un radiobutton.</li>
-</ul>
-
-<dl>
- <dt>{{htmlattrdef("checked")}}</dt>
- <dd>Indica si el comando es seleccionado . Debe de ser omitido al menos que el atributo <code>type </code>sea <code>checkbox </code>o <code>radio.</code></dd>
- <dt>{{htmlattrdef("disabled")}}</dt>
- <dd>Indica que el comando no está disponible .</dd>
- <dt>{{htmlattrdef("icon")}}</dt>
- <dd>Proporciona una imagen que representa el comando.</dd>
- <dt>{{htmlattrdef("label")}}</dt>
- <dd>El nombre del comando como se muestra al usuario .</dd>
- <dt>{{htmlattrdef("radiogroup")}}</dt>
- <dd>Este atributo proporciona el nombre del grupo de comandos , con un atributo  <code>type </code>de<code> tipo radio ,</code>que será alternado cuando el comando en sí mismo sea alternado . Este atributo debe de ser omitido al menos que el atributo <code>type </code>sea del tipo <code>radio .</code></dd>
- <dt>{{htmlattrdef("type")}}</dt>
- <dd>Este atributo indica el tipo de comando . Este puede ser uno de los siguientes tres valores :</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;command type="command" label="Save" icon="icons/save.png" onclick="save()"&gt;
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'commands.html', '&lt;command&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'semantics.html#the-command-element', '&lt;command&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico </td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>{{ HTMLRef }}</p>
diff --git a/files/es/web/html/elemento/content/index.html b/files/es/web/html/elemento/content/index.html
deleted file mode 100644
index 0e380c1cd9..0000000000
--- a/files/es/web/html/elemento/content/index.html
+++ /dev/null
@@ -1,167 +0,0 @@
----
-title: <content>
-slug: Web/HTML/Elemento/content
-tags:
-  - Deprecado
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-  - Web Components
-translation_of: Web/HTML/Element/content
----
-<p>{{Deprecated_header}}</p>
-
-<p>El elemento <a href="/en-US/docs/Web/HTML">HTML</a> <code>&lt;content&gt; es usado dentro de un </code> <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">Shadow DOM</a> como un {{glossary("insertion point")}} . No está pensado para ser usado en HTML ordinario . Es usado con <a href="/en-US/docs/Web/Web_Components">Web Components</a>.</p>
-
-<div class="note">
-<p><strong>Nota: </strong>Aunque está presente en un draft inicial de las especificaciones e implementado en varios exploradores , este elemento ha sido removido en versiones posteriores a la especificación .</p>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido" title="HTML/Content_categories">Categorías de contenido</a></th>
-   <td>Modelo de contenido transpatente</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Contenido dinámico</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Any element that accepts flow content.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfase DOM</th>
-   <td>{{domxref("HTMLContentElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Attributes" name="Attributes">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales </a>.</p>
-
-<dl>
- <dt>select</dt>
- <dd>Una lista de selectores separada por comas . Estos tienen la misma sintaxis que los selectores de CSS . Seleccionan el contenido a insertar en lugar del elemento &lt;content&gt; .</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Aquí hay un ejemplo simple del uso del elemento &lt;content&gt; . Es un archivo HTML con todo lo necesario en el .</p>
-
-<div class="note">
-<p><strong>Nota: </strong>Para que este código funcione , el explorador en el que se muestre debe de soportar Web Components . Ver <a href="/en-US/docs/Web/Web_Components#Enabling_Web_Components_in_Firefox">Enabling Web Components in Firefox</a> .</p>
-</div>
-
-<pre class="brush: html">&lt;html&gt;
-  &lt;head&gt;&lt;/head&gt;
-  &lt;body&gt;
-  &lt;!-- The original content accessed by &lt;content&gt; --&gt;
-  &lt;div&gt;
-    &lt;h4&gt;My Content Heading&lt;/h4&gt;
-    &lt;p&gt;My content text&lt;/p&gt;
-  &lt;/div&gt;
-
-  &lt;script&gt;
-  // Get the &lt;div&gt; above.
-  var myContent = document.querySelector('div');
-  // Create a shadow DOM on the &lt;div&gt;
-  var shadowroot = myContent.createShadowRoot();
-  // Insert into the shadow DOM a new heading and
-  // part of the original content: the &lt;p&gt; tag.
-  shadowroot.innerHTML =
-   '&lt;h2&gt;Inserted Heading&lt;/h2&gt; &lt;content select="p"&gt;&lt;/content&gt;';
-  &lt;/script&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>Si muestras esto en un explorador web , debe de verse como lo siguiente .</p>
-
-<p><img alt="content example" src="https://mdn.mozillademos.org/files/10077/content-example.png" style="height: 383px; width: 716px;"></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="spec-table standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Shadow DOM', "#the-content-element", "content")}}</td>
-   <td>{{Spec2('Shadow DOM')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con exploradores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterísitica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>35</td>
-   <td><span style="font-size: 12px; line-height: 18px;">{{CompatGeckoDesktop("28")}}</span> [1]</td>
-   <td>{{CompatNo}}</td>
-   <td>26</td>
-   <td><span style="font-size: 12px; line-height: 18px;">{{CompatNo}}</span></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Catacterística</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico </td>
-   <td>37</td>
-   <td>{{CompatGeckoMobile("28")}} [1]</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Si el Shadow DOM no está habilidado en Firefox , los elementos de &lt;content&gt; se comportarán como  {{domxref("HTMLUnknownElement")}} . Shadow DOM fue implementado por primera vez en Firefox33 y está detras de una preferencia , <code>dom.webcomponents.enabled</code>, el cual está deshabilitado por default .</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/Web_Components">Web Components</a></li>
- <li>{{HTMLElement("shadow")}}, {{HTMLElement("template")}}, {{HTMLElement("element")}}</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/data/index.html b/files/es/web/html/elemento/data/index.html
deleted file mode 100644
index 8f202fa334..0000000000
--- a/files/es/web/html/elemento/data/index.html
+++ /dev/null
@@ -1,141 +0,0 @@
----
-title: <data>
-slug: Web/HTML/Elemento/data
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/data
----
-<h2 id="Resúmen">Resúmen</h2>
-
-<p>El <strong>Elemento HTML <code>&lt;data&gt;</code></strong> vincula un contenido dado con una traducción legible por una máquina. Si el contenido está relacionado con <code>time-</code> o <code>date-</code>, debe usarse el elemento {{HTMLElement("time")}}.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Categorías de contenido</a></th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, palpable content.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">Phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos permitidos</th>
-   <td>Any element that accepts <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">interfaz DOM</th>
-   <td>{{domxref("HTMLDataElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento incluye </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">Atributos globales </a></p>
-
-<dl>
- <dt>{{htmlattrdef("value")}}</dt>
- <dd>This attribute specifies the machine-readable translation of the content of the element.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>El siguiente ejemplo muestra nombres de productos pero también asocia a cada uno con su código UPC.</p>
-
-<pre class="brush: html">&lt;p&gt;New Products&lt;/p&gt;
-&lt;ul&gt;
- &lt;li&gt;&lt;data value="3967381398"&gt;Mini Ketchup&lt;/data&gt;&lt;/li&gt;
- &lt;li&gt;&lt;data value="3967381399"&gt;Jumbo Ketchup&lt;/data&gt;&lt;/li&gt;
- &lt;li&gt;&lt;data value="3967381400"&gt;Mega Jumbo Ketchup&lt;/data&gt;&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-data-element', '&lt;data&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No change from {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-data-element', '&lt;data&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("22.0")}} {{bug("839371")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>The HTML {{HTMLElement("time")}} element.</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/datalist/index.html b/files/es/web/html/elemento/datalist/index.html
deleted file mode 100644
index 40049a9734..0000000000
--- a/files/es/web/html/elemento/datalist/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: datalist
-slug: Web/HTML/Elemento/datalist
-tags:
-  - HTML5
-  - datalist
-translation_of: Web/HTML/Element/datalist
----
-<p>El <strong>elemento HTML <code>&lt;datalist&gt;</code> </strong>contiene un conjunto de elementos {{HTMLElement("option")}} que representan los valores disponibles para otros controles.</p>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, copia https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Contenido de las categorías</a></th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>O bien <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a> o, cero o más elementos {{HTMLElement("option")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>Ninguno</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLDataListElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento no tiene otros atributos mas que los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a>, comunes a todos los elementos.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;label&gt;Choose a browser from this list:
-&lt;input list="browsers" name="myBrowser" /&gt;&lt;/label&gt;
-&lt;datalist id="browsers"&gt;
-  &lt;option value="Chrome"&gt;
-  &lt;option value="Firefox"&gt;
-  &lt;option value="Internet Explorer"&gt;
-  &lt;option value="Opera"&gt;
-  &lt;option value="Safari"&gt;
-  &lt;option value="Microsoft Edge"&gt;
-&lt;/datalist&gt;
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{EmbedLiveSample("Examples")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'forms.html#the-datalist-element', '&lt;datalist&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-datalist-element', '&lt;datalist&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadoresEdit">Compatibilidad con los distintos navegadores<a class="button section-edit only-icon" href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/option$edit#Compatibilidad_con_los_distintos_navegadores" rel="nofollow, noindex"><span>Edit</span></a></h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, visite https://github.com/mdn/browser-compat-data y envíenos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.datalist")}}</p>
-
-<h2 id="sección_de_relleno">sección de relleno</h2>
-
-<p>Incluya este polyfill para proporcionar soporte para navegadores antiguos y actualmente incompatibles:<br>
- <a href="https://github.com/mfranzke/datalist-polyfill">datalist-polyfill</a></p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li class="last">El elemento {{HTMLElement("input")}}, y más especificamente este atributo {{htmlattrxref("list", "input")}};</li>
- <li class="last">El elemento {{HTMLElement("option")}}.</li>
-</ul>
-
-<p class="last">{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/dd/index.html b/files/es/web/html/elemento/dd/index.html
deleted file mode 100644
index 3296e7758b..0000000000
--- a/files/es/web/html/elemento/dd/index.html
+++ /dev/null
@@ -1,111 +0,0 @@
----
-title: dd
-slug: Web/HTML/Elemento/dd
-tags:
-  - Contenido agrupado HTML
-  - Definición
-  - Detalles
-  - Detalles de descripción
-  - Elemento
-  - HTML
-  - Lista de descripciones
-  - Referencia
-  - Web
-  - dd
-translation_of: Web/HTML/Element/dd
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">El <strong>elemento HTML <code>&lt;dd&gt;</code> </strong>provee detalles acerca de o la definición de un término precedente ({{HTMLElement("dt")}}) en una lista de descripciones ({{HTMLElement("dl")}}).</span></p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/dd.html", "tabbed-standard")}}</div>
-
-<p class="hidden">La fuente para este ejemplo interactivo esta almacenado en un repositorio GitHub. Si desea contribuir al poryecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíe una petición de extracción (pull request).</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td>Ninguna</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido de flujo</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de Tag</th>
-   <td>El tag inicial es requerido. El tag final puede ser omitido si el elemento {{HTMLElement("dd")}} se encuentra inmediatamente seguido por otro elemento <code>&lt;dd&gt;</code>, o si no hay más contenido en el elemento padre.</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>{{HTMLElement("dl")}} o (en <a href="/es/docs/Glossary/WHATWG">WHATWG</a> HTML) un {{HTMLElement("div")}} que se encuentra dentro de un {{HTMLElement("dl")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Hermano previo</th>
-   <td>{{HTMLElement("dt")}} u otro elemento {{HTMLElement("dd")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>Ninguno</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Los atributos de este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("nowrap")}} {{Non-standard_inline}}</dt>
- <dd>Si el valor de este atributo es definido como <code>yes</code>, el texto de la definición no se encapsulará. El valor por defecto es <code>no</code>.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Para un ejemplo, ver <a href="/es/docs/Web/HTML/Elemento/dl#Examples">ejemplos &lt;dl&gt;</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-dd-element', '&lt;dd&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-dd-element', '&lt;dd&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/lists.html#h-10.3', '&lt;dd&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página es generada desde datos estructurados. Si desea contribuir, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíe una solicitud de extracción (pull request).</div>
-
-<p>{{Compat("html.elements.dd")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{HTMLELement("dl")}}</li>
- <li>{{HTMLElement("dt")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/del/index.html b/files/es/web/html/elemento/del/index.html
deleted file mode 100644
index b38c85a532..0000000000
--- a/files/es/web/html/elemento/del/index.html
+++ /dev/null
@@ -1,155 +0,0 @@
----
-title: del
-slug: Web/HTML/Elemento/del
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/del
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <code style="color: darkblue;">del</code> (deleted-borrado) marca las partes de un texto o documento que han sido suprimidas o sustituidas.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;del&gt; y &lt;/del&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: a veces <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a> a veces <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>:</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: depende, si actua como un elemento en bloque puede contener elementos en bloque y en linea. Pero si actua como un elemento en linea solo podrá contener elementos en linea.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">cite</code></td>
-   <td>URI</td>
-   <td>implícito</td>
-   <td>información sobre el cambio</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">datetime</code></td>
-   <td>fecha</td>
-   <td>implícito</td>
-   <td>fecha y hora del cambio</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene, o dicho de otra manera, tiene los mismos que en el doctype estricto</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre> Ejemplo de ins en linea:
-
-   &lt;p&gt;
-       El agua es insípida &lt;del&gt;y húmeda.&lt;/del&gt; &lt;ins&gt;inodora e incolora.&lt;/ins&gt;
-   &lt;/p&gt;
-
- Ejemplo de ins en bloque:
-
-   &lt;p&gt;
-       El agua es insípida.
-   &lt;/p&gt;
-
- &lt;del&gt;
-   &lt;p&gt;
-       y húmeda.
-   &lt;/p&gt;
- &lt;/del&gt;
-</pre>
-
-<p><br>
- Se visualiza así:</p>
-
-<div class="highlight">
-<p>Ejemplo de ins en linea:</p>
-
-<p>El agua es insípida</p>
-<del>y húmeda.</del> <ins>inodora e incolora.</ins>
-
-<p>Ejemplo de ins en bloque:</p>
-
-<p>El agua es insípida.</p>
-
-<p> </p>
-
-<p> </p>
-<del>y húmeda. </del></div>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p>El elemento <a href="es/HTML/Elemento/del">del</a> del tiene un opuesto, el elemento <a href="es/HTML/Elemento/ins">ins</a>. <a href="es/HTML/Elemento/del">del</a>, marca las partes descartadas e <a href="es/HTML/Elemento/ins">ins</a> las insertadas.</p>
diff --git a/files/es/web/html/elemento/details/index.html b/files/es/web/html/elemento/details/index.html
deleted file mode 100644
index cd8b0c5abb..0000000000
--- a/files/es/web/html/elemento/details/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: <details>
-slug: Web/HTML/Elemento/details
-tags:
-  - Elemento
-  - Elementos HTML interactivos
-  - HTML
-  - HTML5
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/details
----
-<p>{{ SeeCompatTable() }}</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento HTML Details<strong> &lt;details&gt; </strong>es usado como un widget de revelación a través del cual el usuario puede obtener información adicional .</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Contenido dinámico</a> , contenido de seccionamiento, contenido interactivo, contenido palpable .</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Un elemento  {{HTMLElement("summary")}}  seguido de <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">contenido dinámico</a> </td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padres permitidos</th>
-   <td>Cualquier elemento que acepte  <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">contenido dinámico</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLDetailsElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</p>
-
-<dl>
- <dt>{{htmlattrdef("open")}}</dt>
- <dd>Este atributo Booleano indica si los detalles serán mostrados al usuario cuando la página se cargue . Por default el valor es <code>false </code>y por lo tanto los detalles estarán ocultos.</dd>
- <dd></dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html">&lt;details&gt;
-  &lt;summary&gt;Some details&lt;/summary&gt;
-  &lt;p&gt;More info about the details.&lt;/p&gt;
-&lt;/details&gt;
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{EmbedLiveSample("Example")}}</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Si el el ejemplo de arriba no funciona , ver {{anch("Compatibilidad con navegadores")}}  para determinar si el navegador soporta esta característica .</p>
-</div>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'interactive-elements.html#the-details-element', '&lt;details&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'semantics.html#the-details-element', '&lt;details&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>12</td>
-   <td>{{CompatNo}} {{bug(591737)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>15</td>
-   <td>6</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4.0</td>
-   <td>{{CompatNo}} {{bug(591737)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"></h2>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{HTMLElement("summary")}}</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/dfn/index.html b/files/es/web/html/elemento/dfn/index.html
deleted file mode 100644
index 03242c90bd..0000000000
--- a/files/es/web/html/elemento/dfn/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: dfn
-slug: Web/HTML/Elemento/dfn
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/dfn
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Sirve para marcar el término que se quiere definir.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;dfn&gt; y &lt;/dfn&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">&lt;p&gt;
-     El &lt;dfn&gt;HTML&lt;/dfn&gt; es un lenguaje de marcado para hipertextos.
-&lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/elemento/dialog/index.html b/files/es/web/html/elemento/dialog/index.html
deleted file mode 100644
index e44363c003..0000000000
--- a/files/es/web/html/elemento/dialog/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: <dialog>
-slug: Web/HTML/Elemento/dialog
-translation_of: Web/HTML/Element/dialog
----
-<div>{{HTMLRef}}</div>
-
-<p>El <strong>elemento</strong> <strong>HTML <code>&lt;dialog&gt;</code> </strong>representa una caja de diálogo u otro componente interactivo, como inspector o ventana.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/Web/HTML/Sections_and_Outlines_of_an_HTML5_document#Sectioning_roots">sectioning root</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted content</th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Tag omission</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted parent elements</th>
-   <td>Any element that accepts <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a></td>
-  </tr>
-  <tr>
-   <th scope="row">DOM interface</th>
-   <td>{{domxref("HTMLDialogElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>. El atributo <code>tabindex</code> no debe utilizarse en el elemento <code>&lt;dialog&gt;</code>.</p>
-
-<dl>
- <dt>{{htmlattrdef("open")}}</dt>
- <dd>Indica que el diálogo está activo y disponible para interactuar. Cuando el atributo open no está asignado, no debe mostrarse al usuario.</dd>
-</dl>
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<p> </p>
-
-<ul>
- <li>Los elementos <code>&lt;form&gt;</code> pueden integrarse dentro de un diálogo  especificándolos con el atributo <code>method="dialog"</code>. Cuando se envía un formulario, el diálogo se cierra con un atributo {{domxref("HTMLDialogElement.returnValue", "returnValue")}} asignado con el <code>value</code> del botón utilizado.</li>
- <li>El pseudo-elemento {{cssxref('::backdrop')}} de CSS puede utilizarse para dar estilos al elemento <code>&lt;dialog&gt;</code>, por ejemplo para atenuar contenido inaccesible mientras el diálogo modal esté activo.</li>
-</ul>
-
-<p> </p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_1">Ejemplo 1</h3>
-
-<pre class="brush: html">&lt;dialog open&gt;
-  &lt;p&gt;Greetings, one and all!&lt;/p&gt;
-&lt;/dialog&gt;
-</pre>
-
-<h3 id="Ejemplo_2">Ejemplo 2</h3>
-
-<pre class="brush: html">&lt;!-- Simple pop-up dialog box, containing a form --&gt;
-&lt;dialog id="favDialog"&gt;
-  &lt;form method="dialog"&gt;
-    &lt;section&gt;
-      &lt;p&gt;&lt;label for="favAnimal"&gt;Favorite animal:&lt;/label&gt;
-      &lt;select id="favAnimal"&gt;
-        &lt;option&gt;&lt;/option&gt;
-        &lt;option&gt;Brine shrimp&lt;/option&gt;
-        &lt;option&gt;Red panda&lt;/option&gt;
-        &lt;option&gt;Spider monkey&lt;/option&gt;
-      &lt;/select&gt;&lt;/p&gt;
-    &lt;/section&gt;
-    &lt;menu&gt;
-      &lt;button id="cancel" type="reset"&gt;Cancel&lt;/button&gt;
-      &lt;button type="submit"&gt;Confirm&lt;/button&gt;
-    &lt;/menu&gt;
-  &lt;/form&gt;
-&lt;/dialog&gt;
-
-&lt;menu&gt;
-  &lt;button id="updateDetails"&gt;Update details&lt;/button&gt;
-&lt;/menu&gt;
-
-&lt;script&gt;
-  (function() {
-    var updateButton = document.getElementById('updateDetails');
-    var cancelButton = document.getElementById('cancel');
-    var favDialog = document.getElementById('favDialog');
-
-    // Update button opens a modal dialog
-    updateButton.addEventListener('click', function() {
-      favDialog.showModal();
-    });
-
-    // Form cancel button closes the dialog box
-    cancelButton.addEventListener('click', function() {
-      favDialog.close();
-    });
-
-  })();
-&lt;/script&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'forms.html#the-dialog-element', '&lt;dialog&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'semantics.html#the-dialog-element', '&lt;dialog&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p> </p>
-
-<div class="hidden">
-<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-</div>
-
-<p>{{Compat("html.elements.dialog")}}</p>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/Guide/HTML/Forms">Formularios HTML</a>.</li>
- <li>El evento {{event("close")}}</li>
- <li>El evento {{event("cancel")}}</li>
- <li>El pseudo-elemento {{cssxref("::backdrop")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/dir/index.html b/files/es/web/html/elemento/dir/index.html
deleted file mode 100644
index 6c95601436..0000000000
--- a/files/es/web/html/elemento/dir/index.html
+++ /dev/null
@@ -1,121 +0,0 @@
----
-title: dir
-slug: Web/HTML/Elemento/dir
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/dir
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <code style="color: darkblue;">dir</code> (directorio) es un elemento desaprobado. En su origen fue pensado para crear directorios en multicolumna, en la actualidad es inutil.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;dir&gt; y &lt;/dir&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">Elemento DESAPROBADO</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
- <dd><strong>NO puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">Elementos en bloque</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">compact</code></td>
-   <td>compact</td>
-   <td>implícito</td>
-   <td>espacio entre objetos reducido</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre class="eval"> &lt;dir&gt;
-  &lt;li&gt;primer elemento &lt;/li&gt;
-  &lt;li&gt;segundo elemento &lt;/li&gt;
-  &lt;li&gt;tercer elemento &lt;/li&gt;
- &lt;/dir&gt;
-</pre>
-
-<div class="highlight">
-<p>Se visualiza así:</p>
-
-<ul>
- <li>primer elemento</li>
- <li>segundo elemento</li>
- <li>tercer elemento</li>
-</ul>
-</div>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/elemento/div/index.html b/files/es/web/html/elemento/div/index.html
deleted file mode 100644
index 5421099e45..0000000000
--- a/files/es/web/html/elemento/div/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: div
-slug: Web/HTML/Elemento/div
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/div
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>div</strong> de "division" -<em>división</em> . Sirve para crear secciones o agrupar contenidos.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;div&gt;</code> y <code>&lt;/div&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: <a href="https://developer.mozilla.org/es/docs/Web/HTML/Block-level_elements">Elemento en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En bloque.</dd>
- <dd><strong>Puede contener</strong>: Texto, y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enbloque">en bloque</a> o <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en linea</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events">Eventos:</a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">datasrc </code></td>
-   <td>Enlaza a una fuente de datos externa (individual o tabular). Reservado para posibles usos futuros.</td>
-   <td>Una dirección URI. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">datafld </code></td>
-   <td>El nombre de una propiedad o columna de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
-   <td>Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dataformatas </code></td>
-   <td>Indica como deben ser tratados los datos obtenidos de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
-   <td>Uno de los siguientes: <code>'paintext'</code> o <code>'html</code>'. Por defecto: <code>'plaintext'</code></td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">align </code></td>
-   <td>Alineación del texto.</td>
-   <td>Uno de los siguientes: <code>"left", "center", "right",</code> o "justify". Por defecto: <code>'left'</code>, lo fija el navegador</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Div_y_span" name="Div_y_span">Div y span</h4>
-
-<p>código:</p>
-
-<pre class="eval">&lt;<strong>div</strong> style="color: blue;"&gt;
- &lt;h2&gt; Ejemplo de div y span &lt;/h2&gt;
-  &lt;p&gt;
-    Esto es un párrafo dentro de un div,
-    &lt;span style="color: red;"&gt; y esto un span dentro de un párrafo.&lt;/span&gt;
-  &lt;/p&gt;
-&lt;/<strong>div</strong>&gt;
-</pre>
-
-<p><span class="comment">el wiki causa interferencias Resultado: &lt;div style='border: solid silver 1px;'&gt; &lt;div style="color: blue;"&gt; &lt;h2&gt; Ejemplo de div y span &lt;/h2&gt; &lt;p&gt; Esto es un párrafo dentro de un div, &lt;span style="color: red;"&gt; y esto un span dentro de un párrafo.&lt;/span&gt; &lt;/p&gt; &lt;/div&gt; &lt;/div&gt;</span></p>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#edef-DIV"><strong>div</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-div">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/dl/index.html b/files/es/web/html/elemento/dl/index.html
deleted file mode 100644
index 9bea9588ce..0000000000
--- a/files/es/web/html/elemento/dl/index.html
+++ /dev/null
@@ -1,219 +0,0 @@
----
-title: dl
-slug: Web/HTML/Elemento/dl
-tags:
-  - Agrupando contenido HTML
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/dl
----
-<div>{{HTMLRef}}</div>
-
-<p>El elemento <strong>HTML <code>&lt;dl&gt;</code>  </strong>representa una lista descriptiva. El elemento encierra una lista de grupos de términos (especificados con el uso del elemento {{HTMLElement("dt")}}) y de descripciones (proveídas con elementos {{HTMLElement("dd")}}). Algunos usos comunes para este elemento son implementar un glosario o para desplegar metadatos (lista de pares llave-valor).</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/dl.html", "tabbed-standard")}}</div>
-
-<p class="hidden">El contenido para este ejemplo interactivo se encuentra almacenado en un repositorio GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envía la petición de extración (pull request).</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido de flujo</a>, y si los elementos hijos de <code>&lt;dl&gt;</code> incluyen un grupo nombre-valor, contenido palpable.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>
-    <p>Ya sea: Cero o más grupos cada uno consistiendo en uno o más elementos {{HTMLElement("dt")}} seguidos por uno o más elementos {{HTMLElement("dd")}}, opcionalmente intercalados con elementos {{HTMLElement("script")}} y elementos {{HTMLElement("template")}}.<br>
-     O: Uno o más elementos {{HTMLElement("div")}}, opcionalmente entremezclados con elementos {{HTMLElement("script")}} y elementos {{HTMLElement("template")}}.</p>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de Tag</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido de flujo</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>{{ARIARole("group")}}, {{ARIARole("presentation")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLDListElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Los atributos de este elemento incluyen los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Término_sencillo_y_descripción">Término sencillo y descripción</h3>
-
-<pre class="brush: html notranslate">&lt;dl&gt;
-  &lt;dt&gt;Firefox&lt;/dt&gt;
-  &lt;dd&gt;
-    A free, open source, cross-platform,
-    graphical web browser developed by the
-    Mozilla Corporation and hundreds of
-    volunteers.
-  &lt;/dd&gt;
-
-  &lt;!-- Other terms and descriptions --&gt;
-&lt;/dl&gt;
-</pre>
-
-<p>Salida:</p>
-
-<p><img alt="Image:HTML-dl1.png" src="/@api/deki/files/241/=HTML-dl1.png"></p>
-
-<h3 id="Múltiples_términos_descripción_sencilla">Múltiples términos, descripción sencilla</h3>
-
-<pre class="brush: html notranslate">&lt;dl&gt;
-  &lt;dt&gt;Firefox&lt;/dt&gt;
-  &lt;dt&gt;Mozilla Firefox&lt;/dt&gt;
-  &lt;dt&gt;Fx&lt;/dt&gt;
-  &lt;dd&gt;
-    A free, open source, cross-platform,
-    graphical web browser developed by the
-    Mozilla Corporation and hundreds of
-    volunteers.
-  &lt;/dd&gt;
-
-  &lt;!-- Other terms and descriptions --&gt;
-&lt;/dl&gt;
-</pre>
-
-<p>Salida:</p>
-
-<p><img alt="Image:HTML-dl2.png" src="/@api/deki/files/242/=HTML-dl2.png"></p>
-
-<h3 id="Término_sencillo_múltiples_descripciones">Término sencillo, múltiples descripciones</h3>
-
-<pre class="brush: html notranslate">&lt;dl&gt;
-  &lt;dt&gt;Firefox&lt;/dt&gt;
-  &lt;dd&gt;
-    A free, open source, cross-platform,
-    graphical web browser developed by the
-    Mozilla Corporation and hundreds of
-    volunteers.
-  &lt;/dd&gt;
-  &lt;dd&gt;
-    The Red Panda also known as the Lesser
-    Panda, Wah, Bear Cat or Firefox, is a
-    mostly herbivorous mammal, slightly larger
-    than a domestic cat (60 cm long).
-  &lt;/dd&gt;
-
-  &lt;!-- Other terms and descriptions --&gt;
-&lt;/dl&gt;
-</pre>
-
-<p>Output:</p>
-
-<p><img alt="Image:HTML-dl3.png" src="/@api/deki/files/243/=HTML-dl3.png"></p>
-
-<h3 id="Múltiples_términos_y_descripciones">Múltiples términos y descripciones</h3>
-
-<p>También es posible definir múltiples términos con múltiples descripciones correspondientes, combinando los ejemplos de arriba.</p>
-
-<h3 id="Metadatos">Metadatos</h3>
-
-<p>Las listas descriptivas son útiles para desplegar metadatos como una lista de pares llave-valor.</p>
-
-<pre class="brush: html notranslate">&lt;dl&gt;
-  &lt;dt&gt;Name&lt;/dt&gt;
-  &lt;dd&gt;Godzilla&lt;/dd&gt;
-  &lt;dt&gt;Born&lt;/dt&gt;
-  &lt;dd&gt;1952&lt;/dd&gt;
-  &lt;dt&gt;Birthplace&lt;/dt&gt;
-  &lt;dd&gt;Japan&lt;/dd&gt;
-  &lt;dt&gt;Color&lt;/dt&gt;
-  &lt;dd&gt;Green&lt;/dd&gt;
-&lt;/dl&gt;
-</pre>
-
-<p>Tip: Puede ser útil definir un separador llave-valor en el CSS, como:</p>
-
-<pre class="brush: css notranslate">dt::after {
-  content: ": ";
-}</pre>
-
-<h3 id="Encapsulado_de_grupos_nombre-valor_en_elementos_HTMLElementdiv">Encapsulado de grupos nombre-valor en elementos {{HTMLElement("div")}}</h3>
-
-<p><a href="/es/docs/Glossary/WHATWG">WHATWG</a> HTML permite encapsular cada grupo nombre-valor de un elemento {{HTMLElement("dl")}} en un elemento {{HTMLElement("div")}}. Esto puede ser útil cuando se utilizan <a href="/es/docs/Web/HTML/Microdata">microdatos</a>, o cuando <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> apliquen a todo el grupo, o por motivos de estilo.</p>
-
-<pre class="brush: html notranslate">&lt;dl&gt;
-  &lt;div&gt;
-    &lt;dt&gt;Name&lt;/dt&gt;
-    &lt;dd&gt;Godzilla&lt;/dd&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;dt&gt;Born&lt;/dt&gt;
-    &lt;dd&gt;1952&lt;/dd&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;dt&gt;Birthplace&lt;/dt&gt;
-    &lt;dd&gt;Japan&lt;/dd&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;dt&gt;Color&lt;/dt&gt;
-    &lt;dd&gt;Green&lt;/dd&gt;
-  &lt;/div&gt;
-&lt;/dl&gt;
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>No use este elemento (ni elementos {{HTMLElement("ul")}}) solo para crear sangría en una página. Si bien funciona, es una mala práctica y obscurece el signinifcado de las listas descriptivas.</p>
-
-<p>Para cambiar la indentación de un término, usa la propiedad {{cssxref("margin")}} de <a href="/es/docs/Web/CSS">CSS</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-dl-element', '&lt;dl&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-dl-element', '&lt;dl&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/lists.html#h-10.3', '&lt;dl&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_Web">Compatibilidad Web</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada con datos estructurados. Si desea contribuir a la información, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envie una petición de extración (pull request).</div>
-
-<p>{{Compat("html.elements.dl")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{HTMLElement("dt")}} element</li>
- <li>{{HTMLElement("dd")}} element</li>
-</ul>
diff --git a/files/es/web/html/elemento/dt/index.html b/files/es/web/html/elemento/dt/index.html
deleted file mode 100644
index 7cbf0c3182..0000000000
--- a/files/es/web/html/elemento/dt/index.html
+++ /dev/null
@@ -1,103 +0,0 @@
----
-title: dt
-slug: Web/HTML/Elemento/dt
-tags:
-  - Contenido agrupado HTML
-  - Definición
-  - Elemento
-  - HTML
-  - Lista de definiciones
-  - Referencia
-  - Término
-  - Término de definición
-  - dt
-  - listas
-translation_of: Web/HTML/Element/dt
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">El  <strong>elemento HTML <code>&lt;dt&gt;</code> </strong>especifica un término en una descripción o lista de definiciones, y como tal debe utilizarse dentro de un elemento {{HTMLElement("dl")}}</span> Es usualmente seguido por un elemento {{HTMLElement("dd")}}; sin embargo, múltiples elementos <code>&lt;dt&gt;</code>  en un renglón indican diferentes términos los cuales todos son definidos por el siguiente elemento {{HTMLElement("dd")}}.</p>
-
-<p>El subsecuente elemento {{HTMLElement("dd")}} (<strong>Detalles de la descripción</strong>) provee la definición u otro texto relacionado asociado con el término especificado utilizando <code>&lt;dt&gt;</code>.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/dt.html", "tabbed-standard")}}</div>
-
-<p class="hidden">La fuente para este ejemplo interactivo se encuetra almacenado en un repositorio GitHub. Si desea contribuir al proyecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a>y envíe una petición de extración (pull request).</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td>Ninguno.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido de flujo</a>, pero sin {{HTMLElement("header")}}, {{HTMLElement("footer")}}, contenido seccionado o encabezados descendientes de contenido.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de Tag</th>
-   <td>Debe tener un tag inicial. El tag final puede ser omitido si este elemento es seguido inmediatamente después por otro elemento <code>&lt;dd&gt;</code>,  o si no hay más contenido en el elemento padre.</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>Antes de un elemento {{HTMLElement("dt")}} o elemento {{HTMLElement("dd")}}, dentro de un {{HTMLElement("dl")}} o (en <a href="/es/docs/Glossary/WHATWG">WHATWG</a> HTML) un {{HTMLElement("div")}} que esta dentro de un {{HTMLElement("dl")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>Ninguno</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}} Up to Gecko 1.9.2 (Firefox 4) inclusive, Firefox implements the <a href="/es/docs/DOM/span"><code>HTMLSpanElement</code></a> interface for this element.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento solo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Para ver un ejemplo, vea el <a href="/es/docs/Web/HTML/Elemento/dl#Examples">proveído por el elemento <code>&lt;dl&gt;</code></a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-dt-element', '&lt;dt&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-dt-element', '&lt;dt&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/lists.html#h-10.3', '&lt;dt&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatiblidad es esta página es generada desde estructuras de datos. Si desea contribuir a la información, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíe su petición de extracción (pull request).</div>
-
-<p>{{Compat("html.elements.dt")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{HTMLElement("dd")}}, {{HTMLElement("dl")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/element/index.html b/files/es/web/html/elemento/element/index.html
deleted file mode 100644
index 814711131f..0000000000
--- a/files/es/web/html/elemento/element/index.html
+++ /dev/null
@@ -1,110 +0,0 @@
----
-title: <element>
-slug: Web/HTML/Elemento/element
-translation_of: Web/HTML/Element/element
----
-<div class="note">
-<p><strong>Nota:</strong> Este elemento ha sido borrado de la especificación. Mira <a href="http://lists.w3.org/Archives/Public/public-webapps/2013JulSep/0287.html">esto</a> para obtener más información desde el editor de la espeficicación.</p>
-</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El <strong>elemento <a href="/es/docs/Web/HTML">HTML</a> <code>&lt;element&gt;</code></strong> es utilizado para personalizar los elementos DOM.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido" title="HTML/Categorias_de_contenido">Categorias de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Modelo_de_contenido_transparente">Contenido transparente</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido Permitido</th>
-   <td>???</td>
-  </tr>
-  <tr>
-   <th scope="row">Etiquetas omitidas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>???</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos" name="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<p>El texto va aquí</p>
-
-<pre class="brush: html">Más texto va aquí.
-</pre>
-
-<h2 id="Especificaciones" name="Especificaciones">Especificaciones</h2>
-
-<p>El elemento <code>&lt;element&gt;</code> fue formulado en un borrador de la especificación de <a href="http://w3c.github.io/webcomponents/spec/custom/">elementos personalizados</a>, que se ha eliminado.</p>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad dee navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver También" name="Ver También">Ver También</h2>
-
-<ul>
- <li>Web components: {{HTMLElement("content")}}, {{HTMLElement("shadow")}}, {{HTMLElement("template")}}</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/elementos_títulos/index.html b/files/es/web/html/elemento/elementos_títulos/index.html
deleted file mode 100644
index be0dd6801b..0000000000
--- a/files/es/web/html/elemento/elementos_títulos/index.html
+++ /dev/null
@@ -1,240 +0,0 @@
----
-title: Elementos títulos
-slug: Web/HTML/Elemento/Elementos_títulos
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Referencia
-  - Secciones HTML
-  - Todas_las_Categorías
-  - Web
-translation_of: Web/HTML/Element/Heading_Elements
----
-<p id="Summary">Los elementos de <strong>encabezado</strong> implementan seis niveles de encabezado del documento, <code>&lt;h1&gt;</code> es el más importante, y <code>&lt;h6&gt;</code>, el menos importante. Un elemento de encabezado describe brevemente el tema de la sección que presenta. La información de encabezado puede ser usada por los agentes usuarios, por ejemplo, para construir una tabla de contenidos para un documento automáticamente.</p>
-
-<div class="note">
-<p><strong>Notas de uso:</strong></p>
-
-<ul>
- <li>No se deben usar niveles inferiores para reducir el tamaño de la fuente: use la propiedad <a href="/en-US/docs/Web/CSS">CSS</a> {{cssxref("font-size")}} para eso.</li>
- <li>Evite omitir niveles de encabezado: siempre comience con <code>&lt;h1&gt;</code>, después use <code>&lt;h2&gt;</code> y así sucesivamente.</li>
- <li>Con el elemento {{HTMLElement("section")}}, debe considerar evitar usar &lt;h1&gt; más de una vez en una página; por costumbre, se usa para mostrar el título de la página, con todos los encabezados debajo de éste comenzando con <code>&lt;h2&gt;</code>. Cuando se usan secciones, debe usarse un <code>&lt;h1&gt;</code> por sección. Véase <a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document#Definiendo_secciones_en_HTML5">Definiendo secciones</a> en <a href="/es/docs/Sections_and_Outlines_of_an_HTML5_document">Secciones y esquema de un documento HTML5</a> para más información.</li>
-</ul>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, contenido de encabezados, contenido palpable.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">Contenido textual o estático</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padres permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido dinámico</a>; no debe usarse como hijo del elemento {{HTMLElement("hgroup")}}, pues éste es obsoleto</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLHeadingElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Estos elementos incluyen los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<p>El atributo <code>align</code> es obsoleto; no debe usarse.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Todos_los_encabezados">Todos los encabezados</h3>
-
-<p>El siguiente código muestra todos los niveles de encabezado.</p>
-
-<pre class="brush: html">&lt;h1&gt;Heading level 1&lt;/h1&gt;
-&lt;h2&gt;Heading level 2&lt;/h2&gt;
-&lt;h3&gt;Heading level 3&lt;/h3&gt;
-&lt;h4&gt;Heading level 4&lt;/h4&gt;
-&lt;h5&gt;Heading level 5&lt;/h5&gt;
-&lt;h6&gt;Heading level 6&lt;/h6&gt;
-</pre>
-
-<p>Aquí está el resultado de este código:</p>
-
-<p>{{ EmbedLiveSample('Todos_los_encabezados', '280', '300', '') }}</p>
-
-<h3 id="Página_de_ejemplo">Página de ejemplo</h3>
-
-<p>El código siguiente muestra unos pocos encabezados con algo de contenido debajo de ellos.</p>
-
-<pre class="brush: html">&lt;h1&gt;Heading elements&lt;/h1&gt;
-&lt;h2&gt;Summary&lt;/h2&gt;
-&lt;p&gt;Some text here...&lt;/p&gt;
-
-&lt;h2&gt;Examples&lt;/h2&gt;
-&lt;h3&gt;Example 1&lt;/h3&gt;
-&lt;p&gt;Some text here...&lt;/p&gt;
-
-&lt;h3&gt;Example 2&lt;/h3&gt;
-&lt;p&gt;Some text here...&lt;/p&gt;
-
-&lt;h2&gt;See also&lt;/h2&gt;
-&lt;p&gt;Some text here...&lt;/p&gt;
-</pre>
-
-<p>Aquí está el resultado de este código:</p>
-
-<p>{{ EmbedLiveSample('Página_de_ejemplo', '280', '480', '') }}</p>
-
-<h2 id="Sobre_Accesibilidad">Sobre Accesibilidad</h2>
-
-<h3 id="Navegación">Navegación</h3>
-
-<p>Una forma típica de navegación que utilizan las personas no videntes es moverse a través de la pantalla con las etiquetas de encabezado. De esta forma, pueden conocer rápidamente el contenido de la página en poco tiempo; por esta razón es importante prestar mucha atención a nuestras etiquetas de encabezado y no saltearse ningún nivel o podríamos confundir a este usuario.</p>
-
-<h4 id="No_hacer">No hacer</h4>
-
-<pre class="brush: html example-bad">&lt;h1&gt;Cabecera nivel 1&lt;/h1&gt;
-&lt;h3&gt;Cabecera nivel 3&lt;/h3&gt;
-&lt;h4&gt;Cabecera nivel 4&lt;/h4&gt;
-</pre>
-
-<h4 id="Sí_hacer">Sí hacer</h4>
-
-<pre class="brush: html example-good">&lt;h1&gt;Cabecera nivel 1&lt;/h1&gt;
-&lt;h2&gt;Cabecera nivel 2&lt;/h2&gt;
-&lt;h3&gt;Cabecera nivel 3&lt;/h3&gt;
-</pre>
-
-<h4 id="Anidar">Anidar</h4>
-
-<p>Las etiquetas de cabecera pueden anidarse para generar sub-secciones en nuestros documentos. Esto beneficia la organización de la información y también ayuda a los usuarios de lectores de pantalla a conocer mejor la jerarquía de los contenidos.</p>
-
-<ol>
- <li><code>h1</code> Harry Potter
-
-  <ol>
-   <li><code>h2</code> Sinopsis</li>
-   <li><code>h2</code> Novelas
-    <ol>
-     <li><code>h3</code> Harry Potter y la Piedra Filosofal</li>
-     <li><code>h3</code> Harry Potter y la Cámara de los Secretos</li>
-     <li><code>h3</code> Harry Potter y el Prisionero de Azkaban</li>
-     <li><code>h3</code> Harry Potter y el Cáliz de Fuego</li>
-     <li><code>h3</code> Harry Potter y la Orden del Fenix</li>
-     <li><code>h3</code> Harry Potter y el Príncipe Mestizo</li>
-     <li><code>h3</code> Harry Potter y las Reliquias de la Muerte</li>
-    </ol>
-   </li>
-   <li><code>h2</code> Películas
-    <ol>
-     <li><code>h3</code> Harry Potter y la Piedra Filosofal</li>
-     <li><code>h3</code> Harry Potter y la Cámara de los Secretos</li>
-     <li><code>h3</code> Harry Potter y el Prisionero de Azkaban</li>
-     <li><code>h3</code> Harry Potter y el Cáliz de Fuego</li>
-     <li><code>h3</code> Harry Potter y la Orden del Fenix</li>
-     <li><code>h3</code> Harry Potter y el Príncipe Mestizo</li>
-     <li><code>h3</code> Harry Potter y las Reliquias de la Muerte (Parte 1)</li>
-     <li><code>h3</code> Harry Potter y las Reliquias de la Muerte (Parte 2)</li>
-    </ol>
-   </li>
-  </ol>
- </li>
-</ol>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements', '&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;, &lt;h4&gt;, &lt;h5&gt;, and &lt;h6&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements', '&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;, &lt;h4&gt;, &lt;h5&gt;, and &lt;h6&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.5.5', '&lt;h1&gt;, &lt;h2&gt;, &lt;h3&gt;, &lt;h4&gt;, &lt;h5&gt;, and &lt;h6&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{HTMLElement("p")}}</li>
- <li>{{HTMLElement("div")}}</li>
- <li>{{HTMLElement("section")}}</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/em/index.html b/files/es/web/html/elemento/em/index.html
deleted file mode 100644
index d24fa05f81..0000000000
--- a/files/es/web/html/elemento/em/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: em
-slug: Web/HTML/Elemento/em
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/em
----
-<div>{{HTMLRef}}</div>
-
-<p>El <strong>elemento HTML <code>&lt;em&gt;</code></strong> es el apropiado para marcar con énfasis las partes importantes de un texto. El elemento <code>&lt;em&gt;</code> puede ser anidado, con cada nivel de anidamiento indicando un mayor grado de énfasis.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/em.html", "tabbed-shorter")}}</div>
-
-
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a>, contenido palpable</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">Contenido textual o estático</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Tag omission</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted parents</th>
-   <td>Any element that accepts <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted ARIA roles</th>
-   <td>Any</td>
-  </tr>
-  <tr>
-   <th scope="row">DOM interface</th>
-   <td>{{domxref("HTMLElement")}} Up to Gecko 1.9.2 (Firefox 4) inclusive, Firefox implements the {{domxref("HTMLSpanElement")}} interface for this element.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Atributos" name="Atributos">Atributos</h3>
-
-<p>Este elemento solo incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval"> &lt;p&gt;
-     &lt;em&gt;El dinero&lt;/em&gt; es importante pero &lt;strong&gt;la salud&lt;/strong&gt; lo es más.
- &lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p><a href="es/HTML/Elemento/em">em</a> tiene un hermano mayor: <a href="es/HTML/Elemento/strong">strong</a>. <a href="es/HTML/Elemento/em">em</a> sirve para dar énfasis y <a href="es/HTML/Elemento/strong">strong</a> para dar mucho énfasis</p>
diff --git a/files/es/web/html/elemento/embed/index.html b/files/es/web/html/elemento/embed/index.html
deleted file mode 100644
index d489014613..0000000000
--- a/files/es/web/html/elemento/embed/index.html
+++ /dev/null
@@ -1,69 +0,0 @@
----
-title: embed
-slug: Web/HTML/Elemento/embed
-tags:
-  - HTML
-  - HTML5
-  - 'HTML:Elemento'
-  - para_revisar
-translation_of: Web/HTML/Element/embed
----
-<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Nota: este tema documenta sólo el elemento &lt;embed&gt; que se define como parte de HTML5.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">No trata las implementaciones anteriores no estandarizadas del elemento <code>&lt;embed&gt;</code>.</span></span></div>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El <em>Elemento HTML Embed </em> ( <code>&lt;embed&gt;</code> ) representa un punto de integración para una aplicación externa o de contenido interactivo (en otras palabras, un plug-in).</span></span></p>
-
-<h2 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Ninguno; es un elemento vacío.</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Debe tener una etiqueta de inicio, pero no debe tener una etiqueta de cierre.</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte <a href="/en/HTML/Content_categories#phrasing_content" title="../../../../en/HTML/Content categories#phrasing content">contenido estático</a> .</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
-   <td><a class="external" href="http://www.w3.org/TR/html5/the-iframe-element.html#the-embed-element" title="http://www.w3.org/TR/html5/the-iframe-element.html#the-embed-element"><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.8.3</span></span></a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Este elemento admite los siguientes atributos además de los <a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">atributos globales</a> .</span></span></p>
-
-<dl>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("height") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La altura del recurso mostrada en píxeles CSS.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("src") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La dirección URL del recurso que se está incrustado.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("type") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El tipo MIME que se va a usar para la selección del plug-in para crear una instancia.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("width") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El ancho del recurso mostrado en píxeles CSS.</span></span></dd>
-</dl>
-
-<h2 id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h2>
-
-<ul>
- <li><a href="/en/DOM/HTMLEmbedElement" title="en/DOM/HTMLEmbedElement"><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTMLEmbedElement</span></span></a></li>
-</ul>
-
-<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-99 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Otros elementos que se utilizan para incrustar el contenido de varios tipos incluyen {{ HTMLElement("audio") }}, {{ HTMLElement("canvas") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("math") }}, {{ HTMLElement("object") }}, {{ HTMLElement("svg") }} y  {{ HTMLElement("video") }}. </span></span></p>
-
-<p> </p>
-
-<p> </p>
-
-<p>{{ languages ( { "en": "en/HTML/Element/embed" } ) }}</p>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/etiqueta_personalizada_html5/index.html b/files/es/web/html/elemento/etiqueta_personalizada_html5/index.html
deleted file mode 100644
index e18dd89f0d..0000000000
--- a/files/es/web/html/elemento/etiqueta_personalizada_html5/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Etiqueta Personalizada HTML5
-slug: Web/HTML/Elemento/Etiqueta_Personalizada_HTML5
----
-<p>Una etiqueta personalizada sencilla, es crear una plantilla de elementos.</p>
-
-<p>Un sencillo ejemplo donde con poner la etiqueta &lt;corazon&gt; nos muetra un corazon en el documento:</p>
-
-<h2 id="corazon.js" name="corazon.js">corazon.js</h2>
-
-<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
-
-<pre class="brush: js">function ini(){
-document.createElement('corazon');//creamos el elemento corazon
-var corazon = document.getElementsByTagName('corazon');//llamamos todos los elemento corazon del documento
-  var i;
-  for (i = 0; i &lt; corazon.length; i++) {//ejecuta acciones para esos elementos
-//creamos estilos para nuetras etiquetas
-    corazon[i].style.backgroundImage= "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAACaElEQVR4nO2by7WCMBCGKYECyJgSLIESLCEnwT0l0IElWIIlWIIlsAxhkxLuXZh45YrKI+QF/zmznvn+TAYYj0myadOmTSMkMUl5VuQN0JIDrVooTmLHLhxoxRElPCtyjgk2nZdjgnlW5BxRcs/Lzi2wMwdaNUBLnhW56ZzdArIib4GdBTApgP0MiBtHlMzJKTFJBWIHAew2MOdPC+wsEDsYwlbgiF2HFtBfVHEaC95CcRphdu8BtPi4nwz+VMRk8H9RDymoxcf9mBMf0hGT4MWOXQzCP6IBWr7L2wAtZ576226QmKSD4DkmWACrl4D/dCocaLVkTgFMfh3OEpN07n0fHE+DiiNKrOQEVn80QE15G4XcOwEf9+rOL9H2/TkRu/bCq8eNNXgVUhgceEPj5fEsMUldFOIwZMcANX1dF2W3C4BWf3ff1uDzK+5doIaQ62LcdAEmeJXtr6MBWiZLvfEFETt2Wev911EnYuHXXs9DJsLiW5iPsfYOqNc+A27WP4B8ihaxa2J46xNUtFCc9IeQ82JcxGOTLNY5CG9Pi5D1XYPO16C6BmvqAvmyJLW4l3MendPvrMXWsRV6vyJXVyHmV2P59ccZ9btAjCZ8h388FeLbEsnRP5hGZMJ4+IhMmA4fgQnz4QM2wRx8gCaYhw/IhOXgAzBheXiPTbAH76EJ9uE9MsEdvAcmuIfXcmCCP/BaFk3wD17Lggn+wmstaIL/8FoLmBAOvJZBE8KD1zJgQrjwWjNMCB9ea4IJ8cBrjTAhPnitASbEC6/1wYT44bV6TFgPvBbHBHOgFQdazfpz06ZNmzbN0C97EM/d8hW+4gAAAABJRU5ErkJggg==')";
-    corazon[i].style.position="relative";
-    corazon[i].style.display="block";
-    corazon[i].style.width="64px";
-    corazon[i].style.height="64px";
-  }
-}
-window.addEventListener('load',ini,false);//ejecuta la funcion ini al cargar el documento</pre>
-
-<p>Ahora solo llamamos a nuestro archivo corazon.js desde nuetro html y podremos usar libremente nuetra etiqueta &lt;corazon&gt; con la cual nos mostrara un corazon.</p>
-
-<h2 id="index.html" name="index.html">index.html</h2>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<p>&lt;!DOCTYPE html&gt;<br>
- &lt;html&gt;<br>
-   &lt;head&gt;<br>
-     &lt;meta charset="utf-8"&gt;<br>
-     &lt;title&gt;Mi Etiqueta&lt;/title&gt;<br>
-     &lt;script src="corazon.js"  type="text/javascript"&gt;&lt;/script&gt;<br>
-   &lt;/head&gt;<br>
-   &lt;body&gt;<br>
-     &lt;corazon&gt;&lt;/corazon&gt;<br>
-   &lt;/body&gt;<br>
- &lt;/html&gt;</p>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/fieldset/index.html b/files/es/web/html/elemento/fieldset/index.html
deleted file mode 100644
index bb29878206..0000000000
--- a/files/es/web/html/elemento/fieldset/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: fieldset
-slug: Web/HTML/Elemento/fieldset
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/fieldset
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <a href="/es/HTML/Elemento/fieldset" title="es/HTML/Elemento/fieldset">fieldset</a> (grupo de campos) permite organizar en grupos los campos de un formulario.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;fieldset&gt; y &lt;/fieldset&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">Elemento en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: un elemento <a href="/es/HTML/Elemento/legend" title="es/HTML/Elemento/legend">legend</a> (opcional), y despues cero o más elementos <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> o <a href="/es/HTML/Elemento/Tipos_de_elementos#en_linea" title="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>lista de clases separadas por espacios</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>uno de los siguientes:"ltr" o "rtl"</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre>&lt;form&gt;
-
- &lt;fieldset&gt;
-  &lt;legend&gt;Información Personal&lt;/legend&gt;
-  Nombre: &lt;input name='nombre' type='text' tabindex='1'&gt;
-  Apellidos: &lt;input name='apellidos' type='text' tabindex='2'&gt;
- &lt;/fieldset&gt;
-
- &lt;fieldset&gt;
-  &lt;legend&gt;edad&lt;/legend&gt;
-  &lt;input type='checkbox' tabindex='20'
-            name='edad' value='20-39' &gt; 20-39
-  &lt;input type='checkbox' tabindex='21'
-            name='edad' value='40-59' &gt; 40-59
-  &lt;input type='checkbox' tabindex='22'
-            name='edad' value='60-79' &gt; 60-79
- &lt;/fieldset&gt;
-
-&lt;/form&gt;
-</pre>
diff --git a/files/es/web/html/elemento/figcaption/index.html b/files/es/web/html/elemento/figcaption/index.html
deleted file mode 100644
index b212c17632..0000000000
--- a/files/es/web/html/elemento/figcaption/index.html
+++ /dev/null
@@ -1,90 +0,0 @@
----
-title: <figcaption>
-slug: Web/HTML/Elemento/figcaption
-tags:
-  - Elemento
-  - Elementos de agrupación de contenido en HTML
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Element/figcaption
----
-<p>{{HTMLRef}}</p>
-
-<p>El elemento <strong>HTML <code>&lt;figcaption&gt;</code>  </strong>representa un subtítulo o leyenda asociado al contenido del elemento padre {{HTMLElement("figure")}}, pudiendo ser colocado como primer o último hijo. Es importante destacar que el elemento <strong><code>&lt;figcaption&gt;</code></strong> es opcional.</p>
-
-<p>{{EmbedInteractiveExample("pages/tabbed/figcaption.html","tabbed-shorter")}}</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
-   <td>Ninguna</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido Permitido</th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>En un  elemento {{HTMLElement("figure")}} el elemento <code>&lt;figcaption&gt;</code> debe ser el primero o el último hijo.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Contento en el que puede ser usado</th>
-   <td>Como the first o last child de un <strong>&lt;figure&gt;</strong> element</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento sólo incluye los </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Para ejemplos con <code>&lt;figcaption&gt;</code>, por favor ver la página {{HTMLElement("figure")}}.</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('HTML WHATWG', 'grouping-content.html#the-figcaption-element', '&lt;figcaption&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-figcaption-element', '&lt;figcaption&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<div class="hidden">
-<p>The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-</div>
-
-<p>{{Compat("html.elements.figcaption")}}</p>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li>El elemento {{HTMLElement("figure")}}.</li>
-</ul>
diff --git a/files/es/web/html/elemento/figure/index.html b/files/es/web/html/elemento/figure/index.html
deleted file mode 100644
index 1ad3d12a07..0000000000
--- a/files/es/web/html/elemento/figure/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: figure
-slug: Web/HTML/Elemento/figure
-tags:
-  - HTML
-  - HTML5
-  - 'HTML:Elemento'
-  - figure
-  - para_revisar
-translation_of: Web/HTML/Element/figure
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El <em> elemento HTML</em> <span style="font-family: Courier New;">&lt;figure&gt;</span> representa contenido independiente, a menudo con un título.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si bien se relaciona con el flujo principal, su posición es independiente de éste.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por lo general, se trata de una imagen, una ilustración, un diagrama, un fragmento de código, o un esquema al que se hace referencia en el texto principal, pero que se puede mover a otra página o a un apéndice sin que afecte al flujo principal.</span></span></p>
-
-<div class="note">
-<p><em><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Notas de uso:</span></span> </em></p>
-
-<ul>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Al ser una <a href="/es/Secciones_y_esquema_de_un_documento_HTML_5#Seccionador_ra.c3.adz" title="https://developer.mozilla.org/es/Secciones_y_esquema_de_un_documento_HTML_5#Seccionador_ra.c3.adz">seccionador raíz</a>, el esbozo del contenido del elemento <span style="font-family: Courier New;">&lt;figure&gt;</span> está excluido del esbozo principal del documento.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Un título puede estar asociado con el elemento <span style="font-family: Courier New;">&lt;figure&gt;</span> mediante la inserción de un {{ HTMLElement ("figcaption") }} en su interior (como el primero o el último hijo).</span></span></li>
-</ul>
-</div>
-
-<h3 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h3>
-
-<table class="standard-table" style="height: 117px; width: 1125px;">
- <tbody>
-  <tr>
-   <th><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Tipo</span></span></th>
-   <th><a><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Seccionador raíz</span></span></a></th>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un elemento {{ HTMLElement ("figcaption") }}, seguido por <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content"> contenido dinámico</a> , o contenido dinámico seguido por un elemento{{ HTMLElement ("figcaption") }}.</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Ninguna, tanto la etiqueta inicial como la etiqueta de cierre son obligatorias</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte elementos dinámicos.</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
-   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-mark-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-mark-element"><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.5.11</span></span></a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento no tiene atributos que no sean los <a href="/en/HTML/Global_attributes" title="../../../../en/HTML/global attributes">atributos globales</a>, comunes a todos los elementos.</span></span></p>
-
-<h3 class="editable" id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">Este elemento implementa la interfaz </span></span><code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">.</span></span></p>
-
-<h3 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h3>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento {{ HTMLElement ("figcaption") }}.</span></span></p>
diff --git a/files/es/web/html/elemento/font/index.html b/files/es/web/html/elemento/font/index.html
deleted file mode 100644
index e1020b3d95..0000000000
--- a/files/es/web/html/elemento/font/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: font
-slug: Web/HTML/Elemento/font
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/font
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>font</strong> -<em>fuente</em> . Indica el tamaño, color, o fuente del texto que contiene.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;font&gt; y &lt;/font&gt; (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">desaprobado</a>.
- <dl>
-  <dd>En un doctype transicional está definido como un elemento <a href="es/HTML/Elemento/Tipos_de_elementos#especial">especial</a> y por lo tanto <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En línea.</dd>
- <dd><strong>Puede contener</strong>: Texto, y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea </a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-size-FONT"><span style="color: green;">size</span></a></td>
-   <td>Tamaño de la fuente. Según una tabla del 1 al 7.</td>
-   <td>Un número entero (ej. 1), o un valor incremental (ej. +1). <s>Por defecto:</s> debe indicarlo el autor.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-color-FONT"><span style="color: green;">color</span></a></td>
-   <td>El color del texto.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.5">color RGB</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#adef-face-FONT"><span style="color: green;">face</span></a></td>
-   <td>Especifica la/s fuentes para el texto.</td>
-   <td>Lista de nombres de fuentes separadas por coma. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_ejemplo_simple" name="Un_ejemplo_simple">Un ejemplo simple</h4>
-
-<p>código:</p>
-
-<pre class="eval">&lt;p&gt;
- Texto normal y ...
- &lt;<strong>font</strong> size="5" color="#0000ff"&gt; Texto distinto. &lt;/<strong>font</strong>&gt;
-&lt;/p&gt;
-</pre>
-
-<p>Resultado:</p>
-
-<div style="border: solid silver 1px;">
-<p>Texto normal y ... <font color="#0000ff" size="5"> Texto distinto. </font></p>
-</div>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-FONT"><strong>font</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-font">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/footer/index.html b/files/es/web/html/elemento/footer/index.html
deleted file mode 100644
index fb29106abc..0000000000
--- a/files/es/web/html/elemento/footer/index.html
+++ /dev/null
@@ -1,71 +0,0 @@
----
-title: footer
-slug: Web/HTML/Elemento/footer
-tags:
-  - HTML5
-  - footer
-  - para_revisar
-translation_of: Web/HTML/Element/footer
----
-<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">El <em>Elemento </em><em>HTML Footer</em> (<span style="font-family: 'Courier New';">&lt;footer&gt;</span>) representa un pie de página para el contenido de sección más cercano o el elemento  <a href="/en/Sections_and_Outlines_of_an_HTML5_document#sectioning_root" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">raíz de sección</a> (p.e, su ancestro mas cercano <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/article" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;article&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/aside" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;aside&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/nav" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;nav&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/section" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;section&gt;</a></code>,<code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/blockquote" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;blockquote&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/body" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;body&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/details" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;details&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/fieldset" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;fieldset&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/figure" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;figure&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/td" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;td&gt;</a></code>). Un pie de página típicamente contiene información acerca de el autor de la sección, datos de derechos de autor o enlaces a documentos relacionados.</p>
-<p>&lt;meta http-equiv="content-type" content="text/html; charset=utf-8"/&gt;</p>
-<div class="note" style="margin-bottom: 1.286em; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-width: initial; border-top-width: 1px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px; padding-top: 0.75em; padding-right: 15px; padding-bottom: 0.75em; padding-left: 15px; background-clip: initial; background-color: rgb(250, 249, 226); color: rgb(93, 86, 54);">
- <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.75em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;"><strong>Notas de uso:</strong></p>
- <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 22px; list-style-type: disc;">
-  <li>Encierra la información acerca del autor en un elemento <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/address" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;address&gt;</a></code> que puede ser incluido dentro del elemento <span style="font-family: 'Courier New';">&lt;footer&gt;.</span></li>
-  <li>El  elemento <span style="font-family: 'Courier New';">&lt;footer&gt;</span> no es contenido de sección y en consecuencia no introduce una nueva sección en el <a href="/en/Sections_and_Outlines_of_an_HTML5_document" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">esquema</a>.</li>
- </ul>
-</div>
-<div id="section_1">
- <h3 class="editable" id="Contexto_de_uso" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Contexto de uso</span></h3>
- <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
-  <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
- <table class="fullwidth-table" style="border-collapse: collapse; margin-top: 0px; margin-right: 0px; margin-bottom: 1.5em; margin-left: 0px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; width: 1125px; background-clip: initial; background-color: rgb(255, 255, 255); height: 117px;">
-  <tbody>
-   <tr>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Contenido Permitido</td>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;"><a href="/en/HTML/Content_categories#flow_content" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">Contenido de flujo</a>, pero sin descendientes  <span style="font-family: 'Courier New';">&lt;footer&gt;</span> o <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/header" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;header&gt;</a></code>.</td>
-   </tr>
-   <tr>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Omisión de Etiqueta</td>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Ninguna, tanto la etiqueta de inicio como la de cierre son obligatorias.</td>
-   </tr>
-   <tr>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Elementos ancestros permitidos</td>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">
-     <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">contenido de flujo</a>. Note que un elemento <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;">&lt;footer&gt;</code> no debe ser un descendiente de los elementos <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/address" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;address&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/header" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;header&gt;</a></code> o de otro elemento <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;">&lt;footer&gt;</code>.</p>
-    </td>
-   </tr>
-   <tr>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;">Documento normativo</td>
-    <td style="padding-top: 5px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; text-align: left; vertical-align: top;"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-footer-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-footer-element">HTML5, sección 4.4.9</a></td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="section_2">
- <h3 class="editable" id="Atributos" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Atributos</span></h3>
- <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
-  <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
- <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Este elemento no tiene otros atributos adicionales a los <a class="new " href="/en/HTML/global_attributes" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">atributos globales</a>, comunes a todos los elementos.</p>
- <div id="section_3">
-  <div id="section_3">
-   <div id="section_3">
-    <h3 class="editable" id="Interfaz_DOM" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Interfaz DOM</span></h3>
-    <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
-     <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
-    <p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Este elemento implementa la interfaz <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a href="/en/DOM/element" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">HTMLElement</a></code>.</p>
-   </div>
-   <div id="section_4">
-    <h3 class="editable" id="Vea_también" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0.8em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; font-size: 1.396em; font-family: Georgia, Times, 'Times New Roman', serif; border-bottom-width: 1px; border-bottom-style: solid;"><span>Vea también</span></h3>
-    <div class="editIcon" style="display: inline; margin-left: 4px; font-size: inherit; font-weight: normal; position: relative;">
-     <a href="/es/HTML/Elemento/footer#" style="color: rgb(51, 102, 153); text-decoration: none;" title="Editar sección"><span class="icon" style="height: 16px;"><img alt="Editar sección" class="sectionedit" src="/skins/common/icons/icon-trans.gif"></span></a></div>
-    <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.286em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 22px; list-style-type: disc;">
-     <li>Otros elementos relacionados con secciones: <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/body" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;body&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/nav" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;nav&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/article" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;article&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/aside" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;aside&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h1" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h1&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h2" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h2&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h3" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h3&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h4" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h4&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h5" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h5&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/h6" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;h6&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/hgroup" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;hgroup&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/header" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;header&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/section" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;section&gt;</a></code>, <code style="font-style: inherit; font-weight: inherit; font: normal normal normal 100%/normal 'Courier New', 'Andale Mono', monospace;"><a class="new" href="/es/HTML/Element/address" rel="internal" style="color: rgb(153, 0, 0); text-decoration: none;">&lt;address&gt;</a></code>;</li>
-     <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" rel="internal" style="color: rgb(51, 102, 153); text-decoration: none;">Secciones y esquemas de un documento HTML5</a>.</li>
-    </ul>
-   </div>
-  </div>
- </div>
-</div>
-<p> </p>
diff --git a/files/es/web/html/elemento/form/index.html b/files/es/web/html/elemento/form/index.html
deleted file mode 100644
index d0ade4348c..0000000000
--- a/files/es/web/html/elemento/form/index.html
+++ /dev/null
@@ -1,198 +0,0 @@
----
-title: form
-slug: Web/HTML/Elemento/form
-translation_of: Web/HTML/Element/form
----
-<h2 id="Resumen">Resumen</h2>
-<p>El elemento HTML form (<code>&lt;form&gt;</code>) representa una sección de un documento que contiene controles interactivos que permiten a un usuario enviar información a un servidor web.</p>
-<p>Es posible usar las pseudo-clasess de CSS <code><a href="/es/CSS/%3Avalid" rel="custom">:valid</a></code> e <code><a href="/es/CSS/%3Ainvalid" rel="custom">:invalid</a></code>  para darle estilos a un elemento form.</p>
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-<table class="standard-table">
-  <tbody>
-    <tr>
-      <td>Categorías de contenido</td>
-      <td><a href="/en/HTML/Content_categories#flow_content" title="/en/HTML/Content_categories#flow_content">Contenido dinámico</a></td>
-    </tr>
-    <tr>
-      <td>Contenido permitido</td>
-      <td><a href="/en/HTML/Content_categories#flow_content" title="/en/HTML/Content_categories#flow_content">Contenido dinámico</a>, pero sin contener elementos <code>&lt;form&gt;</code></td>
-    </tr>
-    <tr>
-      <td>Omisión de etiquetas</td>
-      <td>Ninguna, ambas, la etiqueta de apertura y cierre deben estar presentes</td>
-    </tr>
-    <tr>
-      <td>Normative document</td>
-      <td><a class="external" href="http://www.w3.org/TR/html5/forms.html#the-form-element" title="http://www.w3.org/TR/html5/forms.html#the-form-element">HTML5, section 4.10.3</a> (<a class="external" href="http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html#h-17.3" title="http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html#h-17.3">HTML4.01, section 17.3</a>)</td>
-    </tr>
-  </tbody>
-</table>
-<h2 id="Atributos">Atributos</h2>
-<p>Como cualquier otro elemento HTML, este elemento soporta <a href="/en/HTML/Global_attributes" title="/en/HTML/Global_attributes">atributos globales</a></p>
-<dl>
-  <dt>
-    {{ htmlattrdef("accept") }} {{ HTMLVersionInline(4) }} {{ obsolete_inline() }}</dt>
-  <dd>
-    Una lista separada por comas de los tipos de contenido que el servidor acepta.<br>
-    <div class="note">
-      <p><strong>Nota de uso: </strong>este atributo ha sido removido en HTML5 y no debe ser usado. En su lugar, usar el atributo <strong><a href="/es/HTML/Element/Input#attr-accept" title="/en/HTML/Element/Input#attr-accept">accept</a></strong> del elemento específico {{ HTMLElement("input") }}.</p>
-    </div>
-  </dd>
-  <dt>
-    {{ htmlattrdef("accept-charset") }}</dt>
-  <dd>
-    Una lista de codificación de caracteres que el servidor acepta. La lista puede ser delimitada por espacios o comas. El navegador los usa en el orden en que cada uno son listados. Los valores por defecto es la cadena reservada "UNKNOWN", en tal caso la codificación corresponde a la codificación del documento conteniendo el elemento form.<br>
-    <p>HTML 4: En versiones anteriores de HTML, las diferentes codificaciones de caracteres pueden ser delimitadas por espacios o comas. Este no es más el caso en HTML5, donde sólo los espacios son correctos.</p>
-  </dd>
-  <dt>
-    {{ htmlattrdef("action") }}</dt>
-  <dd>
-    La URI de un programa que procesa la información enviada por medio del formulario. Este valor puede ser sobreescrito por un atributo {{ htmlattrxref("formaction", "button") }} en un {{ HTMLElement("button") }} o en el elemento{{ HTMLElement("input") }}.</dd>
-  <dt>
-    {{ htmlattrdef("autocomplete") }} {{ HTMLVersionInline(5) }}</dt>
-  <dd>
-    Indica cuales de los controles en este formulario puede tener sus valores automáticamente completados por el navegador. Esta configuración puede ser sobreescrita por un atributo <code>autocomplete</code> en un elemento que pertenezca al formulario:
-    <ul>
-      <li><span style="font-family: Courier New;">off</span>: El usuario debe ingresar explicitamente cada valor dentro de cada campo por cada uso, o el documento provee su propio método de autocompletado; el navegador no autocompleta las entradas.</li>
-      <li><span style="font-family: Courier New;">on</span>: El navegador puede completar automáticamente valores basados en lo que el usuario ha ingresado durante entradas previas al formulario.</li>
-    </ul>
-    <div class="note">
-      <p><strong>Nota:</strong> si se establece <code>autocomplete</code> a un valor de <code>off</code> en un formulario porque el documento provee su propio auto-completado entonces también se debería establecer  <code>autocomplete</code> al valor <code>off</code> para cada uno de los elementos de formulario <code>input</code> que el documento pueda autocompletar {{ anch("Notas para Google Chrome") }}.</p>
-    </div>
-  </dd>
-  <dt>
-    {{ htmlattrdef("enctype") }}</dt>
-  <dd>
-    Cuando el valor del atributo <code>method</code> es <span style="font-family: Courier New;">post</span>, este atributo es el  <a href="http://en.wikipedia.org/wiki/Mime_type" title="http://en.wikipedia.org/wiki/Mime_type">tipo MIME</a> del contenido que es usado para enviar el formulario al servidor.</dd>
-  <dd>
-    Los posibles valores son:
-    <ul>
-      <li><span style="font-family: Courier New;">application/x-www-form-urlencoded</span>: El valor por defecto si un atributo no está especificado.</li>
-      <li><span style="font-family: Courier New;">multipart/form-data</span>: Usar este valor si se está usando el elemento {{ HTMLElement("input") }} con el atributo <code>type</code> ajustado a "file".</li>
-      <li><span style="font-family: Courier New;">text/plain (HTML5)</span></li>
-    </ul>
-    <p>Este valor puede ser sobreescrito por un atributo{{ htmlattrxref("formenctype", "button") }}en un {{ HTMLElement("button") }} o un elemento {{ HTMLElement("input") }}.</p>
-  </dd>
-  <dt>
-    {{ htmlattrdef("method") }}</dt>
-  <dd>
-    El método <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616.html" title="http://www.w3.org/Protocols/rfc2616/rfc2616.html">HTTP</a> que el navegador usa para enviar el formulario. Valores posibles son:
-    <ul>
-      <li><span style="font-family: Courier New;">post</span>: Corresponde al <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.5" title="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.5">método POST</a> HTTP ; los datos del formulario son incluidos en el cuerpo del formulario y son enviados al servidor.</li>
-      <li><span style="font-family: Courier New;">get</span>: Corresponde al <a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.3" title="http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html#sec9.3">método GET</a> HTTP; los datos del formulario son adjuntados a la URI del atributo  <code>action</code> , con un '?' como separador,  y la URI resultante es enviada al servidor. Use este método cuando el formulario no tiene efectos secundarios y contiene solo caracteres ASCII.</li>
-    </ul>
-    <p>Este valor puede ser sobreescrito por un atributo {{ htmlattrxref("formmethod", "button") }} en un  {{ HTMLElement("button") }} o elemento {{ HTMLElement("input") }}.</p>
-  </dd>
-  <dt>
-    {{ htmlattrdef("name") }}</dt>
-  <dd>
-    El nombre del formulario. En HTML4 ha quedado en desuso (debe usarse un <span style="font-family: Courier New;">id</span> en su lugar). Debe ser único entre los formularios en un documento y no una cadena vacia en HTML5.</dd>
-  <dt>
-    {{ htmlattrdef("novalidate") }} {{ HTMLVersionInline(5) }}</dt>
-  <dd>
-    Este atributo booleano indica que el formulario no es validado cuando es enviado. Si el atributo no existe {{ htmlattrxref("formnovalidate", "button") }} en un {{ HTMLElement("button") }} o en un elemento  {{ HTMLElement("input") }} que pertenece al formulario.</dd>
-  <dt>
-    {{ htmlattrdef("target") }}</dt>
-  <dd>
-    Un nombre o keyword indicando donde mostrar la respuesta que es recibida después de enviar el formulario. En HTML 4, este es el nombre de, o una palabra clave, para un marco. En HTML5, es un nombre de, o palabra clave para, un contexto de navegación (por ejemplo, tab, window o marco en línea). Las siguientes palabras clave tienen significados especiales:
-    <ul>
-      <li><span style="font-family: Courier New;">_self</span>: Carga la respuesta dentro del mismo frame HTML 4 (o en HTML5, contexto de navegación) como el marco actual. Este valor es por defecto si el atributo no es especificado.</li>
-      <li><span style="font-family: Courier New;">_blank</span>: Carga la respuesta dentro de una nueva ventana sin nombre en HTML 4 o un contexto de navegación en HTML5.</li>
-      <li><span style="font-family: Courier New;">_parent</span>: Carga la respuesta en el marco padre del marco actual en HTML 4 o en el contexto de navegación padre del marco actual en HTML5. Si no hay marco padre, esta opción se comporta de la misma manera que <span style="font-family: Courier New;">_self</span>.</li>
-      <li><span style="font-family: Courier New;">_top</span>: HTML 4: Carga la respuesta en toda la ventana original, cancelando otros marcos.  HTML5: Carga la respuesta en el contexto de navegación de más alto nivel (esto es, el contexto de navegación que es ancestro del actual, y no tiene padre). Si no hay padre, esta opción se comporta igual que <span style="font-family: Courier New;">_self</span>.</li>
-    </ul>
-    <p>HTML5: Este valor puede ser sobreescrito por un atributo {{ htmlattrxref("formtarget", "button") }} en un elemento {{ HTMLElement("button") }} o{{ HTMLElement("input") }}.</p>
-  </dd>
-</dl>
-<h2 id="Interfaz_DOM">Interfaz DOM</h2>
-<p>Este elemento implementa la interfaz <code><a href="/es/DOM/HTMLFormElement" title="en/DOM/form">HTMLFormElement</a></code>.</p>
-<h2 id="Ejemplos">Ejemplos</h2>
-<pre class="brush: html">&lt;!-- Formulario simple que enviará una petición GET --&gt;
-&lt;form action=""&gt;
-  &lt;label for="GET-name"&gt;Nombre:&lt;/label&gt;
-  &lt;input id="GET-name" type="text" name="name"&gt;
-  &lt;input type="submit" value="Save"&gt;
-&lt;/form&gt;
-
-&lt;!-- Formulario simple que enviará una petición POST --&gt;
-&lt;form action="" method="post"&gt;
-  &lt;label for="POST-name"&gt;Nombre:&lt;/label&gt;
-  &lt;input id="POST-name" type="text" name="name"&gt;
-  &lt;input type="submit" value="Save"&gt;
-&lt;/form&gt;
-
-&lt;!-- Formulario con conjunto de campos, leyenda y etiqueta --&gt;
-&lt;form action="" method="post"&gt;
-  &lt;fieldset&gt;
-    &lt;legend&gt;Título&lt;/legend&gt;
-    &lt;input type="radio" name="radio" id="radio"&gt; &lt;label for="radio"&gt;Clic aquí&lt;/label&gt;
-  &lt;/fieldset&gt;
-&lt;/form&gt;
-</pre>
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-<p>{{ CompatibilityTable() }}</p>
-<div id="compat-desktop">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Característica</th>
-        <th>Chrome</th>
-        <th>Firefox (Gecko)</th>
-        <th>Internet Explorer</th>
-        <th>Opera</th>
-        <th>Safari</th>
-      </tr>
-      <tr>
-        <td>Soporte básico</td>
-        <td>1.0</td>
-        <td>{{ CompatGeckoDesktop("1.0") }}</td>
-        <td>{{ CompatVersionUnknown() }}</td>
-        <td>{{ CompatVersionUnknown() }}</td>
-        <td>{{ CompatVersionUnknown() }}</td>
-      </tr>
-      <tr>
-        <td>atributo <code>novalidate</code></td>
-        <td>1.0</td>
-        <td>{{ CompatGeckoDesktop("2.0") }}</td>
-        <td>{{ CompatNo() }}</td>
-        <td>{{ CompatUnknown() }}</td>
-        <td>{{ CompatUnknown() }}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<div id="compat-mobile">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Característica</th>
-        <th>Android</th>
-        <th>Firefox Mobile (Gecko)</th>
-        <th>IE Mobile</th>
-        <th>Opera Mobile</th>
-        <th>Safari Mobile</th>
-      </tr>
-      <tr>
-        <td>Soporte básico</td>
-        <td>{{ CompatVersionUnknown() }}</td>
-        <td>{{ CompatGeckoMobile("1.0") }}</td>
-        <td>{{ CompatVersionUnknown() }}</td>
-        <td>{{ CompatVersionUnknown() }}</td>
-        <td>{{ CompatVersionUnknown() }}</td>
-      </tr>
-      <tr>
-        <td>atributo <code>novalidate</code></td>
-        <td>{{ CompatUnknown() }}</td>
-        <td>{{ CompatGeckoMobile("2.0") }}</td>
-        <td>{{ CompatUnknown() }}</td>
-        <td>{{ CompatUnknown() }}</td>
-        <td>{{ CompatUnknown() }}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<p>Notas para Google Chrome</p>
-<p>La interfaz de usuario para peticiones auto-complete en Google Chrome varía dependiendo de si <code>autocomplete</code> está establecido en <code>off</code> en elementos <code>input</code> así como su formulario. Específicamente, cuando un formulario tiene <code>autocomplete</code> establecido en <code>off</code> y sus campos <code>autocomplete</code> de sus elementos input <strong>no</strong> están establecidos, entonces si el usuario pregunta por sugerencias de autocompletado para el elemento input, Chrome podrá mostrar un mensaje diciendo "El autocompletado ha sido desactivado para este formulario." Por otro lado, si el formulario y el elemento input tienen <code>autocomplete</code> establecido como <code>off</code>, el navegador no mostrará este mensaje. Por esta razón, debe establecer <code>autocomplete</code> en <code>off</code> para cada input que tiene autocompletado personalizado.</p>
-<h2 id="Consulte_también">Consulte también</h2>
-<p>Otros elementos que son usados para crear formularios: {{ HTMLElement("button") }}, {{ HTMLElement("datalist") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }},{{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}.</p>
-<p>{{ languages( { "fr": "fr/HTML/Element/Form" } ) }}</p>
diff --git a/files/es/web/html/elemento/frame/index.html b/files/es/web/html/elemento/frame/index.html
deleted file mode 100644
index 21df468c42..0000000000
--- a/files/es/web/html/elemento/frame/index.html
+++ /dev/null
@@ -1,167 +0,0 @@
----
-title: frame
-slug: Web/HTML/Elemento/frame
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/frame
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>frame</strong> -<em>marcos</em> . Define la organización de los marcos dentro de la ventana del usuario.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;frame&gt;</code> (solo tiene una).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#paramarcos">para marcos</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: .</dd>
- <dd><strong>Puede contener</strong>: Nada.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-longdesc-FRAME"><span style="color: green;">longdesc </span></a></td>
-   <td>Permite especificar un enlace a una descripción detallada del marco. Inportante para la <a href="es/Accesibilidad">accesibilidad</a>.</td>
-   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Por defecto: lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-name-FRAME"><span style="color: green;">name </span></a></td>
-   <td>Especifica un nombre para el marco, Esto permite usarlo <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#h-16.3">como destino</a> de los enlaces.</td>
-   <td>. Por defecto: . lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-src-FRAME"><span style="color: green;">src </span></a></td>
-   <td>Especifica la localización de los contenidos iniciales del marco.</td>
-   <td>Una dirección <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.4">URI</a>. Por defecto: lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-frameborder"><span style="color: green;">frameborder </span></a></td>
-   <td>Indica si el marco tendrá o no borde.</td>
-   <td>Uno de los siguientes: '1' o '0'. Por defecto: '1'.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-marginwidth"><span style="color: green;">marginwidth </span></a></td>
-   <td>Indica el margen izquierdo y derecho entre contenido y borde.</td>
-   <td>Una cantidad de píxeles (cero o más). Por defecto: lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-marginheight"><span style="color: green;">marginheight </span></a></td>
-   <td>Indica el margen superior e inferior entre contenido y borde.</td>
-   <td>Una cantidad de píxeles (cero o más). Por defecto: lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-noresize"><span style="color: green;">noresize </span></a></td>
-   <td>Hace que la ventana del marco no sea redimensionable.</td>
-   <td>'noresize'. Por defecto: lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-scrolling"><span style="color: green;">scrolling </span></a></td>
-   <td>Indica si el marco debe tener o no barra de desplazamiento (scroll).</td>
-   <td>Uno de los sigientes: 'yes', 'no', o 'auto'. Por defecto: 'auto'.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_documento_con_marcos" name="Un_documento_con_marcos">Un documento con marcos</h4>
-
-<p>código:</p>
-
-<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
-  "<a class="external" href="http://www.w3.org/TR/html4/frameset.dtd" rel="freelink">http://www.w3.org/TR/html4/frameset.dtd</a>"&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;title&gt;Un documento simple con marcos&lt;/title&gt;
-&lt;/head&gt;
-&lt;frameset rows="20%,80%"&gt;
- &lt;frameset cols="20%, 80%"&gt;
-   &lt;<strong>frame</strong> src="<a class="external" href="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png" rel="freelink">http://developer.mozilla.org/wiki-im...irefoxlogo.png</a>"&gt;
-   &lt;<strong>frame</strong> src="<a class="external" href="http://html.conclase.net/w3c/html401-es/sgml/loosedtd.html#frame" rel="freelink">http://html.conclase.net/w3c/html401...dtd.html#frame</a>"&gt;
- &lt;/frameset&gt;
- &lt;<strong>frame</strong> src="<a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAME" rel="freelink">http://html.conclase.net/w3c/html401...tml#edef-FRAME</a>"&gt;
-&lt;/frameset&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAME"><strong>frame</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-frame">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/frameset/index.html b/files/es/web/html/elemento/frameset/index.html
deleted file mode 100644
index cf90335bc6..0000000000
--- a/files/es/web/html/elemento/frameset/index.html
+++ /dev/null
@@ -1,157 +0,0 @@
----
-title: frameset
-slug: Web/HTML/Elemento/frameset
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/frameset
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>frameset</strong> -<em>conjunto de marcos</em> . Define la organización de los marcos dentro de la ventana del usuario.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;frameset&gt;</code> y <code>&lt;/frameset&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#paramarcos">para marcos</a>.
- <dl>
-  <dd>Con un doctype para marcos está definido como contenido de html.</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: .</dd>
- <dd><strong>Puede y debe contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/frameset">frameset</a> y <a href="es/HTML/Elemento/frame">frame</a>. además puede contener un elemento <a href="es/HTML/Elemento/noframes">noframes</a>.</dd>
- <dd><strong>Debe ser contenido por</strong>: Elementos <a href="es/HTML/Elemento/html">html</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-rows-FRAMESET"><span style="color: green;">rows </span></a></td>
-   <td>Asigna la disposición horizontal de los marcos.</td>
-   <td>Lista de <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.6">longitudes</a> separadas por coma, pueden espresarse en píxeles, porcentajes o de forma relativa. Por defecto: 100% (una fila), lo fija el navegador..</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#adef-cols-FRAMESET"><span style="color: green;">cols </span></a></td>
-   <td>Asigna la disposición horizontal de los marcos.</td>
-   <td>Lista de <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#h-6.6">longitudes</a> separadas por coma, pueden espresarse en píxeles, porcentajes o de forma relativa. Por defecto: 100% (una columna). lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_documento_con_marcos" name="Un_documento_con_marcos">Un documento con marcos</h4>
-
-<p>código:</p>
-
-<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
-  "<a class="external" href="http://www.w3.org/TR/html4/frameset.dtd" rel="freelink">http://www.w3.org/TR/html4/frameset.dtd</a>"&gt;
-&lt;html&gt;
-&lt;head&gt;
-&lt;title&gt;Un documento simple con marcos&lt;/title&gt;
-&lt;/head&gt;
-&lt;<strong>frameset</strong> rows="20%,80%"&gt;
- &lt;<strong>frameset</strong> cols="20%, 80%"&gt;
-   &lt;frame src="<a class="external" href="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png" rel="freelink">http://developer.mozilla.org/wiki-im...irefoxlogo.png</a>"&gt;
-   &lt;frame src="<a class="external" href="http://html.conclase.net/w3c/html401-es/sgml/loosedtd.html#frameset" rel="freelink">http://html.conclase.net/w3c/html401....html#frameset</a>"&gt;
- &lt;/<strong>frameset</strong>&gt;
- &lt;frame src="<a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAMESET" rel="freelink">http://html.conclase.net/w3c/html401...#edef-FRAMESET</a>"&gt;
- &lt;noframes&gt;
-   &lt;p&gt; este documento contiene los siguientes recursos: &lt;/p&gt;
-   &lt;ul&gt;
-     &lt;li&gt; &lt;img src="<a class="external" href="http://developer.mozilla.org/wiki-images/es/3/39/Firefoxlogo.png" rel="freelink">http://developer.mozilla.org/wiki-im...irefoxlogo.png</a>" alt="el logo de Firefox"&gt;
-     &lt;/li&gt;
-     &lt;li&gt; La definición de frameset en el
-          &lt;a href="<a class="external" href="http://html.conclase.net/w3c/html401-es/sgml/loosedtd.html#frameset" rel="freelink">http://html.conclase.net/w3c/html401....html#frameset</a>"&gt;
-          dtd de html 4.01 trans.&lt;/a&gt;
-     &lt;/li&gt;
-     &lt;li&gt; La definición de frameset en la
-          &lt;a href="<a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAMESET" rel="freelink">http://html.conclase.net/w3c/html401...#edef-FRAMESET</a>"&gt;
-          especificación de html 4.01&lt;/a&gt;
-     &lt;/li&gt;
-   &lt;/ul&gt;
- &lt;/noframes&gt;
-&lt;/<strong>frameset</strong>&gt;
-&lt;/html&gt;
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-FRAMESET"><strong>frameset</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-frameset">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/head/index.html b/files/es/web/html/elemento/head/index.html
deleted file mode 100644
index e0e6e13fe1..0000000000
--- a/files/es/web/html/elemento/head/index.html
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: head
-slug: Web/HTML/Elemento/head
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Metadatos de documento HTML
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/head
----
-<div>{{HTMLRef}}</div>
-
-<p>El <strong>elemento HTML <code>&lt;head&gt;</code></strong> provee información general (metadatos) acerca del documento, incluyendo su título y enlaces a scripts y hojas de estilos.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td>Ninguna.</td>
-  </tr>
-  <tr>
-   <th>Contenido permitido</th>
-   <td>Si el elemento es un {{htmlattrxref("srcdoc", "iframe")}} de un {{HTMLElement("iframe")}} , o si la información de título está disponible desde un protocolo de nivel superior, cero o más elementos de metadatos.<br>
-    De otro modo, uno o más elementos de metadatos donde exactamente uno es {{HTMLElement("title")}}.</td>
-  </tr>
-  <tr>
-   <th>Omisión de etiqueta</th>
-   <td>La etiqueta de inicio puede ser omitida si lo primero dentro del elemento head es un elemento.<br>
-    La etiqueta de cierre puede ser omitida si lo primero después del elemento head no es un espacio o un comentario.</td>
-  </tr>
-  <tr>
-   <th>Elementos padre permitidos</th>
-   <td>Un elemento {{HTMLElement("html")}}, pues éste es su primer hijo.</td>
-  </tr>
-  <tr>
-   <th>Interfaz DOM</th>
-   <td>{{domxref("HTMLHeadElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("profile")}} {{obsolete_inline}}</dt>
- <dd>Los URIs de uno o más perfiles de metadatos, separados por un espacio en blanco.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html">&lt;html&gt;
-  &lt;head&gt;
-    &lt;title&gt;Document title&lt;/title&gt;
-  &lt;/head&gt;
-&lt;/html&gt;
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>Navegadores modernos que cumplen con el estándar HTML5 construyen automáticamente un elemento <code>&lt;head&gt;</code> si las etiquetas son omitidas en el código. <a class="external" href="http://www.stevesouders.com/blog/2010/05/12/autohead-my-first-browserscope-user-test/">Este comportamiento no puede ser garantizado en navegadores antiguos</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-head-element', '&lt;head&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambios desde la última versión</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-head-element', '&lt;head&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Atributo <code>profile</code> obsoleto</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.4.1', '&lt;head&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>Elementos que pueden ser usados dentro de un elemento <code>&lt;head&gt;:</code> {{HTMLElement("title")}}, {{HTMLElement("base")}}, {{HTMLElement("link")}}, {{HTMLElement("style")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("noscript")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/header/index.html b/files/es/web/html/elemento/header/index.html
deleted file mode 100644
index f4bdcd9a75..0000000000
--- a/files/es/web/html/elemento/header/index.html
+++ /dev/null
@@ -1,74 +0,0 @@
----
-title: header
-slug: Web/HTML/Elemento/header
-tags:
-  - HTML5
-  - header
-  - para_revisar
-translation_of: Web/HTML/Element/header
----
-<p>El <em>elemento de HTML Header</em> (<span style="font-family: Courier New;">&lt;header&gt;</span>) representa un grupo de ayudas introductorias o de navegación. Puede contener algunos elementos de encabezado, así como también un logo, un formulario de búsqueda, un nombre de autor y otros componentes.</p>
-
-<div class="note">
-<p><strong>Nota de uso:</strong></p>
-
-<ul>
- <li>El elemento <span style="font-family: Courier New;">&lt;header&gt;</span> no es contenido de sección y, por lo tanto, no introduce una nueva sección en <a href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">descripción</a>.</li>
-</ul>
-</div>
-
-<h3 id="Contexto_de_uso">Contexto de uso</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Contenido permitido</td>
-   <td><a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">Contenido dinámico</a>, pero sin un <span style="font-family: Courier New;">&lt;header&gt;</span> o {{ HTMLElement("footer") }} descendente</td>
-  </tr>
-  <tr>
-   <td>Omisión de la etiqueta</td>
-   <td>No está permitido, tanto la <span title="syntax-start-tag">etiqueta de inicio</span> como la de <span title="syntax-end-tag">final</span> son obligatorias</td>
-  </tr>
-  <tr>
-   <td>
-    <p>Elementos padres permitidos</p>
-
-    <p>Roles ARIA permitidos</p>
-
-    <p>Inreface DOM</p>
-   </td>
-   <td>
-    <p>Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a>. Ten en cuenta que un elemento <code>&lt;header&gt;</code> no debe ser descendiente de un elemento {{ HTMLElement("address") }}, {{ HTMLElement("footer") }} o cualquier otro elemento {{ HTMLElement("header") }}.</p>
-
-    <p>{{ARIARole("group")}}, {{ARIARole("presentation")}}</p>
-
-    <p>{{domxref("HTMLElement")}}</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Documento normativo</td>
-   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-header-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-header-element">HTML5, sección 4.4.8</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Atributos">Atributos</h3>
-
-<p>Este elemento no tiene otros atributos que no sean los <a class="new " href="../../../../en/HTML/global_attributes" rel="internal">atributos generales</a>, comunes a todos los elementos.</p>
-
-<div id="section_3">
-<div id="section_3">
-<h3 class="editable" id="Interfaz_DOM">Interfaz DOM</h3>
-
-<p>Este elemento implementa la interfaz <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code>.</p>
-
-<h3 id="Mira_también">Mira también</h3>
-
-<ul>
- <li>Otros elementos relacionados con secciones: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("article") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("section") }}, {{ HTMLElement("address") }};</li>
- <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Sections and outlines of an HTML5 document</a>.</li>
-</ul>
-
-<p>{{ languages( { "en": "en/HTML/Element/header" } ) }}</p>
-</div>
-</div>
diff --git a/files/es/web/html/elemento/hgroup/index.html b/files/es/web/html/elemento/hgroup/index.html
deleted file mode 100644
index 18aa804ac2..0000000000
--- a/files/es/web/html/elemento/hgroup/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: hgroup
-slug: Web/HTML/Elemento/hgroup
-translation_of: Web/HTML/Element/hgroup
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El <em>elemento de grupo de cabeceras HTML</em> (<span style="font-family: Courier New;">&lt;hgroup&gt;</span>) representa el encabezado de una sección. Define un solo título que participa de <a href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">la estructura del documento </a>como el encabezado de la sección implícita o explícita a la que pertenece.</p>
-
-<p>Su <em>text</em>o para el algoritmo de estructura es el texto del primer elemento de encabezado HTML de más alto rango (ip.ej., el primer {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }} o {{ HTMLElement("h6") }} con el número más pequeño entre sus descendientes) y el <em>rango</em> es el rango del mismo elemento de encabezado HTML.</p>
-
-<p>Por tanto, este elemento agrupa varios encabezados, pero solo el primero contribuye a la estructura del documento. Permite asociar títulos secundarios, como subencabezados, títulos alternativos, e incluso lemas, con el encabezado principal, sin contaminar la estructura del documento.</p>
-
-<p>Este elemento se fue removido de la especificacion HTML5 (W3C), por favor no usar mas.</p>
-
-<h3 id="Contexto_de_uso">Contexto de uso</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Contenido permitido</td>
-   <td>Cero o más elementos HTML de encabezado ({{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }})</td>
-  </tr>
-  <tr>
-   <td>Omisión de etiqueta</td>
-   <td>Ninguna, ambas, la etiqueta de inicio y fin son obligatorias</td>
-  </tr>
-  <tr>
-   <td>Elementos padre permitidos</td>
-   <td>
-    <p>Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">flujo de contenido</a>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Documento nomativo</td>
-   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-hgroup-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-hgroup-element">HTML5, section 4.4.7</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Atributos">Atributos</h3>
-
-<p>Este elemento no tiene más atributos que los <a href="/en/HTML/Global_attributes" rel="internal">atributos globales</a>, común a todos los elementos.</p>
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<div class="note">
-<p>Si bien el elemento <code>&lt;hgroup&gt;</code> se eliminó de la especificación HTML5 (W3C), todavía se mantiene en la versión WHATWG de HTML. De todos modos, está parcialmente implementado en la mayoría de los navegadores, por lo que es improbable que desaparezca.<br>
- Sin embargo, dado que el propósito principal del elemento <code>&lt;hgroup&gt;</code> es afectar cómo <a href="/en-US/docs/Web/Guide/HTML/Using_HTML_sections_and_outlines#The_HTML5_outline_algorithm">el algoritmo de generación de esquemas de documento</a> muestra los encabezados, pero <strong>dicho algoritmo no ha sido implementado por ningún navegador</strong>, la semántica de <code>&lt;hgroup&gt;</code> es por el momento solo teórica.<br>
- La especificación HTML5 (W3C) aconseja entonces cómo maquetar <a href="https://www.w3.org/TR/html52/common-idioms-without-dedicated-elements.html#common-idioms-without-dedicated-elements">subtítulos, títulos alternativos y lemas</a> sin utilizar <code>&lt;hgroup&gt;</code>.</p>
-</div>
-
-<h3 class="editable" id="Interfaz_DOM">Interfaz DOM</h3>
-
-<p>Este elemento implementa la interfaz<code> <a href="/es/DOM/element" title="en/DOM/element">HTMLElement</a></code>.</p>
-
-<h3 id="Ejemplos">Ejemplos</h3>
-
-<pre class="brush: html">&lt;hgroup&gt;
-  &lt;h1&gt;Main title&lt;/h1&gt;
-  &lt;h2&gt;Secondary title&lt;/h2&gt;
-&lt;/hgroup&gt;
-</pre>
-
-<h3 id="Compatibilidad">Compatibilidad</h3>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>5</td>
-   <td>{{ CompatGeckoDesktop("2.0") }}</td>
-   <td>9.0</td>
-   <td>11.10</td>
-   <td>4.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.2</td>
-   <td>{{ CompatGeckoMobile("2.0") }}</td>
-   <td>9.0</td>
-   <td>11.0</td>
-   <td>5.0 (iOS 4.2)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Ver_también">Ver también</h3>
-
-<ul>
- <li>Otros elementos relacionados a sección: {{ HTMLElement("body") }}, {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};</li>
- <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Secciones y estructuras de un documento HTML5</a>.</li>
-</ul>
diff --git a/files/es/web/html/elemento/hr/index.html b/files/es/web/html/elemento/hr/index.html
deleted file mode 100644
index 22b569e245..0000000000
--- a/files/es/web/html/elemento/hr/index.html
+++ /dev/null
@@ -1,156 +0,0 @@
----
-title: <hr>
-slug: Web/HTML/Elemento/hr
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/hr
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><span class="comment">descripción de uno o dos párrafos</span>El <strong>elemento HTML &lt;hr&gt; </strong>representa un cambio de tema entre párrafos (por ejemplo, un cambio de escena en una historia, un cambio de tema en una sección). En versiones previas de HTML representaba una línea horizontal. Aún puede ser representada como una línea horizontal en los navegadores visuales, pero ahora es definida en términos semánticos y no tanto en términos representativos, por tanto para dibujar una línea horizontal se debería usar el CSS apropiado.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;hr/&gt;</code> (solo tiene una).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Nada, es un "elemento vacío" del un Glosario.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">Valor</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title </code></td>
-   <td>Texto</td>
-   <td>Implícito</td>
-   <td>Título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style </code></td>
-   <td>Declaraciones de estilo</td>
-   <td>Implícito</td>
-   <td>Información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id </code></td>
-   <td>Un 'nombre'</td>
-   <td>Implícito</td>
-   <td>Identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class </code></td>
-   <td>Lista de clases CSS</td>
-   <td>implícito</td>
-   <td>Identificador a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir </code></td>
-   <td>Uno de los siguientes: <code>"ltr"</code> o <code>"rtl"</code></td>
-   <td>Implícito</td>
-   <td>Dirección del texto.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang </code></td>
-   <td>Código de idioma</td>
-   <td>Implícito</td>
-   <td>Información sobre el idioma.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">align </code></td>
-   <td>uno de los siguientes: <code>"left", "center", "right".</code></td>
-   <td>Implícito. Por defecto: <code>"center"</code></td>
-   <td>Indica la alineación horizontal.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">noshade </code></td>
-   <td><code>"noshade"</code></td>
-   <td>Implícito</td>
-   <td>Elimina el relieve.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">size </code></td>
-   <td>Una cantidad, de píxeles</td>
-   <td>Implícito</td>
-   <td>Indica la altura de la linea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">width </code></td>
-   <td>Una cantidad, de píxeles, o un porcentaje.</td>
-   <td>Implícito. por defecto: 100%</td>
-   <td>Indica la anchura.</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">Valor</th>
-   <th>Descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">  &lt;p&gt;Este es un parrafo unicamente visual para ver el uso de
- la etiqueta hr&lt;/p&gt;
-  &lt;hr/&gt;
-  &lt;p&gt;Este es el segundo parrafo, separado del primero por la etiqueta hr, que puede
-representarse mediante una línea horizontal.&lt;/p&gt;
-</pre>
-
-<h3 id="Muestra">Muestra</h3>
-
-<p>Este es un parrafo unicamente visual para ver el uso de la etiqueta hr</p>
-
-<hr>
-<p>Este es el segundo parrafo, separado del primero por una linea horizontal</p>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p> </p>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/graphics.html#edef-HR"><strong>hr</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p><span class="comment">secciones futuras: == Soporte de los navegadores == == Valores por defecto y visualización en Firefox ==</span></p>
-
-<div class="note">
-<p>Este documento está siendo editado, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en la elaboración de este documento? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/html/index.html b/files/es/web/html/elemento/html/index.html
deleted file mode 100644
index 48fd5f469e..0000000000
--- a/files/es/web/html/elemento/html/index.html
+++ /dev/null
@@ -1,176 +0,0 @@
----
-title: <html>
-slug: Web/HTML/Elemento/html
-tags:
-  - Element
-  - Elemento
-  - HTML
-  - HTML Root Element
-  - HTML elemento raiz
-  - 'HTML:Elemento'
-  - Reference
-  - Referencia
-  - Todas_las_Categorías
-  - Web
-translation_of: Web/HTML/Element/html
----
-<p>{{HTMLRef}}</p>
-
-<p>El <strong>elemento HTML <code>&lt;html&gt;</code></strong> (o <em>elemento HTML raiz</em>) representa la raiz de un documento HTML. El resto de elementos descienden de este elemento.</p>
-
-<p>Dado que el elemento <code>&lt;html&gt;</code> es el primero en un documento, aparte de los comentarios, se llama el elemento raíz. A pesar de que esta etiqueta puede ser implicita, o no requerida en {{glossary("HTML")}}, sí es requerida para abrir y cerrar en {{glossary("XHTML")}}.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de Contenido</a></th>
-   <td>Ninguna.</td>
-  </tr>
-  <tr>
-   <th>Contenido permitido</th>
-   <td>Un elemento {{HTMLElement("head")}} seguido de un elemento {{HTMLElement("body")}}.</td>
-  </tr>
-  <tr>
-   <th>Omisión de etiqueta</th>
-   <td>
-    <p>La etiqueta de inicio puede omitirse si lo primero que hay en el interior del elemento &lt;html&gt; no es un comentario.<br>
-     La etiqueta final puede omitirse si el elemento &lt;html&gt; no está inmediatamente seguido por un comentario y contiene un elemento {{HTMLElement("body")}}, o bien que no esté vacío, o cuya etiqueta de inicio está presente.</p>
-   </td>
-  </tr>
-  <tr>
-   <th>Elementos padres permitidos</th>
-   <td>Como elemento raiz de un documento, o donde se permite un fragmento de subdocumento en un documento compuesto.</td>
-  </tr>
-  <tr>
-   <th>Interfaz DOM</th>
-   <td>{{domxref("HTMLHtmlElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="/es/docs/Web/HTML/Atributos_Globales" style="line-height: 21px;" title="HTML/Global attributes">atributos globales</a><span style="line-height: 21px;">.</span></p>
-
-<dl>
- <dt>{{htmlattrdef("manifest")}} {{obsolete_inline}}</dt>
- <dd>Especifica la dirección URL de un manifiesto de recursos que indica los recursos que deben ser almacenados en la caché local. Consulte <a href="https://developer.mozilla.org/es/docs/Web/HTML/Using_the_application_cache" title="/en-US/docs/HTML/Using_the_application_cache">Uso de la cache de la aplicación</a> para obtener más información.</dd>
- <dt>{{htmlattrdef("version")}} {{obsolete_inline}}</dt>
- <dd>Especifica la versión {{glossary("DTD", "Document Type Definition")}} de HTML del documento actual. Este atributo no es necesario, porque es redundante con la información de versión en la declaración de tipo de documento.</dd>
- <dt>{{htmlattrdef("xmlns")}} </dt>
- <dd>Especifica el Espacio de nombres XML del documento. El valor por defecto es <code>"http://www.w3.org/1999/xhtml"</code>. En XHTML es requerido y en HTML es opcional.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>El DOCTYPE usado en el siguiente ejemplo indica que es un documento HTML5.</p>
-
-<pre class="brush: html">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;...&lt;/head&gt;
-  &lt;body&gt;...&lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('HTML WHATWG', 'semantics.html#the-html-element', '&lt;html&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambios desde la última instantánea.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'semantics.html#the-html-element', '&lt;html&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Añadido soporte para el atributo <code>manifest</code> (en desuso después).<br>
-    El Atributo <code>version</code> es obsoleto.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.3', '&lt;html&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>El Atributo <code>version</code> está en desuso</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>manifest</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.9")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>manifest</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.9")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>MathML top-level element: {{MathMLElement("math")}}</li>
- <li>SVG top-level element: {{SVGElement("svg")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/i/index.html b/files/es/web/html/elemento/i/index.html
deleted file mode 100644
index e3b318e367..0000000000
--- a/files/es/web/html/elemento/i/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: i
-slug: Web/HTML/Elemento/i
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/i
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Muestra el texto marcado con un estilo en cursiva o italica.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;i&gt; y &lt;/i&gt; (Ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>lista de clases separadas por espacios en blanco.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">  &lt;p&gt;
-       Texto normal y... &lt;i&gt;Texto 'inclinado'&lt;/i&gt;
-  &lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/elemento/iframe/index.html b/files/es/web/html/elemento/iframe/index.html
deleted file mode 100644
index 23d58f54e8..0000000000
--- a/files/es/web/html/elemento/iframe/index.html
+++ /dev/null
@@ -1,304 +0,0 @@
----
-title: '<iframe>: el elemento Inline Frame'
-slug: Web/HTML/Elemento/iframe
-tags:
-  - Contenido
-  - Contenido incrustado
-  - Elemento
-  - Embebido
-  - HTML
-  - Incrustado
-  - Marcos
-  - Web
-  - iframe
-translation_of: Web/HTML/Element/iframe
----
-<div>{{HTMLRef}}</div>
-
-<p class="seoSummary">El <strong>elemento HTML <code>&lt;iframe&gt;</code></strong> (de inline frame) representa un {{Glossary("contexto de navegación")}} anidado, el cual permite incrustrar otra página HTML en la página actual.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/iframe.html", "tabbed-standard")}}</div>
-
-<p>Cada elemento <code>&lt;iframe&gt;</code> tiene su propio <a href="/es/docs/Web/API/History">historial de sesión</a> y su propio objeto <a href="/es/docs/Web/API/Document">Documento</a>. El contexto de navegación que incluye el contenido implícito se llama <em>contexto de navegación principal</em>. El contexto de navegación de nivel superior (que no tiene padre) es típicamente la ventana del navegador, representado por el objeto {{domxref("Window")}}.</p>
-
-<div class="blockIndicator warning">
-<p>Debido a que cada contexto de navegación es un entorno de documento completo, cada <code>&lt;iframe&gt;</code> en una página requiere más memoria y otros recursos informáticos. Aunque teóricamente puede utilizar tantos <code>&lt;iframe&gt;</code> como desee, compruebe si hay problemas de rendimiento.</p>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenidos</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a>, contenido incrustado, contenido interactivo, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_tangible">contenido tangible</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Contenido alternativo que normalmente no se renderiza para los navegadores que no son compatibles con el elemento <code>&lt;iframe&gt;</code>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padres permitidos</th>
-   <td>Cualquier elemento que acepte contenido incrustado.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("img")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM </th>
-   <td>{{domxref("HTMLIFrameElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento admite <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<ul>
- <li>En el atributo <code>target</code> de los elementos {{HTMLElement("a")}}, {{HTMLElement("from")}} y {{HTMLElement("base")}}.</li>
- <li>En el atributo <code>formtarget</code> de los elementos {{HTMLElement("input")}} y {{HTMLElement("button")}}</li>
- <li>En el parámetro <code>windowName</code> en el método {{domxref("Window.open()","window.open()")}}.</li>
-</ul>
-
-<dl>
- <dt>{{htmlattrdef("allow")}}</dt>
- <dd>Especifíca una <a href="/en-US/docs/Web/HTTP/Feature_Policy">política de características</a> para el <code>&lt;iframe&gt;</code>. Vea el articulo <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Privacy">Privacy, permissions, and information security</a> para detalles en temas de seguridad y como <code>&lt;iframe&gt;</code> funciona con las Politicas de Herramientas para mantener los sistemas seguros.</dd>
- <dt>{{htmlattrdef("allowfullscreen")}}</dt>
- <dd>Definido como <code>true</code> si el <code>&lt;iframe&gt;</code> puede activar el modo a pantalla completa llamando al método {{domxref("Element.requestFullscreen", "requestFullscreen()")}}.</dd>
- <dd>
- <div class="blockIndicator note">
- <p>Se considera un atributo heredado y se redefine como <code>allow="fullscreen"</code>.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("allowpaymentrequest")}}</dt>
- <dd>Definido como <code>true</code> si se debe permitir que un <code>&lt;iframe&gt;</code> de origen cruzado pueda invocar el <a href="/en-US/docs/Web/API/Payment_Request_API">API de solicitud de pago</a>. </dd>
- <dd>
- <div class="blockIndicator note">
- <p>Se considera un atributo heredado y se redefine como <code>allow="payment"</code>.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("csp")}} {{experimental_inline}}</dt>
- <dd>Una <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP">Politica de Seguridad del Contenido</a> aplicada para el recurso incrustado. Vea {{domxref("HTMLIFrameElement.csp")}} para detalles.</dd>
- <dt>{{ htmlattrdef("height") }}</dt>
- <dd>Indica la altura del frame {{ HTMLVersionInline(5) }}en píxeles CSS, o {{ HTMLVersionInline(4.01) }} en píxeles o como un porcentaje.</dd>
- <dt id="name-attribute">{{htmlattrdef("importance")}} {{experimental_inline}}</dt>
- <dd>La prioridad de descarga en el recurso para el atributo <code>src</code> del <code>&lt;iframe&gt;</code>. Valores permitidos:
- <ul>
-  <li><code>auto</code>: (default) Sin preferencia. El buscador utiliza sus propias heurísticas para decidir la prioridad del recurso.</li>
-  <li><code>high</code>: El recurso debe ser descargado antes que otros recursos de baja-prioridad de los recursos de la página.</li>
-  <li><code>low</code>: El recurso debe ser descargado después de otros recursos de alta-prioridad de los recursos de la página.</li>
- </ul>
-
- <dl>
- </dl>
- </dd>
- <dt>{{ htmlattrdef("name") }}</dt>
- <dd>Nombre objetivo para el contexto de navegación incrustado. Se puede utilizar:
- <ul>
-  <li>En el atributo target de los elementos {{HTMLElement("a")}}, {{HTMLElement("from")}} y {{HTMLElement("base")}}.</li>
-  <li>En el atributo formtarget de los elementos {{HTMLElement("input")}} y {{HTMLElement("button")}}</li>
-  <li>En el parámetro windowName en el método {{domxref("Window.open()","window.open()")}}.</li>
- </ul>
- </dd>
- <dt id="attr-referrer">{{htmlattrdef("referrerpolicy")}}</dt>
- <dd>Indicates which <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer">referrer</a> to send when fetching the frame's resource:
- <ul>
-  <li><code>no-referrer</code>: The {{HTTPHeader("Referer")}} header will not be sent.</li>
-  <li><code>no-referrer-when-downgrade</code> (default): The {{HTTPHeader("Referer")}} header will not be sent to {{Glossary("origin")}}s without {{Glossary("TLS")}} ({{Glossary("HTTPS")}}).</li>
-  <li><code>origin</code>: The sent referrer will be limited to the origin of the referring page: its <a href="https://developer.mozilla.org/en-US/docs/Archive/Mozilla/URIScheme">scheme</a>, {{Glossary("host")}}, and {{Glossary("port")}}.</li>
-  <li><code>origin-when-cross-origin</code>: The referrer sent to other origins will be limited to the scheme, the host, and the port. Navigations on the same origin will still include the path.</li>
-  <li><code>same-origin</code>: A referrer will be sent for {{Glossary("Same-origin policy", "same origin")}}, but cross-origin requests will contain no referrer information.</li>
-  <li><code>strict-origin</code>: Only send the origin of the document as the referrer when the protocol security level stays the same (HTTPS→HTTPS), but don't send it to a less secure destination (HTTPS→HTTP).</li>
-  <li><code>strict-origin-when-cross-origin</code>: Send a full URL when performing a same-origin request, only send the origin when the protocol security level stays the same (HTTPS→HTTPS), and send no header to a less secure destination (HTTPS→HTTP).</li>
-  <li><code>unsafe-url</code>: The referrer will include the origin <em>and</em> the path (but not the <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/hash">fragment</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/password">password</a>, or <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLHyperlinkElementUtils/username">username</a>). <strong>This value is unsafe</strong>, because it leaks origins and paths from TLS-protected resources to insecure origins.</li>
- </ul>
- </dd>
- <dd>
- <ul>
- </ul>
- </dd>
- <dt>{{htmlattrdef("sandbox")}}</dt>
- <dd>Applies extra restrictions to the content in the frame. The value of the attribute can either be empty to apply all restrictions, or space-separated tokens to lift particular restrictions:
- <ul>
-  <li><code>allow-forms</code>: Allows the resource to submit forms. If this keyword is not used, form submission is blocked.</li>
-  <li><code>allow-modals</code>: Lets the resource <a href="https://html.spec.whatwg.org/multipage/origin.html#sandboxed-modals-flag">open modal windows</a>.</li>
-  <li><code>allow-orientation-lock</code>: Lets the resource <a href="https://developer.mozilla.org/en-US/docs/Web/API/Screen/lockOrientation">lock the screen orientation</a>.</li>
-  <li><code>allow-pointer-lock</code>: Lets the resource use the <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Pointer_Lock">Pointer Lock API</a>.</li>
-  <li><code>allow-popups</code>: Allows popups (such as <code>window.open()</code>, <code>target="_blank"</code>, or <code>showModalDialog()</code>). If this keyword is not used, the popup will silently fail to open.</li>
-  <li><code>allow-popups-to-escape-sandbox</code>: Lets the sandboxed document open new windows without those windows inheriting the sandboxing. For example, this can safely sandbox an advertisement without forcing the same restrictions upon the page the ad links to.</li>
-  <li><code>allow-presentation</code>: Lets the resource start a <a href="https://developer.mozilla.org/en-US/docs/Web/API/PresentationRequest">presentation session</a>.</li>
-  <li><code>allow-same-origin</code>: If this token is not used, the resource is treated as being from a special origin that always fails the {{Glossary("same-origin policy")}}.</li>
-  <li><code>allow-scripts</code>: Lets the resource run scripts (but not create popup windows).</li>
-  <li><code>allow-storage-access-by-user-activation</code> {{experimental_inline}}: Lets the resource request access to the parent's storage capabilities with the <a href="https://developer.mozilla.org/en-US/docs/Web/API/Storage_Access_API">Storage Access API</a>.</li>
-  <li><code>allow-top-navigation</code>: Lets the resource navigate the top-level browsing context (the one named <code>_top</code>).</li>
-  <li><code>allow-top-navigation-by-user-activation</code>: Lets the resource navigate the top-level browsing context, but only if initiated by a user gesture.</li>
- </ul>
-
- <div class="note"><strong>Notes about sandboxing:</strong>
-
- <ul>
-  <li>When the embedded document has the same origin as the embedding page, it is <strong>strongly discouraged</strong> to use both <code>allow-scripts</code> and <code>allow-same-origin</code>, as that lets the embedded document remove the <code>sandbox</code> attribute — making it no more secure than not using the <code>sandbox</code> attribute at all.</li>
-  <li>Sandboxing is useless if the attacker can display content outside a sandboxed <code>iframe</code> — such as if the viewer opens the frame in a new tab. Such content should be also served from a <em>separate origin</em> to limit potential damage.</li>
-  <li>The <code>sandbox</code> attribute is unsupported in Internet Explorer 9 and earlier.</li>
- </ul>
- </div>
- </dd>
- <dt>{{ htmlattrdef("seamless") }} </dt>
- <dd>This Boolean attribute indicates that the browser should render the inline frame in a way that makes it appear to be part of the containing document, for example by applying CSS styles that apply to the <code>&lt;iframe&gt;</code> to the contained document before styles specified in that document, and by opening links in the contained documents in the parent browsing context (unless another setting prevents this).</dd>
- <dt>{{ htmlattrdef("src") }}</dt>
- <dd>The URL of the page to embed.</dd>
- <dt>{{ htmlattrdef("srcdoc") }} </dt>
- <dd>The content of the page that the embedded context is to contain.</dd>
- <dt>{{ htmlattrdef("width") }}</dt>
- <dd>Indicates the width of the frame {{ HTMLVersionInline(5) }} in CSS pixels, or {{ HTMLVersionInline(4.01) }} in pixels or as a percentage.</dd>
-</dl>
-
-<h3 id="Atributos_obsoletos">Atributos obsoletos</h3>
-
-<p>Estos atributos están obsoletos y es posible que ya no sean compatibles con todos los agentes de usuario. No debe utilizarlos en contenido nuevo y tratar de eliminarlos del contenido existente.</p>
-
-<dl>
- <dt>{{htmlattrdef("align")}} {{deprecated_inline("html4.01")}}, {{obsolete_inline("html5")}}</dt>
- <dd><span id="result_box" lang="es"><span class="hps">La alineación</span> <span class="hps">de este elemento</span> <span class="hps">con respecto al</span> <span class="hps">contexto que lo rodea.</span></span></dd>
- <dt>{{ htmlattrdef("frameborder") }} {{ obsolete_inline("html5")}} </dt>
- <dd>El valor 1 (por defecto) indica al navegador establecer una frontera entre este marco y todo otro marco. <span class="long_text" id="result_box" lang="es"><span class="gt-trans-draggable hps">El valor 0</span> <span class="gt-trans-draggable hps">indica</span> <span class="gt-trans-draggable hps">que el navegador no</span> establece<span class="gt-trans-draggable hps"> una</span> <span class="gt-trans-draggable hps">frontera</span> <span class="gt-trans-draggable hps">entre este marco y</span> <span class="gt-trans-draggable hps">otros marcos.</span></span></dd>
- <dt>{{ htmlattrdef("longdesc") }} {{ obsolete_inline("html5")}} </dt>
- <dd>Una URI de una descripción larga del marco. Debido al mal uso generalizado, esto no es útil para navegadores no visuales.</dd>
- <dt>{{ htmlattrdef("marginheight") }} {{ obsolete_inline("html5") }} </dt>
- <dd>La cantidad de espacio en píxeles entre el contenido del marco y sus márgenes superior e inferior.</dd>
- <dt>{{ htmlattrdef("marginwidth") }} {{ obsolete_inline("html5") }} </dt>
- <dd>La cantidad de espacio en píxeles entre el contenido del marco y sus márgenes izquierdo y derecho.</dd>
- <dt>{{ htmlattrdef("scrolling") }} {{ obsolete_inline("html5") }} </dt>
- <dd>Indica cuándo el navegador debe proporcionar una barra de desplazamiento para el marco:
- <ul>
-  <li><code>auto</code>: Sólo cuando el contenido del marco es mayor que sus dimensiones.</li>
-  <li><code>yes</code>: Muestra siempre una barra de desplazamiento.</li>
-  <li><code>no</code>: No muestr la barra de desplazamiento nunca.</li>
- </ul>
- </dd>
-</dl>
-
-<h3 id="Atributos_no_estándar">Atributos no estándar</h3>
-
-<dl>
- <dt>{{htmlattrdef("mozbrowser")}} {{non-standard_inline}}</dt>
- <dd>
- <div class="blockIndicator note">
- <p>See {{bug(1318532)}} for exposing this to WebExtensions in Firefox.</p>
- </div>
- Makes the <code>&lt;iframe&gt;</code> act like a top-level browser window. See <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Gecko/Chrome/API/Browser_API">Browser API</a> for details.<br>
- <strong>Available only to <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions</a>.</strong></dd>
- <dt>{{ htmlattrdef("mozallowfullscreen") }} {{ non-standard_inline() }}</dt>
- <dd>In Gecko 9.0 or later, this attribute can be set to <code>true</code> if the frame is allowed to be placed into full screen mode by calling its {{ domxref("element.mozRequestFullScreen()") }} method. If this isn't set, the element can't be placed into full screen mode.</dd>
- <dt>{{ htmlattrdef("webkitallowfullscreen") }} {{ non-standard_inline() }}</dt>
- <dd>In Chrome 17 or later (and maybe earlier), this attribute can be set to <code>true</code> if the frame is allowed to be placed into full screen mode by calling its {{ domxref("element.webkitRequestFullScreen()") }} method. If this isn't set, the element can't be placed into full screen mode.</dd>
- <dt>{{ htmlattrdef("mozapp") }} {{ non-standard_inline() }}</dt>
- <dd>For frames hosting an <a href="/en/Apps" title="https://developer.mozilla.org/en/OpenWebApps">open web app</a>, this specifies the URL of the <a href="/en/Apps/Manifest" title="https://developer.mozilla.org/en/Apps/Manifest">app manifest</a>. This ensures that the app is loaded with the right permissions. See <a href="/en/DOM/Using_the_Browser_API" title="https://developer.mozilla.org/en/DOM/Using_the_Browser_API">Using the Browser API</a> for details. Available in Gecko 13.0 and later.</dd>
- <dt>{{ htmlattrdef("remote") }} {{ non-standard_inline() }}</dt>
- <dd>Load the frame's page in a separate content process.</dd>
-</dl>
-
-<h2 id="Secuencia_de_comandos">Secuencia de comandos</h2>
-
-<p>Inline frames, like {{HTMLElement("frame")}} elements, are included in the {{domxref("window.frames")}} pseudo-array.</p>
-
-<p>With the DOM {{domxref("HTMLIFrameElement")}} object, scripts can access the {{domxref("window")}} object of the framed resource via the {{domxref("HTMLIFrameElement.contentWindow", "contentWindow")}} property. The {{domxref("HTMLIFrameElement.contentDocument", "contentDocument")}} property refers to the <code>document</code> inside the <code>&lt;iframe&gt;</code>, same as <code>contentWindow.document</code>.</p>
-
-<p>From the inside of a frame, a script can get a reference to its parent window with {{domxref("window.parent")}}.</p>
-
-<p>Script access to a frame's content is subject to the {{Glossary("same-origin policy")}}. Scripts cannot access most properties in other <code>window</code> objects if the script was loaded from a different origin, including scripts inside a frame accessing the frame's parent. Cross-origin communication can be achieved using {{domxref("Window.postMessage()")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Example1" name="Example1">Un &lt;iframe&gt; simple</h3>
-
-<p>Un <code>&lt;iframe&gt;</code> en acción. Después de crear el marco, cuando el usuario hace clic en un botón, su título se muestra en una alerta.</p>
-
-<h4 id="HTML">HTML</h4>
-
-<pre><code>&lt;iframe src="https://mdn-samples.mozilla.org/snippets/html/iframe-simple-contents.html" title="iframe Example 1" width="400" height="300"&gt;
-  &lt;p&gt;Your browser does not support iframes.&lt;/p&gt;
-&lt;/iframe&gt;</code></pre>
-
-<h4 id="Resultado">Resultado</h4>
-
-<p>{{ EmbedLiveSample('Example1', 640,400)}}</p>
-
-<h3 id="Example2" name="Example2">Abrir un enlace en un &lt;iframe&gt; en otra pestaña</h3>
-
-<p>En este ejemplo, se muestra un mapa de Google en un marco.</p>
-
-<h4 id="HTML_2">HTML</h4>
-
-<pre><code>&lt;iframe id="Example2"
-    title="iframe Example 2"
-    width="400" height="300"
-    style="border:none"
-    src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;q=buenos+aires&amp;sll=37.0625,-95.677068&amp;sspn=38.638819,80.859375&amp;t=h&amp;hnear=Buenos+Aires,+Argentina&amp;z=11&amp;ll=-34.603723,-58.381593&amp;output=embed"&gt;
-&lt;/iframe&gt;</code></pre>
-
-<h4 id="Resultado_2">Resultado</h4>
-
-<p>{{ EmbedLiveSample('Example2', 640, 400)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrerpolicy attribute')}}</td>
-   <td>{{Spec2('Referrer Policy')}}</td>
-   <td>Added the <code>referrerpolicy</code> attribute.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'iframe-embed-object.html#the-iframe-element', '&lt;iframe&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'embedded-content-0.html#the-iframe-element', '&lt;iframe&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'present/frames.html#h-16.5', '&lt;iframe&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('Screen Orientation')}}</td>
-   <td>{{Spec2('Screen Orientation')}}</td>
-   <td>Adds <code>allow-orientation-lock</code> to the <code>sandbox</code> attribute.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('Presentation','#sandboxing-and-the-allow-presentation-keyword','allow-presentation')}}</td>
-   <td>{{Spec2('Presentation')}}</td>
-   <td>Adds <code>allow-presentation</code> to the <code>sandbox</code> attribute</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Notes">Notes</h2>
-
-<div class="geckoVersionNote">
-<p>{{ gecko_callout_heading("6.0") }}</p>
-
-<p>Starting in Gecko 6.0 {{ geckoRelease("6.0") }}, rendering of inline frames correctly respects the borders of their containing element when they're rounded using {{ cssxref("border-radius") }}.</p>
-</div>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("html.elements.iframe", 3)}}</p>
diff --git a/files/es/web/html/elemento/image/index.html b/files/es/web/html/elemento/image/index.html
deleted file mode 100644
index e48d44488f..0000000000
--- a/files/es/web/html/elemento/image/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: <image>
-slug: Web/HTML/Elemento/image
-tags:
-  - HTML
-translation_of: Web/HTML/Element/image
----
-<div>{{non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento HTML <font face="Consolas, Liberation Mono, Courier, monospace"><code>&lt;image&gt;</code> fue </font>un elemento experimental diseñado para mostrar imágenes . Nuca fue implementado y el elemento estándar {{HTMLElement("img")}} debe de ser usado .</p>
-
-<div class="note">
-<p><strong>No usar esto ! </strong>Para mostrar imagenes , usar el elemento estándar {{HTMLElement("img")}} .</p>
-</div>
-
-<p>Notar que hasta Firefox 22 , aunque no era soportado , un elemento <code>&lt;image&gt;</code> era asociado a un {{domxref("HTMLSpanElement")}} . Después fue arreglado y ahora es asociado a {{domxref("HTMLElement")}} , como es solicitado por la especificación .</p>
diff --git a/files/es/web/html/elemento/img/index.html b/files/es/web/html/elemento/img/index.html
deleted file mode 100644
index 6345af1848..0000000000
--- a/files/es/web/html/elemento/img/index.html
+++ /dev/null
@@ -1,339 +0,0 @@
----
-title: img
-slug: Web/HTML/Elemento/img
-tags:
-  - Contenido
-  - Elemento
-  - HTML
-  - Incrustado
-translation_of: Web/HTML/Element/img
----
-<p>El elemento de imagen HTML <span class="seoSummary"><code><strong>&lt;img&gt;</strong></code></span> representa una imagen en el documento.</p>
-
-<div class="note">
-<p><strong>Nota:</strong><br>
- Los navegadores no siempre muestran la imagen a la que el elemento hace referencia. Es el caso de los navegadores no gráficos (incluyendo aquellos usados por personas con problemas de visión), sí el usuario elige no mostrar la imagen, o sí el navegador es incapaz de mostrarla porque no es válida o <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/img#Supported_image_formats">soportada</a>. En ese caso, el navegador la reemplazará con el texto definido en el atributo {{htmlattrdef("alt", "img")}}.</p>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories">Cotenido de las categorias</a></th>
-   <td><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Flow_content">Contenido dinámico</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content">contenido estático</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Embedded_content">contenido incrustado</a>, contenido palpable. Si el elemento tiene un atributo {{htmlattrdef("usemap", "img")}}, it also is a part of the interactive content category.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno, es {{Glossary("empty element")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>Debe tener etiqueta de de inicio pero no tiene por qué haber de cierre.</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte contenido incrustado.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLImageElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye atributos globales.</p>
-
-<dl>
- <dt>{{htmlattrdef("align")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}} Use the {{cssxref('vertical-align')}} CSS property</dt>
- <dd>Alineamiento de la texto respecto al contexto que la rodea.</dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("alt")}}</dt>
- <dd>Este atributo define el texto alternativo que describe la imagen, texto que los usuarios verán si la URL de la imagen es errónea o la imagen tiene un <a href="/es/docs/Web/HTML/Elemento/img$edit#Supported_image_formats">formato no soportado</a> o si la imagen aún no se ha descargado.</dd>
- <dt>
- <div class="note">
- <p><strong>Nota: </strong>Omitir este atributo indica que la imagen es una parte clave del contenido, y no tiene equivalencia textual. Establecer este atributo como cadena vacía indica que la imagen no es una parte clave del contenido; los navegadores no gráficos pueden omitirlo.</p>
- </div>
- </dt>
- <dt>{{htmlattrdef("border")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
- <dd>Anchura del borde alrededor de la imagen.</dd>
- <dt>{{htmlattrdef("crossorigin")}} {{HTMLVersionInline(5)}}</dt>
- <dd>Este atributo enumerado indica si la búsqueda de la imagen debe ser por CORS o no. <a href="https://developer.mozilla.org/es/docs/Web/HTML/Imagen_con_CORS_habilitado">Imagen hablidata CORS</a> puede ser usada en el elemento {{HTMLElement("canvas")}} sin ser pintada. Los valores permitidos son:
- <dl>
-  <dt><code>"anonymous"</code></dt>
-  <dd>Una petición cross-origin (i.e., with <code>Origin:</code> HTTP header) es realizada. Sin embargo, no fueron enviadas credenciales "<em>(i.e., no cookie, no X.509 certificate, and no HTTP Basic authentication is sent)</em>". Sí el servidor no emite credenciales al sitio de origen (no ajustando el <code>Access-Control-Allow-Origin:</code> HTTP header), la imagen será pintada y su uso restringido.</dd>
-  <dt><code>"use-credentials"</code></dt>
-  <dd>Una petición cross-origin (i.e., with <code>Origin:</code> HTTP header) es realizada con credenciales (i.e., a cookie, a certificate, and HTTP Basic authentication is performed). Sí el servidor no emite credenciales al sitio de origen (a través del <code>Access-Control-Allow-Credentials:</code> HTTP header), la imagen será pintada y su uso restringido.</dd>
- </dl>
-
- <p>Cuando no existe, el recurso es buscado sin petición CORS (i.e., <code>sin enviar el Origen:</code> HTTP header) , previniendo el uso no pintado del elemento {{HTMLElement('canvas')}}. Si es inválido, se maneja como si se hubiese usado <strong>anonymous</strong>. Ver <a href="https://developer.mozilla.org/es/docs/HTML/CORS_settings_attributes">atributos de configuración CORS</a> para más información.</p>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("height")}}</dt>
- <dd>La altura de la imagen en píxeles CSS {{HTMLVersionInline(5)}} o píxeles o como porcentaje en {{HTMLVersionInline(4)}}.</dd>
- <dt>{{htmlattrdef("hspace")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
- <dd>El número de píxeles de espaciado a la izquierda y la derecha de la imagen.</dd>
- <dt>{{htmlattrdef("ismap")}}</dt>
- <dd>Este atributo boleano indica que la imagen es parte del mapa del lado del servidor. Así que, se envían las coordenadas precisas de un clic.
- <div class="note">
- <p><strong>Nota: </strong>Este atributo está permitido solo si el elemento<code> &lt;img&gt;</code> es descendiente de un elemento {{htmlelement("a")}} con un atributo {{htmlattrxref("href","a")}} válido.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("longdesc")}}</dt>
- <dd>La URL como descripción de una imagen mostrada, complementa al texto de {{htmlattrdef("alt", "img")}}.</dd>
- <dt>{{htmlattrdef("name")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
- <dd>El nombre para el elemento. Soportado en {{HTMLVersionInline(4)}} solo para compatibilidad con versiones anteriores. En su lugar, usa el atributo <code><strong>id</strong></code>.</dd>
- <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt>
- <dd>Una cadena indicando que referencia usar cuando buscas un recurso:
- <ul>
-  <li><code>"no-referrer"</code>: la cabecera no se envia.</li>
-  <li>"<code>no-referrer-when-downgrade</code>": la cabecera no será enviada cuando navegas hacia un origen sin TLS (HTTPS). <span id="result_box" lang="es"><span class="hps">E</span>s<span class="hps"> el comportamiento</span> <span class="hps">predeterminado</span><span class="hps">, si no se especifica en ninguna política.</span></span></li>
-  <li><code>"origin"</code>: el referente será el origen de la página; lo que sería el esquema, el anfitrión (host) y el puerto.</li>
-  <li>"origin-when-cross-origin": navega hacia otro origen limitado por el esquema, el anfitrión y el puerto, mientras navegas en el mismo origen incluirá el camino del referente.</li>
-  <li><code>"unsafe-url"</code>: el referente incluirá el origen y el camino (pero no el fragment, contraseña, o nombre de usuario). Este caso es arriegasdo porque puede haber una fuga del origen o el camino desde los recursos protegidos por TLS desde orígenes inseguros.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("sizes")}}{{HTMLVersionInline(5)}}</dt>
- <dd>Una lista de una o más cadenas separadas por comas indicando el tamaño de la fuente. Cada tamaño de la fuente consiste en:
- <ol>
-  <li>Codición de medios. Debe omitirse en el último ítem.</li>
-  <li>Valor del tamaño.</li>
- </ol>
-
- <p>El valor del tamaño de la fuente especifica el tamaño de la imagen incrustada. Se usa el tamaño actual de la fuente para seleccionar las fuentes soportadas por el atributo <code>srcset</code>, cuando esas fuentes son descritas usando el ancho (width). El tamaño de la fuente afecta al tamaño de la imagen (la imagen muestra tamaño si no se aplican estilos CSS). Si no hay atributo <code>srcset</code>, o no contiene valores con el ancho definido, entonces el atributo sizes no funciona.</p>
- </dd>
- <dt>{{htmlattrdef("src")}}</dt>
- <dd>La URL de la imagen. Este atributo es obligatorio para el elemento &lt;img&gt;. En navegadores que soportan <code>srcset</code>, <code>src</code> es tratado como imagen candidata con una densidad del píxel <code>1x</code> sino una imagen estará definida en <code>srcset</code> o <code>srcset</code> contiene ancho.</dd>
- <dt></dt>
- <dt>{{htmlattrdef("srcset")}}{{HTMLVersionInline(5)}}</dt>
- <dd>Una lista de una o más cadenas separadas por comas indicando las posibles fuentes para usar. Cada cadena está compuesta por:
- <ol>
-  <li>URL de la imagen</li>
-  <li>Opcionalmente, espacios en blanco seguidos de:
-   <ul>
-    <li>Un ancho, que es un entero positivo seguido directamente por <code>'w'</code>. El ancho está dividido por el tamaño de la fuente dada en el atributo <code>sizes</code> para calcular la densidad del píxel.</li>
-    <li>Densidad del píxel, un positivo decimal seguido directamente de <code>'x'</code>.</li>
-   </ul>
-  </li>
- </ol>
-
- <p>Si no hay descriptores especificados, la fuente es asignada por defecto a <code>1x</code>.</p>
-
- <p>Es inválido mezclar ancho y densidad del píxel en el mismo atributo <code>srcset</code>. Descriptores duplicados (por ejemplo, dos fuentes en el mismo <code>srcset</code> definidos ambos con '<code>2x</code>') son inválidos, también.</p>
-
- <p>Los agentes de usuario son discretos al elegir cualquiera de las fuentes disponibles. <span id="result_box" lang="es"><span class="hps">Esto les proporciona</span> <span class="hps">un margen</span> <span class="hps">significativo para</span> <span class="hps">adaptar su</span> <span class="hps">selección basada en</span> <span class="hps">cosas como</span> <span class="hps">las preferencias del usuario</span> <span class="hps">o las condiciones</span> <span class="hps">de ancho de banda</span><span>.</span></span></p>
- </dd>
- <dt>{{htmlattrdef("width")}}</dt>
- <dd>El ancho de la imagen en píxeles CSS {{HTMLVersionInline(5)}}, o píxeles o porcentaje en {{HTMLVersionInline(4)}}.</dd>
- <dt>{{htmlattrdef("usemap")}}</dt>
- <dd>La URL parcial (empezando con '#') de un <a href="https://developer.mozilla.org/en-US/docs/HTML/Element/map">mapa de imagea</a> asociado a un elemento.
- <div class="note">
- <p><strong>Nota: </strong>No puedes usar este atributo si el elemento <code>&lt;img&gt;</code> es descendiente de un elemento {{htmlelement("a")}} o {{HTMLElement("button")}}.</p>
- </div>
- </dd>
- <dt>{{htmlattrdef("vspace")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
- <dd>El número de píxeles de espacio blanco insertado sobre y bajo la imagen.</dd>
-</dl>
-
-<h2 id="Formatos_de_imagen_soportada">Formatos de imagen soportada</h2>
-
-<p>El estándar de HTML no ofrece una lista de formatos de imagen soportados, de modo que cada agente de usuario soporta diferentes conjuntos de formatos. Gecko soporta:</p>
-
-<ul>
- <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/JPEG">JPEG</a></li>
- <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/Graphics_Interchange_Format">GIF</a>, including animated GIFs</li>
- <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/Portable_Network_Graphics">PNG</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Animated_PNG_graphics">APNG</a> {{gecko_minversion_inline("1.9.2")}}</li>
- <li><a href="https://developer.mozilla.org/en-US/docs/SVG">SVG</a> {{gecko_minversion_inline("2.0")}}</li>
- <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/BMP_file_format">BMP</a></li>
- <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/ICO_%28file_format%29">BMP ICO</a></li>
- <li><a class="external external-icon" href="http://en.wikipedia.org/wiki/ICO_%28file_format%29">PNG ICO</a> {{gecko_minversion_inline("9.0")}}</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota:</strong><br>
- Soporte para formato <a class="external external-icon" href="http://en.wikipedia.org/wiki/X_BitMap">XBM</a> fue eliminado en Gecko 1.9.2.</p>
-</div>
-
-<h2 id="Interacción_con_CSS">Interacción con CSS</h2>
-
-<p>Respecto a CSS, <code>una &lt;img&gt;</code> es un <a href="https://developer.mozilla.org/es/docs/Web/CSS/Elemento_reemplazo">elemento de reemplazo</a>. No tiene base, asi que cuando las imágenes se usan en un contexto de formato en línea con {{cssxref("vertical-align")}}: <code>baseline</code>, el bajo de la imagen se posa sobre la base del contenedor.</p>
-
-<p>Dependiendo de su tipo, una imagen puede tener ancho y alto intrínseco, pero no necesariamente. Por ejempo, las imagenes SVG no tienen dimensiones intrínsecas.</p>
-
-<h2 id="Ejemplo_1">Ejemplo 1</h2>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-sm.png<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>MDN<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<p><img alt="MDN" src="https://developer.cdn.mozilla.net/media/img/mdn-logo-sm.png"></p>
-
-<h2 id="Ejemplo_2_Enlace_con_imagen">Ejemplo 2: Enlace con imagen</h2>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>a</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>https://developer.mozilla.org/<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-sm.png<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>MDN<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>a</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<p><a href="https://developer.mozilla.org/"><img alt="MDN" src="https://developer.cdn.mozilla.net/media/img/mdn-logo-sm.png"> </a></p>
-
-<h2 id="Ejemplo_3_Uso_del_atributo_srcset">Ejemplo 3: Uso del atributo <code>srcset</code></h2>
-
-<p>El atributo <code>src</code> es un candidato en agentes de usuario <code>1x</code> que soporta <code>srcset.</code></p>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-sm.png<span class="punctuation token">"</span></span>
-      <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>MDN<span class="punctuation token">"</span></span>
-      <span class="attr-name token">srcset</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>mdn-logo-HD.png 2x<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<h2 id="Ejemplo_4_Uso_de_atributos_srcset_y_sizes">Ejemplo 4: Uso de atributos <code>srcset</code> y <code>sizes</code></h2>
-
-<p>El atributo<code> src</code> es ignorado en agentes de usuario que soportan <code>srcset</code> cuando usan descriptores <code>'w'</code>. Cuando la condición de media <code>(min-width: 600px)</code> encaja, la imagen será 200px de ancho, de otra manera será 50vw de ancho (50% del ancho del dispositivo).</p>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>clock-demo-thumb-200.png<span class="punctuation token">"</span></span>
-      <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>Clock<span class="punctuation token">"</span></span>
-      <span class="attr-name token">srcset</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>clock-demo-thumb-200.png 200w, clock-demo-thumb-400.png 400w<span class="punctuation token">"</span></span>
-      <span class="attr-name token">sizes</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>(min-width: 600px) 200px, 50vw<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<article class="approved text-content">
-<div class="boxed translate-rendered">
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}}</td>
-   <td>{{Spec2('Referrer Policy')}}</td>
-   <td>Añadida la política del atributo<code> referrer</code></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'embedded-content.html#the-img-element', '&lt;img&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'embedded-content-0.html#the-img-element', '&lt;img&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/objects.html#h-13.2', '&lt;img&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>srcset</code></td>
-   <td>{{CompatChrome(34.0)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("32.0")}}<sup>[2]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera(21)}}</td>
-   <td>{{CompatSafari(7.1)}}</td>
-  </tr>
-  <tr>
-   <td><code>referrerpolicy</code></td>
-   <td>{{CompatChrome(46.0)}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("42.0")}}<sup>[3]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>srcset</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(34.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>21</td>
-   <td>iOS 8</td>
-   <td>{{CompatChrome(34.0)}}</td>
-  </tr>
-  <tr>
-   <td><code>referrerpolicy</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(46.0)}} [1]</td>
-   <td>{{CompatGeckoMobile("42.0")}}<sup>[3]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(46.0)}}<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Implementado como <code>referrerpolicy</code>  y tras una bandera.</p>
-
-<p>[2] Implementado tras una preferencia.</p>
-
-<p>[3] Desde Firefox 42 a Firefox 44, el atributo se llamó <code>referrer</code>.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{HTMLElement("picture")}}, {{HTMLElement("object")}} and {{HTMLElement("embed")}} elements</li>
-</ul>
-</div>
-</article>
diff --git a/files/es/web/html/elemento/index.html b/files/es/web/html/elemento/index.html
deleted file mode 100644
index 537ca3cd41..0000000000
--- a/files/es/web/html/elemento/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: Referencia de Elementos HTML
-slug: Web/HTML/Elemento
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-  - básico
-translation_of: Web/HTML/Element
----
-<div>{{HTMLSidebar("Elements")}}</div>
-
-<p><span class="seoSummary">Esta página lista todos los {{Glossary("Element","elementos")}} {{Glossary("HTML")}}</span>. Están agrupados por funciones para ayudarte a encontrar lo que tienes en mente con facilidad. Aunque esta guía está escrita para aquellos que son nuevos escribiendo código, se pretende que sea una referencia útil para cualquiera.</p>
-
-<div class="note">
-<p>Para más información básica acerca de los elementos y atributos HTML, vea <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Introduction#Elements_%E2%80%94_the_basic_building_blocks">la sección sobre elementos en el artículo 'Introducción a HTML'</a>.</p>
-</div>
-
-<h2 id="Raíz_principal">Raíz principal</h2>
-
-<p>{{HTMLRefTable("HTML Root Element")}}</p>
-
-<h2 id="Metadatos_del_documento">Metadatos del documento</h2>
-
-<p>Los metadatos contienen información sobre la página. Esto incluye información sobre estilos, <em>scripts</em> y datos que ayudan al <em>software</em> ({{Glossary("search engine", "search engines")}}, {{Glossary("Browser","browsers")}}, etc.) a usar y generar la página. Los metadatos de estilos y <em>scripts</em> pueden estar definidos en la página o estar enlazados a otro fichero que contiene la información.</p>
-
-<p>{{HTMLRefTable("HTML Document Metadata")}}</p>
-
-<h2 id="Seccionamiento_básico">Seccionamiento básico</h2>
-
-<p>{{HTMLRefTable("Sectioning Root Element")}}</p>
-
-<h2 id="Seccionamiento_del_contenido">Seccionamiento del contenido</h2>
-
-<p>Los elementos de seccionamiento del contenido te permiten organizar los contenidos del documento en partes lógicas. Usa los elementos de seccionado para crear una descripción amplia de los contenidos de tu página, incluyendo el encabezado y pie de página y elementos para identificar secciones.</p>
-
-<p>{{HTMLRefTable("HTML Sections")}}</p>
-
-<h2 id="Contenido_del_texto">Contenido del texto</h2>
-
-<p>Utiliza los elementos HTML de contenido del texto para organizar bloques o secciones de contenido colocados entre los tags de apertura{{HTMLElement("body")}} y cierre. Es importante para la {{Glossary("accessibility")}} y el {{Glossary("SEO")}}, que estos elementos se identifiquen con el objetivo o la estructura de ese contenido.</p>
-
-<p>{{HTMLRefTable("HTML Grouping Content")}}</p>
-
-<h2 id="Semántica_del_texto_en_línea">Semántica del texto en línea</h2>
-
-<p>Utilice la semántica del texto en línea HTML para definir el significado, estructura, o el estilo de una palabra, una línea o cualquier pieza arbitraria de texto.</p>
-
-<p>{{HTMLRefTable("HTML Text-Level Semantics")}}</p>
-
-<h2 id="Imagen_y_multimedia">Imagen y multimedia</h2>
-
-<p>HTML soporta varios recursos multimedia como imágenes, audio, y video.</p>
-
-<p>{{HTMLRefTable("multimedia")}}</p>
-
-<h2 id="Contenido_incrustado">Contenido incrustado</h2>
-
-<p>Además de los contenidos multimedia habituales, HTML puede incluir otra variedad de contenidos, aunque no siempre es fácil de interactuar con ellos.</p>
-
-<p>{{HTMLRefTable({"include":["HTML embedded content"], "exclude":["multimedia"]})}}</p>
-
-<h2 id="Scripting">Scripting</h2>
-
-<p>Con el fin de crear contenido dinámico y aplicaciones Web, HTML soporta el uso de lenguajes de scripting, el más prominente es JavaScript. Ciertos elementos soportan esta capacidad.</p>
-
-<p>{{HTMLRefTable("HTML Scripting")}}</p>
-
-<h2 id="Ediciones_demarcadas">Ediciones demarcadas</h2>
-
-<p>Estos elementos permiten proporcionar indicios de que determinadas partes del texto han sido alteradas.</p>
-
-<p>{{HTMLRefTable("HTML Edits")}}</p>
-
-<h2 id="Tablas">Tablas</h2>
-
-<p>Estos elementos son usados para crear y manejar datos tabulados.</p>
-
-<p>{{HTMLRefTable("HTML tabular data")}}</p>
-
-<h2 id="Formularios">Formularios</h2>
-
-<p>HTML provee un número de elementos que pueden usarse conjuntamente para crear formularios los cuales el usuario puede completar y enviar al sitio Web o a una aplicación. Hay una gran cantidad de información acerca de ésto disponible en la <a href="/en-US/docs/Web/Guide/HTML/Forms">HTML forms guide</a>.</p>
-
-<p>{{HTMLRefTable({"include": ["HTML forms"], "exclude":["Deprecated"]})}}</p>
-
-<h2 id="Elementos_Interactivos">Elementos Interactivos</h2>
-
-<p>HTML ofrece una selección de elementos que pueden ayudar a crear objetos de interfaz de usuario interactivos.</p>
-
-<p>{{HTMLRefTable("HTML interactive elements")}}</p>
-
-<h2 id="Componentes_Web">Componentes Web</h2>
-
-<p>Los Componentes Web son una tecnología relacionada con HTML que hacen que sea posible, en esencia, crear y personalizar elementos como si fueran HTML normal. Además, pueden crear versiones personalizadas de los elementos HTML estándar.</p>
-
-<p>{{HTMLRefTable({"include":["Web Components"],"elements":["shadow"]})}}</p>
-
-<h2 id="Elementos_obsoletos_y_en_desuso">Elementos obsoletos y en desuso</h2>
-
-<div class="warning" style="font-size: 14px;">
-<p><strong>Advertencia:</strong> Estos son elementos HTML viejos los cuales están obsoletos y no deben usarse. <strong>Nunca debería usarlos en un nuevo proyecto y debería reemplazarlos en proyectos viejos tan pronto como sea posible.</strong> Se listan aquí solo con propósitos informativos.</p>
-</div>
-
-<p>{{HTMLRefTable({"include":["Deprecated","Obsolete"]})}}</p>
diff --git a/files/es/web/html/elemento/input/botón/index.html b/files/es/web/html/elemento/input/botón/index.html
deleted file mode 100644
index 7fbe354405..0000000000
--- a/files/es/web/html/elemento/input/botón/index.html
+++ /dev/null
@@ -1,254 +0,0 @@
----
-title: <input type ="button">
-slug: Web/HTML/Elemento/input/Botón
-tags:
-  - Elemento
-  - Elemento Input
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Element/input/button
----
-<p>{{HTMLRef}}</p>
-
-<p><span class="seoSummary">El elemento HTML <code><strong>&lt;input type="button"&gt;</strong></code> es una versión específica del elemento <strong><code>&lt;input&gt;</code></strong><code>,</code> que se usa para crear un botón en el que se puede hacer click sin ningún valor por defecto, es decir, <strong>no tiene un comportamiento predeterminado</strong> como por ejemplo <span class="seoSummary"><code><strong>&lt;input type="reset"&gt;</strong></code></span> <span class="seoSummary">. En HTML5  ha sido sustituido  por el elemento <strong><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button">&lt;button&gt;</a></strong>.</span></span></p>
-
-<p>Los navegadores generan un controlador para un botón clickable sin valor por defecto. El botón puede contener cualquier texto. El controlador puede varíar de un navegador a otro.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Categorías de contenido</a></th>
-   <td><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Contenido de flujo</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">contenido de fraseo</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Interactive_content" title="HTML/Content categories#Interactive content">contenido interactivo</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">listado</a>, <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">etiquetable</a>, y elementos <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form_submittable" title="HTML/Content categories#Form submittable">entregables</a> con <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Form-associated_" title="HTML/Content categories#Form-associated ">contenido asociado a los formularios</a>, contenido evidente.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Contenido de fraseo</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>Ninguna, las etiquetas de inicio y cierre son obligatorias.</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement" title="The HTMLButtonElement interface provides properties and methods (beyond the &lt;button> object interface it also has available to them by inheritance) for manipulating the layout and presentation of button elements."><code>HTMLButtonElement</code></a></td>
-  </tr>
-  <tr>
-   <th scope="row">Tipo de elemento</th>
-   <td>Inline</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento puede tener cualquiera de los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a> además de los siguientes:</p>
-
-<dl>
- <dt>{{htmlattrdef("disabled")}}</dt>
- <dd>
- <p>Este atributo booleano indica que el usuario no puede interactuar con el botón. Si este atributo no está especificado, el botón hereda su configuración del elemento contenedor, por ejemplo, {{HTMLElement("fieldset")}}; si no hay elemento contenedor con el atributo <code><strong>disabled</strong></code> establecido, el botón estará habilitado. El valor de control desactivado no es enviado con el formulario y el evento <code>click</code> <a class="external" href="https://html.spec.whatwg.org/multipage/forms.html#enabling-and-disabling-form-controls:-the-disabled-attribute">no será enviado</a> en los controles desactivados.</p>
- </dd>
- <dd>
- <p>Firefox, al contrario que otros navegadores, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">mantiene por defecto el estado de desactivación dinámico</a> de un {{HTMLElement("button")}} a lo largo de las cargas de la página. Use el atributo {{htmlattrxref("autocomplete","button")}} para controlar esta característica.</p>
- </dd>
- <dt>{{htmlattrdef("autofocus")}} {{HTMLVersionInline(5)}}</dt>
- <dd>Este atributo booleano le permite especificar que el botón deba tener el foco cuando la página se cargue, a no ser que el usuario lo anule, por ejemplo, escribiendo en otro cuadro de texto. Únicamente un elemento asociado con los formularios en un documento puede tener este atributo especificado.</dd>
- <dt>{{htmlattrdef("autocomplete")}} {{non-standard_inline}}</dt>
- <dd>El uso de este atributo en un {{HTMLElement("button")}} es algo fuera de lo común, y específico de Firefox. Firefox, por defecto y al contrario de otros navegadores, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">mantiene por defecto el estado de desactivación dinámico</a> de un {{HTMLElement("button")}} a lo largo de las cargas de la página. Establecer el valor de este atributo a <code>off</code> (<code>autocomplete="off"</code>) desactiva esta característica.</dd>
- <dt>{{htmlattrdef("form")}} {{HTMLVersionInline(5)}}</dt>
- <dd>El elemento del formulario con el que el botón está asociado (es <em>dueño del formulario</em>). El valor del atributo debe ser el atributo <strong>id</strong> de un elemento {{HTMLElement("form")}} en el mismo documento. Si este atributo no está especificado, el elemento <code>&lt;button&gt; </code>debe ser hijo de un elemento "formulario". Este atributo le permite colocar elementos <code>&lt;button&gt;</code> en cualquier lugar de un documento, y no únicamento como hijos del elemento {{HTMLElement("form")}}.</dd>
- <dt>{{htmlattrdef("formenctype")}}</dt>
- <dd>Debido a que el elemento de input es un botón de envío, el atributo <code><strong>formenctype</strong></code> especifica el tipo de contenido que se usa para enviar el formulario al servidor. Los valores posibles son:
- <ul>
-  <li><code>application/x-www-form-urlencoded</code>: Valor por defecto si el atributo no se especifica.</li>
-  <li><code>multipart/form-data</code>: Este valor se usa si un elemento {{HTMLElement("input")}} es usado con el atributo {{htmlattrxref("type","input")}} fijado a <code>file</code>.</li>
-  <li><code>text/plain</code></li>
- </ul>
-
- <p>Si este atributo se especifica, ignora el atributo {{htmlattrxref("enctype","form")}} del formulario dueño del botón.</p>
- </dd>
- <dt>{{htmlattrdef("formaction")}} {{HTMLVersionInline(5)}}</dt>
- <dd>La URI de la aplicación que procesa la información enviada por le botón. Si se especifica se anula el atributo {{htmlattrxref("action","form")}} del formulario dueño del botón.</dd>
- <dt>{{htmlattrdef("formmethod")}}</dt>
- <dd>Debido a que el elemento input es un botón de envío, el atributo <code><strong>formmethod</strong></code> especifica el método HTTP que el navegador utilizará para enviar el formulario. Los valores posibles son:
- <ul>
-  <li><code>post</code>: Los datos del formulario son incluidos en su cuerpo y son enviados al servidor.</li>
-  <li><code>get</code>: Los datos del formulario son agregados a la URI del formulario, utilizando un símbolo '?' como separador, la URI resultante es enviada al servidor. Use este método cuando el formulario no tenga efectos secundarios y contenga solo caracteres ASCII.</li>
- </ul>
-
- <p>Si se especifica, este atributo anula el atributo {{htmlattrxref("method","form")}} del formulario dueño del elemento.</p>
- </dd>
- <dt>{{htmlattrdef("formnovalidate")}}</dt>
- <dd>Debido a que el elemento de input es un botón de envío, el atributo <code><strong>formnovalidate </strong></code> especifica que el formulario no debe ser validado cuando sea enviado. Si este atributo es especificado, se anula el atributo {{htmlattrxref("novalidate","form")}} del formulario dueño del elemento. Este atributo es Booleano.</dd>
- <dt>{{htmlattrdef("formtarget")}}</dt>
- <dd>Debido a que el elemento de input es un botón de envío, el atributo <code><strong>formtarget</strong></code> es un nombre o palabra clave que indica donde mostrar la respuesta recibida después de enviar el formulario. Este es un nombre de, o palabra clave para, un <em>contexto navegable</em> (por ejemplo, pestaña, ventana, o inline frame). Si este atributo es especificado, se sobreescribirá el atributo {{htmlattrxref("target", "form")}} del formulario dueño del elemento. Las siguientes palabras claves tienen significados especiales:
- <ul>
-  <li>_<code>self</code>: Carga la respuesta en el mismo contexto navegable<em> </em>que el actual. Este valor es el predeterminado si el atributo no es especificado.</li>
-  <li><code>_blank</code>: Carga la respuesta en un nuevo contexto navegable sin nombre.</li>
-  <li><code>_parent</code>: Carga la respuesta en el contexto navegable padre del actual. Si no hay padre, esta opción se comporta igual que <code>_self</code>.</li>
-  <li><code>_top</code>: Carga la respuesta en el contexto navegable superior (es el contexto navegable que es un ancestro del actual y no tiene padre). Si no hay padre, esta opción se comporta igual que <code>_self</code>.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("name")}}</dt>
- <dd>El nombre del botón que será enviado con los datos del formulario.</dd>
- <dt>{{htmlattrdef("type")}}</dt>
- <dd>El tipo dle botón. Los valores posibles son:
- <ul>
-  <li><code>submit</code>: El botón envía los datos del formulario al servidor. Este es el valor predeterminado si no se especifica el atributo, o si el atributo es cambiado dinámicamente a un valor inválido o vacío.</li>
-  <li><code>reset</code>: El botón reinicia todos los controles a sus valores iniciales.</li>
-  <li><code>button</code>: El botón no tiene comportamiento predeterminado. Puede haber scripts de la parte del cliente asociados a los eventos del elemento, que serán lanzados cuando el evento ocurra.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("value")}}</dt>
- <dd>El valor inicial del botón.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Se crea un nuevo input tipo botón con el valor 'Click me'. </p>
-
-<pre class="brush: html">&lt;input type="button" value="Click me"&gt;</pre>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table" style="height: 137px; width: 1065px;">
- <tbody>
-  <tr>
-   <td>Especificación</td>
-   <td>Status</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'the-button-element.html#the-button-element', '&lt;button&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-button-element', '&lt;button&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.5', '&lt;button&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>formenctype</code> attribute</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.6</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>formmethod</code> attribute</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>autofocus</code> attribute</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>9.6</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td><code>formaction</code> attribute</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>formenctype</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>formmethod</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>formaction</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<p> </p>
-
-<ul>
- <li>El elemento genérico {{HTMLElement("input")}} y la interface usada para manipularlo, {{domxref("HTMLInputElement")}}</li>
- <li>El reemplazo en HTML5 para <strong>&lt;input type="button"&gt;</strong>, el elemento <strong><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button">&lt;button&gt;</a></strong>.</li>
-</ul>
diff --git a/files/es/web/html/elemento/input/checkbox/index.html b/files/es/web/html/elemento/input/checkbox/index.html
deleted file mode 100644
index 1798198434..0000000000
--- a/files/es/web/html/elemento/input/checkbox/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: <input type="checkbox">
-slug: Web/HTML/Elemento/input/checkbox
-translation_of: Web/HTML/Element/input/checkbox
----
-<p><span class="seoSummary">El elemento HTML <strong><code>&lt;input type="checkbox"&gt;</code></strong> es un elemento de entrada que te permite insertar un vector o array de valores. El atributo <strong>value</strong> es usado para definr el valor enviado por el <strong>checkbox</strong>. El atributo <strong>checked</strong> se usa para indicar que el elemento está seleccionado. El atributo <strong>indeterminate</strong> se usa para indicar que el <strong>checkbox</strong> esta en un estado indeterminado (en la mayoria de las plataformas, esto dibuja una linea horizontal que atraviesa el <strong>checkbox</strong>).</span></p>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento posee los "<a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes">atributos globales</a>".</p>
-
-<dl>
- <dt>{{htmlattrdef("checked")}}</dt>
- <dd>
- <p>Cuando el valor del atributo <strong>type</strong> es <strong><code>checkbox</code></strong>, la presencia de este atributo booleano indica que el control se selecciona de forma predeterminada; de lo contrario, se ignora.</p>
- </dd>
- <dt>{{htmlattrdef("value")}}</dt>
- <dd>El valor inicial de control. Si se omite la propiedad <strong>value</strong>, el resultado<strong> </strong>devuelto al leer esta propiedad será la cadena <strong>on.</strong></dd>
- <dd>Tenga en cuenta que al volver a cargar la pagina, Gecko y IE  <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=46845#c186">ignorarán el valor especificado en el  código HTML</a>, si el valor se cambió antes de la recarga.</dd>
- <dt>{{htmlattrdef("indeterminate")}}</dt>
- <dd>Indica que la casilla de verificación está en un estado indeterminado (en la mayoría de las plataformas, dibuja una línea horizontal a través del checkbox).</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html">&lt;label&gt;&lt;input type="checkbox" id="cbox1" value="first_checkbox"&gt; Este es mi primer checkbox&lt;/label&gt;&lt;br&gt;
-
-&lt;input type="checkbox" id="cbox2" value="second_checkbox"&gt; &lt;label for="cbox2"&gt;Este es mi segundo checkbox&lt;/label&gt;
-</pre>
-
-<p>Esto crea dos casillas de verificación, que se ven así:</p>
-
-<p>{{EmbedLiveSample("Ejemplo")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Especificación</td>
-   <td>Estatus</td>
-  </tr>
-  <tr>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#checkbox-state-(type=checkbox)', '&lt;checkbox&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#checkbox-state-(type=checkbox)', '&lt;checkbox&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#checkbox', '&lt;checkbox&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">Caracteristicas
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th> </th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7 or earlier")}}</td>
-   <td>2 or earlier</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=checkbox</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7 or earlier")}}<br>
-    {{CompatGeckoDesktop("1.9.2")}} for <code>indeterminate</code> value</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristicas </th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=checkbox</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p id="See_also"> </p>
diff --git a/files/es/web/html/elemento/input/color/index.html b/files/es/web/html/elemento/input/color/index.html
deleted file mode 100644
index 09773888f0..0000000000
--- a/files/es/web/html/elemento/input/color/index.html
+++ /dev/null
@@ -1,308 +0,0 @@
----
-title: <input type="color">
-slug: Web/HTML/Elemento/input/color
-tags:
-  - Elemento
-  - Entrada
-  - Formulários HTML
-  - HTML
-  - Referencia
-  - Selector de colores
-  - color
-  - formulários
-translation_of: Web/HTML/Element/input/color
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">Los elementos {{HTMLElement("input")}} del tipo «<code><strong>color</strong></code>» proporciona un elemento de interfaz de usuario que permite a los usuarios especificar un color, bien mediante una interfaz visual de selección, bien a través de un cuadro de texto donde ingresar un valor hexadecimal en el formato «<code>#rrggbb</code>».</span> Solo se permiten colores simples (sin canal alfa). Los valores son compatibles con CSS.</p>
-
-<p>La presentación del elemento puede variar considerablamente entre navegadores y plataformas: podría ser un campo de entrada sencillo que valida automáticamente que la entrada esté en el formato adecuado, o podría lanzar un selector de colores estándar de la plataforma, o incluso podría abrir una ventana de colores personalizada.</p>
-
-<div id="summary_example1">
-<pre class="brush: html">&lt;input type="color"&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample("summary_example1", 700, 30)}}</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td><strong>{{anch("Value")}}</strong></td>
-   <td>Una {{domxref("DOMString")}} de siete caracteres que especifica un {{cssxref("&lt;color&gt;")}} en notación hexadecimal en minúsculas</td>
-  </tr>
-  <tr>
-   <td><strong>Sucesos</strong></td>
-   <td>{{event("change")}} e {{event("input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos comunes admitidos</strong></td>
-   <td>{{htmlattrxref("autocomplete", "input")}} y {{htmlattrxref("list", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos IDL</strong></td>
-   <td><code>list</code> y <code>value</code></td>
-  </tr>
-  <tr>
-   <td><strong>Métodos</strong></td>
-   <td>{{domxref("HTMLInputElement.select", "select()")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Valor">Valor</h2>
-
-<p>El {{htmlattrxref("value", "input")}} de un elemento {{HTMLElement("input")}} del tipo «<code>color</code>» es siempre una {{domxref("DOMString")}} que contiene una cadena de siete caracteres en la que se especifica un color RGB de manera hexadecimal. Aunque es posible introducir el color tanto en mayúsculas como en minúsculas, este se almacena en minúsculas. El valor nunca presenta otra forma y nunca está vacío.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: definir el valor a cualquier cosa que no sea un color válido, totalmente opaco y contenido dentro del espacio RGB <em>en notación hexadecimal</em> causará que el valor se establezca a «<code>#000000</code>». En particular, no es posible utilizar los nombres de colores estandarizados de CSS ni cualquier sintaxis de función CSS para definir el valor. Esto tiene sentido si se tiene en cuenta que HTML y CSS son lenguajes y especificaciones independientes. Por otra parte, no se admiten los colores que incluyan un canal alfa; definir un color en la notación hexadecimal de nueve caracteres (p. ej., <code>#009900aa</code>) también provocará que el valor se establezca a «<code>#000000</code>».</p>
-</div>
-
-<h2 id="Uso_de_las_entradas_de_color">Uso de las entradas de color</h2>
-
-<p>Las entradas del tipo «<code>color</code>» son sencillas debido al número limitado de atributos que admiten.</p>
-
-<h3 id="Proporcionar_un_color_predeterminado">Proporcionar un color predeterminado</h3>
-
-<p>Puede actualizar el ejemplo simple anterior para definir un valor predeterminado, de manera que el botón muestrario de colores tenga precargado ese color y el selector de colores (si lo hay) se abra con ese color preseleccionado también:</p>
-
-<pre class="brush: html">&lt;input type="color" value="#ff0000"&gt;</pre>
-
-<p>{{EmbedLiveSample("Providing_a_default_color", 700, 30)}}</p>
-
-<p>Si no especifica un valor, se utilizará «<code>#000000</code>», negro, de manera predeterminada. El valor debe especificarse en la notación hexadecimal de siete caracteres; esto es, el carácter «#» seguido de dos dígitos para representar el rojo, el verde y el azul: «<code>#rrggbb</code>». Si utiliza colores especificados en cualquier otro formato (como los nombres de colores CSS o las funciones cromáticas de CSS como <code>rgb()</code> o <code>rgba()</code>), deberá convertirlos en valores hexadecimales antes de definir <code>value</code>.</p>
-
-<h3 id="Llevar_un_seguimiento_de_los_cambios_de_color">Llevar un seguimiento de los cambios de color</h3>
-
-<p>Como sucede con otros tipos de {{HTMLElement("input")}}, existen dos sucesos que pueden emplearse para detectar cambios en el valor de color: {{event("input")}} y {{event("change")}}. El suceso <code>input</code> se desencadena en el elemento <code>&lt;input&gt;</code> siempre que cambia el color. El suceso <code>change</code> se desencadena cuando el usuario cierra el selector de colores. En ambos casos, puede determinar el valor nuevo del elemento al examinar su {{domxref("HTMLInputElement.value", "value")}}.</p>
-
-<p>Este ejemplo vigila los cambios del valor de color en el tiempo:</p>
-
-<pre class="brush: js">colorPicker.addEventListener("input", actualizarPrimero, false);
-colorPicker.addEventListener("change", watchColorPicker, false);
-
-function watchColorPicker(event) {
-  document.querySelectorAll("p").forEach(function(p) {
-    p.style.color = event.target.value;
-  });
-}
-</pre>
-
-<h3 id="Seleccionar_el_valor">Seleccionar el valor</h3>
-
-<p>Si la implementación del elemento {{HTMLElement("input")}} del tipo «<code>color</code>» en el navegador del usuario no admite un botón muestrario, y es en cambio un campo de texto para escribir directamente la cadena de color, podrá utilizar el método {{domxref("HTMLInputElement.select", "select()")}} para seleccionar el texto actualmente presente en el campo editable. Si el navegador utiliza en su lugar un botón muestrario, <code>select()</code> no hace nada. Debe tener presente este comportamiento para que su código pueda responder adecuadamente en cada caso.</p>
-
-<pre class="brush: js">muestrario.select();</pre>
-
-<h3 id="Variaciones_de_apariencia">Variaciones de apariencia</h3>
-
-<p>Como se mencionó anteriormente, cuando un navegador no admite una interfaz de selección de colores, su implementación de las entradas de color viene en forma de un cuadro de texto que valida su contenido automáticamente para garantizar que el valor esté en el formato adecuado. Por ejemplo, en Safari 10.1 verá algo como esto:</p>
-
-<p><img alt="Screenshot of the example taken in Safari." src="https://mdn.mozillademos.org/files/14899/input-color-safari.png" style="border-style: solid; border-width: 1px; height: 160px; width: 598px;"></p>
-
-<p>El mismo contenido luce así en Firefox 55:</p>
-
-<p><img alt="Screenshot of the example taken in Firefox 55 for macOS" src="https://mdn.mozillademos.org/files/14901/input-color-firefox.png" style="border-style: solid; border-width: 1px; height: 160px; width: 598px;"></p>
-
-<p>En este caso, al pulsar en el muestrario de colores aparecerá el selector de la plataforma desde el cual elegir un color (en el ejemplo, el selector de macOS):</p>
-
-<p><img alt="Screenshot of the element with the color picker open in Firefox Mac." src="https://mdn.mozillademos.org/files/14903/input-with-picker-firefox-mac.png" style="border-style: solid; border-width: 1px; height: 405px; width: 682px;"></p>
-
-<h2 id="Validación">Validación</h2>
-
-<p>El valor de una entrada de colores se considera no válido si el {{Glossary("user agent")}} no es capaz de convertir la entrada del usuario en la notación hexadecimal de siete caracteres minúsculos. Cuando se da esta situación, se aplica la pseudoclase {{cssxref(":invalid")}} al elemento.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Creemos un ejemplo que realice algo más con la entrada de color a través de la monitorización de los sucesos {{event("change")}} y {{event("input")}} para tomar el color nuevo y aplicarlo a cada uno de los elementos {{HTMLElement("p")}} del documento.</p>
-
-<h3 id="HTML">HTML</h3>
-
-<p>El código HTML es bastante sencillo: un par de párrafos de material descriptivo con un {{HTMLElement("input")}} del tipo «<code>color</code>» con el identificador «<code>muestrario</code>», el cual utilizaremos para modificar el color del texto de los párrafos.</p>
-
-<pre class="brush: html">&lt;p&gt;Este ejemplo demuestra la utilización del control &lt;code&gt;&amp;lt;input type="color"&amp;gt;&lt;/code&gt;.&lt;/p&gt;
-
-&lt;label for="muestrario"&gt;Color:&lt;/label&gt;
-&lt;input type="color" value="#ff0000" id="muestrario"&gt;
-
-&lt;p&gt;Observe cómo el color de los párrafos cambia cuando manipula el selector de colores.
-   A medida que realiza cambios en el selector, el color del primer párrafo cambia,
-   a manera de previsualización (esto usa el suceso &lt;code&gt;input&lt;/code&gt;).
-   Cuando cierra el selector, se desencadena el suceso &lt;code&gt;change&lt;/code&gt;
-   y podemos detectarlo para cambiar todos los párrafos al color elegido.&lt;/p&gt;</pre>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<p>Primero hay que realizar un poco de configuración. Aquí estableceremos algunas variables, una de las cuales contendrá el color que definiremos en el botón muestrario durante la primera carga y, a continuación, configurará un manejador para {{event("load")}} para realizar el trabajo de inicialización cuando termine de cargarse la página.</p>
-
-<pre class="brush: js">var muestrario;
-var colorPredeterminado = "#0000ff";
-
-window.addEventListener("load", startup, false);
-</pre>
-
-<h4 id="Inicialización">Inicialización</h4>
-
-<p>Una vez que se haya cargado la página, se realizará una llamada a nuestro manejador del suceso <code>load</code>, <code>startup()</code>:</p>
-
-<pre class="brush: js">function startup() {
-  muestrario = document.querySelector("#muestrario");
-  muestrario.value = colorPredeterminado;
-  muestrario.addEventListener("input", actualizarPrimero, false);
-  muestrario.addEventListener("change", actualizarTodo, false);
-  muestrario.select();
-}
-</pre>
-
-<p>Esto obtiene una referencia al elemento de color <code>&lt;input&gt;</code> en una variable denominada <code>muestrario</code> y, acto seguido, define el valor de la entrada de color al valor de <code>colorPredeterminado</code>. Después, el suceso {{event("input")}} de la entrada de color se configura para llamar a nuestra función <code>actualizarPrimero()</code> y el suceso {{event("change")}} se configura para llamar <code>actualizarTodo()</code>. Ambos pueden apreciarse a continuación.</p>
-
-<p>Por último, llamamos {{domxref("HTMLInputElement.select", "select()")}} para seleccionar el contenido de texto de la entrada de color input en caso de que el control se haya implementado como un cuadro de texto (lo cual no producirá ningún efecto si se ha brindado una interfaz de selección de colores en su lugar).</p>
-
-<h4 id="Reaccionar_a_cambios_de_color">Reaccionar a cambios de color</h4>
-
-<p>Proveemos dos funciones que se ocupan de los cambios de color. La función <code>actualizarPrimero()</code> se llama en respuesta al suceso <code>input</code>. Esta modifica el color del primer elemento de párrafo del documento para que corresponda con el nuevo valor de la entrada de color. Como los sucesos <code>input</code> se desencadenan cada vez que se realiza un ajuste al valor (por ejemplo, si se aumenta el brillo del color), estos se producirán repetidamente mientras se manipule el selector de colores.</p>
-
-<pre class="brush: js">function actualizarPrimero(event) {
-  var p = document.querySelector("p");
-
-  if (p) {
-    p.style.color = event.target.value;
-  }
-}</pre>
-
-<p>Cuando se cierre el selector de colores, señalando que el valor dejará de cambiar (a menos que el usuario vuelva a abrir el selector), se envía el suceso <code>change</code> al elemento. Manejamos ese suceso a través de la función <code>actualizarTodo()</code>, sirviéndonos de {{domxref("HTMLInputElement.value", "Event.target.value")}} para obtener el color final seleccionado:</p>
-
-<pre class="brush: js">function actualizarTodo(event) {
-  document.querySelectorAll("p").forEach(function(p) {
-    p.style.color = event.target.value;
-  });
-}
-</pre>
-
-<p>Esto define el color de cada uno de los bloques {{HTMLElement("p")}} de manera que sus atributos {{cssxref("color")}} coincidan con el valor actual de la entrada de color, a la cual se hace referencia con {{domxref("Event.target", "event.target")}}.</p>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>El resultado final es el siguiente:</p>
-
-<p>{{EmbedLiveSample("Example", 700, 200)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'the-input-element.html#the-input-element')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-input-element')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.4')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Función</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Compatibilidad básica</td>
-   <td>20.0</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop(29)}} <sup><a href="#footnote_1">[1]</a></sup></td>
-   <td>{{CompatNo}}</td>
-   <td>11.01</td>
-   <td>10</td>
-  </tr>
-  <tr>
-   <td>{{htmlattrxref("list", "input")}}</td>
-   <td>20.0</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>{{htmlattrxref("autocomplete", "input")}}</td>
-   <td>20.0</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Función</th>
-   <th>Android</th>
-   <th>Firefox móvil (Gecko)</th>
-   <th>IE móvil</th>
-   <th>Opera móvil</th>
-   <th>Safari móvil</th>
-  </tr>
-  <tr>
-   <td>Compatibilidad básica</td>
-   <td>4.4</td>
-   <td>{{CompatGeckoMobile("27.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>{{htmlattrxref("list", "input")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>{{htmlattrxref("autocomplete", "input")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p id="footnote_1">[1] Firefox no admite aún las entradas del tipo «<code>color</code>» en Windows Touch.</p>
-
-<p>[2] Consulte {{bug(960984)}} para conocer el estado de compatibilidad del atributo <code>list</code> en Firefox.</p>
-
-<p>[3] Consulte {{bug(960989)}} para conocer el estado de compatibilidad del atributo <code>autocomplete</code> en Firefox. Puede modificar y obtener el valor del atributo, pero este no surte ningún efecto.</p>
diff --git a/files/es/web/html/elemento/input/date/index.html b/files/es/web/html/elemento/input/date/index.html
deleted file mode 100644
index a1c36c5530..0000000000
--- a/files/es/web/html/elemento/input/date/index.html
+++ /dev/null
@@ -1,567 +0,0 @@
----
-title: <input type="date">
-slug: Web/HTML/Elemento/input/date
-tags:
-  - Elemento
-  - Fecha
-  - Formulários HTML
-  - Inputs en formularios
-  - tipo Input
-translation_of: Web/HTML/Element/input/date
----
-<p>{{HTMLRef}}</p>
-
-<p>Los elementos de <span class="seoSummary">{{htmlelement("input")}} del tipo <strong><code>date</code></strong> crean campos de entrada que permiten a los usuarios proporcionar una fecha, bien a través de un cuadro de texto que valida automáticamente el contenido, o bien mediante una interfaz especial de selección de fechas.</span> El valor resultante incluye el año, el mes y el día, pero no la hora. Los tipos de entrada <a href="/en-US/docs/Web/HTML/Element/input/time">time</a> y <code><a href="/en-US/docs/Web/HTML/Element/input/datetime-local">datetime-local</a></code> admiten entradas de hora y de hora y fecha.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/input-date.html", "tabbed-shorter")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<p>La IU del control varía en función del navegador. Por el momento, la compatibilidad es dispersa; consulte {{anch("Compatibilidad entre navegadores")}} para obtener más detalles. En los navegadores no compatibles, el control se degrada sin problemas a un sencillo <code><a href="/en-US/docs/Web/HTML/Element/input/text">&lt;input type="text"&gt;.</a></code></p>
-
-<pre>&lt;input id="date" type="date"&gt;</pre>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/input-date.html", "tabbed-shorter")}}</div>
-
-<p>Entre los navegadores que admiten una interfaz personalizada para seleccionar fechas se encuentran Chrome y Opera, cuyo control luce así:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14909/date-picker-chrome.png"></p>
-
-<p>El control de fecha de Edge luce así:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14911/date-picker-edge.png"></p>
-
-<p>El control de Firefox luce así:</p>
-
-<p><img alt="Datepicker UI in firefox" src="https://mdn.mozillademos.org/files/15644/firefox_datepicker.png"></p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td><strong>{{anch("Valor")}}</strong></td>
-   <td>Una {{domxref("DOMString")}} que representa una fecha en el formato AAAA-MM-DD, o nada</td>
-  </tr>
-  <tr>
-   <td><strong>Eventos</strong></td>
-   <td>{{event("change")}} e {{event("input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos comunes admitidos</strong></td>
-   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("readonly", "input")}} y {{htmlattrxref("step", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos IDL</strong></td>
-   <td><code>list</code>, <code>value</code>, <code>valueAsDate</code>, <code>valueAsNumber</code>.</td>
-  </tr>
-  <tr>
-   <td><strong>Métodos</strong></td>
-   <td>{{domxref("HTMLInputElement.select", "select()")}}, {{domxref("HTMLInputElement.stepDown", "stepDown()")}}, {{domxref("HTMLInputElement.stepUp", "stepUp()")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Valor">Valor</h2>
-
-<p>Una {{domxref("DOMString")}} que representa el valor de la fecha proporcionada en la entrada. Es posible establecer un valor predeterminado para la entrada al incluir una fecha en el atributo {{htmlattrxref("value", "input")}}, de esta manera:</p>
-
-<pre>&lt;input id="date" type="date" value="2017-06-01"&gt;</pre>
-
-<p>{{EmbedLiveSample('Value', 600, 40)}}</p>
-
-<p>Cabe destacar que el formato de fecha mostrado difiere del <code>value</code> en sí: el formato de fecha mostrado se escogerá en función de la configuración regional del navegador del usuario, aunque el <code>value</code> de fecha siempre se formatee como <code>aaaa-mm-dd</code>.</p>
-
-<p>Es posible asimismo recuperar y establecer el valor de fecha en JavaScript mediante la propiedad {{domxref("HTMLInputElement.value", "value")}} del elemento de entrada; por ejemplo:</p>
-
-<pre>var dateControl = document.querySelector('input[type="date"]');
-dateControl.value = '2017-06-01';</pre>
-
-<p>Este código localiza el primer elemento {{HTMLElement("input")}} cuyo <code>type</code> sea <code>date</code> y define su valor a la fecha 2017-06-01 (1 de junio de 2017).</p>
-
-<h2 id="Atributos_adicionales">Atributos adicionales</h2>
-
-<p>Tenemos atributos adicionales tales como:</p>
-
-<p>{{page("/en-US/docs/Web/HTML/Element/input/number", "step-include")}}</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Attribute</th>
-   <th scope="col">Description</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>{{anch("max")}}</code></td>
-   <td>La fecha máxima aceptada.</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("min")}}</code></td>
-   <td>La fecha minima aceptada.</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("step")}}</code></td>
-   <td>El intervalo a usar, como cuando das click en las flechas, de cuanto en cuanto va avanzar o retroceder.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="htmlattrdef(max)">{{htmlattrdef("max")}}</h3>
-
-<p>La ultima fecha a aceptar. Si el{{htmlattrxref("value", "input")}} ingresado en el elemento esta después de esta fecha, el elemento cae <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">constraint validation</a>. Si el valor del <code>max</code> no es un valor valido, sigue el formato <code>yyyy-MM-dd</code>, donde el elemento no tiene máximo valor.</p>
-
-<p>Este valor debe ser especificado mayor o igual especificado por <code>min</code> attribute.</p>
-
-<h3 id="htmlattrdef(min)">{{htmlattrdef("min")}}</h3>
-
-<p>La minima fecha aceptada; Una fecha menor que esta caera <a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">constraint validation</a>. Si el valor es <code>min</code> el atributo no es valido y esa el formato <code>yyyy-MM-dd</code>, entonces el elemento no tiene valor minimo.</p>
-
-<p>Este valor debe especificarse como menor o igual<code>max</code> attribute.</p>
-
-
-
-
-
-
-
-
-
-
-
-
-
-<h3 id="htmlattrdef(step)">{{htmlattrdef("step")}}</h3>
-
-<p>{{page("/en-US/docs/Web/HTML/Element/input/number", "step-include")}}</p>
-
-<p>Para <code>date</code> input, el valor de <code>step</code> se da en dias, con una escala en factor de 86,400,000 (desde el valor numerico en millisegundos). El valor por defecto es <code>step</code> 1, indicando de un día a día.</p>
-
-<div class="blockIndicator note">
-<p>Specifying <code>any</code> as a value for the <code>step</code> attribute makes the same effect as it were equal to <code>1</code> for <code>date</code> inputs.</p>
-</div>
-
-<h2 id="Uso_de_las_entradas_de_fecha">Uso de las entradas de fecha</h2>
-
-<p>Las entradas de fecha suenan prácticas en un primer vistazo, ya que proveen una IU fácil de usar para seleccionar fechas y normalizan el formato de datos que se envía al servidor, sin importar la configuración regional del usuario. Sin embargo, existen problemas con <code>&lt;input type="date"&gt;</code> a causa de la compatibilidad limitada entre navegadores.</p>
-
-<p>Estudiaremos usos básicos y complejos de <code>&lt;input type="date"&gt;</code> y, posteriormente, brindaremos consejos para mitigar el problema de compatibilidad entre navegadores (consulte {{anch("Manejo de compatibilidad entre navegadores")}}). Evidentemente, con el tiempo es esperable que la compatibilidad entre navegadores se amplíe, lo que hará desaparecer este problema.</p>
-
-<h3 id="Usos_básicos_de_date">Usos básicos de <code>date</code></h3>
-
-<p>El uso más sencillo de <code>&lt;input type="date"&gt;</code> supone una combinación de un <code>&lt;input&gt;</code> básico y el elemento {{htmlelement("label")}}, como se indica a continuación:</p>
-
-<pre>&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="bday"&gt;Escriba su cumpleaños:&lt;/label&gt;
-    &lt;input type="date" id="bday" name="bday"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>{{EmbedLiveSample('Basic_uses_of_date', 600, 40)}}</p>
-
-<h3 id="Definir_los_límites_superior_e_inferior_de_la_fecha">Definir los límites superior e inferior de la fecha</h3>
-
-<p>Puede utilizar los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para restringir las fechas que el usuario puede seleccionar. En el ejemplo siguiente, definiremos como la fecha mínima <code>2017-04-01</code> y <code>2017-04-30</code> como la fecha máxima:</p>
-
-<pre>&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="party"&gt;Elija la fecha de festejo que prefiera:&lt;/label&gt;
-    &lt;input type="date" id="party" name="party" min="2017-04-01" max="2017-04-30"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>{{EmbedLiveSample('Setting_maximum_and_minimum_dates', 600, 40)}}</p>
-
-<p>Como resultado, solo es posible seleccionar los días del mes de abril de 2017; solo la parte de los días del valor de texto es modificable, y no se puede desplazar a ninguna fecha que caiga fuera de abril en la interfaz de selección de fechas.</p>
-
-<p><strong>Nota</strong>: debería ser capaz de utilizar el atributo {{htmlattrxref("step", "input")}} para variar el número de días que se recorren con cada incremento de fecha (p. ej., puede que desee que solo se puedan seleccionar los sábados). No obstante, esto no parece funcionar en ninguna implementación en el momento en que se redactó esta página.</p>
-
-<h3 id="Controlar_el_tamaño_de_la_entrada">Controlar el tamaño de la entrada</h3>
-
-<p><code>&lt;input type="date"&gt;</code> no admite los atributos de dimensionamiento de formularios como {{htmlattrxref("size", "input")}}. Deberá recurrir al <a href="/en-US/docs/Web/CSS">CSS</a> para satisfacer sus necesidades de dimensionamiento.</p>
-
-<h2 id="Validación">Validación</h2>
-
-<p>De manera predeterminada, <code>&lt;input type="date"&gt;</code> no aplica a ninguna validación a los valores introducidos. Las implementaciones de IU generalmente no le permiten escribir algo que no sea una fecha (lo cual es útil) pero aun así podrá dejar el campo vacío o incluso (en los navegadores que recurren al tipo <code>text</code>) escribir una fecha no válida (p. ej., el 32 de abril).</p>
-
-<p>Si utiliza {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para restringir las fechas disponibles (consulte {{anch("Definir los límites superior e inferior de la fecha")}}), los navegadores compatibles mostrarán un error si intenta enviar una fecha que se salga de los límites impuestos. No obstante, tendrá que comprobar los resultados para cerciorarse de que el valor esté dentro de los límites, ya que esta condición solo se hace cumplir si el dispositivo del usuario incluye compatibilidad completa con el selector de fecha.</p>
-
-<p>Además, puede emplear el atributo {{htmlattrxref("required", "input")}} para que proporcionar la fecha sea obligatorio: de nuevo, se mostrará un error si intenta enviar un campo de fecha vacío. Esto, cuando menos, debería funcionar en la mayoría de los navegadores.</p>
-
-<p>Estudie este ejemplo. Aquí hemos establecido las fechas mínima y máxima y convertimos el campo en obligatorio:</p>
-
-<pre>&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="party"&gt;Elija la fecha de festejo que prefiera (obligatorio, del 1.º al 20 de abril):&lt;/label&gt;
-    &lt;input type="date" id="party" name="party" min="2017-04-01" max="2017-04-20" required&gt;
-    &lt;span class="validity"&gt;&lt;/span&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;input type="submit"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Si intenta enviar el formulario sin una fecha (o con una fecha fuera de los límites definidos), el navegador muestra un error. Pruebe a manipular el ejemplo:</p>
-
-<p>{{EmbedLiveSample('Validation', 600, 100)}}</p>
-
-<p>Esta captura de pantalla ayudará a aquellos que no utilicen un navegador compatible:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14913/date-picker-chrome-error-message.png"></p>
-
-<p>Aqui un codigo CSS usado en el siguiente ejemplo. Donde se hace uso de {{cssxref(":valid")}} e {{cssxref(":invalid")}} Las propiedades en el estilo del "input" según el valor actual es o no valido. Se ponen iconos sobre el {{htmlelement("span")}} al costado del input, no en el mismo cuadro del input, porque en Chrome el contenido generado se remplaza dentro del formulario de control, y este no puede ser personalizado o no se mostraria efectivamente.</p>
-
-<pre>div {
-    margin-bottom: 10px;
-    display: flex;
-    align-items: center;
-}
-
-label {
-  display: inline-block;
-  width: 300px;
-}
-
-input:invalid+span:after {
-    content: '✖';
-    padding-left: 5px;
-}
-
-input:valid+span:after {
-    content: '✓';
-    padding-left: 5px;
-}</pre>
-
-<div class="blockIndicator warning">
-<p><strong>Importante</strong>: El formulario de validación en HTML  no es un sustituto para los scripts que se aseguran que los datos esten ingresados en la forma correcta. Esto es demasiado facil para alguien que realiza ajustes en HTML que le permite pasar la validación, o quitarla de lleno. Es tambien posible para alguien simplificar el proceso de paso del formulario HTML enteramente y pasar la fecha directamente al servidor. Pero si en el lado de tu servidor fallase la validación al recibir la fecha, podria ocurrir un desastre cuando se envien los datos en el formato incorrecto (que la fecha sea muy larga, del tipo incorrecto, entre otras cosas más).</p>
-</div>
-
-<h2 id="Manejo_de_compatibilidad_entre_navegadores">Manejo de compatibilidad entre navegadores</h2>
-
-<p>Como ya se menciono, el mayor problema al usar el "input" tipo date, es al momento de usar un <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date#Browser_compatibility">navegador compatible</a>. Ejemplo, el date picker en Firefox para Android luciria de la siguiente manera:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14915/date-picker-fxa.png"></p>
-
-<p>Pero los navegadores que no soportan lo remplazarian como un input del tipo texto, esto crea problemas en terminos de consistencia en relacion a la interfaz del usuario (El presente control seria diferente), y el manejo de datos también.</p>
-
-<p>El segundo problema es más serio; como ya se menciono, con un input tipo date, el valor actual siempre se normaliza en el siguiente formato <code>yyyy-mm-dd</code>. Con un input tipo texto, por default el navegador no reconoce el formato en el que deberia estar, y hay muchisimas formas en las que las personas escriben el formato de fecha, Por ejemplo:</p>
-
-<ul>
- <li><code>ddmmyyyy</code></li>
- <li><code>dd/mm/yyyy</code></li>
- <li><code>mm/dd/yyyy</code></li>
- <li><code>dd-mm-yyyy</code></li>
- <li><code>mm-dd-yyyy</code></li>
- <li><code>Month dd yyyy</code></li>
-</ul>
-
-<p>Una forma de evitar esto es usar un {{htmlattrxref("pattern", "input")}}, atributo que se pone en un input tipo date. A pesar de que la entrada tipo date no se usa, el input  tipo text si lo hará, gracias a este {{htmlattrxref("pattern", "input")}}.Mira el siguiente ejemplo en un navegador que no soporta entradas de tipo date:</p>
-
-<pre>&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="bday"&gt;Enter your birthday:&lt;/label&gt;
-    &lt;input type="date" id="bday" name="bday" required pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}"&gt;
-    &lt;span class="validity"&gt;&lt;/span&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;input type="submit"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>{{EmbedLiveSample('Handling_browser_support', 600, 100)}}</p>
-
-<p>Si Ud. trata de enviar la fecha, verá que el navegador no despliega un mensaje de error (y considera el valor del input como valido) Si tu entrada en el input no concuerda con el patron establecido <code>nnnn-nn-nn</code>, donde <code>n</code> es un numero del 0 al 9. De seguro, que esto no frenara a las personas de ingresar valores incorrectos de tipo fecha, o formatos incorrectos, como <code>yyyy-dd-mm</code> (mientras que nosotros necesitamos: <code>yyyy-mm-dd</code>). por lo que aún seria un problema...</p>
-
-<pre>div {
-  margin-bottom: 10px;
-}
-
-input:invalid + span {
-  position: relative;
-}
-
-input:invalid + span:after {
-  content: '✖';
-  position: absolute;
-  right: -18px;
-}
-
-input:valid + span {
-  position: relative;
-}
-
-input:valid + span:after {
-  content: '✓';
-  position: absolute;
-  right: -18px;
-}</pre>
-
-<p>La mejor forma de lidiar con fechas en formularios en un navegador cruzado, es pedir al usuario que ingrese el mes, el año y el dia en inputs separados o en formatos de control separados, ({{htmlelement("select")}} elementos que se han hecho populares; Mira abajo para ver la implementación), o usa una libreria de JavaScript como <a href="https://jqueryui.com/datepicker/">jQuery date picker</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>En este ejemplo creamos dos sets de elementos tipo UI para elegir fechas: uno nativo <code>&lt;input type="date"&gt;</code> y otro en un conjunto de tres {{htmlelement("select")}} elementos para elegir la fecha en navegadores antiguos que no soportan un input nativo.</p>
-
-<p>{{EmbedLiveSample('Examples', 600, 100)}}</p>
-
-<h3 id="HTML">HTML</h3>
-
-<p>El codigo HTML se ve como:</p>
-
-<pre>&lt;form&gt;
-    &lt;div class="nativeDatePicker"&gt;
-      &lt;label for="bday"&gt;Enter your birthday:&lt;/label&gt;
-      &lt;input type="date" id="bday" name="bday"&gt;
-      &lt;span class="validity"&gt;&lt;/span&gt;
-    &lt;/div&gt;
-    &lt;p class="fallbackLabel"&gt;Enter your birthday:&lt;/p&gt;
-    &lt;div class="fallbackDatePicker"&gt;
-      &lt;span&gt;
-        &lt;label for="day"&gt;Day:&lt;/label&gt;
-        &lt;select id="day" name="day"&gt;
-        &lt;/select&gt;
-      &lt;/span&gt;
-      &lt;span&gt;
-        &lt;label for="month"&gt;Month:&lt;/label&gt;
-        &lt;select id="month" name="month"&gt;
-          &lt;option selected&gt;January&lt;/option&gt;
-          &lt;option&gt;February&lt;/option&gt;
-          &lt;option&gt;March&lt;/option&gt;
-          &lt;option&gt;April&lt;/option&gt;
-          &lt;option&gt;May&lt;/option&gt;
-          &lt;option&gt;June&lt;/option&gt;
-          &lt;option&gt;July&lt;/option&gt;
-          &lt;option&gt;August&lt;/option&gt;
-          &lt;option&gt;September&lt;/option&gt;
-          &lt;option&gt;October&lt;/option&gt;
-          &lt;option&gt;November&lt;/option&gt;
-          &lt;option&gt;December&lt;/option&gt;
-        &lt;/select&gt;
-      &lt;/span&gt;
-      &lt;span&gt;
-        &lt;label for="year"&gt;Year:&lt;/label&gt;
-        &lt;select id="year" name="year"&gt;
-        &lt;/select&gt;
-      &lt;/span&gt;
-    &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Los meses son codificados (como son siempre), mientras que el dia y el año son generados dinamicamente dependiendo del mes y el año seleccionado,  y el presente año (mira el codigo comentado para ver los detalles de la explicacion y como este funciona.)</p>
-
-<pre>input:invalid+span:after {
-  content: '✖';
-  padding-left: 5px;
-}
-
-input:valid+span:after {
-  content: '✓';
-  padding-left: 5px;
-}</pre>
-
-<h3 id="JavaScript">JavaScript</h3>
-
-<p>La otra parte del codigo que podria ser interesante es una caracteristica de detección de codigo— para detectar si el navegador soporta o no <code>&lt;input type="date"&gt;</code>, creamos un nuevo {{htmlelement("input")}}, seteado de <code>type</code> a <code>date</code>, inmediatamente verifica a que tipo corresponde— para navegadores que no soportan retornara un tipo <code>text</code>, porque el tipo <code>date</code> se volveria en tipo <code>text</code>. Si <code>&lt;input type="date"&gt;</code> no es soportado, escondemos el control nativo (datepicker nativo) y mostramos el selector tipo UI ({{htmlelement("select")}}) en vez de este.</p>
-
-<pre class="brush: js">// define variables
-var nativePicker = document.querySelector('.nativeDatePicker');
-var fallbackPicker = document.querySelector('.fallbackDatePicker');
-var fallbackLabel = document.querySelector('.fallbackLabel');
-
-var yearSelect = document.querySelector('#year');
-var monthSelect = document.querySelector('#month');
-var daySelect = document.querySelector('#day');
-
-// hide fallback initially
-fallbackPicker.style.display = 'none';
-fallbackLabel.style.display = 'none';
-
-// test whether a new date input falls back to a text input or not
-var test = document.createElement('input');
-test.type = 'date';
-
-// if it does, run the code inside the if() {} block
-if(test.type === 'text') {
-  // hide the native picker and show the fallback
-  nativePicker.style.display = 'none';
-  fallbackPicker.style.display = 'block';
-  fallbackLabel.style.display = 'block';
-
-  // populate the days and years dynamically
-  // (the months are always the same, therefore hardcoded)
-  populateDays(monthSelect.value);
-  populateYears();
-}
-
-function populateDays(month) {
-  // delete the current set of &lt;option&gt; elements out of the
-  // day &lt;select&gt;, ready for the next set to be injected
-  while(daySelect.firstChild){
-    daySelect.removeChild(daySelect.firstChild);
-  }
-
-  // Create variable to hold new number of days to inject
-  var dayNum;
-
-  // 31 or 30 days?
-  if(month === 'January' || month === 'March' || month === 'May' || month === 'July' || month === 'August' || month === 'October' || month === 'December') {
-    dayNum = 31;
-  } else if(month === 'April' || month === 'June' || month === 'September' || month === 'November') {
-    dayNum = 30;
-  } else {
-  // If month is February, calculate whether it is a leap year or not
-    var year = yearSelect.value;
-    (year - 2016) % 4 === 0 ? dayNum = 29 : dayNum = 28;
-  }
-
-  // inject the right number of new &lt;option&gt; elements into the day &lt;select&gt;
-  for(i = 1; i &lt;= dayNum; i++) {
-    var option = document.createElement('option');
-    option.textContent = i;
-    daySelect.appendChild(option);
-  }
-
-  // if previous day has already been set, set daySelect's value
-  // to that day, to avoid the day jumping back to 1 when you
-  // change the year
-  if(previousDay) {
-    daySelect.value = previousDay;
-
-    // If the previous day was set to a high number, say 31, and then
-    // you chose a month with less total days in it (e.g. February),
-    // this part of the code ensures that the highest day available
-    // is selected, rather than showing a blank daySelect
-    if(daySelect.value === "") {
-      daySelect.value = previousDay - 1;
-    }
-
-    if(daySelect.value === "") {
-      daySelect.value = previousDay - 2;
-    }
-
-    if(daySelect.value === "") {
-      daySelect.value = previousDay - 3;
-    }
-  }
-}
-
-function populateYears() {
-  // get this year as a number
-  var date = new Date();
-  var year = date.getFullYear();
-
-  // Make this year, and the 100 years before it available in the year &lt;select&gt;
-  for(var i = 0; i &lt;= 100; i++) {
-    var option = document.createElement('option');
-    option.textContent = year-i;
-    yearSelect.appendChild(option);
-  }
-}
-
-// when the month or year &lt;select&gt; values are changed, rerun populateDays()
-// in case the change affected the number of available days
-yearSelect.onchange = function() {
-  populateDays(monthSelect.value);
-}
-
-monthSelect.onchange = function() {
-  populateDays(monthSelect.value);
-}
-
-//preserve day selection
-var previousDay;
-
-// update what day has been set to previously
-// see end of populateDays() for usage
-daySelect.onchange = function() {
-  previousDay = daySelect.value;
-}</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Recuerda que algunos años tienen 53 semanas (año bisiesto) (Mira <a href="https://en.wikipedia.org/wiki/ISO_week_date#Weeks_per_year">Semanas por año</a>)! Tendras que tener esto en consideración cuando desarrolles apps o funciones.</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#date-state-(type=date)', '&lt;input type="date"&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#date-state-(type=date)', '&lt;input type="date"&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<table>
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>20</td>
-   <td>12</td>
-   <td>{{CompatGeckoDesktop(57)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-
-<table>
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile(57)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>5</td>
-  </tr>
- </tbody>
-</table>
-
-<p>[1] Reconoce pero no tiene UI.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>The generic {{HTMLElement("input")}} element and the interface used to manipulate it, {{domxref("HTMLInputElement")}}</li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms/The_native_form_widgets#Date_and_time_picker">Date and Time picker tutorial</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Date_and_time_formats">Date and time formats used in HTML</a></li>
-</ul>
diff --git a/files/es/web/html/elemento/input/datetime/index.html b/files/es/web/html/elemento/input/datetime/index.html
deleted file mode 100644
index f1f4aeac25..0000000000
--- a/files/es/web/html/elemento/input/datetime/index.html
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: <input type="datetime">
-slug: Web/HTML/Elemento/input/datetime
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-translation_of: Web/HTML/Element/input/datetime
----
-<p><span class="seoSummary"><dfn>El HTML</dfn><code> &lt;input type="datetime"&gt; </code>es un control para ingresar tiempo y fecha (hora, minuto, segundo y fracción de segundo) basado en la zona horaria UTC . <dfn> </dfn></span></p>
-
-<ul>
- <li><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a> : Contenido dinámico , listed , submittable , resettable , contenido asociado a un formulario , contenido estático o de texto . Si <code>type</code>  no tiene el valor <code>hidden </code>, elemenento labelable , contenido palpable .</li>
-</ul>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno , es un elemento vacío.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>Debe de tener una etiqueta de inicio y no debe de tener una etiqueta final .</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padres permitidos</th>
-   <td>Cualquier elemento que acepte contenido estático o de texto .</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td><a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement" title="The HTMLInputElement interface provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of input elements."><code>HTMLInputElement</code></a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>El siguiente elemento tiene los siguientes<a href="/es/docs/Web/HTML/Atributos_Globales"> atributos globales</a> .</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<div class="geckoVersionNote">
-<p><code><span class="highELE">input</span> <span class="highATT">type=</span><span class="highVAL">"datetime"</span> <span class="highATT">name=</span><span class="highVAL">"new_year"</span><span class="highGT"> </span></code></p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName("HTML WHATWG", "forms.html#date-and-time-state-(type=datetime)", "&lt;input type=\"datetime\"&gt;")}}</td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5.1", "semantics.html#date-and-time-state-(type=datetime)", "&lt;input type=\"datetime\"&gt;")}}</td>
-   <td>{{Spec2("HTML5.1")}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=datetime</td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=datetime</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1]  El tipo <code>daytime</code> es reconocido, pero no hay una IU para este.</p>
-
-<p>[2] Actualmente Gecko no implementa el tipo <code>datetime.</code>Ver {{bug("825294")}}</p>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El elemento {{HTMLElement("input")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/input/email/index.html b/files/es/web/html/elemento/input/email/index.html
deleted file mode 100644
index f07953bb29..0000000000
--- a/files/es/web/html/elemento/input/email/index.html
+++ /dev/null
@@ -1,423 +0,0 @@
----
-title: <input type="email">
-slug: Web/HTML/Elemento/input/email
-tags:
-  - Email
-  - Forms
-  - Formulários HTML
-  - HTML
-  - Input Type
-  - Referencia
-  - correoᵉ
-  - formulários
-translation_of: Web/HTML/Element/input/email
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("email")}} se utilizan para permitir que el usuario ingrese y edite una dirección de correoᵉ o, si se especifica el atributo {{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}, una lista de direcciones de correoᵉ.</span></p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/input-email.html", "tabbed-shorter")}}</div>
-
-<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
-
-<p>El valor de {{HTMLElement("input")}} se valida automáticamente para garantizar que esté vacío o sea una dirección de correoᵉ con el formato adecuado (o una lista de direcciones) antes de que se pueda enviar el formulario. Las pseudoclases {{CSSxRef(":valid")}} e {{CSSxRef(":invalid")}} de CSS se aplican automáticamente según corresponda para indicar visualmente si el valor actual del campo es una dirección de correoᵉ válida o no.</p>
-
-<p>En los navegadores que no admiten entradas de tipo <code>email</code>, una entrada de <code>email</code> vuelve a ser un {{HTMLElement("input")}} {{HTMLElement("input/text", "text")}} estándar.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td><strong>{{anch("Value")}}</strong></td>
-   <td>Un {{DOMxRef("DOMString")}} que representa una dirección de correo electrónico o vacío</td>
-  </tr>
-  <tr>
-   <td><strong>Eventos</strong></td>
-   <td>{{DOMxRef("HTMLElement/change_event", "change")}} y {{DOMxRef("HTMLElement/input_event", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos comunes admitidos</strong></td>
-   <td>{{HTMLAttrxRef("autocomplete", "input")}}, {{HTMLAttrxRef("list", "input")}}, {{HTMLAttrxRef("maxlength", "input")}}, {{HTMLAttrxRef("minlength", "input")}}, {{HTMLAttrxRef("multiple", "input")}}, {{HTMLAttrxRef("name", "input")}}, {{HTMLAttrxRef("pattern", "input")}}, {{HTMLAttrxRef("placeholder", "input")}}, {{HTMLAttrxRef("readonly", "input")}}, {{HTMLAttrxRef("required", "input")}}, {{HTMLAttrxRef("size", "input")}} y {{HTMLAttrxRef("type", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>IDL attributes</strong></td>
-   <td><code>list</code> y <code>value</code></td>
-  </tr>
-  <tr>
-   <td><strong>Métodos</strong></td>
-   <td>{{domxref("HTMLInputElement.select", "select()")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Value"><code>Value</code></h2>
-
-<p>El atributo {{HTMLAttrxRef("value", "input")}} del elemento {{HTMLElement("input")}} contiene un {{DOMxRef("DOMString")}} que se valida automáticamente conforme a la sintaxis del correoᵉ. Específicamente, hay tres posibles formatos de valor que pasarán la validación:</p>
-
-<ol>
- <li>Una cadena vacía ("") — indica que el usuario no ingresó un valor o que el valor fue eliminado.</li>
- <li>Una única dirección de correoᵉ debidamente formada. Esto no necesariamente significa que exista la dirección de correo electrónico, pero al menos tiene el formato correcto. En términos simples, esto significa <code>nombreusuario@dominio</code> o <code>nombreusuario@dominio.tld</code>. Hay más que eso, por supuesto; consulta {{anch("Validación")}} para obtener una {{Glossary("expresión regular")}} que coincida con el algoritmo de validación de la dirección de correoᵉ.</li>
- <li>Si y solo se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, el valor puede ser una lista de direcciones de correoᵉ correctamente formadas separadas por comas. Los espacios en blanco iniciales y finales se eliminan de cada dirección de la lista.</li>
-</ol>
-
-<p>Consulta {{anch("Validación")}} para obtener detalles sobre cómo se validan las direcciones de correoᵉ para asegurarte de que tengan el formato correcto.</p>
-
-<h2 id="Atributos_adicionales">Atributos adicionales</h2>
-
-<p>Además de los atributos que operan en todos los elementos {{HTMLElement("input")}} independientemente de su tipo, las entradas de <code> email </code> admiten los siguientes atributos:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Atributo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>{{anch("list")}}</code></td>
-   <td>El id del elemento {{HTMLElement("datalist")}} que contiene las opciones de autocompletar predefinidas</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("maxlength")}}</code></td>
-   <td>El número máximo de caracteres que debe aceptar la entrada</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("minlength")}}</code></td>
-   <td>El número mínimo de caracteres que la entrada puede tener y aún se considera válida</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("multiple")}}</code></td>
-   <td>Si se permite o no la introducción de varias direcciones de correoᵉ separadas por comas.</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("pattern")}}</code></td>
-   <td>Una expresión regular que el contenido de la entrada debe coincidir para que sea válida</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("placeholder")}}</code></td>
-   <td>Un valor de ejemplo para mostrar en el campo de entrada siempre y cuando esté vacío</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("readonly")}}</code></td>
-   <td>Un atributo booleano que indica si el contenido de la entrada debe ser de solo lectura.</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("size")}}</code></td>
-   <td>Un número que indica cuántos caracteres de ancho debe tener el campo de entrada.</td>
-  </tr>
- </tbody>
-</table>
-
-<p id="htmlattrdeflist">{{page("/es/docs/Web/HTML/Element/input/text", "list", 0, 1, 2)}}</p>
-
-<h3 id="HTMLAttrDefmaxlength">{{HTMLAttrDef("maxlength")}}</h3>
-
-<p>El número máximo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrxRef("email", "input")}}. Debe ser un valor entero 0 o superior. Si no se especifica {{HTMLAttrxRef("maxlength", "input")}}, o se especifica un valor no válido, la entrada de {{HTMLAttrxRef("email", "input")}} no tiene una longitud máxima. Este valor también debe ser mayor o igual que el valor de {{HTMLAttrxRef("minlength", "input")}}.</p>
-
-<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del valor de texto del campo es mayor que {{HTMLAttrxRef("maxlength", "input")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
-
-<h3 id="HTMLAttrDefminlength">{{HTMLAttrDef("minlength")}}</h3>
-
-<p>El número mínimo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrxRef("email", "input")}}. Debe ser un valor entero no negativo menor o igual al valor especificado por {{HTMLAttrxRef("maxlength", "input")}}. Si no se especifica {{HTMLAttrxRef("minlength", "input")}} o se especifica un valor no válido, la entrada de {{HTMLAttrDef("email")}} no tiene una longitud mínima.</p>
-
-<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del texto ingresado en el campo es menor que {{HTMLAttrDef("minlength")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
-
-<h3 id="HTMLAttrDefmultiple">{{HTMLAttrDef("multiple")}}</h3>
-
-<p>Un atributo booleano que, si está presente, indica que el usuario puede ingresar una lista de múltiples direcciones de correoᵉ, separadas por comas y, opcionalmente, espacios en blanco. Consulta {{anch("Permitir varias direcciones de correoᵉ")}} para ver un ejemplo, o {{web.link("/es/docs/Web/HTML/Attributes/multiple", "HTML el atributo: multiple")}} para más detalles.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Normalmente, si especificas el atributo {{HTMLAttrxRef("required", "input")}}, el usuario debe ingresar una dirección de correoᵉ válida para que el campo se considere válido. Sin embargo, si agregas el atributo {{HTMLAttrDef("multiple")}}, una lista de cero direcciones de correo electrónico (una cadena vacía o una que sea completamente en blanco) es un valor válido. En otras palabras, el usuario no tiene que ingresar ni siquiera una dirección de correo electrónico cuando se especifica {{HTMLAttrDef("multiple")}}, independientemente del valor de {{HTMLAttrDef("required")}}.</p>
-</div>
-
-<h3 id="HTMLAttrDefpattern">{{HTMLAttrDef("pattern")}}</h3>
-
-<p>{{page("/es/docs/Web/HTML/Element/input/text", "pattern-include")}}</p>
-
-<p>Consulta la sección {{anch("Patrón de validación")}} para obtener detalles y ver un ejemplo.</p>
-
-<p>{{page("/es/docs/Web/HTML/Element/input/text", "placeholder", 0, 1, 2)}}</p>
-
-<p>{{page("/es/docs/Web/HTML/Element/input/text", "readonly", 0, 1, 2)}}</p>
-
-<p>{{page("/es/docs/Web/HTML/Element/input/text", "size", 0, 1, 2)}}</p>
-
-<h2 id="Usar_inputs_de_tipo_email">Usar <code>input</code>s de tipo <code>email</code></h2>
-
-<p>Las direcciones de correoᵉ se encuentran entre los formularios de datos textuales que se ingresan con mayor frecuencia en la web; se utilizan al iniciar sesión en sitios web, al solicitar información, para permitir la confirmación de pedidos, para correo web, etc. Por lo tanto, el tipo de entrada {{HTMLAttrDef("email")}} puede hacer que tu trabajo como desarrollador web sea mucho más fácil, ya que puede ayudar a simplificar la tarea al crear la interfaz de usuario y la lógica para las direcciones de correoᵉ. Cuando creas una entrada de correoᵉ con el valor de {{HTMLAttrDef("type")}} adecuado, {{HTMLAttrDef("email")}}, obtienes validación automática de que el texto ingresado esté por lo menos en la forma correcta para potencialmente ser una dirección de correoᵉ legítima. Esto puede ayudar a evitar casos en los que el usuario escribe mal su dirección o proporciona una dirección no válida.</p>
-
-<p>Sin embargo, es importante tener en cuenta que esto no es suficiente para garantizar que el texto especificado sea una dirección de correoᵉ que realmente exista, que corresponda al usuario del sitio o que sea aceptable de cualquier otra manera. Simplemente garantiza que el valor del campo tenga el formato adecuado para ser una dirección de correoᵉ.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: También es crucial recordar que un usuario puede jugar con tu HTML detrás de la escena, por lo que tu sitio <em>no debe</em> utilizar esta validación por motivos de seguridad. <em>Debes</em> verificar la dirección de correoᵉ en el lado del servidor de cualquier transacción en la que el texto proporcionado pueda tener implicaciones de seguridad de cualquier tipo.</p>
-</div>
-
-<h3 id="Una_sencilla_entrada_de_correoᵉ">Una sencilla entrada de correoᵉ</h3>
-
-<p>Actualmente, todos los navegadores que admiten este elemento lo implementan como un campo de entrada de texto estándar con características básicas de validación. Sin embargo, la especificación permite a los navegadores cierta libertad en esto. Por ejemplo, el elemento se podría integrar con la libreta de direcciones incorporada del dispositivo del usuario para permitir seleccionar direcciones de correoᵉ de esa lista. En su forma más básica, una entrada de tipo {{HTMLAttrDef("email")}} se puede implementar así:</p>
-
-<pre class="brush: html notranslate">&lt;input id="emailAddress" type="email"&gt;</pre>
-
-<p>{{ EmbedLiveSample('Una_sencilla_entrada_de_correoᵉ', 600, 40) }}</p>
-
-<p>Ten en cuenta que se considera válido cuando está vacío y cuando se ingresa una única dirección de correoᵉ con formato válido, pero por lo demás no se considera válido. Al agregar el atributo {{HTMLAttrxRef("required", "input")}}, solo se permiten direcciones de correoᵉ con formato válido; la entrada ya no se considera válida cuando está vacía.</p>
-
-<h3 id="Permitir_varias_direcciones_de_correoᵉ">Permitir varias direcciones de correoᵉ</h3>
-
-<p>Al agregar el atributo booleano {{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}, la entrada se puede configurar para aceptar varias direcciones de correoᵉ.</p>
-
-<pre class="brush: html notranslate">&lt;input id="emailAddress" type="email" multiple&gt;</pre>
-
-<p>{{ EmbedLiveSample('permitir_varias_direcciones_de_correoᵉ', 600, 40) }}</p>
-
-<p>La entrada ahora se considera válida cuando se ingresa una sola dirección de correoᵉ, o cuando cualquier número de direcciones de correo electrónico separadas por comas y, opcionalmente, algún número de espacios en blanco están presentes.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Cuando se utiliza {{HTMLAttrDef("multiple")}}, el valor <em>puede</em> estar vacío.</p>
-</div>
-
-<p>Algunos ejemplos de cadenas válidas cuando se especifica {{HTMLAttrDef("multiple")}}:</p>
-
-<ul>
- <li><code>""</code></li>
- <li><code>"yo@ejemplo"</code></li>
- <li><code>"yo@ejemplo.org"</code></li>
- <li><code>"yo@ejemplo.org,tu@ejemplo.org"</code></li>
- <li><code>"yo@ejemplo.org, tu@ejemplo.org"</code></li>
- <li><code>"yo@ejemplo.org,tu@example.org, su@ejemplo.org"</code></li>
-</ul>
-
-<p>Algunos ejemplos de cadenas no válidas:</p>
-
-<ul>
- <li><code>","</code></li>
- <li><code>"me"</code></li>
- <li><code>"me@example.org you@example.org"</code></li>
-</ul>
-
-<h3 id="Marcadores_de_posición">Marcadores de posición</h3>
-
-<p>A veces es útil ofrecer una pista en contexto sobre qué forma deben tomar los datos de entrada. Esto puede ser importante especialmente si el diseño de la página no ofrece etiquetas descriptivas para cada {{HTMLElement("input")}}. Aquí es donde entran los marcadores de posición ({{HTMLAttrDef("placeholder")}}s). Un marcador de posición es un valor que demuestra la forma que debe tomar el {{HTMLAttrDef("value")}} al presentar un ejemplo de un valor válido, que se muestra dentro del cuadro de edición cuando el valor del elemento es "". Una vez que se ingresan datos en el cuadro, el marcador de posición desaparece; si se vacía la caja, vuelve a aparecer el marcador de posición.</p>
-
-<p>Aquí, tenemos una entrada de {{HTMLAttrDef("email")}} con el marcador de posición <code>chofy@ejemplo.com</code>. Observa cómo el marcador de posición desaparece y reaparece a medida que manipulas el contenido del campo de edición.</p>
-
-<pre class="brush: html notranslate">&lt;input type="email" placeholder="chofy@ejemplo.com"&gt;</pre>
-
-<p>{{ EmbedLiveSample('Marcadores_de_posición', 600, 40) }}</p>
-
-<h3 id="Controlar_el_tamaño_del_valor_ingresado">Controlar el tamaño del valor ingresado</h3>
-
-<p>Puedes controlar no solo la longitud física del cuadro de entrada, sino también las longitudes mínima y máxima permitidas para el texto de entrada en sí mismo.</p>
-
-<h4 id="Tamaño_físico_del_elemento_de_entrada">Tamaño físico del elemento de entrada</h4>
-
-<p>El tamaño físico del cuadro de entrada se puede controlar mediante el atributo {{HTMLAttrxRef("size", "input")}}. Con él, puedes especificar el número de caracteres que el cuadro de entrada puede mostrar a la vez. En este ejemplo, el cuadro de edición {{HTMLAttrDef("email")}} tiene 15 caracteres de ancho:</p>
-
-<pre class="brush: html notranslate">&lt;input type="email" size="15"&gt;</pre>
-
-<p>{{ EmbedLiveSample('Tamaño_físico_del_elemento_de_entrada', 600, 40) }}</p>
-
-<h4 id="Longitud_del_valor_del_elemento">Longitud del valor del elemento</h4>
-
-<p>El {{HTMLAttrDef("size")}} es independiente de la limitación de longitud de la dirección de correoᵉ ingresada, por lo que puedes hacer que los campos quepan en un espacio pequeño y, al mismo tiempo, permitir que se ingresen cadenas de direcciones de correoᵉ más largas. Puedes especificar una longitud mínima, en caracteres, para la dirección de correoᵉ ingresada usando el atributo {{HTMLAttrxRef("minlength", "input")}}; de manera similar, usa {{HTMLAttrxRef("maxlength", "input")}} para establecer la longitud máxima de la dirección de correoᵉ ingresada.</p>
-
-<p>El siguiente ejemplo crea un cuadro de entrada de dirección de correoᵉ de 32 caracteres de ancho, que requiere que el contenido tenga no menos de 3 caracteres y no más de 64 caracteres.</p>
-
-<pre class="brush: html notranslate">&lt;input type="email" size="32" minlength="3" maxlength="64"&gt;</pre>
-
-<p>{{EmbedLiveSample("Longitud_del_valor_del_elemento", 600, 40) }}</p>
-
-<h3 id="Proporcionar_opciones_predeterminadas">Proporcionar opciones predeterminadas</h3>
-
-<p>Como siempre, puedes proporcionar un valor predeterminado para un cuadro de entrada de tipo <code>email</code> configurando su atributo {{HTMLAttrxRef("value", "input")}}:</p>
-
-<div id="Default_value">
-<pre class="brush: html notranslate">&lt;input type="email" value="usuario@ejemplo.com"&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample("Default_value", 600, 40)}}</p>
-
-<h4 id="Ofreciendo_valores_sugeridos">Ofreciendo valores sugeridos</h4>
-
-<p>Yendo un paso más allá, puedes proporcionar una lista de opciones predeterminadas entre las que el usuario puede seleccionar especificando el atributo {{HTMLAttrxRef("list", "input")}}. Esto no limita al usuario a esas opciones, pero le permite seleccionar rápidamente las direcciones de correoᵉ de uso común. Esto también ofrece sugerencias para {{HTMLAttrxRef("autocomplete", "input")}}. El atributo {{HTMLAttrDef("list")}} especifica el ID de un {{HTMLElement("datalist")}}, que a su vez contiene un elemento {{HTMLElement("option")}} por valor sugerido; El valor de cada opción es el valor sugerido correspondiente para el cuadro de entrada de correoᵉ.</p>
-
-<pre class="brush: html notranslate">&lt;input type="email" size="40" list="defaultEmails"&gt;
-
-&lt;datalist id="defaultEmails"&gt;
-  &lt;option value="jbond007@mi6.defence.gov.uk"&gt;
-  &lt;option value="jbourne@unknown.net"&gt;
-  &lt;option value="nfury@shield.org"&gt;
-  &lt;option value="tony@starkindustries.com"&gt;
-  &lt;option value="hulk@grrrrrrrr.arg"&gt;
-&lt;/datalist&gt;</pre>
-
-<p>{{EmbedLiveSample("Ofreciendo_valores_sugeridos", 600, 40)}}</p>
-
-<p>Con el elemento {{HTMLElement("datalist")}} y sus {{HTMLElement("option")}}es en su lugar, el navegador ofrecerá los valores especificados como valores potenciales para la dirección de correoᵉ; normalmente se presenta como un menú emergente o desplegable que contiene las sugerencias. Si bien la experiencia del usuario específico puede variar de un navegador a otro, normalmente al hacer clic en el cuadro de edición se muestra un menú desplegable con las direcciones de correoᵉ sugeridas. Luego, a medida que el usuario escribe, la lista se filtra para mostrar solo los valores coincidentes. Cada carácter escrito reduce la lista hasta que el usuario realiza una selección o escribe un valor personalizado.</p>
-
-<p><img alt="Animación: usa la entrada del teclado para filtrar la lista de direcciones de correo electrónico sugeridas" src="https://mdn.mozillademos.org/files/14831/html-input-email1.gif" style="border-style: solid; border-width: 1px; height: 168px; width: 352px;"></p>
-
-<h2 id="Validación">Validación</h2>
-
-<p>Hay dos niveles de validación de contenido disponibles para las entradas de {{HTMLAttrDef("email")}}. Primero, está el nivel de validación estándar que se ofrece a todos los {{HTMLElement("input")}}s, que automáticamente asegura que el contenido cumple con los requisitos para ser una dirección de correoᵉ válida. Pero también existe la opción de agregar filtros adicionales para garantizar que se satisfagan tus propias necesidades especializadas, si las tienes.</p>
-
-<div class="warning">
-<p><strong>Importante</strong>: La validación del formulario HTML <em>no</em> sustituye a los scripts que garantizan que los datos ingresados tengan el formato adecuado. Es demasiado fácil para alguien realizar ajustes en el HTML que le permitan omitir la validación o eliminarla por completo. También es posible que alguien simplemente omita tu HTML por completo y envíe los datos directamente a tu servidor. Si tu código del lado del servidor no valida los datos que recibe, podría ocurrir un desastre cuando se ingresen en tu base de datos datos con formato incorrecto (o datos que son demasiado grandes, son del tipo incorrecto, etc.).</p>
-</div>
-
-<h3 id="Validación_básica">Validación básica</h3>
-
-<p>Los navegadores que admiten el tipo de entrada {{HTMLAttrDef("email")}} automáticamente proporcionan una validación para garantizar que solo se introduzca en el cuadro de entrada el texto que coincida con el formato estándar para las direcciones de correoᵉ de Internet. Los navegadores que implementan la especificación deben utilizar un algoritmo equivalente a la siguiente expresión regular:</p>
-
-<pre class="brush: js notranslate">/^[a-zA-Z0-9.!#$%&amp;'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}
-  [a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/
-</pre>
-
-<p>Para obtener más información sobre cómo funciona la validación de formularios y cómo aprovechar las propiedades de CSS {{CSSxRef(":valid")}} e {{CSSxRef(":invalid")}} para estilizar la entrada en función de si el el valor actual es válido, consulta {{web.link("/es/docs/Learn/HTML/Forms/Form_validation", "Validación de datos de formulario")}}.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Existen problemas de especificación conocidos relacionados con los nombres de dominio internacionales y la validación de direcciones de correo electrónico en HTML. Consulta el <a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=15489">error 15489 en W3C</a> para obtener más detalles.</p>
-</div>
-
-<h3 id="Patrón_de_validación">Patrón de validación</h3>
-
-<p>Si necesitas restringir la dirección de correo electrónico ingresada más allá de "cualquier cadena que parezca una dirección de correo electrónico", puedes usar el atributo {{HTMLAttrxRef("pattern", "input")}} para especificar una {{Glossary("expresión regular")}} con la cual el valor debe coincidir para que sea válido. Si se especifica el atributo {{HTMLAttrxRef("multiple", "input")}}, cada elemento individual en la lista de valores delimitados por comas debe coincidir con la {{Glossary("expresión regular")}}.</p>
-
-<p>Por ejemplo, supón que estás creando una página para los empleados de "Best Startup Ever, Inc". lo que les permitirá ponerse en contacto con su departamento de TI para obtener ayuda. En nuestro formulario simplificado, el usuario debe ingresar su dirección de correoᵉ y un mensaje que describa el problema con el que necesita ayuda. Queremos asegurarnos de que el usuario no solo proporcione una dirección de correoᵉ válida, sino que, por motivos de seguridad, requerimos que la dirección sea una dirección de correo electrónico corporativa interna.</p>
-
-<p>Dado que las entradas de tipo {{HTMLAttrDef("email")}} se comprueban con la validación de la dirección de correoᵉ estándar <em>y</em> el {{HTMLAttrxRef("pattern", "input")}} especificado, se puede implementar así de fácil. Observa cómo:</p>
-
-<div class="hidden">
-<pre class="brush: css notranslate">body {
-  font: 16px sans-serif;
-}
-
-.emailBox {
-  padding-bottom: 20px;
-}
-
-.messageBox {
-  padding-bottom: 20px;
-}
-
-[parcial]label :
-  [parcial]line-height: 1.5;
-}
-
-label::after {
-  content: ":";
-}</pre>
-</div>
-
-<pre class="brush: html notranslate">&lt;form&gt;
- &lt;div class="emailBox"&gt;
-   &lt;label for="emailAddress"&gt;Tu dirección de correoᵉ&lt;/label&gt;&lt;br&gt;
-   &lt;input id="emailAddress" type="email" size="64" maxLength="64" required
-          placeholder="nombreusuario@beststartupever.com" pattern=".+@beststartupever.com"
-          title="Por favor, solo proporciona una dirección de correoᵉ corporativa que te haya proporcionado Best Startup Ever"&gt;
- &lt;/div&gt;
-
- &lt;div class="messageBox"&gt;
-   &lt;label for="message"&gt;Solicitud&lt;/label&gt;&lt;br&gt;
-   &lt;textarea id="message" cols="80" rows="8" required
-             placeholder="Mis zapatos están demasiado apretados y he olvidado cómo bailar."&gt;&lt;/textarea&gt;
- &lt;/div&gt;
-  &lt;input type="submit" value="Envía solicitud"&gt;
-&lt;/form&gt;
-</pre>
-
-<p>{{EmbedLiveSample("Patrón_de_validación", 700, 275)}}</p>
-
-<p>El {{HTMLElement("form")}} contiene un {{HTMLElement("input")}} de tipo {{HTMLAttrxRef("email", "input")}} para la dirección de correoᵉ del usuario, un {{HTMLElement("textarea")}} para ingresar su mensaje y un {{HTMLElement("input")}} de tipo {{web.link("/es/docs/Web/HTML/Element/input/submit", "submit")}}, que crea un botón para enviar el formulario. Cada cuadro de entrada de texto tiene una {{HTMLElement("label")}} asociada para que el usuario sepa lo que se espera de ellos.</p>
-
-<p>Échale un vistazo más de cerca al cuadro de entrada de la dirección de correoᵉ. Sus atributos {{HTMLAttrxRef("size", "input")}} y {{HTMLAttrxRef("maxlength", "input")}} se establecen en 64 para mostrar espacio para 64 caracteres en direcciones de correoᵉ y limitar la cantidad de caracteres ingresados realmente a un máximo de 64. Se especifica el atributo {{HTMLAttrxRef("required", "input")}}, lo cual hace obligatorio que se proporcione una dirección de correoᵉ válida.</p>
-
-<p>Se proporciona un {{HTMLAttrxRef("placeholder", "input")}} apropiado, <code>nombreusuario@beststartupever.com</code>, para demostrar lo que constituye una entrada válida. Esta cadena demuestra que se debe ingresar una dirección de correoᵉ y sugiere que debe ser una cuenta corporativa de "beststartupever.com". Esto se suma al hecho de que el uso del tipo {{HTMLAttrDef("email")}} validará el texto para garantizar que tenga el formato de una dirección de correoᵉ. Si el texto en el cuadro de entrada no es una dirección de correoᵉ, recibirá un mensaje de error similar a este:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14855/enter-valid-email-address.png" style="height: 125px; width: 530px;"></p>
-
-<p>Si dejas las cosas así, al menos estarías validando direcciones de correoᵉ legítimas. Pero quieres ir un paso más allá: quieres asegurarte de que la dirección de correoᵉ tenga el formato "<em>nombreusuario</em>@beststartupever.com". Aquí es donde usarás el {{HTMLAttrxRef("pattern", "input")}}. Establece el {{HTMLAttrDef("pattern")}} en <code>.+@beststartupever.com</code>. Esta simple expresión regular solicita una cadena que consta de al menos un carácter de cualquier tipo, luego una "@" seguida por el nombre de dominio "beststartupever.com".</p>
-
-<p>Ten en cuenta que esto ni siquiera se acerca a un filtro adecuado para direcciones de correo electrónico válidas; permitiría cosas como "@ beststartupever.com" (tenga en cuenta el espacio inicial) o "@@ beststartupever.com", ninguna de las cuales es válida. Sin embargo, el navegador ejecuta tanto el filtro de dirección de correoᵉ estándar <em>como</em> nuestro patrón personalizado contra el texto especificado. Como resultado, terminamos con una validación que dice "asegúrate de que se asemeje a una dirección de correoᵉ válida, y si lo es, asegúrate de que también sea una dirección beststartupever.com".</p>
-
-<p>Es recomendable utilizar el atributo {{HTMLAttrxRef("title")}} junto con {{HTMLAttrDef("pattern")}}. Si lo haces, el {{HTMLAttrDef("title")}} <em>debe</em> describir el patrón. Es decir, debe explicar qué formato deben adoptar los datos, en lugar de cualquier otra información. Esto se debe a que el {{HTMLAttrDef("title")}} se puede mostrar o pronunciar como parte de un mensaje de error de validación. Por ejemplo, el navegador puede presentar el mensaje "El texto ingresado no coincide con el patrón requerido". seguido de su {{HTMLAttrDef("title")}} especificado. Si tu {{HTMLAttrDef("title")}} es algo así como "Dirección de correoᵉ", el resultado sería el mensaje "El texto ingresado no coincide con el patrón requerido. Dirección de correoᵉ", no es muy buena.</p>
-
-<p>Es por eso que, en cambio, especificamos la cadena "Por favor, proporciona solo una dirección de correoᵉ corporativo de Best Startup Ever", Al hacerlo, el mensaje de error completo resultante podría ser algo como "El texto ingresado no coincide con el patrón requerido. Proporciona solo una dirección de correoᵉ corporativo de Best Startup Ever."</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14853/email-pattern-match-bad.png" style="height: 140px; width: 536px;"></p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si tienes problemas al escribir tus expresiones regulares de validación y no funcionan correctamente, consulta la consola de tu navegador; posiblemente haya útiles mensajes de error que te ayudarán a resolver el problema.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Aquí tenemos una entrada de correoᵉ con el ID <code>emailAddress</code> que puede tener un máximo de 256 caracteres. El cuadro de entrada en sí mismo, físicamente tiene 64 caracteres de ancho y muestra el texto <code>usuario@ejemplo.gov</code> como marcador de posición cada vez que el campo está vacío. Además, al utilizar el atributo {{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}, el cuadro se configura para permitir al usuario ingresar cero o más direcciones de correoᵉ, separadas por comas, como se describe en {{anch("Permitir varias direcciones de correoᵉ")}}. Como toque final, el atributo {{web.link("/es/docs/Web/HTML/Attributes/list", "list")}} contiene el ID de un {{HTMLElement("datalist")}} cuyas {{HTMLElement("option")}}es especifican un conjunto de valores sugeridos que el usuario puede elegir.</p>
-
-<p>Como toque adicional, el elemento {{HTMLElement("label")}} se utiliza para establecer una etiqueta para el cuadro de entrada de Correoᵉ, con su atributo {{HTMLAttrxRef("for", "label")}} que hace referencia al ID <code>emailAddress</code> del elemento {{HTMLElement("input")}}. Al asociar los dos elementos de esta manera, entonces al hacer clic en la etiqueta se enfocará el elemento de entrada.</p>
-
-<pre class="brush: html notranslate">&lt;label for="emailAddress"&gt;Correoᵉ&lt;/label&gt;&lt;br/&gt;
-&lt;input id="emailAddress" type="email" placeholder="usuario@ejemplo.gov"
-       list="defaultEmails" size="64" maxlength="256" multiple&gt;
-
-&lt;datalist id="defaultEmails"&gt;
-  &lt;option value="jbond007@mi6.defence.gov.uk"&gt;
-  &lt;option value="jbourne@unknown.net"&gt;
-  &lt;option value="nfury@shield.org"&gt;
-  &lt;option value="tony@starkindustries.com"&gt;
-  &lt;option value="hulk@grrrrrrrr.arg"&gt;
-&lt;/datalist&gt;</pre>
-
-<p>{{EmbedLiveSample('Ejemplos', 600, 50)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'forms.html#e-mail-state-(type=email)', '&lt;input type="email"&gt;')}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'sec-forms.html#email-state-typeemail', '&lt;input type="email"&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.input.input-email")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Forms", "Guía de formularios HTML")}}</li>
- <li>{{HTMLElement("input")}}</li>
- <li><code><a href="/es/docs/Web/HTML/Element/input/tel">&lt;input type="tel"&gt;</a></code></li>
- <li><code><a href="/es/docs/Web/HTML/Element/input/url">&lt;input type="url"&gt;</a></code></li>
- <li>Atributos:
-  <ul>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/list", "list")}}</li>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/minlength", "minlength")}}</li>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/maxlength", "maxlength")}}</li>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/multiple", "multiple")}}</li>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/pattern", "pattern")}}</li>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/placeholder", "placeholder")}}</li>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/readonly", "readonly")}}</li>
-   <li>{{web.link("/es/docs/Web/HTML/Attributes/size", "size")}}</li>
-  </ul>
- </li>
- <li>{{web.link("/es/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets", "Compatibilidad de propiedades CSS")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/input/hidden/index.html b/files/es/web/html/elemento/input/hidden/index.html
deleted file mode 100644
index b7c1c42126..0000000000
--- a/files/es/web/html/elemento/input/hidden/index.html
+++ /dev/null
@@ -1,201 +0,0 @@
----
-title: <input type="hidden">
-slug: Web/HTML/Elemento/input/hidden
-tags:
-  - Element
-  - Forms
-  - HTML
-  - HTML Form
-  - Input
-  - Tipos de Input
-  - formulários
-  - hidden
-translation_of: Web/HTML/Element/input/hidden
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">{{HTMLElement("input")}} elements of type <code><strong>"hidden"</strong></code> let web developers include data that cannot be seen or modified by users when a form is submitted. For example, the ID of the content that is currently being ordered or edited, or a unique security token. Hidden inputs are completely invisible in the rendered page, and there is no way to make it visible in the page's content.</span></p>
-
-<div class="note">
-<p><strong>Note</strong>: Hay un ejemplo en vivo debajo de las siguientes líneas de código — si esta funcionando correctamente no debería ver algo.</p>
-</div>
-
-<div id="Basic_example">
-<pre class="brush: html">&lt;input id="prodId" name="prodId" type="hidden" value="xm234jq"&gt;</pre>
-
-<p>{{ EmbedLiveSample('Basic_example', 600, 40) }}</p>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td><strong>{{anch("Value")}}</strong></td>
-   <td>{{domxref("DOMString")}} representando el valor de un campo oculto que se espetra pasar al servidor.</td>
-  </tr>
-  <tr>
-   <td><strong>Events</strong></td>
-   <td>Ninguno.</td>
-  </tr>
-  <tr>
-   <td><strong>Supported Common Attributes</strong></td>
-   <td>{{htmlattrxref("autocomplete", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>IDL attributes</strong></td>
-   <td><code>value</code></td>
-  </tr>
-  <tr>
-   <td><strong>Methods</strong></td>
-   <td>Ninguno.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Valor_(Value)">Valor (Value)</h2>
-
-<p>El atributo {{htmlattrxref("value", "input")}} del elemento {{HTMLElement("input")}}  tiene un {{domxref("DOMString")}} que contiene la información oculta que se desea incluir en el formulario cuando sea remitido al servidor. Específicamente no puede ser editado por el usuario o mostrado a éste por medio la interfaz de usuario, aunque puede ser editado por medio de las herramientas para desarrolladores del navegador.</p>
-
-<div class="warning">
-<p>Mientras que el valor no es desplegado al usuario en el contenido de la página, si es visible —y puede ser modificado—usando las herramientas para desarrolladores de cualquier navegador o la funcionalidad "Ver código fuente" (View Source). No confíe en <code>hidden</code> inputs como una forma de seguridad.</p>
-</div>
-
-<h2 id="Utilizando_hidden_inputs">Utilizando hidden inputs</h2>
-
-<p>Como se menciono anteriormente, las hidden inputs pueden ser utilizadas donde sea que se quiera incluir información del formulario que el usuario no pueda ver o modificar cuando sea enviado al servidor. Se mostrarán algunos ejemplos que ilustran su uso.</p>
-
-<h3 id="Seguimiento_de_contenido_editado">Seguimiento de contenido editado</h3>
-
-<p>Uno de los usos más comunes para los hidden inputs es mantener un seguimiento de que registros de la base de datos necesitan actualizarse cuando un formulario de actualización es remitido. Un flujo de trabajo tipico se ve como:</p>
-
-<ol>
- <li>El usuario decide editar algún contenido sobre el cual tiene control, como una entrada de blog o la entrada de un producto. Comienza cuando se presiona el botón de editar.</li>
- <li>El contenido ha ser editado es tomado de la base de datos y cargados en un formulario HTML para permitir al usuario hacer cambios.</li>
- <li>Después de editar, el usuario remite el formulario y la información actualizada es envíada de vuelta al servidor para ser actualizada en el servidor.</li>
-</ol>
-
-<p>La idea es que durante el paso 2, el ID del registro que se actualiza se mantenga en un hidden input. Cuando se envía el formulario en el paso 3, el ID se envía automáticamente al servidor con el contenido del registro. El ID permite que el componente de servidor del sitio sepa exactamente qué registro necesita ser actualizado con los datos enviados.</p>
-
-<p>Puede ver un ejemplo completo de como podría ser en la sección {{anch("Examples")}} de abajo.</p>
-
-<h3 id="Mejorando_la_seguridad_del_sitio_web">Mejorando la seguridad del sitio web</h3>
-
-<p>Hidden inputs también son usados para almacenar y enviar token de seguirdad o secretos (<em>secrets)</em>, con el propósito de mejorar la seguridad del sitio web. La idea básica es que si un usuario esta rellenando un formulario con información sensible, como un formulario en un sitio web bancario para transferir dinero a otra cuenta, el secreto que proporciona demostraría que son quienes dicen ser y que estan usando el formulario correcto para enviar la solicitud de transferencia.</p>
-
-<p>Esto evitaría que un usuario malicioso creara un formulario falso, fingiendo ser un banco y enviando el formulario por correo electrónico a usuarios desprevenidos para engañarlos y que transfieran dinero al lugar equivocado. Este tipo de ataque es llamado como <a href="/en-US/docs/Learn/Server-side/First_steps/Website_security#Cross_Site_Request_Forgery_(CSRF)">Cross Site Request Forgery (CSRF)</a>; prácticamente cualquier marco de trabajo que goce de buena reputación utiliza secretos ocultos para evitar tales ataques.</p>
-
-<div class="note">
-<p>Como se menciono anteriormenre, colocando el secreto en un hidden input no lo hace inherentemente seguro. La composición y codificación de la llave haría eso. El valor del hidden input es que mantiene el secreto asociado con la información y automáticamente lo incluye cuando el formulario es enviado al servidor. Se necesita usar secretos bien diseñados para realmente mantener seguro el sitio web.</p>
-</div>
-
-<h2 id="Validación">Validación</h2>
-
-<p>Hidden inputs no participan en la validación de restricciones; no son un valor real que deba ser restringido.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>En el código de abajo se muestra como se puede implementar una versión simple de un formulario de actualización descrito anteriomente (ver {{anch("Tracking edited content")}}), utilizando un hidden input para recordar el ID del registro ha ser editado.</p>
-
-<p>El formulario HTML puede verse un como como este:</p>
-
-<pre class="brush: html">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="title"&gt;Título del artículo:&lt;/label&gt;
-    &lt;input type="text" id="titulo" name="titulo" value="Mi excelente artículo del blog"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;label for="content"&gt;Contenido del artículo:&lt;/label&gt;
-    &lt;textarea id="contenido" name="contenido" cols="60" rows="5"&gt;
-Este es el contenido de mi excelente actículo del blog. ¡Espero lo disfrutes!
-    &lt;/textarea&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button type="submit"&gt;Actualizar artículo&lt;/button&gt;
-  &lt;/div&gt;
-  &lt;input type="hidden" id="acticuloId" name="articuloId" value="34657"&gt;
-&lt;/form&gt;</pre>
-
-<p>Añadiendo también unas líneas simples de CSS:</p>
-
-<pre class="brush: css">html {
-  font-family: sans-serif;
-}
-
-form {
-  width: 500px;
-}
-
-div {
-  display: flex;
-  margin-bottom: 10px;
-}
-
-label {
-  flex: 2;
-  line-height: 2;
-  text-align: right;
-  padding-right: 20px;
-}
-
-input, textarea {
-  flex: 7;
-  font-family: sans-serif;
-  font-size: 1.1rem;
-  padding: 5px;
-}
-
-textarea {
-  height: 60px;
-}</pre>
-
-<p>El servidor establecerá el valor del hidden input con el ID <code>"articuloID"</code> al ID del artículo en la base de datos antes de enviar el formulario al navegador del usuario, y se usará esa información cuando el formulario sea devuelto para saber que registro de la base de datos actualizar con la información modificada. No se necesitan scripts en el contenido para manejar esto.</p>
-
-<p>La salida se vería como:</p>
-
-<p>{{ EmbedLiveSample('Examples', '100%', 200) }}</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Puede encontrar el ejemplo en GitHub (vea el <a href="https://github.com/mdn/learning-area/blob/master/html/forms/hidden-input-example/index.html">código fuente</a>, y también <a href="https://mdn.github.io/learning-area/html/forms/hidden-input-example/index.html">veálo corriendo en vivo</a>).</p>
-</div>
-
-<p>Cuando se envían, los datos del formulario enviados al servidor tendrán un aspecto parecido a este:</p>
-
-<p><code>title=My+excellent+blog+post&amp;content=This+is+the+content+of+my+excellent+blog+post.+I+hope+you+enjoy+it!&amp;postId=34657</code></p>
-
-<p>A pesar de que los hiden input no se pueden ver en absoluto, sus datos se siguen enviando.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#hidden-state-(type=hidden)', '&lt;input type="hidden"&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'forms.html#hidden-state-(type=hidden)', '&lt;input type="hidden"&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
-
-
-
-<p>{{Compat("html.elements.input.input-hidden")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms">HTML forms guide</a></li>
- <li>{{HTMLElement("input")}} y la interfaz {{domxref("HTMLInputElement")}} en la que se basa</li>
-</ul>
diff --git a/files/es/web/html/elemento/input/index.html b/files/es/web/html/elemento/input/index.html
deleted file mode 100644
index 7af5101141..0000000000
--- a/files/es/web/html/elemento/input/index.html
+++ /dev/null
@@ -1,1529 +0,0 @@
----
-title: input
-slug: Web/HTML/Elemento/input
-tags:
-  - Elemento
-  - Etiqueta HTML input
-  - Formularios(2)
-  - HTML
-  - Referencia
-  - Web
-  - formularios html(2)
-translation_of: Web/HTML/Element/input
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento HTML <code>&lt;input&gt;</code> se usa para crear controles interactivos para formularios basados en la web con el fin de recibir datos del usuario.<span class="tlid-translation translation" lang="es"><span title="">Hay disponible una amplia variedad de tipos de datos de entrada y widgets de control, que dependen del dispositivo y el agente de usuario (<a href="/en-US/docs/Glossary/user_agent">user agent</a>).El elemento </span></span><code>&lt;input&gt;</code><span class="tlid-translation translation" lang="es"><span title=""> es uno de los más potentes y complejos en todo HTML debido a la gran cantidad de combinaciones de tipos y atributos de entrada.</span></span></p>
-
-<p> </p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">Contenido dinámico</a>, enlistado, presentable, reajustable, elemento asociado a formulario, <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual</a>. Si su atributo {{htmlattrxref("type", "input")}} no es <code>hidden</code>, entonces contenido etiquetable, contenido palpable.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno, pues es un {{Glossary("empty element", "elemento vacío")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>Debe tener una etiqueta de apertura y no debe tener etiqueta de cierre.</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLInputElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales" rel="internal" title="en/HTML/Global attributes">atributos globales</a>, y los indicados a continuación.</p>
-
-<dl>
- <dt>{{htmlattrdef("type")}}</dt>
- <dd>El tipo de control a mostrar. Su valor predeterminado es <code>text</code>, si no se especifica este atributo. Los posibles valores son:
- <ul>
-  <li><code>button</code>: Botón sin un comportamiento específico.</li>
-  <li><code>checkbox</code>: Casilla de selección. Se debe usar el atributo <strong>value</strong> para definir el valor que se enviará por este elemento. Se usa el atributo <strong>checked</strong> para indicar si el elemento está seleccionado. También se puede usar el atributo <strong>indeterminate</strong> (el cual solo se puede establecer programaticamente) para indicar que la casilla está en un estado indeterminado (en la mayoría de las plataformas, se dibuja una línea horizontal a través de la casilla).</li>
-  <li><code>color</code>: {{HTMLVersionInline("5")}} Control para espicificar un color. Una interfaz de selección de color no requiere más funcionalidad que la de aceptar colores simples como texto (<a href="http://www.w3.org/TR/html5/forms.html#color-state-(type=color)">más información</a>).</li>
-  <li><code>date</code>: {{HTMLVersionInline("5")}} Control para introducir una fecha (año, mes y día, sin tiempo).</li>
-  <li><code>datetime</code>: {{HTMLVersionInline("5")}} {{deprecated_inline}} {{obsolete_inline}} Control para introducir una fecha y hora (horas, minutos, segundos y fracción de segundo), basado en la zona horaria UTC. <strong>Esta característica ha sido <a href="https://github.com/whatwg/html/issues/336">removida de WHATWG HTML.</a></strong></li>
-  <li><code>datetime-local</code>: {{HTMLVersionInline("5")}} Control para introducir fecha y hora, sin zona horaria específica.</li>
-  <li><code>email</code>: {{HTMLVersionInline("5")}} Campo para introducir una dirección de correo electrónico. El valor introducido se valida para que contenga una cadena vacía o una dirección de correo válida antes de enviarse. Las pseudo-clases {{cssxref(":valid")}} y {{cssxref(":invalid")}} son aplicadas segun corresponda.</li>
-  <li><code>file</code>: Control que permite al usuario seleccionar un archivo. Se puede usar el atributo <strong>accept</strong> para definir los tipos de archivo que el control podrá seleccionar.</li>
-  <li><code>hidden</code>: Control que no es mostrado en pantalla, pero cuyo valor es enviado al servidor.</li>
-  <li><code>image</code>: Botón de envío de formulario con gráfico. Se debe usar el atributo <strong>src</strong> para definir el origen de la imagen y el atributo <strong>alt</strong> para definir un texto alternativo. Se puede usar los atributos <strong>height</strong> y <strong>width</strong> para definir el tamaño de la imagen en píxeles.</li>
-  <li><code>month</code>: {{HTMLVersionInline("5")}} Control para introducir un mes y año, sin zona horaria específica.</li>
-  <li><code>number</code>: {{HTMLVersionInline("5")}} Control para introducir un número de punto flotante.</li>
-  <li><code>password</code>: Control de línea simple cuyo valor permanece oculto. Se puede usar el atributo <strong>maxlength</strong> para especificar la longitud máxima del valor que se puede introducir.</li>
-  <li><code>radio</code>: Botón radio. Se debe usar el atributo <strong>value</strong> para definir el valor que se enviará por este elemento. Se usa el atributo <strong>checked</strong> para indicar si el elemento está seleccionado de forma predeterminada. Los botones radio que tengan el mismo valor para su atributo <strong>name</strong> están dentro del mismo "grupo de botones radio". Solo un botón radio dentro de un grupo puede ser seleccionado a la vez.</li>
-  <li><code>range</code>: {{HTMLVersionInline("5")}} Control para introducir un número cuyo valor exacto no es importante. Este control usa los siguientes valores predeterminados si no se especifica cada atributo:
-   <ul>
-    <li><code>min</code>: 0</li>
-    <li><code>max</code>: 100</li>
-    <li><code>value</code>: <code>min</code> + (<code>max -</code> <code>min</code>) / 2, o <code>min</code> si <code>max</code> es menor que <code>min</code></li>
-    <li><code>step</code>: 1</li>
-   </ul>
-  </li>
-  <li><code>reset</code>: Botón que restaura los contenidos de un formulario a sus valores predeterminados.</li>
-  <li><code>search</code>: {{HTMLVersionInline("5")}} Cuadro de texto de línea simple para introducir textos de búsqueda. Los saltos de línea son eliminados automáticamente del valor introducido.</li>
-  <li><code>submit</code>: Botón que envía el formulario.</li>
-  <li><code>tel</code>: {{HTMLVersionInline("5")}} Control para introducir un número telefónico. Los saltos de línea son eliminados automáticamente del valor introducido, pero no hay otra sintaxis forzada. Se pueden usar atributos como <strong>pattern</strong> y <strong>maxlength</strong> para restringir los valores introducidos en este control. Las pseudo-clases CSS {{cssxref(":valid")}} y {{cssxref(":invalid")}} son aplicadas segun corresponda.</li>
-  <li><code>text</code>: Campo de texto de línea simple. Los saltos de línea son eliminados automáticamente del valor introducido.</li>
-  <li><code>time</code>: {{HTMLVersionInline("5")}} Control para introducir un valor de tiempo sin zona horaria específica.</li>
-  <li><code>url</code>: {{HTMLVersionInline("5")}} Campo para editar una URL. El valor introducido se valida para que contenga una cadena vacía o una ruta URL absoluta antes de enviarse. Los saltos de línea y espacios en blanco al principio o al final del valor son eliminados automáticamente. Se pueden usar atributos como <strong>pattern</strong> y <strong>maxlength</strong> para restringir los valores introducidos en el control. Las pseudo-clases {{cssxref(":valid")}} y {{cssxref(":invalid")}} son aplicadas segun corresponda.</li>
-  <li><code>week</code>: {{HTMLVersionInline("5")}} Control para introducir una fecha que consiste en número de semana del año y número de semana sin zona horaria específica.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("accept")}}</dt>
- <dd>Si el valor del atributo <strong>type</strong> es <code>file</code>, este atributo indica los tipos de archivo que el servidor acepta, de otra manera será ignorado. El valor debe ser una lista de tipos de contenido únicos, separados por coma:
- <ul>
-  <li>Una extensión de archivo, comenzando por el caracter STOP (U+002E). (Ejemplos: ".jpg,.png,.doc")</li>
-  <li>Un tipo MIME válido sin extensiones</li>
-  <li><code>audio/*</code>, que representa archivos de audio {{HTMLVersionInline("5")}}</li>
-  <li><code>video/*</code>, que representa archivos de vídeo {{HTMLVersionInline("5")}}</li>
-  <li><code>image/*</code>, que representa archivos de imagen {{HTMLVersionInline("5")}}</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("accesskey")}} sólo {{HTMLVersionInline(4)}}, {{obsoleteGeneric("inline", "HTML5")}}</dt>
- <dd>Un caracter que el usuario puede presionar para establecer el cursor en el control. Este atributo es global en HTML5.</dd>
- <dt>{{htmlattrdef("mozactionhint")}} {{non-standard_inline}}</dt>
- <dd>Especifica una "pista de acción" usada para determinar cómo etiquetar la tecla "enter" en dispositivos móviles con teclados virtuales. Los valores soportados son <code>go</code>, <code>done</code>, <code>next</code>, <code>search</code>, y <code>send</code>. Esto queda automáticamente mapeado al texto apropiado y no son sensibles al uso de mayúsculas.</dd>
- <dt>{{htmlattrdef("autocapitalize")}} {{non-standard_inline}}</dt>
- <dd>Atributo no estándar usado por <a href="https://developers.google.com/web/updates/2015/04/autocapitalize">Chrome</a> e iOS Safari Mobile, el cual controla si se deben cambiar los textos a mayúsculas automáticamente mientras son introducidos/editados por el usuario, y la forma en que esto se hará. Los valores no obsoletos están disponibles en iOS5 y superior. Los valores posibles son:
- <ul>
-  <li><code>none</code>: Deshabilita completamente las mayúsculas automáticas.</li>
-  <li><code>sentences</code>: Cambia automáticamente a mayúscula la primera letra de la sentencia.</li>
-  <li><code>words</code>: Cambia automáticamente a mayúscula la primera letra de cada palabra.</li>
-  <li><code>characters</code>: Cambia automáticamente a mayúscula todos los caracteres.</li>
-  <li><code>on</code>: {{deprecated_inline}} Obsoleto desde iOS 5.</li>
-  <li><code>off</code>: {{deprecated_inline}} Obsoleto desde iOS 5.</li>
- </ul>
- <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html#//apple_ref/doc/uid/TP40008058-autocapitalize">Documentation sobre <code>autocapitalize</code> en la Referencia HTML de Safari</a></dd>
- <dt>{{htmlattrdef("autocomplete")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo indica si el valor del control puede ser completado automáticamente por el navegador.</dd>
- <dd>Los valores posibles son:
- <ul>
-  <li><code>off</code>: El usuario debe explícitamente introducir un valor en este campo para cualquier uso, o el documento provee su propio método de auto-completado. El navegador no completa automáticamente lo introducido.</li>
-  <li><code>on</code>: Se permite al navegador completar automáticamente el valor basado en los valores que se han introducido previamente. Sin embargo, <code>on</code> no provee mayor información sobre qué clase de datos podría esperar el usuario introducir.</li>
-  <li><code>name</code>: Nombre completo.</li>
-  <li><code>honorific-prefix</code>: Prefixo o título (Ejemplos: "Sr.", "Sra.", "Dr.", "Srita.").</li>
-  <li><code>given-name</code>: Nombre de pila.</li>
-  <li><code>additional-name</code>: Segundo nombre.</li>
-  <li><code>family-name</code>: Apellido.</li>
-  <li><code>honorific-suffix</code>: Sufijo (Ejemplos: "Hijo", "Señor", "II").</li>
-  <li><code>nickname</code>: Apodo.</li>
-  <li><code>email</code>: Correo electrónico.</li>
-  <li><code>username</code>: Nombre de usuario.</li>
-  <li><code>new-password</code>: Nueva contraseña (por ejemplo, al crear una cuenta o cambiar la contraseña).</li>
-  <li><code>current-password</code>: Contraseña actual.</li>
-  <li><code>organization-title</code>: Título de organización (Ejemplos: "Ingeniero de Software", "Vicepresidente", "Director General Adjunto").</li>
-  <li><code>organization</code>: Organización.</li>
-  <li><code>street-address</code>: Calle (en dirección).</li>
-  <li><code>address-line1</code>, <code>address-line2</code>, <code>address-line3</code>, <code>address-level4</code>, <code>address-level3</code>, <code>address-level2</code>, <code>address-level1</code>: Valores para dirección.</li>
-  <li><code>country</code>: País.</li>
-  <li><code>country-name</code>: Nombre del país.</li>
-  <li><code>postal-code</code>: Código postal.</li>
-  <li><code>cc-name</code>: Nombre completo en un instrumento de pago.</li>
-  <li><code>cc-given-name</code>: Nombre de pila en un instrumento de pago.</li>
-  <li><code>cc-additional-name</code>: Segundo nombre en un instrumento de pago.</li>
-  <li><code>cc-family-name</code>: Apellido en un instrumento de pago.</li>
-  <li><code>cc-number</code>: Código de identificación de un instrumento de pago(por ejemplo, el número de tarjeta de crédito).</li>
-  <li><code>cc-exp:</code> Fecha de expiración de un instrumento de pago.</li>
-  <li><code>cc-exp-month</code>: Mes de expiración en un instrumento de pago.</li>
-  <li><code>cc-exp-year</code>: Año de expiración en un instrumento de pago.</li>
-  <li><code>cc-csc</code>: Código de seguridad en un instrumento de pago.</li>
-  <li><code>cc-type</code>: Tipo de instrumento de pago (por ejemplo, Visa).</li>
-  <li><code>transaction-currency</code>: Tipo de moneda de la transacción.</li>
-  <li><code>transaction-amount</code>: Monto de la transacción.</li>
-  <li><code>language</code>: Idioma preferido, etiqueta BCP 47 válida.</li>
-  <li><code>bday</code>: Fecha de cumpleaños.</li>
-  <li><code>bday-day</code>: Día de cumpleaños.</li>
-  <li><code>bday-month</code>: Mes de cumpleaños.</li>
-  <li><code>bday-year</code>: Año de cumpleaños.</li>
-  <li><code>sex</code>: Sexo (ejemplos, Femenino, Female, Fa'afafine), texto libre, sin líneas nuevas.</li>
-  <li><code>tel</code>: Teléfono.</li>
-  <li><code>url</code>: Dirección web correspondiente a la compañía, persona, dirección o información de contacto en los demás campos asociados a éste.</li>
-  <li><code>photo</code>: Fotografía, ícono u otra imagen correspondiente a la compañía, persona, dirección o información de contacto en los otros campos asociados a éste.</li>
- </ul>
-
- <p>Véase el <a href="https://html.spec.whatwg.org/multipage/forms.html#autofill">Estándar WHATWG</a> para információn más detallada.</p>
-
- <p>Si el atributo <strong>autocomplete</strong> no está especificado en un elemento input, el navegador usa el atributo <strong>autocomplete</strong> del formulario al que pertenece el elemento <code>&lt;input&gt;</code>, es decir, el elemento <code>form</code> del cual es descendiente el elemento <code>&lt;input&gt;</code>, o aquél cuyo <strong>id</strong> está especificado en el atributo <strong>form</strong> del elemento input. Para mayor información, véase el atributo {{htmlattrxref("autocomplete", "form")}} en {{HTMLElement("form")}}.</p>
-
- <p>El atributo <strong>autocomplete</strong> también controla si Firefox, a diferencia de otros navegadores, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">persistirá el estado deshabilitado dinámico, y (si aplica) la selección dinámica</a> de un <code>&lt;input&gt;</code> a través de las cargas de la página. La característica de persistencia está habilitada de forma predeterminada. Estableciendo el valor de <strong>autocomplete</strong> como <code>off</code> se deshabilita esta característica. Esto funciona aún cuando el atributo <strong>autocomplete</strong> no se aplicaría normalmente al <code>&lt;input&gt;</code> en virtud de su atributo <strong>type</strong>. Véase {{bug(654072)}}.</p>
-
- <p>Para navegadores más modernos (incluyendo Firefox 38+, Google Chrome 34+, IE 11+), establecer el atributo <strong>autocomplete</strong> <em>no</em> previene que el administrador de contraseñas del navegador le pregunte al usuario si desea guardar la información de inicio de sesión (usuario y contraseña), ni tampoco, de permitirlo el usuario, que se autocompleten estos campos la próxima vez que el usuario visite la página. Véase <a href="/es/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#The_autocomplete_attribute_and_login_fields">El atributo autocomplete y campos de inicio de sesión</a>.</p>
- </dd>
- <dt>{{htmlattrdef("autocorrect")}} {{non-standard_inline}}</dt>
- <dd>Es un atributo no estándar, soportado por Safari, que es usado para controlar si la autocorrección debe estar habilitada cuando el usuario está introduciendo/editando el texto de un <code>&lt;input&gt;</code>. Los valores posibles de este atributo son:
- <ul>
-  <li><code>on</code>: Habilita la autocorrección</li>
-  <li><code>off</code>: Deshabilita la autocorrección</li>
- </ul>
- <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html#//apple_ref/doc/uid/TP40008058-autocorrect">Documentación de <code>autocorrect</code> en la Referencia HTML de Safari</a></dd>
- <dt>{{htmlattrdef("autofocus")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo Booleano permite especificar que un control de formulario tenga el cursor cuando la página se carga, a menos que el usuario lo reemplace, por ejemplo, escribiendo en un control diferente. Solo un elemento de formulario en un mismo documento puede tener el atributo <strong>autofocus</strong>, el cual es Booleano. No puede ser aplicado si el atributo <strong>type</strong> tiene valor <code>hidden</code> (es decir, no se puede establecer automáticamente el cursor en un control oculto). Nótese que el cursor se podría establecer en el control antes de disparar el evento <a href="/es/docs/Web/Events/DOMContentLoaded"><code>DOMContentLoaded</code>.</a></dd>
- <dt>{{htmlattrdef("capture")}}</dt>
- <dd>
- <p>Cuando el valor del atributo <strong>type</strong> es <code>file</code>, la presencia de este atributo Booleano indica que se le dará preferencia a la captura del medio directamente del ambiente del dispositivo, usando algún <a href="https://www.w3.org/TR/html-media-capture/#dfn-media-capture-mechanism">mecanismo de captura de medios</a>.</p>
- </dd>
- <dt>{{htmlattrdef("checked")}}</dt>
- <dd>
- <p>Cuando el valor del atributo <strong>type</strong> es <code>radio</code> o <code>checkbox</code>, la presencia de este atributo Booleano indica que el control está seleccionado de forma predeterminada. De lo contrario, será ignorado.</p>
-
- <p>En Firefox, a diferencia de otros navegadores, de forma predeterminada, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">se persiste el estado de selección dinámico</a> en un <code>&lt;input&gt;</code> a través de las cargas de la página. Para controlar esta característica se usa el atributo {{htmlattrxref("autocomplete","input")}}.</p>
- </dd>
- <dt>{{htmlattrdef("disabled")}}</dt>
- <dd>
- <p>Este atributo Booleano indica que el control no está disponible para interacción. En particular, el evento <code>click</code> <a class="external" href="https://html.spec.whatwg.org/multipage/forms.html#enabling-and-disabling-form-controls:-the-disabled-attribute">no será invocado</a> en controles deshabilitados. De igual forma, el valor de un control deshabilitado no es enviado con el formulario.</p>
-
- <p>En Firefox, a diferencia de otros navegadores, de forma predeterminada, <a href="http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing">se persiste el estado de selección dinámico</a> en un <code>&lt;input&gt;</code> a través de las cargas de la página. Para controlar esta característica se usa el atributo {{htmlattrxref("autocomplete","input")}}.</p>
- </dd>
- <dt>{{htmlattrdef("form")}} {{HTMLVersionInline("5")}}</dt>
- <dd>El elemento form al que está asociado el elemento (su <em>formulario propietario</em>). El valor del atributo debe ser el <strong>id</strong> de un elemento {{HTMLElement("form")}} en el mismo documento. Si el atributo no es especificado, este elemento <code>&lt;input&gt;</code> deberá ser descendiente de un elemento {{HTMLElement("form")}}. Este atributo permite poner elementos <code>&lt;input&gt;</code> en cualquier parte dentro de un documento, no solamente como descendientes de su formulario. Un input puede ser asociado sólo con un formulario.</dd>
- <dt>{{htmlattrdef("formaction")}} {{HTMLVersionInline("5")}}</dt>
- <dd>El URI de un programa que procesa la información enviada por el elemento input, cuando es un botón de tipo <code>submit</code> o <code>image</code>. Si se especifica, reemplaza al atributo {{htmlattrxref("action","form")}} del formulario al que pertenece el elemento.</dd>
- <dt>{{htmlattrdef("formenctype")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si el elemento es de tipo <code>submit</code> o <code>image</code>, este atributo especifica el tipo de contenido que es usado para enviar el formulario al servidor. Los valores posibles son:
- <ul>
-  <li><code>application/x-www-form-urlencoded</code>: El valor predeterminado si el atributo no es especificado.</li>
-  <li><code>multipart/form-data</code>: Se usa este valor cuando se tiene un elemento <code>&lt;input&gt;</code> con atributo {{htmlattrxref("type","input")}} de valor <code>file</code>.</li>
-  <li><code>text/plain</code></li>
- </ul>
-
- <p>Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("enctype","form")}} del formulario al que pertenece el elemento.</p>
- </dd>
- <dt>{{htmlattrdef("formmethod")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si el elemento input es un botón de tipo <code>submit</code> o <code>image</code>, este atributo especifica el método HTTP que el navegador usará para enviar el formulario. Los valores posibles son:
- <ul>
-  <li><code>post</code>: Los datos del formulario son incluidos en el cuerpo del formulario, y enviados al servidor.</li>
-  <li><code>get</code>: Los datos del formulario son añadidos al URI del <strong>form</strong> con un símbolo '?' como separador, y el URI resultante es enviado al servidor. Se usa este método cuando el formulario no tiene efectos secundarios y contiene solamente caracteres ASCII.</li>
- </ul>
-
- <p>Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("method","form")}} del formulario al que pertenece el elemento.</p>
- </dd>
- <dt>{{htmlattrdef("formnovalidate")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si el elemento input es de tipo <code>submit</code> o <code>image</code>, este atributo Booleano especifica que el formulario no será validado cuando se envíe. Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("novalidate","form")}} del formulario al que pertenece el elemento.</dd>
- <dt>{{htmlattrdef("formtarget")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si el elemento input es de tipo <code>submit</code> o <code>image</code>, este atributo es el nombre o palabra clave que indica dónde mostrar la respuesta que se recibe después de enviar el formulario. Este es el nombre, o palabra clave, de un <em>contexto de navegación</em> (por ejemplo, pestaña, ventana o frame incrustado). Si este atributo está especificado, reemplaza al atributo {{htmlattrxref("target", "form")}} del formulario al que pertenece el elemento. Las siguientes palabras clave tienen significado especial:
- <ul>
-  <li>_<code>self</code>: Carga la respuesta en el mismo contexto de navegación actual. Este valor es el predeterminado cuando no se especifica el atributo.</li>
-  <li><code>_blank</code>: Carga la respuesta en un contexto de navegación nuevo.</li>
-  <li><code>_parent</code>: Carga la respuesta en el contexto de navegación padre del actual. Si no hay contexto padre, se comporta de la misma forma que <code>_self</code>.</li>
-  <li><code>_top</code>: Carga la respuesta en el contexto de navegación principal (es decir, el contexto que es ancestro del actual y que no tenga padre). Si no hay contexto padre, se comporta de la misma forma que <code>_self</code>.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("height")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si el valor del atributo <strong>type</strong> es <code>image</code>, este atributo define la altura de la imagen mostrada para el botón.</dd>
- <dt>{{htmlattrdef("incremental")}} {{non-standard_inline}}</dt>
- <dd>Es un atributo no estándar, soportado por WebKit (Safari) y Blink (Chrome), que solo aplica cuando el atributo <strong>type</strong> es <code>search</code>. Si el atributo está presente, sin importar su valor, el <code>&lt;input&gt;</code> dispara eventos <a href="/en-US/docs/Web/Events/search"><code>search</code></a> conforme el usuario edita el valor. El evento solo es disparado después de que un tiempo definido en implementación haya pasado desde la última vez que se presionó una tecla. Si el atributo está ausente, el evento <a href="/en-US/docs/Web/Events/search"><code>search</code></a> solo se disparará cuando el usuario explícitamente inicie una búsqueda (por ejemplo, presionando la tecla Enter dentro del control). <a href="https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/Attributes.html#//apple_ref/doc/uid/TP40008058-incremental"> Documentación de <code>incremental en la Referencia HTML de Safari</code></a></dd>
- <dt>{{htmlattrdef("inputmode")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Una pista para el navegador sobre qué teclado mostrar. Este atributo aplica cuando el valor del atributo <strong>type</strong> es text, password, email, o url. Los valores posibles son:
- <ul>
-  <li><code>verbatim</code>: Alfanumérico, sin contenido con significado, como nombres de usuario o contraseñas.</li>
-  <li><code>latin</code>: Escritura en caracteres de latín, en el lenguaje de elección del usuario, con ayuda de escritura, como predicción de texto. Para comunicación humano-computadora, como en cuadros de búsqueda.</li>
-  <li><code>latin-name</code>: Como <em>latin</em>, pero con nombres de personas.</li>
-  <li><code>latin-prose</code>: Como <em>latin</em>, pero con ayuda de escritura más agresiva. Para comunicación humano-humano, como mensajería instantánea o correo electrónico.</li>
-  <li><code>full-width-latin</code>: Como <em>latin-prose</em>, pero para idiomas secundarios del usuario.</li>
-  <li><code>kana</code>: Escritura en kana o romaji, típicamente escritura en hiragana, usando caracteres de anchura completa, con soporte para conversión a kanji. Usado para escritura en japonés.</li>
-  <li><code>katakana</code>: Escritura en katakana, usando caracteres de anchura completa, con soporte para conversión a kanji. Usado para escritura en japonés.</li>
-  <li><code>numeric</code>: Escritura en caracteres numéricos, incluyendo teclas para los dígitos de 0 a 9, el separador de miles segun las preferencias del usuario, y el caracter para indicar números negativos. Destinado a códigos numéricos, por ejemplo, números de tarjeta de crédito. Para valores numéricos reales, es preferible usar &lt;input type="number"&gt; en lugar de este atributo.</li>
-  <li><code>tel</code>: Escritura de teléfonos, incluído las teclas de asterisco y gato. Es preferible el uso de &lt;input type="tel"&gt; en lugar de este atributo.</li>
-  <li><code>email</code>: Escritura de correo electrónico. Es preferible el uso de &lt;input type="email"&gt; en lugar de este atributo.</li>
-  <li><code>url</code>: Escritura de URL. Es preferible el uso de &lt;input type="url"&gt; en lugar de este atributo.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("list")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Identifica una lista de opciones predefinidas como sugerencias al usuario. El valor debe ser el <strong>id</strong> de un elemento {{HTMLElement("datalist")}} en el mismo documento. El navegador muestra solamente las opciones que son válidas para el elemento. Este atributo es ignorado cuando el atributo <strong>type</strong> tiene valor <code>hidden</code>, <code>checkbox</code>, <code>radio</code>, <code>file</code>, o algun tipo de botón.</dd>
- <dt>{{htmlattrdef("max")}} {{HTMLVersionInline("5")}}</dt>
- <dd>El valor máximo (numérico o fecha-hora) para este elemento, el cual no debe ser menor que su valor mínimo (atributo <strong>min</strong>).</dd>
- <dt>{{htmlattrdef("maxlength")}}</dt>
- <dd>
- <p>Si el valor del atributo <strong>type</strong> es <code>text</code>, <code>email</code>, <code>search</code>, <code>password</code>, <code>tel</code>, o <code>url</code>, este atributo especifica el número máximo de caracteres (en puntos de código Unicode) que el usuario puede introducir. Para los otros tipos de control, es ignorado. Puede exceder el valor del atributo <strong>size</strong>. Si no se especifica, el usuario puede introducir una cantidad ilimitada de caracteres. Especificar un número negativo resulta en el comportamiento predeterminado (es decir, el usuario puede introducir una cantidad ilimitada de caracteres). La restricción es evaluada sólo cuando el valor del atributo ha sido modificado.</p>
- </dd>
- <dt>{{htmlattrdef("min")}} {{HTMLVersionInline("5")}}</dt>
- <dd>El valor mínimo (numérico o fecha-hora) para este elemento, el cual no debe ser mayor a su valor máximo (atributo <strong>max</strong>).</dd>
- <dt>{{htmlattrdef("minlength")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si el valor del atributo <strong>type</strong> es <code>text</code>, <code>email</code>, <code>search</code>, <code>password</code>, <code>tel</code>, o <code>url</code>, este atributo especifica la longitud mínima de caracteres (en puntos de código Unicode) que el usuario puede introducir. Para los otros tipos de control, es ignorado.</dd>
- <dt>{{htmlattrdef("multiple")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo Booleano indica si el usuario puede introducir más de un valor. Este atributo aplica cuando el atributo <strong>type</strong> es <code>email</code> o <code>file</code>, y en caso contrario es ignorado.</dd>
- <dt>{{htmlattrdef("name")}}</dt>
- <dd>El nombre del control, el cual es enviado con los datos del formulario.</dd>
- <dt>{{htmlattrdef("pattern")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Una expresión regular contra la que el valor es evaluado. El patrón debe coincidir con el valor completo, no solo una parte. Se puede usar el atributo <strong>title</strong> para describir el patrón como ayuda al usuario. Este atributo aplica cuando el atributo <strong>type</strong> es <code>text</code>, <code>search</code>, <code>tel</code>, <code>url</code>, <code>email</code>, o <code>password</code>, y en caso contrario es ignorado. El lenguaje de expresión regular es el mismo que el algoritmo {{jsxref("RegExp")}} de JavaScript, con el parámetro <code>'u'</code> que permite tratar al patrón como una secuencia de código Unicode. El patrón no va rodeado por diagonales.</dd>
- <dt>{{htmlattrdef("placeholder")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Una pista para el usuario sobre lo que puede introducir en el control. El texto no debe contener saltos de línea.
- <div class="note"><strong>Nota:</strong> No se debe usar el atributo <code>placeholder</code> en lugar de un elemento {{HTMLElement("label")}}, pues sus propósitos son diferentes. El elemento {{HTMLElement("label")}} describe el rol del elemento en el formulario (es decir, indica qué tipo de información se espera), y el atributo <code>placeholder</code> es una pista sobre el formato que debe tener el contenido. Hay casos en los que el atributo <code>placeholder</code> no es visible para el usuario, por lo que el formulario debe ser comprensible para el usuario aunque este atributo no esté presente.</div>
- </dd>
- <dt>{{htmlattrdef("readonly")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo indica que el usuario no puede modificar el valor del control. El valor del atributo es irrelevante. De ser necesario el acceso lectura-escritura al valor, <em>no</em> se debe agregar el atributo "<strong>readonly</strong>". Es ignorado si el atributo <strong>type</strong> es <code>hidden</code>, <code>range</code>, <code>color</code>, <code>checkbox</code>, <code>radio</code>, <code>file</code>, o de tipo botón (como <code>button</code> o <code>submit</code>).</dd>
- <dt>{{htmlattrdef("required")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo especifica que el usuario debe llenar el control antes de enviarlo al formulario. No puede ser usado cuando el atributo <strong>type</strong> es <code>hidden</code>, <code>image</code>, o de tipo botón (<code>submit</code>, <code>reset</code>, o <code>button</code>). Las pseudo-clases {{cssxref(":optional")}} y {{cssxref(":required")}} se aplicarán al campo según sea apropiado.</dd>
- <dt>{{htmlattrdef("results")}} {{non-standard_inline}}</dt>
- <dd>Este es un atributo no estándar, soportado por Safari, que sólo aplica cuando el atributo <strong>type</strong> es <code>search</code>. Es usado para controlar el máximo número de entradas que se deben mostrar en el listado nativo del <code>&lt;input&gt;</code> de búsquedas pasadas. Este valor debe ser un número entero no negativo.</dd>
- <dt>{{htmlattrdef("selectionDirection")}} {{HTMLVersionInline("5")}}</dt>
- <dd>La dirección en la que ocurre la selección. Esto es "forward" (hacia adelante) si la selección fue hecha de izquierda a derecha en una escritura LTR o izquierda a derecha en una escritura RTL, o "backward" (hacia atrás) si la selección fue hecha de forma opuesta. Puede ser "none" si la dirección de selección es desconocida.</dd>
- <dt>{{htmlattrdef("selectionEnd")}}</dt>
- <dd>La separación dentro del contenido de texto del último caracter seleccionado. Si no hay selección, este valor indica la separación para el caracter que sigue a la posición actual del cursor (es decir, la posición que el siguiente caracter que se escriba ocupará).</dd>
- <dt>{{htmlattrdef("selectionStart")}}</dt>
- <dd>La separación dentro del contenido del primer caracter seleccionado. Si no hay selección, este valor indica la separación para el caracter que sigue a la posición actual del cursor (es decir, la posición que el siguiente caracter que se escriba ocupará).</dd>
- <dt>{{htmlattrdef("size")}}</dt>
- <dd>El tamaño inicial del control. Este valor es en píxeles, a menos que el atributo <strong>type</strong> sea <code>text</code> o <code>password</code>, en cuyo caso será el número entero de caracteres. A partir de HTML5, este atributo aplica sólo cuando el atributo <strong>type</strong> es <code>text</code>, <code>search</code>, <code>tel</code>, <code>url</code>, <code>email</code>, o <code>password</code>, de otro modo es ignorado. Además, el tamaño debe ser mayor a cero. Si no se especifica un tamaño, se usa un valor predeterminado de 20. HTML5 simplemente establece que "el agente usuario debe asegurarse que al menos esa cantidad de caracteres sea visible", pero los caracteres pueden tener anchuras diferentes en ciertas fuentes. En algunos navegadores, una cadena con <em>x</em> caracteres no será completamente visible aunque su tamaño esté definido con un mínimo de <em>x</em>.</dd>
- <dt>{{htmlattrdef("spellcheck")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si se establece este atributo con valor <code>true</code>, se está indicando que se debe revisar la ortografía y gramática del elemento. El valor <code>default</code> indica que el elemento va a actuar acorde al comportamiento predeterminado del navegador, posiblemente basado en el valor del atributo <code>spellcheck</code> de su elemento padre. El valor <code>false</code> indica que el elemento no debe ser revisado.</dd>
- <dt>{{htmlattrdef("src")}}</dt>
- <dd>Si el atributo <strong>type</strong> es <code>image</code>, este atributo especifica el URI para la ubicación de la imagen a mostrar en el botón de envío gráfico. En caso contrario, es ignorado.</dd>
- <dt>{{htmlattrdef("step")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Trabaja con los atributos <strong>min</strong> y <strong>max</strong>, para limitar el incremento de valores numéricos o de fecha-hora. Puede ser el valor <code>any</code> o un número positivo de punto flotante. Si no se establece este atributo como <code>any</code>, el control acepta solamente valores múltiplos del valor del atributo, mayores al mínimo.</dd>
- <dt>{{htmlattrdef("tabindex")}} específico para el elemento en {{HTMLVersionInline(4)}}, global en {{HTMLVersionInline("5")}}</dt>
- <dd>La posición del elemento en el orden de navegación por la tecla Tab dentro del documento.</dd>
- <dt>{{htmlattrdef("usemap")}} solo para {{HTMLVersionInline(4)}}, {{obsoleteGeneric("inline", "HTML5")}}</dt>
- <dd>El nombre de un elemento {{HTMLElement("map")}} usado como mapa de imagen.</dd>
- <dt>{{htmlattrdef("value")}}</dt>
- <dd>El valor inicial del control. Este atributo es opcional, excepto cuando el atributo <strong>type</strong> es <code>radio</code> o <code>checkbox</code>.<br>
- Nótese que cuando se recarga la página, Gecko e IE <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=46845#c186">ignorarán el valor especificado en el código fuente HTML</a>, si el valor fue modificado antes de recargar.</dd>
- <dt>{{htmlattrdef("webkitdirectory")}} {{non-standard_inline}}</dt>
- <dd>Este atributo Booleano indica si el selector usado cuando el atributo <strong>type</strong> es <code>file</code> debe permitir la selección de directorios solamente.</dd>
- <dt>{{htmlattrdef("width")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Si el valor del atributo <strong>type</strong> es <code>image</code>, este atributo define la anchura de la imagen mostrada en el botón.</dd>
- <dt>{{htmlattrdef("x-moz-errormessage")}} {{non-standard_inline}}</dt>
- <dd>Esta extensión de Mozilla permite especificar el mensaje de error cuando un campo no es validado exitosamente.</dd>
-</dl>
-
-<h2 id="Notas">Notas</h2>
-
-<h3 id="Introducción_de_archivos">Introducción de archivos</h3>
-
-<div class="note">
-<p><strong>Nota:</strong> A partir de {{Gecko("2.0")}}, llamar al método <code>click()</code> en un elemento <code>&lt;input&gt;</code> de tipo "file" abre el selector de archivos y permite al usuario seleccionar archivos. Véase <a href="/es/docs/Using_files_from_web_applications">Utilizar ficheros desde aplicaciones web</a> para ejemplos y más detalles.</p>
-</div>
-
-<p>No se puede establecer el valor de un selector de archivos desde un script. Hacer algo como lo siguiente no tiene efecto alguno:</p>
-
-<pre class="brush: js notranslate">var e = getElementById("someFileInputElement");
-e.value = "foo";
-</pre>
-
-<h3 id="Mensajes_de_error">Mensajes de error</h3>
-
-<p>Para que Firefox presente un mensaje de error personalizado cuando la validación de un campo falla, se puede usar el atributo <code>x-moz-errormessage</code>:</p>
-
-<pre class="brush: html notranslate">&lt;input type="email" x-moz-errormessage="Por favor, especifique una dirección de correo válida."&gt;
-</pre>
-
-<p>Nótese, sin embargo, que esto no es estándar, y no tendrá efecto en otros navegadores.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h2 id="Ejemplo_1_Cuadro_de_texto_simple">Ejemplo 1: Cuadro de texto simple</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html notranslate">&lt;p&gt;Simple input box&lt;/p&gt;
-&lt;input type="text" value="Type here"&gt;
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Example_1_Simple_input_box', '', '100', '', 'Web/HTML/Element/input') }}</p>
-
-<h2 id="Ejemplo_2_Escenario_de_uso_común">Ejemplo 2: Escenario de uso común</h2>
-
-<h3 id="HTML_2">HTML</h3>
-
-<pre class="brush: html notranslate">&lt;p&gt;A common form that includes input tags&lt;/p&gt;
-&lt;form action="getform.php" method="get"&gt;
-    &lt;label&gt;First name: &lt;input type="text"&gt;&lt;/label&gt;&lt;br&gt;
-     &lt;label&gt;Last name: &lt;input type="text"&gt;&lt;/label&gt;&lt;br&gt;
-        &lt;label&gt;E-mail: &lt;input type="email"&gt;&lt;/label&gt;&lt;br&gt;
-&lt;input type="submit" value="Submit"&gt;
-&lt;/form&gt;
-</pre>
-
-<h3 id="Resultado_2">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Example_2_Common_use-case_scenario', '', '200', '', 'Web/HTML/Element/input') }}</p>
-
-<h3 id="Usando_mozactionhint_en_Firefox_mobile">Usando mozactionhint en Firefox mobile</h3>
-
-<p>Se puede usar el atributo {{htmlattrxref("mozactionhint", "input")}} para especificar el texto para la etiqueta de la tecla Enter en el teclado virtual cuando el formulario es mostrado en Firefox mobile. Por ejemplo, para mostrar una etiqueta "Next", se puede hacer esto:</p>
-
-<pre class="brush: html notranslate">&lt;input type="text" mozactionhint="next"&gt;
-</pre>
-
-<p>El resultado es:</p>
-
-<p><a href="/@api/deki/files/4970/=mozactionhint.png"><img alt="mozactionhint.png" class="default internal" src="/@api/deki/files/4970/=mozactionhint.png?size=webview" style="border: 1px solid black; height: 350px; width: 210px;"></a></p>
-
-<h2 id="Regionalización">Regionalización</h2>
-
-<p>Los valores permitidos para ciertos tipos de &lt;input&gt; dependen de la región. En algunos casos, 1,000.00 is a valid number, mientras en otros la manera válida de escribir un número es 1.000,00.</p>
-
-<p>Firefox usa la siguiente heurística para determinar la región con la cual validar los datos introducidos por el usuario (por lo menos para <code>type="number"</code>):</p>
-
-<ul>
- <li>Intenta con el lenguaje especificado por el atributo <code>lang</code>/<code>xml:lang</code> del elemento o de sus elementos ascendentes.</li>
- <li>Intenta con el lenguaje especificado en algun encabezado HTTP Content-Language o</li>
- <li>Si ninguno está especificado, usa la región definida en el navegador.</li>
-</ul>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#the-input-element', '&lt;input&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML Media Capture', '#the-capture-attribute','&lt;input capture&gt;')}}</td>
-   <td>{{Spec2('HTML Media Capture')}}</td>
-   <td>Añade el elemento <code>capture</code></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-input-element', '&lt;input&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.4', '&lt;form&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)<sup>[28]</sup></th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=button</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>3</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=checkbox</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}<br>
-    {{CompatGeckoDesktop("1.9.2")}}<sup>[2]</sup></td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=color</td>
-   <td>21.0</td>
-   <td>{{CompatGeckoDesktop("29.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>11.01</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>type=date</td>
-   <td>5.0<sup>[24]</sup></td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
-  </tr>
-  <tr>
-   <td>type=datetime</td>
-   <td>{{CompatNo}}<sup>[4]</sup></td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
-  </tr>
-  <tr>
-   <td>type=datetime-local</td>
-   <td>5.0</td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
-  </tr>
-  <tr>
-   <td>type=email</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=file</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>3.02</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=hidden</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=image</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}<sup>[5]</sup></td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=month</td>
-   <td>5.0</td>
-   <td>{{CompatNo}}<sup>[6]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
-  </tr>
-  <tr>
-   <td>type=number</td>
-   <td>6.0<sup>[7]</sup></td>
-   <td>{{CompatGeckoDesktop("29.0")}}</td>
-   <td>10<sup>[4]</sup></td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=password</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=radio</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}<br>
-    {{CompatGeckoDesktop("1.9.2")}}<sup>[2]</sup></td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=range</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>10</td>
-   <td>10.62<sup>[8]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=reset</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=search</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>11.01</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=submit</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=tel</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>11.01</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=text</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>type=time</td>
-   <td>5.0</td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
-  </tr>
-  <tr>
-   <td>type=url</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=week</td>
-   <td>5.0</td>
-   <td>{{CompatNo}}<sup>[3]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
-  </tr>
-  <tr>
-   <td>accept=[file extension]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>accept=[MIME type]</td>
-   <td>8.0</td>
-   <td>{{CompatGeckoDesktop("16.0")}}</td>
-   <td>10</td>
-   <td>10</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>accept=audio/*</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}<sup>[9]</sup></td>
-   <td>10</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>accept=video/*</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}<sup>[10]</sup></td>
-   <td>10</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>accept=image/*</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}<sup>[11]</sup></td>
-   <td>10</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>accept=[. + ext]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("37.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>accesskey</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>6</td>
-   <td>1.0</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>mozactionhint</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>autocapitalize</td>
-   <td>43</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>autocomplete</td>
-   <td>17.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>5</td>
-   <td>9.6</td>
-   <td>5.2</td>
-  </tr>
-  <tr>
-   <td>autofocus</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>9.6</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>capture</td>
-   <td>Chrome for Android (0.16)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>checked</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>disabled</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}<sup>[25]</sup></td>
-   <td>6</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>form</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>formaction</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>5.2</td>
-  </tr>
-  <tr>
-   <td>formenctype</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>formmethod</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>5.2</td>
-  </tr>
-  <tr>
-   <td>formnovalidate</td>
-   <td>5.0<sup>[12]</sup></td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>formtarget</td>
-   <td>9.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>5.2</td>
-  </tr>
-  <tr>
-   <td>height</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>1.0</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>incremental</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>inputmode</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>list</td>
-   <td>20.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>9.6</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>max</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>maxlength</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>min</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>minlength</td>
-   <td>40.0</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>multiple</td>
-   <td>1.0<sup>[13]</sup></td>
-   <td>{{CompatGeckoDesktop("1.9.2")}}<sup>[14]</sup><br>
-    {{CompatVersionUnknown}}<sup>[15]</sup></td>
-   <td>10</td>
-   <td>1.0<br>
-    10.62<sup>[14]</sup><br>
-    11.01<sup>[15]</sup></td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>name</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>pattern</td>
-   <td>5.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>9.6</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>placeholder</td>
-   <td>10.0</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>11.00</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>readonly</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>6<sup>[16] </sup></td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>required</td>
-   <td>5.0<br>
-    10<sup>[17]</sup></td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>9.6</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>size</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>spellcheck</td>
-   <td>10.0</td>
-   <td>{{CompatGeckoDesktop("1.9.2")}}</td>
-   <td>10</td>
-   <td>11.0</td>
-   <td>4.0</td>
-  </tr>
-  <tr>
-   <td>src</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>2</td>
-   <td>1.0</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>step</td>
-   <td>6.0</td>
-   <td>{{CompatGeckoDesktop("16.0")}}</td>
-   <td>10</td>
-   <td>10.62</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>tabindex</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>6<sup>[18]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>webkitdirectory</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("49.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>width</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>1.0</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=button</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[27]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=checkbox</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=color</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("27.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=date</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>5.0<sup>[23]</sup></td>
-  </tr>
-  <tr>
-   <td>type=datetime</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
-  </tr>
-  <tr>
-   <td>type=datetime-local</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
-  </tr>
-  <tr>
-   <td>type=email</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>3.1<sup>[19]</sup></td>
-  </tr>
-  <tr>
-   <td>type=file</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}<sup>[27]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[21]</sup></td>
-  </tr>
-  <tr>
-   <td>type=hidden</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=image</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=month</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
-  </tr>
-  <tr>
-   <td>type=number</td>
-   <td>2.3</td>
-   <td>{{CompatGeckoMobile("29.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>4.0<sup>[19]</sup></td>
-  </tr>
-  <tr>
-   <td>type=password</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[22]</sup></td>
-  </tr>
-  <tr>
-   <td>type=radio</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=range</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>type=reset</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=search</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>4.0<sup>[22]</sup></td>
-  </tr>
-  <tr>
-   <td>type=submit</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[27]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>type=tel</td>
-   <td>2.3</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>3.1<sup>[22]</sup></td>
-  </tr>
-  <tr>
-   <td>type=text</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[27]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}<sup>[22]</sup></td>
-  </tr>
-  <tr>
-   <td>type=time</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}<sup>[23]</sup></td>
-  </tr>
-  <tr>
-   <td>type=url</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>3.1<sup>[19]</sup></td>
-  </tr>
-  <tr>
-   <td>type=week</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>10.62</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>accept=[MIME type]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>accept=audio/*</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>accept=image/*</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}<sup>[26]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>accept=video/*</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>accept=[. + ext]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("37.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>accesskey</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>autocomplete</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>autofocus</td>
-   <td>3.2</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>capture</td>
-   <td>3.0</td>
-   <td>{{CompatGeckoMobile("10.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>6.0</td>
-  </tr>
-  <tr>
-   <td>checked</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>disabled</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>form</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>formaction</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>formenctype</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>formmethod</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>formnovalidate</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>formtarget</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>5.0</td>
-  </tr>
-  <tr>
-   <td>height</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>list</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>max</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("16.0")}}<sup>[20]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>maxlength</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>min</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("16.0")}}<sup>[20]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>minlength</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>27.0</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>multiple</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>name</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>1.0</td>
-  </tr>
-  <tr>
-   <td>pattern</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>placeholder</td>
-   <td>2.3</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>11.10</td>
-   <td>4</td>
-  </tr>
-  <tr>
-   <td>readonly</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>required</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>size</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>spellcheck</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>11.0</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>src</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>step</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("16.0")}}<sup>[20]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>10.62</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>tabindex</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>webkitdirectory</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("49.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>width</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("16.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Fue implementado en la versión 2 o inferior.</p>
-
-<p>[2] Implementado para valor <code>indeterminate</code>.</p>
-
-<p>[3] Esta característica todavía no está implementada. Véase {{bug("888320")}}.</p>
-
-<p>[4] Es reconocido, pero no tiene UI.</p>
-
-<p>[5] Gecko 2.0 {{geckoRelease("2.0")}} solo envía las coordenadas X e Y cuando se presiona, sin enviar nombre/valor del elemento.</p>
-
-<p>[6] Esta característica todavía no está implementada. Véase {{bug("888320")}}.</p>
-
-<p>[7] Regionalización en Chrome 11.</p>
-
-<p>[8] Opera 11.01 añadió soporte para un valor predeterminado.</p>
-
-<p>[9] Filtros para estas extensiones de archivo de audio: .aac, .aif, .flac, .iff, .m4a, .m4b, .mid, .midi, .mp3, .mpa, .mpc, .oga, .ogg, .ra, .ram, .snd, .wav, .wma.</p>
-
-<p>[10] Filtros para estas extensiones de archivo de video: .avi, .divx, .flv, .m4v, .mkv, .mov, .mp4, .mpeg, .mpg, .ogm, .ogv, .ogx, .rm, .rmvb, .smil, .webm, .wmv, .xvid</p>
-
-<p>[11] Filtros para estas extensiones de archivo de imagen: .jpe, .jpg, .jpeg, .gif, .png, .bmp, .ico, .svg, .svgz, .tif, .tiff, .ai, .drw, .pct, .psp, .xcf, .psd, .raw</p>
-
-<p>[12] En 6.0 solo funciona con el tipo de documento HTML5, el soporte para validación en 7.0 fue deshabilitado, y rehabilitado en 10.0.</p>
-
-<p>[13] Soportado para <code>type="file"</code> y <code>type="email"</code> desde la versión 5.0.</p>
-
-<p>[14] Soportado para <code>type="file"</code>.</p>
-
-<p>[15] Supported for <code>type="email"</code>.</p>
-
-<p>[16] No está presente para <code>type="checkbox"</code> y <code>type="radio"</code>.</p>
-
-<p>[17] Soportado para el elemento {{HTMLElement("select")}}.</p>
-
-<p>[18] Elementos con <code>tabindex</code> &gt; <code>0</code> no son navegables.</p>
-
-<p>[19] Sin validación, pero provee un teclado específico. Safari Mobile para iOS aplica un estilo predeterminado de <code>{{cssxref("opacity")}}: 0.4</code> para deshabilitar los elementos <code>&lt;input&gt;</code> textuales. Los demás navegadores mayores no comparten este estilo particular actualmente.</p>
-
-<p>[20] La interfaz podría permanecer sin implementarse.</p>
-
-<p>[21] <a href="http://blog.uploadcare.com/post/97884147203/you-cannot-upload-files-to-a-server-using-mobile-safari">La carga de archivos no funcionaba</a> en Mobile Safari para iOS 8.0 y 8.0.1. Este bug fue corregido en iOs 8.0.2.</p>
-
-<p>[22] Safari Mobile para iOS aplicaba un estilo predeterminado de <code>{{cssxref("opacity")}}: 0.4</code> para deshabilitar los elementos <code>&lt;input&gt;</code> textuales. Los demás navegadores mayores no comparten este estilo particular actualmente.</p>
-
-<p>[23] En Safari Mobile para iOS, la configuración <code>{{cssxref("display")}}: block</code> en un <code>&lt;input&gt;</code> con <code>type="date"</code>, <code>type="time"</code>, <code>type="datetime"</code>, <code>type="datetime-local"</code>, o <code>type="month"</code> causa que el texto dentro del <code>&lt;input&gt;</code> se desalinee verticalmente. Véase {{webkitbug("139848")}}.</p>
-
-<p>[24] Desde Chrome 39, un <code>&lt;input&gt;</code> con <code>type="date"</code> estilizado con <code>{{cssxref("display")}}: table-cell; {{cssxref("width")}}: 100%;</code> tendrá un valor para {{cssxref("min-width")}} impuesto por Chrome, y no puede reducirse a un valor inferior a esa anchura mínima. Véase <a href="https://code.google.com/p/chromium/issues/detail?id=346051">Chromium bug #346051</a>.</p>
-
-<p>[25] De forma predeterminada, Firefox, a diferencia de otros navegadores, <a href="http://stackoverflow.com/q/5985839/432681">persistirá el estado de deshabilitado dinámico y (si aplica), la selección de elementos dinámica</a> de un <code>&lt;input&gt;</code> a través de las cargas de páginas. Estableciedo el valor del atributo {{htmlattrxref("autocomplete","input")}} como <code>off</code> deshabilita esta característica. Esto funciona aun cuando el atributo {{htmlattrxref("autocomplete","input")}} no aplicaría normalmente al <code>&lt;input&gt;</code> debido a su atributo {{htmlattrxref("type","input")}}. Véase {{bug(654072)}}.</p>
-
-<p>[26] A partir de Gecko 9.0 {{geckoRelease("9.0")}}, Firefox para Android permite capturar imágenes usando la cámara para posteriormente cargarlas, sin necesidad de dejar el navegador. Los desarrolladores Web pueden implementar estar característica simplemente estableciendo el valor del atributo <code>accept</code> como <code>image/*</code> en el elemento <code>&lt;input&gt;</code> con <code>type="file"</code>.</p>
-
-<p>[27] Firefox para Android establece un gradiente predeterminado en {{cssxref("background-image")}} para todos los inputs con <code>type="file"</code>. Esto puede ser deshabilitado usando <code>background-image: none;</code>. También establece un valor para {{cssxref("border")}} en los mismos.</p>
-
-<p>[28] Previo a Firefox 51, <code>selectionStart</code> y <code>selectionEnd</code> devolvían <code>0</code> cuando no había selección. Ahora devuelven correctamente la separación del caracter siguiente a la posición actual del cursor, donde se insertará el siguiente caracter.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>Otros elementos relacionados con formularios: {{HTMLElement("form")}}, {{HTMLElement("button")}}, {{HTMLElement("datalist")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("select")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("option")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
- <li><a class="external" href="http://webdesignerwall.com/tutorials/cross-browser-html5-placeholder-text">Cross-browser HTML5 placeholder text</a></li>
-</ul>
diff --git a/files/es/web/html/elemento/input/number/index.html b/files/es/web/html/elemento/input/number/index.html
deleted file mode 100644
index 102e540f7e..0000000000
--- a/files/es/web/html/elemento/input/number/index.html
+++ /dev/null
@@ -1,450 +0,0 @@
----
-title: <input type="number">
-slug: Web/HTML/Elemento/input/number
-tags:
-  - Elemento
-  - Elemento de entrada
-  - Formulários HTML
-  - HTML
-  - Número
-  - Referencia
-  - Tipo de entrada
-  - formulários
-translation_of: Web/HTML/Element/input/number
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">Elementos {{HTMLElement("input")}} del tipo <strong><code>number</code></strong> son usados para permitir al usuario ingresar un número. Éstos incluyen validación incorporada para rechazar entradas no numéricas.</span> El navegador puede optar por proveer flechas de pasos para permitir al usuario incrementar y decrementar el valor usando su ratón o símplemente pulsando con la punta del dedo.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/input-number.html", "tabbed-shorter")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<p>En navegadores que no soportan entradas de tipo <code>number</code>, una entrada <code>number</code> recurre al tipo <code>text</code>.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td><strong>{{anch("Value")}}</strong></td>
-   <td>Un {{jsxref("Number")}} representando un número, o vacío.</td>
-  </tr>
-  <tr>
-   <td><strong>Eventos</strong></td>
-   <td>{{domxref("HTMLElement/change_event", "change")}} e {{domxref("HTMLElement/input_event", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos comunes que soporta</strong></td>
-   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("readonly", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos IDL</strong></td>
-   <td><code>list</code>, <code>value</code>, <code>valueAsNumber</code></td>
-  </tr>
-  <tr>
-   <td><strong>Métodos</strong></td>
-   <td>{{domxref("HTMLInputElement.select", "select()")}}, {{domxref("HTMLInputElement.stepUp", "stepUp()")}}, {{domxref("HTMLInputElement.stepDown", "stepDown()")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Valor">Valor</h2>
-
-<p>Un {{jsxref("Number")}} representando el valor del número ingresado en la entrada. Tú puedes colocar el valor por omisión para la entrada incluyendo un número dentro del atributo {{htmlattrxref("value", "input")}}, de esta manera:</p>
-
-<pre class="brush: html">&lt;input id="number" type="number" value="42"&gt;</pre>
-
-<p>{{EmbedLiveSample('Value', 600, 40)}}</p>
-
-<h2 id="Atributos_adicionales">Atributos adicionales</h2>
-
-<p>Además de los atributos comúnmente soportados por todos los tipos de {{HTMLElement("input")}}, las entradas de tipo <code>number</code> soportan estos atributos:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Atributo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>{{anch("list")}}</code></td>
-   <td>El <code>id</code> del elemento {{HTMLElement("datalist")}} que contiene las opciones predefinidas de autocompletado.</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("max")}}</code></td>
-   <td>El valor máximo a aceptar para esta entrada</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("min")}}</code></td>
-   <td>El valor mínimo a aceptar para esta entrada</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("placeholder")}}</code></td>
-   <td>Un valor de ejemplo para mostrar dentro del campo cuando esté vacío</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("readonly")}}</code></td>
-   <td>Un atributo Booleano indicando si el valor es de solo lectura</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("step")}}</code></td>
-   <td>El intervalo de paso a usar cuando se usen las flechas arriba y abajo para ajustar el valor, así como para su validación</td>
-  </tr>
- </tbody>
-</table>
-
-<p id="htmlattrdeflist">{{page("/en-US/docs/Web/HTML/Element/input/text", "list", 0, 1, 2)}}</p>
-
-<h3 id="htmlattrdefmax">{{htmlattrdef("max")}}</h3>
-
-<p>El valor máximo a aceptar para esta entrada. Si el {{htmlattrxref("value", "input")}} ingresado en el elemento excede éste, el elemento falla la <a href="https://developer.mozilla.org/es/docs/HTML/HTML5/Validacion_de_restricciones">validación de restricciones</a>. Si el valor del atributo <code>max</code> no es un número, entonces el elemento no tiene un valor máximo.</p>
-
-<p>Este valor debe ser mayor que o igual al valor del atributo <code>min</code>.</p>
-
-<h3 id="htmlattrdefmin">{{htmlattrdef("min")}}</h3>
-
-<p>El valor mínimo a aceptap para esta entrada. Si el {{htmlattrxref("value", "input")}} del elemento es menor que éste, el elemento falla la <a href="https://developer.mozilla.org/es/docs/HTML/HTML5/Validacion_de_restricciones">validación de restricciones</a>. Si un valor es especificado para <code>min</code> que no sea un número valido, la entrada no tiene un valor mínimo.</p>
-
-<p>Este valor debe ser menor que o igual al valor del atributo <code>max</code>.</p>
-
-<p>{{page("/en-US/docs/Web/HTML/Element/input/text", "placeholder", 0, 1, 2)}}</p>
-
-<p>{{page("/en-US/docs/Web/HTML/Element/input/text", "readonly", 0, 1, 2)}}</p>
-
-<h3 id="htmlattrdefstep">{{htmlattrdef("step")}}</h3>
-
-<div id="step-include">
-<p>El atributo <code>step</code> es un número que especifica la granularidad a la que debe adherirse el valor, o el valor especial <code>any</code>, el cual es descrito abajo. Solo valores que sean iguales a la base del escalonado (<code>{{anch("min")}}</code> si es especificado, si no {{htmlattrxref("value", "input")}}, y un valor por omisión apropiado si ninguno de esos es provisto) son válidos.</p>
-
-<p>Una valor de cadena <code>any</code> significa que ningún escalonado es implicado, y cualquier valor es permitido (salvo otras restricciones, tales como <code>{{anch("min")}}</code> y <code>{{anch("max")}}</code>).</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Cuando los datos ingresados por el usuario no se adhieran a la configuración de escalonado, el {{Glossary("user agent")}} puede redondear al valor válido más cercano, prefiriendo numeros en la dirección positiva cuando hayan dos opciones igualmente cercanas.</p>
-</div>
-</div>
-
-<p>El valor por omisión de paso para entradas <code>number</code> es <code>1</code>, permitiendo solo enteros ser ingresados—<em>a menos que</em> la base del escalonado no sea un entero.</p>
-
-<h2 id="Usar_entradas_numéricas">Usar entradas numéricas</h2>
-
-<p>Elementos <code>&lt;input type="number"&gt;</code> pueden ayudar a simplificar tu trabajo al construir la interfaz de usuario y la lógica para ingresar números en un formulario. Cuando creas una entrada numérica con el valor apropiado para <code>type</code>, <code>number</code>, obtienes validación automática para que el texto sea un número, y usualmente un juego de botones arriba y abajo para subir y bajar el valor.</p>
-
-<div class="warning">
-<p><strong>Importante</strong>: Ten en mente que, lógicamente, no deberías poder ingresar otros caracteres que no sean números dentro de una entrada numérica. Parece haber algo de desacuerdo acerca de esto entre navegadores; ver {{bug(1398528)}}.</p>
-</div>
-
-<div class="note">
-<p><strong>Nota</strong>: Es crucial recordar que un usuario puede jugar con tu HTML tras bambalinas, así que tu sitio<em> no debe</em> usar validación simple del lado del cliente para ningún fin de seguridad. Tú <em>debes</em> verificar en el lado del servidor cualquier transacción en la cual el valor provisto pueda tener alguna implicación de seguridad de cualquier tipo.</p>
-</div>
-
-<p>Los navegadores de móviles ayudan más con la experiencia de usuario mostrando un teclado especial mejor adaptado para ingresar números cuando el usuario intente ingresar un valor. La siguiente captura de pantalla es tomada de Firefox para Android:</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14963/number-keyboard-fxa.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
-
-<h3 id="Una_entrada_numérica_simple">Una entrada numérica simple</h3>
-
-<p>En su forma más básica, una entrada numérica puede ser implementada así:</p>
-
-<pre class="brush: html">&lt;label for="ticketNum"&gt;Number of tickets you would like to buy:&lt;/label&gt;
-&lt;input id="ticketNum" type="number" name="ticketNum" value="0"&gt;</pre>
-
-<p>{{EmbedLiveSample('A_simple_number_input', 600, 40)}}</p>
-
-<p>Una entrada numérica es considerada válida cuando está vacía y cuando un único número es ingresado, pero por lo demás es inválida. Si el atributo xxxx es usado, la entrada ya no es considerada válida cuando esté vacía.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Cualquier número es un valor aceptable, mientras que sea un <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#valid-floating-point-number">número de punto flotante válido</a> (eso es, no <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a> o <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Infinity">Infinity</a>).</p>
-</div>
-
-<h3 id="Marcas_de_lugar_Placeholders">Marcas de lugar (Placeholders)</h3>
-
-<p>Algunas veces es de ayuda ofrecer una indicación en contexto en cuanto a qué forma deben tomar los datos de entrada. Esto puede ser especialmente importante si el diseño de la página no ofrece etiquetas descriptivas para cada {{HTMLElement("input")}}. Es aquí donde entran las <strong>marcas de lugar</strong>. Una marca de lugar es un valor comúnmente usado para proveer un indicio en cuanto al formato que la entrada debe tomar por <code>value</code>. Este es mostrado dentro de la caja de edición cuando el <code>value</code> del elemento es <code>""</code>. Una vez que los datos son ingresados dentro de la caja, la marca de lugar desaparece; si la caja es vaciada, la marca de lugar reaparece.</p>
-
-<p>Aquí, tenemos una entrada <code>number</code> con la marca de lugar "<code>Multiple of 10</code>". Nota cómo la marca de lugar desaparece y reaparece conforme manipulas el contenido del campo de edición.</p>
-
-<pre class="brush: html">&lt;input type="number" placeholder="Multiple of 10"&gt;</pre>
-
-<p>{{EmbedLiveSample('Placeholders', 600, 40)}}</p>
-
-<h3 id="Controlar_el_tamaño_del_escalón">Controlar el tamaño del escalón</h3>
-
-<p>Por omisión, los botones arriba y abajo provistos para que pases el número de arriba a abajo pasarán por 1 el valor arriba y abajo. Puedes cambiar esto proveyendo un atributo {{htmlattrxref("step", "input")}}, el cual toma como valor un número que especifica la cantidad de escalones. Nuestro ejemplo arriba contiene una marca de lugar diciendo que el valor debe ser un múltiplo de 10, por lo tanto tiene sentido agregar un valor a <code>step</code> de <code>10</code>:</p>
-
-<pre class="brush: html">&lt;input type="number" placeholder="multiple of 10" step="10"&gt;</pre>
-
-<p>{{EmbedLiveSample('Controlling_step_size', 600, 40)}}</p>
-
-<p>En este ejemplo, debes hallar que las flechas de subir y bajar escalón incrementan y decrementan el valor por 10 cada vez, y no por 1. Aún puedes ingresar manualmente un número que no sea múltiplo de 10, pero este será considerado inválido.</p>
-
-<h3 id="Especificar_valores_máximo_y_mínimo">Especificar valores máximo y mínimo</h3>
-
-<p>Puedes usar los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para especificar un valor mínimo y máximo que pueda tener el campo. Por ejemplo, demos a nuestro ejemplo un mínimo de <code>0</code>, y un máximo de <code>100</code>:</p>
-
-<pre class="brush: html">&lt;input type="number" placeholder="multiple of 10" step="10" min="0" max="100"&gt;</pre>
-
-<p>{{EmbedLiveSample('Specifying_minimum_and_maximum_values', 600, 40)}}</p>
-
-<p>En esta versión actualizada, debes hallar que los botones para subir y bajar escalón no te permitirán ir bajo 0 o sobre 100. Tú aún puedes ingresar manualmente un número fuera de estos límites, pero este será considerado inválido.</p>
-
-<h3 id="Permitir_valores_decimales">Permitir valores decimales</h3>
-
-<p>Un problema con las entradas numéricas es que su tamaño de escalón por omisión es 1. Si tratas de ingresar un número con un decimal (tal como "1.0"), este será considerado como inválido. Si quieres ingresar un valor que requiere decimales, necesitarás reflejar esto en el valor <code>step</code> (p.ej. <code>step="0.01"</code> para permitir hasta dos dígitos en la parte decimal). Aquí hay un ejemplo simple:</p>
-
-<pre class="brush: html">&lt;input type="number" placeholder="1.0" step="0.01" min="0" max="10"&gt;</pre>
-
-<p>{{EmbedLiveSample("Allowing_decimal_values", 600, 40)}}</p>
-
-<p>Note que este ejemplo permite cualquier valor entre <code>0.0</code> y <code>10.0</code>, con decimales a dos cifras. Por ejemplo, "9.52" es válido, pero "9.521" no lo es.</p>
-
-<h3 id="Controlar_el_tamaño_de_la_entrada">Controlar el tamaño de la entrada</h3>
-
-<p>Los elementos {{HTMLElement("input")}} de tipo <code>number</code> no soportan atributos de dimensión tales como {{htmlattrxref("size", "input")}}. Necesitarás recurrir a <a href="/en-US/docs/Web/CSS">CSS</a> para cambiar el tamaño de estos controles.</p>
-
-<p>Por ejemplo, para ajustar el ancho de la entrada para que sea tan ancho como se necesita para ingresar un número de tres dígitos, podemos cambiar nuestro HTML para incluir un xxxx y acortar nuestra marca de lugar (placeholder) ya que el campo estará demasiado angosto para el texto que hemos estado usando hasta ahora:</p>
-
-<pre class="brush: html">&lt;input type="number" placeholder="x10" step="10" min="0" max="100" id="number"&gt;</pre>
-
-<p>Entonces agregamos algo de CSS para reducir el ancho del elemento con el selector de <code>id</code>, <code>#number</code>:</p>
-
-<pre class="brush: css">#number {
-  width: 3em;
-}</pre>
-
-<p>El resultado se ve así:</p>
-
-<p>{{EmbedLiveSample('Controlling_input_size', 600, 40)}}</p>
-
-<h3 id="Ofrecer_valores_sugeridos">Ofrecer valores sugeridos</h3>
-
-<p>Tú puedes proveer una lista de las opciones por defecto de las cuales el usuario puede seleccionar especificando el atributo {{htmlattrxref("list", "input")}}, el cual contiene como su valor el {{htmlattrxref("id")}} de un {{HTMLElement("datalist")}}, el cual a su vez contiene un elemento {{HTMLElement("option")}} por valor sugerido. El <code>value</code> de cada <code>option</code> es el valor sugerido correspondiente para la caja de entrada numérica.</p>
-
-<pre class="brush: html">&lt;input id="ticketNum" type="number" name="ticketNum" list="defaultNumbers"&gt;
-&lt;span class="validity"&gt;&lt;/span&gt;
-
-&lt;datalist id="defaultNumbers"&gt;
-  &lt;option value="10045678"&gt;
-  &lt;option value="103421"&gt;
-  &lt;option value="11111111"&gt;
-  &lt;option value="12345678"&gt;
-  &lt;option value="12999922"&gt;
-&lt;/datalist&gt;</pre>
-
-<p>{{EmbedLiveSample("Offering_suggested_values", 600, 40)}}</p>
-
-<div class="note">
-<p>El uso del atributo {{htmlattrxref("list", "input")}} con entradas <code>number</code> no está soportado en todos los navegadores. Funciona en Chrome y Opera, por ejemplo, pero no en Firefox.</p>
-</div>
-
-<h2 id="Validación">Validación</h2>
-
-<p>Ya hemos mencionado una serie de características de validación para entradas <code>number</code>, pero revisémoslas ahora:</p>
-
-<ul>
- <li>Elementos <code>&lt;input type="number"&gt;</code> automáticamente invalidan cualquier entrada que no sea un número (o vacío, a menos que se especifique <code>required</code> ).</li>
- <li>Puedes usar el atributo {{htmlattrxref("required", "input")}} para invalidar una entrada vacía. (En otras palabras, la entrada <em>debe</em> ser llenada).</li>
- <li>Puedes usar el atributo {{htmlattrxref("step", "input")}} para restringir valores válidos a cierto conjunto de escalones (p.ej. múltiplos de 10).</li>
- <li>Puedes usar los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} para restringir los límites inferior y superior de los valores válidos.</li>
-</ul>
-
-<p>El siguiente ejemplo presenta todas las características anteriores, así como el uso de CSS para mostrar íconos de validez o invalidez, dependiendo del valor del <code>input</code>:</p>
-
-<pre class="brush: html">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="balloons"&gt;Number of balloons to order (multiples of 10):&lt;/label&gt;
-    &lt;input id="balloons" type="number" name="balloons" step="10" min="0" max="100" required&gt;
-    &lt;span class="validity"&gt;&lt;/span&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;input type="submit"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>{{EmbedLiveSample("Validation", 600, 80)}}</p>
-
-<p>Intenta enviar el formulario con diferentes valores inválidos ingresados — p.ej., siv valor; un valor abajo de 0 o arriba de 100; un valor que no sea múltiplo de 10; o un valor no numérico — y mira cómo los mensajes de error que te da el navegador difieren con estos.</p>
-
-<p>El CSS aplicado a este ejemplo es el siguiente:</p>
-
-<pre class="brush: css">div {
-  margin-bottom: 10px;
-}
-
-input:invalid+span:after {
-  content: '✖';
-  padding-left: 5px;
-}
-
-input:valid+span:after {
-  content: '✓';
-  padding-left: 5px;
-}</pre>
-
-<p>Aquí utilizamos las pseudo clases {{cssxref(":invalid")}} y {{cssxref(":valid")}} para mostrar un ícono apropiado de invalidez o validez como contenido generado en el elemento adyacente {{htmlelement("span")}}, como un indicador visual.</p>
-
-<p>Lo colocamos en un elemento separado <code>&lt;span&gt;</code> para mayor flexibilidad. Algunos navegadores no muestran contenido generado muy eficientemente en algunos tipos o entradas de formulario. (Lee, por ejemplo, la sección sobre <a href="/es/docs/Web/HTML/Element/input/date#Validation">validación de <code>&lt;input type="date"&gt;</code></a>).</p>
-
-<div class="warning">
-<p><strong>Importante</strong>: ¡La validación de formularios HTML <em>no</em> es un substituto de scripts del lado del servidor que asegure que los datos estén en el formato apropiado!</p>
-
-<p>Es demasiado fácil para alguien hacer ajustes al HTML que le prmita evitar la validación, o removerla completamente. También es posible para alguien evadir tu HTML y enviar los datos directamente a tu servidor.</p>
-
-<p>Si tu código del lado del servidor falla el validar los datos que recibe, el desastre podría azotar cuando datos que no están formateados apropiadamente sean enviados (o cuando los datos son demasiado grandes, o son del tipo incorrecto, y así sucesivamente).</p>
-</div>
-
-<h3 id="Validación_de_patron">Validación de patron</h3>
-
-<p>Elementos <code>&lt;input type="number"&gt;</code> no soportan el uso del atributo {{htmlattrxref("pattern", "input")}} para hacer que los valores ingresados se ajusten a un patrón de expresión regular específico.</p>
-
-<p>La fundamentación para esto es que las entradas numéricas no serán válidas si contienen cualquier cosa excepto números, y tú puedes restringir el número mínimo y máximo de dígitos válidos usando los atributos {{htmlattrxref("min", "input")}} y {{htmlattrxref("max", "input")}} (a como se explica arriba).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Ya hemos cubierto el hecho de que por defecto, el incremento es <code>1</code>, y tú puedes usar el atributo {{htmlattrxref("step", "input")}} para permitir entradas decimales. Echemos un vistazo más de cerca.</p>
-
-<p>En el siguiente ejemplo hay un formulario para ingresar la estatura del usuario. Por defecto acepta la estatura en metros, pero puedes hacer click en el botón apropiado para cambiar el formulario a que acepte pies y pulgadas. La entrada para la estatura en metros acepta decimales a dos posiciones.</p>
-
-<p>{{EmbedLiveSample("Examples", 600, 100)}}</p>
-
-<p>El HTML se ve así:</p>
-
-<pre class="brush: html">&lt;form&gt;
-    &lt;div class="metersInputGroup"&gt;
-        &lt;label for="meters"&gt;Enter your height — meters:&lt;/label&gt;
-        &lt;input id="meters" type="number" name="meters" step="0.01" min="0" placeholder="e.g. 1.78" required&gt;
-        &lt;span class="validity"&gt;&lt;/span&gt;
-    &lt;/div&gt;
-    &lt;div class="feetInputGroup" style="display: none;"&gt;
-        &lt;span&gt;Enter your height — &lt;/span&gt;
-        &lt;label for="feet"&gt;feet:&lt;/label&gt;
-        &lt;input id="feet" type="number" name="feet" min="0" step="1"&gt;
-        &lt;span class="validity"&gt;&lt;/span&gt;
-        &lt;label for="inches"&gt;inches:&lt;/label&gt;
-        &lt;input id="inches" type="number" name="inches" min="0" max="11" step="1"&gt;
-        &lt;span class="validity"&gt;&lt;/span&gt;
-    &lt;/div&gt;
-    &lt;div&gt;
-      &lt;input type="button" class="meters" value="Enter height in feet and inches"&gt;
-    &lt;/div&gt;
-    &lt;div&gt;
-        &lt;input type="submit" value="Submit form"&gt;
-    &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Verás que estamos usando muchos de los atributos que ya hemos visto antes en el artículo. Como queremos que acepte un valor de medida en centímetros, hemos colocado el valor de <code>step</code> a <code>0.01</code>, de manera que valores como <em>1.78</em> no sean vistos como inválidos. También hemos provisto una marca de lugar (placeholder) para esa entrada.</p>
-
-<p>Hemos escondido las entradas de pies y pulgadas inicialmente usando <code>style="display: none;"</code>, de manera que metros sea el tipo de entrada preseleccionado.</p>
-
-<p>Ahora, al CSS. Este se ve muy similar al estilo de validación que vimos antes; nada extraordinario aquí.</p>
-
-<pre class="brush: css">div {
-  margin-bottom: 10px;
-  position: relative;
-}
-
-input[type="number"] {
-  width: 100px;
-}
-
-input + span {
-  padding-right: 30px;
-}
-
-input:invalid+span:after {
-  position: absolute;
-  content: '✖';
-  padding-left: 5px;
-}
-
-input:valid+span:after {
-  position: absolute;
-  content: '✓';
-  padding-left: 5px;
-}</pre>
-
-<p>Y finalmente, el JavaScript:</p>
-
-<pre class="brush: js">let metersInputGroup = document.querySelector('.metersInputGroup')
-let feetInputGroup = document.querySelector('.feetInputGroup')
-let metersInput = document.querySelector('#meters')
-let feetInput = document.querySelector('#feet')
-let inchesInput = document.querySelector('#inches')
-let switchBtn = document.querySelector('input[type="button"]')
-
-switchBtn.addEventListener('click', function() {
-  if(switchBtn.getAttribute('class') === 'meters') {
-    switchBtn.setAttribute('class', 'feet')
-    switchBtn.value = 'Enter height in meters'
-
-    metersInputGroup.style.display = 'none'
-    feetInputGroup.style.display = 'block'
-
-    feetInput.setAttribute('required', '')
-    inchesInput.setAttribute('required', '')
-    metersInput.removeAttribute('required')
-
-    metersInput.value = ''
-  } else {
-    switchBtn.setAttribute('class', 'meters')
-    switchBtn.value = 'Enter height in feet and inches'
-
-    metersInputGroup.style.display = 'block'
-    feetInputGroup.style.display = 'none'
-
-    feetInput.removeAttribute('required')
-    inchesInput.removeAttribute('required')
-    metersInput.setAttribute('required', '')
-
-    feetInput.value = ''
-    inchesInput.value = ''
-  }
-});</pre>
-
-<p>Después de declarar unas pocas variables, un manejador de eventos s agredgado al <code>button</code> para controlar el mecanismo interruptor. Esto es bastante simple, principalmente involucra cambiar las {{HTMLElement("label")}} y <code>class</code> del botón, y actualizar los valores de muestra de los dos conjuntos de entradas cuando el botón sea presionado.</p>
-
-<p>(Nota que aquí no estamos convirtiendo de aquí para allá entre metros y pies/pulgadas, lo que probablemente haría una aplicación web en la vida real.)</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Cuando el usuario haga click en el botón, el(los) atributo(s) <code>required</code> de la(s) entradas que estemos ocultando son removidos, y vaciará el <code>value</code> del(los) atributo(s). Esto es de manera que el formulario pueda ser enviado si ambos conjuntos de entradas no están llenas. También asegura que el formulario no enviará datos que el usuario no quiera.</p>
-
-<p>¡Si no hicieras eso, tendrías que llenar ambos pies/pulgadas <strong>y</strong> metros para enviar el formulario!</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#number-state-(type=number)', '&lt;input type="number"&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'sec-forms.html#number-state-typenumber', '&lt;input type="number"&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.input.input-number")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Learn/HTML/Forms">Guía de formularios HTML</a></li>
- <li>{{HTMLElement("input")}}</li>
- <li><code><a href="/es/docs/Web/HTML/Element/input/tel">&lt;input type="tel"&gt;</a></code></li>
- <li><a href="/es/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets">Compatibilidad de propiedades CSS</a></li>
-</ul>
diff --git a/files/es/web/html/elemento/input/password/index.html b/files/es/web/html/elemento/input/password/index.html
deleted file mode 100644
index 2fd6cd5cb2..0000000000
--- a/files/es/web/html/elemento/input/password/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: <input type="password">
-slug: Web/HTML/Elemento/input/password
-tags:
-  - Element
-  - HTML
-  - Reference
-translation_of: Web/HTML/Element/input/password
----
-<p> </p>
-
-<p>{{HTMLRef}}</p>
-
-<p>Los elementos <code>&lt;input&gt;</code> de tipo <strong><code>"password"</code></strong> proporcionan una forma para que el usuario ingrese una contraseña de forma segura. El elemento se presenta como un control de editor de texto, sin formato, de una línea, en el que el texto está oculto para que no pueda leerse, generalmente reemplazando cada carácter con un símbolo como el asterisco ("*") o un punto ("•"). Este carácter variará dependiendo del {{Glossary("user agent")}} y del {{Glossary("OS")}}.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Flow content</a>, listado, tabla enviable, reseteable, elementos de forma asociada, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">phrasing content</a>, elementos etiquetables, contenido palpable.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno, es un {{Glossary("empty element")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>Tiene que tener una etiqueta al inicio y no tener una etiqueta final.</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos de parentescos</th>
-   <td>Cualquier elemento que accepta <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLInputElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Además de los atributos listados abajo, este elemento puede tener cualquier <a href="/en-US/docs/HTML/Global_attributes">global attributes</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("autocomplete")}}{{HTMLVersionInline("5")}}</dt>
- <dd>Establece el valor del atributo de autocompletado en el campo de una contraseña. En caso de ser cierto, automaticamente se rellena con el valor previamente almacenado.</dd>
- <dt>{{htmlattrdef("autofocus")}}{{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo Booleano te permite especificar que la página ponga el foco en un campo a menos que el usuario lo revoque, por ejemplo, escribir en un campo diferente. Solo un elemento en el documento puede tener el atributo Booleano <strong>autofocus</strong>.</dd>
- <dt>{{htmlattrdef("disabled")}}</dt>
- <dd>
- <p>Este atributo Booleano indica que el campo de la contraseña no está disponible. Además, deshabilita los valores que no son enviados por el campo.</p>
- </dd>
- <dt>{{htmlattrdef("defaultvalue")}}</dt>
- <dd>Define un valor predeterminado en el campo de la contraseña.</dd>
- <dt>{{htmlattrdef("inputmode")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Le da proporciona información al buscador sobre que teclado mostrar. Los valores posibles son:
- <ul>
-  <li><code>verbatim</code>: Alfanumérico, contenido no verbla tales como usuarios y contraseñas.</li>
-  <li><code>latin</code>: Introducción de texto en el lenguaje preferido del usuario con ayudas de escritura, como predicción de texto. Se usa para comunicación de usuario a ordenador en, por ejemplo, campos de búsqueda.</li>
-  <li><code>latin-name</code>: Como <em>latin</em>, pero para nombres de personas.</li>
-  <li><code>latin-prose</code>: Como <em>latin</em>, pero con unas ayudas de escritura más activas. Para comunicación de usuario a usuario como por ejemplo, mensajería instantanea o emails.</li>
-  <li><code>full-width-latin</code>: Como <em>latin-prose</em>, pero para lenguajes secundarios del usuario.</li>
-  <li><code>kana</code>: Entrada de texto Kana o romaji, normalmente entrada hiragana, usa carácteres con ancho completo, con soporte para converstirse a kanji. Establecido para la entrada de texto Japonés.</li>
-  <li><code>katakana</code>: Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("maxlength")}}</dt>
- <dd>Establece el valor del atributo maxlength en el campo de una contraseña.</dd>
- <dt>{{htmlattrdef("minlength")}}</dt>
- <dd>Establece el valor del atributo minlength en el campo de una contraseña.</dd>
- <dt>{{htmlattrdef("name")}}</dt>
- <dd>Nombre del campo, usado para datos enviados desde formulario.</dd>
- <dt>{{htmlattrdef("pattern")}}{{HTMLVersionInline("5")}}</dt>
- <dd> Establece el valor del atributo pattern del campo de una contraseña.</dd>
- <dt>{{htmlattrdef("placeholder")}}{{HTMLVersionInline("5")}}</dt>
- <dd>Establece el valor del atributo placeholder del campo de una contraseña.</dd>
- <dt>{{htmlattrdef("readonly")}}</dt>
- <dd>Este atributo Booleano indica que el usuario no puede modificar el valor del campo de una contraseña.</dd>
- <dt>{{htmlattrdef("required")}}{{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo Booleano especifica que el usuario debe rellenar con un valor antes de enviar un formulario.</dd>
- <dt>{{htmlattrdef("size")}}</dt>
- <dd>Establece el valor del atributo size del campo de una contraseña.</dd>
- <dt> </dt>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Para crear un widget que muestre una constraseña, use:</p>
-
-<pre class="brush: html">&lt;input type="password"&gt;</pre>
-
-<p>Para crear un widget que muestre una contraseña con un patrón o diseño, use:</p>
-
-<pre class="brush: html">&lt;input type="password" pattern=".{6,}"&gt;</pre>
-
-<p>El ejemplo de arriba creará un elemento password que deberá contener 6 o más carácteres.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'the-input-element.html#the-input-element', '&lt;input&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-input-element', '&lt;input&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.4', '&lt;form&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Fix me:</strong> Insert Browser Compatibility table here.</p>
-</div>
-
-<h2 id="sect1"> </h2>
diff --git a/files/es/web/html/elemento/input/range/index.html b/files/es/web/html/elemento/input/range/index.html
deleted file mode 100644
index e0cf92d55a..0000000000
--- a/files/es/web/html/elemento/input/range/index.html
+++ /dev/null
@@ -1,416 +0,0 @@
----
-title: <input type="range">
-slug: Web/HTML/Elemento/input/range
-tags:
-  - Elementos
-  - Formulários HTML
-  - HTML etiqueta input
-  - Input
-  - Range
-  - Rango
-  - Referencia
-  - Web
-  - deslizador
-  - formulários
-  - slider
-translation_of: Web/HTML/Element/input/range
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">El elemento {{HTMLElement("input")}} del tipo <code><strong>"range"</strong></code> permite que el usuario especifique un valor numérico comprendido entre un valor mínimo y máximo. El valor exacto, sin embargo, no se considera importante. Se repesenta típicamente como un "tirador" o un control deslizante en lugar de un campo de texto como otros tipos de {{HTMLElement("input")}}.</span> Como este tipo de widget es bastante inmpreciso, no debe utilizarse normalmente a menos que el valor exacto del control no sea importante.</p>
-
-<div id="summary_sample1">
-<pre class="brush: html">&lt;input type="range"&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample("summary_sample1", 600, 40)}}</p>
-
-<p>Si el navegador del usuario no soporta el tipo <code>"range"</code>, será tratado como un input de tipo <code><a href="/en-US/docs/Web/HTML/Element/input/text">"text"</a></code>.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td><strong>{{anch("Value")}}</strong></td>
-   <td>Un {{domxref("DOMString")}} que contiene la cadena que representa el valor numérico seleccionado; use {{domxref("HTMLInputElement.valueAsNumber", "valueAsNumber")}} to get the value as a {{jsxref("Number")}}.</td>
-  </tr>
-  <tr>
-   <td><strong>Eventos</strong></td>
-   <td>{{event("change")}} e {{event("input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos comunes soportados</strong></td>
-   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("max", "input")}}, {{htmlattrxref("min", "input")}} y {{htmlattrxref("step", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos IDL </strong></td>
-   <td><code>list</code>, <code>value</code> y <code>valueAsNumber</code></td>
-  </tr>
-  <tr>
-   <td><strong>Metodos</strong></td>
-   <td>{{domxref("HTMLInputElement.stepDown", "stepDown()")}} y {{domxref("HTMLInputElement.stepUp", "stepUp()")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Value">Value</h2>
-
-<p>El atributo {{htmlattrxref("value", "input")}} contiene un {{domxref("DOMString")}} que es la representación de tipo cadena del número seleccionado. El valor nunca es una cadena vacía (<code>""</code>). El valor por defecto es el punto intermedio entre los valores mínimo y máximo especificados, a menos que el valor máximo sea menor que el valor mínimo, en cuyo caso el valor por defecto será el valor del atributo <code>min</code>. El algoritmo de determina el valor por defecto es:</p>
-
-<pre class="brush: js">defaultValue = (rangeElem.max &lt; rangeElem.min) ? rangeElem.min
-               : rangeElem.min + (rangeElem.max - rangeElem.min)/2;</pre>
-
-<p><span id="result_box" lang="es"><span>Si se intenta establecer un valor inferior al mínimo definido, el valor será igual al mínimo.</span> <span>De manera similar, un intento de establecer un valor superior al máximo da como resultado el valor máximo.</span></span></p>
-
-<h2 id="Usando_inputs_range">Usando inputs range</h2>
-
-<p>El input de tipo <code>"number"</code> permite al usuario introducir un número y, opcionalmente, forzarle a que dicho valor se encuentre entre un mínimo y un máximo, pero le obliga a introducir un valor específico. El input de tipo <code>"range"</code> pide al usuario que indique el valor en un rango numérico sin que tenga que preocuparse qué valor numérico específico está seleccionado.</p>
-
-<p>Los ejemplos títpicos de situaciones en las que se pueden usar inputs de tipo rango suelen ser:</p>
-
-<ul>
- <li>Controles de audio (volumen o balance) o controles de filtro.</li>
- <li>Configuración de color, como canales, transparencia, brillo, etc.</li>
- <li>Controles de configuración de juegos, como dificultad, distancia de visibilidad, tamaño del nunodGame configuration controls such as difficulty, visibility distance, world size, etc.</li>
- <li>Longitud de contraseñas para un gestor de contraseñas generadas.</li>
-</ul>
-
-<p>Como regla general, si el usuario está más interesado en la distancia entre un mínimo y un máximo más que en el propio valor en sí  mismo, el input de tipo rango es el candidato perfecto. Por ejemplo, en el caso del control del volumen de un equipo estéreo, el usuario normalmente piensa "pon el volumen a la midad" en lugar de "pon el volumen al 0,5".</p>
-
-<h3 id="Especificar_los_valores_mínimo_y_máximo">Especificar los valores mínimo y máximo</h3>
-
-<p>Por defecto, el valor mínimo es 0 y el máximo es 100. Si es necesario modificar dichos valores, podemos usar los atributos {{htmlattrxref("min", "input")}} y/o {{htmlattrxref("max", "input")}}. Podemos usar cualquier valor de coma flotante.</p>
-
-<p>Por ejemplo, para usar un rango entre -10 y 10, usaremos:</p>
-
-<pre class="brush: html">&lt;input type="range" min="-10" max="10"&gt;</pre>
-
-<p>{{EmbedLiveSample("Specifying_the_minimum_and_maximum", 600, 40)}}</p>
-
-<h3 id="Definir_el_tamaño_de_los_saltos">Definir el tamaño de los saltos</h3>
-
-<p>Por defecto, cada salto tiene valor 1, es decir el valor será siempre un número entero. Podemos cambiarlo mediante el atributo {{htmlattrxref("step")}}. Si necesitas, por ejemplo, un valor entre 5 y 10 con una precisión de dos decimales, debes indicar que el valor de <code>step</code> es 0.01:</p>
-
-<div id="Granularity_sample1">
-<pre class="brush: html">&lt;input type="range" min="5" max="10" step="0.01"&gt;</pre>
-
-<p>{{EmbedLiveSample("Granularity_sample1", 600, 40)}}</p>
-</div>
-
-<p><span id="result_box" lang="es"><span>Si quieres aceptar cualquier valor independientemente de la cantidad de decimales, puede especificar un valor de </span></span><code>"any"</code> al atrtibuto {{htmlattrxref("step", "input")}}:</p>
-
-<div id="Granularity_sample2">
-<pre class="brush: html">&lt;input type="range" min="0" max="3.14" step="any"&gt;</pre>
-
-<p>{{EmbedLiveSample("Granularity_sample2", 600, 40)}}</p>
-
-<p>En el ejemplo, permitimos al usuario seleccionar cualquier valor entre 0 y π sin restricciones en la parte decimal del número seleccionado.</p>
-</div>
-
-<h3 id="Añadir_marcas_y_etiquetas">Añadir marcas y etiquetas</h3>
-
-<p>La especificación HTML permite a los navegadores cierta flexibilidad sobre cómo presentar el control range. En ningún sitio es más notoria dicha flexibilidad como a la hora de representar las marcas y las etiquetas de un rango. La especificación describe cómo añadir puntos personalizados al control range usando el atributo {{htmlattrxref("list", "input")}} y el elemento {{HTMLElement("datalist")}}, pero no hay requisitos o recomendaciones de estandarizar las marcas a lo largo del control.</p>
-
-<h4 id="Mockups_del_control_range">Mockups del control range</h4>
-
-<p>Como los navegadores tienen esta flexibilidad, y hasta la fecha ninguno admite todas las funciones que HTML define para los controles range, a continuación mostramos algunas maquetas que permiten conocer lo que puede visualizarse en macOS en un navegador que las admita.</p>
-
-<h5 id="El_control_rango_sin_adornos">El control rango sin adornos</h5>
-
-<p>Cuando no especificas un atributo {{htmlattrxref("list", "input")}} al input range, un navegador que lo soporte mostrará lo siguie.</p>
-
-<table class="fullwidth standard-table">
- <tbody>
-  <tr>
-   <th>HTML</th>
-   <th>Captura de pantalla</th>
-  </tr>
-  <tr>
-   <td>
-    <pre class="brush: html">
-&lt;input type="range"&gt;</pre>
-   </td>
-   <td><img alt="Screenshot of a plain slider control on macOS" src="https://mdn.mozillademos.org/files/14989/macslider-plain.png" style="height: 28px; width: 184px;"></td>
-  </tr>
- </tbody>
-</table>
-
-<h5 id="Un_control_rango_con_marcas">Un control rango con marcas</h5>
-
-<p>El siguiente rango utiliza el atributo <code>list</code> (al cual le especificamos el ID del elemento {{HTMLElement("datalist")}}) para definir la serie de marcas del rango. Hay once marcas, cada una de ellas mide un 10%, representadas por el  {{htmlattrxref("value", "option")}} de cada elemento {{HTMLElement("option")}}.</p>
-
-<table class="fullwidth standard-table">
- <tbody>
-  <tr>
-   <th>HTML</th>
-   <th>Captura de pantalla</th>
-  </tr>
-  <tr>
-   <td>
-    <pre class="brush: html">
-&lt;input type="range" list="tickmarks"&gt;
-
-&lt;datalist id="tickmarks"&gt;
-  &lt;option value="0"&gt;
-  &lt;option value="10"&gt;
-  &lt;option value="20"&gt;
-  &lt;option value="30"&gt;
-  &lt;option value="40"&gt;
-  &lt;option value="50"&gt;
-  &lt;option value="60"&gt;
-  &lt;option value="70"&gt;
-  &lt;option value="80"&gt;
-  &lt;option value="90"&gt;
-  &lt;option value="100"&gt;
-&lt;/datalist&gt;
-</pre>
-   </td>
-   <td><img alt="Screenshot of a plain slider control on macOS" src="https://mdn.mozillademos.org/files/14991/macslider-ticks.png" style="height: 28px; width: 184px;"></td>
-  </tr>
- </tbody>
-</table>
-
-<h5 id="Un_control_rango_con_marcas_y_etiquetas">Un control rango con marcas y etiquetas</h5>
-
-<p>Puedes añadir etiquetas a tu control range usando el atributo {{htmlattrxref("label", "option")}} al elemento {{HTMLElement("option")}} correspondiente a cada marca que desees etiquetar.</p>
-
-<table class="fullwidth standard-table">
- <tbody>
-  <tr>
-   <th>HTML</th>
-   <th>Captura de pantalla</th>
-  </tr>
-  <tr>
-   <td>
-    <pre class="brush: html">
-&lt;input type="range" list="tickmarks"&gt;
-
-&lt;datalist id="tickmarks"&gt;
-  &lt;option value="0" label="0%"&gt;
-  &lt;option value="10"&gt;
-  &lt;option value="20"&gt;
-  &lt;option value="30"&gt;
-  &lt;option value="40"&gt;
-  &lt;option value="50" label="50%"&gt;
-  &lt;option value="60"&gt;
-  &lt;option value="70"&gt;
-  &lt;option value="80"&gt;
-  &lt;option value="90"&gt;
-  &lt;option value="100" label="100%"&gt;
-&lt;/datalist&gt;
-</pre>
-   </td>
-   <td><img alt="Screenshot of a plain slider control on macOS" src="https://mdn.mozillademos.org/files/14993/macslider-labels.png" style="height: 44px; width: 184px;"></td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota</strong>: Actualmente, ningún navegador soporta todas estas características. Firefox no soporta ni marcas ni etiquetas, mientras que Chrome soporta las marcas pero no las etiquetas.</p>
-</div>
-
-<h3 id="Cambiar_la_orientación">Cambiar la orientación</h3>
-
-<div class="hidden">
-<p>Por defecto, si un navegador renderiza un input range, lo mostrará como un "slider" (deslizador) que se desliza hacia la izquierda y hacia la derecha. By default, if a browser renders a range input as a slider, it will render it so that the knob slides left and right. Sin embargo puedes cambiar esto fácilmente para que se deslice hacia arriba y hacia abajo simplemente usando CSS</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Esto aún no está implementado por los principales navegadores. This is not actually implemented yet by any of the major browsers. See Firefox {{bug(981916)}}, <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=341071">Chrome bug 341071</a>.</p>
-</div>
-
-<p>Si tenemos el siguiente control range:</p>
-
-<div id="Orientation_sample1">
-<pre class="brush: html">&lt;input type="range" id="volume" min="0" max="11" value="7" step="1"&gt;</pre>
-</div>
-
-<p>{{EmbedLiveSample("Orientation_sample1", 200, 200, "https://mdn.mozillademos.org/files/14983/Orientation_sample1.png")}}</p>
-
-<p>Dicho control se muestra en horizontal (al menos en los principales navegadores, o otros puede variar). Presentarlo en vertical es tan simple como añadir CSS para cambiar las dimensiones del control, de la siguiente manera:</p>
-
-<div id="Orientation_sample2">
-<h4 id="CSS">CSS</h4>
-
-<pre class="brush: css">#volume {
-  height: 150px;
-  width: 50px;
-}</pre>
-
-<h4 id="HTML">HTML</h4>
-
-<pre class="brush: html">&lt;input type="range" id="volume" min="0" max="11" value="7" step="1"&gt;</pre>
-
-<h4 id="Result">Result</h4>
-
-<p>{{EmbedLiveSample("Orientation_sample2", 200, 200, "https://mdn.mozillademos.org/files/14985/Orientation_sample2.png")}}</p>
-
-<p><strong>En la actualidad, ninguno de los navegadores principales soporta la creación de inputs range usando este CSS, incluso a perar de que la especificación recomienda que lo hagan.</strong></p>
-</div>
-</div>
-
-<p>La especificación HTML recomienda que los navegadores cambien la orientación del range si el ancho especificado es menor que el alto. Desafortunadamente, ninguno de los principales navegadores soportar controles range verticales directamente. Para conseguir un range vertical, la forma más fácil es usar CSS, aplicando {{cssxref("transform")}} para rotar el elemento y mostrarlo en vertical. Veamos cómo.</p>
-
-<div id="Orientation_sample3">
-<h4 id="HTML_2">HTML</h4>
-
-<p>El HTML necesita que el elemento {{HTMLElement("input")}} esté dentro de un elemento {{HTMLElement("div")}} :</p>
-
-<pre class="brush: html">&lt;div class="slider-wrapper"&gt;
-  &lt;input type="range" min="0" max="11" value="7" step="1"&gt;
-&lt;/div&gt;</pre>
-
-<h4 id="CSS_2">CSS</h4>
-
-<p>Ahora necesitamos un poco de CSS. Primero escribimos el CSS del div contenedor; especificamos el modo de display y el tamaño que queremos que tenga, reservando un área en la página para el "slider" que vamos a rotar.</p>
-
-<pre class="brush: css">.slider-wrapper {
-  display: inline-block;
-  width: 20px;
-  height: 150px;
-  padding: 0;
-}
-</pre>
-Después ponemos la información para el elemento <code>&lt;input&gt;</code>:
-
-<pre class="brush: css">.slider-wrapper input {
-  width: 150px;
-  height: 20px;
-  margin: 0;
-  transform-origin: 75px 75px;
-  transform: rotate(-90deg);
-}</pre>
-
-<p>El tamaño del range es 150 pixeles de ancho por 20 pixeles de alto. Ponemos los márgenes a 0 y con {{cssxref("transform-origin")}} cambiamos centro que usaremos para rotar el range. Como el input mide 150 pixeles de ancho y largo, girará en una cuadrado de 150 pixeles de lado. Colocamos el centro de giro a 75px horizontal y verticalmente y, finalmente, rotamos 90º en sentido contrario a las agujas del reloj. El resultado final es un input range que ha girado y cuyo valor máximo está en la parte superior y el valor mínimo en la parte inferior.</p>
-
-<h4 id="Result_2">Result</h4>
-
-<p>{{EmbedLiveSample("Orientation_sample3", 200, 200, "https://mdn.mozillademos.org/files/14987/Orientation_sample3.png")}}</p>
-</div>
-
-<h2 id="Validación">Validación</h2>
-
-<div class="g-unit" id="gt-res-c">
-<div id="gt-res-p">
-<div id="gt-res-data">
-<div id="gt-res-wrap">
-<div id="gt-res-content">
-<div class="trans-verified-button-small" dir="ltr" id="gt-res-dir-ctr">
-<div id="tts_button"> </div>
-<span id="result_box" lang="es"><span>No hay un patrón de validación</span></span><span lang="es"><span> disponible;</span> <span>sin embargo, se realizan las siguientes formas de validación automática:</span></span></div>
-</div>
-</div>
-</div>
-</div>
-</div>
-
-<p> </p>
-
-<ul>
- <li>Si el {{htmlattrxref("value", "input")}} <span id="result_box" lang="es"><span>está configurado con un valor que no se puede convertir en un número de coma flotante válido, la validación falla porque recibe una entrada incorrecta.</span></span></li>
- <li>El valor no puede ser menor que el valor de {{htmlattrxref("min", "input")}}. Por defecto es 0.</li>
- <li>El valor no puede ser mayor que el {{htmlattrxref("max", "input")}}. Por defecto es 100.</li>
- <li>El valor será un múltiplo del valor de {{htmlattrxref("step", "input")}}. Por defecto es 1.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Además de los ejemplos anteriores, encontrarás más ejemplos en los siguientes artículos:</p>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Web_Audio_API/Controlling_multiple_parameters_with_ConstantSourceNode">Controlling multiple parameters with ConstantSourceNode</a></li>
-</ul>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#range-state-(type=range)', '&lt;input type="range"&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'sec-forms.html#range-state-typerange', '&lt;input type="range"&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>4.0<sup>[2]</sup></td>
-   <td>12</td>
-   <td>{{CompatGeckoDesktop(23)}}<sup>[1][4]</sup></td>
-   <td>10</td>
-   <td>10.1</td>
-   <td>3.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>2.1<sup>[3]</sup></td>
-   <td>57<sup>[2]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile(52)}}<sup>[1]</sup></td>
-   <td>10</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>5.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] A pesar de que la especificación dice que el input range debe mostrarse verticalmente si el alto es mayor que el ancho, este comportamiento no está implementado actualmente. Mira los siguientes bugs para conocer más información: {{bug(840820)}} y {{bug(981916)}}.</p>
-
-<p>[2] Chrome implementa el valor <code>slider-vertical</code> con la propiedad no estandard {{cssxref("-webkit-appearance")}}. <em>No deberías usarla ya que es propietaria, a menos que incluyas fallbacks para usuarios de otros navegadores</em>.</p>
-
-<p>[3] El navegador de Android reconoce el tipo <code>"range"</code> desde la versión 2.1, pero no está totalmente implementada hasta la versión 4.3.</p>
-
-<p>[4] Dibujar marcas y etiquetas no está aún implementado. Ver {{bug(841942)}} para conocer más información.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/HTML/Forms">HTML Forms</a></li>
- <li>{{HTMLElement("input")}} and the {{domxref("HTMLInputElement")}} interface it's based upon</li>
- <li><code><a href="/en-US/docs/Web/HTML/Element/input/number">&lt;input type="number"&gt;</a></code></li>
-</ul>
diff --git a/files/es/web/html/elemento/input/text/index.html b/files/es/web/html/elemento/input/text/index.html
deleted file mode 100644
index b98f985679..0000000000
--- a/files/es/web/html/elemento/input/text/index.html
+++ /dev/null
@@ -1,472 +0,0 @@
----
-title: <input type="text">
-slug: Web/HTML/Elemento/input/text
-tags:
-  - Entrada de texto
-  - Form input
-  - Formulários HTML
-  - HTML
-  - Input
-  - Input Type
-  - Referencia
-  - Text
-  - Texto
-  - formulários
-  - text input
-translation_of: Web/HTML/Element/input/text
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("text")}} crean campos de texto básicos de una sola línea.</span></p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/input-text.html", "tabbed-shorter")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <td><strong>{{anch("Value")}}</strong></td>
-   <td>Un {{DOMxRef("DOMString")}} que representa el texto contenido en el campo de texto.</td>
-  </tr>
-  <tr>
-   <td><strong>Eventos</strong></td>
-   <td>{{event("change")}} y {{event("input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Atributos comunes admitidos</strong></td>
-   <td>{{htmlattrxref("autocomplete", "input")}}, {{htmlattrxref("list", "input")}}, {{htmlattrxref("maxlength", "input")}}, {{htmlattrxref("minlength", "input")}}, {{htmlattrxref("pattern", "input")}}, {{htmlattrxref("placeholder", "input")}}, {{htmlattrxref("readonly", "input")}}, {{htmlattrxref("required", "input")}} y {{htmlattrxref("size", "input")}}</td>
-  </tr>
-  <tr>
-   <td><strong>IDL attributes</strong></td>
-   <td>{{htmlattrxref("list", "input")}}, {{HTMLAttrDef("value")}}</td>
-  </tr>
-  <tr>
-   <td><strong>Métodos</strong></td>
-   <td>{{DOMxRef("HTMLInputElement.select", "select()")}}, {{DOMxRef("HTMLInputElement.setRangeText", "setRangeText()")}} y {{DOMxRef("HTMLInputElement.setSelectionRange", "setSelectionRange()")}}.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Value"><code>Value</code></h2>
-
-<p>El atributo {{HTMLAttrxRef("value", "input")}} es un {{DOMxRef("DOMString")}} que contiene el valor actual del texto ingresado en el campo de texto. Puedes recuperar esto usando la propiedad {{DOMxRef("HTMLInputElement.value", "value")}} en JavaScript.</p>
-
-<pre class="brush: js notranslate">let theText = myTextInput.value;
-</pre>
-
-<p>Si no existen restricciones de validación para la entrada (consulta {{anch("Validación")}} para obtener más detalles), el valor puede ser una cadena vacía ("").</p>
-
-<h2 id="Atributos_adicionales">Atributos adicionales</h2>
-
-<p>Además de los atributos que operan en todos los elementos {{HTMLElement("input")}} independientemente de su tipo, las entradas de texto admiten los siguientes atributos:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Atributo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>{{anch("list")}}</code></td>
-   <td>El id del elemento {{HTMLElement("datalist")}} que contiene las opciones de autocompletar predefinidas</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("maxlength")}}</code></td>
-   <td>El número máximo de caracteres que debe aceptar la entrada</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("minlength")}}</code></td>
-   <td>El número mínimo de caracteres que la entrada puede tener y aún se considera válida</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("pattern")}}</code></td>
-   <td>Una expresión regular que el contenido de la entrada debe coincidir para que sea válida</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("placeholder")}}</code></td>
-   <td>Un valor de ejemplo para mostrar en el campo de entrada siempre y cuando esté vacío</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("readonly")}}</code></td>
-   <td>Un atributo booleano que indica si el contenido de la entrada debe ser de solo lectura.</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("size")}}</code></td>
-   <td>Un número que indica cuántos caracteres de ancho debe tener el campo de entrada.</td>
-  </tr>
-  <tr>
-   <td><code>{{anch("spellcheck")}}</code></td>
-   <td>Controla si se habilita o no la revisión ortográfica para el campo de entrada, o si se debe usar la configuración de revisión ortográfica predeterminada</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="HTMLAttrDeflist">{{HTMLAttrDef("list")}}</h3>
-
-<p>Los valores del atributo {{HTMLAttrDef("list")}} son el {{DOMxRef("Element.id", "id")}} de un elemento {{HTMLElement("datalist")}} ubicado en el mismo documento. El {{HTMLElement("datalist")}} proporciona una lista de valores predefinidos para sugerir al usuario para esta entrada. Cualquier valor de la lista que no sea compatible con {{HTMLAttrxRef("type", "input")}} no se incluye en las opciones sugeridas. Los valores proporcionados son sugerencias, no requisitos: los usuarios pueden seleccionar de esta lista predefinida o proporcionar un valor diferente.</p>
-
-<h3 id="HTMLAttrDefmaxlength">{{HTMLAttrDef("maxlength")}}</h3>
-
-<p>El número máximo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrDef("text")}}. Debe ser un valor entero 0 o superior. Si no se especifica {{HTMLAttrDef("maxlength")}}, o se especifica un valor no válido, el {{HTMLAttrDef("text")}} de la entrada no tiene una longitud máxima. Este valor también debe ser mayor o igual que el valor de {{HTMLAttrxRef("minlength", "input")}}.</p>
-
-<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del valor de texto del campo es mayor que {{HTMLAttrxRef("maxlength", "input")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
-
-<h3 id="HTMLAttrDefminlength">{{HTMLAttrDef("minlength")}}</h3>
-
-<p>El número mínimo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en la entrada de {{HTMLAttrDef("texto")}}. Debe ser un valor entero no negativo menor o igual al valor especificado por {{HTMLAttrxRef("maxlength", "input")}}. Si no se especifica {{HTMLAttrDef("minlength")}}, o se especifica un valor no válido, la entrada de {{HTMLAttrDef("text")}} no tiene una longitud mínima.</p>
-
-<p>La entrada fallará {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricción de validación")}} si la longitud del texto ingresado en el campo es menor que {{HTMLAttrDef("minlength")}} Unidades de código UTF-16 de longitud. La validación de la restricción solo se aplica cuando el usuario cambia el valor.</p>
-
-<h3 id="HTMLAttrDefpattern">{{HTMLAttrDef("pattern")}}</h3>
-
-<div id="pattern-include">
-<p>El atributo {{HTMLAttrDef("pattern")}}, cuando se especifica, es una expresión regular que el {{HTMLAttrxRef("value")}} de la entrada debe coincidir para que el valor pase {{web.link("/es/docs/Web/Guide/HTML/HTML5/Constraint_validation", "restricciones de validación")}}. Debe ser una expresión regular de JavaScript válida, como la usada por el tipo {{JSxRef("RegExp")}} y como se documenta en la {{web.link("/es/docs/Web/JavaScript/Guide/Regular_Expressions", "guía sobre expresiones regulares")}}; el indicador <code>'u'</code> se especifica al compilar la expresión regular, de modo que el patrón se trata como una secuencia de puntos de código Unicode, en lugar de ASCII. No se deben especificar barras diagonales alrededor del texto del patrón.</p>
-
-<p>Si el patrón especificado no se especifica o no es válido, no se aplica ninguna expresión regular y este atributo se ignora por completo.</p>
-
-<div class="note">
-<p><strong>Consejo</strong>:: Utiliza el atributo {{HTMLAttrxRef("title", "input")}} para especificar el texto que la mayoría de los navegadores mostrarán como información sobre herramientas para explicar cuáles son los requisitos para coincidir con el patrón. También debes incluir otro texto explicativo cercano.</p>
-</div>
-</div>
-
-<p>Consulta {{anch("Especificación de un patrón")}} para obtener más detalles y un ejemplo.</p>
-
-<h3 id="HTMLAttrDefplaceholder">{{HTMLAttrDef("placeholder")}}</h3>
-
-<p>El atributo {{HTMLAttrDef("placeholder")}} es una cadena que proporciona una breve pista al usuario sobre el tipo de información que se espera en el campo. Debe ser una palabra o frase corta que demuestre el tipo de datos esperado, en lugar de un mensaje explicativo. El texto <em>no debe</em> incluir retornos de carro o saltos de línea.</p>
-
-<p>Si el contenido del control tiene una direccionalidad ({{Glossary("LTR")}} o {{Glossary("RTL")}}) pero necesitas presentar el marcador de posición en la direccionalidad opuesta, puedes usar caracteres de formato de algoritmo bidireccional Unicode para anular la direccionalidad dentro del marcador de posición; consulta {{SectionOnPage("/es/docs/Web/Localization/Unicode_Bidirectional_Text_Algorithm", "Anulación de BiDi mediante caracteres de control Unicode")}} para esos caracteres.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Evita utilizar el atributo {{HTMLAttrDef("placeholder")}} si puedes. No es tan útil semánticamente como otras formas de explicar tu formulario y puede causar problemas técnicos inesperados con tu contenido. Consulta {{SectionOnPage("/es/docs/Web/HTML/Element/input", "Etiquetas y marcadores de posición")}} para obtener más información.</p>
-</div>
-
-<h3 id="HTMLAttrDefreadonly">{{HTMLAttrDef("readonly")}}</h3>
-
-<p>Un atributo booleano que, si está presente, significa que el usuario no puede editar este campo. Su {{HTMLAttrDef("value")}}, sin embargo, aún se puede cambiar mediante el código JavaScript configurando directamente la propiedad {{DOMxRef("HTMLInputElement.value")}}.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Debido a que un campo de solo lectura no puede tener un valor, {{HTMLAttrDef("required")}} no tiene ningún efecto en las entradas con el atributo {{HTMLAttrDef("readonly")}} también especificado.</p>
-</div>
-
-<h3 id="HTMLAttrDefsize">{{HTMLAttrDef("size")}}</h3>
-
-<p>El atributo {{HTMLAttrDef("size")}} es un valor numérico que indica cuántos caracteres de ancho debe tener el campo de entrada. El valor debe ser un número mayor que cero, y el valor predeterminado es 20. Dado que el ancho de los caracteres varía, esto puede ser exacto o no y no se debe confiar en que lo sea; la entrada resultante puede ser más estrecha o más ancha que el número especificado de caracteres, dependiendo de los caracteres y la fuente (configuración de {{CSSxRef("fuente")}} en uso).</p>
-
-<p>Esto <em>no</em> establece un límite en la cantidad de caracteres que el usuario puede ingresar en el campo. Solo especifica aproximadamente cuántos se pueden ver a la vez. Para establecer un límite superior en la longitud de los datos de entrada, utiliza el atributo {{anch("maxlength")}}.</p>
-
-<h3 id="HTMLAttrDefspellcheck">{{HTMLAttrDef("spellcheck")}}</h3>
-
-<p>{{HTMLAttrDef("spellcheck")}} es un atributo global que se utiliza para indicar si se habilita o no la revisión ortográfica de un elemento. Se puede usar en cualquier contenido editable, pero aquí consideramos los detalles relacionados con el uso del corrector ortográfico ({{HTMLAttrxRef("spellcheck")}} en elementos {{HTMLElement("input")}}. Los valores permitidos para el corrección ortográfica son:</p>
-
-<dl>
- <dt><code>false</code></dt>
- <dd>Desactive la corrección ortográfica de este elemento.</dd>
- <dt><code>true</code></dt>
- <dd>Habilita la revisión ortográfica de este elemento.</dd>
- <dt>"" (cadena vacía) o sin valor</dt>
- <dd>Sigue el comportamiento predeterminado del elemento para la revisión ortográfica. Esto se puede basar en la configuración de la corrección ortográfica de los padres u otros factores.</dd>
-</dl>
-
-<p>Un campo de entrada puede tener habilitado el corrector ortográfico si no tiene el atributo {{anch("readonly")}} configurado y no está deshabilitado.</p>
-
-<p>Es posible que el valor devuelto al leer el corrector ortográfico puede no reflejar el estado real del corrector ortográfico dentro de un control, si las preferencias de {{Glossary("agente de usuario", "agentes de usuario")}} anulan la configuración.</p>
-
-<h2 id="Atributos_no_estándar">Atributos no estándar</h2>
-
-<p>Los siguientes atributos no estándar también están disponibles en algunos navegadores. Como regla general, debes evitar usarlos a menos que no puedas evitarlo.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Atributo</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>{{anch("autocorrect")}}</code></td>
-   <td>Una cadena que indica si la autocorrección está activa (<code>on</code>) o (<code>off</code>). <strong>Solo Safari.</strong></td>
-  </tr>
-  <tr>
-   <td><code>{{anch("mozactionhint")}}</code></td>
-   <td>Una cadena que indica el tipo de acción que se realizará cuando el usuario presione la tecla <kbd>Intro</kbd> o <kbd>Retorno</kbd> mientras editas el campo; esto se usa para determinar una etiqueta apropiada para esa tecla en un teclado virtual. <strong>Solo Firefox para Android.</strong></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="HTMLAttrDefautocorrect_non-standard_inline">{{HTMLAttrDef("autocorrect")}} {{non-standard_inline}}</h3>
-
-<div id="autocorrect-include">
-<p>Una extensión de Safari, el atributo {{HTMLAttrDef("autocorrect")}} es una cadena que indica si activar o no la corrección automática mientras el usuario está editando este campo. Los valores permitidos son:</p>
-
-<dl>
- <dt><code>on</code></dt>
- <dd>Habilita la corrección automática de errores tipográficos, así como el procesamiento de sustituciones de texto, si los hay.</dd>
- <dt><code>off</code></dt>
- <dd>Desactiva la corrección automática y las sustituciones de texto.</dd>
-</dl>
-</div>
-
-<h3 id="HTMLAttrDefmozactionhint_non-standard_inline">{{HTMLAttrDef("mozactionhint")}} {{non-standard_inline}}</h3>
-
-<div id="mozactionhint-include">
-<p>Una extensión de Mozilla, compatible con Firefox para Android, que proporciona una pista sobre qué tipo de acción se realizará si el usuario presiona la tecla <kbd>Intro</kbd> o <kbd>Retorno</kbd> mientras edita el campo. Esta información se usa para decidir qué tipo de etiqueta usar en la tecla <kbd>Intro</kbd> del teclado virtual.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Este <a href="https://html.spec.whatwg.org/#input-modalities:-the-enterkeyhint-attribute">se ha estandarizado</a> como el atributo global {{HTMLAttrxRef("enterkeyhint")}}, pero aún no está ampliamente implementado. Para ver el estado del cambio que se está implementando en Firefox, consulta {{bug(1490661)}}.</p>
-</div>
-
-<p>Los valores permitidos son: <code>go</code>, <code>done</code>, <code>next</code>, <code>search</code> y <code>send</code>. El navegador decide, utilizando esta sugerencia, qué etiqueta poner en la tecla Intro.</p>
-</div>
-
-<h2 id="Usar_entradas_de_texto">Usar entradas de texto</h2>
-
-<p>Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("text")}} crean entradas básicas de una sola línea. Los debes usar en cualquier lugar donde desees que el usuario ingrese un valor de una sola línea y no hay un tipo de entrada más específico disponible para recopilar ese valor (por ejemplo, si es un {{web.link("/es/docs/Web/HTML/Element/input/datetime-local", "date")}}, {{web.link("/es/docs/Web/HTML/Element/input/url", "URL")}}, {{web.link("/es/docs/Web/HTML/Element/input/email", "email")}}, o {{web.link("/es/docs/Web/HTML/Element/input/search", "término de búsqueda")}}, tiene mejores opciones disponibles).</p>
-
-<h3 id="Ejemplo_básico">Ejemplo básico</h3>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
-    &lt;input type="text" id="uname" name="name"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Esto se renderiza así:</p>
-
-<p>{{EmbedLiveSample("Ejemplo_básico", 600, 50)}}</p>
-
-<p>Cuando se envía, el par de nombre/valor de datos enviado al servidor será <code>uname=Chris</code> (si se ingresó "Chris" como valor de entrada antes del envío). Debes recordar incluir el atributo {{HTMLAttrxRef("name", "input")}} en el elemento {{HTMLElement("input")}}; de lo contrario, el valor del campo de texto no se incluirá con los datos enviados.</p>
-
-<h3 id="Establecer_marcadores_de_posición">Establecer marcadores de posición</h3>
-
-<p>Puedes proporcionar un marcador de posición útil dentro de tu entrada de texto que puede proporcionar una pista sobre qué ingresar al incluir el uso del atributo {{HTMLAttrxRef("placeholder", "input")}}. Mira el siguiente ejemplo:</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
-    &lt;input type="text" id="uname" name="name"
-           placeholder="Una sola palabra, en minúsculas"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Puedes ver cómo se representa el marcador de posición a continuación:</p>
-
-<p>{{EmbedLiveSample("Establecer_marcadores_de_posición", 600, 50)}}</p>
-
-<p>El marcador de posición generalmente se representa en un color más claro que el color de primer plano del elemento y desaparece automáticamente cuando el usuario comienza a ingresar texto en el campo (o siempre que el campo tiene un valor establecido programáticamente al establecer su atributo {{HTMLAttrDef("value")}}.</p>
-
-<h3 id="Tamaño_físico_del_elemento_de_entrada">Tamaño físico del elemento de entrada</h3>
-
-<p>El tamaño físico del cuadro de entrada se puede controlar mediante el atributo {{HTMLAttrxRef("size", "input")}}. Con él, puedes especificar el número de caracteres que la entrada de texto puede mostrar a la vez. Esto afecta el ancho del elemento, lo cual te permite especificar el ancho en términos de caracteres en lugar de píxeles. En este ejemplo, por ejemplo, la entrada tiene 30 caracteres de ancho:</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
-    &lt;input type="text" id="uname" name="name"
-           placeholder="Una sola palabra, en minúsculas"
-           size="30"&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>{{ EmbedLiveSample('Tamaño_físico_del_elemento_de_entrada', 600, 50) }}</p>
-
-<h2 id="Validación">Validación</h2>
-
-<p>Los elementos {{HTMLElement("input")}} de tipo {{HTMLAttrDef("text")}} no tienen validación automática aplicada (ya que una entrada de texto básica debe ser capaz de aceptar cualquier cadena arbitraria), pero hay algunas opciones de validación de lado del cliente disponibles, que verás a continuación.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: La validación del formulario HTML <em>no</em> sustituye a la de los scripts del servidor que garantizan que los datos introducidos tengan el formato adecuado. Es demasiado fácil para alguien realizar ajustes en el HTML que le permitan omitir la validación o eliminarla por completo. También es posible que alguien simplemente omita tu HTML por completo y envíe los datos directamente a tu servidor. Si tu código del lado del servidor no valida los datos que recibe, podría ocurrir un desastre cuando se ingresen en tu base de datos datos con formato incorrecto (o datos que son demasiado grandes, son del tipo incorrecto, etc.).</p>
-</div>
-
-<h3 id="Una_nota_sobre_estilizado">Una nota sobre estilizado</h3>
-
-<p>Hay pseudoclases útiles disponibles para diseñar elementos de formulario para ayudar al usuario a ver cuándo sus valores son válidos o no. Estos son {{CSSxRef(": valid")}} e {{CSSxRef(":invalid")}}. En esta sección, usaremos el siguiente CSS, que colocará una marca de verificación (tilde) junto a las entradas que contienen valores válidos y una cruz (X) junto a las entradas que contienen valores no válidos.</p>
-
-<pre class="brush: css notranslate">div {
-  margin-bottom: 10px;
-  position: relative;
-}
-
-input + span {
-  padding-right: 30px;
-}
-
-input:invalid+span:after {
-  position: absolute; content: '✖';
-  padding-left: 5px;
-}
-
-input:valid+span:after {
-  position: absolute;
-  content: '✓';
-  padding-left: 5px;
-}</pre>
-
-<p>La técnica también requiere que se coloque un elemento {{HTMLElement("span")}} después del elemento {{HTMLElement("form")}}, que actúa como contenedor de los iconos. Esto era necesario porque algunos tipos de entrada en algunos navegadores no muestran muy bien los iconos colocados directamente después de ellos.</p>
-
-<h3 id="Hacer_entrada_requerida">Hacer entrada requerida</h3>
-
-<p>Puedes usar el atributo {{HTMLAttrxRef("required", "input")}} como una manera fácil de hacer que se requiera ingresar un valor antes de que se permita el envío del formulario:</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
-    &lt;input type="text" id="uname" name="name" required&gt;
-    &lt;span class="validity"&gt;&lt;/span&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">div { margin-bottom: 10px; position: relative; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; }</pre>
-</div>
-
-<p>Esto se renderiza así:</p>
-
-<p>{{ EmbedLiveSample('Hacer_entrada_requerida', 600, 70) }}</p>
-
-<p>Si intentas enviar el formulario sin ningún término de búsqueda ingresado, el navegador mostrará un mensaje de error.</p>
-
-<h3 id="Longitud_del_valor_de_entrada">Longitud del valor de entrada</h3>
-
-<p>Puedes especificar una longitud mínima (en caracteres) para el valor ingresado usando el atributo {{HTMLAttrxRef("minlength", "input")}}; de manera similar, usa {{HTMLAttrxRef("maxlength", "input")}} para establecer la longitud máxima del valor ingresado, en caracteres.</p>
-
-<p>El siguiente ejemplo requiere que el valor ingresado tenga entre 4 y 8 caracteres de longitud.</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
-    &lt;input type="text" id="uname" name="name" required size="10"
-           placeholder="nombreusuario"
-           minlength="4" maxlength="8"&gt;
-    &lt;span class="validity"&gt;&lt;/span&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">div { margin-bottom: 10px; position: relative; } input + span { padding-right: 30px; } input:invalid+span:after { position: absolute; content: '✖'; padding-left: 5px; } input:valid+span:after { position: absolute; content: '✓'; padding-left: 5px; }</pre>
-</div>
-
-<p>Esto se renderiza así:</p>
-
-<p>{{ EmbedLiveSample('Longitud_del_valor_de_entrada', 600, 70) }}</p>
-
-<p>Si intentas enviar el formulario con menos de 4 caracteres, se te dará un mensaje de error apropiado (que difiere entre los navegadores). Si intentas ingresar más de 8 caracteres, el navegador no te lo permitirá.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Si especificas un {{HTMLAttrDef("minlength")}} pero no especificas {{HTMLAttrDef("required")}}, la entrada se considera válida, ya que no se requiere que el usuario especifique un valor.</p>
-</div>
-
-<h3 id="Especificación_de_un_patrón">Especificación de un patrón</h3>
-
-<p>Puedes utilizar el atributo {{HTMLAttrxRef("pattern", "input")}} para especificar una expresión regular con la que el valor ingresado debe coincidir para que se considere válido (ve un curso intensivo simple en {{web.link("/es/docs/Learn/HTML/Forms/Form_validation#Validación_con_una_expresión_regular", "Validación con una expresión regular")}} sobre el uso de expresiones regulares para validar entradas).</p>
-
-<p>El siguiente ejemplo restringe el valor a 4-8 caracteres y requiere que contenga solo letras minúsculas.</p>
-
-<pre class="brush: html notranslate">&lt;form&gt;
-  &lt;div&gt;
-    &lt;label for="uname"&gt;Elige un nombre de usuario: &lt;/label&gt;
-    &lt;input type="text" id="uname" name="name" required size="45"
-           pattern="[a-z]{4,8}"&gt;
-    &lt;span class="validity"&gt;&lt;/span&gt;
-    &lt;p&gt;Los nombres de usuario deben estar en minúsculas y tener entre 4 y 8 caracteres de longitud.&lt;/p&gt;
-  &lt;/div&gt;
-  &lt;div&gt;
-    &lt;button&gt;Enviar&lt;/button&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<div class="hidden">
-<pre class="brush: css notranslate">div {
-  margin-bottom: 10px;
-  position: relative;
-}
-
-p {
-  font-size: 80%;
-  color: #999;
-}
-
-input + span {
-  padding-right: 30px;
-}
-
-input:invalid+span:after {
-  position: absolute;
-  content: '✖';
-  padding-left: 5px;
-}
-
-input:valid+span:after {
-  position: absolute;
-  content: '✓';
-  padding-left: 5px;
-}</pre>
-</div>
-
-<p>Esto se renderiza así:</p>
-
-<p>{{ EmbedLiveSample('Especificación_de_un_patrón', 600, 110) }}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Puedes ver buenos ejemplos de entradas de texto utilizadas en contexto en los artículos {{web.link("/es/docs/Learn/HTML/Forms/Your_first_HTML_form", "Mi primer formulario HTML")}} y {{web.link("/es/docs/Learn/HTML/Forms/How_to_structure_an_HTML_form", "Cómo estructurar un formulario HTML")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'input.html#text-(type=text)-state-and-search-state-(type=search)', '&lt;input type="text"&gt;')}}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'sec-forms.html#text-typetext-state-and-search-state-typesearch', '&lt;input type="text"&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.input.input-text")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{web.link("/es/docs/Learn/HTML/Forms", "Formularios HTML")}}</li>
- <li>{{HTMLElement("input")}} y la interfaz {{DOMxRef("HTMLInputElement")}} en que se basa.</li>
- <li><code><a href="/en-US/docs/Web/HTML/Element/input/search">&lt;input type="search"&gt;</a></code></li>
- <li>{{HTMLElement("textarea")}}: Campo de entrada de texto multilínea</li>
- <li>{{web.link("/es/docs/Learn/HTML/Forms/Property_compatibility_table_for_form_widgets", "Compatibilidad de propiedades CSS")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/ins/index.html b/files/es/web/html/elemento/ins/index.html
deleted file mode 100644
index 8201603d48..0000000000
--- a/files/es/web/html/elemento/ins/index.html
+++ /dev/null
@@ -1,137 +0,0 @@
----
-title: ins
-slug: Web/HTML/Elemento/ins
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/ins
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <code style="color: darkblue;">ins</code> (insertado) marca las partes de un texto que han sido añadidos al documento.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;ins&gt; e &lt;/ins&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: a veces <a href="/es/HTML/Elemento/Tipos_de_elementos#en_linea" title="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a> a veces <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>:</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: depende, si actua como un elemento en bloque puede contener elementos en bloque. Pero si actua como un elemento en linea solo podrá contener elementos en linea.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">cite</code></td>
-   <td>URI</td>
-   <td>implícito</td>
-   <td>información sobre el cambio</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">datetime</code></td>
-   <td>fecha</td>
-   <td>implícito</td>
-   <td>fecha y hora del cambio</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene, o dicho de otra manera, tiene los mismos que en el doctype estricto</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre> Ejemplo de ins en linea:
-   &lt;p&gt; El agua es insipida, &lt;ins&gt;inodora e incolora.&lt;/ins&gt; &lt;/p&gt;
-
- Ejemplo de ins en bloque:
-   &lt;p&gt; El agua es insipida. &lt;/p&gt;
-   &lt;ins&gt; &lt;p&gt; Y además inodora e incolora. &lt;/p&gt; &lt;/ins&gt;
-</pre>
-
-<p><br>
- Se visualiza así:</p>
-
-<div class="highlight">
-<p>Ejemplo de ins en linea:</p>
-
-<p>El agua es insipida, <ins>inodora e incolora.</ins></p>
-
-<p>Ejemplo de ins en bloque:</p>
-
-<p>El agua es insipida.</p>
-
-<p><ins>y además inodora e incolora.</ins></p>
-</div>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/elemento/isindex/index.html b/files/es/web/html/elemento/isindex/index.html
deleted file mode 100644
index 520c286c08..0000000000
--- a/files/es/web/html/elemento/isindex/index.html
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: <isindex>
-slug: Web/HTML/Elemento/isindex
-tags:
-  - Deprecado
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/isindex
----
-<div>{{Deprecated_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p><code>&lt;isindex&gt; </code>es un elemento HTML  obsoleto que posiciona un campo de texto en una página para buscar en el documento . <code>&lt;isindex&gt;</code> fue pensado por el W3C  para ser usado dentro del elemento {{HTMLElement("head")}} , pero los exploradores lo soportaban sin importar donde se usaba .</p>
-
-<p>&lt;<font face="Consolas, Liberation Mono, Courier, monospace">isindex&gt; </font>fue deprecado en HTML 4.01 , debido a que el mismo comportamiento puede ser logrado con un form de HTML. </p>
-
-<h2 id="Atributos">Atributos </h2>
-
-<p>Como todos los otros elementos HTML , este elemento acepta los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</p>
-
-<dl>
- <dt>{{htmlattrdef("prompt")}}</dt>
- <dd>Este atributo añade su valor como una ventana para un campo de texto.</dd>
- <dt>{{htmlattrdef("action")}}</dt>
- <dd>Este atributo puede ser usado para mandar una busqueda a una URL diferente . La acción no está definida por el W3C .</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html">&lt;head&gt;
-  &lt;isindex prompt="Search Document... " /&gt;
-&lt;/head&gt;</pre>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{HTMLElement("input")}}</li>
- <li>{{HTMLElement("form")}}</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/kbd/index.html b/files/es/web/html/elemento/kbd/index.html
deleted file mode 100644
index 1f29dead64..0000000000
--- a/files/es/web/html/elemento/kbd/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: kbd
-slug: Web/HTML/Elemento/kbd
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/kbd
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Marca el texto que debe introducir el usuario.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;kbd&gt; y &lt;/kbd&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">&lt;p&gt;
-Si está conforme escriba &lt;kbd&gt;sí&lt;/kbd&gt;. Si no, pulse &lt;kbd&gt;esc&lt;/kbd&gt;
-&lt;/p&gt;
-</pre>
-
-<p>Se visualiza asi</p>
-
-<p class="eval">Si esta conforme escriba <kbd>si</kbd>. Si no, pulse <kbd>esc</kbd></p>
-
-<h3 id="Comentarios" name="Comentarios"> </h3>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p>La visualizacion puede cambiar segun el navegador debido a los estilos preestablecidos por cada uno.</p>
diff --git a/files/es/web/html/elemento/keygen/index.html b/files/es/web/html/elemento/keygen/index.html
deleted file mode 100644
index 0370a780cd..0000000000
--- a/files/es/web/html/elemento/keygen/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: keygen
-slug: Web/HTML/Elemento/keygen
-tags:
-  - para_revisar
-translation_of: Web/HTML/Element/keygen
----
-<p>El elemento <code>keygen</code> de HTML existe para facilitar la generación de llaves, y el envío de la clave pública como parte de un formulario HTML. Este mecanismo está diseñado para utilizarse con sistemas de gestión de certificados basados en la Web. Se espera que el elemento <code>keygen</code> se utilice en un formulario HTML, junto con otra información necesaria para la construcción de una solicitud de certificado, y que el resultado del proceso será un certificado firmado.</p>
-
-<h3 id="Usage_context" name="Usage_context">Contexto de uso</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Las categorías de contenido</td>
-   <td><a title="es / HTML / categorías de contenido # flujo de contenido">contenido dinámico</a> , <a title="es / HTML / Las categorías de contenido # Enunciado contenido">el contenido de redacción</a> , contenido interactivo, <a title="es / HTML / categorías de contenido # formulario de lista">lista</a> , <a title="es / HTML / categorías de contenido # forma labelable">labelable</a> , <a title="es / HTML / categorías de contenido # forma submittable">submittable</a> , <a title="es / HTML / categorías de contenido # forma reajustable">reajustable</a> <a title="es / HTML / categorías de contenido # contenido del formulario asociado">asociada elemento de formulario.</a></td>
-  </tr>
-  <tr>
-   <td>Contenido permitido</td>
-   <td>ninguno</td>
-  </tr>
-  <tr>
-   <td>Omisión de etiquetas</td>
-   <td>elemento vacío, sólo tiene una etiqueta de inicio</td>
-  </tr>
-  <tr>
-   <td>Elementos padres permitidos</td>
-   <td>donde se espere <a title="es / HTML / Las categorías de contenido # Enunciado contenido">contenido de frases</a></td>
-  </tr>
-  <tr>
-   <td>Documento normativo</td>
-   <td><a class="external" href="http://www.w3.org/TR/html5/the-button-element.html#the-keygen-element" title="http://www.w3.org/TR/html5/the-button-element.html # el-keygen-elemento">HTML 5, la sección 4.10.5</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Atributos">Atributos</h3>
-
-<h3 id="Uso">Uso</h3>
-
-<dl>
- <dt><a name="attr-autofocus">autofocus</a></dt>
- <dd>Este atributo booleano permite especificar que el control debe tener el foco de entrada cuando se cargue la página, a menos que el usuario lo anule, por ejemplo, al escribir en un control diferente. Sólo un elemento de formulario en un documento puede tener el atributo <strong>autofocus,</strong> que es un valor booleano.</dd>
- <dt>{{ Htmlattrdef ("challenge") }}</dt>
- <dd>Una cadena de desafío que se presenta junto con la clave pública. El valor predeterminado es una cadena vacía si no se especifica.</dd>
- <dt>{{ Htmlattrdef ("disabled") }}</dt>
- <dd>Este atributo booleano indica que el control del formulario no está disponible para la interacción.</dd>
- <dt><a name="attr-form">form</a></dt>
- <dd>El elemento form al que este elemento está asociado (el <em>propietario del formulario).</em> El valor del atributo debe ser un <strong>id</strong> de un elemento {{ HTMLElement ("form") }} en el mismo documento. Si este atributo no se especifica, este elemento debe ser un descendiente de un elemento {{ HTMLElement ("form") }}. Este atributo le permite colocar elementos <span style="font-family: Courier New;">&lt;keygen&gt;</span> en cualquier lugar dentro de un documento, no sólo como descendientes del formulario.</dd>
- <dt>{{ Htmlattrdef ("keytype") }}</dt>
- <dd>El tipo de clave generada. El valor por defecto es <code>RSA</code> .</dd>
- <dt><a name="attr-name">name</a></dt>
- <dd>El nombre del control, que se envía con los datos del formulario.</dd>
-</dl>
-
-<p>El elemento se escribe como sigue:</p>
-
-<pre><code>&lt;keygen name="<var>name</var>" challenge="<var>challenge string</var>" keytype="<var>type</var>" keyparams="<var>pqg-params</var>"&gt;</code></pre>
-
-<p>El parámetro <code>keytype</code> se utiliza para especificar qué tipo de clave se generará. Los valores válidos son " <code>RSA</code> ", que es el valor predeterminado," <code>DSA</code> "y" <code>EC</code> ". Los atributos <code>name</code> y <code>challenge</code> son necesarios en todos los casos. El atributo <code>keytype</code> es opcional para la generación de claves RSA y obligatorio para la generación de claves DSA y CE. El atributo <code>keyparams</code> es necesario para la generación de claves DSA y CE e ignorado para la generación de claves RSA. <code>PQG</code> es sinónimo de <code>keyparams</code> . Es decir, usted puede especificar <code>keyparams="pqg-params"</code> o <code>pqg="pqg-params"</code> .</p>
-
-<p>Para las claves RSA, el parámetro <code>keyparams</code> no se utiliza (se ignora si está presente). El usuario puede tener una selección de la fuerza de la clave RSA. En la actualidad, el usuario tiene que elegir entre los grados "alto" (2048 bits) y "medio" (1024 bits).</p>
-
-<p>Para las claves DSA, el parámetro <code>keyparams</code> especifica los parámetros DSA PQG que se van a utilizar en el proceso de creación de llaves. El valor del parámetro <code>pqg</code> es en BASE64, DER codificado Dss-Parms como se especifica en el IETF <a class="link-ftp" href="ftp://ftp.rfc-editor.org/in-notes/rfc3279.txt">RFC 3279</a> . El usuario puede tener una variedad de tamaños de claves DSA, lo que permite al usuario elegir una de las dimensiones definidas en el estándar DSA.</p>
-
-<p>Para las claves CE, el parámetro <code>keyparams</code> especifica el nombre de la curva elíptica en la que será generada la clave. Normalmente es una cadena de la tabla en <a class="external" href="http://mxr.mozilla.org/mozilla-central/source/security/manager/ssl/src/nsKeygenHandler.cpp?mark=179-185,187-206,208-227,229-256#177" title="http://mxr.mozilla.org/mozilla-central/source/security/manager/ssl/src/nsKeygenHandler.cpp?mark=179-185 ,187-206 ,208-227 ,229-256 # 177">nsKeygenHandler.cpp</a> . (Tenga en cuenta que sólo un subconjunto de las curvas nombradas puede ser compatible con un navegador en particular.) Si la cadena parámetro <code>keyparams</code> no es el nombre de una curva reconocible, entonces una curva se elige de acuerdo a la fortaleza elegida por el usuario (bajo, medio, alto), utilizando la curva llamada " <code>secp384r1</code> " para alto, y la curva llamada" <code>secp256r1</code> " para claves de fuerza mediana. (Nota: la elección de la cantidad de fortalezas, los valores por defecto para cada fuerza, y la interfaz de usuario que el usuario se ofrece una opción, están fuera del alcance de esta especificación.)</p>
-
-<p>El elemento <code>keygen</code> sólo es válido dentro de un formulario HTML. Esto causará que algún tipo de selección se presentará al usuario para la selección del tamaño de la clave. La interfaz de usuario para la selección puede ser un menú, botones de radio, o posiblemente algo más. El navegador presentará varias fuerzas posibles. Actualmente, se ofrecen dos fuerzas, alta y media. Si el navegador del usuario está configurado para el soporte de hardware de cifrado (por ejemplo, "tarjetas inteligentes"), también puede dársele la opción al usuario de dónde generar la clave, es decir, si en una tarjeta inteligente o en el software y si se almacenan en el disco.</p>
-
-<p>Cuando el botón de enviar es pulsado, un par de claves del tamaño seleccionado se genera. La clave privada se cifra y se almacena en la base de datos de claves local.</p>
-
-<pre>   PublicKeyAndChallenge:: SEQUENCE {
-       SPKI SubjectPublicKeyInfo,
-       challenge IA5String
-   }
-   SignedPublicKeyAndChallenge:: SEQUENCE {
-       publicKeyAndChallenge PublicKeyAndChallenge,
-       signatureAlgorithm AlgorithmIdentifier,
-       firma BIT STRING
-   }</pre>
-
-<p>La clave pública y la cadena de desafío son codificadas con DER como PublicKeyAndChallenge, a continuación, firmados digitalmente con la clave privada para producir una SignedPublicKeyAndChallenge. El SignedPublicKeyAndChallenge es base64, y los datos ASCII finalmente se envía al servidor como un par de nombre/valor de formulario, donde el nombre es <var>name</var> especificado por el atributo <code>name</code> del elemento <code>keygen</code>. Si no hay cadena de desafío se proporciona, entonces será codificada como IA5String de longitud cero.</p>
-
-<p>He aquí un ejemplo de envío de formularios, como sería entregado a un programa CGI en el servidor HTTP:</p>
-
-<pre>   CommonName = John Doe + y e-mail = doe@foo.com y org = Foobar + + Informática Corp. y
-   orgunit = Oficina + de + la burocracia y la localidad Ciudad X = y = estado de California y en el país = EE.UU. y
-   key = MIHFMHEwXDANBgkqhkiG9w0BAQEFAANLADBIAkEAnX0TILJrOMUue% 2BPtwBRE6XfV% 0AWtKQbsshxk5ZhcUwcwyvcnIq9b82QhJdoACdD34rqfCAIND46fXKQUnb0mvKzQID% 0AAQABFhFNb3ppbGxhSXNNeUZyaWVuZDANBgkqhkiG9w0BAQQFAANBAAKv2Eex2n% 2FS% 0Ar 2F7iJNroWlSzSMtTiQTEB%%%% 2BADWHGj9u1xrUrOilq 2Fo2cuQxIfZcNZkYAkWP4DubqW 0Ai0% 2F% 3D% 2FrgBvmco</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<ul>
- <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380749" title="https://bugzilla.mozilla.org/attachment.cgi?id=380749">Sample form with RSA KEYGEN element</a></li>
- <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380750" title="https://bugzilla.mozilla.org/attachment.cgi?id=380750">Sample form with DSA KEYGEN element and PQG Parameters</a></li>
- <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380751" title="https://bugzilla.mozilla.org/attachment.cgi?id=380751">Sample form with DSA KEYGEN element but no PQG Parameters</a></li>
- <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=380752" title="https://bugzilla.mozilla.org/attachment.cgi?id=380752">Sample form with EC KEYGEN element</a></li>
-</ul>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Navegador</th>
-   <th>Versión más baja</th>
-  </tr>
-  <tr>
-   <td>Internet Explorer</td>
-   <td>---</td>
-  </tr>
-  <tr>
-   <td>Firefox (Gecko)</td>
-   <td>1.0 (1.0)</td>
-  </tr>
-  <tr>
-   <td>Opera</td>
-   <td>3.0</td>
-  </tr>
-  <tr>
-   <td>Safari (WebKit)</td>
-   <td>1.2 (125)</td>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<p>{{ languages ({"fr": "fr/HTML/Element/Keygen","en": "en/HTML/Element/Keygen"}) }}</p>
diff --git a/files/es/web/html/elemento/label/index.html b/files/es/web/html/elemento/label/index.html
deleted file mode 100644
index 3017c1ba36..0000000000
--- a/files/es/web/html/elemento/label/index.html
+++ /dev/null
@@ -1,138 +0,0 @@
----
-title: <label>
-slug: Web/HTML/Elemento/label
-translation_of: Web/HTML/Element/label
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El<em> </em><strong>Elemento </strong><strong style="line-height: 1.5;">HTML </strong><strong style="line-height: 1.5;"><code style="font-size: 14px;">&lt;label&gt; </code></strong><span style="line-height: 1.5;">representa una etiqueta para un elemento en una interfaz de usuario. Este puede estar asociado con un control ya sea mediante la utilizacion del atributo </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">for</span><span style="line-height: 1.5;">, o ubicando el control dentro del elemento </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">label</span><span style="line-height: 1.5;">. Tal control es llamado "el control etiquetado" del elemento </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">label</span><span style="line-height: 1.5;">.</span></p>
-
-<ul class="htmlelt">
- <li><dfn><a href="/en-US/docs/Web/HTML/Content_categories">Categorias</a></dfn> <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Interactive_content">contenido interactivo</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Form-associated_content">elemento de formulario asociado</a>, contenido palpable.</li>
- <li><dfn>Contenido permitido</dfn> <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Contenido de fraseo</a>, pero no otros componentes <code>label</code> ni otros elementos etiquetables a parte del de control ya etiquetado.</li>
- <li><dfn>Omision del Tag</dfn> {{no_tag_omission}}</li>
- <li><dfn>Elementos padre permitidos</dfn> Cualquier elemento que acepte el <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</li>
- <li><dfn>DOM interface</dfn> {{domxref("HTMLLabelElement")}}</li>
-</ul>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("accesskey")}} {{HTMLVersionInline("4")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Una tecla de atajo para acceder a este elemento desde el teclado.</dd>
- <dt>{{htmlattrdef("for")}}</dt>
- <dd>El ID del elemento de formulario etiquetable relacionado en el mismo documento que el elemento <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">label</span><span style="line-height: 1.5;">. El primer elemento en el documento con tal ID que coincida con el dispuesto en el atributo </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">for</span><span style="line-height: 1.5;"> será el control etiquetado para este elemento.</span></dd>
- <dd>
- <div class="note"><strong>Nota:</strong> Un elemento label puede contener ambos; El atributo for y el elemento de control anidado, siempre y cuando el atributo for <span style="line-height: 1.5em;">apunte al mismo elemento. </span></div>
- </dd>
- <dt>{{htmlattrdef("form")}} {{HTMLVersionInline("5")}}</dt>
- <dd>El formulario con el cual el label está asociado (su formulario dueño). El valor de este atributo debe ser un ID del elemento {{HTMLElement("form")}} en el mismo documento. Si este atributo no es especificado, este elemento <code>&lt;label&gt;</code> deberia ser descendiente de un elemento {{HTMLElement("form")}}. Este atributo permite ubicar el elemento label en cualquier lugar dentro del documento y no solo como descendiente de su respectivo formulario.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;!-- Un simple ejemplo de un label con el atributo for --&gt;
-&lt;label for="Name"&gt;Click me&lt;/label&gt;
-&lt;input type="text" id="Name" name="Name" /&gt;
-
-&lt;!-- Aun mas simple --&gt;
-&lt;label&gt;Click me &lt;input type="text" id="Name" name="Name" /&gt;&lt;/label&gt;</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p><label>Click me <input></label></p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#the-label-element', '&lt;label&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-label-element', '&lt;label&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.9.1', '&lt;label&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad">Compatibilidad</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-   <td>{{compatversionunknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Notes">Notes</h3>
-
-<h4 id="Click_events_in_nested_&lt;label>_elements">Click events in nested <code>&lt;label&gt;</code> elements</h4>
-
-<p>Starting with Gecko 8.0 {{geckoRelease("8.0")}}, a bubbling click event triggers at most one <code>&lt;label&gt;</code>, and the synthetic click event cannot trigger additional <code>&lt;label&gt;</code>s. In Gecko, a click event will still bubble up past a <code>&lt;label&gt;</code>, while in WebKit or Internet Explorer the click event will stop at the <code>&lt;label&gt;</code>. The behavior prior to Gecko 8.0 (triggering multiple <code>&lt;label&gt;</code>s) caused Firefox to stop responding (see {{bug(646157)}}).</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>Other form-related elements: {{HTMLElement("form")}}, {{HTMLElement("button")}}, {{HTMLElement("datalist")}}, {{HTMLElement("legend")}}, {{HTMLElement("select")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("option")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/legend/index.html b/files/es/web/html/elemento/legend/index.html
deleted file mode 100644
index 1aaaecced4..0000000000
--- a/files/es/web/html/elemento/legend/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: legend
-slug: Web/HTML/Elemento/legend
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/legend
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <span style="font-family: courier new;">&lt;legend&gt;</span> (leyenda) crea un título para un grupos los campos ({{ HTMLElement("fieldset") }}) de un formulario.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <span style="font-family: courier new;">&lt;legend&gt;</span> y <span style="font-family: courier new;">&lt;/legend&gt;</span> (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="/es/HTML/Elemento/Tipos_de_elementos#en_bloque" title="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a></dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>:</dd>
-</dl>
-
-<dl>
- <dd><strong>Debe contener</strong>: cero o más elementos <a href="/es/HTML/Elemento/Tipos_de_elementos#en_linea" title="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
- <dd><strong>Debe estar contenido por</strong>: debe ser el primer hijo de un elemento {{ HTMLElement("fieldset") }}</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>lista de clases separadas por espacios</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>uno de los siguientes:"ltr" o "rtl"</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">accesskey</code></td>
-   <td>un caracter</td>
-   <td>implícito</td>
-   <td>carácter de la tecla de acceso rápido</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">align</code></td>
-   <td>uno de los siguientes: "top", "bottom", "left" o "right"</td>
-   <td>implícito</td>
-   <td>alineación con relación al fieldset</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre>&lt;form&gt;
-  &lt;fieldset&gt;
-    &lt;legend&gt;Información Personal&lt;/legend&gt;
-    &lt;label for="nombre"&gt;Nombre:&lt;/label&gt;
-    &lt;input name="nombre" id="nombre" type="text" tabindex="1" /&gt;
-    &lt;label for="apellidos"&gt;Apellidos:&lt;/label&gt;
-    &lt;input name="apellidos" id="apellidos" type="text" tabindex="2" /&gt;
-  &lt;/fieldset&gt;
-
-  &lt;fieldset&gt;
-    &lt;legend&gt;Edad&lt;/legend&gt;
-    &lt;label&gt;&lt;input type="checkbox" tabindex="20" name="edad" value="20-39" /&gt; 20-39&lt;/label&gt;
-    &lt;label&gt;&lt;input type="checkbox" tabindex="21" name="edad" value="40-59" /&gt; 40-59&lt;/label&gt;
-    &lt;label&gt;&lt;input type="checkbox" tabindex="22" name="edad" value="60-79" /&gt; 60-79&lt;/label&gt;
-  &lt;/fieldset&gt;
-&lt;/form&gt;</pre>
diff --git a/files/es/web/html/elemento/li/index.html b/files/es/web/html/elemento/li/index.html
deleted file mode 100644
index 5c9755e528..0000000000
--- a/files/es/web/html/elemento/li/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: li
-slug: Web/HTML/Elemento/li
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/li
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <code style="color: darkblue;">li</code> del ingles <em>item list</em> o<em> elemento de lista</em> declara cada uno de los elementos de una lista.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;li&gt; y &lt;/li&gt; (la de cierre es opcional).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>:</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> o en <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">type</code></td>
-   <td>(disc|square|circle) (1|a|A|i|I)</td>
-   <td>implícito</td>
-   <td>estilo de numeración</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">value</code></td>
-   <td>'un número'</td>
-   <td>implícito</td>
-   <td>reinicializar número de secuencia</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre class="eval">&lt;ul&gt;
- &lt;li&gt;punto uno&lt;/li&gt;
- &lt;li&gt;punto dos&lt;/li&gt;
- &lt;li&gt;punto tres&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-
-<div class="highlight">
-<p>Se visualiza así:</p>
-
-<ul>
- <li>punto uno</li>
- <li>punto dos</li>
- <li>punto tres</li>
-</ul>
-</div>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/elemento/link/index.html b/files/es/web/html/elemento/link/index.html
deleted file mode 100644
index e604bf0f30..0000000000
--- a/files/es/web/html/elemento/link/index.html
+++ /dev/null
@@ -1,425 +0,0 @@
----
-title: link
-slug: Web/HTML/Elemento/link
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Metadatos
-  - Metadatos de documento HTML
-  - Referencia
-  - Todas_las_Categorías
-  - Web
-translation_of: Web/HTML/Element/link
----
-<p id="Summary">{{HTMLRef}}</p>
-
-<p>El <strong>elemento HTML <code>&lt;link&gt;</code></strong> especifica la relación entre el documento actual y un recurso externo. Los usos posibles de este elemento incluyen la definición de un marco relacional para navegación. Este elemento es más frecuentemente usado para enlazar hojas de estilos.</p>
-
-<div class="note">
-<p>El atributo {{htmlattrxref("rel", "link")}} puede ser establecido con muchos valores diferentes. Estos se encuentran <a href="/es/docs/Web/HTML/Tipos_de_enlaces">listados</a> en una página separada.</p>
-</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td>Contenido en metadatos. Si {{htmlattrxref("itemprop", "link")}} está presente: <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_dinámico">contenido dinámico</a> y <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a></td>
-  </tr>
-  <tr>
-   <th>Contenido permitido</th>
-   <td>Ninguno, es un {{Glossary("empty element", "elemento vacío")}}.</td>
-  </tr>
-  <tr>
-   <th>Omisión de etiqueta</th>
-   <td>Siendo un elemento vacío, la etiqueta de inicio debe estar presente y la etiqueta de cierre no debe estarlo</td>
-  </tr>
-  <tr>
-   <th>Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte elementos de metadatos. Si está presente el atributo {{htmlattrxref("itemprop", "link")}}: cualquier elemento que acepte <a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_textual_o_estático">contenido textual o estático</a>.</td>
-  </tr>
-  <tr>
-   <th>Interfaz DOM</th>
-   <td>{{domxref("HTMLLinkElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("charset")}}{{obsolete_inline}}</dt>
- <dd>Este atributo define la codificación de caracteres del recurso enlazado. El valor es un espacio y/o una lista de grupos de caracteres según se define en {{rfc(2045)}}, separados por coma. El valor predeterminado es <code>iso-8859-1</code>.
- <div class="note"><strong>Nota de uso:</strong> Este atributo es obsoleto y <strong>no debe ser usado por autores</strong>. Para conseguir su mismo efecto, se recomienda usar el encabezado HTTP <span style="font-family: courier new;">Content-Type</span> en el recurso enlazado.</div>
- </dd>
- <dt>{{htmlattrdef("crossorigin")}}</dt>
- <dd>Este atributo enumerado indica si se debe usar CORS cuando se solicite una imagen relacionada. Las <a href="/es/docs/Web/HTML/Imagen_con_CORS_habilitado">imágenes con CORS habilitado</a> pueden ser reutilizadas en el elemento {{HTMLElement("canvas")}} sin que estén <em>corruptas</em>.Los valores permitidos son:
- <dl>
-  <dt><code>"anonymous"</code></dt>
-  <dd>Una solicitud a un origen cruzado (esto es, con el encabezado HTTP <code>Origin:</code>) es realizada, pero no se envían credenciales (es decir, no se envían cookies, ni certificado X.509, ni datos de autenticación básica HTTP). Si el servidor no otorga credenciales al sitio de origen (por no enviar el encabezado HTTP <code>Access-Control-Allow-Origin:</code>) la imagen estará <em>corrupta</em>, y su uso estará restringido.</dd>
-  <dt><code>"use-credentials"</code></dt>
-  <dd>Una solicitud a un origen cruzado (esto es, con el encabezado HTTP <code>Origin:</code>) es realizada, enviando credenciales (es decir, se envían cookies, certificado y autenticación básica HTTP). Si el servidor no otorga credenciales al sitio de origen (a través del encabezado HTTP <code>Access-Control-Allow-Credentials:</code>), la imagen estará <em>corrupta</em>, y su uso estará restringido.</dd>
- </dl>
- Si no está presente, el recurso es obtenido sin una solicitud CORS (sin enviar el encabezado HTTP <code>Origin:</code>), previniendo así su uso no corrupto en elementos {{HTMLElement('canvas')}}. Si se introduce un valor no permitido, se maneja como si usara el valor <strong>anonymous</strong>. Véase <a href="/es/docs/Web/HTML/Atributos_de_configuracion_CORS">atributos de configuración CORS</a> para más información.</dd>
- <dt>{{htmlattrdef("disabled")}} {{Non-standard_inline}}</dt>
- <dd>Este atributo es usado para deshabilitar una relación de enlace. Agregando programación, este atributo puede ser usado para habilitar o deshabilitar la relación con distintas hojas de estilos.
- <div class="note">
- <p><strong>Nota:</strong> Aunque no hay atributo <code>disabled</code> en el estándar de HTML, <strong>sí</strong> hay un atributo <code>disabled</code> en el objeto DOM <code>HTMLLinkElement</code>.</p>
-
- <p>El uso de <code>disabled</code> como atributo HTML no es estándar, y solo puede ser usado en algunos navegadores (<a href="https://www.w3.org/Bugs/Public/show_bug.cgi?id=27677">W3 #27677</a>). <strong style="font-weight: bold;">No debe usarse</strong>. Para lograr un efecto similar, se puede usar una de las siguientes técnicas:</p>
-
- <ul>
-  <li>Si el atributo <code>disabled</code> fue añadido directamente al elemento en la página, no incluya el elemento {{HTMLElement("link")}} en vez de eso;</li>
-  <li>Establezca la <strong>propiedad</strong> <code>disabled</code> del objeto DOM <code>StyleSheet</code> vía programación.</li>
- </ul>
- </div>
- </dd>
- <dt>{{htmlattrdef("href")}}</dt>
- <dd>Este atributo especifica la {{glossary("URL")}} del recurso enlazado. La URL debe ser absoluta o relativa.</dd>
- <dt>{{htmlattrdef("hreflang")}}</dt>
- <dd>Este atributo indica el idioma del recurso enlazado. Es meramente informativo. Los valores permitidos son determinados por la <a href="http://www.ietf.org/rfc/bcp/bcp47.txt">BCP47</a>. Se recomienda usar este atributo solamente si el atributo {{htmlattrxref("href", "a")}} está presente.</dd>
- <dt>{{htmlattrdef("integrity")}} {{experimental_inline}}</dt>
- <dd>Contiene metadatos en línea, el valor criptográfico codificado a base 64 de un recurso (archivo) que se le está indicando al navegador que obtenga, el cual puede ser utilizado por el agente usuario para verificar si el recurso obtenido ha sido entregado libre de manipulaciones inesperadas. Véase <a href="/es/docs/Web/Security/Subresource_Integrity">Integridad de subrecursos</a>.</dd>
- <dt>{{htmlattrdef("media")}}</dt>
- <dd>Este atributo especifica el tipo de medio al que aplica el recurso enlazado. Su valor debe ser un <a href="/en-US/docs/CSS/Media_queries">media query</a>. Este atributo es usado principalmente cuando se enlaza a una hoja de esetilos externa en la que se le permita al agenete usuario seleccionar la que mejor se adapte al dispositivo sobre el que se ejecuta.
- <div class="note"><strong>Notas de uso: </strong>
- <ul>
-  <li>En HTML 4, esto puede ser solamente una lista simple de literales de medios separadas por espacio, es decir, <a href="/es/docs/Web/CSS/@media">tipos de medios y grupos</a>, donde se definían valores para este atributo, tales como <code>print</code>, <code>screen</code>, <code>aural</code>, <code>braille</code>. HTML5 extiende esto a cualquier clase de <a href="/es/docs/CSS/Media_queries">media queries</a>, los cuales son un superconjunto de los valores permitidos de HTML 4.</li>
-  <li>Los navegadores que no soporten los <a href="/es/docs/CSS/Media_queries">Media Queries de CSS3</a> no necesariamente reconocerán el enlace adecuado; no olvide establecer enlaces de <em>fallback</em>, usando los conjuntos de media queriese definidos en HTML 4.</li>
- </ul>
- </div>
- </dd>
- <dt>{{htmlattrdef("methods")}} {{Non-standard_inline}}</dt>
- <dd>El valor de este atributo provee información acerca de las funciones que podrían ser ejecutadas en un objeto. Los valores son generalmente indicados por el protocolo HTTP cuando se usa, pero podrían (por razones similares a las del atributo <strong>title</strong>) ser usados para incluir información de ayuda por adelantado en el enlace. Por ejemplo, el navegador podría elegir una representación diferente de un enlace como una función de los métodos especificados; algo que es buscable podría tener un ícono diferente, o un enlace externo podría dibujar una indicación de que se dejará el sitio actual. Este atributo no está bien comprendido, ni soportado, aun por el navegador en el que se definió, Internet Explorer 4. Véase <a href="http://msdn.microsoft.com/en-us/library/ms534168%28VS.85%29.aspx" rel="external nofollow">Propiedades de métodos (MSDN)</a>.</dd>
- <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt>
- <dd>Una cadena de texto que indica el referente a usar cuando se obtenga el recurso:
- <ul>
-  <li><code>'no-referrer'</code> significa que el encabezado {{HTTPHeader("Referer")}} no será enviado.</li>
-  <li><code>'no-referrer-when-downgrade'</code> significa que no se enviará el encabezado {{HTTPHeader("Referer")}} cuando se navegue a un origen sin TLS (HTTPS). Este es el comportamiento predeterminado del agente usuario, si no se especifica una política distinta.</li>
-  <li><code>'origin'</code> significa que el referente será el origen de la página, qué es básicamente el esquema, host y puerto.</li>
-  <li><code>'origin-when-cross-origin'</code> significa que la navegación a otros orígenes estará limitada por el esquema, el host y el puerto, mientras que navegar dentro del mismo origen incluirá la ruta del referente </li>
-  <li><code>'unsafe-url'</code> significa que el referente incluirá el origen y ruta (sin el fragmento, contraseña o nombre de usuario). Este caso es inseguro porque permite filtrar orígenes y rutas desde recursos protegidos por TLS a orígenes inseguros.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("rel")}}</dt>
- <dd>Este atributo indica la relación del documento enlazado con el actual. El atributo debe ser una lista de <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipos de enlaces</a> separados por espacio. El uso más común para este atributo es especificar el enlace a una hoja de estilos externa: el atributo <strong>rel</strong> se establece con valor <code>stylesheet</code>, y el atributo <strong>href</strong> se establece con la URL de la hoja de estilos externa para dar formato a la página. WebTV también soporta el uso del valor <code>next</code> en <strong>rel</strong> para precargar la siguiente página en una serie de documentos.</dd>
- <dt>{{htmlattrdef("rev")}}{{obsolete_inline}}</dt>
- <dd>El valor de este atributo muestra la relación del documento actual al documento enlazado, como se define en el atributo {{htmlattrxref("href", "link")}}. En consecuencia, este atributo define la relación inversa, en comparación al valor del atributo <strong>rel</strong>. Los <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipos de enlace</a> para este atributo son similares a los disponibles para {{htmlattrxref("rel", "link")}}.
- <div class="note"><strong>Notas de uso:</strong> Este atributo es obsoleto en HTML5. <strong>No debe usarse</strong>. Para lograr este efecto, use el atributo {{htmlattrxref("rel", "link")}} con el <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipo de enlace</a> contrario, por ejemplo, <span style="font-family: courier new;">made</span> debe reemplazar a <span style="font-family: courier new;">author</span>. Además, este atributo no significa <em>revision</em> y no debe ser usado con un número de versión, que es desafortunadamente el caso de muchos sitios.</div>
- </dd>
- <dt>{{htmlattrdef("sizes")}}</dt>
- <dd>Este atributo define los tamaños de los íconos para medios visuales contenidos en el recurso. Debe estar presente solo si el atributo {{htmlattrxref("rel","link")}} contiene el <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipo de enlace</a> <span style="font-family: courier new;">icon</span>. Puede tener los siguientes valores:
- <ul>
-  <li><code>any</code>, significa que el ícono puede ser escalado a cualquier tamaño, ya que está en un formato vectorial, como <code>image/svg+xml</code>.</li>
-  <li>una lista de tamaños separados por espacios en blanco, cada uno en formato <span style="font-family: courier new;"><em>&lt;anchura en píxeles&gt;</em>x<em>&lt;altura en píxeles&gt;</em></span> or <span style="font-family: courier new;"><em>&lt;anchura en píxeles&gt;</em>X<em>&lt;altura en píxeles&gt;</em></span>. Cada uno de estos tamaños debe estar contenido en el recurso.</li>
- </ul>
-
- <div class="note"><strong>Notas de uso: </strong>
-
- <ul>
-  <li>La mayoría de los formatos de ícono solo permiten almacenar un ícono; por lo que la mayoría de las ocasiones, el atributo {{htmlattrxref("sizes")}} contiene solamente una entrada. El formato ICO de Microsoft lo hace, así como el formato ICN de Apple. Siendo ICO más común, es el que se recomienda usar.</li>
-  <li>iOS de Apple no soporta este atributo, por lo que iPhone y iPad de Apple usan <a href="/es/docs/Web/HTML/Tipos_de_enlaces">tipos de enlaces</a> especiales, no estándares, para definir los íconos a usar como Web Clip o contenedor de inicio: <span style="font-family: courier new;">apple-touch-icon</span> y <span style="font-family: courier new;">apple-touch-startup-icon</span>.</li>
- </ul>
- </div>
- </dd>
- <dt>{{htmlattrdef("target")}}{{Non-standard_inline}}</dt>
- <dd>Define el nombre del frame o ventana que tendrá la relación de enlace o que mostrará la representación de algun recurso enlazado.</dd>
- <dt>{{htmlattrdef("title")}}</dt>
- <dd>El atributo <code>title</code> tiene semántica particular para el elemento <code>&lt;link&gt;</code>. Cuando se usa en una etiqueta <code>&lt;link rel="stylesheet"&gt;</code>, define una <a href="/es/docs/Web/CSS/Alternative_style_sheets">hoja de estilos preferida o alternativa</a>. El uso incorrecto de este atributo podría <a href="/es/docs/Correctly_Using_Titles_With_External_Stylesheets">provocar que la hoja de estilos sea ignorada</a>.</dd>
- <dt>{{htmlattrdef("type")}}</dt>
- <dd>Este atributo es usado para definir el tipo de contenido al que se enlaza. El valor del atributo debe ser un tipo MIME, como <strong>text/html</strong>, <strong>text/css</strong>. El uso común de este atributo es para definir el tipo de hoja de estilos enlazada, y el valor más común es <strong>text/css</strong>, el cual indica un formato de Hoja de Estilos en Cascada.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Incluyendo_una_hoja_de_estilos">Incluyendo una hoja de estilos</h3>
-
-<p>Para incluir una hoja de estilos en una página, use la siguiente sintaxis:</p>
-
-<pre class="brush: html">&lt;link href="style.css" rel="stylesheet"&gt;
-</pre>
-
-<h3 id="Proporcionando_hojas_de_estilos_alternativas">Proporcionando hojas de estilos alternativas</h3>
-
-<p>También se pueden especificar <a href="/es/docs/Web/CSS/Alternative_style_sheets">hojas de estilos alternativas</a>.</p>
-
-<p>El usuario puede elegir cuál hoja de estilos usar, seleccionándola desde el menú Ver &gt; Estilo de Página. Esto proporciona una manera en que los usuarios pueden ver múltiples versiones de una misma página.</p>
-
-<pre class="brush: html">&lt;link href="default.css" rel="stylesheet" title="Default Style"&gt;
-&lt;link href="fancy.css" rel="alternate stylesheet" title="Fancy"&gt;
-&lt;link href="basic.css" rel="alternate stylesheet" title="Basic"&gt;
-</pre>
-
-<h3 id="Eventos_de_carga_de_hojas_de_estilos">Eventos de carga de hojas de estilos</h3>
-
-<p>Se puede determinar cuando una hoja de estilos fue cargada estableciendo la ejecución de un evento <code>load</code> en el elemento; de forma similar, se puede detectar si ocurrió un error al procesar una hoja de estilos, observando el evento <code>error</code>:</p>
-
-<pre class="brush: html">&lt;script&gt;
-function sheetLoaded() {
-  // Hacer algo interesante; la hoja de estilos ha sido cargada
-}
-
-function sheetError() {
-  alert("¡Ocurrió un error al cargar la hoja de estilos!");
-}
-&lt;/script&gt;
-
-&lt;link rel="stylesheet" href="mystylesheet.css" onload="sheetLoaded()" onerror="sheetError()"&gt;
-</pre>
-
-<div class="note"><strong>Nota:</strong> El evento <code>load</code> se dispara una vez que la hoja de estilos y todo su contenido importado ha sido cargado y procesado, e inmediatamente antes de que los estilos sean aplicados al contenido.</div>
-
-<h2 id="Notas">Notas</h2>
-
-<ul>
- <li>Una etiqueta <code>&lt;link&gt;</code> puede ocurrir solo en el elemento head; sin embargo, pueden haber múltiples ocurrencias de <code>&lt;link&gt;</code>.</li>
- <li>HTML 3.2 define solamente los atributos <strong>href</strong>, <strong>rel</strong>, <strong>rev</strong>, y <strong>title</strong> para el elemento link.</li>
- <li>HTML 2 define los atributos <strong>href</strong>, <strong>methods</strong>, <strong>rel</strong>, <strong>rev</strong>, <strong>title</strong>, y <strong>urn</strong> para el elemento <code>&lt;link&gt;</code>. Los atributos <strong>methods</strong> y <strong>urn</strong> fueron eliminados más adelante de las especificaciones.</li>
- <li>Las especificaciones HTML y XHTML definen controladores de evento para el elemento <code>&lt;link&gt;</code>, pero no está claro cómo serían usados.</li>
- <li>En XHTML 1.0, elementos vacíos como <code>&lt;link&gt;</code> requieren una diagonal de cierre: <code>&lt;link /&gt;</code>.</li>
-</ul>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Subresource Integrity', '#htmlscriptelement', '&lt;script&gt;')}}</td>
-   <td>{{Spec2('Subresource Integrity')}}</td>
-   <td>Se añade el atributo <code>integrity</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-link-element', '&lt;link&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No hay cambios desde la versión anterior</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-link-element', '&lt;link&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Se añaden los atributos <code>crossorigin</code> y <code>sizes</code>; valores extendidos para <code>media</code> para cualquier media query; se añaden numerosos valores para <code>rel</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/links.html#h-12.3', '&lt;link&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Hojas de estilos alternativas</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.9")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>disabled</code> {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>methods</code> {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>sizes</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}} {{bug("441770")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Eventos <code>load</code> y <code>error</code></td>
-   <td>
-    <p>19 (Webkit: 535.23)</p>
-
-    <p>({{webkitbug(38995)}})</p>
-   </td>
-   <td>{{CompatGeckoDesktop("9.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>11.60</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>crossorigin</code></td>
-   <td>{{CompatChrome("25")}}</td>
-   <td>{{CompatGeckoDesktop("18.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatOpera("15")}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>integrity</code></td>
-   <td>{{CompatChrome(45.0)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-  </tr>
-  <tr>
-   <td>Atributo <code>referrerpolicy</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("50.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Hojas de estilos alternativas</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>disabled</code> {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>methods</code> {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>4.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>sizes</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}} {{bug("441770")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Eventos <code>load</code> y <code>error</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("9.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>crossorigin</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("18.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>integrity</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(45.0)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(45.0)}}</td>
-  </tr>
-  <tr>
-   <td>Atributo <code>referrerpolicy</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("50.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] {{WebKitBug(148363)}} da seguimiento a la implementación en Webkit de Integridad de Subrecursos (lo cual incluye el atributo <code>integrity</code>).</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="http://pieisgood.org/test/script-link-events/">Tabla de compatibilidad de eventos en &lt;script&gt; y &lt;link&gt;, por Ryan Grove</a></li>
-</ul>
diff --git a/files/es/web/html/elemento/main/index.html b/files/es/web/html/elemento/main/index.html
deleted file mode 100644
index fd3fd6c917..0000000000
--- a/files/es/web/html/elemento/main/index.html
+++ /dev/null
@@ -1,151 +0,0 @@
----
-title: <main>
-slug: Web/HTML/Elemento/main
-translation_of: Web/HTML/Element/main
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El <strong>elemento</strong> <strong>HTML <code>&lt;main&gt;</code> </strong>representa el contenido principal del {{HTMLElement("body")}} de un documento o aplicación. El área principal del contenido consiste en el contenido que está directamente relacionado, o se expande sobre el tema central de un documento o la funcionalidad central de una aplicación. Este contenido debe ser único al documento, excluyendo cualquier contenido que se repita a través de un conjunto de documentos como barras laterales, enlaces de navegación, información de derechos de autor, logos del sitio y formularios de búsqueda (a menos, claro, que la función principal del documento sea un formulario de búsqueda).</p>
-
-<div class="note">
-<p><strong>Nota:</strong> <strong>no debe haber</strong> más de un elemento <code>&lt;main&gt;</code> en un documento, y este <strong>no debe ser</strong> descendiente de un elemento  {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, o {{HTMLElement("nav")}}.</p>
-</div>
-
-<ul class="htmlelt">
- <li><dfn><a href="/en-US/docs/Web/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></dfn><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>, palpable content.</li>
- <li><dfn>Contenido permitido</dfn> <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>.</li>
- <li><dfn>Omisión de etiquetas</dfn> Ninguna; ambas etiqueta inical y de fin son obligatorias.</li>
- <li><dfn>Elementos padres permitidos</dfn> Cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">flow content</a>, pero no debe ser un descendiente de un elemento {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, o {{HTMLElement("nav")}}.</li>
- <li><dfn>Interfaz DOM</dfn> {{domxref("HTMLElement")}}</li>
-</ul>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento solo incluye  </span><a href="/en-US/docs/Web/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributos globales.</a></p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html">&lt;!-- other content --&gt;
-
-<span class="highlight">&lt;main&gt;</span>
-  &lt;h1&gt;Apples&lt;/h1&gt;
-  &lt;p&gt;The apple is the pomaceous fruit of the apple tree.&lt;/p&gt;
-
-  &lt;article&gt;
-    &lt;h2&gt;Red Delicious&lt;/h2&gt;
-    &lt;p&gt;These bright red apples are the most common found in many
-    supermarkets.&lt;/p&gt;
-    &lt;p&gt;... &lt;/p&gt;
-    &lt;p&gt;... &lt;/p&gt;
-  &lt;/article&gt;
-
-  &lt;article&gt;
-    &lt;h2&gt;Granny Smith&lt;/h2&gt;
-    &lt;p&gt;These juicy, green apples make a great filling for
-    apple pies.&lt;/p&gt;
-    &lt;p&gt;... &lt;/p&gt;
-    &lt;p&gt;... &lt;/p&gt;
-  &lt;/article&gt;
-
-<span class="highlight">&lt;/main&gt;</span>
-
-&lt;!-- other content --&gt;</pre>
-
-<h2 id="Specifications" name="Specifications">Sobre Accesibilidad</h2>
-
-<p>Algunos lectores de pantalla reconocen la etiqueta <code>main</code> y proveen un atajo para que el usuario pueda saltar directamente al contenido de esta etiqueta sin tener que pasar por el resto.</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<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('HTML WHATWG', '#the-main-element', '&lt;main&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Eliminada la restricción acerca de usar  <code>&lt;main&gt;</code> como un descendente del elemento {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, o {{HTMLElement("nav")}}.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'grouping-content.html#the-main-element', '&lt;main&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Sin cambios desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-main-element', '&lt;main&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad entre navegadores</h2>
-
-<p>Como una caracterisca nueva propuesta para HTML, el elemento <code>&lt;main&gt;</code> no está todavía ampliamente soportado. Es sumamente recomendable añadir el rol ARIA <code>"main"</code> a cualquier elemento <code>&lt;main&gt;</code>:</p>
-
-<pre class="brush: html">&lt;main role="main"&gt;
-  ...
-&lt;/main&gt;
-</pre>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>
-    <p>Característica</p>
-   </th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>Chrome 26</td>
-   <td>{{ CompatGeckoDesktop("21.0") }}</td>
-   <td>{{CompatNo()}}</td>
-   <td>{{CompatNo()}}</td>
-   <td>{{CompatNo()}} but in tests builds since WebKit r140374</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo()}}</td>
-   <td>{{ CompatGeckoMobile("21.0") }}</td>
-   <td>{{CompatNo()}}</td>
-   <td>{{CompatNo()}}</td>
-   <td>{{CompatNo()}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Basic structural elements: {{HTMLElement("html")}}, {{HTMLElement("head")}}, {{HTMLElement("body")}}</li>
- <li>Section-related elements: {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("footer")}}, {{HTMLElement("header")}}, or {{HTMLElement("nav")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/map/index.html b/files/es/web/html/elemento/map/index.html
deleted file mode 100644
index 1a87193ffc..0000000000
--- a/files/es/web/html/elemento/map/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: map
-slug: Web/HTML/Elemento/map
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/map
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><span class="comment">descripción de uno o dos párrafos</span></p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;map&gt; y &lt;/map&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque"> En bloque </a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#especial"> Elemento especial</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque </a>, o elementos <a href="es/HTML/Elemento/area">area</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">Valor</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title </code></td>
-   <td>Texto</td>
-   <td>Implícito</td>
-   <td>Título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style </code></td>
-   <td>Declaraciones de estilo</td>
-   <td>Implícito</td>
-   <td>Información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id </code></td>
-   <td>Un 'nombre'</td>
-   <td>Implícito</td>
-   <td>Identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class </code></td>
-   <td>Lista de clases CSS</td>
-   <td>implícito</td>
-   <td>Identificador a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir </code></td>
-   <td>Uno de los siguientes: "ltr" o "rtl"</td>
-   <td>Implícito</td>
-   <td>Dirección del texto.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang </code></td>
-   <td>Código de idioma</td>
-   <td>Implícito</td>
-   <td>Información sobre el idioma.</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">name </code></td>
-   <td>Un 'nombre'</td>
-   <td>Necesario</td>
-   <td>Sirve de referencia al atributo usemap</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">Valor</th>
-   <th>Descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">  &lt;&gt;
-
-
-
-  &lt;/&gt;
-</pre>
-
-<p> </p>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#edef-MAP"><strong>map</strong> en la especificación</a> de html 4.01.</li>
-</ul>
-
-<p><span class="comment">secciones futuras: == Soporte de los navegadores == == Valores por defecto y visualización en Firefox ==</span></p>
-
-<div class="note">
-<p>Este documento está siendo editado, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en la elaboración de este documento? Para saber como hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/mark/index.html b/files/es/web/html/elemento/mark/index.html
deleted file mode 100644
index 38ed980e3a..0000000000
--- a/files/es/web/html/elemento/mark/index.html
+++ /dev/null
@@ -1,142 +0,0 @@
----
-title: '<mark>: el elemento de resaltado de texto'
-slug: Web/HTML/Elemento/mark
-tags:
-  - HTML
-  - HTML5
-  - 'HTML:Elemento'
-  - mark
-  - para_revisar
-translation_of: Web/HTML/Element/mark
----
-<div>{{HTMLRef}}</div>
-
-<p>El <strong> Elemento HTML Mark <code>&lt;mark&gt;</code></strong> representa un texto <strong>marcado</strong> o <strong>resaltado</strong> como referencia o anotación, debido a su relevancia o importancia en un contexto particular.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/mark.html", "tabbed-shorter")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row">Categorías de contenido</th>
-   <td>Contenido de flujo,  contenido de párrafo,  contenido palpable</td>
-  </tr>
-  <tr>
-   <th>Contenido permitido</th>
-   <td><a href="/en/Dom/Content_categories#Phrasing_content" title="en/Dom/Content categories#Phrasing content">Contenido estático</a></td>
-  </tr>
-  <tr>
-   <th>Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th>Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en/Dom/Content_categories#Phrasing_content" title="en/Dom/Content categories#Phrasing content">contenido estático</a></td>
-  </tr>
-  <tr>
-   <th>Roles ARIA permitidos</th>
-   <td>Cualquiera</td>
-  </tr>
-  <tr>
-   <th>Documento normativo</th>
-   <td><a class="external" href="http://www.google.com/url?q=http%3A%2F%2Fwww.whatwg.org%2Fspecs%2Fweb-apps%2Fcurrent-work%2Fmultipage%2Ftext-level-semantics.html%23the-mark-element&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNFWrrJ-Y17m5GxNva7WqE-i6zuWcA" rel="external nofollow">HTML 5, sección 4.6.17</a></td>
-  </tr>
-  <tr>
-   <th>DOM interface</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento no tiene atributos que no sean los <a class="new " href="https://developer.mozilla.org/es/docs/Web/HTML/Atributos_Globales" rel="internal">atributos globales</a>, comunes a todos los elementos.</p>
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<ul>
- <li>En una cita ({{HTMLElement("q")}})  o en otro bloque ({{HTMLElement("blockquote")}}), generalmente indica texto que es de especial interés pero que no está destacado en el material de origen, o material que necesita especial escrutinio, aunque el autor original no lo considerase importante.</li>
- <li>Por otro lado, <code>&lt;mark&gt;</code> indica una parte del contenido del documento que probablemente sea relevante para el usuario. Por ejemplo, se puede utilizar en una página que muestra los resultados de búsqueda para resaltar cada uno de estos por palabra.</li>
- <li>No uses el elemento <code>&lt;mark&gt;</code> para resaltado de sintaxis; usa el elemento {{ HTMLElement("span") }}  para este fin.</li>
-</ul>
-
-<div class="blockIndicator note">
-<p>No se debe confundir el elemento <code><span style="font-family: Courier New;">&lt;mark&gt;</span></code> con el elemento {{ HTMLElement("strong") }}. El elemento {{ HTMLElement("strong") }} se utiliza para denotar intervalos de texto de especial <em>importancia,</em> mientras que el elemento <code>&lt;mark&gt;</code> se utiliza para denotar intervalos de texto de especial <em>relevancia.</em></p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Marcar_texto_de_interés">Marcar texto de interés</h3>
-
-<p>En este ejemplo, &lt;mark&gt; se utiliza para resaltar texto en una cita que es de particular insterés para el usuario.</p>
-
-<pre class="brush: html">&lt;blockquote&gt;
-  It is a period of civil war. Rebel spaceships, striking from a
-  hidden base, have won their first victory against the evil
-  Galactic Empire. During the battle, &lt;mark&gt;Rebel spies managed
-  to steal secret plans&lt;/mark&gt; to the Empire’s ultimate weapon,
-  the DEATH STAR, an armored space station with enough power to
-  destroy an entire planet.
-&lt;/blockquote&gt;</pre>
-
-<p>El resultado sería:</p>
-
-<p>{{EmbedLiveSample("Marking_text_of_interest", 650, 130)}}</p>
-
-<h3 id="Identificando_fragmentos_sensibles_al_contexto">Identificando fragmentos sensibles al contexto</h3>
-
-<p>Este ejemplo demuestra el uso de <code>&lt;mark&gt;</code> para marcar resultados de búsqueda en el fragmento.</p>
-
-<pre class="brush: html">&lt;p&gt;It is a dark time for the Rebellion. Although the Death
-Star has been destroyed, &lt;mark class="match"&gt;Imperial&lt;/mark&gt;
-troops have driven the Rebel forces from their hidden base and
-pursued them across the galaxy.&lt;/p&gt;
-
-&lt;p&gt;Evading the dreaded &lt;mark class="match"&gt;Imperial&lt;/mark&gt;
-Starfleet, a group of freedom fighters led by Luke Skywalker
-has established a new secret base on the remote ice world of
-Hoth.&lt;/p&gt;</pre>
-
-<p>Para ayudar a distinguir el uso de <code>&lt;mark&gt;</code> en los resultados de búsqueda de otro uso potencial, este ejemplo aplica la clase "match" a cada coincidencia.</p>
-
-<p>El resultado se vería:</p>
-
-<p>{{EmbedLiveSample("Identifying_context-sensitive_passages", 650, 130)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'text-level-semantics.html#the-mark-element', '&lt;mark&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-mark-element', '&lt;mark&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-
-
-<p>{{Compat("html.elements.mark")}}</p>
-
-<h2 id="Consulta_también">Consulta también</h2>
-
-<ul>
- <li>Otros <a href="/en/HTML/Text-level_semantics_elements" title="en/HTML/Text-level semantics elements">elementos de la semántica a nivel de texto</a> : {{ HTMLElement("a") }}, {{ HTMLElement("em") }}, {{ HTMLElement("strong") }}, {{ HTMLElement("cite") }}  , {{ HTMLElement("q") }} , {{ HTMLElement("dfn") }}, {{ HTMLElement("abbr") }}, {{ HTMLElement("time") }} , {{ HTMLElement("code") }} ,{{ HTMLElement("var") }}, {{ HTMLElement("samp") }} ,{{ HTMLElement("kbd") }} ,{{ HTMLElement("sub") }} , {{ HTMLElement("sup") }} ,{{ HTMLElement("i") }} , {{ HTMLElement("b") }}, {{ HTMLElement("mark") }} , {{ HTMLElement("ruby") }} , {{ HTMLElement("rp") }} , {{ HTMLElement("rt") }} , {{ HTMLElement("bdo") }}, {{ HTMLElement("span") }} , {{ HTMLElement("br") }} , {{ HTMLElement("wbr") }}.</li>
-</ul>
diff --git a/files/es/web/html/elemento/marquee/index.html b/files/es/web/html/elemento/marquee/index.html
deleted file mode 100644
index 5eeeec12bf..0000000000
--- a/files/es/web/html/elemento/marquee/index.html
+++ /dev/null
@@ -1,207 +0,0 @@
----
-title: <marquee>
-slug: Web/HTML/Elemento/marquee
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-  - etiqueta
-  - marquee
-  - marquesina
-  - obsoleta
-translation_of: Web/HTML/Element/marquee
----
-<div>{{HTMLRef}}</div>
-
-<div>{{obsolete_header}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La etiqueta html <code>&lt;marquee&gt;</code> se utiliza para insertar un area de texto en movimiento. También se la conoce como marquesina.</p>
-
-<h2 id="Atributos">Atributos</h2>
-
-<dl>
- <dt>{{htmlattrdef("behavior")}}</dt>
- <dd>Establece cómo se desplazará el texto en la etiqueta marquee. Los valores posibles son scroll, slide, y alternate. Si no hay un valor especificado, el valor por defecto establecido es scroll.</dd>
- <dd>Scroll: Hara que lo que este en la marquesina se mueva de derecha a izquierda, de manera ininterrumpida.<br>
- Slide: Una vez que completa el recorrido de derecha a izquierda(por defecto) se detiene.<br>
- Alternate: Se movera de una esquina a la otra, dando el efecto de rebote.</dd>
- <dt>{{htmlattrdef("bgcolor")}}</dt>
- <dd>Establece el color de fondo, puede utilizarse el nombre, o su  valor hexadecimal.</dd>
- <dt>{{htmlattrdef("direction")}}</dt>
- <dd>Establece la dirección en la que el texto contenido se desplazará. Los valores posibles son left (para moverse hacia la izquierda), right (para moverse a la derecha), up (hacia arriba) y down (hacia abajo). Si no se especifica un valor, por defecto será left.</dd>
- <dt>{{htmlattrdef("height")}}</dt>
- <dd>Establece la altura de la etiqueta en pixeles, o en un valor porcentual.</dd>
- <dt>{{htmlattrdef("hspace")}}</dt>
- <dd>Establece el margen horizontal.</dd>
- <dt>{{htmlattrdef("loop")}}</dt>
- <dd>Establece el número de veces que la marquesina realizará el desplazamiento. Sino se especifica esta propiedad, por defecto es -1, lo que quiere decir que la marquesina se desplazará continuamente.</dd>
- <dt>{{htmlattrdef("scrollamount")}}</dt>
- <dd>Establece el valor de movimiento para cada intervalo en pixeles. Por defecto su valor es 6.</dd>
- <dt>{{htmlattrdef("scrolldelay")}}</dt>
- <dd>Establece el intervalo entre cada desplazamiento, en milisegundos. El valor por defecto es 85. Nota: Cualquier valor inferior a 60 será ignorado, (puesto que el valor minimo es 60) y se establecerá 60 en su lugar. Salvo que se especifique<code> truespeed.</code></dd>
- <dt>{{htmlattrdef("truespeed")}}</dt>
- <dd>Por defecto, si los valores de <code>scrolldelay son inferiores a 60 serán ignorados. Pero si truespeed está presente, esos valores inferiores a 60 serán aceptados.</code></dd>
- <dt>{{htmlattrdef("vspace")}}</dt>
- <dd>Establece el margen vertical en pixeles o en un valor porcentual.</dd>
- <dt>{{htmlattrdef("width")}}</dt>
- <dd>Establece el ancho de la etiqueta en pixeles o un valor porcentual.</dd>
-</dl>
-
-<h2 id="Event_handlers" name="Event_handlers">Controladores de eventos</h2>
-
-<dl>
- <dt>{{htmlattrdef("onbounce")}}</dt>
- <dd>Este evento se lanza cuando la marquesina llegó al final del desplazamiento. Ésto solo se activa cuando el atributo <code>behavior </code>está establecido en <code>alternate</code>.</dd>
- <dt>{{htmlattrdef("onfinish")}}</dt>
- <dd>Este evento se lanza cuando la marquesina repitió el desplazamiento la cantidad de veces establecidas en el atributo <code>loop</code>. El evento se lanza solo si el atributo <code>loop</code> tiene un valor mayor a 0.</dd>
- <dt>{{htmlattrdef("onstart")}}</dt>
- <dd>Este evento se lanza cuando la marquesina comienza su desplazamiento.</dd>
-</dl>
-
-<h2 id="Methods" name="Methods">Métodos</h2>
-
-<dl>
- <dt>start</dt>
- <dd>Comienza el desplazamiento de la marquesina.</dd>
- <dt>stop</dt>
- <dd>Para el desplazamiento de la marquesina</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;marquee&gt;Este texto se mueve de derecha a izquierda&lt;/marquee&gt;
-
-&lt;marquee direction="up"&gt;Este texto se mueve de abajo hacia arriba&lt;/marquee&gt;
-
-&lt;marquee direction="down" width="250" height="200" behavior="alternate" style="border:solid"&gt;
-  &lt;marquee behavior="alternate"&gt;
-    Este texto rebotará dentro de la marquesina.
-  &lt;/marquee&gt;
-&lt;/marquee&gt;</pre>
-
-<p>{{EmbedLiveSample("Examples", 600, 450)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'obsolete.html#the-marquee-element-2', '&lt;marquee&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Marcada como obsoleta en favor de CSS. Comportamiento esperado definido por razones de retrocompatibilidad.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'obsolete.html#the-marquee-element-0', '&lt;marquee&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Marcada como obsoleta en favor de CSS. Comportamiento esperado definido por razones de retrocompatibilidad.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>2.0</td>
-   <td>7.2</td>
-   <td>1.2</td>
-  </tr>
-  <tr>
-   <td><code>atributo truespeed</code> </td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("1.9")}}</td>
-   <td>4.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>atributos hspace/vspace</code> </td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.9")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>atributo loop</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.9")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>Atributo truespeed</code> </td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>Atributo hspace/vspace</code> </td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>Atributo loop</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/html/elemento/menu/index.html b/files/es/web/html/elemento/menu/index.html
deleted file mode 100644
index 887e230f1b..0000000000
--- a/files/es/web/html/elemento/menu/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: menu
-slug: Web/HTML/Elemento/menu
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/menu
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <code style="color: darkblue;">menu</code> (directorio) es un elemento desaprobado. En su origen fue pensado para crear menús, en la actualidad es inutil.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;menu&gt; y &lt;/menu&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#desaprobado">Elemento DESAPROBADO</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
- <dd><strong>NO puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">Elementos en bloque</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">compact</code></td>
-   <td>compact</td>
-   <td>implícito</td>
-   <td>espacio entre objetos reducido</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre class="eval"> &lt;menu&gt;
-  &lt;li&gt;primer elemento &lt;/li&gt;
-  &lt;li&gt;segundo elemento &lt;/li&gt;
-  &lt;li&gt;tercer elemento &lt;/li&gt;
- &lt;/menu&gt;
-</pre>
-
-<div class="highlight">
-<p>Se visualiza así:</p>
-
-<ul>
- <li>primer elemento</li>
- <li>segundo elemento</li>
- <li>tercer elemento</li>
-</ul>
-</div>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p>En el navegador se visualiza (o deberia) igual que una lista desordenada (<a href="es/HTML/Elemento/ul">ul</a>)</p>
diff --git a/files/es/web/html/elemento/meta/index.html b/files/es/web/html/elemento/meta/index.html
deleted file mode 100644
index c2fa5ce5a5..0000000000
--- a/files/es/web/html/elemento/meta/index.html
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: meta
-slug: Web/HTML/Elemento/meta
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/meta
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>meta</strong> de "metainformation" - metainformación. Sirve para aportar información sobre el documento..</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;meta&gt;</code> (solo tiene una).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#de_cabecera">de cabecera</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: No.</dd>
- <dd><strong>Puede contener</strong>: Nada.</dd>
- <dd><strong>Puede ser contenido por</strong>: Elementos <a href="es/HTML/Elemento/head">head</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<p><del>Por defecto</del>: Debe indicarlo el autor.</p>
-
-<p><span class="comment">name = name {{ mediawiki.external('CS') }} Este atributo identifica un nombre de propiedad. Esta especificación no enumera los valores legales para este atributo. content = cdata {{ mediawiki.external('CS') }} Este atributo especifica el valor de una propiedad. Esta especificación no enumera los valores legales para este atributo. scheme = cdata {{ mediawiki.external('CS') }} Este atributo especifica un esquema que se usará para interpretar el valor de la propiedad (véase la sección sobre perfiles para más detalles). http-equiv = name {{ mediawiki.external('CI') }} Este atributo puede utilizarse en lugar del atributo name. Los servidores HTTP utilizan este atributo para obtener información sobre los encabezados del mensaje de respuesta HTTP.</span></p>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-name-META"><span style="color: green;">name </span></a></td>
-   <td>Nombre al que se asocia la metainformación</td>
-   <td>Un 'nombre'. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-content"><span style="color: green;">content </span></a></td>
-   <td>Los datos que se quieren asociar a <code style="color: green;">name</code>.</td>
-   <td>Texto. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-http-equiv"><span style="color: green;">http-equiv </span></a></td>
-   <td>Aporta información sobre los encabezado de respuesta HTTP, puede usarse en lugar de <code style="color: green;">name</code>.</td>
-   <td>Un 'nombre'. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-scheme"><span style="color: green;">scheme </span></a></td>
-   <td>Indica un esquema de interpretación para los metadatos.</td>
-   <td>Texto. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Con_name_y_content" name="Con_name_y_content">Con name y content</h4>
-
-<pre class="eval">&lt;m<strong>eta</strong> name="copyright" content="© 2006 MDC"&gt;
-</pre>
-
-<h4 id="Con_http-equiv" name="Con_http-equiv">Con http-equiv</h4>
-
-<pre class="eval">&lt;<strong>meta</strong> http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
-</pre>
-
-<p> </p>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#edef-META"><strong>meta</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-meta">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/multicol/index.html b/files/es/web/html/elemento/multicol/index.html
deleted file mode 100644
index e03e9ae580..0000000000
--- a/files/es/web/html/elemento/multicol/index.html
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: <multicol>
-slug: Web/HTML/Elemento/multicol
-tags:
-  - HTML
-translation_of: Web/HTML/Element/multicol
----
-<div>{{non-standard_header}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento HTML <code>&lt;multicol&gt; </code>fue un elemento experimental diseñado para permitir diseños multi columna . Nunca tuvo una recepción significante y no es implementado en alguno de los principales exploradores .</p>
-
-<div class="note">
-<p><strong>No usar esto ! </strong>Para implementar un diseño multi columna , debería de usar los elementos HTML regulares como {{HTMLElement("div")}} en conjunto con la característica de CSS <a href="/es/docs/Columnas_con_CSS-3">Column</a> ,</p>
-</div>
-
-<p>Notar que hasta Firefox 22 , aunque no se soportaba , un elemento <code>&lt;multicol&gt; </code>fue asociado con un {{domxref("HTMLSpanElement")}}.  Después fue arreglado y ahora esta asociado con un {{domxref("HTMLUnknownElement")}} como se solocita en la especificación .</p>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/nav/index.html b/files/es/web/html/elemento/nav/index.html
deleted file mode 100644
index c8d998cef2..0000000000
--- a/files/es/web/html/elemento/nav/index.html
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: '<nav>: El elemento de sección de navegación'
-slug: Web/HTML/Elemento/nav
-tags:
-  - Elemento
-  - HTML5
-  - menu
-  - nav
-  - navegación
-  - programacion
-  - sección
-translation_of: Web/HTML/Element/nav
----
-<p>{{HTMLRef}}</p>
-
-<p>El <strong>elemento</strong> <strong>HTML <code>&lt;nav&gt;</code> </strong>representa una sección de una página cuyo propósito es proporcionar enlaces de navegación, ya sea dentro del documento actual o a otros documentos. Ejemplos comunes de secciones de navegación son menús, tablas de contenido e índices.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Content categories</a></th>
-   <td><a href="/es/docs/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Sectioning_content">sectioning content</a>, palpable content.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content">Flow content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padres permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Flow_content">flow content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>Ninguno</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento sólo incluye <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<ul>
- <li>No es necesario que todos los enlaces estén contenidos en un elemento <code>&lt;nav&gt;</code>. <code>&lt;nav&gt;</code> está destinado sólo para el bloque principal de enlaces de navegación; por lo general, el elemento {{HTMLElement("footer")}} a menudo tiene una lista de enlaces que no necesitan estar en un elemento {{HTMLElement("nav")}}.</li>
- <li>Un documento puede tener varios elementos {{HTMLElement("nav")}}, por ejemplo, uno para la navegación del sitio y otro para la navegación dentro de la página. <code><a href="/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute">aria-labelledby</a></code> puede ser utilizado en tal caso para promover la accesibilidad, ver <a href="/en-US/docs/Web/HTML/Element/Heading_Elements#Labeling_section_content">ejemplo</a>.</li>
- <li>Los agentes de usuario, como los lectores de pantalla dirigidos a usuarios con discapacidades, pueden usar este elemento para determinar si se omite la representación inicial del contenido de solo navegación.</li>
-</ul>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>En este ejemplo, un bloque <code>&lt;nav&gt;</code>  es usado para contener una lista no ordenada ({{HTMLElement("ul")}}) de enlaces. Con el CSS apropiado, esto puede ser presentado como una barra lateral, una barra de navegación o un menú desplegable.</p>
-
-<pre class="brush: html notranslate">&lt;nav class="menu"&gt;
-  &lt;ul&gt;
-    &lt;li&gt;&lt;a href="#"&gt;Inicio&lt;/a&gt;&lt;/li&gt;
-    &lt;li&gt;&lt;a href="#"&gt;Sobre nosotros&lt;/a&gt;&lt;/li&gt;
-    &lt;li&gt;&lt;a href="#"&gt;Contacto&lt;/a&gt;&lt;/li&gt;
-  &lt;/ul&gt;
-&lt;/nav&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'sections.html#the-nav-element', '&lt;nav&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambios desde la última instantánea del W3C</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'sections.html#the-nav-element', '&lt;nav&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, visite <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de extracción.</div>
-
-<p>{{Compat("html.elements.nav")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Otros elementos relacionados con la sección: {{HTMLElement("body")}}, {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("address")}};</li>
- <li class="last"><a class="deki-ns current" href="/es/docs/Sections_and_Outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">Secciones y esquema de un documento HTML5 </a>.</li>
- <li class="last"><a href="/en-US/docs/Web/Accessibility/ARIA/Roles/Navigation_Role">ARIA: Rol de navegación</a></li>
-</ul>
diff --git a/files/es/web/html/elemento/nobr/index.html b/files/es/web/html/elemento/nobr/index.html
deleted file mode 100644
index 2585c6c084..0000000000
--- a/files/es/web/html/elemento/nobr/index.html
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: <nobr>
-slug: Web/HTML/Elemento/nobr
-tags:
-  - Elemento
-  - HTML
-  - No-estándar
-  - Obsoleto
-  - Referencia
-  - Web
-  - nobr
-translation_of: Web/HTML/Element/nobr
----
-<div>{{non-standard_header}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p><span class="seoSummary">El elemento HTML <code>&lt;nobr&gt;</code> previene que una línea de texto se divida en una nueva línea, así, se presentará en una línea larga por lo que puede ser necesario hacer un desplazamiento de pantalla. Esta etiqueta no es un estándar HTML y no debería ser usada, en su lugar use la propiedad CSS </span>{{Cssxref("white-space")}} como en este ejemplo:</p>
-
-<pre class="brush:css">&lt;span style="white-space: nowrap"&gt;Línea larga sin saltos&lt;/span&gt;</pre>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li>{{Cssxref("white-space")}}</li>
- <li>{{Cssxref("overflow")}}</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/noframes/index.html b/files/es/web/html/elemento/noframes/index.html
deleted file mode 100644
index 97f1c8e234..0000000000
--- a/files/es/web/html/elemento/noframes/index.html
+++ /dev/null
@@ -1,143 +0,0 @@
----
-title: noframes
-slug: Web/HTML/Elemento/noframes
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/noframes
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>noframes</strong> de -<em>sin marcos</em> . Aporta contenidos alternativos a los marcos. Las aplicaciones de usuario que no soporten <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html">marcos</a>, o que estén configuradas para no mostrarlos, deben mostrar en su lugar el contenido de este elemento.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;noframes&gt;</code> y <code>&lt;/noframes&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: En un doctype transicional está definido como elemento <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: en bloque.</dd>
- <dd>En un documento transicional <strong>puede contener</strong>: texto y/o cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a> o <a href="es/HTML/Elemento/Tipos_de_elementos#en_l.C3.ADnea">en línea</a>.</dd>
- <dd>En un documento de marcos <strong>puede y debe contener</strong>: Un elementos <a href="es/HTML/Elemento/body">body</a> y no puede contener <a href="es/HTML/Elemento/noframes">noframes</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_frameset_y_su_alternativa" name="Un_frameset_y_su_alternativa">Un frameset y su alternativa</h4>
-
-<pre class="eval">&lt;frameset cols="20%, 80%"&gt;
-
- &lt;frame src="menu.html"&gt;
- &lt;frame src="capitulo1.html"&gt;
-
- &lt;<strong>noframes</strong>&gt;
-     &lt;p&gt; Esta guia se compone de los siguientes capítulos: &lt;/p&gt;
-     &lt;ul&gt;
-        &lt;li&gt; &lt;a href="capitulo1.html"&gt; Introducción &lt;/a&gt; &lt;/li&gt;
-        &lt;li&gt; &lt;a href="capitulo2.html"&gt; Desarrollo &lt;/a&gt; &lt;/li&gt;
-        &lt;li&gt; &lt;a href="capitulo3.html"&gt; Conclusión &lt;/a&gt; &lt;/li&gt;
-     &lt;/ul&gt;
- &lt;/<strong>noframes</strong>&gt;
-
-&lt;/frameset&gt;
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/frames.html#edef-NOFRAMES"><strong>noframes</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-noframes">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/noscript/index.html b/files/es/web/html/elemento/noscript/index.html
deleted file mode 100644
index c90b056c7b..0000000000
--- a/files/es/web/html/elemento/noscript/index.html
+++ /dev/null
@@ -1,138 +0,0 @@
----
-title: noscript
-slug: Web/HTML/Elemento/noscript
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/noscript
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>noscript</strong> de -<em>no script</em> . Aporta contenidos alternativos al elemento <a href="es/HTML/Elemento/script">script</a>. las aplicaciones de usuario que no soporten scripts deben mostrar en su lugar el contenido de este elemento.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;noscript&gt;</code> y <code>&lt;/noscript&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: en bloque.</dd>
- <dd><strong>Puede (y debe) contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.
- <dl>
-  <dd>Con un doctype transicional puede contener cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
- </dl>
- </dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Un_script_y_su_alternativa" name="Un_script_y_su_alternativa">Un script y su alternativa</h4>
-
-<pre class="eval">&lt;script type="text/javascript"&gt;
- Aquí un script que genera un listado
-&lt;/script&gt;
-
-&lt;<strong>noscript</strong>&gt;
-&lt;p&gt; Aquí un enlace a un &lt;a href="/datos/listado.html"&gt;listado&lt;/a&gt; alternativo &lt;/p&gt;
-&lt;/<strong>noscript</strong>&gt;
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#edef-NOSCRIPT"><strong>noscript</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-noscript">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/object/index.html b/files/es/web/html/elemento/object/index.html
deleted file mode 100644
index d859ea1b66..0000000000
--- a/files/es/web/html/elemento/object/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: <object>
-slug: Web/HTML/Elemento/object
-tags:
-  - Contenido incrustado
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-  - incrustar
-translation_of: Web/HTML/Element/object
----
-<p>{{HTMLRef}}</p>
-
-<p>El <strong>elemento HTML <code>&lt;object&gt;</code> </strong> representa un recurso externo, que puede ser tratado como una imagen, un contexto de navegación anidado, o como un recurso que debe ser manejado por un plugin.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/object.html", "tabbed-standard")}}</div>
-
-<p class="hidden">La fuente original de este ejemplo interactivo está almacenada en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíanos un pull request.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>; <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>; <a href="/en-US/docs/Web/HTML/Content_categories#Embedded_content">embedded content</a>, palpable content; if the element has a {{htmlattrxref("usemap","object")}} attribute, <a href="/en-US/docs/Web/HTML/Content_categories#Interactive_content">interactive content</a>; <a href="/en-US/docs/Web/HTML/Content_categories#Form_listed">listed</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Form_submittable">submittable</a> <a href="/en-US/docs/Web/HTML/Content_categories#Form-associated_content">form-associated</a> element.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>cero o más elementos {{HTMLElement("param")}} , luego <a href="/en-US/docs/Web/HTML/Content_categories#Transparent_content_model">transparent</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Tag omission</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Embedded_content">embedded content</a> (contenido incrustado).</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted ARIA roles</th>
-   <td>{{ARIARole("application")}}, {{ARIARole("document")}}, {{ARIARole("image")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLObjectElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</p>
-
-<dl>
- <dt>{{HTMLAttrDef("archive")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
- <dd>Una lista separada por espacios de las URl's de archivos o recursos para el objeto.</dd>
- <dt>{{HTMLAttrDef("border")}}{{Deprecated_Inline("HTML4.01")}}{{Obsolete_Inline("HTML5")}}</dt>
- <dd>El grosor de una línea de margen alrededor del control, en pixeles.</dd>
- <dt>{{HTMLAttrDef("classid")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
- <dd>The URI of the object's implementation. It can be used together with, or in place of, the <strong>data</strong> attribute.</dd>
- <dt>{{HTMLAttrDef("codebase")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
- <dd>The base path used to resolve relative URIs specified by <strong>classid</strong>, <strong>data</strong>, or <strong>archive</strong>. If not specified, the default is the base URI of the current document.</dd>
- <dt>{{HTMLAttrDef("codetype")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
- <dd>The content type of the data specified by <strong>classid</strong>.</dd>
- <dt>{{HTMLAttrDef("data")}}</dt>
- <dd>La dirección de la fuente, escrita como una URL válida. Al menos uno de los dos atributos, <strong>data</strong> o <strong>type</strong>, deben estar definidos. </dd>
- <dt>{{HTMLAttrDef("declare")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
- <dd>The presence of this Boolean attribute makes this element a declaration only. The object must be instantiated by a subsequent <code>&lt;object&gt;</code> element. In HTML5, repeat the &lt;object&gt; element completely each that that the resource is reused.</dd>
- <dt>{{HTMLAttrDef("form")}}{{HTMLVersionInline(5)}}</dt>
- <dd>El elemento form, si es que hay alguno, al que el objeto está asociado (su <em>form propietario</em>). El valor de este atributo debe ser el ID de un elemento {{HTMLElement("form")}} del mismo documento.</dd>
- <dt>{{HTMLAttrDef("height")}}</dt>
- <dd>La altura del recurso mostrado, en <a href="https://drafts.csswg.org/css-values/#px">CSS pixels</a>. -- (Valores absolutos unicamente. <a href="https://html.spec.whatwg.org/multipage/embedded-content.html#dimension-attributes">NO percentages</a>)</dd>
- <dt>{{HTMLAttrDef("name")}}</dt>
- <dd>El nombre de un contexto de navegación válido (HTML5), o el nombre del control (HTML4).</dd>
- <dt>{{HTMLAttrDef("standby")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
- <dd>A message that the browser can show while loading the object's implementation and data.</dd>
- <dt>{{HTMLAttrDef("tabindex")}}{{HTMLVersionInline(4)}} only{{Obsolete_Inline("HTML5")}}</dt>
- <dd>The position of the element in the tabbing navigation order for the current document.</dd>
- <dt>{{HTMLAttrDef("type")}}</dt>
- <dd>El <a href="/en-US/docs/Glossary/Content_type">content type</a>  del recurso especificado mediante <strong>data</strong>. Al menos uno de los dos atributos, <strong>data</strong> o <strong>type</strong>, deben estar definidos. </dd>
- <dt>{{HTMLAttrDef("typemustmatch")}}{{HTMLVersionInline(5)}}</dt>
- <dd>Este valor booleano indica si el atributo <strong>type</strong> y el <a href="/en-US/docs/Glossary/Content_type">content type</a> real del recurso deben coincidir para porder ser usados.</dd>
- <dt>{{HTMLAttrDef("usemap")}}</dt>
- <dd>Una refercia hash-name a un elemento <span style="font-size: 1rem; letter-spacing: -0.00278rem;">{{HTMLElement("map")}}; es decir un '#' seguido del valor de un {{htmlattrxref("name", "map")}} de un elemento map.</span></dd>
- <dt>{{HTMLAttrDef("width")}}</dt>
- <dd>El ancho del recurso mostrado, en  <a href="https://drafts.csswg.org/css-values/#px">CSS pixels</a>. -- (Valores absolutos unicamente. <a href="https://html.spec.whatwg.org/multipage/embedded-content.html#dimension-attributes">NO percentages</a>)</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Incrustar_una_película_flash">Incrustar una película flash</h3>
-
-<pre class="brush: html">&lt;!-- Incrustar una película flash --&gt;
-&lt;object data="movie.swf"
-  type="application/x-shockwave-flash"&gt;&lt;/object&gt;
-
-&lt;!-- Incrustar una película flash con parámetros --&gt;
-&lt;object data="movie.swf" type="application/x-shockwave-flash"&gt;
-  &lt;param name="foo" value="bar"&gt;
-&lt;/object&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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("HTML WHATWG", "embedded-content.html#the-object-element", "&lt;object&gt;")}}</td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "embedded-content-0.html#the-object-element", "&lt;object&gt;")}}</td>
-   <td>{{Spec2("HTML5 W3C")}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML4.01", "struct/objects.html#h-13.3", "&lt;object&gt;")}}</td>
-   <td>{{Spec2("HTML4.01")}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.object")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{HTMLElement("applet")}} {{Obsolete_Inline}}</li>
- <li>{{HTMLElement("embed")}}</li>
- <li>{{HTMLElement("param")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/ol/index.html b/files/es/web/html/elemento/ol/index.html
deleted file mode 100644
index f62713c92b..0000000000
--- a/files/es/web/html/elemento/ol/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: ol
-slug: Web/HTML/Elemento/ol
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/ol
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <code style="color: darkblue;">ol</code> permite definir listas o viñetas ordenadas (“Ordered List”), bien con numeración o alfabéticamente.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;ol&gt; y &lt;/ol&gt; (ambas obligatorias).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_lista">Elemento de lista</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th colspan="4">Genericos</th>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td></td>
-   <td></td>
-   <td>título del elemento</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td></td>
-   <td></td>
-   <td>información de estilo en línea</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td></td>
-   <td></td>
-   <td>identificador a nivel de documento</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td></td>
-   <td></td>
-   <td>identificador a nivel de documento</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td></td>
-   <td></td>
-   <td>dirección del texto</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td></td>
-   <td></td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">de transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">type</code></td>
-   <td>(1|a|A|i|I)</td>
-   <td>implícito</td>
-   <td>estilo de numeración</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">compact</code></td>
-   <td>compact</td>
-   <td>implícito</td>
-   <td>espacio entre objetos reducido</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">start</code></td>
-   <td>'un número'</td>
-   <td>implícito</td>
-   <td>número inicial de la secuencia</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre class="eval">&lt;ol&gt;
- &lt;li&gt;punto uno&lt;/li&gt;
- &lt;li&gt;punto dos&lt;/li&gt;
- &lt;li&gt;punto tres&lt;/li&gt;
-&lt;/ol&gt;
-</pre>
-
-<div class="highlight">
-<p>Se visualiza así:</p>
-
-<ol>
- <li>punto uno</li>
- <li>punto dos</li>
- <li>punto tres</li>
-</ol>
-</div>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/elemento/option/index.html b/files/es/web/html/elemento/option/index.html
deleted file mode 100644
index 3b97475475..0000000000
--- a/files/es/web/html/elemento/option/index.html
+++ /dev/null
@@ -1,150 +0,0 @@
----
-title: <option>
-slug: Web/HTML/Elemento/option
-tags:
-  - Elemento
-  - Formulários HTML
-  - Referencia
-  - Web
-  - formulários
-  - htmls
-translation_of: Web/HTML/Element/option
----
-<div>{{HTMLRef}}</div>
-
-<p>En un formulario Web , el <strong>elemento</strong> <strong>HTML<em> </em><code>&lt;option&gt;</code><em>  </em></strong>se usa para representar un item dentro de un {{HTMLElement("select")}}, un  {{HTMLElement("optgroup")}} o un  elemento HTML5 {{HTMLElement("datalist")}} .</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Contenido de las categorías</a></th>
-   <td>Ninguna</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Texto con,  eventualmente, caracteres especiales (como <code>&amp;eacute;</code>).</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>La etiqueta de inicio es obligatoria. La etiqueta de finalización es opcional siempre que el elemento esté inmediatamente seguido por otro elemento<code> &lt;option&gt;</code> , por un {{HTMLElement("optgroup")}}, o si el elemento padre tiene no tiene más contenido</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td> {{HTMLElement("select")}}, o {{HTMLElement("optgroup")}} o un elemento {{HTMLElement("datalist")}} element.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLOptionElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento posee los  <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("disabled")}}</dt>
- <dd>Si está establecido el elemento no se puede seleccionar. A menudo los navegadores ponen en gris el elemento y de esa manera no recibirá ningún evento de navegación como clicks de ratón o eventos relacionados con la obtención del foco. Si este atributo no está definido el elemento puede ser aún deshabilitado si uno de sus ancestros es un elemento {{HTMLElement("optgroup")}} deshabilitado.</dd>
- <dt>{{htmlattrdef("label")}}</dt>
- <dd>Este atributo es el texto para la etiqueta que determina el significado de la opción. Si el atributo <code><strong>label</strong></code> no está definidio su valor será el texto del contenido del elemento
- <div class="note"><em>Nota de Uso:  </em>El atributo <strong>label</strong> está diseñado para contener una etiqueta corta que se usará típicamente en un menú jerárquico. El <strong><code>atributo value</code></strong> describe una etiqueta más larga para ser usada, por ejemplo, cerca de un radio button</div>
- </dd>
- <dt>{{htmlattrdef("selected")}}</dt>
- <dd>Si está presente, este atributo booleano indica si esta opción es la inicialmente seleccionada. Si el elemento <code>&lt;option&gt; es descendiente de un elemento </code>{{HTMLElement("select")}} cuyo  atributo {{htmlattrxref("multiple", "select")}}  no esté definidio únicamente un sólo  <code>&lt;option&gt;</code> de este elemento  {{HTMLElement("select")}} puede tener este atributo <strong>selected</strong> attribute.</dd>
- <dt>{{htmlattrdef("value")}}</dt>
- <dd>El contenido de este atributo representa el valor que será enviado al enviar el formulario si una determinada opción está seleccionada. Si se omite el atributo el valor  se tomará del texto del contenido del elemento option.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Ver los ejemplos {{HTMLElement("select")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'the-button-element.html#the-option-element', '&lt;option&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-option-element', '&lt;option&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.6', '&lt;option&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td>
-    <p>Definición inicial</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_distintos_navegadores">Compatibilidad con los distintos navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] Gecko no muestra el valor del atributo label como texto de la opción en caso de que el contenido del elemento esté vacío. Ver {{bug("1205213")}}.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Otro elemento relacionados con formularios: {{HTMLElement("form")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("button")}}, {{HTMLElement("select")}}, {{HTMLElement("datalist")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("input")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
-</ul>
diff --git a/files/es/web/html/elemento/p/index.html b/files/es/web/html/elemento/p/index.html
deleted file mode 100644
index 5e9216b1f5..0000000000
--- a/files/es/web/html/elemento/p/index.html
+++ /dev/null
@@ -1,131 +0,0 @@
----
-title: p
-slug: Web/HTML/Elemento/p
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/p
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <a href="es/HTML/Elemento/p">p</a> (párrafo) es el apropiado para distribuir el texto en párrafos.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;p&gt; y &lt;/p&gt; (la de cierre es opcional).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_bloque">en bloque</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>lista de clases separadas por espacios</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>uno de los siguientes:"ltr" o "rtl"</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">align</code></td>
-   <td>uno de los siguientes: "left", "center", "right", o "justify"</td>
-   <td>implícito</td>
-   <td>Indica la alineación horizontal con relación al contexto</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre>&lt;p&gt;
-Esto
-es un
-párrafo
-&lt;/p&gt;
-
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/text.html#edef-P">En la especificación del estándar</a></li>
-</ul>
-
-<p> </p>
-
-<div class="note">
-<p>¡Estamos en obras!... disculpen las molestias.<br>
- Este documento está siendo editado, posiblemente contenga carencias y defectos.</p>
-
-<p>¿Quieres participar en la elaboración de este documento? Para más información sobre como ayudar o como empezar a hacerlo, consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/param/index.html b/files/es/web/html/elemento/param/index.html
deleted file mode 100644
index b9314fa0c1..0000000000
--- a/files/es/web/html/elemento/param/index.html
+++ /dev/null
@@ -1,131 +0,0 @@
----
-title: param
-slug: Web/HTML/Elemento/param
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/param
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>param</strong> de "parameter" = parámetro. Permite especificar parámetros de ejecución para un objeto.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;param&gt;</code> (solo tiene una).</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: No.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: .</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: Nada.
-
- <dl>
-  <dd><strong>Puede ser contenido por</strong>: El elemento <a href="es/HTML/Elemento/object">object</a>, y el desaprobado <a href="es/HTML/Elemento/applet">applet</a>.</dd>
- </dl>
- </dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-name-PARAM"><span style="color: green;">name </span></a></td>
-   <td>Referencia un nombre de parámetro de ejecución conocido por el objeto insertado.</td>
-   <td>Un nombre de parámetro de ejecución. Puede ser sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> (o no). <s>Por defecto</s>: Debe indicarlo el autor.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-value-PARAM"><span style="color: green;">value </span></a></td>
-   <td>Especifica un valor para el parámetro referenciado por name</td>
-   <td>Los valores de este atributo dependen del objeto a insertar</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-valuetype"><span style="color: green;">valuetype </span></a></td>
-   <td>especifica el tipo de atributo value.</td>
-   <td>Uno de los siguientes: <code>'data', 'ref' o 'object'</code>. Por defecto: <code>'data'</code>.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#adef-type-PARAM"><span style="color: green;">type </span></a></td>
-   <td>Si el <code>valuetype</code> es 'ref', <code>type</code> sirve para indicar el tipo MIME del recurso referenciado.</td>
-   <td>Un tipo MIME. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="bla_bla" name="bla_bla">bla bla</h4>
-
-<pre class="eval"><span class="nowiki">
-
- </span>
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/objects.html#h-13.3.2."><strong>param</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-param">comparativa</a>: IE6 vs IE7 vs FF1.5 vs OP9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/picture/index.html b/files/es/web/html/elemento/picture/index.html
deleted file mode 100644
index 99d681da97..0000000000
--- a/files/es/web/html/elemento/picture/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: <picture>
-slug: Web/HTML/Elemento/picture
-tags:
-  - Elemento
-  - Fotografía
-  - Imagen
-  - graficos
-translation_of: Web/HTML/Element/picture
----
-<div>{{HTMLRef}}{{SeeCompatTable}}</div>
-
-<p>El <strong>elemento HTML <code>&lt;picture&gt;</code> </strong>es un contenedor usado para especificar múltiples elementos {{HTMLElement("source")}} y un elemento {{HTMLElement("img")}} contenido en él para proveer versiones de una imagen para diferentes escenarios de dispositivos. Si no hay coincidencias con los elementos <code>&lt;source&gt;</code>, el archivo especificado en los atributos {{htmlattrxref("src", "img")}} del elemento <code>&lt;img&gt;</code> es utilizado. La imagen seleccionada es entonces presentada en el espacio ocupado por el elemento <code>&lt;img&gt;</code>.</p>
-
-<p>Para seleccionar la imagen óptima, el {{Glossary("user agent")}} examina cada atributo {{htmlattrxref("srcset", "source")}}, {{htmlattrxref("media", "source")}}, y {{htmlattrxref("type", "source")}} de la fuente para seleccionar la imagen compatible.</p>
-
-<p>El navegador escogerá la fuente más apropiada de acuerdo al diseño de la página (las limitaciones de la caja donde aparecerá la imagen) y el dispositivo que se utilize para visualizarla (p.ej. pantalla normal o hiDPI).</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/es-ES/docs/Web/HTML/Content_categories">Categorías de contenido</a></th>
-   <td><a href="/es-ES/docs/Web/HTML/Content_categories#flow_content">Flujo de contenido</a>, contenido textual o estático, contenido incrustado</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Cero o más elementos {{HTMLElement("source")}}, seguidos por un elemento {{HTMLElement("img")}}, mezclados opcionalmente con elementos script-supporting.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>Cualquier elemento que permita embeber contenido.</td>
-  </tr>
-  <tr>
-   <th scope="row">ARIA roles permitidos</th>
-   <td>Ninguno.</td>
-  </tr>
-  <tr>
-   <th scope="row">DOM interface</th>
-   <td>{{domxref("HTMLPictureElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento sólo incluye <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales.</a></p>
-
-
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<p>Se puede usar la propiedad {{cssxref("object-position")}} para ajustar la posición de la imagen dentro del marco del elemento, y la propiedad {{cssxref("object-fit")}} para controlar como el tamaño de la imagen se ajusta para adaptarse al marco.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Estos ejemplos demuestran los efectos que tienen diferentes atributos del atributo {{HTMLElement("source")}} en la selección de la imagen a desplegar cuando se usa dentro de <code>&lt;picture&gt;</code>.</p>
-
-<h3 id="El_atributo_media">El atributo <code>media</code></h3>
-
-<p>El atributo <code>media</code> permite especificar una media query que el agente de usuario evaluará para seleccionar un elemento {{HTMLElement("source")}}. Si la media query evalua a <code>false</code>, el elemento {{HTMLElement("source")}} es omitido.</p>
-
-<pre class="brush: html">&lt;picture&gt;
- &lt;source srcset="mdn-logo-wide.png" media="(min-width: 600px)"&gt;
- &lt;img src="mdn-logo-narrow.png" alt="MDN"&gt;
-&lt;/picture&gt;
-</pre>
-
-<h3 id="El_atributo_type">El atributo <code>type</code></h3>
-
-<p>El atributo <code>type</code> permite especificar un tipo MIME para los recursos dados en el atributo srcset del elemento {{HTMLElement("source")}}. Si el agente de usuario no soporta dicho tipo, el elemento {{HTMLElement("source")}} es omitido.</p>
-
-<pre class="brush: html">​&lt;picture&gt;
- &lt;source srcset="mdn-logo.svg" type="image/svg+xml"&gt;
- &lt;img src="mdn-logo.png" alt="MDN"&gt;
-&lt;/picture&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'embedded-content.html#the-picture-element', '&lt;picture&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>13</td>
-   <td>{{CompatGeckoDesktop("38")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("38")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>iOS 9.3</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Elemento {{HTMLElement("img")}}</li>
- <li>Elemento {{HTMLElement("source")}}</li>
- <li>Posicionando y redimensionando la imagen dentro de su marco: {{cssxref("object-position")}} y {{cssxref("object-fit")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/pre/index.html b/files/es/web/html/elemento/pre/index.html
deleted file mode 100644
index 2ec0cf56dc..0000000000
--- a/files/es/web/html/elemento/pre/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: <pre>
-slug: Web/HTML/Elemento/pre
-translation_of: Web/HTML/Element/pre
----
-<h2 id="Sumario">Sumario</h2>
-
-<p>El <strong>Elemento</strong> <strong>HTML &lt;pre&gt;</strong> (o <em>Texto HTML Preformateado</em>) representa texto preformateado. El texto en este elemento típicamente se muestra en una fuente fija, no proporcional, exactamente como es mostrado en el archivo. Los espacios dentro de este elemento también son mostrados como están escritos.</p>
-
-<ul class="htmlelt">
- <li><dfn><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></dfn> {{todo}}<a href="/en-US/docs/HTML/Content_categories#Flowing_content" title="HTML/Content_categories#Phrasing_content">Flow content</a>, palpable content.</li>
- <li><dfn>Permitted content</dfn> <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="/en-US/docs/HTML/Content_categories#Phrasing_content">Phrasing content</a>.</li>
- <li><dfn>Tag omission</dfn> {{no_tag_omission}}</li>
- <li><dfn>Permitted parent elements</dfn> Any element that accepts <a href="/en-US/docs/HTML/Content_categories#flow_content" title="HTML/Content categories#flow content">flow content</a>.</li>
- <li><dfn>DOM interface</dfn> {{domxref("HTMLPreElement")}}</li>
-</ul>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento solo incluye los <a href="/en-US/docs/HTML/Global_attributes" title="/en-US/docs/">atributos globales</a>.</span></p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;!-- Un poco de codigo CSS --&gt;
-&lt;pre&gt;
-body{
-  color:  red;
-}
-a   {
-  color:green;
-}
-&lt;/pre&gt;
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<pre>body{
-  color:  red;
-}
-a   {
-  color:green;
-}
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Epecificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'grouping-content.html#the-pre-element', '&lt;pre&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'the-pre-element.html#the-pre-element', '&lt;pre&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'text.html#h-9.3.4', '&lt;dl&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con exploradores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>CSS: {{ Cssxref('white-space') }}, {{ Cssxref('word-break') }}</li>
-</ul>
diff --git a/files/es/web/html/elemento/progress/index.html b/files/es/web/html/elemento/progress/index.html
deleted file mode 100644
index 581c0da783..0000000000
--- a/files/es/web/html/elemento/progress/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: '<progress>: Elemento indicador de progreso'
-slug: Web/HTML/Elemento/progress
-translation_of: Web/HTML/Element/progress
----
-<div>{{HTMLRef}}</div>
-
-<p>La etiqueta <strong>HTML<em> </em><code>&lt;progress&gt;</code></strong> se utiliza para visualizar el progreso de una tarea. Aunque los detalles de como se muestran depende directamente del navegador que utiliza el cliente, aunque básicamente aparece una barra de progreso.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/progress.html", "tabbed-standard")}}</div>
-
-<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p>
-
-<ul class="htmlelt">
- <li><dfn><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Flujo_de_contenido" title="HTML/Content_categories">Categorias de contenido </a></dfn><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Flujo_de_contenido" title="HTML/Content_categories">Flujo de contenido</a><span>, </span><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_de_redacci%C3%B3n">contenido de redacción</a><span style="font-style: normal; line-height: 1.5em;">, contenido etiquetable, contenido palpable.</span></li>
- <li><dfn>Contenido permitido</dfn> <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Contenido de redacción</a>, pero no debe haber ningún elemento de progreso entre sus descendientes</li>
- <li><dfn>Etiquetas por omisión</dfn> {{no_tag_omission}}</li>
- <li><dfn>Elementos padres permitidos</dfn> Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">contenido de redacción</a>.</li>
- <li><dfn>DOM interfaz</dfn> {{domxref("HTMLProgressElement")}}</li>
-</ul>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento incluye <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" title="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes">Atributos Globales</a></span><span style="line-height: 21px;">.</span></p>
-
-<dl>
- <dt>{{ htmlattrdef("max") }}</dt>
- <dd>Este atributo indica la cantidad de trabajo que demorá la carga, se define en el elemento <code>progress</code>. Por ejemplo max="100".</dd>
- <dt>{{ htmlattrdef("value") }}</dt>
- <dt></dt>
- <dd><span style="font-weight: normal; line-height: inherit;">Este atributo indica que parte de la tarea ya se ha completado o cargado. Debe especificarse un valor entre 0  y </span><code style="font-size: 14px; line-height: inherit;">max</code><span style="font-weight: normal; line-height: inherit;">, o entre 0 y 1.0 si </span><code style="font-size: 14px; line-height: inherit;">max</code><span style="font-weight: normal; line-height: inherit;"> está omitido. Si al atributo </span><code style="font-size: 14px; line-height: inherit;">value</code><span style="font-weight: normal; line-height: inherit;"> no se le especifica ningún valor, se estara llevando a cabo la tarea sin que el elemento mueste funcionamiento alguno. Por ejemplo si la carga está al 50% será de 0.5 el valor, en el caso de no especificar max. </span></dd>
-</dl>
-
-<p>Puedes usar la propiedad CSS {{ cssxref("orient") }} permite especificar la orientacion de la barra de progreso (horizontal o vertical) con horizontal por defecto. La pseudo-clase {{ cssxref(":indeterminate") }} se puede utiliza para hacer que coincida con las barras de progreso indeterminadas.</p>
-
-<dl>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html notranslate">&lt;progress value="70" max="100"&gt;70 %&lt;/progress&gt;
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{EmbedInteractiveExample("pages/tabbed/progress.html", "tabbed-standard")}}</p>
-
-<p>En Mac OS X, Se vería como esto:</p>
-
-<p><img alt="progress-1.png" class="default internal" src="/@api/deki/files/4946/=progress-1.png"></p>
-
-<p>En Windows, el resultante sería este:</p>
-
-<p><img alt="progress-firefox.JPG" class="default internal" src="/@api/deki/files/6031/=progress-firefox.JPG"></p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'forms.html#the-progress-element', '&lt;progress&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'sec-forms.html#the-progress-element', '&lt;progress&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_los_navegadores">Compatibilidad en los navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.progress")}}</p>
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li>{{htmlelement("meter")}}</li>
- <li>{{ cssxref(":indeterminate") }}</li>
- <li>{{ cssxref("-moz-orient") }}</li>
- <li>{{ cssxref("::-moz-progress-bar") }}</li>
- <li>{{ cssxref("::-ms-fill") }}</li>
- <li>{{ cssxref("::-webkit-progress-bar") }}</li>
- <li>{{ cssxref("::-webkit-progress-value") }}</li>
- <li>{{ cssxref("::-webkit-progress-inner-element") }}</li>
-</ul>
diff --git a/files/es/web/html/elemento/q/index.html b/files/es/web/html/elemento/q/index.html
deleted file mode 100644
index edcc4076e6..0000000000
--- a/files/es/web/html/elemento/q/index.html
+++ /dev/null
@@ -1,121 +0,0 @@
----
-title: '<q>: El elemento de cita en línea'
-slug: Web/HTML/Elemento/q
-tags:
-  - Cita de bloque independiente
-  - Citación
-  - Elemento
-  - HTML
-  - Marca de cita
-  - Q
-  - Referencia
-  - Semántica HTML a nivel de texto
-  - Web
-  - cita
-translation_of: Web/HTML/Element/q
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">El <strong>elemento HTML <code>&lt;q&gt;</code></strong> indica que el texto adjunto es una cita corta en línea. La mayoría de los navegadores modernos implementan esto rodeando el texto entre comillas. </span> Este elemento está destinado a citas breves que no requieren saltos de párrafo; para citas de bloque independiente, utiliza el elemento {{HTMLElement("blockquote")}}.</p>
-
-<div>{{ EmbedInteractiveExample("pages/tabbed/q.html", "tabbed-shorter") }}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row">{{web.link("/es/docs/Web/HTML/Content_categories", "Categorías de contenido")}}</th>
-   <td>{{web.link("/es/docs/Web/HTML/Content_categories#Flow_content", "Flujo de contenido")}}, {{web.link("/es/docs/Web/HTML/Content_categories#Phrasing_content", "redacción de contenido")}}, contenido palpable.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>{{web.link("/es/docs/Web/HTML/Content_categories#Phrasing_content", "Redacción de contenido")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres autorizados</th>
-   <td>Cualquier elemento que acepte {{web.link("/es/docs/Web/HTML/Content_categories#Phrasing_content", "redacción de contenido")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Rol de ARIA implícito</th>
-   <td>{{web.link("https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role", "Rol no correspondiente")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>Algunos</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{DOMxRef("HTMLQuoteElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<div class="note">
-<p><strong>Nota de uso</strong>: La mayoría de los navegadores modernos automáticamente agregarán comillas alrededor del texto dentro de un elemento <code>&lt;q&gt;</code>. Es posible que se necesite una regla de estilo para agregar comillas en navegadores antiguos.</p>
-</div>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los {{web.link("/es/docs/Web/HTML/Global_attributes", "atributos globales")}}.</p>
-
-<dl>
- <dt>{{HTMLAttrDef("cite")}}</dt>
- <dd>El valor de este atributo es una URL que designa un documento o mensaje fuente para la información citada. Este atributo está destinado a señalar información que explica el contexto o la referencia de la cita.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: html notranslate">&lt;p&gt;Conforme al sitio web de Mozilla,
-  &lt;q
-  cite="https://www.mozilla.org/en-US/about/history/details/"&gt;Firefox 1.0
-  fue lanzado en 2004 y se convirtió en un gran éxito.&lt;/q&gt;&lt;/p&gt;
-</pre>
-
-<p>{{EmbedLiveSample('Ejemplo')}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'semantics.html#the-q-element', '&lt;q&gt;') }}</td>
-   <td>{{ Spec2('HTML WHATWG') }}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{ SpecName('HTML5 W3C', 'textlevel-semantics.html#the-q-element', '&lt;q&gt;') }}</td>
-   <td>{{ Spec2('HTML5 W3C') }}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{ SpecName('HTML4.01', 'struct/text.html#h-9.2.2', '&lt;q&gt;') }}</td>
-   <td>{{ Spec2('HTML4.01') }}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{ Compat("html.elements.q") }}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>El elemento {{HTMLElement("blockquote")}} para citas de bloque independiente.</li>
- <li>El elemento {{HTMLElement("cite")}} para citas de fuentes.</li>
-</ul>
diff --git a/files/es/web/html/elemento/s/index.html b/files/es/web/html/elemento/s/index.html
deleted file mode 100644
index e515a0257f..0000000000
--- a/files/es/web/html/elemento/s/index.html
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: s
-slug: Web/HTML/Elemento/s
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/s
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Muestra el texto tachado con una linea horizontal.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;s&gt; y &lt;/s&gt; (Ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>:<a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
-  <tr>
-   <th colspan="4">Genéricos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">title</code></td>
-   <td>texto</td>
-   <td>implícito</td>
-   <td>título consultivo del elemento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">style</code></td>
-   <td>reglas de estilo</td>
-   <td>implícito</td>
-   <td>información de estilo en línea.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">id</code></td>
-   <td>ID</td>
-   <td>implícito</td>
-   <td>identificador único a nivel de documento.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">class</code></td>
-   <td>CDATA</td>
-   <td>implícito</td>
-   <td>identificador a nivel de documento, lista de clases separadas por espacios.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dir</code></td>
-   <td>(ltr|rtl)</td>
-   <td>implícito</td>
-   <td>dirección del texto débil/neutral</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">lang</code></td>
-   <td>código de idioma</td>
-   <td>implícito</td>
-   <td>información sobre el idioma</td>
-  </tr>
-  <tr>
-   <td colspan="4"><strong>Eventos</strong>: <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</code></td>
-  </tr>
-  <tr>
-   <th colspan="4">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="4">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="4">No tiene</td>
-  </tr>
-  <tr>
-   <th>Atributo</th>
-   <th colspan="2">valor</th>
-   <th>descripción</th>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">  &lt;p&gt;
-       Texto normal y... &lt;s&gt;Texto tachado&lt;/s&gt;
-  &lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<div class="warning">DESAPROBADO</div>
diff --git a/files/es/web/html/elemento/samp/index.html b/files/es/web/html/elemento/samp/index.html
deleted file mode 100644
index 2957372979..0000000000
--- a/files/es/web/html/elemento/samp/index.html
+++ /dev/null
@@ -1,63 +0,0 @@
----
-title: samp
-slug: Web/HTML/Elemento/samp
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/samp
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">El elemento HTML Sample (<strong><code>&lt;samp&gt;</code></strong>) se utiliza para incluir texto en línea que representa una muestra (o cita) de la salida de un programa de ordenador. El contenido de esta etiqueta es renderizado generalmente usando la tipografía monoespaciada por defecto del navegador.</span></p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/samp.html", "tabbed-shorter")}}</div>
-
-<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> and send us a pull request.</p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Señala lo que es una salida de un programa.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;samp&gt; y &lt;/samp&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
-
-<ul>
- <li>title (título del elemento)</li>
- <li>style (información de estilo en línea)</li>
-</ul>
-
-<dl>
- <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
- <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
- <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
-</dl>
-
-<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene." name="Atributos_Espec.C3.ADficos_-_No_tiene.">Atributos Específicos - No tiene.</h5>
-
-<h5 id="Atributos_Transicionales_-_No_tiene." name="Atributos_Transicionales_-_No_tiene.">Atributos Transicionales - No tiene.</h5>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">&lt;p&gt;
-... entonces aparecerá una ventana con el mensaje: &lt;samp&gt;Hola mundo&lt;/samp&gt;
-&lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
diff --git a/files/es/web/html/elemento/script/index.html b/files/es/web/html/elemento/script/index.html
deleted file mode 100644
index d1b744f192..0000000000
--- a/files/es/web/html/elemento/script/index.html
+++ /dev/null
@@ -1,255 +0,0 @@
----
-title: <script>
-slug: Web/HTML/Elemento/script
-tags:
-  - Elemento
-  - HTML
-  - HTML scripting
-  - Referencia
-  - Scripting
-  - Web
-  - etiqueta
-translation_of: Web/SVG/Element/script
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El <em>elemento HTML Script</em> (<strong><code>&lt;script&gt;</code></strong>) se utiliza para insertar o hacer referencia a un script ejecutable dentro de un documento HTML o XHTML.</p>
-
-<p>Los scripts sin atributo <code>async</code> o <code>defer</code>, así como las secuencias de comandos en línea, son interpretados y ejecutados inmediatamente, antes de que el navegador continúe procesando la página.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content" title="HTML/Content_categories#Metadata_content">Metadata content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Script dinámico tal como <code>text/javascript</code>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omision de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content" title="HTML/Content_categories#Metadata_content">metadata content</a>, o cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLScriptElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento contiene los <a href="es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("async")}} {{HTMLVersionInline(5)}}</dt>
- <dd>Establece este atributo booleano para indicar al navegador, si es posible, ejecutar el código asincrónicamente. Esto no afecta a los scripts escritos dentro de la etiqueta (es decir a aquellos que no tienen el atributo <strong>src</strong>).</dd>
- <dd>Ver {{anch("Browser compatibility")}} para notas acerca de compatibilidad. Ver tambien <a href="/en-US/docs/Games/Techniques/Async_scripts">Scripts asincrónicos para asm.js</a>.</dd>
- <dt>{{htmlattrdef("integrity")}}</dt>
- <dd>Contiene información de metadatos que es usada por el user agent del navegador para verificar el recurso captado fue entregado libre de manipulación inesperada. Ver <a href="/en-US/docs/Web/Security/Subresource_Integrity">Subresource Integrity</a>.</dd>
- <dt>{{htmlattrdef("src")}}</dt>
- <dd>Este atributo especifica la URI del script externo; este puede ser usado como alternativa a scripts embebidos directamente en el documento. Si el script tiene el atributo src, no debería tener código dentro de la etiqueta.</dd>
- <dt>{{htmlattrdef("type")}}</dt>
- <dd>Este atributo identifica el lenguaje de scripting en que está escrito el código embebido dentro de la etiqueta script, o referenciada utilizando el atributo src. Los valores posibles están especificados como un MIME type (tipo MIME). <br>
- Algunos ejemplos de tipos MIME que pueden ser utilizados son: <code>text/javascript</code>, <code>text/ecmascript</code>, <code>application/javascript</code>, y <code>application/ecmascript. </code>Si el atributo se encuentra ausente, el valor por defecto será un script JavaScript.</dd>
- <dd>Si el tipo MIME especificado no es un tipo JavaScript, el contenido embebido dentro de la etiqueta script es tratado como un bloque de datos que no será procesado por el navegador.</dd>
- <dd>Si el tipo especificado es module, el código es tratado como un módulo JavaScript {{experimental_inline}}. Ver <a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a>.</dd>
- <dd>Nota: en Firefox puedes usar características avanzadas tales como let statements y otras características de la última versión de JS, usando type=application/javascript;version=1.8 {{Non-standard_inline}}. Ten cuidado!, esto no es una característica estándar, es decir, probablemente genere conflictos con otros navegadores, en particular aquellos basados en Chromium.</dd>
- <dd>Para incluir lenguajes de programación exóticos, lee acerca de <a href="/en-US/Add-ons/Code_snippets/Rosetta">Rosetta</a>.</dd>
- <dt>{{htmlattrdef("text")}}</dt>
- <dd>Este atributo actúa como el atributo <code>textContent</code>, establece el texto contenido del elemento. Pero a diferencia de <code>textContent</code>, este atributo se evalúa como ejecutable luego de ser insertado como nodo en el DOM.</dd>
- <dt>{{htmlattrdef("language")}} {{Deprecated_inline}}</dt>
- <dd>Este atributo actúa como el atributo <code>type</code>, identifica el tipo de lenguaje que se utiliza. A diferencia del atributo <code>type</code>, los posibles valores de este atributo nunca fueron estandarizados. El atributo <code>type</code> debe ser utilizado en lugar de <code>language</code>.</dd>
- <dt>{{htmlattrdef("defer")}}</dt>
- <dd>Este atributo establece si el script debe ser ejecutado luego de que el documento entero sea analizado. Dado que esta función aún no fue implementada por todos los navegadores relevantes, los autores no deberían asumir que el script realmente será ejecutado luego de la carga y analisis del documento.  Desde Gecko 1.9.2 el atributo defer es ignorado en los scripts que no tienen el atributo src. Sin embargo, en Gecko 1.9.1 incluso se difieren los scripts escritos dentro de la etiqueta.</dd>
- <dt>{{htmlattrdef("crossorigin")}} {{Non-standard_inline}}</dt>
- <dd>Elementos normales script pasan información mínima al {{domxref('GlobalEventHandlers.onerror', 'window.onerror')}} para scripts que no pasan las revisiones del estándar <a href="/es/docs/Web/HTTP/Access_control_CORS">CORS</a>. Para permitir registrar errores en los sitios que usan dominios separados para recursos estáticos, usar este atributo.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;!-- HTML4 y (x)HTML --&gt;
-&lt;script type="text/javascript" src="javascript.js"&gt;&lt;/script&gt;
-
-&lt;!-- HTML5 --&gt;
-&lt;script src="javascript.js"&gt;&lt;/script&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', "scripting.html#the-script-element", "&lt;script&gt;")}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Agrega el tipo module.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'scripting-1.html#script', '&lt;script&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/scripts.html#h-18.2.1', '&lt;script&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('Subresource Integrity', '#htmlscriptelement', '&lt;script&gt;')}}</td>
-   <td>{{Spec2('Subresource Integrity')}}</td>
-   <td>Agrega el atributo integrity.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(1.0)}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}}<sup>[2]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>async attribute</td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-   <td>{{CompatGeckoDesktop("1.9.2")}}<sup>[1]</sup></td>
-   <td>10<sup>[1]</sup></td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-  </tr>
-  <tr>
-   <td>defer attribute</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
-   <td>
-    <p>4[3]<br>
-     10</p>
-   </td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>crossorigin attribute</td>
-   <td>{{CompatChrome(30.0)}}</td>
-   <td>{{CompatGeckoDesktop("13")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>12.50</td>
-   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
-  </tr>
-  <tr>
-   <td>integrity attribute</td>
-   <td>{{CompatChrome(45.0)}}</td>
-   <td>{{CompatGeckoDesktop("43")}}</td>
-   <td> </td>
-   <td> </td>
-   <td>{{CompatNo}}<sup>[5]</sup></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}<sup>[2]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>async attribute</td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-   <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
-  </tr>
-  <tr>
-   <td>defer attribute</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>integrity attribute</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(45.0)}}</td>
-   <td>{{CompatGeckoDesktop("43")}}</td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td>{{CompatChrome(45.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] In older browsers that don't support the <code>async</code> attribute, parser-inserted scripts block the parser; script-inserted scripts execute asynchronously in IE and WebKit, but synchronously in Opera and pre-4.0 Firefox. In Firefox 4.0, the <code>async</code> DOM property defaults to <code>true</code> for script-created scripts, so the default behavior matches the behavior of IE and WebKit. To request script-inserted external scripts be executed in the insertion order in browsers where the <code>document.createElement("script").async</code> evaluates to <code>true</code> (such as Firefox 4.0), set <code>.async=false</code> on the scripts you want to maintain order. Never call <code>document.write()</code> from an <code>async</code> script. In Gecko 1.9.2, calling <code>document.write()</code> has an unpredictable effect. In Gecko 2.0, calling <code>document.write()</code> from an <code>async</code> script has no effect (other than printing a warning to the error console).</p>
-
-<p>[2] Starting in Gecko 2.0 {{geckoRelease("2.0")}}, inserting script elements that have been created by calling <code>document.createElement("script")</code> into the DOM no longer enforces execution in insertion order. This change lets Gecko properly abide by the HTML5 specification. To make script-inserted external scripts execute in their insertion order, set <code>.async=false</code> on them.</p>
-
-<p>Also, {{HTMLElement("script")}} elements inside {{HTMLElement("iframe")}}, {{HTMLElement("noembed")}} and {{HTMLElement("noframes")}} elements are now executed, for the same reasons.</p>
-
-<p>[3] In versions prior to Internet Explorer 10 Trident implemented <code>&lt;script&gt;</code> by a proprietary specification. Since version 10 it conforms to the W3C specification.</p>
-
-<p>[4] The <code>crossorigin</code> attribute was implemented in WebKit in {{WebKitBug(81438)}}.</p>
-
-<p>[5] {{WebKitBug(148363)}} tracks WebKit implementation of Subresource Integrity (which includes the <code>integrity</code> attribute).</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{domxref("document.currentScript")}}</li>
- <li><a href="http://pieisgood.org/test/script-link-events/">Ryan Grove's &lt;script&gt; and &lt;link&gt; node event compatibility chart</a></li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/section/index.html b/files/es/web/html/elemento/section/index.html
deleted file mode 100644
index 3a68adbae3..0000000000
--- a/files/es/web/html/elemento/section/index.html
+++ /dev/null
@@ -1,143 +0,0 @@
----
-title: section
-slug: Web/HTML/Elemento/section
-translation_of: Web/HTML/Element/section
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento de <em>HTML section</em> (<code>&lt;section&gt;</code>) representa una sección genérica de un documento. Sirve para determinar qué contenido corresponde a qué parte de un esquema. Piensa en el esquema como en el índice de contenido de un libro; un tema común y subsecciones relacionadas.  Es, por lo tanto, una etiquéta semántica. Su funcionalidad principal es estructurar semánticamente un documento a la hora de ser representado por parte de un agente usuario. Por ejemplo, un agente de usuario que represente el documento en voz, podría exponer al usuario el índice de contenido por niveles para navegar rápidamente por las distintas partes.</p>
-
-<div class="note">
-<p><em>Notas de uso:</em></p>
-
-<ul>
- <li>Si la intención es indicar el contenido de un elemento {{HTMLElement("section")}} , es mejor usar el elemento {{HTMLElement("article")}} en su lugar, a modo de artículos independientes como en las revistas. {{HTMLElement("section")}} está diseñado para contenidos dependientes, pero diferenciados.</li>
- <li>No se debe usar el elemento {{HTMLElement("section")}} como un mero contenedor genérico; para esto ya existe {{HTMLElement("div")}}, especialmente si el objetivo solamente es aplicar un estilo (CSS) a la sección. Como regla general, el título de una sección debería aparecer en el esquema del documento.</li>
-</ul>
-</div>
-
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Contenido permitido</td>
-   <td><a href="/en/HTML/Content_categories#Flow_content" title="en/HTML/Content Categories#Flow content">Contenido dinámico</a></td>
-  </tr>
-  <tr>
-   <td>Omisión de etiquetas</td>
-   <td>Ninguna, tanto la etiqueta de apertura como la de cierre son obligatorias.</td>
-  </tr>
-  <tr>
-   <td>Elementos padres permitidos</td>
-   <td>
-    <p>Todo elemento que acepte <a href="/en/HTML/Content_categories#Flow_content" title="en/HTML/Content Categories#Flow content">contenido dinámico</a>. Nótese que un elemento {{ HTMLElement("section") }} no debe ser descendiente de un elemento {{ HTMLElement("address") }}.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Documento normativo</td>
-   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/sections.html#the-section-element">HTML5, sección 4.4.2</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento carece de otros atributos fuera de los <a href="/en/HTML/Global_attributes" rel="internal">atributos globales</a>, que son comunes a todos los elementos.</p>
-
-<h2 id="Interfaz_del_DOM">Interfaz del DOM</h2>
-
-<p>Este elemento implementa la interfaz <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code>.</p>
-
-<h2 id="Ejemplo_1">Ejemplo 1</h2>
-
-<h3 id="Antes_de_HTML5">Antes de HTML5</h3>
-
-<pre class="line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h1</span><span class="punctuation token">&gt;Encabezado</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h1</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span></code>Un montón de contenido impresionante.<code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<h3 id="con_HTML5">con HTML5</h3>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>section</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h1</span><span class="punctuation token">&gt;</span></span></code><code>Encabezado</code><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h1</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span></code>Un montón de contenido impresionante.<code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>section</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<h2 id="Ejemplo_2">Ejemplo 2</h2>
-
-<h3 id="Antes_de_HTML5_2">Antes de HTML5</h3>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>div</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h2</span><span class="punctuation token">&gt;Encabezado</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h2</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"roble</span>.jpg<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"un roble</span><span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>div</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<h3 id="con_HTML5_2">con HTML5</h3>
-
-<pre class="brush: html line-numbers  language-html notranslate"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>section</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>h2</span><span class="punctuation token">&gt;</span></span>Encabezado<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>h2</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"roble</span>.jpg<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"un roble</span><span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>section</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-
-
-<h2 id="Compatibilidad">Compatibilidad</h2>
-
-
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>5</td>
-   <td>{{ CompatGeckoDesktop("2.0") }}</td>
-   <td>9.0</td>
-   <td>11.10</td>
-   <td>4.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Móvil (Gecko)</th>
-   <th>IE Móvil</th>
-   <th>Opera Móvil</th>
-   <th>Safari Móvil</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.2</td>
-   <td>{{ CompatGeckoMobile("2.0") }}</td>
-   <td>9.0</td>
-   <td>11.0</td>
-   <td>5.0 (iOS 4.2)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>Otros elementos relacionados: {{ HTMLElement("body") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("article") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("h1") }}, {{ HTMLElement("h2") }}, {{ HTMLElement("h3") }}, {{ HTMLElement("h4") }}, {{ HTMLElement("h5") }}, {{ HTMLElement("h6") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("address") }};</li>
- <li class="last"><a class="deki-ns current" href="/en/Sections_and_Outlines_of_an_HTML5_document" title="en/Sections and Outlines of an HTML5 document">Secciones y esquemas de un documento en HTML5</a>.</li>
-</ul>
diff --git a/files/es/web/html/elemento/select/index.html b/files/es/web/html/elemento/select/index.html
deleted file mode 100644
index edaf0488ab..0000000000
--- a/files/es/web/html/elemento/select/index.html
+++ /dev/null
@@ -1,198 +0,0 @@
----
-title: <select>
-slug: Web/HTML/Elemento/select
-tags:
-  - Elemento
-  - Formulario(2)
-  - HTML
-  - Referencia
-  - Web
-  - formularios html(2)
-translation_of: Web/HTML/Element/select
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento select (<code>&lt;select&gt;</code>) de HTML representa un control que muestra un menú de opciones. Las opciones contenidas en el menú son representadas por elementos {{HTMLElement("option")}}, los cuales pueden ser agrupados por elementos {{HTMLElement("optgroup")}}. La opcion puede estar preseleccionada por el usuario.</p>
-
-<h2 id="Contenido">Contenido</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content categories">Content categories</a></td>
-   <td>Elementos <a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, <a href="/en-US/docs/HTML/Content_categories#Interactive_content" title="HTML/Content categories#Interactive content">interactive content</a>, <a href="/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">listed</a>, <a href="/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">labelable</a>, <a href="/en-US/docs/HTML/Content_categories#Form_resettable" title="HTML/Content categories#Form resettable">resettable</a>, y <a href="/en-US/docs/HTML/Content_categories#Form_submittable" title="HTML/Content categories#Form submittable">submittable</a> <a href="/en-US/docs/HTML/Content_categories#Form-associated_" title="HTML/Content categories#Form-associated ">form-associated</a>.</td>
-  </tr>
-  <tr>
-   <td>Contenido permitido</td>
-   <td>Uno o mas elementos {{HTMLElement("option")}} o {{HTMLElement("optgroup")}}.</td>
-  </tr>
-  <tr>
-   <td>Omisión de etiquetas</td>
-   <td>Ninguna, ambas etiquetas son obligatorias</td>
-  </tr>
-  <tr>
-   <td>Elementos padre permitidos</td>
-   <td>Cualquier elemento que permita phrasing content.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento incluye </span><a href="/en-US/docs/Web/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
-
-<dl>
- <dt>{{htmlattrdef("autofocus")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo permite especificar un formulario de control que debería tener enfoque de entrada cuando se carga la página, a no ser que el usuario lo sobreescriba, por ejemplo, escribiendo un control diferente. Solo un elemento formulario puede tener el elemento de enfoque de entrada por documento, por lo cual es un atributo booleano.</dd>
- <dt>{{htmlattrdef("disabled")}}</dt>
- <dd>El atributo booleano especifica que el usuario no puede interactuar con el control. Si este atributo no está especificado, el control hereda los ajustes del campo que lo contiene, por ejemplo del fielset; si no hay elemento contenido con el atributo disabled, entonces el control se considera enable (activado).</dd>
- <dt>{{htmlattrdef("form")}} {{HTMLVersionInline("5")}}</dt>
- <dd>El elemento formulario al cual el select está asociado (su propietario del formulario). Si este atributo está especificado, su valor deberá ser el ID de un formulario en el mismo documento. Esto te permite situar elementos en cualquier parte del documento, no solo de manera descendiente con respecto a su elemento formulario.</dd>
- <dt>{{htmlattrdef("multiple")}}</dt>
- <dd>Este elemento booleano indica que se pueden seleccionar múltiples opciones de la lista. Si no está especificado, solo se podrá seleccionar una opción cada vez.</dd>
- <dt>{{htmlattrdef("name")}}</dt>
- <dd>El nombre del elemento de control.</dd>
- <dt>{{htmlattrdef("required")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Es un elemento boooleano que indica si la opcion puede quedar sin seleccionar o si es requerida.</dd>
- <dt>{{htmlattrdef("size")}}</dt>
- <dd>Si el control se presenta como una lista con scroll en caja, este atributo representa el numero de filas que la list tendrá visible la primera vez. Los navegadores no están requeridos a presentar un elemento select como una lista con escroll en caja. El valor por defecto es cero.</dd>
-</dl>
-
-<div class="note"><strong>Nota de Firefox: </strong>De acuerdo con las especificaciones de HTML5, el tamaño por defecto debe ser 1; sin embargo, en la práctica, esto hace que se rompan algunas páginas webs, y ningun otro navegador actualmente hace esto, así que Mozilla ha optado por continuar usando 0 desde que empezó con Firefox.</div>
-
-<dl>
-</dl>
-
-<h2 id="DOM_Interface">DOM Interface</h2>
-
-<p>Este elemento implementa la interfaz <code><a href="/en-US/docs/DOM/HTMLSelectElement" title="DOM/select">HTMLSelectElement</a>.</code></p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;!-- The second value will be selected initially --&gt;
-&lt;select name="select"&gt;
-  &lt;option value="value1"&gt;Value 1&lt;/option&gt;
-  &lt;option value="value2" selected&gt;Value 2&lt;/option&gt;
-  &lt;option value="value3"&gt;Value 3&lt;/option&gt;
-&lt;/select&gt;
-</pre>
-
-<h4 id="Resultado">Resultado</h4>
-
-<p><select name="select"><option value="value1">Value 1</option><option selected value="value2">Value 2</option><option value="value3">Value 3</option></select></p>
-
-<h3 id="Notas">Notas</h3>
-
-<p>El contenido de este elemento es estático y no <a href="/en-US/docs/HTML/Content_Editable" title="HTML/Content_Editable">editable</a>.</p>
-
-<p>El siguiente ejemplo muestra como simular una lista con opciones editables, pero ten cuidado ya que algunos lectores de pantallas y dispositivos de ayuda no lo interpretarán de forma correcta; este ejemplo sería html inválido si usas los elementos correctos:</p>
-
-<p><a href="/files/4563/editable_select.html" style="line-height: 1.5;" title="Simulating an editable select through a fieldset of radioboxes and textboxes">This is an example</a> de un select editable mediante un<span style="line-height: 1.5;"> {{HTMLElement("fieldset")}} de </span><a href="/en-US/docs/HTML/Element/Input" style="line-height: 1.5;" title="HTML/Element/Input">radioboxes</a><span style="line-height: 1.5;"> y </span><a href="/en-US/docs/HTML/Element/Input" style="line-height: 1.5;" title="HTML/Element/Input">textboxes</a><span style="line-height: 1.5;"> (<strong>escrito en CSS puro</strong></span><span style="line-height: 1.5;">, sin JavaScript), </span></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML5 W3C', 'forms.html#the-select-element', '&lt;select&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.6', '&lt;select&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>required</code> attribute</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>10</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}} [1]</td>
-   <td>{{CompatGeckoMobile("1.0")}} [2]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>required</code> attribute</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<p>[1] En la aplicación navegador para Android 4.1 (y posiblemente en versiones posteriores), hay un error cuando el menu triangulo indicador al lado de un elemento {{HTMLElement("select")}} no se muestra si {{ cssxref("background") }}, {{ cssxref("border") }}, o {{ cssxref("border-radius") }} estilos están aplicados al {{HTMLElement("select")}}.</p>
-
-<p>[2] Firefox para Android, por defecto, establece un {{ cssxref("background-image") }} gradiente en todos los elementos <code>&lt;select multiple&gt;</code>. Esto puede desactivarse usando  <code>background-image: none</code>.</p>
-
-<p>[3] Históricamente, Firefox ha permitido eventos de teclado y ratón para mostrar desde el elemento <code>&lt;option&gt; al elemento padre </code>{{HTMLElement("select")}}. Esto no ocurre en Chrome, sin embargo, aunque este comportamiento sigue apareciendo de manera incosciente en muchos navegadores. Para una mayor compatibilidad Web (y por razones técnicas), cuando Firefox está en modo multitarea el elemento <code>&lt;select&gt;</code> se muestra como una lista descendente. Este comportamiento se produce sin cambios si <code>&lt;select&gt;</code>se presenta como elemento en línea y tiene multipleas atributos definidos o tiene un atributo de tamaño cuyo valor sea mayor que uno. Mejor que ver el elemento <code>&lt;option&gt;</code> para eventos, debería mirar el elemento de enventos {event("change")}} en {{HTMLElement("select")}}. Ver {{bug(1090602)}} para detalles.</p>
-
-<p>Tanto Chrome como Safari ignoran {{cssxref("border-radius")}} en los elementos {{HTMLElement("select")}} a no ser que {{cssxref("-webkit-appearance")}} esté invalidado a un valor apropiado.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Otros elementos relacionados de formularios: {{HTMLElement("form")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("button")}}, {{HTMLElement("option")}}, {{HTMLElement("datalist")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("input")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} and {{HTMLElement("meter")}}.</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/shadow/index.html b/files/es/web/html/elemento/shadow/index.html
deleted file mode 100644
index bd3cc37616..0000000000
--- a/files/es/web/html/elemento/shadow/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: <shadow>
-slug: Web/HTML/Elemento/Shadow
-translation_of: Web/HTML/Element/shadow
----
-<p>{{obsolete_header}}</p>
-
-<p><span class="seoSummary">El <strong>HTML <code>&lt;shadow&gt;</code> element</strong>—es una parte absoluta de la suite tecnológica de <a href="/en-US/docs/Web/Web_Components">Web Components</a> —estaba destinado a ser utilizado como un shadow DOM {{glossary("insertion point")}}. Es posible que lo hayas usado si has creado varias root shadow bajo un shadow host. No es útil en HTML ordinario.</span></p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Transparent_content_model">Transparent content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted content</th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Tag omission</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted parents</th>
-   <td>Any element that accepts flow content.</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted ARIA roles</th>
-   <td>None</td>
-  </tr>
-  <tr>
-   <th scope="row">DOM interface</th>
-   <td>{{domxref("HTMLShadowElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Attributes">Attributes</h2>
-
-<p>This element includes the <a href="/en-US/docs/Web/HTML/Global_attributes">global attributes</a>.</p>
-
-<h2 id="Example">Example</h2>
-
-<p>Aquí está un ejemplo simple usando el  <code>&lt;shadow&gt;</code> element. Es un archivo HTML con todo lo necesario en él.</p>
-
-<div class="note">
-<p><strong>Note:</strong> This is an experimental technology. For this code to work, the browser you display it in must support Web Components. See <a href="/en-US/docs/Web/Web_Components#Enabling_Web_Components_in_Firefox">Enabling Web Components in Firefox</a>.</p>
-</div>
-
-<pre class="brush: html">&lt;html&gt;
-  &lt;head&gt;&lt;/head&gt;
-  &lt;body&gt;
-
-  &lt;!-- This &lt;div&gt; will hold the shadow roots. --&gt;
-  &lt;div&gt;
-    &lt;!-- This heading will not be displayed --&gt;
-    &lt;h4&gt;My Original Heading&lt;/h4&gt;
-  &lt;/div&gt;
-
-  &lt;script&gt;
-    // Get the &lt;div&gt; above with its content
-    var origContent = document.querySelector('div');
-    // Create the first shadow root
-    var shadowroot1 = origContent.createShadowRoot();
-    // Create the second shadow root
-    var shadowroot2 = origContent.createShadowRoot();
-
-    // Insert something into the older shadow root
-    shadowroot1.innerHTML =
-      '&lt;p&gt;Older shadow root inserted by
-          &amp;lt;shadow&amp;gt;&lt;/p&gt;';
-    // Insert into younger shadow root, including &lt;shadow&gt;.
-    // The previous markup will not be displayed unless
-    // &lt;shadow&gt; is used below.
-    shadowroot2.innerHTML =
-      '&lt;shadow&gt;&lt;/shadow&gt; &lt;p&gt;Younger shadow
-       root, displayed because it is the youngest.&lt;/p&gt;';
-  &lt;/script&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<p>If you display this in a web browser it should look like the following.</p>
-
-<p><img alt="shadow example" src="https://mdn.mozillademos.org/files/10083/shadow-example.png" style="height: 343px; width: 641px;"></p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<p>This element is no longer defined by any specifications.</p>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>35</td>
-   <td>{{CompatGeckoDesktop("28")}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>26</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>37</td>
-   <td>{{CompatGeckoMobile("28")}}<sup>[1]</sup></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] If Shadow DOM is not enabled in Firefox, <code>&lt;shadow&gt;</code> elements will behave like {{domxref("HTMLUnknownElement")}}. Shadow DOM was first implemented in Firefox 33 and is behind a preference, <code>dom.webcomponents.enabled</code>, which is disabled by default.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/Web_Components">Web Components</a></li>
- <li>{{HTMLElement("content")}}, {{HTMLElement("slot")}}, {{HTMLElement("template")}}, {{HTMLElement("element")}}</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elemento/slot/index.html b/files/es/web/html/elemento/slot/index.html
deleted file mode 100644
index b7a7407d83..0000000000
--- a/files/es/web/html/elemento/slot/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: <slot>
-slug: Web/HTML/Elemento/slot
-tags:
-  - Componentes Web
-  - Componentes Web HTML
-  - Elemento
-  - HTML
-  - Referencia
-  - slot
-  - sombra dom
-translation_of: Web/HTML/Element/slot
----
-<p>{{HTMLRef}}</p>
-
-<p><span class="seoSummary"><strong>El elemento HTML <code>&lt;slot&gt;</code> </strong>—parte de la suite tecnologica <a href="/en-US/docs/Web/Web_Components">Web Components</a> — es un placeholder en un componente que tu puedes llenar con tu propio marcado, que te permite crear árboles DOM por separado y presentarlos juntos. </span></p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorias de contenido</a></th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">contenido de fraseo</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Transparent_content_model">Transparente</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Eventos</th>
-   <td>{{event("slotchange")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Parentes permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Rol ARIA implícito</th>
-   <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">No corresponding role</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA Permitidos</th>
-   <td>No se permite <code>role</code></td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLSlotElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>   {{htmlattrdef("name")}}</dt>
- <dd>El nombre del slot.</dd>
- <dd><dfn>Un<strong> </strong></dfn><strong><dfn>slot nombrado</dfn></strong> es un elemento <code>&lt;slot&gt;</code>  con el atributo  <code>name</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;template id="element-details-template"&gt;
-  &lt;style&gt;
-    details {font-family: "Open Sans Light",Helvetica,Arial}
-    .name {font-weight: bold; color: #217ac0; font-size: 120%}
-    h4 { margin: 10px 0 -8px 0; }
-    h4 span { background: #217ac0; padding: 2px 6px 2px 6px }
-    h4 span { border: 1px solid #cee9f9; border-radius: 4px }
-    h4 span { color: white }
-    .attributes { margin-left: 22px; font-size: 90% }
-    .attributes p { margin-left: 16px; font-style: italic }
-  &lt;/style&gt;
-  &lt;details&gt;
-    &lt;summary&gt;
-      &lt;span&gt;
-        &lt;code class="name"&gt;&amp;lt;&lt;slot name="element-name"&gt;NEED NAME&lt;/slot&gt;&amp;gt;&lt;/code&gt;
-        &lt;i class="desc"&gt;&lt;slot name="description"&gt;NEED DESCRIPTION&lt;/slot&gt;&lt;/i&gt;
-      &lt;/span&gt;
-    &lt;/summary&gt;
-    &lt;div class="attributes"&gt;
-      &lt;h4&gt;&lt;span&gt;Attributes&lt;/span&gt;&lt;/h4&gt;
-      &lt;slot name="attributes"&gt;&lt;p&gt;None&lt;/p&gt;&lt;/slot&gt;
-    &lt;/div&gt;
-  &lt;/details&gt;
-  &lt;hr&gt;
-&lt;/template&gt;</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Puedes ver este ejemplo en accion en  <a class="external external-icon" href="https://github.com/mdn/web-components-examples/tree/master/element-details" rel="noopener">element-details</a> (velo <a class="external external-icon" href="https://mdn.github.io/web-components-examples/element-details/" rel="noopener">running live</a>). Además, puedes encontrar una explicación en <a href="/en-US/docs/Web/Web_Components/Using_templates_and_slots">Using templates and slots</a>.</p>
-</div>
-
-<ul>
-</ul>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG','scripting.html#the-slot-element','&lt;slot&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#shadow-tree-slots','Slots')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.slot")}}</p>
diff --git a/files/es/web/html/elemento/small/index.html b/files/es/web/html/elemento/small/index.html
deleted file mode 100644
index 21f0cb4331..0000000000
--- a/files/es/web/html/elemento/small/index.html
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: small
-slug: Web/HTML/Elemento/small
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/small
----
-<p>El <strong>elemento HTML &lt;small&gt;</strong> hace el tamaño del texto una talla más pequeña (por ejemplo, de largo a mediano, o de pequeño a extra pequeño) que el tamaño mínimo de fuente del navegador. En HTML5, este elemento es reutilizado para representar comentarios laterales y letra pequeña, incluyendo derechos de autor y texto legal, independientemente de su estilo de presentación.</p>
-
-<p>{{EmbedInteractiveExample("pages/tabbed/small.html", "tabbed-shorter")}}</p>
-
-<p> </p>
-
-<p> </p>
-
-<p> </p>
-
-<p> </p>
diff --git a/files/es/web/html/elemento/source/index.html b/files/es/web/html/elemento/source/index.html
deleted file mode 100644
index c116ef3464..0000000000
--- a/files/es/web/html/elemento/source/index.html
+++ /dev/null
@@ -1,129 +0,0 @@
----
-title: <source>
-slug: Web/HTML/Elemento/source
-tags:
-  - Elemento
-  - HTML
-  - Media
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/source
----
-<p>El <strong>elemento HTML <code>&lt;source&gt;</code> </strong> especifica recursos de medios múltiples para los elementos {{HTMLElement("picture")}}, {{HTMLElement("audio")}}, o {{HTMLElement("video")}}. Es un elemento vacío. Normalmente se utiliza para servir el mismo contenido multimedia en <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements">varios formatos soportados por diferentes navegadores</a>.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/source.html", "tabbed-standard")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si desea contribuir al proyecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíenos una solicitud de pull.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías de contenido</a></th>
-   <td>Ninguna.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno, esto es un {{Glossary("empty element")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de Etiqueta</th>
-   <td>Debe tener una etiqueta inicial, pero no debe tener una etiqueta final.</td>
-  </tr>
-  <tr>
-   <th scope="row"><dfn>Padres permitidos</dfn></th>
-   <td>
-    <div>Un elemento multimedia—{{HTMLElement("audio")}} o {{HTMLelement("video")}}—y se debe colocar antes que cualquier <a href="/en-US/docs/HTML/Content_categories#Flow_content">contenido de flujo</a> o elemento {{HTMLElement("track")}}.</div>
-
-    <div>Un elemento {{HTMLElement("picture")}}, y se debe colocar antes del elemento {{HTMLElement("img")}}.</div>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>Ninguno</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <th> </th>
-   <td>{{domxref("HTMLSourceElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("sizes")}} {{experimental_inline}}</dt>
- <dd>Es una lista de tamaños del origen que describe el ancho renderizado final de la imagen representada por el origen. Cada tamaño de origen consiste de una lista separada por comas de pares de longitud de condición de medios. Esta información es utilizada por el navegador para determinar, antes de distribuir la página, qué imagen definida en {{htmlattrxref("srcset", "source")}} se utilizará.<br>
- El atributo <code>sizes</code> tiene un efecto solo cuando el elemento {{HTMLElement("source")}} es hijo directo de un elemento {{HTMLElement("picture")}}.</dd>
- <dt>{{htmlattrdef("src")}}</dt>
- <dd>Es la ubicación del recurso multimedia, requerido por los elementos {{HTMLElement("audio")}} y {{HTMLElement("video")}}. El valor de este atributo es ignorado cuando el elemento <code>&lt;source&gt;</code> se coloca dentro de un elemento {{HTMLElement("picture")}}.</dd>
- <dt>{{htmlattrdef("srcset")}} {{experimental_inline}}</dt>
- <dd>Una lista de una o más cadenas separadas por comas que indican un conjunto de posibles imágenes representadas por la fuente para que las utilice el navegador. Cada cadena se compone de:
- <ol>
-  <li>una URL a una imagen,</li>
-  <li>un descriptor de ancho, que es un entero positivo seguido directamente por <code>'w'</code>. El valor predeterminado, si falta, es el infinito.</li>
-  <li>un descriptor de densidad de píxeles, que es un número flotante positivo seguido directamente por <code>'x'</code>. El valor predeterminado, si falta, es <code>1x</code>.</li>
- </ol>
-
- <p>Cada cadena en la lista debe tener al menos un descriptor de ancho o un descriptor de densidad de píxeles para que sea válido. Entre los elementos de la lista, solo debe haber una cadena que contenga la misma tupla de descriptor de ancho y descriptor de densidad de píxeles.<br>
-  El navegador elige la imagen más adecuada para mostrar en un momento determinado.<br>
-  El atributo <code>srcset</code> solo tiene efecto cuando el elemento {{HTMLElement("source")}} es hijo directo de un elemento {{HTMLElement("picture")}}.</p>
- </dd>
- <dt>{{htmlattrdef("type")}}</dt>
- <dd>El tipo MIME del recurso, opcionalmente con un parámetro <code>codecs</code>. Consultar <a class="external" href="https://tools.ietf.org/html/rfc4281"> RFC 4281 </a> para obtener información sobre cómo especificar los códecs.</dd>
- <dt>{{htmlattrdef("media")}} {{experimental_inline}}</dt>
- <dd><a class="internal" href="/en-US/docs/CSS/Media_queries">Consulta multimedia</a> de los medios destinados al recurso; esto solo debe usarse en un elemento {{HTMLElement("picture")}}.</dd>
-</dl>
-
-<p>Si el atributo <code>type</code> no se especifica, el tipo de medio se recupera del servidor y se verifica para ver si el agente de usuario puede manejarlo; si no se puede procesar, se comprueba el siguiente <code>&lt;source&gt;</code>. Si se especifica el atributo <code>type</code>, se compara con los tipos que puede presentar el agente de usuario y, si no se reconoce, el servidor ni siquiera recibe consultas; en su lugar, el siguiente elemento <code>&lt;source&gt;</code> se comprueba a la vez.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Este ejemplo muestra cómo ofrecer un video en formato Ogg para usuarios cuyos navegadores admiten el formato Ogg, y un video en formato QuickTime para usuarios cuyos navegadores lo admiten. Si el navegador no admite los elementos <code>audio</code> o <code>video</code>, se muestra un aviso. Si el navegador admite los elementos pero no admite ninguno de los formatos especificados, se genera un evento <code>error</code> y los controles de medios predeterminados (si están habilitados) indicarán un error. Consulte también la lista de <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements">formatos de medios compatibles con los elementos de audio y video</a> en varios navegadores.</p>
-
-<pre class="brush: html">&lt;video controls&gt;
-  &lt;source src="foo.webm" type="video/webm"&gt;
-  &lt;source src="foo.ogg" type="video/ogg"&gt;
-  &lt;source src="foo.mov" type="video/quicktime"&gt;
-  Lo lamento; su navegador no soporta video HTML5.
-&lt;/video&gt;
-</pre>
-
-<p>Para obtener más ejemplos, consulte <a class="internal" href="/en-US/docs/Using_HTML5_audio_and_video">Uso de audio y video en Firefox</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'embedded-content.html#the-source-element', '&lt;source&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compaibilidad_entre_navegadores">Compaibilidad entre navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de pull.</div>
-
-<p>{{Compat("html.elements.source")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Elemento {{HTMLElement("picture")}}</li>
- <li>Elemento {{HTMLElement("audio")}}</li>
- <li>Elemento {{HTMLElement("video")}}</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/span/index.html b/files/es/web/html/elemento/span/index.html
deleted file mode 100644
index 38a79bda5c..0000000000
--- a/files/es/web/html/elemento/span/index.html
+++ /dev/null
@@ -1,166 +0,0 @@
----
-title: span
-slug: Web/HTML/Elemento/span
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/span
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>span</strong> - <em>abarcar</em>. Es un contenedor en línea. Sirve para aplicar estilo al texto o agrupar elementos en línea.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;span&gt;</code> y <code>&lt;/span&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="/es/HTML/Elemento/Tipos_de_elementos#especial" title="es/HTML/Elemento/Tipos_de_elementos#especial">especial</a>, y por lo tanto <a href="/es/HTML/Elemento/Tipos_de_elementos#enlinea" title="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En línea.</dd>
- <dd><strong>Puede contener</strong>: Texto, y/o Elementos <a href="/es/HTML/Elemento/Tipos_de_elementos#enlinea" title="es/HTML/Elemento/Tipos_de_elementos#enlinea">en línea</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td><code style="color: green;">datasrc </code></td>
-   <td>Enlaza a una fuente de datos externa (individual o tabular). Reservado para posibles usos futuros.</td>
-   <td>Una dirección URI. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">datafld </code></td>
-   <td>El nombre de una propiedad o columna de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
-   <td>Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><code style="color: green;">dataformatas </code></td>
-   <td>Indica como deben ser tratados los datos obtenidos de <code style="color: green;">datasrc</code>. Reservado para posibles usos futuros.</td>
-   <td>Uno de los siguientes: <code>'paintext'</code> o <code>'html</code>'. Por defecto: <code>'plaintext'</code></td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="div_y_span" name="div_y_span">div y span</h4>
-
-<p>código:</p>
-
-<pre class="eval">&lt;div style="border: 1px dotted blue;"&gt;
-  &lt;h4&gt;Ejemplo de div y span &lt;/h4&gt;
-   &lt;p&gt;
-    Esto es un párrafo dentro de un div,
-     &lt;span style="color: red;"&gt; y esto un span dentro de un párrafo. &lt;/span&gt;
-   &lt;/p&gt;
- &lt;/div&gt;
-</pre>
-
-<p>Resultado:</p>
-
-<div style="border: solid silver 1px;">
-<div style="border: 1px dotted blue;">
-<h5 id="Ejemplo_de_div_y_span" name="Ejemplo_de_div_y_span">Ejemplo de div y span</h5>
-
-<p>Esto es un párrafo dentro de un div, <span style="color: red;"> y esto un span dentro de un párrafo.</span></p>
-</div>
-</div>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<p>Por definición span no debe tener ningún estilo predefinido. Estos dos párrafos deben verse igual:</p>
-
-<pre class="eval">&lt;p&gt; Esto es un párrafo, bla, bla, bla. &lt;/p&gt;
-&lt;p&gt; Esto es un párrafo, &lt;span&gt;bla, bla, bla.&lt;/span&gt; &lt;/p&gt;
-</pre>
-
-<p> </p>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#edef-SPAN"><strong>span</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-span">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/strike/index.html b/files/es/web/html/elemento/strike/index.html
deleted file mode 100644
index cb33cc0fe7..0000000000
--- a/files/es/web/html/elemento/strike/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: strike
-slug: Web/HTML/Elemento/strike
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/strike
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Muestra el texto tachado con una linea horizontal.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;strike&gt; y &lt;/strike&gt; (Ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>:<a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>:<a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
-
-<ul>
- <li>title (título del elemento)</li>
- <li>style (información de estilo en línea)</li>
-</ul>
-
-<dl>
- <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
- <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
- <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
-</dl>
-
-<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
-
-<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">  &lt;p&gt;
-       Texto normal y... &lt;strike&gt;Texto tachado&lt;/strike&gt;
-  &lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<div class="warning">DESAPROBADO</div>
-
-<p><span class="comment">de momento no funciona </span></p>
diff --git a/files/es/web/html/elemento/strong/index.html b/files/es/web/html/elemento/strong/index.html
deleted file mode 100644
index e04ea0a0e7..0000000000
--- a/files/es/web/html/elemento/strong/index.html
+++ /dev/null
@@ -1,58 +0,0 @@
----
-title: strong
-slug: Web/HTML/Elemento/strong
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/strong
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>El elemento <strong>strong</strong> es el apropiado para marcar con especial énfasis las partes más importantes de un texto.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;strong&gt; y &lt;/strong&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
-
-<ul>
- <li>title (título del elemento)</li>
- <li>style (información de estilo en línea)</li>
-</ul>
-
-<dl>
- <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
- <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
- <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
-</dl>
-
-<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
-
-<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval"> &lt;p&gt;
-     &lt;em&gt;El dinero&lt;/em&gt; es importante pero &lt;strong&gt;la salud&lt;/strong&gt; lo es más.
- &lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p><strong>strong</strong> tiene un hermano menor: <strong>em</strong>. <strong>em</strong> sirve para dar énfasis y <strong>strong</strong> para dar mucho énfasis</p>
diff --git a/files/es/web/html/elemento/style/index.html b/files/es/web/html/elemento/style/index.html
deleted file mode 100644
index c298d810ad..0000000000
--- a/files/es/web/html/elemento/style/index.html
+++ /dev/null
@@ -1,122 +0,0 @@
----
-title: style
-slug: Web/HTML/Elemento/style
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/style
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>style</strong> - estilo. Es el elemento encargado de indicar la información de estilo.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;style&gt;</code> y <code>&lt;/style&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#decabecera">de cabecera</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: No.</dd>
- <dd><strong>Puede contener</strong>: Declaraciones de estilo.</dd>
- <dd><strong>Debe ser contenido por</strong>: Elementos <a href="es/HTML/Elemento/Tipos_de_elementos#head">head</a>.</dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<p><del>Por defecto:</del> Debe indicarlo el autor.</p>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-type-STYLE"><code style="color: green;">type </code></a></td>
-   <td>Indica el lenguaje de hojas de estilo usado.</td>
-   <td>Un tipo <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-content-type">MIME</a>. Para CSS es: "text/css".</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-media"><code style="color: green;">media </code></a></td>
-   <td>Indica el/los medios a los que está destinada la información de estilo.</td>
-   <td>Uno o más <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-media-descriptors">descriptores de medio</a> separados por coma. Por defecto: 'screen'. Lo fija el navegador</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h4 id="Ejemplo_simple" name="Ejemplo_simple">Ejemplo simple</h4>
-
-<pre class="eval">&lt;<strong>style</strong> type="text/css"&gt;
- p { color: red; }
-&lt;/<strong>style</strong>&gt;
-&lt;p&gt; Texto en rojo &lt;/p&gt;
-</pre>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#edef-STYLE"><strong>style</strong> en la especificación</a> de html 4.01</li>
- <li>Especificación de <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/css/cover.html">CSS 2</a></li>
-</ul>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-style">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/sub/index.html b/files/es/web/html/elemento/sub/index.html
deleted file mode 100644
index 4140eaa5cf..0000000000
--- a/files/es/web/html/elemento/sub/index.html
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: sub
-slug: Web/HTML/Elemento/sub
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/sub
----
-<p>{{HTMLRef}}</p>
-
-<p>El <strong>elemento HTML</strong> &lt;sub&gt; define un fragmento de texto que se debe mostrar, por razones tipográficas, más bajo, y generalmente más pequeño, que el tramo principal del texto, es decir, en subíndice.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Categorías de contenido</a></th>
-   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_din%C3%A1mico">Contenido dinamíco</a>(Flow content) y <a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a>(phrasing content)</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Omission de etiquetas</th>
-   <td><font><font>Ninguna, tanto la etiqueta de apertura y cierre deben estar presentes</font></font></td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padres permitidos</th>
-   <td><font><font>Cualquier elemento que acepte contenido estático o de texto</font></font></td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>Cualquiera</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento sólo incluye los <a href="/en-US/docs/HTML/Global_attributes">atributos globales</a>.</p>
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<ul>
- <li><font><font>Este elemento debe ser utilizado sólo por razones tipográficas, es decir, cambiar la posición del texto cambia su significado como en matemática</font></font> (por ejemplo la fórmula matemática <var>t<sub>2</sub></var>, aunque se debe considerar el uso de <a href="/en-US/docs/MathML">MathML</a>) <font><font>o fórmulas químicas</font></font> (por ejemplo <code>H<sub>2</sub>O</code>).</li>
- <li>Este elemento no debe ser utilizado para propósitos meramente visuales, como el estilo del logo del software<a class="external external-icon" href="https://es.wikipedia.org/wiki/LaTeX"> LaTeX</a> <a href="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png"><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png" style="height: 23px; vertical-align: bottom; width: 56px;"></a>. En ese caso debe usarse la propiedad de <a href="https://developer.mozilla.org/en-US/docs/CSS" title="en/CSS">CSS</a> <code>vertical-align</code>  para lograr el mismo efecto.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;p&gt;La fórmula química de agua: H&lt;sub&gt;2&lt;/sub&gt;O&lt;/p&gt;
-</pre>
-
-<h4 id="Resultado">Resultado</h4>
-
-<p>La fórmula química de agua: H<sub>2</sub>O</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-sub-and-sup-elements', '&lt;sub&gt; and &lt;sup&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'textlevel-semantics.html#the-sub-and-sup-elements', '&lt;sub&gt; and &lt;sup&gt;;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_navegadores">Compatibilidad navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.sub")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El elemento HTML <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/sup">&lt;sup&gt;</a> produce superíndice. Tenga en cuenta que no puedes usar &lt;sup&gt;  y &lt;sub&gt;  ambos al mismo tiempo y necesita usar <a href="https://developer.mozilla.org/en-US/docs/MathML" title="en/MathML">MathML</a> para producir un superíndice y un subíndice al lado del símbolo químico de un elemento, que representa su número atómico y su número nuclear.
-
-  <p><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/db/Element_identity.png/220px-Element_identity.png" style="height: 63px; width: 63px;"></p>
- </li>
- <li>Los elementos MathML<a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msub" title="en/MathML/Element/msub"><code>&lt;msub&gt;</code></a>, <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msup" title="en/MathML/Element/msup"><code>&lt;msup&gt;</code></a>, y <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msubsup" title="en/MathML/Element/msubsup"><code>&lt;msubsup&gt;</code></a> .</li>
-</ul>
diff --git a/files/es/web/html/elemento/sup/index.html b/files/es/web/html/elemento/sup/index.html
deleted file mode 100644
index 51f98765f1..0000000000
--- a/files/es/web/html/elemento/sup/index.html
+++ /dev/null
@@ -1,110 +0,0 @@
----
-title: sup
-slug: Web/HTML/Elemento/sup
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/sup
----
-<p>El <strong>elemento HTML</strong> &lt;sup&gt; define un fragmento de texto que se debe mostrar, por razones tipográficas, más alto, y generalmente más pequeño, que el tramo principal del texto, es decir, en superíndice.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="https://developer.mozilla.org/en-US/docs/HTML/Content_categories" title="en/HTML/Content categories">Categorías de contenido</a></th>
-   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_din%C3%A1mico">Contenido dinamíco</a>(Flow content) y <a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a>(phrasing content)</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="https://developer.mozilla.org/es/docs/Web/Guide/HTML/categorias_de_contenido#Contenido_est%C3%A1tico_o_de_texto">contenido estático o de texto</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td><font><font>Ninguna, tanto la etiqueta de apertura y cierre deben estar presentes</font></font></td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td><font><font>Cualquier elemento que acepte contenido estático o de texto</font></font></td>
-  </tr>
-  <tr>
-   <th scope="row"><font><font>Roles ARIA permitidos</font></font></th>
-   <td><font><font>Cualquiera</font></font></td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td><font><font><a href="https://developer.mozilla.org/es/docs/Web/API/HTMLElement" title="The HTMLElement interface represents any HTML element. Some elements directly implement this interface, others implement it via an interface that inherits it."><code>HTMLElement</code></a></font></font></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 class="highlight-spanned" id="Atributos"><span class="highlight-span">Atributos</span></h2>
-
-<p>Este elemento sólo incluye los <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes">atributos globales</a>.</p>
-
-<h2 class="highlight-spanned" id="Notas_de_uso"><span class="highlight-span">Notas de uso</span></h2>
-
-<ul>
- <li><font><font>Este elemento debe ser utilizado sólo por razones tipográficas, es decir, cambiar la posición del texto cambia su significado como en matemática </font></font> (por ejemplo la fórmula matemática  <var>f<sup>4</sup></var>, aunque se debe considerar el uso de <a href="https://developer.mozilla.org/en-US/docs/Web/MathML">MathML</a>)  <font><font>o en las abreviaturas francesas </font></font>(por ejemplo M<sup>lle</sup>, M<sup>me</sup> or C<sup>ie</sup>).</li>
- <li>Este elemento también  se puede encontrar siguiendo palabras o frases. Estas anotaciones indican una entrada bibliográfica y se conocen como "notas al pie."</li>
- <li>Este elemento no debe ser utilizado para propósitos meramente visuales, como el estilo del logo del software<a class="external external-icon" href="https://es.wikipedia.org/wiki/LaTeX"> LaTeX</a> <a href="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png"><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/LaTeX_logo.svg/1200px-LaTeX_logo.svg.png" style="height: 23px; vertical-align: bottom; width: 56px;"></a>. En ese caso debe usarse la propiedad de <a href="https://developer.mozilla.org/en-US/docs/CSS" title="en/CSS">CSS</a> <code>vertical-align</code>  para lograr el mismo efecto.</li>
-</ul>
-
-<h2 class="highlight-spanned" id="Ejemplos"><span class="highlight-span">Ejemplos</span></h2>
-
-<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Este texto es <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>sup</span><span class="punctuation token">&gt;</span></span>superíndice<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>sup</span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>p</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<h4 id="Resultado">Resultado</h4>
-
-<p>Este texto es <sup>superíndice</sup></p>
-
-<pre class="brush: html">&lt;p&gt;Notas al pie&lt;sup&gt;<sup>1</sup>&lt;/sup&gt;&lt;/p&gt;
-</pre>
-
-<h4 id="Resultado_2">Resultado</h4>
-
-<p>Notas al pie<sup>1</sup></p>
-
-<h2 class="highlight-spanned" id="Especificaciones"><span class="highlight-span">Especificaciones</span></h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><a class="external external-icon" href="https://html.spec.whatwg.org/multipage/semantics.html#the-sub-and-sup-elements" hreflang="en" lang="en">HTML Living Standard<br>
-    <small lang="es">The definition of '&lt;sub&gt; and &lt;sup&gt;' in that specification.</small></a></td>
-   <td><span class="spec-Living">Living Standard</span></td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td><a class="external external-icon" href="http://www.w3.org/TR/html5/textlevel-semantics.html#the-sub-and-sup-elements" hreflang="en" lang="en">HTML5<br>
-    <small lang="es">The definition of '&lt;sub&gt; and &lt;sup&gt;;' in that specification.</small></a></td>
-   <td><span class="spec-REC">Recommendation</span></td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_navegadores">Compatibilidad navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.sup")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El elemento HTML <a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/sub">&lt;sub&gt;</a> produce subíndices. Tenga en cuenta que no puedes usar &lt;sup&gt;  y &lt;sub&gt;  ambos al mismo tiempo y necesita usar <a href="https://developer.mozilla.org/en-US/docs/MathML" title="en/MathML">MathML</a> para producir un superíndice y un subíndice al lado del símbolo químico de un elemento, que representa su número atómico y su número nuclear.
-
-  <p><img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/d/db/Element_identity.png/220px-Element_identity.png" style="height: 63px; width: 63px;"></p>
- </li>
- <li>Los elementos MathML<a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msub" title="en/MathML/Element/msub"><code>&lt;msub&gt;</code></a>, <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msup" title="en/MathML/Element/msup"><code>&lt;msup&gt;</code></a>, y <a href="https://developer.mozilla.org/en-US/docs/MathML/Element/msubsup" title="en/MathML/Element/msubsup"><code>&lt;msubsup&gt;</code></a> .</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/table/index.html b/files/es/web/html/elemento/table/index.html
deleted file mode 100644
index 1dffe0d7c2..0000000000
--- a/files/es/web/html/elemento/table/index.html
+++ /dev/null
@@ -1,525 +0,0 @@
----
-title: tabla
-slug: Web/HTML/Elemento/table
-translation_of: Web/HTML/Element/table
----
-<h2 id="Resumen">Resumen</h2>
-<p>El <em>Elemento de Tabla HTML</em> (<code>&lt;table&gt;</code>) representa datos en dos o mas dimensiones.</p>
-<div class="note">
-  <strong>Nota: </strong>Antes de la creación de <a href="/es/docs/CSS" title="CSS">CSS</a>, los elementos HTML {{HTMLElement("table")}} eran frecuentemente utilizados para la disposición (posicionamiento) de una página. Este uso ha sido desalentado desde HTML 4, y el elemento <span style="font-weight: bold;">no debe</span> ser usado para dichos fines.</div>
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-<table class="standard-table">
-  <tbody>
-    <tr>
-      <td><a href="/es/docs/HTML/Content_categories" title="HTML/Content categories">Categoria del contenido</a></td>
-      <td><a href="/es/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flujo del contenido</a></td>
-    </tr>
-    <tr>
-      <td>Contenido permitido</td>
-      <td>
-        <div class="content-models">
-          <div id="table-mdls">
-            En este orden:
-            <ul>
-              <li>un elemento opcional {{HTMLElement("caption")}},</li>
-              <li>cero o mas elementos {{HTMLElement("colgroup")}},</li>
-              <li>un elemento opcional {{HTMLElement("thead")}},</li>
-              <li>una de las dos alternativas:
-                <ul>
-                  <li>un elemento {{HTMLElement("tfoot")}}, seguido por:
-                    <ul>
-                      <li>cero o mas elementos {{HTMLElement("tbody")}},</li>
-                      <li>o uno o mas elementos {{HTMLElement("tr")}},</li>
-                    </ul>
-                  </li>
-                  <li>una segunda alternativa seguida por un elemento opcional {{HTMLElement("tfoot")}}:
-                    <ul>
-                      <li>cualquier cero o mas elementos {{HTMLElement("tbody")}},</li>
-                      <li>uno o mas elementos {{HTMLElement("tr")}}</li>
-                    </ul>
-                  </li>
-                </ul>
-              </li>
-            </ul>
-          </div>
-        </div>
-      </td>
-    </tr>
-    <tr>
-      <td>Omisión de etiqueta</td>
-      <td>Ninguna, ambas la <span title="syntax-start-tag">etiqueta de inicio</span> y <span title="syntax-end-tag">de fin</span> son obligatorias</td>
-    </tr>
-    <tr>
-      <td>Elementos padre permitidos</td>
-      <td>cualquier elemento que acepte elementos de flujo</td>
-    </tr>
-    <tr>
-      <td>Documento normativo</td>
-      <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#the-table-element" rel="external nofollow" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#the-table-element">HTML5, section 4.9.1</a> (<a class="external" href="http://www.w3.org/TR/REC-html40/struct/tables.html#edef-TABLE" title="http://www.w3.org/TR/REC-html40/struct/tables.html#edef-TABLE">HTML4.01, section 11.2.1</a>)</td>
-    </tr>
-  </tbody>
-</table>
-<h3 id="Atributos">Atributos</h3>
-<p>Al igual que otros elementos HTML, este elemento también soporta <a href="/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">atributos globales</a>.</p>
-<dl>
-  <dt>
-    {{htmlattrdef("align")}} {{Deprecated_inline}}</dt>
-  <dd>
-     Este atributo enumerativo indica como va a encontrarse alineada la tabla respecto al contenido del documento en cuestión, pudiendo tener los siguientes valores:
-    <ul>
-      <li><span>left</span>,significa que la tabla será mostrada a la izquierda del documento;</li>
-      <li><span>center</span>, significa que la tabla será mostrada al centro del documento;</li>
-      <li><span>right</span>, significa que la tabla será mostrada a la derecha del documento.</li>
-    </ul>
-    <div class="note">
-      <strong>Nota: </strong>
-      <ul>
-        <li><strong>No usar este atributo</strong>, ya que ha sido declarado obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. A fin de dar un efecto similar al atributo <span>align</span>, las propiedades {{cssxref("text-align")}} y {{cssxref("vertical-align")}} deben ser usadas.</li>
-        <li>Antes de la version 4 de Firefox, este ya soportaba sólo en el modo quirks (compatibilidad con navegadores antiguos) los valores <code>middle</code>, <code>absmiddle</code>, and <code>abscenter</code> como sinónimos de <code>center</code><em>.  </em></li>
-      </ul>
-    </div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("bgcolor")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo define el color de fondo de la tabla . Es un código hexadecimal como el dado en el formato <a class="external" href="http://www.w3.org/Graphics/Color/sRGB" title="http://www.w3.org/Graphics/Color/sRGB">sRGB</a> (bajo el prefijo '#'). Uno de los 16 colores predefinidos podía ser usado:
-    <table>
-      <tbody>
-        <tr>
-          <td style="width: 24px; background-color: black;"> </td>
-          <td><span>black (negro)</span> = "#000000"</td>
-          <td style="width: 24px; background-color: green;"> </td>
-          <td><span>green (verde)</span> = "#008000"</td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: silver;"> </td>
-          <td><span>silver (plata)</span> = "#C0C0C0"</td>
-          <td style="width: 24px; background-color: lime;"> </td>
-          <td><span>lime (lima)</span> = "#00FF00"</td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: gray;"> </td>
-          <td><span>gray (gris)</span> = "#808080"</td>
-          <td style="width: 24px; background-color: olive;"> </td>
-          <td><span>olive (oliva)</span> = "#808000"</td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: white;"> </td>
-          <td><span>white (blanco)</span> = "#FFFFFF"</td>
-          <td style="width: 24px; background-color: yellow;"> </td>
-          <td><span>yellow (amarillo)</span> = "#FFFF00"</td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: maroon;"> </td>
-          <td><span>maroon (marrón)</span> = "#800000"</td>
-          <td style="width: 24px; background-color: navy;"> </td>
-          <td><span>navy (azul marino)</span> = "#000080"</td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: red;"> </td>
-          <td><span>red (rojo)</span> = "#FF0000"</td>
-          <td style="width: 24px; background-color: blue;"> </td>
-          <td><span>blue (azul)</span> = "#0000FF"</td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: purple;"> </td>
-          <td><span>purple (púrpura)</span> = "#800080"</td>
-          <td style="width: 24px; background-color: teal;"> </td>
-          <td><span>teal (verde esmeralda)</span> = "#008080"</td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: fuchsia;"> </td>
-          <td><span>fuchsia (fucsia)</span> = "#FF00FF"</td>
-          <td style="width: 24px; background-color: aqua;"> </td>
-          <td><span>aqua (verde agua)</span> = "#00FFFF"</td>
-        </tr>
-      </tbody>
-    </table>
-    <div class="note">
-      <strong>Nota de uso: </strong>No usar este atributo, dado que ha sido declarado obsoleto. El elemento {{HTMLElement("table")}} debe ser estilizado utilizando <a href="/es/docs/CSS" title="CSS">CSS</a>. A fin de dar un efecto similar al atributo <span>bgcolor</span>, la propiedad <a href="/es/docs/CSS" title="CSS">CSS</a> {{cssxref("background-color")}} debe ser usada.</div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("border")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo entero define el tamaño del cuadro alrededor de la tabla . Si estuviese puesta en <span>0</span>, implicaría que dicho atributo sería <span>nulo</span>.
-    <div class="note">
-      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. A fin de dar un efecto similar al atributo, las propiedades CSS nativas {{cssxref("border")}}, {{cssxref("border-color")}}, {{cssxref("border-width")}} y {{cssxref("border-style")}} deben ser usadas.</div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("cellpadding")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo define el espacio entre el contenido de una celda y su borde (mostrado o no), si fuese la longitud de un pixel, dicho espacio será aplicado en los 4 costados, caso que fuese un porcentaje, el contenido será centrado y todo el espacio vertical representará a este porcentaje. Lo mismo será válido para todo el espacio horizontal
-    <div class="note">
-      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>border</span>, use la propiedad CSS {{cssxref("border-collapse")}} con el valor collapse en el mismo elemento {{HTMLElement("table")}}, y la propiedad {{cssxref("padding")}} en el elemento {{HTMLElement("td")}}.</div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("cellspacing")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo define el espacio entre el contenido de una celda y su borde (mostrado o no), si fuese la longitud de un pixel, dicho espacio será aplicado en los 4 costados, caso que fuese un porcentaje, el contenido será centrado y todo el espacio vertical representará a este porcentaje. Lo mismo será válido para todo el espacio horizontal.
-    <div class="note">
-      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>border</span>, use la propiedad {{cssxref("border-collapse")}} con el valor collapse en el mismo elemento {{HTMLElement("table")}}, y la propiedad {{cssxref("margin")}} en el elemento {{HTMLElement("td")}}.</div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("frame")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo enumerativo define cual lado del cuadro alrededor de la tabla será mostrada. Puede tener los siguientes valores:
-    <table style="width: 668px;">
-      <tbody>
-        <tr>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>above</span></td>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>below</span></td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>hsides</span></td>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>vsides</span></td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>lhs</span></td>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>rhs</span></td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>border</span></td>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>box</span></td>
-        </tr>
-        <tr>
-          <td style="width: 24px; background-color: rgb(224, 224, 224);"> </td>
-          <td><span>void</span></td>
-        </tr>
-      </tbody>
-    </table>
-    <div class="note">
-      <strong>Nota de uso: </strong>No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>frame</span> use las propiedades CSS {{cssxref("border-style")}} y {{cssxref("border-width")}}.</div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("rules")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo enumerativo define donde aparecen las reglas en la tabla, por ejemplo líneas. Puede tener los siguientes valores:
-    <ul>
-      <li><span>none</span>, indica que ninguna regla se mostrará, es el valor por defecto;</li>
-      <li><span>groups</span>, mostrará el número de reglas a mostrarse entre grupos de filas (defined by the {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} y {{HTMLElement("tfoot")}} elements) y entre grupos de columnas (defined by the {{HTMLElement("col")}} y {{HTMLElement("colgroup")}} elements) solamente;</li>
-      <li><span>rows</span>, que mostrará las reglas entre filas;</li>
-      <li><span>columns</span>, que mostrará las reglas entre columnas;</li>
-      <li><span>all</span>, que mostrará las reglas entre filas y columnas.</li>
-    </ul>
-    <div class="note">
-      <strong>Nota</strong>:
-      <ul>
-        <li>El estilo de las reglas depende del navegador usado y no puede ser modificado.</li>
-        <li>Nota de uso: No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Use la propiedad {{cssxref("border")}} en los elementos adecuados {{HTMLElement("thead")}}, {{HTMLElement("tbody")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("col")}} o {{HTMLElement("colgroup")}}.</li>
-      </ul>
-    </div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("summary")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo define un texto alternativo para describir una tabla en un usuario incapaz de mostrarlo, corrientemente contiene una descripcion de él que posibilita a discapacitaos visulaes (como invidentes navegando en pantallas braile) a obtener la información que necesitan.Si la información añadida en este atributo puede ser útil a otras personas, considere el utilizar el elemento {{HTMLElement("caption")}} en vez de este. instead. El atributo de resumen no es obligatorio usuarlo, pudiendo ser omitido si un elemento {{HTMLElement("caption")}} realiza similar labor.<br>
-    <div class="note">
-      <strong>Nota de uso: </strong>No use este atributo, dado que ha sido declarado obsoleto. En su lugar, use alguna de estas formas de describir una tabla:
-      <ul>
-        <li>En prosa, rodeando la tabla (esta es la forma menos semántica de lograrlo).</li>
-        <li>En el elemento {{HTMLElement("caption")}} de la tabla.</li>
-        <li>En un elemento {{HTMLElement("details")}}, dentro del elemento {{HTMLElement("caption")}} de la tabla.</li>
-        <li>Incluye el elemento {{HTMLElement("table")}} en un elemento {{HTMLElement("figure")}} y añada la descripción en prosa al lado de él.</li>
-        <li>Incluya el elemento {{HTMLElement("table")}} en un elemento {{HTMLElement("figure")}} y añada la descripción en prosa dentro de un elemento {{HTMLElement("figcaption")}}.</li>
-        <li>Ajuste la tabla de manera que la descripción no sea necesaria, usando los elementos {{HTMLElement("th")}} y {{HTMLElement("thead")}} por ejemplo.</li>
-      </ul>
-    </div>
-  </dd>
-</dl>
-<dl>
-  <dt>
-    {{htmlattrdef("width")}} {{Deprecated_inline}}</dt>
-  <dd>
-    Este atributo define el ancho de una tabla, pudiendo contener una longitud de píxeles o un porcentaje, que representa un porcentaje de anchura del contenedor que la tabla debiera usar.
-    <div class="note">
-      No usar este atributo en CSS dado que es obsoleto: el elemento {{HTMLElement("table")}} debe ser estilizado usando <a href="/es/docs/CSS" title="CSS">CSS</a>. Para dar un efecto similar al atributo <span>frame</span> use la propiedad CSS {{cssxref("width")}} en su lugar.</div>
-  </dd>
-</dl>
-<h3 id="Interfaz_DOM">Interfaz DOM</h3>
-<p>Este elemento implementa la interfaz <code><a href="/es/docs/DOM/HTMLTableElement" title="DOM/HTMLTableElement">HTMLTableElement</a></code>.</p>
-<h3 id="Ejemplos">Ejemplos</h3>
-<pre class="brush: html">&lt;!-- Simple table --&gt;
-&lt;table&gt;
-  &lt;tr&gt;
-    &lt;td&gt;John&lt;/td&gt;
-    &lt;td&gt;Doe&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Jane&lt;/td&gt;
-    &lt;td&gt;Doe&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;
-
-&lt;!-- Simple table with header --&gt;
-&lt;table&gt;
-  &lt;tr&gt;
-    &lt;th&gt;First name&lt;/th&gt;
-    &lt;th&gt;Last name&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;John&lt;/td&gt;
-    &lt;td&gt;Doe&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Jane&lt;/td&gt;
-    &lt;td&gt;Doe&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;
-
-&lt;!-- Table with thead, tfoot, and tbody --&gt;
-&lt;table&gt;
-  &lt;thead&gt;
-    &lt;tr&gt;
-      &lt;th&gt;Header content 1&lt;/th&gt;
-      &lt;th&gt;Header content 2&lt;/th&gt;
-    &lt;/tr&gt;
-  &lt;/thead&gt;
-  &lt;tfoot&gt;
-    &lt;tr&gt;
-      &lt;td&gt;Footer content 1&lt;/td&gt;
-      &lt;td&gt;Footer content 2&lt;/td&gt;
-    &lt;/tr&gt;
-  &lt;/tfoot&gt;
-  &lt;tbody&gt;
-    &lt;tr&gt;
-      &lt;td&gt;Body content 1&lt;/td&gt;
-      &lt;td&gt;Body content 2&lt;/td&gt;
-    &lt;/tr&gt;
-  &lt;/tbody&gt;
-&lt;/table&gt;
-
-&lt;!-- Table with colgroup --&gt;
-&lt;table&gt;
-  &lt;colgroup span="4" class="columns"&gt;&lt;/colgroup&gt;
-  &lt;tr&gt;
-    &lt;th&gt;Countries&lt;/th&gt;
-    &lt;th&gt;Capitals&lt;/th&gt;
-    &lt;th&gt;Population&lt;/th&gt;
-    &lt;th&gt;Language&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;USA&lt;/td&gt;
-    &lt;td&gt;Washington D.C.&lt;/td&gt;
-    &lt;td&gt;309 million&lt;/td&gt;
-    &lt;td&gt;English&lt;/td&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Sweden&lt;/td&gt;
-    &lt;td&gt;Stockholm&lt;/td&gt;
-    &lt;td&gt;9 million&lt;/td&gt;
-    &lt;td&gt;Swedish&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;
-
-&lt;!-- Table with colgroup and col --&gt;
-&lt;table&gt;
-  &lt;colgroup&gt;
-    &lt;col class="column1"&gt;
-    &lt;col class="columns2plus3" span="2"&gt;
-  &lt;/colgroup&gt;
-  &lt;tr&gt;
-    &lt;th&gt;Lime&lt;/th&gt;
-    &lt;th&gt;Lemon&lt;/th&gt;
-    &lt;th&gt;Orange&lt;/th&gt;
-  &lt;/tr&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Green&lt;/td&gt;
-    &lt;td&gt;Yellow&lt;/td&gt;
-    &lt;td&gt;Orange&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;
-
-&lt;!-- Simple table with caption --&gt;
-&lt;table&gt;
-  &lt;caption&gt;Awesome caption&lt;/caption&gt;
-  &lt;tr&gt;
-    &lt;td&gt;Awesome data&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/table&gt;
-</pre>
-<h4 id="Resultado">Resultado</h4>
-
-<table class="standard-table">
-  <tbody>
-    <tr>
-      <td>John</td>
-      <td>Doe</td>
-    </tr>
-    <tr>
-      <td>Jane</td>
-      <td>Doe</td>
-    </tr>
-  </tbody>
-</table>
-
-<table class="standard-table">
-  <tbody>
-    <tr>
-      <th>First name</th>
-      <th>Last name</th>
-    </tr>
-    <tr>
-      <td>John</td>
-      <td>Doe</td>
-    </tr>
-    <tr>
-      <td>Jane</td>
-      <td>Doe</td>
-    </tr>
-  </tbody>
-</table>
-
-<table class="standard-table">
-  <thead>
-    <tr>
-      <th>Header content 1</th>
-      <th>Header content 2</th>
-    </tr>
-  </thead>
-  <tfoot>
-    <tr>
-      <td>Footer content 1</td>
-      <td>Footer content 2</td>
-    </tr>
-  </tfoot>
-  <tbody>
-    <tr>
-      <td>Body content 1</td>
-      <td>Body content 2</td>
-    </tr>
-  </tbody>
-</table>
-
-<table class="standard-table">
-  <colgroup>
-  </colgroup>
-  <tbody>
-    <tr>
-      <th>Countries</th>
-      <th>Capitals</th>
-      <th>Population</th>
-      <th>Language</th>
-    </tr>
-    <tr>
-      <td>USA</td>
-      <td>Washington D.C.</td>
-      <td>309 million</td>
-      <td>English</td>
-    </tr>
-    <tr>
-      <td>Sweden</td>
-      <td>Stockholm</td>
-      <td>9 million</td>
-      <td>Swedish</td>
-    </tr>
-  </tbody>
-</table>
-
-<table class="standard-table">
-  <colgroup>
-    <col class="column1">
-    <col class="columns2plus3">
-  </colgroup>
-  <tbody>
-    <tr>
-      <th>Lime</th>
-      <th>Lemon</th>
-      <th>Orange</th>
-    </tr>
-    <tr>
-      <td>Green</td>
-      <td>Yellow</td>
-      <td>Orange</td>
-    </tr>
-  </tbody>
-</table>
-
-<table class="standard-table">
-  <caption>
-    Awesome caption</caption>
-  <tbody>
-    <tr>
-      <td>Awesome data</td>
-    </tr>
-  </tbody>
-</table>
-<h3 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h3>
-<p>{{CompatibilityTable}}</p>
-<div id="compat-desktop">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Característica</th>
-        <th>Chrome</th>
-        <th>Firefox (Gecko)</th>
-        <th>Internet Explorer</th>
-        <th>Opera</th>
-        <th>Safari</th>
-      </tr>
-      <tr>
-        <td>Soporte básico</td>
-        <td>1.0</td>
-        <td>{{CompatGeckoDesktop("1")}}</td>
-        <td>4.0</td>
-        <td>7.0</td>
-        <td>1.0</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<div id="compat-mobile">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Característica</th>
-        <th>Android</th>
-        <th>Firefox Mobile (Gecko)</th>
-        <th>IE Mobile</th>
-        <th>Opera Mobile</th>
-        <th>Safari Mobile</th>
-      </tr>
-      <tr>
-        <td>Soporte básico</td>
-        <td>1.0</td>
-        <td>{{CompatGeckoMobile("1")}}</td>
-        <td>6.0</td>
-        <td>6.0</td>
-        <td>1.0</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<h3 id="Consulte_también">Consulte también</h3>
-<ul>
-  <li>Otros elementos HTML relacionados a tablas: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}};</li>
-  <li>Propiedades CSS que pueden ser especialmente útiles para estilizar el elemento <span style="font-family: Courier New;">&lt;table&gt;</span>:
-    <ul>
-      <li>{{cssxref("width")}} para controlar el ancho de la tabla;</li>
-      <li>{{cssxref("border")}}, {{cssxref("border-style")}}, {{cssxref("border-color")}}, {{cssxref("border-width")}}, {{cssxref("border-collapse")}}, {{cssxref("border-spacing")}} para controlar el aspecto de los bordes de las celdas, reglas y marco;</li>
-      <li>{{cssxref("margin")}} y {{cssxref("padding")}} para estilizar el contenido individual de las celdas;</li>
-      <li>{{cssxref("text-align")}} y {{cssxref("vertical-align")}} para definir la alineación del contenido y del texto de las celdas.</li>
-    </ul>
-  </li>
-</ul>
diff --git a/files/es/web/html/elemento/td/index.html b/files/es/web/html/elemento/td/index.html
deleted file mode 100644
index dc8867d87f..0000000000
--- a/files/es/web/html/elemento/td/index.html
+++ /dev/null
@@ -1,310 +0,0 @@
----
-title: <td>
-slug: Web/HTML/Elemento/td
-translation_of: Web/HTML/Element/td
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento <a href="/es/docs/Web/HTML">HTML</a> <em>Celda de tabla</em> (<strong><code>&lt;td&gt;</code></strong>) define la celda de una tabla que contiene datos. Esta participa en el <em>modelo de tablas</em>.</p>
-
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th><a href="/es/docs/Web/Guide/HTML/categorias_de_contenido">Categorías de contenido</a></th>
-   <td>Ninguna.</td>
-  </tr>
-  <tr>
-   <th>Contenido permitido</th>
-   <td>Contenido dinámico.</td>
-  </tr>
-  <tr>
-   <th>Omision de Etiquetas</th>
-   <td>La <span title="syntax-etiqueta-de-inicio">etiqueta de inicio</span> es obligatoria.<br>
-    La etiqueta final puede ser omitida, si esta inmediatamente seguida por un elemento {{HTMLElement("th")}} o un {{HTMLElement("td")}} o si no hay más datos en el elemento padre.</td>
-  </tr>
-  <tr>
-   <th>Elementos padre permitidos</th>
-   <td>Un elemento {{HTMLElement("tr")}}.</td>
-  </tr>
-  <tr>
-   <th>Documento normativo</th>
-   <td><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/tabular-data.html#the-td-element" rel="external">HTML5, section 4.9.9</a> (<a href="http://www.w3.org/TR/REC-html40/struct/tables.html#h-11.2.6">HTML4.01, section 11.2.6</a>)</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("abbr")}} {{obsoleteGeneric('inline','HTML5')}}</dt>
- <dd>Este atributo contiene un pequeña descripción abreviada del contenido de la celda. Algunos agentes de usuario, como los lectores de voz, pueden presentar esta descripción antes que el propio contenido.
- <div class="note"><strong>Nota:</strong> No usar este atributo ya que esta obsoleto en la ultima version del estandar.  Como alternativa, puedes poner una descripción abreviada dentro de la celda y colocar el contenido largo en el atributo <strong>title</strong>.</div>
- </dd>
- <dt>{{htmlattrdef("align")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
- <dd>Este atributo especifíca la posición horizontal del contenido de la celda, los valores de la misma pueden ser:
- <ul>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">Izquierda</font>, alínea el contenido de la celda a la izquierda</li>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">Centro</font>, centra el contenido de una celda</li>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">Derecha</font>, alínea el contenido de la celda a la derecha</li>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">Justificado</font>, inserta espacios en el texto para que el contenido se ajuste a la celda</li>
-  <li><code>char</code>, alinear el contenido a un caracter especial definido por los atributos {{htmlattrxref("char", "td")}} y {{htmlattrxref("charoff", "td")}} {{unimplemented_inline(2212)}}.</li>
- </ul>
-
- <p>Si este atributo no se define, se selecciona por defecto <code>left</code></p>
-
- <div class="note"><strong>Nota:</strong> No usar este atributo ya que esta obsoleto en la ultima version.
-
- <ul>
-  <li>Para lograr el mismo efecto de los valores <code>left</code>, <code>center</code>, <code>right</code>, o <code>justify</code> , usa la propiedad CSS {{cssxref("text-align")}} en el.</li>
-  <li>Para lograr el mismo efecto que el valor <code>char</code> , en CSS3,puedes usar el valor de la {{htmlattrxref("char", "td")}} como el valor de la propiedad {{cssxref("text-align")}}  {{unimplemented_inline}}.</li>
- </ul>
- </div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("axis")}} {{obsolete_inline}} en {{HTMLVersionInline(5)}}</dt>
- <dd>
- <pre dir="ltr" id="tw-target-text">Este atributo contiene una lista de cadenas separadas por espacios . Cada cadena es el ID de un grupo de celdas a las que esta cabecera se aplica.</pre>
-
- <div class="note"><strong>Nota: </strong>No usar este atributo ya que esta obsoleto en la ultima version. En su lugar use el atributo {{htmlattrxref("scope", "td")}} .</div>
- </dd>
- <dt>{{htmlattrdef("bgcolor")}} {{Non-standard_inline}}</dt>
- <dd>
- <pre dir="ltr" id="tw-target-text">Este atributo define el color de fondo de cada celda de la columna. Es uno de los códigos de 6 dígitos hexadecimales como se definen en sRGB , prefijado por un '# ' . Una de las cadenas de color predefinidos dieciséis se pueden utilizar :</pre>
-
- <table style="width: 80%;">
-  <tbody>
-   <tr>
-    <td style="background-color: black; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Negro</code> = "#000000"</td>
-    <td style="background-color: green; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td>Verde = "#008000"</td>
-   </tr>
-   <tr>
-    <td style="background-color: silver; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><font face="Consolas, Liberation Mono, Courier, monospace">Plata</font> = "#C0C0C0"</td>
-    <td style="background-color: lime; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Lima</code> = "#00FF00"</td>
-   </tr>
-   <tr>
-    <td style="background-color: gray; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><font face="Consolas, Liberation Mono, Courier, monospace">Gris</font> = "#808080"</td>
-    <td style="background-color: olive; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><font face="Consolas, Liberation Mono, Courier, monospace">Oliva</font> = "#808000"</td>
-   </tr>
-   <tr>
-    <td style="background-color: white; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><font face="Consolas, Liberation Mono, Courier, monospace">Blanco</font> = "#FFFFFF"</td>
-    <td style="background-color: yellow; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><font face="Consolas, Liberation Mono, Courier, monospace">Amarillo</font> = "#FFFF00"</td>
-   </tr>
-   <tr>
-    <td style="background-color: maroon; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Marrón</code> = "#800000"</td>
-    <td style="background-color: navy; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><font face="Consolas, Liberation Mono, Courier, monospace">Marino</font> = "#000080"</td>
-   </tr>
-   <tr>
-    <td style="background-color: red; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Rojo</code> = "#FF0000"</td>
-    <td style="background-color: blue; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Azul</code> = "#0000FF"</td>
-   </tr>
-   <tr>
-    <td style="background-color: purple; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Purpura</code> = "#800080"</td>
-    <td style="background-color: teal; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Verde Azulado</code> = "#008080"</td>
-   </tr>
-   <tr>
-    <td style="background-color: fuchsia; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>Fucsia</code> = "#FF00FF"</td>
-    <td style="background-color: aqua; width: 24px; height: 24px; border: 1px solid black;"> </td>
-    <td><code>agua</code> = "#00FFFF"</td>
-   </tr>
-  </tbody>
- </table>
-
- <div class="note">Nota: No usar este atributo ya que esta obsoleto en la ultima version del estandar y solo implementado en algunas versiones de Microsoft Internet Explorer: El elemento {{HTMLElement("td")}} debe ser estilizado en CSS. <br>
- Para crear un efecto similar en CSS en su lugar use la propiedad {{cssxref("background-color")}}.</div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("char")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
- <dd>
- <pre dir="ltr" id="tw-target-text">Este atributo se utiliza para establecer el carácter para alinear las celdas de una columna . Los valores típicos de esto incluyen un punto (. ) al intentar alinear los números o valores monetarios . Si { { htmlattrxref ( " align " , " td " ) } } no está ajustado a char, este atributo se ignora.</pre>
-
- <div class="note"><strong>Note: </strong>No usar este atributo ya que está obsoleto (y no soportado) en las últimas versiones estándares).  Para lograr el mismo que el {{htmlattrxref("char", "thead")}}, en CSS3, puedes usar el character set usando el atributo {{htmlattrxref("char", "th")}} como el valor de la propiedad {{cssxref("text-align")}}  {{unimplemented_inline}}.</div>
- </dd>
- <dt>{{htmlattrdef("charoff")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
- <dd><br>
- Este atributo se utiliza para indicar el número de caracteres para compensar los datos de la columna de los personajes de alineación especificado por el atributo de carbón .
- <div class="note">Nota: No usar este atributo ya que esta obsoleto en la ultima version del estandar,</div>
- </dd>
- <dt>{{htmlattrdef("colspan")}}</dt>
- <dd>
- <pre dir="ltr" id="tw-target-text">Este atributo contiene un valor entero no negativo que indica por el número de columnas se extiende la célula. Su valor por defecto es 1 ; si su valor se establece en 0 , se extiende hasta el final de la { { HTMLElement ( " colgroup " ) } } , aunque implícitamente definido , que la célula pertenece. Los valores superiores a 1000 serán consideradas como incorrectas y se establecen en el valor predeterminado ( 1 ) .</pre>
-
- <div class="note"><strong>Nota: En</strong> {{HTMLVersionInline(5)}} este atributo solo acepta valores mayores que 0 this attribute only accepts values greater than zero since it <a href="http://dev.w3.org/html5/spec/single-page.html#attr-tdth-colspan">must not be used to overlap cells</a>. Además, Firefox is the only browser to support the 0 value as defined in the {{HTMLVersionInline(4.01)}} specification.</div>
- </dd>
- <dt>{{htmlattrdef("headers")}}</dt>
- <dd><br>
- Este atributo contiene una lista de cadenas separadas por espacios , cada uno correspondiente al atributo ID de la { { HTMLElement ( "th" ) } } elementos que se aplican a este elemento.</dd>
- <dt>{{htmlattrdef("rowspan")}}</dt>
- <dd><br>
- Este atributo contiene un valor entero no negativo que indica a cuántas filas se extiende la célula. Su valor por defecto es 1 ; si su valor se establece en 0 , se extiende hasta el final de la sección de la tabla ( { { HTMLElement ( " culata en T " ) } } , { { HTMLElement ( " tbody " ) } } , { { HTMLElement ( " tfoot " ) } } , incluso si define implícitamente , que la célula pertenece. los valores superiores a 65534 se recortan hasta 65534 .</dd>
- <dt>{{htmlattrdef("scope")}} {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
- <dd> </dd>
- <dt>{{htmlattrdef("valign")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}, {{obsolete_inline}} in {{HTMLVersionInline(5)}}</dt>
- <dd><br>
- Este atributo especifica la alineación vertical del texto dentro de cada fila de células de la cabecera de la tabla . Los valores posibles para este atributo son :
- <ul>
-  <li><code>baseline</code>,<span style="background-color: #fafbfc; font-family: consolas,monaco,andale mono,monospace; font-size: 1rem; line-height: 19px; white-space: pre;"> pondrá el texto tan cerca del fondo de la celda , ya que es posible, pero alinearlo en la línea de base de los caracteres en lugar de la parte inferior de ellos. Si los caracteres son todos del mismo tamaño , esto tiene el mismo efecto que la parte inferior.</span></li>
-  <li><code>bottom</code>,  pondrá el texto tan cerca del fondo de la celda , ya que es posible</li>
-  <li><code>middle</code>, centra el texto de la celda</li>
-  <li>and <code>top</code>, pone el texto como cerca de la parte superior de la celda como es posible .</li>
- </ul>
-
- <div class="note"><strong>Note: </strong>Do not use this attribute as it is obsolete (and not supported) in the latest standard: instead set the CSS {{cssxref("vertical-align")}} property on it.</div>
- </dd>
- <dt>{{htmlattrdef("width")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}</dt>
- <dd><br>
- Este atributo se utiliza para definir una anchura de celda recomendada. Propiedades CELLSPACING y cellpadding pueden añadir espacio adicional, y el elemento { { HTMLElement ( "col " ) } } anchura pueden también tener algún efecto . En general, si el ancho de una columna es demasiado estrecha para mostrar una célula particular correctamente, y por lo tanto las células en el mismo, se puede ensanchar cuando se muestra .</dd>
- <dd>
- <div class="note"><strong>Note: </strong>Do not use this attribute in the latest standard: instead set the CSS {{cssxref("width")}} property.</div>
- </dd>
-</dl>
-
-<h2 id="DOM_interfaz">DOM interfaz</h2>
-
-<p> </p>
-
-<p>Este elemento implementa el interfaz {{domxref("HTMLTableDataCellElement")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p> </p>
-
-<p>Por favor, ver la página {{HTMLElement("table")}} para ejemplos de <code>&lt;td&gt;</code>.</p>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>align/valign</code> attribute</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>char/charoff</code> attribute</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>colspan</code> attribute with value 0 (extend to the end of the colgroup)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>align/valign</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>char/charoff</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}<sup>[2]</sup></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Otros Elementos HTML relacionados con tablas: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}}.</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/template/index.html b/files/es/web/html/elemento/template/index.html
deleted file mode 100644
index b6fe0ca924..0000000000
--- a/files/es/web/html/elemento/template/index.html
+++ /dev/null
@@ -1,155 +0,0 @@
----
-title: <template>
-slug: Web/HTML/Elemento/template
-tags:
-  - Plantilla
-translation_of: Web/HTML/Element/template
----
-<p><span class="seoSummary">El <strong>elemento</strong> <strong>HTML <code>&lt;template&gt;</code></strong> es un mecanismo para mantener el contenido </span> <span class="seoSummary">{{Glossary("HTML")}}</span> <span class="seoSummary">del lado del cliente que no se renderiza cuando se carga una página, pero que posteriormente puede ser instanciado durante el tiempo de ejecución empleando JavaScript.</span></p>
-
-<p>Piensa en la plantilla como un fragmento de contenido que está siendo almacenado para un uso posterior en el documento. El analizador procesa el contenido del elemento <strong><code>&lt;template&gt;</code> </strong>durante la carga de la página, pero sólo lo hace para asegurar que esos contenidos son válidos; sin embargo, estos contenidos del elemento no se renderizan.</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías de Contenido</a></th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content">Metadata content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">flow content</a>, <a href="/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">phrasing content</a>, script-supporting element</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Sin restricciones</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>Cualquier elemento que acepte <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Metadata_content">metadata content</a>, <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content">phrasing content</a>, o <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Script-supporting_elements">script-supporting elements</a>. También se permiten como hijos de un elemento {{HTMLElement("colgroup")}} que no tenga un atributo {{htmlattrxref("span", "colgroup")}} .</td>
-  </tr>
-  <tr>
-   <th scope="row">Implicit ARIA role</th>
-   <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">No corresponding role</a></td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted ARIA roles</th>
-   <td>No <code>role</code> permitted</td>
-  </tr>
-  <tr>
-   <th scope="row">DOM interface</th>
-   <td>{{domxref("HTMLTemplateElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento sólo incluye <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<p>SInembargo, {{domxref("HTMLTemplateElement")}} tiene una propiedad  {{domxref("HTMLTemplateElement.content", "content")}}, que es solo-lectura cuyo  {{domxref("DocumentFragment")}} contiene el subárbol DOM que representa a la plantilla.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Primero empezamos con la parte HTML del ejemplo.</p>
-
-<pre class="brush: html">&lt;table id="producttable"&gt;
-  &lt;thead&gt;
-    &lt;tr&gt;
-      &lt;td&gt;UPC_Code&lt;/td&gt;
-      &lt;td&gt;Product_Name&lt;/td&gt;
-    &lt;/tr&gt;
-  &lt;/thead&gt;
-  &lt;tbody&gt;
-    &lt;!-- datos opcionales pueden incluirse aquí opcionalmente --&gt;
-  &lt;/tbody&gt;
-&lt;/table&gt;
-
-&lt;template id="productrow"&gt;
-  &lt;tr&gt;
-    &lt;td class="record"&gt;&lt;/td&gt;
-    &lt;td&gt;&lt;/td&gt;
-  &lt;/tr&gt;
-&lt;/template&gt;
-</pre>
-
-<p>Inicialmente tenemos una tabla en la cual insertaremos más tarde contenido usando código JavaScript. Más abajo viene el template, el cual describe la estructura de un fragmento HTML representando la fila de una tabla.</p>
-
-<p>Ahora que la tabla ha sido creada y el template definido, usamos JavaScript para insertar filas en la tabla, con cada fila siendo construida usando el template como su base.</p>
-
-<pre class="brush:js;">// Comprobar si el navegador soporta el elemento HTML template element chequeando
-// si tiene el atributo 'content'
-if ('content' in document.createElement('template')) {
-
-  // Instanciar la tabla con el tbody existente
-  // y la fila con el template
-  var t = document.querySelector('#productrow'),
-  td = t.content.querySelectorAll("td");
-  td[0].textContent = "1235646565";
-  td[1].textContent = "Stuff";
-
-  // Clonar la nueva fila e insertarla en la tabla
-  var tb = document.querySelector("tbody");
-  var clone = document.importNode(t.content, true);
-  tb.appendChild(clone);
-
-  // Crear una nueva fila
-  td[0].textContent = "0384928528";
-  td[1].textContent = "Acme Kidney Beans";
-
-  // Clonar la nueva fila e insertarla en la tabla
-  var clone2 = document.importNode(t.content, true);
-  tb.appendChild(clone2);
-
-} else {
-  // Buscar otra manera de añadir filas a la tabla porque el
-  // elemento template no está soportado.
-}
-</pre>
-
-<p>El resultado es la tabla HTML original HTML , con dos nuevas filas adjuntadas via JavaScript:</p>
-
-<div class="hidden">
-<pre class="brush: css">table {
-  background: #000;
-}
-table td {
-  background: #fff;
-}</pre>
-</div>
-
-<p>{{EmbedLiveSample("Examples", 500, 120)}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG','scripting.html#the-template-element','template element')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C','/scripting-1.html#the-template-element','template element')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_navegadores">Compatibilidad navegadores</h2>
-
-
-
-<p>{{Compat("html.elements.template")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Web components: {{HTMLElement("slot")}} (e históríco: {{HTMLElement("shadow")}})</li>
- <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots">Usando templates y slots</a></li>
-</ul>
diff --git a/files/es/web/html/elemento/textarea/index.html b/files/es/web/html/elemento/textarea/index.html
deleted file mode 100644
index f062f6e1c6..0000000000
--- a/files/es/web/html/elemento/textarea/index.html
+++ /dev/null
@@ -1,181 +0,0 @@
----
-title: <textarea>
-slug: Web/HTML/Elemento/textarea
-tags:
-  - Elemento
-  - Formularios(2)
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/textarea
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El <strong>elemento</strong> <strong>HTML <code>&lt;textarea&gt; </code></strong>representa un control para la edición mutilínea de texto sin formato.</p>
-
-<h2 id="Contenido_de_Uso">Contenido de Uso</h2>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Flow content</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, <a href="/en-US/docs/HTML/Content_categories#Interactive_content" title="HTML/Content categories#Interactive content">Interactive content</a>, <a href="/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">listed</a>, <a href="/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">labelable</a>, <a href="/en/HTML/Content_categories#form_resettable" title="en/HTML/Content categories#form resettable">resettable</a>, y <a href="/en-US/docs/HTML/Content_categories#Form_submittable" title="HTML/Content categories#Form submittable">submittable</a> <a href="/en-US/docs/HTML/Content_categories#Form-associated_" title="HTML/Content categories#Form-associated ">form-associated</a> elemento</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido Permitido</th>
-   <td>Datos carácter</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>{{no_tag_omission}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Elementos padre permitidos</th>
-   <td>Cualquier elemento que soporta <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz Dom</th>
-   <td>{{domxref("HTMLTextAreaElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento contiene  </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
-
-<dl>
- <dt>{{htmlattrdef("autocapitalize")}} {{non-standard_inline}}</dt>
- <dd>Este es un atributo no estándar utilizado por iOS Safari Mobile (y, por lo tanto, también por casi todos los navegadores de iOS, incluyendo Safari, Firefox y Chrome). Controla cuándo y cómo el texto debe ponerse automáticamente en mayúsculas mientras es ingresado/editado por el usuario. Los valores no obsoletos están disponible en iOs 5 y en versiones posteriores. Sus valores posibles son:
- <ul>
-  <li><code>none</code>: Deshabilita la capitalización automática</li>
-  <li><code>sentences</code>:  Escribe automáticamente con mayúscula la primera letra de cada frase.</li>
-  <li><code>words</code>: Automáticamente escribe con mayúsculas la primera letra de las palabras.</li>
-  <li><code>characters</code>: Automáticamente escribe con mayúscula todos los caracteres.</li>
-  <li><code>on</code>: {{deprecated_inline()}} En desuso desde la versión 5 de iOS.</li>
-  <li><code>off</code>: {{deprecated_inline()}} En desuso desde la versión 5 de iOS.</li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("autocomplete")}} {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo indica si el valor del control puede ser completado automáticamente por el navegador. Los posibles valores son:
- <ul>
-  <li><code>off</code>: El usuario debe explícitamente introducir el valor del campo para cada uso, o el documento proporciona su propio método de auto-completado; el navegador no completa automáticamente.</li>
-  <li><code>on</code>: El navegador puede completar automáticamente el valor basándose en valores que el usuario haya insertado durante usos previos.</li>
- </ul>
-
- <p>Si el atributo <strong>autocomplete</strong> no está definidio en el elemento textarea, entonces  el navegador usa el valor del atributo <strong>autocomplete </strong>del propietario del elemento <code>&lt;textarea&gt;</code> . El propietario del formulario es o bien el elemento form del cual el &lt;textarea&gt; es descendiente o el elemento form cuyo id está especificado en el atributo form del elemento. Para más información, ver  el atributo {{htmlattrxref("autocomplete", "form")}} en {{HTMLElement("form")}}.</p>
- </dd>
- <dt>{{ htmlattrdef("autofocus") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>Este atributo booleano te permite especificar que un control de un formulario adquiera el foco cuando se carga la página, salvo que el usuario anule esto , por ejemplo tecleando en un control diferente. Sólo se puede especificar este atributo en los elementos asociados a formularios.</dd>
- <dt>{{ htmlattrdef("cols") }}</dt>
- <dd>La anchura visible del control de texto, en caracteres de anchura media. Si está definido debe ser positivo. Si no, por defecto, el valor es 20 (HTML 5).</dd>
- <dt>{{ htmlattrdef("disabled") }}</dt>
- <dd>Este atributo booleano indica que el usuario no puede interactuar con el control. Si el atributo no está definido se hereda su valor del elemento en el que está contenido, por ejemplo {{ HTMLElement("fieldset") }}; Si no está dentro de un elemento contenedor con el atributo disable establecido, entonces el control estará habilitado.</dd>
- <dt>{{ htmlattrdef("form") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>El formulario al cual el elemento textarea está asociado (el propietario del formulario). El valor del atributo debe ser un ID de un elemento formulario del mismo documento. Si no se especifica este atributo, el textarea debe ser un descendiente de un elemento formulario. Permite colocar elementos textarea en cualquier lugar dentro de un documento, no sólo como descendientes de  formularios.</dd>
- <dt>{{ htmlattrdef("maxlength") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>Indica el número máximo de caracteres  (Unicode code points) que el usuario puede insertar. Si no está especificado entonces el usuario puede insertar un número ilimitado de caracteres.</dd>
- <dt>{{ htmlattrdef("minlength") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>El mínimo número de caracteres (Unicode code points) que el usuaurio debe insertar.</dd>
- <dt>{{ htmlattrdef("name") }}</dt>
- <dd>El nombre del control</dd>
- <dt>{{ htmlattrdef("placeholder") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>Se puede añadir un indicación para el usuario que defina que se debe insertar en el control. Los retornos de carro y las nuevas líneas dentro lso marcadores de posición deben ser tratado como nuevas líneas al representar dicha indicación.</dd>
- <dt>{{ htmlattrdef("readonly") }}</dt>
- <dd>Este atributo booleano indica que el usuario no puede modificar el valor del control. Al contrario que el atributo<code> disable</code>, el atributo <code>readonly </code>no evita que el usuario haga click o seleccione el control. El valor del control read-only si que se envía con el formulario.</dd>
- <dt>{{ htmlattrdef("required") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>Este atributo indica que el usuario debe rellenar el contro con un valor antes de poder enviar el formulario.</dd>
- <dt>{{ htmlattrdef("rows") }}</dt>
- <dd>El número de líneas visibles en el control</dd>
- <dt>{{ htmlattrdef("selectionDirection") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>La dirección en la que la selección ocurre dentro del control. Es "forward" si la selección ocurre de izquierda a derecha en una localización LTR, o  "backward" si la selección fue hecha en sentido contrario. Puede ser "none" si se desconoce la dirección.</dd>
- <dt>{{ htmlattrdef("selectionEnd") }}</dt>
- <dd>El índice del último caracter de la selección actual.</dd>
- <dt>{{ htmlattrdef("selectionStart") }}</dt>
- <dd>El índice del primer caracter de la selección actual.</dd>
- <dt>{{ htmlattrdef("spellcheck") }} {{ HTMLVersionInline(5) }}</dt>
- <dd>Un valor <code>true</code> en este atributo indica que el elemento necesita tener <code>checked</code> el corrector ortográfico y gramatical. El caloor <code>default</code> indica que el elemento va a comportarse de acuerdo al comportamiento por defecto, basado en el <code>spellcheck</code> del padre. El valor <code>false</code> indica que no se deben hacer esas comprobaciones.</dd>
- <dt>{{ htmlattrdef("wrap") }} {{ HTMLVersionInline("5") }}</dt>
- <dd>Indica como el control envuelve al texto. Los posibles valores son:
- <ul>
-  <li><span style="font-family: courier new;">hard</span>: El navegador insertar automáticamente caracteres de nueva línea (CR+LF) para que ninguna línea tenga más anchura que la del control; el atributo  <code>cols</code> debe estar espeficicado.</li>
-  <li><span style="font-family: courier new;">soft</span>: El navegador asegura que todas las nuevas líneas constan de la pareja de caracteres CR+LF , pero no insertar nuevas líneas adicionales.</li>
- </ul>
-
- <p><span style="font-family: courier new;">Soft</span> es el valor por defecto si no se especifica nada.</p>
- </dd>
-</dl>
-
-<h2 id="Interfaz_DOM">Interfaz DOM</h2>
-
-<p>Este elemento implementa el interfaz <code><a href="/en/DOM/HTMLTextAreaElement" title="en/DOM/textarea">HTMLTextAreaElement</a></code> .</p>
-
-<p>{{ h1_gecko_minversion("Resizable textareas", "2.0") }}</p>
-
-<p>{{ gecko("2.0") }} introduce el soporte para textareas redimensionable. Esto se controla con la propiedad CSS {{ cssxref("resize") }} . Por defecto la posibilidad de redimiensionar el control está habilitada, pero puede ser explícitamente deshabilitada mediante el uso del siguiente CSS:</p>
-
-<pre>textarea {
-  resize: none;
-}
-</pre>
-
-<h2 id="Interacción_con_CSS">Interacción con CSS</h2>
-
-<p>En relación a CSS, un  <code>&lt;textarea&gt;</code>  es un <a href="https://developer.mozilla.org/en-US/docs/CSS/Replaced_element" title="/en-US/docs/CSS/Replaced_element">replaced element</a>. La especificación HTML no define dónde está el punto de referencia de un <code>&lt;textarea&gt;</code>. Así que los diferentes navegadores lo sitúan en diferentes posiciones. En los navegadores basados en Gecko, ese punto de referencia del <code>&lt;textarea&gt;</code> se sitúa en el punto de referencia de la primera línea del <code>&lt;textarea&gt;</code>,  en otro navegadores puede estár situado al final de la caja del <code>&lt;textarea&gt;</code> . Se recomienda no usar {{cssxref("vertical-align")}}<code>: baseline</code> , ya que obtendríamos un comportamiento no impredecible.</p>
-
-<p>Un  <em>textarea</em> tiene dimensiones intrínsecas, como una imagen agrandada.</p>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<h3 id="Contenido_HTML">Contenido HTML </h3>
-
-<pre class="brush: html">&lt;textarea name="textarea" rows="10" cols="50"&gt;Write something here&lt;/textarea&gt;</pre>
-
-<p>{{ EmbedLiveSample('Example','600','200') }}</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'the-button-element.html#the-textarea-element', '&lt;textarea&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'forms.html#the-textarea-element', '&lt;textarea&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'interact/forms.html#h-17.7', '&lt;textarea&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("html.elements.textarea")}}</p>
-</div>
-
-
-
-<h2 id="Ver_además">Ver además</h2>
-
-<p>Otros elementos relacionados con formularios: {{ HTMLElement("form") }}, {{ HTMLElement("button") }}, {{ HTMLElement("datalist") }}, {{ HTMLElement("legend") }}, {{ HTMLElement("label") }}, {{ HTMLElement("select") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }} and {{ HTMLElement("meter") }}.</p>
-
-<p>{{ languages( { "fr": "fr/HTML/Element/textarea" } ) }}</p>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/th/index.html b/files/es/web/html/elemento/th/index.html
deleted file mode 100644
index dae17481e0..0000000000
--- a/files/es/web/html/elemento/th/index.html
+++ /dev/null
@@ -1,328 +0,0 @@
----
-title: <th>
-slug: Web/HTML/Elemento/th
-translation_of: Web/HTML/Element/th
----
-<p><span class="seoSummary">El elemento <strong>HTML <code>&lt;th&gt;</code> </strong>define una celda como encabezado de un grupo de celdas en una tabla. La naturaleza exacta de este grupo está definida por los atributos {{htmlattrxref("scope", "th")}} y {{htmlattrxref("headers", "th")}}.</span></p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/HTML/Content_categories">Categorías de contenido</a></th>
-   <td>Ninguno</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>
-    <div class="content-models">
-    <div id="table-mdls">Contenido de flujo, pero sin encabezado, pie de página, contenido de seccionamiento, o contenido descendiente de encabezados</div>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiqueta</th>
-   <td>La etiqueta de inicio es obligatoria.<br>
-    La etiqueta de cierre puede ser omitida si es inmediatamente seguida por el elemento {{HTMLElement("th")}} o {{HTMLElement("td")}} o si no hay más datos en su elemento padre.</td>
-  </tr>
-  <tr>
-   <th scope="row">Parents permítidos</th>
-   <td>Un elemento {{HTMLElement("tr")}}</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles permítdos de ARIA</th>
-   <td>Cualquiera</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLTableHeaderCellElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("abbr")}} {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo contiene una breve descripción del contenido de las celdas. Algunos agentes de usuario (e.g., a speech reader) pueden presentar esta descripción antes que el propio contenido.</dd>
- <dd>
- <div class="note"><strong>Nota de uso: </strong>No uses este atributo, ya que se ha vuelto obsoleto en el último estandar. Alternativamente, puedes poner la descripción abreviada dentro de la celda y colocarla el largo contenido en el atributo de <strong>title</strong>.</div>
- </dd>
- <dt>{{htmlattrdef("align")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo enumerado especifica cómo se tratará el alineado horizontal de la celda. Los valores posibles son:
- <ul>
-  <li><code>left</code>: El contenido se alinea a la izquierda de la celda.</li>
-  <li><code>center</code>: El contenido se centra en la celda.</li>
-  <li><code>right</code>:  El contenido se alinea a la derecha de la celda.</li>
-  <li><code>justify</code> (solo con texto): El contenido se alarga para ocupar todo el ancho de la celda.</li>
-  <li><code>char</code> (solo con texto): El contenido es alineado a un caracter dentro de <code>&lt;th&gt;</code> con el offset mínimo. Este caracter esta definido por los atributos {{htmlattrxref("char", "th")}} y {{htmlattrxref("charoff", "th")}}.</li>
- </ul>
-
- <p>El valor por defecto cuando no se especifica este atributo es <code>left</code>.</p>
-
- <div class="note">
- <p><strong>Nota: </strong>No usar este atributo, ya que está obsoleto en el último estándar.</p>
-
- <ul>
-  <li>Para lograr el mismo efecto que con los valores <code>left</code>, <code>center</code>, <code>right </code>o <code>justify</code>, aplicar la propiedad CSS {{cssxref("text-align")}} al elemento.</li>
-  <li>Para lograr el mismo efecto que con el valor <code>char</code>, dar a la propiedad {{cssxref("text-align")}} el mismo valor que usarías para {{htmlattrxref("char", "th")}}. {{unimplemented_inline}} in CSS3.</li>
- </ul>
- </div>
- </dd>
- <dt>{{htmlattrdef("axis")}} {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
- <dd>Este atributo contiene una lista de cadenas separadas por espacios. Cada cadena es el <code>id</code> de un grupo de celdas a las que se les aplica esta cabecera.
- <div class="note"><strong>Nota: </strong>Este atributo está obsoleto en el último estándar y no debe usarse. Puedes sustituirlo por {{htmlattrxref("scope", "th")}}.</div>
- </dd>
- <dt>{{htmlattrdef("bgcolor")}} {{Non-standard_inline}}</dt>
- <dd>Este atributo define el color de fondo de cada celda en una columna. Consiste en una código hexadecimal de 6 digitos, con un prefijo '#'. Este atributo puede usarse con uno de los 16 colores predefinidos:
- <table>
-  <tbody>
-   <tr>
-    <td style="background-color: black; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>black</code> = "#000000"</td>
-    <td style="background-color: green; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>green</code> = "#008000"</td>
-   </tr>
-   <tr>
-    <td style="background-color: silver; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>silver</code> = "#C0C0C0"</td>
-    <td style="background-color: lime; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>lime</code> = "#00FF00"</td>
-   </tr>
-   <tr>
-    <td style="background-color: gray; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>gray</code> = "#808080"</td>
-    <td style="background-color: olive; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>olive</code> = "#808000"</td>
-   </tr>
-   <tr>
-    <td style="background-color: white; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>white</code> = "#FFFFFF"</td>
-    <td style="background-color: yellow; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>yellow</code> = "#FFFF00"</td>
-   </tr>
-   <tr>
-    <td style="background-color: maroon; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>maroon</code> = "#800000"</td>
-    <td style="background-color: navy; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>navy</code> = "#000080"</td>
-   </tr>
-   <tr>
-    <td style="background-color: red; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>red</code> = "#FF0000"</td>
-    <td style="background-color: blue; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>blue</code> = "#0000FF"</td>
-   </tr>
-   <tr>
-    <td style="background-color: purple; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>purple</code> = "#800080"</td>
-    <td style="background-color: teal; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>teal</code> = "#008080"</td>
-   </tr>
-   <tr>
-    <td style="background-color: fuchsia; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>fuchsia</code> = "#FF00FF"</td>
-    <td style="background-color: aqua; width: 24px; height: 24px; border-width: 1px; border-color: black; border-style: solid;"></td>
-    <td><code>aqua</code> = "#00FFFF"</td>
-   </tr>
-  </tbody>
- </table>
-
- <div class="note"><strong>Nota:</strong> No usar este atributo, ya que no es un estándar y sólo esta implementado en algunas versiones de Microsoft Internet Explorer. El elemento {{HTMLElement("th")}} debe estilizarse usando <a href="/en-US/docs/CSS">CSS</a>. Para crear un efecto similar usa la propiedad {{cssxref("background-color")}}. </div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("char")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
- <dd>El contenido de la celda se alinea con un caracter en el elemento <code>&lt;th&gt;</code>. Los valores típicos incluyen un punto (.) para alinear números o valores monetarios. Si no se establece {{htmlattrxref("align", "th")}} como char, el atributo es ignorado.
- <div class="note"><strong>Nota: </strong>No usar este atributo, ya que no está soportado por el último estándar. Para lograr el mismo efecto, puedes especificar el caracter como el primer valor de la propiedad {{cssxref("text-align")}}, {{unimplemented_inline}} en CSS3.</div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("charoff")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
- <dd>This attribute is used to shift column data to the right of the character specified by the <strong>char</strong> attribute. Its value specifies the length of this shift.
- <div class="note"><strong>Nota: </strong>No usar este atributo, ya que no está soportado por el último estándar.</div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("colspan")}}</dt>
- <dd>This attribute contains a positive integer value that indicates over how many columns a cell is extended. Its default value is <code>1.</code> If its value is set to <code>0</code>, the cell is extended to the last element of the {{HTMLElement("colgroup")}}. Values higher than 1000 are clipped down to 1000.</dd>
- <dt>{{htmlattrdef("headers")}}</dt>
- <dd>This attribute contains a list of space-separated strings, each corresponding to the <code>id</code> attributes of other {{HTMLElement("th")}} elements that relate to this element.</dd>
- <dt>{{htmlattrdef("rowspan")}}</dt>
- <dd>This attribute contains a positive integer value that indicates over how many rows a cells is extended. Its default value is <code>1.</code> If its value is set to <code>0</code>, the cell is extended to the last element of the table sections ({{HTMLElement("thead")}}, {{HTMLElement("tbody")}} or {{HTMLElement("tfoot")}}). Values higher than 65534 are clipped down to 65534.</dd>
- <dt>{{htmlattrdef("scope")}}</dt>
- <dd>This enumerated attribute defines the cells that the header (defined in the {{HTMLElement("th")}}) element relates to. It may have the following values:
- <ul>
-  <li><code>row</code>:  The header relates to all cells of the row it belongs to.</li>
-  <li><code>col</code>: The header relates to all cells of the column it belongs to.</li>
-  <li><code>rowgroup</code>: The header belongs to a rowgroup and relates to all of its cells. These cells can be placed to the right or the left of the header, depending on the value of the <code><a href="/en-US/docs/Web/HTML/Global_attributes/dir">dir</a></code> attribute in the {{HTMLElement("table")}} element.</li>
-  <li><code>colgroup</code>: The header belongs to a colgroup and relates to all of its cells.</li>
-  <li><code>auto</code></li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("valign")}} {{Deprecated_inline}} in {{HTMLVersionInline("4")}}, {{obsolete_inline}} in {{HTMLVersionInline("5")}}</dt>
- <dd>This attribute specifies how a text is vertically aligned inside a cell. Possible values for this attribute are:
- <ul>
-  <li><code>baseline</code>: Positions the text near the bottom of the cell and aligns it with the <a href="https://en.wikipedia.org/wiki/Baseline_%28typography%29">baseline</a> of the characters instead of the bottom. If characters don't descend below the baseline, the baseline value achieves the same effect as <code>bottom</code>.</li>
-  <li><code>bottom</code>: Positions the text near the bottom of the cell.</li>
-  <li><code>middle</code>: Centers the text in the cell.</li>
-  <li>and <code>top</code>: Positions the text near the top of the cell.</li>
- </ul>
-
- <div class="note"><strong>Usage Note: </strong>Do not use this attribute as it is no longer supported by the latest standard: use the CSS {{cssxref("vertical-align")}} property instead.</div>
- </dd>
- <dt>{{htmlattrdef("width")}} {{Deprecated_inline}} in {{HTMLVersionInline(4.01)}}</dt>
- <dd>This attribute is used to define a recommended cell width.  Additional space can be added with the <a href="/en-US/docs/Web/API/HTMLTableElement/cellSpacing">cellspacing</a> and <a href="/en-US/docs/Web/API/HTMLTableElement/cellPadding">cellpadding</a> properties and the width of the {{HTMLElement("col")}} element can also create extra width. But, if a column's width is too narrow to show a particular cell properly, it will be widened when displayed.
- <div class="note"><strong>Usage Note: </strong>Do not use this attribute in the latest standard: use the CSS {{cssxref("width")}} property instead.</div>
- </dd>
-</dl>
-
-<h2 id="Examples">Examples</h2>
-
-<p>See {{HTMLElement("table")}} for examples on <code>&lt;th&gt;</code>.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG','tables.html#the-th-element','th element')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C','tabular-data.html#the-th-element','th element')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>align/valign</code> attribute</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>char/charoff</code> attribute</td>
-   <td>1.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}} [2]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>align/valign</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>char/charoff</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}} [2]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] See {{bug(915)}}.</p>
-
-<p>[2] See {{bug(2212)}}.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>Other table-related HTML Elements: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("thead")}}, {{HTMLElement("tr")}}.</li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/time/index.html b/files/es/web/html/elemento/time/index.html
deleted file mode 100644
index 8216d3b167..0000000000
--- a/files/es/web/html/elemento/time/index.html
+++ /dev/null
@@ -1,170 +0,0 @@
----
-title: time
-slug: Web/HTML/Elemento/time
-tags:
-  - Elemento
-  - Fecha
-  - HTML
-  - HTML5
-  - Hora
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/time
----
-<p>El <strong>elemento HTML <code>&lt;time&gt;</code></strong> representa un periodo específico en el tiempo. Puede incluir el atributo <code>datetime</code> para convertir las fechas en un formato interno legible por un ordenador, permitiendo mejores resultados en los motores de búsqueda o características personalizadas como recordatorios.</p>
-
-<p>Puede representar uno de los contenidos siguientes:</p>
-
-<ul>
- <li>Una hora en formato de 24 horas</li>
- <li>Una fecha precisa en el <a class="external" href="https://es.wikipedia.org/wiki/Calendario_gregoriano">Calendario Gregoriano</a> (con hora y zona horaria opcionales)</li>
- <li><a href="https://www.w3.org/TR/2014/REC-html5-20141028/infrastructure.html#valid-duration-string">Un periodo de tiempo válido</a></li>
-</ul>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/time.html", "tabbed-standard")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo está almacenada en un repositorio de GitHub. Si desea contribuir al projecto, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples </a> y envíe su solicitud de extracción (pull request).</p>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías de contenido</a></th>
-   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Contenido de flujo</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>, contenido palpable.</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content">Contenido de fraseo</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omisión de etiquetas</th>
-   <td>Ninguna;  tanto la etiqueta de inicio como de fin son obligatorias.</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>Cualquier elemento que acepte <a href="/en-US/docs/HTML/Content_categories#Phrasing_content">contenido de fraseo</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles permitidos en ARIA</th>
-   <td>Cualquiera</td>
-  </tr>
-  <tr>
-   <th scope="row">Interfaz DOM</th>
-   <td>{{domxref("HTMLTimeElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Como todos los elementos de HTML, este elemento soporta los <a href="https://developer.mozilla.org/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("datetime")}}</dt>
- <dd>Este atributo indica la hora y/o fecha del elemento y debe estar escrito en uno de los formatos que se muestran posteriomente.</dd>
-</dl>
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<p>Este elemento es para presentar fechas y horas en un formato legible por el equipo. Por ejemplo, este puede ayudar a un agente de usuario ofrecer añadir un evento al calendario del usuario.</p>
-
-<p>Este elemento no debe ser usado para fechas anteriores a la introducción del calendario Gregoriano (debido a complicaciones en el cálculo de dichas fechas).</p>
-
-<p>El valor de fecha y hora (el valor legible por el equipo) es el valor del atributo del elemento <code>datetime</code>, que debe estar en el formato correcto (vea más adelante). Si el elemento no tiene un atributo <code>datetime</code>, <strong>no debe tener ningún elemento descendiente</strong>, y el valor datetime es el contenido de texto del hijo del elemento.</p>
-
-<h3 id="Valores_datetime_válidos">Valores datetime válidos</h3>
-
-<dl>
- <dt>una cadena válida de año</dt>
- <dd><code>2011</code></dd>
- <dd><code>0001</code></dd>
- <dt>una cadena válida de mes</dt>
- <dd><code>2011-11</code></dd>
- <dt>una cadena válida de fecha</dt>
- <dd><code>2011-11-18</code></dd>
- <dt>una cadena de fecha sin año válida</dt>
- <dd><code>11-18</code></dd>
- <dt>una cadena de semana válida</dt>
- <dd><code>2011-W47</code></dd>
- <dt>una cadena de hora válida</dt>
- <dd><code>14:54</code></dd>
- <dd><code>14:54:39</code></dd>
- <dd><code>14:54:39.929</code></dd>
- <dt>una cadena de fecha y hora local válida</dt>
- <dd><code>2011-11-18T14:54:39.929</code></dd>
- <dd><code>2011-11-18 14:54:39.929</code></dd>
- <dt>una cadena de fecha y hora global válida</dt>
- <dd><code>2011-11-18T14:54:39.929Z</code></dd>
- <dd><code>2011-11-18T14:54:39.929-0400</code></dd>
- <dd><code>2011-11-18T14:54:39.929-04:00</code></dd>
- <dd><code>2011-11-18 14:54:39.929Z</code></dd>
- <dd><code>2011-11-18 14:54:39.929-0400</code></dd>
- <dd><code>2011-11-18 14:54:39.929-04:00</code></dd>
- <dt>una cadena valida de duración</dt>
- <dd><code>PT4H18M3S</code></dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Simple">Ejemplo Simple</h3>
-
-<h4 id="HTML">HTML</h4>
-
-<pre class="brush: html notranslate">&lt;p&gt;El concierto empieza a las &lt;time&gt;20:00&lt;/time&gt;.&lt;/p&gt;
-</pre>
-
-<h4 id="Output">Output</h4>
-
-<p>{{ EmbedLiveSample('Simple_example', 250, 60) }}</p>
-
-<h3 id="Datetime_example" name="Datetime_example">Ejemplo con <code>datetime</code></h3>
-
-<h4 id="HTML_2">HTML</h4>
-
-<pre class="brush: html notranslate">&lt;p&gt;El concierto fué el &lt;time
-  datetime="2001-05-15T19:00"&gt;15 de Mayo&lt;/time&gt;.&lt;/p&gt;
-</pre>
-
-<h4 id="Output_2">Output</h4>
-
-<p>{{ EmbedLiveSample('Datetime_example', 250, 60) }}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('HTML WHATWG', 'semantics.html#the-time-element', '&lt;time&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>Sin cambios desde {{SpecName('HTML5.1')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5.1', 'grouping-content.html#the-time-element', '&lt;time&gt;')}}</td>
-   <td>{{Spec2('HTML5.1')}}</td>
-   <td>Sin cambios desde {{SpecName('HTML5 W3C')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'text-level-semantics.html#the-time-element', '&lt;time&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada con información estructurada. Si desea contribuir, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíe su pull request.</div>
-
-<p>{{Compat("html.elements.time")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El elemento {{HTMLElement("data")}}, permite señalizar otro tipo de valores.</li>
-</ul>
diff --git a/files/es/web/html/elemento/tipos_de_elementos/index.html b/files/es/web/html/elemento/tipos_de_elementos/index.html
deleted file mode 100644
index e93752b734..0000000000
--- a/files/es/web/html/elemento/tipos_de_elementos/index.html
+++ /dev/null
@@ -1,119 +0,0 @@
----
-title: Tipos de elementos
-slug: Web/HTML/Elemento/Tipos_de_elementos
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
----
-<p>Los elementos se pueden agrupan de varias manera, aquí ofrecenos las siguientes: formal, estructural y funcional.</p>
-
-<h2 id="Seg.C3.BAn_el_doctype" name="Seg.C3.BAn_el_doctype">Según el doctype</h2>
-
-<p>Todo documento HTML debe tener un doctype, en el doctype se indica la dtd que se aplica al documento. La dtd es un archivo que, entre otras cosas, indica qué elementos pueden usarse en el documento, o cuales son sus atributos.</p>
-
-<p>Los doctypes válidos en HTML 4.01 son tres:</p>
-
-<h3 id="Para_marcos" name="Para_marcos">Para marcos</h3>
-
-<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
-       "<a class="external" href="http://www.w3.org/TR/html4/frameset.dtd" rel="freelink">http://www.w3.org/TR/html4/frameset.dtd</a>"&gt;
-</pre>
-
-<p>Con este doctype pueden usarse todos los elementos del html.</p>
-
-<h3 id="De_transici.C3.B3n" name="De_transici.C3.B3n">De transición</h3>
-
-<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
-       "<a class="external" href="http://www.w3.org/TR/html4/loose.dtd" rel="freelink">http://www.w3.org/TR/html4/loose.dtd</a>"&gt;
-</pre>
-
-<p>Pueden usarse todos los elementos <strong>menos</strong> los especificos de marcos que son: <a href="/es/docs/HTML/Elemento/frame">frame</a> <a href="/es/docs/HTML/Elemento/frameset">frameset</a></p>
-
-<h3 id="Estrictos" name="Estrictos">Estrictos</h3>
-
-<pre class="eval">&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
-       "<a class="external" href="http://www.w3.org/TR/html4/strict.dtd" rel="freelink">http://www.w3.org/TR/html4/strict.dtd</a>"&gt;
-</pre>
-
-<p>Con este doctype pueden usarse todos los elementos <strong>menos</strong> los específicos de los marcos: <a href="/es/docs/HTML/Elemento/frame">frame</a> <a href="/es/docs/HTML/Elemento/frameset">frameset</a> y los desaprobados: <a href="/es/docs/HTML/Elemento/applet">applet</a> <a href="/es/docs/HTML/Elemento/basefont">basefont</a> <a href="/es/docs/HTML/Elemento/center">center</a> <a href="/es/docs/HTML/Elemento/dir">dir</a> <a href="/es/docs/HTML/Elemento/font">font</a> <a href="/es/docs/HTML/Elemento/isindex">isindex</a> <a href="/es/docs/HTML/Elemento/menu">menu</a> <a href="/es/docs/HTML/Elemento/s">s</a> <a href="/es/docs/HTML/Elemento/strike">strike</a> <a href="/es/docs/HTML/Elemento/u">u</a></p>
-
-<h2 id="Seg.C3.BAn_su_estructura" name="Seg.C3.BAn_su_estructura">Según su estructura</h2>
-
-<p>Se dividen en tres grupos: básicos, de cabecera y de cuerpo.</p>
-
-<h3 id="Los_elementos_b.C3.A1sicos" name="Los_elementos_b.C3.A1sicos">Los elementos básicos</h3>
-
-<p>Son los elemento que conforman la columna vertebral de un documento html:</p>
-
-<dl>
- <dt>Para un documento normal</dt>
- <dd><a href="/es/docs/HTML/Elemento/html">html</a> <a href="/es/docs/HTML/Elemento/head">head</a> <a href="/es/docs/HTML/Elemento/body">body</a></dd>
-</dl>
-
-<dl>
- <dt>para uno de marcos</dt>
- <dd><a href="/es/docs/HTML/Elemento/html">html</a> <a href="/es/docs/HTML/Elemento/head">head</a> <a href="/es/docs/HTML/Elemento/frameset">frameset</a> <a href="/es/docs/HTML/Elemento/frame">frame</a></dd>
-</dl>
-
-<h3 id="De_cabecera" name="De_cabecera">De cabecera</h3>
-
-<p>Los de cabecera contienen la información necesaria para el correcto funcionamiento del documento.</p>
-
-<dl>
- <dt>Elementos de cabecera son</dt>
- <dd> </dd>
- <dd>El obligatorio: <a href="/es/docs/HTML/Elemento/title">title</a></dd>
- <dd>Los opcionales: <a href="/es/docs/HTML/Elemento/base">base</a> <a href="/es/docs/HTML/Elemento/meta">meta</a> <a href="/es/docs/HTML/Elemento/link">link</a></dd>
- <dd>Los mixtos: <a href="/es/docs/HTML/Elemento/style">style</a> <a href="/es/docs/HTML/Elemento/script">script</a> <a href="/es/docs/HTML/Elemento/object">object</a> y el transicional: <a href="/es/docs/HTML/Elemento/isindex">isindex</a>. Estos elementos pueden actuar como elementos de cabecera y de cuerpo.</dd>
-</dl>
-
-<h3 id="De_cuerpo" name="De_cuerpo">De cuerpo</h3>
-
-<p>Son los que estructuran el contenido del documento, pueden clasificarse en dos o tres grupos, los que forman parte del flujo del documento, estos son los elementos en bloque y los elementos en línea; y los que no forman parte directa del flujo.</p>
-
-<h4 id="En_bloque" name="En_bloque">En bloque</h4>
-
-<dl>
- <dt>Elementos en bloque son</dt>
- <dd> </dd>
- <dd><a href="/es/docs/HTML/Elemento/p">p</a> <a href="/es/docs/HTML/Elemento/dl">dl</a> <a href="/es/docs/HTML/Elemento/div">div</a> <a href="/es/docs/HTML/Elemento/address">address</a> <a href="/es/docs/HTML/Elemento/hr">hr</a> <a href="/es/docs/HTML/Elemento/blockquote">blockquote</a> <a href="/es/docs/HTML/Elemento/form">form</a> <a href="/es/docs/HTML/Elemento/table">table</a> <a href="/es/docs/HTML/Elemento/fieldset">fieldset</a> <a href="/es/docs/HTML/Elemento/pre">pre</a> <a href="/es/docs/HTML/Elemento/noscript">noscript</a> <a href="/es/docs/HTML/Elemento/noframes">noframes</a> Y los transicionales: <a href="/es/docs/HTML/Elemento/center">center</a> <a href="/es/docs/HTML/Elemento/isindex">isindex</a></dd>
- <dd>Los elementos de encabezados: <a href="/es/docs/HTML/Elemento/h1">h1</a> <a href="/es/docs/HTML/Elemento/h2">h2</a> <a href="/es/docs/HTML/Elemento/h3">h3</a> <a href="/es/docs/HTML/Elemento/h4">h4</a> <a href="/es/docs/HTML/Elemento/h5">h5</a> <a href="/es/docs/HTML/Elemento/h6">h6</a></dd>
- <dd>los elementos para listas: <a href="/es/docs/HTML/Elemento/ul">ul</a> y <a href="/es/docs/HTML/Elemento/ol">ol</a>. Y los transicionales: <a href="/es/docs/HTML/Elemento/dir">dir</a> <a href="/es/docs/HTML/Elemento/menu">menu</a></dd>
-</dl>
-
-<h4 id="En_l.C3.ADnea" name="En_l.C3.ADnea">En línea</h4>
-
-<dl>
- <dt>Elementos en línea son</dt>
- <dd> </dd>
- <dd>Los elementos de frase: <a href="/es/docs/HTML/Elemento/abbr">abbr</a> <a href="/es/docs/HTML/Elemento/acronym">acronym</a> <a href="/es/docs/HTML/Elemento/cite">cite</a> <a href="/es/docs/HTML/Elemento/code">code</a> <a href="/es/docs/HTML/Elemento/em">em</a> <a href="/es/docs/HTML/Elemento/strong">strong</a> <a href="/es/docs/HTML/Elemento/dfn">dfn</a> <a href="/es/docs/HTML/Elemento/kbd">kbd</a> <a href="/es/docs/HTML/Elemento/samp">samp</a> <a href="/es/docs/HTML/Elemento/var">var</a></dd>
- <dd>Los elementos de estilo de fuente: <a href="/es/docs/HTML/Elemento/b">b</a> <a href="/es/docs/HTML/Elemento/big">big</a> <a href="/es/docs/HTML/Elemento/i">i</a> <a href="/es/docs/HTML/Elemento/small">small</a> <a href="/es/docs/HTML/Elemento/tt">tt</a> y los desaprobados: <a href="/es/docs/HTML/Elemento/u">u</a> <a href="/es/docs/HTML/Elemento/s">s</a> <a href="/es/docs/HTML/Elemento/strike">strike</a></dd>
- <dd>Los elementos especiales: <a href="/es/docs/HTML/Elemento/a">a</a> <a href="/es/docs/HTML/Elemento/bdo">bdo</a> <a href="/es/docs/HTML/Elemento/br">br</a> <a href="/es/docs/HTML/Elemento/img">img</a> <a href="/es/docs/HTML/Elemento/map">map</a> <a href="/es/docs/HTML/Elemento/object">object</a> <a href="/es/docs/HTML/Elemento/q">q</a> <a href="/es/docs/HTML/Elemento/script">script</a> <a href="/es/docs/HTML/Elemento/span">span</a> <a href="/es/docs/HTML/Elemento/sub">sub</a> <a href="/es/docs/HTML/Elemento/sup">sup</a> y los desaprobados: <a href="/es/docs/HTML/Elemento/applet">applet</a> <a href="/es/docs/HTML/Elemento/font">font</a> <a href="/es/docs/HTML/Elemento/basefont">basefont</a> <a href="/es/docs/HTML/Elemento/iframe">iframe</a></dd>
- <dd>Los elementos de controles de formulario: <a href="/es/docs/HTML/Elemento/button">button</a> <a href="/es/docs/HTML/Elemento/input">input</a> <a href="/es/docs/HTML/Elemento/label">label</a> <a href="/es/docs/HTML/Elemento/select">select</a> <a href="/es/docs/HTML/Elemento/textarea">textarea</a></dd>
-</dl>
-
-<h4 id="Ni_en_bloque_ni_en_l.C3.ADnea" name="Ni_en_bloque_ni_en_l.C3.ADnea">Ni en bloque ni en línea</h4>
-
-<p>Son los elementos que no forman parte del flujo por que son elementos subordinados a otros elementos.</p>
-
-<dl>
- <dt>Elementos subordinados son</dt>
- <dd> </dd>
- <dd>Subordinados a table: <a href="/es/docs/HTML/Elemento/caption">caption</a> <a href="/es/docs/HTML/Elemento/tr">tr</a> <a href="/es/docs/HTML/Elemento/th">th</a> <a href="/es/docs/HTML/Elemento/td">td</a> <a href="/es/docs/HTML/Elemento/thead">thead</a> <a href="/es/docs/HTML/Elemento/tbody">tbody</a> <a href="/es/docs/HTML/Elemento/tfoot">tfoot</a> <a href="/es/docs/HTML/Elemento/col">col</a> <a href="/es/docs/HTML/Elemento/colgroup">colgroup</a></dd>
- <dd>Subordinados de listas: <a href="/es/docs/HTML/Elemento/li">li</a> <a href="/es/docs/HTML/Elemento/dd">dd</a> <a href="/es/docs/HTML/Elemento/dl">dl</a> Subordinados a select son: <a href="/es/docs/HTML/Elemento/optgroup">optgroup</a> <a href="/es/docs/HTML/Elemento/option">option</a></dd>
- <dd>Por último, <a href="/es/docs/HTML/Elemento/area">area</a> subordinado a map. <a href="/es/docs/HTML/Elemento/param">param</a> subordinado a object. y <a href="/es/docs/HTML/Elemento/legend">legend</a> subordinado a fieldset.</dd>
-</dl>
-
-<h4 id="En_bloque_y_en_l.C3.ADnea" name="En_bloque_y_en_l.C3.ADnea">En bloque y en línea</h4>
-
-<p>Los elementos <a href="/es/docs/HTML/Elemento/ins">ins</a> y <a href="/es/docs/HTML/Elemento/del">del</a> pueden ser elementos en línea o en bloque según convenga.</p>
-
-<h2 id="Seg.C3.BAn_su_funci.C3.B3n" name="Seg.C3.BAn_su_funci.C3.B3n">Según su función</h2>
-
-
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga carencias y defectos. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>Cómo ayudar</a>.</p>
-</div>
diff --git a/files/es/web/html/elemento/title/index.html b/files/es/web/html/elemento/title/index.html
deleted file mode 100644
index 978149f8a6..0000000000
--- a/files/es/web/html/elemento/title/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: title
-slug: Web/HTML/Elemento/title
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/title
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Indica el título del documento.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;title&gt; y &lt;/title&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>:</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#contenido_de_cabecera">Elemento de contenido de cabecera</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: texto y entidades de caracteres, pero no puede contener código.</dd>
-</dl>
-
-<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
-
-<dl>
- <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
-</dl>
-
-<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene." name="Atributos_Espec.C3.ADficos_-_No_tiene.">Atributos Específicos - No tiene.</h5>
-
-<h5 id="Atributos_Transicionales_-_No_tiene." name="Atributos_Transicionales_-_No_tiene.">Atributos Transicionales - No tiene.</h5>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre>&lt;head&gt;
-&lt;title&gt;Ejemplo de uso del elemento title&lt;/title&gt;
-... otros elementos de cabecera...
-&lt;/head&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p>Todos los documentos deben tener un título, por lo tanto este elemento <strong>es obligarorio</strong> y debe estar ubicado dentro del elemento head.</p>
-
-<p>El contenido de title suele ser mostrado en la barra de título de la ventana del navegador </p>
diff --git a/files/es/web/html/elemento/tr/index.html b/files/es/web/html/elemento/tr/index.html
deleted file mode 100644
index 6e57c8d5e0..0000000000
--- a/files/es/web/html/elemento/tr/index.html
+++ /dev/null
@@ -1,232 +0,0 @@
----
-title: <tr>
-slug: Web/HTML/Elemento/tr
-tags:
-  - Element
-  - Elemento
-  - HTML
-  - Reference
-  - Referencia
-  - Tabla
-  - Tablas
-  - Web
-translation_of: Web/HTML/Element/tr
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>El elemento HTML <em>fila de tabla</em> (<em>table row</em>) <code>&lt;tr&gt;</code> define una fila de celdas en una tabla. Estas pueden ser una mezcla de elementos {{HTMLElement("td")}} y {{HTMLElement("th")}}.</p>
-
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content categories">Content categories</a></td>
-   <td>Ninguno</td>
-  </tr>
-  <tr>
-   <td>Contenido permitido</td>
-   <td>Cero o más {{HTMLElement("td")}} o elementos {{HTMLElement("th")}}, o una mezcla de ellos</td>
-  </tr>
-  <tr>
-   <td>
-    <p>Omisión de Etiqueta  </p>
-   </td>
-   <td>La etiqueta de inicio es obligatoria. La etiqueta final puede ser omitida si el elemento {{HTMLElement("tr")}} va inmediatamente seguido por un elemento {{HTMLElement("tr")}}, o si el grupo de tabla pariente ({{HTMLElement("thead")}}, {{HTMLElement("tbody")}} o el elemento {{HTMLElement("tfoot")}}) no tiene mas contenido</td>
-  </tr>
-  <tr>
-   <td>Elementos padres permitidos</td>
-   <td>{{HTMLElement("table")}}, {{HTMLElement("thead")}}, {{HTMLElement("tbody")}} o el elemento {{HTMLElement("tfoot")}}</td>
-  </tr>
-  <tr>
-   <td>Documento de normativa</td>
-   <td><a class="external" href="http://www.whatwg.org/html/#the-tr-element">HTML, "The <code>tr</code> element"</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p><span style="line-height: 21px;">Este elemento incluye los </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height: 21px;">.</span></p>
-
-<dl>
- <dt>{{htmlattrdef("align")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
- <dd>Este atributo enumerado especifica como será gestionado el alineamiento horizontal del contenido de cada celda. Hay varios valores:
- <ul>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">left</font>, alinea el contenidoa la izquierda de las celdas</li>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">center</font>, centra el contenido en las celdas</li>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">right</font>, alinea el contenido a la derecha de las celdas</li>
-  <li><font face="Consolas, Liberation Mono, Courier, monospace">justify</font>, amplia los espacios en el contenido textual de hecho el contenido es justificado in las celdas</li>
-  <li><code>char</code>, alinea el contenido textual en un carácter especial con una mínima inclinación definida por el {{htmlattrxref("char", "tr")}} y {{htmlattrxref("charoff", "tr")}} atributos {{unimplemented_inline("2212")}}</li>
- </ul>
-
- <p>Si este atributo no está establecido, se hereda el valor del nodo principal.</p>
-
- <div class="note"><strong>Nota: No utilice este atributo, ya que es obsoleta (no soportado) en el último estándar</strong>.
-
- <ul>
-  <li>Para lograr el mismo efecto que los valores <code>left</code>, <code>center</code>, <code>right</code> o <code>justify</code>, utilice la propiedad CSS {{cssxref("text-align")}}.</li>
-  <li>Para lograr el mismo efecto que el valor char, en CSS3, puede utilizar el valor de la  {{htmlattrxref("char", "tr")}} como el valor de la {{cssxref("text-align")}} propiedad {{unimplemented_inline}}.</li>
- </ul>
- </div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("bgcolor")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
- <dd>Este atributo define el color de fondo de cada celda de la fila. Puede ser un código de #RRGGBB o una palabra clave de color de SVG.
- <div class="note"><strong>Nota de uso:</strong> el elemento {{HTMLElement("tr")}} debe ser de estilo con CSS. Para dar un efecto similar al atributo bgcolor, utilice la propiedad CSS {{cssxref("background-color")}}.</div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("char")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
- <dd>Este atributo es utilizado para establecer el caracter para alinear las celdas de una columna. Los valores típicos para éste incluyen un punto (.) al intentar alinear los números o valores monetarios. Si {{htmlattrxref("align", "tr")}} no se ha ajustado a char, este atributo se ignora.
- <div class="note"><strong>Nota:</strong> No utilice este atributo, ya que es obsoleta (y no es compatible) en el último estándar<strong>.</strong> Para lograr el mismo efecto que el {{htmlattrxref("char", "tr")}}, en CSS3, puedes utilizar el juego de carácteres utilizando el atributo {{htmlattrxref("char", "tr")}} como el valor de la referencia externa {{cssxref("text-align")}} propiedad {{unimplemented_inline}}.</div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("charoff")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
- <dd>Este atributo se utiliza para indicar el número de caracteres para compensar los datos de la columna de los carácteres de alineación especificado por el atributo char.
- <div class="note"><strong>Nota:</strong> No utilice este atributo, ya que está obsoleto (y no es compatible) en el último estándar.</div>
- </dd>
-</dl>
-
-<dl>
- <dt>{{htmlattrdef("valign")}} {{deprecatedGeneric("inline","html4.01")}}, {{obsoleteGeneric("inline","html5")}}</dt>
- <dd>Este atributo especifica la alineación vertical del texto dentro de cada fila de las celdas de la cabecera de la tabla. Los valores posibles para este atributo son:
- <ul>
-  <li><code>baseline</code>, que pondrá el texto tan cerca del fondo de la celda, ya que es posible, pero corresponda con el <a class="external" href="http://en.wikipedia.org/wiki/Baseline_%28typography%29" title="http://en.wikipedia.org/wiki/Baseline_(typography)">baseline</a> de los caráctere en lugar de la parte inferior de ellos. Si los carácteres son todos del tamaño, esto tiene el mismo efecto que la parte inferior.</li>
-  <li><code>bottom</code>,que pondrá el texto tan cerca de la parte inferior de la célula como sae posible;</li>
-  <li><code>middle</code>,que centrará el texto en la celda;</li>
-  <li>y <code>top</code>, que pondrá el texto como cerca de la parte superior de la célula como es posible.</li>
- </ul>
-
- <div class="note"><strong>Nota:</strong> No utilice este atributo, ya que está obsoleto (y no es compatible) en el último estándar: {{cssxref("vertical-align")}} en su lugar establecer la propiedad CSS en él.</div>
- </dd>
-</dl>
-
-<h2 id="Interfaz_DOM">Interfaz DOM</h2>
-
-<p>Este elemento implementa el  interfaz{{domxref("HTMLTableRowElement")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Ver {{HTMLElement("table")}} para ejemplos de <code>&lt;tr&gt;</code>.</p>
-
-<h2 id="Compatibilidad_con_Navegador">Compatibilidad con Navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>align/valign</code> attribute</td>
-   <td>1.0</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>char/charoff</code> attribute</td>
-   <td>1.0</td>
-   <td>{{CompatNo}} [2]</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>align/valign</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>char/charoff</code> attribute</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}} [2]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>bgcolor</code> attribute {{Non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] See {{bug(915)}}.</p>
-
-<p>[2] See {{bug(2212)}}.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Otros elementos relacionados con tablas HTML: {{HTMLElement("caption")}}, {{HTMLElement("col")}}, {{HTMLElement("colgroup")}}, {{HTMLElement("table")}}, {{HTMLElement("tbody")}}, {{HTMLElement("td")}}, {{HTMLElement("tfoot")}}, {{HTMLElement("th")}}, {{HTMLElement("thead")}};</li>
- <li>Las propiedades CSS y pseudo-clases que pueden ser especialmente útiles para el estilo del elemento &lt;tr&gt;:
-  <ul>
-   <li>El {{cssxref(":nth-child")}} pseudo-clase para establecer la alineación en las células de la columna;</li>
-   <li>El {{cssxref("text-align")}} propiedad para alinear todas las células contenidos en el mismo carácter, como '.'. &lt;</li>
-  </ul>
- </li>
-</ul>
-
-<p>{{HTMLRef}}</p>
diff --git a/files/es/web/html/elemento/track/index.html b/files/es/web/html/elemento/track/index.html
deleted file mode 100644
index e05d9f0a9e..0000000000
--- a/files/es/web/html/elemento/track/index.html
+++ /dev/null
@@ -1,179 +0,0 @@
----
-title: '<track>: El elemento para pistas de texto incrustado'
-slug: Web/HTML/Elemento/track
-tags:
-  - Accessibility
-  - Contenido HTML insertado
-  - Elemento
-  - HTML
-  - HTML5
-  - Multimedia
-  - Pistas de texto
-  - Reference
-  - Web
-  - a11y
-  - anotaciones
-  - track
-translation_of: Web/HTML/Element/track
----
-<div>{{HTMLRef}}</div>
-
-<p><span class="seoSummary">El <strong>elmento HTML <code>&lt;track&gt;</code></strong> es usado como hijo de los elementos multimedia, {{HTMLElement("audio")}} y {{HTMLElement("video")}}. Este te deja especificar pistas de texto temporizadas (o datos basados en el tiempo), por ejemplo para manejar automáticamente los subtítulos.</span> Las pistas de texto usan el <a href="/en-US/docs/Web/API/Web_Video_Text_Tracks_Format">formato WebVTT</a> (archivos <code>.vtt</code>) o de pistas de texto para la web.</p>
-
-<div>{{EmbedInteractiveExample("pages/tabbed/track.html", "tabbed-standard")}}</div>
-
-<div class="hidden">La fuente para este ejemplo interactivo esta alojada en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una pull request.</div>
-
-<table class="properties">
- <tbody>
-  <tr>
-   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Categorías del contenido</a></th>
-   <td>Ninguna</td>
-  </tr>
-  <tr>
-   <th scope="row">Contenido permitido</th>
-   <td>Ninguno, es un {{Glossary("empty element")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Omision de etiquetas</th>
-   <td>Como es un elemento vacío, la etiqueta de inicio debe estar presente y la etiqueta de cierre no debe estar presente.</td>
-  </tr>
-  <tr>
-   <th scope="row">Padres permitidos</th>
-   <td>Un elemento multimedia, {{HTMLElement("audio")}} o {{HTMLElement("video")}}.</td>
-  </tr>
-  <tr>
-   <th scope="row">Rol ARIA implícito</th>
-   <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">No hay rol correspondiente</a>.</td>
-  </tr>
-  <tr>
-   <th scope="row">Roles ARIA permitidos</th>
-   <td>No hay <code>role</code>s permitidos.</td>
-  </tr>
-  <tr>
-   <th scope="row">Intefaz DOM</th>
-   <td>{{domxref("HTMLTrackElement")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento incluye los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</p>
-
-<dl>
- <dt>{{htmlattrdef("default")}}</dt>
- <dd>Este atributo indica que esta pista de texto debe estar activada salvo que las preferencias del usuario indiquen que otra pista de texto es más apropiada. Este atributo solo puede ser usado en un elemento <code>track</code> por cada elemento multimedia.</dd>
- <dt>{{htmlattrdef("kind")}}</dt>
- <dd>Este atributo indica como esta pensada para usarse la pista de texto. Si lo omites el valor por defecto es <code>subtitles</code>. If the attribute contiene un valor invalido usará el valor <code>metadata</code> (Las versiones de Chrome anteriores a la 52 tratan un valor inválido como <code>subtitles</code>). Las siguientes palabras clave están permitidas:
- <ul>
-  <li><code>subtitles</code>
-   <ul>
-    <li>Los subtítulos proporciona la traducción de contenido que no puede ser entendido por el espéctador. Por ejemplo diálogos o texto que no está en español en una película en español.</li>
-    <li>Los subtítulos puede contener información adicional, normalmente información extra sobre el escenario. Por ejemplo el texto al principio de las películas de Stars Wars, o la fecha, el tiempo, y la ubicación de una escena.</li>
-   </ul>
-  </li>
-  <li><code>captions</code>
-   <ul>
-    <li>Este valor provee una transcripción y posiblemente una traducción del audio.</li>
-    <li>Puede incluir información no verbal importante como anotaciones sobre la música o efectos de sonido. Tambien puede indicar la fuente de la anotación (por ejemplo: música, texto, caracteres).</li>
-    <li>Es adecuado para usuarios sordos o cuando el sonido está apagado.</li>
-   </ul>
-  </li>
-  <li><code>descriptions</code>
-   <ul>
-    <li>Descripción textual del conenido del video.</li>
-    <li>Adecuado para usuarios ciegos o cuando el video no se puede ver.</li>
-   </ul>
-  </li>
-  <li><code>chapters</code>
-   <ul>
-    <li>Los títulos de los capítulos estan pensados para ser usados cuando el usuario esta navegando a través del recurso multimedia.</li>
-   </ul>
-  </li>
-  <li><code>metadata</code>
-   <ul>
-    <li>Pistas de texto usadas por programas. No visibles para el usuario.</li>
-   </ul>
-  </li>
- </ul>
- </dd>
- <dt>{{htmlattrdef("label")}}</dt>
- <dd>Da un título a la pista de texto que puedan entender los usuarios y que es usado por el navegador cuando esta mostrando la lista de pistas de texto disponibles.</dd>
- <dt>{{htmlattrdef("src")}}</dt>
- <dd>Señala la dirección de la pista de texto (archivo <code>.vtt</code>). Debe ser una URL valida. Este atributo debe ser especificado y su URL debe tener el mismo origen que el documento, salvo que el elemento {{HTMLElement("audio")}} o {{HTMLElement("video")}} que sea padre del elemento <code>track</code> tenga un atributo <code><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">crossorigin</a></code>.</dd>
- <dt>{{htmlattrdef("srclang")}}</dt>
- <dd>Señala el idioma de los datos de la pista de texto. Debe ser una etiqueta de idioma <a href="https://r12a.github.io/app-subtags/">BCP 47</a> valida. Si al atributo <code>kind</code> se le da el valor de <code>subtitles</code>, entonces <code>srclang</code> debe ser definido.</dd>
-</dl>
-
-<h2 id="Notas_de_uso">Notas de uso</h2>
-
-<h3 id="Tipos_de_datos_para_pistas_de_texto">Tipos de datos para pistas de texto</h3>
-
-<p>El tipo de dato que el elemento <code>track</code> añade al elemento multimedia es fijado en el atributo <code>kind</code>, que puede tener los valores de <code>subtitles</code>, <code>captions</code>, <code>descriptions</code>, <code>chapters</code> or <code>metadata</code>. El elemento apunta a un archivo fuente que contiene texto temporizado que el navegador muestra cuando el usuario solicita datos adicionales.</p>
-
-<p>Un elemento <code>media</code> no puede tener mas de un elemento <code>track</code> con el mismo valor en los atributos <code>kind</code>, <code>srclang</code>, y <code>label</code> a la vez.</p>
-
-<h3 id="Detectando_cambios_en_las_anotaciones">Detectando cambios en las anotaciones</h3>
-
-<p>{{page("/es/docs/Web/API/TextTrack/cuechange_event", "En el elemento track")}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html notranslate">&lt;video controls poster="/imagenes/ejemplo.gif"&gt;
-   &lt;source src="ejemplo.mp4" type="video/mp4"&gt;
-   &lt;source src="ejemplo.ogv" type="video/ogv"&gt;
-   &lt;track kind="captions" src="captionsDeEjemplo.vtt" srclang="en"&gt;
-   &lt;track kind="descriptions" src="descripciónDeEjemplo.vtt" srclang="en"&gt;
-   &lt;track kind="chapters" src="capítulosDeEjemplo.vtt" srclang="en"&gt;
-   &lt;track kind="subtitles" src="subtítulosDeEjemplo_de.vtt" srclang="de"&gt;
-   &lt;track kind="subtitles" src="subtítulosDeEjemplo_en.vtt" srclang="en"&gt;
-   &lt;track kind="subtitles" src="subtítulosDeEjemplo_ja.vtt" srclang="ja"&gt;
-   &lt;track kind="subtitles" src="subtítulosDeEjemplo_oz.vtt" srclang="oz"&gt;
-   &lt;track kind="metadata" src="etapaClave1.vtt" srclang="en"
-     label="Etapa clave 1"&gt;
-   &lt;track kind="metadata" src="etapaClave2.vtt" srclang="en"
-     label="Etapa clave 2"&gt;
-   &lt;track kind="metadata" src="etapaClave3.vtt" srclang="en"
-     label="Etapa clave 3"&gt;
-   &lt;!-- Fallback --&gt;
-   ...
-&lt;/video&gt;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('HTML WHATWG','embedded-content.html#the-track-element','track element')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML5 W3C", "semantics-embedded-content.html#the-track-element", "track element")}}</td>
-   <td>{{Spec2("HTML5 W3C")}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_navegadores">Compatibilidad con los navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página está generada desde datos estructurados. Si quieres contribuir a los datos, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una pull request.</div>
-
-<p>{{Compat("html.elements.track")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/HTML/WebVTT">El formato WebVTT para pistas de texto</a></li>
- <li>{{domxref("HTMLMediaElement.textTracks")}}</li>
-</ul>
diff --git a/files/es/web/html/elemento/tt/index.html b/files/es/web/html/elemento/tt/index.html
deleted file mode 100644
index 3bdd50de49..0000000000
--- a/files/es/web/html/elemento/tt/index.html
+++ /dev/null
@@ -1,58 +0,0 @@
----
-title: tt
-slug: Web/HTML/Elemento/tt
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/tt
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Muestra el texto marcado con una fuente de ancho fijo.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;tt&gt; y &lt;/tt&gt; (Ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">Elemento de estilo de fuente</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
-
-<ul>
- <li>title (título del elemento)</li>
- <li>style (información de estilo en línea)</li>
-</ul>
-
-<dl>
- <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
- <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
- <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
-</dl>
-
-<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
-
-<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">  &lt;p&gt;
-       Texto normal y... &lt;tt&gt;Texto con formato teletipo&lt;/tt&gt;
-  &lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p><span class="comment">de momento no funciona </span></p>
diff --git a/files/es/web/html/elemento/u/index.html b/files/es/web/html/elemento/u/index.html
deleted file mode 100644
index 1a355b443d..0000000000
--- a/files/es/web/html/elemento/u/index.html
+++ /dev/null
@@ -1,79 +0,0 @@
----
-title: u
-slug: Web/HTML/Elemento/u
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/u
----
-<p> </p>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Muestra el texto subrayado.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;u&gt; y &lt;/u&gt; (Ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>
-
- <dl>
-  <dd><a href="es/HTML/Elemento/Tipos_de_elementos#de_estilo_de_fuente">de estilo de fuente</a>.</dd>
-  <dd><a href="es/HTML/Elemento/Tipos_de_elementos#Desaprobado">Desaprobado</a></dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
-
-<ul>
- <li>title (título del elemento)</li>
- <li>style (información de estilo en línea)</li>
-</ul>
-
-<dl>
- <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
- <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
- <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
-</dl>
-
-<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene" name="Atributos_Espec.C3.ADficos_-_No_tiene">Atributos Específicos - No tiene</h5>
-
-<h5 id="Atributos_Transicionales_-_No_tiene" name="Atributos_Transicionales_-_No_tiene">Atributos Transicionales - No tiene</h5>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>Uso de u:</p>
-
-<pre class="eval">  &lt;p&gt;
-       Texto normal y... &lt;u&gt;Texto subrayado&lt;/u&gt;
-  &lt;/p&gt;
-</pre>
-
-<p>Uso de CSS:</p>
-
-<pre class="eval">  &lt;p&gt;
-       Texto normal y... &lt;span style='text-decoration: underline'&gt;Texto subrayado&lt;/span&gt;
-  &lt;/p&gt;
-</pre>
-
-<h3 id="Comentarios" name="Comentarios">Comentarios</h3>
-
-<p>Para obtener el mismo resultado puede usarse La propiedad CSS text-decoration: underline;</p>
-
-<p>Si por algún motivo necesita usar elementos desaprobados como u, recuerde que debe declarar un DOCTYPE transicional.</p>
-
-<div class="warning">DESAPROBADO</div>
-
-<p><span class="comment">de momento no funciona </span></p>
diff --git a/files/es/web/html/elemento/ul/index.html b/files/es/web/html/elemento/ul/index.html
deleted file mode 100644
index 6279c722bc..0000000000
--- a/files/es/web/html/elemento/ul/index.html
+++ /dev/null
@@ -1,151 +0,0 @@
----
-title: ul
-slug: Web/HTML/Elemento/ul
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/ul
----
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p><strong>ul</strong> de "unordered list" -<em>lista no ordenada</em> . crea una lista no ordenada.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: <code>&lt;ul&gt; y &lt;/ul&gt;</code> (ambas obligatorias).</dd>
- <dd><strong>Está definido como</strong>: Elemento <a href="es/HTML/Elemento/Tipos_de_elementos#delista">para listas</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: En bloque.</dd>
- <dd><strong>Puede contener</strong>: Uno o más elementos <a href="es/HTML/Elemento/li">li</a></dd>
-</dl>
-
-<h4 id="Atributos" name="Atributos">Atributos</h4>
-
-<table class="fullwidth-table standard-table">
- <tbody>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
-  <tr>
-   <th colspan="3">Genéricos</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-title"><span style="color: green;">title </span></a></td>
-   <td>Texto informativo o título del elemento. Suele mostrarse a modo de "tool tip".</td>
-   <td>Texto legible por personas. Sensible a <abbr title="diferencia entre Mayúsculas y minúsculas">M/m.</abbr>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-id"><span style="color: green;">id </span></a></td>
-   <td>Le da un nombre al elemento que lo diferencia de todos los demás del documento.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-id">nombre único</a>. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/global.html#adef-class"><span style="color: green;">class </span></a></td>
-   <td>Asigna nombres de clases al elemento. Por defecto, clases CSS.</td>
-   <td>Lista de clases separadas por espacio en blanco. Sensible a <abbr title="diferencia entre Máyusculas y minúsculas">M/m.</abbr> Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html#adef-style"><span style="color: green;">style </span></a></td>
-   <td>Permite especificar <a class="external" href="http://html.conclase.net/w3c/html401-es/present/styles.html">información de estilo</a>. Por defecto, estilos CSS.</td>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-style">Declaraciones de estilo</a>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-lang"><span style="color: green;">lang </span></a></td>
-   <td>Información sobre el <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">idioma del contenido</a> del elemento y del valor de sus atributos.</td>
-   <td>Un <a class="external" href="http://html.conclase.net/w3c/html401-es/types.html#type-langcode">código de idioma</a>. Por defecto: "desconocido". Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html#adef-dir"><span style="color: green;">dir </span></a></td>
-   <td>Indica la <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/dirlang.html">dirección de texto</a> y tablas.</td>
-   <td>Uno de los siguientes: <abbr title="Left-to-right"> 'ltr' </abbr> o <abbr title="Right-to-left"> 'rtl'. </abbr> Por defecto: En castellano 'ltr'. Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <td colspan="3"><a class="external" href="http://html.conclase.net/w3c/html401-es/interact/scripts.html#events"><span style="color: green;">Eventos:</span></a> <code style="color: green;">onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup. </code></td>
-  </tr>
-  <tr>
-   <th colspan="3">Específicos</th>
-  </tr>
-  <tr>
-   <td colspan="3">No tiene</td>
-  </tr>
-  <tr>
-   <th colspan="3">De transición</th>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/lists.html#adef-type-UL"><code style="color: green;">type</code></a></td>
-   <td>Indica el estilo de los items de la lista.</td>
-   <td>Uno de los siguientes: <code>'disc', 'square', o 'circle'</code>. Por defecto: depende del anidamiento, lo fija el navegador</td>
-  </tr>
-  <tr>
-   <td><a class="external" href="http://html.conclase.net/w3c/html401-es/struct/lists.html#adef-compact"><code style="color: green;">compact</code></a></td>
-   <td>Indica que la lista debe mostrase conpactada.</td>
-   <td>Solo puede ser: <code>'compact'</code>. Por defecto: Lo fija el navegador.</td>
-  </tr>
-  <tr>
-   <th>atributo</th>
-   <th>descripción</th>
-   <th>valor</th>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Ejemplos_de_uso" name="Ejemplos_de_uso">Ejemplos de uso</h3>
-
-<div class="highlight">
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>El siguiente código:</p>
-
-<pre class="eval">&lt;ul&gt;
- &lt;li&gt;Esto&lt;/li&gt;
- &lt;li&gt;Lo otro&lt;/li&gt;
- &lt;li&gt;Lo de más allá&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-
-<p>Se visualiza así:</p>
-
-<div style="border: solid silver 1px;">
-<ul>
- <li>Esto</li>
- <li>Lo otro</li>
- <li>Lo de más allá</li>
-</ul>
-</div>
-</div>
-
-<h3 id="Estilo_predeterminado" name="Estilo_predeterminado">Estilo predeterminado</h3>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<h3 id="Referencia" name="Referencia">Referencia</h3>
-
-<ul>
- <li>El elemento <a class="external" href="http://html.conclase.net/w3c/html401-es/struct/lists.html#edef-UL"><strong>ul</strong> en la especificación</a> de html 4.01</li>
-</ul>
-
-<p> </p>
-
-<h3 id="Soporte" name="Soporte">Soporte</h3>
-
-<p>Puede consultar esta <a class="external" href="http://www.webdevout.net/browser_support_html.php#support-html401-ul">comparativa</a>: IE 6 - IE 7 - FF 1.5 - OP 9.</p>
-
-<p> </p>
-
-<hr>
-<div class="note">
-<p>Estamos ampliando este documento, posiblemente contenga defectos y carencias. ¡Estamos en obras!... disculpen las molestias.</p>
-
-<p>¿Quieres participar en su elaboración? Para saber cómo hacerlo consulta <a>MDC:Como ayudar</a>.</p>
-</div>
-
-<p><br>
- <span class="comment">Categoría</span></p>
-
-<p><span class="comment">interwiki links</span></p>
-
-<p><span class="comment">automatismos</span></p>
diff --git a/files/es/web/html/elemento/var/index.html b/files/es/web/html/elemento/var/index.html
deleted file mode 100644
index dd29c31159..0000000000
--- a/files/es/web/html/elemento/var/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: var
-slug: Web/HTML/Elemento/var
-tags:
-  - HTML
-  - 'HTML:Elemento'
-  - Todas_las_Categorías
-translation_of: Web/HTML/Element/var
----
-<div>{{HTMLRef}}</div>
-
-<h3 id="Definici.C3.B3n" name="Definici.C3.B3n">Definición</h3>
-
-<p>Marca variables de programas y similares.</p>
-
-<dl>
- <dd><strong>Sus etiquetas son</strong>: &lt;var&gt; y &lt;/var&gt; (ambas obligatorias)</dd>
-</dl>
-
-<dl>
- <dd><strong>Crea una caja</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Está definido como</strong>: <a href="es/HTML/Elemento/Tipos_de_elementos#de_frase">Elemento de frase</a>.</dd>
-</dl>
-
-<dl>
- <dd><strong>Puede contener</strong>: cero o más elementos<a href="es/HTML/Elemento/Tipos_de_elementos#en_linea">en linea</a></dd>
-</dl>
-
-<h5 id="Atributos_Gen.C3.A9ricos" name="Atributos_Gen.C3.A9ricos">Atributos Genéricos</h5>
-
-<ul>
- <li>title (título del elemento)</li>
- <li>style (información de estilo en línea)</li>
-</ul>
-
-<dl>
- <dd><strong>Identificadores</strong>: id, class (identificadores a nivel de documento)</dd>
- <dd><strong>Idioma</strong>: lang (información sobre el idioma), dir (dirección del texto)</dd>
- <dd><strong>Eventos</strong>: onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.</dd>
-</dl>
-
-<h5 id="Atributos_Espec.C3.ADficos_-_No_tiene." name="Atributos_Espec.C3.ADficos_-_No_tiene.">Atributos Específicos - No tiene.</h5>
-
-<h5 id="Atributos_Transicionales_-_No_tiene." name="Atributos_Transicionales_-_No_tiene.">Atributos Transicionales - No tiene.</h5>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="eval">&lt;p&gt;
-el bucle no se detendrá hasta que &lt;var&gt;Faltan&lt;/var&gt; sea igual a 0.
-&lt;/p&gt;
-</pre>
diff --git a/files/es/web/html/elemento/video/index.html b/files/es/web/html/elemento/video/index.html
deleted file mode 100644
index e816c5db91..0000000000
--- a/files/es/web/html/elemento/video/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: video
-slug: Web/HTML/Elemento/video
-tags:
-  - HTML
-  - HTML5
-  - Multimedia
-  - para_revisar
-translation_of: Web/HTML/Element/video
----
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El elemento <code>video</code> se utiliza para incrustar vídeos en un documento HTML o XHTML.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para obtener una lista de formatos compatibles, consulta <a href="/es/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio" title="es/Formatos multimedia admitidos por los elementos de video y audio">Formatos multimedia admitidos por los elementos de audio y vídeo</a> .</span></span></p>
-
-<h2 id="Contexto_de_uso"><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contexto de uso</span></span></h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Contenido permitido</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><a href="/en/HTML/Content_categories#transparent_content" title="en/HTML/Content categories#transparent content">Contenido transparente</a> , que contiene un atributo <strong>src</strong> o uno o más elementos {{ HTMLElement ("source") }}, seguidos por <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> o <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">el contenido estático</a> , sin elementos <code> &lt;video&gt;</code> ni  {{ HTMLElement ("audio") }}.</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Omisión de etiquetas</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Elementos primarios permitidos</span></span></td>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cualquier elemento que acepte <a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">contenido dinámico</a> o cualquier otro elemento que acepte <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">contenido estático</a> .</span></span></td>
-  </tr>
-  <tr>
-   <td><span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Documento normativo</span></span></td>
-   <td><a class="external" href="http://www.w3.org/TR/html5/video.html#video" title="http://www.w3.org/TR/html5/video.html#video"><span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTML 5, sección 4.8.6</span></span></a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos"><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Atributos</span></span></h2>
-
-<dl>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("autoplay") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo booleano; si se especifica, el video comenzará a reproducirse automáticamente tan pronto como sea posible, sin detenerse para terminar de cargar los datos.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("autobuffer") }} {{ Non-standard_inline() }} {{ obsolete_inline() }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo booleano; si se especifica, el video comenzará automáticamente a almacenarse en el búfer, incluso si no está listo para reproducirse de forma automática.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto se debe utilizar para los casos en los que se considera probable que el video se reproduzca (por ejemplo, si el usuario accedió a esa página específica para reproducir el video, no si hay un video insertado junto con otros contenidos). </span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El video se almacena en el búfer hasta que el caché de medios esté lleno.</span></span>
- <div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota de implementación:</strong> aunque forma parte de los primeros borradores de la especificación HTML 5, el atributo <strong>autobuffer</strong> se ha eliminado en versiones posteriores.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Se ha quitado de Gecko 2.0 y otros navegadores, y en algunos nunca llegó a implementarse.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-23"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La especificación define un nuevo atributo enumerado, <strong>preload,</strong> para sustituir el atributo <strong>autobuffer,</strong> con una sintaxis diferente. {{ bug (548523) }}</span></span></div>
- </dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("buffered") }} {{ gecko_minversion_inline("2.0") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo que se puede leer para determinar qué intervalos de tiempo del multimedia se han almacenado en búfer.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Este atributo contiene un objeto </span></span>{{ domxref("TimeRanges") }}<span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"> .</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-27"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("controls") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-28"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si está presente este atributo, Gecko ofrecerá controles para permitir que el usuario controle la reproducción de video, incluyendo volumen, búsqueda y pausar/reanudar reproducción.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("height") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La altura del área de visualización del vídeo en píxeles CSS.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("loop") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Un atributo booleano; si se especifica, al alcanzar el final del video, buscaremos automáticamente hasta el principio.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("preload") }} {{ gecko_minversion_inline("2.0") }} {{ bug(548523) }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El objetivo de este atributo enumerado es proporcionar una sugerencia al navegador sobre qué cree el autor que llevará a la mejor experiencia para el usuario .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Puede tener uno de los siguientes valores:</span></span>
- <ul>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><span style="font-family: courier new;">none</span>: sugiere bien que el autor cree que el usuario no tendrá que consultar ese video, bien que el servidor desea minimizar su tráfico; es decir, esta sugerencia indica que no se debe almacenar en caché este video.</span></span></li>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><span style="font-family: courier new;">metadatos:</span> sugiere que aunque el autor piensa que el usuario no tendrá que consultar este video, es razonable capturar los metadatos (p. ej. longitud).</span></span></li>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><span style="font-family: courier new;">auto:</span> sugiere que el usuario necesita tener prioridad; es decir, esta sugerencia indica que, si es necesario, se puede descargar el video completo, incluso aunque el usuario no vaya a usarlo.</span></span></li>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">la <em>cadena vacía:</em> que es un sinónimo del valor <span style="font-family: courier new;">auto</span>.</span></span></li>
- </ul>
-
- <p><span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no está configurado, su valor predeterminado está definido por el navegador (es decir, cada navegador puede elegir su propio valor predeterminado), aunque la especificación aconseje que se establezca a <span style="font-family: courier new;">metadata</span>.</span></span></p>
-
- <div class="note"><strong><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Notas de uso:</span></span></strong>
-
- <ul>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-42"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">El atributo <strong>autoplay</strong>  tiene prioridad sobre éste si se desea reproducir automáticamente un video, el navegador obviamente tendrá que descargarlo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-from-human goog-gtc-ph-missing goog-gtc-translatable" dir="ltr">La especificación permite establecer los atributos <strong>autoplay</strong> y <strong>preload</strong>.</span></span></li>
-  <li><span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La especificación no fuerza al navegador a seguir el valor de este atributo; es tan sólo una sugerencia.</span></span></li>
- </ul>
- </div>
- </dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("poster") }} {{ gecko_minversion_inline("1.9.2") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una URL que indica un marco de póster para mostrar el resultado hasta que el usuario reproduzca o busque.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si este atributo no se especifica, no se muestra nada hasta que el primer cuadro está disponible, entonces se muestra el primer marco como el marco de póster.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">{{ htmlattrdef("src") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La URL del vídeo que se va a insertar.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Es opcional; podrás optar, en su lugar, por el elemento {{ HTMLElement("source") }} dentro del bloque de vídeo para especificar el video que se va a incrustar.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ htmlattrdef("width") }}</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La anchura del área de visualización del vídeo en píxeles CSS.</span></span></dd>
-</dl>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las compensaciones de tiempo se especifican actualmente como valores float que representan el número de segundos que se va a compensar.</span></span></p>
-
-<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota:</strong> la definición del valor de compensación de tiempo no se ha completado en HTML 5 aún y está sujeta a cambios.</span></span></div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: html">&lt;video src="videofile.ogg" autoplay poster="posterimage.jpg"&gt;
-  Tu navegador no admite el elemento &lt;code&gt;video&lt;/code&gt;.
-&lt;/video&gt;
-</pre>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Reproduce un vídeo, comenzando tan pronto como la recepción de video sea suficiente para permitir la reproducción sin pausas para descargar más.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Mientras que el video comienza a reproducirse, se mostrará la imagen "posterimage.jpg" en su lugar.</span></span></p>
-
-<h2 id="Compatibilidad_con_servidores"><span class="goog-gtc-unit" id="goog-gtc-unit-61"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Compatibilidad con servidores</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-62"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Vale la pena volver a hacer hincapié, por el momento, en que si los tipos MIME para vídeo Theora no se establecen en el servidor, tal vez el vídeo no se muestre o muestre un cuadro gris con una X (si JavaScript está activado).</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-63"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Puedes solucionar este problema para el servidor Web Apache añadiendo la extensión utilizada por tus archivos de vídeo Theora (".ogm", ".ogv", o ".ogg" son los más comunes) al tipo MIME "video / ogg" a través del archivo "mime.types" en "/ etc / apache" o por medio de la directiva de configuración "AddType" en httpd.conf.</span></span></p>
-
-<pre><span class="goog-gtc-unit" id="goog-gtc-unit-64-goog-gtc-unit-65-goog-gtc-unit-66"><span class="goog-gtc-from-human goog-gtc-translatable">AddType video/ogg .ogm
-AddType video/ogg .ogv
-AddType video/ogg .ogg
-</span></span>
-</pre>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Su proveedor de alojamiento web puede proporcionar una interfaz fácil para los cambios de configuración de tipo MIME que presentan las nuevas tecnologías hasta que tenga lugar una actualización global de forma natural.</span></span></p>
-
-<h2 id="Interfaz_DOM"><span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Interfaz DOM</span></span></h2>
-
-<ul>
- <li><a href="/en/DOM/HTMLVideoElement" title="en/DOM/HTMLVideoElement"><span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">HTMLVideoElement</span></span></a></li>
-</ul>
-
-<h2 id="Consulta_también"><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-from-tm goog-gtc-from-tm-score-100 goog-gtc-translatable" dir="ltr">Consulta también</span></span></h2>
-
-<ul>
- <li><a class="internal" href="/es/Formatos_multimedia_admitidos_por_los_elementos_de_video_y_audio" title="es/Formatos multimedia admitidos por los elementos de video y audio"><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Formatos multimedia admitidos por los elementos de audio y video</span></span></a></li>
- <li><a class="internal" href="/es/HTML/Elemento/Audio" title="es/HTML/Elemento/Audio"><code>audio</code></a></li>
- <li><a class="internal" href="/Es/Usar_audio_y_vídeo_en_Firefox" title="es/Usar audio y video en Firefox"><span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Usar audio y vídeo en Firefox</span></span></a></li>
- <li><a class="internal" href="/En/Manipulating_video_using_canvas" title="En/Manipulating video using canvas"><span class="goog-gtc-unit" id="goog-gtc-unit-73"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Manipular vídeo por medio de canvas</span></span></a></li>
- <li><a class="internal" href="/En/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement" title="En/XPCOM Interface Reference/NsIDOMHTMLMediaElement"><code>nsIDOMHTMLMediaElement</code></a></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-74"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><a class="external" href="http://tinyvid.tv/" title="http://tinyvid.tv/">TinyVid</a>:ejemplos de uso de ogg en HTML 5.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-75"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#video" title="http://www.whatwg.org/specs/web-apps/current-work/#video">El elemento <code>video</code></a> (especificación de HTML 5)</span></span></li>
- <li><a class="internal" href="/en/Configuring_servers_for_Ogg_media" title="en/Configuring servers for Ogg media"><span class="goog-gtc-unit" id="goog-gtc-unit-76"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Configuración de servidores para medios Ogg</span></span></a></li>
-</ul>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-77"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">{{ languages( { "fr": "fr/HTML/Element/video","en": "en/HTML/Element/video" } ) }}</span></span></p>
diff --git a/files/es/web/html/elemento/wbr/index.html b/files/es/web/html/elemento/wbr/index.html
deleted file mode 100644
index 2cee9077c4..0000000000
--- a/files/es/web/html/elemento/wbr/index.html
+++ /dev/null
@@ -1,115 +0,0 @@
----
-title: <wbr>
-slug: Web/HTML/Elemento/wbr
-tags:
-  - Elemento
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/wbr
----
-<div>{{HTMLRef}}</div>
-
-<div>El elemento HTML <em>word break opportunity </em><font face="Consolas, Liberation Mono, Courier, monospace"><code>&lt;wbr</code></font><em><font face="Consolas, Liberation Mono, Courier, monospace"><code>&gt;</code></font></em> representa una posición dentro del texto donde el explorador puede opcionalmente saltar una línea , aunque sus reglas de salto de línea de otra manera no crearían un salto en esa posición .</div>
-
-<div> </div>
-
-<div>En páginas codificadas en UTF-8 , <font face="Consolas, Liberation Mono, Courier, monospace">&lt;wbr&gt; </font>se comporta como el punto de código <code>U+200B</code><code> ZERO-WIDTH SPACE </code>. En particular se comporta como un punto de código unicode bidi BN , significando esto que no tiene efecto en ordenamiento bidi : <code>&lt;div dir=rtl&gt;123,&lt;wbr&gt;456&lt;/div&gt; </code>muestra , cuando no se rompa en dos líneas , 123, 456 y no 456 , 123 .</div>
-
-<div> </div>
-
-<p>Por la misma razón el elemento <code>&lt;wbr&gt;</code> no introduce un guión en el salto de línea  .  Para hacer aparecer un guión solo al final de la línea , usar la entidad de caracter del  guión de separación  (<code>&amp;shy;</code>) en su lugar.</p>
-
-<p>Este elemento fue implementado por primera vez en Internet Explorer 5.5 y fue oficialmente definido en HTML5 .</p>
-
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-
-<table class="standard-table" style="font-size: 14px; font-weight: normal; line-height: 1.5;">
- <tbody>
-  <tr>
-   <td>Contenido permitido</td>
-   <td>Vacío</td>
-  </tr>
-  <tr>
-   <td>Omisión de etiquetas</td>
-   <td>Es un  {{Glossary("empty element")}}; debe de tener una etiqueta de inicio pero no debe de tener una de cierre .</td>
-  </tr>
-  <tr>
-   <td>Elementos padre permitidos</td>
-   <td>Cualquier elemento que permita  contenido estático de texto.</td>
-  </tr>
-  <tr>
-   <td>Documento normativo</td>
-   <td><a class="external" href="http://dev.w3.org/html5/spec/text-level-semantics.html#the-wbr-element">HTML 5, section 4.6.24</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Este elemento solo incluye los<a href="/es/docs/Web/HTML/Atributos_Globales"> atributos globales</a> .</p>
-
-<h2 id="Interfase_DOM">Interfase DOM</h2>
-
-<h2 id="Este_elemento_implementa_la_interface_HTMLElement_."><span style="font-size: 14px; font-weight: normal; line-height: 21px;">Este elemento implementa la interface <a href="/es/docs/Web/API/HTMLElement">HTMLElement </a>. </span></h2>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>La <a href="http://styleguide.yahoo.com/">guia de estilo de Yahoo </a>recomienda <a href="https://shopping.yahoo.com/9780312569846-yahoo-style-guide/">romper una URL antes de la puntuación</a> , para evitar dejar una marca de puntuación en el final de la línea , lo cual el lector podría confundir con el final de la URL .</p>
-
-<pre class="brush: html">&lt;p&gt;http://this&lt;wbr&gt;.is&lt;wbr&gt;.a&lt;wbr&gt;.really&lt;wbr&gt;.long&lt;wbr&gt;.example&lt;wbr&gt;.com/With&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;wbr&gt;/deeper&lt;wbr&gt;/level&lt;wbr&gt;/pages&lt;/p&gt;
-</pre>
-
-<p>{{EmbedLiveSample("Example")}}</p>
-
-<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.0</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}<sup>[1]</sup></td>
-   <td>11.7</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>1.5</td>
-   <td>1.0</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1]El soporte para la etiqueta <code>&lt;wbr&gt;</code> fue introducido en Internet Explorer 5.5 , aunque removido hasta la versión 7 .</p>
diff --git a/files/es/web/html/elemento/xmp/index.html b/files/es/web/html/elemento/xmp/index.html
deleted file mode 100644
index 88ab19b65e..0000000000
--- a/files/es/web/html/elemento/xmp/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: <xmp>
-slug: Web/HTML/Elemento/xmp
-tags:
-  - Elemento
-  - HTML
-  - Obsoleto
-  - Referencia
-  - Web
-translation_of: Web/HTML/Element/xmp
----
-<div>{{Obsolete_header}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El elemento HTML example element <font face="Consolas, Liberation Mono, Courier, monospace">&lt;xmp&gt; </font>dibuja texto entre las etiquetas de inicio y fin sin interpretar el HTML que se encuentra en medio  y lo muestra usando un tipo de letra monoespaciada . La especificación de HTML2 recomendaba que que esta debería de ser dibujada suficientemente amplia para permitir 80 caracteres por línea .</p>
-
-<div class="note">
-<p><strong>Nota: </strong>No usar este elemento .</p>
-
-<ul>
- <li>Ha sido declarado obsoleto desde HTML3.2 y no fue implementado en una manera consistente . Fue completamente removido del lenguaje en HTML5 .</li>
- <li>Usar el elemento  {{HTMLElement("pre")}} , o si es semánticamente adecuado , el elemento {{HTMLElement("code")}} en su lugar . Notar que necesitarás escapar los caracteres '&lt;' como '&amp;lt' para asegurarse que no se interprete como marcado .</li>
- <li>Una letra monoespaciada también puede ser obtenida en algún elemento , aplicando el estilo  <a href="/es/docs/Web/CSS">CSS</a> adecuado usando <code>monospace </code>como el valor genérico de la fuente para la propiedad {{cssxref("font-family")}}</li>
-</ul>
-</div>
-
-<h2 id="Attributes" name="Attributes">Atributos</h2>
-
-<p>Este elemento no tiene otros atributos que los<a href="/es/docs/Web/HTML/Atributos_Globales"> atributos globales </a> comunes a todos los elementos .</p>
-
-<h2 id="DOM_interface" name="DOM_interface">Interfaz  DOM</h2>
-
-<p>Este elemento implementa la interface {{domxref('HTMLElement')}} .</p>
-
-<div class="note">
-<p><strong>Nota de implementación: </strong>hasta  Gecko 1.9.2 inclusivamente , Firefox implemente la interface {{domxref('HTMLSpanElement')}} para este elemento . </p>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>Los elementos  {{HTMLElement("pre")}} y  {{HTMLElement("code")}} que se usan en su lugar .</li>
- <li>Los elementos  {{HTMLElement("plaintext")}} y  {{HTMLElement("listing")}} , similares a {{HTMLElement("xmp")}} pero también obsoletos .</li>
-</ul>
-
-<div>{{HTMLRef}}</div>
diff --git a/files/es/web/html/elementos_en_línea/index.html b/files/es/web/html/elementos_en_línea/index.html
deleted file mode 100644
index 192715aef3..0000000000
--- a/files/es/web/html/elementos_en_línea/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
----
-title: Elementos en línea
-slug: Web/HTML/Elementos_en_línea
-tags:
-  - Guía
-  - HTML
-  - HTML5
-  - Principiante
-  - Web
-  - desarrollo
-translation_of: Web/HTML/Inline_elements
----
-<p><span class="seoSummary">Los elementos en HTML (lenguaje de marcas de hipertexto - <strong>Hypertext Markup Language</strong>) usualmente son elementos "en línea" o <a href="/es/docs/Web/HTML/Block-level_elements" title="/es/docs/Web/HTML/Block-level_elements">elementos "en bloque"</a>. Un elemento en línea ocupa sólo el espacio delimitado por las etiquetas que definen el elemento en línea. El siguiente ejemplo demuestra la influencia de los elementos en línea:</span></p>
-
-<h2 id="Inline_example" name="Inline_example">Ejemplo en línea</h2>
-
-<h3 id="HTML">HTML</h3>
-
-<pre class="brush: html">&lt;p&gt;Este &lt;span&gt;span&lt;/span&gt; es un elemento en línea; este fondo se ha coloreado para mostrar el principio y fin de la influencia del elemento en línea&lt;/p&gt;</pre>
-
-<h3 id="CSS">CSS</h3>
-
-<pre class="brush: css">span { background-color: #8ABB55; }
-</pre>
-
-<p>{{ EmbedLiveSample('Inline_example') }}</p>
-
-<h2 id="Elmentos_en_línea_vs._en_bloque">Elmentos en línea vs. en bloque</h2>
-
-<dl>
- <dt>Formateo</dt>
- <dd>De forma predeterminada, los elementos en línea no comienzan con la nueva línea.</dd>
- <dt>Modelo de contenido</dt>
- <dd>En general, los elementos en línea pueden contener únicamente los datos y otros elementos en línea.</dd>
-</dl>
-
-<h2 id="Elementos">Elementos</h2>
-
-<p>Los siguientes elementos son "en línea":</p>
-
-<ul id="inline-elements">
- <li><a href="/es/docs/Web/HTML/Elemento/b" title="/es/docs/Web/HTML/Elemento/b">b</a>, <a href="/es/docs/Web/HTML/Elemento/big" title="/es/docs/Web/HTML/Elemento/big">big</a>, <a href="/es/docs/Web/HTML/Elemento/i" title="/es/docs/Web/HTML/Elemento/i">i</a>, <a href="/es/docs/Web/HTML/Elemento/small" title="/es/docs/Web/HTML/Elemento/small">small</a>, <a href="/es/docs/Web/HTML/Elemento/tt" title="/es/docs/Web/HTML/Elemento/tt">tt</a></li>
- <li><a href="/es/docs/Web/HTML/Elemento/abbr" title="/es/docs/Web/HTML/Elemento/abbr">abbr</a>, <a href="/es/docs/Web/HTML/Elemento/acronym" title="/es/docs/Web/HTML/Elemento/acronym">acronym</a>, <a href="/es/docs/Web/HTML/Elemento/cite" title="/es/docs/Web/HTML/Elemento/cite">cite</a>, <a href="/es/docs/Web/HTML/Elemento/code" title="/es/docs/Web/HTML/Elemento/code">code</a>, <a href="/es/docs/Web/HTML/Elemento/dfn" title="/es/docs/Web/HTML/Elemento/dfn">dfn</a>, <a href="/es/docs/Web/HTML/Elemento/em" title="/es/docs/Web/HTML/Elemento/em">em</a>, <a href="/es/docs/Web/HTML/Elemento/kbd" title="/es/docs/Web/HTML/Elemento/kbd">kbd</a>, <a href="/es/docs/Web/HTML/Elemento/strong" title="/es/docs/Web/HTML/Elemento/strong">strong</a>, <a href="/es/docs/Web/HTML/Elemento/samp" title="/es/docs/Web/HTML/Elemento/samp">samp</a>, <a href="/es/docs/Web/HTML/Elemento/time" title="/es/docs/Web/HTML/Elemento/time">time</a>, <a href="/es/docs/Web/HTML/Elemento/var" title="/es/docs/Web/HTML/Elemento/var">var</a></li>
- <li><a href="/es/docs/Web/HTML/Elemento/a" title="/es/docs/Web/HTML/Elemento/a">a</a>, <a href="/es/docs/Web/HTML/Elemento/bdo" title="/es/docs/Web/HTML/Elemento/bdo">bdo</a>, <a href="/es/docs/Web/HTML/Elemento/br" title="/es/docs/Web/HTML/Elemento/br">br</a>, <a href="/es/docs/Web/HTML/Elemento/Img" title="/es/docs/Web/HTML/Elemento/Img">img</a>, <a href="/es/docs/Web/HTML/Elemento/map" title="/es/docs/Web/HTML/Elemento/map">map</a>, <a href="/es/docs/Web/HTML/Elemento/object" title="/es/docs/Web/HTML/Elemento/object">object</a>, <a href="/es/docs/Web/HTML/Elemento/q" title="/es/docs/Web/HTML/Elemento/q">q</a>, <a href="/es/docs/Web/HTML/Elemento/Script" title="/es/docs/Web/HTML/Elemento/Script">script</a>, <a href="/es/docs/Web/HTML/Elemento/span" title="/es/docs/Web/HTML/Elemento/span">span</a>, <a href="/es/docs/Web/HTML/Elemento/sub" title="/es/docs/Web/HTML/Elemento/sub">sub</a>, <a href="/es/docs/Web/HTML/Elemento/sup" title="/es/docs/Web/HTML/Elemento/sup">sup</a></li>
- <li><a href="/es/docs/Web/HTML/Elemento/button" title="/es/docs/Web/HTML/Elemento/button">button</a>, <a href="/es/docs/Web/HTML/Elemento/Input" title="/es/docs/Web/HTML/Elemento/Input">input</a>, <a href="/es/docs/Web/HTML/Elemento/label" title="/es/docs/Web/HTML/Elemento/label">label</a>, <a href="/es/docs/Web/HTML/Elemento/select" title="/es/docs/Web/HTML/Elemento/select">select</a>, <a href="/es/docs/Web/HTML/Elemento/textarea" title="/es/docs/Web/HTML/Elemento/textarea">textarea</a></li>
-</ul>
-
-<h3 id="Ver_también" name="Ver_también">Ver también</h3>
-
-<ul>
- <li><a href="/es/docs/Web/HTML/Block-level_elements" title="/es/docs/Web/HTML/Block-level_elements">Elementos en bloque</a></li>
-</ul>
diff --git a/files/es/web/html/formatos_admitidos_de_audio_y_video_en_html5/index.html b/files/es/web/html/formatos_admitidos_de_audio_y_video_en_html5/index.html
deleted file mode 100644
index f342f64d11..0000000000
--- a/files/es/web/html/formatos_admitidos_de_audio_y_video_en_html5/index.html
+++ /dev/null
@@ -1,281 +0,0 @@
----
-title: Formatos de medios admitidos por los elementos HTML audio y video
-slug: Web/HTML/Formatos_admitidos_de_audio_y_video_en_html5
-translation_of: Web/Media/Formats
-translation_of_original: Web/HTML/Supported_media_formats
----
-<p>Las etiquetas {{ HTMLElement("audio") }} y {{ HTMLElement("video") }} <span id="result_box" lang="es"><span class="hps">proporcionan apoyo</span> <span class="hps">para la reproducción de</span> <span class="hps">audio</span> <span class="hps">y video</span> <span class="hps">sin necesidad de</span> <span class="atn hps">plug-</span><span>ins.</span> <span class="hps">Codecs</span> <span class="hps">de vídeo</span> <span class="hps">y codecs</span> <span class="hps">de audio</span> <span class="hps">se utilizan para manejar</span> <span class="hps">vídeo y</span> <span class="hps">audio,</span> <span class="hps">y los diferentes</span> <span class="hps">codecs</span> <span class="hps">ofrecen diferentes</span> <span class="hps">niveles de compresión</span> <span class="hps">y calidad.</span> <span class="hps">Un</span> <span class="hps">formato de contenedor</span> <span class="hps">se utiliza para</span> <span class="hps">almacenar y transmitir</span> <span class="hps">el vídeo</span> <span class="hps">y el audio</span> <span class="hps">codificado</span> <span class="hps">juntos.</span> <span class="hps">Muchos</span> <span class="hps">codecs</span> <span class="hps">y formatos</span> <span class="hps">de contenedor</span> <span class="hps">existe</span><span>,</span> <span class="hps">e incluso hay</span> <span class="hps">más combinaciones de</span> <span class="hps">ellos.</span> <span class="hps">Para su uso</span> <span class="hps">en la web,</span> <span class="hps">sólo un puñado de</span> <span class="hps">combinaciones</span> <span class="hps">son relevantes.</span></span></p>
-
-<p>Diferentes navegadores no soportan los mismos formatos para audio y video en HTML5, principalmente debido a problemas de patentes. El área de formatos de medios en la web ha sufrido mucho por la ley de patentes en muchos paises, incluyendo EE.UU y la UE (La memoria de las patentes en este articulo se proporciona tal cual y sin ningun tipo de garantia.)</p>
-
-<p><span id="result_box" lang="es"><span class="hps">Para hacer</span> <span class="hps">un vídeo de</span> <span class="hps">HTML5</span><span>, que</span> <span class="hps">trabaja en</span> <span class="hps">las nuevas versiones de</span> <span class="hps">los principales navegadores</span><span>, puede</span> <span class="hps">usar el elemento {{HTMLElement("source")}} para reproducir</span> <span class="hps">en formatos WebM</span> o el formato <span class="hps">AAC</span> <span class="hps">MPEG</span> <span class="hps">H.264,</span> <span class="hps">usando el</span> <span class="hps">elemento de origen</span> <span class="hps">de esta manera:</span></span></p>
-
-<pre class="brush: html">&lt;video controls&gt;
-  &lt;source src="somevideo.webm" type="video/webm"&gt;
-  &lt;source src="somevideo.mp4" type="video/mp4"&gt;
-  I'm sorry; your browser doesn't support HTML5 video.
-  &lt;!-- You can embed a Flash player here, to play your mp4 video in older browsers --&gt;
-&lt;/video&gt;
-</pre>
-
-<h3 id="WebM">WebM</h3>
-
-<p><span id="result_box" lang="es"><span class="hps">El formato</span> <a href="http://www.webmproject.org/" title="http://www.webmproject.org/"><span class="hps">WebM</span></a> <span class="hps">se basa en</span> <span class="hps">una versión restringida</span> <span class="hps">del</span> <span class="hps">formato contenedor</span> <span class="hps">Matroska</span><span>.</span> <span class="hps">Siempre</span> <span class="hps">utiliza</span> <span class="hps">el códec de vídeo</span> <span class="hps">VP8</span> <span class="hps">y</span> <span class="hps">el códec de audio</span> <span class="hps">Vorbis</span><span>.</span> <span class="hps">WebM</span> <span class="hps">es</span> <span class="hps">soportado nativamente</span> <span class="hps">en</span> <span class="hps">Gecko</span> <span class="atn hps">(</span><span>Firefox)</span><span>, Chrome</span> <span class="hps">y</span> <span class="hps">Opera,</span> <span class="hps">y el</span> <span class="hps">soporte para el formato</span> <span class="hps">se puede agregar a</span> <span class="hps">Internet</span> <span class="hps">Explorer y</span> <span class="hps">Safari</span> <span class="hps">mediante la instalación de</span> <span class="hps">un add</span><span>-on</span><span>.</span></span></p>
-
-<p><a href="http://blogs.msdn.com/b/ie/archive/2011/02/02/html5-and-web-video-questions-for-the-industry-from-the-community.aspx" title="http://blogs.msdn.com/b/ie/archive/2011/02/02/html5-and-web-video-questions-for-the-industry-from-the-community.aspx"><span id="result_box" lang="es"><span class="hps">Declaración</span> <span class="hps">de</span> <span class="hps">Microsoft</span> <span class="hps">sobre por qué</span> <span class="hps">IE9</span> <span class="hps">no tiene soporte</span> <span class="hps">WebM</span> <span class="hps">nativo.</span></span></a></p>
-
-<p><span id="result_box" lang="es"><span class="hps">El formato</span> <span class="hps">WebM</span><span>,</span> <span class="hps">específicamente</span> <span class="hps">el códec de vídeo</span> <span class="hps">VP8</span><span>,</span> <span class="alt-edited hps">habría</span> sido <span class="alt-edited hps">acusado</span> <span class="hps">de</span> <span class="hps">infracción de derechos de</span> <span class="hps">patente</span> <span class="hps">por un grupo de</span> <span class="hps">empresas de</span> <span class="hps">responder a una llamada</span> <span class="hps">por la</span> <span class="hps">MPEG</span> <span class="hps">LA</span> <span class="hps">para la formación de</span> <span class="hps">un consorcio de patentes</span><span>, pero</span> <a href="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8" title="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8"><span class="hps">MPEG</span> <span class="hps">LA</span> <span class="hps">se ha comprometido a</span> <span class="hps">licenciar</span> <span class="hps">las patentes</span> <span class="hps">de</span> <span class="hps">Google</span></a> <span class="hps">bajo</span> <span class="atn hps">"</span><a href="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8" title="http://www.businesswire.com/news/home/20130307006192/en/Google-MPEG-LA-Announce-Agreement-Covering-VP8"><span class="hps">transferible y de licencia gratuita</span></a><span class="atn hps">"</span><span>.</span> <span class="hps">Esto significa,</span> <span class="hps">efectivamente</span><span>,</span> <span class="hps">que todas las patentes</span> <span class="hps">conocidas en</span> <span class="hps">el formato</span> <span class="hps">WebM</span> <span class="hps">tienen licencia</span> <span class="hps">para todo el mundo</span> <span class="hps">de forma gratuita.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Gecko</span> <span class="hps">reconoce los siguientes</span> <span class="hps">tipos MIME</span> <span class="hps">para los archivos WebM:</span></span></p>
-
-<dl>
- <dt><code>video/webm</code></dt>
- <dd>Un archivo WebM que es capaz de reproducir video (y es posible audio también)</dd>
- <dt><code>audio/webm</code></dt>
- <dd>Un archivo WebM que contiene audio unicamente.</dd>
-</dl>
-
-<h3 id="Ogg_Theora_Vorbis">Ogg Theora Vorbis</h3>
-
-<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps">formato contenedor</span> <span class="hps">Ogg</span> <span class="hps">con</span> <span class="hps">el códec de vídeo</span> <span class="hps">Theora</span> <span class="hps">y</span> <span class="hps">el códec de audio</span> <span class="hps">Vorbis</span> <span class="hps">es compatible con</span> <span class="hps">Gecko</span> <span class="atn hps">(</span><span>Firefox)</span><span>, Chrome</span> <span class="hps">y</span> <span class="hps">Opera,</span> <span class="hps">y el</span> <span class="hps">soporte para el formato</span> <span class="hps">se puede agregar a</span> <span class="hps">Safari</span> <span class="hps">mediante la instalación de</span> <span class="hps">un add</span><span>-on</span><span>.</span> <span class="hps">El formato no</span> <span class="hps">es compatible en Internet</span> <span class="hps">Explorer.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">WebM</span> <span class="alt-edited hps">es preferente</span>, <span class="hps">generalmente sobre</span> <span class="hps">Theora</span> <span class="hps">Ogg</span> <span class="hps">Vorbis</span> <span class="hps">cuando esté disponible</span></span><span id="result_box" lang="es"><span>,</span> <span class="hps">ya que proporciona</span> <span class="hps">una mejor</span> <span class="hps">relación de</span> <span class="hps">compresión para</span> <span class="hps">la calidad</span> <span class="hps">y</span> <span class="hps">se apoya</span> <span class="hps">en</span> <span class="hps">más navegadores</span><span>.</span> <span class="hps">El formato</span> <span class="hps">Ogg</span> <span class="hps">sin embargo, puede</span> <span class="hps">ser utilizado para apoyar</span> <span class="hps">versiones de los navegadores</span> <span class="hps">más antiguos</span><span>, en los que</span> <span class="hps">aún no</span> <span class="hps">se dispone de</span> <span class="hps">soporte para</span> <span class="hps">WebM</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">La</span> <span class="hps">situación de las patentes</span> <span class="hps">de</span> <span class="hps">Theora</span> <span class="hps">es</span> <span class="hps">similar a la de</span> <span class="hps">WebM</span><span>.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Usted puede aprender</span> <span class="hps">más sobre la creación</span> <span class="hps">de medios</span> <span class="hps">Ogg</span> <span class="hps">leyendo </span></span><a class="external" href="http://en.flossmanuals.net/ogg-theora/" title="http://en.flossmanuals.net/ogg-theora/">the Theora Cookbook</a>.</p>
-
-<p>Gecko reconoce los siguientes tipos de MIME para el archivo Ogg:</p>
-
-<dl>
- <dt><code>audio/ogg</code></dt>
- <dd><span class="short_text" id="result_box" lang="es"><span class="hps">Un archivo</span> <span class="hps">Ogg</span> <span class="hps">que contiene sólo</span> <span class="hps">audio.</span></span></dd>
- <dt><code>video/ogg</code></dt>
- <dd><span id="result_box" lang="es"><span class="hps">Un video</span> <span class="hps">que contiene</span> <span class="hps">el archivo</span> <span class="hps">ogg</span> <span class="hps">(y posiblemente </span><span class="hps">audio también)</span><span>.</span></span></dd>
- <dt><code>application/ogg</code></dt>
- <dd><span id="result_box" lang="es"><span class="hps">Un archivo</span> <span class="hps">Ogg</span> <span class="hps">con el contenido</span> <span class="hps">especificado.</span> <span class="hps">Utilizando uno de</span> <span class="hps">los otros dos tipos</span> <span class="hps">MIME</span> <span class="hps">es</span> <span class="hps">preferido</span><span>,</span> <span class="hps">pero se puede usar</span> <span class="hps">esta opción si</span> <span class="hps">usted no sabe</span> <span class="hps">lo que</span> <span class="hps">el contenido</span> <span class="hps">del fichero es</span></span>.</dd>
-</dl>
-
-<h3 id="Ogg_Opus">Ogg Opus</h3>
-
-<p><span id="result_box" lang="es"><span class="hps">El contenedor</span> <span class="hps">Ogg</span> <span class="hps">también puede contener</span> <span class="hps">audio codificado</span> <span class="hps">con el <a href="http://www.opus-codec.org/" title="http://www.opus-codec.org/">códec</a></span><a href="http://www.opus-codec.org/" title="http://www.opus-codec.org/"> <span class="hps">Opus</span><span>.</span></a> <span class="hps">El apoyo a esta</span> <span class="hps">disponible en</span></span> Gecko 15.0 {{ geckoRelease("15.0") }} y superior.</p>
-
-<h3 id="MP4_H.264_(AAC_o_MP3)">MP4 H.264 (AAC o MP3)</h3>
-
-<p><span id="result_box" lang="es"><span class="hps">El</span> <span class="hps">formato contenedor</span> <span class="hps">MP4</span> <span class="hps">con</span> <span class="hps">el códec de vídeo</span> <span class="hps">H.264</span> <span class="hps">y, o bien</span> <span class="hps">el códec de audio</span> <span class="hps">AAC</span> <span class="hps">o</span> <span class="hps">el códec de audio</span> <span class="hps">MP3</span> <span class="alt-edited hps">es</span> <span class="alt-edited hps">nativamente</span> <span class="hps">compatible con</span> <span class="hps">Internet</span> <span class="hps">Explorer,</span> <span class="hps">Safari</span> <span class="hps">y</span> <span class="hps">Chrome,</span> pero <span class="hps">Chromium y</span> <span class="hps">Opera</span> <span class="hps">no son compatibles con</span> <span class="hps">el formato</span><span>.</span> <span class="hps">Firefox</span> <span class="hps">pronto</span> <span class="hps">admite el formato</span><span>, pero sólo cuando</span> <span class="hps">un decodificador</span> <span class="hps">de terceros</span> <span class="hps">esté disponible.</span></span></p>
-
-<p><span id="result_box" lang="es"><span class="hps">Los</span> <span class="hps">formatos</span> <span class="hps">MPEG</span> <span class="hps">están cubiertos por</span> <span class="hps">patentes, que</span> <span class="hps">no tienen licencia</span> <span class="hps">libre</span><span>.</span> <span class="hps">Todas</span> <span class="hps">las licencias necesarias</span> <span class="hps">se pueden comprar de</span> <span class="hps">MPEG</span> <span class="hps">LA.</span> <span class="hps">Desde</span> <span class="hps">H.264</span> <span class="hps">no está en</span> <span class="hps">un formato</span> <span class="hps">libre de</span> <span class="hps">regalías,</span> <span class="hps">no es apto</span> <span class="hps">para la plataforma</span> <span class="hps">web de código abierto</span><span>, de acuerdo con</span> <span class="hps">Mozilla</span> <span class="atn hps">[</span><a href="http://shaver.off.net/diary/2010/01/23/html5-video-and-codecs/" title="http://shaver.off.net/diary/2010/01/23/html5-video-and-codecs/"><span>1</span></a><span>,</span> <a href="http://robert.ocallahan.org/2010/01/video-freedom-and-mozilla_23.html" title="http://robert.ocallahan.org/2010/01/video-freedom-and-mozilla_23.html"><span class="hps">2</span></a><span>]</span><span>,</span> <span class="hps">Google</span> <span class="atn hps">[</span><a href="http://blog.chromium.org/2011/01/html-video-codec-support-in-chrome.html" title="http://blog.chromium.org/2011/01/html-video-codec-support-in-chrome.html"><span>1</span></a><span>,</span> <a href="http://blog.chromium.org/2011/01/more-about-chrome-html-video-codec.html" title="http://blog.chromium.org/2011/01/more-about-chrome-html-video-codec.html"><span class="hps">2</span></a><span>]</span> <span class="hps">y Opera.</span> <span class="hps">Sin embargo, los</span> <span class="hps">formatos libres</span> <span class="hps">no son compatibles con</span> <span class="hps">Internet</span> <span class="hps">Explorer y</span> <span class="hps">Safari</span><span>, <a href="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/" title="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/">Mozilla</a></span><a href="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/" title="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/"> <span class="hps">ha decidido apoyar</span> <span class="hps">el formato de</span> </a><span class="hps"><a href="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/" title="https://hacks.mozilla.org/2012/03/video-mobile-and-the-open-web/">todos modos</a>, y</span> <span class="hps">Google</span> <span class="hps">no</span> <span class="hps">cumplió</span> <span class="hps">su promesa de</span> <span class="hps">eliminar el soporte</span> <span class="hps">para él en</span> <span class="hps">Chrome.</span></span></p>
-
-<h3 id="WAVE_PCM">WAVE PCM</h3>
-
-<p>El formato contenedor WAVE, con el códec de audio PCM (WAVE codec "1") con el apoyo de Gecko (Firefox), y Safari. Archivos en el formato contenedor WAVE normalmente terminan con la extensión ". wav".</p>
-
-<div class="note"><strong>Nota: </strong><span class="short_text" id="result_box" lang="es"><span class="hps">Consulte</span> <a href="http://www.rfc-editor.org/rfc/rfc2361.txt" title="http://www.rfc-editor.org/rfc/rfc2361.txt"><span class="hps">RFC</span> <span class="hps">2361</span></a> <span class="hps">para</span> <span class="hps">el registro</span> <span class="hps">códec</span> <span class="hps">WAVE</span><span>.</span></span></div>
-
-<p><span id="result_box" lang="es"><span class="hps">Gecko</span> <span class="hps">reconoce los siguientes</span> <span class="hps">tipos MIME</span> <span class="alt-edited hps">en archivos de audio</span> <span class="hps">WAVE</span><span>:</span></span></p>
-
-<ul>
- <li><code>audio/wave</code> (preferido)</li>
- <li><code>audio/wav</code></li>
- <li><code>audio/x-wav</code></li>
- <li><code>audio/x-pn-wav</code></li>
-</ul>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>3.0</td>
-   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
-   <td>9.0</td>
-   <td>10.50</td>
-   <td>3.1</td>
-  </tr>
-  <tr>
-   <td><code>&lt;audio&gt;</code>: WAVE, PCM</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>3.1</td>
-  </tr>
-  <tr>
-   <td><code>&lt;audio&gt;</code>: WebM, Vorbis</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("2.0") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>10.60</td>
-   <td>3.1 (must be installed separately)</td>
-  </tr>
-  <tr>
-   <td><code>&lt;audio&gt;</code>: Ogg, Vorbis</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>10.50</td>
-   <td>3.1 (must be installed separately, e.g. <a class="external" href="http://www.xiph.org/quicktime/" title="http://www.xiph.org/quicktime/">XiphQT</a>)</td>
-  </tr>
-  <tr>
-   <td><code>&lt;audio&gt;</code>: MP4, MP3</td>
-   <td>
-    <p>{{ CompatVersionUnknown() }} (Not in Chromium)</p>
-   </td>
-   <td>
-    <p>Partial (see below)</p>
-   </td>
-   <td>9.0</td>
-   <td>{{ CompatNo() }}</td>
-   <td>3.1</td>
-  </tr>
-  <tr>
-   <td><code>&lt;audio&gt;</code>: MP4, AAC</td>
-   <td>
-    <p>{{ CompatVersionUnknown() }} (Main only) (Not in Chromium)</p>
-   </td>
-   <td>
-    <p>Partial (see below)</p>
-   </td>
-   <td>9.0</td>
-   <td>{{ CompatNo() }}</td>
-   <td>3.1</td>
-  </tr>
-  <tr>
-   <td><code>&lt;audio&gt;</code>: Ogg, Opus</td>
-   <td>27.0</td>
-   <td>{{ CompatGeckoDesktop("15.0") }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
-  <tr>
-   <td><code>&lt;video&gt;</code>: WebM, VP8, Vorbis</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("2.0") }}</td>
-   <td>9.0 (<a class="external" href="http://blogs.msdn.com/b/ie/archive/2011/03/16/html5-video-update-webm-for-ie9.aspx" title="http://blogs.msdn.com/b/ie/archive/2011/03/16/html5-video-update-webm-for-ie9.aspx">must be installed separately</a>, e.g. <a class="external" href="http://tools.google.com/dlpage/webmmf/" title="http://tools.google.com/dlpage/webmmf/">WebM MF</a>)</td>
-   <td>10.60</td>
-   <td>3.1 (must be installed separately, e.g. <a class="external" href="http://perian.org/" title="http://perian.org/">Perian</a>)</td>
-  </tr>
-  <tr>
-   <td><code>&lt;video&gt;</code>: Ogg, Theora, Vorbis</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>10.50</td>
-   <td>3.1 (must be installed separately, e.g. <a class="external" href="http://www.xiph.org/quicktime/" title="http://www.xiph.org/quicktime/">XiphQT</a>)</td>
-  </tr>
-  <tr>
-   <td><code>&lt;video&gt;</code>: MP4, H.264, MP3</td>
-   <td>
-    <p>{{ CompatVersionUnknown() }} (Not in Chromium)</p>
-   </td>
-   <td>Partial (see below)</td>
-   <td>9.0</td>
-   <td>{{ CompatNo() }}</td>
-   <td>3.1</td>
-  </tr>
-  <tr>
-   <td><code>&lt;video&gt;</code>: MP4, H.264, AAC</td>
-   <td>
-    <p>{{ CompatVersionUnknown() }} (Not in Chromium)</p>
-   </td>
-   <td>Partial (see below)</td>
-   <td>9.0</td>
-   <td>{{ CompatNo() }}</td>
-   <td>3.1</td>
-  </tr>
-  <tr>
-   <td>any other format</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>3.1 (plays all formats available via QuickTime)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p><span id="result_box" lang="es"><span class="hps">Para evitar</span> <span class="hps">problemas de patentes</span><span>, el apoyo a</span> <span class="hps">MPEG</span> <span class="hps">4</span><span>, H.264</span><span>, MP3</span> <span class="hps">y</span> <span class="hps">AAC</span> <span class="hps">no</span> <span class="hps">está integrado directamente en</span> <span class="hps">Firefox.</span> <span class="hps">En su lugar,</span> <span class="hps">se basa en</span> <span class="hps">el apoyo del</span> <span class="hps">sistema operativo o</span> <span class="hps">hardware.</span> <span class="hps">Firefox</span> <span class="hps">soporta</span> <span class="hps">estos formatos</span> <span class="hps">en las siguientes plataformas</span><span>:</span></span></p>
-
-<table class="standard-table" style="height: 159px; width: 285px;">
- <thead>
-  <tr>
-   <th scope="col">Plataforma</th>
-   <th scope="col">Versión de Firefox</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=799315" title="https://bugzilla.mozilla.org/show_bug.cgi?id=799315">Windows 7+</a></td>
-   <td>21.0</td>
-  </tr>
-  <tr>
-   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=825153" title="https://bugzilla.mozilla.org/show_bug.cgi?id=825153">Windows Vista</a></td>
-   <td>22.0</td>
-  </tr>
-  <tr>
-   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=748351" title="https://bugzilla.mozilla.org/show_bug.cgi?id=748351">Android</a></td>
-   <td>20.0</td>
-  </tr>
-  <tr>
-   <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=714408" title="https://bugzilla.mozilla.org/show_bug.cgi?id=714408">Firefox OS</a></td>
-   <td>15.0</td>
-  </tr>
-  <tr>
-   <td>OS X 10.7</td>
-   <td>22.0</td>
-  </tr>
- </tbody>
-</table>
-
-<ul>
- <li><a class="external" href="http://dev.opera.com/articles/view/introduction-html5-video/#codecs" title="http://dev.opera.com/articles/view/introduction-html5-video/#codecs">Video codecs in Opera</a></li>
- <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff975073%28v=VS.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ff975073%28v=VS.85%29.aspx">Video codecs in Internet Explorer</a></li>
- <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff975061%28v=vs.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ff975061%28v=vs.85%29.aspx">Audio codecs in Internet Explorer</a></li>
- <li><a href="http://www.chromium.org/audio-video" title="http://www.chromium.org/audio-video">Audio &amp; Video codecs in Chrome</a></li>
-</ul>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a class="internal" href="/en/Using_HTML5_audio_and_video" title="En/Using audio and video in Firefox">Using audio and video in Firefox</a></li>
- <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#media-elements" title="http://www.whatwg.org/specs/web-apps/current-work/#media-elements">Media elements</a> (HTML 5 specification)</li>
- <li><code><a class="internal" href="/en/HTML/Element/Video" title="En/HTML/Element/Video">video</a></code></li>
- <li><a class="internal" href="/en/HTML/Element/Audio" title="En/HTML/Element/Audio"><code>audio</code></a></li>
-</ul>
diff --git a/files/es/web/html/global_attributes/accesskey/index.html b/files/es/web/html/global_attributes/accesskey/index.html
new file mode 100644
index 0000000000..c29c147b45
--- /dev/null
+++ b/files/es/web/html/global_attributes/accesskey/index.html
@@ -0,0 +1,144 @@
+---
+title: accesskey
+slug: Web/HTML/Global_attributes/accesskey
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/accesskey
+original_slug: Web/HTML/Atributos_Globales/accesskey
+---
+<p>{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a> <strong>accesskey</strong> provee un indicio para generar un atajo de teclado para el elemento actual . Este atributo consiste en una lista de caracteres separada por espacios (un único punto de código Unicode). El explorador usa el primero que existe en la distribución del teclado de la computadora .</p>
+
+<p>La operación para activar el accesskey depende del explorador y su plataforma .</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th> </th>
+   <th>Windows</th>
+   <th>Linux</th>
+   <th>Mac</th>
+  </tr>
+  <tr>
+   <th>Firefox</th>
+   <td colspan="2" rowspan="1"><kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd><em>tecla</em></kbd></td>
+   <td>En Firefox 14 o posteriores, <kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd><br>
+    En Firefox 13 o anteriores, <kbd>Control</kbd> + <kbd><em>tecla</em></kbd></td>
+  </tr>
+  <tr>
+   <th>Internet Explorer</th>
+   <td><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
+   <td colspan="2" rowspan="1">N/A</td>
+  </tr>
+  <tr>
+   <th>Google Chrome</th>
+   <td colspan="2" rowspan="1" style="text-align: center;"><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
+   <td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
+  </tr>
+  <tr>
+   <th>Safari</th>
+   <td><kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
+   <td>N/A</td>
+   <td><kbd>Control</kbd> + <kbd>Alt</kbd> + <kbd><em>tecla</em></kbd></td>
+  </tr>
+  <tr>
+   <th>Opera</th>
+   <td colspan="3" rowspan="1"><kbd>Shift</kbd> + <kbd>Esc</kbd> abre una lista de contenidos , los cuales son accesibles a través de accesskey , después se puede elegir un item presionando  <kbd><em>tecla</em></kbd></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Notar que Firefox puede  personalizar la tecla de modificación requerida por  las preferencias del usuario .</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "interaction.html#the-accesskey-attribute", "accesskey")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el útlimo snapshot  {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot  de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "editing.html#the-accesskey-attribute", "accesskey")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de  {{SpecName('HTML WHATWG')}}. De {{SpecName('HTML4.01')}},  varios caracteres pueden se pueden establecer como el accesskey . Tambien puede establecerse sobre cualquier elemento.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', "interact/forms.html#h-17.11.2", "accesskey")}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Solo soportado en {{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("label") }}, {{ HTMLElement("legend") }} y {{ HTMLElement("textarea") }}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_exploradores">Compatibilidad con exploradores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/autocapitalize/index.html b/files/es/web/html/global_attributes/autocapitalize/index.html
new file mode 100644
index 0000000000..5b848e4048
--- /dev/null
+++ b/files/es/web/html/global_attributes/autocapitalize/index.html
@@ -0,0 +1,51 @@
+---
+title: autocapitalización
+slug: Web/HTML/Global_attributes/autocapitalize
+tags:
+  - Atributos globales
+  - HTML
+  - Reference
+  - Referencia
+  - autocapitalización
+translation_of: Web/HTML/Global_attributes/autocapitalize
+original_slug: Web/HTML/Atributos_Globales/autocapitalize
+---
+<p>{{HTMLSidebar("Global_attributes")}}</p>
+
+<p><span class="seoSummary">El {{web.link("/es/docs/Web/HTML/Global_attributes", "atributo global")}} {{HTMLAttrxRef("autocapitalize", "input")}} es un atributo enumerado que controla si la entrada de texto se escribe en mayúsculas automáticamente a medida que el usuario la introduce/edita.</span> El atributo debe tomar uno de los siguientes valores:</p>
+
+<ul>
+ <li><code>off</code> o <code>none</code>, no se aplica capitalización automática (todas las letras están predeterminadas en minúsculas)</li>
+ <li><code>on</code> o <code>sentences</code>, la primera letra de cada oración de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
+ <li><code>words</code>, la primera letra de cada palabra de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
+ <li><code>characters</code>, todas las letras de manera predeterminada deben estar en mayúsculas</li>
+</ul>
+
+<p>El atributo {{HTMLAttrDef("autocapitalize")}} no afecta el comportamiento al escribir en un teclado físico. En cambio, afecta el comportamiento de otros mecanismos de entrada, como teclados virtuales en dispositivos móviles y entrada de voz. El comportamiento de tales mecanismos es que a menudo ayudan a los usuarios escribiendo en mayúscula automáticamente la primera letra de las oraciones. El atributo {{HTMLAttrDef("autocapitalize")}} permite a los autores redefinir ese comportamiento por elemento.</p>
+
+<p>El atributo {{HTMLAttrDef("autocapitalize")}} nunca hace que se habilite la autocapitalización para un elemento {{HTMLElement("input")}} con un atributo {{HTMLAttrxRef("type", "input")}} cuyo valor es {{HTMLAttrDef("url")}}, {{HTMLAttrDef("email")}} o {{HTMLAttrDef("password")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', "interaction.html#autocapitalization", "autocapitalize")}}</td>
+   <td>{{ Spec2('HTML WHATWG') }}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.global_attributes.autocapitalize")}}</p>
diff --git a/files/es/web/html/global_attributes/class/index.html b/files/es/web/html/global_attributes/class/index.html
new file mode 100644
index 0000000000..9ba36baf8b
--- /dev/null
+++ b/files/es/web/html/global_attributes/class/index.html
@@ -0,0 +1,106 @@
+---
+title: class
+slug: Web/HTML/Global_attributes/class
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/class
+original_slug: Web/HTML/Atributos_Globales/class
+---
+<p>{{HTMLSidebar("Global_attributes")}}<br>
+ El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>class</strong> es una lista de las clases del elemento separada por espacios . Las clases permiten a CSS y Javascript seleccionar y acceder a elementos específicos a través de los <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors">selectores de clase</a> o funciones como el método {{domxref("document.getElementsByClassName")}} del DOM.</p>
+
+<p>Aunque la especificación no define los requerimientos para el nombre de las clases , se alienta a los desarrolladores web a usar nombres que describan el propósito semántico del elemento, en lugar de la presentación del elemento (e.g., <em>atributo </em>para describir un atributo en lugar de <em>itálica, </em>aunque un elemento de esta clase puesde ser presentado por <em>itálica</em>). Los nombres semanticos permanecen lógicos incluso si la presentación de la página cambia .</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "elements.html#classes", "class")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "elements.html#classes", "class")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "elements.html#classes", "class")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName('HTML4.01')}}, <code>class</code> es ahora un verdadero atributo global .</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', "struct/global.html#h-7.5.2", "class")}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Soportado en todos los elementos pero {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }} [1]</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitca</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }} [1]</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] <strong>class</strong> es un atributo global verdadero solo desde Firefox 32.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/contenteditable/index.html b/files/es/web/html/global_attributes/contenteditable/index.html
new file mode 100644
index 0000000000..165a93e742
--- /dev/null
+++ b/files/es/web/html/global_attributes/contenteditable/index.html
@@ -0,0 +1,108 @@
+---
+title: contenteditable
+slug: Web/HTML/Global_attributes/contenteditable
+tags:
+  - Atributos globales
+  - HTM
+  - Referencia
+translation_of: Web/HTML/Global_attributes/contenteditable
+original_slug: Web/HTML/Atributos_Globales/contenteditable
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a>  <strong>contenteditable</strong> es un atributo enumerado que indica si el elemento debe de ser editable por el usuario . Si es así, el explorador modifca su widget para permitir la edición . El atributo debe de tener alguno de los siguientes valores :</p>
+
+<ul>
+ <li><span><code>true</code> </span> o una string vacia , que indica que el elemento debe de ser editable .</li>
+ <li><span><code>false</code> </span> , que indica que el elemento no debe ser editable.</li>
+</ul>
+
+<p>Si este atributo no se establece , el valor de default es <em>heredado  </em>de su elemento padre .</p>
+
+<p>Este es un atributo enumerado y no uno <em>booleano .</em> Esto significa que el uso explicito de uno de los valores <code>true , false </code>o la cadena vacía es obligatorio y que una código como <code>&lt;label contenteditable&gt;Example Label&lt;/label&gt;</code> no esta permitido . El uso correcto es <code>&lt;label contenteditable="true"&gt;Example Label&lt;/label&gt;</code>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "editing.html#attr-contenteditable", "contenteditable")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#attr-contenteditable", "contenteditable")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de  {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "editing.html#attr-contenteditable", "contenteditable")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatiblidad_en_exploradores">Compatiblidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.9") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("1.9") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
+ <li>{{domxref("HTMLElement.contentEditable")}} and {{domxref("HTMLElement.isContentEditable")}}</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/contextmenu/index.html b/files/es/web/html/global_attributes/contextmenu/index.html
new file mode 100644
index 0000000000..f234d1a734
--- /dev/null
+++ b/files/es/web/html/global_attributes/contextmenu/index.html
@@ -0,0 +1,140 @@
+---
+title: contextmenu
+slug: Web/HTML/Global_attributes/contextmenu
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/contextmenu
+original_slug: Web/HTML/Atributos_Globales/contextmenu
+---
+<p>{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a>  <strong>contextmenu </strong>es el  <a href="/es/docs/Web/HTML/Atributos_Globales/id"><strong>id</strong></a> de un  {{HTMLElement("menu")}} para nosotros como el menu contextual para este elemento .</p>
+
+<p>Un <em>menu contextual  </em>es un menu que aparece sobre la interacción del usuario , como por ejemplo un click derecho . HTML5 ahora permite modificar este menú . Aquí hay unos ejemplos de implementación , incluyendo menús anidados .</p>
+
+<div id="ContextMenu_Example">
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p> </p>
+
+<pre class="brush:html; highlight:[1,10,15]">&lt;body contextmenu="share"&gt;
+  &lt;menu type="context" id="share"&gt;
+    &lt;menu label="share"&gt;
+      &lt;menuitem label="Twitter" onclick="window.open('https://twitter.com/intent/tweet?text=Hurra! Estos aprendiendo sobre ContextMenuI en MDN a través de Mozilla ');"&gt;&lt;/menuitem&gt;
+      &lt;menuitem label="Facebook" onclick="window.open('https://facebook.com/sharer/sharer.php?u=https://https://developer.mozilla.org/en/HTML/Element/Using_HTML_context_menus');"&gt;&lt;/menuitem&gt;
+    &lt;/menu&gt;
+  &lt;/menu&gt;
+  &lt;ol&gt;
+    &lt;li&gt;En cualquier parte del ejemplo puedes compartir la página en twitter y Facebook usando el menú de compartir de tu menú contextual.&lt;/li&gt;
+    &lt;li&gt;&lt;pre contextmenu="changeFont" id="fontSizing"&gt;En este elemento específico de la lista , puedes cambiar el tamaño del texto usando  las acciones "Incremenrar/Decrementar" de tu menú contextual ./pre&gt;&lt;/li&gt;
+    &lt;menu type="context" id="changeFont"&gt;
+      &lt;menuitem label="Increase Font" onclick="incFont()"&gt;&lt;/menuitem&gt;
+      &lt;menuitem label="Decrease Font" onclick="decFont()"&gt;&lt;/menuitem&gt;
+    &lt;/menu&gt;
+    &lt;li contextmenu="ChangeImage" id="changeImage"&gt;En la imagen de abajo , puedes accionar la accion "Cambio de Imagen " en tu menú contextual .&lt;/li&gt;&lt;br /&gt;
+    &lt;img src="https://developer.mozilla.org/media/img/promote/promobutton_mdn5.png" contextmenu="ChangeImage" id="promoButton" /&gt;
+    &lt;menu type="context" id="ChangeImage"&gt;
+      &lt;menuitem label="Change Image" onclick="changeImage()"&gt;&lt;/menuitem&gt;
+    &lt;/menu&gt;
+  &lt;/ol&gt;
+&lt;/body&gt;
+</pre>
+
+<p>en conjunto con este Javascript</p>
+
+<pre class="brush:js">function incFont(){
+  document.getElementById("fontSizing").style.fontSize="larger";
+}
+function decFont(){
+  document.getElementById("fontSizing").style.fontSize="smaller";
+}
+function changeImage(){
+  var j = Math.ceil((Math.random()*39)+1);
+  document.images[0].src="https://developer.mozilla.org/media/img/promote/promobutton_mdn" + j + ".png";
+}</pre>
+
+<p>resulta en :</p>
+
+<div>{{EmbedLiveSample("ContextMenu_Example",550,200)}}</div>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "forms.html#attr-contextmenu", "contextmenu")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "interactive-elements.html#context-menus", "contextmenu")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatGeckoDesktop(9) }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatGeckoDesktop(20) }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li> <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/data-_star_/index.html b/files/es/web/html/global_attributes/data-_star_/index.html
new file mode 100644
index 0000000000..8b0bfd9b2d
--- /dev/null
+++ b/files/es/web/html/global_attributes/data-_star_/index.html
@@ -0,0 +1,109 @@
+---
+title: data-*
+slug: Web/HTML/Global_attributes/data-*
+translation_of: Web/HTML/Global_attributes/data-*
+original_slug: Web/HTML/Atributos_Globales/data-*
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>Los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> <strong>data-* </strong>forman una clase de atributos , llamados atributos de datos modificables , permite a la información propietaria ser intercambiada entre el <a href="/es/docs/Web/HTML">HTML</a> y su representación en el <a href="/es/docs/Referencia_DOM_de_Gecko">DOM</a> que puede ser usada por scripts . Todos esos datos modificables están disponibles a través de la interface del elemento {{domxref("HTMLElement")}} , el atributo se establece encendido . La propiedad  {{domxref("HTMLElement.dataset")}} otorga acceso a ellos . </p>
+
+<p>El * puede ser remplazado por cualquier nombre siguiedo las<a href="http://www.w3.org/TR/REC-xml/#NT-Name"> reglas de producción de nombres xml</a> con las siguientes restricciones :</p>
+
+<ul>
+ <li>el nombre no debe de empezar con <code>xml</code> , cualquiera sea el caso usado para estas letras.</li>
+ <li>el nombre no debe de contener algún punto y coma (<code>U+003A</code>) .</li>
+ <li>el nombre no debe de contener letras mayúsculas de la A a la Z .</li>
+</ul>
+
+<p>Notar que la propiedad {{domxref("HTMLElement.dataset")}} es un {{domxref("StringMap")}} y que el nombre del atributo de datos modificable<em>data-test-value </em>será accesible a través de <code>HTMLElement.dataset.testValue </code>como cualquier guión  (<code>U+002D</code>) es reemplazado por la versión en mayúscula de la siguiente letra (camelcase) . </p>
+
+
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table" style="line-height: 1.5;">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes", "data-*")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de   {{SpecName('HTML WHATWG')}}, definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop(6) }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoMobile(6) }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"></h2>
+
+<h2 id="Ver_también">Ver también </h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li>
+ <li>La propiedad  {{domxref("HTMLElement.dataset")}} que permite el acceso y modifica estos valores .</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/dir/index.html b/files/es/web/html/global_attributes/dir/index.html
new file mode 100644
index 0000000000..11ff398dcc
--- /dev/null
+++ b/files/es/web/html/global_attributes/dir/index.html
@@ -0,0 +1,123 @@
+---
+title: dir
+slug: Web/HTML/Global_attributes/dir
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/dir
+original_slug: Web/HTML/Atributos_Globales/dir
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a>dir es un atributo enumerado que indica la direccionalidad del texto de los elementos . Puede tener los siguientes valores : </p>
+
+<ul>
+ <li><code>ltr ,</code> significa <em>izquierda</em> a <em>derecha</em> y es usado para los lenguajes que son escritos de izquierda a derecha ( como el Inglés ) .</li>
+ <li><code>rtl , </code>significa <em>derecha</em> a <em>izquierda</em> y es usado para los lenguajes que son escritos de la derecha a la izquierda (como el árabe ) .</li>
+ <li><code>auto , </code>permite al agente usuario decidir . Usa un algoritmo básico mientras parsea los caracteres dentro de un elemento hasta que encuentra un elemento con una direccionalidad fuerte , después aplica esa direccionalidad a todo el elemento .</li>
+</ul>
+
+<div class="note">
+<p><span style="font-size: 14px; line-height: 21px;"><strong>Notas de uso</strong></span></p>
+
+<p>Este atributo es obligatorio para el elemento  {{ HTMLElement("bdo") }} donde este tiene un significado semántico diferente.</p>
+
+<ul>
+ <li>Este atributo no es heredado por el elemento {{ HTMLElement("bdi") }} . Si no se establece , su valor es <code>auto</code> .</li>
+ <li>Este atributo puede ser anulado por las propiedades de CSS  {{ cssxref("direction") }} y {{ cssxref("unicode-bidi") }} , si una página CSS está activa y el elemento soporta estas propiedades.</li>
+ <li>Mientras la direccionalidad del texto esté semánticamente relacionada con su contenido y no con su presentación , se recomienda que los desarrolladores web usen este atributo en lugar de propiedades de CSS relacionadas ,  cuando sea posible . De esta forma , el texto se mostrará correctamente incluso en un explorador que no soporte CSS o que tenga CSS desactivado .</li>
+ <li>El valor <code>auto</code> debe de ser usada para datos con una direccionalidad desconocida , com datos procedentes de la entrada de usuario , eventualmente almacenados en una base de datos .</li>
+</ul>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#the-dir-attribute", "dir")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#the-dir-attribute", "dir")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de  {{SpecName('HTML WHATWG')}}, sin cambio desde  {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#the-dir-attribute", "dir")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, desde  {{SpecName('HTML4.01')}} añadió el valor auto y ahora es un verdadero atributo global .</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', "dirlang.html#h-8.2", "dir")}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Soportado en todos los elementos pero no en {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, y {{HTMLElement("script")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<h2 id="CompatibilityTable()"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{ CompatibilityTable() }}</span></h2>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a></li>
+ <li>{{domxref("HTMLElement.dir")}} que refleja este atributo .</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/draggable/index.html b/files/es/web/html/global_attributes/draggable/index.html
new file mode 100644
index 0000000000..3349f31cfe
--- /dev/null
+++ b/files/es/web/html/global_attributes/draggable/index.html
@@ -0,0 +1,109 @@
+---
+title: draggable
+slug: Web/HTML/Global_attributes/draggable
+tags:
+  - Atributos globales
+  - Experimental
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/draggable
+original_slug: Web/HTML/Atributos_Globales/draggable
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a>draggable es un atributo enumerado que indica si el elemento puede ser arrastrado , usando el {{domxref("HTML_Drag_and_Drop_API","HTML Drag and Drop API")}} . Puede tener los siguientes valores :</p>
+
+<ul>
+ <li><code>true</code> , indica que el elemento puede ser arrastrado.</li>
+ <li><code>false</code>, indica que el elemento no puede ser arrastrado .</li>
+</ul>
+
+<p>Si este atriuto no se establece , su valor por default es <code>auto</code> , significando que el comportamiento debe de ser el definido por default en el explorador .</p>
+
+<p>Este es un atributo <em>enumerado </em> y no uno <em>booleano</em> . Esto signigica que el uso explícito de uno de los valores <em>true </em>o <em>false </em>es obligatorio y que una declaración como <code>&lt;label draggable&gt;Example Label&lt;/label&gt; </code>no está permitida . El uso correcto es  <code>&lt;label draggable="true"&gt;Example Label&lt;/label&gt;</code>.</p>
+
+<p>Por default , unicamente el texto , las imagenes y los vínculos pueden ser arrastrados . Para todos los demás elementos el evento <strong>{{domxref('GlobalEventHandlers.ondragstart','ondragstart')}}</strong>  debe de ser establecido para el mecanismo de arrastrar y soltar para que funcione , como se muestra en este <a href="/en-US/docs/DragDrop/Drag_Operations" title="https://developer.mozilla.org/En/DragDrop/Drag_Operations">ejempl</a>o .</p>
+
+<p> </p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "interaction.html#the-draggable-attribute", "draggable")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#the-draggable-attribute", "draggable")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial .</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<h2 id="CompatibilityTable()"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{ CompatibilityTable() }}</span></h2>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("1.8.1") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<p><span style="font-size: 30.002px; letter-spacing: -1px; line-height: 30.002px;"><strong>Ver también</strong></span></p>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales </a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/hidden/index.html b/files/es/web/html/global_attributes/hidden/index.html
new file mode 100644
index 0000000000..47b05c63ed
--- /dev/null
+++ b/files/es/web/html/global_attributes/hidden/index.html
@@ -0,0 +1,108 @@
+---
+title: hidden
+slug: Web/HTML/Global_attributes/hidden
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/hidden
+original_slug: Web/HTML/Atributos_Globales/hidden
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales/">atributo global</a> <strong>hidden</strong> es un atributo Booleano que indica que el elemento todavía no está , o ya no es relevante . Por ejemplo , puede ser usado para ocultar elelementos de la página que no pueden ser usados hasta que el proceso de login se haya completado . El explorador no dibujará dichos elementos .</p>
+
+<p>Esta atributo no debe de usarse para ocultar contenido que pudera ser legítimamente mostrado . Por ejemplo , no debe de ser usado para ocultar paneles de pestañas o una interfaz con pestañas , ya que esta es una decisión de estilo y otro estilo mostrandolos lo llevaría a una página perfectamente mostrada .</p>
+
+<p>Los elementos ocultos no deben de ser vinculados desde elementos no ocultos y elementos que son descendientes de un elemento oculto todavía activo ;  lo que significa que los elementos del script pueden todavía ejecutarse y los elementos de formulario pueden todavía enviarse .</p>
+
+<div class="note">
+<p><strong>Nota:</strong>  Cambiando el valor de la propiedad CSS {{cssxref("display")}} de un elemento con el atributo <code>hidden</code>  sobrecarga el comportamiento . For ejemplo , un elemeneto diseñado <code>display : flex </code>será mostrado en la pantalla independientemente de que el atributo <code>hidden </code>esté presente .</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "interaction.html#the-hidden-attribute", "hidden")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "rendering.html#hiddenCSS", "Hidden elements")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>
+    <p>Define el dibujado por default sugerido del atributo hidden usando CSS</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#the-hidden-attribute", "hidden")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("2") }}</td>
+   <td>11</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("2") }}</td>
+   <td>11</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también </h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales/">atributos globales</a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/id/index.html b/files/es/web/html/global_attributes/id/index.html
new file mode 100644
index 0000000000..a7fef97fda
--- /dev/null
+++ b/files/es/web/html/global_attributes/id/index.html
@@ -0,0 +1,114 @@
+---
+title: id
+slug: Web/HTML/Global_attributes/id
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/id
+original_slug: Web/HTML/Atributos_Globales/id
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> <strong>id</strong> define un identificador único (ID) el cual no debe repetirse en todo el documento. Su propósito es identificar el elemento al vincularlo (usando un identificador de fragmento), en scripts u hojas de estilo (con CSS).</p>
+
+<p>El valor de este atributo es una cadena de caracteres opaca: es decir,  el autor del sitio no debe usarlo para proporcionar información. De forma particular, en sentido semántico por ejemplo, no debe ser derivado de la misma cadena.</p>
+
+<p>El valor de este atributo no debe contener espacios en blanco. Los navegadores tratan los IDs que contienen espacios en blanco como si los espacios fueran parte del ID. En contraste con el atributo <strong>class</strong>, el cual permite valores separados por espacios, los elementos pueden tener sólo un ID definido mediante el atributo ID. Tenga en cuenta que un elemento puede tener muchos ID, pero los demás deben ser definidos de otra forma, como por medio de un script interactuando con el DOM.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> El uso de caracteres a excepción de letras en ASCII, dígitos, '_', <code>'-'</code> y <code>'.'</code> pueden ocasionar problemas de compatibilidad, por no ser permitidos en HTML 4. A pesar de que esta limitación ha sido removida en HTML 5, un ID debe iniciar con una letra para asegurar la compatibilidad.</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#the-id-attribute", "id")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambios desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#the-id-attribute", "id")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambios de {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#the-id-attribute", "id")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, ahora acepta <code>'_'</code>, <code>'-'</code> and <code>'.'</code> si no se encuentra al principio del id. También es un atributo global verdadero.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/global.html#adef-id', 'id')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Soportado en todos los elementos a excepción de {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}[1]</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Atributo</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}[1]</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] <strong>class</strong> es un atributo global verdadero desde Firefox 32.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Todos los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</li>
+ <li>{{domxref("Element.id")}} que se asemeja a este atributo.</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/index.html b/files/es/web/html/global_attributes/index.html
new file mode 100644
index 0000000000..b39b2d4c33
--- /dev/null
+++ b/files/es/web/html/global_attributes/index.html
@@ -0,0 +1,200 @@
+---
+title: Atributos globales
+slug: Web/HTML/Global_attributes
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Global_attributes
+original_slug: Web/HTML/Atributos_Globales
+---
+<div>{{HTMLSidebar("Atributos_globales")}}</div>
+
+<p class="summary"><span class="seoSummary">Los <strong>atributos globales</strong> son atributos comunes a todos los elementos HTML; se pueden usar en todos los elementos, aunque es posible que no tengan ningún efecto en algunos elementos.</span></p>
+
+<p>Los atributos globales se pueden especificar en todos los {{web.link("/es/docs/Web/HTML/Element", "elementos HTML")}}, <em>incluso aquellos no especificados en el estándar</em>. Eso significa que cualquier elemento no estándar debe permitir estos atributos, aunque el uso de esos elementos significa que el documento ya no es compatible con HTML5. Por ejemplo, los navegadores compatibles con HTML5 ocultan el contenido marcado como <code>&lt;foo hidden&gt;...&lt;/foo&gt;</code>, aunque <code>&lt;foo&gt;</code> no sea un elemento HTML válido.</p>
+
+<p>Además de los atributos globales HTML básicos, también existen los siguientes atributos globales:</p>
+
+<ul>
+ <li>{{HTMLAttrDef("xml:lang")}} y {{HTMLAttrDef("xml:base")}} — estos se heredan de las especificaciones XHTML y están en desuso, pero se mantienen por motivos de compatibilidad.</li>
+ <li>Los múltiples atributos <code><strong>{{web.link("/es/docs/Web/Accessibility/ARIA", "aria-*")}}</strong></code>, utilizados para mejorar la accesibilidad.</li>
+ <li>Los atributos de {{web.link("/es/docs/Web/Guide/Events/Event_handlers", "control de eventos")}}: <code><strong>onabort</strong></code>, <code><strong>onautocomplete</strong></code>, <code><strong>onautocompleteerror</strong></code>, <code><strong>onblur</strong></code>, <code><strong>oncancel</strong></code>, <code><strong>oncanplay</strong></code>, <code><strong>oncanplaythrough</strong></code>, <code><strong>onchange</strong></code>, <code><strong>onclick</strong></code>, <code><strong>onclose</strong></code>, <code><strong>oncontextmenu</strong></code>, <code><strong>oncuechange</strong></code>, <code><strong>ondblclick</strong></code>, <code><strong>ondrag</strong></code>, <code><strong>ondragend</strong></code>, <code><strong>ondragenter</strong></code>, <code><strong>ondragexit</strong></code>, <code><strong>ondragleave</strong></code>, <code><strong>ondragover</strong></code>, <code><strong>ondragstart</strong></code>, <code><strong>ondrop</strong></code>, <code><strong>ondurationchange</strong></code>, <code><strong>onemptied</strong></code>, <code><strong>onended</strong></code>, <code><strong>onerror</strong></code>, <code><strong>onfocus</strong></code>, <code><strong>oninput</strong></code>, <code><strong>oninvalid</strong></code>, <code><strong>onkeydown</strong></code>, <code><strong>onkeypress</strong></code>, <code><strong>onkeyup</strong></code>, <code><strong>onload</strong></code>, <code><strong>onloadeddata</strong></code>, <code><strong>onloadedmetadata</strong></code>, <code><strong>onloadstart</strong></code>, <code><strong>onmousedown</strong></code>, <code><strong>onmouseenter</strong></code>, <code><strong>onmouseleave</strong></code>, <code><strong>onmousemove</strong></code>, <code><strong>onmouseout</strong></code>, <code><strong>onmouseover</strong></code>, <code><strong>onmouseup</strong></code>, <code><strong>onmousewheel</strong></code>, <code><strong>onpause</strong></code>, <code><strong>onplay</strong></code>, <code><strong>onplaying</strong></code>, <code><strong>onprogress</strong></code>, <code><strong>onratechange</strong></code>, <code><strong>onreset</strong></code>, <code><strong>onresize</strong></code>, <code><strong>onscroll</strong></code>, <code><strong>onseeked</strong></code>, <code><strong>onseeking</strong></code>, <code><strong>onselect</strong></code>, <code><strong>onshow</strong></code>, <code><strong>onsort</strong></code>, <code><strong>onstalled</strong></code>, <code><strong>onsubmit</strong></code>, <code><strong>onsuspend</strong></code>, <code><strong>ontimeupdate</strong></code>, <code><strong>ontoggle</strong></code>, <code><strong>onvolumechange</strong></code>, <code><strong>onwaiting</strong></code>.</li>
+</ul>
+
+<h2 id="Lista_de_atributos_globales">Lista de atributos globales</h2>
+
+<dl>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/accesskey", "accesskey")}}</code></strong></dt>
+ <dd>Proporciona una pista para generar un atajo de teclado para el elemento actual. Este atributo consta de una lista de caracteres separados por espacios. El navegador debe utilizar el primero que exista en la distribución del teclado del ordenador.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/autocapitalize", "autocapitalize")}}</code></strong></dt>
+ <dd>Controla si la entrada de texto se pone en mayúsculas automáticamente a medida que el usuario la introduce o edita. Puede tener los siguientes valores:
+ <ul>
+  <li><code>off</code> o <code>none</code>, no se aplica capitalización automática (todas las letras están predeterminadas en minúsculas)</li>
+  <li><code>on</code> o <code>sentences</code>, la primera letra de cada oración de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
+  <li><code>words</code>, la primera letra de cada palabra de manera predeterminada tiene una letra mayúscula; todas las demás letras están predeterminadas en minúsculas</li>
+  <li><code>characters</code>, todas las letras de manera predeterminada deben estar en mayúsculas</li>
+ </ul>
+ </dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/class", "class")}}</code></strong></dt>
+ <dd>Una lista separada por espacios de las clases del elemento. Las clases permiten que CSS y JavaScript seleccionen y accedan a elementos específicos a través de los {{web.link("/es/docs/Web/CSS/Class_selectors", "selectores de clase")}} o funciones como el método {{DOMxRef("document.getElementsByClassName()")}}.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/contenteditable", "contenteditable")}}</code></strong></dt>
+ <dd>Un atributo enumerado que indica si el usuario debe poder editar el elemento. Si es así, el navegador modifica su «<em>widget</em>» para permitir la edición. El atributo debe tomar uno de los siguientes valores:
+ <ul>
+  <li><code>true</code> o la <em>cadena vacía</em>, la cual indica que el elemento debe ser editable;</li>
+  <li><code>false</code>, el cual indica que el elemento no debe ser editable.</li>
+ </ul>
+ </dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/contextmenu", "contextmenu")}}</code></strong> {{Obsolete_Inline}}</dt>
+ <dd>El {{anch("attr-id", "id")}} de un {{HTMLElement ("menu")}} para usar como el menú contextual para este elemento.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/data-*", "data-*")}}</code></strong></dt>
+ <dd>Forma una clase de atributos, denominados atributos de datos personalizados, que permiten el intercambio de información de propiedad entre el {{web.link("/es/docs/Web/HTML", "HTML")}} y su representación {{Glossary("DOM")}} que pueden utilizar los scripts. Todos estos datos personalizados están disponibles a través de la interfaz {{DOMxRef("HTMLElement")}} del elemento en el que está configurado el atributo. La propiedad {{DOMxRef("HTMLElement.dataset")}} les da acceso.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/dir", "dir")}}</code></strong></dt>
+ <dd>Un atributo enumerado que indica la direccionalidad del texto del elemento. Puede tener los siguientes valores:
+ <ul>
+  <li><code>ltr</code>, que significa <em>de izquierda a derecha</em> y s debe usar para idiomas que se escriben de izquierda a derecha (tal como el Español);</li>
+  <li><code>rtl</code>, que significa <em>de derecha a izquierda</em> y se utiliza para idiomas que se escriben de derecha a izquierda (tal como el Árabe);</li>
+  <li><code>auto</code>, permite que el agente de usuario decida. Utiliza un algoritmo básico ya que analiza los caracteres dentro del elemento hasta que encuentra un carácter con una direccionalidad fuerte, luego aplica esa direccionalidad a todo el elemento.</li>
+ </ul>
+ </dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/draggable", "draggable")}}</code></strong></dt>
+ <dd>Un atributo enumerado que indica si el elemento se puede arrastrar mediante la {{web.link("/es/docs/DragDrop/Drag_and_Drop", "API de arrastrar y soltar")}}. Puede tener los siguientes valores:
+ <ul>
+  <li><code>true</code>, indica que el elemento se puede arrastrar</li>
+  <li><code>false</code>, indica que el elemento <strong>no</strong> se puede arrastrar.</li>
+ </ul>
+ </dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/dropzone", "dropzone")}}</code></strong> {{deprecated_inline}}</dt>
+ <dd>Un atributo enumerado que indica qué tipos de contenido se pueden colocar en un elemento, utilizando la {{web.link("/es/docs/DragDrop/Drag_and_Drop", "API de arrastrar y soltar")}}. Puede tener los siguientes valores:
+ <ul>
+  <li><code>copy</code>, indica que soltar creará una copia del elemento que se arrastró</li>
+  <li><code>move</code>, indica que el elemento que se arrastró se moverá a esta nueva ubicación.</li>
+  <li><code>link</code>, creará un enlace a los datos arrastrados.</li>
+ </ul>
+ </dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/exportparts", "exportparts")}}</code></strong> {{Experimental_Inline}}</dt>
+ <dd>Se utiliza para exportar de forma transitiva partes de sombras de un árbol de sombras anidado a un árbol contenedor de luz.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/hidden", "hidden")}}</code></strong></dt>
+ <dd>Un atributo booleano indica que el elemento aún no es o ya no es <em>relevante</em>. Por ejemplo, se puede utilizar para ocultar elementos de la página que no se pueden utilizar hasta que se haya completado el proceso de inicio de sesión. El navegador no representará tales elementos. Este atributo no se debe utilizar para ocultar contenido que se podría mostrar legítimamente.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/id", "id")}}</code></strong></dt>
+ <dd>Define un identificador (ID) único que debe ser único en todo el documento. Su propósito es identificar el elemento al vincularlo (usando un identificador de fragmento), al escribir un script o al aplicarle estilo (con CSS).</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/inputmode", "inputmode")}}</code></strong></dt>
+ <dd>Proporciona una pista a los navegadores sobre el tipo de configuración de teclado virtual que se debe utilizar al editar este elemento o su contenido. Se usa principalmente en elementos {{HTMLElement("input")}}, pero se puede usar en cualquier elemento mientras esté en modo {{HTMLAttrxRef("contenteditable")}}.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/is", "is")}}</code></strong></dt>
+ <dd>Te permite especificar que un elemento HTML estándar se debe comportar como un elemento integrado personalizado registrado (consulta {{web.link("/es/docs/Web/Web_Components/Using_custom_elements", "Uso de elementos personalizados")}} para obtener más detalles).</dd>
+</dl>
+
+<div class="note">
+<p><strong>Nota</strong>: Los atributos <code>item*</code> son parte de <a class="external" href="https://html.spec.whatwg.org/multipage/microdata.html#microdata">Función de microdatos HTML de WHATWG</a>.</p>
+</div>
+
+<dl>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemid", "itemid")}}</code></strong></dt>
+ <dd>El identificador único y global de un artículo.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemprop", "itemprop")}}</code></strong></dt>
+ <dd>Se usa para agregar propiedades a un elemento. Se puede especificar a cada elemento HTML un atributo <code>itemprop</code>, donde un <code>itemprop</code> consiste en un par de nombre y valor.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemref", "itemref")}}</code></strong></dt>
+ <dd>Las propiedades que no son descendientes de un elemento con el atributo <code>itemscope</code> se pueden asociar con el elemento usando un <code>itemref</code>. Proporciona una lista de IDs de elementos (no <code>itemid</code>s) con propiedades adicionales en otras partes del documento.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemscope", "itemscope")}}</code></strong></dt>
+ <dd><code>itemscope</code> (normalmente) funciona junto con {{HTMLAttrxRef("itemtype")}} para especificar que el HTML contenido en un bloque es sobre un elemento en particular. <code>itemscope</code> crea el «<em>Item</em>» y define el alcance del <code>itemtype</code> asociado con él. <code>itemtype</code> es una URL válida de un vocabulario (tal como <a class="external external-icon" href="https://schema.org/">schema.org</a>) que describe el elemento y las propiedades de su contexto.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/itemtype", "itemtype")}}</code></strong></dt>
+ <dd>Especifica la URL del vocabulario que se utilizará para definir <code>itemprop</code>s (propiedades del elemento) en la estructura de datos. {{HTMLAttrxRef("itemscope")}} se utiliza para establecer el alcance de la estructura de datos en la que estará activo el vocabulario establecido por <code>itemtype</code>.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/lang", "lang")}}</code></strong></dt>
+ <dd>Ayuda a definir el idioma de un elemento: el idioma en el que se encuentran los elementos no editables o el idioma en el que el usuario debe escribir los elementos editables. El atributo contiene una “etiqueta de idioma” (compuesta de “subetiquetas de idioma” separadas por guiones) en el formato definido en <a class="external" href="https://www.ietf.org/rfc/bcp/bcp47.txt"><em>Etiquetas para identificar idiomas (BCP47)</em></a>. {{anch("attr-xml:lang", "xml:lang")}} tiene prioridad sobre él.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/part", "part")}}</code></strong></dt>
+ <dd>Una lista separada por espacios de los nombres de las partes del elemento. Los nombres de las partes permiten que CSS seleccione y aplique estilo a elementos específicos en la sombra de un árbol mediante el pseudoelemento {{CSSxRef("::part")}}.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/slot", "slot")}}</code></strong></dt>
+ <dd>Asigna un espacio en la sombra de un árbol {{web.link("/es/docs/Web/Web_Components/Shadow_DOM", "DOM de sombra")}} a un elemento: Un elemento con un atributo <code>slot</code> es asignado al espacio creado por el elemento {{HTMLElement("slot")}} cuyo valor del atributo {{HTMLAttrxRef("name", "slot")}} coincide con el valor del atributo <code>slot</code>.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/spellcheck", "spellcheck")}}</code></strong></dt>
+ <dd>Un atributo enumerado define si se puede verificar el elemento para detectar errores ortográficos. Puede tener los siguientes valores:
+ <ul>
+  <li><code>true</code>, el cual indica que, si es posible, el elemento se debe revisar para detectar errores ortográficos;</li>
+  <li><code>false</code>, indica que el elemento <strong>no</strong> se debe revisar para detectar errores ortográficos.</li>
+ </ul>
+ </dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/style", "style")}}</code></strong></dt>
+ <dd>Contiene declaraciones de estilo {{web.link("/en-US/docs/Web/CSS", "CSS")}} que se aplicarán al elemento. Ten en cuenta que se recomienda que los estilos se definan en un archivo o archivos separados. Este atributo y el elemento {{HTMLElement("style")}} principalmente tienen el propósito de permitir un estilo rápido, por ejemplo, con fines de prueba.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/tabindex", "tabindex")}}</code></strong></dt>
+ <dd>Un atributo entero que indica si el elemento puede tomar el foco de entrada (es <em>enfocable</em>), si debe participar en la navegación secuencial del teclado y, de ser así, en qué posición. Puede tomar varios valores:
+ <ul>
+  <li>un <em>valor negativo</em> significa que el elemento se debe poder enfocar, pero no debe ser accesible mediante la navegación secuencial del teclado;</li>
+  <li><code>0</code> significa que el elemento se debe poder enfocar y ser accesible a través de la navegación secuencial del teclado, pero su orden relativo está definido por la convención de la plataforma;</li>
+  <li>un <em>valor positivo</em> significa que el elemento se debe poder enfocar y ser accesible mediante la navegación secuencial del teclado; el orden en el que se enfocan los elementos es el valor creciente del {{anch("attr-tabindex", "tabindex")}}. Si varios elementos comparten el mismo <code>tabindex</code>, su orden relativo sigue sus posiciones relativas en el documento.</li>
+ </ul>
+ </dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/title", "title")}}</code></strong></dt>
+ <dd>Contiene un texto que representa información de advertencia relacionada con el elemento al que pertenece. Normalmente, pero no necesariamente, dicha información se puede presentar al usuario como información sobre herramientas.</dd>
+ <dt><strong><code>{{web.link("/es/docs/Web/HTML/Global_attributes/translate", "translate")}}</code></strong> {{Experimental_Inline}}</dt>
+ <dd>Un atributo enumerado que se utiliza para especificar si los valores de atributo de un elemento y los valores de sus hijos de nodo {{DOMxRef("Text")}} se deben traducir cuando la página está localizada, o si se deben dejar sin cambios. Puede tener los siguientes valores:
+ <ul>
+  <li>la cadena vacía y <code>yes</code>, indican que el elemento se traducirá.</li>
+  <li><code>no</code>, lo cual indica que el elemento <strong>no</strong> se traducirá.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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("HTML WHATWG", "dom.html#global-attributes", "Atributos globales")}}</td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("CSS Shadow Parts", "#exposing")}}</td>
+   <td>{{Spec2("CSS Shadow Parts")}}</td>
+   <td>Se agregaron los atributos globales <code>part</code> y <code>exportparts</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5.2", "dom.html#global-attributes", "Atributos globales")}}</td>
+   <td>{{Spec2("HTML5.2")}}</td>
+   <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML5.1")}}, se han añadido <code>itemid</code>, <code>itemprop</code>, <code>itemref</code>, <code>itemscope</code> y <code>itemtype</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5.1", "dom.html#global-attributes", "Atributos globales")}}</td>
+   <td>{{Spec2("HTML5.1")}}</td>
+   <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML5 W3C")}}, ha sido añadido <code>contextmenu</code>, <code>draggable</code>, <code>dropzone</code> y <code>spellcheck</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML5 W3C", "dom.html#global-attributes", "Atributos globales")}}</td>
+   <td>{{Spec2("HTML5 W3C")}}</td>
+   <td>Instantánea de {{SpecName("HTML WHATWG")}}. De {{SpecName("HTML4.01")}}, se introduce el concepto de atributos globales y <code>dir</code>, <code>lang</code>, <code>style</code>, <code>id</code>, <code>class</code>, <code>tabindex</code>, <code>accesskey</code>, y <code>title</code> ahora son verdaderos atributos globales.<br>
+    <code>xml:lang</code> que inicialmente formaba parte de XHTML, ahora también forma parte de HTML.<br>
+    Se han agregado <code>hidden</code>, <code>data-*</code>, <code>contenteditable</code> y <code>translate</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML4.01")}}</td>
+   <td>{{Spec2("HTML4.01")}}</td>
+   <td>No hay atributos globales definidos. Varios atributos que se convertirán en atributos globales en especificaciones posteriores se definen en un subconjunto de elementos.<br>
+    <code>class</code> y <code>style</code> son compatibles con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.<br>
+    <code>dir</code> es compatible con todos los elementos excepto {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} y {{HTMLElement("script")}}.<br>
+    <code>id</code> es compatible con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}} y {{HTMLElement("title")}}.<br>
+    <code>lang</code> es compatible con todos los elementos excepto {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}} y {{HTMLElement("script")}}.<br>
+    <code>tabindex</code> solo es compatible con {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}} y {{HTMLElement("textarea")}}.<br>
+    <code>accesskey</code> solo es compatible con {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{HTMLElement("label")}}, {{HTMLElement("legend")}} t {{HTMLElement("textarea")}}.<br>
+    <code>title</code> es compatibles con todos los elementos excepto {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}} y {{HTMLElement("title")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("html.global_attributes")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>Las interfaces {{DOMxRef("Element")}} y {{DOMxRef("GlobalEventHandlers")}} que permiten consultar la mayoría de los atributos globales.</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/is/index.html b/files/es/web/html/global_attributes/is/index.html
new file mode 100644
index 0000000000..639a0c3c6e
--- /dev/null
+++ b/files/es/web/html/global_attributes/is/index.html
@@ -0,0 +1,68 @@
+---
+title: is
+slug: Web/HTML/Global_attributes/is
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+  - is
+translation_of: Web/HTML/Global_attributes/is
+original_slug: Web/HTML/Atributos_Globales/is
+---
+<div>{{HTMLSidebar("Global_attributes")}}</div>
+
+<p><span class="seoSummary">La construcción is <a href="/es/docs/Web/HTML/Atributos_Globales">global attribute</a> permite especificar que un elemento HTML estándar se debería comportar como un elemento personalizado provisto originalmente por el lenguaje (para más detalles, vea <a href="/en-US/docs/Web/Web_Components/Using_custom_elements">Utilizando elementos personalizados</a>).</span></p>
+
+<p>Este atributo puede ser utilizado sólo si nombre del elemento personalizado especificado ha sido <a href="/en-US/docs/Web/API/CustomElementRegistry/define">definido</a> extósamente en el documento actual, y extiende el tipo de elemento al que está siendo aplicado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente código fue tomado de nuestro ejemplo <a href="https://github.com/mdn/web-components-examples/tree/master/word-count-web-component">word-count-web-component</a> (<a href="https://mdn.github.io/web-components-examples/word-count-web-component/">véalo también en vivo</a>).</p>
+
+<pre class="brush: js">// Crea una clase para el elemento
+class WordCount extends HTMLParagraphElement {
+  constructor() {
+    // Siempre llamar a super al comienzo del constructor
+    super();
+
+    // Contenido del constructor omitido para mayor brevedad
+    ...
+
+  }
+}
+
+// Define el nuevo elemento
+customElements.define('word-count', WordCount, { extends: 'p' });</pre>
+
+<pre class="brush: html">&lt;<span class="pl-ent">p</span> <span class="pl-e">is</span>=<span class="pl-s"><span class="pl-pds">"</span>word-count<span class="pl-pds">"</span></span>&gt;&lt;/<span class="pl-ent">p</span>&gt;</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "custom-elements.html#attr-is", "is")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si desea contribuir a estos datos, por favor clone el repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
+
+<p>{{Compat("html.global_attributes.is")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>Todos los <a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</li>
+</ul>
+
+<p> </p>
diff --git a/files/es/web/html/global_attributes/itemid/index.html b/files/es/web/html/global_attributes/itemid/index.html
new file mode 100644
index 0000000000..0d7bbe5d5a
--- /dev/null
+++ b/files/es/web/html/global_attributes/itemid/index.html
@@ -0,0 +1,79 @@
+---
+title: itemid
+slug: Web/HTML/Global_attributes/itemid
+translation_of: Web/HTML/Global_attributes/itemid
+original_slug: Web/HTML/Atributos_Globales/itemid
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El atributo <strong>Itemid </strong>es un identificador global y único de un item.</p>
+
+<p>Los atributos Itemid attributes sólo se pueden especificar en elmentos que tiene atributos tanto de <strong>itemscope </strong>como <strong>itemtype</strong>. Además, el itemid sólo puede ser especficiado en elemento con un atributo itemscope cuyo correspondiente itemtype hace referencia o define un vocabulario que soporte identificadores globales.</p>
+
+<p>Un vocabulario de itemtype nos proporcionará el significado exacto de un identificador global definido dentro del vocabulario. El vocabulario definirá si varios item con el mismo identificador global puede co-existir y, si están permitidos, cómo item con el mismo identificador son gestionados.</p>
+
+<p class="note"><strong>Nota:</strong> La definición de  itemid hecha por Whatwg.org dice que debe ser una URL. No parece que sea el caso de el ejemplo que se muestra más abajo. Sin embargo la definición de facto es que un itemid es un identificador único, así que los apropiado es URB. Esta inconsistencia refleja sin dudarlo la naturaleza incompleta de la espeficicación Microdata.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;dl itemscope
+    itemtype="http://vocab.example.net/book"
+    itemid="urn:isbn:0-330-34032-8"&gt;
+&lt;dt&gt;Título &lt;dd itemprop="titulo"&gt;The Reality Dysfunction
+&lt;dt&gt;Autor &lt;dd itemprop="autor"&gt;Peter F. Hamilton
+&lt;dt&gt;Fecha de publicación
+&lt;dd&gt;&lt;time itemprop="fechapublicacion" datetime="26-01-1996"&gt;26 Enero 1996&lt;/time&gt; &lt;/dl&gt;</pre>
+
+<h3 id="Datos_estructurados">Datos estructurados</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td colspan="1" rowspan="14">itemscope</td>
+   <td>itemtype: itemid</td>
+   <td colspan="2" rowspan="1">
+    <div class="jyrRxf-eEDwDf jcd3Mb IZ65Hb-hUbt4d"><span>http://vocab.example.net/book</span>: urn:isbn:0-330-34032-8</div>
+   </td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>titulo</span></td>
+   <td><span>The Reality Dysfunction</span></td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>autor</span></td>
+   <td>
+    <div class="jyrRxf-eEDwDf jcd3Mb"><span>Peter F. Hamilton</span></div>
+   </td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>fechapublicacion</span></td>
+   <td><span>26-01-1996</span></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('HTML', '', '', '', 'Web/HTML/Global_attributes/itemid') }}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table" style="height: 105px; width: 490px;">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estad</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><a href="https://html.spec.whatwg.org/multipage/microdata.html#attr-itemid">itemid</a></td>
+   <td>Nota WG - No está siendo ya activamente desarrollado.</td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/es/web/html/global_attributes/itemprop/index.html b/files/es/web/html/global_attributes/itemprop/index.html
new file mode 100644
index 0000000000..33ce0c5ddf
--- /dev/null
+++ b/files/es/web/html/global_attributes/itemprop/index.html
@@ -0,0 +1,23 @@
+---
+title: itemprop
+slug: Web/HTML/Global_attributes/itemprop
+tags:
+  - atributo
+  - metatag
+translation_of: Web/HTML/Global_attributes/itemprop
+original_slug: Web/HTML/Atributos_Globales/itemprop
+---
+<p style="margin: 0.5em 0px 0px 50px; padding-top: 0px; padding-bottom: 2px; color: rgb(58, 73, 86); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Tahoma, Arial, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">Podemos dar más información al motor de búsqueda acerca de imágenes o datos adentro de cualquier tipo de etiquetas , como las propiedades : actores , clasificación ,genero . Para etiquetar las propiedades de un elemento , usa el atributo itemprop . Por ejemplo , para identificar al actor de una película añadir itemprop="director" al elemento que encierra el nombre del director.</p>
+
+<p style="margin: 0.5em 0px 0px 50px; padding-top: 0px; padding-bottom: 2px; color: rgb(58, 73, 86); font-family: 'Lucida Grande', 'Lucida Sans Unicode', Verdana, Tahoma, Arial, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-align: left; text-indent: 0px; text-transform: none; white-space: normal;">Aquí hay un ejemplo .</p>
+
+<pre style="font-family: Courier, monospace; font-size: 14.4px; width: auto; padding: 0px 5px 2px 10px; margin: 0.5em 0px 0px 50px; text-align: left; overflow: auto; color: rgb(58, 73, 86); font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.2px; text-indent: 0px; text-transform: none; background: rgb(225, 225, 225);">&lt;div itemscope itemtype="http://schema.org/Movie"&gt;
+  &lt;h1 <strong>itemprop="name"</strong>&gt;Avatar&lt;/h1&gt;
+  &lt;span&gt;Director: &lt;span <strong>itemprop="director"</strong>&gt;James Cameron&lt;/span&gt; (born August 16, 1954)&lt;/span&gt;
+  &lt;span <strong>itemprop="genre"</strong>&gt;Ciencia ficcion&lt;/span&gt;
+  &lt;a href="../movies/avatar-theatrical-trailer.html" <strong>itemprop="trailer"</strong>&gt;Trailer&lt;/a&gt;
+&lt;/div&gt;</pre>
+
+<p> </p>
+
+<p>             Para más información acerca de los atributos relacionados consultar  https://schema.org/docs/gs.html</p>
diff --git a/files/es/web/html/global_attributes/itemref/index.html b/files/es/web/html/global_attributes/itemref/index.html
new file mode 100644
index 0000000000..a4c49d10a6
--- /dev/null
+++ b/files/es/web/html/global_attributes/itemref/index.html
@@ -0,0 +1,107 @@
+---
+title: itemref
+slug: Web/HTML/Global_attributes/itemref
+translation_of: Web/HTML/Global_attributes/itemref
+original_slug: Web/HTML/Atributos_Globales/itemref
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>Las propiedades que no son descendientes de un elemento con el atributo <code>itemscope</code> pueden ser asociadas con el elemento usando un <strong>itemref</strong> . <strong>Itemref</strong> provee una lista de ids de los elementos (no <code>itemids</code>) con propiedades adicionales en otras partes dentro del documento .</p>
+
+<p>El atributo itemref puede ser solo especificado en elementos que tienen un atributo itemscope especificado .</p>
+
+<p class="note"><strong>Nota: </strong>el atributo itemref no es parte del modelo de micro datos . Es solamente un constructor sintáctico que ayuda a los autores en el ingreso de anotaciones a las páginas donde los datos que se van a anotar no siguen una estructura de arbol conveniente . Por ejemplo , permite a los autores marcar los datos en una tabla para que cada columna defina un item separado mientras se mantienen las propiedades en las celdas .</p>
+
+<div class="syntaxbox">
+<h2 class="syntaxbox" id="Ejemplo">Ejemplo</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<div class="syntaxbox">
+<pre class="brush: html">&lt;div itemscope id="amanda" itemref="a b"&gt;&lt;/div&gt;
+&lt;p id="a"&gt;Name: &lt;span itemprop="name"&gt;Amanda&lt;/span&gt; &lt;/p&gt;
+&lt;div id="b" itemprop="band" itemscope itemref="c"&gt;&lt;/div&gt;
+&lt;div id="c"&gt;
+    &lt;p&gt;Band: &lt;span itemprop="name"&gt;Jazz Band&lt;/span&gt; &lt;/p&gt;
+    &lt;p&gt;Size: &lt;span itemprop="size"&gt;12&lt;/span&gt; players&lt;/p&gt;
+&lt;/div&gt;
+</pre>
+</div>
+
+<article id="wikiArticle">
+<h3 id="Datos_estructurados">Datos estructurados </h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>id's</th>
+   <th>itemscope</th>
+   <th>itemref</th>
+   <th> </th>
+   <th>(nombre de itemprop )</th>
+   <th>(valor de itemprop)</th>
+  </tr>
+  <tr>
+   <td>id=amanda</td>
+   <td>itemscope</td>
+   <td>itemref=a,b</td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>id=a</td>
+   <td> </td>
+   <td> </td>
+   <td>itemprop</td>
+   <td>name</td>
+   <td><span>Amanda</span></td>
+  </tr>
+  <tr>
+   <td>id=b</td>
+   <td>itemscope</td>
+   <td>itemref=c</td>
+   <td> </td>
+   <td>band</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="2">id=c</td>
+   <td> </td>
+   <td> </td>
+   <td>itemprop</td>
+   <td>Band</td>
+   <td><span>Jazz Band</span></td>
+  </tr>
+  <tr>
+   <td> </td>
+   <td> </td>
+   <td>itemprop</td>
+   <td>Size</td>
+   <td><span>12</span></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('Example', '', '', '', 'Web/HTML/Global_attributes/itemref') }}</p>
+
+<h2 id="EspecificaciónEditEdit">Especificación<a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-alternates$edit#Specifications"><span>Edit</span></a><a class="only-icon button section-edit new" href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemid$edit#SpecificationsEdit"><span>Edit</span></a></h2>
+
+<table class="standard-table" style="height: 105px; width: 490px;">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td style="text-align: left; vertical-align: middle;"><a class="external-icon external" href="https://html.spec.whatwg.org/multipage/microdata.html#items">itemref</a></td>
+   <td style="text-align: left; vertical-align: middle; white-space: nowrap;">Nota WG  - No se encuentra activamente en desarrollo</td>
+  </tr>
+ </tbody>
+</table>
+</article>
+</div>
diff --git a/files/es/web/html/global_attributes/itemscope/index.html b/files/es/web/html/global_attributes/itemscope/index.html
new file mode 100644
index 0000000000..d85f8c6779
--- /dev/null
+++ b/files/es/web/html/global_attributes/itemscope/index.html
@@ -0,0 +1,285 @@
+---
+title: itemscope
+slug: Web/HTML/Global_attributes/itemscope
+tags:
+  - Ejemplo
+  - itemscope
+  - itemtype
+translation_of: Web/HTML/Global_attributes/itemscope
+original_slug: Web/HTML/Atributos_Globales/itemscope
+---
+<div>{{HTMLSidebar("Global_attributes")}}</div>
+
+<p><code><strong>itemscope</strong></code> es un <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> booleano que define el scope asociado del metadata. Especificando el atributo <code><strong>itemscope</strong></code> en un elemento crea un nuevo item, cuyos resultados estan en los numeros de pares name-value asociados con el elemento. Un atributo relativo, {{htmlattrxref("itemtype")}}, es usado para especificar el URL valido de un medio/recipe (como lo es <a href="http://schema.org/">schema.org</a>) que describe que el item es de propiedad contextual. En cada uno de los siguientes ejemplos, el medio/recipe es de <a href="https://schema.org/">schema.org</a>.</p>
+
+<p>Todos los elementos HTML pueden tener un atributo <code>itemscope</code> especifico. Un elemento <code>itemscope</code> no tiene un asociado <code>itemtype</code> pero tiene un sociado <code>itemref</code>.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Encuentra mas acerca del atributo <code>itemtype</code> en <a href="http://schema.org/Thing">http://schema.org/Thing</a></p>
+</div>
+
+<h3 id="Ejemplo_simple">Ejemplo simple</h3>
+
+<h4 id="HTML">HTML</h4>
+
+<p>El siguiente ejemplo especifica que el atributo <code>itemscope</code>. El ejemplo especificado en el <code>itemtype</code> es "http://schema.org/Movie", y especifica tres atributos <code>itemprop</code> relativos.</p>
+
+<pre class="brush:html">&lt;div itemscope itemtype="http://schema.org/Movie"&gt;
+  &lt;h1 itemprop="nombre"&gt;Avatar&lt;/h1&gt;
+  &lt;span&gt;Director: &lt;span itemprop="director"&gt;James Cameron&lt;/span&gt; (born August 16, 1954)&lt;/span&gt;
+  &lt;span itemprop="genero"&gt;Ciencia ficcion&lt;/span&gt;
+  &lt;a href="https://youtu.be/0AY1XIkX7bY" itemprop="trailer"&gt;Trailer&lt;/a&gt;
+&lt;/div&gt;
+</pre>
+
+<h4 id="sect1"> </h4>
+
+<h4 id="Esctructura_de_informacion">Esctructura de informacion</h4>
+
+<p>La siguiente tabla muestran los datos esctructurados mostrados en el anterior ejemplo.</p>
+
+<p> </p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td rowspan="6">itemscope</td>
+   <td>Itemtype</td>
+   <td colspan="2">Movie</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>(itemprop name)</td>
+   <td>(itemprop value)</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>director</td>
+   <td>James Cameron</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>genero</td>
+   <td>Ciencia Ficcion</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>nombre</td>
+   <td>Avatar</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>https://youtu.be/0AY1XIkX7bY</td>
+   <td>Trailer</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="itemscope_Atributos_ID"><code>itemscope</code> Atributos ID</h3>
+
+<p>Cuando especificas el atributo <code>itemscope</code> para un elemento, un nuevo item es creado. El item consiste de un grupo de pares de name-value. Para elementos con un atributo <code>itemscope</code> y un atributo <code>itemtype</code>, podrias tambien especificar un {{htmlattrxref("id")}} attribute. Puedes usar el atributo <code>id</code> para establecer un identificador global para el nuevo item. Un identificador global permite que los items relativos a otros items encuentren paginas atraves de la Web.</p>
+
+<h3 id="Ejemplo">Ejemplo</h3>
+
+<p>Hay 4 atributos <code>itemscope</code> en el siguiente ejemplo. Cada atributo <code>itemscope</code> establecen el scope correspondiente a sus atributos <code>itemtype</code>. El <code>itemtype</code>s, <code>Recipe</code>, <code>AggregateRating</code>, y <code>NutritionInformation</code> en el siguiente ejemplo son parte de la informacion estructura por medio de <a href="www.schema.org">schema.org</a>, se especifico el primer <code>itemtype</code>, http://schema.org/Recipe.</p>
+
+<pre class="brush: html">&lt;div itemscope itemtype="http://schema.org/Recipe"&gt;
+&lt;h2 itemprop="name"&gt;Grandma's Holiday Apple Pie&lt;/h2&gt;
+&lt;img itemprop="image" src="https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg" width="50" height="50"/&gt;
+&lt;p&gt;By &lt;span itemprop="author" itemscope itemtype="http://schema.org/Person"&gt;
+&lt;span itemprop="name"&gt;Carol Smith&lt;/p&gt;&lt;/span&gt;
+&lt;/span&gt;
+&lt;p&gt;Published: &lt;time datetime="2009-11-05" itemprop="datePublished"&gt;
+November 5, 2009&lt;/p&gt;&lt;/time&gt;
+&lt;span itemprop="description"&gt;This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.&lt;br&gt;&lt;/span&gt;
+ &lt;span itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"&gt;
+ &lt;span itemprop="ratingValue"&gt;4.0&lt;/span&gt; stars based on &lt;span itemprop="reviewCount"&gt;35&lt;/span&gt; reviews&lt;br&gt;&lt;/span&gt;
+Prep time: &lt;time datetime="PT30M" itemprop="prepTime"&gt;30 min&lt;br&gt;&lt;/time&gt;
+ Cook time: &lt;time datetime="PT1H" itemprop="cookTime"&gt;1 hour&lt;br&gt;&lt;/time&gt;
+ Total time: &lt;time datetime="PT1H30M" itemprop="totalTime"&gt;1 hour 30 min&lt;br&gt;&lt;/time&gt;
+ Yield: &lt;span itemprop="recipeYield"&gt;1 9" pie (8 servings)&lt;br&gt;&lt;/span&gt;
+ &lt;span itemprop="nutrition" itemscope itemtype="http://schema.org/NutritionInformation"&gt;
+ Serving size: &lt;span itemprop="servingSize"&gt;1 medium slice&lt;br&gt;&lt;/span&gt;
+ Calories per serving: &lt;span itemprop="calories"&gt;250 cal&lt;br&gt;&lt;/span&gt;
+ Fat per serving: &lt;span itemprop="fatContent"&gt;12 g&lt;br&gt;&lt;/span&gt;
+&lt;/span&gt;
+&lt;p&gt;Ingredients:&lt;br&gt;
+  &lt;span itemprop="recipeIngredient"&gt;Thinly-sliced apples: 6 cups&lt;br&gt;&lt;/span&gt;
+  &lt;span itemprop="recipeIngredient"&gt;White sugar: 3/4 cup&lt;br&gt;&lt;/span&gt;
+ ... &lt;/p&gt;
+
+Directions: &lt;br&gt;
+  &lt;div itemprop="recipeInstructions"&gt;
+    1. Cut and peel apples&lt;br&gt;
+    2. Mix sugar and cinnamon. Use additional sugar for tart apples. &lt;br&gt;
+    ...
+  &lt;/div&gt;
+&lt;/div&gt; </pre>
+
+<h3 id="Resultados">Resultados</h3>
+
+<h4 id="HTML_2">HTML</h4>
+
+<p>Los siguientes son un ejemplo renderizado resultado del codigo del anterior ejemplo.</p>
+
+<p>{{EmbedLiveSample('Example', '500', '550', '', 'Web/HTML/Global_attributes/itemscope')}}</p>
+
+<h4 id="Structured_data">Structured data</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td colspan="1" rowspan="14">itemscope</td>
+   <td>itemtype</td>
+   <td colspan="2" rowspan="1">Medio/Recipe</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>name</td>
+   <td>Grandma's Holiday Apple Pie</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>image</td>
+   <td>https://c1.staticflickr.com/1/30/42759561_8631e2f905_n.jpg</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>datePublished</td>
+   <td>2009-11-05</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>description</td>
+   <td>This is my grandmother's apple pie recipe. I like to add a dash of nutmeg.</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>prepTime</td>
+   <td>PT30M</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>cookTime</td>
+   <td>PT1H</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>totalTime</td>
+   <td>PT1H30M</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>recipeYield</td>
+   <td>1 9" pie (8 servings)</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>recipeIngredient</td>
+   <td>Thinly-sliced apples: 6 cups</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>recipeIngredient</td>
+   <td>White sugar: 3/4 cup</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>recipeInstructions</td>
+   <td>1. Cut and peel apples 2. Mix sugar and cinnamon. Use additional sugar for tart apples .</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td colspan="2" rowspan="1">author [Person]</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>name</td>
+   <td>Carol Smith</td>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="3">itemscope</td>
+   <td>itemprop[itemtype]</td>
+   <td colspan="2" rowspan="1">aggregateRating [AggregateRating]</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>ratingValue</td>
+   <td>4.0</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>reviewCount</td>
+   <td>35</td>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="4">itemscope</td>
+   <td>itemprop[itemtype]</td>
+   <td colspan="2" rowspan="1">nutrition [NutritionInformation]</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>servingSize</td>
+   <td>1 medium slice</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>calories</td>
+   <td>250 cal</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td>fatContent</td>
+   <td>12 g</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Note</strong>: Una herramienta practica para extraer estructuras microdata del HTML es<a href="https://developers.google.com/structured-data/testing-tool/"> Structured Data Testing Tool</a> de Google. Pruebalo en el HTML del ejemplo anterior.</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estados</th>
+   <th scope="col">Comentario</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('HTML Microdata', "#dfn-itemscope", "itemscope")}}</td>
+   <td>{{Spec2('HTML Microdata')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "microdata.html#attr-itemscope", "itemscope")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
+
+
+
+<p>{{Compat("html.global_attributes.itemscope")}}</p>
+
+<h2 id="Ver_tambien">Ver tambien</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/HTML/Global_attributes">Otros atributos globales diferentes</a></li>
+ <li>Otro, microdata relativo, atributos globales:
+  <ul>
+   <li>{{htmlattrxref("itemid")}}</li>
+   <li>{{htmlattrxref("itemprop")}}</li>
+   <li>{{htmlattrxref("itemref")}}</li>
+   <li>{{htmlattrxref("itemscope")}}</li>
+   <li>{{htmlattrxref("itemtype")}}</li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/web/html/global_attributes/lang/index.html b/files/es/web/html/global_attributes/lang/index.html
new file mode 100644
index 0000000000..3d13079440
--- /dev/null
+++ b/files/es/web/html/global_attributes/lang/index.html
@@ -0,0 +1,109 @@
+---
+title: lang
+slug: Web/HTML/Global_attributes/lang
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/lang
+original_slug: Web/HTML/Atributos_Globales/lang
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>lang</strong> participa en la definición del lenguaje del elemento , el lenguaje en que están escritos los elementos no editables o el lenguaje en el cual los elementos editables deberían de estar escritos . La etiqueta contiene un valor sencillo de entrada en el formato que define el documento <a href="http://www.ietf.org/rfc/bcp/bcp47.txt">tags para identificar lenguajes </a><em><a href="http://www.ietf.org/rfc/bcp/bcp47.txt"> </a>(BCP47)</em> de la IETF . Si el contenido de la etiqueta es la <em>cadena vacía </em>, el lenguaje se establece como <em>desconocido</em> , si el contenido de la etiqueta no es válido respecto al documento BCP47 , se establece como <em>inválido . </em></p>
+
+<p>Incluso si el atributo <strong>lang </strong>está establecido , puede que no se tome en cuenta , ya que el atributo <strong>xml:lang </strong>tiene prioridad . Leer el algoritmo para determinar el lenguaje  de el contenido de un elemento para ver como es determinado el lenguaje en todos los casos.</p>
+
+<p>Para la pseudo clase { cssxref(":lang") }} de CSS,  dos nombres invalidos de lenguaje son diferentes si sus nombres son diferentes .</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#the-lang-and-xml:lang-attributes", "lang")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, comportandose con <strong>xml:lang</strong>  y el algoritmo de determinación del lenguaje . También es un verdadero atributo global .</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/dirlang.html#h-8.1', 'lang')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Soportado en todos los elementos menos en {HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, y  {{HTMLElement("script")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores </h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/slot/index.html b/files/es/web/html/global_attributes/slot/index.html
new file mode 100644
index 0000000000..ca76d6fbbc
--- /dev/null
+++ b/files/es/web/html/global_attributes/slot/index.html
@@ -0,0 +1,47 @@
+---
+title: slot
+slug: Web/HTML/Global_attributes/slot
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/slot
+original_slug: Web/HTML/Atributos_Globales/slot
+---
+<div>{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</div>
+
+<p>El <a href="/en-US/docs/Web/HTML/Global_attributes">atributo global</a> <strong>slot</strong> asigna un espacio en un <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">shadow DOM</a> árbol shadow a un elemento: Un elemento con un atributo <code>slot</code> es asignado al espacio creado por el elemento {{HTMLElement("slot")}} cuyo valor de atributo {{htmlattrxref("name", "slot")}} coincide con el valor de ese atributo <code>slot</code>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#attr-slot", "slot attribute")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', "#dom-element-slot", "slot attribute")}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si le gustaría contribuir con estos datos, por favor clone el repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
+
+<p>{{Compat("html.global_attributes.slot")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>Todos los <a href="/en-US/docs/Web/HTML/Global_attributes">atributos globales</a>.</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/spellcheck/index.html b/files/es/web/html/global_attributes/spellcheck/index.html
new file mode 100644
index 0000000000..e6d42d6db1
--- /dev/null
+++ b/files/es/web/html/global_attributes/spellcheck/index.html
@@ -0,0 +1,219 @@
+---
+title: spellcheck
+slug: Web/HTML/Global_attributes/spellcheck
+tags:
+  - Atributos globales
+  - Experimental
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/spellcheck
+original_slug: Web/HTML/Atributos_Globales/spellcheck
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>spellcheck</strong> es un atributo enumerado que define si el elemento debe de ser verificado por errores de deletreado. Puede tener los siguientes valores :</p>
+
+<ul>
+ <li><code>true , </code>que indica que elemento debe de ser checado para errores de deletreado si es posible .</li>
+ <li><code>false </code>, que indica que el elemento no debe de ser checado para errores de deletreado .</li>
+</ul>
+
+<p>Si este atributo no está establecido , su valor por default es de tipo elemento y definido por el explorador . El valor por default puede der <em>heredado  ,  </em>lo que significa que el contenido del elemento será checado para errores de deletreado solo si el ancestro más cercano tiene un estado de <em>spellcheck  </em>con valor <code>true .</code></p>
+
+<p>Puedes consultar <a href="/es/docs/Control_de_la_corrección_ortográfica_en_formularios_HTML">este artículo</a> para ver un ejemplo comprensivo del uso de este atributo. <br>
+  </p>
+
+<p>Este es un atributo <em>enumerado </em>y no uno<em>Booleano </em>. Esto significa que el uso explícito de uno de los valores <code>true </code>o <code>false </code>es obligatorio y que una escritura como <code>&lt;label spellcheck&gt;Example Label&lt;/label&gt; </code>no está permitida . El uso correcto es <code>&lt;label spellcheck="true"&gt;Example Label&lt;/label&gt;</code>.</p>
+
+<p>Este atributo es meramente un indicio para el explorador : los exploradores no son obligados a tener disponibilidad para verificar los errores de deletreado , incluso si el atributo <strong>spellcheck</strong> es establecido como <code>true </code>y el explorador soporta verificación de deletreado .</p>
+
+<p>El valor por default de este atributo es dependiente del explorador y del elemento :</p>
+
+<table class="fullwidth-table" style="line-height: 1.5;">
+ <tbody>
+  <tr>
+   <th>Explorador</th>
+   <th>{{ HTMLElement("html") }}</th>
+   <th>{{ HTMLElement("textarea") }}</th>
+   <th>{{ HTMLElement("input") }}</th>
+   <th>others</th>
+   <th>Comment</th>
+  </tr>
+  <tr>
+   <td rowspan="3">Firefox</td>
+   <td><code>false</code></td>
+   <td><code>false</code></td>
+   <td><code>false</code></td>
+   <td><em>inherited</em></td>
+   <td>When <code>layout.spellcheckDefault</code> is <code>0</code></td>
+  </tr>
+  <tr>
+   <td><strong><code>false</code></strong></td>
+   <td><strong><code>true</code></strong></td>
+   <td><strong><em>inherited</em></strong></td>
+   <td><strong><em>inherited</em></strong></td>
+   <td><strong>When <code>layout.spellcheckDefault</code> is <code>1</code> (default value)</strong></td>
+  </tr>
+  <tr>
+   <td><code>false</code></td>
+   <td><code>true</code></td>
+   <td><code>true</code></td>
+   <td><em>inherited</em></td>
+   <td>When <code>layout.spellcheckDefault</code> is <code>2</code></td>
+  </tr>
+  <tr>
+   <td rowspan="3">Seamonkey</td>
+   <td><code>false</code></td>
+   <td><code>false</code></td>
+   <td><code>false</code></td>
+   <td><em>inherited</em></td>
+   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>0</code></span></td>
+  </tr>
+  <tr>
+   <td><strong><code>false</code></strong></td>
+   <td><strong><code>true</code></strong></td>
+   <td><strong><em>inherited</em></strong></td>
+   <td><strong><em>inherited</em></strong></td>
+   <td><strong>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;">1</span> (default value)</strong></td>
+  </tr>
+  <tr>
+   <td><code>false</code></td>
+   <td><code>true</code></td>
+   <td><code>true</code></td>
+   <td><em>inherited</em></td>
+   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>2</code></span></td>
+  </tr>
+  <tr>
+   <td rowspan="3">Camino</td>
+   <td><code>false</code></td>
+   <td><code>false</code></td>
+   <td><code>false</code></td>
+   <td><em>inherited</em></td>
+   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>0</code></span></td>
+  </tr>
+  <tr>
+   <td><code>false</code></td>
+   <td><code>true</code></td>
+   <td><em>inherited</em></td>
+   <td><em>inherited</em></td>
+   <td>When <code>layout.spellcheckDefault</code> is <span style="font-family: courier new;"><code>1</code></span></td>
+  </tr>
+  <tr>
+   <td><strong><code>false</code></strong></td>
+   <td><strong><code>true</code></strong></td>
+   <td><strong><code>true</code></strong></td>
+   <td><strong><em>inherited</em></strong></td>
+   <td><strong>When <span style="font-family: courier new;">layout.spellcheckDefault</span> is <span style="font-family: courier new;"><code>2</code> </span><strong>(default value)</strong></strong></td>
+  </tr>
+  <tr>
+   <td>Chrome</td>
+   <td><code>false</code></td>
+   <td><code>true</code></td>
+   <td>?</td>
+   <td><em>inherited</em></td>
+  </tr>
+  <tr>
+   <td>Internet Explorer</td>
+   <td><code>false</code></td>
+   <td><code>true</code></td>
+   <td>?</td>
+   <td><em>inherited</em></td>
+  </tr>
+  <tr>
+   <td>Opera</td>
+   <td><code>false</code></td>
+   <td><code>true</code></td>
+   <td>?</td>
+   <td><em>inherited</em></td>
+  </tr>
+  <tr>
+   <td>Safari</td>
+   <td><code>false</code></td>
+   <td><code>true</code></td>
+   <td>?</td>
+   <td><em>inherited</em></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Espeficicaciones">Espeficicaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Espeficifación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "interaction.html#spelling-and-grammar-checking", "spellcheck")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#spelling-and-grammar-checking", "spellcheck")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, declaración inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_exploradores">Compatibilidad con exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatNo() }}</td>
+   <td>{{ CompatUnknown}}</td>
+   <td>{{ CompatGeckoMobile("1.8.1") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">Atributos globales</a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/style/index.html b/files/es/web/html/global_attributes/style/index.html
new file mode 100644
index 0000000000..f173e731c1
--- /dev/null
+++ b/files/es/web/html/global_attributes/style/index.html
@@ -0,0 +1,112 @@
+---
+title: style
+slug: Web/HTML/Global_attributes/style
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/style
+original_slug: Web/HTML/Atributos_Globales/style
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>style</strong> contiene declaraciones de estilo  <a href="/es/docs/Web/CSS">CSS</a> a ser aplicados a un elemento . Notar que es recomandado para los estilos ser definidos en archivo o archivos separados . Este atributo y el elemento  {{ HTMLElement("style") }} tienen principalmente el propósito de permitir el estilizamiento rápido , por ejemplo para propósitos de pruebas .</p>
+
+<p><strong>Nota de uso : </strong>Este atributo no debe de ser usado para comunicar información semántica . Incluso si todo el estilo es removido , una página debería mantenerse semánticamente correcta . Típicamente no debe de ser usado para ocultar información irrelevante ; esto debe de hacerse usando el atributo <a href="/en-US/docs/Web/HTML/Global_attributes/style$translate?tolocale=es#attr-hidden">hidden</a> .</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#the-style-attribute", "style")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último  snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#the-style-attribute", "style")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin  cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#the-style-attribute", "style")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, es ahora un verdadero atributo global .</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'present/styles.html#h-14.2.2', 'style')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Soportado en todos los elementos menos en  {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, y {{HTMLElement("title")}}.</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName("CSS3 Style", "", "") }}</td>
+   <td>{{Spec2("CSS3 Style")}}</td>
+   <td>Define el contenido del atributo <strong>style </strong>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterísitica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales.</a></li>
+</ul>
diff --git a/files/es/web/html/global_attributes/tabindex/index.html b/files/es/web/html/global_attributes/tabindex/index.html
new file mode 100644
index 0000000000..cb7666d496
--- /dev/null
+++ b/files/es/web/html/global_attributes/tabindex/index.html
@@ -0,0 +1,119 @@
+---
+title: tabindex
+slug: Web/HTML/Global_attributes/tabindex
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/tabindex
+original_slug: Web/HTML/Atributos_Globales/tabindex
+---
+<p>{{HTMLSidebar("Global_attributes")}}</p>
+
+<p class="note">Nota: El valor máximo para tabindex no debe de exceder 32767 (<a href="https://www.w3.org/TR/html401/interact/forms.html#h-17.11.1">sección 17.11.1 del W3C</a>). Si no se especifica, el valor asignado por defecto es -1.</p>
+
+<p><a href="https://www.w3.org/TR/html401/interact/forms.html#h-17.11.1">El </a><a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>tabindex </strong>indica si su elemento puede ser enfocado, y si participa en la navegación secuencial del teclado (usualmente con la tecla <em>Tab</em>, de ahí el nombre). Acepta un entero como valor, con diferentes resultados que dependen de dicho valor:</p>
+
+<ul>
+ <li>un <em>valor negativo </em>(usualmente tabindex="-1")<em> </em>significa que el elemento debe ser enfocado, pero no debe de ser accesible a través de la navegación secuencial del teclado. Es útil para crear widgets accesibles con JavaScript.</li>
+ <li>tabindex="0" significa que el elemento debe ser enfocado y ser accesible a través de la navegación secuencial del teclado, pero su orden relativo es definido por convención de la plataforma.</li>
+ <li>un <em>valor positivo</em> significa que debe poder recoger el foco y alcanzable a través de la navegación secuencial del teclado; su orden relativo es definido por el valor del atributo: la secuencia sigue el aumento del número de <strong>tabindex</strong>. Si varios elementos comparten el mismo tabindex, su orden relativo sigue la posición relativa en el documento.</li>
+ <li>Un elemento con valor 0, un valor inválido o sin valor de <strong>tabindex</strong>, debe de ser posicionado después de elementos con un <strong>tabindex </strong>postivo en el orden de navegación secuencial del teclado.</li>
+</ul>
+
+<p>Puede consultar <a href="/en/Focus_management_in_HTML">este artículo </a>para ver una explicación compresiva de la administración de la recepción de foco.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "editing.html#attr-tabindex", "tabindex")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "editing.html#attr-tabindex", "tabindex")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "editing.html#attr-tabindex", "tabindex")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, el atributo es ahora soportado en todos los elementos  (atributos globales).</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/forms.html#adef-tabindex', 'tabindex')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Solo soportado en {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}}, y {{HTMLElement("textarea")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+
+
+<p><span style="font-size: 30.002px; letter-spacing: -1px; line-height: 30.002px;"><strong>Ver también </strong></span></p>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li>
+ <li>{{domxref("HTMLElement.tabindex")}} que refleja este atributo .</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/title/index.html b/files/es/web/html/global_attributes/title/index.html
new file mode 100644
index 0000000000..3c1a303ae5
--- /dev/null
+++ b/files/es/web/html/global_attributes/title/index.html
@@ -0,0 +1,139 @@
+---
+title: title
+slug: Web/HTML/Global_attributes/title
+tags:
+  - Atributos globales
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/title
+original_slug: Web/HTML/Atributos_Globales/title
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global </a><strong>title </strong>contiene un texto representado información relacionada al elemento al cual pertenece . Tal información puede típicamente , pero no necesariamente , ser presentada al usuario como un tip . Aquí hay algunos usos típicos para este atributo :</p>
+
+<ul>
+ <li>Vínculo : el título o la descripción del documento vinculado </li>
+ <li>Elemento mediático como una imagen : una descripción o créditos asociados</li>
+ <li>Párrafo : una nota de pié de página o comentario acerca de este </li>
+ <li>Cita : alguna información sobre el autor y otros datos .</li>
+</ul>
+
+<p>Si este atributo es omitido  , significa que el título del ancestro más cercano de este elemento es todavía relevante para este (puede usarse legítimamente como un tip para ese elemento ) . Si el atributo es establecido como la <em>cadena vacía </em>, significa explícitamente que el título de su ancestro más  cercano no es relevante para este elemento ( y no debería de usarse en el tip para ese elemento )</p>
+
+<p>Semánticas adicionales se adjuntan a los atributos de <strong>title </strong>de los elementos {{ HTMLElement("link") }}, {{ HTMLElement("abbr") }}, {{ HTMLElement("input") }} y {{ HTMLElement("menuitem") }} </p>
+
+<p>El atributo <strong>title </strong>puede contener varias líneas . Cada  <code>U+000A LINE FEED</code> (<code>LF</code>) insertada representa una línea nueva . Se debe tener precaución ya que esto significa que :</p>
+
+<pre class="brush: html">&lt;p&gt;Líneas nuevas en title deben de tomarse en cuenta , como esta &lt;abbr title="Este es un título multilínea"&gt;ejemplo &lt;/abbr&gt;.&lt;/p&gt;
+</pre>
+
+<p>define un título de dos líneas .</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "elements.html#the-title-attribute", "title")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#the-title-attribute", "title")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, sin cambio desde {{SpecName('HTML5 W3C')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', "dom.html#the-title-attribute", "title")}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Snapshot of {{SpecName('HTML WHATWG')}}. Desde {{SpecName("HTML4.01")}}, es ahora  un verdadero atributo global.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/global.html#adef-title', 'title')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td>Soportado en todos los elementos pero no en {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, y {{HTMLElement("title")}}.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>Soporte multi línea</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop(12)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+  <tr>
+   <td>Soporte multi línea</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile(12)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales</a> .</li>
+ <li>{{domxref("HTMLElement.title")}} que refleja a este atributo .</li>
+</ul>
diff --git a/files/es/web/html/global_attributes/translate/index.html b/files/es/web/html/global_attributes/translate/index.html
new file mode 100644
index 0000000000..999cd6bf66
--- /dev/null
+++ b/files/es/web/html/global_attributes/translate/index.html
@@ -0,0 +1,104 @@
+---
+title: translate
+slug: Web/HTML/Global_attributes/translate
+tags:
+  - Atributos globales
+  - Experimental
+  - HTML
+  - Referencia
+translation_of: Web/HTML/Global_attributes/translate
+original_slug: Web/HTML/Atributos_Globales/translate
+---
+<p class="note">{{HTMLSidebar("Global_attributes")}}{{SeeCompatTable}}</p>
+
+<p>El <a href="/es/docs/Web/HTML/Atributos_Globales">atributo global</a> <strong>translate </strong> es un atributo enumerado que es usado para especificar si los valores del atributo de un elemento y los valores de sus nodos hijos de <a href="https://html.spec.whatwg.org/multipage/infrastructure.html#text">Texto</a> serán traducidos cuando la página es localizada , o si se debe de dejarlos sin cambio . Puede tener los siguientes valores : </p>
+
+<ul>
+ <li>Cadena vacía y "yes" , que indica que el elemento debe de ser traducido cuando la página es localizada .</li>
+ <li>"no", que indica que el elemento no debe de ser traducido .</li>
+</ul>
+
+<p> </p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', "dom.html#attr-translate", "translate")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Sin cambio desde el último snapshot, {{SpecName('HTML5.1')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5.1', "dom.html#the-translate-attribute", "translate")}}</td>
+   <td>{{Spec2('HTML5.1')}}</td>
+   <td>Snapshot de {{SpecName('HTML WHATWG')}}, definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_exploradores">Compatibilidad en exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+   <td>{{ CompatNo }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Atributos_Globales">atributos globales  </a></li>
+ <li>La propiedad  {{domxref("HTMLElement.translate")}} que refleja a este atributo </li>
+</ul>
diff --git a/files/es/web/html/global_attributes/x-ms-acceleratorkey/index.html b/files/es/web/html/global_attributes/x-ms-acceleratorkey/index.html
new file mode 100644
index 0000000000..f919dc13fb
--- /dev/null
+++ b/files/es/web/html/global_attributes/x-ms-acceleratorkey/index.html
@@ -0,0 +1,33 @@
+---
+title: x-ms-acceleratorkey
+slug: Web/HTML/Global_attributes/x-ms-acceleratorkey
+translation_of: Web/HTML/Global_attributes/x-ms-acceleratorkey
+original_slug: Web/HTML/Atributos_Globales/x-ms-acceleratorkey
+---
+<div>{{HTMLSidebar("Global_attributes")}}{{Non-standard_Header}}</div>
+
+<p> </p>
+
+<p><font><font>La </font></font><code><strong>x-ms-acceleratorkey</strong></code><font><font>propiedad proporciona una forma de declarar que una tecla de aceleración se ha asignado a un elemento.</font></font></p>
+
+<p><font><font>Esta propiedad propietaria es específica de Internet Explorer y Microsoft Edge.</font></font></p>
+
+<p><font><font>La </font></font><code>x-ms-acceleratorkey</code><font><font>propiedad le permite exponer una notificación en el árbol de accesibilidad a los lectores de pantalla y otras tecnologías de asistencia de que existe una clave de aceleración. </font><font>Este atributo no proporciona el comportamiento de la clave del acelerador. </font><font>Debe proporcionar controladores de eventos de teclado, como por ejemplo </font></font><code>onkeypress</code><font><font>, </font></font><code>onkeydown</code><font><font>o </font></font><code>onkeyup</code><font><font>, para procesar las teclas de aceleración en el documento.</font></font></p>
+
+<p> </p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: html">&lt;button x-ms-acceleratorkey="string"&gt;...&lt;/button&gt;</pre>
+
+<h2 id="Valor">Valor</h2>
+
+<p>Tipo: <strong>String</strong></p>
+
+<p>Nombre de la tecla de aceleración, por ejemplo: <code><em>Ctrl+B</em> or <em>Ctrl+S</em></code>.</p>
+
+<h2 id="See_Also" name="See_Also">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Microsoft_API_extensions">Microsoft API extensions </a></li>
+</ul>
diff --git a/files/es/web/html/imagen_con_cors_habilitado/index.html b/files/es/web/html/imagen_con_cors_habilitado/index.html
deleted file mode 100644
index 4de4e94617..0000000000
--- a/files/es/web/html/imagen_con_cors_habilitado/index.html
+++ /dev/null
@@ -1,115 +0,0 @@
----
-title: Imagen con CORS habilitado
-slug: Web/HTML/Imagen_con_CORS_habilitado
-tags:
-  - Avanzado
-  - CORS
-  - Canvas
-  - HTML
-  - Referencia
-  - Seguridad
-translation_of: Web/HTML/CORS_enabled_image
----
-<p><span class="seoSummary">La especificación HTML introduce un atributo {{ htmlattrxref("crossorigin", "img") }} para imágenes que, en conjunto con el encabezado  {{Glossary("CORS")}} apropiado, permite definir imágenes con el elemento {{ HTMLElement("img") }} que se carguen de orígenes externos dentro de un lienzo (<em>canvas</em>) como si estas fuesen cargadas del origen actual.</span></p>
-
-<p>Vea el artículo <a href="/en/HTML/CORS_settings_attributes" title="Atributos de configuración CORS">"Atributos de configuración CORS"</a> para mas detalles de como el atributo "crossorigin" es usado.</p>
-
-<h2 id="¿Qué_es_un_tainted_canvas">¿Qué es un "tainted" canvas? </h2>
-
-<p>Aunque puedes usar imágenes sin la aprobación del CORS en el elemento canvas, hacerlo puede "manchar" el canvas. Por ejemplo, no puedes usar los métodos canvas <code>toBlob()</code>, <code>toDataURL()</code>, or <code>getImageData(). Si los usas se lanzará un mensaje de seguridad.</code></p>
-
-<p>Esto protegerá a los usuarios de tener información privada usada por medio de imágenes que cogen información desde otras web sin permiso.</p>
-
-<h2 id="Ejemplo_Almacenando_una_imagen_desde_un_origen_externo">Ejemplo: Almacenando una imagen desde un origen externo</h2>
-
-<p>Debes de tener un servidor de hosting de imágenes con el apropiado <code>Access-Control-Allow-Origin</code> header. Añadiendo el atributo crossOrigin crea un request header.</p>
-
-<p>Puedes utilizar este fragemto de la configuración del servidor Apache del Boilerplate HTML5 para responder apropiadamente con este encabezado de respuesta.</p>
-
-<pre class="brush:xml">&lt;IfModule mod_setenvif.c&gt;
-    &lt;IfModule mod_headers.c&gt;
-        <span class="nt">&lt;FilesMatch</span> <span class="s">"\.(cur|gif|ico|jpe?g|png|svgz?|webp)$"</span><span class="nt">&gt;</span>
-            SetEnvIf Origin ":" IS_CORS
-            Header set Access-Control-Allow-Origin "*" env=IS_CORS
-        &lt;/FilesMatch&gt;
-    &lt;/IfModule&gt;
-&lt;/IfModule&gt;</pre>
-
-<p>Dado que está todo ordenado, serás capás de guardar esas imagenes en el almacenamiento del DOM, así como si fueran solicitados de tu dominio.</p>
-
-<pre class="brush: js">var img = new Image,
-    canvas = document.createElement("canvas"),
-    ctx = canvas.getContext("2d"),
-    src = "http://example.com/image"; // insert image url here
-
-img.crossOrigin = "Anonymous";
-
-img.onload = function() {
-    canvas.width = img.width;
-    canvas.height = img.height;
-    ctx.drawImage( img, 0, 0 );
-    localStorage.setItem( "savedImageData", canvas.toDataURL("image/png") );
-}
-img.src = src;
-// make sure the load event fires for cached images too
-if ( img.complete || img.complete === undefined ) {
-    img.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";
-    img.src = src;
-}</pre>
-
-<h2 id="Compatibilidad_con_los_navegadores">Compatibilidad con los navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>13</td>
-   <td>8</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="También_puede_ver">También puede ver</h2>
-
-<ul>
- <li><a class="external" href="http://blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html">Using Cross-domain images in WebGL and Chrome 13</a></li>
- <li><a class="external" href="http://whatwg.org/html#attr-img-crossorigin">HTML Specification - the <code>crossorigin</code> attribute</a></li>
-</ul>
diff --git a/files/es/web/html/index/index.html b/files/es/web/html/index/index.html
new file mode 100644
index 0000000000..388b7b4d96
--- /dev/null
+++ b/files/es/web/html/index/index.html
@@ -0,0 +1,9 @@
+---
+title: Índice de la documentación HTML
+slug: Web/HTML/Index
+tags:
+  - HTML
+translation_of: Web/HTML/Index
+original_slug: Web/HTML/Índice
+---
+<p>{{Index("/es/docs/Web/HTML")}}</p>
diff --git a/files/es/web/html/inline_elements/index.html b/files/es/web/html/inline_elements/index.html
new file mode 100644
index 0000000000..374470b308
--- /dev/null
+++ b/files/es/web/html/inline_elements/index.html
@@ -0,0 +1,53 @@
+---
+title: Elementos en línea
+slug: Web/HTML/Inline_elements
+tags:
+  - Guía
+  - HTML
+  - HTML5
+  - Principiante
+  - Web
+  - desarrollo
+translation_of: Web/HTML/Inline_elements
+original_slug: Web/HTML/Elementos_en_línea
+---
+<p><span class="seoSummary">Los elementos en HTML (lenguaje de marcas de hipertexto - <strong>Hypertext Markup Language</strong>) usualmente son elementos "en línea" o <a href="/es/docs/Web/HTML/Block-level_elements" title="/es/docs/Web/HTML/Block-level_elements">elementos "en bloque"</a>. Un elemento en línea ocupa sólo el espacio delimitado por las etiquetas que definen el elemento en línea. El siguiente ejemplo demuestra la influencia de los elementos en línea:</span></p>
+
+<h2 id="Inline_example" name="Inline_example">Ejemplo en línea</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;p&gt;Este &lt;span&gt;span&lt;/span&gt; es un elemento en línea; este fondo se ha coloreado para mostrar el principio y fin de la influencia del elemento en línea&lt;/p&gt;</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush: css">span { background-color: #8ABB55; }
+</pre>
+
+<p>{{ EmbedLiveSample('Inline_example') }}</p>
+
+<h2 id="Elmentos_en_línea_vs._en_bloque">Elmentos en línea vs. en bloque</h2>
+
+<dl>
+ <dt>Formateo</dt>
+ <dd>De forma predeterminada, los elementos en línea no comienzan con la nueva línea.</dd>
+ <dt>Modelo de contenido</dt>
+ <dd>En general, los elementos en línea pueden contener únicamente los datos y otros elementos en línea.</dd>
+</dl>
+
+<h2 id="Elementos">Elementos</h2>
+
+<p>Los siguientes elementos son "en línea":</p>
+
+<ul id="inline-elements">
+ <li><a href="/es/docs/Web/HTML/Elemento/b" title="/es/docs/Web/HTML/Elemento/b">b</a>, <a href="/es/docs/Web/HTML/Elemento/big" title="/es/docs/Web/HTML/Elemento/big">big</a>, <a href="/es/docs/Web/HTML/Elemento/i" title="/es/docs/Web/HTML/Elemento/i">i</a>, <a href="/es/docs/Web/HTML/Elemento/small" title="/es/docs/Web/HTML/Elemento/small">small</a>, <a href="/es/docs/Web/HTML/Elemento/tt" title="/es/docs/Web/HTML/Elemento/tt">tt</a></li>
+ <li><a href="/es/docs/Web/HTML/Elemento/abbr" title="/es/docs/Web/HTML/Elemento/abbr">abbr</a>, <a href="/es/docs/Web/HTML/Elemento/acronym" title="/es/docs/Web/HTML/Elemento/acronym">acronym</a>, <a href="/es/docs/Web/HTML/Elemento/cite" title="/es/docs/Web/HTML/Elemento/cite">cite</a>, <a href="/es/docs/Web/HTML/Elemento/code" title="/es/docs/Web/HTML/Elemento/code">code</a>, <a href="/es/docs/Web/HTML/Elemento/dfn" title="/es/docs/Web/HTML/Elemento/dfn">dfn</a>, <a href="/es/docs/Web/HTML/Elemento/em" title="/es/docs/Web/HTML/Elemento/em">em</a>, <a href="/es/docs/Web/HTML/Elemento/kbd" title="/es/docs/Web/HTML/Elemento/kbd">kbd</a>, <a href="/es/docs/Web/HTML/Elemento/strong" title="/es/docs/Web/HTML/Elemento/strong">strong</a>, <a href="/es/docs/Web/HTML/Elemento/samp" title="/es/docs/Web/HTML/Elemento/samp">samp</a>, <a href="/es/docs/Web/HTML/Elemento/time" title="/es/docs/Web/HTML/Elemento/time">time</a>, <a href="/es/docs/Web/HTML/Elemento/var" title="/es/docs/Web/HTML/Elemento/var">var</a></li>
+ <li><a href="/es/docs/Web/HTML/Elemento/a" title="/es/docs/Web/HTML/Elemento/a">a</a>, <a href="/es/docs/Web/HTML/Elemento/bdo" title="/es/docs/Web/HTML/Elemento/bdo">bdo</a>, <a href="/es/docs/Web/HTML/Elemento/br" title="/es/docs/Web/HTML/Elemento/br">br</a>, <a href="/es/docs/Web/HTML/Elemento/Img" title="/es/docs/Web/HTML/Elemento/Img">img</a>, <a href="/es/docs/Web/HTML/Elemento/map" title="/es/docs/Web/HTML/Elemento/map">map</a>, <a href="/es/docs/Web/HTML/Elemento/object" title="/es/docs/Web/HTML/Elemento/object">object</a>, <a href="/es/docs/Web/HTML/Elemento/q" title="/es/docs/Web/HTML/Elemento/q">q</a>, <a href="/es/docs/Web/HTML/Elemento/Script" title="/es/docs/Web/HTML/Elemento/Script">script</a>, <a href="/es/docs/Web/HTML/Elemento/span" title="/es/docs/Web/HTML/Elemento/span">span</a>, <a href="/es/docs/Web/HTML/Elemento/sub" title="/es/docs/Web/HTML/Elemento/sub">sub</a>, <a href="/es/docs/Web/HTML/Elemento/sup" title="/es/docs/Web/HTML/Elemento/sup">sup</a></li>
+ <li><a href="/es/docs/Web/HTML/Elemento/button" title="/es/docs/Web/HTML/Elemento/button">button</a>, <a href="/es/docs/Web/HTML/Elemento/Input" title="/es/docs/Web/HTML/Elemento/Input">input</a>, <a href="/es/docs/Web/HTML/Elemento/label" title="/es/docs/Web/HTML/Elemento/label">label</a>, <a href="/es/docs/Web/HTML/Elemento/select" title="/es/docs/Web/HTML/Elemento/select">select</a>, <a href="/es/docs/Web/HTML/Elemento/textarea" title="/es/docs/Web/HTML/Elemento/textarea">textarea</a></li>
+</ul>
+
+<h3 id="Ver_también" name="Ver_también">Ver también</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/HTML/Block-level_elements" title="/es/docs/Web/HTML/Block-level_elements">Elementos en bloque</a></li>
+</ul>
diff --git a/files/es/web/html/la_importancia_de_comentar_correctamente/index.html b/files/es/web/html/la_importancia_de_comentar_correctamente/index.html
deleted file mode 100644
index f110fc9851..0000000000
--- a/files/es/web/html/la_importancia_de_comentar_correctamente/index.html
+++ /dev/null
@@ -1,66 +0,0 @@
----
-title: La importancia de comentar correctamente
-slug: Web/HTML/La_importancia_de_comentar_correctamente
-tags:
-  - HTML
-  - Todas_las_Categorías
-  - XHTML
-  - XML
-translation_of: Learn/HTML/Introduction_to_HTML/Getting_started#HTML_comments
-translation_of_original: Web/Guide/HTML/The_Importance_of_Correct_HTML_Commenting
----
-<p> </p>
-<p><br>
- Cuando escribimos HTML en <a class="external" href="http://www.mozilla.org/docs/web-developer/quirks/doctypes.html">modo estándar</a>, los comentarios mal formados pueden romper las páginas, causando que los contenidos del documento sean parcial o totalmente comentados. Al escribir XHTML o XML, los comentarios incorrectos darán lugar a que sus documentos no puedan ser mostrados.</p>
-<h3 id="HTML_4.01" name="HTML_4.01">HTML 4.01</h3>
-<p>
- <i>
-  De la <a class="external" href="http://html.conclase.net/w3c/html401-es/intro/sgmltut.html#h-3.2.4">Recomendación del W3C HTML 4.01 Sección 3.2.4 - Comentarios</a>:</i>
-</p>
-<blockquote>
- No se permite espacio en blanco entre el delimitador de apertura de declaración de etiqueta ("&lt;!") y el delimitador de apertura de comentario ("--"), pero sí se permite entre el delimitador de cierre de comentario ("--" y el delimitador de cierre de declaración de etiqueta ("&gt;"). Un error común es incluir una cadena de guiones ("---") dentro de un comentario. Los autores deberían evitar *poner dos o más guiones adyacentes dentro de un comentario.</blockquote>
-<h4 id="Ejemplos" name="Ejemplos">Ejemplos</h4>
-<p>Los siguientes son comentarios válidos en HTML.</p>
-<pre class="eval">&lt;!-- comentario html válido --&gt;
-&lt;!-- comentario html válido -- &gt;
-</pre>
-<p>El siguiente no es un comentario válido en HTML.</p>
-<pre class="eval">&lt;!-- comentario html -- no válido --&gt;
-</pre>
-<h3 id="XML" name="XML">XML</h3>
-<p>
- <i>
-  De la <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xml/xml1/index.html#sec-comments">Recomendación del W3C XML 1.0 Sección 2.5 - Comentarios</a>:</i>
-</p>
-<blockquote>
- {{ mediawiki.external('Definición: Los comentarios pueden aparecer en cualquier lugar de un documento fuera de otras marcas; Adicionalmente pueden aparecer en lugares permitidos por la gramática. No son parte de los datos de caracter de un documento; un procesador de XML puede, pero no tiene que, hacer posible que la aplicación recupere el texto de comentarios.') }} Por compatibilidad, la cadena "--" (doble guión) no debe ocurrir dentro de comentarios.
- <pre>[15] Comment ::= '&lt;!--' ((Char - '-') | ('-' (Char - '-')))* '--&gt;'
-</pre>
-</blockquote>
-<p>Según lo descrito en la gramática de XML sobre comentarios, un comentario tiene la siguiente forma:</p>
-<pre class="eval">&lt;!-- cualquier letra o signo, menos guiones seguidos --&gt;
-</pre>
-<h4 id="Ejemplos_2" name="Ejemplos_2">Ejemplos</h4>
-<p>El siguiente es un comentario válido en XML y XHTML.</p>
-<pre class="eval">&lt;!-- comentario xml/xhtml válido --&gt;
-</pre>
-<p>Los siguientes son comentarios no válidos en XML y XHTML.</p>
-<pre class="eval">&lt;!-- comentario xml -- no válido --&gt;
-&lt;!-- comentario xml no válido ---&gt;
-&lt;!-- comentario xml no válido -- &gt;
-</pre>
-<h3 id="Otras_lecturas" name="Otras_lecturas">Otras lecturas</h3>
-<ul>
- <li><a class="external" href="http://html.conclase.net/w3c/html401-es/intro/sgmltut.html#h-3.2.4">Recomendación HTML 4.01: 3.2.4 - Comentarios</a></li>
- <li><a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xml/xml1/index.html#sec-comments">Recomendación XML: 2.5 - Comentarios</a></li>
- <li><a class="external" href="http://bugzilla.mozilla.org/show_bug.cgi?id=144432">Bugzilla bug 144432</a></li>
- <li><a class="external" href="http://bugzilla.mozilla.org/show_bug.cgi?id=102127">Bugzilla bug 102127</a></li>
-</ul>
-<div class="originaldocinfo">
- <h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3>
- <ul>
-  <li>Last Updated Date: May 19th, 2003</li>
-  <li>Copyright © 2001-2003 Netscape. All rights reserved.</li>
- </ul>
-</div>
-<p> </p>
diff --git a/files/es/web/html/link_types/index.html b/files/es/web/html/link_types/index.html
new file mode 100644
index 0000000000..ee759cf560
--- /dev/null
+++ b/files/es/web/html/link_types/index.html
@@ -0,0 +1,382 @@
+---
+title: Tipos de enlaces
+slug: Web/HTML/Link_types
+translation_of: Web/HTML/Link_types
+original_slug: Web/HTML/Tipos_de_enlaces
+---
+<p>{{HTMLSidebar}}</p>
+
+<p><span class="seoSummary">En HTML, los siguientes tipos de enlaces indican la relación entre dos documentos, de los cuales uno enlaza al otro usando un elemento {{HTMLElement("a")}} o bien {{HTMLElement("area")}}, o bien {{HTMLElement("link")}}.</span></p>
+
+<table class="standard-table">
+ <caption>Lista de tipos de link y su significado en HTML</caption>
+ <thead>
+  <tr>
+   <th scope="col">Tipo de Link</th>
+   <th scope="col">Descripción</th>
+   <th scope="col" style="width: 12em;">Permitido en estos elementos</th>
+   <th scope="col">No permitido en estos elementos</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>alternate</code></td>
+   <td>
+    <ul>
+     <li>Si el elemento es {{HTMLElement("link")}} y el atributo  {{htmlattrxref("rel", "link")}} tambien contiene el tipo <code>stylesheet</code>, el enlace define una <a href="/en-US/docs/Alternative_style_sheets">hoja de estilo alternativa</a>; en ese caso el atributo {{htmlattrxref("title", "link")}} deberá estar presente y no ser una cadena vacia.</li>
+     <li>Si el atributo {{htmlattrxref("type","link")}} es puesto a <code>application/rss+xml</code> o <code>application/atom+xml</code>, el enlace define un <a href="/en-US/docs/RSS/Getting_Started/Syndicating">feed de distribución</a>. El primero de ellos definido en la pagina es el tomado por default.</li>
+     <li>De otra forma, el enlace define una pagina alternativa, de uno de los siguientes tipos:
+      <ul>
+       <li>para otros medios, como un dispositivo portatil (si el atributo {{htmlattrxref("media","link")}} esta indicado)</li>
+       <li>en otro lenguaje (si el atributo {{htmlattrxref("hreflang","link")}} esta indicado),</li>
+       <li>en otro formato, como un PDF (si el atributo {{htmlattrxref("type","link")}} esta indicado)</li>
+       <li>una combinacion de los anteriores.</li>
+      </ul>
+     </li>
+    </ul>
+   </td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None</em>.</td>
+  </tr>
+  <tr>
+   <td><code>archives</code></td>
+   <td>Define un hipervínculo a un documento que contiene un enlace de archivo a este. Por ejemplo, la entrada de un blog podria enlazar a una página de indice mensual de esta forma.<br>
+    <br>
+    <strong>Nota:</strong> Aunque se reconoce, el singular <code>archive</code> es incorrecto y debe ser evitado.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>author</code></td>
+   <td>Define un hipervinculo a una página describiendo el autor o proporcionando una forma de contactar al autor.<br>
+    <br>
+    <strong>Nota:</strong> Este puede ser un hipervinculo <code>mailto:</code>, pero esto no es recomendable en paginas públicas por que robots cosechadores podrian rápidamente llevar una gran cantidad de span a esa dirección. En ese caso, es mejor mandarlos a una página con un formulario de contacto.<br>
+    <br>
+    Aunque reconocido, el atributo {{htmlattrxref("rev", "link")}} en elementos {{HTMLElement("a")}}, {{HTMLElement("area")}} o {{HTMLElement("link")}} con un enlace de tipo <code>made</code> es incorrecto y debiera ser reemplazado por el atributo {{htmlattrxref("rel", "link")}} con este tipo de enlace.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>bookmark</code></td>
+   <td>Indica que el hipervínculo es un <a href="/en-US/docs/Permalink">permalink</a> al ancestro más cercano del elemento {{HTMLElement("article")}}. Si no hay ninguno, entonces es un permalink para la <a href="/en-US/docs/Sections_and_Outlines_of_an_HTML5_document">sección</a> con la que el elemento está más estrechamente asociado.<br>
+    <br>
+    Esto permite crear marcadores a un artículo en particular dentro de una página con múltiples artículos, como por ejemplo una página con un resumen mensual de un blog, o un agregador de blog.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+   <td>{{HTMLElement("link")}}</td>
+  </tr>
+  <tr>
+   <td><code>external</code></td>
+   <td>Indica que el hipervínculo llevará a una fuente externa al sitio en el que se encuentra la página actual; o lo que es lo mismo, seguir el enlace hará que el usuario abandone el sitio.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+   <td>{{HTMLElement("link")}}</td>
+  </tr>
+  <tr>
+   <td><code>first</code></td>
+   <td>
+    <p>Indica que el hipervínculo conduce al primer recurso de la <em>secuencia</em> en la que se encuentra la página actual.<br>
+      </p>
+
+    <p><strong>Nota:</strong> Otros tipos de enlaces relacionados con los recursos en secuencia son <code>last</code>, <code>prev</code>, <code>next</code>.</p>
+
+    <p>Aunque parezca evidente, los sinónimos <code>being</code> y <code>start</code> son incorrectos y deben evitarse.</p>
+   </td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>help</code><br>
+    {{HTMLVersionInline("5")}}</td>
+   <td>
+    <ul>
+     <li>If the element is {{HTMLElement("a")}} or {{HTMLElement("area")}}, it indicates that the hyperlink leads to a resource giving further help about the parent of the element, and its descendants.</li>
+     <li>If the element is {{HTMLElement("link")}} it indicates that the hyperlink leads to a resource giving further help about the page as a whole.</li>
+    </ul>
+   </td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>icon</code></td>
+   <td>Defines a resource for representing the page in the user interface, usually an icon (auditory or visual).<br>
+    <br>
+    The {{htmlattrxref("media","link")}}, {{htmlattrxref("type","link")}} and {{htmlattrxref("sizes","link")}} attributes allow the browser to select the most appropriate icon for its context. If several resources match, the browser will select the last one declared, in tree order. As these attributes are merely hints, and the resources may be inappropriate upon further inspection, the browser will then select another one, if appropriate.<br>
+    <br>
+    <strong>Note:</strong> Apple's iOS does not use this link type, nor the {{htmlattrxref("sizes","link")}} attribute, like others mobile browsers do, to select a webpage icon for Web Clip or a start-up placeholder. Instead it uses the non-standard <a href="http://edr.euro.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW4"><code>apple-touch-icon</code></a> and <a href="http://edr.euro.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW6"><code>apple-touch-startup-image</code></a> respectively.<br>
+    <br>
+    The <code>shortcut</code> link type is often seen before <code>icon</code>, but this link type is non-conforming, ignored and <strong>web authors must not use it anymore</strong>.</td>
+   <td>{{HTMLElement("link")}}</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+  </tr>
+  <tr>
+   <td><code>index</code></td>
+   <td>Indicates that the page is part of a <em>hierarchical</em> structure and that the hyperlink leads to the top level resource of that structure.<br>
+    <br>
+    If one or several <code>up</code> link types are also present, the number of these <code>up</code> indicates the depth of the current page in the hierarchy.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>last</code></td>
+   <td>Indicates that the hyperlink leads to the <em>last</em> resource of the <em>sequence</em> the current page is in.<br>
+    <br>
+    <strong>Note:</strong> Other link types related to linking resources in the same sequence are <code>first</code>, <code>prev</code>, <code>next</code>.<br>
+    <br>
+    Although recognized, the synomyn <code>end</code> is incorrect and must be avoided.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>license</code></td>
+   <td>Indicates that the hyperlink leads to a document describing the licensing information. If not inside the {{HTMLElement("head")}} element, the standard doesn't distinguish between a hyperlink applying to a specific part of the document or to the document as a whole. Only the data on the page can indicate this.<br>
+    <br>
+    <strong>Note: </strong>Although recognized, the synonym <code>copyright</code> is incorrect and must be avoided.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>next</code></td>
+   <td>Indicates that the hyperlink leads to the <em>next</em> resource of the <em>sequence</em> the current page is in.<br>
+    <br>
+    <strong>Note:</strong> Other link types related to linking resources in the same sequence are <code>first</code>, <code>prev</code>, <code>last</code>.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>nofollow</code></td>
+   <td>Indica que el documento enlazado no cuenta con el aval o aprobación del autor de este documento, por ejemplo si no tiene control sobre el mismo, si es un mal ejemplo o si hay una relación comercial entre los dos (un enlace de pago). Este enlace puede ser usado por algunos motores de búsqueda que usan técnicas de clasificación de popularidad.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+   <td>{{HTMLElement("link")}}</td>
+  </tr>
+  <tr>
+   <td><code>noreferrer</code></td>
+   <td>
+    <p>Prevents the browser, when navigating to another page, to send this page name, or any other value, as referrer via the <code>Referer:</code> HTTP header.<br>
+     (In Firefox, before Firefox 37, this worked only in links found in pages. Links clicked in the UI, like "Open in a new tab" via the contextual menu, doesn't abide for this value)</p>
+   </td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+   <td>{{HTMLElement("link")}}</td>
+  </tr>
+  <tr>
+   <td><code>pingback</code></td>
+   <td>Defines an external resource URI to call if one make a comment or a citation about the webpage. The protocol used to make such a call is defined in the <a href="http://www.hixie.ch/specs/pingback/pingback">Pingback 1.0</a> specification.<br>
+    <br>
+    <strong>Note:</strong> if the <code>X-Pingback:</code> HTTP header is also present, this header has precedence over the {{HTMLElement("link")}} element with this link type</td>
+   <td>{{HTMLElement("link")}}</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+  </tr>
+  <tr>
+   <td><code>preconnect</code> {{experimental_inline}}</td>
+   <td>Hints the browser to open in advance the connection to the linked web site, without disclosing any private information.</td>
+   <td>{{HTMLElement("link")}}</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+  </tr>
+  <tr>
+   <td><code>prefetch</code></td>
+   <td>Hints the browser to fetch in advance the linked resource, as it will likely be requested by the user.<br>
+    <br>
+    <strong>Note:</strong> the <a href="/en-US/docs/Link_prefetching_FAQ">Link Prefetch FAQ</a> has details on which links can be prefetched and on alternative methods.</td>
+   <td>{{HTMLElement("a")}} {{unimplemented_inline}},<br>
+    {{HTMLElement("area")}} {{unimplemented_inline}},<br>
+    {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>preload</code></td>
+   <td>Tells the browser to download a resource because this resource will be needed later during the current navigation.</td>
+   <td>{{HTMLElement("link")}}</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+  </tr>
+  <tr>
+   <td><code>prerender</code> {{experimental_inline}}</td>
+   <td>Comunica al navegador que carge en segundo plano el recurso suministrado (Pagina Web).</td>
+   <td>{{HTMLElement("link")}}</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+  </tr>
+  <tr>
+   <td><code>prev</code></td>
+   <td>Indicates that the hyperlink leads to the <em>preceding</em> resource of the <em>sequence</em> the current page is in.<br>
+    <br>
+    <strong>Note:</strong> other link types related to linking resources in the same sequence are <code>first</code>, <code>last</code>, <code>next</code>.<br>
+    <br>
+    Although recognized, the synomyn <code>previous</code> is incorrect and must be avoided.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>search</code></td>
+   <td>Indicates that the hyperlink reference a document whose interface is specially designing for searching in this document, or site, and its resources.<br>
+    <br>
+    If the {{htmlattrxref("type","link")}} attribute is set to <code>application/opensearchdescription+xml </code>the resource is an <a href="/en-US/docs/Creating_OpenSearch_plugins_for_Firefox">OpenSearch plugin</a> that can be easily added to the interface of some browsers like Firefox or Internet Explorer.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>stylesheet</code></td>
+   <td>Defines an external resource to be used as a stylesheet. If the <code>type</code> is not set, the browser should assume it is a <code>text/css</code> stylesheet until further inspection.<br>
+    <br>
+    If used in combination with the <code>alternate</code> keyword, it defines an <a href="/en-US/docs/Alternative_style_sheets">alternative style sheet</a>; in that case the {{htmlattrxref("title", "link")}} attribute must be present and not be the empty string.</td>
+   <td>{{HTMLElement("link")}}</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
+  </tr>
+  <tr>
+   <td><code>sidebar</code></td>
+   <td>Indicates that the hyperlink leads to a resource that would be better suited for a secondary browsing context, like a <em>sidebar</em>. Browsers, that don't have such a context will ignore this keyword.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>tag</code></td>
+   <td>Indicates that the hyperlink refers to a document describing a <em>tag</em> that applies to this document.<br>
+    <br>
+    <strong>Note:</strong> this link type should not be set on links to a member of a tag cloud as these do not apply to a single document but to a set of pages.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+  <tr>
+   <td><code>up</code></td>
+   <td>Indicates that the page is part of a <em>hierarchical</em> structure and that the hyperlink leads to the higher level resource of that structure.<br>
+    <br>
+    The number of <code>up</code> link types indicates the depth difference between the current page and the linked resource.</td>
+   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
+   <td><em>None.</em></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Specifications" name="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Resource Hints', '#dfn-preconnect', 'preconnect')}}</td>
+   <td>{{Spec2('Resource Hints')}}</td>
+   <td>Added <code>dns-prefetch</code>, <code>preconnect</code>, and <code>prerender</code> values.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-link-element', '&lt;link&gt;')}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>No change since last snapshot ({{SpecName('HTML WHATWG')}})</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-link-element', '&lt;link&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td>Added <code>tag</code>, <code>stylesheet</code>, <code>search</code>, <code>prev</code>, <code>prefetch</code>, <code>noreferrer</code>, <code>nofollow</code>, <code>next</code>, <code>license</code>, <code>icon</code>, <code>help</code>, <code>bookmark</code>, <code>author</code>, and <code>alternate</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'struct/links.html#h-12.3', '&lt;link&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Alternative stylesheets</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.9")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>prefetch</code></td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td><code>prerender</code></td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td><code>preconnect</code></td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td><code>dns-prefetch</code></td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Alternative stylesheets</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/html/microdata/index.html b/files/es/web/html/microdata/index.html
new file mode 100644
index 0000000000..4577877e62
--- /dev/null
+++ b/files/es/web/html/microdata/index.html
@@ -0,0 +1,208 @@
+---
+title: Microdatos
+slug: Web/HTML/Microdata
+tags:
+  - HTML
+  - Microdatos
+  - Referencia
+  - busquedas
+translation_of: Web/HTML/Microdata
+original_slug: Web/HTML/Microdatos
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>Los microdatos son una especificación HTML de <a href="https://developer.mozilla.org/en-US/docs/Glossary/WHATWG">WHATWG</a> que se emplea para anidar metadatos en el contenido existente de las páginas web.[1] Buscadores, arañas web y navegadores pueden extraer y procesar los microdatos a partir de una página y utilizarlos para proveer una experiencia más enriquecida para los usuarios. Los buscadores se benefician considerablemente del acceso directo a estos datos estructurados, ya que les permite entender la información contenida en las páginas y ofrecer mejores resultados a sus usuarios. Los microdatos utilizan un vocabulario de apoyo para describir tanto los elementos como conjuntos de nombre y valor y así asignar valores a sus propiedades. Los microdatos representan un intento de brindar una manera más sencilla de anotar elementos HTML con etiquetas legibles por máquinas que los métodos similares consistentes en usar RDFa y microformatos.</p>
+
+<p>El Grupo de Trabajo de HTML del W3C no pudo encontrar un editor que se encargase de la especificación y, por ende, puso término a su desarrollo en 2013 con una «nota».</p>
+
+<p>En un nivel elevado, los microdatos consisten de un grupo de conjuntos nombre-valor. Tales grupos se denominan elementos, y cada conjunto nombre-valor es una propiedad. Los elementos y las propiedades los representan elementos ordinarios.</p>
+
+<ul>
+ <li>Para crear un elemento, se utiliza el atributo <strong>itemscope </strong>(‘alcance de elemento’).</li>
+ <li>Para añadir una propiedad a un elemento, el atributo <strong>itemprop</strong> (‘propiedad de elemento’)<strong> </strong>se emplea en uno de los descendientes del elemento.</li>
+</ul>
+
+<h2 id="Vocabularios"><span class="mw-headline" id="Vocabularies">Vocabularios</span></h2>
+
+<p>Google, así como otros de los principales buscadores, admiten el vocabulario para datos estructurados de <a href="schema.org">Schema.org</a>. Este vocabulario define un conjunto estandarizado de nombres de tipos y de propiedades: por ejemplo, <a href="http://schema.org/MusicEvent">Evento musical de Schema.org</a> señala conciertos, e incluye las propiedades <em><a href="http://schema.org/startDate">startDate</a></em> (‘fecha inicial’) y <em><a href="http://schema.org/location">location</a></em> (‘ubicación’) para definir los detalles clave del acontecimiento. En este caso, <a href="http://schema.org/MusicEvent">Evento musical de Schema.org</a> es el URL usado por <em>itemtype</em> y <em>startDate</em>, y la ubicación corresponde a las <em>itemprop</em> que defina <a href="http://schema.org/MusicEvent">Evento musical de Schema.org</a>.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> para obtener más información sobre los atributos <em>itemtype</em>, véase <a href="http://schema.org/Thing">http://schema.org/Thing</a> (en inglés)</p>
+</div>
+
+<p>Los vocabularios de microdatos brindan la semántica, o el significado, de los elementos. Los programadores web pueden diseñar un vocabulario personalizado o servirse de los que existen disponibles en la web, como el ampliamente utilizado vocabulario de <a href="http://schema.org">Schema.org</a>. Schema.org ofrece una colección de vocabularios de etiquetado usados frecuentemente.</p>
+
+<p>Vocabularios usados frecuentemente:</p>
+
+<ul>
+ <li>Obras creativas: <em><a href="http://schema.org/CreativeWork">CreativeWork</a></em> (‘obra creativa’),<em> <a href="http://schema.org/Book">Book</a></em> (‘libro’), <em><a href="http://schema.org/Movie">Movie</a></em> (película),<em> <a href="http://schema.org/MusicRecording">MusicRecording</a></em> (‘grabación musical’),<em> <a href="http://schema.org/Recipe">Recipe</a></em> (‘receta’),<em> <a href="http://schema.org/TVSeries">TVSeries</a></em> (‘serie de televisión’)</li>
+ <li>Objetos distintos del texto incrustados: <em><a href="http://schema.org/AudioObject">AudioObject</a></em> (‘objeto de audio’), <em><a href="http://schema.org/ImageObject">ImageObject</a></em> (‘objeto de imagen’),<em> <a href="http://schema.org/VideoObject">VideoObject</a></em> (‘objeto de vídeo’)</li>
+ <li><em><a href="http://schema.org/Event">Event</a></em> (‘acontecimiento’)</li>
+ <li><a href="http://schema.org/docs/meddocs.html">Tipos relativos a la salud y la medicina</a>: las notas sobre los tipos relativos a la salud y la medicina se encuentran bajo <em><a href="http://schema.org/MedicalEntity">MedicalEntity</a></em> (‘entidad médica’)</li>
+ <li><em><a href="http://schema.org/Organization">Organization</a></em> (‘organización’)</li>
+ <li><em><a href="http://schema.org/Person">Person</a></em> (‘persona’)</li>
+ <li><em><a href="http://schema.org/Place">Place</a></em> (‘sitio’), <em><a href="http://schema.org/LocalBusiness">LocalBusiness</a></em> (‘negocio local’), <em><a href="http://schema.org/Restaurant">Restaurant</a></em> (‘restaurante’)</li>
+ <li><em><a href="http://schema.org/Product">Product</a></em> (‘producto’), <em><a href="http://schema.org/Offer">Offer</a></em> (‘oferta’), <em><a href="http://schema.org/AggregateOffer">AggregateOffer</a></em> (‘oferta general’)</li>
+ <li><em><a href="http://schema.org/Review">Review</a></em> (‘reseña’), <em><a href="http://schema.org/AggregateRating">AggregateRating</a></em> (‘valoración totalizada’)</li>
+ <li><em><a href="http://schema.org/Action">Action</a></em> (‘acción’)</li>
+ <li><em><a href="http://schema.org/Thing">Thing</a></em> (‘cosa’)</li>
+ <li><em><a href="http://schema.org/Intangible">Intangible</a></em></li>
+</ul>
+
+<p>Con el objeto de mejorar los resultados de las búsquedas, las empresas operarias de los principales buscadores, como Google, Microsoft y Yahoo!, dependen del vocabulario de <a href="http://schema.org/">Schema.org</a>. Para algunos propósitos específicos, es necesario diseñar un vocabulario especializado. Siempre que resulta posible, se anima a los autores a servirse de vocabularios existentes, dado que esto facilita la reutilización del contenido.</p>
+
+<h2 id="Regionalización"><span class="mw-headline" id="Localization">Regionalización</span></h2>
+
+<p><span class="mw-headline">En algunos casos, los buscadores que dan servicio a determinadas regiones pueden ofrecer ampliaciones de los microdatos específicas para tales regiones. Por ejemplo, <a href="https://www.yandex.com/">Yandex</a>, un buscador importante en Rusia, admite microformatos como <em>hCard</em> (datos de contacto de empresas), <em>hRecipe</em> (recetas de cocina), <em>hReview</em> (reseñas de mercado) y <em>hProduct</em> (datos de productos) y proporciona su propio formato para definir términos y mostrar artículos enciclopédicos. Se creó esta ampliación para solucionar problemas relativos a la transliteración entre los alfabetos cirílico y latino. Como consecuencia de la aplicación de parámetros de marcado adicionales del vocabulario de Schema, la indización de la información de sitios web en lengua rusa se hizo considerablemente más satisfactoria.</span></p>
+
+<h2 id="Atributos_globales"><span class="mw-headline" id="Global_attributes">Atributos globales</span></h2>
+
+<p><span class="mw-headline"><em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemid">itemid</a></em>: el identificador unívoco y global de un elemento</span>.</p>
+
+<p><span class="mw-headline"><em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemprop">itemprop</a></em>: utilizado para añadir propiedades a un elemento. Cualquier elemento </span>HTML puede contener un atributo <em>itemprop</em> definido, y tal <em>itemprop</em> consiste de un nombre y un valor.</p>
+
+<p><span class="mw-headline"><em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemref">itemref</a></em>: las </span>propiedades que no desciendan de un elemento y contengan el atributo <code>itemscope</code> pueden asociarse con el elemento a través de una <em><strong>itemref</strong></em>. <em>Itemref</em> proporciona una lista de identificadores de elementos (distintos de los <code>itemid</code>s) con propiedades adicionales en otras partes del documento.</p>
+
+<p><span class="mw-headline"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope"><em>itemscope</em></a>: </span><em>Itemscope</em> (por lo general) funciona en conjunto con <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemtype"><em>itemtype</em> </a>para especificar que el HTML contenido en un bloque se refiere a un término concreto. <em>itemscope</em> crea el elemento y define el alcance del <em>itemtype</em> asociado con él. <em>itemtype</em> es un URL válido de un vocabulario (como <a class="external external-icon" href="http://schema.org/">Schema.org</a>) que describe el elemento y el contexto de sus propiedades.</p>
+
+<p><span class="mw-headline"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemtype"><em>itemtype</em></a>: Es</span>pecifica el URL del vocabulario que se empleará para definir <em>itemprops</em> (‘propiedades de elementos’) en la estructura de datos. Se emplea <em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope">Itemscope</a></em> para establecer el alcance del área de funcionamiento del vocabulario establecido por <em>itemtype</em> dentro de la estructura de datos.</p>
+
+<h2 id="Ejemplo"><span class="mw-headline" id="Example">Ejemplo</span></h2>
+
+<h3 id="HTML"><span class="mw-headline">HTML</span></h3>
+
+<pre class="brush: html">&lt;div itemscope itemtype="http://schema.org/SoftwareApplication"&gt;
+  &lt;span itemprop="name"&gt;Angry Birds&lt;/span&gt; -
+
+  REQUIRES &lt;span itemprop="operatingSystem"&gt;ANDROID&lt;/span&gt;&lt;br&gt;
+  &lt;link itemprop="applicationCategory" href="http://schema.org/GameApplication"/&gt;
+
+  &lt;div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"&gt;
+    RATING:
+    &lt;span itemprop="ratingValue"&gt;4.6&lt;/span&gt; (
+    &lt;span itemprop="ratingCount"&gt;8864&lt;/span&gt; ratings )
+  &lt;/div&gt;
+
+  &lt;div itemprop="offers" itemscope itemtype="http://schema.org/Offer"&gt;
+    Price: $&lt;span itemprop="price"&gt;1.00&lt;/span&gt;
+    &lt;meta itemprop="priceCurrency" content="MXN" /&gt;
+  &lt;/div&gt;
+&lt;/div&gt;</pre>
+
+<h3 id="Datos_estructurados">Datos estructurados</h3>
+
+<div class="VIpgJd-VgwJlc-bN97Pc">
+<div class="ibnC6b-sM5MNb">
+<div class="NbYDle">
+<div class="SmKAyb-jyrRxf IQ5j-oKdM2c" style="padding-left: 0px;">
+<div class="jyrRxf-eEDwDf l5asRc">
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td colspan="1" rowspan="4">itemscope</td>
+   <td>itemtype</td>
+   <td colspan="2" rowspan="1"><span>SoftwareApplication (</span>http://schema.org/SoftwareApplication)</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>name</span></td>
+   <td><span>Angry Birds</span></td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>operatingSystem</span></td>
+   <td><span>ANDROID</span></td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>applicationCategory</span></td>
+   <td><span>GameApplication (http://schema.org/GameApplication)</span></td>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="3">itemscope</td>
+   <td>itemprop[itemtype]</td>
+   <td colspan="2" rowspan="1"><span>aggregateRating</span> [<span>AggregateRating</span>]</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>ratingValue</span></td>
+   <td><span>4.6</span></td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>ratingCount</span></td>
+   <td><span>8864</span></td>
+  </tr>
+  <tr>
+   <td colspan="1" rowspan="3">itemscope</td>
+   <td>itemprop[itemtype]</td>
+   <td colspan="2" rowspan="1"><span>offers</span> [<span>Offer</span>]</td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>price</span></td>
+   <td><span>1.00</span></td>
+  </tr>
+  <tr>
+   <td>itemprop</td>
+   <td><span>priceCurrency</span></td>
+   <td><span>USD</span></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+</div>
+</div>
+</div>
+</div>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>{{ EmbedLiveSample('HTML', '', '100', '', 'Web/HTML/Microdata') }}</p>
+
+<div class="note">
+<p><strong>Nota</strong>: una útil herramienta para extraer estructuras de microdatos a partir de HTML es la <a href="https://developers.google.com/structured-data/testing-tool/ Structured Data Testing Tool">Herramienta de pruebas de datos estructurados</a> de Google. Ponla a prueba en el HTML mostrado más arriba.</p>
+</div>
+
+<h2 id="Compatibilidad_con_navegadores"><span class="mw-headline"><strong>Compatibilidad con navegadores</strong></span></h2>
+
+<div class="htab"><a id="AutoCompatibilityTable" name="AutoCompatibilityTable"></a>
+
+<ul>
+ <li class="selected"><a>Escritorio</a></li>
+ <li><a>Móvil</a></li>
+</ul>
+
+<div id="compat-desktop" style="display: block;">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Función</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>
+    <p>Compatibilidad<br>
+     básica</p>
+   </td>
+   <td>No</td>
+   <td>16<br>
+    Eliminada en 49.</td>
+   <td>No</td>
+   <td>No</td>
+   <td>No</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">Atributos globales</a></li>
+</ul>
diff --git a/files/es/web/html/microdatos/index.html b/files/es/web/html/microdatos/index.html
deleted file mode 100644
index 33e73cdb0d..0000000000
--- a/files/es/web/html/microdatos/index.html
+++ /dev/null
@@ -1,207 +0,0 @@
----
-title: Microdatos
-slug: Web/HTML/Microdatos
-tags:
-  - HTML
-  - Microdatos
-  - Referencia
-  - busquedas
-translation_of: Web/HTML/Microdata
----
-<h2 id="Resumen">Resumen</h2>
-
-<p>Los microdatos son una especificación HTML de <a href="https://developer.mozilla.org/en-US/docs/Glossary/WHATWG">WHATWG</a> que se emplea para anidar metadatos en el contenido existente de las páginas web.[1] Buscadores, arañas web y navegadores pueden extraer y procesar los microdatos a partir de una página y utilizarlos para proveer una experiencia más enriquecida para los usuarios. Los buscadores se benefician considerablemente del acceso directo a estos datos estructurados, ya que les permite entender la información contenida en las páginas y ofrecer mejores resultados a sus usuarios. Los microdatos utilizan un vocabulario de apoyo para describir tanto los elementos como conjuntos de nombre y valor y así asignar valores a sus propiedades. Los microdatos representan un intento de brindar una manera más sencilla de anotar elementos HTML con etiquetas legibles por máquinas que los métodos similares consistentes en usar RDFa y microformatos.</p>
-
-<p>El Grupo de Trabajo de HTML del W3C no pudo encontrar un editor que se encargase de la especificación y, por ende, puso término a su desarrollo en 2013 con una «nota».</p>
-
-<p>En un nivel elevado, los microdatos consisten de un grupo de conjuntos nombre-valor. Tales grupos se denominan elementos, y cada conjunto nombre-valor es una propiedad. Los elementos y las propiedades los representan elementos ordinarios.</p>
-
-<ul>
- <li>Para crear un elemento, se utiliza el atributo <strong>itemscope </strong>(‘alcance de elemento’).</li>
- <li>Para añadir una propiedad a un elemento, el atributo <strong>itemprop</strong> (‘propiedad de elemento’)<strong> </strong>se emplea en uno de los descendientes del elemento.</li>
-</ul>
-
-<h2 id="Vocabularios"><span class="mw-headline" id="Vocabularies">Vocabularios</span></h2>
-
-<p>Google, así como otros de los principales buscadores, admiten el vocabulario para datos estructurados de <a href="schema.org">Schema.org</a>. Este vocabulario define un conjunto estandarizado de nombres de tipos y de propiedades: por ejemplo, <a href="http://schema.org/MusicEvent">Evento musical de Schema.org</a> señala conciertos, e incluye las propiedades <em><a href="http://schema.org/startDate">startDate</a></em> (‘fecha inicial’) y <em><a href="http://schema.org/location">location</a></em> (‘ubicación’) para definir los detalles clave del acontecimiento. En este caso, <a href="http://schema.org/MusicEvent">Evento musical de Schema.org</a> es el URL usado por <em>itemtype</em> y <em>startDate</em>, y la ubicación corresponde a las <em>itemprop</em> que defina <a href="http://schema.org/MusicEvent">Evento musical de Schema.org</a>.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> para obtener más información sobre los atributos <em>itemtype</em>, véase <a href="http://schema.org/Thing">http://schema.org/Thing</a> (en inglés)</p>
-</div>
-
-<p>Los vocabularios de microdatos brindan la semántica, o el significado, de los elementos. Los programadores web pueden diseñar un vocabulario personalizado o servirse de los que existen disponibles en la web, como el ampliamente utilizado vocabulario de <a href="http://schema.org">Schema.org</a>. Schema.org ofrece una colección de vocabularios de etiquetado usados frecuentemente.</p>
-
-<p>Vocabularios usados frecuentemente:</p>
-
-<ul>
- <li>Obras creativas: <em><a href="http://schema.org/CreativeWork">CreativeWork</a></em> (‘obra creativa’),<em> <a href="http://schema.org/Book">Book</a></em> (‘libro’), <em><a href="http://schema.org/Movie">Movie</a></em> (película),<em> <a href="http://schema.org/MusicRecording">MusicRecording</a></em> (‘grabación musical’),<em> <a href="http://schema.org/Recipe">Recipe</a></em> (‘receta’),<em> <a href="http://schema.org/TVSeries">TVSeries</a></em> (‘serie de televisión’)</li>
- <li>Objetos distintos del texto incrustados: <em><a href="http://schema.org/AudioObject">AudioObject</a></em> (‘objeto de audio’), <em><a href="http://schema.org/ImageObject">ImageObject</a></em> (‘objeto de imagen’),<em> <a href="http://schema.org/VideoObject">VideoObject</a></em> (‘objeto de vídeo’)</li>
- <li><em><a href="http://schema.org/Event">Event</a></em> (‘acontecimiento’)</li>
- <li><a href="http://schema.org/docs/meddocs.html">Tipos relativos a la salud y la medicina</a>: las notas sobre los tipos relativos a la salud y la medicina se encuentran bajo <em><a href="http://schema.org/MedicalEntity">MedicalEntity</a></em> (‘entidad médica’)</li>
- <li><em><a href="http://schema.org/Organization">Organization</a></em> (‘organización’)</li>
- <li><em><a href="http://schema.org/Person">Person</a></em> (‘persona’)</li>
- <li><em><a href="http://schema.org/Place">Place</a></em> (‘sitio’), <em><a href="http://schema.org/LocalBusiness">LocalBusiness</a></em> (‘negocio local’), <em><a href="http://schema.org/Restaurant">Restaurant</a></em> (‘restaurante’)</li>
- <li><em><a href="http://schema.org/Product">Product</a></em> (‘producto’), <em><a href="http://schema.org/Offer">Offer</a></em> (‘oferta’), <em><a href="http://schema.org/AggregateOffer">AggregateOffer</a></em> (‘oferta general’)</li>
- <li><em><a href="http://schema.org/Review">Review</a></em> (‘reseña’), <em><a href="http://schema.org/AggregateRating">AggregateRating</a></em> (‘valoración totalizada’)</li>
- <li><em><a href="http://schema.org/Action">Action</a></em> (‘acción’)</li>
- <li><em><a href="http://schema.org/Thing">Thing</a></em> (‘cosa’)</li>
- <li><em><a href="http://schema.org/Intangible">Intangible</a></em></li>
-</ul>
-
-<p>Con el objeto de mejorar los resultados de las búsquedas, las empresas operarias de los principales buscadores, como Google, Microsoft y Yahoo!, dependen del vocabulario de <a href="http://schema.org/">Schema.org</a>. Para algunos propósitos específicos, es necesario diseñar un vocabulario especializado. Siempre que resulta posible, se anima a los autores a servirse de vocabularios existentes, dado que esto facilita la reutilización del contenido.</p>
-
-<h2 id="Regionalización"><span class="mw-headline" id="Localization">Regionalización</span></h2>
-
-<p><span class="mw-headline">En algunos casos, los buscadores que dan servicio a determinadas regiones pueden ofrecer ampliaciones de los microdatos específicas para tales regiones. Por ejemplo, <a href="https://www.yandex.com/">Yandex</a>, un buscador importante en Rusia, admite microformatos como <em>hCard</em> (datos de contacto de empresas), <em>hRecipe</em> (recetas de cocina), <em>hReview</em> (reseñas de mercado) y <em>hProduct</em> (datos de productos) y proporciona su propio formato para definir términos y mostrar artículos enciclopédicos. Se creó esta ampliación para solucionar problemas relativos a la transliteración entre los alfabetos cirílico y latino. Como consecuencia de la aplicación de parámetros de marcado adicionales del vocabulario de Schema, la indización de la información de sitios web en lengua rusa se hizo considerablemente más satisfactoria.</span></p>
-
-<h2 id="Atributos_globales"><span class="mw-headline" id="Global_attributes">Atributos globales</span></h2>
-
-<p><span class="mw-headline"><em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemid">itemid</a></em>: el identificador unívoco y global de un elemento</span>.</p>
-
-<p><span class="mw-headline"><em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemprop">itemprop</a></em>: utilizado para añadir propiedades a un elemento. Cualquier elemento </span>HTML puede contener un atributo <em>itemprop</em> definido, y tal <em>itemprop</em> consiste de un nombre y un valor.</p>
-
-<p><span class="mw-headline"><em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemref">itemref</a></em>: las </span>propiedades que no desciendan de un elemento y contengan el atributo <code>itemscope</code> pueden asociarse con el elemento a través de una <em><strong>itemref</strong></em>. <em>Itemref</em> proporciona una lista de identificadores de elementos (distintos de los <code>itemid</code>s) con propiedades adicionales en otras partes del documento.</p>
-
-<p><span class="mw-headline"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope"><em>itemscope</em></a>: </span><em>Itemscope</em> (por lo general) funciona en conjunto con <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemtype"><em>itemtype</em> </a>para especificar que el HTML contenido en un bloque se refiere a un término concreto. <em>itemscope</em> crea el elemento y define el alcance del <em>itemtype</em> asociado con él. <em>itemtype</em> es un URL válido de un vocabulario (como <a class="external external-icon" href="http://schema.org/">Schema.org</a>) que describe el elemento y el contexto de sus propiedades.</p>
-
-<p><span class="mw-headline"><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemtype"><em>itemtype</em></a>: Es</span>pecifica el URL del vocabulario que se empleará para definir <em>itemprops</em> (‘propiedades de elementos’) en la estructura de datos. Se emplea <em><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope">Itemscope</a></em> para establecer el alcance del área de funcionamiento del vocabulario establecido por <em>itemtype</em> dentro de la estructura de datos.</p>
-
-<h2 id="Ejemplo"><span class="mw-headline" id="Example">Ejemplo</span></h2>
-
-<h3 id="HTML"><span class="mw-headline">HTML</span></h3>
-
-<pre class="brush: html">&lt;div itemscope itemtype="http://schema.org/SoftwareApplication"&gt;
-  &lt;span itemprop="name"&gt;Angry Birds&lt;/span&gt; -
-
-  REQUIRES &lt;span itemprop="operatingSystem"&gt;ANDROID&lt;/span&gt;&lt;br&gt;
-  &lt;link itemprop="applicationCategory" href="http://schema.org/GameApplication"/&gt;
-
-  &lt;div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating"&gt;
-    RATING:
-    &lt;span itemprop="ratingValue"&gt;4.6&lt;/span&gt; (
-    &lt;span itemprop="ratingCount"&gt;8864&lt;/span&gt; ratings )
-  &lt;/div&gt;
-
-  &lt;div itemprop="offers" itemscope itemtype="http://schema.org/Offer"&gt;
-    Price: $&lt;span itemprop="price"&gt;1.00&lt;/span&gt;
-    &lt;meta itemprop="priceCurrency" content="MXN" /&gt;
-  &lt;/div&gt;
-&lt;/div&gt;</pre>
-
-<h3 id="Datos_estructurados">Datos estructurados</h3>
-
-<div class="VIpgJd-VgwJlc-bN97Pc">
-<div class="ibnC6b-sM5MNb">
-<div class="NbYDle">
-<div class="SmKAyb-jyrRxf IQ5j-oKdM2c" style="padding-left: 0px;">
-<div class="jyrRxf-eEDwDf l5asRc">
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td colspan="1" rowspan="4">itemscope</td>
-   <td>itemtype</td>
-   <td colspan="2" rowspan="1"><span>SoftwareApplication (</span>http://schema.org/SoftwareApplication)</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>name</span></td>
-   <td><span>Angry Birds</span></td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>operatingSystem</span></td>
-   <td><span>ANDROID</span></td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>applicationCategory</span></td>
-   <td><span>GameApplication (http://schema.org/GameApplication)</span></td>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="3">itemscope</td>
-   <td>itemprop[itemtype]</td>
-   <td colspan="2" rowspan="1"><span>aggregateRating</span> [<span>AggregateRating</span>]</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>ratingValue</span></td>
-   <td><span>4.6</span></td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>ratingCount</span></td>
-   <td><span>8864</span></td>
-  </tr>
-  <tr>
-   <td colspan="1" rowspan="3">itemscope</td>
-   <td>itemprop[itemtype]</td>
-   <td colspan="2" rowspan="1"><span>offers</span> [<span>Offer</span>]</td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>price</span></td>
-   <td><span>1.00</span></td>
-  </tr>
-  <tr>
-   <td>itemprop</td>
-   <td><span>priceCurrency</span></td>
-   <td><span>USD</span></td>
-  </tr>
- </tbody>
-</table>
-</div>
-</div>
-</div>
-</div>
-</div>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('HTML', '', '100', '', 'Web/HTML/Microdata') }}</p>
-
-<div class="note">
-<p><strong>Nota</strong>: una útil herramienta para extraer estructuras de microdatos a partir de HTML es la <a href="https://developers.google.com/structured-data/testing-tool/ Structured Data Testing Tool">Herramienta de pruebas de datos estructurados</a> de Google. Ponla a prueba en el HTML mostrado más arriba.</p>
-</div>
-
-<h2 id="Compatibilidad_con_navegadores"><span class="mw-headline"><strong>Compatibilidad con navegadores</strong></span></h2>
-
-<div class="htab"><a id="AutoCompatibilityTable" name="AutoCompatibilityTable"></a>
-
-<ul>
- <li class="selected"><a>Escritorio</a></li>
- <li><a>Móvil</a></li>
-</ul>
-
-<div id="compat-desktop" style="display: block;">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Función</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>
-    <p>Compatibilidad<br>
-     básica</p>
-   </td>
-   <td>No</td>
-   <td>16<br>
-    Eliminada en 49.</td>
-   <td>No</td>
-   <td>No</td>
-   <td>No</td>
-  </tr>
- </tbody>
-</table>
-</div>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes">Atributos globales</a></li>
-</ul>
diff --git a/files/es/web/html/microformatos/index.html b/files/es/web/html/microformatos/index.html
deleted file mode 100644
index 6dd963a227..0000000000
--- a/files/es/web/html/microformatos/index.html
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: Microformatos
-slug: Web/HTML/microformatos
-translation_of: Web/HTML/microformats
----
-<p><span class="seoSummary"><span class="p-summary"><dfn>Los <a href="http://microformats.org">Microformatos</a></dfn> (en ocasiones abreviados como  <strong>μF) </strong>son convenciones simples para incrustar semántica en HTML y para brindar rápidamente un API utilizable por los motores de búsqueda, agregadores y otras herramientas</span></span>  Estos pequeños patrones de HTML son usados para marcar entidades que varían entre fundamentales hasta información específica de un dominio, tales como personas, organizaciones, eventos y ubicaciones.</p>
-
-<p>Su formato simple busca ser útil para máquinas y también legible para humanos.</p>
-
-<p>Muchas librerías en existencia se han desarrollado para estos microformatos incluyendo pero sin limitarse a hCard y hCalendar.</p>
-
-<p>Los microformatos son soportados por la mayoría de motores de búsqueda.</p>
-
-<h2 id="Microformats_microdata_and_RDFa">Microformats, microdata and RDFa</h2>
-
-<p><strong>Microdata</strong> are a WHATWG HTML specification also used to nest metadata within existing content on web pages.<br>
- <strong>RDFa</strong> is a W3C standard, applying RDF to web pages.<br>
- <strong>Microformats</strong> are no standard, although hCard and hCalendar conventions are widely used.</p>
-
-<p> They all aim at adding semantics to web documents.</p>
-
-<h2 id="See_also" style="line-height: 30px; font-size: 2.14285714285714rem;">See also</h2>
-
-<ul>
- <li>{{Interwiki("wikipedia", "Microformat")}} on Wikipedia</li>
- <li><a href="http://www.microformats.org">Microformats official website</a></li>
- <li><a href="http://microformats.org/wiki/search_engines">Search engines support</a> on Microformats official website</li>
- <li><a href="https://indiewebcamp.com/microformats">IndieWebCamp</a></li>
-</ul>
diff --git a/files/es/web/html/microformats/index.html b/files/es/web/html/microformats/index.html
new file mode 100644
index 0000000000..52c61d231b
--- /dev/null
+++ b/files/es/web/html/microformats/index.html
@@ -0,0 +1,30 @@
+---
+title: Microformatos
+slug: Web/HTML/microformats
+translation_of: Web/HTML/microformats
+original_slug: Web/HTML/microformatos
+---
+<p><span class="seoSummary"><span class="p-summary"><dfn>Los <a href="http://microformats.org">Microformatos</a></dfn> (en ocasiones abreviados como  <strong>μF) </strong>son convenciones simples para incrustar semántica en HTML y para brindar rápidamente un API utilizable por los motores de búsqueda, agregadores y otras herramientas</span></span>  Estos pequeños patrones de HTML son usados para marcar entidades que varían entre fundamentales hasta información específica de un dominio, tales como personas, organizaciones, eventos y ubicaciones.</p>
+
+<p>Su formato simple busca ser útil para máquinas y también legible para humanos.</p>
+
+<p>Muchas librerías en existencia se han desarrollado para estos microformatos incluyendo pero sin limitarse a hCard y hCalendar.</p>
+
+<p>Los microformatos son soportados por la mayoría de motores de búsqueda.</p>
+
+<h2 id="Microformats_microdata_and_RDFa">Microformats, microdata and RDFa</h2>
+
+<p><strong>Microdata</strong> are a WHATWG HTML specification also used to nest metadata within existing content on web pages.<br>
+ <strong>RDFa</strong> is a W3C standard, applying RDF to web pages.<br>
+ <strong>Microformats</strong> are no standard, although hCard and hCalendar conventions are widely used.</p>
+
+<p> They all aim at adding semantics to web documents.</p>
+
+<h2 id="See_also" style="line-height: 30px; font-size: 2.14285714285714rem;">See also</h2>
+
+<ul>
+ <li>{{Interwiki("wikipedia", "Microformat")}} on Wikipedia</li>
+ <li><a href="http://www.microformats.org">Microformats official website</a></li>
+ <li><a href="http://microformats.org/wiki/search_engines">Search engines support</a> on Microformats official website</li>
+ <li><a href="https://indiewebcamp.com/microformats">IndieWebCamp</a></li>
+</ul>
diff --git a/files/es/web/html/optimizing_your_pages_for_speculative_parsing/index.html b/files/es/web/html/optimizing_your_pages_for_speculative_parsing/index.html
deleted file mode 100644
index 6509450cf9..0000000000
--- a/files/es/web/html/optimizing_your_pages_for_speculative_parsing/index.html
+++ /dev/null
@@ -1,34 +0,0 @@
----
-title: Optimizar sus páginas para análisis especulativo
-slug: Web/HTML/Optimizing_your_pages_for_speculative_parsing
-tags:
-  - Avanzado
-  - Desarrollo web
-  - HTML
-  - HTML5
-translation_of: Glossary/speculative_parsing
----
-<p><span class="seoSummary">Tradicionalmente en los navegadores el analizador de HTML corre en el hilo de ejecución principal y se queda bloqueado después de una etiqueta &lt;/script&gt; hasta que el código se haya recuperado y ejecutado. El analizador de HTML de Firefox 4 y posteriores soporta análisis especulativo fuera del hilo de ejecución principal. Este analiza anticipadamente mientras el codigo está siendo descargado y ejecutado. Como en Firefox 3.5 y 3.6, el analizador de HTML es el que inicia la carga especulativa de código, las hojas de estilos y las imagenes que va encontrando en el flujo de la página. Sin embargo en Firefox 4 y posteriores el analizador de HTML también ejecuta el algoritmo especulativo de la construcción del árbol HTML. La ventaja es que cuando lo especulado tiene exito, no hay necesidad de reanalizar la parte del archivo de entrada que ya fue analizada junto la descarga de código,  hojas de estilo y las imágenes. La desventaja es que se ha realizado un trabajo inútil cuando la especulación fracasa.</span></p>
-
-<p>Este documento le ayuda a evitar este tipo de situaciones que hacen que la especulación falle y ralentize la carga de la página.</p>
-
-<h2 id="Haciendo_cargas_especulativas_exitosas">Haciendo cargas especulativas exitosas</h2>
-
-<p>Hay solo una regla para hacer cargas especulativas exitosas en scripts enlazados, hojas de estilo e imagenes:</p>
-
-<ul>
- <li>Si usted usa el elemento &lt;base&gt; para anular la base URI de su pagina, ponga el elemento en la parte no-escrita de el documento. No la añada via document.write() o document.createElement().</li>
-</ul>
-
-<h2 id="Evitando_perder_la_salida_del_generador_de_arbol">Evitando perder la salida del generador de arbol</h2>
-
-<p>La generación de árbol especulativo falla cuando <code>document.write()</code> cambia el estado del generador de árbol de tal manera que el estado especulativo después del tag <code>&lt;/script&gt;</code> no se mantiene cuando todo el contenido es inertado por <code>document.write()</code> ha sido analizado. Sin embargo, sólo usos inusuales de <code>document.write()</code> causa problemas. Aquí están las cosas a evitar:</p>
-
-<ul>
- <li>No escriba árboles desbalanceados. <code>&lt;script&gt;document.write("&lt;div&gt;");&lt;/script&gt;</code> está mal. <code>&lt;script&gt;document.write("&lt;div&gt;&lt;/div&gt;");&lt;/script&gt;</code> es correcto.</li>
- <li>No escriba un token sin finalizar. <code>&lt;script&gt;document.write("&lt;div&gt;&lt;/div");&lt;/script&gt;</code> esta mal.</li>
- <li>No termine con un carater de retorno de carro. <code>&lt;script&gt;document.write("Hello World!\r");&lt;/script&gt;</code> está mal. <code>&lt;script&gt;document.write("Hello World!\n");&lt;/script&gt;</code> es correcto.</li>
- <li>Note que escribiendo etiquetas balanceadas pueden causarse que se creen otras etiquetas desbalanceadas. Ej. <code>&lt;script&gt;document.write("&lt;div&gt;&lt;/div&gt;");&lt;/script&gt;</code> dentro del elemento <code>head</code> será interpretado como <code>&lt;script&gt;document.write("&lt;/head&gt;&lt;body&gt;&lt;div&gt;&lt;/div&gt;");&lt;/script&gt;</code> el cual está desbalanceado.</li>
- <li>No formatee parte de una tabla. <code>&lt;table&gt;&lt;script&gt;document.write("&lt;tr&gt;&lt;td&gt;Hello World!&lt;/td&gt;&lt;/tr&gt;");&lt;/script&gt;&lt;/table&gt;</code> está mal. Sin embargo, <code>&lt;script&gt;document.write("</code><code>&lt;table&gt;</code><code>&lt;tr&gt;&lt;td&gt;Hello World!&lt;/td&gt;&lt;/tr&gt;</code><code>&lt;/table&gt;</code><code>");&lt;/script&gt;</code> está correcto.</li>
- <li>HAGA: document.write dentro de otro elemento de formateo.</li>
-</ul>
diff --git a/files/es/web/html/recursos_offline_en_firefox/index.html b/files/es/web/html/recursos_offline_en_firefox/index.html
deleted file mode 100644
index dfed8fe0d5..0000000000
--- a/files/es/web/html/recursos_offline_en_firefox/index.html
+++ /dev/null
@@ -1,382 +0,0 @@
----
-title: Usar el caché de aplicaciones
-slug: Web/HTML/Recursos_offline_en_firefox
-tags:
-  - Firefox 3.5
-  - HTML5
-  - aplicaciones web sin conexión
-  - para_revisar
-translation_of: Web/HTML/Using_the_application_cache
----
-<h2 id="Introducción">Introducción</h2>
-
-<p><a href="https://developer.mozilla.org/en-US/docs/HTML/HTML5" title="/en-US/docs/HTML/HTML5">HTML5</a> proporciona un mecanismo de <em>caché de aplicación</em> que permite que las aplicaciones basadas en la web se ejecuten sin conexión. Los desarrolladores pueden usar la interface de <strong>Caché de aplicaciones</strong> (<em>AppCache</em>) para especificar los recursos que el navegador debería guardar en caché y tener disponibles para los usuarios cuando no estén conectados. Las aplicaciones que están en caché se cargan y funcionan correctamente aunque los usuarios hagan clic en el botón recargar cuando no están conectados.</p>
-
-<p>Usar el caché de aplicaciones le da a la aplicación los siguientes beneficios:</p>
-
-<ul>
- <li>Navegación sin conexión: los usuarios pueden navegar un sitio aún cuando no estén conectados.</li>
- <li>Velocidad: los recursos en caché son locales, y por lo tanto, se cargan más rápido.</li>
- <li>Carga al servidor reducida: el navegador solamente descarga desde el servidor recursos que han cambiado..</li>
-</ul>
-
-<h3 id="¿Cómo_funciona_el_caché_de_aplicaciones">¿Cómo funciona el caché de aplicaciones?</h3>
-
-<h3 id="Habilitando_caché_de_aplicaciones">Habilitando caché de aplicaciones</h3>
-
-<p>Para habilitar el caché de aplicaciones, debe incluir el atributo {{htmlattrxref("manifest", "html")}} en el elemento {{HTMLElement("html")}} en las páginas de sus aplicaciones, como se muestra en el siguiente ejemplo:</p>
-
-<div>
-<pre class="brush: html"><span class="brush: html">&lt;html manifest="ejemplo.appcache"&gt; </span>
-  ...
-&lt;/html&gt;
-</pre>
-</div>
-
-<p>El atributo manifest referencia un archivo <strong>manifest de caché</strong>, que es un archivo de texto que lista los recursos (archivos) que el navegador deberá guardar en caché para la aplicación.</p>
-
-<p>Debería incluir el atributo <code>manifest</code> en cada página de la aplicación que quiera guardar en caché. El navegador no guardará páginas que no contengan el atributo  <code>manifest</code>, a menos que esas páginas estén específicamente listadas en el archivo manifest en sí mismo. No es necesario listar todas las páginas que se quieran guardar en caché en el archivo de manfifesto, el navegador implícitamente agrega cada página que el usuario visite y tenga el atributo <code>manifest</code> establecido para caché de aplicación.</p>
-
-<p>Algunos navegadores (ej. Firefox) muestran una notificación la primera vez que un usuario carga una aplicación que usa caché de aplicaciones La barra de notificaciones muestra un mensaje parecido a :</p>
-
-<p style="margin-left: 40px;">Este sitio web (<code>www.ejemplo.com</code>) está pidiendo guardar datos en su equipo para usar sin conexión. [Permitir] [Nunca para este sitio] [No por ahora]</p>
-
-<p>El término "offline(-enabled) applications" a veces se refiere específicamente a aplicaciones a las que el usuario ha permitido que usen capacidades sin conexión.</p>
-
-<h3 id="Cargando_documentos">Cargando documentos</h3>
-
-<div>
-<p>Es uso de caché de aplicaciones modifica el proceso normal de la carga de un documento:</p>
-
-<ul>
- <li>Si existe caché de aplicaciones, el navegador carga el documento y sus recursos asociados directamente desde ahí, sin acceder a la red. Esto acelera el tiempo de carga del documento.</li>
- <li>El navegador entonces verifíca si hubo actualizaciones al manifest de caché en el servidor.</li>
- <li>Si el manifest de caché fue actualizado, el navegador descarga la nueva versión del archivo y de los recursos listados en él. Esto se realiza en segundo plano y no afecta el rendimiento de forma significativa.</li>
-</ul>
-
-<p>El proceso para cargar documentos y actualizar el caché de aplicaciones está especificado con gran detalle aquí debajo:</p>
-</div>
-
-<ol>
- <li>Cuando el navegador visita un documento que incluye el atributo <code>manifest</code>, si no existe caché de aplicaciones, el navegador carga el documento y baja todas las entradas listadas en el archivo del manifest, creando la primera versón de caché de aplicaciones. </li>
- <li>Posteriores visitas a ese documento causan que el navegador cargue el documento y otros archivos especificados en el manifest desde el caché de aplicaciones (no desde el servidor). Además, el navegador envía un evento <code>checking</code> al objeto <code><a href="https://developer.mozilla.org/en/DOM/window.applicationCache" title="en/DOM/window.applicationCache">window.applicationCache</a></code> y descarga el archivo de manifest, siguiendo las reglas de caché HTTP apropiadas.</li>
- <li>Si la copia del manifest actualmente en caché está actualizada, el navegador envía un evento <code>noupdate</code> al objeto <code>applicationCache</code> y el proceso de actualización está completo. Hay que tener en cuenta que si se cambia en el servidor cualquier recurso en caché, se deberá cambiar también el archivo de manifest, para que el navegador sepa que deberá descargar los recursos nuevamente.</li>
- <li>Si el archivo de manifest <em>ha</em> cambiado, todos los archivos listados en el manifest—así como los que se agregaron al caché llamando <code><a href="https://developer.mozilla.org/en/nsIDOMOfflineResourceList#add.28.29" title="en/nsIDOMOfflineResourceList#add.28.29">applicationCache.add()</a></code>—se descargarán en un caché temporario, siguiendo las reglas de caché  HTTP apropiadas. Para cada archivo descargado en este caché temporario, el navegador envía un evento <code>progress</code> al objeto <code>applicationCache</code>. Si ocurre cualquier error, el navegador envía un evento <code>error</code> y la actualización se detiene.</li>
- <li>Una vez que todos los archivos han sido recuperados exitosamente, son movidos al caché sin conexión real automáticamente y un evento <code>cached</code> es enviado al objeto <code>applicationCache</code>. Como el documento ya ha sido cargado en el navegador desde caché, la actualización no se mostrará hasta que el documento sea re-cargado (ya sea manualmente o por programa).</li>
-</ol>
-
-<h2 id="Ubicación_del_almacenamiento_y_limpiando_el_caché_sin_conexión">Ubicación del almacenamiento y limpiando el caché sin conexión</h2>
-
-<p>En Chrome se puede limpiar el caché sin conexión seleccionando "Clear browsing data..." en las preferencias o visitando <a class="external" title="chrome://appcache-internals/">chrome://appcache-internals/</a>. Safari tiene una configuración similar"Vaciar cache" en sus preferencias, pero se requiere el reinicio del navegador.</p>
-
-<p>En Firefox, el caché sin conexión se guarda en un lugar separado del perfil de Firefox profile—cerca del caché de disco regular:</p>
-
-<ul>
- <li>Windows Vista/7: <code>C:\Users\&lt;usuario&gt;\AppData\<strong>Local</strong>\Mozilla\Firefox\Profiles\&lt;salt&gt;.&lt;nombre de perfil&gt;\OfflineCache</code></li>
- <li>Mac/Linux: <code>/Users/&lt;usuario&gt;/Library/Caches/Firefox/Profiles/&lt;salt&gt;.&lt;nombre de perfil&gt;/OfflineCache</code></li>
-</ul>
-
-<p>En Firefox el estado actual del caché de aplicaciones puede ser inspeccionado en la página the <code>about:cache</code> (debajo del encabezado "Offline cache device"). El caché sin conexión pude limpiarse para cada sitio por separado usando el botón "Eliminar..." Herramientas -&gt; Opciones -&gt; Avanzadas -&gt; Red -&gt; Datos sin conexión.</p>
-
-<p>Antes de Firefox 11, ni Herramientas -&gt; Limpiar historial reciente ni Herramientas -&gt; Opciones -&gt; Avanzadas -&gt; Red -&gt; Datos sin conexión -&gt; Limpiar ahora borraban el caché sin conexión. Esto ha sido solucionado.</p>
-
-<p>Véase también <a href="https://developer.mozilla.org/en/DOM/Storage#Storage_location_and_clearing_the_data" title="en/DOM/Storage#Storage location and clearing the data">limpiar los datos de almacenamiento de DOM</a>.</p>
-
-<div>
-<p>Los cachés de aplicaciones también pueden quedar obsoletos. Si el archivo de manifest de una aplicación es eliminado del servidor, el navegador elimina todo caché de la aplicación que use aquel manifest y envía un evento "obsoleted" al objeto <code>applicationCache</code>. Esto cambia el estado de caché de la aplicación a <code>OBSOLETE</code>.</p>
-</div>
-
-<h2 id="El_archivo_de_manifest_de_caché">El archivo de manifest de caché</h2>
-
-<h3 id="Referenciando_un_archivo_de_manifest_de_caché">Referenciando un archivo de manifest de caché</h3>
-
-<p>El atributo <code>manifest</code> en una aplicación web puede especificar ya sea la ruta relativa de un archivo de manifest de caché o una URL absoluta (URLs absolutas deben estar en el mismo origen que la aplicación). Un archivo de manifest de caché puede tener cualquier extensión de archivo, pero debe ser enviada con el tipo MIME <code>text/cache-manifest</code>.</p>
-
-<div class="note"><strong>Nota: </strong>En servidores Apache, el tipo MIME para los archivos de manifest (.appcache) puede establecerse agregando <code>AddType text/cache-manifest .appcache</code> a un archivo .htaccess dentro del directorio raíz o del mismo directorio que la aplicación.</div>
-
-<h3 id="Entradas_en_el_archivo_de_manifest_de_caché">Entradas en el archivo de manifest de caché</h3>
-
-<p>El archivo de manifest de caché es un archivo de texto simple que lista los recursos que el navegador debería guardar en caché para acceder sin conexión. Los recursos son identificados por URI. Las entradas listadas en el manifest de caché deben tener el mismo esquema, servidor y puerto que el manifest. </p>
-
-<h3 id="Ejemplo_1_un_archivo_de_manifest_de_caché_simple">Ejemplo 1: un archivo de manifest de caché simple</h3>
-
-<div>
-<p>El siguiente es un archivo de manifest de caché simple, <code>ejemplo.appcache</code>, para un sitio web imaginario en <span class="nowiki">www.ejemplo.com</span>.</p>
-
-<pre class="eval">CACHE MANIFEST
-# v1 - 2011-08-13
-# Esto es un comentario.
-<span class="nowiki">http://www.ejemplo.com/index.html</span>
-<span class="nowiki">http://www.ejemplo.com/encabezado.png</span>
-<span class="nowiki">http://www.ejemplo.com/blah/blah</span>
-</pre>
-
-<p>Un archivo de manifest de caché puede incluir tres secciones (<code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK</code>, discutidas debajo). En el ejemplo mencionado, no hay encabezado de sección, así que todoas las líneas de datos se asumen como si estuvieran en la sección explícita (<code>CACHE</code>), lo que significa que el navegador deberá guardar en caché todos los recursos listados en el caché de aplicación. Los recursos pueden ser especificados como URLs absolutas o relativas (ej. <code>index.html</code>).</p>
-
-<p>El comentario "v1" en el ejemplo está ahí por una buena razón. Los navegadores solamente actualizan el caché de aplicación cuando el archivo de manifest cambia byte por byte. Si se cambia un recurso en caché (por ejemplo, si se actualiza la imagen <code>header.png</code> con nuevo contenido), se debe cambiar el contenido del archivo de manifest para que los navegadores sepan que se necesita actualizar el caché. Se puede hacer cualquier cambio al archivo de manifest, pero cambiar el número de versión es una práctica recomendada.</p>
-
-<div class="warning"><strong>Importante:</strong> No hay que especificar el manifest en el mismo archivo de manifest Do not specify the manifest, porque sería casi imposible informar al navegador que hay un nuevo manifest disponible.</div>
-
-<h3 id="Secciones_en_un_archivo_de_manifest_de_caché_CACHE_NETWORK_y_FALLBACK">Secciones en un archivo de manifest de caché: <code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK</code></h3>
-
-<p>Un manifest puede tener tres secciones distintas: <code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK</code>.</p>
-
-<dl>
- <dt><code>CACHE:</code></dt>
- <dd>Esta es la sección predeterminada para las entradas en el archivo de manifest de caché. Los archivos listados bajo el encabezado de sección <code>CACHE:</code> (o inmediatamente después de la línea <code>CACHE MANIFEST</code>) son guardados en caché explícitamente después de ser descargados la primera vez.</dd>
- <dt><code>NETWORK:</code></dt>
- <dd>Los archivos listados bajo el encabezado de sección <code>NETWORK:</code> en el archivo de manifest de caché son recursos en <em>lista blanca</em> que requieren una conexión al servidor. Todos los pedidos a esos recursos evitan el caché aunque el usuario esté desconectado. Se pueden usar comodines.</dd>
- <dt><code>FALLBACK:</code></dt>
- <dd>La sección <code>FALLBACK:</code> especifica las páginas que el navegador debería usar si un recurso no es accesible. Cada entrada en esta sección lista dos URIs—lla primera es el recurso, la seguda es el fallback. Ambas URIs deben ser relativas y del mismo origen que el archivo de manifest. Se pueden usar comodines.</dd>
-</dl>
-
-<p>Las secciones <code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK </code>pueden lsitarse en cualquier orden en el archivo de manifest y cada sección puede aparecer más de una vez en un manifest.</p>
-
-<h3 id="Ejemplo_2_un_archivo_de_manifest_de_caché_más_completo">Ejemplo 2: un archivo de manifest de caché más completo</h3>
-
-<p>El siguiente es un archivo de manifest de caché para el sitio web imaginario en <span class="nowiki">www.ejemplo.com</span>:</p>
-
-<pre class="eval">CACHE MANIFEST
-# v1 2011-08-14
-# Este es otro comentario
-index.html
-cache.html
-style.css
-image1.png
-
-# Usar desde la red si está disponible
-NETWORK:
-network.html
-
-# Contenido de fallback
-FALLBACK:
-/ fallback.html
-</pre>
-
-<p>Este ejemplo usa las secciones <code>NETWORK</code> y <code>FALLBACK</code> para especificar la página <code>network.html</code> que deber ser recuperada desde la red y que la página <code>fallback.html</code> servirá como fallback (ej. en caso que una conexión al servidor no pueda establecerse).</p>
-
-<h3 id="Estructura_de_un_archivo_de_manifest_de_caché">Estructura de un archivo de manifest de caché</h3>
-
-<p>Los archivos de manifest de caché deben enviarse con el tipo MIME <code>text/cache-manifest</code>. Todos los recursos servidos usando este tipo MIME deben seguir la sintaxis para un manifest de caché de aplicación, como se define en esta sección.</p>
-
-<p>Los manifests de caché son archivos de texto en formato UTF-8 y pueden incluír opcionalmente un caracter BOM. Las nuevas líneas pueden ser representadas por salto de línea (<code>U+000A</code>), retorno de carro (<code>U+000D</code>) o ambos retorno de carro y salto de línea.</p>
-
-<p>La primera línea del manifest de caché debe consistir en la cadena <code>CACHE MANIFEST</code> (con un solo espacio <code>U+0020</code> entre ambas palabras), seguido de cero o más espacios con caracteres de tabulación. Cualquier otro texto en la línea es ignorado.</p>
-
-<p>El resto del manifest de caché debe estar compuesto por cero o más de las siguientes líneas:</p>
-
-<dl>
- <dt>Línea en blanco</dt>
- <dd>Se pueden usar líneas en blanco compuestas por cero o más espacios y caracteres de tabulación.</dd>
- <dt>Comentario</dt>
- <dd>Los comentarios consisten en cero o más tabulaciones o espacios seguidos por un caracter <code>#</code> seguido de cero o más caracteres del texto del comentario. Los comentarios pueden usarse solamente en sus propias líneas y no pueden agregarse a otras líneas. Esto signifíca que no puede espcificar identificadores de fragmento.</dd>
- <dt>Encabezado de sección</dt>
- <dd>Los encabezados de sección especifican qué sección del manifest de caché está siendo manipulada. Hay tres encabezados de sección posibles:</dd>
-</dl>
-
-<blockquote>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Encabezado de sección</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td><code>CACHE:</code></td>
-   <td>Cambia a la sección explícita del manifest de caché (esta es la sección predeterminada).</td>
-  </tr>
-  <tr>
-   <td><code>NETWORK:</code></td>
-   <td>Cambia a la sección de lista blanca del manifest de caché.</td>
-  </tr>
-  <tr>
-   <td><code>FALLBACK:</code></td>
-   <td>Cambia a la sección fallback del manifest de caché.</td>
-  </tr>
- </tbody>
-</table>
-</blockquote>
-
-<dl>
- <dd>La línea de encabezado de sección puede incluir espacios en blanco, pero debe incluir los dos puntos (<code>:</code>) en el nombre de sección.</dd>
- <dt>Datos de sección</dt>
- <dd>El formato de las líneas de datos varía de sección a sección. En la sección explícita (<code>CACHE:</code>), cada línea es una URI o referencia IRI a un recurso a guardar en caché (no se permiten caracteres comodines en esta sección). El espacio en blanco se permite antes y después de la URI o IRI en cada línea. En la sección Fallback cada línea es una URI o referencia IRI válida a un recurso, seguida por un recurso de fallback que será enviado cuando la comunicación con el servidor no pueda establecerse. En la sección Network, cada línea es una URI o referencia IRI válida a un recurso a obtener desde la red (se permite el caracter comodín * en esta sección).
- <div class="note"><strong>Nota: </strong>URIs relativas son relativas a la URI del manifest de caché, no a la URI del documento que hace referencia al manifest.</div>
- </dd>
-</dl>
-
-<p>Los archivos de manifest de caché pueden cambiar de sección a sección a voluntad (cada encabezado de sección puede usarse más de una vez) y se permite que las secciones estén vacías.</p>
-
-<h2 id="Recursos_en_un_caché_de_aplicación">Recursos en un caché de aplicación</h2>
-
-<p>Un caché de aplicación siempre incluye al menos un recurso, identificado por URI. Todos los recursos entran en una de las siguientes categorías:</p>
-
-<dl>
- <dt>Entradas maestras</dt>
- <dd>Estos son recursos adicionados al caché porque un contexto de navegación visitado por el usuario incluyó un documento que indicó que estaba en caché usando el atributo <code>manifest</code>.</dd>
- <dt>Entradas explícitas</dt>
- <dd>Estos recursos están listados explícitamente en el archivo de manifest de caché de la aplicación.</dd>
- <dt>Entradas de red</dt>
- <dd>Estos son recursos listados en el archivo de manifest de caché de la aplicación como entradas de red.</dd>
- <dt>Entradas de fallback</dt>
- <dd>Estos son recursos listados en el archivo de manifest de caché de la aplicación como entradas de fallback.</dd>
-</dl>
-
-<div class="note"><strong>Nota:</strong> Los recursos pueden estar etiquetados en múltiples categorías y por lo tanto ser categorizados como entradas múltiples. Por ejemplo, una entrada puede ser explícita y fallback a la vez.</div>
-
-<p>Las categorías de recursos se describen con más detalle debajo.</p>
-
-<h3 id="Entradas_principales">Entradas principales</h3>
-
-<p>Una entrada maestra es cualquier archivo HTML que incluya un atributo {{ htmlattrxref("manifest","html") }} en su elemento {{ HTMLElement("html") }}.  Por ejemplo, digamos que tenemos el archivo <code><a class="linkification-ext external" href="http://www.foo.bar/entry.html" title="Linkification: http://www.foo.bar/entry.html">http://www.ejemplo.com/entrada.html</a></code>, que incluye el siguiente texto:</p>
-
-<pre class="brush: html">&lt;html manifest="ejemplo.appcache"&gt;
-  &lt;h1&gt;Ejemplo de cache de aplicacion&lt;/h1&gt;
-&lt;/html&gt;
-</pre>
-
-<p>Si <code>entrada.html</code> no está listado en el archivo de manifest de caché <code>ejemplo.appcache</code>, visitar la pagina <code>entrada.html</code> causa que se agregue al caché de aplicación el archivo <code>entrada.html</code> como entrada maestra.</p>
-
-<h3 id="Entradas_explícitas">Entradas explícitas</h3>
-
-<p>Las entradas explícitas son recursos que están listados explicitamente en la seccion <code>CACHE </code>de un archivo de manifest de caché.</p>
-
-<h3 id="Entradas_de_red">Entradas de red</h3>
-
-<p>La sección <code>NETWORK</code> de un archivo de manifest de caché especifíca recurso para los cuales una aplicacion web requiere acceso a internet. Las entradas de red en el caché de aplicación son escencialmente una "lista blanca online"—URIs especificadas en la sección <code>NETWORK</code> se cargarán desde el servidor en lugar del caché. Esto permite que el modelo de seguridad del navegador proteja al usuario de problemas de seguridad potenciales al limitar el acceso a recursos aprobados.</p>
-
-<p>Como ejemplo, puedes usar entradas en la seccion red para cargar y ejecutar scripts y otro código desde el servidor en lugar del caché:</p>
-
-<pre>CACHE MANIFEST
-NETWORK:
-/api
-</pre>
-
-<p>La sección de caché de manifest listada debajo asegura que las peticiones para cargar los recursos contenidos en  <code><a class="external" href="http://www.example.com/api/" rel="freelink">http://www.example.com/api/</a></code> siempre van a la red sin intentar acceder a la caché.</p>
-
-<div class="note"><strong>Nota</strong>: <span class="short_text" id="result_box" lang="es"><span class="hps">Simplemente</span> <span class="hps">omitiendo</span> <span class="hps">las entradas</span> principales</span> (archivos que tienen el atributo <code>manifest</code> en el elemento <code>html</code>) del archivo manifest no tendrá el mismo resultado, porque las entradas principales serán agregadas—y posteriormente servida por—la aplicación de caché. </div>
-
-<h3 id="Entradas_fallback">Entradas fallback</h3>
-
-<p>Las entradas fallback son usadas cuando un intento de cargar los recursos falla. Por ejemplo, digamos que el archivo de anifest de caché <code><a class="external" href="http://www.example.com/example.appcache" rel="freelink">http://www.example.com/example.appcache</a></code> incluye el siguiente contenido:</p>
-
-<pre>CACHE MANIFEST
-FALLBACK:
-example/bar/ example.html
-</pre>
-
-<p>Cualquier petición a <code><a class="external" href="http://www.example.com/example/bar/" rel="freelink">http://www.example.com/example/bar/</a></code> o cualquiera de sus directorios <span id="result_box" lang="es"><span class="hps">y</span> <span class="hps">su contenido</span> hace que <span class="hps">el explorador</span> <span class="hps">emita</span> <span class="hps">una solicitud de red</span> <span class="hps">al</span> <span class="hps">intentar cargar el</span> <span class="hps">recurso solicitado</span></span>. Si la petición falla, debido a una falla de la red o un error de servidor de cualquier tipo, el navegador carga el archivo <code>example.html</code> en su lugar.</p>
-
-<h2 id="Estados_de_caché">Estados de caché</h2>
-
-<p>Cada aplicación de caché tiene un <strong>estado</strong>, que indica el estado actual del caché. Cachés que comparten el mismo manifest URI comparten el mismo estado de caché, el cual puede ser uno de los siguientes:</p>
-
-<dl>
- <dt><code>UNCACHED</code></dt>
- <dd><span id="result_box" lang="es"><span class="hps">Un valor</span> <span class="hps">especial que indica</span> <span class="hps">que un objeto</span> <span class="hps">caché de la aplicación</span></span> no está inicializado en su totalidad.</dd>
- <dt><code>IDLE</code></dt>
- <dd>La caché de aplicación no está actualmente en el proceso de actualización.</dd>
- <dt><code>CHECKING</code></dt>
- <dd>El manifest se ha obtenido y revisado para actualizaciones.</dd>
- <dt><code>DOWNLOADING</code></dt>
- <dd>Recursos han sido descargados para ser añadidos al caché, debido a un cambio de recursos de manifest.</dd>
- <dt><code>UPDATEREADY</code></dt>
- <dd>Hay una nueva versión de la aplicación de caché disponible. Hay un correspondiente evento <code>updateready</code>, que es lanzado en lugar del evento <code>cached</code> cuando una nueva actualización acaba de ser descargada pero aún no ah sido activado el método <code>swapCache()</code>.</dd>
- <dt><code>OBSOLETE</code></dt>
- <dd>La aplicación de caché de grupo es ahora obsoleta.</dd>
-</dl>
-
-<h2 id="Probando_para_actualizaciones_para_el_manifest_de_caché">Probando para actualizaciones para el manifest de caché</h2>
-
-<p>Puedes programar para ver si una aplicación tiene un archivo de actualización del manifest de caché, usando JavaScript. Desde que un archio de manifest de caché tiene que ser actualizado antes de que un script adjunte eventos escuchas para probar para actualizaciones, los scripts siempre deben probar <code>window.applicationCache.status</code>.</p>
-
-<pre class="brush: js">function onUpdateReady() {
-  alert('found new version!');
-}
-window.applicationCache.addEventListener('updateready', onUpdateReady);
-if(window.applicationCache.status === window.applicationCache.UPDATEREADY) {
-  onUpdateReady();
-}</pre>
-
-<p> Para comenzar a probar manualmente para un nuevo archivo manifest, puedes usar <code>window.applicationCache.update()</code>.</p>
-
-<h2 id="Contra_indicaciones">Contra indicaciones</h2>
-
-<ul>
- <li>Nunca accesar aplicacines de caché usando los parámetros tradicionales de GET (como <code>other-cached-page.html?parameterName=value</code>). Esto hará que el navegador omita el caché y trate de obtenerlo mediante la red. <span class="short_text" id="result_box" lang="es"><span class="hps">Para enlazar</span> <span class="hps">a los recursos</span> <span class="hps">almacenados en caché</span></span> que tienen parámetros cambiados a JavaScript usa parámetros en la parte del hash del enlace, como <code>other-cached-page.html#whatever?parameterName=value</code>.</li>
- <li>Cuando las aplicaciones son almacenadas en caché, simplemente actualizando los recursos (archivos) que son usados en una página web no son suficientes para actualizar los archivos que han sido almacenados en caché. Debes actualizar el archivo de manifest de caché a sí mismo antes de que el navegador recupere y use los archivos actualizados. Puedes hacer esto programadamente usando <code>window.applicationCache.swapCache()</code>, <span id="result_box" lang="es"><span class="hps">aunque</span> <span class="hps">los recursos</span> <span class="hps">que</span> <span class="hps">ya han sido cargados</span> <span class="hps">no se verán afectados</span></span>. <span id="result_box" lang="es"><span class="hps">Para asegurarse de</span> <span class="hps">que los recursos</span> <span class="hps">se cargan desde</span> <span class="hps">una nueva</span> <span class="hps">versión de la</span> <span class="hps">caché de la aplicación</span><span>,</span> <span class="hps">la actualización de la</span> <span class="hps">página</span> <span class="hps">es ideal</span></span>.</li>
- <li>Es una buena idea colocar cabeceras expiradas en tu sitio para los archivos <code>*.appcache</code> para que caduquen inmediatamente. Esto previene el riesgo de almacenar en caché archivos de manifest. Por ejemplo, en Apache puedes especificar <span id="result_box" lang="es"><span class="hps">una</span> <span class="hps">configuración de este tipo</span> <span class="hps">de la siguiente manera</span></span>:<br>
-  <code>ExpiresByType text/cache-manifest "access plus 0 seconds"</code></li>
-</ul>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4.0</td>
-   <td>3.5</td>
-   <td>10.0</td>
-   <td>10.6</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>2.1</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>11.0</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Nota: Versiones de Firefox anteriores a la 3.5 ignoran las secciones <code>NETWORK y</code> <code>FALLBACK del archivo manifest de caché</code>.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a class="external" href="http://www.html5rocks.com/en/tutorials/appcache/beginner/" title="http://www.html5rocks.com/en/tutorials/appcache/beginner/">HTML5Rocks - A Beginner's Guide to Using the Application Cache</a></li>
- <li><a class="external" href="http://appcachefacts.info/" title="http://appcachefacts.info/">appcachefacts.info</a> - información detallada en AppCache idiosyncrasies</li>
- <li><a class="external" href="http://hacks.mozilla.org/2010/01/offline-web-applications/" title="http://hacks.mozilla.org/2010/01/offline-web-applications/">offline web applications</a> en hacks.mozilla.org - muestras de una aplicacón offline en demo y explica como funciona.</li>
- <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#offline" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#offline">HTML 5 working draft: Offline web applications</a></li>
- <li><a class="external" href="http://developer.teradata.com/blog/js186040/2011/11/html5-cache-manifest-an-off-label-usage" title="http://developer.teradata.com/blog/js186040/2011/11/html5-cache-manifest-an-off-label-usage">HTML5 Cache Manifest: An Off-label Usage</a></li>
- <li>{{ interface("nsIApplicationCache") }}</li>
- <li>{{ interface("nsIApplicationCacheNamespace") }}</li>
- <li>{{ interface("nsIApplicationCacheContainer") }}</li>
- <li>{{ interface("nsIApplicationCacheChannel") }}</li>
- <li>{{ interface("nsIApplicationCacheService") }}</li>
- <li>{{ interface("nsIDOMOfflineResourceList") }}</li>
- <li><a class="external" href="http://www.ibm.com/developerworks/web/library/wa-ffox3/">Prepárate para Firefox 3.0 - Una guía para desarrolladores web para las muchas nuevas características en este navegador tan popular, específicamente las características offline</a> (IBM developerWorks)</li>
-</ul>
-
-<p>{{ HTML5ArticleTOC() }}</p>
-</div>
diff --git a/files/es/web/html/reference/index.html b/files/es/web/html/reference/index.html
new file mode 100644
index 0000000000..d84d2cca45
--- /dev/null
+++ b/files/es/web/html/reference/index.html
@@ -0,0 +1,27 @@
+---
+title: Referencia HTML
+slug: Web/HTML/Reference
+tags:
+  - HTML
+  - Referencia
+  - Web
+translation_of: Web/HTML/Reference
+original_slug: Web/HTML/Referencia
+---
+<div>{{HTMLSidebar}}</div>
+
+<p>Esta referencia <a href="/es/docs/Web/HTML">HTML</a> describe todos los <strong>elementos</strong> y <strong>atributos</strong> de HTML, incluyendo los <strong>atributos globales</strong> que se aplican a todos los elementos.</p>
+
+<dl>
+ <dd></dd>
+ <dt><a href="/es/docs/Web/HTML/Elemento">Referencia de Elementos HTML</a></dt>
+ <dd>Esta página lista todos los elementos HTML</dd>
+ <dt><a href="/es/docs/Web/HTML/Atributos">Referencia de Atributos HTML</a></dt>
+ <dd>Los elementos en HTML tienen atributos; estos son valores adicionales que configuran los elementos o ajustan su comportamiento de diversas formas para cumplir los criterios de los usuarios.</dd>
+ <dt><a href="/es/docs/Web/HTML/Atributos_Globales">Atributos Globales</a></dt>
+ <dd>Los atributos globales son atributos comunes a todos los elementos HTML; pueden usarse en todos los elementos, aunque pueden no tener efecto en algunos de ellos.</dd>
+ <dt><a href="/es/docs/Web/HTML/Tipos_de_enlaces">Tipos de enlaces</a></dt>
+ <dd>En HTML, los siguientes tipos de enlaces indican la relación entre dos documentos, de los cuales uno enlaza al otro usando un elemento &lt;a&gt; o bien &lt;area&gt;, o bien &lt;link&gt;.</dd>
+</dl>
+
+<p><span class="alllinks"><a href="/es/docs/tag/HTML" title="Artículos etiquetados con: HTML">Ver todas las páginas etiquetadas con "HTML"...</a></span></p>
diff --git a/files/es/web/html/referencia/index.html b/files/es/web/html/referencia/index.html
deleted file mode 100644
index 25534cd46f..0000000000
--- a/files/es/web/html/referencia/index.html
+++ /dev/null
@@ -1,26 +0,0 @@
----
-title: Referencia HTML
-slug: Web/HTML/Referencia
-tags:
-  - HTML
-  - Referencia
-  - Web
-translation_of: Web/HTML/Reference
----
-<div>{{HTMLSidebar}}</div>
-
-<p>Esta referencia <a href="/es/docs/Web/HTML">HTML</a> describe todos los <strong>elementos</strong> y <strong>atributos</strong> de HTML, incluyendo los <strong>atributos globales</strong> que se aplican a todos los elementos.</p>
-
-<dl>
- <dd></dd>
- <dt><a href="/es/docs/Web/HTML/Elemento">Referencia de Elementos HTML</a></dt>
- <dd>Esta página lista todos los elementos HTML</dd>
- <dt><a href="/es/docs/Web/HTML/Atributos">Referencia de Atributos HTML</a></dt>
- <dd>Los elementos en HTML tienen atributos; estos son valores adicionales que configuran los elementos o ajustan su comportamiento de diversas formas para cumplir los criterios de los usuarios.</dd>
- <dt><a href="/es/docs/Web/HTML/Atributos_Globales">Atributos Globales</a></dt>
- <dd>Los atributos globales son atributos comunes a todos los elementos HTML; pueden usarse en todos los elementos, aunque pueden no tener efecto en algunos de ellos.</dd>
- <dt><a href="/es/docs/Web/HTML/Tipos_de_enlaces">Tipos de enlaces</a></dt>
- <dd>En HTML, los siguientes tipos de enlaces indican la relación entre dos documentos, de los cuales uno enlaza al otro usando un elemento &lt;a&gt; o bien &lt;area&gt;, o bien &lt;link&gt;.</dd>
-</dl>
-
-<p><span class="alllinks"><a href="/es/docs/tag/HTML" title="Artículos etiquetados con: HTML">Ver todas las páginas etiquetadas con "HTML"...</a></span></p>
diff --git a/files/es/web/html/tipos_de_enlaces/index.html b/files/es/web/html/tipos_de_enlaces/index.html
deleted file mode 100644
index 9cfc5089d5..0000000000
--- a/files/es/web/html/tipos_de_enlaces/index.html
+++ /dev/null
@@ -1,381 +0,0 @@
----
-title: Tipos de enlaces
-slug: Web/HTML/Tipos_de_enlaces
-translation_of: Web/HTML/Link_types
----
-<p>{{HTMLSidebar}}</p>
-
-<p><span class="seoSummary">En HTML, los siguientes tipos de enlaces indican la relación entre dos documentos, de los cuales uno enlaza al otro usando un elemento {{HTMLElement("a")}} o bien {{HTMLElement("area")}}, o bien {{HTMLElement("link")}}.</span></p>
-
-<table class="standard-table">
- <caption>Lista de tipos de link y su significado en HTML</caption>
- <thead>
-  <tr>
-   <th scope="col">Tipo de Link</th>
-   <th scope="col">Descripción</th>
-   <th scope="col" style="width: 12em;">Permitido en estos elementos</th>
-   <th scope="col">No permitido en estos elementos</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>alternate</code></td>
-   <td>
-    <ul>
-     <li>Si el elemento es {{HTMLElement("link")}} y el atributo  {{htmlattrxref("rel", "link")}} tambien contiene el tipo <code>stylesheet</code>, el enlace define una <a href="/en-US/docs/Alternative_style_sheets">hoja de estilo alternativa</a>; en ese caso el atributo {{htmlattrxref("title", "link")}} deberá estar presente y no ser una cadena vacia.</li>
-     <li>Si el atributo {{htmlattrxref("type","link")}} es puesto a <code>application/rss+xml</code> o <code>application/atom+xml</code>, el enlace define un <a href="/en-US/docs/RSS/Getting_Started/Syndicating">feed de distribución</a>. El primero de ellos definido en la pagina es el tomado por default.</li>
-     <li>De otra forma, el enlace define una pagina alternativa, de uno de los siguientes tipos:
-      <ul>
-       <li>para otros medios, como un dispositivo portatil (si el atributo {{htmlattrxref("media","link")}} esta indicado)</li>
-       <li>en otro lenguaje (si el atributo {{htmlattrxref("hreflang","link")}} esta indicado),</li>
-       <li>en otro formato, como un PDF (si el atributo {{htmlattrxref("type","link")}} esta indicado)</li>
-       <li>una combinacion de los anteriores.</li>
-      </ul>
-     </li>
-    </ul>
-   </td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None</em>.</td>
-  </tr>
-  <tr>
-   <td><code>archives</code></td>
-   <td>Define un hipervínculo a un documento que contiene un enlace de archivo a este. Por ejemplo, la entrada de un blog podria enlazar a una página de indice mensual de esta forma.<br>
-    <br>
-    <strong>Nota:</strong> Aunque se reconoce, el singular <code>archive</code> es incorrecto y debe ser evitado.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>author</code></td>
-   <td>Define un hipervinculo a una página describiendo el autor o proporcionando una forma de contactar al autor.<br>
-    <br>
-    <strong>Nota:</strong> Este puede ser un hipervinculo <code>mailto:</code>, pero esto no es recomendable en paginas públicas por que robots cosechadores podrian rápidamente llevar una gran cantidad de span a esa dirección. En ese caso, es mejor mandarlos a una página con un formulario de contacto.<br>
-    <br>
-    Aunque reconocido, el atributo {{htmlattrxref("rev", "link")}} en elementos {{HTMLElement("a")}}, {{HTMLElement("area")}} o {{HTMLElement("link")}} con un enlace de tipo <code>made</code> es incorrecto y debiera ser reemplazado por el atributo {{htmlattrxref("rel", "link")}} con este tipo de enlace.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>bookmark</code></td>
-   <td>Indica que el hipervínculo es un <a href="/en-US/docs/Permalink">permalink</a> al ancestro más cercano del elemento {{HTMLElement("article")}}. Si no hay ninguno, entonces es un permalink para la <a href="/en-US/docs/Sections_and_Outlines_of_an_HTML5_document">sección</a> con la que el elemento está más estrechamente asociado.<br>
-    <br>
-    Esto permite crear marcadores a un artículo en particular dentro de una página con múltiples artículos, como por ejemplo una página con un resumen mensual de un blog, o un agregador de blog.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-   <td>{{HTMLElement("link")}}</td>
-  </tr>
-  <tr>
-   <td><code>external</code></td>
-   <td>Indica que el hipervínculo llevará a una fuente externa al sitio en el que se encuentra la página actual; o lo que es lo mismo, seguir el enlace hará que el usuario abandone el sitio.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-   <td>{{HTMLElement("link")}}</td>
-  </tr>
-  <tr>
-   <td><code>first</code></td>
-   <td>
-    <p>Indica que el hipervínculo conduce al primer recurso de la <em>secuencia</em> en la que se encuentra la página actual.<br>
-      </p>
-
-    <p><strong>Nota:</strong> Otros tipos de enlaces relacionados con los recursos en secuencia son <code>last</code>, <code>prev</code>, <code>next</code>.</p>
-
-    <p>Aunque parezca evidente, los sinónimos <code>being</code> y <code>start</code> son incorrectos y deben evitarse.</p>
-   </td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>help</code><br>
-    {{HTMLVersionInline("5")}}</td>
-   <td>
-    <ul>
-     <li>If the element is {{HTMLElement("a")}} or {{HTMLElement("area")}}, it indicates that the hyperlink leads to a resource giving further help about the parent of the element, and its descendants.</li>
-     <li>If the element is {{HTMLElement("link")}} it indicates that the hyperlink leads to a resource giving further help about the page as a whole.</li>
-    </ul>
-   </td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>icon</code></td>
-   <td>Defines a resource for representing the page in the user interface, usually an icon (auditory or visual).<br>
-    <br>
-    The {{htmlattrxref("media","link")}}, {{htmlattrxref("type","link")}} and {{htmlattrxref("sizes","link")}} attributes allow the browser to select the most appropriate icon for its context. If several resources match, the browser will select the last one declared, in tree order. As these attributes are merely hints, and the resources may be inappropriate upon further inspection, the browser will then select another one, if appropriate.<br>
-    <br>
-    <strong>Note:</strong> Apple's iOS does not use this link type, nor the {{htmlattrxref("sizes","link")}} attribute, like others mobile browsers do, to select a webpage icon for Web Clip or a start-up placeholder. Instead it uses the non-standard <a href="http://edr.euro.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW4"><code>apple-touch-icon</code></a> and <a href="http://edr.euro.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW6"><code>apple-touch-startup-image</code></a> respectively.<br>
-    <br>
-    The <code>shortcut</code> link type is often seen before <code>icon</code>, but this link type is non-conforming, ignored and <strong>web authors must not use it anymore</strong>.</td>
-   <td>{{HTMLElement("link")}}</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-  </tr>
-  <tr>
-   <td><code>index</code></td>
-   <td>Indicates that the page is part of a <em>hierarchical</em> structure and that the hyperlink leads to the top level resource of that structure.<br>
-    <br>
-    If one or several <code>up</code> link types are also present, the number of these <code>up</code> indicates the depth of the current page in the hierarchy.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>last</code></td>
-   <td>Indicates that the hyperlink leads to the <em>last</em> resource of the <em>sequence</em> the current page is in.<br>
-    <br>
-    <strong>Note:</strong> Other link types related to linking resources in the same sequence are <code>first</code>, <code>prev</code>, <code>next</code>.<br>
-    <br>
-    Although recognized, the synomyn <code>end</code> is incorrect and must be avoided.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>license</code></td>
-   <td>Indicates that the hyperlink leads to a document describing the licensing information. If not inside the {{HTMLElement("head")}} element, the standard doesn't distinguish between a hyperlink applying to a specific part of the document or to the document as a whole. Only the data on the page can indicate this.<br>
-    <br>
-    <strong>Note: </strong>Although recognized, the synonym <code>copyright</code> is incorrect and must be avoided.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>next</code></td>
-   <td>Indicates that the hyperlink leads to the <em>next</em> resource of the <em>sequence</em> the current page is in.<br>
-    <br>
-    <strong>Note:</strong> Other link types related to linking resources in the same sequence are <code>first</code>, <code>prev</code>, <code>last</code>.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>nofollow</code></td>
-   <td>Indica que el documento enlazado no cuenta con el aval o aprobación del autor de este documento, por ejemplo si no tiene control sobre el mismo, si es un mal ejemplo o si hay una relación comercial entre los dos (un enlace de pago). Este enlace puede ser usado por algunos motores de búsqueda que usan técnicas de clasificación de popularidad.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-   <td>{{HTMLElement("link")}}</td>
-  </tr>
-  <tr>
-   <td><code>noreferrer</code></td>
-   <td>
-    <p>Prevents the browser, when navigating to another page, to send this page name, or any other value, as referrer via the <code>Referer:</code> HTTP header.<br>
-     (In Firefox, before Firefox 37, this worked only in links found in pages. Links clicked in the UI, like "Open in a new tab" via the contextual menu, doesn't abide for this value)</p>
-   </td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-   <td>{{HTMLElement("link")}}</td>
-  </tr>
-  <tr>
-   <td><code>pingback</code></td>
-   <td>Defines an external resource URI to call if one make a comment or a citation about the webpage. The protocol used to make such a call is defined in the <a href="http://www.hixie.ch/specs/pingback/pingback">Pingback 1.0</a> specification.<br>
-    <br>
-    <strong>Note:</strong> if the <code>X-Pingback:</code> HTTP header is also present, this header has precedence over the {{HTMLElement("link")}} element with this link type</td>
-   <td>{{HTMLElement("link")}}</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-  </tr>
-  <tr>
-   <td><code>preconnect</code> {{experimental_inline}}</td>
-   <td>Hints the browser to open in advance the connection to the linked web site, without disclosing any private information.</td>
-   <td>{{HTMLElement("link")}}</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-  </tr>
-  <tr>
-   <td><code>prefetch</code></td>
-   <td>Hints the browser to fetch in advance the linked resource, as it will likely be requested by the user.<br>
-    <br>
-    <strong>Note:</strong> the <a href="/en-US/docs/Link_prefetching_FAQ">Link Prefetch FAQ</a> has details on which links can be prefetched and on alternative methods.</td>
-   <td>{{HTMLElement("a")}} {{unimplemented_inline}},<br>
-    {{HTMLElement("area")}} {{unimplemented_inline}},<br>
-    {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>preload</code></td>
-   <td>Tells the browser to download a resource because this resource will be needed later during the current navigation.</td>
-   <td>{{HTMLElement("link")}}</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-  </tr>
-  <tr>
-   <td><code>prerender</code> {{experimental_inline}}</td>
-   <td>Comunica al navegador que carge en segundo plano el recurso suministrado (Pagina Web).</td>
-   <td>{{HTMLElement("link")}}</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-  </tr>
-  <tr>
-   <td><code>prev</code></td>
-   <td>Indicates that the hyperlink leads to the <em>preceding</em> resource of the <em>sequence</em> the current page is in.<br>
-    <br>
-    <strong>Note:</strong> other link types related to linking resources in the same sequence are <code>first</code>, <code>last</code>, <code>next</code>.<br>
-    <br>
-    Although recognized, the synomyn <code>previous</code> is incorrect and must be avoided.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>search</code></td>
-   <td>Indicates that the hyperlink reference a document whose interface is specially designing for searching in this document, or site, and its resources.<br>
-    <br>
-    If the {{htmlattrxref("type","link")}} attribute is set to <code>application/opensearchdescription+xml </code>the resource is an <a href="/en-US/docs/Creating_OpenSearch_plugins_for_Firefox">OpenSearch plugin</a> that can be easily added to the interface of some browsers like Firefox or Internet Explorer.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>stylesheet</code></td>
-   <td>Defines an external resource to be used as a stylesheet. If the <code>type</code> is not set, the browser should assume it is a <code>text/css</code> stylesheet until further inspection.<br>
-    <br>
-    If used in combination with the <code>alternate</code> keyword, it defines an <a href="/en-US/docs/Alternative_style_sheets">alternative style sheet</a>; in that case the {{htmlattrxref("title", "link")}} attribute must be present and not be the empty string.</td>
-   <td>{{HTMLElement("link")}}</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}</td>
-  </tr>
-  <tr>
-   <td><code>sidebar</code></td>
-   <td>Indicates that the hyperlink leads to a resource that would be better suited for a secondary browsing context, like a <em>sidebar</em>. Browsers, that don't have such a context will ignore this keyword.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>tag</code></td>
-   <td>Indicates that the hyperlink refers to a document describing a <em>tag</em> that applies to this document.<br>
-    <br>
-    <strong>Note:</strong> this link type should not be set on links to a member of a tag cloud as these do not apply to a single document but to a set of pages.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
-  <tr>
-   <td><code>up</code></td>
-   <td>Indicates that the page is part of a <em>hierarchical</em> structure and that the hyperlink leads to the higher level resource of that structure.<br>
-    <br>
-    The number of <code>up</code> link types indicates the depth difference between the current page and the linked resource.</td>
-   <td>{{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("link")}}</td>
-   <td><em>None.</em></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Specifications" name="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Resource Hints', '#dfn-preconnect', 'preconnect')}}</td>
-   <td>{{Spec2('Resource Hints')}}</td>
-   <td>Added <code>dns-prefetch</code>, <code>preconnect</code>, and <code>prerender</code> values.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML WHATWG', 'semantics.html#the-link-element', '&lt;link&gt;')}}</td>
-   <td>{{Spec2('HTML WHATWG')}}</td>
-   <td>No change since last snapshot ({{SpecName('HTML WHATWG')}})</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML5 W3C', 'document-metadata.html#the-link-element', '&lt;link&gt;')}}</td>
-   <td>{{Spec2('HTML5 W3C')}}</td>
-   <td>Added <code>tag</code>, <code>stylesheet</code>, <code>search</code>, <code>prev</code>, <code>prefetch</code>, <code>noreferrer</code>, <code>nofollow</code>, <code>next</code>, <code>license</code>, <code>icon</code>, <code>help</code>, <code>bookmark</code>, <code>author</code>, and <code>alternate</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('HTML4.01', 'struct/links.html#h-12.3', '&lt;link&gt;')}}</td>
-   <td>{{Spec2('HTML4.01')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>1.0</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Alternative stylesheets</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.9")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>prefetch</code></td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td><code>prerender</code></td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td><code>preconnect</code></td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td><code>dns-prefetch</code></td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Alternative stylesheets</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/html/transision_adaptativa_dash/index.html b/files/es/web/html/transision_adaptativa_dash/index.html
deleted file mode 100644
index da3e0892e4..0000000000
--- a/files/es/web/html/transision_adaptativa_dash/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Transmisión Adaptativa DASH para Video en HTML 5
-slug: Web/HTML/Transision_adaptativa_DASH
-translation_of: Web/Media/DASH_Adaptive_Streaming_for_HTML_5_Video
----
-<p><span class="seoSummary">La Transmisión Adaptable y Dinámica sobre HTTP (DASH - <em>Dynamic Adaptive Streaming over HTTP</em>) es un protocolo de transmisión adaptable.  Esto signfica que le permite a un flujo de vídeo cambiar entre diversas tazas de bits con base en el desempeño de la red, para mantener la reproducción de un vídeo.</span></p>
-
-<h2 id="Soporte_de_Navegadores">Soporte de Navegadores</h2>
-
-<p>Firefox 21 incluye una implementación de DASH para video WebM con HTML5 que está desactivada por defecto. Se puede activar a través de "about:config" activando la opción "media.dash.enabled".</p>
-
-<p>Firefox 23 eliminó el soporte para DASH para WebM con HTML 5.  Ésta será reemplazada por una implementación de la <a href="http://www.w3.org/TR/media-source/">Media Source Extensions API </a>que de soporte a DASH a través de javascript usando librerías como dash.js. Ver el bug <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=778617">778617</a> para más detalles.</p>
-
-<h2 id="Usando_DASH_del_lado_del_servidor">Usando DASH del lado del servidor</h2>
-
-<p>Lo primero que necesitas es convertir tu video WebM en un manifiesto DASH con todos los archivos en los diferentes bitrates. Para comenzar necesitas:</p>
-
-<ul>
- <li>ffpmeg - con libvpx y libvorbis activado para dar soporte al audio y video de WebM (<a href="http://www.ffmpeg.org/" title="http://www.ffmpeg.org/">ffmpeg.org</a>).</li>
- <li>libwebm - concretamente para la herramienta samplemuxer (<span style="text-align: -webkit-auto;"><span style="white-space: pre-wrap;">git clone <a href="https://gerrit.chromium.org/gerrit/p/webm/libwebm.git">https://gerrit.chromium.org/gerrit/p/webm/libwebm.git</a>)</span></span>.</li>
- <li>webm-tools - concretamente para la herramienta de creación de manifiestos, webm_dash_manifest (<span style="text-align: -webkit-auto;"><span style="white-space: pre-wrap;">git clone <a href="https://gerrit.chromium.org/gerrit/p/webm/webm-tools.git">https://gerrit.chromium.org/gerrit/p/webm/webm-tools.git</a>)</span></span>.</li>
-</ul>
-
-<h3 id="1._Use_your_existing_WebM_file_to_create_one_audio_file_and_multiple_video_files.">1. Use your existing WebM file to create one audio file and multiple video files.</h3>
-
-<p>Por ejemplo:</p>
-
-<p>Creamos el archivo de audio usando:</p>
-
-<pre><code>ffmpeg -i my_master_file.webm -vn -acodec libvorbis -ab 128k my_audio.webm</code></pre>
-
-<p>Creamos los archivos de vídeo usando:</p>
-
-<pre><code>ffmpeg -i my_master_file.webm -vcodec libvpx -vb 250k -keyint_min 150 -g 150 -an my_video-250kbps.webm
-ffmpeg -i my_master_file.webm -vcodec libvpx -vb 100k -keyint_min 150 -g 150 -an my_video-100kbps.webm
-ffmpeg -i my_master_file.webm -vcodec libvpx -vb 50k -keyint_min 150 -g 150 -an my_video-50kbps.webm</code></pre>
-
-<h3 id="2._Align_the_clusters_to_enable_switching_at_cluster_boundaries.">2. Align the clusters to enable switching at cluster boundaries.</h3>
-
-<p>For video:</p>
-
-<pre><code>samplemuxer -i my_video-250kbps.webm -o my_video-250kbps-final.webm</code>
-<code>etc.</code></pre>
-
-<p>Although we don't switch audio streams, it's still necessary to run it through samplemuxer to ensure a cues element is added. Note: to be compatible with playing on Chrome, it is suggested to change the track number to something other than the one in the video files, most likely 0.</p>
-
-<pre><code>samplemuxer -i my_audio.webm -o my_audio-final.webm -output_cues 1 -cues_on_audio_track 1 -max_cluster_duration 2 -audio_track_number</code></pre>
-
-<h3 id="3._Create_the_manifest_file">3. Create the manifest file:</h3>
-
-<pre><code>webm_dash_manifest -o my_video_manifest.mpd \
-  -as id=0,lang=eng \
-  -r id=0,file=my_video-250kbps-final.webm \
-  -r id=1,file=my_video-100kbps-final.webm \
-  -r id=2,file=my_video-50kbps-final.webm \
-  -as id=1,lang=eng \
-  -r id=4,file=my_audio-final.webm</code></pre>
-
-<p>Put the manifest and the associated video files on your web server or CDN. DASH works via HTTP, so as long as your HTTP server supports byte range requests, and it's set up to serve .mpd files with mimetype="application/dash+xml", then you're all set.</p>
-
-<h2 id="Using_DASH_-_Client_Side">Using DASH - Client Side</h2>
-
-<p>You'll want to modify your web page to point to the DASH manifest first, instead of directly to a particular video file:</p>
-
-<pre class="brush: html">&lt;video&gt;
-  &lt;source src="movie.<span class="ZmSearchResult" id="DWT648"><span class="ZmSearchResult" id="DWT650">mpd</span></span>"&gt;
-  &lt;source src="movie.webm"&gt;
-  Your browser does not support the video tag.
-&lt;/video&gt;</pre>
-
-<p>That's it! If DASH is supported by the browser, your video will now stream adaptively.</p>
-
-<h2 id="Links">Links</h2>
-
-<p><a href="http://wiki.webmproject.org/adaptive-streaming/webm-dash-specification" title="http://wiki.webmproject.org/adaptive-streaming/webm-dash-specification">WebM DASH Specification at The WebM Project</a></p>
-
-<p><a href="http://dashif.org/" title="http://dashif.org/">DASH Industry Forum</a></p>
diff --git a/files/es/web/html/usando_audio_y_video_con_html5/index.html b/files/es/web/html/usando_audio_y_video_con_html5/index.html
deleted file mode 100644
index 77810a8e65..0000000000
--- a/files/es/web/html/usando_audio_y_video_con_html5/index.html
+++ /dev/null
@@ -1,287 +0,0 @@
----
-title: Usando audio y video con HTML5
-slug: Web/HTML/Usando_audio_y_video_con_HTML5
-tags:
-  - Flash
-  - Ogg
-  - applet
-  - busqueda
-  - errores
-  - especificacion
-  - gestion
-  - opciones
-  - reproduccion
-  - reserva
-translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content
-translation_of_original: Web/Guide/HTML/Using_HTML5_audio_and_video
----
-<p>HTML5 introduce soporte integrado para el contenido multimedia gracias a los elementos {{ HTMLElement("audio") }} y {{ HTMLElement("video") }}, ofreciendo la posibilidad de insertar contenido multimedia en documentos HTML.</p>
-
-<h2 id="Insertando_contenido_multimedia">Insertando contenido multimedia</h2>
-
-<p>Insertar contenido multimedia en tus documentos HTML es muy sencillo:</p>
-
-<div style="overflow: hidden;">
-<pre class="brush: html">&lt;video src="http://v2v.cc/~j/theora_testsuite/320x240.ogg" controls&gt;
-  Tu navegador no implementa el elemento &lt;code&gt;video&lt;/code&gt;.
-&lt;/video&gt;</pre>
-
-<p>Este ejemplo reproduce un vídeo de ejemplo, con los controles de reproducción, desde el sitio Web de Theora.</p>
-
-<p>Este es un ejemplo para insertar <em>audio</em> en tu documento HTML</p>
-
-<pre class="brush: html">&lt;audio src="/test/audio.ogg"&gt;
-&lt;p&gt;Tu navegador no implementa el elemento audio.&lt;/p&gt;
-&lt;/audio&gt;</pre>
-</div>
-
-<p>El atributo <code>src</code> puede ser una URL del archivo de audio o la ruta al archivo en el sistema local.</p>
-
-<div style="overflow: hidden;">
-<pre class="brush: html">&lt;audio src="audio.ogg" controls autoplay loop&gt;
-&lt;p&gt;Tu navegador no implementa el elemento audio&lt;/p&gt;
-&lt;/audio&gt;</pre>
-</div>
-
-<p>Este código de ejemplo usa los atributos del elemento {{ HTMLElement("audio") }}:</p>
-
-<ul>
- <li><code>controls</code> : muestra los controles estándar de HTML5 para audio en una página web.</li>
- <li><code>autoplay</code> : hace que el audio se reproduzca automáticamente.</li>
- <li><code>loop</code> : hace que el audio se repita automáticamente.</li>
-</ul>
-
-<div style="overflow: hidden;">
-<pre class="brush: html">&lt;audio src="audio.mp3" preload="auto" controls&gt;&lt;/audio&gt;</pre>
-</div>
-
-<p>El atributo <code>preload</code> es usado en el elemento audio para almacenar temporalmente (buffering) archivos de gran tamaño. Este puede tomar uno de 3 valores:</p>
-
-<ul>
- <li><code>"none"</code> no almacena temporalmente el archivo</li>
- <li><code>"auto"</code> almacena temporalmente el archivo multimedia</li>
- <li><code>"metadata"</code> almacena temporalmente sólo los metadatos del archivo</li>
-</ul>
-
-<p>Se pueden especificar múltiples fuentes de archivos usando el elemento {{ HTMLElement("source") }} <span id="result_box" lang="es"><span class="hps">con el fin de</span> <span class="hps">proporcionar vídeo</span> <span class="hps">o</span> <span class="hps">audio</span> <span class="hps">codificados en formatos</span> <span class="hps">diferentes</span> <span class="hps">para</span> <span class="hps">diferentes navegadores</span></span>. Por ejemplo:</p>
-
-<pre class="brush: html">&lt;video controls&gt;
-  &lt;source src="foo.ogg" type="video/ogg"&gt;
-  &lt;source src="foo.mp4" type="video/mp4"&gt;
-  Tu navegador no implementa el elemento &lt;code&gt;video&lt;/code&gt;.
-&lt;/video&gt;
-</pre>
-
-<p>Esto reproduce el archivo Ogg en navegadores que admiten el formato Ogg. Si el navegador no admite Ogg, el navegador usará el archivo MPEG-4. Mira también la lista de <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements" title="Media formats supported by the audio and video elements">los formatos multimedia admitidos por los elementos audio y video</a> en los diferentes navegadores.</p>
-
-<p>También puedes especificar qué codecs requiere el archivo multimedia; de esta forma el navegador tomará decisiones más inteligentes:</p>
-
-<pre class="brush: html">&lt;video controls&gt;
-  &lt;source src="foo.ogg" type="video/ogg; codecs=dirac, speex"&gt;
-  Tu navegador no implementa el elemento &lt;code&gt;video&lt;/code&gt;.
-&lt;/video&gt;</pre>
-
-<p>Aquí, especificamos que el vídeo usa los codecs Dirac y Speex. Si el navegador implementa Ogg, pero no los codecs especificados, el vídeo no será cargado.</p>
-
-<p>Si el atributo <code>type</code> no está especificado, el tipo de contenido multimedia se obtiene del servidor <span id="result_box" lang="es"><span class="hps">y</span> se <span class="hps">comprueba para</span> <span class="hps">ver</span> <span class="hps">si el navegador</span> <span class="hps">lo puede manejar</span></span>; si no puede ser mostrado, se comprueba el siguiente <code>source</code> , si ninguno de los elementos <code>source</code> especificados pueden ser usados, un evento de <code>error</code> es enviado al elemento <code>video</code>. Si el atributo <code>type</code> está especificado, es comparado con los tipos que el navegador puede reproducir, y si no es reconocido, no se hace la consulta al servidor; en su lugar, el siguiente <code>source</code> se comprueba una vez.</p>
-
-<p>Mira <a href="/en-US/docs/DOM/Media_events" title="https://developer.mozilla.org/en/DOM/Media_events">los eventos del contenido multimedia</a> para una lista completa de eventos asociados con la producción multimedia. Para detalles en los formatos multimedia soportados por los diferentes navegadores, mira <a href="/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements" title="Media formats supported by the audio and video elements">los formatos multimedia sportados por los elementos audio y video</a>.</p>
-
-<h2 id="Controlando_la_reproducción_multimedia">Controlando la reproducción multimedia</h2>
-
-<p>Una vez que has incrustado el contenido multimedia en tu documento HTML usando los nuevos elementos, puedes controlarlos mediante programación en JavaScript. Por ejemplo, para iniciar (o reiniciar) la reproducción, puedes hacer esto:</p>
-
-<pre class="brush: js">var v = document.getElementsByTagName("video")[0];
-v.play();
-</pre>
-
-<p>La primera línea obtiene el primer elemento video en el documento, y la segunda línea llama al método <a href="/en-US/docs/XPCOM_Interface_Reference/NsIDOMHTMLMediaElement#play()" title="nsIDOMHTMLMediaElement#play()"><code>play()</code></a> del elemento, como está definido en la interfaz {{ interface("nsIDOMHTMLMediaElement") }} que es usada para implementar los elementos multimedia.</p>
-
-<p>Controlar un reproductor de audio en HTML5 para reproducir, pausar, aumentar y disminuir el volumen usando algo de Javascript es muy sencillo.</p>
-
-<pre class="brush: html">&lt;audio id="demo" src="audio.mp3"&gt;&lt;/audio&gt;
-&lt;div&gt;
-  &lt;button onclick="document.getElementById('demo').play()"&gt;Reproducir el Audio&lt;/button&gt;
-  &lt;button onclick="document.getElementById('demo').pause()"&gt;Pausar el Audio&lt;/button&gt;
-  &lt;button onclick="document.getElementById('demo').volume+=0.1"&gt;Aumentar el Volumen&lt;/button&gt;
-  &lt;button onclick="document.getElementById('demo').volume-=0.1"&gt;Disminuir el Volumen&lt;/button&gt;
-&lt;/div&gt;
-</pre>
-
-<h2 id="Deteniendo_la_descarga_de_contenido_multimedia">Deteniendo la descarga de contenido multimedia</h2>
-
-<p>Mientras que detener la reproducción multimedia es tan fácil como llamar al método pause() del elemento, el navegador sigue descargando el contenido multimedia hasta que el elemento multimedia es eliminado <span id="result_box" lang="es"><span class="hps">a través de</span> <span class="hps">la recolección de basura</span></span>.</p>
-
-<p>Aquí un truco para detener la descarga de una sola vez:</p>
-
-<pre class="brush: js">var mediaElement = document.getElementById("myMediaElementID");
-mediaElement.pause();
-mediaElement.src = "";
-</pre>
-
-<p>Estableciendo una cadena vacía al atributo <code>src</code> del elemento multimedia, tu destruyes el decodificador interno del elemento con lo que detienes la descarga.</p>
-
-<h2 id="Buscando_a_través_de_los_medios" style="margin: 0px 0px 0.8em; padding: 0px;">Buscando a través de los medios</h2>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><font>Los elementos de los medios proporcionan apoyo para mover la posición de reproducción actual a puntos específicos en el contenido de los medios. </font>Esto se hace estableciendo el valor de la propiedad <code style="font-size: 14px;">horaActual</code> en el elemento; ver <a class="new" href="https://developer.mozilla.org/es/docs/Web/API/HTMLMediaElement" title="/ Es / docs / Web / API / HTMLMediaElement"><code style="font-size: 14px;">HTMLMediaElement</code></a> para más detalles sobre las propiedades del elemento. Basta con establecer el valor en el tiempo, en segundos, con el que desea reproducir para continuar.</p>
-
-<p><span style="line-height: 1.5em;">Usted puede utilizar el elemento </span><code style="font-size: 14px;">seekable</code><span style="line-height: 1.5em;"> propiedad para determinar los rangos de los medios de comunicación que están disponibles para la búsqueda de la actualidad. Esto devuelve un objeto </span><a class="new" href="https://developer.mozilla.org/es/docs/Web/API/TimeRanges" style="line-height: 1.5em;" title="/ Es / docs / Web / API / TimeRanges"><code style="font-size: 14px;">TimeRanges</code></a><span style="line-height: 1.5em;"> que enumera los rangos de veces que se puede tratar de:</span></p>
-
-<pre class="brush: js">var mediaElement = document.getElementById('mediaElementID');
-mediaElement.seekable.start();  // Returns the starting time (in seconds)
-mediaElement.seekable.end();    // Returns the ending time (in seconds)
-mediaElement.currentTime = 122; // Seek to 122 seconds
-mediaElement.played.end();      // Returns the number of seconds the browser has played
-</pre>
-
-<h2 id="Especificación_del_rango_de_reproducción" style="margin: 0px 0px 0.8em; padding: 0px;"><font>Especificación del rango de reproducción</font></h2>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Al especificar el URI de los medios de comunicación para un elemento <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/audio"><code style="font-size: 14px;">&lt;audio&gt;</code></a> o <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/video"><code style="font-size: 14px;">&lt;video&gt;</code></a> , puede incluir opcionalmente información adicional para especificar la parte de los medios a reproducir. Para ello, añada una almohadilla ("#"), seguida de la descripción del fragmento de medios.</p>
-
-<p><span style="line-height: 1.5em;">Un intervalo de tiempo se especifica mediante la sintaxis:</span></p>
-
-<pre>#t=[starttime][,endtime]</pre>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><font>El tiempo se puede especificar como un número de segundos (como un valor de punto flotante) o como una hora / minuto / segundo tiempo separado con dos puntos (por ejemplo, 2:05:01 durante 2 horas, 5 minutos y 1 segundo).</font></p>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Algunos ejemplos:</p>
-
-<dl>
-</dl>
-
-<dl>
- <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t = 10,20</span></dt>
- <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo debe desempeñar el rango de 10 segundos a través de 20 segundos.</dd>
- <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t =, 10.5</span></dt>
- <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo se reproducirá desde el principio a través de 10,5 segundos.</dd>
- <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t =, 02:00:00</span></dt>
- <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo se reproducirá desde el principio a través de dos horas.</dd>
- <dt style="margin: 0px; padding: 0px; line-height: 22px;"><span class="nowiki">http://foo.com/video.ogg # t = 60</span></dt>
- <dd style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">Especifica que el vídeo se debe reproducir desde los 60 segundos hasta el final.</dd>
-</dl>
-
-<div class="geckoVersionNote" style="">
-<p>{{ gecko_callout_heading("9.0") }}</p>
-<font><font>La porción rango de reproducción del elemento de la especificación URI media esta en Gecko 9.0 (Firefox 9.0 / Thunderbird 9.0 / SeaMonkey 2.6). </font><font>En este momento, esta es la única parte de la </font></font><a class="external" href="http://www.w3.org/TR/media-frags/" style="padding-right: 16px; line-height: 21px;" title="http://www.w3.org/TR/media-frags/"><font>especificación de los medios de comunicación Fragmentos URI</font></a><font><font>implementado por el Gecko, y sólo se puede utilizar cuando se especifica la fuente para los elementos de los medios de comunicación, y no en la barra de direcciones.</font></font>
-
-<p> </p>
-</div>
-
-<h2 id="Opciones_de_reserva" style="margin: 0px 0px 0.8em; padding: 0px;">Opciones de reserva</h2>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">HTML incluido entre, por ejemplo, las etiquetas de apertura y cierre de los elementos de los medios de comunicación son procesados ​​por los navegadores que no admitan medios de HTML5. Usted puede tomar ventaja de este hecho para proporcionar medios alternativos de reserva para esos navegadores.</p>
-
-<p><span style="line-height: 1.5em;">Esta sección proporciona dos opciones de reserva para video. </span><font>En cada caso, si el navegador soporta vídeo HTML5, que se utiliza, de lo contrario, se utiliza la opción de reserva.</font></p>
-
-<h3 id="Utilización_de_Flash" style="margin: 0px 0px 0.8em; padding: 0px;">Utilización de Flash</h3>
-
-<p><span style="line-height: 1.5em;">Puede usar Flash para reproducir una película formato Flash si el </span><a href="https://developer.mozilla.org/es/docs/HTML/Elemento/video" style="line-height: 1.5em;"><code style="font-size: 14px;">&lt;video&gt;</code></a><span style="line-height: 1.5em;"> no se admite elemento</span><span style="line-height: inherit;">:</span></p>
-
-<pre class="brush: html">&lt;video src="video.ogv" controls&gt;
-    &lt;object data="flvplayer.swf" type="application/x-shockwave-flash"&gt;
-      &lt;param value="flvplayer.swf" name="movie"/&gt;
-    &lt;/object&gt;
-&lt;/video&gt;</pre>
-
-<p><font>Tenga en cuenta que no se debe incluir </font><code style="font-size: 14px;">classid</code><font> en el </font><code style="font-size: 14px;">objeto</code><font> tag con el fin de ser compatible con los navegadores que no sean Internet Explorer.</font></p>
-
-<p> </p>
-
-<p> </p>
-
-<p> </p>
-
-<h3 id="Reproducción_de_vídeos_Ogg_utilizando_un_applet_de_Java" style="margin: 0px 0px 0.8em; padding: 0px;"><font>Reproducción de vídeos Ogg utilizando un applet de Java</font></h3>
-
-<p><span style="line-height: 1.5em;">Hay un applet de Java llamada </span><a class="external" href="http://maikmerten.livejournal.com/2256.html" style="line-height: 1.5em; padding-right: 16px; background-color: transparent;" title="http://maikmerten.livejournal.com/2256.html">Cortado</a><span style="line-height: 1.5em;"> que se puede utilizar como reserva para reproducir vídeos Ogg en los navegadores que no tienen soporte para Java, pero no es compatible con vídeo HTML5</span><span style="line-height: inherit;">:</span></p>
-
-<pre class="brush: html">&lt;video src="my_ogg_video.ogg" controls width="320" height="240"&gt;
-  &lt;object type="application/x-java-applet" width="320" height="240"&gt;
-     &lt;param name="archive" value="cortado.jar"&gt;
-     &lt;param name="code" value="com.fluendo.player.Cortado.class"&gt;
-     &lt;param name="url" value="my_ogg_video.ogg"&gt;
-     &lt;p&gt;You need to install Java to play this file.&lt;/p&gt;
-  &lt;/object&gt;
-&lt;/video&gt;</pre>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><font>Si no se crea un elemento secundario alternativa del elemento de objeto cortado, como el </font><a href="https://developer.mozilla.org/es/docs/HTML/Elemento/p"><code style="font-size: 14px;"><font>&lt;p&gt;</font></code></a><font> elemento superior, Firefox 3.5 instalaciones que manejan el video de forma nativa, pero no tienen Java instalado incorrectamente informarán al usuario de que es necesario instalar un plugin para ver el contenido en la página.</font></p>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"> </p>
-
-<div style="line-height: 22px;"><span class="geckoMinVerMethod indicatorInHeadline minVer">(Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)</span>
-
-<h1 id="Gestión_de_errores" style="margin: 0px 0px 0.8em; padding: 0px; font-size: 1.857em;">Gestión de errores</h1>
-</div>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"> </p>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">A partir de Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1), el tratamiento de errores se ha revisado para que coincida con la última versión de la especificación HTML5. En lugar de que el <code style="font-size: 14px;">error sea</code> enviado al elemento en sí, ahora se entrega a los elementos "hijos" <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> correspondientes a las fuentes que resultan en el error.</p>
-
-<p><span style="line-height: 1.5em;">Esto permite detectar las fuentes no pudieron cargar, que puede ser útil. Considere este HTML</span><span style="line-height: inherit;">:</span></p>
-
-<pre class="brush: html">&lt;video&gt;
-&lt;source id="mp4_src"
-  src="video.mp4"
-  type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'&gt;
-&lt;/source&gt;
-&lt;source id="3gp_src"
-  src="video.3gp"
-  type='video/3gpp; codecs="mp4v.20.8, samr"'&gt;
-&lt;/source&gt;
-&lt;source id="ogg_src"
-  src="video.ogv"
-  type='video/ogg; codecs="theora, vorbis"'&gt;
-&lt;/source&gt;
-&lt;/video&gt;</pre>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Dado que Firefox no es compatible con MP4 y 3GP, debido a su naturaleza de patente gravado, los <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> elementos con el ID "mp4_src" y "3gp_src" recibirán <code style="font-size: 14px;">error</code> eventos antes de cargar el recurso Ogg. Las fuentes son juzgados en el orden en el que aparecen, y una vez que uno carga con éxito, las fuentes restantes no se trataron en absoluto.</p>
-
-<h3 id="Detectar_si_las_fuentes_no_han_cargado" style="margin: 0px 0px 0.8em; padding: 0px;">Detectar si las fuentes no han cargado</h3>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;"><code>Para detectar qué todos los elementos </code><a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> no han podido cargarse, se debe comprobar el valor de la propiedad <code style="font-size: 14px;">NetworkState</code> qué poseen todos los elementos de tipo multimedia. Si el valor es <code style="font-size: 14px;">HTMLMediaElement.NETWORK_NO_SOURCE</code>, se sabrá que las fuentes no se cargaron correctamente.</p>
-
-<p style="margin: 0px 0px 1.286em; padding: 0px; line-height: 1.5em;">Si en ese momento se agrega otra fuente mediante la inserción de un nuevo elemento <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> como hijo del elemento multimedia, Gecko intenta cargar el recurso especificado.</p>
-
-<h3 id="Mostrando_contenido_fallback_cuando_la_fuente_no_puede_ser_cargada">Mostrando contenido <em>fallback</em> cuando la fuente no puede ser cargada</h3>
-
-<p>Otra forma de mostrar el contenido <em>fallback</em> de un vídeo cuando ninguna de sus fuentes pudieron ser cargadas, es añadir un manejador de excepciones o errores en el último elemento {{ HTMLElement("source") }}. Así usted podrá reemplazar el vídeo con el contenido <em>fallback</em>:</p>
-
-<pre class="brush: html  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>video</span> <span class="attr-name token">controls</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>source</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>dynamicsearch.mp4<span class="punctuation token">"</span></span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>video/mp4<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>source</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>a</span> <span class="attr-name token">href</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>dynamicsearch.mp4<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-    <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>img</span> <span class="attr-name token">src</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>dynamicsearch.jpg<span class="punctuation token">"</span></span> <span class="attr-name token">alt</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>App de b&amp;uaacute;squeda din&amp;aacute;mica en Firefox OS<span class="punctuation token">"</span></span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>a</span><span class="punctuation token">&gt;</span></span>
-  <span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>p</span><span class="punctuation token">&gt;</span></span>Clic en la im&amp;aacute;gen para reproducir un v&amp;iacute;deo demo de la app de b&amp;uaacute;squeda din&amp;aacute;mica&lt;<span class="tag token"><span class="tag token"><span class="punctuation token">/</span>p</span><span class="punctuation token">&gt;</span></span>
-<span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>video</span><span class="punctuation token">&gt;</span></span></code></pre>
-
-<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">var</span> v <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelector<span class="punctuation token">(</span></span><span class="string token">'video'</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
-    sources <span class="operator token">=</span> v<span class="punctuation token">.</span><span class="function token">querySelectorAll<span class="punctuation token">(</span></span><span class="string token">'source'</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
-    lastsource <span class="operator token">=</span> sources<span class="punctuation token">[</span>sources<span class="punctuation token">.</span>length<span class="number token">-1</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
-lastsource<span class="punctuation token">.</span><span class="function token">addEventListener<span class="punctuation token">(</span></span><span class="string token">'error'</span><span class="punctuation token">,</span> <span class="keyword token">function</span><span class="punctuation token">(</span>ev<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">var</span> d <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement<span class="punctuation token">(</span></span><span class="string token">'div'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  d<span class="punctuation token">.</span>innerHTML <span class="operator token">=</span> v<span class="punctuation token">.</span>innerHTML<span class="punctuation token">;</span>
-  v<span class="punctuation token">.</span>parentNode<span class="punctuation token">.</span><span class="function token">replaceChild<span class="punctuation token">(</span></span>d<span class="punctuation token">,</span> v<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span><span class="punctuation token">,</span> <span class="keyword token">false</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<h2 id="sect1" style="margin: 0px 0px 0.8em; padding: 0px;"> </h2>
-
-<h2 id="Véase_también" style="margin: 0px 0px 0.8em; padding: 0px;">Véase también</h2>
-
-<ul style="margin: 0px 0px 1.286em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; line-height: 22px;">
- <li>Los elementos relacionados con los medios HTML: <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/audio"><code style="font-size: 14px;">&lt;audio&gt;</code></a> , <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/video"><code style="font-size: 14px;">&lt;video&gt;</code></a> , <a href="https://developer.mozilla.org/es/docs/HTML/Elemento/source"><code style="font-size: 14px;">&lt;source&gt;</code></a> ;</li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Manipulating_video_using_canvas" title="Vídeo Manipular con tela">Vídeo Manipular con canvas</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Introducing_the_Audio_API_Extension" title="Presentación de la extensión de API Audio">Presentación de la extensión de API Audio</a></li>
- <li><code style="font-size: 14px;"><a class="external" href="http://developer.mozilla.org/es/docs/XPCOM_Interface_Reference/nsIDOMHTMLMediaElement" style="padding-right: 16px; background-color: transparent;">nsIDOMHTMLMediaElement</a></code></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Media_formats_supported_by_the_audio_and_video_elements" title="Formatos de los medios admitidos por los elementos de audio y vídeo">Formatos de los medios admitidos por los elementos de audio y vídeo</a></li>
- <li><a class="external" href="http://en.flossmanuals.net/ogg-theora/" style="padding-right: 16px; background-color: transparent;" title="http://en.flossmanuals.net/ogg-theora/">Theora Cookbook</a></li>
- <li><a class="external" href="http://popcornjs.org/" style="padding-right: 16px; background-color: transparent;" title="http://popcornjs.org/">Popcorn.js - Media Framework HTML5</a></li>
- <li><a class="external" href="http://www.html5video.org/kaltura-html5/" style="padding-right: 16px; background-color: transparent;" title="http://www.html5video.org/kaltura-html5/">Kaltura Solución videoteca</a> , una biblioteca de JavaScript (mwEmbed) que soporta un retorno sin problemas con HTML5, VLC Player, Java Cortado y OMTK Vorbis reproductor de Flash. (Es utilizado por Wikimedia)</li>
- <li><a class="external" href="http://omtk.org/flash/index.html" style="padding-right: 16px; background-color: transparent;" title="http://omtk.org/flash/index.html">OMTK - flash</a> , una biblioteca de Flash que implementa un decodificador Vorbis</li>
- <li><a class="external" href="http://www.projekktor.com/" style="padding-right: 16px; background-color: transparent;" title="http://www.projekktor.com">Projekktor jugador</a> , un contenedor de JavaScript para audio vídeo-tags con fallback flash, de código abierto, GPL</li>
- <li><a class="external" href="http://www.theora.org/cortado/" style="padding-right: 16px; background-color: transparent;" title="http://www.theora.org/cortado/">Applet Cortado</a> , una solución de reproducción de audio / vídeo en Java que mantiene Xiph.org</li>
- <li><a class="external" href="http://videojs.com/" style="padding-right: 16px; background-color: transparent;" title="Video.js HTML5 Video Player">Video.JS</a> , un reproductor de vídeo HTML5 de código abierto y un marco.</li>
- <li><a class="external" href="http://mediaelementjs.com/" style="padding-right: 16px; background-color: transparent;" title="http://mediaelementjs.com/">MediaElement.js</a> - marco audio / video HTML5 de código abierto con una cuña de Flash personalizada que imitan API multimedia HTML5 para exploradores más antiguos.</li>
- <li><a class="external" href="http://www.hdwebplayer.com/" style="padding-right: 16px; background-color: transparent;" title="http://www.hdwebplayer.com">FLV Player</a> - HTML5 reserva soporte del reproductor de vídeo</li>
-</ul>
-
-<p><span style="line-height: inherit;">{{ HTML5ArticleTOC() }}</span></p>
diff --git a/files/es/web/html/using_the_application_cache/index.html b/files/es/web/html/using_the_application_cache/index.html
new file mode 100644
index 0000000000..65a9554239
--- /dev/null
+++ b/files/es/web/html/using_the_application_cache/index.html
@@ -0,0 +1,383 @@
+---
+title: Usar el caché de aplicaciones
+slug: Web/HTML/Using_the_application_cache
+tags:
+  - Firefox 3.5
+  - HTML5
+  - aplicaciones web sin conexión
+  - para_revisar
+translation_of: Web/HTML/Using_the_application_cache
+original_slug: Web/HTML/Recursos_offline_en_firefox
+---
+<h2 id="Introducción">Introducción</h2>
+
+<p><a href="https://developer.mozilla.org/en-US/docs/HTML/HTML5" title="/en-US/docs/HTML/HTML5">HTML5</a> proporciona un mecanismo de <em>caché de aplicación</em> que permite que las aplicaciones basadas en la web se ejecuten sin conexión. Los desarrolladores pueden usar la interface de <strong>Caché de aplicaciones</strong> (<em>AppCache</em>) para especificar los recursos que el navegador debería guardar en caché y tener disponibles para los usuarios cuando no estén conectados. Las aplicaciones que están en caché se cargan y funcionan correctamente aunque los usuarios hagan clic en el botón recargar cuando no están conectados.</p>
+
+<p>Usar el caché de aplicaciones le da a la aplicación los siguientes beneficios:</p>
+
+<ul>
+ <li>Navegación sin conexión: los usuarios pueden navegar un sitio aún cuando no estén conectados.</li>
+ <li>Velocidad: los recursos en caché son locales, y por lo tanto, se cargan más rápido.</li>
+ <li>Carga al servidor reducida: el navegador solamente descarga desde el servidor recursos que han cambiado..</li>
+</ul>
+
+<h3 id="¿Cómo_funciona_el_caché_de_aplicaciones">¿Cómo funciona el caché de aplicaciones?</h3>
+
+<h3 id="Habilitando_caché_de_aplicaciones">Habilitando caché de aplicaciones</h3>
+
+<p>Para habilitar el caché de aplicaciones, debe incluir el atributo {{htmlattrxref("manifest", "html")}} en el elemento {{HTMLElement("html")}} en las páginas de sus aplicaciones, como se muestra en el siguiente ejemplo:</p>
+
+<div>
+<pre class="brush: html"><span class="brush: html">&lt;html manifest="ejemplo.appcache"&gt; </span>
+  ...
+&lt;/html&gt;
+</pre>
+</div>
+
+<p>El atributo manifest referencia un archivo <strong>manifest de caché</strong>, que es un archivo de texto que lista los recursos (archivos) que el navegador deberá guardar en caché para la aplicación.</p>
+
+<p>Debería incluir el atributo <code>manifest</code> en cada página de la aplicación que quiera guardar en caché. El navegador no guardará páginas que no contengan el atributo  <code>manifest</code>, a menos que esas páginas estén específicamente listadas en el archivo manifest en sí mismo. No es necesario listar todas las páginas que se quieran guardar en caché en el archivo de manfifesto, el navegador implícitamente agrega cada página que el usuario visite y tenga el atributo <code>manifest</code> establecido para caché de aplicación.</p>
+
+<p>Algunos navegadores (ej. Firefox) muestran una notificación la primera vez que un usuario carga una aplicación que usa caché de aplicaciones La barra de notificaciones muestra un mensaje parecido a :</p>
+
+<p style="margin-left: 40px;">Este sitio web (<code>www.ejemplo.com</code>) está pidiendo guardar datos en su equipo para usar sin conexión. [Permitir] [Nunca para este sitio] [No por ahora]</p>
+
+<p>El término "offline(-enabled) applications" a veces se refiere específicamente a aplicaciones a las que el usuario ha permitido que usen capacidades sin conexión.</p>
+
+<h3 id="Cargando_documentos">Cargando documentos</h3>
+
+<div>
+<p>Es uso de caché de aplicaciones modifica el proceso normal de la carga de un documento:</p>
+
+<ul>
+ <li>Si existe caché de aplicaciones, el navegador carga el documento y sus recursos asociados directamente desde ahí, sin acceder a la red. Esto acelera el tiempo de carga del documento.</li>
+ <li>El navegador entonces verifíca si hubo actualizaciones al manifest de caché en el servidor.</li>
+ <li>Si el manifest de caché fue actualizado, el navegador descarga la nueva versión del archivo y de los recursos listados en él. Esto se realiza en segundo plano y no afecta el rendimiento de forma significativa.</li>
+</ul>
+
+<p>El proceso para cargar documentos y actualizar el caché de aplicaciones está especificado con gran detalle aquí debajo:</p>
+</div>
+
+<ol>
+ <li>Cuando el navegador visita un documento que incluye el atributo <code>manifest</code>, si no existe caché de aplicaciones, el navegador carga el documento y baja todas las entradas listadas en el archivo del manifest, creando la primera versón de caché de aplicaciones. </li>
+ <li>Posteriores visitas a ese documento causan que el navegador cargue el documento y otros archivos especificados en el manifest desde el caché de aplicaciones (no desde el servidor). Además, el navegador envía un evento <code>checking</code> al objeto <code><a href="https://developer.mozilla.org/en/DOM/window.applicationCache" title="en/DOM/window.applicationCache">window.applicationCache</a></code> y descarga el archivo de manifest, siguiendo las reglas de caché HTTP apropiadas.</li>
+ <li>Si la copia del manifest actualmente en caché está actualizada, el navegador envía un evento <code>noupdate</code> al objeto <code>applicationCache</code> y el proceso de actualización está completo. Hay que tener en cuenta que si se cambia en el servidor cualquier recurso en caché, se deberá cambiar también el archivo de manifest, para que el navegador sepa que deberá descargar los recursos nuevamente.</li>
+ <li>Si el archivo de manifest <em>ha</em> cambiado, todos los archivos listados en el manifest—así como los que se agregaron al caché llamando <code><a href="https://developer.mozilla.org/en/nsIDOMOfflineResourceList#add.28.29" title="en/nsIDOMOfflineResourceList#add.28.29">applicationCache.add()</a></code>—se descargarán en un caché temporario, siguiendo las reglas de caché  HTTP apropiadas. Para cada archivo descargado en este caché temporario, el navegador envía un evento <code>progress</code> al objeto <code>applicationCache</code>. Si ocurre cualquier error, el navegador envía un evento <code>error</code> y la actualización se detiene.</li>
+ <li>Una vez que todos los archivos han sido recuperados exitosamente, son movidos al caché sin conexión real automáticamente y un evento <code>cached</code> es enviado al objeto <code>applicationCache</code>. Como el documento ya ha sido cargado en el navegador desde caché, la actualización no se mostrará hasta que el documento sea re-cargado (ya sea manualmente o por programa).</li>
+</ol>
+
+<h2 id="Ubicación_del_almacenamiento_y_limpiando_el_caché_sin_conexión">Ubicación del almacenamiento y limpiando el caché sin conexión</h2>
+
+<p>En Chrome se puede limpiar el caché sin conexión seleccionando "Clear browsing data..." en las preferencias o visitando <a class="external" title="chrome://appcache-internals/">chrome://appcache-internals/</a>. Safari tiene una configuración similar"Vaciar cache" en sus preferencias, pero se requiere el reinicio del navegador.</p>
+
+<p>En Firefox, el caché sin conexión se guarda en un lugar separado del perfil de Firefox profile—cerca del caché de disco regular:</p>
+
+<ul>
+ <li>Windows Vista/7: <code>C:\Users\&lt;usuario&gt;\AppData\<strong>Local</strong>\Mozilla\Firefox\Profiles\&lt;salt&gt;.&lt;nombre de perfil&gt;\OfflineCache</code></li>
+ <li>Mac/Linux: <code>/Users/&lt;usuario&gt;/Library/Caches/Firefox/Profiles/&lt;salt&gt;.&lt;nombre de perfil&gt;/OfflineCache</code></li>
+</ul>
+
+<p>En Firefox el estado actual del caché de aplicaciones puede ser inspeccionado en la página the <code>about:cache</code> (debajo del encabezado "Offline cache device"). El caché sin conexión pude limpiarse para cada sitio por separado usando el botón "Eliminar..." Herramientas -&gt; Opciones -&gt; Avanzadas -&gt; Red -&gt; Datos sin conexión.</p>
+
+<p>Antes de Firefox 11, ni Herramientas -&gt; Limpiar historial reciente ni Herramientas -&gt; Opciones -&gt; Avanzadas -&gt; Red -&gt; Datos sin conexión -&gt; Limpiar ahora borraban el caché sin conexión. Esto ha sido solucionado.</p>
+
+<p>Véase también <a href="https://developer.mozilla.org/en/DOM/Storage#Storage_location_and_clearing_the_data" title="en/DOM/Storage#Storage location and clearing the data">limpiar los datos de almacenamiento de DOM</a>.</p>
+
+<div>
+<p>Los cachés de aplicaciones también pueden quedar obsoletos. Si el archivo de manifest de una aplicación es eliminado del servidor, el navegador elimina todo caché de la aplicación que use aquel manifest y envía un evento "obsoleted" al objeto <code>applicationCache</code>. Esto cambia el estado de caché de la aplicación a <code>OBSOLETE</code>.</p>
+</div>
+
+<h2 id="El_archivo_de_manifest_de_caché">El archivo de manifest de caché</h2>
+
+<h3 id="Referenciando_un_archivo_de_manifest_de_caché">Referenciando un archivo de manifest de caché</h3>
+
+<p>El atributo <code>manifest</code> en una aplicación web puede especificar ya sea la ruta relativa de un archivo de manifest de caché o una URL absoluta (URLs absolutas deben estar en el mismo origen que la aplicación). Un archivo de manifest de caché puede tener cualquier extensión de archivo, pero debe ser enviada con el tipo MIME <code>text/cache-manifest</code>.</p>
+
+<div class="note"><strong>Nota: </strong>En servidores Apache, el tipo MIME para los archivos de manifest (.appcache) puede establecerse agregando <code>AddType text/cache-manifest .appcache</code> a un archivo .htaccess dentro del directorio raíz o del mismo directorio que la aplicación.</div>
+
+<h3 id="Entradas_en_el_archivo_de_manifest_de_caché">Entradas en el archivo de manifest de caché</h3>
+
+<p>El archivo de manifest de caché es un archivo de texto simple que lista los recursos que el navegador debería guardar en caché para acceder sin conexión. Los recursos son identificados por URI. Las entradas listadas en el manifest de caché deben tener el mismo esquema, servidor y puerto que el manifest. </p>
+
+<h3 id="Ejemplo_1_un_archivo_de_manifest_de_caché_simple">Ejemplo 1: un archivo de manifest de caché simple</h3>
+
+<div>
+<p>El siguiente es un archivo de manifest de caché simple, <code>ejemplo.appcache</code>, para un sitio web imaginario en <span class="nowiki">www.ejemplo.com</span>.</p>
+
+<pre class="eval">CACHE MANIFEST
+# v1 - 2011-08-13
+# Esto es un comentario.
+<span class="nowiki">http://www.ejemplo.com/index.html</span>
+<span class="nowiki">http://www.ejemplo.com/encabezado.png</span>
+<span class="nowiki">http://www.ejemplo.com/blah/blah</span>
+</pre>
+
+<p>Un archivo de manifest de caché puede incluir tres secciones (<code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK</code>, discutidas debajo). En el ejemplo mencionado, no hay encabezado de sección, así que todoas las líneas de datos se asumen como si estuvieran en la sección explícita (<code>CACHE</code>), lo que significa que el navegador deberá guardar en caché todos los recursos listados en el caché de aplicación. Los recursos pueden ser especificados como URLs absolutas o relativas (ej. <code>index.html</code>).</p>
+
+<p>El comentario "v1" en el ejemplo está ahí por una buena razón. Los navegadores solamente actualizan el caché de aplicación cuando el archivo de manifest cambia byte por byte. Si se cambia un recurso en caché (por ejemplo, si se actualiza la imagen <code>header.png</code> con nuevo contenido), se debe cambiar el contenido del archivo de manifest para que los navegadores sepan que se necesita actualizar el caché. Se puede hacer cualquier cambio al archivo de manifest, pero cambiar el número de versión es una práctica recomendada.</p>
+
+<div class="warning"><strong>Importante:</strong> No hay que especificar el manifest en el mismo archivo de manifest Do not specify the manifest, porque sería casi imposible informar al navegador que hay un nuevo manifest disponible.</div>
+
+<h3 id="Secciones_en_un_archivo_de_manifest_de_caché_CACHE_NETWORK_y_FALLBACK">Secciones en un archivo de manifest de caché: <code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK</code></h3>
+
+<p>Un manifest puede tener tres secciones distintas: <code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK</code>.</p>
+
+<dl>
+ <dt><code>CACHE:</code></dt>
+ <dd>Esta es la sección predeterminada para las entradas en el archivo de manifest de caché. Los archivos listados bajo el encabezado de sección <code>CACHE:</code> (o inmediatamente después de la línea <code>CACHE MANIFEST</code>) son guardados en caché explícitamente después de ser descargados la primera vez.</dd>
+ <dt><code>NETWORK:</code></dt>
+ <dd>Los archivos listados bajo el encabezado de sección <code>NETWORK:</code> en el archivo de manifest de caché son recursos en <em>lista blanca</em> que requieren una conexión al servidor. Todos los pedidos a esos recursos evitan el caché aunque el usuario esté desconectado. Se pueden usar comodines.</dd>
+ <dt><code>FALLBACK:</code></dt>
+ <dd>La sección <code>FALLBACK:</code> especifica las páginas que el navegador debería usar si un recurso no es accesible. Cada entrada en esta sección lista dos URIs—lla primera es el recurso, la seguda es el fallback. Ambas URIs deben ser relativas y del mismo origen que el archivo de manifest. Se pueden usar comodines.</dd>
+</dl>
+
+<p>Las secciones <code>CACHE</code>, <code>NETWORK</code> y <code>FALLBACK </code>pueden lsitarse en cualquier orden en el archivo de manifest y cada sección puede aparecer más de una vez en un manifest.</p>
+
+<h3 id="Ejemplo_2_un_archivo_de_manifest_de_caché_más_completo">Ejemplo 2: un archivo de manifest de caché más completo</h3>
+
+<p>El siguiente es un archivo de manifest de caché para el sitio web imaginario en <span class="nowiki">www.ejemplo.com</span>:</p>
+
+<pre class="eval">CACHE MANIFEST
+# v1 2011-08-14
+# Este es otro comentario
+index.html
+cache.html
+style.css
+image1.png
+
+# Usar desde la red si está disponible
+NETWORK:
+network.html
+
+# Contenido de fallback
+FALLBACK:
+/ fallback.html
+</pre>
+
+<p>Este ejemplo usa las secciones <code>NETWORK</code> y <code>FALLBACK</code> para especificar la página <code>network.html</code> que deber ser recuperada desde la red y que la página <code>fallback.html</code> servirá como fallback (ej. en caso que una conexión al servidor no pueda establecerse).</p>
+
+<h3 id="Estructura_de_un_archivo_de_manifest_de_caché">Estructura de un archivo de manifest de caché</h3>
+
+<p>Los archivos de manifest de caché deben enviarse con el tipo MIME <code>text/cache-manifest</code>. Todos los recursos servidos usando este tipo MIME deben seguir la sintaxis para un manifest de caché de aplicación, como se define en esta sección.</p>
+
+<p>Los manifests de caché son archivos de texto en formato UTF-8 y pueden incluír opcionalmente un caracter BOM. Las nuevas líneas pueden ser representadas por salto de línea (<code>U+000A</code>), retorno de carro (<code>U+000D</code>) o ambos retorno de carro y salto de línea.</p>
+
+<p>La primera línea del manifest de caché debe consistir en la cadena <code>CACHE MANIFEST</code> (con un solo espacio <code>U+0020</code> entre ambas palabras), seguido de cero o más espacios con caracteres de tabulación. Cualquier otro texto en la línea es ignorado.</p>
+
+<p>El resto del manifest de caché debe estar compuesto por cero o más de las siguientes líneas:</p>
+
+<dl>
+ <dt>Línea en blanco</dt>
+ <dd>Se pueden usar líneas en blanco compuestas por cero o más espacios y caracteres de tabulación.</dd>
+ <dt>Comentario</dt>
+ <dd>Los comentarios consisten en cero o más tabulaciones o espacios seguidos por un caracter <code>#</code> seguido de cero o más caracteres del texto del comentario. Los comentarios pueden usarse solamente en sus propias líneas y no pueden agregarse a otras líneas. Esto signifíca que no puede espcificar identificadores de fragmento.</dd>
+ <dt>Encabezado de sección</dt>
+ <dd>Los encabezados de sección especifican qué sección del manifest de caché está siendo manipulada. Hay tres encabezados de sección posibles:</dd>
+</dl>
+
+<blockquote>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Encabezado de sección</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td><code>CACHE:</code></td>
+   <td>Cambia a la sección explícita del manifest de caché (esta es la sección predeterminada).</td>
+  </tr>
+  <tr>
+   <td><code>NETWORK:</code></td>
+   <td>Cambia a la sección de lista blanca del manifest de caché.</td>
+  </tr>
+  <tr>
+   <td><code>FALLBACK:</code></td>
+   <td>Cambia a la sección fallback del manifest de caché.</td>
+  </tr>
+ </tbody>
+</table>
+</blockquote>
+
+<dl>
+ <dd>La línea de encabezado de sección puede incluir espacios en blanco, pero debe incluir los dos puntos (<code>:</code>) en el nombre de sección.</dd>
+ <dt>Datos de sección</dt>
+ <dd>El formato de las líneas de datos varía de sección a sección. En la sección explícita (<code>CACHE:</code>), cada línea es una URI o referencia IRI a un recurso a guardar en caché (no se permiten caracteres comodines en esta sección). El espacio en blanco se permite antes y después de la URI o IRI en cada línea. En la sección Fallback cada línea es una URI o referencia IRI válida a un recurso, seguida por un recurso de fallback que será enviado cuando la comunicación con el servidor no pueda establecerse. En la sección Network, cada línea es una URI o referencia IRI válida a un recurso a obtener desde la red (se permite el caracter comodín * en esta sección).
+ <div class="note"><strong>Nota: </strong>URIs relativas son relativas a la URI del manifest de caché, no a la URI del documento que hace referencia al manifest.</div>
+ </dd>
+</dl>
+
+<p>Los archivos de manifest de caché pueden cambiar de sección a sección a voluntad (cada encabezado de sección puede usarse más de una vez) y se permite que las secciones estén vacías.</p>
+
+<h2 id="Recursos_en_un_caché_de_aplicación">Recursos en un caché de aplicación</h2>
+
+<p>Un caché de aplicación siempre incluye al menos un recurso, identificado por URI. Todos los recursos entran en una de las siguientes categorías:</p>
+
+<dl>
+ <dt>Entradas maestras</dt>
+ <dd>Estos son recursos adicionados al caché porque un contexto de navegación visitado por el usuario incluyó un documento que indicó que estaba en caché usando el atributo <code>manifest</code>.</dd>
+ <dt>Entradas explícitas</dt>
+ <dd>Estos recursos están listados explícitamente en el archivo de manifest de caché de la aplicación.</dd>
+ <dt>Entradas de red</dt>
+ <dd>Estos son recursos listados en el archivo de manifest de caché de la aplicación como entradas de red.</dd>
+ <dt>Entradas de fallback</dt>
+ <dd>Estos son recursos listados en el archivo de manifest de caché de la aplicación como entradas de fallback.</dd>
+</dl>
+
+<div class="note"><strong>Nota:</strong> Los recursos pueden estar etiquetados en múltiples categorías y por lo tanto ser categorizados como entradas múltiples. Por ejemplo, una entrada puede ser explícita y fallback a la vez.</div>
+
+<p>Las categorías de recursos se describen con más detalle debajo.</p>
+
+<h3 id="Entradas_principales">Entradas principales</h3>
+
+<p>Una entrada maestra es cualquier archivo HTML que incluya un atributo {{ htmlattrxref("manifest","html") }} en su elemento {{ HTMLElement("html") }}.  Por ejemplo, digamos que tenemos el archivo <code><a class="linkification-ext external" href="http://www.foo.bar/entry.html" title="Linkification: http://www.foo.bar/entry.html">http://www.ejemplo.com/entrada.html</a></code>, que incluye el siguiente texto:</p>
+
+<pre class="brush: html">&lt;html manifest="ejemplo.appcache"&gt;
+  &lt;h1&gt;Ejemplo de cache de aplicacion&lt;/h1&gt;
+&lt;/html&gt;
+</pre>
+
+<p>Si <code>entrada.html</code> no está listado en el archivo de manifest de caché <code>ejemplo.appcache</code>, visitar la pagina <code>entrada.html</code> causa que se agregue al caché de aplicación el archivo <code>entrada.html</code> como entrada maestra.</p>
+
+<h3 id="Entradas_explícitas">Entradas explícitas</h3>
+
+<p>Las entradas explícitas son recursos que están listados explicitamente en la seccion <code>CACHE </code>de un archivo de manifest de caché.</p>
+
+<h3 id="Entradas_de_red">Entradas de red</h3>
+
+<p>La sección <code>NETWORK</code> de un archivo de manifest de caché especifíca recurso para los cuales una aplicacion web requiere acceso a internet. Las entradas de red en el caché de aplicación son escencialmente una "lista blanca online"—URIs especificadas en la sección <code>NETWORK</code> se cargarán desde el servidor en lugar del caché. Esto permite que el modelo de seguridad del navegador proteja al usuario de problemas de seguridad potenciales al limitar el acceso a recursos aprobados.</p>
+
+<p>Como ejemplo, puedes usar entradas en la seccion red para cargar y ejecutar scripts y otro código desde el servidor en lugar del caché:</p>
+
+<pre>CACHE MANIFEST
+NETWORK:
+/api
+</pre>
+
+<p>La sección de caché de manifest listada debajo asegura que las peticiones para cargar los recursos contenidos en  <code><a class="external" href="http://www.example.com/api/" rel="freelink">http://www.example.com/api/</a></code> siempre van a la red sin intentar acceder a la caché.</p>
+
+<div class="note"><strong>Nota</strong>: <span class="short_text" id="result_box" lang="es"><span class="hps">Simplemente</span> <span class="hps">omitiendo</span> <span class="hps">las entradas</span> principales</span> (archivos que tienen el atributo <code>manifest</code> en el elemento <code>html</code>) del archivo manifest no tendrá el mismo resultado, porque las entradas principales serán agregadas—y posteriormente servida por—la aplicación de caché. </div>
+
+<h3 id="Entradas_fallback">Entradas fallback</h3>
+
+<p>Las entradas fallback son usadas cuando un intento de cargar los recursos falla. Por ejemplo, digamos que el archivo de anifest de caché <code><a class="external" href="http://www.example.com/example.appcache" rel="freelink">http://www.example.com/example.appcache</a></code> incluye el siguiente contenido:</p>
+
+<pre>CACHE MANIFEST
+FALLBACK:
+example/bar/ example.html
+</pre>
+
+<p>Cualquier petición a <code><a class="external" href="http://www.example.com/example/bar/" rel="freelink">http://www.example.com/example/bar/</a></code> o cualquiera de sus directorios <span id="result_box" lang="es"><span class="hps">y</span> <span class="hps">su contenido</span> hace que <span class="hps">el explorador</span> <span class="hps">emita</span> <span class="hps">una solicitud de red</span> <span class="hps">al</span> <span class="hps">intentar cargar el</span> <span class="hps">recurso solicitado</span></span>. Si la petición falla, debido a una falla de la red o un error de servidor de cualquier tipo, el navegador carga el archivo <code>example.html</code> en su lugar.</p>
+
+<h2 id="Estados_de_caché">Estados de caché</h2>
+
+<p>Cada aplicación de caché tiene un <strong>estado</strong>, que indica el estado actual del caché. Cachés que comparten el mismo manifest URI comparten el mismo estado de caché, el cual puede ser uno de los siguientes:</p>
+
+<dl>
+ <dt><code>UNCACHED</code></dt>
+ <dd><span id="result_box" lang="es"><span class="hps">Un valor</span> <span class="hps">especial que indica</span> <span class="hps">que un objeto</span> <span class="hps">caché de la aplicación</span></span> no está inicializado en su totalidad.</dd>
+ <dt><code>IDLE</code></dt>
+ <dd>La caché de aplicación no está actualmente en el proceso de actualización.</dd>
+ <dt><code>CHECKING</code></dt>
+ <dd>El manifest se ha obtenido y revisado para actualizaciones.</dd>
+ <dt><code>DOWNLOADING</code></dt>
+ <dd>Recursos han sido descargados para ser añadidos al caché, debido a un cambio de recursos de manifest.</dd>
+ <dt><code>UPDATEREADY</code></dt>
+ <dd>Hay una nueva versión de la aplicación de caché disponible. Hay un correspondiente evento <code>updateready</code>, que es lanzado en lugar del evento <code>cached</code> cuando una nueva actualización acaba de ser descargada pero aún no ah sido activado el método <code>swapCache()</code>.</dd>
+ <dt><code>OBSOLETE</code></dt>
+ <dd>La aplicación de caché de grupo es ahora obsoleta.</dd>
+</dl>
+
+<h2 id="Probando_para_actualizaciones_para_el_manifest_de_caché">Probando para actualizaciones para el manifest de caché</h2>
+
+<p>Puedes programar para ver si una aplicación tiene un archivo de actualización del manifest de caché, usando JavaScript. Desde que un archio de manifest de caché tiene que ser actualizado antes de que un script adjunte eventos escuchas para probar para actualizaciones, los scripts siempre deben probar <code>window.applicationCache.status</code>.</p>
+
+<pre class="brush: js">function onUpdateReady() {
+  alert('found new version!');
+}
+window.applicationCache.addEventListener('updateready', onUpdateReady);
+if(window.applicationCache.status === window.applicationCache.UPDATEREADY) {
+  onUpdateReady();
+}</pre>
+
+<p> Para comenzar a probar manualmente para un nuevo archivo manifest, puedes usar <code>window.applicationCache.update()</code>.</p>
+
+<h2 id="Contra_indicaciones">Contra indicaciones</h2>
+
+<ul>
+ <li>Nunca accesar aplicacines de caché usando los parámetros tradicionales de GET (como <code>other-cached-page.html?parameterName=value</code>). Esto hará que el navegador omita el caché y trate de obtenerlo mediante la red. <span class="short_text" id="result_box" lang="es"><span class="hps">Para enlazar</span> <span class="hps">a los recursos</span> <span class="hps">almacenados en caché</span></span> que tienen parámetros cambiados a JavaScript usa parámetros en la parte del hash del enlace, como <code>other-cached-page.html#whatever?parameterName=value</code>.</li>
+ <li>Cuando las aplicaciones son almacenadas en caché, simplemente actualizando los recursos (archivos) que son usados en una página web no son suficientes para actualizar los archivos que han sido almacenados en caché. Debes actualizar el archivo de manifest de caché a sí mismo antes de que el navegador recupere y use los archivos actualizados. Puedes hacer esto programadamente usando <code>window.applicationCache.swapCache()</code>, <span id="result_box" lang="es"><span class="hps">aunque</span> <span class="hps">los recursos</span> <span class="hps">que</span> <span class="hps">ya han sido cargados</span> <span class="hps">no se verán afectados</span></span>. <span id="result_box" lang="es"><span class="hps">Para asegurarse de</span> <span class="hps">que los recursos</span> <span class="hps">se cargan desde</span> <span class="hps">una nueva</span> <span class="hps">versión de la</span> <span class="hps">caché de la aplicación</span><span>,</span> <span class="hps">la actualización de la</span> <span class="hps">página</span> <span class="hps">es ideal</span></span>.</li>
+ <li>Es una buena idea colocar cabeceras expiradas en tu sitio para los archivos <code>*.appcache</code> para que caduquen inmediatamente. Esto previene el riesgo de almacenar en caché archivos de manifest. Por ejemplo, en Apache puedes especificar <span id="result_box" lang="es"><span class="hps">una</span> <span class="hps">configuración de este tipo</span> <span class="hps">de la siguiente manera</span></span>:<br>
+  <code>ExpiresByType text/cache-manifest "access plus 0 seconds"</code></li>
+</ul>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4.0</td>
+   <td>3.5</td>
+   <td>10.0</td>
+   <td>10.6</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>2.1</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatNo() }}</td>
+   <td>11.0</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Nota: Versiones de Firefox anteriores a la 3.5 ignoran las secciones <code>NETWORK y</code> <code>FALLBACK del archivo manifest de caché</code>.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a class="external" href="http://www.html5rocks.com/en/tutorials/appcache/beginner/" title="http://www.html5rocks.com/en/tutorials/appcache/beginner/">HTML5Rocks - A Beginner's Guide to Using the Application Cache</a></li>
+ <li><a class="external" href="http://appcachefacts.info/" title="http://appcachefacts.info/">appcachefacts.info</a> - información detallada en AppCache idiosyncrasies</li>
+ <li><a class="external" href="http://hacks.mozilla.org/2010/01/offline-web-applications/" title="http://hacks.mozilla.org/2010/01/offline-web-applications/">offline web applications</a> en hacks.mozilla.org - muestras de una aplicacón offline en demo y explica como funciona.</li>
+ <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#offline" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/offline.html#offline">HTML 5 working draft: Offline web applications</a></li>
+ <li><a class="external" href="http://developer.teradata.com/blog/js186040/2011/11/html5-cache-manifest-an-off-label-usage" title="http://developer.teradata.com/blog/js186040/2011/11/html5-cache-manifest-an-off-label-usage">HTML5 Cache Manifest: An Off-label Usage</a></li>
+ <li>{{ interface("nsIApplicationCache") }}</li>
+ <li>{{ interface("nsIApplicationCacheNamespace") }}</li>
+ <li>{{ interface("nsIApplicationCacheContainer") }}</li>
+ <li>{{ interface("nsIApplicationCacheChannel") }}</li>
+ <li>{{ interface("nsIApplicationCacheService") }}</li>
+ <li>{{ interface("nsIDOMOfflineResourceList") }}</li>
+ <li><a class="external" href="http://www.ibm.com/developerworks/web/library/wa-ffox3/">Prepárate para Firefox 3.0 - Una guía para desarrolladores web para las muchas nuevas características en este navegador tan popular, específicamente las características offline</a> (IBM developerWorks)</li>
+</ul>
+
+<p>{{ HTML5ArticleTOC() }}</p>
+</div>
diff --git a/files/es/web/html/índice/index.html b/files/es/web/html/índice/index.html
deleted file mode 100644
index 5beb1776d4..0000000000
--- a/files/es/web/html/índice/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: Índice de la documentación HTML
-slug: Web/HTML/Índice
-tags:
-  - HTML
-translation_of: Web/HTML/Index
----
-<p>{{Index("/es/docs/Web/HTML")}}</p>
diff --git a/files/es/web/http/access_control_cors/index.html b/files/es/web/http/access_control_cors/index.html
deleted file mode 100644
index efd60a179a..0000000000
--- a/files/es/web/http/access_control_cors/index.html
+++ /dev/null
@@ -1,491 +0,0 @@
----
-title: Control de acceso HTTP (CORS)
-slug: Web/HTTP/Access_control_CORS
-translation_of: Web/HTTP/CORS
----
-<p>{{HTTPSidebar}}</p>
-
-<p><span class="seoSummary">El Intercambio de Recursos de Origen Cruzado ({{Glossary("CORS")}})</span> es un mecanismo que utiliza cabeceras <span class="seoSummary">{{Glossary("HTTP")}}</span> adicionales para permitir que un <span class="seoSummary">{{Glossary("user agent")}}</span> obtenga permiso para acceder a recursos seleccionados desde un servidor, en un origen distinto (dominio) al que pertenece. Un agente crea una petición HTTP de origen cruzado cuando solicita un recurso desde un dominio distinto, un protocolo o un puerto diferente al del documento que lo generó.</p>
-
-<p>Un ejemplo de solicitud de origen cruzado: el código JavaScript frontend de una aplicación web que es localizada en <code>http://domain-a.com</code> utiliza {{domxref("XMLHttpRequest")}} para cargar el recurso <code>http://api.domain-b.com/data.json</code>.</p>
-
-<p>Por razones de seguridad, los exploradores restringen las solicitudes HTTP de origen cruzado iniciadas dentro de un script. Por ejemplo, <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> y la API <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch</a> siguen la <a href="/en-US/docs/Web/Security/Same-origin_policy">política de mismo-origen</a>. Ésto significa que una aplicación que utilice esas APIs <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> sólo puede hacer solicitudes HTTP a su propio dominio, a menos que se utilicen cabeceras CORS.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/14295/CORS_principle.png" style="height: 305px; width: 439px;"></p>
-
-<p>El <a href="http://www.w3.org/">W3C</a> <a href="http://www.w3.org/2008/webapps/">Grupo de Trabajo de Aplicaciones Web</a> recomienda el nuevo mecanismo de <a href="http://www.w3.org/TR/cors/">Intercambio de Recursos de Origen Cruzado</a> (CORS, por sus siglas en inglés). CORS da controles de acceso a dominios cruzados para servidores web y transferencia segura de datos en dominios cruzados entre navegadores y servidores Web. Los exploradores modernos utilizan CORS en un  <strong>contenedor API</strong> (como <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> o <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch</a>) para ayudar a mitigar los riesgos de solicitudes HTTP de origen cruzado.</p>
-
-<h2 id="¿Quién_debería_leer_este_artículo">¿Quién debería leer este artículo?</h2>
-
-<p>Todo el mundo, de verdad.</p>
-
-<p>Más específicamente, este artículo está dirigido a administradores web, desarrolladores de servidores y desarrolladores de interfaz. Los exploradores modernos manejan los componentes sobre el intercambio de origen cruzado del lado del cliente. Incluyendo cabeceras y políticas de ejecución. Pero, este nuevo estándar determina que los servidores tienen que manejar las nuevas solicitudes y las cabeceras de las respuestas. Se recomienda, como lectura suplementaria, otro artículo para desarrolladores de servidor que discute el <a href="/en-US/docs/Web/HTTP/Server-Side_Access_Control">intercambio de origen cruzado desde una perspectiva de servidor (con fragmentos de código PHP)</a>.</p>
-
-<h2 id="¿Qué_peticiones_utiliza_CORS">¿Qué peticiones utiliza CORS?</h2>
-
-<p>Este <a class="external" href="http://www.w3.org/TR/cors/" title="http://www.w3.org/TR/cors/">estándar de intercambio de origen cruzado</a> es utilizado para habilitar solicitudes HTTP de sitios cruzados para:</p>
-
-<ul>
- <li>Invocaciones de las APIs <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> o  <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch</a> en una manera de sitio cruzado, como se discutió arriba.</li>
- <li>Fuentes Web (para usos de fuente en dominios cruzados <code>@font-face</code> dentro de CSS), <a class="external" href="https://www.w3.org/TR/css-fonts-3/#font-fetching-requirements" title="http://www.webfonts.info/wiki/index.php?title=@font-face_support_in_Firefox">para que los servidores puedan mostrar fuentes TrueType que sólo puedan ser cargadas por sitios cruzados y usadas por sitios web que lo tengan permitido.</a></li>
- <li>Texturas WebGL.</li>
- <li>Imágenes dibujadas en patrones usando <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage">drawImage</a></code>.</li>
- <li>Hojas de estilo (para acceso <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSSOM_View">CSSOM</a>).</li>
- <li>Scripts (para excepciones inmutadas).</li>
-</ul>
-
-<p>Este artículo es una discusión general sobre Intercambio de Recursos de Origin Cruzado e incluye una discusión sobre las cabeceras HTTP.</p>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El estándar de Intercambio de Recursos de Origen Cruzado trabaja añadiendo nuevas cabeceras HTTP que permiten a los servidores describir el conjunto de orígenes que tienen permiso para leer la información usando un explorador web.  Adicionalmente, para métodos de solicitud HTTP que causan efectos secundarios en datos del usuario (y en particular, para otros métodos HTTP distintos a <code>GET</code>, o para la utilización de <code>POST</code> con algunos tipos MIME), la especificación sugiere que los exploradores "verifiquen" la solicitud, solicitando métodos soportados desde el servidor con un método de solicitud HTTP <code>OPTIONS</code>, y luego, con la "aprobación" del servidor, enviar la verdadera solicitud con el método de solicitud HTTP verdadero. Los servidores pueden también notificar a los clientes cuando sus "credenciales" (incluyendo Cookies y datos de autenticación HTTP) deben ser enviados con solicitudes.</p>
-
-<p>Las secciones siguientes discuten escenarios, así como el análisis de las cabeceras HTTP usados.</p>
-
-<h2 id="Ejemplos_de_escenarios_de_control_de_accesos">Ejemplos de escenarios de control de accesos</h2>
-
-<p>Aquí, presentamos tres escenarios que ilustran cómo funciona el Intercambio de Recursos de Origen Cruzado. Todos estos ejemplos utilizan el objeto <code><a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest">XMLHttpRequest</a></code>, que puede ser utilizado para hacer invocaciones de sitios cruzados en cualquier explorador soportado.</p>
-
-<p>Los fragmentos de JavaScript incluidos en estas secciones (y las instancias ejecutadas del código servidor que correctamente maneja las solicitudes de sitios cruzados) <a class="external" href="http://arunranga.com/examples/access-control/" title="http://arunranga.com/examples/access-control/">pueden ser encontrados "en acción" aquí</a>, y pueden ser trabajados en exploradores que soportan <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> de sitios cruzados. Una discusión de Intercambio de Recursos de Origen Cruzado desde una <a class="internal" href="/en-US/docs/Web/HTTP/Server-Side_Access_Control" title="En/Server-Side Access Control">perspectiva de servidor (incluyendo fragmentos de código PHP) puede ser encontrada aquí</a>.</p>
-
-<h3 id="Solicitudes_simples">Solicitudes simples</h3>
-
-<p>Una solicitud de sitio cruzado es aquella que cumple las siguientes condiciones:</p>
-
-<ul>
- <li>Los únicos métodos aceptados son:
-  <ul>
-   <li>GET</li>
-   <li>HEAD</li>
-   <li>POST.</li>
-  </ul>
- </li>
- <li>Aparte de las cabeceras establecidas automáticamente por el agente usuario (ej. <code>Connection, User-Agent,</code>etc.), las únicas cabeceras que están permitidas para establecer manualmente son:
-  <ul>
-   <li><code>Accept</code></li>
-   <li><code>Accept-Language</code></li>
-   <li><code>Content-Language</code></li>
-   <li><code>Content-Type</code></li>
-  </ul>
- </li>
- <li>Los únicos valores permitidos de la cabecera <code>Content-Type</code> son:
-  <ul>
-   <li><code>application/x-www-form-urlencoded</code></li>
-   <li><code>multipart/form-data</code></li>
-   <li><code>text/plain</code></li>
-  </ul>
- </li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> Estos son los mismos tipos de solicitud de sitios cruzados que un contenido web ya puede emitir, y ninguna respuesta de datos es liberada a menos que el servidor envíe la cabecera apropiada. Por lo tanto, los sitios que prevengan solicitudes falsas de sitios cruzados no tienen nada nuevo que temer sobre el control de acceso HTTP.</div>
-
-<p>Por ejemplo, suponga que el contenido web en el dominio <code class="plain">http://foo.example</code> desea invocar contenido en el dominio <code class="plain">http://bar.other</code>. Código de este tipo puede ser utilizado dentro de JavaScript desplegado en foo.example:</p>
-
-<pre class="brush: js notranslate" id="line1">var invocation = new XMLHttpRequest();
-var url = 'http://bar.other/resources/public-data/';
-
-function callOtherDomain() {
-  if(invocation) {
-    invocation.open('GET', url, true);
-    invocation.onreadystatechange = handler;
-    invocation.send();
-  }
-}
-</pre>
-
-<p>Dejándonos ver lo que el explorador enviará al servidor en este caso, y veamos como responde el servidor:</p>
-
-<pre class="brush: shell notranslate">GET /resources/public-data/ HTTP/1.1
-Host: bar.other
-User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
-Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
-Accept-Language: en-us,en;q=0.5
-Accept-Encoding: gzip,deflate
-Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
-Connection: keep-alive
-Referer: http://foo.example/examples/access-control/simpleXSInvocation.html
-Origin: http://foo.example
-
-
-HTTP/1.1 200 OK
-Date: Mon, 01 Dec 2008 00:23:53 GMT
-Server: Apache/2.0.61
-Access-Control-Allow-Origin: *
-Keep-Alive: timeout=2, max=100
-Connection: Keep-Alive
-Transfer-Encoding: chunked
-Content-Type: application/xml
-
-[XML Data]
-</pre>
-
-<p>Las líneas 1 - 10 son las cabeceras enviadas por Firefox 3.5.  Observe que la cabecera de solicitud HTTP principal aquí es la cabecera <code>Origin:</code>  en la línea 10 de arriba, lo que muestra que la invocación proviene del contenido en el dominio <code class="plain">http://foo.example</code>.</p>
-
-<p>Las líneas 13 - 22  muestran la respuesta HTTP del servidor en el dominio <code class="plain">http://bar.other</code>.  En respuesta, el servidor envía de vuelta una cabecera <code>Access-Control-Allow-Origin:</code>, mostrado arriba en la línea 16.  El uso de la cabecera <code>Origin:</code> y <code>Access-Control-Allow-Origin:</code> muestran el protocolo de control de acceso en su uso más simple.  En este caso, el servidor responde con un <code>Access-Control-Allow-Origin: *</code> lo que significa que el recurso puede ser accedido por <strong>cualquier</strong> dominio en una forma de sitio cruzado. Si el dueño del recurso en <code class="plain">http://bar.other</code> deseara restringir el acceso al recurso solamente para <code class="plain">http://foo.example</code>, debería devolver lo siguiente:</p>
-
-<p><code class="plain">Access-Control-Allow-Origin: http://foo.example</code></p>
-
-<p>Note que ahora, ningún otro dominio aparte de <code class="plain">http://foo.example</code> (identificado por la cabecera ORIGIN: en la solicitud, como en la línea 10 arriba) puede acceder al recurso en una forma de sitio cruzado. La cabecera Access-Control-Allow-Origin debe contener el valor que fue enviado en la solicitud del encabezado <code>Origin.</code></p>
-
-<h3 id="Solicitudes_Verificadas">Solicitudes Verificadas</h3>
-
-<p>A diferencia de las solicitudes simples (discutidas arriba), las solicitudes "verificadas" envían primero una solicitud HTTP por el método <code>OPTIONS</code> al recurso en el otro dominio, para determinar si es seguro enviar la verdadera solicitud. Las solicitudes de sitios cruzados son verificadas así ya que pueden tener implicaciones en la información de usuario.  En particular, una solicitud es verificada sí:</p>
-
-<ul>
- <li>Usa métodos <strong>distintos</strong> a <code>GET, HEAD</code> <code>o POST</code>.  También, si <code>POST</code> es utilizado para enviar solicitudes de información con Content-Type <strong>distinto</strong> a<code> application/x-www-form-urlencoded</code>, <code>multipart/form-data</code>, o <code>text/plain</code>, ej. si la solicitud <code>POST</code> envía una carga XML al servidor utilizando <code>application/xml</code> or <code>text/xml</code>, entonces la solicitud <strong>es</strong> verificada.</li>
- <li>Se establecen encabezados personalizados (ej. la solicitud usa un encabezado como <code>X-PINGOTHER</code>)</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota:</strong> Empezando en {{Gecko("2.0")}}, las codificaciones de datos <code>text/plain</code>, <code>application/x-www-form-urlencoded</code>, y <code>multipart/form-data</code> pueden ser enviadas en sitios cruzados sin verificación. Anteriormente, solo<code> text/plain</code> podía ser enviado sin verificación.</p>
-</div>
-
-<p>Un ejemplo de este tipo de invocación puede ser:</p>
-
-<pre class="brush: js notranslate" id="line1">var invocation = new XMLHttpRequest();
-var url = 'http://bar.other/resources/post-here/';
-var body = '&lt;?xml version="1.0"?&gt;&lt;person&gt;&lt;name&gt;Arun&lt;/name&gt;&lt;/person&gt;';
-
-function callOtherDomain(){
-  if(invocation)
-    {
-      invocation.open('POST', url, true);
-      invocation.setRequestHeader('X-PINGOTHER', 'pingpong');
-      invocation.setRequestHeader('Content-Type', 'application/xml');
-      invocation.onreadystatechange = handler;
-      invocation.send(body);
-    }
-}
-
-......
-</pre>
-
-<p>En el ejemplo de arriba, la línea 3 crea un cuerpo XML para enviar con la solicitud <code>POST</code> en la línea 8.  También, en la línea 9, se establece una cabecera HTTP de solicitud "personalizado" (no estándar <code>X-PINGOTHER: pingpong</code>).  Dichas cabeceras no son parte del protocolo HTTP/1.1, pero son útiles generalmente en aplicaciones web. Dado que la solicitud (<code>POST</code>) usa un Content-Type <code>application/xml</code>, y dado que se establece una cabecera personalizada, la solicitud es verificada.</p>
-
-<p>Veamos este intercambio completo entre un cliente y un servidor:</p>
-
-<pre class="brush: shell notranslate">OPTIONS /resources/post-here/ HTTP/1.1
-Host: bar.other
-User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
-Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
-Accept-Language: en-us,en;q=0.5
-Accept-Encoding: gzip,deflate
-Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
-Connection: keep-alive
-Origin: http://foo.example
-Access-Control-Request-Method: POST
-Access-Control-Request-Headers: X-PINGOTHER
-
-
-HTTP/1.1 200 OK
-Date: Mon, 01 Dec 2008 01:15:39 GMT
-Server: Apache/2.0.61 (Unix)
-Access-Control-Allow-Origin: http://foo.example
-Access-Control-Allow-Methods: POST, GET, OPTIONS
-Access-Control-Allow-Headers: X-PINGOTHER
-Access-Control-Max-Age: 1728000
-Vary: Accept-Encoding, Origin
-Content-Encoding: gzip
-Content-Length: 0
-Keep-Alive: timeout=2, max=100
-Connection: Keep-Alive
-Content-Type: text/plain
-
-POST /resources/post-here/ HTTP/1.1
-Host: bar.other
-User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
-Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
-Accept-Language: en-us,en;q=0.5
-Accept-Encoding: gzip,deflate
-Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
-Connection: keep-alive
-X-PINGOTHER: pingpong
-Content-Type: text/xml; charset=UTF-8
-Referer: http://foo.example/examples/preflightInvocation.html
-Content-Length: 55
-Origin: http://foo.example
-Pragma: no-cache
-Cache-Control: no-cache
-
-&lt;?xml version="1.0"?&gt;&lt;person&gt;&lt;name&gt;Arun&lt;/name&gt;&lt;/person&gt;
-
-
-HTTP/1.1 200 OK
-Date: Mon, 01 Dec 2008 01:15:40 GMT
-Server: Apache/2.0.61 (Unix)
-Access-Control-Allow-Origin: http://foo.example
-Vary: Accept-Encoding, Origin
-Content-Encoding: gzip
-Content-Length: 235
-Keep-Alive: timeout=2, max=99
-Connection: Keep-Alive
-Content-Type: text/plain
-
-[Some GZIP'd payload]
-</pre>
-
-<p>Las líneas 1 - 12 arriba representan la solicitud verificada con los métodos <code>OPTIONS</code>. Firefox 3.1 determina lo que se necesita para enviar esto basándose en los parámetros de la solicitud que los fragmentos de JavaScript que se usaron arriba, para que el servidor pueda responder si es aceptable enviar la solicitud con los parámetros de la solicitud real. OPTIONS es un método HTTP/1.1 que se utiliza para determinar información adicional de los servidores, y es un método <strong>idempotente</strong>, esto significa que no puede ser utilizado para cambiar el recurso. Observe que, junto con la solicitud OPTIONS, se envían otras dos cabeceras de solicitud (líneas 11 y 12 respectivamente):</p>
-
-<pre class="notranslate">Access-Control-Request-Method: POST
-Access-Control-Request-Headers: X-PINGOTHER
-</pre>
-
-<p>La cabecera <code>Access-Control-Request-Method</code> notifica al servidor como parte de una solicitud verificada que cuándo se envíe la solicitud real, esta será enviada con un método de solicitud <code>POST</code>. La cabecera <code>Access-Control-Request-Headers</code> notifica al servidor que cuando la solicitud real sea enviada, será enviada con un encabezado <code>X-PINGOTHER</code> personalizado.  Ahora, el servidor tiene la oportunidad para determinar si desea aceptar la solicitud bajo estas circunstancias.</p>
-
-<p>Las líneas 15 - 27 de arriba corresponden con la respuesta que devuelve el servidor indicando que el método de la petición (POST) y la cabecera <code>X-PINGOTHER</code> son aceptadas. En particular, echemos un vistazo a las líneas 18-21:</p>
-
-<pre class="notranslate">Access-Control-Allow-Origin: http://foo.example
-Access-Control-Allow-Methods: POST, GET, OPTIONS
-Access-Control-Allow-Headers: X-PINGOTHER
-Access-Control-Max-Age: 1728000</pre>
-
-<p>El servidor responde con <code>Access-Control-Allow-Methods</code> y dice que <code>POST</code>, <code>GET</code>, y <code>OPTIONS</code> son métodos viables para consultar el recurso en cuestión.  Observe que esta cabecera es similar al <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.7" title="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.7">HTTP/1.1 Allow: encabezado de respuesta</a>, pero usado estrictamente dentro del contexto del control de acceso.  El servidor también envía <code>Access-Control-Allow-Headers</code> con un valor de <code>X-PINGOTHER</code>, confirmando que es una cabecera permitida para ser usado en la solicitud real.  Como <code>Access-Control-Allow-Methods</code>, <code>Access-Control-Allow-Headers</code> es una lista separada por comas de cabeceras aceptables.  Finalmente, <code>Access-Control-Max-Age</code> da el valor en segundos de cuánto tarda la respuesta de la solicitud verificada en ser capturada sin enviar otra solicitud verificada. En este caso, 1728000 segundos son 20 días.</p>
-
-<h3 id="Solicitudes_con_credenciales">Solicitudes con credenciales</h3>
-
-<p>La capacidad más interesante expuesta tanto por <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> y Access Control es la habilidad para hacer solicitudes "con credenciales" que estén al tanto de Cookies HTTP e información de Autenticación HTTP.  Por defecto, en las invocaciones <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> de un sitio curzado, los exploradores no enviarán credenciales. Una bandera específica tiene que ser establecida en el objeto <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> cuando este es invocado.</p>
-
-<p>En este ejemplo, el contenido cargado originalmente desde <code class="plain">http://foo.example</code> hace una solicitud GET simple a un recurso en <code class="plain">http://bar.other</code> que establece Cookies. El contenido en foo.example puede contener un JavaScript como este:</p>
-
-<pre class="brush: js notranslate" id="line1">var invocation = new XMLHttpRequest();
-var url = 'http://bar.other/resources/credentialed-content/';
-
-function callOtherDomain(){
-  if(invocation) {
-    invocation.open('GET', url, true);
-    invocation.withCredentials = true;
-    invocation.onreadystatechange = handler;
-    invocation.send();
-  }
-}</pre>
-
-<p>La línea 7 muestra la bandera en <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> que tiene que ser establecida para poder hacer la invocación con Cookies, es decir, el valor booleano <code>withCredentials</code>.  Por defecto, la invocación es hecha sin Cookies. Dado que esta es una simple solicitud <code>GET</code>, no es verificada, pero el explorador <strong>rechazará </strong>cualquier respuesta que no tiene el encabezado <code>Access-Control-Allow-Credentials: true</code>,y <strong>no</strong> hará disponible la respuesta para invocar contenido web.</p>
-
-<p>A continuación se proporciona una muestra de intercambio entre un cliente y un servidor:</p>
-
-<pre class="brush: shell notranslate">GET /resources/access-control-with-credentials/ HTTP/1.1
-Host: bar.other
-User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
-Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
-Accept-Language: en-us,en;q=0.5
-Accept-Encoding: gzip,deflate
-Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
-Connection: keep-alive
-Referer: http://foo.example/examples/credential.html
-Origin: http://foo.example
-Cookie: pageAccess=2
-
-
-HTTP/1.1 200 OK
-Date: Mon, 01 Dec 2008 01:34:52 GMT
-Server: Apache/2.0.61 (Unix) PHP/4.4.7 mod_ssl/2.0.61 OpenSSL/0.9.7e mod_fastcgi/2.4.2 DAV/2 SVN/1.4.2
-X-Powered-By: PHP/5.2.6
-Access-Control-Allow-Origin: http://foo.example
-Access-Control-Allow-Credentials: true
-Cache-Control: no-cache
-Pragma: no-cache
-Set-Cookie: pageAccess=3; expires=Wed, 31-Dec-2008 01:34:53 GMT
-Vary: Accept-Encoding, Origin
-Content-Encoding: gzip
-Content-Length: 106
-Keep-Alive: timeout=2, max=100
-Connection: Keep-Alive
-Content-Type: text/plain
-
-
-[text/plain payload]
-</pre>
-
-<p>Pese a que la línea 11 contiene la Cookie destinada para el contenido en <code class="plain">http://bar.other</code>, si bar.other no responde con <code>Access-Control-Allow-Credentials: true</code> (línea 19) la respuesta será ignorada y no puesta a disposición para el contenido web. <strong>Nota Importante:</strong> cuando se responde a una solicitud con credeciales, el servidor <strong>debe</strong><strong> </strong>especificar un dominio, y no puede usar comodines. El ejemplo de arriba fallará si la cabecera fuera un comodín como: <code>Access-Control-Allow-Origin: *</code>.  Dado que <code>Access-Control-Allow-Origin</code> menciona explícitamente <code class="plain">http://foo.example</code>, el contenido de credenciales competente es devuelto al contenido web invocador. Observe que, en la línea 22, se establece una cookie adicional.</p>
-
-<p>Todos estos ejemplos pueden <a class="external" href="http://arunranga.com/examples/access-control/" title="http://arunranga.com/examples/access-control/">verse funcionando aquí</a>.  La siguiente sección se refiere a las verdaderas cabeceras HTTP.</p>
-
-<h2 id="Las_cabeceras_HTTP_de_respuesta">Las cabeceras HTTP de respuesta</h2>
-
-<p>Esta sección lista las cabeceras HTTP de respuesta que los servidores envían de vuelta para las solicitudes de acceso de control definidas por la especificación del Intercambio de Recursos de Origen Cruzado. La sección anterior da un resumen de estos en acción.</p>
-
-<h3 id="Access-Control-Allow-Origin">Access-Control-Allow-Origin</h3>
-
-<p>Un recurso devuelto puede tener una cabecera <code>Access-Control-Allow-Origin</code>, con la siguiente sintaxis:</p>
-
-<pre class="notranslate">Access-Control-Allow-Origin: &lt;origin&gt; | *
-</pre>
-
-<p>El parámetro <code>origin</code> específica una URI que puede tener acceso al recurso.  El explorador debe asegurar esto. Para solicitudes <strong>sin</strong> credenciales, el servidor debe especificar "*" como un comodín permitiendo, de este modo, el acceso al recurso a cualquier origen.</p>
-
-<p>Por ejemplo, para permitir a <span class="nowiki">http://mozilla.com</span> acceder al recurso, usted puede especificar:</p>
-
-<pre class="notranslate">Access-Control-Allow-Origin: <span class="plain">http://mozilla.com</span></pre>
-
-<p>Si el servidor especifica un host de origen en vez de "*", entonces se debe incluir <span style="font-family: courier new,andale mono,monospace; line-height: 1.5;">Origin</span><span style="line-height: 1.5;"> en el encabezado de respuesta </span><span style="font-family: courier new,andale mono,monospace; line-height: 1.5;">Vary </span><span style="line-height: 1.5;">para indicar a los clientes que las respuestas del servidor difieren basándose en el valor del encabezado de respuesta</span><span style="line-height: 1.5;"> </span><span style="font-family: courier new,andale mono,monospace; line-height: 1.5;">Origin.</span></p>
-
-<p>{{ h3_gecko_minversion("Access-Control-Expose-Headers", "2.0") }}</p>
-
-<p>Esta cabecera permite una <em>whitelist</em> de cabeceras del servidor que los exploradores tienen permitido acceder. Por ejemplo:</p>
-
-<pre class="notranslate">Access-Control-Expose-Headers: X-My-Custom-Header, X-Another-Custom-Header
-</pre>
-
-<p>Esto permite a las cabeceras <code>X-My-Custom-Header</code> y<code> X-Another-Custom-Header</code> ser expuestos al explorador.</p>
-
-<h3 id="Access-Control-Max-Age">Access-Control-Max-Age</h3>
-
-<p>Esta cabecera indica durante cuánto tiempo los resultados de la solicitud verificada pueden ser capturados. Para un ejemplo de solicitudes verificadas, vea los ejemplos de arriba.</p>
-
-<pre class="notranslate">Access-Control-Max-Age: &lt;delta-seconds&gt;
-</pre>
-
-<p>El parámetro <code>delta-seconds</code> indica el número de segundos en que los resultados pueden ser capturados.</p>
-
-<h3 id="Access-Control-Allow-Credentials">Access-Control-Allow-Credentials</h3>
-
-<p>Indica si la respuesta puede ser expuesta cuando la bandera <code>credentials</code> es verdadera. Cuando se usa como parte de una respuesta para una solicitud verficada, este indica si la solicitud verdadera puede realizarse usando credenciales. Note que las solicitudes <code>GET</code> simples no son verificadas, y por lo que si una solicitud es hecha para un recurso con credenciales, si la cabecera no es devuelta con el recurso, la respuesta es ignorada por el explorador y no devuelta al contenido web.</p>
-
-<pre class="notranslate">Access-Control-Allow-Credentials: true | false
-</pre>
-
-<p><a class="internal" href="/En/HTTP_access_control#Requests_with_credentials" title="En/HTTP access control#Requests with credentials">Las Solicitudes con credenciales</a> son discutidas arriba.</p>
-
-<h3 id="Access-Control-Allow-Methods">Access-Control-Allow-Methods</h3>
-
-<p>Específica el método o los métodos permitidos cuando se asigna un recurso. Es usado en respuesta a la solicitud verificada. Las condiciones sobre cuándo una solicitud es verificada se discuten arriba.</p>
-
-<pre class="notranslate">Access-Control-Allow-Methods: &lt;method&gt;[, &lt;method&gt;]*
-</pre>
-
-<p>Un ejemplo de una <a class="internal" href="#Preflighted_requests" title="#Preflight Request">solicitud verificada se muestra arriba</a>, incluyendo un ejemplo donde se envía este encabezado al explorador.</p>
-
-<h3 id="Access-Control-Allow-Headers">Access-Control-Allow-Headers</h3>
-
-<p>Usado en respuesta a una <a class="internal" href="#Preflighted_requests" title="#Preflighted Request">solicitud verificada</a> para indicar qué encabezado HTTP puede ser usado cuando se realiza la solicitud real.</p>
-
-<pre class="notranslate">Access-Control-Allow-Headers: &lt;field-name&gt;[, &lt;field-name&gt;]*
-</pre>
-
-<h2 id="Los_encabezados_HTTP_de_solicitud">Los encabezados HTTP de solicitud</h2>
-
-<p>Esta sección lista las cabeceras que los clietnes deben utilizar cuando realizan solicitudes HTTP para usar la característica de intercambio de origen cruzado. Note que estas cabeceras son establecidas cuando se realizan realizan invocaciones a los servidores. Los desarrolladores usan la capacidad de sitios cruzados <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> para no tener que establecer ninguna solicitud de intercambio de origen cruzado programada.</p>
-
-<h3 id="Origin">Origin</h3>
-
-<p>Indica el origen de las solicitudes de acceso a sitios cruzados o solicitudes verificadas.</p>
-
-<pre class="notranslate">Origin: &lt;origin&gt;
-</pre>
-
-<p>El origen es una URI indicando al servidor dónde se ha iniciado la solicitud. Este no incluye ninguna información de recorrido, sólo el nombre del servidor. </p>
-
-<div class="note"><strong>Nota:</strong> El <code>origin</code> puede ser un string vacío; esto es útil, por ejemplo, si el recurso es un <code>data</code> URL.</div>
-
-<p>Observe que en cualquier solicitud de acceso de control, la cabecera <code>ORIGIN</code> <strong>siempre </strong>se envía.</p>
-
-<h3 id="Access-Control-Request-Method">Access-Control-Request-Method</h3>
-
-<p>Se usa cuando se emite una solicitud verificada, para indicarle al servidor qué método HTTP será usado cuando se haga la solicitud real.</p>
-
-<pre class="notranslate">Access-Control-Request-Method: &lt;method&gt;
-</pre>
-
-<p>Ejemplos de esta utilización pueden ser encontrados <a class="internal" href="#Preflighted_requests" title="Preflighted requests">arriba.</a></p>
-
-<h3 id="Access-Control-Request-Headers">Access-Control-Request-Headers</h3>
-
-<p>Usada cuando se emite una solicitud verificada para indicarle al servidor qué cabecera HTTP será usada cuando se haga la solicitud real.</p>
-
-<pre class="notranslate">Access-Control-Request-Headers: &lt;field-name&gt;[, &lt;field-name&gt;]*
-</pre>
-
-<p>Ejemplos de esta utilización pueden ser encontrados <a class="internal" href="/En/HTTP_access_control#Preflighted_requests" title="En/HTTP access control#Preflighted requests">arriba</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Fetch', '#cors-protocol', 'CORS')}}</td>
-   <td>{{Spec2('Fetch')}}</td>
-   <td>Nueva definición; tiene como objetivo suplantar la especificación CORS.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('CORS')}}</td>
-   <td>{{Spec2('CORS')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Exploradores">Compatibilidad con Exploradores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>4</td>
-   <td>3.5</td>
-   <td>8 (a través de XDomainRequest)<br>
-    10</td>
-   <td>12</td>
-   <td>4</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>2.1</td>
-   <td>yes</td>
-   <td>yes</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>12</td>
-   <td>3.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h4 id="Nota">Nota</h4>
-
-<p>Internet Explorer 8 y 9 exponen CORS a través del objeto XDomainRequest, pero tienen una implementación completa en IE 10. Mientras que Firefox 3.5 introduce el soporte para XMLHttpRequests y Web Fonts para sitios cruzados, algunas solicitudes fueron limitadas hasta versiones posteriores. Especificamente, Firefox 7 introduce la habilidad para solicitudes HTTP de sitios cruzados para Texturas WebGL, y Firefox 9 añade soporte para imágenes dibujadas en patrones utilizando drawImage.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a class="external" href="http://arunranga.com/examples/access-control/" title="http://arunranga.com/examples/access-control/">Muestras de Código mostrando <code>XMLHttpRequest</code> e Intercambio de Recursos de Origen Cruzado</a></li>
- <li><a class="external" href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Server-Side_Access_Control" title="https://developer.mozilla.org/en-US/docs/Web/HTTP/Server-Side_Access_Control">Intercambio de Recursos de Origen Cruzado desde una perspectiva de Servidor (PHP, etc.)</a></li>
- <li><a class="external" href="http://www.w3.org/TR/cors/" title="http://www.w3.org/TR/cors/">Especificación del Intercambio de Recursos de Origen Cruzado</a></li>
- <li><a class="internal" href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest"><code>XMLHttpRequest</code></a></li>
- <li><a class="external" href="http://crypto.stanford.edu/websec/specs/origin-header/" title="http://crypto.stanford.edu/websec/specs/origin-header/">Discusión adicional sobre el encabezado Origin</a></li>
- <li><a class="external" href="http://www.kendoui.com/blogs/teamblog/posts/11-10-03/using_cors_with_all_modern_browsers.aspx" title="http://www.kendoui.com/blogs/teamblog/posts/11-10-04/using_cors_with_all_modern_browsers.aspx">Usando CORS con todos los exploradores (modernos).</a></li>
- <li><a href="http://www.html5rocks.com/en/tutorials/cors/" title="http://www.html5rocks.com/en/tutorials/cors/">Usando CORS - HTML5 Rocks</a></li>
-</ul>
-
-<p>{{ languages( { "ja": "ja/HTTP_access_control" } ) }}</p>
diff --git a/files/es/web/http/basics_of_http/data_uris/index.html b/files/es/web/http/basics_of_http/data_uris/index.html
new file mode 100644
index 0000000000..1f562fc84c
--- /dev/null
+++ b/files/es/web/http/basics_of_http/data_uris/index.html
@@ -0,0 +1,169 @@
+---
+title: Datos URIs
+slug: Web/HTTP/Basics_of_HTTP/Data_URIs
+tags:
+  - Base 64
+  - Guia(2)
+  - Intermedio
+  - URI
+  - URL
+translation_of: Web/HTTP/Basics_of_HTTP/Data_URIs
+original_slug: Web/HTTP/Basics_of_HTTP/Datos_URIs
+---
+<div>{{HTTPSidebar}}</div>
+
+<p><strong>Datos URIs</strong>, URLs prefijados con los datos<code>:</code> esquema, permiten a los creadores de contenido incorporar pequeños archivos en linea en los documentos.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p>Los datos URIs se componen de cuatro partes a: un prefijo (<code>data:</code>), un tipo MIME que indica el tipo de datos, un token <code>base64</code> opcional no textual, y los datos en si:</p>
+
+<pre class="syntaxbox">data:[&lt;mediatype&gt;][;base64],&lt;data&gt;
+</pre>
+
+<p>El <code>mediatype</code> es una cadena de tipo MIME, por ejemplo <code>'image/jpeg'</code> para un archivo de imagen JPEG. si se omite, será por defecto <code>text/plain;charset=US-ASCII</code></p>
+
+<p>Si el dato es textual, solo tiene que insertar el texto (utilizando las entidades o escapes adecuados en función del tipo de documento). Por otra parte, puedes especificar base-64 para insertar datos binarios codificados en base-64.</p>
+
+<p>Algunos ejemplos:</p>
+
+<dl>
+ <dt><code>data:,Hello%2C%20World!</code></dt>
+ <dd>Datos simples text/plain</dd>
+ <dt><code>data:text/plain;base64,SGVsbG8sIFdvcmxkIQ%3D%3D</code></dt>
+ <dd>versión codificada en base64-encoded de las anteriores</dd>
+ <dt><code>data:text/html,%3Ch1%3EHello%2C%20World!%3C%2Fh1%3E</code></dt>
+ <dd>Un documento HTML con <code>&lt;h1&gt;Hello, World!&lt;/h1&gt;</code></dd>
+ <dt><code>data:text/html,&lt;script&gt;alert('hi');&lt;/script&gt;</code></dt>
+ <dd>Un documento HTML que ejecuta una alerta Javascript. Tenga en cuenta que se requiere la etiqueta script de cierre.</dd>
+</dl>
+
+<h2 id="Codificación_de_datos_en_formato_base64">Codificación de datos en formato base64</h2>
+
+<p>Esto se puede hacer fácilmente desde la línea de comandos usando <code>uuencode, </code>una utilidad disponible en sistemas Linux y Mac OS X:</p>
+
+<pre>uuencode -m infile remotename
+</pre>
+
+<p>El parámetro <code>infile</code> es el nombre para el archivo que desees decodificar en formato base64, y <code>remotename</code> es el nombre remoto para el archivo, que no se utilizará realmente en los datos de las URLs.</p>
+
+<p>La salida será similar a esto:</p>
+
+<pre>xbegin-base64 664 test
+YSBzbGlnaHRseSBsb25nZXIgdGVzdCBmb3IgdGV2ZXIK
+====
+</pre>
+
+<p>El URI de datos utilizará los datos codificados después de la cabezera inicial.</p>
+
+<h3 id="En_la_pagina_Web_usando_JavaScript">En la pagina Web, usando JavaScript</h3>
+
+<p>Las Web tiene APIs primitivas para codificar o decodificar en base64: <a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding">codificación y decodificación Base64</a>.</p>
+
+<h2 id="Problemas_comunes">Problemas comunes</h2>
+
+<p>Esta sección describe los problemas que comunmente ocurren cuando se crean o se usan los datos URIs.</p>
+
+<dl>
+ <dt>Sintaxis</dt>
+ <dd>El formato de los datos URIs es muy simple, pero es facil olvidarse de poner una coma antes del segmento de la "data", o para codificar incorrectamente los datos en formato base64.</dd>
+ <dt>Formateando en HTML</dt>
+ <dd>Un dato URI provee un archivo dentro de un archivo, que potenciamente puede ser muy amplia con relación con el ancho del documento de cierre. Como una URL, los datos se les puede dar formato con espacios en blanco (<span class="short_text" id="result_box" lang="es"><span>avance de línea</span><span>,</span> <span>pestaña</span><span>, o espacios</span></span>), pero hay cuestiones prácticas que se plantean <a class="external" href="http://bugzilla.mozilla.org/show_bug.cgi?id=73026#c12">cuando se usa codificación base64</a>.</dd>
+ <dt>Limitaciones de longitud</dt>
+ <dd>Aunque Firefox soporta con URIs de datos de longitud esencialmente ilimitada, los navegadores no estan obligados a apoyar cualquier longitud máxima de datos en particular. Por ejemplo, el navegador Opera 11 limita las URIs de datos cerca de<code> los </code>65000 caracteres.</dd>
+ <dt>Falta de control de errores</dt>
+ <dd>Los parametros no válidos en los medios de comunicación, o errores ortográficos cuando se especifiquen<code> 'base64'</code>, se ignoran, pero no se proporciona ningún error.</dd>
+ <dt>No hay soporte para consulta de cadenas, etc.</dt>
+ <dd>
+ <p>Las partes de datos de URIs de datos son opácos, por lo que un intento de utilizar una cadena de consulta (parametros específicos de página, con la sintaxis<code> &lt;url&gt;?parameter-data</code>) con un URIs de datos que se acaba de incluir la cadena de consulta en los datos de la URI que representa. Por ejemplo:</p>
+
+ <pre>data:text/html,lots of text...&lt;p&gt;&lt;a name%3D"bottom"&gt;bottom&lt;/a&gt;?arg=val
+</pre>
+
+ <p>Esto representa un recurso HTML cuyo contenido es:</p>
+
+ <pre class="eval">lots of text...&lt;p&gt;&lt;a name="bottom"&gt;bottom&lt;/a&gt;?arg=val
+</pre>
+ </dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Título</th>
+  </tr>
+  <tr>
+   <td>{{RFC("2397")}}</td>
+   <td>The "data" URL scheme"</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table" style="height: 64px; width: 812px;">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Edge</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>12<sup>[2]</sup></td>
+   <td>{{CompatIE(8)}}<sup>[1][2]</sup></td>
+   <td>7.20</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] IE8 solo soporta datos URIs en archivos CSS, con un tamaño máximo de 32kB.</p>
+
+<p>[2]IE9 y posteriores, así como Edge, soportan datos URIs en archivos CSS y JS, pero no en archivos HTML, con un tamaño máximo de 4GB.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding">Base64 codificación y decodificación</a></li>
+ <li>{{domxref("WindowBase64.atob","atob()")}}</li>
+ <li>{{domxref("WindowBase64.btoa","btoa()")}}</li>
+ <li><a href="/en-US/docs/Web/CSS/uri">CSS <code>url()</code></a></li>
+ <li><a href="/en-US/docs/URI">URI</a></li>
+</ul>
diff --git a/files/es/web/http/basics_of_http/datos_uris/index.html b/files/es/web/http/basics_of_http/datos_uris/index.html
deleted file mode 100644
index 6fa23a5ba3..0000000000
--- a/files/es/web/http/basics_of_http/datos_uris/index.html
+++ /dev/null
@@ -1,168 +0,0 @@
----
-title: Datos URIs
-slug: Web/HTTP/Basics_of_HTTP/Datos_URIs
-tags:
-  - Base 64
-  - Guia(2)
-  - Intermedio
-  - URI
-  - URL
-translation_of: Web/HTTP/Basics_of_HTTP/Data_URIs
----
-<div>{{HTTPSidebar}}</div>
-
-<p><strong>Datos URIs</strong>, URLs prefijados con los datos<code>:</code> esquema, permiten a los creadores de contenido incorporar pequeños archivos en linea en los documentos.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p>Los datos URIs se componen de cuatro partes a: un prefijo (<code>data:</code>), un tipo MIME que indica el tipo de datos, un token <code>base64</code> opcional no textual, y los datos en si:</p>
-
-<pre class="syntaxbox">data:[&lt;mediatype&gt;][;base64],&lt;data&gt;
-</pre>
-
-<p>El <code>mediatype</code> es una cadena de tipo MIME, por ejemplo <code>'image/jpeg'</code> para un archivo de imagen JPEG. si se omite, será por defecto <code>text/plain;charset=US-ASCII</code></p>
-
-<p>Si el dato es textual, solo tiene que insertar el texto (utilizando las entidades o escapes adecuados en función del tipo de documento). Por otra parte, puedes especificar base-64 para insertar datos binarios codificados en base-64.</p>
-
-<p>Algunos ejemplos:</p>
-
-<dl>
- <dt><code>data:,Hello%2C%20World!</code></dt>
- <dd>Datos simples text/plain</dd>
- <dt><code>data:text/plain;base64,SGVsbG8sIFdvcmxkIQ%3D%3D</code></dt>
- <dd>versión codificada en base64-encoded de las anteriores</dd>
- <dt><code>data:text/html,%3Ch1%3EHello%2C%20World!%3C%2Fh1%3E</code></dt>
- <dd>Un documento HTML con <code>&lt;h1&gt;Hello, World!&lt;/h1&gt;</code></dd>
- <dt><code>data:text/html,&lt;script&gt;alert('hi');&lt;/script&gt;</code></dt>
- <dd>Un documento HTML que ejecuta una alerta Javascript. Tenga en cuenta que se requiere la etiqueta script de cierre.</dd>
-</dl>
-
-<h2 id="Codificación_de_datos_en_formato_base64">Codificación de datos en formato base64</h2>
-
-<p>Esto se puede hacer fácilmente desde la línea de comandos usando <code>uuencode, </code>una utilidad disponible en sistemas Linux y Mac OS X:</p>
-
-<pre>uuencode -m infile remotename
-</pre>
-
-<p>El parámetro <code>infile</code> es el nombre para el archivo que desees decodificar en formato base64, y <code>remotename</code> es el nombre remoto para el archivo, que no se utilizará realmente en los datos de las URLs.</p>
-
-<p>La salida será similar a esto:</p>
-
-<pre>xbegin-base64 664 test
-YSBzbGlnaHRseSBsb25nZXIgdGVzdCBmb3IgdGV2ZXIK
-====
-</pre>
-
-<p>El URI de datos utilizará los datos codificados después de la cabezera inicial.</p>
-
-<h3 id="En_la_pagina_Web_usando_JavaScript">En la pagina Web, usando JavaScript</h3>
-
-<p>Las Web tiene APIs primitivas para codificar o decodificar en base64: <a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding">codificación y decodificación Base64</a>.</p>
-
-<h2 id="Problemas_comunes">Problemas comunes</h2>
-
-<p>Esta sección describe los problemas que comunmente ocurren cuando se crean o se usan los datos URIs.</p>
-
-<dl>
- <dt>Sintaxis</dt>
- <dd>El formato de los datos URIs es muy simple, pero es facil olvidarse de poner una coma antes del segmento de la "data", o para codificar incorrectamente los datos en formato base64.</dd>
- <dt>Formateando en HTML</dt>
- <dd>Un dato URI provee un archivo dentro de un archivo, que potenciamente puede ser muy amplia con relación con el ancho del documento de cierre. Como una URL, los datos se les puede dar formato con espacios en blanco (<span class="short_text" id="result_box" lang="es"><span>avance de línea</span><span>,</span> <span>pestaña</span><span>, o espacios</span></span>), pero hay cuestiones prácticas que se plantean <a class="external" href="http://bugzilla.mozilla.org/show_bug.cgi?id=73026#c12">cuando se usa codificación base64</a>.</dd>
- <dt>Limitaciones de longitud</dt>
- <dd>Aunque Firefox soporta con URIs de datos de longitud esencialmente ilimitada, los navegadores no estan obligados a apoyar cualquier longitud máxima de datos en particular. Por ejemplo, el navegador Opera 11 limita las URIs de datos cerca de<code> los </code>65000 caracteres.</dd>
- <dt>Falta de control de errores</dt>
- <dd>Los parametros no válidos en los medios de comunicación, o errores ortográficos cuando se especifiquen<code> 'base64'</code>, se ignoran, pero no se proporciona ningún error.</dd>
- <dt>No hay soporte para consulta de cadenas, etc.</dt>
- <dd>
- <p>Las partes de datos de URIs de datos son opácos, por lo que un intento de utilizar una cadena de consulta (parametros específicos de página, con la sintaxis<code> &lt;url&gt;?parameter-data</code>) con un URIs de datos que se acaba de incluir la cadena de consulta en los datos de la URI que representa. Por ejemplo:</p>
-
- <pre>data:text/html,lots of text...&lt;p&gt;&lt;a name%3D"bottom"&gt;bottom&lt;/a&gt;?arg=val
-</pre>
-
- <p>Esto representa un recurso HTML cuyo contenido es:</p>
-
- <pre class="eval">lots of text...&lt;p&gt;&lt;a name="bottom"&gt;bottom&lt;/a&gt;?arg=val
-</pre>
- </dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Título</th>
-  </tr>
-  <tr>
-   <td>{{RFC("2397")}}</td>
-   <td>The "data" URL scheme"</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table" style="height: 64px; width: 812px;">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Edge</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>12<sup>[2]</sup></td>
-   <td>{{CompatIE(8)}}<sup>[1][2]</sup></td>
-   <td>7.20</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] IE8 solo soporta datos URIs en archivos CSS, con un tamaño máximo de 32kB.</p>
-
-<p>[2]IE9 y posteriores, así como Edge, soportan datos URIs en archivos CSS y JS, pero no en archivos HTML, con un tamaño máximo de 4GB.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding">Base64 codificación y decodificación</a></li>
- <li>{{domxref("WindowBase64.atob","atob()")}}</li>
- <li>{{domxref("WindowBase64.btoa","btoa()")}}</li>
- <li><a href="/en-US/docs/Web/CSS/uri">CSS <code>url()</code></a></li>
- <li><a href="/en-US/docs/URI">URI</a></li>
-</ul>
diff --git a/files/es/web/http/basics_of_http/identificación_recursos_en_la_web/index.html b/files/es/web/http/basics_of_http/identificación_recursos_en_la_web/index.html
deleted file mode 100644
index f666c9240f..0000000000
--- a/files/es/web/http/basics_of_http/identificación_recursos_en_la_web/index.html
+++ /dev/null
@@ -1,169 +0,0 @@
----
-title: Identificación de recursos web
-slug: Web/HTTP/Basics_of_HTTP/Identificación_recursos_en_la_Web
-translation_of: Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web
----
-<div>{{HTTPSidebar}}</div>
-
-<p class="summary">El objetivo de una solicitud HTTP se denomina "recurso", (es decir: datos), y dicho recurso, no posee un tipo definido por defecto; puede ser un documento, o una foto, o cualquier otra posibilidad. Cada recurso es identificado por un Identificador Uniforme de Recursos ({{Glossary("URI")}})  y es utilizado a través de HTTP, para la identificación del tipo de recurso.</p>
-
-<p>La identidad y la localización del recursos en la Web son en su mayoria proporcionados por una sola dirección URL (Localicador de Recursos Uniforme; un tipo de URI). A veces, el mismo URI no proporciona la identidad ni la ubicación: HTTP usa un encabezado HTTP especifico, {{HTTPHeader("Alt-Svc")}} cuando el recurso solicitado por el cliente quiere acceder a él en otra ubicación.</p>
-
-<h2 id="URLs_and_URNs">URLs and URNs</h2>
-
-<h3 id="URLs">URLs</h3>
-
-<p>La forma más común de URI es la ({{Glossary("URL")}}) (de las siglas en ingles: "<em>Uniform Resource Locator</em>", que podría traducirse como: Localizador Uniforme de Recursos), <em>que se conoce como la dirección web.</em></p>
-
-<pre>https://developer.mozilla.org
-https://developer.mozilla.org/en-US/docs/Learn/
-https://developer.mozilla.org/en-US/search?q=URL</pre>
-
-<p>Cualquiera de estas URLs se pueden escribir en la barra de direcciones de su navegador para decirle que cargue la pagina asociada (recurso).</p>
-
-<p>Una URL esta compuesta de diferentes partes, algunas obligatorias y otras son opcionales. Un ejemplo más complejo podría tener este aspecto:</p>
-
-<pre>http://www.example.com:80/path/to/myfile.html?key1=value1&amp;key2=value2#SomewhereInTheDocument</pre>
-
-<h3 id="URNs">URNs</h3>
-
-<p><span id="result_box" lang="es"><span>Un</span> <span>URN</span> <span>es</span> <span>una URI que</span> <span>identifica un recurso</span> <span>por su nombre en</span> <span>un espacio de nombres</span> <span>particular.</span></span></p>
-
-<pre>urn:isbn:9780141036144
-urn:ietf:rfc:7230
-</pre>
-
-<p>Las dos URNs corresponden a</p>
-
-<ul>
- <li>El libro "1984" por George Orwell,</li>
- <li>La especificación IETF 7230, Hypertext Transfer Protocol (HTTP/1.1): Sintaxis de Mensajes y Enrutamiento.</li>
-</ul>
-
-<h2 id="Sintaxis_de_Identificador_Uniforme_de_Recursos_(URIs)">Sintaxis de Identificador Uniforme de Recursos (URIs)</h2>
-
-<h3 id="sect1"> </h3>
-
-<h3 id="Esquema_o_protocolo">Esquema o protocolo</h3>
-
-<dl>
- <dt><img alt="Protocol" src="https://mdn.mozillademos.org/files/8013/mdn-url-protocol@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>http://</code> es el protocolo. Indica que el protocolo debe utilizar el navegador. Por lo general, es el protocolo HTTP o su versión segura, HTTPS. La Web requiere de uno de estos dos, pero los navegadores también saben como manejar otros protocolos como  <code>mailto:</code> (para abrir un cliente de correo) o <code>ftp:</code> para manejar la transferencia de archivos, por lo que no se sorprenda si usted ve este tipo de protocolos. Los esquemas comunes son:</dd>
-</dl>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Esquema</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>data</td>
-   <td><a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs">Datos URIs</a></td>
-  </tr>
-  <tr>
-   <td>file</td>
-   <td>Host-nombre de archivo específicos</td>
-  </tr>
-  <tr>
-   <td>ftp</td>
-   <td><a href="/en-US/docs/Glossary/FTP">Protocolo de Transferencia de  Archivos</a></td>
-  </tr>
-  <tr>
-   <td>http/https</td>
-   <td><a href="/en-US/docs/Glossary/HTTP">Protocolo de transferencia de Hipertexto (Seguro)</a></td>
-  </tr>
-  <tr>
-   <td>mailto</td>
-   <td>Dirección de correo electrónico</td>
-  </tr>
-  <tr>
-   <td>ssh</td>
-   <td>shell seguro</td>
-  </tr>
-  <tr>
-   <td>tel</td>
-   <td>teléfono</td>
-  </tr>
-  <tr>
-   <td>urn</td>
-   <td>Nombres Uniformes de Recursos</td>
-  </tr>
-  <tr>
-   <td>view-source</td>
-   <td>Código fuente del recurso</td>
-  </tr>
-  <tr>
-   <td>ws/wss</td>
-   <td>(Encriptado) conexiones <a href="/en-US/docs/Web/API/WebSockets_API">WebSocket</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Autoridad">Autoridad</h3>
-
-<dl>
- <dt><img alt="Domaine Name" src="https://mdn.mozillademos.org/files/8015/mdn-url-domain@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>www.example.com</code> es el nombre de dominio o autoridad que gobierna el espacio de nombres. Indica cuando es solicitado el servidor Web . Alternativamente, Es posile usar directamente una {{Glossary("IP address")}}, pero debido a que es menos conveniente, no se usa muy amenudo en la Web.</dd>
-</dl>
-
-<h3 id="Puerto">Puerto</h3>
-
-<dl>
- <dt><img alt="Port" src="https://mdn.mozillademos.org/files/8017/mdn-url-port@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>:80</code> es el puerto en este caso. Indica la técnica "puerta" usada para acceder a los recursos en el servidor web. Usualmente es omitido si el servidor web usa los puertos estándares del protocolo HTTP (80 para HTTP y 443 para HTTPS) para permitir el acceso a sus recursos. De lo contrario, es obligatorio.</dd>
-</dl>
-
-<h3 id="Ruta_de_Acceso">Ruta de Acceso</h3>
-
-<dl>
- <dt><img alt="Path to the file" src="https://mdn.mozillademos.org/files/8019/mdn-url-path@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>/path/to/myfile.html</code> es la ruta de acceso al recurso en el servidor Web. En los primeros dias de la Web, una ruta como esta presentaba la ubicación fisica del archivo en el servidor Web. Hoy en día, es sobre todo una abstracción manejada por los servidores Web sin ningún tipo de realidad fisica.</dd>
-</dl>
-
-<h3 id="Consulta">Consulta</h3>
-
-<dl>
- <dt><img alt="Parameters" src="https://mdn.mozillademos.org/files/8021/mdn-url-parameters@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>?key1=value1&amp;key2=value2</code> son unos parametros adicionales proporcionados al servidor Web. Esos parámetros son una lista de pares llave/valores separados por el simbolo &amp;. El servidor Web puede utilizar estos parámetros para hacer cosas adicionales antes de retornar el recurso al usuario. Cada servidor Web tiene sus propias reglas con respecto a los parametros, y la única manera confiable de saber cómo un servidor web especifico está manejando parametros es preguntando al usuario del servidor web.</dd>
-</dl>
-
-<h3 id="Fragmento">Fragmento</h3>
-
-<dl>
- <dt><img alt="Anchor" src="https://mdn.mozillademos.org/files/8023/mdn-url-anchor@x2.png" style="height: 70px; width: 440px;"></dt>
- <dd><code>#SomewhereInTheDocument</code> es una referencia a otra parte del propio recurso. Esto representa una especie de "marcador" dentro del recurso, otorgandole al navegador las instrucciones para mostrar el contenido que se encuentra en esa referencia señalada. En un documento HTML, por ejemplo, el navegador se desplazará hasta el punto donde se define el fragmento; en un video o documento de audio, el navegador intentará ir a la vez que el ancla se presenta. Vale la pena señalar que la parte despues de la  #, también conocido como indentificador de fragmento, nunca se envia al servidor con la solicitud.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre>https://developer.mozilla.org/en-US/docs/Learn
-tel:+1-816-555-1212
-git@github.com:mdn/browser-compat-data.git
-ftp://example.org/resource.txt
-urn:isbn:9780141036144
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Título</th>
-  </tr>
-  <tr>
-   <td>{{RFC("7230", "Uniform Resource Identifiers", "2.7")}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Message Syntax and Routing</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Learn/Common_questions/What_is_a_URL">Qué es una URL?</a></li>
- <li><a href="http://www.iana.org/assignments/uri-schemes/uri-schemes.xhtml">Lista de esquemas URI IANA </a></li>
-</ul>
diff --git a/files/es/web/http/basics_of_http/identifying_resources_on_the_web/index.html b/files/es/web/http/basics_of_http/identifying_resources_on_the_web/index.html
new file mode 100644
index 0000000000..5d1a95b6d3
--- /dev/null
+++ b/files/es/web/http/basics_of_http/identifying_resources_on_the_web/index.html
@@ -0,0 +1,170 @@
+---
+title: Identificación de recursos web
+slug: Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web
+translation_of: Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web
+original_slug: Web/HTTP/Basics_of_HTTP/Identificación_recursos_en_la_Web
+---
+<div>{{HTTPSidebar}}</div>
+
+<p class="summary">El objetivo de una solicitud HTTP se denomina "recurso", (es decir: datos), y dicho recurso, no posee un tipo definido por defecto; puede ser un documento, o una foto, o cualquier otra posibilidad. Cada recurso es identificado por un Identificador Uniforme de Recursos ({{Glossary("URI")}})  y es utilizado a través de HTTP, para la identificación del tipo de recurso.</p>
+
+<p>La identidad y la localización del recursos en la Web son en su mayoria proporcionados por una sola dirección URL (Localicador de Recursos Uniforme; un tipo de URI). A veces, el mismo URI no proporciona la identidad ni la ubicación: HTTP usa un encabezado HTTP especifico, {{HTTPHeader("Alt-Svc")}} cuando el recurso solicitado por el cliente quiere acceder a él en otra ubicación.</p>
+
+<h2 id="URLs_and_URNs">URLs and URNs</h2>
+
+<h3 id="URLs">URLs</h3>
+
+<p>La forma más común de URI es la ({{Glossary("URL")}}) (de las siglas en ingles: "<em>Uniform Resource Locator</em>", que podría traducirse como: Localizador Uniforme de Recursos), <em>que se conoce como la dirección web.</em></p>
+
+<pre>https://developer.mozilla.org
+https://developer.mozilla.org/en-US/docs/Learn/
+https://developer.mozilla.org/en-US/search?q=URL</pre>
+
+<p>Cualquiera de estas URLs se pueden escribir en la barra de direcciones de su navegador para decirle que cargue la pagina asociada (recurso).</p>
+
+<p>Una URL esta compuesta de diferentes partes, algunas obligatorias y otras son opcionales. Un ejemplo más complejo podría tener este aspecto:</p>
+
+<pre>http://www.example.com:80/path/to/myfile.html?key1=value1&amp;key2=value2#SomewhereInTheDocument</pre>
+
+<h3 id="URNs">URNs</h3>
+
+<p><span id="result_box" lang="es"><span>Un</span> <span>URN</span> <span>es</span> <span>una URI que</span> <span>identifica un recurso</span> <span>por su nombre en</span> <span>un espacio de nombres</span> <span>particular.</span></span></p>
+
+<pre>urn:isbn:9780141036144
+urn:ietf:rfc:7230
+</pre>
+
+<p>Las dos URNs corresponden a</p>
+
+<ul>
+ <li>El libro "1984" por George Orwell,</li>
+ <li>La especificación IETF 7230, Hypertext Transfer Protocol (HTTP/1.1): Sintaxis de Mensajes y Enrutamiento.</li>
+</ul>
+
+<h2 id="Sintaxis_de_Identificador_Uniforme_de_Recursos_(URIs)">Sintaxis de Identificador Uniforme de Recursos (URIs)</h2>
+
+<h3 id="sect1"> </h3>
+
+<h3 id="Esquema_o_protocolo">Esquema o protocolo</h3>
+
+<dl>
+ <dt><img alt="Protocol" src="https://mdn.mozillademos.org/files/8013/mdn-url-protocol@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>http://</code> es el protocolo. Indica que el protocolo debe utilizar el navegador. Por lo general, es el protocolo HTTP o su versión segura, HTTPS. La Web requiere de uno de estos dos, pero los navegadores también saben como manejar otros protocolos como  <code>mailto:</code> (para abrir un cliente de correo) o <code>ftp:</code> para manejar la transferencia de archivos, por lo que no se sorprenda si usted ve este tipo de protocolos. Los esquemas comunes son:</dd>
+</dl>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Esquema</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>data</td>
+   <td><a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs">Datos URIs</a></td>
+  </tr>
+  <tr>
+   <td>file</td>
+   <td>Host-nombre de archivo específicos</td>
+  </tr>
+  <tr>
+   <td>ftp</td>
+   <td><a href="/en-US/docs/Glossary/FTP">Protocolo de Transferencia de  Archivos</a></td>
+  </tr>
+  <tr>
+   <td>http/https</td>
+   <td><a href="/en-US/docs/Glossary/HTTP">Protocolo de transferencia de Hipertexto (Seguro)</a></td>
+  </tr>
+  <tr>
+   <td>mailto</td>
+   <td>Dirección de correo electrónico</td>
+  </tr>
+  <tr>
+   <td>ssh</td>
+   <td>shell seguro</td>
+  </tr>
+  <tr>
+   <td>tel</td>
+   <td>teléfono</td>
+  </tr>
+  <tr>
+   <td>urn</td>
+   <td>Nombres Uniformes de Recursos</td>
+  </tr>
+  <tr>
+   <td>view-source</td>
+   <td>Código fuente del recurso</td>
+  </tr>
+  <tr>
+   <td>ws/wss</td>
+   <td>(Encriptado) conexiones <a href="/en-US/docs/Web/API/WebSockets_API">WebSocket</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Autoridad">Autoridad</h3>
+
+<dl>
+ <dt><img alt="Domaine Name" src="https://mdn.mozillademos.org/files/8015/mdn-url-domain@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>www.example.com</code> es el nombre de dominio o autoridad que gobierna el espacio de nombres. Indica cuando es solicitado el servidor Web . Alternativamente, Es posile usar directamente una {{Glossary("IP address")}}, pero debido a que es menos conveniente, no se usa muy amenudo en la Web.</dd>
+</dl>
+
+<h3 id="Puerto">Puerto</h3>
+
+<dl>
+ <dt><img alt="Port" src="https://mdn.mozillademos.org/files/8017/mdn-url-port@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>:80</code> es el puerto en este caso. Indica la técnica "puerta" usada para acceder a los recursos en el servidor web. Usualmente es omitido si el servidor web usa los puertos estándares del protocolo HTTP (80 para HTTP y 443 para HTTPS) para permitir el acceso a sus recursos. De lo contrario, es obligatorio.</dd>
+</dl>
+
+<h3 id="Ruta_de_Acceso">Ruta de Acceso</h3>
+
+<dl>
+ <dt><img alt="Path to the file" src="https://mdn.mozillademos.org/files/8019/mdn-url-path@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>/path/to/myfile.html</code> es la ruta de acceso al recurso en el servidor Web. En los primeros dias de la Web, una ruta como esta presentaba la ubicación fisica del archivo en el servidor Web. Hoy en día, es sobre todo una abstracción manejada por los servidores Web sin ningún tipo de realidad fisica.</dd>
+</dl>
+
+<h3 id="Consulta">Consulta</h3>
+
+<dl>
+ <dt><img alt="Parameters" src="https://mdn.mozillademos.org/files/8021/mdn-url-parameters@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>?key1=value1&amp;key2=value2</code> son unos parametros adicionales proporcionados al servidor Web. Esos parámetros son una lista de pares llave/valores separados por el simbolo &amp;. El servidor Web puede utilizar estos parámetros para hacer cosas adicionales antes de retornar el recurso al usuario. Cada servidor Web tiene sus propias reglas con respecto a los parametros, y la única manera confiable de saber cómo un servidor web especifico está manejando parametros es preguntando al usuario del servidor web.</dd>
+</dl>
+
+<h3 id="Fragmento">Fragmento</h3>
+
+<dl>
+ <dt><img alt="Anchor" src="https://mdn.mozillademos.org/files/8023/mdn-url-anchor@x2.png" style="height: 70px; width: 440px;"></dt>
+ <dd><code>#SomewhereInTheDocument</code> es una referencia a otra parte del propio recurso. Esto representa una especie de "marcador" dentro del recurso, otorgandole al navegador las instrucciones para mostrar el contenido que se encuentra en esa referencia señalada. En un documento HTML, por ejemplo, el navegador se desplazará hasta el punto donde se define el fragmento; en un video o documento de audio, el navegador intentará ir a la vez que el ancla se presenta. Vale la pena señalar que la parte despues de la  #, también conocido como indentificador de fragmento, nunca se envia al servidor con la solicitud.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre>https://developer.mozilla.org/en-US/docs/Learn
+tel:+1-816-555-1212
+git@github.com:mdn/browser-compat-data.git
+ftp://example.org/resource.txt
+urn:isbn:9780141036144
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Título</th>
+  </tr>
+  <tr>
+   <td>{{RFC("7230", "Uniform Resource Identifiers", "2.7")}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Message Syntax and Routing</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Learn/Common_questions/What_is_a_URL">Qué es una URL?</a></li>
+ <li><a href="http://www.iana.org/assignments/uri-schemes/uri-schemes.xhtml">Lista de esquemas URI IANA </a></li>
+</ul>
diff --git a/files/es/web/http/conditional_requests/index.html b/files/es/web/http/conditional_requests/index.html
new file mode 100644
index 0000000000..6c342e2a8c
--- /dev/null
+++ b/files/es/web/http/conditional_requests/index.html
@@ -0,0 +1,149 @@
+---
+title: Peticiones condicionales en HTTP
+slug: Web/HTTP/Conditional_requests
+tags:
+  - Guía
+  - HTTP
+  - Peticiones condicionales
+translation_of: Web/HTTP/Conditional_requests
+original_slug: Web/HTTP/Peticiones_condicionales
+---
+<p>{{HTTPSidebar}}</p>
+
+<p class="summary">HTTP tiene un concepto de peticiones condicionales, donde el resultado, e incluso el éxito de una petición, se puede cambiar comparando los recursos afectados con el valor de un validador. Dichas peticiones pueden ser útiles para validar el contenido de un caché, y evitar un control inútil, para verificar la integridad de un documento, como al reanudar una descarga, o al evitar perder actualizaciones al cargar o modificar un documento en el servidor.</p>
+
+<h2 id="Principios">Principios</h2>
+
+<p>Las peticiones condicionales HTTP son peticiones que se ejecutan de manera diferente, dependiendo del valor de encabezados específicos. Estos encabezados definen una condición previa, y el resultado de la petición será diferente si la condición previa coincide o no.</p>
+
+<p>Los diferentes comportamientos están definidos por el método de petición utilizado y por el conjunto de encabezados utilizados para una condición previa:</p>
+
+<ul>
+ <li>para métodos seguros, como {{HTTPMethod("GET")}}, que generalmente intenta recuperar un documento, la petición condicional se puede usar para devolver el documento, solo si es relevante. Por lo tanto, esto ahorra ancho de banda.</li>
+ <li>para métodos no seguros, como {{HTTPMethod("PUT")}}, que generalmente carga un documento, la petición condicional se puede usar para cargar el documento, solo si el original en el que se basa es el mismo que el almacenado en el servidor.</li>
+</ul>
+
+<h2 id="Validadores">Validadores</h2>
+
+<p>Todos los encabezados condicionales intentan verificar si el recurso almacenado en el servidor coincide con una versión específica. Para lograr esto, las peticiones condicionales deben indicar la versión del recurso. Como la comparación de todo el recurso byte a byte es impracticable, y no siempre lo que se desea, la petición transmite un valor que describe la versión. Tales valores se llaman validadores y son de dos tipos:</p>
+
+<ul>
+ <li>la fecha de la última modificación del documento, la fecha <em>last-modified</em>.</li>
+ <li>una cadena opaca, que identifica de forma única cada versión, llamada <em>etiqueta de entidad</em>, o <em>etag</em>.</li>
+</ul>
+
+<p>Comparar versiones del mismo recurso es un poco complicado: según el contexto, hay dos tipos de controles de igualdad:</p>
+
+<ul>
+ <li><em>Validación fuerte</em>, se utiliza cuando se espera una igualdad byte a byte, por ejemplo, al reanudar una descarga.</li>
+ <li><em>Validación débil</em>, se utiliza cuando el agente de usuario solo necesita determinar si los dos recursos tienen el mismo contenido. Incluso si son pequeñas diferencias, como diferentes anuncios, o un pie de página con una fecha diferente.</li>
+</ul>
+
+<p>El tipo de validación es independiente del validador utilizado. Ambos {{HTTPHeader("Last-Modified")}} y {{HTTPHeader("ETag")}} permiten ambos tipos de validación, aunque la complejidad para implementarlo en el lado del servidor puede variar. HTTP utiliza la validación fuerte de forma predeterminada, y especifica cuándo se puede usar una validación débil.</p>
+
+<h3 id="Validación_fuerte">Validación fuerte</h3>
+
+<p id="sect1">La validación sólida consiste en garantizar que el recurso es, byte a byte, idéntico al que se compara. Esto es obligatorio para algunos encabezados condicionales, y el predeterminado para los demás. La validación sólida es muy estricta y puede ser difícil garantizarla a nivel del servidor, pero garantiza que no se pierdan datos en ningún momento, a veces a expensas del rendimiento.</p>
+
+<p>Es bastante difícil tener un identificador único para una validación fuerte con {{HTTPHeader("Last-Modified")}}. A menudo, esto se hace usando una {{HTTPHeader("ETag")}} con el hash MD5 del recurso (o un derivado).</p>
+
+<h3 id="Validación_débil">Validación débil</h3>
+
+<p>La validación débil difiere de la validación fuerte, ya que considera dos versiones del documento como idénticas si el contenido es equivalente. Por ejemplo, una página que diferiría de otra solo por una fecha diferente en su pie de página, o una publicidad diferente, se consideraría idéntica a la otra con validación débil. Estas dos versiones iguales se consideran diferentes cuando se usa una validación fuerte. Construir un sistema de etags que cree una validación débil puede ser complejo, ya que implica conocer la importancia de los diferentes elementos de una página, pero es muy útil para optimizar el rendimiento del caché.</p>
+
+<h2 id="Encabezados_condicionales">Encabezados condicionales</h2>
+
+<p>Varios encabezados HTTP, llamados encabezados condicionales, conducen a peticiones condicionales. Estos son:</p>
+
+<dl>
+ <dt>{{HTTPHeader("If-Match")}}</dt>
+ <dd>Tiene éxito si la {{HTTPHeader("ETag")}} del recurso remoto es igual a una que se encuentra en este encabezado. Por defecto, a menos que el etag tenga el prefijo <code>'W/'</code>, realiza una validación fuerte.</dd>
+ <dt>{{HTTPHeader("If-None-Match")}}</dt>
+ <dd>Tiene éxito si la {{HTTPHeader("ETag")}} del recurso remoto es diferente a cada una de las enumeradas en este encabezado. Por defecto, a menos que el etag tenga el prefijo <code>'W/'</code>, realiza una validación fuerte.</dd>
+ <dt>{{HTTPHeader("If-Modified-Since")}}</dt>
+ <dd>Tiene éxito si la fecha {{HTTPHeader("Last-Modified")}} del recurso remoto es más reciente que la dada en este encabezado.</dd>
+ <dt>{{HTTPHeader("If-Unmodified-Since")}}</dt>
+ <dd>Tiene éxito si la fecha {{HTTPHeader("Last-Modified")}} del recurso remoto es más antigua que la dada en este encabezado.</dd>
+ <dt>{{HTTPHeader("If-Range")}}</dt>
+ <dd>Similar a {{HTTPHeader("If-Match")}}, o {{HTTPHeader("If-Unmodified-Since")}}, pero sólo puede tener una etag, o una fecha. Si falla, la petición de rango falla, y en lugar de una respuesta {{HTTPStatus("206")}} <code>Partial Content</code> , se envía un {{HTTPStatus("200")}} <code>OK</code> con el recurso completo.</dd>
+</dl>
+
+<h2 id="Casos_de_uso">Casos de uso</h2>
+
+<h3 id="Actualización_de_caché">Actualización de caché</h3>
+
+<p>El caso de uso más común para las peticiones condicionales es la actualización de un caché. Con un caché vacío, o sin un caché, el recurso solicitado se devuelve con un estado {{HTTPStatus("200")}} <code>OK</code>.</p>
+
+<p><img alt="The request issued when the cache is empty triggers the resource to be downloaded, with both validator value sent as headers. The cache is then filled." src="https://mdn.mozillademos.org/files/13729/Cache1.png" style="height: 265px; width: 741px;"></p>
+
+<p>Junto con el recurso, los validadores se envían en los encabezados. En este ejemplo, ambos {{HTTPHeader("Last-Modified")}} y {{HTTPHeader("ETag")}} son enviados, pero igualmente podría haber sido solo uno de ellos. Estos validadores se almacenan en caché con el recurso (como todos los encabezados) y se utilizarán para elaborar peticiones condicionales, una vez que el caché se vuelva obsoleto.</p>
+
+<p>Mientras la memoria caché no esté obsoleta, no se emitirá ninguna petición. Pero una vez se haya vuelto obsoleta, esto se controla principalmente por el encabezado {{HTTPHeader("Cache-Control")}}, el cliente no usa el valor en caché directamente, pero emite una <em>petición condicional</em>. El valor del validador se utiliza como parámetro de los encabezados {{HTTPHeader("If-Modified-Since")}} y {{HTTPHeader("If-Match")}}.</p>
+
+<p>Si el recurso no ha cambiado, el servidor envía una respuesta {{HTTPStatus("304")}} <code>Not Modified</code>. Esto hace que la caché se actualice nuevamente, y el cliente usa el recurso almacenado en caché. Aunque hay una respuesta/petición de ida y vuelta que consume algunos recursos, esto es más eficiente que transmitir de nuevo todo el recurso a través del cable.</p>
+
+<p><img alt="With a stale cache, the conditional request is sent. The server can determine if the resource changed, and, as in this case, decide not to send it again as it is the same." src="https://mdn.mozillademos.org/files/13731/HTTPCache2.png" style="height: 265px; width: 741px;"></p>
+
+<p>Si el recurso ha cambiado, el servidor simplemente envía una respuesta {{HTTPStatus("200")}}<code> OK</code>, con la nueva versión del recurso, como si la petición no fuera condicional y el cliente usara este nuevo recurso (y lo almacena en caché).</p>
+
+<p><img alt="In the case where the resource was changed, it is sent back as if the request wasn't conditional." src="https://mdn.mozillademos.org/files/13733/HTTPCache3.png"></p>
+
+<p>Además de la configuración de los validadores en el lado del servidor, este mecanismo es transparente: todos los navegadores administran una memoria caché y envían dichas peticiones condicionales sin que los desarrolladores web realicen ningún trabajo especial.</p>
+
+<h3 id="Integridad_de_una_descarga_parcial">Integridad de una descarga parcial</h3>
+
+<p>La descarga parcial de archivos es una funcionalidad de HTTP que permite reanudar operaciones previas, ahorrando tiempo y ancho de banda, manteniendo la información ya obtenida:</p>
+
+<p><img alt="A download has been stopped and only partial content has been retrieved." src="https://mdn.mozillademos.org/files/16190/HTTPResume1.png" style="height: 397px; width: 764px;"></p>
+
+<p>Un servidor que admite descargas parciales transmite esto enviando el encabezado {{HTTPHeader("Accept-Ranges")}}. Una vez que esto sucede, el cliente puede reanudar una descarga enviando un encabezado {{HTTPHeader("Ranges")}} con los rangos ausentes:</p>
+
+<p><img alt="The client resumes the requests by indicating the range he needs and preconditions checking the validators of the partially obtained request." src="https://mdn.mozillademos.org/files/13737/HTTPResume2.png"></p>
+
+<p>El principio es simple, pero hay un problema potencial: si el recurso descargado se modificó entre ambas descargas, los rangos obtenidos corresponderán a dos versiones diferentes del recurso y el documento final estará corrupto.</p>
+
+<p>Para evitar esto, se utilizan peticiones condicionales. Para los rangos, hay dos formas de hacer esto. El más flexible hace uso de {{HTTPHeader("If-Modified-Since")}} y {{HTTPHeader("If-Match")}} y el servidor devuelve un error si la precondición falla, entonces el cliente reinicia la descarga desde el principio:</p>
+
+<p><img alt="When the partially downloaded resource has been modified, the preconditions will fail and the resource will have to be downloaded again completely." src="https://mdn.mozillademos.org/files/13739/HTTPResume3.png"></p>
+
+<p>Incluso si este método funciona, agrega un intercambio adicional de respuesta / petición cuando el documento ha sido cambiado. Esto altera el rendimiento, y HTTP tiene un encabezado específico para evitar este escenario: {{HTTPHeader("If-Range")}}:</p>
+
+<p><img alt="The If-Range headers allows the server to directly send back the complete resource if it has been modified, no need to send a 412 error and wait for the client to re-initiate the download." src="https://mdn.mozillademos.org/files/13741/HTTPResume4.png" style="height: 263px; width: 770px;"></p>
+
+<p>Esta solución es más eficiente, pero ligeramente menos flexible, ya que solo se puede usar una etag en la condición. Rara vez se necesita flexibilidad adicional.</p>
+
+<h3 id="Evitar_el_problema_de_actualización_perdida_con_bloqueo_optimista">Evitar el problema de actualización perdida con bloqueo optimista</h3>
+
+<p>Una operación común en aplicaciones web es <em>actualizar</em> un documento remoto. Esto es muy común en cualquier sistema de archivos o aplicaciones de control de origen, pero cualquier aplicación que permita almacenar recursos remotos necesita tal mecanismo. Los sitios web comunes, como los wikis y otros CMS, tienen tal necesidad.</p>
+
+<p>Con el método {{HTTPMethod("PUT")}} eres capaz de implementarlo. El cliente primero lee los archivos originales, los modifica y finalmente los envía al servidor:</p>
+
+<p><img alt="Updating a file with a PUT is very simple when concurrency is not involved." src="https://mdn.mozillademos.org/files/13743/HTTPLock1.png"></p>
+
+<p>Desafortunadamente, las cosas se vuelven un poco inexactas cuando tenemos en cuenta la concurrencia. Mientras un cliente modifica localmente su nueva copia del recurso, un segundo cliente puede obtener el mismo recurso y hacer lo mismo con su copia. Lo que sucede a continuación es muy desafortunado: cuando se devuelven al servidor, las modificaciones del primer cliente son descartadas por la inserción del siguiente cliente, ya que este segundo cliente desconoce los cambios del primer cliente en el recurso. La decisión sobre quién gana, no se comunica a la otra parte. De qué cliente se deberán mantener los cambios, variará con la velocidad a la que se realicen, esto depende del rendimiento de los clientes, del servidor e incluso de la edición humana del documento en el cliente. El ganador cambiará de una vez a la siguiente. Esta es una condición de carrera y conduce a comportamientos problemáticos, que son difíciles de detectar y depurar:</p>
+
+<p><img alt="When several clients update the same resource in parallel, we are facing a race condition: the slowest win, and the others don't even know they lost. Problematic!" src="https://mdn.mozillademos.org/files/13749/HTTPLock2.png" style="height: 504px; width: 904px;"></p>
+
+<p>No hay manera de lidiar con este problema sin molestar a uno de los dos clientes. Sin embargo, se deben evitar las actualizaciones perdidas y las condiciones de la carrera. Queremos resultados predecibles y esperamos que se notifique a los clientes cuando se rechacen sus cambios.</p>
+
+<p>Las peticiones condicionales permiten implementar el <em>algoritmo de bloqueo optimista</em> (utilizado por la mayoría de las wikis o sistemas de control de fuente). El concepto es permitir que todos los clientes obtengan copias del recurso, luego permitirles modificarlo localmente, controlando la concurrencia al permitir que el primer cliente envíe una actualización. Todas las actualizaciones posteriores, basadas en la versión ahora obsoleta del recurso, se rechazan:</p>
+
+<p><img alt="Conditional requests allow to implement optimistic locking: now the quickest wins, and the others get an error." src="https://mdn.mozillademos.org/files/13751/HTTPLock3.png" style="height: 471px; width: 904px;"></p>
+
+<p>Esto se implementa utilizando el encabezado {{HTTPHeader("If-Match")}} o {{HTTPHeader("If-Unmodified-Since")}}. Si la etag no coincide con el archivo original, o si el archivo ha sido modificado desde que se obtuvo, el cambio simplemente se rechaza con un error {{HTTPStatus("412")}} <code>Precondition Failed</code>. Depende entonces del cliente lidiar con el error: ya sea notificando al usuario que vuelva a comenzar (esta vez en la versión más reciente) o mostrándole al usuario una <em>diferencia </em>entre ambas versiones, Ayudándoles a decidir qué cambios desean mantener.</p>
+
+<h3 id="Tratar_con_la_primera_subida_de_un_recurso.">Tratar con la primera subida de un recurso.</h3>
+
+<p>La primera subida de un recurso es un caso similar al anterior. Como cualquier actualización de un recurso, está sujeta a una condición de carrera si dos clientes intentan realizarla en tiempos similares. Para evitar esto, se pueden utilizar peticiones condicionales: añadiendo el encabezado {{HTTPHeader("If-None-Match")}} con el valor especial <code>'*'</code>, representando cualquier etag. La petición sólo tendrá éxito si el recurso no existía antes:</p>
+
+<p><img alt="Like for a regular upload, the first upload of a resource is subject to a race condition: If-None-Match can prevent it." src="https://mdn.mozillademos.org/files/13753/HTTPFirst.png" style="height: 311px; width: 895px;"></p>
+
+<p><code>If-None-Match</code> solo funcionará con servidores compatibles con HTTP/1.1 (y posteriores). Si no está seguro de que el servidor sea compatible, primero debe emitir una petición {{HTTPMethod("HEAD")}} al recurso para comprobarlo.</p>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>Las peticiones condicionales son una característica clave de HTTP y permiten la creación de aplicaciones eficientes y complejas. Para almacenar en caché o reanudar las descargas, el único trabajo requerido para los webmasters es configurar el servidor correctamente, establecer etags correctas en algunos entornos puede ser complicado. Una vez logrado, el navegador atenderá las peticiones condicionales esperadas.</p>
+
+<p>Para los mecanismos de bloqueo, ocurre lo contrario: los desarrolladores web deben emitir una petición con los encabezados adecuados, mientras que los webmasters pueden confiar en la aplicación para realizar las comprobaciones correspondientes.</p>
+
+<p>En ambos casos está claro, las peticiones condicionales son una característica fundamental de la Web.</p>
diff --git a/files/es/web/http/connection_management_in_http_1.x/index.html b/files/es/web/http/connection_management_in_http_1.x/index.html
new file mode 100644
index 0000000000..89ef0cb82a
--- /dev/null
+++ b/files/es/web/http/connection_management_in_http_1.x/index.html
@@ -0,0 +1,87 @@
+---
+title: Gestión de la conexión en  HTTP/1.x
+slug: Web/HTTP/Connection_management_in_HTTP_1.x
+translation_of: Web/HTTP/Connection_management_in_HTTP_1.x
+original_slug: Web/HTTP/Gestion_de_la_conexion_en_HTTP_1.x
+---
+<div>{{HTTPSidebar}}</div>
+
+<p class="summary">La gestión de las conexiones en un tema fundamental en HTTP: crear y mantener una conexión tiene una gran influencia en el rendimiento de las páginas Web y las aplicaciones Web. En la versión HTTP/1.x, hay modos de conexión: conexiones breves, conexiones persistentes, y '<em>pipelining</em>'.</p>
+
+<p>HTTP la mayor parte de las veces se basa en TCP, como protocolo de transporte, dando conexión entre el cliente y el servidor. En sus comienzos, HTTP, únicamente tenia un modelo para gestionar dichas conexiones. Aquellas conexiones eran conexiones breves: se creaba una cada vez que una petición necesitaba ser transmitida, y se cerraba, una vez que la respuesta se había recibido. </p>
+
+<p>Este sencillo modelo tenía una limitación intrínseca en su rendimiento: abrir una conexión TCP es una operación costosa en recursos. Se necesitan intercambiar varios mensajes entre el cliente y el servidor para hacerlo. Y la latencia de la red y su ancho de banda, se veían afectados cuando se realizaba una petición. Las páginas web actuales, necesitan varias peticiones (una docena o más) para tener la información necesaria, de manera que este primer modelo es ineficiente para ellas.</p>
+
+<p>Dos nuevos modelos se presentaron en HTTP/1.1. La conexión persistente, mantiene las conexiones abiertas, entre peticiones sucesivas, eliminando así el tiempo necesario para abrir nuevas conexiones. El modelo 'pipelining' va un paso más allá, y envía varias peticiones sucesivas, sin esperar por la respuesta, reduciendo significativamente la latencia en la red. </p>
+
+<p><img alt="Compares the performance of the three HTTP/1.x connection models: short-lived connections, persistent connections, and HTTP pipelining." src="https://mdn.mozillademos.org/files/13727/HTTP1_x_Connections.png" style="height: 538px; width: 813px;"></p>
+
+<div class="note">
+<p>HTTP/2 añade nuevos modelos para la gestión de la conexión. </p>
+</div>
+
+<p>Un punto significativo a tener en cuenta en la gestión de la conexión de HTTP, es que este se refiere a la conexión establecida entre dos nodos consecutivos de la red, esto se denomina <a href="/en-US/docs/Web/HTTP/Headers#hbh">hop-by-hop</a>, en contraposición al concepto de  <a href="/en-US/docs/Web/HTTP/Headers#e2e">end-to-end</a>. El modelo de conexión entre un cliente y su primer proxy, puede ser distinto que la comunicación entre el proxy y el servidor de destino (u otro proxy intermedio).  Las cabeceras de HTTP utilizadas para definir el modelo de conexión como  {{HTTPHeader("Connection")}} y {{HTTPHeader("Keep-Alive")}}, se refieren a una conexión <a href="/en-US/docs/Web/HTTP/Headers#hbh">hop-by-hop</a>, y estos parámetros, pueden variar en las comunicaciones de los nodos intermedios. </p>
+
+<p>Un tema también relativo a esto, es el concepto de conexiones con protocolos HTTP superiores, donde una conexión HTTP/1.1 se actualiza a un protocolo distinto, como puede ser TLS/1.0, WebSockets, o HTTP/2.  Este <a href="/en-US/docs/Web/HTTP/Protocol_upgrade_mechanism">mecanismo de actualización del </a><a href="/en-US/docs/Web/HTTP/Protocol_upgrade_mechanism">protocolo</a> se encuentra documentado en otra página.</p>
+
+<h2 id="Conexiones_breves">Conexiones breves</h2>
+
+<p>El modelo original de HTTP, y el modelo de HTTP/1.0, está basado, en conexiones breves. Cada petición HTTP, se completa estableciendo (iniciando, estableciendo y cerrando) su propia conexión. Esto supone que la coordinación en el protocolo HTTP (handshake), sucede de forma previa a cada petición HTTP.</p>
+
+<p>La coordinación o inicialización de una comunicación en el protocolo TCP, requiere un tiempo dado, pero al adaptarse el protocolo TCP a su carga de transmisión de datos, este incrementa su eficiencia cuando se mantiene la conexión en el tiempo, utilizándose una conexión para transmitir numerosos peticiones de datos. Las conexiones breves, no utilizan esta característica del protocolo TCP, y el rendimiento de la conexión es peor que en el caso óptimo, al estar constantemente necesitando iniciar conexiones para transmitir cada mensaje (esto se conoce como conexiones 'en frio', o en inglés: 'cold connections'). </p>
+
+<p>La conexión breve es la conexión usada por defecto en HTTP/1.0 (únicamente en el caso de no esté definida la  cabecera {{HTTPHeader("Connection")}}, o su valor sea  <code>close</code>  entonces, no se utilizaria el modelo de conexiones breves). En HTTP/1.1, este modelo de conexión unicamente se utiliza al definir la cabecera  {{HTTPHeader("Connection")}} como <code>close</code>  .</p>
+
+<div class="note">
+<p>A menos que  se de la situación en que se ha de trabajar con sistemas antiguos que no soportan conexiones persistentes, no hay otra razón para el uso de este modelo de conexiones. </p>
+</div>
+
+<h2 id="Conexiones_persistentes">Conexiones persistentes</h2>
+
+<p>Las conexiones breves, tienen dos importantes desventajas: el tiempo que necesitan para establecer una nueva conexión es significativo, y la eficacia del protocolo inferior a HTTP: el TCP unicamente mejora cuando la conexión ha estado funcionando durante algún tiempo (conexión caliente o 'warm connection' en inglés). Para atenuar dichos inconvenientes, se presentó el concepto de conexión persistente, ya incluso antes de presentar el protocolo HTTP/1.1. También se le conoce como <em>'keep-alive connection</em>' que en inglés indica una conexión que se mantiene viva. </p>
+
+<p>Una conexión persistente es aquella la cual permanece abierta por un periodo, y puede ser reutilizada por varias peticiones de datos, ahorrando así la necesidad de efectuar nuevas sincronizaciones a nivel de TCP, de esta manera se puede usar más eficazmente el protocolo TCP. Esta conexión no estará abierta permanentemente, si la conexión no se usa, se cerrará después de un tiempo determinado (un servidor puede usar la cabecera {{HTTPHeader("Keep-Alive")}} para definir el tiempo mínimo que la conexión debería estar abierta. </p>
+
+<p>Las conexiones persistentes también tienen sus desventajas: incluso cuando no están transmitiendo datos, consumen recursos, y en casos en que la red esté soportando una carga de transferencia muy alta, un {{glossary("DoS attack", "ataque DoS ")}} puede realizarse. En estos casos, el uso de conexiones no persistentes, las cuales se cierran tan pronto como no necesitan transmitir, pueden resultar en un sistema más eficaz.</p>
+
+<p>HTTP/1.0 las conexiones HTTP/1.0 no son persistentes por defecto. Si se indica en la cabecera de un mensaje {{HTTPHeader("Connection")}} cualquier otro valor que no sea:  <code>close</code>, como puede ser: <code>retry-after</code>,  en tal caso, se harán conexiones persistentes. </p>
+
+<p>En HTTP/1.1 las conexiones son persistentes por defecto, así que esa cabecera no se necesita (aunque usualmente se añade como medida defensiva, en caso de que se tenga que utilizar el protocolo HTTP/1.0).</p>
+
+<h2 id="HTTP_pipelining">HTTP pipelining</h2>
+
+<div class="note">
+<p>HTTP pipelining no está activado por defecto en los navegacdores modernos:</p>
+
+<ul>
+ <li><a href="https://en.wikipedia.org/wiki/Proxy_server">Proxies</a> con defectos de implementación son habituales y provocan comportamientos extraños y erráticos, que los desarrolladores de Webs, no pueden predecir, ni corregir fácilmente.</li>
+ <li>HTTP Pipelining es complicado de implementar correctamente: el tamaño del recurso pedido, el correcto <a href="https://en.wikipedia.org/wiki/Round-trip_delay_time">RTT</a> que será utilizado, así como el ancho de banda efectivo, tienen un impacto directo en la en la mejora de rendimiento de este método. Sin conocer estos valores, puede que mensajes importantes, se vean retrasados, por mensajes que no lo son. El concepto de "importante" incluso cambia según se carga la maquetación (layout) de la página. De ahí que este método solamente presente una mejora marginal en la mayoría de los casos.  </li>
+ <li>HTTP Pipelining  presenta un problema conocido como <a href="https://en.wikipedia.org/wiki/Head-of-line_blocking">HOL</a> </li>
+</ul>
+
+<p>Así, debido a estas razones este método ha sido relevado por un algoritmo mejor, la <strong>multiplexación</strong>, que es el que usa HTTP/2.</p>
+</div>
+
+<p>Por defecto, las peticiones HTTP son realizadas de manera sequencial. La siguiente petición es realizada una vez que la respuesta a la petición actual ha sido recibida. Debido a que se ven afectadas por latencias en la red y limitaciones en el ancho de banda, ésto puede llevar a retardos significativos hasta que la siguiente petición es <em>vista</em> por el servidor.</p>
+
+<p>Pipelining es un proceso para enviar peticiones sucesivas, sobre la misma conexión persistente, sin esperar a la respuesta. Esto evita latencias en la conexión. En teoría, el rendimiento también podría mejorar si dos peticiones HTTP se empaquetaran en el mismo mensaje TCP. El MSS (Maximum Segment Size) típico, es suficientemente grande para contener varias peticiones simples, aunque la demanda de tamaño de las peticiones HTTP sigue creciendo.</p>
+
+<p>No todos los tipos de peticiones HTTP pueden ser utilizadas en pipeline: solo métodos {{glossary("idempotent")}} como {{HTTPMethod("GET")}}, {{HTTPMethod("HEAD")}}, {{HTTPMethod("PUT")}} and {{HTTPMethod("DELETE")}} pueden ser repetidos sin incidencias. Si ocurre un fallo, el contenido se puede simplemente reenviar.</p>
+
+<p>Hoy en día, todo proxy y servidor que cumpla con HTTP/1.1 debería dar soporte a pipelining, aunque en práctica tenga muchas limitaciones. Por esta razón, ningún explorador moderno lo activa por defecto.</p>
+
+<h2 id="Domain_sharding">Domain sharding</h2>
+
+<div class="note">
+<p>Unless you have a very specific immediate need, don't use this deprecated technique; switch to HTTP/2 instead. In HTTP/2, domain sharding is no more useful: the HTTP/2 connection is able to handle parallel unprioritized requests very well. Domain sharding is even detrimental to performance. Most HTTP/2 implementation use a technique called <a href="I wonder if it's related to the nobash/nobreak/nopick secret exit s of Elrond's chambers.">connection coalescing</a> to revert eventual domain sharding.</p>
+</div>
+
+<p>As an HTTP/1.x connection is serializing requests, even without any ordering, it can't be optimal without large enough available bandwidth. As a solution, browsers open several connections to each domain, sending parallel requests. Default was once 2 to 3 connections, but this has now increased to a more common use of 6 parallel connections. There is a risk of triggering <a href="/en-US/docs/Glossary/DOS_attack">DoS</a> protection on the server side if attempting more than this number.</p>
+
+<p>If  the server wishes a faster Web site or application response, it is possible for the server to force the opening of more connections. For example, Instead of having all resources on the same domain, say <code>www.example.com</code>, it could split over several domains, <code>www1.example.com</code>, <code>www2.example.com</code>, <code>www3.example.com</code>. Each of these domains resolve to the <em>same</em> server, and the Web browser will open 6 connections to each (in our example, boosting the connections to 18). This technique is called <em>domain sharding</em>.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/13783/HTTPSharding.png" style="height: 727px; width: 463px;"></p>
+
+<h2 id="Conclusión">Conclusión</h2>
+
+<p>Las mejoras en la gestión de las conexiones, han significado un considerable aumento en el rendimiento del protocolo HTTP. Con HTTP/1.1 o HTTP/1.0, el uso de una conexión persistente - al menos hasta que que no necesite transmitir más datos- resulta en un significativo aumento en el rendimiento de la comunicación. Incluso, el fracaso de. método de pipelining, ha resultado en el diseño de modelos superiores para la gestión de la conexión, todo lo cual se ha incorporado en HTTP/2. </p>
diff --git a/files/es/web/http/cors/index.html b/files/es/web/http/cors/index.html
new file mode 100644
index 0000000000..fe6666adc2
--- /dev/null
+++ b/files/es/web/http/cors/index.html
@@ -0,0 +1,492 @@
+---
+title: Control de acceso HTTP (CORS)
+slug: Web/HTTP/CORS
+translation_of: Web/HTTP/CORS
+original_slug: Web/HTTP/Access_control_CORS
+---
+<p>{{HTTPSidebar}}</p>
+
+<p><span class="seoSummary">El Intercambio de Recursos de Origen Cruzado ({{Glossary("CORS")}})</span> es un mecanismo que utiliza cabeceras <span class="seoSummary">{{Glossary("HTTP")}}</span> adicionales para permitir que un <span class="seoSummary">{{Glossary("user agent")}}</span> obtenga permiso para acceder a recursos seleccionados desde un servidor, en un origen distinto (dominio) al que pertenece. Un agente crea una petición HTTP de origen cruzado cuando solicita un recurso desde un dominio distinto, un protocolo o un puerto diferente al del documento que lo generó.</p>
+
+<p>Un ejemplo de solicitud de origen cruzado: el código JavaScript frontend de una aplicación web que es localizada en <code>http://domain-a.com</code> utiliza {{domxref("XMLHttpRequest")}} para cargar el recurso <code>http://api.domain-b.com/data.json</code>.</p>
+
+<p>Por razones de seguridad, los exploradores restringen las solicitudes HTTP de origen cruzado iniciadas dentro de un script. Por ejemplo, <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> y la API <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch</a> siguen la <a href="/en-US/docs/Web/Security/Same-origin_policy">política de mismo-origen</a>. Ésto significa que una aplicación que utilice esas APIs <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> sólo puede hacer solicitudes HTTP a su propio dominio, a menos que se utilicen cabeceras CORS.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/14295/CORS_principle.png" style="height: 305px; width: 439px;"></p>
+
+<p>El <a href="http://www.w3.org/">W3C</a> <a href="http://www.w3.org/2008/webapps/">Grupo de Trabajo de Aplicaciones Web</a> recomienda el nuevo mecanismo de <a href="http://www.w3.org/TR/cors/">Intercambio de Recursos de Origen Cruzado</a> (CORS, por sus siglas en inglés). CORS da controles de acceso a dominios cruzados para servidores web y transferencia segura de datos en dominios cruzados entre navegadores y servidores Web. Los exploradores modernos utilizan CORS en un  <strong>contenedor API</strong> (como <a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a> o <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch</a>) para ayudar a mitigar los riesgos de solicitudes HTTP de origen cruzado.</p>
+
+<h2 id="¿Quién_debería_leer_este_artículo">¿Quién debería leer este artículo?</h2>
+
+<p>Todo el mundo, de verdad.</p>
+
+<p>Más específicamente, este artículo está dirigido a administradores web, desarrolladores de servidores y desarrolladores de interfaz. Los exploradores modernos manejan los componentes sobre el intercambio de origen cruzado del lado del cliente. Incluyendo cabeceras y políticas de ejecución. Pero, este nuevo estándar determina que los servidores tienen que manejar las nuevas solicitudes y las cabeceras de las respuestas. Se recomienda, como lectura suplementaria, otro artículo para desarrolladores de servidor que discute el <a href="/en-US/docs/Web/HTTP/Server-Side_Access_Control">intercambio de origen cruzado desde una perspectiva de servidor (con fragmentos de código PHP)</a>.</p>
+
+<h2 id="¿Qué_peticiones_utiliza_CORS">¿Qué peticiones utiliza CORS?</h2>
+
+<p>Este <a class="external" href="http://www.w3.org/TR/cors/" title="http://www.w3.org/TR/cors/">estándar de intercambio de origen cruzado</a> es utilizado para habilitar solicitudes HTTP de sitios cruzados para:</p>
+
+<ul>
+ <li>Invocaciones de las APIs <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> o  <a href="https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API">Fetch</a> en una manera de sitio cruzado, como se discutió arriba.</li>
+ <li>Fuentes Web (para usos de fuente en dominios cruzados <code>@font-face</code> dentro de CSS), <a class="external" href="https://www.w3.org/TR/css-fonts-3/#font-fetching-requirements" title="http://www.webfonts.info/wiki/index.php?title=@font-face_support_in_Firefox">para que los servidores puedan mostrar fuentes TrueType que sólo puedan ser cargadas por sitios cruzados y usadas por sitios web que lo tengan permitido.</a></li>
+ <li>Texturas WebGL.</li>
+ <li>Imágenes dibujadas en patrones usando <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage">drawImage</a></code>.</li>
+ <li>Hojas de estilo (para acceso <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSSOM_View">CSSOM</a>).</li>
+ <li>Scripts (para excepciones inmutadas).</li>
+</ul>
+
+<p>Este artículo es una discusión general sobre Intercambio de Recursos de Origin Cruzado e incluye una discusión sobre las cabeceras HTTP.</p>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El estándar de Intercambio de Recursos de Origen Cruzado trabaja añadiendo nuevas cabeceras HTTP que permiten a los servidores describir el conjunto de orígenes que tienen permiso para leer la información usando un explorador web.  Adicionalmente, para métodos de solicitud HTTP que causan efectos secundarios en datos del usuario (y en particular, para otros métodos HTTP distintos a <code>GET</code>, o para la utilización de <code>POST</code> con algunos tipos MIME), la especificación sugiere que los exploradores "verifiquen" la solicitud, solicitando métodos soportados desde el servidor con un método de solicitud HTTP <code>OPTIONS</code>, y luego, con la "aprobación" del servidor, enviar la verdadera solicitud con el método de solicitud HTTP verdadero. Los servidores pueden también notificar a los clientes cuando sus "credenciales" (incluyendo Cookies y datos de autenticación HTTP) deben ser enviados con solicitudes.</p>
+
+<p>Las secciones siguientes discuten escenarios, así como el análisis de las cabeceras HTTP usados.</p>
+
+<h2 id="Ejemplos_de_escenarios_de_control_de_accesos">Ejemplos de escenarios de control de accesos</h2>
+
+<p>Aquí, presentamos tres escenarios que ilustran cómo funciona el Intercambio de Recursos de Origen Cruzado. Todos estos ejemplos utilizan el objeto <code><a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest">XMLHttpRequest</a></code>, que puede ser utilizado para hacer invocaciones de sitios cruzados en cualquier explorador soportado.</p>
+
+<p>Los fragmentos de JavaScript incluidos en estas secciones (y las instancias ejecutadas del código servidor que correctamente maneja las solicitudes de sitios cruzados) <a class="external" href="http://arunranga.com/examples/access-control/" title="http://arunranga.com/examples/access-control/">pueden ser encontrados "en acción" aquí</a>, y pueden ser trabajados en exploradores que soportan <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> de sitios cruzados. Una discusión de Intercambio de Recursos de Origen Cruzado desde una <a class="internal" href="/en-US/docs/Web/HTTP/Server-Side_Access_Control" title="En/Server-Side Access Control">perspectiva de servidor (incluyendo fragmentos de código PHP) puede ser encontrada aquí</a>.</p>
+
+<h3 id="Solicitudes_simples">Solicitudes simples</h3>
+
+<p>Una solicitud de sitio cruzado es aquella que cumple las siguientes condiciones:</p>
+
+<ul>
+ <li>Los únicos métodos aceptados son:
+  <ul>
+   <li>GET</li>
+   <li>HEAD</li>
+   <li>POST.</li>
+  </ul>
+ </li>
+ <li>Aparte de las cabeceras establecidas automáticamente por el agente usuario (ej. <code>Connection, User-Agent,</code>etc.), las únicas cabeceras que están permitidas para establecer manualmente son:
+  <ul>
+   <li><code>Accept</code></li>
+   <li><code>Accept-Language</code></li>
+   <li><code>Content-Language</code></li>
+   <li><code>Content-Type</code></li>
+  </ul>
+ </li>
+ <li>Los únicos valores permitidos de la cabecera <code>Content-Type</code> son:
+  <ul>
+   <li><code>application/x-www-form-urlencoded</code></li>
+   <li><code>multipart/form-data</code></li>
+   <li><code>text/plain</code></li>
+  </ul>
+ </li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> Estos son los mismos tipos de solicitud de sitios cruzados que un contenido web ya puede emitir, y ninguna respuesta de datos es liberada a menos que el servidor envíe la cabecera apropiada. Por lo tanto, los sitios que prevengan solicitudes falsas de sitios cruzados no tienen nada nuevo que temer sobre el control de acceso HTTP.</div>
+
+<p>Por ejemplo, suponga que el contenido web en el dominio <code class="plain">http://foo.example</code> desea invocar contenido en el dominio <code class="plain">http://bar.other</code>. Código de este tipo puede ser utilizado dentro de JavaScript desplegado en foo.example:</p>
+
+<pre class="brush: js notranslate" id="line1">var invocation = new XMLHttpRequest();
+var url = 'http://bar.other/resources/public-data/';
+
+function callOtherDomain() {
+  if(invocation) {
+    invocation.open('GET', url, true);
+    invocation.onreadystatechange = handler;
+    invocation.send();
+  }
+}
+</pre>
+
+<p>Dejándonos ver lo que el explorador enviará al servidor en este caso, y veamos como responde el servidor:</p>
+
+<pre class="brush: shell notranslate">GET /resources/public-data/ HTTP/1.1
+Host: bar.other
+User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
+Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
+Accept-Language: en-us,en;q=0.5
+Accept-Encoding: gzip,deflate
+Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
+Connection: keep-alive
+Referer: http://foo.example/examples/access-control/simpleXSInvocation.html
+Origin: http://foo.example
+
+
+HTTP/1.1 200 OK
+Date: Mon, 01 Dec 2008 00:23:53 GMT
+Server: Apache/2.0.61
+Access-Control-Allow-Origin: *
+Keep-Alive: timeout=2, max=100
+Connection: Keep-Alive
+Transfer-Encoding: chunked
+Content-Type: application/xml
+
+[XML Data]
+</pre>
+
+<p>Las líneas 1 - 10 son las cabeceras enviadas por Firefox 3.5.  Observe que la cabecera de solicitud HTTP principal aquí es la cabecera <code>Origin:</code>  en la línea 10 de arriba, lo que muestra que la invocación proviene del contenido en el dominio <code class="plain">http://foo.example</code>.</p>
+
+<p>Las líneas 13 - 22  muestran la respuesta HTTP del servidor en el dominio <code class="plain">http://bar.other</code>.  En respuesta, el servidor envía de vuelta una cabecera <code>Access-Control-Allow-Origin:</code>, mostrado arriba en la línea 16.  El uso de la cabecera <code>Origin:</code> y <code>Access-Control-Allow-Origin:</code> muestran el protocolo de control de acceso en su uso más simple.  En este caso, el servidor responde con un <code>Access-Control-Allow-Origin: *</code> lo que significa que el recurso puede ser accedido por <strong>cualquier</strong> dominio en una forma de sitio cruzado. Si el dueño del recurso en <code class="plain">http://bar.other</code> deseara restringir el acceso al recurso solamente para <code class="plain">http://foo.example</code>, debería devolver lo siguiente:</p>
+
+<p><code class="plain">Access-Control-Allow-Origin: http://foo.example</code></p>
+
+<p>Note que ahora, ningún otro dominio aparte de <code class="plain">http://foo.example</code> (identificado por la cabecera ORIGIN: en la solicitud, como en la línea 10 arriba) puede acceder al recurso en una forma de sitio cruzado. La cabecera Access-Control-Allow-Origin debe contener el valor que fue enviado en la solicitud del encabezado <code>Origin.</code></p>
+
+<h3 id="Solicitudes_Verificadas">Solicitudes Verificadas</h3>
+
+<p>A diferencia de las solicitudes simples (discutidas arriba), las solicitudes "verificadas" envían primero una solicitud HTTP por el método <code>OPTIONS</code> al recurso en el otro dominio, para determinar si es seguro enviar la verdadera solicitud. Las solicitudes de sitios cruzados son verificadas así ya que pueden tener implicaciones en la información de usuario.  En particular, una solicitud es verificada sí:</p>
+
+<ul>
+ <li>Usa métodos <strong>distintos</strong> a <code>GET, HEAD</code> <code>o POST</code>.  También, si <code>POST</code> es utilizado para enviar solicitudes de información con Content-Type <strong>distinto</strong> a<code> application/x-www-form-urlencoded</code>, <code>multipart/form-data</code>, o <code>text/plain</code>, ej. si la solicitud <code>POST</code> envía una carga XML al servidor utilizando <code>application/xml</code> or <code>text/xml</code>, entonces la solicitud <strong>es</strong> verificada.</li>
+ <li>Se establecen encabezados personalizados (ej. la solicitud usa un encabezado como <code>X-PINGOTHER</code>)</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota:</strong> Empezando en {{Gecko("2.0")}}, las codificaciones de datos <code>text/plain</code>, <code>application/x-www-form-urlencoded</code>, y <code>multipart/form-data</code> pueden ser enviadas en sitios cruzados sin verificación. Anteriormente, solo<code> text/plain</code> podía ser enviado sin verificación.</p>
+</div>
+
+<p>Un ejemplo de este tipo de invocación puede ser:</p>
+
+<pre class="brush: js notranslate" id="line1">var invocation = new XMLHttpRequest();
+var url = 'http://bar.other/resources/post-here/';
+var body = '&lt;?xml version="1.0"?&gt;&lt;person&gt;&lt;name&gt;Arun&lt;/name&gt;&lt;/person&gt;';
+
+function callOtherDomain(){
+  if(invocation)
+    {
+      invocation.open('POST', url, true);
+      invocation.setRequestHeader('X-PINGOTHER', 'pingpong');
+      invocation.setRequestHeader('Content-Type', 'application/xml');
+      invocation.onreadystatechange = handler;
+      invocation.send(body);
+    }
+}
+
+......
+</pre>
+
+<p>En el ejemplo de arriba, la línea 3 crea un cuerpo XML para enviar con la solicitud <code>POST</code> en la línea 8.  También, en la línea 9, se establece una cabecera HTTP de solicitud "personalizado" (no estándar <code>X-PINGOTHER: pingpong</code>).  Dichas cabeceras no son parte del protocolo HTTP/1.1, pero son útiles generalmente en aplicaciones web. Dado que la solicitud (<code>POST</code>) usa un Content-Type <code>application/xml</code>, y dado que se establece una cabecera personalizada, la solicitud es verificada.</p>
+
+<p>Veamos este intercambio completo entre un cliente y un servidor:</p>
+
+<pre class="brush: shell notranslate">OPTIONS /resources/post-here/ HTTP/1.1
+Host: bar.other
+User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
+Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
+Accept-Language: en-us,en;q=0.5
+Accept-Encoding: gzip,deflate
+Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
+Connection: keep-alive
+Origin: http://foo.example
+Access-Control-Request-Method: POST
+Access-Control-Request-Headers: X-PINGOTHER
+
+
+HTTP/1.1 200 OK
+Date: Mon, 01 Dec 2008 01:15:39 GMT
+Server: Apache/2.0.61 (Unix)
+Access-Control-Allow-Origin: http://foo.example
+Access-Control-Allow-Methods: POST, GET, OPTIONS
+Access-Control-Allow-Headers: X-PINGOTHER
+Access-Control-Max-Age: 1728000
+Vary: Accept-Encoding, Origin
+Content-Encoding: gzip
+Content-Length: 0
+Keep-Alive: timeout=2, max=100
+Connection: Keep-Alive
+Content-Type: text/plain
+
+POST /resources/post-here/ HTTP/1.1
+Host: bar.other
+User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
+Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
+Accept-Language: en-us,en;q=0.5
+Accept-Encoding: gzip,deflate
+Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
+Connection: keep-alive
+X-PINGOTHER: pingpong
+Content-Type: text/xml; charset=UTF-8
+Referer: http://foo.example/examples/preflightInvocation.html
+Content-Length: 55
+Origin: http://foo.example
+Pragma: no-cache
+Cache-Control: no-cache
+
+&lt;?xml version="1.0"?&gt;&lt;person&gt;&lt;name&gt;Arun&lt;/name&gt;&lt;/person&gt;
+
+
+HTTP/1.1 200 OK
+Date: Mon, 01 Dec 2008 01:15:40 GMT
+Server: Apache/2.0.61 (Unix)
+Access-Control-Allow-Origin: http://foo.example
+Vary: Accept-Encoding, Origin
+Content-Encoding: gzip
+Content-Length: 235
+Keep-Alive: timeout=2, max=99
+Connection: Keep-Alive
+Content-Type: text/plain
+
+[Some GZIP'd payload]
+</pre>
+
+<p>Las líneas 1 - 12 arriba representan la solicitud verificada con los métodos <code>OPTIONS</code>. Firefox 3.1 determina lo que se necesita para enviar esto basándose en los parámetros de la solicitud que los fragmentos de JavaScript que se usaron arriba, para que el servidor pueda responder si es aceptable enviar la solicitud con los parámetros de la solicitud real. OPTIONS es un método HTTP/1.1 que se utiliza para determinar información adicional de los servidores, y es un método <strong>idempotente</strong>, esto significa que no puede ser utilizado para cambiar el recurso. Observe que, junto con la solicitud OPTIONS, se envían otras dos cabeceras de solicitud (líneas 11 y 12 respectivamente):</p>
+
+<pre class="notranslate">Access-Control-Request-Method: POST
+Access-Control-Request-Headers: X-PINGOTHER
+</pre>
+
+<p>La cabecera <code>Access-Control-Request-Method</code> notifica al servidor como parte de una solicitud verificada que cuándo se envíe la solicitud real, esta será enviada con un método de solicitud <code>POST</code>. La cabecera <code>Access-Control-Request-Headers</code> notifica al servidor que cuando la solicitud real sea enviada, será enviada con un encabezado <code>X-PINGOTHER</code> personalizado.  Ahora, el servidor tiene la oportunidad para determinar si desea aceptar la solicitud bajo estas circunstancias.</p>
+
+<p>Las líneas 15 - 27 de arriba corresponden con la respuesta que devuelve el servidor indicando que el método de la petición (POST) y la cabecera <code>X-PINGOTHER</code> son aceptadas. En particular, echemos un vistazo a las líneas 18-21:</p>
+
+<pre class="notranslate">Access-Control-Allow-Origin: http://foo.example
+Access-Control-Allow-Methods: POST, GET, OPTIONS
+Access-Control-Allow-Headers: X-PINGOTHER
+Access-Control-Max-Age: 1728000</pre>
+
+<p>El servidor responde con <code>Access-Control-Allow-Methods</code> y dice que <code>POST</code>, <code>GET</code>, y <code>OPTIONS</code> son métodos viables para consultar el recurso en cuestión.  Observe que esta cabecera es similar al <a class="external" href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.7" title="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.7">HTTP/1.1 Allow: encabezado de respuesta</a>, pero usado estrictamente dentro del contexto del control de acceso.  El servidor también envía <code>Access-Control-Allow-Headers</code> con un valor de <code>X-PINGOTHER</code>, confirmando que es una cabecera permitida para ser usado en la solicitud real.  Como <code>Access-Control-Allow-Methods</code>, <code>Access-Control-Allow-Headers</code> es una lista separada por comas de cabeceras aceptables.  Finalmente, <code>Access-Control-Max-Age</code> da el valor en segundos de cuánto tarda la respuesta de la solicitud verificada en ser capturada sin enviar otra solicitud verificada. En este caso, 1728000 segundos son 20 días.</p>
+
+<h3 id="Solicitudes_con_credenciales">Solicitudes con credenciales</h3>
+
+<p>La capacidad más interesante expuesta tanto por <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> y Access Control es la habilidad para hacer solicitudes "con credenciales" que estén al tanto de Cookies HTTP e información de Autenticación HTTP.  Por defecto, en las invocaciones <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> de un sitio curzado, los exploradores no enviarán credenciales. Una bandera específica tiene que ser establecida en el objeto <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> cuando este es invocado.</p>
+
+<p>En este ejemplo, el contenido cargado originalmente desde <code class="plain">http://foo.example</code> hace una solicitud GET simple a un recurso en <code class="plain">http://bar.other</code> que establece Cookies. El contenido en foo.example puede contener un JavaScript como este:</p>
+
+<pre class="brush: js notranslate" id="line1">var invocation = new XMLHttpRequest();
+var url = 'http://bar.other/resources/credentialed-content/';
+
+function callOtherDomain(){
+  if(invocation) {
+    invocation.open('GET', url, true);
+    invocation.withCredentials = true;
+    invocation.onreadystatechange = handler;
+    invocation.send();
+  }
+}</pre>
+
+<p>La línea 7 muestra la bandera en <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> que tiene que ser establecida para poder hacer la invocación con Cookies, es decir, el valor booleano <code>withCredentials</code>.  Por defecto, la invocación es hecha sin Cookies. Dado que esta es una simple solicitud <code>GET</code>, no es verificada, pero el explorador <strong>rechazará </strong>cualquier respuesta que no tiene el encabezado <code>Access-Control-Allow-Credentials: true</code>,y <strong>no</strong> hará disponible la respuesta para invocar contenido web.</p>
+
+<p>A continuación se proporciona una muestra de intercambio entre un cliente y un servidor:</p>
+
+<pre class="brush: shell notranslate">GET /resources/access-control-with-credentials/ HTTP/1.1
+Host: bar.other
+User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre
+Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
+Accept-Language: en-us,en;q=0.5
+Accept-Encoding: gzip,deflate
+Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
+Connection: keep-alive
+Referer: http://foo.example/examples/credential.html
+Origin: http://foo.example
+Cookie: pageAccess=2
+
+
+HTTP/1.1 200 OK
+Date: Mon, 01 Dec 2008 01:34:52 GMT
+Server: Apache/2.0.61 (Unix) PHP/4.4.7 mod_ssl/2.0.61 OpenSSL/0.9.7e mod_fastcgi/2.4.2 DAV/2 SVN/1.4.2
+X-Powered-By: PHP/5.2.6
+Access-Control-Allow-Origin: http://foo.example
+Access-Control-Allow-Credentials: true
+Cache-Control: no-cache
+Pragma: no-cache
+Set-Cookie: pageAccess=3; expires=Wed, 31-Dec-2008 01:34:53 GMT
+Vary: Accept-Encoding, Origin
+Content-Encoding: gzip
+Content-Length: 106
+Keep-Alive: timeout=2, max=100
+Connection: Keep-Alive
+Content-Type: text/plain
+
+
+[text/plain payload]
+</pre>
+
+<p>Pese a que la línea 11 contiene la Cookie destinada para el contenido en <code class="plain">http://bar.other</code>, si bar.other no responde con <code>Access-Control-Allow-Credentials: true</code> (línea 19) la respuesta será ignorada y no puesta a disposición para el contenido web. <strong>Nota Importante:</strong> cuando se responde a una solicitud con credeciales, el servidor <strong>debe</strong><strong> </strong>especificar un dominio, y no puede usar comodines. El ejemplo de arriba fallará si la cabecera fuera un comodín como: <code>Access-Control-Allow-Origin: *</code>.  Dado que <code>Access-Control-Allow-Origin</code> menciona explícitamente <code class="plain">http://foo.example</code>, el contenido de credenciales competente es devuelto al contenido web invocador. Observe que, en la línea 22, se establece una cookie adicional.</p>
+
+<p>Todos estos ejemplos pueden <a class="external" href="http://arunranga.com/examples/access-control/" title="http://arunranga.com/examples/access-control/">verse funcionando aquí</a>.  La siguiente sección se refiere a las verdaderas cabeceras HTTP.</p>
+
+<h2 id="Las_cabeceras_HTTP_de_respuesta">Las cabeceras HTTP de respuesta</h2>
+
+<p>Esta sección lista las cabeceras HTTP de respuesta que los servidores envían de vuelta para las solicitudes de acceso de control definidas por la especificación del Intercambio de Recursos de Origen Cruzado. La sección anterior da un resumen de estos en acción.</p>
+
+<h3 id="Access-Control-Allow-Origin">Access-Control-Allow-Origin</h3>
+
+<p>Un recurso devuelto puede tener una cabecera <code>Access-Control-Allow-Origin</code>, con la siguiente sintaxis:</p>
+
+<pre class="notranslate">Access-Control-Allow-Origin: &lt;origin&gt; | *
+</pre>
+
+<p>El parámetro <code>origin</code> específica una URI que puede tener acceso al recurso.  El explorador debe asegurar esto. Para solicitudes <strong>sin</strong> credenciales, el servidor debe especificar "*" como un comodín permitiendo, de este modo, el acceso al recurso a cualquier origen.</p>
+
+<p>Por ejemplo, para permitir a <span class="nowiki">http://mozilla.com</span> acceder al recurso, usted puede especificar:</p>
+
+<pre class="notranslate">Access-Control-Allow-Origin: <span class="plain">http://mozilla.com</span></pre>
+
+<p>Si el servidor especifica un host de origen en vez de "*", entonces se debe incluir <span style="font-family: courier new,andale mono,monospace; line-height: 1.5;">Origin</span><span style="line-height: 1.5;"> en el encabezado de respuesta </span><span style="font-family: courier new,andale mono,monospace; line-height: 1.5;">Vary </span><span style="line-height: 1.5;">para indicar a los clientes que las respuestas del servidor difieren basándose en el valor del encabezado de respuesta</span><span style="line-height: 1.5;"> </span><span style="font-family: courier new,andale mono,monospace; line-height: 1.5;">Origin.</span></p>
+
+<p>{{ h3_gecko_minversion("Access-Control-Expose-Headers", "2.0") }}</p>
+
+<p>Esta cabecera permite una <em>whitelist</em> de cabeceras del servidor que los exploradores tienen permitido acceder. Por ejemplo:</p>
+
+<pre class="notranslate">Access-Control-Expose-Headers: X-My-Custom-Header, X-Another-Custom-Header
+</pre>
+
+<p>Esto permite a las cabeceras <code>X-My-Custom-Header</code> y<code> X-Another-Custom-Header</code> ser expuestos al explorador.</p>
+
+<h3 id="Access-Control-Max-Age">Access-Control-Max-Age</h3>
+
+<p>Esta cabecera indica durante cuánto tiempo los resultados de la solicitud verificada pueden ser capturados. Para un ejemplo de solicitudes verificadas, vea los ejemplos de arriba.</p>
+
+<pre class="notranslate">Access-Control-Max-Age: &lt;delta-seconds&gt;
+</pre>
+
+<p>El parámetro <code>delta-seconds</code> indica el número de segundos en que los resultados pueden ser capturados.</p>
+
+<h3 id="Access-Control-Allow-Credentials">Access-Control-Allow-Credentials</h3>
+
+<p>Indica si la respuesta puede ser expuesta cuando la bandera <code>credentials</code> es verdadera. Cuando se usa como parte de una respuesta para una solicitud verficada, este indica si la solicitud verdadera puede realizarse usando credenciales. Note que las solicitudes <code>GET</code> simples no son verificadas, y por lo que si una solicitud es hecha para un recurso con credenciales, si la cabecera no es devuelta con el recurso, la respuesta es ignorada por el explorador y no devuelta al contenido web.</p>
+
+<pre class="notranslate">Access-Control-Allow-Credentials: true | false
+</pre>
+
+<p><a class="internal" href="/En/HTTP_access_control#Requests_with_credentials" title="En/HTTP access control#Requests with credentials">Las Solicitudes con credenciales</a> son discutidas arriba.</p>
+
+<h3 id="Access-Control-Allow-Methods">Access-Control-Allow-Methods</h3>
+
+<p>Específica el método o los métodos permitidos cuando se asigna un recurso. Es usado en respuesta a la solicitud verificada. Las condiciones sobre cuándo una solicitud es verificada se discuten arriba.</p>
+
+<pre class="notranslate">Access-Control-Allow-Methods: &lt;method&gt;[, &lt;method&gt;]*
+</pre>
+
+<p>Un ejemplo de una <a class="internal" href="#Preflighted_requests" title="#Preflight Request">solicitud verificada se muestra arriba</a>, incluyendo un ejemplo donde se envía este encabezado al explorador.</p>
+
+<h3 id="Access-Control-Allow-Headers">Access-Control-Allow-Headers</h3>
+
+<p>Usado en respuesta a una <a class="internal" href="#Preflighted_requests" title="#Preflighted Request">solicitud verificada</a> para indicar qué encabezado HTTP puede ser usado cuando se realiza la solicitud real.</p>
+
+<pre class="notranslate">Access-Control-Allow-Headers: &lt;field-name&gt;[, &lt;field-name&gt;]*
+</pre>
+
+<h2 id="Los_encabezados_HTTP_de_solicitud">Los encabezados HTTP de solicitud</h2>
+
+<p>Esta sección lista las cabeceras que los clietnes deben utilizar cuando realizan solicitudes HTTP para usar la característica de intercambio de origen cruzado. Note que estas cabeceras son establecidas cuando se realizan realizan invocaciones a los servidores. Los desarrolladores usan la capacidad de sitios cruzados <a class="internal" href="/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code>XMLHttpRequest</code></a> para no tener que establecer ninguna solicitud de intercambio de origen cruzado programada.</p>
+
+<h3 id="Origin">Origin</h3>
+
+<p>Indica el origen de las solicitudes de acceso a sitios cruzados o solicitudes verificadas.</p>
+
+<pre class="notranslate">Origin: &lt;origin&gt;
+</pre>
+
+<p>El origen es una URI indicando al servidor dónde se ha iniciado la solicitud. Este no incluye ninguna información de recorrido, sólo el nombre del servidor. </p>
+
+<div class="note"><strong>Nota:</strong> El <code>origin</code> puede ser un string vacío; esto es útil, por ejemplo, si el recurso es un <code>data</code> URL.</div>
+
+<p>Observe que en cualquier solicitud de acceso de control, la cabecera <code>ORIGIN</code> <strong>siempre </strong>se envía.</p>
+
+<h3 id="Access-Control-Request-Method">Access-Control-Request-Method</h3>
+
+<p>Se usa cuando se emite una solicitud verificada, para indicarle al servidor qué método HTTP será usado cuando se haga la solicitud real.</p>
+
+<pre class="notranslate">Access-Control-Request-Method: &lt;method&gt;
+</pre>
+
+<p>Ejemplos de esta utilización pueden ser encontrados <a class="internal" href="#Preflighted_requests" title="Preflighted requests">arriba.</a></p>
+
+<h3 id="Access-Control-Request-Headers">Access-Control-Request-Headers</h3>
+
+<p>Usada cuando se emite una solicitud verificada para indicarle al servidor qué cabecera HTTP será usada cuando se haga la solicitud real.</p>
+
+<pre class="notranslate">Access-Control-Request-Headers: &lt;field-name&gt;[, &lt;field-name&gt;]*
+</pre>
+
+<p>Ejemplos de esta utilización pueden ser encontrados <a class="internal" href="/En/HTTP_access_control#Preflighted_requests" title="En/HTTP access control#Preflighted requests">arriba</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Fetch', '#cors-protocol', 'CORS')}}</td>
+   <td>{{Spec2('Fetch')}}</td>
+   <td>Nueva definición; tiene como objetivo suplantar la especificación CORS.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CORS')}}</td>
+   <td>{{Spec2('CORS')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Exploradores">Compatibilidad con Exploradores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>4</td>
+   <td>3.5</td>
+   <td>8 (a través de XDomainRequest)<br>
+    10</td>
+   <td>12</td>
+   <td>4</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>2.1</td>
+   <td>yes</td>
+   <td>yes</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>12</td>
+   <td>3.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h4 id="Nota">Nota</h4>
+
+<p>Internet Explorer 8 y 9 exponen CORS a través del objeto XDomainRequest, pero tienen una implementación completa en IE 10. Mientras que Firefox 3.5 introduce el soporte para XMLHttpRequests y Web Fonts para sitios cruzados, algunas solicitudes fueron limitadas hasta versiones posteriores. Especificamente, Firefox 7 introduce la habilidad para solicitudes HTTP de sitios cruzados para Texturas WebGL, y Firefox 9 añade soporte para imágenes dibujadas en patrones utilizando drawImage.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a class="external" href="http://arunranga.com/examples/access-control/" title="http://arunranga.com/examples/access-control/">Muestras de Código mostrando <code>XMLHttpRequest</code> e Intercambio de Recursos de Origen Cruzado</a></li>
+ <li><a class="external" href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Server-Side_Access_Control" title="https://developer.mozilla.org/en-US/docs/Web/HTTP/Server-Side_Access_Control">Intercambio de Recursos de Origen Cruzado desde una perspectiva de Servidor (PHP, etc.)</a></li>
+ <li><a class="external" href="http://www.w3.org/TR/cors/" title="http://www.w3.org/TR/cors/">Especificación del Intercambio de Recursos de Origen Cruzado</a></li>
+ <li><a class="internal" href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest"><code>XMLHttpRequest</code></a></li>
+ <li><a class="external" href="http://crypto.stanford.edu/websec/specs/origin-header/" title="http://crypto.stanford.edu/websec/specs/origin-header/">Discusión adicional sobre el encabezado Origin</a></li>
+ <li><a class="external" href="http://www.kendoui.com/blogs/teamblog/posts/11-10-03/using_cors_with_all_modern_browsers.aspx" title="http://www.kendoui.com/blogs/teamblog/posts/11-10-04/using_cors_with_all_modern_browsers.aspx">Usando CORS con todos los exploradores (modernos).</a></li>
+ <li><a href="http://www.html5rocks.com/en/tutorials/cors/" title="http://www.html5rocks.com/en/tutorials/cors/">Usando CORS - HTML5 Rocks</a></li>
+</ul>
+
+<p>{{ languages( { "ja": "ja/HTTP_access_control" } ) }}</p>
diff --git a/files/es/web/http/gestion_de_la_conexion_en_http_1.x/index.html b/files/es/web/http/gestion_de_la_conexion_en_http_1.x/index.html
deleted file mode 100644
index 5e9fff8fa9..0000000000
--- a/files/es/web/http/gestion_de_la_conexion_en_http_1.x/index.html
+++ /dev/null
@@ -1,86 +0,0 @@
----
-title: Gestión de la conexión en  HTTP/1.x
-slug: Web/HTTP/Gestion_de_la_conexion_en_HTTP_1.x
-translation_of: Web/HTTP/Connection_management_in_HTTP_1.x
----
-<div>{{HTTPSidebar}}</div>
-
-<p class="summary">La gestión de las conexiones en un tema fundamental en HTTP: crear y mantener una conexión tiene una gran influencia en el rendimiento de las páginas Web y las aplicaciones Web. En la versión HTTP/1.x, hay modos de conexión: conexiones breves, conexiones persistentes, y '<em>pipelining</em>'.</p>
-
-<p>HTTP la mayor parte de las veces se basa en TCP, como protocolo de transporte, dando conexión entre el cliente y el servidor. En sus comienzos, HTTP, únicamente tenia un modelo para gestionar dichas conexiones. Aquellas conexiones eran conexiones breves: se creaba una cada vez que una petición necesitaba ser transmitida, y se cerraba, una vez que la respuesta se había recibido. </p>
-
-<p>Este sencillo modelo tenía una limitación intrínseca en su rendimiento: abrir una conexión TCP es una operación costosa en recursos. Se necesitan intercambiar varios mensajes entre el cliente y el servidor para hacerlo. Y la latencia de la red y su ancho de banda, se veían afectados cuando se realizaba una petición. Las páginas web actuales, necesitan varias peticiones (una docena o más) para tener la información necesaria, de manera que este primer modelo es ineficiente para ellas.</p>
-
-<p>Dos nuevos modelos se presentaron en HTTP/1.1. La conexión persistente, mantiene las conexiones abiertas, entre peticiones sucesivas, eliminando así el tiempo necesario para abrir nuevas conexiones. El modelo 'pipelining' va un paso más allá, y envía varias peticiones sucesivas, sin esperar por la respuesta, reduciendo significativamente la latencia en la red. </p>
-
-<p><img alt="Compares the performance of the three HTTP/1.x connection models: short-lived connections, persistent connections, and HTTP pipelining." src="https://mdn.mozillademos.org/files/13727/HTTP1_x_Connections.png" style="height: 538px; width: 813px;"></p>
-
-<div class="note">
-<p>HTTP/2 añade nuevos modelos para la gestión de la conexión. </p>
-</div>
-
-<p>Un punto significativo a tener en cuenta en la gestión de la conexión de HTTP, es que este se refiere a la conexión establecida entre dos nodos consecutivos de la red, esto se denomina <a href="/en-US/docs/Web/HTTP/Headers#hbh">hop-by-hop</a>, en contraposición al concepto de  <a href="/en-US/docs/Web/HTTP/Headers#e2e">end-to-end</a>. El modelo de conexión entre un cliente y su primer proxy, puede ser distinto que la comunicación entre el proxy y el servidor de destino (u otro proxy intermedio).  Las cabeceras de HTTP utilizadas para definir el modelo de conexión como  {{HTTPHeader("Connection")}} y {{HTTPHeader("Keep-Alive")}}, se refieren a una conexión <a href="/en-US/docs/Web/HTTP/Headers#hbh">hop-by-hop</a>, y estos parámetros, pueden variar en las comunicaciones de los nodos intermedios. </p>
-
-<p>Un tema también relativo a esto, es el concepto de conexiones con protocolos HTTP superiores, donde una conexión HTTP/1.1 se actualiza a un protocolo distinto, como puede ser TLS/1.0, WebSockets, o HTTP/2.  Este <a href="/en-US/docs/Web/HTTP/Protocol_upgrade_mechanism">mecanismo de actualización del </a><a href="/en-US/docs/Web/HTTP/Protocol_upgrade_mechanism">protocolo</a> se encuentra documentado en otra página.</p>
-
-<h2 id="Conexiones_breves">Conexiones breves</h2>
-
-<p>El modelo original de HTTP, y el modelo de HTTP/1.0, está basado, en conexiones breves. Cada petición HTTP, se completa estableciendo (iniciando, estableciendo y cerrando) su propia conexión. Esto supone que la coordinación en el protocolo HTTP (handshake), sucede de forma previa a cada petición HTTP.</p>
-
-<p>La coordinación o inicialización de una comunicación en el protocolo TCP, requiere un tiempo dado, pero al adaptarse el protocolo TCP a su carga de transmisión de datos, este incrementa su eficiencia cuando se mantiene la conexión en el tiempo, utilizándose una conexión para transmitir numerosos peticiones de datos. Las conexiones breves, no utilizan esta característica del protocolo TCP, y el rendimiento de la conexión es peor que en el caso óptimo, al estar constantemente necesitando iniciar conexiones para transmitir cada mensaje (esto se conoce como conexiones 'en frio', o en inglés: 'cold connections'). </p>
-
-<p>La conexión breve es la conexión usada por defecto en HTTP/1.0 (únicamente en el caso de no esté definida la  cabecera {{HTTPHeader("Connection")}}, o su valor sea  <code>close</code>  entonces, no se utilizaria el modelo de conexiones breves). En HTTP/1.1, este modelo de conexión unicamente se utiliza al definir la cabecera  {{HTTPHeader("Connection")}} como <code>close</code>  .</p>
-
-<div class="note">
-<p>A menos que  se de la situación en que se ha de trabajar con sistemas antiguos que no soportan conexiones persistentes, no hay otra razón para el uso de este modelo de conexiones. </p>
-</div>
-
-<h2 id="Conexiones_persistentes">Conexiones persistentes</h2>
-
-<p>Las conexiones breves, tienen dos importantes desventajas: el tiempo que necesitan para establecer una nueva conexión es significativo, y la eficacia del protocolo inferior a HTTP: el TCP unicamente mejora cuando la conexión ha estado funcionando durante algún tiempo (conexión caliente o 'warm connection' en inglés). Para atenuar dichos inconvenientes, se presentó el concepto de conexión persistente, ya incluso antes de presentar el protocolo HTTP/1.1. También se le conoce como <em>'keep-alive connection</em>' que en inglés indica una conexión que se mantiene viva. </p>
-
-<p>Una conexión persistente es aquella la cual permanece abierta por un periodo, y puede ser reutilizada por varias peticiones de datos, ahorrando así la necesidad de efectuar nuevas sincronizaciones a nivel de TCP, de esta manera se puede usar más eficazmente el protocolo TCP. Esta conexión no estará abierta permanentemente, si la conexión no se usa, se cerrará después de un tiempo determinado (un servidor puede usar la cabecera {{HTTPHeader("Keep-Alive")}} para definir el tiempo mínimo que la conexión debería estar abierta. </p>
-
-<p>Las conexiones persistentes también tienen sus desventajas: incluso cuando no están transmitiendo datos, consumen recursos, y en casos en que la red esté soportando una carga de transferencia muy alta, un {{glossary("DoS attack", "ataque DoS ")}} puede realizarse. En estos casos, el uso de conexiones no persistentes, las cuales se cierran tan pronto como no necesitan transmitir, pueden resultar en un sistema más eficaz.</p>
-
-<p>HTTP/1.0 las conexiones HTTP/1.0 no son persistentes por defecto. Si se indica en la cabecera de un mensaje {{HTTPHeader("Connection")}} cualquier otro valor que no sea:  <code>close</code>, como puede ser: <code>retry-after</code>,  en tal caso, se harán conexiones persistentes. </p>
-
-<p>En HTTP/1.1 las conexiones son persistentes por defecto, así que esa cabecera no se necesita (aunque usualmente se añade como medida defensiva, en caso de que se tenga que utilizar el protocolo HTTP/1.0).</p>
-
-<h2 id="HTTP_pipelining">HTTP pipelining</h2>
-
-<div class="note">
-<p>HTTP pipelining no está activado por defecto en los navegacdores modernos:</p>
-
-<ul>
- <li><a href="https://en.wikipedia.org/wiki/Proxy_server">Proxies</a> con defectos de implementación son habituales y provocan comportamientos extraños y erráticos, que los desarrolladores de Webs, no pueden predecir, ni corregir fácilmente.</li>
- <li>HTTP Pipelining es complicado de implementar correctamente: el tamaño del recurso pedido, el correcto <a href="https://en.wikipedia.org/wiki/Round-trip_delay_time">RTT</a> que será utilizado, así como el ancho de banda efectivo, tienen un impacto directo en la en la mejora de rendimiento de este método. Sin conocer estos valores, puede que mensajes importantes, se vean retrasados, por mensajes que no lo son. El concepto de "importante" incluso cambia según se carga la maquetación (layout) de la página. De ahí que este método solamente presente una mejora marginal en la mayoría de los casos.  </li>
- <li>HTTP Pipelining  presenta un problema conocido como <a href="https://en.wikipedia.org/wiki/Head-of-line_blocking">HOL</a> </li>
-</ul>
-
-<p>Así, debido a estas razones este método ha sido relevado por un algoritmo mejor, la <strong>multiplexación</strong>, que es el que usa HTTP/2.</p>
-</div>
-
-<p>Por defecto, las peticiones HTTP son realizadas de manera sequencial. La siguiente petición es realizada una vez que la respuesta a la petición actual ha sido recibida. Debido a que se ven afectadas por latencias en la red y limitaciones en el ancho de banda, ésto puede llevar a retardos significativos hasta que la siguiente petición es <em>vista</em> por el servidor.</p>
-
-<p>Pipelining es un proceso para enviar peticiones sucesivas, sobre la misma conexión persistente, sin esperar a la respuesta. Esto evita latencias en la conexión. En teoría, el rendimiento también podría mejorar si dos peticiones HTTP se empaquetaran en el mismo mensaje TCP. El MSS (Maximum Segment Size) típico, es suficientemente grande para contener varias peticiones simples, aunque la demanda de tamaño de las peticiones HTTP sigue creciendo.</p>
-
-<p>No todos los tipos de peticiones HTTP pueden ser utilizadas en pipeline: solo métodos {{glossary("idempotent")}} como {{HTTPMethod("GET")}}, {{HTTPMethod("HEAD")}}, {{HTTPMethod("PUT")}} and {{HTTPMethod("DELETE")}} pueden ser repetidos sin incidencias. Si ocurre un fallo, el contenido se puede simplemente reenviar.</p>
-
-<p>Hoy en día, todo proxy y servidor que cumpla con HTTP/1.1 debería dar soporte a pipelining, aunque en práctica tenga muchas limitaciones. Por esta razón, ningún explorador moderno lo activa por defecto.</p>
-
-<h2 id="Domain_sharding">Domain sharding</h2>
-
-<div class="note">
-<p>Unless you have a very specific immediate need, don't use this deprecated technique; switch to HTTP/2 instead. In HTTP/2, domain sharding is no more useful: the HTTP/2 connection is able to handle parallel unprioritized requests very well. Domain sharding is even detrimental to performance. Most HTTP/2 implementation use a technique called <a href="I wonder if it's related to the nobash/nobreak/nopick secret exit s of Elrond's chambers.">connection coalescing</a> to revert eventual domain sharding.</p>
-</div>
-
-<p>As an HTTP/1.x connection is serializing requests, even without any ordering, it can't be optimal without large enough available bandwidth. As a solution, browsers open several connections to each domain, sending parallel requests. Default was once 2 to 3 connections, but this has now increased to a more common use of 6 parallel connections. There is a risk of triggering <a href="/en-US/docs/Glossary/DOS_attack">DoS</a> protection on the server side if attempting more than this number.</p>
-
-<p>If  the server wishes a faster Web site or application response, it is possible for the server to force the opening of more connections. For example, Instead of having all resources on the same domain, say <code>www.example.com</code>, it could split over several domains, <code>www1.example.com</code>, <code>www2.example.com</code>, <code>www3.example.com</code>. Each of these domains resolve to the <em>same</em> server, and the Web browser will open 6 connections to each (in our example, boosting the connections to 18). This technique is called <em>domain sharding</em>.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/13783/HTTPSharding.png" style="height: 727px; width: 463px;"></p>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>Las mejoras en la gestión de las conexiones, han significado un considerable aumento en el rendimiento del protocolo HTTP. Con HTTP/1.1 o HTTP/1.0, el uso de una conexión persistente - al menos hasta que que no necesite transmitir más datos- resulta en un significativo aumento en el rendimiento de la comunicación. Incluso, el fracaso de. método de pipelining, ha resultado en el diseño de modelos superiores para la gestión de la conexión, todo lo cual se ha incorporado en HTTP/2. </p>
diff --git a/files/es/web/http/headers/digest/index.html b/files/es/web/http/headers/digest/index.html
new file mode 100644
index 0000000000..088927030d
--- /dev/null
+++ b/files/es/web/http/headers/digest/index.html
@@ -0,0 +1,143 @@
+---
+title: SubtleCrypto.digest()
+slug: Web/HTTP/Headers/Digest
+tags:
+  - API
+  - Encriptación
+  - Referencia
+  - SubtleCrypto
+  - Web Crypto API
+  - encrypt
+translation_of: Web/HTTP/Headers/Digest
+original_slug: Web/API/SubtleCrypto/encrypt
+---
+<div>{{APIRef("Web Crypto API")}}</div>
+
+<p>El método <code><strong>digest()</strong></code> de la interfaz {{domxref("SubtleCrypto")}} genera un digest de los datos proveidos. Un {{domxref("digest")}} es un valor corto de longitud fija derivado de alguna entrada de longitud variable. Los digest criptográficos deben mostrar resistencia a colisiones, lo que significa que es difícil encontrar dos entradas diferentes que tengan el mismo valor de digest.</p>
+
+<p>Toma como argumento un identificador para el algoritmo digest a utilizar y los datos a codificar. Devuelve un <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" title="The Promise object represents the eventual completion (or failure) of an asynchronous operation, and its resulting value."><code>Promise</code></a> que se completará con el digest.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">const digest = <em>crypto</em><code>.subtle.digest(<em>algorithm</em>, <em>data</em>)</code>;
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<ul>
+ <li><em><code>algorithm</code></em> es un {{domxref("DOMString")}} definiendo la función hash a utilizar. Los valores admitidos son:
+
+  <ul>
+   <li><code>SHA-1</code> (pero no debe utilizarse en aplicaciones criptográficas)</li>
+   <li><code>SHA-256</code></li>
+   <li><code>SHA-384</code></li>
+   <li><code>SHA-512</code></li>
+  </ul>
+ </li>
+ <li><em><code>data</code></em> es un {{jsxref("ArrayBuffer")}} o {{domxref("ArrayBufferView")}} que contiene los datos a ser digitalizados.</li>
+</ul>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<ul>
+ <li><code><em>digest</em></code> es un <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise" title="The Promise object represents the eventual completion (or failure) of an asynchronous operation, and its resulting value."><code>Promise</code></a> que se completa con un <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer" title="The ArrayBuffer object is used to represent a generic, fixed-length raw binary data buffer. You cannot directly manipulate the contents of an ArrayBuffer; instead, you create one of the typed array objects or a DataView object which represents the buffer in a specific format, and use that to read and write the contents of the buffer."><code>ArrayBuffer</code></a> conteniendo el digest.</li>
+</ul>
+
+<h2 id="Algoritmos_soportados">Algoritmos soportados</h2>
+
+<p>Los argoritmos digest, también conocidos como <a href="/en-US/docs/Glossary/Cryptographic_hash_function">funciones criptográficas hash</a>, transforman un bloque de datos arbitrariamente grande en una salida de tamaño fijo, normalmente mucho más corta que la entrada. Tienen una variedad de aplicaciones en criptografía.</p>
+
+<h3 id="SHA-1">SHA-1</h3>
+
+<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.1, y produce una salida de 160 bits de largo.</p>
+
+<div class="blockIndicator warning">
+<p><strong>Advertencia</strong>: Este algoritmo se considera ahora vulnerable y no debe utilizarse para aplicaciones criptográficas.</p>
+</div>
+
+<h3 id="SHA-256">SHA-256</h3>
+
+<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.2, y produce una salida de 256 bits de largo.</p>
+
+<h3 id="SHA-384">SHA-384</h3>
+
+<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.5, y produce una salida de 384 bits de largo.</p>
+
+<h3 id="SHA-512">SHA-512</h3>
+
+<p>Este algoritmo se especifica en <a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf">FIPS 180-4</a>, sección 6.4, y produce una salida de 512 bits de largo.</p>
+
+<div class="blockIndicator note">
+<p>Sugerencia: Si estás buscando aquí cómo crear un código de autenticación de mensajes "keyed-hash" (<a href="/en-US/docs/Glossary/HMAC">HMAC</a>), necesitas usar <a href="/en-US/docs/Web/API/SubtleCrypto/sign#HMAC">SubtleCrypto.sign()</a> en su lugar.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_básico">Ejemplo básico</h3>
+
+<p>Este ejemplo codifica un mensaje, luego calcula su digest SHA-256 y muestra la longitud del mismo:</p>
+
+<pre class="brush: js">const text = 'An obscure body in the S-K System, your majesty. The inhabitants refer to it as the planet Earth.';
+
+async function digestMessage(message) {
+  const encoder = new TextEncoder();
+  const data = encoder.encode(message);
+  const hash = await crypto.subtle.digest('SHA-256', data);
+  return hash;
+}
+
+const digestBuffer = await digestMessage(text);
+console.log(digestBuffer.byteLength);
+</pre>
+
+<h3 id="Convirtiendo_un_digest_a_una_cadena_hexadecimal">Convirtiendo un digest a una cadena hexadecimal</h3>
+
+<p>El resumen se devuelve como un <code>ArrayBuffer</code>, pero para la comparación y visualización los digests se representan a menudo como cadenas hexadecimales. Este ejemplo calcula un digest, y luego convierte el <code>ArrayBuffer</code> a un string hexadecimal:</p>
+
+<pre class="brush: js">const text = 'An obscure body in the S-K System, your majesty. The inhabitants refer to it as the planet Earth.';
+
+async function digestMessage(message) {
+  const msgUint8 = new TextEncoder().encode(message);                           // encode as (utf-8) Uint8Array
+  const hashBuffer = await crypto.subtle.digest('SHA-256', msgUint8);           // hash the message
+  const hashArray = Array.from(new Uint8Array(hashBuffer));                     // convert buffer to byte array
+  const hashHex = hashArray.map(b =&gt; b.toString(16).padStart(2, '0')).join(''); // convert bytes to hex string
+  return hashHex;
+}
+
+const digestHex = await digestMessage(text);
+console.log(digestHex);
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Web Crypto API', '#dfn-SubtleCrypto-method-digest', 'SubtleCrypto.digest()')}}</td>
+   <td>{{Spec2('Web Crypto API')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir a los datos, por favor, revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
+
+<p>{{Compat("api.SubtleCrypto.digest")}}</p>
+
+<div class="blockIndicator note">
+<p>En Chrome 60, se añadió una característica que deshabilita crypto.subtle para conexiones no TLS.</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features">Chromium especificación de origines seguro</a></li>
+ <li><a href="https://nvlpubs.nist.gov/nistpubs/FIPS/NIST.FIPS.180-4.pdf" rel="noopener">FIPS 180-4</a> especifica la familia de algoritmos de digest SHA.</li>
+</ul>
diff --git a/files/es/web/http/headers/user-agent/firefox/index.html b/files/es/web/http/headers/user-agent/firefox/index.html
new file mode 100644
index 0000000000..ea1eee4b10
--- /dev/null
+++ b/files/es/web/http/headers/user-agent/firefox/index.html
@@ -0,0 +1,56 @@
+---
+title: Cadenas del User Agent de Gecko
+slug: Web/HTTP/Headers/User-Agent/Firefox
+tags:
+  - Desarrollo_Web
+  - Todas_las_Categorías
+translation_of: Web/HTTP/Headers/User-Agent/Firefox
+original_slug: Cadenas_del_User_Agent_de_Gecko
+---
+<h3 id="Uso_Apropiado" name="Uso_Apropiado">Uso Apropiado</h3>
+<p>No se recomienda el uso de las cadenas del User Agent como su principal opción para la detección del navegador. Vea <a href="es/Deteccion_Cross_browser_y_Soporte_Cross_Browser"> Deteccion Cross browser y Soporte Cross Browser</a> para una ojeada mas en profundo a varias técnicas sobre detección de navegadores con recomendaciones.</p>
+<p>En particular, recomendamos usar la detección de la cadena del User Agent para detección del navegador del lado del servidor. Si su actual código del lado cliente usa detección de la cadena del User Agent, simplemente puede hacer una búsqueda por la cadena "Gecko" en el User Agent para detectar cualquier navegador basado en Gecko.</p>
+<p>Para todos los detalles que lidian con detecciones con Gecko los cuales lidian con bugs especificos o los cuales requieran conocimiento de strings especificos o fechas de la compilación, use el objeto <a href="es/DOM_Client_Object_Cross-Reference/navigator">navigator</a>.</p>
+<h3 id="Lista_de_user_agents_liberados_por_Netscape_y_AOL_basados_en_Gecko" name="Lista_de_user_agents_liberados_por_Netscape_y_AOL_basados_en_Gecko">Lista de user agents liberados por Netscape y AOL basados en Gecko</h3>
+<p>Vea <a class="external" href="http://www.mozilla.org/build/revised-user-agent-strings.html">mozilla.org's user-agent strings reference</a> para Plataforma específico,
+ <i>
+  Seguridad</i>
+ ,
+ <i>
+  Sistema Operativo</i>
+ o
+ <i>
+  CPU</i>
+ y valores de
+ <i>
+  localización</i>
+ .</p>
+<ul>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.4) Gecko/20030624 Netscape/7.1 (ax)&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0.2) Gecko/20030208 Netscape/7.02&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0.2) Gecko/20021120 Netscape/7.01&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0.1) Gecko/20020823 Netscape/7.0&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Macintosh; U; PPC Mac OS X; en-US; rv:1.0.1) Gecko/20020730 AOL/7.0&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:1.0rc2) Gecko/20020512 Netscape/7.0b1&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4.2) Gecko/20020220 CS 2000 7.0/7.0&lt;/tt&gt;
+  <ul>
+   <li>&lt;tt&gt;Mozilla/5.0 (Windows; U; Win98; en-US; rv:0.9.4.2) Gecko/20020502 CS 2000 7.0/7.0&lt;/tt&gt;</li>
+  </ul>
+ </li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4.1) Gecko/20020508 Netscape6/6.2.3&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4.1) Gecko/20020314 Netscape6/6.2.2&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.4) Gecko/20011128 Netscape6/6.2.1&lt;/tt&gt;</li>
+ <li>&lt;tt&gt;Mozilla/5.0 (Platform; Security; OS-or-CPU; Localization; rv:0.9.2) Gecko/20010726 Netscape6/6.1&lt;/tt&gt;</li>
+</ul>
+<p><br>
+ Para una información más detallada sobre liberaciones de Netscape y Mozilla, por favor vea el <a class="external" href="http://www.mozilla.org/releases/cvstags.html">mozilla.org cvstags reference</a>.</p>
+<p> </p>
+<div class="originaldocinfo">
+ <h3 id="Informacion_Del_documento_Original" name="Informacion_Del_documento_Original">Informacion Del documento Original</h3>
+ <ul>
+  <li>Autor: Bob Clary</li>
+  <li>Última Actualización: Junio 30, 2003</li>
+  <li>Copyright © 2001-2003 Netscape. Todos los derechos reservados.</li>
+ </ul>
+</div>
+<p> </p>
diff --git a/files/es/web/http/mecanismo_actualizacion_protocolo/index.html b/files/es/web/http/mecanismo_actualizacion_protocolo/index.html
deleted file mode 100644
index 74ef3b57f7..0000000000
--- a/files/es/web/http/mecanismo_actualizacion_protocolo/index.html
+++ /dev/null
@@ -1,246 +0,0 @@
----
-title: Mecanismo de actualización del protocolo
-slug: Web/HTTP/mecanismo_actualizacion_protocolo
-translation_of: Web/HTTP/Protocol_upgrade_mechanism
----
-<div>{{HTTPSidebar}}</div>
-
-<p><span class="seoSummary">El protocolo <a href="/en/HTTP" title="en/HTTP">HTTP</a> posee un mecanismo especifico para permitir que una conexión de comunicación ya establecida, pueda actualizar su protocolo a un nuevo protocolo, incluso si es incompatible. Este documento muestra este mecanismo y presenta ejemplos de posibles escenarios en los que se puede usar. </span></p>
-
-<p>Este mecanismo, siempre es iniciado por el cliente (con la única excepción de que el servidor use: {{anch("Server-initiated upgrade to TLS", "requerida actualización a TLS")}}), y el servidor puede aceptar o rechazar el cambio al nuevo protocolo. Esto hace posible comenzar una conexión usando un protocolo de uso común, como puede ser HTTP/1.1, y posteriormente pedir un cambio de protocolo a HTTP/2.0 o incluso WebSockets.</p>
-
-<h2 id="Acuerdo_de_conexión_(handshake)">Acuerdo de conexión (handshake)</h2>
-
-<p>Las actualizaciones del protocolo de comunicación son siempre iniciadas por el cliente; no hay un mecanismo establecido  para que el servidor pida un cambio de protocolo. Cuando el cliente desea una actualización a un nuevo protocolo, lo hace mandando una petición normal al servidor con cualquier método ({{HTTPMethod("GET")}}, {{HTTPMethod("POST")}}, etc.). La petición ha de configurarse de manera especial, para que incluya en ella, la petición de actualización del protocolo. </p>
-
-<p>Específicamente la petición ha de incluir las dos siguientes cabeceras:</p>
-
-<dl>
- <dt><code><a href="/en-US/docs/Web/HTTP/Headers/Connection">Connection: Upgrade</a></code></dt>
- <dd>La cabecera de conexión (<code>Connection</code>) ha de tener el valor <code>"Upgrade"</code>, para indicar que se está pidiendo una actualización del protocolo.</dd>
- <dt><code><a href="/en-US/docs/Web/HTTP/Headers/Upgrade">Upgrade: protocols</a></code></dt>
- <dd>La cabecera de actualización (<code>Upgrade</code>) indica los protocolos deseados, en orden de preferencia, separados por comas.</dd>
-</dl>
-
-<p>Puede que sean necesarias otras cabeceras, dependiendo del protocolo que se pida.; por ejemplo: las actualizaciones a <a href="/en-US/docs/Web/API/WebSocket">WebSocket</a> necesitan cabeceras adicionales para definir la configuración de la conexión, así como para detalles de la seguridad. Para más detalles, lea la sección: {{anch("Upgrading to a WebSocket connection")}}.</p>
-
-<p>El servidor, puede negarse a la actualización en este caso. Y este simplemente ignora la cabecera de actualización (<code>"Upgrade"</code>) y responde con un estado normal, ( <code>"200 OK"</code> si todo es correcto, o <code>30x</code> si quiere hacer una redirección, o <code>40x</code> ó <code>50x</code>  si no puede responder con el recurso requerido) — O puede  aceptar la actualización del protocolo de comunicación. En este caso, responde con un código <code>"101 Switching Protocols"</code>  y con una cabecera <code>Upgrade</code> que indica el protocolo elegido.</p>
-
-<p>Justo después de enviar el código de estado  <code>"101 Switching Protocols"</code> se procederá a realizar el acuerdo de conexión (corresponde con el termino: 'handshake' en inglés). Si el nuevo protocolo lo necesitase, el servidor, enviaría una la respuesta a la petición inicial (la que contenía la cabecera de <code>"Upgrade"</code> ) , de acuerdo a las reglas del protocolo. </p>
-
-<h2 id="El_código_de_estado_101">El código de estado 101</h2>
-
-<p>El código de estado {{HTTPStatus(101)}} se manda en respuesta a una petición que contenga la cabecera de <code>"Upgrade"</code> para indicar que el emisor de la petición desea actualizar el protocolo de comunicación. Si se responde con el código de estado <code>"101 Switching Protocols"</code>, se han de incluir también  las cabeceras <code>Connection</code> y <code>Upgrade</code> para definir el protocolo elegido. Más adelante en el texto se dan más detalles del funcionamiento de este mecanismo y ejemplos.</p>
-
-<p>Se puede utilizar el mecanismo de actualización del protocolo para pasar de una conexión en HTTP/1.1 a una conexión con HTTP/2, pero no se permite cambiar el protocolo en el otro sentido. De hecho, el código de estado  <code>"101 Switching Protocols"</code>, no está incluido en HTTP/2, ya que HTTP/2 no posee el mecanismo de actualización de protocolo. </p>
-
-<h2 id="Usos_frecuentes_del_mecanismo_de_actualización_de_protocolo">Usos frecuentes del mecanismo de actualización de protocolo</h2>
-
-<p>A continuación se presentan los casos más frecuentes del mecanismo de actualización de protocolo, mediante el uso de la cabecera <code>"Upgrade"</code>. </p>
-
-<h3 id="Actualización_a_una_conexión_con_HTTP2">Actualización a una conexión con HTTP/2</h3>
-
-<p>El procedimiento estándar, es iniciar una conexión usando HTTP/1.1, debido a su amplio uso. Y a continuación, hacer una petición de actualización de protocolo, a HTTP/2. De esta manera, se tiene una conexión de comunicaciones, incluso si el servidor no soporta protocolo HTTP/2. De todas formas, únicamente es posible actualizar el protocolo, a una versión de HTTP/2 no segura (no encriptada). Esto se realiza indicando el protocolo deseado como: <code>h2c</code>, que indica "HTTP/2 Cleartext". Además es necesario que se defina en los campos de cabecera las propiedades <code>HTTP2-Settings</code>. </p>
-
-<pre>GET / HTTP/1.1
-Host: destination.server.ext
-Connection: Upgrade, HTTP2-Settings
-Upgrade: h2c
-HTTP2-Settings: <em>base64EncodedSettings</em>
-</pre>
-
-<p>Aquí, <code>base64EncodedSettings</code> es una propiedad de HTTP/2 <code>"SETTINGS"</code> del contenido de la trama que se expresa en formato <code>base64url</code>, seguido de un carácter de igual, <code>"="</code>,  omitido aquí para que se pudiera incluir en esta cabecera expresada en texto.</p>
-
-<div class="note">
-<p>El formato <a href="https://tools.ietf.org/html/rfc4648#section-5">base64url</a> fno es el mismo que el formato estándar Base64.  La única diferencia es que para asegurar que la cadena de caracteres es segura para que pueda usarse con URLs y nombres de archivos, los caracteres 62 y 63 en el alfabeto de este formato se cambian de : <code>"+"</code> y <code>"/"</code> a: <code>"-"</code> (menos) y <code>"_"</code>  respectivamente.</p>
-</div>
-
-<p>Si el servidor no puede hacer el cambio a HTTP/2, este responderá en HTTP/1 como si fuera una petición normal (con los códigos: <code>"200 OK"</code> si todo es correcto, o <code>30x</code> si quiere hacer una redirección, o <code>40x</code> ó <code>50x</code>  si no puede responder con el recurso pedido). Así una petición de una página que exista será respondida con <code>"HTTP/1.1 200 OK"</code>  seguido del resto de la cabecera de la página. Si el servidor, si que puede cambiar al protocolo HTTP/2 , la respuesta será:  "<code>HTTP/1.1 101 Switching Protocols"</code>. A continuación, se presenta un ejemplo de una posible respuesta, a una petición de actualización a HTTP/2.</p>
-
-<pre>HTTP/1.1 101 Switching Protocols
-Connection: Upgrade
-Upgrade: h2c
-
-<em>[standard HTTP/2 server connection preface, etc.]</em></pre>
-
-<p>A continuación de la línea en blanco, que sigue al final de la cabecera de respuesta; el servidor, indicará los parámetros ("<code>SETTINGS"</code>) de la nueva comunicación con HTTP/2.</p>
-
-<h3 id="Mejorar_a_una_conexión_WebSocket">Mejorar a una conexión WebSocket</h3>
-
-<p>By far, the most common use case for upgrading an HTTP connection is to use WebSockets, which are always implemented by upgrading an HTTP or HTTPS connection. Keep in mind that if you're opening a new connection using the <a href="/en-US/docs/Web/API/WebSocket">WebSocket API</a>, or any library that does WebSockets, most or all of this is done for you. For example, opening a WebSocket connection is as simple as:</p>
-
-<pre class="brush: js">webSocket = new WebSocket("ws://destination.server.ext", "optionalProtocol");</pre>
-
-<p>The {{domxref("WebSocket.WebSocket", "WebSocket()")}} constructor does all the work of creating an initial HTTP/1.1 connection then handling the handshaking and upgrade process for you.</p>
-
-<div class="note">
-<p>You can also use the <code>"wss://"</code> URL scheme to open a secure WebSocket connection.</p>
-</div>
-
-<p>If you need to create a WebSocket connection from scratch, you'll have to handle the handshaking process yourself. After creating the initial HTTP/1.1 session, you need to request the upgrade by adding to a standard request the {{HTTPHeader("Upgrade")}} and {{HTTPHeader("Connection")}} headers, as follows:</p>
-
-<pre>Connection: Upgrade
-Upgrade: websocket</pre>
-
-<h3 id="Cabeceras_específicas_de_WebSocket">Cabeceras específicas de WebSocket</h3>
-
-<p>The following headers are involved in the WebSocket upgrade process. Other than the {{HTTPHeader("Upgrade")}} and {{HTTPHeader("Connection")}} headers, the rest are generally optional or handled for you by the browser and server when they're talking to each other.</p>
-
-<h4 id="HTTPHeader(Sec-WebSocket-Extensions)">{{HTTPHeader("Sec-WebSocket-Extensions")}}</h4>
-
-<p>Specifies one or more protocol-level WebSocket extensions to ask the server to use. Using more than one <code>Sec-WebSocket-Extension</code> header in a request is permitted; the result is the same as if you included all of the listed extensions in one such header.</p>
-
-<pre class="syntaxbox">Sec-WebSocket-Extensions: <em>extensions</em></pre>
-
-<dl>
- <dt><code>extensions</code></dt>
- <dd>A comma-separated list of extensions to request (or agree to support). These should be selected from the <a href="https://www.iana.org/assignments/websocket/websocket.xml#extension-name">IANA WebSocket Extension Name Registry</a>. Extensions which take parameters do so using semicolon delineation.</dd>
-</dl>
-
-<p>For example:</p>
-
-<pre>Sec-WebSocket-Extensions: superspeed, colormode; depth=16</pre>
-
-<h4 id="HTTPHeader(Sec-WebSocket-Key)">{{HTTPHeader("Sec-WebSocket-Key")}}</h4>
-
-<p>Provides information to the server which is needed in order to confirm that the client is entitled to request an upgrade to WebSocket. This header can be used when insecure (HTTP) clients wish to upgrade, in order to offer some degree of protection against abuse. The value of the key is computed using an algorithm defined in the WebSocket specification, so this <em>does not provide security</em>. Instead, it helps to prevent non-WebSocket clients from inadvertently, or through misuse, requesting a WebSocket connection. In essence, then, this key simply confirms that "Yes, I really mean to open a WebSocket connection."</p>
-
-<p>This header is automatically added by clients that choose to use it; it cannot be added using the {{domxref("XMLHttpRequest.setRequestHeader()")}} method.</p>
-
-<pre class="syntaxbox">Sec-WebSocket-Key: <em>key</em></pre>
-
-<dl>
- <dt><code>key</code></dt>
- <dd>The key for this request to upgrade. The client adds this if it wishes to do so, and the server will include in the response a key of its own, which the client will validate before delivering the upgrade reponse to you.</dd>
-</dl>
-
-<p>The server's response's <code>Sec-WebSocket-Accept</code> header will have a value computed based upon the specified <code>key</code>.</p>
-
-<h4 id="HTTPHeader(Sec-WebSocket-Protocol)">{{HTTPHeader("Sec-WebSocket-Protocol")}}</h4>
-
-<p>The <code>Sec-WebSocket-Protocol</code> header specifies one or more WebSocket protocols that you wish to use, in order of preference. The first one that is supported by the server will be selected and returned by the server in a <code>Sec-WebSocket-Protocol</code> header included in the response. You can use this more than once in the header, as well; the result is the same as if you used a comma-delineated list of subprotocol identifiers in a single header.</p>
-
-<pre class="syntaxbox">Sec-WebSocket-Protocol: <em>subprotocols</em></pre>
-
-<dl>
- <dt><code>subprotocols</code></dt>
- <dd>A comma-separated list of subprotocol names, in the order of preference. The subprotocols may be selected from the <a href="https://www.iana.org/assignments/websocket/websocket.xml#subprotocol-name">IANA WebSocket Subprotocol Name Registry</a> or may be a custom name jointly understood by the client and the server.</dd>
-</dl>
-
-<h4 id="HTTPHeader(Sec-WebSocket-Version)">{{HTTPHeader("Sec-WebSocket-Version")}}</h4>
-
-<h5 id="Encabezado_de_petición">Encabezado de petición</h5>
-
-<p>Specifies the WebSocket protocol version the client wishes to use, so the server can confirm whether or not that version is supported on its end.</p>
-
-<pre class="syntaxbox">Sec-WebSocket-Version: <em>version</em></pre>
-
-<dl>
- <dt><code>version</code></dt>
- <dd>The WebSocket protocol version the client wishes to use when communicating with the server. This number should be the most recent version possible listed in the <a href="https://www.iana.org/assignments/websocket/websocket.xml#version-number">IANA WebSocket Version Number Registry</a>. The most recent final version of the WebSocket protocol is version 13.</dd>
-</dl>
-
-<h5 id="Encabezado_de_respuesta">Encabezado de respuesta</h5>
-
-<p>If the server can't communicate using the specified version of the WebSocket protocol, it will respond with an error (such as 426 Upgrade Required) that includes in its headers a <code>Sec-WebSocket-Version</code> header with a comma-separated list of the supported protocol versions. If the server does support the requested protocol version, no <code>Sec-WebSocket-Version</code> header is included in the response.</p>
-
-<pre class="syntaxbox">Sec-WebSocket-Version: <em>supportedVersions</em></pre>
-
-<dl>
- <dt><code>supportedVersions</code></dt>
- <dd>A comma-delineated list of the WebSocket protocol versions supported by the server.</dd>
-</dl>
-
-<h3 id="Cabeceras_exclusivas_de_respuesta">Cabeceras exclusivas de respuesta</h3>
-
-<p>The response from the server may include these.</p>
-
-<h4 id="HTTPHeader(Sec-WebSocket-Accept)">{{HTTPHeader("Sec-WebSocket-Accept")}}</h4>
-
-<p>Included in the response message from the server during the opening handshake process when the server is willing to initiate a WebSocket connection. It will appear no more than once in the repsonse headers.</p>
-
-<pre class="syntaxbox">Sec-WebSocket-Accept: <em>hash</em></pre>
-
-<dl>
- <dt><code>hash</code></dt>
- <dd>If a <code>Sec-WebSocket-Key</code> header was provided, the value of this header is computed by taking the value of the key, concatenating the string "258EAFA5-E914-47DA-95CA-C5AB0DC85B11" to it, taking the {{interwiki("wikipedia", "SHA-1")}} hash of that concatenated string, resulting in a 20-byte value. That value is then <a href="/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding">base64</a> encoded to obtain the value of this property.</dd>
-</dl>
-
-<h3 id="Mejora_a_HTTP_sobre_TLS_iniciada_por_el_cliente">Mejora a HTTP sobre TLS iniciada por el cliente</h3>
-
-<p>You can also upgrade an HTTP/1.1 connection to TLS/1.0. The main advantages to this are that you can avoid using URL redirection from "http://" to "https://" on the server and you can easily use TLS on virtual hosts. This may, however, introduce problems with proxy servers.</p>
-
-<p>Upgrading an HTTP connection to use {{Glossary("TLS")}} uses the {{HTTPHeader("Upgrade")}} header with the token <code>"TLS/1.0"</code>. If the switch is made successfully, the original request (which included <code>Upgrade</code>) is completed as normal, but on the TLS connection.</p>
-
-<p>The request to TLS can be made either optionally or mandatorily.</p>
-
-<h4 id="Mejora_opcional">Mejora opcional</h4>
-
-<p>To upgrade to TLS optionally (that is, allowing the connection to continue in cleartext if the upgrade to TLS fails), you simply use the <code>Upgrade</code> and {{HTTPHeader("Connection")}} headers as expected. For example, given the original request:</p>
-
-<pre>GET http://destination.server.ext/secretpage.html HTTP/1.1
-Host: destination.server.ext
-Upgrade: TLS/1.0
-Connection: Upgrade</pre>
-
-<p>If the server <em>does not</em> support TLS upgrade, or is unable to upgrade to TLS at the time, it responds with a standard HTTP/1.1 response, such as:</p>
-
-<pre>HTTP/1.1 200 OK
-Date: Thu, 17 Aug 2017 21:07:44 GMT
-Server: Apache
-Last-Modified: Thu, 17 Aug 2017 08:30:15 GMT
-Content-Type: text/html; charset=utf-8
-Content-Length: 31374
-
-&lt;html&gt;
-  ...
-&lt;/html&gt;
-</pre>
-
-<p>If the server <em>does</em> support TLS upgrade and wishes to permit the upgrade, it responds with the <code>"101 Switching Protocols"</code> response code, like this:</p>
-
-<pre>HTTP/1.1 101 Switching Protocols
-Upgrade: TLS/1.0, HTTP/1.1</pre>
-
-<p>Once the TLS handshake is complete, the original request will be responded to as normal.</p>
-
-<h4 id="Mejora_obligatoria">Mejora obligatoria</h4>
-
-<p>To request a mandatory upgrade to TLS—that is, to upgrade and fail the connection if the upgrade is not successful—your first request must be an {{HTTPMethod("OPTIONS")}} request, like this:</p>
-
-<pre>OPTIONS * HTTP/1.1
-Host: destination.server.ext
-Upgrade: TLS/1.0
-Connection: Upgrade</pre>
-
-<p>If the upgrade to TLS succeeds, the server will respond with <code>"101 Switching Protocols"</code> as described in the previous section. If the upgrade fails, the HTTP/1.1 connection will fail.</p>
-
-<h3 id="Mejora_a_TLS_iniciada_por_el_servidor">Mejora a TLS iniciada por el servidor</h3>
-
-<p>This works roughly the same way as a client-initiated upgrade; an optional upgrade is requested by adding the {{HTTPHeader("Upgrade")}} header to any message. A mandatory upgrade, though, works slightly differently, in that it requests the upgrade by replying to a message it receives with the {{HTTPStatus(426)}} status code, like this:</p>
-
-<pre>HTTP/1.1 426 Upgrade Required
-Upgrade: TLS/1.1, HTTP/1.1
-Connection: Upgrade
-
-&lt;html&gt;
-... Human-readable HTML page describing why the upgrade is required
-    and what to do if this text is seen ...
-&lt;/html&gt;</pre>
-
-<p>If the client receiving the <code>"426 Upgrade Required"</code> response is willing and able to upgrade to TLS, it should then start the same process covered above under {{anch("Client-initiated upgrade to TLS")}}.</p>
-
-<h2 id="Referencias">Referencias</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/WebSocket">WebSocket API</a></li>
- <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
- <li>Especificaciones y RFCs:
-  <ul>
-   <li>{{RFC(2616)}}</li>
-   <li>{{RFC(6455)}}</li>
-   <li>{{RFC(2817)}}</li>
-   <li>{{RFC(7540)}}</li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/web/http/peticiones_condicionales/index.html b/files/es/web/http/peticiones_condicionales/index.html
deleted file mode 100644
index c480c68ee2..0000000000
--- a/files/es/web/http/peticiones_condicionales/index.html
+++ /dev/null
@@ -1,148 +0,0 @@
----
-title: Peticiones condicionales en HTTP
-slug: Web/HTTP/Peticiones_condicionales
-tags:
-  - Guía
-  - HTTP
-  - Peticiones condicionales
-translation_of: Web/HTTP/Conditional_requests
----
-<p>{{HTTPSidebar}}</p>
-
-<p class="summary">HTTP tiene un concepto de peticiones condicionales, donde el resultado, e incluso el éxito de una petición, se puede cambiar comparando los recursos afectados con el valor de un validador. Dichas peticiones pueden ser útiles para validar el contenido de un caché, y evitar un control inútil, para verificar la integridad de un documento, como al reanudar una descarga, o al evitar perder actualizaciones al cargar o modificar un documento en el servidor.</p>
-
-<h2 id="Principios">Principios</h2>
-
-<p>Las peticiones condicionales HTTP son peticiones que se ejecutan de manera diferente, dependiendo del valor de encabezados específicos. Estos encabezados definen una condición previa, y el resultado de la petición será diferente si la condición previa coincide o no.</p>
-
-<p>Los diferentes comportamientos están definidos por el método de petición utilizado y por el conjunto de encabezados utilizados para una condición previa:</p>
-
-<ul>
- <li>para métodos seguros, como {{HTTPMethod("GET")}}, que generalmente intenta recuperar un documento, la petición condicional se puede usar para devolver el documento, solo si es relevante. Por lo tanto, esto ahorra ancho de banda.</li>
- <li>para métodos no seguros, como {{HTTPMethod("PUT")}}, que generalmente carga un documento, la petición condicional se puede usar para cargar el documento, solo si el original en el que se basa es el mismo que el almacenado en el servidor.</li>
-</ul>
-
-<h2 id="Validadores">Validadores</h2>
-
-<p>Todos los encabezados condicionales intentan verificar si el recurso almacenado en el servidor coincide con una versión específica. Para lograr esto, las peticiones condicionales deben indicar la versión del recurso. Como la comparación de todo el recurso byte a byte es impracticable, y no siempre lo que se desea, la petición transmite un valor que describe la versión. Tales valores se llaman validadores y son de dos tipos:</p>
-
-<ul>
- <li>la fecha de la última modificación del documento, la fecha <em>last-modified</em>.</li>
- <li>una cadena opaca, que identifica de forma única cada versión, llamada <em>etiqueta de entidad</em>, o <em>etag</em>.</li>
-</ul>
-
-<p>Comparar versiones del mismo recurso es un poco complicado: según el contexto, hay dos tipos de controles de igualdad:</p>
-
-<ul>
- <li><em>Validación fuerte</em>, se utiliza cuando se espera una igualdad byte a byte, por ejemplo, al reanudar una descarga.</li>
- <li><em>Validación débil</em>, se utiliza cuando el agente de usuario solo necesita determinar si los dos recursos tienen el mismo contenido. Incluso si son pequeñas diferencias, como diferentes anuncios, o un pie de página con una fecha diferente.</li>
-</ul>
-
-<p>El tipo de validación es independiente del validador utilizado. Ambos {{HTTPHeader("Last-Modified")}} y {{HTTPHeader("ETag")}} permiten ambos tipos de validación, aunque la complejidad para implementarlo en el lado del servidor puede variar. HTTP utiliza la validación fuerte de forma predeterminada, y especifica cuándo se puede usar una validación débil.</p>
-
-<h3 id="Validación_fuerte">Validación fuerte</h3>
-
-<p id="sect1">La validación sólida consiste en garantizar que el recurso es, byte a byte, idéntico al que se compara. Esto es obligatorio para algunos encabezados condicionales, y el predeterminado para los demás. La validación sólida es muy estricta y puede ser difícil garantizarla a nivel del servidor, pero garantiza que no se pierdan datos en ningún momento, a veces a expensas del rendimiento.</p>
-
-<p>Es bastante difícil tener un identificador único para una validación fuerte con {{HTTPHeader("Last-Modified")}}. A menudo, esto se hace usando una {{HTTPHeader("ETag")}} con el hash MD5 del recurso (o un derivado).</p>
-
-<h3 id="Validación_débil">Validación débil</h3>
-
-<p>La validación débil difiere de la validación fuerte, ya que considera dos versiones del documento como idénticas si el contenido es equivalente. Por ejemplo, una página que diferiría de otra solo por una fecha diferente en su pie de página, o una publicidad diferente, se consideraría idéntica a la otra con validación débil. Estas dos versiones iguales se consideran diferentes cuando se usa una validación fuerte. Construir un sistema de etags que cree una validación débil puede ser complejo, ya que implica conocer la importancia de los diferentes elementos de una página, pero es muy útil para optimizar el rendimiento del caché.</p>
-
-<h2 id="Encabezados_condicionales">Encabezados condicionales</h2>
-
-<p>Varios encabezados HTTP, llamados encabezados condicionales, conducen a peticiones condicionales. Estos son:</p>
-
-<dl>
- <dt>{{HTTPHeader("If-Match")}}</dt>
- <dd>Tiene éxito si la {{HTTPHeader("ETag")}} del recurso remoto es igual a una que se encuentra en este encabezado. Por defecto, a menos que el etag tenga el prefijo <code>'W/'</code>, realiza una validación fuerte.</dd>
- <dt>{{HTTPHeader("If-None-Match")}}</dt>
- <dd>Tiene éxito si la {{HTTPHeader("ETag")}} del recurso remoto es diferente a cada una de las enumeradas en este encabezado. Por defecto, a menos que el etag tenga el prefijo <code>'W/'</code>, realiza una validación fuerte.</dd>
- <dt>{{HTTPHeader("If-Modified-Since")}}</dt>
- <dd>Tiene éxito si la fecha {{HTTPHeader("Last-Modified")}} del recurso remoto es más reciente que la dada en este encabezado.</dd>
- <dt>{{HTTPHeader("If-Unmodified-Since")}}</dt>
- <dd>Tiene éxito si la fecha {{HTTPHeader("Last-Modified")}} del recurso remoto es más antigua que la dada en este encabezado.</dd>
- <dt>{{HTTPHeader("If-Range")}}</dt>
- <dd>Similar a {{HTTPHeader("If-Match")}}, o {{HTTPHeader("If-Unmodified-Since")}}, pero sólo puede tener una etag, o una fecha. Si falla, la petición de rango falla, y en lugar de una respuesta {{HTTPStatus("206")}} <code>Partial Content</code> , se envía un {{HTTPStatus("200")}} <code>OK</code> con el recurso completo.</dd>
-</dl>
-
-<h2 id="Casos_de_uso">Casos de uso</h2>
-
-<h3 id="Actualización_de_caché">Actualización de caché</h3>
-
-<p>El caso de uso más común para las peticiones condicionales es la actualización de un caché. Con un caché vacío, o sin un caché, el recurso solicitado se devuelve con un estado {{HTTPStatus("200")}} <code>OK</code>.</p>
-
-<p><img alt="The request issued when the cache is empty triggers the resource to be downloaded, with both validator value sent as headers. The cache is then filled." src="https://mdn.mozillademos.org/files/13729/Cache1.png" style="height: 265px; width: 741px;"></p>
-
-<p>Junto con el recurso, los validadores se envían en los encabezados. En este ejemplo, ambos {{HTTPHeader("Last-Modified")}} y {{HTTPHeader("ETag")}} son enviados, pero igualmente podría haber sido solo uno de ellos. Estos validadores se almacenan en caché con el recurso (como todos los encabezados) y se utilizarán para elaborar peticiones condicionales, una vez que el caché se vuelva obsoleto.</p>
-
-<p>Mientras la memoria caché no esté obsoleta, no se emitirá ninguna petición. Pero una vez se haya vuelto obsoleta, esto se controla principalmente por el encabezado {{HTTPHeader("Cache-Control")}}, el cliente no usa el valor en caché directamente, pero emite una <em>petición condicional</em>. El valor del validador se utiliza como parámetro de los encabezados {{HTTPHeader("If-Modified-Since")}} y {{HTTPHeader("If-Match")}}.</p>
-
-<p>Si el recurso no ha cambiado, el servidor envía una respuesta {{HTTPStatus("304")}} <code>Not Modified</code>. Esto hace que la caché se actualice nuevamente, y el cliente usa el recurso almacenado en caché. Aunque hay una respuesta/petición de ida y vuelta que consume algunos recursos, esto es más eficiente que transmitir de nuevo todo el recurso a través del cable.</p>
-
-<p><img alt="With a stale cache, the conditional request is sent. The server can determine if the resource changed, and, as in this case, decide not to send it again as it is the same." src="https://mdn.mozillademos.org/files/13731/HTTPCache2.png" style="height: 265px; width: 741px;"></p>
-
-<p>Si el recurso ha cambiado, el servidor simplemente envía una respuesta {{HTTPStatus("200")}}<code> OK</code>, con la nueva versión del recurso, como si la petición no fuera condicional y el cliente usara este nuevo recurso (y lo almacena en caché).</p>
-
-<p><img alt="In the case where the resource was changed, it is sent back as if the request wasn't conditional." src="https://mdn.mozillademos.org/files/13733/HTTPCache3.png"></p>
-
-<p>Además de la configuración de los validadores en el lado del servidor, este mecanismo es transparente: todos los navegadores administran una memoria caché y envían dichas peticiones condicionales sin que los desarrolladores web realicen ningún trabajo especial.</p>
-
-<h3 id="Integridad_de_una_descarga_parcial">Integridad de una descarga parcial</h3>
-
-<p>La descarga parcial de archivos es una funcionalidad de HTTP que permite reanudar operaciones previas, ahorrando tiempo y ancho de banda, manteniendo la información ya obtenida:</p>
-
-<p><img alt="A download has been stopped and only partial content has been retrieved." src="https://mdn.mozillademos.org/files/16190/HTTPResume1.png" style="height: 397px; width: 764px;"></p>
-
-<p>Un servidor que admite descargas parciales transmite esto enviando el encabezado {{HTTPHeader("Accept-Ranges")}}. Una vez que esto sucede, el cliente puede reanudar una descarga enviando un encabezado {{HTTPHeader("Ranges")}} con los rangos ausentes:</p>
-
-<p><img alt="The client resumes the requests by indicating the range he needs and preconditions checking the validators of the partially obtained request." src="https://mdn.mozillademos.org/files/13737/HTTPResume2.png"></p>
-
-<p>El principio es simple, pero hay un problema potencial: si el recurso descargado se modificó entre ambas descargas, los rangos obtenidos corresponderán a dos versiones diferentes del recurso y el documento final estará corrupto.</p>
-
-<p>Para evitar esto, se utilizan peticiones condicionales. Para los rangos, hay dos formas de hacer esto. El más flexible hace uso de {{HTTPHeader("If-Modified-Since")}} y {{HTTPHeader("If-Match")}} y el servidor devuelve un error si la precondición falla, entonces el cliente reinicia la descarga desde el principio:</p>
-
-<p><img alt="When the partially downloaded resource has been modified, the preconditions will fail and the resource will have to be downloaded again completely." src="https://mdn.mozillademos.org/files/13739/HTTPResume3.png"></p>
-
-<p>Incluso si este método funciona, agrega un intercambio adicional de respuesta / petición cuando el documento ha sido cambiado. Esto altera el rendimiento, y HTTP tiene un encabezado específico para evitar este escenario: {{HTTPHeader("If-Range")}}:</p>
-
-<p><img alt="The If-Range headers allows the server to directly send back the complete resource if it has been modified, no need to send a 412 error and wait for the client to re-initiate the download." src="https://mdn.mozillademos.org/files/13741/HTTPResume4.png" style="height: 263px; width: 770px;"></p>
-
-<p>Esta solución es más eficiente, pero ligeramente menos flexible, ya que solo se puede usar una etag en la condición. Rara vez se necesita flexibilidad adicional.</p>
-
-<h3 id="Evitar_el_problema_de_actualización_perdida_con_bloqueo_optimista">Evitar el problema de actualización perdida con bloqueo optimista</h3>
-
-<p>Una operación común en aplicaciones web es <em>actualizar</em> un documento remoto. Esto es muy común en cualquier sistema de archivos o aplicaciones de control de origen, pero cualquier aplicación que permita almacenar recursos remotos necesita tal mecanismo. Los sitios web comunes, como los wikis y otros CMS, tienen tal necesidad.</p>
-
-<p>Con el método {{HTTPMethod("PUT")}} eres capaz de implementarlo. El cliente primero lee los archivos originales, los modifica y finalmente los envía al servidor:</p>
-
-<p><img alt="Updating a file with a PUT is very simple when concurrency is not involved." src="https://mdn.mozillademos.org/files/13743/HTTPLock1.png"></p>
-
-<p>Desafortunadamente, las cosas se vuelven un poco inexactas cuando tenemos en cuenta la concurrencia. Mientras un cliente modifica localmente su nueva copia del recurso, un segundo cliente puede obtener el mismo recurso y hacer lo mismo con su copia. Lo que sucede a continuación es muy desafortunado: cuando se devuelven al servidor, las modificaciones del primer cliente son descartadas por la inserción del siguiente cliente, ya que este segundo cliente desconoce los cambios del primer cliente en el recurso. La decisión sobre quién gana, no se comunica a la otra parte. De qué cliente se deberán mantener los cambios, variará con la velocidad a la que se realicen, esto depende del rendimiento de los clientes, del servidor e incluso de la edición humana del documento en el cliente. El ganador cambiará de una vez a la siguiente. Esta es una condición de carrera y conduce a comportamientos problemáticos, que son difíciles de detectar y depurar:</p>
-
-<p><img alt="When several clients update the same resource in parallel, we are facing a race condition: the slowest win, and the others don't even know they lost. Problematic!" src="https://mdn.mozillademos.org/files/13749/HTTPLock2.png" style="height: 504px; width: 904px;"></p>
-
-<p>No hay manera de lidiar con este problema sin molestar a uno de los dos clientes. Sin embargo, se deben evitar las actualizaciones perdidas y las condiciones de la carrera. Queremos resultados predecibles y esperamos que se notifique a los clientes cuando se rechacen sus cambios.</p>
-
-<p>Las peticiones condicionales permiten implementar el <em>algoritmo de bloqueo optimista</em> (utilizado por la mayoría de las wikis o sistemas de control de fuente). El concepto es permitir que todos los clientes obtengan copias del recurso, luego permitirles modificarlo localmente, controlando la concurrencia al permitir que el primer cliente envíe una actualización. Todas las actualizaciones posteriores, basadas en la versión ahora obsoleta del recurso, se rechazan:</p>
-
-<p><img alt="Conditional requests allow to implement optimistic locking: now the quickest wins, and the others get an error." src="https://mdn.mozillademos.org/files/13751/HTTPLock3.png" style="height: 471px; width: 904px;"></p>
-
-<p>Esto se implementa utilizando el encabezado {{HTTPHeader("If-Match")}} o {{HTTPHeader("If-Unmodified-Since")}}. Si la etag no coincide con el archivo original, o si el archivo ha sido modificado desde que se obtuvo, el cambio simplemente se rechaza con un error {{HTTPStatus("412")}} <code>Precondition Failed</code>. Depende entonces del cliente lidiar con el error: ya sea notificando al usuario que vuelva a comenzar (esta vez en la versión más reciente) o mostrándole al usuario una <em>diferencia </em>entre ambas versiones, Ayudándoles a decidir qué cambios desean mantener.</p>
-
-<h3 id="Tratar_con_la_primera_subida_de_un_recurso.">Tratar con la primera subida de un recurso.</h3>
-
-<p>La primera subida de un recurso es un caso similar al anterior. Como cualquier actualización de un recurso, está sujeta a una condición de carrera si dos clientes intentan realizarla en tiempos similares. Para evitar esto, se pueden utilizar peticiones condicionales: añadiendo el encabezado {{HTTPHeader("If-None-Match")}} con el valor especial <code>'*'</code>, representando cualquier etag. La petición sólo tendrá éxito si el recurso no existía antes:</p>
-
-<p><img alt="Like for a regular upload, the first upload of a resource is subject to a race condition: If-None-Match can prevent it." src="https://mdn.mozillademos.org/files/13753/HTTPFirst.png" style="height: 311px; width: 895px;"></p>
-
-<p><code>If-None-Match</code> solo funcionará con servidores compatibles con HTTP/1.1 (y posteriores). Si no está seguro de que el servidor sea compatible, primero debe emitir una petición {{HTTPMethod("HEAD")}} al recurso para comprobarlo.</p>
-
-<h2 id="Conclusión">Conclusión</h2>
-
-<p>Las peticiones condicionales son una característica clave de HTTP y permiten la creación de aplicaciones eficientes y complejas. Para almacenar en caché o reanudar las descargas, el único trabajo requerido para los webmasters es configurar el servidor correctamente, establecer etags correctas en algunos entornos puede ser complicado. Una vez logrado, el navegador atenderá las peticiones condicionales esperadas.</p>
-
-<p>Para los mecanismos de bloqueo, ocurre lo contrario: los desarrolladores web deben emitir una petición con los encabezados adecuados, mientras que los webmasters pueden confiar en la aplicación para realizar las comprobaciones correspondientes.</p>
-
-<p>En ambos casos está claro, las peticiones condicionales son una característica fundamental de la Web.</p>
diff --git a/files/es/web/http/protocol_upgrade_mechanism/index.html b/files/es/web/http/protocol_upgrade_mechanism/index.html
new file mode 100644
index 0000000000..1b4b1f2673
--- /dev/null
+++ b/files/es/web/http/protocol_upgrade_mechanism/index.html
@@ -0,0 +1,247 @@
+---
+title: Mecanismo de actualización del protocolo
+slug: Web/HTTP/Protocol_upgrade_mechanism
+translation_of: Web/HTTP/Protocol_upgrade_mechanism
+original_slug: Web/HTTP/mecanismo_actualizacion_protocolo
+---
+<div>{{HTTPSidebar}}</div>
+
+<p><span class="seoSummary">El protocolo <a href="/en/HTTP" title="en/HTTP">HTTP</a> posee un mecanismo especifico para permitir que una conexión de comunicación ya establecida, pueda actualizar su protocolo a un nuevo protocolo, incluso si es incompatible. Este documento muestra este mecanismo y presenta ejemplos de posibles escenarios en los que se puede usar. </span></p>
+
+<p>Este mecanismo, siempre es iniciado por el cliente (con la única excepción de que el servidor use: {{anch("Server-initiated upgrade to TLS", "requerida actualización a TLS")}}), y el servidor puede aceptar o rechazar el cambio al nuevo protocolo. Esto hace posible comenzar una conexión usando un protocolo de uso común, como puede ser HTTP/1.1, y posteriormente pedir un cambio de protocolo a HTTP/2.0 o incluso WebSockets.</p>
+
+<h2 id="Acuerdo_de_conexión_(handshake)">Acuerdo de conexión (handshake)</h2>
+
+<p>Las actualizaciones del protocolo de comunicación son siempre iniciadas por el cliente; no hay un mecanismo establecido  para que el servidor pida un cambio de protocolo. Cuando el cliente desea una actualización a un nuevo protocolo, lo hace mandando una petición normal al servidor con cualquier método ({{HTTPMethod("GET")}}, {{HTTPMethod("POST")}}, etc.). La petición ha de configurarse de manera especial, para que incluya en ella, la petición de actualización del protocolo. </p>
+
+<p>Específicamente la petición ha de incluir las dos siguientes cabeceras:</p>
+
+<dl>
+ <dt><code><a href="/en-US/docs/Web/HTTP/Headers/Connection">Connection: Upgrade</a></code></dt>
+ <dd>La cabecera de conexión (<code>Connection</code>) ha de tener el valor <code>"Upgrade"</code>, para indicar que se está pidiendo una actualización del protocolo.</dd>
+ <dt><code><a href="/en-US/docs/Web/HTTP/Headers/Upgrade">Upgrade: protocols</a></code></dt>
+ <dd>La cabecera de actualización (<code>Upgrade</code>) indica los protocolos deseados, en orden de preferencia, separados por comas.</dd>
+</dl>
+
+<p>Puede que sean necesarias otras cabeceras, dependiendo del protocolo que se pida.; por ejemplo: las actualizaciones a <a href="/en-US/docs/Web/API/WebSocket">WebSocket</a> necesitan cabeceras adicionales para definir la configuración de la conexión, así como para detalles de la seguridad. Para más detalles, lea la sección: {{anch("Upgrading to a WebSocket connection")}}.</p>
+
+<p>El servidor, puede negarse a la actualización en este caso. Y este simplemente ignora la cabecera de actualización (<code>"Upgrade"</code>) y responde con un estado normal, ( <code>"200 OK"</code> si todo es correcto, o <code>30x</code> si quiere hacer una redirección, o <code>40x</code> ó <code>50x</code>  si no puede responder con el recurso requerido) — O puede  aceptar la actualización del protocolo de comunicación. En este caso, responde con un código <code>"101 Switching Protocols"</code>  y con una cabecera <code>Upgrade</code> que indica el protocolo elegido.</p>
+
+<p>Justo después de enviar el código de estado  <code>"101 Switching Protocols"</code> se procederá a realizar el acuerdo de conexión (corresponde con el termino: 'handshake' en inglés). Si el nuevo protocolo lo necesitase, el servidor, enviaría una la respuesta a la petición inicial (la que contenía la cabecera de <code>"Upgrade"</code> ) , de acuerdo a las reglas del protocolo. </p>
+
+<h2 id="El_código_de_estado_101">El código de estado 101</h2>
+
+<p>El código de estado {{HTTPStatus(101)}} se manda en respuesta a una petición que contenga la cabecera de <code>"Upgrade"</code> para indicar que el emisor de la petición desea actualizar el protocolo de comunicación. Si se responde con el código de estado <code>"101 Switching Protocols"</code>, se han de incluir también  las cabeceras <code>Connection</code> y <code>Upgrade</code> para definir el protocolo elegido. Más adelante en el texto se dan más detalles del funcionamiento de este mecanismo y ejemplos.</p>
+
+<p>Se puede utilizar el mecanismo de actualización del protocolo para pasar de una conexión en HTTP/1.1 a una conexión con HTTP/2, pero no se permite cambiar el protocolo en el otro sentido. De hecho, el código de estado  <code>"101 Switching Protocols"</code>, no está incluido en HTTP/2, ya que HTTP/2 no posee el mecanismo de actualización de protocolo. </p>
+
+<h2 id="Usos_frecuentes_del_mecanismo_de_actualización_de_protocolo">Usos frecuentes del mecanismo de actualización de protocolo</h2>
+
+<p>A continuación se presentan los casos más frecuentes del mecanismo de actualización de protocolo, mediante el uso de la cabecera <code>"Upgrade"</code>. </p>
+
+<h3 id="Actualización_a_una_conexión_con_HTTP2">Actualización a una conexión con HTTP/2</h3>
+
+<p>El procedimiento estándar, es iniciar una conexión usando HTTP/1.1, debido a su amplio uso. Y a continuación, hacer una petición de actualización de protocolo, a HTTP/2. De esta manera, se tiene una conexión de comunicaciones, incluso si el servidor no soporta protocolo HTTP/2. De todas formas, únicamente es posible actualizar el protocolo, a una versión de HTTP/2 no segura (no encriptada). Esto se realiza indicando el protocolo deseado como: <code>h2c</code>, que indica "HTTP/2 Cleartext". Además es necesario que se defina en los campos de cabecera las propiedades <code>HTTP2-Settings</code>. </p>
+
+<pre>GET / HTTP/1.1
+Host: destination.server.ext
+Connection: Upgrade, HTTP2-Settings
+Upgrade: h2c
+HTTP2-Settings: <em>base64EncodedSettings</em>
+</pre>
+
+<p>Aquí, <code>base64EncodedSettings</code> es una propiedad de HTTP/2 <code>"SETTINGS"</code> del contenido de la trama que se expresa en formato <code>base64url</code>, seguido de un carácter de igual, <code>"="</code>,  omitido aquí para que se pudiera incluir en esta cabecera expresada en texto.</p>
+
+<div class="note">
+<p>El formato <a href="https://tools.ietf.org/html/rfc4648#section-5">base64url</a> fno es el mismo que el formato estándar Base64.  La única diferencia es que para asegurar que la cadena de caracteres es segura para que pueda usarse con URLs y nombres de archivos, los caracteres 62 y 63 en el alfabeto de este formato se cambian de : <code>"+"</code> y <code>"/"</code> a: <code>"-"</code> (menos) y <code>"_"</code>  respectivamente.</p>
+</div>
+
+<p>Si el servidor no puede hacer el cambio a HTTP/2, este responderá en HTTP/1 como si fuera una petición normal (con los códigos: <code>"200 OK"</code> si todo es correcto, o <code>30x</code> si quiere hacer una redirección, o <code>40x</code> ó <code>50x</code>  si no puede responder con el recurso pedido). Así una petición de una página que exista será respondida con <code>"HTTP/1.1 200 OK"</code>  seguido del resto de la cabecera de la página. Si el servidor, si que puede cambiar al protocolo HTTP/2 , la respuesta será:  "<code>HTTP/1.1 101 Switching Protocols"</code>. A continuación, se presenta un ejemplo de una posible respuesta, a una petición de actualización a HTTP/2.</p>
+
+<pre>HTTP/1.1 101 Switching Protocols
+Connection: Upgrade
+Upgrade: h2c
+
+<em>[standard HTTP/2 server connection preface, etc.]</em></pre>
+
+<p>A continuación de la línea en blanco, que sigue al final de la cabecera de respuesta; el servidor, indicará los parámetros ("<code>SETTINGS"</code>) de la nueva comunicación con HTTP/2.</p>
+
+<h3 id="Mejorar_a_una_conexión_WebSocket">Mejorar a una conexión WebSocket</h3>
+
+<p>By far, the most common use case for upgrading an HTTP connection is to use WebSockets, which are always implemented by upgrading an HTTP or HTTPS connection. Keep in mind that if you're opening a new connection using the <a href="/en-US/docs/Web/API/WebSocket">WebSocket API</a>, or any library that does WebSockets, most or all of this is done for you. For example, opening a WebSocket connection is as simple as:</p>
+
+<pre class="brush: js">webSocket = new WebSocket("ws://destination.server.ext", "optionalProtocol");</pre>
+
+<p>The {{domxref("WebSocket.WebSocket", "WebSocket()")}} constructor does all the work of creating an initial HTTP/1.1 connection then handling the handshaking and upgrade process for you.</p>
+
+<div class="note">
+<p>You can also use the <code>"wss://"</code> URL scheme to open a secure WebSocket connection.</p>
+</div>
+
+<p>If you need to create a WebSocket connection from scratch, you'll have to handle the handshaking process yourself. After creating the initial HTTP/1.1 session, you need to request the upgrade by adding to a standard request the {{HTTPHeader("Upgrade")}} and {{HTTPHeader("Connection")}} headers, as follows:</p>
+
+<pre>Connection: Upgrade
+Upgrade: websocket</pre>
+
+<h3 id="Cabeceras_específicas_de_WebSocket">Cabeceras específicas de WebSocket</h3>
+
+<p>The following headers are involved in the WebSocket upgrade process. Other than the {{HTTPHeader("Upgrade")}} and {{HTTPHeader("Connection")}} headers, the rest are generally optional or handled for you by the browser and server when they're talking to each other.</p>
+
+<h4 id="HTTPHeader(Sec-WebSocket-Extensions)">{{HTTPHeader("Sec-WebSocket-Extensions")}}</h4>
+
+<p>Specifies one or more protocol-level WebSocket extensions to ask the server to use. Using more than one <code>Sec-WebSocket-Extension</code> header in a request is permitted; the result is the same as if you included all of the listed extensions in one such header.</p>
+
+<pre class="syntaxbox">Sec-WebSocket-Extensions: <em>extensions</em></pre>
+
+<dl>
+ <dt><code>extensions</code></dt>
+ <dd>A comma-separated list of extensions to request (or agree to support). These should be selected from the <a href="https://www.iana.org/assignments/websocket/websocket.xml#extension-name">IANA WebSocket Extension Name Registry</a>. Extensions which take parameters do so using semicolon delineation.</dd>
+</dl>
+
+<p>For example:</p>
+
+<pre>Sec-WebSocket-Extensions: superspeed, colormode; depth=16</pre>
+
+<h4 id="HTTPHeader(Sec-WebSocket-Key)">{{HTTPHeader("Sec-WebSocket-Key")}}</h4>
+
+<p>Provides information to the server which is needed in order to confirm that the client is entitled to request an upgrade to WebSocket. This header can be used when insecure (HTTP) clients wish to upgrade, in order to offer some degree of protection against abuse. The value of the key is computed using an algorithm defined in the WebSocket specification, so this <em>does not provide security</em>. Instead, it helps to prevent non-WebSocket clients from inadvertently, or through misuse, requesting a WebSocket connection. In essence, then, this key simply confirms that "Yes, I really mean to open a WebSocket connection."</p>
+
+<p>This header is automatically added by clients that choose to use it; it cannot be added using the {{domxref("XMLHttpRequest.setRequestHeader()")}} method.</p>
+
+<pre class="syntaxbox">Sec-WebSocket-Key: <em>key</em></pre>
+
+<dl>
+ <dt><code>key</code></dt>
+ <dd>The key for this request to upgrade. The client adds this if it wishes to do so, and the server will include in the response a key of its own, which the client will validate before delivering the upgrade reponse to you.</dd>
+</dl>
+
+<p>The server's response's <code>Sec-WebSocket-Accept</code> header will have a value computed based upon the specified <code>key</code>.</p>
+
+<h4 id="HTTPHeader(Sec-WebSocket-Protocol)">{{HTTPHeader("Sec-WebSocket-Protocol")}}</h4>
+
+<p>The <code>Sec-WebSocket-Protocol</code> header specifies one or more WebSocket protocols that you wish to use, in order of preference. The first one that is supported by the server will be selected and returned by the server in a <code>Sec-WebSocket-Protocol</code> header included in the response. You can use this more than once in the header, as well; the result is the same as if you used a comma-delineated list of subprotocol identifiers in a single header.</p>
+
+<pre class="syntaxbox">Sec-WebSocket-Protocol: <em>subprotocols</em></pre>
+
+<dl>
+ <dt><code>subprotocols</code></dt>
+ <dd>A comma-separated list of subprotocol names, in the order of preference. The subprotocols may be selected from the <a href="https://www.iana.org/assignments/websocket/websocket.xml#subprotocol-name">IANA WebSocket Subprotocol Name Registry</a> or may be a custom name jointly understood by the client and the server.</dd>
+</dl>
+
+<h4 id="HTTPHeader(Sec-WebSocket-Version)">{{HTTPHeader("Sec-WebSocket-Version")}}</h4>
+
+<h5 id="Encabezado_de_petición">Encabezado de petición</h5>
+
+<p>Specifies the WebSocket protocol version the client wishes to use, so the server can confirm whether or not that version is supported on its end.</p>
+
+<pre class="syntaxbox">Sec-WebSocket-Version: <em>version</em></pre>
+
+<dl>
+ <dt><code>version</code></dt>
+ <dd>The WebSocket protocol version the client wishes to use when communicating with the server. This number should be the most recent version possible listed in the <a href="https://www.iana.org/assignments/websocket/websocket.xml#version-number">IANA WebSocket Version Number Registry</a>. The most recent final version of the WebSocket protocol is version 13.</dd>
+</dl>
+
+<h5 id="Encabezado_de_respuesta">Encabezado de respuesta</h5>
+
+<p>If the server can't communicate using the specified version of the WebSocket protocol, it will respond with an error (such as 426 Upgrade Required) that includes in its headers a <code>Sec-WebSocket-Version</code> header with a comma-separated list of the supported protocol versions. If the server does support the requested protocol version, no <code>Sec-WebSocket-Version</code> header is included in the response.</p>
+
+<pre class="syntaxbox">Sec-WebSocket-Version: <em>supportedVersions</em></pre>
+
+<dl>
+ <dt><code>supportedVersions</code></dt>
+ <dd>A comma-delineated list of the WebSocket protocol versions supported by the server.</dd>
+</dl>
+
+<h3 id="Cabeceras_exclusivas_de_respuesta">Cabeceras exclusivas de respuesta</h3>
+
+<p>The response from the server may include these.</p>
+
+<h4 id="HTTPHeader(Sec-WebSocket-Accept)">{{HTTPHeader("Sec-WebSocket-Accept")}}</h4>
+
+<p>Included in the response message from the server during the opening handshake process when the server is willing to initiate a WebSocket connection. It will appear no more than once in the repsonse headers.</p>
+
+<pre class="syntaxbox">Sec-WebSocket-Accept: <em>hash</em></pre>
+
+<dl>
+ <dt><code>hash</code></dt>
+ <dd>If a <code>Sec-WebSocket-Key</code> header was provided, the value of this header is computed by taking the value of the key, concatenating the string "258EAFA5-E914-47DA-95CA-C5AB0DC85B11" to it, taking the {{interwiki("wikipedia", "SHA-1")}} hash of that concatenated string, resulting in a 20-byte value. That value is then <a href="/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding">base64</a> encoded to obtain the value of this property.</dd>
+</dl>
+
+<h3 id="Mejora_a_HTTP_sobre_TLS_iniciada_por_el_cliente">Mejora a HTTP sobre TLS iniciada por el cliente</h3>
+
+<p>You can also upgrade an HTTP/1.1 connection to TLS/1.0. The main advantages to this are that you can avoid using URL redirection from "http://" to "https://" on the server and you can easily use TLS on virtual hosts. This may, however, introduce problems with proxy servers.</p>
+
+<p>Upgrading an HTTP connection to use {{Glossary("TLS")}} uses the {{HTTPHeader("Upgrade")}} header with the token <code>"TLS/1.0"</code>. If the switch is made successfully, the original request (which included <code>Upgrade</code>) is completed as normal, but on the TLS connection.</p>
+
+<p>The request to TLS can be made either optionally or mandatorily.</p>
+
+<h4 id="Mejora_opcional">Mejora opcional</h4>
+
+<p>To upgrade to TLS optionally (that is, allowing the connection to continue in cleartext if the upgrade to TLS fails), you simply use the <code>Upgrade</code> and {{HTTPHeader("Connection")}} headers as expected. For example, given the original request:</p>
+
+<pre>GET http://destination.server.ext/secretpage.html HTTP/1.1
+Host: destination.server.ext
+Upgrade: TLS/1.0
+Connection: Upgrade</pre>
+
+<p>If the server <em>does not</em> support TLS upgrade, or is unable to upgrade to TLS at the time, it responds with a standard HTTP/1.1 response, such as:</p>
+
+<pre>HTTP/1.1 200 OK
+Date: Thu, 17 Aug 2017 21:07:44 GMT
+Server: Apache
+Last-Modified: Thu, 17 Aug 2017 08:30:15 GMT
+Content-Type: text/html; charset=utf-8
+Content-Length: 31374
+
+&lt;html&gt;
+  ...
+&lt;/html&gt;
+</pre>
+
+<p>If the server <em>does</em> support TLS upgrade and wishes to permit the upgrade, it responds with the <code>"101 Switching Protocols"</code> response code, like this:</p>
+
+<pre>HTTP/1.1 101 Switching Protocols
+Upgrade: TLS/1.0, HTTP/1.1</pre>
+
+<p>Once the TLS handshake is complete, the original request will be responded to as normal.</p>
+
+<h4 id="Mejora_obligatoria">Mejora obligatoria</h4>
+
+<p>To request a mandatory upgrade to TLS—that is, to upgrade and fail the connection if the upgrade is not successful—your first request must be an {{HTTPMethod("OPTIONS")}} request, like this:</p>
+
+<pre>OPTIONS * HTTP/1.1
+Host: destination.server.ext
+Upgrade: TLS/1.0
+Connection: Upgrade</pre>
+
+<p>If the upgrade to TLS succeeds, the server will respond with <code>"101 Switching Protocols"</code> as described in the previous section. If the upgrade fails, the HTTP/1.1 connection will fail.</p>
+
+<h3 id="Mejora_a_TLS_iniciada_por_el_servidor">Mejora a TLS iniciada por el servidor</h3>
+
+<p>This works roughly the same way as a client-initiated upgrade; an optional upgrade is requested by adding the {{HTTPHeader("Upgrade")}} header to any message. A mandatory upgrade, though, works slightly differently, in that it requests the upgrade by replying to a message it receives with the {{HTTPStatus(426)}} status code, like this:</p>
+
+<pre>HTTP/1.1 426 Upgrade Required
+Upgrade: TLS/1.1, HTTP/1.1
+Connection: Upgrade
+
+&lt;html&gt;
+... Human-readable HTML page describing why the upgrade is required
+    and what to do if this text is seen ...
+&lt;/html&gt;</pre>
+
+<p>If the client receiving the <code>"426 Upgrade Required"</code> response is willing and able to upgrade to TLS, it should then start the same process covered above under {{anch("Client-initiated upgrade to TLS")}}.</p>
+
+<h2 id="Referencias">Referencias</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/WebSocket">WebSocket API</a></li>
+ <li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
+ <li>Especificaciones y RFCs:
+  <ul>
+   <li>{{RFC(2616)}}</li>
+   <li>{{RFC(6455)}}</li>
+   <li>{{RFC(2817)}}</li>
+   <li>{{RFC(7540)}}</li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/web/http/recursos_y_especificaciones/index.html b/files/es/web/http/recursos_y_especificaciones/index.html
deleted file mode 100644
index 0c36d6e3e6..0000000000
--- a/files/es/web/http/recursos_y_especificaciones/index.html
+++ /dev/null
@@ -1,262 +0,0 @@
----
-title: Recursos y especificaciones de HTTP
-slug: Web/HTTP/recursos_y_especificaciones
-translation_of: Web/HTTP/Resources_and_specifications
----
-<div>{{HTTPSidebar}}</div>
-
-<p>HTTP se especificó por primera vez a principios de los 90s. Diseñado con extensibilidad en mente, ha visto numerosas adiciones a lo largo de los años; esto lleva a que su especificación se disemine a través de númerosos documentos (en medio de extensiones experimentales abandonadas). Esta página presenta una lista de los recursos relevantes sobre HTTP:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Title</th>
-   <th scope="col">Status</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{rfc(7230)}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Message Syntax and Routing</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7231)}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Semantics and Content</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7232)}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Conditional Requests</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7233)}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Range Requests</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7234)}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Caching</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(5861)}}</td>
-   <td>HTTP Cache-Control Extensions for Stale Content</td>
-   <td>Informational</td>
-  </tr>
-  <tr>
-   <td>{{rfc(8246)}}</td>
-   <td>HTTP Immutable Responses</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7235)}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Authentication</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(6265)}}</td>
-   <td>HTTP State Management Mechanism<br>
-    <em>Defines Cookies</em></td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td><a href="https://tools.ietf.org/html/draft-ietf-httpbis-cookie-prefixes-00">Draft spec</a></td>
-   <td>Cookie Prefixes</td>
-   <td>IETF Draft</td>
-  </tr>
-  <tr>
-   <td><a href="https://tools.ietf.org/html/draft-ietf-httpbis-cookie-same-site-00">Draft spec</a></td>
-   <td>Same-Site Cookies</td>
-   <td>IETF Draft</td>
-  </tr>
-  <tr>
-   <td><a href="https://tools.ietf.org/html/draft-ietf-httpbis-cookie-alone-01">Draft spec</a></td>
-   <td>Deprecate modification of 'secure' cookies from non-secure origins</td>
-   <td>IETF Draft</td>
-  </tr>
-  <tr>
-   <td>{{rfc(2145)}}</td>
-   <td>Use and Interpretation of HTTP Version Numbers</td>
-   <td>Informational</td>
-  </tr>
-  <tr>
-   <td>{{rfc(6585)}}</td>
-   <td>Additional HTTP Status Codes</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7538)}}</td>
-   <td>The Hypertext Transfer Protocol Status Code 308 (Permanent Redirect)</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7725)}}</td>
-   <td>An HTTP Status Code to Report Legal Obstacles</td>
-   <td>On the standard track</td>
-  </tr>
-  <tr>
-   <td>{{rfc(2397)}}</td>
-   <td>The "data" URL scheme</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(3986)}}</td>
-   <td>Uniform Resource Identifier (URI): Generic Syntax</td>
-   <td>Internet Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(5988)}}</td>
-   <td>Web Linking<br>
-    <em>Defines the {{HTTPHeader("Link")}} header</em></td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td><a href="https://tools.ietf.org/id/draft-thomson-hybi-http-timeout-01.html">Experimental spec</a></td>
-   <td>Hypertext Transfer Protocol (HTTP) Keep-Alive Header</td>
-   <td>Informational (Expired)</td>
-  </tr>
-  <tr>
-   <td><a href="http://httpwg.org/http-extensions/client-hints.html">Draft spec</a></td>
-   <td>HTTP Client Hints</td>
-   <td>IETF Draft</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7578)}}</td>
-   <td>Returning Values from Forms: multipart/form-data</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(6266)}}</td>
-   <td>Use of the Content-Disposition Header Field in the Hypertext Transfer Protocol (HTTP)</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(2183)}}</td>
-   <td>Communicating Presentation Information in Internet Messages: The Content-Disposition Header Field<br>
-    <em>Only a subset of syntax of the {{HTTPHeader("Content-Disposition")}} header can be used in the context of HTTP messages.</em></td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7239)}}</td>
-   <td>Forwarded HTTP Extension</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(6455)}}</td>
-   <td>The WebSocket Protocol</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(5246)}}</td>
-   <td>The Transport Layer Security (TLS) Protocol Version 1.2<br>
-    <em>This specification has been modified by subsequent RFCs, but these modifications have no effect on the HTTP protocol.</em></td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td><a href="https://tlswg.github.io/tls13-spec/)">Draft spec</a></td>
-   <td>The Transport Layer Security (TLS) Protocol Version 1.3<br>
-    <em>Once ready, this protocol will supersede TLS 1.2.</em></td>
-   <td>IETF Draft</td>
-  </tr>
-  <tr>
-   <td>{{rfc(2817)}}</td>
-   <td>Upgrading to TLS Within HTTP/1.1</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7540)}}</td>
-   <td>Hypertext Transfer Protocol Version 2 (HTTP/2)</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7541)}}</td>
-   <td>HPACK: Header Compression for HTTP/2</td>
-   <td>On the standard track</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7838)}}</td>
-   <td>HTTP Alternative Services</td>
-   <td>On the standard track</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7301)}}</td>
-   <td>Transport Layer Security (TLS) Application-Layer Protocol Negotiation Extension<br>
-    <em>Used to negotiate HTTP/2 at the transport to save an extra request/response round trip.</em></td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(6454)}}</td>
-   <td>The Web Origin Concept</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('Fetch', '#cors-protocol', 'CORS')}}</td>
-   <td>Cross-Origin Resource Sharing</td>
-   <td>{{Spec2("Fetch")}}</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7034)}}</td>
-   <td>HTTP Header Field X-Frame-Options</td>
-   <td>Informational</td>
-  </tr>
-  <tr>
-   <td>{{rfc(6797)}}</td>
-   <td>HTTP Strict Transport Security (HSTS)</td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("Upgrade Insecure Requests")}}</td>
-   <td>Upgrade Insecure Requests</td>
-   <td>{{Spec2("Upgrade Insecure Requests")}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("CSP 1.0")}}</td>
-   <td>Content Security Policy 1.0<br>
-    <em>CSP 1.1 and CSP 3.0 doesn't extend the HTTP standard</em></td>
-   <td>{{Spec2("CSP 1.0")}}</td>
-  </tr>
-  <tr>
-   <td><a href="https://msdn.microsoft.com/en-us/library/jj676915(v=vs.85).aspx">Microsoft document</a></td>
-   <td>Specifying legacy document modes*<br>
-    <em>Defines X-UA-Compatible</em></td>
-   <td>Note</td>
-  </tr>
-  <tr>
-   <td>{{rfc(5689)}}</td>
-   <td>HTTP Extensions for Web Distributed Authoring and Versioning (WebDAV)<br>
-    <em>These extensions of the Web, as well as CardDAV and CalDAV, are out-of-scope for HTTP on the Web. Modern APIs for application are defines using the RESTful pattern nowadays.</em></td>
-   <td>Proposed Standard</td>
-  </tr>
-  <tr>
-   <td>{{rfc(2324)}}</td>
-   <td>Hyper Text Coffee Pot Control Protocol (HTCPCP/1.0)</td>
-   <td>April 1st joke spec</td>
-  </tr>
-  <tr>
-   <td>{{rfc(7168)}}</td>
-   <td>The Hyper Text Coffee Pot Control Protocol for Tea Efflux Appliances (HTCPCP-TEA)</td>
-   <td>April 1st joke spec</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML WHATWG")}}</td>
-   <td>HTML<br>
-    <em>Defines extensions of HTTP for Server-Sent Events</em></td>
-   <td>{{Spec2("HTML WHATWG")}}</td>
-  </tr>
-  <tr>
-   <td><a href="https://www.w3.org/2011/tracking-protection/drafts/tracking-dnt.html">Tracking Preference Expression</a></td>
-   <td>DNT header</td>
-   <td>Editor's draft / Candidate recommendation</td>
-  </tr>
-  <tr>
-   <td><a href="http://wicg.github.io/reporting/">Reporting API</a></td>
-   <td><code>Report-To</code> header</td>
-   <td>Draft</td>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
diff --git a/files/es/web/http/resources_and_specifications/index.html b/files/es/web/http/resources_and_specifications/index.html
new file mode 100644
index 0000000000..7c0d67462a
--- /dev/null
+++ b/files/es/web/http/resources_and_specifications/index.html
@@ -0,0 +1,263 @@
+---
+title: Recursos y especificaciones de HTTP
+slug: Web/HTTP/Resources_and_specifications
+translation_of: Web/HTTP/Resources_and_specifications
+original_slug: Web/HTTP/recursos_y_especificaciones
+---
+<div>{{HTTPSidebar}}</div>
+
+<p>HTTP se especificó por primera vez a principios de los 90s. Diseñado con extensibilidad en mente, ha visto numerosas adiciones a lo largo de los años; esto lleva a que su especificación se disemine a través de númerosos documentos (en medio de extensiones experimentales abandonadas). Esta página presenta una lista de los recursos relevantes sobre HTTP:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Title</th>
+   <th scope="col">Status</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{rfc(7230)}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Message Syntax and Routing</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7231)}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Semantics and Content</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7232)}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Conditional Requests</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7233)}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Range Requests</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7234)}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Caching</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(5861)}}</td>
+   <td>HTTP Cache-Control Extensions for Stale Content</td>
+   <td>Informational</td>
+  </tr>
+  <tr>
+   <td>{{rfc(8246)}}</td>
+   <td>HTTP Immutable Responses</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7235)}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Authentication</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(6265)}}</td>
+   <td>HTTP State Management Mechanism<br>
+    <em>Defines Cookies</em></td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td><a href="https://tools.ietf.org/html/draft-ietf-httpbis-cookie-prefixes-00">Draft spec</a></td>
+   <td>Cookie Prefixes</td>
+   <td>IETF Draft</td>
+  </tr>
+  <tr>
+   <td><a href="https://tools.ietf.org/html/draft-ietf-httpbis-cookie-same-site-00">Draft spec</a></td>
+   <td>Same-Site Cookies</td>
+   <td>IETF Draft</td>
+  </tr>
+  <tr>
+   <td><a href="https://tools.ietf.org/html/draft-ietf-httpbis-cookie-alone-01">Draft spec</a></td>
+   <td>Deprecate modification of 'secure' cookies from non-secure origins</td>
+   <td>IETF Draft</td>
+  </tr>
+  <tr>
+   <td>{{rfc(2145)}}</td>
+   <td>Use and Interpretation of HTTP Version Numbers</td>
+   <td>Informational</td>
+  </tr>
+  <tr>
+   <td>{{rfc(6585)}}</td>
+   <td>Additional HTTP Status Codes</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7538)}}</td>
+   <td>The Hypertext Transfer Protocol Status Code 308 (Permanent Redirect)</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7725)}}</td>
+   <td>An HTTP Status Code to Report Legal Obstacles</td>
+   <td>On the standard track</td>
+  </tr>
+  <tr>
+   <td>{{rfc(2397)}}</td>
+   <td>The "data" URL scheme</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(3986)}}</td>
+   <td>Uniform Resource Identifier (URI): Generic Syntax</td>
+   <td>Internet Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(5988)}}</td>
+   <td>Web Linking<br>
+    <em>Defines the {{HTTPHeader("Link")}} header</em></td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td><a href="https://tools.ietf.org/id/draft-thomson-hybi-http-timeout-01.html">Experimental spec</a></td>
+   <td>Hypertext Transfer Protocol (HTTP) Keep-Alive Header</td>
+   <td>Informational (Expired)</td>
+  </tr>
+  <tr>
+   <td><a href="http://httpwg.org/http-extensions/client-hints.html">Draft spec</a></td>
+   <td>HTTP Client Hints</td>
+   <td>IETF Draft</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7578)}}</td>
+   <td>Returning Values from Forms: multipart/form-data</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(6266)}}</td>
+   <td>Use of the Content-Disposition Header Field in the Hypertext Transfer Protocol (HTTP)</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(2183)}}</td>
+   <td>Communicating Presentation Information in Internet Messages: The Content-Disposition Header Field<br>
+    <em>Only a subset of syntax of the {{HTTPHeader("Content-Disposition")}} header can be used in the context of HTTP messages.</em></td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7239)}}</td>
+   <td>Forwarded HTTP Extension</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(6455)}}</td>
+   <td>The WebSocket Protocol</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(5246)}}</td>
+   <td>The Transport Layer Security (TLS) Protocol Version 1.2<br>
+    <em>This specification has been modified by subsequent RFCs, but these modifications have no effect on the HTTP protocol.</em></td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td><a href="https://tlswg.github.io/tls13-spec/)">Draft spec</a></td>
+   <td>The Transport Layer Security (TLS) Protocol Version 1.3<br>
+    <em>Once ready, this protocol will supersede TLS 1.2.</em></td>
+   <td>IETF Draft</td>
+  </tr>
+  <tr>
+   <td>{{rfc(2817)}}</td>
+   <td>Upgrading to TLS Within HTTP/1.1</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7540)}}</td>
+   <td>Hypertext Transfer Protocol Version 2 (HTTP/2)</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7541)}}</td>
+   <td>HPACK: Header Compression for HTTP/2</td>
+   <td>On the standard track</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7838)}}</td>
+   <td>HTTP Alternative Services</td>
+   <td>On the standard track</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7301)}}</td>
+   <td>Transport Layer Security (TLS) Application-Layer Protocol Negotiation Extension<br>
+    <em>Used to negotiate HTTP/2 at the transport to save an extra request/response round trip.</em></td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(6454)}}</td>
+   <td>The Web Origin Concept</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Fetch', '#cors-protocol', 'CORS')}}</td>
+   <td>Cross-Origin Resource Sharing</td>
+   <td>{{Spec2("Fetch")}}</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7034)}}</td>
+   <td>HTTP Header Field X-Frame-Options</td>
+   <td>Informational</td>
+  </tr>
+  <tr>
+   <td>{{rfc(6797)}}</td>
+   <td>HTTP Strict Transport Security (HSTS)</td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("Upgrade Insecure Requests")}}</td>
+   <td>Upgrade Insecure Requests</td>
+   <td>{{Spec2("Upgrade Insecure Requests")}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("CSP 1.0")}}</td>
+   <td>Content Security Policy 1.0<br>
+    <em>CSP 1.1 and CSP 3.0 doesn't extend the HTTP standard</em></td>
+   <td>{{Spec2("CSP 1.0")}}</td>
+  </tr>
+  <tr>
+   <td><a href="https://msdn.microsoft.com/en-us/library/jj676915(v=vs.85).aspx">Microsoft document</a></td>
+   <td>Specifying legacy document modes*<br>
+    <em>Defines X-UA-Compatible</em></td>
+   <td>Note</td>
+  </tr>
+  <tr>
+   <td>{{rfc(5689)}}</td>
+   <td>HTTP Extensions for Web Distributed Authoring and Versioning (WebDAV)<br>
+    <em>These extensions of the Web, as well as CardDAV and CalDAV, are out-of-scope for HTTP on the Web. Modern APIs for application are defines using the RESTful pattern nowadays.</em></td>
+   <td>Proposed Standard</td>
+  </tr>
+  <tr>
+   <td>{{rfc(2324)}}</td>
+   <td>Hyper Text Coffee Pot Control Protocol (HTCPCP/1.0)</td>
+   <td>April 1st joke spec</td>
+  </tr>
+  <tr>
+   <td>{{rfc(7168)}}</td>
+   <td>The Hyper Text Coffee Pot Control Protocol for Tea Efflux Appliances (HTCPCP-TEA)</td>
+   <td>April 1st joke spec</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML WHATWG")}}</td>
+   <td>HTML<br>
+    <em>Defines extensions of HTTP for Server-Sent Events</em></td>
+   <td>{{Spec2("HTML WHATWG")}}</td>
+  </tr>
+  <tr>
+   <td><a href="https://www.w3.org/2011/tracking-protection/drafts/tracking-dnt.html">Tracking Preference Expression</a></td>
+   <td>DNT header</td>
+   <td>Editor's draft / Candidate recommendation</td>
+  </tr>
+  <tr>
+   <td><a href="http://wicg.github.io/reporting/">Reporting API</a></td>
+   <td><code>Report-To</code> header</td>
+   <td>Draft</td>
+  </tr>
+ </tbody>
+</table>
+
+<p> </p>
diff --git a/files/es/web/http/sesión/index.html b/files/es/web/http/sesión/index.html
deleted file mode 100644
index 3d6e2d938b..0000000000
--- a/files/es/web/http/sesión/index.html
+++ /dev/null
@@ -1,158 +0,0 @@
----
-title: Una típica sesión de HTTP
-slug: Web/HTTP/Sesión
-translation_of: Web/HTTP/Session
----
-<div>{{HTTPSidebar}}</div>
-
-<p>En los protocolos basados en el modelo cliente-servidor, como es el caso del HTTP, una sesión consta de tres fases:</p>
-
-<ol>
- <li>El cliente establece una conexión TCP (o la conexión correspondiente si la capa de transporte corresponde a otro protocolo).</li>
- <li>El cliente manda su petición, y espera por la respuesta. </li>
- <li>El servidor procesa la petición, y responde con un código de estado y los datos correspondientes.</li>
-</ol>
-
-<p>A partir del protocolo HTTP/1.1 la conexión, no se cierra al finalizar la tercera fase, y el cliente puede continuar realizando peticiones. Esto significa que la segunda y tercera fase, pueden repetirse cualquier número de veces.</p>
-
-<h2 id="Estableciendo_una_conexión">Estableciendo una conexión</h2>
-
-<p>En un protocolo cliente servidor, es siempre el cliente el que establece la conexión. Iniciar una conexión en HTTP, implica iniciar una conexión en el protocolo correspondiente a la capa de comunicación subyacente, que normalmente es TCP. </p>
-
-<p>En TCP el puerto por defecto, para un servidor HTTP en un computador, es el puerto 80. Se pueden usar otros puertos como el 8000 o el 8080. La URL de la página pedida contiene tanto el nombre del dominio, como el número de puerto, aunque este puede ser omitido, si se trata del puerto 80.  Véase la referencia de <a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web">Identificación de recursos en la Web</a> para más detalles.</p>
-
-<div class="note"><strong>Nota:</strong> El modelo cliente-servidor no permite que el servidor mande datos al cliente sin una petición explicita. Como solución parcial a este problema, los desarrolladores web, usan varias técnicas, como hacer un ping al servidor periódicamente, mediante {{domxref("XMLHTTPRequest")}}, {{domxref("Fetch")}} APIs, o usar la HTML  <a href="/en/WebSockets" title="en/WebSockets">WebSockets API</a> o protocolos similares.</div>
-
-<h2 id="Mandando_una_petición">Mandando una petición</h2>
-
-<p>Una vez la conexión está establecida, el cliente, puede mandar una petición de datos (normalmente es un navegador, u otra cosa, como una 'araña' ( o 'crawler' en inglés), un sistema de indexación automático de páginas web). La  petición de datos de un cliente HTTP, consiste en directivas de texto, separadas mediante CRLF (retorno de carro, y cambio de linea), y se divide en tres partes:</p>
-
-<ol>
- <li>La primera parte, consiste en una linea, que contiene un método, seguido de sus parámetros:
-  <ul>
-   <li>la dirección del documento pedido: por ejemplo su URL completa, sin indicar el protocolo o el nombre del dominio.</li>
-   <li>la versión del protocolo HTTP</li>
-  </ul>
- </li>
- <li>La siguiente parte, está formada por un bloque de líneas consecutivas, que representan las cabeceras de la petición HTTP, y dan información al servidor, sobre que tipo de datos es apropiado (como qué lenguaje usar, o el tipo MIME a usar), u otros datos que modifiquen su comportamiento (como que no envié la respuesta si ya está cacheada). Estas cabeceras HTTP forman un bloque que acaba con una línea en blanco. </li>
- <li>La parte final es un bloque de datos opcional, que puede contener más datos para ser usados por el método POST.</li>
-</ol>
-
-<h3 id="Ejemplo_de_peticiones">Ejemplo de peticiones</h3>
-
-<p>Si queremos una página web, como por ejemplo: <a class="linkification-ext external" href="/" title="Linkification: http://developer.mozilla.org/">http://developer.mozilla.org/</a>, y además le indicamos al servidor que se preferiría la página en Francés, si fuera posible:</p>
-
-<pre>GET / HTTP/1.1
-Host: developer.mozilla.org
-Accept-Language: fr
-
-</pre>
-
-<p>Observe la línea vacía al final, que separa el bloque de datos, del bloque de cabecera. Como no existe el campo <code>Content-Length</code> en la cabecera de HTTP, el bloque de datos está vacío, y ahí está el fin de la cabecera, permitiendo al servidor procesar la petición en el momento que recibe la línea vacía.</p>
-
-<p>Otro ejemplo, en el caso del envío de los datos de un formulario, la trama es:</p>
-
-<pre>POST /contact_form.php HTTP/1.1
-Host: developer.mozilla.org
-Content-Length: 64
-Content-Type: application/x-www-form-urlencoded
-
-name=Juan%20Garcia&amp;request=Envieme%20uno%20de%20sus%20catalogos
-</pre>
-
-<h3 id="Métodos_de_peticiones">Métodos de peticiones</h3>
-
-<p>HTTP define un conjunto de <a href="/en-US/docs/Web/HTTP/Methods">métodos de peticiones</a>  en los que se indican las acciones que se piden realizar al recibir un conjunto de datos. A pesar de que pueden referirse como 'nombres', estos métodos de petición, son denominados a veces como 'verbos' de HTTP.  La peticiones más comunes son  <code>GET</code> y <code>POST</code>:</p>
-
-<ul>
- <li>El método {{HTTPMethod("GET")}} hace una petición de un recurso específico. Las peticiones con <code>GET</code> unicamente hacen peticiones de datos.</li>
- <li>El método {{HTTPMethod("POST")}} envía datos al servidor de manera que este pueda cambiar su estado. Este es el método usado normalmente para enviar los datos de un  <a href="/en-US/docs/Web/Guide/HTML/Forms">formulario HTML</a>.</li>
-</ul>
-
-<h2 id="Estructura_de_la_respuesta_del_servidor">Estructura de la respuesta del servidor</h2>
-
-<p>Después de que el agente de usuario envía su petición, el servidor web lo procesa, y a continuación responde. De forma similar a la petición del servidor, la respuesta del servidor está formada por directivas de texto, separadas por el carácter CRLF, y divida en tres bloques.</p>
-
-<ol>
- <li>La primera línea, es la línea de estado, que consiste en una confirmación del la versión de HTTP utilizado, y seguido por el estado de la petición (y una breve descripción de este, en formato de texto, que pueda ser leído por personas). </li>
- <li>Las líneas siguientes representan cabeceras de HTTP concretas, dando al cliente información sobre los datos enviado( por ejemplo, sy tipo, su tamaño, algoritmos de compresión utilizados, y sugerencias para el cacheo). Al igual que las cabeceras HTTP de la petición de un cliente, las cabeceras HTTP del servidor, finalizan con una línea vacía.</li>
- <li>El bloque final, es el bloque que puede contener opcionalmente los datos.</li>
-</ol>
-
-<h3 id="Ejemplos_de_respuestas">Ejemplos de respuestas</h3>
-
-<p>La respuesta correcta de una página web, es como sigue: </p>
-
-<pre>HTTP/1.1 200 OK
-Date: Sat, 09 Oct 2010 14:28:02 GMT
-Server: Apache
-Last-Modified: Tue, 01 Dec 2009 20:18:22 GMT
-ETag: "51142bc1-7449-479b075b2891b"
-Accept-Ranges: bytes
-Content-Length: 29769
-Content-Type: text/html
-
-&lt;!DOCTYPE html... <em><strong>(aquí estarían los 29769 bytes de la página web pedida)</strong></em>
-
-</pre>
-
-<p>La respuesta para la petición de datos que han sido movidos permanentemente, sería: </p>
-
-<pre>HTTP/1.1 301 Moved Permanently
-Server: Apache/2.2.3 (Red Hat)
-Content-Type: text/html; charset=iso-8859-1
-Date: Sat, 09 Oct 2010 14:30:24 GMT
-Location: <a class="linkification-ext" href="../../../../" title="Linkification: https://developer.mozilla.org/">https://developer.mozilla.org/</a> <strong><em>(este es el nuevo enlace a los datos; se espera que el agente de usuario lo pida a continuación)</em></strong>
-Keep-Alive: timeout=15, max=98
-Accept-Ranges: bytes
-Via: Moz-Cache-zlb05
-Connection: Keep-Alive
-X-Cache-Info: caching
-X-Cache-Info: caching
-Content-Length: 325 <em><strong>(se da una página por defecto para mostrar en el caso de que el agente de usuario no sea capaz de seguir el enlace)</strong></em>
-
-&lt;!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN"&gt;
-&lt;html&gt;&lt;head&gt;
-&lt;title&gt;301 Movido permanentemente&lt;/title&gt;
-&lt;/head&gt;&lt;body&gt;
-&lt;h1&gt;Movido de forma permanente&lt;/h1&gt;
-&lt;p&gt;El documento ha sido movido &lt;a href="<a class="linkification-ext" href="../../../../" title="Linkification: https://developer.mozilla.org/">https://developer.mozilla.org/</a>"&gt;aquí&lt;/a&gt;.&lt;/p&gt;
-&lt;hr&gt;
-&lt;address&gt;Apache/2.2.3 (Red Hat) Servidor en: developer.mozilla.org Port 80&lt;/address&gt;
-&lt;/body&gt;&lt;/html&gt;
-
-</pre>
-
-<p>Una notificación de que los datos pedidos no existen:</p>
-
-<pre>HTTP/1.1 404 Not Found
-Date: Sat, 09 Oct 2010 14:33:02 GMT
-Server: Apache
-Last-Modified: Tue, 01 May 2007 14:24:39 GMT
-ETag: "499fd34e-29ec-42f695ca96761;48fe7523cfcc1"
-Accept-Ranges: bytes
-Content-Length: 10732
-Content-Type: text/html
-
-&lt;!DOCTYPE html... <strong><em>(contiene una página personalizada de ayuda al usuario para que pueda encontrar los datos que busca)</em></strong>
-
-</pre>
-
-<h3 id="Códigos_de_estado_de_las_respuestas">Códigos de estado de las respuestas</h3>
-
-<p>Los <a href="/en-US/docs/Web/HTTP/Status">códigos de estado de las respuestas</a> indican si una petición HTTP ha sido finalizada correctamente. Las respuestas se agrupan en cinco clases: respuestas informativas, respuestas de finalización correcta, redirecciones, errores del cliente y errores del servidor.</p>
-
-<ul>
- <li>{{HTTPStatus(200)}}: OK. La petición ha sido procesada correctamente</li>
- <li>{{HTTPStatus(301)}}: Datos movidos permanentemente. Este código de respuesta indica que la URI de los datos pedidos ha cambiado.</li>
- <li>{{HTTPStatus(404)}}: Datos no encontrados. El servidor no puede localizar los datos pedidos. </li>
-</ul>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web">Identificación de recursos en la Web</a></li>
- <li><a href="/en-US/docs/Web/HTTP/Headers">Cabeceras HTTP</a></li>
- <li><a href="/en-US/docs/Web/HTTP/Methods">Métodos de petición HTTP</a></li>
- <li><a href="/en-US/docs/Web/HTTP/Status">Códigos de estados de respuesta HTTP</a></li>
-</ul>
diff --git a/files/es/web/http/session/index.html b/files/es/web/http/session/index.html
new file mode 100644
index 0000000000..848f044b21
--- /dev/null
+++ b/files/es/web/http/session/index.html
@@ -0,0 +1,159 @@
+---
+title: Una típica sesión de HTTP
+slug: Web/HTTP/Session
+translation_of: Web/HTTP/Session
+original_slug: Web/HTTP/Sesión
+---
+<div>{{HTTPSidebar}}</div>
+
+<p>En los protocolos basados en el modelo cliente-servidor, como es el caso del HTTP, una sesión consta de tres fases:</p>
+
+<ol>
+ <li>El cliente establece una conexión TCP (o la conexión correspondiente si la capa de transporte corresponde a otro protocolo).</li>
+ <li>El cliente manda su petición, y espera por la respuesta. </li>
+ <li>El servidor procesa la petición, y responde con un código de estado y los datos correspondientes.</li>
+</ol>
+
+<p>A partir del protocolo HTTP/1.1 la conexión, no se cierra al finalizar la tercera fase, y el cliente puede continuar realizando peticiones. Esto significa que la segunda y tercera fase, pueden repetirse cualquier número de veces.</p>
+
+<h2 id="Estableciendo_una_conexión">Estableciendo una conexión</h2>
+
+<p>En un protocolo cliente servidor, es siempre el cliente el que establece la conexión. Iniciar una conexión en HTTP, implica iniciar una conexión en el protocolo correspondiente a la capa de comunicación subyacente, que normalmente es TCP. </p>
+
+<p>En TCP el puerto por defecto, para un servidor HTTP en un computador, es el puerto 80. Se pueden usar otros puertos como el 8000 o el 8080. La URL de la página pedida contiene tanto el nombre del dominio, como el número de puerto, aunque este puede ser omitido, si se trata del puerto 80.  Véase la referencia de <a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web">Identificación de recursos en la Web</a> para más detalles.</p>
+
+<div class="note"><strong>Nota:</strong> El modelo cliente-servidor no permite que el servidor mande datos al cliente sin una petición explicita. Como solución parcial a este problema, los desarrolladores web, usan varias técnicas, como hacer un ping al servidor periódicamente, mediante {{domxref("XMLHTTPRequest")}}, {{domxref("Fetch")}} APIs, o usar la HTML  <a href="/en/WebSockets" title="en/WebSockets">WebSockets API</a> o protocolos similares.</div>
+
+<h2 id="Mandando_una_petición">Mandando una petición</h2>
+
+<p>Una vez la conexión está establecida, el cliente, puede mandar una petición de datos (normalmente es un navegador, u otra cosa, como una 'araña' ( o 'crawler' en inglés), un sistema de indexación automático de páginas web). La  petición de datos de un cliente HTTP, consiste en directivas de texto, separadas mediante CRLF (retorno de carro, y cambio de linea), y se divide en tres partes:</p>
+
+<ol>
+ <li>La primera parte, consiste en una linea, que contiene un método, seguido de sus parámetros:
+  <ul>
+   <li>la dirección del documento pedido: por ejemplo su URL completa, sin indicar el protocolo o el nombre del dominio.</li>
+   <li>la versión del protocolo HTTP</li>
+  </ul>
+ </li>
+ <li>La siguiente parte, está formada por un bloque de líneas consecutivas, que representan las cabeceras de la petición HTTP, y dan información al servidor, sobre que tipo de datos es apropiado (como qué lenguaje usar, o el tipo MIME a usar), u otros datos que modifiquen su comportamiento (como que no envié la respuesta si ya está cacheada). Estas cabeceras HTTP forman un bloque que acaba con una línea en blanco. </li>
+ <li>La parte final es un bloque de datos opcional, que puede contener más datos para ser usados por el método POST.</li>
+</ol>
+
+<h3 id="Ejemplo_de_peticiones">Ejemplo de peticiones</h3>
+
+<p>Si queremos una página web, como por ejemplo: <a class="linkification-ext external" href="/" title="Linkification: http://developer.mozilla.org/">http://developer.mozilla.org/</a>, y además le indicamos al servidor que se preferiría la página en Francés, si fuera posible:</p>
+
+<pre>GET / HTTP/1.1
+Host: developer.mozilla.org
+Accept-Language: fr
+
+</pre>
+
+<p>Observe la línea vacía al final, que separa el bloque de datos, del bloque de cabecera. Como no existe el campo <code>Content-Length</code> en la cabecera de HTTP, el bloque de datos está vacío, y ahí está el fin de la cabecera, permitiendo al servidor procesar la petición en el momento que recibe la línea vacía.</p>
+
+<p>Otro ejemplo, en el caso del envío de los datos de un formulario, la trama es:</p>
+
+<pre>POST /contact_form.php HTTP/1.1
+Host: developer.mozilla.org
+Content-Length: 64
+Content-Type: application/x-www-form-urlencoded
+
+name=Juan%20Garcia&amp;request=Envieme%20uno%20de%20sus%20catalogos
+</pre>
+
+<h3 id="Métodos_de_peticiones">Métodos de peticiones</h3>
+
+<p>HTTP define un conjunto de <a href="/en-US/docs/Web/HTTP/Methods">métodos de peticiones</a>  en los que se indican las acciones que se piden realizar al recibir un conjunto de datos. A pesar de que pueden referirse como 'nombres', estos métodos de petición, son denominados a veces como 'verbos' de HTTP.  La peticiones más comunes son  <code>GET</code> y <code>POST</code>:</p>
+
+<ul>
+ <li>El método {{HTTPMethod("GET")}} hace una petición de un recurso específico. Las peticiones con <code>GET</code> unicamente hacen peticiones de datos.</li>
+ <li>El método {{HTTPMethod("POST")}} envía datos al servidor de manera que este pueda cambiar su estado. Este es el método usado normalmente para enviar los datos de un  <a href="/en-US/docs/Web/Guide/HTML/Forms">formulario HTML</a>.</li>
+</ul>
+
+<h2 id="Estructura_de_la_respuesta_del_servidor">Estructura de la respuesta del servidor</h2>
+
+<p>Después de que el agente de usuario envía su petición, el servidor web lo procesa, y a continuación responde. De forma similar a la petición del servidor, la respuesta del servidor está formada por directivas de texto, separadas por el carácter CRLF, y divida en tres bloques.</p>
+
+<ol>
+ <li>La primera línea, es la línea de estado, que consiste en una confirmación del la versión de HTTP utilizado, y seguido por el estado de la petición (y una breve descripción de este, en formato de texto, que pueda ser leído por personas). </li>
+ <li>Las líneas siguientes representan cabeceras de HTTP concretas, dando al cliente información sobre los datos enviado( por ejemplo, sy tipo, su tamaño, algoritmos de compresión utilizados, y sugerencias para el cacheo). Al igual que las cabeceras HTTP de la petición de un cliente, las cabeceras HTTP del servidor, finalizan con una línea vacía.</li>
+ <li>El bloque final, es el bloque que puede contener opcionalmente los datos.</li>
+</ol>
+
+<h3 id="Ejemplos_de_respuestas">Ejemplos de respuestas</h3>
+
+<p>La respuesta correcta de una página web, es como sigue: </p>
+
+<pre>HTTP/1.1 200 OK
+Date: Sat, 09 Oct 2010 14:28:02 GMT
+Server: Apache
+Last-Modified: Tue, 01 Dec 2009 20:18:22 GMT
+ETag: "51142bc1-7449-479b075b2891b"
+Accept-Ranges: bytes
+Content-Length: 29769
+Content-Type: text/html
+
+&lt;!DOCTYPE html... <em><strong>(aquí estarían los 29769 bytes de la página web pedida)</strong></em>
+
+</pre>
+
+<p>La respuesta para la petición de datos que han sido movidos permanentemente, sería: </p>
+
+<pre>HTTP/1.1 301 Moved Permanently
+Server: Apache/2.2.3 (Red Hat)
+Content-Type: text/html; charset=iso-8859-1
+Date: Sat, 09 Oct 2010 14:30:24 GMT
+Location: <a class="linkification-ext" href="../../../../" title="Linkification: https://developer.mozilla.org/">https://developer.mozilla.org/</a> <strong><em>(este es el nuevo enlace a los datos; se espera que el agente de usuario lo pida a continuación)</em></strong>
+Keep-Alive: timeout=15, max=98
+Accept-Ranges: bytes
+Via: Moz-Cache-zlb05
+Connection: Keep-Alive
+X-Cache-Info: caching
+X-Cache-Info: caching
+Content-Length: 325 <em><strong>(se da una página por defecto para mostrar en el caso de que el agente de usuario no sea capaz de seguir el enlace)</strong></em>
+
+&lt;!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN"&gt;
+&lt;html&gt;&lt;head&gt;
+&lt;title&gt;301 Movido permanentemente&lt;/title&gt;
+&lt;/head&gt;&lt;body&gt;
+&lt;h1&gt;Movido de forma permanente&lt;/h1&gt;
+&lt;p&gt;El documento ha sido movido &lt;a href="<a class="linkification-ext" href="../../../../" title="Linkification: https://developer.mozilla.org/">https://developer.mozilla.org/</a>"&gt;aquí&lt;/a&gt;.&lt;/p&gt;
+&lt;hr&gt;
+&lt;address&gt;Apache/2.2.3 (Red Hat) Servidor en: developer.mozilla.org Port 80&lt;/address&gt;
+&lt;/body&gt;&lt;/html&gt;
+
+</pre>
+
+<p>Una notificación de que los datos pedidos no existen:</p>
+
+<pre>HTTP/1.1 404 Not Found
+Date: Sat, 09 Oct 2010 14:33:02 GMT
+Server: Apache
+Last-Modified: Tue, 01 May 2007 14:24:39 GMT
+ETag: "499fd34e-29ec-42f695ca96761;48fe7523cfcc1"
+Accept-Ranges: bytes
+Content-Length: 10732
+Content-Type: text/html
+
+&lt;!DOCTYPE html... <strong><em>(contiene una página personalizada de ayuda al usuario para que pueda encontrar los datos que busca)</em></strong>
+
+</pre>
+
+<h3 id="Códigos_de_estado_de_las_respuestas">Códigos de estado de las respuestas</h3>
+
+<p>Los <a href="/en-US/docs/Web/HTTP/Status">códigos de estado de las respuestas</a> indican si una petición HTTP ha sido finalizada correctamente. Las respuestas se agrupan en cinco clases: respuestas informativas, respuestas de finalización correcta, redirecciones, errores del cliente y errores del servidor.</p>
+
+<ul>
+ <li>{{HTTPStatus(200)}}: OK. La petición ha sido procesada correctamente</li>
+ <li>{{HTTPStatus(301)}}: Datos movidos permanentemente. Este código de respuesta indica que la URI de los datos pedidos ha cambiado.</li>
+ <li>{{HTTPStatus(404)}}: Datos no encontrados. El servidor no puede localizar los datos pedidos. </li>
+</ul>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/HTTP/Basics_of_HTTP/Identifying_resources_on_the_Web">Identificación de recursos en la Web</a></li>
+ <li><a href="/en-US/docs/Web/HTTP/Headers">Cabeceras HTTP</a></li>
+ <li><a href="/en-US/docs/Web/HTTP/Methods">Métodos de petición HTTP</a></li>
+ <li><a href="/en-US/docs/Web/HTTP/Status">Códigos de estados de respuesta HTTP</a></li>
+</ul>
diff --git a/files/es/web/http/status/413/index.html b/files/es/web/http/status/413/index.html
new file mode 100644
index 0000000000..40e6b11b99
--- /dev/null
+++ b/files/es/web/http/status/413/index.html
@@ -0,0 +1,35 @@
+---
+title: 413 Payload Too Large
+slug: Web/HTTP/Status/413
+translation_of: Web/HTTP/Status/413
+original_slug: Web/HTTP/Status/8080
+---
+<div>{{HTTPSidebar}}</div>
+
+<p>The HTTP <code><strong>413 Payload Too Large</strong></code> response status code indicates that the request entity is larger than limits defined by server; the server might close the connection or return a {{HTTPHeader("Retry-After")}} header field.</p>
+
+<h2 id="Status">Status</h2>
+
+<pre class="syntaxbox">413 Payload Too Large</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Title</th>
+  </tr>
+  <tr>
+   <td>{{RFC("7231", "413 Payload Too Large" , "6.5.11")}}</td>
+   <td>Hypertext Transfer Protocol (HTTP/1.1): Semantics and Content</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{HTTPHeader("Connection")}}</li>
+ <li>{{HTTPHeader("Retry-After")}}</li>
+</ul>
diff --git a/files/es/web/http/status/8080/index.html b/files/es/web/http/status/8080/index.html
deleted file mode 100644
index 10ad4ac7b2..0000000000
--- a/files/es/web/http/status/8080/index.html
+++ /dev/null
@@ -1,34 +0,0 @@
----
-title: 413 Payload Too Large
-slug: Web/HTTP/Status/8080
-translation_of: Web/HTTP/Status/413
----
-<div>{{HTTPSidebar}}</div>
-
-<p>The HTTP <code><strong>413 Payload Too Large</strong></code> response status code indicates that the request entity is larger than limits defined by server; the server might close the connection or return a {{HTTPHeader("Retry-After")}} header field.</p>
-
-<h2 id="Status">Status</h2>
-
-<pre class="syntaxbox">413 Payload Too Large</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Title</th>
-  </tr>
-  <tr>
-   <td>{{RFC("7231", "413 Payload Too Large" , "6.5.11")}}</td>
-   <td>Hypertext Transfer Protocol (HTTP/1.1): Semantics and Content</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{HTTPHeader("Connection")}}</li>
- <li>{{HTTPHeader("Retry-After")}}</li>
-</ul>
diff --git a/files/es/web/javascript/a_re-introduction_to_javascript/index.html b/files/es/web/javascript/a_re-introduction_to_javascript/index.html
new file mode 100644
index 0000000000..b4bd24ce06
--- /dev/null
+++ b/files/es/web/javascript/a_re-introduction_to_javascript/index.html
@@ -0,0 +1,961 @@
+---
+title: Una reintroducción a JavaScript (Tutorial de JS)
+slug: Web/JavaScript/A_re-introduction_to_JavaScript
+tags:
+  - Aprender
+  - Guía
+  - Intermedio
+  - Intro
+  - JavaScript
+  - Tutorial
+  - introducción
+translation_of: Web/JavaScript/A_re-introduction_to_JavaScript
+original_slug: Web/JavaScript/Una_re-introducción_a_JavaScript
+---
+<div>{{jsSidebar}}</div>
+
+
+<p>¿Por qué una reintroducción? Porque {{Glossary("JavaScript")}} es conocido por ser <a href="http://crockford.com/javascript/javascript.html">el lenguaje de programación más incomprendido</a>. A menudo se le ridiculiza como un juguete, pero debajo de esa capa de engañosa simplicidad, aguardan poderosas características del lenguaje. Ahora un increíble número de aplicaciones de alto perfil utilizan JavaScript, lo cual demuestra que un conocimiento más profundo de esta tecnología es una habilidad importante para cualquier desarrollador web o móvil.</p>
+
+<p>Es útil comenzar con una descripción general de la historia del lenguaje. JavaScript fue creado en 1995 por Brendan Eich mientras era ingeniero en Netscape. JavaScript se lanzó por primera vez con Netscape 2 a principios de 1996. Originalmente se iba a llamar LiveScript, pero se le cambió el nombre en una desafortunada decisión de marketing que intentó capitalizar la popularidad del lenguaje Java de Sun Microsystem, a pesar de que los dos tienen muy poco en común. Esto ha sido una fuente de confusión desde entonces.</p>
+
+<p>Varios meses después, Microsoft lanzó JScript con Internet Explorer 3. Era un JavaScript prácticamente compatible. Varios meses después de eso, Netscape envió JavaScript a <a class="external" href="http://www.ecma-international.org/">Ecma International</a>, una organización europea de estándares, que resultó en la primera edición del estándar {{Glossary("ECMAScript")}} ese año. El estándar recibió una actualización significativa como <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript edición 3</a> en 1999, y se ha mantenido bastante estable desde entonces. La cuarta edición fue abandonada debido a diferencias políticas sobre la complejidad del lenguaje. Muchas partes de la cuarta edición formaron la base para la edición 5 de ECMAScript, publicada en diciembre de 2009, y para la sexta edición principal del estándar, publicada en junio de 2015.</p>
+
+<div class="note">
+<p>Debido a que es más familiar, nos referiremos a ECMAScript como "JavaScript" de ahora en adelante.</p>
+</div>
+
+<p>A diferencia de la mayoría de los lenguajes de programación, el lenguaje JavaScript no tiene un concepto de entrada o salida. Está diseñado para ejecutarse como un lenguaje de <code>scripting</code> en un entorno hospedado, y depende del entorno para proporcionar los mecanismos para comunicarse con el mundo exterior. El entorno de alojamiento más común es el navegador, pero también se pueden encontrar intérpretes de JavaScript en una gran lista de otros lugares, incluidos Adobe Acrobat, Adobe Photoshop, imágenes SVG, el motor de widgets de Yahoo, entornos de lado del servidor como <a href="http://nodejs.org/">Node.js</a>, bases de datos NoSQL como <a href="http://couchdb.apache.org/">Apache CouchDB</a> de código abierto, computadoras integradas, entornos de escritorio completos como <a href="http://www.gnome.org/">GNOME</a> (una de las IGU —<em>Interfaz Gráfica de Usuario</em>— más populares para sistemas operativos GNU/Linux), y otros.</p>
+
+<h2 id="Información_general">Información general</h2>
+
+<p>JavaScript es un lenguaje dinámico múltiparadigma con tipos y operadores, objetos estándar integrados y métodos. Su sintaxis se basa en los lenguajes Java y C — muchas estructuras de esos lenguajes también se aplican a JavaScript. JavaScript admite la programación orientada a objetos con prototipos de objetos, en lugar de clases (consulta más información sobre {{jsxref("Inheritance_and_the_prototype_chain", "herencia prototípica")}} y ES2015 {{jsxref("Reference/Classes", "clases")}}. JavaScript también admite la programación funcional — debido a que son objetos, las funciones se pueden almacenar en variables y pasarse como cualquier otro objeto.</p>
+
+<p>Comencemos observando los componentes básicos de cualquier lenguaje: los tipos. Los programas JavaScript manipulan valores, y todos esos valores pertenecen a un tipo. Los tipos de JavaScript son:</p>
+
+<ul>
+ <li>{{jsxref("Number", "Números")}}</li>
+ <li>{{jsxref("String", "Cadenas de texto (Strings)")}}</li>
+ <li>{{jsxref("Boolean", "Booleanos")}}</li>
+ <li>{{jsxref("Function", "Funciones")}}</li>
+ <li>{{jsxref("Object", "Objetos")}}</li>
+ <li>{{jsxref("Symbol", "Símbolos")}} (nuevo en ES2015)</li>
+</ul>
+
+<p>... oh, y {{jsxref("undefined")}} y {{jsxref("null")}}, que son ... ligeramente extraños. Y {{jsxref("Array")}}, que es un tipo de objeto especial. Y {{jsxref("Date", "Fechas (Date)")}} y {{jsxref("RegExp", "Expresiones regulares (RegExp)")}}, que son objetos que obtienes de forma gratuita. Y para ser técnicamente precisos, las funciones son solo un tipo especial de objeto. Por lo tanto, el diagrama de tipos se parece más a este:</p>
+
+<ul>
+ <li>{{jsxref("Number", "Números")}}</li>
+ <li>{{jsxref("String", "Cadenas de texto (Strings)")}}</li>
+ <li>{{jsxref("Boolean", "Booleanos")}}</li>
+ <li>{{jsxref("Symbol", "Símbolos")}} (nuevo en ES2015)</li>
+ <li>{{jsxref("Object", "Objetos")}}
+  <ul>
+   <li>{{jsxref("Function", "Funciones")}}</li>
+   <li>{{jsxref("Array")}}</li>
+   <li>{{jsxref("Date")}}</li>
+   <li>{{jsxref("RegExp")}}</li>
+  </ul>
+ </li>
+ <li>{{jsxref("null")}}</li>
+ <li>{{jsxref("undefined")}}</li>
+</ul>
+
+<p>Y también hay algunos tipos {{jsxref("Error")}} integrados. Sin embargo, las cosas son mucho más fáciles si nos atenemos al primer diagrama, por lo que discutiremos los tipos enumerados allí por ahora.</p>
+
+<h2 id="Números">Números</h2>
+
+<p>Los números en JavaScript son "valores IEEE 754 de formato de 64 bits de doble precisión", de acuerdo con las especificaciones. <strong><em>No existen números enteros</em></strong> en JavaScript (excepto {{jsxref("BigInt")}}), por lo que debes tener un poco de cuidado. Ve este ejemplo:</p>
+
+<pre class="syntaxbox notranslate">console.log(3 / 2);             // 1.5, <em>not</em> 1
+console.log(Math.floor(3 / 2)); // 1</pre>
+
+<p>Entonces, un <em>entero aparente</em> de hecho <em>implícitamente es un <code>float</code></em>.</p>
+
+<p>Además, ten cuidado con cosas como:</p>
+
+<pre class="brush: js notranslate">0.1 + 0.2 == 0.30000000000000004;
+</pre>
+
+<p>En la práctica, los valores enteros se tratan como enteros de 32 bits, y algunas implementaciones incluso los almacenan de esa manera hasta que se les pide que realicen una instrucción que sea válida en un Número pero no en un entero de 32 bits. Esto puede ser importante para operaciones bit a bit.</p>
+
+<p>Se admiten los {{jsxref("Operators", "operadores", "#Operadores_aritméticos")}} estándar, incluidas la aritmética de suma, resta, módulo (o resto), etc. También hay un objeto incorporado que no mencionamos anteriormente llamado {{jsxref("Math")}} que proporciona funciones matemáticas avanzadas y constantes:</p>
+
+<pre class="brush: js notranslate">Math.sin(3.5);
+var circumference = 2 * Math.PI * r;
+</pre>
+
+<p>Puedes convertir una cadena en un número entero usando la función {{jsxref("Objetos_Globales/parseInt", "parseInt()")}} incorporada. Esta toma la base para la conversión como un segundo argumento opcional, que siempre debes proporcionar:</p>
+
+<pre class="brush: js notranslate">parseInt('123', 10); // 123
+parseInt('010', 10); // 10
+</pre>
+
+<p>En los navegadores más antiguos, se supone que las cadenas que comienzan con un "0" están en octal (raíz 8), pero este no ha sido el caso desde 2013 más o menos. A menos que estés seguro de tu formato de cadena, puedes obtener resultados sorprendentes en esos navegadores más antiguos:</p>
+
+<pre class="brush: js notranslate">parseInt('010');  //  8
+parseInt('0x10'); // 16
+</pre>
+
+<p>Aquí, vemos que la función {{jsxref("Objetos_Globales/parseInt", "parseInt()")}} trata la primera cadena como octal debido al 0 inicial, y la segunda cadena como hexadecimal debido al "0x" inicial. La <em>notación hexadecimal todavía está en su lugar</em>; solo se ha eliminado el octal.</p>
+
+<p>Si deseas convertir un número binario en un entero, simplemente cambia la base:</p>
+
+<pre class="brush: js notranslate">parseInt('11', 2); // 3
+</pre>
+
+<p>De manera similar, puedes analizar números de coma flotante utilizando la función incorporada {{jsxref("Objetos_Globales/parseFloat", "parseFloat()")}}. A diferencia de su primo {{jsxref("Objetos_Globales/parseInt", "parseInt()")}}, <code>parseFloat()</code> siempre usa base 10.</p>
+
+<p>También puedes utilizar el operador <code>+</code> unario para convertir valores en números:</p>
+
+<pre class="brush: js notranslate">+ '42';   // 42
++ '010';  // 10
++ '0x10'; // 16
+</pre>
+
+<p>Se devuelve un valor especial llamado {{jsxref("NaN")}} (abreviatura de "Not a Number" o "No es un número") si la cadena no es numérica:</p>
+
+<pre class="brush: js notranslate">parseInt('hello', 10); // NaN
+</pre>
+
+<p><code>NaN</code> es tóxico: si lo proporcionas como operando para cualquier operación matemática, el resultado también será <code>NaN</code>:</p>
+
+<pre class="brush: js notranslate">NaN + 5; // NaN
+</pre>
+
+<p>Puedes probar si un valor es <code>NaN</code> utilizando la función incorporada {{jsxref("Objetos_Globales/isNaN", "isNaN()")}}:</p>
+
+<pre class="brush: js notranslate">isNaN(NaN); // true
+</pre>
+
+<p>JavaScript también tiene los valores especiales {{jsxref("Infinity")}} e <code>-Infinity</code>:</p>
+
+<pre class="brush: js notranslate"> 1 / 0; //  Infinity
+-1 / 0; // -Infinity
+</pre>
+
+<p>Puedes probar los valores <code>Infinity</code>, <code>-Infinity</code> y <code>NaN</code> utilizando la función integrada {{jsxref("Objetos_Globales/isFinite", "isFinite()")}}:</p>
+
+<pre class="brush: js notranslate">isFinite(1 / 0); // false
+isFinite(-Infinity); // false
+isFinite(NaN); // false
+</pre>
+
+<div class="note">Las funciones {{jsxref("Objetos_Globales/parseInt", "parseInt()")}} y {{jsxref("Objetos_Globales/parseFloat", "parseFloat()")}} analizan una cadena hasta que alcancen un caracter que no es válido para el formato de número especificado, luego devuelve el número analizado hasta ese punto. Sin embargo, el operador "+" simplemente convierte la cadena a <code>NaN</code> si contiene un caracter no válido. Intenta analizar la cadena "10.2abc" con cada método tú mismo en la consola y comprenderás mejor las diferencias.</div>
+
+<h2 id="Strings">Strings)</h2>
+
+<p>Las cadenas en JavaScript son secuencias de <a href="/es/docs/Web/JavaScript/Guide/Values,_variables,_and_literals#Unicode">caracteres Unicode</a>. Esta debería ser una buena noticia para cualquiera que haya tenido que lidiar con la internacionalización. Exactamente, son secuencias de unidades de código UTF-16; cada unidad de código está representada por un número de 16 bits. Cada caracter Unicode está representado por 1 o 2 unidades de código.</p>
+
+<p>Si deseas representar un solo caracter, simplemente usa una cadena que consta de ese único caracter.</p>
+
+<p>Para encontrar la longitud de una cadena (en unidades de código), accede a su propiedad {{jsxref("Objetos_Globales/String/length", "lenght")}}:</p>
+
+<pre class="brush: js notranslate">'hello'.length; // 5
+</pre>
+
+<p>¡Aquí está nuestra primer pincelada con objetos JavaScript! ¿Mencionamos que también puedes usar cadenas como {{jsxref("Object", "objectos", "", 1)}}? También tienen {{jsxref("String", "métodos", "#Métodos", 1)}} que te permiten manipular la cadena y acceder a información sobre la cadena:</p>
+
+<pre class="brush: js notranslate">'hello'.charAt(0); // "h"
+'hello, world'.replace('world', 'mars'); // "hello, mars"
+'hello'.toUpperCase(); // "HELLO"
+</pre>
+
+<h2 id="Otros_tipos">Otros tipos</h2>
+
+<p>JavaScript distingue entre {{jsxref("null")}}, que es un valor que indica un no valor deliberado (y solo se puede acceder a él mediante la palabra clave <code>null</code>), y {{jsxref("undefined")}}, que es un valor de tipo <code>undefined</code> que indica una variable no iniciada es decir, que aún no se le ha asignado un valor. Hablaremos de variables más adelante, pero en JavaScript es posible declarar una variable sin asignarle un valor. Si hace esto, el tipo de la variable es <code>undefined</code>. <code>undefined</code> en realidad es una constante.</p>
+
+<p>JavaScript tiene un tipo booleano, con valores posibles <code>true</code> y <code>false</code> (ambos son palabras clave). Cualquier valor se puede convertir a booleano de acuerdo con las siguientes reglas:</p>
+
+<ol>
+ <li><code>false</code>, <code>0</code>, cadenas vacías (<code>""</code>), <code>NaN</code>, <code>null</code>, y <code>undefined</code> todos se vuelven <code>false.</code></li>
+ <li>Todos los demás valores se vuelven <code>true.</code></li>
+</ol>
+
+<p>Puedes realizar esta conversión explícitamente utilizando la función <code>Boolean()</code>:</p>
+
+<pre class="brush: js notranslate">Boolean('');  // false
+Boolean(234); // true
+</pre>
+
+<p>Sin embargo, esto rara vez es necesario, ya que JavaScript realizará silenciosamente esta conversión cuando espera un booleano, como en una declaración <code>if</code> (ve más adelante). Por esta razón, a veces hablamos simplemente de "valores verdaderos" y "valores falsos", es decir, valores que se convierten en <code>true</code> y <code>false</code>, respectivamente, cuando se convierten en booleanos. Alternativamente, estos valores se pueden llamar "veracidad" y "falsedad", respectivamente.</p>
+
+<p>Operaciones booleanas como <code>&amp;&amp;</code> (<em>and</em> lógico), <code>||</code> (<em>or</em> lógico) y <code>!</code> (<em>not</em> lógico) son compatibles; ve más adelante.</p>
+
+<h2 id="Variables">Variables</h2>
+
+<p>Las nuevas variables en JavaScript se declaran utilizando una de tres palabras clave: {{jsxref("Sentencias/let", "let")}}, {{jsxref("Sentencias/const", "const")}} o {{jsxref("Sentencias/var", "var")}}.<br>
+ <br>
+ <strong><code>let</code></strong> te permite declarar variables a nivel de bloque. La variable declarada está disponible en el <em>bloque</em> en el que está incluida.</p>
+
+<pre class="brush: js notranslate">let a;
+let name = 'Simon';
+</pre>
+
+<p>El siguiente es un ejemplo de alcance con una variable declarada con <code><strong>let</strong></code>:</p>
+
+<pre class="brush: js notranslate">// myLetVariable *no* es visible aquí
+
+for (let myLetVariable = 0; myLetVariable &lt; 5; myLetVariable++) {
+  // myLetVariable solo es visible aquí
+}
+
+// myLetVariable *no* es visible aquí
+
+</pre>
+
+<p><code><strong>const</strong></code> te permite declarar variables cuyos valores pretendes nunca cambiar. La variable está disponible en el <em>bloque</em> en el que se declara.</p>
+
+<pre class="brush: js notranslate">const Pi = 3.14; // establece la variable Pi
+Pi = 1; // arrojará un error porque no puede cambiar una variable constante.</pre>
+
+<p><br>
+ <code><strong>var</strong></code> es la palabra clave declarativa más común. No tiene las restricciones que tienen las otras dos palabras clave. Esto se debe a que tradicionalmente era la única forma de declarar una variable en JavaScript. Una variable declarada con la palabra clave <strong><code>var</code></strong> está disponible en la <em>función</em> en la que se declara.</p>
+
+<pre class="brush: js notranslate">var a;
+var name = 'Simon';</pre>
+
+<p>Un ejemplo de ámbito con una variable declarada con <strong><code>var</code>:</strong></p>
+
+<pre class="brush: js notranslate">// myVarVariable *es* visible aquí
+
+for (var myVarVariable = 0; myVarVariable &lt; 5; myVarVariable++) {
+  // myVarVariable es visible para toda la función
+}
+
+// myVarVariable *es* visible aquí
+</pre>
+
+<p>Si declaras una variable sin asignarle ningún valor, su tipo es <code>undefined</code>.</p>
+
+<p>Una diferencia importante entre JavaScript y otros lenguajes como Java es que en JavaScript, los bloques no tienen alcance; solo las funciones tienen alcance. Entonces, si una variable se define usando <code>var</code> en una declaración compuesta (por ejemplo, dentro de una estructura de control <code>if</code>), será visible para toda la función. Sin embargo, a partir de ECMAScript 2015, las declaraciones {{jsxref("Sentencias/let", "let")}} y {{jsxref("Sentencias/const", "const")}} te permiten crear variables con alcance de bloque.</p>
+
+<h2 id="Operadores">Operadores</h2>
+
+<p>Los operadores numéricos de JavaScript son <code>+</code>, <code>-</code>, <code>*</code>, <code>/</code> y <code>%</code> que es el operador de residuo o resto (<a href="/es/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Remainder_%28%29">que es lo mismo que módulo</a>). Los valores se asignan usando <code>=</code>, y también hay declaraciones de asignación compuestas como <code>+=</code> y <code>-=</code>. Estas se extienden hasta <code>x = x <em>operador</em> y</code>.</p>
+
+<pre class="brush: js notranslate">x += 5;
+x = x + 5;
+</pre>
+
+<p>Puedes usar <code>++</code> y <code>--</code> para incrementar y disminuir respectivamente. Estos se pueden utilizar como operadores prefijos o sufijos.</p>
+
+<p>El <a href="/es/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Addition" title="/es/JavaScript/Reference/Operators/String_Operators">operador <code>+</code></a> también hace concatenación de cadenas:</p>
+
+<pre class="brush: js notranslate">'hello' + ' world'; // "hello world"
+</pre>
+
+<p>Si agregas una cadena a un número (u otro valor), todo se convierte primero en cadena. Esto podría hacerte tropezar:</p>
+
+<pre class="brush: js notranslate">'3' + 4 + 5;  // "345"
+ 3 + 4 + '5'; // "75"
+</pre>
+
+<p>Agregar una cadena vacía a algo es una forma útil de convertirla en cadena.</p>
+
+<p><a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators" title="/es/JavaScript/Reference/Operators/Comparison_Operators">Se pueden realizar comparaciones</a> en JavaScript utilizando <code>&lt;</code>, <code>&gt;</code>, <code>&lt;=</code> y <code>&gt;=</code>. Estas funcionan tanto para cadenas como para números. La igualdad es un poco menos sencilla. El operador doble-igual realiza la coerción de tipos si le das diferentes tipos, con resultados a veces interesantes:</p>
+
+<pre class="brush: js notranslate">123 == '123'; // true
+1 == true; // true
+</pre>
+
+<p>Para evitar la coerción de tipos, usa el operador triple-igual:</p>
+
+<pre class="brush: js notranslate">123 === '123'; // false
+1 === true;    // false
+</pre>
+
+<p>También hay operadores <code>!=</code> y <code>!==</code>.</p>
+
+<p>JavaScript también tiene <a href="/es/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators" title="/es/JavaScript/Reference/Operators/Bitwise_Operators">operaciones bit a bit</a>. Si quieres usarlas, ahí están.</p>
+
+<h2 id="Estructuras_de_control">Estructuras de control</h2>
+
+<p>JavaScript tiene un conjunto de estructuras de control similar a otros lenguajes de la familia C. Las declaraciones condicionales son compatibles con <code>if</code> y <code>else</code>; las puedes encadenarlas si lo deseas:</p>
+
+<pre class="brush: js notranslate">var name = 'kittens';
+if (name == 'puppies') {
+  name += ' woof';
+} else if (name == 'kittens') {
+  name += ' meow';
+} else {
+  name += '!';
+}
+name == 'kittens meow';
+</pre>
+
+<p>JavaScript tiene bucles <code>while</code> y bucles <code>do-while</code>. El primero es bueno para bucles básicos; el segundo bucle para donde deseas asegurarte de que el cuerpo del bucle se ejecute por lo menos una vez:</p>
+
+<pre class="brush: js notranslate">while (true) {
+  // ¡un bucle infinito!
+}
+
+var input;
+do {
+  input = get_input();
+} while (inputIsNotValid(input));
+</pre>
+
+<p>El <a href="/es/docs/Web/JavaScript/Reference/Statements/for">bucle <code>for</code></a> de JavaScript es igual que el de C y Java: te permite proporcione la información de control para tu bucle en una sola línea.</p>
+
+<pre class="brush: js notranslate">for (var i = 0; i &lt; 5; i++) {
+  // Se ejecutará 5 veces
+}
+</pre>
+
+<p>JavaScript también contiene otros dos bucles <code>for</code> destacados: <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of"><code>for</code>...<code>of</code></a></p>
+
+<pre class="brush: js notranslate">for (let value of array) {
+  // haz algo con valor
+}
+</pre>
+
+<p>y <a href="/es/docs/Web/JavaScript/Reference/Statements/for...in"><code>for</code>...<code>in</code></a>:</p>
+
+<pre class="brush: js notranslate">for (let property in object) {
+  // hacer algo con la propiedad del objeto
+}
+</pre>
+
+<p>Los operadores <code>&amp;&amp;</code> y <code>||</code> utilizan lógica de cortocircuito, lo cual significa que si ejecutarán su segundo operando depende del primero. Esto es útil para verificar objetos nulos antes de acceder a sus atributos:</p>
+
+<pre class="brush: js notranslate">var name = o &amp;&amp; o.getName();
+</pre>
+
+<p>O para almacenar en caché los valores (cuando los valores falsos no son válidos):</p>
+
+<pre class="brush: js notranslate">var name = cachedName || (cachedName = getName());
+</pre>
+
+<p>JavaScript tiene un operador ternario para expresiones condicionales:</p>
+
+<pre class="brush: js notranslate">var allowed = (age &gt; 18) ? 'yes' : 'no';
+</pre>
+
+<p>La instrucción <code>switch</code> se puede usar para múltiples ramas según un número o cadena:</p>
+
+<pre class="brush: js notranslate">switch (action) {
+  case 'draw':
+    drawIt();
+    break;
+  case 'eat':
+    eatIt();
+    break;
+  default:
+    doNothing();
+}
+</pre>
+
+<p>Si no agregas una instrucción <code>break</code>, la ejecución "caerá" al siguiente nivel. Esto muy rara vez es lo que deseas; de hecho, vale la pena etiquetar específicamente la caída deliberada con un comentario si realmente lo pretendías para ayudar a la depuración:</p>
+
+<pre class="brush: js notranslate">switch (a) {
+  case 1: // caída deliberada
+  case 2:
+    eatIt();
+    break;
+  default:
+    doNothing();
+}
+</pre>
+
+<p>La cláusula <code>default</code> es opcional. Puedes tener expresiones tanto en la parte del switch como en los casos si lo deseas; las comparaciones tienen lugar entre los dos utilizando el operador <code>===</code>:</p>
+
+<pre class="brush: js notranslate">switch (1 + 3) {
+  case 2 + 2:
+    yay();
+    break;
+  default:
+    neverhappens();
+}
+</pre>
+
+<h2 id="Objetos">Objetos</h2>
+
+<p>Los objetos de JavaScript se pueden considerar como simples colecciones de pares nombre-valor. Como tal, son similares a:</p>
+
+<ul>
+ <li>Diccionarios en Python.</li>
+ <li>Hashes en Perl y Ruby.</li>
+ <li>Tablas hash en C y C++.</li>
+ <li>HashMaps en Java.</li>
+ <li>Arreglos asociativas en PHP.</li>
+</ul>
+
+<p>El hecho de que esta estructura de datos se utilice tan ampliamente es un testimonio de su versatilidad. Dado que todo (el núcleo, tipos bar) en JavaScript es un objeto, cualquier programa de JavaScript implica naturalmente una gran cantidad de búsquedas en tablas hash. ¡Qué bueno que sean tan rápidas!</p>
+
+<p>La parte "name" es una cadena JavaScript, mientras que el valor puede ser cualquier valor de JavaScript, incluidos más objetos. Esto te permite construir estructuras de datos de complejidad arbitraria.</p>
+
+<p>Hay dos formas básicas de crear un objeto vacío:</p>
+
+<pre class="brush: js notranslate">var obj = new Object();
+</pre>
+
+<p>Y:</p>
+
+<pre class="brush: js notranslate">var obj = {};
+</pre>
+
+<p>Estas son semánticamente equivalentes; la segunda se llama sintaxis literal de objeto y es más conveniente. Esta sintaxis también es el núcleo del formato JSON y se debe preferir en todo momento.</p>
+
+<p>La sintaxis de objeto literal se puede utilizar para iniciar un objeto en su totalidad:</p>
+
+<pre class="brush: js notranslate">var obj = {
+  name: 'Carrot',
+  for: 'Max', // 'for' es una palabra reservada, use '_for' en su lugar.
+  details: {
+    color: 'orange',
+    size: 12
+  }
+};
+</pre>
+
+<p>El acceso a los atributos se puede encadenar:</p>
+
+<pre class="brush: js notranslate">obj.details.color; // orange
+obj['details']['size']; // 12
+</pre>
+
+<p>El siguiente ejemplo crea un prototipo de objeto (<code>Person</code>) y una instancia de ese prototipo (<code>you</code>).</p>
+
+<pre class="brush: js notranslate">function Person(name, age) {
+  this.name = name;
+  this.age = age;
+}
+
+// Define un objeto
+var you = new Person('You', 24);
+// Estamos creando una nueva persona llamada "You" de 24 años.
+
+</pre>
+
+<p><strong>Una vez creado</strong>, se puede volver a acceder a las propiedades de un objeto de dos formas:</p>
+
+<pre class="brush: js notranslate">// notación de puntos
+obj.name = 'Simon';
+var name = obj.name;
+</pre>
+
+<p>Y...</p>
+
+<pre class="brush: js notranslate">// notación de corchetes
+obj['name'] = 'Simon';
+var name = obj['name'];
+// puedes usar una variable para definir una clave
+var user = prompt('¿cuál es su clave?')
+obj[user] = prompt('¿cuál es su valor?')
+</pre>
+
+<p>Estas también son semánticamente equivalentes. El segundo método tiene la ventaja de que el nombre de la propiedad se proporciona como una cadena, lo cual significa que se puede calcular en tiempo de ejecución. Sin embargo, el uso de este método evita que se apliquen algunas optimizaciones de minificación y del motor de JavaScript. También se puede utilizar para establecer y obtener propiedades con nombres <a href="/es/docs/Web/JavaScript/Reference/Lexical_grammar#Keywords" title="/es/JavaScript/Reference/Reserved_Words">palabras reservadas</a>:</p>
+
+<pre class="brush: js notranslate">obj.for = 'Simon'; // Error de sintaxis, porque 'for' es una palabra reservada
+obj['for'] = 'Simon'; // trabaja bien
+</pre>
+
+<div class="note">
+<p>A partir de ECMAScript 5, las palabras reservadas se pueden utilizar como nombres de propiedad de objeto "en bruto". Esto significa que no necesitan "vestirse" entre comillas al definir objeto literales. Consulta la <a href="http://es5.github.io/#x7.6.1"> especificación</a> de ES5.</p>
+</div>
+
+<p>Para obtener más información sobre objetos y prototipos, consulta {{jsxref("Objetos_Globales/Object/prototype", "Object.prototype")}}. Para obtener una explicación de los prototipos de objetos y las cadenas de prototipos de objetos, consulta <a href="/es/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">Herencia y la cadena de prototipos</a>.</p>
+
+<div class="note">
+<p>A partir de ECMAScript 2015, las claves de objeto se pueden definir mediante la variable en notación de corchetes al crearlas. <code>{[phoneType]: 12345}</code> es posible en lugar de solo <code>var userPhone = {}; userPhone[phoneType] = 12345</code>.</p>
+</div>
+
+<h2 id="Arreglos">Arreglos</h2>
+
+<p>Los arreglos en JavaScript en son realidad un tipo especial de objeto. Funcionan de manera muy parecida a los objetos normales (las propiedades numéricas se pueden acceder naturalmente solo usando la sintaxis <code>[]</code>) pero tienen una propiedad mágica llamada '<code>length</code>'. Este siempre es uno más que el índice más alto de el arreglo.</p>
+
+<p>Una forma de crear arreglos es la siguiente:</p>
+
+<pre class="brush: js notranslate">var a = new Array();
+a[0] = 'dog';
+a[1] = 'cat';
+a[2] = 'hen';
+a.length; // 3
+</pre>
+
+<p>Una notación más conveniente es usar un arreglo literal:</p>
+
+<pre class="brush: js notranslate">var a = ['dog', 'cat', 'hen'];
+a.length; // 3
+</pre>
+
+<p>Ten en cuenta que <code>array.length</code> no necesariamente es el número de elementos del arreglo. Considera lo siguiente:</p>
+
+<pre class="brush: js notranslate">var a = ['dog', 'cat', 'hen'];
+a[100] = 'fox';
+a.length; // 101
+</pre>
+
+<p>Recuerda — la longitud de el arreglo es uno más que el índice más alto.</p>
+
+<p>Si consultas un índice de arreglo que no existe, obtendrás un valor de <code>undefined</code>:</p>
+
+<pre class="brush: js notranslate">typeof a[90]; // undefined
+</pre>
+
+<p>Si tienes en cuenta lo anterior sobre <code>[]</code> y <code>length</code>, puedes iterar sobre un arreglo utilizando el siguiente bucle <code>for</code>:</p>
+
+<pre class="brush: js notranslate">for (var i = 0; i &lt; a.length; i++) {
+  // Haz algo con a[i]
+}
+</pre>
+
+<p>ES2015 introdujo el bucle más conciso <a href="/es/docs/Web/JavaScript/Reference/Statements/for...of"><code>for</code>...<code>of</code></a> para objetos iterables como arreglos:</p>
+
+<pre class="brush:js notranslate">for (const currentValue of a) {
+  // Haz algo con currentValue
+}</pre>
+
+<p>También puedes iterar sobre un arreglo utilizando el bucle <a href="/es/docs/Web/JavaScript/Reference/Statements/for...in" title="/es/JavaScript/Reference/Statements/for...in"><code>for</code>...<code>in</code></a>, sin embargo, este no itera sobre los elementos del arreglo, sino los índices del arreglo. Además, si alguien agrega nuevas propiedades a <code>Array.prototype</code>, también serán iteradas por dicho bucle. Por lo tanto, este tipo de bucle no se recomienda para arreglos.</p>
+
+<p>Otra forma de iterar sobre un arreglo que se agregó con ECMAScript 5 es {{jsxref("Objetos_Globales/Array/forEach", "arr.forEach()")}}:</p>
+
+<pre class="brush: js notranslate">['dog', 'cat', 'hen'].forEach(function(currentValue, index, array) {
+  // Hacer algo con currentValue o array[index]
+});
+</pre>
+
+<p>Si deseas agregar un elemento a un arreglo, simplemente hazlo así:</p>
+
+<pre class="brush: js notranslate">a.push(item);</pre>
+
+<p>Los arreglos vienen con varios métodos. Consulta también la {{jsxref("Objetos_Globales/Array", "documentación completa para métodos de arreglo")}}.</p>
+
+<table>
+ <thead>
+  <tr>
+   <th scope="col">Nombre del método</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>a.toString()</code></td>
+   <td>Devuelve una cadena con el <code>toString()</code> de cada elemento separado por comas.</td>
+  </tr>
+  <tr>
+   <td><code>a.toLocaleString()</code></td>
+   <td>Devuelve una cadena con el <code>toLocaleString()</code> de cada elemento separado por comas.</td>
+  </tr>
+  <tr>
+   <td><code>a.concat(item1[, item2[, ...[, itemN]]])</code></td>
+   <td>Devuelve un nuevo arreglo con los elementos agregados.</td>
+  </tr>
+  <tr>
+   <td><code>a.join(sep)</code></td>
+   <td>Convierte el arreglo en una cadena, con valores delimitados por el parámetro <code>sep</code></td>
+  </tr>
+  <tr>
+   <td><code>a.pop()</code></td>
+   <td>Elimina y devuelve el último elemento.</td>
+  </tr>
+  <tr>
+   <td><code>a.push(item1, ..., itemN)</code></td>
+   <td>Agrega elementos al final del arreglo.</td>
+  </tr>
+  <tr>
+   <td><code>a.shift()</code></td>
+   <td>Elimina y devuelve el primer elemento.</td>
+  </tr>
+  <tr>
+   <td><code>a.unshift(item1[, item2[, ...[, itemN]]])</code></td>
+   <td>Añade elementos al inicio del arreglo.</td>
+  </tr>
+  <tr>
+   <td><code>a.slice(start[, end])</code></td>
+   <td>Devuelve un subarreglo.</td>
+  </tr>
+  <tr>
+   <td><code>a.sort([cmpfn])</code></td>
+   <td>Toma una función de comparación opcional.</td>
+  </tr>
+  <tr>
+   <td><code>a.splice(start, delcount[, item1[, ...[, itemN]]])</code></td>
+   <td>Te permite modificar un arreglo eliminando una sección y reemplazándola con más elementos.</td>
+  </tr>
+  <tr>
+   <td><code>a.reverse()</code></td>
+   <td>Invierte el arreglo.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Funciones">Funciones</h2>
+
+<p>Junto con los objetos, las funciones son el componente principal para comprender JavaScript. La función más básica no podría ser mucho más sencilla:</p>
+
+<pre class="brush: js notranslate">function add(x, y) {
+  var total = x + y;
+  return total;
+}
+</pre>
+
+<p>Esto demuestra una función básica. Una función de JavaScript puede tomar 0 o más parámetros con nombre. El cuerpo de la función puede contener tantas declaraciones como desees y puedes declarar tus propias variables que son locales para esa función. La declaración <code>return</code> se puede usar para devolver un valor en cualquier momento, terminando la función. Si no se utiliza una declaración <code>return</code> (o <code>return</code> vacía sin valor), JavaScript devuelve <code>undefined</code>.</p>
+
+<p>Los parámetros nombrados resultan ser más intuitivos que cualquier otra cosa. Puedes llamar a una función sin pasar los parámetros que espera, en cuyo caso se establecerán en <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">add(); // NaN
+// No puedes realizar sumas en undefined
+</pre>
+
+<p>También puedes pasar más argumentos de los que espera la función:</p>
+
+<pre class="brush: js notranslate">add(2, 3, 4); // 5
+// sumó los dos primeros; el 4 fue ignorado
+</pre>
+
+<p>Eso puede parecer un poco tonto, pero las funciones tienen acceso a una variable adicional dentro de su cuerpo llamada <a href="/es/docs/Web/JavaScript/Reference/Functions/argument" title="/es/JavaScript/Reference/Functions_and_function_scope/arguments"><code>argumentos</code></a>, que es un objeto tipo arreglo que contiene todos los valores pasados a la función. Reescribamos la función de suma para tomar tantos valores como queramos:</p>
+
+<pre class="brush: js notranslate">function add() {
+  var sum = 0;
+  for (var i = 0, j = arguments.length; i &lt; j; i++) {
+    sum += arguments[i];
+  }
+  return sum;
+}
+
+add(2, 3, 4, 5); // 14
+</pre>
+
+<p>Sin embargo, eso no es más útil que escribir <code>2 + 3 + 4 + 5</code>. Creemos una función de promedio:</p>
+
+<pre class="brush: js notranslate">function avg() {
+  var sum = 0;
+  for (var i = 0, j = arguments.length; i &lt; j; i++) {
+    sum += arguments[i];
+  }
+  return sum / arguments.length;
+}
+
+avg(2, 3, 4, 5); // 3.5
+</pre>
+
+<p>Esta es bastante útil, pero parece un poco detallada. Para reducir un poco más este código, podemos considerar la sustitución del uso del arreglo de argumentos a través de la <a href="/es/docs/Web/JavaScript/Reference/Functions/rest_parameters">sintaxis del parámetro <code>Rest</code></a>. De esta manera, podemos pasar cualquier número de argumentos a la función manteniendo nuestro código mínimo. El <strong>operador de parámetro <code>rest</code></strong> se usa en listas de parámetros de función con el formato: <strong>...variable</strong> e incluirá dentro de esa variable la lista completa de argumentos no capturados a los que se llamó la función. <code>with</code>. También reemplazaremos el bucle <strong>for</strong> con un bucle <strong>for...of</strong> para devolver los valores dentro de nuestra variable.</p>
+
+<pre class="brush: js notranslate">function avg(...args) {
+  var sum = 0;
+  for (let value of args) {
+    sum += value;
+  }
+  return sum / args.length;
+}
+
+avg(2, 3, 4, 5); // 3.5
+</pre>
+
+<div class="note">En el código anterior, la variable <strong>args</strong> contiene todos los valores que se pasaron a la función.<br>
+<br>
+Es importante tener en cuenta que dondequiera que se coloque el operador de parámetro <code>rest</code> en una declaración de función, almacenará todos los argumentos <em>después</em> de su declaración, pero no antes. <em>es decir, function</em> <em>avg(</em><strong>firstValue, </strong><em>...args)</em> almacenará el primer valor pasado a la función en la variable <strong>firstValue</strong> y los argumentos restantes en <strong>args</strong>. Esa es otra característica útil del lenguaje, pero nos lleva a un nuevo problema. La función <code>avg() </code> toma una lista de argumentos separados por comas, pero ¿qué sucede si deseas encontrar el promedio de un arreglo? Simplemente, podrías reescribir la función de la siguiente manera:</div>
+
+<pre class="brush: js notranslate">function avgArray(arr) {
+  var sum = 0;
+  for (var i = 0, j = arr.length; i &lt; j; i++) {
+    sum += arr[i];
+  }
+  return sum / arr.length;
+}
+
+avgArray([2, 3, 4, 5]); // 3.5
+</pre>
+
+<p>Pero sería bueno poder reutilizar la función que ya hemos creado. Afortunadamente, JavaScript te permite llamar a una función con un arreglo arbitrario de argumentos, usando el método {{jsxref("Function.apply", "apply()")}} de cualquier objeto función.</p>
+
+<pre class="brush: js notranslate">avg.apply(null, [2, 3, 4, 5]); // 3.5
+</pre>
+
+<p>El segundo argumento de <code>apply()</code> es el arreglo que se utilizará como <code>arguments</code>; el primero se explicará más adelante. Esto enfatiza el hecho de que las funciones también son objetos.</p>
+
+<div class="note">
+<p>Puedes lograr el mismo resultado utilizando el <a href="/es/docs/Web/JavaScript/Reference/Operators/Spread_operator">operador de propagación</a> en la llamada de función.</p>
+
+<p>Por ejemplo: <code>avg(...numbers) </code></p>
+</div>
+
+<p>JavaScript te permite crear funciones anónimas.</p>
+
+<pre class="brush: js notranslate">var avg = function() {
+  var sum = 0;
+  for (var i = 0, j = arguments.length; i &lt; j; i++) {
+    sum += arguments[i];
+  }
+  return sum / arguments.length;
+};
+</pre>
+
+<p>Esto semánticamente es equivalente a la forma <code>function avg()</code>. Es extremadamente poderosa, ya que te permite colocar una definición de función completa en cualquier lugar donde normalmente colocarías una expresión. Esto permite todo tipo de ingeniosos trucos. Aquí hay una forma de "ocultar" algunas variables locales — como alcance de bloque en C:</p>
+
+<pre class="brush: js notranslate">var a = 1;
+var b = 2;
+
+(function() {
+  var b = 3;
+  a += b;
+})();
+
+a; // 4
+b; // 2
+</pre>
+
+<p>JavaScript te permite llamar a funciones de forma recursiva. Esto es particularmente útil para tratar con estructuras de árbol, como las que se encuentran en el DOM del navegador.</p>
+
+<pre class="brush: js notranslate">function countChars(elm) {
+  if (elm.nodeType == 3) { // TEXT_NODE
+    return elm.nodeValue.length;
+  }
+  var count = 0;
+  for (var i = 0, child; child = elm.childNodes[i]; i++) {
+    count += countChars(child);
+  }
+  return count;
+}
+</pre>
+
+<p>Esto resalta un problema potencial con las funciones anónimas: ¿cómo las llama de forma recursiva si no tienen un nombre? JavaScript te permite nombrar expresiones de función para esto. Puedes utilizar {{Glossary("IIFE", "IIFE (expresiones de función invocadas inmediatamente)")}} con nombre como se muestra a continuación:</p>
+
+<pre class="brush: js notranslate">var charsInBody = (function counter(elm) {
+  if (elm.nodeType == 3) { // TEXT_NODE
+    return elm.nodeValue.length;
+  }
+  var count = 0;
+  for (var i = 0, child; child = elm.childNodes[i]; i++) {
+    count += counter(child);
+  }
+  return count;
+})(document.body);
+</pre>
+
+<p>El nombre proporcionado a una expresión de función como arriba solo está disponible para el alcance de la función. Esto permite que el motor realice más optimizaciones y da como resultado un código más legible. El nombre también aparece en el depurador y en algunos seguimientos de la pila, lo cual puede ahorrarte tiempo al depurar.</p>
+
+<p>Ten en cuenta que las funciones de JavaScript en sí mismas son objetos, como todo lo demás en JavaScript, y puedes agregar o cambiar propiedades en ellas tal como hemos visto anteriormente en la sección Objetos.</p>
+
+<h2 id="Objetos_personalizados">Objetos personalizados</h2>
+
+<div class="note">Para obtener una descripción más detallada de la programación orientada a objetos en JavaScript, consulta <a href="/es/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">Introducción a JavaScript orientado a objetos</a>.</div>
+
+<p>En la programación clásica orientada a objetos, los objetos son colecciones de datos y métodos que operan sobre esos datos. JavaScript es un lenguaje basado en prototipos que no contiene una declaración de clase, como la encontrarías en C++ o Java (esto, a veces es confuso para los programadores acostumbrados a lenguajes con una declaración de clase). En cambio, JavaScript usa funciones como clases. Consideremos un objeto <code>person</code> con campos <code>first</code> y <code>last name</code>. Hay dos formas de mostrar el nombre: como "primero último" o como "último, primero". Usando las funciones y objetos que hemos explicado anteriormente, podríamos mostrar los datos de esta manera:</p>
+
+<pre class="brush: js notranslate">function makePerson(first, last) {
+  return {
+    first: first,
+    last: last
+  };
+}
+function personFullName(person) {
+  return person.first + ' ' + person.last;
+}
+function personFullNameReversed(person) {
+  return person.last + ', ' + person.first;
+}
+
+var s = makePerson('Simon', 'Willison');
+personFullName(s); // "Simon Willison"
+personFullNameReversed(s); // "Willison, Simon"
+</pre>
+
+<p>Esto funciona, pero es bastante feo. Terminas con docenas de funciones en tu espacio de nombres global. Lo que realmente necesitamos es una forma de enlazar una función a un objeto. Dado que las funciones son objetos, esto es fácil:</p>
+
+<pre class="brush: js notranslate">function makePerson(first, last) {
+  return {
+    first: first,
+    last: last,
+    fullName: function() {
+      return this.first + ' ' + this.last;
+    },
+    fullNameReversed: function() {
+      return this.last + ', ' + this.first;
+    }
+  };
+}
+
+var s = makePerson('Simon', 'Willison');
+s.fullName(); // "Simon Willison"
+s.fullNameReversed(); // "Willison, Simon"
+</pre>
+
+<p>Nota sobre la palabra clave <code><a href="/es/docs/Web/JavaScript/Reference/Operators/this" title="/es/JavaScript/Reference/Operators/this">this</a></code>. Usada dentro de una función, <code>this</code> se refiere al objeto actual. Lo que realmente significa está especificado por la forma en que llamaste a esa función. Si lo llamaste usando <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer#Accessing_properties" title="/es/JavaScript/Reference/Operators/Member_Operators">notación de puntos o notación de corchetes</a> en un objeto, ese objeto se convierte en <code>this</code>. Si la notación de puntos no se usó para la llamada, <code>this</code> se refiere al objeto global.</p>
+
+<p>Ten en cuenta que <code>this</code> es una frecuente causa de errores. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">var s = makePerson('Simon', 'Willison');
+var fullName = s.fullName;
+fullName(); // undefined undefined
+</pre>
+
+<p>Cuando llamamos a <code>fullName()</code> solo, sin usar <code>s.fullName()</code>, <code>this</code> está vinculado al objeto global. Debido a que no hay variables globales llamadas <code>first</code> o <code>last</code> obtenemos <code>undefined</code> para cada una.</p>
+
+<p>Podemos aprovechar la palabra clave <code>this</code> para mejorar nuestra función <code>makePerson</code>:</p>
+
+<pre class="brush: js notranslate">function Person(first, last) {
+  this.first = first;
+  this.last = last;
+  this.fullName = function() {
+    return this.first + ' ' + this.last;
+  };
+  this.fullNameReversed = function() {
+    return this.last + ', ' + this.first;
+  };
+}
+var s = new Person('Simon', 'Willison');
+</pre>
+
+<p>Hemos introducido otra palabra clave: <code><a href="/es/docs/Web/JavaScript/Reference/Operators/new" title="/es/JavaScript/Reference/Operators/new">new</a></code>. <code>new</code> está fuertemente relacionado con <code>this</code>. Crea un nuevo objeto vacío y luego llama a la función especificada, con <code>this</code> configurado para ese nuevo objeto. Sin embargo, ten en cuenta que la función especificada con <code>this</code> no devuelve un valor, sino que simplemente modifica el objeto <code>this</code>. Es <code>new</code> que devuelve el objeto <code>this</code> al sitio que realiza la llamada. Las funciones que están diseñadas para ser llamadas por <code>new</code> se denominan funciones constructoras. La práctica común es poner en mayúscula estas funciones como recordatorio para llamarlas con <code>new</code>.</p>
+
+<p>La función mejorada todavía tiene el mismo error al llamar a <code>fullName()</code> sola.</p>
+
+<p>Nuestros objetos <code>person</code> están mejorando, pero todavía tienen algunos bordes desagradables. Cada vez que creamos un objeto <code>person</code>, estamos creando dos nuevos objetos de función dentro de él, ¿no sería mejor si este código fuera compartido?</p>
+
+<pre class="brush: js notranslate">function personFullName() {
+  return this.first + ' ' + this.last;
+}
+function personFullNameReversed() {
+  return this.last + ', ' + this.first;
+}
+function Person(first, last) {
+  this.first = first;
+  this.last = last;
+  this.fullName = personFullName;
+  this.fullNameReversed = personFullNameReversed;
+}
+</pre>
+
+<p>Eso es mejor: estamos creando las funciones como métodos solo una vez y asignándoles referencias dentro del constructor. ¿Podemos hacer algo mejor que eso? La respuesta es sí:</p>
+
+<pre class="brush: js notranslate">function Person(first, last) {
+  this.first = first;
+  this.last = last;
+}
+Person.prototype.fullName = function() {
+  return this.first + ' ' + this.last;
+};
+Person.prototype.fullNameReversed = function() {
+  return this.last + ', ' + this.first;
+};
+</pre>
+
+<p><code>Person.prototype</code> es un objeto compartido por todas las instancias de <code>Person</code>. Forma parte de una cadena de búsqueda (que tiene un nombre especial, "cadena de prototipos"): cada vez que intentes acceder a una propiedad de <code>Person</code> que no esté configurada, JavaScript revisará <code>Person.prototype</code> para ver si esa propiedad existe allí. Como resultado, todo lo asignado a <code>Person.prototype</code> pasa a estar disponible para todas las instancias de ese constructor a través del objeto <code>this</code>.</p>
+
+<p>Esta es una herramienta increíblemente poderosa. JavaScript te permite modificar el prototipo de algo en cualquier momento en tu programa, lo cual significa que —en tiempo de ejecución— puedes agregar métodos adicionales a los objetos existentes:</p>
+
+<pre class="brush: js notranslate">var s = new Person('Simon', 'Willison');
+s.firstNameCaps(); // TypeError en la línea 1: s.firstNameCaps no es una función
+
+Person.prototype.firstNameCaps = function() {
+  return this.first.toUpperCase();
+};
+s.firstNameCaps(); // "SIMON"
+</pre>
+
+<p>Curiosamente, también puedes agregar cosas al prototipo de objetos JavaScript integrados. Agreguemos un método a <code>String</code> que devuelva esa cadena a la inversa:</p>
+
+<pre class="brush: js notranslate">var s = 'Simon';
+s.reversed(); // TypeError en la línea 1: s.reversed no es una función
+
+String.prototype.reversed = function() {
+  var r = '';
+  for (var i = this.length - 1; i &gt;= 0; i--) {
+    r += this[i];
+  }
+  return r;
+};
+
+s.reversed(); // nomiS
+</pre>
+
+<p>¡Nuestro método <code>new<code> funciona incluso con cadenas literales!</code></code></p><code><code>
+
+<pre class="brush: js notranslate">'Esto ahora se puede revertir'.reversed(); // ritrever edeup es aroha otsE
+</pre>
+
+<p>Como se mencionó anteriormente, el prototipo forma parte de una cadena. La raíz de esa cadena es <code>Object.prototype</code>, cuyos métodos incluyen <code>toString()</code>; es este método el que se llama cuando intentas representar un objeto como una cadena. Esto es útil para depurar nuestros objetos <code>Person</code>:</p>
+
+<pre class="brush: js notranslate">var s = new Person('Simon', 'Willison');
+s.toString(); // [object Object]
+
+Person.prototype.toString = function() {
+  return '&lt;Person: ' + this.fullName() + '&gt;';
+}
+
+s.toString(); // "&lt;Person: Simon Willison&gt;"
+</pre>
+
+<p>¿Recuerda cómo <code>avg.apply()</code> tenía un primer argumento <code>null</code>? Ahora lo podemos revisar. El primer argumento de <code>apply()</code> es el objeto que se debe tratar como '<code>this</code>'. Por ejemplo, aquí hay una implementación trivial de <code>new</code>:</p>
+
+<pre class="brush: js notranslate">function trivialNew(constructor, ...args) {
+  var o = {}; // Crea un objeto
+  constructor.apply(o, args);
+  return o;
+}
+</pre>
+
+<p>Esta no es una réplica exacta de <code>new</code> ya que no configura la cadena de prototipos (sería difícil de ilustrar). Esto no es algo que use con mucha frecuencia, pero es útil conocerlo. En este fragmento, <code>...args</code> (incluidos los puntos suspensivos) se denomina "<a href="/es/docs/Web/JavaScript/Reference/Functions/rest_parameters">argumentos rest</a>" — como su nombre indica, contiene el resto de los argumentos.</p>
+
+<p>Llamar a...</p>
+
+<pre class="brush: js notranslate">var bill = trivialNew(Person, 'William', 'Orange');</pre>
+
+<p>...por tanto, casi es equivalente a</p>
+
+<pre class="brush: js notranslate">var bill = new Person('William', 'Orange');</pre>
+
+<p><code>apply()</code> tiene una función hermana llamada {{jsxref("Objetos_Globales/Function/call", "call()")}}, que nuevamente te permite establecer <code>this</code> pero toma una lista de argumentos expandida en lugar de un arreglo.</p>
+
+<pre class="brush: js notranslate">function lastNameCaps() {
+  return this.last.toUpperCase();
+}
+var s = new Person('Simon', 'Willison');
+lastNameCaps.call(s);
+// Es lo mismo que:
+s.lastNameCaps = lastNameCaps;
+s.lastNameCaps(); // WILLISON
+</pre>
+
+<h3 id="Funciones_internas">Funciones internas</h3>
+
+<p>Las declaraciones de función de JavaScript están permitidas dentro de otras funciones. Hemos visto esto una vez antes, con la función <code>makePerson()</code> anterior. Un detalle importante de las funciones anidadas en JavaScript es que pueden acceder a las variables en el alcance de su función padre:</p>
+
+<pre class="brush: js notranslate">function parentFunc() {
+  var a = 1;
+
+  function nestedFunc() {
+    var b = 4; // parentFunc no puede usar esto
+    return a + b;
+  }
+  return nestedFunc(); // 5
+}
+</pre>
+
+<p>Esto proporciona una gran utilidad para escribir un código más fácil de mantener. Si una función llamada se basa en una o dos funciones que no son útiles para ninguna otra parte de tu código, puedes anidar esas funciones de utilidad dentro de ella. Esto mantiene baja la cantidad de funciones que están en el alcance global, lo cual siempre es bueno.</p>
+
+<p>Esto también contrarresta el atractivo de las variables globales. Al escribir código complejo, a menudo es tentador utilizar variables globales para compartir valores entre múltiples funciones, lo que conduce a un código difícil de mantener. Las funciones anidadas pueden compartir variables en su padre, por lo que puedes usar ese mecanismo para unir funciones cuando tenga sentido sin contaminar tu espacio de nombres global — "globales locales" si lo deseas. Esta técnica se debe usar con precaución, pero es una útil habilidad.</p>
+
+<h2 id="Cierres">Cierres</h2>
+
+<p>Esto nos lleva a una de las abstracciones más poderosas que JavaScript tiene para ofrecer — pero potencialmente, también la más confusa. ¿Qué hace esta?</p>
+
+<pre class="brush: js notranslate">function makeAdder(a) {
+  return function(b) {
+    return a + b;
+  };
+}
+var add5 = makeAdder(5);
+var add20 = makeAdder(20);
+add5(6); // ?
+add20(7); // ?
+</pre>
+
+<p>El nombre de la función <code>makeAdder()</code> lo debería revelar: crea nuevas funciones '<code>adder</code>', cada una de las cuales, cuando se llama con un argumento, lo suma al argumento con el que fue creada.</p>
+
+<p>Lo que está sucediendo aquí es más o menos lo mismo que sucedía anteriormente con las funciones internas: una función definida dentro de otra función tiene acceso a las variables de la función externa. La única diferencia aquí es que la función externa ha regresado y, por lo tanto, el sentido común parece dictar que sus variables locales ya no existen. Pero <em>sí</em> existen todavía — de lo contrario, las funciones de suma no podrían funcionar. Además, hay dos diferentes "copias" de las variables locales de <code>makeAdder()</code>: una en la que <code>a</code> es 5 y la otra en la que <code>a</code> es 20. Entonces, el resultado de las llamadas a esa función es el siguiente:</p>
+
+<pre class="brush: js notranslate">add5(6); // returns 11
+add20(7); // devuelve 27
+</pre>
+
+<p>Esto es lo que está sucediendo realmente. Siempre que JavaScript ejecuta una función, se crea un objeto '<code>scope</code>' para contener las variables locales creadas dentro de esa función. Se inicia con cualquier variable pasada como parámetros de función. Esto es similar al objeto global en el que viven todas las variables y funciones globales, pero con un par de importantes diferencias: en primer lugar, se crea un objeto de alcance completamente nuevo cada vez que una función se comienza a ejecutar y, en segundo lugar, a diferencia del objeto global (que es accesible como <code>this</code> y en los navegadores como <code>window</code>) no se puede acceder directamente a estos objetos <code>scope</code> desde tu código JavaScript. No hay ningún mecanismo para iterar sobre las propiedades del objeto <code>scope</code> actual, por ejemplo.</p>
+
+<p>Entonces, cuando se llama a <code>makeAdder()</code>, se crea un objeto <code>scope</code> con una propiedad: <code>a</code>, que es el argumento que se pasa a la función <code>makeAdder()</code>. <code>makeAdder()</code> luego devuelve una función recién creada. Normalmente, el recolector de basura de JavaScript limpiaría el objeto <code>scope</code> creado para <code>makeAdder()</code> en este punto, pero la función devuelta mantiene una referencia a ese objeto de ámbito. Como resultado, el objeto <code>scope</code> no será recolectado como basura hasta que no haya más referencias al objeto función que <code>makeAdder()</code> devolvió.</p>
+
+<p>Los objetos <code>scope</code> forman una cadena llamada cadena de ámbito, similar a la cadena de prototipos utilizada por el sistema de objetos de JavaScript.</p>
+
+<p>Un <strong>cierre</strong> es la combinación de una función y el objeto <code>scope</code> en el que se creó. Los cierres te permiten guardar el estado — como tal, a menudo se pueden usar en lugar de objetos. Puedes encontrar <a href="http://stackoverflow.com/questions/111102/how-do-javascript-closures-work">varias presentaciones excelentes de los cierres</a>.</p></code></code>
diff --git a/files/es/web/javascript/about_javascript/index.html b/files/es/web/javascript/about_javascript/index.html
new file mode 100644
index 0000000000..e26dafe39b
--- /dev/null
+++ b/files/es/web/javascript/about_javascript/index.html
@@ -0,0 +1,60 @@
+---
+title: Acerca de JavaScript
+slug: Web/JavaScript/About_JavaScript
+tags:
+  - JavaScript
+translation_of: Web/JavaScript/About_JavaScript
+original_slug: Web/JavaScript/Acerca_de_JavaScript
+---
+<div>{{JsSidebar}}</div>
+
+<h2 id="¿Qué_es_JavaScript">¿Qué es JavaScript?</h2>
+
+<p><strong>JavaScript</strong><sup>®</sup> (a menudo abreviado como <strong>JS</strong>) es un lenguaje ligero, interpretado y orientado a objetos con <a href="https://en.wikipedia.org/wiki/First-class_function" title="https://en.wikipedia.org/wiki/First-class_function">funciones de primera clase</a>, y mejor conocido como el lenguaje de programación para las páginas Web, pero {{Interwiki("wikipedia", "JavaScript#Otras_características", "también se utiliza en muchos entornos que no son de navegador")}}. Es un lenguaje de scripts que es dinámico, multiparadigma, {{Interwiki("wikipedia", "Programación_basada_en_prototipos", "basado en prototipos")}} y admite estilos de programación orientados a objetos, imperativos y funcionales.</p>
+
+<p>JavaScript se ejecuta en el lado del cliente de la web, y se puede utilizar para estilizar/programar cómo se comportan las páginas web cuando ocurre un evento. JavaScript es un potente lenguaje de scripts y fácil de aprender, ampliamente utilizado para controlar el comportamiento de las páginas web.</p>
+
+<p>Contrariamente a la creencia popular, <strong>JavaScript <em>no</em> es "Java interpretado"</strong>. En pocas palabras, JavaScript es un lenguaje de scripts dinámico que admite {{JSxRef("../Guide/Details_of_the_Object_Model", "construcción de objetos basada en prototipos", "#Lenguajes_basados_en_clases_vs._basados_en_prototipos")}}. Intencionalmente, la sintaxis básica es similar a Java y C++ para reducir la cantidad de conceptos nuevos necesarios para aprender el lenguaje. Construcciones del lenguaje, como las declaraciones <code>if</code>, los bucles <code>for</code> y <code>while</code>, y <code>switch</code> y los bloques <code>try...catch</code> funcionan igual que en esos lenguajes (o casi).</p>
+
+<p>JavaScript puede funcionar como un {{JSxRef("../Introduction_to_Object-Oriented_JavaScript", "lenguaje orientado a objetos")}} y {{Interwiki("wikipedia", "Programación_por_procedimientos", "procedimental")}}. Los objetos se crean mediante programación en JavaScript, adjuntando métodos y propiedades a objetos que de otro modo <strong>en tiempo de ejecución</strong> estarían vacíos, a diferencia de las definiciones de clases sintácticas comunes en lenguajes compilados como C++ y Java. Una vez que se ha construido un objeto, se puede utilizar como plano (o prototipo) para crear objetos similares.</p>
+
+<p>Las capacidades dinámicas de JavaScript incluyen la construcción de objetos en tiempo de ejecución, listas de parámetros variables, variables de función, creación dinámica de scripts (a través de {{JSxRef("Objetos_globales/eval", "eval")}}, introspección de objetos (a través de <code>for...in</code>) y recuperación de código fuente (los programas JavaScript pueden descompilar los cuerpos de las funciones en su texto fuente).</p>
+
+<p>Para una explicación más profunda de la programación de JavaScript, sigue los enlaces {{anch("Recursos_de_JavaScript", "recursos de JavaScript")}} a continuación.</p>
+
+<h2 id="¿Qué_implementaciones_de_JavaScript_están_disponibles">¿Qué implementaciones de JavaScript están disponibles?</h2>
+
+<p>El proyecto Mozilla proporciona dos implementaciones de JavaScript. El primer JavaScript <strong>fue creado</strong> por Brendan Eich en Netscape, y a partir de entonces se ha actualizado para cumplir con ECMA-262 Edición 5 y versiones posteriores. Este motor, cuyo nombre en código es {{web.link("/es/docs/Mozilla/Projects/SpiderMonkey", "SpiderMonkey")}}, está implementado en C/C++. El motor {{web.link("/es/docs/Rhino", "Rhino")}}, creado principalmente por Norris Boyd (también en Netscape) es una implementación de JavaScript escrita en Java. Al igual que SpiderMonkey, Rhino también es compatible con ECMA-262 Edition 5.</p>
+
+<p>Con el transcurso del tiempo, y tras varias importantes optimizaciones del entorno de ejecución como TraceMonkey (Firefox 3.5), JägerMonkey (Firefox 4) e IonMonkey se agregaron al motor de JavaScript SpiderMonkey. El trabajo siempre está en curso para mejorar el rendimiento de ejecución de JavaScript.</p>
+
+<p>Más allá de las implementaciones anteriores, existen otros motores JavaScript populares como:—</p>
+
+<ul>
+ <li><a class="external" href="https://code.google.com/p/v8/" title="https://code.google.com/p/v8/">V8</a> de Google , que se utiliza en el navegador Google Chrome y las versiones recientes del navegador Opera. Este también es el motor que utiliza <a href="http://nodejs.org">Node.js</a>.</li>
+ <li><a class="external" href="https://www.webkit.org/projects/javascript/index.html" title="https://www.webkit.org/projects/javascript/index.html">JavaScriptCore</a> (SquirrelFish/Nitro) utilizado en algunos navegadores WebKit como Apple Safari.</li>
+ <li><a class="external" href="http://my.opera.com/ODIN/blog/carakan-faq" title="http://my.opera.com/ODIN/blog/carakan-faq">Carakan</a> en versiones antiguas de Opera.</li>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/Chakra_%28JScript_engine%29" title="http://en.wikipedia.org/wiki/Chakra_%28JScript_engine%29">Motor Chakra</a> utilizado en Internet Explorer (aunque el lenguaje que implementa formalmente se llama "JScript" para evitar problemas de marcas registradas).</li>
+</ul>
+
+<p>Cada uno de los motores de JavaScript de Mozilla expone una API pública que los desarrolladores de aplicaciones pueden utilizar para integrar JavaScript en su software. Hasta ahora, el entorno de alojamiento más común para JavaScript son los navegadores web. Los navegadores web suelen utilizar la API pública para crear <strong>objetos del anfitrión</strong> responsables de reflejar el <a class="external" href="http://www.w3.org/DOM/">DOM</a> en JavaScript.</p>
+
+<p>Otra aplicación común para JavaScript es como lenguaje de programación de lado del servidor (Web). Un servidor web JavaScript expondría objetos del anfitrión que representan una solicitud HTTP y objetos de respuesta, que luego podría manipular un programa JavaScript para generar páginas web dinámicamente. <a href="http://nodejs.org">Node.js</a> es un ejemplo popular de esto.</p>
+
+<h2 id="Recursos_de_JavaScript">Recursos de JavaScript</h2>
+
+<dl>
+ <dt>{{web.link("/es/docs/Mozilla/Projects/SpiderMonkey", "SpiderMonkey")}}</dt>
+ <dd>Información específica sobre la implementación de JavaScript de Mozilla en el motor C/C++ (también conocido como SpiderMonkey), incluye cómo integrarlo en aplicaciones.</dd>
+</dl>
+
+<dl>
+ <dt>{{web.link("/es/docs/Rhino", "Rhino")}}</dt>
+ <dd>Información específica para la implementación de JavaScript escrita en Java (también conocido como Rhino).</dd>
+ <dt>{{JSxRef("../Language_Resources", "Recursos del lenguaje")}}</dt>
+ <dd>Punteros a estándares JavaScript publicados.</dd>
+ <dt>{{JSxRef("../A_re-introduction_to_JavaScript", "Una reintroducción a JavaScript")}}</dt>
+ <dd>{{JSxRef("../Guide", "Guía de JavaScript")}} y {{JSxRef("../Referencia", "Referencia de JavaScript")}}.</dd>
+</dl>
+
+<p><strong>JavaScript<sup>®</sup></strong> es una marca comercial o una marca comercial registrada de Oracle en EE. UU. y otros países.</p>
diff --git a/files/es/web/javascript/acerca_de_javascript/index.html b/files/es/web/javascript/acerca_de_javascript/index.html
deleted file mode 100644
index a66f16e061..0000000000
--- a/files/es/web/javascript/acerca_de_javascript/index.html
+++ /dev/null
@@ -1,59 +0,0 @@
----
-title: Acerca de JavaScript
-slug: Web/JavaScript/Acerca_de_JavaScript
-tags:
-  - JavaScript
-translation_of: Web/JavaScript/About_JavaScript
----
-<div>{{JsSidebar}}</div>
-
-<h2 id="¿Qué_es_JavaScript">¿Qué es JavaScript?</h2>
-
-<p><strong>JavaScript</strong><sup>®</sup> (a menudo abreviado como <strong>JS</strong>) es un lenguaje ligero, interpretado y orientado a objetos con <a href="https://en.wikipedia.org/wiki/First-class_function" title="https://en.wikipedia.org/wiki/First-class_function">funciones de primera clase</a>, y mejor conocido como el lenguaje de programación para las páginas Web, pero {{Interwiki("wikipedia", "JavaScript#Otras_características", "también se utiliza en muchos entornos que no son de navegador")}}. Es un lenguaje de scripts que es dinámico, multiparadigma, {{Interwiki("wikipedia", "Programación_basada_en_prototipos", "basado en prototipos")}} y admite estilos de programación orientados a objetos, imperativos y funcionales.</p>
-
-<p>JavaScript se ejecuta en el lado del cliente de la web, y se puede utilizar para estilizar/programar cómo se comportan las páginas web cuando ocurre un evento. JavaScript es un potente lenguaje de scripts y fácil de aprender, ampliamente utilizado para controlar el comportamiento de las páginas web.</p>
-
-<p>Contrariamente a la creencia popular, <strong>JavaScript <em>no</em> es "Java interpretado"</strong>. En pocas palabras, JavaScript es un lenguaje de scripts dinámico que admite {{JSxRef("../Guide/Details_of_the_Object_Model", "construcción de objetos basada en prototipos", "#Lenguajes_basados_en_clases_vs._basados_en_prototipos")}}. Intencionalmente, la sintaxis básica es similar a Java y C++ para reducir la cantidad de conceptos nuevos necesarios para aprender el lenguaje. Construcciones del lenguaje, como las declaraciones <code>if</code>, los bucles <code>for</code> y <code>while</code>, y <code>switch</code> y los bloques <code>try...catch</code> funcionan igual que en esos lenguajes (o casi).</p>
-
-<p>JavaScript puede funcionar como un {{JSxRef("../Introduction_to_Object-Oriented_JavaScript", "lenguaje orientado a objetos")}} y {{Interwiki("wikipedia", "Programación_por_procedimientos", "procedimental")}}. Los objetos se crean mediante programación en JavaScript, adjuntando métodos y propiedades a objetos que de otro modo <strong>en tiempo de ejecución</strong> estarían vacíos, a diferencia de las definiciones de clases sintácticas comunes en lenguajes compilados como C++ y Java. Una vez que se ha construido un objeto, se puede utilizar como plano (o prototipo) para crear objetos similares.</p>
-
-<p>Las capacidades dinámicas de JavaScript incluyen la construcción de objetos en tiempo de ejecución, listas de parámetros variables, variables de función, creación dinámica de scripts (a través de {{JSxRef("Objetos_globales/eval", "eval")}}, introspección de objetos (a través de <code>for...in</code>) y recuperación de código fuente (los programas JavaScript pueden descompilar los cuerpos de las funciones en su texto fuente).</p>
-
-<p>Para una explicación más profunda de la programación de JavaScript, sigue los enlaces {{anch("Recursos_de_JavaScript", "recursos de JavaScript")}} a continuación.</p>
-
-<h2 id="¿Qué_implementaciones_de_JavaScript_están_disponibles">¿Qué implementaciones de JavaScript están disponibles?</h2>
-
-<p>El proyecto Mozilla proporciona dos implementaciones de JavaScript. El primer JavaScript <strong>fue creado</strong> por Brendan Eich en Netscape, y a partir de entonces se ha actualizado para cumplir con ECMA-262 Edición 5 y versiones posteriores. Este motor, cuyo nombre en código es {{web.link("/es/docs/Mozilla/Projects/SpiderMonkey", "SpiderMonkey")}}, está implementado en C/C++. El motor {{web.link("/es/docs/Rhino", "Rhino")}}, creado principalmente por Norris Boyd (también en Netscape) es una implementación de JavaScript escrita en Java. Al igual que SpiderMonkey, Rhino también es compatible con ECMA-262 Edition 5.</p>
-
-<p>Con el transcurso del tiempo, y tras varias importantes optimizaciones del entorno de ejecución como TraceMonkey (Firefox 3.5), JägerMonkey (Firefox 4) e IonMonkey se agregaron al motor de JavaScript SpiderMonkey. El trabajo siempre está en curso para mejorar el rendimiento de ejecución de JavaScript.</p>
-
-<p>Más allá de las implementaciones anteriores, existen otros motores JavaScript populares como:—</p>
-
-<ul>
- <li><a class="external" href="https://code.google.com/p/v8/" title="https://code.google.com/p/v8/">V8</a> de Google , que se utiliza en el navegador Google Chrome y las versiones recientes del navegador Opera. Este también es el motor que utiliza <a href="http://nodejs.org">Node.js</a>.</li>
- <li><a class="external" href="https://www.webkit.org/projects/javascript/index.html" title="https://www.webkit.org/projects/javascript/index.html">JavaScriptCore</a> (SquirrelFish/Nitro) utilizado en algunos navegadores WebKit como Apple Safari.</li>
- <li><a class="external" href="http://my.opera.com/ODIN/blog/carakan-faq" title="http://my.opera.com/ODIN/blog/carakan-faq">Carakan</a> en versiones antiguas de Opera.</li>
- <li><a class="external" href="http://en.wikipedia.org/wiki/Chakra_%28JScript_engine%29" title="http://en.wikipedia.org/wiki/Chakra_%28JScript_engine%29">Motor Chakra</a> utilizado en Internet Explorer (aunque el lenguaje que implementa formalmente se llama "JScript" para evitar problemas de marcas registradas).</li>
-</ul>
-
-<p>Cada uno de los motores de JavaScript de Mozilla expone una API pública que los desarrolladores de aplicaciones pueden utilizar para integrar JavaScript en su software. Hasta ahora, el entorno de alojamiento más común para JavaScript son los navegadores web. Los navegadores web suelen utilizar la API pública para crear <strong>objetos del anfitrión</strong> responsables de reflejar el <a class="external" href="http://www.w3.org/DOM/">DOM</a> en JavaScript.</p>
-
-<p>Otra aplicación común para JavaScript es como lenguaje de programación de lado del servidor (Web). Un servidor web JavaScript expondría objetos del anfitrión que representan una solicitud HTTP y objetos de respuesta, que luego podría manipular un programa JavaScript para generar páginas web dinámicamente. <a href="http://nodejs.org">Node.js</a> es un ejemplo popular de esto.</p>
-
-<h2 id="Recursos_de_JavaScript">Recursos de JavaScript</h2>
-
-<dl>
- <dt>{{web.link("/es/docs/Mozilla/Projects/SpiderMonkey", "SpiderMonkey")}}</dt>
- <dd>Información específica sobre la implementación de JavaScript de Mozilla en el motor C/C++ (también conocido como SpiderMonkey), incluye cómo integrarlo en aplicaciones.</dd>
-</dl>
-
-<dl>
- <dt>{{web.link("/es/docs/Rhino", "Rhino")}}</dt>
- <dd>Información específica para la implementación de JavaScript escrita en Java (también conocido como Rhino).</dd>
- <dt>{{JSxRef("../Language_Resources", "Recursos del lenguaje")}}</dt>
- <dd>Punteros a estándares JavaScript publicados.</dd>
- <dt>{{JSxRef("../A_re-introduction_to_JavaScript", "Una reintroducción a JavaScript")}}</dt>
- <dd>{{JSxRef("../Guide", "Guía de JavaScript")}} y {{JSxRef("../Referencia", "Referencia de JavaScript")}}.</dd>
-</dl>
-
-<p><strong>JavaScript<sup>®</sup></strong> es una marca comercial o una marca comercial registrada de Oracle en EE. UU. y otros países.</p>
diff --git a/files/es/web/javascript/descripción_de_las_tecnologías_javascript/index.html b/files/es/web/javascript/descripción_de_las_tecnologías_javascript/index.html
deleted file mode 100644
index b61a56c1e5..0000000000
--- a/files/es/web/javascript/descripción_de_las_tecnologías_javascript/index.html
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: Descripción de las tecnologías JavaScript
-slug: Web/JavaScript/Descripción_de_las_tecnologías_JavaScript
-translation_of: Web/JavaScript/JavaScript_technologies_overview
----
-<div>{{JsSidebar("Introductory")}}</div>
-
-<h2 id="Introducción">Introducción</h2>
-
-<p>Mientras que HTML define la estructura y el contenido de una página web y el CSS define el formato y la apariencia, JavaScript agrega interactividad a una página web y crea aplicaciones web enriquecidas.</p>
-
-<p>Sin embargo, el término paraguas "JavaScript", tal como se entiende en un contexto de navegador web, contiene varios elementos muy diferentes. Uno de ellos es el lenguaje principal (ECMAScript), otro es la colección de las APIs Web, incluyendo el DOM (Document Object Model).</p>
-
-<h2 id="JavaScript_el_núcleo_del_lenguaje_ECMAScript">JavaScript, el núcleo del lenguaje (ECMAScript)</h2>
-
-<p>EL núcleo del lenguaje JavaScript está estandarizado por el Comité ECMA TC39 como un lenguaje llamado <a href="/en-US/docs/JavaScript/Language_Resources">ECMAScript</a>. La última versión de la especificación es <a href="http://www.ecma-international.org/ecma-262/6.0/">ECMAScript 6.0</a>.</p>
-
-<p>Éste núcleo del lenguaje es también usado en ambientes No-Navegadores, por ejemplo en <a href="http://nodejs.org/">node.js</a>.</p>
-
-<h3 id="Qué_considera_ECMAScript_scope">Qué considera ECMAScript scope?</h3>
-
-<p>Entre otras cosas, ECMAScript define:</p>
-
-<ul>
- <li>Sintaxis (reglas de análisis, palabras clave, flujos de control, inicialización literal de objetos...).</li>
- <li>Mecanismos de control de errores (throw, try/catch, habilidad para crear tipos de Errores definidos por el usuario).</li>
- <li>Tipos (boolean, number, string, function, object...).</li>
- <li>Los objetos globales. En un navegador, estos objetos globales son los objetos de la ventana, pero ECMAScript solo define APIs no especificas para navegadores, ej. <code>parseInt</code>, <code>parseFloat</code>, <code>decodeURI</code>, <code>encodeURI</code>...</li>
- <li>Mecanismo de herencia basada en prototipos.</li>
- <li>Objetos y funciones incorporadas (<code>JSON</code>, <code>Math</code>, <code>Array.prototype</code> methods, Object introspection methods...)</li>
- <li>Modo estricto.</li>
-</ul>
-
-<h3 id="Navegadores_soportados">Navegadores soportados</h3>
-
-<p>A partir de Octubre del 2016, la gran mayoria de los navegadores soportan <a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5.1</a> y <a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_6_support_in_Mozilla">ECMAScript 2015 aka ES6</a>, pero versiones antiguas (aún en uso) implementan ECMAScript 5 solamente.</p>
-
-<h3 id="Futuro">Futuro</h3>
-
-<p>La 6ta edición principal de ECMAScript fue oficialmente aprobada y publicada como un estándar el 17 de Junio del 2015 por la ECMA General Assembly. Desde entonces las ediciones de ECMAScript son publicadas anualmente.</p>
-
-<h3 id="Internacionalización_de_la_API">Internacionalización de la API</h3>
-
-<p>La <a href="http://ecma-international.org/ecma-402/1.0/">ECMAScript Internationalization API Specification</a> es una adición para la especificación del lenguaje ECMAScript, también estandarizada por Ecma TC39. La internacionalización de la API provee intercalación --collation-- (comparación de string), formateo de números, y fomateo de fechas/tiempo para aplicaciones JavaScript, permitiendo que las aplicaciones elijan el idioma y adapten la funcionalidad a sus necesidades. El estandar inicial fue aprobado en Diciembre del 2012; el estado de la implementación en navegadores es rastreado en la documentación de la <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Intl"><code>Intl</code> object</a>. Las especificaciones de la internacionalización son actualmente ratificadas cada año y los navegadores constantemente mejoran su implementación.</p>
-
-<h2 id="DOM_APIs">DOM APIs</h2>
-
-<h3 id="WebIDL">WebIDL</h3>
-
-<p>Las especificaciones de la <a href="http://www.w3.org/TR/WebIDL/">WebIDL</a> proporcionan el vínculo de las tecnologías DOM y ECMAScript.</p>
-
-<h3 id="El_núcleo_del_DOM">El núcleo del DOM</h3>
-
-<p>El Document Object Model (DOM) es una <strong>convención multiplataforma e independiente</strong> del lenguaje para representar e interactuar con objetos en documentos HTML, XHTML y XML. Los objetos en el <strong>árbol DOM</strong> se pueden abordar y manipular mediante el uso de métodos en los objetos de otras tecnologías. El {{Glossary("W3C")}} estandariza el Modelo de Objetos del Documento Central, que define interfaces independientes del lenguaje que abstraen documentos HTML y XML como objetos, y también define mecanismos para manipular esta abstracción. Entre las cosas definidas por el DOM, podemos encontrar:</p>
-
-<ul>
- <li>La estructura del documento, un modelo de árbol, y la arquitectura de eventos DOM en el nucleo del DOM: <code>Node</code>, <code>Element</code>, <code>DocumentFragment</code>, <code>Document</code>, <code>DOMImplementation</code>, <code>Event</code>, <code>EventTarget</code>, …</li>
- <li>Una definición menos rigurosa de la arquitectura de eventos DOM, así como eventos específicos en eventos DOM.</li>
- <li>Otras cosas como DOM Traversal y el DOM Range.</li>
-</ul>
-
-<p>Desde el punto de vista ECMAScript, los objetos definidos en la especificación DOM se denominan "objetos host".</p>
-
-<h3 id="HTML_DOM">HTML DOM</h3>
-
-<p>HTML, el lenguaje de marcado de la Web, se especifica en términos del DOM. Por encima de los conceptos abstractos definidos en DOM Core, HTML también define el significado de los elementos. El DOM HTML incluye cosas como el <code>className</code> propiedad en elementos HTML o API como {{domxref ("document.body")}}.</p>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">La especificación HTML también define restricciones en los documentos;</span> <span title="">por ejemplo, requiere que todos los elementos secundarios de un elemento</span></span> <code>ul</code> <span class="tlid-translation translation" lang="es"><span title="">que representa una lista desordenada, sean elementos</span></span> <code>li</code>, <span class="tlid-translation translation" lang="es"><span title="">ya que representan elementos de la lista.</span> <span title="">En general, también prohíbe el uso de elementos y atributos que no están definidos en un estándar.</span></span></p>
-
-<p>¿Busca <a href="/en-US/docs/DOM/document"><code>Document</code> object</a>, <a href="/en-US/docs/DOM/window"><code>Window</code> object</a>, <span class="tlid-translation translation" lang="es"><span title="">y los otros elementos DOM?</span></span> ? Lee la documentación <a href="/en-US/docs/Web/API/Document_Object_Model">DOM documentation</a>.</p>
-
-<h2 id="Otras_API_notables"><span class="tlid-translation translation" lang="es"><span title="">Otras API notables</span></span></h2>
-
-<ul>
- <li>Las funciones <code>setTimeout</code> <code>ysetInterval</code> <span class="tlid-translation translation" lang="es"><span title="">se especificaron por primera vez en la interfaz de</span></span> <code><a href="http://www.whatwg.org/html/#window">Window</a></code> <span class="tlid-translation translation" lang="es"><span title="">en HTML Standard.</span></span></li>
- <li><a href="https://dvcs.w3.org/hg/xhr/raw-file/tip/Overview.html">XMLHttpRequest</a> <span class="tlid-translation translation" lang="es"><span title="">hace posible enviar solicitudes HTTP asincrónicas.</span></span></li>
- <li>EL <a href="http://dev.w3.org/csswg/cssom/">Modelo de Objetos CSS</a> <span class="tlid-translation translation" lang="es"><span title="">esume las reglas CSS como objetos.</span></span></li>
- <li><a href="http://www.whatwg.org/specs/web-workers/current-work/">WebWorkers </a>permite el cálculo paralelo.</li>
- <li><a href="http://www.whatwg.org/C/#network">WebSockets</a> <span class="tlid-translation translation" lang="es"><span title="">permite la comunicación bidireccional de bajo nivel.</span></span></li>
- <li><a href="http://www.whatwg.org/html/#2dcontext">Canvas 2D Context</a> <span class="tlid-translation translation" lang="es"><span title="">es una API de dibujo para</span></span> {{htmlelement("canvas")}}.</li>
-</ul>
-
-<h3 id="Soporte_del_navegador">Soporte del navegador</h3>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Como todos los desarrolladores web han experimentado</span></span>,  <a href="http://ejohn.org/blog/the-dom-is-a-mess/">el DOM es un desastre</a>. <span class="tlid-translation translation" lang="es"><span title="">La uniformidad del soporte del navegador varía mucho de una característica a otra, principalmente porque muchas características DOM importantes tienen especificaciones muy poco claras (si las hay), y diferentes navegadores web agregan características incompatibles para casos de uso superpuestos (como el modelo de evento de Internet Explorer).</span> <span title="">A partir de junio de 2011, el W3C y particularmente el WHATWG están definiendo características antiguas en detalle para mejorar la interoperabilidad, y los navegadores a su vez pueden mejorar sus implementaciones basadas en estas especificaciones.</span></span></p>
-
-<p><span class="tlid-translation translation" lang="es"><span title="">Un enfoque común, aunque quizás no el más confiable, para la compatibilidad entre navegadores es usar bibliotecas de JavaScript, que resumen las funciones DOM y mantienen sus API funcionando igual en diferentes navegadores.</span> <span title="">Algunos de los frameworks más utilizados son</span></span> <a href="http://jquery.com/">jQuery</a>, <a href="http://www.prototypejs.org/">prototype</a>, y <a href="http://developer.yahoo.com/yui/">YUI</a>.</p>
diff --git a/files/es/web/javascript/enumerability_and_ownership_of_properties/index.html b/files/es/web/javascript/enumerability_and_ownership_of_properties/index.html
new file mode 100644
index 0000000000..2e2416d7c1
--- /dev/null
+++ b/files/es/web/javascript/enumerability_and_ownership_of_properties/index.html
@@ -0,0 +1,334 @@
+---
+title: Enumerabilidad y posesión de propiedades
+slug: Web/JavaScript/Enumerability_and_ownership_of_properties
+tags:
+  - Enumerabilidad
+  - Enumeración
+  - Guía
+  - JavaScript
+  - Propiedades
+translation_of: Web/JavaScript/Enumerability_and_ownership_of_properties
+original_slug: Web/JavaScript/enumeracion_y_propietario_de_propiedades
+---
+<div>{{JsSidebar("Más")}}</div>
+
+<p>Las propiedades enumerables son aquellas propiedades cuyo indicador enumerable interno se establece en <code>true</code>, que es el valor predeterminado para las propiedades creadas mediante una asignación simple o mediante un iniciador de propiedad (propiedades definidas mediante {{jsxref("Global_Objects/Object/defineProperty", "Object.defineProperty")}} y tal valor enumerable predeterminado a <code>false</code>). Se muestran numerosas propiedades en bucles {{jsref("Statements/for...in", "for...in")}} a menos que la clave de la propiedad sea {{jsxref("Global_Objects/Symbol", "Symbol")}}. La posesión de las propiedades está determinada por si la propiedad pertenece directamente al objeto y no a su cadena prototipo. Las propiedades de un objeto también se pueden recuperar en total. Hay varios medios incorporados para detectar, iterar/enumerar y recuperar propiedades de objetos, y el gráfico que se muestra a continuación está disponible. A continuación, se muestra un código de muestra que demuestra cómo obtener las categorías faltantes.</p>
+
+<div style="overflow: auto; width: 100%;">
+<table>
+ <caption>Propiedad, enumerabilidad y posesión — métodos integrados de detección, recuperación e iteración</caption>
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Propia del Objeto</th>
+   <th>Propia del Objeto y su cadena prototipo</th>
+   <th>Solo en cadena prototipo</th>
+  </tr>
+  <tr>
+   <td>Detección</td>
+   <td>
+    <table>
+     <thead>
+      <tr>
+       <th scope="col">Enumerable</th>
+       <th scope="col">No enumerable</th>
+       <th scope="col">Enumerable y no enumerable</th>
+      </tr>
+     </thead>
+     <tbody>
+      <tr>
+       <td>
+        <p>{{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</p>
+
+        <p>{{jsxref("Global_Objects/Object/hasOwnProperty", "hasOwnProperty")}}</p>
+       </td>
+       <td>
+        <p>{{jsxref("Global_Objects/Object/hasOwnProperty", "hasOwnProperty")}} — filtrado para excluir enumerables mediante {{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</p>
+       </td>
+       <td>{{jsxref("Global_Objects/Object/hasOwnProperty", "hasOwnProperty")}}</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+   <td>
+    <table>
+     <thead>
+      <tr>
+       <th scope="col">Enumerable</th>
+       <th scope="col">No enumerable</th>
+       <th scope="col">Enumerable y no enumerable</th>
+      </tr>
+     </thead>
+     <tbody>
+      <tr>
+       <td>No disponible sin código adicional</td>
+       <td>No disponible sin código adicional</td>
+       <td>{{jsxref("Operators/in", "in")}}</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+   <td>No disponible sin código adicional</td>
+  </tr>
+  <tr>
+   <td>Recuperación</td>
+   <td>
+    <table>
+     <thead>
+      <tr>
+       <th scope="col">Enumerable</th>
+       <th scope="col">No enumerable</th>
+       <th scope="col">Enumerable y no enumerable</th>
+      </tr>
+     </thead>
+     <tbody>
+      <tr>
+       <td>
+        <p>{{jsxref("Global_Objects/Object/keys", "Object.keys")}}</p>
+
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
+
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
+       </td>
+       <td>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}, {{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}} — filtrado para excluir enumerables usando {{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</td>
+       <td>
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
+
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
+       </td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+   <td>No disponible sin código adicional</td>
+   <td>No disponible sin código adicional</td>
+  </tr>
+  <tr>
+   <td>Iterable</td>
+   <td>
+    <table>
+     <thead>
+      <tr>
+       <th scope="col">Enumerable</th>
+       <th scope="col">No enumerable</th>
+       <th scope="col">Enumerable y no enumerable</th>
+      </tr>
+     </thead>
+     <tbody>
+      <tr>
+       <td>
+        <p>{{jsxref("Global_Objects/Object/keys", "Object.keys")}}</p>
+
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
+
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
+       </td>
+       <td>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}, {{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}} — filtrado para excluir enumerables usando {{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</td>
+       <td>
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
+
+        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
+       </td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+   <td>
+    <table>
+     <thead>
+      <tr>
+       <th scope="col">Enumerable</th>
+       <th scope="col">No enumerable</th>
+       <th scope="col">Enumerable y no enumerable</th>
+      </tr>
+     </thead>
+     <tbody>
+      <tr>
+       <td>
+        <p>{{jsxref("Statements/for...in", "for..in")}}</p>
+
+        <p>(no incluye símbolos)</p>
+       </td>
+       <td>No disponible sin código adicional</td>
+       <td>No disponible sin código adicional</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+   <td>No disponible sin código adicional</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Obtención_de_propiedades_por_enumerabilidadposesión">Obtención de propiedades por enumerabilidad/posesión</h2>
+
+<p>Ten en cuenta que este no es el algoritmo más eficiente para todos los casos, pero es útil para una demostración rápida.</p>
+
+<ul>
+ <li>La detección puede ocurrir por <code>SimplePropertyRetriever.theGetMethodYouWant(obj).indexOf(prop) &gt; -1</code></li>
+ <li>La iteración puede ocurrir por <code>SimplePropertyRetriever.theGetMethodYouWant(obj).forEach(function (value, prop) {});</code> (o usa <code>filter()</code>, <code>map()</code>, etc.)</li>
+</ul>
+
+<pre class="brush: js notranslate">var SimplePropertyRetriever = {
+    getOwnEnumerables: function(obj) {
+        return this._getPropertyNames(obj, true, false, this._enumerable);
+         // O podrías usar for..in filtrado con hasOwnProperty o simplemente esto: return Object.keys(obj);
+    },
+    getOwnNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, false, this._notEnumerable);
+    },
+    getOwnEnumerablesAndNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, false, this._enumerableAndNotEnumerable);
+        // O simplemente usa: return Object.getOwnPropertyNames(obj);
+    },
+    getPrototypeEnumerables: function(obj) {
+        return this._getPropertyNames(obj, false, true, this._enumerable);
+    },
+    getPrototypeNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, false, true, this._notEnumerable);
+    },
+    getPrototypeEnumerablesAndNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, false, true, this._enumerableAndNotEnumerable);
+    },
+    getOwnAndPrototypeEnumerables: function(obj) {
+        return this._getPropertyNames(obj, true, true, this._enumerable);
+        // O podrías usar "for..in" sin filtrar
+    },
+    getOwnAndPrototypeNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, true, this._notEnumerable);
+    },
+    getOwnAndPrototypeEnumerablesAndNonenumerables: function(obj) {
+        return this._getPropertyNames(obj, true, true, this._enumerableAndNotEnumerable);
+    },
+    // Retrollamada del supervisor de propiedad estática privada
+    _enumerable: function(obj, prop) {
+        return obj.propertyIsEnumerable(prop);
+    },
+    _notEnumerable: function(obj, prop) {
+        return !obj.propertyIsEnumerable(prop);
+    },
+    _enumerableAndNotEnumerable: function(obj, prop) {
+        return true;
+    },
+    // Inspirado en http://stackoverflow.com/a/8024294/271577
+    _getPropertyNames: function getAllPropertyNames(obj, iterateSelfBool, iteratePrototypeBool, includePropCb) {
+        var props = [];
+
+        do {
+            if (iterateSelfBool) {
+                Object.getOwnPropertyNames(obj).forEach(function(prop) {
+                    if (props.indexOf(prop) === -1 &amp;&amp; includePropCb(obj, prop)) {
+                        props.push(prop);
+                    }
+                });
+            }
+            if (!iteratePrototypeBool) {
+                break;
+            }
+            iterateSelfBool = true;
+        } while (obj = Object.getPrototypeOf(obj));
+
+        return props;
+    }
+};</pre>
+
+<h2 id="Tabla_de_detección">Tabla de detección</h2>
+
+<div style="overflow: auto; width: 100%;">
+<table>
+ <thead>
+  <tr>
+   <th scope="row"></th>
+   <th scope="col"><code>in</code></th>
+   <th scope="col"><code>for..in</code></th>
+   <th scope="col"><code>obj.hasOwnProperty</code></th>
+   <th scope="col"><code>obj.propertyIsEnumerable</code></th>
+   <th scope="col"><code>Object.keys</code></th>
+   <th scope="col"><code>Object.getOwnPropertyNames</code></th>
+   <th scope="col"><code>Object.getOwnPropertyDescriptors</code></th>
+   <th scope="col"><code>Reflect.ownKeys()</code></th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th scope="row">Enumerable</th>
+   <td>true</td>
+   <td>true</td>
+   <td>true</td>
+   <td>true</td>
+   <td>true</td>
+   <td>true</td>
+   <td>true</td>
+   <td>true</td>
+  </tr>
+  <tr>
+   <th scope="row">No enumerable</th>
+   <td>true</td>
+   <td>false</td>
+   <td>true</td>
+   <td>false</td>
+   <td>false</td>
+   <td>true</td>
+   <td>true</td>
+   <td>true</td>
+  </tr>
+  <tr>
+   <th scope="row">Símbolos clave</th>
+   <td>true</td>
+   <td>false</td>
+   <td>true</td>
+   <td>true</td>
+   <td>false</td>
+   <td>false</td>
+   <td>true</td>
+   <td>true</td>
+  </tr>
+  <tr>
+   <th scope="row">Enumerable heredado</th>
+   <td>true</td>
+   <td>true</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+  </tr>
+  <tr>
+   <th scope="row">Heredado no enumerable</th>
+   <td>true</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+  </tr>
+  <tr>
+   <th scope="row">Símbolos clave heredados</th>
+   <td>true</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+   <td>false</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/in", "in")}}</li>
+ <li>{{jsxref("Statements/for...in", "for..in")}}</li>
+ <li>{{jsxref("Object.hasOwnProperty()")}}</li>
+ <li>{{jsxref("Object.propertyIsEnumerable()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+ <li>{{jsxref("Object.keys()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyDescriptors()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/enumeracion_y_propietario_de_propiedades/index.html b/files/es/web/javascript/enumeracion_y_propietario_de_propiedades/index.html
deleted file mode 100644
index fbe97185f6..0000000000
--- a/files/es/web/javascript/enumeracion_y_propietario_de_propiedades/index.html
+++ /dev/null
@@ -1,333 +0,0 @@
----
-title: Enumerabilidad y posesión de propiedades
-slug: Web/JavaScript/enumeracion_y_propietario_de_propiedades
-tags:
-  - Enumerabilidad
-  - Enumeración
-  - Guía
-  - JavaScript
-  - Propiedades
-translation_of: Web/JavaScript/Enumerability_and_ownership_of_properties
----
-<div>{{JsSidebar("Más")}}</div>
-
-<p>Las propiedades enumerables son aquellas propiedades cuyo indicador enumerable interno se establece en <code>true</code>, que es el valor predeterminado para las propiedades creadas mediante una asignación simple o mediante un iniciador de propiedad (propiedades definidas mediante {{jsxref("Global_Objects/Object/defineProperty", "Object.defineProperty")}} y tal valor enumerable predeterminado a <code>false</code>). Se muestran numerosas propiedades en bucles {{jsref("Statements/for...in", "for...in")}} a menos que la clave de la propiedad sea {{jsxref("Global_Objects/Symbol", "Symbol")}}. La posesión de las propiedades está determinada por si la propiedad pertenece directamente al objeto y no a su cadena prototipo. Las propiedades de un objeto también se pueden recuperar en total. Hay varios medios incorporados para detectar, iterar/enumerar y recuperar propiedades de objetos, y el gráfico que se muestra a continuación está disponible. A continuación, se muestra un código de muestra que demuestra cómo obtener las categorías faltantes.</p>
-
-<div style="overflow: auto; width: 100%;">
-<table>
- <caption>Propiedad, enumerabilidad y posesión — métodos integrados de detección, recuperación e iteración</caption>
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Propia del Objeto</th>
-   <th>Propia del Objeto y su cadena prototipo</th>
-   <th>Solo en cadena prototipo</th>
-  </tr>
-  <tr>
-   <td>Detección</td>
-   <td>
-    <table>
-     <thead>
-      <tr>
-       <th scope="col">Enumerable</th>
-       <th scope="col">No enumerable</th>
-       <th scope="col">Enumerable y no enumerable</th>
-      </tr>
-     </thead>
-     <tbody>
-      <tr>
-       <td>
-        <p>{{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</p>
-
-        <p>{{jsxref("Global_Objects/Object/hasOwnProperty", "hasOwnProperty")}}</p>
-       </td>
-       <td>
-        <p>{{jsxref("Global_Objects/Object/hasOwnProperty", "hasOwnProperty")}} — filtrado para excluir enumerables mediante {{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</p>
-       </td>
-       <td>{{jsxref("Global_Objects/Object/hasOwnProperty", "hasOwnProperty")}}</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-   <td>
-    <table>
-     <thead>
-      <tr>
-       <th scope="col">Enumerable</th>
-       <th scope="col">No enumerable</th>
-       <th scope="col">Enumerable y no enumerable</th>
-      </tr>
-     </thead>
-     <tbody>
-      <tr>
-       <td>No disponible sin código adicional</td>
-       <td>No disponible sin código adicional</td>
-       <td>{{jsxref("Operators/in", "in")}}</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-   <td>No disponible sin código adicional</td>
-  </tr>
-  <tr>
-   <td>Recuperación</td>
-   <td>
-    <table>
-     <thead>
-      <tr>
-       <th scope="col">Enumerable</th>
-       <th scope="col">No enumerable</th>
-       <th scope="col">Enumerable y no enumerable</th>
-      </tr>
-     </thead>
-     <tbody>
-      <tr>
-       <td>
-        <p>{{jsxref("Global_Objects/Object/keys", "Object.keys")}}</p>
-
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
-
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
-       </td>
-       <td>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}, {{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}} — filtrado para excluir enumerables usando {{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</td>
-       <td>
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
-
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
-       </td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-   <td>No disponible sin código adicional</td>
-   <td>No disponible sin código adicional</td>
-  </tr>
-  <tr>
-   <td>Iterable</td>
-   <td>
-    <table>
-     <thead>
-      <tr>
-       <th scope="col">Enumerable</th>
-       <th scope="col">No enumerable</th>
-       <th scope="col">Enumerable y no enumerable</th>
-      </tr>
-     </thead>
-     <tbody>
-      <tr>
-       <td>
-        <p>{{jsxref("Global_Objects/Object/keys", "Object.keys")}}</p>
-
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
-
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
-       </td>
-       <td>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}, {{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}} — filtrado para excluir enumerables usando {{jsxref("Global_Objects/Object/propertyIsEnumerable", "propertyIsEnumerable")}}</td>
-       <td>
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertyNames", "getOwnPropertyNames")}}</p>
-
-        <p>{{jsxref("Global_Objects/Object/getOwnPropertySymbols", "getOwnPropertySymbols")}}</p>
-       </td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-   <td>
-    <table>
-     <thead>
-      <tr>
-       <th scope="col">Enumerable</th>
-       <th scope="col">No enumerable</th>
-       <th scope="col">Enumerable y no enumerable</th>
-      </tr>
-     </thead>
-     <tbody>
-      <tr>
-       <td>
-        <p>{{jsxref("Statements/for...in", "for..in")}}</p>
-
-        <p>(no incluye símbolos)</p>
-       </td>
-       <td>No disponible sin código adicional</td>
-       <td>No disponible sin código adicional</td>
-      </tr>
-     </tbody>
-    </table>
-   </td>
-   <td>No disponible sin código adicional</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Obtención_de_propiedades_por_enumerabilidadposesión">Obtención de propiedades por enumerabilidad/posesión</h2>
-
-<p>Ten en cuenta que este no es el algoritmo más eficiente para todos los casos, pero es útil para una demostración rápida.</p>
-
-<ul>
- <li>La detección puede ocurrir por <code>SimplePropertyRetriever.theGetMethodYouWant(obj).indexOf(prop) &gt; -1</code></li>
- <li>La iteración puede ocurrir por <code>SimplePropertyRetriever.theGetMethodYouWant(obj).forEach(function (value, prop) {});</code> (o usa <code>filter()</code>, <code>map()</code>, etc.)</li>
-</ul>
-
-<pre class="brush: js notranslate">var SimplePropertyRetriever = {
-    getOwnEnumerables: function(obj) {
-        return this._getPropertyNames(obj, true, false, this._enumerable);
-         // O podrías usar for..in filtrado con hasOwnProperty o simplemente esto: return Object.keys(obj);
-    },
-    getOwnNonenumerables: function(obj) {
-        return this._getPropertyNames(obj, true, false, this._notEnumerable);
-    },
-    getOwnEnumerablesAndNonenumerables: function(obj) {
-        return this._getPropertyNames(obj, true, false, this._enumerableAndNotEnumerable);
-        // O simplemente usa: return Object.getOwnPropertyNames(obj);
-    },
-    getPrototypeEnumerables: function(obj) {
-        return this._getPropertyNames(obj, false, true, this._enumerable);
-    },
-    getPrototypeNonenumerables: function(obj) {
-        return this._getPropertyNames(obj, false, true, this._notEnumerable);
-    },
-    getPrototypeEnumerablesAndNonenumerables: function(obj) {
-        return this._getPropertyNames(obj, false, true, this._enumerableAndNotEnumerable);
-    },
-    getOwnAndPrototypeEnumerables: function(obj) {
-        return this._getPropertyNames(obj, true, true, this._enumerable);
-        // O podrías usar "for..in" sin filtrar
-    },
-    getOwnAndPrototypeNonenumerables: function(obj) {
-        return this._getPropertyNames(obj, true, true, this._notEnumerable);
-    },
-    getOwnAndPrototypeEnumerablesAndNonenumerables: function(obj) {
-        return this._getPropertyNames(obj, true, true, this._enumerableAndNotEnumerable);
-    },
-    // Retrollamada del supervisor de propiedad estática privada
-    _enumerable: function(obj, prop) {
-        return obj.propertyIsEnumerable(prop);
-    },
-    _notEnumerable: function(obj, prop) {
-        return !obj.propertyIsEnumerable(prop);
-    },
-    _enumerableAndNotEnumerable: function(obj, prop) {
-        return true;
-    },
-    // Inspirado en http://stackoverflow.com/a/8024294/271577
-    _getPropertyNames: function getAllPropertyNames(obj, iterateSelfBool, iteratePrototypeBool, includePropCb) {
-        var props = [];
-
-        do {
-            if (iterateSelfBool) {
-                Object.getOwnPropertyNames(obj).forEach(function(prop) {
-                    if (props.indexOf(prop) === -1 &amp;&amp; includePropCb(obj, prop)) {
-                        props.push(prop);
-                    }
-                });
-            }
-            if (!iteratePrototypeBool) {
-                break;
-            }
-            iterateSelfBool = true;
-        } while (obj = Object.getPrototypeOf(obj));
-
-        return props;
-    }
-};</pre>
-
-<h2 id="Tabla_de_detección">Tabla de detección</h2>
-
-<div style="overflow: auto; width: 100%;">
-<table>
- <thead>
-  <tr>
-   <th scope="row"></th>
-   <th scope="col"><code>in</code></th>
-   <th scope="col"><code>for..in</code></th>
-   <th scope="col"><code>obj.hasOwnProperty</code></th>
-   <th scope="col"><code>obj.propertyIsEnumerable</code></th>
-   <th scope="col"><code>Object.keys</code></th>
-   <th scope="col"><code>Object.getOwnPropertyNames</code></th>
-   <th scope="col"><code>Object.getOwnPropertyDescriptors</code></th>
-   <th scope="col"><code>Reflect.ownKeys()</code></th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <th scope="row">Enumerable</th>
-   <td>true</td>
-   <td>true</td>
-   <td>true</td>
-   <td>true</td>
-   <td>true</td>
-   <td>true</td>
-   <td>true</td>
-   <td>true</td>
-  </tr>
-  <tr>
-   <th scope="row">No enumerable</th>
-   <td>true</td>
-   <td>false</td>
-   <td>true</td>
-   <td>false</td>
-   <td>false</td>
-   <td>true</td>
-   <td>true</td>
-   <td>true</td>
-  </tr>
-  <tr>
-   <th scope="row">Símbolos clave</th>
-   <td>true</td>
-   <td>false</td>
-   <td>true</td>
-   <td>true</td>
-   <td>false</td>
-   <td>false</td>
-   <td>true</td>
-   <td>true</td>
-  </tr>
-  <tr>
-   <th scope="row">Enumerable heredado</th>
-   <td>true</td>
-   <td>true</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-  </tr>
-  <tr>
-   <th scope="row">Heredado no enumerable</th>
-   <td>true</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-  </tr>
-  <tr>
-   <th scope="row">Símbolos clave heredados</th>
-   <td>true</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-   <td>false</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Operators/in", "in")}}</li>
- <li>{{jsxref("Statements/for...in", "for..in")}}</li>
- <li>{{jsxref("Object.hasOwnProperty()")}}</li>
- <li>{{jsxref("Object.propertyIsEnumerable()")}}</li>
- <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
- <li>{{jsxref("Object.keys()")}}</li>
- <li>{{jsxref("Object.getOwnPropertyDescriptors()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/gestion_de_memoria/index.html b/files/es/web/javascript/gestion_de_memoria/index.html
deleted file mode 100644
index 3e2a47287f..0000000000
--- a/files/es/web/javascript/gestion_de_memoria/index.html
+++ /dev/null
@@ -1,204 +0,0 @@
----
-title: Gestión de Memoria
-slug: Web/JavaScript/Gestion_de_Memoria
-tags:
-  - Advanced
-  - JavaScript
-  - Performance
-  - Reference
-  - Referencia
-  - Rendimiento
-  - memoria
-translation_of: Web/JavaScript/Memory_Management
----
-<div>{{JsSidebar("Advanced")}}</div>
-
-<h2 id="Introducción">Introducción</h2>
-
-<p>Los lenguajes de bajo nivel, como C, tienen primitivos de bajo nivel como <code>malloc() </code>y <code>free() </code>para la gestión de memoria. Por otro lado, para los valores en JavaScript se reserva memoria cuando"cosas" (objetos, strings, etc.) son creados y "automáticamente" liberados cuando ya no son utilizados. El proceso anterior es conocido como <em>Recolección de basura (garbage collection). </em>Su forma "automática" es fuente de confusión, y da la impresión a los desarrolladores de JavaScript (y de otros lenguajes de alto nivel) de poder ignorar el proceso de gestión de memoria. Esto es erróneo. </p>
-
-<h2 id="Ciclo_de_vida_de_memoria">Ciclo de vida de memoria</h2>
-
-<p>Sin importar el lenguaje de programación, el ciclo de memoria es casi siempre parecido al siguiente:</p>
-
-<ol>
- <li>Reservar la memoria necesaria</li>
- <li>Utilizarla (lectura, escritura)</li>
- <li>Liberar la memoria una vez ya no es necesaria.</li>
-</ol>
-
-<p>El primer y el segundo paso son explícitos en todos los lenguajes. El último paso es explícito en lenguajes de bajo nivel, pero es mayormente implícito en lenguajes de alto nivel como JavaScript</p>
-
-<h3 id="Reserva_de_memoria_en_JavaScript">Reserva de memoria en JavaScript</h3>
-
-<h4 id="Inicialización_de_valores">Inicialización de valores</h4>
-
-<p>Para no agobiar al programador con reservas de memoria, JavaScript las realiza al mismo tiempo que la declaración de los valores.</p>
-
-<pre class="brush: js">var n = 123; // reserva memoria para un número
-var s = "azerty"; // reserva memoria para un string
-
-var o = {
-  a: 1,
-  b: null
-}; // reserva memoria para un objeto y los valores que
-   // contiene
-
-// (similar a objeto) reserva memoria para el arreglo y
-// los valores que contiene
-var a = [1, null, "abra"];
-
-function f(a){
-  return a + 2;
-} // reserva memoria para una funcion (la cual es un objeto)
-
-// las expresiones de función tambien reservan memoria para un objeto
-someElement.addEventListener('click', function(){
-  someElement.style.backgroundColor = 'blue';
-}, false);
-</pre>
-
-<h4 id="Reserva_de_memoria_al_llamar_una_función">Reserva de memoria al llamar una función</h4>
-
-<p>En ocasiones al llamar a una función se reserva memoria para un objeto.</p>
-
-<pre class="brush: js">var d = new Date();
-// reserva memoria para un elemento del DOM
-var e = document.createElement('div');
-</pre>
-
-<p>Algunos métodos reservan memoria para nuevos valores u objetos:</p>
-
-<pre class="brush: js">var s = "azerty";
-var s2 = s.substr(0, 3); // s2 es un nuevo string
-// Como los strings son valores inmutables,
-// JavaScript puede NO reservar memoria para este,
-// y solo almacenar el rango [0, 3].
-
-var a = ["ouais ouais", "nan nan"];
-var a2 = ["generation", "nan nan"];
-var a3 = a.concat(a2);
-// nuevo arreglo con 4 elementos resultado de
-// concatenar los elementos de a y a2
-</pre>
-
-<h3 id="Usando_valores">Usando valores</h3>
-
-<p>Usar un valor es simplemente leerlo o escribirlo en memoria reservada. Esto puede ocurrir al leer o escribir el valor de una variable o de una propiedad de un objeto, inclusive pasando un argumento a una función.</p>
-
-<h3 id="Liberar_la_memoria_cuando_ya_no_es_necesaria">Liberar la memoria cuando ya no es necesaria</h3>
-
-<p>En este punto ocurren la mayoria de los inconvenientes con la gestión de memoria. Lo más díficil es encontrar el cuándo la "memoria ya no es necesaria". En algunas ocasiones, es necesario que el desarrollador determine en qué parte de un programa esa parte de memoria ya no es necesaria y la libere.</p>
-
-<p>Los lenguajes de alto nivel incluyen una herramienta de software conocida como "recolector de basura" <em>(garbage collector), </em>cuya función es rastrear las reservas de memoria y su utilización, para así encontrar cuándo cierta parte de la memoria ya no es necesaria, y en su momento liberarla automáticamente.  Este proceso es sólo una aproximación al problema general de saber cuándo una parte de la memoria ya no es necesaria, ya que éste es <a href="http://es.wikipedia.org/wiki/Problema_indecidible">indecidible</a> (no puede ser resuelto por un algoritmo).</p>
-
-<h2 id="Recolección_de_basura_(Garbage_collection)">Recolección de basura (Garbage collection)</h2>
-
-<p>Como antes se mencionaba el problema general de encontrar automáticamente cuando la memoria "ya no es necesaria" es indecidible. Como consecuencia, las recolecciones de basura implementan sólo una restricción a la solución del problema general. En esta sección se explicarán las nociones necesarias para entender los principales algoritmos de recolección de basura y sus limitaciones.</p>
-
-<h3 id="Referencias">Referencias</h3>
-
-<p>La noción principal de los algoritmos de recolección se basan en la noción de <em>referencia</em>. Dentro del contexto de gestión de memoria, se dice que un objeto hace referencia a otro si el primero tiene acceso al segundo (ya sea de forma implícita o explícita). Por ejemplo, un objeto de JavaScript guarda una referencia a su <a href="http://es.wikipedia.org/wiki/JavaScript#Protot.C3.ADpico">prototipo</a> (referencia implícita) y a cualquiera de los valores de sus propiedades (referencia explícita)</p>
-
-<p>Hay que mencionar que en este contexto la noción de "objeto" se refiere a algo más amplio que los objetos normales de JavaScript y que también incluye al ámbito de la función (o ámbito de léxico global).</p>
-
-<h3 id="Recolección_de_basura_a_través_de_conteo_de_referencias">Recolección de basura a través de conteo de referencias</h3>
-
-<p>Éste es el algoritmo de recolección más simple. Este algoritmo reduce la definición de "un objejo ya no es necesario" a "un objeto ya no tiene ningún otro objeto que lo referencíe". Un objeto es considerado recolectable si existen cero referencias hacia él.</p>
-
-<h4 id="Ejemplo">Ejemplo</h4>
-
-<pre class="brush: js">var o = {
-  a: {
-    b:2
-  }
-};
-// Se crean dos objetos. Uno es referenciado por el otro como
-// una de sus propiedades.
-// El otro es referenciado al ser asignado a la variable "o"
-// Ninguno puede ser recolectado.
-
-
-var o2 = o; // la variable "o2" es lo segundo en tener una
-            // referencia al objeto.
-o = 1;      // ahora el objeto solo tiene una referencia mediante
-            // la variable "o2"
-
-var oa = o2.a; // referencia a la propiedad "a" del objeto.
-               // ahora el objeto posee dos referencias, una como propiedad
-               // la otra como la variable "oa"
-
-o2 = "yo"; // el objeto original "o" ahora ya no tiene
-           // referencias a él. Podría ser recolectado.
-           // Sin embargo lo que había en la propiedad "a" aún
-           // esta refernciado en la variable "oa";
-           // no puede ser recolectado aún
-
-oa = null; // lo que estaba en la propiedad "a" del objeto original "o"
-           // ahora ya no tiene ninguna referencia.Puede ser recolectado.
-</pre>
-
-<h4 id="Limitación_ciclos">Limitación : ciclos</h4>
-
-<p>Existe una limitación cuando se trata de ciclos.  En el siguiente ejemplo dos objetos son creados y se referencían entre ellos -por lo que se crea un ciclo. Ellos no saldrán del ámbito de la función después del llamado de la función, con lo que serían efectivamente "ya no son necesarios" y por lo cual ser liberados. Sin embargo, el algoritmo de conteo de referencias considera que ya que cada uno de los dos objetos está referenciado por lo menos una vez, ninguno podra ser recolectado. Este simple algoritmo tiene la limitación de que si un grupo de objetos se referencian a sí mismos (y forman un ciclo), nunca pasarán a "ya no ser necesitados" y no podrán ser recolectados nunca.</p>
-
-<pre class="brush: js">function f(){
-  var o = {};
-  var o2 = {};
-  o.a = o2; // o referencía o2
-  o2.a = o; // o2 referencía o
-
-  return "azerty";
-}
-
-f();
-// Dos objetos son creados y se referencían uno al otro creando un ciclo
-// Estan atrapados en el scope de la funcion después de la llamada
-// por lo que son inútiles fuera de la función y podrían ser recolectados.
-// Sin embargo, el algoritmo de conteo de referencias considera que como
-// ambos objetos estan referenciados (aunque sean a si mismos) ambos
-// siguen en uso y por lo tanto no pueden ser recolectados.
-
-</pre>
-
-<h4 id="Ejemplo_real_aplicado">Ejemplo real aplicado</h4>
-
-<p>Internet Explorer 6 y 7 son conocidos por tener recolectores de basura por conteo de referencias para los objetos del DOM. Los Ciclos son un error común que pueden generar <em>fugas de memoria</em> (<em><a href="http://es.wikipedia.org/wiki/Fuga_de_memoria">memory leaks) (art. en inglés)</a>:</em></p>
-
-<pre class="brush: js">var div;
-window.onload = function(){
-  div = document.getElementById("miDiv");
-  div<span style="font-size: 1rem;">.referenciaCircular = div;</span>
-  div.muchosDatos = new Array(10000).join("*");
-};
-</pre>
-
-<p>En el ejemplo anterior, el elemento del DOM "miDiv" posée una referencia circular a sí mismo en la propiedad "referenciaCircular". Si la propiedad no es explícitamente removida o asignada con el valor <em>null</em>,  un algoritmo de conteo de referencias siempre va a dejar por lo menos una referencia intacta y va a mantener el elemento del DOM activo en memoria incluso cuando es removido del DOM. Si el objeto del DOM contiene una gran cantidad de datos (ejemplificado en la propiedad "muchosDatos"), la memoria consumida por estos datos nunca será liberada.</p>
-
-<h3 id="Algoritmo_Mark-and-sweep_(Marcado_y_barrido)">Algoritmo Mark-and-sweep (Marcado y barrido)</h3>
-
-<p>Este algoritmo reduce la definición de "un objeto ya no es necesitado" a "un objeto es inalcanzable"</p>
-
-<p>Este algoritmo asume la noción de un grupo de objetos llamados <em>objetos raíz</em> (en JavaScript la raíz es el objeto global). Periódicamente el recolector empieza por estas raíces, encuentra todos los objetos que están referenciados por estas raíces, y luego todos los objetos referenciados de estos, etc. Empezando por las raíces, el recolector de esta forma encontrará todos los objetos que son <em>alcanzables</em> y recolectará los objetos inalcanzables.</p>
-
-<p>Este algoritmo es mejor que el anterior ya que "un objeto tiene cero referencias" equivale al "objeto es inalcanzable". Esto no sucedía asi en el algoritmo anterior cuando se trataba de un ciclo.</p>
-
-<p>Desde el 2012, todos los navegadores incluyen un recolector de basura basado en mark-and-sweep. Todas las mejoras realizadas en el campo de Recolección de basura en JavaScript (recolección generacional/incremental/concurrida/paralela) en los ultimos años son mejoras a la implementación del algoritmo, pero no mejoras sobre el algoritmo de recolección ni a la reducción de la definicion de cuando"un objeto ya no es necesario".</p>
-
-<h4 id="Los_ciclos_son_problema_del_pasado">Los ciclos son problema del pasado</h4>
-
-<p>En el primer ejemplo, después de que la llamada a una función termina, los dos objetos ya no son referenciados por nada alcanzable desde el objeto global. De esta forma serán identificados como inalcanzables por el recolector de basura.</p>
-
-<p>Lo mismo ocurre en el segundo ejemplo. Una vez que el elemento div y sus métodos se hacen inalcanzable desde los objetos raíz, ambos pueden ser recolectados a pesar de que estén referenciados los unos de los otros.</p>
-
-<h4 id="Limitación_los_objetos_necesarios_se_hacen_inalcanzables_de_forma_explícita.">Limitación: los objetos necesarios se hacen inalcanzables de forma explícita.</h4>
-
-<p>Aunque esto está marcado como una limitación, se puede encontrar muy poco en la práctica. Ésta es la razón por la cuál la recolección de basura es poco tomada en cuenta.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a class="external" href="http://www.ibm.com/developerworks/web/library/wa-memleak/">IBM article on "Memory leak patterns in JavaScript" (2007) (art. en inglés)</a></li>
- <li><a class="external" href="http://msdn.microsoft.com/en-us/magazine/ff728624.aspx">Kangax article on how to register event handler and avoid memory leaks (2010) (art. en inglés)</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Mozilla/Performance" title="https://developer.mozilla.org/en-US/docs/Mozilla/Performance">Performance (art. en inglés) </a></li>
-</ul>
diff --git a/files/es/web/javascript/guide/bucles_e_iteración/index.html b/files/es/web/javascript/guide/bucles_e_iteración/index.html
deleted file mode 100644
index 07b7c12e31..0000000000
--- a/files/es/web/javascript/guide/bucles_e_iteración/index.html
+++ /dev/null
@@ -1,334 +0,0 @@
----
-title: Bucles e iteración
-slug: Web/JavaScript/Guide/Bucles_e_iteración
-tags:
-  - Bucle
-  - Guia(2)
-  - Guía
-  - Iteración
-  - JavaScript
-  - Sintaxis
-translation_of: Web/JavaScript/Guide/Loops_and_iteration
----
-<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}</div>
-
-<p class="summary">Los bucles ofrecen una forma rápida y sencilla de hacer algo repetidamente. Este capítulo de la {{JSxRef("../Guide", "Guía de JavaScript")}} presenta las diferentes declaraciones de iteración disponibles para JavaScript.</p>
-
-<p>Puedes pensar en un bucle como una versión computarizada del juego en la que le dices a alguien que dé <em>X</em> pasos en una dirección y luego <em>Y</em> pasos en otra. Por ejemplo, la idea "Ve cinco pasos hacia el este" se podría expresar de esta manera como un bucle:</p>
-
-<pre class="brush: js notranslate">for (let step = 0; step &lt; 5; step++) {
-  // Se ejecuta 5 veces, con valores del paso 0 al 4.
-  console.log('Camina un paso hacia el este');
-}
-</pre>
-
-<p>Hay muchos diferentes tipos de bucles, pero esencialmente, todos hacen lo mismo: repiten una acción varias veces. (¡Ten en cuenta que es posible que ese número sea cero!).</p>
-
-<p>Los diversos mecanismos de bucle ofrecen diferentes formas de determinar los puntos de inicio y terminación del bucle. Hay varias situaciones que son fácilmente atendidas por un tipo de bucle que por otros.</p>
-
-<p>Las declaraciones para bucles proporcionadas en JavaScript son:</p>
-
-<ul>
- <li>{{anch("Declaracion_for", "Declaración for")}}</li>
- <li>{{anch("Declaracion_do...while", "Declaración do...while")}}</li>
- <li>{{anch("Declaracion_while", "Declaración while")}}</li>
- <li>{{anch("Declaracion_labeled", "Declaración labeled")}}</li>
- <li>{{anch("Declaracion_break", "Declaración break")}}</li>
- <li>{{anch("Declaracion_continue", "Declaración continue")}}</li>
- <li>{{anch("Declaracion_for...in", "Declaración for...in")}}</li>
- <li>{{anch("Declaracion_for...of", "Declaración for...of")}}</li>
-</ul>
-
-<h2 id="Declaración_for">Declaración <code>for</code></h2>
-
-<p>Un ciclo {{JSxRef("Sentencias/for", "for")}} se repite hasta que una condición especificada se evalúe como <code>false</code>. El bucle <code>for</code> de JavaScript es similar al bucle <code>for</code> de Java y C.</p>
-
-<p>Una declaración <code>for</code> tiene el siguiente aspecto:</p>
-
-<pre class="syntaxbox notranslate">for ([expresiónInicial]; [expresiónCondicional]; [expresiónDeActualización])
-  instrucción
-</pre>
-
-<p>Cuando se ejecuta un bucle <code>for</code>, ocurre lo siguiente:</p>
-
-<ol>
- <li>Se ejecuta la expresión de iniciación <code>expresiónInicial</code>, si existe. Esta expresión normalmente inicia uno o más contadores de bucle, pero la sintaxis permite una expresión de cualquier grado de complejidad. Esta expresión también puede declarar variables.</li>
- <li>Se evalúa la expresión <code>expresiónCondicional</code>. Si el valor de <code>expresiónCondicional</code> es verdadero, se ejecutan las instrucciones del bucle. Si el valor de <code>condición</code> es falso, el bucle <code>for</code> termina. (Si la expresión <code>condición</code> se omite por completo, se supone que la condición es verdadera).</li>
- <li>Se ejecuta la <code>instrucción</code>. Para ejecutar varias instrucciones, usa una declaración de bloque (<code>{ ... }</code>) para agrupar esas declaraciones.</li>
- <li>Si está presente, se ejecuta la expresión de actualización <code>expresiónDeActualización</code>.</li>
- <li>El control regresa al paso 2.</li>
-</ol>
-
-<h3 id="Ejemplo"><strong>Ejemplo</strong></h3>
-
-<p>En el siguiente ejemplo, la función contiene una instrucción <code>for</code> que cuenta el número de opciones seleccionadas en una lista de desplazamiento (el elemento {{HTMLElement("select")}} de HTML representa un control que proporciona un menú de opciones que permite múltiples selecciones). La instrucción <code>for</code> declara la variable <code>i</code> y la inicia a <code>0</code>. Comprueba que <code>i</code> es menor que el número de opciones en el elemento <code>&lt;select&gt;</code>, realiza la siguiente instrucción <code>if</code> e incrementa <code>i</code> después de cada pasada por el bucle.</p>
-
-<pre class="brush: html notranslate">&lt;form name="selectForm"&gt;
-  &lt;p&gt;
-    &lt;label for="musicTypes"&gt;Elija algunos tipos de música, luego haga clic en el botón de abajo:&lt;/label&gt;
-    &lt;select id="musicTypes" name="musicTypes" multiple="multiple"&gt;
-      &lt;option selected="selected"&gt;R&amp;B&lt;/option&gt;
-      &lt;option&gt;Jazz&lt;/option&gt;
-      &lt;option&gt;Blues&lt;/option&gt;
-      &lt;option&gt;New Age&lt;/option&gt;
-      &lt;option&gt;Classical&lt;/option&gt;
-      &lt;option&gt;Opera&lt;/option&gt;
-    &lt;/select&gt;
-  &lt;/p&gt;
-  &lt;p&gt;&lt;input id="btn" type="button" value="¿Cuántos están seleccionados?" /&gt;&lt;/p&gt;
-&lt;/form&gt;
-
-&lt;script&gt;
-function howMany(selectObject) {
-  let numberSelected = 0;
-  for (let i = 0; i &lt; selectObject.options.length; i++) {
-    if (selectObject.options[i].selected) {
-      numberSelected++;
-    }
-  }
-  return numberSelected;
-}
-
-let btn = document.getElementById('btn');
-btn.addEventListener('click', function() {
-  alert('Número de opciones seleccionadas: ' + howMany(document.selectForm.musicTypes));
-});
-&lt;/script&gt;
-
-</pre>
-
-<h2 id="Declaración_do...while">Declaración <code>do...while</code></h2>
-
-<p>La instrucción {{JSxRef("Sentencias/do...while", "do...while")}} se repite hasta que una condición especificada se evalúe como falsa.</p>
-
-<p>Una declaración <code>do...while</code> tiene el siguiente aspecto:</p>
-
-<pre class="syntaxbox notranslate">do
-  <em>expresión</em>
-while (condición);
-</pre>
-
-<p><em><code>exposición</code></em> siempre se ejecuta una vez antes de que se verifique la condición. (Para ejecutar varias instrucciones, usa una declaración de bloque (<code>{ ... }</code>) para agrupar esas declaraciones).</p>
-
-<p>Si <code>condición</code> es <code>true</code>, la declaración se ejecuta de nuevo. Al final de cada ejecución, se comprueba la condición. Cuando la condición es <code>false</code>, la ejecución se detiene y el control pasa a la declaración que sigue a <code>do...while</code>.</p>
-
-<h3 id="Ejemplo_2"><strong>Ejemplo</strong></h3>
-
-<p>En el siguiente ejemplo, el bucle <code>do</code> itera al menos una vez y se repite hasta que <code><em>i</em></code> ya no sea menor que <code>5</code>.</p>
-
-<p>let i = 0; do { i += 1; console.log(i); } while (i &lt; 5);</p>
-
-<h2 id="Declaración_while">Declaración <code>while</code></h2>
-
-<p>Una declaración {{JSxRef("Sentencias/while", "while")}} ejecuta sus instrucciones siempre que una condición especificada se evalúe como <code>true</code>. Una instrucción <code>while</code> tiene el siguiente aspecto:</p>
-
-<pre class="syntaxbox notranslate">while (<em>condición</em>)
-  <em>expresión</em>
-</pre>
-
-<p>Si la <em><code>condición</code></em> se vuelve <code>false</code>, la <code>instrucción</code> dentro del bucle se deja de ejecutar y el control pasa a la instrucción que sigue al bucle.</p>
-
-<p>La prueba de condición ocurre <em>antes</em> de que se ejecute la <code>expresión</code> en el bucle. Si la condición devuelve <code>true</code>, se ejecuta la <code>expresión</code> y la <em><code>condición</code></em> se prueba de nuevo. Si la condición devuelve <code>false</code>, la ejecución se detiene y el control se pasa a la instrucción que sigue a <code>while</code>.</p>
-
-<p>Para ejecutar varias instrucciones, usa una declaración de bloque (<code>{ ... }</code>) para agrupar esas declaraciones.</p>
-
-<h3 id="Ejemplo_1"><strong>Ejemplo 1</strong></h3>
-
-<p>El siguiente ciclo del <code>while</code> se repite siempre que <em><code>n</code></em> sea menor que <code>3</code>:</p>
-
-<pre class="brush: js notranslate">let n = 0;
-let x = 0;
-while (n &lt; 3) {
-  n++;
-  x += n;
-}
-</pre>
-
-<p>Con cada iteración, el bucle incrementa <code>n</code> y agrega ese valor a <code>x</code>. Por lo tanto, <code>x</code> y <code>n</code> toman los siguientes valores:</p>
-
-<ul>
- <li>Después de la primera pasada: <code>n</code> = <code>1</code> y <code>x</code> = <code>1</code></li>
- <li>Después de la segunda pasada: <code>n</code> = <code>2</code> y <code>x</code> = <code>3</code></li>
- <li>Después de la tercera pasada: <code>n</code> = <code>3</code> y <code>x</code> = <code>6</code></li>
-</ul>
-
-<p>Después de completar la tercera pasada, la condición <code>n &lt; 3</code> ya no es <code>true</code>, por lo que el bucle termina.<strong>Ejemplo 2</strong></p>
-
-<p>Evita los bucles infinitos. Asegúrate de que la condición en un bucle eventualmente se convierta en <code>false</code>; de lo contrario, el bucle nunca terminará. Las declaraciones en el siguiente bucle <code>while</code> se ejecutan indefinidamente porque la condición nunca se vuelve <code>false</code>:</p>
-
-<pre class="example-bad brush: js notranslate">// ¡Los bucles infinitos son malos!
-while (true) {
-  console.log('¡Hola, mundo!');
-}</pre>
-
-<h2 id="Declaración_labeled">Declaración <code>labeled</code></h2>
-
-<p>Una {{JSxRef("Sentencias/label", "label")}} proporciona una instrucción con un identificador que te permite hacer referencia a ella en otra parte de tu programa. Por ejemplo, puedes usar una etiqueta para identificar un bucle y luego usar las declaraciones <code>break</code> o <code>continue</code> para indicar si un programa debe interrumpir el bucle o continuar su ejecución.La sintaxis de la instrucción etiquetada es similar a la siguiente:label : instrucción</p>
-
-<p>El valor de <code><em>label</em></code> puede ser cualquier identificador de JavaScript que no sea una palabra reservada. La <code><em>declaración</em></code> que identifica a una etiqueta puede ser cualquier enunciado.</p>
-
-<p><strong>Ejemplo</strong></p>
-
-<p>En este ejemplo, la etiqueta <code>markLoop</code> identifica un bucle <code>while</code>.</p>
-
-<p>markLoop: while (theMark === true) { doSomething(); }</p>
-
-<p>Declaración <code>break</code></p>
-
-<p>Usa la instrucción {{JSxRef("Sentencias/break", "break")}} para terminar un bucle, <code>switch</code> o junto con una declaración etiquetada.</p>
-
-<ul>
- <li>Cuando usas <code>break</code> sin una etiqueta, inmediatamente termina el <code>while</code>, <code>do-while</code>, <code>for</code> o <code>switch</code> y transfiere el control a la siguiente declaración.</li>
- <li>Cuando usas <code>break</code> con una etiqueta, termina la declaración etiquetada especificada.</li>
-</ul>
-
-<p>La sintaxis de la instrucción <code>break</code> se ve así:</p>
-
-<pre class="syntaxbox notranslate">break;
-break [<em>label</em>];
-</pre>
-
-<ol>
- <li>La primera forma de la sintaxis termina el bucle envolvente más interno o el <code>switch.</code></li>
- <li>La segunda forma de la sintaxis termina la instrucción etiquetada específica.</li>
-</ol>
-
-<h3 id="Ejemplo_1_2"><strong>Ejemplo</strong> <strong>1</strong></h3>
-
-<p>El siguiente ejemplo recorre en iteración los elementos de un arreglo hasta que encuentra el índice de un elemento cuyo valor es <code>theValue</code>:</p>
-
-<pre class="brush: js notranslate">for (let i = 0; i &lt; a.length; i++) {
-  if (a[i] === theValue) {
-    break;
-  }
-}</pre>
-
-<h3 id="Ejemplo_2_romper_una_etiqueta"><strong>Ejemplo 2:</strong> romper una etiqueta</h3>
-
-<pre class="brush: js notranslate">let x = 0;
-let z = 0;
-labelCancelLoops: while (true) {
-  console.log('Bucles externos: ' + x);
-  x += 1;
-  z = 1;
-  while (true) {
-    console.log('Bucles internos: ' + z);
-    z += 1;
-    if (z === 10 &amp;&amp; x === 10) {
-      break labelCancelLoops;
-    } else if (z === 10) {
-      break;
-    }
-  }
-}
-</pre>
-
-<h2 id="Declaración_continue">Declaración <code>continue</code></h2>
-
-<p>La instrucción {{JSxRef("Sentencias/continue", "continue")}} se puede usar para reiniciar un <code>while</code>, <code>do-while</code>, <code>for</code>, o declaración <code>label</code>.</p>
-
-<ul>
- <li>Cuando utilizas <code>continue</code> sin una etiqueta, finaliza la iteración actual del <code>while</code>, <code>do-while</code> o <code>for</code> y continúa la ejecución del bucle con la siguiente iteración. A diferencia de la instrucción <code>break</code>, <code>continue</code> no termina la ejecución del bucle por completo. En un bucle <code>while</code>, vuelve a la condición. En un bucle <code>for</code>, salta a la <code>expresión-incremento</code>.</li>
- <li>Cuando usas <code>continue</code> con una etiqueta, se aplica a la declaración de bucle identificada con esa etiqueta.</li>
-</ul>
-
-<p>La sintaxis de la instrucción <code>continue</code> se parece a la siguiente:</p>
-
-<pre class="syntaxbox notranslate">continue [<em>label</em>];
-</pre>
-
-<h3 id="Ejemplo_1_3"><strong>Ejemplo 1</strong></h3>
-
-<p>El siguiente ejemplo muestra un bucle <code>while</code> con una instrucción <code>continue</code> que se ejecuta cuando el valor de <code>i</code> es <code>3</code>. Por lo tanto, <code>n</code> toma los valores <code>1</code>, <code>3</code>, <code>7</code> y <code>12</code>.</p>
-
-<pre class="brush: js notranslate">let i = 0;
-let n = 0;
-while (i &lt; 5) {
-  i++;
-  if (i === 3) {
-    continue;
-  }
-  n += i;
-  console.log(n);
-}
-//1,3,7,12
-
-
-let i = 0;
-let n = 0;
-while (i &lt; 5) {
-  i++;
-  if (i === 3) {
-     // continue;
-  }
-  n += i;
-  console.log(n);
-}
-// 1,3,6,10,15
-</pre>
-
-<h3 id="Ejemplo_2_2"><strong>Ejemplo 2</strong></h3>
-
-<p>Una declaración etiquetada <em><code>checkiandj</code></em> contiene una declaración etiquetada <em><code>checkj</code></em>. Si se encuentra <code>continue</code>, el programa termina la iteración actual de <em><code>checkj</code></em> y comienza la siguiente iteración. Cada vez que se encuentra <code>continue</code>, <em><code>checkj</code></em> reitera hasta que su condición devuelve <code>false</code>. Cuando se devuelve <code>false</code>, el resto de la instrucción <em><code>checkiandj</code></em> se completa y <em><code>checkiandj</code></em> reitera hasta que su condición devuelve <code>false</code>. Cuando se devuelve <code>false</code>, el programa continúa en la declaración que sigue a <em><code>checkiandj</code></em>.</p>
-
-<p>Si <code>continue</code> tuviera una etiqueta de <em><code>checkiandj</code></em>, el programa continuaría en la parte superior de la declaración <em><code>checkiandj</code></em>.</p>
-
-<p>let i = 0; let j = 10; checkiandj: while (i &lt; 4) { console.log(i); i += 1; checkj: while (j &gt; 4) { console.log(j); j -= 1; if ((j % 2) === 0) { continue checkj; } console.log(j + 'es impar.'); } console.log('i = ' + i); console.log('j = ' + j); }</p>
-
-<h2 id="Declaración_for...in">Declaración <code>for...in</code></h2>
-
-<p>La instrucción {{JSxRef("Sentencias/for...in", "for...in")}} itera una variable especificada sobre todas las propiedades enumerables de un objeto. Para cada propiedad distinta, JavaScript ejecuta las instrucciones especificadas. Una declaración <code>for...in</code> tiene el siguiente aspecto:</p>
-
-<pre class="syntaxbox notranslate">for (variable in objeto)
-  instrucción
-</pre>
-
-<h3 id="Ejemplo_3"><strong>Ejemplo</strong></h3>
-
-<p>La siguiente función toma como argumento un objeto y el nombre del objeto. Luego itera sobre todas las propiedades del objeto y devuelve una cadena que enumera los nombres de las propiedades y sus valores.</p>
-
-<pre class="brush: js notranslate">function dump_props(obj, obj_name) {
-  let result = '';
-  for (let i in obj) {
-    result += obj_name + '.' + i + ' = ' + obj[i] + '&lt;br&gt;';
-  }
-  result += '&lt;hr&gt;';
-  return result;
-}
-</pre>
-
-<p>Para un objeto <code>car</code> con propiedades <code>make</code> y <code>model</code>, <code>result</code> sería:</p>
-
-<pre class="brush: js notranslate">car.make = Ford
-car.model = Mustang
-</pre>
-
-<h3 id="Arrays"><strong>Arrays</strong></h3>
-
-<p>Aunque puede ser tentador usar esto como una forma de iterar sobre los elementos {{JSxRef("Array")}}, la instrucción <code>for...in</code> devolverá el nombre de sus propiedades definidas por el usuario además de los índices numéricos.</p>
-
-<p>Por lo tanto, es mejor usar un bucle {{JSxRef("Sentencias/for", "for")}} tradicional con un índice numérico cuando se itera sobre arreglos, porque la instrucción <code>for...in</code> itera sobre las propiedades definidas por el usuario además de los elementos del arreglo, si modificas el objeto <code>Array</code> (tal como agregar propiedades o métodos personalizados).</p>
-
-<h2 id="Declaración_for...of">Declaración <code>for...of</code></h2>
-
-<p>La declaración {{JSxRef("Sentencias/for...of", "for...of")}} crea un bucle que se repite sobre {{JSxRef("../Guide/iterable", "objetos iterables")}} (incluidos {{JSxRef("Array")}}, {{JSxRef("Map")}}, {{JSxRef("Set")}}, objetos {{JSxRef("Funciones/arguments", "arguments")}} y así sucesivamente), invocando un gancho de iteración personalizado con declaraciones que se ejecutarán para el valor de cada distinta propiedad.</p>
-
-<pre class="syntaxbox notranslate">para (<em>variable</em> of <em>objeto</em>)
-  <em>expresión</em>
-</pre>
-
-<p>El siguiente ejemplo muestra la diferencia entre un bucle for<code>...in</code> y un bucle {{JSxRef("Sentencias/for...in", "for...in")}}. Mientras que <code>for...in</code> itera sobre los nombres de propiedad, <code>for...of</code> itera sobre los valores de propiedad:</p>
-
-<pre class="brush:js notranslate">const arr = [3, 5, 7];
-arr.foo = 'hola';
-
-for (let i in arr) {
-   console.log(i); // logs "0", "1", "2", "foo"
-}
-
-for (let i of arr) {
-   console.log(i); // logs 3, 5, 7
-}
-</pre>
-
-<p>{{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}</p>
diff --git a/files/es/web/javascript/guide/colecciones_indexadas/index.html b/files/es/web/javascript/guide/colecciones_indexadas/index.html
deleted file mode 100644
index baf55a84d5..0000000000
--- a/files/es/web/javascript/guide/colecciones_indexadas/index.html
+++ /dev/null
@@ -1,603 +0,0 @@
----
-title: Colecciones indexadas
-slug: Web/JavaScript/Guide/colecciones_indexadas
-tags:
-  - Array
-  - Arreglo
-  - Guía
-  - JavaScript
-  - 'l10n:priority'
-translation_of: Web/JavaScript/Guide/Indexed_collections
----
-<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}</div>
-
-<p class="summary">Este capítulo presenta colecciones de datos ordenados por un valor de índice. Esto incluye arreglos y construcciones similares a arreglos tal como objetos {{jsxref("Array")}} y objetos {{jsxref("TypedArray")}}.</p>
-
-<h2 id="El_objeto_Array">El objeto <code>Array</code></h2>
-
-<p>Un <em><dfn>array</dfn></em> es una lista ordenada de valores a los que te refieres con un nombre y un índice.</p>
-
-<p>Por ejemplo, considera un arreglo llamado <code>emp</code>, que contiene los nombres de los empleados indexados por su id de empleado numérico. De tal modo que <code>emp[0]</code> sería el empleado número cero, <code>emp[1]</code> el empleado número uno, y así sucesivamente.</p>
-
-<p>JavaScript no tiene un tipo de dato <code>array</code> explícito. Sin embargo, puedes utilizar el objeto <code>Array</code> predefinido y sus métodos para trabajar con arreglos en tus aplicaciones. El objeto <code>Array</code> tiene métodos para manipular arreglos de varias formas, tal como unirlos, invertirlos y ordenarlos. Tiene una propiedad para determinar la longitud del arreglo y otras propiedades para usar con expresiones regulares.</p>
-
-<h3 id="Crear_un_arreglo">Crear un arreglo</h3>
-
-<p>Las siguientes declaraciones crean arreglos equivalentes:</p>
-
-<pre class="brush: js notranslate">let arr = new Array(<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>)
-let arr = Array(<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>)
-let arr = [<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>]
-</pre>
-
-<p><code><var>element0</var>, <var>element1</var>, ..., <var>elementN</var></code> es una lista de valores para los elementos del arreglo. Cuando se especifican estos valores, el arreglo se inicia con ellos como elementos del arreglo. La propiedad <code>length</code> del arreglo se establece en el número de argumentos.</p>
-
-<p>La sintaxis de corchetes se denomina "arreglo literal" o "iniciador de arreglo". Es más corto que otras formas de creación de arreglos, por lo que generalmente se prefiere. Consulta <a href="/es/docs/Web/JavaScript/Guide/Grammar_and_types#Arreglos_literales">Arreglos literales</a> para obtener más detalles.</p>
-
-<p>Para crear un arreglo con una longitud distinta de cero, pero sin ningún elemento, se puede utilizar cualquiera de las siguientes:</p>
-
-<pre class="brush: js notranslate">// Esta...
-let arr = new Array(<var>arrayLength</var>)
-
-// ...da como resultado el mismo arreglo que este
-let arr = Array(<var>arrayLength</var>)
-
-
-// Esto tiene exactamente el mismo efecto
-let arr = []
-arr.length = <var>arrayLength</var>
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: En el código anterior, <code><var>arrayLength</var></code> debe ser un <code>Número</code>. De lo contrario, se creará un arreglo con un solo elemento (el valor proporcionado). Llamar a <code>arr.length</code> devolverá <code><var>arrayLength</var></code>, pero el arreglo no contiene ningún elemento. Un bucle {{jsxref("Statements/for...in", "for...in")}} no encontrarás ninguna propiedad en el arreglo.</p>
-</div>
-
-<p>Además de una variable recién definida como se muestra arriba, los arreglos también se pueden asignar como una propiedad a un objeto nuevo o existente:</p>
-
-<pre class="brush: js notranslate">let obj = {}
-// ...
-obj.prop = [element0, element1, ..., elementN]
-
-// O
-let obj = {prop: [element0, element1, ...., elementN]}
-</pre>
-
-<p>Si deseas iniciar un arreglo con un solo elemento, y el elemento resulta ser un <code>Número</code>, debes usar la sintaxis de corchetes. Cuando se pasa un solo valor <code>Number</code> al constructor o función <code>Array()</code>, se interpreta como un <code>arrayLength</code>, no como un solo elemento.</p>
-
-<pre class="brush: js notranslate">let arr = [42]       // Crea un arreglo con un solo elemento:
-                     // el número 42.
-
-let arr = Array(42)  // Crea un arreglo sin elementos
-                     // y arr.length establecidos en 42.
-                     //
-                     // Esto es equivalente a:
-let arr = []
-arr.length = 42
-</pre>
-
-<p>Llamar a <code>Array(<var>N</var>)</code> da como resultado un <code>RangeError</code>, si <code><var>N</var></code> no es un número entero cuya porción fraccionaria no es cero. El siguiente ejemplo ilustra este comportamiento.</p>
-
-<pre class="brush: js notranslate">let arr = Array(9.3)   // RangeError: Longitud de arreglo no válida
-</pre>
-
-<p>Si tu código necesita crear arreglos con elementos únicos de un tipo de dato arbitrario, es más seguro utilizar arreglos literales. Alternativamente, crea un arreglo vacío primero antes de agregarle el único elemento.</p>
-
-<p>En ES2015, puedes utilizar el método estático {{jsxref("Array.of")}} para crear arreglos con un solo elemento.</p>
-
-<pre class="brush: js notranslate">let wisenArray = Array.of(9.3)   // wisenArray contiene solo un elemento 9.3</pre>
-
-<h3 id="Refiriéndose_a_elementos_del_arreglo">Refiriéndose a elementos del arreglo</h3>
-
-<p>Dado que los elementos también son propiedades, puedes acceder a ellos usando la <a href="/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors">propiedad <code>accessors</code></a>. Supongamos que defines el siguiente arreglo:</p>
-
-<pre class="brush: js notranslate">let myArray = ['Wind', 'Rain', 'Fire']
-</pre>
-
-<p>Puedes referirte al primer elemento del arreglo como <code>myArray[0]</code>, al segundo elemento del arreglo como <code>myArray[1]</code>, etc<span class="st">…</span> El índice de los elementos comienza en cero.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: También puedes utilizar la <a href="/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors">propiedad <code>accessors</code></a> para acceder a otras propiedades del arreglo, como con un objeto.</p>
-
-<pre class="brush: js notranslate">let arr = ['one', 'two', 'three']
-arr[2]          // three
-arr['length']   // 3
-</pre>
-</div>
-
-<h3 id="Llenar_un_arreglo">Llenar un arreglo</h3>
-
-<p>Puedes llenar un arreglo asignando valores a sus elementos. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">let emp = []
-emp[0] = 'Casey Jones'
-emp[1] = 'Phil Lesh'
-emp[2] = 'August West'
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Si proporcionas un valor no entero al operador <code>array</code> en el código anterior, se creará una propiedad en el objeto que representa al arreglo, en lugar de un elemento del arreglo.</p>
-
-<pre class="brush: js notranslate">let arr = []
-arr[3.4] = 'Oranges'
-console.log(arr.length)                 // 0
-console.log(arr.hasOwnProperty(3.4))    // true
-</pre>
-</div>
-
-<p>También puedes rellenar un arreglo cuando lo creas:</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('Hello', myVar, 3.14159)
-// OR
-let myArray = ['Mango', 'Apple', 'Orange']
-</pre>
-
-<h3 id="Entendiendo_length">Entendiendo <code>length</code></h3>
-
-<p>A nivel de implementación, los arreglos de JavaScript almacenan sus elementos como propiedades de objeto estándar, utilizando el índice del arreglo como nombre de propiedad.</p>
-
-<p>La propiedad <code>length</code> es especial. Siempre devuelve el índice del último elemento más uno. (En el siguiente ejemplo, <code>'Dusty'</code> está indexado en <code>30</code>, por lo que <code>cats.length</code> devuelve <code>30 + 1</code>).</p>
-
-<p>Recuerda, los índices del Array JavaScript están basados en 0: comienzan en <code>0</code>, no en <code>1</code>. Esto significa que la propiedad <code>length</code> será uno más que el índice más alto almacenado en el arreglo:</p>
-
-<pre class="brush: js notranslate">let cats = []
-cats[30] = ['Dusty']
-console.log(cats.length) // 31
-</pre>
-
-<p>También puedes asignar la propiedad <code>length</code>.</p>
-
-<p>Escribir un valor que sea más corto que el número de elementos almacenados trunca el arreglo. Escribir <code>0</code> lo vacía por completo:</p>
-
-<pre class="brush: js notranslate">let cats = ['Dusty', 'Misty', 'Twiggy']
-console.log(cats.length)  // 3
-
-cats.length = 2
-console.log(cats)  // logs "Dusty, Misty" - Twiggy se ha eliminado
-
-cats.length = 0
-console.log(cats)  // logs []; el arreglo cats está vacío
-
-cats.length = 3
-console.log(cats)  // logs [ &lt;3 elementos vacíos&gt; ]
-</pre>
-
-<h3 id="Iterando_sobre_arreglos">Iterando sobre arreglos</h3>
-
-<p>Una operación común es iterar sobre los valores de un arreglo, procesando cada uno de alguna manera. La forma más sencilla de hacerlo es la siguiente:</p>
-
-<pre class="brush: js notranslate">let colors = ['red', 'green', 'blue']
-for (let i = 0; i &lt; colors.length; i++) {
-  console.log(colors[i])
-}
-</pre>
-
-<p>Si sabes que ninguno de los elementos de tu arreglo se evalúa como <code>false</code> en un contexto booleano, si tu arreglo consta solo de nodos <a href="/es/docs/DOM" title="/es/docs/DOM">DOM</a>, por ejemplo, puedes usar un lenguaje eficiente:</p>
-
-<pre class="brush: js notranslate">let divs = document.getElementsByTagName('div')
-for (let i = 0, div; div = divs[i]; i++) {
-  /* Procesar div de alguna manera */
-}
-</pre>
-
-<p>Esto evita la sobrecarga de verificar la longitud del arreglo y garantiza que la variable <code><var>div</var></code> se reasigne al elemento actual cada vez que se realiza el bucle para mayor comodidad.</p>
-
-<p>El método {{jsxref("Array.forEach", "forEach()")}} proporciona otra forma de iterar sobre un arreglo:</p>
-
-<pre class="brush: js notranslate">let colors = ['red', 'green', 'blue']
-colors.forEach(function(color) {
-  console.log(color)
-})
-// red
-// green
-// blue
-</pre>
-
-<p>Alternativamente, puedes acortar el código para el parámetro <code>forEach</code> con las funciones de flecha ES2015:</p>
-
-<pre class="brush: js notranslate">let colors = ['red', 'green', 'blue']
-colors.forEach(color =&gt; console.log(color))
-// red
-// green
-// blue
-</pre>
-
-<p>La función pasada a <code>forEach</code> se ejecuta una vez por cada elemento del arreglo, con el elemento de arreglo pasado como argumento de la función. Los valores no asignados no se iteran en un bucle <code>forEach</code>.</p>
-
-<p>Ten en cuenta que los elementos de un arreglo que se omiten cuando se define el arreglo no se enumeran cuando lo itera <code>forEach</code>, pero <em>se enumeran</em> cuando <code>undefined</code> se ha asignado manualmente al elemento:</p>
-
-<pre class="brush: js notranslate">let array = ['first', 'second', , 'fourth']
-
-array.forEach(function(element) {
-  console.log(element)
-})
-// first
-// second
-// fourth
-
-if (array[2] === undefined) {
-  console.log('array[2] is undefined')  // true
-}
-
-array = ['first', 'second', undefined, 'fourth']
-
-array.forEach(function(element) {
-  console.log(element)
-})
-// first
-// second
-// undefined
-// fourth
-</pre>
-
-<p>Dado que los elementos de JavaScript se guardan como propiedades de objeto estándar, no es recomendable iterar a través de arreglos de JavaScript usando bucles {{jsxref("Statements/for...in", "for...in")}}, porque se enumerarán los elementos normales y todas las propiedades enumerables.</p>
-
-<h3 id="Métodos_de_array">Métodos de array</h3>
-
-<p>El objeto {{jsxref("Array")}} tiene los siguientes métodos:</p>
-
-<p>{{jsxref("Array.concat", "concat()")}} une dos o más arreglos y devuelve un nuevo arreglo.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('1', '2', '3')
-myArray = myArray.concat('a', 'b', 'c')
-// myArray is now ["1", "2", "3", "a", "b", "c"]
-</pre>
-
-<p>{{jsxref("Array.join", "join(delimiter = ',')")}} une todos los elementos de un arreglo en una cadena.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('Viento', 'Lluvia', 'Fuego')
-let list = myArray.join('-')   // la lista es "Viento - Lluvia - Fuego"
-</pre>
-
-<p>{{jsxref("Array.push", "push()")}} agrega uno o más elementos al final de un arreglo y devuelve la <code>longitud</code> resultante del arreglo.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('1', '2')
-myArray.push('3') // myArray ahora es ["1", "2", "3"]
-</pre>
-
-<p>{{jsxref("Array.pop", "pop()")}} elimina el último elemento de un arreglo y devuelve ese elemento.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array ('1', '2', '3')
-let last = myArray.pop()
-// myArray ahora es ["1", "2"], last = "3"
-</pre>
-
-<p>{{jsxref("Array.shift", "shift()")}} elimina el primer elemento de un arreglo y devuelve ese elemento.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array ('1', '2', '3')
-let first = myArray.shift()
-// myArray ahora es ["2", "3"], first es "1"
-</pre>
-
-<p>{{jsxref("Array.unshift", "unshift()")}} agrega uno o más elementos al frente de un arreglo y devuelve la nueva longitud del arreglo.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('1', '2', '3')
-myArray.unshift('4', '5')
-// myArray se convierte en ["4", "5", "1", "2", "3"]
-</pre>
-
-<p>{{jsxref("Array.slice", "slice(start_index, upto_index)")}} extrae una sección de un arreglo y devuelve un nuevo arreglo.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('a', 'b', 'c', 'd', 'e')
-myArray = myArray.slice(1, 4) // comienza en el índice 1 y extrae todos los elementos
-                               // hasta el índice 3, devuelve ["b", "c", "d"]
-</pre>
-
-<p>{{jsxref("Array.splice", "splice(index, count_to_remove, addElement1, addElement2, ...)")}} elimina elementos de un arreglo y (opcionalmente) los reemplaza. Devuelve los elementos que se eliminaron del arreglo.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('1', '2', '3', '4', '5')
-myArray.splice(1, 3, 'a', 'b', 'c', 'd')
-// myArray ahora es ["1", "a", "b", "c", "d", "5"]
-// Este código comenzó en el índice uno (o donde estaba el "2"),
-// eliminó 3 elementos allí, y luego insertó todos los consecutivos
-// elementos en su lugar.
-</pre>
-
-<p>{{jsxref("Array.reverse", "reverse()")}} transpone los elementos de un arreglo, en su lugar: el primer elemento del arreglo se convierte en el último y el último en el primero. Devuelve una referencia al arreglo.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array ('1', '2', '3')
-myArray.reverse()
-// transpone el arreglo para que myArray = ["3", "2", "1"]
-</pre>
-
-<p>{{jsxref("Array.sort", "sort()")}} ordena los elementos de un arreglo en su lugar y devuelve una referencia al arreglo.</p>
-
-<pre class="brush: js notranslate">let myArray = new Array('Viento', 'Lluvia', 'Fuego')
-myArray.sort()
-// ordena el arreglo para que myArray = ["Fuego", "Lluvia", "Viento"]
-</pre>
-
-<p><code>sort()</code> también puede tomar una función retrollamada para determinar cómo se comparan los elementos del arreglo.</p>
-
-<p>El método <code>sort</code> (y otros a continuación) que reciben una retrollamada se conocen como <em>métodos iterativos</em>, porque iteran sobre todo el arreglo de alguna manera. Cada uno toma un segundo argumento opcional llamado <code><var>thisObject</var></code>. Si se proporciona, <code><var>thisObject</var></code> se convierte en el valor de la palabra clave <code>this</code> dentro del cuerpo de la función retrollamada. Si no se proporciona, como en otros casos en los que se invoca una función fuera de un contexto de objeto explícito, <code>this</code> se referirá al objeto global (<a href="/es/docs/Web/API/Window" title="La interfaz &lt;code>Window&lt;/code> representa una ventana que contiene un documento DOM; la propiedad &lt;code>document&lt;/code> apunta al documento DOM cargado en esa ventana."><code>window</code></a>) cuando se usa la función de flecha como retrollamada, o <code>undefined</code> cuando se usa una función normal como retrollamada.</p>
-
-<p>La función retrollamada se invoca con dos argumentos, que son elementos del arreglo.</p>
-
-<p>La siguiente función compara dos valores y devuelve uno de tres valores:</p>
-
-<p>Por ejemplo, lo siguiente se ordenará por la última letra de una cadena:</p>
-
-<pre class="brush: js notranslate">let sortFn = function(a, b) {
-  if (a[a.length - 1] &lt; b[b.length - 1]) return -1;
-  if (a[a.length - 1] &gt; b[b.length - 1]) return 1;
-  if (a[a.length - 1] == b[b.length - 1]) return 0;
-}
-myArray.sort(sortFn)
-// ordena el arreglo para que myArray = ["Viento", "Fuego", "Lluvia"]</pre>
-
-<ul>
- <li>si <code><var>a</var></code> es menor que <code><var>b</var></code> por el sistema de clasificación, devuelve <code>-1</code> ( o cualquier número negativo)</li>
- <li>si <code><var>a</var></code> es mayor que <code><var>b</var></code> por el sistema de clasificación, devuelve <code>1</code> (o cualquier número positivo)</li>
- <li>si <code><var>a</var></code> y <code><var>b</var></code> se consideran equivalentes, devuelve <code>0</code>.</li>
-</ul>
-
-<p>{{jsxref("Array.indexOf", "indexOf (searchElement[, fromIndex])")}} busca en el arreglo <code><var>searchElement</var></code> y devuelve el índice de la primera coincidencia.</p>
-
-<pre class="brush: js notranslate">let a = ['a', 'b', 'a', 'b', 'a']
-console.log(a.indexOf('b')) // registros 1
-
-// Ahora inténtalo de nuevo, comenzando después de la última coincidencia
-console.log(a.indexOf('b', 2)) // registra 3
-console.log(a.indexOf('z')) // logs -1, porque no se encontró 'z'
-</pre>
-
-<p>{{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement [, fromIndex])")}} funciona como <code>indexOf</code>, pero comienza al final y busca hacia atrás.</p>
-
-<pre class="brush: js notranslate">let​a = ['a', 'b', 'c', 'd', 'a', 'b']
-console.log(a.lastIndexOf('b')) // registra 5
-
-// Ahora inténtalo de nuevo, comenzando desde antes de la última coincidencia
-console.log(a.lastIndexOf('b', 4)) // registra 1
-console.log(a.lastIndexOf('z'))    // registra -1
-</pre>
-
-<p>{{jsxref("Array.forEach", "forEach(callback[, thisObject])")}} ejecuta <code><var>callback</var></code> en cada elemento del arreglo y devuelve <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">let​a = ['a', 'b', 'c']
-a.forEach(function(elemento) { console.log(elemento) })
-// registra cada elemento por turno
-</pre>
-
-<p>{{jsxref("Array.map", "map(callback [, thisObject])")}} devuelve un nuevo arreglo del valor de retorno de ejecutar <code><var>callback</var></code> en cada elemento del arreglo.</p>
-
-<pre class="brush: js notranslate">let a1 = ['a', 'b', 'c']
-let a2 = a1.map(function(item) { return item.toUpperCase() })
-console.log(a2) // registra ['A', 'B', 'C']
-</pre>
-
-<p>{{jsxref("Array.filter", "filter(callback [, thisObject])")}} devuelve un nuevo arreglo que contiene los elementos para los cuales <code><var>callback</var></code> devolvió <code>true</code>.</p>
-
-<pre class="brush: js notranslate">let a1 = ['a', 10, 'b', 20, 'c', 30]
-let a2 = a1.filter(function(item) { return typeof item === 'number'; })
-console.log(a2)  // registra [10, 20, 30]
-</pre>
-
-<p>{{jsxref("Array.every", "every(callback [, thisObject])")}} devuelve <code>true</code> si <code><var>callback</var></code> devuelve <code>true</code> para cada elemento del arreglo.</p>
-
-<pre class="brush: js notranslate">function isNumber(value) {
-  return typeof value === 'number'
-}
-let a1 = [1, 2, 3]
-console.log(a1.every(isNumber))  // registra true
-let a2 = [1, '2', 3]
-console.log(a2.every(isNumber))  // registra false
-</pre>
-
-<p>{{jsxref("Array.some", "some(callback[, thisObject])")}} devuelve <code>true</code> si <code><var>callback</var></code> devuelve <code>true</code> para al menos un elemento del arreglo.</p>
-
-<pre class="brush: js notranslate">function isNumber(value) {
-  return typeof value === 'number'
-}
-let a1 = [1, 2, 3]
-console.log(a1.some(isNumber))  // registra true
-let a2 = [1, '2', 3]
-console.log(a2.some(isNumber))  // registra true
-let a3 = ['1', '2', '3']
-console.log(a3.some(isNumber))  // registra false
-</pre>
-
-<p>{{jsxref("Array.reduce", "reduce(callback[, initialValue])")}} aplica <code><var>callback</var>(<var>acumulador</var>, <var>currentValue</var>[, <var>currentIndex</var>[,<var>array</var>]])</code> para cada valor en el arreglo con el fin de reducir la lista de elementos a un solo valor. La función <code>reduce</code> devuelve el valor final devuelto por la función <code><var>callback</var></code>. </p>
-
-<p>Si se especifica <code><var>initialValue</var></code>, entonces <code><var>callback</var></code> se llama con <code><var>initialValue</var></code> como primer valor de parámetro y el valor del primer elemento del arreglo como segundo valor de parámetro. </p>
-
-<p>Si <code><var>initialValue</var></code> <em>no</em> es especificado, entonces <code><var>callback</var></code> los primeros dos valores de parámetro deberán ser el primer y segundo elemento del arreglo. En <em>cada</em> llamada subsiguiente, el valor del primer parámetro será el valor de <code><var>callback</var></code> devuelto en la llamada anterior, y el valor del segundo parámetro será el siguiente valor en el arreglo.</p>
-
-<p>Si <code><var>callback</var></code> necesita acceso al índice del elemento que se está procesando, al acceder al arreglo completo, están disponibles como parámetros opcionales.</p>
-
-<pre class="brush: js notranslate">let​a = [10, 20, 30]
-let total = a.reduce(function(accumulator, currentValue) { return accumulator + currentValue }, 0)
-console.log(total) // Imprime 60
-</pre>
-
-<p>{{jsxref("Array.reduceRight", "reduceRight(callback[, initialValue])")}} funciona como <code>reduce()</code>, pero comienza con el último elemento.</p>
-
-<p><code>reduce</code> y <code>reduceRight</code> son los menos obvios de los métodos de arreglo iterativos. Se deben utilizar para algoritmos que combinan dos valores de forma recursiva para reducir una secuencia a un solo valor.</p>
-
-<h3 id="Arreglos_multidimensionales">Arreglos multidimensionales</h3>
-
-<p>Los arreglos se pueden anidar, lo cual significa que un arreglo puede contener otro arreglo como elemento. Usando esta característica de los arreglos de JavaScript, se pueden crear arreglos multidimensionales.</p>
-
-<p>El siguiente código crea un arreglo bidimensional.</p>
-
-<pre class="brush: js notranslate">let a = new Array(4)
-for (let i = 0; i &lt; 4; i++) {
-  a[i] = new Array(4)
-  for (let j = 0; j &lt; 4; j++) {
-    a[i][j] = '[' + i + ', ' + j + ']'
-  }
-}
-</pre>
-
-<p>Este ejemplo crea un arreglo con las siguientes filas:</p>
-
-<pre class="notranslate">Row 0: [0, 0] [0, 1] [0, 2] [0, 3]
-Row 1: [1, 0] [1, 1] [1, 2] [1, 3]
-Row 2: [2, 0] [2, 1] [2, 2] [2, 3]
-Row 3: [3, 0] [3, 1] [3, 2] [3, 3]
-</pre>
-
-<h3 id="Usar_arreglos_para_almacenar_otras_propiedades">Usar arreglos para almacenar otras propiedades</h3>
-
-<p>Los arreglos también se pueden utilizar como objetos para almacenar información relacionada.</p>
-
-<pre class="brush: js notranslate"><code>const arr = [1, 2, 3];
-arr.property = "value";
-console.log(arr.property);  // Registra "value"</code>
-</pre>
-
-<h3 id="Arreglos_y_expresiones_regulares">Arreglos y expresiones regulares</h3>
-
-<p>Cuando un arreglo es el resultado de una coincidencia entre una expresión regular y una cadena, el arreglo devuelve propiedades y elementos que proporcionan información sobre la coincidencia. Un arreglo es el valor de retorno de {{jsxref("Global_Objects/RegExp/exec", "RegExp.exec()")}}, {{jsxref("Global_Objects/String/match", "String.match()")}} y {{jsxref("Global_Objects/String/split", "String.split()")}}. Para obtener información sobre el uso de arreglos con expresiones regulares, consulta <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">Expresiones regulares</a>.</p>
-
-<h3 id="Trabajar_con_objetos_tipo_array">Trabajar con objetos tipo array</h3>
-
-<p>Algunos objetos JavaScript, como <a href="/es/docs/Web/API/NodeList" title="Los objetos &lt;code>NodeList&lt;/code> son colecciones de nodos, generalmente devueltos por propiedades como ↑Node.childNodes↓ y métodos como ↑document.querySelectorAll()↓."><code>NodeList</code></a> devueltos por <a href="/es/docs/Web/API/Document/getElementsByTagName" title="devuelve una &lt;code>HTMLCollection&lt;/code> de elementos con el nombre de etiqueta dado."><code>document.getElementsByTagName()</code></a> o un objeto {{jsxref("Functions/arguments", "arguments")}} disponible dentro del cuerpo de una función, se ven y se comportan como arreglos en la superficie pero no comparten todos sus métodos. El objeto <code>arguments</code> proporciona un atributo {{jsxref("Global_Objects/Function/length", "length")}} pero no implementa el método {{jsxref("Array.forEach", "forEach()")}}, por ejemplo.</p>
-
-<p>Los métodos de arreglo no se pueden llamar directamente en objetos similares a un arreglo.</p>
-
-<pre class="brush: js example-bad notranslate"><code>function printArguments() {
-  arguments.forEach(function(item) {// <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox-stackTrace reps-custom-format">TypeError: <span class="objectBox objectBox-string">arguments.forEach no es una función</span></span></span></span></span>
-    console.log(item);
-  });
-}</code>
-</pre>
-
-<p>Pero puedes llamarlos indirectamente usando {{jsxref("Global_Objects/Function/call", "Function.prototype.call()")}}.</p>
-
-<pre class="brush: js example-good notranslate"><code>function printArguments() {
-  Array.prototype.forEach.call(arguments, function(item) {
-    console.log(item);
-  });
-}</code>
-</pre>
-
-<p>Los métodos de prototipos de arreglos también se pueden utilizar en cadenas, ya que proporcionan acceso secuencial a sus caracteres de forma similar a los arreglos:</p>
-
-<pre class="brush: js notranslate">Array.prototype.forEach.call('a string', function(chr) {
-  console.log(chr)
-})
-</pre>
-
-<h2 id="Arrays_tipados">Arrays tipados</h2>
-
-<p><a href="/es/docs/Web/JavaScript/Typed_arrays">Los arreglos tipados en JavaScript</a> son objetos similares a arreglos y proporcionan un mecanismo para acceder a datos binarios sin procesar. Como ya sabes, los objetos {{jsxref("Array")}} crecen y se encogen dinámicamente y pueden tener cualquier valor de JavaScript. Los motores de JavaScript realizan optimizaciones para que estos arreglos sean rápidos. Sin embargo, a medida que las aplicaciones web se vuelven cada vez más poderosas, agregando características como manipulación de audio y video, acceso a datos sin procesar usando <a href="/es/docs/WebSockets">WebSockets</a>, y así sucesivamente, ha quedado claro que hay momentos en los que sería útil para que el código JavaScript pueda manipular rápida y fácilmente datos binarios sin procesar en arreglos tipados.</p>
-
-<h3 id="Búferes_y_vistas_arquitectura_de_los_arreglos_con_tipo">Búferes y vistas: arquitectura de los arreglos con tipo</h3>
-
-<p>Para lograr la máxima flexibilidad y eficiencia, los arreglos de JavaScript dividen la implementación en <strong>búferes</strong> y <strong>vistas</strong>. Un búfer (implementado por el objeto {{jsxref("ArrayBuffer")}} es un objeto que representa una porción de datos; no tiene un formato del que hablar y no ofrece ningún mecanismo para acceder a su contenido. Para acceder a la memoria contenida en un búfer, necesitas usar una vista. Una vista proporciona un <strong>contexto </strong>, es decir, un tipo de datos, un desplazamiento inicial y un número de elementos, que convierte los datos en un arreglo con tipo real.</p>
-
-<p><img alt="Arreglos tipados en un &lt;code>ArrayBuffer&lt;/code>" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p>
-
-<h3 id="ArrayBuffer"><code>ArrayBuffer</code></h3>
-
-<p>{{jsxref("ArrayBuffer")}} es un tipo de dato que se utiliza para representar un búfer de datos binarios genérico de longitud fija. No puedes manipular directamente el contenido de un <code>ArrayBuffer</code>; en su lugar, creas una vista de arreglo con tipo o un {{jsxref("DataView")}} que representa el búfer en un formato específico, y lo usa para leer y escribir el contenido del búfer.</p>
-
-<h3 id="Vistas_de_arreglos_tipados">Vistas de arreglos tipados</h3>
-
-<p>Las vistas de arreglos tipados tienen nombres autodescriptivos y proporcionan vistas para todos los tipos numéricos habituales como <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> y así sucesivamente. Hay una vista de arreglo con tipo especial, {jsxref("Uint8ClampedArray")}}, que fija los valores entre <code>0</code> y <code>255</code>. Esto es útil para <a href="/es/docs/Web/API/ImageData">procesamiento de datos de Canvas</a>, por ejemplo.</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th class="header" scope="col">Tipo</th>
-   <th class="header" scope="col">Rango de valores</th>
-   <th class="header" scope="col">Tamaño en bytes</th>
-   <th class="header" scope="col">Descripción</th>
-   <th class="header" scope="col">Tipo de IDL web</th>
-   <th class="header" scope="col">Tipo C equivalente</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{jsxref("Int8Array")}}</td>
-   <td><code>-128</code> a <code>127</code></td>
-   <td>1</td>
-   <td>Dos enteros complementarios de 8 bits con signo</td>
-   <td><code>byte</code></td>
-   <td><code>int8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint8Array")}}</td>
-   <td><code>0</code> a <code>255</code></td>
-   <td>1</td>
-   <td>Entero de 8-bit sin signo</td>
-   <td><code>octeto</code></td>
-   <td><code>uint8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint8ClampedArray")}}</td>
-   <td><code>0</code> a <code>255</code></td>
-   <td>1</td>
-   <td>Entero de 8 bits sin signo (sujeto)</td>
-   <td><code>octeto</code></td>
-   <td><code>uint8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Int16Array")}}</td>
-   <td><code>-32768</code> a <code>32767</code></td>
-   <td>2</td>
-   <td>Dos enteros complementarios de 16 bits con signo</td>
-   <td><code>short</code></td>
-   <td><code>int16_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint16Array")}}</td>
-   <td><code>0</code> a <code>65535</code></td>
-   <td>2</td>
-   <td>Entero de 16 bits sin signo</td>
-   <td><code>short sin signo</code></td>
-   <td><code>uint16_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Int32Array")}}</td>
-   <td><code>-2147483648</code> a <code>2147483647</code></td>
-   <td>4</td>
-   <td>dos enteros complementarios de 32 bits con signo</td>
-   <td><code>long</code></td>
-   <td><code>int32_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint32Array")}}</td>
-   <td><code>0</code> a <code>4294967295</code></td>
-   <td>4</td>
-   <td>Enteros de 32 bits sin signo</td>
-   <td><code>long sin signo</code></td>
-   <td><code>uint32_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Float32Array")}}</td>
-   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>38</sup></code></td>
-   <td>4</td>
-   <td>Número de coma flotante IEEE de 32 bits (7 dígitos significativos, p. ej., <code>1.1234567</code>)</td>
-   <td><code>float sin restricciones</code></td>
-   <td><code>float</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Float64Array")}}</td>
-   <td><code>5.0</code><span>×</span><code>10<sup>-324</sup></code> a <code>1.8</code><span>×</span><code>10<sup>308</sup></code></td>
-   <td>8</td>
-   <td>Número de coma flotante IEEE de 64 bits (16 dígitos significativos, por ejemplo,<code>1.123 ... 15</code>)</td>
-   <td><code>double sin restricciones</code></td>
-   <td><code>double</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("BigInt64Array")}}</td>
-   <td><code>-2<sup>63</sup></code> a <code>2<sup>63</sup>-1</code></td>
-   <td>8</td>
-   <td>Dos enteros complementarios de 64 bits con signo</td>
-   <td><code>bigint</code></td>
-   <td><code>int64_t (long long con signo)</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("BigUint64Array")}}</td>
-   <td><code>0</code> a <code>2<sup>64</sup>-1</code></td>
-   <td>8</td>
-   <td>Entero de 64 bits sin signo</td>
-   <td><code>bigint</code></td>
-   <td><code>uint64_t (long long sin signo)</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Para obtener más información, consulta <a href="/es/docs/Web/JavaScript/Typed_arrays">Arreglos tipados en JavaScript</a> y la documentación de referencia para los diferentes objetos {{jsxref("TypedArray")}}.</p>
-
-<p>{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}</p>
diff --git a/files/es/web/javascript/guide/control_de_flujo_y_manejo_de_errores/index.html b/files/es/web/javascript/guide/control_de_flujo_y_manejo_de_errores/index.html
deleted file mode 100644
index d685818029..0000000000
--- a/files/es/web/javascript/guide/control_de_flujo_y_manejo_de_errores/index.html
+++ /dev/null
@@ -1,456 +0,0 @@
----
-title: Control de flujo y manejo de errores
-slug: Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores
-tags:
-  - Control de flujo
-  - Guía
-  - JavaScript
-  - Lógica
-  - Manejo de errores
-  - Novato
-  - Principiantes
-  - Promesas
-  - declaraciones
-  - 'l10n:priority'
-translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling
----
-<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Grammar_and_types", "Web/JavaScript/Guide/Loops_and_iteration")}}</div>
-
-<p class="seoSummary">JavaScript admite un compacto conjunto de declaraciones, específicamente declaraciones de control de flujo, que puedes utilizar para incorporar una gran cantidad de interactividad en tu aplicación. Este capítulo proporciona una descripción de estas declaraciones.</p>
-
-<p>La {{JSxRef("Sentencias", "referencia de JavaScript")}} contiene detalles exhaustivos sobre las declaraciones de este capítulo. El carácter de punto y coma (<code>;</code>) se utiliza para separar declaraciones en código JavaScript.</p>
-
-<p>Todas las expresiones e instrucciones de JavaScript también son una declaración. Consulta {{JSxRef("../Guide/Expressions_and_Operators", "Expresiones y operadores")}} para obtener información completa sobre las expresiones.</p>
-
-<h2 id="Declaración_de_bloque">Declaración de bloque</h2>
-
-<p>La declaración más básica es una <dfn>declaración de bloque</dfn>, que se utiliza para agrupar instrucciones. El bloque está delimitado por un par de llaves:</p>
-
-<pre class="syntaxbox notranslate">{
-  <var>statement_1</var>;
-  <var>statement_2</var>;
-  ⋮
-  <var>statement_n</var>;
-}
-</pre>
-
-<h3 id="Ejemplo"><strong>Ejemplo</strong></h3>
-
-<p>Las declaraciones de bloque se utilizan comúnmente con declaraciones de control de flujo (<code>if</code>, <code>for</code>, <code>while</code>).</p>
-
-<pre class="brush: js notranslate">while (x &lt; 10) {
-  x++;
-}
-</pre>
-
-<p>Aquí, <code>{ x++; }</code> es la declaración de bloque.</p>
-
-<div class="blockIndicator note">
-<p><strong>Importante</strong>: JavaScript anterior a ECMAScript2015 (6<sup>a</sup> edición) <strong>no</strong> tiene ámbito de bloque. En JavaScript más antiguo, las variables introducidas dentro de un bloque tienen como ámbito la función o script que las contiene, y los efectos de establecerlas persisten más allá del bloque en sí mismo. En otras palabras, las <em>declaraciones de bloque no definen un ámbito</em>.</p>
-
-<p>Los bloques "independientes" en JavaScript pueden producir resultados completamente diferentes de los que producirían en C o Java. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">var x = 1;
-{
-  var x = 2;
-}
-console.log(x); // muestra 2
-</pre>
-
-<p>Esto muestra <code>2</code> porque la instrucción <code>var x</code> dentro del bloque está en el mismo ámbito que la instrucción <code>var x</code> anterior del bloque. (En C o Java, el código equivalente habría generado <code>1</code>).</p>
-
-<p><strong>A partir de ECMAScript2015</strong>, las declaraciones de variables <code>let</code> y <code>const</code> tienen un ámbito de bloque. Consulta las páginas de referencia de {{JSxRef("Sentencias/let", "let")}} y {{JSxRef("Sentencias/const", "const")}} para obtener más información.</p>
-</div>
-
-<h2 id="Expresiones_condicionales">Expresiones condicionales</h2>
-
-<p>Una expresión condicional es un conjunto de instrucciones que se ejecutarán si una condición especificada es verdadera. JavaScript admite dos expresiones condicionales: <code>if...else</code> y <code>switch</code>.</p>
-
-<h3 id="Expresión_if...else">Expresión <code>if...else</code></h3>
-
-<p>Utiliza la expresión <code>if</code> para ejecutar una instrucción si una condición lógica es <code>true</code>. Utiliza la cláusula opcional <code>else</code> para ejecutar una instrucción si la condición es <code>false</code>.</p>
-
-<p>Una declaración <code>if</code> se ve así:</p>
-
-<pre class="syntaxbox notranslate">if (<var>condition</var>) {
-  <var>statement_1</var>;
-} else {
-  <var>statement_2</var>;
-}</pre>
-
-<p>Aquí, la <code><var>condition</var></code> puede ser cualquier expresión que se evalúe como <code>true</code> o <code>false</code>. (Consulta {{JSxRef("Objetos_globales/Boolean", "Boolean", "#Description")}} para obtener una explicación de lo que se evalúa como <code>true</code> y <code>false</code>).</p>
-
-<p>Si <code><var>condition</var></code> se evalúa como <code>true</code>, se ejecuta <code><var>statement_1</var></code>. De lo contrario, se ejecuta <code><var>statement_2</var></code>. <code><var>statement_1</var></code> y <code><var>statement_2</var></code> pueden ser cualquier declaración, incluidas otras declaraciones <code>if</code> anidadas.</p>
-
-<p>También puedes componer las declaraciones usando <code>else if</code> para que se prueben varias condiciones en secuencia, de la siguiente manera:</p>
-
-<pre class="syntaxbox notranslate">if (<var>condition_1</var>) {
-  <var>statement_1</var>;
-} else if (<var>condition_2</var>) {
-  <var>statement_2</var>;
-} else if (<var>condition_n</var>) {
-  <var>statement_n</var>;
-} else {
-  <var>statement_last</var>;
-}
-</pre>
-
-<p>En el caso de múltiples condiciones, solo se ejecutará la primera condición lógica que se evalúe como <code>true</code>. Para ejecutar múltiples declaraciones, agrúpalas dentro de una declaración de bloque (<code>{ … }</code>).</p>
-
-<h4 id="Mejores_prácticas">Mejores prácticas</h4>
-
-<p>En general, es una buena práctica usar siempre declaraciones de bloque, <em>especialmente</em> al anidar declaraciones <code>if</code>:</p>
-
-<pre class="syntaxbox notranslate">if (<var>condition</var>) {
-  <var>statement_1_runs_if_condition_is_true</var>;
-  <var>statement_2_runs_if_condition_is_true</var>;
-} else {
-  <var>statement_3_runs_if_condition_is_false</var>;
-  <var>statement_4_runs_if_condition_is_false</var>;
-}
-</pre>
-
-<p>No es aconsejable utilizar asignaciones simples en una expresión condicional, porque la asignación se puede confundir con la igualdad al mirar el código.</p>
-
-<p>Por ejemplo, <em>no</em> escribas un código como este:</p>
-
-<pre class="example-bad brush: js notranslate">// Propenso a ser mal interpretado como "x == y"
-if (x = y) {
-  /* expresiones aquí */
-}
-</pre>
-
-<p>Si necesitas usar una tarea en una expresión condicional, una práctica común es poner paréntesis adicionales alrededor de la asignación, así:</p>
-
-<pre class="example-good brush: js notranslate">if ((x = y)) {
-  /* expresiones aquí */
-}
-</pre>
-
-<h4 id="Valores_falsos">Valores falsos</h4>
-
-<p>Los siguientes valores se evalúan como <code>false</code> (también conocidos como valores {{Glossary("Falsy")}}:</p>
-
-<ul>
- <li><code>false</code></li>
- <li><code>undefined</code></li>
- <li><code>null</code></li>
- <li><code>0</code></li>
- <li><code>NaN</code></li>
- <li>la cadena vacía (<code>""</code>)</li>
-</ul>
-
-<p>Todos los demás valores, incluidos todos los objetos, se evalúan como <code>true</code> cuando se pasan a una declaración condicional.</p>
-
-<div class="blockIndicator note">
-<p><strong>Precaución</strong>: ¡No confundas los valores booleanos primitivos <code>true</code> y <code>false</code> con los valores <code>true</code> y <code>false</code> del objeto {{JSxRef("Boolean")}}!.</p>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: js notranslate">var b = new Boolean(false);
-if (b)         // esta condición se evalúa como verdadera
-if (b == true) // esta condición se evalúa como false
-</pre>
-</div>
-
-<h4 id="Ejemplo_2"><strong>Ejemplo</strong></h4>
-
-<p>En el siguiente ejemplo, la función <code>checkData</code> devuelve <code>true</code> si el número de caracteres en un objeto <code>Text</code> es tres. De lo contrario, muestra una alerta y devuelve <code>false</code>.</p>
-
-<pre class="brush: js notranslate">function checkData() {
-  if (document.form1.threeChar.value.length == 3) {
-    return true;
-  } else {
-    alert(
-        'Introduce exactamente tres caracteres. ' +
-        `${document.form1.threeChar.value} no es válido.`);
-    return false;
-  }
-}
-</pre>
-
-<h3 id="Declaración_switch">Declaración <code>switch</code></h3>
-
-<p>Una instrucción <code>switch</code> permite que un programa evalúe una expresión e intente hacer coincidir el valor de la expresión con una etiqueta <code>case</code>. Si la encuentra, el programa ejecuta la declaración asociada.</p>
-
-<p>Una instrucción <code>switch</code> se ve así:</p>
-
-<pre class="syntaxbox notranslate">switch (<var>expression</var>) {
-  case <var>label_1</var>:
-    <var>statements_1</var>
-    [break;]
-  case <var>label_2</var>:
-    <var>statements_2</var>
-    [break;]
-    …
-  default:
-    <var>statements_def</var>
-    [break;]
-}
-</pre>
-
-<p>JavaScript evalúa la instrucción <code>switch</code> anterior de la siguiente manera:</p>
-
-<ul>
- <li>El programa primero busca una cláusula <code>case</code> con una etiqueta que coincida con el valor de expresión y luego transfiere el control a esa cláusula, ejecutando las declaraciones asociadas.</li>
- <li>Si no se encuentra una etiqueta coincidente, el programa busca la cláusula opcional <code>default</code>:
-  <ul>
-   <li>Si se encuentra una cláusula <code>default</code>, el programa transfiere el control a esa cláusula, ejecutando las declaraciones asociadas.</li>
-   <li>Si no se encuentra una cláusula <code>default</code>, el programa reanuda la ejecución en la declaración que sigue al final de <code>switch</code>.</li>
-   <li>(Por convención, la cláusula <code>default</code> está escrita como la última cláusula, pero no es necesario que sea así).</li>
-  </ul>
- </li>
-</ul>
-
-<h4 id="Declaraciones_break">Declaraciones <code>break</code></h4>
-
-<p>La declaración opcional <code>break</code> asociada con cada cláusula <code>case</code> asegura que el programa salga de <code>switch</code> una vez que se ejecuta la instrucción coincidente, y luego continúa la ejecución en la declaración que sigue a <code>switch</code>. Si se omite <code>break</code>, el programa continúa la ejecución dentro de la instrucción <code>switch</code> (y evaluará el siguiente <code>case</code>, y así sucesivamente).</p>
-
-<h5 id="Ejemplo_3"><strong>Ejemplo</strong></h5>
-
-<p>En el siguiente ejemplo, si <code><var>fruittype</var></code> se evalúa como '<code>Bananas</code>', el programa hace coincidir el valor con el caso '<code>Bananas</code>' y ejecuta la declaración asociada. Cuando se encuentra <code>break</code>, el programa sale del <code>switch</code> y continúa la ejecución de la instrucción que sigue a <code>switch</code>. Si se omitiera <code>break</code>, también se ejecutará la instrucción para <code>case 'Cherries'</code>.</p>
-
-<pre class="brush: js notranslate">switch (<var>fruittype</var>) {
-  case 'Oranges':
-    console.log('Las naranjas cuestan $0.59 la libra.');
-    break;
-  case 'Apples':
-    console.log('Las manzanas cuestan $0.32 la libra.');
-    break;
-  case 'Bananas':
-    console.log('Los plátanos cuestan $0.48 la libra.');
-    break;
-  case 'Cherries':
-    console.log('Las cerezas cuestan $3.00 la libra.');
-    break;
-  case 'Mangoes':
-    console.log('Los mangos cuestan $0.56 la libra.');
-    break;
-  case 'Papayas':
-    console.log('Los mangos y las papayas cuestan $2.79 la libra.');
-    break;
-  default:
-   console.log(`Lo sentimos, no tenemos ${fruittype}.`);
-}
-console.log("¿Hay algo más que quieras?");</pre>
-
-<h2 id="Expresiones_de_manejo_de_excepciones">Expresiones de manejo de excepciones</h2>
-
-<p>Puedes lanzar excepciones usando la instrucción <code>throw</code> y manejarlas usando las declaraciones <code>try...catch</code>.</p>
-
-<ul>
- <li>{{anch("Expresion_throw", "Expresión throw")}}</li>
- <li>{{anch("Declaracion_try...catch", "Declaración try...catch")}}</li>
-</ul>
-
-<h3 id="Tipos_de_excepciones">Tipos de excepciones</h3>
-
-<p>Casi cualquier objeto se puede lanzar en JavaScript. Sin embargo, no todos los objetos lanzados son iguales. Si bien es común lanzar números o cadenas como errores, con frecuencia es más efectivo usar uno de los tipos de excepción creados específicamente para este propósito:</p>
-
-<ul>
- <li>{{JSxRef("Objetos_globales/Error", "excepciones ECMAScript", "#Tipos_Error")}}</li>
- <li>La interfaz {{web.link("/es/docs/Web/API/DOMException", "DOMException")}} representa un evento anormal (llamado excepción) que ocurre como resultado de llamar a un método o acceder a una propiedad de una API web y la interfaz {{web.link("/es/docs/Web/API/DOMError", "DOMError ")}} describe un objeto de error que contiene un nombre de error.</li>
-</ul>
-
-<h3 id="Expresión_throw">Expresión <code>throw</code></h3>
-
-<p>Utiliza la expresión <code>throw</code> para lanzar una excepción. Una expresión <code>throw</code> especifica el valor que se lanzará:</p>
-
-<pre class="syntaxbox notranslate">throw <var>expression</var>;
-</pre>
-
-<p>Puedes lanzar cualquier expresión, no solo expresiones de un tipo específico. El siguiente código arroja varias excepciones de distintos tipos:</p>
-
-<pre class="brush: js notranslate">throw 'Error2';   // tipo String
-throw 42;         // tipo Number
-throw true;       // tipo Boolean
-throw {toString: function() { return "¡Soy un objeto!"; } };
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong> Puedes especificar un objeto cuando lanzas una excepción. A continuación, puedes hacer referencia a las propiedades del objeto en el bloque <code>catch</code>.</p>
-</div>
-
-<pre class="brush: js notranslate">// Crea un objeto tipo de UserException
-function UserException(message) {
-  this.message = message;
-  this.name = 'UserException';
-}
-
-// Hacer que la excepción se convierta en una bonita cadena cuando se usa como cadena
-// (por ejemplo, por la consola de errores)
-UserException.prototype.toString = function() {
-  return `${this.name}: "${this.message}"`;
-}
-
-// Crea una instancia del tipo de objeto y tírala
-throw new UserException('Valor muy alto');</pre>
-
-<h3 id="Declaración_try...catch">Declaración <code>try...catch</code></h3>
-
-<p>La declaración <code>try...catch</code> marca un bloque de expresiones para probar y especifica una o más respuestas en caso de que se produzca una excepción. Si se lanza una excepción, la declaración <code>try...catch</code> la detecta.</p>
-
-<p>La declaración <code>try...catch</code> consta de un bloque <code>try</code>, que contiene una o más declaraciones, y un bloque <code>catch</code>, que contiene declaraciones que especifican qué hacer si se lanza una excepción en el bloque <code>try</code>.</p>
-
-<p>En otras palabras, deseas que el bloque <code>try</code> tenga éxito, pero si no es así, deseas que el control pase al bloque <code>catch</code>. Si alguna instrucción dentro del bloque <code>try</code> (o en una función llamada desde dentro del bloque <code>try</code>) arroja una excepción, el control <em>inmediatamente</em> cambia al bloque <code>catch</code>. Si no se lanza ninguna excepción en el bloque <code>try</code>, se omite el bloque <code>catch</code>. El bloque <code>finalmente</code> se ejecuta después de que se ejecutan los bloques <code>try</code> y <code>catch</code>, pero antes de las declaraciones que siguen a la declaración <code>try...catch</code>.</p>
-
-<p>El siguiente ejemplo usa una instrucción <code>try...catch</code>. El ejemplo llama a una función que recupera el nombre de un mes de un arreglo en función del valor pasado a la función. Si el valor no corresponde a un número de mes (<code>1</code>-<code>12</code>), se lanza una excepción con el valor "<code>InvalidMonthNo</code>" y las declaraciones en el bloque <code>catch</code> establezca la variable <code><var>monthName</var></code> en '<code>unknown</code>'.</p>
-
-<pre class="brush: js notranslate">function getMonthName(mo) {
-  mo = mo - 1; // Ajusta el número de mes para el índice del arreglo (1 = Ene, 12 = Dic)
-  let months = ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul',
-                'Ago', 'Sep', 'Oct', 'Nov', 'Dic'];
-  if (months[mo]) {
-    return months[mo];
-  } else {
-    throw 'InvalidMonthNo'; // aquí se usa la palabra clave throw
-  }
-}
-
-try { // declaraciones para try
-  monthName = getMonthName(myMonth); // la función podría lanzar una excepción
-}
-catch (e) {
-  monthName = 'unknown';
-  logMyErrors(e); // pasar el objeto exception al controlador de errores (es decir, su propia función)
-}
-</pre>
-
-<h4 id="El_bloque_catch">El bloque <code>catch</code></h4>
-
-<p>Puedes usar un bloque <code>catch</code> para manejar todas las excepciones que se puedan generar en el bloque <code>try</code>.</p>
-
-<pre class="syntaxbox notranslate">catch (<var>catchID</var>) {
-  <var>instrucciones</var>
-}
-</pre>
-
-<p>El bloque <code>catch</code> especifica un identificador (<code><var>catchID</var></code> en la sintaxis anterior) que contiene el valor especificado por la expresión <code>throw</code>. Puedes usar este identificador para obtener información sobre la excepción que se lanzó.</p>
-
-<p>JavaScript crea este identificador cuando se ingresa al bloque <code>catch</code>. El identificador dura solo la duración del bloque <code>catch</code>. Una vez que el bloque <code>catch</code> termina de ejecutarse, el identificador ya no existe.</p>
-
-<p>Por ejemplo, el siguiente código lanza una excepción. Cuando ocurre la excepción, el control se transfiere al bloque <code>catch</code>.</p>
-
-<pre class="brush: js notranslate">try {
-  throw 'myException'; // genera una excepción
-}
-catch (err) {
-  // declaraciones para manejar cualquier excepción
-  logMyErrors(err);    // pasa el objeto exception al controlador de errores
-}
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Mejores prácticas:</strong> Cuando se registran errores en la consola dentro de un bloque <code>catch</code>, se usa <code>console.error()</code> en lugar de <code>console.log()</code> aconsejado para la depuración. Formatea el mensaje como un error y lo agrega a la lista de mensajes de error generados por la página.</p>
-</div>
-
-<h4 id="El_bloque_finally">El bloque <code>finally</code></h4>
-
-<p>El bloque <code>finally</code> contiene instrucciones que se ejecutarán <em>después</em> que se ejecuten los bloques <code>try</code> y <code>catch</code>. Además, el bloque <code>finally</code> ejecuta <em>antes</em> el código que sigue a la declaración <code>try...catch...finally</code>.</p>
-
-<p>También es importante notar que el bloque <code>finally</code> se ejecutará <em>independientemente de que</em> se produzca una excepción. Sin embargo, si se lanza una excepción, las declaraciones en el bloque <code>finally</code> se ejecutan incluso si ningún bloque <code>catch</code> maneje la excepción que se lanzó.</p>
-
-<p>Puedes usar el bloque <code>finally</code> para hacer que tu script falle correctamente cuando ocurra una excepción. Por ejemplo, es posible que debas liberar un recurso que tu script haya inmovilizado.</p>
-
-<p>El siguiente ejemplo abre un archivo y luego ejecuta declaraciones que usan el archivo. (JavaScript de lado del servidor te permite acceder a los archivos). Si se lanza una excepción mientras el archivo está abierto, el bloque <code>finally</code> cierra el archivo antes de que falle el script. Usar <code>finally</code> aquí <em>asegura</em> que el archivo nunca se deje abierto, incluso si ocurre un error.</p>
-
-<pre class="brush: js notranslate">openMyFile();
-try {
-  writeMyFile(theData); // Esto puede arrojar un error
-} catch(e) {
-  handleError(e); // Si ocurrió un error, manéjalo
-} finally {
-  closeMyFile(); // Siempre cierra el recurso
-}
-</pre>
-
-<p>Si el bloque <code>finally</code> devuelve un valor, este valor se convierte en el valor de retorno de toda la producción de <code>try…catch…finally</code>, independientemente de las declaraciones <code>return</code> en los bloques <code>try</code> y <code>catch</code>:</p>
-
-<pre class="brush: js notranslate">function f() {
-  try {
-    console.log(0);
-    throw 'bogus';
-  } catch(e) {
-    console.log(1);
-    return true;    // esta declaración de retorno está suspendida
-                    // hasta que el bloque finally se haya completado
-    console.log(2); // no alcanzable
-  } finally {
-    console.log(3);
-    return false;   // sobrescribe el "return" anterior
-    console.log(4); // no alcanzable
-  }
-  // "return false" se ejecuta ahora
-  console.log(5);   // inalcanzable
-}
-console.log(f()); // 0, 1, 3, false
-</pre>
-
-<p>La sobrescritura de los valores devueltos por el bloque <code>finally</code> también se aplica a las excepciones lanzadas o relanzadas dentro del bloque <code>catch</code>:</p>
-
-<pre class="brush: js notranslate">function f() {
-  try {
-    throw 'bogus';
-  } catch(e) {
-    console.log('captura "falso" interno');
-    throw e; // esta instrucción throw se suspende hasta
-             // que el bloque finally se haya completado
-  } finally {
-    return false; // sobrescribe el "throw" anterior
-  }
-  // "return false" se ejecuta ahora
-}
-
-try {
-  console.log(f());
-} catch(e) {
-  // ¡esto nunca se alcanza!
-  // mientras se ejecuta f(), el bloque `finally` devuelve false,
-  // que sobrescribe el `throw` dentro del `catch` anterior
-  console.log('"falso" externo capturado');
-}
-
-// Produce
-// "falso" interno capturado
-// false</pre>
-
-<h4 id="Declaraciones_try...catch_anidadas">Declaraciones <code>try...catch</code> anidadas</h4>
-
-<p>Puedes anidar una o más declaraciones <code>try...catch</code>.</p>
-
-<p>Si un bloque <code>try</code> interno <em>no</em> tiene un bloque <code>catch</code> correspondiente:</p>
-
-<ol>
- <li><em>debe</em> contener un bloque <code>finally</code>, y</li>
- <li>el bloque <code>catch</code> adjunto de la declaración <code>try...catch</code> se comprueba para una coincidencia.</li>
-</ol>
-
-<p>Para obtener más información, consulta {{JSxRef("Sentencias/try...catch", "bloques try anidados", "#Nested_try-blocks")}} en la una página de referencia {{JSxRef("Sentencias/try...catch", "try...catch")}}.</p>
-
-<h3 id="Utilizar_objetos_Error">Utilizar objetos <code>Error</code></h3>
-
-<p>Dependiendo del tipo de error, es posible que puedas utilizar las propiedades <code>name</code> y <code>message</code> para obtener un mensaje más refinado.</p>
-
-<p>La propiedad <code>name</code> proporciona la clase general de <code>Error</code> (tal como <code>DOMException</code> o <code>Error</code>), mientras que <code>message</code> generalmente proporciona un mensaje más conciso que el que se obtendría al convertir el objeto error en una cadena.</p>
-
-<p>Si estás lanzando tus propias excepciones, para aprovechar estas propiedades (por ejemplo, si tu bloque <code>catch</code> no discrimina entre tus propias excepciones y las del sistema), puedes usar el constructor <code>Error</code>.</p>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: js notranslate">function doSomethingErrorProne() {
-  if (ourCodeMakesAMistake()) {
-    throw (new Error('El mensaje'));
-  } else {
-    doSomethingToGetAJavascriptError();
-  }
-}
-⋮
-try {
-  doSomethingErrorProne();
-} catch (e) {               // AHORA, en realidad usamos `console.error()`
-  console.error(e.name);    // registra 'Error'
-  console.error(e.message); // registra 'The message' o un mensaje de error de JavaScript
-}
-</pre>
-
-<div>{{PreviousNext("Web/JavaScript/Guide/Grammar_and_types", "Web/JavaScript/Guide/Loops_and_iteration")}}</div>
diff --git a/files/es/web/javascript/guide/control_flow_and_error_handling/index.html b/files/es/web/javascript/guide/control_flow_and_error_handling/index.html
new file mode 100644
index 0000000000..c64d9901cb
--- /dev/null
+++ b/files/es/web/javascript/guide/control_flow_and_error_handling/index.html
@@ -0,0 +1,457 @@
+---
+title: Control de flujo y manejo de errores
+slug: Web/JavaScript/Guide/Control_flow_and_error_handling
+tags:
+  - Control de flujo
+  - Guía
+  - JavaScript
+  - Lógica
+  - Manejo de errores
+  - Novato
+  - Principiantes
+  - Promesas
+  - declaraciones
+  - l10n:priority
+translation_of: Web/JavaScript/Guide/Control_flow_and_error_handling
+original_slug: Web/JavaScript/Guide/Control_de_flujo_y_manejo_de_errores
+---
+<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Grammar_and_types", "Web/JavaScript/Guide/Loops_and_iteration")}}</div>
+
+<p class="seoSummary">JavaScript admite un compacto conjunto de declaraciones, específicamente declaraciones de control de flujo, que puedes utilizar para incorporar una gran cantidad de interactividad en tu aplicación. Este capítulo proporciona una descripción de estas declaraciones.</p>
+
+<p>La {{JSxRef("Sentencias", "referencia de JavaScript")}} contiene detalles exhaustivos sobre las declaraciones de este capítulo. El carácter de punto y coma (<code>;</code>) se utiliza para separar declaraciones en código JavaScript.</p>
+
+<p>Todas las expresiones e instrucciones de JavaScript también son una declaración. Consulta {{JSxRef("../Guide/Expressions_and_Operators", "Expresiones y operadores")}} para obtener información completa sobre las expresiones.</p>
+
+<h2 id="Declaración_de_bloque">Declaración de bloque</h2>
+
+<p>La declaración más básica es una <dfn>declaración de bloque</dfn>, que se utiliza para agrupar instrucciones. El bloque está delimitado por un par de llaves:</p>
+
+<pre class="syntaxbox notranslate">{
+  <var>statement_1</var>;
+  <var>statement_2</var>;
+  ⋮
+  <var>statement_n</var>;
+}
+</pre>
+
+<h3 id="Ejemplo"><strong>Ejemplo</strong></h3>
+
+<p>Las declaraciones de bloque se utilizan comúnmente con declaraciones de control de flujo (<code>if</code>, <code>for</code>, <code>while</code>).</p>
+
+<pre class="brush: js notranslate">while (x &lt; 10) {
+  x++;
+}
+</pre>
+
+<p>Aquí, <code>{ x++; }</code> es la declaración de bloque.</p>
+
+<div class="blockIndicator note">
+<p><strong>Importante</strong>: JavaScript anterior a ECMAScript2015 (6<sup>a</sup> edición) <strong>no</strong> tiene ámbito de bloque. En JavaScript más antiguo, las variables introducidas dentro de un bloque tienen como ámbito la función o script que las contiene, y los efectos de establecerlas persisten más allá del bloque en sí mismo. En otras palabras, las <em>declaraciones de bloque no definen un ámbito</em>.</p>
+
+<p>Los bloques "independientes" en JavaScript pueden producir resultados completamente diferentes de los que producirían en C o Java. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">var x = 1;
+{
+  var x = 2;
+}
+console.log(x); // muestra 2
+</pre>
+
+<p>Esto muestra <code>2</code> porque la instrucción <code>var x</code> dentro del bloque está en el mismo ámbito que la instrucción <code>var x</code> anterior del bloque. (En C o Java, el código equivalente habría generado <code>1</code>).</p>
+
+<p><strong>A partir de ECMAScript2015</strong>, las declaraciones de variables <code>let</code> y <code>const</code> tienen un ámbito de bloque. Consulta las páginas de referencia de {{JSxRef("Sentencias/let", "let")}} y {{JSxRef("Sentencias/const", "const")}} para obtener más información.</p>
+</div>
+
+<h2 id="Expresiones_condicionales">Expresiones condicionales</h2>
+
+<p>Una expresión condicional es un conjunto de instrucciones que se ejecutarán si una condición especificada es verdadera. JavaScript admite dos expresiones condicionales: <code>if...else</code> y <code>switch</code>.</p>
+
+<h3 id="Expresión_if...else">Expresión <code>if...else</code></h3>
+
+<p>Utiliza la expresión <code>if</code> para ejecutar una instrucción si una condición lógica es <code>true</code>. Utiliza la cláusula opcional <code>else</code> para ejecutar una instrucción si la condición es <code>false</code>.</p>
+
+<p>Una declaración <code>if</code> se ve así:</p>
+
+<pre class="syntaxbox notranslate">if (<var>condition</var>) {
+  <var>statement_1</var>;
+} else {
+  <var>statement_2</var>;
+}</pre>
+
+<p>Aquí, la <code><var>condition</var></code> puede ser cualquier expresión que se evalúe como <code>true</code> o <code>false</code>. (Consulta {{JSxRef("Objetos_globales/Boolean", "Boolean", "#Description")}} para obtener una explicación de lo que se evalúa como <code>true</code> y <code>false</code>).</p>
+
+<p>Si <code><var>condition</var></code> se evalúa como <code>true</code>, se ejecuta <code><var>statement_1</var></code>. De lo contrario, se ejecuta <code><var>statement_2</var></code>. <code><var>statement_1</var></code> y <code><var>statement_2</var></code> pueden ser cualquier declaración, incluidas otras declaraciones <code>if</code> anidadas.</p>
+
+<p>También puedes componer las declaraciones usando <code>else if</code> para que se prueben varias condiciones en secuencia, de la siguiente manera:</p>
+
+<pre class="syntaxbox notranslate">if (<var>condition_1</var>) {
+  <var>statement_1</var>;
+} else if (<var>condition_2</var>) {
+  <var>statement_2</var>;
+} else if (<var>condition_n</var>) {
+  <var>statement_n</var>;
+} else {
+  <var>statement_last</var>;
+}
+</pre>
+
+<p>En el caso de múltiples condiciones, solo se ejecutará la primera condición lógica que se evalúe como <code>true</code>. Para ejecutar múltiples declaraciones, agrúpalas dentro de una declaración de bloque (<code>{ … }</code>).</p>
+
+<h4 id="Mejores_prácticas">Mejores prácticas</h4>
+
+<p>En general, es una buena práctica usar siempre declaraciones de bloque, <em>especialmente</em> al anidar declaraciones <code>if</code>:</p>
+
+<pre class="syntaxbox notranslate">if (<var>condition</var>) {
+  <var>statement_1_runs_if_condition_is_true</var>;
+  <var>statement_2_runs_if_condition_is_true</var>;
+} else {
+  <var>statement_3_runs_if_condition_is_false</var>;
+  <var>statement_4_runs_if_condition_is_false</var>;
+}
+</pre>
+
+<p>No es aconsejable utilizar asignaciones simples en una expresión condicional, porque la asignación se puede confundir con la igualdad al mirar el código.</p>
+
+<p>Por ejemplo, <em>no</em> escribas un código como este:</p>
+
+<pre class="example-bad brush: js notranslate">// Propenso a ser mal interpretado como "x == y"
+if (x = y) {
+  /* expresiones aquí */
+}
+</pre>
+
+<p>Si necesitas usar una tarea en una expresión condicional, una práctica común es poner paréntesis adicionales alrededor de la asignación, así:</p>
+
+<pre class="example-good brush: js notranslate">if ((x = y)) {
+  /* expresiones aquí */
+}
+</pre>
+
+<h4 id="Valores_falsos">Valores falsos</h4>
+
+<p>Los siguientes valores se evalúan como <code>false</code> (también conocidos como valores {{Glossary("Falsy")}}:</p>
+
+<ul>
+ <li><code>false</code></li>
+ <li><code>undefined</code></li>
+ <li><code>null</code></li>
+ <li><code>0</code></li>
+ <li><code>NaN</code></li>
+ <li>la cadena vacía (<code>""</code>)</li>
+</ul>
+
+<p>Todos los demás valores, incluidos todos los objetos, se evalúan como <code>true</code> cuando se pasan a una declaración condicional.</p>
+
+<div class="blockIndicator note">
+<p><strong>Precaución</strong>: ¡No confundas los valores booleanos primitivos <code>true</code> y <code>false</code> con los valores <code>true</code> y <code>false</code> del objeto {{JSxRef("Boolean")}}!.</p>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: js notranslate">var b = new Boolean(false);
+if (b)         // esta condición se evalúa como verdadera
+if (b == true) // esta condición se evalúa como false
+</pre>
+</div>
+
+<h4 id="Ejemplo_2"><strong>Ejemplo</strong></h4>
+
+<p>En el siguiente ejemplo, la función <code>checkData</code> devuelve <code>true</code> si el número de caracteres en un objeto <code>Text</code> es tres. De lo contrario, muestra una alerta y devuelve <code>false</code>.</p>
+
+<pre class="brush: js notranslate">function checkData() {
+  if (document.form1.threeChar.value.length == 3) {
+    return true;
+  } else {
+    alert(
+        'Introduce exactamente tres caracteres. ' +
+        `${document.form1.threeChar.value} no es válido.`);
+    return false;
+  }
+}
+</pre>
+
+<h3 id="Declaración_switch">Declaración <code>switch</code></h3>
+
+<p>Una instrucción <code>switch</code> permite que un programa evalúe una expresión e intente hacer coincidir el valor de la expresión con una etiqueta <code>case</code>. Si la encuentra, el programa ejecuta la declaración asociada.</p>
+
+<p>Una instrucción <code>switch</code> se ve así:</p>
+
+<pre class="syntaxbox notranslate">switch (<var>expression</var>) {
+  case <var>label_1</var>:
+    <var>statements_1</var>
+    [break;]
+  case <var>label_2</var>:
+    <var>statements_2</var>
+    [break;]
+    …
+  default:
+    <var>statements_def</var>
+    [break;]
+}
+</pre>
+
+<p>JavaScript evalúa la instrucción <code>switch</code> anterior de la siguiente manera:</p>
+
+<ul>
+ <li>El programa primero busca una cláusula <code>case</code> con una etiqueta que coincida con el valor de expresión y luego transfiere el control a esa cláusula, ejecutando las declaraciones asociadas.</li>
+ <li>Si no se encuentra una etiqueta coincidente, el programa busca la cláusula opcional <code>default</code>:
+  <ul>
+   <li>Si se encuentra una cláusula <code>default</code>, el programa transfiere el control a esa cláusula, ejecutando las declaraciones asociadas.</li>
+   <li>Si no se encuentra una cláusula <code>default</code>, el programa reanuda la ejecución en la declaración que sigue al final de <code>switch</code>.</li>
+   <li>(Por convención, la cláusula <code>default</code> está escrita como la última cláusula, pero no es necesario que sea así).</li>
+  </ul>
+ </li>
+</ul>
+
+<h4 id="Declaraciones_break">Declaraciones <code>break</code></h4>
+
+<p>La declaración opcional <code>break</code> asociada con cada cláusula <code>case</code> asegura que el programa salga de <code>switch</code> una vez que se ejecuta la instrucción coincidente, y luego continúa la ejecución en la declaración que sigue a <code>switch</code>. Si se omite <code>break</code>, el programa continúa la ejecución dentro de la instrucción <code>switch</code> (y evaluará el siguiente <code>case</code>, y así sucesivamente).</p>
+
+<h5 id="Ejemplo_3"><strong>Ejemplo</strong></h5>
+
+<p>En el siguiente ejemplo, si <code><var>fruittype</var></code> se evalúa como '<code>Bananas</code>', el programa hace coincidir el valor con el caso '<code>Bananas</code>' y ejecuta la declaración asociada. Cuando se encuentra <code>break</code>, el programa sale del <code>switch</code> y continúa la ejecución de la instrucción que sigue a <code>switch</code>. Si se omitiera <code>break</code>, también se ejecutará la instrucción para <code>case 'Cherries'</code>.</p>
+
+<pre class="brush: js notranslate">switch (<var>fruittype</var>) {
+  case 'Oranges':
+    console.log('Las naranjas cuestan $0.59 la libra.');
+    break;
+  case 'Apples':
+    console.log('Las manzanas cuestan $0.32 la libra.');
+    break;
+  case 'Bananas':
+    console.log('Los plátanos cuestan $0.48 la libra.');
+    break;
+  case 'Cherries':
+    console.log('Las cerezas cuestan $3.00 la libra.');
+    break;
+  case 'Mangoes':
+    console.log('Los mangos cuestan $0.56 la libra.');
+    break;
+  case 'Papayas':
+    console.log('Los mangos y las papayas cuestan $2.79 la libra.');
+    break;
+  default:
+   console.log(`Lo sentimos, no tenemos ${fruittype}.`);
+}
+console.log("¿Hay algo más que quieras?");</pre>
+
+<h2 id="Expresiones_de_manejo_de_excepciones">Expresiones de manejo de excepciones</h2>
+
+<p>Puedes lanzar excepciones usando la instrucción <code>throw</code> y manejarlas usando las declaraciones <code>try...catch</code>.</p>
+
+<ul>
+ <li>{{anch("Expresion_throw", "Expresión throw")}}</li>
+ <li>{{anch("Declaracion_try...catch", "Declaración try...catch")}}</li>
+</ul>
+
+<h3 id="Tipos_de_excepciones">Tipos de excepciones</h3>
+
+<p>Casi cualquier objeto se puede lanzar en JavaScript. Sin embargo, no todos los objetos lanzados son iguales. Si bien es común lanzar números o cadenas como errores, con frecuencia es más efectivo usar uno de los tipos de excepción creados específicamente para este propósito:</p>
+
+<ul>
+ <li>{{JSxRef("Objetos_globales/Error", "excepciones ECMAScript", "#Tipos_Error")}}</li>
+ <li>La interfaz {{web.link("/es/docs/Web/API/DOMException", "DOMException")}} representa un evento anormal (llamado excepción) que ocurre como resultado de llamar a un método o acceder a una propiedad de una API web y la interfaz {{web.link("/es/docs/Web/API/DOMError", "DOMError ")}} describe un objeto de error que contiene un nombre de error.</li>
+</ul>
+
+<h3 id="Expresión_throw">Expresión <code>throw</code></h3>
+
+<p>Utiliza la expresión <code>throw</code> para lanzar una excepción. Una expresión <code>throw</code> especifica el valor que se lanzará:</p>
+
+<pre class="syntaxbox notranslate">throw <var>expression</var>;
+</pre>
+
+<p>Puedes lanzar cualquier expresión, no solo expresiones de un tipo específico. El siguiente código arroja varias excepciones de distintos tipos:</p>
+
+<pre class="brush: js notranslate">throw 'Error2';   // tipo String
+throw 42;         // tipo Number
+throw true;       // tipo Boolean
+throw {toString: function() { return "¡Soy un objeto!"; } };
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong> Puedes especificar un objeto cuando lanzas una excepción. A continuación, puedes hacer referencia a las propiedades del objeto en el bloque <code>catch</code>.</p>
+</div>
+
+<pre class="brush: js notranslate">// Crea un objeto tipo de UserException
+function UserException(message) {
+  this.message = message;
+  this.name = 'UserException';
+}
+
+// Hacer que la excepción se convierta en una bonita cadena cuando se usa como cadena
+// (por ejemplo, por la consola de errores)
+UserException.prototype.toString = function() {
+  return `${this.name}: "${this.message}"`;
+}
+
+// Crea una instancia del tipo de objeto y tírala
+throw new UserException('Valor muy alto');</pre>
+
+<h3 id="Declaración_try...catch">Declaración <code>try...catch</code></h3>
+
+<p>La declaración <code>try...catch</code> marca un bloque de expresiones para probar y especifica una o más respuestas en caso de que se produzca una excepción. Si se lanza una excepción, la declaración <code>try...catch</code> la detecta.</p>
+
+<p>La declaración <code>try...catch</code> consta de un bloque <code>try</code>, que contiene una o más declaraciones, y un bloque <code>catch</code>, que contiene declaraciones que especifican qué hacer si se lanza una excepción en el bloque <code>try</code>.</p>
+
+<p>En otras palabras, deseas que el bloque <code>try</code> tenga éxito, pero si no es así, deseas que el control pase al bloque <code>catch</code>. Si alguna instrucción dentro del bloque <code>try</code> (o en una función llamada desde dentro del bloque <code>try</code>) arroja una excepción, el control <em>inmediatamente</em> cambia al bloque <code>catch</code>. Si no se lanza ninguna excepción en el bloque <code>try</code>, se omite el bloque <code>catch</code>. El bloque <code>finalmente</code> se ejecuta después de que se ejecutan los bloques <code>try</code> y <code>catch</code>, pero antes de las declaraciones que siguen a la declaración <code>try...catch</code>.</p>
+
+<p>El siguiente ejemplo usa una instrucción <code>try...catch</code>. El ejemplo llama a una función que recupera el nombre de un mes de un arreglo en función del valor pasado a la función. Si el valor no corresponde a un número de mes (<code>1</code>-<code>12</code>), se lanza una excepción con el valor "<code>InvalidMonthNo</code>" y las declaraciones en el bloque <code>catch</code> establezca la variable <code><var>monthName</var></code> en '<code>unknown</code>'.</p>
+
+<pre class="brush: js notranslate">function getMonthName(mo) {
+  mo = mo - 1; // Ajusta el número de mes para el índice del arreglo (1 = Ene, 12 = Dic)
+  let months = ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul',
+                'Ago', 'Sep', 'Oct', 'Nov', 'Dic'];
+  if (months[mo]) {
+    return months[mo];
+  } else {
+    throw 'InvalidMonthNo'; // aquí se usa la palabra clave throw
+  }
+}
+
+try { // declaraciones para try
+  monthName = getMonthName(myMonth); // la función podría lanzar una excepción
+}
+catch (e) {
+  monthName = 'unknown';
+  logMyErrors(e); // pasar el objeto exception al controlador de errores (es decir, su propia función)
+}
+</pre>
+
+<h4 id="El_bloque_catch">El bloque <code>catch</code></h4>
+
+<p>Puedes usar un bloque <code>catch</code> para manejar todas las excepciones que se puedan generar en el bloque <code>try</code>.</p>
+
+<pre class="syntaxbox notranslate">catch (<var>catchID</var>) {
+  <var>instrucciones</var>
+}
+</pre>
+
+<p>El bloque <code>catch</code> especifica un identificador (<code><var>catchID</var></code> en la sintaxis anterior) que contiene el valor especificado por la expresión <code>throw</code>. Puedes usar este identificador para obtener información sobre la excepción que se lanzó.</p>
+
+<p>JavaScript crea este identificador cuando se ingresa al bloque <code>catch</code>. El identificador dura solo la duración del bloque <code>catch</code>. Una vez que el bloque <code>catch</code> termina de ejecutarse, el identificador ya no existe.</p>
+
+<p>Por ejemplo, el siguiente código lanza una excepción. Cuando ocurre la excepción, el control se transfiere al bloque <code>catch</code>.</p>
+
+<pre class="brush: js notranslate">try {
+  throw 'myException'; // genera una excepción
+}
+catch (err) {
+  // declaraciones para manejar cualquier excepción
+  logMyErrors(err);    // pasa el objeto exception al controlador de errores
+}
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Mejores prácticas:</strong> Cuando se registran errores en la consola dentro de un bloque <code>catch</code>, se usa <code>console.error()</code> en lugar de <code>console.log()</code> aconsejado para la depuración. Formatea el mensaje como un error y lo agrega a la lista de mensajes de error generados por la página.</p>
+</div>
+
+<h4 id="El_bloque_finally">El bloque <code>finally</code></h4>
+
+<p>El bloque <code>finally</code> contiene instrucciones que se ejecutarán <em>después</em> que se ejecuten los bloques <code>try</code> y <code>catch</code>. Además, el bloque <code>finally</code> ejecuta <em>antes</em> el código que sigue a la declaración <code>try...catch...finally</code>.</p>
+
+<p>También es importante notar que el bloque <code>finally</code> se ejecutará <em>independientemente de que</em> se produzca una excepción. Sin embargo, si se lanza una excepción, las declaraciones en el bloque <code>finally</code> se ejecutan incluso si ningún bloque <code>catch</code> maneje la excepción que se lanzó.</p>
+
+<p>Puedes usar el bloque <code>finally</code> para hacer que tu script falle correctamente cuando ocurra una excepción. Por ejemplo, es posible que debas liberar un recurso que tu script haya inmovilizado.</p>
+
+<p>El siguiente ejemplo abre un archivo y luego ejecuta declaraciones que usan el archivo. (JavaScript de lado del servidor te permite acceder a los archivos). Si se lanza una excepción mientras el archivo está abierto, el bloque <code>finally</code> cierra el archivo antes de que falle el script. Usar <code>finally</code> aquí <em>asegura</em> que el archivo nunca se deje abierto, incluso si ocurre un error.</p>
+
+<pre class="brush: js notranslate">openMyFile();
+try {
+  writeMyFile(theData); // Esto puede arrojar un error
+} catch(e) {
+  handleError(e); // Si ocurrió un error, manéjalo
+} finally {
+  closeMyFile(); // Siempre cierra el recurso
+}
+</pre>
+
+<p>Si el bloque <code>finally</code> devuelve un valor, este valor se convierte en el valor de retorno de toda la producción de <code>try…catch…finally</code>, independientemente de las declaraciones <code>return</code> en los bloques <code>try</code> y <code>catch</code>:</p>
+
+<pre class="brush: js notranslate">function f() {
+  try {
+    console.log(0);
+    throw 'bogus';
+  } catch(e) {
+    console.log(1);
+    return true;    // esta declaración de retorno está suspendida
+                    // hasta que el bloque finally se haya completado
+    console.log(2); // no alcanzable
+  } finally {
+    console.log(3);
+    return false;   // sobrescribe el "return" anterior
+    console.log(4); // no alcanzable
+  }
+  // "return false" se ejecuta ahora
+  console.log(5);   // inalcanzable
+}
+console.log(f()); // 0, 1, 3, false
+</pre>
+
+<p>La sobrescritura de los valores devueltos por el bloque <code>finally</code> también se aplica a las excepciones lanzadas o relanzadas dentro del bloque <code>catch</code>:</p>
+
+<pre class="brush: js notranslate">function f() {
+  try {
+    throw 'bogus';
+  } catch(e) {
+    console.log('captura "falso" interno');
+    throw e; // esta instrucción throw se suspende hasta
+             // que el bloque finally se haya completado
+  } finally {
+    return false; // sobrescribe el "throw" anterior
+  }
+  // "return false" se ejecuta ahora
+}
+
+try {
+  console.log(f());
+} catch(e) {
+  // ¡esto nunca se alcanza!
+  // mientras se ejecuta f(), el bloque `finally` devuelve false,
+  // que sobrescribe el `throw` dentro del `catch` anterior
+  console.log('"falso" externo capturado');
+}
+
+// Produce
+// "falso" interno capturado
+// false</pre>
+
+<h4 id="Declaraciones_try...catch_anidadas">Declaraciones <code>try...catch</code> anidadas</h4>
+
+<p>Puedes anidar una o más declaraciones <code>try...catch</code>.</p>
+
+<p>Si un bloque <code>try</code> interno <em>no</em> tiene un bloque <code>catch</code> correspondiente:</p>
+
+<ol>
+ <li><em>debe</em> contener un bloque <code>finally</code>, y</li>
+ <li>el bloque <code>catch</code> adjunto de la declaración <code>try...catch</code> se comprueba para una coincidencia.</li>
+</ol>
+
+<p>Para obtener más información, consulta {{JSxRef("Sentencias/try...catch", "bloques try anidados", "#Nested_try-blocks")}} en la una página de referencia {{JSxRef("Sentencias/try...catch", "try...catch")}}.</p>
+
+<h3 id="Utilizar_objetos_Error">Utilizar objetos <code>Error</code></h3>
+
+<p>Dependiendo del tipo de error, es posible que puedas utilizar las propiedades <code>name</code> y <code>message</code> para obtener un mensaje más refinado.</p>
+
+<p>La propiedad <code>name</code> proporciona la clase general de <code>Error</code> (tal como <code>DOMException</code> o <code>Error</code>), mientras que <code>message</code> generalmente proporciona un mensaje más conciso que el que se obtendría al convertir el objeto error en una cadena.</p>
+
+<p>Si estás lanzando tus propias excepciones, para aprovechar estas propiedades (por ejemplo, si tu bloque <code>catch</code> no discrimina entre tus propias excepciones y las del sistema), puedes usar el constructor <code>Error</code>.</p>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: js notranslate">function doSomethingErrorProne() {
+  if (ourCodeMakesAMistake()) {
+    throw (new Error('El mensaje'));
+  } else {
+    doSomethingToGetAJavascriptError();
+  }
+}
+⋮
+try {
+  doSomethingErrorProne();
+} catch (e) {               // AHORA, en realidad usamos `console.error()`
+  console.error(e.name);    // registra 'Error'
+  console.error(e.message); // registra 'The message' o un mensaje de error de JavaScript
+}
+</pre>
+
+<div>{{PreviousNext("Web/JavaScript/Guide/Grammar_and_types", "Web/JavaScript/Guide/Loops_and_iteration")}}</div>
diff --git a/files/es/web/javascript/guide/funciones/index.html b/files/es/web/javascript/guide/funciones/index.html
deleted file mode 100644
index 9594a71f4c..0000000000
--- a/files/es/web/javascript/guide/funciones/index.html
+++ /dev/null
@@ -1,706 +0,0 @@
----
-title: Funciones
-slug: Web/JavaScript/Guide/Funciones
-tags:
-  - Funciones
-  - Guía
-  - JavaScript
-  - Novato
-  - Principiante
-  - 'l10n:priority'
-translation_of: Web/JavaScript/Guide/Functions
----
-<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Loops_and_iteration", "Web/JavaScript/Guide/Expressions_and_Operators")}}</div>
-
-<p class="summary">Las funciones son uno de los bloques de construcción fundamentales en JavaScript. Una función en JavaScript es similar a un procedimiento — un conjunto de instrucciones que realiza una tarea o calcula un valor, pero para que un procedimiento califique como función, debe tomar alguna entrada y devolver una salida donde hay alguna relación obvia entre la entrada y la salida. Para usar una función, debes definirla en algún lugar del ámbito desde el que deseas llamarla.</p>
-
-<p>Consulta también el {{JSxRef("Funciones", "capítulo de referencia exhaustivo sobre funciones de JavaScript")}} para conocer los detalles.</p>
-
-<h2 id="Definir_funciones">Definir funciones</h2>
-
-<h3 id="Declaración_de_función">Declaración de función</h3>
-
-<p>Una <strong>definición de función</strong> (también denominada <strong>declaración de función</strong> o <strong>expresión de función</strong>) consta de la palabra clave {{JSxRef("Sentencias/function", "function")}}, seguida de:</p>
-
-<ul>
- <li>El nombre de la función.</li>
- <li>Una lista de parámetros de la función, entre paréntesis y separados por comas.</li>
- <li>Las declaraciones de JavaScript que definen la función, encerradas entre llaves, <code>{ ... }</code>.</li>
-</ul>
-
-<p>Por ejemplo, el siguiente código define una función simple llamada <code>square</code> ("cuadrado"):</p>
-
-<pre class="brush: js notranslate">function square(number) {
-  return number * number;
-}
-</pre>
-
-<p>La función <code>square</code> toma un parámetro, llamado <code>number</code>. La función consta de una declaración que dice devuelva el parámetro de la función (es decir, <code>number</code>) multiplicado por sí mismo. La instrucción {{JSxRef("Sentencias/return", "return")}} especifica el valor devuelto por la función:</p>
-
-<pre class="brush: js notranslate">return number * number;
-</pre>
-
-<p>Los parámetros primitivos (como un <code>number</code>) se pasan a las funciones <strong>por valor</strong>; el valor se pasa a la función, pero si la función cambia el valor del parámetro, <strong>este cambio no se refleja globalmente ni en la función que llama</strong>.</p>
-
-<p>Si pasas un objeto (es decir, un valor no primitivo, como {{JSxRef("Array")}} o un objeto definido por el usuario) como parámetro y la función cambia las propiedades del objeto, ese cambio es visible fuera de la función, como se muestra en el siguiente ejemplo:</p>
-
-<pre class="brush: js notranslate">function myFunc(theObject) {
-  theObject.make = 'Toyota';
-}
-
-[parcial]var mycar = { make: 'Honda', model: 'Accord', year: 1998 };
-var x, y;
-
-x = mycar.make; // x obtiene el valor "Honda"
-
-myFunc(mycar);
-y = mycar.make; // y obtiene el valor "Toyota"
-                // (la propiedad make fue cambiada por la función)
-</pre>
-
-<h3 id="Expresiones_function">Expresiones <code>function</code></h3>
-
-<p>Si bien la declaración de función anterior sintácticamente es una declaración, las funciones también se pueden crear mediante una {{JSxRef("Operadores/function", "expresión function")}}.</p>
-
-<p>Esta función puede ser <strong>anónima</strong>; no tiene por qué tener un nombre. Por ejemplo, la función <code>square</code> se podría haber definido como:</p>
-
-<pre class="brush: js notranslate">const square = function(number) { return number * number }
-var x = square(4) // x obtiene el valor 16</pre>
-
-<p>Sin embargo, <em>puedes</em> proporcionar un nombre con una expresión <code>function</code>. Proporcionar un nombre permite que la función se refiera a sí misma y también facilita la identificación de la función en el seguimiento de la pila de un depurador:</p>
-
-<pre class="brush: js notranslate">const factorial = function fac(n) { return n &lt; 2 ? 1 : n * fac(n - 1) }
-
-console.log(factorial(3))
-</pre>
-
-<p>Las expresiones <code>function</code> son convenientes cuando se pasa una función como argumento a otra función. El siguiente ejemplo muestra una función <code>map</code> que debería recibir una función como primer argumento y un arreglo como segundo argumento.</p>
-
-<pre class="brush: js notranslate">function map(f, a) {
-  let result = []; // Crea un nuevo arreglo
-  let i; // Declara una variable
-  for (i = 0; i != a.length; i++)
-    result[i] = f(a[i]);
-  return result;
-}
-</pre>
-
-<p>En el siguiente código, la función recibe una función definida por una expresión de función y la ejecuta por cada elemento del arreglo recibido como segundo argumento.</p>
-
-<pre class="brush: js notranslate">function map(f, a) {
-  let result = []; // Crea un nuevo arreglo
-  let i; // Declara una variable
-  for (i = 0; i != a.length; i++)
-    result[i] = f(a[i]);
-  return result;
-}
-const f = function(x) {
-   return x * x * x;
-}
-let numbers = [0, 1, 2, 5, 10];
-let cube = map(f,numbers);
-console.log(cube);</pre>
-
-<p>La función devuelve: <code>[0, 1, 8, 125, 1000]</code>.</p>
-
-<p>En JavaScript, una función se puede definir en función de una condición. Por ejemplo, la siguiente definición de función define <code>myFunc</code> solo si <code>num</code> es igual a <code>0</code>:</p>
-
-<pre class="brush: js notranslate">var myFunc;
-if (num === 0) {
-  myFunc = function(theObject) {
-    theObject.make = 'Toyota';
-  }
-}</pre>
-
-<p>Además de definir funciones como se describe aquí, también puedes usar el constructor {{JSxRef("Function")}} para crear funciones a partir de una cadena en tiempo de ejecución, muy al estilo de {{JSxRef("eval", "eval()")}}.</p>
-
-<p>Un <strong>método</strong> es una función que es propiedad de un objeto. Obten más información sobre objetos y métodos en {{JSxRef("../Guide/Working_with_Objects", "Trabajar con objetos")}}.</p>
-
-<h2 id="Llamar_funciones">Llamar funciones</h2>
-
-<p><em>Definir</em> una función no la <em>ejecuta</em>. Definirla simplemente nombra la función y especifica qué hacer cuando se llama a la función.</p>
-
-<p><strong>Llamar</strong> a la función en realidad lleva a cabo las acciones especificadas con los parámetros indicados. Por ejemplo, si defines la función <code>square</code>, podrías llamarla de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">square(5);
-</pre>
-
-<p>La declaración anterior llama a la función con un argumento de <code>5</code>. La función ejecuta sus declaraciones y devuelve el valor <code>25</code>.</p>
-
-<p>Las funciones deben estar <em>dentro del ámbito</em> cuando se llaman, pero la declaración de la función se puede elevar (cuando aparece debajo de la llamada en el código), como en este ejemplo:</p>
-
-<pre class="brush: js notranslate">console.log(square(5));
-/* ... */
-function square(n) { return n * n }
-</pre>
-
-<p>El ámbito de una función es la función en la que se declara (o el programa completo, si se declara en el nivel superior).</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Esto solo trabaja cuando se define la función usando la sintaxis anterior (es decir, <code>function funcName() {}</code>). El siguiente código no trabajará.</p>
-
-<p>Esto significa que la elevación de función solo trabaja con <em>declaraciones</em> de función, no con <em>expresiones</em> de función.</p>
-
-<pre class="brush: js example-bad notranslate">console.log(square)    // square se eleva con un valor inicial undefined.
-console.log(square(5)) // Error de tipo no detectado: square no es una función
-const square = function(n) {
-  return n * n;
-}
-</pre>
-</div>
-
-<p>Los argumentos de una función no se limitan a cadenas y números. Puedes pasar objetos completos a una función. La función <code>show_props()</code> (definida en {{JSxRef("../Guide/Working_with_Objects", "Trabajar con objetos", "#Objetos_y_propiedades")}} es un ejemplo de una función que toma un objeto como argumento.</p>
-
-<p>Una función se puede llamar a sí misma. Por ejemplo, aquí hay una función que calcula factoriales de forma recursiva:</p>
-
-<pre class="brush: js notranslate">function factorial(n) {
-  if ((n === 0) || (n === 1))
-    return 1;
-  else
-    return (n * factorial(n - 1));
-}
-</pre>
-
-<p>Luego, podrías calcular los factoriales de <code>1</code> a <code>5</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">var a, b, c, d, e;
-a = factorial(1); // a obtiene el valor 1
-b = factorial(2); // b obtiene el valor 2
-c = factorial(3); // c obtiene el valor 6
-d = factorial(4); // d obtiene el valor 24
-e = factorial(5); // e obtiene el valor 120
-</pre>
-
-<p>Hay otras formas de llamar funciones. A menudo hay casos en los que una función se tiene que llamar dinámicamente, o el número de argumentos de una función varía, o en los que el contexto de la llamada a la función se tiene que establecer en un determinado objeto específico en tiempo de ejecución.</p>
-
-<p>Resulta que las <em>funciones en sí mismas son objetos</em> y, a su vez, estos objetos tienen métodos. (Consulta el objeto {{JSxRef("Function")}}. Uno de estos, el método {{JSxRef("Function.apply", "apply()")}}, se puede utilizar para lograr este objetivo.</p>
-
-<h2 class="deki-transform" id="Ámbito_de_function">Ámbito de <code>function</code></h2>
-
-<p>No se puede acceder a las variables definidas dentro de una función desde cualquier lugar fuera de la función, porque la variable se define solo en el ámbito de la función. Sin embargo, una función puede acceder a todas las variables y funciones definidas dentro del ámbito en el que está definida.</p>
-
-<p>En otras palabras, una función definida en el ámbito global puede acceder a todas las variables definidas en el ámbito global. Una función definida dentro de otra función también puede acceder a todas las variables definidas en su función principal y a cualquier otra variable a la que tenga acceso la función principal.</p>
-
-<pre class="brush: js notranslate">// Las siguientes variables se definen en el ámbito global
-var num1 = 20,
-    num2 = 3,
-    name = 'Chamahk';
-
-// Esta función está definida en el ámbito global
-function multiply() {
-  return num1 * num2;
-}
-
-multiply(); // Devuelve 60
-
-// Un ejemplo de función anidada
-function getScore() {
-  var num1 = 2,
-      num2 = 3;
-
-  function add() {
-    return name + ' anotó ' + (num1 + num2);
-  }
-
-  return add();
-}
-
-getScore(); // Devuelve "Chamahk anotó 5"
-</pre>
-
-<h2 id="Ámbito_y_la_pila_de_funciones">Ámbito y la pila de funciones</h2>
-
-<h3 id="Recursión">Recursión</h3>
-
-<p>Una función se puede referir y llamarse a sí misma. Hay tres formas de que una función se refiera a sí misma:</p>
-
-<ol>
- <li>El nombre de la función</li>
- <li>{{JSxRef("Funciones/arguments/callee", "arguments.callee")}}</li>
- <li>Una variable dentro del ámbito que se refiere a la función</li>
-</ol>
-
-<p>Por ejemplo, considera la siguiente definición de función:</p>
-
-<pre class="brush: js notranslate">var foo = function bar() {
-   // las instrucciones van aquí
-}
-</pre>
-
-<p>Dentro del cuerpo de la función, todos los siguientes son equivalentes:</p>
-
-<ol>
- <li><code>bar()</code></li>
- <li><code>arguments.callee()</code></li>
- <li><code>foo()</code></li>
-</ol>
-
-<p>Una función que se llama a sí misma se conoce como una <em>función recursiva</em>. En cierto modo, la recursividad es análoga a un bucle. Ambas ejecutan el mismo código varias veces y ambas requieren una condición (para evitar un bucle infinito, o más bien, una recursividad infinita en este caso).</p>
-
-<p>Por ejemplo, el siguiente bucle...</p>
-
-<pre class="brush: js notranslate">var x = 0;
-while (x &lt; 10) { // "x &lt; 10" es la condición del bucle
-   // hacer cosas
-   x++;
-}
-</pre>
-
-<p>...se puede convertir en una declaración de función recursiva, seguida de una llamada a esa función:</p>
-
-<pre class="brush: js notranslate">function loop(x) {
-  if (x &gt;= 10) // "x &gt;= 10" es la condición de salida (equivalente a "!(x &lt; 10)")
-    return;
-  // hacer cosas
-  loop(x + 1); // la llamada recursiva
-}
-loop(0);
-</pre>
-
-<p>Sin embargo, algunos algoritmos no pueden ser simples bucles iterativos. Por ejemplo, obtener todos los nodos de una estructura de árbol (como {{web.link("/es/docs/DOM", "DOM")}}) es más fácil a través de la recursividad:</p>
-
-<pre class="brush: js notranslate">function walkTree(node) {
-  if (node == null) //
-    return;
-  // hacer algo con el nodo
-  for (var i = 0; i &lt; node.childNodes.length; i++) {
-    walkTree(node.childNodes[i]);
-  }
-}
-</pre>
-
-<p>En comparación con la función <code>loop</code>, cada llamada recursiva en sí misma hace muchas llamadas recursivas aquí.</p>
-
-<p>Es posible convertir cualquier algoritmo recursivo en uno no recursivo, pero la lógica suele ser mucho más compleja, y hacerlo requiere el uso de una pila.</p>
-
-<p>De hecho, la recursividad en sí misma usa una pila: la pila de funciones. El comportamiento similar a una pila se puede ver en el siguiente ejemplo:</p>
-
-<pre class="brush: js notranslate">function foo(i) {
-  if (i &lt; 0)
-    return;
-  console.log('inicio: ' + i);
-  foo(i - 1);
-  console.log('fin: ' + i);
-}
-foo(3);
-
-// Produce:
-
-// inicio: 3
-// inicio: 2
-// inicio: 1
-// inicio: 0
-// fin: 0
-// fin: 1
-// fin: 2
-// fin: 3</pre>
-
-<h3 id="Funciones_anidadas_y_cierres">Funciones anidadas y cierres</h3>
-
-<p>Puedes anidar una función dentro de otra función. La función anidada (interna) es privada de su función contenedora (externa).</p>
-
-<p>También forma un <em>cierre</em>. Un cierre es una expresión (comúnmente, una función) que puede tener variables libres junto con un entorno que une esas variables (que "cierra" la expresión).</p>
-
-<p>Dado que una función anidada es un cierre, significa que una función anidada puede "heredar" los argumentos y variables de su función contenedora. En otras palabras, la función interna contiene el ámbito de la función externa.</p>
-
-<p>Para resumir:</p>
-
-<ul>
- <li>Solo se puede acceder a la función interna desde declaraciones en la función externa.</li>
-</ul>
-
-<ul>
- <li>La función interna forma un cierre: la función interna puede usar los argumentos y variables de la función externa, mientras que la función externa no puede usar los argumentos y variables de la función interna.</li>
-</ul>
-
-<p>El siguiente ejemplo muestra funciones anidadas:</p>
-
-<pre class="brush: js notranslate">function addSquares(a, b) {
-  function square(x) {
-    return x * x;
-  }
-  return square(a) + square(b);
-}
-a = addSquares(2, 3); // devuelve 13
-b = addSquares(3, 4); // devuelve 25
-c = addSquares(4, 5); // devuelve 41
-</pre>
-
-<p>Dado que la función interna forma un cierre, puedes llamar a la función externa y especificar argumentos tanto para la función externa como para la interna:</p>
-
-<pre class="brush: js notranslate">function outside(x) {
-  function inside(y) {
-    return x + y;
-  }
-  return inside;
-}
-fn_inside = outside(3); // Piensa en ello como: dame una función que agregue 3 a lo que sea que le des
-                        // eso
-result = fn_inside(5); // devuelve 8
-
-result1 = outside(3)(5); // devuelve 8
-</pre>
-
-<h3 id="Preservación_de_variables">Preservación de variables</h3>
-
-<p>Observa cómo se conserva <code>x</code> cuando se devuelve <code>inside</code>. Un cierre debe conservar los argumentos y variables en todos los ámbitos a los que hace referencia. Dado que cada llamada proporciona argumentos potencialmente diferentes, se crea un nuevo cierre para cada llamada a <code>outside</code>. La memoria se puede liberar solo cuando el <code>inside</code> devuelto ya no es accesible.</p>
-
-<p>Esto no es diferente de almacenar referencias en otros objetos, pero a menudo es menos obvio porque uno no establece las referencias directamente y no las puede inspeccionar.</p>
-
-<h3 id="Funciones_multianidadas">Funciones multianidadas</h3>
-
-<p>Las funciones se pueden anidar de forma múltiple. Por ejemplo:</p>
-
-<ul>
- <li>Una función (<code>A</code>) contiene una función (<code>B</code>), que a su vez contiene una función (<code>C</code>).</li>
- <li>Ambas funciones <code>B</code> y <code>C</code> forman cierres aquí. Por tanto, <code>B</code> puede acceder a <code>A</code> y <code>C</code> puede acceder a <code>B</code>.</li>
- <li>Además, dado que <code>C</code> puede acceder a <code>B</code> que puede acceder a <code>A</code>, <code>C</code> también puede acceder a <code>A</code>.</li>
-</ul>
-
-<p>Por tanto, los cierres pueden contener múltiples ámbitos; contienen de forma recursiva el ámbito de las funciones que la contienen. Esto se llama <em>encadenamiento de alcance</em>. (La razón por la que se llama "encadenamiento" se explica más adelante).</p>
-
-<p>Considera el siguiente ejemplo:</p>
-
-<pre class="brush: js notranslate">function A(x) {
-  function B(y) {
-    function C(z) {
-      console.log(x + y + z);
-    }
-    C(3);
-  }
-  B(2);
-}
-A(1); // registra 6 (1 + 2 + 3)
-</pre>
-
-<p>En este ejemplo, <code>C</code> accede a <code>y</code> de <code>B</code> y a <code>x</code> de <code>A</code>.</p>
-
-<p>Esto se puede hacer porque:</p>
-
-<ol>
- <li><code>B</code> forma un cierre que incluye a <code>A</code> (es decir, <code>B</code> puede acceder a los argumentos y variables de <code>A</code>).</li>
- <li><code>C</code> forma un cierre que incluye a <code>B</code>.</li>
- <li>Debido a que el cierre de <code>B</code> incluye a <code>A</code>, el cierre de <code>C</code> incluye a <code>A</code>, <code>C</code> puede acceder a los argumentos <em>y variables</em> de <code>B</code> <em>y</em> de <code>A</code>. En otras palabras, <code>C</code> <em>encadena</em> los ámbitos de <code>B</code> y <code>A</code>, <em>en ese orden</em>.</li>
-</ol>
-
-<p>Sin embargo, lo contrario no es cierto. <code>A</code> no puede acceder a <code>C</code>, porque <code>A</code> no puede acceder a ningún argumento o variable de <code>B</code>, del que <code>C</code> es una variable. Por lo tanto, <code>C</code> permanece privado solo para <code>B</code>.</p>
-
-<h3 id="Conflictos_de_nombres">Conflictos de nombres</h3>
-
-<p>Cuando dos argumentos o variables en el ámbito de un cierre tienen el mismo nombre, hay un <em>conflicto de nombres</em>. Tiene más prioridad el ámbito anidado. Entonces, el ámbito más interno tiene la mayor prioridad, mientras que el ámbito más externo tiene la más baja. Esta es la cadena de ámbito. El primero de la cadena es el ámbito más interno y el último es el ámbito más externo. Considera lo siguiente:</p>
-
-<pre class="brush: js notranslate">function outside() {
-  var x = 5;
-  function inside(x) {
-    return x * 2;
-  }
-  return inside;
-}
-
-outside()(10); // devuelve 20 en lugar de 10
-</pre>
-
-<p>El conflicto de nombre ocurre en la declaración <code>return x</code> y está entre el parámetro <code>x</code> de <code>inside</code> y la variable <code>x</code> de <code>outside</code>. La cadena de ámbito aquí es {<code>inside</code>, <code>outside</code>, objeto global}. Por lo tanto, <code>x</code> de <code>inside</code> tiene precedencia sobre <code>x</code> de <code>outside</code> y <code>20</code> (<code>x</code>) de <code>inside</code> se devuelve en lugar de <code>10</code> (<code>x</code> de <code>outside</code>).</p>
-
-<h2 id="Cierres">Cierres</h2>
-
-<p>Los cierres son una de las características más poderosas de JavaScript. JavaScript permite el anidamiento de funciones y otorga a la función interna acceso completo a todas las variables y funciones definidas dentro de la función externa (y todas las demás variables y funciones a las que la función externa tiene acceso).</p>
-
-<p>Sin embargo, la función externa <em>no</em> tiene acceso a las variables y funciones definidas dentro de la función interna. Esto proporciona una especie de encapsulación para las variables de la función interna.</p>
-
-<p>Además, dado que la función interna tiene acceso a el ámbito de la función externa, las variables y funciones definidas en la función externa vivirán más que la duración de la ejecución de la función externa, si la función interna logra sobrevivir más allá de la vida de la función externa. Se crea un cierre cuando la función interna de alguna manera se pone a disposición de cualquier ámbito fuera de la función externa.</p>
-
-<pre class="brush: js notranslate">var pet = function(name) {   // La función externa define una variable llamada "name"
-  var getName = function() {
-    return name;             // La función interna tiene acceso a la variable
-                             // "name" de la función externa
-  }
-  return getName;            // Devuelve la función interna, exponiéndola así a ámbitos externos
-}
-myPet = pet('Vivie');
-
-myPet();                     // Devuelve "Vivie"
-</pre>
-
-<p>Puede ser mucho más complejo que el código anterior. Se puede devolver un objeto que contiene métodos para manipular las variables internas de la función externa.</p>
-
-<pre class="brush: js notranslate">var createPet = function(name) {
-  var sex;
-
-  return {
-    setName: function(newName) {
-      name = newName;
-    },
-
-    getName: function() {
-      return name;
-    },
-
-    getSex: function() {
-      return sex;
-    },
-
-    setSex: function(newSex) {
-      if(typeof newSex === 'string' &amp;&amp; (newSex.toLowerCase() === 'male' ||
-        newSex.toLowerCase() === 'female')) {
-        sex = newSex;
-      }
-    }
-  }
-}
-
-var pet = createPet('Vivie');
-pet.getName();                  // Vivie
-
-pet.setName('Oliver');
-pet.setSex('male');
-pet.getSex();                   // male
-pet.getName();                  // Oliver
-</pre>
-
-<p>En el código anterior, la variable <code>name</code> de la función externa es accesible para las funciones internas, y no hay otra forma de acceder a las variables internas excepto a través de las funciones internas. Las variables internas de las funciones internas actúan como almacenes seguros para los argumentos y variables externos. Contienen datos "persistentes" y "encapsulados" para que trabajen las funciones internas. Las funciones ni siquiera tienen que estar asignadas a una variable o tener un nombre.</p>
-
-<pre class="brush: js notranslate">var getCode = (function() {
-  var apiCode = '0]Eal(eh&amp;2';    // Un código que no queremos que los externos puedan modificar...
-
-  return function() {
-    return apiCode;
-  };
-})();
-
-getCode();    // Devuelve el apiCode
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Precaución</strong> ¡Hay una serie de trampas a tener en cuenta al usar cierres!</p>
-
-<p>Si una función encerrada define una variable con el mismo nombre que una variable en el ámbito externo, entonces no hay forma de hacer referencia a la variable en el ámbito externo nuevamente. (La variable de ámbito interno "anula" la externa, hasta que el programa sale de el ámbito interno).</p>
-
-<pre class="example-bad brush: js notranslate">var createPet = function(name) {  // La función externa define una variable llamada "name".
-  return {
-    setName: function(name) {    // La función envolvente también define una variable llamada "name".
-      name = name;               // ¿Cómo accedemos al "name" definido por la función externa?
-    }
-  }
-}
-</pre>
-</div>
-
-<h2 id="Usar_el_objeto_arguments">Usar el objeto <code>arguments</code></h2>
-
-<p>El <code>arguments</code> de una función se mantiene en un objeto similar a un arreglo. Dentro de una función, puedes abordar los argumentos que se le pasan de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">arguments[i]
-</pre>
-
-<p>donde <code>i</code> es el número ordinal del argumento, comenzando en <code>0</code>. Entonces, el primer argumento que se pasa a una función sería <code>arguments[0]</code>. El número total de argumentos se indica mediante <code>arguments.length</code>.</p>
-
-<p>Usando el objeto <code>arguments</code>, puedes llamar a una función con más argumentos de los que formalmente declara aceptar. Esto suele ser útil si no sabes de antemano cuántos argumentos se pasarán a la función. Puedes usar <code>arguments.length</code> para determinar el número de argumentos que realmente se pasan a la función, y luego acceder a cada argumento usando el objeto <code>arguments</code>.</p>
-
-<p>Por ejemplo, considera una función que concatena varias cadenas. El único argumento formal para la función es una cadena que especifica los caracteres que separan los elementos a concatenar. La función se define de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">function myConcat(separator) {
-   var result = ''; // inicia list
-   var i;
-   // itera a través de arguments
-   for (i = 1; i &lt; arguments.length; i++) {
-      result += arguments[i] + separator;
-   }
-   return result;
-}
-</pre>
-
-<p>Puedes pasar cualquier número de argumentos a esta función, y concatena cada argumento en una "lista" de cadenas:</p>
-
-<pre class="brush: js notranslate">// devuelve "red, orange, blue, "
-myConcat(', ', 'red', 'orange', 'blue');
-
-// devuelve "elephant; giraffe; lion; cheetah"
-myConcat('; ', 'elephant', 'giraffe', 'lion', 'cheetah');
-
-// devuelve "sage. basil. oregano. pepper. perejil. "
-myConcat('. ', 'salvia', 'albahaca', 'orégano', 'pimienta', 'perejil');
-</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: La variable <code>arguments</code> es "similar a un arreglo", pero no es un arreglo. Es similar a un arreglo en el sentido de que tiene un índice numerado y una propiedad <code>length</code>. Sin embargo, <em>no</em> posee todos los métodos de manipulación de arreglos.</p>
-</div>
-
-<p>Consulta el objeto {{JSxRef("Function")}} en la referencia de JavaScript para obtener más información.</p>
-
-<h2 id="Parámetros_de_función">Parámetros de función</h2>
-
-<p>A partir de ECMAScript 2015, hay dos nuevos tipos de parámetros: <em>parámetros predeterminados</em> y <em>parámetros resto</em>.</p>
-
-<h3 id="Parámetros_predeterminados">Parámetros predeterminados</h3>
-
-<p>En JavaScript, los parámetros de las funciones están predeterminados en <code>undefined</code>. Sin embargo, en algunas situaciones puede resultar útil establecer un valor predeterminado diferente. Esto es exactamente lo que hacen los parámetros predeterminados.</p>
-
-<h4 id="Sin_parámetros_predeterminados_preECMAScript_2015">Sin parámetros predeterminados (preECMAScript 2015)</h4>
-
-<p>En el pasado, la estrategia general para establecer valores predeterminados era probar los valores de los parámetros en el cuerpo de la función y asignar un valor si eran <code>undefined</code>.</p>
-
-<p>En el siguiente ejemplo, si no se proporciona ningún valor para <code>b</code>, su valor sería <code>undefined</code> al evaluar <code>a * b</code>, y una llamada a <code>multiply</code> normalmente habría devuelto <code>NaN</code>. Sin embargo, esto se evita con la segunda línea de este ejemplo:</p>
-
-<pre class="brush: js notranslate">function multiply(a, b) {
-  b = typeof b !== 'undefined' ?  b : 1;
-
-  return a * b;
-}
-
-multiply(5); // 5
-</pre>
-
-<h4 id="Con_parámetros_predeterminados_posECMAScript_2015">Con parámetros predeterminados (posECMAScript 2015)</h4>
-
-<p>Con <em>parámetros predeterminados</em>, ya no es necesaria una verificación manual en el cuerpo de la función. Simplemente puedes poner <code>1</code> como valor predeterminado para <code>b</code> en el encabezado de la función:</p>
-
-<pre class="brush: js notranslate">function multiply(a, b = 1) {
-  return a * b;
-}
-
-multiply(5); // 5</pre>
-
-<p>Para obtener más detalles, consulta {{JSxRef("Funciones/Parametros_predeterminados", "parámetros predeterminados")}} en la referencia.</p>
-
-<h3 id="Parámetros_rest">Parámetros <code>rest</code></h3>
-
-<p>La sintaxis del {{JSxRef("Funciones/Parametros_rest", "parámetro rest")}} nos permite representar un número indefinido de argumentos como un arreglo.</p>
-
-<p>En el siguiente ejemplo, la función <code>multiply</code> usa <em>parámetros <code>rest</code></em> para recopilar argumentos desde el segundo hasta el final. Luego, la función los multiplica por el primer argumento.</p>
-
-<pre class="brush: js notranslate">function multiply(multiplier, ...theArgs) {
-  return theArgs.map(x =&gt; multiplier * x);
-}
-
-var arr = multiply(2, 1, 2, 3);
-console.log(arr); // [2, 4, 6]</pre>
-
-<h2 id="Funciones_Flecha">Funciones Flecha</h2>
-
-<p>Una {{JSxRef("Funciones/Funciones_flecha", "expresión de función flecha")}} (anteriormente, y ahora conocida incorrectamente como <strong>función de flecha gruesa</strong>) tiene una sintaxis más corta en comparación con las expresiones de función y no tiene su propio {{JSxRef("Operadores/this", "this")}}, {{JSxRef("Funciones/arguments", "arguments")}}, {{JSxRef("Operadores/super", "super")}} o {{JSxRef("../Operadores/new.target", "new.target")}}. Las funciones flecha siempre son anónimas. Consulta también esta publicación del blog hacks.mozilla.org: "<a href="https://hacks.mozilla.org/2015/06/es6-in-depth-arrow-functions/">ES6 en profundidad: funciones flecha</a>".</p>
-
-<p>Dos factores influyeron en la introducción de las funciones flecha: <em>funciones más cortas</em> y <em>no vinculantes</em> de <code>this</code>.</p>
-
-<h3 id="Funciones_más_cortas">Funciones más cortas</h3>
-
-<p>En algunos patrones funcionales, las funciones más cortas son bienvenidas. Compara:</p>
-
-<pre class="brush: js notranslate">var a = [
-  'Hidrógeno',
-  'Helio',
-  'Litio',
-  'Berilio'
-];
-
-var a2 = a.map(function(s) { return s.length; });
-
-console.log(a2); // logs [8, 6, 7, 9]
-
-var a3 = a.map(s =&gt; s.length);
-
-console.log(a3); // logs [8, 6, 7, 9]
-</pre>
-
-<h3 id="Sin_this_separado">Sin <code>this</code> separado</h3>
-
-<p>Hasta las funciones flecha, cada nueva función definía su propio valor {{JSxRef("Operadores/this", "this")}} (un nuevo objeto en el caso de un constructor, indefinido en llamadas a funciones en {{JSxRef("Strict_mode", "modo estricto")}}, el objeto base si la función se llama como un "método de objeto", etc.). Esto resultó ser poco menos que ideal con un estilo de programación orientado a objetos.</p>
-
-<pre class="brush: js notranslate">function Person() {
-  // El constructor Person() define `this` como él mismo.
-  this.age = 0;
-
-  setInterval(function growUp() {
-    // En modo no estricto, la función growUp() define `this`
-    // como el objeto global, que es diferente del `this`
-    // definido por el constructor Person().
-    this.age++;
-  }, 1000);
-}
-
-var p = new Person();</pre>
-
-<p>En ECMAScript 3/5, este problema se solucionó asignando el valor en <code>this</code> a una variable que se podría cerrar.</p>
-
-<pre class="brush: js notranslate">function Person() {
-  var self = this; // Algunos eligen `that` en lugar de` self`.
-                   // Elige uno y se congruente.
-  self.age = 0;
-
-  setInterval(function growUp() {
-    // La retrollamada se refiere a la variable `self` de la cual
-    // el valor es el objeto esperado.
-    self.age++;
-  }, 1000);
-}</pre>
-
-<p>Alternativamente, podrías crear una {{JSxRef("Objetos_globales/Function/bind", "función vinculada")}} para que el valor <code>this</code> adecuado se pasara a la función <code>growUp()</code>.</p>
-
-<p>Una función flecha no tiene su propio <code>this</code> se utiliza el valor de <code>this</code> del contexto de ejecución adjunto. Por lo tanto, en el siguiente código, <code>this</code> dentro de la función que se pasa a <code>setInterval</code> tiene el mismo valor que <code>this</code> en la función adjunta:</p>
-
-<pre class="brush: js notranslate">function Person() {
-  this.age = 0;
-
-  setInterval(() =&gt; {
-    this.age++; // |this| propiamente se refiere al objeto person
-  }, 1000);
-}
-
-var p = new Person();</pre>
-
-<h2 id="Funciones_predefinidas">Funciones predefinidas</h2>
-
-<p>JavaScript tiene integradas varias funciones de nivel superior:</p>
-
-<dl>
- <dt>{{JSxRef("Objetos_globales/eval", "eval()")}}</dt>
- <dd>
- <p>El método <code><strong>eval()</strong></code> evalúa el código JavaScript representado como una cadena.</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/uneval", "uneval()")}}</dt>
- <dd>
- <p>El método <code><strong>uneval()</strong></code> crea una representación de cadena del código fuente de un {{JSxRef("Object")}}.</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/isFinite", "isFinite()")}}</dt>
- <dd>
- <p>La función global <code><strong>isFinite()</strong></code> determina si el valor pasado es un número finito. Si es necesario, el parámetro, primero se convierte en un número.</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/isNaN", "isNaN()")}}</dt>
- <dd>
- <p>La función <code><strong>isNaN()</strong></code> determina si un valor es {{JSxRef("Objetos_globales/NaN", "NaN")}} o no. <strong>Nota</strong>: La coerción dentro de la función <code>isNaN</code> tiene {{JSxRef("Objetos_globales/isNaN", "interesantes", "#Descripcion")}} reglas; también puedes querer usar {{JSxRef("Number.isNaN()")}}, como se define en ECMAScript 2015, o puedes usar {{JSxRef("Operadores/typeof", "typeof")}} para determinar si el valor no es un número (<code>NaN</code>).</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/parseFloat", "parseFloat()")}}</dt>
- <dd>
- <p>La función <code><strong>parseFloat()</strong></code> procesa un argumento de cadena y devuelve un número de punto flotante.</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/parseInt", "parseInt()")}}</dt>
- <dd>
- <p>La función <code><strong>parseInt()</strong></code> procesa un argumento de cadena y devuelve un número entero de la base especificada (la base en los sistemas numéricos matemáticos).</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/decodeURI", "decodeURI()")}}</dt>
- <dd>
- <p>La función <code><strong>decodeURI()</strong></code> decodifica un identificador uniforme de recursos (URI) creado previamente por {{JSxRef("Objetos_globales/encodeURI", "encodeURI")}} o por una rutina similar.</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/decodeURIComponent", "decodeURIComponent()")}}</dt>
- <dd>
- <p>El método <code><strong>decodeURIComponent()</strong></code> decodifica un componente Identificador uniforme de recursos (URI) creado previamente por {{JSxRef("Objetos_globales/encodeURIComponent", "encodeURIComponent")}} o por un rutina similar.</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/encodeURI", "encodeURI()")}}</dt>
- <dd>
- <p>El método <code><strong>encodeURI()</strong></code> codifica un identificador uniforme de recursos (URI) reemplazando cada instancia de ciertos caracteres por una, dos, tres o cuatro secuencias de escape que representan la codificación UTF-8 del caracter (solo habrá cuatro secuencias de escape para caracteres compuestos por dos caracteres "sustitutos").</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/encodeURIComponent", "encodeURIComponent()")}}</dt>
- <dd>
- <p>El método <code><strong>encodeURIComponent()</strong></code> codifica un componente Identificador uniforme de recursos (URI) reemplazando cada instancia de ciertos caracteres por una, dos, tres o cuatro secuencias de escape que representan la codificación UTF-8 del caracter (solo habrá cuatro secuencias de escape para caracteres compuestos por dos caracteres "sustitutos").</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/escape", "escape()")}}</dt>
- <dd>
- <p>El método obsoleto <code><strong>escape()</strong></code> calcula una nueva cadena en la que ciertos caracteres han sido reemplazados por una secuencia de escape hexadecimal. En su lugar usa {{JSxRef("Objetos_globales/encodeURI", "encodeURI")}} o {{JSxRef("Objetos_globales/encodeURIComponent", "encodeURIComponent")}}.</p>
- </dd>
- <dt>{{JSxRef("Objetos_globales/unescape", "unescape()")}}</dt>
- <dd>
- <p>El método obsoleto <code><strong>unescape()</strong></code> calcula una nueva cadena en la que las secuencias de escape hexadecimales se reemplazan con el caracter que representan. Las secuencias de escape se pueden introducir por medio de una función como {{JSxRef("Objetos_globales/escape", "escape")}}. Debido a que <code>unescape()</code> está en desuso, usa {{JSxRef("Objetos_globales/decodeURI", "decodeURI()")}} o {{JSxRef("Objetos_globales/decodeURIComponent", "decodeURIComponent")}} en su lugar.</p>
- </dd>
-</dl>
-
-<p>{{PreviousNext("Web/JavaScript/Guide/Loops_and_iteration", "Web/JavaScript/Guide/Expressions_and_Operators")}}</p>
diff --git a/files/es/web/javascript/guide/functions/index.html b/files/es/web/javascript/guide/functions/index.html
new file mode 100644
index 0000000000..0f4bb56c2b
--- /dev/null
+++ b/files/es/web/javascript/guide/functions/index.html
@@ -0,0 +1,707 @@
+---
+title: Funciones
+slug: Web/JavaScript/Guide/Functions
+tags:
+  - Funciones
+  - Guía
+  - JavaScript
+  - Novato
+  - Principiante
+  - l10n:priority
+translation_of: Web/JavaScript/Guide/Functions
+original_slug: Web/JavaScript/Guide/Funciones
+---
+<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Loops_and_iteration", "Web/JavaScript/Guide/Expressions_and_Operators")}}</div>
+
+<p class="summary">Las funciones son uno de los bloques de construcción fundamentales en JavaScript. Una función en JavaScript es similar a un procedimiento — un conjunto de instrucciones que realiza una tarea o calcula un valor, pero para que un procedimiento califique como función, debe tomar alguna entrada y devolver una salida donde hay alguna relación obvia entre la entrada y la salida. Para usar una función, debes definirla en algún lugar del ámbito desde el que deseas llamarla.</p>
+
+<p>Consulta también el {{JSxRef("Funciones", "capítulo de referencia exhaustivo sobre funciones de JavaScript")}} para conocer los detalles.</p>
+
+<h2 id="Definir_funciones">Definir funciones</h2>
+
+<h3 id="Declaración_de_función">Declaración de función</h3>
+
+<p>Una <strong>definición de función</strong> (también denominada <strong>declaración de función</strong> o <strong>expresión de función</strong>) consta de la palabra clave {{JSxRef("Sentencias/function", "function")}}, seguida de:</p>
+
+<ul>
+ <li>El nombre de la función.</li>
+ <li>Una lista de parámetros de la función, entre paréntesis y separados por comas.</li>
+ <li>Las declaraciones de JavaScript que definen la función, encerradas entre llaves, <code>{ ... }</code>.</li>
+</ul>
+
+<p>Por ejemplo, el siguiente código define una función simple llamada <code>square</code> ("cuadrado"):</p>
+
+<pre class="brush: js notranslate">function square(number) {
+  return number * number;
+}
+</pre>
+
+<p>La función <code>square</code> toma un parámetro, llamado <code>number</code>. La función consta de una declaración que dice devuelva el parámetro de la función (es decir, <code>number</code>) multiplicado por sí mismo. La instrucción {{JSxRef("Sentencias/return", "return")}} especifica el valor devuelto por la función:</p>
+
+<pre class="brush: js notranslate">return number * number;
+</pre>
+
+<p>Los parámetros primitivos (como un <code>number</code>) se pasan a las funciones <strong>por valor</strong>; el valor se pasa a la función, pero si la función cambia el valor del parámetro, <strong>este cambio no se refleja globalmente ni en la función que llama</strong>.</p>
+
+<p>Si pasas un objeto (es decir, un valor no primitivo, como {{JSxRef("Array")}} o un objeto definido por el usuario) como parámetro y la función cambia las propiedades del objeto, ese cambio es visible fuera de la función, como se muestra en el siguiente ejemplo:</p>
+
+<pre class="brush: js notranslate">function myFunc(theObject) {
+  theObject.make = 'Toyota';
+}
+
+[parcial]var mycar = { make: 'Honda', model: 'Accord', year: 1998 };
+var x, y;
+
+x = mycar.make; // x obtiene el valor "Honda"
+
+myFunc(mycar);
+y = mycar.make; // y obtiene el valor "Toyota"
+                // (la propiedad make fue cambiada por la función)
+</pre>
+
+<h3 id="Expresiones_function">Expresiones <code>function</code></h3>
+
+<p>Si bien la declaración de función anterior sintácticamente es una declaración, las funciones también se pueden crear mediante una {{JSxRef("Operadores/function", "expresión function")}}.</p>
+
+<p>Esta función puede ser <strong>anónima</strong>; no tiene por qué tener un nombre. Por ejemplo, la función <code>square</code> se podría haber definido como:</p>
+
+<pre class="brush: js notranslate">const square = function(number) { return number * number }
+var x = square(4) // x obtiene el valor 16</pre>
+
+<p>Sin embargo, <em>puedes</em> proporcionar un nombre con una expresión <code>function</code>. Proporcionar un nombre permite que la función se refiera a sí misma y también facilita la identificación de la función en el seguimiento de la pila de un depurador:</p>
+
+<pre class="brush: js notranslate">const factorial = function fac(n) { return n &lt; 2 ? 1 : n * fac(n - 1) }
+
+console.log(factorial(3))
+</pre>
+
+<p>Las expresiones <code>function</code> son convenientes cuando se pasa una función como argumento a otra función. El siguiente ejemplo muestra una función <code>map</code> que debería recibir una función como primer argumento y un arreglo como segundo argumento.</p>
+
+<pre class="brush: js notranslate">function map(f, a) {
+  let result = []; // Crea un nuevo arreglo
+  let i; // Declara una variable
+  for (i = 0; i != a.length; i++)
+    result[i] = f(a[i]);
+  return result;
+}
+</pre>
+
+<p>En el siguiente código, la función recibe una función definida por una expresión de función y la ejecuta por cada elemento del arreglo recibido como segundo argumento.</p>
+
+<pre class="brush: js notranslate">function map(f, a) {
+  let result = []; // Crea un nuevo arreglo
+  let i; // Declara una variable
+  for (i = 0; i != a.length; i++)
+    result[i] = f(a[i]);
+  return result;
+}
+const f = function(x) {
+   return x * x * x;
+}
+let numbers = [0, 1, 2, 5, 10];
+let cube = map(f,numbers);
+console.log(cube);</pre>
+
+<p>La función devuelve: <code>[0, 1, 8, 125, 1000]</code>.</p>
+
+<p>En JavaScript, una función se puede definir en función de una condición. Por ejemplo, la siguiente definición de función define <code>myFunc</code> solo si <code>num</code> es igual a <code>0</code>:</p>
+
+<pre class="brush: js notranslate">var myFunc;
+if (num === 0) {
+  myFunc = function(theObject) {
+    theObject.make = 'Toyota';
+  }
+}</pre>
+
+<p>Además de definir funciones como se describe aquí, también puedes usar el constructor {{JSxRef("Function")}} para crear funciones a partir de una cadena en tiempo de ejecución, muy al estilo de {{JSxRef("eval", "eval()")}}.</p>
+
+<p>Un <strong>método</strong> es una función que es propiedad de un objeto. Obten más información sobre objetos y métodos en {{JSxRef("../Guide/Working_with_Objects", "Trabajar con objetos")}}.</p>
+
+<h2 id="Llamar_funciones">Llamar funciones</h2>
+
+<p><em>Definir</em> una función no la <em>ejecuta</em>. Definirla simplemente nombra la función y especifica qué hacer cuando se llama a la función.</p>
+
+<p><strong>Llamar</strong> a la función en realidad lleva a cabo las acciones especificadas con los parámetros indicados. Por ejemplo, si defines la función <code>square</code>, podrías llamarla de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">square(5);
+</pre>
+
+<p>La declaración anterior llama a la función con un argumento de <code>5</code>. La función ejecuta sus declaraciones y devuelve el valor <code>25</code>.</p>
+
+<p>Las funciones deben estar <em>dentro del ámbito</em> cuando se llaman, pero la declaración de la función se puede elevar (cuando aparece debajo de la llamada en el código), como en este ejemplo:</p>
+
+<pre class="brush: js notranslate">console.log(square(5));
+/* ... */
+function square(n) { return n * n }
+</pre>
+
+<p>El ámbito de una función es la función en la que se declara (o el programa completo, si se declara en el nivel superior).</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Esto solo trabaja cuando se define la función usando la sintaxis anterior (es decir, <code>function funcName() {}</code>). El siguiente código no trabajará.</p>
+
+<p>Esto significa que la elevación de función solo trabaja con <em>declaraciones</em> de función, no con <em>expresiones</em> de función.</p>
+
+<pre class="brush: js example-bad notranslate">console.log(square)    // square se eleva con un valor inicial undefined.
+console.log(square(5)) // Error de tipo no detectado: square no es una función
+const square = function(n) {
+  return n * n;
+}
+</pre>
+</div>
+
+<p>Los argumentos de una función no se limitan a cadenas y números. Puedes pasar objetos completos a una función. La función <code>show_props()</code> (definida en {{JSxRef("../Guide/Working_with_Objects", "Trabajar con objetos", "#Objetos_y_propiedades")}} es un ejemplo de una función que toma un objeto como argumento.</p>
+
+<p>Una función se puede llamar a sí misma. Por ejemplo, aquí hay una función que calcula factoriales de forma recursiva:</p>
+
+<pre class="brush: js notranslate">function factorial(n) {
+  if ((n === 0) || (n === 1))
+    return 1;
+  else
+    return (n * factorial(n - 1));
+}
+</pre>
+
+<p>Luego, podrías calcular los factoriales de <code>1</code> a <code>5</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">var a, b, c, d, e;
+a = factorial(1); // a obtiene el valor 1
+b = factorial(2); // b obtiene el valor 2
+c = factorial(3); // c obtiene el valor 6
+d = factorial(4); // d obtiene el valor 24
+e = factorial(5); // e obtiene el valor 120
+</pre>
+
+<p>Hay otras formas de llamar funciones. A menudo hay casos en los que una función se tiene que llamar dinámicamente, o el número de argumentos de una función varía, o en los que el contexto de la llamada a la función se tiene que establecer en un determinado objeto específico en tiempo de ejecución.</p>
+
+<p>Resulta que las <em>funciones en sí mismas son objetos</em> y, a su vez, estos objetos tienen métodos. (Consulta el objeto {{JSxRef("Function")}}. Uno de estos, el método {{JSxRef("Function.apply", "apply()")}}, se puede utilizar para lograr este objetivo.</p>
+
+<h2 class="deki-transform" id="Ámbito_de_function">Ámbito de <code>function</code></h2>
+
+<p>No se puede acceder a las variables definidas dentro de una función desde cualquier lugar fuera de la función, porque la variable se define solo en el ámbito de la función. Sin embargo, una función puede acceder a todas las variables y funciones definidas dentro del ámbito en el que está definida.</p>
+
+<p>En otras palabras, una función definida en el ámbito global puede acceder a todas las variables definidas en el ámbito global. Una función definida dentro de otra función también puede acceder a todas las variables definidas en su función principal y a cualquier otra variable a la que tenga acceso la función principal.</p>
+
+<pre class="brush: js notranslate">// Las siguientes variables se definen en el ámbito global
+var num1 = 20,
+    num2 = 3,
+    name = 'Chamahk';
+
+// Esta función está definida en el ámbito global
+function multiply() {
+  return num1 * num2;
+}
+
+multiply(); // Devuelve 60
+
+// Un ejemplo de función anidada
+function getScore() {
+  var num1 = 2,
+      num2 = 3;
+
+  function add() {
+    return name + ' anotó ' + (num1 + num2);
+  }
+
+  return add();
+}
+
+getScore(); // Devuelve "Chamahk anotó 5"
+</pre>
+
+<h2 id="Ámbito_y_la_pila_de_funciones">Ámbito y la pila de funciones</h2>
+
+<h3 id="Recursión">Recursión</h3>
+
+<p>Una función se puede referir y llamarse a sí misma. Hay tres formas de que una función se refiera a sí misma:</p>
+
+<ol>
+ <li>El nombre de la función</li>
+ <li>{{JSxRef("Funciones/arguments/callee", "arguments.callee")}}</li>
+ <li>Una variable dentro del ámbito que se refiere a la función</li>
+</ol>
+
+<p>Por ejemplo, considera la siguiente definición de función:</p>
+
+<pre class="brush: js notranslate">var foo = function bar() {
+   // las instrucciones van aquí
+}
+</pre>
+
+<p>Dentro del cuerpo de la función, todos los siguientes son equivalentes:</p>
+
+<ol>
+ <li><code>bar()</code></li>
+ <li><code>arguments.callee()</code></li>
+ <li><code>foo()</code></li>
+</ol>
+
+<p>Una función que se llama a sí misma se conoce como una <em>función recursiva</em>. En cierto modo, la recursividad es análoga a un bucle. Ambas ejecutan el mismo código varias veces y ambas requieren una condición (para evitar un bucle infinito, o más bien, una recursividad infinita en este caso).</p>
+
+<p>Por ejemplo, el siguiente bucle...</p>
+
+<pre class="brush: js notranslate">var x = 0;
+while (x &lt; 10) { // "x &lt; 10" es la condición del bucle
+   // hacer cosas
+   x++;
+}
+</pre>
+
+<p>...se puede convertir en una declaración de función recursiva, seguida de una llamada a esa función:</p>
+
+<pre class="brush: js notranslate">function loop(x) {
+  if (x &gt;= 10) // "x &gt;= 10" es la condición de salida (equivalente a "!(x &lt; 10)")
+    return;
+  // hacer cosas
+  loop(x + 1); // la llamada recursiva
+}
+loop(0);
+</pre>
+
+<p>Sin embargo, algunos algoritmos no pueden ser simples bucles iterativos. Por ejemplo, obtener todos los nodos de una estructura de árbol (como {{web.link("/es/docs/DOM", "DOM")}}) es más fácil a través de la recursividad:</p>
+
+<pre class="brush: js notranslate">function walkTree(node) {
+  if (node == null) //
+    return;
+  // hacer algo con el nodo
+  for (var i = 0; i &lt; node.childNodes.length; i++) {
+    walkTree(node.childNodes[i]);
+  }
+}
+</pre>
+
+<p>En comparación con la función <code>loop</code>, cada llamada recursiva en sí misma hace muchas llamadas recursivas aquí.</p>
+
+<p>Es posible convertir cualquier algoritmo recursivo en uno no recursivo, pero la lógica suele ser mucho más compleja, y hacerlo requiere el uso de una pila.</p>
+
+<p>De hecho, la recursividad en sí misma usa una pila: la pila de funciones. El comportamiento similar a una pila se puede ver en el siguiente ejemplo:</p>
+
+<pre class="brush: js notranslate">function foo(i) {
+  if (i &lt; 0)
+    return;
+  console.log('inicio: ' + i);
+  foo(i - 1);
+  console.log('fin: ' + i);
+}
+foo(3);
+
+// Produce:
+
+// inicio: 3
+// inicio: 2
+// inicio: 1
+// inicio: 0
+// fin: 0
+// fin: 1
+// fin: 2
+// fin: 3</pre>
+
+<h3 id="Funciones_anidadas_y_cierres">Funciones anidadas y cierres</h3>
+
+<p>Puedes anidar una función dentro de otra función. La función anidada (interna) es privada de su función contenedora (externa).</p>
+
+<p>También forma un <em>cierre</em>. Un cierre es una expresión (comúnmente, una función) que puede tener variables libres junto con un entorno que une esas variables (que "cierra" la expresión).</p>
+
+<p>Dado que una función anidada es un cierre, significa que una función anidada puede "heredar" los argumentos y variables de su función contenedora. En otras palabras, la función interna contiene el ámbito de la función externa.</p>
+
+<p>Para resumir:</p>
+
+<ul>
+ <li>Solo se puede acceder a la función interna desde declaraciones en la función externa.</li>
+</ul>
+
+<ul>
+ <li>La función interna forma un cierre: la función interna puede usar los argumentos y variables de la función externa, mientras que la función externa no puede usar los argumentos y variables de la función interna.</li>
+</ul>
+
+<p>El siguiente ejemplo muestra funciones anidadas:</p>
+
+<pre class="brush: js notranslate">function addSquares(a, b) {
+  function square(x) {
+    return x * x;
+  }
+  return square(a) + square(b);
+}
+a = addSquares(2, 3); // devuelve 13
+b = addSquares(3, 4); // devuelve 25
+c = addSquares(4, 5); // devuelve 41
+</pre>
+
+<p>Dado que la función interna forma un cierre, puedes llamar a la función externa y especificar argumentos tanto para la función externa como para la interna:</p>
+
+<pre class="brush: js notranslate">function outside(x) {
+  function inside(y) {
+    return x + y;
+  }
+  return inside;
+}
+fn_inside = outside(3); // Piensa en ello como: dame una función que agregue 3 a lo que sea que le des
+                        // eso
+result = fn_inside(5); // devuelve 8
+
+result1 = outside(3)(5); // devuelve 8
+</pre>
+
+<h3 id="Preservación_de_variables">Preservación de variables</h3>
+
+<p>Observa cómo se conserva <code>x</code> cuando se devuelve <code>inside</code>. Un cierre debe conservar los argumentos y variables en todos los ámbitos a los que hace referencia. Dado que cada llamada proporciona argumentos potencialmente diferentes, se crea un nuevo cierre para cada llamada a <code>outside</code>. La memoria se puede liberar solo cuando el <code>inside</code> devuelto ya no es accesible.</p>
+
+<p>Esto no es diferente de almacenar referencias en otros objetos, pero a menudo es menos obvio porque uno no establece las referencias directamente y no las puede inspeccionar.</p>
+
+<h3 id="Funciones_multianidadas">Funciones multianidadas</h3>
+
+<p>Las funciones se pueden anidar de forma múltiple. Por ejemplo:</p>
+
+<ul>
+ <li>Una función (<code>A</code>) contiene una función (<code>B</code>), que a su vez contiene una función (<code>C</code>).</li>
+ <li>Ambas funciones <code>B</code> y <code>C</code> forman cierres aquí. Por tanto, <code>B</code> puede acceder a <code>A</code> y <code>C</code> puede acceder a <code>B</code>.</li>
+ <li>Además, dado que <code>C</code> puede acceder a <code>B</code> que puede acceder a <code>A</code>, <code>C</code> también puede acceder a <code>A</code>.</li>
+</ul>
+
+<p>Por tanto, los cierres pueden contener múltiples ámbitos; contienen de forma recursiva el ámbito de las funciones que la contienen. Esto se llama <em>encadenamiento de alcance</em>. (La razón por la que se llama "encadenamiento" se explica más adelante).</p>
+
+<p>Considera el siguiente ejemplo:</p>
+
+<pre class="brush: js notranslate">function A(x) {
+  function B(y) {
+    function C(z) {
+      console.log(x + y + z);
+    }
+    C(3);
+  }
+  B(2);
+}
+A(1); // registra 6 (1 + 2 + 3)
+</pre>
+
+<p>En este ejemplo, <code>C</code> accede a <code>y</code> de <code>B</code> y a <code>x</code> de <code>A</code>.</p>
+
+<p>Esto se puede hacer porque:</p>
+
+<ol>
+ <li><code>B</code> forma un cierre que incluye a <code>A</code> (es decir, <code>B</code> puede acceder a los argumentos y variables de <code>A</code>).</li>
+ <li><code>C</code> forma un cierre que incluye a <code>B</code>.</li>
+ <li>Debido a que el cierre de <code>B</code> incluye a <code>A</code>, el cierre de <code>C</code> incluye a <code>A</code>, <code>C</code> puede acceder a los argumentos <em>y variables</em> de <code>B</code> <em>y</em> de <code>A</code>. En otras palabras, <code>C</code> <em>encadena</em> los ámbitos de <code>B</code> y <code>A</code>, <em>en ese orden</em>.</li>
+</ol>
+
+<p>Sin embargo, lo contrario no es cierto. <code>A</code> no puede acceder a <code>C</code>, porque <code>A</code> no puede acceder a ningún argumento o variable de <code>B</code>, del que <code>C</code> es una variable. Por lo tanto, <code>C</code> permanece privado solo para <code>B</code>.</p>
+
+<h3 id="Conflictos_de_nombres">Conflictos de nombres</h3>
+
+<p>Cuando dos argumentos o variables en el ámbito de un cierre tienen el mismo nombre, hay un <em>conflicto de nombres</em>. Tiene más prioridad el ámbito anidado. Entonces, el ámbito más interno tiene la mayor prioridad, mientras que el ámbito más externo tiene la más baja. Esta es la cadena de ámbito. El primero de la cadena es el ámbito más interno y el último es el ámbito más externo. Considera lo siguiente:</p>
+
+<pre class="brush: js notranslate">function outside() {
+  var x = 5;
+  function inside(x) {
+    return x * 2;
+  }
+  return inside;
+}
+
+outside()(10); // devuelve 20 en lugar de 10
+</pre>
+
+<p>El conflicto de nombre ocurre en la declaración <code>return x</code> y está entre el parámetro <code>x</code> de <code>inside</code> y la variable <code>x</code> de <code>outside</code>. La cadena de ámbito aquí es {<code>inside</code>, <code>outside</code>, objeto global}. Por lo tanto, <code>x</code> de <code>inside</code> tiene precedencia sobre <code>x</code> de <code>outside</code> y <code>20</code> (<code>x</code>) de <code>inside</code> se devuelve en lugar de <code>10</code> (<code>x</code> de <code>outside</code>).</p>
+
+<h2 id="Cierres">Cierres</h2>
+
+<p>Los cierres son una de las características más poderosas de JavaScript. JavaScript permite el anidamiento de funciones y otorga a la función interna acceso completo a todas las variables y funciones definidas dentro de la función externa (y todas las demás variables y funciones a las que la función externa tiene acceso).</p>
+
+<p>Sin embargo, la función externa <em>no</em> tiene acceso a las variables y funciones definidas dentro de la función interna. Esto proporciona una especie de encapsulación para las variables de la función interna.</p>
+
+<p>Además, dado que la función interna tiene acceso a el ámbito de la función externa, las variables y funciones definidas en la función externa vivirán más que la duración de la ejecución de la función externa, si la función interna logra sobrevivir más allá de la vida de la función externa. Se crea un cierre cuando la función interna de alguna manera se pone a disposición de cualquier ámbito fuera de la función externa.</p>
+
+<pre class="brush: js notranslate">var pet = function(name) {   // La función externa define una variable llamada "name"
+  var getName = function() {
+    return name;             // La función interna tiene acceso a la variable
+                             // "name" de la función externa
+  }
+  return getName;            // Devuelve la función interna, exponiéndola así a ámbitos externos
+}
+myPet = pet('Vivie');
+
+myPet();                     // Devuelve "Vivie"
+</pre>
+
+<p>Puede ser mucho más complejo que el código anterior. Se puede devolver un objeto que contiene métodos para manipular las variables internas de la función externa.</p>
+
+<pre class="brush: js notranslate">var createPet = function(name) {
+  var sex;
+
+  return {
+    setName: function(newName) {
+      name = newName;
+    },
+
+    getName: function() {
+      return name;
+    },
+
+    getSex: function() {
+      return sex;
+    },
+
+    setSex: function(newSex) {
+      if(typeof newSex === 'string' &amp;&amp; (newSex.toLowerCase() === 'male' ||
+        newSex.toLowerCase() === 'female')) {
+        sex = newSex;
+      }
+    }
+  }
+}
+
+var pet = createPet('Vivie');
+pet.getName();                  // Vivie
+
+pet.setName('Oliver');
+pet.setSex('male');
+pet.getSex();                   // male
+pet.getName();                  // Oliver
+</pre>
+
+<p>En el código anterior, la variable <code>name</code> de la función externa es accesible para las funciones internas, y no hay otra forma de acceder a las variables internas excepto a través de las funciones internas. Las variables internas de las funciones internas actúan como almacenes seguros para los argumentos y variables externos. Contienen datos "persistentes" y "encapsulados" para que trabajen las funciones internas. Las funciones ni siquiera tienen que estar asignadas a una variable o tener un nombre.</p>
+
+<pre class="brush: js notranslate">var getCode = (function() {
+  var apiCode = '0]Eal(eh&amp;2';    // Un código que no queremos que los externos puedan modificar...
+
+  return function() {
+    return apiCode;
+  };
+})();
+
+getCode();    // Devuelve el apiCode
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Precaución</strong> ¡Hay una serie de trampas a tener en cuenta al usar cierres!</p>
+
+<p>Si una función encerrada define una variable con el mismo nombre que una variable en el ámbito externo, entonces no hay forma de hacer referencia a la variable en el ámbito externo nuevamente. (La variable de ámbito interno "anula" la externa, hasta que el programa sale de el ámbito interno).</p>
+
+<pre class="example-bad brush: js notranslate">var createPet = function(name) {  // La función externa define una variable llamada "name".
+  return {
+    setName: function(name) {    // La función envolvente también define una variable llamada "name".
+      name = name;               // ¿Cómo accedemos al "name" definido por la función externa?
+    }
+  }
+}
+</pre>
+</div>
+
+<h2 id="Usar_el_objeto_arguments">Usar el objeto <code>arguments</code></h2>
+
+<p>El <code>arguments</code> de una función se mantiene en un objeto similar a un arreglo. Dentro de una función, puedes abordar los argumentos que se le pasan de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">arguments[i]
+</pre>
+
+<p>donde <code>i</code> es el número ordinal del argumento, comenzando en <code>0</code>. Entonces, el primer argumento que se pasa a una función sería <code>arguments[0]</code>. El número total de argumentos se indica mediante <code>arguments.length</code>.</p>
+
+<p>Usando el objeto <code>arguments</code>, puedes llamar a una función con más argumentos de los que formalmente declara aceptar. Esto suele ser útil si no sabes de antemano cuántos argumentos se pasarán a la función. Puedes usar <code>arguments.length</code> para determinar el número de argumentos que realmente se pasan a la función, y luego acceder a cada argumento usando el objeto <code>arguments</code>.</p>
+
+<p>Por ejemplo, considera una función que concatena varias cadenas. El único argumento formal para la función es una cadena que especifica los caracteres que separan los elementos a concatenar. La función se define de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">function myConcat(separator) {
+   var result = ''; // inicia list
+   var i;
+   // itera a través de arguments
+   for (i = 1; i &lt; arguments.length; i++) {
+      result += arguments[i] + separator;
+   }
+   return result;
+}
+</pre>
+
+<p>Puedes pasar cualquier número de argumentos a esta función, y concatena cada argumento en una "lista" de cadenas:</p>
+
+<pre class="brush: js notranslate">// devuelve "red, orange, blue, "
+myConcat(', ', 'red', 'orange', 'blue');
+
+// devuelve "elephant; giraffe; lion; cheetah"
+myConcat('; ', 'elephant', 'giraffe', 'lion', 'cheetah');
+
+// devuelve "sage. basil. oregano. pepper. perejil. "
+myConcat('. ', 'salvia', 'albahaca', 'orégano', 'pimienta', 'perejil');
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: La variable <code>arguments</code> es "similar a un arreglo", pero no es un arreglo. Es similar a un arreglo en el sentido de que tiene un índice numerado y una propiedad <code>length</code>. Sin embargo, <em>no</em> posee todos los métodos de manipulación de arreglos.</p>
+</div>
+
+<p>Consulta el objeto {{JSxRef("Function")}} en la referencia de JavaScript para obtener más información.</p>
+
+<h2 id="Parámetros_de_función">Parámetros de función</h2>
+
+<p>A partir de ECMAScript 2015, hay dos nuevos tipos de parámetros: <em>parámetros predeterminados</em> y <em>parámetros resto</em>.</p>
+
+<h3 id="Parámetros_predeterminados">Parámetros predeterminados</h3>
+
+<p>En JavaScript, los parámetros de las funciones están predeterminados en <code>undefined</code>. Sin embargo, en algunas situaciones puede resultar útil establecer un valor predeterminado diferente. Esto es exactamente lo que hacen los parámetros predeterminados.</p>
+
+<h4 id="Sin_parámetros_predeterminados_preECMAScript_2015">Sin parámetros predeterminados (preECMAScript 2015)</h4>
+
+<p>En el pasado, la estrategia general para establecer valores predeterminados era probar los valores de los parámetros en el cuerpo de la función y asignar un valor si eran <code>undefined</code>.</p>
+
+<p>En el siguiente ejemplo, si no se proporciona ningún valor para <code>b</code>, su valor sería <code>undefined</code> al evaluar <code>a * b</code>, y una llamada a <code>multiply</code> normalmente habría devuelto <code>NaN</code>. Sin embargo, esto se evita con la segunda línea de este ejemplo:</p>
+
+<pre class="brush: js notranslate">function multiply(a, b) {
+  b = typeof b !== 'undefined' ?  b : 1;
+
+  return a * b;
+}
+
+multiply(5); // 5
+</pre>
+
+<h4 id="Con_parámetros_predeterminados_posECMAScript_2015">Con parámetros predeterminados (posECMAScript 2015)</h4>
+
+<p>Con <em>parámetros predeterminados</em>, ya no es necesaria una verificación manual en el cuerpo de la función. Simplemente puedes poner <code>1</code> como valor predeterminado para <code>b</code> en el encabezado de la función:</p>
+
+<pre class="brush: js notranslate">function multiply(a, b = 1) {
+  return a * b;
+}
+
+multiply(5); // 5</pre>
+
+<p>Para obtener más detalles, consulta {{JSxRef("Funciones/Parametros_predeterminados", "parámetros predeterminados")}} en la referencia.</p>
+
+<h3 id="Parámetros_rest">Parámetros <code>rest</code></h3>
+
+<p>La sintaxis del {{JSxRef("Funciones/Parametros_rest", "parámetro rest")}} nos permite representar un número indefinido de argumentos como un arreglo.</p>
+
+<p>En el siguiente ejemplo, la función <code>multiply</code> usa <em>parámetros <code>rest</code></em> para recopilar argumentos desde el segundo hasta el final. Luego, la función los multiplica por el primer argumento.</p>
+
+<pre class="brush: js notranslate">function multiply(multiplier, ...theArgs) {
+  return theArgs.map(x =&gt; multiplier * x);
+}
+
+var arr = multiply(2, 1, 2, 3);
+console.log(arr); // [2, 4, 6]</pre>
+
+<h2 id="Funciones_Flecha">Funciones Flecha</h2>
+
+<p>Una {{JSxRef("Funciones/Funciones_flecha", "expresión de función flecha")}} (anteriormente, y ahora conocida incorrectamente como <strong>función de flecha gruesa</strong>) tiene una sintaxis más corta en comparación con las expresiones de función y no tiene su propio {{JSxRef("Operadores/this", "this")}}, {{JSxRef("Funciones/arguments", "arguments")}}, {{JSxRef("Operadores/super", "super")}} o {{JSxRef("../Operadores/new.target", "new.target")}}. Las funciones flecha siempre son anónimas. Consulta también esta publicación del blog hacks.mozilla.org: "<a href="https://hacks.mozilla.org/2015/06/es6-in-depth-arrow-functions/">ES6 en profundidad: funciones flecha</a>".</p>
+
+<p>Dos factores influyeron en la introducción de las funciones flecha: <em>funciones más cortas</em> y <em>no vinculantes</em> de <code>this</code>.</p>
+
+<h3 id="Funciones_más_cortas">Funciones más cortas</h3>
+
+<p>En algunos patrones funcionales, las funciones más cortas son bienvenidas. Compara:</p>
+
+<pre class="brush: js notranslate">var a = [
+  'Hidrógeno',
+  'Helio',
+  'Litio',
+  'Berilio'
+];
+
+var a2 = a.map(function(s) { return s.length; });
+
+console.log(a2); // logs [8, 6, 7, 9]
+
+var a3 = a.map(s =&gt; s.length);
+
+console.log(a3); // logs [8, 6, 7, 9]
+</pre>
+
+<h3 id="Sin_this_separado">Sin <code>this</code> separado</h3>
+
+<p>Hasta las funciones flecha, cada nueva función definía su propio valor {{JSxRef("Operadores/this", "this")}} (un nuevo objeto en el caso de un constructor, indefinido en llamadas a funciones en {{JSxRef("Strict_mode", "modo estricto")}}, el objeto base si la función se llama como un "método de objeto", etc.). Esto resultó ser poco menos que ideal con un estilo de programación orientado a objetos.</p>
+
+<pre class="brush: js notranslate">function Person() {
+  // El constructor Person() define `this` como él mismo.
+  this.age = 0;
+
+  setInterval(function growUp() {
+    // En modo no estricto, la función growUp() define `this`
+    // como el objeto global, que es diferente del `this`
+    // definido por el constructor Person().
+    this.age++;
+  }, 1000);
+}
+
+var p = new Person();</pre>
+
+<p>En ECMAScript 3/5, este problema se solucionó asignando el valor en <code>this</code> a una variable que se podría cerrar.</p>
+
+<pre class="brush: js notranslate">function Person() {
+  var self = this; // Algunos eligen `that` en lugar de` self`.
+                   // Elige uno y se congruente.
+  self.age = 0;
+
+  setInterval(function growUp() {
+    // La retrollamada se refiere a la variable `self` de la cual
+    // el valor es el objeto esperado.
+    self.age++;
+  }, 1000);
+}</pre>
+
+<p>Alternativamente, podrías crear una {{JSxRef("Objetos_globales/Function/bind", "función vinculada")}} para que el valor <code>this</code> adecuado se pasara a la función <code>growUp()</code>.</p>
+
+<p>Una función flecha no tiene su propio <code>this</code> se utiliza el valor de <code>this</code> del contexto de ejecución adjunto. Por lo tanto, en el siguiente código, <code>this</code> dentro de la función que se pasa a <code>setInterval</code> tiene el mismo valor que <code>this</code> en la función adjunta:</p>
+
+<pre class="brush: js notranslate">function Person() {
+  this.age = 0;
+
+  setInterval(() =&gt; {
+    this.age++; // |this| propiamente se refiere al objeto person
+  }, 1000);
+}
+
+var p = new Person();</pre>
+
+<h2 id="Funciones_predefinidas">Funciones predefinidas</h2>
+
+<p>JavaScript tiene integradas varias funciones de nivel superior:</p>
+
+<dl>
+ <dt>{{JSxRef("Objetos_globales/eval", "eval()")}}</dt>
+ <dd>
+ <p>El método <code><strong>eval()</strong></code> evalúa el código JavaScript representado como una cadena.</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/uneval", "uneval()")}}</dt>
+ <dd>
+ <p>El método <code><strong>uneval()</strong></code> crea una representación de cadena del código fuente de un {{JSxRef("Object")}}.</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/isFinite", "isFinite()")}}</dt>
+ <dd>
+ <p>La función global <code><strong>isFinite()</strong></code> determina si el valor pasado es un número finito. Si es necesario, el parámetro, primero se convierte en un número.</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/isNaN", "isNaN()")}}</dt>
+ <dd>
+ <p>La función <code><strong>isNaN()</strong></code> determina si un valor es {{JSxRef("Objetos_globales/NaN", "NaN")}} o no. <strong>Nota</strong>: La coerción dentro de la función <code>isNaN</code> tiene {{JSxRef("Objetos_globales/isNaN", "interesantes", "#Descripcion")}} reglas; también puedes querer usar {{JSxRef("Number.isNaN()")}}, como se define en ECMAScript 2015, o puedes usar {{JSxRef("Operadores/typeof", "typeof")}} para determinar si el valor no es un número (<code>NaN</code>).</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/parseFloat", "parseFloat()")}}</dt>
+ <dd>
+ <p>La función <code><strong>parseFloat()</strong></code> procesa un argumento de cadena y devuelve un número de punto flotante.</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/parseInt", "parseInt()")}}</dt>
+ <dd>
+ <p>La función <code><strong>parseInt()</strong></code> procesa un argumento de cadena y devuelve un número entero de la base especificada (la base en los sistemas numéricos matemáticos).</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/decodeURI", "decodeURI()")}}</dt>
+ <dd>
+ <p>La función <code><strong>decodeURI()</strong></code> decodifica un identificador uniforme de recursos (URI) creado previamente por {{JSxRef("Objetos_globales/encodeURI", "encodeURI")}} o por una rutina similar.</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/decodeURIComponent", "decodeURIComponent()")}}</dt>
+ <dd>
+ <p>El método <code><strong>decodeURIComponent()</strong></code> decodifica un componente Identificador uniforme de recursos (URI) creado previamente por {{JSxRef("Objetos_globales/encodeURIComponent", "encodeURIComponent")}} o por un rutina similar.</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/encodeURI", "encodeURI()")}}</dt>
+ <dd>
+ <p>El método <code><strong>encodeURI()</strong></code> codifica un identificador uniforme de recursos (URI) reemplazando cada instancia de ciertos caracteres por una, dos, tres o cuatro secuencias de escape que representan la codificación UTF-8 del caracter (solo habrá cuatro secuencias de escape para caracteres compuestos por dos caracteres "sustitutos").</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/encodeURIComponent", "encodeURIComponent()")}}</dt>
+ <dd>
+ <p>El método <code><strong>encodeURIComponent()</strong></code> codifica un componente Identificador uniforme de recursos (URI) reemplazando cada instancia de ciertos caracteres por una, dos, tres o cuatro secuencias de escape que representan la codificación UTF-8 del caracter (solo habrá cuatro secuencias de escape para caracteres compuestos por dos caracteres "sustitutos").</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/escape", "escape()")}}</dt>
+ <dd>
+ <p>El método obsoleto <code><strong>escape()</strong></code> calcula una nueva cadena en la que ciertos caracteres han sido reemplazados por una secuencia de escape hexadecimal. En su lugar usa {{JSxRef("Objetos_globales/encodeURI", "encodeURI")}} o {{JSxRef("Objetos_globales/encodeURIComponent", "encodeURIComponent")}}.</p>
+ </dd>
+ <dt>{{JSxRef("Objetos_globales/unescape", "unescape()")}}</dt>
+ <dd>
+ <p>El método obsoleto <code><strong>unescape()</strong></code> calcula una nueva cadena en la que las secuencias de escape hexadecimales se reemplazan con el caracter que representan. Las secuencias de escape se pueden introducir por medio de una función como {{JSxRef("Objetos_globales/escape", "escape")}}. Debido a que <code>unescape()</code> está en desuso, usa {{JSxRef("Objetos_globales/decodeURI", "decodeURI()")}} o {{JSxRef("Objetos_globales/decodeURIComponent", "decodeURIComponent")}} en su lugar.</p>
+ </dd>
+</dl>
+
+<p>{{PreviousNext("Web/JavaScript/Guide/Loops_and_iteration", "Web/JavaScript/Guide/Expressions_and_Operators")}}</p>
diff --git a/files/es/web/javascript/guide/indexed_collections/index.html b/files/es/web/javascript/guide/indexed_collections/index.html
new file mode 100644
index 0000000000..5a9129d406
--- /dev/null
+++ b/files/es/web/javascript/guide/indexed_collections/index.html
@@ -0,0 +1,604 @@
+---
+title: Colecciones indexadas
+slug: Web/JavaScript/Guide/Indexed_collections
+tags:
+  - Array
+  - Arreglo
+  - Guía
+  - JavaScript
+  - l10n:priority
+translation_of: Web/JavaScript/Guide/Indexed_collections
+original_slug: Web/JavaScript/Guide/colecciones_indexadas
+---
+<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}</div>
+
+<p class="summary">Este capítulo presenta colecciones de datos ordenados por un valor de índice. Esto incluye arreglos y construcciones similares a arreglos tal como objetos {{jsxref("Array")}} y objetos {{jsxref("TypedArray")}}.</p>
+
+<h2 id="El_objeto_Array">El objeto <code>Array</code></h2>
+
+<p>Un <em><dfn>array</dfn></em> es una lista ordenada de valores a los que te refieres con un nombre y un índice.</p>
+
+<p>Por ejemplo, considera un arreglo llamado <code>emp</code>, que contiene los nombres de los empleados indexados por su id de empleado numérico. De tal modo que <code>emp[0]</code> sería el empleado número cero, <code>emp[1]</code> el empleado número uno, y así sucesivamente.</p>
+
+<p>JavaScript no tiene un tipo de dato <code>array</code> explícito. Sin embargo, puedes utilizar el objeto <code>Array</code> predefinido y sus métodos para trabajar con arreglos en tus aplicaciones. El objeto <code>Array</code> tiene métodos para manipular arreglos de varias formas, tal como unirlos, invertirlos y ordenarlos. Tiene una propiedad para determinar la longitud del arreglo y otras propiedades para usar con expresiones regulares.</p>
+
+<h3 id="Crear_un_arreglo">Crear un arreglo</h3>
+
+<p>Las siguientes declaraciones crean arreglos equivalentes:</p>
+
+<pre class="brush: js notranslate">let arr = new Array(<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>)
+let arr = Array(<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>)
+let arr = [<var>element0</var>, <var>element1</var>, ..., <var>elementN</var>]
+</pre>
+
+<p><code><var>element0</var>, <var>element1</var>, ..., <var>elementN</var></code> es una lista de valores para los elementos del arreglo. Cuando se especifican estos valores, el arreglo se inicia con ellos como elementos del arreglo. La propiedad <code>length</code> del arreglo se establece en el número de argumentos.</p>
+
+<p>La sintaxis de corchetes se denomina "arreglo literal" o "iniciador de arreglo". Es más corto que otras formas de creación de arreglos, por lo que generalmente se prefiere. Consulta <a href="/es/docs/Web/JavaScript/Guide/Grammar_and_types#Arreglos_literales">Arreglos literales</a> para obtener más detalles.</p>
+
+<p>Para crear un arreglo con una longitud distinta de cero, pero sin ningún elemento, se puede utilizar cualquiera de las siguientes:</p>
+
+<pre class="brush: js notranslate">// Esta...
+let arr = new Array(<var>arrayLength</var>)
+
+// ...da como resultado el mismo arreglo que este
+let arr = Array(<var>arrayLength</var>)
+
+
+// Esto tiene exactamente el mismo efecto
+let arr = []
+arr.length = <var>arrayLength</var>
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: En el código anterior, <code><var>arrayLength</var></code> debe ser un <code>Número</code>. De lo contrario, se creará un arreglo con un solo elemento (el valor proporcionado). Llamar a <code>arr.length</code> devolverá <code><var>arrayLength</var></code>, pero el arreglo no contiene ningún elemento. Un bucle {{jsxref("Statements/for...in", "for...in")}} no encontrarás ninguna propiedad en el arreglo.</p>
+</div>
+
+<p>Además de una variable recién definida como se muestra arriba, los arreglos también se pueden asignar como una propiedad a un objeto nuevo o existente:</p>
+
+<pre class="brush: js notranslate">let obj = {}
+// ...
+obj.prop = [element0, element1, ..., elementN]
+
+// O
+let obj = {prop: [element0, element1, ...., elementN]}
+</pre>
+
+<p>Si deseas iniciar un arreglo con un solo elemento, y el elemento resulta ser un <code>Número</code>, debes usar la sintaxis de corchetes. Cuando se pasa un solo valor <code>Number</code> al constructor o función <code>Array()</code>, se interpreta como un <code>arrayLength</code>, no como un solo elemento.</p>
+
+<pre class="brush: js notranslate">let arr = [42]       // Crea un arreglo con un solo elemento:
+                     // el número 42.
+
+let arr = Array(42)  // Crea un arreglo sin elementos
+                     // y arr.length establecidos en 42.
+                     //
+                     // Esto es equivalente a:
+let arr = []
+arr.length = 42
+</pre>
+
+<p>Llamar a <code>Array(<var>N</var>)</code> da como resultado un <code>RangeError</code>, si <code><var>N</var></code> no es un número entero cuya porción fraccionaria no es cero. El siguiente ejemplo ilustra este comportamiento.</p>
+
+<pre class="brush: js notranslate">let arr = Array(9.3)   // RangeError: Longitud de arreglo no válida
+</pre>
+
+<p>Si tu código necesita crear arreglos con elementos únicos de un tipo de dato arbitrario, es más seguro utilizar arreglos literales. Alternativamente, crea un arreglo vacío primero antes de agregarle el único elemento.</p>
+
+<p>En ES2015, puedes utilizar el método estático {{jsxref("Array.of")}} para crear arreglos con un solo elemento.</p>
+
+<pre class="brush: js notranslate">let wisenArray = Array.of(9.3)   // wisenArray contiene solo un elemento 9.3</pre>
+
+<h3 id="Refiriéndose_a_elementos_del_arreglo">Refiriéndose a elementos del arreglo</h3>
+
+<p>Dado que los elementos también son propiedades, puedes acceder a ellos usando la <a href="/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors">propiedad <code>accessors</code></a>. Supongamos que defines el siguiente arreglo:</p>
+
+<pre class="brush: js notranslate">let myArray = ['Wind', 'Rain', 'Fire']
+</pre>
+
+<p>Puedes referirte al primer elemento del arreglo como <code>myArray[0]</code>, al segundo elemento del arreglo como <code>myArray[1]</code>, etc<span class="st">…</span> El índice de los elementos comienza en cero.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: También puedes utilizar la <a href="/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors">propiedad <code>accessors</code></a> para acceder a otras propiedades del arreglo, como con un objeto.</p>
+
+<pre class="brush: js notranslate">let arr = ['one', 'two', 'three']
+arr[2]          // three
+arr['length']   // 3
+</pre>
+</div>
+
+<h3 id="Llenar_un_arreglo">Llenar un arreglo</h3>
+
+<p>Puedes llenar un arreglo asignando valores a sus elementos. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">let emp = []
+emp[0] = 'Casey Jones'
+emp[1] = 'Phil Lesh'
+emp[2] = 'August West'
+</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Si proporcionas un valor no entero al operador <code>array</code> en el código anterior, se creará una propiedad en el objeto que representa al arreglo, en lugar de un elemento del arreglo.</p>
+
+<pre class="brush: js notranslate">let arr = []
+arr[3.4] = 'Oranges'
+console.log(arr.length)                 // 0
+console.log(arr.hasOwnProperty(3.4))    // true
+</pre>
+</div>
+
+<p>También puedes rellenar un arreglo cuando lo creas:</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('Hello', myVar, 3.14159)
+// OR
+let myArray = ['Mango', 'Apple', 'Orange']
+</pre>
+
+<h3 id="Entendiendo_length">Entendiendo <code>length</code></h3>
+
+<p>A nivel de implementación, los arreglos de JavaScript almacenan sus elementos como propiedades de objeto estándar, utilizando el índice del arreglo como nombre de propiedad.</p>
+
+<p>La propiedad <code>length</code> es especial. Siempre devuelve el índice del último elemento más uno. (En el siguiente ejemplo, <code>'Dusty'</code> está indexado en <code>30</code>, por lo que <code>cats.length</code> devuelve <code>30 + 1</code>).</p>
+
+<p>Recuerda, los índices del Array JavaScript están basados en 0: comienzan en <code>0</code>, no en <code>1</code>. Esto significa que la propiedad <code>length</code> será uno más que el índice más alto almacenado en el arreglo:</p>
+
+<pre class="brush: js notranslate">let cats = []
+cats[30] = ['Dusty']
+console.log(cats.length) // 31
+</pre>
+
+<p>También puedes asignar la propiedad <code>length</code>.</p>
+
+<p>Escribir un valor que sea más corto que el número de elementos almacenados trunca el arreglo. Escribir <code>0</code> lo vacía por completo:</p>
+
+<pre class="brush: js notranslate">let cats = ['Dusty', 'Misty', 'Twiggy']
+console.log(cats.length)  // 3
+
+cats.length = 2
+console.log(cats)  // logs "Dusty, Misty" - Twiggy se ha eliminado
+
+cats.length = 0
+console.log(cats)  // logs []; el arreglo cats está vacío
+
+cats.length = 3
+console.log(cats)  // logs [ &lt;3 elementos vacíos&gt; ]
+</pre>
+
+<h3 id="Iterando_sobre_arreglos">Iterando sobre arreglos</h3>
+
+<p>Una operación común es iterar sobre los valores de un arreglo, procesando cada uno de alguna manera. La forma más sencilla de hacerlo es la siguiente:</p>
+
+<pre class="brush: js notranslate">let colors = ['red', 'green', 'blue']
+for (let i = 0; i &lt; colors.length; i++) {
+  console.log(colors[i])
+}
+</pre>
+
+<p>Si sabes que ninguno de los elementos de tu arreglo se evalúa como <code>false</code> en un contexto booleano, si tu arreglo consta solo de nodos <a href="/es/docs/DOM" title="/es/docs/DOM">DOM</a>, por ejemplo, puedes usar un lenguaje eficiente:</p>
+
+<pre class="brush: js notranslate">let divs = document.getElementsByTagName('div')
+for (let i = 0, div; div = divs[i]; i++) {
+  /* Procesar div de alguna manera */
+}
+</pre>
+
+<p>Esto evita la sobrecarga de verificar la longitud del arreglo y garantiza que la variable <code><var>div</var></code> se reasigne al elemento actual cada vez que se realiza el bucle para mayor comodidad.</p>
+
+<p>El método {{jsxref("Array.forEach", "forEach()")}} proporciona otra forma de iterar sobre un arreglo:</p>
+
+<pre class="brush: js notranslate">let colors = ['red', 'green', 'blue']
+colors.forEach(function(color) {
+  console.log(color)
+})
+// red
+// green
+// blue
+</pre>
+
+<p>Alternativamente, puedes acortar el código para el parámetro <code>forEach</code> con las funciones de flecha ES2015:</p>
+
+<pre class="brush: js notranslate">let colors = ['red', 'green', 'blue']
+colors.forEach(color =&gt; console.log(color))
+// red
+// green
+// blue
+</pre>
+
+<p>La función pasada a <code>forEach</code> se ejecuta una vez por cada elemento del arreglo, con el elemento de arreglo pasado como argumento de la función. Los valores no asignados no se iteran en un bucle <code>forEach</code>.</p>
+
+<p>Ten en cuenta que los elementos de un arreglo que se omiten cuando se define el arreglo no se enumeran cuando lo itera <code>forEach</code>, pero <em>se enumeran</em> cuando <code>undefined</code> se ha asignado manualmente al elemento:</p>
+
+<pre class="brush: js notranslate">let array = ['first', 'second', , 'fourth']
+
+array.forEach(function(element) {
+  console.log(element)
+})
+// first
+// second
+// fourth
+
+if (array[2] === undefined) {
+  console.log('array[2] is undefined')  // true
+}
+
+array = ['first', 'second', undefined, 'fourth']
+
+array.forEach(function(element) {
+  console.log(element)
+})
+// first
+// second
+// undefined
+// fourth
+</pre>
+
+<p>Dado que los elementos de JavaScript se guardan como propiedades de objeto estándar, no es recomendable iterar a través de arreglos de JavaScript usando bucles {{jsxref("Statements/for...in", "for...in")}}, porque se enumerarán los elementos normales y todas las propiedades enumerables.</p>
+
+<h3 id="Métodos_de_array">Métodos de array</h3>
+
+<p>El objeto {{jsxref("Array")}} tiene los siguientes métodos:</p>
+
+<p>{{jsxref("Array.concat", "concat()")}} une dos o más arreglos y devuelve un nuevo arreglo.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('1', '2', '3')
+myArray = myArray.concat('a', 'b', 'c')
+// myArray is now ["1", "2", "3", "a", "b", "c"]
+</pre>
+
+<p>{{jsxref("Array.join", "join(delimiter = ',')")}} une todos los elementos de un arreglo en una cadena.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('Viento', 'Lluvia', 'Fuego')
+let list = myArray.join('-')   // la lista es "Viento - Lluvia - Fuego"
+</pre>
+
+<p>{{jsxref("Array.push", "push()")}} agrega uno o más elementos al final de un arreglo y devuelve la <code>longitud</code> resultante del arreglo.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('1', '2')
+myArray.push('3') // myArray ahora es ["1", "2", "3"]
+</pre>
+
+<p>{{jsxref("Array.pop", "pop()")}} elimina el último elemento de un arreglo y devuelve ese elemento.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array ('1', '2', '3')
+let last = myArray.pop()
+// myArray ahora es ["1", "2"], last = "3"
+</pre>
+
+<p>{{jsxref("Array.shift", "shift()")}} elimina el primer elemento de un arreglo y devuelve ese elemento.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array ('1', '2', '3')
+let first = myArray.shift()
+// myArray ahora es ["2", "3"], first es "1"
+</pre>
+
+<p>{{jsxref("Array.unshift", "unshift()")}} agrega uno o más elementos al frente de un arreglo y devuelve la nueva longitud del arreglo.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('1', '2', '3')
+myArray.unshift('4', '5')
+// myArray se convierte en ["4", "5", "1", "2", "3"]
+</pre>
+
+<p>{{jsxref("Array.slice", "slice(start_index, upto_index)")}} extrae una sección de un arreglo y devuelve un nuevo arreglo.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('a', 'b', 'c', 'd', 'e')
+myArray = myArray.slice(1, 4) // comienza en el índice 1 y extrae todos los elementos
+                               // hasta el índice 3, devuelve ["b", "c", "d"]
+</pre>
+
+<p>{{jsxref("Array.splice", "splice(index, count_to_remove, addElement1, addElement2, ...)")}} elimina elementos de un arreglo y (opcionalmente) los reemplaza. Devuelve los elementos que se eliminaron del arreglo.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('1', '2', '3', '4', '5')
+myArray.splice(1, 3, 'a', 'b', 'c', 'd')
+// myArray ahora es ["1", "a", "b", "c", "d", "5"]
+// Este código comenzó en el índice uno (o donde estaba el "2"),
+// eliminó 3 elementos allí, y luego insertó todos los consecutivos
+// elementos en su lugar.
+</pre>
+
+<p>{{jsxref("Array.reverse", "reverse()")}} transpone los elementos de un arreglo, en su lugar: el primer elemento del arreglo se convierte en el último y el último en el primero. Devuelve una referencia al arreglo.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array ('1', '2', '3')
+myArray.reverse()
+// transpone el arreglo para que myArray = ["3", "2", "1"]
+</pre>
+
+<p>{{jsxref("Array.sort", "sort()")}} ordena los elementos de un arreglo en su lugar y devuelve una referencia al arreglo.</p>
+
+<pre class="brush: js notranslate">let myArray = new Array('Viento', 'Lluvia', 'Fuego')
+myArray.sort()
+// ordena el arreglo para que myArray = ["Fuego", "Lluvia", "Viento"]
+</pre>
+
+<p><code>sort()</code> también puede tomar una función retrollamada para determinar cómo se comparan los elementos del arreglo.</p>
+
+<p>El método <code>sort</code> (y otros a continuación) que reciben una retrollamada se conocen como <em>métodos iterativos</em>, porque iteran sobre todo el arreglo de alguna manera. Cada uno toma un segundo argumento opcional llamado <code><var>thisObject</var></code>. Si se proporciona, <code><var>thisObject</var></code> se convierte en el valor de la palabra clave <code>this</code> dentro del cuerpo de la función retrollamada. Si no se proporciona, como en otros casos en los que se invoca una función fuera de un contexto de objeto explícito, <code>this</code> se referirá al objeto global (<a href="/es/docs/Web/API/Window" title="La interfaz &lt;code>Window&lt;/code> representa una ventana que contiene un documento DOM; la propiedad &lt;code>document&lt;/code> apunta al documento DOM cargado en esa ventana."><code>window</code></a>) cuando se usa la función de flecha como retrollamada, o <code>undefined</code> cuando se usa una función normal como retrollamada.</p>
+
+<p>La función retrollamada se invoca con dos argumentos, que son elementos del arreglo.</p>
+
+<p>La siguiente función compara dos valores y devuelve uno de tres valores:</p>
+
+<p>Por ejemplo, lo siguiente se ordenará por la última letra de una cadena:</p>
+
+<pre class="brush: js notranslate">let sortFn = function(a, b) {
+  if (a[a.length - 1] &lt; b[b.length - 1]) return -1;
+  if (a[a.length - 1] &gt; b[b.length - 1]) return 1;
+  if (a[a.length - 1] == b[b.length - 1]) return 0;
+}
+myArray.sort(sortFn)
+// ordena el arreglo para que myArray = ["Viento", "Fuego", "Lluvia"]</pre>
+
+<ul>
+ <li>si <code><var>a</var></code> es menor que <code><var>b</var></code> por el sistema de clasificación, devuelve <code>-1</code> ( o cualquier número negativo)</li>
+ <li>si <code><var>a</var></code> es mayor que <code><var>b</var></code> por el sistema de clasificación, devuelve <code>1</code> (o cualquier número positivo)</li>
+ <li>si <code><var>a</var></code> y <code><var>b</var></code> se consideran equivalentes, devuelve <code>0</code>.</li>
+</ul>
+
+<p>{{jsxref("Array.indexOf", "indexOf (searchElement[, fromIndex])")}} busca en el arreglo <code><var>searchElement</var></code> y devuelve el índice de la primera coincidencia.</p>
+
+<pre class="brush: js notranslate">let a = ['a', 'b', 'a', 'b', 'a']
+console.log(a.indexOf('b')) // registros 1
+
+// Ahora inténtalo de nuevo, comenzando después de la última coincidencia
+console.log(a.indexOf('b', 2)) // registra 3
+console.log(a.indexOf('z')) // logs -1, porque no se encontró 'z'
+</pre>
+
+<p>{{jsxref("Array.lastIndexOf", "lastIndexOf(searchElement [, fromIndex])")}} funciona como <code>indexOf</code>, pero comienza al final y busca hacia atrás.</p>
+
+<pre class="brush: js notranslate">let​a = ['a', 'b', 'c', 'd', 'a', 'b']
+console.log(a.lastIndexOf('b')) // registra 5
+
+// Ahora inténtalo de nuevo, comenzando desde antes de la última coincidencia
+console.log(a.lastIndexOf('b', 4)) // registra 1
+console.log(a.lastIndexOf('z'))    // registra -1
+</pre>
+
+<p>{{jsxref("Array.forEach", "forEach(callback[, thisObject])")}} ejecuta <code><var>callback</var></code> en cada elemento del arreglo y devuelve <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">let​a = ['a', 'b', 'c']
+a.forEach(function(elemento) { console.log(elemento) })
+// registra cada elemento por turno
+</pre>
+
+<p>{{jsxref("Array.map", "map(callback [, thisObject])")}} devuelve un nuevo arreglo del valor de retorno de ejecutar <code><var>callback</var></code> en cada elemento del arreglo.</p>
+
+<pre class="brush: js notranslate">let a1 = ['a', 'b', 'c']
+let a2 = a1.map(function(item) { return item.toUpperCase() })
+console.log(a2) // registra ['A', 'B', 'C']
+</pre>
+
+<p>{{jsxref("Array.filter", "filter(callback [, thisObject])")}} devuelve un nuevo arreglo que contiene los elementos para los cuales <code><var>callback</var></code> devolvió <code>true</code>.</p>
+
+<pre class="brush: js notranslate">let a1 = ['a', 10, 'b', 20, 'c', 30]
+let a2 = a1.filter(function(item) { return typeof item === 'number'; })
+console.log(a2)  // registra [10, 20, 30]
+</pre>
+
+<p>{{jsxref("Array.every", "every(callback [, thisObject])")}} devuelve <code>true</code> si <code><var>callback</var></code> devuelve <code>true</code> para cada elemento del arreglo.</p>
+
+<pre class="brush: js notranslate">function isNumber(value) {
+  return typeof value === 'number'
+}
+let a1 = [1, 2, 3]
+console.log(a1.every(isNumber))  // registra true
+let a2 = [1, '2', 3]
+console.log(a2.every(isNumber))  // registra false
+</pre>
+
+<p>{{jsxref("Array.some", "some(callback[, thisObject])")}} devuelve <code>true</code> si <code><var>callback</var></code> devuelve <code>true</code> para al menos un elemento del arreglo.</p>
+
+<pre class="brush: js notranslate">function isNumber(value) {
+  return typeof value === 'number'
+}
+let a1 = [1, 2, 3]
+console.log(a1.some(isNumber))  // registra true
+let a2 = [1, '2', 3]
+console.log(a2.some(isNumber))  // registra true
+let a3 = ['1', '2', '3']
+console.log(a3.some(isNumber))  // registra false
+</pre>
+
+<p>{{jsxref("Array.reduce", "reduce(callback[, initialValue])")}} aplica <code><var>callback</var>(<var>acumulador</var>, <var>currentValue</var>[, <var>currentIndex</var>[,<var>array</var>]])</code> para cada valor en el arreglo con el fin de reducir la lista de elementos a un solo valor. La función <code>reduce</code> devuelve el valor final devuelto por la función <code><var>callback</var></code>. </p>
+
+<p>Si se especifica <code><var>initialValue</var></code>, entonces <code><var>callback</var></code> se llama con <code><var>initialValue</var></code> como primer valor de parámetro y el valor del primer elemento del arreglo como segundo valor de parámetro. </p>
+
+<p>Si <code><var>initialValue</var></code> <em>no</em> es especificado, entonces <code><var>callback</var></code> los primeros dos valores de parámetro deberán ser el primer y segundo elemento del arreglo. En <em>cada</em> llamada subsiguiente, el valor del primer parámetro será el valor de <code><var>callback</var></code> devuelto en la llamada anterior, y el valor del segundo parámetro será el siguiente valor en el arreglo.</p>
+
+<p>Si <code><var>callback</var></code> necesita acceso al índice del elemento que se está procesando, al acceder al arreglo completo, están disponibles como parámetros opcionales.</p>
+
+<pre class="brush: js notranslate">let​a = [10, 20, 30]
+let total = a.reduce(function(accumulator, currentValue) { return accumulator + currentValue }, 0)
+console.log(total) // Imprime 60
+</pre>
+
+<p>{{jsxref("Array.reduceRight", "reduceRight(callback[, initialValue])")}} funciona como <code>reduce()</code>, pero comienza con el último elemento.</p>
+
+<p><code>reduce</code> y <code>reduceRight</code> son los menos obvios de los métodos de arreglo iterativos. Se deben utilizar para algoritmos que combinan dos valores de forma recursiva para reducir una secuencia a un solo valor.</p>
+
+<h3 id="Arreglos_multidimensionales">Arreglos multidimensionales</h3>
+
+<p>Los arreglos se pueden anidar, lo cual significa que un arreglo puede contener otro arreglo como elemento. Usando esta característica de los arreglos de JavaScript, se pueden crear arreglos multidimensionales.</p>
+
+<p>El siguiente código crea un arreglo bidimensional.</p>
+
+<pre class="brush: js notranslate">let a = new Array(4)
+for (let i = 0; i &lt; 4; i++) {
+  a[i] = new Array(4)
+  for (let j = 0; j &lt; 4; j++) {
+    a[i][j] = '[' + i + ', ' + j + ']'
+  }
+}
+</pre>
+
+<p>Este ejemplo crea un arreglo con las siguientes filas:</p>
+
+<pre class="notranslate">Row 0: [0, 0] [0, 1] [0, 2] [0, 3]
+Row 1: [1, 0] [1, 1] [1, 2] [1, 3]
+Row 2: [2, 0] [2, 1] [2, 2] [2, 3]
+Row 3: [3, 0] [3, 1] [3, 2] [3, 3]
+</pre>
+
+<h3 id="Usar_arreglos_para_almacenar_otras_propiedades">Usar arreglos para almacenar otras propiedades</h3>
+
+<p>Los arreglos también se pueden utilizar como objetos para almacenar información relacionada.</p>
+
+<pre class="brush: js notranslate"><code>const arr = [1, 2, 3];
+arr.property = "value";
+console.log(arr.property);  // Registra "value"</code>
+</pre>
+
+<h3 id="Arreglos_y_expresiones_regulares">Arreglos y expresiones regulares</h3>
+
+<p>Cuando un arreglo es el resultado de una coincidencia entre una expresión regular y una cadena, el arreglo devuelve propiedades y elementos que proporcionan información sobre la coincidencia. Un arreglo es el valor de retorno de {{jsxref("Global_Objects/RegExp/exec", "RegExp.exec()")}}, {{jsxref("Global_Objects/String/match", "String.match()")}} y {{jsxref("Global_Objects/String/split", "String.split()")}}. Para obtener información sobre el uso de arreglos con expresiones regulares, consulta <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">Expresiones regulares</a>.</p>
+
+<h3 id="Trabajar_con_objetos_tipo_array">Trabajar con objetos tipo array</h3>
+
+<p>Algunos objetos JavaScript, como <a href="/es/docs/Web/API/NodeList" title="Los objetos &lt;code>NodeList&lt;/code> son colecciones de nodos, generalmente devueltos por propiedades como ↑Node.childNodes↓ y métodos como ↑document.querySelectorAll()↓."><code>NodeList</code></a> devueltos por <a href="/es/docs/Web/API/Document/getElementsByTagName" title="devuelve una &lt;code>HTMLCollection&lt;/code> de elementos con el nombre de etiqueta dado."><code>document.getElementsByTagName()</code></a> o un objeto {{jsxref("Functions/arguments", "arguments")}} disponible dentro del cuerpo de una función, se ven y se comportan como arreglos en la superficie pero no comparten todos sus métodos. El objeto <code>arguments</code> proporciona un atributo {{jsxref("Global_Objects/Function/length", "length")}} pero no implementa el método {{jsxref("Array.forEach", "forEach()")}}, por ejemplo.</p>
+
+<p>Los métodos de arreglo no se pueden llamar directamente en objetos similares a un arreglo.</p>
+
+<pre class="brush: js example-bad notranslate"><code>function printArguments() {
+  arguments.forEach(function(item) {// <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox-stackTrace reps-custom-format">TypeError: <span class="objectBox objectBox-string">arguments.forEach no es una función</span></span></span></span></span>
+    console.log(item);
+  });
+}</code>
+</pre>
+
+<p>Pero puedes llamarlos indirectamente usando {{jsxref("Global_Objects/Function/call", "Function.prototype.call()")}}.</p>
+
+<pre class="brush: js example-good notranslate"><code>function printArguments() {
+  Array.prototype.forEach.call(arguments, function(item) {
+    console.log(item);
+  });
+}</code>
+</pre>
+
+<p>Los métodos de prototipos de arreglos también se pueden utilizar en cadenas, ya que proporcionan acceso secuencial a sus caracteres de forma similar a los arreglos:</p>
+
+<pre class="brush: js notranslate">Array.prototype.forEach.call('a string', function(chr) {
+  console.log(chr)
+})
+</pre>
+
+<h2 id="Arrays_tipados">Arrays tipados</h2>
+
+<p><a href="/es/docs/Web/JavaScript/Typed_arrays">Los arreglos tipados en JavaScript</a> son objetos similares a arreglos y proporcionan un mecanismo para acceder a datos binarios sin procesar. Como ya sabes, los objetos {{jsxref("Array")}} crecen y se encogen dinámicamente y pueden tener cualquier valor de JavaScript. Los motores de JavaScript realizan optimizaciones para que estos arreglos sean rápidos. Sin embargo, a medida que las aplicaciones web se vuelven cada vez más poderosas, agregando características como manipulación de audio y video, acceso a datos sin procesar usando <a href="/es/docs/WebSockets">WebSockets</a>, y así sucesivamente, ha quedado claro que hay momentos en los que sería útil para que el código JavaScript pueda manipular rápida y fácilmente datos binarios sin procesar en arreglos tipados.</p>
+
+<h3 id="Búferes_y_vistas_arquitectura_de_los_arreglos_con_tipo">Búferes y vistas: arquitectura de los arreglos con tipo</h3>
+
+<p>Para lograr la máxima flexibilidad y eficiencia, los arreglos de JavaScript dividen la implementación en <strong>búferes</strong> y <strong>vistas</strong>. Un búfer (implementado por el objeto {{jsxref("ArrayBuffer")}} es un objeto que representa una porción de datos; no tiene un formato del que hablar y no ofrece ningún mecanismo para acceder a su contenido. Para acceder a la memoria contenida en un búfer, necesitas usar una vista. Una vista proporciona un <strong>contexto </strong>, es decir, un tipo de datos, un desplazamiento inicial y un número de elementos, que convierte los datos en un arreglo con tipo real.</p>
+
+<p><img alt="Arreglos tipados en un &lt;code>ArrayBuffer&lt;/code>" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p>
+
+<h3 id="ArrayBuffer"><code>ArrayBuffer</code></h3>
+
+<p>{{jsxref("ArrayBuffer")}} es un tipo de dato que se utiliza para representar un búfer de datos binarios genérico de longitud fija. No puedes manipular directamente el contenido de un <code>ArrayBuffer</code>; en su lugar, creas una vista de arreglo con tipo o un {{jsxref("DataView")}} que representa el búfer en un formato específico, y lo usa para leer y escribir el contenido del búfer.</p>
+
+<h3 id="Vistas_de_arreglos_tipados">Vistas de arreglos tipados</h3>
+
+<p>Las vistas de arreglos tipados tienen nombres autodescriptivos y proporcionan vistas para todos los tipos numéricos habituales como <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> y así sucesivamente. Hay una vista de arreglo con tipo especial, {jsxref("Uint8ClampedArray")}}, que fija los valores entre <code>0</code> y <code>255</code>. Esto es útil para <a href="/es/docs/Web/API/ImageData">procesamiento de datos de Canvas</a>, por ejemplo.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th class="header" scope="col">Tipo</th>
+   <th class="header" scope="col">Rango de valores</th>
+   <th class="header" scope="col">Tamaño en bytes</th>
+   <th class="header" scope="col">Descripción</th>
+   <th class="header" scope="col">Tipo de IDL web</th>
+   <th class="header" scope="col">Tipo C equivalente</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{jsxref("Int8Array")}}</td>
+   <td><code>-128</code> a <code>127</code></td>
+   <td>1</td>
+   <td>Dos enteros complementarios de 8 bits con signo</td>
+   <td><code>byte</code></td>
+   <td><code>int8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint8Array")}}</td>
+   <td><code>0</code> a <code>255</code></td>
+   <td>1</td>
+   <td>Entero de 8-bit sin signo</td>
+   <td><code>octeto</code></td>
+   <td><code>uint8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint8ClampedArray")}}</td>
+   <td><code>0</code> a <code>255</code></td>
+   <td>1</td>
+   <td>Entero de 8 bits sin signo (sujeto)</td>
+   <td><code>octeto</code></td>
+   <td><code>uint8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Int16Array")}}</td>
+   <td><code>-32768</code> a <code>32767</code></td>
+   <td>2</td>
+   <td>Dos enteros complementarios de 16 bits con signo</td>
+   <td><code>short</code></td>
+   <td><code>int16_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint16Array")}}</td>
+   <td><code>0</code> a <code>65535</code></td>
+   <td>2</td>
+   <td>Entero de 16 bits sin signo</td>
+   <td><code>short sin signo</code></td>
+   <td><code>uint16_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Int32Array")}}</td>
+   <td><code>-2147483648</code> a <code>2147483647</code></td>
+   <td>4</td>
+   <td>dos enteros complementarios de 32 bits con signo</td>
+   <td><code>long</code></td>
+   <td><code>int32_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint32Array")}}</td>
+   <td><code>0</code> a <code>4294967295</code></td>
+   <td>4</td>
+   <td>Enteros de 32 bits sin signo</td>
+   <td><code>long sin signo</code></td>
+   <td><code>uint32_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Float32Array")}}</td>
+   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>38</sup></code></td>
+   <td>4</td>
+   <td>Número de coma flotante IEEE de 32 bits (7 dígitos significativos, p. ej., <code>1.1234567</code>)</td>
+   <td><code>float sin restricciones</code></td>
+   <td><code>float</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Float64Array")}}</td>
+   <td><code>5.0</code><span>×</span><code>10<sup>-324</sup></code> a <code>1.8</code><span>×</span><code>10<sup>308</sup></code></td>
+   <td>8</td>
+   <td>Número de coma flotante IEEE de 64 bits (16 dígitos significativos, por ejemplo,<code>1.123 ... 15</code>)</td>
+   <td><code>double sin restricciones</code></td>
+   <td><code>double</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("BigInt64Array")}}</td>
+   <td><code>-2<sup>63</sup></code> a <code>2<sup>63</sup>-1</code></td>
+   <td>8</td>
+   <td>Dos enteros complementarios de 64 bits con signo</td>
+   <td><code>bigint</code></td>
+   <td><code>int64_t (long long con signo)</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("BigUint64Array")}}</td>
+   <td><code>0</code> a <code>2<sup>64</sup>-1</code></td>
+   <td>8</td>
+   <td>Entero de 64 bits sin signo</td>
+   <td><code>bigint</code></td>
+   <td><code>uint64_t (long long sin signo)</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Para obtener más información, consulta <a href="/es/docs/Web/JavaScript/Typed_arrays">Arreglos tipados en JavaScript</a> y la documentación de referencia para los diferentes objetos {{jsxref("TypedArray")}}.</p>
+
+<p>{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Keyed_Collections")}}</p>
diff --git a/files/es/web/javascript/guide/introducción/index.html b/files/es/web/javascript/guide/introducción/index.html
deleted file mode 100644
index 6200c2c7d6..0000000000
--- a/files/es/web/javascript/guide/introducción/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Introducción
-slug: Web/JavaScript/Guide/Introducción
-tags:
-  - Guía
-  - Introducion
-  - JavaScript
-  - Novato
-  - Principiante
-  - 'l10n:priority'
-translation_of: Web/JavaScript/Guide/Introduction
----
-<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammar_and_types")}}</div>
-
-<p class="summary">Este capítulo presenta JavaScript y analiza algunos de sus conceptos fundamentales.</p>
-
-<h2 id="¿Qué_debes_conocer_previamente">¿Qué debes conocer previamente?</h2>
-
-<p>Esta guía presume que tienes los siguientes antecedentes básicos:</p>
-
-<ul>
- <li>Comprensión general de Internet y la ({{Glossary("WWW", "World Wide Web")}}).</li>
- <li>Buen conocimiento práctico del {{Glossary("HTML", "lenguaje de marcado de hipertexto (HTML)")}}.</li>
- <li>Alguna experiencia en programación. Si eres nuevo en la programación, prueba uno de los tutoriales vinculados en la página principal sobre {{JSxRef("../../JavaScript", "JavaScript")}}.</li>
-</ul>
-
-<h2 id="Dónde_encontrar_información_sobre_JavaScript">Dónde encontrar información sobre JavaScript</h2>
-
-<p>La documentación de JavaScript en MDN incluye lo siguiente:</p>
-
-<ul>
- <li>{{web.link("/es/docs/Learn", "Aprende desarrollo web")}} proporciona información para principiantes e introduce conceptos básicos de programación e Internet.</li>
- <li>La {{JSxRef("../Guide", "Guía de JavaScript")}} (esta guía) proporciona una descripción general sobre el lenguaje JavaScript y sus objetos.</li>
- <li>La {{JSxRef("../Reference", "Referencia de JavaScript")}} proporciona material de referencia detallado para JavaScript.</li>
-</ul>
-
-<p>Si eres nuevo en JavaScript, comienza con los artículos en el {{web.link("/es/docs/Learn", "área de aprendizaje")}} y la {{JSxRef("../Guide", "Guía de JavaScript")}}. Una vez que tengas una firme comprensión de los fundamentos, puedes usar la {{JSxRef("../Referencia", "Referencia de JavaScript")}} para obtener más detalles sobre objetos y declaraciones individuales.</p>
-
-<h2 id="¿Qué_es_JavaScript">¿Qué es JavaScript?</h2>
-
-<p>JavaScript es un lenguaje de programación multiplataforma orientado a objetos que se utiliza para hacer que las páginas web sean interactivas (p. ej., Que tienen animaciones complejas, botones en los que se puede hacer clic, menús emergentes, etc.). También hay versiones de JavaScript de lado del servidor más avanzadas, como Node.js, que te permiten agregar más funcionalidad a un sitio web que simplemente descargar archivos (como la colaboración en tiempo real entre varias computadoras). Dentro de un entorno (por ejemplo, un navegador web), JavaScript se puede conectar a los objetos de su entorno para proporcionar control programático sobre ellos.</p>
-
-<p>JavaScript contiene una biblioteca estándar de objetos, como <code>Array</code>, <code>Date</code> y <code>Math</code>, y un conjunto básico de elementos del lenguaje como operadores, estructuras de control y declaraciones. El núcleo de JavaScript se puede extender para una variedad de propósitos completándolo con objetos adicionales; por ejemplo:</p>
-
-<ul>
- <li><em>JavaScript de lado del cliente</em> extiende el núcleo del lenguaje al proporcionar objetos para controlar un navegador y su <em>Modelo de objetos de documento</em> (DOM por <em>Document Object Model</em>). Por ejemplo, las extensiones de lado del cliente permiten que una aplicación coloque elementos en un formulario HTML y responda a eventos del usuario, como clics del mouse, formularios para ingreso de datos y navegación de páginas.</li>
- <li><em>JavaScript de lado del servidor</em> amplía el núcleo del lenguaje al proporcionar objetos relevantes para ejecutar JavaScript en un servidor. Por ejemplo, las extensiones de lado del servidor permiten que una aplicación se comunique con una base de datos, brinde continuidad de información de una invocación a otra de la aplicación o realice manipulación de archivos en un servidor.</li>
-</ul>
-
-<p>Esto significa que en el navegador, JavaScript puede cambiar la apariencia de la página web (DOM). Y, del mismo modo, el JavaScript de Node.js en el servidor puede responder a solicitudes personalizadas desde el código escrito en el navegador.</p>
-
-<h2 id="JavaScript_y_Java" name="JavaScript_y_Java">JavaScript y Java</h2>
-
-<p>JavaScript y Java son similares en algunos aspectos, pero fundamentalmente diferentes en otros. El lenguaje JavaScript se parece a Java, pero no tiene el tipado estático ni la fuerte verificación de tipos de Java. JavaScript sigue la mayoría de la sintaxis de las expresiones de Java, convenciones de nomenclatura y construcciones de control de flujo básicas, razón por la cual se cambió el nombre de LiveScript a JavaScript.</p>
-
-<p>A diferencia del sistema de clases en tiempo de compilación de Java creado por declaraciones, JavaScript admite un sistema de tiempo de ejecución basado en una pequeña cantidad de tipos de datos que representan valores numéricos, booleanos y de cadena. JavaScript tiene un modelo de objetos basado en prototipos en lugar del modelo de objetos basado en clases más común. El modelo basado en prototipos proporciona herencia dinámica; es decir, lo que se hereda puede variar en objetos individuales. JavaScript también admite funciones sin requisitos declarativos especiales. Las funciones pueden ser propiedades de objetos, ejecutándose como métodos débilmente tipados.</p>
-
-<p>JavaScript es un lenguaje de forma muy libre en comparación con Java. No es necesario declarar todas las variables, clases y métodos. No tienes que preocuparte por si los métodos son públicos, privados o protegidos, y no tienes que implementar interfaces. Las variables, los parámetros y los tipos de retorno de función no se tipifican explícitamente.</p>
-
-<p>Java es un lenguaje de programación basado en clases diseñado para una ejecución rápida y con seguridad de tipos. La seguridad de tipos significa, por ejemplo, que no puedes convertir un entero de Java en una referencia de objeto o acceder a la memoria privada corrompiendo el código de bytes de Java. El modelo basado en clases de Java significa que los programas constan exclusivamente de clases y sus métodos. La herencia de clases de Java y la tipificación fuerte generalmente requieren jerarquías de objetos estrechamente acopladas. Estos requisitos hacen que la programación Java sea más compleja que la programación JavaScript.</p>
-
-<p>Por el contrario, JavaScript desciende en espíritu de una línea de lenguajes más pequeños de tipado dinámico como HyperTalk y dBASE. Estos lenguajes de «<em>scripting</em>» ofrecen herramientas de programación a una audiencia mucho más amplia debido a su sintaxis más sencilla, funcionalidad especializada incorporada y requisitos mínimos para la creación de objetos.</p>
-
-<table class="standard-table">
- <caption>JavaScript comparado con Java</caption>
- <thead>
-  <tr>
-   <th scope="col">JavaScript</th>
-   <th scope="col">Java</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>Orientado a objetos. No hay distinción entre tipos de objetos. La herencia se realiza a través del mecanismo de prototipo, y las propiedades y métodos se pueden agregar a cualquier objeto de forma dinámica.</td>
-   <td>Basado en clases. Los objetos se dividen en clases e instancias con toda la herencia a través de la jerarquía de clases. Las clases y las instancias no pueden tener propiedades o métodos agregados dinámicamente.</td>
-  </tr>
-  <tr>
-   <td>Los tipos de datos de las variables no se declaran (tipado dinámico, tipado flexible).</td>
-   <td>Los tipos de datos de las variables se deben declarar (tipado estático, fuertemente tipado).</td>
-  </tr>
-  <tr>
-   <td>No se puede escribir automáticamente en el disco duro.</td>
-   <td>Puede escribir automáticamente en el disco duro.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Para obtener más información sobre las diferencias entre JavaScript y Java, consulta el capítulo {{JSxRef("../Guide/Details_of_the_Object_Model", "Detalles del modelo de objetos")}}.</p>
-
-<h2 id="JavaScript_y_la_especificacion_ECMAScript" name="JavaScript_y_la_especificacion_ECMAScript">JavaScript y la especificación ECMAScript</h2>
-
-<p>JavaScript está estandarizado en <a class="external" href="https://www.ecma-international.org/">Ecma International</a>, la asociación europea para estandarizar los sistemas de información y comunicación (ECMA antes era un acrónimo para la Asociación Europea de Fabricantes de Computadoras) para ofrecer un lenguaje de programación internacional estandarizado basado en JavaScript. Esta versión estandarizada de JavaScript, denominada ECMAScript, se comporta de la misma manera en todas las aplicaciones que admiten el estándar. Las empresas pueden utilizar el lenguaje estándar abierto para desarrollar su implementación de JavaScript. El estándar ECMAScript está documentado en la especificación ECMA-262. Consulta {{JSxRef("../Novedades_en_JavaScript", "Novedades en JavaScript")}} para obtener más información sobre las diferentes versiones de JavaScript y las ediciones de especificación ECMAScript.</p>
-
-<p>El estándar ECMA-262 también está aprobado por <a class="external" href="https://www.iso.org/home.html">ISO</a> (Organización Internacional de Normalización) como ISO-16262. También puedes encontrar la especificación en <a class="external" href="https://www.ecma-international.org/publications/standards/Ecma-262.htm">el sitio web de Ecma International</a>. La especificación ECMAScript no describe el modelo de objetos de documento (DOM), que está estandarizado por el <a class="external" href="https://www.w3.org/">World Wide Web Consortium (W3C)</a> y/o <a href="https://whatwg.org">WHATWG (Grupo de trabajo de tecnología de aplicaciones de hipertexto web)</a>. El DOM define la forma en que los objetos de documentos HTML se exponen a tu «script». Para tener una mejor idea de las diferentes tecnologías que se utilizan al programar con JavaScript, consulta el artículo {{JSxRef("../Descripción_de_las_tecnologías_JavaScript", "descripción de las tecnologías JavaScript")}}.</p>
-
-<h3 id="Documentacion_de_JavaScript_versus_especificacion_de_ECMAScript" name="Documentacion_de_JavaScript_versus_especificacion_de_ECMAScript">Documentación de JavaScript versus especificación de ECMAScript</h3>
-
-<p>La especificación ECMAScript es un conjunto de requisitos para implementar ECMAScript. Es útil si deseas implementar funciones del lenguaje compatibles con los estándares en tu implementación o motor ECMAScript (como SpiderMonkey en Firefox o V8 en Chrome).</p>
-
-<p>El documento ECMAScript <em>no</em> está destinado a ayudar a los programadores de scripts. Utiliza la documentación de JavaScript para obtener información al escribir tus scripts.</p>
-
-<p>La especificación ECMAScript utiliza terminología y sintaxis que puede resultar desconocida para un programador de JavaScript. Aunque la descripción del lenguaje puede diferir en ECMAScript, el lenguaje en sí sigue siendo el mismo. JavaScript admite todas las funciones descritas en la especificación ECMAScript.</p>
-
-<p>La documentación de JavaScript describe aspectos del lenguaje que son apropiados para un programador de JavaScript.</p>
-
-<h2 id="Cómo_empezar_con_JavaScript">Cómo empezar con JavaScript</h2>
-
-<p>Comenzar con JavaScript es fácil: todo lo que necesitas es un navegador web moderno. Esta guía incluye algunas funciones de JavaScript que solo están disponibles actualmente en las últimas versiones de Firefox, por lo que se recomienda utilizar la versión más reciente de Firefox.</p>
-
-<p>La herramienta <em>Consola web</em> integrada en Firefox es útil para experimentar con JavaScript; Puedes usarla en dos modos: modo de entrada unilínea y modo de entrada multilínea.</p>
-
-<h3 id="Entrada_unilínea_en_la_consola_web">Entrada unilínea en la consola web</h3>
-
-<p>La {{web.link("/es/docs/Tools/Web_Console", "Consola web")}} te muestra información sobre la página web cargada actualmente, y también incluye un intérprete de JavaScript que puedes usar para ejecutar expresiones de JavaScript en la página actual.</p>
-
-<p>Para abrir la Consola web (<kbd>Ctrl</kbd>+<kbd>Mayús</kbd>+<kbd>I</kbd> en Windows y Linux o <kbd>Cmd</kbd>-<kbd>Opción</kbd>-<kbd>K</kbd> en Mac), abre el menú <strong>Herramientas</strong> en Firefox y selecciona "<strong>Desarrollador ▶ Consola web</strong>".</p>
-
-<p>La consola web aparece en la parte inferior de la ventana del navegador. En la parte inferior de la consola hay una línea de entrada que puedes usar para ingresar JavaScript, y la salida aparece en el panel de arriba:</p>
-
-<p><img alt="Consola web" src="https://mdn.mozillademos.org/files/16569/2019-04-04_00-15-29.png" style="display: block; height: 1824px; margin-left: auto; margin-right: auto; width: 2784px;"></p>
-
-<p>La consola funciona exactamente de la misma manera que <code>eval</code>: devuelve la última expresión ingresada. En aras de la simplicidad, te puedes imaginar que cada vez que ingresas algo en la consola, en realidad estás rodeado por <code>console.log</code> alrededor de <code>eval</code>, así:</p>
-
-<pre class="brush: js notranslate">function greetMe(tuNombre) {
-  alert("Hola " + tuNombre)
-}
-<code>console.log(eval('3 + 5'))</code>
-</pre>
-
-<h3 id="Entrada_multilínea_en_la_consola_web">Entrada multilínea en la consola web</h3>
-
-<p>El modo de entrada unilínea de la consola web es ideal para realizar pruebas rápidas de expresiones JavaScript, pero aunque puedes ejecutar varias líneas, no es muy conveniente para eso. Para JavaScript más complejo, puedes utilizar el <a href="/es/docs/Tools/Web_Console/The_command_line_interpreter#Multi-line_mode">modo de entrada multilínea</a>.</p>
-
-<h3 id="Hola_mundo">Hola mundo</h3>
-
-<p>Para comenzar a escribir JavaScript, abre la Consola web en modo multilínea y escribe tu primer código "Hola mundo" en JavaScript:</p>
-
-<pre class="brush: js notranslate">(function(){
-  "use strict";
-  /* Inicio de tu código */
-  function greetMe(tuNombre) {
-    alert('Hola ' + tuNombre);
-  }
-
-  greetMe('Mundo');
-  /* Fin de tu código */
-})();</pre>
-
-<p>Presiona <kbd>Cmd</kbd>+<kbd>Intro</kbd> o <kbd>Ctrl</kbd>+<kbd>Intro</kbd> (o haz clic en el botón <strong>Ejecutar</strong>), ¡para ver cómo se desarrolla en tu navegador!</p>
-
-<p>En las siguientes páginas, esta guía te presenta la sintaxis de JavaScript y las características del lenguaje, de modo que puedas escribir aplicaciones más complejas.</p>
-
-<p>Pero por ahora, recuerda incluir siempre el <code>(function() { "use strict";</code> antes de tu código, y agrega <code>})();</code> al final de tu código. Aprenderás {{Glossary("IIFE", "qué significa IIFE")}} , pero por ahora puedes pensar que hacen lo siguiente:</p>
-
-<ol>
- <li>Mejoran enormemente el rendimiento.</li>
- <li>Evitan la semántica estúpida en JavaScript que hace tropezar a los principiantes.</li>
- <li>Evitan que los fragmentos de código ejecutados en la consola interactúen entre sí (por ejemplo, que algo creado en una ejecución de consola se utilice para una ejecución de consola diferente).</li>
-</ol>
-
-<p>{{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammar_and_types")}}</p>
diff --git a/files/es/web/javascript/guide/introduction/index.html b/files/es/web/javascript/guide/introduction/index.html
new file mode 100644
index 0000000000..bf909679ab
--- /dev/null
+++ b/files/es/web/javascript/guide/introduction/index.html
@@ -0,0 +1,162 @@
+---
+title: Introducción
+slug: Web/JavaScript/Guide/Introduction
+tags:
+  - Guía
+  - Introducion
+  - JavaScript
+  - Novato
+  - Principiante
+  - l10n:priority
+translation_of: Web/JavaScript/Guide/Introduction
+original_slug: Web/JavaScript/Guide/Introducción
+---
+<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammar_and_types")}}</div>
+
+<p class="summary">Este capítulo presenta JavaScript y analiza algunos de sus conceptos fundamentales.</p>
+
+<h2 id="¿Qué_debes_conocer_previamente">¿Qué debes conocer previamente?</h2>
+
+<p>Esta guía presume que tienes los siguientes antecedentes básicos:</p>
+
+<ul>
+ <li>Comprensión general de Internet y la ({{Glossary("WWW", "World Wide Web")}}).</li>
+ <li>Buen conocimiento práctico del {{Glossary("HTML", "lenguaje de marcado de hipertexto (HTML)")}}.</li>
+ <li>Alguna experiencia en programación. Si eres nuevo en la programación, prueba uno de los tutoriales vinculados en la página principal sobre {{JSxRef("../../JavaScript", "JavaScript")}}.</li>
+</ul>
+
+<h2 id="Dónde_encontrar_información_sobre_JavaScript">Dónde encontrar información sobre JavaScript</h2>
+
+<p>La documentación de JavaScript en MDN incluye lo siguiente:</p>
+
+<ul>
+ <li>{{web.link("/es/docs/Learn", "Aprende desarrollo web")}} proporciona información para principiantes e introduce conceptos básicos de programación e Internet.</li>
+ <li>La {{JSxRef("../Guide", "Guía de JavaScript")}} (esta guía) proporciona una descripción general sobre el lenguaje JavaScript y sus objetos.</li>
+ <li>La {{JSxRef("../Reference", "Referencia de JavaScript")}} proporciona material de referencia detallado para JavaScript.</li>
+</ul>
+
+<p>Si eres nuevo en JavaScript, comienza con los artículos en el {{web.link("/es/docs/Learn", "área de aprendizaje")}} y la {{JSxRef("../Guide", "Guía de JavaScript")}}. Una vez que tengas una firme comprensión de los fundamentos, puedes usar la {{JSxRef("../Referencia", "Referencia de JavaScript")}} para obtener más detalles sobre objetos y declaraciones individuales.</p>
+
+<h2 id="¿Qué_es_JavaScript">¿Qué es JavaScript?</h2>
+
+<p>JavaScript es un lenguaje de programación multiplataforma orientado a objetos que se utiliza para hacer que las páginas web sean interactivas (p. ej., Que tienen animaciones complejas, botones en los que se puede hacer clic, menús emergentes, etc.). También hay versiones de JavaScript de lado del servidor más avanzadas, como Node.js, que te permiten agregar más funcionalidad a un sitio web que simplemente descargar archivos (como la colaboración en tiempo real entre varias computadoras). Dentro de un entorno (por ejemplo, un navegador web), JavaScript se puede conectar a los objetos de su entorno para proporcionar control programático sobre ellos.</p>
+
+<p>JavaScript contiene una biblioteca estándar de objetos, como <code>Array</code>, <code>Date</code> y <code>Math</code>, y un conjunto básico de elementos del lenguaje como operadores, estructuras de control y declaraciones. El núcleo de JavaScript se puede extender para una variedad de propósitos completándolo con objetos adicionales; por ejemplo:</p>
+
+<ul>
+ <li><em>JavaScript de lado del cliente</em> extiende el núcleo del lenguaje al proporcionar objetos para controlar un navegador y su <em>Modelo de objetos de documento</em> (DOM por <em>Document Object Model</em>). Por ejemplo, las extensiones de lado del cliente permiten que una aplicación coloque elementos en un formulario HTML y responda a eventos del usuario, como clics del mouse, formularios para ingreso de datos y navegación de páginas.</li>
+ <li><em>JavaScript de lado del servidor</em> amplía el núcleo del lenguaje al proporcionar objetos relevantes para ejecutar JavaScript en un servidor. Por ejemplo, las extensiones de lado del servidor permiten que una aplicación se comunique con una base de datos, brinde continuidad de información de una invocación a otra de la aplicación o realice manipulación de archivos en un servidor.</li>
+</ul>
+
+<p>Esto significa que en el navegador, JavaScript puede cambiar la apariencia de la página web (DOM). Y, del mismo modo, el JavaScript de Node.js en el servidor puede responder a solicitudes personalizadas desde el código escrito en el navegador.</p>
+
+<h2 id="JavaScript_y_Java" name="JavaScript_y_Java">JavaScript y Java</h2>
+
+<p>JavaScript y Java son similares en algunos aspectos, pero fundamentalmente diferentes en otros. El lenguaje JavaScript se parece a Java, pero no tiene el tipado estático ni la fuerte verificación de tipos de Java. JavaScript sigue la mayoría de la sintaxis de las expresiones de Java, convenciones de nomenclatura y construcciones de control de flujo básicas, razón por la cual se cambió el nombre de LiveScript a JavaScript.</p>
+
+<p>A diferencia del sistema de clases en tiempo de compilación de Java creado por declaraciones, JavaScript admite un sistema de tiempo de ejecución basado en una pequeña cantidad de tipos de datos que representan valores numéricos, booleanos y de cadena. JavaScript tiene un modelo de objetos basado en prototipos en lugar del modelo de objetos basado en clases más común. El modelo basado en prototipos proporciona herencia dinámica; es decir, lo que se hereda puede variar en objetos individuales. JavaScript también admite funciones sin requisitos declarativos especiales. Las funciones pueden ser propiedades de objetos, ejecutándose como métodos débilmente tipados.</p>
+
+<p>JavaScript es un lenguaje de forma muy libre en comparación con Java. No es necesario declarar todas las variables, clases y métodos. No tienes que preocuparte por si los métodos son públicos, privados o protegidos, y no tienes que implementar interfaces. Las variables, los parámetros y los tipos de retorno de función no se tipifican explícitamente.</p>
+
+<p>Java es un lenguaje de programación basado en clases diseñado para una ejecución rápida y con seguridad de tipos. La seguridad de tipos significa, por ejemplo, que no puedes convertir un entero de Java en una referencia de objeto o acceder a la memoria privada corrompiendo el código de bytes de Java. El modelo basado en clases de Java significa que los programas constan exclusivamente de clases y sus métodos. La herencia de clases de Java y la tipificación fuerte generalmente requieren jerarquías de objetos estrechamente acopladas. Estos requisitos hacen que la programación Java sea más compleja que la programación JavaScript.</p>
+
+<p>Por el contrario, JavaScript desciende en espíritu de una línea de lenguajes más pequeños de tipado dinámico como HyperTalk y dBASE. Estos lenguajes de «<em>scripting</em>» ofrecen herramientas de programación a una audiencia mucho más amplia debido a su sintaxis más sencilla, funcionalidad especializada incorporada y requisitos mínimos para la creación de objetos.</p>
+
+<table class="standard-table">
+ <caption>JavaScript comparado con Java</caption>
+ <thead>
+  <tr>
+   <th scope="col">JavaScript</th>
+   <th scope="col">Java</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>Orientado a objetos. No hay distinción entre tipos de objetos. La herencia se realiza a través del mecanismo de prototipo, y las propiedades y métodos se pueden agregar a cualquier objeto de forma dinámica.</td>
+   <td>Basado en clases. Los objetos se dividen en clases e instancias con toda la herencia a través de la jerarquía de clases. Las clases y las instancias no pueden tener propiedades o métodos agregados dinámicamente.</td>
+  </tr>
+  <tr>
+   <td>Los tipos de datos de las variables no se declaran (tipado dinámico, tipado flexible).</td>
+   <td>Los tipos de datos de las variables se deben declarar (tipado estático, fuertemente tipado).</td>
+  </tr>
+  <tr>
+   <td>No se puede escribir automáticamente en el disco duro.</td>
+   <td>Puede escribir automáticamente en el disco duro.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Para obtener más información sobre las diferencias entre JavaScript y Java, consulta el capítulo {{JSxRef("../Guide/Details_of_the_Object_Model", "Detalles del modelo de objetos")}}.</p>
+
+<h2 id="JavaScript_y_la_especificacion_ECMAScript" name="JavaScript_y_la_especificacion_ECMAScript">JavaScript y la especificación ECMAScript</h2>
+
+<p>JavaScript está estandarizado en <a class="external" href="https://www.ecma-international.org/">Ecma International</a>, la asociación europea para estandarizar los sistemas de información y comunicación (ECMA antes era un acrónimo para la Asociación Europea de Fabricantes de Computadoras) para ofrecer un lenguaje de programación internacional estandarizado basado en JavaScript. Esta versión estandarizada de JavaScript, denominada ECMAScript, se comporta de la misma manera en todas las aplicaciones que admiten el estándar. Las empresas pueden utilizar el lenguaje estándar abierto para desarrollar su implementación de JavaScript. El estándar ECMAScript está documentado en la especificación ECMA-262. Consulta {{JSxRef("../Novedades_en_JavaScript", "Novedades en JavaScript")}} para obtener más información sobre las diferentes versiones de JavaScript y las ediciones de especificación ECMAScript.</p>
+
+<p>El estándar ECMA-262 también está aprobado por <a class="external" href="https://www.iso.org/home.html">ISO</a> (Organización Internacional de Normalización) como ISO-16262. También puedes encontrar la especificación en <a class="external" href="https://www.ecma-international.org/publications/standards/Ecma-262.htm">el sitio web de Ecma International</a>. La especificación ECMAScript no describe el modelo de objetos de documento (DOM), que está estandarizado por el <a class="external" href="https://www.w3.org/">World Wide Web Consortium (W3C)</a> y/o <a href="https://whatwg.org">WHATWG (Grupo de trabajo de tecnología de aplicaciones de hipertexto web)</a>. El DOM define la forma en que los objetos de documentos HTML se exponen a tu «script». Para tener una mejor idea de las diferentes tecnologías que se utilizan al programar con JavaScript, consulta el artículo {{JSxRef("../Descripción_de_las_tecnologías_JavaScript", "descripción de las tecnologías JavaScript")}}.</p>
+
+<h3 id="Documentacion_de_JavaScript_versus_especificacion_de_ECMAScript" name="Documentacion_de_JavaScript_versus_especificacion_de_ECMAScript">Documentación de JavaScript versus especificación de ECMAScript</h3>
+
+<p>La especificación ECMAScript es un conjunto de requisitos para implementar ECMAScript. Es útil si deseas implementar funciones del lenguaje compatibles con los estándares en tu implementación o motor ECMAScript (como SpiderMonkey en Firefox o V8 en Chrome).</p>
+
+<p>El documento ECMAScript <em>no</em> está destinado a ayudar a los programadores de scripts. Utiliza la documentación de JavaScript para obtener información al escribir tus scripts.</p>
+
+<p>La especificación ECMAScript utiliza terminología y sintaxis que puede resultar desconocida para un programador de JavaScript. Aunque la descripción del lenguaje puede diferir en ECMAScript, el lenguaje en sí sigue siendo el mismo. JavaScript admite todas las funciones descritas en la especificación ECMAScript.</p>
+
+<p>La documentación de JavaScript describe aspectos del lenguaje que son apropiados para un programador de JavaScript.</p>
+
+<h2 id="Cómo_empezar_con_JavaScript">Cómo empezar con JavaScript</h2>
+
+<p>Comenzar con JavaScript es fácil: todo lo que necesitas es un navegador web moderno. Esta guía incluye algunas funciones de JavaScript que solo están disponibles actualmente en las últimas versiones de Firefox, por lo que se recomienda utilizar la versión más reciente de Firefox.</p>
+
+<p>La herramienta <em>Consola web</em> integrada en Firefox es útil para experimentar con JavaScript; Puedes usarla en dos modos: modo de entrada unilínea y modo de entrada multilínea.</p>
+
+<h3 id="Entrada_unilínea_en_la_consola_web">Entrada unilínea en la consola web</h3>
+
+<p>La {{web.link("/es/docs/Tools/Web_Console", "Consola web")}} te muestra información sobre la página web cargada actualmente, y también incluye un intérprete de JavaScript que puedes usar para ejecutar expresiones de JavaScript en la página actual.</p>
+
+<p>Para abrir la Consola web (<kbd>Ctrl</kbd>+<kbd>Mayús</kbd>+<kbd>I</kbd> en Windows y Linux o <kbd>Cmd</kbd>-<kbd>Opción</kbd>-<kbd>K</kbd> en Mac), abre el menú <strong>Herramientas</strong> en Firefox y selecciona "<strong>Desarrollador ▶ Consola web</strong>".</p>
+
+<p>La consola web aparece en la parte inferior de la ventana del navegador. En la parte inferior de la consola hay una línea de entrada que puedes usar para ingresar JavaScript, y la salida aparece en el panel de arriba:</p>
+
+<p><img alt="Consola web" src="https://mdn.mozillademos.org/files/16569/2019-04-04_00-15-29.png" style="display: block; height: 1824px; margin-left: auto; margin-right: auto; width: 2784px;"></p>
+
+<p>La consola funciona exactamente de la misma manera que <code>eval</code>: devuelve la última expresión ingresada. En aras de la simplicidad, te puedes imaginar que cada vez que ingresas algo en la consola, en realidad estás rodeado por <code>console.log</code> alrededor de <code>eval</code>, así:</p>
+
+<pre class="brush: js notranslate">function greetMe(tuNombre) {
+  alert("Hola " + tuNombre)
+}
+<code>console.log(eval('3 + 5'))</code>
+</pre>
+
+<h3 id="Entrada_multilínea_en_la_consola_web">Entrada multilínea en la consola web</h3>
+
+<p>El modo de entrada unilínea de la consola web es ideal para realizar pruebas rápidas de expresiones JavaScript, pero aunque puedes ejecutar varias líneas, no es muy conveniente para eso. Para JavaScript más complejo, puedes utilizar el <a href="/es/docs/Tools/Web_Console/The_command_line_interpreter#Multi-line_mode">modo de entrada multilínea</a>.</p>
+
+<h3 id="Hola_mundo">Hola mundo</h3>
+
+<p>Para comenzar a escribir JavaScript, abre la Consola web en modo multilínea y escribe tu primer código "Hola mundo" en JavaScript:</p>
+
+<pre class="brush: js notranslate">(function(){
+  "use strict";
+  /* Inicio de tu código */
+  function greetMe(tuNombre) {
+    alert('Hola ' + tuNombre);
+  }
+
+  greetMe('Mundo');
+  /* Fin de tu código */
+})();</pre>
+
+<p>Presiona <kbd>Cmd</kbd>+<kbd>Intro</kbd> o <kbd>Ctrl</kbd>+<kbd>Intro</kbd> (o haz clic en el botón <strong>Ejecutar</strong>), ¡para ver cómo se desarrolla en tu navegador!</p>
+
+<p>En las siguientes páginas, esta guía te presenta la sintaxis de JavaScript y las características del lenguaje, de modo que puedas escribir aplicaciones más complejas.</p>
+
+<p>Pero por ahora, recuerda incluir siempre el <code>(function() { "use strict";</code> antes de tu código, y agrega <code>})();</code> al final de tu código. Aprenderás {{Glossary("IIFE", "qué significa IIFE")}} , pero por ahora puedes pensar que hacen lo siguiente:</p>
+
+<ol>
+ <li>Mejoran enormemente el rendimiento.</li>
+ <li>Evitan la semántica estúpida en JavaScript que hace tropezar a los principiantes.</li>
+ <li>Evitan que los fragmentos de código ejecutados en la consola interactúen entre sí (por ejemplo, que algo creado en una ejecución de consola se utilice para una ejecución de consola diferente).</li>
+</ol>
+
+<p>{{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammar_and_types")}}</p>
diff --git a/files/es/web/javascript/guide/loops_and_iteration/index.html b/files/es/web/javascript/guide/loops_and_iteration/index.html
new file mode 100644
index 0000000000..d74307f35e
--- /dev/null
+++ b/files/es/web/javascript/guide/loops_and_iteration/index.html
@@ -0,0 +1,335 @@
+---
+title: Bucles e iteración
+slug: Web/JavaScript/Guide/Loops_and_iteration
+tags:
+  - Bucle
+  - Guia(2)
+  - Guía
+  - Iteración
+  - JavaScript
+  - Sintaxis
+translation_of: Web/JavaScript/Guide/Loops_and_iteration
+original_slug: Web/JavaScript/Guide/Bucles_e_iteración
+---
+<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}</div>
+
+<p class="summary">Los bucles ofrecen una forma rápida y sencilla de hacer algo repetidamente. Este capítulo de la {{JSxRef("../Guide", "Guía de JavaScript")}} presenta las diferentes declaraciones de iteración disponibles para JavaScript.</p>
+
+<p>Puedes pensar en un bucle como una versión computarizada del juego en la que le dices a alguien que dé <em>X</em> pasos en una dirección y luego <em>Y</em> pasos en otra. Por ejemplo, la idea "Ve cinco pasos hacia el este" se podría expresar de esta manera como un bucle:</p>
+
+<pre class="brush: js notranslate">for (let step = 0; step &lt; 5; step++) {
+  // Se ejecuta 5 veces, con valores del paso 0 al 4.
+  console.log('Camina un paso hacia el este');
+}
+</pre>
+
+<p>Hay muchos diferentes tipos de bucles, pero esencialmente, todos hacen lo mismo: repiten una acción varias veces. (¡Ten en cuenta que es posible que ese número sea cero!).</p>
+
+<p>Los diversos mecanismos de bucle ofrecen diferentes formas de determinar los puntos de inicio y terminación del bucle. Hay varias situaciones que son fácilmente atendidas por un tipo de bucle que por otros.</p>
+
+<p>Las declaraciones para bucles proporcionadas en JavaScript son:</p>
+
+<ul>
+ <li>{{anch("Declaracion_for", "Declaración for")}}</li>
+ <li>{{anch("Declaracion_do...while", "Declaración do...while")}}</li>
+ <li>{{anch("Declaracion_while", "Declaración while")}}</li>
+ <li>{{anch("Declaracion_labeled", "Declaración labeled")}}</li>
+ <li>{{anch("Declaracion_break", "Declaración break")}}</li>
+ <li>{{anch("Declaracion_continue", "Declaración continue")}}</li>
+ <li>{{anch("Declaracion_for...in", "Declaración for...in")}}</li>
+ <li>{{anch("Declaracion_for...of", "Declaración for...of")}}</li>
+</ul>
+
+<h2 id="Declaración_for">Declaración <code>for</code></h2>
+
+<p>Un ciclo {{JSxRef("Sentencias/for", "for")}} se repite hasta que una condición especificada se evalúe como <code>false</code>. El bucle <code>for</code> de JavaScript es similar al bucle <code>for</code> de Java y C.</p>
+
+<p>Una declaración <code>for</code> tiene el siguiente aspecto:</p>
+
+<pre class="syntaxbox notranslate">for ([expresiónInicial]; [expresiónCondicional]; [expresiónDeActualización])
+  instrucción
+</pre>
+
+<p>Cuando se ejecuta un bucle <code>for</code>, ocurre lo siguiente:</p>
+
+<ol>
+ <li>Se ejecuta la expresión de iniciación <code>expresiónInicial</code>, si existe. Esta expresión normalmente inicia uno o más contadores de bucle, pero la sintaxis permite una expresión de cualquier grado de complejidad. Esta expresión también puede declarar variables.</li>
+ <li>Se evalúa la expresión <code>expresiónCondicional</code>. Si el valor de <code>expresiónCondicional</code> es verdadero, se ejecutan las instrucciones del bucle. Si el valor de <code>condición</code> es falso, el bucle <code>for</code> termina. (Si la expresión <code>condición</code> se omite por completo, se supone que la condición es verdadera).</li>
+ <li>Se ejecuta la <code>instrucción</code>. Para ejecutar varias instrucciones, usa una declaración de bloque (<code>{ ... }</code>) para agrupar esas declaraciones.</li>
+ <li>Si está presente, se ejecuta la expresión de actualización <code>expresiónDeActualización</code>.</li>
+ <li>El control regresa al paso 2.</li>
+</ol>
+
+<h3 id="Ejemplo"><strong>Ejemplo</strong></h3>
+
+<p>En el siguiente ejemplo, la función contiene una instrucción <code>for</code> que cuenta el número de opciones seleccionadas en una lista de desplazamiento (el elemento {{HTMLElement("select")}} de HTML representa un control que proporciona un menú de opciones que permite múltiples selecciones). La instrucción <code>for</code> declara la variable <code>i</code> y la inicia a <code>0</code>. Comprueba que <code>i</code> es menor que el número de opciones en el elemento <code>&lt;select&gt;</code>, realiza la siguiente instrucción <code>if</code> e incrementa <code>i</code> después de cada pasada por el bucle.</p>
+
+<pre class="brush: html notranslate">&lt;form name="selectForm"&gt;
+  &lt;p&gt;
+    &lt;label for="musicTypes"&gt;Elija algunos tipos de música, luego haga clic en el botón de abajo:&lt;/label&gt;
+    &lt;select id="musicTypes" name="musicTypes" multiple="multiple"&gt;
+      &lt;option selected="selected"&gt;R&amp;B&lt;/option&gt;
+      &lt;option&gt;Jazz&lt;/option&gt;
+      &lt;option&gt;Blues&lt;/option&gt;
+      &lt;option&gt;New Age&lt;/option&gt;
+      &lt;option&gt;Classical&lt;/option&gt;
+      &lt;option&gt;Opera&lt;/option&gt;
+    &lt;/select&gt;
+  &lt;/p&gt;
+  &lt;p&gt;&lt;input id="btn" type="button" value="¿Cuántos están seleccionados?" /&gt;&lt;/p&gt;
+&lt;/form&gt;
+
+&lt;script&gt;
+function howMany(selectObject) {
+  let numberSelected = 0;
+  for (let i = 0; i &lt; selectObject.options.length; i++) {
+    if (selectObject.options[i].selected) {
+      numberSelected++;
+    }
+  }
+  return numberSelected;
+}
+
+let btn = document.getElementById('btn');
+btn.addEventListener('click', function() {
+  alert('Número de opciones seleccionadas: ' + howMany(document.selectForm.musicTypes));
+});
+&lt;/script&gt;
+
+</pre>
+
+<h2 id="Declaración_do...while">Declaración <code>do...while</code></h2>
+
+<p>La instrucción {{JSxRef("Sentencias/do...while", "do...while")}} se repite hasta que una condición especificada se evalúe como falsa.</p>
+
+<p>Una declaración <code>do...while</code> tiene el siguiente aspecto:</p>
+
+<pre class="syntaxbox notranslate">do
+  <em>expresión</em>
+while (condición);
+</pre>
+
+<p><em><code>exposición</code></em> siempre se ejecuta una vez antes de que se verifique la condición. (Para ejecutar varias instrucciones, usa una declaración de bloque (<code>{ ... }</code>) para agrupar esas declaraciones).</p>
+
+<p>Si <code>condición</code> es <code>true</code>, la declaración se ejecuta de nuevo. Al final de cada ejecución, se comprueba la condición. Cuando la condición es <code>false</code>, la ejecución se detiene y el control pasa a la declaración que sigue a <code>do...while</code>.</p>
+
+<h3 id="Ejemplo_2"><strong>Ejemplo</strong></h3>
+
+<p>En el siguiente ejemplo, el bucle <code>do</code> itera al menos una vez y se repite hasta que <code><em>i</em></code> ya no sea menor que <code>5</code>.</p>
+
+<p>let i = 0; do { i += 1; console.log(i); } while (i &lt; 5);</p>
+
+<h2 id="Declaración_while">Declaración <code>while</code></h2>
+
+<p>Una declaración {{JSxRef("Sentencias/while", "while")}} ejecuta sus instrucciones siempre que una condición especificada se evalúe como <code>true</code>. Una instrucción <code>while</code> tiene el siguiente aspecto:</p>
+
+<pre class="syntaxbox notranslate">while (<em>condición</em>)
+  <em>expresión</em>
+</pre>
+
+<p>Si la <em><code>condición</code></em> se vuelve <code>false</code>, la <code>instrucción</code> dentro del bucle se deja de ejecutar y el control pasa a la instrucción que sigue al bucle.</p>
+
+<p>La prueba de condición ocurre <em>antes</em> de que se ejecute la <code>expresión</code> en el bucle. Si la condición devuelve <code>true</code>, se ejecuta la <code>expresión</code> y la <em><code>condición</code></em> se prueba de nuevo. Si la condición devuelve <code>false</code>, la ejecución se detiene y el control se pasa a la instrucción que sigue a <code>while</code>.</p>
+
+<p>Para ejecutar varias instrucciones, usa una declaración de bloque (<code>{ ... }</code>) para agrupar esas declaraciones.</p>
+
+<h3 id="Ejemplo_1"><strong>Ejemplo 1</strong></h3>
+
+<p>El siguiente ciclo del <code>while</code> se repite siempre que <em><code>n</code></em> sea menor que <code>3</code>:</p>
+
+<pre class="brush: js notranslate">let n = 0;
+let x = 0;
+while (n &lt; 3) {
+  n++;
+  x += n;
+}
+</pre>
+
+<p>Con cada iteración, el bucle incrementa <code>n</code> y agrega ese valor a <code>x</code>. Por lo tanto, <code>x</code> y <code>n</code> toman los siguientes valores:</p>
+
+<ul>
+ <li>Después de la primera pasada: <code>n</code> = <code>1</code> y <code>x</code> = <code>1</code></li>
+ <li>Después de la segunda pasada: <code>n</code> = <code>2</code> y <code>x</code> = <code>3</code></li>
+ <li>Después de la tercera pasada: <code>n</code> = <code>3</code> y <code>x</code> = <code>6</code></li>
+</ul>
+
+<p>Después de completar la tercera pasada, la condición <code>n &lt; 3</code> ya no es <code>true</code>, por lo que el bucle termina.<strong>Ejemplo 2</strong></p>
+
+<p>Evita los bucles infinitos. Asegúrate de que la condición en un bucle eventualmente se convierta en <code>false</code>; de lo contrario, el bucle nunca terminará. Las declaraciones en el siguiente bucle <code>while</code> se ejecutan indefinidamente porque la condición nunca se vuelve <code>false</code>:</p>
+
+<pre class="example-bad brush: js notranslate">// ¡Los bucles infinitos son malos!
+while (true) {
+  console.log('¡Hola, mundo!');
+}</pre>
+
+<h2 id="Declaración_labeled">Declaración <code>labeled</code></h2>
+
+<p>Una {{JSxRef("Sentencias/label", "label")}} proporciona una instrucción con un identificador que te permite hacer referencia a ella en otra parte de tu programa. Por ejemplo, puedes usar una etiqueta para identificar un bucle y luego usar las declaraciones <code>break</code> o <code>continue</code> para indicar si un programa debe interrumpir el bucle o continuar su ejecución.La sintaxis de la instrucción etiquetada es similar a la siguiente:label : instrucción</p>
+
+<p>El valor de <code><em>label</em></code> puede ser cualquier identificador de JavaScript que no sea una palabra reservada. La <code><em>declaración</em></code> que identifica a una etiqueta puede ser cualquier enunciado.</p>
+
+<p><strong>Ejemplo</strong></p>
+
+<p>En este ejemplo, la etiqueta <code>markLoop</code> identifica un bucle <code>while</code>.</p>
+
+<p>markLoop: while (theMark === true) { doSomething(); }</p>
+
+<p>Declaración <code>break</code></p>
+
+<p>Usa la instrucción {{JSxRef("Sentencias/break", "break")}} para terminar un bucle, <code>switch</code> o junto con una declaración etiquetada.</p>
+
+<ul>
+ <li>Cuando usas <code>break</code> sin una etiqueta, inmediatamente termina el <code>while</code>, <code>do-while</code>, <code>for</code> o <code>switch</code> y transfiere el control a la siguiente declaración.</li>
+ <li>Cuando usas <code>break</code> con una etiqueta, termina la declaración etiquetada especificada.</li>
+</ul>
+
+<p>La sintaxis de la instrucción <code>break</code> se ve así:</p>
+
+<pre class="syntaxbox notranslate">break;
+break [<em>label</em>];
+</pre>
+
+<ol>
+ <li>La primera forma de la sintaxis termina el bucle envolvente más interno o el <code>switch.</code></li>
+ <li>La segunda forma de la sintaxis termina la instrucción etiquetada específica.</li>
+</ol>
+
+<h3 id="Ejemplo_1_2"><strong>Ejemplo</strong> <strong>1</strong></h3>
+
+<p>El siguiente ejemplo recorre en iteración los elementos de un arreglo hasta que encuentra el índice de un elemento cuyo valor es <code>theValue</code>:</p>
+
+<pre class="brush: js notranslate">for (let i = 0; i &lt; a.length; i++) {
+  if (a[i] === theValue) {
+    break;
+  }
+}</pre>
+
+<h3 id="Ejemplo_2_romper_una_etiqueta"><strong>Ejemplo 2:</strong> romper una etiqueta</h3>
+
+<pre class="brush: js notranslate">let x = 0;
+let z = 0;
+labelCancelLoops: while (true) {
+  console.log('Bucles externos: ' + x);
+  x += 1;
+  z = 1;
+  while (true) {
+    console.log('Bucles internos: ' + z);
+    z += 1;
+    if (z === 10 &amp;&amp; x === 10) {
+      break labelCancelLoops;
+    } else if (z === 10) {
+      break;
+    }
+  }
+}
+</pre>
+
+<h2 id="Declaración_continue">Declaración <code>continue</code></h2>
+
+<p>La instrucción {{JSxRef("Sentencias/continue", "continue")}} se puede usar para reiniciar un <code>while</code>, <code>do-while</code>, <code>for</code>, o declaración <code>label</code>.</p>
+
+<ul>
+ <li>Cuando utilizas <code>continue</code> sin una etiqueta, finaliza la iteración actual del <code>while</code>, <code>do-while</code> o <code>for</code> y continúa la ejecución del bucle con la siguiente iteración. A diferencia de la instrucción <code>break</code>, <code>continue</code> no termina la ejecución del bucle por completo. En un bucle <code>while</code>, vuelve a la condición. En un bucle <code>for</code>, salta a la <code>expresión-incremento</code>.</li>
+ <li>Cuando usas <code>continue</code> con una etiqueta, se aplica a la declaración de bucle identificada con esa etiqueta.</li>
+</ul>
+
+<p>La sintaxis de la instrucción <code>continue</code> se parece a la siguiente:</p>
+
+<pre class="syntaxbox notranslate">continue [<em>label</em>];
+</pre>
+
+<h3 id="Ejemplo_1_3"><strong>Ejemplo 1</strong></h3>
+
+<p>El siguiente ejemplo muestra un bucle <code>while</code> con una instrucción <code>continue</code> que se ejecuta cuando el valor de <code>i</code> es <code>3</code>. Por lo tanto, <code>n</code> toma los valores <code>1</code>, <code>3</code>, <code>7</code> y <code>12</code>.</p>
+
+<pre class="brush: js notranslate">let i = 0;
+let n = 0;
+while (i &lt; 5) {
+  i++;
+  if (i === 3) {
+    continue;
+  }
+  n += i;
+  console.log(n);
+}
+//1,3,7,12
+
+
+let i = 0;
+let n = 0;
+while (i &lt; 5) {
+  i++;
+  if (i === 3) {
+     // continue;
+  }
+  n += i;
+  console.log(n);
+}
+// 1,3,6,10,15
+</pre>
+
+<h3 id="Ejemplo_2_2"><strong>Ejemplo 2</strong></h3>
+
+<p>Una declaración etiquetada <em><code>checkiandj</code></em> contiene una declaración etiquetada <em><code>checkj</code></em>. Si se encuentra <code>continue</code>, el programa termina la iteración actual de <em><code>checkj</code></em> y comienza la siguiente iteración. Cada vez que se encuentra <code>continue</code>, <em><code>checkj</code></em> reitera hasta que su condición devuelve <code>false</code>. Cuando se devuelve <code>false</code>, el resto de la instrucción <em><code>checkiandj</code></em> se completa y <em><code>checkiandj</code></em> reitera hasta que su condición devuelve <code>false</code>. Cuando se devuelve <code>false</code>, el programa continúa en la declaración que sigue a <em><code>checkiandj</code></em>.</p>
+
+<p>Si <code>continue</code> tuviera una etiqueta de <em><code>checkiandj</code></em>, el programa continuaría en la parte superior de la declaración <em><code>checkiandj</code></em>.</p>
+
+<p>let i = 0; let j = 10; checkiandj: while (i &lt; 4) { console.log(i); i += 1; checkj: while (j &gt; 4) { console.log(j); j -= 1; if ((j % 2) === 0) { continue checkj; } console.log(j + 'es impar.'); } console.log('i = ' + i); console.log('j = ' + j); }</p>
+
+<h2 id="Declaración_for...in">Declaración <code>for...in</code></h2>
+
+<p>La instrucción {{JSxRef("Sentencias/for...in", "for...in")}} itera una variable especificada sobre todas las propiedades enumerables de un objeto. Para cada propiedad distinta, JavaScript ejecuta las instrucciones especificadas. Una declaración <code>for...in</code> tiene el siguiente aspecto:</p>
+
+<pre class="syntaxbox notranslate">for (variable in objeto)
+  instrucción
+</pre>
+
+<h3 id="Ejemplo_3"><strong>Ejemplo</strong></h3>
+
+<p>La siguiente función toma como argumento un objeto y el nombre del objeto. Luego itera sobre todas las propiedades del objeto y devuelve una cadena que enumera los nombres de las propiedades y sus valores.</p>
+
+<pre class="brush: js notranslate">function dump_props(obj, obj_name) {
+  let result = '';
+  for (let i in obj) {
+    result += obj_name + '.' + i + ' = ' + obj[i] + '&lt;br&gt;';
+  }
+  result += '&lt;hr&gt;';
+  return result;
+}
+</pre>
+
+<p>Para un objeto <code>car</code> con propiedades <code>make</code> y <code>model</code>, <code>result</code> sería:</p>
+
+<pre class="brush: js notranslate">car.make = Ford
+car.model = Mustang
+</pre>
+
+<h3 id="Arrays"><strong>Arrays</strong></h3>
+
+<p>Aunque puede ser tentador usar esto como una forma de iterar sobre los elementos {{JSxRef("Array")}}, la instrucción <code>for...in</code> devolverá el nombre de sus propiedades definidas por el usuario además de los índices numéricos.</p>
+
+<p>Por lo tanto, es mejor usar un bucle {{JSxRef("Sentencias/for", "for")}} tradicional con un índice numérico cuando se itera sobre arreglos, porque la instrucción <code>for...in</code> itera sobre las propiedades definidas por el usuario además de los elementos del arreglo, si modificas el objeto <code>Array</code> (tal como agregar propiedades o métodos personalizados).</p>
+
+<h2 id="Declaración_for...of">Declaración <code>for...of</code></h2>
+
+<p>La declaración {{JSxRef("Sentencias/for...of", "for...of")}} crea un bucle que se repite sobre {{JSxRef("../Guide/iterable", "objetos iterables")}} (incluidos {{JSxRef("Array")}}, {{JSxRef("Map")}}, {{JSxRef("Set")}}, objetos {{JSxRef("Funciones/arguments", "arguments")}} y así sucesivamente), invocando un gancho de iteración personalizado con declaraciones que se ejecutarán para el valor de cada distinta propiedad.</p>
+
+<pre class="syntaxbox notranslate">para (<em>variable</em> of <em>objeto</em>)
+  <em>expresión</em>
+</pre>
+
+<p>El siguiente ejemplo muestra la diferencia entre un bucle for<code>...in</code> y un bucle {{JSxRef("Sentencias/for...in", "for...in")}}. Mientras que <code>for...in</code> itera sobre los nombres de propiedad, <code>for...of</code> itera sobre los valores de propiedad:</p>
+
+<pre class="brush:js notranslate">const arr = [3, 5, 7];
+arr.foo = 'hola';
+
+for (let i in arr) {
+   console.log(i); // logs "0", "1", "2", "foo"
+}
+
+for (let i of arr) {
+   console.log(i); // logs 3, 5, 7
+}
+</pre>
+
+<p>{{PreviousNext("Web/JavaScript/Guide/Control_flow_and_error_handling", "Web/JavaScript/Guide/Functions")}}</p>
diff --git a/files/es/web/javascript/guide/modules/index.html b/files/es/web/javascript/guide/modules/index.html
new file mode 100644
index 0000000000..84f2af4f9a
--- /dev/null
+++ b/files/es/web/javascript/guide/modules/index.html
@@ -0,0 +1,459 @@
+---
+title: Módulos JavaScript
+slug: Web/JavaScript/Guide/Modules
+tags:
+  - Guía
+  - JavaScript
+  - Modules
+  - Módulos
+  - export
+  - import
+translation_of: Web/JavaScript/Guide/Modules
+original_slug: Web/JavaScript/Guide/Módulos
+---
+<div>{{JSSidebar("Guía de JavaScript")}}{{Previous("Web/JavaScript/Guide/Meta_programming")}}</div>
+
+<p>Esta guía te brinda todo lo que necesitas para comenzar con la sintaxis de los módulos JavaScript.</p>
+
+<h2 id="Un_antecedente_sobre_módulos">Un antecedente sobre módulos</h2>
+
+<p>Los programas JavaScript comenzaron siendo bastante pequeños — la mayor parte de su uso en los primeros días era para realizar tareas de scripting aisladas, proporcionando un poco de interactividad a tus páginas web donde fuera necesario, por lo que generalmente no se necesitaban grandes scripts. Avancemos unos años y ahora tenemos aplicaciones completas que se ejecutan en navegadores con mucho JavaScript, JavaScript ahora se usa en otros contextos (<a href="/es/docs/Glossary/Node.js">Node.js</a>, por ejemplo).</p>
+
+<p>Por lo tanto, en los últimos años se ha comenzado a pensar en proporcionar mecanismos para dividir programas JavaScript en módulos separados que se puedan importar cuando sea necesario. Node.js ha tenido esta capacidad durante mucho tiempo, y hay una serie de bibliotecas y marcos de JavaScript que permiten el uso de módulos (por ejemplo, <a href="https://en.wikipedia.org/wiki/CommonJS">CommonJS</a> y <a href="https://github.com/amdjs/amdjs-api/blob/master/AMD.md">AMD</a> otros basados en sistemas de módulos como <a href="https://requirejs.org/">RequireJS</a>, y recientemente <a href="https://webpack.github.io/">Webpack</a> y <a href="https://babeljs.io/">Babel</a>).</p>
+
+<p>La buena noticia es que los navegadores modernos han comenzado a admitir la funcionalidad de los módulos de forma nativa, y de esto se trata este artículo. Esto solo puede ser algo bueno — los navegadores pueden optimizar la carga de módulos, haciéndolo más eficiente que tener que usar una biblioteca y hacer todo ese procesamiento adicional de lado del cliente, ahorrando viajes de ida y vuelta adicionales.</p>
+
+<h2 id="Soporte_del_navegador">Soporte del navegador</h2>
+
+<p>El uso de módulos JavaScript nativos depende de las declaraciones {{jsxref("Statements/import", "import")}} y {{jsxref("Statements/export", "export")}}; estas son compatibles con los navegadores de la siguiente manera:</p>
+
+<h3 id="import">import</h3>
+
+<p>{{Compat("javascript.statements.import")}}</p>
+
+<h3 id="export">export</h3>
+
+<p>{{Compat("javascript.statements.export")}}</p>
+
+<h2 id="Introducción_—_un_ejemplo">Introducción — un ejemplo</h2>
+
+<p>Para demostrar el uso de módulos, hemos creado un <a href="https://github.com/mdn/js-examples/tree/master/modules">sencillo conjunto de ejemplos</a> que puedes encontrar en GitHub. Estos ejemplos demuestran un sencillo conjunto de módulos que crean un elemento <a href="/es/docs/Web/HTML/Element/canvas" title="Usa el elemento ↑&lt;canvas>↓ de HTML con el scripting de la API de canvas o la API WebGL para dibujar gráficos y animaciones."><code>&lt;canvas&gt;</code></a> en una página web, y luego dibujan (y reportan información sobre) diferentes formas en el lienzo.</p>
+
+<p>Estos son bastante triviales, pero se han mantenido deliberadamente simples para demostrar los módulos con claridad.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Si deseas descargar los ejemplos y ejecutarlos localmente, deberás ejecutarlos a través de un servidor web local.</p>
+</div>
+
+<h2 id="Estructura_básica_de_los_ejemplos">Estructura básica de los ejemplos</h2>
+
+<p>En nuestro primer ejemplo (ve <a href="https://github.com/mdn/js-examples/tree/master/modules/basic-modules">basic-modules</a>) tenemos la siguiente estructura de archivos:</p>
+
+<pre class="notranslate">index.html
+main.js
+modules/
+    canvas.js
+    square.js</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Todos los ejemplos de esta guía básicamente tienen la misma estructura; lo anterior debería empezar a resultarte bastante familiar.</p>
+</div>
+
+<p>Los dos módulos del directorio <code>modules</code> se describen a continuación:</p>
+
+<ul>
+ <li><code>canvas.js</code> — contiene funciones relacionadas con la configuración del lienzo (<code>canvas</code>):
+
+  <ul>
+   <li><code>create()</code> — crea un lienzo (<code>canvas</code>) con un <code>width</code> y <code>height</code> especificados dentro de un contenedor <a href="/es/docs/Web/HTML/Element/div" title='El elemento ↑div↑ de HTML con ↑id="content"↓ es el contenedor genérico para el flujo de contenido. No tiene ningún efecto en el contenido o el diseño hasta que se le aplica estilo usando CSS.'><code>&lt;div&gt;</code></a> con un ID especificado, que a su vez se añade dentro de un elemento padre especificado. Devuelve un objeto que contiene el contexto 2D del lienzo y el ID del contenedor.</li>
+   <li><code>createReportList()</code> — crea una lista desordenada adjunta dentro de un elemento contenedor específico, que se puede usar para generar datos de informes. Devuelve el ID de la lista.</li>
+  </ul>
+ </li>
+ <li><code>square.js</code> — contiene:
+  <ul>
+   <li><code>name</code> — una constante que contiene la cadena 'square'.</li>
+   <li><code>draw()</code> — dibuja una figura cuadrada en un lienzo específico, con un tamaño, posición y color específicos. Devuelve un objeto que contiene el tamaño, la posición y el color del cuadrado.</li>
+   <li><code>reportArea()</code> — escribe el área de un cuadrado en una lista de informes específica, dada su longitud.</li>
+   <li><code>reportPerimeter()</code> — escribe el perímetro de un cuadrado en una lista de informes específica, dada su longitud.</li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Reflexión_—_.mjs_versus_.js">Reflexión — <code>.mjs</code> versus <code>.js</code></h2>
+
+<p>A través de este artículo, usaremos extensiones <code>.js</code> para nuestros archivos de módulo, pero en otros recursos, puedes ver que en su lugar se usa la extensión <code>.mjs</code>. <a href="https://v8.dev/features/modules#mjs">La documentación de V8 recomienda esto</a>, por ejemplo. Las razones dadas son:</p>
+
+<ul>
+ <li>Es bueno por claridad, es decir, deja claro qué archivos son módulos y cuáles JavaScript.</li>
+ <li>Asegura que tus archivos de módulo sean analizados como un módulo por los entornos de ejecución como <a href="https://nodejs.org/api/esm.html#esm_enabling">Node.js</a> y herramientas de compilación como <a href="https://babeljs.io/docs/en/options#sourcetype">Babel</a>.</li>
+</ul>
+
+<p>Sin embargo, decidimos seguir usando <code>.js</code>, al menos por el momento. Para que los módulos funcionen correctamente en un navegador, debes asegurarte de que tu servidor los esté sirviendo con un encabezado <code>Content-Type</code> que contenga un tipo MIME de JavaScript como <code>text/javascript</code>. Si no lo haces, obtendrás un estricto error de verificación de tipo MIME como "El servidor respondió con un tipo MIME que no es JavaScript" y el navegador no ejecutará tu JavaScript. La mayoría de los servidores ya configuran el tipo correcto para archivos <code>.js</code>, pero todavía no para archivos <code>.mjs</code>. Los servidores que ya sirven archivos <code>.mjs</code> incluyen <a href="https://pages.github.com/">GitHub Pages</a> y <code><a href="https://github.com/http-party/http-server#readme">http-server</a></code> para Node.js.</p>
+
+<p>Esto está bien si ya estás utilizando un entorno de este tipo, o si no, pero sabes lo que estás haciendo y tiene acceso (es decir, puedes configurar tu servidor para establecer el <code><a href="/es/docs/Web/HTTP/Headers/Content-Type">Content-Type</a></code> para archivos <code>.mjs</code>). Sin embargo, podría causar confusión si no controlas el servidor desde el que estás sirviendo archivos, o si estás publicando archivos para uso público, como lo hacemos aquí.</p>
+
+<p>Por motivos de aprendizaje y portabilidad, decidimos mantenernos en <code>.js</code>.</p>
+
+<p>Si realmente valoras la claridad de usar <code>.mjs</code> para módulos en lugar de usar <code>.js</code> para archivos JavaScript "normales", pero no quieres encontrarte con el problema descrito anteriormente, siempre puedes usar <code>.mjs</code> durante el desarrollo y convertirlos a <code>.js</code> durante tu paso de compilación.</p>
+
+<p>También vale la pena señalar que:</p>
+
+<ul>
+ <li>Es posible que algunas herramientas nunca admitan <code>.mjs</code>, tal como <a href="https://www.typescriptlang.org/">TypeScript</a>.</li>
+ <li>El atributo <code>&lt;script type="module"&gt;</code> se usa para indicar cuándo se está apuntando a un módulo, como verás a continuación.</li>
+</ul>
+
+<h2 id="Exportar_características_del_módulo">Exportar características del módulo</h2>
+
+<p>Lo primero que debes hacer para acceder a las funciones del módulo es exportarlas. Esto se hace usando la declaración {{jsxref("Statements/export", "export")}}.</p>
+
+<p>La forma más sencilla de utilizarla es colocarla delante de cualquier elemento que desees exportar fuera del módulo, por ejemplo:</p>
+
+<pre class="brush: js; notranslate">export const name = 'square';
+
+export function draw(ctx, length, x, y, color) {
+  ctx.fillStyle = color;
+  ctx.fillRect(x, y, length, length);
+
+  return {
+    length: length,
+    x: x,
+    y: y,
+    color: color
+  };
+}</pre>
+
+<p>Puedes exportar funciones, <code>var</code>, <code>let</code>, <code>const</code> y, como veremos más adelante — clases. Deben ser elementos de nivel superior; no puedes usar <code>export</code> dentro de una función, por ejemplo.</p>
+
+<p>Una forma más conveniente de exportar todos los elementos que deseas exportar es usar una sola declaración de exportación al final de tu archivo de módulo, seguida de una lista separada por comas de las características que deseas exportar entre llaves. Por ejemplo:</p>
+
+<pre class="brush: js; notranslate">export { name, draw, reportArea, reportPerimeter };</pre>
+
+<h2 id="Importación_de_características_en_tu_script">Importación de características en tu script</h2>
+
+<p>Una vez que hayas declarado las funciones y características que deseas exportar de tu módulo, debes importarlas en tu script para poder usarlas. La forma más sencilla de hacerlo es la siguiente:</p>
+
+<pre class="brush: js; notranslate">import { name, draw, reportArea, reportPerimeter } from './modules/square.js';</pre>
+
+<p>Utiliza la declaración {{jsxref("Statements/import", "import")}}, seguida de una lista separada por comas de las características que deseas importar entre llaves, seguida de la palabra clave <code>from</code>, seguida de la ruta al archivo del módulo — una ruta relativa a la raíz del sitio, que para nuestro ejemplo de <code>basic-modules</code> sería <code>/js-examples/modules/basic-modules</code>.</p>
+
+<p>Sin embargo, hemos escrito la ruta de manera un poco diferente — estamos usando la sintaxis de punto (<code>.</code>) para significar "la ubicación actual", seguida de la ruta más allá del archivo que estamos tratando de encontrar. Esto es mucho mejor que escribir la ruta relativa completa cada vez, ya que es más corta y hace que la URL sea portátil — el ejemplo seguirá funcionando si lo mueve a una ubicación diferente en la jerarquía del sitio.</p>
+
+<p>Así por ejemplo:</p>
+
+<pre class="notranslate">/js-examples/modules/basic-modules/modules/square.js</pre>
+
+<p>se convierte en</p>
+
+<pre class="notranslate">./modules/square.js</pre>
+
+<p>Puedes ver estas líneas en acción en <code><a href="https://github.com/mdn/js-examples/blob/master/modules/basic-modules/main.js">main.js</a></code>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: En algunos sistemas de módulos, puedes omitir la extensión del archivo y el punto (por ejemplo, <code>'/modules/square'</code>). Esto no funciona en módulos de JavaScript nativos.</p>
+</div>
+
+<p>Una vez que hayas importado las funciones a tu script, las puedes usar tal como se definieron dentro del mismo archivo. Lo siguiente se encuentra en <code>main.js</code>, debajo de las líneas <code>import</code>:</p>
+
+<pre class="brush: js; notranslate">let myCanvas = create('myCanvas', document.body, 480, 320);
+let reportList = createReportList(myCanvas.id);
+
+let square1 = draw(myCanvas.ctx, 50, 50, 100, 'blue');
+reportArea(square1.length, reportList);
+reportPerimeter(square1.length, reportList);
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Aunque las funciones importadas están disponibles en el archivo, son vistas de solo lectura de la función que se exportó. No puedes cambiar la variable que se importó, pero aún puedes modificar propiedades similares a <code>const</code>. Además, estas características se importan como enlaces activos, lo cual significa que pueden cambiar de valor incluso si no puedes modificar el enlace a diferencia de <code>const</code>.</p>
+</div>
+
+<h2 id="Aplicar_el_módulo_a_tu_HTML">Aplicar el módulo a tu HTML</h2>
+
+<p>Ahora solo necesitamos aplicar el módulo <code>main.js</code> a nuestra página HTML. Esto es muy similar a cómo aplicamos un script normal a una página, con algunas diferencias notables.</p>
+
+<p>En primer lugar, debes incluir <code>type="module"</code> en el elemento <a href="/es/docs/Web/HTML/Element/script" title="El elemento ↑&lt;script>↓ de HTML se utiliza para incrustar o hacer referencia al código ejecutable; esto se usa normalmente para incrustar o hacer referencia a código JavaScript."><code>&lt;script&gt;</code></a>, para declarar este script como un módulo. Para importar el script <code>main.js</code>, usamos esto:</p>
+
+<pre class="brush: html; no-line-numbers notranslate">&lt;script type="module" src="main.js"&gt;&lt;/script&gt;</pre>
+
+<p>También puedes incrustar el script del módulo directamente en el archivo HTML colocando el código JavaScript dentro del cuerpo del elemento <code>&lt;script&gt;</code>:</p>
+
+<pre class="brush: js notranslate">&lt;script type="module"&gt;
+  /* El código del módulo JavaScript va aquí */
+&lt;/script&gt;</pre>
+
+<p>El script en el que importas las características del módulo básicamente actúa como el módulo de nivel superior. Si lo omite, Firefox, por ejemplo, te da un error de "SyntaxError: Las declaraciones import solo pueden aparecer en el nivel superior de un módulo".</p>
+
+<p>Solo puede usar instrucciones <code>import</code> y <code>export</code> dentro de los módulos, no en scripts normales.</p>
+
+<h2 id="Otras_diferencias_entre_módulos_y_scripts_estándar">Otras diferencias entre módulos y scripts estándar</h2>
+
+<ul>
+ <li>Debes prestar atención a las pruebas locales — si intentas cargar el archivo HTML localmente (es decir, con una URL <code>file:///</code>), te encontrarás con errores de CORS debido a los requisitos de seguridad del módulo JavaScript. Necesitas hacer tus pruebas a través de un servidor.</li>
+ <li>Además, ten en cuenta que puedes obtener un comportamiento diferente de las secciones del script definidas dentro de los módulos en comparación con los scripts estándar. Esto se debe a que los módulos automáticamente usan {{jsxref("Strict_mode", "strict mode", "", 1)}}.</li>
+ <li>No es necesario utilizar el atributo <code>defer</code> (ve <a href="/es/docs/Web/HTML/Element/script#Attributes" title="El elemento ↑&lt;script>↓ de HTML se utiliza para incrustar o hacer referencia al código ejecutable; esto se usa normalmente para incrustar o hacer referencia a código JavaScript."> atributos de <code>&lt;script&gt;</code></a>) al cargar un script de módulo; los módulos se difieren automáticamente.</li>
+ <li>Los módulos solo se ejecutan una vez, incluso si se les ha hecho referencia en varias etiquetas <code>&lt;script&gt;</code>.</li>
+ <li>Por último, pero no menos importante, dejemos esto en claro — las características del módulo se importan al alcance de un solo script — no están disponibles en el alcance global. Por lo tanto, solo podrás acceder a las funciones importadas en el script en el que se importan y no podrás acceder a ellas desde la consola de JavaScript, por ejemplo. Seguirás recibiendo errores de sintaxis en DevTools, pero no podrás utilizar algunas de las técnicas de depuración que esperabas utilizar.</li>
+</ul>
+
+<h2 id="Exportaciones_predeterminadas_vs._exportaciones_con_nombre">Exportaciones predeterminadas vs. exportaciones con nombre</h2>
+
+<p>La funcionalidad que hemos exportado hasta ahora se compone de <strong>exportaciones con nombre</strong> — cada elemento (ya sea una función, <code>const</code>, etc.) se ha denominado por su nombre en <code>export</code>, y ese nombre también se ha utilizado para referirse a él en <code>import</code>.</p>
+
+<p>También hay un tipo de exportación llamado <strong>exportación predeterminada</strong> — está diseñado para facilitar que un módulo proporcione una función predeterminada, y también ayuda a los módulos JavaScript a interoperar con los sistemas de módulos CommonJS y AMD existentes (como se explica muy bien en <a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 en profundidad: módulos</a> de Jason Orendorff; busca "Exportaciones predeterminadas").</p>
+
+<p>Veamos un ejemplo mientras explicamos cómo funciona. En nuestros ↑basic-modules↓ <code>square.js</code> puedes encontrar una función llamada <code>randomSquare()</code> que crea un cuadrado con un color, tamaño y posición aleatorios. Lo queremos exportar como nuestro predeterminado, por lo que en la parte inferior del archivo escribimos esto:</p>
+
+<pre class="brush: js; notranslate">export default randomSquare;</pre>
+
+<p>Ten en cuenta la falta de llaves.</p>
+
+<p>En su lugar, podríamos anteponer <code>export default</code> a la función y definirla como una función anónima, así:</p>
+
+<pre class="brush: js; notranslate">export default function(ctx) {
+  ...
+}</pre>
+
+<p>En nuestro archivo <code>main.js</code>, importamos la función predeterminada usando esta línea:</p>
+
+<pre class="brush: js; notranslate">import randomSquare from './modules/square.js';</pre>
+
+<p>Una vez más, ten en cuenta la falta de llaves. Esto se debe a que solo se permite una exportación predeterminada por módulo, y sabemos que <code>randomSquare</code> lo es. La línea anterior es básicamente una abreviatura de:</p>
+
+<pre class="brush: js; notranslate">import {default as randomSquare} from './modules/square.js';</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: La sintaxis as para cambiar el nombre de los elementos exportados se explica a continuación en la sección <a href="#Renombrar_impotaciones_y_exportaciones">Renombrar importaciones y exportaciones</a>.</p>
+</div>
+
+<h2 id="Evitar_conflictos_de_nombres">Evitar conflictos de nombres</h2>
+
+<p>Hasta ahora, nuestros módulos de dibujo de formas en el lienzo parecen estar funcionando bien. Pero, ¿qué pasa si intentamos agregar un módulo que se ocupa de dibujar otra forma, como un círculo o un triángulo? Estas formas probablemente también tendrían funciones asociadas como <code>draw()</code>, <code>reportArea()</code>, etc.; si intentáramos importar diferentes funciones del mismo nombre en el mismo archivo de módulo de nivel superior, terminaríamos con conflictos y errores.</p>
+
+<p>Afortunadamente, hay varias formas de evitar esto. Los veremos en las siguientes secciones.</p>
+
+<h2 id="Renombrar_importaciones_y_exportaciones">Renombrar importaciones y exportaciones</h2>
+
+<p>Dentro de las llaves de tu instrucciones <code>import</code> y <code>export</code>, puedes usar la palabra clave <code>as</code> junto con un nuevo nombre de función, para cambiar el nombre de identificación que utilizará una función dentro del módulo de nivel superior.</p>
+
+<p>Entonces, por ejemplo, ambos de los siguientes harían el mismo trabajo, aunque de una manera ligeramente diferente:</p>
+
+<pre class="brush: js; notranslate">// dentro de module.js
+export {
+  function1 as newFunctionName,
+  function2 as anotherNewFunctionName
+};
+
+// dentro de main.js
+import {newFunctionName, anotherNewFunctionName} from './modules/module.js';</pre>
+
+<pre class="brush: js; notranslate">// dentro de module.js
+export {function1, function2};
+
+// dentro de main.js
+import {function1 as newFunctionName,
+         function2 as anotherNewFunctionName } from './modules/module.js';</pre>
+
+<p>Veamos un ejemplo real. En nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/renaming">renaming</a>, verás el mismo sistema de módulos que en el ejemplo anterior, excepto que hemos agregado los módulos <code>circle.js</code> y <code>triangle.js</code> para dibujar e informar sobre círculos y triángulos.</p>
+
+<p>Dentro de cada uno de estos módulos, tenemos características con los mismos nombres que se exportan y, por lo tanto, cada una tiene la misma instrucción <code>export</code> en la parte inferior:</p>
+
+<pre class="brush: js; notranslate">export { name, draw, reportArea, reportPerimeter };</pre>
+
+<p>Al importarlos a <code>main.js</code>, si intentamos usar esto:</p>
+
+<pre class="brush: js; notranslate">import { name, draw, reportArea, reportPerimeter } from './modules/square.js';
+import { name, draw, reportArea, reportPerimeter } from './modules/circle.js';
+import { name, draw, reportArea, reportPerimeter } from './modules/triangle.js';</pre>
+
+<p>El navegador arrojará un error como "SyntaxError: redeclaración de nombre import" (Firefox).</p>
+
+<p>En su lugar, necesitamos cambiar el nombre de las importaciones para que sean únicas:</p>
+
+<pre class="brush: js; notranslate">import { name as squareName,
+         draw as drawSquare,
+         reportArea as reportSquareArea,
+         reportPerimeter as reportSquarePerimeter } from './modules/square.js';
+
+import { name as circleName,
+         draw as drawCircle,
+         reportArea as reportCircleArea,
+         reportPerimeter as reportCirclePerimeter } from './modules/circle.js';
+
+import { name as triangleName,
+        draw as drawTriangle,
+        reportArea as reportTriangleArea,
+        reportPerimeter as reportTrianglePerimeter } from './modules/triangle.js';</pre>
+
+<p>Ten en cuenta que podrías resolver el problema en los archivos del módulo, p. ej.</p>
+
+<pre class="brush: js; notranslate">// en square.js
+export {name as squareName,
+         draw as drawSquare,
+         reportArea as reportSquareArea,
+         reportPerimeter as reportSquarePerimeter };</pre>
+
+<pre class="brush: js; notranslate">// en main.js
+import {squareName, drawSquare, reportSquareArea, reportSquarePerimeter} from './modules/square.js';</pre>
+
+<p>Y funcionaría igual. El estilo que uses depende de ti, sin embargo, podría decirse que tiene más sentido dejar el código de tu módulo tal cual y realizar los cambios en las importaciones. Esto tiene sentido especialmente cuando estás importando desde módulos de terceros sobre los que no tienes ningún control.</p>
+
+<h2 id="Crear_un_objeto_module">Crear un objeto <code>module</code></h2>
+
+<p>El método anterior funciona bien, pero es un poco complicado y largo. Una solución aún mejor es importar las características de cada módulo dentro de un objeto <code>module</code>. La siguiente forma de sintaxis hace eso:</p>
+
+<pre class="brush: js; notranslate">import * as Module from './modules/module.js';</pre>
+
+<p>Esto toma todas las exportaciones disponibles dentro de <code>module.js</code> y las hace disponibles como miembros de un objeto <code>Module</code>, dándole efectivamente su propio espacio de nombres. Así por ejemplo:</p>
+
+<pre class="brush: js; notranslate">Module.function1()
+Module.function2()
+etc.</pre>
+
+<p>De nuevo, veamos un ejemplo real. Si vas a nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/module-objects">module-objects</a>, verás el mismo ejemplo nuevamente, pero reescrito para aprovechar esta nueva sintaxis. En los módulos, las exportaciones están todas en la siguiente forma simple:</p>
+
+<pre class="brush: js; notranslate">export { name, draw, reportArea, reportPerimeter };</pre>
+
+<p>Las importaciones, por otro lado, se ven así:</p>
+
+<pre class="brush: js; notranslate">import * as Canvas from './modules/canvas.js';
+
+import * as Square from './modules/square.js';
+import * as Circle from './modules/circle.js';
+import * as Triangle from './modules/triangle.js';</pre>
+
+<p>En cada caso, ahora puedes acceder a las importaciones del módulo debajo del nombre del objeto especificado, por ejemplo:</p>
+
+<pre class="brush: js; notranslate">let square1 = Square.draw(myCanvas.ctx, 50, 50, 100, 'blue');
+Square.reportArea(square1.length, reportList);
+Square.reportPerimeter(square1.length, reportList);</pre>
+
+<p>Por lo tanto, ahora puedes escribir el código de la misma manera que antes (siempre que incluyas los nombres de los objetos donde sea necesario), y las importaciones son mucho más ordenadas.</p>
+
+<h2 id="Módulos_y_clases">Módulos y clases</h2>
+
+<p>Como dijimos antes, también puedes exportar e importar clases; esta es otra opción para evitar conflictos en tu código, y especialmente es útil si ya tienes el código de tu módulo escrito en un estilo orientado a objetos.</p>
+
+<p>Puedes ver un ejemplo de nuestro módulo de dibujo de formas reescrito con clases ES en nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/classes">classes</a>. Como ejemplo, el archivo <code><a href="https://github.com/mdn/js-examples/blob/master/modules/classes/modules/square.js">square.js</a></code> ahora contiene toda su funcionalidad en una sola clase:</p>
+
+<pre class="brush: js; notranslate">class Square {
+  constructor(ctx, listId, length, x, y, color) {
+    ...
+  }
+
+  draw() {
+    ...
+  }
+
+  ...
+}</pre>
+
+<p>que luego exportamos:</p>
+
+<pre class="brush: js; notranslate">export { Square };</pre>
+
+<p>En <code><a href="https://github.com/mdn/js-examples/blob/master/modules/classes/main.js">main.js</a></code>, lo importamos así:</p>
+
+<pre class="brush: js; notranslate">import { Square } from './modules/square.js';</pre>
+
+<p>Y luego usas la clase para dibujar nuestro cuadrado:</p>
+
+<pre class="brush: js; notranslate">let square1 = new Square(myCanvas.ctx, myCanvas.listId, 50, 50, 100, 'blue');
+square1.draw();
+square1.reportArea();
+square1.reportPerimeter();</pre>
+
+<h2 id="Carga_estática_de_módulos">Carga estática de módulos</h2>
+
+<p>Habrá ocasiones en las que querrás agregar módulos juntos. Es posible que tengas varios niveles de dependencias, donde desees simplificar las cosas, combinando varios submódulos en un módulo principal. Esto es posible utilizando la sintaxis de exportación de los siguientes formas en el módulo principal:</p>
+
+<pre class="brush: js; notranslate">export * from 'x.js'
+export { name } from 'x.js'</pre>
+
+<p>Para ver un ejemplo, ve nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/module-aggregation">module-aggregation</a>. En este ejemplo (basado en nuestro ejemplo de clases anterior) tenemos un módulo adicional llamado <code>shapes.js</code>, que reúne toda la funcionalidad de <code>circle.js</code>, <code>square.js</code> y <code>triangle.js</code>. También hemos movido nuestros submódulos dentro de un subdirectorio dentro del directorio <code>modules</code> llamado <code>shapes</code>. Entonces, la estructura del módulo en este ejemplo es:</p>
+
+<pre class="notranslate">modules/
+  canvas.js
+  shapes.js
+  shapes/
+    circle.js
+    square.js
+    triangle.js</pre>
+
+<p>En cada uno de los submódulos, la exportación es de la misma forma, p. ej.</p>
+
+<pre class="brush: js; notranslate">export { Square };</pre>
+
+<p>Luego viene la parte de agregación. Dentro de <code><a href="https://github.com/mdn/js-examples/blob/master/modules/module-aggregation/modules/shapes.js">shapes.js</a></code>, incluimos las siguientes líneas:</p>
+
+<pre class="brush: js; notranslate">export { Square } from './shapes/square.js';
+export { Triangle } from './shapes/triangle.js';
+export { Circle } from './shapes/circle.js';</pre>
+
+<p>Estas toman las exportaciones de los submódulos individuales y las ponen a disposición de manera efectiva desde el módulo <code>shapes.js</code>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Las exportaciones a las que se hace referencia en <code>shapes.js</code> básicamente se redirigen a través del archivo y realmente no existen allí, por lo que no podrás escribir ningún código relacionado útil dentro del mismo archivo.</p>
+</div>
+
+<p>Entonces, ahora en el archivo <code>main.js</code>, podemos obtener acceso a las tres clases de módulos reemplazando</p>
+
+<pre class="brush: js; notranslate">import { Square } from './modules/square.js';
+import { Circle } from './modules/circle.js';
+import { Triangle } from './modules/triangle.js';</pre>
+
+<p>con la siguiente única línea:</p>
+
+<pre class="brush: js; notranslate">import { Square, Circle, Triangle } from './modules/shapes.js';</pre>
+
+<h2 id="Carga_dinámica_de_módulos">Carga dinámica de módulos</h2>
+
+<p>La parte más nueva de la funcionalidad de los módulos de JavaScript que estará disponible en los navegadores es la carga dinámica de módulos. Esto te permite cargar módulos dinámicamente solo cuando son necesarios, en lugar de tener que cargar todo por adelantado. Esto tiene algunas obvias ventajas de rendimiento; sigue leyendo y veamos cómo funciona.</p>
+
+<p>Esta nueva funcionalidad te permite llamar a {{jsxref("Statements/import", "import()", "#Importaciones_Dinámicas")}} como una función, pasándole la ruta al módulo como parámetro. Devuelve una {{jsxref("Promise")}}, que se cumple con un objeto <code>module</code> (consulta <a href="#Crear_un_objeto_module">Crear un objeto <code>module</code></a>) que te da acceso a las exportaciones de ese objeto, p. ej.</p>
+
+<pre class="brush: js; notranslate">import('./modules/myModule.js')
+  .then((module) =&gt; {
+    // Haz algo con el módulo.
+  });</pre>
+
+<p>Veamos un ejemplo. En el directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/dynamic-module-imports">dynamic-module-import</a> tenemos otro ejemplo basado en nuestro ejemplo de clases. Esta vez, sin embargo, no dibujamos nada en el lienzo cuando se carga el ejemplo. En su lugar, incluimos tres botones — "Círculo", "Cuadrado" y "Triángulo" — que, cuando se presionan, cargan dinámicamente el módulo requerido y luego lo usan para dibujar la forma asociada.</p>
+
+<p>En este ejemplo, solo hemos realizado cambios en nuestros archivos <code><a href="https://github.com/mdn/js-examples/blob/master/modules/dynamic-module-imports/index.html">index.html</a></code> y <code><a href="https://github.com/mdn/js-examples/blob/master/modules/dynamic-module-imports/main.mjs">main.js</a></code> — el módulo <code>exports</code> sigue siendo el mismo que antes.</p>
+
+<p>En <code>main.js</code> hemos tomado una referencia a cada botón usando una llamada a <a href="/es/docs/Web/API/Document/querySelector"><code>Document.querySelector()</code></a>, por ejemplo:</p>
+
+<pre class="brush: js; notranslate">let squareBtn = document.querySelector('.square');</pre>
+
+<p>Luego adjuntamos un escucha de eventos a cada botón para que cuando se presione, el módulo relevante se cargue dinámicamente y se use para dibujar la forma:</p>
+
+<pre class="brush: js; notranslate">squareBtn.addEventListener('click', () =&gt; {
+  import('./modules/square.js').then((Module) =&gt; {
+    let square1 = new Module.Square(myCanvas.ctx, myCanvas.listId, 50, 50, 100, 'blue');
+    square1.draw();
+    square1.reportArea();
+    square1.reportPerimeter();
+  })
+});</pre>
+
+<p>Ten en cuenta que, debido a que el cumplimiento de la promesa devuelve un objeto <code>module</code>, la clase se convierte en una subfunción del objeto, por lo que ahora necesitamos acceder al constructor prefijado con <code>Module.</code>, p. ej. <code>Module.Square(...)</code>.</p>
+
+<h2 id="Solución_de_problemas">Solución de problemas</h2>
+
+<p>Aquí hay algunos consejos que te pueden ayudar si tienes problemas para hacer que tus módulos funcionen. ¡No dude en agregarlos a la lista si descubres más!</p>
+
+<ul>
+ <li>Mencionamos esto antes, pero para reiterar: los archivos <code>.js</code> se deben cargar con un tipo MIME de <code>text/javascript</code> (u otro tipo MIME compatible con JavaScript, pero se recomienda <code>text/javascript</code>), de lo contrario, obtendrás un error de comprobación de tipo MIME estricto como "El servidor respondió con un tipo MIME no JavaScript".</li>
+ <li>Si intentas cargar el archivo HTML localmente (es decir, con una URL <code>file:///</code>), encontrarás errores CORS debido a los requisitos de seguridad del módulo JavaScript. Necesitas hacer tus pruebas a través de un servidor. Las páginas de GitHub son ideales ya que también sirven archivos <code>.js</code> con el tipo MIME correcto.</li>
+ <li>Debido a que <code>.mjs</code> es una extensión de archivo no estándar, es posible que algunos sistemas operativos no la reconozcan o intenten reemplazarla por otra. Por ejemplo, descubrimos que macOS silenciosamente agregaba <code>.js</code> al final de los archivos <code>.mjs</code> y luego, automáticamente ocultaba la extensión del archivo. Entonces, todos nuestros archivos salían realmente como <code>x.mjs.js</code>. Una vez que desactivamos la acción de ocultar automáticamente las extensiones de archivo y lo entrenamos para aceptar <code>.mjs</code>, todo estuvo bien.</li>
+</ul>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="https://developers.google.com/web/fundamentals/primers/modules#mjs">Uso de módulos JavaScript en la web</a>, por Addy Osmani y Mathias Bynens</li>
+ <li><a href="https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/">Módulos ES: un análisis profundo de dibujos animados</a>, publicación en el blog Hacks de Lin Clark</li>
+ <li><a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 en profundidad: Módulos</a>, publicación en el blog Hacks de Jason Orendorff</li>
+ <li>Libro de Axel Rauschmayer <a href="http://exploringjs.com/es6/ch_modules.html">Explorando JS: Módulos</a></li>
+</ul>
+
+<p>{{Previous("Web/JavaScript/Guide/Meta_programming")}}</p>
diff --git a/files/es/web/javascript/guide/módulos/index.html b/files/es/web/javascript/guide/módulos/index.html
deleted file mode 100644
index eacc6835f6..0000000000
--- a/files/es/web/javascript/guide/módulos/index.html
+++ /dev/null
@@ -1,458 +0,0 @@
----
-title: Módulos JavaScript
-slug: Web/JavaScript/Guide/Módulos
-tags:
-  - Guía
-  - JavaScript
-  - Modules
-  - Módulos
-  - export
-  - import
-translation_of: Web/JavaScript/Guide/Modules
----
-<div>{{JSSidebar("Guía de JavaScript")}}{{Previous("Web/JavaScript/Guide/Meta_programming")}}</div>
-
-<p>Esta guía te brinda todo lo que necesitas para comenzar con la sintaxis de los módulos JavaScript.</p>
-
-<h2 id="Un_antecedente_sobre_módulos">Un antecedente sobre módulos</h2>
-
-<p>Los programas JavaScript comenzaron siendo bastante pequeños — la mayor parte de su uso en los primeros días era para realizar tareas de scripting aisladas, proporcionando un poco de interactividad a tus páginas web donde fuera necesario, por lo que generalmente no se necesitaban grandes scripts. Avancemos unos años y ahora tenemos aplicaciones completas que se ejecutan en navegadores con mucho JavaScript, JavaScript ahora se usa en otros contextos (<a href="/es/docs/Glossary/Node.js">Node.js</a>, por ejemplo).</p>
-
-<p>Por lo tanto, en los últimos años se ha comenzado a pensar en proporcionar mecanismos para dividir programas JavaScript en módulos separados que se puedan importar cuando sea necesario. Node.js ha tenido esta capacidad durante mucho tiempo, y hay una serie de bibliotecas y marcos de JavaScript que permiten el uso de módulos (por ejemplo, <a href="https://en.wikipedia.org/wiki/CommonJS">CommonJS</a> y <a href="https://github.com/amdjs/amdjs-api/blob/master/AMD.md">AMD</a> otros basados en sistemas de módulos como <a href="https://requirejs.org/">RequireJS</a>, y recientemente <a href="https://webpack.github.io/">Webpack</a> y <a href="https://babeljs.io/">Babel</a>).</p>
-
-<p>La buena noticia es que los navegadores modernos han comenzado a admitir la funcionalidad de los módulos de forma nativa, y de esto se trata este artículo. Esto solo puede ser algo bueno — los navegadores pueden optimizar la carga de módulos, haciéndolo más eficiente que tener que usar una biblioteca y hacer todo ese procesamiento adicional de lado del cliente, ahorrando viajes de ida y vuelta adicionales.</p>
-
-<h2 id="Soporte_del_navegador">Soporte del navegador</h2>
-
-<p>El uso de módulos JavaScript nativos depende de las declaraciones {{jsxref("Statements/import", "import")}} y {{jsxref("Statements/export", "export")}}; estas son compatibles con los navegadores de la siguiente manera:</p>
-
-<h3 id="import">import</h3>
-
-<p>{{Compat("javascript.statements.import")}}</p>
-
-<h3 id="export">export</h3>
-
-<p>{{Compat("javascript.statements.export")}}</p>
-
-<h2 id="Introducción_—_un_ejemplo">Introducción — un ejemplo</h2>
-
-<p>Para demostrar el uso de módulos, hemos creado un <a href="https://github.com/mdn/js-examples/tree/master/modules">sencillo conjunto de ejemplos</a> que puedes encontrar en GitHub. Estos ejemplos demuestran un sencillo conjunto de módulos que crean un elemento <a href="/es/docs/Web/HTML/Element/canvas" title="Usa el elemento ↑&lt;canvas>↓ de HTML con el scripting de la API de canvas o la API WebGL para dibujar gráficos y animaciones."><code>&lt;canvas&gt;</code></a> en una página web, y luego dibujan (y reportan información sobre) diferentes formas en el lienzo.</p>
-
-<p>Estos son bastante triviales, pero se han mantenido deliberadamente simples para demostrar los módulos con claridad.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Si deseas descargar los ejemplos y ejecutarlos localmente, deberás ejecutarlos a través de un servidor web local.</p>
-</div>
-
-<h2 id="Estructura_básica_de_los_ejemplos">Estructura básica de los ejemplos</h2>
-
-<p>En nuestro primer ejemplo (ve <a href="https://github.com/mdn/js-examples/tree/master/modules/basic-modules">basic-modules</a>) tenemos la siguiente estructura de archivos:</p>
-
-<pre class="notranslate">index.html
-main.js
-modules/
-    canvas.js
-    square.js</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Todos los ejemplos de esta guía básicamente tienen la misma estructura; lo anterior debería empezar a resultarte bastante familiar.</p>
-</div>
-
-<p>Los dos módulos del directorio <code>modules</code> se describen a continuación:</p>
-
-<ul>
- <li><code>canvas.js</code> — contiene funciones relacionadas con la configuración del lienzo (<code>canvas</code>):
-
-  <ul>
-   <li><code>create()</code> — crea un lienzo (<code>canvas</code>) con un <code>width</code> y <code>height</code> especificados dentro de un contenedor <a href="/es/docs/Web/HTML/Element/div" title='El elemento ↑div↑ de HTML con ↑id="content"↓ es el contenedor genérico para el flujo de contenido. No tiene ningún efecto en el contenido o el diseño hasta que se le aplica estilo usando CSS.'><code>&lt;div&gt;</code></a> con un ID especificado, que a su vez se añade dentro de un elemento padre especificado. Devuelve un objeto que contiene el contexto 2D del lienzo y el ID del contenedor.</li>
-   <li><code>createReportList()</code> — crea una lista desordenada adjunta dentro de un elemento contenedor específico, que se puede usar para generar datos de informes. Devuelve el ID de la lista.</li>
-  </ul>
- </li>
- <li><code>square.js</code> — contiene:
-  <ul>
-   <li><code>name</code> — una constante que contiene la cadena 'square'.</li>
-   <li><code>draw()</code> — dibuja una figura cuadrada en un lienzo específico, con un tamaño, posición y color específicos. Devuelve un objeto que contiene el tamaño, la posición y el color del cuadrado.</li>
-   <li><code>reportArea()</code> — escribe el área de un cuadrado en una lista de informes específica, dada su longitud.</li>
-   <li><code>reportPerimeter()</code> — escribe el perímetro de un cuadrado en una lista de informes específica, dada su longitud.</li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Reflexión_—_.mjs_versus_.js">Reflexión — <code>.mjs</code> versus <code>.js</code></h2>
-
-<p>A través de este artículo, usaremos extensiones <code>.js</code> para nuestros archivos de módulo, pero en otros recursos, puedes ver que en su lugar se usa la extensión <code>.mjs</code>. <a href="https://v8.dev/features/modules#mjs">La documentación de V8 recomienda esto</a>, por ejemplo. Las razones dadas son:</p>
-
-<ul>
- <li>Es bueno por claridad, es decir, deja claro qué archivos son módulos y cuáles JavaScript.</li>
- <li>Asegura que tus archivos de módulo sean analizados como un módulo por los entornos de ejecución como <a href="https://nodejs.org/api/esm.html#esm_enabling">Node.js</a> y herramientas de compilación como <a href="https://babeljs.io/docs/en/options#sourcetype">Babel</a>.</li>
-</ul>
-
-<p>Sin embargo, decidimos seguir usando <code>.js</code>, al menos por el momento. Para que los módulos funcionen correctamente en un navegador, debes asegurarte de que tu servidor los esté sirviendo con un encabezado <code>Content-Type</code> que contenga un tipo MIME de JavaScript como <code>text/javascript</code>. Si no lo haces, obtendrás un estricto error de verificación de tipo MIME como "El servidor respondió con un tipo MIME que no es JavaScript" y el navegador no ejecutará tu JavaScript. La mayoría de los servidores ya configuran el tipo correcto para archivos <code>.js</code>, pero todavía no para archivos <code>.mjs</code>. Los servidores que ya sirven archivos <code>.mjs</code> incluyen <a href="https://pages.github.com/">GitHub Pages</a> y <code><a href="https://github.com/http-party/http-server#readme">http-server</a></code> para Node.js.</p>
-
-<p>Esto está bien si ya estás utilizando un entorno de este tipo, o si no, pero sabes lo que estás haciendo y tiene acceso (es decir, puedes configurar tu servidor para establecer el <code><a href="/es/docs/Web/HTTP/Headers/Content-Type">Content-Type</a></code> para archivos <code>.mjs</code>). Sin embargo, podría causar confusión si no controlas el servidor desde el que estás sirviendo archivos, o si estás publicando archivos para uso público, como lo hacemos aquí.</p>
-
-<p>Por motivos de aprendizaje y portabilidad, decidimos mantenernos en <code>.js</code>.</p>
-
-<p>Si realmente valoras la claridad de usar <code>.mjs</code> para módulos en lugar de usar <code>.js</code> para archivos JavaScript "normales", pero no quieres encontrarte con el problema descrito anteriormente, siempre puedes usar <code>.mjs</code> durante el desarrollo y convertirlos a <code>.js</code> durante tu paso de compilación.</p>
-
-<p>También vale la pena señalar que:</p>
-
-<ul>
- <li>Es posible que algunas herramientas nunca admitan <code>.mjs</code>, tal como <a href="https://www.typescriptlang.org/">TypeScript</a>.</li>
- <li>El atributo <code>&lt;script type="module"&gt;</code> se usa para indicar cuándo se está apuntando a un módulo, como verás a continuación.</li>
-</ul>
-
-<h2 id="Exportar_características_del_módulo">Exportar características del módulo</h2>
-
-<p>Lo primero que debes hacer para acceder a las funciones del módulo es exportarlas. Esto se hace usando la declaración {{jsxref("Statements/export", "export")}}.</p>
-
-<p>La forma más sencilla de utilizarla es colocarla delante de cualquier elemento que desees exportar fuera del módulo, por ejemplo:</p>
-
-<pre class="brush: js; notranslate">export const name = 'square';
-
-export function draw(ctx, length, x, y, color) {
-  ctx.fillStyle = color;
-  ctx.fillRect(x, y, length, length);
-
-  return {
-    length: length,
-    x: x,
-    y: y,
-    color: color
-  };
-}</pre>
-
-<p>Puedes exportar funciones, <code>var</code>, <code>let</code>, <code>const</code> y, como veremos más adelante — clases. Deben ser elementos de nivel superior; no puedes usar <code>export</code> dentro de una función, por ejemplo.</p>
-
-<p>Una forma más conveniente de exportar todos los elementos que deseas exportar es usar una sola declaración de exportación al final de tu archivo de módulo, seguida de una lista separada por comas de las características que deseas exportar entre llaves. Por ejemplo:</p>
-
-<pre class="brush: js; notranslate">export { name, draw, reportArea, reportPerimeter };</pre>
-
-<h2 id="Importación_de_características_en_tu_script">Importación de características en tu script</h2>
-
-<p>Una vez que hayas declarado las funciones y características que deseas exportar de tu módulo, debes importarlas en tu script para poder usarlas. La forma más sencilla de hacerlo es la siguiente:</p>
-
-<pre class="brush: js; notranslate">import { name, draw, reportArea, reportPerimeter } from './modules/square.js';</pre>
-
-<p>Utiliza la declaración {{jsxref("Statements/import", "import")}}, seguida de una lista separada por comas de las características que deseas importar entre llaves, seguida de la palabra clave <code>from</code>, seguida de la ruta al archivo del módulo — una ruta relativa a la raíz del sitio, que para nuestro ejemplo de <code>basic-modules</code> sería <code>/js-examples/modules/basic-modules</code>.</p>
-
-<p>Sin embargo, hemos escrito la ruta de manera un poco diferente — estamos usando la sintaxis de punto (<code>.</code>) para significar "la ubicación actual", seguida de la ruta más allá del archivo que estamos tratando de encontrar. Esto es mucho mejor que escribir la ruta relativa completa cada vez, ya que es más corta y hace que la URL sea portátil — el ejemplo seguirá funcionando si lo mueve a una ubicación diferente en la jerarquía del sitio.</p>
-
-<p>Así por ejemplo:</p>
-
-<pre class="notranslate">/js-examples/modules/basic-modules/modules/square.js</pre>
-
-<p>se convierte en</p>
-
-<pre class="notranslate">./modules/square.js</pre>
-
-<p>Puedes ver estas líneas en acción en <code><a href="https://github.com/mdn/js-examples/blob/master/modules/basic-modules/main.js">main.js</a></code>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: En algunos sistemas de módulos, puedes omitir la extensión del archivo y el punto (por ejemplo, <code>'/modules/square'</code>). Esto no funciona en módulos de JavaScript nativos.</p>
-</div>
-
-<p>Una vez que hayas importado las funciones a tu script, las puedes usar tal como se definieron dentro del mismo archivo. Lo siguiente se encuentra en <code>main.js</code>, debajo de las líneas <code>import</code>:</p>
-
-<pre class="brush: js; notranslate">let myCanvas = create('myCanvas', document.body, 480, 320);
-let reportList = createReportList(myCanvas.id);
-
-let square1 = draw(myCanvas.ctx, 50, 50, 100, 'blue');
-reportArea(square1.length, reportList);
-reportPerimeter(square1.length, reportList);
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Aunque las funciones importadas están disponibles en el archivo, son vistas de solo lectura de la función que se exportó. No puedes cambiar la variable que se importó, pero aún puedes modificar propiedades similares a <code>const</code>. Además, estas características se importan como enlaces activos, lo cual significa que pueden cambiar de valor incluso si no puedes modificar el enlace a diferencia de <code>const</code>.</p>
-</div>
-
-<h2 id="Aplicar_el_módulo_a_tu_HTML">Aplicar el módulo a tu HTML</h2>
-
-<p>Ahora solo necesitamos aplicar el módulo <code>main.js</code> a nuestra página HTML. Esto es muy similar a cómo aplicamos un script normal a una página, con algunas diferencias notables.</p>
-
-<p>En primer lugar, debes incluir <code>type="module"</code> en el elemento <a href="/es/docs/Web/HTML/Element/script" title="El elemento ↑&lt;script>↓ de HTML se utiliza para incrustar o hacer referencia al código ejecutable; esto se usa normalmente para incrustar o hacer referencia a código JavaScript."><code>&lt;script&gt;</code></a>, para declarar este script como un módulo. Para importar el script <code>main.js</code>, usamos esto:</p>
-
-<pre class="brush: html; no-line-numbers notranslate">&lt;script type="module" src="main.js"&gt;&lt;/script&gt;</pre>
-
-<p>También puedes incrustar el script del módulo directamente en el archivo HTML colocando el código JavaScript dentro del cuerpo del elemento <code>&lt;script&gt;</code>:</p>
-
-<pre class="brush: js notranslate">&lt;script type="module"&gt;
-  /* El código del módulo JavaScript va aquí */
-&lt;/script&gt;</pre>
-
-<p>El script en el que importas las características del módulo básicamente actúa como el módulo de nivel superior. Si lo omite, Firefox, por ejemplo, te da un error de "SyntaxError: Las declaraciones import solo pueden aparecer en el nivel superior de un módulo".</p>
-
-<p>Solo puede usar instrucciones <code>import</code> y <code>export</code> dentro de los módulos, no en scripts normales.</p>
-
-<h2 id="Otras_diferencias_entre_módulos_y_scripts_estándar">Otras diferencias entre módulos y scripts estándar</h2>
-
-<ul>
- <li>Debes prestar atención a las pruebas locales — si intentas cargar el archivo HTML localmente (es decir, con una URL <code>file:///</code>), te encontrarás con errores de CORS debido a los requisitos de seguridad del módulo JavaScript. Necesitas hacer tus pruebas a través de un servidor.</li>
- <li>Además, ten en cuenta que puedes obtener un comportamiento diferente de las secciones del script definidas dentro de los módulos en comparación con los scripts estándar. Esto se debe a que los módulos automáticamente usan {{jsxref("Strict_mode", "strict mode", "", 1)}}.</li>
- <li>No es necesario utilizar el atributo <code>defer</code> (ve <a href="/es/docs/Web/HTML/Element/script#Attributes" title="El elemento ↑&lt;script>↓ de HTML se utiliza para incrustar o hacer referencia al código ejecutable; esto se usa normalmente para incrustar o hacer referencia a código JavaScript."> atributos de <code>&lt;script&gt;</code></a>) al cargar un script de módulo; los módulos se difieren automáticamente.</li>
- <li>Los módulos solo se ejecutan una vez, incluso si se les ha hecho referencia en varias etiquetas <code>&lt;script&gt;</code>.</li>
- <li>Por último, pero no menos importante, dejemos esto en claro — las características del módulo se importan al alcance de un solo script — no están disponibles en el alcance global. Por lo tanto, solo podrás acceder a las funciones importadas en el script en el que se importan y no podrás acceder a ellas desde la consola de JavaScript, por ejemplo. Seguirás recibiendo errores de sintaxis en DevTools, pero no podrás utilizar algunas de las técnicas de depuración que esperabas utilizar.</li>
-</ul>
-
-<h2 id="Exportaciones_predeterminadas_vs._exportaciones_con_nombre">Exportaciones predeterminadas vs. exportaciones con nombre</h2>
-
-<p>La funcionalidad que hemos exportado hasta ahora se compone de <strong>exportaciones con nombre</strong> — cada elemento (ya sea una función, <code>const</code>, etc.) se ha denominado por su nombre en <code>export</code>, y ese nombre también se ha utilizado para referirse a él en <code>import</code>.</p>
-
-<p>También hay un tipo de exportación llamado <strong>exportación predeterminada</strong> — está diseñado para facilitar que un módulo proporcione una función predeterminada, y también ayuda a los módulos JavaScript a interoperar con los sistemas de módulos CommonJS y AMD existentes (como se explica muy bien en <a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 en profundidad: módulos</a> de Jason Orendorff; busca "Exportaciones predeterminadas").</p>
-
-<p>Veamos un ejemplo mientras explicamos cómo funciona. En nuestros ↑basic-modules↓ <code>square.js</code> puedes encontrar una función llamada <code>randomSquare()</code> que crea un cuadrado con un color, tamaño y posición aleatorios. Lo queremos exportar como nuestro predeterminado, por lo que en la parte inferior del archivo escribimos esto:</p>
-
-<pre class="brush: js; notranslate">export default randomSquare;</pre>
-
-<p>Ten en cuenta la falta de llaves.</p>
-
-<p>En su lugar, podríamos anteponer <code>export default</code> a la función y definirla como una función anónima, así:</p>
-
-<pre class="brush: js; notranslate">export default function(ctx) {
-  ...
-}</pre>
-
-<p>En nuestro archivo <code>main.js</code>, importamos la función predeterminada usando esta línea:</p>
-
-<pre class="brush: js; notranslate">import randomSquare from './modules/square.js';</pre>
-
-<p>Una vez más, ten en cuenta la falta de llaves. Esto se debe a que solo se permite una exportación predeterminada por módulo, y sabemos que <code>randomSquare</code> lo es. La línea anterior es básicamente una abreviatura de:</p>
-
-<pre class="brush: js; notranslate">import {default as randomSquare} from './modules/square.js';</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: La sintaxis as para cambiar el nombre de los elementos exportados se explica a continuación en la sección <a href="#Renombrar_impotaciones_y_exportaciones">Renombrar importaciones y exportaciones</a>.</p>
-</div>
-
-<h2 id="Evitar_conflictos_de_nombres">Evitar conflictos de nombres</h2>
-
-<p>Hasta ahora, nuestros módulos de dibujo de formas en el lienzo parecen estar funcionando bien. Pero, ¿qué pasa si intentamos agregar un módulo que se ocupa de dibujar otra forma, como un círculo o un triángulo? Estas formas probablemente también tendrían funciones asociadas como <code>draw()</code>, <code>reportArea()</code>, etc.; si intentáramos importar diferentes funciones del mismo nombre en el mismo archivo de módulo de nivel superior, terminaríamos con conflictos y errores.</p>
-
-<p>Afortunadamente, hay varias formas de evitar esto. Los veremos en las siguientes secciones.</p>
-
-<h2 id="Renombrar_importaciones_y_exportaciones">Renombrar importaciones y exportaciones</h2>
-
-<p>Dentro de las llaves de tu instrucciones <code>import</code> y <code>export</code>, puedes usar la palabra clave <code>as</code> junto con un nuevo nombre de función, para cambiar el nombre de identificación que utilizará una función dentro del módulo de nivel superior.</p>
-
-<p>Entonces, por ejemplo, ambos de los siguientes harían el mismo trabajo, aunque de una manera ligeramente diferente:</p>
-
-<pre class="brush: js; notranslate">// dentro de module.js
-export {
-  function1 as newFunctionName,
-  function2 as anotherNewFunctionName
-};
-
-// dentro de main.js
-import {newFunctionName, anotherNewFunctionName} from './modules/module.js';</pre>
-
-<pre class="brush: js; notranslate">// dentro de module.js
-export {function1, function2};
-
-// dentro de main.js
-import {function1 as newFunctionName,
-         function2 as anotherNewFunctionName } from './modules/module.js';</pre>
-
-<p>Veamos un ejemplo real. En nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/renaming">renaming</a>, verás el mismo sistema de módulos que en el ejemplo anterior, excepto que hemos agregado los módulos <code>circle.js</code> y <code>triangle.js</code> para dibujar e informar sobre círculos y triángulos.</p>
-
-<p>Dentro de cada uno de estos módulos, tenemos características con los mismos nombres que se exportan y, por lo tanto, cada una tiene la misma instrucción <code>export</code> en la parte inferior:</p>
-
-<pre class="brush: js; notranslate">export { name, draw, reportArea, reportPerimeter };</pre>
-
-<p>Al importarlos a <code>main.js</code>, si intentamos usar esto:</p>
-
-<pre class="brush: js; notranslate">import { name, draw, reportArea, reportPerimeter } from './modules/square.js';
-import { name, draw, reportArea, reportPerimeter } from './modules/circle.js';
-import { name, draw, reportArea, reportPerimeter } from './modules/triangle.js';</pre>
-
-<p>El navegador arrojará un error como "SyntaxError: redeclaración de nombre import" (Firefox).</p>
-
-<p>En su lugar, necesitamos cambiar el nombre de las importaciones para que sean únicas:</p>
-
-<pre class="brush: js; notranslate">import { name as squareName,
-         draw as drawSquare,
-         reportArea as reportSquareArea,
-         reportPerimeter as reportSquarePerimeter } from './modules/square.js';
-
-import { name as circleName,
-         draw as drawCircle,
-         reportArea as reportCircleArea,
-         reportPerimeter as reportCirclePerimeter } from './modules/circle.js';
-
-import { name as triangleName,
-        draw as drawTriangle,
-        reportArea as reportTriangleArea,
-        reportPerimeter as reportTrianglePerimeter } from './modules/triangle.js';</pre>
-
-<p>Ten en cuenta que podrías resolver el problema en los archivos del módulo, p. ej.</p>
-
-<pre class="brush: js; notranslate">// en square.js
-export {name as squareName,
-         draw as drawSquare,
-         reportArea as reportSquareArea,
-         reportPerimeter as reportSquarePerimeter };</pre>
-
-<pre class="brush: js; notranslate">// en main.js
-import {squareName, drawSquare, reportSquareArea, reportSquarePerimeter} from './modules/square.js';</pre>
-
-<p>Y funcionaría igual. El estilo que uses depende de ti, sin embargo, podría decirse que tiene más sentido dejar el código de tu módulo tal cual y realizar los cambios en las importaciones. Esto tiene sentido especialmente cuando estás importando desde módulos de terceros sobre los que no tienes ningún control.</p>
-
-<h2 id="Crear_un_objeto_module">Crear un objeto <code>module</code></h2>
-
-<p>El método anterior funciona bien, pero es un poco complicado y largo. Una solución aún mejor es importar las características de cada módulo dentro de un objeto <code>module</code>. La siguiente forma de sintaxis hace eso:</p>
-
-<pre class="brush: js; notranslate">import * as Module from './modules/module.js';</pre>
-
-<p>Esto toma todas las exportaciones disponibles dentro de <code>module.js</code> y las hace disponibles como miembros de un objeto <code>Module</code>, dándole efectivamente su propio espacio de nombres. Así por ejemplo:</p>
-
-<pre class="brush: js; notranslate">Module.function1()
-Module.function2()
-etc.</pre>
-
-<p>De nuevo, veamos un ejemplo real. Si vas a nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/module-objects">module-objects</a>, verás el mismo ejemplo nuevamente, pero reescrito para aprovechar esta nueva sintaxis. En los módulos, las exportaciones están todas en la siguiente forma simple:</p>
-
-<pre class="brush: js; notranslate">export { name, draw, reportArea, reportPerimeter };</pre>
-
-<p>Las importaciones, por otro lado, se ven así:</p>
-
-<pre class="brush: js; notranslate">import * as Canvas from './modules/canvas.js';
-
-import * as Square from './modules/square.js';
-import * as Circle from './modules/circle.js';
-import * as Triangle from './modules/triangle.js';</pre>
-
-<p>En cada caso, ahora puedes acceder a las importaciones del módulo debajo del nombre del objeto especificado, por ejemplo:</p>
-
-<pre class="brush: js; notranslate">let square1 = Square.draw(myCanvas.ctx, 50, 50, 100, 'blue');
-Square.reportArea(square1.length, reportList);
-Square.reportPerimeter(square1.length, reportList);</pre>
-
-<p>Por lo tanto, ahora puedes escribir el código de la misma manera que antes (siempre que incluyas los nombres de los objetos donde sea necesario), y las importaciones son mucho más ordenadas.</p>
-
-<h2 id="Módulos_y_clases">Módulos y clases</h2>
-
-<p>Como dijimos antes, también puedes exportar e importar clases; esta es otra opción para evitar conflictos en tu código, y especialmente es útil si ya tienes el código de tu módulo escrito en un estilo orientado a objetos.</p>
-
-<p>Puedes ver un ejemplo de nuestro módulo de dibujo de formas reescrito con clases ES en nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/classes">classes</a>. Como ejemplo, el archivo <code><a href="https://github.com/mdn/js-examples/blob/master/modules/classes/modules/square.js">square.js</a></code> ahora contiene toda su funcionalidad en una sola clase:</p>
-
-<pre class="brush: js; notranslate">class Square {
-  constructor(ctx, listId, length, x, y, color) {
-    ...
-  }
-
-  draw() {
-    ...
-  }
-
-  ...
-}</pre>
-
-<p>que luego exportamos:</p>
-
-<pre class="brush: js; notranslate">export { Square };</pre>
-
-<p>En <code><a href="https://github.com/mdn/js-examples/blob/master/modules/classes/main.js">main.js</a></code>, lo importamos así:</p>
-
-<pre class="brush: js; notranslate">import { Square } from './modules/square.js';</pre>
-
-<p>Y luego usas la clase para dibujar nuestro cuadrado:</p>
-
-<pre class="brush: js; notranslate">let square1 = new Square(myCanvas.ctx, myCanvas.listId, 50, 50, 100, 'blue');
-square1.draw();
-square1.reportArea();
-square1.reportPerimeter();</pre>
-
-<h2 id="Carga_estática_de_módulos">Carga estática de módulos</h2>
-
-<p>Habrá ocasiones en las que querrás agregar módulos juntos. Es posible que tengas varios niveles de dependencias, donde desees simplificar las cosas, combinando varios submódulos en un módulo principal. Esto es posible utilizando la sintaxis de exportación de los siguientes formas en el módulo principal:</p>
-
-<pre class="brush: js; notranslate">export * from 'x.js'
-export { name } from 'x.js'</pre>
-
-<p>Para ver un ejemplo, ve nuestro directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/module-aggregation">module-aggregation</a>. En este ejemplo (basado en nuestro ejemplo de clases anterior) tenemos un módulo adicional llamado <code>shapes.js</code>, que reúne toda la funcionalidad de <code>circle.js</code>, <code>square.js</code> y <code>triangle.js</code>. También hemos movido nuestros submódulos dentro de un subdirectorio dentro del directorio <code>modules</code> llamado <code>shapes</code>. Entonces, la estructura del módulo en este ejemplo es:</p>
-
-<pre class="notranslate">modules/
-  canvas.js
-  shapes.js
-  shapes/
-    circle.js
-    square.js
-    triangle.js</pre>
-
-<p>En cada uno de los submódulos, la exportación es de la misma forma, p. ej.</p>
-
-<pre class="brush: js; notranslate">export { Square };</pre>
-
-<p>Luego viene la parte de agregación. Dentro de <code><a href="https://github.com/mdn/js-examples/blob/master/modules/module-aggregation/modules/shapes.js">shapes.js</a></code>, incluimos las siguientes líneas:</p>
-
-<pre class="brush: js; notranslate">export { Square } from './shapes/square.js';
-export { Triangle } from './shapes/triangle.js';
-export { Circle } from './shapes/circle.js';</pre>
-
-<p>Estas toman las exportaciones de los submódulos individuales y las ponen a disposición de manera efectiva desde el módulo <code>shapes.js</code>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Las exportaciones a las que se hace referencia en <code>shapes.js</code> básicamente se redirigen a través del archivo y realmente no existen allí, por lo que no podrás escribir ningún código relacionado útil dentro del mismo archivo.</p>
-</div>
-
-<p>Entonces, ahora en el archivo <code>main.js</code>, podemos obtener acceso a las tres clases de módulos reemplazando</p>
-
-<pre class="brush: js; notranslate">import { Square } from './modules/square.js';
-import { Circle } from './modules/circle.js';
-import { Triangle } from './modules/triangle.js';</pre>
-
-<p>con la siguiente única línea:</p>
-
-<pre class="brush: js; notranslate">import { Square, Circle, Triangle } from './modules/shapes.js';</pre>
-
-<h2 id="Carga_dinámica_de_módulos">Carga dinámica de módulos</h2>
-
-<p>La parte más nueva de la funcionalidad de los módulos de JavaScript que estará disponible en los navegadores es la carga dinámica de módulos. Esto te permite cargar módulos dinámicamente solo cuando son necesarios, en lugar de tener que cargar todo por adelantado. Esto tiene algunas obvias ventajas de rendimiento; sigue leyendo y veamos cómo funciona.</p>
-
-<p>Esta nueva funcionalidad te permite llamar a {{jsxref("Statements/import", "import()", "#Importaciones_Dinámicas")}} como una función, pasándole la ruta al módulo como parámetro. Devuelve una {{jsxref("Promise")}}, que se cumple con un objeto <code>module</code> (consulta <a href="#Crear_un_objeto_module">Crear un objeto <code>module</code></a>) que te da acceso a las exportaciones de ese objeto, p. ej.</p>
-
-<pre class="brush: js; notranslate">import('./modules/myModule.js')
-  .then((module) =&gt; {
-    // Haz algo con el módulo.
-  });</pre>
-
-<p>Veamos un ejemplo. En el directorio <a href="https://github.com/mdn/js-examples/tree/master/modules/dynamic-module-imports">dynamic-module-import</a> tenemos otro ejemplo basado en nuestro ejemplo de clases. Esta vez, sin embargo, no dibujamos nada en el lienzo cuando se carga el ejemplo. En su lugar, incluimos tres botones — "Círculo", "Cuadrado" y "Triángulo" — que, cuando se presionan, cargan dinámicamente el módulo requerido y luego lo usan para dibujar la forma asociada.</p>
-
-<p>En este ejemplo, solo hemos realizado cambios en nuestros archivos <code><a href="https://github.com/mdn/js-examples/blob/master/modules/dynamic-module-imports/index.html">index.html</a></code> y <code><a href="https://github.com/mdn/js-examples/blob/master/modules/dynamic-module-imports/main.mjs">main.js</a></code> — el módulo <code>exports</code> sigue siendo el mismo que antes.</p>
-
-<p>En <code>main.js</code> hemos tomado una referencia a cada botón usando una llamada a <a href="/es/docs/Web/API/Document/querySelector"><code>Document.querySelector()</code></a>, por ejemplo:</p>
-
-<pre class="brush: js; notranslate">let squareBtn = document.querySelector('.square');</pre>
-
-<p>Luego adjuntamos un escucha de eventos a cada botón para que cuando se presione, el módulo relevante se cargue dinámicamente y se use para dibujar la forma:</p>
-
-<pre class="brush: js; notranslate">squareBtn.addEventListener('click', () =&gt; {
-  import('./modules/square.js').then((Module) =&gt; {
-    let square1 = new Module.Square(myCanvas.ctx, myCanvas.listId, 50, 50, 100, 'blue');
-    square1.draw();
-    square1.reportArea();
-    square1.reportPerimeter();
-  })
-});</pre>
-
-<p>Ten en cuenta que, debido a que el cumplimiento de la promesa devuelve un objeto <code>module</code>, la clase se convierte en una subfunción del objeto, por lo que ahora necesitamos acceder al constructor prefijado con <code>Module.</code>, p. ej. <code>Module.Square(...)</code>.</p>
-
-<h2 id="Solución_de_problemas">Solución de problemas</h2>
-
-<p>Aquí hay algunos consejos que te pueden ayudar si tienes problemas para hacer que tus módulos funcionen. ¡No dude en agregarlos a la lista si descubres más!</p>
-
-<ul>
- <li>Mencionamos esto antes, pero para reiterar: los archivos <code>.js</code> se deben cargar con un tipo MIME de <code>text/javascript</code> (u otro tipo MIME compatible con JavaScript, pero se recomienda <code>text/javascript</code>), de lo contrario, obtendrás un error de comprobación de tipo MIME estricto como "El servidor respondió con un tipo MIME no JavaScript".</li>
- <li>Si intentas cargar el archivo HTML localmente (es decir, con una URL <code>file:///</code>), encontrarás errores CORS debido a los requisitos de seguridad del módulo JavaScript. Necesitas hacer tus pruebas a través de un servidor. Las páginas de GitHub son ideales ya que también sirven archivos <code>.js</code> con el tipo MIME correcto.</li>
- <li>Debido a que <code>.mjs</code> es una extensión de archivo no estándar, es posible que algunos sistemas operativos no la reconozcan o intenten reemplazarla por otra. Por ejemplo, descubrimos que macOS silenciosamente agregaba <code>.js</code> al final de los archivos <code>.mjs</code> y luego, automáticamente ocultaba la extensión del archivo. Entonces, todos nuestros archivos salían realmente como <code>x.mjs.js</code>. Una vez que desactivamos la acción de ocultar automáticamente las extensiones de archivo y lo entrenamos para aceptar <code>.mjs</code>, todo estuvo bien.</li>
-</ul>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="https://developers.google.com/web/fundamentals/primers/modules#mjs">Uso de módulos JavaScript en la web</a>, por Addy Osmani y Mathias Bynens</li>
- <li><a href="https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/">Módulos ES: un análisis profundo de dibujos animados</a>, publicación en el blog Hacks de Lin Clark</li>
- <li><a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 en profundidad: Módulos</a>, publicación en el blog Hacks de Jason Orendorff</li>
- <li>Libro de Axel Rauschmayer <a href="http://exploringjs.com/es6/ch_modules.html">Explorando JS: Módulos</a></li>
-</ul>
-
-<p>{{Previous("Web/JavaScript/Guide/Meta_programming")}}</p>
diff --git a/files/es/web/javascript/guide/regular_expressions/aserciones/index.html b/files/es/web/javascript/guide/regular_expressions/aserciones/index.html
deleted file mode 100644
index b822cdd2bf..0000000000
--- a/files/es/web/javascript/guide/regular_expressions/aserciones/index.html
+++ /dev/null
@@ -1,247 +0,0 @@
----
-title: Aserciones
-slug: Web/JavaScript/Guide/Regular_Expressions/Aserciones
-tags:
-  - Aserciones
-  - Expresiones Regulares
-  - Guía
-  - JavaScript
-  - Referencia
-  - regex
-translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions
----
-<p>{{jsSidebar("JavaScript Guide")}}</p>
-
-<p>Las aserciones incluyen límites, que indican el comienzo y el final de líneas y palabras, y otros patrones que indican de alguna manera que el reconocimiento es posible (incluidas las expresiones anticipadas, condicionales e inversas).</p>
-
-<div>{{EmbedInteractiveExample("pages/js/regexp-assertions.html", "taller")}}</div>
-
-<h2 id="Tipos">Tipos</h2>
-
-<div class="hidden">La siguiente sección también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Hoja_de_referencia", "esta hoja de trucos")}}. No olvides editarla también, ¡gracias!</div>
-
-<h3 id="Aserciones_de_tipo_límite">Aserciones de tipo límite</h3>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>^</code></td>
-   <td>
-    <p>Coincide con el comienzo de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca inmediatamente después de un caracter de salto de línea. Por ejemplo, <code>/^A/</code> no coincide con la "A" en "alias A", pero coincide con la primera "A" en "Alias A".</p>
-
-    <div class="blockIndicator note">
-    <p>Este caracter tiene un significado diferente cuando aparece al comienzo de un {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "grupo")}}.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>$</code></td>
-   <td>
-    <p>Coincide con el final de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca hasta inmediatamente antes de un caracter de salto de línea. Por ejemplo, <code>/r$/</code> no coincide con la "r" en "espera", pero sí en "esperar".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\b</code></td>
-   <td>
-    <p>Marca el límite de una palabra. Esta es la posición en la que un caracter de palabra no va seguido o precedido por otro caracter de palabra, por ejemplo, entre una letra y un espacio. Ten en cuenta que el límite de una palabra encontrada no se incluye en el resultado. En otras palabras, la longitud de un límite de palabra encontrada es cero.</p>
-
-    <p>Ejemplos:</p>
-
-    <ul>
-     <li><code>/\bl/</code> encuentra la "l" en "luna".</li>
-     <li><code>/un\b/</code> no concuerda con "un" en "luna", porque "un" va seguido de "a", que es un carácter de palabra.</li>
-     <li><code>/una\b/</code> coincide con "una" en "luna", porque "una" es el final de la cadena, por lo tanto no va seguido de un carácter de palabra.</li>
-     <li><code>/\w\b\w/</code> nunca encontrará con nada, porque un caracter de palabra nunca puede ir seguido de un caracter que no sea de palabra y otro de palabra.</li>
-    </ul>
-
-    <p>Para hacer coincidir un carácter de retroceso (<code>[\b]</code>), consulta {{JSxRef("../Guide/Regular_Expressions/Clases_de_caracteres", "Clases de caracteres")}}.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\B</code></td>
-   <td>
-    <p>Coincide con un límite sin palabra. Esta es una posición en la que el caracter anterior y siguiente son del mismo tipo: ambos deben ser palabras o ambos deben ser no palabras, por ejemplo, entre dos letras o entre dos espacios. El principio y el final de una cadena se consideran no palabras. Igual que el límite de palabras encontradas, el límite sin palabras reconocidas tampoco se incluye en el resultado. Por ejemplo, <code>/\Bme/</code> coincide con "me" en "al mediodía", y <code>/ay\B/</code> coincide con "ay" en "posiblemente ayer".</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Otras_aserciones">Otras aserciones</h3>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: El caracter <code>?</code> también se puede utilizar como cuantificador.</p>
-</div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>x(?=y)</code></td>
-   <td>
-    <p><strong>Aserción anticipada</strong>: Coincide con "x" solo si "x" va seguida de "y". Por ejemplo, <code>/Jack(?=Sprat)/</code> coincide con "Jack" solo si va seguido de "Sprat".<br>
-     <code>/Jack(?=Sprat|Frost)/</code> coincide con "Jack" solo si va seguido de "Sprat" o "Frost". Sin embargo, ni "Sprat" ni "Frost" forman parte del resultado.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>x(?!y)</code></td>
-   <td>
-    <p><strong>Aserción anticipada negativa</strong>: Coincide con "x" solo si "x" <span> no está seguida de </span>"y"<span>.</span> Por ejemplo, <code>/\d+(?!\.)/</code><span> coincide con un número solo si no va seguido de un punto decimal. </span><code>/\d+(?!\.)/.exec('3.141')</code> coincide con "141" pero no con "3."</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?&lt;=y)x</code></td>
-   <td>
-    <p><strong>Aserción de búsqueda inversa</strong>: coincide con "x" solo si "x" está precedida por "y". Por ejemplo, <code>/(?&lt;=Jack)Sprat/</code><span> coincide con "Sprat" sólo si va precedida de "Jack". </span><code>/(?&lt;=Jack|Tom)Sprat/</code> coincide con "Sprat" solo si va precedido de "Jack" o "Tom". Sin embargo, ni "Jack" ni "Tom" forman parte del resultado.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?&lt;!y)x</code></td>
-   <td>
-    <p><strong>Aserción de búsqueda inversa negativa</strong>: coincide con "x" solo si "x" <em>no</em> está precedida por "y". Por ejemplo, <code>/(?&lt;!-)\d+/</code><span> coincide con un número solo si no está precedido por un signo de menos. </span><code>/(? coincide con "3". <code>/(?&lt;!-)\d+/.exec('-3')</code> no se encuentra la coincidencia porque el número está precedido por el signo menos.</code></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_de_descripción_de_tipo_límite">Ejemplo de descripción de tipo límite</h3>
-
-<pre class="brush: js notranslate">// Usa límites Regex para arreglar cadenas con errores.
-let multilineaIncorrecta = `tey, la brillante manzena vered
-toy cuelga en una rama del arbol vered`;
-
-// 1) Usa ^ para corregir la coincidencia al principio de la cadena y justo después de la nueva línea.
-multilineaIncorrecta = multilineaIncorrecta.replace(/^t/gim,'h');
-console.log(1, multilineaIncorrecta); // corrige 'tey', 'toy' =&gt; 'hey', 'hoy'.
-
-// 2) Usa $ para arreglar el reconocimiento al final del texto.
-multilineaIncorrecta = multilineaIncorrecta.replace(/ed$/gim,'de');
-console.log(2, multilineaIncorrecta); // corrige  'vered' =&gt; 'verde'.
-
-// 3) Usa \b para encontrar los caracteres justo en el borde entre una palabra y un espacio.
-multilineaIncorrecta = multilineaIncorrecta.replace(/\ba/gim,'á');
-console.log(3, multilineaIncorrecta); // corrige  'arbol' sin tocar nada más.
-
-// 4) Usa \B para encontrar los caracteres dentro de los bordes de una entidad.
-multilineaCorrecta = multilineaIncorrecta.replace(/\Ben/gim,'an');
-console.log(4, multilineaCorrecta); // corrige  'manzena' pero no toca 'en'.
-</pre>
-
-<h3 id="Busca_al_comienzo_de_la_entrada_usando_un_caracter_de_control">Busca al comienzo de la entrada usando un caracter de control <code>^</code></h3>
-
-<p>Usa <code>^</code> para hacer coincidir al comienzo de la entrada. En este ejemplo, podemos obtener las frutas que comienzan con 'A' con una expresión regular <code>/^A/</code>. Para seleccionar las frutas adecuadas, podemos utilizar el método {{JSxRef("Objetos_globales/Array/filter", "filter")}} con un {{JSxRef("Funciones/Arrow_functions", "función flecha")}}.</p>
-
-<pre class="brush: js notranslate">let frutas = ["Manzana", "Sandía", "Naranja", "Aguacate", "Fresa", "Melón"];
-
-// Selecciona frutas que comiencen con 'M' por la Regex /^M/.
-// Aquí se usa el símbolo de control '^' solo en un rol: Reconocer desde el inicio una entrada.
-
-let frutasEmpiezanConM = frutas.filter(fruta =&gt; /^M/.test(fruta));
-console.log(frutasEmpiezanConM); // [ 'Manzana', 'Melón' ]</pre>
-
-<p>En el segundo ejemplo, <code>^</code> se usa tanto para hacer coincidir al comienzo de la entrada como para crear conjuntos de caracteres negados o complementados cuando se usa dentro de {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "grupos")}}.</p>
-
-<pre class="brush: js notranslate">let frutas = ["Manzana", "Sandía", "Naranja", "Aguacate", "Fresa", "Melón"];
-
-// Seleccionar frutas que no comiencen por 'M' con la regexp /^[^M]/.
-// En este ejemplo, se representan dos significados del símbolo de control '^':
-// 1) Inicio coincidente de la entrada
-// 2) Un conjunto de caracteres negado o complementado: [^M]
-// Es decir, coincide con cualquier cosa que no esté encerrado entre los corchetes.
-
-let frutasNoEmpiezanConM = frutas.filter(fruta =&gt; /^[^M]/.test(fruta));
-
-console.log(frutasNoEmpiezanConM); // [ "Sandía", "Naranja", "Aguacate", "Fresa" ]</pre>
-
-<h3 id="Reconoce_el_límite_de_palabra">Reconoce el límite de palabra</h3>
-
-<pre class="brush: js notranslate">let frutasConDescripcion = ["Manzana roja", "Piña amarilla", "Aguacate verde"];
-
-// Selecciona descripciones que contengan terminaciones de palabras 'ja' o 'de':
-let deJaSeleccion = frutasConDescripcion.filter(descr =&gt; /(de|ja)\b/.test(descr));
-
-console.log(deJaSeleccion); // ["Manzana roja", "Aguacate verde"]</pre>
-
-<h3 id="Aserción_anticipada">Aserción anticipada</h3>
-
-<pre class="brush: js notranslate">// JS aserción anticipada x(?=Y)
-
-let regex = /Primer(?= prueba)/g;
-
-console.log('Primer prueba'.match(regex)); // [ 'Primer' ]
-console.log('Primer melocotón'.match(regex)); // null
-console.log('Esta es mi Primer prueba en un año.'.match(regex)); // [ 'Primer' ]
-console.log('Este es mi Primer melocotón en un mes.'.match(regex)); // null
-</pre>
-
-<h3 id="Aserción_anticipada_negativa_básica">Aserción anticipada negativa básica</h3>
-
-<p>Por ejemplo, <code>/\d+(?!\.)/</code><span> coincide con un número solo si no va seguido de un punto decimal. </span><code>/\d+(?!\.)/.exec('3.141')</code> coincide con "141" pero no con "3."</p>
-
-<pre class="brush: js notranslate">console.log(/\d+(?!\.)/g.exec('3.141')); // [ '141', index: 2, input: '3.141' ]
-</pre>
-
-<h3 id="Diferente_significado_del_uso_de_la_combinación_!_en_aserciones_y_rangos">Diferente significado del uso de la combinación '?!' en aserciones y rangos</h3>
-
-<p>Diferente significado del uso de la combinación <code>?!</code> en {{JSxRef("../Guide/Regular_Expressions/Aserciones", "Aserciones")}} <code>/x(?!y)/</code> y de <code>[^?!]</code> en {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Rangos")}}.</p>
-
-<pre class="brush: js notranslate">let naranjaNoLimon = "¿Quieres beber jugo de naranja? ¡Sí, no quiero tomar jugo de limón!";
-
-// Diferente significado del uso de la combinación '?!' en Aserciones /x(?!y)/ y [^?!] en Rangos.
-let regexNoSeleccionaLimon = /[^?!]+beber(?! de limón)[^?!]+[?!]/gi
-console.log(naranjaNoLimon.match(regexNoSeleccionaLimon)); // [ '¿Quieres beber jugo de naranja?' ]
-
-let regexNoSeleccionaNaranja = /[^?!]+tomar(?! de naranja)[^?!]+[?!]/gi
-console.log(naranjaNoLimon.match(regexNoSeleccionaNaranja)); // [ ' ¡Sí, no quiero tomar jugo de limón!' ]
-</pre>
-
-<h3 id="Aserción_inversa">Aserción inversa</h3>
-
-<pre class="brush: js notranslate">let naranjas = ['naranja madura A', 'naranja verde B', 'naranja madura C',];
-
-let naranjas_maduras = naranjas.filter(fruta =&gt; fruta.match(/(?&lt;=naranja) madura/));
-console.log(naranjas_maduras); // [ 'naranja madura A ', 'naranja madura C' ]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-assertion', 'RegExp: Aserciones')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
-  <ul>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
-  </ul>
- </li>
- <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/assertions/index.html b/files/es/web/javascript/guide/regular_expressions/assertions/index.html
new file mode 100644
index 0000000000..fe7dfcfd1b
--- /dev/null
+++ b/files/es/web/javascript/guide/regular_expressions/assertions/index.html
@@ -0,0 +1,248 @@
+---
+title: Aserciones
+slug: Web/JavaScript/Guide/Regular_Expressions/Assertions
+tags:
+  - Aserciones
+  - Expresiones Regulares
+  - Guía
+  - JavaScript
+  - Referencia
+  - regex
+translation_of: Web/JavaScript/Guide/Regular_Expressions/Assertions
+original_slug: Web/JavaScript/Guide/Regular_Expressions/Aserciones
+---
+<p>{{jsSidebar("JavaScript Guide")}}</p>
+
+<p>Las aserciones incluyen límites, que indican el comienzo y el final de líneas y palabras, y otros patrones que indican de alguna manera que el reconocimiento es posible (incluidas las expresiones anticipadas, condicionales e inversas).</p>
+
+<div>{{EmbedInteractiveExample("pages/js/regexp-assertions.html", "taller")}}</div>
+
+<h2 id="Tipos">Tipos</h2>
+
+<div class="hidden">La siguiente sección también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Hoja_de_referencia", "esta hoja de trucos")}}. No olvides editarla también, ¡gracias!</div>
+
+<h3 id="Aserciones_de_tipo_límite">Aserciones de tipo límite</h3>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>^</code></td>
+   <td>
+    <p>Coincide con el comienzo de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca inmediatamente después de un caracter de salto de línea. Por ejemplo, <code>/^A/</code> no coincide con la "A" en "alias A", pero coincide con la primera "A" en "Alias A".</p>
+
+    <div class="blockIndicator note">
+    <p>Este caracter tiene un significado diferente cuando aparece al comienzo de un {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "grupo")}}.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>$</code></td>
+   <td>
+    <p>Coincide con el final de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca hasta inmediatamente antes de un caracter de salto de línea. Por ejemplo, <code>/r$/</code> no coincide con la "r" en "espera", pero sí en "esperar".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\b</code></td>
+   <td>
+    <p>Marca el límite de una palabra. Esta es la posición en la que un caracter de palabra no va seguido o precedido por otro caracter de palabra, por ejemplo, entre una letra y un espacio. Ten en cuenta que el límite de una palabra encontrada no se incluye en el resultado. En otras palabras, la longitud de un límite de palabra encontrada es cero.</p>
+
+    <p>Ejemplos:</p>
+
+    <ul>
+     <li><code>/\bl/</code> encuentra la "l" en "luna".</li>
+     <li><code>/un\b/</code> no concuerda con "un" en "luna", porque "un" va seguido de "a", que es un carácter de palabra.</li>
+     <li><code>/una\b/</code> coincide con "una" en "luna", porque "una" es el final de la cadena, por lo tanto no va seguido de un carácter de palabra.</li>
+     <li><code>/\w\b\w/</code> nunca encontrará con nada, porque un caracter de palabra nunca puede ir seguido de un caracter que no sea de palabra y otro de palabra.</li>
+    </ul>
+
+    <p>Para hacer coincidir un carácter de retroceso (<code>[\b]</code>), consulta {{JSxRef("../Guide/Regular_Expressions/Clases_de_caracteres", "Clases de caracteres")}}.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\B</code></td>
+   <td>
+    <p>Coincide con un límite sin palabra. Esta es una posición en la que el caracter anterior y siguiente son del mismo tipo: ambos deben ser palabras o ambos deben ser no palabras, por ejemplo, entre dos letras o entre dos espacios. El principio y el final de una cadena se consideran no palabras. Igual que el límite de palabras encontradas, el límite sin palabras reconocidas tampoco se incluye en el resultado. Por ejemplo, <code>/\Bme/</code> coincide con "me" en "al mediodía", y <code>/ay\B/</code> coincide con "ay" en "posiblemente ayer".</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Otras_aserciones">Otras aserciones</h3>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: El caracter <code>?</code> también se puede utilizar como cuantificador.</p>
+</div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>x(?=y)</code></td>
+   <td>
+    <p><strong>Aserción anticipada</strong>: Coincide con "x" solo si "x" va seguida de "y". Por ejemplo, <code>/Jack(?=Sprat)/</code> coincide con "Jack" solo si va seguido de "Sprat".<br>
+     <code>/Jack(?=Sprat|Frost)/</code> coincide con "Jack" solo si va seguido de "Sprat" o "Frost". Sin embargo, ni "Sprat" ni "Frost" forman parte del resultado.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>x(?!y)</code></td>
+   <td>
+    <p><strong>Aserción anticipada negativa</strong>: Coincide con "x" solo si "x" <span> no está seguida de </span>"y"<span>.</span> Por ejemplo, <code>/\d+(?!\.)/</code><span> coincide con un número solo si no va seguido de un punto decimal. </span><code>/\d+(?!\.)/.exec('3.141')</code> coincide con "141" pero no con "3."</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?&lt;=y)x</code></td>
+   <td>
+    <p><strong>Aserción de búsqueda inversa</strong>: coincide con "x" solo si "x" está precedida por "y". Por ejemplo, <code>/(?&lt;=Jack)Sprat/</code><span> coincide con "Sprat" sólo si va precedida de "Jack". </span><code>/(?&lt;=Jack|Tom)Sprat/</code> coincide con "Sprat" solo si va precedido de "Jack" o "Tom". Sin embargo, ni "Jack" ni "Tom" forman parte del resultado.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?&lt;!y)x</code></td>
+   <td>
+    <p><strong>Aserción de búsqueda inversa negativa</strong>: coincide con "x" solo si "x" <em>no</em> está precedida por "y". Por ejemplo, <code>/(?&lt;!-)\d+/</code><span> coincide con un número solo si no está precedido por un signo de menos. </span><code>/(? coincide con "3". <code>/(?&lt;!-)\d+/.exec('-3')</code> no se encuentra la coincidencia porque el número está precedido por el signo menos.</code></p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_de_descripción_de_tipo_límite">Ejemplo de descripción de tipo límite</h3>
+
+<pre class="brush: js notranslate">// Usa límites Regex para arreglar cadenas con errores.
+let multilineaIncorrecta = `tey, la brillante manzena vered
+toy cuelga en una rama del arbol vered`;
+
+// 1) Usa ^ para corregir la coincidencia al principio de la cadena y justo después de la nueva línea.
+multilineaIncorrecta = multilineaIncorrecta.replace(/^t/gim,'h');
+console.log(1, multilineaIncorrecta); // corrige 'tey', 'toy' =&gt; 'hey', 'hoy'.
+
+// 2) Usa $ para arreglar el reconocimiento al final del texto.
+multilineaIncorrecta = multilineaIncorrecta.replace(/ed$/gim,'de');
+console.log(2, multilineaIncorrecta); // corrige  'vered' =&gt; 'verde'.
+
+// 3) Usa \b para encontrar los caracteres justo en el borde entre una palabra y un espacio.
+multilineaIncorrecta = multilineaIncorrecta.replace(/\ba/gim,'á');
+console.log(3, multilineaIncorrecta); // corrige  'arbol' sin tocar nada más.
+
+// 4) Usa \B para encontrar los caracteres dentro de los bordes de una entidad.
+multilineaCorrecta = multilineaIncorrecta.replace(/\Ben/gim,'an');
+console.log(4, multilineaCorrecta); // corrige  'manzena' pero no toca 'en'.
+</pre>
+
+<h3 id="Busca_al_comienzo_de_la_entrada_usando_un_caracter_de_control">Busca al comienzo de la entrada usando un caracter de control <code>^</code></h3>
+
+<p>Usa <code>^</code> para hacer coincidir al comienzo de la entrada. En este ejemplo, podemos obtener las frutas que comienzan con 'A' con una expresión regular <code>/^A/</code>. Para seleccionar las frutas adecuadas, podemos utilizar el método {{JSxRef("Objetos_globales/Array/filter", "filter")}} con un {{JSxRef("Funciones/Arrow_functions", "función flecha")}}.</p>
+
+<pre class="brush: js notranslate">let frutas = ["Manzana", "Sandía", "Naranja", "Aguacate", "Fresa", "Melón"];
+
+// Selecciona frutas que comiencen con 'M' por la Regex /^M/.
+// Aquí se usa el símbolo de control '^' solo en un rol: Reconocer desde el inicio una entrada.
+
+let frutasEmpiezanConM = frutas.filter(fruta =&gt; /^M/.test(fruta));
+console.log(frutasEmpiezanConM); // [ 'Manzana', 'Melón' ]</pre>
+
+<p>En el segundo ejemplo, <code>^</code> se usa tanto para hacer coincidir al comienzo de la entrada como para crear conjuntos de caracteres negados o complementados cuando se usa dentro de {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "grupos")}}.</p>
+
+<pre class="brush: js notranslate">let frutas = ["Manzana", "Sandía", "Naranja", "Aguacate", "Fresa", "Melón"];
+
+// Seleccionar frutas que no comiencen por 'M' con la regexp /^[^M]/.
+// En este ejemplo, se representan dos significados del símbolo de control '^':
+// 1) Inicio coincidente de la entrada
+// 2) Un conjunto de caracteres negado o complementado: [^M]
+// Es decir, coincide con cualquier cosa que no esté encerrado entre los corchetes.
+
+let frutasNoEmpiezanConM = frutas.filter(fruta =&gt; /^[^M]/.test(fruta));
+
+console.log(frutasNoEmpiezanConM); // [ "Sandía", "Naranja", "Aguacate", "Fresa" ]</pre>
+
+<h3 id="Reconoce_el_límite_de_palabra">Reconoce el límite de palabra</h3>
+
+<pre class="brush: js notranslate">let frutasConDescripcion = ["Manzana roja", "Piña amarilla", "Aguacate verde"];
+
+// Selecciona descripciones que contengan terminaciones de palabras 'ja' o 'de':
+let deJaSeleccion = frutasConDescripcion.filter(descr =&gt; /(de|ja)\b/.test(descr));
+
+console.log(deJaSeleccion); // ["Manzana roja", "Aguacate verde"]</pre>
+
+<h3 id="Aserción_anticipada">Aserción anticipada</h3>
+
+<pre class="brush: js notranslate">// JS aserción anticipada x(?=Y)
+
+let regex = /Primer(?= prueba)/g;
+
+console.log('Primer prueba'.match(regex)); // [ 'Primer' ]
+console.log('Primer melocotón'.match(regex)); // null
+console.log('Esta es mi Primer prueba en un año.'.match(regex)); // [ 'Primer' ]
+console.log('Este es mi Primer melocotón en un mes.'.match(regex)); // null
+</pre>
+
+<h3 id="Aserción_anticipada_negativa_básica">Aserción anticipada negativa básica</h3>
+
+<p>Por ejemplo, <code>/\d+(?!\.)/</code><span> coincide con un número solo si no va seguido de un punto decimal. </span><code>/\d+(?!\.)/.exec('3.141')</code> coincide con "141" pero no con "3."</p>
+
+<pre class="brush: js notranslate">console.log(/\d+(?!\.)/g.exec('3.141')); // [ '141', index: 2, input: '3.141' ]
+</pre>
+
+<h3 id="Diferente_significado_del_uso_de_la_combinación_!_en_aserciones_y_rangos">Diferente significado del uso de la combinación '?!' en aserciones y rangos</h3>
+
+<p>Diferente significado del uso de la combinación <code>?!</code> en {{JSxRef("../Guide/Regular_Expressions/Aserciones", "Aserciones")}} <code>/x(?!y)/</code> y de <code>[^?!]</code> en {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Rangos")}}.</p>
+
+<pre class="brush: js notranslate">let naranjaNoLimon = "¿Quieres beber jugo de naranja? ¡Sí, no quiero tomar jugo de limón!";
+
+// Diferente significado del uso de la combinación '?!' en Aserciones /x(?!y)/ y [^?!] en Rangos.
+let regexNoSeleccionaLimon = /[^?!]+beber(?! de limón)[^?!]+[?!]/gi
+console.log(naranjaNoLimon.match(regexNoSeleccionaLimon)); // [ '¿Quieres beber jugo de naranja?' ]
+
+let regexNoSeleccionaNaranja = /[^?!]+tomar(?! de naranja)[^?!]+[?!]/gi
+console.log(naranjaNoLimon.match(regexNoSeleccionaNaranja)); // [ ' ¡Sí, no quiero tomar jugo de limón!' ]
+</pre>
+
+<h3 id="Aserción_inversa">Aserción inversa</h3>
+
+<pre class="brush: js notranslate">let naranjas = ['naranja madura A', 'naranja verde B', 'naranja madura C',];
+
+let naranjas_maduras = naranjas.filter(fruta =&gt; fruta.match(/(?&lt;=naranja) madura/));
+console.log(naranjas_maduras); // [ 'naranja madura A ', 'naranja madura C' ]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-assertion', 'RegExp: Aserciones')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
+  <ul>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
+  </ul>
+ </li>
+ <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/character_classes/index.html b/files/es/web/javascript/guide/regular_expressions/character_classes/index.html
new file mode 100644
index 0000000000..ea0b2ff545
--- /dev/null
+++ b/files/es/web/javascript/guide/regular_expressions/character_classes/index.html
@@ -0,0 +1,221 @@
+---
+title: Clases de caracteres
+slug: Web/JavaScript/Guide/Regular_Expressions/Character_Classes
+tags:
+  - Expresiones Regulares
+  - Guía
+  - JavaScript
+  - Referencia
+  - RegExp
+  - clases de caracteres
+translation_of: Web/JavaScript/Guide/Regular_Expressions/Character_Classes
+original_slug: Web/JavaScript/Guide/Regular_Expressions/Clases_de_caracteres
+---
+<p>{{JsSidebar("Guía de JavaScript")}}</p>
+
+<p>Las clases de caracteres distinguen tipos de caracteres como, por ejemplo, distinguen entre letras y dígitos.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/regexp-character-classes.html")}}</div>
+
+<h2 id="Tipos">Tipos</h2>
+
+<div class="hidden">La siguiente tabla también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Cheatsheet", "esta hoja de referencia")}}. No olvides editarla también, ¡gracias!</div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+ </tbody>
+ <tbody>
+  <tr>
+   <td><code>.</code></td>
+   <td>
+    <p>Tiene uno de los siguientes significados:</p>
+
+    <ul>
+     <li>Coincide con cualquier carácter único <em>excepto</em> terminadores de línea: <code>\n</code>, <code>\r</code>, <code>\u2028</code> o <code>\u2029</code>. Por ejemplo, <code>/.i/</code> coincide con "mi" y "si", pero no con "día", en "si alegra mi día".</li>
+     <li>Dentro de un juego de caracteres, el punto pierde su significado especial y concuerda con un punto literal.</li>
+    </ul>
+
+    <p>Ten en cuenta que el indicador multilínea <code>m</code> no cambia el comportamiento del punto. Por lo tanto, para hacer coincidir un patrón en varias líneas, se puede utilizar el conjunto de caracteres <code>[^]</code> — coincidirá con cualquier carácter, incluidas las nuevas líneas.</p>
+
+    <p>ES2018 agregó el indicador <code>s</code> "<em>dotAll</em>", el cual permite que el punto también coincida con los terminadores de línea.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\d</code></td>
+   <td>
+    <p>Busca cualquier dígito (número arábigo). Equivalente a <code>[0-9]</code>. Por ejemplo, <code>/\d/</code> o <code>/[0-9]/</code> coincide con "2" en "B2 es el número de suite".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\D</code></td>
+   <td>
+    <p>Busca cualquier caracter que <em>no</em> sea un dígito (número arábigo). Equivalente a <code>[^0-9]</code>. Por ejemplo, <code>/\D/</code> o <code>/[^0-9]/</code> coincide con "B" en "B2 es el número de suite".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\w</code></td>
+   <td>
+    <p>Busca cualquier caracter alfanumérico del alfabeto latino básico, incluido el caracter de subrayado. Equivalente a <code>[A-Za-z0-9_]</code>. Por ejemplo, <code>/\w/</code> coincide con "m" en "manzana", "5" en "$5.28", "3" en "3D" y "m" en "Émanuel".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\W</code></td>
+   <td>
+    <p>Busca cualquier caracter que no sea un caracter de palabra del alfabeto latino básico. Equivalente a <code>[^A-Za-z0-9_]</code>. Por ejemplo, <code>/\W/</code> o <code>/[^A-Za-z0-9_]/</code> coincide con "%" en "50%" y "É" en "Émanuel".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\s</code></td>
+   <td>
+    <p>Busca un solo caracter de espacio en blanco, incluido el espacio, tabulación, avance de página, avance de línea y otros espacios Unicode. Equivalente a <code>[ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\s\w*/</code> encuentra " bar" en "foo bar".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\S</code></td>
+   <td>
+    <p>Busca un solo caracter que no sea un espacio en blanco. Equivalente a <code>[^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\S\w*/</code> encuentra "foo" en "foo bar".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\t</code></td>
+   <td>Coincide con una tabulación horizontal.</td>
+  </tr>
+  <tr>
+   <td><code>\r</code></td>
+   <td>Coincide con un retorno de carro.</td>
+  </tr>
+  <tr>
+   <td><code>\n</code></td>
+   <td>Coincide con un salto de línea.</td>
+  </tr>
+  <tr>
+   <td><code>\v</code></td>
+   <td>Coincide con una tabulación vertical.</td>
+  </tr>
+  <tr>
+   <td><code>\f</code></td>
+   <td>Coincide con un caracter de avance de página.</td>
+  </tr>
+  <tr>
+   <td><code>[\b]</code></td>
+   <td>Coincide con un caracter de retroceso. Si estás buscando el carácter de límite de palabra (<code>\b</code>), consulta {{JSxRef("../Guide/Regular_Expressions/Boundaries", "Límites")}}.</td>
+  </tr>
+  <tr>
+   <td><code>\0</code></td>
+   <td>Coincide con un caracter <code>NUL</code>. No sigue a este con otro dígito.</td>
+  </tr>
+  <tr>
+   <td><code>\c<em>X</em></code></td>
+   <td>
+    <p>Coincide con un caracter de control mediante {{Interwiki("wikipedia", "Caret_notation", "notación de intercalación")}}, donde "X" es una letra de la A a la Z (correspondiente a los puntos de código <code>U+0001</code><em>-</em><code>U+001F</code>). Por ejemplo, <code>/\cM/</code> encuentra "\r" en "\r\n".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\x<em>hh</em></code></td>
+   <td>Coincide con el carácter con el código <code><em>hh</em></code> (dos dígitos hexadecimales).</td>
+  </tr>
+  <tr>
+   <td><code>\u<em>hhhh</em></code></td>
+   <td>Coincide con una unidad de código UTF-16 con el valor <code><em>hhhh</em></code> (cuatro dígitos hexadecimales).</td>
+  </tr>
+  <tr>
+   <td><code>\u<em>{hhhh}</em> o <em>\u{hhhhh}</em></code></td>
+   <td>(Solo cuando se establece el indicador <code>u</code>). Hace coincidir el carácter con el valor Unicode <code>U+<em>hhhh</em></code> o <code>U+<em>hhhhh</em></code> (dígitos hexadecimales).</td>
+  </tr>
+  <tr>
+   <td><code>\</code></td>
+   <td>
+    <p>Indica que el siguiente caracter se debe tratar de manera especial o "escaparse". Se comporta de dos formas.</p>
+
+    <ul>
+     <li>Para los caracteres que generalmente se tratan literalmente, indica que el siguiente caracter es especial y no se debe interpretar literalmente. Por ejemplo, <code>/b/</code> coincide con el carácter "b". Al colocar una barra invertida delante de "b", es decir, usando <code>/\b/</code>, el carácter se vuelve especial para significar que coincide con el límite de una palabra.</li>
+     <li>Para los caracteres que generalmente se tratan de manera especial, indica que el siguiente caracter no es especial y se debe interpretar literalmente. Por ejemplo, "*" es un carácter especial que significa que deben coincidir 0 o más ocurrencias del carácter anterior; por ejemplo, <code>/a*/</code> significa coincidir con 0 o más "<em>a</em>"es. Para hacer coincidir <code>*</code> literalmente, precede con una barra invertida; por ejemplo, <code>/a\*/</code> coincide con "a*".</li>
+    </ul>
+
+    <div class="blockIndicator note">
+    <p>Para reconocer este caracter literalmente, escápalo consigo mismo. En otras palabras, para buscar <code>\</code> usa <code>/\\/</code>.</p>
+    </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Buscar_una_serie_de_dígitos">Buscar una serie de dígitos</h3>
+
+<pre class="brush: js notranslate">var datosAleatorios = "015 354 8787 687351 3512 8735";
+var regexpCuatroDigitos = /\b\d{4}\b/g;
+// \b indica un límite (es decir, no empieza a coincidir en medio de una palabra)
+// \d{4} indica un dígito, cuatro veces
+// \b indica otro límite (es decir, no termina la coincidencia en medio de una palabra)
+
+
+console.table(datosAleatorios.match(regexpCuatroDigitos));
+// ['8787', '3512', '8735']
+</pre>
+
+<h3 id="Busca_una_palabra_del_alfabeto_latino_que_comience_con_A">Busca una palabra (del alfabeto latino) que comience con A</h3>
+
+<pre class="brush: js notranslate">var extractoAlicia = "Estoy segura de que no soy Ada, dijo, 'porque su cabello se hace en rizos tan largos, y el mío no se riza en absoluto'.";
+var regexpPalabraEmpiezaConA = /\b[aA]\w+/g;
+// \b indica un límite (es decir, no empieza a coincidir en medio de una palabra)
+// [aA] indica las letras a o A
+// \w+ indica cualquier carácter *del alfabeto latino*, varias veces
+
+console.table(extractoAlicia.match(regexpPalabraEmpiezaConA));
+// ["Ada", "absoluto"]
+</pre>
+
+<h3 id="Busca_una_palabra_de_caracteres_Unicode">Busca una palabra (de caracteres Unicode)</h3>
+
+<p>En lugar del alfabeto latino, podemos usar una variedad de caracteres Unicode para identificar una palabra (de modo que podamos tratar con texto en otros idiomas, tal como Ruso o Árabe). El "Plano multilingüe básico" de Unicode contiene la mayoría de los caracteres que se utilizan en todo el mundo y podemos utilizar clases y rangos de caracteres para reconocer las palabras escritas con esos caracteres.</p>
+
+<pre class="brush: js notranslate">var textoNoEs = "Приключения Алисы в Стране чудес";
+var regexpPalabraBMP = /([\u0000-\u0019\u0021-\uFFFF])+/gu;
+// BMP pasa por U+0000 a U+FFFF pero el espacio es U+0020
+
+console.table(textoNoEs.match(regexpPalabraBMP));
+[ 'Приключения', 'Алисы', 'в', 'Стране', 'чудес' ]
+</pre>
+
+<div class="hidden">
+<p>Nota para los editores de MDN: no intentes agregar ejemplos divertidos con emojis, ya que esos caracteres no los maneja la plataforma (Kuma).</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-characterclass', 'RegExp: Clases de caracteres')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
+  <ul>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
+  </ul>
+ </li>
+ <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/cheatsheet/index.html b/files/es/web/javascript/guide/regular_expressions/cheatsheet/index.html
new file mode 100644
index 0000000000..7a0337bd2f
--- /dev/null
+++ b/files/es/web/javascript/guide/regular_expressions/cheatsheet/index.html
@@ -0,0 +1,452 @@
+---
+title: Hoja de referencia de sintaxis de expresiones regulares
+slug: Web/JavaScript/Guide/Regular_Expressions/Cheatsheet
+tags:
+  - Cheatsheet
+  - Expresiones Regulares
+  - Guía
+  - Hoja de referencia
+  - JavaScript
+  - RegExp
+translation_of: Web/JavaScript/Guide/Regular_Expressions/Cheatsheet
+original_slug: Web/JavaScript/Guide/Regular_Expressions/Hoja_de_referencia
+---
+<div>{{jsSidebar("Guía de JavaScript")}}</div>
+
+<p><span class="seoSummary">Esta página proporciona una hoja de referencia general de todas las capacidades de la sintaxis de <code>RegExp</code> agregando el contenido de los artículos en la guía <code>RegExp</code>. Si necesitas más información sobre un tema específico, sigue el enlace del título correspondiente para acceder al artículo completo o dirígete a <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/">la guía</a>.</span></p>
+
+<h2 id="Clases_de_caracteres"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">Clases de caracteres</a></h2>
+
+<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">el artículo original</a></div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+ </tbody>
+ <tbody>
+  <tr>
+   <td><code>.</code></td>
+   <td>
+    <p>Tiene uno de los siguientes significados:</p>
+
+    <ul>
+     <li>Encuentra cualquier caracter único <em>excepto</em> terminadores de línea: <code>\n</code>, <code>\r</code>, <code>\u2028</code> o <code>\u2029</code>. Por ejemplo, <code>/.y/</code> reconoce "my" y "ay", pero no "yes", en "yes make my day".</li>
+     <li>Dentro de un juego de caracteres, el punto pierde su significado especial y concuerda con un punto literal.</li>
+    </ul>
+
+    <p>Ten en cuenta que el indicador multilínea <code>m</code> no cambia el comportamiento del punto. Por lo tanto, para buscar en un patrón multilínea, puedes usar el juego de caracteres <code>[^]</code> — este encontrará con cualquier caracter, incluidas las nuevas líneas.</p>
+
+    <p>ES2018 agregó el indicador <code>s</code> "<em>dotAll</em>", que permite que el punto también concuerde con los terminadores de línea.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\d</code></td>
+   <td>
+    <p>Busca cualquier dígito (número arábigo). Equivalente a <code>[0-9]</code>. Por ejemplo, <code>/\d/</code> o <code>/[0-9]/</code> encuentra el "2" en "B2 es el número de suite".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\D</code></td>
+   <td>
+    <p>Busca cualquier caracter que no sea un dígito (número arábigo). Equivalente a <code>[^0-9]</code>. Por ejemplo, <code>/\D/</code> o <code>/[^0-9]/</code> encuentra la "B" en "B2 es el número de suite".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\w</code></td>
+   <td>
+    <p>Busca cualquier caracter alfanumérico del alfabeto latino básico, incluido el caracter de subrayado. Equivalente a <code>[A-Za-z0-9_]</code>. Por ejemplo, <code>/\w/</code> encuentra la "m" en "manzana", el "5" en "$5.28" y el "3" en "3D".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\W</code></td>
+   <td>
+    <p>Busca cualquier caracter que no sea un caracter de palabra del alfabeto latino básico. Equivalente a <code>[^A-Za-z0-9_]</code>. Por ejemplo, <code>/\W/</code> o <code>/[^A-Za-z0-9_]/</code> encuentra el caracter "%" en "50%".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\s</code></td>
+   <td>
+    <p>Busca un solo caracter de espacio en blanco, incluido el espacio, tabulación, avance de página, avance de línea y otros espacios Unicode. Equivalente a <code>[ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\s\w*/</code> reconoce " bar" en "foo bar".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\S</code></td>
+   <td>
+    <p>Busca un solo caracter que no sea un espacio en blanco. Equivalente a <code>[^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\S\w*/</code> encuentra "foo" en "foo bar".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\t</code></td>
+   <td>Coincide con una tabulación horizontal.</td>
+  </tr>
+  <tr>
+   <td><code>\r</code></td>
+   <td>Coincide con un retorno de carro.</td>
+  </tr>
+  <tr>
+   <td><code>\n</code></td>
+   <td>Coincide con un salto de línea.</td>
+  </tr>
+  <tr>
+   <td><code>\v</code></td>
+   <td>Coincide con una tabulación vertical.</td>
+  </tr>
+  <tr>
+   <td><code>\f</code></td>
+   <td>Coincide con un caracter de avance de página.</td>
+  </tr>
+  <tr>
+   <td><code>[\b]</code></td>
+   <td>Coincide con un caracter de retroceso. Si estás buscando el caracter de límite de palabra (<code>\b</code>), consulta <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Boundaries">Límites</a>.</td>
+  </tr>
+  <tr>
+   <td><code>\0</code></td>
+   <td>Coincide con un caracter <code>NUL</code>. No sigue a este con otro dígito.</td>
+  </tr>
+  <tr>
+   <td><code>\c<em>X</em></code></td>
+   <td>
+    <p>Coincide con un caracter de control usando <a href="https://en.wikipedia.org/wiki/Caret_notation">notación de acento circunflejo</a>, donde "X" es una letra de la A a la Z (correspondiente a los puntos de código <code>U+0001</code><em>-</em><code>U+001F</code>). Por ejemplo, <code>/\cM/</code> reconoce el caracter "\r" en "\r\n".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\x<em>hh</em></code></td>
+   <td>Busca el caracter con el código <code><em>hh</em></code> (dos dígitos hexadecimales).</td>
+  </tr>
+  <tr>
+   <td><code>\u<em>hhhh</em></code></td>
+   <td>Busca una unidad de código UTF-16 con el valor <code><em>hhhh</em></code> (cuatro dígitos hexadecimales).</td>
+  </tr>
+  <tr>
+   <td><code>\u<em>{hhhh}</em> o <em>\u{hhhhh}</em></code></td>
+   <td>(Solo cuando se establece el indicador <code>u</code>). Busca el caracter con el valor Unicode <code>U+<em>hhhh</em></code> o <code>U+<em>hhhhh</em></code> (dígitos hexadecimales).</td>
+  </tr>
+  <tr>
+   <td><code>\</code></td>
+   <td>
+    <p>Indica que el siguiente caracter se debe tratar de manera especial o "escaparse". Se comporta de dos formas.</p>
+
+    <ul>
+     <li>Para los caracteres que generalmente se tratan literalmente, indica que el siguiente caracter es especial y no se debe interpretar literalmente. Por ejemplo, <code>/b/</code> reconoce el caracter "b". Al colocar una barra invertida delante de "b", es decir, usando <code>/\b/</code>, el caracter se vuelve especial para significar que concuerda con el límite de una palabra.</li>
+     <li>Para los caracteres que generalmente se tratan de manera especial, indica que el siguiente caracter no es especial y se debe interpretar literalmente. Por ejemplo, "*" es un caracter especial que significa que deben reconocer 0 o más ocurrencias del caracter anterior; por ejemplo, <code>/a*/</code> significa reconocer 0 o más "a"s. Para emparejar el <code>*</code> literal, precédelo con una barra invertida; por ejemplo, <code>/a\*/</code> concuerda con "a*".</li>
+    </ul>
+
+    <p>Ten en cuenta que algunos caracteres como <code>:</code>, <code>-</code>, <code>@</code>, etc. no tienen un significado especial cuando se escapan ni cuando no se escapan. Las secuencias de escape como <code>\:</code>, <code>\-</code>, <code>\@</code> serán equivalentes a sus equivalentes de caracteres literales sin escapar en expresiones regulares. Sin embargo, en las expresiones regulares con <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions#Advanced_searching_with_flags_2">indicador Unicode</a>, esto provocará un error de <em>escape de identidad no válido</em>. Esto se hace para asegurar la compatibilidad con el código existente que usa nuevas secuencias de escape como <code>\p</code> o <code>\k</code>.</p>
+
+    <div class="blockIndicator note">
+    <p>Para reconocer este caracter literalmente, escápalo consigo mismo. En otras palabras, para buscar <code>\</code> usa <code>/\\/</code>.</p>
+    </div>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Aserciones"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Assertions">Aserciones</a></h2>
+
+<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Assertions">el artículo original</a></div>
+
+<h3 id="Aserciones_de_tipo_límite">Aserciones de tipo límite</h3>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>^</code></td>
+   <td>
+    <p>Coincide con el comienzo de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca inmediatamente después de un caracter de salto de línea. Por ejemplo, <code>/^A/</code> no reconoce la "A" en "an A", pero encuentra la primera "A" en "An A".</p>
+
+    <div class="blockIndicator note">
+    <p>Este caracter tiene un significado diferente cuando aparece al comienzo de un <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">grupo</a>.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>$</code></td>
+   <td>
+    <p>Coincide con el final de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca hasta inmediatamente antes de un caracter de salto de línea. Por ejemplo, <code>/a$/</code> no reconoce la "t" en "eater", pero sí en "eat".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\b</code></td>
+   <td>
+    <p>Marca el límite de una palabra. Esta es la posición en la que un caracter de palabra no va seguido o precedido por otro caracter de palabra, por ejemplo, entre una letra y un espacio. Ten en cuenta que el límite de una palabra encontrada no se incluye en el resultado. En otras palabras, la longitud de un límite de palabra encontrada es cero.</p>
+
+    <p>Ejemplos:</p>
+
+    <ul>
+     <li><code>/\bm/</code> reconoce la "m" en "moon".</li>
+     <li><code>/oo\b/</code> no reconoce "oo" en "moon", porque "oo" va seguido de "n", que es un caracter de palabra.</li>
+     <li><code>/oon\b/</code> encuentra "oon" en "moon", porque "oon" es el final de la cadena, por lo que no va seguido de un caracter de palabra.</li>
+     <li><code>/\w\b\w/</code> nunca encontrará nada, porque un caracter de palabra nunca puede ir seguido de un caracter que no sea de palabra y otro de palabra.</li>
+    </ul>
+
+    <p>Para encontrar un caracter de retroceso (<code>[\b]</code>), consulta <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">Clases de caracteres</a>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\B</code></td>
+   <td>
+    <p>Coincide con un límite sin palabra. Esta es una posición en la que el caracter anterior y siguiente son del mismo tipo: ambos deben ser palabras o ambos deben ser no palabras, por ejemplo, entre dos letras o entre dos espacios. El principio y el final de una cadena se consideran no palabras. Igual que el límite de palabras encontradas, el límite sin palabras reconocidas tampoco se incluye en el resultado. Por ejemplo, <code>/\Bon/</code> reconoce "on" en "at noon", y <code>/ye\B/</code> encuentra "ye" en "possibly yesterday".</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Otras_aserciones">Otras aserciones</h3>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: El caracter <code>?</code> también se puede utilizar como cuantificador.</p>
+</div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>x(?=y)</code></td>
+   <td>
+    <p><strong>Aserción anticipada</strong>: Coincide con "x" solo si "x" va seguida de "y". Por ejemplo, /<code>Jack(?=Sprat)/</code> reconocerá a "Jack" solo si va seguida de "Sprat".<br>
+     <code>/Jack(?=Sprat|Frost)/</code> encontrará a "Jack" solo si va seguida de "Sprat" o "Frost". Sin embargo, ni "Sprat" ni "Frost" forman parte del resultado.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>x(?!y)</code></td>
+   <td>
+    <p><strong>Aserción de búsqueda anticipada negativa</strong>: reconoce la "x" solo si la "x" <span>no va seguida de</span> "y"<span>.</span> Por ejemplo, <code>/\d+(?!\.)/</code> <span>reconoce un número solo si no va seguido de un punto decimal.</span> <code>/\d+(?!\.)/.exec('3.141')</code> halla el "141" pero no el "3".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?&lt;=y)x</code></td>
+   <td>
+    <p><strong>Aserción de búsqueda inversa</strong>: encontrará "x" solo si "x" está precedida por "y". Por ejemplo, <code>/(?&lt;=Jack)Sprat/</code><span> reconoce a "Sprat" solo si está precedido por "Jack".</span> <code>/(?&lt;=Jack|Tom)Sprat/</code> empareja "Sprat" solo si está precedido por "Jack" o "Tom". Sin embargo, ni "Jack" ni "Tom" forman parte del resultado.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?&lt;!y)x</code></td>
+   <td>
+    <p><strong>Aserción de búsqueda inversa negativa</strong>: Reconoce la "x" solo si "x" no está precedida por "y". Por ejemplo, <code>/(?&lt;!-)\d+/</code> <span>encuentra un número solo si no está precedido por un signo menos</span>. <code>/(?&lt;!-)\d+/.exec('3')</code> encuentra el "3". <code>/(?&lt;!-)\d+/.exec('-3')</code> no lo reconoce porque el número está precedido por el signo menos.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Grupos_y_rangos"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">Grupos y rangos</a></h2>
+
+<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">el artículo original</a></div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code><em>x</em>|<em>y</em></code></td>
+   <td>
+    <p>Coincide con "x" o "y". Por ejemplo, <code>/verde|roja/</code> reconoce el "verde" en "manzana verde" y "roja" en "manzana roja".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>[xyz]<br>
+    [a-c]</code></td>
+   <td>
+    <p>Un juego de caracteres. Coincide con cualquiera de los caracteres incluidos. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. También es posible incluir una clase de caracteres en un juego de caracteres.</p>
+
+    <p>Por ejemplo, <code>[abcd]</code> es lo mismo que <code>[a-d]</code>. Coincide con la "b" en "brisket" y la "c" en "chop".</p>
+
+    <p>Por ejemplo, <code>[abcd-]</code> y <code>[-abcd]</code> reconoce la "b" en "brisket", la "c" en "chop" y el "-" (guión) en "non-profit".</p>
+
+    <p>Por ejemplo, <code>[\w-]</code> es lo mismo que <code>[A-Za-z0-9_-]</code>. Ambos reconocen la "b" en "brisket", la "c" en "chop" y la "n" en "non-profit".</p>
+   </td>
+  </tr>
+  <tr>
+   <td>
+    <p><code>[^xyz]<br>
+     [^a-c]</code></p>
+   </td>
+   <td>
+    <p>Un juego de caracteres negado o complementado. Es decir, hallan cualquier cosa que no esté encerrada entre corchetes. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. Por ejemplo, <code>[^abc]</code> es lo mismo que <code>[^a-c]</code>. Inicialmente halla la "o" en "bacon" y la "h" en "chuleta".</p>
+
+    <div class="blockIndicator note">
+    <p>El caracter ^ además puede indicar el <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Boundaries">comienzo de la entrada</a>.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(<em>x</em>)</code></td>
+   <td>
+    <p><strong>Grupo de captura</strong>: Encuentra la <code><em>x</em></code> y la recuerda. Por ejemplo, <code>/(foo)/</code> encuentra y recuerda "foo" en "foo bar". </p>
+
+    <p>Una expresión regular puede tener varios grupos de captura. En los resultados, coincide con los grupos capturados normalmente en un arreglo cuyos miembros están en el mismo orden que los paréntesis de la izquierda en el grupo capturado. Este suele ser solo el orden de los propios grupos capturados. Esto se vuelve importante cuando los grupos capturados están anidados. Se accede a las coincidencias utilizando el índice de los elementos del resultado (<code>[1], ..., [n]</code>) o desde las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</p>
+
+    <p>Los grupos de captura tienen una penalización de rendimiento. Si no necesitas que se recupere la subcadena coincidente, prefiere los paréntesis que no capturen (ve más abajo).</p>
+
+    <p><code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/String/match">String.match()</a></code> no devolverá grupos si el indicador <code>/.../g</code> está configurado. Sin embargo, aún puedes usar <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/String/matchAll">String.matchAll()</a></code> para obtener todas los encontrados.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\<em>n</em></code></td>
+   <td>
+    <p>Donde "n" es un número entero positivo. Una referencia posterior a la última subcadena que coincide con el paréntesis n en la expresión regular (contando los paréntesis izquierdos). Por ejemplo, <code>/apple(,)\sorange\1/</code> coincide con "apple, orange" en "apple, orange, cherry, peach".</p>
+   </td>
+  </tr>
+  <tr>
+   <td>\k&lt;Name&gt;</td>
+   <td>
+    <p>Una referencia inversa a la última subcadena encontrada con el grupo de captura <strong>N</strong><strong>ombrado</strong> especificado por <code>&lt;Name&gt;</code>.</p>
+
+    <p>Por ejemplo, <code>/(?&lt;title&gt;\w+), yes \k&lt;title&gt;/</code> concuerda con "Sir, yes Sir" en "Do you copy? Sir, yes Sir!".</p>
+
+    <div class="blockIndicator note">
+    <p><code>\k</code> aquí se usa literalmente para indicar el comienzo de una referencia a un grupo de captura nombrado.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?&lt;Name&gt;x)</code></td>
+   <td>
+    <p><strong>Grupo de captura nombrado</strong>: reconoce la "x" y la almacena en la propiedad <code>group</code> del resultado devuelto bajo el nombre especificado por <code>&lt;Name&gt;</code>. Los corchetes angulares (<code>&lt;</code> y <code>&gt;</code>) son obligatorios para el nombre del grupo.</p>
+
+    <p>Por ejemplo, para extraer el código de área de Estados Unidos de un número de teléfono, podríamos usar <code>/\((?&lt;area&gt;\d\d\d)\)/</code>. El número resultante debería aparecer en <code>matches.groups.area</code>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?:<em>x</em>)</code></td>
+   <td><strong>Grupo sin captura</strong>: reconoce la "x" pero no recuerda el resultado. La subcadena encontrada no se puede recuperar de los elementos del arreglo resultante (<code>[1], ..., [n]</code>) o de las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Cuantificadores"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Quantifiers">Cuantificadores</a></h2>
+
+<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Quantifiers">el artículo original</a></div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: A continuación, <em>elemento</em> se refiere no solo a caracteres singulares, sino que también incluye <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">clases de caracteres</a>, <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes">escapes de propiedad Unicode</a>, <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">grupos y rangos</a>.</p>
+</div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code><em>x</em>*</code></td>
+   <td>
+    <p>Concuerda 0 o más veces con el elemento "x" anterior. Por ejemplo, <code>/bo*/</code> reconoce a "boooo" en "Un fantasma booooed" y "b" en "A bird warbled", pero nada en "Una cabra gruñó".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>+</code></td>
+   <td>
+    <p>Encuentra 1 o más veces el elemento "x" anterior Equivalente a <code>{1,}</code>. Por ejemplo, <code>/a+/</code> encuentra la "a" en "candy" y todas las "a"es en "caaaaaaandy".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>?</code></td>
+   <td>
+    <p>Halla 0 o 1 vez el elemento "x" anterior. Por ejemplo, <code>/e?Le?/</code> reconoce a "el" en "ángel" y a "le" en "angle".</p>
+
+    <p>Si se usa inmediatamente después de cualquiera de los cuantificadores <code>*</code>, <code>+</code>, <code>?</code>o <code>{}</code>, hace que el cuantificador no codicioso (que reconoce el número mínimo de veces), a diferencia del predeterminado, que es codicioso (que reconoce el número máximo de veces).</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>{<em>n</em>}</code></td>
+   <td>
+    <p>Donde "n" es un número entero positivo, concuerda exactamente con "n" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{2}/</code> no reconoce la "a" en "candy", pero reconoce todas las "a"s en "caandy" y las dos primeras "a"s en "caaandy ".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>{<em>n</em>,}</code></td>
+   <td>
+    <p>Donde "n" es un número entero positivo, concuerda con al menos "n" apariciones del elemento "x". Por ejemplo, <code>/a{2,}/</code> no reconoce la "a" en "candy", pero reconoce todas las "a" en "caandy" y en "caaaaaaandy".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>{<em>n</em>,<em>m</em>}</code></td>
+   <td>
+    <p>Donde "n" es 0 o un número entero positivo, "m" es un número entero positivo y <code><em>m</em> &gt; <em>n</em></code>, reconoce por lo menos "n" y como máximo "m" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{1,3}/</code> no reconoce nada en "cndy", la "a" en "caramelo", las dos "a" en "caandy" y las tres primeras "a" está en "caaaaaaandy". Observa que al comparar "caaaaaaandy", las "aaa" encontradas, aunque la cadena original tenía más "a" s.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>
+    <p><code><em>x</em>*?</code><br>
+     <code><em>x</em>+?</code><br>
+     <code><em>x</em>??</code><br>
+     <code><em>x</em>{n}?</code><br>
+     <code><em>x</em>{n,}?</code><br>
+     <code><em>x</em>{n,m}?</code></p>
+   </td>
+   <td>
+    <p>De manera predeterminada, los cuantificadores como <code>*</code> y <code>+</code> son "codiciosos", lo cual significa que intentan hacer coincidir la mayor cantidad de cadena posible. El carácter <code>?</code> después del cuantificador hace que este sea "no codicioso": lo cual significa que se detendrá tan pronto como encuentre una concordancia. Por ejemplo, dada una cadena "algo como &lt;foo&gt; &lt;bar&gt; new &lt;/bar&gt; &lt;/foo&gt;":</p>
+
+    <ul>
+     <li><code>/&lt;.*&gt;/</code> reconocerá "&lt;foo&gt; &lt;bar&gt; nuevo &lt;/bar&gt; &lt;/foo&gt;"</li>
+     <li><code>/&lt;.*?&gt;/</code> encajará "&lt;foo&gt;"</li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Escapa_la_propiedad_Unicode"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes">Escapa la propiedad Unicode</a></h2>
+
+<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes">el artículo original</a></div>
+
+<pre class="brush: js notranslate">// Valores no binarios
+\p{<em>UnicodePropertyValue</em>}
+\p{<em>UnicodePropertyName</em>=<em>UnicodePropertyValue</em>}
+
+// Valores binarios y no binarios
+\p{<em>UnicodeBinaryPropertyName</em>}
+
+// Negación: \P is negado \p
+\P{<em>UnicodePropertyValue</em>}
+\P{<em>UnicodeBinaryPropertyName</em>}
+</pre>
+
+<dl>
+ <dt>UnicodeBinaryPropertyName</dt>
+ <dd>El nombre de una <a href="https://tc39.es/ecma262/#table-binary-unicode-properties">propiedad binaria</a>. Por ejemplo: <code><a href="https://unicode.org/reports/tr18/#General_Category_Property">ASCII</a></code>, <code><a href="https://unicode.org/reports/tr44/#Alphabetic">Alpha</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#Diacritic">Diacrítica</a></code>, <code><a href="https://unicode.org/reports/tr51/#Emoji_Properties">Emoji</a></code>, <code><a href="https://unicode.org/reports/tr44/#Hex_Digit">Hex_Digit</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#White_Space">Espacio_blanco</a></code>, etc. Consulta <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropList.txt">Unicode Data PropList.txt</a> para obtener más información.</dd>
+ <dt>UnicodePropertyName</dt>
+</dl>
+
+<dl>
+ <dd>El nombre de una propiedad <a href="https://tc39.es/ecma262/#table-nonbinary-unicode-properties">no binaria</a>:</dd>
+</dl>
+
+<ul>
+ <li><a href="https://unicode.org/reports/tr18/#General_Category_Property">General_Category</a> (<code>gc</code>)</li>
+ <li><a href="https://unicode.org/reports/tr24/#Script">Script</a> (<code>sc</code>)</li>
+ <li><a href="https://unicode.org/reports/tr24/#Script_Extensions">Script_Extensions</a> (<code>scx</code>)</li>
+</ul>
+
+<p>Consulta también <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropertyValueAliases.txt">PropertyValueAliases.txt</a></p>
+
+<dl>
+ <dt>UnicodePropertyValue</dt>
+ <dd>Uno de los fragmentos enumerados en la sección Valores, más adelante. Muchos valores tienen alias o abreviaturas (por ejemplo, el valor <code>Decimal_Number</code> para la propiedad <code>General_Category</code> se puede escribir cómo <code>Nd</code>, <code>digit</code>, o <code>Decimal_number</code>). Para la mayoría de los valores, la parte <em><code>UnicodePropertyName</code> </em> y el signo igual se pueden omitir. Si se especifica un <em><code>UnicodePropertyName</code></em>, el valor debe corresponder al tipo de propiedad proporcionado.</dd>
+</dl>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Puesto que hay muchas propiedades y valores disponibles, no las describiremos exhaustivamente aquí, sino que proporcionaremos varios ejemplos.</p>
+</div>
diff --git a/files/es/web/javascript/guide/regular_expressions/clases_de_caracteres/index.html b/files/es/web/javascript/guide/regular_expressions/clases_de_caracteres/index.html
deleted file mode 100644
index 6de027b270..0000000000
--- a/files/es/web/javascript/guide/regular_expressions/clases_de_caracteres/index.html
+++ /dev/null
@@ -1,220 +0,0 @@
----
-title: Clases de caracteres
-slug: Web/JavaScript/Guide/Regular_Expressions/Clases_de_caracteres
-tags:
-  - Expresiones Regulares
-  - Guía
-  - JavaScript
-  - Referencia
-  - RegExp
-  - clases de caracteres
-translation_of: Web/JavaScript/Guide/Regular_Expressions/Character_Classes
----
-<p>{{JsSidebar("Guía de JavaScript")}}</p>
-
-<p>Las clases de caracteres distinguen tipos de caracteres como, por ejemplo, distinguen entre letras y dígitos.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/regexp-character-classes.html")}}</div>
-
-<h2 id="Tipos">Tipos</h2>
-
-<div class="hidden">La siguiente tabla también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Cheatsheet", "esta hoja de referencia")}}. No olvides editarla también, ¡gracias!</div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
- </tbody>
- <tbody>
-  <tr>
-   <td><code>.</code></td>
-   <td>
-    <p>Tiene uno de los siguientes significados:</p>
-
-    <ul>
-     <li>Coincide con cualquier carácter único <em>excepto</em> terminadores de línea: <code>\n</code>, <code>\r</code>, <code>\u2028</code> o <code>\u2029</code>. Por ejemplo, <code>/.i/</code> coincide con "mi" y "si", pero no con "día", en "si alegra mi día".</li>
-     <li>Dentro de un juego de caracteres, el punto pierde su significado especial y concuerda con un punto literal.</li>
-    </ul>
-
-    <p>Ten en cuenta que el indicador multilínea <code>m</code> no cambia el comportamiento del punto. Por lo tanto, para hacer coincidir un patrón en varias líneas, se puede utilizar el conjunto de caracteres <code>[^]</code> — coincidirá con cualquier carácter, incluidas las nuevas líneas.</p>
-
-    <p>ES2018 agregó el indicador <code>s</code> "<em>dotAll</em>", el cual permite que el punto también coincida con los terminadores de línea.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\d</code></td>
-   <td>
-    <p>Busca cualquier dígito (número arábigo). Equivalente a <code>[0-9]</code>. Por ejemplo, <code>/\d/</code> o <code>/[0-9]/</code> coincide con "2" en "B2 es el número de suite".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\D</code></td>
-   <td>
-    <p>Busca cualquier caracter que <em>no</em> sea un dígito (número arábigo). Equivalente a <code>[^0-9]</code>. Por ejemplo, <code>/\D/</code> o <code>/[^0-9]/</code> coincide con "B" en "B2 es el número de suite".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\w</code></td>
-   <td>
-    <p>Busca cualquier caracter alfanumérico del alfabeto latino básico, incluido el caracter de subrayado. Equivalente a <code>[A-Za-z0-9_]</code>. Por ejemplo, <code>/\w/</code> coincide con "m" en "manzana", "5" en "$5.28", "3" en "3D" y "m" en "Émanuel".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\W</code></td>
-   <td>
-    <p>Busca cualquier caracter que no sea un caracter de palabra del alfabeto latino básico. Equivalente a <code>[^A-Za-z0-9_]</code>. Por ejemplo, <code>/\W/</code> o <code>/[^A-Za-z0-9_]/</code> coincide con "%" en "50%" y "É" en "Émanuel".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\s</code></td>
-   <td>
-    <p>Busca un solo caracter de espacio en blanco, incluido el espacio, tabulación, avance de página, avance de línea y otros espacios Unicode. Equivalente a <code>[ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\s\w*/</code> encuentra " bar" en "foo bar".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\S</code></td>
-   <td>
-    <p>Busca un solo caracter que no sea un espacio en blanco. Equivalente a <code>[^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\S\w*/</code> encuentra "foo" en "foo bar".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\t</code></td>
-   <td>Coincide con una tabulación horizontal.</td>
-  </tr>
-  <tr>
-   <td><code>\r</code></td>
-   <td>Coincide con un retorno de carro.</td>
-  </tr>
-  <tr>
-   <td><code>\n</code></td>
-   <td>Coincide con un salto de línea.</td>
-  </tr>
-  <tr>
-   <td><code>\v</code></td>
-   <td>Coincide con una tabulación vertical.</td>
-  </tr>
-  <tr>
-   <td><code>\f</code></td>
-   <td>Coincide con un caracter de avance de página.</td>
-  </tr>
-  <tr>
-   <td><code>[\b]</code></td>
-   <td>Coincide con un caracter de retroceso. Si estás buscando el carácter de límite de palabra (<code>\b</code>), consulta {{JSxRef("../Guide/Regular_Expressions/Boundaries", "Límites")}}.</td>
-  </tr>
-  <tr>
-   <td><code>\0</code></td>
-   <td>Coincide con un caracter <code>NUL</code>. No sigue a este con otro dígito.</td>
-  </tr>
-  <tr>
-   <td><code>\c<em>X</em></code></td>
-   <td>
-    <p>Coincide con un caracter de control mediante {{Interwiki("wikipedia", "Caret_notation", "notación de intercalación")}}, donde "X" es una letra de la A a la Z (correspondiente a los puntos de código <code>U+0001</code><em>-</em><code>U+001F</code>). Por ejemplo, <code>/\cM/</code> encuentra "\r" en "\r\n".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\x<em>hh</em></code></td>
-   <td>Coincide con el carácter con el código <code><em>hh</em></code> (dos dígitos hexadecimales).</td>
-  </tr>
-  <tr>
-   <td><code>\u<em>hhhh</em></code></td>
-   <td>Coincide con una unidad de código UTF-16 con el valor <code><em>hhhh</em></code> (cuatro dígitos hexadecimales).</td>
-  </tr>
-  <tr>
-   <td><code>\u<em>{hhhh}</em> o <em>\u{hhhhh}</em></code></td>
-   <td>(Solo cuando se establece el indicador <code>u</code>). Hace coincidir el carácter con el valor Unicode <code>U+<em>hhhh</em></code> o <code>U+<em>hhhhh</em></code> (dígitos hexadecimales).</td>
-  </tr>
-  <tr>
-   <td><code>\</code></td>
-   <td>
-    <p>Indica que el siguiente caracter se debe tratar de manera especial o "escaparse". Se comporta de dos formas.</p>
-
-    <ul>
-     <li>Para los caracteres que generalmente se tratan literalmente, indica que el siguiente caracter es especial y no se debe interpretar literalmente. Por ejemplo, <code>/b/</code> coincide con el carácter "b". Al colocar una barra invertida delante de "b", es decir, usando <code>/\b/</code>, el carácter se vuelve especial para significar que coincide con el límite de una palabra.</li>
-     <li>Para los caracteres que generalmente se tratan de manera especial, indica que el siguiente caracter no es especial y se debe interpretar literalmente. Por ejemplo, "*" es un carácter especial que significa que deben coincidir 0 o más ocurrencias del carácter anterior; por ejemplo, <code>/a*/</code> significa coincidir con 0 o más "<em>a</em>"es. Para hacer coincidir <code>*</code> literalmente, precede con una barra invertida; por ejemplo, <code>/a\*/</code> coincide con "a*".</li>
-    </ul>
-
-    <div class="blockIndicator note">
-    <p>Para reconocer este caracter literalmente, escápalo consigo mismo. En otras palabras, para buscar <code>\</code> usa <code>/\\/</code>.</p>
-    </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Buscar_una_serie_de_dígitos">Buscar una serie de dígitos</h3>
-
-<pre class="brush: js notranslate">var datosAleatorios = "015 354 8787 687351 3512 8735";
-var regexpCuatroDigitos = /\b\d{4}\b/g;
-// \b indica un límite (es decir, no empieza a coincidir en medio de una palabra)
-// \d{4} indica un dígito, cuatro veces
-// \b indica otro límite (es decir, no termina la coincidencia en medio de una palabra)
-
-
-console.table(datosAleatorios.match(regexpCuatroDigitos));
-// ['8787', '3512', '8735']
-</pre>
-
-<h3 id="Busca_una_palabra_del_alfabeto_latino_que_comience_con_A">Busca una palabra (del alfabeto latino) que comience con A</h3>
-
-<pre class="brush: js notranslate">var extractoAlicia = "Estoy segura de que no soy Ada, dijo, 'porque su cabello se hace en rizos tan largos, y el mío no se riza en absoluto'.";
-var regexpPalabraEmpiezaConA = /\b[aA]\w+/g;
-// \b indica un límite (es decir, no empieza a coincidir en medio de una palabra)
-// [aA] indica las letras a o A
-// \w+ indica cualquier carácter *del alfabeto latino*, varias veces
-
-console.table(extractoAlicia.match(regexpPalabraEmpiezaConA));
-// ["Ada", "absoluto"]
-</pre>
-
-<h3 id="Busca_una_palabra_de_caracteres_Unicode">Busca una palabra (de caracteres Unicode)</h3>
-
-<p>En lugar del alfabeto latino, podemos usar una variedad de caracteres Unicode para identificar una palabra (de modo que podamos tratar con texto en otros idiomas, tal como Ruso o Árabe). El "Plano multilingüe básico" de Unicode contiene la mayoría de los caracteres que se utilizan en todo el mundo y podemos utilizar clases y rangos de caracteres para reconocer las palabras escritas con esos caracteres.</p>
-
-<pre class="brush: js notranslate">var textoNoEs = "Приключения Алисы в Стране чудес";
-var regexpPalabraBMP = /([\u0000-\u0019\u0021-\uFFFF])+/gu;
-// BMP pasa por U+0000 a U+FFFF pero el espacio es U+0020
-
-console.table(textoNoEs.match(regexpPalabraBMP));
-[ 'Приключения', 'Алисы', 'в', 'Стране', 'чудес' ]
-</pre>
-
-<div class="hidden">
-<p>Nota para los editores de MDN: no intentes agregar ejemplos divertidos con emojis, ya que esos caracteres no los maneja la plataforma (Kuma).</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-characterclass', 'RegExp: Clases de caracteres')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
-  <ul>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
-  </ul>
- </li>
- <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/cuantificadores/index.html b/files/es/web/javascript/guide/regular_expressions/cuantificadores/index.html
deleted file mode 100644
index bc2821219f..0000000000
--- a/files/es/web/javascript/guide/regular_expressions/cuantificadores/index.html
+++ /dev/null
@@ -1,182 +0,0 @@
----
-title: Cuantificadores
-slug: Web/JavaScript/Guide/Regular_Expressions/Cuantificadores
-tags:
-  - Expresiones Regulares
-  - Guía
-  - JavaScript
-  - Referencia
-  - cuantificadores
-  - regex
-translation_of: Web/JavaScript/Guide/Regular_Expressions/Quantifiers
----
-<p>{{jsSidebar("JavaScript Guide")}}</p>
-
-<p>Los cuantificadores indican el número de caracteres o expresiones que deben coincidir.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/regexp-quantifiers.html", "taller")}}</div>
-
-<h2 id="Tipos">Tipos</h2>
-
-<div class="hidden">La siguiente tabla también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Cheatsheet", "esta hoja de referencia")}}. No olvides editarla también, ¡gracias!</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: A continuación, <em>elemento</em> se refiere no solo a caracteres individuales, sino que también incluye {{JSxRef("../Guide/Regular_Expressions/Character_Classes", "clases de caracteres")}}, {{JSxRef("../Guide/Regular_Expressions/Unicode_Property_Escapes", "escapes de propiedades Unicode")}}, {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "grupos y rangos")}}.</p>
-</div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code><em>x</em>*</code></td>
-   <td>
-    <p>Concuerda 0 o más veces con el elemento "x" anterior. Por ejemplo, <code>/bu*/</code> coincide con "buuuu" en "Un fantasma abuuuucheado" y "b" en "Un búho gorjeó", pero nada en "Una cabra gruñó".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>+</code></td>
-   <td>
-    <p>Encuentra 1 o más veces el elemento "x" anterior Equivalente a <code>{1,}</code>. Por ejemplo, <code>/a+/</code> coincide con la "<em>a</em>" en "candy" y todas las "<em>a</em>"es en "caaaaaaandy".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>?</code></td>
-   <td>
-    <p>Halla 0 o 1 vez el elemento "x" anterior. Por ejemplo, <code>/e?le?/</code> coincide con "el" en "ángel" y "ele" en "ángeles".</p>
-
-    <p>Si se usa inmediatamente después de cualquiera de los cuantificadores <code>*</code>, <code>+</code>, <code>?</code>, o <code>{}</code>, hace que el cuantificador <em>no sea codicioso</em> (es decir que coincida con el mínimo número de veces), a diferencia del predeterminado, que es codicioso (que coincide con el máximo número de veces).</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>{<em>n</em>}</code></td>
-   <td>
-    <p>Donde "n" es un número entero positivo, concuerda exactamente con "n" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{2}/</code> no coincide con la "<em>a</em>" de "candy", pero coincide con todas las "<em>a</em>"es de "caandy" y las dos primeras "<em>a</em>"es en "caaandy".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>{<em>n</em>,}</code></td>
-   <td>
-    <p>Donde "n" es un número entero positivo, concuerda con al menos "n" apariciones del elemento "x". Por ejemplo, <code>/a{2,}/</code> no coincide con las "<em>a</em>"es en "caramelo", pero coincide con todas las "<em>a</em>"es en "caaraamelo" y en "caaaaaaaraaaamelo".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>{<em>n</em>,<em>m</em>}</code></td>
-   <td>
-    <p>Donde "n" es 0 o un número entero positivo, "m" es un número entero positivo y <code><em>m</em> &gt; <em>n</em></code> coincide con al menos "n" y como máximo "m" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{1,3}/</code> no coincide con nada en "crmelo", la "<em>a</em>" en "carmelo", las dos "<em>a</em>"es en "caarmelo" y las tres primeras "<em>a</em>"es en "caaaaaaarmelo". Observa que al comparar "caaaaaaarmelo", encuentra las "aaa", aunque la cadena original tenía más "<em>a</em>"es.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>
-    <p><code><em>x</em>*?</code><br>
-     <code><em>x</em>+?</code><br>
-     <code><em>x</em>??</code><br>
-     <code><em>x</em>{n}?</code><br>
-     <code><em>x</em>{n,}?</code><br>
-     <code><em>x</em>{n,m}?</code></p>
-   </td>
-   <td>
-    <p>De manera predeterminada, los cuantificadores como <code>*</code> y <code>+</code> son "codiciosos", lo cual significa que intentan hacer coincidir la mayor cantidad posible de la cadena. El caracter <code>?</code> después del cuantificador hace que el cuantificador "no sea codicioso": lo cual significa que se detendrá tan pronto como encuentre una coincidencia. Por ejemplo, dada una cadena como "algún &lt;foo&gt; &lt;bar&gt; nuevo &lt;/bar&gt; &lt;/foo&gt;":</p>
-
-    <ul>
-     <li><code>/&lt;.*&gt;/</code> coincidirá con "&lt;foo&gt; &lt;bar&gt; nuevo &lt;/bar&gt; &lt;/foo&gt;"</li>
-     <li><code>/&lt;.*?&gt;/</code> coincidirá con "&lt;foo&gt;"</li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Patrón_repetido">Patrón repetido</h3>
-
-<pre class="brush: js notranslate">var palabraTerminadaConAes = /\w+a+\b/;
-var mensajeDelicado = "Esto es Espartaaaaaaa";
-
-console.table(mensajeDelicado.match(palabraTerminadaConAes)); // [ "Espartaaaaaaa" ]
-</pre>
-
-<h3 id="Conteo_de_caracteres">Conteo de caracteres</h3>
-
-<pre class="brush: js notranslate">var palabraDeUnaLetra = /\b\w\b/g;
-var palabraNoTanLarga = /\b\w{1,6}\b/g;
-var palabraLaaaaarga = /\b\w{10,}\b/g;
-
-var frase = "¿Por qué me tengo que sentar a estudiar las tablas de multiplicar?";
-
-console.table(frase.match(palabraDeUnaLetra)); // ["a"]
-console.table(frase.match(palabraNoTanLarga));    // ["Por", "qu", "me", "tengo", "que", "sentar", "a", "las", "tablas", "de"]
-console.table(frase.match(palabraLaaaaarga));      // ["multiplicar"]
-</pre>
-
-<h3 id="Caracter_opcional">Caracter opcional</h3>
-
-<pre class="brush: js notranslate">var londinText = "He asked his neighbour a favour.";
-var yanquiText = "He asked his neighbor a favor.";
-
-var regexpEnding = /\w+ou?r/g;
-// \w+ Una o varias letras
-// o   seguida de una "o",
-// u?  opcionalmente seguida de una "u"
-// r   seguida de una "r"
-
-console.table(londinText.match(regexpEnding));
-// ["neighbour", "favour"]
-
-console.table(yanquiText.match(regexpEnding));
-// ["neighbor", "favor"]
-</pre>
-
-<h3 id="Codicioso_versus_no_codicioso">Codicioso versus no codicioso</h3>
-
-<pre class="brush: js notranslate">var texto = "Debo estar muy cerca del centro de la tierra.";
-var regexpCodiciosa = /[\w ]+/;
-// [\w ]      una letra del alfabeto latino o un espacio en blanco
-//      +     una o varias veces
-
-console.log(texto.match(regexpCodiciosa)[0]);
-// "Debo estar muy cerca del centro de la tierra."
-// casi todo el texto coincide (omite el caracter de punto)
-
-var regexpNoCodiciosa = /[\w ]+?/; // Observa el signo de interrogación
-console.log(texto.match(regexpNoCodiciosa));
-// "D"
-// La coincidencia es la más pequeña posible
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-quantifier', 'RegExp: Quantifiers')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
-
-  <ul>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
-  </ul>
- </li>
- <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/escapes_de_propiedades_unicode/index.html b/files/es/web/javascript/guide/regular_expressions/escapes_de_propiedades_unicode/index.html
deleted file mode 100644
index 7fc434a0dc..0000000000
--- a/files/es/web/javascript/guide/regular_expressions/escapes_de_propiedades_unicode/index.html
+++ /dev/null
@@ -1,177 +0,0 @@
----
-title: Escapes de propiedades Unicode
-slug: Web/JavaScript/Guide/Regular_Expressions/Escapes_de_propiedades_Unicode
-tags:
-  - Expresiones Regulares
-  - Guía
-  - JavaScript
-  - Referencia
-  - escapes de propiedades unicode
-  - regex
-translation_of: Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes
----
-<p>{{jsSidebar("JavaScript Guide")}}</p>
-
-<p>Los <strong>escapes de propiedad Unicode</strong> en las {{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}} permiten la coincidencia de caracteres según sus propiedades Unicode. Un caracter se describe mediante varias propiedades que, o bien, son binarias ("tipo booleano") o, no binarias. Por ejemplo, puedes usar escapes de propiedades Unicode para reconocer emojis, signos de puntuación, letras (incluso letras de idiomas específicos o scripts), etc.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/regexp-unicode-property-escapes.html", "taller")}}</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Para que funcionen los escapes de propiedad Unicode, una expresión regular debe utilizar {{JSxRef("../Guide/Regular_Expressions", "la bandera <code>u</code>", "#Busqueda_avanzada_con_banderas")}} que indica que una cadena se debe considerar como una serie de puntos de código Unicode. Consulta también {{JSxRef("Objetos_globales/RegExp/unicode", "RegExp.prototype.unicode")}}.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Algunas propiedades Unicode abarcan muchos más caracteres que algunas {{JSxRef("../Guide/Regular_Expressions/Character_Classes", "clases de caracteres")}} (como <code>\w</code> que coincide solo con letras latinas, desde <code>a</code> hasta <code>z</code>) pero esta última es más compatible con los navegadores (a partir de enero de 2020).</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<div class="hidden">La siguiente sección también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Hoja_de_referencia", "esta hoja de trucos")}}. No olvides editarla también, ¡gracias!</div>
-
-<pre class="brush: js notranslate">// Valores no binarios
-\p{<em>UnicodePropertyValue</em>}
-\p{<em>UnicodePropertyName</em>=<em>UnicodePropertyValue</em>}
-
-// Valores binarios y no binarios
-\p{<em>UnicodeBinaryPropertyName</em>}
-
-// Negación: \P se niega con \p
-\P{<em>UnicodePropertyValue</em>}
-\P{<em>UnicodeBinaryPropertyName</em>}
-</pre>
-
-<ul>
- <li><a href="https://unicode.org/reports/tr18/#General_Category_Property">Categoría general</a> (<code>gc</code> por «<em><strong>g</strong>eneral <strong>c</strong>ategory</em>»)</li>
- <li><a href="https://unicode.org/reports/tr24/#Script">Script</a> (<code>sc</code> por «<em><strong>sc</strong>ript</em>»)</li>
- <li><a href="https://unicode.org/reports/tr24/#Script_Extensions">Extensiones de script</a> (<code>scx</code> por «<em><strong>sc</strong>ript e<strong>x</strong>tensions</em>»)</li>
-</ul>
-
-<p>Consulta también <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropertyValueAliases.txt">PropertyValueAliases.txt<span style="display: none;"> </span></a></p>
-
-<dl>
- <dt>UnicodeBinaryPropertyName</dt>
- <dd>El nombre de una <a href="https://tc39.es/ecma262/#table-binary-unicode-properties">propiedad binaria</a>. Por ejemplo: <code><a href="https://unicode.org/reports/tr18/#General_Category_Property">ASCII</a></code>, <code><a href="https://unicode.org/reports/tr44/#Alphabetic">Alfabético</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#Diacritic">Diacrítico</a></code>, <code><a href="https://unicode.org/reports/tr51/#Emoji_Properties">Emoji</a></code>, <code><a href="https://unicode.org/reports/tr44/#Hex_Digit">Dígito hexadecimal</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#White_Space">Espacio en blanco</a></code>, etc. Consulta <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropList.txt">Unicode Data PropList.txt</a> para obtener más información.</dd>
- <dt>NombreDePropiedadUnicode</dt>
- <dd>El nombre de una propiedad <a href="https://tc39.es/ecma262/#table-nonbinary-unicode-properties">no binaria</a>:</dd>
- <dt>ValorDePropiedadUnicode</dt>
- <dd>Uno de los fragmentos enumerados en la sección Valores, más adelante. Muchos valores tienen alias o abreviaturas (por ejemplo, el valor <code>Decimal_Number</code> para la propiedad <code>General_Category</code> se puede escribir <code>Nd</code>, <code>digit</code>, o <code>Decimal_Number</code>). Para la mayoría de los valores, la parte <em><code>NombreDePropiedadUnicode</code></em> y el signo igual se pueden omitir. Si se especifica un <em><code>NombreDePropiedadUnicode</code></em>, el valor debe corresponder al tipo de propiedad proporcionado.</dd>
-</dl>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Debido a que hay muchas propiedades y valores disponibles, no los describiremos exhaustivamente aquí, en su lugar proporcionaremos varios ejemplos.</p>
-</div>
-
-<h2 id="Justificación">Justificación</h2>
-
-<p>Antes de ES2018, no existía una forma eficiente de hacer coincidir caracteres de diferentes conjuntos basados en <code>scripts</code> (como macedonio, griego, georgiano, etc.) o <code>propertyName</code> (como Emoji, etc.) en JavaScript. Consulta la <a href="https://github.com/tc39/proposal-regexp-unicode-property-escapes">propuesta tc39 sobre escapes de propiedad Unicode</a> para obtener más información.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Categorías_generales">Categorías generales</h3>
-
-<p>Las categorías generales se utilizan para clasificar caracteres Unicode, y hay subcategorías disponibles para definir una categorización más precisa. Es posible utilizar formas cortas o largas en los escapes de propiedades Unicode.</p>
-
-<p>Se pueden utilizar para reconocer letras, números, símbolos, signos de puntuación, espacios, etc. Para obtener una lista más exhaustiva de categorías generales, consulta <a href="https://unicode.org/reports/tr18/#General_Category_Property">la especificación Unicode</a>.</p>
-
-<pre class="brush: js notranslate">// encontrar todas las letras de un texto
-let historia = "Es el gato de Cheshire: ahora tendré alguien con quien hablar";
-
-// Forma más explícita
-historia.match(/\p{General_Category=Letter}/gu);
-
-// No es obligatorio utilizar el nombre de la propiedad para las categorías generales
-historia.match(/\p{Letter}/gu);
-
-// Esto es equivalente (alias corto):
-historia.match(/\p{L}/gu);
-
-// Esto también es equivalente (conjunción de todas las subcategorías que utilizan alias cortos)
-historia.match(/\p{Lu}|\p{Ll}|\p{Lt}|\p{Lm}|\p{Lo}/gu);
-</pre>
-
-<h3 id="Scripts_y_extensiones_de_script">Scripts y extensiones de script</h3>
-
-<p>Algunos idiomas usan diferentes signos para su sistema de escritura. Por ejemplo, el Inglés y el Español se escriben con los signos latinos, mientras que el Árabe y el Ruso se escriben con otros signos (Árabe y Cirílico, respectivamente). Las propiedades Unicode <code>Script</code> y <code>Script_Extensions</code> permiten que las expresiones regulares coincidan con los caracteres según el script con el que se utilizan principalmente (<code>Script</code>) o según el conjunto de los scripts a los que pertenecen (<code>Script_Extensions</code>).</p>
-
-<p>Por ejemplo, <code>A</code> pertenece al script <code>Latin</code> y <code>ε</code> al script <code>Greek</code> (Griego).</p>
-
-<pre class="brush: js notranslate">let caracteresMezclados = "aεЛ";
-
-// Usando el nombre canónico "largo" del script
-caracteresMezclados.match(/\p{Script=Latin}/u); // a
-
-// Usando un alias corto para el script
-caracteresMezclados.match(/\p{Script=Greek}/u); // ε
-
-// Usando el nombre corto Sc para la propiedad Script
-caracteresMezclados.match(/\p{Sc=Cyrillic}/u); // Л
-</pre>
-
-<p>Para obtener más detalles, consulta <a href="https://unicode.org/reports/tr24/#Script">la especificación Unicode</a> y la <a href="https://tc39.es/ecma262/#table-unicode-script-values">Tabla de scripts en la especificación ECMAScript</a>.</p>
-
-<p>Si se usa un carácter en un conjunto limitado de scripts, la propiedad <code>Script</code> solo coincidirá con el script "predominante" utilizado. Si quieres hacer coincidir caracteres basados en un script "no predominante", podrías usar la propiedad <code>Script_Extensions</code> (<code>Scx</code> para abreviar).</p>
-
-<pre class="brush: js notranslate">// ٢ es el dígito 2 en notación Árabe-Índica
-// si bien está escrito en un script predominante en árabe
-// también se puede escribir en el script Thaana
-
-"٢".match(/\p{Script=Thaana}/u);
-// null ya que Thaana no es el script predominante     super()
-
-"٢".match(/\p{Script_Extensions=Thaana}/u);
-// ["٢", index: 0, input: "٢", groups: undefined]
-</pre>
-
-<h3 id="Escapes_de_propiedades_Unicode_versus_Clases_de_caracteres">Escapes de propiedades Unicode versus Clases de caracteres</h3>
-
-<p>Con las expresiones regulares de JavaScript, también es posible utilizar {{JSxRef("../Guide/Regular_Expressions/Clases_de_caracteres", "clases de caracteres")}} y especialmente <code>\w</code> o <code>\d</code> para hacer coincidir letras o dígitos. Sin embargo, estos formularios solo coinciden con caracteres de la escritura <em>latina</em> (en otras palabras, de la <code>a</code> a la <code>z</code> y <code>A</code> a <code>Z</code> para <code>\w</code> y <code>0</code> a <code>9</code> para <code>\d</code>). Como se muestra en {{JSxRef("../Guide/Regular_Expressions/Clases_de_caracteres", "este ejemplo", "#Busca_una_palabra_de_caracteres_Unicode")}}, puede ser un poco torpe trabajar con textos no latinos.</p>
-
-<p>Las categorías de escape de propiedad Unicode abarcan muchos más caracteres y <code>\p{Letter}</code> o <code>\p{Number}</code> funcionarán para cualquier script.</p>
-
-<pre class="brush: js notranslate">// Intentando usar rangos para evitar limitaciones de \w:
-
-const textoNoEs = "Приключения Алисы в Стране чудес";
-const regexpPalabraBMP = /([\u0000-\u0019\u0021-\uFFFF])+/gu;
-// BMP pasa por U+0000 a U+FFFF pero el espacio es U+0020
-
-console.table(textoNoEs.match(regexpPalabraBMP));
-
-// El uso de la propiedad Unicode se escapa en su lugar
-const regexpEPU = /\p{L}+/gu;
-console.table(textoNoEs.match(regexpEPU));
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-runtime-semantics-unicodematchproperty-p', 'RegExp: Escapes de propiedades Unicode')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
-  <ul>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
-  </ul>
- </li>
- <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
- <li>{{JSxRef("Objetos_globales/RegExp/unicode", "RegExp.prototype.unicode")}}</li>
- <li><a href="https://en.wikipedia.org/wiki/Unicode_character_property">Propiedades de caracteres unicode — Wikipedia</a></li>
- <li><a href="https://2ality.com/2017/07/regexp-unicode-property-escapes.html">Una entrada en el blog de Axel Rauschmayer sobre los escapes de propiedades Unicode</a></li>
- <li><a href="https://unicode.org/reports/tr18/#Categories">El documento Unicode para las propiedades Unicode</a></li>
-</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/groups_and_ranges/index.html b/files/es/web/javascript/guide/regular_expressions/groups_and_ranges/index.html
new file mode 100644
index 0000000000..17e377f501
--- /dev/null
+++ b/files/es/web/javascript/guide/regular_expressions/groups_and_ranges/index.html
@@ -0,0 +1,177 @@
+---
+title: Grupos y rangos
+slug: Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges
+tags:
+  - Expresiones Regulares
+  - Guía
+  - JavaScript
+  - Rangos
+  - Referencia
+  - grupos
+  - regex
+translation_of: Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges
+original_slug: Web/JavaScript/Guide/Regular_Expressions/Grupos_y_rangos
+---
+<p>{{jsSidebar("JavaScript Guide")}}</p>
+
+<p>Los grupos y rangos indican grupos y rangos de caracteres de expresión.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/regexp-groups-ranges.html")}}</div>
+
+<h2 id="Tipos">Tipos</h2>
+
+<div class="hidden">La siguiente sección también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Hoja_de_referencia", "esta hoja de trucos")}}. No olvides editarla también, ¡gracias!</div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code><em>x</em>|<em>y</em></code></td>
+   <td>
+    <p>Coincide con "x" o "y". Por ejemplo, <code>/verde|roja/</code> coincide con "verde" en "manzana verde" y "roja" en "manzana roja".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>[xyz]<br>
+    [a-c]</code></td>
+   <td>
+    <p>Un juego de caracteres. Coincide con cualquiera de los caracteres incluidos. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. También es posible incluir una clase de caracteres en un juego de caracteres.</p>
+
+    <p>Por ejemplo, <code>[abcd]</code> es lo mismo que <code>[a-d]</code>. Coincide con la "b" en "brisket" y la "c" en "chop".</p>
+
+    <p>Por ejemplo, <code>[abcd-]</code> y <code>[-abcd]</code> coinciden con la "b" en "brisket", la "c" en "chop" y el "-" (guión) en "sin-fin".</p>
+
+    <p>Por ejemplo, <code>[\w-]</code> es lo mismo que <code>[A-Za-z0-9_-]</code>. Ambos reconocen la "b" en "brisket", la "c" en "chop" y la "s" en "sin-fin".</p>
+   </td>
+  </tr>
+  <tr>
+   <td>
+    <p><code>[^xyz]<br>
+     [^a-c]</code></p>
+   </td>
+   <td>
+    <p>Un juego de caracteres negado o complementado. Es decir, hallan cualquier cosa que no esté encerrada entre corchetes. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. Por ejemplo, <code>[^abc]</code> es lo mismo que <code>[^a-c]</code>. Inicialmente halla la "o" en "bacon" y la "h" en "chuleta".</p>
+
+    <div class="blockIndicator note">
+    <p>El caracter ^ también puede indicar el {{JSxRef("../Guide/Regular_Expressions/Assertions", "comienzo de la entrada")}}.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(<em>x</em>)</code></td>
+   <td>
+    <p><strong>Grupo de captura</strong>: Coincide con <code><em>x</em></code> y recuerda la coincidencia. Por ejemplo, <code>/(foo)/</code> encuentra y recuerda "foo" en "foo bar". </p>
+
+    <p>Una expresión regular puede tener varios grupos de captura. En los resultados, coincide con los grupos capturados normalmente en un arreglo cuyos miembros están en el mismo orden que los paréntesis de la izquierda en el grupo capturado. Este suele ser solo el orden de los propios grupos capturados. Esto se vuelve importante cuando los grupos capturados están anidados. Se accede a las coincidencias utilizando el índice de los elementos del resultado (<code>[1], ..., [n]</code>) o desde las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</p>
+
+    <p>Los grupos de captura tienen una penalización de rendimiento. Si no necesitas que se recupere la subcadena coincidente, prefiere los grupos de no captura (ve {{anch("GpoDeNoCaptura", "más abajo")}}).</p>
+
+    <p>{{JSxRef("Objetos_globales/String/match", "String.match()")}} no devolverá grupos si se establece el indicador <code>/.../g</code>. Sin embargo, aún puedes usar {{JSxRef("Objetos_globales/String/matchAll", "String.matchAll()")}} para obtener todas las coincidencias.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\<em>n</em></code></td>
+   <td>
+    <p>Donde "n" es un número entero positivo. Una referencia inversa a la última subcadena que coincide con el paréntesis <code>n</code> en la expresión regular (contando los paréntesis izquierdos). Por ejemplo, <code>/manzana(,)\snaranja\1/</code> coincide con "manzana, naranja" en "manzana, naranja, cereza, melocotón".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>\k&lt;Nombre&gt;</code></td>
+   <td>
+    <p>Una referencia inversa a la última subcadena que coincide con el grupo de captura <strong>N</strong><strong>ombrado</strong> especificado por <code>&lt;Nombre&gt;</code>.</p>
+
+    <p>Por ejemplo, <code>/(?&lt;trato&gt;\w+), si \k&lt;trato&gt;/</code> coincide con "Sr., sí Sr." en "¿Me copias? ¡Sr., sí Sr.!".</p>
+
+    <div class="blockIndicator note">
+    <p>aquí se usa <code>\k</code> literalmente para indicar el comienzo de una referencia inversa a un grupo de captura con nombre.</p>
+    </div>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?&lt;Nombre&gt;x)</code></td>
+   <td>
+    <p><strong>Grupo de captura con nombre</strong>: Coincide con "x" y la almacena en la propiedad de grupos de las coincidencias devueltas con el nombre especificado por <code>&lt;Nombre&gt;</code>. Los corchetes angulares (<code>&lt;</code> y <code>&gt;</code>) son necesarios para el nombre del grupo.</p>
+
+    <p>Por ejemplo, para extraer el código de área de Estados Unidos de un número de teléfono, podrías usar <code>/\((?&lt;area&gt;\d\d\d)\)/</code>. El número resultante aparecería en <code>matches.groups.area</code>.</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code>(?:<em>x</em>)</code></td>
+   <td><span id="GpoDeNoCaptura"><strong>Grupo de no captura</strong></span>: Coincide con "x" pero no recuerda la coincidencia. La subcadena coincidente no se puede recuperar de los elementos del arreglo resultante (<code>[1], ..., [n]</code>) o de las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Conteo_de_vocales">Conteo de vocales</h3>
+
+<pre class="brush: js notranslate">var aliceExcerpt = "Hubo un largo silencio después de esto, y Alicia solo podía escuchar susurros de vez en cuando.";
+var regexpVowels = /[aeiouy]/g;
+
+console.log("Número de vocales minúsculas: ", aliceExcerpt.match(regexpVowels).length);
+// Número de vocales: 34</pre>
+
+<h3 id="Uso_de_grupos">Uso de grupos</h3>
+
+<pre class="brush: js notranslate">let personList = `First_Name: John, Last_Name: Doe
+First_Name: Jane, Last_Name: Smith`;
+
+let regexpNames =  /First_Name: (\w+), Last_Name: (\w+)/mg;
+let match = regexpNames.exec(personList);
+do {
+  console.log(`Hola ${match[1]} ${match[2]}`);
+} while((match = regexpNames.exec(personList)) !== null);
+</pre>
+
+<h3 id="Uso_de_grupos_con_nombre">Uso de grupos con nombre</h3>
+
+<pre class="brush: js notranslate">let personList = `First_Name: John, Last_Name: Doe
+First_Name: Jane, Last_Name: Smith`;
+
+let regexpNames =  /First_Name: (?&lt;firstname&gt;\w+), Last_Name: (?&lt;lastname&gt;\w+)/mg;
+let match = regexpNames.exec(personList);
+do {
+  console.log(`Hola ${match.groups.firstname} ${match.groups.lastname}`);
+} while((match = regexpNames.exec(personList)) !== null);</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: No todos los navegadores admiten esta función; consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla de compatibilidad", "#Compatibilidad_del_navegador")}}.</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-classranges', 'RegExp: Ranges')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
+
+  <ul>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
+  </ul>
+ </li>
+ <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/grupos_y_rangos/index.html b/files/es/web/javascript/guide/regular_expressions/grupos_y_rangos/index.html
deleted file mode 100644
index 34eed03589..0000000000
--- a/files/es/web/javascript/guide/regular_expressions/grupos_y_rangos/index.html
+++ /dev/null
@@ -1,176 +0,0 @@
----
-title: Grupos y rangos
-slug: Web/JavaScript/Guide/Regular_Expressions/Grupos_y_rangos
-tags:
-  - Expresiones Regulares
-  - Guía
-  - JavaScript
-  - Rangos
-  - Referencia
-  - grupos
-  - regex
-translation_of: Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges
----
-<p>{{jsSidebar("JavaScript Guide")}}</p>
-
-<p>Los grupos y rangos indican grupos y rangos de caracteres de expresión.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/regexp-groups-ranges.html")}}</div>
-
-<h2 id="Tipos">Tipos</h2>
-
-<div class="hidden">La siguiente sección también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Hoja_de_referencia", "esta hoja de trucos")}}. No olvides editarla también, ¡gracias!</div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code><em>x</em>|<em>y</em></code></td>
-   <td>
-    <p>Coincide con "x" o "y". Por ejemplo, <code>/verde|roja/</code> coincide con "verde" en "manzana verde" y "roja" en "manzana roja".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>[xyz]<br>
-    [a-c]</code></td>
-   <td>
-    <p>Un juego de caracteres. Coincide con cualquiera de los caracteres incluidos. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. También es posible incluir una clase de caracteres en un juego de caracteres.</p>
-
-    <p>Por ejemplo, <code>[abcd]</code> es lo mismo que <code>[a-d]</code>. Coincide con la "b" en "brisket" y la "c" en "chop".</p>
-
-    <p>Por ejemplo, <code>[abcd-]</code> y <code>[-abcd]</code> coinciden con la "b" en "brisket", la "c" en "chop" y el "-" (guión) en "sin-fin".</p>
-
-    <p>Por ejemplo, <code>[\w-]</code> es lo mismo que <code>[A-Za-z0-9_-]</code>. Ambos reconocen la "b" en "brisket", la "c" en "chop" y la "s" en "sin-fin".</p>
-   </td>
-  </tr>
-  <tr>
-   <td>
-    <p><code>[^xyz]<br>
-     [^a-c]</code></p>
-   </td>
-   <td>
-    <p>Un juego de caracteres negado o complementado. Es decir, hallan cualquier cosa que no esté encerrada entre corchetes. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. Por ejemplo, <code>[^abc]</code> es lo mismo que <code>[^a-c]</code>. Inicialmente halla la "o" en "bacon" y la "h" en "chuleta".</p>
-
-    <div class="blockIndicator note">
-    <p>El caracter ^ también puede indicar el {{JSxRef("../Guide/Regular_Expressions/Assertions", "comienzo de la entrada")}}.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(<em>x</em>)</code></td>
-   <td>
-    <p><strong>Grupo de captura</strong>: Coincide con <code><em>x</em></code> y recuerda la coincidencia. Por ejemplo, <code>/(foo)/</code> encuentra y recuerda "foo" en "foo bar". </p>
-
-    <p>Una expresión regular puede tener varios grupos de captura. En los resultados, coincide con los grupos capturados normalmente en un arreglo cuyos miembros están en el mismo orden que los paréntesis de la izquierda en el grupo capturado. Este suele ser solo el orden de los propios grupos capturados. Esto se vuelve importante cuando los grupos capturados están anidados. Se accede a las coincidencias utilizando el índice de los elementos del resultado (<code>[1], ..., [n]</code>) o desde las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</p>
-
-    <p>Los grupos de captura tienen una penalización de rendimiento. Si no necesitas que se recupere la subcadena coincidente, prefiere los grupos de no captura (ve {{anch("GpoDeNoCaptura", "más abajo")}}).</p>
-
-    <p>{{JSxRef("Objetos_globales/String/match", "String.match()")}} no devolverá grupos si se establece el indicador <code>/.../g</code>. Sin embargo, aún puedes usar {{JSxRef("Objetos_globales/String/matchAll", "String.matchAll()")}} para obtener todas las coincidencias.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\<em>n</em></code></td>
-   <td>
-    <p>Donde "n" es un número entero positivo. Una referencia inversa a la última subcadena que coincide con el paréntesis <code>n</code> en la expresión regular (contando los paréntesis izquierdos). Por ejemplo, <code>/manzana(,)\snaranja\1/</code> coincide con "manzana, naranja" en "manzana, naranja, cereza, melocotón".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\k&lt;Nombre&gt;</code></td>
-   <td>
-    <p>Una referencia inversa a la última subcadena que coincide con el grupo de captura <strong>N</strong><strong>ombrado</strong> especificado por <code>&lt;Nombre&gt;</code>.</p>
-
-    <p>Por ejemplo, <code>/(?&lt;trato&gt;\w+), si \k&lt;trato&gt;/</code> coincide con "Sr., sí Sr." en "¿Me copias? ¡Sr., sí Sr.!".</p>
-
-    <div class="blockIndicator note">
-    <p>aquí se usa <code>\k</code> literalmente para indicar el comienzo de una referencia inversa a un grupo de captura con nombre.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?&lt;Nombre&gt;x)</code></td>
-   <td>
-    <p><strong>Grupo de captura con nombre</strong>: Coincide con "x" y la almacena en la propiedad de grupos de las coincidencias devueltas con el nombre especificado por <code>&lt;Nombre&gt;</code>. Los corchetes angulares (<code>&lt;</code> y <code>&gt;</code>) son necesarios para el nombre del grupo.</p>
-
-    <p>Por ejemplo, para extraer el código de área de Estados Unidos de un número de teléfono, podrías usar <code>/\((?&lt;area&gt;\d\d\d)\)/</code>. El número resultante aparecería en <code>matches.groups.area</code>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?:<em>x</em>)</code></td>
-   <td><span id="GpoDeNoCaptura"><strong>Grupo de no captura</strong></span>: Coincide con "x" pero no recuerda la coincidencia. La subcadena coincidente no se puede recuperar de los elementos del arreglo resultante (<code>[1], ..., [n]</code>) o de las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Conteo_de_vocales">Conteo de vocales</h3>
-
-<pre class="brush: js notranslate">var aliceExcerpt = "Hubo un largo silencio después de esto, y Alicia solo podía escuchar susurros de vez en cuando.";
-var regexpVowels = /[aeiouy]/g;
-
-console.log("Número de vocales minúsculas: ", aliceExcerpt.match(regexpVowels).length);
-// Número de vocales: 34</pre>
-
-<h3 id="Uso_de_grupos">Uso de grupos</h3>
-
-<pre class="brush: js notranslate">let personList = `First_Name: John, Last_Name: Doe
-First_Name: Jane, Last_Name: Smith`;
-
-let regexpNames =  /First_Name: (\w+), Last_Name: (\w+)/mg;
-let match = regexpNames.exec(personList);
-do {
-  console.log(`Hola ${match[1]} ${match[2]}`);
-} while((match = regexpNames.exec(personList)) !== null);
-</pre>
-
-<h3 id="Uso_de_grupos_con_nombre">Uso de grupos con nombre</h3>
-
-<pre class="brush: js notranslate">let personList = `First_Name: John, Last_Name: Doe
-First_Name: Jane, Last_Name: Smith`;
-
-let regexpNames =  /First_Name: (?&lt;firstname&gt;\w+), Last_Name: (?&lt;lastname&gt;\w+)/mg;
-let match = regexpNames.exec(personList);
-do {
-  console.log(`Hola ${match.groups.firstname} ${match.groups.lastname}`);
-} while((match = regexpNames.exec(personList)) !== null);</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: No todos los navegadores admiten esta función; consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla de compatibilidad", "#Compatibilidad_del_navegador")}}.</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-classranges', 'RegExp: Ranges')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
-
-  <ul>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
-   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
-  </ul>
- </li>
- <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/hoja_de_referencia/index.html b/files/es/web/javascript/guide/regular_expressions/hoja_de_referencia/index.html
deleted file mode 100644
index accc783aff..0000000000
--- a/files/es/web/javascript/guide/regular_expressions/hoja_de_referencia/index.html
+++ /dev/null
@@ -1,451 +0,0 @@
----
-title: Hoja de referencia de sintaxis de expresiones regulares
-slug: Web/JavaScript/Guide/Regular_Expressions/Hoja_de_referencia
-tags:
-  - Cheatsheet
-  - Expresiones Regulares
-  - Guía
-  - Hoja de referencia
-  - JavaScript
-  - RegExp
-translation_of: Web/JavaScript/Guide/Regular_Expressions/Cheatsheet
----
-<div>{{jsSidebar("Guía de JavaScript")}}</div>
-
-<p><span class="seoSummary">Esta página proporciona una hoja de referencia general de todas las capacidades de la sintaxis de <code>RegExp</code> agregando el contenido de los artículos en la guía <code>RegExp</code>. Si necesitas más información sobre un tema específico, sigue el enlace del título correspondiente para acceder al artículo completo o dirígete a <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/">la guía</a>.</span></p>
-
-<h2 id="Clases_de_caracteres"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">Clases de caracteres</a></h2>
-
-<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">el artículo original</a></div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
- </tbody>
- <tbody>
-  <tr>
-   <td><code>.</code></td>
-   <td>
-    <p>Tiene uno de los siguientes significados:</p>
-
-    <ul>
-     <li>Encuentra cualquier caracter único <em>excepto</em> terminadores de línea: <code>\n</code>, <code>\r</code>, <code>\u2028</code> o <code>\u2029</code>. Por ejemplo, <code>/.y/</code> reconoce "my" y "ay", pero no "yes", en "yes make my day".</li>
-     <li>Dentro de un juego de caracteres, el punto pierde su significado especial y concuerda con un punto literal.</li>
-    </ul>
-
-    <p>Ten en cuenta que el indicador multilínea <code>m</code> no cambia el comportamiento del punto. Por lo tanto, para buscar en un patrón multilínea, puedes usar el juego de caracteres <code>[^]</code> — este encontrará con cualquier caracter, incluidas las nuevas líneas.</p>
-
-    <p>ES2018 agregó el indicador <code>s</code> "<em>dotAll</em>", que permite que el punto también concuerde con los terminadores de línea.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\d</code></td>
-   <td>
-    <p>Busca cualquier dígito (número arábigo). Equivalente a <code>[0-9]</code>. Por ejemplo, <code>/\d/</code> o <code>/[0-9]/</code> encuentra el "2" en "B2 es el número de suite".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\D</code></td>
-   <td>
-    <p>Busca cualquier caracter que no sea un dígito (número arábigo). Equivalente a <code>[^0-9]</code>. Por ejemplo, <code>/\D/</code> o <code>/[^0-9]/</code> encuentra la "B" en "B2 es el número de suite".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\w</code></td>
-   <td>
-    <p>Busca cualquier caracter alfanumérico del alfabeto latino básico, incluido el caracter de subrayado. Equivalente a <code>[A-Za-z0-9_]</code>. Por ejemplo, <code>/\w/</code> encuentra la "m" en "manzana", el "5" en "$5.28" y el "3" en "3D".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\W</code></td>
-   <td>
-    <p>Busca cualquier caracter que no sea un caracter de palabra del alfabeto latino básico. Equivalente a <code>[^A-Za-z0-9_]</code>. Por ejemplo, <code>/\W/</code> o <code>/[^A-Za-z0-9_]/</code> encuentra el caracter "%" en "50%".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\s</code></td>
-   <td>
-    <p>Busca un solo caracter de espacio en blanco, incluido el espacio, tabulación, avance de página, avance de línea y otros espacios Unicode. Equivalente a <code>[ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\s\w*/</code> reconoce " bar" en "foo bar".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\S</code></td>
-   <td>
-    <p>Busca un solo caracter que no sea un espacio en blanco. Equivalente a <code>[^ \f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]</code>. Por ejemplo, <code>/\S\w*/</code> encuentra "foo" en "foo bar".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\t</code></td>
-   <td>Coincide con una tabulación horizontal.</td>
-  </tr>
-  <tr>
-   <td><code>\r</code></td>
-   <td>Coincide con un retorno de carro.</td>
-  </tr>
-  <tr>
-   <td><code>\n</code></td>
-   <td>Coincide con un salto de línea.</td>
-  </tr>
-  <tr>
-   <td><code>\v</code></td>
-   <td>Coincide con una tabulación vertical.</td>
-  </tr>
-  <tr>
-   <td><code>\f</code></td>
-   <td>Coincide con un caracter de avance de página.</td>
-  </tr>
-  <tr>
-   <td><code>[\b]</code></td>
-   <td>Coincide con un caracter de retroceso. Si estás buscando el caracter de límite de palabra (<code>\b</code>), consulta <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Boundaries">Límites</a>.</td>
-  </tr>
-  <tr>
-   <td><code>\0</code></td>
-   <td>Coincide con un caracter <code>NUL</code>. No sigue a este con otro dígito.</td>
-  </tr>
-  <tr>
-   <td><code>\c<em>X</em></code></td>
-   <td>
-    <p>Coincide con un caracter de control usando <a href="https://en.wikipedia.org/wiki/Caret_notation">notación de acento circunflejo</a>, donde "X" es una letra de la A a la Z (correspondiente a los puntos de código <code>U+0001</code><em>-</em><code>U+001F</code>). Por ejemplo, <code>/\cM/</code> reconoce el caracter "\r" en "\r\n".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\x<em>hh</em></code></td>
-   <td>Busca el caracter con el código <code><em>hh</em></code> (dos dígitos hexadecimales).</td>
-  </tr>
-  <tr>
-   <td><code>\u<em>hhhh</em></code></td>
-   <td>Busca una unidad de código UTF-16 con el valor <code><em>hhhh</em></code> (cuatro dígitos hexadecimales).</td>
-  </tr>
-  <tr>
-   <td><code>\u<em>{hhhh}</em> o <em>\u{hhhhh}</em></code></td>
-   <td>(Solo cuando se establece el indicador <code>u</code>). Busca el caracter con el valor Unicode <code>U+<em>hhhh</em></code> o <code>U+<em>hhhhh</em></code> (dígitos hexadecimales).</td>
-  </tr>
-  <tr>
-   <td><code>\</code></td>
-   <td>
-    <p>Indica que el siguiente caracter se debe tratar de manera especial o "escaparse". Se comporta de dos formas.</p>
-
-    <ul>
-     <li>Para los caracteres que generalmente se tratan literalmente, indica que el siguiente caracter es especial y no se debe interpretar literalmente. Por ejemplo, <code>/b/</code> reconoce el caracter "b". Al colocar una barra invertida delante de "b", es decir, usando <code>/\b/</code>, el caracter se vuelve especial para significar que concuerda con el límite de una palabra.</li>
-     <li>Para los caracteres que generalmente se tratan de manera especial, indica que el siguiente caracter no es especial y se debe interpretar literalmente. Por ejemplo, "*" es un caracter especial que significa que deben reconocer 0 o más ocurrencias del caracter anterior; por ejemplo, <code>/a*/</code> significa reconocer 0 o más "a"s. Para emparejar el <code>*</code> literal, precédelo con una barra invertida; por ejemplo, <code>/a\*/</code> concuerda con "a*".</li>
-    </ul>
-
-    <p>Ten en cuenta que algunos caracteres como <code>:</code>, <code>-</code>, <code>@</code>, etc. no tienen un significado especial cuando se escapan ni cuando no se escapan. Las secuencias de escape como <code>\:</code>, <code>\-</code>, <code>\@</code> serán equivalentes a sus equivalentes de caracteres literales sin escapar en expresiones regulares. Sin embargo, en las expresiones regulares con <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions#Advanced_searching_with_flags_2">indicador Unicode</a>, esto provocará un error de <em>escape de identidad no válido</em>. Esto se hace para asegurar la compatibilidad con el código existente que usa nuevas secuencias de escape como <code>\p</code> o <code>\k</code>.</p>
-
-    <div class="blockIndicator note">
-    <p>Para reconocer este caracter literalmente, escápalo consigo mismo. En otras palabras, para buscar <code>\</code> usa <code>/\\/</code>.</p>
-    </div>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Aserciones"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Assertions">Aserciones</a></h2>
-
-<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Assertions">el artículo original</a></div>
-
-<h3 id="Aserciones_de_tipo_límite">Aserciones de tipo límite</h3>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>^</code></td>
-   <td>
-    <p>Coincide con el comienzo de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca inmediatamente después de un caracter de salto de línea. Por ejemplo, <code>/^A/</code> no reconoce la "A" en "an A", pero encuentra la primera "A" en "An A".</p>
-
-    <div class="blockIndicator note">
-    <p>Este caracter tiene un significado diferente cuando aparece al comienzo de un <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">grupo</a>.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>$</code></td>
-   <td>
-    <p>Coincide con el final de la entrada. Si el indicador multilínea se establece en <code>true</code>, también busca hasta inmediatamente antes de un caracter de salto de línea. Por ejemplo, <code>/a$/</code> no reconoce la "t" en "eater", pero sí en "eat".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\b</code></td>
-   <td>
-    <p>Marca el límite de una palabra. Esta es la posición en la que un caracter de palabra no va seguido o precedido por otro caracter de palabra, por ejemplo, entre una letra y un espacio. Ten en cuenta que el límite de una palabra encontrada no se incluye en el resultado. En otras palabras, la longitud de un límite de palabra encontrada es cero.</p>
-
-    <p>Ejemplos:</p>
-
-    <ul>
-     <li><code>/\bm/</code> reconoce la "m" en "moon".</li>
-     <li><code>/oo\b/</code> no reconoce "oo" en "moon", porque "oo" va seguido de "n", que es un caracter de palabra.</li>
-     <li><code>/oon\b/</code> encuentra "oon" en "moon", porque "oon" es el final de la cadena, por lo que no va seguido de un caracter de palabra.</li>
-     <li><code>/\w\b\w/</code> nunca encontrará nada, porque un caracter de palabra nunca puede ir seguido de un caracter que no sea de palabra y otro de palabra.</li>
-    </ul>
-
-    <p>Para encontrar un caracter de retroceso (<code>[\b]</code>), consulta <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">Clases de caracteres</a>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\B</code></td>
-   <td>
-    <p>Coincide con un límite sin palabra. Esta es una posición en la que el caracter anterior y siguiente son del mismo tipo: ambos deben ser palabras o ambos deben ser no palabras, por ejemplo, entre dos letras o entre dos espacios. El principio y el final de una cadena se consideran no palabras. Igual que el límite de palabras encontradas, el límite sin palabras reconocidas tampoco se incluye en el resultado. Por ejemplo, <code>/\Bon/</code> reconoce "on" en "at noon", y <code>/ye\B/</code> encuentra "ye" en "possibly yesterday".</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Otras_aserciones">Otras aserciones</h3>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: El caracter <code>?</code> también se puede utilizar como cuantificador.</p>
-</div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>x(?=y)</code></td>
-   <td>
-    <p><strong>Aserción anticipada</strong>: Coincide con "x" solo si "x" va seguida de "y". Por ejemplo, /<code>Jack(?=Sprat)/</code> reconocerá a "Jack" solo si va seguida de "Sprat".<br>
-     <code>/Jack(?=Sprat|Frost)/</code> encontrará a "Jack" solo si va seguida de "Sprat" o "Frost". Sin embargo, ni "Sprat" ni "Frost" forman parte del resultado.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>x(?!y)</code></td>
-   <td>
-    <p><strong>Aserción de búsqueda anticipada negativa</strong>: reconoce la "x" solo si la "x" <span>no va seguida de</span> "y"<span>.</span> Por ejemplo, <code>/\d+(?!\.)/</code> <span>reconoce un número solo si no va seguido de un punto decimal.</span> <code>/\d+(?!\.)/.exec('3.141')</code> halla el "141" pero no el "3".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?&lt;=y)x</code></td>
-   <td>
-    <p><strong>Aserción de búsqueda inversa</strong>: encontrará "x" solo si "x" está precedida por "y". Por ejemplo, <code>/(?&lt;=Jack)Sprat/</code><span> reconoce a "Sprat" solo si está precedido por "Jack".</span> <code>/(?&lt;=Jack|Tom)Sprat/</code> empareja "Sprat" solo si está precedido por "Jack" o "Tom". Sin embargo, ni "Jack" ni "Tom" forman parte del resultado.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?&lt;!y)x</code></td>
-   <td>
-    <p><strong>Aserción de búsqueda inversa negativa</strong>: Reconoce la "x" solo si "x" no está precedida por "y". Por ejemplo, <code>/(?&lt;!-)\d+/</code> <span>encuentra un número solo si no está precedido por un signo menos</span>. <code>/(?&lt;!-)\d+/.exec('3')</code> encuentra el "3". <code>/(?&lt;!-)\d+/.exec('-3')</code> no lo reconoce porque el número está precedido por el signo menos.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Grupos_y_rangos"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">Grupos y rangos</a></h2>
-
-<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">el artículo original</a></div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code><em>x</em>|<em>y</em></code></td>
-   <td>
-    <p>Coincide con "x" o "y". Por ejemplo, <code>/verde|roja/</code> reconoce el "verde" en "manzana verde" y "roja" en "manzana roja".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>[xyz]<br>
-    [a-c]</code></td>
-   <td>
-    <p>Un juego de caracteres. Coincide con cualquiera de los caracteres incluidos. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. También es posible incluir una clase de caracteres en un juego de caracteres.</p>
-
-    <p>Por ejemplo, <code>[abcd]</code> es lo mismo que <code>[a-d]</code>. Coincide con la "b" en "brisket" y la "c" en "chop".</p>
-
-    <p>Por ejemplo, <code>[abcd-]</code> y <code>[-abcd]</code> reconoce la "b" en "brisket", la "c" en "chop" y el "-" (guión) en "non-profit".</p>
-
-    <p>Por ejemplo, <code>[\w-]</code> es lo mismo que <code>[A-Za-z0-9_-]</code>. Ambos reconocen la "b" en "brisket", la "c" en "chop" y la "n" en "non-profit".</p>
-   </td>
-  </tr>
-  <tr>
-   <td>
-    <p><code>[^xyz]<br>
-     [^a-c]</code></p>
-   </td>
-   <td>
-    <p>Un juego de caracteres negado o complementado. Es decir, hallan cualquier cosa que no esté encerrada entre corchetes. Puedes especificar un rango de caracteres mediante el uso de un guión, pero si el guión aparece como el primero o último caracter entre corchetes, se toma como un guión literal para incluirse en el juego de caracteres como un caracter normal. Por ejemplo, <code>[^abc]</code> es lo mismo que <code>[^a-c]</code>. Inicialmente halla la "o" en "bacon" y la "h" en "chuleta".</p>
-
-    <div class="blockIndicator note">
-    <p>El caracter ^ además puede indicar el <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Boundaries">comienzo de la entrada</a>.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(<em>x</em>)</code></td>
-   <td>
-    <p><strong>Grupo de captura</strong>: Encuentra la <code><em>x</em></code> y la recuerda. Por ejemplo, <code>/(foo)/</code> encuentra y recuerda "foo" en "foo bar". </p>
-
-    <p>Una expresión regular puede tener varios grupos de captura. En los resultados, coincide con los grupos capturados normalmente en un arreglo cuyos miembros están en el mismo orden que los paréntesis de la izquierda en el grupo capturado. Este suele ser solo el orden de los propios grupos capturados. Esto se vuelve importante cuando los grupos capturados están anidados. Se accede a las coincidencias utilizando el índice de los elementos del resultado (<code>[1], ..., [n]</code>) o desde las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</p>
-
-    <p>Los grupos de captura tienen una penalización de rendimiento. Si no necesitas que se recupere la subcadena coincidente, prefiere los paréntesis que no capturen (ve más abajo).</p>
-
-    <p><code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/String/match">String.match()</a></code> no devolverá grupos si el indicador <code>/.../g</code> está configurado. Sin embargo, aún puedes usar <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/String/matchAll">String.matchAll()</a></code> para obtener todas los encontrados.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>\<em>n</em></code></td>
-   <td>
-    <p>Donde "n" es un número entero positivo. Una referencia posterior a la última subcadena que coincide con el paréntesis n en la expresión regular (contando los paréntesis izquierdos). Por ejemplo, <code>/apple(,)\sorange\1/</code> coincide con "apple, orange" en "apple, orange, cherry, peach".</p>
-   </td>
-  </tr>
-  <tr>
-   <td>\k&lt;Name&gt;</td>
-   <td>
-    <p>Una referencia inversa a la última subcadena encontrada con el grupo de captura <strong>N</strong><strong>ombrado</strong> especificado por <code>&lt;Name&gt;</code>.</p>
-
-    <p>Por ejemplo, <code>/(?&lt;title&gt;\w+), yes \k&lt;title&gt;/</code> concuerda con "Sir, yes Sir" en "Do you copy? Sir, yes Sir!".</p>
-
-    <div class="blockIndicator note">
-    <p><code>\k</code> aquí se usa literalmente para indicar el comienzo de una referencia a un grupo de captura nombrado.</p>
-    </div>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?&lt;Name&gt;x)</code></td>
-   <td>
-    <p><strong>Grupo de captura nombrado</strong>: reconoce la "x" y la almacena en la propiedad <code>group</code> del resultado devuelto bajo el nombre especificado por <code>&lt;Name&gt;</code>. Los corchetes angulares (<code>&lt;</code> y <code>&gt;</code>) son obligatorios para el nombre del grupo.</p>
-
-    <p>Por ejemplo, para extraer el código de área de Estados Unidos de un número de teléfono, podríamos usar <code>/\((?&lt;area&gt;\d\d\d)\)/</code>. El número resultante debería aparecer en <code>matches.groups.area</code>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>(?:<em>x</em>)</code></td>
-   <td><strong>Grupo sin captura</strong>: reconoce la "x" pero no recuerda el resultado. La subcadena encontrada no se puede recuperar de los elementos del arreglo resultante (<code>[1], ..., [n]</code>) o de las propiedades predefinidas del objeto <code>RegExp</code> (<code>$1, ..., $9</code>).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Cuantificadores"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Quantifiers">Cuantificadores</a></h2>
-
-<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Quantifiers">el artículo original</a></div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: A continuación, <em>elemento</em> se refiere no solo a caracteres singulares, sino que también incluye <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">clases de caracteres</a>, <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes">escapes de propiedad Unicode</a>, <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">grupos y rangos</a>.</p>
-</div>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Caracteres</th>
-   <th scope="col">Significado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code><em>x</em>*</code></td>
-   <td>
-    <p>Concuerda 0 o más veces con el elemento "x" anterior. Por ejemplo, <code>/bo*/</code> reconoce a "boooo" en "Un fantasma booooed" y "b" en "A bird warbled", pero nada en "Una cabra gruñó".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>+</code></td>
-   <td>
-    <p>Encuentra 1 o más veces el elemento "x" anterior Equivalente a <code>{1,}</code>. Por ejemplo, <code>/a+/</code> encuentra la "a" en "candy" y todas las "a"es en "caaaaaaandy".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>?</code></td>
-   <td>
-    <p>Halla 0 o 1 vez el elemento "x" anterior. Por ejemplo, <code>/e?Le?/</code> reconoce a "el" en "ángel" y a "le" en "angle".</p>
-
-    <p>Si se usa inmediatamente después de cualquiera de los cuantificadores <code>*</code>, <code>+</code>, <code>?</code>o <code>{}</code>, hace que el cuantificador no codicioso (que reconoce el número mínimo de veces), a diferencia del predeterminado, que es codicioso (que reconoce el número máximo de veces).</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>{<em>n</em>}</code></td>
-   <td>
-    <p>Donde "n" es un número entero positivo, concuerda exactamente con "n" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{2}/</code> no reconoce la "a" en "candy", pero reconoce todas las "a"s en "caandy" y las dos primeras "a"s en "caaandy ".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>{<em>n</em>,}</code></td>
-   <td>
-    <p>Donde "n" es un número entero positivo, concuerda con al menos "n" apariciones del elemento "x". Por ejemplo, <code>/a{2,}/</code> no reconoce la "a" en "candy", pero reconoce todas las "a" en "caandy" y en "caaaaaaandy".</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code><em>x</em>{<em>n</em>,<em>m</em>}</code></td>
-   <td>
-    <p>Donde "n" es 0 o un número entero positivo, "m" es un número entero positivo y <code><em>m</em> &gt; <em>n</em></code>, reconoce por lo menos "n" y como máximo "m" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{1,3}/</code> no reconoce nada en "cndy", la "a" en "caramelo", las dos "a" en "caandy" y las tres primeras "a" está en "caaaaaaandy". Observa que al comparar "caaaaaaandy", las "aaa" encontradas, aunque la cadena original tenía más "a" s.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>
-    <p><code><em>x</em>*?</code><br>
-     <code><em>x</em>+?</code><br>
-     <code><em>x</em>??</code><br>
-     <code><em>x</em>{n}?</code><br>
-     <code><em>x</em>{n,}?</code><br>
-     <code><em>x</em>{n,m}?</code></p>
-   </td>
-   <td>
-    <p>De manera predeterminada, los cuantificadores como <code>*</code> y <code>+</code> son "codiciosos", lo cual significa que intentan hacer coincidir la mayor cantidad de cadena posible. El carácter <code>?</code> después del cuantificador hace que este sea "no codicioso": lo cual significa que se detendrá tan pronto como encuentre una concordancia. Por ejemplo, dada una cadena "algo como &lt;foo&gt; &lt;bar&gt; new &lt;/bar&gt; &lt;/foo&gt;":</p>
-
-    <ul>
-     <li><code>/&lt;.*&gt;/</code> reconocerá "&lt;foo&gt; &lt;bar&gt; nuevo &lt;/bar&gt; &lt;/foo&gt;"</li>
-     <li><code>/&lt;.*?&gt;/</code> encajará "&lt;foo&gt;"</li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Escapa_la_propiedad_Unicode"><a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes">Escapa la propiedad Unicode</a></h2>
-
-<div class="hidden">Si deseas contribuir a este documento, edita también <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes">el artículo original</a></div>
-
-<pre class="brush: js notranslate">// Valores no binarios
-\p{<em>UnicodePropertyValue</em>}
-\p{<em>UnicodePropertyName</em>=<em>UnicodePropertyValue</em>}
-
-// Valores binarios y no binarios
-\p{<em>UnicodeBinaryPropertyName</em>}
-
-// Negación: \P is negado \p
-\P{<em>UnicodePropertyValue</em>}
-\P{<em>UnicodeBinaryPropertyName</em>}
-</pre>
-
-<dl>
- <dt>UnicodeBinaryPropertyName</dt>
- <dd>El nombre de una <a href="https://tc39.es/ecma262/#table-binary-unicode-properties">propiedad binaria</a>. Por ejemplo: <code><a href="https://unicode.org/reports/tr18/#General_Category_Property">ASCII</a></code>, <code><a href="https://unicode.org/reports/tr44/#Alphabetic">Alpha</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#Diacritic">Diacrítica</a></code>, <code><a href="https://unicode.org/reports/tr51/#Emoji_Properties">Emoji</a></code>, <code><a href="https://unicode.org/reports/tr44/#Hex_Digit">Hex_Digit</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#White_Space">Espacio_blanco</a></code>, etc. Consulta <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropList.txt">Unicode Data PropList.txt</a> para obtener más información.</dd>
- <dt>UnicodePropertyName</dt>
-</dl>
-
-<dl>
- <dd>El nombre de una propiedad <a href="https://tc39.es/ecma262/#table-nonbinary-unicode-properties">no binaria</a>:</dd>
-</dl>
-
-<ul>
- <li><a href="https://unicode.org/reports/tr18/#General_Category_Property">General_Category</a> (<code>gc</code>)</li>
- <li><a href="https://unicode.org/reports/tr24/#Script">Script</a> (<code>sc</code>)</li>
- <li><a href="https://unicode.org/reports/tr24/#Script_Extensions">Script_Extensions</a> (<code>scx</code>)</li>
-</ul>
-
-<p>Consulta también <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropertyValueAliases.txt">PropertyValueAliases.txt</a></p>
-
-<dl>
- <dt>UnicodePropertyValue</dt>
- <dd>Uno de los fragmentos enumerados en la sección Valores, más adelante. Muchos valores tienen alias o abreviaturas (por ejemplo, el valor <code>Decimal_Number</code> para la propiedad <code>General_Category</code> se puede escribir cómo <code>Nd</code>, <code>digit</code>, o <code>Decimal_number</code>). Para la mayoría de los valores, la parte <em><code>UnicodePropertyName</code> </em> y el signo igual se pueden omitir. Si se especifica un <em><code>UnicodePropertyName</code></em>, el valor debe corresponder al tipo de propiedad proporcionado.</dd>
-</dl>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Puesto que hay muchas propiedades y valores disponibles, no las describiremos exhaustivamente aquí, sino que proporcionaremos varios ejemplos.</p>
-</div>
diff --git a/files/es/web/javascript/guide/regular_expressions/quantifiers/index.html b/files/es/web/javascript/guide/regular_expressions/quantifiers/index.html
new file mode 100644
index 0000000000..4693f0ff61
--- /dev/null
+++ b/files/es/web/javascript/guide/regular_expressions/quantifiers/index.html
@@ -0,0 +1,183 @@
+---
+title: Cuantificadores
+slug: Web/JavaScript/Guide/Regular_Expressions/Quantifiers
+tags:
+  - Expresiones Regulares
+  - Guía
+  - JavaScript
+  - Referencia
+  - cuantificadores
+  - regex
+translation_of: Web/JavaScript/Guide/Regular_Expressions/Quantifiers
+original_slug: Web/JavaScript/Guide/Regular_Expressions/Cuantificadores
+---
+<p>{{jsSidebar("JavaScript Guide")}}</p>
+
+<p>Los cuantificadores indican el número de caracteres o expresiones que deben coincidir.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/regexp-quantifiers.html", "taller")}}</div>
+
+<h2 id="Tipos">Tipos</h2>
+
+<div class="hidden">La siguiente tabla también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Cheatsheet", "esta hoja de referencia")}}. No olvides editarla también, ¡gracias!</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: A continuación, <em>elemento</em> se refiere no solo a caracteres individuales, sino que también incluye {{JSxRef("../Guide/Regular_Expressions/Character_Classes", "clases de caracteres")}}, {{JSxRef("../Guide/Regular_Expressions/Unicode_Property_Escapes", "escapes de propiedades Unicode")}}, {{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "grupos y rangos")}}.</p>
+</div>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Caracteres</th>
+   <th scope="col">Significado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code><em>x</em>*</code></td>
+   <td>
+    <p>Concuerda 0 o más veces con el elemento "x" anterior. Por ejemplo, <code>/bu*/</code> coincide con "buuuu" en "Un fantasma abuuuucheado" y "b" en "Un búho gorjeó", pero nada en "Una cabra gruñó".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>+</code></td>
+   <td>
+    <p>Encuentra 1 o más veces el elemento "x" anterior Equivalente a <code>{1,}</code>. Por ejemplo, <code>/a+/</code> coincide con la "<em>a</em>" en "candy" y todas las "<em>a</em>"es en "caaaaaaandy".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>?</code></td>
+   <td>
+    <p>Halla 0 o 1 vez el elemento "x" anterior. Por ejemplo, <code>/e?le?/</code> coincide con "el" en "ángel" y "ele" en "ángeles".</p>
+
+    <p>Si se usa inmediatamente después de cualquiera de los cuantificadores <code>*</code>, <code>+</code>, <code>?</code>, o <code>{}</code>, hace que el cuantificador <em>no sea codicioso</em> (es decir que coincida con el mínimo número de veces), a diferencia del predeterminado, que es codicioso (que coincide con el máximo número de veces).</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>{<em>n</em>}</code></td>
+   <td>
+    <p>Donde "n" es un número entero positivo, concuerda exactamente con "n" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{2}/</code> no coincide con la "<em>a</em>" de "candy", pero coincide con todas las "<em>a</em>"es de "caandy" y las dos primeras "<em>a</em>"es en "caaandy".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>{<em>n</em>,}</code></td>
+   <td>
+    <p>Donde "n" es un número entero positivo, concuerda con al menos "n" apariciones del elemento "x". Por ejemplo, <code>/a{2,}/</code> no coincide con las "<em>a</em>"es en "caramelo", pero coincide con todas las "<em>a</em>"es en "caaraamelo" y en "caaaaaaaraaaamelo".</p>
+   </td>
+  </tr>
+  <tr>
+   <td><code><em>x</em>{<em>n</em>,<em>m</em>}</code></td>
+   <td>
+    <p>Donde "n" es 0 o un número entero positivo, "m" es un número entero positivo y <code><em>m</em> &gt; <em>n</em></code> coincide con al menos "n" y como máximo "m" apariciones del elemento "x" anterior. Por ejemplo, <code>/a{1,3}/</code> no coincide con nada en "crmelo", la "<em>a</em>" en "carmelo", las dos "<em>a</em>"es en "caarmelo" y las tres primeras "<em>a</em>"es en "caaaaaaarmelo". Observa que al comparar "caaaaaaarmelo", encuentra las "aaa", aunque la cadena original tenía más "<em>a</em>"es.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>
+    <p><code><em>x</em>*?</code><br>
+     <code><em>x</em>+?</code><br>
+     <code><em>x</em>??</code><br>
+     <code><em>x</em>{n}?</code><br>
+     <code><em>x</em>{n,}?</code><br>
+     <code><em>x</em>{n,m}?</code></p>
+   </td>
+   <td>
+    <p>De manera predeterminada, los cuantificadores como <code>*</code> y <code>+</code> son "codiciosos", lo cual significa que intentan hacer coincidir la mayor cantidad posible de la cadena. El caracter <code>?</code> después del cuantificador hace que el cuantificador "no sea codicioso": lo cual significa que se detendrá tan pronto como encuentre una coincidencia. Por ejemplo, dada una cadena como "algún &lt;foo&gt; &lt;bar&gt; nuevo &lt;/bar&gt; &lt;/foo&gt;":</p>
+
+    <ul>
+     <li><code>/&lt;.*&gt;/</code> coincidirá con "&lt;foo&gt; &lt;bar&gt; nuevo &lt;/bar&gt; &lt;/foo&gt;"</li>
+     <li><code>/&lt;.*?&gt;/</code> coincidirá con "&lt;foo&gt;"</li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Patrón_repetido">Patrón repetido</h3>
+
+<pre class="brush: js notranslate">var palabraTerminadaConAes = /\w+a+\b/;
+var mensajeDelicado = "Esto es Espartaaaaaaa";
+
+console.table(mensajeDelicado.match(palabraTerminadaConAes)); // [ "Espartaaaaaaa" ]
+</pre>
+
+<h3 id="Conteo_de_caracteres">Conteo de caracteres</h3>
+
+<pre class="brush: js notranslate">var palabraDeUnaLetra = /\b\w\b/g;
+var palabraNoTanLarga = /\b\w{1,6}\b/g;
+var palabraLaaaaarga = /\b\w{10,}\b/g;
+
+var frase = "¿Por qué me tengo que sentar a estudiar las tablas de multiplicar?";
+
+console.table(frase.match(palabraDeUnaLetra)); // ["a"]
+console.table(frase.match(palabraNoTanLarga));    // ["Por", "qu", "me", "tengo", "que", "sentar", "a", "las", "tablas", "de"]
+console.table(frase.match(palabraLaaaaarga));      // ["multiplicar"]
+</pre>
+
+<h3 id="Caracter_opcional">Caracter opcional</h3>
+
+<pre class="brush: js notranslate">var londinText = "He asked his neighbour a favour.";
+var yanquiText = "He asked his neighbor a favor.";
+
+var regexpEnding = /\w+ou?r/g;
+// \w+ Una o varias letras
+// o   seguida de una "o",
+// u?  opcionalmente seguida de una "u"
+// r   seguida de una "r"
+
+console.table(londinText.match(regexpEnding));
+// ["neighbour", "favour"]
+
+console.table(yanquiText.match(regexpEnding));
+// ["neighbor", "favor"]
+</pre>
+
+<h3 id="Codicioso_versus_no_codicioso">Codicioso versus no codicioso</h3>
+
+<pre class="brush: js notranslate">var texto = "Debo estar muy cerca del centro de la tierra.";
+var regexpCodiciosa = /[\w ]+/;
+// [\w ]      una letra del alfabeto latino o un espacio en blanco
+//      +     una o varias veces
+
+console.log(texto.match(regexpCodiciosa)[0]);
+// "Debo estar muy cerca del centro de la tierra."
+// casi todo el texto coincide (omite el caracter de punto)
+
+var regexpNoCodiciosa = /[\w ]+?/; // Observa el signo de interrogación
+console.log(texto.match(regexpNoCodiciosa));
+// "D"
+// La coincidencia es la más pequeña posible
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-quantifier', 'RegExp: Quantifiers')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
+
+  <ul>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Escapes_de_propiedades_Unicode", "Escapes de propiedades Unicode")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
+  </ul>
+ </li>
+ <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/guide/regular_expressions/unicode_property_escapes/index.html b/files/es/web/javascript/guide/regular_expressions/unicode_property_escapes/index.html
new file mode 100644
index 0000000000..3539c66acf
--- /dev/null
+++ b/files/es/web/javascript/guide/regular_expressions/unicode_property_escapes/index.html
@@ -0,0 +1,178 @@
+---
+title: Escapes de propiedades Unicode
+slug: Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes
+tags:
+  - Expresiones Regulares
+  - Guía
+  - JavaScript
+  - Referencia
+  - escapes de propiedades unicode
+  - regex
+translation_of: Web/JavaScript/Guide/Regular_Expressions/Unicode_Property_Escapes
+original_slug: Web/JavaScript/Guide/Regular_Expressions/Escapes_de_propiedades_Unicode
+---
+<p>{{jsSidebar("JavaScript Guide")}}</p>
+
+<p>Los <strong>escapes de propiedad Unicode</strong> en las {{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}} permiten la coincidencia de caracteres según sus propiedades Unicode. Un caracter se describe mediante varias propiedades que, o bien, son binarias ("tipo booleano") o, no binarias. Por ejemplo, puedes usar escapes de propiedades Unicode para reconocer emojis, signos de puntuación, letras (incluso letras de idiomas específicos o scripts), etc.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/regexp-unicode-property-escapes.html", "taller")}}</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Para que funcionen los escapes de propiedad Unicode, una expresión regular debe utilizar {{JSxRef("../Guide/Regular_Expressions", "la bandera <code>u</code>", "#Busqueda_avanzada_con_banderas")}} que indica que una cadena se debe considerar como una serie de puntos de código Unicode. Consulta también {{JSxRef("Objetos_globales/RegExp/unicode", "RegExp.prototype.unicode")}}.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Algunas propiedades Unicode abarcan muchos más caracteres que algunas {{JSxRef("../Guide/Regular_Expressions/Character_Classes", "clases de caracteres")}} (como <code>\w</code> que coincide solo con letras latinas, desde <code>a</code> hasta <code>z</code>) pero esta última es más compatible con los navegadores (a partir de enero de 2020).</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<div class="hidden">La siguiente sección también está duplicada en {{JSxRef("../Guide/Regular_Expressions/Hoja_de_referencia", "esta hoja de trucos")}}. No olvides editarla también, ¡gracias!</div>
+
+<pre class="brush: js notranslate">// Valores no binarios
+\p{<em>UnicodePropertyValue</em>}
+\p{<em>UnicodePropertyName</em>=<em>UnicodePropertyValue</em>}
+
+// Valores binarios y no binarios
+\p{<em>UnicodeBinaryPropertyName</em>}
+
+// Negación: \P se niega con \p
+\P{<em>UnicodePropertyValue</em>}
+\P{<em>UnicodeBinaryPropertyName</em>}
+</pre>
+
+<ul>
+ <li><a href="https://unicode.org/reports/tr18/#General_Category_Property">Categoría general</a> (<code>gc</code> por «<em><strong>g</strong>eneral <strong>c</strong>ategory</em>»)</li>
+ <li><a href="https://unicode.org/reports/tr24/#Script">Script</a> (<code>sc</code> por «<em><strong>sc</strong>ript</em>»)</li>
+ <li><a href="https://unicode.org/reports/tr24/#Script_Extensions">Extensiones de script</a> (<code>scx</code> por «<em><strong>sc</strong>ript e<strong>x</strong>tensions</em>»)</li>
+</ul>
+
+<p>Consulta también <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropertyValueAliases.txt">PropertyValueAliases.txt<span style="display: none;"> </span></a></p>
+
+<dl>
+ <dt>UnicodeBinaryPropertyName</dt>
+ <dd>El nombre de una <a href="https://tc39.es/ecma262/#table-binary-unicode-properties">propiedad binaria</a>. Por ejemplo: <code><a href="https://unicode.org/reports/tr18/#General_Category_Property">ASCII</a></code>, <code><a href="https://unicode.org/reports/tr44/#Alphabetic">Alfabético</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#Diacritic">Diacrítico</a></code>, <code><a href="https://unicode.org/reports/tr51/#Emoji_Properties">Emoji</a></code>, <code><a href="https://unicode.org/reports/tr44/#Hex_Digit">Dígito hexadecimal</a></code>, <code>Math</code>, <code><a href="https://unicode.org/reports/tr44/#White_Space">Espacio en blanco</a></code>, etc. Consulta <a href="https://www.unicode.org/Public/UCD/latest/ucd/PropList.txt">Unicode Data PropList.txt</a> para obtener más información.</dd>
+ <dt>NombreDePropiedadUnicode</dt>
+ <dd>El nombre de una propiedad <a href="https://tc39.es/ecma262/#table-nonbinary-unicode-properties">no binaria</a>:</dd>
+ <dt>ValorDePropiedadUnicode</dt>
+ <dd>Uno de los fragmentos enumerados en la sección Valores, más adelante. Muchos valores tienen alias o abreviaturas (por ejemplo, el valor <code>Decimal_Number</code> para la propiedad <code>General_Category</code> se puede escribir <code>Nd</code>, <code>digit</code>, o <code>Decimal_Number</code>). Para la mayoría de los valores, la parte <em><code>NombreDePropiedadUnicode</code></em> y el signo igual se pueden omitir. Si se especifica un <em><code>NombreDePropiedadUnicode</code></em>, el valor debe corresponder al tipo de propiedad proporcionado.</dd>
+</dl>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Debido a que hay muchas propiedades y valores disponibles, no los describiremos exhaustivamente aquí, en su lugar proporcionaremos varios ejemplos.</p>
+</div>
+
+<h2 id="Justificación">Justificación</h2>
+
+<p>Antes de ES2018, no existía una forma eficiente de hacer coincidir caracteres de diferentes conjuntos basados en <code>scripts</code> (como macedonio, griego, georgiano, etc.) o <code>propertyName</code> (como Emoji, etc.) en JavaScript. Consulta la <a href="https://github.com/tc39/proposal-regexp-unicode-property-escapes">propuesta tc39 sobre escapes de propiedad Unicode</a> para obtener más información.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Categorías_generales">Categorías generales</h3>
+
+<p>Las categorías generales se utilizan para clasificar caracteres Unicode, y hay subcategorías disponibles para definir una categorización más precisa. Es posible utilizar formas cortas o largas en los escapes de propiedades Unicode.</p>
+
+<p>Se pueden utilizar para reconocer letras, números, símbolos, signos de puntuación, espacios, etc. Para obtener una lista más exhaustiva de categorías generales, consulta <a href="https://unicode.org/reports/tr18/#General_Category_Property">la especificación Unicode</a>.</p>
+
+<pre class="brush: js notranslate">// encontrar todas las letras de un texto
+let historia = "Es el gato de Cheshire: ahora tendré alguien con quien hablar";
+
+// Forma más explícita
+historia.match(/\p{General_Category=Letter}/gu);
+
+// No es obligatorio utilizar el nombre de la propiedad para las categorías generales
+historia.match(/\p{Letter}/gu);
+
+// Esto es equivalente (alias corto):
+historia.match(/\p{L}/gu);
+
+// Esto también es equivalente (conjunción de todas las subcategorías que utilizan alias cortos)
+historia.match(/\p{Lu}|\p{Ll}|\p{Lt}|\p{Lm}|\p{Lo}/gu);
+</pre>
+
+<h3 id="Scripts_y_extensiones_de_script">Scripts y extensiones de script</h3>
+
+<p>Algunos idiomas usan diferentes signos para su sistema de escritura. Por ejemplo, el Inglés y el Español se escriben con los signos latinos, mientras que el Árabe y el Ruso se escriben con otros signos (Árabe y Cirílico, respectivamente). Las propiedades Unicode <code>Script</code> y <code>Script_Extensions</code> permiten que las expresiones regulares coincidan con los caracteres según el script con el que se utilizan principalmente (<code>Script</code>) o según el conjunto de los scripts a los que pertenecen (<code>Script_Extensions</code>).</p>
+
+<p>Por ejemplo, <code>A</code> pertenece al script <code>Latin</code> y <code>ε</code> al script <code>Greek</code> (Griego).</p>
+
+<pre class="brush: js notranslate">let caracteresMezclados = "aεЛ";
+
+// Usando el nombre canónico "largo" del script
+caracteresMezclados.match(/\p{Script=Latin}/u); // a
+
+// Usando un alias corto para el script
+caracteresMezclados.match(/\p{Script=Greek}/u); // ε
+
+// Usando el nombre corto Sc para la propiedad Script
+caracteresMezclados.match(/\p{Sc=Cyrillic}/u); // Л
+</pre>
+
+<p>Para obtener más detalles, consulta <a href="https://unicode.org/reports/tr24/#Script">la especificación Unicode</a> y la <a href="https://tc39.es/ecma262/#table-unicode-script-values">Tabla de scripts en la especificación ECMAScript</a>.</p>
+
+<p>Si se usa un carácter en un conjunto limitado de scripts, la propiedad <code>Script</code> solo coincidirá con el script "predominante" utilizado. Si quieres hacer coincidir caracteres basados en un script "no predominante", podrías usar la propiedad <code>Script_Extensions</code> (<code>Scx</code> para abreviar).</p>
+
+<pre class="brush: js notranslate">// ٢ es el dígito 2 en notación Árabe-Índica
+// si bien está escrito en un script predominante en árabe
+// también se puede escribir en el script Thaana
+
+"٢".match(/\p{Script=Thaana}/u);
+// null ya que Thaana no es el script predominante     super()
+
+"٢".match(/\p{Script_Extensions=Thaana}/u);
+// ["٢", index: 0, input: "٢", groups: undefined]
+</pre>
+
+<h3 id="Escapes_de_propiedades_Unicode_versus_Clases_de_caracteres">Escapes de propiedades Unicode versus Clases de caracteres</h3>
+
+<p>Con las expresiones regulares de JavaScript, también es posible utilizar {{JSxRef("../Guide/Regular_Expressions/Clases_de_caracteres", "clases de caracteres")}} y especialmente <code>\w</code> o <code>\d</code> para hacer coincidir letras o dígitos. Sin embargo, estos formularios solo coinciden con caracteres de la escritura <em>latina</em> (en otras palabras, de la <code>a</code> a la <code>z</code> y <code>A</code> a <code>Z</code> para <code>\w</code> y <code>0</code> a <code>9</code> para <code>\d</code>). Como se muestra en {{JSxRef("../Guide/Regular_Expressions/Clases_de_caracteres", "este ejemplo", "#Busca_una_palabra_de_caracteres_Unicode")}}, puede ser un poco torpe trabajar con textos no latinos.</p>
+
+<p>Las categorías de escape de propiedad Unicode abarcan muchos más caracteres y <code>\p{Letter}</code> o <code>\p{Number}</code> funcionarán para cualquier script.</p>
+
+<pre class="brush: js notranslate">// Intentando usar rangos para evitar limitaciones de \w:
+
+const textoNoEs = "Приключения Алисы в Стране чудес";
+const regexpPalabraBMP = /([\u0000-\u0019\u0021-\uFFFF])+/gu;
+// BMP pasa por U+0000 a U+FFFF pero el espacio es U+0020
+
+console.table(textoNoEs.match(regexpPalabraBMP));
+
+// El uso de la propiedad Unicode se escapa en su lugar
+const regexpEPU = /\p{L}+/gu;
+console.table(textoNoEs.match(regexpEPU));
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-runtime-semantics-unicodematchproperty-p', 'RegExp: Escapes de propiedades Unicode')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>Para obtener información sobre la compatibilidad del navegador, consulta la {{JSxRef("../Guide/Regular_Expressions", "tabla principal de compatibilidad de expresiones regulares", "#Compatibilidad_del_navegador")}}.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("../Guide/Regular_Expressions", "Guía de expresiones regulares")}}
+  <ul>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Character_Classes", "Clases de caracteres")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Assertions", "Aserciones")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Cuantificadores", "Cuantificadores")}}</li>
+   <li>{{JSxRef("../Guide/Regular_Expressions/Grupos_y_rangos", "Grupos y rangos")}}</li>
+  </ul>
+ </li>
+ <li>{{JSxRef("Objetos_globales/RegExp", "El constructor RegExp()")}}</li>
+ <li>{{JSxRef("Objetos_globales/RegExp/unicode", "RegExp.prototype.unicode")}}</li>
+ <li><a href="https://en.wikipedia.org/wiki/Unicode_character_property">Propiedades de caracteres unicode — Wikipedia</a></li>
+ <li><a href="https://2ality.com/2017/07/regexp-unicode-property-escapes.html">Una entrada en el blog de Axel Rauschmayer sobre los escapes de propiedades Unicode</a></li>
+ <li><a href="https://unicode.org/reports/tr18/#Categories">El documento Unicode para las propiedades Unicode</a></li>
+</ul>
diff --git a/files/es/web/javascript/guide/trabajando_con_objectos/index.html b/files/es/web/javascript/guide/trabajando_con_objectos/index.html
deleted file mode 100644
index 84a9854d9a..0000000000
--- a/files/es/web/javascript/guide/trabajando_con_objectos/index.html
+++ /dev/null
@@ -1,493 +0,0 @@
----
-title: Trabajando con objetos
-slug: Web/JavaScript/Guide/Trabajando_con_objectos
-tags:
-  - Comparación de objetos
-  - Constructor
-  - Documento
-  - Guía
-  - JavaScript
-  - Objeto
-  - Principiante
-translation_of: Web/JavaScript/Guide/Working_with_Objects
----
-<div>{{jsSidebar("Guía de JavaScript")}} {{PreviousNext("Web/JavaScript/Guide/Keyed_collections", "Web/JavaScript/Guide/Details_of_the_Object_Model")}}</div>
-
-<p class="summary">JavaScript está diseñado en un paradigma simple basado en objetos. Un objeto es una colección de propiedades, y una propiedad es una asociación entre un nombre (o <em>clave</em>) y un valor. El valor de una propiedad puede ser una función, en cuyo caso la propiedad es conocida como un método. Además de los objetos que están predefinidos en el navegador, puedes definir tus propios objetos. Este capítulo describe cómo usar objetos, propiedades, funciones y métodos; y cómo crear tus propios objectos.</p>
-
-<h2 id="Visión_general_sobre_Objetos">Visión general sobre Objetos</h2>
-
-<p>Los objetos en JavaScript, como en tantos otros lenguajes de programación, se pueden comparar con objetos de la vida real. El concepto de Objetos en JavaScript se puede entender con objetos tangibles de la vida real.</p>
-
-<p>En JavaScript, un objeto es un entidad independiente con propiedades y tipos. Compáralo con una taza, por ejemplo. Una taza es un objeto con propiedades. Una taza tiene un color, un diseño, un peso, un material del que está hecha, etc. Del mismo modo, los objetos de JavaScript pueden tener propiedades que definan sus características.</p>
-
-<h2 id="Objetos_y_propiedades">Objetos y propiedades</h2>
-
-<p>Un objeto de JavaScript tiene propiedades asociadas a él. Una propiedad de un objeto se puede explicar como una variable adjunta al objeto. Las propiedades de un objeto básicamente son lo mismo que las variables comunes de JavaScript, excepto por el nexo con el objeto. Las propiedades de un objeto definen las características del objeto. Accedes a las propiedades de un objeto con una simple notación de puntos:</p>
-
-<pre class="brush: js notranslate">objectName.propertyName
-</pre>
-
-<p>Como todas las <code>variables</code> de JavaScript, tanto el nombre del objeto (que puede ser una variable normal) como el nombre de la propiedad son sensibles a mayúsculas y minúsculas. Puedes definir propiedades asignándoles un valor. Por ejemplo, vamos a crear un objeto llamado <code>myCar</code> y le vamos a asignar propiedades denominadas <code>make</code>, <code>model</code>, y <code>year</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">var myCar = new Object();
-myCar.make = 'Ford';
-myCar.model = 'Mustang';
-myCar.year = 1969;
-</pre>
-
-<p>El ejemplo anterior también se podría escribir usando un <strong><a href="/es/docs/Web/JavaScript/Guide/Working_with_Objects#Object_initializers">iniciador de objeto</a></strong>, que es una lista delimitada por comas de cero o más pares de nombres de propiedad y valores asociados de un objeto, encerrados entre llaves (<code>{}</code>):</p>
-
-<pre class="brush: js notranslate">var myCar = {
-    make: 'Ford',
-    model: 'Mustang',
-    year: 1969
-};
-</pre>
-
-<p>Las propiedades no asignadas de un objeto son {{jsxref("undefined")}} (y​no {{jsxref("null")}}).</p>
-
-<pre class="brush: js notranslate">myCar.color; // undefined</pre>
-
-<p>También puedes acceder o establecer las propiedades de los objetos en JavaScript mediante la notación de corchetes ↑[]↓ (Para más detalle ve <a href="/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors">Accesores de propiedades</a>). Los objetos, a veces son llamados <em>arreglos asociativos</em>, debido a que cada propiedad está asociada con un valor de cadena que se puede utilizar para acceder a ella. Por lo tanto, por ejemplo, puedes acceder a las propiedades del objeto <code>myCar</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">myCar['make']  = 'Ford';
-myCar['model'] = 'Mustang';
-myCar['year']  = 1969;
-</pre>
-
-<p>El nombre de la propiedad de un objeto puede ser cualquier cadena válida de JavaScript, o cualquier cosa que se pueda convertir en una cadena, incluyendo una cadena vacía. Sin embargo, cualquier nombre de propiedad que no sea un identificador válido de JavaScript (por ejemplo, el nombre de alguna propiedad que tenga un espacio o un guión, o comience con un número) solo se puede acceder utilizando la notación de corchetes. Esta notación es muy útil también cuando los nombres de propiedades son determinados dinámicamente (cuando el nombre de la propiedad no se determina hasta el tiempo de ejecución). Ejemplos de esto se muestran a continuación:</p>
-
-<pre class="brush: js notranslate">// Se crean y asignan cuatro variables de una sola vez,
-// separadas por comas
-var myObj = new Object(),
-    str = 'myString',
-    rand = Math.random(),
-    obj = new Object();
-
-myObj.type                 = 'Sintaxis de puntos';
-myObj['fecha de creación'] = 'Cadena con espacios';
-myObj[str]                 = 'Valor de cadena';
-myObj[rand]                = 'Número aleatorio';
-myObj[obj]                 = 'Object';
-myObj['']                  = 'Incluso una cadena vacía';
-
-console.log(myObj);
-</pre>
-
-<p>Por favor, ten en cuenta que todas las claves con notación en corchetes se convierten a cadenas a menos que estas sean símbolos, ya que los nombres de las propiedades (claves) en Javascript pueden solo pueden ser cadenas o símbolos (en algún momento, los nombres privados también serán agregados a medida que progrese la <a href="https://github.com/tc39/proposal-class-fields">propuesta de los campos de clase</a>, pero no las usarás con el formato <code>[]</code>). Por ejemplo, en el código anterior, cuando la clave <code>obj</code> se añadió a <code>myObj</code>, Javascript llamará al método {{jsxref("Object.toString", "obj.toString()")}}, y usará la cadena resultante de esta llamada como la nueva clave.</p>
-
-<p>También puedes acceder a las propiedades mediante el uso de un valor de cadena que se almacena en una variable:</p>
-
-<pre class="brush: js notranslate">var propertyName = 'make';
-myCar[propertyName] = 'Ford';
-
-propertyName = 'model';
-myCar[propertyName] = 'Mustang';
-</pre>
-
-<p>Puedes usar la notación de corchetes con <code><a href="/es/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></code> para iterar sobre todas las propiedades enumerables de un objeto. Para ilustrar cómo funciona esto, la siguiente función muestra las propiedades del objeto cuando pasas el objeto y el nombre del objeto como argumentos a la función:</p>
-
-<pre class="brush: js notranslate">function showProps(obj, objName) {
-  var result = ``;
-  for (var i in obj) {
-    // obj.hasOwnProperty() se usa para filtrar propiedades de la cadena de prototipos del objeto
-    if (obj.hasOwnProperty(i)) {
-      result += `${objName}.${i} = ${obj[i]}\n`;
-    }
-  }
-  return result;
-}
-</pre>
-
-<p>Por lo tanto, la llamada a la función <code>showProps(myCar, "myCar")</code> devolverá lo siguiente:</p>
-
-<pre class="brush: js notranslate">myCar.make = Ford
-myCar.model = Mustang
-myCar.year = 1969</pre>
-
-<h2 id="Enumerar_las_propiedades_de_un_objeto">Enumerar las propiedades de un objeto</h2>
-
-<p>A partir de <a href="/es/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla" title="/es/docs/JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5</a>, hay tres formas nativas para enumerar/recorrer las propiedades de objetos:</p>
-
-<ul>
- <li><code><a href="/es/docs/Web/JavaScript/Reference/Statements/for...in" title="/es/docs/JavaScript/Reference/Statements/for...in">bucles for...in</a></code><br>
-  Este método recorre todas las propiedades enumerables de un objeto y su cadena de prototipos</li>
- <li>{{jsxref("Object.keys", "Object.keys(o)")}}<br>
-  Este método devuelve un arreglo con todos los nombres de propiedades enumerables ("<code>claves</code>") propias (no en la cadena de prototipos) de un objeto <code>o</code>.</li>
- <li>{{jsxref("Object.getOwnPropertyNames", "Object.getOwnPropertyNames(o)")}}<br>
-  Este método devuelve un arreglo que contiene todos los nombres (enumerables o no) de las propiedades de un objeto <code>o</code>.</li>
-</ul>
-
-<p>Antes de ECMAScript 5, no existía una manera nativa para enumerar todas las propiedades de un objeto. Sin embargo, esto se puede lograr con la siguiente función:</p>
-
-<pre class="brush: js notranslate">function listAllProperties(o) {
-       var objectToInspect;
-       var result = [];
-
-       for(objectToInspect = o; objectToInspect !== null;
-           objectToInspect = Object.getPrototypeOf(objectToInspect)) {
-        result = result.concat(
-            Object.getOwnPropertyNames(objectToInspect)
-        );
-    }
-
-        return result;
-}
-</pre>
-
-<p>Esto puede ser útil para revelar propiedades "ocultas" (propiedades de la cadena de prototipos a las que no se puede acceder a través del objeto, porque otra propiedad tiene el mismo nombre en la cadena de prototipos). Enumerar las propiedades accesibles solo es posible eliminando los duplicados en el arreglo.</p>
-
-<h2 id="Creación_de_nuevos_objetos">Creación de nuevos objetos</h2>
-
-<p>JavaScript tiene una colección de objetos predefinidos. Además, puedes crear tus propios objetos. En JavaScript 1.2 y versiones posteriores, puedes crear un objeto usando un <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">iniciador de objeto</a>. Como alternativa, puedes crear primero una función constructora y luego crear una instancia de un objeto invocando esa función con el operador <code>new</code>.</p>
-
-<h3 id="Uso_de_iniciadores_de_objeto"><span id="Object_initializers">Uso de iniciadores de objeto</span></h3>
-
-<p>Además de la creación de objetos utilizando una función constructora, puedes crear objetos utilizando un <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">iniciador de objeto</a>. El uso de iniciadores de objetos a veces se denomina crear objetos con notación literal. "Iniciador de objeto" es consistente con la terminología utilizada por C++.</p>
-
-<p>La sintaxis para un objeto usando un iniciador de objeto es:</p>
-
-<pre class="brush: js notranslate">var obj = { property_1:   value_1,   // property_# puede ser un identificador...
-            2:            value_2,   // o un número...
-            // ...,
-            'property n': value_n }; // o una cadena
-</pre>
-
-<p>donde <code>obj</code> es el nombre del nuevo objeto, cada <code>property_<var>i</var></code> es un identificador (ya sea un nombre, un número o una cadena literal), y cada <code>value_<var>i</var></code> es una expresión cuyo valor se asigna a la <code>property_<var>i</var></code>. El <code>obj</code> y la asignación es opcional; si no necesitas hacer referencia a este objeto desde otro lugar, no necesitas asignarlo a una variable. (Ten en cuenta que tal vez necesites envolver el objeto literal entre paréntesis si el objeto aparece donde se espera una declaración, a fin de no confundir el literal con una declaración de bloque).</p>
-
-<p>Los iniciadores de objetos son expresiones, y cada iniciador de objeto da como resultado un nuevo objeto donde la instrucción de creación sea ejecutada. Los iniciadores de objetos idénticos crean objetos distintos que no se compararán entre sí como iguales. Los objetos se crean como si se hiciera una llamada a <code>new Object()</code>; es decir, los objetos hechos a partir de expresiones literales de objeto son instancias de <code>Object</code>.</p>
-
-<p>La siguiente declaración crea un objeto y lo asigna a la variable <code>x</code> si y solo si la expresión <code>cond</code> es <code>true</code>.</p>
-
-<pre class="brush: js notranslate">if (cond) var x = {greeting: '¡Hola!'};
-</pre>
-
-<p>El siguiente ejemplo crea <code>myHonda</code> con tres propiedades. Observa que la propiedad <code>engine</code> también es un objeto con sus propias propiedades.</p>
-
-<pre class="brush: js notranslate">var myHonda = {color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}};
-</pre>
-
-<p>También puedes utilizar iniciadores de objetos para crear arreglos. Consulta <a href="/es/docs/Web/JavaScript/Guide/Grammar_and_types#Array_literals">arreglos literales</a>.</p>
-
-<h3 id="Usar_una_función_constructora">Usar una función constructora</h3>
-
-<p>Como alternativa, puedes crear un objeto con estos dos pasos:</p>
-
-<ol>
- <li>Definir el tipo de objeto escribiendo una función constructora. Existe una fuerte convención, con buena razón, para utilizar en mayúscula la letra inicial.</li>
- <li>Crear una instancia del objeto con el operador <code>new</code>.</li>
-</ol>
-
-<p>Para definir un tipo de objeto, crea una función para el objeto que especifique su nombre, propiedades y métodos. Por ejemplo, supongamos que deseas crear un tipo de objeto para coches. Quieres llamar <code>Car</code> a este tipo de objeto, y deseas que tenga las siguientes propiedades: <code>make</code>, <code>model</code> y <code>year</code>. Para ello, podrías escribir la siguiente función:</p>
-
-<pre class="brush: js notranslate">function Car(make, model, year) {
-  this.make = make;
-  this.model = model;
-  this.year = year;
-}
-</pre>
-
-<p>Observa el uso de <code>this</code> para asignar valores a las propiedades del objeto en función de los valores pasados a la función.</p>
-
-<p>Ahora puedes crear un objeto llamado <code>myCar</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">var mycar = new Car('Eagle', 'Talon TSi', 1993);
-</pre>
-
-<p>Esta declaración crea <code>myCar</code> y le asigna los valores especificados a sus propiedades. Entonces el valor de <code>myCar.make</code> es la cadena "Eagle", para <code>myCar.year</code> es el número entero 1993, y así sucesivamente.</p>
-
-<p>Puedes crear cualquier número de objetos <code>Car</code> con las llamadas a <code>new</code>. Por ejemplo,</p>
-
-<pre class="brush: js notranslate">var kenscar = new Car('Nissan', '300ZX', 1992);
-var vpgscar = new Car('Mazda', 'Miata', 1990);
-</pre>
-
-<p>&lt;s0&gt;Un objeto puede tener una propiedad que en sí misma es otro objeto. Por ejemplo, supongamos que defines un objeto llamado <code>person</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">function Person(name, age, sex) {
-  this.name = name;
-  this.age = age;
-  this.sex = sex;
-}
-</pre>
-
-<p>y luego instancias dos nuevos objetos <code>person</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">var rand = new Person('Rand McKinnon', 33, 'M');
-var ken = new Person('Ken Jones', 39, 'M');
-</pre>
-
-<p>Entonces, puedes volver a escribir la definición de <code>Car</code> para incluir una propiedad <code>owner</code> que tomará el objeto <code>person</code>, de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">function Car(make, model, year, owner) {
-  this.make = make;
-  this.model = model;
-  this.year = year;
-  this.owner = owner;
-}
-</pre>
-
-<p>Para crear instancias de los nuevos objetos, utiliza lo siguiente:</p>
-
-<pre class="brush: js notranslate">var car1 = new Car('Eagle', 'Talon TSi', 1993, rand);
-var car2 = new Car('Nissan', '300ZX', 1992, ken);
-</pre>
-
-<p>Nota que en lugar de pasar un valor de cadena o entero cuando se crean los nuevos objetos, las declaraciones anteriores pasan al objetos <code>rand</code> y <code>ken</code> como argumentos para los <code>owner</code>s. Si luego quieres averigüar el nombre del propietario del <code>car2</code>, puedes acceder a la propiedad de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">car2.owner.name
-</pre>
-
-<p>Ten en cuenta que siempre se puede añadir una propiedad a un objeto previamente definido. Por ejemplo, la declaración</p>
-
-<pre class="brush: js notranslate">car1.color = 'black';
-</pre>
-
-<p>agrega la propiedad <code>color</code> a <code>car1</code>, y le asigna el valor "<code>black</code>". Sin embargo, esto no afecta a ningún otro objeto. Para agregar la nueva propiedad a todos los objetos del mismo tipo, tienes que añadir la propiedad a la definición del tipo de objeto <code>Car</code>.</p>
-
-<h3 id="Usar_el_método_Object.create">Usar el método <code>Object.create</code></h3>
-
-<p>Los objetos también se pueden crear por medio del método {{jsxref("Object.create()")}}. Este método puede ser muy útil, ya que te permite elegir el prototipo del objeto que deseas crear, sin tener que definir una función constructora.</p>
-
-<pre class="brush: js notranslate">// Propiedades y método de encapsulación para Animal
-var Animal = {
-  type: 'Invertebrates', // Valor predeterminado de las propiedades
-  displayType: function() {  // Método que mostrará el tipo de Animal
-    console.log(this.type);
-  }
-};
-
-// Crea un nuevo tipo de animal llamado animal1
-var animal1 = Object.create(Animal);
-animal1.displayType(); // Muestra: Invertebrates
-
-// Crea un nuevo tipo de animal llamado Fishes
-var fish = Object.create(Animal);
-fish.type = 'Fishes';
-fish.displayType();    // Muestra: Fishes</pre>
-
-<h2 id="Herencia">Herencia</h2>
-
-<p>Todos los objetos en JavaScript heredan de al menos otro objeto. El objeto del que se hereda se conoce como el prototipo, y las propiedades heredadas se pueden encontrar en el objeto <code>prototype</code> del constructor. Para más información consulta <a href="/es/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">Herencia y cadena prototipos</a>.</p>
-
-<h2 id="Propiedades_del_objeto_indexado">Propiedades del objeto indexado</h2>
-
-<p>En &lt;s0&gt;JavaScript 1.0&lt;/s0&gt;, puedes hacer referencia a una propiedad de un objeto, ya sea por el nombre de la propiedad o por su índice ordinal. Si inicialmente defines una propiedad por su nombre, siempre debes referirte a ella por su nombre, y si inicialmente defines una propiedad por un índice, siempre debes referirte a ella por su índice.</p>
-
-<p>Esta restricción se aplica cuando creas un objeto y sus propiedades con una función constructora (como hicimos anteriormente con el tipo de objeto <code>Car</code>) y cuando defines propiedades individuales explícitamente (por ejemplo, <code>myCar.color = "red"</code>). Si inicialmente defines una propiedad de objeto con un índice, como <code>myCar[5] = "25 mpg"</code>, posteriormente te refiere a la propiedad solo como <code>myCar[5]</code>.</p>
-
-<p>La excepción a esta regla son los objetos HTML, como por ejemplo los objetos contenidos en <code>formularios</code>. Siempre puedes hacer referencia a los objetos en estos objetos en forma de arreglo por su número ordinal (según el lugar en el que aparecen en el documento) o por su nombre (si está definido). Por ejemplo, si la segunda etiqueta <code>&lt;FORM&gt;</code> en un documento tiene un atributo <code>NAME</code> con valor "<code>myForm</code>", puedes hacer referencia al formulario como <code>document.forms[1]</code> o <code>document.forms["myForm"]</code> o <code>document.forms.myForm</code>.</p>
-
-<h2 id="Definición_de_las_propiedades_de_un_tipo_de_objeto">Definición de las propiedades de un tipo de objeto</h2>
-
-<p>Puedes agregar una propiedad a un tipo de objeto definido previamente mediante el uso de la propiedad <code>prototype</code>. Esto define una propiedad que es compartida por todos los objetos del tipo especificado, en lugar de por una sola instancia del objeto. El siguiente código agrega una propiedad <code>color</code> a todos los objetos del tipo <code>Car</code>, y luego asigna un valor a la propiedad <code>color</code> del objeto <code>car1</code>.</p>
-
-<pre class="brush: js notranslate">Car.prototype.color = null;
-car1.color = 'black';
-</pre>
-
-<p>Para más información, consulta la <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype" title="/es/docs/JavaScript/Reference/Global Objects/Function/prototype">propiedad <code>prototype</code></a> del objeto <code>Function</code> en la <a href="/es/docs/Web/JavaScript/Reference">Referencia de JavaScript</a>.</p>
-
-<h2 id="Definición_de_métodos">Definición de métodos</h2>
-
-<p>Un <em>método</em> es una función asociada a un objeto, o, simplemente, un método es una propiedad de un objeto que es una función. Los métodos se definen normalmente como una función, con excepción de que tienen que ser asignados como la propiedad de un objeto. Consulte también <a href="/es/docs/Web/JavaScript/Reference/Functions/Method_definitions">definiciones de métodos</a> para obtener más detalles. Un ejemplo puede ser:</p>
-
-<pre class="brush: js notranslate">objectName.methodname = functionName;
-
-var myObj = {
-  myMethod: function(params) {
-    // ...hacer algo
-  }
-
-  // O ESTO TAMBIÉN FUNCIONA
-
-  myOtherMethod(params) {
-    // ...hacer algo más
-  }
-};
-</pre>
-
-<p>&lt;s0&gt;donde <code>objectName</code> es un objeto existente, <code>methodname</code> es el nombre que se le va a asignar al método, y <code>functionName</code> es el nombre de la función.</p>
-
-<p>Entonces puedes llamar al método en el contexto del objeto de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">object.methodname(params);
-</pre>
-
-<p>Puedes definir métodos para un tipo de objeto incluyendo una definición del método en la función constructora del objeto. Podrías definir una función que formateé y muestre las propiedades de los objetos del tipo <code>Car</code> previamente definidas; por ejemplo:</p>
-
-<pre class="brush: js notranslate">function displayCar() {
-  var result = `Un hermoso ${this.year} ${this.make} ${this.model}`;
-  pretty_print(result);
-}
-</pre>
-
-<p>donde <code>pretty_print</code> es una función para mostrar una línea horizontal y una cadena. Observa el uso de <code>this</code> para referirse al objeto al que pertenece el método.</p>
-
-<p>Puedes hacer de esta función un método de <code>Car</code> agregando la declaración</p>
-
-<pre class="brush: js notranslate">this.displayCar = displayCar;
-</pre>
-
-<p>a la definición del objeto. Por lo tanto, la definición completa de <code>Car</code> ahora se verá así:</p>
-
-<pre class="brush: js notranslate">function Car(make, model, year, owner) {
-  this.make = make;
-  this.model = model;
-  this.year = year;
-  this.owner = owner;
-  this.displayCar = displayCar;
-}
-</pre>
-
-<p>Entonces puedes llamar al método <code>displayCar</code> para cada uno de los objetos de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">car1.displayCar();
-car2.displayCar();
-</pre>
-
-<h2 id="Usar_this_para_referencias_a_objetos">Usar <code>this</code> para referencias a objetos</h2>
-
-<p>JavaScript tiene una palabra clave especial, <code>this</code>, que puedes usar dentro de un método para referirte al objeto actual. Por ejemplo, supongamos que tienes 2 objetos,<code>Manager</code> e <code>Intern</code>. Cada objeto tiene su propio <code>name</code>,<code>age</code> y <code>job</code>. En la función <code>sayHi()</code>, observa que hay <code>this.name</code>. Cuando se agregan a los 2 objetos, se pueden llamar y devuelve el <code>'Hola, mi nombre es'</code> y luego agrega el valor <code>name</code> de ese objeto específico. Como se muestra abajo. </p>
-
-<pre class="brush: js notranslate">const Manager = {
-  name: "John",
-  age: 27,
-  job: "Software Engineer"
-}
-
-const Intern= {
-  name: "Ben",
-  age: 21,
-  job: "Software Engineer Intern"
-}
-
-function sayHi() {
-    console.log('Hola, mi nombre es ', this.name)
-}
-
-// agrega la función sayHi a ambos objetos
-Manager.sayHi = sayHi;
-Intern.sayHi = sayHi;
-
-Manager.sayHi() // Hola, mi nombre es John'
-Intern.sayHi() // Hola, mi nombre es Ben'
-</pre>
-
-<p><code>this</code> se refiere al objeto en el que se encuentra. Puedes crear una nueva función llamada <code>howOldAmI()</code> que registra una oración que dice cuántos años tiene la persona. </p>
-
-<pre class="brush: js notranslate">function howOldAmI() {
-  console.log('Tengo ' + this.age + ' años.')
-}
-Manager.howOldAmI = howOldAmI;
-Manager.howOldAmI() // Tengo 27 años.
-</pre>
-
-<h2 id="Definición_de_captadores_getters_y_establecedores_setters">Definición de captadores (<code>getters</code>) y establecedores (<code>setters</code>)</h2>
-
-<p>Un captador (<a href="/es/docs/Web/JavaScript/Reference/Functions/get">getter</a>) es un método que obtiene el valor de una propiedad específica. Un establecedor (<a href="/es/docs/Web/JavaScript/Reference/Functions/set">setter</a>) es un método que establece el valor de una propiedad específica. Puedes definir captadores y establecedores en cualquier objeto principal predefinido o en un objeto definido por el usuario que admita la adición de nuevas propiedades. </p>
-
-<p>En principio, los captadores y establecedores pueden ser</p>
-
-<ul>
- <li>definido usando <a href="#Iniciadores_de_objeto">iniciadores de objeto</a>, o</li>
- <li>agregado posteriormente a cualquier objeto en cualquier momento usando un método de adición para el captador o el establecedor.</li>
-</ul>
-
-<p>Al definir captadores y establecedores usando <a href="#Iniciadores_de_objeto">iniciadores de objeto</a>, todo lo que necesitas hacer es prefijar un método captador con <code>get</code> y un método establecedor con <code>set</code>. Por supuesto, el método captador no debe esperar un parámetro, mientras que el método establecedor espera exactamente un parámetro (el nuevo valor a establecer). Por ejemplo:</p>
-
-<pre class="brush: js notranslate">var o = {
-  a: 7,
-  get b() {
-    return this.a + 1;
-  },
-  set c(x) {
-    this.a = x / 2;
-  }
-};
-
-console.log (o.a); // 7
-console.log (o.b); // 8 &lt;-- En este punto se inicia el método get b().
-o.c = 50;         // &lt;-- En este punto se inicia el método set c(x)
-console.log(o.a); // 25
-</pre>
-
-<p>var o = {</p>
-
-<ul>
- <li>a: 7,</li>
- <li><code>o.b</code> — un captador que devuelve <code>o.a</code> más 1</li>
- <li><code>o.c</code> — un establecedor que establece el valor de <code>o.a</code> en la mitad del valor que se establece en <code>o.c</code></li>
-</ul>
-
-<p>Ten en cuenta que los nombres de función de los captadores y establecedores definidos en un objeto literal usando "[gs]et <em>propiedad</em>()" (en contraposición a <code>__define [GS]etter__</code>) no son los nombres de los captadores en sí, aunque la sintaxis <code>[gs]et <em>propertyName</em>() {}</code> te puede inducir a pensar lo contrario.</p>
-
-<p>Los captadores y establecedores también se pueden agregar a un objeto en cualquier momento después de la creación usando el método <code>Object.defineProperties</code>. El primer parámetro de este método es el objeto sobre el que se quiere definir el captador o establecedor. El segundo parámetro es un objeto cuyo nombre de propiedad son los nombres <code>getter</code> o <code>setter</code>, y cuyos valores de propiedad son objetos para la definición de las funciones <code>getter</code> o <code>setter</code>. Aquí hay un ejemplo que define el mismo <code>getter</code> y <code>setter</code> utilizado en el ejemplo anterior:</p>
-
-<pre class="brush: js notranslate">var o = { a: 0 };
-
-Object.defineProperties(o, {
-    'b': { get: function() { return this.a + 1; } },
-    'c': { set: function(x) { this.a = x / 2; } }
-});
-
-o.c = 10; // Ejecuta el establecedor, que asigna 10/2 (5) a la propiedad 'a'
-console.log(o.b); // Ejecuta el captador, que produce un + 1 o 6
-</pre>
-
-<p>¿Cuál de las dos formas elegir? depende de tu estilo de programación y de la tarea que te ocupa. Si ya utilizas el iniciador de objeto al definir un prototipo probablemente escojas la primer forma la mayoría de las veces. Esta forma es más compacta y natural. Sin embargo, si más tarde necesitas agregar captadores y establecedores — porque no lo escribiste en el objeto prototipo o particular — entonces la segunda forma es la única forma posible. La segunda forma, probablemente representa mejor la naturaleza dinámica de JavaScript — pero puede hacer que el código sea difícil de leer y entender.&lt;/s6&gt;</p>
-
-<h2 id="Eliminar_propiedades">Eliminar propiedades</h2>
-
-<p>Puedes eliminar una propiedad no heredada mediante el operador <code>delete</code>. El siguiente código muestra cómo eliminar una propiedad.</p>
-
-<pre class="brush: js notranslate">//Crea un nuevo objeto, myobj, con dos propiedades, a y b.
-var myobj = new Object;
-myobj.a = 5;
-myobj.b = 12;
-
-// Elimina la propiedad a, dejando a myobj solo con la propiedad b.
-delete myobj.a;
-console.log ('a' in myobj); // muestra: "false"
-</pre>
-
-<p>También puedes utilizar <code>delete</code> para eliminar una variable global siempre y cuando no se haya utilizado la palabra clave <code>var</code> para declarar la variable:</p>
-
-<pre class="brush: js notranslate">g = 17;
-delete g;
-</pre>
-
-<h2 id="Comparar_objetos">Comparar objetos</h2>
-
-<p>Como sabemos los objetos son de tipo referencia en JavaScript. Dos distintos objetos nunca son iguales, incluso aunque tengan las mismas propiedades. Solo comparar la misma referencia de objeto consigo misma arroja verdadero.</p>
-
-<pre class="brush: js notranslate">// Dos variables, dos distintos objetos con las mismas propiedades
-var fruit = { name: 'apple' };
-var fruitbear = { name: 'apple' };
-
-fruit == fruitbear; // devuelve false
-fruit === fruitbear; // devuelve false</pre>
-
-<pre class="brush: js notranslate">// Dos variables, un solo objeto
-var fruit = { name: 'apple' };
-var fruitbear = fruit; // Asigna la referencia del objeto fruit a fruitbear
-
-// Aquí fruit y fruitbear apuntan al mismo objeto
-fruit == fruitbear; // devuelve true
-fruit === fruitbear; // devuelve true
-
-fruit.name = 'grape';
-console.log(fruitbear); // Produce: { name: "grape" }, en lugar de { name: "apple" }
-</pre>
-
-<p>Para obtener más información sobre los operadores de comparación, consulta <a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">Operadores de comparación</a>.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>Para profundizar más, lee sobre los <a href="/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model">detalles del modelo de objetos de JavaScript</a>.</li>
- <li>Para obtener más información sobre las clases de ECMAScript 2015 (una forma alternativa de crear objetos), lee el capítulo <a href="/es/docs/Web/JavaScript/Reference/Classes">Clases de JavaScript</a>.</li>
-</ul>
-
-<p>{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Details_of_the_Object_Model")}}</p>
diff --git a/files/es/web/javascript/guide/usar_promesas/index.html b/files/es/web/javascript/guide/usar_promesas/index.html
deleted file mode 100644
index 4b84166fe6..0000000000
--- a/files/es/web/javascript/guide/usar_promesas/index.html
+++ /dev/null
@@ -1,344 +0,0 @@
----
-title: Usar promesas
-slug: Web/JavaScript/Guide/Usar_promesas
-tags:
-  - Asíncrono
-  - Guía
-  - Intermedio
-  - Promesa
-  - Promesas
-translation_of: Web/JavaScript/Guide/Using_promises
----
-<div>{{jsSidebar("JavaScript Guide")}}</div>
-
-<p>Una {{jsxref("Promise")}} (promesa en castellano) es un objeto que representa la terminación o el fracaso de una operación asíncrona. Dado que la mayoría de las personas consumen <code>promises</code> ya creadas, esta guía explicará primero cómo consumirlas, y luego cómo crearlas.</p>
-
-<p>Esencialmente, una promesa es un objeto devuelto al cuál se adjuntan funciones <code>callback</code>, en lugar de pasar callbacks a una función.</p>
-
-<p>Considera la función <code>crearArchivoAudioAsync()</code>, el cuál genera de manera asíncrona un archivo de sonido de acuerdo a un archivo de configuración, y dos funciones callback, una que es llamada si el archivo de audio es creado satisfactoriamente, y la otra que es llamada si ocurre un error. El código podría verse de la siguiente forma:</p>
-
-<pre class="brush: js line-numbers  language-js">function exitoCallback(resultado) {
-  console.log("Archivo de audio disponible en la URL " + resultado);
-}
-
-function falloCallback(error) {
-  console.log("Error generando archivo de audio " + error);
-}
-
-crearArchivoAudioAsync(audioConfig, exitoCallback, falloCallback);
-</pre>
-
-<p>... las funciones modernas devuelven un objeto <code>promise</code> al que puedes adjuntar funciones de retorno (callbacks). Si <code>crearArchivoAudioAsync</code> fuera escrita de manera tal que devuelva un objeto <code>promise</code>, usarla sería tan simple como esto:</p>
-
-<pre class="brush: js line-numbers  language-js">crearArchivoAudioAsync(audioConfig).then(exitoCallback, falloCallback);</pre>
-
-<p>Lo cuál es la versión corta de:</p>
-
-<pre class="brush: js line-numbers  language-js">const promesa = crearArchivoAudioAsync(audioConfig);
-promesa.then(exitoCallback, falloCallback);</pre>
-
-<p>Llamamos a esto una <em>llamada a función asíncrona</em>. Esta convención tiene varias ventajas. Exploraremos cada una de ellas.</p>
-
-<h2 id="Garantías">Garantías</h2>
-
-<p>A diferencia de las funciones callback pasadas al "viejo estilo", una promesa viene con algunas garantías:</p>
-
-<ul>
- <li>Las funciones callback nunca serán llamadas antes de la <a href="/es/docs/Web/JavaScript/EventLoop#Ejecutar_hasta_completar">terminación de la ejecución actual</a> del bucle de eventos de JavaScript.</li>
- <li>Las funciones callback añadidas con <code>then()</code> incluso después del éxito o fracaso de la operación asíncrona serán llamadas como se mostró anteriormente.</li>
- <li>Múltiples funciones callback pueden ser añadidas llamando a <code>then()</code> varias veces. Cada una de ellas es ejecutada una seguida de la otra, en el orden en el que fueron insertadas.</li>
-</ul>
-
-<p>Una de las grandes ventajas de usar <code>promises</code> es el encadenamiento, explicado a continuación.</p>
-
-<h2 id="Encadenamiento">Encadenamiento</h2>
-
-<p>Una necesidad común es el ejecutar dos o más operaciones asíncronas seguidas, donde cada operación posterior se inicia cuando la operación previa tiene éxito, con el resultado del paso previo. Logramos esto creando una cadena de objetos <code>promises</code>.</p>
-
-<p>Aquí está la magia: la función <code>then()</code> devuelve una promesa nueva, diferente de la original:</p>
-
-<pre class="brush: js">const promesa = hazAlgo();
-const promesa2 = promesa.then(exitoCallback, falloCallback);
-</pre>
-
-<p>o</p>
-
-<pre class="brush: js">let promesa2 = hazAlgo().then(exitoCallback, falloCallback);
-</pre>
-
-<p>Esta segunda promesa (<code>promesa2</code>) representa no sólo la terminación de <code>hazAlgo()</code>, sino también de <code>exitoCallback</code> o <code>falloCallback</code> que pasaste, las cuales pueden ser otras funciones asíncronas devolviendo una promesa. Cuando ese es el caso, cualquier función callback añadida a <code>promesa2</code> se queda en cola detrás de la promesa devuelta por <code>exitoCallback</code> o <code>falloCallback</code>.</p>
-
-<p>Básicamente, cada promesa representa la terminación de otro paso (asíncrono on no) en la cadena.</p>
-
-<p>En el pasado, hacer varias operaciones asíncronas en fila conduciría a la clásica pirámide de funciones callback:</p>
-
-<pre class="brush: js">hazAlgo(function(resultado) {
-  hazAlgoMas(resultado, function(nuevoResultado) {
-    hazLaTerceraCosa(nuevoResultado, function(resultadoFinal) {
-      console.log('Obtenido el resultado final: ' + resultadoFinal
-    }, falloCallback);
-  }, falloCallback);
-}, falloCallback);
-</pre>
-
-<p>Con las funciones modernas, adjuntamos nuestras functiones callback a las promesas devueltas, formando una cadena de promesa:</p>
-
-<pre class="brush: js">hazAlgo().then(function(resultado) {
-  return hazAlgoMas(resultado);
-})
-.then(function(nuevoResultado) {
-  return hazLaTerceraCosa(nuevoResultado);
-})
-.then(function(resultadoFinal) {
-  console.log('Obtenido el resultado final: ' + resultadoFinal);
-})
-.catch(falloCallback);
-</pre>
-
-<p>Los argumentos a <code>then</code> son opcionales, y <code>catch(falloCallBack)</code> es un atajo para <code>then(null, falloCallBack)</code>. Es posible que veas esto expresado con <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">funciones de flecha</a> :</p>
-
-<pre class="brush: js">hazAlgo()
-.then(resultado =&gt; hazAlgoMas(resultado))
-.then(nuevoResultado =&gt; hazLaTerceraCosa(nuevoResultado))
-.then(resultadoFinal =&gt; {
-  console.log(`Obtenido el resultado final: ${resultadoFinal}`);
-})
-.catch(falloCallback);
-</pre>
-
-<p><strong>Importante</strong>: Devuelve siempre resultados, de otra forma las funciones callback no se encadenarán, y los errores no serán capturados.</p>
-
-<h3 id="Encadenar_después_de_una_captura">Encadenar después de una captura</h3>
-
-<p>Es posible encadenar después de un fallo - por ejemplo: un <code>catch</code>- lo que es útil para lograr nuevas acciones incluso después de una acción fallida en la cadena. Lea el siguiente ejemplo:</p>
-
-<pre class="brush: js">new Promise((resolver, rechazar) =&gt; {
-    console.log('Inicial');
-
-    resolver();
-})
-.then(() =&gt; {
-    throw new Error('Algo falló');
-
-    console.log('Haz esto');
-})
-.catch(() =&gt; {
-    console.log('Haz aquello');
-})
-.then(() =&gt; {
-    console.log('Haz esto sin que importe lo que sucedió antes');
-});
-</pre>
-
-<p>Esto devolverá el siguiente texto:</p>
-
-<pre>Inicial
-Haz aquello
-Haz esto sin que importe lo que sucedió antes
-</pre>
-
-<p>Note que el texto "Haz esto" no es escrito porque el error "Algo falló" causó un rechazo.</p>
-
-<h2 id="Propagación_de_errores">Propagación de errores</h2>
-
-<p>Tal vez recuerdes haber visto <code>falloCallback</code> tres veces en la pirámide en un ejemplo anterior, en comparación con sólo una vez al final de la cadena de promesas:</p>
-
-<pre class="brush: js">hazAlgo()
-.then(resultado =&gt; hazAlgoMas(valor))
-.then(nuevoResultado =&gt; hazLaTerceraCosa(nuevoResultado))
-.then(resultadoFinal =&gt; console.log(`Obtenido el resultado final: ${resultadoFinal}`))
-.catch(falloCallback);
-</pre>
-
-<p>Básicamente, una cadena de promesas se detiene si hay una excepción, y recorre la cadena buscando manejadores de captura. Lo siguiente está mucho más adaptado a la forma de trabajo del código síncrono:</p>
-
-<pre class="brush: js">try {
-  let resultado = syncHazAlgo();
-  let nuevoResultado = syncHazAlgoMas(resultado);
-  let resultadoFinal = syncHazLaTerceraCosa(nuevoResultado);
-  console.log(`Obtenido el resultado final: ${resultadoFinal}`);
-} catch(error) {
-  falloCallback(error);
-}
-</pre>
-
-<p>Esta simetría con el código síncrono culmina con la mejora sintáctica <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/funcion_asincrona">async/await</a> en ECMASCript 2017:</p>
-
-<pre class="brush: js">async function foo() {
-  try {
-    let resultado = await hazAlgo();
-    let nuevoResultado = await hazAlgoMas(resultado);
-    let resultadoFinal = await hazLaTerceraCosa(nuevoResultado);
-    console.log(`Obtenido el resultado final: ${resultadoFinal}`);
-  } catch(error) {
-    falloCallback(error);
-  }
-}
-</pre>
-
-<p>Se construye sobre <code>promesas</code>, por ejemplo, <code>hazAlgo()</code> es la misma función que antes. Puedes leer más sobre la sintaxis <a href="https://developers.google.com/web/fundamentals/getting-started/primers/async-functions">aquí</a>.</p>
-
-<p>Las <code>promesas</code> resuelven un fallo fundamental de la pirámide de funciones callback, capturando todos los errores, incluso excepciones lanzadas y errores de programación. Esto es esencial para la composición funcional de operaciones asíncronas.</p>
-
-<h2 id="Eventos_de_rechazo_de_Promesas">Eventos de rechazo de Promesas</h2>
-
-<p>Cuando una <code>promesa</code> es rechazada, uno de los dos eventos se envía al ámbito global (generalmente, éste es el {{domxref("window")}}, o, si se utiliza en un trabajador web, es el  {{domxref("Worker")}} u otra interfaz basada en un trabajador). Los dos eventos son:</p>
-
-<p><strong>{{domxref("Window.rejectionhandled_event", "rejectionhandled")}}</strong></p>
-
-<p>Se envía cuando se rechaza una promesa, una vez que el rechazo ha sido manejado por la función <code>reject</code> del ejecutor.</p>
-
-<p><strong>{{domxref("Window.unhandledrejection_event", "unhandledrejection")}}</strong></p>
-
-<p>Se envía cuando se rechaza una promesa pero no hay un controlador de rechazo disponible.</p>
-
-<p>En ambos casos, el evento (del tipo {{domxref("PromiseRejectionEvent")}}) tiene como miembros una propiedad {{domxref("PromiseRejectionEvent.promise", "promise")}} que indica que la promesa fue rechazada, y una propiedad {{domxref("PromiseRejectionEvent.reason", "reason")}} que proporciona el motivo por el cuál se rechaza la promesa.</p>
-
-<p>Esto hace posible ofrecer el manejo de errores de promesas, y también ayuda a depurarlos. Estos controladores son globales, por lo tanto, todos los errores serán manejados por éstos independientemente de la fuente.</p>
-
-<p><u>Un caso de especial utilidad</u>: al escribir código para {{Glossary("Node.js")}}, es común que los módulos que incluyas en tu proyecto no cuenten con un controlador de evento para promesas rechazadas. Estos se registran en la consola en tiempo de ejecución de Node. Puedes capturarlos para analizarlos y manejarlos en tu código - o solo evitar que abarroten tu salida - agregando un controlador para el evento {{domxref("Window.unhandledrejection_event", "unhandledrejection")}}, como se muestra a continuación:</p>
-
-<pre><code>window.addEventListener("</code>unhandledrejection<code>", event =&gt; {
-  /* Podrías comenzar agregando código para examinar
-     la promesa específica analizando event.promise
-     y la razón del rechazo, accediendo a event.reason */
-
-  event.preventDefault();
-}, false);</code></pre>
-
-<p>Llamando al método {{domxref("Event.preventDefault", "preventDefault()")}} del evento, le dices a Javascript en tiempo de ejecución que no realice su acción predeterminada cuando las promesas rechazadas no cuenten con manejadores. En el caso de Node, esa acción predeterminada usualmente registra el error en la consola.</p>
-
-<p>Lo ideal, por supuesto, sería examinar las promesas rechazadas para asegurarte que ninguna de ellas tienen errores de código reales antes de descartar esos eventos.</p>
-
-<h2 id="Crear_una_promesa_alrededor_de_una_vieja_API_de_callbacks"><strong>Crear una promesa alrededor de una vieja API de callbacks</strong></h2>
-
-<p>Una {{jsxref("Promise")}} puede ser creada desde cero usando su constructor. Esto debería ser sólo necesario para envolver viejas APIs.</p>
-
-<p>En un mundo ideal, todas las funciones asíncronas devolverían promesas. Desafortunadamente, algunas APIs aún esperan que se les pase callbacks con resultado fallido/exitoso a la forma antigua. El ejemplo más obvio es la función {{domxref("WindowTimers.setTimeout", "setTimeout()")}}:</p>
-
-<pre class="brush: js">setTimeout(() =&gt; diAlgo("pasaron 10 segundos"), 10000);
-</pre>
-
-<p>Combinar callbacks del viejo estilo con promesas es problemático. Si <code>diAlgo</code> falla o contiene un error de programación, nada lo captura. La función <code>setTimeout</code> es culpable de esto.</p>
-
-<p>Afortunadamente podemos envolverlas en una promesa. La mejor práctica es envolver las funciones problemáticas en el nivel más bajo posible, y después nunca llamarlas de nuevo  directamente:</p>
-
-<pre class="brush: js">const espera = ms =&gt; new Promise(resuelve =&gt; setTimeout(resuelve, ms));
-
-espera(10000).then(() =&gt; diAlgo("10 segundos")).catch(falloCallback);
-</pre>
-
-<p>Básicamente, el constructor de la promesa toma una función ejecutora que nos permite resolver o rechazar manualmente una promesa. Dado que <code>setTimeout</code> no falla realmente, descartamos el rechazo en este caso.</p>
-
-<h2 id="Composición">Composición</h2>
-
-<p>{{jsxref("Promise.resolve()")}} y {{jsxref("Promise.reject()")}} son atajos para crear manualmente una promesa resuelta o rechazada respectivamente. Esto puede ser útil a veces.</p>
-
-<p>{{jsxref("Promise.all()")}} son {{jsxref("Promise.race()")}} son dos herramientas de composición para ejecutar operaciones asíncronas en paralelo.</p>
-
-<p>Podemos comenzar operaciones en paralelo y esperar que finalicen todas ellas de la siguiente manera:</p>
-
-<pre><code>Promise.all([func1(), func2(), func3()])
-.then(([resultado1, resultado2, resultado3]) =&gt; { /* usa resultado1, resultado2 y resultado3 */ });</code></pre>
-
-<p>La composición secuencial es posible usando Javascript inteligente:</p>
-
-<pre><code>[func1, func2, func3].reduce((p, f) =&gt; p.then(f), Promise.resolve())
-.then(result3 =&gt; { /* use result3 */ });</code></pre>
-
-<p>Básicamente, reducimos un conjunto de funciones asíncronas a una cadena de promesas equivalente a: <code>Promise.resolve().then(func1).then(func2).then(func3);</code></p>
-
-<p>Esto se puede convertir en una función de composición reutilizable, que es común en la programación funcional:</p>
-
-<pre><code>const aplicarAsync = (acc,val) =&gt; acc.then(val);
-const componerAsync = (...funcs) =&gt; x =&gt; funcs.reduce(aplicarAsync, Promise.resolve(x));</code></pre>
-
-<p>La función <code>componerAsync()</code> aceptará cualquier número de funciones como argumentos, y devolverá una nueva función que acepta un valor inicial que es pasado a través del conducto de composición. Esto es beneficioso porque cualquiera o todas las funciones pueden ser o asíncronas o síncronas y se garantiza que serán ejecutadas en el orden correcto:</p>
-
-<pre class="brush: js">const transformData = componerAsync(func1, asyncFunc1, asyncFunc2, func2);
-const resultado3 = transformData(data);
-</pre>
-
-<p>En ECMAScript 2017, la composición secuencial puede ser realizada usando simplemente async/await:</p>
-
-<pre class="brush: js">let resultado;
-for (const f of [func1, func2, func3]) {
-  resultado = await f(resultado);
-}
-</pre>
-
-<h2 id="Sincronización">Sincronización</h2>
-
-<p>Para evitar sorpresas, las funciones pasadas a <code>then()</code> nunca serán llamadas sincrónicamente, incluso con una promesa ya resuelta:</p>
-
-<pre class="brush: js">Promise.resolve().then(() =&gt; console.log(2));
-console.log(1); // 1, 2
-</pre>
-
-<p>En lugar de ejecutarse inmediatamente, la función pasada es colocada en una cola de microtareas, lo que significa que se ejecuta más tarde cuando la cola es vaciada al final del actual ciclo de eventos de JavaScript:</p>
-
-<pre class="brush: js">const espera = ms =&gt; new Promise(resuelve =&gt; setTimeout(resuelve, ms));
-
-espera().then(() =&gt; console.log(4));
-Promise.resuelve().then(() =&gt; console.log(2)).then(() =&gt; console.log(3));
-console.log(1); // 1, 2, 3, 4
-</pre>
-
-<h2 id="Anidamiento">Anidamiento</h2>
-
-<p>Las cadenas de promesas simples se mantienen planas sin anidar, ya que el anidamiento puede ser el resultado de una composición descuidada. Vea <a href="/es/docs/Web/JavaScript/Guide/Usar_promesas$edit#Common_mistakes">errores comunes</a>.</p>
-
-<p>El anidamiento es una estructura de control para limitar el alcance de las sentencias <code>catch</code>. Específicamente, un <code>catch</code> anidado sólo captura fallos dentro de su contexto y por debajo, no captura errores que están más arriba en la cadena fuera del alcance del anidamiento. Cuando se usa correctamente, da mayor precisión en la recuperación de errores:</p>
-
-<pre><code>hacerAlgoCritico()
-.then(resultado =&gt; hacerAlgoOpcional()
-  .then(resultadoOpcional =&gt; hacerAlgoSuper(resultadoOpcional))
-  .catch(e =&gt; {})) // Ignorar si hacerAlgoOpcional falla.
-.then(() =&gt; masAsuntosCriticos())
-.catch(e =&gt; console.log("Acción crítica fallida: " + e.message));</code>
-</pre>
-
-<p>Nota que aquí los pasos opcionales están anidados, por la precaria colocación de lo externo (y) alrededor de ellos.</p>
-
-<p>La declaración interna <code>catch</code> solo detecta errores de <code>hacerAlgoOpcional()</code> y <code>hacerAlgoSuper()</code>, después de lo cuál el código se reanuda con <code>masAsuntosCriticos()</code>. Es importante destacar que si <code>hacerAlgoCritico()</code> falla, el error es capturado únicamente por el <code>catch</code> final.</p>
-
-<h2 id="Errores_comunes">Errores comunes</h2>
-
-<p>Aquí hay algunos errores comunes que deben tenerse en cuenta al componer cadenas de promesas. Varios de estos errores se manifiestan en el siguiente ejemplo:</p>
-
-<pre><code>// ¡Mal ejemplo!
-hacerlAlgo().then(function(resultado) {
-  hacerOtraCosa(resultado) // Olvida devolver una promesa desde el interior de la cadena + anidamiento innecesario
-  .then(nuevoResultado =&gt; hacerUnaTerceraCosa(nuevoResultado));
-}).then(() =&gt; hacerUnaCuartaCosa());
-// Olvida terminar la cadena con un catch!</code></pre>
-
-<p>El primer error es no encadenar las acciones adecuadamente. Esto sucede cuando creamos una promesa y olvidamos devolverla. Como consecuencia, la cadena se rompe, o mejor dicho, tenemos dos cadenas independientes que compiten. Esto significa que <code>hacerUnaCuartaCosa()</code> no esperará a que finalicen <code>hacerOtraCosa()</code> o <code>hacerUnaTerceraCosa()</code>, y se ejecutará paralelamente a ellas. Las cadenas separadas también tienen un manejador de errores separado, lo que provoca errores no detectados.</p>
-
-<p>El segundo error es el anidamiento innecesario, que da lugar al primer error. La anidación también limita el alcance de los manejadores de errores internos, que - si no son deseados - pueden llevar a errores no detectados. Una variante de esto es el <a href="https://stackoverflow.com/questions/23803743/what-is-the-explicit-promise-construction-antipattern-and-how-do-i-avoid-it">constructor anti-patrón de promesas</a>, el cuál combina el anidamiento con el uso redundante del constructor de promesa para envolver el código que ya usa promesas. </p>
-
-<p>El tercer error es olvidar cerrar las cadenas con catch.Las cadenas de promesas no terminadas conducen a errores no capturados en la mayoría de los navegadores.</p>
-
-<p>Una buena regla es devolver o terminar siempre las cadenas de promesas, y tan pronto como obtenga una nueva promesa, devolverla de inmediato, para aplanar las cosas:</p>
-
-<pre><code>hacerAlgo()
-.then(function(resultado) {
-  return hacerOtraCosa(resultado);
-})
-.then(nuevoResultado =&gt; hacerUnaTerceraCosa(nuevoResultado))
-.then(() =&gt; hacerUnaCuartaCosa())
-.catch(error =&gt; console.log(error));</code></pre>
-
-<p>Nota que <code>() =&gt; x</code> es un atajo para <code>() =&gt; { return x; }</code>.</p>
-
-<p>Ahora tenemos una cadena determinística simple con un manejador de error adecuado.</p>
-
-<p>El uso de <a href="/en-US/docs/Web/JavaScript/Reference/Statements/async_function">async / await</a> aborda la mayoría, si no todos estos problemas, la desventaja es que el error más común con esa sintaxis es olvidar la palabra clave <a href="en-US/docs/Web/JavaScript/Reference/Statements/async_function">await</a>.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Promise.then()")}}</li>
- <li><a href="http://promisesaplus.com/">Promises/A+ specification</a></li>
- <li><a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">Nolan Lawson: Tenemos un problema con las promesas — Errores comunes con las promesas</a></li>
-</ul>
diff --git a/files/es/web/javascript/guide/using_promises/index.html b/files/es/web/javascript/guide/using_promises/index.html
new file mode 100644
index 0000000000..bb7881d37d
--- /dev/null
+++ b/files/es/web/javascript/guide/using_promises/index.html
@@ -0,0 +1,345 @@
+---
+title: Usar promesas
+slug: Web/JavaScript/Guide/Using_promises
+tags:
+  - Asíncrono
+  - Guía
+  - Intermedio
+  - Promesa
+  - Promesas
+translation_of: Web/JavaScript/Guide/Using_promises
+original_slug: Web/JavaScript/Guide/Usar_promesas
+---
+<div>{{jsSidebar("JavaScript Guide")}}</div>
+
+<p>Una {{jsxref("Promise")}} (promesa en castellano) es un objeto que representa la terminación o el fracaso de una operación asíncrona. Dado que la mayoría de las personas consumen <code>promises</code> ya creadas, esta guía explicará primero cómo consumirlas, y luego cómo crearlas.</p>
+
+<p>Esencialmente, una promesa es un objeto devuelto al cuál se adjuntan funciones <code>callback</code>, en lugar de pasar callbacks a una función.</p>
+
+<p>Considera la función <code>crearArchivoAudioAsync()</code>, el cuál genera de manera asíncrona un archivo de sonido de acuerdo a un archivo de configuración, y dos funciones callback, una que es llamada si el archivo de audio es creado satisfactoriamente, y la otra que es llamada si ocurre un error. El código podría verse de la siguiente forma:</p>
+
+<pre class="brush: js line-numbers  language-js">function exitoCallback(resultado) {
+  console.log("Archivo de audio disponible en la URL " + resultado);
+}
+
+function falloCallback(error) {
+  console.log("Error generando archivo de audio " + error);
+}
+
+crearArchivoAudioAsync(audioConfig, exitoCallback, falloCallback);
+</pre>
+
+<p>... las funciones modernas devuelven un objeto <code>promise</code> al que puedes adjuntar funciones de retorno (callbacks). Si <code>crearArchivoAudioAsync</code> fuera escrita de manera tal que devuelva un objeto <code>promise</code>, usarla sería tan simple como esto:</p>
+
+<pre class="brush: js line-numbers  language-js">crearArchivoAudioAsync(audioConfig).then(exitoCallback, falloCallback);</pre>
+
+<p>Lo cuál es la versión corta de:</p>
+
+<pre class="brush: js line-numbers  language-js">const promesa = crearArchivoAudioAsync(audioConfig);
+promesa.then(exitoCallback, falloCallback);</pre>
+
+<p>Llamamos a esto una <em>llamada a función asíncrona</em>. Esta convención tiene varias ventajas. Exploraremos cada una de ellas.</p>
+
+<h2 id="Garantías">Garantías</h2>
+
+<p>A diferencia de las funciones callback pasadas al "viejo estilo", una promesa viene con algunas garantías:</p>
+
+<ul>
+ <li>Las funciones callback nunca serán llamadas antes de la <a href="/es/docs/Web/JavaScript/EventLoop#Ejecutar_hasta_completar">terminación de la ejecución actual</a> del bucle de eventos de JavaScript.</li>
+ <li>Las funciones callback añadidas con <code>then()</code> incluso después del éxito o fracaso de la operación asíncrona serán llamadas como se mostró anteriormente.</li>
+ <li>Múltiples funciones callback pueden ser añadidas llamando a <code>then()</code> varias veces. Cada una de ellas es ejecutada una seguida de la otra, en el orden en el que fueron insertadas.</li>
+</ul>
+
+<p>Una de las grandes ventajas de usar <code>promises</code> es el encadenamiento, explicado a continuación.</p>
+
+<h2 id="Encadenamiento">Encadenamiento</h2>
+
+<p>Una necesidad común es el ejecutar dos o más operaciones asíncronas seguidas, donde cada operación posterior se inicia cuando la operación previa tiene éxito, con el resultado del paso previo. Logramos esto creando una cadena de objetos <code>promises</code>.</p>
+
+<p>Aquí está la magia: la función <code>then()</code> devuelve una promesa nueva, diferente de la original:</p>
+
+<pre class="brush: js">const promesa = hazAlgo();
+const promesa2 = promesa.then(exitoCallback, falloCallback);
+</pre>
+
+<p>o</p>
+
+<pre class="brush: js">let promesa2 = hazAlgo().then(exitoCallback, falloCallback);
+</pre>
+
+<p>Esta segunda promesa (<code>promesa2</code>) representa no sólo la terminación de <code>hazAlgo()</code>, sino también de <code>exitoCallback</code> o <code>falloCallback</code> que pasaste, las cuales pueden ser otras funciones asíncronas devolviendo una promesa. Cuando ese es el caso, cualquier función callback añadida a <code>promesa2</code> se queda en cola detrás de la promesa devuelta por <code>exitoCallback</code> o <code>falloCallback</code>.</p>
+
+<p>Básicamente, cada promesa representa la terminación de otro paso (asíncrono on no) en la cadena.</p>
+
+<p>En el pasado, hacer varias operaciones asíncronas en fila conduciría a la clásica pirámide de funciones callback:</p>
+
+<pre class="brush: js">hazAlgo(function(resultado) {
+  hazAlgoMas(resultado, function(nuevoResultado) {
+    hazLaTerceraCosa(nuevoResultado, function(resultadoFinal) {
+      console.log('Obtenido el resultado final: ' + resultadoFinal
+    }, falloCallback);
+  }, falloCallback);
+}, falloCallback);
+</pre>
+
+<p>Con las funciones modernas, adjuntamos nuestras functiones callback a las promesas devueltas, formando una cadena de promesa:</p>
+
+<pre class="brush: js">hazAlgo().then(function(resultado) {
+  return hazAlgoMas(resultado);
+})
+.then(function(nuevoResultado) {
+  return hazLaTerceraCosa(nuevoResultado);
+})
+.then(function(resultadoFinal) {
+  console.log('Obtenido el resultado final: ' + resultadoFinal);
+})
+.catch(falloCallback);
+</pre>
+
+<p>Los argumentos a <code>then</code> son opcionales, y <code>catch(falloCallBack)</code> es un atajo para <code>then(null, falloCallBack)</code>. Es posible que veas esto expresado con <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">funciones de flecha</a> :</p>
+
+<pre class="brush: js">hazAlgo()
+.then(resultado =&gt; hazAlgoMas(resultado))
+.then(nuevoResultado =&gt; hazLaTerceraCosa(nuevoResultado))
+.then(resultadoFinal =&gt; {
+  console.log(`Obtenido el resultado final: ${resultadoFinal}`);
+})
+.catch(falloCallback);
+</pre>
+
+<p><strong>Importante</strong>: Devuelve siempre resultados, de otra forma las funciones callback no se encadenarán, y los errores no serán capturados.</p>
+
+<h3 id="Encadenar_después_de_una_captura">Encadenar después de una captura</h3>
+
+<p>Es posible encadenar después de un fallo - por ejemplo: un <code>catch</code>- lo que es útil para lograr nuevas acciones incluso después de una acción fallida en la cadena. Lea el siguiente ejemplo:</p>
+
+<pre class="brush: js">new Promise((resolver, rechazar) =&gt; {
+    console.log('Inicial');
+
+    resolver();
+})
+.then(() =&gt; {
+    throw new Error('Algo falló');
+
+    console.log('Haz esto');
+})
+.catch(() =&gt; {
+    console.log('Haz aquello');
+})
+.then(() =&gt; {
+    console.log('Haz esto sin que importe lo que sucedió antes');
+});
+</pre>
+
+<p>Esto devolverá el siguiente texto:</p>
+
+<pre>Inicial
+Haz aquello
+Haz esto sin que importe lo que sucedió antes
+</pre>
+
+<p>Note que el texto "Haz esto" no es escrito porque el error "Algo falló" causó un rechazo.</p>
+
+<h2 id="Propagación_de_errores">Propagación de errores</h2>
+
+<p>Tal vez recuerdes haber visto <code>falloCallback</code> tres veces en la pirámide en un ejemplo anterior, en comparación con sólo una vez al final de la cadena de promesas:</p>
+
+<pre class="brush: js">hazAlgo()
+.then(resultado =&gt; hazAlgoMas(valor))
+.then(nuevoResultado =&gt; hazLaTerceraCosa(nuevoResultado))
+.then(resultadoFinal =&gt; console.log(`Obtenido el resultado final: ${resultadoFinal}`))
+.catch(falloCallback);
+</pre>
+
+<p>Básicamente, una cadena de promesas se detiene si hay una excepción, y recorre la cadena buscando manejadores de captura. Lo siguiente está mucho más adaptado a la forma de trabajo del código síncrono:</p>
+
+<pre class="brush: js">try {
+  let resultado = syncHazAlgo();
+  let nuevoResultado = syncHazAlgoMas(resultado);
+  let resultadoFinal = syncHazLaTerceraCosa(nuevoResultado);
+  console.log(`Obtenido el resultado final: ${resultadoFinal}`);
+} catch(error) {
+  falloCallback(error);
+}
+</pre>
+
+<p>Esta simetría con el código síncrono culmina con la mejora sintáctica <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/funcion_asincrona">async/await</a> en ECMASCript 2017:</p>
+
+<pre class="brush: js">async function foo() {
+  try {
+    let resultado = await hazAlgo();
+    let nuevoResultado = await hazAlgoMas(resultado);
+    let resultadoFinal = await hazLaTerceraCosa(nuevoResultado);
+    console.log(`Obtenido el resultado final: ${resultadoFinal}`);
+  } catch(error) {
+    falloCallback(error);
+  }
+}
+</pre>
+
+<p>Se construye sobre <code>promesas</code>, por ejemplo, <code>hazAlgo()</code> es la misma función que antes. Puedes leer más sobre la sintaxis <a href="https://developers.google.com/web/fundamentals/getting-started/primers/async-functions">aquí</a>.</p>
+
+<p>Las <code>promesas</code> resuelven un fallo fundamental de la pirámide de funciones callback, capturando todos los errores, incluso excepciones lanzadas y errores de programación. Esto es esencial para la composición funcional de operaciones asíncronas.</p>
+
+<h2 id="Eventos_de_rechazo_de_Promesas">Eventos de rechazo de Promesas</h2>
+
+<p>Cuando una <code>promesa</code> es rechazada, uno de los dos eventos se envía al ámbito global (generalmente, éste es el {{domxref("window")}}, o, si se utiliza en un trabajador web, es el  {{domxref("Worker")}} u otra interfaz basada en un trabajador). Los dos eventos son:</p>
+
+<p><strong>{{domxref("Window.rejectionhandled_event", "rejectionhandled")}}</strong></p>
+
+<p>Se envía cuando se rechaza una promesa, una vez que el rechazo ha sido manejado por la función <code>reject</code> del ejecutor.</p>
+
+<p><strong>{{domxref("Window.unhandledrejection_event", "unhandledrejection")}}</strong></p>
+
+<p>Se envía cuando se rechaza una promesa pero no hay un controlador de rechazo disponible.</p>
+
+<p>En ambos casos, el evento (del tipo {{domxref("PromiseRejectionEvent")}}) tiene como miembros una propiedad {{domxref("PromiseRejectionEvent.promise", "promise")}} que indica que la promesa fue rechazada, y una propiedad {{domxref("PromiseRejectionEvent.reason", "reason")}} que proporciona el motivo por el cuál se rechaza la promesa.</p>
+
+<p>Esto hace posible ofrecer el manejo de errores de promesas, y también ayuda a depurarlos. Estos controladores son globales, por lo tanto, todos los errores serán manejados por éstos independientemente de la fuente.</p>
+
+<p><u>Un caso de especial utilidad</u>: al escribir código para {{Glossary("Node.js")}}, es común que los módulos que incluyas en tu proyecto no cuenten con un controlador de evento para promesas rechazadas. Estos se registran en la consola en tiempo de ejecución de Node. Puedes capturarlos para analizarlos y manejarlos en tu código - o solo evitar que abarroten tu salida - agregando un controlador para el evento {{domxref("Window.unhandledrejection_event", "unhandledrejection")}}, como se muestra a continuación:</p>
+
+<pre><code>window.addEventListener("</code>unhandledrejection<code>", event =&gt; {
+  /* Podrías comenzar agregando código para examinar
+     la promesa específica analizando event.promise
+     y la razón del rechazo, accediendo a event.reason */
+
+  event.preventDefault();
+}, false);</code></pre>
+
+<p>Llamando al método {{domxref("Event.preventDefault", "preventDefault()")}} del evento, le dices a Javascript en tiempo de ejecución que no realice su acción predeterminada cuando las promesas rechazadas no cuenten con manejadores. En el caso de Node, esa acción predeterminada usualmente registra el error en la consola.</p>
+
+<p>Lo ideal, por supuesto, sería examinar las promesas rechazadas para asegurarte que ninguna de ellas tienen errores de código reales antes de descartar esos eventos.</p>
+
+<h2 id="Crear_una_promesa_alrededor_de_una_vieja_API_de_callbacks"><strong>Crear una promesa alrededor de una vieja API de callbacks</strong></h2>
+
+<p>Una {{jsxref("Promise")}} puede ser creada desde cero usando su constructor. Esto debería ser sólo necesario para envolver viejas APIs.</p>
+
+<p>En un mundo ideal, todas las funciones asíncronas devolverían promesas. Desafortunadamente, algunas APIs aún esperan que se les pase callbacks con resultado fallido/exitoso a la forma antigua. El ejemplo más obvio es la función {{domxref("WindowTimers.setTimeout", "setTimeout()")}}:</p>
+
+<pre class="brush: js">setTimeout(() =&gt; diAlgo("pasaron 10 segundos"), 10000);
+</pre>
+
+<p>Combinar callbacks del viejo estilo con promesas es problemático. Si <code>diAlgo</code> falla o contiene un error de programación, nada lo captura. La función <code>setTimeout</code> es culpable de esto.</p>
+
+<p>Afortunadamente podemos envolverlas en una promesa. La mejor práctica es envolver las funciones problemáticas en el nivel más bajo posible, y después nunca llamarlas de nuevo  directamente:</p>
+
+<pre class="brush: js">const espera = ms =&gt; new Promise(resuelve =&gt; setTimeout(resuelve, ms));
+
+espera(10000).then(() =&gt; diAlgo("10 segundos")).catch(falloCallback);
+</pre>
+
+<p>Básicamente, el constructor de la promesa toma una función ejecutora que nos permite resolver o rechazar manualmente una promesa. Dado que <code>setTimeout</code> no falla realmente, descartamos el rechazo en este caso.</p>
+
+<h2 id="Composición">Composición</h2>
+
+<p>{{jsxref("Promise.resolve()")}} y {{jsxref("Promise.reject()")}} son atajos para crear manualmente una promesa resuelta o rechazada respectivamente. Esto puede ser útil a veces.</p>
+
+<p>{{jsxref("Promise.all()")}} son {{jsxref("Promise.race()")}} son dos herramientas de composición para ejecutar operaciones asíncronas en paralelo.</p>
+
+<p>Podemos comenzar operaciones en paralelo y esperar que finalicen todas ellas de la siguiente manera:</p>
+
+<pre><code>Promise.all([func1(), func2(), func3()])
+.then(([resultado1, resultado2, resultado3]) =&gt; { /* usa resultado1, resultado2 y resultado3 */ });</code></pre>
+
+<p>La composición secuencial es posible usando Javascript inteligente:</p>
+
+<pre><code>[func1, func2, func3].reduce((p, f) =&gt; p.then(f), Promise.resolve())
+.then(result3 =&gt; { /* use result3 */ });</code></pre>
+
+<p>Básicamente, reducimos un conjunto de funciones asíncronas a una cadena de promesas equivalente a: <code>Promise.resolve().then(func1).then(func2).then(func3);</code></p>
+
+<p>Esto se puede convertir en una función de composición reutilizable, que es común en la programación funcional:</p>
+
+<pre><code>const aplicarAsync = (acc,val) =&gt; acc.then(val);
+const componerAsync = (...funcs) =&gt; x =&gt; funcs.reduce(aplicarAsync, Promise.resolve(x));</code></pre>
+
+<p>La función <code>componerAsync()</code> aceptará cualquier número de funciones como argumentos, y devolverá una nueva función que acepta un valor inicial que es pasado a través del conducto de composición. Esto es beneficioso porque cualquiera o todas las funciones pueden ser o asíncronas o síncronas y se garantiza que serán ejecutadas en el orden correcto:</p>
+
+<pre class="brush: js">const transformData = componerAsync(func1, asyncFunc1, asyncFunc2, func2);
+const resultado3 = transformData(data);
+</pre>
+
+<p>En ECMAScript 2017, la composición secuencial puede ser realizada usando simplemente async/await:</p>
+
+<pre class="brush: js">let resultado;
+for (const f of [func1, func2, func3]) {
+  resultado = await f(resultado);
+}
+</pre>
+
+<h2 id="Sincronización">Sincronización</h2>
+
+<p>Para evitar sorpresas, las funciones pasadas a <code>then()</code> nunca serán llamadas sincrónicamente, incluso con una promesa ya resuelta:</p>
+
+<pre class="brush: js">Promise.resolve().then(() =&gt; console.log(2));
+console.log(1); // 1, 2
+</pre>
+
+<p>En lugar de ejecutarse inmediatamente, la función pasada es colocada en una cola de microtareas, lo que significa que se ejecuta más tarde cuando la cola es vaciada al final del actual ciclo de eventos de JavaScript:</p>
+
+<pre class="brush: js">const espera = ms =&gt; new Promise(resuelve =&gt; setTimeout(resuelve, ms));
+
+espera().then(() =&gt; console.log(4));
+Promise.resuelve().then(() =&gt; console.log(2)).then(() =&gt; console.log(3));
+console.log(1); // 1, 2, 3, 4
+</pre>
+
+<h2 id="Anidamiento">Anidamiento</h2>
+
+<p>Las cadenas de promesas simples se mantienen planas sin anidar, ya que el anidamiento puede ser el resultado de una composición descuidada. Vea <a href="/es/docs/Web/JavaScript/Guide/Usar_promesas$edit#Common_mistakes">errores comunes</a>.</p>
+
+<p>El anidamiento es una estructura de control para limitar el alcance de las sentencias <code>catch</code>. Específicamente, un <code>catch</code> anidado sólo captura fallos dentro de su contexto y por debajo, no captura errores que están más arriba en la cadena fuera del alcance del anidamiento. Cuando se usa correctamente, da mayor precisión en la recuperación de errores:</p>
+
+<pre><code>hacerAlgoCritico()
+.then(resultado =&gt; hacerAlgoOpcional()
+  .then(resultadoOpcional =&gt; hacerAlgoSuper(resultadoOpcional))
+  .catch(e =&gt; {})) // Ignorar si hacerAlgoOpcional falla.
+.then(() =&gt; masAsuntosCriticos())
+.catch(e =&gt; console.log("Acción crítica fallida: " + e.message));</code>
+</pre>
+
+<p>Nota que aquí los pasos opcionales están anidados, por la precaria colocación de lo externo (y) alrededor de ellos.</p>
+
+<p>La declaración interna <code>catch</code> solo detecta errores de <code>hacerAlgoOpcional()</code> y <code>hacerAlgoSuper()</code>, después de lo cuál el código se reanuda con <code>masAsuntosCriticos()</code>. Es importante destacar que si <code>hacerAlgoCritico()</code> falla, el error es capturado únicamente por el <code>catch</code> final.</p>
+
+<h2 id="Errores_comunes">Errores comunes</h2>
+
+<p>Aquí hay algunos errores comunes que deben tenerse en cuenta al componer cadenas de promesas. Varios de estos errores se manifiestan en el siguiente ejemplo:</p>
+
+<pre><code>// ¡Mal ejemplo!
+hacerlAlgo().then(function(resultado) {
+  hacerOtraCosa(resultado) // Olvida devolver una promesa desde el interior de la cadena + anidamiento innecesario
+  .then(nuevoResultado =&gt; hacerUnaTerceraCosa(nuevoResultado));
+}).then(() =&gt; hacerUnaCuartaCosa());
+// Olvida terminar la cadena con un catch!</code></pre>
+
+<p>El primer error es no encadenar las acciones adecuadamente. Esto sucede cuando creamos una promesa y olvidamos devolverla. Como consecuencia, la cadena se rompe, o mejor dicho, tenemos dos cadenas independientes que compiten. Esto significa que <code>hacerUnaCuartaCosa()</code> no esperará a que finalicen <code>hacerOtraCosa()</code> o <code>hacerUnaTerceraCosa()</code>, y se ejecutará paralelamente a ellas. Las cadenas separadas también tienen un manejador de errores separado, lo que provoca errores no detectados.</p>
+
+<p>El segundo error es el anidamiento innecesario, que da lugar al primer error. La anidación también limita el alcance de los manejadores de errores internos, que - si no son deseados - pueden llevar a errores no detectados. Una variante de esto es el <a href="https://stackoverflow.com/questions/23803743/what-is-the-explicit-promise-construction-antipattern-and-how-do-i-avoid-it">constructor anti-patrón de promesas</a>, el cuál combina el anidamiento con el uso redundante del constructor de promesa para envolver el código que ya usa promesas. </p>
+
+<p>El tercer error es olvidar cerrar las cadenas con catch.Las cadenas de promesas no terminadas conducen a errores no capturados en la mayoría de los navegadores.</p>
+
+<p>Una buena regla es devolver o terminar siempre las cadenas de promesas, y tan pronto como obtenga una nueva promesa, devolverla de inmediato, para aplanar las cosas:</p>
+
+<pre><code>hacerAlgo()
+.then(function(resultado) {
+  return hacerOtraCosa(resultado);
+})
+.then(nuevoResultado =&gt; hacerUnaTerceraCosa(nuevoResultado))
+.then(() =&gt; hacerUnaCuartaCosa())
+.catch(error =&gt; console.log(error));</code></pre>
+
+<p>Nota que <code>() =&gt; x</code> es un atajo para <code>() =&gt; { return x; }</code>.</p>
+
+<p>Ahora tenemos una cadena determinística simple con un manejador de error adecuado.</p>
+
+<p>El uso de <a href="/en-US/docs/Web/JavaScript/Reference/Statements/async_function">async / await</a> aborda la mayoría, si no todos estos problemas, la desventaja es que el error más común con esa sintaxis es olvidar la palabra clave <a href="en-US/docs/Web/JavaScript/Reference/Statements/async_function">await</a>.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Promise.then()")}}</li>
+ <li><a href="http://promisesaplus.com/">Promises/A+ specification</a></li>
+ <li><a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">Nolan Lawson: Tenemos un problema con las promesas — Errores comunes con las promesas</a></li>
+</ul>
diff --git a/files/es/web/javascript/guide/working_with_objects/index.html b/files/es/web/javascript/guide/working_with_objects/index.html
new file mode 100644
index 0000000000..3dfdad3248
--- /dev/null
+++ b/files/es/web/javascript/guide/working_with_objects/index.html
@@ -0,0 +1,494 @@
+---
+title: Trabajando con objetos
+slug: Web/JavaScript/Guide/Working_with_Objects
+tags:
+  - Comparación de objetos
+  - Constructor
+  - Documento
+  - Guía
+  - JavaScript
+  - Objeto
+  - Principiante
+translation_of: Web/JavaScript/Guide/Working_with_Objects
+original_slug: Web/JavaScript/Guide/Trabajando_con_objectos
+---
+<div>{{jsSidebar("Guía de JavaScript")}} {{PreviousNext("Web/JavaScript/Guide/Keyed_collections", "Web/JavaScript/Guide/Details_of_the_Object_Model")}}</div>
+
+<p class="summary">JavaScript está diseñado en un paradigma simple basado en objetos. Un objeto es una colección de propiedades, y una propiedad es una asociación entre un nombre (o <em>clave</em>) y un valor. El valor de una propiedad puede ser una función, en cuyo caso la propiedad es conocida como un método. Además de los objetos que están predefinidos en el navegador, puedes definir tus propios objetos. Este capítulo describe cómo usar objetos, propiedades, funciones y métodos; y cómo crear tus propios objectos.</p>
+
+<h2 id="Visión_general_sobre_Objetos">Visión general sobre Objetos</h2>
+
+<p>Los objetos en JavaScript, como en tantos otros lenguajes de programación, se pueden comparar con objetos de la vida real. El concepto de Objetos en JavaScript se puede entender con objetos tangibles de la vida real.</p>
+
+<p>En JavaScript, un objeto es un entidad independiente con propiedades y tipos. Compáralo con una taza, por ejemplo. Una taza es un objeto con propiedades. Una taza tiene un color, un diseño, un peso, un material del que está hecha, etc. Del mismo modo, los objetos de JavaScript pueden tener propiedades que definan sus características.</p>
+
+<h2 id="Objetos_y_propiedades">Objetos y propiedades</h2>
+
+<p>Un objeto de JavaScript tiene propiedades asociadas a él. Una propiedad de un objeto se puede explicar como una variable adjunta al objeto. Las propiedades de un objeto básicamente son lo mismo que las variables comunes de JavaScript, excepto por el nexo con el objeto. Las propiedades de un objeto definen las características del objeto. Accedes a las propiedades de un objeto con una simple notación de puntos:</p>
+
+<pre class="brush: js notranslate">objectName.propertyName
+</pre>
+
+<p>Como todas las <code>variables</code> de JavaScript, tanto el nombre del objeto (que puede ser una variable normal) como el nombre de la propiedad son sensibles a mayúsculas y minúsculas. Puedes definir propiedades asignándoles un valor. Por ejemplo, vamos a crear un objeto llamado <code>myCar</code> y le vamos a asignar propiedades denominadas <code>make</code>, <code>model</code>, y <code>year</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">var myCar = new Object();
+myCar.make = 'Ford';
+myCar.model = 'Mustang';
+myCar.year = 1969;
+</pre>
+
+<p>El ejemplo anterior también se podría escribir usando un <strong><a href="/es/docs/Web/JavaScript/Guide/Working_with_Objects#Object_initializers">iniciador de objeto</a></strong>, que es una lista delimitada por comas de cero o más pares de nombres de propiedad y valores asociados de un objeto, encerrados entre llaves (<code>{}</code>):</p>
+
+<pre class="brush: js notranslate">var myCar = {
+    make: 'Ford',
+    model: 'Mustang',
+    year: 1969
+};
+</pre>
+
+<p>Las propiedades no asignadas de un objeto son {{jsxref("undefined")}} (y​no {{jsxref("null")}}).</p>
+
+<pre class="brush: js notranslate">myCar.color; // undefined</pre>
+
+<p>También puedes acceder o establecer las propiedades de los objetos en JavaScript mediante la notación de corchetes ↑[]↓ (Para más detalle ve <a href="/es/docs/Web/JavaScript/Reference/Operators/Property_Accessors">Accesores de propiedades</a>). Los objetos, a veces son llamados <em>arreglos asociativos</em>, debido a que cada propiedad está asociada con un valor de cadena que se puede utilizar para acceder a ella. Por lo tanto, por ejemplo, puedes acceder a las propiedades del objeto <code>myCar</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">myCar['make']  = 'Ford';
+myCar['model'] = 'Mustang';
+myCar['year']  = 1969;
+</pre>
+
+<p>El nombre de la propiedad de un objeto puede ser cualquier cadena válida de JavaScript, o cualquier cosa que se pueda convertir en una cadena, incluyendo una cadena vacía. Sin embargo, cualquier nombre de propiedad que no sea un identificador válido de JavaScript (por ejemplo, el nombre de alguna propiedad que tenga un espacio o un guión, o comience con un número) solo se puede acceder utilizando la notación de corchetes. Esta notación es muy útil también cuando los nombres de propiedades son determinados dinámicamente (cuando el nombre de la propiedad no se determina hasta el tiempo de ejecución). Ejemplos de esto se muestran a continuación:</p>
+
+<pre class="brush: js notranslate">// Se crean y asignan cuatro variables de una sola vez,
+// separadas por comas
+var myObj = new Object(),
+    str = 'myString',
+    rand = Math.random(),
+    obj = new Object();
+
+myObj.type                 = 'Sintaxis de puntos';
+myObj['fecha de creación'] = 'Cadena con espacios';
+myObj[str]                 = 'Valor de cadena';
+myObj[rand]                = 'Número aleatorio';
+myObj[obj]                 = 'Object';
+myObj['']                  = 'Incluso una cadena vacía';
+
+console.log(myObj);
+</pre>
+
+<p>Por favor, ten en cuenta que todas las claves con notación en corchetes se convierten a cadenas a menos que estas sean símbolos, ya que los nombres de las propiedades (claves) en Javascript pueden solo pueden ser cadenas o símbolos (en algún momento, los nombres privados también serán agregados a medida que progrese la <a href="https://github.com/tc39/proposal-class-fields">propuesta de los campos de clase</a>, pero no las usarás con el formato <code>[]</code>). Por ejemplo, en el código anterior, cuando la clave <code>obj</code> se añadió a <code>myObj</code>, Javascript llamará al método {{jsxref("Object.toString", "obj.toString()")}}, y usará la cadena resultante de esta llamada como la nueva clave.</p>
+
+<p>También puedes acceder a las propiedades mediante el uso de un valor de cadena que se almacena en una variable:</p>
+
+<pre class="brush: js notranslate">var propertyName = 'make';
+myCar[propertyName] = 'Ford';
+
+propertyName = 'model';
+myCar[propertyName] = 'Mustang';
+</pre>
+
+<p>Puedes usar la notación de corchetes con <code><a href="/es/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></code> para iterar sobre todas las propiedades enumerables de un objeto. Para ilustrar cómo funciona esto, la siguiente función muestra las propiedades del objeto cuando pasas el objeto y el nombre del objeto como argumentos a la función:</p>
+
+<pre class="brush: js notranslate">function showProps(obj, objName) {
+  var result = ``;
+  for (var i in obj) {
+    // obj.hasOwnProperty() se usa para filtrar propiedades de la cadena de prototipos del objeto
+    if (obj.hasOwnProperty(i)) {
+      result += `${objName}.${i} = ${obj[i]}\n`;
+    }
+  }
+  return result;
+}
+</pre>
+
+<p>Por lo tanto, la llamada a la función <code>showProps(myCar, "myCar")</code> devolverá lo siguiente:</p>
+
+<pre class="brush: js notranslate">myCar.make = Ford
+myCar.model = Mustang
+myCar.year = 1969</pre>
+
+<h2 id="Enumerar_las_propiedades_de_un_objeto">Enumerar las propiedades de un objeto</h2>
+
+<p>A partir de <a href="/es/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla" title="/es/docs/JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5</a>, hay tres formas nativas para enumerar/recorrer las propiedades de objetos:</p>
+
+<ul>
+ <li><code><a href="/es/docs/Web/JavaScript/Reference/Statements/for...in" title="/es/docs/JavaScript/Reference/Statements/for...in">bucles for...in</a></code><br>
+  Este método recorre todas las propiedades enumerables de un objeto y su cadena de prototipos</li>
+ <li>{{jsxref("Object.keys", "Object.keys(o)")}}<br>
+  Este método devuelve un arreglo con todos los nombres de propiedades enumerables ("<code>claves</code>") propias (no en la cadena de prototipos) de un objeto <code>o</code>.</li>
+ <li>{{jsxref("Object.getOwnPropertyNames", "Object.getOwnPropertyNames(o)")}}<br>
+  Este método devuelve un arreglo que contiene todos los nombres (enumerables o no) de las propiedades de un objeto <code>o</code>.</li>
+</ul>
+
+<p>Antes de ECMAScript 5, no existía una manera nativa para enumerar todas las propiedades de un objeto. Sin embargo, esto se puede lograr con la siguiente función:</p>
+
+<pre class="brush: js notranslate">function listAllProperties(o) {
+       var objectToInspect;
+       var result = [];
+
+       for(objectToInspect = o; objectToInspect !== null;
+           objectToInspect = Object.getPrototypeOf(objectToInspect)) {
+        result = result.concat(
+            Object.getOwnPropertyNames(objectToInspect)
+        );
+    }
+
+        return result;
+}
+</pre>
+
+<p>Esto puede ser útil para revelar propiedades "ocultas" (propiedades de la cadena de prototipos a las que no se puede acceder a través del objeto, porque otra propiedad tiene el mismo nombre en la cadena de prototipos). Enumerar las propiedades accesibles solo es posible eliminando los duplicados en el arreglo.</p>
+
+<h2 id="Creación_de_nuevos_objetos">Creación de nuevos objetos</h2>
+
+<p>JavaScript tiene una colección de objetos predefinidos. Además, puedes crear tus propios objetos. En JavaScript 1.2 y versiones posteriores, puedes crear un objeto usando un <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">iniciador de objeto</a>. Como alternativa, puedes crear primero una función constructora y luego crear una instancia de un objeto invocando esa función con el operador <code>new</code>.</p>
+
+<h3 id="Uso_de_iniciadores_de_objeto"><span id="Object_initializers">Uso de iniciadores de objeto</span></h3>
+
+<p>Además de la creación de objetos utilizando una función constructora, puedes crear objetos utilizando un <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">iniciador de objeto</a>. El uso de iniciadores de objetos a veces se denomina crear objetos con notación literal. "Iniciador de objeto" es consistente con la terminología utilizada por C++.</p>
+
+<p>La sintaxis para un objeto usando un iniciador de objeto es:</p>
+
+<pre class="brush: js notranslate">var obj = { property_1:   value_1,   // property_# puede ser un identificador...
+            2:            value_2,   // o un número...
+            // ...,
+            'property n': value_n }; // o una cadena
+</pre>
+
+<p>donde <code>obj</code> es el nombre del nuevo objeto, cada <code>property_<var>i</var></code> es un identificador (ya sea un nombre, un número o una cadena literal), y cada <code>value_<var>i</var></code> es una expresión cuyo valor se asigna a la <code>property_<var>i</var></code>. El <code>obj</code> y la asignación es opcional; si no necesitas hacer referencia a este objeto desde otro lugar, no necesitas asignarlo a una variable. (Ten en cuenta que tal vez necesites envolver el objeto literal entre paréntesis si el objeto aparece donde se espera una declaración, a fin de no confundir el literal con una declaración de bloque).</p>
+
+<p>Los iniciadores de objetos son expresiones, y cada iniciador de objeto da como resultado un nuevo objeto donde la instrucción de creación sea ejecutada. Los iniciadores de objetos idénticos crean objetos distintos que no se compararán entre sí como iguales. Los objetos se crean como si se hiciera una llamada a <code>new Object()</code>; es decir, los objetos hechos a partir de expresiones literales de objeto son instancias de <code>Object</code>.</p>
+
+<p>La siguiente declaración crea un objeto y lo asigna a la variable <code>x</code> si y solo si la expresión <code>cond</code> es <code>true</code>.</p>
+
+<pre class="brush: js notranslate">if (cond) var x = {greeting: '¡Hola!'};
+</pre>
+
+<p>El siguiente ejemplo crea <code>myHonda</code> con tres propiedades. Observa que la propiedad <code>engine</code> también es un objeto con sus propias propiedades.</p>
+
+<pre class="brush: js notranslate">var myHonda = {color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}};
+</pre>
+
+<p>También puedes utilizar iniciadores de objetos para crear arreglos. Consulta <a href="/es/docs/Web/JavaScript/Guide/Grammar_and_types#Array_literals">arreglos literales</a>.</p>
+
+<h3 id="Usar_una_función_constructora">Usar una función constructora</h3>
+
+<p>Como alternativa, puedes crear un objeto con estos dos pasos:</p>
+
+<ol>
+ <li>Definir el tipo de objeto escribiendo una función constructora. Existe una fuerte convención, con buena razón, para utilizar en mayúscula la letra inicial.</li>
+ <li>Crear una instancia del objeto con el operador <code>new</code>.</li>
+</ol>
+
+<p>Para definir un tipo de objeto, crea una función para el objeto que especifique su nombre, propiedades y métodos. Por ejemplo, supongamos que deseas crear un tipo de objeto para coches. Quieres llamar <code>Car</code> a este tipo de objeto, y deseas que tenga las siguientes propiedades: <code>make</code>, <code>model</code> y <code>year</code>. Para ello, podrías escribir la siguiente función:</p>
+
+<pre class="brush: js notranslate">function Car(make, model, year) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+}
+</pre>
+
+<p>Observa el uso de <code>this</code> para asignar valores a las propiedades del objeto en función de los valores pasados a la función.</p>
+
+<p>Ahora puedes crear un objeto llamado <code>myCar</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">var mycar = new Car('Eagle', 'Talon TSi', 1993);
+</pre>
+
+<p>Esta declaración crea <code>myCar</code> y le asigna los valores especificados a sus propiedades. Entonces el valor de <code>myCar.make</code> es la cadena "Eagle", para <code>myCar.year</code> es el número entero 1993, y así sucesivamente.</p>
+
+<p>Puedes crear cualquier número de objetos <code>Car</code> con las llamadas a <code>new</code>. Por ejemplo,</p>
+
+<pre class="brush: js notranslate">var kenscar = new Car('Nissan', '300ZX', 1992);
+var vpgscar = new Car('Mazda', 'Miata', 1990);
+</pre>
+
+<p>&lt;s0&gt;Un objeto puede tener una propiedad que en sí misma es otro objeto. Por ejemplo, supongamos que defines un objeto llamado <code>person</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">function Person(name, age, sex) {
+  this.name = name;
+  this.age = age;
+  this.sex = sex;
+}
+</pre>
+
+<p>y luego instancias dos nuevos objetos <code>person</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">var rand = new Person('Rand McKinnon', 33, 'M');
+var ken = new Person('Ken Jones', 39, 'M');
+</pre>
+
+<p>Entonces, puedes volver a escribir la definición de <code>Car</code> para incluir una propiedad <code>owner</code> que tomará el objeto <code>person</code>, de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">function Car(make, model, year, owner) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+  this.owner = owner;
+}
+</pre>
+
+<p>Para crear instancias de los nuevos objetos, utiliza lo siguiente:</p>
+
+<pre class="brush: js notranslate">var car1 = new Car('Eagle', 'Talon TSi', 1993, rand);
+var car2 = new Car('Nissan', '300ZX', 1992, ken);
+</pre>
+
+<p>Nota que en lugar de pasar un valor de cadena o entero cuando se crean los nuevos objetos, las declaraciones anteriores pasan al objetos <code>rand</code> y <code>ken</code> como argumentos para los <code>owner</code>s. Si luego quieres averigüar el nombre del propietario del <code>car2</code>, puedes acceder a la propiedad de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">car2.owner.name
+</pre>
+
+<p>Ten en cuenta que siempre se puede añadir una propiedad a un objeto previamente definido. Por ejemplo, la declaración</p>
+
+<pre class="brush: js notranslate">car1.color = 'black';
+</pre>
+
+<p>agrega la propiedad <code>color</code> a <code>car1</code>, y le asigna el valor "<code>black</code>". Sin embargo, esto no afecta a ningún otro objeto. Para agregar la nueva propiedad a todos los objetos del mismo tipo, tienes que añadir la propiedad a la definición del tipo de objeto <code>Car</code>.</p>
+
+<h3 id="Usar_el_método_Object.create">Usar el método <code>Object.create</code></h3>
+
+<p>Los objetos también se pueden crear por medio del método {{jsxref("Object.create()")}}. Este método puede ser muy útil, ya que te permite elegir el prototipo del objeto que deseas crear, sin tener que definir una función constructora.</p>
+
+<pre class="brush: js notranslate">// Propiedades y método de encapsulación para Animal
+var Animal = {
+  type: 'Invertebrates', // Valor predeterminado de las propiedades
+  displayType: function() {  // Método que mostrará el tipo de Animal
+    console.log(this.type);
+  }
+};
+
+// Crea un nuevo tipo de animal llamado animal1
+var animal1 = Object.create(Animal);
+animal1.displayType(); // Muestra: Invertebrates
+
+// Crea un nuevo tipo de animal llamado Fishes
+var fish = Object.create(Animal);
+fish.type = 'Fishes';
+fish.displayType();    // Muestra: Fishes</pre>
+
+<h2 id="Herencia">Herencia</h2>
+
+<p>Todos los objetos en JavaScript heredan de al menos otro objeto. El objeto del que se hereda se conoce como el prototipo, y las propiedades heredadas se pueden encontrar en el objeto <code>prototype</code> del constructor. Para más información consulta <a href="/es/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">Herencia y cadena prototipos</a>.</p>
+
+<h2 id="Propiedades_del_objeto_indexado">Propiedades del objeto indexado</h2>
+
+<p>En &lt;s0&gt;JavaScript 1.0&lt;/s0&gt;, puedes hacer referencia a una propiedad de un objeto, ya sea por el nombre de la propiedad o por su índice ordinal. Si inicialmente defines una propiedad por su nombre, siempre debes referirte a ella por su nombre, y si inicialmente defines una propiedad por un índice, siempre debes referirte a ella por su índice.</p>
+
+<p>Esta restricción se aplica cuando creas un objeto y sus propiedades con una función constructora (como hicimos anteriormente con el tipo de objeto <code>Car</code>) y cuando defines propiedades individuales explícitamente (por ejemplo, <code>myCar.color = "red"</code>). Si inicialmente defines una propiedad de objeto con un índice, como <code>myCar[5] = "25 mpg"</code>, posteriormente te refiere a la propiedad solo como <code>myCar[5]</code>.</p>
+
+<p>La excepción a esta regla son los objetos HTML, como por ejemplo los objetos contenidos en <code>formularios</code>. Siempre puedes hacer referencia a los objetos en estos objetos en forma de arreglo por su número ordinal (según el lugar en el que aparecen en el documento) o por su nombre (si está definido). Por ejemplo, si la segunda etiqueta <code>&lt;FORM&gt;</code> en un documento tiene un atributo <code>NAME</code> con valor "<code>myForm</code>", puedes hacer referencia al formulario como <code>document.forms[1]</code> o <code>document.forms["myForm"]</code> o <code>document.forms.myForm</code>.</p>
+
+<h2 id="Definición_de_las_propiedades_de_un_tipo_de_objeto">Definición de las propiedades de un tipo de objeto</h2>
+
+<p>Puedes agregar una propiedad a un tipo de objeto definido previamente mediante el uso de la propiedad <code>prototype</code>. Esto define una propiedad que es compartida por todos los objetos del tipo especificado, en lugar de por una sola instancia del objeto. El siguiente código agrega una propiedad <code>color</code> a todos los objetos del tipo <code>Car</code>, y luego asigna un valor a la propiedad <code>color</code> del objeto <code>car1</code>.</p>
+
+<pre class="brush: js notranslate">Car.prototype.color = null;
+car1.color = 'black';
+</pre>
+
+<p>Para más información, consulta la <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype" title="/es/docs/JavaScript/Reference/Global Objects/Function/prototype">propiedad <code>prototype</code></a> del objeto <code>Function</code> en la <a href="/es/docs/Web/JavaScript/Reference">Referencia de JavaScript</a>.</p>
+
+<h2 id="Definición_de_métodos">Definición de métodos</h2>
+
+<p>Un <em>método</em> es una función asociada a un objeto, o, simplemente, un método es una propiedad de un objeto que es una función. Los métodos se definen normalmente como una función, con excepción de que tienen que ser asignados como la propiedad de un objeto. Consulte también <a href="/es/docs/Web/JavaScript/Reference/Functions/Method_definitions">definiciones de métodos</a> para obtener más detalles. Un ejemplo puede ser:</p>
+
+<pre class="brush: js notranslate">objectName.methodname = functionName;
+
+var myObj = {
+  myMethod: function(params) {
+    // ...hacer algo
+  }
+
+  // O ESTO TAMBIÉN FUNCIONA
+
+  myOtherMethod(params) {
+    // ...hacer algo más
+  }
+};
+</pre>
+
+<p>&lt;s0&gt;donde <code>objectName</code> es un objeto existente, <code>methodname</code> es el nombre que se le va a asignar al método, y <code>functionName</code> es el nombre de la función.</p>
+
+<p>Entonces puedes llamar al método en el contexto del objeto de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">object.methodname(params);
+</pre>
+
+<p>Puedes definir métodos para un tipo de objeto incluyendo una definición del método en la función constructora del objeto. Podrías definir una función que formateé y muestre las propiedades de los objetos del tipo <code>Car</code> previamente definidas; por ejemplo:</p>
+
+<pre class="brush: js notranslate">function displayCar() {
+  var result = `Un hermoso ${this.year} ${this.make} ${this.model}`;
+  pretty_print(result);
+}
+</pre>
+
+<p>donde <code>pretty_print</code> es una función para mostrar una línea horizontal y una cadena. Observa el uso de <code>this</code> para referirse al objeto al que pertenece el método.</p>
+
+<p>Puedes hacer de esta función un método de <code>Car</code> agregando la declaración</p>
+
+<pre class="brush: js notranslate">this.displayCar = displayCar;
+</pre>
+
+<p>a la definición del objeto. Por lo tanto, la definición completa de <code>Car</code> ahora se verá así:</p>
+
+<pre class="brush: js notranslate">function Car(make, model, year, owner) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+  this.owner = owner;
+  this.displayCar = displayCar;
+}
+</pre>
+
+<p>Entonces puedes llamar al método <code>displayCar</code> para cada uno de los objetos de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">car1.displayCar();
+car2.displayCar();
+</pre>
+
+<h2 id="Usar_this_para_referencias_a_objetos">Usar <code>this</code> para referencias a objetos</h2>
+
+<p>JavaScript tiene una palabra clave especial, <code>this</code>, que puedes usar dentro de un método para referirte al objeto actual. Por ejemplo, supongamos que tienes 2 objetos,<code>Manager</code> e <code>Intern</code>. Cada objeto tiene su propio <code>name</code>,<code>age</code> y <code>job</code>. En la función <code>sayHi()</code>, observa que hay <code>this.name</code>. Cuando se agregan a los 2 objetos, se pueden llamar y devuelve el <code>'Hola, mi nombre es'</code> y luego agrega el valor <code>name</code> de ese objeto específico. Como se muestra abajo. </p>
+
+<pre class="brush: js notranslate">const Manager = {
+  name: "John",
+  age: 27,
+  job: "Software Engineer"
+}
+
+const Intern= {
+  name: "Ben",
+  age: 21,
+  job: "Software Engineer Intern"
+}
+
+function sayHi() {
+    console.log('Hola, mi nombre es ', this.name)
+}
+
+// agrega la función sayHi a ambos objetos
+Manager.sayHi = sayHi;
+Intern.sayHi = sayHi;
+
+Manager.sayHi() // Hola, mi nombre es John'
+Intern.sayHi() // Hola, mi nombre es Ben'
+</pre>
+
+<p><code>this</code> se refiere al objeto en el que se encuentra. Puedes crear una nueva función llamada <code>howOldAmI()</code> que registra una oración que dice cuántos años tiene la persona. </p>
+
+<pre class="brush: js notranslate">function howOldAmI() {
+  console.log('Tengo ' + this.age + ' años.')
+}
+Manager.howOldAmI = howOldAmI;
+Manager.howOldAmI() // Tengo 27 años.
+</pre>
+
+<h2 id="Definición_de_captadores_getters_y_establecedores_setters">Definición de captadores (<code>getters</code>) y establecedores (<code>setters</code>)</h2>
+
+<p>Un captador (<a href="/es/docs/Web/JavaScript/Reference/Functions/get">getter</a>) es un método que obtiene el valor de una propiedad específica. Un establecedor (<a href="/es/docs/Web/JavaScript/Reference/Functions/set">setter</a>) es un método que establece el valor de una propiedad específica. Puedes definir captadores y establecedores en cualquier objeto principal predefinido o en un objeto definido por el usuario que admita la adición de nuevas propiedades. </p>
+
+<p>En principio, los captadores y establecedores pueden ser</p>
+
+<ul>
+ <li>definido usando <a href="#Iniciadores_de_objeto">iniciadores de objeto</a>, o</li>
+ <li>agregado posteriormente a cualquier objeto en cualquier momento usando un método de adición para el captador o el establecedor.</li>
+</ul>
+
+<p>Al definir captadores y establecedores usando <a href="#Iniciadores_de_objeto">iniciadores de objeto</a>, todo lo que necesitas hacer es prefijar un método captador con <code>get</code> y un método establecedor con <code>set</code>. Por supuesto, el método captador no debe esperar un parámetro, mientras que el método establecedor espera exactamente un parámetro (el nuevo valor a establecer). Por ejemplo:</p>
+
+<pre class="brush: js notranslate">var o = {
+  a: 7,
+  get b() {
+    return this.a + 1;
+  },
+  set c(x) {
+    this.a = x / 2;
+  }
+};
+
+console.log (o.a); // 7
+console.log (o.b); // 8 &lt;-- En este punto se inicia el método get b().
+o.c = 50;         // &lt;-- En este punto se inicia el método set c(x)
+console.log(o.a); // 25
+</pre>
+
+<p>var o = {</p>
+
+<ul>
+ <li>a: 7,</li>
+ <li><code>o.b</code> — un captador que devuelve <code>o.a</code> más 1</li>
+ <li><code>o.c</code> — un establecedor que establece el valor de <code>o.a</code> en la mitad del valor que se establece en <code>o.c</code></li>
+</ul>
+
+<p>Ten en cuenta que los nombres de función de los captadores y establecedores definidos en un objeto literal usando "[gs]et <em>propiedad</em>()" (en contraposición a <code>__define [GS]etter__</code>) no son los nombres de los captadores en sí, aunque la sintaxis <code>[gs]et <em>propertyName</em>() {}</code> te puede inducir a pensar lo contrario.</p>
+
+<p>Los captadores y establecedores también se pueden agregar a un objeto en cualquier momento después de la creación usando el método <code>Object.defineProperties</code>. El primer parámetro de este método es el objeto sobre el que se quiere definir el captador o establecedor. El segundo parámetro es un objeto cuyo nombre de propiedad son los nombres <code>getter</code> o <code>setter</code>, y cuyos valores de propiedad son objetos para la definición de las funciones <code>getter</code> o <code>setter</code>. Aquí hay un ejemplo que define el mismo <code>getter</code> y <code>setter</code> utilizado en el ejemplo anterior:</p>
+
+<pre class="brush: js notranslate">var o = { a: 0 };
+
+Object.defineProperties(o, {
+    'b': { get: function() { return this.a + 1; } },
+    'c': { set: function(x) { this.a = x / 2; } }
+});
+
+o.c = 10; // Ejecuta el establecedor, que asigna 10/2 (5) a la propiedad 'a'
+console.log(o.b); // Ejecuta el captador, que produce un + 1 o 6
+</pre>
+
+<p>¿Cuál de las dos formas elegir? depende de tu estilo de programación y de la tarea que te ocupa. Si ya utilizas el iniciador de objeto al definir un prototipo probablemente escojas la primer forma la mayoría de las veces. Esta forma es más compacta y natural. Sin embargo, si más tarde necesitas agregar captadores y establecedores — porque no lo escribiste en el objeto prototipo o particular — entonces la segunda forma es la única forma posible. La segunda forma, probablemente representa mejor la naturaleza dinámica de JavaScript — pero puede hacer que el código sea difícil de leer y entender.&lt;/s6&gt;</p>
+
+<h2 id="Eliminar_propiedades">Eliminar propiedades</h2>
+
+<p>Puedes eliminar una propiedad no heredada mediante el operador <code>delete</code>. El siguiente código muestra cómo eliminar una propiedad.</p>
+
+<pre class="brush: js notranslate">//Crea un nuevo objeto, myobj, con dos propiedades, a y b.
+var myobj = new Object;
+myobj.a = 5;
+myobj.b = 12;
+
+// Elimina la propiedad a, dejando a myobj solo con la propiedad b.
+delete myobj.a;
+console.log ('a' in myobj); // muestra: "false"
+</pre>
+
+<p>También puedes utilizar <code>delete</code> para eliminar una variable global siempre y cuando no se haya utilizado la palabra clave <code>var</code> para declarar la variable:</p>
+
+<pre class="brush: js notranslate">g = 17;
+delete g;
+</pre>
+
+<h2 id="Comparar_objetos">Comparar objetos</h2>
+
+<p>Como sabemos los objetos son de tipo referencia en JavaScript. Dos distintos objetos nunca son iguales, incluso aunque tengan las mismas propiedades. Solo comparar la misma referencia de objeto consigo misma arroja verdadero.</p>
+
+<pre class="brush: js notranslate">// Dos variables, dos distintos objetos con las mismas propiedades
+var fruit = { name: 'apple' };
+var fruitbear = { name: 'apple' };
+
+fruit == fruitbear; // devuelve false
+fruit === fruitbear; // devuelve false</pre>
+
+<pre class="brush: js notranslate">// Dos variables, un solo objeto
+var fruit = { name: 'apple' };
+var fruitbear = fruit; // Asigna la referencia del objeto fruit a fruitbear
+
+// Aquí fruit y fruitbear apuntan al mismo objeto
+fruit == fruitbear; // devuelve true
+fruit === fruitbear; // devuelve true
+
+fruit.name = 'grape';
+console.log(fruitbear); // Produce: { name: "grape" }, en lugar de { name: "apple" }
+</pre>
+
+<p>Para obtener más información sobre los operadores de comparación, consulta <a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">Operadores de comparación</a>.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>Para profundizar más, lee sobre los <a href="/es/docs/Web/JavaScript/Guide/Details_of_the_Object_Model">detalles del modelo de objetos de JavaScript</a>.</li>
+ <li>Para obtener más información sobre las clases de ECMAScript 2015 (una forma alternativa de crear objetos), lee el capítulo <a href="/es/docs/Web/JavaScript/Reference/Classes">Clases de JavaScript</a>.</li>
+</ul>
+
+<p>{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Details_of_the_Object_Model")}}</p>
diff --git a/files/es/web/javascript/herencia_y_la_cadena_de_protipos/index.html b/files/es/web/javascript/herencia_y_la_cadena_de_protipos/index.html
deleted file mode 100644
index f237f7c5fa..0000000000
--- a/files/es/web/javascript/herencia_y_la_cadena_de_protipos/index.html
+++ /dev/null
@@ -1,410 +0,0 @@
----
-title: Herencia y la cadena de prototipos
-slug: Web/JavaScript/Herencia_y_la_cadena_de_protipos
-tags:
-  - Herencia
-  - Intermedio
-  - JavaScript
-  - Programación orientada a objetos
-translation_of: Web/JavaScript/Inheritance_and_the_prototype_chain
----
-<div>{{jsSidebar("Advanced")}}</div>
-
-<p>JavaScript provoca cierta confusión en desarrolladores con experiencia en lenguajes basados en clases (como Java o C++), por ser dinámico y no proporcionar una implementación de clases en sí mismo (la palabra clave <code>class</code> se introdujo en ES2015, pero sólo para endulzar la sintaxis, ya que JavaScript sigue estando basado en prototipos).</p>
-
-<p>En lo que a herencia se refiere, JavaScript sólo tiene una estructura: objetos. Cada objeto tiene una propiedad privada (referida como su [[Prototype]]) que mantiene un enlace a otro objeto llamado su <strong>prototipo</strong>. Ese objeto prototipo tiene su propio prototipo, y así sucesivamente hasta que se alcanza un objeto cuyo prototipo es <code>null</code>. Por definición, <code>null</code> no tiene prototipo, y actúa como el enlace final de esta <strong>cadena de prototipos</strong>.</p>
-
-<p>Casi todos los objetos en JavaScript son instancias de {{jsxref("Object")}} que se sitúa a la cabeza de la cadena de prototipos.</p>
-
-<p>A pesar de que a menudo esto se considera como una de las principales debilidades de JavaScript, el modelo de herencia de prototipos es de hecho más potente que el modelo clásico. Por ejemplo, es bastante simple construir un modelo clásico a partir de un modelo de prototipos.</p>
-
-<h2 id="Herencia_con_la_cadena_de_prototipos">Herencia con la cadena de prototipos</h2>
-
-<h3 id="Heredando_propiedades">Heredando propiedades</h3>
-
-<p>Los objetos en JavaScript son "contenedores" dinámicos de propiedades (referidas como sus <strong>propiedades particulares</strong>).  Los objetos en JavaScript poseen un enlace a un objeto prototipo. Cuando intentamos acceder a una propiedad de un objeto, la propiedad no sólo se busca en el propio objeto sino también en el prototipo del objeto, en el prototipo del prototipo, y así sucesivamente hasta que se encuentre una propiedad que coincida con el nombre o se alcance el final de la cadena de prototipos.</p>
-
-<div class="note">
-<p>Siguiendo el estándar ECMAScript, la notación <code>algunObjeto.[[Prototype]]</code> se usa para designar el prototipo de <code>algunObjeto.</code> A partir de ECMAScript 2015, se accede al <code>[[Prototype]]</code> utilizando los accesores  {{jsxref("Object.getPrototypeOf()")}} y {{jsxref("Object.setPrototypeOf()")}}. Esto es equivalente a la propiedad JavaScript <code>__proto__</code> que no es estándar pero es el de-facto implementado por los navegadores.</p>
-
-<p>No debe confundirse con la propiedad de las funciones <code><em>func.</em>prototype</code>, que en cambio especifican el <code>[[Prototype]]</code> a asignar a todas las instancias de los objetos creados por la función dada cuando se utiliza como un constructor. La propiedad <code><strong>Object.prototype</strong></code> representa el prototipo del objeto {{jsxref("Object")}}.</p>
-</div>
-
-<p>Esto es lo que ocurre cuando intentamos acceder a una propiedad:</p>
-
-<pre class="brush: js">// <code>Supongamos que tenemos un objeto</code> o, con propiedades a y b:
-// {a: 1, b: 2}
-// o.[[Prototype]] tiene propiedades b y c:
-// {b: 3, c: 4}
-// Finalmente, o.[[Prototype]].[[Prototype]] es null.
-// Este es el final de la cadena de prototipos, ya que null,
-// por definición, no tiene [[Prototype]].
-// Por tanto, la cadena completa de prototipos se vería como:
-// {a:1, b:2} ---&gt; {b:3, c:4} ---&gt; null
-
-console.log(o.a); // 1
-// ¿Hay una propiedad 'a' en o? Sí, y su valor es 1.
-
-console.log(o.b); // 2
-// ¿Hay una propiedad 'b' en o? Sí, y su valor es 2.
-// El prototipo también tiene una propiedad 'b', pero no se ha visitado.
-// Esto se llama "solapamiento de propiedades"
-
-console.log(o.c); // 4
-// ¿Hay una propiedad 'c' en o? No, comprobamos su prototipo.
-// ¿Hay una propiedad 'c' en o.[[Prototype]]? Sí, y su valor es 4.
-
-console.log(o.d); // undefined
-// ¿Hay una propiedad 'd' en o? No, comprobamos su prototipo.
-//  ¿Hay una propiedad 'd' en o.[[Prototype]]? No, comprobamos su prototipo.
-// o.[[Prototype]].[[Prototype]] es null, paramos de buscar.
-// No se encontró la propiedad, se devuelve undefined
-</pre>
-
-<p>Dar valor a una propiedad de un objeto crea una propiedad. La única excepción a las reglas de funcionamiento de obtener y dar valores ocurre cuando hay una propiedad heredada con un <a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters" title="Defining Getters and Setters">getter o un setter</a>.</p>
-
-<h3 id="Heredando_métodos">Heredando "métodos"</h3>
-
-<p>JavaScript no tiene "métodos" en la forma que los lenguajes basados en clases los define. En JavaScript, cualquier función puede añadirse a un objeto como una propiedad. Una función heredada se comporta como cualquier otra propiedad, viéndose afectada por el solapamiento de propiedades como se muestra anteriormente (siendo, en este caso, una especie de <em>redefinición de métodos</em>).</p>
-
-<p>Cuando una función heredada se ejecuta, el valor de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this" title="this"><code>this</code></a> apunta al objeto que hereda, no al prototipo en el que la función es una propiedad.</p>
-
-<pre class="brush: js">var o = {
-  a: 2,
-  m: function(b){
-    return this.a + 1;
-  }
-};
-
-console.log(o.m()); // 3
-// Cuando en este caso se llama a o.m, 'this' se refiere a o
-
-var p = Object.create(o);
-// p es un objeto que hereda de o
-
-p.a = 12; // crea una propiedad 'a' en p
-console.log(p.m()); // 13
-// cuando se llama a p.m, 'this' se refiere a p.
-// De esta manera, cuando p hereda la función m de o,
-// 'this.a' significa p.a, la propiedad 'a' de p
-</pre>
-
-<h2 id="Usando_prototipos_en_JavaScript">Usando prototipos en JavaScript</h2>
-
-<p>Veamos lo que sucede detrás de escena detalladamente.</p>
-
-<p>En JavaScript, como se mencionó anteriormente, las funciones pueden tener propiedades. Todas las funciones tienen una propiedad especial llamada <code>prototype</code>. Por favor ten en cuenta que el siguiente código es autónomo (es seguro asumir que no hay otro JavaScript en la página web mas que el siguiente). Para la mejor experiencia de aprendizaje, es altamente recomendable que abras una consola (la cual, en Chrome y Firefox, se puede abrir presionando Ctrl+Shift+I), navegando hasta la pestaña "console", copiando y pegando el siguiente código JavaScript, y ejecutándolo presionando la tecla Enter/Return.</p>
-
-<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
-console.log( hacerAlgo.prototype );
-// No importa cómo declares la función, una
-// función en JavaScript siempre tendrá una
-// propiedad prototype predeterminada.
-var hacerAlgo = function(){};
-console.log( hacerAlgo.prototype );</pre>
-
-<p>Como acabamos de ver, <code>hacerAlgo()</code> tiene una propiedad <code>prototype</code> predeterminada, como lo demuestra la consola. Después de ejecutar este código, la consola debería haber mostrado un parecido a esto.</p>
-
-<pre class="brush: js line-numbers  language-js">{
-    constructor: ƒ hacerAlgo(),
-    __proto__: {
-        constructor: ƒ Object(),
-        hasOwnProperty: ƒ hasOwnProperty(),
-        isPrototypeOf: ƒ isPrototypeOf(),
-        propertyIsEnumerable: ƒ propertyIsEnumerable(),
-        toLocaleString: ƒ toLocaleString(),
-        toString: ƒ toString(),
-        valueOf: ƒ valueOf()
-    }
-}</pre>
-
-<p>Podemos añadir propiedades al prototipo de <code>hacerAlgo()</code>, como se muestra a continuación.</p>
-
-<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
-hacerAlgo.prototype.foo = "bar";
-console.log( hacerAlgo.prototype );</pre>
-
-<p>El resultado:</p>
-
-<pre>{
-    foo: "bar",
-    constructor: ƒ hacerAlgo(),
-    __proto__: {
-        constructor: ƒ Object(),
-        hasOwnProperty: ƒ hasOwnProperty(),
-        isPrototypeOf: ƒ isPrototypeOf(),
-        propertyIsEnumerable: ƒ propertyIsEnumerable(),
-        toLocaleString: ƒ toLocaleString(),
-        toString: ƒ toString(),
-        valueOf: ƒ valueOf()
-    }
-}</pre>
-
-<p>Ahora podemos usar el operador <code>new</code> para crear una instancia de <code>hacerAlgo()</code> basado en este prototipo. Para usar el operador <code>new</code>, llama la función normalmente pero añadiendo el prefijo <code>new</code>. Llamar a la función con el operador <code>new</code> devuelve un objeto que es una instancia de la función. Entonces las propiedades pueden ser añadidas a este objeto.</p>
-
-<p>Intenta el siguiente código:</p>
-
-<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
-hacerAlgo.prototype.foo = "bar"; // añadir una propiedad al prototipo
-var hacerUnaInstancia = new hacerAlgo();
-hacerUnaInstancia.prop = "un valor"; // añadir una propiedad al objeto
-console.log( hacerUnaInstancia );</pre>
-
-<p>El resultado es similar a lo siguiente:</p>
-
-<pre class="brush: js line-numbers  language-js">{
-    prop: "un valor",
-    __proto__: {
-        foo: "bar",
-        constructor: ƒ hacerAlgo(),
-        __proto__: {
-            constructor: ƒ Object(),
-            hasOwnProperty: ƒ hasOwnProperty(),
-            isPrototypeOf: ƒ isPrototypeOf(),
-            propertyIsEnumerable: ƒ propertyIsEnumerable(),
-            toLocaleString: ƒ toLocaleString(),
-            toString: ƒ toString(),
-            valueOf: ƒ valueOf()
-        }
-    }
-}</pre>
-
-<p>Como acabamos de ver, el <code>__proto__</code> de <code>hacerUnaInstancia</code> es <code>hacerAlgo.prototype</code>. Pero, ¿qué hace esto? Cuando accedes a la propiedad de <code>hacerUnaInstancia</code>, el navegador primero revisa si <code>hacerUnaInstancia</code> tiene esa propiedad.</p>
-
-<p>Si <code>hacerUnaInstancia</code> no tiene la propiedad, entonces el navegador busca por la propiedad en el <code>__proto__</code> de <code>hacerUnaInstancia</code> (también conocido como <code>hacerAlgo.prototype</code>). Si el <code>__proto__</code> de <code>hacerUnaInstancia</code> tiene la propiedad buscada, entonces la propiedad en el <code>__proto__</code> de <code>hacerUnaInstancia</code> es usada.</p>
-
-<p>De otra manera, si el <code>__proto__</code> de <code>hacerUnaInstancia</code> no tiene la propiedad, entonces el <code>__proto__</code> de <code>__proto__</code> de <code>hacerUnaInstancia</code> es revisado para la propiedad. Por defecto, el <code>__proto__</code> de la propieda <code>prototype</code> de cualquier función es  <code>window.Object.prototype</code>. Entonces, el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code> (conocido como el <code>__proto__</code> de <code>hacerAlgo.prototype</code> (conocido como <code>Object.prototype</code>)) es entonces revisado por la propiedad que se está buscando.</p>
-
-<p>Si la propiedad no es encontrada en el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code>, entonces el <code>__proto__</code> de el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code> es revisado. Sin embargo, hay un problema: el <code>__proto__</code> de el <code>__proto__</code> de el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code> no existe. Entonces y sólo entonces, despues de que toda la cadena de prototipos de <code>__proto__</code>'s es revisada, y no haya mas <code>__proto__</code>s el navegador afirma que la propiedad no existe y concluye que el valor de la propiedad es <code>undefined</code>.</p>
-
-<p>Vamos a intentar introduciendo más código en la consola:</p>
-
-<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
-hacerAlgo.prototype.foo = "bar";
-var hacerUnaInstancia = new hacerAlgo();
-hacerUnaInstancia.prop = "un valor";
-console.log("hacerUnaInstancia.prop:      " + hacerUnaInstancia.prop);
-console.log("hacerUnaInstancia.foo:       " + hacerUnaInstancia.foo);
-console.log("hacerAlgo.prop:           " + hacerAlgo.prop);
-console.log("hacerAlgo.foo:            " + hacerAlgo.foo);
-console.log("hacerAlgo.prototype.prop: " + hacerAlgo.prototype.prop);
-console.log("hacerAlgo.prototype.foo:  " + hacerAlgo.prototype.foo);</pre>
-
-<p>El resultado es el siguiente:</p>
-
-<pre class="brush: js line-numbers  language-js">hacerUnaInstancia.prop:      un valor
-hacerUnaInstancia.foo:       bar
-hacerAlgo.prop:              undefined
-hacerAlgo.foo:               undefined
-hacerAlgo.prototype.prop:    undefined
-hacerAlgo.prototype.foo:     bar</pre>
-
-<h2 id="Maneras_diferentes_de_crear_objetos_y_la_cadena_de_prototipos_resultante">Maneras diferentes de crear objetos y la cadena de prototipos resultante</h2>
-
-<h3 id="Objetos_creados_mediante_estructuras_sintácticas">Objetos creados mediante estructuras sintácticas</h3>
-
-<pre class="brush: js">var o = {a: 1};
-
-// El objeto recién creado o tiene Object.prototype como su [[Prototype]]
-// o no tiene ninguna propiedad llamada 'hasOwnProperty'
-// hasOwnProperty es una propiedad propia de Object.prototype.
-// Entonces o hereda hasOwnProperty de Object.prototype
-// Object.prototype es null como su prototype.
-// o ---&gt; Object.prototype ---&gt; null
-
-var a = ["yo", "whadup", "?"];
-
-// Arrays hereda de Array.prototype
-// (que tiene métodos como indexOf, forEach, etc.)
-// La cadena de prototipados sería:
-// a ---&gt; Array.prototype ---&gt; Object.prototype ---&gt; null
-
-function f(){
-  return 2;
-}
-
-// Las funciones heredan de Function.prototype
-// (que tiene métodos como call, bind, etc.)
-// f ---&gt; Function.prototype ---&gt; Object.prototype ---&gt; null
-</pre>
-
-<h3 id="Con_un_constructor">Con un constructor</h3>
-
-<p>Un "constructor" en JavaScript es "solo" una función que pasa a ser llamada con el <a href="/en-US/docs/Web/JavaScript/Reference/Operators/new" title="new">operador new</a>.</p>
-
-<pre class="brush: js">function Graph() {
-  this.vertices = [];
-  this.edges = [];
-}
-
-Graph.prototype = {
-  addVertex: function(v){
-    this.vertices.push(v);
-  }
-};
-
-var g = new Graph();
-// g es un objeto con las propiedades 'vértices' y 'edges'.
-// g.[[Prototype]] es el valor de Graph.prototype cuando new Graph() es ejecutado.
-</pre>
-
-<h3 id="Con_Object.create">Con <code>Object.create</code></h3>
-
-<p>ECMAScript 5 Introdujo un nuevo método: {{jsxref("Object.create()")}}. Llamando este método creas un nuevo objeto. El prototype de este objeto es el primer argumento de la función:</p>
-
-<pre class="brush: js">var a = {a: 1};
-// a ---&gt; Object.prototype ---&gt; null
-
-var b = Object.create(a);
-// b ---&gt; a ---&gt; Object.prototype ---&gt; null
-console.log(b.a); // 1 (heredado)
-
-var c = Object.create(b);
-// c ---&gt; b ---&gt; a ---&gt; Object.prototype ---&gt; null
-
-var d = Object.create(null);
-// d ---&gt; null
-console.log(d.hasOwnProperty);
-// undefined, por que d no hereda de Object.prototype
-</pre>
-
-<div>
-<h3 id="Con_la_palabra_reservada_class">Con la palabra reservada <code>class</code></h3>
-
-<p>ECMAScript 2015 introduce un nuevo set de palabras reservadas que implementan <a href="/en-US/docs/Web/JavaScript/Reference/Classes">clases</a>. Aunque estos constructores lucen más familiares para los desarrolladores de lenguajes basados en clases, aun así no son clases. JavaScript sigue estando basado en prototipos. Los nuevos keywords incluyen {{jsxref("Statements/class", "class")}}, {{jsxref("Classes/constructor", "constructor")}}, {{jsxref("Classes/static", "static")}}, {{jsxref("Classes/extends", "extends")}}, and {{jsxref("Operators/super", "super")}}.</p>
-
-<pre class="brush: js">"use strict";
-
-class Polygon {
-  constructor(height, width) {
-    this.height = height;
-    this.width = width;
-  }
-}
-
-class Square extends Polygon {
-  constructor(sideLength) {
-    super(sideLength, sideLength);
-  }
-  get area() {
-    return this.height * this.width;
-  }
-  set sideLength(newLength) {
-    this.height = newLength;
-    this.width = newLength;
-  }
-}
-
-var square = new Square(2);
-</pre>
-
-<h3 id="Rendimiento">Rendimiento</h3>
-
-<p>El tiempo de búsqueda para las propiedades que están en lo alto de la cadena de prototipo puede tener un impacto negativo en el rendimiento, y esto puede ser significativo en el código donde el rendimiento es crítico. Además, tratar de acceder a las propiedades inexistentes siempre atravesara la cadena de prototipos completamente.</p>
-
-<p>También, cuando iteramos sobre las propiedades de un objeto, cada propiedad enumerable que se encuentra en la cadena de prototipo será enumerada.</p>
-
-<p>Para comprobar si un objeto tiene una propiedad definida en sí mismo y no en alguna parte de su cadena de prototipo, Es necesario usar para esto el método  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty" title="/ru/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"><code>hasOwnProperty</code></a> que todos los objetos heredan de<code> Object.prototype</code>.</p>
-
-<p><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty" title="/ru/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"><code>hasOwnProperty</code></a> es la única cosa en JavaScript que se ocupa de las propiedades y no atraviesa la cadena de prototipos.</p>
-
-<p>Nota: Esto <strong>no</strong> es suficiente para chequear si una propiedad esta <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined"><code>undefined</code></a>. la propiedad podría existir, pero el valor justamente sucede que esta seteado como <code>undefined</code>.</p>
-</div>
-
-<h3 id="Malas_practicas_Extensión_de_prototipos_nativos">Malas practicas: Extensión de prototipos nativos</h3>
-
-<p>Una mala característica que a menudo se usa, es extender <code>Object.prototype</code> o uno de los otros pre-incorporados prototypes.</p>
-
-<p>Esta técnica se llama <em>monkey patching</em> y rompe la <em>encapsulación</em>. Si bien, es utilizado por librerías como <em>Prototype.js</em>, no hay una buena razón para saturar los tipos pre-incorporados con funcionalidades adicionales <em>no estándar</em>.</p>
-
-<p>La <strong>única</strong> buena razón para extender los pre-incorporados prototipos es modificar las funcionalidades nuevas de los motores de JavaScript; por ejemplo:</p>
-
-<p><code>Array.forEach</code>, etc.</p>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<p><code>B</code> heredará de <code>A</code>:</p>
-
-<pre class="brush: js">function A(a){
-  this.varA = a;
-}
-
-// Cual es el propósito de incluir varA en el prototipo si A.prototype.varA <em>siempre</em> va a ser la sombra de
-// this.varA, dada la definición de la función A arriba?
-A.prototype = {
-  varA : null,  // No deberíamos atacar varA desde el prototipo como haciendo nada?
-      // Tal vez intentando una optimización al asignar espacios ocultos en las clases?
-      // https://developers.google.com/speed/articles/optimizing-javascript#Initializing instanciar variables
-      // podría ser válido si varA no fuera inicializado únicamente por cada instancia.
-  doSomething : function(){
-    // ...
-  }
-}
-
-function B(a, b){
-  A.call(this, a);
-  this.varB = b;
-}
-B.prototype = Object.create(A.prototype, {
-  varB : {
-    value: null,
-    enumerable: true,
-    configurable: true,
-    writable: true
-  },
-  doSomething : {
-    value: function(){ // override
-      A.prototype.doSomething.apply(this, arguments); // call super
-      // ...
-    },
-    enumerable: true,
-    configurable: true,
-    writable: true
-  }
-});
-B.prototype.constructor = B;
-
-var b = new B();
-b.doSomething();
-</pre>
-
-<p>Las partes importantes son:</p>
-
-<ul>
- <li>Los tipos son definidos en <code>.prototype</code></li>
- <li>Usar <code>Object.create()</code> para heredar</li>
-</ul>
-
-<h2 id="prototype_y_Object.getPrototypeOf"><code>prototype</code> y <code>Object.getPrototypeOf</code></h2>
-
-<p>JavaScript es un poco confuso para desarrolladores que vienen de lenguajes como Java o C++, ya que todo es dinámico, en todo momento de la ejecución, y no tiene clases en lo absoluto. Todo es solamente instancias (objetos). Incluso las "clases" que creamos, son solo funciones (objetos).</p>
-
-<p>Probablemente notaste que nuestra <code>función A</code> tiene una propiedad especial llamada <code>prototype</code>. Esta propiedad especial funciona con el operador de JavaScript <code>new</code>. La referencia al prototipo objeto es copiada al interno <code>[[Prototype]]</code> propiedad de la instancia <em>new</em>. Por ejemplo, cuando creas una variable <code>var a1 = new A()</code>, JavaScript (después de haber creado el objeto en memoria y antes de correr function <code>A()</code> con <code>this</code> definido a él) setea <code>a1.[[Prototype]] = A.prototype</code>. Cuando a continuación accedes a las propiedades de la instancia, JavaScript primero chequea si existen en el objeto directamente, y si no, mira en el <code>[[Prototype]]</code>. Esto significa que todo lo que definas en el <code>prototipo</code> es efectivamente compartido a todas las instancias, e incluso después puedes cambiar partes del <code>prototipo</code> y que todos los cambios se hagan en todas las instancias.</p>
-
-<p>Si, en el ejemplo de arriba, pones <code>var a1 = new A(); var a2 = new A();</code> entonces <code>a1.doSomething</code> se referiría a <code>Object.getPrototypeOf(a1).doSomething</code>, que seria lo mismo que <code>A.prototype.doSomething</code> que definiste, i.e. <code>Object.getPrototypeOf(a1).doSomething == Object.getPrototypeOf(a2).doSomething == A.prototype.doSomething</code>.</p>
-
-<p>resumiendo, <code>prototype</code> es para tipos, mientras que <code>Object.getPrototypeOf()</code> es lo mismo para instancias.</p>
-
-<p><code>[[Prototype]]</code> es visto como <em>recursivo</em>, i.e. <code>a1.doSomething</code>, <code>Object.getPrototypeOf(a1).doSomething</code>, <code>Object.getPrototypeOf(Object.getPrototypeOf(a1)).doSomething</code> etc., hasta que se encuentra o <code>Object.getPrototypeOf </code>retornará null.</p>
-
-<p>Entonces, cuando llamas</p>
-
-<pre class="brush: js">var o = new Foo();</pre>
-
-<p>JavaScript en realidad hace</p>
-
-<pre class="brush: js">var o = new Object();
-o.[[Prototype]] = Foo.prototype;
-Foo.call(o);</pre>
-
-<p>(o algo similar) y cuando después haces</p>
-
-<pre class="brush: js">o.someProp;</pre>
-
-<p>chequea si <code>o</code> tiene una propiedad <code>someProp</code>. Si no, busca en <code>Object.getPrototypeOf(o).someProp</code> y si ahí no existe, busca en <code>Object.getPrototypeOf(Object.getPrototypeOf(o)).someProp</code> y así sucesivamente.</p>
-
-<div>
-<h2 id="En_conclusión">En conclusión</h2>
-
-<p>Es <strong>esencial</strong> entender el modelo de prototipado por instancias antes de escribir código complejo que hace uso de esto. También, sé consciente del largo de la cadena de prototipado en tu código y romperlo si es necesario para evitar posibles problemas de rendimiento. Adicionalmente, el prototipo nativo <strong>nunca</strong> debería ser extendido a menos que esto sea por motivo de compatibilidad con nuevas versiones de JavaScript.</p>
-</div>
diff --git a/files/es/web/javascript/inheritance_and_the_prototype_chain/index.html b/files/es/web/javascript/inheritance_and_the_prototype_chain/index.html
new file mode 100644
index 0000000000..d6faec6ea7
--- /dev/null
+++ b/files/es/web/javascript/inheritance_and_the_prototype_chain/index.html
@@ -0,0 +1,411 @@
+---
+title: Herencia y la cadena de prototipos
+slug: Web/JavaScript/Inheritance_and_the_prototype_chain
+tags:
+  - Herencia
+  - Intermedio
+  - JavaScript
+  - Programación orientada a objetos
+translation_of: Web/JavaScript/Inheritance_and_the_prototype_chain
+original_slug: Web/JavaScript/Herencia_y_la_cadena_de_protipos
+---
+<div>{{jsSidebar("Advanced")}}</div>
+
+<p>JavaScript provoca cierta confusión en desarrolladores con experiencia en lenguajes basados en clases (como Java o C++), por ser dinámico y no proporcionar una implementación de clases en sí mismo (la palabra clave <code>class</code> se introdujo en ES2015, pero sólo para endulzar la sintaxis, ya que JavaScript sigue estando basado en prototipos).</p>
+
+<p>En lo que a herencia se refiere, JavaScript sólo tiene una estructura: objetos. Cada objeto tiene una propiedad privada (referida como su [[Prototype]]) que mantiene un enlace a otro objeto llamado su <strong>prototipo</strong>. Ese objeto prototipo tiene su propio prototipo, y así sucesivamente hasta que se alcanza un objeto cuyo prototipo es <code>null</code>. Por definición, <code>null</code> no tiene prototipo, y actúa como el enlace final de esta <strong>cadena de prototipos</strong>.</p>
+
+<p>Casi todos los objetos en JavaScript son instancias de {{jsxref("Object")}} que se sitúa a la cabeza de la cadena de prototipos.</p>
+
+<p>A pesar de que a menudo esto se considera como una de las principales debilidades de JavaScript, el modelo de herencia de prototipos es de hecho más potente que el modelo clásico. Por ejemplo, es bastante simple construir un modelo clásico a partir de un modelo de prototipos.</p>
+
+<h2 id="Herencia_con_la_cadena_de_prototipos">Herencia con la cadena de prototipos</h2>
+
+<h3 id="Heredando_propiedades">Heredando propiedades</h3>
+
+<p>Los objetos en JavaScript son "contenedores" dinámicos de propiedades (referidas como sus <strong>propiedades particulares</strong>).  Los objetos en JavaScript poseen un enlace a un objeto prototipo. Cuando intentamos acceder a una propiedad de un objeto, la propiedad no sólo se busca en el propio objeto sino también en el prototipo del objeto, en el prototipo del prototipo, y así sucesivamente hasta que se encuentre una propiedad que coincida con el nombre o se alcance el final de la cadena de prototipos.</p>
+
+<div class="note">
+<p>Siguiendo el estándar ECMAScript, la notación <code>algunObjeto.[[Prototype]]</code> se usa para designar el prototipo de <code>algunObjeto.</code> A partir de ECMAScript 2015, se accede al <code>[[Prototype]]</code> utilizando los accesores  {{jsxref("Object.getPrototypeOf()")}} y {{jsxref("Object.setPrototypeOf()")}}. Esto es equivalente a la propiedad JavaScript <code>__proto__</code> que no es estándar pero es el de-facto implementado por los navegadores.</p>
+
+<p>No debe confundirse con la propiedad de las funciones <code><em>func.</em>prototype</code>, que en cambio especifican el <code>[[Prototype]]</code> a asignar a todas las instancias de los objetos creados por la función dada cuando se utiliza como un constructor. La propiedad <code><strong>Object.prototype</strong></code> representa el prototipo del objeto {{jsxref("Object")}}.</p>
+</div>
+
+<p>Esto es lo que ocurre cuando intentamos acceder a una propiedad:</p>
+
+<pre class="brush: js">// <code>Supongamos que tenemos un objeto</code> o, con propiedades a y b:
+// {a: 1, b: 2}
+// o.[[Prototype]] tiene propiedades b y c:
+// {b: 3, c: 4}
+// Finalmente, o.[[Prototype]].[[Prototype]] es null.
+// Este es el final de la cadena de prototipos, ya que null,
+// por definición, no tiene [[Prototype]].
+// Por tanto, la cadena completa de prototipos se vería como:
+// {a:1, b:2} ---&gt; {b:3, c:4} ---&gt; null
+
+console.log(o.a); // 1
+// ¿Hay una propiedad 'a' en o? Sí, y su valor es 1.
+
+console.log(o.b); // 2
+// ¿Hay una propiedad 'b' en o? Sí, y su valor es 2.
+// El prototipo también tiene una propiedad 'b', pero no se ha visitado.
+// Esto se llama "solapamiento de propiedades"
+
+console.log(o.c); // 4
+// ¿Hay una propiedad 'c' en o? No, comprobamos su prototipo.
+// ¿Hay una propiedad 'c' en o.[[Prototype]]? Sí, y su valor es 4.
+
+console.log(o.d); // undefined
+// ¿Hay una propiedad 'd' en o? No, comprobamos su prototipo.
+//  ¿Hay una propiedad 'd' en o.[[Prototype]]? No, comprobamos su prototipo.
+// o.[[Prototype]].[[Prototype]] es null, paramos de buscar.
+// No se encontró la propiedad, se devuelve undefined
+</pre>
+
+<p>Dar valor a una propiedad de un objeto crea una propiedad. La única excepción a las reglas de funcionamiento de obtener y dar valores ocurre cuando hay una propiedad heredada con un <a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters" title="Defining Getters and Setters">getter o un setter</a>.</p>
+
+<h3 id="Heredando_métodos">Heredando "métodos"</h3>
+
+<p>JavaScript no tiene "métodos" en la forma que los lenguajes basados en clases los define. En JavaScript, cualquier función puede añadirse a un objeto como una propiedad. Una función heredada se comporta como cualquier otra propiedad, viéndose afectada por el solapamiento de propiedades como se muestra anteriormente (siendo, en este caso, una especie de <em>redefinición de métodos</em>).</p>
+
+<p>Cuando una función heredada se ejecuta, el valor de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this" title="this"><code>this</code></a> apunta al objeto que hereda, no al prototipo en el que la función es una propiedad.</p>
+
+<pre class="brush: js">var o = {
+  a: 2,
+  m: function(b){
+    return this.a + 1;
+  }
+};
+
+console.log(o.m()); // 3
+// Cuando en este caso se llama a o.m, 'this' se refiere a o
+
+var p = Object.create(o);
+// p es un objeto que hereda de o
+
+p.a = 12; // crea una propiedad 'a' en p
+console.log(p.m()); // 13
+// cuando se llama a p.m, 'this' se refiere a p.
+// De esta manera, cuando p hereda la función m de o,
+// 'this.a' significa p.a, la propiedad 'a' de p
+</pre>
+
+<h2 id="Usando_prototipos_en_JavaScript">Usando prototipos en JavaScript</h2>
+
+<p>Veamos lo que sucede detrás de escena detalladamente.</p>
+
+<p>En JavaScript, como se mencionó anteriormente, las funciones pueden tener propiedades. Todas las funciones tienen una propiedad especial llamada <code>prototype</code>. Por favor ten en cuenta que el siguiente código es autónomo (es seguro asumir que no hay otro JavaScript en la página web mas que el siguiente). Para la mejor experiencia de aprendizaje, es altamente recomendable que abras una consola (la cual, en Chrome y Firefox, se puede abrir presionando Ctrl+Shift+I), navegando hasta la pestaña "console", copiando y pegando el siguiente código JavaScript, y ejecutándolo presionando la tecla Enter/Return.</p>
+
+<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
+console.log( hacerAlgo.prototype );
+// No importa cómo declares la función, una
+// función en JavaScript siempre tendrá una
+// propiedad prototype predeterminada.
+var hacerAlgo = function(){};
+console.log( hacerAlgo.prototype );</pre>
+
+<p>Como acabamos de ver, <code>hacerAlgo()</code> tiene una propiedad <code>prototype</code> predeterminada, como lo demuestra la consola. Después de ejecutar este código, la consola debería haber mostrado un parecido a esto.</p>
+
+<pre class="brush: js line-numbers  language-js">{
+    constructor: ƒ hacerAlgo(),
+    __proto__: {
+        constructor: ƒ Object(),
+        hasOwnProperty: ƒ hasOwnProperty(),
+        isPrototypeOf: ƒ isPrototypeOf(),
+        propertyIsEnumerable: ƒ propertyIsEnumerable(),
+        toLocaleString: ƒ toLocaleString(),
+        toString: ƒ toString(),
+        valueOf: ƒ valueOf()
+    }
+}</pre>
+
+<p>Podemos añadir propiedades al prototipo de <code>hacerAlgo()</code>, como se muestra a continuación.</p>
+
+<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
+hacerAlgo.prototype.foo = "bar";
+console.log( hacerAlgo.prototype );</pre>
+
+<p>El resultado:</p>
+
+<pre>{
+    foo: "bar",
+    constructor: ƒ hacerAlgo(),
+    __proto__: {
+        constructor: ƒ Object(),
+        hasOwnProperty: ƒ hasOwnProperty(),
+        isPrototypeOf: ƒ isPrototypeOf(),
+        propertyIsEnumerable: ƒ propertyIsEnumerable(),
+        toLocaleString: ƒ toLocaleString(),
+        toString: ƒ toString(),
+        valueOf: ƒ valueOf()
+    }
+}</pre>
+
+<p>Ahora podemos usar el operador <code>new</code> para crear una instancia de <code>hacerAlgo()</code> basado en este prototipo. Para usar el operador <code>new</code>, llama la función normalmente pero añadiendo el prefijo <code>new</code>. Llamar a la función con el operador <code>new</code> devuelve un objeto que es una instancia de la función. Entonces las propiedades pueden ser añadidas a este objeto.</p>
+
+<p>Intenta el siguiente código:</p>
+
+<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
+hacerAlgo.prototype.foo = "bar"; // añadir una propiedad al prototipo
+var hacerUnaInstancia = new hacerAlgo();
+hacerUnaInstancia.prop = "un valor"; // añadir una propiedad al objeto
+console.log( hacerUnaInstancia );</pre>
+
+<p>El resultado es similar a lo siguiente:</p>
+
+<pre class="brush: js line-numbers  language-js">{
+    prop: "un valor",
+    __proto__: {
+        foo: "bar",
+        constructor: ƒ hacerAlgo(),
+        __proto__: {
+            constructor: ƒ Object(),
+            hasOwnProperty: ƒ hasOwnProperty(),
+            isPrototypeOf: ƒ isPrototypeOf(),
+            propertyIsEnumerable: ƒ propertyIsEnumerable(),
+            toLocaleString: ƒ toLocaleString(),
+            toString: ƒ toString(),
+            valueOf: ƒ valueOf()
+        }
+    }
+}</pre>
+
+<p>Como acabamos de ver, el <code>__proto__</code> de <code>hacerUnaInstancia</code> es <code>hacerAlgo.prototype</code>. Pero, ¿qué hace esto? Cuando accedes a la propiedad de <code>hacerUnaInstancia</code>, el navegador primero revisa si <code>hacerUnaInstancia</code> tiene esa propiedad.</p>
+
+<p>Si <code>hacerUnaInstancia</code> no tiene la propiedad, entonces el navegador busca por la propiedad en el <code>__proto__</code> de <code>hacerUnaInstancia</code> (también conocido como <code>hacerAlgo.prototype</code>). Si el <code>__proto__</code> de <code>hacerUnaInstancia</code> tiene la propiedad buscada, entonces la propiedad en el <code>__proto__</code> de <code>hacerUnaInstancia</code> es usada.</p>
+
+<p>De otra manera, si el <code>__proto__</code> de <code>hacerUnaInstancia</code> no tiene la propiedad, entonces el <code>__proto__</code> de <code>__proto__</code> de <code>hacerUnaInstancia</code> es revisado para la propiedad. Por defecto, el <code>__proto__</code> de la propieda <code>prototype</code> de cualquier función es  <code>window.Object.prototype</code>. Entonces, el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code> (conocido como el <code>__proto__</code> de <code>hacerAlgo.prototype</code> (conocido como <code>Object.prototype</code>)) es entonces revisado por la propiedad que se está buscando.</p>
+
+<p>Si la propiedad no es encontrada en el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code>, entonces el <code>__proto__</code> de el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code> es revisado. Sin embargo, hay un problema: el <code>__proto__</code> de el <code>__proto__</code> de el <code>__proto__</code> de el <code>__proto__</code> de <code>hacerUnaInstancia</code> no existe. Entonces y sólo entonces, despues de que toda la cadena de prototipos de <code>__proto__</code>'s es revisada, y no haya mas <code>__proto__</code>s el navegador afirma que la propiedad no existe y concluye que el valor de la propiedad es <code>undefined</code>.</p>
+
+<p>Vamos a intentar introduciendo más código en la consola:</p>
+
+<pre class="brush: js line-numbers  language-js">function hacerAlgo(){}
+hacerAlgo.prototype.foo = "bar";
+var hacerUnaInstancia = new hacerAlgo();
+hacerUnaInstancia.prop = "un valor";
+console.log("hacerUnaInstancia.prop:      " + hacerUnaInstancia.prop);
+console.log("hacerUnaInstancia.foo:       " + hacerUnaInstancia.foo);
+console.log("hacerAlgo.prop:           " + hacerAlgo.prop);
+console.log("hacerAlgo.foo:            " + hacerAlgo.foo);
+console.log("hacerAlgo.prototype.prop: " + hacerAlgo.prototype.prop);
+console.log("hacerAlgo.prototype.foo:  " + hacerAlgo.prototype.foo);</pre>
+
+<p>El resultado es el siguiente:</p>
+
+<pre class="brush: js line-numbers  language-js">hacerUnaInstancia.prop:      un valor
+hacerUnaInstancia.foo:       bar
+hacerAlgo.prop:              undefined
+hacerAlgo.foo:               undefined
+hacerAlgo.prototype.prop:    undefined
+hacerAlgo.prototype.foo:     bar</pre>
+
+<h2 id="Maneras_diferentes_de_crear_objetos_y_la_cadena_de_prototipos_resultante">Maneras diferentes de crear objetos y la cadena de prototipos resultante</h2>
+
+<h3 id="Objetos_creados_mediante_estructuras_sintácticas">Objetos creados mediante estructuras sintácticas</h3>
+
+<pre class="brush: js">var o = {a: 1};
+
+// El objeto recién creado o tiene Object.prototype como su [[Prototype]]
+// o no tiene ninguna propiedad llamada 'hasOwnProperty'
+// hasOwnProperty es una propiedad propia de Object.prototype.
+// Entonces o hereda hasOwnProperty de Object.prototype
+// Object.prototype es null como su prototype.
+// o ---&gt; Object.prototype ---&gt; null
+
+var a = ["yo", "whadup", "?"];
+
+// Arrays hereda de Array.prototype
+// (que tiene métodos como indexOf, forEach, etc.)
+// La cadena de prototipados sería:
+// a ---&gt; Array.prototype ---&gt; Object.prototype ---&gt; null
+
+function f(){
+  return 2;
+}
+
+// Las funciones heredan de Function.prototype
+// (que tiene métodos como call, bind, etc.)
+// f ---&gt; Function.prototype ---&gt; Object.prototype ---&gt; null
+</pre>
+
+<h3 id="Con_un_constructor">Con un constructor</h3>
+
+<p>Un "constructor" en JavaScript es "solo" una función que pasa a ser llamada con el <a href="/en-US/docs/Web/JavaScript/Reference/Operators/new" title="new">operador new</a>.</p>
+
+<pre class="brush: js">function Graph() {
+  this.vertices = [];
+  this.edges = [];
+}
+
+Graph.prototype = {
+  addVertex: function(v){
+    this.vertices.push(v);
+  }
+};
+
+var g = new Graph();
+// g es un objeto con las propiedades 'vértices' y 'edges'.
+// g.[[Prototype]] es el valor de Graph.prototype cuando new Graph() es ejecutado.
+</pre>
+
+<h3 id="Con_Object.create">Con <code>Object.create</code></h3>
+
+<p>ECMAScript 5 Introdujo un nuevo método: {{jsxref("Object.create()")}}. Llamando este método creas un nuevo objeto. El prototype de este objeto es el primer argumento de la función:</p>
+
+<pre class="brush: js">var a = {a: 1};
+// a ---&gt; Object.prototype ---&gt; null
+
+var b = Object.create(a);
+// b ---&gt; a ---&gt; Object.prototype ---&gt; null
+console.log(b.a); // 1 (heredado)
+
+var c = Object.create(b);
+// c ---&gt; b ---&gt; a ---&gt; Object.prototype ---&gt; null
+
+var d = Object.create(null);
+// d ---&gt; null
+console.log(d.hasOwnProperty);
+// undefined, por que d no hereda de Object.prototype
+</pre>
+
+<div>
+<h3 id="Con_la_palabra_reservada_class">Con la palabra reservada <code>class</code></h3>
+
+<p>ECMAScript 2015 introduce un nuevo set de palabras reservadas que implementan <a href="/en-US/docs/Web/JavaScript/Reference/Classes">clases</a>. Aunque estos constructores lucen más familiares para los desarrolladores de lenguajes basados en clases, aun así no son clases. JavaScript sigue estando basado en prototipos. Los nuevos keywords incluyen {{jsxref("Statements/class", "class")}}, {{jsxref("Classes/constructor", "constructor")}}, {{jsxref("Classes/static", "static")}}, {{jsxref("Classes/extends", "extends")}}, and {{jsxref("Operators/super", "super")}}.</p>
+
+<pre class="brush: js">"use strict";
+
+class Polygon {
+  constructor(height, width) {
+    this.height = height;
+    this.width = width;
+  }
+}
+
+class Square extends Polygon {
+  constructor(sideLength) {
+    super(sideLength, sideLength);
+  }
+  get area() {
+    return this.height * this.width;
+  }
+  set sideLength(newLength) {
+    this.height = newLength;
+    this.width = newLength;
+  }
+}
+
+var square = new Square(2);
+</pre>
+
+<h3 id="Rendimiento">Rendimiento</h3>
+
+<p>El tiempo de búsqueda para las propiedades que están en lo alto de la cadena de prototipo puede tener un impacto negativo en el rendimiento, y esto puede ser significativo en el código donde el rendimiento es crítico. Además, tratar de acceder a las propiedades inexistentes siempre atravesara la cadena de prototipos completamente.</p>
+
+<p>También, cuando iteramos sobre las propiedades de un objeto, cada propiedad enumerable que se encuentra en la cadena de prototipo será enumerada.</p>
+
+<p>Para comprobar si un objeto tiene una propiedad definida en sí mismo y no en alguna parte de su cadena de prototipo, Es necesario usar para esto el método  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty" title="/ru/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"><code>hasOwnProperty</code></a> que todos los objetos heredan de<code> Object.prototype</code>.</p>
+
+<p><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty" title="/ru/docs/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"><code>hasOwnProperty</code></a> es la única cosa en JavaScript que se ocupa de las propiedades y no atraviesa la cadena de prototipos.</p>
+
+<p>Nota: Esto <strong>no</strong> es suficiente para chequear si una propiedad esta <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined"><code>undefined</code></a>. la propiedad podría existir, pero el valor justamente sucede que esta seteado como <code>undefined</code>.</p>
+</div>
+
+<h3 id="Malas_practicas_Extensión_de_prototipos_nativos">Malas practicas: Extensión de prototipos nativos</h3>
+
+<p>Una mala característica que a menudo se usa, es extender <code>Object.prototype</code> o uno de los otros pre-incorporados prototypes.</p>
+
+<p>Esta técnica se llama <em>monkey patching</em> y rompe la <em>encapsulación</em>. Si bien, es utilizado por librerías como <em>Prototype.js</em>, no hay una buena razón para saturar los tipos pre-incorporados con funcionalidades adicionales <em>no estándar</em>.</p>
+
+<p>La <strong>única</strong> buena razón para extender los pre-incorporados prototipos es modificar las funcionalidades nuevas de los motores de JavaScript; por ejemplo:</p>
+
+<p><code>Array.forEach</code>, etc.</p>
+
+<h2 id="Example" name="Example">Ejemplo</h2>
+
+<p><code>B</code> heredará de <code>A</code>:</p>
+
+<pre class="brush: js">function A(a){
+  this.varA = a;
+}
+
+// Cual es el propósito de incluir varA en el prototipo si A.prototype.varA <em>siempre</em> va a ser la sombra de
+// this.varA, dada la definición de la función A arriba?
+A.prototype = {
+  varA : null,  // No deberíamos atacar varA desde el prototipo como haciendo nada?
+      // Tal vez intentando una optimización al asignar espacios ocultos en las clases?
+      // https://developers.google.com/speed/articles/optimizing-javascript#Initializing instanciar variables
+      // podría ser válido si varA no fuera inicializado únicamente por cada instancia.
+  doSomething : function(){
+    // ...
+  }
+}
+
+function B(a, b){
+  A.call(this, a);
+  this.varB = b;
+}
+B.prototype = Object.create(A.prototype, {
+  varB : {
+    value: null,
+    enumerable: true,
+    configurable: true,
+    writable: true
+  },
+  doSomething : {
+    value: function(){ // override
+      A.prototype.doSomething.apply(this, arguments); // call super
+      // ...
+    },
+    enumerable: true,
+    configurable: true,
+    writable: true
+  }
+});
+B.prototype.constructor = B;
+
+var b = new B();
+b.doSomething();
+</pre>
+
+<p>Las partes importantes son:</p>
+
+<ul>
+ <li>Los tipos son definidos en <code>.prototype</code></li>
+ <li>Usar <code>Object.create()</code> para heredar</li>
+</ul>
+
+<h2 id="prototype_y_Object.getPrototypeOf"><code>prototype</code> y <code>Object.getPrototypeOf</code></h2>
+
+<p>JavaScript es un poco confuso para desarrolladores que vienen de lenguajes como Java o C++, ya que todo es dinámico, en todo momento de la ejecución, y no tiene clases en lo absoluto. Todo es solamente instancias (objetos). Incluso las "clases" que creamos, son solo funciones (objetos).</p>
+
+<p>Probablemente notaste que nuestra <code>función A</code> tiene una propiedad especial llamada <code>prototype</code>. Esta propiedad especial funciona con el operador de JavaScript <code>new</code>. La referencia al prototipo objeto es copiada al interno <code>[[Prototype]]</code> propiedad de la instancia <em>new</em>. Por ejemplo, cuando creas una variable <code>var a1 = new A()</code>, JavaScript (después de haber creado el objeto en memoria y antes de correr function <code>A()</code> con <code>this</code> definido a él) setea <code>a1.[[Prototype]] = A.prototype</code>. Cuando a continuación accedes a las propiedades de la instancia, JavaScript primero chequea si existen en el objeto directamente, y si no, mira en el <code>[[Prototype]]</code>. Esto significa que todo lo que definas en el <code>prototipo</code> es efectivamente compartido a todas las instancias, e incluso después puedes cambiar partes del <code>prototipo</code> y que todos los cambios se hagan en todas las instancias.</p>
+
+<p>Si, en el ejemplo de arriba, pones <code>var a1 = new A(); var a2 = new A();</code> entonces <code>a1.doSomething</code> se referiría a <code>Object.getPrototypeOf(a1).doSomething</code>, que seria lo mismo que <code>A.prototype.doSomething</code> que definiste, i.e. <code>Object.getPrototypeOf(a1).doSomething == Object.getPrototypeOf(a2).doSomething == A.prototype.doSomething</code>.</p>
+
+<p>resumiendo, <code>prototype</code> es para tipos, mientras que <code>Object.getPrototypeOf()</code> es lo mismo para instancias.</p>
+
+<p><code>[[Prototype]]</code> es visto como <em>recursivo</em>, i.e. <code>a1.doSomething</code>, <code>Object.getPrototypeOf(a1).doSomething</code>, <code>Object.getPrototypeOf(Object.getPrototypeOf(a1)).doSomething</code> etc., hasta que se encuentra o <code>Object.getPrototypeOf </code>retornará null.</p>
+
+<p>Entonces, cuando llamas</p>
+
+<pre class="brush: js">var o = new Foo();</pre>
+
+<p>JavaScript en realidad hace</p>
+
+<pre class="brush: js">var o = new Object();
+o.[[Prototype]] = Foo.prototype;
+Foo.call(o);</pre>
+
+<p>(o algo similar) y cuando después haces</p>
+
+<pre class="brush: js">o.someProp;</pre>
+
+<p>chequea si <code>o</code> tiene una propiedad <code>someProp</code>. Si no, busca en <code>Object.getPrototypeOf(o).someProp</code> y si ahí no existe, busca en <code>Object.getPrototypeOf(Object.getPrototypeOf(o)).someProp</code> y así sucesivamente.</p>
+
+<div>
+<h2 id="En_conclusión">En conclusión</h2>
+
+<p>Es <strong>esencial</strong> entender el modelo de prototipado por instancias antes de escribir código complejo que hace uso de esto. También, sé consciente del largo de la cadena de prototipado en tu código y romperlo si es necesario para evitar posibles problemas de rendimiento. Adicionalmente, el prototipo nativo <strong>nunca</strong> debería ser extendido a menos que esto sea por motivo de compatibilidad con nuevas versiones de JavaScript.</p>
+</div>
diff --git a/files/es/web/javascript/introducción_a_javascript_orientado_a_objetos/index.html b/files/es/web/javascript/introducción_a_javascript_orientado_a_objetos/index.html
deleted file mode 100644
index 83c8f0a7c9..0000000000
--- a/files/es/web/javascript/introducción_a_javascript_orientado_a_objetos/index.html
+++ /dev/null
@@ -1,385 +0,0 @@
----
-title: Introducción a JavaScript orientado a objetos
-slug: Web/JavaScript/Introducción_a_JavaScript_orientado_a_objetos
-tags:
-  - Constructor
-  - Herencia
-  - JavaScript
-  - Objetos
-  - Orientado a objetos
-  - POO
-  - espacio de nombres
-translation_of: Learn/JavaScript/Objects
-translation_of_original: Web/JavaScript/Introduction_to_Object-Oriented_JavaScript
----
-<p>{{jsSidebar("Introductory")}}</p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-2"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>JavaScript</strong> dispone de fuertes capacidades de programación orientada a objetos, a pesar de que han tenido lugar algunos debates respecto a las diferencias de sus capacidades en comparación con otros lenguajes.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-3"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Este artículo comienza con una Introducción a la programación orientada a objetos, luego examina el modelo de objetos de JavaScript, y finalmente, muestra los conceptos de programación orientada a objetos en JavaScript.</span></span></p>
-
-<h2 id="JavaScript_Review" name="JavaScript_Review"><span class="goog-gtc-unit" id="goog-gtc-unit-4"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Revisión de JavaScript</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-5"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Si no te sientes seguro acerca de los conceptos de JavaScript tales como variables, tipos, funciones y el ámbito de aplicación, puedes leer sobre estos temas en: <a href="/en/JavaScript/A_re-introduction_to_JavaScript" title="en/JavaScript/A re-introduction to JavaScript">Una nueva introducción a JavaScript</a> .</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-6"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">También puedes consultar la <a href="/en/JavaScript/Guide" title="en/JavaScript/Guide">Guía de JavaScript 1.5</a>.</span></span></p>
-
-<h2 id="Object-oriented_programming" name="Object-oriented_programming"><span class="goog-gtc-unit" id="goog-gtc-unit-7"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Programación orientada a objetos</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-8"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La programación orientada a objetos es un paradigma de programación que utiliza la abstracción para crear modelos basados ​​en el mundo real.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-9"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Utiliza diversas técnicas de paradigmas previamente establecidas, incluyendo la <strong>modularidad</strong>, <strong>polimorfismo</strong> y <strong>encapsulamiento</strong>.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-10"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Hoy en día, muchos lenguajes de programación (como Java, JavaScript, C#, C++, Python, PHP, Ruby y Objective-C) soportan programación orientada a objetos (POO).</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-11"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La programación orientada a objetos puede considerarse como el diseño de software a través de un conjunto de objetos que cooperan, a diferencia de un punto de vista tradicional en el que un programa puede considerarse como un conjunto de funciones, o simplemente como una lista de instrucciones para la computadora.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-12"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En la programación orientada a objetos, cada objeto es capaz de recibir mensajes, procesar datos y enviar mensajes a otros objetos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-13"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cada objeto puede verse como una pequeña máquina independiente con un papel o responsabilidad definida.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-14"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">POO pretende promover una mayor flexibilidad y facilidad de mantenimiento en la programación y es muy popular en la ingeniería de software a gran escala.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-15"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Gracias a su fuerte énfasis en la modularidad, el código orientado a objetos está concebido para ser más fácil de desarrollar y más fácil de entender posteriormente, prestándose a un análisis más directo, a una mayor codificación y comprensión de situaciones y procedimientos complejos que otros métodos de programación menos modulares. <sup><a href="/#Referencia" title="#Referencia">2</a></sup></span></span></p>
-
-<h2 id="Terminology" name="Terminology"><span class="goog-gtc-unit" id="goog-gtc-unit-16"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Terminología</span></span></h2>
-
-<dl>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-17"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Clase</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-18"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Define las características del Objeto.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-19"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Objeto</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-20"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una instancia de una Clase.</span></span></dd>
- <dt><span style="line-height: 1.5;">Propiedad</span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-24"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una característica del Objeto, como el color.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-25"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Método</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-26"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Una capacidad del Objeto, como caminar.</span></span></dd>
-</dl>
-
-<dl>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-21"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Constructor</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-22"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Es un método llamado en el momento de la creación de instancias.</span></span></dd>
- <dt><span style="line-height: 1.5;">Herencia</span></dt>
- <dd><span class="goog-gtc-unit"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Una Clase puede heredar características de otra Clase.</span></span></dd>
-</dl>
-
-<dl>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-29"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Encapsulamiento</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-30"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Una Clase sólo define las características del Objeto, un Método sólo define cómo se ejecuta el Método.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-31"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Abstracción</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-32"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La conjunción de herencia compleja, métodos y propiedades que un objeto debe ser capaz de simular en un modelo de la realidad.</span></span></dd>
- <dt><span class="goog-gtc-unit" id="goog-gtc-unit-33"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Polimorfismo</span></span></dt>
- <dd><span class="goog-gtc-unit" id="goog-gtc-unit-34"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Diferentes Clases podrían definir el mismo método o propiedad.</span></span></dd>
-</dl>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-35"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para una descripción más extensa de programación orientada a objetos, consulta <a class="external" href="http://es.wikipedia.org/wiki/Programaci%C3%B3n_orientada_a_objetos" title="http://es.wikipedia.org/wiki/Programación_orientada_a_objetos">Programación orientada a objetos</a> en Wikipedia.</span></span></p>
-
-<h2 id="Programación_basada_​​en_prototipos"><span class="goog-gtc-unit" id="goog-gtc-unit-36"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Programación basada ​​en prototipos</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-37"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La programación basada ​​en prototipos es un estilo de programación orientada a objetos en la que las clases no están presentes y la reutilización de comportamiento (conocido como herencia en lenguajes basados ​​en clases) se lleva a cabo a través de un proceso de decoración de objetos existentes que sirven de prototipos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-38"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Este modelo también se conoce como programación sin clases, orientada a prototipos o basada en ejemplos.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-39"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El ejemplo original (y más canónico) de un lenguaje basado en prototipos es el lenguaje de programación <a href="https://en.wikipedia.org/wiki/Self_%28programming_language%29">Self</a> desarrollado por David Ungar y Randall Smith.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-40"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Sin embargo, el estilo de programación sin clases se ha hecho cada vez más popular y ha sido adoptado para lenguajes de programación como JavaScript, Cecil, NewtonScript, Io, MOO, REBOL, Kevo, Squeak (cuando se utiliza el Viewer framework para manipular los componentes Morphic) y varios otros. <sup><a href="/#Referencia" title="#Referencia">2</a></sup></span></span></p>
-
-<h2 id="JavaScript_Object_Oriented_Programming" name="JavaScript_Object_Oriented_Programming"><span class="goog-gtc-unit" id="goog-gtc-unit-41"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Programación orientada a objetos de JavaScript </span></span></h2>
-
-<h3 id="Core_Objects" name="Core_Objects"><span style="font-size: 1.714285714285714rem;">Namespace</span></h3>
-
-<p>Un <strong>espacio de nombres</strong> es un contenedor que permite asociar toda la funcionalidad de un determinado objeto con un nombre único. En JavaScript un espacio de nombres es un objeto que permite a métodos, propiedades y objetos asociarse. La idea de crear espacios de nombres en JavaScript es simple: Crear un único objeto global para las variables, métodos, funciones convirtiendolos en propiedades de ese objeto. El uso de los namespace permite minimizar el conflicto de nombres con otros objetos haciéndolos únicos dentro de nuestra aplicación.</p>
-
-<div>Un <strong>espacio de nombres</strong> es un objeto: </div>
-
-<div><br>
-<span style="line-height: 1.5;">Vamos a crear un objeto global llamado MIAPLICACION</span></div>
-
-<div> </div>
-
-<pre class="brush: js">// namespace global
-
-var MIAPLICACION = MIAPLICACION || {};</pre>
-
-<div> </div>
-
-<div class="note">
-<p><strong>Nota:</strong> Para continuar con las mejores prácticas vamos a utilizar mayúsculas para los namespace.</p>
-</div>
-
-<div>
-<div>En el código de ejemplo anterior comprobamos si MIAPLICACION ya se encuentra definida. Si es así utilizamos el objeto global MIAPLICACION que existe; si este no existe creamos un objeto vacío llamado MIAPLICACION que encapsulará métodos, funciones, variables y otros objetos que vayamos a crear.</div>
-
-<div> </div>
-
-<div>También podemos crear <strong>Sub-espacios de nombres</strong>:</div>
-
-<div> </div>
-
-<pre class="brush: js">// Sub-namespace
-
-MIAPLICACION.event = {} ;</pre>
-</div>
-
-<div>A continuación se muestra el código para la creación de un <strong>espacio de nombre</strong> y cómo agregar variables, funciones y métodos:</div>
-
-<div> </div>
-
-<pre class="brush: js">// Creación del contenedor llamado MIAPLICACION.metodoComun de método y propiedades comunes.
-MIAPLICACION.metodoComun = {
-  regExParaNombre: "", // define regex para la validación del nombre
-  regExParaTelefono: "", // define regex para validación del teléfono
-  validaNombre: function(nombre){
-    // Hace algo con el nombre que usted ingresa a la variable reExParaNombre
-    // usando "this.regExParaNombre"
-  },
-
-  validaNroTelefono: function (numTelefono){
-    // Hace algo con el número de teléfono
-  }
-}
-
-// Objeto junto a la declaración del método
-MIAPLICACION.event = {
-  addListener: function(el, type, fn){
-    // código de relleno
-  },
-  removeListener: function(el, type, fn){
-    // código de relleno
-  },
-  getEvent: function(e) {
-    // código de relleno
-  }
-
-  // Puedes agregar otras propiedades y métodos
-}
-
-// Sintaxis de utilización del método addListener:
-MIAPLICACION.event.addListener("turel", "tipo", callback);
-
-
-</pre>
-
-<div>
-<h3 id="Core_Objects" name="Core_Objects" style="line-height: 24px;"><span style="font-size: 1.714285714285714rem;">Objetos básicos</span></h3>
-</div>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-43"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">JavaScript tiene varios objetos incluidos en su núcleo, como Math, Object, Array y String.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-44"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El siguiente ejemplo muestra cómo utilizar el objeto Math para obtener un número al azar mediante el uso de su método <code>random()</code>.</span></span></p>
-
-<pre class="brush: js"><span class="goog-gtc-unit" id="goog-gtc-unit-45"><span class="brush: js" dir="ltr">alert (Math.random ());</span></span>
-</pre>
-
-<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-46"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr"><strong>Nota:</strong> este y todos los demás ejemplos suponen que una función llamada <code>alert</code> (como el que se incluye en los navegadores web) se define de forma global.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-47"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La función <code>alert</code> no es realmente parte de JavaScript.</span></span></div>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-48"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Consulta <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects" title="En/Core JavaScript 1.5 Reference/Global Objects">Core JavaScript 1.5 Reference:Global Objects</a> para obtener una lista de los objetos básicos en JavaScript.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-49"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cada objeto en JavaScript es una instancia del objeto <code>Object</code>, por lo tanto, hereda todas sus propiedades y métodos.</span></span></p>
-
-<h3 id="Custom_Objects" name="Custom_Objects"><span class="goog-gtc-unit" id="goog-gtc-unit-50"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Objetos personalizados</span></span></h3>
-
-<h4 id="The_Class" name="The_Class"><span class="goog-gtc-unit" id="goog-gtc-unit-51"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La clase</span></span></h4>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-52"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">JavaScript es un lenguaje basado en prototipos que no contiene ninguna declaración de clase, como se encuentra, por ejemplo, en C + + o Java.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-53"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto es a veces confuso para los programadores acostumbrados a los lenguajes con una declaración de clase.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-54"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">En su lugar, JavaScript utiliza funciones como clases.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-55"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Definir una clase es tan fácil como definir una función.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-56"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el ejemplo siguiente se define una nueva clase llamada <strong>Persona</strong>.</span></span></p>
-
-<pre class="brush: js"><span class="goog-gtc-unit" id="goog-gtc-unit-57"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">function Persona() { }</span></span>
-</pre>
-
-<h4 id="The_Object_.28Class_Instance.29" name="The_Object_.28Class_Instance.29"><span class="goog-gtc-unit" id="goog-gtc-unit-58"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El objeto (ejemplo de clase)</span></span></h4>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-59"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Para crear un nuevo ejemplo de un objeto <em><code>obj</code></em> utilizamos la declaración <code>new <em>obj</em></code> , asignando el resultado (que es de tipo <em><code>obj</code></em> ) a una variable para tener acceso más tarde.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-60"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo se define una clase llamada <code>Persona</code> y creamos dos instancias ( <code>persona1</code> y <code>persona2</code> ).</span></span></p>
-
-<pre class="brush: js">function Persona() {
-}
-
-var persona1 = new Persona();
-var persona2 = new Persona();</pre>
-
-<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-64"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Por favor, consulta también <a href="/en/JavaScript/Reference/Global_Objects/Object/create" title="en/JavaScript/Reference/Global Objects/Object/create">Object.create</a> para ver un método nuevo y alternativo de creación de ejemplos.</span></span></div>
-
-<h4 id="The_Constructor" name="The_Constructor"><span class="goog-gtc-unit" id="goog-gtc-unit-65"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El constructor</span></span></h4>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-66"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El constructor es llamado en el momento de la creación de la instancia (el momento en que se crea la instancia del objeto).</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-67"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">El constructor es un método de la clase.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-68"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">En JavaScript, la función sirve como el constructor del objeto, por lo tanto, no hay necesidad de definir explícitamente un método constructor.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-69"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Cada acción declarada en la clase es ejecutada en el momento de la creación de la instancia.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-70"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">El constructor se usa para establecer las propiedades del objeto o para llamar a los métodos para preparar el objeto para su uso. Más adelante describiremos como agregar </span></span><span class="goog-gtc-unit" id="goog-gtc-unit-71"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">métodos a clase y sus definiciones ya que se realiza utilizando una sintaxis diferente.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-72"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo, el constructor de la clase <code>Persona</code> muestra un alerta que dice (<strong>Una instancia de persona)</strong> cuando se crea la instancia de la clase <code>Persona</code>.</span></span></p>
-
-<pre class="brush: js">function Persona() {
-  alert('Una instancia de Persona');
-}
-
-var persona1 = new Persona();
-var persona2 = new Persona();</pre>
-
-<h4 id="The_Property_.28object_attribute.29" name="The_Property_.28object_attribute.29"><span class="goog-gtc-unit" id="goog-gtc-unit-78"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">La propiedad (atributo del objeto)</span></span></h4>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-79"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las propiedades son variables contenidas en la clase, cada instancia del objeto tiene dichas propiedades.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-80"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las propiedades deben establecerse a la propiedad prototipo de la clase (función), para que la herencia funcione correctamente.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-81"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Para trabajar con propiedades dentro de la clase se utiliza la palabra reservada <strong><code>this</code></strong> , que se refiere al objeto actual.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-82-goog-gtc-unit-83"><span class="goog-gtc-from-human goog-gtc-translatable">El acceso (lectura o escritura) a una propiedad desde fuera de la clase se hace con la sintaxis: <strong>NombreDeLaInstancia<code>.Propiedad</code></strong>. Es la misma sintaxis utilizada por C++, Java y algunos lenguajes más.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-84-goog-gtc-unit-85"><span class="goog-gtc-from-human goog-gtc-translatable">(Desde dentro de la clase la sintaxis es <strong><code>this.</code><code>Propiedad</code></strong> que se utiliza para obtener o establecer el valor de la propiedad).</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-86"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo definimos la propiedad <font face="Courier New, Andale Mono, monospace"><strong>primerNombre </strong></font>de la clase <code>Persona</code> y la definimos en la creación de la instancia.</span></span></p>
-
-<pre class="brush: js">function Persona(primerNombre) {
-  this.primerNombre = primerNombre;
-  alert('Una instancia de Persona');
-}
-
-var persona1 = new Persona("Alicia");
-var persona2 = new Persona("Sebastian");
-
-// Muestra el primer nombre de persona1
-alert ('persona1 es ' + persona1.primerNombre); // muestra "persona1 es Alicia"
-alert ('persona2 es ' + persona2.primerNombre); // muestra "persona2 es Sebastian"</pre>
-
-<h4 id="The_methods" name="The_methods"><span class="goog-gtc-unit" id="goog-gtc-unit-96"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Los métodos</span></span></h4>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-97"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Los métodos siguen la misma lógica que las propiedades, la diferencia es que son funciones y se definen como funciones.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-98"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Llamar a un método es similar a acceder a una propiedad, pero se agrega <code>()</code> al final del nombre del método, posiblemente con argumentos.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-99"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo se define y utiliza el método diHola<code>()</code> para la clase <code>Persona</code>.</span></span></p>
-
-<pre class="brush: js">function Persona(primerNombre) {
-  this.primerNombre = primerNombre;
-}
-
-Persona.prototype.diHola = function() {
-  alert ('Hola, Soy ' + this.primerNombre);
-};
-
-var persona1 = new Persona("Alicia");
-var persona2 = new Persona("Sebastian");
-
-// Llamadas al método diHola de la clase Persona.
-persona1.diHola(); // muestra "Hola, Soy Alicia"
-persona2.diHola(); // muestra "Hola, Soy Sebastian"</pre>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-113"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En JavaScript los métodos son objetos como lo es una función normal y se vinculan a un objeto como lo hace una propiedad, lo que significa que se pueden invocar desde "fuera de su contexto".</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-114"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Considera el siguiente código de ejemplo:</span></span></p>
-
-<pre class="brush: js">function Persona(primerNombre) {
-  this.primerNombre = primerNombre;
-}
-
-Persona.prototype.diHola = function() {
-  alert ("Hola, Soy " + this.primerNombre);
-};
-
-var persona1 = new Persona("Alicia");
-var persona2 = new Persona("Sebastian");
-var funcionSaludar = persona1.diHola;
-
-persona1.diHola();                            // muestra "Hola, Soy Alicia"
-persona2.diHola();                            // muestra "Hola, Soy Sebastian"
-funcionSaludar();                             // muestra "Hola, Soy undefined (ó da un error con el
-                                              // TypeError en modo estricto
-
-alert(funcionSaludar === persona1.diHola);            // muestra true (verdadero)
-alert(funcionSaludar === Persona.prototype.diHola);   // muestra true (verdadero)
-funcionSaludar.call(persona1);                        // muestra "Hola, Soy Alicia"</pre>
-
-<div>En el ejemplo se muestran todas las referencias que tenemos de la función <strong>diHola</strong> — una de ellas es <strong>persona1, </strong>otra en <strong>Persona.prototype</strong>, en la variable <strong>funcionSaludar</strong>, etc. — todas se refieren a la misma función. El valor durante una llamada a la función depende de como realizamos esa llamada. <span style="line-height: 1.5;">En el común de los casos cuando la llamamos desde una expresión donde tenemos a la función desde la propiedad del objeto — <strong>persona1.diHola()</strong>.</span><span style="line-height: 1.5;">— Se establece en el objeto que tenemos en la función (persona1), razón por la cual <strong>persona1.diHola()</strong> utiliza el nombre "Alicia" y <strong>persona2.diHola()</strong> utiliza el nombre "Sebastian". </span><span style="line-height: 1.5;">Pero si realizamos la llamada de otra manera, se establecerá de forma diferente: Llamándola desde una variable  —<strong>funcionSaludar()</strong> — Este </span><span style="line-height: 1.5;">establece </span><span style="line-height: 1.5;">al objeto global (windows, en los navegadores). </span><span style="line-height: 1.5;">Desde este objeto (probablemente) no tiene a la propiedad <strong>primerNombre</strong>, por lo que finalizará con "Hola, Soy indefinido". </span><span style="line-height: 1.5;">(El cual se incluye en modo </span>de código suelto, sino sería diferente [un error] en modo estricto, pero para evitar confusiones ahora no vamos a entra en detalles.) O podemos establecerla de forma explicita utilizando  Function.call (ó Function.apply), como se muestra al final del ejemplo <strong>funcionSaludar.call(persona1)</strong>.</div>
-
-<div> </div>
-
-<div class="note"><span class="goog-gtc-unit" id="goog-gtc-unit-133"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Consulta más información al respecto en <a href="/en/JavaScript/Reference/Global_Objects/Function/call" title="en/JavaScript/Reference/Global Objects/Function/call">Function.call</a> y <a href="/en/JavaScript/Reference/Global_Objects/Function/apply" title="en/JavaScript/Reference/Global Objects/Function/apply">Function.apply</a></span></span></div>
-
-<h4 id="Inheritance" name="Inheritance"><span class="goog-gtc-unit" id="goog-gtc-unit-134"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Herencia</span></span></h4>
-
-<div>La herencia es una manera de crear una clase como una versión especializada de una o más clases (JavaScript sólo permite herencia simple). La clase especializada comúnmente se llama hija o secundaria, y la otra clase se le llama padre o primaria. En JavaScript la herencia se logra mediante la asignación de una instancia de la clase primaria a  la clase secundaria, y luego se hace la especialización. </div>
-
-<div> </div>
-
-<div class="note">
-<p>JavaScript no detecta la clase hija prototype.constructor (vea las propiedades del <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/prototype">Core JavaScript 1.5 Reference:Global Objects:Object:prototype</a>) así que debemos decírselo de forma manual.</p>
-</div>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-140" style="line-height: 1.5;"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el siguiente ejemplo definimos la clase <strong><code>Estudiante</code></strong> como una clase secundaria de <strong><code>Persona</code></strong> .</span></span><span style="line-height: 1.5;"> </span><span class="goog-gtc-unit" id="goog-gtc-unit-141" style="line-height: 1.5;"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Luego redefinimos el método <strong>diHola<code>()</code></strong> y agregamos el método <strong>diAdios<code>()</code></strong>.</span></span></p>
-
-<pre class="brush: js">// Definimos el constructor Persona
-function Persona(primerNombre) {
-  this.primerNombre = primerNombre;
-}
-
-// Agregamos un par de métodos a Persona.prototype
-Persona.prototype.caminar = function() {
-  alert("Estoy caminando!");
-};
-Persona.prototype.diHola = function(){
-  alert("Hola, Soy" + this.primerNombre);
-};
-
-// Definimos el constructor Estudiante
-function Estudiante(primerNombre, asignatura) {
-  // Llamamos al constructor padre, nos aseguramos (utilizando Function#call) que "this" se
-  // ha establecido correctamente durante la llamada
-  Persona.call(this, primerNombre);
-
-  //Inicializamos las propiedades específicas de Estudiante
-  this.asignatura = asignatura;
-};
-
-// Creamos el objeto Estudiante.prototype que hereda desde Persona.prototype
-// Nota: Un error común es utilizar "new Persona()" para crear Estudiante.prototype
-// Esto es incorrecto por varias razones, y no menos importante que no le estamos pasando nada
-// a Persona desde el argumento "primerNombre". El lugar correcto para llamar a Persona
-// es arriba, donde llamamos a Estudiante.
-Estudiante.prototype = Object.create(Persona.prototype);    // Vea las siguientes notas
-
-// Establecer la propiedad "constructor" para referencias a Estudiante
-Estudiante.prototype.constructor = Estudiante;
-
-// Reemplazar el método "diHola"
-Estudiante.prototype.diHola = function(){
-  alert("Hola, Soy " + this.primerNombre + ". Estoy estudiando " + this.asignatura + ".");
-};
-
-// Agregamos el método "diAdios"
-Estudiante.prototype.diAdios = function() {
-  alert("¡ Adios !");
-};
-
-// Ejemplos de uso
-var estudiante1 = new Estudiante("Carolina", "Física Aplicada");
-estudiante1.diHola();    // muestra "Hola, Soy Carolina. Estoy estudianto Física Aplicada."
-estudiante1.caminar();   // muestra "Estoy caminando!"
-estudiante1.diAdios();   // muestra "¡ Adios !"
-
-// Comprobamos que las instancias funcionan correctamente
-alert(estudiante1 instanceof Persona);      // devuelve true
-alert(estudiante1 instanceof Estudiante);   // devuelve true
-</pre>
-
-<p>Con respecto a la línea <strong>Estudiante.prototype = Object.create(Persona.prototype); </strong>: Sobre los motores antiguos de JavaScript sin <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/create">Object.create</a>, se puede utilizar un "polyfill" (aka "shim", vea el enlace del artículo), o se puede utilizar una función que obtiene el mismo resultado, como por ejemplo:</p>
-
-<pre class="brush: js">function crearObjeto(proto) {
-  function ctor() { }
-  ctor.prototype = proto;
-  return new ctor();
-}
-
-// uso:
-Estudiante.prototype = crearObjeto(Persona.prototype); </pre>
-
-<div class="note">
-<p>Ver <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/create">Object.create</a> para conocer más sobre lo que hace, y complementar con los motores antiguos.</p>
-</div>
-
-<p><span style="font-family: open sans light,sans-serif; font-size: 1.285714285714286rem; letter-spacing: -0.25px; line-height: 18px;">Encapsulación</span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-172"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">En el ejemplo anterior, <code>Estudiante</code> no tiene que saber cómo se aplica el método <code>caminar()</code> de la clase <code>Persona</code>, pero, sin embargo, puede utilizar ese método. La clase <code>Estudiante</code> no tiene que definir explícitamente ese método, a menos que queramos cambiarlo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-173"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto se denomina <strong>la encapsulación</strong>, por medio de la cual cada clase hereda los métodos de su elemento primario y sólo tiene que definir las cosas que desea cambiar.</span></span></p>
-
-<h4 id="Abstraction" name="Abstraction"><span class="goog-gtc-unit" id="goog-gtc-unit-174"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Abstracción</span></span></h4>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-175"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Un mecanismo que permite modelar la parte actual del problema de trabajo.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-176"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto se puede lograr por herencia (especialización) o por composición.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-177"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">JavaScript logra la especialización por herencia y por composición al permitir que las instancias de clases sean los valores de los atributos de otros objetos.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-178"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">La clase Function de JavaScript hereda de la clase de Object (esto demuestra la especialización del modelo) y la propiedad Function.prototype es un ejemplo de Objeto (esto demuestra la composición)</span></span></p>
-
-<p> </p>
-
-<pre class="brush: js"><span class="goog-gtc-unit" id="goog-gtc-unit-179"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">v</span></span>ar foo = function() {};
-alert( 'foo es una Función: ' + (foo instanceof Function) );
-alert( 'foo.prototype es un Objeto: ' + (foo.prototype instanceof Object) );
-</pre>
-
-<p><span style="font-family: open sans light,sans-serif; font-size: 1.285714285714286rem; letter-spacing: -0.25px; line-height: 18px;">Polimorfismo</span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-183"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Al igual que todos los métodos y propiedades están definidas dentro de la propiedad prototipo, las diferentes clases pueden definir métodos con el mismo nombre. Los métodos están en el ámbito de la clase en que están definidos.</span></span> <span class="goog-gtc-unit" id="goog-gtc-unit-184"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Esto sólo es verdadero cuando las dos clases no tienen una relación primario-secundario (cuando uno no hereda del otro en una cadena de herencia).</span></span></p>
-
-<h2 id="Notes" name="Notes"><span class="goog-gtc-unit" id="goog-gtc-unit-185"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Notas</span></span></h2>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-186"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Las técnicas presentadas en este artículo para aplicar la programación orientada a objetos no son las únicas que se pueden utilizar en JavaScript, que es muy flexible en términos de cómo se puede realizar la programación orientada a objetos.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-187"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Del mismo modo, las técnicas presentadas aquí no utilizan ninguna modificación o hack de lenguaje ni imitan las implementaciones de teorías de objetos de otros lenguajes.</span></span></p>
-
-<p><span class="goog-gtc-unit" id="goog-gtc-unit-188"><span class="goog-gtc-from-human goog-gtc-translatable" dir="ltr">Hay otras técnicas que hacen incluso programación orientado a objetos más avanzada en JavaScript, pero que están fuera del alcance de este artículo introductorio.</span></span></p>
-
-<h2 id="References" name="References"><span class="goog-gtc-unit" id="goog-gtc-unit-189"><span class="goog-gtc-from-mt goog-gtc-translatable" dir="ltr">Referencias</span></span></h2>
-
-<ol>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-190-goog-gtc-unit-191-goog-gtc-unit-192"><span class="goog-gtc-from-human goog-gtc-translatable">Mozilla. "Core JavaScript 1.5 Guide", http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Guide.</span></span></li>
- <li><span class="goog-gtc-unit" id="goog-gtc-unit-193-goog-gtc-unit-194-goog-gtc-unit-195"><span class="goog-gtc-from-human goog-gtc-translatable">Wikipedia. "Programación orientada a objetos", <a class="external" href="http://es.wikipedia.org/wiki/Programaci%C3%B3n_orientada_a_objetos" rel="freelink">http://es.wikipedia.org/wiki/Program...tada_a_objetos</a>.</span></span></li>
- <li><a href="http://davidwalsh.name/javascript-objects">Descripción general de POO en JavaScript</a> por Kyle Simpson.</li>
-</ol>
diff --git a/files/es/web/javascript/introduction_to_using_xpath_in_javascript/index.html b/files/es/web/javascript/introduction_to_using_xpath_in_javascript/index.html
deleted file mode 100644
index 9b480576af..0000000000
--- a/files/es/web/javascript/introduction_to_using_xpath_in_javascript/index.html
+++ /dev/null
@@ -1,416 +0,0 @@
----
-title: Introducción al uso de XPath en Javascript
-slug: Web/JavaScript/Introduction_to_using_XPath_in_JavaScript
-translation_of: Web/XPath/Introduction_to_using_XPath_in_JavaScript
----
-<p>Este documento describe la interfaz para usar <a href="/en-US/docs/Web/XPath">XPath</a> internamente en JavaScript,  en extensiones y desde sitios web. Mozilla implementa una gran parte del <a class="external" href="http://www.w3.org/TR/DOM-Level-3-XPath/xpath.html">DOM 3 XPath</a>. Esto significa que las expresiones XPath pueden correrse en documentos HTML y XML.</p>
-
-<p>La interfaz principal a usar con XPath es la función <a href="/en/DOM/document.evaluate" title="en/DOM/document.evaluate">evaluate</a> del objeto <a href="/en/DOM/document" title="en/DOM/document">document</a>.</p>
-
-<h2 id="document.evaluate" name="document.evaluate">document.evaluate</h2>
-
-<p>Este método evalúa expresiones <a href="/en/XPath" title="en/XPath">XPath</a> contra un documento basado en <a href="/en/XML" title="en/XML">XML</a>  (incluyendo documentos HTML), y regresa un objeto <code><a href="/en/XPathResult" title="en/XPathResult">XPathResult</a></code>, el cual puede ser un solo nodo o un conjunto de nodos. La documentación existente para este método se encuentra en <a href="/en/DOM/document.evaluate" title="en/DOM/document.evaluate">document.evaluate</a>, pero de momento es más bien escasa para nuestras necesidades; una examinación más abarcativa será dada a continuación.</p>
-
-<pre class="brush: js">var xpathResult = document.evaluate( xpathExpression, contextNode, namespaceResolver, resultType, result );
-</pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<p>La función <a href="/en/DOM/document.evaluate" title="en/DOM/document.evaluate">evaluate</a> toma un total de 5 parámetros:</p>
-
-<ul>
- <li><code>xpathExpression</code>: Una cadena que contiene la expresión XPath a evaluar.</li>
- <li><code>contextNode</code>: Un nodo en el documento contra la  <code>xpathExpression</code> debe ser evaluada, incluyendo todos los nodos descendientes. El nodo <a href="/en/DOM/document" title="en/DOM/document">document</a> es el usado más comúnmente.</li>
- <li><code>namespaceResolver</code>: Una función que pasará cualquier prefijo de namespace contenido en una <code>xpathExpression</code> la cúal regresará una cadena representando al URI del namespace asociado con ese prefijo. Esto activa la conversión entre los prefijos usados en las expresiones XPath y los posiblemente distintos prefijos usados en el documento. La función puede ser:
-  <ul>
-   <li>Creada usando el metodo <code><a href="/en/DOM/document.createNSResolver" title="en/DOM/document.createNSResolver">createNSResolver</a></code> de un objeto <code><a href="/en/XPathEvaluator" title="en/XPathEvaluator">XPathEvaluator</a></code>. Deberías usar este virtualmente todo el tiempo.</li>
-   <li><code>null</code>, el cúal puede ser usado para documentos HTML o cuando no son usados prefijos de namespace. Note que, si la expresión XPath contiene un prefijo de namespace, esto resultará en una <code>DOMException</code> siendo arrojada con el código <code>NAMESPACE_ERR</code>.</li>
-   <li>Una función definida por el usuario. Mira la sección <a href="#Implementing_a_User_Defined_Namespace_Resolver">Usar un Solucionador de Namespace definido por el usuario</a> en el apéndice para detalles.</li>
-  </ul>
- </li>
- <li><code>resultType</code>: Una <a href="#XPathResult_Defined_Constants">constante</a> que especifica el tipo del resultado deseado a ser regresado. La constante más comúnmente pasada es <code>XPathResult.ANY_TYPE</code> la cúal regresará los resultados de la expresión XPath como el tipo más natural. Hay una sección en el apéndice que contiene una lista completa de las <a href="#XPathResult_Defined_Constants">constantes disponibles</a>. Estas son explicadas debajo, en la sección "<a href="#Specifying_the_Return_Type">Especificando el tipo de valor regresado</a>".</li>
- <li><code>result</code>: Si un objeto <code>XPathResult</code>  existente es especificado, sera reusado para regresar el resultado. Especificando <code>null</code>, un nuevo objeto <code>XPathResult</code> será creado.</li>
-</ul>
-
-<h3 id="Return_Value" name="Return_Value">Valor regresado</h3>
-
-<p>Regresa <code>xpathResult</code>, que es un objeto <code>XPathResult</code> del tipo especificado en el parámetro <code>resultType</code>. La interfaz <code>XPathResult</code> está definida en{{ Source("dom/interfaces/xpath/nsIDOMXPathResult.idl", "here") }}.</p>
-
-<h3 id="Implementing_a_Default_Namespace_Resolver" name="Implementing_a_Default_Namespace_Resolver">Implementando un Solucionador de Namespace predefinido</h3>
-
-<p>Nosotros creamos un solucionador de namespace usando el método <code>createNSResolver</code> del objeto <a href="/en/DOM/document" title="en/DOM/document">document</a>.</p>
-
-<pre class="brush: js">var nsResolver = document.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement );
-</pre>
-
-<p><span class="comment">O alternativamente, usar el método <code>createNSResolver</code> de un objeto<code> XPathEvaluator</code>. </span></p>
-
-<pre><span class="comment">var xpEvaluator = new XPathEvaluator();
-var nsResolver = xpEvaluator.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement ); </span></pre>
-
-<p>Y entonces pasar a <code>document.evaluate</code> la variable <code>nsResolver</code>, como el parámetro <code>namespaceResolver</code>.</p>
-
-<p>Nota: XPath define QNames sin un prefijo sólo al igualar elementos en el namespace null. No hay manera en XPath de tomar el namespace predefinido tal como se aplica a un elemento de referencia regular (e.g., <code>p[@id='_myid']</code> for <code><span class="nowiki">xmlns='http://www.w3.org/1999/xhtml</span>'</code>). Para igualar elementos predefinidos en un namespace no-nulo, , se tiene que hacer refencia a un elemento en particular usando una forma como <code>['namespace-uri()='<span class="nowiki">http://www.w3.org/1999/xhtml</span>' and name()='p' and @id='_myid']</code> (este enfoque funciona bien para expresiones XPath dinámicas donde el namespace puede ser dessconocido) o usar un nombre de prueba prefijado, y crear un solucionador de namespace mapeando el prefijo al namespace. Lee más sobre como crear un solucionador de namespace definido por el usuario, si deseas tomar el último enfoque.</p>
-
-<h3 id="Notes" name="Notes">Notas</h3>
-
-<p>Se adapta cualquier nodo DOM a resolver namespaces, así que una expresión XPath puede ser fácilmente evaluada relativa al contexto del nodo donde este aparece dentro del documento. Este adaptador funciona como el método de DOM Nivel 3 <code>lookupNamespaceURI</code> en nodos a resolver el <code>namespaceURI</code> desde un prefijo dado, usando la información actual disponible en la jerarquía del nodo en el momento en que lookupNamespaceURI es llamado. También resuelve correctamente el prefijo implícito de XML.</p>
-
-<h3 id="Specifying_the_Return_Type" name="Specifying_the_Return_Type">Especificando el tipo de valor regresado</h3>
-
-<p>La variable regresado <code>xpathResult</code> desde <code>document.evaluate</code> puede estar compuesto de nodos individuales (tipos simples), o una colección de nodos (tipo de conjunto de nodos)</p>
-
-<h4 id="Simple_Types" name="Simple_Types">Tipos simples</h4>
-
-<p>Cuando el tipo de resultado deseado especificado en <code>resultType</code> es uno de los siguientes :</p>
-
-<ul>
- <li><code>NUMBER_TYPE</code> - un doble</li>
- <li><code>STRING_TYPE</code> - una cadena</li>
- <li><code>BOOLEAN_TYPE</code> - un booleano</li>
-</ul>
-
-<p>Obtenemos el valor regresado por la expresión accediendo a las siguientes propiedades, respectivamente, del objeto <code>XPathResult</code>.</p>
-
-<ul>
- <li><code>numberValue</code></li>
- <li><code>stringValue</code></li>
- <li><code>booleanValue</code></li>
-</ul>
-
-<h5 id="Example" name="Example">Ejemplo</h5>
-
-<p>El siguiente código usa la expresión XPath <code><a href="/en/XPath/Functions/count" title="en/XPath/Functions/count">count(//p)</a></code> para obtener el número de elementos &lt;p&gt; en un  documento HTML:</p>
-
-<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">var</span> paragraphCount <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">evaluate<span class="punctuation token">(</span></span> 'count<span class="comment token">(//p)', document, null, XPathResult.ANY_TYPE, null );
-</span>
-<span class="function token">alert<span class="punctuation token">(</span></span> <span class="string token">'This document contains '</span> <span class="operator token">+</span> paragraphCount<span class="punctuation token">.</span>numberValue <span class="operator token">+</span> <span class="string token">' paragraph elements'</span> <span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Aunque JavaScript nos permite convertir el número a una cadena para desplegarlo, la interfaz <code>XPath</code> no convertirá el resultado numérico si la propiedad <code>stringValue</code> es solicitada, así que el siguiente código no funcionará:</p>
-
-<pre class="brush: js">var paragraphCount = document.evaluate('count(//p)', document, null, XPathResult.ANY_TYPE, null );
-
-alert( 'This document contains ' + paragraphCount.stringValue + ' paragraph elements' );
-</pre>
-
-<p>A su vez, regresará una excepción con el código <code>NS_DOM_TYPE_ERROR</code>.</p>
-
-<h4 id="Node-Set_Types" name="Node-Set_Types">Tipos de conjuntos de Nodos</h4>
-
-<p>El objeto <code>XPathResult</code> permite a los conjuntos de nodos ser regresados en 3 diferentes tipos principales:</p>
-
-<ul>
- <li><a href="#Iterators">Iteradores</a></li>
- <li><a href="#Snapshots">Capturas</a></li>
- <li><a href="#First_Node">Primeros nodos</a></li>
-</ul>
-
-<h5 id="Iterators" name="Iterators">Iteradores</h5>
-
-<p>Cuando el tipo de resultado especificado en el <code>resultType</code> es uno de los siguientes:</p>
-
-<ul>
- <li><code>UNORDERED_NODE_ITERATOR_TYPE</code></li>
- <li><code>ORDERED_NODE_ITERATOR_TYPE</code></li>
-</ul>
-
-<p>El objeto <code>XPathResult</code> regresado es un conjunto de nodos de los nodos coincidentes los cuales se comportarán como un iterador, perimitiendo el acceso individual a los nodos mediante el uso de método <span id="cke_bm_118S" style="display: none;"> </span><code>iterateNext()</code><span id="cke_bm_118E" style="display: none;"> </span> del <code>XPathResult</code><span id="cke_bm_119E" style="display: none;"> </span>.</p>
-
-<p>Una vez que hemos iterado sobre todos los nodos individuales coincidentes,<code> iterateNext()</code> regresará <code>null</code>.</p>
-
-<p>Es importante señalar que si el documento se ha transformado (el arbol del documento se ha modificado) entre iteraciones </p>
-
-<h6 id="Iterator_Example" name="Iterator_Example">Iterator Example</h6>
-
-<pre class="brush: js">var iterator = document.evaluate('//phoneNumber', documentNode, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null );
-
-try {
-  var thisNode = iterator.iterateNext();
-
-  while (thisNode) {
-    alert( thisNode.textContent );
-    thisNode = iterator.iterateNext();
-  }
-}
-catch (e) {
-  dump( 'Error: Document tree modified during iteration ' + e );
-}
-</pre>
-
-<h5 id="Snapshots" name="Snapshots">Snapshots</h5>
-
-<p>When the specified result type in the <code>resultType</code> parameter is either:</p>
-
-<ul>
- <li><code>UNORDERED_NODE_SNAPSHOT_TYPE</code></li>
- <li><code>ORDERED_NODE_SNAPSHOT_TYPE</code></li>
-</ul>
-
-<p>The <code>XPathResult</code> object returned is a static node-set of matched nodes, which allows us to access each node through the <code>snapshotItem(itemNumber)</code> method of the <code>XPathResult</code> object, where <code>itemNumber</code> is the index of the node to be retrieved. The total number of nodes contained can be accessed through the <code>snapshotLength</code> property.</p>
-
-<p>Snapshots do not change with document mutations, so unlike the iterators the snapshot does not become invalid, but it may not correspond to the current document, for example the nodes may have been moved, it might contain nodes that no longer exist, or new nodes could have been added.</p>
-
-<h6 id="Snapshot_Example" name="Snapshot_Example">Snapshot Example</h6>
-
-<pre class="brush: js">var nodesSnapshot = document.evaluate('//phoneNumber', documentNode, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );
-
-for ( var i=0 ; i &lt; nodesSnapshot.snapshotLength; i++ )
-{
-  dump( nodesSnapshot.snapshotItem(i).textContent );
-}
-</pre>
-
-<h5 id="First_Node" name="First_Node">First Node</h5>
-
-<p>When the specified result type in the <code>resultType</code> parameter is either:</p>
-
-<ul>
- <li><code>ANY_UNORDERED_NODE_TYPE</code></li>
- <li><code>FIRST_ORDERED_NODE_TYPE</code></li>
-</ul>
-
-<p>The <code>XPathResult</code> object returned is only the first found node that matched the XPath expression. This can be accessed through the <code>singleNodeValue</code> property of the <code>XPathResult</code> object. This will be <code>null</code> if the node set is empty.</p>
-
-<p>Note that, for the unordered subtype the single node returned might not be the first in document order, but for the ordered subtype you are guaranteed to get the first matched node in the document order.</p>
-
-<h6 id="First_Node_Example" name="First_Node_Example">First Node Example</h6>
-
-<pre class="brush: js">var firstPhoneNumber = document.evaluate('//phoneNumber', documentNode, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null );
-
-dump( 'The first phone number found is ' + firstPhoneNumber.singleNodeValue.textContent );
-</pre>
-
-<h4 id="The_ANY_TYPE_Constant" name="The_ANY_TYPE_Constant">The ANY_TYPE Constant</h4>
-
-<p>When the result type in the <code>resultType</code> parameter is specified as <code>ANY_TYPE</code>, the <code>XPathResult</code> object returned, will be whatever type that naturally results from the evaluation of the expression.</p>
-
-<p>It could be any of the simple types (<code>NUMBER_TYPE, STRING_TYPE, BOOLEAN_TYPE</code>), <strong>but</strong>, if the returned result type is a node-set then it will <strong>only</strong> be an <code>UNORDERED_NODE_ITERATOR_TYPE</code>.</p>
-
-<p>To determine that type after evaluation, we use the <code>resultType</code> property of the <code>XPathResult</code> object. The <a href="#XPathResult_Defined_Constants">constant</a> values of this property are defined in the appendix. <span class="comment">None Yet =====Any_Type Example===== &lt;pre&gt; &lt;/pre&gt;</span></p>
-
-<h2 id="Examples" name="Examples">Examples</h2>
-
-<h3 id="Within_an_HTML_Document" name="Within_an_HTML_Document">Within an HTML Document</h3>
-
-<p>The following code is intended to be placed in any JavaScript fragment within or linked to the HTML document against which the XPath expression is to be evaluated.</p>
-
-<p>To extract all the <code>&lt;h2&gt;</code> heading elements in an HTML document using XPath, the <code>xpathExpression</code> is simply '<code>//h2</code>'. Where, <code>//</code> is the Recursive Descent Operator that matches elements with the nodeName <code>h2</code> anywhere in the document tree. The full code for this is: <span class="comment">link to introductory xpath doc</span></p>
-
-<pre class="brush: js">var headings = document.evaluate('//h2', document, null, XPathResult.ANY_TYPE, null );
-</pre>
-
-<p>Notice that, since HTML does not have namespaces, we have passed <code>null</code> for the <code>namespaceResolver</code> parameter.</p>
-
-<p>Since we wish to search over the entire document for the headings, we have used the <a href="/en/DOM/document" title="en/DOM/document">document</a> object itself as the <code>contextNode</code>.</p>
-
-<p>The result of this expression is an <code>XPathResult</code> object. If we wish to know the type of result returned, we may evaluate the <code>resultType</code> property of the returned object. In this case, that will evaluate to <code>4</code>, an <code>UNORDERED_NODE_ITERATOR_TYPE</code>. This is the default return type when the result of the XPath expression is a node set. It provides access to a single node at a time and may not return nodes in a particular order. To access the returned nodes, we use the <code>iterateNext()</code> method of the returned object:</p>
-
-<pre class="brush: js">var thisHeading = headings.iterateNext();
-
-var alertText = 'Level 2 headings in this document are:\n'
-
-while (thisHeading) {
-  alertText += thisHeading.textContent + '\n';
-  thisHeading = headings.iterateNext();
-}
-</pre>
-
-<p>Once we iterate to a node, we have access to all the standard DOM interfaces on that node. After iterating through all the <code>h2</code> elements returned from our expression, any further calls to <code>iterateNext()</code> will return <code>null</code>.</p>
-
-<h3 id="Evaluating_against_an_XML_document_within_an_Extension" name="Evaluating_against_an_XML_document_within_an_Extension">Evaluating against an XML document within an Extension</h3>
-
-<p>The following uses an XML document located at <span class="nowiki">chrome://yourextension/content/peopleDB.xml</span> as an example.</p>
-
-<pre class="brush: xml">&lt;?xml version="1.0"?&gt;
-&lt;people xmlns:xul = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" &gt;
-  &lt;person&gt;
-	&lt;name first="george" last="bush" /&gt;
-	&lt;address street="1600 pennsylvania avenue" city="washington" country="usa"/&gt;
-	&lt;phoneNumber&gt;202-456-1111&lt;/phoneNumber&gt;
-  &lt;/person&gt;
-  &lt;person&gt;
-	&lt;name first="tony" last="blair" /&gt;
-	&lt;address street="10 downing street" city="london" country="uk"/&gt;
-	&lt;phoneNumber&gt;020 7925 0918&lt;/phoneNumber&gt;
-  &lt;/person&gt;
-&lt;/people&gt;
-</pre>
-
-<p>To make the contents of the XML document available within the extension, we create an <code><a href="/en/XMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a></code> object to load the document synchronously, the variable <code>xmlDoc</code> will contain the document as an <code><a href="/en/XMLDocument" title="en/XMLDocument">XMLDocument</a></code> object against which we can use the <code>evaluate</code> method</p>
-
-<p>JavaScript used in the extensions xul/js documents.</p>
-
-<pre class="brush: js">var req = new XMLHttpRequest();
-
-req.open("GET", "chrome://yourextension/content/peopleDB.xml", false);
-req.send(null);
-
-var xmlDoc = req.responseXML;
-
-var nsResolver = xmlDoc.createNSResolver( xmlDoc.ownerDocument == null ? xmlDoc.documentElement : xmlDoc.ownerDocument.documentElement);
-
-var personIterator = xmlDoc.evaluate('//person', xmlDoc, nsResolver, XPathResult.ANY_TYPE, null );
-</pre>
-
-<h3 id="Note">Note</h3>
-
-<p>When the XPathResult object is not defined, the constants can be retreived in privileged code using <code>Components.interfaces.nsIDOMXPathResult.ANY_TYPE</code> (<code>CI.nsIDOMXPathResult</code>). Similarly, an XPathEvaluator can be created using:</p>
-
-<pre class="brush: js">Components.classes["@mozilla.org/dom/xpath-evaluator;1"].createInstance(Components.interfaces.nsIDOMXPathEvaluator)</pre>
-
-<h2 id="Appendix" name="Appendix">Appendix</h2>
-
-<h4 id="Implementing_a_User_Defined_Namespace_Resolver" name="Implementing_a_User_Defined_Namespace_Resolver">Implementing a User Defined Namespace Resolver</h4>
-
-<p>This is an example for illustration only. This function will need to take namespace prefixes from the <code>xpathExpression</code> and return the URI that corresponds to that prefix. For example, the expression:</p>
-
-<pre>'//xhtml:td/mathml:math'
-</pre>
-
-<p>will select all <a href="/en/MathML" title="en/MathML">MathML</a> expressions that are the children of (X)HTML table data cell elements.</p>
-
-<p>In order to associate the '<code>mathml:</code>' prefix with the namespace URI '<code><span class="nowiki">http://www.w3.org/1998/Math/MathML</span></code>' and '<code>xhtml:</code>' with the URI '<code><span class="nowiki">http://www.w3.org/1999/xhtml</span></code>' we provide a function:</p>
-
-<pre class="brush: js">function nsResolver(prefix) {
-  var ns = {
-    'xhtml' : 'http://www.w3.org/1999/xhtml',
-    'mathml': 'http://www.w3.org/1998/Math/MathML'
-  };
-  return ns[prefix] || null;
-}
-</pre>
-
-<p>Our call to <code>document.evaluate</code> would then looks like:</p>
-
-<pre class="brush: js">document.evaluate( '//xhtml:td/mathml:math', document, nsResolver, XPathResult.ANY_TYPE, null );
-</pre>
-
-<h4 id="Implementing_a_default_namespace_for_XML_documents" name="Implementing_a_default_namespace_for_XML_documents">Implementing a default namespace for XML documents</h4>
-
-<p>As noted in the <a href="#Implementing_a_Default_Namespace_Resolver">Implementing a Default Namespace Resolver</a> previously, the default resolver does not handle the default namespace for XML documents. For example with this document:</p>
-
-<pre class="brush: xml">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
-&lt;feed xmlns="http://www.w3.org/2005/Atom"&gt;
-    &lt;entry /&gt;
-    &lt;entry /&gt;
-    &lt;entry /&gt;
-&lt;/feed&gt;
-</pre>
-
-<p><code>doc.evaluate('//entry', doc, nsResolver, XPathResult.ANY_TYPE, null)</code> will return an empty set, where <code>nsResolver</code> is the resolver returned by <code>createNSResolver</code>. Passing a <code>null</code> resolver doesn't work any better, either.</p>
-
-<p>One possible workaround is to create a custom resolver that returns the correct default namespace (the Atom namespace in this case). Note that you still have to use some namespace prefix in your XPath expression, so that the resolver function will be able to change it to your required namespace. E.g.:</p>
-
-<pre class="brush: js">function resolver() {
-    return 'http://www.w3.org/2005/Atom';
-}
-doc.evaluate('//myns:entry', doc, resolver, XPathResult.ANY_TYPE, null)
-</pre>
-
-<p>Note that a more complex resolver will be required if the document uses multiple namespaces.</p>
-
-<p>An approach which might work better (and allow namespaces not to be known ahead of time) is described in the next section.</p>
-
-<h4 id="Using_XPath_functions_to_reference_elements_with_a_default_namespace" name="Using_XPath_functions_to_reference_elements_with_a_default_namespace">Using XPath functions to reference elements with a default namespace</h4>
-
-<p>Another approach to match default elements in a non-null namespace (and one which works well for dynamic XPath expressions where the namespaces might not be known), involves referring to a particular element using a form such as <code>[namespace-uri()='<span class="nowiki">http://www.w3.org/1999/xhtml</span>' and name()='p' and @id='_myid']</code>. This circumvents the problem of an XPath query not being able to detect the default namespace on a regularly labeled element.</p>
-
-<h4 id="Getting_specifically_namespaced_elements_and_attributes_regardless_of_prefix" name="Getting_specifically_namespaced_elements_and_attributes_regardless_of_prefix">Getting specifically namespaced elements and attributes regardless of prefix</h4>
-
-<p>If one wishes to provide flexibility in namespaces (as they are intended) by not necessarily requiring a particular prefix to be used when finding a namespaced element or attribute, one must use special techniques.</p>
-
-<p>While one can adapt the approach in the above section to test for namespaced elements regardless of the prefix chosen (using <code><a href="/en/XPath/Functions/local-name" title="en/XPath/Functions/local-name">local-name()</a></code> in combination with <code><a href="/en/XPath/Functions/namespace-uri" title="en/XPath/Functions/namespace-uri">namespace-uri()</a></code> instead of <code><a href="/en/XPath/Functions/name" title="en/XPath/Functions/name">name()</a></code>), a more challenging situation occurs, however, if one wishes to grab an element with a particular namespaced attribute in a predicate (given the absence of implementation-independent variables in XPath 1.0).</p>
-
-<p>For example, one might try (incorrectly) to grab an element with a namespaced attribute as follows: <code>var xpathlink = someElements[local-name(@*)="href" and namespace-uri(@*)='<span class="nowiki">http://www.w3.org/1999/xlink</span>'];</code></p>
-
-<p>This could inadvertently grab some elements if one of its attributes existed that had a local name of "<code>href</code>", but it was a different attribute which had the targeted (XLink) namespace (instead of <code><a href="/en/XPath/Axes/attribute" title="en/XPath/Axes/attribute">@href</a></code>).</p>
-
-<p>In order to accurately grab elements with the XLink <code>@href</code> attribute (without also being confined to predefined prefixes in a namespace resolver), one could obtain them as follows:</p>
-
-<pre class="brush: js">var xpathEls = 'someElements[@*[local-name() = "href" and namespace-uri() = "http://www.w3.org/1999/xlink"]]'; // Grabs elements with any single attribute that has both the local name 'href' and the XLink namespace
-var thislevel = xml.evaluate(xpathEls, xml, null, XPathResult.ANY_TYPE, null);
-var thisitemEl = thislevel.iterateNext();
-</pre>
-
-<h4 id="XPathResult_Defined_Constants" name="XPathResult_Defined_Constants">XPathResult Defined Constants</h4>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <td class="header">Result Type Defined Constant</td>
-   <td class="header">Value</td>
-   <td class="header">Description</td>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>ANY_TYPE</td>
-   <td>0</td>
-   <td>A result set containing whatever type naturally results from evaluation of the expression. Note that if the result is a node-set then UNORDERED_NODE_ITERATOR_TYPE is always the resulting type.</td>
-  </tr>
-  <tr>
-   <td>NUMBER_TYPE</td>
-   <td>1</td>
-   <td>A result containing a single number. This is useful for example, in an XPath expression using the <code>count()</code> function.</td>
-  </tr>
-  <tr>
-   <td>STRING_TYPE</td>
-   <td>2</td>
-   <td>A result containing a single string.</td>
-  </tr>
-  <tr>
-   <td>BOOLEAN_TYPE</td>
-   <td>3</td>
-   <td>A result containing a single boolean value. This is useful for example, in an XPath expression using the <code>not()</code> function.</td>
-  </tr>
-  <tr>
-   <td>UNORDERED_NODE_ITERATOR_TYPE</td>
-   <td>4</td>
-   <td>A result node-set containing all the nodes matching the expression. The nodes may not necessarily be in the same order that they appear in the document.</td>
-  </tr>
-  <tr>
-   <td>ORDERED_NODE_ITERATOR_TYPE</td>
-   <td>5</td>
-   <td>A result node-set containing all the nodes matching the expression. The nodes in the result set are in the same order that they appear in the document.</td>
-  </tr>
-  <tr>
-   <td>UNORDERED_NODE_SNAPSHOT_TYPE</td>
-   <td>6</td>
-   <td>A result node-set containing snapshots of all the nodes matching the expression. The nodes may not necessarily be in the same order that they appear in the document.</td>
-  </tr>
-  <tr>
-   <td>ORDERED_NODE_SNAPSHOT_TYPE</td>
-   <td>7</td>
-   <td>A result node-set containing snapshots of all the nodes matching the expression. The nodes in the result set are in the same order that they appear in the document.</td>
-  </tr>
-  <tr>
-   <td>ANY_UNORDERED_NODE_TYPE</td>
-   <td>8</td>
-   <td>A result node-set containing any single node that matches the expression. The node is not necessarily the first node in the document that matches the expression.</td>
-  </tr>
-  <tr>
-   <td>FIRST_ORDERED_NODE_TYPE</td>
-   <td>9</td>
-   <td>A result node-set containing the first node in the document that matches the expression.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="See_also" name="See_also">See also</h2>
-
-<ul>
- <li><a href="/en/Using_XPath" title="en/Using_XPath">Using XPath</a></li>
-</ul>
-
-<div class="originaldocinfo">
-<h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2>
-
-<ul>
- <li>Based Upon Original Document <a class="external" href="http://www-xray.ast.cam.ac.uk/~jgraham/mozilla/xpath-tutorial.html">Mozilla XPath Tutorial</a></li>
- <li>Original Source Author: James Graham.</li>
- <li>Other Contributors: James Thompson.</li>
- <li>Last Updated Date: 2006-3-25.</li>
-</ul>
-</div>
-
-<p> </p>
diff --git a/files/es/web/javascript/javascript_technologies_overview/index.html b/files/es/web/javascript/javascript_technologies_overview/index.html
new file mode 100644
index 0000000000..6c0972129d
--- /dev/null
+++ b/files/es/web/javascript/javascript_technologies_overview/index.html
@@ -0,0 +1,88 @@
+---
+title: Descripción de las tecnologías JavaScript
+slug: Web/JavaScript/JavaScript_technologies_overview
+translation_of: Web/JavaScript/JavaScript_technologies_overview
+original_slug: Web/JavaScript/Descripción_de_las_tecnologías_JavaScript
+---
+<div>{{JsSidebar("Introductory")}}</div>
+
+<h2 id="Introducción">Introducción</h2>
+
+<p>Mientras que HTML define la estructura y el contenido de una página web y el CSS define el formato y la apariencia, JavaScript agrega interactividad a una página web y crea aplicaciones web enriquecidas.</p>
+
+<p>Sin embargo, el término paraguas "JavaScript", tal como se entiende en un contexto de navegador web, contiene varios elementos muy diferentes. Uno de ellos es el lenguaje principal (ECMAScript), otro es la colección de las APIs Web, incluyendo el DOM (Document Object Model).</p>
+
+<h2 id="JavaScript_el_núcleo_del_lenguaje_ECMAScript">JavaScript, el núcleo del lenguaje (ECMAScript)</h2>
+
+<p>EL núcleo del lenguaje JavaScript está estandarizado por el Comité ECMA TC39 como un lenguaje llamado <a href="/en-US/docs/JavaScript/Language_Resources">ECMAScript</a>. La última versión de la especificación es <a href="http://www.ecma-international.org/ecma-262/6.0/">ECMAScript 6.0</a>.</p>
+
+<p>Éste núcleo del lenguaje es también usado en ambientes No-Navegadores, por ejemplo en <a href="http://nodejs.org/">node.js</a>.</p>
+
+<h3 id="Qué_considera_ECMAScript_scope">Qué considera ECMAScript scope?</h3>
+
+<p>Entre otras cosas, ECMAScript define:</p>
+
+<ul>
+ <li>Sintaxis (reglas de análisis, palabras clave, flujos de control, inicialización literal de objetos...).</li>
+ <li>Mecanismos de control de errores (throw, try/catch, habilidad para crear tipos de Errores definidos por el usuario).</li>
+ <li>Tipos (boolean, number, string, function, object...).</li>
+ <li>Los objetos globales. En un navegador, estos objetos globales son los objetos de la ventana, pero ECMAScript solo define APIs no especificas para navegadores, ej. <code>parseInt</code>, <code>parseFloat</code>, <code>decodeURI</code>, <code>encodeURI</code>...</li>
+ <li>Mecanismo de herencia basada en prototipos.</li>
+ <li>Objetos y funciones incorporadas (<code>JSON</code>, <code>Math</code>, <code>Array.prototype</code> methods, Object introspection methods...)</li>
+ <li>Modo estricto.</li>
+</ul>
+
+<h3 id="Navegadores_soportados">Navegadores soportados</h3>
+
+<p>A partir de Octubre del 2016, la gran mayoria de los navegadores soportan <a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla">ECMAScript 5.1</a> y <a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_6_support_in_Mozilla">ECMAScript 2015 aka ES6</a>, pero versiones antiguas (aún en uso) implementan ECMAScript 5 solamente.</p>
+
+<h3 id="Futuro">Futuro</h3>
+
+<p>La 6ta edición principal de ECMAScript fue oficialmente aprobada y publicada como un estándar el 17 de Junio del 2015 por la ECMA General Assembly. Desde entonces las ediciones de ECMAScript son publicadas anualmente.</p>
+
+<h3 id="Internacionalización_de_la_API">Internacionalización de la API</h3>
+
+<p>La <a href="http://ecma-international.org/ecma-402/1.0/">ECMAScript Internationalization API Specification</a> es una adición para la especificación del lenguaje ECMAScript, también estandarizada por Ecma TC39. La internacionalización de la API provee intercalación --collation-- (comparación de string), formateo de números, y fomateo de fechas/tiempo para aplicaciones JavaScript, permitiendo que las aplicaciones elijan el idioma y adapten la funcionalidad a sus necesidades. El estandar inicial fue aprobado en Diciembre del 2012; el estado de la implementación en navegadores es rastreado en la documentación de la <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Intl"><code>Intl</code> object</a>. Las especificaciones de la internacionalización son actualmente ratificadas cada año y los navegadores constantemente mejoran su implementación.</p>
+
+<h2 id="DOM_APIs">DOM APIs</h2>
+
+<h3 id="WebIDL">WebIDL</h3>
+
+<p>Las especificaciones de la <a href="http://www.w3.org/TR/WebIDL/">WebIDL</a> proporcionan el vínculo de las tecnologías DOM y ECMAScript.</p>
+
+<h3 id="El_núcleo_del_DOM">El núcleo del DOM</h3>
+
+<p>El Document Object Model (DOM) es una <strong>convención multiplataforma e independiente</strong> del lenguaje para representar e interactuar con objetos en documentos HTML, XHTML y XML. Los objetos en el <strong>árbol DOM</strong> se pueden abordar y manipular mediante el uso de métodos en los objetos de otras tecnologías. El {{Glossary("W3C")}} estandariza el Modelo de Objetos del Documento Central, que define interfaces independientes del lenguaje que abstraen documentos HTML y XML como objetos, y también define mecanismos para manipular esta abstracción. Entre las cosas definidas por el DOM, podemos encontrar:</p>
+
+<ul>
+ <li>La estructura del documento, un modelo de árbol, y la arquitectura de eventos DOM en el nucleo del DOM: <code>Node</code>, <code>Element</code>, <code>DocumentFragment</code>, <code>Document</code>, <code>DOMImplementation</code>, <code>Event</code>, <code>EventTarget</code>, …</li>
+ <li>Una definición menos rigurosa de la arquitectura de eventos DOM, así como eventos específicos en eventos DOM.</li>
+ <li>Otras cosas como DOM Traversal y el DOM Range.</li>
+</ul>
+
+<p>Desde el punto de vista ECMAScript, los objetos definidos en la especificación DOM se denominan "objetos host".</p>
+
+<h3 id="HTML_DOM">HTML DOM</h3>
+
+<p>HTML, el lenguaje de marcado de la Web, se especifica en términos del DOM. Por encima de los conceptos abstractos definidos en DOM Core, HTML también define el significado de los elementos. El DOM HTML incluye cosas como el <code>className</code> propiedad en elementos HTML o API como {{domxref ("document.body")}}.</p>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">La especificación HTML también define restricciones en los documentos;</span> <span title="">por ejemplo, requiere que todos los elementos secundarios de un elemento</span></span> <code>ul</code> <span class="tlid-translation translation" lang="es"><span title="">que representa una lista desordenada, sean elementos</span></span> <code>li</code>, <span class="tlid-translation translation" lang="es"><span title="">ya que representan elementos de la lista.</span> <span title="">En general, también prohíbe el uso de elementos y atributos que no están definidos en un estándar.</span></span></p>
+
+<p>¿Busca <a href="/en-US/docs/DOM/document"><code>Document</code> object</a>, <a href="/en-US/docs/DOM/window"><code>Window</code> object</a>, <span class="tlid-translation translation" lang="es"><span title="">y los otros elementos DOM?</span></span> ? Lee la documentación <a href="/en-US/docs/Web/API/Document_Object_Model">DOM documentation</a>.</p>
+
+<h2 id="Otras_API_notables"><span class="tlid-translation translation" lang="es"><span title="">Otras API notables</span></span></h2>
+
+<ul>
+ <li>Las funciones <code>setTimeout</code> <code>ysetInterval</code> <span class="tlid-translation translation" lang="es"><span title="">se especificaron por primera vez en la interfaz de</span></span> <code><a href="http://www.whatwg.org/html/#window">Window</a></code> <span class="tlid-translation translation" lang="es"><span title="">en HTML Standard.</span></span></li>
+ <li><a href="https://dvcs.w3.org/hg/xhr/raw-file/tip/Overview.html">XMLHttpRequest</a> <span class="tlid-translation translation" lang="es"><span title="">hace posible enviar solicitudes HTTP asincrónicas.</span></span></li>
+ <li>EL <a href="http://dev.w3.org/csswg/cssom/">Modelo de Objetos CSS</a> <span class="tlid-translation translation" lang="es"><span title="">esume las reglas CSS como objetos.</span></span></li>
+ <li><a href="http://www.whatwg.org/specs/web-workers/current-work/">WebWorkers </a>permite el cálculo paralelo.</li>
+ <li><a href="http://www.whatwg.org/C/#network">WebSockets</a> <span class="tlid-translation translation" lang="es"><span title="">permite la comunicación bidireccional de bajo nivel.</span></span></li>
+ <li><a href="http://www.whatwg.org/html/#2dcontext">Canvas 2D Context</a> <span class="tlid-translation translation" lang="es"><span title="">es una API de dibujo para</span></span> {{htmlelement("canvas")}}.</li>
+</ul>
+
+<h3 id="Soporte_del_navegador">Soporte del navegador</h3>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Como todos los desarrolladores web han experimentado</span></span>,  <a href="http://ejohn.org/blog/the-dom-is-a-mess/">el DOM es un desastre</a>. <span class="tlid-translation translation" lang="es"><span title="">La uniformidad del soporte del navegador varía mucho de una característica a otra, principalmente porque muchas características DOM importantes tienen especificaciones muy poco claras (si las hay), y diferentes navegadores web agregan características incompatibles para casos de uso superpuestos (como el modelo de evento de Internet Explorer).</span> <span title="">A partir de junio de 2011, el W3C y particularmente el WHATWG están definiendo características antiguas en detalle para mejorar la interoperabilidad, y los navegadores a su vez pueden mejorar sus implementaciones basadas en estas especificaciones.</span></span></p>
+
+<p><span class="tlid-translation translation" lang="es"><span title="">Un enfoque común, aunque quizás no el más confiable, para la compatibilidad entre navegadores es usar bibliotecas de JavaScript, que resumen las funciones DOM y mantienen sus API funcionando igual en diferentes navegadores.</span> <span title="">Algunos de los frameworks más utilizados son</span></span> <a href="http://jquery.com/">jQuery</a>, <a href="http://www.prototypejs.org/">prototype</a>, y <a href="http://developer.yahoo.com/yui/">YUI</a>.</p>
diff --git a/files/es/web/javascript/memory_management/index.html b/files/es/web/javascript/memory_management/index.html
new file mode 100644
index 0000000000..86223b5e8c
--- /dev/null
+++ b/files/es/web/javascript/memory_management/index.html
@@ -0,0 +1,205 @@
+---
+title: Gestión de Memoria
+slug: Web/JavaScript/Memory_Management
+tags:
+  - Advanced
+  - JavaScript
+  - Performance
+  - Reference
+  - Referencia
+  - Rendimiento
+  - memoria
+translation_of: Web/JavaScript/Memory_Management
+original_slug: Web/JavaScript/Gestion_de_Memoria
+---
+<div>{{JsSidebar("Advanced")}}</div>
+
+<h2 id="Introducción">Introducción</h2>
+
+<p>Los lenguajes de bajo nivel, como C, tienen primitivos de bajo nivel como <code>malloc() </code>y <code>free() </code>para la gestión de memoria. Por otro lado, para los valores en JavaScript se reserva memoria cuando"cosas" (objetos, strings, etc.) son creados y "automáticamente" liberados cuando ya no son utilizados. El proceso anterior es conocido como <em>Recolección de basura (garbage collection). </em>Su forma "automática" es fuente de confusión, y da la impresión a los desarrolladores de JavaScript (y de otros lenguajes de alto nivel) de poder ignorar el proceso de gestión de memoria. Esto es erróneo. </p>
+
+<h2 id="Ciclo_de_vida_de_memoria">Ciclo de vida de memoria</h2>
+
+<p>Sin importar el lenguaje de programación, el ciclo de memoria es casi siempre parecido al siguiente:</p>
+
+<ol>
+ <li>Reservar la memoria necesaria</li>
+ <li>Utilizarla (lectura, escritura)</li>
+ <li>Liberar la memoria una vez ya no es necesaria.</li>
+</ol>
+
+<p>El primer y el segundo paso son explícitos en todos los lenguajes. El último paso es explícito en lenguajes de bajo nivel, pero es mayormente implícito en lenguajes de alto nivel como JavaScript</p>
+
+<h3 id="Reserva_de_memoria_en_JavaScript">Reserva de memoria en JavaScript</h3>
+
+<h4 id="Inicialización_de_valores">Inicialización de valores</h4>
+
+<p>Para no agobiar al programador con reservas de memoria, JavaScript las realiza al mismo tiempo que la declaración de los valores.</p>
+
+<pre class="brush: js">var n = 123; // reserva memoria para un número
+var s = "azerty"; // reserva memoria para un string
+
+var o = {
+  a: 1,
+  b: null
+}; // reserva memoria para un objeto y los valores que
+   // contiene
+
+// (similar a objeto) reserva memoria para el arreglo y
+// los valores que contiene
+var a = [1, null, "abra"];
+
+function f(a){
+  return a + 2;
+} // reserva memoria para una funcion (la cual es un objeto)
+
+// las expresiones de función tambien reservan memoria para un objeto
+someElement.addEventListener('click', function(){
+  someElement.style.backgroundColor = 'blue';
+}, false);
+</pre>
+
+<h4 id="Reserva_de_memoria_al_llamar_una_función">Reserva de memoria al llamar una función</h4>
+
+<p>En ocasiones al llamar a una función se reserva memoria para un objeto.</p>
+
+<pre class="brush: js">var d = new Date();
+// reserva memoria para un elemento del DOM
+var e = document.createElement('div');
+</pre>
+
+<p>Algunos métodos reservan memoria para nuevos valores u objetos:</p>
+
+<pre class="brush: js">var s = "azerty";
+var s2 = s.substr(0, 3); // s2 es un nuevo string
+// Como los strings son valores inmutables,
+// JavaScript puede NO reservar memoria para este,
+// y solo almacenar el rango [0, 3].
+
+var a = ["ouais ouais", "nan nan"];
+var a2 = ["generation", "nan nan"];
+var a3 = a.concat(a2);
+// nuevo arreglo con 4 elementos resultado de
+// concatenar los elementos de a y a2
+</pre>
+
+<h3 id="Usando_valores">Usando valores</h3>
+
+<p>Usar un valor es simplemente leerlo o escribirlo en memoria reservada. Esto puede ocurrir al leer o escribir el valor de una variable o de una propiedad de un objeto, inclusive pasando un argumento a una función.</p>
+
+<h3 id="Liberar_la_memoria_cuando_ya_no_es_necesaria">Liberar la memoria cuando ya no es necesaria</h3>
+
+<p>En este punto ocurren la mayoria de los inconvenientes con la gestión de memoria. Lo más díficil es encontrar el cuándo la "memoria ya no es necesaria". En algunas ocasiones, es necesario que el desarrollador determine en qué parte de un programa esa parte de memoria ya no es necesaria y la libere.</p>
+
+<p>Los lenguajes de alto nivel incluyen una herramienta de software conocida como "recolector de basura" <em>(garbage collector), </em>cuya función es rastrear las reservas de memoria y su utilización, para así encontrar cuándo cierta parte de la memoria ya no es necesaria, y en su momento liberarla automáticamente.  Este proceso es sólo una aproximación al problema general de saber cuándo una parte de la memoria ya no es necesaria, ya que éste es <a href="http://es.wikipedia.org/wiki/Problema_indecidible">indecidible</a> (no puede ser resuelto por un algoritmo).</p>
+
+<h2 id="Recolección_de_basura_(Garbage_collection)">Recolección de basura (Garbage collection)</h2>
+
+<p>Como antes se mencionaba el problema general de encontrar automáticamente cuando la memoria "ya no es necesaria" es indecidible. Como consecuencia, las recolecciones de basura implementan sólo una restricción a la solución del problema general. En esta sección se explicarán las nociones necesarias para entender los principales algoritmos de recolección de basura y sus limitaciones.</p>
+
+<h3 id="Referencias">Referencias</h3>
+
+<p>La noción principal de los algoritmos de recolección se basan en la noción de <em>referencia</em>. Dentro del contexto de gestión de memoria, se dice que un objeto hace referencia a otro si el primero tiene acceso al segundo (ya sea de forma implícita o explícita). Por ejemplo, un objeto de JavaScript guarda una referencia a su <a href="http://es.wikipedia.org/wiki/JavaScript#Protot.C3.ADpico">prototipo</a> (referencia implícita) y a cualquiera de los valores de sus propiedades (referencia explícita)</p>
+
+<p>Hay que mencionar que en este contexto la noción de "objeto" se refiere a algo más amplio que los objetos normales de JavaScript y que también incluye al ámbito de la función (o ámbito de léxico global).</p>
+
+<h3 id="Recolección_de_basura_a_través_de_conteo_de_referencias">Recolección de basura a través de conteo de referencias</h3>
+
+<p>Éste es el algoritmo de recolección más simple. Este algoritmo reduce la definición de "un objejo ya no es necesario" a "un objeto ya no tiene ningún otro objeto que lo referencíe". Un objeto es considerado recolectable si existen cero referencias hacia él.</p>
+
+<h4 id="Ejemplo">Ejemplo</h4>
+
+<pre class="brush: js">var o = {
+  a: {
+    b:2
+  }
+};
+// Se crean dos objetos. Uno es referenciado por el otro como
+// una de sus propiedades.
+// El otro es referenciado al ser asignado a la variable "o"
+// Ninguno puede ser recolectado.
+
+
+var o2 = o; // la variable "o2" es lo segundo en tener una
+            // referencia al objeto.
+o = 1;      // ahora el objeto solo tiene una referencia mediante
+            // la variable "o2"
+
+var oa = o2.a; // referencia a la propiedad "a" del objeto.
+               // ahora el objeto posee dos referencias, una como propiedad
+               // la otra como la variable "oa"
+
+o2 = "yo"; // el objeto original "o" ahora ya no tiene
+           // referencias a él. Podría ser recolectado.
+           // Sin embargo lo que había en la propiedad "a" aún
+           // esta refernciado en la variable "oa";
+           // no puede ser recolectado aún
+
+oa = null; // lo que estaba en la propiedad "a" del objeto original "o"
+           // ahora ya no tiene ninguna referencia.Puede ser recolectado.
+</pre>
+
+<h4 id="Limitación_ciclos">Limitación : ciclos</h4>
+
+<p>Existe una limitación cuando se trata de ciclos.  En el siguiente ejemplo dos objetos son creados y se referencían entre ellos -por lo que se crea un ciclo. Ellos no saldrán del ámbito de la función después del llamado de la función, con lo que serían efectivamente "ya no son necesarios" y por lo cual ser liberados. Sin embargo, el algoritmo de conteo de referencias considera que ya que cada uno de los dos objetos está referenciado por lo menos una vez, ninguno podra ser recolectado. Este simple algoritmo tiene la limitación de que si un grupo de objetos se referencian a sí mismos (y forman un ciclo), nunca pasarán a "ya no ser necesitados" y no podrán ser recolectados nunca.</p>
+
+<pre class="brush: js">function f(){
+  var o = {};
+  var o2 = {};
+  o.a = o2; // o referencía o2
+  o2.a = o; // o2 referencía o
+
+  return "azerty";
+}
+
+f();
+// Dos objetos son creados y se referencían uno al otro creando un ciclo
+// Estan atrapados en el scope de la funcion después de la llamada
+// por lo que son inútiles fuera de la función y podrían ser recolectados.
+// Sin embargo, el algoritmo de conteo de referencias considera que como
+// ambos objetos estan referenciados (aunque sean a si mismos) ambos
+// siguen en uso y por lo tanto no pueden ser recolectados.
+
+</pre>
+
+<h4 id="Ejemplo_real_aplicado">Ejemplo real aplicado</h4>
+
+<p>Internet Explorer 6 y 7 son conocidos por tener recolectores de basura por conteo de referencias para los objetos del DOM. Los Ciclos son un error común que pueden generar <em>fugas de memoria</em> (<em><a href="http://es.wikipedia.org/wiki/Fuga_de_memoria">memory leaks) (art. en inglés)</a>:</em></p>
+
+<pre class="brush: js">var div;
+window.onload = function(){
+  div = document.getElementById("miDiv");
+  div<span style="font-size: 1rem;">.referenciaCircular = div;</span>
+  div.muchosDatos = new Array(10000).join("*");
+};
+</pre>
+
+<p>En el ejemplo anterior, el elemento del DOM "miDiv" posée una referencia circular a sí mismo en la propiedad "referenciaCircular". Si la propiedad no es explícitamente removida o asignada con el valor <em>null</em>,  un algoritmo de conteo de referencias siempre va a dejar por lo menos una referencia intacta y va a mantener el elemento del DOM activo en memoria incluso cuando es removido del DOM. Si el objeto del DOM contiene una gran cantidad de datos (ejemplificado en la propiedad "muchosDatos"), la memoria consumida por estos datos nunca será liberada.</p>
+
+<h3 id="Algoritmo_Mark-and-sweep_(Marcado_y_barrido)">Algoritmo Mark-and-sweep (Marcado y barrido)</h3>
+
+<p>Este algoritmo reduce la definición de "un objeto ya no es necesitado" a "un objeto es inalcanzable"</p>
+
+<p>Este algoritmo asume la noción de un grupo de objetos llamados <em>objetos raíz</em> (en JavaScript la raíz es el objeto global). Periódicamente el recolector empieza por estas raíces, encuentra todos los objetos que están referenciados por estas raíces, y luego todos los objetos referenciados de estos, etc. Empezando por las raíces, el recolector de esta forma encontrará todos los objetos que son <em>alcanzables</em> y recolectará los objetos inalcanzables.</p>
+
+<p>Este algoritmo es mejor que el anterior ya que "un objeto tiene cero referencias" equivale al "objeto es inalcanzable". Esto no sucedía asi en el algoritmo anterior cuando se trataba de un ciclo.</p>
+
+<p>Desde el 2012, todos los navegadores incluyen un recolector de basura basado en mark-and-sweep. Todas las mejoras realizadas en el campo de Recolección de basura en JavaScript (recolección generacional/incremental/concurrida/paralela) en los ultimos años son mejoras a la implementación del algoritmo, pero no mejoras sobre el algoritmo de recolección ni a la reducción de la definicion de cuando"un objeto ya no es necesario".</p>
+
+<h4 id="Los_ciclos_son_problema_del_pasado">Los ciclos son problema del pasado</h4>
+
+<p>En el primer ejemplo, después de que la llamada a una función termina, los dos objetos ya no son referenciados por nada alcanzable desde el objeto global. De esta forma serán identificados como inalcanzables por el recolector de basura.</p>
+
+<p>Lo mismo ocurre en el segundo ejemplo. Una vez que el elemento div y sus métodos se hacen inalcanzable desde los objetos raíz, ambos pueden ser recolectados a pesar de que estén referenciados los unos de los otros.</p>
+
+<h4 id="Limitación_los_objetos_necesarios_se_hacen_inalcanzables_de_forma_explícita.">Limitación: los objetos necesarios se hacen inalcanzables de forma explícita.</h4>
+
+<p>Aunque esto está marcado como una limitación, se puede encontrar muy poco en la práctica. Ésta es la razón por la cuál la recolección de basura es poco tomada en cuenta.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a class="external" href="http://www.ibm.com/developerworks/web/library/wa-memleak/">IBM article on "Memory leak patterns in JavaScript" (2007) (art. en inglés)</a></li>
+ <li><a class="external" href="http://msdn.microsoft.com/en-us/magazine/ff728624.aspx">Kangax article on how to register event handler and avoid memory leaks (2010) (art. en inglés)</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Mozilla/Performance" title="https://developer.mozilla.org/en-US/docs/Mozilla/Performance">Performance (art. en inglés) </a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/about/index.html b/files/es/web/javascript/reference/about/index.html
new file mode 100644
index 0000000000..3b30af43f6
--- /dev/null
+++ b/files/es/web/javascript/reference/about/index.html
@@ -0,0 +1,159 @@
+---
+title: Acerca de
+slug: Web/JavaScript/Reference/About
+tags:
+  - JavaScript
+translation_of: Web/JavaScript/Reference/About
+original_slug: Web/JavaScript/Referencia/Acerca_de
+---
+<div>{{JsSidebar}}</div>
+
+<h3 id="Nuevas_caracter.C3.ADsticas_en_esta_versi.C3.B3n" name="Nuevas_caracter.C3.ADsticas_en_esta_versi.C3.B3n">Nuevas características en esta versión</h3>
+
+<p>JavaScript versión 1.5 provee las siguientes nuevas características y extensiones:</p>
+
+<p><strong>Errores en tiempo de ejecución </strong><br>
+ Los errores en tiempo de ejecución son ahora reportados como <a href="/es/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones" title="es/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones">excepciones</a>.</p>
+
+<p><strong>Extensiones para el formato de números </strong><br>
+ El formato de números ha sido extendido para incluir los métodos <code>Number.prototype.toExponential</code>, <code>Number.prototype.toFixed</code> y <code>Number.prototype.toPrecision</code>.</p>
+
+<p><strong>Extensiones de expresiones regulares </strong><br>
+ Las siguientes extensiones para expresiones regulares han sido añadidas:</p>
+
+<ul>
+ <li>Cuantificadores avaros: <code>— +, *, ? y {}</code>:ahora pueden seguirse por un <code>?</code> para forzarlos ha no ser avaros. Para la entrada <strong>?</strong> Véase la página <a href="/es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales" title="es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales">Escribir un patrón de expresiones regulares</a>.</li>
+ <li>Paréntesis sin captura: <code>(?:x)</code>:pueden ser usados en vez de paréntesis con captura <code>(x)</code>. Cuando son utilizados, las sub expresiones de compatibilidad {{ mediawiki.external('match') }} no están disponibles como referencias de respaldo {{ mediawiki.external('back-references') }}. Para la entrada <strong>(?:x)</strong> Véase la página: <a href="/es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales" title="es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales">Escribir un patrón de expresiones regulares</a>.</li>
+ <li>Aserciones predictivas {{ mediawiki.external('lookahead assertions') }} positivas y negativas son soportadas. Las dos aserguran una comparación dependiente de lo que sigue en la cadena de texto que está siendo cotejada. Ver las entradas para <code>x(?=y) y x(?!y)</code> en la página: <a href="/es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales" title="es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales">Escribir un patrón de expresiónes regulares</a>.</li>
+ <li>La bandera m ha sido añadida para especificar que la expresión regular deberá cotejarse sobre múltiples líneas.</li>
+</ul>
+
+<p><strong>Declaraciones condicionales de funciones </strong><br>
+ Las funciones ahora pueden ser declaradas al interior de una cláusula if.</p>
+
+<p><strong>Expresiones funcionales </strong><br>
+ Las funciones ahora pueden ser declaradas al interior de una expresión.</p>
+
+<p><strong>Cláusulas Catch múltiples </strong><br>
+ Las cláusulas Catch múltiples en una sentencia try...catch son soportadas.</p>
+
+<p><strong>Constantes </strong><br>
+ Constantes nominadas como sólo de lectura son soportadas. Esta característica está disponible únicamente en la implementación C de JavaScript.</p>
+
+<p><strong>Obtenedores y Modificadores (Getters and Setters) </strong><br>
+ Los editores de JavaScript ahora pueden añadir obtenedores {{ mediawiki.external('getters') }} y modificadores {{ mediawiki.external('setters') }} a sus objetos. Esta característica está disponible únicamente en la implementación C de JavaScript.</p>
+
+<h3 id="Qu.C3.A9_deber.C3.ADa_saberse_ya" name="Qu.C3.A9_deber.C3.ADa_saberse_ya">Qué debería saberse ya</h3>
+
+<p>Esta referencia asume que usted tiene a su respaldo el siguiente conocimiento básico:</p>
+
+<ul>
+ <li>Un entendimiento general de la Internet y de la World Wide Web (WWW).</li>
+ <li>Un conocimiento práctico del lenguaje de marcas para Hipertexto {{ mediawiki.external('HyperText Markup Language') }} (<a href="/es/HTML" title="es/HTML">HTML</a>).</li>
+</ul>
+
+<p>Es beneficioso alguna experiencia en programación en lenguajes como C o Visual Basic, pero no es requerido.</p>
+
+<h3 id="Versiones_de_JavaScript" name="Versiones_de_JavaScript">Versiones de JavaScript</h3>
+
+<p>Cada versión del servidor Netscape Enterprise también soporta una versión diferente de JavaScript. Para ayudarle a escribir sus scripts para que sean compatibles con múltiples versiones de un servidor Enterprise, este manual lista la versión de JavaScript en la cual cada característica fue implementada.</p>
+
+<p>La siguiente tabla lista las veriones de JavaScript soportadas por las diferentes versiones de Navegadores. Versiones de Navegadores anteriores a la 2.0 no soportan JavaScript.</p>
+
+<h4 id="JavaScript_y_Versiones_de_Navegadores" name="JavaScript_y_Versiones_de_Navegadores">JavaScript y Versiones de Navegadores</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Versión de JavaScript</td>
+   <td class="header">Versión del Navegador</td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.0</td>
+   <td>Navegador 2.0</td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.1</td>
+   <td>Navegador 3.0</td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.2</td>
+   <td>Navegador 4.0-4.05</td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.3</td>
+   <td>Navegador 4.06-4.7x</td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.4</td>
+   <td>n/a</td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.5</td>
+   <td>Navegador 6.0
+    <p>Mozilla 0.6x-0.9x<br>
+     (navegador de código abierto)</p>
+   </td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.6</td>
+   <td>Mozilla Firefox 1.5</td>
+  </tr>
+  <tr>
+   <td>JavaScript 1.7</td>
+   <td>Mozilla Firefox 2</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Cada versión del servidor Netscape Enterprise también soporta una versión diferente de JavaScript. Para ayudarle a escribir sus scripts para que sean compatibles con múltiples versiones de un servidor Enterprise, este manual usa una abreviación para indicar la versión del servidor en el cual cada característica fue implementada.</p>
+
+<h4 id="JavaScript_and_Netscape_Enterprise_Server_Versions" name="JavaScript_and_Netscape_Enterprise_Server_Versions">JavaScript and Netscape Enterprise Server Versions</h4>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td class="header">Abbreviation</td>
+   <td class="header">Enterprise Server Version</td>
+  </tr>
+  <tr>
+   <td>NES 2.0</td>
+   <td>Netscape Enterprise Server 2.0</td>
+  </tr>
+  <tr>
+   <td>NES 3.0</td>
+   <td>Netscape Enterprise Server 3.0</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="D.C3.B3nde_encontrar_informaci.C3.B3n_de_JavaScript" name="D.C3.B3nde_encontrar_informaci.C3.B3n_de_JavaScript">Dónde encontrar información de JavaScript</h3>
+
+<p>La documentación de JavaScript incluye los siguientes libros:</p>
+
+<ul>
+ <li><a href="/es/Guía_JavaScript_1.5" title="es/Guía_JavaScript_1.5">Guía de JavaScript 1.5</a> provee la información sobre el lenguaje JavaScript y sus objetos.</li>
+ <li><a href="/es/Referencia_de_JavaScript_1.5" title="es/Referencia_de_JavaScript_1.5">Referencia de JavaScript 1.5</a> (éste manual) provee material de referencia para el lenguaje JavaScript.</li>
+</ul>
+
+<p>Si usted es principiante con JavaScript, comience por la <a href="/es/Guía_JavaScript_1.5" title="es/Guía_JavaScript_1.5">Guía de JavaScript</a> y una vez que haya obtenido firmes entendimientos de sus fundamentos, debe seguir con la <a href="/es/Referencia_de_JavaScript_1.5" title="es/Referencia_de_JavaScript_1.5">Referencia de JavaScript 1.5</a> para conseguir más detalles individuales acerca de los objetos y las sentencias.</p>
+
+<h3 id="Convenciones_en_el_documento" name="Convenciones_en_el_documento">Convenciones en el documento</h3>
+
+<p>Las aplicaciones JavaScript se ejecutan en muchos sistemas operativos; la información en este libro se aplica a todas las versiones. Las rutas {{ mediawiki.external('paths') }} para archivos y directorios están dadas en un formato Windows (con backslashes separando los nombres de directorios). Para las versiones Unix, la ruta de los directorios son las mismas, excepto que deben usarse slashes en vez de backslashes para separar los directorios.</p>
+
+<p>Esta guía utiliza los localizadores uniformes de recursos {{ mediawiki.external('uniform resource locators') }} (URLs) de la siguiente forma:</p>
+
+<p><code><span class="nowiki">http://servidor.dominio/path/file.html</span></code></p>
+
+<p>En estos URLs, "servidor" representa el nombre del servidor en el cual puede ejecutar su aplicación (p.e., busqueda1, www), "dominio" representa un nombre de dominio de Internet (p.e., netscape.com, uiuc.edu), "path" representa la estructura de directorios en el servidor y "file.html" representa un nombre individual de archivo. En general, los items en italica en un URLs se mantienen en su lugar y los items en un tipo normal de fuente monospace son literales. Si su servidor tiene habilitada la capa de sockets seguros {{ mediawiki.external('Secure Sockets Layer') }} (SSL), deberá usar https en lugar de http en el URL.</p>
+
+<p>Esta guía utiliza las siguientes convenciones de tipo de fuente:</p>
+
+<ul>
+ <li>La fuente <code>monospace font</code> es usada para listados de código y código de ejemplo, para las API y elementos del lenguaje (tales como nombres de métodos y nombres de propiedades), nombres de archivos, nombres de rutas, nombres de directorios, etiquetas HTML y cualquier texto que deberá ser digitado en la pantalla. (La fuente Monospace italic es usada para fijar lugares embedidos que deben mantenerse en el código.)</li>
+ <li>El tipo <em>Italic type</em> es usado para títulos de libros, para enfatizar, para variables y lugares que deben mantenerse y las palabras usadas en sentido literal.</li>
+ <li>La negrillas <strong>Boldface type</strong> son utilizadas para términos del glosario.</li>
+</ul>
+
+<p> </p>
diff --git a/files/es/web/javascript/reference/classes/constructor/index.html b/files/es/web/javascript/reference/classes/constructor/index.html
new file mode 100644
index 0000000000..4faeee4a3c
--- /dev/null
+++ b/files/es/web/javascript/reference/classes/constructor/index.html
@@ -0,0 +1,103 @@
+---
+title: constructor
+slug: Web/JavaScript/Reference/Classes/constructor
+tags:
+  - Clases
+  - ECMAScript6
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Classes/constructor
+original_slug: Web/JavaScript/Referencia/Classes/constructor
+---
+<div>{{jsSidebar("Classes")}}</div>
+
+<p>El método constructor es un metodo especial para crear e inicializar un objeto creado a partir de una clase.</p>
+
+<p>El código fuente para este ejemplo interactivo se encuentra almacenado en un repositorio de Github. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud para extraer el código (pull request).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">constructor([argumentos]) { ... }</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Sólo puede haber un método especial con el nombre de "constructor" en una clase. Un error de sintaxis será lanzado, si la clase contiene más de una ocurrencia de un método constructor.</p>
+
+<p>Un constructor puede utilizar la palabra clave super para llamar al constructor de una clase padre.</p>
+
+<p>Si no especifica un método constructor, se utiliza un constructor predeterminado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_constructor">Usando el método constructor</h3>
+
+<p>Este fragmento de código se toma de la <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">classes sample</a> (<a href="https://googlechrome.github.io/samples/classes-es6/index.html">live demo</a>).</p>
+
+<pre class="brush: js notranslate">class Square extends Polygon {
+  constructor(length) {
+    // Aquí, llama al constructor de la clase padre con sus longitudes
+    // contemplando la anchura y la altura del Polígono
+    super(length, length);
+    // Nota: En las clases derivadas, super() se debe llamar primero
+    // Se puede utilizar "this". Dejando esto causará un error de
+    //referencia.
+    this.name = 'Square';
+  }
+
+  get area() {
+    return this.height * this.width;
+  }
+
+  set area(value) {
+    this.area = value;
+  }
+}</pre>
+
+<h3 id="Constructores_por_defecto">Constructores por defecto</h3>
+
+<p>Si no especifica un método constructor, se utiliza un constructor predeterminado. Para las clases base, el constructor por defecto es:</p>
+
+<pre class="brush: js notranslate">constructor() {}
+</pre>
+
+<p>Para las clases derivadas, el constructor por defecto es:</p>
+
+<pre class="brush: js notranslate">constructor(...args) {
+  super(...args);
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{Compat("javascript.classes.constructor")}}</p>
+
+<p>La tabla de compatibilidad de esta pagina está generada a partir de data estructurada. Si quieres contribuir a la data, por favor dirígete a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super()</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/class"><code>class</code> expression</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/class"><code>class</code> declaration</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Classes</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/classes/extends/index.html b/files/es/web/javascript/reference/classes/extends/index.html
new file mode 100644
index 0000000000..839acf38e9
--- /dev/null
+++ b/files/es/web/javascript/reference/classes/extends/index.html
@@ -0,0 +1,168 @@
+---
+title: extends
+slug: Web/JavaScript/Reference/Classes/extends
+translation_of: Web/JavaScript/Reference/Classes/extends
+original_slug: Web/JavaScript/Referencia/Classes/extends
+---
+<div>{{jsSidebar("Classes")}}</div>
+
+<p>La palabra clave <strong>extends</strong> es usada en la <a href="/en-US/docs/Web/JavaScript/Reference/Statements/class">declaración</a> o <a href="/en-US/docs/Web/JavaScript/Reference/Operators/class">expresión</a> de clases, para crear una clase hija de otra.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">class ChildClass extends ParentClass { ... }</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La palabra clave <code>extends</code> se puede usar para crear una subclase a partir de clases personalizadas, así como sus objetos incorporados.</p>
+
+<p>La propiedad <code>.prototype</code> de la nueva subclase debe ser un {{jsxref("Object")}} o {{jsxref("null")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Como_usar_extends">Como usar <code>extends</code></h3>
+
+<p>El primer ejemplo crea una clase con el nombre <code>Square</code> a partir de una clase llamada <code>Polygon</code>. Este ejemplo ha sido extraido del siguiente <a href="https://googlechrome.github.io/samples/classes-es6/index.html">live demo</a> <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">(código fuente)</a>.</p>
+
+<pre class="brush: js">class Square extends Polygon {
+  constructor(length) {
+    // Aquí se invoca el constructor de la clase padre con longitud
+    // proporcionada por el ancho y alto de Polygon
+    super(length, length);
+    // Nota: En las clases extendidas, se debe llamar a super()
+    // antes de poder usar 'this'. El no hacerlo provocará un reference error.
+    this.name = 'Square';
+  }
+
+  get area() {
+    return this.height * this.width;
+  }
+
+  set area(value) {
+    this.area = value;
+  }
+}</pre>
+
+<h3 id="Como_usar_extends_con_objetos_incorporados">Como usar <code>extends</code> con objetos incorporados</h3>
+
+<p>Este ejemplo extiende el objeto incorporado {{jsxref("Date")}}. Este ejemplo ha sido extraido del siguiente <a href="https://googlechrome.github.io/samples/classes-es6/index.html">live demo</a> <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">(código fuente)</a>.</p>
+
+<pre class="brush: js">class myDate extends Date {
+  constructor() {
+    super();
+  }
+
+  getFormattedDate() {
+    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
+    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
+  }
+}</pre>
+
+<h3 id="Extendiendo_de_null">Extendiendo de <code>null</code></h3>
+
+<p>Extender de {{jsxref("null")}} es como hacerlo de una clase normal, excepto que el objeto prototype no hereda de {{jsxref("Object.prototype")}}.</p>
+
+<pre class="brush: js">class nullExtends extends null {
+  constructor() {}
+}
+
+Object.getPrototypeOf(nullExtends); // Function.prototype
+Object.getPrototypeOf(nullExtends.prototype) // null</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-class-definitions', 'extends')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-class-definitions', 'extends')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>{{CompatGeckoDesktop(45)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Array subclassing</td>
+   <td>{{CompatChrome(43.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile(45)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(42.0)}}</td>
+  </tr>
+  <tr>
+   <td>Array subclassing</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Clases</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/classes/index.html b/files/es/web/javascript/reference/classes/index.html
new file mode 100644
index 0000000000..455b933562
--- /dev/null
+++ b/files/es/web/javascript/reference/classes/index.html
@@ -0,0 +1,373 @@
+---
+title: Clases
+slug: Web/JavaScript/Reference/Classes
+tags:
+  - Classes
+  - ECMAScript 2015
+  - Herencia
+  - Intermedio
+  - JavaScript
+  - NeedsContent
+  - NeedsTranslation
+  - Reference
+  - TopicStub
+translation_of: Web/JavaScript/Reference/Classes
+original_slug: Web/JavaScript/Referencia/Classes
+---
+<div>{{JsSidebar("Classes")}}</div>
+
+<p>Las clases de javascript, introducidas en ECMAScript 2015, son una mejora sintáctica sobre la herencia basada en prototipos de JavaScript. La sintaxis de las clases <strong>no</strong> introduce un nuevo modelo de herencia orientada a objetos en JavaScript. Las clases de JavaScript proveen una sintaxis mucho más clara y simple para crear objetos y lidiar con la herencia.</p>
+
+<h2 id="Definiendo_clases">Definiendo clases</h2>
+
+<p>Las clases son "<a href="/en-US/docs/Web/JavaScript/Reference/Functions">funciones</a> especiales", como las <a href="/en-US/docs/Web/JavaScript/Reference/Operators/function">expresiones de funciones</a> y <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function">declaraciones de funciones</a>, la sintaxis de una clase tiene dos componentes: <a href="/en-US/docs/Web/JavaScript/Reference/Operators/class">expresiones de clases</a> y <a href="/en-US/docs/Web/JavaScript/Reference/Statements/class">declaraciones de clases</a>.</p>
+
+<h3 id="Declaración_de_clases">Declaración de clases</h3>
+
+<p>Una manera de definir una clase es mediante una <strong>declaración de clase</strong><em>. </em>Para declarar una clase, se utiliza la palabra reservada <code>class</code> y un nombre para la clase "Rectangulo".</p>
+
+<pre class="brush: js notranslate">class Rectangulo {
+  constructor(alto, ancho) {
+    this.alto = alto;
+    this.ancho = ancho;
+  }
+}</pre>
+
+<h4 id="Alojamiento">Alojamiento</h4>
+
+<p>Una importante diferencia entre las <strong>declaraciones de funciones</strong><em> y </em>las <strong>declaraciones de clases</strong> es que las <strong>declaraciones de funciones</strong><em> </em>son alojadas y las <strong>declaraciones de clases</strong><em> </em>no lo son. En primer lugar necesitas declarar tu clase y luego acceder a ella, de otro modo el ejemplo de código siguiente arrojará un {{jsxref("ReferenceError")}}:</p>
+
+<pre class="brush: js example-bad notranslate">const p = new Rectangle(); // ReferenceError
+
+class Rectangle {}
+</pre>
+
+<h3 id="Expresiones_de_clases">Expresiones de clases</h3>
+
+<p>Una <strong>expresión de clase</strong> es otra manera de definir una clase. Las expresiones de clase pueden ser nombradas o anónimas. El nombre dado a la <strong>expresión de clase</strong> nombrada es local dentro del cuerpo de la misma.</p>
+
+<pre class="notranslate">// Anonima
+let Rectangulo = class {
+  constructor(alto, ancho) {
+    this.alto = alto;
+    this.ancho = ancho;
+  }
+};
+
+console.log(Rectangulo.name);
+// output: "Rectangulo"
+
+// Nombrada
+let Rectangulo = class Rectangulo2 {
+  constructor(alto, ancho) {
+    this.alto = alto;
+    this.ancho = ancho;
+  }
+};
+console.log(Rectangulo.name);
+// output: "Rectangulo2"
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Las <strong>expresiones</strong> de clase están sujetas a las mismas restricciones de elevación que se describen en la sección {{anch("Class declarations")}}.</p>
+</div>
+
+<h2 id="Cuerpo_de_la_clase_y_definición_de_métodos">Cuerpo de la clase y definición de métodos</h2>
+
+<p>El contenido<em> </em>de una <strong>clase </strong>es la parte que se encuentra entre las llaves <code>{}</code>. Este es el lugar se definen los <strong>miembros de clase,</strong> como los <strong>métodos </strong>o <strong>constructores.</strong></p>
+
+<h3 id="Modo_estricto">Modo estricto</h3>
+
+<p>El cuerpo de las <em>declaraciones de clase</em> y las <em>expresiones de clase</em> son ejecutadas en <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode">modo estricto.</a> En otras palabras, el código escrito aquí está sujeto a una sintaxis más estricta para aumentar el rendimiento, se arrojarán algunos errores silenciosos y algunas palabras clave están reservadas para versiones futuras de ECMAScript.</p>
+
+<h3 id="Constructor">Constructor</h3>
+
+<p>El método <code><a href="/en-US/docs/Web/JavaScript/Reference/Classes/constructor">constructor</a></code> es un método especial para crear e inicializar un objeto creado con una <code>clase</code>. Solo puede haber un método especial con el nombre "constructor" en una clase. Si esta contiene mas de una ocurrencia del método <code><strong>constructor, </strong></code>se arrojará un <em>Error </em>{{jsxref("SyntaxError")}}</p>
+
+<p>Un <strong>constructor</strong> puede usar la <em>palabra reservada</em> <strong><code>super </code></strong>para llamar al <strong>constructor </strong>de una <em>superclase</em></p>
+
+<h3 id="Métodos_prototipo">Métodos prototipo</h3>
+
+<p>Vea también <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">métodos definidos</a>.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">class Rectangulo {
+  constructor (alto, ancho) {
+    this.alto = alto;
+    this.ancho = ancho;
+  }
+  // Getter
+  get area() {
+     return this.calcArea();
+   }
+  // Método
+  calcArea () {
+    return this.alto * this.ancho;
+  }
+}
+
+const cuadrado = new Rectangulo(10, 10);
+
+console.log(cuadrado.area); // 100</code></pre>
+
+<div class="syntaxbox"></div>
+
+<h3 id="Métodos_estáticos">Métodos estáticos</h3>
+
+<p>La <em>palabra clave</em> <code><a href="/en-US/docs/Web/JavaScript/Reference/Classes/static">static</a></code> define un método estático para una clase. Los métodos estáticos son llamados sin instanciar su clase y <strong>no</strong> pueden ser llamados mediante una instancia de clase. Los métodos estáticos son a menudo usados para crear funciones de utilidad para una aplicación.</p>
+
+<pre class="brush: js notranslate">class Punto {
+  constructor ( x , y ){
+    this.x = x;
+    this.y = y;
+  }
+
+  static distancia ( a , b) {
+    const dx = a.x - b.x;
+    const dy = a.y - b.y;
+
+    return Math.sqrt ( dx * dx + dy * dy );
+  }
+}
+
+const p1 = new Punto(5, 5);
+const p2 = new Punto(10, 10);
+
+console.log (Punto.distancia(p1, p2)); // 7.0710678118654755</pre>
+
+<h3 id="Boxing_con_prototipos_y_métodos_estáticos">"Boxing" con prototipos y métodos estáticos</h3>
+
+<p>Cuando un método estático o método del prototipo es llamado sin un valor para "this" (o con "this" como booleano, cadena, número, undefined o null), entonces el valor de "this" será <strong>undefined</strong> dentro de la funciona llamada. <em>Autoboxing </em>no ocurrirá. El comportamiento será igual inclusive si se escribe el código en modo no estricto.</p>
+
+<pre class="notranslate"><code>class Animal {
+  hablar() {
+    return this;
+  }
+  static comer() {
+    return this;
+  }
+}
+
+let obj = new Animal();
+obj.hablar(); // Animal {}
+let hablar = obj.hablar;
+hablar(); // undefined
+
+Animal.comer() // class Animal
+let comer = Animal.comer;
+comer(); // undefined</code></pre>
+
+<p>Si se escribe el código del cuadro superior usando clases función tradicionales, entonces autoboxing ocurrirara porque tomará valor de "this" sobre la función que es llamada.</p>
+
+<pre class="notranslate"><code>function Animal() { }
+
+Animal.prototype.hablar = function(){
+  return this;
+}
+
+Animal.comer = function() {
+  return this;
+}
+
+let obj = new Animal();
+let hablar = obj.hablar;
+hablar(); // global object
+
+let hablar = Animal.hablar;
+hablar(); // global object</code></pre>
+
+<h2 id="Subclases_con_extends">Subclases con <code>extends</code></h2>
+
+<p>La palabra clave <code><a href="/en-US/docs/Web/JavaScript/Reference/Classes/extends">extends</a></code> es usada en <em>declaraciones de clase</em> o <em>expresiones de clase</em> para crear una clase hija.</p>
+
+<pre class="brush: js notranslate"><code>class Animal {
+  constructor(nombre) {
+    this.nombre = nombre;
+  }
+
+  hablar() {
+    console.log(this.nombre + ' hace un ruido.');
+  }
+}
+
+class Perro extends Animal {
+  hablar() {
+    console.log(this.nombre + ' ladra.');
+  }
+}</code></pre>
+
+<p>También se pueden extender las clases tradicionales basadas en funciones:</p>
+
+<pre class="brush: js notranslate">function Animal (nombre) {
+  this.nombre = nombre;
+}
+Animal.prototype.hablar = function () {
+  console.log(this.nombre + 'hace un ruido.');
+}
+
+class Perro extends Animal {
+  hablar() {
+    super.hablar();
+    console.log(this.nombre + ' ladra.');
+  }
+}
+
+var p = new Perro('Mitzie');
+p.hablar();</pre>
+
+<p>Fijarse que las clases no pueden extender objectos regulares (literales). Si se quiere heredar de un objecto regular, se debe user {{jsxref("Object.setPrototypeOf()")}}::</p>
+
+<pre class="notranslate"><code>var Animal = {
+  hablar() {
+    console.log(this.nombre + 'hace ruido.');
+  }
+};
+
+class Perro {
+  constructor(nombre) {
+    this.nombre = nombre;
+  }
+  hablar() {
+    console.log(this.nombre + ' ladra.');
+  }
+}
+
+Object.setPrototypeOf(Perro.prototype, Animal);
+
+var d = new Perro('Mitzie');
+d.hablar();</code></pre>
+
+<h2 id="Especies">Especies</h2>
+
+<p>Quizás se quiera devolver objetos {{jsxref("Array")}} derivados de la clase array MyArray. El patron <em>species</em> permite sobreescribir constructores por defecto.</p>
+
+<p>Por ejemplo, cuando se usan metodos del tipo {{jsxref("Array.map", "map()")}} que devuelven el constructor por defecto, se quiere que esos métodos devuelvan un objeto padre Array, en vez de MyArray. El símbolo {{jsxref("Symbol.species")}} permite hacer:</p>
+
+<pre class="brush: js notranslate"><code>class MyArray extends Array {
+  // Sobre escribe species sobre el constructor padre Array
+  static get [Symbol.species]() { return Array; }
+}
+
+var a = new MyArray(1,2,3);
+var mapped = a.map(x =&gt; x * x);
+
+console.log(mapped instanceof MyArray); // false
+console.log(mapped instanceof Array);   // true</code>
+</pre>
+
+<h2 id="Llamadas_a_súperclases_con_super">Llamadas a súperclases con <code>super</code></h2>
+
+<p>La palabra clave <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super</a></code> es usada para llamar funciones del objeto padre.</p>
+
+<pre class="notranslate"><code>class Gato {
+  constructor(nombre) {
+    this.nombre = nombre;
+  }
+
+  hablar() {
+    console.log(this.nombre + ' hace ruido.');
+  }
+}
+
+class Leon extends Gato {
+  hablar() {
+    super.hablar();
+    console.log(this.nombre + ' maulla.');
+  }
+}</code></pre>
+
+<h2 id="Mix-ins">Mix-ins</h2>
+
+<p>Subclases abstractas or <em>mix-ins</em> son plantillas de clases. Una clase ECMAScript solo puede tener una clase padre, con lo cual la herencia multiple no es posible. La funcionalidad debe ser proporcionada por la clase padre.</p>
+
+<p>Una función con una clase padre como entrada y una subclase extendiendo la clase padre como salida puede ser usado para implementar mix-ins en EMCAScript:</p>
+
+<pre class="brush: js notranslate"><code>var calculatorMixin = Base =&gt; class extends Base {
+  calc() { }
+};
+
+var randomizerMixin = Base =&gt; class extends Base {
+  randomize() { }
+};</code></pre>
+
+<p>Una clase que use este método puede ser escrita tal que así:</p>
+
+<pre class="brush: js notranslate"><code>class Foo { }
+class Bar extends calculatorMixin(randomizerMixin(Foo)) { }</code></pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-class-definitions', 'Class definitions')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>Available in the Nightly channel only (since February 2015)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>Available in the Nightly channel only (since February 2015)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(42.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
+ <li>{{jsxref("Statements/class", "class declaration")}}</li>
+ <li>{{jsxref("Operators/class", "class expression")}}</li>
+ <li>{{jsxref("Operators/super", "super")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/classes/private_class_fields/index.html b/files/es/web/javascript/reference/classes/private_class_fields/index.html
new file mode 100644
index 0000000000..5ea95b812c
--- /dev/null
+++ b/files/es/web/javascript/reference/classes/private_class_fields/index.html
@@ -0,0 +1,202 @@
+---
+title: Private class fields
+slug: Web/JavaScript/Reference/Classes/Private_class_fields
+translation_of: Web/JavaScript/Reference/Classes/Private_class_fields
+original_slug: Web/JavaScript/Referencia/Classes/Private_class_fields
+---
+<div>
+<p><font><font>Las propiedades de la clase son públicas de forma predeterminada y se pueden examinar o modificar fuera de la clase. </font><font>Sin embargo, existe </font></font><a class="external" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;pto=aue&amp;rurl=translate.google.com&amp;sl=en&amp;sp=nmt4&amp;tl=es&amp;u=https://github.com/tc39/proposal-class-fields&amp;usg=ALkJrhgmG5nvuZjYd2YQRSuRJHti_gdXeQ" rel="noopener"><font><font>una propuesta experimental</font></font></a><font><font>  para permitir la definición de campos de clase privados utilizando un </font></font><code>#</code><font><font>prefijo </font><font>hash </font><font>.</font></font></p>
+</div>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox notranslate">class ClassWithPrivateField {
+  #privateField
+}
+
+class ClassWithPrivateMethod {
+  #privateMethod() {
+    return 'hello world'
+ }
+}
+
+class ClassWithPrivateStaticField {
+  static #PRIVATE_STATIC_FIELD
+}
+</pre>
+
+<h3 id="Campos_estáticos_privados"><font><font>Campos estáticos privados </font></font></h3>
+
+<p><font><font>Los campos privados son accesibles en el constructor de clases desde dentro de la propia declaración de clases.</font></font></p>
+
+<p><font><font>La limitación de las variables estáticas que se llaman solo por métodos estáticos aún se mantiene</font></font></p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateStaticField {
+  static #PRIVATE_STATIC_FIELD
+
+  static publicStaticMethod() {
+    ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD = 42
+    return ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD
+  }
+}
+
+console.assert(ClassWithPrivateStaticField.publicStaticMethod() === 42)</pre>
+
+<p><font><font>Los campos estáticos privados se agregan al constructor de la clase en el momento de la evaluación de la clase.</font></font></p>
+
+<p><font><font>Existe una restricción de procedencia en los campos estáticos privados. </font><font>Solo la clase que define el campo estático privado puede acceder al campo.</font></font></p>
+
+<p><font><font>Esto puede conducir a un comportamiento inesperado al usar </font></font><strong><code>this</code></strong><font><font>.</font></font></p>
+
+<pre class="brush: js notranslate">class BaseClassWithPrivateStaticField {
+  static #PRIVATE_STATIC_FIELD
+
+  static basePublicStaticMethod() {
+    this.#PRIVATE_STATIC_FIELD = 42
+    return this.#PRIVATE_STATIC_FIELD
+  }
+}
+
+class SubClass extends BaseClassWithPrivateStaticField { }
+
+let error = null
+
+try {
+  SubClass.basePublicStaticMethod()
+} catch(e) { error = e}
+
+console.assert(error instanceof TypeError)
+</pre>
+
+<h3 id="Campos_de_instancia_privados"><font><font>Campos de instancia privados</font></font></h3>
+
+<p><font><font>Los campos de instancia privados se declaran con </font></font><strong><font><font># nombres </font></font></strong><font><font> (pronunciados " </font></font><em><font><font>nombres hash</font></font></em><font><font> "), que son identificadores con el prefijo </font></font><code>#</code><font><font>. </font><font>El </font></font><code>#</code><font><font>es una parte del nombre propio. </font><font>También se utiliza para la declaración y el acceso.</font></font></p>
+
+<p><font><font>La encapsulación es impuesta por el lenguaje. </font><font>Es un error de sintaxis referirse a </font></font><code>#</code><font><font>nombres que están fuera del alcance.</font></font></p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateField {
+  #privateField
+
+  constructor() {
+    this.#privateField = 42
+    this.#randomField = 666 // Syntax error
+  }
+}
+
+const instance = new ClassWithPrivateField()
+instance.#privateField === 42 // Syntax error
+</pre>
+
+<h3 id="Métodos_privados"><font><font>Métodos privados</font></font></h3>
+
+<h4 id="Métodos_estáticos_privados"><font><font>Métodos estáticos privados</font></font></h4>
+
+<p><font><font>Al igual que su equivalente público, los métodos estáticos privados se invocan en la propia clase, no en instancias de la clase. </font><font>Al igual que los campos estáticos privados, solo se puede acceder a ellos desde dentro de la declaración de clase.</font></font></p>
+
+<p><font><font>Los métodos estáticos privados pueden ser funciones generadoras, asíncronas y asíncronas.</font></font></p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateStaticMethod {
+    static #privateStaticMethod() {
+        return 42
+    }
+
+    static publicStaticMethod1() {
+        return ClassWithPrivateStaticMethod.#privateStaticMethod();
+    }
+
+    static publicStaticMethod2() {
+        return this.#privateStaticMethod();
+    }
+}
+
+console.assert(ClassWithPrivateStaticMethod.publicStaticMethod1() === 42);
+console.assert(ClassWithPrivateStaticMethod.publicStaticMethod2() === 42);
+</pre>
+
+<p><font><font>Esto puede conducir a un comportamiento inesperado al usar </font></font><strong><code>this</code></strong><font><font>. </font><font>En el siguiente ejemplo se </font></font><code>this</code><font><font>hace referencia a la </font></font><code>Derived</code><font><font>clase (no a la </font></font><code>Base</code><font><font>clase) cuando intentamos llamar </font></font><code>Derived.publicStaticMethod2()</code><font><font>, y por lo tanto exhibe la misma "restricción de procedencia" que se mencionó anteriormente:</font></font></p>
+
+<pre class="brush: js notranslate">class Base {
+    static #privateStaticMethod() {
+        return 42;
+    }
+    static publicStaticMethod1() {
+        return Base.#privateStaticMethod();
+    }
+    static publicStaticMethod2() {
+        return this.#privateStaticMethod();
+    }
+}
+
+class Derived extends Base {}
+
+console.log(Derived.publicStaticMethod1()); // 42
+console.log(Derived.publicStaticMethod2()); // TypeError
+</pre>
+
+<h4 id="Métodos_de_instancia_privada"><font><font>Métodos de instancia privada</font></font></h4>
+
+<p><font><font>Los métodos de instancia privada son métodos disponibles en instancias de clase cuyo acceso está restringido de la misma manera que los campos de instancia privada.</font></font></p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateMethod {
+  #privateMethod() {
+    return 'hello world'
+  }
+
+  getPrivateMessage() {
+      return this.#privateMethod()
+  }
+}
+
+const instance = new ClassWithPrivateMethod()
+console.log(instance.getPrivateMessage())
+// expected output: "hello worl​d"</pre>
+
+<p><font><font>Los métodos de instancia privada pueden ser funciones generadoras, asíncronas o asíncronas. </font><font>Los getters y setters privados también son posibles:</font></font></p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateAccessor {
+  #message
+
+  get #decoratedMessage() {
+    return `✨${this.#message}✨`
+  }
+  set #decoratedMessage(msg) {
+    this.#message = msg
+  }
+
+  constructor() {
+    this.#decoratedMessage = 'hello world'
+    console.log(this.#decoratedMessage)
+  }
+}
+
+new ClassWithPrivateAccessor();
+// expected output: "✨hello worl​d✨"
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Public and private instance fields', '#prod-FieldDefinition', 'FieldDefinition')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("javascript.classes.private_class_fields")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes/Public_class_fields">Public class fields</a></li>
+ <li><a href="https://rfrn.org/~shu/2018/05/02/the-semantics-of-all-js-class-elements.html">The Semantics of All JS Class Elements</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/classes/public_class_fields/index.html b/files/es/web/javascript/reference/classes/public_class_fields/index.html
new file mode 100644
index 0000000000..2fc2c0b867
--- /dev/null
+++ b/files/es/web/javascript/reference/classes/public_class_fields/index.html
@@ -0,0 +1,387 @@
+---
+title: Class fields
+slug: Web/JavaScript/Reference/Classes/Public_class_fields
+tags:
+  - Clases
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Classes/Public_class_fields
+original_slug: Web/JavaScript/Referencia/Classes/Class_fields
+---
+<div>{{JsSidebar("Classes")}}</div>
+
+<div class="note">Las declaraciones de campos públicos y privados son una <a href="https://github.com/tc39/proposal-class-fields">característica experimental (en estado 3)</a> propuesta por el <a href="https://tc39.github.io/beta/">TC39</a>, el comite de estandares de JavaScript. El soporte y funcionamiento en navegadores es limitado, pero la funcionalidad puede ser usada a través de un paso durante el proceso del build por medio de sistemas como <a href="https://babeljs.io/">Babel</a>. Revise <a href="#Browser_compatibility">compat information</a> mas abajo.</div>
+
+<p>Los campos públicos y estáticos son propieades editables, enumerables, y configurables. A diferencia de su contraparte privada, estos participan en la herencia de prototipo.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">class ClassWithInstanceField {
+  instanceField = 'instance field'
+}
+
+class ClassWithStaticField {
+  static staticField = 'static field'
+}
+
+class ClassWithPublicInstanceMethod {
+  publicMethod() {
+    return 'hello world'
+  }
+}
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Campos_públicos_estáticos">Campos públicos estáticos</h3>
+
+<p>Los campos estáticos públicos son útiles cuando desea que exista un campo solo una vez por clase, no en cada instancia de clase que cree. Esto es útil para cachés, configuración fija o cualquier otro dato que no necesite replicarse en todas las instancias.</p>
+
+<p>Los campos estáticos públicos se declaran utilizando la palabra clave <code>static</code>. Se agregan al constructor de la clase en el momento de la evaluación de la clase utilizando {{jsxref("Global_Objects/Object/defineProperty", "Object.defineProperty()")}}. Se accede nuevamente desde el constructor de la clase.</p>
+
+<pre class="brush: js notranslate">class ClassWithStaticField {
+  static staticField = 'static field';
+}
+
+console.log(ClassWithStaticField.staticField);
+// expected output: "static field"​
+</pre>
+
+<p>Campos sin inicializadores son inicializados como <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">class ClassWithStaticField {
+  static staticField;
+}
+
+console.assert(ClassWithStaticField.hasOwnProperty('staticField'));
+console.log(ClassWithStaticField.staticField);
+// expected output: "undefined"</pre>
+
+<p>Los campos estáticos públicos no se reinicializan en las subclases, pero se puede acceder a ellos a través de la cadena de prototipo.</p>
+
+<pre class="brush: js notranslate">class ClassWithStaticField {
+  static baseStaticField = 'base field';
+}
+
+class SubClassWithStaticField extends ClassWithStaticField {
+  static subStaticField = 'sub class field';
+}
+
+console.log(SubClassWithStaticField.subStaticField);
+// expected output: "sub class field"
+
+console.log(SubClassWithStaticField.baseStaticField);
+// expected output: "base field"</pre>
+
+<p>Cuando se inicializasn campos <code>this</code> se refiere al constuctor de clase. Tambien puede ser referenciado por nombre, y se puede usar <code>super</code> para obtener el constructor de la superclase si lo tiene.</p>
+
+<pre class="brush: js notranslate">class ClassWithStaticField {
+  static baseStaticField = 'base static field';
+  static anotherBaseStaticField = this.baseStaticField;
+
+  static baseStaticMethod() { return 'base static method output'; }
+}
+
+class SubClassWithStaticField extends ClassWithStaticField {
+  static subStaticField = super.baseStaticMethod();
+}
+
+console.log(ClassWithStaticField.anotherBaseStaticField);
+// expected output: "base static field"
+
+console.log(SubClassWithStaticField.subStaticField);
+// expected output: "base static method output"
+</pre>
+
+<h3 id="Campos_de_instancia_públicos">Campos de instancia públicos</h3>
+
+<p>Los campos de instancia públicos existen en cada instancia de la clase que se ha creado. Al declarar un campo publico podemos asegurarnos que dicho campo siempre esta presente, y la definicion de la clase esta auto-documentada.</p>
+
+<p>Los campos de instancia públicos son agregados with <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a> ya sea a la hora de ser construido en la clase base (antes que el metodo constructor corra), o justo despues que  <code>super()</code> returne en una subclase.</p>
+
+<pre class="brush: js notranslate">class ClassWithInstanceField {
+  instanceField = 'instance field';
+}
+
+const instance = new ClassWithInstanceField();
+console.log(instance.instanceField);
+// expected output: "instance field"</pre>
+
+<p>Campos sin inicializadores son inicilizados en <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">class ClassWithInstanceField {
+  instanceField;
+}
+
+const instance = new ClassWithInstanceField();
+console.assert(instance.hasOwnProperty('instanceField'));
+console.log(instance.instanceField);
+// expected output: "undefined"</pre>
+
+<p>Al igual que las propiedades, los nombres de campos pueden ser calculados (computed)</p>
+
+<pre class="brush: js notranslate">const PREFIX = 'prefix';
+
+class ClassWithComputedFieldName {
+    [`${PREFIX}Field`] = 'prefixed field';
+}
+
+const instance = new ClassWithComputedFieldName();
+console.log(instance.prefixField);
+// expected output: "prefixed field"</pre>
+
+<p>Cuando se inicializan campos <code>this</code> se refiere a la instancia de clase que esta siendo construida. Al igual que con los metodos publicos de instancia, si usted esta en una subclase puede acceder a al prototypo de la superclase usando <code>super</code>.</p>
+
+<pre class="brush: js notranslate">class ClassWithInstanceField {
+  baseInstanceField = 'base field';
+  anotherBaseInstanceField = this.baseInstanceField;
+  baseInstanceMethod() { return 'base method output'; }
+}
+
+class SubClassWithInstanceField extends ClassWithInstanceField {
+  subInstanceField = super.baseInstanceMethod();
+}
+
+const base = new ClassWithInstanceField();
+const sub = new SubClassWithInstanceField();
+
+console.log(base.anotherBaseInstanceField);
+// expected output: "base field"
+
+console.log(sub.subInstanceField);
+// expected output: "base method output"</pre>
+
+<h3 id="Métodos_públicos">Métodos públicos</h3>
+
+<h4 id="Métodos_públicos_estáticos">Métodos públicos estáticos</h4>
+
+<p>La palabra reservada <code><strong>static</strong></code> define un metodo estático para una clase. Los métodos estáticos no son llamads usando una instancia de la clase. En lugar de eso son llamados sobre la clase como tal. Estos metodos estáticos son frecuentemente funciones utilitarias que permiten por ejemplo la creación y clonacion de objetos.</p>
+
+<pre class="brush: js notranslate">class ClassWithStaticMethod {
+  static staticMethod() {
+    return 'static method has been called.';
+  }
+}
+
+console.log(ClassWithStaticMethod.staticMethod());
+// expected output: "static method has been called."</pre>
+
+<p>Los métodos estáticos son agregados al constructor de la clase usando <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a> duranten el evaluación de la clase. Estos metodos son "escribibles" (writable), no-enumerables y configurables.</p>
+
+<h4 id="Métodos_públicos_de_instancia">Métodos públicos de instancia</h4>
+
+<p>Como su nombre lo indica, los métodos publicos de instancia son metodos que estan disponibles para cualquier instancia de una clase.</p>
+
+<pre class="brush: js notranslate">class ClassWithPublicInstanceMethod {
+  publicMethod() {
+    return 'hello world';
+  }
+}
+
+const instance = new ClassWithPublicInstanceMethod();
+console.log(instance.publicMethod());
+// expected output: "hello worl​d"</pre>
+
+<p>Los métodos públicos de instancia son agregeados al prototipo de clase durante la evaluacón de la clase usando <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a>. Estos metodos son "escribibles" (writable), no-enumerables y configurables.</p>
+
+<p>Usted puede usar un generador, async y funciones generadoras asincronas</p>
+
+<pre class="brush: js notranslate">class ClassWithFancyMethods {
+  *generatorMethod() { }
+  async asyncMethod() { }
+  async *asyncGeneratorMethod() { }
+}</pre>
+
+<p>Dentro de un metodo de instancia, <code>this</code> se referie a la instancia como tal. En las subclases, <code>super</code> le permite acceder el prototipo de la superclase, permitiendo así llamar métodos de la superclase.</p>
+
+<pre class="brush: js notranslate">class BaseClass {
+  msg = 'hello world';
+  basePublicMethod() {
+    return this.msg;
+  }
+}
+
+class SubClass extends BaseClass {
+  subPublicMethod() {
+    return super.basePublicMethod();
+  }
+}
+
+const instance = new SubClass();
+console.log(instance.subPublicMethod());
+// expected output: "hello worl​d"
+</pre>
+
+<p>Existen metodos especiales llamados "Getters" y "Setters" que se vinculan a una propiedad de una clase, y que son ejecutados o llamados cuando esa propiedad es consultada o moditficada. Puede usar las palabras reservaddas <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get">get</a> y <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set">set</a> para declarar una instancia pública de "getter" or "setter". [N.T. preferí decir Getter/Setter que decir Consultadores/Mofificadores]</p>
+
+<pre class="brush: js notranslate">class ClassWithGetSet {
+  #msg = 'hello world';
+  get msg() {
+    return this.#msg;
+  }
+  set msg(x) {
+    this.#msg = `hello ${x}`;
+  }
+}
+
+const instance = new ClassWithGetSet();
+console.log(instance.msg);
+// expected output: "hello worl​d"
+
+instance.msg = 'cake';
+console.log(instance.msg);
+// expected output: "hello cake"
+</pre>
+
+<h2 id="Campos_privados">Campos privados</h2>
+
+<h3 id="Campos_privados_estáticos">Campos privados estáticos</h3>
+
+<p>Private fields are accessible on the class constructor from inside the class declaration itself.</p>
+
+<p>The limitation of static variables being called by only static methods still holds.</p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateStaticField {
+  static #PRIVATE_STATIC_FIELD;
+
+  static publicStaticMethod() {
+    ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD = 42;
+    return ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD;
+  }
+}
+
+assert(ClassWithPrivateStaticField.publicStaticMethod() === 42);</pre>
+
+<p>Private static fields are added to the class constructor at class evaluation time.</p>
+
+<p>There is a provenance restriction on private static fields. Only the class which defines the private static field can access the field. This can lead to unexpected behaviour when using <strong><code>this</code></strong></p>
+
+<pre class="brush: js notranslate">class BaseClassWithPrivateStaticField {
+  static #PRIVATE_STATIC_FIELD;
+
+  static basePublicStaticMethod() {
+    this.#PRIVATE_STATIC_FIELD = 42;
+    return this.#PRIVATE_STATIC_FIELD;
+  }
+}
+
+class SubClass extends BaseClassWithPrivateStaticField { }
+
+assertThrows(() =&gt; SubClass.basePublicStaticMethod(), TypeError);
+</pre>
+
+<h3 id="Campos_privados_de_instancia">Campos privados de instancia</h3>
+
+<p>Private instance fields are declared with <strong># names </strong>( pronounced "hash names"), which are identifiers prefixed with #. The # is a part of the name itself and is used for declaration and accessing as well.</p>
+
+<p>The encapsulation is enforced by the language. It is a syntax error to refer to # names not in scope.</p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateField {
+  #privateField;
+
+  constructor() {
+    this.#privateField = 42;
+    this.#randomField = 666; # Syntax error
+  }
+}
+
+const instance = new ClassWithPrivateField();
+instance.#privateField === 42; // Syntax error
+</pre>
+
+<h2 id="Métodos_privados">Métodos privados</h2>
+
+<h3 id="Métodos_privados_estáticos">Métodos privados estáticos</h3>
+
+<p>Like their public equivalent, private static methods are called on the class, not instances of the class. Like private static fields, they are only accessible from inside the class declaration.</p>
+
+<p>Private static methods may be generator, async and async generator functions.</p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateStaticMethod {
+    static #privateStaticMethod() {
+        return 42;
+    }
+
+    static publicStaticMethod() {
+        return ClassWithPrivateStaticMethod.#privateStaticMethod();
+    }
+}
+
+assert(ClassWithPrivateStaticField.publicStaticMethod() === 42);
+</pre>
+
+<h3 id="Métodos_privados_de_instancia">Métodos privados de instancia</h3>
+
+<p>Private instance methods are methods available on class instances whose access is restricted in the same manner as private instance fields.</p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateMethod {
+  #privateMethod() {
+    return 'hello world';
+  }
+
+  getPrivateMessage() {
+      return #privateMethod();
+  }
+}
+
+const instance = new ClassWithPrivateMethod();
+console.log(instance.getPrivateMessage());
+// expected output: "hello worl​d"</pre>
+
+<p>Private instance methods may be generator, async or async generator functions. Private getters and setters are also possible:</p>
+
+<pre class="brush: js notranslate">class ClassWithPrivateAccessor {
+  #message;
+
+  get #decoratedMessage() {
+    return `✨${this.#message}✨`;
+  }
+  set #decoratedMessage(msg) {
+    this.#message = msg;
+  }
+
+  constructor() {
+    this.#decoratedMessage = 'hello world';
+    console.log(this.#decoratedMessage);
+  }
+}
+
+new ClassWithPrivateAccessor();
+// expected output: "✨hello worl​d✨"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td><a href="https://tc39.es/proposal-class-fields/#prod-FieldDefinition">FieldDefinition production</a></td>
+   <td>Stage 3</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<h3 id="Campos_públicos_de_clse">Campos públicos de clse</h3>
+
+
+
+<p>{{Compat("javascript.classes.public_class_fields")}}</p>
+
+<h3 id="Campos_privados_de_clase">Campos privados de clase</h3>
+
+<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
+
+<p>{{Compat("javascript.classes.private_class_fields")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://rfrn.org/~shu/2018/05/02/the-semantics-of-all-js-class-elements.html">The Semantics of All JS Class Elements</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/classes/static/index.html b/files/es/web/javascript/reference/classes/static/index.html
new file mode 100644
index 0000000000..4cacdb6be1
--- /dev/null
+++ b/files/es/web/javascript/reference/classes/static/index.html
@@ -0,0 +1,119 @@
+---
+title: static
+slug: Web/JavaScript/Reference/Classes/static
+translation_of: Web/JavaScript/Reference/Classes/static
+original_slug: Web/JavaScript/Referencia/Classes/static
+---
+<div>{{jsSidebar("Classes")}}</div>
+
+<p>La palabra clave <strong>static</strong> define un método estático para una clase.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">static methodName() { ... }</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los métodos estáticos son llamados sin instanciar su clase. Son habitualmente utilizados para crear funciones para una aplicación.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente ejemplo demuestra varias cosas. Una de ellas es cómo un método estático es implementado en una clase, otra es que una clase con un miembro estático puede ser sub-claseada. Finalmente demuestra cómo un método estático puede (y cómo no) ser llamado.</p>
+
+<pre class="brush: js">class Tripple {
+  static tripple(n) {
+    n = n || 1;
+    return n * 3;
+  }
+}
+
+class BiggerTripple extends Tripple {
+  static tripple(n) {
+    return super.tripple(n) * super.tripple(n);
+  }
+}
+
+console.log(Tripple.tripple());
+console.log(Tripple.tripple(6));
+console.log(BiggerTripple.tripple(3));
+var tp = new Tripple();
+console.log(tp.tripple()); //Logs 'tp.tripple is not a function'.</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-class-definitions', 'Class definitions')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>Available in the Nightly channel only (since February 2015)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>Available in the Nightly channel only (since February 2015)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/class"><code>class</code> expression</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/class"><code>class</code> declaration</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Classes</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/deprecated_and_obsolete_features/index.html b/files/es/web/javascript/reference/deprecated_and_obsolete_features/index.html
new file mode 100644
index 0000000000..2694ee76bd
--- /dev/null
+++ b/files/es/web/javascript/reference/deprecated_and_obsolete_features/index.html
@@ -0,0 +1,293 @@
+---
+title: Características en desuso y obsoletas
+slug: Web/JavaScript/Reference/Deprecated_and_obsolete_features
+tags:
+  - Deprecated
+  - JavaScript
+  - Obsolete
+translation_of: Web/JavaScript/Reference/Deprecated_and_obsolete_features
+original_slug: Web/JavaScript/Referencia/Características_Desaprobadas
+---
+<p>{{JsSidebar("More")}}</p>
+
+
+<p>Esta página enumera las características de JavaScript que están en desuso (es decir, todavía están disponibles pero se planea eliminarlas) y obsoletas (es decir, que ya no se pueden usar).</p>
+
+<h2 id="Características_en_desuso">Características en desuso</h2>
+
+<p>Estas características desaconsejadas aún se pueden usar, pero se deben usar con precaución porque se espera que se eliminen por completo en el futuro. Deberías trabajar para sustituirlas con las versiones recomendadas en tu código.</p>
+
+<h3 id="Propiedades_de_RegExp">Propiedades de RegExp</h3>
+
+<p>las siguientes propiedades están en desuso. Esto no afecta su uso en el {{jsxref("String.replace", "reemplazo de cadenas", "", 1)}}:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Propiedad</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.n", "$1-$9")}}</td>
+   <td>
+    <p>Coincidencias de subcadenas entre paréntesis, si las hay.<br>
+     <strong>Precaución:</strong> El uso de estas propiedades puede generar problemas, ya que las extensiones del navegador pueden modificarlas. ¡Evítalas!</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.input", "$_")}}</td>
+   <td>Consulta <code>entrada</code>.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.multiline", "$*")}}</td>
+   <td>Consulta <code>multiline</code>.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.lastMatch", "$&amp;")}}</td>
+   <td>Consulta <code>lastMatch</code>.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.lastParen", "$+")}}</td>
+   <td>Consulta <code>lastParen</code>.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.leftContext", "$`")}}</td>
+   <td>Consulta <code>leftContext</code>.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.rightContext", "$'")}}</td>
+   <td>Consulta <code>rightContext</code>.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.input", "input")}}</td>
+   <td>La cadena contra la que se compara una expresión regular.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.lastMatch", "lastMatch")}}</td>
+   <td>Los últimos caracteres coincidentes.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.lastParen", "lastParen")}}</td>
+   <td>La última coincidencia de subcadena entre paréntesis, si la hubiera.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.leftContext", "leftContext")}}</td>
+   <td>La subcadena que precede a la coincidencia más reciente.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.rightContext", "rightContext")}}</td>
+   <td>La subcadena que sigue a la coincidencia más reciente.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Las siguientes ahora son propiedades de instancias de <code>RegExp</code>, ya no del objeto <code>RegExp</code>:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Propiedad</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.global", "global")}}</td>
+   <td>Si se debe probar o no la expresión regular con todas las posibles coincidencias en una cadena, o solo con la primera.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.ignoreCase", "ignoreCase")}}</td>
+   <td>Si se deben o no ignorar las mayúsculas/minúsculas al intentar una coincidencia en una cadena.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.lastIndex", "lastIndex")}}</td>
+   <td>El índice en el que comenzará la siguiente coincidencia.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.multiline", "multiline")}}</td>
+   <td>Si buscar o no en cadenas de varias líneas.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("RegExp.source", "source")}}</td>
+   <td>El texto del patrón.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Métodos_RegExp">Métodos RegExp</h3>
+
+<ul>
+ <li>El método {{jsxref("RegExp.compile", "compile()")}} está en desuso.</li>
+ <li>El método <code>valueOf</code> ya no está especializado para <code>RegExp</code>. Usa {{jsxref ("Object.valueOf()")}}.</li>
+</ul>
+
+<h3 id="Propiedades_de_función">Propiedades de función</h3>
+
+<ul>
+ <li>Las propiedades {{jsxref("Global_Objects Function/caller", "caller")}} y {{jsxref("Global_Objects/Function/argument", "argument")}} están obsoletas porque filtran la función llamadora. En lugar de la propiedad arguments, debes usar el objeto {{jsxref("Functions/arguments", "arguments")}} dentro de los cierres de funciones.</li>
+</ul>
+
+<h3 id="Generador_heredado">Generador heredado</h3>
+
+<ul>
+ <li>La {{jsxref("Statements/Legacy_generator_function", "Declaración de función del generador heredado")}} y {{jsxref("Operators/Legacy_generator_function", "Expresión de función del generador heredado")}} están en desuso. En su lugar usa {{jsxref("Statements/function*", "declaraciones function*")}} y {{jsxref ("Operators/function *", "expresión function*")}}.</li>
+ <li>{{jsxref("Operators/Array_comprehensions", "JS1.7/JS1.8 Array comprehension", "#Differences_to_the_older_JS1.7.2FJS1.8_comprehensions")}} y {{jsxref("Operators/Generator_comprehensions", "JS1.7/JS1.8 Generator comprehension", "#Differences_to_the_older_JS1.7.2FJS1.8_comprehensions")}} están en desuso.</li>
+</ul>
+
+<h3 id="Iterador">Iterador</h3>
+
+<ul>
+ <li>{{jsxref("Global_Objects/StopIteration", "StopIteration")}} está en desuso.</li>
+ <li>{{jsxref("Global_Objects/Iterator", "Iterator")}} está en desuso.</li>
+</ul>
+
+<h3 id="Métodos_de_objeto">Métodos de objeto</h3>
+
+<ul>
+ <li>{{jsxref("Object.watch", "watch")}} y {{jsxref("Object.unwatch", "unwatch")}} están en desuso. En su lugar usa {{jsxref("Proxy")}}.</li>
+ <li><code>__iterator__</code> está en desuso.</li>
+ <li>{{jsxref("Object.noSuchMethod", "__noSuchMethod__")}} está en desuso. En su lugar usa {{jsxref("Proxy")}}.</li>
+</ul>
+
+<h3 id="Métodos_de_Date">Métodos de <code>Date</code></h3>
+
+<ul>
+ <li>{{jsxref("Global_Objects/Date/getYear", "getYear")}} y {{jsxref("Global_Objects/Date/setYear", "setYear")}} se ven afectados por el problema del año 2000 y se han subsumido por {{jsxref("Global_Objects/Date/getFullYear", "getFullYear")}} y {{jsxref("Global_Objects/Date/setFullYear", "setFullYear")}}.</li>
+ <li>En nuevo código, debes usar {{jsxref("Global_Objects/Date/toISOString", "toISOString")}} en lugar del método en desuso {{jsxref("Global_Objects/Date/toGMTString", "toGMTString")}}.</li>
+ <li>{{jsxref("Global_Objects/Date/toLocaleFormat", "toLocaleFormat")}} está en desuso.</li>
+</ul>
+
+<h3 id="Funciones">Funciones</h3>
+
+<ul>
+ <li>Las {{jsxref ("Operadores/Expression_closures", "expresiones closure", "", 1)}} están en desuso. En su lugar, utiliza {{jsxref("Operators/function", "funciones")}} o {{jsxref("Functions/Arrow_functions", "funciones de flecha", "", 1)}} normales.</li>
+</ul>
+
+<h3 id="Proxy">Proxy</h3>
+
+<ul>
+ <li><a href="/es/docs/Archive/Web/Old_Proxy_API">Proxy.create</a> y <a href="/es/docs/Archive/Web/Old_Proxy_API">Proxy.createFunction</a> están en desuso. En su lugar usa {{jsxref("Proxy")}}.</li>
+ <li>Las siguientes trampas están obsoletas:
+  <ul>
+   <li><code>hasOwn</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=980565">bug 980565</a>, Firefox 33).</li>
+   <li><code>getEnumerablePropertyKeys</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=783829">bug 783829</a>, Firefox 37)</li>
+   <li><code>getOwnPropertyNames</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1007334">bug 1007334</a>, Firefox 33)</li>
+   <li><code>keys</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1007334">bug 1007334</a>, Firefox 33)</li>
+  </ul>
+ </li>
+</ul>
+
+<h3 id="Secuencias_de_escape">Secuencias de escape</h3>
+
+<ul>
+ <li>Las secuencias de escape octales (\ seguida de uno, dos o tres dígitos octales) están en desuso en los literales de cadenas y expresiones regulares.</li>
+ <li>Las funciones {{jsxref("Global_Objects/escape", "escape")}} y {{jsxref("Global_Objects/unescape", "unescape")}} están en desuso. Usa {{jsxref("Global_Objects/encodeURI", "encodeURI")}}, {{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent")}}, {{jsxref("Global_Objects/decodeURI", "decodeURI")}} o {{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent")}} para codificar y decodificar secuencias de escape para caracteres especiales.</li>
+</ul>
+
+<h3 id="Métodos_de_cadena">Métodos de cadena</h3>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/tag/HTML%20wrapper%20methods">Métodos de envoltura HTML</a> tal como {{jsxref("String.prototype.fontsize")}} y {{jsxref("String.prototype.big")}}.</li>
+ <li>{{jsxref("String.prototype.quote")}} se eliminó desde Firefox 37.</li>
+ <li>el parámetro no estándar <code>flags</code> en {{jsxref("String.prototype.search")}}, {{jsxref("String.prototype.match")}} y {{jsxref("String.prototype.replace ")}} están en desuso.</li>
+ <li>{{jsxref("String.prototype.substr")}} probablemente no se eliminará pronto, pero está definido en el <a href="https://www.ecma-international.org/ecma-262/9.0/index.html#sec-string.prototype.substr" rel="noopener">Anexo B</a> del estándar ECMA-262, cuya <a href="https://www.ecma-international.org/ecma-262/9.0/index.html#sec-additional-ecmascript-features-for-web-browsers">introducción</a> dice: "... Los programadores no deben usar o asumir la existencia de estas características y comportamientos al escribir un nuevo código ECMAScript. ..."</li>
+</ul>
+
+<h2 id="Características_obsoletas">Características obsoletas</h2>
+
+<p>Estas características obsoletas se han eliminado por completo de JavaScript y ya no se pueden utilizar a partir de la versión indicada de JavaScript.</p>
+
+<h3 id="Objeto">Objeto</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Propiedad</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>{{jsxref("Global_Objects/Object/count", "__count__")}}</td>
+   <td>Devuelve el número de propiedades enumerables directamente en un objeto definido por el usuario.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Global_Objects/Object/Parent", "__parent__")}}</td>
+   <td>Apunta al contexto de un objeto.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Global_Objects/Object/eval", "Object.prototype.eval()")}}</td>
+   <td>Evalúa una cadena de código JavaScript en el contexto del objeto especificado.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Object.observe()")}}</td>
+   <td>Observar de forma asincrónica los cambios en un objeto.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Object.unobserve()")}}</td>
+   <td>Elimina observadores.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Object.getNotifier()")}}</td>
+   <td>Crea un objeto que permite desencadenar sintéticamente un cambio.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Función">Función</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Propiedad</th>
+   <th>Descripción</th>
+  </tr>
+  <tr>
+   <td>{{jsxref("Global_Objects/Function/arity", "arity")}}</td>
+   <td>Número de argumentos formales.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Array">Array</h3>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Propiedad</td>
+   <td>Descripción</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Array.observe()")}}</td>
+   <td>Observación asincrónica de cambios en los arreglos.</td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Array.unobserve()")}}</td>
+   <td>Elimina observadores.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Número">Número</h3>
+
+<ul>
+ <li>{{jsxref("Number.toInteger()")}}</li>
+</ul>
+
+<h3 id="ParallelArray">ParallelArray</h3>
+
+<ul>
+ <li>{{jsxref("ParallelArray")}}</li>
+</ul>
+
+<h3 id="Declaraciones">Declaraciones</h3>
+
+<ul>
+ <li>{{jsxref("Statements/for_each...in", "for each...in")}} está obsoleta. En su lugar utiliza {{jsxref("Statements/for...of", "for...of")}}.</li>
+ <li>La desestructuración {{jsxref("Statements/for...in", "for...in")}} está obsoleta. En su lugar utiliza {{jsxref("Statements/for...of", "for...of")}}.</li>
+ <li>los bloques let y la expresiones let están obsoletas.</li>
+</ul>
+
+<h3 id="E4X">E4X</h3>
+
+<p>Consulta <a href="/es/docs/Archive/Web/E4X">E4X</a> para obtener más información.</p>
+
+<h3 id="Variables_nítidas">Variables nítidas</h3>
+
+<p>Consulta <a href="/es/docs/Archive/Web/Sharp_variables_in_JavaScript">Variables nítidas en JavaScript</a> para obtener más información.</p>
diff --git a/files/es/web/javascript/reference/deprecated_and_obsolete_features/the_legacy_iterator_protocol/index.html b/files/es/web/javascript/reference/deprecated_and_obsolete_features/the_legacy_iterator_protocol/index.html
new file mode 100644
index 0000000000..007decfe89
--- /dev/null
+++ b/files/es/web/javascript/reference/deprecated_and_obsolete_features/the_legacy_iterator_protocol/index.html
@@ -0,0 +1,74 @@
+---
+title: The legacy Iterator protocol
+slug: >-
+  Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol
+translation_of: >-
+  Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol
+original_slug: >-
+  Web/JavaScript/Referencia/Características_Desaprobadas/The_legacy_Iterator_protocol
+---
+<div>{{jsSidebar("More")}}</div>
+
+<div class="warning"><strong>Non-standard.</strong> The legacy iterator protocol is a SpiderMonkey-specific feature, and will be removed at some point. For future-facing usages, consider using <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of" title="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for..of</a> loops and the <a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">iterator protocol</a>.</div>
+
+<h2 id="The_deprecated_Firefox-only_iterator_protocol">The deprecated Firefox-only iterator protocol</h2>
+
+<p>Firefox, prior to version 26 implemented another iterator protocol that is similar to the standard <a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">ES6 Iterator protocol</a>.</p>
+
+<p>An object is an legacy iterator when it implements a <code>next()</code> method with the following semantics, and throws {{jsxref("Global_Objects/StopIteration", "StopIteration")}} at the end of iteration.</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Property</th>
+   <th scope="col">Value</th>
+  </tr>
+  <tr>
+   <td><code>next</code></td>
+   <td>A zero arguments function that returns an value.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Difference_between_legacy_and_ES6_iterator_protocols">Difference between legacy and ES6 iterator protocols</h3>
+
+<ul>
+ <li>The value was returned directly as a return value of calls to <code>next</code>, instead of the <code>value</code> property of a placeholder object</li>
+ <li>Iteration termination was expressed by throwing a {{jsxref("Global_Objects/StopIteration", "StopIteration")}} object.</li>
+</ul>
+
+<h3 id="Simple_example_with_the_old_protocol">Simple example with the old protocol</h3>
+
+<pre class="brush: js">function makeIterator(array){
+    var nextIndex = 0;
+
+    return {
+       next: function(){
+           if(nextIndex &lt; array.length){
+               return array[nextIndex++];
+           else
+               throw new StopIteration();
+       }
+    }
+}
+
+var it = makeIterator(['yo', 'ya']);
+
+console.log(it.next()); // 'yo'
+console.log(it.next()); // 'ya'
+try{
+    console.log(it.next());
+}
+catch(e){
+    if(e instanceof StopIteration){
+         // iteration over
+    }
+}
+</pre>
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iteradores y generadores</a></li>
+ <li>Más More <a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features">características obsoletas</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/errors/bad_regexp_flag/index.html b/files/es/web/javascript/reference/errors/bad_regexp_flag/index.html
new file mode 100644
index 0000000000..a9e3393cf5
--- /dev/null
+++ b/files/es/web/javascript/reference/errors/bad_regexp_flag/index.html
@@ -0,0 +1,114 @@
+---
+title: 'SyntaxError: indicador de expresión regular no válido "x"'
+slug: Web/JavaScript/Reference/Errors/Bad_regexp_flag
+tags:
+  - Error
+  - Error de sintaxis
+  - JavaScript
+  - SyntaxError
+translation_of: Web/JavaScript/Reference/Errors/Bad_regexp_flag
+original_slug: Web/JavaScript/Reference/Errors/Indicador_regexp_no-val
+---
+<div>{{jsSidebar("Errors", "Errores")}}</div>
+
+<p>La excepción de JavaScript "indicador de expresión regular no válido" se produce cuando las indicadores, definidas después de la segunda barra en la expresión regular literal, no son de <code>g</code>, <code>i</code>, <code>m</code>, <code>s</code>, <code>u</code> o <code>y</code>.</p>
+
+<h2 id="Mensaje">Mensaje</h2>
+
+<pre class="syntaxbox notranslate">SyntaxError: error de sintaxis en la expresión regular (Edge)
+SyntaxError: marca de expresión regular no válida "x" (Firefox)
+SyntaxError: indicadores de expresión regular no válidos (Chrome)
+</pre>
+
+<h2 id="Tipo_Error">Tipo <code>Error</code></h2>
+
+<p>{{jsxref("SyntaxError")}}</p>
+
+<h2 id="¿Qué_salió_mal">¿Qué salió mal?</h2>
+
+<p>Hay indicadores de expresión regular no válidos en el código. En una expresión regular literal, que consiste en un patrón encerrado entre barras, los indicadores se definen después de la segunda barra. También se pueden definir en la función constructora del objeto {{jsxref("RegExp")}} (segundo parámetro). Los indicadores de expresión regular se pueden usar por separado o juntos en cualquier orden, pero solo hay seis de ellos en ECMAScript.</p>
+
+<p>Para incluir una bandera con la expresión regular, usa esta sintaxis:</p>
+
+<pre class="brush: js notranslate">var re = /patrón/indicadores;
+</pre>
+
+<p>o</p>
+
+<pre class="brush: js notranslate">var re = new RegExp('patrón', 'indicadores');</pre>
+
+<table class="standard-table">
+ <caption>Indicadores de expresión regular</caption>
+ <thead>
+  <tr>
+   <th scope="col">Bandera</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>g</code></td>
+   <td>Búsqueda global.</td>
+  </tr>
+  <tr>
+   <td>i</td>
+   <td>Búsqueda que no distingue entre mayúsculas y minúsculas.</td>
+  </tr>
+  <tr>
+   <td>m</td>
+   <td>Búsqueda multilínea.</td>
+  </tr>
+  <tr>
+   <td>s</td>
+   <td>Permite que el punto (<code>.</code>) coincida con las nuevas líneas (agregado en ECMAScript 2018)</td>
+  </tr>
+  <tr>
+   <td>u</td>
+   <td>Unicode; trata el patrón como una secuencia de puntos de código Unicode</td>
+  </tr>
+  <tr>
+   <td>y</td>
+   <td>Realiza una búsqueda "pegajosa" que coincida a partir de la posición actual en la cadena de destino. Consulta {{jsxref("RegExp.sticky", "sticky")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Solo hay seis indicadores de expresión regular válidos.</p>
+
+<pre class="brush: js example-bad notranslate">/foo/bar;
+
+// SyntaxError: indicador de expresión regular no válido "b"
+</pre>
+
+<p>¿Tenías la intención de crear una expresión regular? Una expresión que contiene dos barras se interpreta como una expresión regular literal.</p>
+
+<pre class="brush: js example-bad notranslate">let obj = {
+  url: /docs/Web
+};
+
+// SyntaxError: indicador de expresión regular no válido "W"
+</pre>
+
+<p>¿O pretendías crear una cadena en su lugar? Agrega comillas simples o dobles para crear una cadena literal.</p>
+
+<pre class="brush: js example-good notranslate">let obj = {
+  url: '/docs/Web'
+};</pre>
+
+<h3 id="Indicadores_de_expresión_regular_válidos">Indicadores de expresión regular válidos</h3>
+
+<p>Consulta la tabla anterior para ver las seis marcas de expresiones regulares válidas que están permitidas en JavaScript.</p>
+
+<pre class="brush: js example-good notranslate">/foo/g;
+/foo/gims;
+/foo/uy;
+</pre>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}}</li>
+ <li><a href="http://xregexp.com/flags/">Indicadores de RegEx</a> – biblioteca de expresiones regulares que proporciona cuatro nuevos indicadores (<code>n</code>, <code>s</code>, <code>x</code>, <code>A</code>)</li>
+</ul>
diff --git a/files/es/web/javascript/reference/errors/caracter_ilegal/index.html b/files/es/web/javascript/reference/errors/caracter_ilegal/index.html
deleted file mode 100644
index cc9422a21d..0000000000
--- a/files/es/web/javascript/reference/errors/caracter_ilegal/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: 'ErrorDeSintaxis: Caracter ilegal'
-slug: Web/JavaScript/Reference/Errors/caracter_ilegal
-tags:
-  - Error
-  - Error de sintaxis
-  - JavaScript
-  - SyntaxError
-  - errores
-translation_of: Web/JavaScript/Reference/Errors/Illegal_character
----
-<div>{{jsSidebar("Errors")}}</div>
-
-<h2 id="Mensaje">Mensaje</h2>
-
-<pre class="syntaxbox">SyntaxError: illegal character (Firefox)
-SyntaxError: Invalid or unexpected token (Chrome)</pre>
-
-<pre class="syntaxbox">ErrorDeSintasix: Carácter ilegal (Firefox)
-ErrorDeSintasix: Componente léxico inválido o inesperado (Chrome)
-</pre>
-
-<h2 id="Tipo_de_error">Tipo de error</h2>
-
-<p>{{jsxref("SyntaxError")}}  {{jsxref("ErrorDeSintaxis")}}</p>
-
-<h2 id="¿Qué_salió_mal">¿Qué salió mal?</h2>
-
-<p>Hay un componente léxico inválido o inesperado que no pertenece a su posición en el código. Utilice un editor que soporte el resaltado de sintaxis y que revise cuidadosamente su código contra discrepancias como un signo menos (<code> - </code>) contra un guion (<code> – </code>) o comillas simples (<code> " </code>) contra comillas no estándar (<code> “ </code>).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Caracteres_no_coincidentes">Caracteres no coincidentes</h3>
-
-<p>Algunos caracteres parecen iguales, pero hará que el analizador falle al interpretar su código.</p>
-
-<pre class="brush: js example-bad">“Esto parece una cadena de caracteres”;
-<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
-// ErrorDeSintaxis: Carácter ilegal
-
-42 – 13;
-<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
-// ErrorDeSintaxis: Carácter ilegal
-</pre>
-
-<p>Esto debería funcionar:</p>
-
-<pre class="brush: js example-good">"Esto en realidad es una cadena de caracteres";
-
-42 - 13;
-</pre>
-
-<h3 id="Caracteres_olvidados">Caracteres olvidados</h3>
-
-<p>Es fácil olvidar caracteres aquí o allí.</p>
-
-<pre class="brush: js example-bad">var colors = ['#000', #333', '#666'];
-<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
-// ErrorDeSintaxis: Carácter ilegal
-</pre>
-
-<p>Agregue la comilla olvidada para <code><strong>'</strong>#333'</code>.</p>
-
-<pre class="brush: js example-good">var colors = ['#000', '#333', '#666'];</pre>
-
-<h3 id="Caracteres_escondidos">Caracteres escondidos</h3>
-
-<p>Cuando copia y pega un código de una fuente externa, puede haber caracteres inválidos. ¡Cuidado!</p>
-
-<pre class="brush: js example-bad">var foo = 'bar';​
-<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
-// ErrorDeSintaxis: Carácter ilegal
-</pre>
-
-<p>Al inspeccionar este código en un editor como Vim, puede ver que en realidad hay un carácter de <a href="https://en.wikipedia.org/wiki/Zero-width_space">espacio de ancho cero (ZWSP) (U+200B)</a>.</p>
-
-<pre class="brush: js">var foo = 'bar';​&lt;200b&gt;</pre>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Gramática léxica</a></li>
-</ul>
diff --git a/files/es/web/javascript/reference/errors/falta_puntoycoma_antes_de_declaracion/index.html b/files/es/web/javascript/reference/errors/falta_puntoycoma_antes_de_declaracion/index.html
deleted file mode 100644
index c03cb15dd2..0000000000
--- a/files/es/web/javascript/reference/errors/falta_puntoycoma_antes_de_declaracion/index.html
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: 'ErrordeSintaxis: Punto y coma ; faltante antes de la declaracion'
-slug: Web/JavaScript/Reference/Errors/Falta_puntoycoma_antes_de_declaracion
-tags:
-  - JavaScript
-  - errores
-  - errorsintaxis
-  - puntoycoma
-translation_of: Web/JavaScript/Reference/Errors/Missing_semicolon_before_statement
----
-<div>{{jsSidebar("Errores")}}</div>
-
-<h2 id="Mensaje">Mensaje</h2>
-
-<pre class="syntaxbox">Error de Sintaxis: Punto y coma ; faltante antes de la declaración
-</pre>
-
-<h2 id="Tipo_de_Error">Tipo de Error</h2>
-
-<p>{{jsxref("SyntaxError")}}.</p>
-
-<h2 id="¿Qué_salio_mal">¿Qué salio mal?</h2>
-
-<p>Hay un punto y coma (<code>;</code>) faltando en alguna parte. Las declaraciones Javascript deben terminar con punto y coma. Algunas de ellas son afectadas por la inserción automática<a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#Automatic_semicolon_insertion"> (ASI)</a>, pero en este caso necesitas colocar un punto y coma, de esta forma Javascript puede analizar el código fuente de forma correcta.</p>
-
-<p>Sin embargo, algunas veces, este error es solo una consecuencia de otro error, como no separar las cadenas de texto correctamente, o usar <em>var</em> incorrectamente. Tal vez tengas muchos paréntesis en algún lugar. Revisa cuidadosamente la sintaxis cuando este error es lanzado.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Cadenas_de_texto_(strings)_sin_terminar">Cadenas de texto (strings) sin terminar</h3>
-
-<p>Este error puede pasar fácilmente cuando no se colocan las comillas correctamente y el motor de JavaScript esta esperando el final de la cadena. por ejemplo:</p>
-
-<pre class="brush: js example-bad">var foo = 'El bar de Tom's';
-// Error de Sintaxis: Punto y coma ; faltante antes de la declaración</pre>
-
-<p>En este caso se pueden usar comillas dobles para escapar del apóstrofe:</p>
-
-<pre class="brush: js example-good">var foo = "El bar de Tom's";
-var foo = 'El bar de Tom\'s';
-</pre>
-
-<div class="note">
-<p>Nota: Este error suele pasar frecuentemene con cadenas del idioma Inglés</p>
-</div>
-
-<h3 id="Declarar_propiedades_con_var">Declarar propiedades con var</h3>
-
-<p><strong>No se pueden</strong> declarar propiedades de un objeto o arreglo con una declaración <code>var</code></p>
-
-<pre class="brush: js example-bad">var obj = {};
-var obj.foo = 'hola'; // Error de Sintaxis: Punto y coma ; faltante antes de la declaración
-
-var array = [];
-var array[0] = 'mundo'; // Error de Sintaxis: Punto y coma ; faltante antes de la declaración
-</pre>
-
-<p>En vez de esto. omitamos la palabra  <code>var</code>:</p>
-
-<pre class="brush: js example-good">var obj = {};
-obj.foo = 'hola';
-
-var array = [];
-array[0] = 'mundo';
-</pre>
-
-<h2 id="Ver_también">Ver también:</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#Automatic_semicolon_insertion">Automatic semicolon insertion (ASI)</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements">JavaScript statements</a></li>
-</ul>
diff --git a/files/es/web/javascript/reference/errors/illegal_character/index.html b/files/es/web/javascript/reference/errors/illegal_character/index.html
new file mode 100644
index 0000000000..0e3120b0d2
--- /dev/null
+++ b/files/es/web/javascript/reference/errors/illegal_character/index.html
@@ -0,0 +1,84 @@
+---
+title: 'ErrorDeSintaxis: Caracter ilegal'
+slug: Web/JavaScript/Reference/Errors/Illegal_character
+tags:
+  - Error
+  - Error de sintaxis
+  - JavaScript
+  - SyntaxError
+  - errores
+translation_of: Web/JavaScript/Reference/Errors/Illegal_character
+original_slug: Web/JavaScript/Reference/Errors/caracter_ilegal
+---
+<div>{{jsSidebar("Errors")}}</div>
+
+<h2 id="Mensaje">Mensaje</h2>
+
+<pre class="syntaxbox">SyntaxError: illegal character (Firefox)
+SyntaxError: Invalid or unexpected token (Chrome)</pre>
+
+<pre class="syntaxbox">ErrorDeSintasix: Carácter ilegal (Firefox)
+ErrorDeSintasix: Componente léxico inválido o inesperado (Chrome)
+</pre>
+
+<h2 id="Tipo_de_error">Tipo de error</h2>
+
+<p>{{jsxref("SyntaxError")}}  {{jsxref("ErrorDeSintaxis")}}</p>
+
+<h2 id="¿Qué_salió_mal">¿Qué salió mal?</h2>
+
+<p>Hay un componente léxico inválido o inesperado que no pertenece a su posición en el código. Utilice un editor que soporte el resaltado de sintaxis y que revise cuidadosamente su código contra discrepancias como un signo menos (<code> - </code>) contra un guion (<code> – </code>) o comillas simples (<code> " </code>) contra comillas no estándar (<code> “ </code>).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Caracteres_no_coincidentes">Caracteres no coincidentes</h3>
+
+<p>Algunos caracteres parecen iguales, pero hará que el analizador falle al interpretar su código.</p>
+
+<pre class="brush: js example-bad">“Esto parece una cadena de caracteres”;
+<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
+// ErrorDeSintaxis: Carácter ilegal
+
+42 – 13;
+<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
+// ErrorDeSintaxis: Carácter ilegal
+</pre>
+
+<p>Esto debería funcionar:</p>
+
+<pre class="brush: js example-good">"Esto en realidad es una cadena de caracteres";
+
+42 - 13;
+</pre>
+
+<h3 id="Caracteres_olvidados">Caracteres olvidados</h3>
+
+<p>Es fácil olvidar caracteres aquí o allí.</p>
+
+<pre class="brush: js example-bad">var colors = ['#000', #333', '#666'];
+<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
+// ErrorDeSintaxis: Carácter ilegal
+</pre>
+
+<p>Agregue la comilla olvidada para <code><strong>'</strong>#333'</code>.</p>
+
+<pre class="brush: js example-good">var colors = ['#000', '#333', '#666'];</pre>
+
+<h3 id="Caracteres_escondidos">Caracteres escondidos</h3>
+
+<p>Cuando copia y pega un código de una fuente externa, puede haber caracteres inválidos. ¡Cuidado!</p>
+
+<pre class="brush: js example-bad">var foo = 'bar';​
+<code class="language-js"><span class="comment token">// SyntaxError: illegal character</span></code>
+// ErrorDeSintaxis: Carácter ilegal
+</pre>
+
+<p>Al inspeccionar este código en un editor como Vim, puede ver que en realidad hay un carácter de <a href="https://en.wikipedia.org/wiki/Zero-width_space">espacio de ancho cero (ZWSP) (U+200B)</a>.</p>
+
+<pre class="brush: js">var foo = 'bar';​&lt;200b&gt;</pre>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Gramática léxica</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/errors/indicador_regexp_no-val/index.html b/files/es/web/javascript/reference/errors/indicador_regexp_no-val/index.html
deleted file mode 100644
index 3bb05d9b89..0000000000
--- a/files/es/web/javascript/reference/errors/indicador_regexp_no-val/index.html
+++ /dev/null
@@ -1,113 +0,0 @@
----
-title: 'SyntaxError: indicador de expresión regular no válido "x"'
-slug: Web/JavaScript/Reference/Errors/Indicador_regexp_no-val
-tags:
-  - Error
-  - Error de sintaxis
-  - JavaScript
-  - SyntaxError
-translation_of: Web/JavaScript/Reference/Errors/Bad_regexp_flag
----
-<div>{{jsSidebar("Errors", "Errores")}}</div>
-
-<p>La excepción de JavaScript "indicador de expresión regular no válido" se produce cuando las indicadores, definidas después de la segunda barra en la expresión regular literal, no son de <code>g</code>, <code>i</code>, <code>m</code>, <code>s</code>, <code>u</code> o <code>y</code>.</p>
-
-<h2 id="Mensaje">Mensaje</h2>
-
-<pre class="syntaxbox notranslate">SyntaxError: error de sintaxis en la expresión regular (Edge)
-SyntaxError: marca de expresión regular no válida "x" (Firefox)
-SyntaxError: indicadores de expresión regular no válidos (Chrome)
-</pre>
-
-<h2 id="Tipo_Error">Tipo <code>Error</code></h2>
-
-<p>{{jsxref("SyntaxError")}}</p>
-
-<h2 id="¿Qué_salió_mal">¿Qué salió mal?</h2>
-
-<p>Hay indicadores de expresión regular no válidos en el código. En una expresión regular literal, que consiste en un patrón encerrado entre barras, los indicadores se definen después de la segunda barra. También se pueden definir en la función constructora del objeto {{jsxref("RegExp")}} (segundo parámetro). Los indicadores de expresión regular se pueden usar por separado o juntos en cualquier orden, pero solo hay seis de ellos en ECMAScript.</p>
-
-<p>Para incluir una bandera con la expresión regular, usa esta sintaxis:</p>
-
-<pre class="brush: js notranslate">var re = /patrón/indicadores;
-</pre>
-
-<p>o</p>
-
-<pre class="brush: js notranslate">var re = new RegExp('patrón', 'indicadores');</pre>
-
-<table class="standard-table">
- <caption>Indicadores de expresión regular</caption>
- <thead>
-  <tr>
-   <th scope="col">Bandera</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>g</code></td>
-   <td>Búsqueda global.</td>
-  </tr>
-  <tr>
-   <td>i</td>
-   <td>Búsqueda que no distingue entre mayúsculas y minúsculas.</td>
-  </tr>
-  <tr>
-   <td>m</td>
-   <td>Búsqueda multilínea.</td>
-  </tr>
-  <tr>
-   <td>s</td>
-   <td>Permite que el punto (<code>.</code>) coincida con las nuevas líneas (agregado en ECMAScript 2018)</td>
-  </tr>
-  <tr>
-   <td>u</td>
-   <td>Unicode; trata el patrón como una secuencia de puntos de código Unicode</td>
-  </tr>
-  <tr>
-   <td>y</td>
-   <td>Realiza una búsqueda "pegajosa" que coincida a partir de la posición actual en la cadena de destino. Consulta {{jsxref("RegExp.sticky", "sticky")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Solo hay seis indicadores de expresión regular válidos.</p>
-
-<pre class="brush: js example-bad notranslate">/foo/bar;
-
-// SyntaxError: indicador de expresión regular no válido "b"
-</pre>
-
-<p>¿Tenías la intención de crear una expresión regular? Una expresión que contiene dos barras se interpreta como una expresión regular literal.</p>
-
-<pre class="brush: js example-bad notranslate">let obj = {
-  url: /docs/Web
-};
-
-// SyntaxError: indicador de expresión regular no válido "W"
-</pre>
-
-<p>¿O pretendías crear una cadena en su lugar? Agrega comillas simples o dobles para crear una cadena literal.</p>
-
-<pre class="brush: js example-good notranslate">let obj = {
-  url: '/docs/Web'
-};</pre>
-
-<h3 id="Indicadores_de_expresión_regular_válidos">Indicadores de expresión regular válidos</h3>
-
-<p>Consulta la tabla anterior para ver las seis marcas de expresiones regulares válidas que están permitidas en JavaScript.</p>
-
-<pre class="brush: js example-good notranslate">/foo/g;
-/foo/gims;
-/foo/uy;
-</pre>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}}</li>
- <li><a href="http://xregexp.com/flags/">Indicadores de RegEx</a> – biblioteca de expresiones regulares que proporciona cuatro nuevos indicadores (<code>n</code>, <code>s</code>, <code>x</code>, <code>A</code>)</li>
-</ul>
diff --git a/files/es/web/javascript/reference/errors/missing_semicolon_before_statement/index.html b/files/es/web/javascript/reference/errors/missing_semicolon_before_statement/index.html
new file mode 100644
index 0000000000..b47e2f137b
--- /dev/null
+++ b/files/es/web/javascript/reference/errors/missing_semicolon_before_statement/index.html
@@ -0,0 +1,73 @@
+---
+title: 'ErrordeSintaxis: Punto y coma ; faltante antes de la declaracion'
+slug: Web/JavaScript/Reference/Errors/Missing_semicolon_before_statement
+tags:
+  - JavaScript
+  - errores
+  - errorsintaxis
+  - puntoycoma
+translation_of: Web/JavaScript/Reference/Errors/Missing_semicolon_before_statement
+original_slug: Web/JavaScript/Reference/Errors/Falta_puntoycoma_antes_de_declaracion
+---
+<div>{{jsSidebar("Errores")}}</div>
+
+<h2 id="Mensaje">Mensaje</h2>
+
+<pre class="syntaxbox">Error de Sintaxis: Punto y coma ; faltante antes de la declaración
+</pre>
+
+<h2 id="Tipo_de_Error">Tipo de Error</h2>
+
+<p>{{jsxref("SyntaxError")}}.</p>
+
+<h2 id="¿Qué_salio_mal">¿Qué salio mal?</h2>
+
+<p>Hay un punto y coma (<code>;</code>) faltando en alguna parte. Las declaraciones Javascript deben terminar con punto y coma. Algunas de ellas son afectadas por la inserción automática<a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#Automatic_semicolon_insertion"> (ASI)</a>, pero en este caso necesitas colocar un punto y coma, de esta forma Javascript puede analizar el código fuente de forma correcta.</p>
+
+<p>Sin embargo, algunas veces, este error es solo una consecuencia de otro error, como no separar las cadenas de texto correctamente, o usar <em>var</em> incorrectamente. Tal vez tengas muchos paréntesis en algún lugar. Revisa cuidadosamente la sintaxis cuando este error es lanzado.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Cadenas_de_texto_(strings)_sin_terminar">Cadenas de texto (strings) sin terminar</h3>
+
+<p>Este error puede pasar fácilmente cuando no se colocan las comillas correctamente y el motor de JavaScript esta esperando el final de la cadena. por ejemplo:</p>
+
+<pre class="brush: js example-bad">var foo = 'El bar de Tom's';
+// Error de Sintaxis: Punto y coma ; faltante antes de la declaración</pre>
+
+<p>En este caso se pueden usar comillas dobles para escapar del apóstrofe:</p>
+
+<pre class="brush: js example-good">var foo = "El bar de Tom's";
+var foo = 'El bar de Tom\'s';
+</pre>
+
+<div class="note">
+<p>Nota: Este error suele pasar frecuentemene con cadenas del idioma Inglés</p>
+</div>
+
+<h3 id="Declarar_propiedades_con_var">Declarar propiedades con var</h3>
+
+<p><strong>No se pueden</strong> declarar propiedades de un objeto o arreglo con una declaración <code>var</code></p>
+
+<pre class="brush: js example-bad">var obj = {};
+var obj.foo = 'hola'; // Error de Sintaxis: Punto y coma ; faltante antes de la declaración
+
+var array = [];
+var array[0] = 'mundo'; // Error de Sintaxis: Punto y coma ; faltante antes de la declaración
+</pre>
+
+<p>En vez de esto. omitamos la palabra  <code>var</code>:</p>
+
+<pre class="brush: js example-good">var obj = {};
+obj.foo = 'hola';
+
+var array = [];
+array[0] = 'mundo';
+</pre>
+
+<h2 id="Ver_también">Ver también:</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#Automatic_semicolon_insertion">Automatic semicolon insertion (ASI)</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements">JavaScript statements</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/errors/strict_non_simple_params/index.html b/files/es/web/javascript/reference/errors/strict_non_simple_params/index.html
new file mode 100644
index 0000000000..caf2c3980a
--- /dev/null
+++ b/files/es/web/javascript/reference/errors/strict_non_simple_params/index.html
@@ -0,0 +1,118 @@
+---
+title: 'SyntaxError: "use strict" no permitida en función con parámetros complejos'
+slug: Web/JavaScript/Reference/Errors/Strict_Non_Simple_Params
+tags:
+  - Error
+  - JavaScript
+  - TypeError
+  - errores
+translation_of: Web/JavaScript/Reference/Errors/Strict_Non_Simple_Params
+original_slug: Web/JavaScript/Reference/Errors/Strict_y_parámetros_complejos
+---
+<div>{{jsSidebar("Errors", "Errores")}}</div>
+
+<p>La excepción de JavaScript: "<code>'use strict' no permitida en función</code>" ocurre cuando se usa una directiva <code>"use strict"</code> en la parte superior de una función con {{jsxref("Functions/Default_parameters", "parámetros predeterminados", "", 1)}}, {{jsxref("Functions/rest_parameters", "parámetros rest", "", 1)}} o {{jsxref("Operators/Destructuring_assignment" , "Desestructuración de parámetros", "", 1)}}.</p>
+
+<h2 id="Mensaje">Mensaje</h2>
+
+<pre class="syntaxbox notranslate">Edge:
+No se puede aplicar el modo estricto en funciones con una lista de parámetros complejos
+
+Firefox:
+SyntaxError: "use strict" no permitido en la función con parámetro predeterminado
+SyntaxError: "use strict" no permitido en la función con parámetro rest
+SyntaxError: "use strict" no permitido en la función con parámetro de desestructuración
+
+Chrome:
+SyntaxError: directiva ilegal 'use strict' en función con una lista de parámetros complejos
+</pre>
+
+<h2 id="Tipo_Error">Tipo <code>Error</code></h2>
+
+<p>{{jsxref("SyntaxError")}}.</p>
+
+<h2 id="¿Qué_salió_mal">¿Qué salió mal?</h2>
+
+<p>Se escribió una directiva <code>"use strict"</code> en la parte superior de una función que tiene uno de los siguientes parámetros:</p>
+
+<ul>
+ <li>{{jsxref("Functions/Default_parameters", "Parámetros predeterminados", "", 1)}}</li>
+ <li>{{jsxref("Functions/rest_parameters", "Parámetros rest", "", 1)}}</li>
+ <li>{{jsxref("Operators/Destructuring_assignment", "Desestructuración de parámetros", "", 1)}}</li>
+</ul>
+
+<p>No está permitida una directiva <code>"use strict"</code> en la parte superior de dichas funciones según la especificación ECMAScript.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Declaración_de_función">Declaración de función</h3>
+
+<p>En este caso, la función <code>sum</code> tiene los parámetros predeterminados <code>a = 1</code> y <code>b = 2</code>:</p>
+
+<pre class="brush: js example-bad notranslate">function sum(a = 1, b = 2) {
+  SyntaxError: 'use strict' no permitida en la función con parámetros predeterminados
+  'use strict';
+  return a + b;
+}
+</pre>
+
+<p>Si la función debe estar en <a href="/es/docs/Web/JavaScript/Reference/Strict_mode">modo estricto</a>, y todo el script o la función adjunta también está bien que esté en modo estricto, puedes mover la directiva <code>"use strict"</code> fuera de la función:</p>
+
+<pre class="brush: js example-good notranslate">'use strict';
+function sum(a = 1, b = 2) {
+  return a + b;
+}
+</pre>
+
+<h3 id="Expresión_Function">Expresión <code>Function</code></h3>
+
+<p>Una expresión <code>function</code> puede usar otra solución alternativa:</p>
+
+<pre class="brush: js example-bad notranslate">var sum = function sum([a, b]) {
+  // SyntaxError: "use strict" no permitido en función con parámetros de desestructuración
+  'use strict';
+  return a + b;
+};
+</pre>
+
+<p>Esta se puede convertir a la siguiente expresión:</p>
+
+<pre class="brush: js example-good notranslate">var sum = (function() {
+  'use strict';
+  return function sum([a, b]) {
+    return a + b;
+  };
+})();
+</pre>
+
+<h3 id="Función_de_flecha">Función de flecha</h3>
+
+<p>Si una función de flecha necesita acceder a la variable <code>this</code>, puedes usar la función de flecha como función circundante:</p>
+
+<pre class="brush: js example-bad notranslate">var callback = (...args) =&gt; {
+  SyntaxError: "use strict" no permitido en la función con parámetro rest
+  'use strict';
+  return this.run(args);
+};
+</pre>
+
+<p>Esta se puede convertir a la siguiente expresión:</p>
+
+<pre class="brush: js example-good notranslate">var callback = (() =&gt; {
+  'use strict';
+  return (...args) =&gt; {
+    return this.run(args);
+  };
+})();
+</pre>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Strict_mode", "Modo estricto", "", 1)}}</li>
+ <li>{{jsxref("Statements/function", "Declaración de función", "", 1)}}</li>
+ <li>{{jsxref("Operators/function", "Expresión function", "", 1)}}</li>
+ <li>{{jsxref("Functions/Default_parameters", "Parámetros predeterminados", "", 1)}}</li>
+ <li>{{jsxref("Functions/rest_parameters", "Parámetros rest", "", 1)}}</li>
+ <li>{{jsxref("Operators/Destructuring_assignment", "Desestructuración de parámetros", "", 1)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/errors/strict_y_parámetros_complejos/index.html b/files/es/web/javascript/reference/errors/strict_y_parámetros_complejos/index.html
deleted file mode 100644
index 2ca6ef8de4..0000000000
--- a/files/es/web/javascript/reference/errors/strict_y_parámetros_complejos/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: 'SyntaxError: "use strict" no permitida en función con parámetros complejos'
-slug: Web/JavaScript/Reference/Errors/Strict_y_parámetros_complejos
-tags:
-  - Error
-  - JavaScript
-  - TypeError
-  - errores
-translation_of: Web/JavaScript/Reference/Errors/Strict_Non_Simple_Params
----
-<div>{{jsSidebar("Errors", "Errores")}}</div>
-
-<p>La excepción de JavaScript: "<code>'use strict' no permitida en función</code>" ocurre cuando se usa una directiva <code>"use strict"</code> en la parte superior de una función con {{jsxref("Functions/Default_parameters", "parámetros predeterminados", "", 1)}}, {{jsxref("Functions/rest_parameters", "parámetros rest", "", 1)}} o {{jsxref("Operators/Destructuring_assignment" , "Desestructuración de parámetros", "", 1)}}.</p>
-
-<h2 id="Mensaje">Mensaje</h2>
-
-<pre class="syntaxbox notranslate">Edge:
-No se puede aplicar el modo estricto en funciones con una lista de parámetros complejos
-
-Firefox:
-SyntaxError: "use strict" no permitido en la función con parámetro predeterminado
-SyntaxError: "use strict" no permitido en la función con parámetro rest
-SyntaxError: "use strict" no permitido en la función con parámetro de desestructuración
-
-Chrome:
-SyntaxError: directiva ilegal 'use strict' en función con una lista de parámetros complejos
-</pre>
-
-<h2 id="Tipo_Error">Tipo <code>Error</code></h2>
-
-<p>{{jsxref("SyntaxError")}}.</p>
-
-<h2 id="¿Qué_salió_mal">¿Qué salió mal?</h2>
-
-<p>Se escribió una directiva <code>"use strict"</code> en la parte superior de una función que tiene uno de los siguientes parámetros:</p>
-
-<ul>
- <li>{{jsxref("Functions/Default_parameters", "Parámetros predeterminados", "", 1)}}</li>
- <li>{{jsxref("Functions/rest_parameters", "Parámetros rest", "", 1)}}</li>
- <li>{{jsxref("Operators/Destructuring_assignment", "Desestructuración de parámetros", "", 1)}}</li>
-</ul>
-
-<p>No está permitida una directiva <code>"use strict"</code> en la parte superior de dichas funciones según la especificación ECMAScript.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Declaración_de_función">Declaración de función</h3>
-
-<p>En este caso, la función <code>sum</code> tiene los parámetros predeterminados <code>a = 1</code> y <code>b = 2</code>:</p>
-
-<pre class="brush: js example-bad notranslate">function sum(a = 1, b = 2) {
-  SyntaxError: 'use strict' no permitida en la función con parámetros predeterminados
-  'use strict';
-  return a + b;
-}
-</pre>
-
-<p>Si la función debe estar en <a href="/es/docs/Web/JavaScript/Reference/Strict_mode">modo estricto</a>, y todo el script o la función adjunta también está bien que esté en modo estricto, puedes mover la directiva <code>"use strict"</code> fuera de la función:</p>
-
-<pre class="brush: js example-good notranslate">'use strict';
-function sum(a = 1, b = 2) {
-  return a + b;
-}
-</pre>
-
-<h3 id="Expresión_Function">Expresión <code>Function</code></h3>
-
-<p>Una expresión <code>function</code> puede usar otra solución alternativa:</p>
-
-<pre class="brush: js example-bad notranslate">var sum = function sum([a, b]) {
-  // SyntaxError: "use strict" no permitido en función con parámetros de desestructuración
-  'use strict';
-  return a + b;
-};
-</pre>
-
-<p>Esta se puede convertir a la siguiente expresión:</p>
-
-<pre class="brush: js example-good notranslate">var sum = (function() {
-  'use strict';
-  return function sum([a, b]) {
-    return a + b;
-  };
-})();
-</pre>
-
-<h3 id="Función_de_flecha">Función de flecha</h3>
-
-<p>Si una función de flecha necesita acceder a la variable <code>this</code>, puedes usar la función de flecha como función circundante:</p>
-
-<pre class="brush: js example-bad notranslate">var callback = (...args) =&gt; {
-  SyntaxError: "use strict" no permitido en la función con parámetro rest
-  'use strict';
-  return this.run(args);
-};
-</pre>
-
-<p>Esta se puede convertir a la siguiente expresión:</p>
-
-<pre class="brush: js example-good notranslate">var callback = (() =&gt; {
-  'use strict';
-  return (...args) =&gt; {
-    return this.run(args);
-  };
-})();
-</pre>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Strict_mode", "Modo estricto", "", 1)}}</li>
- <li>{{jsxref("Statements/function", "Declaración de función", "", 1)}}</li>
- <li>{{jsxref("Operators/function", "Expresión function", "", 1)}}</li>
- <li>{{jsxref("Functions/Default_parameters", "Parámetros predeterminados", "", 1)}}</li>
- <li>{{jsxref("Functions/rest_parameters", "Parámetros rest", "", 1)}}</li>
- <li>{{jsxref("Operators/Destructuring_assignment", "Desestructuración de parámetros", "", 1)}}</li>
-</ul>
diff --git a/files/es/web/javascript/reference/functions/arguments/callee/index.html b/files/es/web/javascript/reference/functions/arguments/callee/index.html
new file mode 100644
index 0000000000..0a68b739f3
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/arguments/callee/index.html
@@ -0,0 +1,49 @@
+---
+title: callee
+slug: Web/JavaScript/Reference/Functions/arguments/callee
+tags:
+  - JavaScript
+  - JavaScript Reference
+  - Referencia
+translation_of: Web/JavaScript/Reference/Functions/arguments/callee
+original_slug: Web/JavaScript/Referencia/Funciones/arguments/callee
+---
+<div>
+<div>{{jsSidebar("Functions")}}</div>
+</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Especifica la función que se está ejecutando actualmente.</p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>callee</code> es una propiedad de la variable local <code>arguments</code> disponible dentro de todos los objetos function; <code>callee</code> como una propiedad de {{jsxref("Funciones/arguments", "Function.arguments")}} ya no se utiliza. (<code>Function.arguments</code> en sí mismo está también desaconsejado.)</p>
+
+<p><code>arguments.callee</code> permite a funciones anónimas referirse a ellas mismas, lo cual es necesario en funciones anónimas recursivas.</p>
+
+<p>La palabra clave <code>this</code> no se refiere a la función que se ejecuta actualmente. Use la propiedad <code>callee</code> para referirse a la función dentro del cuerpo de la función.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_arguments.callee_en_funciones_an.C3.B3nimas_recursivas" name="Ejemplo:_Usando_arguments.callee_en_funciones_an.C3.B3nimas_recursivas">Ejemplo: Usando <code>arguments.callee</code> en funciones anónimas recursivas</h3>
+
+<p>Una función recursiva debe ser capaz de referirse a sí misma. Típicamente, una función se refiere a sí misma por su nombre. Sin embargo, una función anónima no tiene nombre y por tanto es una variable de referencia para ella, es decir, si la función no está asignada a ninguna variable, la función no puede referirse a sí misma. (Se pueden crear funciones anónimas mediante una expresión {{jsxref("Operadores/function", "function")}} o el constructor {{jsxref("Function")}}.) Aquí es donde entra <code>arguments.callee</code>.</p>
+
+<p>El siguiente ejemplo define una función, la cuál, en cada turno, define y devuelve una función factorial.</p>
+
+<pre class="brush: js">function makeFactorialFunc() {
+   alert('making a factorial function!');
+   return function(x) {
+      if (x &lt;= 1)
+         return 1;
+      return x * arguments.callee(x - 1);
+   };
+}
+
+var result = makeFactorialFunc()(5); // returns 120 (5 * 4 * 3 * 2 * 1)
+</pre>
+
+<p><span class="comment">this example isn't very practical, but then again, there are few practical cases where arguments.callee is necessary, and most of the those cases involve closures</span></p>
+
+<p> </p>
diff --git a/files/es/web/javascript/reference/functions/arguments/index.html b/files/es/web/javascript/reference/functions/arguments/index.html
new file mode 100644
index 0000000000..2540bbdaa3
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/arguments/index.html
@@ -0,0 +1,230 @@
+---
+title: El objeto arguments
+slug: Web/JavaScript/Reference/Functions/arguments
+tags:
+  - Funciones
+  - JavaScript
+  - Namespace
+  - argumentos
+  - arguments
+  - espacio de nombres
+  - multiples
+translation_of: Web/JavaScript/Reference/Functions/arguments
+original_slug: Web/JavaScript/Referencia/Funciones/arguments
+---
+<div>{{jsSidebar("Functions", "Funciones")}}</div>
+
+<p><strong><code>arguments</code></strong> es un objeto similar a <code>Array</code> accesible dentro de <a href="/es/docs/Web/JavaScript/Guide/Functions">funciones</a> que contiene los valores de los argumentos pasados a esa función.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/functions-arguments.html")}}</div>
+
+<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Si estás escribiendo código compatible con ES6, entonces se deben preferir los {{jsxref("Functions/rest_parameters", "parámetros resto")}}.</p>
+</div>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: "similar a Array" significa que <code>arguments</code> tiene una propiedad {{jsxref("Functions/arguments/length", "lenght")}} y propiedades indexadas desde cero, pero no tiene métodos integrados de {{jsxref("Array")}} como {{jsxref("Array.forEach", "forEach()")}} o {{jsxref("Array.map", "map()")}}. Ve la <a href="#Descripción">§Descripción</a> para obtener más detalles.</p>
+</div>
+
+<p>El objeto <code>arguments</code> es una variable local disponible en todas las funciones que no son {{jsxref("Functions/Arrow_functions", "funciones flecha")}}. Puedes hacer referencia a los argumentos de una función dentro de esa función utilizando su objeto <code>arguments</code>. Tiene entradas para cada argumento con el que se llamó a la función, con el índice de la primera entrada en <code>0</code>.</p>
+
+<p>Por ejemplo, si a una función se le pasan 3 argumentos, puedes acceder a ellos de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">arguments[0] // primer argumento
+arguments[1] // segundo argumento
+arguments[2] // tercer argumento
+</pre>
+
+<p>También puedes establecer o reasignar cada argumento:</p>
+
+<pre class="brush: js notranslate">arguments[1] = 'new value';
+</pre>
+
+<p>El objeto <code>arguments</code> no es un {{jsxref("Array")}}. Es similar, pero carece de todas las propiedades de <code>Array</code> excepto de {{jsxref("Array.length", "length")}}. Por ejemplo, no tiene el método {{jsxref("Array.pop", "pop()")}}.</p>
+
+<p>Sin embargo, se puede convertir en un <code>Array</code> real:</p>
+
+<pre class="brush: js notranslate">var args = Array.prototype.slice.call(arguments);
+// El uso de un arreglo literal es más corto que el anterior pero asigna un arreglo vacío
+var args = [].slice.call(arguments);
+</pre>
+
+<p>Así como puedes hacer con cualquier objeto tipo <code>Array</code>, puedes usar el método {{jsxref("Array.from()")}} de ES2015 o la {{jsxref("Operators/Spread_syntax", "propagación de sintaxis")}} para convertir <code>arguments</code> en un arreglo real:</p>
+
+<pre class="brush: js notranslate">let args = Array.from(arguments);
+// o
+let args = [...arguments];
+</pre>
+
+<p>El objeto <code>arguments</code> es útil para funciones llamadas con más argumentos de los que declara aceptar formalmente. Esta técnica es útil para funciones a las que se les puede pasar un número variable de argumentos, como {{jsxref("Math.min()")}}. Esta función de ejemplo acepta cualquier número de argumentos de cadena y devuelve la más larga:</p>
+
+<pre class="brush: js notranslate">function longestString() {
+  var longest = '';
+  for (var i=0; i &lt; arguments.length; i++) {
+    if (arguments[i].length &gt; longest.length) {
+      longest = arguments[i];
+    }
+  }
+  return longest;
+}
+</pre>
+
+<p>Puedes usar {{jsxref("Functions/arguments/lenght", "arguments.length")}} para contar con cuántos argumentos se llamó a la función. Si, en cambio, deseas contar cuántos parámetros se declara que acepta una función, inspecciona la propiedad {{jsxref("Function.length", "length")}} de esa función.</p>
+
+<h3 id="Usar_typeof_con_arguments">Usar <code>typeof</code> con <code>arguments</code></h3>
+
+<p>El operador {{jsxref("Operators/typeof", "typeof")}} devuelve <code>'object'</code> cuando se usa con <code>arguments</code></p>
+
+<pre class="brush: js notranslate">console.log(typeof arguments); // 'object' </pre>
+
+<p>El tipo de argumentos individuales se puede determinar indexando <code>arguments</code>:</p>
+
+<pre class="notranslate">console.log(typeof arguments[0]); // devuelve el tipo del primer argumento</pre>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("Functions/arguments/callee", "arguments.callee")}}</dt>
+ <dd>Referencia a la función en ejecución a la que pertenecen los argumentos. Prohibida en modo estricto.</dd>
+ <dt>{{jsxref("Functions/arguments/length", "arguments.length")}}</dt>
+ <dd>El número de argumentos que se pasaron a la función.</dd>
+ <dt>{{jsxref("Functions/arguments/@@iterator", "arguments[@@iterator]")}}</dt>
+ <dd>Devuelve un nuevo objeto {{jsxref("Array/@@iterator", "Array iterator", "", 0)}} que contiene los valores de cada índice en <code>arguments</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Definición_de_una_función_que_concatena_varias_cadenas">Definición de una función que concatena varias cadenas</h3>
+
+<p>Este ejemplo define una función que concatena varias cadenas. El único argumento formal de la función es una cadena que contiene los caracteres que separan los elementos a concatenar.</p>
+
+<pre class="brush:js notranslate">function myConcat(separator) {
+  let args = Array.prototype.slice.call(arguments, 1);
+  return args.join(separator);
+}</pre>
+
+<p>Puedes pasar tantos argumentos como desees a esta función. Devuelve una lista de cadenas usando cada argumento en la lista:</p>
+
+<pre class="brush:js notranslate">// returns "red, orange, blue"
+myConcat(', ', 'red', 'orange', 'blue');
+
+// devuelve "elephant; giraffe; lion; cheetah"
+myConcat('; ', 'elephant', 'giraffe', 'lion', 'cheetah');
+
+// devuelve "sage. basil. oregano. pepper. parsley"
+myConcat('. ', 'sage', 'basil', 'oregano', 'pepper', 'parsley');</pre>
+
+<h3 id="Definición_de_una_función_que_crea_listas_HTML">Definición de una función que crea listas HTML</h3>
+
+<p>Este ejemplo define una función que crea una cadena que contiene HTML para una lista. El único argumento formal para la función es una cadena que es "<code>u</code>" si la lista debe estar {{htmlelement("ul", "desordenada (con viñetas)")}}, u "<code>o</code>" si la lista es {{htmlelement("ol", "ordenada (numerada)")}}. La función se define de la siguiente manera:</p>
+
+<pre class="brush:js notranslate">function list(type) {
+  var html = '&lt;' + type + 'l&gt;&lt;li&gt;';
+  var args = Array.prototype.slice.call(arguments, 1);
+  html += args.join('&lt;/li&gt;&lt;li&gt;');
+  html += '&lt;/li&gt;&lt;/' + type + 'l&gt;'; // fin de la lista
+  return html;
+}</pre>
+
+<p>Puedes pasar cualquier número de argumentos a esta función y agregar cada argumento como un elemento de lista a una lista del tipo indicado. Por ejemplo:</p>
+
+<pre class="brush:js notranslate">let listHTML = list('u', 'One', 'Two', 'Three');
+
+/* la listHTML es:
+"&lt;ul&gt;&lt;li&gt;One&lt;/li&gt;&lt;li&gt;Two&lt;/li&gt;&lt;li&gt;Three&lt;/li&gt;&lt;/ul&gt;"
+*/</pre>
+
+<h3 id="Parámetros_rest_predeterminados_y_desestructurados">Parámetros <code>rest</code>, predeterminados y desestructurados</h3>
+
+<div>
+<p>El objeto <code>arguments</code> se puede utilizar junto con parámetros {{jsxref("Functions/rest_parameters", "rest")}}, {{jsxref("Functions/Default_parameters", "predeterminados")}} y {{jsxref("Operators/Destructuring_assignment", "desestructurados")}}.</p>
+</div>
+
+<pre class="brush: js notranslate">function foo(...args) {
+  return args;
+}
+foo(1, 2, 3); // [1, 2, 3]
+</pre>
+
+<p>Si bien la presencia de parámetros <code>rest</code>, predeterminados o desestructurados no altera <a href="/es/docs/Web/JavaScript/Reference/Strict_mode#Haciendo_eval_y_arguments_más_simples">el comportamiento del objeto <code>arguments</code> en el código de modo estricto</a>, existen sutiles diferencias para el código no estricto.</p>
+
+<p>En el código de modo estricto, el objeto <code>arguments</code> se comporta de la misma manera independientemente de que se pasen parámetros <code>rest</code>, predeterminados o desestructurados a una función. Es decir, asignar nuevos valores a las variables en el cuerpo de la función no afectará al objeto <code>arguments</code>. La asignación de nuevas variables al objeto <code>arguments</code> tampoco afectará el valor de las variables.</p>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: No puedes escribir una directiva <code>"use strict";</code> en el cuerpo de una definición de función que acepte parámetros <code>rest</code>, predeterminados o desestructurados. Si lo haces, generará un {{jsxref("Errors/Strict_Non_Simple_Params", "error de sintaxis")}}.</p>
+</div>
+
+<p>Las funciones no estrictas a las que se les pasan solo parámetros simples (es decir, no parámetros <code>rest</code>, predeterminados o desestructurados) sincronizarán el valor de los nuevos valores de las variables en el cuerpo de la función con el objeto <code>arguments</code>, y viceversa:</p>
+
+<pre class="brush: js notranslate">function func(a) {
+  arguments[0] = 99; // actualiza arguments[0] además actualiza a
+  console.log(a);
+}
+func(10); // 99
+</pre>
+
+<p>Y también:</p>
+
+<pre class="brush: js notranslate">function func(a) {
+  a = 99; // la actualización también actualiza arguments[0]
+  console.log(arguments[0]);
+}
+func(10); // 99
+</pre>
+
+<p>Por el contrario, las funciones no estrictas a las que <strong>se les pasan</strong> parámetros <code>rest</code>, predeterminados o desestructurados <strong>no</strong> sincronizarán los nuevos valores asignados a las variables de los argumentos en el cuerpo de la función con el objeto <code>arguments</code>. En cambio, el objeto <code>arguments</code> en funciones no estrictas con parámetros complejos <strong>siempre</strong> reflejarán los valores pasados a la función cuando se invocó (este es el mismo comportamiento exhibido por todas las funciones en modo estricto, independientemente del tipo de variables que se le pasen):</p>
+
+<pre class="brush: js notranslate">function func(a = 55) {
+  arguments[0] = 99; // actualizar arguments[0] tampoco actualiza a
+  console.log(a);
+}
+func(10); // 10</pre>
+
+<p>Y también:</p>
+
+<pre class="brush: js notranslate">function func(a = 55) {
+  a = 99; // actualizar a tampoco actualiza arguments[0]
+  console.log(arguments[0]);
+}
+func(10); // 10
+</pre>
+
+<p>Y también:</p>
+
+<pre class="brush: js notranslate">// Un parámetro predeterminado sin seguimiento
+function func(a = 55) {
+  console.log(arguments[0]);
+}
+func(); // undefined</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Objectos arguments exóticos')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.functions.arguments")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Function", "Función")}}</li>
+ <li>{{jsxref("Functions/rest_parameters", "Parámetros resto")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/functions/arguments/length/index.html b/files/es/web/javascript/reference/functions/arguments/length/index.html
new file mode 100644
index 0000000000..aaf1375447
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/arguments/length/index.html
@@ -0,0 +1,132 @@
+---
+title: arguments.length
+slug: Web/JavaScript/Reference/Functions/arguments/length
+tags:
+  - Funciones
+  - JavaScript
+  - Propiedades
+  - argumentos
+translation_of: Web/JavaScript/Reference/Functions/arguments/length
+original_slug: Web/JavaScript/Referencia/Funciones/arguments/length
+---
+<div>{{jsSidebar("Functions")}}</div>
+
+<p>La propiedad <strong><code>arguments.length</code></strong> contiene el número de argumentos pasados a una función.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">arguments.length</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad arguments.length devuelve el número total de argumentos pasados a una función. Esto puede ser más o menos que el número de parametros definidos. (Véase {{jsxref("Function.length")}}).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_arguments.length">Usando <code>arguments.length</code></h3>
+
+<p>En este ejemplo definimos una función que puede sumar dos o más números.</p>
+
+<pre class="brush: js">function adder(base /*, n2, ... */) {
+  base = Number(base);
+  for (var i = 1; i &lt; arguments.length; i++) {
+    base += Number(arguments[i]);
+  }
+  return base;
+}
+</pre>
+
+<div class="note">
+<p>Tenga en cuenta la diferencia entre {{jsxref("Function.length")}} y arguments.length</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-10.6', 'Arguments Object')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_navegadores">Compatibilidad con los navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Function")}}</li>
+ <li>{{jsxref("Function.length")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/functions/arrow_functions/index.html b/files/es/web/javascript/reference/functions/arrow_functions/index.html
new file mode 100644
index 0000000000..a4f7f4427c
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/arrow_functions/index.html
@@ -0,0 +1,531 @@
+---
+title: Funciones Flecha
+slug: Web/JavaScript/Reference/Functions/Arrow_functions
+tags:
+  - ECMAScript6
+  - Intermedio
+  - JavaScript
+  - Referencia
+  - función
+translation_of: Web/JavaScript/Reference/Functions/Arrow_functions
+original_slug: Web/JavaScript/Referencia/Funciones/Arrow_functions
+---
+<div>{{jsSidebar("Functions", "Funciones")}}</div>
+
+<p>Una <strong>expresión de función flecha</strong> es una alternativa compacta a una {{JSxRef("Operadores/function", "expresión de función")}} tradicional, pero es limitada y no se puede utilizar en todas las situaciones.</p>
+
+<p><strong>Diferencias y limitaciones:</strong></p>
+
+<ul>
+ <li>No tiene sus propios enlaces a {{JSxRef("Operadores/this", "this")}} o {{JSxRef("Operadores/super", "super")}} y no se debe usar como {{Glossary("Method", "métodos")}}.</li>
+ <li>No tiene {{JSxRef("Funciones/arguments", "argumentos")}} o palabras clave {{JSxRef("../Operadores/new.target", "new.target")}}.</li>
+ <li>No apta para los métodos {{JSxRef("Objetos_globales/Function/call", "call")}}, {{JSxRef("Objetos_globales/Function/apply", "apply")}} y {{JSxRef("Objetos_globales/Function/bind", "bind")}}, que generalmente se basan en establecer un {{Glossary("Scope", "ámbito o alcance")}}</li>
+ <li>No se puede utilizar como {{Glossary("constructor", "constructor")}}.</li>
+ <li>No se puede utilizar {{JSxRef("Operadores/yield", "yield")}} dentro de su cuerpo.</li>
+</ul>
+
+<p>{{EmbedInteractiveExample("pages/js/functions-arrow.html")}}</p>
+
+<h3 id="Comparación_de_funciones_tradicionales_con_funciones_flecha">Comparación de funciones tradicionales con funciones flecha</h3>
+
+<p>Observa, paso a paso, la descomposición de una "función tradicional" hasta la "función flecha" más simple:<br>
+ <strong>Nota</strong>: Cada paso a lo largo del camino es una "función flecha" válida</p>
+
+<pre class="brush: js notranslate">// Función tradicional
+function (a){
+  return a + 100;
+}
+
+// Desglose de la función flecha
+
+// 1. Elimina la palabra "function" y coloca la flecha entre el argumento y el corchete de apertura.
+(a) =&gt; {
+  return a + 100;
+}
+
+// 2. Quita los corchetes del cuerpo y la palabra "return" — el return está implícito.
+(a) =&gt; a + 100;
+
+// 3. Suprime los paréntesis de los argumentos
+a =&gt; a + 100;</pre>
+
+<div class="blockIndicator note">
+<p>Como se muestra arriba, los { corchetes }, ( paréntesis ) y "return" son opcionales, pero pueden ser obligatorios.</p>
+</div>
+
+<p>Por ejemplo, si tienes <strong>varios argumentos</strong> o <strong>ningún argumento</strong>, deberás volver a introducir paréntesis alrededor de los argumentos:</p>
+
+<pre class="brush: js notranslate">// Función tradicional
+function (a, b){
+  return a + b + 100;
+}
+
+// Función flecha
+(a, b) =&gt; a + b + 100;
+
+// Función tradicional (sin argumentos)
+let a = 4;
+let b = 2;
+function (){
+  return a + b + 100;
+}
+
+// Función flecha (sin argumentos)
+let a = 4;
+let b = 2;
+() =&gt; a + b + 100;</pre>
+
+<p>Del mismo modo, si el cuerpo requiere <strong>líneas de procesamiento adicionales</strong>, deberás volver a introducir los corchetes <strong>Más el "return"</strong> (las funciones flecha no adivinan mágicamente qué o cuándo quieres "volver"):</p>
+
+<pre class="brush: js notranslate">// Función tradicional
+function (a, b){
+  let chuck = 42;
+  return a + b + chuck;
+}
+
+// Función flecha
+(a, b) =&gt; {
+  let chuck = 42;
+  return a + b + chuck;
+}</pre>
+
+<div>Y finalmente, en las <strong>funciones con nombre</strong> tratamos las expresiones de flecha como variables</div>
+
+<div>
+<pre class="brush: js notranslate">// Función tradicional
+function bob (a){
+  return a + 100;
+}
+
+// Función flecha
+let bob = a =&gt; a + 100;</pre>
+</div>
+
+<div></div>
+
+<div></div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<h3 id="Sintaxis_básica">Sintaxis básica</h3>
+
+<p class="syntaxbox notranslate">Un parámetro. Con una expresión simple no se necesita <code>return</code>:</p>
+
+<pre class="brush: js notranslate">param =&gt; expression</pre>
+
+<p class="syntaxbox notranslate">Varios parámetros requieren paréntesis. Con una expresión simple no se necesita <code>return</code>:</p>
+
+<pre class="brush: js notranslate">(param1, paramN) =&gt; expression</pre>
+
+<p class="syntaxbox notranslate">Las declaraciones de varias líneas requieren corchetes y <code>return</code>:</p>
+
+<pre class="brush: js notranslate">param =&gt; {
+  let a = 1;
+  return a + b;
+}</pre>
+
+<p class="syntaxbox notranslate">Varios parámetros requieren paréntesis. Las declaraciones de varias líneas requieren corchetes y <code>return</code>:</p>
+
+<pre class="brush: js notranslate">(param1, paramN) =&gt; {
+   let a = 1;
+   return a + b;
+}</pre>
+
+<h3 id="Sintaxis_avanzada">Sintaxis avanzada</h3>
+
+<p class="syntaxbox notranslate">Para devolver una expresión de objeto literal, se requieren paréntesis alrededor de la expresión:</p>
+
+<pre class="brush: js notranslate">params =&gt; ({foo: "a"}) // devuelve el objeto {foo: "a"}</pre>
+
+<p class="syntaxbox notranslate">Los {{JSxRef("Funciones/parametros_rest", "parámetros rest")}} son compatibles:</p>
+
+<pre class="brush: js notranslate">(a, b, ...r) =&gt; expression</pre>
+
+<p class="syntaxbox notranslate">Se admiten los {{JSxRef("Funciones/Parametros_por_defecto", "parámetros predeterminados")}}:</p>
+
+<pre class="brush: js notranslate">(a=400, b=20, c) =&gt; expression</pre>
+
+<p class="brush: js">{{JSxRef("Operadores/Destructuring_assignment", "Desestructuración")}} dentro de los parámetros admitidos:</p>
+
+<pre class="brush: js notranslate">([a, b] = [10, 20]) =&gt; a + b;  // el resultado es 30
+({ a, b } = { a: 10, b: 20 }) =&gt; a + b; // resultado es 30
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Consulta también <a href="https://hacks.mozilla.org/2015/06/es6-in-depth-arrow-functions/">"ES6 en profundidad: funciones flecha" en hacks.mozilla.org</a>.</p>
+
+<h3 id="this_y_funciones_flecha">"<code>this</code>" y funciones flecha</h3>
+
+<p class="brush: js notranslate">Una de las razones por las que se introdujeron las funciones flecha fue para eliminar complejidades del ámbito ({{JSxRef("Operadores/this", "this")}}) y hacer que la ejecución de funciones sea mucho más intuitiva.</p>
+
+<div class="blockIndicator note">
+<p class="brush: js notranslate">Si <code>this</code> es un misterio para ti, consulta {{JSxRef("Operadores/this", "este documento")}} para obtener más información sobre cómo funciona <code>this</code>. Para resumir, <code>this</code> se refiere a la instancia. Las instancias se crean cuando se invoca la palabra clave <code>new</code>. De lo contrario, <code>this</code> se establecerá —de forma predeterminada— en el {{Glossary("Scope", "ámbito o alcance")}} de window.</p>
+</div>
+
+<p class="brush: js notranslate">En las <strong>funciones tradicionales</strong> de manera predeterminada <code>this</code> está en el ámbito de <code>window</code>:</p>
+
+<ul>
+</ul>
+
+<pre class="brush: js notranslate">window.age = 10; // &lt;-- ¿me notas?
+function Person() {
+  this.age = 42; // &lt;-- ¿me notas?
+  setTimeout(function () {// &lt;-- La función tradicional se está ejecutando en el ámbito de window
+    console.log("this.age", this.age); // genera "10" porque la función se ejecuta en el ámbito de window
+  }, 100);
+}
+
+var p = new Person();
+
+</pre>
+
+<p>Las <strong>funciones flecha</strong> <strong>no</strong> predeterminan <code>this</code> al {{Glossary("Scope", "ámbito o alcance")}} de <code>window</code>, más bien se ejecutan en el {{Glossary("Scope", "ámbito o alcance")}} en que se crean:</p>
+
+<pre class="brush: js notranslate">window.age = 10; // &lt;-- ¿me notas?
+function Person() {
+  this.age = 42; // &lt;-- ¿me notas?
+  setTimeout(() =&gt; {// &lt;-- Función flecha ejecutándose en el ámbito de "p" (una instancia de Person)
+    console.log("this.age", this.age); // genera "42" porque la función se ejecuta en el ámbito de Person
+  }, 100);
+}
+
+var p = new Person();
+
+</pre>
+
+<p>En el ejemplo anterior, la función flecha no tiene su propio <code>this</code>. Se utiliza el valor <code>this</code> del {{Glossary("Scope", "ámbito")}} léxico adjunto; las funciones flecha siguen las reglas normales de búsqueda de variables. Entonces, mientras busca <code>this</code> que no está presente en el {{Glossary("Scope", "ámbito")}} actual, una función flecha termina encontrando el <code>this</code> de su {{Glossary("Scope", "ámbito")}} adjunto.</p>
+
+<p><strong>Relación con el modo estricto</strong></p>
+
+<p>Dado que <code>this</code> proviene del contexto léxico circundante, en el {{JSxRef("Modo_estricto", "modo estricto")}} se ignoran las reglas con respecto a <code>this</code>.</p>
+
+<pre class="brush: js notranslate">var f = () =&gt; {
+    'use strict';
+    return this;
+};
+
+f() === window; // o el objeto global</pre>
+
+<p>Todas las demás reglas del {{JSxRef("Modo_estricto", "modo estricto")}} se aplican normalmente.</p>
+
+<div class="blockIndicator warning">
+<p><strong>Nota</strong>: Comprueba las notas sobre el {{JSxRef("Modo_estricto", "modo estricto")}}.</p>
+</div>
+
+<h3 id="Funciones_flecha_utilizadas_como_métodos">Funciones flecha utilizadas como métodos</h3>
+
+<p>Como se indicó anteriormente, las expresiones de función flecha son más adecuadas para funciones que no son métodos. Observa qué sucede cuando intentas usarlas como métodos:</p>
+
+<pre class="brush: js notranslate">'use strict';
+
+var obj = { // no crea un nuevo ámbito
+  i: 10,
+  b: () =&gt; console.log(this.i, this),
+  c: function() {
+    console.log(this.i, this);
+  }
+}
+
+obj.b(); // imprime indefinido, Window {...} (o el objeto global)
+obj.c(); // imprime 10, Object {...}</pre>
+
+<p>Las funciones flecha no tienen su propio <code>this</code>. Otro ejemplo que involucra {{JSxRef("Object.defineProperty()")}}:</p>
+
+<pre class="brush: js notranslate">'use strict';
+
+var obj = {
+  a: 10
+};
+
+Object.defineProperty(obj, 'b', {
+  get: () =&gt; {
+    console.log(this.a, typeof this.a, this); // indefinida 'undefined' Window {...} (o el objeto global)
+    return this.a + 10; // representa el objeto global 'Window', por lo tanto 'this.a' devuelve 'undefined'
+  }
+});
+</pre>
+
+<h3 id="call_apply_y_bind"><code>call</code>, <code>apply</code> y <code>bind</code></h3>
+
+<p>Los métodos {{JSxRef("Objetos_globales/Function/call", "call")}}, {{JSxRef("Objetos_globales/Function/apply", "apply")}} y {{JSxRef("Objetos_globales/Function/bind", "bind")}} <strong>NO son adecuados</strong> para las funciones flecha, ya que fueron diseñados para permitir que los métodos se ejecuten dentro de diferentes ámbitos, porque <strong>las funciones flecha establecen "<code>this</code>" según el ámbito dentro del cual se define la función flecha.</strong></p>
+
+<p>Por ejemplo, {{JSxRef("Objetos_globales/Function/call", "call")}}, {{JSxRef("Objetos_globales/Function/apply", "apply")}} y {{JSxRef("Objetos_globales/Function/bind", "bind")}} funcionan como se esperaba con las funciones tradicionales, porque establecen el ámbito para cada uno de los métodos:</p>
+
+<pre class="brush: js notranslate">// ----------------------
+// Ejemplo tradicional
+// ----------------------
+// Un objeto simplista con su propio "this".
+var obj = {
+    num: 100
+}
+
+// Establece "num" en window para mostrar cómo NO se usa.
+window.num = 2020; // ¡Ay!
+
+// Una función tradicional simple para operar en "this"
+var add = function (a, b, c) {
+  return this.num + a + b + c;
+}
+
+// call
+var result = add.call(obj, 1, 2, 3) // establece el ámbito como "obj"
+console.log(result) // resultado 106
+
+// apply
+const arr = [1, 2, 3]
+var result = add.apply(obj, arr) // establece el ámbito como "obj"
+console.log(result) // resultado 106
+
+// bind
+var result = add.bind(obj) // estable el ámbito como "obj"
+console.log(result(1, 2, 3)) // resultado 106</pre>
+
+<p>Con las funciones flecha, dado que la función <code>add</code> esencialmente se crea en el ámbito del <code>window</code> (global), asumirá que <code>this</code> es window.</p>
+
+<pre class="brush: js notranslate">// ----------------------
+// Ejemplo de flecha
+// ----------------------
+
+// Un objeto simplista con su propio "this".
+var obj = {
+    num: 100
+}
+
+// Establecer "num" en window para mostrar cómo se recoge.
+window.num = 2020; // ¡Ay!
+
+// Función flecha
+var add = (a, b, c) =&gt; this.num + a + b + c;
+
+// call
+console.log(add.call(obj, 1, 2, 3)) // resultado 2026
+
+// apply
+const arr = [1, 2, 3]
+console.log(add.apply(obj, arr)) // resultado 2026
+
+// bind
+const bound = add.bind(obj)
+console.log(bound(1, 2, 3)) // resultado 2026
+</pre>
+
+<p>Quizás el mayor beneficio de usar las funciones flecha es con los métodos a nivel del DOM (<code>setTimeout</code>, <code>setInterval</code>, <code>addEventListener</code>) que generalmente requieren algún tipo de cierre, llamada, aplicación o vinculación para garantizar que la función se ejecute en el ámbito adecuado.</p>
+
+<p><strong>Ejemplo tradicional:</strong></p>
+
+<pre class="brush: js notranslate">var obj = {
+    count : 10,
+    doSomethingLater : function (){
+        setTimeout(function(){ // la función se ejecuta en el ámbito de window
+            this.count++;
+            console.log(this.count);
+        }, 300);
+    }
+}
+
+obj.doSomethingLater(); // la consola imprime "NaN", porque la propiedad "count" no está en el ámbito de window.</pre>
+
+<p><strong>Ejemplo de flecha:</strong></p>
+
+<pre class="brush: js notranslate">var obj = {
+    count : 10,
+    doSomethingLater : function(){  // por supuesto, las funciones flecha no son adecuadas para métodos
+        setTimeout( () =&gt; { // dado que la función flecha se creó dentro del "obj", asume el "this" del objeto
+            this.count++;
+            console.log(this.count);
+        }, 300);
+    }
+}
+
+obj.doSomethingLater();</pre>
+
+<h3 id="Sin_enlace_de_arguments">Sin enlace de <code>arguments</code></h3>
+
+<p>Las funciones flecha no tienen su propio objeto {{JSxRef("Funciones/arguments", "arguments")}}. Por tanto, en este ejemplo, <code>arguments</code> simplemente es una referencia a los argumentos del ámbito adjunto:</p>
+
+<pre class="brush: js notranslate">var arguments = [1, 2, 3];
+var arr = () =&gt; arguments[0];
+
+arr(); // 1
+
+function foo(n) {
+  var f = () =&gt; arguments[0] + n; // Los argumentos implícitos de foo son vinculantes. arguments[0] es n
+  return f();
+}
+
+foo(3); // 6</pre>
+
+<p>En la mayoría de los casos, usar {{JSxRef("Funciones/parametros_rest", "parámetros rest")}} es una buena alternativa a usar un objeto <code>arguments</code>.</p>
+
+<pre class="brush: js notranslate">function foo(n) {
+  var f = (...args) =&gt; args[0] + n;
+  return f(10);
+}
+
+foo(1); // 11</pre>
+
+<h3 id="Uso_del_operador_new">Uso del operador <code>new</code></h3>
+
+<p>Las funciones flecha no se pueden usar como constructores y arrojarán un error cuando se usen con <code>new</code>.</p>
+
+<pre class="brush: js notranslate">var Foo = () =&gt; {};
+var foo = new Foo(); // TypeError: Foo no es un constructor</pre>
+
+<h3 id="Uso_de_la_propiedad_prototype">Uso de la propiedad <code>prototype</code></h3>
+
+<p>Las funciones flecha no tienen una propiedad <code>prototype</code>.</p>
+
+<pre class="brush: js notranslate">var Foo = () =&gt; {};
+console.log(Foo.prototype); // undefined
+</pre>
+
+<h3 id="Uso_de_la_palabra_clave_yield">Uso de la palabra clave <code>yield</code></h3>
+
+<p>La palabra clave {{JSxRef("Operadores/yield", "yield")}} no se puede utilizar en el cuerpo de una función flecha (excepto cuando está permitido dentro de las funciones anidadas dentro de ella). Como consecuencia, las funciones flecha no se pueden utilizar como generadores.</p>
+
+<h3 id="Cuerpo_de_función">Cuerpo de función</h3>
+
+<p>Las funciones flecha pueden tener un "cuerpo conciso" o el "cuerpo de bloque" habitual.</p>
+
+<p>En un cuerpo conciso, solo se especifica una expresión, que se convierte en el valor de retorno implícito. En el cuerpo de un bloque, debes utilizar una instrucción <code>return</code> explícita.</p>
+
+<pre class="brush: js notranslate">var func = x =&gt; x * x;
+// sintaxis de cuerpo conciso, "return" implícito
+
+var func = (x, y) =&gt; { return x + y; };
+// con cuerpo de bloque, se necesita un "return" explícito
+</pre>
+
+<h3 id="Devolver_objetos_literales">Devolver objetos literales</h3>
+
+<p>Ten en cuenta que devolver objetos literales utilizando la sintaxis de cuerpo conciso <code>params =&gt; {object: literal}</code> no funcionará como se esperaba.</p>
+
+<pre class="brush: js notranslate">var func = () =&gt; { foo: 1 };
+// ¡Llamar a func() devuelve undefined!
+
+var func = () =&gt; { foo: function() {} };
+// SyntaxError: la declaración function requiere un nombre</pre>
+
+<p>Esto se debe a que el código entre llaves ({}) se procesa como una secuencia de declaraciones (es decir, <code>foo</code> se trata como una etiqueta, no como una clave en un objeto literal).</p>
+
+<p>Debes envolver el objeto literal entre paréntesis:</p>
+
+<pre class="brush: js notranslate">var func = () =&gt; ({ foo: 1 });</pre>
+
+<h3 id="Saltos_de_línea">Saltos de línea</h3>
+
+<p>Una función flecha no puede contener un salto de línea entre sus parámetros y su flecha.</p>
+
+<pre class="brush: js notranslate">var func = (a, b, c)
+  =&gt; 1;
+// SyntaxError: expresión esperada, obtuve '=&gt;'</pre>
+
+<p>Sin embargo, esto se puede modificar colocando el salto de línea después de la flecha o usando paréntesis/llaves como se ve a continuación para garantizar que el código se mantenga bonito y esponjoso. También puedes poner saltos de línea entre argumentos.</p>
+
+<pre class="brush: js notranslate">var func = (a, b, c) =&gt;
+  1;
+
+var func = (a, b, c) =&gt; (
+  1
+);
+
+var func = (a, b, c) =&gt; {
+  return 1
+};
+
+var func = (
+  a,
+  b,
+  c
+) =&gt; 1;
+
+// no se lanza SyntaxError</pre>
+
+<h3 id="Orden_de_procesamiento">Orden de procesamiento</h3>
+
+<p>Aunque la flecha en una función flecha no es un operador, las funciones flecha tienen reglas de procesamiento especiales que interactúan de manera diferente con {{JSxRef("Operadores/Operator_Precedence", "prioridad de operadores")}} en comparación con las funciones regulares.</p>
+
+<pre class="brush: js notranslate">let callback;
+
+callback = callback || function() {}; // ok
+
+callback = callback || () =&gt; {};
+// SyntaxError: argumentos de función flecha no válidos
+
+callback = callback || (() =&gt; {});    // bien
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_básico">Uso básico</h3>
+
+<pre class="brush: js notranslate">// Una función flecha vacía devuelve undefinided
+let empty = () =&gt; {};
+
+(() =&gt; 'foobar')();
+// Devuelve "foobar"
+// (esta es una expresión de función invocada inmediatamente)
+
+var simple = a =&gt; a &gt; 15 ? 15 : a;
+simple(16); // 15
+simple(10); // 10
+
+let max = (a, b) =&gt; a &gt; b ? a : b;
+
+// Fácil filtrado de arreglos, mapeo, ...
+
+var arr = [5, 6, 13, 0, 1, 18, 23];
+
+var sum = arr.reduce((a, b) =&gt; a + b);
+// 66
+
+var even = arr.filter(v =&gt; v % 2 == 0);
+// [6, 0, 18]
+
+var double = arr.map(v =&gt; v * 2);
+// [10, 12, 26, 0, 2, 36, 46]
+
+// Cadenas de promesas más concisas
+promise.then(a =&gt; {
+  // ...
+}).then(b =&gt; {
+  // ...
+});
+
+// Funciones flecha sin parámetros que son visualmente más fáciles de procesar
+setTimeout( () =&gt; {
+  console.log('sucederá antes');
+  setTimeout( () =&gt; {
+    // código más profundo
+    console.log ('Sucederá más tarde');
+  }, 1);
+}, 1);
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-arrow-function-definitions', 'Definición de función flecha')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.functions.arrow_functions")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="https://hacks.mozilla.org/2015/06/es6-in-depth-arrow-functions/">"ES6 en profundidad: funciones flecha" en hacks.mozilla.org</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/functions/default_parameters/index.html b/files/es/web/javascript/reference/functions/default_parameters/index.html
new file mode 100644
index 0000000000..60c189363a
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/default_parameters/index.html
@@ -0,0 +1,235 @@
+---
+title: Parámetros predeterminados
+slug: Web/JavaScript/Reference/Functions/Default_parameters
+tags:
+  - Característica del lenguaje
+  - ECMAScript 2015
+  - Funciones
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Functions/Default_parameters
+original_slug: Web/JavaScript/Referencia/Funciones/Parametros_por_defecto
+---
+<div>{{jsSidebar("Functions", "Funciones")}}</div>
+
+<p><span class="seoSummary"><strong>Parámetros predeterminados de función</strong> permiten que los parámetros con nombre se inicien con valores predeterminados si no se pasa ningún valor o <code>undefined</code>.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/functions-default.html")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">function [<var>name</var>]([<var>param1</var>[ = <var>defaultValue1</var> ][, ..., <var>paramN</var>[ = <var>defaultValueN</var> ]]]) {
+   <var>statements</var>
+}
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>En JavaScript, los parámetros de función están predeterminados en {{jsxref("undefined")}}. Sin embargo, a menudo es útil establecer un valor predeterminado diferente. Aquí es donde los parámetros predeterminados pueden ayudar.</p>
+
+<p>En el pasado, la estrategia general para establecer valores predeterminados era probar los valores de los parámetros en el cuerpo de la función y asignar un valor si eran <code>undefined</code>.</p>
+
+<p>En el siguiente ejemplo, si no se proporciona ningún valor para <code><var>b</var></code> cuando se llama a <code>multiply</code>, el valor de <code><var>b</var></code> sería <code>undefined</code> al evaluar <code><var>a</var> * <var>b</var></code> y <code>multiply</code> devolvería <code>NaN</code>.</p>
+
+<pre class="brush: js notranslate">function multiply(a, b) {
+  return a * b
+}
+
+multiply(5, 2)  // 10
+multiply(5)     // NaN !
+</pre>
+
+<p>Para protegerte contra esto, usarías algo como la segunda línea, donde <code><var>b</var></code> se establece en <code>1</code> si llamas a <code>multiply</code> con un solo argumento:</p>
+
+<pre class="brush: js notranslate">function multiply(a, b) {
+  b = (typeof b !== 'undefined') ?  b : 1
+  return a * b
+}
+
+multiply(5, 2)  // 10
+multiply(5)     // 5
+</pre>
+
+<p>Con los parámetros predeterminados en ES2015, las comprobaciones en el cuerpo de la función ya no son necesarias. Ahora, puedes asignar <code>1</code> como valor predeterminado para <code><var>b</var></code> en el encabezado de la función:</p>
+
+<pre class="brush: js notranslate">function multiply(a, b = 1) {
+  return a * b
+}
+
+multiply(5, 2)          // 10
+multiply(5)             // 5
+multiply(5, undefined)  // 5
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Pasar_undefined_vs._otros_valores_falsos">Pasar <code>undefined</code> vs. otros valores falsos</h3>
+
+<p>En la segunda llamada de este ejemplo, incluso si el primer argumento se establece explícitamente en <code>undefined</code> (aunque no <code>null</code> u otros valores {{Glossary("falsy", "falsos", "", 1)}} , el valor del argumento <code><var>num</var></code> sigue siendo el predeterminado.</p>
+
+<pre class="brush: js notranslate">function test(num = 1) {
+  console.log(typeof num)
+}
+
+test()           // 'number' (num se establece en 1)
+test(undefined)  // 'number' (num se establece en 1 también)
+
+// prueba con otros valores falsos:
+test('')         // 'string' (num se establece en '')
+test(null)       // 'object' (num se establece en null)
+</pre>
+
+<h3 id="Evaluado_en_el_momento_de_la_llamada">Evaluado en el momento de la llamada</h3>
+
+<p>El argumento predeterminado se evalúa en el <em>momento de la llamada</em>. Entonces, a diferencia de (por ejemplo) Python, se crea un nuevo objeto cada vez que se llama a la función.</p>
+
+<pre class="brush: js notranslate">function append(value, array = []) {
+  array.push(value)
+  return array
+}
+
+append(1)  // [1]
+append(2)  // [2], no [1, 2]
+</pre>
+
+<p>Esto incluso se aplica a funciones y variables:</p>
+
+<pre class="brush: js notranslate">function callSomething(thing = something()) {
+  return thing
+}
+
+let numberOfTimesCalled = 0
+function something() {
+  numberOfTimesCalled += 1
+  return numberOfTimesCalled
+}
+
+callSomething()  // 1
+callSomething()  // 2
+</pre>
+
+<h3 id="Los_parámetros_anteriores_están_disponibles_para_los_parámetros_predeterminados_posteriores">Los parámetros anteriores están disponibles para los parámetros predeterminados posteriores</h3>
+
+<p>Los parámetros definidos anteriormente (a la izquierda) están disponibles para los parámetros predeterminados posteriores:</p>
+
+<pre class="brush: js notranslate">function greet(name, greeting, message = greeting + ' ' + name) {
+  return [name, greeting, message]
+}
+
+greet('David', 'Hi')                     // ["David", "Hi", "Hi David"]
+greet('David', 'Hi', 'Happy Birthday!')  // ["David", "Hi", "Happy Birthday!"]
+</pre>
+
+<p>Esta funcionalidad se puede aproximar de esta manera, lo que demuestra cuántos casos extremos se manejan:</p>
+
+<pre class="brush: js notranslate">function go() {
+  return ':P'
+}
+
+function withDefaults(a, b = 5, c = b, d = go(), e = this,
+                      f = arguments, g = this.value) {
+  return [a, b, c, d, e, f, g]
+}
+
+function withoutDefaults(a, b, c, d, e, f, g) {
+  switch (arguments.length) {
+    case 0:
+      a;
+    case 1:
+      b = 5;
+    case 2:
+      c = b;
+    case 3:
+      d = go();
+    case 4:
+      e = this;
+    case 5:
+      f = arguments;
+    case 6:
+      g = this.value;
+    default:
+  }
+  return [a, b, c, d, e, f, g];
+}
+
+withDefaults.call({value: '=^_^='});
+// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]
+
+withoutDefaults.call({value: '=^_^='});
+// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]
+</pre>
+
+<h3 id="Efectos_de_el_ámbito">Efectos de el ámbito</h3>
+
+<p>Si se definen parámetros predeterminados para uno o más parámetros, se crea un <a href="https://tc39.es/ecma262/#sec-functiondeclarationinstantiation">segundo ámbito</a> (registro de entorno), específicamente para los identificadores dentro de la lista de parámetros. Este ámbito es padre del ámbito creado para el cuerpo de la función.</p>
+
+<p>Esto significa que no se puede hacer referencia a las funciones y variables declaradas en el cuerpo de la función desde los iniciadores de parámetros de valor predeterminado; intentar hacerlo arroja un {{jsxref("ReferenceError")}} en tiempo de ejecución.</p>
+
+<p>También significa que las variables declaradas dentro del cuerpo de la función usando <code>var</code> enmascararán los parámetros del mismo nombre, en lugar de que el comportamiento habitual de las declaraciones <code>var</code> duplicadas no tenga ningún efecto.</p>
+
+<p>La siguiente función arrojará un <code>ReferenceError</code> cuando se invoca, porque el valor del parámetro predeterminado no tiene acceso al ámbito secundario del cuerpo de la función:</p>
+
+<pre class="brush: js example-bad notranslate">function f(a = go()) { // Lanza un `ReferenceError` cuando se invoca a `f`.
+  function go() { return ':P' }
+}
+</pre>
+
+<p>...y esta función imprimirá <code>undefined</code> porque la variable <code>var a</code> se eleva solo a la parte superior del ámbito creado para el cuerpo de la función (y no hasta el ámbito principal creado para la lista de parámetros):</p>
+
+<pre class="brush: js example-bad notranslate">function f(a, b = () =&gt; console.log(a)) {
+  var a = 1
+  b() // Imprime `undefined`, porque los valores de los parámetros predeterminados existen en su propio ámbito
+}
+</pre>
+
+<h3 id="Parámetros_sin_valores_predeterminados_después_de_los_parámetros_predeterminados">Parámetros sin valores predeterminados después de los parámetros predeterminados</h3>
+
+<p>Los parámetros aún se establecen de izquierda a derecha, sobrescribiendo los parámetros predeterminados incluso si hay parámetros posteriores sin valores predeterminados.</p>
+
+<pre class="brush: js notranslate">function f(x = 1, y) {
+  return [x, y]
+}
+
+f()   // [1, undefined]
+f(2)  // [2, undefined]
+</pre>
+
+<h3 id="Parámetro_desestructurado_con_asignación_de_valor_predeterminado">Parámetro desestructurado con asignación de valor predeterminado</h3>
+
+<p>Puedes usar la asignación de valor predeterminado con la notación {{jsxref("Operators/Destructuring_assignment", "la desestructuración", "", 1)}}:</p>
+
+<pre class="brush: js notranslate">function f([x, y] = [1, 2], {z: z} = {z: 3}) {
+  return x + y + z
+}
+
+f()  // 6</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Definición de Funciones')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.functions.default_parameters")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:parameter_default_values" rel="external" title="http://wiki.ecmascript.org/doku.php?id=harmony:parameter_default_values">Propuesta original en ecmascript.org</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/functions/get/index.html b/files/es/web/javascript/reference/functions/get/index.html
new file mode 100644
index 0000000000..64ecd47f91
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/get/index.html
@@ -0,0 +1,135 @@
+---
+title: get
+slug: Web/JavaScript/Reference/Functions/get
+tags:
+  - ECMAScript5
+  - JavaScript
+  - Operator
+translation_of: Web/JavaScript/Reference/Functions/get
+original_slug: Web/JavaScript/Referencia/Funciones/get
+---
+<div>{{jsSidebar("Funciones")}}</div>
+
+<p>Enlaza la propiedad de un objeto con una función que será llamada cuando la propiedad es buscada.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p><code>{get <em>prop</em>() { . . . } }</code></p>
+
+<h2 id="Parámetros">Parámetros</h2>
+
+<dl>
+ <dt><code>prop</code></dt>
+ <dd>el nombre de la propiedad a unir con la función dada</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>A veces es deseable permitir acceso a una propiedad que retorna un valor dinámicamente calculado, o si desea mostrar el estado de alguna variable interna sin requerir el uso de llamadas a métodos explícitos. En JavaScript, esto se puede lograr con el uso de un getter (captador). No es posible tener simultáneamente un getter ligado a una propiedad y que dicha propiedad tenga actualmente un valor, aunque es posible usar un getter junto con un setter para crear un tipo de pseudo-propiedad.</p>
+
+<p>Tenga en cuenta lo siguiente al trabajar con la sintaxis <code>get</code>:</p>
+
+<ul>
+ <li>Puede tener un identificador que sea un número o una cadena.</li>
+ <li>Debe tener exactamente cero parametros (ver <a href="http://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/">Cambio ES5 incompatible: las funciones getter y setter literal deben tener ahora exactamente cero o un argumento </a>para mas información);</li>
+ <li>No debe haber múltiples getters para una misma propiedad (<code>{ get x() { }, get x() { } }</code> y <code>{ x: ..., get x() { } }</code> están prohibidos).</li>
+</ul>
+
+<p>El getter puede ser removido usando el operador {{jsxref("Operadores/delete", "delete")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Example:_Defining_a_getter_with_the_get_operator" name="Example:_Defining_a_getter_with_the_get_operator">Definir un getter con el operador <code>get</code></h3>
+
+<p>Esto creará una pseudo-propiedad <code>latest</code> (ver ejemplo) del objecto <code>o</code> que podría retornar la más reciente entrada dentro de <code>o.log</code>:</p>
+
+<pre class="brush: js">var o = {
+  get latest () {
+    if (this.log.length &gt; 0) {
+      return this.log[this.log.length - 1];
+    }
+    else {
+      return null;
+    }
+  },
+  log: []
+}
+</pre>
+
+<p>Note que intentar asignar un valor a <code>latest</code> no lo cambiará.</p>
+
+<h3 id="Example:_Deleting_a_getter_using_the_delete_operator" name="Example:_Deleting_a_getter_using_the_delete_operator">Borrar un getter usando el operador <code>delete</code></h3>
+
+<pre class="brush: js">delete o.latest;
+</pre>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>Basado en la página de <a class="external" href="http://robertnyman.com/javascript/javascript-getters-setters.html#regular-getters-and-setters">página de Robert Nyman</a></p>
+
+<p>Sin soporte (notablemente en IE6-8) significa que el script lanzará un error de sintaxis.</p>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
+   <td>1</td>
+   <td>9</td>
+   <td>9.5</td>
+   <td>3</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Consulta también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/delete", "delete")}}</li>
+ <li>{{jsxref("Operators/set", "set")}}</li>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+ <li>{{jsxref("Object.defineGetter", "__defineGetter__")}}</li>
+ <li>{{jsxref("Object.defineSetter", "__defineSetter__")}}</li>
+ <li><a href="/es/JavaScript/Guide/Working_with_Objects#Defining_Getters_and_Setters" title="en/JavaScript/Guide/Working with Objects#Defining Getters and Setters">Defining Getters and Setters</a> in JavaScript Guide</li>
+</ul>
+
+<div class="noinclude">
+<p> </p>
+</div>
+
+<p> </p>
diff --git a/files/es/web/javascript/reference/functions/index.html b/files/es/web/javascript/reference/functions/index.html
new file mode 100644
index 0000000000..6ec9e945ee
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/index.html
@@ -0,0 +1,662 @@
+---
+title: Funciones
+slug: Web/JavaScript/Reference/Functions
+tags:
+  - Funciones
+  - Guia(2)
+  - JavaScript
+  - función
+translation_of: Web/JavaScript/Reference/Functions
+original_slug: Web/JavaScript/Referencia/Funciones
+---
+<div>{{jsSidebar("Functions")}}</div>
+
+<p>En términos generales, una función es un "subprograma" que puede ser <em>llamado</em> por código externo (o interno en caso de recursión) a la función. Al igual que el programa en sí mismo, una función se compone de una secuencia de declaraciones, que conforman el llamado <em>cuerpo de la función</em>. Se pueden pasar valores a una función, y la función puede <em>devolver</em> un valor.</p>
+
+<p>En JavaScript, las funciones son objetos de primera clase, es decir, son objetos y se pueden manipular y transmitir al igual que cualquier otro objeto. Concretamente son objetos {{jsxref("Function")}}.</p>
+
+<h2 id="General" name="General">General</h2>
+
+<p>Toda función en JavaScript es un objeto Function. Ver {{jsxref("Function")}} para obtener información sobre las propiedades y métodos de los objetos <code>Function</code>.</p>
+
+<p>Las funciones no son lo mismo que los procedimientos. Una función siempre devuelve un valor, pero un procedimiento, puede o no puede devolver un valor.</p>
+
+<p>Para devolver un valor especifico distinto del predeterminado, una función debe tener una sentencia {{jsxref("Sentencias/return", "return")}}, que especifique el valor a devolver. Una función sin una instrucción return devolverá el valor predeterminado. En el caso de un {{jsxref("Object.prototype.constructor", "constructor")}} llamado con la palabra clave {{jsxref("new")}}, el valor predeterminado es el valor de su parametro. Para el resto de funciones, el valor predeterminado es undefined.</p>
+
+<p>Los parámetros en la llamada a una función son los argumentos de la función. Los argumentos se pasan a las funciones <em>por valor</em>. Si la función cambia el valor de un argumento, este cambio no se refleja globalmente ni en la llamada de la función. Sin embargo, las referencias a objetos también son valores, y son especiales: si la función cambia las propiedades del objeto referenciado, ese cambio es visible fuera de la función, tal y como se muestra en el siguiente ejemplo:</p>
+
+<pre><code class="language-js"><span class="comment token">/* Declarando la función 'myFunc' */</span>
+ <span class="keyword token">function</span> <span class="function token">myFunc<span class="punctuation token">(elobjeto</span></span><span class="punctuation token">)</span>
+ <span class="punctuation token">{</span>
+   elobjeto<span class="punctuation token">.marca</span><span class="operator token">=</span> <span class="string token">"Toyota"</span><span class="brush: js">;</span>
+ <span class="punctuation token">}</span>
+
+ <span class="comment token">/*
+  * Declarando la variable 'mycar';
+  * Se crea e inicializa el nuevo objeto;
+  * para hacer referencia a él mediante 'mycar'
+  */</span>
+ <span class="keyword token">var</span> mycar <span class="operator token">=</span> <span class="punctuation token">{</span>
+   marca<span class="punctuation token">:</span> <span class="string token">"Honda"</span><span class="punctuation token">,</span>
+   modelo<span class="punctuation token">:</span> <span class="string token">"Accord"</span><span class="punctuation token">,</span>
+   año<span class="punctuation token">:</span> <span class="number token">1998</span>
+ <span class="punctuation token">}</span><span class="punctuation token">;</span>
+
+ <span class="comment token">/* Mostrando 'Honda' */</span>
+ window<span class="punctuation token">.</span><span class="function token">alert<span class="punctuation token">(</span></span>mycar<span class="punctuation token">.marca</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+ <span class="comment token">/* Paso por referencia del objeto 'mycar' a la función 'myFunc'*/</span>
+ <span class="function token">myFunc<span class="punctuation token">(</span></span>mycar<span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+ <span class="comment token">/*
+  * Muestra 'Toyota' como valor de la propiedad 'marca'
+  * del objeto, que ha sido cambiado por la función.
+  */</span>
+ window<span class="punctuation token">.</span><span class="function token">alert<span class="punctuation token">(</span></span>mycar<span class="punctuation token">.marca</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>La palabra clave <a href="/es/docs/Web/JavaScript/Referencia/Operadores/this"><code>this</code></a> no hace referencia a la función que está ejecutandose actualmente, por lo que debes referirte a los objetos Function por nombre, incluso dentro del cuerpo de la función. Como alternativa, puedes utilizar la propiedad <a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/callee">arguments.callee</a> (que no se recomienda).</p>
+
+<h2 id="Defining_functions" name="Defining_functions">Definiendo funciones</h2>
+
+<p>Hay varias formas de definir funciones:</p>
+
+<h3 id="The_function_declaration_.28function_statement.29" name="The_function_declaration_.28function_statement.29">Declaración de una función (La instrucción <code>function</code>)</h3>
+
+<p>Hay una sintaxis especial para declarar funciones (ver la instrucción {{jsxref("Sentencias/function","function")}} para más detalles):</p>
+
+<pre class="eval">function nombre([<em>param</em>[,<em>param</em>[, ...<em>param</em>]]]) {
+   instrucciones
+}
+</pre>
+
+<dl>
+ <dt><code>nombre</code></dt>
+ <dd>El nombre de la función.</dd>
+</dl>
+
+<dl>
+ <dt><code>param</code></dt>
+ <dd>El nombre de un argumento que se pasará a la función. Una función puede tener hasta 255 argumentos.</dd>
+</dl>
+
+<dl>
+ <dt><code>instrucciones</code></dt>
+ <dd>Las instruciones que forman el cuerpo de la función.</dd>
+</dl>
+
+<h3 id="The_function_declaration_.28function_statement.29" name="The_function_declaration_.28function_statement.29">Expresión de una función (El operador <code>function</code>)</h3>
+
+<p>Una expresión function es similar y tiene la misma sintaxis que una declaración de función (ver operador {{jsxref("Operadores/function", "function")}} para más detalles):</p>
+
+<pre class="eval">function [nombre]([<em>param</em>[, <em>param</em>[, ...<em>param</em>]]]) {
+   instrucciones
+}
+</pre>
+
+<dl>
+ <dt><code>nombre</code></dt>
+ <dd>El nombre de la función, se puede omitir, en ese caso la función se conoce como función anónima.</dd>
+</dl>
+
+<dl>
+ <dt><code>param</code></dt>
+ <dd>El nombre de los argumentos que se pasarán a la función. Una función puede tener hasta 255 argumentos.</dd>
+</dl>
+
+<dl>
+ <dt><code>instrucciones</code></dt>
+ <dd>Las instrucciones que forman el cuerpo de la función.</dd>
+</dl>
+
+<h3 id="La_expresión_de_función_flecha_>">La expresión de función flecha (=&gt;)</h3>
+
+<div class="note">
+<p><strong>Nota:</strong> Las expresiones de función Flecha son una tecnología experimental, parte de la proposición Harmony (EcmaScript 6) y no son ampliamente implementadas por los navegadores.</p>
+</div>
+
+<p>Una expresión de función flecha tiene una sintaxis más corta y su léxico se une a este valor (ver {{jsxref("Funciones/Arrow_functions", "arrow functions", "", 1)}} para más detalles):</p>
+
+<pre class="language-html">([param] [, param]) =&gt; { instrucciones }
+
+param =&gt; expresión
+</pre>
+
+<dl>
+ <dt><code>param</code></dt>
+ <dd>El nombre de un argumento. Si no hay argumentos se tiene que indicar con <code>()</code>. Para un único argumento no son necesarios los parentesis. (como <code>foo =&gt; 1</code>)</dd>
+ <dt><code>instrucciones o expresión</code></dt>
+ <dd>Multiples instrucciones deben ser encerradas entre llaves. Una única expresión no necesita llaves. La expresión es, así mismo, el valor de retorno implícito de esa función.</dd>
+</dl>
+
+<h3 id="The_Function_constructor" name="The_Function_constructor">El constructor <code>Function</code></h3>
+
+<p>Como todos los demás objetos, los objetos {{jsxref("Function")}} se pueden crear mediante el operador new:</p>
+
+<pre class="language-html">new Function (<em>arg1</em>, <em>arg2</em>, ... <em>argN</em>, <em>functionBody</em>)
+</pre>
+
+<dl>
+ <dt><code>arg1, arg2, ... arg<em>N</em></code></dt>
+ <dd>Ningún o varios argumentos  son pasados para ser utilizados por la función como nombres de argumentos formales. Cada uno debe ser una cadena que se ajuste a las reglas de identificadores válidos en JavaScript, o a una lista de este tipo de cadenas separadas por comas; por ejemplo "x", "theValue", o "a,b".</dd>
+</dl>
+
+<dl>
+ <dt><code>Cuerpo de la función</code></dt>
+ <dd>Una cadena conteniendo las instrucciones JavaScript que comprenden la definición de la función.</dd>
+</dl>
+
+<p>Llamar al contructor Function como una función, sin el operador new, tiene el mismo efecto que llamarlo como un constructor.</p>
+
+<div class="note"><strong>Nota:</strong> Utilizar el constructor Function no se recomienda, ya que necesita el cuerpo de la función como una cadena, lo cual puede ocasionar que no se optimize correctamente por el motor JS, y puede también causar otros problemas.</div>
+
+<h2 id="The_arguments_object" name="The_arguments_object">El objeto <code>arguments</code></h2>
+
+<p>Puedes referirte a los argumentos de una función dentro de la misma, utilizando el objeto arguments. Ver {{jsxref("Functiones/argument", "Function")}}.</p>
+
+<h2 id="Scope_and_the_function_stack" name="Scope_and_the_function_stack">Ámbito de ejecución y pila de funciones</h2>
+
+<p><span class="comment">some section about scope and functions calling other functions</span></p>
+
+<h3 id="Repaso" name="Repaso">Repaso</h3>
+
+<p>Una función puede referirse y llamarse a sí misma. Hay tres maneras en la que una función puede referirse a sí misma.</p>
+
+<ol>
+ <li>El nombre de la función</li>
+ <li>{{jsxref("arguments.callee")}}</li>
+ <li>una función dentro del ambito de ejecución que refiere a la función</li>
+</ol>
+
+<p>Por ejemplo, considere la siguiente definición de función:</p>
+
+<pre class="brush: js">var foo = function bar() {
+   // el cuerpo va aqui
+};
+</pre>
+
+<p>Dentro del cuerpo de la función, todo lo siguientes son lo mismo:</p>
+
+<ol>
+ <li><code>bar()</code></li>
+ <li><code>arguments.callee()</code></li>
+ <li><code>foo()</code></li>
+</ol>
+
+<p>Una función que se llama a sí misma es llamada una <em>función recursiva. </em>En algunas ocaciones, la recursión es análoga a un bucle. Ambos ejecutan el mismo código múltiples veces, y ambas requieren una condición (para evitar un bucle infinito, o en su lugar, recursión infinita en este caso). Por ejemplo, el siguiente bucle:</p>
+
+<pre class="brush: js">var x = 0;
+while (x &lt; 10) { // "x &lt; 10" es la condición
+   // haz algo
+   x++;
+}
+</pre>
+
+<p>puede ser convertida en una función recursiva y una llamada a esa función:</p>
+
+<pre class="brush: js">function loop(x) {
+   if (x &gt;= 10) // "x &gt;= 10" es la condición de salida (equivalente a "!(x &lt; 10)")
+      return;
+   // haz algo
+   loop(x + 1); // la llamada recursiva
+}
+loop(0);
+</pre>
+
+<p>Sin embargo, algunos algoritmos no pueden ser bucles iterativos simples. Por ejemplo, obtener todos los nodos de una estructura de arbol (e.g. el <a href="https://developer.mozilla.org/en-US/docs/DOM">DOM</a>) es realizado de manera más fácil usando recursión:</p>
+
+<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">recorrerArbol <span class="punctuation token">(</span></span>nodo<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+   <span class="keyword token">if</span> <span class="punctuation token">(</span>nodo <span class="operator token">==</span> <span class="keyword token">null</span><span class="punctuation token">)</span><span class="comment token"> //
+</span>      <span class="keyword token">return</span><span class="punctuation token">;</span>
+  <span class="comment token"> // haz algo con el nodo
+</span>   <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> i <span class="operator token">&lt;</span> nodo<span class="punctuation token">.</span>nodosHijos<span class="punctuation token">.</span>length<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+<span class="function token"><span class="punctuation token">       recorrerArbol(</span></span>nodo<span class="punctuation token">.nodosHijos</span><span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+   <span class="punctuation token">}</span>
+<span class="punctuation token">}</span></code>
+</pre>
+
+<p>En comparación con el bucle de la función <code>loop</code>, cada llamada recursiva hace muchas llamadas recursivas aquí.</p>
+
+<p>Es posible convertir cualquier algoritmo recursivo en uno no recursivo, pero a menudo la lógica es mucho más compleja y hacerlo requiere el uso de una pila. De hecho, la recursión utiliza una pila: la pila de funciones.</p>
+
+<p>El comportamiento similar a la pila se puede ver en el ejemplo siguiente:</p>
+
+<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">foo<span class="punctuation token">(</span></span>i<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+   <span class="keyword token">if</span> <span class="punctuation token">(</span>i <span class="operator token">&lt;</span> <span class="number token">0</span><span class="punctuation token">)</span>
+      <span class="keyword token">return</span><span class="punctuation token">;</span>
+   document<span class="punctuation token">.</span><span class="function token">writeln<span class="punctuation token">(</span></span><span class="string token">'inicio:'</span> <span class="operator token">+</span> i<span class="punctuation token">)</span><span class="punctuation token">;</span>
+   <span class="function token">foo<span class="punctuation token">(</span></span>i <span class="operator token">-</span> <span class="number token">1</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+   document<span class="punctuation token">.</span><span class="function token">writeln<span class="punctuation token">(</span></span><span class="string token">'fin:'</span> <span class="operator token">+</span> i<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+<span class="function token">foo<span class="punctuation token">(</span></span><span class="number token">3</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>que produce:</p>
+
+<pre class="language-html">inicio:3
+inicio:2
+inicio:1
+inicio:0
+fin:0
+fin:1
+fin:2
+fin:3
+</pre>
+
+<h2 id="Nested_functions_and_closures" name="Nested_functions_and_closures">Funciones anidadas y cierres</h2>
+
+<p>Puede anidar una función dentro de una función. La función anidada (inner) es privada a la función que la contiene (outer). También con la forma: aclosure.</p>
+
+<dl>
+ <dd>Un cierre es una expresión (normalmente una función) que puede tener variables libres junto con un entorno que enlaza esas variables (que "cierra" la expresión).<br>
+ Dado que una función anidada es un cierre, esto significa que una función anidada puede "heredar" los argumentos y las variables de su función contenedora. En otras palabras, la función interna contiene el ámbito de la función externa. <a class="external" href="http://jibbering.com/faq/faq_notes/closures.html"> </a></dd>
+</dl>
+
+<p>Desde que la función anidada es un cierre (closure), esto significa que una función anidada puede "heredar" los argumentos y variables de su función contenedora. En otras palabras, la función interna contiene un scope (alcance) de la función externa.</p>
+
+<p><span class="external">Para resumir: </span></p>
+
+<ul>
+ <li><span class="external">La función interna se puede acceder sólo a partir de sentencias en la función externa. </span></li>
+</ul>
+
+<ul>
+ <li><span class="external">La función interna forma un cierre: la función interna puede utilizar los argumentos y las variables de la función externa, mientras que la función externa no puede utilizar los argumentos y las variables de la función interna. </span></li>
+</ul>
+
+<p><span class="external">El ejemplo siguiente muestra funciones anidadas: </span></p>
+
+<pre class="eval"><span class="brush: js">function addCuadrado(a,b) {
+   function cuadrado(x) {
+      return x * x;
+   }
+   return cuadrado(a) + cuadrado(b);
+}
+a = addCuadrado(2,3); // retorna 13
+b = addCuadrado(3,4); // retorna 25
+c = addCuadrado(4,5); // retorna 41
+</span></pre>
+
+<p><span class="external">Dado que la función interna forma un cierre, puede llamar a la función externa y especificar argumentos para la función externa e interna</span></p>
+
+<pre class="eval"><span class="brush: js">function fuerade(x) {
+   function dentro(y) {
+      return x + y;
+   }
+   return dentro;
+}
+resultado = fuerade(3)(5); // retorna 8
+</span></pre>
+
+<h3 id="Efficiency_considerations" name="Efficiency_considerations"><span class="external">Consideraciones sobre la eficiencia</span></h3>
+
+<p><span class="external">Observe cómo se conserva <code>x</code> cuando se devuelve <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: #eeeeee;">dentro</span></font>. Un cierre conserva los argumentos y las variables en todos los ámbitos que contiene. Puesto que cada llamada proporciona argumentos potencialmente diferentes, debe crearse un cierre para cada llamada a la función externa. En otras palabras, cada llamada a <code>fuerade</code> crea un cierre. Por esta razón, los cierres pueden usar una gran cantidad de memoria. La memoria se puede liberar sólo cuando el <code>dentro</code> devuelto ya no es accesible. En este caso, el cierre del <code>dentro</code> se almacena en <code>resultado</code>. Como el <code>resultado</code> está en el ámbito global, el cierre permanecerá hasta que se descargue el script (en un navegador, esto sucedería cuando la página que contiene el script esté cerrada).</span></p>
+
+<p><span class="external">Debido a esta ineficiencia, evite cierres siempre que sea posible, es decir, evite las funciones de anidamiento siempre que sea posible. Por ejemplo, considere el siguiente ejemplo:</span></p>
+
+<pre class="eval"><span class="brush: js">function assignOnclick(elemento) {
+   element.onclick = function() {
+      this.style.backgroundColor = 'blue';
+   };
+}
+</span></pre>
+
+<p><span class="external">Esto se puede volver a escribir para evitar el cierre. Sin embargo, la función interna anónima necesitaría ser nombrada y ya no sería privada para <code>assignOnclick</code>: </span></p>
+
+<pre class="eval"><span class="brush: json">function assignOnclick(elemento) {
+   elemento.onclick = elemento_onclick;
+}
+
+function elemento_onclick() {
+   this.style.backgroundColor = 'blue';
+}
+</span></pre>
+
+<h4 id="Multiply-nested_functions" name="Multiply-nested_functions">Multiples funciones anidadas</h4>
+
+<p><span class="external">Las funciones pueden ser anidadas contigua de la otra, es decir, una función (A) que contiene una función (B) que contiene una función (C), etc. Ambas funciones B y C forman cierres aquí, por lo que B puede acceder a A y C pueden acceder a B. Además, como C puede acceder a B, que puede acceder a A, C también puede acceder a A. Por lo tanto, los cierres pueden contener múltiples ámbitos; contienen recursivamente el alcance de las funciones que lo contienen. Esto es llamado encadenamiento de objetos(<em>scope chaining</em>). (Por qué se llama "<em>chaining</em>"("encadenamiento") se explicará más adelante.)</span></p>
+
+<p><span class="external">Considere el siguiente ejemplo:</span></p>
+
+<pre class="eval"><span class="brush: js">function A(x) {
+   function B(y) {
+      function C(z) {
+         alert(x + y + z);
+      }
+      C(3);
+   }
+   B(2);
+}
+A(1); // alerts 6 (1 + 2 + 3)
+</span></pre>
+
+<p><span class="external">En este ejemplo, <code>C</code> accede a las <code>B</code> que hayan en <code>y</code> y <code>A</code> en <code>x</code>. Esto se puede hacer porque: </span></p>
+
+<ol>
+ <li><span class="external"><code>B</code> forma un cierre que incluye a <code>A</code>, es decir, <code>B</code> puede acceder a los argumentos y variables de <code>A</code>. </span></li>
+ <li><span class="external"><code>C</code> forma un cierre que incluye a <code>B</code>. </span></li>
+ <li><span class="external">Como el cierre de <code>B</code> incluye a <code>A</code>, el cierre de <code>C</code> incluye a <code>A</code>, <code>C</code> puede acceder a los argumentos y variables de la Banda <code>A</code>. En otras palabras, codifica los ámbitos de <code>B</code> y A en ese orden. </span></li>
+</ol>
+
+<p><span class="external">Lo contrario, sin embargo, no es cierto. <code>A</code> no puede acceder a <code>C</code>, porque <code>A</code> no puede acceder a ningún argumento o variable de <code>B</code>, que <code>C</code> es una variable de. Así, <code>C</code> permanece privado de sólo <code>B</code>. </span></p>
+
+<h3 id="Conflictos_de_nombre" name="Conflictos_de_nombre"><span class="external">Conflictos de nombre </span></h3>
+
+<p><span class="external">Cuando dos argumentos o variables en los ámbitos de un cierre tienen el mismo nombre, existe un conflicto de nombres("<em>name conflict</em>"). Más alcances internos tienen prioridad, por lo que el alcance más interno tiene la más alta precedencia, mientras que el alcance más externo toma el más bajo. Esta es la cadena de alcance. El primero en la cadena es el alcance más interno, y el último es el alcance más exterior. Considera lo siguiente:</span></p>
+
+<pre class="eval"><span class="brush: js">function fuerade() {
+   var x = 10;
+   function dentro(x) {
+      return x;
+   }
+   return dentro;
+}
+resultado = fuerade()(20); // retorna 20 en lugar de 10</span>
+</pre>
+
+<p><span class="external">El conflicto de nombres ocurre en la sentencia <code>return x</code> y está entre el parámetro <code>x</code> del <code>dentro</code>y la variable <code>x</code> del <code>fuerade</code>. La cadena de alcance aquí es {<code>dentro</code>, <code>fuerade</code>, global object}. Por lo tanto, la <code>x</code> de <code>inside</code>tiene precedentes sobre la <code>x</code> de <code>fuerade</code>, y 20 (<code>dentro</code>de <code>x</code>) se devuelve en lugar de 10 (<code>fuerade</code> de <code>x</code>).</span></p>
+
+<h2 id="constructor_versus_declaration_versus_expression" name="constructor_versus_declaration_versus_expression"><span class="external">Constructor vs declaración vs expresión</span></h2>
+
+<p><span class="external">Las diferencias entre la <code>Function</code> constructora, la de declaración y la de expresión. </span></p>
+
+<p><span class="external">Compare lo siguiente: </span></p>
+
+<ol>
+ <li><span class="external">Una función definida con el constructor <code>Function</code> asignado a la variable <code>multiply</code>                                                                                                                    </span>
+
+  <pre><span class="brush: js">var multiply = new Function("x", "y", "return x * y;");
+</span></pre>
+ </li>
+ <li><span class="external">Una declaración de una función denominada <code>multiply</code>                                                 </span>
+  <pre><span class="brush: js">function multiply(x, y) {
+   return x * y;
+}
+</span></pre>
+ </li>
+ <li><span class="external">Una expresión de función anónima asignada a la variable <code>multiply</code>                          </span>
+  <pre><span class="brush: js">var multiply = function(x, y) {
+   return x * y;
+}
+</span></pre>
+ </li>
+ <li><span class="external">Una declaración de una función denominada <code>func_name</code> asignada a la variable <code>multiply</code>                                                                                                                 </span>
+  <pre><span class="brush: js">var multiply = function func_name(x, y) {
+   return x * y;
+}
+</span></pre>
+ </li>
+</ol>
+
+<p><span class="external">Todos hacen aproximadamente la misma cosa, con algunas diferencias sutiles:</span></p>
+
+<ul>
+ <li><span class="external">Existe una distinción entre el nombre de la función y la variable a la que se asigna la función:</span><span class="external"> </span>
+
+  <ul>
+   <li><span class="external">El nombre de la función no se puede cambiar, mientras que la variable a la que se asigna la función puede ser reasignada.</span></li>
+   <li><span class="external">El nombre de la función sólo se puede utilizar en el cuerpo de la función. Intentar utilizarlo fuera del cuerpo de la función da como resultado un error (o <code>undefined</code> si el nombre de la función se declaró previamente mediante una instrucción <code>var</code>). Por ejemplo:                                                                                                           </span>
+    <pre><span class="brush: js">var y = function x() {};
+alert(x); // arroja un error
+</span></pre>
+
+    <p><span class="external">El nombre de la función también aparece cuando la función se serializa vía el método de la </span><code>Function</code> 'toString'.</p>
+
+    <p>Por otro lado, la variable a la que se asigna la función está limitada sólo por su ámbito, que está garantizado para incluir el ámbito en el que se declara la función.</p>
+   </li>
+   <li>Como muestra el ejemplo 4, el nombre de la función puede ser diferente de la variable a la que se asigna la función. No tienen relación entre sí.</li>
+  </ul>
+ </li>
+ <li>Una declaración de función también crea una variable con el mismo nombre que el nombre de la función. Por lo tanto, a diferencia de las definidas por las expresiones de función, las funciones definidas por las declaraciones de función se puede acceder por su nombre en el ámbito que se definieron en:
+  <pre class="brush: js">function x() {}
+alert(x); // salida x serializado en un string
+</pre>
+
+  <p>El siguiente ejemplo muestra cómo los nombres de las funciones no están relacionados con las variables a las que están asignadas las funciones. Si una "variable de función" se asigna a otro valor, seguirá teniendo el mismo nombre de función:</p>
+
+  <pre class="brush: js">function foo() {}
+alert(foo); // el string alterado contiene el nombre
+            // de la función "foo"
+var bar = foo;
+alert(bar); // el string todavía contiene el nombre
+            // de la función "foo"
+</pre>
+ </li>
+ <li>Una función definida por un<code>Function</code> no tiene un nombre de función. Sin embargo, en el <a href="/es/docs/Mozilla/Projetos/SpiderMonkey">SpiderMonkey</a> en el motor de JavaScript, la forma serializada de la función muestra como si tuviera el nombre "anónimo"("anonymous"). Por ejemplo, <code>alert(new Function())</code> salida:
+  <pre class="brush: js">function anonymous() {
+}
+</pre>
+
+  <p>Dado que la función en realidad no tiene un nombre, <code>anonymous</code> no es una variable que se puede acceder dentro de la función. Por ejemplo, lo siguiente resultaría en un error:</p>
+
+  <pre class="brush: js">var foo = new Function("alert(anonymous);");
+foo();
+</pre>
+ </li>
+ <li>A diferencia de las funciones definidas por expresiones de función o constructores <code>Function</code> se puede utilizar una función definida por una declaración de función antes de la propia declaración de la función. Por ejemplo:
+  <pre class="brush: js">foo(); // alerts FOO!
+function foo() {
+   alert('FOO!');
+}
+</pre>
+ </li>
+ <li>Una función definida por una expresión de función hereda el ámbito actual. Es decir, la función forma un cierre. Por otro lado, una función definida por un constructor de <code>Function</code> no hereda ningún ámbito que no sea el ámbito global (que todas las funciones heredan).</li>
+ <li>Las funciones definidas por expresiones de función y declaraciones de función son analizadas una sola vez, mientras que las definidas por el constructor de <code>Function</code> no lo son. Es decir, la cadena de cuerpo de función pasada al constructor de <code>Function</code> debe ser analizada cada vez que se evalúa.  Aunque una expresión de función crea un cierre cada vez, el cuerpo de la función no es reparsed, por lo que las expresiones de función son aún más rápido que "<code>new Function(...)</code>". Por lo tanto, el constructor de la <code>Function</code> debe evitarse siempre que sea posible.</li>
+</ul>
+
+<p>Una declaración de función es muy fácilmente (ya menudo involuntariamente) convertida en una expresión de función. Una declaración de función deja de ser una cuando:</p>
+
+<ul>
+ <li>Se convierte en parte de una expresión</li>
+ <li>Ya no es un "elemento fuente" de una función o el propio script. Un "elemento de origen" es una sentencia no anidada en el script o un cuerpo de función:
+  <pre class="brush: js">var x = 0;               // elemento fuente
+if (x == 0) {            // elemento fuente
+   x = 10;               // no es un elemento fuente
+   function boo() {}     // no es un elemento fuente
+}
+function foo() {         // elemento fuente
+   var y = 20;           // elemento fuente
+   function bar() {}     // elemento fuente
+   while (y == 10) {     // elemento fuente
+      function blah() {} // no es un elemento fuente
+      y++;               // no es un elemento fuente
+   }
+}
+</pre>
+ </li>
+</ul>
+
+<p>Ejemplos:</p>
+
+<ul>
+ <li>
+  <pre class="brush: js">// function declaración
+function foo() {}
+
+// expresión de una función
+(function bar() {})
+
+// expresión de una función
+x = function hello() {}
+</pre>
+ </li>
+ <li>
+  <pre class="brush: js">if (x) {
+   // expresión de la función
+   function world() {}
+}
+</pre>
+ </li>
+ <li>
+  <pre class="brush: js">// instrucción de la función
+function a() {
+   // instrucción de la función
+   function b() {}
+   if (0) {
+      // expresión de la función
+      function c() {}
+   }
+}
+</pre>
+ </li>
+</ul>
+
+<h3 id="Conditionally_defining_a_function" name="Conditionally_defining_a_function">Definición condicional de una función</h3>
+
+<p>Las funciones se pueden definir de forma condicional utilizando expresiones de función o el constructor <code>Function</code>.</p>
+
+<p>En la siguiente secuencia de comandos, la función <code>zero</code> nunca se define y no se puede invocar, porque '<code>if (0)</code>' se evalúa como false:</p>
+
+<pre class="brush: js">if (0)
+   function zero() {
+      document.writeln("Esto es zero.");
+   }
+</pre>
+
+<p>Si se cambia el script para que la condición se convierta en '<code>if (1)</code>', se define la función <code>zero</code>.</p>
+
+<div class="note">
+<p>Nota: Aunque esto parece una declaración de función, ésta es en realidad una expresión de función ya que está anidada dentro de otra instrucción. Ver <a href="#constructor_versus_declaration_versus_expression">las diferencias entre las funciones de declaración y de expresión</a>.</p>
+</div>
+
+<div class="note">
+<p>Nota: Algunos motores JavaScript, sin incluir <a href="/es/docs/Mozilla/Projetos/SpiderMonkey">SpiderMonkey</a>, tratan incorrectamente cualquier expresión de función con un nombre como una declaración de función. Esto llevaría a que se definiera <code>zero</code> incluso con el siempre-falso("<em>always-false</em>") condicional. Una manera más segura de definir funciones condicionalmente es definir la función anónimamente y asignarla a una variable:</p>
+</div>
+
+<pre class="brush: js">if (0)
+   var zero = function() {
+      document.writeln("Esto es zero.");
+   }
+</pre>
+
+<h2 id="Functions_as_event_handlers" name="Functions_as_event_handlers">Funciones como manejadores de eventos</h2>
+
+<p>En JavaScript, los controladores de eventos <a href="es/DOM">DOM</a> son funciones (en oposición a los objetos que contienen un método <code>handleEvent</code> en otros enlaces de idioma DOM). Las funciones se pasan un objeto de <a href="es/DOM/event">evento</a> como el primer y único parámetro. Como cualquier otro parámetro, si el objeto de evento no necesita ser utilizado, puede omitirse en la lista de parámetros formales.</p>
+
+<p>Los posibles objetivos de eventos en un documento <a href="es/HTML">HTML</a> incluyen: <code>window</code> (<code>Window</code> objects("objeto de ventana"), including frames("marcos")), <code>document</code> (<code>HTMLDocument</code> objects("objetos HTMLDocument")), y elementos (<code>Element</code> objects("objetos Elemento")). En el <a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/">HTML DOM</a>, los destinos de evento tienen propiedades de controlador de eventos. Estas propiedades son nombres de eventos en minúsculas con prefijo "on", e.g. <code>onfocus</code>. Los eventos <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/">DOM Level 2 Events</a> proporcionan una forma alternativa y más sólida de agregar oyentes de eventos.</p>
+
+<div class="note">
+<p>Nota: Los eventos son parte del DOM, no de JavaScript. (JavaScript simplemente proporciona un enlace al DOM.)</p>
+</div>
+
+<p>El ejemplo siguiente asigna una función a un manejador de eventos de "foco"("focus") de ventana.</p>
+
+<pre>window.onfocus = function() {
+   document.body.style.backgroundColor = 'white';
+}
+</pre>
+
+<p>Si se asigna una función a una variable, puede asignar la variable a un controlador de eventos. El siguiente código asigna una función a la variable <code>setBGColor</code>.</p>
+
+<pre>var setBGColor = new Function("document.body.style.backgroundColor = 'white';");
+</pre>
+
+<p>Puede utilizar esta variable para asignar una función a un controlador de eventos de varias maneras. Aquí hay dos formas:</p>
+
+<ol>
+ <li>Escritura con propiedades de evento DOM HTML<br>
+
+  <pre>document.form1.colorButton.onclick = setBGColor;
+</pre>
+ </li>
+ <li>Atributo de evento HTML<br>
+
+  <pre>&lt;input name="colorBoton" type="button"
+   value="Cambia color de fondo"
+   onclick="setBGColor();"/&gt;
+</pre>
+
+  <p>Un manejador de eventos establecido de esta manera es en realidad una función, denominada después del atributo, envuelta alrededor del código especificado. Esta es la razón por la que los paréntesis en "<code>setBGColor()</code>" son necesarios aquí (en lugar de sólo "<code>setBGColor</code>").</p>
+ </li>
+</ol>
+
+<p>Es equivalente a:</p>
+
+<pre>document.form1.colorButton.onclick = function onclick(event) {
+   setBGColor();
+}
+</pre>
+
+<p>Observe cómo se pasa el objeto de evento a esta función anónima como <code>event</code> de parámetro. Esto permite que el código especificado utilice el objeto Evento("Event object)":</p>
+
+<pre>&lt;input ...
+    onclick="alert(event.target.tagName);"/&gt;
+</pre>
+
+<p>Al igual que cualquier otra propiedad que se refiere a una función, el controlador de eventos puede actuar como un método, y <code>this</code> se refiere al elemento que contiene el controlador de eventos. En el ejemplo siguiente, se llama a la función referida por <code>onfocus</code> con <code>this</code> igual a <code>window</code>.</p>
+
+<pre class="eval">window.onfocus();
+</pre>
+
+<p>Un error común de principiante de JavaScript es el añadir paréntesis y / o parámetros al final de la variable, es decir, llamar al manejador de eventos cuando lo asigna. La adición de estos paréntesis asignará el <em>valor devuelto al llamar al manejador de eventos</em>, que a menudo es <code>undefined</code> (si la función no devuelve nada), en lugar del controlador de eventos en sí:</p>
+
+<pre class="eval">document.form1.button1.onclick = setBGColor();
+</pre>
+
+<p>Para pasar parámetros a un manejador de eventos, el manejador debe ser envuelto en otra función de la siguiente manera:</p>
+
+<pre class="eval">document.form1.button1.onclick = function() {
+   setBGColor('Algun valor');
+};
+</pre>
+
+<h3 id="Backward_compatibility" name="Backward_compatibility">Compatibilidad con versiones anteriores</h3>
+
+<h4 id="JavaScript_1.1_and_earlier" name="JavaScript_1.1_and_earlier">JavaScript 1.1 y anteriores</h4>
+
+<p>No puede anidar una sentencia de función en otra instrucción o en sí misma.</p>
+
+<h3 id="Local_variables_within_functions" name="Local_variables_within_functions">Variables locales dentro de las funciones</h3>
+
+<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments">arguments</a>: Objeto similar a una matriz que contiene los argumentos pasados a la función en ejecución.</p>
+
+<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/callee">arguments.callee</a>: Especifica la función en ejecución.</p>
+
+<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/caller">arguments.caller</a>: Especifica la función que invocó la función en ejecución.</p>
+
+<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/length">arguments.length</a>: Especifica el número de argumentos pasados a la función.</p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<h4 id="1.29_Returning_a_formatted_number" name="1.29_Returning_a_formatted_number">1) Devolver un número con formato</h4>
+
+<p>La siguiente función devuelve una cadena que contiene la representación formateada de un número rellenado con ceros a la izquierda.</p>
+
+<pre class="eval">// Esta función devuelve una cadena rellenada con ceros a la izquierda
+
+function padZeros(num, totalLen) {
+   var numStr = num.toString();             // Inicializa un valor de retorno como cadena
+   var numZeros = totalLen - numStr.length; // Calcula el no. de ceros
+   for (var i = 1; i &lt;= numZeros; i++) {
+      numStr = "0" + numStr;
+   }
+   return numStr;
+}
+</pre>
+
+<p>Las siguientes sentencias llaman a la función padZeros.</p>
+
+<pre class="eval">var resultado;
+resultado = padZeros(42,4); // retorna "0042"
+resultado = padZeros(42,2); // retorna "42"
+resultado = padZeros(5,4);  // retorna "0005"
+</pre>
+
+<h4 id="2.29_Determining_whether_a_function_exists" name="2.29_Determining_whether_a_function_exists">2) Determinar si existe una función</h4>
+
+<p>Puede determinar si existe una función utilizando el operador <code>typeof</code>. En el ejemplo siguiente, se realiza una prueba para determinar si el objeto <code>window</code> tiene una propiedad llamada <code>noFunc</code> que es una función. Si es así, se utiliza; de lo contrario, se tomarán otras medidas.</p>
+
+<pre> if ('function' == typeof window.noFunc) {
+   // utiliza noFunc()
+ } else {
+   // hacer algo mas
+ }
+</pre>
+
+<div class="note">
+<p>Nota: Tenga en cuenta que en la prueba <code>if</code>, e utiliza una referencia a <code>noFunc</code> aquí no hay paréntesis "()" después del nombre de la función para que la función real no se llame.</p>
+</div>
+
+<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
+
+<p><a href="es/Referencia_de_JavaScript_1.5/Objetos_globales/Function">Function</a>, <a href="es/Referencia_de_JavaScript_1.5/Sentencias/function">sentencia function</a>, <a href="es/Referencia_de_JavaScript_1.5/Operadores/Operadores_globales/function">operador function</a></p>
+
+<p>{{ languages( { "en": "en/Core_JavaScript_1.5_Reference/Functions", "ru": "ru/\u042f\u0434\u0440\u043e_JavaScript_1.5_\u0421\u043f\u0440\u043e\u0432\u0447\u043d\u0438\u043a/Functions", "fr": "fr/R\u00e9f\u00e9rence_de_JavaScript_1.5_Core/Fonctions", "ja": "ja/Core_JavaScript_1.5_Reference/Functions" } ) }}</p>
diff --git a/files/es/web/javascript/reference/functions/method_definitions/index.html b/files/es/web/javascript/reference/functions/method_definitions/index.html
new file mode 100644
index 0000000000..d8c4e43051
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/method_definitions/index.html
@@ -0,0 +1,227 @@
+---
+title: Method definitions
+slug: Web/JavaScript/Reference/Functions/Method_definitions
+translation_of: Web/JavaScript/Reference/Functions/Method_definitions
+original_slug: Web/JavaScript/Referencia/Funciones/Method_definitions
+---
+<div>{{JsSidebar("Functions")}}</div>
+
+<div>A partir de ECMAScript 2015 (ES6), se introdujo una sintaxis abreviada para la definición de métodos en inicializadores de objetos. Es una forma abreviada para la asignación de una función al nombre del método.</div>
+
+<div> </div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var obj = {
+  <var>property</var>( <var>parameters…</var> ) {},
+  *<var>generator</var>( <var>parameters…</var> ) {},
+// also with computed keys:
+  [property]( <var>parameters…</var> ) {},
+  *[generator]( <var>parameters…</var> ) {},
+// compare ES5 getter/setter syntax:
+  get <var>property</var>() {},
+  set <var>property</var>(<var>value</var>) {}
+};
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La sintaxis abreviada es similar a la introducida en ECMAScript 5 con <a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">getter</a> y <a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">setter</a>.</p>
+
+<p>Dado el siguiente código:</p>
+
+<pre class="brush: js">var obj = {
+  foo: function() {},
+  bar: function() {}
+};</pre>
+
+<p>Ahora se puede abreviar esto mismo como:</p>
+
+<pre class="brush: js">var obj = {
+  foo() {},
+  bar() {}
+};</pre>
+
+<div class="note">
+<p><strong>Nota :</strong> La sintaxis abreviada usa funciones con nombre en lugar de funciones anónimas (como en …<code>foo: function() {}</code>…). Las funciones con nombre pueden ser llamadas desde el cuerpo de la función (esto es imposible con funciones anónimas, ya que no existe un identificador al que referirse). Para más detalles, ver {{jsxref("Operators/function","function","#Examples")}}.</p>
+</div>
+
+<h3 id="Abreviatura_de_métodos_generadores">Abreviatura de métodos generadores</h3>
+
+<p>Los <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">métodos generadores</a> también pueden definirse usando la sintaxis abreviada. Note que el asterisco (*) en la sintaxis abreviada debe estar antes del nombre de propiedad del generador. Esto es, <code>* g(){}</code> funcionará, pero <code>g *(){}</code> no.</p>
+
+<pre class="brush: js;highlight[12]">// Usando una propiedad con nombre (pre-ES6)
+var obj2 = {
+  g: function*() {
+    var index = 0;
+    while(true)
+      yield index++;
+  }
+};
+
+// El mismo objeto, usando la sintaxis abreviada
+var obj2 = {
+  * g() {
+    var index = 0;
+    while(true)
+      yield index++;
+  }
+};
+
+var it = obj2.g();
+console.log(it.next().value); // 0
+console.log(it.next().value); // 1</pre>
+
+<h3 id="Las_definiciones_de_métodos_no_son_constructores_(instanciables_con_new)">Las definiciones de métodos no son constructores (instanciables con new)</h3>
+
+<p>Las las definiciones de métodos no son constructores y generarán un {{jsxref("TypeError")}} si intenta instanciarlos.</p>
+
+<pre class="brush: js example-bad">var obj = {
+  method() {},
+};
+new obj.method; // TypeError: obj.method no es un constructor
+
+var obj = {
+  * g() {}
+};
+new obj.g; // TypeError: obj.g no es un constructor (cambiado en ES2016)
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Caso_de_prueba_simple">Caso de prueba simple</h3>
+
+<pre class="brush: js;highlight[3]">var obj = {
+  a : "foo",
+  b(){ return this.a; }
+};
+console.log(obj.b()); // "foo"
+</pre>
+
+<h3 id="Nombres_de_propiedad_computados">Nombres de propiedad computados</h3>
+
+<p>La sintaxis abreviada también soporta nombres de propiedades computados.</p>
+
+<pre class="brush: js;highlight[4]">var bar = {
+  foo0 : function (){return 0;},
+  foo1(){return 1;},
+  ["foo" + 2](){return 2;},
+};
+
+console.log(bar.foo0()); // 0
+console.log(bar.foo1()); // 1
+console.log(bar.foo2()); // 2</pre>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-method-definitions', 'Method definitions')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES7', '#sec-method-definitions', 'Method definitions')}}</td>
+   <td>{{Spec2('ES7')}}</td>
+   <td>Cambiado el que los métodos generadores no deban tener una  trampa [[Construct]] y deban fallar cuando se usen con <code>new</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Definición de métodos abreviada</td>
+   <td>{{CompatChrome("39")}}</td>
+   <td>{{CompatGeckoDesktop("34")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera("26")}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Métodos generadors no son constructores (ES2016)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("43")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Definición de métodos abreviada</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("34")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Métodos generadores no son constructores (ES2016)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("43")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_específicas_para_SpiderMonkey">Notas específicas para SpiderMonkey</h2>
+
+<ul>
+ <li>Anteriormente a SpiderMonkey 38 {{geckoRelease(38)}},  "<code>get</code>" y "<code>set</code>" eran nombres no válidos para métodos generadores. Esto ha sido corregido en {{bug(1073809)}}.</li>
+ <li>Anteriormente a SpiderMonkey 41 {{geckoRelease(41)}}, las llaves no eran requeridas en las definiciones de métodos. Estas son requeridas de ahora en adelante conforme a la especificación ES6 y su omisión arrojará un {{jsxref("SyntaxError")}} en esta versión y posteriores ({{bug(1150855)}}).
+  <pre class="brush: js example-bad">var o = {x() 12}; // SyntaxError</pre>
+ </li>
+ <li>La restricción de que sólo los métodos generadores sean constructores fue implementada en SpiderMonkey 41 {{geckoRelease(41)}}. Ver también {{bug(1059908)}} y {{bug(1166950)}}.</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">get</a></code></li>
+ <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">set</a></code></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Lexica grammatical</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/functions/rest_parameters/index.html b/files/es/web/javascript/reference/functions/rest_parameters/index.html
new file mode 100644
index 0000000000..cb17f0f437
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/rest_parameters/index.html
@@ -0,0 +1,267 @@
+---
+title: Parámetros Rest
+slug: Web/JavaScript/Reference/Functions/rest_parameters
+tags:
+  - Funciones
+  - JavaScript
+  - Parametros Rest
+translation_of: Web/JavaScript/Reference/Functions/rest_parameters
+original_slug: Web/JavaScript/Referencia/Funciones/parametros_rest
+---
+<div>{{jsSidebar("Functions")}}</div>
+
+<p>La sintaxis de los <strong>parámetros rest </strong>nos permiten representar un número indefinido de argumentos como un array.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/functions-restparameters.html")}}</p>
+
+<p>La fuente interactiva de este ejemplo es almacenado en un repositorio de GitHub. Si a ti te gustaría contribuir al proyecto de ejemplos interactivos, por favor clona este repositorio <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull-request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: js notranslate">function(a, b, ...theArgs) {
+  // ...
+}
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p class="brush: js">El último parámetro de una función se puede prefijar con <code>...</code>, lo que hará que todos los argumentos restantes (suministrados por el usuario) se coloquen dentro de un array de javascript "estándar".</p>
+
+<p class="brush: js">Sólo el último parámetro puede ser un "parámetro rest".</p>
+
+<pre class="brush: js notranslate">function myFun(a, b, ...manyMoreArgs) {
+  console.log("a", a);
+  console.log("b", b);
+  console.log("manyMoreArgs", manyMoreArgs);
+}
+
+myFun("one", "two", "three", "four", "five", "six");
+
+// Console Output:
+// a, one
+// b, two
+// manyMoreArgs, [three, four, five, six]
+</pre>
+
+<h3 id="Diferencia_entre_los_parámetros_rest_y_el_objeto_arguments">Diferencia entre los parámetros rest y el objeto <code>arguments</code></h3>
+
+<p>Hay tres principales diferencias entre los parámetros rest y el objeto <a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments" title="arguments"><code>arguments</code></a>:</p>
+
+<ul>
+ <li>los parámetros rest son sólo aquellos a los que no se les ha asignado un nombre, mientras que el objeto <code>arguments</code> contiene todos los argumentos que se le han pasado a la función;</li>
+ <li>el objeto <code>arguments</code> no es un array real, mientras que los parámetros rest son instancias de  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" title="Array"><code>Array</code></a> , lo que significa que lo los métodos como <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort" title="Array sort method"><code>sort</code></a>, <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map" title="Array map method"><code>map</code></a>, <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach" title="Array forEach method"><code>forEach</code></a> o <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop" title="Array pop method"><code>pop</code></a> pueden aplicarse directamente;</li>
+ <li>el objeto <code>arguments</code> tiene una funcionalidad adicional específica para sí mismo (como la propiedad <code>callee</code>).</li>
+</ul>
+
+<h3 id="De_argumentos_a_array">De argumentos a array</h3>
+
+<p>Los parámetros rest han sido agregados para reducir el código repetitivo que se usaba en los parámetros.</p>
+
+<pre class="brush: js notranslate">// Antes de los parámetros rest, "arguments" se podía convertir en un array usando:
+
+function f(a, b) {
+
+  let normalArray = Array.prototype.slice.call(arguments)
+  // -- o  --
+  let normalArray = [].slice.call(arguments)
+  // -- o  --
+  let normalArray = Array.from(arguments)
+
+  let first = normalArray.shift()  // OK, nos da el primer argumento
+  let first = arguments.shift()    // ERROR (arguments no es un array)
+}
+
+// Ahora, puedes acceder fácilmente a un array usando un parametro rest.
+
+function f(...args) {
+  let normalArray = args
+  let first = normalArray.shift() // OK, gives the first argument
+}</pre>
+
+<h3 id="Desestructuración_de_los_parametros_rest">Desestructuración de los parametros rest</h3>
+
+<p>Los parámetros rest pueden ser desestructurados, eso significa que sus datos pueden ser desempaquetados dentro de distintas variables. Ver <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">Destructuring assignment</a>.</p>
+
+<pre class="notranslate"><code>function f(...[a, b, c]) {
+  return a + b + c;
+}
+
+f(1)          // NaN (b y c son indefinidos)
+f(1, 2, 3)    // 6
+f(1, 2, 3, 4) // 6 (el cuarto parámetro no está desestructurado)</code></pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_parámetros_rest">Usando parámetros rest</h3>
+
+<p>En este ejemplo, el primer argumento es mapeado con 'a' y el segundo con 'b', entonces, esos argumentos nombrados, son usados normalmente</p>
+
+<p>De todas formas, el tercer argumento, <code>manyMoreArgs</code>, será un array que contendrá tantos argumentos como el usuario incluya (3er, 4to, 5to ...).</p>
+
+<pre class="brush: js notranslate">function myFun(a, b, ...manyMoreArgs) {
+  console.log("a", a)
+  console.log("b", b)
+  console.log("manyMoreArgs", manyMoreArgs)
+}
+
+myFun("one", "two", "three", "four", "five", "six")
+
+// a, one
+// b, two
+// manyMoreArgs, [three, four, five, six]</pre>
+
+<p>Debajo... incluso si hay solo un valor, el ultimo argumento seguirá siendo colocado dentro de un array.</p>
+
+<pre class="brush: js notranslate">// usando la misma definición de función del ejemplo anterior
+myFun("one", "two", "three")
+
+// a, one
+// b, two
+// manyMoreArgs, [three]</pre>
+
+<p>Debajo, el tercer argumento no esta provisto, pero <code>manyMoreArgs</code> continúa siendo un array (aunque uno vacío).</p>
+
+<pre class="brush: js notranslate">//usando la misma definición de función del ejemplo anterior
+
+myFun("one", "two")
+
+// a, one
+// b, two
+// manyMoreArgs, []</pre>
+
+<h3 id="Argument_length">Argument length</h3>
+
+<p>Puesto que <code>theArgs</code> es un array, su tamaño (un conteo de sus elementos) es dado por la propiedad <code>length</code> :</p>
+
+<pre class="brush: js notranslate">function fun1(...theArgs) {
+  console.log(theArgs.length);
+}
+
+fun1();  // 0
+fun1(5); // 1
+fun1(5, 6, 7); // 3
+</pre>
+
+<h3 id="Ordinary_parameter_and_rest_parameters">Ordinary parameter and rest parameters</h3>
+
+<p>En el siguiente ejemplo, se usa un parámetro rest para agrupar  dentro de un array a todos los argumentos despues del primero.  Luego cada uno es multiplicado por el primero y el arreglo es retornado:</p>
+
+<pre class="brush: js notranslate">function multiply(multiplier, ...theArgs) {
+  return theArgs.map(function (element) {
+    return multiplier * element;
+  });
+}
+
+let arr = multiply(2, 1, 2, 3);
+console.log(arr); // [2, 4, 6]
+</pre>
+
+<p>El siguiente ejemplo muestra que se puede usar los métodos de <code>Array</code> en los parámetros rest , pero no en el objeto <code>arguments</code>:</p>
+
+<pre class="brush: js notranslate">function sortRestArgs(...theArgs) {
+  var sortedArgs = theArgs.sort();
+  return sortedArgs;
+}
+
+console.log(sortRestArgs(5,3,7,1)); // muestra 1,3,5,7
+
+function sortArguments() {
+  var sortedArgs = arguments.sort();
+  return sortedArgs; // esto nunca va a ocurrir
+}
+
+// lanza un TypeError: arguments.sort is not a function
+console.log(sortArguments(5,3,7,1));
+</pre>
+
+<p>Para poder usar los métodos de  <code>Array</code> en el objeto <code>arguments</code>, se debe convertir a un <code>Array</code> primero.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-function-definitions', 'Function Definitions')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>definción inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatChrome(47)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("15.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>34</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(47)}}</td>
+   <td>{{CompatGeckoMobile("15.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(47)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator" title="spread operator">Spread Operator</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments" title="arguments">Arguments object</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" title="Arreglos">Array</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions" title="Functions and function scope">Functions</a></li>
+ <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:rest_parameters">Original proposal at ecmascript.org</a></li>
+ <li><a class="external" href="http://javascriptweblog.wordpress.com/2011/01/18/javascripts-arguments-object-and-beyond/">JavaScript arguments object and beyond</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">Destructuring assignment</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/functions/set/index.html b/files/es/web/javascript/reference/functions/set/index.html
new file mode 100644
index 0000000000..33e15fbda4
--- /dev/null
+++ b/files/es/web/javascript/reference/functions/set/index.html
@@ -0,0 +1,218 @@
+---
+title: setter
+slug: Web/JavaScript/Reference/Functions/set
+translation_of: Web/JavaScript/Reference/Functions/set
+original_slug: Web/JavaScript/Referencia/Funciones/set
+---
+<div>{{jsSidebar("Funciones")}}</div>
+
+<p>La sintaxis  <strong><code>set</code></strong>  asocia la propiedad de un objeto a una función que será llamada cuando haya un intento de asignar valor a esa propiedad.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">{set <em>prop</em>(<em>val</em>) { . . . }}
+{set [expression](<em>val</em>) { . . . }}</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><em><code>prop</code></em></dt>
+ <dd>El nombre de la propiedad a asociar con la función dada.</dd>
+</dl>
+
+<dl>
+ <dt><em><code>val</code></em></dt>
+ <dd>Un alias para la variable que contiene el valor a asignar a la <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">propiedad</span></font>.</dd>
+ <dt><em><code>expression</code></em></dt>
+ <dd>A partir de ECMAScript 2015, se puede también usar expresiones para nombres de propiedades computados para asociar a la función dada.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>En JavaScript, un setter puede ser usado para ejecutar una función donde sea que una propiedad se intente cambiar. Los setters son regularmente usados en conjunto con getters para crear un tipo de pseudo-propiedad. No es posible tener simultáneamente un setter en una propiedad que ya tiene un valor.</p>
+
+<p>Tenga en cuenta lo siguiente al trabajar con setters:</p>
+
+<div>
+<ul>
+ <li>Puede tener un identificador ya sea number o string;</li>
+ <li>Debe tener exactamente un parámentro (ver <a class="external" href="http://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/" rel="external nofollow">Incompatible <abbr title="ECMAScript 5th edition">ES5</abbr> change: literal getter and setter functions must now have exactly zero or one arguments</a> para más información);</li>
+ <li>No debe aparecer en un objeto de notación literal con otro <code>set</code> o con otra entrada de datos con la misma propiedad.<br>
+  ( <code>{ set x(v) { }, set x(v) { } }</code> y <code>{ x: ..., set x(v) { } }</code> están prohibidos )</li>
+</ul>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Definiendo_un_setter_en_el_inicializador_de_nuevos_objetos">Definiendo un setter en el inicializador de nuevos objetos</h3>
+
+<p>En el siguiente ejemplo definimos una pseudo-propiedad  <code>actual</code>  al objeto <code>lenguaje</code>. Cuando se le asigne un valor a <code>actual</code>, actualiza <code>log</code> con ese valor:</p>
+
+<pre class="brush: js notranslate">var lenguaje = {
+  set actual(mensaje) {
+    this.log.push(mensaje);
+  },
+  log: []
+}
+lenguaje.actual='ES';
+console.log(lenguaje.log); // ['ES']
+
+lenguaje.actual='FR';
+console.log(lenguaje.log); // ['ES', 'FR']
+</pre>
+
+
+
+<p>Note que <code>actual</code> no está definido y cualquier intento de accederlo devolverá <code>undefined</code>.</p>
+
+<h3 id="Eliminando_un_setter_con_el_operador_delete">Eliminando un setter con el operador <code>delete</code> </h3>
+
+<p>Si desea eliminar el setter, puede simplemente aplicar <a href="/es/docs/Web/JavaScript/Referencia/Operadores/delete" title="en-US/docs/JavaScript/Reference/Operators/Special/delete"><code>delete</code></a> en él:</p>
+
+<pre class="brush: js notranslate">delete lenguaje.actual;
+</pre>
+
+<h3 id="Definiendo_un_setter_en_un_objecto_existente_usando_defineProperty">Definiendo un setter en un objecto existente usando <code>defineProperty</code></h3>
+
+<p>Para añadir un setter a un objeto <em>existente</em>,<em> </em>use {{jsxref("Object.defineProperty()")}}</p>
+
+<pre class="brush: js notranslate">consr o = {a: 0};
+
+Object.defineProperty(o, 'b', {
+  set: function (x) { this.a = x / 2; }
+});
+
+o.b = 10; // Ejecuta el setter, el cual asigna 10 / 2 (5) a la propiedad 'a'
+console.log(o.a) // 5</pre>
+
+<h3 id="Usando_un_nombre_de_propiedad_computado">Usando un nombre de propiedad computado</h3>
+
+<div class="note">
+<p><strong>Nota:</strong> Propiedades computadas son 'experimental technology'<em>,</em> parte de la propuesta para ECMAScript 6, y no está soportado en todos los navegadores. Dará error de sintaxis en entornos no soportados.</p>
+</div>
+
+<pre class="brush: js notranslate">const expr = 'foo';
+
+var obj = {
+  baz: 'bar',
+  set [expr](v) { this.baz = v; }
+};
+
+console.log(obj.baz); // "bar"
+obj.foo = "baz";      // ejecuta el setter
+console.log(obj.baz); // "baz"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.1.5', 'Object Initializer')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-method-definitions', 'Method definitions')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Se añaden las propiedades computadas.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(1)}}</td>
+   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
+   <td>{{ CompatIE(9) }}</td>
+   <td>9.5</td>
+   <td>3</td>
+  </tr>
+  <tr>
+   <td>Computed property names</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("34") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("1.8.1") }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Computed property names</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("34.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_específicas_para_SpiderMonkey-specific">Notas específicas para SpiderMonkey-specific</h2>
+
+<ul>
+ <li>Comenzando con<a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/1.8.1"> JavaScript 1.8.1</a>, los setters ya no son llamados cuando se definen las propiedades en los inicializadores de objetos y arrays.</li>
+ <li>De SpiderMonkey 38 en adelante, un setter con un {{jsxref("Functions/rest_parameters", "rest parameter", "", 1)}} es un {{jsxref("SyntaxError")}} conforme a la especificación ES6.</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">getter</a></li>
+ <li>{{jsxref("Operators/delete", "delete")}}</li>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+ <li>{{jsxref("Object.defineGetter", "__defineGetter__")}}</li>
+ <li>{{jsxref("Object.defineSetter", "__defineSetter__")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">Definiendo Getters y Setters</a> en la Guía JavaScript</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/aggregateerror/index.html b/files/es/web/javascript/reference/global_objects/aggregateerror/index.html
new file mode 100644
index 0000000000..2f641abbc2
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/aggregateerror/index.html
@@ -0,0 +1,88 @@
+---
+title: AggregateError
+slug: Web/JavaScript/Reference/Global_Objects/AggregateError
+tags:
+  - AggregateError
+  - Clase
+  - Experimental
+  - Interfaz
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Global_Objects/AggregateError
+original_slug: Web/JavaScript/Referencia/Objetos_globales/AggregateError
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <code><strong>AggregateError</strong></code> representa un error cuando se deben agrupar varios errores en un solo error. Se lanza cuando una operación necesita informar de varios errores, por ejemplo, {{JSxRef("Promise.any()")}}, cuando todas las promesas que se le pasan son rechazadas.</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{JSxRef("Global_Objects/AggregateError/AggregateError", "AggregateError()")}}</dt>
+ <dd>Crea un nuevo objeto <code>AggregateError</code>.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{JSxRef("Error.prototype.message", "AggregateError.prototype.message")}}</dt>
+ <dd>Mensaje de error, el valor predeterminado es <code>""</code> (la cadena vacía).</dd>
+ <dt>{{JSxRef("Error.prototype.name", "AggregateError.prototype.name")}}</dt>
+ <dd>Nombre del error, el valor predeterminado es <code>AggregateError</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Capturar_un_error_agregado">Capturar un error agregado</h3>
+
+<pre class="brush: js; notranslate">Promise.any([
+  Promise.reject(new Error("algún error")),
+]).catch(e =&gt; {
+  console.log(e instanceof AggregateError); // true
+  console.log(e.message);                   // "Todas las promesas rechazadas"
+  console.log(e.name);                      // "AggregateError"
+  console.log(e.errors);                    // [ Error: "algún error" ]
+});
+</pre>
+
+<h3 id="Crear_un_AggregateError">Crear un <code>AggregateError</code></h3>
+
+<pre class="brush: js; notranslate">try {
+  throw new AggregateError([
+    new Error("algún error"),
+  ], 'Hola');
+} catch (e) {
+  console.log(e instanceof AggregateError); // true
+  console.log(e.message);                   // "Hola"
+  console.log(e.name);                      // "AggregateError"
+  console.log(e.errors);                    // [ Error: "algún error" ]
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('Promise.any', '#sec-aggregate-error-objects', 'AggregateError')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.AggregateError")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Error")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/@@iterator/index.html b/files/es/web/javascript/reference/global_objects/array/@@iterator/index.html
new file mode 100644
index 0000000000..9d0124bb71
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/@@iterator/index.html
@@ -0,0 +1,90 @@
+---
+title: Array.prototype[@@iterator]()
+slug: Web/JavaScript/Reference/Global_Objects/Array/@@iterator
+tags:
+  - Array
+  - ECMAScript 2015
+  - Iterator
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@iterator
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/@@iterator
+---
+<div>{{JSRef}}</div>
+
+<p>El valor inicial de la propiedad <code><strong>@@iterator</strong></code> es el mismo objeto de función que el valor inicial de la propiedad {{jsxref("Array.prototype.values()", "values()")}}.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>arr</var>[Symbol.iterator]()</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El valor inicial dado por el <strong>iterador</strong> {{jsxref("Array.prototype.values()", "values()")}}. Por defecto, usar <code>arr[Symbol.iterator]</code> devolverá la función {{jsxref("Array.prototype.values()", "values()")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Iteración_usando_el_bucle_for...of">Iteración usando el bucle <code>for...of</code> </h3>
+
+<pre class="brush: js">var arr = ['w', 'y', 'k', 'o', 'p'];
+var eArr = arr[Symbol.iterator]();
+// nuestro navegador debe ser compatible con el bucle for..of
+// y variables let-scoped en bucles for
+for (let letter of eArr) {
+  console.log(letter);
+}
+</pre>
+
+<h3 id="Iteración_alternativa">Iteración alternativa</h3>
+
+<pre class="brush: js">var arr = ['w', 'y', 'k', 'o', 'p'];
+var eArr = arr[Symbol.iterator]();
+console.log(eArr.next().value); // w
+console.log(eArr.next().value); // y
+console.log(eArr.next().value); // k
+console.log(eArr.next().value); // o
+console.log(eArr.next().value); // p
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial..</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.@@iterator")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.keys()")}}</li>
+ <li>{{jsxref("Array.prototype.entries()")}}</li>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Array.prototype.every()")}}</li>
+ <li>{{jsxref("Array.prototype.some()")}}</li>
+ <li>{{jsxref("Array.prototype.values()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/@@species/index.html b/files/es/web/javascript/reference/global_objects/array/@@species/index.html
new file mode 100644
index 0000000000..cfd3314225
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/@@species/index.html
@@ -0,0 +1,77 @@
+---
+title: get Array[@@species]
+slug: Web/JavaScript/Reference/Global_Objects/Array/@@species
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@species
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/@@species
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad de acceso <code><strong>Array[@@species]</strong></code> devuelve el constructor de <code>Array</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">Array[Symbol.species]
+</pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El constructor {{jsxref("Array")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad de acceso <code>species</code> devuelve el constructor predeterminado para objetos <code>Array</code>. Los constructores de subclase pueden anularlo para cambiar la asignación del constructor.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>La propiedad <code>species</code> devuelve la función de constructor predeterminada, que es el constructor <code>Array</code> para objetos <code>Array</code>:</p>
+
+<pre class="brush: js">Array[Symbol.species]; // function Array()</pre>
+
+<p>In a derived collection object (e.g. your custom array <code>MyArray</code>), the <code>MyArray</code> species is the <code>MyArray</code> constructor. However, you might want to overwrite this, in order to return parent <code>Array</code> objects in your derived class methods:</p>
+
+<pre class="brush: js">class MyArray extends Array {
+  // Overwrite MyArray species to the parent Array constructor
+  static get [Symbol.species]() { return Array; }
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-get-array-@@species', 'get Array [ @@species ]')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-get-array-@@species', 'get Array [ @@species ]')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.@@species")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+ <li>{{jsxref("Symbol.species")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/@@unscopables/index.html b/files/es/web/javascript/reference/global_objects/array/@@unscopables/index.html
new file mode 100644
index 0000000000..7ddb89930d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/@@unscopables/index.html
@@ -0,0 +1,79 @@
+---
+title: Array.prototype[@@unscopables]
+slug: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables
+tags:
+  - Array
+  - JavaScript
+  - Matriz
+  - Propiedad
+  - Prototipo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/@@unscopables
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad de símbolo <code><strong>@@unscopable</strong></code> contiene nombres de propiedad que no se incluyeron en el estándar ECMAScript antes de la versión ES2015. Estas propiedades se excluyen de los enlaces de declaración <code><a href="/es/docs/Web/JavaScript/Reference/Statements/with">with</a></code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>[Symbol.unscopables]</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p> </p>
+
+<p>Las propiedades de matriz predeterminadas que se excluyen de los enlaces <code>with</code> son: copyWithin, entries, fill, find, findIndex, includes, keys, y values.</p>
+
+<p>Consulte {{jsxref("Symbol.unscopables")}} para saber cómo configurar <code>unscopables</code> para sus propios objetos.</p>
+
+<p>{{js_property_attributes(0,0,1)}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente código funciona bien en ES5 y más abajo. Sin embargo, en ECMAScript 2015 y posterior, se introdujo el método {{jsxref("Array.prototype.keys()")}}. Eso significa que dentro de los entornos <code>with</code>, las "keys" ahora serían el método y no la variable. Aquí es donde entra en juego la propiedad de símbolo <code>@@unscopables</code> <code>Array.prototype[@@unscopables]</code> incorporada y evita que algunos de los métodos Array tengan un alcance en la instrucción <code>with</code>.</p>
+
+<pre class="brush: js">var keys = [];
+
+with (Array.prototype) {
+  keys.push('something');
+}
+
+Object.keys(Array.prototype[Symbol.unscopables]);
+// ["copyWithin", "entries", "fill", "find", "findIndex",
+//  "includes", "keys", "values"]</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.@@unscopables")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Symbol.unscopables")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/concat/index.html b/files/es/web/javascript/reference/global_objects/array/concat/index.html
new file mode 100644
index 0000000000..eb3440b21e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/concat/index.html
@@ -0,0 +1,141 @@
+---
+title: Array.prototype.concat()
+slug: Web/JavaScript/Reference/Global_Objects/Array/concat
+tags:
+  - Array
+  - JavaScript
+  - Métodos
+  - Prototipo
+  - Referencia
+  - array.concat
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/concat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/concat
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>concat()</strong></code> se usa para unir dos o más arrays. Este método no cambia los arrays existentes, sino que devuelve un nuevo array.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-concat.html","shorter")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var <var>nuevo_array</var> = <var>viejo_array</var>.concat(<var>valor1</var>[, <var>valor2</var>[, ...[, <var>valorN</var>]]])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor<em>N</em></code> {{optional_inline}}</dt>
+ <dd>Arrays y/o valores a concatenar en el nuevo array. Ver la descripción posterior para más detalles.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<dl>
+ <dd>Una nueva instancia de {{jsxref("Array")}}.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>concat</code> crea un nuevo array que consta de los elementos del objeto que lo llama, seguido, en orden de ingreso, por los elementos de cada parámetro (en caso de que el parámetro sea un array), o el parámetro mismo (en caso de que no sea un array). No se aplica de forma recursiva a parámetros con arreglos anidados.</p>
+
+<p>El método <code>concat</code> no altera <code>this</code> el array original, ni ninguno de los que fueron ingresados como parámetros, sino que devuelve una copia superficial que contiene copias de los mismos elementos de los arrays originales combinados. Los elementos de los arrays originales son copiados en el nuevo array de la siguiente manera:</p>
+
+<ul>
+ <li>Referencias a Objetos (no el objeto real): <code>concat</code> copia las referencias de objetos en el nuevo array. Ambos, el array original y el nuevo refieren al mismo objeto. Es decir, si un objeto referenciado es modificado, los cambios serán visibles tanto en el array nuevo como en el antiguo.</li>
+ <li>Tipo de de datos como cadenas, números y boleanos (no objetos {{jsxref("Global_Objects/String", "String")}}, {{jsxref("Global_Objects/Number", "Number")}} o {{jsxref("Global_Objects/Boolean", "Boolean")}} objects): <code>concat</code> copia los valores de los strings y numeros en el nuevo array.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota:</strong> Al concatenar arrays o valores no se modificarán los originales. Además, las operaciones en el nuevo array (excepto las operaciones en elementos que son referencias a objetos) no tendrán efecto en el array original, y viceversa.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Concatenando_dos_arrays">Concatenando dos arrays</h3>
+
+<p>En el siguiente código se concatenan dos arrays:</p>
+
+<pre class="brush: js">const letters = ['a', 'b', 'c'];
+const numbers = [1, 2, 3];
+
+letters.concat(numbers);
+// result in ['a', 'b', 'c', 1, 2, 3]
+</pre>
+
+<h3 id="Concatenando_tres_arrays">Concatenando tres arrays</h3>
+
+<p>En el siguiente código se concatenan tres arrays:</p>
+
+<pre class="brush: js">const num1 = [1, 2, 3];
+const num2 = [4, 5, 6];
+const num3 = [7, 8, 9];
+
+const numbers = num1.concat(num2, num3);
+
+console.log(numbers);
+// results in [1, 2, 3, 4, 5, 6, 7, 8, 9]
+</pre>
+
+<h3 id="Concatenando_valores_a_un_array">Concatenando valores a un array</h3>
+
+<p>En el siguiente código se concatenan tres valores a un array:</p>
+
+<pre class="brush: js">var alpha = ['a', 'b', 'c'];
+
+var alphaNumeric = alpha.concat(1, [2, 3]);
+
+console.log(alphaNumeric);
+// Da como resultado: ['a', 'b', 'c', 1, 2, 3]
+</pre>
+
+<h3 id="Concatenando_arrays_anidados">Concatenando arrays anidados</h3>
+
+<p>En el siguiente código concatena arrays anidados y demuestra retención de referencias:</p>
+
+<pre class="brush: js">var num1 = [[1]];
+var num2 = [2, [3]];
+
+var nums = num1.concat(num2);
+
+console.log(nums);
+// Da como resultado: [[1], 2, [3]]
+
+// modifica el primer elemento de num1
+num1[0].push(4);
+
+console.log(nums);
+// Da como resultado: [[1, 4], 2, [3]]</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.concat")}}</p>
+</div>
+
+<div id="compat-mobile"></div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.push", "push")}} / {{jsxref("Array.pop", "pop")}} — añadir/eliminar elementos desde el fin del array</li>
+ <li>{{jsxref("Array.unshift", "unshift")}} / {{jsxref("Array.shift", "shift")}} — añadir/eliminar elementos desde el comienzo del array</li>
+ <li>{{jsxref("Array.splice", "splice")}} — añadir/eliminar elementos desde una posición específica del array</li>
+ <li>{{jsxref("String.prototype.concat()")}}</li>
+ <li>{{jsxref("Symbol.isConcatSpreadable")}} – controla el flattening (aplanamiento).</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/copywithin/index.html b/files/es/web/javascript/reference/global_objects/array/copywithin/index.html
new file mode 100644
index 0000000000..18ff3ba3e0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/copywithin/index.html
@@ -0,0 +1,166 @@
+---
+title: Array.prototype.copyWithin()
+slug: Web/JavaScript/Reference/Global_Objects/Array/copyWithin
+tags:
+  - Array
+  - ECMAScript 2015
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/copyWithin
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/copyWithin
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>copyWithin()</strong></code> transfiere una copia  plana de una sección a otra dentro del mismo array ( o contexto similar ), sin modificar su propiedad length y lo devuelve.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-copywithin.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr.copyWithin(target)
+arr.copyWithin(target, start)
+arr.copyWithin(target, start, end)</var></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>target</code></dt>
+ <dd>Índice basado en cero que establece en dónde dentro de la secuencia original se insertará la secuencia copiada.  Si es negativo, <code>target</code> se contará desde el final. -1 es el último elemento, -2 el penúltimo, etc.</dd>
+ <dd>Si <code>target</code> es  igual o mayor que  <code>arr.length</code>, no se copiará nada. Si <code>target</code> es posicionado después de <code>start</code>, la secuencia copiada se recortará para que encaje con <code>arr.length</code>.</dd>
+ <dt><code>start</code> {{optional_inline}}</dt>
+ <dd>Índice basado en cero a partir del cual comenzar la copia de elementos. Si es negativo, start comenzará a contarse desde el final.</dd>
+ <dd>Si <code>start</code> es omitido, <code>copyWithin</code> copiará desde el principio (por defecto es 0).</dd>
+ <dt><code>end</code> {{optional_inline}}</dt>
+ <dd>Índice basado en cero hasta el cual se copiarán los elementos. <code>copyWithin</code> copiará hasta pero sin incluir el end. Si es negativo, <code>end</code> será contado desde el final.</dd>
+ <dd>Si <code>end</code> es omitido, <code>copyWithin</code> copiará hasta el final ( por defecto es <code>arr.length </code>).</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El array modificado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>copyWithin</code> es similar a la función <code>memmove</code> de C y C++  , siendo altamente eficiente para desplazar los datos en un {{jsxref("Array")}} o  {{jsxref("TypedArray")}}. La secuencia de datos es leída y escrita en una sola operación;  la escritura será correcta incluso en el caso de que la zona de lectura y el destino de escritura se solapen.</p>
+
+<p>La función <code>copyWithin</code> es intencionadamente <em>genérica</em>, permitiendo que se aplique en contextos en los cuales <code>this</code> no sea necesariamente un objeto {{jsxref("Array")}}.</p>
+
+<p>El método <code>copyWithin</code> es un método mutador. No altera la propiedad <code>length</code> de <code>this</code>, pero cambiará su contenido y creará nuevas propiedades si es necesario.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>En los siguientes ejemplos céntrate en los siguientes aspectos:</p>
+
+<ul>
+ <li>El tamaño del contexto en el que se aplica no cambia. En los ejemplos el array parte con cinco elementos y siempre mantiene cinco elementos.</li>
+ <li><code>start</code> y <code>end</code> trabajan juntos para decidir qué se copiará.  Siempre tienen valor por defecto aunque omitas <code>end</code>, o <code>start</code> y <code>end</code>.</li>
+ <li><code>target</code> trabaja solo y debe especificarse.  Indica el lugar para en el que la copia comenzará a sobreescribir datos existentes. Debe estar dentro de los límites en el contexto que se aplique.</li>
+ <li>escribir <code>arr.copyWithin( n ) </code>es lo mismo que <code>arr.copyWithin( n, 0, arr.length)</code></li>
+</ul>
+
+<pre class="brush: js">[1, 2, 3, 4, 5].copyWithin(-2);
+// [1, 2, 3, 1, 2]
+
+[1, 2, 3, 4, 5].copyWithin(0, 3);
+// [4, 5, 3, 4, 5]
+
+[1, 2, 3, 4, 5].copyWithin(0, 3, 4);
+// [4, 2, 3, 4, 5]
+
+[1, 2, 3, 4, 5].copyWithin(-2, -3, -1);
+// [1, 2, 3, 3, 4]
+</pre>
+
+<p>A continuación se aplica en el contexto de un objeto <strong>array-like</strong>:</p>
+
+<ul>
+ <li>El objeto contextual tiene alguna propiedad con clave numérica, y una propiedad length. Esto es suficiente para considerarse array-like.</li>
+ <li>observa que <strong>no</strong> se modifica la propiedad length, a pesar de que se ha introducido una nueva propiedad con clave 0. A esto ser refiere cuando se dice que <code>copyWithin</code> es un método <strong>mutador</strong>.  ¿Por qué se creó esta nueva propiedad?  porque mediante el argumento target se especificó que  la copia debía comenzar a partir de un índice que ¡¡no existía!!</li>
+</ul>
+
+<pre class="brush: js">[].copyWithin.call({length: 5, 3: 1}, 0, 3);
+// {0: 1, 3: 1, length: 5}
+
+</pre>
+
+<p>Lo que sigue ahora son las subclases tipadas de Array en ES6:</p>
+
+<pre class="brush: js">// Arrays tipados en ES6. Son subclases de Array
+var i32a = new Int32Array([1, 2, 3, 4, 5]);
+
+i32a.copyWithin(0, 2);
+// Int32Array [3, 4, 5, 4, 5]
+
+// En plataformas que todavía no siguen la norma ES6:
+[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4);
+// Int32Array [4, 2, 3, 4, 5]</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">if (!Array.prototype.copyWithin) {
+  Array.prototype.copyWithin =
+  // Array: Number[, Number[, Number]]
+  function copyWithin(target, start, stop) {
+    var positiveT = target &gt;= 0,
+        positiveS = (start = start | 0) &gt;= 0,
+        length    = this.length,
+        zero      = 0,
+        r         = function() {return ((+new Date) * Math.random()).toString(36)},
+        delimiter = "\b" + r() + "-" + r() + "-" + r() + "\b",
+        hold;
+
+    stop = stop || this.length;
+    hold = this.slice.apply(this,
+      positiveT?
+        [start, stop]:
+      positiveS?
+        [start, -target]:
+      [start])
+    .join(delimiter);
+
+    return this.splice.apply(this,
+      positiveT?
+        [target, stop - start, hold]:
+      positiveS?
+        [target, stop, hold]:
+      [target, start, hold]),
+            this.join(delimiter).split(delimiter).slice(zero, length);
+  }
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.copyWithin', 'Array.prototype.copyWithin')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.copyWithin', 'Array.prototype.copyWithin')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.copyWithin")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/entries/index.html b/files/es/web/javascript/reference/global_objects/array/entries/index.html
new file mode 100644
index 0000000000..3db699e1d5
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/entries/index.html
@@ -0,0 +1,87 @@
+---
+title: Array.prototype.entries()
+slug: Web/JavaScript/Reference/Global_Objects/Array/entries
+tags:
+  - Array
+  - ECMAScript 2015
+  - Iterador
+  - Iterator
+  - JavaScript
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/entries
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/entries
+---
+<div>{{JSRef}}</div>
+
+<div>El método <code><strong>entries()</strong></code> retorna un nuevo objeto <strong><code>Array Iterator</code></strong> que contiene los pares clave/valor para cada índice de la matriz.</div>
+
+<div> </div>
+
+<div>
+<p>{{EmbedInteractiveExample("pages/js/array-entries.html")}}</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.entries()</pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un nuevo objeto iterador {{jsxref("Array")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_un_bucle_for…of">Usando un bucle <a href="/es/docs/Web/JavaScript/Reference/Statements/for...of">for…of</a> </h3>
+
+<pre class="brush: js">var a = ['a', 'b', 'c'];
+var iterator = a.entries();
+
+for (let e of iterator) {
+  console.log(e);
+}
+// [0, 'a']
+// [1, 'b']
+// [2, 'c']</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.entries', 'Array.prototype.entries')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.entries', 'Array.prototype.entries')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.entries")}}</p>
+</div>
+
+<div id="compat-mobile"> </div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.keys()")}}</li>
+ <li>{{jsxref("Array.prototype.values()")}}</li>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Array.prototype.every()")}}</li>
+ <li>{{jsxref("Array.prototype.some()")}}</li>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></li>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Iteration_protocols">Protocolos de iteración</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/every/index.html b/files/es/web/javascript/reference/global_objects/array/every/index.html
new file mode 100644
index 0000000000..bda6368b52
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/every/index.html
@@ -0,0 +1,196 @@
+---
+title: Array.prototype.every()
+slug: Web/JavaScript/Reference/Global_Objects/Array/every
+tags:
+  - Arreglo
+  - ECMAScript 5
+  - JavaScript
+  - Prototipo
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/every
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/every
+---
+<div>{{JSRef}}</div>
+
+<p><span class="seoSummary">Determina si todos los elementos en el array satisfacen una condición.</span></p>
+
+<div class="note">
+<p><strong>Precaución</strong>: ¡Llamar este método en un array vacío devuelve <code>true</code> para cualquier condición!</p>
+</div>
+
+<div>{{EmbedInteractiveExample("pages/js/array-every.html")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se encuentra en GitHub. Si desea contribuir con el proyecto de ejemplos interactivos, clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíenos un<em>pull</em><em> request</em>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.every(<var>callback</var>(<var>element</var>[, <var>index</var>[, <var>array</var>]])[, <var>thisArg</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Una función para probar cada elemento; recibe tres argumentos:
+ <dl>
+  <dt><code>currentValue</code> (required)</dt>
+  <dd>El elemento actual del arreglo que está siendo procesado.</dd>
+  <dt><code>index</code> {{Optional_inline}}</dt>
+  <dd>El índice del elemento actual del arreglo que está siendo procesado.</dd>
+  <dt><code>array</code> {{Optional_inline}}</dt>
+  <dd>El arreglo sobre el cual fue llamado <code>every</code>.</dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code> {{Optional_inline}}</dt>
+ <dd>Valor por usar como <code>this</code> cuando se ejecute <code>callback</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p><code>true</code> si la función de devolución de llamada devuelve un valor de {{Glossary("truthy")}} para cada elemento de matriz; de lo contrario, <code>false</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>every</code> ejecuta la función <code>callback</code> dada una vez por cada elemento presente en el arreglo hasta encontrar uno que haga retornar un valor falso a <code>callback</code> (un valor que resulte falso cuando se convierta a booleano).  Si no se encuentra tal elemento, el método <code>every</code> de inmediato retorna  <code>false</code>. O si  <code>callback</code> retorna verdadero para todos los elementos, <code>every</code> retornará <code>true</code>. <code>callback</code> es llamada sólo para índices del arreglo que tengan valores asignados; no se llama para índices que hayan sido eliminados o a los que no se les haya asignado un valor.</p>
+
+<p><code>callback</code> es llamada con tres argumetos: el valor del elemento, el índice del elemento y el objeto Array que está siendo recorrido.</p>
+
+<p>Si se proporciona un parámetro <code>thisArg</code> a <code>every</code>, será pasado a la función <code>callback</code> cuando sea llamada, usándolo como valor <code>this</code>. En otro caso, se pasará el valor <code>undefined</code> para que sea usado como valor <code>this</code>.  El valor <code>this</code> observable por parte de  <code>callback</code> se determina de acuerdo a <a href="/es/docs/Web/JavaScript/Reference/Operators/this">las normas usuales para determinar el <code>this</code> visto por una función</a>.</p>
+
+<p><code>every</code> no modifica el arreglo sobre el cual es llamado.</p>
+
+<p>El intervalo de elementos procesados por <code>every</code> se establece antes de la primera llamada a <code>callback</code>.  Los elementos que se agreguen al arreglo después de que la función <code>every</code> comience no serán vistos por la función <code>callback</code>.  Si se modifican elementos existentes en el arreglo, su valor cuando sea pasado a <code>callback</code> será el valor que tengan cuando sean visitados; los elementos que se eliminen no serán visitados.</p>
+
+<p><code>every</code> opera como el cuantificador "para todo" en matemáticas. En particular con el arreglo vacío retorna true. (es una <a href="http://en.wikipedia.org/wiki/Vacuous_truth#Vacuous_truths_in_mathematics">verdad vacua</a> que todos los elementos del <a href="http://en.wikipedia.org/wiki/Empty_set#Common_problems">conjunto vacío</a> satisfacen una condición dada.)</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Probando_el_tamaño_de_todos_los_elementos_de_un_arreglo">Probando el tamaño de todos los elementos de un arreglo</h3>
+
+<p>El siguiente ejemplo prueba si todos los elementos de un arreglo son mayores que 10.</p>
+
+<pre class="brush: js">function esSuficientementeGrande(elemento, indice, arrreglo) {
+  return elemento &gt;= 10;
+}
+[12, 5, 8, 130, 44].every(esSuficientementeGrande);   // false
+[12, 54, 18, 130, 44].every(esSuficientementeGrande); // true
+</pre>
+
+<h3 id="Usar_funciones_flecha">Usar funciones flecha</h3>
+
+<p>Las <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">funciones flecha</a> proveen una sintaxis más corta para la misma prueba.</p>
+
+<pre class="brush: js">[12, 5, 8, 130, 44].every(elem =&gt; elem &gt;= 10); // false
+[12, 54, 18, 130, 44].every(elem =&gt; elem &gt;= 10); // true</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p><code>every</code> fue añadida a la norma ECMA-262 en la 5ta edición; por lo que podría no estar presente en otras implementaciones de la norma.  Puede sobrellevarlo insertando el siguiente código al comienzo de su programa,  permitiendo el uso de <code>every</code>  en implementación que no lo soporten de manera nativa. Este algoritmo es exactamente el especificado en ECMA-262, 5ta edición, suponiendo que  <code>Object</code> y <code>TypeError</code> tienen sus valores originales y que  <code>callbackfn.call</code> evalua al valor original de {{jsxref("Function.prototype.call")}}</p>
+
+<pre class="brush: js">if (!Array.prototype.every) {
+  Array.prototype.every = function(callbackfn, thisArg) {
+    'use strict';
+    var T, k;
+
+    if (this == null) {
+      throw new TypeError('this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the this
+    //    value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal method
+    //    of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length &gt;&gt;&gt; 0;
+
+    // 4. If IsCallable(callbackfn) is false, throw a TypeError exception.
+    if (typeof callbackfn !== 'function') {
+      throw new TypeError();
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length &gt; 1) {
+      T = thisArg;
+    }
+
+    // 6. Let k be 0.
+    k = 0;
+
+    // 7. Repeat, while k &lt; len
+    while (k &lt; len) {
+
+      var kValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal
+      //    method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal method
+        //    of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Let testResult be the result of calling the Call internal method
+        //     of callbackfn with T as the this value and argument list
+        //     containing kValue, k, and O.
+        var testResult = callbackfn.call(T, kValue, k, O);
+
+        // iii. If ToBoolean(testResult) is false, return false.
+        if (!testResult) {
+          return false;
+        }
+      }
+      k++;
+    }
+    return true;
+  };
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.16', 'Array.prototype.every')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.every', 'Array.prototype.every')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.every', 'Array.prototype.every')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.every")}}</p>
+</div>
+
+<div id="compat-mobile"></div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Array.prototype.some()")}}</li>
+ <li>{{jsxref("TypedArray.prototype.every()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/fill/index.html b/files/es/web/javascript/reference/global_objects/array/fill/index.html
new file mode 100644
index 0000000000..9d25a0debc
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/fill/index.html
@@ -0,0 +1,146 @@
+---
+title: Array.prototype.fill()
+slug: Web/JavaScript/Reference/Global_Objects/Array/fill
+tags:
+  - Array
+  - ECMAScript 2015
+  - JavaScript
+  - Prototipo
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/fill
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/fill
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>fill()</strong></code> cambia todos los elementos en un arreglo por un valor estático, desde el índice start (por defecto 0) hasta el índice end (por defecto <code>array.length</code>). Devuelve el arreglo modificado.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-fill.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.fill(<var>value</var>[, <var>start<var> = 0[, <var>end</var> = this.length]])</var></var></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>value</code></dt>
+ <dd>Valor con el que se va a rellenar el arreglo. (Nótese que todos los elementos en el arreglo tendrán este mismo valor).</dd>
+ <dt><code>start</code> {{optional_inline}}</dt>
+ <dd>Índice inicial, por defecto 0.</dd>
+ <dt><code>end</code> {{optional_inline}}</dt>
+ <dd>Índice final, por defecto <code>this.length</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El arreglo modificado, rellenado con <code>valor</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<ul>
+ <li>Si <code>start</code> es negativo, se interpreta como <code>array.length + start</code>.</li>
+ <li>Si <code>end</code> es negativo, se interpreta como <code>array.length + end</code>.</li>
+ <li><code>fill</code> es genérico de forma intencional: no requiere que su valor <code>this</code> sea un objeto <code>Array</code>.</li>
+ <li><code>fill</code> es un método mutador: modifica el arreglo sobre el que se invoca; no devuelve una copia de éste.</li>
+ <li>Si el primer parámetro es un objeto, copia su referencia y rellena el arreglo con referencias a dicho objeto.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">[1, 2, 3].fill(4);               // [4, 4, 4]
+[1, 2, 3].fill(4, 1);            // [1, 4, 4]
+[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
+[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
+[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
+[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
+[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
+[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
+Array(3).fill(4);                // [4, 4, 4]
+[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}
+
+// Objects by reference.
+var arr = Array(3).fill({}) // [{}, {}, {}];
+arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">if (!Array.prototype.fill) {
+  Object.defineProperty(Array.prototype, 'fill', {
+    value: function(value) {
+
+      // Pasos 1-2.
+      if (this == null) {
+        throw new TypeError('esto es nulo o no definido');
+      }
+
+      var O = Object(this);
+
+      // Pasos 3-5.
+      var len = O.length &gt;&gt;&gt; 0;
+
+      // Pasos 6-7.
+      var start = arguments[1];
+      var relativeStart = start &gt;&gt; 0;
+
+      // Paso 8.
+      var k = relativeStart &lt; 0 ?
+        Math.max(len + relativeStart, 0) :
+        Math.min(relativeStart, len);
+
+      // Pasos 9-10.
+      var end = arguments[2];
+      var relativeEnd = end === undefined ?
+        len : end &gt;&gt; 0;
+
+      // Paso 11.
+      var final = relativeEnd &lt; 0 ?
+        Math.max(len + relativeEnd, 0) :
+        Math.min(relativeEnd, len);
+
+      // Paso 12.
+      while (k &lt; final) {
+        O[k] = value;
+        k++;
+      }
+
+      // Paso 13.
+      return O;
+    }
+  });
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.fill', 'Array.prototype.fill')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.fill', 'Array.prototype.fill')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.fill")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+ <li>{{jsxref("TypedArray.prototype.fill()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/filter/index.html b/files/es/web/javascript/reference/global_objects/array/filter/index.html
new file mode 100644
index 0000000000..4b80085925
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/filter/index.html
@@ -0,0 +1,232 @@
+---
+title: Array.prototype.filter()
+slug: Web/JavaScript/Reference/Global_Objects/Array/filter
+tags:
+  - Array
+  - ECMAScript 5
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/filter
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/filter
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>filter()</strong></code> crea un nuevo array con todos los elementos que cumplan la condición implementada por la función dada.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-filter.html")}}</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="notranslate"><var>var newArray = arr</var>.filter(<var>callback(currentValue[, index[, array]])</var>[, <var>thisArg</var>])</pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función que <strong>comprueba cada elemento </strong>del array para ver si cumple la condición (también llamada predicado).  Retorna <code>true</code> si el elemento la cumple o en caso contrario retornará <code>false</code>. Acepta tres parámetros:</dd>
+ <dd>
+ <dl>
+  <dt><code>currentValue</code></dt>
+  <dd>El elemento actual del array que está siendo procesado.</dd>
+  <dt><code>index</code> {{optional_inline}}</dt>
+  <dd>El índice del elemento actual del array que está siendo procesado.</dd>
+  <dt><code>array</code> {{optional_inline}}</dt>
+  <dd>El array sobre el que se ha llamado <code>filter</code>.</dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code> {{optional_inline}}</dt>
+ <dd>Opcional. Valor a utilizar como <code>this</code> cuando se ejecuta <code>callback</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un nuevo array con los elementos que cumplen la condición. Si ningún elemento cumple la condición, se devolverá un array vacío.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p><code>filter()</code> llama a la función <code>callback</code>  sobre cada elemento del array, y construye un nuevo array con todos los valores para los cuales  <code>callback</code> devuelve un valor verdadero. <code>callback</code> es invocada sólo para índices del array que tengan un valor asignado. No se invoca sobre índices que hayan sido borrados o a los que no se les haya asignado algún valor. Los elementos del array que no cumplan la condición <code>callback</code>  simplemente los salta, y no son incluidos en el nuevo array.</p>
+
+<p><code>callback</code> se invoca con tres argumentos:</p>
+
+<ol>
+ <li>El valor de cada elemento</li>
+ <li>El índice del elemento</li>
+ <li>El objeto Array que se está recorriendo</li>
+</ol>
+
+<p>Si se proporciona un parámetro <code>thisArg</code> a <code>filter()</code>, este será pasado a <code>callback</code> cuando sea invocado, para usarlo como valor <code>this</code>.  De lo contrario, se pasará el valor <code>undefined</code> como valor <code>this</code>.  El valor <code>this</code> dentro del <code>callback</code> se determina conforme a las <a href="/es/docs/Web/JavaScript/Reference/Operators/this">las normas habituales para determinar el <em>this </em>visto por una función.</a></p>
+
+<p><code>filter()</code> no hace mutar el array sobre el cual es llamado.</p>
+
+<p>El rango de elementos procesados por <code>filter()</code> se establece antes de la primera invocación de  <code>callback</code>. Los elementos que se añadan al array después de que comience la llamada a <code>filter()</code> no serán visitados por <code>callback</code>. Si se modifica o elimina un elemento existente del array, cuando pase su valor a <code>callback</code> será el que tenga cuando <code>filter()</code> lo recorra; los elementos que son eliminados no son recorridos.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example_Filtering_out_all_small_values" name="Example:_Filtering_out_all_small_values">Filtrando todos los valores pequeños</h3>
+
+<p>El siguiente ejemplo usa <code>filter()</code> para crear un array filtrado que excluye todos los elementos con valores inferiores a 10.</p>
+
+<pre class="brush: js notranslate">function esSuficientementeGrande(elemento) {
+  return elemento &gt;= 10;
+}
+var filtrados = [12, 5, 8, 130, 44].filter(esSuficientementeGrande);
+// filtrados es [12, 130, 44]
+</pre>
+
+<h3 id="Filtrando_entradas_inválidas_desde_un_JSON">Filtrando entradas inválidas desde un JSON</h3>
+
+<p>El siguiente ejemplo emplea <code>filter()</code> para crear un json filtrado con todos lo elementos que tengan id numérico distinto de cero.</p>
+
+<pre class="brush: js notranslate">var arr = [
+  { id: 15 },
+  { id: -1 },
+  { id: 0 },
+  { id: 3 },
+  { id: 12.2 },
+  { },
+  { id: null },
+  { id: NaN },
+  { id: 'undefined' }
+];
+
+var entradasInvalidas = 0;
+// Si el elemento tiene un atributo id, y su valor correspondiente es un numero
+// Y no es el valor NaN, entonces es una entrada válida
+function filtrarPorID(obj) {
+  if ('id' in obj &amp;&amp; typeof(obj.id) === 'number' &amp;&amp; !isNaN(obj.id)) {
+    return true;
+  } else {
+    entradasInvalidas++;
+    return false;
+  }
+}
+
+var arrPorID = arr.filter(filtrarPorID);
+
+console.log('Array Filtrado\n', arrPorID);
+// [{ id: 15 }, { id: -1 }, { id: 0 }, { id: 3 }, { id: 12.2 }]
+
+console.log('Número de Entradas Invalidas = ', entradasInvalidas);
+// 4</pre>
+
+<h3 id="Búsqueda_en_el_arreglo">Búsqueda en el arreglo</h3>
+
+<p>El siguiente ejemplo emplea filter() para filtrar el contendio de un arreglo en función de un criterio de búsqueda.</p>
+
+<pre class="brush: js notranslate">var fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
+
+/**
+ * Filtra la matríz en función de un criterio de búsqueda (query)
+ */
+function filterItems(query) {
+  return fruits.filter(function(el) {
+      return el.toLowerCase().indexOf(query.toLowerCase()) &gt; -1;
+  })
+}
+
+console.log(filterItems('ap')); // ['apple', 'grapes']
+console.log(filterItems('an')); // ['banana', 'mango', 'orange']</pre>
+
+<h3 id="Implementación_en_ES2015">Implementación en ES2015</h3>
+
+<pre class="brush: js notranslate">const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
+
+/**
+ * Filtra la matríz en función de un criterio de búsqueda (query)
+ */
+const filterItems = query =&gt; {
+  return fruits.filter((el) =&gt;
+    el.toLowerCase().indexOf(query.toLowerCase()) &gt; -1
+  );
+}
+
+console.log(filterItems('ap')); // ['apple', 'grapes']
+console.log(filterItems('an')); // ['banana', 'mango', 'orange']</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p><code>filter()</code> se añadió a la norma ECMA-262 en la 5ta edición; como tal puede no estar presente en todas las implementaciones de la norma. Puedes sobrellevarlo insertando el siguiente código al comienzo de su programa, para permitir el uso de <code>filter()</code> en implementaciones de ECMA-262 que no lo soporten de forma nativa. Este algoritmo es exactamente el especificado en ECMA-262, 5ta edición, supone que  <code>fn.call</code> evalua al valor original de {{jsxref("Function.prototype.call")}}, y que {{jsxref("Array.prototype.push")}} tiene su valor original.</p>
+
+<pre class="notranslate">if (!Array.prototype.filter){
+  Array.prototype.filter = function(func, thisArg) {
+    'use strict';
+    if ( ! ((typeof func === 'Function' || typeof func === 'function') &amp;&amp; this) )
+        throw new TypeError();
+
+    var len = this.length &gt;&gt;&gt; 0,
+        res = new Array(len), // preallocate array
+        t = this, c = 0, i = -1;
+
+    var kValue;
+    if (thisArg === undefined){
+      while (++i !== len){
+        // checks to see if the key was set
+        if (i in this){
+          kValue = t[i]; // in case t is changed in callback
+          if (func(t[i], i, t)){
+            res[c++] = kValue;
+          }
+        }
+      }
+    }
+    else{
+      while (++i !== len){
+        // checks to see if the key was set
+        if (i in this){
+          kValue = t[i];
+          if (func.call(thisArg, t[i], i, t)){
+            res[c++] = kValue;
+          }
+        }
+      }
+    }
+
+    res.length = c; // shrink down array to proper size
+    return res;
+  };
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.20', 'Array.prototype.filter')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición Inicial. Implementado en JavaScript 1.6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.filter', 'Array.prototype.filter')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.filter', 'Array.prototype.filter')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.filter")}}</p>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Array.prototype.every()")}}</li>
+ <li>{{jsxref("Array.prototype.some()")}}</li>
+ <li>{{jsxref("Array.prototype.reduce()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/find/index.html b/files/es/web/javascript/reference/global_objects/array/find/index.html
new file mode 100644
index 0000000000..ed43505cbb
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/find/index.html
@@ -0,0 +1,234 @@
+---
+title: Array.prototype.find()
+slug: Web/JavaScript/Reference/Global_Objects/Array/find
+tags:
+  - Array
+  - ECMAScript 2015
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/find
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/find
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>find()</strong></code> devuelve el <strong>valor</strong> del <strong>primer elemento</strong> del array que cumple la función de prueba proporcionada.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-find.html","shorter")}}</div>
+
+
+
+<ul>
+ <li>Si necesitas el <strong>índice</strong> del elemento encontrado en el array, utiliza {{jsxref("Array.findIndex", "findIndex()")}}.</li>
+ <li>Si necesitas encontrar el <strong>índice de un elemento</strong>, {{jsxref("Array.prototype.indexOf()")}}. (Es similar a {{jsxref("Array.findIndex", "findIndex()")}}, pero comprueba la igualdad de cada elemento con el valor en lugar de usar una función de prueba.)</li>
+ <li>Si necesitas encontrar si un valor <strong>existe</strong> en un array, utiliza {{jsxref("Array.prototype.includes()")}}.</li>
+ <li>Si necesitas encontrar si algún elemento cumple la función de prueba proporcionada, usa {{jsxref("Array.prototype.some()")}}.</li>
+</ul>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.find(<var>callback(element[, index[, array]])</var>[, <var>thisArg</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función que se ejecuta sobre cada valor en el array, tomando tres argumentos:
+ <dl>
+  <dt><code>element</code></dt>
+  <dd>El elemento actual que se está procesando en el array.</dd>
+  <dt><code>index</code> {{optional_inline}}</dt>
+  <dd>El índice (posición) del elemento actual que se está procesando en el array.</dd>
+  <dt><code>array</code> {{optional_inline}}</dt>
+  <dd>El array desde el que se llama al método <code>find</code>.</dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code> {{optional_inline}}</dt>
+ <dd>Objeto a usar como <code><a href="/es/docs/Web/JavaScript/Referencia/Operadores/this">this</a></code> cuando se ejecuta <code>callback</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El <strong>valor</strong> del <strong>primer elemento</strong> del array que cumple la función de prueba proporcionada; de lo contrario, devuelve {{jsxref("undefined")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>find</code> ejecuta la función <code>callback</code> una vez por cada índice del array hasta que encuentre uno en el que el <code>callback</code> devuelva un valor <a href="/es/docs/Glossary/Truthy">verdadero</a>. Si es así, <code>find</code> devuelve inmediatamente el valor del elemento. En caso contrario, <code>find</code> devuelve {{jsxref("undefined")}}.</p>
+
+<p><code>callback</code> se invoca con tres argumentos: el valor del elemento, el índice del elemento y el objeto <code>Array</code> que está siendo recorrido.</p>
+
+<p>Si un parámetro <code>thisArg</code> es proporcionado al método <code>find</code>, este será utilizado como <code>this</code> para cada invocación del callback. Si no se proporciona el parámetro, entonces se utiliza {{jsxref("undefined")}}.</p>
+
+<p>El método <code>find</code> no transforma el array desde el cual es llamado, pero la función proporcionada en <code>callback</code> sí. En ese caso, los elementos procesados por <code>find</code> son establecidos <em>antes</em> de la primera invocación de <code>callback</code>. Por lo tanto:</p>
+
+<ul>
+ <li><code>callback</code> no visitará ningún elemento añadido al array después de que comience la llamada a <code>find</code>.</li>
+ <li>Si un elemento existente no visitado del array es modificado por <code>callback</code>, su valor que se pasa al <code>callback</code> que lo visita será el valor en el momento en que <code>find</code> visita ese índice del elemento.</li>
+ <li>Los elementos que sean {{jsxref("delete", "deleted")}} (eliminados) aún se visitan.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Encontrar_un_objeto_en_un_array_por_una_de_sus_propiedades">Encontrar un objeto en un array por una de sus propiedades</h3>
+
+<pre class="brush: js">const inventario = [
+    {nombre: 'manzanas', cantidad: 2},
+    {nombre: 'bananas', cantidad: 0},
+    {nombre: 'cerezas', cantidad: 5}
+];
+
+function esCereza(fruta) {
+    return fruta.nombre === 'cerezas';
+}
+
+console.log(inventario.find(esCereza));
+// { nombre: 'cerezas', cantidad: 5 }</pre>
+
+<h4 id="Utilizando_funciones_flecha_y_destructuring">Utilizando funciones flecha y destructuring</h4>
+
+<pre class="brush: js">const inventario = [
+    {nombre: 'manzanas', cantidad: 2},
+    {nombre: 'bananas', cantidad: 0},
+    {nombre: 'cerezas', cantidad: 5}
+];
+
+const resultado = inventario.find( fruta =&gt; fruta.nombre === 'cerezas' );
+
+console.log(resultado); // { nombre: 'cerezas', cantidad: 5 }</pre>
+
+<h3 id="Encontrar_un_número_primo_en_un_array">Encontrar un número primo en un array</h3>
+
+<p>El siguiente ejemplo encuentra un elemento en un array que sea un número primo (o devuelve {{jsxref("undefined")}} si no hay un número primo).</p>
+
+<pre class="brush: js">function isPrime(element, index, array) {
+  let start = 2;
+  while (start &lt;= Math.sqrt(element)) {
+    if (element % start++ &lt; 1) {
+      return false;
+    }
+  }
+  return element &gt; 1;
+}
+
+console.log([4, 6, 8, 12].find(isPrime)); // undefined, no encontrado
+console.log([4, 5, 8, 12].find(isPrime)); // 5
+</pre>
+
+<p>Los siguientes ejemplos muestran cómo elementos no existentes o eliminados son visitados y el valor pasado a <code>callback</code> es su valor cuando son visitados.</p>
+
+<pre class="brush: js">// Declarar un array sin elementos en los índices 2, 3 y 4
+const array = [0,1,,,,5,6];
+
+// Muestra todos los índices, no sólo aquellos que tienen valores asignados
+array.find(function(value, index) {
+  console.log('Visited index ' + index + ' with value ' + value);
+});
+
+// Mostrar todos los índices, incluyendo los eliminados
+array.find(function(value, index) {
+
+  // Eliminar el elemento 5 en la primera iteración
+  if (index == 0) {
+    console.log('Deleting array[5] with value ' + array[5]);
+    delete array[5];
+  }
+  // El elemento 5 se visita aun habiendo sido eliminado
+  console.log('Visited index ' + index + ' with value ' + value);
+});
+// expected output:
+// Deleting array[5] with value 5
+// Visited index 0 with value 0
+// Visited index 1 with value 1
+// Visited index 2 with value undefined
+// Visited index 3 with value undefined
+// Visited index 4 with value undefined
+// Visited index 5 with value undefined
+// Visited index 6 with value 6
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este método ha sido añadido a la espeficicación ECMAScript 2015 y puede no estar disponible en todas las implementaciones de JavaScript aún. Sin embargo, puedes utilizar el siguiente polyfill de <code>Array.prototype.find</code>:</p>
+
+<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.find
+if (!Array.prototype.find) {
+  Object.defineProperty(Array.prototype, 'find', {
+    value: function(predicate) {
+     // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length &gt;&gt;&gt; 0;
+
+      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+
+      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
+      var thisArg = arguments[1];
+
+      // 5. Let k be 0.
+      var k = 0;
+
+      // 6. Repeat, while k &lt; len
+      while (k &lt; len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kValue be ? Get(O, Pk).
+        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
+        // d. If testResult is true, return kValue.
+        var kValue = o[k];
+        if (predicate.call(thisArg, kValue, k, o)) {
+          return kValue;
+        }
+        // e. Increase k by 1.
+        k++;
+      }
+
+      // 7. Return undefined.
+      return undefined;
+    },
+    configurable: true,
+    writable: true
+  });
+}
+</pre>
+
+<p>Si necesitas dar soporte a motores de JavaScript realmente obsoletos que no soportan <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, es mejor no utilizar el polyfill para los métodos <code>Array.prototype</code>, ya que no podrás hacerlos no enumerables.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.find', 'Array.prototype.find')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.find")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.findIndex()")}} – encuentra y devuelve un índice</li>
+ <li>{{jsxref("Array.prototype.includes()")}} – comprueba que un valor existe en el array</li>
+ <li>{{jsxref("Array.prototype.filter()")}} – elimina todos los elementos que no coincidan</li>
+ <li>{{jsxref("Array.prototype.every()")}} – comprueba todos los elementos</li>
+ <li>{{jsxref("Array.prototype.some()")}} – comprueba hasta que un elemento coincide</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/findindex/index.html b/files/es/web/javascript/reference/global_objects/array/findindex/index.html
new file mode 100644
index 0000000000..06e3b69fc4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/findindex/index.html
@@ -0,0 +1,188 @@
+---
+title: Array.prototype.findIndex()
+slug: Web/JavaScript/Reference/Global_Objects/Array/findIndex
+tags:
+  - Array
+  - ECMAScript 2015
+  - JavaScript
+  - Protitipo
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/findIndex
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/findIndex
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>findIndex()</strong></code> devuelve el <strong>índice</strong> del <strong>primer elemento</strong> de un array que cumpla con la función de prueba proporcionada. En caso contrario devuelve -1.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-findindex.html","shorter")}}</div>
+
+<p>Vea también el método {{jsxref("Array.find", "find()")}}, que devuelve el <strong>valor </strong>de un elemento encontrado en el array en lugar de su índice.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.findIndex(<var>callback</var>( <var>element</var>[, <var>index</var>[, <var>array</var>]] )[, <var>thisArg</var>])
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>callback</var></code></dt>
+ <dd>
+ <p>Función a ejecutar en cada uno de los valores del array hasta que devuelve <code>true</code>, indicando que el elemento que la cumple fue encontrado.</p>
+
+ <p>Recibe tres argumentos:</p>
+
+ <dl>
+  <dt><code><var>element</var></code></dt>
+  <dd>El elemento actual siendo procesado en el array.</dd>
+  <dt><code><var>index</var></code> {{optional_inline}}</dt>
+  <dd>El índice del elemento actual que está siendo procesado en el array.</dd>
+  <dt><code><var>array</var></code> {{optional_inline}}</dt>
+  <dd>El array <code>findIndex()</code> de donde fue llamado.</dd>
+ </dl>
+ </dd>
+ <dt><code><var>thisArg</var></code> {{optional_inline}}</dt>
+ <dd>Objeto opcional para usar como <code>this</code> cuando se ejecuta el <code><var>callback</var></code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un índice en el array si un elemento pasa la prueba; en caso contrario, <code>-1</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>findIndex()</code> ejecuta la función de <em><code>callback</code></em> una vez por cada índice del array hasta que encuentre uno donde <em><code>callback</code></em> devuelva un valor verdadero (eso es, un valor que <a href="/en-US/docs/Glossary/Type_Conversion">fuerza</a> un <code>true</code>).</p>
+
+<p>Si dicho elemento es encontrado, <code>findIndex()</code> inmediatamente devuelve el índice del elemento. Si la función <em><code>callback</code></em> nunca devuelve un valor verdadero (o el tamaño del array es 0), <code>findIndex</code> devuelve <code>-1</code>.</p>
+
+<div class="blockIndicator note">
+<p><strong>Alerta de Edge Case:</strong> A diferencia de otros métodos de arrays como {{jsxref("Array.some()")}}, <code><var>callback</var></code> se ejecuta incluso en índices sin valores asignados.</p>
+</div>
+
+<p><em><code>callback</code></em> se invoca con tres argumentos:</p>
+
+<ol>
+ <li>El valor del elemento</li>
+ <li>El índice del elemento</li>
+ <li>El Array que será recorrido.</li>
+</ol>
+
+<p>Si el parámetro <code>thisArg</code> es provisto a findIndex, entonces será usado como el this para cada invocación del <code>callback</code>. Si no es provisto, entonces {{jsxref("undefined")}} será utilizado. </p>
+
+<p>El rango de elementos procesados por <code>findIndex()</code> se establece antes de la primera invocación de la función <em><code>callback</code></em>. Los elementos añadidos al array después de que la llamada a <code>findIndex()</code> comience no serán visitados por el <code>callback</code>. Si un elemento existente que no ha sido visitado en el array es modificado por el <em><code>callback</code></em>, el valor pasado al <em><code>callback</code></em> que lo visite será el valor en el momento en que <code>findIndex()</code> visite el índice del elemento.</p>
+
+<p>Los elementos <a href="/es/docs/Web/JavaScript/Referencia/Operadores/delete">eliminados</a> aún son visitados.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Encontrar_el_índice_de_un_número_primo_en_un_array">Encontrar el índice de un número primo en un array</h3>
+
+<p>El siguiente ejemplo encuentra el índice de un elemento en el array que sea número primo (o devuelve <code>-1</code> si no hay ningún número primo).</p>
+
+<pre class="brush: js">function isPrime(element, index, array) {
+  var start = 2;
+  while (start &lt;= Math.sqrt(element)) {
+    if (element % start &lt; 1) {
+      return false;
+    } else {
+      start++;
+    }
+  }
+  return element &gt; 1;
+}
+
+console.log([4, 6, 8, 12].findIndex(isPrime)); // -1, no encontrado
+console.log([4, 6, 7, 12].findIndex(isPrime)); // 2
+</pre>
+
+<h3 id="Encontrar_un_índice_utilizando_funciones_flecha">Encontrar un índice utilizando funciones flecha</h3>
+
+<p>El siguiente ejemplo encuentra el índice de una fruta utilizando funciones flecha.</p>
+
+<pre class="brush: js">const fruits = ["apple", "banana", "cantaloupe", "blueberries", "grapefruit"];
+
+const index = fruits.findIndex(fruit =&gt; fruit === "blueberries");
+
+console.log(index); // 3
+console.log(fruits[index]); // blueberries
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.findIndex
+if (!Array.prototype.findIndex) {
+  Object.defineProperty(Array.prototype, 'findIndex', {
+    value: function(predicate) {
+     // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length &gt;&gt;&gt; 0;
+
+      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+
+      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
+      var thisArg = arguments[1];
+
+      // 5. Let k be 0.
+      var k = 0;
+
+      // 6. Repeat, while k &lt; len
+      while (k &lt; len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kValue be ? Get(O, Pk).
+        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
+        // d. If testResult is true, return k.
+        var kValue = o[k];
+        if (predicate.call(thisArg, kValue, k, o)) {
+          return k;
+        }
+        // e. Increase k by 1.
+        k++;
+      }
+
+      // 7. Return -1.
+      return -1;
+    },
+    configurable: true,
+    writable: true
+  });
+}
+</pre>
+
+<p>Si necesita soporte para motores de JavaScript obsoletos que no soportan <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/defineProperty">Object.defineProperty</a></code> es mejor no emplear polyfills para métodos <code>Array.prototype</code>, ya que no puede hacerlos no-enumerables.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.findindex', 'Array.prototype.findIndex')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.findIndex")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.find()")}}</li>
+ <li>{{jsxref("Array.prototype.indexOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/flat/index.html b/files/es/web/javascript/reference/global_objects/array/flat/index.html
new file mode 100644
index 0000000000..2191409d07
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/flat/index.html
@@ -0,0 +1,175 @@
+---
+title: Array.prototype.flat()
+slug: Web/JavaScript/Reference/Global_Objects/Array/flat
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/flat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/flat
+---
+<div>{{JSRef}} {{SeeCompatTable}}</div>
+
+<p>El método <code><strong>flat()</strong></code> crea una nueva matriz con todos los elementos de sub-array concatenados recursivamente hasta la profundidad especificada.</p>
+
+<p class="hidden">\{{EmbedInteractiveExample("pages/js/array-flat.html")}}</p>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>var newArray = arr</var>.flat(<var>[depth]</var>);</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>depth</code> {{optional_inline}}</dt>
+ <dd>El nivel de profundidad que especifica qué tan profunda debe aplanarse una estructura de matriz anidada. El valor predeterminado es 1.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una nueva matriz con los elementos de la sub-matriz concatenados en ella.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Aplanar_matrices_anidadas">Aplanar matrices anidadas</h3>
+
+<pre class="brush: js">var arr1 = [1, 2, [3, 4]];
+arr1.flat();
+// [1, 2, 3, 4]
+
+var arr2 = [1, 2, [3, 4, [5, 6]]];
+arr2.flat();
+// [1, 2, 3, 4, [5, 6]]
+
+var arr3 = [1, 2, [3, 4, [5, 6]]];
+arr3.flat(2);
+// [1, 2, 3, 4, 5, 6]
+</pre>
+
+<h3 id="Aplanamiento_y_huecos_de_matriz">Aplanamiento y huecos de matriz</h3>
+
+<p>El método de aplanar elimina las ranuras vacías en las matrices:</p>
+
+<pre class="brush: js">var arr4 = [1, 2, , 4, 5];
+arr4.flat();
+// [1, 2, 4, 5]
+</pre>
+
+<h2 id="Alternativa">Alternativa</h2>
+
+<h3 id="reduce_y_concat"><code>reduce</code> y <code>concat</code></h3>
+
+<pre class="brush: js">var arr1 = [1, 2, [3, 4]];
+arr1.flat();
+
+//aplanar una matriz de nivel único
+arr1.reduce((acc, val) =&gt; acc.concat(val), []);// [1, 2, 3, 4]
+
+//o
+const flatSingle = arr =&gt; [].concat(...arr);
+</pre>
+
+<p> </p>
+
+<pre class="brush: js">//para permitir el aplanamiento a nivel profundo use recursión con reduce y concat
+var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
+
+function flattenDeep(arr1) {
+   return arr1.reduce((acc, val) =&gt; Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
+}
+flattenDeep(arr1); // [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]
+</pre>
+
+<p> </p>
+
+<pre class="brush: js">//aplanamiento profundo no recursivo usando un stack
+var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
+function flatten(input) {
+  const stack = [...input];
+  const res = [];
+  while (stack.length) {
+    // elimina ultimo valor del stack
+    const next = stack.pop();
+    if (Array.isArray(next)) {
+      // agrega de nuevo los items al array, sin modificar la entrada original
+      stack.push(...next);
+    } else {
+      res.push(next);
+    }
+  }
+  //invierte para restaurar el orden de entrada
+  return res.reverse();
+}
+flatten(arr1);// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]</pre>
+
+<p> </p>
+
+<pre class="brush: js">//Aplanamiento profundo recursivo
+function flatten(array) {
+  var flattend = [];
+  !(function flat(array) {
+    array.forEach(function(el) {
+      if (Array.isArray(el)) flat(el);
+      else flattend.push(el);
+    });
+  })(array);
+  return flattend;
+}</pre>
+
+<p> </p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">if (!Array.prototype.flat) {
+  Array.prototype.flat = function(depth) {
+    var flattend = [];
+    (function flat(array, depth) {
+      for (let el of array) {
+        if (Array.isArray(el) &amp;&amp; depth &gt; 0) {
+          flat(el, depth - 1);
+        } else {
+          flattend.push(el);
+        }
+      }
+    })(this, Math.floor(depth) || 1);
+    return flattend;
+  };
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td><a href="https://tc39.github.io/proposal-flatMap/#sec-Array.prototype.flat"><code>Array.prototype.flat</code> proposal</a></td>
+   <td>Finalizado (4)</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.flat")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.flatMap()")}}</li>
+ <li>{{jsxref("Array.prototype.map()")}}</li>
+ <li>{{jsxref("Array.prototype.reduce()")}}</li>
+ <li>{{jsxref("Array.prototype.concat()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/flatmap/index.html b/files/es/web/javascript/reference/global_objects/array/flatmap/index.html
new file mode 100644
index 0000000000..cbdabc94b2
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/flatmap/index.html
@@ -0,0 +1,129 @@
+---
+title: Array.prototype.flatMap()
+slug: Web/JavaScript/Reference/Global_Objects/Array/flatMap
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/flatMap
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/flatMap
+---
+<div>{{JSRef}} {{SeeCompatTable}}</div>
+
+<p>El método <code><strong>flatMap()</strong></code> primero mapea cada elemento usando una función de mapeo, luego aplana el resultado en una nueva matriz. Es idéntico a un <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a> seguido de un <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/flatten">flatten </a>de profundidad 1, pero <code>flatMap</code> es a menudo útil y la fusión de ambos en un método es ligeramente más eficiente.</p>
+
+<p class="hidden">\{{EmbedInteractiveExample("pages/js/array-flatmap.html")}}</p>
+
+<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo, se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone </span></span><a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a><span class="tlid-translation translation" lang="es"><span title=""> y envíenos una solicitud de extracción.</span></span></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>var new_array = arr</var>.flatMap(function <var>callback(currentValue[, index[, array]]) {
+    // return element for new_array
+}</var>[, <var>thisArg</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función que produce un elemento de la nueva matriz, tomando tres argumentos:
+ <dl>
+  <dt></dt>
+  <dt><code>currentValue</code></dt>
+  <dd>El elemento actual que se procesa en la matriz.</dd>
+  <dt><code>index</code>{{optional_inline}}</dt>
+  <dd>El índice del elemento actual que se procesa en la matriz.</dd>
+  <dt><code>array</code>{{optional_inline}}</dt>
+  <dd>La matriz <code>map</code> fue llamada.</dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code>{{optional_inline}}</dt>
+ <dd>Valor para usar como <code>this</code> al ejecutar <code>callback</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una nueva matriz con cada elemento es el resultado de la función de devolución de llamada y se aplana a una profundidad de 1.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Ver {{jsxref("Array.prototype.map()")}} para una descripción detallada de la función de devolución de llamada. El método <code>flatMap</code> es idéntico a <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a></code> seguido de una llamada a <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/flatten">flatten</a></code> de profundidad 1.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="map_y_flatMap"><code>map</code> y <code>flatMap</code></h3>
+
+<pre class="brush: js">var arr1 = <span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>[</span></span><span class="constant decimal js numeric"><span>1</span></span><span class="comma delimiter js meta object"><span>,</span></span><span> </span><span class="brace js meta square"><span>2, 3, 4];
+
+arr1.map(</span></span></span></span></span>x =&gt; [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>);</span></span></span></span></span>
+// [[2], [4], [6], [8]]
+
+arr1.flatMap(x =&gt; [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>);
+// [2, 4, 6, 8]</span></span></span></span></span>
+
+// solo un nivel es aplanado
+arr1.flatMap(x =&gt; [[x * 2]]);
+// [[2], [4], [6], [8]]
+</pre>
+
+<div class="line"><span class="js source"><span class="comment double-slash js line"><span class="comment definition js punctuation"><span>//</span></span><span>=&gt; [1, 2, 3, 4, 5, 6, 7, 8, 9]</span></span></span></div>
+
+<h2 id="Alternativa">Alternativa</h2>
+
+<h3 id="reduce_y_concat"><code>reduce</code> y <code>concat</code></h3>
+
+<pre class="brush: js">var arr1 = <span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>[</span></span><span class="constant decimal js numeric"><span>1</span></span><span class="comma delimiter js meta object"><span>,</span></span><span> </span><span class="brace js meta square"><span>2, 3, 4];
+</span></span></span></span></span>
+arr1.flatMap(x =&gt; [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>);</span></span></span></span></span>
+// es equivalente a
+arr1.reduce((acc, x) =&gt; acc.concat([x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>), []);</span></span></span></span></span>
+<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>// [2, 4, 6, 8]</span></span></span></span></span>
+</pre>
+
+<div class="line"><span class="js source"><span class="comment double-slash js line"><span class="comment definition js punctuation"><span>//</span></span><span>=&gt; [1, 2, 3, 4, 5, 6, 7, 8, 9]</span></span></span></div>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este polyfill necesita <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat" title="Array.prototype.flat()">Array.prototype.flat polyfill</a></p>
+
+<pre class="brush: js">if (!Array.prototype.flatMap) {
+  Array.prototype.flatMap = function() {
+    return Array.prototype.map.apply(this, arguments).flat(1);
+  };
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td><a href="https://tc39.github.io/proposal-flatMap/#sec-Array.prototype.flatMap"><code>Array.prototype.flatMap</code> </a></td>
+   <td>Finalizado (4)</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.flatMap")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.flatten()")}}</li>
+ <li>{{jsxref("Array.prototype.map()")}}</li>
+ <li>{{jsxref("Array.prototype.reduce()")}}</li>
+ <li>{{jsxref("Array.prototype.concat()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/foreach/index.html b/files/es/web/javascript/reference/global_objects/array/foreach/index.html
new file mode 100644
index 0000000000..d93888eb93
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/foreach/index.html
@@ -0,0 +1,258 @@
+---
+title: Array.prototype.forEach()
+slug: Web/JavaScript/Reference/Global_Objects/Array/forEach
+tags:
+  - Array
+  - ECMAScript5
+  - JavaScript
+  - JavaScript 1.6
+  - Method
+  - Prototype
+  - Referencia
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/forEach
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>forEach()</strong></code> ejecuta la función indicada una vez por cada elemento del array.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-foreach.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>arr</var>.forEach(function <var>callback(currentValue, index, array) {
+    // tu iterador
+}</var>[, <var>thisArg</var>]);</pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función a ejecutar por cada elemento, que recibe tres argumentos:</dd>
+ <dd>
+ <dl>
+  <dt><code>currentValue</code></dt>
+  <dd>El elemento actual siendo procesado en el array.</dd>
+  <dt><code>index</code> {{optional_inline}}</dt>
+  <dd>El índice del elemento actual siendo procesado en el array.</dd>
+  <dt><code>array</code> {{optional_inline}}</dt>
+  <dd>El vector en el que <code>forEach()</code> esta siendo aplicado.</dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code> {{optional_inline}}</dt>
+ <dd>Valor que se usará como <code>this</code> cuando se ejecute el <code>callback</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>{{jsxref("undefined")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>forEach()</code> ejecuta la función <code>callback</code> una vez por cada elemento presente en el array en orden ascendente. No es invocada para índices que han sido eliminados o que no hayan sido inicializados (Ej. sobre arrays <code>sparse</code>)</p>
+
+<p><code>callback</code> es invocada con tres argumentos:</p>
+
+<ol>
+ <li>el valor del elemento</li>
+ <li>el índice del elemento</li>
+ <li>el array que está siendo recorrido</li>
+</ol>
+
+<p>Si un parámetro <code>thisArg</code> es proporcionado a <code>forEach</code>, será usado como el valor <code>this</code> para cada invocación de <code>callback</code> como si se llamara a <code>callback.call(thisArg, element, index, array)</code>. Si <code>thisArg</code> es <code>undefined</code> o <code>null</code>, el valor <code>this</code> dentro de la función depende si la función está o no en <a href="/es/docs/Web/JavaScript/Referencia/Modo_estricto" title="JavaScript/Strict_mode">modo estricto</a> (valor pasado si está en modo estricto, objeto global si está en modo no-estricto).</p>
+
+<p>El rango de elementos procesados por <code>forEach()</code> se establece antes de la primera invocación del <code>callback</code>. Los elementos que sean añadidos al vector después de que inicie la llamada a <code>forEach</code> no serán visitados por <code>callback</code>. Si los valores de los elementos existentes en el vector son modificados, el valor pasado al <code>callback</code> será el valor al momento de que forEach los visite; no se evaluarán los elementos borrados antes de ser visitados por <code>forEach</code>.</p>
+
+<p><code>forEach()</code> ejecuta la función <code>callback</code> una vez por cada elemento del array; a diferencia de {{jsxref("Array.prototype.map()", "map()")}} o {{jsxref("Array.prototype.reduce()", "reduce()")}} este siempre devuelve el valor {{jsxref("undefined")}} y no es encadenable. El típico uso es ejecutar los efectos secundarios al final de la cadena.</p>
+
+<p><code>foreach()</code> no muta/modifica el array desde el que es llamado (aunque <code>callback</code>, si se invoca, podría hacerlo).</p>
+
+<div class="note"><strong>Nota :</strong> No hay forma de detener o cortar un bucle <code>forEach</code> que no sea lanzar una excepción. Si necesita dicho comportamiento, el método <code>.forEach()</code> es la herramienta equivocada, use una simple iteración en su lugar. Si está probando los elementos del array para un predicado y necesita devolver un valor boleano, puede usar {{jsxref("Array.prototype.every()", "every()")}} o {{jsxref("Array.prototype.some()", "some()")}} en su lugar.</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Imprimiendo_el_contenido_de_un_array">Imprimiendo el contenido de un <code>array</code></h3>
+
+<p>El siguiente código imprime una línea por cada elemento en un array:</p>
+
+<pre class="brush:js notranslate">function logArrayElements(element, index, array) {
+    console.log("a[" + index + "] = " + element);
+}
+// Nótese que se evita el 2° índice ya que no hay ningún elemento en esa posición del array
+[2, 5, , 9].forEach(logArrayElements);
+// salida:
+// a[0] = 2
+// a[1] = 5
+// a[2] = 9
+</pre>
+
+<h3 id="Usando_thisArg">Usando <code>thisArg</code></h3>
+
+<p>El siguiente ejemplo actualiza las propiedades del objeto por cada entrada en el array:</p>
+
+<pre class="brush:js notranslate">function Counter() {
+  this.sum = 0;
+  this.count = 0;
+}
+Counter.prototype.add = function(array) {
+  array.forEach(function(entry) {
+    this.sum += entry;
+    ++this.count;
+  }, this);
+  // ^---- Note
+};
+
+var obj = new Counter();
+obj.add([2, 5, 9]);
+obj.count
+// 3
+obj.sum
+// 16</pre>
+
+<p>Nota: Dado que el parámetro <code>thisArg</code> (this) se referencia en el <code>forEach()</code>, será pasado al <code>callback</code> cuando se invoque, para utilizarse como su valor <code>this</code>.</p>
+
+<h3 id="Ejemplo_Función_que_copia_objetos">Ejemplo: Función que copia objetos</h3>
+
+<p>El siguiente código crea una copia de un objeto dado. Hay diferentes formas de crear una copia de un objeto, ésta es sólo una de ellas y sirve para explicar cómo funciona <code>Array.prototype.forEach </code>utilizando funciones <code>Object.*</code> de ECMAScript 5.</p>
+
+<pre class="brush: js notranslate">function copy(o){
+  var copy = Object.create( Object.getPrototypeOf(o) );
+  var propNames = Object.getOwnPropertyNames(o);
+
+  propNames.forEach(function(name){
+    var desc = Object.getOwnPropertyDescriptor(o, name);
+    Object.defineProperty(copy, name, desc);
+  });
+
+  return copy;
+}
+
+var o1 = {a:1, b:2};
+var o2 = copy(o1); // o2 ahora se parece a o1
+</pre>
+
+<h3 id="Si_el_array_se_modifica_durante_la_iteración_otros_elementos_pueden_ser_omitidos.">Si el array se modifica durante la iteración, otros elementos pueden ser omitidos.</h3>
+
+<p>El siguiente ejemplo muestra por consola "uno", "dos", "cuatro". Cuando se alcanza el registro que contiene el valor "dos", el primer registro del array se desplaza, lo que hace que los registros restantes se muevan una posición. Debido a que el elemento "cuatro" está ahora en una posición anterior en el array, "tres" se omitirá. <code>forEach()</code> no hace una copia del array antes de iterar.</p>
+
+<pre class="brush:js notranslate">var words = ['uno', 'dos', 'tres', 'cuatro'];
+words.forEach(function(word) {
+  console.log(word);
+  if (word === 'dos') {
+    words.shift();
+  }
+});
+// uno
+// dos
+// cuatro
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p><code>forEach</code> se agregó de manera reciente al estándar ECMA-262; así que puede no estar presente en otras implementaciones del estándar. Se puede asegurar el uso del <span style="font-family: consolas,monaco,andale mono,monospace;">forEach</span> con tan solo agregar el siguiente código al inicio de los scripts, permitiendo así el uso de <span style="font-family: consolas,monaco,andale mono,monospace;">forEach</span> en implementaciones que no lo soportan de manera nativa. El algoritmo es el mismo que se especifica en la quinta versión de ECMA-262, asumiendo que {{jsxref("Object")}} y {{jsxref("TypeError")}} tienen sus valores originales y que <span style="font-family: consolas,monaco,andale mono,monospace;">callback.call </span>evalúa el valor original de {{jsxref("Function.prototype.call()")}}.</p>
+
+<pre class="brush: js notranslate">// Production steps of ECMA-262, Edition 5, 15.4.4.18
+// Reference: http://es5.github.com/#x15.4.4.18
+if (!Array.prototype.forEach) {
+
+  Array.prototype.forEach = function forEach(callback, thisArg) {
+    'use strict';
+    var T, k;
+
+    if (this == null) {
+      throw new TypeError("this is null or not defined");
+    }
+
+    var kValue,
+        // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
+        O = Object(this),
+
+        // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
+        // 3. Let len be ToUint32(lenValue).
+        len = O.length &gt;&gt;&gt; 0; // Hack to convert O.length to a UInt32
+
+    // 4. If IsCallable(callback) is false, throw a TypeError exception.
+    // See: http://es5.github.com/#x9.11
+    if ({}.toString.call(callback) !== "[object Function]") {
+      throw new TypeError(callback + " is not a function");
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length &gt;= 2) {
+      T = thisArg;
+    }
+
+    // 6. Let k be 0
+    k = 0;
+
+    // 7. Repeat, while k &lt; len
+    while (k &lt; len) {
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Call the Call internal method of callback with T as the this value and
+        // argument list containing kValue, k, and O.
+        callback.call(T, kValue, k, O);
+      }
+      // d. Increase k by 1.
+      k++;
+    }
+    // 8. return undefined
+  };
+}
+
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.18', 'Array.prototype.forEach')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.forEach")}}</div>
+
+<div id="compat-mobile"></div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.find()")}}</li>
+ <li>{{jsxref("Array.prototype.findIndex()")}}</li>
+ <li>{{jsxref("Array.prototype.map()")}}</li>
+ <li>{{jsxref("Array.prototype.every()")}}</li>
+ <li>{{jsxref("Array.prototype.some()")}}</li>
+ <li>{{jsxref("Map.prototype.forEach()")}}</li>
+ <li>{{jsxref("Set.prototype.forEach()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/from/index.html b/files/es/web/javascript/reference/global_objects/array/from/index.html
new file mode 100644
index 0000000000..52f2c36c33
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/from/index.html
@@ -0,0 +1,243 @@
+---
+title: Array.from()
+slug: Web/JavaScript/Reference/Global_Objects/Array/from
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Referencia
+  - Vector
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/from
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/from
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Array.from()</strong></code> crea una nueva instancia de <code>Array</code> a partir de un objeto iterable.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-from.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Array.from(arrayLike[, mapFn[, thisArg]])
+</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>arrayLike</code></dt>
+ <dd>Objeto iterable para convertirlo en un array.</dd>
+ <dt><code>mapFn</code>{{Optional_inline}}</dt>
+ <dd>Función de mapa para llamar a cada elemento de la matriz.</dd>
+ <dt><code>thisArg</code>{{Optional_inline}}</dt>
+ <dd>Valor para usar como <code>this</code> al ejecutar <code>mapFn</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una nueva instancia de {{jsxref("Array")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>Array.from()</code> permite crear <code>Arrays</code> de:</p>
+
+<ul>
+ <li>Objetos array-like (objetos con propiedad <code>length</code> o elementos indexados).</li>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Iteration_protocols">Objetos iterables</a> (objetos de los cuales se pueden obtener sus elementos como {{jsxref("Map")}} y {{jsxref("Set")}}).</li>
+</ul>
+
+<p><code>Array.from()</code> tiene un parámetro opcional <code>mapFn</code>, que te permite ejecutar una función {{jsxref("Array.prototype.map", "map")}}  a cada elemento del array (o a la subclase del objeto) que se ha creado. Para aclararlo, <code>Array.from(obj, mapFn, thisArg)</code> es igual que <code>Array.from(obj).map(mapFn, thisArg)</code>, excepto en que éste no crea un array intermedio. Esto es importante para ciertas subclases de array, <a href="/es/docs/Web/JavaScript/Vectores_tipados">vectores tipados</a>, ya que el vector intermedio necesitaría tener valores truncados para trabajar con el tipo adecuado.</p>
+
+<p>La propiedad <code>length</code> del método <code>from()</code> es 1.</p>
+
+<p>En ES2015, la sintaxis de clase permite la subclasificación de clases integradas y definidas por el usuario; como resultado, los métodos estáticos como <code>Array.from</code> son "heredados" por subclases de <code>Array</code> y crean nuevas instancias de la subclase, no <code>Array</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Array_desde_un_String">Array desde un <code>String</code></h3>
+
+<pre class="brush: js">Array.from('foo');
+// [ "f", "o", "o" ]</pre>
+
+<h3 id="Array_desde_un_Set">Array desde un <code>Set</code></h3>
+
+<pre class="brush: js">const set = new Set(['foo', 'bar', 'baz', 'foo']);
+Array.from(set);
+// [ "foo", "bar", "baz" ]</pre>
+
+<h3 id="Array_desde_un_Map">Array desde un <code>Map</code></h3>
+
+<pre class="brush: js">const map = new Map([[1, 2], [2, 4], [4, 8]]);
+Array.from(map);
+// [[1, 2], [2, 4], [4, 8]]
+
+const mapper = new Map([['1', 'a'], ['2', 'b']]);
+Array.from(mapper.values());
+// ['a', 'b'];
+
+Array.from(mapper.keys());
+// ['1', '2'];
+</pre>
+
+<h3 id="Array_desde_un_objeto_Array-like_(argumentos)">Array desde un objeto Array-like (argumentos)</h3>
+
+<pre class="brush: js">function f() {
+  return Array.from(arguments);
+}
+
+f(1, 2, 3);
+
+// [ 1, 2, 3 ]</pre>
+
+<h3 id="Usando_una_función_de_flecha_y_Array.from">Usando una función de flecha y <code>Array.from</code></h3>
+
+<pre class="brush: js">// Usando una función de flecha como función
+// para manipular los elementos
+Array.from([1, 2, 3], x =&gt; x + x);
+// [2, 4, 6]
+
+
+// Generar secuencia de números
+// Puesto que el array se inicializa con `undefined` en cada posición,
+// el valor de `v` a continuación será `undefined`
+Array.from({length: 5}, (v, i) =&gt; i);
+// [0, 1, 2, 3, 4]
+</pre>
+
+<h3 id="Generador_de_secuencia_(rango)">Generador de secuencia (rango)</h3>
+
+<pre class="brush: js">// Función generadora de secuencia (comúnmente llamado "rango", ej. Clojure, PHP, etc.)
+const range = (start, stop, step) =&gt; Array.from({ length: (stop - start) / step + 1}, (_, i) =&gt; start + (i * step));
+
+// Genera un rango de números entre 0..4
+range(0, 4, 1);
+// [0, 1, 2, 3, 4]
+
+// Genera un rango de números entre 1..10 con saltos de 2
+range(1, 10, 2);
+// [1, 3, 5, 7, 9]
+
+// Generar el abecedario utilizando Array.from haciendo uso de que se ordena como secuencia
+range('A'.charCodeAt(0), 'Z'.charCodeAt(0), 1).map(x =&gt; String.fromCharCode(x));
+// ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p><code>Array.from</code> fue añadido en el estándar ECMA-262 en la 6ta edición (ES2015); así que no puede estar presente en otras implementaciones del estándar. Puedes usarlo insertando este código al comienzo de sus scripts, permitiendo el uso de <code>Array.from</code> en implementaciones que no lo soportan. Este algoritmo es el mismo especificado en ECMA-262, 6ta edición, suponiendo que <code>Object</code> y <code>TypeError</code> tengan sus valores originales y <code>callback.call</code> evalúa el valor original de {{jsxref("Function.prototype.call")}}. Adicionalmente, ya que verdaderos iterables pueden no ser polyficados, esta implementación no soporta iterables genéricos como definidos en la 6ta edición de ECMA-262.</p>
+
+<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 6, 22.1.2.1
+// Referencia: https://people.mozilla.org/~jorendorff/es6-draft.html#sec-array.from
+if (!Array.from) {
+  Array.from = (function () {
+    var toStr = Object.prototype.toString;
+    var isCallable = function (fn) {
+      return typeof fn === 'function' || toStr.call(fn) === '[object Function]';
+    };
+    var toInteger = function (value) {
+      var number = Number(value);
+      if (isNaN(number)) { return 0; }
+      if (number === 0 || !isFinite(number)) { return number; }
+      return (number &gt; 0 ? 1 : -1) * Math.floor(Math.abs(number));
+    };
+    var maxSafeInteger = Math.pow(2, 53) - 1;
+    var toLength = function (value) {
+      var len = toInteger(value);
+      return Math.min(Math.max(len, 0), maxSafeInteger);
+    };
+
+    // La propiedad length del método from es 1.
+    return function from(arrayLike/*, mapFn, thisArg */) {
+      // 1. Deje a C ser el este valor.
+      var C = this;
+
+      // 2. Deje que los elementos sean ToObject(arrayLike).
+      var items = Object(arrayLike);
+
+      // 3. Retornar IfAbrupt(items).
+      if (arrayLike == null) {
+        throw new TypeError("Array.from requiere un objeto array-like - not null or undefined");
+      }
+
+      // 4. Si mapfn no está definida, entonces deja que sea false.
+      var mapFn = arguments.length &gt; 1 ? arguments[1] : void undefined;
+      var T;
+      if (typeof mapFn !== 'undefined') {
+        // 5. si no
+        // 5. a If IsCallable(mapfn) es false, lanza una excepción TypeError.
+        if (!isCallable(mapFn)) {
+          throw new TypeError('Array.from: si hay mapFn, el segundo argumento debe ser una función');
+        }
+
+        // 5. b. Si thisArg se suministró, deje que T sea thisArg; si no, deje que T esté indefinido.
+        if (arguments.length &gt; 2) {
+          T = arguments[2];
+        }
+      }
+
+      // 10. Let lenValue be Get(items, "length").
+      // 11. Let len be ToLength(lenValue).
+      var len = toLength(items.length);
+
+      // 13. If IsConstructor(C) is true, then
+      // 13. a. Let A be the result of calling the [[Construct]] internal method of C with an argument list containing the single item len.
+      // 14. a. Else, Let A be ArrayCreate(len).
+      var A = isCallable(C) ? Object(new C(len)) : new Array(len);
+
+      // 16. Let k be 0.
+      var k = 0;
+      // 17. Repeat, while k &lt; len… (also steps a - h)
+      var kValue;
+      while (k &lt; len) {
+        kValue = items[k];
+        if (mapFn) {
+          A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);
+        } else {
+          A[k] = kValue;
+        }
+        k += 1;
+      }
+      // 18. Let putStatus be Put(A, "length", len, true).
+      A.length = len;
+      // 20. Return A.
+      return A;
+    };
+  }());
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.from', 'Array.from')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.from")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+ <li>{{jsxref("Array.prototype.map()")}}</li>
+ <li>{{jsxref("TypedArray.from()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/includes/index.html b/files/es/web/javascript/reference/global_objects/array/includes/index.html
new file mode 100644
index 0000000000..9647fa1e3b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/includes/index.html
@@ -0,0 +1,182 @@
+---
+title: Array.prototype.includes()
+slug: Web/JavaScript/Reference/Global_Objects/Array/includes
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/includes
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/includes
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>includes()</strong></code> determina si una matriz incluye un determinado elemento, devuelve <code>true</code> o <code>false</code> según corresponda.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-includes.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre><var>arr</var>.includes(<var>searchElement[</var>, <var>fromIndex]</var>)</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valueToFind</code></dt>
+ <dd>
+ <p>El valor a buscar.</p>
+
+ <div class="blockIndicator note">
+ <p><strong>Nota: </strong>Al comparar cadenas de texto y caracteres, <code>includes()</code> <strong>distingue mayúsculas y minúsculas</strong>.</p>
+ </div>
+ </dd>
+ <dt><code>fromIndex</code> {{optional_inline}}</dt>
+ <dd>Posición en la matriz en la cuál se debe comenzar a buscar <code>valueToFind</code>; el primer caracter a buscar se encuentra en <code>fromIndex</code>. Un valor negativo inicia la búsqueda desde array.length + fromIndex en adelante. El valor por defecto es 0.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un {{jsxref ("Boolean")}} que es <code>true</code> si el valor <code>valueToFind</code> se encuentra dentro de la matriz (o la parte de la matriz indicada por el índice <code>fromIndex</code>, si se especifica). Todos los valores de cero se consideran iguales independientemente del signo (es decir, -0 se considera igual a 0 y +0), pero <code>false</code> no se considera igual a 0.</p>
+
+<div class="note">
+<p><strong>Note:</strong> Técnicamente hablando, <code>include()</code> usa el algoritmo <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#Same-value-zero_equality">sameValueZero</a></code> para determinar si se encuentra el elemento dado</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">[1, 2, 3].includes(2);     // true
+[1, 2, 3].includes(4);     // false
+[1, 2, 3].includes(3, 3);  // false
+[1, 2, 3].includes(3, -1); // true
+[1, 2, NaN].includes(NaN); // true
+</pre>
+
+<h3 id="fromIndex_es_mayor_o_igual_que_la_longitud_de_la_matriz"><code>fromIndex</code> es mayor o igual que la longitud de la matriz</h3>
+
+<p>Si <code>fromIndex</code> es mayor o igual que la longitud de la matriz, se devuelve <code>false</code>. No se buscará en la matriz.</p>
+
+<pre class="brush: js">var arr = ['a', 'b', 'c'];
+
+arr.includes('c', 3);   // false
+arr.includes('c', 100); // false</pre>
+
+<h3 id="El_índice_calculado_es_menor_que_0">El índice calculado es menor que 0</h3>
+
+<p>Si <code>fromIndex</code> es negativo, el índice calculado se calcula para usarse como una posición en la matriz en la cual comenzar a buscar <code>searchElement</code>. Si el índice calculado es menor que 0, se buscará la matriz completa.</p>
+
+<pre class="brush: js">// la longitud de la matriz es 3
+// fromIndex es -100
+// el índice calculado es 3 + (-100) = -97
+
+var arr = ['a', 'b', 'c'];
+
+arr.includes('a', -100); // true
+arr.includes('b', -100); // true
+arr.includes('c', -100); // true</pre>
+
+<h3 id="includes()_utilizado_como_método_genérico"><code>includes()</code> utilizado como método genérico</h3>
+
+<p>El método <code>includes()</code> es intencionalmente genérico. No requiere que este valor sea un objeto Array, por lo que se puede aplicar a otros tipos de objetos (por ejemplo, objetos tipo array). El siguiente ejemplo ilustra el método <code>includes()</code> llamado en el objeto de argumentos de la función.</p>
+
+<pre class="brush: js">(function() {
+  console.log([].includes.call(arguments, 'a')); // true
+  console.log([].includes.call(arguments, 'd')); // false
+})('a','b','c');</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.includes
+if (!Array.prototype.includes) {
+  Object.defineProperty(Array.prototype, 'includes', {
+    value: function(searchElement, fromIndex) {
+
+      if (this == null) {
+        throw new TypeError('"this" es null o no está definido');
+      }
+
+      // 1. Dejar que O sea ? ToObject(this value).
+      var o = Object(this);
+
+      // 2. Dejar que len sea ? ToLength(? Get(O, "length")).
+      var len = o.length &gt;&gt;&gt; 0;
+
+      // 3. Si len es 0, devuelve false.
+      if (len === 0) {
+        return false;
+      }
+
+      // 4. Dejar que n sea ? ToInteger(fromIndex).
+      //    (Si fromIndex no está definido, este paso produce el valor 0.)
+      var n = fromIndex | 0;
+
+      // 5. Si n ≥ 0, entonces
+      //  a. Dejar que k sea n.
+      // 6. Else n &lt; 0,
+      //  a. Dejar que k sea len + n.
+      //  b. Si k &lt; 0, Dejar que k sea 0.
+      var k = Math.max(n &gt;= 0 ? n : len - Math.abs(n), 0);
+
+      function sameValueZero(x, y) {
+        return x === y || (typeof x === 'number' &amp;&amp; typeof y === 'number' &amp;&amp; isNaN(x) &amp;&amp; isNaN(y));
+      }
+
+      // 7. Repite, mientras k &lt; len
+      while (k &lt; len) {
+        // a. Dejar que elementK sea el resultado de ? Get(O, ! ToString(k)).
+        // b. Si SameValueZero(searchElement, elementK) es true, devuelve true.
+        if (sameValueZero(o[k], searchElement)) {
+          return true;
+        }
+        // c. Incrementa k por 1.
+        k++;
+      }
+
+      // 8. Devuelve false
+      return false;
+    }
+  });
+}</pre>
+
+<p>Si necesita admitir motores de JavaScript realmente obsoletos que no son compatibles con <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, es mejor no rellenar los métodos <code>Array.prototype</code>, ya que no puede hacerlos no enumerables.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES7', '#sec-array.prototype.includes', 'Array.prototype.includes')}}</td>
+   <td>{{Spec2('ES7')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.includes', 'Array.prototype.includes')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.includes")}}</p>
+</div>
+
+<div id="compat-mobile"></div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("TypedArray.prototype.includes()")}}</li>
+ <li>{{jsxref("String.prototype.includes()")}}</li>
+ <li>{{jsxref("Array.prototype.indexOf()")}}</li>
+ <li>{{jsxref("Array.prototype.find()")}}</li>
+ <li>{{jsxref("Array.prototype.findIndex()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/index.html b/files/es/web/javascript/reference/global_objects/array/index.html
new file mode 100644
index 0000000000..6d6e5af3bf
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/index.html
@@ -0,0 +1,450 @@
+---
+title: Array
+slug: Web/JavaScript/Reference/Global_Objects/Array
+tags:
+  - Array
+  - JavaScript
+  - Matriz unidimensional
+  - Referencia
+  - Vector
+translation_of: Web/JavaScript/Reference/Global_Objects/Array
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array
+---
+<p>{{JSRef}}<br>
+ El objeto <strong><code>Array</code> </strong>de JavaScript es un objeto global que es usado en la construcción de <em>arrays</em>, que son objetos tipo lista de alto nivel.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los <em>arrays</em> son objetos similares a una lista cuyo prototipo proporciona métodos para efectuar operaciones de recorrido y de mutación. Tanto la longitud como el tipo de los elementos de un <em>array</em> son variables. Dado que la longitud de un <em>array </em>puede cambiar en cualquier momento, y los datos se pueden almacenar en ubicaciones no contiguas, no hay garantía de que los <em>arrays </em>de JavaScript sean densos; esto depende de cómo el programador elija usarlos. En general estas características son cómodas, pero si, en su caso particular, no resultan deseables, puede considerar el uso de <em>arrays</em> con tipo.</p>
+
+<h3 id="Operaciones_habituales">Operaciones habituales</h3>
+
+<p><strong>Crear un Array</strong></p>
+
+<pre class="brush: js notranslate">let frutas = ["Manzana", "Banana"]
+
+console.log(frutas.length)
+// 2
+</pre>
+
+<p><strong>Acceder a un elemento de Array mediante su índice</strong></p>
+
+<pre class="brush: js notranslate">let primero = frutas[0]
+// Manzana
+
+let ultimo = frutas[frutas.length - 1]
+// Banana</pre>
+
+<p><strong>Recorrer un Array</strong></p>
+
+<pre class="brush: js notranslate">frutas.forEach(function(elemento, indice, array) {
+    console.log(elemento, indice);
+})
+// Manzana 0
+// Banana 1</pre>
+
+<p><strong>Añadir un elemento al final de un Array</strong></p>
+
+<pre class="brush: js notranslate">let nuevaLongitud = frutas<strong>.push</strong>('Naranja') // Añade "Naranja" al final
+// ["Manzana", "Banana", "Naranja"]</pre>
+
+<p><strong>Eliminar el último elemento de un Array</strong></p>
+
+<pre class="brush: js notranslate">let ultimo = frutas<strong>.pop</strong>() // Elimina "Naranja" del final
+// ["Manzana", "Banana"]</pre>
+
+<p><strong>Añadir un elemento al principio de un Array</strong></p>
+
+<pre class="brush: js notranslate">let nuevaLongitud = frutas<strong>.unshift</strong>('Fresa') // Añade "Fresa" al inicio
+// ["Fresa" ,"Manzana", "Banana"]
+</pre>
+
+<p><strong>Eliminar el primer elemento de un Array</strong></p>
+
+<pre class="brush: js notranslate">let primero = frutas<strong>.shift</strong>() // Elimina "Fresa" del inicio
+// ["Manzana", "Banana"]
+</pre>
+
+<p><strong>Encontrar el índice de un elemento del Array</strong></p>
+
+<pre class="brush: js notranslate">frutas.push('Fresa')
+// ["Manzana", "Banana", "Fresa"]
+
+let pos = frutas<strong>.indexOf</strong>('Banana') // (pos) es la posición para abreviar
+// 1</pre>
+
+<p><strong>Eliminar un único elemento mediante su posición</strong></p>
+
+<dl>
+ <dt>  Ejemplo:</dt>
+ <dd>Eliminamos "Banana" del <em>array </em>pasándole dos parámetros: la posición del primer elemento que se elimina y el número de elementos que queremos eliminar. De esta forma, <code><strong>.splice</strong>(pos, 1)</code> empieza en la posición que nos indica el valor de la variable <code>pos</code> y elimina 1 elemento. En este caso, como <code>pos</code> vale 1, elimina un elemento comenzando en la posición 1 del <em>array,</em> es decir "Banana".</dd>
+</dl>
+
+<pre class="brush: js notranslate">let elementoEliminado = frutas<strong>.splice</strong>(pos, 1)
+// ["Manzana", "Fresa"]</pre>
+
+<p><strong>Eliminar varios elementos a partir de una posición</strong></p>
+
+<dl>
+ <dt>  Nota:</dt>
+ <dd>Con <code><strong>.splice</strong>()</code> no solo se puede eliminar elementos del array, si no que también podemos extraerlos guardándolo en un nuevo array. ¡Ojo! que al hacer esto estaríamos modificando el array de origen.</dd>
+</dl>
+
+<pre class="brush: js notranslate">let vegetales = ['Repollo', 'Nabo', 'Rábano', 'Zanahoria']
+console.log(vegetales)
+// ["Repollo", "Nabo", "Rábano", "Zanahoria"]
+
+let pos = 1, numElementos = 2
+
+let elementosEliminados = vegetales<strong>.splice</strong>(pos, numElementos)
+// ["Nabo", "Rábano"] ==&gt; Lo que se ha guardado en "elementosEliminados"
+
+console.log(vegetales)
+// ["Repollo", "Zanahoria"] ==&gt; Lo que actualmente tiene "vegetales" </pre>
+
+<p><strong>Copiar un Array</strong></p>
+
+<pre class="brush: js notranslate">let copiaArray = vegetales<strong>.slice</strong>();
+// ["Repollo", "Zanahoria"]; ==&gt; Copiado en "copiaArray"</pre>
+
+<h3 id="Acceso_a_elementos_de_un_array">Acceso a elementos de un <em>array</em></h3>
+
+<p>Los índices de los <em>arrays</em> de JavaScript comienzan en cero, es decir, el índice del primer elemento de un <em>array</em> es <code>0</code>, y el del último elemento es igual al valor de la propiedad <code>length</code> del <em>array </em>restándole 1.</p>
+
+<p>Si se utiliza un número de índice no válido, se obtendrá <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">let arr = ['este es el primer elemento', 'este es el segundo elemento', 'este es el último elemento']
+console.log(arr[0])              // escribe en consola 'este es el primer elemento'
+console.log(arr[1])              // escribe en consola 'este es el segundo elemento'
+console.log(arr[arr.length - 1]) // escribe en consola 'este es el último elemento'
+</pre>
+
+<p>Los elementos de un <em>array</em> pueden considerarse propiedades del objeto tanto como <code>toString</code> (sin embargo, para ser precisos, <code>toString()</code> es un método). Sin embargo, se obtendrá un error de sintaxis si se intenta acceder a un elemento de un <em>array</em> de la forma siguiente, ya que el nombre de la propiedad no sería válido:</p>
+
+<pre class="brush: js notranslate">console.log(arr.0) // error de sintaxis</pre>
+
+<p>No hay nada especial ni en los <em>arrays</em> de JavaScript ni en sus propiedades que ocasione esto. En JavaScript, las propiedades cuyo nombre comienza con un dígito no pueden referenciarse con la notación punto y debe accederse a ellas mediante la notación corchete.</p>
+
+<p>Por ejemplo, dado un objeto con una propiedad de nombre <code>'3d'</code>, sólo podría accederse a dicha propiedad con la notación corchete.</p>
+
+<pre class="brush: js notranslate">let decadas = [1950, 1960, 1970, 1980, 1990, 2000, 2010]
+console.log(decadas.0)  // error de sintaxis
+console.log(decadas[0]) // funciona correctamente
+</pre>
+
+<pre class="brush: js notranslate">renderizador.3d.usarTextura(modelo, 'personaje.png')
+renderizador['3d'].usarTextura(modelo, 'personaje.png')</pre>
+
+<p>Obsérvese que, en el último ejemplo, ha sido necesario poner <code>'3d'</code> entre comillas. Es posible usar también comillas con los índices del los <em>arrays</em> de JavaScript (p. ej., <code>decadas['2']</code> en vez de <code>decadas[2]</code>), aunque no es necesario.</p>
+
+<p>El motor de JavaScript transforma en un string el 2 de <code>decadas[2]</code> a través de una conversión implícita mediante <code>toString</code>. Por tanto, <code>'2'</code> y <code>'02'</code> harían referencia a dos posiciones diferentes en el objeto <code>decadas</code>, y el siguiente ejemplo podría dar <code>true</code> como resultado:</p>
+
+<pre class="brush: js notranslate">console.log(decadas['2'] != decadas['02'])</pre>
+
+<h3 id="Relación_entre_length_y_las_propiedades_numéricas">Relación entre <code>length</code> y las propiedades numéricas</h3>
+
+<p>La propiedad <code>length</code> de un <em>array</em> de JavaScript está conectada con algunas otras de sus propiedades numéricas.</p>
+
+<p>Varios de los métodos propios de un <em>array</em> (p. ej., <code>join()</code>, <code>slice()</code>, <code>indexOf()</code>, etc.) tienen en cuenta el valor de la propiedad <code>length</code> de un array cuando se les llama.</p>
+
+<p>Otros métodos (p. ej., <code>push()</code>, <code>splice()</code>, etc.) modifican la propiedad <code>length</code> de un array.</p>
+
+<pre class="brush: js notranslate">const frutas = []
+frutas.push('banana', 'manzana', 'pera')
+
+console.log(frutas.length) // 3
+</pre>
+
+<p>Cuando se le da a una propiedad de un <em>array</em> JavaScript un valor que corresponda a un índice válido para el <em>array</em> pero que se encuentre fuera de sus límites, el motor actualizará el valor de la propiedad <code>length</code> como corresponda:</p>
+
+<pre class="brush: js notranslate">frutas[5] = 'fresa'
+console.log(frutas[5])           // 'fresa'
+console.log(Object.keys(frutas)) // ['0', '1', '2', '5']
+console.log(frutas.length)       // 6
+</pre>
+
+<p>Si se aumenta el valor de <code>length</code>:</p>
+
+<pre class="brush: js notranslate">frutas.length = 10
+console.log(frutas)              // ['banana', 'manzana', 'pera', &lt;2 empty items&gt;, 'fresa', &lt;4 empty items&gt;]
+console.log(Object.keys(frutas)) // ['0', '1', '2', '5']
+console.log(frutas.length)       // 10
+console.log(frutas[8])           // undefined
+</pre>
+
+<p>Si se disminuye el valor de la propiedad <code>length</code> pueden eliminarse elementos:</p>
+
+<pre class="brush: js notranslate">frutas.length = 2
+console.log(Object.keys(frutas)) // ['0', '1']
+console.log(frutas.length)       // 2
+</pre>
+
+<p>Hay más información sobre este tema en la página sobre <code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/length">Array.length</a></code>.</p>
+
+<h3 id="Creación_de_un_array_a_partir_de_una_expresión_regular">Creación de un <em>array</em> a partir de una expresión regular</h3>
+
+<p>El resultado de una búsqueda con una <code>RegExp</code> en un string puede crear un <em>array</em> de JavaScript. Este array tendrá propiedades y elementos que proporcionan información sobre la correspondencia encontrada. Para obtener un <em>array</em> de esta forma puede utilizarse <code>RegExp.exec()</code>, <code>String.match()</code> o <code>String.replace()</code>.</p>
+
+<p>El siguiente ejemplo, y la tabla que le sigue, pueden ayudar a comprender mejor las propiedades y elementos a los que nos referimos:</p>
+
+<pre class="brush: js notranslate">// Buscar una d seguida de una o más b y, al final, de otra d
+// Recordar las b y la d final
+// No distinguir mayúsculas y minúsculas
+
+const miRe = /d(b+)(d)/i
+const miArray = miRe.exec('cdbBdbsbz')</pre>
+
+<p>Las propiedades y elementos que se obtienen de esta búsqueda son los siguientes:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedad/Elemento</th>
+   <th scope="col">Descripción</th>
+   <th scope="col">Ejemplo</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>input</code><br>
+    {{ReadOnlyInline}}</td>
+   <td>El string original sobre el que se ha realizado la búsqueda con la expresión regular</td>
+   <td><code>"cdbBdbsbz"</code></td>
+  </tr>
+  <tr>
+   <td><code>index</code><br>
+    {{ReadOnlyInline}}</td>
+   <td>El índice de la correspondencia en el string, siendo cero el de la primera posición.</td>
+   <td><code>1</code></td>
+  </tr>
+  <tr>
+   <td><code>[0]</code><br>
+    {{ReadOnlyInline}}</td>
+   <td>Los últimos caracteres que cumplen la correspondencia</td>
+   <td><code>"dbBd"</code></td>
+  </tr>
+  <tr>
+   <td><code>[1], ...[n]</code><br>
+    {{ReadOnlyInline}}</td>
+   <td>Elementos que indican las correspondencias de substrings entre paréntesis (si se han incluido) de la expresión regular. No hay límite al número de substrings entre paréntesis que se puedan utilizar.</td>
+   <td><code>[1]: "bB"<br>
+    [2]: "d"</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt><strong><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array">Array()</a></code></strong></dt>
+ <dd>Crea un nuevo objeto <code>Array</code>.</dd>
+</dl>
+
+<h2 id="Propiedades_estáticas">Propiedades estáticas</h2>
+
+<dl>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@species">get Array[@@species]</a></code></dt>
+ <dd>La función del constructor se utiliza para crear objetos derivados.</dd>
+</dl>
+
+<h2 id="Métodos_estáticos">Métodos estáticos</h2>
+
+<dl>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/from">Array.from()</a></code></dt>
+ <dd>Crea una nueva instancia de <code>Array</code> a partir de <code><em>similarAUnArray</em></code>, un objeto iterable o parecido a un <em>array.</em></dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/isArray">Array.isArray()</a></code></dt>
+ <dd>Devuelve <code>true</code> si <code><em>valor</em></code> es un <em>array</em>, y <code>false</code> en caso contrario.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/of">Array.of()</a></code></dt>
+ <dd>Crea una nueva instancia de <code>Array</code> con un número variable de parámetros, independientemente del número y del tipo de dichos parámetros.</dd>
+</dl>
+
+<h2 id="Propiedades_de_instancia">Propiedades de instancia</h2>
+
+<dl>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/length">Array.prototype.length</a></code></dt>
+ <dd>Indica el número de elementos de un <em>array</em>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@unscopables">Array.prototype[@@unscopables]</a></code></dt>
+ <dd>Símbolo que contiene todos los nombres de las propiedades que se excluyen de un ámbito de enlace <code><a href="/es/docs/Web/JavaScript/Referencia/Sentencias/with">with</a></code>.</dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/concat">Array.prototype.concat()</a></code></dt>
+ <dd>Devuelve un nuevo <em>array</em> que es la concatenación de aquél sobre el que se invoca, seguido de otros <em>array(s)</em> o valor(es).</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/copyWithin">Array.prototype.copyWithin()</a></code></dt>
+ <dd>Copia una secuencia de elementos de un <em>array</em> dentro del propio <em>array</em>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/entries">Array.prototype.entries()</a></code></dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los pares clave/valor para cada índice del <em>array</em>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/every">Array.prototype.every()</a></code></dt>
+ <dd>Devuelve <code>true</code> si todos los elementos del <em>array</em> cumplen el predicado que recibe como parámetro.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/fill">Array.prototype.fill()</a></code></dt>
+ <dd>Asigna un <em><code>valor</code></em> estático a todos los elementos del <em>array</em> entre las posiciones <code><em>inicio</em></code> y <code><em>fin</em></code>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/filter">Array.prototype.filter()</a></code></dt>
+ <dd>Devuelve un nuevo <em>array</em> que contiene todos los elementos de aquél para el cual se llama que cumplan el predicado que se le pasa como parámetro.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/find">Array.prototype.find()</a></code></dt>
+ <dd>Devuelve el primer <em><code>elemento</code></em> del <em>array </em>que cumpla el predicado que se pasa como parámetro, o <code>undefined</code> si ninguno lo cumple.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/findIndex">Array.prototype.findIndex()</a></code></dt>
+ <dd>Devuelve el índice del primer elemento del <em>array</em> que cumpla el predicado que se pasa como parámetro, o <code>-1</code> si nunguno lo cumple.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/forEach">Array.prototype.forEach()</a></code></dt>
+ <dd>Llama a la función pasada como parámetro para todos los elementos del <em>array.</em></dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/includes">Array.prototype.includes()</a></code></dt>
+ <dd>Determina si el <em>array</em> contiene el <code><em>valorBuscado</em></code> y devuelve <code>true</code> o <code>false</code> según sea el caso.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/indexOf">Array.prototype.indexOf()</a></code></dt>
+ <dd>Devuelve el índice del primer elemento del <em>array</em> que sea igual a <code><em>elementoBuscado</em></code>, o <code>-1</code> si no existe.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/join">Array.prototype.join()</a></code></dt>
+ <dd>Concatena en un string todos los elementos de un <em>array.</em></dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/keys">Array.prototype.keys()</a></code></dt>
+ <dd>Devuelve un nuevo <code>Array Iterator</code> que contiene las claves de cada índice del <em>array.</em></dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/lastIndexOf">Array.prototype.lastIndexOf()</a></code></dt>
+ <dd>Devuelve el índice del último elemento del <em>array</em> que sea igual a <code><em>elementoBuscado</em></code>, o <code>-1</code> si no existe.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/map">Array.prototype.map()</a></code></dt>
+ <dd>Devuelve un nuevo <em>array</em> que contiene el resultado de llamar a la función pasada como parámetro a todos los elementos del <em>array</em> sobre el que se invoca.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/pop">Array.prototype.pop()</a></code></dt>
+ <dd>Elimina el último elemento de un <em>array</em>, y devuelve dicho elemento.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/push">Array.prototype.push()</a></code></dt>
+ <dd>Añade uno o más elementos al final de un <em>array</em> y devuelve el nuevo valor de su propiedad <code>length</code>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduce">Array.prototype.reduce()</a></code></dt>
+ <dd>Aplica la función pasada como parámetro a un <code><em>acumulador</em></code> y a cada valor del <em>array</em>, que se recorre de izquierda a derecha, para reducirlo a un único valor.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight">Array.prototype.reduceRight()</a></code></dt>
+ <dd>Aplica la función pasada como parámetro a un <em><code>acumulador</code></em> y a cada valor del <em>array</em>, que se recorre de derecha a izquierda, para reducirlo a un único valor.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reverse">Array.prototype.reverse()</a></code></dt>
+ <dd>Invierte el orden de los elementos de un <em>array</em> (el primero pasa a ser el último y el último a ser el primero) en el propio <em>array.</em> Este método modifica el array.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/shift">Array.prototype.shift()</a></code></dt>
+ <dd>Elimina el primer elemento de un <em>array</em>, y devuelve dicho elemento.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/slice">Array.prototype.slice()</a></code></dt>
+ <dd>Extrae una porción del <em>array</em> sobre el que se llama y devuelve un nuevo <em>array</em>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/some">Array.prototype.some()</a></code></dt>
+ <dd>Devuelve <code>true</code> si al menos un elemento del <em>array</em> cumple con el predicado que se pasa como parámetro.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/sort">Array.prototype.sort()</a></code></dt>
+ <dd>Ordena los elementos de un <em>array</em>, modificando éste, y devuelve el array ordenado.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/splice">Array.prototype.splice()</a></code></dt>
+ <dd>Añade, borra o modifica elementos de un <em>array</em>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/toLocaleString">Array.prototype.toLocaleString()</a></code></dt>
+ <dd>Devuelve un string adaptado a la configuración regional que representa el <em>array</em> y sus elementos. Redefine el método <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toLocaleString">Object.prototype.toLocaleString()</a></code>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/toString">Array.prototype.toString()</a></code></dt>
+ <dd>Devuelve un string que representa el <em>array</em> y sus elementos. Redefine el método <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toString">Object.prototype.toString()</a></code>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/unshift">Array.prototype.unshift()</a></code></dt>
+ <dd>Añada uno o más elementos al inicio de un <em>array</em> y devuelve el nuevo valor de <code>length</code> para el <em>array</em> resultante.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/values">Array.prototype.values()</a></code></dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice del <em>array</em>.</dd>
+ <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@iterator">Array.prototype[@@iterator]()</a></code></dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice del <em>array</em>.</dd>
+</dl>
+
+<p>Ejemplos</p>
+
+<h3 id="Creando_un_Arreglo" name="Creando_un_Arreglo">Creación de una matriz unidimensional</h3>
+
+<p>El siguiente ejemplo crea un <em>array </em><code>mensajes</code> con una longitud de 0, y luego asigna valores a <code>mensajes[0]</code> y a <code>mensajes[99]</code>, con lo que la longitud del <em>array</em> pasa a ser 100.</p>
+
+<pre class="brush: js notranslate">let mensajes = [];
+mensajes[0] = "Hola";
+mensajes[99] = "mundo";
+
+if (mensajes.length === 100) {
+   console.log("La longitud es de 100.");
+}
+</pre>
+
+<h3 id="Creaci.C3.B3n_de_un_arreglo_de_dos_dimensiones" name="Creaci.C3.B3n_de_un_arreglo_de_dos_dimensiones">Creación de una matriz de dos dimensiones</h3>
+
+<p>El siguiente ejemplo crea una matriz bidimensional que representa un tablero de ajedrez. El primer movimiento se realiza copiando la <code>'p'</code> de <code>tablero[6][4]</code> en <code>tablero[4][4]</code>. La posición <code>[6][4]</code> se limpia.</p>
+
+<pre class="notranslate">let tablero = [
+  ['T','C','A','D','R','A','C','T'],
+  ['P','P','P','P','P','P','P','P'],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  ['p','p','p','p','p','p','p','p'],
+  ['t','c','a','d','r','a','c','t'] ]
+
+console.log(tablero.join('\n') + '\n\n')
+
+// Adelantar dos posiciones el peón de rey
+tablero[4][4] = tablero[6][4]
+tablero[6][4] = ' '
+console.log(tablero.join('\n'))</pre>
+
+<p>Este es el resultado:</p>
+
+<pre class="eval notranslate">T,C,A,D,R,A,C,T
+P,P,P,P,P,P,P,P
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+p,p,p,p,p,p,p,p
+t,c,a,d,r,a,c,t
+
+P,P,P,P,P,P,P,P
+ , , , , , , ,
+ , , , , , , ,
+ , , , ,p, , ,
+ , , , , , , ,
+p,p,p,p, ,p,p,p
+t,c,a,d,r,a,c,t
+</pre>
+
+<h3 id="Uso_de_un_array_para_tabular_un_conjunto_de_valores">Uso de un <em>array</em> para tabular un conjunto de valores</h3>
+
+<pre class="notranslate">valores = []
+for (let x = 0; x &lt; 10; x++){
+ valores.push([
+  2 ** x,
+  2 * x ** 2
+ ])
+}
+console.table(valores)</pre>
+
+<p>da como resultado:</p>
+
+<pre class="notranslate">0	1	0
+1	2	2
+2	4	8
+3	8	18
+4	16	32
+5	32	50
+6	64	72
+7	128	98
+8	256	128
+9	512	162</pre>
+
+<p>(La primera columna es el índice).</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Publicación inicial</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array-objects', 'Array')}}</td>
+   <td>ECMAScript 1</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si te gustaría contribuir a los datos, por favor visite <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una solicitud de extracción(pull request).</div>
+
+<p>{{Compat("javascript.builtins.Array")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>En la Guía de JavaScript:
+  <ul>
+   <li><a href="/es/docs/Web/JavaScript/Guide/Working_with_Objects#Indexing_object_properties">"Propiedades indexadas de un objeto"</a></li>
+   <li><a href="/es/docs/Web/JavaScript/Guide/Indexed_collections#Array_object">"Colecciones con índice: objeto Array"</a></li>
+  </ul>
+ </li>
+ <li><a href="/es/docs/JavaScript_typed_arrays">Arrays tipados</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/indexof/index.html b/files/es/web/javascript/reference/global_objects/array/indexof/index.html
new file mode 100644
index 0000000000..4f05be5df3
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/indexof/index.html
@@ -0,0 +1,249 @@
+---
+title: Array.prototype.indexOf()
+slug: Web/JavaScript/Reference/Global_Objects/Array/indexOf
+tags:
+  - Array
+  - JavaScript
+  - Method
+  - Prototype
+  - Referencia
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/indexOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/indexOf
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong>indexOf()</strong> retorna el primer índice en el que se puede encontrar un elemento dado en el array, ó retorna -1 si el elemento no esta presente.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Para el método String, ver {{jsxref("String.prototype.indexOf()")}}.</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>array</em>.indexOf(<em>searchElement</em>[, <em>fromIndex</em>])</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>searchElement</code></dt>
+ <dd>Elemento a encontrar en el array.</dd>
+ <dt><code>fromIndex</code> {{optional_inline}}</dt>
+ <dd>Indica el índice por el que se comienza la búsqueda. Por defecto es 0, por lo que se busca en todo el array. Si el índice es mayor o igual a la longitud del array, devuelve -1, ya que no se buscaría en el array. Si el valor es negativo, se toma restando posiciones desde el final del array. Hay que tener en cuenta que aunque el índice sea negativo, la búsqueda seguirá realizándose en un orden incremental. Si el índice calculado es menor de 0, la búsqueda se realizará por todo el array.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El primer índice del elemento en la matriz; -1 si no se encuentra.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p><code>indexOf()</code> compara <code>searchElement</code> con los elementos del array usando <a href="/es/docs/Web/JavaScript/Referencia/Operadores/Comparison_Operators#Using_the_Equality_Operators" title="JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">igualdad estricta</a> (el mismo método que cuando se usa ===, o el operador igualdad-triple).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_indexOf()">Usando <code>indexOf()</code></h3>
+
+<p>El siguiente ejemplo usa <code>indexof()</code> para localizar valores en un array </p>
+
+<pre class="brush: js">var array = [2, 9, 9];
+array.indexOf(2);     // 0
+array.indexOf(7);     // -1
+array.indexOf(9, 2);  // 2
+array.indexOf(2, -1); // -1
+array.indexOf(2, -3); // 0</pre>
+
+<h3 id="Encontrar_todas_las_apariciones_de_un_elemento">Encontrar todas las apariciones de un elemento</h3>
+
+<pre class="brush: js">var indices = [];
+var array = ['a', 'b', 'a', 'c', 'a', 'd'];
+var element = 'a';
+var idx = array.indexOf(element);
+while (idx != -1) {
+  indices.push(idx);
+  idx = array.indexOf(element, idx + 1);
+}
+console.log(indices);
+// [0, 2, 4]</pre>
+
+<h3 id="Encontrar_si_un_elemento_existe_en_la_matriz_o_no_y_actualizar_la_matriz">Encontrar si un elemento existe en la matriz o no y actualizar la matriz</h3>
+
+<pre class="brush: js">function updateVegetablesCollection (veggies, veggie) {
+    if (veggies.indexOf(veggie) === -1) {
+        veggies.push(veggie);
+        console.log('La nueva colección de vegetales es: ' + veggies);
+    } else if (veggies.indexOf(veggie) &gt; -1) {
+        console.log(veggie + ' ya existe en la colección de verduras.');
+    }
+}
+
+var veggies = ['patata', 'tomate', 'chiles', 'pimientoverde'];
+
+updateVegetablesCollection(veggies, 'espinaca');
+// La nueva colección de verduras es : patata, tomate, chiles, pimientoverde, espinaca
+updateVegetablesCollection(veggies, 'espinaca');
+// La espinaca ya existe en la colección de verduras.</pre>
+
+<p> </p>
+
+<h2 id="Compatibility" name="Compatibility">Polyfill</h2>
+
+<p><code>indexOf()</code> se agregó al estándar ECMA-262 en la 5<sup>a</sup> edición; por tanto no está implementado en todos los navegadores. Puedes hacerlo funcionar insertando el siguiente código al comienzo de tus scripts, permitiendo usar  <code>indexOf()</code> en implementaciones que no lo soporten de forma nativa. Este algoritmo es exáctamente el especificado en ECMA-262, 5ª edición, suponiendo que {{jsxref("Global_Objects/TypeError", "TypeError")}} y {{jsxref("Math.abs()")}} tienen sus valores originales.</p>
+
+
+<pre class="brush: js">if (!Array.prototype.indexOf) {
+  Array.prototype.indexOf = function indexOf(member, startFrom) {
+    /*
+    En el modo no estricto, si la variable `this` es null o indefinida, entonces se establece
+    en el objeto ventana. De lo contrario, `this` se convierte automáticamente en un objeto.
+    En modo estricto, si la variable `this` es nula o indefinida, se lanza `TypeError`.
+    */
+    if (this == null) {
+      throw new TypeError("Array.prototype.indexOf() - no se puede convertir `" + this + "` en objeto");
+    }
+
+    var
+      index = isFinite(startFrom) ? Math.floor(startFrom) : 0,
+      that = this instanceof Object ? this : new Object(this),
+      length = isFinite(that.length) ? Math.floor(that.length) : 0;
+
+    if (index &gt;= length) {
+      return -1;
+    }
+
+    if (index &lt; 0) {
+      index = Math.max(length + index, 0);
+    }
+
+    if (member === undefined) {
+      /*
+        Dado que `member` no está definido, las claves que no existan tendrán el valor de `same`
+        como `member` y, por lo tanto, es necesario verificarlas.
+      */
+      do {
+        if (index in that &amp;&amp; that[index] === undefined) {
+          return index;
+        }
+      } while (++index &lt; length);
+    } else {
+      do {
+        if (that[index] === member) {
+          return index;
+        }
+      } while (++index &lt; length);
+    }
+
+    return -1;
+  };
+}</pre>
+
+<p>Sin embargo, si está más interesado en todos los pequeños trozos técnicos definidos por el estándar ECMA, y está menos preocupado por el rendimiento o la concisión, entonces usted puede encontrar esta polyfill más descriptivo que sea más útil.</p>
+
+<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 5, 15.4.4.14
+// Referencia: http://es5.github.io/#x15.4.4.14
+if (!Array.prototype.indexOf) {
+  Array.prototype.indexOf = function(searchElement, fromIndex) {
+
+    var k;
+
+    // 1. Dejar que `o` sea el resultado de llamar a ToObject
+    //    pasando este valor como argumento.
+    if (this == null) {
+      throw new TypeError('"this" is null or not defined');
+    }
+
+    var o = Object(this);
+
+    // 2. Dejar que `lenValue` sea el resultado de llamar al método interno
+    //    de `o` con el argumento "length".
+    // 3. Dejar que len sea ToUint32(lenValue).
+    var len = o.length &gt;&gt;&gt; 0;
+
+    // 4. Si `len` es 0, devolver -1.
+    if (len === 0) {
+      return -1;
+    }
+
+    // 5. Si se pasó el argumento `fromIndex`, deje que `n` sea
+    //    ToInteger(fromIndex); si no, que `n` sea 0.
+    var n = fromIndex | 0;
+
+    // 6. Si n &gt;= len, devolver -1.
+    if (n &gt;= len) {
+      return -1;
+    }
+
+    // 7. Si n &gt;= 0, entonces deja que `k` sea `n`.
+    // 8. Si no, n&lt;0, deja que `k` sea `len - abs(n)`.
+    //    Si `k` es menor que 0, entonces deja que `k` sea 0.
+    k = Math.max(n &gt;= 0 ? n : len - Math.abs(n), 0);
+
+    // 9. Repite, mientras k &lt; len
+    while (k &lt; len) {
+      // a. Dejar que `Pk` sea ToString(k).
+      //   Esto está implícito para los operandos LHS del operador in
+      // b. Dejar que kPresent sea el resultado de llamar al método
+      //    interno `HasProperty` de `o` con el argumento `Pk`.
+      //   Este paso se puede combinar con `c`
+      // c. Si kPresent es verdadero, entonces
+      //    i.  Dejar que `elementK` sea el resultado de llamar al método
+      //        interno de `o` con el argumento ToString(k).
+      //   ii.  Deje que `same` sea el resultado de aplicar el
+      //        Algoritmo de comparación de igualdad estricta a
+      //        searchElement y elementK.
+      //  iii.  Si `same` es true, devuelve `k`.
+      if (k in o &amp;&amp; o[k] === searchElement) {
+        return k;
+      }
+      k++;
+    }
+    return -1;
+  };
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.14', 'Array.prototype.indexOf')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Array.indexOf")}}</p>
+
+<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
+
+<ul>
+ <li>Comenzando con Firefox 47 {{geckoRelease(47)}}, este método ya no devolverá <code>-0</code>. Por ejemplo, <code>[0] .indexOf (0, -0)</code> siempre devolverá <code>+0</code> ({{bug(1242043)}}).</li>
+</ul>
+
+<div id="compat-mobile"> </div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li>
+ <li>{{jsxref("TypedArray.prototype.indexOf()")}}</li>
+ <li>{{jsxref("String.prototype.indexOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/isarray/index.html b/files/es/web/javascript/reference/global_objects/array/isarray/index.html
new file mode 100644
index 0000000000..8cf7a9b469
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/isarray/index.html
@@ -0,0 +1,129 @@
+---
+title: Array.isArray()
+slug: Web/JavaScript/Reference/Global_Objects/Array/isArray
+tags:
+  - Array
+  - ECMAScript5
+  - JavaScript
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/isArray
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/isArray
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Array.isArray()</strong></code> determina si el valor pasado es un {{jsxref("Array")}}.</p>
+
+<pre class="brush: js">Array.isArray([1, 2, 3]);  // true
+Array.isArray({foo: 123}); // false
+Array.isArray('foobar');   // false
+Array.isArray(undefined);  // false
+</pre>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Array.isArray(<var>obj</var>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto a evaluar.</dd>
+</dl>
+
+<h3 id="Description" name="Description">Valor de retorno</h3>
+
+<p><code>true</code> si el objeto es un {{jsxref("Array")}}; en caso contrario, <code>false</code>.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Si el objeto es un {{jsxref("Array")}}, devuelve <code>true</code>; <code>false</code>, en cualquier otro caso.</p>
+
+<p>Vea el artículo <a href="http://web.mit.edu/jwalden/www/isArray.html">“Determining with absolute accuracy whether or not a JavaScript object is an array”</a> para más detalles.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<pre class="brush: js">// las siguientes llamadas devuelven true
+Array.isArray([]);
+Array.isArray([1]);
+Array.isArray(new Array());
+Array.isArray(new Array('a', 'b', 'c', 'd'));
+Array.isArray(new Array(3));
+// Hecho poco conocido: Array.prototype es también un array:
+Array.isArray(Array.prototype);
+
+// todas las siguientes llamadas devuelven false
+Array.isArray();
+Array.isArray({});
+Array.isArray(null);
+Array.isArray(undefined);
+Array.isArray(17);
+Array.isArray('Array');
+Array.isArray(true);
+Array.isArray(false);
+Array.isArray({ __proto__: Array.prototype });
+</pre>
+
+<h3 id="instanceof_vs_isArray"><code>instanceof</code> vs <code>isArray</code></h3>
+
+<p>Al comprobar una instancia <code>Array</code>, <code>Array.isArray</code> es más recomendado que <code>instanceof</code> porque funciona a través de <code>iframes</code>.</p>
+
+<pre class="brush: js">var iframe = document.createElement('iframe');
+document.body.appendChild(iframe);
+xArray = window.frames[window.frames.length - 1].Array;
+var arr = new xArray(1,2,3); // [1,2,3]
+
+// Comprobando correctamente un Array
+Array.isArray(arr);  // true
+// Considerado peligroso, porque no funciona a través de iframes
+arr instanceof Array; // false
+</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<p>Ejecutar el siguiente código antes de cualquier otro código creará un <code>Array.isArray()</code> si no está disponible de forma nativa.</p>
+
+<pre class="brush: js">if (!Array.isArray) {
+  Array.isArray = function(arg) {
+    return Object.prototype.toString.call(arg) === '[object Array]';
+  };
+}
+</pre>
+
+<h2 id="Especificaciones" name="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.3.2', 'Array.isArray')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.isarray', 'Array.isArray')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.isarray', 'Array.isArray')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.isArray")}}</div>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/join/index.html b/files/es/web/javascript/reference/global_objects/array/join/index.html
new file mode 100644
index 0000000000..09d557b9e1
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/join/index.html
@@ -0,0 +1,111 @@
+---
+title: Array.prototype.join()
+slug: Web/JavaScript/Reference/Global_Objects/Array/join
+tags:
+  - Array
+  - JavaScript
+  - Matriz
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/join
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/join
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>join()</code></strong> une todos los elementos de una matriz (o un <a href="/es/docs/Web/JavaScript/Guide/Indexed_collections#Working_with_array-like_objects">objeto similar a una matriz</a>) en una cadena y devuelve esta cadena.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-join.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr.join([separator])</var></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>separador</code> {{optional_inline}}</dt>
+ <dd>Es una <code>cadena</code> usada para separar cada uno de los elementos del arreglo. El separador es convertido a una <code>cadena</code> si es necesario. Si este se omite, los elementos del arreglo son separados con una coma (","). Si el <code>separador</code> es una <code>cadena</code> vacía todos los elementos son unidos sin ningún carácter entre ellos.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una cadena con todos los elementos de la matriz unidos. Si <code><em>arr</em>.length</code> es <code>0</code>, se devuelve la cadena vacía.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las conversiones de cadena de todos los elementos de la matriz se unen en una cadena.</p>
+
+<div class="warning">
+<p>Si un elemento <code>no está definido</code> o es <code>nulo</code>, se convierte en la cadena vacía.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uniendo_un_arreglo_cuatro_veces_en_diferentes_formas">Uniendo un arreglo cuatro veces en diferentes formas</h3>
+
+<p>El siguiente ejemplo crea un arreglo <code>a</code> con tres elementos para luego unir el arreglo cuatro veces: usando el separador predeterminado, luego una coma y un espacio, luego un signo de suma, y finalmente una cadena vacío.</p>
+
+<pre class="brush: js">var a = ['Viento', 'Lluvia', 'Fuego'];
+var miVar1 = a.join();      // asigna 'Viento,Lluvia,Fuego' a miVar1
+var miVar2 = a.join(', ');  // asigna 'Viento, Lluvia, Fuego' a miVar2
+var miVar3 = a.join(' + '); // asigna 'Viento + Lluvia + Fuego' a miVar3
+var miVar4 = a.join('');    // asigna 'VientoLluviaFuego' a miVar4
+</pre>
+
+<h3 id="Unirse_a_un_objeto_tipo_matriz">Unirse a un objeto tipo matriz</h3>
+
+<p>El siguiente ejemplo une un objeto parecido a una matriz (<code><a href="/es/docs/Web/JavaScript/Reference/Functions/arguments">argumentos</a></code>), llamando a {{jsxref("Function.prototype.call")}} en <code>Array.prototype.join</code>.</p>
+
+<pre class="brush: js">function f(a, b, c) {
+  var s = Array.prototype.join.call(arguments);
+  console.log(s); // '1,a,true'
+}
+f(1, 'a', true);
+//resultado esperado: "1,a,true"</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition</td>
+   <td>Estándar</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.5', 'Array.prototype.join')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.join', 'Array.prototype.join')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.join', 'Array.prototype.join')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.join")}}</div>
+
+<div id="compat-desktop"> </div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.split()")}}</li>
+ <li>{{jsxref("Array.prototype.toString()")}}</li>
+ <li>{{jsxref("TypedArray.prototype.join()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/keys/index.html b/files/es/web/javascript/reference/global_objects/array/keys/index.html
new file mode 100644
index 0000000000..f5d5c2ba81
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/keys/index.html
@@ -0,0 +1,85 @@
+---
+title: Array.prototype.keys()
+slug: Web/JavaScript/Reference/Global_Objects/Array/keys
+tags:
+  - Array
+  - ECMAScript 2015
+  - Iterator
+  - JavaScript
+  - Matriz
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/keys
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/keys
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>keys()</strong></code> devuelve un nuevo objeto  <code><strong>Array Iterator</strong></code> que contiene las claves de índice con las que acceder a cada elemento en el array.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-keys.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.keys()</pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un nuevo objeto iterador {{jsxref("Array")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_básico">Uso básico</h3>
+
+<pre class="brush: js">var arr = ['a', 'b', 'c'];
+var iterator = arr.keys();
+
+console.log(iterator.next()); // { value: 0, done: false }
+console.log(iterator.next()); // { value: 1, done: false }
+console.log(iterator.next()); // { value: 2, done: false }
+console.log(iterator.next()); // { value: undefined, done: true }
+</pre>
+
+<h3 id="El_iterador_no_ignora_los_huecos">El iterador no ignora los huecos</h3>
+
+<pre class="brush: js">var arr = ['a', , 'c'];
+var sparseKeys = Object.keys(arr);
+var denseKeys = [...arr.keys()];
+console.log(sparseKeys); // ['0', '2']
+console.log(denseKeys);  // [0, 1, 2]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.keys', 'Array.prototype.keys')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.keys', 'Array.prototype.keys')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.keys")}}</div>
+
+<div id="compat-mobile"> </div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.values()")}}</li>
+ <li>{{jsxref("Array.prototype.entries()")}}</li>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Iteration_protocols">Protocolos de iteración</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/lastindexof/index.html b/files/es/web/javascript/reference/global_objects/array/lastindexof/index.html
new file mode 100644
index 0000000000..5006059545
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/lastindexof/index.html
@@ -0,0 +1,165 @@
+---
+title: Array.prototype.lastIndexOf()
+slug: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf
+tags:
+  - Array
+  - Arreglo
+  - ECMAScript 5
+  - JavaScript
+  - Matriz
+  - Prototipo
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/lastIndexOf
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>lastIndexOf()</strong></code> devuelve el último índice en el que un cierto elemento puede encontrarse en el arreglo, ó <code>-1</code> si el elemento no se encontrara. El arreglo es recorrido en sentido contrario, empezando por el índice <code>fromIndex</code>.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-lastindexof.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr.lastIndexOf(searchElement) arr.lastIndexOf(searchElement, fromIndex)</var></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>searchElement</code></dt>
+ <dd>Elemento a encontrar en el arreglo.</dd>
+ <dt><code>fromIndex</code> {{optional_inline}}</dt>
+ <dd>El índice en el que empieza la búsqueda en sentido contrario. Por defecto la longitud del arreglo menos uno (<code>arr.length - 1</code>), es decir, todo el arreglo será recorrido. Si el índice es mayor o igual que la longitud del arreglo, todo el arreglo será recorrido. Si es un valor negatigo, se usará como inicio del desplazamiento el final del arreglo. Darse cuenta que aún cuando el índice es negativo, el arreglo todavía será recorrido desde atrás hacia delante. Si el índice calculado es menor de <code>0</code>, se devolverá <code>-1</code>, es decir, el arreglo no será recorrido.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El último índice del elemento en el arreglo; <code>-1</code> si no se encuentra.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>lastIndexOf</code> compara <code>searchElement</code> con los elementos del arreglo usando <a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">igualdad estricta</a> (el mismo método es usado para la ===, operador triple igualdad).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_lastIndexOf">Usando <code>lastIndexOf</code></h3>
+
+<p>El siguiente ejemplo usa <code>lastIndexOf</code> para encontrar valores en un arreglo.</p>
+
+<pre class="brush: js">var array = [2, 5, 9, 2];
+array.lastIndexOf(2);     // 3
+array.lastIndexOf(7);     // -1
+array.lastIndexOf(2, 3);  // 3
+array.lastIndexOf(2, 2);  // 0
+array.lastIndexOf(2, -2); // 0
+array.lastIndexOf(2, -1); // 3
+</pre>
+
+<h3 id="Encontrar_todas_las_apariciones_de_un_elemento">Encontrar todas las apariciones de un elemento</h3>
+
+<p>El siguiente ejemplo uses <code>lastIndexOf</code> encuentra todos los índices de un elemento en un arreglo dado, usando {{jsxref("Array.prototype.push", "push")}} añadiéndolos a otro arreglo como elementos encontrados.</p>
+
+<pre class="brush: js">var indices = [];
+var array = ['a', 'b', 'a', 'c', 'a', 'd'];
+var element = 'a';
+var idx = array.lastIndexOf(element);
+while (idx != -1) {
+  indices.push(idx);
+  idx = (idx &gt; 0 ? array.lastIndexOf(element, idx - 1) : -1);
+}
+
+console.log(indices);
+// [4, 2, 0]
+</pre>
+
+<p>Darse cuenta que en este caso tenemos que tratar <code>idx == 0</code>  de forma separada por que el elemento siempre será encontrado independiemente del valor del parámetro <code>fromIndex</code>  si este es el primer elemento del arreglo. Diferente de como se trata en el método {{jsxref("Array.prototype.indexOf", "indexOf")}}.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p><code>lastIndexOf</code> fue añadido al estándar ECMA-262 en la 5ª edición; por tanto puede que no este presente en otras implementaciones del estándar. Puedes solucionarlo escribiendo el siguiente código al principio de tus scripts, pudiendo usar <code>lastIndexOf</code> en implementaciones que no tiene soporte de forma nativa. Este algoritmo es exactamente el especificado en ECMA-262, 5ª edición, suponiendo que {{jsxref("Object")}}, {{jsxref("TypeError")}}, {{jsxref("Number")}}, {{jsxref("Math.floor")}}, {{jsxref("Math.abs")}}, y {{jsxref("Math.min")}} tienen sus valores originales.</p>
+
+<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 5, 15.4.4.15
+// Referencia: http://es5.github.io/#x15.4.4.15
+if (!Array.prototype.lastIndexOf) {
+  Array.prototype.lastIndexOf = function(searchElement /*, fromIndex*/) {
+    'use strict';
+
+    if (this === void 0 || this === null) {
+      throw new TypeError();
+    }
+
+    var n, k,
+      t = Object(this),
+      len = t.length &gt;&gt;&gt; 0;
+    if (len === 0) {
+      return -1;
+    }
+
+    n = len - 1;
+    if (arguments.length &gt; 1) {
+      n = Number(arguments[1]);
+      if (n != n) {
+        n = 0;
+      }
+      else if (n != 0 &amp;&amp; n != (1 / 0) &amp;&amp; n != -(1 / 0)) {
+        n = (n &gt; 0 || -1) * Math.floor(Math.abs(n));
+      }
+    }
+
+    for (k = n &gt;= 0 ? Math.min(n, len - 1) : len - Math.abs(n); k &gt;= 0; k--) {
+      if (k in t &amp;&amp; t[k] === searchElement) {
+        return k;
+      }
+    }
+    return -1;
+  };
+}
+</pre>
+
+<p>De nuevo, darse cuenta que esta implementación tiene como objeto la completa compatibilidad con <code>lastIndexOf</code> en Firefox y el motor SpiderMonkey JavaScript, en particular en varios casos que son posiblemente extremos. Si pretendes usar esta funcionalidad en aplicaciones reales, es posible que puedes calcular <code>from</code> con código menos complejo si ignoras estos casos.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.15', 'Array.prototype.lastIndexOf')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.lastIndexOf")}}</div>
+
+<div id="compat-mobile"></div>
+
+<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
+
+<ul>
+ <li>Desde Firefox 47 {{geckoRelease(47)}},  el método ya no devolverá <code>-0</code>. Por ejemplo, <code>[0].lastIndexOf(0, -0)</code> siempre devolverá <code>+0</code> ({{bug(1242043)}}).</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.indexOf()")}}</li>
+ <li>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/length/index.html b/files/es/web/javascript/reference/global_objects/array/length/index.html
new file mode 100644
index 0000000000..8b0317c4f9
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/length/index.html
@@ -0,0 +1,144 @@
+---
+title: Array.prototype.length
+slug: Web/JavaScript/Reference/Global_Objects/Array/length
+tags:
+  - Array
+  - JavaScript
+  - Propiedad
+  - Referencia
+  - Vector
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/length
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/length
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>length</strong></code> de un objeto que es una instancia de tipo Array establece o devuelve la cantidad de elementos en esa matriz. El valor es un entero sin signo de 32 bits que siempre es numéricamente mayor que el índice más alto en la matriz.</p>
+
+<div>
+<p>{{EmbedInteractiveExample("pages/js/array-length.html")}}</p>
+</div>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>El valor de la propiedad <code>length</code> es un número entero con un signo positivo y un valor menor que 2 a la 32<sup>a</sup> potencia (2<sup>32</sup>).</p>
+
+<pre class="brush: js">var namelistA = new Array(4294967296); //2 a la 32a potencia = 4294967296
+var namelistC = new Array(-100) //signo negativo
+
+console.log(namelistA.length); //RangeError: longitud de la matriz inválida
+console.log(namelistC.length); //RangeError: longitud de la matriz inválida
+
+
+
+var namelistB = [];
+namelistB.length = Math.pow(2,32)-1; //establecer una longitud de la matriz menor que 2 a la 32ª potencia
+console.log(namelistB.length);
+
+//4294967295</pre>
+
+<p>Puedes establecer la propiedad <code>length</code> para truncar una matriz unidimensional en cualquier momento. Cuando extiende una matriz cambiando su propiedad <code>length</code>, el número de elementos reales aumenta; por ejemplo, si se establece <code>length</code> en 3 cuando actualmente es 2, la matriz ahora contiene 3 elementos, lo que hace que el tercer elemento sea <code>undefined</code>.</p>
+
+<pre class="brush: js">var arr = [1, 2, 3];
+printEntries(arr);
+
+arr.length = 5; // establecer la longitud de la matriz en 5 mientras que actualmente es 3.
+printEntries(arr);
+
+function printEntries(arr) {
+  var length = arr.length;
+  for (var i = 0; i &lt; length; i++) {
+    console.log(arr[i]);
+  }
+  console.log('=== printed ===');
+}
+
+// 1
+// 2
+// 3
+// === impreso ===
+// 1
+// 2
+// 3
+// undefined
+// undefined
+// === impreso ===</pre>
+
+<p>Pero, la propiedad <code>length</code> no necesariamente indica el número de valores definidos en la matriz. Ver también <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array#Relationship_between_length_and_numerical_properties" title="Relationship between length and numerical properties">Relación entre <code>length</code> y las propiedades numéricas</a>.</p>
+
+<p>{{js_property_attributes(1, 0, 0)}}</p>
+
+<ul>
+ <li><code>Sobrescribir</code>: si este atributo se establece en <code>false</code>, el valor de la propiedad no se puede cambiar.</li>
+ <li><code>Configurable</code>: si este atributo se establece en <code>false</code>, cualquier intento de eliminar la propiedad o cambiar sus atributos (<code>Sobrescribir</code>, <code>Configurable </code>o <code>Numerable</code>) fallará.</li>
+ <li><code>Numerable</code>: si este atributo se establece en <code>true</code>, la propiedad se repetirá durante los bucles <a href="/es/docs/Web/JavaScript/Reference/Statements/for">for</a> o <a href="/es/docs/Web/JavaScript/Reference/Statements/for...in">for..in</a>.</li>
+</ul>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Iterating_over_an_array" name="Example:_Iterating_over_an_array">Iterando sobre una matriz</h3>
+
+<p>En el siguiente ejemplo, la matriz <code>numbers</code> se itera a través de la propiedad <code>length</code>. El valor en cada elemento se duplica.</p>
+
+<pre class="brush: js">var numbers = [1, 2, 3, 4, 5];
+var length = numbers.length;
+for (var i = 0; i &lt; length; i++) {
+  numbers[i] *= 2;
+}
+// numbers ahora es [2, 4, 6, 8, 10]</pre>
+
+<h3 id="Example:_Shortening_an_array" name="Example:_Shortening_an_array">Acortando una matriz</h3>
+
+<p>El siguiente ejemplo acorta los <code>numbers</code> de la matriz a una longitud de <code>3</code> si la longitud actual es mayor que <code>3</code>.</p>
+
+<pre class="brush: js">var numbers = [1, 2, 3, 4, 5];
+
+if (numbers.length &gt; 3) {
+  numbers.length = 3;
+}
+
+console.log(numbers); // [1, 2, 3]
+console.log(numbers.length); // 3</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1ra Edición.</td>
+   <td>Estándar</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.5.2', 'Array.length')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-properties-of-array-instances-length', 'Array.length')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-properties-of-array-instances-length', 'Array.length')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.length")}}</div>
+
+<div id="compat-mobile"> </div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/map/index.html b/files/es/web/javascript/reference/global_objects/array/map/index.html
new file mode 100644
index 0000000000..74d1eb798e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/map/index.html
@@ -0,0 +1,361 @@
+---
+title: Array.prototype.map()
+slug: Web/JavaScript/Reference/Global_Objects/Array/map
+tags:
+  - Array
+  - Arreglo
+  - Callback
+  - ECMAScript5
+  - Polifill
+  - Prototype
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/map
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/map
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>map()</strong></code> crea un nuevo array con los resultados de la llamada a la función indicada aplicados a cada uno de sus elementos.</p>
+
+<pre class="brush: js">var numbers = [1, 5, 10, 15];
+var doubles = numbers.map(function(x) {
+   return x * 2;
+});
+// doubles is now [2, 10, 20, 30]
+// numbers is still [1, 5, 10, 15]
+
+var numbers = [1, 4, 9];
+var roots = numbers.map(function(num) {
+    return Math.sqrt(num);
+});
+// roots is now [1, 2, 3]
+// numbers is still [1, 4, 9]
+</pre>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>var nuevo_array = arr</var>.map(function <var>callback(currentValue, index, array) {
+    // Elemento devuelto de nuevo_array
+}</var>[, <var>thisArg</var>])</pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función que producirá un elemento del nuevo array, recibe tres argumentos:</dd>
+ <dd>
+ <dl>
+  <dt><code>currentValue</code></dt>
+  <dd>El elemento actual del array que se está procesando.</dd>
+  <dt><code>index</code></dt>
+  <dd>El índice del elemento actual dentro del array.</dd>
+  <dt><code>array</code></dt>
+  <dd>El array sobre el que se llama <code>map.</code></dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code></dt>
+ <dd>Opcional. Valor a usar como <code>this </code>al ejecutar <code>callback</code>.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p><code>map</code> llama a la función <code>callback</code> provista <strong>una vez por elemento</strong> de un array, en orden, y construye un nuevo array con los resultados. <code>callback</code> se invoca sólo para los índices del array que tienen valores asignados; no se invoca en los índices que han sido borrados o a los que no se ha asignado valor.</p>
+
+<p><code>callback</code> es llamada con tres argumentos: el valor del elemento, el índice del elemento, y el objeto array que se está recorriendo.</p>
+
+<p>Si se indica un parámetro <code>thisArg</code> a un <code>map</code>, se usará como valor de <code>this</code> en la función <code>callback</code>. En otro caso, se pasará {{jsxref("Global_Objects/undefined", "undefined")}} como su valor <code>this</code>. El valor de <code>this</code> observable por el <code>callback</code> se determina de acuerdo a las <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">reglas habituales para determinar el valor this visto por una función.</a></p>
+
+<p><code>map</code> no modifica el array original en el que es llamado (aunque <code>callback</code>, si es llamada, puede modificarlo).</p>
+
+<p>El rango de elementos procesado por <code>map</code> es establecido antes de la primera invocación del <code>callback</code>. Los elementos que sean agregados al array después de que la llamada a <code>map </code>comience no serán visitados por el <code>callback</code>. Si los elementos existentes del array son modificados o eliminados, su valor pasado al <code>callback</code> será el valor en el momento que el <code>map</code> lo visita; los elementos que son eliminados no son visitados.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example_Mapping_an_array_of_numbers_to_an_array_of_square_roots" name="Example:_Mapping_an_array_of_numbers_to_an_array_of_square_roots">Procesar un array de números aplicándoles la raíz cuadrada</h3>
+
+<p>El siguiente código itera sobre un array de números, aplicándoles la raíz cuadrada a cada uno de sus elementos, produciendo un nuevo array a partir del inicial.</p>
+
+<pre class="brush: js">var numeros= [1, 4, 9];
+var raices = numeros.map(Math.sqrt);
+// raices tiene [1, 2, 3]
+// numeros aún mantiene [1, 4, 9]
+</pre>
+
+<h3 id="Example_Mapping_an_array_of_numbers_to_an_array_of_square_roots" name="Example:_Mapping_an_array_of_numbers_to_an_array_of_square_roots">Usando map para dar un nuevo formato a los objetos de un array</h3>
+
+<p>El siguiente código toma un array de objetos y crea un nuevo array que contiene los nuevos objetos formateados.</p>
+
+<pre class="brush: js">var kvArray = [{clave:1, valor:10},
+               {clave:2, valor:20},
+               {clave:3, valor: 30}];
+
+var reformattedArray = kvArray.map(function(obj){
+   var rObj = {};
+   rObj[obj.clave] = obj.valor;
+   return rObj;
+});
+
+// reformattedArray es ahora [{1:10}, {2:20}, {3:30}],
+
+// kvArray sigue siendo:
+// [{clave:1, valor:10},
+//  {clave:2, valor:20},
+//  {clave:3, valor: 30}]
+</pre>
+
+<h3 id="Example_Mapping_an_array_of_numbers_using_a_function_containing_an_argument" name="Example:_Mapping_an_array_of_numbers_using_a_function_containing_an_argument">Mapear un array de números usando una función con un argumento</h3>
+
+<p>El siguiente código muestra cómo trabaja <code>map </code>cuando se utiliza una función que requiere de un argumento. El argumento será asignado automáticamente a cada elemento del arreglo conforme <code>map </code>itera el arreglo original.</p>
+
+<pre class="brush: js">var numeros = [1, 4, 9];
+var dobles  = numeros.map(function(num) {
+  return num * 2;
+});
+
+// dobles es ahora [2, 8, 18]
+// numeros sigue siendo [1, 4, 9]
+</pre>
+
+<h3 id="Example_using_map_generically" name="Example:_using_map_generically">Usando <code>map</code> de forma genérica</h3>
+
+<p>Este ejemplo muestra como usar <code>map </code>en {{jsxref("Global_Objects/String", "String")}} para obtener un arreglo de bytes en codifcación ASCII representando el valor de los caracteres:</p>
+
+<pre class="brush: js">var map = Array.prototype.map;
+var valores = map.call('Hello World', function(char) { return char.charCodeAt(0); });
+// valores ahora tiene [72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
+</pre>
+
+<h3 id="Example_using_map_generically_querySelectorAll" name="Example:_using_map_generically_querySelectorAll">Usando <code>map</code> genérico con <code>querySelectorAll</code></h3>
+
+<p>Este ejemplo muestra como iterar sobre una colección de objetos obtenidos por <code>querySelectorAll</code>. En este caso obtenemos todas las opciones seleccionadas en pantalla y se imprimen en la consola:</p>
+
+<pre class="brush: js">var elems = document.querySelectorAll('select option:checked');
+var values = [].map.call(elems, function(obj) {
+  return obj.value;
+});
+</pre>
+
+<h3 id="Usando_map_para_invertir_una_cadena">Usando <code>map</code> para invertir una cadena</h3>
+
+<pre class="brush: js">var str = '12345';
+[].map.call(str, function(x) {
+  return x;
+}).reverse().join('');
+
+// Salida: '54321'
+// Bonus: usa'===' para probar si la cadena original era un palindromo
+</pre>
+
+<h3 id="Example_Tricky_use_case" name="Example:_Tricky_use_case">Caso de uso engañoso</h3>
+
+<p><a href="http://www.wirfs-brock.com/allen/posts/166">(inspirado por este artículo)</a></p>
+
+<p>Es común utilizar el callback con un argumento (el elemento siendo pasado). Ciertas funciones son también usadas comunmente con un argumento, aún cuando toman argumentos adicionales opcionales.  Estos hábitos pueden llevar a comportamientos confusos.</p>
+
+<pre class="brush: js">// Considera:
+['1', '2', '3'].map(parseInt);
+// Mientras uno esperaría [1, 2, 3]
+// en realidad se obtiene [1, NaN, NaN]
+
+// parseInt se usa comúnmente con un argumento, pero toma dos.
+// El primero es una expresión y el segundo el radix.
+// a la función callback, Array.prototype.map pasa 3 argumentos:
+// el elemento, el índice y el array.
+// El tercer argumento es ignorado por parseInt, pero no el segundo,
+// de ahí la posible confusión. Véase el artículo del blog para más detalles
+
+function returnInt(element) {
+  return parseInt(element, 10);
+}
+
+['1', '2', '3'].map(returnInt); // [1, 2, 3]
+// El resultado es un arreglo de números (como se esperaba)
+
+// Un modo más simple de lograr lo de arriba, mientras de evita el "gotcha":
+['1', '2', '3'].map(Number); // [1, 2, 3]
+</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<p><code>map</code> fue agregado al estandar ECMA-262 en la 5th edición; por lo tanto podría no estar presente en todas la implementaciones del estándar. Puedes sobrepasar esto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>map</code> en implementaciones que no lo soportan de forma nativa. Este algoritmo es exactamente el mismo especificado en ECMA-262, 5th edición, asumiendo {{jsxref("Global_Objects/Object", "Object")}}, {{jsxref("Global_Objects/TypeError", "TypeError")}}, y {{jsxref("Global_Objects/Array", "Array")}} tienen sus valores originales y que el <code>callback.call</code> evalua el valor original de <code>{{jsxref("Function.prototype.call")}}</code>.</p>
+
+<pre class="brush: js">// Production steps of ECMA-262, Edition 5, 15.4.4.19
+// Reference: http://es5.github.io/#x15.4.4.19
+if (!Array.prototype.map) {
+
+  Array.prototype.map = function(callback, thisArg) {
+
+    var T, A, k;
+
+    if (this == null) {
+      throw new TypeError(' this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the |this|
+    //    value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal
+    //    method of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length &gt;&gt;&gt; 0;
+
+    // 4. If IsCallable(callback) is false, throw a TypeError exception.
+    // See: http://es5.github.com/#x9.11
+    if (typeof callback !== 'function') {
+      throw new TypeError(callback + ' is not a function');
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length &gt; 1) {
+      T = thisArg;
+    }
+
+    // 6. Let A be a new array created as if by the expression new Array(len)
+    //    where Array is the standard built-in constructor with that name and
+    //    len is the value of len.
+    A = new Array(len);
+
+    // 7. Let k be 0
+    k = 0;
+
+    // 8. Repeat, while k &lt; len
+    while (k &lt; len) {
+
+      var kValue, mappedValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal
+      //    method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal
+        //    method of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Let mappedValue be the result of calling the Call internal
+        //     method of callback with T as the this value and argument
+        //     list containing kValue, k, and O.
+        mappedValue = callback.call(T, kValue, k, O);
+
+        // iii. Call the DefineOwnProperty internal method of A with arguments
+        // Pk, Property Descriptor
+        // { Value: mappedValue,
+        //   Writable: true,
+        //   Enumerable: true,
+        //   Configurable: true },
+        // and false.
+
+        // In browsers that support Object.defineProperty, use the following:
+        // Object.defineProperty(A, k, {
+        //   value: mappedValue,
+        //   writable: true,
+        //   enumerable: true,
+        //   configurable: true
+        // });
+
+        // For best browser support, use the following:
+        A[k] = mappedValue;
+      }
+      // d. Increase k by 1.
+      k++;
+    }
+
+    // 9. return A
+    return A;
+  };
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.19', 'Array.prototype.map')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.map', 'Array.prototype.map')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.map', 'Array.prototype.map')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.8")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.8")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Map")}} object</li>
+ <li>{{jsxref("Array.from()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/of/index.html b/files/es/web/javascript/reference/global_objects/array/of/index.html
new file mode 100644
index 0000000000..f2e406b219
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/of/index.html
@@ -0,0 +1,98 @@
+---
+title: Array.of()
+slug: Web/JavaScript/Reference/Global_Objects/Array/of
+tags:
+  - Array
+  - ECMAScript 2015
+  - JavaScript
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/of
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/of
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Array.of()</strong></code> crea una nueva instancia <code>Array</code> con un número variable de elementos pasados como argumento, independientemente del número o del tipo.</p>
+
+<p>La diferencia entre <code><strong>Array.of()</strong></code> y el constructor <code><strong>Array</strong></code> reside en como maneja los parámetros de tipo entero: <code><strong>Array.of(7)</strong></code> crea un array con un solo elemento, <code>7</code>, mientras que <code><strong>Array(7)</strong></code> crea un array vacío con una propiedad <code>length</code> de 7 (<strong>Nota:</strong> esto implica un array de 7 ranuras vacías, no ranuras con valores <code>undefined</code>).</p>
+
+<pre class="brush: js">Array.of(7);       // [7]
+Array.of(1, 2, 3); // [1, 2, 3]
+
+Array(7);          // [ , , , , , , ]
+Array(1, 2, 3);    // [1, 2, 3]</pre>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">Array.of(<var>elemento0</var>[, <var>elemento1</var>[, ...[, <var>elementoN</var>]]])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>elemento<em>N</em></code></dt>
+ <dd>Valores con los que se creará el Array en su respectivo indice.</dd>
+ <dt>
+ <h3 id="Valor_de_retorno">Valor de retorno</h3>
+ </dt>
+ <dd>Una nueva instancia de {{jsxref("Array")}}.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Esta función es parte del estándar ECMAScript 2015. Para obtener más información, consulte <a href="https://gist.github.com/rwaldron/1074126"><code>Array.of</code> y <code>Array.from</code> proposal</a> y <a href="https://gist.github.com/rwaldron/3186576"><code>Array.of</code> polyfill</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">Array.of(1);         // [1]
+Array.of(1, 2, 3);   // [1, 2, 3]
+Array.of(undefined); // [undefined]
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Escribiendo el siguiente código antes que cualquier otro, podemos emular la funcionalidad de <code>Array.of()</code> si es que ésta no está disponible de forma nativa.</p>
+
+<pre class="brush: js">if (!Array.of) {
+  Array.of = function() {
+    return Array.prototype.slice.call(arguments);
+  };
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-array.of', 'Array.of')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.of', 'Array.of')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.of")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+ <li>{{jsxref("Array.from()")}}</li>
+ <li>{{jsxref("TypedArray.of()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/pop/index.html b/files/es/web/javascript/reference/global_objects/array/pop/index.html
new file mode 100644
index 0000000000..c6e634b73b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/pop/index.html
@@ -0,0 +1,95 @@
+---
+title: Array.prototype.pop()
+slug: Web/JavaScript/Reference/Global_Objects/Array/pop
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/pop
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/pop
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>pop()</strong></code> elimina el <strong>último</strong> elemento de un array y lo devuelve. Este método cambia la longitud del array.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-pop.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.pop()</pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El elemento que ha sido eliminado del array; {{jsxref("undefined")}} si el array está vacío.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>pop</code> elimina el último elemento de un array y devuelve su valor al método que lo llamó.</p>
+
+<p><code>pop</code> es intencionadamente genérico; este método puede ser {{jsxref("Function.call", "called", "", 1)}} o {{jsxref("Function.apply", "applied", "", 1)}} en objectos similares a un array. En objetos que no contengan una propiedad <code>length</code>, que refleje su forma en una serie de propiedades numéricas consecutivas en base cero, puede no comportarse de manera significativa.</p>
+
+<p>Si se llama a <code>pop()</code> en un array vacío, devuelve {{jsxref("undefined")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Eliminando_el_último_elemento_de_un_array">Eliminando el último elemento de un array</h3>
+
+<p>El siguiente código crea el array <code>myFish</code>, que contiene cuatro elementos, a continuación, elimina su último elemento.</p>
+
+<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+
+var popped = myFish.pop();
+
+console.log(myFish); // ['angel', 'clown', 'mandarin' ]
+
+console.log(popped); // 'sturgeon'</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>Estándar</td>
+   <td>Definición inicial. Implementada en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.6', 'Array.prototype.pop')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.pop', 'Array.prototype.pop')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.pop', 'Array.prototype.pop')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.pop")}}</p>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.push()")}}</li>
+ <li>{{jsxref("Array.prototype.shift()")}}</li>
+ <li>{{jsxref("Array.prototype.unshift()")}}</li>
+ <li>{{jsxref("Array.prototype.concat()")}}</li>
+ <li>{{jsxref("Array.prototype.splice()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/push/index.html b/files/es/web/javascript/reference/global_objects/array/push/index.html
new file mode 100644
index 0000000000..346efd1854
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/push/index.html
@@ -0,0 +1,141 @@
+---
+title: Array.prototype.push()
+slug: Web/JavaScript/Reference/Global_Objects/Array/push
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/push
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/push
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>push()</strong></code> añade uno o más elementos al final de un array y devuelve la nueva longitud del array.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-push.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.push(<var>element1</var>[, ...[, <var>elementN</var>]])</pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>element<em>N</em></code></dt>
+ <dd>Los elementos a añadir al final del array.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>La nueva propiedad {{jsxref("Array.length", "length")}} del objeto sobre el cual se efectuó la llamada.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>El método <code>push</code> es muy práctico para añadir valores a un array.</p>
+
+<p><code>push</code> es genérico intencionadamente. Este método puede ser {{jsxref("Function.call", "call()")}} o {{jsxref("Function.apply", "apply()")}} a objetos que representen arrays. El método <code>push</code> depende de la propiedad <code>length</code> para decidir donde empezar a insertar los valores dados. Si el valor de la propiedad <code>length</code> no puede ser convertido en numérico, el índice 0 es usado. Esto permite la posibilidad de que la propiedad <code>length</code> sea inexistente, y en este caso <code>length</code> será creado.</p>
+
+<p>Los únicos objetos nativos que se asemejen al array son {{jsxref("Global_Objects/String", "strings", "", 1)}} objetos, aunque estos no se puedan usar en la aplicación de este método ya que son inmutables.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Ejemplo: Añadiendo elementos a un array" name="Ejemplo: Añadiendo elementos a un array">Ejemplo: Añadiendo elementos a un array</h3>
+
+<p>El siguiente código crea el array <code>sports</code> que contiene dos elementos, luego añade 2 elementos más. Tras ejecutar el código, <code>sports</code> contiene 4 elementos: "soccer", "baseball", "football" and "swimming".</p>
+
+<pre class="brush: js">var sports = ['soccer', 'baseball'];
+var total = sports.push('football', 'swimming');
+
+console.log(sports); // ['soccer', 'baseball', 'football', 'swimming']
+console.log(total);  // 4
+</pre>
+
+<h3 id="Uniendo_dos_arrays">Uniendo dos arrays</h3>
+
+<p>This example uses {{jsxref("Function.apply", "apply()")}} to push all elements from a second array.</p>
+
+<p>Do <em>not</em> use this method if the second array (<code>moreVegs</code> in the example) is very large, because the maximum number of parameters that one function can take is limited in practice. See {{jsxref("Function.apply", "apply()")}} for more details.</p>
+
+<pre class="brush: js">var vegetables = ['parsnip', 'potato'];
+var moreVegs = ['celery', 'beetroot'];
+
+// Merge the second array into the first one
+// Equivalent to vegetables.push('celery', 'beetroot');
+Array.prototype.push.apply(vegetables, moreVegs);
+
+console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']
+</pre>
+
+<h3 id="Using_an_object_in_an_array-like_fashion">Using an object in an array-like fashion</h3>
+
+<p>Como se menciona anteriormente, <code>push</code> es intencionadamente genérico, y podemos usar eso a nuestro favor. <code>Array.prototype.push</code> puede funcionar bien con un objeto, como muestra este ejemplo. Ten en cuenta que no se crea un array para almacenar una colección de objetos. En su lugar, almacenamos la colección en el propio objeto y se utiliza el método <code>call</code> sobre <code>Array.prototype.push</code> para hacer creer al método que estamos tratando a un array, y simplemente funciona, gracias a la forma en que JavaScript nos permite establecer el contexto de la ejecución.</p>
+
+<pre class="brush: js">var obj = {
+    length: 0,
+
+    addElem: function addElem(elem) {
+        // obj.length is automatically incremented
+        // every time an element is added.
+        [].push.call(this, elem);
+    }
+};
+
+// Let's add some empty objects just to illustrate.
+obj.addElem({});
+obj.addElem({});
+console.log(obj.length);
+// → 2
+</pre>
+
+<p>Tenga en cuenta que aunque <code>obj</code> no es un array, el método <code>push</code> ha incrementado satisfactoriamente la propiedad <code>length</code> de <code>obj</code> tal y como si se tratara de un array.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.7', 'Array.prototype.push')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.push")}}</p>
+</div>
+
+<h2 id="Ver también" name="Ver también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.pop()")}}</li>
+ <li>{{jsxref("Array.prototype.shift()")}}</li>
+ <li>{{jsxref("Array.prototype.unshift()")}}</li>
+ <li>{{jsxref("Array.prototype.concat()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/reduce/index.html b/files/es/web/javascript/reference/global_objects/array/reduce/index.html
new file mode 100644
index 0000000000..0c52e7555c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/reduce/index.html
@@ -0,0 +1,216 @@
+---
+title: Array.prototype.reduce()
+slug: Web/JavaScript/Reference/Global_Objects/Array/Reduce
+tags:
+  - Array
+  - ECMAScript 5
+  - JavaScript
+  - Prototype
+  - Reduce
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/Reduce
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/reduce
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>reduce()</strong></code> ejecuta una función <strong>reductora</strong> sobre cada elemento de un array, devolviendo como resultado un único valor.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-reduce.html")}}</div>
+
+<p>La función <strong>reductora</strong> recibe cuatro argumentos:</p>
+
+<ol>
+ <li>Acumulador (<code><em>acc</em></code>)</li>
+ <li>Valor Actual (<code><em>cur</em></code>)</li>
+ <li>Índice Actual (<em><code>idx</code></em>)</li>
+ <li>Array (<em><code>src</code></em>)</li>
+</ol>
+
+<p>El valor devuelto de la función <strong>reductora</strong> se asigna al acumulador, cuyo valor se recuerda en cada iteración de la matriz y, en última instancia, se convierte en el valor final, único y resultante.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr.reduce(callback(acumulador, valorActual[, índice[, array]])[, valorInicial])</var></pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función a ejecutar sobre cada elemento del array (excepto para el primero, si no se proporciona <code>valorInicial</code>), que recibe cuatro parámetros:
+ <dl>
+  <dt><code>acumulador</code></dt>
+  <dd>El acumulador acumula el valor devuelto por la función callback. Es el valor acumulado devuelto en la última invocación de callback, o el <code>valorInicial</code>, si se proveyó. (Ver a continuación).</dd>
+  <dt><code>valorActual</code></dt>
+  <dd>El elemento actual que está siendo procesado en el array.</dd>
+  <dt><code>índice</code> {{optional_inline}}</dt>
+  <dd>El índice del elemento actual que está siendo procesado en el array. Empieza desde el índice 0 si se provee <code>valorInicial</code>. En caso contrario, comienza desde el índice 1.</dd>
+  <dt><code>array</code> {{optional_inline}}</dt>
+  <dd>El array sobre el cual se llamó el método <code>reduce()</code>.</dd>
+ </dl>
+ </dd>
+ <dt><code>valorInicial</code> {{optional_inline}}</dt>
+ <dd>Un valor a usar como primer argumento en la primera llamada de la función <em><code>callback</code></em>. Si no se proporciona el <em><code>valorInicial</code></em>, el primer elemento del array será utilizado y saltado. Llamando a <code>reduce()</code> sobre un array vacío sin un <em><code>valorInicial</code></em> lanzará un {{jsxref("TypeError")}}.</dd>
+</dl>
+
+<h2 id="Descripción" name="Descripción">Descripción</h2>
+
+<p>El método <code>reduce()</code> ejecuta <code>callback</code> una vez por cada elemento presente en el array, excluyendo los huecos del mismo, recibe cuatro argumentos:</p>
+
+<ul>
+ <li><code>valorAnterior</code></li>
+ <li><code>valorActual</code></li>
+ <li><code>indiceActual</code></li>
+ <li><code>array</code></li>
+</ul>
+
+<p>La primera vez que se llama la función, <code>valorAnterior</code> y <code>valorActual</code> pueden tener uno de dos valores. Si se proveyó un <code>valorInicial</code> al llamar a <code>reduce</code>, entonces <code>valorAnterior</code> será igual al <code>valorInicial</code> y <code>valorActual</code> será igual al primer elemento del array. Si no se proveyó un <code>valorInicial</code>, entonces <code>valorAnterior</code> será igual al primer valor en el <code>array</code> y <code>valorActual</code> será el segundo.</p>
+
+<p>Si el <code>array</code> está vacío y no se proveyó un <code>valorInicial</code> lanzará un {{jsxref("Global_Objects/TypeError", "TypeError")}}. Si el <code>array</code> tiene un sólo elemento (sin importar la posición) y no se proveyó un <code>valorInicial</code>, o si se proveyó un <code>valorInicial</code> pero el arreglo está vacío, se retornará ese único valor sin llamar a la <code>función</code>.</p>
+
+<p>Suponga que ocurre el siguiente uso de <code>reduce</code>:</p>
+
+<pre class="brush: js">[0,1,2,3,4].reduce(function(valorAnterior, valorActual, indice, vector){
+  return valorAnterior + valorActual;
+});
+
+// Primera llamada
+valorAnterior = 0, valorActual = 1, indice = 1
+
+// Segunda llamada
+valorAnterior = 1, valorActual = 2, indice = 2
+
+// Tercera llamada
+valorAnterior = 3, valorActual = 3, indice = 3
+
+// Cuarta llamada
+valorAnterior = 6, valorActual = 4, indice = 4
+
+// el <code>array</code> sobre el que se llama a reduce siempre es el objeto [0,1,2,3,4]
+
+// Valor Devuelto: 10
+</pre>
+
+<p>Y si proporcionas un <code>valorInicial</code>, el resultado sería como este:</p>
+
+<pre class="brush: js">[0,1,2,3,4].reduce(function(valorAnterior, valorActual, indice, vector){
+  return valorAnterior + valorActual;
+}, 10);
+
+// Primera llamada
+valorAnterior = 10, valorActual = 0, indice = 0
+
+// Segunda llamada
+valorAnterior = 10, valorActual = 1, indice = 1
+
+// Tercera llamada
+valorAnterior = 11, valorActual = 2, indice = 2
+
+// Cuarta llamada
+valorAnterior = 13, valorActual = 3, indice = 3
+
+// Quinta llamada
+valorAnterior = 16, valorActual = 4, indice = 4
+
+// el <code>array</code> sobre el que se llama a reduce siempre es el objeto [0,1,2,3,4]
+
+// Valor Devuelto: 20
+</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<div class="note">
+<p><strong>Polyfill</strong> se refiere a unas líneas de código o un plugin que permite "tener"  (en realidad se simulan de alguna otra manera) las nuevas funcionalidades   de HTML5 en aquellos navegadores que nativamente no lo soportan. Consigue que, en adelante, el código sea transparente para el programador, como si el navegador soportase la funcionalidad nativamente.</p>
+</div>
+
+<p><code>reduce</code> es una extensión de JavaScript al estándar ECMA-262; como tal puede que no esté presente en otras implementaciones del estándar. Puedes trabajar con ésto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>reduce</code> en implementaciones de ECMA-262 que no lo implementan de modo nativo. Este algoritmo es exactamente el mismo usando en Firefox y SpiderMonkey.</p>
+
+<pre class="brush: js">if (!Array.prototype.reduce)
+{
+  Array.prototype.reduce = function(fun /*, inicial*/)
+  {
+    var longitud = this.length;
+    if (typeof fun != "function")
+      throw new TypeError();
+
+    // no se devuelve ningún valor si no hay valor inicial y el array está vacío
+    if (longitud == 0 &amp;&amp; arguments.length == 1)
+      throw new TypeError();
+
+    var indice = 0;
+    if (arguments.length &gt;= 2)
+    {
+      var rv = arguments[1];
+    }
+    else
+    {
+      do
+      {
+        if (indice in this)
+        {
+          rv = this[indice++];
+          break;
+        }
+
+        // si el array no contiene valores, no existe valor inicial a devolver
+        if (++indice &gt;= longitud)
+          throw new TypeError();
+      }
+      while (true);
+    }
+
+    for (; indice &lt; longitud; indice++)
+    {
+      if (indice in this)
+        rv = fun.call(null, rv, this[indice], indice, this);
+    }
+
+    return rv;
+  };
+}
+</pre>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Resumir_todos_los_valores_de_un_array" name="Ejemplo:_Resumir_todos_los_valores_de_un_array">Ejemplo: Sumar todos los valores de un <code>array</code></h3>
+
+<pre class="brush: js">var total = [0, 1, 2, 3].reduce(function(a, b){ return a + b; });
+// total == 6
+</pre>
+
+<h3 id="Ejemplo_Integrar_un_array_a_partir_de_varios_arrays" name="Ejemplo:_Integrar_un_array_a_partir_de_varios_arrays">Ejemplo: Integrar un <code>array</code> a partir de varios <code>arrays</code></h3>
+
+<pre class="brush: js">var integrado = [[0,1], [2,3], [4,5]].reduce(function(a,b) {
+  return a.concat(b);
+});
+// integrado es [0, 1, 2, 3, 4, 5]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.reduce', 'Array.prototype.reduce()')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.reduce")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.reduceRight()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/reduceright/index.html b/files/es/web/javascript/reference/global_objects/array/reduceright/index.html
new file mode 100644
index 0000000000..7cab4ba18d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/reduceright/index.html
@@ -0,0 +1,167 @@
+---
+title: Array.prototype.reduceRight()
+slug: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight
+tags:
+  - Array
+  - ECMAScript5
+  - JavaScript
+  - JavaScript 1.8
+  - Method
+  - Prototype
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight
+---
+<div>{{JSRef("Objetos_globales", "Array")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Aplica una función simultáneamente contra un acumulador y cada elemento de un array (de derecha a izquierda) para reducirlo a un único valor.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="eval"><i>array</i>.reduceRight(
+<i>funcion</i>[,
+<i>valorInicial</i>])
+</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función a ejecutar para cada valor del array.</dd>
+ <dt><code>initialValue</code></dt>
+ <dd>Objeto a usar como primer argumento en la primera llamada de la <code>funcion</code>.</dd>
+</dl>
+
+<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
+
+<p><code>reduceRight</code> ejecuta la <code>funcion</code> una vez para cada elemento presente en el array, excluyendo los huecos del mismo, recibiendo cuatro argumentos: el valor inicial (o valor de la llamada previa de <code>funcion</code>), el valor del elemento actual, el índice actual y el array sobre el que ocurre la iteración.</p>
+
+<p>La llamada a la <code>funcion</code> de reduceRight sería similar a esto:</p>
+
+<pre class="brush: js">.reduceRight(function(valorPrevio, valorActual, indice, array){
+  // ...
+})
+</pre>
+
+<p>La primera vez que se llama a la función, el <code>valorPrevio</code> y el <code>valorActual</code> puede ser uno de los dos valores. Si se incluye un <code>valorInicial</code> en la llamada a <code>reduceRight</code>, entonces el <code>valorPrevio</code> será igual al <code>valorInicial</code> y el <code>valorActual</code> será igual al último valor del array. Si no se incluye ningún <code>valorInicial</code>, entonces el <code>valorPrevio</code> será igual al último valor del array y el <code>valorActual</code> será igual al penúltimo valor.</p>
+
+<p>Algún ejemplo de la ejecución de la función paso a paso sería similar a esto:</p>
+
+<pre class="brush: js">[0,1,2,3,4].reduceRight(function(valorPrevio, valorActual, indice, array){
+  return valorPrevio + valorActual;
+});
+
+// First call
+valorPrevio = 4, valorActual = 3, indice = 3
+
+// Second call
+valorPrevio = 7, valorActual = 2, indice = 2
+
+// Third call
+valorPrevio = 9, valorActual = 1, indice = 1
+
+// Fourth call
+valorPrevio = 10, valorActual = 0, indice = 0
+
+// el array sobre el que se llama a reduceRight siempre es el objeto [0,1,2,3,4]
+
+// Valor Devuelto: 10
+</pre>
+
+<p>Y si proporcionas un <code>valorInicial</code>, el resultado sería como este:</p>
+
+<pre class="brush: js">[0,1,2,3,4].reduceRight(function(valorPrevio, valorActual, indice, array){
+  return valorPrevio + currentValue;
+}, 10);
+
+// Primera llamada
+valorPrevio = 10, valorActual = 4, indice = 4
+
+// Segunda llamada
+valorPrevio = 14, valorActual = 3, indice = 3
+
+// Tercera llamada
+valorPrevio = 17, valorActual = 2, indice = 2
+
+// Cuarta llamada
+valorPrevio = 19, valorActual = 1, indice = 1
+
+// Quinta llamada
+valorPrevio = 20, valorActual = 0, indice = 0
+
+// el array sobre el que se llama a reduce siempre es el objeto [0,1,2,3,4]
+
+// Valor Devuelto: 20
+</pre>
+
+<h2 id="Compatibilidad" name="Compatibilidad">Compatibilidad</h2>
+
+<p><code>reduceRight</code> es una extensión de JavaScript al estándar ECMA-262; como tal puede que no esté presente en otras implementaciones del estándar. Puedes trabajar con ésto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>reduceRight</code> en implementaciones de ECMA-262 que no lo implementan de modo nativo. Este algoritmo es exactamente el mismo usando en Firefox y SpiderMonkey.</p>
+
+<pre class="brush: js">if (!Array.prototype.reduceRight)
+{
+  Array.prototype.reduceRight = function(fun /*, inicial*/)
+  {
+    var longitud = this.length;
+    if (typeof fun != "function")
+      throw new TypeError();
+
+    // no se devuelve ningún valor si no hay valor inicial y el array está vacío
+    if (longitud == 0 &amp;&amp; arguments.length == 1)
+      throw new TypeError();
+
+    var indice = longitud - 1;
+    if (arguments.length &gt;= 2)
+    {
+      var rv = arguments[1];
+    }
+    else
+    {
+      do
+      {
+        if (indice in this)
+        {
+          rv = this[indice--];
+          break;
+        }
+
+        // si el array no contiene valores, no existe valor incial a devolver
+        if (--indice &lt; 0)
+          throw new TypeError();
+      }
+      while (true);
+    }
+
+    for (; indice &gt;= 0; indice--)
+    {
+      if (indice in this)
+        rv = fun.call(null, rv, this[indice], indice, this);
+    }
+
+    return rv;
+  };
+}
+</pre>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplos:_Resumir_todos_los_valores_de_un_array" name="Ejemplos:_Resumir_todos_los_valores_de_un_array">Ejemplos: Resumir todos los valores de un array</h3>
+
+<pre class="brush: js">var total = [0, 1, 2, 3].reduceRight(function(a, b) { return a + b; });
+// total == 6
+</pre>
+
+<h3 id="Ejemplo:_Integrar_un_array_a_partir_de_varios_arrays" name="Ejemplo:_Integrar_un_array_a_partir_de_varios_arrays">Ejemplo: Integrar un array a partir de varios arrays</h3>
+
+<pre class="brush: js">var integrado = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
+  return a.concat(b);
+}, []);
+// integrado es [4, 5, 2, 3, 0, 1]
+</pre>
+
+<h2 id="V.C3.A9ase_tambi.C3.A9n" name="V.C3.A9ase_tambi.C3.A9n">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.reduce()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/reverse/index.html b/files/es/web/javascript/reference/global_objects/array/reverse/index.html
new file mode 100644
index 0000000000..452f0603ce
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/reverse/index.html
@@ -0,0 +1,89 @@
+---
+title: Array.prototype.reverse()
+slug: Web/JavaScript/Reference/Global_Objects/Array/reverse
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/reverse
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/reverse
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>reverse()</strong></code> invierte el orden de los elementos de un array <em><a href="https://en.wikipedia.org/wiki/In-place_algorithm">in place</a></em>. El primer elemento pasa a ser el último y el último pasa a ser el primero.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-reverse.html")}}</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>a</var>.reverse()</pre>
+
+<h3 id="Valor devuelto" name="Valor devuelto">Valor devuelto</h3>
+
+<p>El array invertido.</p>
+
+<h2 id="Descripción" name="Descripción">Descripción</h2>
+
+<p>El método <code>reverse</code> cruza los elementos del objeto matriz invocados en su lugar, mutando la matriz, y retornando una referencia a la misma.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:Colocar al revés los elementos de un array" name="Ejemplo:Colocar al revés los elementos de un array">Colocar al revés los elementos de un array</h3>
+
+<p>El siguiente ejemplo crea un array <code>a</code> que contiene tres elementos y luego lo invierte.<br>
+ La llamada a <code>reverse()</code> devuelve una referencia al array <code>a</code> invertido.</p>
+
+<pre class="brush: js">const a = [1, 2, 3];
+
+console.log(a); // [1, 2, 3]
+
+a.reverse();
+
+console.log(a); // [3, 2, 1]
+
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.8', 'Array.prototype.reverse')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad en navegadores" name="Compatibilidad en navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Array.reverse")}}</p>
+
+<h2 id="Ver también" name="Ver también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.join()")}}</li>
+ <li>{{jsxref("Array.prototype.sort()")}}</li>
+ <li>{{jsxref("TypedArray.prototype.reverse()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/shift/index.html b/files/es/web/javascript/reference/global_objects/array/shift/index.html
new file mode 100644
index 0000000000..81d884dbb8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/shift/index.html
@@ -0,0 +1,125 @@
+---
+title: Array.prototype.shift()
+slug: Web/JavaScript/Reference/Global_Objects/Array/shift
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/shift
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/shift
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>shift()</strong></code> elimina el <strong>primer</strong> elemento del array y lo retorna. Este método modifica la longitud del array.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>arr</var>.shift()</code></pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>shift</code> elimina el elemento en el índice cero y desplaza los valores consecutivos hacia abajo, devolviendo el valor eliminado. Si la propiedad {{jsxref("Array.length", "length")}} es 0, devuelve {{jsxref("undefined")}}.</p>
+
+<p><code>shift</code> es genérico; este método puede utilizarse con {{jsxref("Function.call", "call", "", 1)}} o {{jsxref("Function.apply", "apply", "", 1)}} a objetos simliares a arrays. Los objetos que no tengan una propiedad <code>length</code> que refleje el último elemento de una serie consecutiva de propiedades numéricas con índice base cero pueden no comportarse de manera significativa.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Eliminando_un_elemento_de_un_array">Eliminando un elemento de un array</h3>
+
+<p>El siguiente código muestra el contenido del array <code>miPescado</code> antes y después de eliminar el primer elemento. También muestra el elemento eliminado:</p>
+
+<pre class="brush: js notranslate">var miPescado = ['ángel', 'payaso', 'mandarín', 'cirujano'];
+
+console.log('miPescado antes: ' + miPescado);
+// "miPescado antes: ángel,payaso,mandarín,cirujano"
+
+var eliminado = miPescado.shift();
+
+console.log('miPescado después: ' + miPescado);
+// "miPescado after: payaso,mandarín,cirujano"
+
+console.log('Elemento eliminado: ' + eliminado);
+// "Elemento eliminado: ángel"</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en Javascript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.9', 'Array.prototype.shift')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.shift', 'Array.prototype.shift')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("1.0")}}</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>{{CompatIE("5.5")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.push()")}}</li>
+ <li>{{jsxref("Array.prototype.pop()")}}</li>
+ <li>{{jsxref("Array.prototype.unshift()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/slice/index.html b/files/es/web/javascript/reference/global_objects/array/slice/index.html
new file mode 100644
index 0000000000..e22b913c37
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/slice/index.html
@@ -0,0 +1,288 @@
+---
+title: Array.prototype.slice()
+slug: Web/JavaScript/Reference/Global_Objects/Array/slice
+tags:
+  - Arreglo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/slice
+---
+<div>{{JSRef}}</div>
+
+<p><code><font face="Open Sans, Arial, sans-serif">El método </font><strong>slice()</strong></code> devuelve una copia de una parte del array dentro de un nuevo array empezando por <em>inicio </em>hasta <em>fin</em> (<em>fin </em>no incluido). El array original no se modificará.</p>
+
+<p>El código fuente de esta demostración interactiva está alojado en un repositorio Github. Si desea contribuir con ella, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíenos un <em>"pull request"</em>.</p>
+
+<h2 id="Sintaxis">Sintaxis </h2>
+
+<pre class="syntaxbox"><code><var>arr</var>.slice([<var>inicio </var>[, <var>fin</var>]])</code></pre>
+
+<h2 id="Parámetros">Parámetros</h2>
+
+<dl>
+ <dt><code>inicio</code></dt>
+ <dd>Índice donde empieza la extracción. El primer elemento corresponde con el índice  0.</dd>
+ <dd>Si el índice especificado es negativo, indica un desplazamiento desde el final del array.<code> slice(-2)</code>extrae los dos últimos elementos del array</dd>
+ <dd>Si <code>inicio</code> es omitido el valor por defecto es <code>0</code>.</dd>
+ <dd>Si <code>inicio</code> es mayor a la longitud del array, se devuelve un array vacío.</dd>
+ <dt><code>fin</code></dt>
+ <dd>Índice  que marca el final de la extracción. <code>slice</code> extrae hasta, pero sin incluir el final.</dd>
+ <dd><code>slice(1,4)</code> extrae desde el segundo elemento hasta el cuarto  (los elementos con índices 1, 2,  y 3).</dd>
+ <dd>Con un índice negativo, <code>fin</code> indica un desplazamiento desde el final de la secuencia. <code>slice(2,-1)</code> extrae desde el tercer hasta el penúltimo elemento en la secuencia.</dd>
+ <dd>Si <code>fin</code> es omitido, slice extrae hasta el final de la secuencia (<code>arr.length</code>)<code>.</code></dd>
+ <dd>Si <code>fin</code> es mayor a la longitud del array, <code>slice</code> extrae hasta el final de la secuencia (<code>arr.length</code>)<code>.</code></dd>
+</dl>
+
+<h3 id="Valor_de_retorno"><code>Valor de retorno</code></h3>
+
+<p>Un nuevo array con los valores extraídos.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>slice</code> <strong>no modifica</strong> el array original. Devuelve una copia plana (<em>shallow copy</em>) de los elementos especificados del array original. Los elementos del array original son copiados en el array devuelto de la siguiente manera:</p>
+
+<ul>
+ <li>Para referencias de objeto ( <strong>no</strong> el objeto en sí ), <code>slice copia la referencia dentro del nuevo array</code>. Ambos, el array original y el nuevo, referencian al mismo objeto. Si un objeto referenciado cambia, los cambios son visibles para ambos arrays.</li>
+ <li>Para strings, numbers y boolean (<strong>no</strong> objetos {{jsxref("Global_Objects/String", "String")}} y {{jsxref("Global_Objects/Number", "Number")}}), <code>slice</code> copia los valores en el nuevo array. Los cambios a los string, numbers y boolean en un array no afectan a los del otro array.</li>
+</ul>
+
+<p>Si un nuevo elemento es agregado a cualquiera de los arrays, el otro array no es afectado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Devolver_una_porción_de_un_array_existente">Ejemplo: Devolver una porción de un array existente</h3>
+
+<pre class="brush: js">var nombres = ['Rita', 'Pedro', 'Miguel', 'Ana', 'Vanesa'];
+var masculinos = nombres.slice(1, 3);
+
+// masculinos contiene ['Pedro','Miguel']
+</pre>
+
+<h3 id="Ejemplo_Utilizando_slice">Ejemplo: Utilizando slice</h3>
+
+<p><span style="font-size: 14px; line-height: 1.5;">Presta especial atención a:</span></p>
+
+<ul>
+ <li>Valores de tipos básicos, como string o number, son copiados al nuevo array. Cambiar estos valores en la copia no afecta al array original.</li>
+ <li>Las referencias también se copian. Mismas referencias acceden al mismo objeto destino. Cambios en el objeto destino son compartidos por todos sus accesos.</li>
+</ul>
+
+<p>En el siguiente ejemplo, <code>slice</code> crea un nuevo array, <code>nuevoCoche</code>, de <code>myCoche</code>. Los dos incluyen una referncia al objecto <code>miHonda</code> se cambia a púrpura, ambas matrices reflejan el cambio.</p>
+
+<pre class="brush: js"><code>var miHonda = { color: 'red', ruedas: 4, motor: { cilindros: 4, cantidad: 2.2 } };
+var miCoche = [miHonda, 2, 'Buen estado', 'comprado 1997'];
+var nuevoCoche = miCoche.slice(0, 2);</code>
+
+//  Muestra los valores de myCar, newCar y el color de myHonda.<code>
+console.log('miCoche = ' + JSON.stringify(miCoche));
+console.log('nuevoCoche = ' + JSON.stringify(nuevoCoche));
+console.log('miCoche[0].color = ' + miCoche[0].color);
+console.log('nuevoCoche[0].color = ' + nuevoCoche[0].color);</code>
+
+// Cambia el color de miHonda.
+miHonda.color = 'azul';
+console.log('El nuevo color de mi Honda es ' + miHonda.color);
+
+// Muestra el color de myHonda referenciado desde ambos arrays. <code>
+console.log('miCoche[0].color = ' + miCoche[0].color);</code>
+
+console.log('nuevoCoche[0].color = ' + nuevoCoche[0].color);</pre>
+
+<p>Este script escribe:</p>
+
+<pre class="brush: js"><code>miCoche = [{color: 'rojo', ruedas: 4, motor: {cilindros: 4, cantidad: 2.2}}, 2,
+         'buen estado', 'comprado 1997']
+nuevoCoche = [{color: 'rojo', ruedas: 4, motor: {cilindros: 4, cantidad: 2.2}}, 2]
+miCoche[0].color = rojo
+nuevoCoche[0].color = rojo
+El nuevo color de miHonda es azul
+miCoche[0].color = azul
+nuevoCoche[0].color = azul</code></pre>
+
+<h2 id="Objetos_array-like">Objetos array-like</h2>
+
+<div class="note">
+<p>Se dice que un objeto es <strong>array-like</strong> ( similar o que se asemeja a un array) cuando entre sus propiedades existen algunas cuyos nombres son <strong>números</strong> y en particular tiene una propiedad llamada <strong>length</strong>. Este hecho  hace  suponer que el objeto es algún tipo de colección de elementos indexados por números. Es conveniente, a veces, convertir estos objetos a arrays para otorgarles la funcionalidad que de serie se incorpora en todos los arrays a través de su prototipo. </p>
+</div>
+
+<p>El método <code>slice</code> puede ser usado para convertir objetos parecidos a arrays o colecciones a un nuevo Array. Simplemente debe enlazar el método al objeto. El  {{jsxref("Functions_and_function_scope/arguments", "arguments")}} dentro de una función es un ejemplo de un objeto parecido a arrays.</p>
+
+<pre class="brush: js">function list() {
+  return Array.prototype.slice.call(arguments, 0);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+</pre>
+
+<p>El enlazado puede realizarse con la función <code>.call</code> de  {{jsxref("Function.prototype")}} y puede ser abreviado también usando  <code>[].slice.call(arguments)</code> en lugar de <code>Array.prototype.slice.call</code>. En cualquier caso, puede ser simplificado usando {{jsxref("Function.prototype.bind", "bind")}}.</p>
+
+<pre class="brush: js">var unboundSlice = Array.prototype.slice;
+var slice = Function.prototype.call.bind(unboundSlice);
+
+function list() {
+  return slice(arguments, 0);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+</pre>
+
+<h2 id="Coordinación_del_comportamiento_entre_navegadores">Coordinación del comportamiento entre navegadores</h2>
+
+<p> </p>
+
+<p>La especificación permite a los objetos del host  ( entre ellos los objetos del DOM )  ser dependientes de la implementación.  Esta <strong>NO</strong> obligatoriedad, origina diferencias en el comportamiento entre aquellos comprometidos con los estándares, como Mozilla, y los que no. En lo que concierne a  <code>Array.prototype.slice</code> , por lo tanto, existen importantes incompatibilidades en IE &lt; 9 . Versiones de IE a partir de la 9 permiten un comportamiento compatible más fiable.  Se puede recurrir al  “<em>shimming</em>”  para alcanzar la compatibilidad en otros casos.  Mientras otros navegadores modernos continúan mejorando para soportar esta habilidad, en la forma en que actualmente lo hacen Mozilla, Chrome, Safari, Opera  e IE, los desarrolladores de código preocupados por el soporte DOM que confíen en este <em>shim</em> no deben dejarse engañar por la semántica, deben confiar de forma segura en ella para proporcionar el comportamiento estándar que aparentemente ahora es la norma.</p>
+
+<p>El <em>shim</em> también soluciona que IE pueda tratar con el caso de que el segundo argumento de <code>slice()</code> pueda ser un valor {{jsxref("Global_Objects/null", "null")}}/{{jsxref("Global_Objects/undefined", "undefined")}} explícito. Esto era un problema en versiones anteriores de IE, pero todos los navegadores modernos, incluído IE &gt;= 9, lo hacen actualmente.</p>
+
+<pre class="brush: js">/**
+ * <em>Shim</em> para "solucionar" la falta de soporte de IE (IE &lt; 9) para aplicar slice
+ * sobre objetos del host, tal como NamedNodeMap, NodeList, y HTMLCollection
+ * (técnicamente, al ser los objetos del host dependientes de la implementación,
+ * al menos anteriormente a ES2015, IE no tenía la necesidad de trabajar de este modo).
+ * También funciona sobre strings, solucionando que IE &lt; 9 admita un undefined explícito
+ * como segundo argumento (igual que en Firefox), y previniendo errores cuando se llama
+ * sobre otros objetos del DOM.
+ */
+(function () {
+  'use strict';
+  var _slice = Array.prototype.slice;
+
+  try {
+    // Fallará al usarse con elementos DOM en IE &lt; 9
+    _slice.call(document.documentElement);
+  } catch (e) { // Fails in IE &lt; 9
+    // Funcionará con arrays genuinos, objetos array-like,
+    // NamedNodeMap (attributes, entities, notations),
+    // NodeList (e.g., getElementsByTagName), HTMLCollection (e.g., childNodes),
+    // and will not fail on other DOM objects (as do DOM elements in IE &lt; 9)
+    Array.prototype.slice = function(begin, end) {
+      // A IE &lt; 9 no le gustan los undefined como argumento end.
+      end = (typeof end !== 'undefined') ? end : this.length;
+
+      // Con objetos Array nativos, podemos usar la función slice
+      if (Object.prototype.toString.call(this) === '[object Array]'){
+        return _slice.call(this, begin, end);
+      }
+
+      // Con objetos array-like debemos manejarlo por nuestra cuenta.
+      var i, cloned = [],
+        size, len = this.length;
+
+      // Maneja valores negativos para el argumento "inicio"
+      var start = begin || 0;
+      start = (start &gt;= 0) ? start : Math.max(0, len + start);
+
+      // Maneja valores negativos para el argumento "fin"
+      var upTo = (typeof end == 'number') ? Math.min(end, len) : len;
+      if (end &lt; 0) {
+        upTo = len + end;
+      }
+
+      // Tamaño esperado para el slice
+      size = upTo - start;
+
+      if (size &gt; 0) {
+        cloned = new Array(size);
+        if (this.charAt) {
+          for (i = 0; i &lt; size; i++) {
+            cloned[i] = this.charAt(start + i);
+          }
+        } else {
+          for (i = 0; i &lt; size; i++) {
+            cloned[i] = this[start + i];
+          }
+        }
+      }
+
+      return cloned;
+    };
+  }
+}());
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 3ª edición</td>
+   <td>Estandar</td>
+   <td>Definición inicial Implementado en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.10', 'Array.prototype.slice')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-array.prototype.slice', 'Array.prototype.slice')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>La tabla de compatibilidad en esta página esta generada desde datos estructurados. Si desea contribuir con los datos, por favor <em>"checkout" </em><a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data </a> y envíenos un <em>"pull request"</em>.</p>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("1.0")}}</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también </h2>
+
+<ul>
+ <li>{{jsxref("Function.prototype.call()")}}</li>
+ <li>{{jsxref("Function.prototype.bind()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/some/index.html b/files/es/web/javascript/reference/global_objects/array/some/index.html
new file mode 100644
index 0000000000..36eac4f173
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/some/index.html
@@ -0,0 +1,205 @@
+---
+title: Array.prototype.some()
+slug: Web/JavaScript/Reference/Global_Objects/Array/some
+tags:
+  - Array
+  - ECMAScript5
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/some
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/some
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>some()</strong></code> comprueba si al menos un elemento del array cumple con la condición implementada por la función proporcionada.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Este método devuelve <code>false</code> para cualquier condición puesta en un array vacío.</p>
+</div>
+
+<div>{{EmbedInteractiveExample("pages/js/array-some.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.some(<var>callback(element[, index[, array]])</var>[, <var>thisArg</var>])</pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función que verifica cada elemento, toma tres argumentos:
+ <dl>
+  <dt><code>element</code></dt>
+  <dd>El elemento actual siendo procesado en el array.</dd>
+  <dt><code>index</code> {{Optional_inline}}</dt>
+  <dd>El índice del elemento del array que se está procesando.</dd>
+  <dt><code>array</code> {{Optional_inline}}</dt>
+  <dd>El array sobre el que ha sido llamada la función <code>some()</code>.</dd>
+ </dl>
+ </dd>
+ <dt><code>thisArg</code> {{Optional_inline}}</dt>
+ <dd>Valor a usar como <code>this</code> cuando se ejecute <code>callback</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p><code><strong>true</strong></code> si la función <code>callback</code> devuelve un valor {{Glossary("truthy")}} para cualquier elemento del array; en caso contrario, <code><strong>false</strong></code>.</p>
+
+<h2 id="Descripción" name="Descripción">Descripción</h2>
+
+<p><code>some()</code> ejecuta la función <code>callback</code> una vez por cada elemento presente en el array hasta que encuentre uno donde <code>callback</code> retorna un valor verdadero (true). Si se encuentra dicho elemento, <code>some()</code> retorna <code>true</code> inmediatamente. Si no, <code>some()</code> retorna <code>false</code>. <code>callback</code> es invocada sólo para los índices del array que tienen valores asignados; no es invocada para índices que han sido borrados o a los que nunca se les han asignado valores.</p>
+
+<p><code>callback</code> es invocada con tres argumentos: el valor del elemento, el índice del elemento, y el objeto array sobre el que se itera.</p>
+
+<p>Si se indica un parámetro <code>thisArg</code> a <code>some()</code>, se pasará a <code>callback</code> cuando es invocada, para usar como valor <code>this</code>. Si no, el valor {{jsxref("undefined")}} será pasado para usar como valor <code>this</code>. El valor <code>this</code> value observable por <code>callback</code> se determina de acuerdo a <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">las reglas habituales para determinar el <code>this</code> visible por una función</a>.</p>
+
+<p><code>some()</code> no modifica el array con el cual fue llamada.</p>
+
+<p>El rango de elementos procesados por <code>some()</code> es configurado antes de la primera invocación de <code>callback</code>. Los elementos anexados al array luego de que comience la llamada a <code>some()</code> no serán visitados por <code>callback</code>. Si un elemento existente y no visitado del array es alterado por <code>callback</code>, su valor pasado al <code>callback</code> será el valor al momento que <code>some()</code> visita el índice del elemento; los elementos borrados no son visitados.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Testing_size_of_all_array_elements" name="Example:_Testing_size_of_all_array_elements">Verificando el valor de los elementos de un array</h3>
+
+<p>El siguiente ejemplo verifica si algún elemento del array es mayor a 10.</p>
+
+<pre class="brush: js">function isBiggerThan10(element, index, array) {
+  return element &gt; 10;
+}
+[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
+[12, 5, 8, 1, 4].some(isBiggerThan10); // true
+</pre>
+
+<h3 id="Example:_Testing_array_elements_using_arrow_functions" name="Example:_Testing_array_elements_using_arrow_functions">Verificando los elementos de un array usando funciones flecha</h3>
+
+<p><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Las funciones flecha (Arrow functions)</a> brindan una sintáxis más corta para el mismo test.</p>
+
+<pre class="brush: js">[2, 5, 8, 1, 4].some(elem =&gt; elem &gt; 10);  // false
+[12, 5, 8, 1, 4].some(elem =&gt; elem &gt; 10); // true
+</pre>
+
+<h3 id="Comprobando_si_un_elemento_existe_en_un_array">Comprobando si un elemento existe en un array</h3>
+
+<p>Para imitar la función del método <code>includes()</code>, esta función personalizada devuelve <code>true</code> si el elemento existe en el array:</p>
+
+<pre class="brush: js">var fruits = ['apple', 'banana', 'mango', 'guava'];
+
+function checkAvailability(arr, val) {
+  return arr.some(function(arrVal) {
+    return val === arrVal;
+  });
+}
+
+checkAvailability(fruits, 'kela');   // false
+checkAvailability(fruits, 'banana'); // true</pre>
+
+<h3 id="Comprobando_si_un_elemento_existe_en_un_array_con_funciones_flecha">Comprobando si un elemento existe en un array con funciones flecha</h3>
+
+<pre class="brush: js">var fruits = ['apple', 'banana', 'mango', 'guava'];
+
+function checkAvailability(arr, val) {
+  return arr.some(arrVal =&gt; val === arrVal);
+}
+
+checkAvailability(fruits, 'kela');   // false
+checkAvailability(fruits, 'banana'); // true</pre>
+
+<h3 id="Convirtiendo_cualquier_valor_a_Boolean">Convirtiendo cualquier valor a Boolean</h3>
+
+<pre class="brush: js">var TRUTHY_VALUES = [true, 'true', 1];
+
+function getBoolean(value) {
+  'use strict';
+
+  if (typeof value === 'string') {
+    value = value.toLowerCase().trim();
+  }
+
+  return TRUTHY_VALUES.some(function(t) {
+    return t === value;
+  });
+}
+
+getBoolean(false);   // false
+getBoolean('false'); // false
+getBoolean(1);       // true
+getBoolean('true');  // true</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<p><code>some()</code> fue agregado al estándar ECMA-262 en la 5ta edición; por ello, puede no estar presente en todas las implementaciones del estándar. Puedes trabajar sobre esto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>some()</code> en implementaciones que no tienen soporte nativo. Este algoritmo es exactamente el mismo especificado en ECMA-262, 5ta edición, asumiendo que {{jsxref("Global_Objects/Object", "Object")}} y {{jsxref("Global_Objects/TypeError", "TypeError")}} tienen sus valores originales y que <code>fun.call</code> evalúa el valor original de{{jsxref("Function.prototype.call()")}}.</p>
+
+<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 5, 15.4.4.17
+// Referencia: http://es5.github.io/#x15.4.4.17
+if (!Array.prototype.some) {
+  Array.prototype.some = function(fun/*, thisArg*/) {
+    'use strict';
+
+    if (this == null) {
+      throw new TypeError('Array.prototype.some called on null or undefined');
+    }
+
+    if (typeof fun !== 'function') {
+      throw new TypeError();
+    }
+
+    var t = Object(this);
+    var len = t.length &gt;&gt;&gt; 0;
+
+    var thisArg = arguments.length &gt;= 2 ? arguments[1] : void 0;
+    for (var i = 0; i &lt; len; i++) {
+      if (i in t &amp;&amp; fun.call(thisArg, t[i], i, t)) {
+        return true;
+      }
+    }
+
+    return false;
+  };
+}
+</pre>
+
+<h2 id="Especificaciones" name="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.17', 'Array.prototype.some')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.some', 'Array.prototype.some')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.some', 'Array.prototype.some')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores" name="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.some")}}</p>
+</div>
+
+<h2 id="Ver_también" name="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Array.prototype.every()")}}</li>
+ <li>{{jsxref("Array.prototype.find()")}}</li>
+ <li>{{jsxref("TypedArray.prototype.some()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/sort/index.html b/files/es/web/javascript/reference/global_objects/array/sort/index.html
new file mode 100644
index 0000000000..e6eea1fa9d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/sort/index.html
@@ -0,0 +1,302 @@
+---
+title: Array.prototype.sort()
+slug: Web/JavaScript/Reference/Global_Objects/Array/sort
+tags:
+  - Array
+  - JavaScript
+  - Método(2)
+  - Prototipo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/sort
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/sort
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>sort()</strong></code> ordena los elementos de un arreglo (array) <em>localmente</em> y devuelve el arreglo ordenado. La ordenación no es necesariamente <a href="https://en.wikipedia.org/wiki/Sorting_algorithm#Stability">estable</a>. El modo de ordenación por defecto responde a la posición del valor del string de acuerdo a su valor <a href="https://es.wikipedia.org/wiki/Unicode">Unicode</a>.</p>
+
+<p id="tw-target-text">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción (pull request).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>arr</var>.sort([<var>compareFunction</var>])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>compareFunction</code></dt>
+ <dd>Opcional. Especifica una función que define el modo de ordenamiento. Si se omite, el array es ordenado atendiendo a la posición del valor <a href="/en-US/docs/Web/JavaScript/Guide/Values,_variables,_and_literals#Unicode">Unicode</a> de cada caracter, según la conversión a string de cada elemento.</dd>
+ <dt><code>firstEl</code></dt>
+ <dd>El primer elemento a comparar.</dd>
+ <dt><code>secondEl</code></dt>
+ <dd>El segundo elemento a comparar.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El array ordenado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si no se provee <code>compareFunction</code>, los elementos son ordenados convirtiéndolos a strings y comparando la posición del valor Unicode de dichos strings. Por ejemplo, "Cherry" viene antes que "banana"  (porque las mayúsculas van antes que las minúsculas en la codificación Unicode) . En un ordenamiento numérico, 9 está antes que 80, pero dado que los números son convertidos a strings y ordenados según el valor Unicode, el resultado será "80" antes que "9".</p>
+
+<pre class="brush: js notranslate">var frutas = ['guindas', 'manzanas', 'bananas'];
+frutas.sort(); // ['bananas', 'guindas', 'manzanas']
+
+var puntos = [1, 10, 2, 21];
+puntos.sort(); // [1, 10, 2, 21]
+// Tenga en cuenta que 10 viene antes que 2
+// porque '10' viene antes que '2' según la posición del valor Unicode.
+
+var cosas = ['word', 'Word', '1 Word', '2 Words'];
+cosas.sort(); // ['1 Word', '2 Words', 'Word', 'word']
+// En Unicode, los números vienen antes que las letras mayúsculas
+// y estas vienen antes que las letras minúsculas.
+</pre>
+
+<p>Si se provee <code>compareFunction</code>, los elementos del array son ordenados de acuerdo al valor que retorna dicha función de comparación. Siendo <code>a</code> y <code>b</code> dos elementos comparados, entonces:</p>
+
+<ul>
+ <li>Si <code>compareFunction(a, b)</code> es menor que 0, se sitúa <code>a</code> en un indice menor que <code>b</code>. Es decir, <code>a</code> viene primero.</li>
+ <li>Si <code>compareFunction(a, b)</code> retorna 0, se deja <code>a</code> y <code>b</code> sin cambios entre ellos, pero ordenados con respecto a todos los elementos diferentes. Nota: el estandar ECMAscript no garantiza este comportamiento, por esto no todos los navegadores (p.ej.  Mozilla en versiones que datan hasta el 2003) respetan esto.</li>
+ <li>Si <code>compareFunction(a, b)</code> es mayor que 0, se sitúa <code>b</code> en un indice menor que <code>a</code>.</li>
+ <li><code>compareFunction(a, b)</code> siempre debe retornar el mismo valor dado un par especifico de elementos a y b como sus argumentos. Si se retornan resultados inconsistentes entonces el orden de ordenamiento es indefinido.</li>
+</ul>
+
+<p>Entonces, la función de comparación tiene la siguiente forma:</p>
+
+<pre class="brush: js notranslate">function compare(a, b) {
+  if (a es menor que b según criterio de ordenamiento) {
+    return -1;
+  }
+  if (a es mayor que b según criterio de ordenamiento) {
+    return 1;
+  }
+  // a debe ser igual b
+  return 0;
+}
+</pre>
+
+<p>Para comparar números en lugar de strings, la función de comparación puede simplemente restar <code>b</code> de <code>a</code>. La siguiente función ordena el array de modo ascendente:</p>
+
+<pre class="brush: js notranslate">function compareNumbers(a, b) {
+  return a - b;
+}
+</pre>
+
+<p>El metodo <code>sort</code> puede ser usado convenientemente con {{jsxref("Operators/function", "function expressions", "", 1)}} (y <a href="/en-US/docs/Web/JavaScript/Guide/Closures">closures</a>):</p>
+
+<pre class="brush: js notranslate">var numbers = [4, 2, 5, 1, 3];
+numbers.sort(function(a, b) {
+  return a - b;
+});
+console.log(numbers);
+
+</pre>
+
+<pre class="notranslate"><code>// [1, 2, 3, 4, 5]</code></pre>
+
+<p>Los objectos pueden ser ordenados por el valor de una de sus propiedades.</p>
+
+<pre class="brush: js notranslate">var items = [
+  { name: 'Edward', value: 21 },
+  { name: 'Sharpe', value: 37 },
+  { name: 'And', value: 45 },
+  { name: 'The', value: -12 },
+  { name: 'Magnetic', value: 13 },
+  { name: 'Zeros', value: 37 }
+];
+items.sort(function (a, b) {
+  if (a.name &gt; b.name) {
+    return 1;
+  }
+  if (a.name &lt; b.name) {
+    return -1;
+  }
+  // a must be equal to b
+  return 0;
+});
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Creating.2C_displaying.2C_and_sorting_an_array" name="Creating.2C_displaying.2C_and_sorting_an_array">Ordenando un array</h3>
+
+<p>Un array de elementos string, sin especificar una función de comparación:</p>
+
+<pre class="brush: js notranslate">var arr = [ 'a', 'b', 'Z', 'Aa', 'AA' ];
+arr.sort();  //[ 'AA', 'Aa', 'Z', 'a', 'b' ]
+</pre>
+
+<p>Un array de elementos numéricos,  sin función de comparación:</p>
+
+<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
+arr.sort();  //[ 1, 200, 40, 5 ]
+</pre>
+
+<p>Un array de elementos numéricos, usando una función de comparación:</p>
+
+<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
+function comparar ( a, b ){ return a - b; }
+arr.sort( comparar );  // [ 1, 5, 40, 200 ]</pre>
+
+<p>Lo mismo pero usando una función anónima normal:</p>
+
+<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
+arr.sort(function(a,b){return a - b;});  // [ 1, 5, 40, 200 ]</pre>
+
+<p>Lo mismo escrito más compacto mediante una <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">función flecha</a>:</p>
+
+<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
+arr.sort((a,b)=&gt;a-b);  // [ 1, 5, 40, 200 ]</pre>
+
+<h3 id="Creating.2C_displaying.2C_and_sorting_an_array" name="Creating.2C_displaying.2C_and_sorting_an_array"></h3>
+
+<h3 id="Creating.2C_displaying.2C_and_sorting_an_array" name="Creating.2C_displaying.2C_and_sorting_an_array">Creando, mostrando, y ordenando un array</h3>
+
+<p>El siguiente ejemplo abunda en la idea de ordenar con y sin función de comparación. Además, ilustra una manera de mostrar un array una vez creado. El método <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/join">join</a> es usado para convertir el array en una cadena de texto que imprimir. Al no pasarle un argumento que indique el separador, usará la coma por defecto para separar los elementos del array dentro de la cadena.</p>
+
+<pre class="brush: js notranslate">var arr = ['80', '9', '700', 40, 1, 5, 200];
+function comparar(a, b) {
+  return a - b;
+}
+console.log('original:', arr.join());
+console.log('ordenado sin función:', arr.sort());
+console.log('ordenado con función:', arr.sort(comparar));
+</pre>
+
+<p>El ejemplo produce el siguiente resultado. Como muestra la salida, cuando una función de comparación es usada, los números se ordenan correctamente, sean estos valores numéricos o strings numéricos.</p>
+
+<pre class="notranslate">original: 80,9,700,40,1,5,200
+ordenado sin función: 1,200,40,5,700,80,9
+ordenado con función: 1,5,9,40,80,200,700
+</pre>
+
+<h3 id="Ordenando_caracteres_no_ASCII">Ordenando caracteres no ASCII</h3>
+
+<p>Para ordenar strings con characters no ASCII, i.e. strings con caracteres con acento (e, é, è, a, ä, etc.), strings de lenguajes diferentes al inglés: use {{jsxref("String.localeCompare")}}. Esta función puede comparar esos caracteres para que aparezcan en el orden correcto.</p>
+
+<pre class="brush: js notranslate">var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];
+items.sort(function (a, b) {
+  return a.localeCompare(b);
+});
+
+// items is ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']
+</pre>
+
+<h3 id="Ordenando_con_map">Ordenando con map</h3>
+
+<p>La <code>compareFunction</code> puede ser invocada múltiples veces por elemento dentro del array. Dependiendo de la naturaleza de <code>compareFunction</code>, este puede resultar en una alta penalización de rendimiento. Cuanto más trabajo hace una <code>compareFunction</code> y más elementos hay para ordenar, resulta más recomendable usar una función <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a> para ordenar. La idea es recorrer el array una sola vez para extraer los valores usados para ordenar en un array temporal, ordenar el array temporal y luego recorrer el array para lograr el orden correcto.</p>
+
+<pre class="brush: js notranslate">// el array a ordenar
+var list = ['Delta', 'alpha', 'CHARLIE', 'bravo'];
+
+// array temporal contiene objetos con posición y valor de ordenamiento
+var mapped = list.map(function(el, i) {
+  return { index: i, value: el.toLowerCase() };
+})
+
+// ordenando el array mapeado que contiene los valores reducidos
+mapped.sort(function(a, b) {
+  if (a.value &gt; b.value) {
+    return 1;
+  }
+  if (a.value &lt; b.value) {
+    return -1;
+  }
+  return 0;
+});
+
+// contenedor para el orden resultante
+var result = mapped.map(function(el){
+  return list[el.index];
+});
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition</td>
+   <td>Standard</td>
+   <td>Definicióñ inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.11', 'Array.prototype.sort')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.sort', 'Array.prototype.sort')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome("1.0")}}</td>
+   <td>{{CompatGeckoDesktop("1.7")}}</td>
+   <td>{{CompatIE("5.5")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Compatibilidad_en_navegadores_2">Compatibilidad en navegadores</h2>
+
+<p>La tabla de compatibilidad en esta página es generada por una data estructurada. Si deseas contribuir a la data, por favor entra a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.reverse()")}}</li>
+ <li>{{jsxref("String.prototype.localeCompare()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/splice/index.html b/files/es/web/javascript/reference/global_objects/array/splice/index.html
new file mode 100644
index 0000000000..8c7d6167ec
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/splice/index.html
@@ -0,0 +1,149 @@
+---
+title: Array.prototype.splice()
+slug: Web/JavaScript/Reference/Global_Objects/Array/splice
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/splice
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/splice
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>splice()</strong></code> cambia el contenido de un array eliminando elementos existentes y/o agregando nuevos elementos.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-splice.html")}}</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>array</var>.splice(<var>start[</var>, <var>deleteCount[</var>, <var>item1[</var>, <var>item2[</var>, <em>...]]]]</em>)
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>start</code></dt>
+ <dd>Índice donde se comenzará a cambiar el array (con 0 como origen). Si es mayor que la longitud del array, el punto inicial será la longitud del array. Si es negativo, empezará esa cantidad de elementos contando desde el final.</dd>
+ <dt><code>deleteCount</code> {{optional_inline}}</dt>
+ <dd>Un entero indicando el número de elementos a eliminar del array antiguo.</dd>
+ <dd>Si <code>deleteCount</code> se omite, o si su valor es mayor que <code>arr.length - start</code> (esto significa, si es mayor que el número de elementos restantes del array, comenzando desde <code>start</code>), entonces todos los elementos desde <code>start</code> hasta el final del array serán eliminados.</dd>
+ <dd>Si <code>deleteCount</code> es igual a 0 o negativo, no se eliminará ningún elemento. En este caso, se debe especificar al menos un nuevo elemento (ver más abajo).</dd>
+ <dt><code>item1, item2, <em>...</em></code>  {{optional_inline}}</dt>
+ <dd>Los elementos que se agregarán al array, empezando en el índice <code>start</code>. Si no se especifica ningún elemento, <code>splice()</code> solamente eliminará elementos del array.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un array que contiene los elementos eliminados. Si sólo se ha eliminado un elemento, devuelve un array con un solo elemento. Si no se ha eliminado ningún elemento, devuelve un array vacío.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si especifica un número diferente de elementos a agregar que los que se eliminarán, el array tendrá un tamaño diferente al original una vez finalizada la llamada.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Eliminar_0_elementos_desde_el_índice_2_e_insertar_drum">Eliminar 0 elementos desde el índice 2 e insertar "drum"</h3>
+
+<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2, 0, 'drum');
+
+// myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"]
+// removed is [], no elements removed
+</pre>
+
+<h3 id="Eliminar_1_elemento_desde_el_índice_3">Eliminar 1 elemento desde el índice 3</h3>
+
+<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(3, 1);
+
+// removed is ["mandarin"]
+// myFish is ["angel", "clown", "drum", "sturgeon"]
+</pre>
+
+<h3 id="Eliminar_1_elemento_desde_el_índice_2_e_insertar_trumpet">Eliminar 1 elemento desde el índice 2 e insertar "trumpet"</h3>
+
+<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'sturgeon'];
+var removed = myFish.splice(2, 1, 'trumpet');
+
+// myFish is ["angel", "clown", "trumpet", "sturgeon"]
+// removed is ["drum"]</pre>
+
+<h3 id="Eliminar_2_elementos_desde_el_índice_0_e_insertar_parrot_anemone_y_blue">Eliminar 2 elementos desde el índice 0 e insertar "parrot", "anemone" y "blue"</h3>
+
+<pre class="brush: js">var myFish = ['angel', 'clown', 'trumpet', 'sturgeon'];
+var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');
+
+// myFish is ["parrot", "anemone", "blue", "trumpet", "sturgeon"]
+// removed is ["angel", "clown"]</pre>
+
+<h3 id="Eliminar_2_elementos_desde_el_índice_2">Eliminar 2 elementos desde el índice 2</h3>
+
+<pre class="brush: js">var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
+var removed = myFish.splice(myFish.length - 3, 2);
+
+// myFish is ["parrot", "anemone", "sturgeon"]
+// removed is ["blue", "trumpet"]</pre>
+
+<h3 id="Eliminar_1_elemento_desde_el_índice_-2">Eliminar 1 elemento desde el índice -2</h3>
+
+<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(-2, 1);
+
+// myFish is ["angel", "clown", "sturgeon"]
+// removed is ["mandarin"]</pre>
+
+<h3 id="Eliminar_todos_los_elementos_tras_el_índice_2_(incl.)">Eliminar todos los elementos tras el índice 2 (incl.)</h3>
+
+<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2);
+
+// myFish is ["angel", "clown"]
+// removed is ["mandarin", "sturgeon"]</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.12', 'Array.prototype.splice')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.splice")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.push()", "push()")}} / {{jsxref("Array.prototype.pop()", "pop()")}} — añade/elimina elementos desde el final de un array</li>
+ <li>{{jsxref("Array.prototype.unshift()", "unshift()")}} / {{jsxref("Array.prototype.shift()", "shift()")}} — añade/elimina elementos desde el principio de un array</li>
+ <li>{{jsxref("Array.prototype.concat()", "concat()")}} — devuelve un nuevo array compuesto por este array unido a otro/s array/s y/o valor/es</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/tolocalestring/index.html b/files/es/web/javascript/reference/global_objects/array/tolocalestring/index.html
new file mode 100644
index 0000000000..e5e37f77ac
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/tolocalestring/index.html
@@ -0,0 +1,178 @@
+---
+title: Array.prototype.toLocaleString()
+slug: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/toLocaleString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>toLocaleString()</strong></code> devuelve una cadena de texto representando los elementos del array. Los elementos son convertidos a texto usando su método <code>toLocaleString</code>  y dichos Strings son separados por un caracter específico para la localidad (como una coma para la separación de decimales “,”).</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-tolocalestring.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.toLocaleString([<var>locales[</var>, <var>options]]</var>);
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>locales</code> {{optional_inline}}</dt>
+ <dd>Una cadena de texto con una etiqueta de idioma BCP 47, o un array de dichos strings. Para la forma general e interpretación the los argumentos <code>locales</code>, ver la página {{jsxref("Intl")}}.</dd>
+ <dt><code>options</code> {{optional_inline}}</dt>
+ <dd>Un objeto con las configuraciones, para números ver {{jsxref("Number.prototype.toLocaleString()")}}, y para fechas ver {{jsxref("Date.prototype.toLocaleString()")}}.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una cadena de texto representando los elementos del array.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_locales_y_options">Usando <code>locales</code> y <code>options</code></h3>
+
+<p>Los elementos del array son convertidos a strings usando sus métodos <code>toLocaleString</code>.</p>
+
+<ul>
+ <li><code>Object</code>: {{jsxref("Object.prototype.toLocaleString()")}}</li>
+ <li><code>Number</code>: {{jsxref("Number.prototype.toLocaleString()")}}</li>
+ <li><code>Date</code>: {{jsxref("Date.prototype.toLocaleString()")}}</li>
+</ul>
+
+<p>Siempre mostrar la moneda para los strings y números en el array <code>precios</code>:</p>
+
+<pre class="brush: js">var precios = ['$7', 500, 8123, 12];
+precios.toLocaleString('es-AR', { style: 'currency', currency: 'ARS' });
+
+// "$7, $500, $8.123, $12"
+</pre>
+
+<p>Para más ejemplos, ver también {{jsxref("Intl")}}, {{jsxref("NumberFormat")}}, y {{jsxref("DateTimeFormat")}}.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">// https://tc39.github.io/ecma402/#sup-array.prototype.tolocalestring
+if (!Array.prototype.toLocaleString) {
+  Object.defineProperty(Array.prototype, 'toLocaleString', {
+    value: function(locales, options) {
+      // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var a = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(A, "length")).
+      var len = a.length &gt;&gt;&gt; 0;
+
+      // 3. Let separator be the String value for the
+      //    list-separator String appropriate for the
+      //    host environment's current locale (this is
+      //    derived in an implementation-defined way).
+      // NOTE: In this case, we will use a comma
+      var separator = ',';
+
+      // 4. If len is zero, return the empty String.
+      if (len === 0) {
+        return '';
+      }
+
+      // 5. Let firstElement be ? Get(A, "0").
+      var firstElement = a[0];
+      // 6. If firstElement is undefined or null, then
+      //  a.Let R be the empty String.
+      // 7. Else,
+      //  a. Let R be ?
+      //     ToString(?
+      //       Invoke(
+      //        firstElement,
+      //        "toLocaleString",
+      //        « locales, options »
+      //       )
+      //     )
+      var r = firstElement == null ?
+        '' : firstElement.toLocaleString(locales, options);
+
+      // 8. Let k be 1.
+      var k = 1;
+
+      // 9. Repeat, while k &lt; len
+      while (k &lt; len) {
+        // a. Let S be a String value produced by
+        //   concatenating R and separator.
+        var s = r + separator;
+
+        // b. Let nextElement be ? Get(A, ToString(k)).
+        var nextElement = a[k];
+
+        // c. If nextElement is undefined or null, then
+        //   i. Let R be the empty String.
+        // d. Else,
+        //   i. Let R be ?
+        //     ToString(?
+        //       Invoke(
+        //        nextElement,
+        //        "toLocaleString",
+        //        « locales, options »
+        //       )
+        //     )
+        r = nextElement == null ?
+          '' : nextElement.toLocaleString(locales, options);
+
+        // e. Let R be a String value produced by
+        //   concatenating S and R.
+        r = s + r;
+
+        // f. Increase k by 1.
+        k++;
+      }
+
+      // 10. Return R.
+      return r;
+    }
+  });
+}
+</pre>
+
+<p>Si necesitas soportar motores de JavaScript obsoletos que no compatibilizan con <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, es mejor no utilizar los métodos <code>Array.prototype</code>, ya que no se pueden hacer no-enumerables.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>La definicion original fue en ECMAScript 3.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sup-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td>Esta definición reemplaza la proporcionada en ECMA-262.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.toLocaleString")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.toString()")}}</li>
+ <li>{{jsxref("Intl")}}</li>
+ <li>{{jsxref("Object.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("Number.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/tosource/index.html b/files/es/web/javascript/reference/global_objects/array/tosource/index.html
new file mode 100644
index 0000000000..271fa89fcb
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/tosource/index.html
@@ -0,0 +1,113 @@
+---
+title: Array.prototype.toSource()
+slug: Web/JavaScript/Reference/Global_Objects/Array/toSource
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/toSource
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/toSource
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>El método <code><strong>toSource()</strong></code> devuelve un string representando el código fuente de un arreglo.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.toSource()</pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un string representando el código fuente del arreglo.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>toSource</code>r retorna los siguientes valores:</p>
+
+<ul>
+ <li>Para el objeto global {{jsxref("Array")}}, <code>toSource</code> devuelve el siguiente string indicando que el código fuente no está disponible:
+
+  <pre class="brush: js">function Array() {
+    [native code]
+}
+</pre>
+ </li>
+ <li>Para instancias de {{jsxref("Array")}}, <code>toSource</code> devuelve un string representando el código fuente.</li>
+</ul>
+
+<p>Este método suele ser llamado internamente por JavaScript y no explícitamente en código. Puede usar <code>toSource</code> mientras depura para examinar el contenido de un arreglo.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Examinar_el_código_fuente_de_un_arreglo">Examinar el código fuente de un arreglo</h3>
+
+<p>Para examinar el código fuente de un arreglo:</p>
+
+<pre class="brush: js">var alpha = new Array('a', 'b', 'c');
+
+alpha.toSource();
+//devuelve ['a', 'b', 'c']
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No hace parte de ningún estándar. Implementado en JavaScript 1.3.</p>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básicot</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toSource()")}}</li>
+ <li>{{jsxref("Array.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/tostring/index.html b/files/es/web/javascript/reference/global_objects/array/tostring/index.html
new file mode 100644
index 0000000000..954889d043
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/tostring/index.html
@@ -0,0 +1,79 @@
+---
+title: Array.prototype.toString()
+slug: Web/JavaScript/Reference/Global_Objects/Array/toString
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/toString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/toString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>toString()</strong></code> devuelve una cadena de caracteres representando el array especificado y sus elementos.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-tostring.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis </h2>
+
+<pre class="syntaxbox"><code><var>arr</var>.toString()</code></pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena de caracteres representando los elementos del array.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El objeto {{jsxref("Array")}} sustituye al método <code>toString</code> de {{jsxref("Object")}}. Para los objetos <code>Array</code>, el método <code>toString</code> une el array y devuelve una cadena de caracteres que contiene cada elemento del array separado por comas.</p>
+
+<p>JavaScript llama al método <code>toString</code> automáticamente cuando un array va a ser representado como un valor de texto o cuando se referencia a un array en una concatenación de caracteres.</p>
+
+<h3 id="Semántica_de_ECMAScript_5">Semántica de ECMAScript 5 </h3>
+
+<p>Desde JavaScript 1.8.5 (Firefox 4), y consistente con la 5ª edición de semántica de ECMAScript, el método <code>toString()</code> es genérico y puede ser usado con cualquier objeto. {{jsxref("Object.prototype.toString()")}} será llamado y devolverá el valor resultante.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.2', 'Array.prototype.toString')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Array.toString")}}</p>
+</div>&gt;
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.join()")}}</li>
+ <li>{{jsxref("Object.prototype.toSource()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/unshift/index.html b/files/es/web/javascript/reference/global_objects/array/unshift/index.html
new file mode 100644
index 0000000000..7a440415a0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/unshift/index.html
@@ -0,0 +1,101 @@
+---
+title: Array.prototype.unshift()
+slug: Web/JavaScript/Reference/Global_Objects/Array/unshift
+tags:
+  - Array
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/unshift
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/unshift
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>unshift()</strong></code> agrega uno o más elementos al inicio del array, y devuelve la nueva longitud del array.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/array-unshift.html")}}</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.unshift(<var>elemento1</var>[, ...[, <var>elementoN</var>]])</pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>elemento<em>N</em></code></dt>
+ <dd>Elementos a agregar al inicio del array.</dd>
+</dl>
+
+<h3 id="Returns" name="Returns">Devuelve</h3>
+
+<p>La nueva propiedad {{jsxref("Array.length", "length")}} del objeto sobre el cual el método fue llamado.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>El método <code>unshift</code> inserta los valores proporcionados al inicio de un objeto del tipo array.</p>
+
+<p><code>unshift</code> es intencionalmente genérico; este método puede ser {{jsxref("Function.call", "called", "", 1)}} o {{jsxref("Function.apply", "applied", "", 1)}} a objetos similares a arrays. Objetos que no contengan una propiedad <code>length</code> reflejando una serie de propiedades numéricas consecutivas, comenzada a partir del cero, pueden no comportarse de una manera comprensible.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<pre class="brush: js">var arr = [1, 2];
+
+arr.unshift(0); // resultado de la llamada es 3, la nueva longitud del array
+// arr es [0, 1, 2]
+
+arr.unshift(-2, -1); // = 5
+// arr es [-2, -1, 0, 1, 2]
+
+arr.unshift([-3]);
+// arr es [[-3], -2, -1, 0, 1, 2]
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.4.4.13', 'Array.prototype.unshift')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.unshift")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.push()")}}</li>
+ <li>{{jsxref("Array.prototype.pop()")}}</li>
+ <li>{{jsxref("Array.prototype.shift()")}}</li>
+ <li>{{jsxref("Array.prototype.concat()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/array/values/index.html b/files/es/web/javascript/reference/global_objects/array/values/index.html
new file mode 100644
index 0000000000..c3ea51be03
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/array/values/index.html
@@ -0,0 +1,83 @@
+---
+title: Array.prototype.values()
+slug: Web/JavaScript/Reference/Global_Objects/Array/values
+tags:
+  - Array
+  - ECMAScript 2015
+  - Iterador
+  - JavaScript
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Array/values
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Array/values
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>values()</code></strong> devuelve un nuevo objeto <strong><code>Array Iterator</code></strong> que contiene los valores para cada índice del array.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="punctuation token">[</span><span class="string token">'w'</span><span class="punctuation token">,</span> <span class="string token">'y'</span><span class="punctuation token">,</span> <span class="string token">'k'</span><span class="punctuation token">,</span> <span class="string token">'o'</span><span class="punctuation token">,</span> <span class="string token">'p'</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> iterator <span class="operator token">=</span> a<span class="punctuation token">.</span><span class="function token">values</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// w </span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// y </span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// k </span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// o </span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// p</span></code>
+</pre>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>.values()
+</pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un nuevo objeto {{jsxref("Array")}} iterator.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Iteración_usando_un_bucle_for...of">Iteración usando un bucle <code>for...of</code></h3>
+
+<pre class="brush: js">var arr = ['w', 'y', 'k', 'o', 'p'];
+var iterador = arr.values();
+
+for (let letra of iterador) {
+  console.log(letra);
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-array.prototype.values', 'Array.prototype.values')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.prototype.values', 'Array.prototype.values')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Array.values")}}</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.keys()")}}</li>
+ <li>{{jsxref("Array.prototype.entries()")}}</li>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Array.prototype.every()")}}</li>
+ <li>{{jsxref("Array.prototype.some()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/arraybuffer/@@species/index.html b/files/es/web/javascript/reference/global_objects/arraybuffer/@@species/index.html
new file mode 100644
index 0000000000..eda3bc192d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/arraybuffer/@@species/index.html
@@ -0,0 +1,73 @@
+---
+title: get ArrayBuffer[@@species]
+slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species
+tags:
+  - ArrayBuffer
+  - JavaScript
+  - Propiedad
+  - TypedArrays
+translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species
+original_slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/@@species
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad de acceso <code><strong>ArrayBuffer[@@species]</strong></code> devuelve el constructor <code>ArrayBuffer</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">ArrayBuffer[Symbol.species]
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad de acceso <code>species</code> devuelve el constructor predeterminado para los objetos <code>ArrayBuffer</code>. Los constructores de subclase pueden anularlo para cambiar la asignación del constructor.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>La propiedad <code>species</code> devuelve la función constructora predeterminada, que es el constructor <code>ArrayBuffer</code> para los objetos <code>ArrayBuffer</code>:</p>
+
+<pre class="brush: js">ArrayBuffer[Symbol.species]; // función ArrayBuffer()</pre>
+
+<p>En un objeto de colección derivado (por ejemplo, su búfer de array personalizado <code>MyArrayBuffer</code>), <code>MyArrayBuffer</code> species es el constructor <code>MyArrayBuffer</code>. Sin embargo, es posible que desee sobrescribir esto para devolver objetos <code>ArrayBuffer</code> principales en sus métodos de clase derivados:</p>
+
+<pre class="brush: js">class MyArrayBuffer extends ArrayBuffer {
+  // Overwrite MyArrayBuffer species to the parent ArrayBuffer constructor
+  static get [Symbol.species]() { return ArrayBuffer; }
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.ArrayBuffer.@@species")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("ArrayBuffer")}}</li>
+ <li>{{jsxref("Symbol.species")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html b/files/es/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html
new file mode 100644
index 0000000000..141aac9107
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/arraybuffer/bytelength/index.html
@@ -0,0 +1,71 @@
+---
+title: ArrayBuffer.prototype.byteLength
+slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength
+tags:
+  - ArrayBuffer
+  - JavaScript
+  - Propiedad
+  - Prototipo
+translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength
+original_slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/byteLength
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad de acceso <code><strong>byteLength</strong></code> representa la longitud de {{jsxref("ArrayBuffer")}} en bytes.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/arraybuffer-bytelength.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>arr</var>aybuffer.byteLength</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad <code>byteLength</code> es una propiedad de acceso cuya función de acceso de conjunto es <code>undefined</code>, lo que significa que solo puede leer esta propiedad. El valor se establece cuando la matriz se construye y no se puede cambiar. Esta propiedad devuelve <code>0</code> si este <code>ArrayBuffer</code> ha sido separado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush:js">var buffer = new ArrayBuffer(8);
+buffer.byteLength; // 8
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Typed Array')}}</td>
+   <td>{{Spec2('Typed Array')}}</td>
+   <td>Reemplazado por ECMAScript 2015.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-get-arraybuffer.prototype.bytelength', 'ArrayBuffer.prototype.byteLength')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial en un estándar ECMA.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-get-arraybuffer.prototype.bytelength', 'ArrayBuffer.prototype.byteLength')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.ArrayBuffer.byteLength")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("ArrayBuffer")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/arraybuffer/index.html b/files/es/web/javascript/reference/global_objects/arraybuffer/index.html
new file mode 100644
index 0000000000..376a023b50
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/arraybuffer/index.html
@@ -0,0 +1,140 @@
+---
+title: ArrayBuffer
+slug: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
+tags:
+  - ArrayBuffer
+  - Constructor
+  - JavaScript
+  - TypedArrays
+translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
+original_slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>ArrayBuffer</code></strong> se usa para representar un buffer genérico, de datos binarios crudos (raw) con una longitud específica. No se puede manipular directamente el contenido de un <code>ArrayBuffer</code>; sin embargo, puedes crear uno de los <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">arrays tipados</a> o un objeto {{jsxref("DataView")}} que representa el buffer en un formato especifico, y usarlo para leer y escribir el contenido del buffer.</p>
+
+<p>{{EmbedInteractiveExample("pages/js/arraybuffer-constructor.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">new ArrayBuffer(length)
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>length</code></dt>
+ <dd>El tamaño en bytes, del array buffer que quieres crear.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un nuevo objeto <code>ArrayBuffer</code> de tamaño específico. Su contenido se inicializa a cero.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<p>Se lanza un {{jsxref("RangeError")}} si la longitud (<code>length</code>) es mayor que {{jsxref("Number.MAX_SAFE_INTEGER")}} (&gt; = 2 ** 53) o negativa.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El constructor de <code>ArrayBuffer</code> crea un nuevo <code>ArrayBuffer</code> del tamaño especificado en bytes.</p>
+
+<h3 id="Obtener_un_array_buffer_sobre_datos_existentes">Obtener un array buffer sobre datos existentes</h3>
+
+<ul>
+ <li><a href="/es/docs/Web/API/WindowBase64/Base64_encoding_and_decoding#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer">Desde un string Base64</a></li>
+ <li><a href="/es/docs/Web/API/FileReader#readAsArrayBuffer()">Desde un fichero local</a></li>
+</ul>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>ArrayBuffer.length</code></dt>
+ <dd>El tamaño de constructor de <code>ArrayBuffer</code> cuyo valor es 1.</dd>
+ <dt>{{jsxref("ArrayBuffer.@@species", "get ArrayBuffer[@@species]")}}</dt>
+ <dd>La función de constructor que se usa para crear objetos derivados.</dd>
+ <dt>{{jsxref("ArrayBuffer.prototype")}}</dt>
+ <dd>Permite añadir propiedades a todos los objetos <code>ArrayBuffer</code>.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("ArrayBuffer.isView", "ArrayBuffer.isView(arg)")}}</dt>
+ <dd>Devuelve <code>true</code> si <code>arg</code> es una de las vistas de ArrayBuffer, como pueden ser los <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">arrays tipados</a> o un {{jsxref("DataView")}}. Sino devuelve <code>false</code>.</dd>
+ <dt>{{jsxref("ArrayBuffer.transfer", "ArrayBuffer.transfer(oldBuffer [, newByteLength])")}} {{experimental_inline}}</dt>
+ <dd>
+ <div class="line" id="file-arraybuffer-transfer-LC6">Devuelve un nuevo <code>ArrayBuffer</code> cuyo contenido se toma de los datos de <code>oldBuffer</code> y luego es truncado o extendido por cero por <code>newByteLength</code>.</div>
+ </dd>
+</dl>
+
+<h2 id="Instancias">Instancias</h2>
+
+<p>Todas las instancias de <code>ArrayBuffer</code> heredan de {{jsxref("ArrayBuffer.prototype")}}.</p>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<p>{{page('es/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','Propiedades')}}</p>
+
+<h3 id="Métodos_2">Métodos</h3>
+
+<p>{{page('es/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','Métodos')}}</p>
+
+<dl>
+ <dt>{{jsxref("ArrayBuffer.slice()")}} {{non-standard_inline}}</dt>
+ <dd>Tiene la misma funcionalidad que {{jsxref("ArrayBuffer.prototype.slice()")}}.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>En este ejemplo creamos un buffer de 8-bytes con una vista del tipo {{jsxref("Global_Objects/Int32Array", "Int32Array")}} referenciando dicho buffer:</p>
+
+<pre class="brush: js">var buffer = new ArrayBuffer(8);
+var view   = new Int32Array(buffer);</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Typed Array')}}</td>
+   <td>{{Spec2('Typed Array')}}</td>
+   <td>Sustituida por ECMAScript 6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial en un estándar ECMA. Especifica que new es obligatorio.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.ArrayBuffer")}}</p>
+
+<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
+
+<p>Desde el ECMAScript 2015, los constructores de <code>ArrayBuffer</code> requieren ser instanciados usando el operador {{jsxref("Operators/new", "new")}}. Ejecutar el constructor de un <code>ArrayBuffer</code> como una funciónsin el <code>new</code>, lanzará un {{jsxref("TypeError")}} de ahora en adelante.</p>
+
+<pre class="brush: js example-bad">var dv = ArrayBuffer(10);
+// TypeError: llamar al constructor ArrayBuffer sin new está prohibido</pre>
+
+<pre class="brush: js example-good">var dv = new ArrayBuffer(10);</pre>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li>
+ <li>{{jsxref("SharedArrayBuffer")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/asyncfunction/index.html b/files/es/web/javascript/reference/global_objects/asyncfunction/index.html
new file mode 100644
index 0000000000..c818140ae7
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/asyncfunction/index.html
@@ -0,0 +1,123 @@
+---
+title: Funciones asíncronas
+slug: Web/JavaScript/Reference/Global_Objects/AsyncFunction
+translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Funcionesasíncronas
+---
+<div>{{JSRef}}</div>
+
+<div>El constructor de las funciones asíncronas crea un nuevo objecto {{jsxref("Statements/async_function", "async function")}}. En JavaScript cada función asíncrona es un objeto AsyncFunction.</div>
+
+<div></div>
+
+<div>Nota: AsyncFunction no es un objeto global. Este puede ser obtenido como resultado del siguiente código.</div>
+
+<div></div>
+
+<pre class="brush: js notranslate">Object.getPrototypeOf(async function(){}).constructor
+</pre>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox notranslate">new AsyncFunction([<var>arg1</var>[, <var>arg2</var>[, ...<var>argN</var>]],] <var>functionBody</var>)</pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>arg1, arg2, ... arg<em>N</em></code></dt>
+ <dd>Nombres a ser usados por la función como los nombres de los argumentos. Cada uno debe ser una cadena que corresponda a un identificador válido en JavaScript o una lista de cadenas separadas por coma, ejemplo: "<code>x</code>", "<code>theValue</code>", or "<code>a,b</code>".</dd>
+ <dt><code>functionBody</code></dt>
+ <dd>Una cadena que contiene las declaraciones de JavaScript que comprenden la definición de la función.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>{{jsxref("Statements/async_function", "async function")}} los objetos creados con el constructor <code>AsyncFunction</code> son analizados gramaticalmente en el momento que la función es creada. Esto es menos eficiente que declarar una función asincrona con un {{jsxref("Statements/async_function", "async function expression")}} y llamarla con eso en tu código , ya que las funciones están analizadas gramaticalmento junto al resto del código.</p>
+
+<p>Todos los argumentos que son pasados por la función son tratados por los nombres de los identificadores con los que fueron creados, en el orden en que son pasados por la función.</p>
+
+<div class="note">
+<p><strong>Note:</strong> {{jsxref("Statements/async_function", "async functions")}} created with the <code>AsyncFunction</code> constructor do not create closures to their creation contexts; they are always created in the global scope. When running them, they will only be able to access their own local variables and global ones, not the ones from the scope in which the <code>AsyncFunction</code> constructor was called. This is different from using {{jsxref("Global_Objects/eval", "eval")}} with code for an async function expression.</p>
+</div>
+
+<p>Invoking the <code>AsyncFunction</code> constructor as a function (without using the <code>new</code> operator) has the same effect as invoking it as a constructor.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code><strong>AsyncFunction.length</strong></code></dt>
+ <dd>The <code>AsyncFunction</code> constructor's length property whose value is 1.</dd>
+ <dt>{{jsxref("AsyncFunction.prototype")}}</dt>
+ <dd>Allows the addition of properties to all async function objects.</dd>
+</dl>
+
+<h2 id="El_objeto_prototipo_AsyncFunction">El objeto prototipo <code> AsyncFunction</code> </h2>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype', 'Properties')}}</div>
+
+<h2 id="AsyncFunction_y_sus_instancias"><code>AsyncFunction</code> y sus instancias</h2>
+
+<p>Una instancia de <code>AsyncFunction</code>  hereda métodos y propiedades de {{jsxref("AsyncFunction.prototype")}}. Como son todos los constructores, puedes cambiar el constructor del objeto prototipo para aplicar cambios a todas las instancias de <code>AsyncFunction</code> .</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Creating_an_async_function_from_an_AsyncFunction_constructor">Creating an async function from an <code>AsyncFunction</code> constructor</h3>
+
+<pre class="brush: js notranslate">function resolveAfter2Seconds(x) {
+  return new Promise(resolve =&gt; {
+    setTimeout(() =&gt; {
+      resolve(x);
+    }, 2000);
+  });
+}
+
+var AsyncFunction = Object.getPrototypeOf(async function(){}).constructor
+
+var a = new AsyncFunction('a',
+                          'b',
+                          'return await resolveAfter2Seconds(a) + await resolveAfter2Seconds(b);');
+
+a(10, 20).then(v =&gt; {
+  console.log(v); // prints 30 after 4 seconds
+});
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-async-function-objects', 'AsyncFunction object')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Initial definition in ES2017.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.AsyncFunction")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Statements/async_function", "async function function")}}</li>
+ <li>{{jsxref("Operators/async_function", "async function expression")}}</li>
+ <li>{{jsxref("Global_Objects/Function", "Function")}}</li>
+ <li>{{jsxref("Statements/function", "function statement")}}</li>
+ <li>{{jsxref("Operators/function", "function expression")}}</li>
+ <li>{{jsxref("Functions_and_function_scope", "Functions and function scope", "", 1)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/boolean/boolean/index.html b/files/es/web/javascript/reference/global_objects/boolean/boolean/index.html
new file mode 100644
index 0000000000..58edf1dd64
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/boolean/boolean/index.html
@@ -0,0 +1,76 @@
+---
+title: Boolean() constructor
+slug: Web/JavaScript/Reference/Global_Objects/Boolean/Boolean
+tags:
+  - Booleano
+  - Constructor
+  - JavaScript
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/Boolean
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Boolean/Boolean
+---
+<div>{{JSRef}}</div>
+
+<p>El constructor <strong><code>Boolean()</code></strong> se usa para crear objetos {{jsxref("Boolean")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/boolean-constructor.html", "shorter")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">new Boolean([<var>value</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>value</code> {{optional_inline}}</dt>
+ <dd>El valor inicial del objeto <code>Boolean</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_false">Creación de objetos <code>Boolean</code> con un valor inicial de <code>false</code></h3>
+
+<pre class="brush: js notranslate">var bNoParam = new Boolean();
+var bZero = new Boolean(0);
+var bNull = new Boolean(null);
+var bEmptyString = new Boolean('');
+var bfalse = new Boolean(false);
+</pre>
+
+<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_true">Creación de objetos <code>Boolean</code> con un valor inicial de <code>true</code></h3>
+
+<pre class="brush: js notranslate">var btrue = new Boolean(true);
+var btrueString = new Boolean('true');
+var bfalseString = new Boolean('false');
+var bSuLin = new Boolean('Su Lin');
+var bArrayProto = new Boolean([]);
+var bObjProto = new Boolean({});</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-boolean-constructor', 'Boolean constructor')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Boolean.Boolean")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="/es/docs/Glossary/Boolean">Boolean</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/boolean/index.html b/files/es/web/javascript/reference/global_objects/boolean/index.html
new file mode 100644
index 0000000000..8591bc3ffb
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/boolean/index.html
@@ -0,0 +1,127 @@
+---
+title: Booleano
+slug: Web/JavaScript/Reference/Global_Objects/Boolean
+tags:
+  - Boolean
+  - Clase
+  - Class
+  - Constructor
+  - JavaScript
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Boolean
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Boolean
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>Boolean</code></strong> es un objeto contenedor para un valor booleano.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El valor pasado como primer parámetro se convierte en un valor booleano, si es necesario. Si el valor se omite o es <code>0</code>, <code>-0</code>, {{jsxref("null")}}, <code>false</code>, {{jsxref("NaN")}}, {{jsxref("undefined")}}, o la cadena vacía (<code>""</code>), el objeto tiene un valor inicial de <code>false</code>. Todos los demás valores, incluido cualquier objeto, un arreglo vacío (<code>[]</code>) o la cadena "<code>false</code>", crean un objeto con un valor inicial de <code>true</code>.</p>
+
+<p>No confundas los valores del <code>Boolean</code> {{Glossary("Primitive", "primitivo")}}, <code>true</code> y <code>false</code> con los valores <code>true</code> y <code>false</code> del objeto <code>Boolean</code>.</p>
+
+<p><strong>Cualquier</strong> objeto cuyo valor no sea {{jsxref("undefined")}} o {{jsxref("null")}}, incluido un objeto <code>Boolean</code> cuyo valor es <code>false</code>, se evalúa como <code>true</code> cuando se pasa a una declaración condicional. Por ejemplo, la condición en la siguiente declaración {{jsxref("Statements/if...else", "if")}} se evalúa como <code>true</code>:</p>
+
+<pre class="brush: js notranslate">var x = new Boolean(false);
+if (x) {
+  // este código se ejecuta
+}
+</pre>
+
+<p>Este comportamiento no se aplica a los <code>Boolean</code> primitivos. Por ejemplo, la condición en la siguiente instrucción {{jsxref("Statements/if...else", "if")}} se evalúa como <code>false</code>:</p>
+
+<pre class="brush: js notranslate">var x = false;
+if (x) {
+  // este código no se ejecuta
+}
+</pre>
+
+<p>No utilices un objeto <code>Boolean</code> para convertir un valor no booleano en un valor booleano. Para realizar esta tarea, en su lugar, usa <code>Boolean</code> como función, o un <a href="/es/docs/Web/JavaScript/Reference/Operators/Logical_NOT">operador <code>NOT</code> doble</a>:</p>
+
+<pre class="brush: js notranslate">var x = Boolean(expression);     // usa esta...
+var x = !!(expression);          // ... o esta
+var x = new Boolean(expression); // ¡no uses esta!
+</pre>
+
+<p>Si especificas cualquier objeto, incluido un objeto <code>Boolean</code> cuyo valor es <code>false</code>, como valor inicial de un objeto <code>Boolean</code>, el nuevo objeto <code>Boolean</code> tiene un valor de <code>true</code>.</p>
+
+<pre class="brush: js notranslate">var myFalse = new Boolean(false);   // valor inicial de false
+var g = Boolean(myFalse);           // valor inicial de true
+var myString = new String('Hola');  // objeto string
+var s = Boolean(myString);          // valor inicial de true
+</pre>
+
+<p>No utilices un objeto <code>Boolean</code> en lugar de un <code>Boolean</code> primitivo.</p>
+
+<div class="note">
+<p><strong>Nota</strong> Cuando la propiedad no estándar <a href="/es/docs/Web/API/Document#Properties"><code>document.all</code></a> se usa como argumento para este constructor, el resultado es un objeto <code>Boolean</code> con el valor <code>false</code>. Esta propiedad es heredada y no estándar y no se debe usar.</p>
+</div>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{jsxref("Global_Objects/Boolean/Boolean", "Boolean()")}}</dt>
+ <dd>Crea un nuevo objeto <code>Boolean</code>.</dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt>{{jsxref("Boolean.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena de <code>true</code> o <code>false</code> dependiendo del valor del objeto. Redefine el método {{jsxref("Object.prototype.toString()")}}.</dd>
+ <dt>{{jsxref("Boolean.prototype.valueOf()")}}</dt>
+ <dd>Devuelve el valor primitivo del objeto {{jsxref("Boolean")}}. Redefine el método {{jsxref("Object.prototype.valueOf()")}}.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_false">Creación de objetos <code>Boolean</code> con un valor inicial de <code>false</code></h3>
+
+<pre class="brush: js notranslate">var bNoParam = new Boolean();
+var bZero = new Boolean(0);
+var bNull = new Boolean(null);
+var bEmptyString = new Boolean('');
+var bfalse = new Boolean(false);
+</pre>
+
+<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_true">Creación de objetos <code>Boolean</code> con un valor inicial de <code>true</code></h3>
+
+<pre class="brush: js notranslate">var btrue = new Boolean(true);
+var btrueString = new Boolean('true');
+var bfalseString = new Boolean('false');
+var bSuLin = new Boolean('Su Lin');
+var bArrayProto = new Boolean([]);
+var bObjProto = new Boolean({});
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-boolean-objects', 'Boolean')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Boolean")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="/es/docs/Glossary/Boolean">Boolean</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Data_structures#Boolean_type">Boolean primitivo</a></li>
+ <li><a href="https://es.wikipedia.org/wiki/Tipo_de_dato_lógico">Tipo de dato <code>Boolean</code> (Wikipedia)</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/boolean/tosource/index.html b/files/es/web/javascript/reference/global_objects/boolean/tosource/index.html
new file mode 100644
index 0000000000..08cc4f89a4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/boolean/tosource/index.html
@@ -0,0 +1,37 @@
+---
+title: Boolean.prototype.toSource()
+slug: Web/JavaScript/Reference/Global_Objects/Boolean/toSource
+tags:
+  - Boolean
+  - JavaScript
+  - Method
+  - Non-standard
+  - Prototype
+translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/toSource
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Boolean/toSource
+---
+<div>
+ {{JSRef("Objetos_globales", "Boolean")}} {{ Non-standard_header() }}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Devuelve una cadena que representa el código fuente del objeto.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<p><code>toSource() </code></p>
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+<p>Ninguno.</p>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>El método <code>toSource</code> devuelve los siguientes valores:</p>
+<ul>
+ <li>Para objetos built-in <code>Boolean</code>, <code>toSource</code> devuelve la siguiente cadena indicando que el código fuente no está disponible:</li>
+</ul>
+<pre class="brush: js">function Boolean() {
+   [código nativo]
+}
+</pre>
+<ul>
+ <li>Para instancias de <code>Boolean</code>, <code>toSource</code> devuelve una cadena representando el código fuente.</li>
+</ul>
+<p>Este método se utiliza habitualmente en llamadas internas por JavaScript y no en código explícito.</p>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("Object.prototype.toSource()")}} {{Non-standard_inline()}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getdate/index.html b/files/es/web/javascript/reference/global_objects/date/getdate/index.html
new file mode 100644
index 0000000000..af866c157e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getdate/index.html
@@ -0,0 +1,120 @@
+---
+title: Date.prototype.getDate()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getDate
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDate
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getDate
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getDate()</code></strong> devuelve el día del mes para la fecha especificada de acuerdo con la hora local.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getDate()</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El valor devuelto por <code>getDate() es u</code>n número entero, entre 1 y 31, que representa el día del mes para la fecha dada según la hora local.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_de_getDate()">Uso de <code>getDate()</code></h3>
+
+<p>La segunda instrucción asigna el valor 25 a la variable <code>day</code>, en función del valor del objeto {{jsxref("Date")}} <code>Xmas95</code>.</p>
+
+<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
+var day = Xmas95.getDate();
+
+console.log(day); // 25
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getdate', 'Date.prototype.getDate')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.14', 'Date.prototype.getDate')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implantado en JavaScript 1.1.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCDate()")}}</li>
+ <li>{{jsxref("Date.prototype.getUTCDay()")}}</li>
+ <li>{{jsxref("Date.prototype.setDate()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getday/index.html b/files/es/web/javascript/reference/global_objects/date/getday/index.html
new file mode 100644
index 0000000000..f4acba9178
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getday/index.html
@@ -0,0 +1,125 @@
+---
+title: Date.prototype.getDay()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getDay
+tags:
+  - Date
+  - JavaScript
+  - Prototype
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDay
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getDay
+---
+<div>{{JSRef}}</div>
+
+<p><code>El método </code><strong><code>getDay()</code></strong> devuelve el día de la semana de la fecha especificada en función de la fecha local; siendo 0 (Domingo) el primer día.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getDay()</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El valor devuelto por <code>getDay()</code> es un entero correspondiente al día de la semana; siendo 0 (Domingo) el primer día, 1 (Lunes) el segundo, etcétera. </p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usos_de_getDay()"><code>Usos de getDay()</code></h3>
+
+<p>La segunda sentencia asigna el valor 1 a <code>weekday, </code>basado en el valor del objeto Xmas95  {{jsxref("Date")}}. December 25, 1995,  que corresponde a Lunes.</p>
+
+<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
+var weekday = Xmas95.getDay();
+
+console.log(weekday); // 1
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getday', 'Date.prototype.getDay')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.16', 'Date.prototype.getDay')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JS 1.0.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte báisco</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCDate()")}}</li>
+ <li>{{jsxref("Date.prototype.getUTCDay()")}}</li>
+ <li>{{jsxref("Date.prototype.setDate()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getfullyear/index.html b/files/es/web/javascript/reference/global_objects/date/getfullyear/index.html
new file mode 100644
index 0000000000..f0aebf4f7a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getfullyear/index.html
@@ -0,0 +1,68 @@
+---
+title: Date.prototype.getFullYear()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getFullYear
+tags:
+  - Fecha
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getFullYear
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getFullYear
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getFullYear()</code></strong> devuelve el año de la fecha indicada acorde a la hora local.</p>
+
+<p>Usa este método en lugar del método {{jsxref("Date.prototype.getYear()", "getYear()")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/date-getfullyear.html","shorter")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>dateObj</var>.getFullYear()</pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un número correspondiente al año de la fecha indicada, según la hora local.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El valor devuelto por <code>getFullYear()</code> es un número absoluto. Para fechas entre los años 1000 y 9999, <code>getFullYear()</code> devuelve un número de cuatro cifras, por ejemplo, 1995. Utiliza esta función para obtener un año que cumpla con los años posteriores al 2000.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_getFullYear">Utilizando getFullYear()</h3>
+
+<p>El siguiente ejemplo asigna el valor de cuatro dígitos del año actual a la variable <code>year</code>.</p>
+
+<pre class="brush: js notranslate">var today = new Date();
+var year = today.getFullYear();
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.getfullyear', 'Date.prototype.getFullYear')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Date.getFullYear")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li>
+ <li>{{jsxref("Date.prototype.setFullYear()")}}</li>
+ <li>{{jsxref("Date.prototype.getYear()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/gethours/index.html b/files/es/web/javascript/reference/global_objects/date/gethours/index.html
new file mode 100644
index 0000000000..725ace0475
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/gethours/index.html
@@ -0,0 +1,120 @@
+---
+title: Date.prototype.getHours()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getHours
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getHours
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getHours
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getHours()</code></strong> retorna la hora de la fecha especificada, de acuerdo a la hora local.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getHours()</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un número entero, entre 0 y 23, representando la hora de la fecha dada de acuerdo a la hora local.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_getHours()">Usando <code>getHours()</code></h3>
+
+<p>La segunda sentencia abajo asigna el valor 23 a la variable hours, basado en el valor del objeto {{jsxref("Global_Objects/Date", "Date")}} <code>Xmas95</code>.</p>
+
+<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
+var hours = Xmas95.getHours();
+
+console.log(hours); // 23
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definicion inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.18', 'Date.prototype.getHours')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.gethours', 'Date.prototype.getHours')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.gethours', 'Date.prototype.getHours')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_tambien">Ver tambien</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCHours()")}}</li>
+ <li>{{jsxref("Date.prototype.setHours()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getmilliseconds/index.html b/files/es/web/javascript/reference/global_objects/date/getmilliseconds/index.html
new file mode 100644
index 0000000000..1afe53ae06
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getmilliseconds/index.html
@@ -0,0 +1,122 @@
+---
+title: Date.prototype.getMilliseconds()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds
+tags:
+  - Fecha
+  - Milisegundos
+  - Prototipo
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getMilliseconds
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getMilliseconds()</code></strong> devuelve la cantidad de milisegundos en el objeto fecha especificado de acuerdo a la hora local.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getMilliseconds()</code></pre>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>Un número, entre 0 y 999, que representa la cantidad de milisegundos en la fecha dada, de acuerdo a la hora local.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_getMilliseconds()">Usando <code>getMilliseconds()</code></h3>
+
+<p>El siguiente ejemplo asigna la cantidad de milisegundos de la hora actual a la variable <code>milisegundos</code>:</p>
+
+<pre class="brush: js">var ahora = new Date();
+var milisegundos = ahora.getMilliseconds();
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.3.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.24', 'Date.prototype.getMilliseconds')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getmilliseconds', 'Date.prototype.getMilliseconds')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.getmilliseconds', 'Date.prototype.getMilliseconds')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<h2 id="CompatibilityTable">{{CompatibilityTable}}</h2>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCMilliseconds()")}}</li>
+ <li>{{jsxref("Date.prototype.setMilliseconds()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getminutes/index.html b/files/es/web/javascript/reference/global_objects/date/getminutes/index.html
new file mode 100644
index 0000000000..47a10b2837
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getminutes/index.html
@@ -0,0 +1,119 @@
+---
+title: Date.prototype.getMinutes()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getMinutes
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMinutes
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getMinutes
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getMinutes()</code></strong> devuelve los minutos de la fecha especificada en función de la hora local. </p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getMinutes()</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Devuelve">Devuelve</h3>
+
+<p>El valor devuelto por <code>getMinutes()</code> es un número entero entre 0 y 59.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_de_getMinutes()"><code>Uso de getMinutes()</code></h3>
+
+<p>La segunda declaración del código mostrado a continuación le asigna el valor 15 a la variable <code>minutos</code>, basado en el valor del {{jsxref("Global_Objects/Date", "Date")}} <code>objeto Xmas95</code>.</p>
+
+<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
+var minutos = Xmas95.getMinutes();
+
+console.log(minutos); // 15
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.20', 'Date.prototype.getMinutes')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getminutes', 'Date.prototype.getMinutes')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCMinutes()")}}</li>
+ <li>{{jsxref("Date.prototype.setMinutes()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getmonth/index.html b/files/es/web/javascript/reference/global_objects/date/getmonth/index.html
new file mode 100644
index 0000000000..8f42b2c7b8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getmonth/index.html
@@ -0,0 +1,126 @@
+---
+title: Date.prototype.getMonth()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getMonth
+tags:
+  - Date
+  - JavaScript
+  - Method
+  - Reference
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMonth
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getMonth
+---
+<div>{{JSRef}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El método getMonth() devuelve el mes del objeto Date según la hora local, donde el número cero indica el primer mes del año.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getMonth()</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>El valor devuelto por getMonth() es un entero entre 0 y 11, donde 0 corresponde a Enero, 1 a Febrero y así sucesivamente.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_getMonth()">Usando <code>getMonth()</code></h3>
+
+<p>En el siguiente ejemplo, la segunda línea asigna el valor 11 a la variable mes, basado en el valor del objeto {{jsxref("Date")}} N<code>avidad</code>.</p>
+
+<pre class="brush: js">var Navidad = new Date('December 25, 2014 23:15:30');
+var mes = Navidad.getMonth();
+
+console.log(mes); // 11
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Primera definición. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.12', 'Date.prototype.getMonth')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getmonth', 'Date.prototype.getMonth')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad">Compatibilidad</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCMonth()")}}</li>
+ <li>{{jsxref("Date.prototype.setMonth()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getseconds/index.html b/files/es/web/javascript/reference/global_objects/date/getseconds/index.html
new file mode 100644
index 0000000000..8ac39df2ac
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getseconds/index.html
@@ -0,0 +1,84 @@
+---
+title: Date.prototype.getSeconds()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getSeconds
+tags:
+  - Fecha
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getSeconds
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getSeconds
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getSeconds()</code></strong> devuelve los segundos en la fecha especificada de acuerdo a la hora local.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/date-getseconds.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getSeconds()</code></pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un número entero, entro 0 y 59, representando los segundos en la fecha dada de acuerdo a la hora local.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_getSeconds()">Utilizando <code>getSeconds()</code></h3>
+
+<p>La segunda sentencia asigna el valor 30 a la variable <code>seconds</code>, en base al valor del objeto {{jsxref("Global_Objects/Date", "Date")}} <code>Xmas95</code>.</p>
+
+<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
+var seconds = Xmas95.getSeconds();
+
+console.log(seconds); // 30
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.22', 'Date.prototype.getSeconds')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getseconds', 'Date.prototype.getSeconds')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.getseconds', 'Date.prototype.getSeconds')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Date.getSeconds")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCSeconds()")}}</li>
+ <li>{{jsxref("Date.prototype.setSeconds()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/gettime/index.html b/files/es/web/javascript/reference/global_objects/date/gettime/index.html
new file mode 100644
index 0000000000..37b1c28d3f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/gettime/index.html
@@ -0,0 +1,141 @@
+---
+title: Date.prototype.getTime()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getTime
+tags:
+  - Date
+  - Metodo getTime()
+  - Referencia
+  - getTime
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getTime
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getTime
+---
+<div>{{JSRef("Global_Objects", "Date")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <strong><code>getTime()</code></strong> devuelve el valor numérico correspondiente a la hora para la fecha especificada según la hora universal.</p>
+
+
+
+<p>Puede utilizar este método para ayudar a asignar una fecha y hora a otro objeto {{jsxref("Global_Objects/Date", "Date")}}. Este método es funcionalmente equivalente al metodo {{jsxref("Date.valueof", "valueOf()")}}.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>dateObj</var>.getTime()</code>
+</pre>
+
+<h3 id="Returns" name="Returns">Valor devuelto</h3>
+
+<p>El valor devuelto por el método <code>getTime()</code> es un número de milisegundos desde el 1 de enero de 1970 00:00:00 UTC.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Ejemplo_Uso_de_getTime_para_copiar_fechas.">Ejemplo: Uso de <code>getTime()</code> para copiar fechas.</h3>
+
+<p>Construir un objeto de fecha con el mismo valor de tiempo.</p>
+
+<pre class="brush: js notranslate">var birthday = new Date(1994, 12, 10);
+var copy = new Date();
+copy.setTime(birthday.getTime());
+</pre>
+
+<h3 id="Ejemplo_Medir_el_tiempo_de_ejecución">Ejemplo: Medir el tiempo de ejecución</h3>
+
+<p>Restando dos llamadas <code>getTime() </code>subsiguientes en objetos {{jsxref("Global_Objects/Date", "Date")}} recién generados, dé el intervalo de tiempo entre estas dos llamadas. Esto se puede utilizar para calcular el tiempo de ejecución de algunas operaciones.</p>
+
+<pre class="brush: js notranslate">var end, start;
+
+start = new Date();
+for (var i = 0; i &lt; 1000; i++) {
+  Math.sqrt(i);
+}
+end = new Date();
+
+console.log('Operation took ' + (end.getTime() - start.getTime()) + ' msec');
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Standard</td>
+   <td>Initial definition. Implemented in JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.9', 'Date.prototype.getTime')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.gettime', 'Date.prototype.getTime')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.setTime()")}}</li>
+ <li>{{jsxref("Date.prototype.valueOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getutcfullyear/index.html b/files/es/web/javascript/reference/global_objects/date/getutcfullyear/index.html
new file mode 100644
index 0000000000..f761ec9b77
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getutcfullyear/index.html
@@ -0,0 +1,122 @@
+---
+title: Date.prototype.getUTCFullYear()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getUTCFullYear
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getUTCFullYear()</code></strong> devuelve el año en la fecha especificada en tiempo universal.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>objectoFecha</var>.getUTCFullYear()</code></pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un número que representa el año en la fecha representada por el <code><var>objectoFecha</var></code> en tiempo universal.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El valor devuelto por <code>getUTCFullYear()</code> es un número que no está afectado por  el efecto año 2000, por ejemplo, 1995.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Empleo_de_getUTCFullYear()">Empleo de <code>getUTCFullYear()</code></h3>
+
+<p>El siguiente ejemplo asigna el valor de cuatro digitos del año actual a la variable <code>year</code>.</p>
+
+<pre class="brush: js">var today = new Date();
+var year = today.getUTCFullYear();
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.3.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.11', 'Date.prototype.getUTCFullYear')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getutcfullyear', 'Date.prototype.getUTCFullYear')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.getutcfullyear', 'Date.prototype.getUTCFullYear')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getFullYear()")}}</li>
+ <li>{{jsxref("Date.prototype.setFullYear()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/getutchours/index.html b/files/es/web/javascript/reference/global_objects/date/getutchours/index.html
new file mode 100644
index 0000000000..525a0a2730
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/getutchours/index.html
@@ -0,0 +1,118 @@
+---
+title: Date.prototype.getUTCHours()
+slug: Web/JavaScript/Reference/Global_Objects/Date/getUTCHours
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCHours
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/getUTCHours
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>getUTCHours()</code></strong> retorna las horas especificadas en la fecha deacuerdo al horario universal.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.getUTCHours()</code></pre>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>An integer number, between 0 and 23, representing the hours in the given date according to universal time.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_getUTCHours()">Using <code>getUTCHours()</code></h3>
+
+<p>The following example assigns the hours portion of the current time to the variable <code>hours</code>.</p>
+
+<pre class="brush: js">var today = new Date();
+var hours = today.getUTCHours();
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.3.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.19', 'Date.prototype.getUTCHours')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.getutchours', 'Date.prototype.getUTCHours')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.getutchours', 'Date.prototype.getUTCHours')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getHours()")}}</li>
+ <li>{{jsxref("Date.prototype.setUTCHours()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/index.html b/files/es/web/javascript/reference/global_objects/date/index.html
new file mode 100644
index 0000000000..4fe2d176a4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/index.html
@@ -0,0 +1,133 @@
+---
+title: Date
+slug: Web/JavaScript/Reference/Global_Objects/Date
+tags:
+  - Date
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Global_Objects/Date
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date
+---
+<div>{{JSRef("Objetos_globales", "Date")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Permite trabajar con fechas y horas.</p>
+
+<h2 id="Se_Crea_Con" name="Se_Crea_Con">El constructor</h2>
+
+<p>El constructor <code>Date</code>:</p>
+
+<pre class="brush: js">new Date()
+new Date(<em>milisegundos</em>)
+new Date(<em>cadenaFecha</em>)
+new Date(<em>año_num</em>,<em>mes_num</em>,<em>dia_num</em>
+        [,<em>hor_num</em>,<em>min_num</em>,<em>seg_num</em>,<em>mils_num</em>])
+</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>milisegundos</code></dt>
+ <dd>Valor entero que representa el número de milisegundos desde las 00:00:00 UTC del 1 de enero de 1970.</dd>
+</dl>
+
+<dl>
+ <dt><code>cadenaFecha</code></dt>
+ <dd>Valor de tipo cadena que representa una fecha. La cadena debería estar en un formato reconocido por el método {{jsxref("Date.parse()")}}.</dd>
+</dl>
+
+<dl>
+ <dt><code>año_num, mes_num, dia_num</code></dt>
+ <dd>Valores enteros con las representaciones de las partes de una fecha. Como valor entero, el mes se representa de 0 a 11, con 0=enero and 11=diciembre.</dd>
+</dl>
+
+<dl>
+ <dt><code>hor_num, min_num, seg_num, mils_num</code></dt>
+ <dd>Valores enteros que representan las partes de una hora completa.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Si no proporciona argumentos, el constructor crea un objeto <code>Date</code> con la hora y fecha de hoy según la hora local.</p>
+
+<p><span style="font-size: 14.3999996185303px; line-height: 16.7999992370605px;">Si proporciona algun</span><span style="font-size: 14.3999996185303px; line-height: 16.7999992370605px;">os argumentos, debe proporcionar al menos 2 argumentos.</span> Los argumentos vacíos se establecen a 0 (ó 1 si falta el día). </p>
+
+<p>La fecha se mide en milisegundos desde la media noche exacta del 01 de enero de 1970 en formato UTC. Un día contiene 86.400.000 milisegundos. El rango del objeto Date va desde -100,000,000 días hasta 100,000,000 días respecto del 01 de enero de 1970 UTC.</p>
+
+<p>El objeto <code>Date</code> proporciona un comportamiento uniforme entre plataformas.</p>
+
+<p>El objeto <code>Date</code> soporta métodos UTC (universales), además de métodos horarios locales. UTC, también conocido como Greenwich Mean Time (GMT), se refiere a la hora según el Estádar Horario Mundial (World Time Standard). La hora local es la hora establecida por el ordenador donde se ejecuta JavaScript.</p>
+
+<p>Por compatibilidad con los cálculos del nuevo milenio (en otras palabras, para tener en cuenta el efecto 2000), debería especificar siempre el año completo; por ejemplo, utilice 1998, y no 98. Para ayudarle a especificar el año completo, JavaScript incluye los métodos {{jsxref("Date.prototype.getFullYear()")}}, {{jsxref("Date.prototype.setFullYear()")}}, {{jsxref("Date.prototype.getUTCFullYear()")}}, y {{jsxref("Date.prototype.setUTCFullYear()")}}.</p>
+
+<p>El siguiente ejemplo devuelve el tiempo transcurrido entre <code>horaA</code> y <code>horaB</code> en milisegundos.</p>
+
+<pre class="eval">horaA = new Date();
+// Sentencias que realizan alguna acción.
+horaB = new Date();
+diferenciaHoras = horaB - horaA;
+</pre>
+
+<h2 id="Propiedades" name="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("Date.prototype")}}</dt>
+ <dd>Permite añadir propiedades a un objeto <code>Date</code>.</dd>
+</dl>
+
+<p>{{ jsOverrides("Function", "properties", "prototype") }}</p>
+
+<h2 id="M.C3.A9todos_Est.C3.A1ticos" name="M.C3.A9todos_Est.C3.A1ticos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Date.now()")}}</dt>
+ <dd>Devuelve el valor numérico correspondiente a la hora actual.</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("Date.parse()")}}</dt>
+ <dd>Transforma una cadena que representa una fecha, y devuelve el número de milisegundos desde el 1 de enero de 1970, hora local 00:00:00.</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("Date.UTC()")}}</dt>
+ <dd>Acepta los mismos parámetros que la forma más larga del constructor, y devuelve el número de milisegundos en un objeto <code>Date</code> desde el 1 de enero de 1970, hora universal 00:00:00.</dd>
+</dl>
+
+<h2 id="M.C3.A9todos" name="M.C3.A9todos">Instancias de  <code>Date</code></h2>
+
+<h3 id="Métodos">Métodos</h3>
+
+<p>{{ page("/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/prototype", "M.C3.A9todos") }}</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Diversas_maneras_de_asignar_fechas" name="Ejemplo:_Diversas_maneras_de_asignar_fechas">Ejemplo: Diversas maneras de asignar fechas</h3>
+
+<p>Los ejemplos siguientes muestran diversos modos de asignar fechas:</p>
+
+<pre class="brush: js">hoy = new Date();
+cumpleanos = new Date("December 17, 1995 03:24:00");
+cumpleanos = new Date(1995,11,17);
+cumpleanos = new Date(1995,11,17,3,24,0);
+</pre>
+
+<h3 id="Ejemplo:_Calcular_el_tiempo_transcurrido" name="Ejemplo:_Calcular_el_tiempo_transcurrido">Ejemplo: Calcular el tiempo transcurrido</h3>
+
+<p>Los siguientes ejemplos muestran como determinar el tiempo transcurrido entre dos fechas:</p>
+
+<pre class="brush: js">// usando métodos estáticos
+var inicio = Date.now();
+// el evento cuyo tiempo ha transcurrido aquí:
+hacerAlgoPorAlgunTiempo();
+var fin = Date.now();
+var transcurso = fin - inicio; // tiempo en milisegundos
+</pre>
+
+<pre class="brush: js">// si tiene objetos Date
+var inicio = new Date();
+// el evento cuyo tiempo ha transcurrido aquí:
+hacerAlgoPorAlgunTiempo();
+var fin = new Date();
+var transcurso = fin.getTime() - inicio.getTime(); // tiempo en milisegundos
+</pre>
diff --git a/files/es/web/javascript/reference/global_objects/date/now/index.html b/files/es/web/javascript/reference/global_objects/date/now/index.html
new file mode 100644
index 0000000000..025e17d38d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/now/index.html
@@ -0,0 +1,31 @@
+---
+title: Date.now()
+slug: Web/JavaScript/Reference/Global_Objects/Date/now
+tags:
+  - Date
+  - JavaScript
+  - Method
+  - Reference
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/now
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/now
+---
+<div>
+ {{JSRef("Objetos_globales", "Date")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Devuelve el número de milisegundos transcurridos desde las 00:00:00 UTC del 1 de enero de 1970.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox">var <em>fechaEnMiliseg</em> = Date.now();
+</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>El método <code>now</code> devuelve los milisegundos transcurridos desde las 00:00:00 UTC del 1 de enero de 1970 justo hasta ahora como un {{jsxref("Number")}}.</p>
+<p>Cuando se usa <code>now</code> para crear registros temporales or identificadores únicos, tenga en cuenta que la precisión de Windows puede ser de 15 milisegundos (vea {{Bug(363258)}}), lo que puede provocar valores iguales si <code>now</code> se llama múltiples veces en un breve intervalo de tiempo.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_now" name="Ejemplo:_Usando_now">Ejemplo: Usando <code>now</code></h3>
+<p>El siguiente ejemplo usa <code>now</code> para crear un registro temporal.</p>
+<pre class="brush:js">var registro = Date.now();
+</pre>
+<h2 id="Vea_También">Vea También</h2>
+<ul>
+ <li>{{domxref("window.performance.now")}}</li>
+ <li>{{domxref("console.time")}} / {{domxref("console.timeEnd")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/parse/index.html b/files/es/web/javascript/reference/global_objects/date/parse/index.html
new file mode 100644
index 0000000000..46910d5921
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/parse/index.html
@@ -0,0 +1,36 @@
+---
+title: Date.parse()
+slug: Web/JavaScript/Reference/Global_Objects/Date/parse
+tags:
+  - Date
+  - JavaScript
+  - Method
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/parse
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/parse
+---
+<div>
+ {{JSRef("Objetos_globales", "Date")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Transforma una cadena con la representación de una fecha y hora, y devuelve el número de milisegundos desde las 00:00:00 del 1 de enero de 1970, hora local.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox">Date.parse(cadenaFecha)</pre>
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+<dl>
+ <dt>
+  <code>cadenaFecha</code></dt>
+ <dd>
+  Una cadena con la representación de una fecha y hora.</dd>
+</dl>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>El método <code>parse</code> toma una cadena con una fecha en inglés (como por ejemplo "<code>Dec 25, 1995</code>") y devuelve el número de milisegundos desde las 00:00:00 del 1 de enero de 1970 (hora local). Esta función es útil para establecer valores de fecha basados en cadenas con fechas, por ejemplo junto con el método {{jsxref("Date.prototype.setTime()")}} y el objeto {{jsxref("Date")}}.</p>
+<p>Dada una cadena con una hora, <code>parse</code> devuelve el valor de la hora. Acepta la sintaxis del estándar IETF (en inglés): "<code>Mon, 25 Dec 1995 13:30:00 GMT</code>". Comprende las abreviaciones de la zona horaria continental de Estados Unidos, pero para su uso general, use la diferencia de zona horaria, como por ejemplo, "<code>Mon, 25 Dec 1995 13:30:00 GMT+0430</code>" (4 horas, 30 minutos al oeste del meridiano de Greenwich). Si no se especifica una zona horaria, se asumirá la zona de la hora local. GMT y UTC se consideran equivalentes.</p>
+<p>Debido a que <code>parse</code> es un método estático de <code>Date</code>, úselo siempre como <code>Date.parse()</code>, en vez de como un método del objeto <code>Date</code> que usted cree.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_parse" name="Ejemplo:_Usando_parse">Ejemplo: Usando <code>parse</code></h3>
+<p>Si <code>IPOfecha</code> es un objeto existente <code>Date</code>, entonces usted puede asignarlo a 9 de agosto de 1995 de la manera siguiente:</p>
+<pre class="brush: js">IPOfecha.setTime(Date.parse("Aug 9, 1995")) ;
+</pre>
+<h2 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h2>
+<ul>
+ <li>{{jsxref("Date.UTC()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/setfullyear/index.html b/files/es/web/javascript/reference/global_objects/date/setfullyear/index.html
new file mode 100644
index 0000000000..306389e030
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/setfullyear/index.html
@@ -0,0 +1,134 @@
+---
+title: Date.prototype.setFullYear()
+slug: Web/JavaScript/Reference/Global_Objects/Date/setFullYear
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/setFullYear
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/setFullYear
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>setFullYear()</code></strong> fija el año completo para una fecha específica de acuerdo a la zona horaria local. Devuelve un nuevo valor de tipo timestamp.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.setFullYear(<var>valorAño</var>[, <var>valorMes</var>[, <var>valorDia</var>]])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valorAño</code></dt>
+ <dd>Valor de tipo entero que contiene el valor numérico del año, por ejemplo, 1995.</dd>
+ <dt><code>valorMes</code></dt>
+ <dd>Opcional. Valor entero entre 0 y 11 que representa el mes de Enero a Diciembre.</dd>
+ <dt><code>valorDia</code></dt>
+ <dd>Opcional. Valor entero entre 1 y 31 que representa el día del mes. Si se especifica este parámetro debe incluirse también el parámetro <code>valorMes</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El número de milisegundos entre 1 Enero 1970 00:00:00 UTC y a la fecha actualizada con el valor del año.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si en la invocación al método no se especifican los parámetros <code>valorMes</code> y <code>valorDia, se emplean en su lugar los valores devueltos por </code> {{jsxref("Date.prototype.getMonth()", "getMonth()")}} y {{jsxref("Date.prototype.getDate()", "getDate()")}}.</p>
+
+<p>Si se especifica un parámetro con un valor fuera del rango esperado,  <code>setFullYear()</code> intenta actualizar el resto de parámetros y la informacion de fecha en el objeto {{jsxref("Date")}} de manera consistente. Por ejemplo, si se especifica el valor 15 para el parametro <code>valorMes</code>, el parámetro año se incrementa en 1  (<code>valorAño+ 1</code>), y se emplea  3 como valor para el parámetro mes.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_de_setFullYear()">Uso de <code>setFullYear()</code></h3>
+
+<pre class="brush: js">var theBigDay = new Date();
+theBigDay.setFullYear(1997);
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.3.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.40', 'Date.prototype.setFullYear')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.setfullyear', 'Date.prototype.setFullYear')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.setfullyear', 'Date.prototype.setFullYear')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li>
+ <li>{{jsxref("Date.prototype.setUTCFullYear()")}}</li>
+ <li>{{jsxref("Date.prototype.setYear()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/setmonth/index.html b/files/es/web/javascript/reference/global_objects/date/setmonth/index.html
new file mode 100644
index 0000000000..31cf7a0a1b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/setmonth/index.html
@@ -0,0 +1,79 @@
+---
+title: Date.prototype.setMonth()
+slug: Web/JavaScript/Reference/Global_Objects/Date/setMonth
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMonth
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/setMonth
+---
+<div>{{JSRef}}</div>
+
+<div>El método <strong><code>setMonth()</code></strong> establece el mes para una fecha específica de acuerdo con el año establecido actualmente.</div>
+
+<div>{{EmbedInteractiveExample("pages/js/date-setmonth.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.setMonth(<var>monthValue</var>[,<em>dayValue</em>])</code></pre>
+
+<h3 id="Versiones_anteriores_a_JavaScript_1.3">Versiones anteriores a JavaScript 1.3</h3>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.setMonth(<var>monthValue</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>monthValue</code></dt>
+ <dd>Un entero entre 0 y 11, representando los meses de Enero a Diciembre.</dd>
+ <dt><code>dayValue</code></dt>
+ <dd>Opcional. Un entero de 1 a 31, representando el dia del mes.</dd>
+</dl>
+
+<h3 id="Resultado">Resultado</h3>
+
+<p>El valor retornado es el número de milisegundos entre el 1 de Enero de 1970 00:00:00 UTC y la fecha actualizada.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si no especificas el parámetro <code>dayValue</code>, el valor retornado del metodo {{jsxref("Date.prototype.getDate()", "getDate()")}} es usado.</p>
+
+<p>Si un parámetro especificado esta fuera del rango esperado, <code>setMonth()</code> intenta actualizar la información de la fecha en el objeto {{jsxref("Date")}} en consecuencia. Por ejemplo, si usted usa 15 para <code>monthValue</code>, usa 12 para incrementar el año en 1, y los 3 restantes para calcular el mes.</p>
+
+<p>El día actual del mes tendrá un impacto en el comportamiento de este método. Conceptualmente agregará el número de días dados por el día actual del mes al primer día del nuevo mes especificado como parámetro, para devolver la nueva fecha. Por ejemplo, si el valor actual es el 31 de agosto de 2016, llamar a setMonth con un valor de 1 devolverá el 2 de marzo de 2016. Esto se debe a que en febrero de 2016 tuvo 29 días.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_setMonth">Usando <code>setMonth()</code></h3>
+
+<pre class="brush: js">var theBigDay = new Date();
+theBigDay.setMonth(6);
+
+//Cuidado con las transiciones de fin de mes
+var endOfMonth = new Date(2016, 7, 31);
+endOfMonth.setMonth(1);
+console.log(endOfMonth); //Wed Mar 02 2016 00:00:00
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.setmonth', 'Date.prototype.setMonth')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de extracción.</p>
+
+<p>{{Compat("javascript.builtins.Date.setMonth")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.getMonth()")}}</li>
+ <li>{{jsxref("Date.prototype.setUTCMonth()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/todatestring/index.html b/files/es/web/javascript/reference/global_objects/date/todatestring/index.html
new file mode 100644
index 0000000000..c41e483770
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/todatestring/index.html
@@ -0,0 +1,89 @@
+---
+title: Date.prototype.toDateString()
+slug: Web/JavaScript/Reference/Global_Objects/Date/toDateString
+tags:
+  - Fecha
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/toDateString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/toDateString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toDateString()</code></strong> devuelve la porción de la fecha de un objeto {{jsxref("Date")}} en formato humano legible en Inglés Americano.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.toDateString()</code></pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena que representa la porción de fecha de un determinado objeto {{jsxref("Date")}} en formato humano legible en Inglés Americano.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las instancias de {{jsxref("Date")}} representan momentos especificos en el tiempo. Un llamado a {{jsxref("Date.prototype.toString()", "toString()")}} devolverá la fecha formateada en un formato humano legible en Inglés Americano. En <a href="/en-US/docs/SpiderMonkey">SpiderMonkey</a>, esto consiste en la porción de la fecha (día, mes, y año) seguido por la porción de la hora (horas, minutos, segundos, y zona horaria). Algunas veces sólo se necesita obtener una cadena de la porción de la hora; esto puede lograrse con el método <code>toTimeString()</code>.</p>
+
+<p>El método <code>toDateString()</code> es especialmente útil, pues los distintos motores compatibles que implementan <a href="/en-US/docs/ECMAScript">ECMA-262</a> pueden diferir en la cadena obtenida al ejecutar {{jsxref("Date.prototype.toString()", "toString()")}} para los objetos de tipo {{jsxref("Date")}}, pues dicho formato depende de la implementación, por lo que es posible que el enfoque de la segmentación simple de cadenas no produzca resultados consistentes entre distintos motores.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_básico_de_toDateString()">Uso básico de <code>toDateString()</code></h3>
+
+<pre class="brush: js">var d = new Date(1993, 5, 28, 14, 39, 7);
+
+console.log(d.toString());     // logs Wed Jun 28 1993 14:39:07 GMT-0600 (PDT)
+console.log(d.toDateString()); // logs Wed Jun 28 1993
+</pre>
+
+<div class="note">
+<p><strong>Nota:</strong> Los meses son 0-indexados cuando son utilizados como parámetros de {{jsxref("Date")}} (Siendo así, el cero (0) corresponde a Enero y el once (11) a Diciembre).</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Epecificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.3', 'Date.prototype.toDateString')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.todatestring', 'Date.prototype.toDateString')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.todatestring', 'Date.prototype.toDateString')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quisieras contrubuir con esos datos, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y genera un pull request.</p>
+
+<p>{{Compat("javascript.builtins.Date.toDateString")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
+ <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
+ <li>{{jsxref("Date.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/toisostring/index.html b/files/es/web/javascript/reference/global_objects/date/toisostring/index.html
new file mode 100644
index 0000000000..9440ff6019
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/toisostring/index.html
@@ -0,0 +1,145 @@
+---
+title: Date.prototype.toISOString()
+slug: Web/JavaScript/Reference/Global_Objects/Date/toISOString
+tags:
+  - Date
+  - JavaScript
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/toISOString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/toISOString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toISOString()</code></strong> devuelve una cadena en el formato <em>simplificado</em> extendido ISO (<a href="http://en.wikipedia.org/wiki/ISO_8601">ISO 8601</a>), que siempre mide 24 o 27 caracteres de largo: (<code><var>YYYY</var>-<var>MM</var>-<var>DD</var>T<var>HH</var>:<var>mm</var>:<var>ss.sss</var>Z</code> or <code><var>±</var><var>YYYYYY</var>-<var>MM</var>-<var>DD</var>T<var>HH</var>:<var>mm</var>:<var>ss.sss</var>Z</code>, respectivamente). El uso horario no tiene retraso respecto a UTC, como lo denota el sufijo <code>"Z"</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>dateObj</var>.toISOString()</code>
+</pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena que representa la fecha dada en el formato <a href="http://en.wikipedia.org/wiki/ISO_8601">ISO 8601</a> según la hora universal.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toISOString">Usando <code>toISOString()</code></h3>
+
+<pre class="brush: js notranslate">var today = new Date('05 October 2011 14:48 UTC');
+
+console.log(today.toISOString()); // Devuelve 2011-10-05T14:48:00.000Z
+</pre>
+
+<p>El ejemplo de arriba usa una cadena no estándar que podría no ser interpretada correctamente en navegadores distintos de Firefox.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este método fue estandarizado en ECMA-262 5° edición. Los motores javascript que no han sido actualizados para soportar este método pueden solucionar su ausencia de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">if (!Date.prototype.toISOString) {
+  (function() {
+
+    function pad(number) {
+      if (number &lt; 10) {
+        return '0' + number;
+      }
+      return number;
+    }
+
+    Date.prototype.toISOString = function() {
+      return this.getUTCFullYear() +
+        '-' + pad(this.getUTCMonth() + 1) +
+        '-' + pad(this.getUTCDate()) +
+        'T' + pad(this.getUTCHours()) +
+        ':' + pad(this.getUTCMinutes()) +
+        ':' + pad(this.getUTCSeconds()) +
+        '.' + (this.getUTCMilliseconds() / 1000).toFixed(3).slice(2, 5) +
+        'Z';
+    };
+
+  }());
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.43', 'Date.prototype.toISOString')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en javascript 1.8</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-date.prototype.toisostring', 'Date.prototype.toISOString')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
+ <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
+ <li>{{jsxref("Date.prototype.toUTCString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/tojson/index.html b/files/es/web/javascript/reference/global_objects/date/tojson/index.html
new file mode 100644
index 0000000000..fc5bec9d70
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/tojson/index.html
@@ -0,0 +1,62 @@
+---
+title: Date.prototype.toJSON()
+slug: Web/JavaScript/Reference/Global_Objects/Date/toJSON
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/toJSON
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/toJSON
+---
+<div>{{JSRef}}</div>
+
+<p>El metodo <strong><code>toJSON()</code></strong> retorna una representacion de cadena del objeto {{jsxref("Date")}}</p>
+
+<div>{{EmbedInteractiveExample("pages/js/date-tojson.html")}}</div>
+
+<p class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, por favor clone  <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envienos un pull request.</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>dateObj</var>.toJSON()</code></pre>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Una representación de cadena de la fecha dada.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>{{jsxref("Date")}} las instancias se refieren a un momento específico en el tiempo. Llamando a <code>toJSON()</code> retorna un string (usando {{jsxref("Date.prototype.toISOString()", "toISOString()")}}) representando el {{jsxref("Date")}} valor del objeto. Este método generalmente está destinado, de forma predeterminada, a serializar de manera útil {{jsxref("Date")}} objetos durante la serialización <a href="/en-US/docs/Glossary/JSON">JSON</a> .</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toJSON">Usando <code>toJSON()</code></h3>
+
+<pre class="brush:js notranslate">var jsonDate = (new Date()).toJSON();
+var backToDate = new Date(jsonDate);
+
+console.log(jsonDate); //2015-10-26T07:46:36.611Z
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.tojson', 'Date.prototype.toJSON')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_buscadores">Compatibilidad en buscadores</h2>
+
+<p class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envienos un pull request.</p>
+
+<p>{{Compat("javascript.builtins.Date.toJSON")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
+ <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
+ <li>{{jsxref("Date.prototype.toUTCString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/tolocaledatestring/index.html b/files/es/web/javascript/reference/global_objects/date/tolocaledatestring/index.html
new file mode 100644
index 0000000000..03eeb01938
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/tolocaledatestring/index.html
@@ -0,0 +1,160 @@
+---
+title: Date.prototype.toLocaleDateString()
+slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
+tags:
+  - Fecha
+  - IANA formato horario
+  - Internacionalizacion
+  - JavaScript
+  - Prototipo
+  - Prototype
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleDateString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toLocaleDateString()</code></strong> devuelve una cadena con una representación de la fecha sensible al lenguaje. Los nuevos argumentos <code>locales</code> y <code>options</code> permiten a las aplicaciones especificar el lenguaje cuyas convenciones de formato deben usarse y permitir personalizar el comportamiento de la función. En implementaciones anteriores, las cuales ignoran los argumentos <code>locales</code> y <code>options</code>, el configuración regional usada y el formato de cadena devuelto dependen completamente de la implementación.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/date-tolocaledatestring.html")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo está almacenado en el repositorio de GitHub. Si usted quiere contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción (pull request).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>dateObj</var>.toLocaleDateString([<var>locales</var> [, <var>options</var>]])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Compruebe la sección de <a href="#Browser_compatibility">Compatibilidad con su navegador</a> para ver qué navegadores suportan los argumentos <code>locales</code> y <code>options</code>, y el Ejemplo: <a href="#Checking_for_support_for_locales_and_options_arguments">Comprobando el soporte para los argumentos locales y options</a> para detectar dicha característica.</p>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat', 'Parameters')}}</div>
+
+<p>El valor por defecto para cada propiedad del componente date-time es {{jsxref("undefined")}}, pero si las propiedades <code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code> son todas {{jsxref("undefined")}}, entonces <code>year</code>, <code>month</code>, y <code>day</code> se asumen tener el valor <code>"numeric"</code>.</p>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena representando una porción de fecha de la instancia {{jsxref("Global_Objects/Date", "Date")}} indicada de acuerdo con las convenciones específicas del lenguaje.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toLocaleDateString">Usando <code>toLocaleDateString()</code></h3>
+
+<p>En un caso básico sin especificar una configuración regional, se devolverá una cadena formateada en la configuración regional y las opciones por defecto.</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
+
+// toLocaleDateString() sin argumentos dependientes de la implementación,
+// de la configuración regional por defecto y la zona horaria por defecto
+console.log(date.toLocaleDateString());
+// → "12/11/2012" si se ejecuta en una configuración regional en-US con zona horaria America/Los_Angeles
+</pre>
+
+<h3 id="Comprobando_el_soporte_para_los_argumentos_locales_y_options">Comprobando el soporte para los argumentos <code>locales</code> y <code>options</code></h3>
+
+<p>Los argumentos <code>locales</code> y <code>options</code> no son soportados aún por todos los navegadores. Para comprobar si una implementación los soporta, puede usar el requerimiento To check whether an implementation supports them already, you can use the requirement that illegal language tags are rejected with a {{jsxref("RangeError")}} exception:</p>
+
+<pre>function toLocaleDateStringSupportsLocales() {
+  try {
+    new Date().toLocaleDateString('i');
+  } catch (e) {
+    return e.name === 'RangeError';
+  }
+  return false;
+}
+
+Using <code>locales</code></pre>
+
+<h3 id="Usando_locales">Usando <code>locales</code></h3>
+
+<p>Este ejemplo muestra algunas de las variaciones en los formatos de configuración regional de las fechas. Para poder obtener el formato del idioma usado en la interfaz de usuario de su aplicación, asegúrese de especificar el idioma (y posiblemente algunos idiomas alternativos) usando el argumento <code>locales</code>:</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Los formatos de abajo asumen la zona horaria local de la configuración regional;
+// America/Los_Angeles para US
+
+// El inglés de USA hace uso de orden mes-día-año
+console.log(date.toLocaleDateString('en-US'));
+// → "12/19/2012"
+
+// El inglés británico hace uso del orden día-mes-año
+console.log(date.toLocaleDateString('en-GB'));
+// → "20/12/2012"
+
+// El coreano hace uso del orden año-mes-día
+console.log(date.toLocaleDateString('ko-KR'));
+// → "2012. 12. 20."
+
+// Evento para persa. Es difícil convertir manualmente la fecha a Solar Hijri
+console.log(date.toLocaleDateString('fa-IR'));
+// → "۱۳۹۱/۹/۳۰"
+
+// El árave en la mayoría de paises arabehablantes hace uso de los dígitos árabes
+console.log(date.toLocaleDateString('ar-EG'));
+// → "<span dir="rtl">٢٠‏/١٢‏/٢٠١٢</span>"
+
+// Para el japonés, las aplicaciones quieren poder usar el calendario japonés,
+// donde 2012 era el año 24 de la era Heisei
+console.log(date.toLocaleDateString('ja-JP-u-ca-japanese'));
+// → "24/12/20"
+
+// Cuando solicite un idioma que no esté soportado, por ejemplo el balinés,
+// incluya un idioma alternativo, en este caso el indonesio
+console.log(date.toLocaleDateString(['ban', 'id']));
+// → "20/12/2012"
+</pre>
+
+<h3 id="Usando_options">Usando <code>options</code></h3>
+
+<p>Los resultados aportados por <code>toLocaleDateString()</code> pueden ser personalizados usando el argumento <code>options</code>:</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// Solicita el día de la semana junto a una fecha larga
+var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+console.log(date.toLocaleDateString('de-DE', options));
+// → "Donnerstag, 20. Dezember 2012"
+
+// Una aplicación puede querer usar UTC y hacer que sea visible
+options.timeZone = 'UTC';
+options.timeZoneName = 'short';
+console.log(date.toLocaleDateString('en-US', options));
+// → "Thursday, December 20, 2012, GMT"
+</pre>
+
+<h2 id="Performance">Performance</h2>
+
+<p>Cuando se formatea números largos de fechas, es mejor crear un objeto {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} y usar la función aportada por esta propiedad {{jsxref("DateTimeFormat.prototype.format", "format")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.tolocaledatestring', 'Date.prototype.toLocaleDateString')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocaledatestring', 'Date.prototype.toLocaleDateString')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada desde una estructura de datos. Si usted desea contribuir a los datos, por favor compruebe <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de extracción (pull request).</p>
+
+<p>{{Compat("javascript.builtins.Date.toLocaleDateString")}}</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
+ <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
+ <li>{{jsxref("Date.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/tolocalestring/index.html b/files/es/web/javascript/reference/global_objects/date/tolocalestring/index.html
new file mode 100644
index 0000000000..00ff28b732
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/tolocalestring/index.html
@@ -0,0 +1,164 @@
+---
+title: Date.prototype.toLocaleString()
+slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleString
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toLocaleString()</code></strong> devuelve un cadena con la representación al idioma de la fecha especificada. <span class="tlid-translation translation" lang="es"><span title="">Los nuevos argumentos </span></span> <code>locales</code> <span class="tlid-translation translation" lang="es"><span title="">y </span></span> <code>options</code> <span class="tlid-translation translation" lang="es"><span title=""> permiten a las aplicaciones especificar el idioma cuyas convenciones de formato deben usarse y personalizar el comportamiento de la función</span></span>. <span class="tlid-translation translation" lang="es"><span title="">En implementaciones anteriores, ignoran los argumentos de las configuraciones </span></span><code>locales</code><span class="tlid-translation translation" lang="es"><span title=""> y  </span></span><code>options</code> <span class="tlid-translation translation" lang="es"><span title=""> </span></span><span class="tlid-translation translation" lang="es"><span title="">, la configuración regional utilizada y la forma de la cadena devuelta dependen completamente de la implementación</span></span> .</p>
+
+<div>{{EmbedInteractiveExample("pages/js/date-tolocalestring.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><var>dateObj</var>.toLocaleString([<var>locales</var>[, <var>options</var>]])</pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<p>Los argumentos <code>locales</code> y de <code>options</code>  personalizan el comportamiento de la función y permiten que las aplicaciones especifiquen el lenguaje cuyas convenciones de formato deben ser utilizadas. En las implementaciones, que ignoran los argumentos, <code>locales</code> y <code>options</code>, el locale utilizado y la forma de la cadena devuelta dependen totalmente de la implementación.</p>
+
+<p>Vea el  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat">constructor</a> de <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat"><code>Intl.DateTimeFormat()</code> </a> para detalles en esos parametros y como se usan.</p>
+
+<p>El valor por defecto para cada componente <code>date-time</code> es  {{jsxref("undefined")}}, pero si las propiedades <code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code> son todas {{jsxref("undefined")}}, entonces <code>year</code>, <code>month</code>, y <code>day</code> son asumidas como <code>"numeric"</code>.</p>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>A string representing the given date according to language-specific conventions.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_toLocaleString">Using <code>toLocaleString()</code></h3>
+
+<p>In basic use without specifying a locale, a formatted string in the default locale and with default options is returned.</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
+
+// toLocaleString() without arguments depends on the implementation,
+// the default locale, and the default time zone
+console.log(date.toLocaleString());
+// → "12/11/2012, 7:00:00 PM" if run in en-US locale with time zone America/Los_Angeles
+</pre>
+
+<h3 id="Checking_for_support_for_locales_and_options_arguments">Checking for support for <code>locales</code> and <code>options</code> arguments</h3>
+
+<p>The <code>locales</code> and <code>options</code> arguments are not supported in all browsers yet. To check whether an implementation supports them already, you can use the requirement that illegal language tags are rejected with a {{jsxref("RangeError")}} exception:</p>
+
+<pre class="brush: js">function toLocaleStringSupportsLocales() {
+  try {
+    new Date().toLocaleString('i');
+  } catch (e) {
+    return e instanceof RangeError;
+  }
+  return false;
+}
+</pre>
+
+<h3 id="Using_locales">Using <code>locales</code></h3>
+
+<p>This example shows some of the variations in localized date and time formats. In order to get the format of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the <code>locales</code> argument:</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// formats below assume the local time zone of the locale;
+// America/Los_Angeles for the US
+
+// US English uses month-day-year order and 12-hour time with AM/PM
+console.log(date.toLocaleString('en-US'));
+// → "12/19/2012, 7:00:00 PM"
+
+// British English uses day-month-year order and 24-hour time without AM/PM
+console.log(date.toLocaleString('en-GB'));
+// → "20/12/2012 03:00:00"
+
+// Korean uses year-month-day order and 12-hour time with AM/PM
+console.log(date.toLocaleString('ko-KR'));
+// → "2012. 12. 20. 오후 12:00:00"
+
+// Arabic in most Arabic speaking countries uses real Arabic digits
+console.log(date.toLocaleString('ar-EG'));
+// → "<span dir="rtl">٢٠‏/١٢‏/٢٠١٢ ٥:٠٠:٠٠ ص</span>"
+
+// for Japanese, applications may want to use the Japanese calendar,
+// where 2012 was the year 24 of the Heisei era
+console.log(date.toLocaleString('ja-JP-u-ca-japanese'));
+// → "24/12/20 12:00:00"
+
+// when requesting a language that may not be supported, such as
+// Balinese, include a fallback language, in this case Indonesian
+console.log(date.toLocaleString(['ban', 'id']));
+// → "20/12/2012 11.00.00"
+</pre>
+
+<h3 id="Using_options">Using <code>options</code></h3>
+
+<p>The results provided by <code>toLocaleString()</code> can be customized using the <code>options</code> argument:</p>
+
+<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// request a weekday along with a long date
+var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+console.log(date.toLocaleString('de-DE', options));
+// → "Donnerstag, 20. Dezember 2012"
+
+// an application may want to use UTC and make that visible
+options.timeZone = 'UTC';
+options.timeZoneName = 'short';
+console.log(date.toLocaleString('en-US', options));
+// → "Thursday, December 20, 2012, GMT"
+
+// sometimes even the US needs 24-hour time
+console.log(date.toLocaleString('en-US', { hour12: false }));
+// → "12/19/2012, 19:00:00"
+</pre>
+
+<h3 id="Avoid_comparing_formatted_date_values_to_static_values">Avoid comparing formatted date values to static values</h3>
+
+<p>Most of the time, the formatting returned by <code>toLocaleString()</code> is consistent. However, this might change in the future and isn't guaranteed for all languages — output variations are by design and allowed by the specification. Most notably, the IE and Edge browsers insert bidirectional control characters around dates, so the output text will flow properly when concatenated with other text.</p>
+
+<p>For this reason you cannot expect to be able to compare the results of <code>toLocaleString()</code> to a static value:</p>
+
+<pre class="brush: js; example-bad">"1/1/2019, 01:00:00" === new Date("2019-01-01T01:00:00Z").toLocaleString("en-US");
+// true in Firefox and others
+// false in IE and Edge</pre>
+
+<div class="blockIndicator note">
+<p><strong>Note</strong>: See also this <a href="https://stackoverflow.com/questions/25574963/ies-tolocalestring-has-strange-characters-in-results">StackOverflow thread</a> for more details and examples.</p>
+</div>
+
+<h2 id="Performance">Performance</h2>
+
+<p>When formatting large numbers of dates, it is better to create an {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} object and use the function provided by its {{jsxref("DateTimeFormat.prototype.format", "format")}} property.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleString')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocalestring', 'Date.prototype.toLocaleString')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Date.toLocaleString")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
+ <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
+ <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
+ <li>{{jsxref("Date.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/tolocaletimestring/index.html b/files/es/web/javascript/reference/global_objects/date/tolocaletimestring/index.html
new file mode 100644
index 0000000000..0e06f10c08
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/tolocaletimestring/index.html
@@ -0,0 +1,153 @@
+---
+title: Date.prototype.toLocaleTimeString()
+slug: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString
+tags:
+  - Date
+  - Fecha
+  - Internacionalizacion
+  - JavaScript
+  - Method
+  - Prototype
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleTimeString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toLocaleTimeString()</code></strong> devuelve una cadena con una representación de la parte del tiempo de esta fecha sensible al idioma. Los nuevos argumentos <code>locales</code> y <code>options</code> le permiten a la aplicación especificar el idioma cuyas convenciones de formato deben usarse y personalizan el comportamiento de esta función. En implementaciones antiguas que ignoran los argumentos <code>locales</code> y <code>options</code> la localidad usada y la forma de la cadena devuelta son completamente dependientes de la implementación.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/date-tolocaletimestring.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.toLocaleTimeString([<var>locales[, </var><var>options</var>]])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Los argumentos <code>locales</code> y <code>options</code> personalizan el comportamiento de la función y le permiten a la aplicación especificar el idioma cuyas convenciones de formato deben usarse. En las implementaciones que ignoran los argumentos <code>locales</code> y <code>options</code>, la localidad y la forma de la cadena devuelta son dependientes por completo de la implementación.</p>
+
+<p>Vea el <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat">constructor <code>Intl.DateTimeFormat()</code></a> para los detalles de estos parámetros y sobre cómo usarlos.</p>
+
+<p>El valor predeterminado de cada componente de fecha-hora es {{jsxref("undefined")}}, pero si las propiedades <code>weekday</code>, <code>year</code>, <code>month</code> y <code>day</code> son todas {{jsxref("undefined")}}, entonces <code>year</code>, <code>month</code> y <code>day</code> se asumen como <code>"numeric"</code>.</p>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena representando la porción de tiempo de la instancia {{jsxref("Global_Objects/Date", "Date")}} dada, conforme a las convenciones específicas del idioma.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toLocaleTimeString">Usando <code>toLocaleTimeString()</code></h3>
+
+<p>En el uso básico sin especificar una localidad, una cadena con formato en la localidad y opciones predeterminadas es devuelta.</p>
+
+<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
+
+// toLocaleTimeString() sin argumentos depende de la implementación,
+// la localidad y la zona horaria predeterminadas
+console.log(date.toLocaleTimeString());
+// → "21:00:00" si se ejecuta en la localidad es-MX con la zona horaria America/Mexico_City
+</pre>
+
+<h3 id="Verificando_el_soporte_de_argumentos_locales_y_options">Verificando el soporte de argumentos <code>locales</code> y <code>options</code></h3>
+
+<p>Los argumentos <code>locales</code> y <code>options</code> aún no están soportados en todos los navegadores. Para verificar si alguna implementación ya los soporta, puede usar el requerimiento de que etiquetas inválidas son rechazadas con una excepción {{jsxref("RangeError")}}:</p>
+
+<pre class="brush: js">function toLocaleTimeStringSoportaLocales() {
+  try {
+    new Date().toLocaleTimeString('i');
+  } catch (e) {
+    return e​.name === 'RangeError';
+  }
+  return false;
+}
+</pre>
+
+<h3 id="Usando_locales">Usando <code>locales</code></h3>
+
+<p>Este ejemplo muestra una de las variaciones en formatos de tiempo localizados. Para obtener el formato del idioma usado en la interfaz de su aplicación, asegúrese de especificar ese idioma (y posiblemente algunos de <em>fallback</em>) usando el argumento <code>locales</code>:</p>
+
+<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// los siguientes formatos asumen la zona horaria de la localidad;
+// America/Los_Angeles para los EEUU
+
+// El inglés americano usa formato de 12 horas con AM/PM
+console.log(fecha.toLocaleTimeString('en-US'));
+// → "7:00:00 PM"
+
+// El inglés británico usa formato de 24 horas sin AM/PM
+console.log(date.toLocaleTimeString('en-GB'));
+// → "03:00:00"
+
+// El koreano usa formato de 12 horas con AM/PM
+console.log(date.toLocaleTimeString('ko-KR'));
+// → "오후 12:00:00"
+
+// En muchos países donde hablan árabe se usan dígitos árabes
+console.log(date.toLocaleTimeString('ar-EG'));
+// → "<span dir="rtl">٧:٠٠:٠٠ م</span>"
+
+// cuando se pide un idioma que puede no estar disponible, como
+// balinés, incluya un idioma de respaldo, como en este caso, indonesio
+console.log(date.toLocaleTimeString(['ban', 'id']));
+// → "11.00.00"
+</pre>
+
+<h3 id="Usando_options">Usando <code>options</code></h3>
+
+<p>Los resultados provistos por <code>toLocaleTimeString()</code> pueden ser personalizados usando el argumento <code>options</code>:</p>
+
+<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
+
+// una aplicación puede querer usar UTC y visibilizarlo:
+var options = { timeZone: 'UTC', timeZoneName: 'short' };
+console.log(date.toLocaleTimeString('en-US', options));
+// → "3:00:00 AM GMT"
+
+// algunas veces incluso en EEUU necesitan el tiempo en 24 horas
+console.log(date.toLocaleTimeString('en-US', { hour12: false }));
+// → "19:00:00"
+
+// mostrar únicamente horas y minutos, use options con la localidad predeterminada - usar un arreglo vacío
+console.log(date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }));
+// → "20:01"
+
+</pre>
+
+<h2 id="Rendimiento">Rendimiento</h2>
+
+<p>Cuando se da formato a un gran número de fechas, es mejor crear un objeto {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} y usar su método {{jsxref("DateTimeFormat.prototype.format", "format")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Date.toLocaleTimeString")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
+ <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
+ <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
+ <li>{{jsxref("Date.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/toutcstring/index.html b/files/es/web/javascript/reference/global_objects/date/toutcstring/index.html
new file mode 100644
index 0000000000..db7c4af97f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/toutcstring/index.html
@@ -0,0 +1,106 @@
+---
+title: Date.prototype.toUTCString()
+slug: Web/JavaScript/Reference/Global_Objects/Date/toUTCString
+tags:
+  - Date
+  - JavaScript
+  - Method
+  - Prototype
+  - Reference
+  - UTC
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/toUTCString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/toUTCString
+---
+<div>{{JSRef}}</div>
+
+<p><code>El método</code><strong><code>toUTCString()</code></strong> convierte una fecha en una cadena, utilizando <span class="tlid-translation translation" lang="es"><span title="">la zona horaria UTC.</span></span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/date-toutcstring.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>dateObj</var>.toUTCString()</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una cadena que representa la fecha dada usando la zona horaria UTC</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El valor devuelto por <code>toUTCString()</code> es una cadena con la forma</p>
+
+<p><code>Www, dd Mmm yyyy hh:mm:ss GMT</code></p>
+
+<p>donde:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td>Www</td>
+   <td>Día de la semana, como tres letras (ej. Sun, Mon, ...)</td>
+  </tr>
+  <tr>
+   <td>dd</td>
+   <td>Día del mes, como dos dígitos, con cero a la izquierda si es necesario.</td>
+  </tr>
+  <tr>
+   <td>Mmm</td>
+   <td>Mes, como tres letras (ej. Jan, Feb, ...)</td>
+  </tr>
+  <tr>
+   <td>yyyy</td>
+   <td>Año, como cuatro o más dígitos con cero a la izquierda si es necesario.</td>
+  </tr>
+  <tr>
+   <td>hh</td>
+   <td>Hora, como dos dígitos con cero a la izquierda si es necesario.</td>
+  </tr>
+  <tr>
+   <td>mm</td>
+   <td>Minutos, como dos dígitos con cero a la izquierda si es necesario.</td>
+  </tr>
+  <tr>
+   <td>ss</td>
+   <td>Segundos, como dos dígitos con cero a la izquierda si es necesario.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Antes de ECMAScript 2018, el formato del valor devuelto variaba según la plataforma. El valor devuelto más comun era un sello de fecha con formato RFC-1123, que es una versión ligeramente actualizada de los sellos de fecha RFC-822.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toUTCString">Usando <code>toUTCString()</code></h3>
+
+<pre class="brush: js">var today = new Date('Wed, 14 Jun 2017 00:00:00 PDT');
+var UTCstring = today.toUTCString(); // Wed, 14 Jun 2017 07:00:00 GMT
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-date.prototype.toutcstring', 'Date.prototype.toUTCString')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Date.toUTCString")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("Date.prototype.toDateString()")}}</li>
+ <li>{{jsxref("Date.prototype.toISOString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/date/utc/index.html b/files/es/web/javascript/reference/global_objects/date/utc/index.html
new file mode 100644
index 0000000000..9af6ae654b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/date/utc/index.html
@@ -0,0 +1,79 @@
+---
+title: Date.UTC()
+slug: Web/JavaScript/Reference/Global_Objects/Date/UTC
+tags:
+  - Date
+  - JavaScript
+  - Method
+  - Reference
+translation_of: Web/JavaScript/Reference/Global_Objects/Date/UTC
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Date/UTC
+---
+<div>
+ {{JSRef("Objetos_globales", "Date")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Accepts the same parameters as the longest form of the constructor, and returns the number of milliseconds in a <code>Date</code> object since January 1, 1970, 00:00:00, universal time.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox">Date.UTC(<em>año</em>,<em>mes</em>[, <em>dia</em>[, <em>hora</em>[, <em>minutos</em>[, <em>segundos</em>, <em>milisegundos</em>]]]])</pre>
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+<dl>
+ <dt>
+  <code>año</code></dt>
+ <dd>
+  Un año mayor de 1900.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>mes</code></dt>
+ <dd>
+  Un entero entre 0 y 11 que representa al mes.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>dia</code></dt>
+ <dd>
+  Un entero entre 1 y 31 que representa al día del mes.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>hora</code></dt>
+ <dd>
+  Un entero entre 0 y 23 que representa la hora.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>minutos</code></dt>
+ <dd>
+  Un entero entre 0 y 59 que representa los minutos.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>segundos</code></dt>
+ <dd>
+  Un entero entre 0 y 59 que representa los segundos.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>milisegundos</code></dt>
+ <dd>
+  Un entero entre 0 y 999 que representa los milisegundos.</dd>
+</dl>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p><code>UTC</code> toma los parámetros de la fecha delimitados por punto y comay devuelve el número de milisegundos entre las 00:00:00 del 1 de enero de 1970 (hora universal) y la hora que especifique.</p>
+<p>Debería especificar los dígitos del año completo; por ejemplo, 1998. Si se especifica un año entre 0 y 99, el método convierte dicho año en uno del siglo XX (1900 + año); por ejemplo, si especifica 95, se usará el año 1995.</p>
+<p>El método <code>UTC</code> difiere del constructor de <code>Date</code> de dos modos.</p>
+<ul>
+ <li><code>Date.UTC</code> utiliza la fecha y hora universal en vez de la local.</li>
+ <li><code>Date.UTC</code> devuelve la fecha y hora como un número en vez de crear un objeto <code>Date</code>.</li>
+</ul>
+<p>Si especifica un parámetro fuera del rango esperado, el método <code>UTC</code> modifica los otros parámetros para tener en cuenta su número. Por ejemplo, si usa 15 para el mes, el año será incrementado en 1 (año + 1), y 3 se usará para el mes.</p>
+<p>Debido a que <code>UTC</code> es un método estático de <code>Date</code>, utilícelo siempre como <code>Date.UTC()</code>, en vez de como un método del objeto <code>Date</code> que usted cree.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_Date.UTC" name="Ejemplo:_Usando_Date.UTC">Ejemplo: Usando <code>Date.UTC</code></h3>
+<p>La sentencia siguiente crea un objeto <code>Date</code> usando GMT en vez de la hora local:</p>
+<pre class="brush: js">fechaGmt = new Date(Date.UTC(96, 11, 1, 0, 0, 0));
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("Date.parse()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/decodeuri/index.html b/files/es/web/javascript/reference/global_objects/decodeuri/index.html
new file mode 100644
index 0000000000..15fc980035
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/decodeuri/index.html
@@ -0,0 +1,39 @@
+---
+title: decodeURI()
+slug: Web/JavaScript/Reference/Global_Objects/decodeURI
+tags:
+  - JavaScript
+  - URI
+translation_of: Web/JavaScript/Reference/Global_Objects/decodeURI
+original_slug: Web/JavaScript/Referencia/Objetos_globales/decodeURI
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>Decodifica un Identificador de Recurso Uniforme (Uniform Resource Identifier, URI) previamente creado por {{jsxref("encodeURI")}} o por una rutina similar.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<p><code>decodeURI(<em>encodedURI</em>) </code></p>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>encodedURI</code></dt>
+ <dd>Un completo, Identificador de Recurso Uniforme.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Sustituye a cada secuencia de escape codificado en URI con el carácter que representa.</p>
+
+<p>No decodifica secuencias de escape que no se puedan haber introducido por {{jsxref("encodeURI")}}.</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("decodeURIComponent")}}</li>
+ <li>{{jsxref("encodeURI")}}</li>
+ <li>{{jsxref( "encodeURIComponent")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/decodeuricomponent/index.html b/files/es/web/javascript/reference/global_objects/decodeuricomponent/index.html
new file mode 100644
index 0000000000..6606b6c3a9
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/decodeuricomponent/index.html
@@ -0,0 +1,43 @@
+---
+title: decodeURIComponent
+slug: Web/JavaScript/Reference/Global_Objects/decodeURIComponent
+tags:
+  - JavaScript
+  - JavaScript Reference
+  - URI
+translation_of: Web/JavaScript/Reference/Global_Objects/decodeURIComponent
+original_slug: Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>Decodifica un Identificador de Recurso Uniforme (Uniform Resource Identifier, URI) previamente creado por {{jsxref("encodeURIComponent")}} o por una rutina similar.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p><code>decodeURIComponent(<em>encodedURI</em>) </code></p>
+
+<h2 id="Parameters" name="Parameters">Parámetros</h2>
+
+<dl>
+ <dt><code>encodedURI</code></dt>
+ <dd>Un Identificador de Recurso Uniforme codificado.</dd>
+ <dt> </dt>
+</dl>
+
+<h2 id="Return value" name="Return value">Valor retornado</h2>
+
+<p>Retorna una nueva cadena representando la version decodificada del componente URI dado</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Sustituye a cada secuencia de escape codificado en URI con el carácter que representa.</p>
+
+<h2 id="See_Also" name="See_Also">Ver También</h2>
+
+<ul>
+ <li>{{jsxref("decodeURI")}}</li>
+ <li>{{jsxref("encodeURI")}}</li>
+ <li>{{jsxref("encodeURIComponent")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/encodeuri/index.html b/files/es/web/javascript/reference/global_objects/encodeuri/index.html
new file mode 100644
index 0000000000..55bb76c4da
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/encodeuri/index.html
@@ -0,0 +1,62 @@
+---
+title: encodeURI
+slug: Web/JavaScript/Reference/Global_Objects/encodeURI
+tags:
+  - JavaScript
+  - URI
+translation_of: Web/JavaScript/Reference/Global_Objects/encodeURI
+original_slug: Web/JavaScript/Referencia/Objetos_globales/encodeURI
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>Codifica un Identificador de Recurso Uniforme (Uniform Resource Identifier, URI) reemplazando cada instancia de ciertos carácteres por uno, dos o tres secuencias de escape representando el carácter codificado en UTF-8.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<p><code>encodeURI(<em>URI</em>) </code></p>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>URI</code></dt>
+ <dd>Un Identificador de Recurso Uniforme codificado.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Se asume que el URI es un URI completo, a fin de no codificar caracteres reservados que tienen un significado especial en la URI.</p>
+
+<p><code>encodeURI </code>reemplaza todos los caracteres excepto los siguientes con las secuencias de escape UTF-8:</p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <td class="header">Tipo</td>
+   <td class="header">Incluye</td>
+  </tr>
+  <tr>
+   <td>Caracteres reservados</td>
+   <td><code>; , / ? : @ &amp; = + $</code></td>
+  </tr>
+  <tr>
+   <td>Caracteres No escape</td>
+   <td>Alfabéticos, dígitos decimales, <code>- _ . ! ~ * ' ( )</code></td>
+  </tr>
+  <tr>
+   <td>Almohadilla</td>
+   <td><code>#</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Tenga en cuenta que encodeURI por sí sola no puede formar solicitudes correctas HTTP GET y POST, como por XMLHTTPRequests, porque "&amp;", "+", y "=" no están codificados, los cuales son tratados como caracteres especiales en las solicitudes GET y POST. <code><a href="/es/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent" title="es/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent">encodeURIComponent</a></code>, sin embargo, codifica estos caracteres. Lo más probable es que estos comportamientos no sean compatibles en los navegadores Web.</p>
+
+<h2 id="See_also" name="See_also">Ver También</h2>
+
+<ul>
+ <li>{{jsxref("decodeURI")}}</li>
+ <li>{{jsxref("encodeURIComponent")}}</li>
+ <li>{{jsxref("decodeURIComponent")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/encodeuricomponent/index.html b/files/es/web/javascript/reference/global_objects/encodeuricomponent/index.html
new file mode 100644
index 0000000000..e1e70a7747
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/encodeuricomponent/index.html
@@ -0,0 +1,162 @@
+---
+title: encodeURIComponent
+slug: Web/JavaScript/Reference/Global_Objects/encodeURIComponent
+tags:
+  - JavaScript
+  - URI
+translation_of: Web/JavaScript/Reference/Global_Objects/encodeURIComponent
+original_slug: Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <strong>encodeURIComponent()</strong> codifica un componente URI (Identificador Uniforme de Recursos) al reemplazar cada instancia de ciertos caracteres por una, dos, tres o cuatro secuencias de escape que representan la codificación UTF-8 del carácter (solo serán cuatro secuencias de escape para caracteres compuestos por dos carácteres "sustitutos").</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox">encodeURIComponent(str);</pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>str</code></dt>
+ <dd>Cadena. Un componente de un URI.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p><code>encodeURIComponent</code> escapes all characters except the following: alphabetic, decimal digits, <code>- _ . ! ~ * ' ( )</code></p>
+
+<p>Note that an {{jsxref("Objetos_globales/URIError", "URIError")}} will be thrown if one attempts to encode a surrogate which is not part of a high-low pair, e.g.,</p>
+
+<pre class="brush: js">// high-low pair ok
+alert(encodeURIComponent('\uD800\uDFFF'));
+
+// lone high surrogate throws "URIError: malformed URI sequence"
+alert(encodeURIComponent('\uD800'));
+
+// lone low surrogate throws "URIError: malformed URI sequence"
+alert(encodeURIComponent('\uDFFF'));
+</pre>
+
+<p>To avoid unexpected requests to the server, you should call <code>encodeURIComponent</code> on any user-entered parameters that will be passed as part of a URI. For example, a user could type "<code>Thyme &amp;time=again</code>" for a variable <code>comment</code>. Not using <code>encodeURIComponent</code> on this variable will give <code>comment=Thyme%20&amp;time=again</code>. Note that the ampersand and the equal sign mark a new key and value pair. So instead of having a POST <code>comment</code> key equal to "<code>Thyme &amp;time=again</code>", you have two POST keys, one equal to "<code>Thyme </code>" and another (<code>time</code>) equal to <code>again</code>.</p>
+
+<p>For <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#application/x-www-form-urlencoded-encoding-algorithm"><code>application/x-www-form-urlencoded</code></a> (POST), spaces are to be replaced by '+', so one may wish to follow a <code>encodeURIComponent</code> replacement with an additional replacement of "%20" with "+".</p>
+
+<p>To be more stringent in adhering to <a class="external" href="http://tools.ietf.org/html/rfc3986">RFC 3986</a> (which reserves !, ', (, ), and *), even though these characters have no formalized URI delimiting uses, the following can be safely used:</p>
+
+<pre class="brush: js">function fixedEncodeURIComponent (str) {
+  return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
+}
+</pre>
+
+<h2 id="See_also" name="See_also">Examples</h2>
+
+<p>The following example provides the special encoding required within UTF-8 <code>Content-Disposition</code> and <code>Link</code> server response header parameters (e.g., UTF-8 filenames):</p>
+
+<pre class="brush: js">var fileName = 'my file(2).txt';
+var header = "Content-Disposition: attachment; filename*=UTF-8''" + encodeRFC5987ValueChars(fileName);
+
+console.log(header);
+// logs "Content-Disposition: attachment; filename*=UTF-8''my%20file%282%29.txt"
+
+
+function encodeRFC5987ValueChars (str) {
+    return encodeURIComponent(str).
+        // Note that although RFC3986 reserves "!", RFC5987 does not,
+        // so we do not need to escape it
+        replace(/['()]/g, escape). // i.e., %27 %28 %29
+        replace(/\*/g, '%2A').
+            // The following are not required for percent-encoding per RFC5987,
+            //  so we can allow for a little better readability over the wire: |`^
+            replace(/%(?:7C|60|5E)/g, unescape);
+}
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 3rd Edition.</td>
+   <td>Standard</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.1.3.4', 'encodeURIComponent')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-encodeuricomponent-uricomponent', 'encodeURIComponent')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_Also" name="See_Also">See also</h2>
+
+<ul>
+ <li>{{jsxref("decodeURI")}}</li>
+ <li>{{jsxref("encodeURI")}}</li>
+ <li>{{jsxref("decodeURIComponent")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/error/index.html b/files/es/web/javascript/reference/global_objects/error/error/index.html
new file mode 100644
index 0000000000..c50daa98dc
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/error/index.html
@@ -0,0 +1,70 @@
+---
+title: Constructor Error()
+slug: Web/JavaScript/Reference/Global_Objects/Error/Error
+tags:
+  - Constructor
+  - JavaScript
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Error/Error
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/constructor_Error
+---
+<div>{{JSRef}}</div>
+
+<p><span class="seoSummary">El constructor <strong><code>Error</code></strong> crea un objeto <code>Error</code>.</span></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">new Error([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>message</var></code>{{Optional_Inline}}</dt>
+ <dd>Una descripción del error legible para los humanos.</dd>
+ <dt><code><var>fileName</var></code> {{Optional_Inline}}{{Non-standard_inline}}</dt>
+ <dd>El valor de la propiedad <code><var>fileName</var></code> en el objeto <code>Error</code> creado. De manera predeterminada, el nombre del archivo que contiene el código que llamó al constructor <code>Error()</code>.</dd>
+ <dt><code><var>lineNumber</var></code> {{Optional_Inline}}{{Non-standard_inline}}</dt>
+ <dd>El valor de la propiedad <code><var>lineNumber</var></code> en el objeto <code>Error</code> creado. De manera predeterminada, el número de línea que contiene la invocación del constructor <code>Error()</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Llamada_a_función_o_construcción_new">Llamada a función o construcción <code>new</code></h3>
+
+<p>Cuando se usa <code>Error</code> como una función, sin {{JSxRef("Operators/new", "new")}}, devolverá un objeto <code>Error</code>. Por lo tanto, una simple llamada a <code>Error</code> producirá el mismo resultado que la construcción de un objeto <code>Error</code> mediante la palabra clave <code>new</code>.</p>
+
+<pre class="brush: js; notranslate">// esto...
+const x = Error('¡Fui creado usando una llamada a función!')
+
+    // ...tiene la misma funcionalidad que esta.
+const y = new Error('¡Fui construido con la palabra clave "new"!') </pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-error-constructor', 'Error constructor')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Error.Error")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Sentencias/throw", "throw")}}</li>
+ <li>{{JSxRef("Sentencias/try...catch", "try...catch")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/filename/index.html b/files/es/web/javascript/reference/global_objects/error/filename/index.html
new file mode 100644
index 0000000000..4e904be2ef
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/filename/index.html
@@ -0,0 +1,49 @@
+---
+title: Error.prototype.fileName
+slug: Web/JavaScript/Reference/Global_Objects/Error/fileName
+tags:
+  - JavaScript
+  - No estandar
+  - Propiedad
+  - Prototipo
+translation_of: Web/JavaScript/Reference/Global_Objects/Error/fileName
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/fileName
+---
+<div>{{jsRef}}  {{non-standard_header}}</div>
+
+<p>La propiedad <code><strong>fileName</strong></code> contiene la ruta al archivo que generó este error.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Esta propiedad no estándar contiene la ruta al archivo que generó este error. Si se llama desde un contexto de depuración, devuelve las herramientas de desarrollo de Firefox, por ejemplo, "código de evaluación del depurador".</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usar_fileName">Usar <code>fileName</code></h3>
+
+<pre class="brush: js notranslate">var e = new Error('No se pudo procesar la entrada');
+throw e;
+// e.fileName podría verse como "file:///C:/ejemplo.html"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p><span class="pl-s">No forma parte de ningún estándar.</span></p>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Error.fileName")}}</p>
+</div>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Error.prototype.stack")}}</li>
+ <li>{{jsxref("Error.prototype.columnNumber")}}</li>
+ <li>{{jsxref("Error.prototype.lineNumber")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/index.html b/files/es/web/javascript/reference/global_objects/error/index.html
new file mode 100644
index 0000000000..39ac1ea80c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/index.html
@@ -0,0 +1,220 @@
+---
+title: Error
+slug: Web/JavaScript/Reference/Global_Objects/Error
+tags:
+  - Error
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Global_Objects/Error
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error
+---
+<div>{{JSRef}}</div>
+
+<p>Los objetos <code>Error</code> se lanzan cuando ocurren errores en tiempo de ejecución. También puedes utilizar el objeto <code>Error</code> como objeto base para excepciones definidas por el usuario. Ve más adelante los tipos de errores estándar integrados.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los errores en tiempo de ejecución dan como resultado la creación y lanzamiento de nuevos objetos <code>Error</code>.</p>
+
+<h3 id="Tipos_Error">Tipos <code>Error</code></h3>
+
+<p>Además del constructor genérico <code>Error</code>, hay otros siete constructores de errores en el núcleo de JavaScript. Para conocer las excepciones de lado del cliente, consulta {{JSxRef("../Guide/Control_de_flujo_y_manejo_de_errores", "Declaraciones para el manejo de excepciones", "#Sentencias_de_manejo_de_excepciones", 1)}}.</p>
+
+<dl>
+ <dt>{{JSxRef("EvalError")}}</dt>
+ <dd>Crea una instancia que representa un error que ocurre con respecto a la función global {{JSxRef("eval", "eval()")}}.</dd>
+ <dt>{{JSxRef("InternalError")}} </dt>
+ <dd>Crea una instancia que representa un error que ocurre cuando se produce un error interno en el motor de JavaScript. Por ejemplo: "demasiada recursividad".</dd>
+ <dt>{{JSxRef("RangeError")}}</dt>
+ <dd>Crea una instancia que representa un error que ocurre cuando una variable numérica o parámetro está fuera de su rango válido.</dd>
+ <dt>{{JSxRef("ReferenceError")}}</dt>
+ <dd>Crea una instancia que representa un error que ocurre cuando se quita la referencia a una referencia no válida.</dd>
+ <dt>{{JSxRef("SyntaxError")}}</dt>
+ <dd>Crea una instancia que representa un error de sintaxis.</dd>
+ <dt>{{JSxRef("TypeError")}}</dt>
+ <dd>Crea una instancia que representa un error que ocurre cuando una variable o parámetro no es de un tipo válido.</dd>
+ <dt>{{JSxRef("URIError")}}</dt>
+ <dd>Crea una instancia que representa un error que ocurre cuando {{JSxRef("encodeURI", "encodeURI()")}} o {{JSxRef("decodeURI", "decodeURI()")}} pasan parámetros no válidos.</dd>
+</dl>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{JSxRef("Objetos_globales/Error/Error", "Error()")}}</dt>
+ <dd>Crea un nuevo objeto <code>Error</code>.</dd>
+</dl>
+
+<h2 id="Métodos_estáticos">Métodos estáticos</h2>
+
+<dl>
+ <dt>{{JSxRef("Error.captureStackTrace()")}}</dt>
+ <dd>Una función <strong>V8</strong> no estándar que crea la propiedad {{JSxRef("Error.prototype.stack", "stack")}} en una instancia de <code>Error</code>.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{jsxref("Error.prototype.message")}}</dt>
+ <dd>Mensaje de error.</dd>
+ <dt>{{jsxref("Error.prototype.name")}}</dt>
+ <dd>Nombre del error.</dd>
+ <dt>{{jsxref("Error.prototype.description")}}</dt>
+ <dd>Una propiedad no estándar de Microsoft para la descripción del error. Similar a {{jsxref("Error.prototype.message", "message")}}.</dd>
+ <dt>{{jsxref("Error.prototype.number")}}</dt>
+ <dd>Una propiedad no estándar de Microsoft para un número de error.</dd>
+ <dt>{{jsxref("Error.prototype.fileName")}}</dt>
+ <dd>Una propiedad no estándar de Mozilla para la ruta al archivo que generó este error.</dd>
+ <dt>{{JSxRef("Error.prototype.lineNumber")}}</dt>
+ <dd>Una propiedad no estándar de Mozilla para el número de línea en el archivo que generó este error.</dd>
+ <dt>{{JSxRef("Error.prototype.columnNumber")}}</dt>
+ <dd>Una propiedad no estándar de Mozilla para el número de columna en la línea que generó este error.</dd>
+ <dt>{{JSxRef("Error.prototype.stack")}}</dt>
+ <dd>Una propiedad no estándar de Mozilla para un seguimiento de la pila.</dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt>{{jsxref("Error.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el objeto especificado. Redefine el método {{JSxRef("Object.prototype.toString()")}}.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Lanzar_un_error_genérico">Lanzar un error genérico</h3>
+
+<p>Normalmente, creas un objeto <code>Error</code> con la intención de generarlo utilizando la palabra clave {{JSxRef("Sentencias/throw", "throw")}}. Puedes manejar el error usando la construcción {{JSxRef("Sentencias/try...catch", "try...catch")}}:</p>
+
+<pre class="brush: js; notranslate">try {
+  throw new Error('¡Ups!')
+} catch (e) {
+  console.error(e.name + ': ' + e.message)
+}
+</pre>
+
+<h3 id="Manejar_de_un_error_específico">Manejar de un error específico</h3>
+
+<p>Puede elegir manejar solo tipos de error específicos probando el tipo de error con la propiedad {{JSxRef("Object.prototype.constructor", "constructor")}} del error o, si estás escribiendo para motores JavaScript modernos, la palabra clave {{JSxRef("Operators/instanceof", "instanceof")}}:</p>
+
+<pre class="brush: js; notranslate">try {
+  foo.bar()
+} catch (e) {
+  if (e instanceof EvalError) {
+    console.error(e.name + ': ' + e.message)
+  } else if (e instanceof RangeError) {
+    console.error(e.name + ': ' + e.message)
+  }
+  // ... etc
+}
+</pre>
+
+<h3 id="Tipos_Error_personalizados">Tipos <code>Error</code> personalizados</h3>
+
+<p>Posiblemente desees definir tus propios tipos de error derivados de <code>Error</code> para poder lanzarlo con <code>throw new MyError()</code> y usar <code>instanceof MyError</code> para verificar el tipo de error en el controlador de excepciones.  Esto da como resultado un código de manejo de errores más limpio y consistente. </p>
+
+<p>Consulta <a href="http://stackoverflow.com/questions/1382107/whats-a-good-way-to-extend-error-in-javascript">"¿Cuál es una buena manera de extender <code>Error</code> en JavaScript?"</a> en StackOverflow para una discusión en profundidad.</p>
+
+<h4 id="Clase_Error_personalizado_en_ES6">Clase <code>Error</code> personalizado en ES6</h4>
+
+<div class="blockIndicator warning">
+<p>Las versiones de Babel anteriores a la 7 pueden manejar métodos de clase <code>CustomError</code>, pero solo cuando se declaran con {{JSxRef("Objetos_globales/Object/defineProperty", "Object.defineProperty()")}}. De lo contrario, las versiones antiguas de Babel y otros transpiladores no manejarán correctamente el siguiente código sin <a href="https://github.com/loganfsmyth/babel-plugin-transform-builtin-extend">configuración adicional</a>.</p>
+</div>
+
+<div class="blockIndicator note">
+<p>Algunos navegadores incluyen el constructor <code>CustomError</code> en el seguimiento de la pila cuando se utilizan clases de ES2015.</p>
+</div>
+
+<pre class="brush: js notranslate">class CustomError extends Error {
+  constructor(foo = 'bar', ...params) {
+    // Pasa los argumentos restantes (incluidos los específicos del proveedor) al constructor padre
+    super(...params)
+
+    // Mantiene un seguimiento adecuado de la pila para el lugar donde se lanzó nuestro error (solo disponible en V8)
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, CustomError)
+    }
+
+    this.name = 'CustomError'
+    // Información de depuración personalizada
+    this.foo = foo
+    this.date = new Date()
+  }
+}
+
+try {
+  throw new CustomError('baz', 'bazMessage')
+} catch(e) {
+  console.error(e.name)    // CustomError
+  console.error(e.foo)     // baz
+  console.error(e.message) // bazMessage
+  console.error(e.stack)   // stacktrace
+}</pre>
+
+<h4 id="Objeto_Error_personalizado_ES5">Objeto <code>Error</code> personalizado ES5</h4>
+
+<div class="warning">
+<p><strong>Todos</strong> los navegadores incluyen el constructor <code>CustomError</code> en el seguimiento de la pila cuando se usa una declaración de prototipo.</p>
+</div>
+
+<pre class="brush: js notranslate">function CustomError(foo, message, fileName, lineNumber) {
+  var instance = new Error(message, fileName, lineNumber);
+  instance.name = 'CustomError';
+  instance.foo = foo;
+  Object.setPrototypeOf(instance, Object.getPrototypeOf(this));
+  if (Error.captureStackTrace) {
+    Error.captureStackTrace(instance, CustomError);
+  }
+  return instance;
+}
+
+CustomError.prototype = Object.create(Error.prototype, {
+  constructor: {
+    value: Error,
+    enumerable: false,
+    writable: true,
+    configurable: true
+  }
+});
+
+if (Object.setPrototypeOf){
+  Object.setPrototypeOf(CustomError, Error);
+} else {
+  CustomError.__proto__ = Error;
+}
+
+try {
+  throw new CustomError('baz', 'bazMessage');
+} catch(e){
+  console.error(e.name); // CustomError
+  console.error(e.foo); // baz
+  console.error(e.message); // bazMessage
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-error-objects', 'Error')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Error")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Sentencias/throw", "throw")}}</li>
+ <li>{{JSxRef("Sentencias/try...catch", "try...catch")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/linenumber/index.html b/files/es/web/javascript/reference/global_objects/error/linenumber/index.html
new file mode 100644
index 0000000000..284aad63d2
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/linenumber/index.html
@@ -0,0 +1,102 @@
+---
+title: Error.prototype.lineNumber
+slug: Web/JavaScript/Reference/Global_Objects/Error/lineNumber
+translation_of: Web/JavaScript/Reference/Global_Objects/Error/lineNumber
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/lineNumber
+---
+<div>No es una norma<br>
+Esta característica no es una norma y no está en la lista de normas. No la utilice en sitios de producción que enfrenta la Web: no va a funcionar para todos los usuarios. También puede haber grandes incompatibilidades entre implementaciones y el comportamiento puede cambiar en el futuro.</div>
+
+<div> </div>
+
+<div>La propiedad <strong>lineNumber </strong>contiene el número de linea en el archivo que arrojó el error.</div>
+
+<div> </div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_lineNumber">Utilizando <code>lineNumber</code></h3>
+
+<pre class="brush: js">var e = new Error('No fue posible analizar el dato introducido');
+throw e;
+console.log(e.lineNumber) // 2
+</pre>
+
+<h3 id="Ejemplo_alternativo_utilizando_el_evento_'error'">Ejemplo alternativo utilizando el evento '<code>error'</code></h3>
+
+<pre class="brush: js">window.addEventListener('error', function(e) {
+  console.log(e.lineno); // 5
+});
+var e = new Error('No fue posible analizar el dato introducido');
+throw e;
+</pre>
+
+<p>Esta es una norma soportada por Chrome, Firefox entre otros.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No forma parte de ninguna especificación. No es una norma.</p>
+
+<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
+
+<div>
+<p> </p>
+
+<p>Tabla de compatibilidad</p>
+
+<table class="compat-table" style="line-height: 1.5;">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>Compatible [1]</td>
+   <td>Compatible</td>
+   <td>No compatible</td>
+   <td>No compatible</td>
+   <td>No compatible</td>
+  </tr>
+ </tbody>
+</table>
+
+<p> [1] Objeto error en errores manejados.</p>
+
+<table class="compat-table" style="line-height: 1.5;">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chorme para Android</th>
+   <th>Firefox Móvil (Gecko)</th>
+   <th>IE Móvil</th>
+   <th>Opera Móvil</th>
+   <th>Safari Móvil</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>No compatible</td>
+   <td>No compatible</td>
+   <td>Compatible</td>
+   <td>No compatible</td>
+   <td>No compatible</td>
+   <td>No compatible</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Vea_también">Vea también:</h2>
+
+<ul>
+ <li>{{jsxref("Error.prototype.stack")}} {{non-standard_inline}}</li>
+ <li>{{jsxref("Error.prototype.columnNumber")}} {{non-standard_inline}}</li>
+ <li>{{jsxref("Error.prototype.fileName")}} {{non-standard_inline}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/message/index.html b/files/es/web/javascript/reference/global_objects/error/message/index.html
new file mode 100644
index 0000000000..c153fac015
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/message/index.html
@@ -0,0 +1,115 @@
+---
+title: Error.prototype.message
+slug: Web/JavaScript/Reference/Global_Objects/Error/message
+translation_of: Web/JavaScript/Reference/Global_Objects/Error/message
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/message
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>message</strong></code> es una descripción legible del error.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Esta propiedad contiene una breve descripción del error, si está disponible o ha sido fijado. <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> hace un amplio uso de esta propiedad para las excepciones. Esta porpiedad combinada con la propiedad {{jsxref("Error.prototype.name", "name")}} es usada por el método {{jsxref("Error.prototype.toString()")}} para crear una cadena de texto del objeto Error.</p>
+
+<p>Por defecto, la propiedad <code>message</code> es una cadena vacía, pero se puede especificar un mensaje a través del primer parámetro del {{jsxref("Error", "constructor Error")}}.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Lanzar_un_error_personalizado">Lanzar un error personalizado</h3>
+
+<pre class="brush: js">var e = new Error('No se pudo analizar la entrada');
+// e.message es 'No se pudo analizar la entrada'
+throw e;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.11.4.3', 'Error.prototype.message')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-error.prototype.message', 'Error.prototype.message')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-error.prototype.message', 'Error.prototype.message')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Error.prototype.name")}}</li>
+ <li>{{jsxref("Error.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/name/index.html b/files/es/web/javascript/reference/global_objects/error/name/index.html
new file mode 100644
index 0000000000..d607118d88
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/name/index.html
@@ -0,0 +1,59 @@
+---
+title: Error.prototype.name
+slug: Web/JavaScript/Reference/Global_Objects/Error/name
+tags:
+  - Error
+  - JavaScript
+  - Propiedad
+  - Prototipo
+translation_of: Web/JavaScript/Reference/Global_Objects/Error/name
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/name
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>name</strong></code> representa un nombre para el tipo de error. El valor inicial es "Error".</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>De forma predeterminada, las instancias {{JSxRef("Error")}} reciben el nombre "Error". La propiedad <code>name</code>, además de la propiedad {{JSxRef("Error.prototype.message", "message")}}, la utiliza el método {{JSxRef("Error.prototype.toString()")}} para crear una representación de cadena del error.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Lanzar_un_error_personalizado">Lanzar un error personalizado</h3>
+
+<pre class="brush: js notranslate">var e = new Error('Entrada mal formada'); // e.name es 'Error'
+
+e.name = 'ParseError';
+throw e;
+// e.toString() devolverá 'ParseError: Entrada mal formada'
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-error.prototype.name', 'Error.prototype.name')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Error.name")}}</p>
+</div>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Error.prototype.message")}}</li>
+ <li>{{JSxRef("Error.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/tosource/index.html b/files/es/web/javascript/reference/global_objects/error/tosource/index.html
new file mode 100644
index 0000000000..a469ed1c83
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/tosource/index.html
@@ -0,0 +1,61 @@
+---
+title: Error.prototype.toSource()
+slug: Web/JavaScript/Reference/Global_Objects/Error/toSource
+tags:
+  - JavaScript
+  - No estandar
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Error/toSource
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/toSource
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>El método <code><strong>toSource()</strong></code> devuelve código que podría evaluar el mismo error.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>e</var>.toSource()</pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una cadena que contiene el código fuente del error.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usar_toSource">Usar toSource</h3>
+
+<p>Llamar al método <code>toSource</code> de una instancia {{JSxRef("Error")}} (incluido {{JSxRef("Global_Objects/Error", "NativeErrors", "#Error_types")}}) devolverá una cadena que contiene el código fuente del error. Esta cadena se puede evaluar para crear un objeto (aproximadamente) igual. Naturalmente, la cadena que contiene la fuente sigue la estructura del constructor {{JSxRef("Error")}}. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">(new<em>name</em>(<em>message</em> ,<em>fileName</em>,<em>lineNumber</em>))
+</pre>
+
+<p>donde estos atributos corresponden a las propiedades respectivas de la instancia de <code>error</code>.</p>
+
+<div class="note">
+<p><strong>Nota</strong>: Ten en cuenta que las propiedades utilizadas por el método <code>toSource</code> en la creación de esta cadena son mutables y es posible que no reflejen con precisión la función utilizada para crear una instancia de <code>error</code> o el nombre de archivo o número de línea donde ocurrió un error real.</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No forma parte de ningún estándar.</p>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Error.toSource")}}</p>
+</div>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Error.prototype.fileName")}}</li>
+ <li>{{JSxRef("Error.prototype.lineNumber")}}</li>
+ <li>{{JSxRef("Error.prototype.message")}}</li>
+ <li>{{JSxRef("Error.prototype.name")}}</li>
+ <li>{{jsxref("Object.prototype.toSource()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/error/tostring/index.html b/files/es/web/javascript/reference/global_objects/error/tostring/index.html
new file mode 100644
index 0000000000..0320cfc73c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/error/tostring/index.html
@@ -0,0 +1,99 @@
+---
+title: Error.prototype.toString()
+slug: Web/JavaScript/Reference/Global_Objects/Error/toString
+tags:
+  - JavaScript
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Error/toString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Error/toString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>toString()</strong></code> devuelve una cadena que representa el objeto {{JSxRef("Error")}} especificado.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>e</var>.toString()</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una cadena que representa el objeto {{JSxRef("Error")}} especificado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El objeto {{JSxRef("Error")}} redefine el método {{JSxRef("Object.prototype.toString()")}} heredado por todos los objetos. Su semántica es la siguiente (asumiendo que {{JSxRef("Object")}} y {{JSxRef("String")}} tienen sus valores originales):</p>
+
+<pre class="brush: js notranslate">Error.prototype.toString = function() {
+  'use strict';
+
+  var obj = Object(this);
+  if (obj !== this) {
+    throw new TypeError();
+  }
+
+  var name = this.name;
+  name = (name === undefined) ? 'Error' : String(name);
+
+  var msg = this.message;
+  msg = (msg === undefined) ? '' : String(msg);
+
+  if (name === '') {
+    return msg;
+  }
+  if (msg === '') {
+    return name;
+  }
+
+  return name + ': ' + msg;
+};
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usar_toString">Usar <code>toString()</code></h3>
+
+<pre class="brush: js notranslate">var e = new Error('fatal error');
+console.log(e.toString()); // 'Error: error fatal'
+
+e.name = undefined;
+console.log(e.toString()); // 'Error: error fatal'
+
+e.name = '';
+console.log(e.toString()); // 'error fatal'
+
+e.message = undefined;
+console.log(e.toString()); // ''
+
+e.name = 'hola';
+console.log(e.toString()); // 'hola'
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-error.prototype.tostring', 'Error.prototype.toString')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Error.toString")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Error.prototype.toSource()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/escape/index.html b/files/es/web/javascript/reference/global_objects/escape/index.html
new file mode 100644
index 0000000000..911af6c311
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/escape/index.html
@@ -0,0 +1,92 @@
+---
+title: escape()
+slug: Web/JavaScript/Reference/Global_Objects/escape
+tags:
+  - JavaScript
+  - Obsoleto
+  - escape
+translation_of: Web/JavaScript/Reference/Global_Objects/escape
+original_slug: Web/JavaScript/Referencia/Objetos_globales/escape
+---
+<div class="warning">{{Deprecated_header}} Advertencia <code>escape()</code> no esta estrictamente en desuso("eliminada por los estándares Web"), esta definida en  <a href="https://www.ecma-international.org/ecma-262/9.0/index.html#sec-additional-ecmascript-features-for-web-browsers">Anexo B</a> El estándar ECMA-262 , cuya introducción establece:
+<blockquote>… Todos las características especificas y comportamientos del lenguaje en este anexo tienen mas de una caracterísitca indeseable y en ausencia del legado sera eliminada de esta especificación. …<br>
+… Los programadores no deben usar o suponer la existencia de estas características y/o comportamientos al escribir nuevo código ECMAScript …</blockquote>
+</div>
+
+<div></div>
+
+<p><span class="seoSummary">La función obsoleta <code><strong>escape()</strong></code> crea una nueva cadena de caracteres en los que ciertos caracteres han sido sustituidos por una secuencia hexadecimal de escape.</span></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">escape(str)</pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>str</code></dt>
+ <dd>Cadena a codificar.</dd>
+</dl>
+
+<h3 id="Devuelve">Devuelve</h3>
+
+<p>Una nueva cadena en la que ciertos caracteres han sido sustituidos.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La función <code>escape </code>es una propiedad del <em>objeto global. </em>SLos caracteres especiales son codificados a excepción de: @*_+-./</p>
+
+<p>La forma hexadecimal de los caracteres cuyo valor es 0xFF o menor, es una secuencia de escape de dos digitos: %xx. Para caracteres un valor superior, se usa el fomato de cuatro digitos: %<strong>u</strong>xxxx.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">escape('abc123');     // "abc123"
+escape('äöü');        // "%E4%F6%FC"
+escape('ć');          // "%u0107"
+
+// caracteres especiales
+escape('@*_+-./');    // "@*_+-./"</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-B.2.1', 'escape')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Defined in the (informative) Compatibility Annex B</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-escape-string', 'escape')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-escape-string', 'escape')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.escape")}}</p>
+
+<h2 id="Ver_más">Ver más</h2>
+
+<ul>
+ <li>{{jsxref("encodeURI")}}</li>
+ <li>{{jsxref("encodeURIComponent")}}</li>
+ <li>{{jsxref("unescape")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/eval/index.html b/files/es/web/javascript/reference/global_objects/eval/index.html
new file mode 100644
index 0000000000..81fbff9ca0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/eval/index.html
@@ -0,0 +1,310 @@
+---
+title: eval
+slug: Web/JavaScript/Reference/Global_Objects/eval
+tags:
+  - JavaScript
+  - eval
+translation_of: Web/JavaScript/Reference/Global_Objects/eval
+original_slug: Web/JavaScript/Referencia/Objetos_globales/eval
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>La función <code>eval()</code> evalúa un código JavaScript representado como una cadena de caracteres (string), sin referenciar a un objeto en particular.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: js"><code>eval(<em>cadena</em> de caracteres o string)</code>
+</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>cadena de caracteres (string)</code></dt>
+ <dd>Una cadena de caracteres (string) que representa una expresión, sentencia o secuencia de sentencias en JavaScript. La expresión puede incluir variables y propiedades de objetos existentes.</dd>
+ <dt>
+ <h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Valores retornados o devueltos</h3>
+ </dt>
+</dl>
+
+<p>El valor que resulta de la evaluación del código proporcionado. Si este valor está vacío. {{jsxref("undefined")}} (artículo en inglés) es devuelto.</p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>eval()</code> es una propiedad de la función del objeto global.</p>
+
+<p>El argumento de la función <code>eval</code> es una cadena de caracteres. Si la cadena de caracteres representa una expresión, <code>eval()</code> evalúa la expresión. Si el argumento representa una o más sentencias JavaScript, <code>eval()</code> evalúa las sentencias. No se debe llamar a <code>eval()</code> para evaluar una expresión aritmética; ya que JavaScript evalúa las expresiones aritméticas automáticamente.</p>
+
+<p>Si construye una expresión aritmética como una cadena de caracteres, puede usar <code>eval()</code> para evaluarla más tarde. Por ejemplo, suponga que tiene la variable <code>x</code>. Puede posponer la evaluación de una expresión que involucre a <code>x</code> mediante la asignación del valor de la cadena de caracteres de la expresión, asignando "<code>3 * x + 2</code>" a la variable, y entonces llamar a <code>eval()</code> posteriormente en el script.</p>
+
+<p>Si el argumento de <code>eval()</code> no es una cadena de caracteres, <code>eval()</code> devuelve el argumento sin cambio. En el siguiente ejemplo, el constructor <code>String</code> es especificado, y <code>eval()</code> devuelve un objeto <code>String</code> en lugar de evaluar la cadena de caracteres.</p>
+
+<pre>eval(new String("2 + 2")); // devuelve un objeto String que contiene "2 + 2"
+eval("2 + 2");             // devuelve 4
+</pre>
+
+<p>Puede trabajar sobre esta limitación de una manera genérica utilizando <code>toString()</code>.</p>
+
+<pre>var expresion = new String("2 + 2");
+eval(expresion.toString());
+</pre>
+
+<p>Si utiliza la función <code>eval()</code> <em>indirectamente</em>, invocándola a través de una referencia distinta de <code>eval</code>, a partir de ECMAScript 5, ésta funciona en el ámbito global en lugar de hacerlo en el ámbito local; esto quiere decir, por ejemplo, que las declaraciones de función crean funciones globales, y que el código siendo evaluado no tiene acceso a las variables locales dentro del ámbito en donde está siendo llamada.</p>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">test</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">,</span> y <span class="operator token">=</span> <span class="number token">4</span><span class="punctuation token">;</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="function token">eval</span><span class="punctuation token">(</span><span class="string token">"x + y"</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// Llamada directa, utiliza el ámbito local, el resultado es 6</span>
+  <span class="keyword token">var</span> geval <span class="operator token">=</span> eval<span class="punctuation token">;</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="function token">geval</span><span class="punctuation token">(</span><span class="string token">"x + y"</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Llamada indirecta, utiliza el ámbito global, através de ReferenceError por que `x` es indefinida</span>
+<span class="punctuation token">}</span></code></pre>
+
+<h2 id="No_utilice_eval_innecesariamente">No utilice <code>eval</code> innecesariamente</h2>
+
+<p><code>eval()</code> es una función peligrosa, quel ejecuta el código el cual es pasado con los privilegios de quien llama.  Si ejecuta <code>eval()</code> con una cadena de carcteres que podría ser afectada por un elemento malicioso, podría terminar ejecutando código malicioso dentro de la computadora del usuario con los permisos de su página o extensión web . Más importante aún, una parte del código de terceros podría accesar al ámbito en el cual <code>eval()</code> fue invocada, lo que puede permitir la entrada a posibles ataques de formas a las que el constructor {{jsxref("Global_Objects/Function", "Function")}} (art. en inglés) el cual es similar, no es susceptible.</p>
+
+<p><code>eval()</code> es generalmente también más lenta que otras alternativas desde que se invoca en el intérprte de JS, mientras que otros muchos constructores son optimizados por los motores JS modernos.</p>
+
+<p>Existen alternativas más seguras (y rápidas) que <code>eval() </code>para casos de uso común.</p>
+
+<h3 id="Accediendo_a_propiedades_de_los_miembros">Accediendo a propiedades de los miembros</h3>
+
+<p>No debería utilizar <code>eval()</code> con el fin de convertir nombres de propiedades en propiedades. Observe el siguiente ejemplo en el cual la función <code>getNombreCampo(n)</code> devuelve el nombre del elemento del formulario especificado como una cadena. La primera sentencia asigna el valor de cadena del tercer elemento del formulario a la variable <code>campo</code>. La segunda sentencia utiliza <code>eval</code> para mostrar el valor del elemento del formulario.</p>
+
+<pre>var campo = getNombreCampo(3);
+document.write("El campo llamado ", campo, " tiene un valor de ", eval(campo + ".value"));
+</pre>
+
+<p>Sin embargo, <code>eval()</code> no es necesario en este código. De hecho, su uso aquí no se recomienda. En su lugar, utilice los <a href="/es/Web/JavaScript/Referencia/Operadores/Miembros">operadores de miembro</a> (art. en inglés), que son mucho más rápidos y seguros:</p>
+
+<pre class="brush: js">var campo = getFieldName(3);
+document.write("El campo llamado ", campo, " tiene un valor de ", campo[valor]);
+</pre>
+
+<p>Considere ahora este nuevo ejemplo, en donde la propiedad del objeto a ser accesado no es conocida hasta que el código es ejecutado. Esto puede hacerse con eval:</p>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span> a<span class="punctuation token">:</span> <span class="number token">20</span><span class="punctuation token">,</span> b<span class="punctuation token">:</span> <span class="number token">30</span> <span class="punctuation token">}</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> nombreProp <span class="operator token">=</span> obtenerNombreProp<span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// devuelve "a" o "b"</span>
+
+<span class="function token">eval</span><span class="punctuation token">(</span> <span class="string token">"var resultado = obj."</span> <span class="operator token">+</span> nombreProp <span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Y con el uso de los <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors" title="JavaScript/Reference/Operators/Member_Operators">accesores de propiedades</a> (artículo en inglés), el cual es mucho más rápido y seguro, sería así:</p>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span> a<span class="punctuation token">:</span> <span class="number token">20</span><span class="punctuation token">,</span> b<span class="punctuation token">:</span> <span class="number token">30</span> <span class="punctuation token">}</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> nombreProp <span class="operator token">=</span> obtenerNombreProp<span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// devuelve "a" o "b"</span>
+<span class="keyword token">var</span> resultado <span class="operator token">=</span> obj<span class="punctuation token">[</span> nombreProp <span class="punctuation token">]</span><span class="punctuation token">;</span>  <span class="comment token">//  obj[ "a" ] es el mismo que obj.a</span></code></pre>
+
+<p>Puede incluso utilizar este método para acceder a las propiedades de los descendientes. Utilizando <code>eval()</code> esto sería de la siguiente forma:</p>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span>a<span class="punctuation token">:</span> <span class="punctuation token">{</span>b<span class="punctuation token">:</span> <span class="punctuation token">{</span>c<span class="punctuation token">:</span> <span class="number token">0</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> propPath <span class="operator token">=</span> <span class="function token">getPropPath</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// returns e.g. "a.b.c"</span>
+
+<span class="function token">eval</span><span class="punctuation token">(</span> <span class="string token">"var result = obj."</span> <span class="operator token">+</span> propPath <span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Evitando <code>eval()</code>, esto podría hacerse dividiendo la ruta de propiedad y haciendo un bucle a través de las diferentes propiedades:</p>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">getDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> desc<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">var</span> arr <span class="operator token">=</span> desc<span class="punctuation token">.</span><span class="function token">split</span><span class="punctuation token">(</span><span class="string token">"."</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="keyword token">while</span><span class="punctuation token">(</span>arr<span class="punctuation token">.</span>length<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    obj <span class="operator token">=</span> obj<span class="punctuation token">[</span>arr<span class="punctuation token">.</span><span class="function token">shift</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">return</span> obj<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span>a<span class="punctuation token">:</span> <span class="punctuation token">{</span>b<span class="punctuation token">:</span> <span class="punctuation token">{</span>c<span class="punctuation token">:</span> <span class="number token">0</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> propPath <span class="operator token">=</span> <span class="function token">getPropPath</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// returns e.g. "a.b.c"</span>
+<span class="keyword token">var</span> result <span class="operator token">=</span> <span class="function token">getDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> propPath<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Estableciendo una propiedad que funcione de modo similar:</p>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">setDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> desc<span class="punctuation token">,</span> value<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">var</span> arr <span class="operator token">=</span> desc<span class="punctuation token">.</span><span class="function token">split</span><span class="punctuation token">(</span><span class="string token">"."</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="keyword token">while</span><span class="punctuation token">(</span>arr<span class="punctuation token">.</span>length <span class="operator token">&gt;</span> <span class="number token">1</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    obj <span class="operator token">=</span> obj<span class="punctuation token">[</span>arr<span class="punctuation token">.</span><span class="function token">shift</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  obj<span class="punctuation token">[</span>arr<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">]</span> <span class="operator token">=</span> value<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span>a<span class="punctuation token">:</span> <span class="punctuation token">{</span>b<span class="punctuation token">:</span> <span class="punctuation token">{</span>c<span class="punctuation token">:</span> <span class="number token">0</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> propPath <span class="operator token">=</span> <span class="function token">getPropPath</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// returns e.g. "a.b.c"</span>
+<span class="keyword token">var</span> result <span class="operator token">=</span> <span class="function token">setDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> propPath<span class="punctuation token">,</span> <span class="number token">1</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// test.a.b.c will now be 1</span></code></pre>
+
+<h3 id="Utilice_funciones_en_lugar_de_evaluar_fragmentos_de_código">Utilice funciones en lugar de evaluar fragmentos de código</h3>
+
+<p>JavaScript tiene <a class="external external-icon" href="http://en.wikipedia.org/wiki/First-class_function" title="http://en.wikipedia.org/wiki/First-class_function">funciones de primera clase </a>(artículo en inglés), lo que quiere decir que usted puede pasar funciones como argumentos a otras APIs, almacenarlas en variables y propiedades de objetos, etc. Muchas APIs de DOM están diseñadas con esto en mente, o sea que usted puede (y debería) escribir:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="comment token">// instead of setTimeout(" ... ", 1000) use:</span>
+<span class="function token">setTimeout</span><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="punctuation token">.</span><span class="punctuation token">.</span><span class="punctuation token">.</span> <span class="punctuation token">}</span><span class="punctuation token">,</span> <span class="number token">1000</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+<span class="comment token">// instead of elt.setAttribute("onclick", "...") use:</span>
+elt<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">"click"</span><span class="punctuation token">,</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="punctuation token">.</span><span class="punctuation token">.</span><span class="punctuation token">.</span> <span class="punctuation token">}</span> <span class="punctuation token">,</span> <span class="keyword token">false</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Las <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures" title="JavaScript/Guide/Closures">clausuras o cierres </a>(art. en inglés) son muy útiles como forma de crear funciones parametrizadas sin la concatenación de cadenas de caracteres o strings.</p>
+
+<h3 id="Analizando_JSON_(convirtiendo_cadenas_de_caracteres_(strings)_hacia_objetos_de_JavaScript)">Analizando JSON (convirtiendo cadenas de caracteres (strings) hacia objetos de JavaScript)</h3>
+
+<p>Si la cadena de caracteres que usted esta llamando <code>eval()</code> contiene datos (por ejemplo, un array: <code>"[1, 2, 3]"</code>), en contraposición al código, debería considerar un cambio a <a href="https://developer.mozilla.org/en-US/docs/Glossary/JSON" title="JSON">JSON</a> (art. en inglés), el cual permite a la cadena de caracteres utilizar un subconjunto de sintaxis de JavaScript para representar los datos. Vea también <a href="https://developer.mozilla.org/en-US/docs/Downloading_JSON_and_JavaScript_in_extensions" title="Downloading_JSON_and_JavaScript_in_extensions">Descargando JSON y JavaScript en extensiones</a> (art. en inglés).</p>
+
+<p>Observe, que ya que la sintaxis de JSON es limitada en comparación con la sintaxis de JavaScript, muchas literales válidas de JavaScript no serán analizadas como JSON. Por ejemplo, seguir comas no está permitido en JSON, y los nombres de propiedades (keys) en literales de objeto deben ser entrecomilladas. Asegúrese de utilizar un serializados de JSON para generar cadenas de caracteres que posteriormente sean analizadas como JSON.</p>
+
+<h3 id="Pasar_datos_en_lugar_de_código">Pasar datos en lugar de código</h3>
+
+<p>Por ejemplo, una extensión diseñada para arrastar contenido de páginas web podría tener reglas de arrastre definidas en <a href="https://developer.mozilla.org/en-US/docs/XPath" title="XPath">XPath</a> (art. en inglés) en lugar de código JavaScript.</p>
+
+<h3 id="Ejecutar_código_sin_privilegos_limitados">Ejecutar código sin privilegos limitados</h3>
+
+<p>Si usted debe ejecutar código, considere ejecutarlo con privilegios reducidos. Este consejo aplica principalmente para las extensiones y las aplicaciones XUL, para lo cual puede utilizar <a href="https://developer.mozilla.org/en-US/docs/Components.utils.evalInSandbox" title="Components.utils.evalInSandbox">Components.utils.evalInSandbox</a> (art. en inglés).</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<p>Los siguientes ejemplos muestran el resultado usando <code>document.write</code>. En JavaScript del lado servidor, puede mostrar el mismo resultado llamando a la función <code>write</code> en vez de <code>document.write</code>.</p>
+
+<h3 id="Utlizando_eval">Utlizando <code>eval</code></h3>
+
+<p>En el siguiente código, las dos sentencias que contienen <code>eval</code> devuelven 42. La primera evalúa la cadena "<code>x + y + 1</code>"; la segunda evalúa la cadena "<code>42</code>".</p>
+
+<pre>var x = 2;
+var y = 39;
+var z = "42";
+eval("x + y + 1"); // returns 42
+eval(z);           // returns 42
+</pre>
+
+<h3 id="Utilizando_eval_para_evaluar_una_cadena_de_caracteres_(string)_como_sentencias_de_JavaScript">Utilizando <code>eval</code> para evaluar una cadena de caracteres (string) como sentencias de JavaScript</h3>
+
+<p>El siguiente ejemplo utiliza <code>eval</code> para evaluar una cadena de caracteres <code>str</code>. Esta cadena consiste de sentencias de JavaScript que abren un diálogo <code>Alert</code> y asignan a <code>z</code> un valor de 42 si <code>x</code> es cinco, y asigna 0 a <code>z</code> en caso contrario. Cuando se ejecuta la segunda sentencia, <code>eval</code> ocasionará que estas sentencias sean ejecutadas, y también evaluará el conjunto de sentencias y devolverá que el valor es asignado a <code>z</code>.</p>
+
+<pre class="brush: js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">5</span><span class="punctuation token">;</span></code>
+var str = "if (x == 5) {alert('z is 42'); z = 42;} else z = 0; ";
+
+document.write("&lt;P&gt;z es ", eval(str));
+</pre>
+
+<h3 id="La_última_espresión_es_evaluada">La última espresión es evaluada</h3>
+
+<p><code>eval()</code> devuelve el valor de la última expresión evaluada</p>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> str <span class="operator token">=</span> <span class="string token">"if ( a ) { 1+1; } else { 1+2; }"</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> a <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> b <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>str<span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// devuelve 2</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">"b is : "</span> <span class="operator token">+</span> b<span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+a <span class="operator token">=</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
+b <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>str<span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// devuelve 3</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">"b is : "</span> <span class="operator token">+</span> b<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<h3 id="eval_como_una_cadena_de_caracteres_(string)_definiendo_funciones_requiere_(_y_)_como_prefijo_y_sufijo"><code>eval</code> como una cadena de caracteres (string) definiendo funciones requiere "(" y ")" como prefijo y sufijo</h3>
+
+<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> fctStr1 <span class="operator token">=</span> <span class="string token">"function a() {}"</span>
+<span class="keyword token">var</span> fctStr2 <span class="operator token">=</span> <span class="string token">"(function a() {})"</span>
+<span class="keyword token">var</span> fct1 <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>fctStr1<span class="punctuation token">)</span>  <span class="comment token">// devuelve undefined</span>
+<span class="keyword token">var</span> fct2 <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>fctStr2<span class="punctuation token">)</span>  <span class="comment token">// deuelve una función</span></code></pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.1.2.1', 'eval')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-eval-x', 'eval')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-eval-x', 'eval')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Carác.</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Observaciones_específicas_para_Gecko">Observaciones específicas para Gecko</h2>
+
+<ul>
+ <li>Históricamente <code>eval()</code> tenía un segundo argumento opcional, especificando un objeto en cuyo contexto la evaluación era ejecutada. Este argunmento no era estándar, y fue removido del <em>SpiderMonkey en</em> Gecko 1.9.1 (Firefox 3.5). Vea {{bug(442333)}}.</li>
+</ul>
+
+<h2 id="Compatibilidad_Hacia_Atr.C3.A1s" name="Compatibilidad_Hacia_Atr.C3.A1s">Compatibilidad Hacia Atrás</h2>
+
+<h3 id="JavaScript_1.3_y_anteriores" name="JavaScript_1.3_y_anteriores">JavaScript 1.3 y anteriores</h3>
+
+<p>Puede usar <code>eval</code> indirectamente, aunque ésto está desaconsejado.</p>
+
+<h3 id="JavaScript_1.1" name="JavaScript_1.1">JavaScript 1.1</h3>
+
+<p><code>eval</code> también es un método de todos los objetos.</p>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Objetos_globales/uneval", "uneval()")}}</li>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Operadores/Miembros">Miembros de operadores</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/evalerror/index.html b/files/es/web/javascript/reference/global_objects/evalerror/index.html
new file mode 100644
index 0000000000..71763345cc
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/evalerror/index.html
@@ -0,0 +1,164 @@
+---
+title: EvalError
+slug: Web/JavaScript/Reference/Global_Objects/EvalError
+tags:
+  - Error
+translation_of: Web/JavaScript/Reference/Global_Objects/EvalError
+original_slug: Web/JavaScript/Referencia/Objetos_globales/EvalError
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong>EvalError </strong>indica un error con respecto a la función global {{jsxref("Global_Objects/eval", "eval()")}}. Esta excepción ya no es lanzada por JavaScript, sin embargo, el objeto EvalError se mantiene por motivos de compatibilidad.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>new EvalError([<var>mensaje</var>[, <var>nombreArchivo</var>[, <var>lineaNumero</var>]]])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>mensaje</code></dt>
+ <dd>Opcional. Descripción del error en formato legible.</dd>
+ <dt><font face="Consolas, Liberation Mono, Courier, monospace">nombreArchivo</font>{{non-standard_inline}}</dt>
+ <dd>
+ <p dir="ltr" id="tw-target-text">Opcional. El nombre del archivo que contiene el código que causó la excepción.</p>
+ </dd>
+ <dt><font face="Consolas, Liberation Mono, Courier, monospace">lineaNumero</font>{{non-standard_inline}}</dt>
+ <dd>
+ <p dir="ltr" id="tw-target-text">Opcional. El número de línea del código que causó la excepción.</p>
+ </dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("EvalError.prototype")}}</dt>
+ <dd>
+ <p dir="ltr" id="tw-target-text">Permite la adición de propiedades a un objeto <strong>EvalError</strong>.</p>
+ </dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<p dir="ltr" id="tw-target-text">El objeto global <strong>EvalError</strong> no contiene ningún método propio, sin embargo, hereda algunos métodos a través de la cadena de prototipos.</p>
+
+<h2 id="Instancias_de_EvalError">Instancias de <code>EvalError</code></h2>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/prototype', 'Properties')}}</div>
+
+<h3 id="Métodos_2">Métodos</h3>
+
+<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/prototype', 'Métodos')}}</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p><code><strong>EvalError </strong></code>no se usa en la especificación actual de ECMAScript y, por ende, no será lanzado en tiempo de ejecución. Sin embargo, el mismo permanece para compatibilidad con versiones anteriores de la especificación.</p>
+
+<h3 id="Creando_un_EvalError">Creando un <code>EvalError</code></h3>
+
+<pre class="brush: js notranslate">try {
+  throw new EvalError('Hello', 'someFile.js', 10);
+} catch (e) {
+  console.log(e instanceof EvalError); // true
+  console.log(e.message);              // "Hello"
+  console.log(e.name);                 // "EvalError"
+  console.log(e.fileName);             // "someFile.js"
+  console.log(e.lineNumber);           // 10
+  console.log(e.columnNumber);         // 0
+  console.log(e.stack);                // "@Scratchpad/2:2:9\n"
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.11.6.1', 'EvalError')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>No usado en esta especificación. Presente por compatibilidad con versiones anteriores.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>No usado en esta especificación. Presente por compatibilidad con versiones anteriores.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Error")}}</li>
+ <li>{{jsxref("EvalError.prototype")}}</li>
+ <li>{{jsxref("Global_Objects/eval", "eval()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/apply/index.html b/files/es/web/javascript/reference/global_objects/function/apply/index.html
new file mode 100644
index 0000000000..359f79f0ef
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/apply/index.html
@@ -0,0 +1,234 @@
+---
+title: Function.prototype.apply()
+slug: Web/JavaScript/Reference/Global_Objects/Function/apply
+tags:
+  - Function
+  - JavaScript
+  - Method
+  - función
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/apply
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/apply
+---
+<div>{{JSRef("Objetos_globales", "Function")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <strong>apply()</strong> invoca una determinada función asignando explícitamente el objeto <strong>this</strong> y un array o similar (<a href="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects" title="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects">array like object</a>) como parámetros (<strong>argumentos)</strong> para dicha función.</p>
+
+<div class="note"><strong>NOTA:</strong> Aunque la sintaxis de esta función es casi idéntica a {{jsxref("Function.call", "call()")}}, la diferencia fundamental es que <code>call()</code> acepta una lista de argumentos, mientras que <code>apply()</code> acepta un simple array con los argumentos.</div>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>fun</em>.apply(<em>thisArg</em>[, <em>argsArray</em>])</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>thisArg</code></dt>
+ <dd>El valor del objeto <strong>this</strong> a utilizar dentro de la llamada a <em>fun</em>. Cabe mencionar que éste puede no ser el valor visto por el método: si el método es una función del tipo {{jsxref("Functions_and_function_scope/Strict_mode", "non-strict mode", "", 1)}}, {{jsxref("Global_Objects/null", "null")}} o {{jsxref("Global_Objects/undefined", "undefined")}} será reemplazado por el objeto global, y los valores primitivos serán encapsulados.</dd>
+ <dt><code>argsArray</code></dt>
+ <dd>Un objeto similar a un array (<a href="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects" title="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects">array like object</a>), que contiene los parámetros con los que será llamada <em><code>fun</code></em>, o <code>null</code> o {{jsxref("undefined")}} si ningún argumento es estipulado. Desde la versión 5 de ECMAScript estos parámetros pueden estar en un objeto similar a un array en lugar de un array. Véase {{anch("Browser_compatibility", "browser compatibility")}} para mayor información.</dd>
+ <dt>
+ <h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+ <p>El resultado de llamar a la función con el valor dado <code><strong>this</strong></code> y argumentos.</p>
+ </dt>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Puede estipularse un objeto <code>this</code> diferente al llamar una función. <code>this</code> se refiere al objeto actual, el objeto haciendo la llamada. Con <code>apply</code>, puede escribirse un método una vez y heredarlo a otro objeto, sin necesidad de reescribir el método para adecuarlo al nuevo objeto.</p>
+
+<p><code>apply</code> es muy similar a {{jsxref("Function.call", "call()")}}, excepto por el tipo de argumentos que soporta. Puede utilizarse un arreglo de parámetros en lugar de un conjunto de pares nombre-valor. Con <code>apply</code>, puede utilizarse un arreglo literal, por ejemplo, <code><em>fun</em>.apply(this, ['eat', 'bananas'])</code>, o un objeto <code>Array</code>, por ejemplo, <code><em>fun</em>.apply(this, new Array('eat', 'bananas'))</code>.</p>
+
+<p>Puede también utilizarse {{jsxref("Funciones/arguments", "arguments")}} como parámetro <code>argsArray</code>. <code>arguments</code> es una variable local a la función. Puede utilizarse para acceder a todos los argumentos no específicados en la llamada al objeto. Por lo tanto, no se requiere conocer todos los argumentos del objeto invocado cuando se utiliza el método <code>apply</code>. Puede utilizarse <code>arguments</code> para pasar los argumentos al objeto invocado. El objeto invocado es entonces responsable por el manejo de los argumentos.</p>
+
+<p>Desde la 5ta edición de ECMAScript se puede utilizar también cualquier tipo de objeto similar a un arreglo, que en términos prácticos significa que tendrá una propiedad <code>length</code> y propiedades integer en el rango (<code>0...length)</code>. Por ejemplo, ahora puede utilizarse un {{domxref("NodeList")}} o un objeto personalizado como: <code>{'length': 2, '0': 'eat', '1': 'bananas'}</code>.</p>
+
+<div>{{ note("La mayoría de los navegadores, incluidos Chrome 14 e Internet Explorer 9, aún no soportan el uso de objetos similares a un array y arrojarán una excepción.") }}</div>
+
+<div> </div>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Using_apply_to_chain_constructors" name="Using_apply_to_chain_constructors">Utilizando <strong><code>apply</code></strong> para encadenar constructores</h3>
+
+<p>Puedes utilizar <code>apply</code> para encadenar {{jsxref("Operadores/new", "constructors")}} para un objeto, similar a Java. En el ejemplo siguiente se crea un método global a {{jsxref("Function")}} llamado <code>construct</code>, en cual posibilita el uso de un objeto similar a un arreglo en un constructor en lugar de una lista de argumentos.</p>
+
+<pre class="brush: js">Function.prototype.construct = function (aArgs) {
+    var fConstructor = this, fNewConstr = function () { fConstructor.apply(this, aArgs); };
+    fNewConstr.prototype = fConstructor.prototype;
+    return new fNewConstr();
+};</pre>
+
+<p>Ejemplo de uso:</p>
+
+<pre class="brush: js">function MyConstructor () {
+    for (var nProp = 0; nProp &lt; arguments.length; nProp++) {
+        this["property" + nProp] = arguments[nProp];
+    }
+}
+
+var myArray = [4, "Hello world!", false];
+var myInstance = MyConstructor.construct(myArray);
+
+alert(myInstance.property1); // alerts "Hello world!"
+alert(myInstance instanceof MyConstructor); // alerts "true"
+alert(myInstance.constructor); // alerts "MyConstructor"</pre>
+
+<div class="note"><strong>Nota:</strong> El método <code>Function.construct</code> no nativo no funcionará con algunos constructores nativos (como {{jsxref("Date")}}, por ejemplo). En estos casos se deberá utilizar el método {{jsxref("Function.bind")}} (por ejemplo, supóngase un arreglo como el siguiente para utilizar con el constructor <code>Date</code>: <code>[2012, 11, 4]</code>; en este caso se tendría que escribir algo como: <code>new (Function.prototype.bind.apply(Date, [null].concat([2012, 11, 4])))()</code> – de cualquier manera, ésta no es la mejor manera de hacerlo y probablemente no debería utilizarse en ningún entorno en producción).</div>
+
+<h3 id="apply_and_built-in_functions" name="apply_and_built-in_functions"><strong><code>apply</code></strong> y funciones <strong>built-in</strong></h3>
+
+<p>El uso inteligente de <strong><code>apply</code></strong> permite utilizar funciones built-in para algunas tareas que, de otra manera, habrían sido escritas recorriendo los valores del arreglo dentro de un bucle. Como ejemplo, vamos a utilizar <code>Math.max</code>/<code>Math.min </code>para encontrar el máximo/mínimo valor en un arreglo.</p>
+
+<pre class="brush: js">/* min/max number in an array */
+var numbers = [5, 6, 2, 3, 7];
+
+/* using Math.min/Math.max apply */
+var max = Math.max.apply(null, numbers); /* This about equal to Math.max(numbers[0], ...) or Math.max(5, 6, ..) */
+var min = Math.min.apply(null, numbers);
+
+/* vs. simple loop based algorithm */
+max = -Infinity, min = +Infinity;
+
+for (var i = 0; i &lt; numbers.length; i++) {
+  if (numbers[i] &gt; max)
+    max = numbers[i];
+  if (numbers[i] &lt; min)
+    min = numbers[i];
+}</pre>
+
+<p>Pero cuidado: utilizando <code>apply</code> de esta manera estás corriendo el riesgo de exceder el límite de argumentos permitido por el motor de JavaScript. Las consecuencias de aplicar una función con demasiados argumentos (imagínate más de decenas de miles de argumentos) varían entre los distintos motores (JavaScriptCore tiene un <a href="https://bugs.webkit.org/show_bug.cgi?id=80797">límite de argumentos fijo de 65536</a>), porque el límite (de hecho, incluso el comportamiento de cualquier pila excesivamente larga) no está especificado. Algunos motores lanzarán una excepción. Más perniciosamente, otros limitarán de manera arbitraria el número de argumentos que se están pasando en realidad a la función. (Para ilustrar este último caso: si un motor tuviera un límite de cuatro argumentos [por supuesto, los límites reales son significamente mayores], sería como si los argumentos 5, 6, 2 y 3 hubieran sido pasados a <code>apply</code> en los ejemplos anteriores, en lugar del arreglo completo). Si el valor de tu arreglo pudiera crecer en decenas de miles, utiliza una estrategia híbrida: aplica a tu función trozos del array a la vez:</p>
+
+<pre class="brush: js">function minOfArray(arr) {
+  var min = Infinity;
+  var QUANTUM = 32768;
+
+  for (var i = 0, len = arr.length; i &lt; len; i += QUANTUM) {
+    var submin = Math.min.apply(null, arr.slice(i, Math.min(i + QUANTUM, len)));
+    min = Math.min(submin, min);
+  }
+
+  return min;
+}
+
+var min = minOfArray([5, 6, 2, 3, 7]);</pre>
+
+<h3 id="Utilizando_apply_en_monkey-patching">Utilizando apply en "monkey-patching" </h3>
+
+<p>(Reemplazando de manera dinámica los argumentos en tiempo de ejecución)</p>
+
+<p><code>apply </code>puede ser la mejor manera de reemplazar dinámicamente una función 'built-in' de Firefox, o de una librería de JavaScript. Dada una función <code>someobject.foo</code>, puedes modificar la función de una forma 'hacker', como ésta:</p>
+
+<pre><code>var originalfoo = someobject.foo;
+someobject.foo = function() {
+  // Haz algo antes de llamar a la función
+  console.log(arguments);
+  // Llama a la función como la hubieras llamado normalmente
+  originalfoo.apply(this, arguments);
+  // Aquí, ejecuta algo después
+}</code></pre>
+
+<p>Este método es especialmente útil cuando quieres depurar eventos, o interfaces con algún elemento que no tiene API, al igual que los diversos <code>.on</code> (eventos<code> [event]..., </code>como los que se usan en el <a href="https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector#Developer_API">Devtools Inspector</a>)</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición Inicial. Implementada in JavaScript 1.3.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.3.4.3', 'Function.prototype.apply')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-function.prototype.apply', 'Function.prototype.apply')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function.prototype.apply', 'Function.prototype.apply')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>ES 5.1 generic array-like object as {{jsxref("Functions/arguments", "arguments")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<table>
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>ES 5.1 generic array-like object as {{jsxref("Functions/arguments", "arguments")}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="See_also" name="See_also">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Funciones/arguments", "arguments")}} objetos</li>
+ <li>{{jsxref("Function.prototype.bind()")}}</li>
+ <li>{{jsxref("Function.prototype.call()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/arguments/index.html b/files/es/web/javascript/reference/global_objects/function/arguments/index.html
new file mode 100644
index 0000000000..49fa081ae5
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/arguments/index.html
@@ -0,0 +1,45 @@
+---
+title: Function.arguments
+slug: Web/JavaScript/Reference/Global_Objects/Function/arguments
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/arguments
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/arguments
+---
+<div>{{JSRef("Objetos_globales", "Function")}} {{deprecated_header}}</div>
+
+<h3 id="Resumen" name="Resumen">Resumen</h3>
+
+<p>Un objeto de tipo arreglo correspondiente a los argumentos pasados a la función.</p>
+
+<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
+
+<p>Use el objeto <code><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments">arguments</a></code> disponible dentro de las funciones en vez de <code>Function.arguments</code>.</p>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<p>En caso de recursividad, es decir, si la función <code>f</code> aparece varias veces en la pila de llamada, el valor de <code>f.arguments</code> representa los argumentos correspondientes a la invocación más reciente de la función.</p>
+
+<h3 id="Ejemplo" name="Ejemplo">Ejemplo</h3>
+
+<pre class="eval">function f(n) { g(n-1) }
+function g(n) {
+  print("antes: " + g.arguments[0]);
+  if(n&gt;0)
+    f(n);
+  print("después: " + g.arguments[0]);
+}
+f(2)
+</pre>
+
+<p>resultados:</p>
+
+<pre class="eval">antes: 1
+antes: 0
+después: 0
+después: 1
+</pre>
+
+<p> </p>
+
+<div class="noinclude"> </div>
+
+<p>{{ languages( { "en": "en/Core_JavaScript_1.5_Reference/Global_Objects/Function/arguments", "pl": "pl/Dokumentacja_j\u0119zyka_JavaScript_1.5/Obiekty/Function/arguments" } ) }}</p>
diff --git a/files/es/web/javascript/reference/global_objects/function/bind/index.html b/files/es/web/javascript/reference/global_objects/function/bind/index.html
new file mode 100644
index 0000000000..3e9fc315fe
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/bind/index.html
@@ -0,0 +1,294 @@
+---
+title: Function.prototype.bind()
+slug: Web/JavaScript/Reference/Global_Objects/Function/bind
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/bind
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/bind
+---
+<div>{{JSRef("Global_Objects", "Function")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <code><strong>bind()</strong></code> crea una nueva función, que cuando es llamada, asigna a su operador  <em>this</em> el valor entregado, con una secuencia de argumentos dados precediendo a cualquiera entregados cuando la función es llamada. </p>
+
+<p>El valor de <em>this</em> es ignorado cuando la función es llamada con el operador <em>new</em>.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>fun</var>.bind(<var>thisArg</var>[, <var>arg1</var>[, <var>arg2</var>[, ...]]])</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parametros</h3>
+
+<dl>
+ <dt><code>thisArg</code></dt>
+ <dd>Es un valor que será enviado a la función destino cuando se llame a la función de enlace. Este valor será ignorado si la función de enlace es construida usando el operador {{jsxref("Operators/new", "new")}}.</dd>
+ <dt><code>arg1, arg2, ...</code></dt>
+ <dd>Son los argumentos que se enviarán además de los provistos a la función de enlace cuando se invoque la función destino.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una copia de la función entregada con el valor especificado <code>this </code>y los argumentos iniciales.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>La función <code>bind()</code> crea una nueva función (<strong>función ligada</strong>) con el mismo cuerpo (propiedad interna {{jsxref("Function.prototype.call", "call")}} en términos de ECMAScript 5) como la función que será llamada (la <strong>función objetivo</strong> de la función ligada) con la referencia <code>this</code> asociada al primer argumento de <code>bind()</code>, el cual no podrá ser sobreescrito. <code>bind()</code> también acepta parámetros predeterminados que antecederán al resto de los parámetros específicos cuando la función objetivo sea llamada. Una función ligada también puede ser construída utilizando el operador {{jsxref("Operators/new", "new")}}: al hacerlo, actuará como si en su lugar hubiera sido construída la función objetivo.</p>
+
+<p>En este último caso, el parámetro correspondiente para <code>this</code> será ignorado, aunque los parámetros predeterminados que antecederán al resto sí serán provistos para la función emulada.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Ejemplo_Crear_una_función_ligada">Ejemplo: Crear una función ligada</h3>
+
+<p>El uso más simple de <code>bind()</code> es hacer que una función que, sin importar cómo es llamada, siempre apunte al mismo objeto con la referencia <code>this</code>. Un error común para nuevos programadores de JavaScript es que obtienen una referencia a un método de un objeto, posteriormente ejecutan ese método desde la referencia externa y esperan que la referencia de <code>this</code> siga apuntando al objeto original de donde se obtuvo el método (v.g. cuando se usa ese método en un callback). Sin el debido cuidado, el objeto original es comúnmente perdido. Creando una función ligada desde la función  empleando el objeto original, resuelve limpiamente este problema:</p>
+
+<pre class="brush: js">this.x = 9;
+var module = {
+  x: 81,
+  getX: function() { return this.x; }
+};
+
+module.getX(); // 81
+
+var getX = module.getX;
+getX(); // 9, porque en este caso, "this" apunta al objeto global
+
+// Crear una nueva función con 'this' asociado al objeto original 'module'
+var boundGetX = getX.bind(module);
+boundGetX(); // 81</pre>
+
+<h3 id="Ejemplo_Funciones_Parciales">Ejemplo: Funciones Parciales</h3>
+
+<p>El siguiente uso simple de <code>bind()</code> es definir una función con argumentos predeterminados que precederán a los argumentos finales de la función ligada. Estos argumentos iniciales (en caso de haberlos) se definen a continuación de lo que será la referencia de <code>this</code> y son entonces enviados como argumentos de la función objetivo, seguidos por los argumentos enviados a la función ligada cada vez que dicha función sea llamada.</p>
+
+<pre class="brush: js">function list() {
+  return Array.prototype.slice.call(arguments);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+
+// Crear funcion (sin referencia this) con argumento inicial predeterminado
+var leadingThirtysevenList = list.bind(undefined, 37);
+
+var list2 = leadingThirtysevenList(); // [37]
+var list3 = leadingThirtysevenList(1, 2, 3); // [37, 1, 2, 3]
+</pre>
+
+<h3 id="Ejemplo_Con_setTimeout">Ejemplo: Con setTimeout</h3>
+
+<p>De manera predeterminada, dentro de {{ domxref("window.setTimeout()") }}, la palabra reservada <code>this</code> será setteada al objeto {{ domxref("window") }} (o a global). Cuando se esté trabajando con métodos de clase que requieran que <code>this</code> se refiera a instancias de clase, usted puede explícitamente ligar <code>this</code> a la función callback para mantener la referencia de la instancia.</p>
+
+<pre class="brush: js">function LateBloomer() {
+  this.petalCount = Math.ceil(Math.random() * 12) + 1;
+}
+
+// Declare bloom after a delay of 1 second
+LateBloomer.prototype.bloom = function() {
+  window.setTimeout(this.declare.bind(this), 1000);
+};
+
+LateBloomer.prototype.declare = function() {
+  console.log('I am a beautiful flower with ' +
+    this.petalCount + ' petals!');
+};
+</pre>
+
+<h3 id="Ejemplo_Funciones_ligadas_usadas_como_constructores">Ejemplo: Funciones ligadas usadas como constructores</h3>
+
+<div class="warning">
+<p><strong>Advetencia:</strong> Esta sección demuestra las capacidades de JavaScript y documenta algunos usos extremos del método <code>bind()</code>. Los métodos mostrados a continuación no son la mejor forma de hacer las cosas y probablemente no deberían ser utilizados en ningún ambiente productivo.</p>
+</div>
+
+<p>Las funciones ligadas son automáticamente adecuadas para usarse con el operador {{jsxref("Operators/new", "new")}} para construir nuevas instancias creadas por la función objetivo. Cuando una función ligada es utilizada para construir un valor, el parámetro enviado para reemplazar la referencia <code>this</code> es ignorado. De cualquier forma, los argumentos iniciales sí son tomados en consideración y antecederán a los parámetros que se envíen al constructor:</p>
+
+<pre class="brush: js">function Point(x, y) {
+  this.x = x;
+  this.y = y;
+}
+
+Point.prototype.toString = function() {
+  return this.x + ',' + this.y;
+};
+
+var p = new Point(1, 2);
+p.toString(); // '1,2'
+
+
+var emptyObj = {};
+var YAxisPoint = Point.bind(emptyObj, 0/*x*/);
+// not supported in the polyfill below,
+// works fine with native bind:
+var YAxisPoint = Point.bind(null, 0/*x*/);
+
+var axisPoint = new YAxisPoint(5);
+axisPoint.toString(); // '0,5'
+
+axisPoint instanceof Point; // true
+axisPoint instanceof YAxisPoint; // true
+new Point(17, 42) instanceof YAxisPoint; // true
+</pre>
+
+<p>Note que no necesita hacer nada especial para crear una función ligada para usarse con {{jsxref("Operators/new", "new")}}. El razonamiento es que usted no necesita hacer nada especial para crear una función ligada para ser llamada planamente, aún si usted prefiriera requerir que la función ligada sea llamada únicamente utilizando {{jsxref("Operators/new", "new")}}.</p>
+
+<pre class="brush: js">// Ejemplo que puede ser ejecutado directamente en tu consola JavaScript
+// ...continúa de arriba
+
+// Aún puede ser invocada como una función normal
+// (aunque es usualmente indeseable)
+YAxisPoint(13);
+
+emptyObj.x + ',' + emptyObj.y;
+// &gt;  '0,13'
+</pre>
+
+<p>Si desea utilizar una función ligada únicamente usando {{jsxref("Operators/new", "new")}}, o únicamente mediante una llamada directa, la función objetivo debe forzar esa restricción.</p>
+
+<h3 id="Example:_Creating_shortcuts" name="Example:_Creating_shortcuts">Ejemplo: Crear atajos</h3>
+
+<p><code>bind()</code> también es útil en casos en los que desea crear un atajo para una función que requiere una referencia específica para <code>this</code>.</p>
+
+<p>Tomando {{jsxref("Array.prototype.slice")}}, por ejemplo, el cual se desearía utilizar para convertir un objeto tipo array a un arreglo real. Podría crear un atajo como el siguiente:</p>
+
+<pre class="brush: js">var slice = Array.prototype.slice;
+
+// ...
+
+slice.call(arguments);
+</pre>
+
+<p>Con <code>bind()</code>, esto puede ser simplificado. En el siguiente fragmento de código, <code>slice</code> es una función ligada a la función {{jsxref("Function.prototype.call()", "call()")}} de {{jsxref("Function.prototype")}}, con la referencia <code>this</code> setteada a la función {{jsxref("Array.prototype.slice()", "slice()")}} de {{jsxref("Array.prototype")}}. Esto significa que llamadas adicionales a <code>call()</code> pueden omitirse:</p>
+
+<pre class="brush: js">// same as "slice" in the previous example
+var unboundSlice = Array.prototype.slice;
+var slice = Function.prototype.call.bind(unboundSlice);
+
+// ...
+
+slice(arguments);
+</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<p>La función <code>bind()</code> fue añadida a la especificación ECMA-262, 5a edición; por lo tanto podría no estar presente en todos los navegadores. Usted puede parcialmente simularla al insertar el siguiente código al inicio de sus scripts, permitiendo emplear muchas de las funcionalidades de <code>bind()</code> en implementaciones que no la soportan nativamente.</p>
+
+<pre class="brush: js">if (!Function.prototype.bind) {
+  Function.prototype.bind = function(oThis) {
+    if (typeof this !== 'function') {
+      // closest thing possible to the ECMAScript 5
+      // internal IsCallable function
+      throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
+    }
+
+    var aArgs   = Array.prototype.slice.call(arguments, 1),
+        fToBind = this,
+        fNOP    = function() {},
+        fBound  = function() {
+          return fToBind.apply(this instanceof fNOP &amp;&amp; oThis
+                 ? this
+                 : oThis,
+                 aArgs.concat(Array.prototype.slice.call(arguments)));
+        };
+
+    fNOP.prototype = this.prototype;
+    fBound.prototype = new fNOP();
+
+    return fBound;
+  };
+}
+</pre>
+
+<p>Algunas de las muchas diferencias (bien podría haber otras, en tanto la siguiente lista no intenta ser exhaustiva) entre este algoritmo y el algoritmo de la especificación son:</p>
+
+<ul>
+ <li>La implementación parcial se basa en {{jsxref("Array.prototype.slice()")}}, {{jsxref("Array.prototype.concat()")}}, {{jsxref("Function.prototype.call()")}} y {{jsxref("Function.prototype.apply()")}}, métodos incorporados para tener sus valores originales.</li>
+ <li>La implementación parcial crea funciones que no tienen "poison pills" inmutables {{jsxref("Function.caller", "caller")}} y las propiedades de los <code>argumentos</code> que lanzan una {{jsxref("Global_Objects/TypeError", "TypeError")}} sobre get, set, o deletion. (Esto podría ser añadido si la implementación soportara {{jsxref("Object.defineProperty")}}, o parcialmente implementada [sin el comportamiento throw-on-delete] si la implementación soportara las extensiones {{jsxref("Object.defineGetter", "__defineGetter__")}} y {{jsxref("Object.defineSetter", "__defineSetter__")}} ).</li>
+ <li>La implementación parcial crea funciones que tienen una propiedad <code>prototype</code>. (Las funciones ligadas no tienen ninguna).</li>
+ <li>La implementación parcial crea funciones ligadas cuya propiedad {{jsxref("Function.length", "length")}} no coincide con la indicada por ECMA-262: ésta crea funciones con longitud 0, mientras que la implementación completa, dependiendo de la longitud de la función objetivo y del número de argumentos pre-especificados, podría regresar una longitud mayor a zero.</li>
+</ul>
+
+<p>Si elige usar esta implementación parcial,<strong> no debe de utilizarla en los casos en los que el comportamiento es distinto al de la especificación ECMA-262, 5th edition!</strong> Con un poco de cuidado, de cualquier manera (y tal vez con algunas modificaciones adicionales para adecuarse a sus necesidades específicas), esta implementación parcial podría ser un puente razonable al momento en que <code>bind()</code> sea ampliamente implementada acorde a a la especificación.</p>
+
+<p>Por favor checa <a href="https://github.com/Raynos/function-bind">https://github.com/Raynos/function-bind</a> para ver una solución más profunda.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.3.4.5', 'Function.prototype.bind')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-function.prototype.bind', 'Function.prototype.bind')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome("7")}}</td>
+   <td>{{CompatGeckoDesktop("2")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatOpera("11.60")}}</td>
+   <td>{{CompatSafari("5.1.4")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatAndroid("4.0")}}</td>
+   <td>{{CompatChrome("0.16")}}</td>
+   <td>{{CompatGeckoMobile("2")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatOperaMobile("11.50")}}</td>
+   <td>{{CompatSafari("6.0")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Basado en <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat tables</a>.</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Function.prototype.apply()")}}</li>
+ <li>{{jsxref("Function.prototype.call()")}}</li>
+ <li>{{jsxref("Functions_and_function_scope", "Functions and function scope", "", 1)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/call/index.html b/files/es/web/javascript/reference/global_objects/function/call/index.html
new file mode 100644
index 0000000000..a3d07876d8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/call/index.html
@@ -0,0 +1,114 @@
+---
+title: Function.prototype.call()
+slug: Web/JavaScript/Reference/Global_Objects/Function/call
+tags:
+  - Function
+  - JavaScript
+  - Method
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/call
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/call
+---
+<div>{{JSRef("Objetos_globales", "Function")}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El método <strong><code>call()</code></strong> llama a una función con un valor dado <code>this</code> y con argumentos provistos individualmente.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><em>function</em>.call(<em>thisArg</em>[, <em>arg1</em>[, <em>arg2</em>[, ...]]])</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code><em>thisArg</em></code> {{optional_inline}}</dt>
+ <dd>El valor a usar como <code>this</code> cuando se llama a <em><code>function</code></em>.</dd>
+ <dd>
+ <div class="blockIndicator note">
+ <p><strong>Cuidado:</strong> En ciertos casos, <code><em>thisArg</em></code> puede no ser el valor actual visto por el método.</p>
+
+ <p>Si el método es una función en {{jsxref("Strict_mode", "non-strict mode", "", 1)}}, {{jsxref("Global_Objects/null", "null")}} y {{jsxref("Global_Objects/undefined", "undefined")}} serán reemplazados con el objeto global, y valores primitivos serán convertidos a objetos.</p>
+ </div>
+ </dd>
+ <dt><code>arg1, arg2, ...</code></dt>
+ <dd>Argumentos para el objeto.</dd>
+ <dt>
+ <h3 id="Valor_de_retorno">Valor de retorno</h3>
+ </dt>
+ <dd>El resultado de llamar a la función con el <code>this</code> especificado y los argumentos.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>call()</code> permite que una función/método que pertenece a un objeto, ser asignada y llamada para un objeto diferente.</p>
+
+<p><code>call()</code> provee un nuevo valor de <code>this</code> a la función/método. Con <code>call()</code>, puedes escribir un método ona vez y heredarlo a otro objeto, sin tener que reescribir el método en el nuevo objeto.</p>
+
+<div class="note"><strong>Nota:</strong> Mientras la sintaxis de esta función es casi identica a la función {{jsxref("Function.apply", "apply()")}}, la diferencia fundamental es que <code>call()</code> acepta una <strong>lista de argumentos</strong>, mientras <code>apply()</code> accepta un <strong>arreglo sencillo de argumentos</strong>.</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_call_para_encadenar_constructores_para_un_objeto">Usando <code>call</code> para encadenar constructores para un objeto</h3>
+
+<p>Puede usar <code>call</code> para encadenar constructores para un objeto (similar a Java).</p>
+
+<p>En el siguiente ejemplo, el constructor para el objeto <code>Producto</code> es definido con dos parametros, <code>nombre</code> y <code>precio</code>.</p>
+
+<p>Otras dos funciones <code>Comida</code> y <code>Juguete</code> invocan a <code>Producto</code>, pasándo <code>this</code>, <code>nombre</code> y <code>precio</code>. <code>Producto</code> inicializa las propiedades <code>nombre</code> y <code>precio</code>, ambas funciones especializadas definen la <code>categoria</code>.</p>
+
+<pre class="brush: js notranslate">function Producto(nombre, precio) {
+  this.nombre = nombre;
+  this.precio = precio;
+
+  if (precio &lt; 0)
+    throw RangeError('No se puede crear el producto "' + nombre + '" con un precio negativo');
+  return this;
+}
+
+function Comida(nombre, precio) {
+  Producto.call(this, nombre, precio);
+  this.categoria = 'comida';
+}
+Comida.prototype = new Producto();
+
+function Juguete(nombre, precio) {
+  Producto.call(this, nombre, precio);
+  this.categoria = 'juguete';
+}
+Juguete.prototype = new Producto();
+
+var queso = new Comida('feta', 5);
+var diversion = new Juguete('robot', 40);
+</pre>
+
+<h3 id="Usando_call_para_invocar_una_función_anónima">Usando <code>call</code> para invocar una función anónima</h3>
+
+<p>En este ejemplo, creamos una función anónima y usamos <code>call</code> para invocarla en cada objeto en un arreglo.</p>
+
+<p>El propósito principal de la función anónima aquí es agregar una función <code>print</code>  a cada objeto, el cual puede imprimir el índice correcto en el arreglo.</p>
+
+<div class="blockIndicator note">
+<p>Pasar el objeto como valor <code>this</code> no es estrictamente necesario, pero se hace con propósito explicativo.</p>
+</div>
+
+<pre class="brush: js notranslate">var animales = [
+  {especie: 'Leon', nombre: 'Rey'},
+  {especie: 'Whale', nombre: 'Fail'}
+];
+
+for (var i = 0; i &lt; animales.length; i++) {
+  (function (i) {
+    this.imprimir = function () {
+      console.log('#' + i  + ' ' + this.especie + ': ' + this.nombre);
+    }
+    this.imprimir();
+  }).call(animales[i], i);
+}
+</pre>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Function.prototype.bind()")}}</li>
+ <li>{{jsxref("Function.prototype.apply()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/caller/index.html b/files/es/web/javascript/reference/global_objects/function/caller/index.html
new file mode 100644
index 0000000000..fb8b3277f8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/caller/index.html
@@ -0,0 +1,129 @@
+---
+title: Function.caller
+slug: Web/JavaScript/Reference/Global_Objects/Function/caller
+tags:
+  - Función Javascript No-standard Propiedad
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/caller
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/caller
+---
+<div>{{JSRef("Global_Objects", "Function")}} {{non-standard_header}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La propiedad <code><strong><em>function</em>.caller</strong></code> retorna la función que llamó a la función especificada.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Si la función <code>f</code> fue llamada por desde nivel raiz (top level code), el valor de <code>f.caller</code> es {{jsxref("Global_Objects/null", "null")}}, de lo contrario se retorna la función que llamó a <code>f</code>.</p>
+
+<p>Esta propiedad reemplaza a la propiedad obsoleta {{jsxref("Functions_and_function_scope/arguments/caller", "arguments.caller")}} del objeto {{jsxref("Funciones/arguments", "arguments")}}.</p>
+
+<p>la propiedad especial <code>__caller__</code>, la cual retornaba el objeto de activación del llamador y permitía reconstruir la pila de llamadas, ha sido removida por motivos de seguridad.</p>
+
+<h3 id="Notes" name="Notes">Notas</h3>
+
+<p>En caso de recursión se puede reconstruir la pila de llamada utilizando esta propiedad, tal como se muestra a continuación:</p>
+
+<pre class="brush: js">function f(n) { g(n - 1); }
+function g(n) { if (n &gt; 0) { f(n); } else { stop(); } }
+f(2);
+</pre>
+
+<p>Al momento de ejecutar <code>stop()</code> este se llama con la siguiente pila de llamadas:</p>
+
+<pre class="eval">f(2) -&gt; g(1) -&gt; f(1) -&gt; g(0) -&gt; stop()
+</pre>
+
+<p>Siendo verdadero la siguiente consideración:</p>
+
+<pre class="eval">stop.caller === g &amp;&amp; f.caller === g &amp;&amp; g.caller === f
+</pre>
+
+<p>Por lo tanto si se intenta obtener el rastro de llamadas (stack trace) de la función <code>stop()</code> como se muestra a continuación:</p>
+
+<pre class="brush: js">var f = stop;
+var stack = 'Stack trace:';
+while (f) {
+  stack += '\n' + f.name;
+  f = f.caller;
+}
+</pre>
+
+<p>se provocará una bucle que nunca termina.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Checking_the_value_of_a_function.27s_caller_property" name="Example:_Checking_the_value_of_a_function.27s_caller_property">Ejemplo: Verificar el valor de la propiedad <code>caller</code> de una función</h3>
+
+<p>El siguiente código verifica el valor de la propiedad <code>caller</code> de una función.</p>
+
+<pre class="brush: js">function myFunc() {
+  if (myFunc.caller == null) {
+    return 'The function was called from the top!';
+  } else {
+    return 'This function\'s caller was ' + myFunc.caller;
+  }
+}
+</pre>
+
+<h2 id="Especificación">Especificación</h2>
+
+<p>No es parte de ninguna especificación. Se implementa en JavaScript 1.5.</p>
+
+<h2 id="Compatiblilidad_de_Navegadores">Compatiblilidad de Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Véase también</h2>
+
+<ul>
+ <li>Problema de implementación para SpiderMonkey {{bug(65683)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/displayname/index.html b/files/es/web/javascript/reference/global_objects/function/displayname/index.html
new file mode 100644
index 0000000000..0b57256890
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/displayname/index.html
@@ -0,0 +1,78 @@
+---
+title: Function.displayName
+slug: Web/JavaScript/Reference/Global_Objects/Function/displayName
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/displayName
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/displayName
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>The <code><strong><em>function</em>.displayName</strong></code> property returns the display name of the function.</p>
+
+<h2 id="Description">Description</h2>
+
+<p>Cuando se define la propiedad <code>displayName</code> , retorna un mensaje con el nombre para mostrar en una función:</p>
+
+<pre class="brush: js">function doSomething() {}
+
+console.log(doSomething.displayName); // "undefined"
+
+var popup = function(content) { console.log(content); };
+
+popup.displayName = 'Show Popup';
+
+console.log(popup.displayName); // "Show Popup"
+</pre>
+
+<p>Tu puedes definir una funcion con un nombre a mostrar en un {{jsxref("Functions", "function expression", "", 1)}}:</p>
+
+<pre class="brush: js">var object = {
+  someMethod: function() {}
+};
+
+object.someMethod.displayName = 'someMethod';
+
+console.log(object.someMethod.displayName); // logs "someMethod"
+
+try { someMethod } catch(e) { console.log(e); }
+// ReferenceError: someMethod is not defined
+</pre>
+
+<p>Puedes cambiar dinámicamente el <code>displayName</code> de una función:</p>
+
+<pre class="brush: js">var object = {
+  // anonymous
+  someMethod: function(value) {
+    arguments.callee.displayName = 'someMethod (' + value + ')';
+  }
+};
+
+console.log(object.someMethod.displayName); // "undefined"
+
+object.someMethod('123')
+console.log(object.someMethod.displayName); // "someMethod (123)"
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Normalmente, se prefiere por consolas y profilers sobre {{jsxref("Function.name", "func.name")}} a mostrar el nombre de una función.</p>
+
+<p>Al ingresar lo siguiente en una consola, debería mostrarse como algo así como "<code>function My Function()</code>":</p>
+
+<pre class="brush: js">var a = function() {};
+a.displayName = 'My Function';
+
+a; // "function My Function()"</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<p>Not part of any specification.</p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Function.displayName")}}</p>
+</div>
+
+<div> </div>
diff --git a/files/es/web/javascript/reference/global_objects/function/function/index.html b/files/es/web/javascript/reference/global_objects/function/function/index.html
new file mode 100644
index 0000000000..8a3152cfc2
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/function/index.html
@@ -0,0 +1,93 @@
+---
+title: Function() constructor
+slug: Web/JavaScript/Reference/Global_Objects/Function/Function
+tags:
+  - Constructor
+  - Function
+  - JavaScript
+  - Referencia
+  - función
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/Function
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/Función
+---
+<div>{{JSRef("Objetos_globales", "Function")}}</div>
+
+<p><span class="seoSummary">El constructor <strong><code>Function</code></strong> crea un nuevo <strong>objeto</strong> <code>Function</code>. Llamar al constructor directamente puede crear funciones dinámicamente, pero tiene problemas de seguridad y de rendimiento similares (pero mucho menos importantes) para {{jsxref("eval")}}. Sin embargo, a diferencia de eval, el constructor <code>Function</code> crea funciones que solo se ejecutan en el ámbito global.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/function-constructor.html","shorter")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>new Function([<var>arg1 </var>[, <var>arg2 </var>[, ...<var>argN</var>]] ,] <var>functionBody</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>arg1</var>, <var>arg2</var>, ... <var>argN</var></code></dt>
+ <dd>Nombres que utilizará la función como nombres de argumentos formales. Cada uno debe ser una cadena que corresponda a un identificador JavaScript válido, o una lista de dichas cadenas separadas por una coma. Por ejemplo: "<code>x</code>", "<code>theValue</code>" —o "<code>x,theValue</code>".</dd>
+ <dt><code><var>functionBody</var></code></dt>
+ <dd>Una cadena que contiene las declaraciones de JavaScript que comprenden la definición de función.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los objetos <code>Function</code> creados con el constructor <code>Function</code> se procesan cuando se crea la función. Esto es menos eficiente que declarar una función con una {{jsxref("Operators/function", "expresión de función")}} o {{jsxref("Statements/function", "declaración de función")}} y llamarla dentro de tu código porque tales funciones se procesan con el resto del código.</p>
+
+<p>Todos los argumentos pasados a la función se tratan como los nombres de los identificadores de los parámetros en la función que se va a crear, en el orden en que se pasan. Omitir un argumento dará como resultado que el valor de ese parámetro sea <code>undefined</code>.</p>
+
+<p>Invocar el constructor <code>Function</code> como función (sin usar el operador <code>new</code>) tiene el mismo efecto que invocarlo como constructor.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Especificar_argumentos_con_el_constructor_Function">Especificar argumentos con el constructor Function</h3>
+
+<p>El siguiente código crea un objeto <code>Function</code> que toma dos argumentos.</p>
+
+<pre class="brush: js notranslate">// El ejemplo se puede ejecutar directamente en tu consola JavaScript
+
+// Crea una función que toma dos argumentos y devuelve la suma de esos argumentos
+const adder = new Function('a', 'b', 'return a + b');
+
+// Llama a la función
+adder(2, 6);
+// 8
+</pre>
+
+<p>Los argumentos "<code>a</code>" y "<code>b</code>" son nombres de argumentos formales que se utilizan en el cuerpo de la función, "<code>return a + b</code>".</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function-constructor', 'Constructor Function')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Function.Function")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Functions", "Funciones y ámbito de la función", "", 1)}}</li>
+ <li>{{jsxref("Statements/function", "Declaración de function")}}</li>
+ <li>{{jsxref("Operators/function*", "Expresión function*")}}</li>
+ <li>{{jsxref("Statements/function", "Declaración de function*")}}</li>
+ <li>{{jsxref("Operators/function*", "Expresión function*")}}</li>
+ <li>{{jsxref("AsyncFunction", "Función asíncrona", "", 1)}}</li>
+ <li>{{jsxref("GeneratorFunction", "Función generadora", "", 1)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/index.html b/files/es/web/javascript/reference/global_objects/function/index.html
new file mode 100644
index 0000000000..526c21db07
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/index.html
@@ -0,0 +1,119 @@
+---
+title: Function
+slug: Web/JavaScript/Reference/Global_Objects/Function
+tags:
+  - Clase
+  - Class
+  - Declaración
+  - Expresión
+  - Function
+  - JavaScript
+  - función
+translation_of: Web/JavaScript/Reference/Global_Objects/Function
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function
+---
+<div>{{JSRef("Objetos_globales", "Function")}}</div>
+
+<p>Cada función de JavaScript en realidad es un objeto <code>Function</code>. Esto se puede ver con el código <code>(function() {}).constructor === Function</code>, que devuelve <code>true</code>.</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{jsxref("Function/Function", "Function()", "", 1)}}</dt>
+ <dd>Crea un nuevo objeto <code>Function</code>. Llamar al constructor directamente puede crear funciones dinámicamente, pero tiene problemas de seguridad y de rendimiento similares (pero mucho menos importantes) para {{jsxref("eval")}}. Sin embargo, a diferencia de <code>eval</code>, el constructor <code>Function</code> crea funciones que solo se ejecutan en el ámbito global.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{jsxref("Function.arguments")}}</dt>
+ <dd>Un arreglo que corresponde a los argumentos pasados a una función.<br>
+ Esto está obsoleto como propiedad de {{jsxref("Function")}}. En su lugar, utiliza el objeto {{jsxref("Functions/arguments", "arguments", "", 1)}} (disponible dentro de la función).</dd>
+ <dt>{{jsxref("Function.caller")}}</dt>
+ <dd>Especifica la función que invocó a la función que se está ejecutando actualmente.<br>
+ Esta propiedad está obsoleta, y solo es funcional para algunas funciones no estrictas.</dd>
+ <dt>{{jsxref("Function.displayName")}}</dt>
+ <dd>El nombre a mostrar de la función.</dd>
+ <dt>{{jsxref("Function.length")}}</dt>
+ <dd>Especifica el número de argumentos que espera la función.</dd>
+ <dt>{{jsxref("Function.name")}}</dt>
+ <dd>El nombre de la función.</dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt>{{jsxref("Function.prototype.apply()", "Function.prototype.apply(<var>thisArg</var> [, <var>argsArray</var>])")}}</dt>
+ <dd>Llama a una función y establece su <code>this</code> en el <code><var>thisArg</var></code> proporcionado. Los argumentos se pueden pasar como un objeto {{jsxref("Array")}}.</dd>
+ <dt>{{jsxref("Function.prototype.bind()", "Function.prototype.bind(<var>thisArg</var>[, <var>arg1</var>[, <var>arg2</var>[, ...<var>argN</var>]]])")}}</dt>
+ <dd>Crea una nueva función que, cuando se llama, tiene su <code>this</code> configurado en el <code><var>thisArg</var></code>. Opcionalmente, una determinada secuencia de argumentos se antepondrá a los argumentos siempre que se llame a la función recién invocada.</dd>
+ <dt>{{jsxref("Function.prototype.call()", "Function.prototype.call(<var>thisArg</var>[, <var>arg1</var>, <var>arg2</var>, ...<var>argN</var>])")}}</dt>
+ <dd>Llama a una función y establece su <code>this</code> en el valor proporcionado. Los argumentos se pueden pasar tal cual.</dd>
+ <dt>{{jsxref("Function.prototype.toString()", "Function.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el código fuente de la función.<br>
+ Redefine el método {{jsxref("Object.prototype.toString()")}}.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Diferencia_entre_el_constructor_Function_y_la_declaración_function">Diferencia entre el constructor Function y la declaración function</h3>
+
+<p>Las funciones creadas con el constructor <code>Function</code> no crean cierres para sus contextos de creación; siempre se crean en el ámbito global. Al ejecutarlos, solo podrán acceder a sus propias variables locales y globales, no a las del ámbito en el que se creó el constructor <code>Function</code>. Esto es diferente de usar {{jsxref("eval")}} con código para una expresión de función.</p>
+
+<pre class="brush: js notranslate">var x = 10;
+
+function createFunction1() {
+    var x = 20;
+    return new Function('return x;'); // esta |x| se refiere a la |x| global
+}
+
+function createFunction2() {
+    var x = 20;
+    function f() {
+        return x; // esta |x| se refiere a la |x| local
+    }
+    return f;
+}
+
+var f1 = createFunction1();
+console.log(f1());          // 10
+var f2 = createFunction2();
+console.log(f2());          // 20
+</pre>
+
+<p>Si bien este código funciona en los navegadores web, <code>f1()</code> producirá un <code>ReferenceError</code> en Node.js, ya que no encontrará a <code>x</code>. Esto se debe a que el ámbito de nivel superior en Node no es el ámbito global, y <code>x</code> será local para el módulo.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function-objects', 'Function')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Function")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Functions", "Funciones y ámbito de la función", "", 1)}}</li>
+ <li>Declaración {{jsxref("Statements/function", "function")}}</li>
+ <li>Expresión {{jsxref("Operators/function", "function")}}</li>
+ <li>Declaración {{jsxref("Statements/function*", "function*")}}</li>
+ <li>Expresión {{jsxref("Operators/function*", "function*")}}</li>
+ <li>{{jsxref("AsyncFunction", "Función asíncrona", "", 1)}}</li>
+ <li>{{jsxref("GeneratorFunction", "Función generadora", "", 1)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/length/index.html b/files/es/web/javascript/reference/global_objects/function/length/index.html
new file mode 100644
index 0000000000..b7d72cac75
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/length/index.html
@@ -0,0 +1,152 @@
+---
+title: Function.length
+slug: Web/JavaScript/Reference/Global_Objects/Function/length
+tags:
+  - JavaScript
+  - Propiedad
+  - función
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/length
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/length
+---
+<div>{{JSRef("Global_Objects", "Function")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>La propiedad <code><strong>length</strong></code> especifica el número de argumentos esperados por la función.</p>
+
+<div>{{js_property_attributes(0,0,1)}}</div>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p><code>length</code> es la propiedad de una función objeto, e indica el número de argumentos que una función requiere, por ejemplo, el número de parámetros formales. Este número no incluye {{jsxref("rest_parameters", "rest parameter", "", 1)}}. En cambio, {{jsxref("Functions_and_function_scope/arguments/length", "arguments.length")}} es local a una función y aporta el número de argumentos actuales pasados a una función.</p>
+
+<h3 id="Propiedades_de_la_Función_constructora">Propiedades de la <code>Función</code> constructora</h3>
+
+<p>El {{jsxref("Global_Objects/Function", "Function")}} constructor en sí mismo es {{jsxref("Global_Objects/Function", "Function")}} un objeto. Sú <code>propiedad length</code> tiene el valor 1. Los atributos son: Grabable: <code>false</code>, Enumerable: <code>false</code>, Configurable: <code>true</code>.</p>
+
+<h3 id="Propiedad_de_la_Función_prototype_object">Propiedad de la  <code>Función</code> prototype object</h3>
+
+<p>La propiedad length del {{jsxref("Global_Objects/Function", "Function")}} objeto prototype tiene el valor 0.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<pre class="brush: js">console.log(Function.length); /* 1 */
+
+console.log((function()        {}).length); /* 0 */
+console.log((function(a)       {}).length); /* 1 */
+console.log((function(a, b)    {}).length); /* 2 etc. */
+console.log((function(...args) {}).length); /* 0, resto de parámetros no se contemplan */
+console.log((function(a, b = 1, c) {}).length); /* 1, solo parámetros antes del primero con un valor por defecto son contados */
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Standard</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td><code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} constructor:<br>
+    {{SpecName('ES5.1', '#sec-15.3.3.2', 'Function.length')}}<br>
+    <code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} prototype object:<br>
+    {{SpecName('ES5.1', '#sec-properties-of-the-function-prototype-object', 'Function.length')}}<br>
+    <code>length</code> property of {{jsxref("Global_Objects/Function", "Function")}} instances:<br>
+    {{SpecName('ES5.1', '#sec-15.3.5.1', 'Function.length')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td><code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} constructor:<br>
+    {{SpecName('ES6', '#sec-function.length', 'Function.length')}}<br>
+    <code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} prototype object:<br>
+    {{SpecName('ES6', '#sec-15.3.4', 'Function.length')}}<br>
+    <code>length</code> property of {{jsxref("Global_Objects/Function", "Function")}} instances:<br>
+    {{SpecName('ES6', '#sec-function-instances-length', 'Function.length')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>El atributo <code>configurable</code> de esta propiedad ahora es <code>true</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Configurable: true</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop(37)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Configurable: true</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile(37)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Global_Objects/Function", "Función")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/name/index.html b/files/es/web/javascript/reference/global_objects/function/name/index.html
new file mode 100644
index 0000000000..ee7fa23adf
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/name/index.html
@@ -0,0 +1,224 @@
+---
+title: Function.name
+slug: Web/JavaScript/Reference/Global_Objects/Function/name
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/name
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/name
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong><em>function</em>.name</strong></code> retorna el nombre de la función o retorna <code>"anonymous"</code> por funciones creadas anónimamente.</p>
+
+<div>{{js_property_attributes(0,0,1)}}</div>
+
+<div>Nótese que en implementaciones no estándar previas a ES2015 el atributo <code>configurable</code> también era <code>false</code>.</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Nombre_de_una_declaración_de_función">Nombre de una declaración de función</h3>
+
+<p>La propiedad <code>name</code> retorna el nombre de una declaración de función.</p>
+
+<pre class="brush: js">function doSomething() {}
+
+console.log(doSomething.name); // imprime en pantalla "doSomething"
+</pre>
+
+<h3 id="Nombre_de_constructor_de_función">Nombre de constructor de función</h3>
+
+<p>Las funciones creadas con la sintaxis <code>new Function(...)</code> o simplemente <code>Function(...)</code> tienen como propiedad <code>name</code> una cadena vacía. En los ejemplos a continuación se crean funciones anónimas, tales que su <code>name</code> retorna una cadena vacía:</p>
+
+<pre class="brush: js">var f = function() {};
+var object = {
+  someMethod: function() {}
+};
+
+console.log(f.name == ''); // true
+console.log(object.someMethod.name == ''); // también true
+</pre>
+
+<h3 id="Nombres_de_función_inferidos">Nombres de función inferidos</h3>
+
+<p>Los navegadores que implementan funciones ES2015 pueden inferir el nombre de una función anónima de su posición sintáctica. Por ejemplo:</p>
+
+<pre class="brush: js">var f = function() {};
+console.log(f.name); // "f"</pre>
+
+<p>Se puede definir una función con un nombre en un {{jsxref("Operators/Function", "function expression", "", 1)}}:</p>
+
+<pre class="brush: js">var object = {
+  someMethod: function object_someMethod() {}
+};
+console.log(object.someMethod.name); // imprime "object_someMethod"
+
+try { object_someMethod } catch(e) { console.log(e); }
+// ReferenceError: object_someMethod is not defined
+</pre>
+
+<p>No se puede cambiar el nombre de una función, esta propiedad es de solo lectura:</p>
+
+<pre class="brush: js">var object = {
+  // anonymous
+  someMethod: function() {}
+};
+
+object.someMethod.name = 'someMethod';
+console.log(object.someMethod.name); // cadena vacía, someMethod es anónimo
+</pre>
+
+<p>Sin embargo, se puede usar {{jsxref("Object.defineProperty()")}} para cambiarlo.</p>
+
+<h3 id="Nombres_de_métodos">Nombres de métodos</h3>
+
+<pre class="brush: js">var o = {
+  foo(){}
+};
+o.foo.name; // "foo";</pre>
+
+<h3 id="Nombres_de_funciones_atadas_(creadas_con_.bind())">Nombres de funciones atadas (creadas con .bind())</h3>
+
+<p>{{jsxref("Function.bind()")}} produce una función cuyo nombre es igual a "bound " seguido del nombre de la función original.</p>
+
+<pre class="brush: js">function foo() {};
+foo.bind({}).name; // "bound foo"</pre>
+
+<h3 id="Nombres_de_funciones_getters_y_setters">Nombres de funciones getters y setters</h3>
+
+<p>Cuando se usan <code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">get</a></code> y <code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">set</a>, </code>"get" y "set" aparecerán en el nombre de la función.</p>
+
+<pre class="brush: js">var o = {
+  get foo(){},
+  set foo(x){}
+};
+
+var descriptor = Object.getOwnPropertyDescriptor(o, "foo");
+descriptor.get.name; // "get foo"
+descriptor.set.name; // "set foo";</pre>
+
+<h2 id="Ejemplos_2">Ejemplos</h2>
+
+<p>Se puede usar <code>obj.constructor.name</code> para saber cuál es la "clase" de un objeto:</p>
+
+<pre class="brush: js">function a() {}
+
+var b = new a();
+
+console.log(b.constructor.name); // imprime "a"
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Para versiones de IE &lt; 9, se puede usar <code>fn._name()</code> en su lugar. Para IE9 o posteriores se puede usar el siguiente <a href="https://github.com/JamesMGreene/Function.name">polyfill</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-name', 'name')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-name', 'name')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome(33.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Configurable: true</td>
+   <td>{{CompatChrome(43.0)}}</td>
+   <td>{{CompatGeckoDesktop(38)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Nombres inferidos en funciones anónimas</td>
+   <td>{{CompatChrome(51.0)}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Configurable: true</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile(38)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Nombres inferidos en funciones anónimas</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(51.0)}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(51.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] See {{bug(883377)}}.</p>
diff --git a/files/es/web/javascript/reference/global_objects/function/tosource/index.html b/files/es/web/javascript/reference/global_objects/function/tosource/index.html
new file mode 100644
index 0000000000..5fac41fd6e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/tosource/index.html
@@ -0,0 +1,98 @@
+---
+title: Function.prototype.toSource()
+slug: Web/JavaScript/Reference/Global_Objects/Function/toSource
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/toSource
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/toSource
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>El método <code><strong>toSource()</strong></code> devuelve un string representando el código fuente del objeto.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>function</var>.toSource();
+Function.toSource();
+</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Ninguno.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>toSource</code> devuelve los siguientes valores:</p>
+
+<ul>
+ <li>For the built-in {{jsxref("Function")}} object, <code>toSource()</code> devuelve la siguiente cadena indicando que el código fuente no está disponible:
+
+  <pre class="brush: js">function Function() {
+    [native code]
+}
+</pre>
+ </li>
+ <li>En funciones personalizadas, <code>toSource()</code> devuelve el código JavaScript que define el objeto como un string.</li>
+</ul>
+
+<p>Éste método es usado de forma interna por JavaScript y no explicitamente desde el código. Puedes usar <code>toSource</code> mientras depuras para examinar el contenido de un objeto.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No está reflejado en ningún estándar. Implementaso en JavaScript 1.3.</p>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toSource()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/function/tostring/index.html b/files/es/web/javascript/reference/global_objects/function/tostring/index.html
new file mode 100644
index 0000000000..99f89387ca
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/function/tostring/index.html
@@ -0,0 +1,131 @@
+---
+title: Function.prototype.toString()
+slug: Web/JavaScript/Reference/Global_Objects/Function/toString
+translation_of: Web/JavaScript/Reference/Global_Objects/Function/toString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Function/toString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>toString()</strong></code> retorna una cadena representando el código fuente de la función.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>function</var>.toString(indentation)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>indentation</code> {{non-standard_inline}} {{obsolete_inline(17)}}</dt>
+ <dd>La cantidad de espacios a indentar en la representación de cadena del código fuente. Si <code>indentation</code> es menor o igual a <code>-1</code>, la mayoría de los espacios innecesarios son eliminados.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El objeto {{jsxref("Function")}} reconduce el método {{jsxref("Object.prototype.toString", "toString")}} heredado de  {{jsxref("Object")}}; no hereda {{jsxref("Object.prototype.toString")}}. Para objetos {{jsxref("Function")}}, el método <code>toString</code> retorna una representación de cadena del objeto en forma de declaración de función. Esto es, <code>toString</code> descompila la función y la cadena retornada incluye la palabra clave <code>function</code>, la lista de argumentos, llaves y el código fuente del cuerpo de la función.</p>
+
+<p>JavaScript llama al método <code>toString</code> automáticamente cuando una {{jsxref("Function")}} va a ser representada como un valor de texto, p.e. cuando una función es concatenada con un valor de cadena (string).</p>
+
+<p>El método <code>toString()</code> producirá una excepción {{jsxref("TypeError")}} ("Function.prototype.toString called on incompatible object"), si el valor de su objeto <code>this</code> no es un objeto <code>Function</code>. Esto también ocurrirá para objetos {{jsxref("Proxy")}}, por ejemplo:</p>
+
+<pre class="brush: js example-bad">Function.prototype.toString.call("foo"); // TypeError
+
+var proxy = new Proxy(function() {}, {});
+Function.prototype.toString.call(proxy); // TypeError
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.3.4.2', 'Function.prototype.toString')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Añadidos requerimientos más específicos para la representación de cadena.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h2>
+
+<ul>
+ <li>Desde Gecko 17.0 {{geckoRelease("17")}}, <code>Function.prototype.toString()</code> fue implementada salvando el código fuente de la función. El descompilador fue eliminado, de modo que el parámetro <code>indentation</code> ya no se necesita más. Ver {{bug("761723")}} para más detalles.</li>
+ <li>A partir de Gecko 38 {{geckoRelease("38")}}, <code>Function.prototype.toString()</code> produce error para objetos {{jsxref("Proxy")}}  ({{bug(1100936)}}).</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/generator/index.html b/files/es/web/javascript/reference/global_objects/generator/index.html
new file mode 100644
index 0000000000..4bade3e67d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/generator/index.html
@@ -0,0 +1,229 @@
+---
+title: Generador
+slug: Web/JavaScript/Reference/Global_Objects/Generator
+tags:
+  - ECMAScript2015
+  - ECMAScript6
+  - Generador
+  - Generador Legado
+  - Iterador Legado
+  - JavaScript
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Generator
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Generador
+---
+<div>{{JSRef}}</div>
+
+<div></div>
+
+<p>El objeto <code>Generator</code> es retornado por una {{jsxref("Statements/function*", "función generator", "", 1)}} y es conformado tanto el protocolo iterable como el protocolo iterador.</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<p>Este objeto no puede ser instanciado directamente. En su lugar, una instancia del objeto <code>Generator</code> puede ser devuelta por una <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/function*">función generator</a>:</p>
+
+<pre class="syntaxbox notranslate">	function* gen() {
+	  yield 1;
+	  yield 2;
+	  yield 3;
+	}
+
+	var g = gen(); // "Generator { }"</pre>
+
+<dl>
+</dl>
+
+<h2 id="Métodos_de_instanciación">Métodos de instanciación</h2>
+
+<p><em>Tambien hereda propiedades de {{JSxRef("Iterator")}}</em></p>
+
+<dl>
+ <dt>{{jsxref("Generator.prototype.next()")}}</dt>
+ <dd>Retorna el valor ofecido por la expresión {{jsxref("Operators/yield", "yield")}}</dd>
+ <dt>{{jsxref("Generator.prototype.return()")}}</dt>
+ <dd>Retorna el valor dado y finaliza el generador.</dd>
+ <dt>{{jsxref("Generator.prototype.throw()")}}</dt>
+ <dd>Lanza un error al generador (también finaliza el generador, a menos que sea atrapado desde ese generador)</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<p><em>Tambien hereda propiedades de {{JSxRef("Iterator")}}</em></p>
+
+<dl>
+ <dt><code>Generator.prototype.constructor</code></dt>
+ <dd>Especifica la funciòn que construye el prototipo del objeto.</dd>
+</dl>
+
+<dl>
+ <dt><code>Generator.prototype[@@toStringTag]</code></dt>
+ <dd>La cuerda <code>"Generator"</code>.</dd>
+</dl>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Un_iterador_infinito">Un iterador infinito</h3>
+
+<pre class="brush: js notranslate">	function* idMaker() {
+	    var index = 0;
+	    while(true)
+	        yield index++;
+	}
+
+	var gen = idMaker(); // "Generator { }"
+
+	console.log(gen.next().value); // 0
+	console.log(gen.next().value); // 1
+	console.log(gen.next().value); // 2
+	// ...</pre>
+
+<h2 id="Objetos_generadores_legados">Objetos generadores legados</h2>
+
+<p>Firefox(SpderMonkey) tambén implementa una versón mas temprana de generadores en JavaScript 1.7, donde el asterisco (*) en la declaración de la funcion no era necesario(sólo use la palabra reservada yield en el cuerpo de la función). Sin embargo, los generadores legados se encuentran depreciados. No los use. Serán removidos ({{bug(1083482)}}).</p>
+
+<h3 id="Métodos_de_generadores_legados">Métodos de generadores legados</h3>
+
+<dl>
+ <dt><code>Generator.prototype.next() </code>{{non-standard_inline}}</dt>
+ <dt></dt>
+ <dt>Retorna el valor ofrecido por la expresión {{jsxref("Operators/yield", "yield")}}.  Esto se corresponde con el método next() en el objeto generador de ES2015.</dt>
+ <dt></dt>
+ <dt><code>Generator.prototype.close()</code> {{non-standard_inline}}</dt>
+ <dd><br>
+ Cierra el generador. Sí el método next() es llamado por la expresión {{jsxref("StopIteration")}}, un error será lanzado. Esto se corresponde con el método return() del objeto generador de ES2015.</dd>
+ <dt><code>Generator.prototype.send()</code> {{non-standard_inline}}</dt>
+ <dd>Utilizado para enviar un valor al generador. El valor es retornado por la expresion {{jsxref("Operators/yield", "yield")}}, y retorna el valor ofrecido por la siguiente expresion {{jsxref("Operators/yield", "yield")}}. <code>send(x)</code> Se corresponde a <code>next(x)</code> en el objeto generador de ECMAScript 2015.</dd>
+ <dt><strong><code>Generator.</code></strong><code>prototype.</code> <strong><code>throw()</code> </strong> {{non-standard_inline}}</dt>
+ <dd>Lanza un error al generador. Esto se corresponde con el metodo throw() en el objeto genererador de ES2015.</dd>
+</dl>
+
+<h3 id="Ejemplo_de_generador_legado">Ejemplo de generador legado</h3>
+
+<pre class="brush: js notranslate">	function fibonacci() {
+	  var a = yield 1;
+	  yield a * 2;
+	}
+
+	var it = fibonacci();
+	console.log(it);          // "Generator {  }"
+	console.log(it.next());   // 1
+	console.log(it.send(10)); // 20
+	console.log(it.close());  // undefined
+	console.log(it.next());   // throws StopIteration (as the generator is now closed)
+	</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-generator-objects', 'Generator objects')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-generator-objects', 'Generator objects')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td></td>
+   <td></td>
+   <td></td>
+  </tr>
+  <tr>
+   <td></td>
+   <td></td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{CompatChrome(39.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(39.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(39.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"></h2>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<h3 id="Generadores_Legados">Generadores Legados</h3>
+
+<ul>
+ <li>{{jsxref("Statements/Legacy_generator_function", "The legacy generator function", "", 1)}}</li>
+ <li>{{jsxref("Operators/Legacy_generator_function", "The legacy generator function expression", "", 1)}}</li>
+ <li>{{jsxref("StopIteration")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol">The legacy Iterator protocol</a></li>
+</ul>
+
+<h3 id="Generadores_ES2015">Generadores ES2015</h3>
+
+<ul>
+ <li>{{jsxref("Functions", "Functions", "", 1)}}</li>
+ <li>{{jsxref("Statements/function", "function")}}</li>
+ <li>{{jsxref("Operators/function", "function expression")}}</li>
+ <li>{{jsxref("Function")}}</li>
+ <li>{{jsxref("Statements/function*", "function*")}}</li>
+ <li>{{jsxref("Operators/function*", "function* expression")}}</li>
+ <li>{{jsxref("GeneratorFunction")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">The Iterator protocol</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/generator/next/index.html b/files/es/web/javascript/reference/global_objects/generator/next/index.html
new file mode 100644
index 0000000000..94713c3b28
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/generator/next/index.html
@@ -0,0 +1,110 @@
+---
+title: Generator.prototype.next()
+slug: Web/JavaScript/Reference/Global_Objects/Generator/next
+translation_of: Web/JavaScript/Reference/Global_Objects/Generator/next
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Generador/next
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>next</strong></code><strong><code>()</code></strong> regresa un objeto con las propiedades <code>done</code> y <code>value</code>. También puedes pasar un parámetro al método <code>next</code> para enviar un valor al generador.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>gen</var>.next(valor)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor</code></dt>
+ <dd>El valor a enviar al generador.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un {{jsxref("Object")}} con dos propiedades:</p>
+
+<ul>
+ <li><code>done</code> (booleano)
+
+  <ul>
+   <li>Es <code>verdadero</code> si el iterador ya llegó al final de la secuencia. En este caso <code>valor</code> define opcionalmente el <em>valor de retorno</em> del iterador.</li>
+   <li>Es <code>falso</code> si el iterador puede dar un siguiente valor en la secuencia. Es equivalente a no definir la propiedad <code>done</code>.</li>
+  </ul>
+ </li>
+ <li><code>value</code> - cualquier valor Javascript regresado por el iterador. Éste puede ser omitido si <code>done</code> is <code>verdadero</code>.</li>
+</ul>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_next()">Using <code>next()</code></h3>
+
+<p>The following example shows a simple generator and the object that the <code>next</code> method returns:</p>
+
+<pre class="brush: js">function* gen() {
+  yield 1;
+  yield 2;
+  yield 3;
+}
+
+var g = gen(); // "Generator { }"
+g.next();      // "Object { value: 1, done: false }"
+g.next();      // "Object { value: 2, done: false }"
+g.next();      // "Object { value: 3, done: false }"
+g.next();      // "Object { value: undefined, done: true }"
+</pre>
+
+<h3 id="Sending_values_to_the_generator">Sending values to the generator</h3>
+
+<p>In this example, <code>next</code> is called with a value. Note that the first call did not log anything, because the generator was not yielding anything initially.</p>
+
+<pre class="brush: js">function* gen() {
+  while(true) {
+    var value = yield null;
+    console.log(value);
+  }
+}
+
+var g = gen();
+g.next(1);
+// "{ value: null, done: false }"
+g.next(2);
+// 2
+// "{ value: null, done: false }"
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-generator.prototype.next', 'Generator.prototype.next')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-generator.prototype.next', 'Generator.prototype.next')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Generator.next")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">function*</a></code></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iterators and generators</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/generator/return/index.html b/files/es/web/javascript/reference/global_objects/generator/return/index.html
new file mode 100644
index 0000000000..deb659c6f4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/generator/return/index.html
@@ -0,0 +1,103 @@
+---
+title: Generator.prototype.return()
+slug: Web/JavaScript/Reference/Global_Objects/Generator/return
+tags:
+  - ECMAScript 2015
+  - Generador
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Generator/return
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Generador/return
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>return()</strong></code> regresa el valor dado y finaliza al generador.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>gen</var>.return(valor)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor</code></dt>
+ <dd>El valor a regresar.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El valor dado como argumento.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_return()">Utilizando <code>return()</code></h3>
+
+<p>El siguiente ejemplo muestra un generador simple y su método <code>return</code>.</p>
+
+<pre class="brush: js">function* gen() {
+  yield 1;
+  yield 2;
+  yield 3;
+}
+
+var g = gen();
+
+g.next();        // { value: 1, done: false }
+g.return('foo'); // { value: "foo", done: true }
+g.next();        // { value: undefined, done: true }
+</pre>
+
+<p>Si <code>return(valor)</code> es invocado en un generador que ya está en su estado "completado", el generador permanecerá en estado "completado". Si no se da ningún argumento, el objeto regresado es el mismo a que si se invocara <code>.next()</code>. Si se da un argumento, éste se asignará como valor en la propiedad <code>value</code> del objeto regresado.</p>
+
+<pre class="brush: js">function* gen() {
+  yield 1;
+  yield 2;
+  yield 3;
+}
+
+var g = gen();
+g.next(); // { value: 1, done: false }
+g.next(); // { value: 2, done: false }
+g.next(); // { value: 3, done: false }
+g.next(); // { value: undefined, done: true }
+g.return(); // { value: undefined, done: true }
+g.return(1); // { value: 1, done: true }
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-generator.prototype.return', 'Generator.prototype.return')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-generator.prototype.return', 'Generator.prototype.return')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quieres contribuir a estos datos, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y manda un pull request.</div>
+
+<p>{{Compat("javascript.builtins.Generator.return")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/function*","function*")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/generator/throw/index.html b/files/es/web/javascript/reference/global_objects/generator/throw/index.html
new file mode 100644
index 0000000000..11ee38bef9
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/generator/throw/index.html
@@ -0,0 +1,95 @@
+---
+title: Generator.prototype.throw()
+slug: Web/JavaScript/Reference/Global_Objects/Generator/throw
+translation_of: Web/JavaScript/Reference/Global_Objects/Generator/throw
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Generador/throw
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>throw()</strong></code> reanuda la ejecución de un generador al lanzar un error en éste y regresar un objeto con las dos propiedades <code>done</code> y <code>value</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>gen</var>.throw(excepción)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>excepción</code></dt>
+ <dd>La excepción a lanzar. Al hacer depuración, es útil que la excepción cumpla con <code>instanceof</code> {{jsxref("Error")}}.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un {{jsxref("Object")}} con dos propiedades:</p>
+
+<ul>
+ <li><code>done</code> (booleano)
+
+  <ul>
+   <li>Es <code>verdadero</code> si el iterador ya llegó al final de la secuencia. En este caso <code>valor</code> define opcionalmente el <em>valor de retorno</em> del iterador.</li>
+   <li>Es <code>falso</code> si el iterador puede dar un siguiente valor en la secuencia. Es equivalente a no definir la propiedad <code>done</code>.</li>
+  </ul>
+ </li>
+ <li><code>value</code> - cualquier valor Javascript regresado por el iterador. Éste puede ser omitido si <code>done</code> is <code>verdadero</code>.</li>
+</ul>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_throw()">Using <code>throw()</code></h3>
+
+<p>The following example shows a simple generator and an error that is thrown using the <code>throw</code> method. An error can be caught by a <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/try...catch">try...catch</a></code> block as usual.</p>
+
+<pre class="brush: js">function* gen() {
+  while(true) {
+    try {
+       yield 42;
+    } catch(e) {
+      console.log('Error caught!');
+    }
+  }
+}
+
+var g = gen();
+g.next();
+// { value: 42, done: false }
+g.throw(new Error('Something went wrong'));
+// "Error caught!"
+// { value: 42, done: false }
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Generator.throw")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">function*</a></code></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/index.html b/files/es/web/javascript/reference/global_objects/index.html
new file mode 100644
index 0000000000..c6a21b542c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/index.html
@@ -0,0 +1,204 @@
+---
+title: Objetos globales
+slug: Web/JavaScript/Reference/Global_Objects
+tags:
+  - JavaScript
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects
+original_slug: Web/JavaScript/Referencia/Objetos_globales
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<p>Este capítulo documenta todo acerca de estándares de Javascript, los objetos integrados en  JavaScript, así como los métodos y propiedades de cada uno.</p>
+
+<p>El término "objetos globales" (u objetos incorporados estándar) aquí no debe confundirse con el <strong>objeto global</strong>. Aquí, los objetos globales se refieren a <strong>objetos en el ámbito global</strong>. Se puede acceder al <strong>objeto global</strong> en sí usando el operador {{jsxref("Operadores/this", "this")}} en el ámbito global (pero solo si no se usa el modo estricto ECMAScript 5, en ese caso devuelve {{jsxref("undefined")}}). De hecho, el alcance global consiste en las propiedades del objeto global, incluidas las propiedades heredadas, si las hay.</p>
+
+<p>Otros objetos en el alcance global son <a href="/es/docs/Web/JavaScript/Guide/Working_with_Objects#Creating_new_objects">creados por el script de usuario</a> o son proporcionados por la aplicación host. Los objetos host disponibles en los contextos del navegador están documentados en la <span style="line-height: 1.5;"><a href="/es/docs/Web/API/Reference">referencia de la API</a></span>. Para obtener más información acerca de la distinción entre <span style="line-height: 1.5;">el <a href="/es/docs/DOM/DOM_Reference">DOM</a> y el núcleo de <a href="/es/docs/Web/JavaScript">JavaScript</a></span>, <span style="line-height: 1.5;">vea <a href="/es/docs/Web/JavaScript/JavaScript_technologies_overview">Introducción a las tecnologías JavaScript</a>.</span></p>
+
+<h2 id="Objetos_estándar_por_categoría">Objetos estándar por categoría</h2>
+
+<h3 id="Propiedades_de_valor">Propiedades de valor</h3>
+
+<p>Estas propiedades globales devuelven un valor simple; ellos no tienen propiedades o métodos.</p>
+
+<ul>
+ <li>{{jsxref("Infinity")}}</li>
+ <li>{{jsxref("NaN")}}</li>
+ <li>{{jsxref("undefined")}}</li>
+ <li>{{jsxref("null")}} literal</li>
+ <li>{{JSxRef("globalThis")}}</li>
+</ul>
+
+<h3 id="Propiedades_de_funciones">Propiedades de funciones</h3>
+
+<p>Estas funciones globales -funciones llamadas globalmente en lugar de un objeto- devuelven directamente sus resultados a la persona que llama.</p>
+
+<ul>
+ <li>{{jsxref("Objetos_globales/eval", "eval()")}}</li>
+ <li>{{jsxref("Objetos_globales/uneval", "uneval()")}} {{non-standard_inline}}</li>
+ <li>{{jsxref("Objetos_globales/isFinite", "isFinite()")}}</li>
+ <li>{{jsxref("Objetos_globales/isNaN", "isNaN()")}}</li>
+ <li>{{jsxref("Objetos_globales/parseFloat", "parseFloat()")}}</li>
+ <li>{{jsxref("Objetos_globales/parseInt", "parseInt()")}}</li>
+ <li>{{jsxref("Objetos_globales/decodeURI", "decodeURI()")}}</li>
+ <li>{{jsxref("Objetos_globales/decodeURIComponent", "decodeURIComponent()")}}</li>
+ <li>{{jsxref("Objetos_globales/encodeURI", "encodeURI()")}}</li>
+ <li>{{jsxref("Objetos_globales/encodeURIComponent", "encodeURIComponent()")}}</li>
+ <li>{{jsxref("Objetos_globales/escape", "escape()")}} {{deprecated_inline}}</li>
+ <li>{{jsxref("Objetos_globales/unescape", "unescape()")}} {{deprecated_inline}}</li>
+</ul>
+
+<h3 id="Objetos_fundamentales">Objetos fundamentales</h3>
+
+<p>Estos son los objetos fundamentales y básicos sobre los que se basan todos los demás objetos. Esto incluye objetos que representan objetos generales, funciones y errores.</p>
+
+<ul>
+ <li>{{jsxref("Object")}}</li>
+ <li>{{jsxref("Function")}}</li>
+ <li>{{jsxref("Boolean")}}</li>
+ <li>{{jsxref("Symbol")}}</li>
+ <li>{{jsxref("Error")}}</li>
+ <li>{{jsxref("EvalError")}}</li>
+ <li>{{jsxref("InternalError")}}</li>
+ <li>{{jsxref("RangeError")}}</li>
+ <li>{{jsxref("ReferenceError")}}</li>
+ <li>{{jsxref("SyntaxError")}}</li>
+ <li>{{jsxref("TypeError")}}</li>
+ <li>{{jsxref("URIError")}}</li>
+</ul>
+
+<h3 id="Números_y_fechas">Números y fechas</h3>
+
+<p>Estos son los objetos base que representan números, fechas y cálculos matemáticos.</p>
+
+<ul>
+ <li>{{jsxref("Number")}}</li>
+ <li>{{JSxRef("BigInt")}}</li>
+ <li>{{jsxref("Math")}}</li>
+ <li>{{jsxref("Date")}}</li>
+</ul>
+
+<h3 id="Procesamiento_de_texto">Procesamiento de texto</h3>
+
+<p>Estos objetos representan cadenas y soporte para manipularlos.</p>
+
+<ul>
+ <li>{{jsxref("String")}}</li>
+ <li>{{jsxref("RegExp")}}</li>
+</ul>
+
+<h3 id="Colecciones_indexadas">Colecciones indexadas</h3>
+
+<p>Estos objetos representan colecciones de datos que están ordenadas por un valor de índice. Esto incluye matrices (tipadas) y construcciones tipo array.</p>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+ <li>{{jsxref("Int8Array")}}</li>
+ <li>{{jsxref("Uint8Array")}}</li>
+ <li>{{jsxref("Uint8ClampedArray")}}</li>
+ <li>{{jsxref("Int16Array")}}</li>
+ <li>{{jsxref("Uint16Array")}}</li>
+ <li>{{jsxref("Int32Array")}}</li>
+ <li>{{jsxref("Uint32Array")}}</li>
+ <li>{{jsxref("Float32Array")}}</li>
+ <li>{{jsxref("Float64Array")}}</li>
+ <li>{{JSxRef("BigInt64Array")}}</li>
+ <li>{{JSxRef("BigUint64Array")}}</li>
+</ul>
+
+<h3 id="Colecciones_con_clave">Colecciones con clave</h3>
+
+<p>Estos objetos representan colecciones que usan claves; estos contienen elementos que son iterables en el orden de inserción.</p>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("WeakMap")}}</li>
+ <li>{{jsxref("WeakSet")}}</li>
+</ul>
+
+<h3 id="Colecciones_de_vectores">Colecciones de vectores</h3>
+
+<p>Los tipos de datos vectoriales {{Glossary("SIMD")}} son objetos donde los datos se organizan en carriles.</p>
+
+<ul>
+ <li>{{jsxref("SIMD")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Float32x4", "SIMD.Float32x4")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Float64x2", "SIMD.Float64x2")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Int8x16", "SIMD.Int8x16")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Int16x8", "SIMD.Int16x8")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Int32x4", "SIMD.Int32x4")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Uint8x16", "SIMD.Uint8x16")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Uint16x8", "SIMD.Uint16x8")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Uint32x4", "SIMD.Uint32x4")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Bool8x16", "SIMD.Bool8x16")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Bool16x8", "SIMD.Bool16x8")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Bool32x4", "SIMD.Bool32x4")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Bool64x2", "SIMD.Bool64x2")}} {{experimental_inline}}</li>
+</ul>
+
+<h3 id="Datos_estructurados">Datos estructurados</h3>
+
+<p>Estos objetos representan e interactúan con los búferes de datos estructurados y los datos codificados utilizando la notación de objetos JavaScript (JSON del inglés <strong>J</strong>ava<strong>S</strong>cript <strong>O</strong>bject <strong>N</strong>otation).</p>
+
+<ul>
+ <li>{{jsxref("ArrayBuffer")}}</li>
+ <li>{{jsxref("SharedArrayBuffer")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Atomics")}} {{experimental_inline}}</li>
+ <li>{{jsxref("DataView")}}</li>
+ <li>{{jsxref("JSON")}}</li>
+</ul>
+
+<h3 id="Objetos_de_abstracción_de_control">Objetos de abstracción de control</h3>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+ <li>{{jsxref("Generator")}}</li>
+ <li>{{jsxref("GeneratorFunction")}}</li>
+ <li>{{experimental_inline}} {{jsxref("AsyncFunction")}}</li>
+</ul>
+
+<h3 id="Reflexión">Reflexión</h3>
+
+<ul>
+ <li>{{jsxref("Reflect")}}</li>
+ <li>{{jsxref("Proxy")}}</li>
+</ul>
+
+<h3 id="Internacionalización">Internacionalización</h3>
+
+<p>Adiciones al núcleo de ECMAScript para funcionalidades sensibles al lenguaje.</p>
+
+<ul>
+ <li>{{jsxref("Intl")}}</li>
+ <li>{{jsxref("Objetos_globales/Collator", "Intl.Collator")}}</li>
+ <li>{{jsxref("Objetos_globales/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
+ <li>{{jsxref("Objetos_globales/NumberFormat", "Intl.NumberFormat")}}</li>
+</ul>
+
+<h3 id="WebAssembly">WebAssembly</h3>
+
+<ul>
+ <li>{{jsxref("WebAssembly")}}</li>
+ <li>{{jsxref("WebAssembly.Module")}}</li>
+ <li>{{jsxref("WebAssembly.Instance")}}</li>
+ <li>{{jsxref("WebAssembly.Memory")}}</li>
+ <li>{{jsxref("WebAssembly.Table")}}</li>
+ <li>{{jsxref("WebAssembly.CompileError")}}</li>
+ <li>{{jsxref("WebAssembly.LinkError")}}</li>
+ <li>{{jsxref("WebAssembly.RuntimeError")}}</li>
+</ul>
+
+<h3 id="Otro">Otro</h3>
+
+<ul>
+ <li>
+  <article>
+  <p>{{JSxRef("Functions/arguments", "arguments")}}</p>
+  </article>
+
+  <article>
+  <header></header>
+  </article>
+ </li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/infinity/index.html b/files/es/web/javascript/reference/global_objects/infinity/index.html
new file mode 100644
index 0000000000..bd717d1021
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/infinity/index.html
@@ -0,0 +1,97 @@
+---
+title: Infinity
+slug: Web/JavaScript/Reference/Global_Objects/Infinity
+tags:
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Global_Objects/Infinity
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Infinity
+---
+<div>
+ {{jsSidebar("Objects")}}</div>
+<h2 id="Resumen">Resumen</h2>
+<p>La propiedad global <strong><code>Infinity </code></strong>es un valor numérico que representa el infinito.</p>
+<p>{{js_property_attributes(0,0,0)}}</p>
+<h2 id="Sintaxis">Sintaxis</h2>
+<pre class="brush: js">Infinity</pre>
+<h2 id="Description" name="Description" style="padding-top: 0px; padding-left: 0px; border: 0px; line-height: 24px;">Description</h2>
+<p><code>Infinity </code>es una del objeto global, es decir, esta es una variable de alcance global.</p>
+<p>El valor inicial de <code>Infinity</code> es {{jsxref("Number.POSITIVE_INFINITY")}}. El valor de <code>Infinity</code> (infinito positivo) es mayor que cualquier otro numero incluido el mismo. Este valor se comporta matematicamente como el infinito matemático; por ejemplo, cualquier numero multiplicado por <code>Infinity</code> da como resultado <code>Infinity</code>, y cualquier numero divido por <code>Infinity</code> da como resultado cero.</p>
+<p>Para la especificación ECMAScript 5, <code>Infinity </code>es de solo lectura (implementado en JavaScript 1.8.5  / Firefox 4).</p>
+<h2 id="Especificaciones">Especificaciones</h2>
+<table class="standard-table" style="">
+ <tbody>
+  <tr>
+   <th scope="col" style="font-style: inherit;">Especificación</th>
+   <th scope="col" style="font-style: inherit;">Estado</th>
+   <th scope="col" style="font-style: inherit;">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1ra edición.</td>
+   <td>Estándar</td>
+   <td>Definición inicial. Implementada en JavaScript 1.3</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.1.1.2', 'Infinity')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-value-properties-of-the-global-object-infinity', 'Infinity')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Compatibilidad_con_navegadores" style="margin-bottom: 20px; padding-top: 0px; padding-left: 0px; font-size: 28px; border: 0px; line-height: 28px;">Compatibilidad con navegadores</h2>
+<p style="padding-top: 0px; padding-left: 0px; border: 0px;">{{ CompatibilityTable() }}</p>
+<div id="compat-desktop" style="padding-top: 0px; padding-left: 0px; border: 0px;">
+ <table class="compat-table" style="">
+  <tbody>
+   <tr>
+    <th style="font-style: inherit; line-height: 16px;">Característica</th>
+    <th style="font-style: inherit; line-height: 16px;">Chrome</th>
+    <th style="font-style: inherit; line-height: 16px;">Firefox (Gecko)</th>
+    <th style="font-style: inherit; line-height: 16px;">Internet Explorer</th>
+    <th style="font-style: inherit; line-height: 16px;">Opera</th>
+    <th style="font-style: inherit; line-height: 16px;">Safari</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile" style="padding-top: 0px; padding-left: 0px; border: 0px;">
+ <table class="compat-table" style="">
+  <tbody>
+   <tr>
+    <th style="font-style: inherit; line-height: 16px;">Característica</th>
+    <th style="font-style: inherit; line-height: 16px;">Android</th>
+    <th style="font-style: inherit; line-height: 16px;">Chrome for Android</th>
+    <th style="font-style: inherit; line-height: 16px;">Firefox Mobile (Gecko)</th>
+    <th style="font-style: inherit; line-height: 16px;">IE Mobile</th>
+    <th style="font-style: inherit; line-height: 16px;">Opera Mobile</th>
+    <th style="font-style: inherit; line-height: 16px;">Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h2 id="See_also" name="See_also" style="margin-bottom: 20px; padding-top: 0px; padding-left: 0px; font-size: 28px; border: 0px; line-height: 28px;">Ver también</h2>
+<ul>
+ <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li>
+ <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/internalerror/index.html b/files/es/web/javascript/reference/global_objects/internalerror/index.html
new file mode 100644
index 0000000000..c98fdd6103
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/internalerror/index.html
@@ -0,0 +1,99 @@
+---
+title: InternalError
+slug: Web/JavaScript/Reference/Global_Objects/InternalError
+tags:
+  - Clase
+  - Class
+  - InternalError
+  - JavaScript
+  - Objeto
+translation_of: Web/JavaScript/Reference/Global_Objects/InternalError
+original_slug: Web/JavaScript/Referencia/Objetos_globales/InternalError
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>El objeto <strong><code>InternalError</code></strong> indica un error que se produjo internamente en el motor JavaScript.</p>
+
+<p>Los principalmente casos de ejemplo son cuando algo es demasiado grande, por ejemplo:</p>
+
+<ul>
+ <li>"demasiados casos del switch",</li>
+ <li>"demasiados paréntesis en la expresión regular",</li>
+ <li>"iniciador de arreglo demasiado grande",</li>
+ <li>"demasiada recursividad".</li>
+</ul>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{JSxRef("Global_Objects/InternalError/InternalError", "InternalError()")}}</dt>
+ <dd>Crea un nuevo objeto <code>InternalError</code>.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{jsxref("Error.prototype.message", "InternalError.prototype.message")}}</dt>
+ <dd>Mensaje de error. Heredado de {{JSxRef("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.name", "InternalError.prototype.name")}}</dt>
+ <dd>Nombre del error. Heredado de {{JSxRef("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.fileName", "InternalError.prototype.fileName")}}</dt>
+ <dd>Ruta al archivo que generó este error. Heredado de {{JSxRef("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.lineNumber", "InternalError.prototype.lineNumber")}}</dt>
+ <dd>Número de línea en el archivo que generó este error. Heredado de {{JSxRef("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.columnNumber", "InternalError.prototype.columnNumber")}}</dt>
+ <dd>Número de columna en la línea que generó este error. Heredado de {{JSxRef("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.stack", "InternalError.prototype.stack")}}</dt>
+ <dd>Seguimiento de la pila. Heredado de {{JSxRef("Error")}}.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Demasiada_recursividad">Demasiada recursividad</h3>
+
+<p>Esta función recursiva se ejecuta 10 veces, según la condición de salida.</p>
+
+<pre class="brush: js notranslate">function loop(x) {
+  if (x &gt;= 10) // "x &gt;= 10" es la condición de salida
+    return;
+  // hacer cosas
+  loop(x + 1); // la llamada recursiva
+}
+loop(0);</pre>
+
+<p>Establecer esta condición en un valor extremadamente alto, no funcionará:</p>
+
+<pre class="brush: js example-bad notranslate">function loop(x) {
+  if (x &gt;= 1000000000000)
+    return;
+  // hacer cosas
+  loop(x + 1);
+}
+loop(0);
+
+// InternalError: demasiada recursividad</pre>
+
+<p>Para obtener más información, consulta {{JSxRef("Errors/Too_much_recursion", "InternalError: demasiada recursividad.")}}</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p><span class="pl-s">No forma parte de ningún estándar.</span></p>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.InternalError")}}</p>
+</div>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Error")}}</li>
+ <li>
+  <p>{{JSxRef("Errors/Too_much_recursion", "demasiada recursividad")}}</p>
+ </li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/internalerror/internalerror/index.html b/files/es/web/javascript/reference/global_objects/internalerror/internalerror/index.html
new file mode 100644
index 0000000000..6cc945000e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/internalerror/internalerror/index.html
@@ -0,0 +1,56 @@
+---
+title: Constructor InternalError()
+slug: Web/JavaScript/Reference/Global_Objects/InternalError/InternalError
+tags:
+  - Constructor
+  - JavaScript
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/InternalError/InternalError
+original_slug: >-
+  Web/JavaScript/Referencia/Objetos_globales/InternalError/Constructor_InternalError
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>El constructor <strong><code>InternalError()</code></strong> crea un error que indica un error que ocurrió internamente en el motor de JavaScript. Por ejemplo: <strong>"InternalError</strong>: demasiada recursividad".</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">new InternalError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>message</code></dt>
+ <dd>Opcional. Una descripción del error legible para los humanos.</dd>
+ <dt><code>fileName</code></dt>
+ <dd>Opcional. El nombre del archivo que contiene el código que provocó la excepción.</dd>
+ <dt><code>lineNumber</code></dt>
+ <dd>Opcional. El número de línea del código que provocó la excepción.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Crear_un_nuevo_InternalError">Crear un nuevo <code>InternalError</code></h3>
+
+<pre class="brush: js notranslate">new InternalError("Fallo del motor");
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p><span class="pl-s">No forma parte de ningún estándar.</span></p>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.InternalError.InternalError")}}</p>
+</div>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Error")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/intl/index.html b/files/es/web/javascript/reference/global_objects/intl/index.html
new file mode 100644
index 0000000000..68f973b6ca
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/intl/index.html
@@ -0,0 +1,127 @@
+---
+title: Intl
+slug: Web/JavaScript/Reference/Global_Objects/Intl
+translation_of: Web/JavaScript/Reference/Global_Objects/Intl
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Intl
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto de ámbito global <strong><code>Intl</code></strong> es el espacio de nombres para el API de Internacionalización de ECMAScript, éste provee comparación de cadenas y formato de números, fechas y tiempos con sensibilidad al lenguaje. Los constructores para los objetos {{jsxref("Collator")}}, {{jsxref("NumberFormat")}}, y {{jsxref("DateTimeFormat")}} son propiedades del objeto <code>Intl</code>. En ésta página se documentan tales propiedades, así como la funcionalidad común a los constructores de internacionalización y otras funciones sensibles al lenguaje.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</dt>
+ <dd>Constructor para collators, objetos que permiten la comparación de cadenas con sensibilidad al lenguaje.</dd>
+ <dt>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</dt>
+ <dd>Constructor para objetos que permiten el formato de fecha y tiempos con sensibilidad al lenguaje.</dd>
+ <dt>{{jsxref("Global_Objects/NumberFormat", "Intl.NumberFormat")}}</dt>
+ <dd>Constructor para objetos que permiten el formato de números con sensibilidad al lenguaje.</dd>
+ <dt>{{jsxref("Global_Objects/PluralRules", "Intl.PluralRules")}}</dt>
+ <dd><em>Por definir</em></dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Intl.getCanonicalLocales()")}}</dt>
+ <dd>Método que retorna los nombres canónicos de las diferentes variantes de lenguaje.</dd>
+</dl>
+
+<h2 id="Identificación_de_variantes_de_lenguaje_y_negociación">Identificación de variantes de lenguaje y negociación</h2>
+
+<p>Los constructores de internacionalización, así como otros metodos de constructores sensibles al lenguaje (listados bajo {{anch("See_also", "Ver más")}}) siguen un mismo patrón para identificar variantes de lenguaje y determinar aquella a utilizar: todos aceptan los argumentos <code>locales</code> y <code>options</code>, y negocian las variantes requeridas contra aquellas que soportan utilizando un algoritmo especificado en la propiedad <code>options.localeMatcher</code>.</p>
+
+<h3 id="locales"><code>locales</code></h3>
+
+<p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">El argumento </span></font>locales</code> debe ser tanto una cadena que contenga una  <a href="http://tools.ietf.org/html/rfc5646">Etiqueta de Idioma BCP 47</a>, o una matriz de etiquetas de dicho idioma. Si el argumento <code>locales</code> no es provisto o es indefinido, será usado la localicacion predeterminada.</p>
+
+<p>Una etiqueta de idioma BCP 47 define un idioma y minimamente contiene un código primario de idioma. En estos la forma mas comun puede contener, : un código de idioma, un código del sistema de escritura, y un código de país o región, todo separado por guiones. Mientras la etiqueta no es case sensitive, es recomendable usar un titulo para el código del sistema de escritura, mayúsculas para el país y región y minúsculas para todo lo demás.</p>
+
+<p>Ejemplos:</p>
+
+<ul>
+ <li><code>"hi"</code>: Hindi (idioma principal).</li>
+ <li><code>"de-AT"</code>: Alemán usado en Austria (idioma principal con código del país).</li>
+ <li><code>"zh-Hans-CN"</code>: Escritura China en caracteres simplificados como se usa en China (idioma principal con código de escritura y código del país).</li>
+</ul>
+
+<p>Las subetiquetas que identifican idiomas, scripts, países (regiones), y (raramente utilizadas) variantes en las etiquetas de idiomas BCP 47 pueden ser encontradas en el <a href="http://www.iana.org/assignments/language-subtag-registry">Registro de subetiquetas de idioma de la IANA</a>.</p>
+
+<p>BCP 47 permite también extensiones. Las funciones de internacionalización de JavaScript utilizan la extensión <code>"u"</code> (Unicode), misma que puede emplearse para requerir personalizacioón de los objetos {{jsxref("Collator")}}, {{jsxref("NumberFormat")}}, o {{jsxref("DateTimeFormat")}}. A continuación algunos ejemplos:</p>
+
+<ul>
+ <li><code>"de-DE-u-co-phonebk"</code>: Utiliza la variante de guía telefónica del orden de clasificación alemán, que expande las vocales con umlaut a pares de caracteres: ä → ae, ö → oe, ü → ue.</li>
+ <li><code>"th-TH-u-nu-thai"</code>: Utiliza dígitos tailandeses (๐, ๑, ๒, ๓, ๔, ๕, ๖, ๗, ๘, ๙) para formatear números.</li>
+ <li><code>"ja-JP-u-ca-japanese"</code>: Use the Japanese calendar in date and time formatting, so that 2013 is expressed as the year 25 of the Heisei period, or 平成25.</li>
+ <li><code>"en-GB-u-ca-islamic"</code>: use British English with the Islamic (Hijri) calendar, where the Gregorian date 14 October, 2017 is the Hijri date 24 Muharram, 1439.</li>
+</ul>
+
+<h3 id="Locale_negotiation">Locale negotiation</h3>
+
+<p>The <code>locales</code> argument, after stripping off all Unicode extensions, is interpreted as a prioritized request from the application. The runtime compares it against the locales it has available and picks the best one available. Two matching algorithms exist: the <code>"lookup"</code> matcher follows the Lookup algorithm specified in <a href="http://tools.ietf.org/html/rfc4647#section-3.4">BCP 47</a>; the <code>"best fit"</code> matcher lets the runtime provide a locale that's at least, but possibly more, suited for the request than the result of the Lookup algorithm. If the application doesn't provide a <code>locales</code> argument, or the runtime doesn't have a locale that matches the request, then the runtime's default locale is used. The matcher can be selected using a property of the <code>options</code> argument (see below).</p>
+
+<p>If the selected language tag had a Unicode extension substring, that extension is now used to customize the constructed object or the behavior of the function. Each constructor or function supports only a subset of the keys defined for the Unicode extension, and the supported values often depend on the language tag. For example, the <code>"co"</code> key (collation) is only supported by {{jsxref("Collator")}}, and its <code>"phonebk"</code> value is only supported for German.</p>
+
+<h3 id="options_argument"><code>options</code> argument</h3>
+
+<p>The <code>options</code> argument must be an object with properties that vary between constructors and functions. If the <code>options</code> argument is not provided or is undefined, default values are used for all properties.</p>
+
+<p>One property is supported by all language sensitive constructors and functions: The <code>localeMatcher</code> property, whose value must be a string <code>"lookup"</code> or <code>"best fit"</code> and which selects one of the locale matching algorithms described above.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 1.0', '#sec-8', 'Intl')}}</td>
+   <td>{{Spec2('ES Int 1.0')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 2.0', '#sec-8', 'Intl')}}</td>
+   <td>{{Spec2('ES Int 2.0')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#intl-object', 'Intl')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td>Added Intl.getCanonicalLocales in the 4th edition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Intl")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>Introduction: <a href="http://norbertlindenberg.com/2012/12/ecmascript-internationalization-api/index.html">The ECMAScript Internationalization API</a></li>
+ <li>Constructors
+  <ul>
+   <li>{{jsxref("Collator", "Intl.Collator")}}</li>
+   <li>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}</li>
+   <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li>
+  </ul>
+ </li>
+ <li>Methods
+  <ul>
+   <li>{{jsxref("String.prototype.localeCompare()")}}</li>
+   <li>{{jsxref("Number.prototype.toLocaleString()")}}</li>
+   <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
+   <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
+   <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/intl/numberformat/format/index.html b/files/es/web/javascript/reference/global_objects/intl/numberformat/format/index.html
new file mode 100644
index 0000000000..d961b0fcbe
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/intl/numberformat/format/index.html
@@ -0,0 +1,93 @@
+---
+title: Intl.NumberFormat.prototype.format()
+slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format
+translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat/format
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Intl.NumberFormat.prototype.format()</code></strong> formatea un número de acuerdo con la configuración regional y las opciones de formato de este objeto {{jsxref("NumberFormat")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/intl-numberformat-prototype-format.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code><var>numberFormat</var>.format(<var>number</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>number</code></dt>
+ <dd>A {{jsxref("Number")}} or {{jsxref("BigInt")}} to format.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>The <code>format</code> getter function formats a number into a string according to the locale and formatting options of this {{jsxref("NumberFormat")}} object.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_format">Usando <code>format</code></h3>
+
+<p>Use the <code>format</code> getter function for formatting a single currency value, here for Russia:</p>
+
+<pre class="brush: js">var options = { style: 'currency', currency: 'RUB' };
+var numberFormat = new Intl.NumberFormat('ru-RU', options);
+console.log(numberFormat.format(654321.987));
+// → "654 321,99 руб."
+</pre>
+
+<h3 id="Usando_format_con_map">Usando <code>format</code> con <code>map</code></h3>
+
+<p>Use the <code>format</code> getter function for formatting all numbers in an array. Note that the function is bound to the {{jsxref("NumberFormat")}} from which it was obtained, so it can be passed directly to {{jsxref("Array.prototype.map")}}.</p>
+
+<pre class="brush: js">var a = [123456.789, 987654.321, 456789.123];
+var numberFormat = new Intl.NumberFormat('es-ES');
+var formatted = a.map(numberFormat.format);
+console.log(formatted.join('; '));
+// → "123.456,789; 987.654,321; 456.789,123"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 1.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}</td>
+   <td>{{Spec2('ES Int 1.0')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 2.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}</td>
+   <td>{{Spec2('ES Int 2.0')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sec-intl.numberformat.prototype.format', 'Intl.NumberFormat.prototype.format')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Intl.NumberFormat.format")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li>
+ <li>{{jsxref("Number.prototype.toLocaleString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/intl/numberformat/index.html b/files/es/web/javascript/reference/global_objects/intl/numberformat/index.html
new file mode 100644
index 0000000000..05a8b8f4b5
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/intl/numberformat/index.html
@@ -0,0 +1,189 @@
+---
+title: Intl.NumberFormat
+slug: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
+translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat
+---
+<div>{{JSRef("Global_Objects", "NumberFormat", "Intl,Collator,DateTimeFormat")}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El objeto <strong><code>Intl.NumberFormat</code></strong> es un constructor para objetos que permiten un formato numérico sensible al idioma.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">new Intl.NumberFormat([locales [, <em>options</em>]])
+
+Intl.<code>NumberFormat</code>.call(<em>this</em> [, locales [, <em>options</em>]])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>locales</code></dt>
+ <dd>
+ <p>Cadena o arreglo de cadenas identificadoras para el código de idioma, conforme a BCP 47. Para mayor información con respecto a la forma e interpretación del argumento <code>locales</code>, visite el siguiente enlace: <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation" title="/Intl#Functionality_common_to_internationalization_constructors">página de Intl</a>. Se admite la siguiente clave de extension Unicode:</p>
+
+ <dl>
+  <dt>nu</dt>
+  <dd>El sistema numérico a ser utilizado. Los siguientes son valores admisibles: "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt".</dd>
+ </dl>
+ </dd>
+ <dt><code>options</code></dt>
+ <dd>
+ <p>Objeto con alguna o todas las propiedas listadas a continuación:</p>
+
+ <dl>
+  <dt><code>localeMatcher</code></dt>
+  <dd>Algoritmo a emplear para establecer el idioma. Los valores admitidos son "lookup" (coincidencia exacta) y "best fit" (mejor coincidencia); el valor por defecto es "best fit". Para mayor información respecto a esta opción visite el siguiente enlace: <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_negotiation" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_negotiation">página de Intl</a>.</dd>
+  <dt><code>style</code></dt>
+  <dd>El estilo de formato a utilizar. Los valores admisibles son "decimal" para un formato numérico simple, "currency" para un formato de divisa, y "percent" para un formato porcentual; el valor por defecto es "decimal".</dd>
+  <dt><code>currency</code></dt>
+  <dd>La divisa a utilizar para el formato de divisa. Los valores admisibles son los establecidos en ISO 4217, por ejemplo "USD" para el dólar americano, "EUR" para el euro, o "CNY" para el RMB chino - para mayor información se recomienda visitar el siguiente enlace: l<a href="http://www.currency-iso.org/en/home/tables/table-a1.html" title="http://www.currency-iso.org/en/home/tables/table-a1.html">ista actual de códigos de divisa y fondos</a>. No existe un valor por defecto, por lo que si es valor del parámetro <code>style</code> es "currency", deberá proveerse también un valor para la propiedad <code>currency</code>.</dd>
+  <dt><code>currencyDisplay</code></dt>
+  <dd>Descriptor a utilizar para denotar el valor expresado como divisa. Los valores admisibles son "symbol" para utilizar el símbolo local a su contexto, por ejemplo €, "code" para utilizar el código de divisa ISO, "name" para utilizar el nombre local de la divisa, por ejemplo "dollar"; el valor por defecto es "symbol".</dd>
+  <dt><code>useGrouping</code></dt>
+  <dd>Si deberán emplearse o no separadores para agrupamiento, como es el caso de los separadores para millares o separadores millares/lakh/crore. Los valores admisibles son <code>true</code> y <code>false</code>; el valor por defecto es <code>true</code>.</dd>
+ </dl>
+
+ <p>Las propiedades descritas a continuación se dividen en dos grupos: por un lado <code>minimumIntegerDigits</code>, <code>minimumFractionDigits</code> y <code>maximumFractionDigits</code>, por el otro <code>minimumSignificantDigits</code> y <code>maximumSignificantDigits</code>. Si al menos una propiedad del segundo grupo es definida, todas aquellas del primero serán ignoradas.</p>
+
+ <dl>
+  <dt><code>minimumIntegerDigits</code></dt>
+  <dd>El número mínimo de digitos enteros a utilizar. El rango de valores admisibles va desde 1 hasta 21; el valor por defecto es 1.</dd>
+  <dt><code>minimumFractionDigits</code></dt>
+  <dd>El número mínimo de digitos fraccionarios a utilizar. El rango de valores admisibles va desde 0 hasta 20; el valor por defecto para formato simple y porcentual es 0; el valor por defecto para formato de divisa es el indicado en la <a href="http://www.currency-iso.org/en/home/tables/table-a1.html" title="http://www.currency-iso.org/en/home/tables/table-a1.html">lista de códigos de moneda ISO 4217</a> para subdivisiones de tal divisa (o 2 si la lista no establece un valor).</dd>
+  <dt><code>maximumFractionDigits</code></dt>
+  <dd>El número máximo de dígitos de fraccionarios a utilizar. El rango de valores admisibles va desde 0 hasta 20; el valor por defecto para formato simple es el valor más alto admisible en <code>minimumFractionDigits</code> y 3; el valor por defecto para el formato de moneda es el valor más alto admisible en <code>minimumFractionDigits</code> y el indicado en la <a href="http://www.currency-iso.org/en/home/tables/table-a1.html" title="http://www.currency-iso.org/en/home/tables/table-a1.html">lista de cógidos de moneda ISO 4217</a> para subdivisiones de tal divisa (o 2 si la lista no establece un valor); el valor por defecto en el formato porcentual es el valor más alto admisible en <code>minimumFractionDigits</code> y 0.</dd>
+  <dt><code>minimumSignificantDigits</code></dt>
+  <dd>El número mínimo de dígitos significativos a utilizar. El rango de valores admisibles va desde 1 hasta 21; el valor por defecto es 1.</dd>
+  <dt><code>maximumSignificantDigits</code></dt>
+  <dd>El número máximo de dígitos significativos a utilizar. El rango de valores admisibles va desde 1 hasta 21; el valor por defecto es <code>minimumSignificantDigits</code>.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<h3 id="Properties" name="Properties">Propiedades</h3>
+
+<dl>
+ <dt>{{jsxref("NumberFormat.prototype", "Intl.NumberFormat.prototype")}}</dt>
+ <dd>Permite agregar nuevas propiedades a todos los objetos.</dd>
+</dl>
+
+<h3 id="Métodos">Métodos</h3>
+
+<dl>
+ <dt>{{jsxref("NumberFormat.supportedLocalesOf", "Intl.NumberFormat.supportedLocalesOf()")}}</dt>
+ <dd>Regresa un arreglo con aquellos códigos de idioma proveídos y que son soportados sin necesidad de recurrir a la configuración por defecto en el entorno de ejecucion.</dd>
+</dl>
+
+<h2 id="Instancias_NumberFormat">Instancias <code>NumberFormat</code></h2>
+
+<h3 id="Propiedades">Propiedades</h3>
+
+<p>Toda instancia de <code>NumberFormat</code> hereda las siguientes propiedades de su prototipo:</p>
+
+<div>{{page('en-US/docs/JavaScript/Reference/Global_Objects/NumberFormat/prototype','Properties')}}</div>
+
+<h3 id="Métodos_2">Métodos</h3>
+
+<div>
+<p>Toda instancia de <code>NumberFormat </code>hereda los siguientes métodos de su prototipo:</p>
+{{page('en-US/docs/JavaScript/Reference/Global_Objects/NumberFormat/prototype','Methods')}}</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Al no especificar un código de idioma, se regresa una cadena con el formato correspondiente al código de idioma y opciones disponibles por defecto en el entorno de ejecución.</p>
+
+<pre class="brush: js">var number = 3500;
+
+alert(new Intl.NumberFormat().format(number));
+// → "3,500" si el código de idioma es US English
+</pre>
+
+<h3 id="Example_Using_locales" name="Example:_Using_locales">Ejemplo: Utilizando <code>locales</code></h3>
+
+<p>Este ejemplo muestra algunas de las variantes en formato numérico con diferentes contextos locales. A fin de emplear el idioma correspondiente a aquél en la interfaz del usuario para su aplicación, asegúrese de especificar dicho idioma ( y de ser posible alternativas) utilizando el argumento <code>locales</code>:</p>
+
+<pre class="brush: js">var number = 123456.789;
+
+// En el alemán la coma se utiliza como separador decimal y el punto para los millares
+alert(new Intl.NumberFormat("de-DE").format(number));
+// → 123.456,789
+
+// En la mayoría de los países de lengua arábiga se utilizan también símbolos arábigos
+alert(new Intl.NumberFormat("ar-EG").format(number));
+// → ١٢٣٤٥٦٫٧٨٩
+
+// En la India se utilizan separadores millares/lakh/crore
+alert(new Intl.NumberFormat("en-IN").format(number));
+// → 1,23,456.789
+
+// use de nu para establecer un sistema numérico, el sistema decimal chino por ejemplo
+alert(new Intl.NumberFormat("zh-Hans-CN-u-nu-hanidec").format(number));
+// → 一二三,四五六.七八九
+
+// cuando se requiera un lenguaje que pudiera no ser soportado, como es el caso del Balinés
+// se recomienda incluir un lenguaje alternativo, en éste caso Indonesio
+alert(new Intl.NumberFormat(["ban", "id"]).format(number));
+// → 123.456,789
+</pre>
+
+<h3 id="Example_Using_options" name="Example:_Using_options">Ejemplo: Utilizando <code>options</code></h3>
+
+<p>El valor que regresa la función <code>toLocaleString</code> puede ser modificado utilizando el argumento <code>options</code>:</p>
+
+<pre class="brush: js">var number = 123456.789;
+
+// se establece un formato de divisa
+alert(new Intl.NumberFormat("de-DE", {style: "currency", currency: "EUR"}).format(number));
+// → 123.456,79 €
+
+// el yen japonés no tiene ninguna subdivisión
+alert(new Intl.NumberFormat("ja-JP", {style: "currency", currency: "JPY"}).format(number))
+// → ￥123,457
+
+// limitamos a tres los dígitos significativos
+alert(new Intl.NumberFormat("en-IN", {maximumSignificantDigits: 3}).format(number));
+// → 1,23,000
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado actual</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 1.0', '#sec-11.1', 'Intl.NumberFormat')}}</td>
+   <td>{{Spec2('ES Int 1.0')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 2.0', '#sec-11.1', 'Intl.NumberFormat')}}</td>
+   <td>{{Spec2('ES Int 2.0')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#numberformat-objects', 'Intl.NumberFormat')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Intl.NumberFormat")}}</p>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<p>{{page('en-US/docs/JavaScript/Reference/Global_Objects/Intl','See_also')}}</p>
diff --git a/files/es/web/javascript/reference/global_objects/intl/relativetimeformat/index.html b/files/es/web/javascript/reference/global_objects/intl/relativetimeformat/index.html
new file mode 100644
index 0000000000..1c68b6827b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/intl/relativetimeformat/index.html
@@ -0,0 +1,107 @@
+---
+title: Intl.RelativeTimeFormat
+slug: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat
+tags:
+  - RelatimeTimeFormat
+translation_of: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Intl/RelativeTimeFormat
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>Intl.RelativeTimeFormat</code></strong> te proporciona una manera de formatear tiempos relativos con traducciones.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/intl-relativetimeformat.html")}}</div>
+
+<p class="hidden">El código de este ejemplo interactivo está disponible en un repositorio GitHub. Si quieres contribuir a los ejemplos interactivos del proyecto, por favor, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y manda una Pull Request.</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{jsxref("RelativeTimeFormat.RelativeTimeFormat()", "Intl.RelativeTimeFormat.RelativeTimeFormat()")}}</dt>
+ <dd>Crea una nueva instancia de <code>Intl.RelativeTimeFormat</code>.</dd>
+</dl>
+
+<h2 id="Métodos_estáticos">Métodos estáticos</h2>
+
+<dl>
+ <dt>{{jsxref("RelativeTimeFormat.supportedLocalesOf", "Intl.RelativeTimeFormat.supportedLocalesOf()")}}</dt>
+ <dd>Devuelve un {{jsxref("Array")}} con todos los idiomas disponibles sin necesidad de usar el que hay por defecto.</dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt>{{jsxref("RelativeTimeFormat.format", "Intl.RelativeTimeFormat.prototype.format()")}}</dt>
+ <dd>Formatea <code>value</code> y <code>unit</code> conforme al idioma y las opciones de formateo al crear la instancia con <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl.RelativeTimeFormat"><code>Intl.RelativeTimeFormat</code></a>.</dd>
+ <dt>{{jsxref("RelativeTimeFormat.formatToParts", "Intl.RelativeTimeFormat.prototype.formatToParts()")}}</dt>
+ <dd>Devuelve un {{jsxref("Array")}} de objetos representando el tiempo relativo en partes que pueden ser usadas en traducciones.</dd>
+ <dt>{{jsxref("RelativeTimeFormat.resolvedOptions", "Intl.RelativeTimeFormat.prototype.resolvedOptions()")}}</dt>
+ <dd>Devuelve un nuevo objeto con las propiedades que reflejan las opciones de localización y formato usadas durante la inicialización del objeto.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_básico">Ejemplo básico</h3>
+
+<p>El siguiente ejemplo muestra cómo conseguir el tiempo relativo para el mejor idioma según el usuario.</p>
+
+<pre class="brush: js notranslate">// Crea un formateador de tiempo relativo en tu lenguaje
+// con los valores por defectos pasados expresamente.
+const rtf = new Intl.RelativeTimeFormat("en", {
+    localeMatcher: "best fit", // otros valores: "lookup"
+    numeric: "always", // otros valores: "auto"
+    style: "long", // otros valores: "short" or "narrow"
+});
+
+// Formatea el tiempo relativo con valores negativos (-1).
+rtf.format(-1, "day");
+// &gt; "Hace 1 día"
+
+// Formatea el tiempo relativo con valores positivos (1).
+rtf.format(1, "day");
+// &gt; "Dentro de 1 día"</pre>
+
+<h3 id="Usando_formatToParts">Usando <code>formatToParts</code></h3>
+
+<p>El siguiente ejemplo muestra cómo crear un formateador de tiempo relativo que devuelve las partes separadas:</p>
+
+<pre class="brush: js notranslate">const rtf = new Intl.RelativeTimeFormat("es", { numeric: "auto" });
+
+// Formatea el tiempo relativo usando día como unidad.
+rtf.formatToParts(-1, "day");
+// &gt; [{ type: "literal", value: "ayer"}]
+
+rtf.formatToParts(100, "day");
+// &gt; [{ type: "literal", value: "Dentro de " },
+// &gt;  { type: "integer", value: "100", unit: "day" },
+// &gt;  { type: "literal", value: " días" }]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#relativetimeformat-objects', 'RelativeTimeFormat')}}</td>
+   <td></td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad es generada a partir de datos estructurados. Si quieres contribuir, por favor, revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una Pull Request.</div>
+
+<p>{{Compat("javascript.builtins.Intl.RelativeTimeFormat")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://developers.google.com/web/updates/2018/10/intl-relativetimeformat">The Intl.RelativeTimeFormat API</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/isfinite/index.html b/files/es/web/javascript/reference/global_objects/isfinite/index.html
new file mode 100644
index 0000000000..055415e504
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/isfinite/index.html
@@ -0,0 +1,115 @@
+---
+title: isFinite()
+slug: Web/JavaScript/Reference/Global_Objects/isFinite
+tags:
+  - Function
+  - JavaScript
+  - isFinite()
+translation_of: Web/JavaScript/Reference/Global_Objects/isFinite
+original_slug: Web/JavaScript/Referencia/Objetos_globales/isFinite
+---
+<div>
+ {{jsSidebar("Objects")}}</div>
+<h2 id="Resumen">Resumen</h2>
+<p>La función global <strong><code>isFinite()</code></strong> determina si el valor que se le pasa como argumento es un numero finito. Si es necesario, realiza una conversión a un numero al parametro pasado.</p>
+<h2 id="Sintaxis">Sintaxis</h2>
+<pre><code>isFinite(testValue)</code></pre>
+<h2 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h2>
+<dl>
+ <dt>
+  <code>testvalue</code></dt>
+ <dd>
+  Valor a ser evaluado.</dd>
+</dl>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p><code>isFinite</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
+<p>Puede usar esta función para determinar si un número es un número finito. La función <code>isFinite</code> examina el número de su argumento. Si el argumento es <code>NaN</code>, infinito positivo o infinito negativo, este método devuelve <code>false</code>, de otro modo devuelve <code>true</code>.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<pre>isFinite(Infinity);    // falso
+isFinite(NaN);         // falso
+isFinite(-Inifinity);  // falso
+
+isFinite(0);           // verdadero
+isFinite(2e64);        // verdadero
+
+isFinite("0");         // verdadero, hubiera sido falso en el caso de usar Number.isFinite("0") que es mas robusta</pre>
+<h2 id="Especificaciones">Especificaciones</h2>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 2nd Edition.</td>
+   <td>Estándar</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.1.2.5', 'isFinite')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-isfinite-number', 'isFinite')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>Soprte básico</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Android</th>
+    <th>Chrome for Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li><code><strong>Number.isFinite()</strong></code></li>
+ <li><strong><code>Number.NaN()</code></strong></li>
+ <li><a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/POSITIVE_INFINITY"><code><strong>Number.POSITIVE_INFINITY</strong></code></a></li>
+ <li><a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/NEGATIVE_INFINITY"><code><strong>Number.NEGATIVE_INFINITY</strong></code></a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/isnan/index.html b/files/es/web/javascript/reference/global_objects/isnan/index.html
new file mode 100644
index 0000000000..f47d769967
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/isnan/index.html
@@ -0,0 +1,89 @@
+---
+title: isNaN
+slug: Web/JavaScript/Reference/Global_Objects/isNaN
+translation_of: Web/JavaScript/Reference/Global_Objects/isNaN
+original_slug: Web/JavaScript/Referencia/Objetos_globales/isNaN
+---
+<div>{{jsSidebar("Objects")}}
+<p>La función <code><strong>isNaN()</strong></code> determina cuando el valor es {{jsxref("NaN")}} o no. Tenga presente que la coerción dentro de la función <code>isNaN</code> tiene reglas <a href="https://wiki.developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/isNaN$edit#Description">interesantes</a>; tal vez quieras usar de forma alternativa <strong><code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/isNaN">Number.isNaN()</a></code></strong>, como fue definido en ECMAScript 2015.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/globalprops-isnan.html")}}</div>
+</div>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre><code>isNaN(<em>valor</em>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><strong><code>valor</code></strong></dt>
+ <dd>El valor a probar o evaluar.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p><strong><code>true</code></strong> si es valor dado es {{jsxref("NaN")}}, de otro modo, <code><strong>false</strong></code>.</p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>isNaN</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
+
+<p><code>isNaN</code> intenta convertir el parámetro pasado a un número. Si el parámetro no se puede convertir, devuelve true; en caso contrario, devuelve false.</p>
+
+<p>Esta función es útil ya que el valor {{jsxref("Objetos_globales/NaN", "NaN")}} no puede se probado correctamente con operadores de igualdad. <code>x == NaN</code> y <code>x === NaN</code> son siempre false, sin importar lo que sea <code>x</code>, incluso si <code>x</code> es <code>NaN</code>. Por ejemplo, tanto <code>1 == NaN</code> como <code>NaN == NaN</code> devuelven <code>false</code>.</p>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<pre class="brush: js">isNaN(NaN) //devuelve true
+isNaN("string") //devuelve true
+isNaN("12") //devuelve false
+isNaN(12) //devuelve false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.1.2.4', 'isNaN')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-isnan-number', 'isNaN')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-isnan-number', 'isNaN')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.isNaN")}}</p>
+
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+
+<ul>
+ <li>{{jsxref("Objetos_globales/NaN", "NaN")}}</li>
+ <li>{{jsxref("Number.isNaN()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/json/index.html b/files/es/web/javascript/reference/global_objects/json/index.html
new file mode 100644
index 0000000000..c065102c2c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/json/index.html
@@ -0,0 +1,232 @@
+---
+title: JSON
+slug: Web/JavaScript/Reference/Global_Objects/JSON
+tags:
+  - JSON
+  - JavaScript
+  - NeedsTranslation
+  - Object
+  - TopicStub
+translation_of: Web/JavaScript/Reference/Global_Objects/JSON
+original_slug: Web/JavaScript/Referencia/Objetos_globales/JSON
+---
+<div>{{JSRef("Objetos_globales", "JSON")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El objeto JSON contiene métodos para analizar <a class="external" href="http://json.org/">JavaScript Object Notation</a> (JSON) y convertir valores a JSON. No puede ser llamado o construído, y aparte de estas dos propiedades, no tiene funcionalidad interesante por sí mismo.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<h3 id="JavaScript_Object_Notation">JavaScript Object Notation</h3>
+
+<p>JSON es una sintaxis para serializar objetos, arreglos, números, cadenas, booleanos y nulos. Está basado sobre sintaxis JavaScript pero es diferente a ella: algo JavaScript no es JSON, y algo JSON no es JavaScript. Mira también: <a href="http://timelessrepo.com/json-isnt-a-javascript-subset">JSON: The JavaScript subset that isn't</a>.</p>
+
+<table>
+ <caption>Diferencias entre JavaScript y JSON</caption>
+ <thead>
+  <tr>
+   <th scope="col">Tipo JavaScript</th>
+   <th scope="col">Diferencia JSON</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>Objetos y arreglos</td>
+   <td>
+    <p>Los nombres de las propiedades deben tener doble comilla; las comas finales están prohibidas.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>Números</td>
+   <td>Los ceros a la izquierda están prohibidos; <span id="result_box" lang="es"><span class="hps">un punto</span> <span class="hps">decimal</span> <span class="hps">debe ser seguido</span> <span class="hps">al menos por un dígito</span><span>.</span></span></td>
+  </tr>
+  <tr>
+   <td>Cadenas</td>
+   <td>
+    <p>Solo un limitado conjunto de caracteres pueden ser de escape; ciertos caracteres de control estan prohibidos; los caracteres de separador de linea Unicode (U+2028) y el separador de parrafo (U+2029) son permitidos; las cadenas deben estar entre comillas dobles. Mira el siguiente ejemplo donde {{jsxref("JSON.parse")}} funciona bien y un{{jsxref("SyntaxError")}} es generado cuando se evalua el codigo como JavaScript:</p>
+
+    <pre class="brush: js notranslate" id="comment_text_1">
+var code = '"\u2028\u2029"';
+JSON.parse(code); // works fine
+eval(code); // fails</pre>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>La sintaxis JSON completa es la siguiente:</p>
+
+<pre class="eval notranslate"><var>JSON</var> = <strong>null</strong>
+    <em>or</em> <strong>true</strong> <em>or</em> <strong>false</strong>
+    <em>or</em> <var>JSONNumber</var>
+    <em>or</em> <var>JSONString</var>
+    <em>or</em> <var>JSONObject</var>
+    <em>or</em> <var>JSONArray</var>
+
+<var>JSONNumber</var> = <strong>-</strong> <var>PositiveNumber</var>
+          <em>or</em> <var>PositiveNumber</var>
+<var>PositiveNumber</var> = DecimalNumber
+              or <var>DecimalNumber</var> <strong>.</strong> <var>Digits</var>
+              or <var>DecimalNumber</var> <strong>.</strong> <var>Digits</var> <var>ExponentPart</var>
+              or <var>DecimalNumber</var> <var>ExponentPart</var>
+<var>DecimalNumber</var> = <strong>0</strong>
+             <em>or</em> <var>OneToNine</var> <var>Digits</var>
+<var>ExponentPart</var> = <strong>e</strong> <var>Exponent</var>
+            <em>or</em> <strong>E</strong> <var>Exponent</var>
+<var>Exponent</var> = <var>Digits</var>
+        <em>or</em> <strong>+</strong> <var>Digits</var>
+        <em>or</em> <strong>-</strong> <var>Digits</var>
+<var>Digits</var> = <var>Digit</var>
+      <em>or</em> <var>Digits</var> <var>Digit</var>
+<var>Digit</var> = <strong>0</strong> through <strong>9</strong>
+<var>OneToNine</var> = <strong>1</strong> through <strong>9</strong>
+
+<var>JSONString</var> = <strong>""</strong>
+          <em>or</em> <strong>"</strong> <var>StringCharacters</var> <strong>"</strong>
+<var>StringCharacters</var> = <var>StringCharacter</var>
+                <em>or</em> <var>StringCharacters</var> <var>StringCharacter</var>
+<var>StringCharacter</var> = any character
+                  <em>except</em> <strong>"</strong> <em>or</em> <strong>\</strong> <em>or</em> U+0000 through U+001F
+               <em>or</em> <var>EscapeSequence</var>
+<var>EscapeSequence</var> = <strong>\" </strong><em>or</em> <strong>\/ </strong><em>or</em> <strong>\\ </strong><em>or</em> <strong>\b </strong><em>or</em> <strong>\f </strong><em>or</em> <strong>\n </strong><em>or</em> <strong>\r </strong><em>or</em> <strong>\t</strong>
+              <em>or</em> <strong>\u</strong> <var>HexDigit</var> <var>HexDigit</var> <var>HexDigit</var> <var>HexDigit</var>
+<var>HexDigit</var> = <strong>0</strong> through <strong>9</strong>
+        <em>or</em> <strong>A</strong> through <strong>F</strong>
+        <em>or</em> <strong>a</strong> through <strong>f</strong>
+
+<var>JSONObject</var> = <strong>{</strong> <strong>}</strong>
+          <em>or</em> <strong>{</strong> <var>Members</var> <strong>}</strong>
+<var>Members</var> = <var>JSONString</var> <strong>:</strong> <var>JSON</var>
+       <em>or</em> <var>Members</var> <strong>,</strong> <var>JSONString</var> <strong>:</strong> <var>JSON</var>
+
+<var>JSONArray</var> = <strong>[</strong> <strong>]</strong>
+         <em>or</em> <strong>[</strong> <var>ArrayElements</var> <strong>]</strong>
+<var>ArrayElements</var> = <var>JSON</var>
+             <em>or</em> <var>ArrayElements</var> <strong>,</strong> <var>JSON</var></pre>
+
+<p>Espacios en blanco insignificantes pueden estar presentes en cualquier lugar excepto en un <var>JSONNumber</var> (los números no deben contener ningún espacio) o en una <var>JSONString</var> (donde es interpretado como el caracter correspondiente en la cadena, o podría causar un error). Los caracteres de Tabulación (U+0009), de retorno de carro (U+000D), de nueva línea (U+000A), y de espacio (U+0020) son los únicos caracteres de espacios en blanco válidos.</p>
+
+<h2 id="Methods" name="Methods">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("JSON.parse()")}}</dt>
+ <dd>Analiza una cadena de texto JSON, opcionalmente transformando el valor producido y sus propiedades, retornando el valor.</dd>
+ <dt>{{jsxref("JSON.stringify()")}}</dt>
+ <dd>Devuelve un string JSON correspondiente al valor especificado, incluyendo opcionalmente ciertas propiedades o reemplazando valores de propiedades de la manera definida por el usuario.</dd>
+</dl>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>El objeto JSON no es soportado por navegadores antiguos. Se puede solucionar esto insertando el siguiente código al inicio del script, permitiendo usar el objeto JSON en navegadores que no soportan su implementación de forma nativa (por ejemplo en Internet Explorer 6).</p>
+
+<p>El siguiente algoritmo es una imitación del objeto JSON nativo:</p>
+
+<pre class="brush: js notranslate">if (!window.JSON) {
+  window.JSON = {
+    parse: function (sJSON) { return eval("(" + sJSON + ")"); },
+    stringify: function (vContent) {
+      if (vContent instanceof Object) {
+        var sOutput = "";
+        if (vContent.constructor === Array) {
+          for (var nId = 0; nId &lt; vContent.length; sOutput += this.stringify(vContent[nId]) + ",", nId++);
+            return "[" + sOutput.substr(0, sOutput.length - 1) + "]";
+        }
+        if (vContent.toString !== Object.prototype.toString) {
+          return "\"" + vContent.toString().replace(/"/g, "\\$&amp;") + "\"";
+        }
+        for (var sProp in vContent) {
+          sOutput += "\"" + sProp.replace(/"/g, "\\$&amp;") + "\":" + this.stringify(vContent[sProp]) + ",";
+        }
+        return "{" + sOutput.substr(0, sOutput.length - 1) + "}";
+     }
+     return typeof vContent === "string" ? "\"" + vContent.replace(/"/g, "\\$&amp;") + "\"" : String(vContent);
+    }
+  };
+}
+</pre>
+
+<p>Los objectos <a class="link-https" href="https://github.com/douglascrockford/JSON-js" title="https://github.com/douglascrockford/JSON-js">JSON2</a> y <a class="external" href="http://bestiejs.github.com/json3" title="http://bestiejs.github.com/json3">JSON3</a> son mas complejos que el objeto JSON ya que manejan <a class="external" href="http://remysharp.com/2010/10/08/what-is-a-polyfill/" title="http://remysharp.com/2010/10/08/what-is-a-polyfill/">polyfills</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.12', 'JSON')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-json-object', 'JSON')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
+   <td>8.0</td>
+   <td>10.5</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("1.0") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Basado en <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Using_native_JSON">Using native JSON</a></li>
+ <li>{{jsxref("Date.prototype.toJSON()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/json/parse/index.html b/files/es/web/javascript/reference/global_objects/json/parse/index.html
new file mode 100644
index 0000000000..885812b288
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/json/parse/index.html
@@ -0,0 +1,179 @@
+---
+title: JSON.parse()
+slug: Web/JavaScript/Reference/Global_Objects/JSON/parse
+tags:
+  - ECMAScript5
+  - JSON
+  - JavaScript
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/JSON/parse
+original_slug: Web/JavaScript/Referencia/Objetos_globales/JSON/parse
+---
+<div>{{JSRef("Global_Objects", "JSON")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <code><strong>JSON.parse()</strong></code> analiza una cadena de texto como JSON, transformando opcionalmente  el valor producido por el análisis.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>JSON.parse(<em>text</em>[, <em>reviver</em>])</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>text</code></dt>
+ <dd>El texto que se convertirá a JSON. Vea el objeto {{jsxref("JSON")}} para una descripción de la sintaxis JSON.</dd>
+ <dt><code>reviver</code> {{optional_inline()}}</dt>
+ <dd>Si una función, <span id="result_box" lang="es"><span class="hps">prescribe</span> <span class="hps">cómo se transforma</span> <span class="hps">el valor producido</span> <span class="hps">originalmente por</span> <span class="hps">el parsing</span></span>, antes de retornar.</dd>
+</dl>
+
+<h3 id="Returns">Returns</h3>
+
+<p>Retorna el objeto que se corresponde con el texto JSON entregado.</p>
+
+<h3 id="Exceptions">Exceptions</h3>
+
+<p>Lanza una excepción {{jsxref("SyntaxError")}} si la cadena a transformar no es un JSON válido.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Usando_JSON.parse()">Ejemplo: Usando <code>JSON.parse()</code></h3>
+
+<pre class="brush: js">JSON.parse('{}');              // {}
+JSON.parse('true');            // true
+JSON.parse('"foo"');           // "foo"
+JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
+JSON.parse('null');            // null
+</pre>
+
+<h3 id="Ejemplo_Usando_el_parámetro_reviver">Ejemplo: <code>Usando el parámetro reviver</code></h3>
+
+<p>Si se especifica un reviver, el valor computado por el parsing <em>es transformado </em>antes de retornar. Específicamente, el valor computado, y todas sus propiedades (comenzando con las propiedades más anidadas y siguiendo al propio valor original), son individualmente ejecutados a través del <code>reviver</code>, el cual es llamado con el objeto que contiene la propiedad que está siendo procesada como <code>this</code> y con el nombre de la propiedad como cadena y el valor de la propiedad como argumentos. Si la función <code>reviver</code> retorna <code>undefined</code> (o no retorna algún valor, por ejemplo: si la ejecución cae el final de la función), la propiedad es eliminada del objeto. De otra manera, la propiedad es redefinidad para ser el valor de retorno.</p>
+
+<p>El <code>reviver</code> es llamada último con la cadena vacía y el valor más alto <span class="short_text" id="result_box" lang="es"><span class="hps">para permitir</span> <span class="hps">la transformación</span> <span class="hps">del valor</span> <span class="hps">más alto</span></span>. <span class="short_text" id="result_box" lang="es"><span class="hps">Asegúrese de</span> <span class="hps">manejar este caso</span> <span class="hps">adecuadamente</span></span>, <span id="result_box" lang="es"><span class="hps">por lo general</span> <span class="hps">mediante la devolución del</span> <span class="hps">valor proporcionado</span></span>, o <code>JSON.parse</code> will retorna <code>undefined</code>.</p>
+
+<pre class="brush: js">JSON.parse('{"p": 5}', function (k, v) {
+    if(k === "") return v;     // if topmost value, return it,
+    return v * 2;              // else return v * 2.
+});                            // { p: 10 }
+
+JSON.parse('{"1": 1, "2": 2,"3": {"4": 4, "5": {"6": 6}}}', function (k, v) {
+    console.log(k);            // log the current property name, the last is "".
+    return v;                  // return the unchanged property value.
+});
+
+// 1
+// 2
+// 4
+// 6
+// 5
+// 3
+// ""
+</pre>
+
+<h3 id="JSON.parse()_no_admite_comas_finales"><code>JSON.parse()</code> no admite comas finales</h3>
+
+<pre class="example-bad brush: js example-bad line-numbers  language-js"><code class="language-js"><span class="comment token">// ambos lanzarán un SyntaxError</span>
+JSON<span class="punctuation token">.</span><span class="function token">parse</span><span class="punctuation token">(</span><span class="string token">'[1, 2, 3, 4, ]'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+JSON<span class="punctuation token">.</span><span class="function token">parse</span><span class="punctuation token">(</span><span class="string token">'{"foo" : 1, }'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.12.2', 'JSON.parse')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial.<br>
+    Implementado en JavaScript 1.7.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-json.parse', 'JSON.parse')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>
+    <p> </p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-json.parse', 'JSON.parse')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
+   <td>8.0</td>
+   <td>10.5</td>
+   <td>4.0</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("1.0") }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Based on <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
+
+<h3 id="Especificaciones_Gecko">Especificaciones Gecko</h3>
+
+<p>Comenzando con Gecko 29 {{geckoRelease("29")}},<span class="short_text" id="result_box" lang="es"><span class="hps"> unas cadenas JSON malformadas</span></span><span class="short_text" lang="es"><span class="hps"> producen</span> </span><span id="result_box" lang="es"><span class="hps">un mensaje</span> <span class="hps">de error más detallado</span> <span class="hps">que contiene el</span> <span class="hps">número de línea y</span> <span class="hps">columna</span> <span class="hps">que provocó el</span> <span class="hps">error de parsing</span></span>. Esto es útil cuando se está haciendo debug de un JSON grande.</p>
+
+<pre class="brush: js">JSON.parse('[1, 2, 3,]')
+// SyntaxError: JSON.parse: unexpected character at
+// line 1 column 10 of the JSON data
+</pre>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Using_native_JSON">Utilizando</a> <a href="/en-US/docs/Web/JavaScript/Guide/Using_native_JSON">JSON nativo</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/json/stringify/index.html b/files/es/web/javascript/reference/global_objects/json/stringify/index.html
new file mode 100644
index 0000000000..b4322d1017
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/json/stringify/index.html
@@ -0,0 +1,266 @@
+---
+title: JSON.stringify()
+slug: Web/JavaScript/Reference/Global_Objects/JSON/stringify
+tags:
+  - JSON
+  - JavaScript
+  - Method
+  - stringify
+translation_of: Web/JavaScript/Reference/Global_Objects/JSON/stringify
+original_slug: Web/JavaScript/Referencia/Objetos_globales/JSON/stringify
+---
+<p>{{JSRef}}</p>
+
+<p>El método <code><strong>JSON.stringify()</strong></code> convierte un objeto o valor de JavaScript en una cadena de texto JSON, opcionalmente reemplaza valores si se indica una función de reemplazo, o si se especifican las propiedades mediante un array de reemplazo.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/json-stringify.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>JSON.stringify(<var>value</var>[, <var>replacer</var>[, <var>space</var>]])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>value</code></dt>
+ <dd>El valor que será convertido a una cadena JSON.</dd>
+ <dt><code>replacer</code>{{Optional_Inline}}</dt>
+ <dd>Una función que altera el comportamiento del proceso de conversión a cadena de texto, o un array de objetos {{JSxRef("String")}} o {{JSxRef("Number")}} que representan una lista de elementos válidos que se incluyen en la cadena JSON. Si este valor es {{JSxRef("null")}} o no se define, todas las propiedades del objeto son incluidas en la cadena de texto JSON resultante.</dd>
+ <dt><code>space</code>{{Optional_Inline}}</dt>
+ <dd>Un objeto de tipo {{JSxRef("String")}} o {{JSxRef("Number")}} que se utiliza para insertar un espacio en blanco dentro de la cadena de salida JSON para mejorar su legibilidad.
+ <p>Si es de tipo <code>Number</code>, indica el número de espacios a usar como espacios en blanco; este número está limitado se limita a 10 (si es mayor, el valor es sólo <code>10</code>). Los valores inferiores a 1 indican que no se deben utilizar espacios.</p>
+
+ <p>Si es de tipo <code>String</code>, la cadena de texto (o sus 10 primeros caracteres, si es mayor) se utiliza como espacios en blanco. Si este parámetro no se define o es {{JSxRef("null")}}, no se utilizará ningún espacio en blanco.</p>
+ </dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena de texto JSON que representa el valor dado.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<p>Lanza una excepción {{JSxRef("TypeError")}} ("cyclic object value") cuando encuentra una referencia circular.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>JSON.stringify</code> convierte un valor a notación JSON representándolo:</p>
+
+<ul>
+ <li>Si el valor tiene un método <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON/stringify$edit#toJSON()_behavior">toJSON()</a>, es responsable de definir qué será serializado.</li>
+ <li>Los objetos {{JSxRef("Boolean")}}, {{JSxRef("Number")}}, and {{JSxRef("String")}} se convierten a sus valores primitivos, de acuerdo con la conversión semántica tradicional.</li>
+ <li>Si durante la conversión se encuentra un {{JSxRef("undefined")}}, una {{JSxRef("Function")}}, o un {{JSxRef("Symbol")}} se omite (cuando se encuentra en un objeto) o se censura a {{JSxRef("null")}} (cuando se encuentra en un array). <code>JSON.stringify()</code> puede devolver <code>undefined</code> cuando se pasan valores "puros" como <code>JSON.stringify(function(){}</code>) o <code>JSON.stringify(undefined)</code>.</li>
+ <li>Todas las propiedades que utilicen {{JSxRef("Symbol")}} en los nombres de la clave se ignoran por completo, incluso si utilizan una función <code>replacer</code>.</li>
+ <li>Las instancias de {{JSxRef("Date")}} implementan la función <code>toJSON()</code> devolviendo una cadena de texto (igual que <code>date.toISOString()</code>). Por lo que son tratadas como strings.</li>
+ <li>Los números {{JSxRef("Infinity")}} y {{JSxRef("NaN")}}, así como el valor {{JSxRef("null")}}, se consideran <code>null</code>.</li>
+ <li>El resto de instancias de {{JSxRef("Object")}} (incluyendo {{JSxRef("Map")}}, {{JSxRef("Set")}}, {{JSxRef("WeakMap")}}, y {{JSxRef("WeakSet")}}) sólo tendrán serializadas sus propiedades enumerables.</li>
+</ul>
+
+<pre class="brush: js">JSON.stringify({});                    // '{}'
+JSON.stringify(true);                  // 'true'
+JSON.stringify('foo');                 // '"foo"'
+JSON.stringify([1, 'false', false]);   // '[1,"false",false]'
+JSON.stringify([NaN, null, Infinity]); // '[null,null,null]'
+JSON.stringify({ x: 5 });              // '{"x":5}'
+
+JSON.stringify(new Date(2006, 0, 2, 15, 4, 5))
+// '"2006-01-02T15:04:05.000Z"'
+
+JSON.stringify({ x: 5, y: 6 });
+// '{"x":5,"y":6}'
+JSON.stringify([new Number(3), new String('false'), new Boolean(false)]);
+// '[3,"false",false]'
+
+// Elementos de array identificados por string no son enumerables y no tienen sentido en JSON
+let a = ['foo', 'bar'];
+a['baz'] = 'quux';      // a: [ 0: 'foo', 1: 'bar', baz: 'quux' ]
+JSON.stringify(a);
+// '["foo","bar"]'
+
+JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] });
+// '{"x":[10,null,null,null]}'
+
+// Estructuras de datos standard
+JSON.stringify([new Set([1]), new Map([[1, 2]]), new WeakSet([{a: 1}]), new WeakMap([[{a: 1}, 2]])]);
+// '[{},{},{},{}]'
+
+// TypedArray
+JSON.stringify([new Int8Array([1]), new Int16Array([1]), new Int32Array([1])]);
+// '[{"0":1},{"0":1},{"0":1}]'
+JSON.stringify([new Uint8Array([1]), new Uint8ClampedArray([1]), new Uint16Array([1]), new Uint32Array([1])]);
+// '[{"0":1},{"0":1},{"0":1},{"0":1}]'
+JSON.stringify([new Float32Array([1]), new Float64Array([1])]);
+// '[{"0":1},{"0":1}]'
+
+// toJSON()
+JSON.stringify({ x: 5, y: 6, toJSON(){ return this.x + this.y; } });
+// '11'
+
+// Símbolos:
+JSON.stringify({ x: undefined, y: Object, z: Symbol('') });
+// '{}'
+JSON.stringify({ [Symbol('foo')]: 'foo' });
+// '{}'
+JSON.stringify({ [Symbol.for('foo')]: 'foo' }, [Symbol.for('foo')]);
+// '{}'
+JSON.stringify({ [Symbol.for('foo')]: 'foo' }, function(k, v) {
+  if (typeof k === 'symbol') {
+    return 'a symbol';
+  }
+});
+// undefined
+
+// Propiedades no enumerables:
+JSON.stringify( Object.create(null, { x: { value: 'x', enumerable: false }, y: { value: 'y', enumerable: true } }) );
+// '{"y":"y"}'
+</pre>
+
+<h3 id="El_parámetro_replacer">El parámetro <code>replacer</code></h3>
+
+<p>El parámetro <code>replacer</code> (de reemplazo) puede ser tanto una función como o un array.</p>
+
+<p><strong>Como una función</strong> toma dos parámetros: el <em>valor</em> y la <em>clave</em> que van a ser procesados. El objeto al cual pertenece la clave representa el parametro this del reemplazo.</p>
+
+<p>Inicialmente es llamado con una clave vacía y representa el objeto que se va a procesar, y solo después es llamado por cada propiedad en el objeto o array que se va a procesar.</p>
+
+<p>Devuelve el valor que se va a agregar a la cadena JSON, de la siguiente manera:</p>
+
+<ul>
+ <li>Si se devuelve un número, la cadena correspondiente es usada como el valor de la propiedad cuando se agrega a la cadena JSON.</li>
+ <li>Si se devuelve una cadena, esta es usuada cono el valor de la propiedad cuando se agrega a la cadena JSON.</li>
+ <li>Si se devuelve un Boolean, true o false son usados como el valor de la propiedad cuando se agrega a la cadena JSON.</li>
+ <li>Si se devuelve algún otro objeto, este es recursivamente procesado en una cadena JSON llamando a la función de reemplazo para cada propiedad, amenos que el objeto sea una función, en tal caso nada se agrega a la cadena JSON.</li>
+ <li>Si se devuelve undefined, la propiedad no se incluye en la salida de la cadena JSON.</li>
+</ul>
+
+<div class="note"><strong>Nota:</strong> No se puede usar la función de reemplazo para borrar los valores de un array. Si se devuelve undefined o una función, entonces se usara null en su lugar.</div>
+
+<h4 id="Ejemplo_con_una_función">Ejemplo con una función</h4>
+
+<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">replacer<span class="punctuation token">(</span></span>key<span class="punctuation token">,</span> value<span class="punctuation token">)</span> <span class="punctuation token">{
+  // Filtrando propiedades </span>
+  <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">typeof</span> value <span class="operator token">===</span> <span class="string token">"string"</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">return</span> undefined<span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">return</span> value<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="keyword token">var</span> foo <span class="operator token">=</span> <span class="punctuation token">{</span>foundation<span class="punctuation token">:</span> <span class="string token">"Mozilla"</span><span class="punctuation token">,</span> model<span class="punctuation token">:</span> <span class="string token">"box"</span><span class="punctuation token">,</span> week<span class="punctuation token">:</span> <span class="number token">45</span><span class="punctuation token">,</span> transport<span class="punctuation token">:</span> <span class="string token">"car"</span><span class="punctuation token">,</span> month<span class="punctuation token">:</span> <span class="number token">7</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> jsonString <span class="operator token">=</span> JSON<span class="punctuation token">.</span><span class="function token">stringify<span class="punctuation token">(</span></span>foo<span class="punctuation token">,</span> replacer<span class="punctuation token">)</span><span class="punctuation token">;</span>
+// '{"week":45, "month":7}'
+</code></pre>
+
+<p>El resultado en una cadena JSON sería:  <code>{"week":45,"month":7}</code>.</p>
+
+<p>Ejemplo con un array</p>
+
+<p>Si el reemplazo es un array, los valores indican los nombres de las propiedades del objeto que se va a incluir en la cadena JSON resultado.</p>
+
+<pre class="brush: js  language-js"><code class="language-js">JSON<span class="punctuation token">.</span><span class="function token">stringify<span class="punctuation token">(</span></span>foo<span class="punctuation token">,</span> <span class="punctuation token">[</span><span class="string token">'week'</span><span class="punctuation token">,</span> <span class="string token">'month'</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">
+// '{"week":45,"month":7}', sólo mantiene las propiedades de "week" y de "month"</span></code>
+</pre>
+
+<h3 id="Argumento_space">Argumento <code>space</code></h3>
+
+<p>Este argumento puede ser empleado para controlar el espaciado en la cadena final. Si es un número, los niveles sucesivos del proceso serán identados cada uno por tantos espacios como se indique (hasta 10). Si es una cadena, serán identados con dicha cadena (o los primeros diez caracteres de la misma).</p>
+
+<pre class="brush: js">JSON.stringify({ a: 2 }, null, ' ');
+// regresa la cadena de texto:
+// '{
+//  "a": 2
+// }'</pre>
+
+<p>Usar el carácter tabulador simula la apariencia de impresión:</p>
+
+<pre class="brush: js">JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
+// devuelve el string:
+// '{            \
+//     "uno": 1, \
+//     "dos": 2  \
+// }' </pre>
+
+<h3 id="Comportamiento_toJSON()">Comportamiento toJSON()</h3>
+
+<p>Si un objeto que sera estringificado tiene una propiedad llamada <span style="font-family: consolas,monaco,andale mono,monospace;">toJSON</span> donde su valor es una función, entonces el método <span style="font-family: consolas,monaco,andale mono,monospace;">toJSON</span> modifica el comportamiento de la estringificación JSON: en lugar del objeto que esta siendo serializado, el valor retornado por el método <span style="font-family: consolas,monaco,andale mono,monospace;">toJSON</span> será serializado cuando el mismo sea llamado. Por ejemplo:</p>
+
+<pre class="brush: js">var obj = {
+  foo: 'foo',
+  toJSON: function () {
+    return 'bar';
+  }
+};
+var json = JSON.stringify({x: obj}); // <code>'{"x":"bar"}'</code>.
+</pre>
+
+<h3 id="Example_of_using_JSON.stringify_with_localStorage" name="Example_of_using_JSON.stringify_with_localStorage">Ejemplo de como usar <code>JSON.stringify()</code> con <code>localStorage</code></h3>
+
+<p>En dado caso en el cual se requiera que un objeto creado por el usuario y al cual se le permita ser restaurado incluso cuando el navegador ha sido cerrado, el siguiente ejemplo es un modelo de la aplicabilidad del metodo JSON. stringify().</p>
+
+<div class="warning">
+<p>Las funciones no son un tipo de dato valido por lo cual estas no funcionaran. Algunos objetos como tipo DATE, se convertiran a cadenas de texto despues de ejecutar JSON.parse().</p>
+</div>
+
+<pre class="brush: js  language-js"><code class="language-js"><span class="comment token">// Creando un ejemplo de JSON
+</span><span class="keyword token">var</span> session <span class="operator token">=</span> <span class="punctuation token">{</span>
+  <span class="string token">'screens'</span><span class="punctuation token">:</span> <span class="punctuation token">[</span><span class="punctuation token">]</span><span class="punctuation token">,</span>
+  <span class="string token">'state'</span><span class="punctuation token">:</span> <span class="keyword token">true</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span>
+session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenA'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">450</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">250</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenB'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">650</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">350</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenC'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">750</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">120</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenD'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">250</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">60</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenE'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">390</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">120</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenF'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">1240</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">650</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="comment token">
+// Convirte el JSON string con JSON.stringify()
+</span><span class="comment token">// entonces guarda con localStorage con el nombre de la sesión
+</span>localStorage<span class="punctuation token">.</span><span class="function token">setItem<span class="punctuation token">(</span></span><span class="string token">'session'</span><span class="punctuation token">,</span> JSON<span class="punctuation token">.</span><span class="function token">stringify<span class="punctuation token">(</span></span>session<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="comment token">
+// Ejemplo de como transformar el String generado usando
+// JSON.stringify() y guardándolo en localStorage como objeto JSON otra vez
+</span><span class="keyword token">var</span> restoredSession <span class="operator token">=</span> JSON<span class="punctuation token">.</span><span class="function token">parse<span class="punctuation token">(</span></span>localStorage<span class="punctuation token">.</span><span class="function token">getItem<span class="punctuation token">(</span></span><span class="string token">'session'</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="comment token">
+// Ahora la variable restoredSession contiene el objeto que fue guardado
+// en localStorage
+</span>console<span class="punctuation token">.</span><span class="function token">log<span class="punctuation token">(</span></span>restoredSession<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.12.3', 'JSON.stringify')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición incial.<br>
+    Implementada en JavaScript 1.7.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-json.stringify', 'JSON.stringify')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>
+    <p> </p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-json.stringify', 'JSON.stringify')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.JSON.stringify")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{JSxRef("JSON.parse()")}}</li>
+ <li><a href="https://github.com/douglascrockford/JSON-js/blob/master/cycle.js">cycle.js</a> – Introduces two functions: <code>JSON.decycle</code> and <code>JSON.retrocycle</code>. These allow encoding and decoding of cyclical structures and DAGs into an extended and retrocompatible JSON format.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/clear/index.html b/files/es/web/javascript/reference/global_objects/map/clear/index.html
new file mode 100644
index 0000000000..4bcd625029
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/clear/index.html
@@ -0,0 +1,110 @@
+---
+title: Map.prototype.clear()
+slug: Web/JavaScript/Reference/Global_Objects/Map/clear
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/clear
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/clear
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>clear()</strong></code> elimina todos los elementos de un objeto <code>Map.</code></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>myMap</em>.clear();</code></pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_clear">Usando el método <code>clear</code></h3>
+
+<pre class="brush: js">var myMap = new Map();
+myMap.set("bar", "baz");
+myMap.set(1, "foo");
+
+myMap.size;       // 2
+myMap.has("bar"); // true
+
+myMap.clear();
+
+myMap.size;       // 0
+myMap.has("bar")  // false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-map.prototype.clear', 'Map.prototype.clear')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.clear', 'Map.prototype.clear')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico.</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("19.0")}}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico.</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("19.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/delete/index.html b/files/es/web/javascript/reference/global_objects/map/delete/index.html
new file mode 100644
index 0000000000..c41a7c38a4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/delete/index.html
@@ -0,0 +1,115 @@
+---
+title: Map.prototype.delete()
+slug: Web/JavaScript/Reference/Global_Objects/Map/delete
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/delete
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/delete
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>delete()</strong></code> elimina el elemento especificado de un objeto <code>Map.</code></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: js">myMap.delete(clave);</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>clave</dt>
+ <dd>Requerido. La clave del elemento a eliminar del objeto <code>Map</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Retorna <code>true</code> si el elemento existe en el objeto <code>Map</code> objecty fue eliminado, o <code>false</code> si el elemento no existe.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Usando_el_método_delete">Usando el método <code>delete</code></h3>
+
+<pre class="brush: js">var myMap = new Map();
+myMap.set("bar", "foo");
+
+myMap.delete("bar"); // Retorna true. Eliminado con éxito.
+myMap.has("bar");    // Retorna false. El elemento "bar" ya no está presente.
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-map.prototype.delete', 'Map.prototype.delete')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.delete', 'Map.prototype.delete')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("13.0")}}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("13.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/entries/index.html b/files/es/web/javascript/reference/global_objects/map/entries/index.html
new file mode 100644
index 0000000000..2653ccf6e7
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/entries/index.html
@@ -0,0 +1,110 @@
+---
+title: Map.prototype.entries()
+slug: Web/JavaScript/Reference/Global_Objects/Map/entries
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/entries
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/entries
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>entries()</strong></code> retorna un nuevo objeto <code><strong>Iterator</strong></code> que contiene los pares <code>[clave, valor]</code> para cada elemento en el objeto <code>Map</code> en orden de inserción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>myMap</em>.entries()</code></pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_entries()">Usando <code>entries()</code></h3>
+
+<pre class="brush:js">var myMap = new Map();
+myMap.set("0", "foo");
+myMap.set(1, "bar");
+myMap.set({}, "baz");
+
+var mapIter = myMap.entries();
+
+console.log(mapIter.next().value); // ["0", "foo"]
+console.log(mapIter.next().value); // [1, "bar"]
+console.log(mapIter.next().value); // [Object, "baz"]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-map.prototype.entries', 'Map.prototype.entries')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.entries', 'Map.prototype.entries')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>38</td>
+   <td>{{ CompatGeckoDesktop("20") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico.</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("20")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map.prototype.keys()")}}</li>
+ <li>{{jsxref("Map.prototype.values()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/foreach/index.html b/files/es/web/javascript/reference/global_objects/map/foreach/index.html
new file mode 100644
index 0000000000..fd2750786b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/foreach/index.html
@@ -0,0 +1,95 @@
+---
+title: Map.prototype.forEach()
+slug: Web/JavaScript/Reference/Global_Objects/Map/forEach
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/forEach
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/forEach
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>forEach()</strong></code> ejecuta una función por cada par clave / valor en el objeto Map, en orden de inserción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>myMap</em>.forEach(<em>callback</em>[, <em>thisArg</em>])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>callback</code></dt>
+ <dd>Función ejecutada en cada elemento.</dd>
+ <dt><code>thisArg</code></dt>
+ <dd>Valor a usar por la funcion <code>callback</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>{{jsxref("undefined")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>forEach</code> ejecuta la devolución de llamada (<code>callback</code>) proporcionada una vez para cada clave del mapa que realmente exista. No se invoca para las claves que se han eliminado. Sin embargo, se ejecuta para los valores que están presentes pero tienen el valor indefinido (<code>undefined</code>).</p>
+
+<p>La función (<code>callback</code>) es invocada con <strong>3 argumentos</strong>:</p>
+
+<ul>
+ <li><strong>valor del elemento</strong></li>
+ <li><strong>clave del elemento</strong></li>
+ <li><strong>El objeto utilizado</strong></li>
+</ul>
+
+<p>Si se provee un parámetro <code>thisArg</code> al método <code>forEach</code>, pasará al <code>callback</code> cuando sea invocado, para ser utilizado como su valor <code>this</code>. De otra manera, el valor <code>undefined</code> pasará para ser usado como su valor <code>this</code>. El valor <code>this</code> finalmente observable por el <code>callback</code> se determina de acuerdo a <a href="/es/docs/Web/JavaScript/Referencia/Operadores/this">las reglas usuales para determinar la visibilidad de <code>this</code> por una función</a>.</p>
+
+<p>Cada valor es usado una vez, excepto en este caso cuando es eliminado y agregado de nuevo antes de que el <code>forEach</code> haya terminado. <code>callback</code> no es invocado para valores eliminados antes de que sean usados. </p>
+
+<p>El método <code>forEach</code> ejecuta la función <code>callback</code> una vez para cada elemento en el objeto <code>Map</code>; No se retornan valores.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Imprimiendo_el_contenido_de_un_objeto_Map">Imprimiendo el contenido de un objeto <code>Map</code></h3>
+
+<p>El siguiente código imprime una línea por cada elemento en el objeto <code>Map</code>:</p>
+
+<pre class="brush:js">function logMapElements(value, key, map) {
+    console.log(`m[${key}] = ${value}`);
+}
+new Map([['foo', 3], ['bar', {}], ['baz', undefined]]).forEach(logMapElements);
+// logs:
+// "m[foo] = 3"
+// "m[bar] = [object Object]"
+// "m[baz] = undefined"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-map.prototype.foreach', 'Map.prototype.forEach')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición Inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.foreach', 'Map.prototype.forEach')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Map.forEach")}}</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Set.prototype.forEach()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/get/index.html b/files/es/web/javascript/reference/global_objects/map/get/index.html
new file mode 100644
index 0000000000..ab9926838e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/get/index.html
@@ -0,0 +1,78 @@
+---
+title: Map.prototype.get()
+slug: Web/JavaScript/Reference/Global_Objects/Map/get
+tags:
+  - JavaScript
+  - Map
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/get
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/get
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>get()</strong></code> devuelve un elemento específico de un objeto <code>Map</code>.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/map-prototype-get.html")}}</div>
+
+<p class="hidden">El código fuente de este ejemplo se escuentra en un repositorio de GitHub. Si quieres contribuir al projecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envianos una solicitud de pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>miMapa</em>.get(clave);</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt>clave</dt>
+ <dd>Requerido. La clave del elemento del objeto <code>Map</code> que queremos obtener.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Devuelve el elemento asociado a la clave indicada o <code>undefined</code> si la clave no ha sido encontrada en el objeto <code>Map</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_get">Usando el método <code>get</code></h3>
+
+<pre class="brush: js">var miMapa = new Map();
+miMapa.set('bar', 'foo');
+
+miMapa.get('bar');  // Devuelve "foo".
+miMapa.get('baz');  // Devuelve undefined.
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-map.prototype.get', 'Map.prototype.get')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.get', 'Map.prototype.get')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
+
+<div class="hidden">La tabla de compatiblidad en esta página es generada desde datos estructurados. Si quieres contribuir a los datos, por favor mira <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una solicitud de pull request.</div>
+
+<p>{{Compat("javascript.builtins.Map.get")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+ <li>{{jsxref("Map.prototype.set()")}}</li>
+ <li>{{jsxref("Map.prototype.has()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/has/index.html b/files/es/web/javascript/reference/global_objects/map/has/index.html
new file mode 100644
index 0000000000..b9bf84412e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/has/index.html
@@ -0,0 +1,66 @@
+---
+title: Map.prototype.has()
+slug: Web/JavaScript/Reference/Global_Objects/Map/has
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/has
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/has
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>has()</strong></code> devuelve un booleano indicando si el elemento con la llave especificada existe o no.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/map-prototype-has.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>myMap</var>.has(<var>key</var>)</pre>
+
+<h3 id="Parameteros">Parameteros</h3>
+
+<dl>
+ <dt><code><var>key</var></code></dt>
+ <dd>La llave del elemento a probar si esta presente en el objeto <code>Map</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p><code>true</code> si el elemento con la llave especificada existe en el objeto <code>Map</code>; de lo contrario <code>false</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_has">Usando <code>has()</code></h3>
+
+<pre class="brush: js notranslate">let myMap = new Map()
+myMap.set('bar', "foo")
+
+myMap.has('bar')   // returns true
+myMap.has('baz')   // returns false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.has', 'Map.prototype.has')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Map.has")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+ <li>{{jsxref("Map.prototype.set()")}}</li>
+ <li>{{jsxref("Map.prototype.get()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/index.html b/files/es/web/javascript/reference/global_objects/map/index.html
new file mode 100644
index 0000000000..84a3bcbf17
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/index.html
@@ -0,0 +1,214 @@
+---
+title: Map
+slug: Web/JavaScript/Reference/Global_Objects/Map
+tags:
+  - ECMAScript2015
+  - JavaScript
+  - Map
+translation_of: Web/JavaScript/Reference/Global_Objects/Map
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map
+---
+<div>{{JSRef("Global_Objects", "Map")}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El objeto <strong><code>Map</code></strong> almacena pares clave/valor. Cualquier valor (tanto objetos como {{Glossary("Primitive", "valores primitivos")}}) pueden ser usados como clave o valor.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>new Map([iterable])
+</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>iterable</code></dt>
+ <dd>Iterable es un array o cualquier otro objeto <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Iteration_protocols">iterable</a> cuyos elementos son pares clave-valor (arrays de 2 elementos). Cada par clave-valor será agregado al nuevo Map.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Un objeto Map puede iterar sobre sus elementos en orden de inserción. Un bucle <code>for..of</code> devolverá un array de <code>[clave, valor]</code> en cada iteración.</p>
+
+<p>Cabe destacar que un <strong>Map </strong>el cual es un mapa de un objeto, especialmente un diccionario de diccionarios, solo se va a mapear en el orden de inserción del objeto — el cual es aleatorio y no ordenado.</p>
+
+<h3 id="Igualdad_de_claves">Igualdad de claves</h3>
+
+<p>La igualdad de claves esta basada en el algoritmo "SameValueZero": <code>NaN</code> es considerado lo mismo que <code>NaN </code>(sin importar que <code>NaN !== NaN</code>) y todos los otros operadores son considerados iguales de acuerdo a la semantica del operador ===. En las primeras versiones de ECMAScript 6 <code>-0</code> y <code>+0</code> eran considarados distintos (even though <code>-0 === +0</code>), esto fue cambiado en posteriores versiones y ha sido implementado en Gecko 29 {{geckoRelease("29")}} ({{bug("952870")}}) and a <a href="https://code.google.com/p/v8/issues/detail?id=3069">recent nightly Chrome</a>.</p>
+
+<h3 id="Objetos_y_mapas_comparados">Objetos y mapas comparados</h3>
+
+<p>Los {{jsxref("Object", "Objetos")}} son similares a los <code>Maps</code> en cuanto a que ambos permiten establecer claves a valores, recuperar dichos valores, eliminar claves, y detectar si existe algo almacenado en una clave determinada. Por esto, los <code>Objects</code> han sido usados históricamente como <code>Maps</code>; no obstante, hay diferencias importantes entre  <code>Objects</code> y <code>Maps</code> que hacen mejor usar un  <code>Map</code>  en la mayoría de casos.</p>
+
+<ul>
+ <li>Las claves de un <code>Object</code> son {{jsxref("String", "Strings")}} y {{jsxref("Symbol", "Symbols")}}, mientras que para un <code>Map</code> pueden ser de cualquier tipo, incluyendo funciones, objetos y cualquier otro tipo primitivo.</li>
+ <li>Puedes saber facilmente el tamaño de un <code>Map</code> usando la propiedad <code>size</code>, mientras que le número de propiedades en un <code>Object</code> tiene que ser deternminado manualmente.</li>
+ <li>Un <code>Map</code> es un <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Iteration_protocols">iterable</a> lo que permite iterar directamente sobre el, mientras que si queremos iterar sobre un <code>Object</code> necesitamos obtener primero las claves de alguna forma para después iterar sobre el.</li>
+ <li>Un <code>Object</code> tiene prototipo, por lo que hay claves por defecto en tu mapa que pueden colisionar con tus claves si no eres cuidadoso. En el estandard ES5 esto se puede evitar usando <code>mapa = Object.create(null)</code>, pero esto raramente se hace.</li>
+</ul>
+
+<h2 id="Properties" name="Properties">Propiedades</h2>
+
+<dl>
+ <dt><code>Map.length</code></dt>
+ <dd>El valor de la propiedad de longitud es 0</dd>
+ <dt>{{jsxref("Map.@@species", "get Map[@@species]")}}</dt>
+ <dd>La función constructor que se usa para crear objetos derivados.</dd>
+ <dt>{{jsxref("Map.prototype")}}</dt>
+ <dd>Representa el prototipo para el constructor de Map. Permite añadir propiedades a todos los objetos <code>Map</code>.</dd>
+</dl>
+
+<h2 id="Boolean_instances" name="Boolean_instances">Instancias de Map</h2>
+
+<p>Todas las instancias de Map heredan de {{jsxref("Map.prototype")}}.</p>
+
+<h3 id="Propiedades">Propiedades</h3>
+
+<p>{{page('es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/prototype','Propiedades')}}</p>
+
+<h3 id="Métodos">Métodos</h3>
+
+<p>{{page('es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/prototype','Métodos')}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Usando_el_objeto_Map">Ejemplo: Usando el objeto Map</h3>
+
+<pre class="brush: js">var miMapa = new Map();
+
+var claveObj = {},
+    claveFunc = function () {},
+    claveCadena = "una cadena";
+
+// asignando valores
+miMapa.set(claveCadena, "valor asociado con 'una cadena'");
+miMapa.set(claveObj, "valor asociado con claveObj");
+miMapa.set(claveFunc, "valor asociado with claveFunc");
+
+miMapa.size; // 3
+
+// obteniendo los valores
+miMapa.get(claveCadena);    // "valor asociado con 'una cadena'"
+miMapa.get(claveObj);       // "valor asociado con claveObj"
+miMapa.get(claveFunc);      // "valor asociado con claveFunc"
+
+miMapa.get("una cadena");   // ""valor asociado con 'una cadena'"
+                         // porque claveCadena === 'una cadena'
+miMapa.get({});           // undefined, porque claveObj !== {}
+miMapa.get(function() {}) // undefined, porque claveFunc !== function () {}
+</pre>
+
+<h3 id="Ejemplo_Usando_NaN_como_claves_de_Map">Ejemplo: Usando <code>NaN</code> como claves de Map</h3>
+
+<p><code>NaN</code> también puede ser usado como una clave. Aún cuando cada clave <code>NaN</code> no es igual a sí misma (<code>NaN !== NaN</code> es verdadera), el siguiente ejemplo funciona, porque las claves NaNs <code>NaN</code>s no son distinguibles unas de otras:</p>
+
+<pre class="brush: js">var miMapa = new Map();
+miMapa.set(NaN, "no es un número");
+
+miMapa.get(NaN); // "no es un número"
+
+var otroNaN = Number("foo");
+miMapa.get(otroNaN); // "no es un número"
+</pre>
+
+<h3 id="Ejemplo_Iterando_Map_con_for..of">Ejemplo: Iterando <code>Map</code> con <code>for..of</code></h3>
+
+<p>Los Map pueden ser iterados usando un bucle <code>for..of</code>:</p>
+
+<pre class="brush: js">var miMapa = new Map();
+miMapa.set(0, "cero");
+miMapa.set(1, "uno");
+for (var [clave, valor] of miMapa) {
+  alert(clave + " = " + valor);
+}
+// Mostrará 2 alertas; primero con "0 = cero" y segundo con "1 = uno"
+
+for (var clave of miMapa.keys()) {
+  alert(clave);
+}
+// Mostrará 2 alertas; primero con "0" y segundo con "1"
+
+for (var valor of miMapa.values()) {
+  alert(valor);
+}
+// Mostrará 2 alertas; primero con "cero" y segundo con "uno"
+
+for (var [clave, valor] of miMapa.entries()) {
+  alert(clave + " = " + valor);
+}
+// Mostrará 2 alertas; primero con "0 = cero" y segundo con "1 = uno"
+
+miMapa.forEach(function(valor, clave, miMapa) {
+  alert(clave + " = " + valor);
+})
+// Mostrará 2 alertas; primero con "0 = cero" y segundo con "1 = uno"
+</pre>
+
+<h3 id="Iterando_Maps_usando_forEach()">Iterando <code>Maps</code> usando <code>forEach()</code></h3>
+
+<p>Los Map pueden ser iterados usando el método <code>forEach()</code>:</p>
+
+<pre><code>miMapa.forEach(function(valor, clave) {
+  console.log(clave + ' = ' + valor);
+});
+// Mostrará 2 logs; el primero con "0 = cero" y el segundo con "1 = uno"</code></pre>
+
+<h3 id="Ejemplo_Relación_con_los_objetos_Array">Ejemplo: Relación con los objetos <code>Array</code></h3>
+
+<pre class="brush: js">var kvArray = [["clave1", "valor1"], ["clave2", "valor2"]];
+
+// El constructor por defecto de Map para transforar un Array 2D (clave-valor) en un mapa
+var miMapa = new Map(kvArray);
+
+miMapa.get("clave1"); // devuelve "valor1"
+
+// Usando la función Array.from para transformar el mapa a un Array 2D clave-valor.
+console.log(Array.from(miMapa)); // Muestra exactamente el mismo Array que kvArray
+
+// O usando los iteradores de claves o valores y convirtiendo a array.
+console.log(Array.from(miMapa.keys())); // Muestra ["clave1", "clave2"]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-map-objects', 'Map')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map-objects', 'Map')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<p> </p>
+
+<div class="hidden">
+<p>La tabla de compatiblidad en esta página es generada desde datos estructurados. Si quieres contribuir a los datos, pro favor mira <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una solicitud de pull request.</p>
+</div>
+
+<p>{{Compat("javascript.builtins.Map")}}</p>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=697479">Map and Set bug at Mozilla</a></li>
+ <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:simple_maps_and_sets">ECMAScript Harmony proposal</a></li>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("WeakMap")}}</li>
+ <li>{{jsxref("WeakSet")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/keys/index.html b/files/es/web/javascript/reference/global_objects/map/keys/index.html
new file mode 100644
index 0000000000..c3c643180b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/keys/index.html
@@ -0,0 +1,110 @@
+---
+title: Map.prototype.keys()
+slug: Web/JavaScript/Reference/Global_Objects/Map/keys
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/keys
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/keys
+---
+<div>{{JSRef}}</div>
+
+<p>El metodo <code><strong>keys()</strong></code> returna un nuevo objeto <code><strong>Iterator</strong></code> que contiene las llaves/keys por cada elemento en el objeto en orden de insercion.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code><em>myMap</em>.keys()</code></pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_keys()">Usando <code>keys()</code></h3>
+
+<pre class="brush:js">var myMap = new Map();
+myMap.set("0", "foo");
+myMap.set(1, "bar");
+myMap.set({}, "baz");
+
+var mapIter = myMap.keys();
+
+console.log(mapIter.next().value); // "0"
+console.log(mapIter.next().value); // 1
+console.log(mapIter.next().value); // Object
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-map.prototype.keys', 'Map.prototype.keys')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.keys', 'Map.prototype.keys')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("20")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("20") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Map.prototype.entries()")}}</li>
+ <li>{{jsxref("Map.prototype.values()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/set/index.html b/files/es/web/javascript/reference/global_objects/map/set/index.html
new file mode 100644
index 0000000000..dd0b48d156
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/set/index.html
@@ -0,0 +1,134 @@
+---
+title: Map.prototype.set()
+slug: Web/JavaScript/Reference/Global_Objects/Map/set
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Mapa
+  - Prototype
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/set
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/set
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong>set()</strong> agrega un nuevo elemento al objeto Map con la llave y el valor especificado.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code><em>myMap</em>.set(llave, valor);</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>llave</dt>
+ <dd>Requerido. La llave del elemento a agregar al objeto Map.</dd>
+ <dt>valor</dt>
+ <dd>Requerido. El valor del elemento a agregar al objeto Map.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El objeto Map.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_set">Usando el método set</h3>
+
+<pre class="brush: js">var miMapa = new Map();
+
+// Agregar nuevos elementos al mapa
+miMapa.set("bar", "foo");
+miMapa.set(1, "foobar");
+
+// Actualizar un elemento en el mapa
+miMapa.set("bar", "baz");
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-map.prototype.set', 'Map.prototype.set')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.set', 'Map.prototype.set')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterítica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("13.0")}}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracterítica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("13.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
+
+<ul>
+ <li>En versiones inferiores a Firefox 33 {{geckoRelease("33")}}, <code>Map.prototype.set</code> retorna <code>undefined</code> y no es encadenable. Esto se ha reparado ({{bug(1031632)}}). Este comportamiento también se encontró en Chrome/v8 (<a href="https://code.google.com/p/v8/issues/detail?id=3410">issue</a>).</li>
+</ul>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+ <li>{{jsxref("Map.prototype.get()")}}</li>
+ <li>{{jsxref("Map.prototype.has()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/size/index.html b/files/es/web/javascript/reference/global_objects/map/size/index.html
new file mode 100644
index 0000000000..0671acf15e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/size/index.html
@@ -0,0 +1,111 @@
+---
+title: Map.prototype.size
+slug: Web/JavaScript/Reference/Global_Objects/Map/size
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/size
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/size
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad evaluada <code><strong>size</strong></code> retorna el número de elementos en un objeto  {{jsxref("Map")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El valor de <code>size</code> es un entero representando cuántas entradas tiene el objeto <code>Map</code>. No hay definida una función de evalador set  para <code>size</code>; uted no puede cambiar esta propiedad.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_size">Usando <code>size</code></h3>
+
+<pre class="brush:js">var myMap = new Map();
+myMap.set("a", "alpha");
+myMap.set("b", "beta");
+myMap.set("g", "gamma");
+
+myMap.size // 3
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-get-map.prototype.size', 'Map.prototype.size')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-get-map.prototype.size', 'Map.prototype.size')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibildad_entre_navegadores">Compatibildad entre navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{ CompatGeckoDesktop("19") }}</td>
+   <td>{{ CompatIE("11") }}</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("19")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h2>
+
+<ul>
+ <li>Desde Gecko 13 {{geckoRelease("13")}} a Gecko 18 {{geckoRelease("18")}} la propiedad size era implementada como un método <strong><code>Map.prototype.size()</code></strong>, esto ha sido modificado a propiedad en versiones posteriores de acuerdo a la especficiación ECMAScript 6 ({{bug("807001")}}).</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/map/values/index.html b/files/es/web/javascript/reference/global_objects/map/values/index.html
new file mode 100644
index 0000000000..385a14e3ac
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/map/values/index.html
@@ -0,0 +1,78 @@
+---
+title: Map.prototype.values()
+slug: Web/JavaScript/Reference/Global_Objects/Map/values
+tags:
+  - ECMAScript 2015
+  - Iterador
+  - JavaScript
+  - Map
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Map/values
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Map/values
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>values()</strong></code> devuelve un nuevo objeto <strong><a href="/es/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iterador</a></strong> que contiene los valores para cada elemento en el objeto <code>Map</code> en el mismo orden de inserción.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/map-prototype-values.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>myMap</em>.values()</code></pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un nuevo objeto iterador {{jsxref("Map")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_values()">Utilizando <code>values()</code></h3>
+
+<pre class="brush:js">var myMap = new Map();
+myMap.set('0', 'foo');
+myMap.set(1, 'bar');
+myMap.set({}, 'baz');
+
+var mapIter = myMap.values();
+
+console.log(mapIter.next().value); // "foo"
+console.log(mapIter.next().value); // "bar"
+console.log(mapIter.next().value); // "baz"</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-map.prototype.values', 'Map.prototype.values')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-map.prototype.values', 'Map.prototype.values')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Map.values")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map.prototype.entries()")}}</li>
+ <li>{{jsxref("Map.prototype.keys()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/abs/index.html b/files/es/web/javascript/reference/global_objects/math/abs/index.html
new file mode 100644
index 0000000000..4ff4a68c56
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/abs/index.html
@@ -0,0 +1,150 @@
+---
+title: Math.abs()
+slug: Web/JavaScript/Reference/Global_Objects/Math/abs
+tags:
+  - JavaScript
+  - Math
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/abs
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/abs
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.abs()</code></strong> retorna el valor absoluto de un número, que es </p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.abs</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mrow><mo stretchy="false">|</mo><mi>x</mi><mo stretchy="false">|</mo></mrow><mo>=</mo><mrow><mo>{</mo><mtable columnalign="left left"><mtr><mtd><mi>x</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo>&gt;</mo><mn>0</mn></mtd></mtr><mtr><mtd><mi>0</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo>=</mo><mn>0</mn></mtd></mtr><mtr><mtd><mo>-</mo><mi>x</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo>&lt;</mo><mn>0</mn></mtd></mtr></mtable></mrow></mrow><annotation encoding="TeX">{\mathtt{\operatorname{Math.abs}(x)}} = {|x|} = \begin{cases} x &amp; \text{if} \quad x \geq 0 \\ -x &amp; \text{if} \quad x &lt; 0 \end{cases} </annotation></semantics></math></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.abs(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+ <dt>
+ <h3 dir="ltr" id="Valor_de_retorno">Valor de retorno</h3>
+
+ <p dir="ltr">El valor absoluto del número dado.</p>
+
+ <p dir="ltr"></p>
+ </dt>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Como <code>abs()</code> es un método estático de <code>Math</code>, deberías siempre usar <code>Math.abs()</code>, en lugar de un método de un objeto <code>Math</code> que crees (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Comportamiento_de_Math.abs">Comportamiento de <code>Math.abs()</code></h3>
+
+<p>Pasando un string no-numérico o una variable {{jsxref("undefined")}}/empty retorna {{jsxref("NaN")}}. Pasando {{jsxref("null")}} retorna 0.</p>
+
+<pre class="brush: js">Math.abs('-1');     // 1
+Math.abs(-2);       // 2
+Math.abs(null);     // 0
+<code>Math.abs('');       // 0
+</code>Math.abs([]);       // 0
+<code>Math.abs([2]);      // 2
+</code>Math.abs([1,2]);    // NaN
+<code>Math.abs({});       // NaN</code>
+Math.abs('string'); // NaN
+Math.abs();         // NaN
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.1', 'Math.abs')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.abs', 'Math.abs')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.abs', 'Math.abs')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.ceil()")}}</li>
+ <li>{{jsxref("Math.floor()")}}</li>
+ <li>{{jsxref("Math.round()")}}</li>
+ <li>{{jsxref("Math.sign()")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Math.trunc()")}} {{experimental_inline}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/acos/index.html b/files/es/web/javascript/reference/global_objects/math/acos/index.html
new file mode 100644
index 0000000000..8928ec7624
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/acos/index.html
@@ -0,0 +1,100 @@
+---
+title: Math.acos()
+slug: Web/JavaScript/Reference/Global_Objects/Math/acos
+tags:
+  - JavaScript
+  - Math
+  - Métodos
+  - Referências
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/acos
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/acos
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.acos()</code></strong> devuelve el arco coseno (en radianes) de un número que es</p>
+
+<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mo stretchy="false">[</mo><mrow><mo>-</mo><mn>1</mn></mrow><mo>;</mo><mn>1</mn><mo stretchy="false">]</mo><mo>,</mo><mspace width="thickmathspace"></mspace><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.acos</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arccos</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mo stretchy="false">[</mo><mn>0</mn><mo>;</mo><mi>π</mi><mo stretchy="false">]</mo><mspace width="thinmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">cos</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.acos}(x)} = \arccos(x) = \text{ the unique } \; y \in [0; \pi] \, \text{such that} \; \cos(y) = x</annotation></semantics></math></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.acos(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El arco coseno (en radianes) de un número dado si se encuentra entre <strong>-1</strong> y <strong>1</strong>; de otro modo, {{jsxref("NaN")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>Math.acos()</code> devuelve un valor numérico entre 0 y π radianes para <code>x</code> entre -1 y 1. Si el valor de <code>x</code> está fuera de este rango, devuelve {{jsxref("NaN")}}.</p>
+
+<p>Debido a que <code>acos()</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.acos()</code>, en vez de como un método de un objeto <code>Math</code> creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.acos()">Usando <code>Math.acos()</code></h3>
+
+<pre class="brush: js">Math.acos(-2);  // NaN
+Math.acos(-1);  // 3.141592653589793
+Math.acos(0);   // 1.5707963267948966
+Math.acos(0.5); // 1.0471975511965979
+Math.acos(1);   // 0
+Math.acos(2);   // NaN
+</pre>
+
+<p>Para valores menores que  -1 o mayores que 1, <code>Math.acos()</code> devuelve {{jsxref("NaN")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.2', 'Math.acos')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.acos', 'Math.acos')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.acos', 'Math.acos')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegador">Compatibilidad con navegador</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.acos")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.asin()")}}</li>
+ <li>{{jsxref("Math.atan()")}}</li>
+ <li>{{jsxref("Math.atan2()")}}</li>
+ <li>{{jsxref("Math.cos()")}}</li>
+ <li>{{jsxref("Math.sin()")}}</li>
+ <li>{{jsxref("Math.tan()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/acosh/index.html b/files/es/web/javascript/reference/global_objects/math/acosh/index.html
new file mode 100644
index 0000000000..52bf9f335c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/acosh/index.html
@@ -0,0 +1,95 @@
+---
+title: Math.acosh()
+slug: Web/JavaScript/Reference/Global_Objects/Math/acosh
+tags:
+  - JavaScript
+  - Math
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/acosh
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/acosh
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.acosh()</code></strong> retorna el arco coseno hiperbólico de un número que es: </p>
+
+<p><math display="block"><semantics><annotation encoding="TeX">Para todo x mayor ó igual a 1,se cumple que : la funcion Math.acosh(x) = arcosh(x) = al único y mayor ó igual a 0 ; tal que; cosh(y) = x</annotation></semantics></math></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.acosh(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>El arco coseno hiperbólico del número dado. Si el número es menor que 1, {{jsxref("NaN")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Como <code>acosh()</code> es un método estático de <code>Math</code>, siempre debe ser usado como <code>Math.acosh()</code>, en vez de como un método de un objeto <code>Math</code> creado (<code>Math</code> no es constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_Math.acosh()">Utilizando <code>Math.acosh()</code></h3>
+
+<pre class="brush: js">Math.acosh(-1);  // NaN
+Math.acosh(0);   // NaN
+Math.acosh(0.5); // NaN
+Math.acosh(1);   // 0
+Math.acosh(2);   // 1.3169578969248166
+</pre>
+
+<p>Para valores menores que 1 <code>Math.acosh()</code> retorna {{jsxref("NaN")}}.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Para todo <math><semantics><mrow><mi>x</mi><mo>≥</mo><mn>1</mn></mrow><annotation encoding="TeX">x mayor ó igual a 1</annotation></semantics></math>, se tiene que el arcosh(x) <math><semantics><annotation encoding="TeX">= ln(x + la raiz cuadrada de(x cuadrado - 1)) </annotation></semantics></math> y esto puede ser emulado con la siguiente funcion:</p>
+
+<pre class="brush: js">Math.acosh = Math.acosh || function(x) {
+  return Math.log(x + Math.sqrt(x * x - 1));
+};
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.acosh', 'Math.acosh')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('ESDraft', '#sec-math.acosh', 'Math.acosh')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada de datos estructurados. Si desea contribuir a los datos, por favor, revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de edición.</p>
+
+<p>{{Compat("javascript.builtins.Math.acosh")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.asinh()")}}</li>
+ <li>{{jsxref("Math.atanh()")}}</li>
+ <li>{{jsxref("Math.cosh()")}}</li>
+ <li>{{jsxref("Math.sinh()")}}</li>
+ <li>{{jsxref("Math.tanh()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/asin/index.html b/files/es/web/javascript/reference/global_objects/math/asin/index.html
new file mode 100644
index 0000000000..3fc8b56e89
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/asin/index.html
@@ -0,0 +1,145 @@
+---
+title: Math.asin()
+slug: Web/JavaScript/Reference/Global_Objects/Math/asin
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/asin
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/asin
+---
+<div>{{JSRef}}</div>
+
+<p>La Funcion <strong><code>Math.asin()</code></strong> retorna El arco seno (en radianes) de un número, eso es.</p>
+
+<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mo stretchy="false">[</mo><mrow><mo>-</mo><mn>1</mn></mrow><mo>;</mo><mn>1</mn><mo stretchy="false">]</mo><mo>,</mo><mspace width="thickmathspace"></mspace><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.asin</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arcsin</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mrow><mo>[</mo><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac><mo>;</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><mo>]</mo></mrow><mspace width="thinmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">sin</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.asin}(x)} = \arcsin(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \sin(y) = x</annotation></semantics></math></p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code>Math.asin(<var>x</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un Numero.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>The arcsine (in radians) of the given number if it's between <strong>-1</strong> and <strong>1</strong>; otherwise, {{jsxref("NaN")}}.</p>
+
+<h2 id="Descripcion">Descripcion</h2>
+
+<p>The <code>Math.asin()</code> method returns a numeric value between <math><semantics><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><annotation encoding="TeX">-\frac{\pi}{2}</annotation></semantics></math> and <math><semantics><mfrac><mi>π</mi><mn>2</mn></mfrac><annotation encoding="TeX">\frac{\pi}{2}</annotation></semantics></math> radians for <code>x</code> between -1 and 1. If the value of <code>x</code> is outside this range, it returns {{jsxref("NaN")}}.</p>
+
+<p>Because <code>asin()</code> is a static method of <code>Math</code>, you always use it as <code>Math.asin()</code>, rather than as a method of a <code>Math</code> object you created (<code>Math</code> is not a constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.asin()">Usando <code>Math.asin()</code></h3>
+
+<pre class="brush: js">Math.asin(-2);  // NaN
+Math.asin(-1);  // -1.5707963267948966 (-pi/2)
+Math.asin(0);   // 0
+Math.asin(0.5); // 0.5235987755982989
+Math.asin(1);   // 1.5707963267948966 (pi/2)
+Math.asin(2);   // NaN
+</pre>
+
+<p>For values less than -1 or greater than 1, <code>Math.asin()</code> returns {{jsxref("NaN")}}.</p>
+
+<h2 id="Espesificaciones">Espesificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Espesificacion</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.3', 'Math.asin')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.asin', 'Math.asin')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.asin', 'Math.asin')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_Mas">Ver Mas</h2>
+
+<ul>
+ <li>{{jsxref("Math.acos()")}}</li>
+ <li>{{jsxref("Math.atan()")}}</li>
+ <li>{{jsxref("Math.atan2()")}}</li>
+ <li>{{jsxref("Math.cos()")}}</li>
+ <li>{{jsxref("Math.sin()")}}</li>
+ <li>{{jsxref("Math.tan()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/asinh/index.html b/files/es/web/javascript/reference/global_objects/math/asinh/index.html
new file mode 100644
index 0000000000..2001ccf984
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/asinh/index.html
@@ -0,0 +1,91 @@
+---
+title: Math.asinh()
+slug: Web/JavaScript/Reference/Global_Objects/Math/asinh
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/asinh
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/asinh
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.asinh()</code></strong> retorna el arcoseno hyperbólico de un número, es decir</p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.asinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="thinmathspace">arsinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">sinh</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.asinh}(x)} = \operatorname{arsinh}(x) = \text{ the unique } \; y \; \text{such that} \; \sinh(y) = x</annotation></semantics></math></p>
+
+<h2 id="Sintáxis">Sintáxis</h2>
+
+<pre class="syntaxbox"><code>Math.asinh(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El arcoseno hyperbólico del número dado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Debido a que <code>asinh()</code> es un método estático de  <code>Math</code>, siempre hay que usarlo como <code>Math.asinh()</code>, en lugar de como un método del objeto <code>Math</code> que se hayamos creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usos_de_Math.asinh()">Usos de <code>Math.asinh()</code></h3>
+
+<pre class="brush: js">Math.asinh(1);  // 0.881373587019543
+Math.asinh(0);  // 0
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>As a quick and dirty hack the expression <math><semantics><mrow><mo lspace="0em" rspace="thinmathspace">arsinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mrow><mo>(</mo><mrow><mi>x</mi><mo>+</mo><msqrt><mrow><msup><mi>x</mi><mn>2</mn></msup><mo>+</mo><mn>1</mn></mrow></msqrt></mrow><mo>)</mo></mrow></mrow><annotation encoding="TeX">\operatorname {arsinh} (x) = \ln \left(x + \sqrt{x^{2} + 1} \right)</annotation></semantics></math> may be used directly for a coarse emulation by the following function:</p>
+
+<pre class="brush: js">Math.asinh = Math.asinh || function(x) {
+  if (x === -Infinity) {
+    return x;
+  } else {
+    return Math.log(x + Math.sqrt(x * x + 1));
+  }
+};
+</pre>
+
+<p>Been formally correct it suffers from a number of issues related to floating point computations. Accurate result requires special handling of positive/negative, small/large arguments as it done e.g. in <a href="https://sourceware.org/git/?p=glibc.git;a=blob;f=sysdeps/ieee754/dbl-64/s_asinh.c">glibc</a> or <a href="http://git.savannah.gnu.org/cgit/gsl.git/tree/sys/invhyp.c">GNU Scientific Library</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.asinh', 'Math.asinh')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.asinh', 'Math.asinh')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidades_de_buscadores">Compatibilidades de buscadores</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.asinh")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Math.acosh()")}}</li>
+ <li>{{jsxref("Math.atanh()")}}</li>
+ <li>{{jsxref("Math.cosh()")}}</li>
+ <li>{{jsxref("Math.sinh()")}}</li>
+ <li>{{jsxref("Math.tanh()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/atan/index.html b/files/es/web/javascript/reference/global_objects/math/atan/index.html
new file mode 100644
index 0000000000..bad9ca0f5c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/atan/index.html
@@ -0,0 +1,108 @@
+---
+title: Math.atan()
+slug: Web/JavaScript/Reference/Global_Objects/Math/atan
+tags:
+  - JavaScript
+  - Matemática
+  - Math
+  - Method
+  - Trigonometría
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/atan
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.atan()</code></strong> retorna el arcotangente (en radianes) de un number, esto es</p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.atan</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arctan</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> el único </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mrow><mo>[</mo><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac><mo>;</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><mo>]</mo></mrow><mspace width="thinmathspace"></mspace><mtext> tal que</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">tan</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.atan}(x)} = \arctan(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \tan(y) = x</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-atan.html")}}</div>
+
+<p class="hidden">La fuente para este ejemplo interactivo se encuentra almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona el repositorio que hay en este link: <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> ; y envíanos una <em>pull request</em>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.atan(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El arcotangente (en radianes) de el número dado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>Math.atan()</code> retorna un valor numérico entre <math><semantics><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><annotation encoding="TeX">-\frac{\pi}{2}</annotation></semantics></math> y <math><semantics><mfrac><mi>π</mi><mn>2</mn></mfrac><annotation encoding="TeX">\frac{\pi}{2}</annotation></semantics></math> radianes.</p>
+
+<p>Dado que <code>atan()</code> es un método estático de <code>Math</code>, siempre debes usarlo como <code>Math.atan()</code>, y no como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.atan()">Usando <code>Math.atan()</code></h3>
+
+<pre class="brush: js">Math.atan(1);   // 0.7853981633974483
+Math.atan(0);   // 0
+Math.atan(-0);  // -0
+
+Math.atan(Infinity); <span class="objectBox objectBox-number">  //  1.5707963267948966
+Math.atan(-Infinity);  // -1.5707963267948966
+
+</span>// El ángulo que la línea [(0,0);(x,y)] forma con el eje-x en un sistema de coordenadas Cartesianas.
+Math.atan(y / x);
+</pre>
+
+<p>Nota que podrías querer evitar usar <strong>±</strong><code>Infinity</code> por razones de estilo. En este caso, {{jsxref("Math.atan2()")}} con <code>0</code> como segundo argumento puede ser una mejor solución.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.4', 'Math.atan')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.atan', 'Math.atan')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.atan', 'Math.atan')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada apartir de datos estructurados. Si quieres contribuir a los datos, por favor consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una <em>pull request</em>.</p>
+
+<p>{{Compat("javascript.builtins.Math.atan")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.acos()")}}</li>
+ <li>{{jsxref("Math.asin()")}}</li>
+ <li>{{jsxref("Math.atan2()")}}</li>
+ <li>{{jsxref("Math.cos()")}}</li>
+ <li>{{jsxref("Math.sin()")}}</li>
+ <li>{{jsxref("Math.tan()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/atan2/index.html b/files/es/web/javascript/reference/global_objects/math/atan2/index.html
new file mode 100644
index 0000000000..26da46befd
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/atan2/index.html
@@ -0,0 +1,142 @@
+---
+title: Math.atan2()
+slug: Web/JavaScript/Reference/Global_Objects/Math/atan2
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan2
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/atan2
+---
+<div>{{JSRef("Global_Objects", "Math")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La función <strong><code>Math.atan2()</code></strong> retorna la arcotangente del cociente de los argumentos.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.atan2(<var>y</var>, <var>x</var>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>y</code></dt>
+ <dd>Primer número.</dd>
+ <dt><code>x</code></dt>
+ <dd>Segundo número.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>El método <code>Math.atan2()</code> retorna un valor númerico entre -π y π representando el ángulo theta de un punto <code>(x, y)</code>. Este es un ángulo en sentido antihorario, medido en radianes, entre el eje positivo X, y el punto (<code>x, y)</code>. Tenga en cuenta que esta función recibe la coordenada Y como primer argumento y X como segundo.</p>
+
+<p>A la función<code> Math.atan2()</code> se  le pasan los argumentos <code>x</code> y <code>y</code> por separado, y a <code>Math.atan()</code> se le pasa la relación de los dos argumentos.</p>
+
+<p>Debido a que  <code>atan2()</code> es un método estatico de <code>Math</code>, siempre se debe usar <code>Math.atan2()</code>, en vez de usarlo como un método creado por el objeto <code>Math</code> (<code>Math</code> no es un contructor).</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_Math.atan2" name="Example:_Using_Math.atan2">Ejemplo: Usando <code>Math.atan2()</code></h3>
+
+<pre class="brush: js">Math.atan2(90, 15); // 1.4056476493802699
+Math.atan2(15, 90); // 0.16514867741462683
+
+Math.atan2(±0, -0);               // ±PI.
+Math.atan2(±0, +0);               // ±0.
+Math.atan2(±0, -x);               // ±PI for x &gt; 0.
+Math.atan2(±0, x);                // ±0 for x &gt; 0.
+Math.atan2(-y, ±0);               // -PI/2 for y &gt; 0.
+Math.atan2(y, ±0);                // PI/2 for y &gt; 0.
+Math.atan2(±y, -Infinity);        // ±PI for finite y &gt; 0.
+Math.atan2(±y, +Infinity);        // ±0 for finite y &gt; 0.
+Math.atan2(±Infinity, x);         // ±PI/2 for finite x.
+Math.atan2(±Infinity, -Infinity); // ±3*PI/4.
+Math.atan2(±Infinity, +Infinity); // ±PI/4.
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Standard</td>
+   <td>Initial definition. Implemented in JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.5', 'Math.atan2')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.atan2', 'Math.atan2')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.acos()")}}</li>
+ <li>{{jsxref("Math.asin()")}}</li>
+ <li>{{jsxref("Math.atan()")}}</li>
+ <li>{{jsxref("Math.cos()")}}</li>
+ <li>{{jsxref("Math.sin()")}}</li>
+ <li>{{jsxref("Math.tan()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/atanh/index.html b/files/es/web/javascript/reference/global_objects/math/atanh/index.html
new file mode 100644
index 0000000000..4030d21a25
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/atanh/index.html
@@ -0,0 +1,88 @@
+---
+title: Math.atanh()
+slug: Web/JavaScript/Reference/Global_Objects/Math/atanh
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/atanh
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/atanh
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.atanh()</code></strong> nos retorna un arco hiperbólico de un numero, eso es:</p>
+
+<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mrow><mo>(</mo><mrow><mo>-</mo><mn>1</mn><mo>,</mo><mn>1</mn></mrow><mo>)</mo></mrow><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.atanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="thinmathspace">arctanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">tanh</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in \left( -1, 1 \right), \mathtt{\operatorname{Math.atanh}(x)} = \operatorname{arctanh}(x) = \text{ el unico } \; y \; \text{de tal manera que} \; \tanh(y) = x</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-atanh.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Math.atanh(<var>x</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><var>x</var></dt>
+ <dd>Un numero.</dd>
+</dl>
+
+<h3 id="Retorna_un_valor">Retorna un valor</h3>
+
+<p>El arco hiperbolico tangible nos otorga un numero.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Por que <code>atanh()</code> es un metodo estatico de <code>Math</code>, tu siempre puedes usar eso como <code>Math.atanh()</code>, se puede usar como un metod de <code>Math</code> objeto que tu creaste (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Polimorfismo">Polimorfismo</h2>
+
+<p>Para <math><semantics><mrow><mrow><mo>|</mo><mi>x</mi><mo>|</mo></mrow><mo>&lt;</mo><mn>1</mn></mrow><annotation encoding="TeX">\left|x\right| &lt; 1</annotation></semantics></math>, tenemos <math><semantics><mrow><mo lspace="0em" rspace="thinmathspace">artanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mfrac><mn>1</mn><mn>2</mn></mfrac><mo lspace="0em" rspace="0em">ln</mo><mrow><mo>(</mo><mfrac><mrow><mn>1</mn><mo>+</mo><mi>x</mi></mrow><mrow><mn>1</mn><mo>-</mo><mi>x</mi></mrow></mfrac><mo>)</mo></mrow></mrow><annotation encoding="TeX">\operatorname {artanh} (x) = \frac{1}{2}\ln \left( \frac{1 + x}{1 - x} \right)</annotation></semantics></math> por lo que esto puede estar emulado con la siguiente función:</p>
+
+<pre class="brush: js notranslate">Math.atanh = Math.atanh || function(x) {
+  return Math.log((1+x)/(1-x)) / 2;
+};
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Using_Math.atanh">Using <code>Math.atanh()</code></h3>
+
+<pre class="brush: js notranslate">Math.atanh(-2);  // NaN
+Math.atanh(-1);  // -Infinito
+Math.atanh(0);   // 0
+Math.atanh(0.5); // 0.5493061443340548
+Math.atanh(1);   // Infinito
+Math.atanh(2);   // NaN
+</pre>
+
+<p>Para valores mayores a 1 o menores a -1, {{jsxref("NaN")}} retorna.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.atanh', 'Math.atanh')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.atanh")}}</p>
+
+<h2 id="Puedes_leer">Puedes leer</h2>
+
+<ul>
+ <li>{{jsxref("Math.acosh()")}}</li>
+ <li>{{jsxref("Math.asinh()")}}</li>
+ <li>{{jsxref("Math.cosh()")}}</li>
+ <li>{{jsxref("Math.sinh()")}}</li>
+ <li>{{jsxref("Math.tanh()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/cbrt/index.html b/files/es/web/javascript/reference/global_objects/math/cbrt/index.html
new file mode 100644
index 0000000000..3d4b32a31b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/cbrt/index.html
@@ -0,0 +1,97 @@
+---
+title: Math.cbrt()
+slug: Web/JavaScript/Reference/Global_Objects/Math/cbrt
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/cbrt
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/cbrt
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.cbrt()</code></strong> nos retorna la raíz del cubo del numero, eso es</p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mi>M</mi><mi>a</mi><mi>t</mi><mi>h</mi><mo>.</mo><mi>c</mi><mi>b</mi><mi>r</mi><mi>t</mi><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mroot><mi>x</mi><mn>3</mn></mroot><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>y</mi><mn>3</mn></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{Math.cbrt(x)} = \sqrt[3]{x} = \text{un unico} \; y \; \text{de tal manera que} \; y^3 = x</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-cbrt.html")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Math.cbrt(<var>x</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><var>x</var></dt>
+ <dd>Un numero</dd>
+</dl>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>La raíz cubica del numero proporcionado</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Al <code>cbrt()</code> ser un metodo estatico de <code>Math</code>, tu siempre la puedes usar como <code>Math.cbrt()</code>,un metodo de <code>Math</code> que es un objeto que se crea (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Poliformismo">Poliformismo</h2>
+
+<p>Para <math><semantics><mrow><mi>x</mi><mo>≥</mo><mn>0</mn></mrow><annotation encoding="TeX">x \geq 0</annotation></semantics></math>, tenemos <math><semantics><mrow><mroot><mi>x</mi><mn>3</mn></mroot><mo>=</mo><msup><mi>x</mi><mrow><mn>1</mn><mo>/</mo><mn>3</mn></mrow></msup></mrow><annotation encoding="TeX">\sqrt[3]{x} = x^{1/3}</annotation></semantics></math> esto puede ser emulado con la siguiente función:</p>
+
+<pre class="brush: js notranslate">if (!Math.cbrt) {
+  Math.cbrt = (function(pow) {
+    return function cbrt(x){
+      // Esto asegura que numeros negativos sigan siendo negativos
+      return x &lt; 0 ? -pow(-x, 1/3) : pow(x, 1/3);
+    };
+  })(Math.pow); // Localiza Math.pow para una mayor eficiencía
+}
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.cbrt">Usando Math.cbrt()</h3>
+
+<pre class="brush: js notranslate">Math.cbrt(NaN); // NaN
+Math.cbrt(-1); // -1
+Math.cbrt(-0); // -0
+Math.cbrt(-Infinity); // -Infinito
+Math.cbrt(0); // 0
+Math.cbrt(1); // 1
+Math.cbrt(Infinity); // Infinito
+Math.cbrt(null); // 0
+Math.cbrt(2);  // 1.2599210498948732
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.cbrt', 'Math.cbrt')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad">Compatibilidad</h2>
+
+<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a></div>
+
+<div class="hidden">
+
+</div>
+
+<p><a href="https://github.com/mdn/browser-compat-data">and send us a pull request.</a></p>
+
+<p><a href="https://github.com/mdn/browser-compat-data">{{Compat("javascript.builtins.Math.cbrt")}}</a></p>
+
+<h2 id="Puedes_leer">Puedes leer</h2>
+
+<ul>
+ <li><a href="https://github.com/mdn/browser-compat-data">{{jsxref("Math.pow()")}}</a></li>
+ <li><a href="https://github.com/mdn/browser-compat-data">{{jsxref("Math.sqrt()")}}</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/ceil/index.html b/files/es/web/javascript/reference/global_objects/math/ceil/index.html
new file mode 100644
index 0000000000..c0cd2faf6a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/ceil/index.html
@@ -0,0 +1,167 @@
+---
+title: Math.ceil()
+slug: Web/JavaScript/Reference/Global_Objects/Math/ceil
+tags:
+  - JavaScript
+  - Math
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/ceil
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/ceil
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.ceil()</code></strong> devuelve el entero mayor o igual más próximo a un número dado.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-ceil.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.ceil(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El número entero mayor o igual más próximo que el número dado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Como <code>ceil()</code> es un método estático de <code>Math</code>, siempre debe usarlo como <code>Math.ceil()</code>, en lugar de como un método de un objeto que ha creado <code>Math</code> (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_Math.ceil()">Utilizando <code>Math.ceil()</code></h3>
+
+<p>El siguiente ejemplo muestra el uso de <code>Math.ceil()</code>.</p>
+
+<pre class="brush: js">Math.ceil(.95);    // 1
+Math.ceil(4);      // 4
+Math.ceil(7.004);  // 8
+Math.ceil(-0.95);  // -0
+Math.ceil(-4);     // -4
+Math.ceil(-7.004); // -7
+</pre>
+
+<h3 id="Ajuste_decimal">Ajuste decimal</h3>
+
+<pre class="brush: js">// Closure
+(function() {
+  /**
+   * Ajuste decimal de un número.
+   *
+   * @param {String}  type  El tipo de ajuste.
+   * @param {Number}  value El número.
+   * @param {Integer} exp   El exponente (El logaritmo de ajuste en base 10).
+   * @returns {Number} El valor ajustado.
+   */
+  function decimalAdjust(type, value, exp) {
+    // Si exp es undefined o cero...
+    if (typeof exp === 'undefined' || +exp === 0) {
+      return Math[type](value);
+    }
+    value = +value;
+    exp = +exp;
+    // Si el valor no es un número o exp no es un entero...
+    if (isNaN(value) || !(typeof exp === 'number' &amp;&amp; exp % 1 === 0)) {
+      return NaN;
+    }
+    // Shift
+    value = value.toString().split('e');
+    value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
+    // Shift back
+    value = value.toString().split('e');
+    return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
+  }
+
+  // Decimal round
+  if (!Math.round10) {
+    Math.round10 = function(value, exp) {
+      return decimalAdjust('round', value, exp);
+    };
+  }
+  // Decimal floor
+  if (!Math.floor10) {
+    Math.floor10 = function(value, exp) {
+      return decimalAdjust('floor', value, exp);
+    };
+  }
+  // Decimal ceil
+  if (!Math.ceil10) {
+    Math.ceil10 = function(value, exp) {
+      return decimalAdjust('ceil', value, exp);
+    };
+  }
+})();
+
+// Round
+Math.round10(55.55, -1);   // 55.6
+Math.round10(55.549, -1);  // 55.5
+Math.round10(55, 1);       // 60
+Math.round10(54.9, 1);     // 50
+Math.round10(-55.55, -1);  // -55.5
+Math.round10(-55.551, -1); // -55.6
+Math.round10(-55, 1);      // -50
+Math.round10(-55.1, 1);    // -60
+// Floor
+Math.floor10(55.59, -1);   // 55.5
+Math.floor10(59, 1);       // 50
+Math.floor10(-55.51, -1);  // -55.6
+Math.floor10(-51, 1);      // -60
+// Ceil
+Math.ceil10(55.51, -1);    // 55.6
+Math.ceil10(51, 1);        // 60
+Math.ceil10(-55.59, -1);   // -55.5
+Math.ceil10(-59, 1);       // -50
+</pre>
+
+<h2 id="Espicificaciones">Espicificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.6', 'Math.ceil')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.ceil', 'Math.ceil')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.ceil', 'Math.ceil')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Math.ceil")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.abs()")}}</li>
+ <li>{{jsxref("Math.floor()")}}</li>
+ <li>{{jsxref("Math.round()")}}</li>
+ <li>{{jsxref("Math.sign()")}}</li>
+ <li>{{jsxref("Math.trunc()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/cos/index.html b/files/es/web/javascript/reference/global_objects/math/cos/index.html
new file mode 100644
index 0000000000..1ed9a36f2d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/cos/index.html
@@ -0,0 +1,75 @@
+---
+title: Math.cos()
+slug: Web/JavaScript/Reference/Global_Objects/Math/cos
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/cos
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/cos
+---
+<div>{{JSRef}}</div>
+
+<p><span class="seoSummary">La función estática <strong><code>Math.cos()</code></strong> devuelve el <a href="https://es.wikipedia.org/wiki/Coseno">coseno</a> del ángulo especificado, que debe ser especificado en <a href="https://es.wikipedia.org/wiki/Radi%C3%A1n" title="radians">radianes</a>. Este valor es </span><math style="display: inline;"> <mstyle displaystyle="true"> <mfrac> <msub> <mrow> <mtext>longitud</mtext> </mrow> <mrow> <mrow> <mtext>adyacente</mtext> </mrow> </mrow> </msub> <msub> <mrow> <mtext>longitud</mtext> </mrow> <mrow> <mrow> <mtext>hipotenusa</mtext> </mrow> </mrow> </msub> </mfrac> </mstyle> </math>.<span style="display: none;"> </span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-cos.html")}}</div>
+
+<p class="hidden">El código fuente de este ejemplo interactivo está almacenado en un repositorio de GitHub. Si te gustaría contribuir con el proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Math.cos(<var>x</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>El ángulo en radianes por el cual devolverá el coseno.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El coseno del número dado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>Math.cos()</code> retorna un valor numérico entre -1 y 1, que representa el coseno del ángulo.</p>
+
+<p>Debido a que <code>cos()</code> es un método estático de <code>Math</code>, siempre debes utilizarlo como <code>Math.cos()</code>, en lugar de como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.cos">Usando <code>Math.cos()</code></h3>
+
+<pre class="brush: js notranslate">Math.cos(0);           // 1
+Math.cos(1);           // 0.5403023058681398
+
+Math.cos(Math.PI);     // -1
+Math.cos(2 * Math.PI); // 1
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.cos', 'Math.cos')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si te gustaría contribuir a los datos, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.cos")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.acos()")}}</li>
+ <li>{{jsxref("Math.asin()")}}</li>
+ <li>{{jsxref("Math.atan()")}}</li>
+ <li>{{jsxref("Math.atan2()")}}</li>
+ <li>{{jsxref("Math.sin()")}}</li>
+ <li>{{jsxref("Math.tan()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/e/index.html b/files/es/web/javascript/reference/global_objects/math/e/index.html
new file mode 100644
index 0000000000..5d4c3bf160
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/e/index.html
@@ -0,0 +1,84 @@
+---
+title: Math.E
+slug: Web/JavaScript/Reference/Global_Objects/Math/E
+tags:
+  - JavaScript
+  - Math
+  - Property
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/E
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/E
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>Math.E</strong></code> representa la base de los logaritmos naturales, e, aproximadamente 2.718.</p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.E</mi></mstyle><mo>=</mo><mi>e</mi><mo>≈</mo><mn>2.718</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.E}} = e \approx 2.718</annotation></semantics></math></p>
+
+<p>{{EmbedInteractiveExample("pages/js/math-e.html")}}</p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Porque <code>E</code> es una propiedad estática de <code>Math</code>, siempre usted lo usa como <code>Math.E</code>, en lugar de como una propiedad de un objeto <code>Math</code> creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_Math.E" name="Example:_Using_Math.E">Utilizando <code>Math.E</code></h3>
+
+<p>La función siguiente devuelve e:</p>
+
+<pre class="brush:js">function getNapier() {
+   return Math.E
+}
+
+getNapier(); // 2.718281828459045</pre>
+
+<p> </p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.1.1', 'Math.E')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.e', 'Math.E')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.e', 'Math.E')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Math.E")}}</p>
+
+<p> </p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log1p()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/exp/index.html b/files/es/web/javascript/reference/global_objects/math/exp/index.html
new file mode 100644
index 0000000000..867b28175a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/exp/index.html
@@ -0,0 +1,137 @@
+---
+title: Math.exp()
+slug: Web/JavaScript/Reference/Global_Objects/Math/exp
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/exp
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/exp
+---
+<div>{{JSRef}}</div>
+
+<div>La función <strong>Math.exp()</strong> devuelve <code>e<sup>x</sup></code>, donde <code>x</code> es el argumento, y <code>e</code> es {{jsxref("Math.E", "El número de Euler (también conocido como la constante de Napier)", "", 1)}}, la base de los algoritmos naturales.</div>
+
+<div> </div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.exp(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un número represetando <code>e<sup>x</sup></code>, donde <code>e</code> es {{jsxref("Math.E", "número de Euler", "", 1)}} y <code>x</code> es el argumento.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Porque <code>exp()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.exp()</code>, en vez de un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.exp()">Usando <code>Math.exp()</code></h3>
+
+<pre class="brush: js">Math.exp(-1); // 0.36787944117144233
+Math.exp(0);  // 1
+Math.exp(1);  // 2.718281828459045
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>
+    <p>Definición inicial. Implementado en JavaScript 1.0.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.8', 'Math.exp')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.exp', 'Math.exp')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.exp', 'Math.exp')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Math.E")}}</li>
+ <li>{{jsxref("Math.expm1()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log10()")}}</li>
+ <li>{{jsxref("Math.log1p()")}}</li>
+ <li>{{jsxref("Math.log2()")}}</li>
+ <li>{{jsxref("Math.pow()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/expm1/index.html b/files/es/web/javascript/reference/global_objects/math/expm1/index.html
new file mode 100644
index 0000000000..b3dfe0649b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/expm1/index.html
@@ -0,0 +1,90 @@
+---
+title: Math.expm1()
+slug: Web/JavaScript/Reference/Global_Objects/Math/expm1
+tags:
+  - JavaScript
+  - Matemáticas
+  - Math
+  - Method
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/expm1
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/expm1
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.expm1()</code></strong> regresa <code>e<sup>x</sup> - 1</code>, donde <code>x</code> es el argumento, y {{jsxref("Math.E", "e", "", 1)}} la base del logaritmo natural.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-expm1.html")}}</div>
+
+<div class="hidden">El código para este ejemplo interactivo está almacenado en un repositorio de GitHub. Sí te gustaría contribuir al proyecto de ejemplos interactivos If you'd like to contribute, por favor clona  <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull request.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">Math.expm1(<var>x</var>)</pre>
+
+<h3 id="Parámetos">Parámetos</h3>
+
+<dl>
+ <dt><code><var>x</var></code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un número representando <code>e<sup>x</sup> - 1</code>, donde <code>e</code> es {{jsxref("Math.E", "Número de Euler", "", 1)}} y  <code>x</code> es el argumento.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Debido a que <code>expm1()</code> es un método estático de <code>Math</code>, uselo siempre como <code>Math.expm1()</code>, en lugar de como un método del objeto <code>Math</code> que creó (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.expm1">Usando Math.expm1()</h3>
+
+<pre class="brush: js notranslate">Math.expm1(-1); // -0.6321205588285577
+Math.expm1(0);  // 0
+Math.expm1(1);  // 1.718281828459045
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Esto puede ser emulado con la ayuda de la función {{jsxref("Math.exp()")}}:</p>
+
+<pre class="brush: js notranslate">Math.expm1 = Math.expm1 || function(x) {
+  return Math.exp(x) - 1;
+};
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.expm1', 'Math.expm1')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada de información estructurada. Sí le gustaría contribuir a la información, por favor consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
+
+<p>{{Compat("javascript.builtins.Math.expm1")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Math.E")}}</li>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log10()")}}</li>
+ <li>{{jsxref("Math.log1p()")}}</li>
+ <li>{{jsxref("Math.log2()")}}</li>
+ <li>{{jsxref("Math.pow()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/floor/index.html b/files/es/web/javascript/reference/global_objects/math/floor/index.html
new file mode 100644
index 0000000000..03ad07325e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/floor/index.html
@@ -0,0 +1,125 @@
+---
+title: Math.floor()
+slug: Web/JavaScript/Reference/Global_Objects/Math/floor
+tags:
+  - JavaScript
+  - Math
+  - Method
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/floor
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/floor
+---
+<div>{{JSRef("Objetos_globales", "Math")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>Devuelve el máximo entero menor o igual a un número.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Math.floor(<em>x</em>) </code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Es número.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Como <code>floor</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.floor()</code>, en lugar de usarlo como un método de un objeto <code>Math</code> creado.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example_Using_Math.floor" name="Example:_Using_Math.floor">Ejemplo: Usando <code>Math.floor</code></h3>
+
+<p>La siguiente función devuelve el valor entero redondeado más bajo de la variable <code>x</code>:</p>
+
+<pre class="brush:js notranslate">function getFloor(x) {
+   return Math.floor(x);
+}</pre>
+
+<p>Si se pasa <code>45.95</code> a <code>getFloor</code>, éste devuelve <code>45</code>; si se le pasa <code>-45.95</code>,  devuelve <code>-46</code>.</p>
+
+<h3 id="Example_Decimal_adjustment" name="Example:_Decimal_adjustment">Ejemplo: Ajuste decimal</h3>
+
+<pre class="brush:js notranslate">// Cierre
+(function(){
+
+	/**
+	 * Ajuste decimal de un número.
+	 *
+	 * @param	{String}	type	El tipo de ajuste.
+	 * @param	{Number}	value	El número.
+	 * @param	{Integer}	exp		El exponente(el logaritmo en base 10 del ajuste).
+	 * @returns	{Number}			El valor ajustado.
+	 */
+	function decimalAdjust(type, value, exp) {
+		// Si el exp es indefinido o cero...
+		if (typeof exp === 'undefined' || +exp === 0) {
+			return Math[type](value);
+		}
+		value = +value;
+		exp = +exp;
+		// Si el valor no es un número o el exp no es un entero...
+		if (isNaN(value) || !(typeof exp === 'number' &amp;&amp; exp % 1 === 0)) {
+			return NaN;
+		}
+		// Cambio
+		value = value.toString().split('e');
+		value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
+		// Volver a cambiar
+		value = value.toString().split('e');
+		return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
+	}
+
+	// Redondeo decimal
+	if (!Math.round10) {
+		Math.round10 = function(value, exp) {
+			return decimalAdjust('round', value, exp);
+		};
+	}
+	// Redondeo hacia abajo
+	if (!Math.floor10) {
+		Math.floor10 = function(value, exp) {
+			return decimalAdjust('floor', value, exp);
+		};
+	}
+	// Redondeo hacia arriba
+	if (!Math.ceil10) {
+		Math.ceil10 = function(value, exp) {
+			return decimalAdjust('ceil', value, exp);
+		};
+	}
+
+})();
+
+// Redondeo
+Math.round10(55.55, -1); // 55.6
+Math.round10(55.549, -1); // 55.5
+Math.round10(55, 1); // 60
+Math.round10(54.9, 1); // 50
+Math.round10(-55.55, -1); // -55.5
+Math.round10(-55.551, -1); // -55.6
+Math.round10(-55, 1); // -50
+Math.round10(-55.1, 1); // -60
+// Piso
+Math.floor10(55.59, -1); // 55.5
+Math.floor10(59, 1); // 50
+Math.floor10(-55.51, -1); // -55.6
+Math.floor10(-51, 1); // -60
+// Techo
+Math.ceil10(55.51, -1); // 55.6
+Math.ceil10(51, 1); // 60
+Math.ceil10(-55.59, -1); // -55.5
+Math.ceil10(-59, 1); // -50
+</pre>
+
+<h2 id="See_also" name="See_also">Ven También</h2>
+
+<ul>
+ <li>El {{jsxref("Math")}} objeto.</li>
+ <li>{{jsxref("Math.abs")}}</li>
+ <li>{{jsxref("Math.ceil()")}}</li>
+ <li>{{jsxref("Math.round()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/fround/index.html b/files/es/web/javascript/reference/global_objects/math/fround/index.html
new file mode 100644
index 0000000000..0d2cd9a859
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/fround/index.html
@@ -0,0 +1,200 @@
+---
+title: Math.fround()
+slug: Web/JavaScript/Reference/Global_Objects/Math/fround
+tags:
+  - JavaScript
+  - Math
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/fround
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/fround
+---
+<div>{{JSRef}}</div>
+
+<p class="seoSummary">The <strong><code>Math.fround()</code></strong> function returns the nearest <a class="external" href="https://en.wikipedia.org/wiki/Single-precision_floating-point_format" title="link to the wikipedia page on single-precision floating-point format">32-bit single precision</a> float representation of a {{jsxref("Number")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-fround.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">var <em>singleFloat</em> = Math.fround(<em>doubleFloat</em>);</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+ <dt><code>doubleFloat</code></dt>
+ <dd>A {{jsxref("Number")}}. If the parameter is of a different type, it will get converted to a number or to {{jsxref("NaN")}} if it cannot be converted.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>The nearest <a class="external" href="https://en.wikipedia.org/wiki/Single-precision_floating-point_format" title="link to the wikipedia page on single-precision floating-point format">32-bit single precision</a> float representation of the given number.</p>
+
+<h2 id="Description">Description</h2>
+
+<p>JavaScript uses 64-bit double floating-point numbers internally, which offer a very high precision. However, sometimes you may be working with 32-bit floating-point numbers, for example if you are reading values from a {{jsxref("Float32Array")}}. This can create confusion: Checking a 64-bit float and a 32-bit float for equality may fail even though the numbers are seemingly identical.</p>
+
+<p>To solve this, <code>Math.fround()</code> can be used to cast the 64-bit float to a 32-bit float. Internally, JavaScript continues to treat the number as a 64-bit float, it just performs a "round to even" on the 23rd bit of the mantissa, and sets all following mantissa bits to <code>0</code>. If the number is outside the range of a 32-bit float, <code>{{jsxref("Infinity")}}</code> or <code>-Infinity</code> is returned.</p>
+
+<p>Because <code>fround()</code> is a static method of <code>Math</code>, you always use it as <code>Math.fround()</code>, rather than as a method of a <code>Math</code> object you created (<code>Math</code> is not a constructor).</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_Math.fround()">Using <code>Math.fround()</code></h3>
+
+<p>The number 1.5 can be precisely represented in the binary numeral system, and is identical in 32-bit and 64-bit:</p>
+
+<pre class="brush: js">Math.fround(1.5); // 1.5
+Math.fround(1.5) === 1.5; // true
+</pre>
+
+<p>However, the number 1.337 cannot be precisely represented in the binary numeral system, so it differs in 32-bit and 64-bit:</p>
+
+<pre class="brush: js">Math.fround(1.337); // 1.3370000123977661
+Math.fround(1.337) === 1.337; // false
+</pre>
+
+<p><math><semantics><msup><mn>2</mn><mn>150</mn></msup><annotation encoding="TeX">2^150</annotation></semantics></math> is too big for a 32-bit float, so <code>Infinity</code> is returned:</p>
+
+<pre class="brush: js">2 ** 150; // 1.42724769270596e+45
+Math.fround(2 ** 150); // Infinity
+</pre>
+
+<p>If the parameter cannot be converted to a number, or it is <a href="https://en.wikipedia.org/wiki/NaN" title="NaN on Wikipedia">not-a-number</a> (<code>NaN</code>), <code>Math.fround()</code> will return <code>NaN</code>:</p>
+
+<pre class="brush: js">Math.fround('abc'); // NaN
+Math.fround(NaN); // NaN
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>This can be emulated with the following function, if {{jsxref("Float32Array")}} are supported:</p>
+
+<pre class="brush: js">Math.fround = Math.fround || (function (array) {
+  return function(x) {
+    return array[0] = x, array[0];
+  };
+})(new Float32Array(1));
+</pre>
+
+<p>Supporting older browsers is slower, but also possible:</p>
+
+<pre class="brush: js">if (!Math.fround) Math.fround = function(arg) {
+  arg = Number(arg);
+  // Return early for ±0 and NaN.
+  if (!arg) return arg;
+  var sign = arg &lt; 0 ? -1 : 1;
+  if (sign &lt; 0) arg = -arg;
+  // Compute the exponent (8 bits, signed).
+  var exp = Math.floor(Math.log(arg) / Math.LN2);
+  var powexp = Math.pow(2, Math.max(-126, Math.min(exp, 127)));
+  // Handle subnormals: leading digit is zero if exponent bits are all zero.
+  var leading = exp &lt; -127 ? 0 : 1;
+  // Compute 23 bits of mantissa, inverted to round toward zero.
+  var mantissa = Math.round((leading - arg / powexp) * 0x800000);
+  if (mantissa &lt;= -0x800000) return sign * Infinity;
+  return sign * powexp * (leading - mantissa / 0x800000);
+};</pre>
+
+<h2 id="Faster_Alternative_Polyfill_(Work_In_Progress)">Faster Alternative Polyfill (Work In Progress)</h2>
+
+<p>The below polyfill is much faster and uses double-precision rounding errors to emulate the rounding errors caused by floating point narrowing. Although the polyfill higher on the page is good for comprehension, all of the complex Math function that it uses make it terrible slow. Although this polyfill is much faster, it is off by a bit in about 1 out of 2048 of the tests due to the tendency to round upwards like <code>Math.ceil</code> instead of like <code>Math.round</code> in the division of the subnormal-handling section of the code. Because single precision floating points have 23 bits of precision, the mean error deviation from the correct value is roughly <code>2**-28</code> or 0.0000000058%. This deviation from the correct value should be insignifigant in most circumstances, however please edit this polyfill if you have some tweaks to increase correctness without bloating the code size too much. NaN is not optimized for because it is most likely (almost certain) that you will not be calling <code>Math.fround</code> with NaN exclusively in a tight loop. Moreover, an additional check just for NaN instead of letting NaN naturally arise would induce a performance penalty for this function in older browsers when not called with NaN. Thus, the code below handles NaN correctly, but inefficiently for good reason.</p>
+
+<pre class="brush: js">const Math_round = Math.round;
+if (!Math.fround) Math.fround = function(x) {
+    if (x &gt; 3.402823669209385e+38) return Infinity; // maximum float is 2**128
+    if (x &lt; -3.402823669209385e+38) return -Infinity; // minimum is -2**128
+    if (-1.1754943508222875e-38 &lt; x &amp;&amp; x &lt; 1.1754943508222875e-38) {
+        if (-1.401298464324817e-45 &lt; x &amp;&amp; x &lt; 1.401298464324817e-45) return 0;
+        // else, it is a subnormal
+        var mul = Math_round(x/1.4012984643e-45)*1e-323;
+        return mul * 1.418129833677085e+278;
+    }
+
+    var hi = x * 9007199254740992; // 9007199254740992 is 2**53 which is the maximum of double precision
+    var exp = (x + hi) - hi; // adding this number chops off all lower bits, rounding the number.
+    exp /= 16777216; // 8388608 = 2**23 * 2, so preserve 23 bits in x because there are 23 bits in a float
+                     //            The "* 2" compensates for the addition shifting up the bits unwantedly
+    return Math_round(x / exp) * exp;
+}
+</pre>
+
+<p>Below is code used to test for deviations from the correct value. The code below is meant for testing the merit of the function, not for polyfilling older browsers (as evidenced by the fact that the native Math.fround function is used).</p>
+
+<pre class="brush: js">requestIdleCallback(function(){"use strict";
+    const Math_fround = Math.fround;
+    const Math_round = Math.round;
+    function my_fround(x) {
+        if (x &gt; 3.402823669209385e+38) return Infinity; // maximum float is 2**128
+        if (x &lt; -3.402823669209385e+38) return -Infinity; // minimum is -2**128
+        if (-1.1754943508222875e-38 &lt; x &amp;&amp; x &lt; 1.1754943508222875e-38) {
+            if (-1.401298464324817e-45 &lt; x &amp;&amp; x &lt; 1.401298464324817e-45) return 0;
+            // else, it is a subnormal
+            var mul = Math_round(x/1.4012984643e-45)*1e-323;
+            return mul * 1.418129833677085e+278;
+        }
+
+        var hi = x * 9007199254740992; // 9007199254740992 is 2**53 which is the maximum of double precision
+        var exp = (x + hi) - hi; // adding this number chops off all lower bits, rounding the number.
+        exp /= 16777216; // 8388608 = 2**23 * 2, so preserve 23 bits in x because there are 23 bits in a float
+                         //            The "* 2" compensates for the addition shifting up the bits unwantedly
+        return Math_round(x / exp) * exp;
+    }
+
+    const doublesArray = new Float64Array(8192);
+    const int32s = new Uint32Array(doublesArray.buffer);
+
+    const crypto = window.crypto;
+
+    var hasWarned = false, warnings=0;
+    for (var i=0; i&lt;4; i=i+1|0) {
+        crypto.getRandomValues(int32s);
+        for (var k=0; k&lt;8192; k=k+1|0) {
+            const myValue = my_fround(doublesArray[k]);
+            const froundVal = Math_fround(doublesArray[k]);
+            // quicker version of Object.is because of no function call overhead:
+            if (myValue === myValue ? myValue !== froundVal : froundVal === froundVal) {
+                if (!hasWarned) console.error(doublesArray[k]); // only show the first incorrect number
+                hasWarned = true;
+                warnings = warnings + 1|0;
+            }
+        }
+    }
+    console[warnings &gt; 0 ? "warn" : "log"]( "Total number of mishandled floats: " + warnings );
+});</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.fround', 'Math.fround')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.fround', 'Math.fround')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.fround")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Math.round()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/hypot/index.html b/files/es/web/javascript/reference/global_objects/math/hypot/index.html
new file mode 100644
index 0000000000..5fb2d24a5a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/hypot/index.html
@@ -0,0 +1,125 @@
+---
+title: Math.hypot()
+slug: Web/JavaScript/Reference/Global_Objects/Math/hypot
+tags:
+  - JavaScript
+  - Math
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/hypot
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/hypot
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.hypot()</code></strong> retorna la raíz cuadrada de la suma de los cuadrados de sus argumentos, es decir:</p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.hypot</mo><mo stretchy="false">(</mo><msub><mi>v</mi><mn>1</mn></msub><mo>,</mo><msub><mi>v</mi><mn>2</mn></msub><mo>,</mo><mo>…</mo><mo>,</mo><msub><mi>v</mi><mi>n</mi></msub><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msqrt><mrow><munderover><mo>∑</mo><mrow><mi>i</mi><mo>=</mo><mn>1</mn></mrow><mi>n</mi></munderover><msubsup><mi>v</mi><mi>i</mi><mn>2</mn></msubsup></mrow></msqrt><mo>=</mo><msqrt><mrow><msubsup><mi>v</mi><mn>1</mn><mn>2</mn></msubsup><mo>+</mo><msubsup><mi>v</mi><mn>2</mn><mn>2</mn></msubsup><mo>+</mo><mo>…</mo><mo>+</mo><msubsup><mi>v</mi><mi>n</mi><mn>2</mn></msubsup></mrow></msqrt></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.hypot}(v_1, v_2, \dots, v_n)} = \sqrt{\sum_{i=1}^n v_i^2} = \sqrt{v_1^2 + v_2^2 + \dots + v_n^2}</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-hypot.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.hypot(<var>valor1</var>, <var>valor2</var>, ..., <em>valorN</em>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>Valor1, Valor2, ...</code></dt>
+ <dd>Números.</dd>
+</dl>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>La raíz cuadrada de la suma de los cuadrados de los argumentos proporcionados. Si tan sólo uno de los argumentos no pudiese ser convertido a un número, se retornaría {{jsxref("NaN")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Para calcular la hipotenusa de un triángulo rectángulo, o la magnitud de un número complejo, se usa el Teorema de Pitágoras, representado en la siguiente fórmula <code>Math.sqrt(v1*v1 + v2*v2)</code> donde <em>v1</em> y <em>v2</em> son, o los catetos del triángulo, o los valores reales y complejos usados para hallar la mencionada magnitud. Para calcular distancias de dos o más dimensiones, simplemente añade más valores al cuadrado (multiplicado por sí mismo) dentro de el método <code>sqrt()</code> del objeto <code>Math</code>, algo como: <code>Math.sqrt(v1*v1 + v2*v2 + v3*v3 + v4*v4)</code>.  </p>
+
+<p>Esta función lo hace un poco más fácil y rápido, sólo coloca: <code>Math.hypot(v1, v2)</code> , o <code>Math.hypot(v1, v2, v3, v4, ...)</code> .  </p>
+
+<p>Esto también evita un problema si la magnitud de tus números es muy elevada. El número más largo que puedes representar en JavaScript es <span style="line-height: 1.5;"><code>Number.MAX_VALUE = 1.797...e+308</code> .  Si tus números son mayores que 1e154, tomando el cuadrado de esos valores resultaría en infinito destruyendo así tus resultados. Por ejemplo, <code>Math.sqrt(1e200*1e200 + 1e200*1e200) = Infinito</code>. Si usas <code>hypot()</code> en su lugar, tú obtendrías un buen resultado <code>Math.hypot(1e200, 1e200) = 1.4142...e+200</code> .  Eso también es verdad con números demasiados pequeños.  <code>Math.sqrt(1e-200*1e-200 + 1e-200*1e-200) = 0</code>, pero si en su lugar, usamos </span><code><span style="line-height: 1.5;">Math.hypot(1e-200, 1e-200) =</span></code><span style="line-height: 1.5;"><code>1.4142...e-200</code>, obtendríamos un buen resultado una vez más.</span></p>
+
+<p>Debido a que <code>hypot()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.hypot()</code>, en lugar de un método del objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
+
+<p>Si ningún argumento es provisto, el resultado es 0.</p>
+
+<p>Con sólo un argumento, <code>Math.hypot()</code> retornaría lo mismo que <code>Math.abs()</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.hypot()">Usando <code>Math.hypot()</code></h3>
+
+<pre class="brush: js">Math.hypot(3, 4);        // 5
+Math.hypot(3, 4, 5);     // 7.0710678118654755
+Math.hypot();            // 0
+Math.hypot(NaN);         // NaN
+Math.hypot(3, 4, 'foo'); // NaN, +'foo' =&gt; NaN
+Math.hypot(3, 4, '5');   // 7.0710678118654755, +'5' =&gt; 5
+Math.hypot(-3);          // 3, lo mismo que Math.abs(-3)
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Esto puede ser emulado usando la siguiente función:</p>
+
+<pre class="brush: js">Math.hypot = Math.hypot || function() {
+  var y = 0, i = arguments.length;
+  while (i--) y += arguments[i] * arguments[i];
+  return Math.sqrt(y);
+};
+</pre>
+
+<p>Un polyfill que evita subdesbordamientos (underflows) y desbordamientos (overflows):</p>
+
+<pre class="brush: js">Math.hypot = function (x, y) {
+  // https://bugzilla.mozilla.org/show_bug.cgi?id=896264#c28
+  var max = 0;
+  var s = 0;
+  for (var i = 0; i &lt; arguments.length; i += 1) {
+    var arg = Math.abs(Number(arguments[i]));
+    if (arg &gt; max) {
+      s *= (max / arg) * (max / arg);
+      max = arg;
+    }
+    s += arg === 0 &amp;&amp; max === 0 ? 0 : (arg / max) * (arg / max);
+  }
+  return max === 1 / 0 ? 1 / 0 : max * Math.sqrt(s);
+};
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-math.hypot', 'Math.hypot')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.hypot', 'Math.hypot')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.hypot")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.abs()")}}</li>
+ <li>{{jsxref("Math.pow()")}}</li>
+ <li>{{jsxref("Math.sqrt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/index.html b/files/es/web/javascript/reference/global_objects/math/index.html
new file mode 100644
index 0000000000..b010ad42a5
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/index.html
@@ -0,0 +1,197 @@
+---
+title: Math
+slug: Web/JavaScript/Reference/Global_Objects/Math
+tags:
+  - JavaScript
+  - Math
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math
+---
+<div>{{JSRef}}</div>
+
+<p><strong><code>Math</code></strong> es un objeto incorporado que tiene propiedades y métodos para constantes y funciones matemáticas. No es un objeto de función.</p>
+
+<p><strong><code>Math</code></strong> funciona con el tipo {{jsxref("Number")}}. No funciona con {{jsxref("BigInt")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>A diferencia de los demás objetos globales, el objeto <code>Math</code><strong> </strong>no se puede editar. Todas las propiedades y métodos de <code>Math</code> son<strong> </strong>estáticos. Usted se puede referir a la constante <em>pi</em> como <code>Math.PI</code><em><strong> </strong> </em>y puede llamar a la función <em>seno </em>como <code>Math.sin(x)</code>,<em><strong> </strong></em>donde<em><strong> </strong></em><code><strong>x</strong></code><em><strong> </strong></em>es el argumento del método. Las constantes se definen con la precisión completa de los números reales en JavaScript.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("Math.E")}}</dt>
+ <dd>Constante de Euler, la base de los logaritmos naturales, aproximadamente 2.718.</dd>
+ <dt>{{jsxref("Math.LN2")}}</dt>
+ <dd>Logaritmo natural de 2, aproximadamente 0.693.</dd>
+ <dt>{{jsxref("Math.LN10")}}</dt>
+ <dd>Logaritmo natural de 10, aproximadamente 2.303.</dd>
+ <dt>{{jsxref("Math.LOG2E")}}</dt>
+ <dd>Logaritmo de E con base 2, aproximadamente 1.443.</dd>
+ <dt>{{jsxref("Math.LOG10E")}}</dt>
+ <dd>Logaritmo de E con base 10, aproximadamente 0.434.</dd>
+ <dt>{{jsxref("Math.PI")}}</dt>
+ <dd>Ratio de la circunferencia de un circulo respecto a su diámetro, aproximadamente 3.14159.</dd>
+ <dt>{{jsxref("Math.SQRT1_2")}}</dt>
+ <dd>Raíz cuadrada de 1/2; Equivalentemente, 1 sobre la raíz cuadrada de 2, aproximadamente 0.707.</dd>
+ <dt>{{jsxref("Math.SQRT2")}}</dt>
+ <dd>Raíz cuadrada de 2, aproximadamente 1.414.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<div class="note">
+<p>Tenga en cuenta que las funciones trigonométricas (<code>sin()</code>, <code>cos()</code>, <code>tan()</code>, <code>asin()</code>, <code>acos()</code>, <code>atan()</code>, <code>atan2()</code>) devuelven ángulos en radianes. Para convertir radianes a grados, divida por <code>(Math.PI / 180)</code>, y multiplique por esto para convertir a la inversa.</p>
+</div>
+
+<div class="note">
+<p>Tenga en cuenta que muchas de las funciones matemáticas tienen una precisión que es dependiente de la implementación. Esto significa que los diferentes navegadores pueden dar un resultado diferente, e incluso el mismo motor de JS en un sistema operativo o arquitectura diferente puede dar resultados diferentes.</p>
+</div>
+
+<dl>
+ <dt>{{jsxref("Global_Objects/Math/abs", "Math.abs(x)")}}</dt>
+ <dd>Devuelve el valor absoluto de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/acos", "Math.acos(x)")}}</dt>
+ <dd>Devuelve el arco coseno de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/acosh", "Math.acosh(x)")}}</dt>
+ <dd>Devuelve el arco coseno hiperbólico de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/asin", "Math.asin(x)")}}</dt>
+ <dd>Devuelve el arco seno de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/asinh", "Math.asinh(x)")}}</dt>
+ <dd>Devuelve el arco seno hiperbólico de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/atan", "Math.atan(x)")}}</dt>
+ <dd>Devuelve el arco tangente de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/atanh", "Math.atanh(x)")}}</dt>
+ <dd>Devuelve el arco tangente hiperbólico de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/atan2", "Math.atan2(y, x)")}}</dt>
+ <dd>Devuelve el arco tangente del cuociente de sus argumentos.</dd>
+ <dt>{{jsxref("Global_Objects/Math/cbrt", "Math.cbrt(x)")}}</dt>
+ <dd>Devuelve la raíz cúbica de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/ceil", "Math.ceil(x)")}}</dt>
+ <dd>Devuelve el entero más pequeño mayor o igual que un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/clz32", "Math.clz32(x)")}}</dt>
+ <dd>Devuelve el número de ceros iniciales de un entero de 32 bits.</dd>
+ <dt>{{jsxref("Global_Objects/Math/cos", "Math.cos(x)")}}</dt>
+ <dd>Devuelve el coseno de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/cosh", "Math.cosh(x)")}}</dt>
+ <dd>Devuelve el coseno hiperbólico de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/exp", "Math.exp(x)")}}</dt>
+ <dd>Devuelve <code>E<sup>x</sup></code>, donde <var>x</var> es el argumento, y <code>E</code> es la constante de Euler (2.718...), la base de los logaritmos naturales.</dd>
+ <dt>{{jsxref("Global_Objects/Math/expm1", "Math.expm1(x)")}}</dt>
+ <dd>Devuelve e<sup>x</sup> - 1.</dd>
+ <dt>{{jsxref("Global_Objects/Math/floor", "Math.floor(x)")}}</dt>
+ <dd>Devuelve el mayor entero menor que o igual a un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/fround", "Math.fround(x)")}}</dt>
+ <dd>Devuelve la representación flotante de precisión simple más cercana de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/hypot", "Math.hypot([x[, y[, …]]])")}}</dt>
+ <dd>Devuelve la raíz cuadrada de la suma de los cuadrados de sus argumentos.</dd>
+ <dt>{{jsxref("Global_Objects/Math/imul", "Math.imul(x, y)")}}</dt>
+ <dd>Devuelve el resultado de una multiplicación de enteros de 32 bits.</dd>
+ <dt>{{jsxref("Global_Objects/Math/log", "Math.log(x)")}}</dt>
+ <dd>Devuelve el logaritmo natural (log, también ln) de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/log1p", "Math.log1p(x)")}}</dt>
+ <dd>Devuelve el logaritmo natural de x + 1 (loge, también ln) de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/log10", "Math.log10(x)")}}</dt>
+ <dd>Devuelve el logaritmo en base 10 de x.</dd>
+ <dt>{{jsxref("Global_Objects/Math/log2", "Math.log2(x)")}}</dt>
+ <dd>Devuelve el logaritmo en base 2 de x.</dd>
+ <dt>{{jsxref("Global_Objects/Math/max", "Math.max([x[, y[, …]]])")}}</dt>
+ <dd>Devuelve el mayor de cero o más números.</dd>
+ <dt>{{jsxref("Global_Objects/Math/min", "Math.min([x[, y[, …]]])")}}</dt>
+ <dd>Devuelve el más pequeño de cero o más números.</dd>
+ <dt>{{jsxref("Global_Objects/Math/pow", "Math.pow(x, y)")}}</dt>
+ <dd>Las devoluciones de base a la potencia de exponente, que es, baseexponent.</dd>
+ <dt>{{jsxref("Global_Objects/Math/random", "Math.random()")}}</dt>
+ <dd>Devuelve un número pseudo-aleatorio entre 0 y 1.</dd>
+ <dt>{{jsxref("Global_Objects/Math/round", "Math.round(x)")}}</dt>
+ <dd>Devuelve el valor de un número redondeado al número entero más cercano.</dd>
+ <dt>{{jsxref("Global_Objects/Math/sign", "Math.sign(x)")}}</dt>
+ <dd>Devuelve el signo de la x, que indica si x es positivo, negativo o cero.</dd>
+ <dt>{{jsxref("Global_Objects/Math/sin", "Math.sin(x)")}}</dt>
+ <dd>Devuelve el seno de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/sinh", "Math.sinh(x)")}}</dt>
+ <dd>Devuelve el seno hiperbólico de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/sqrt", "Math.sqrt(x)")}}</dt>
+ <dd>Devuelve la raíz cuadrada positiva de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/tan", "Math.tan(x)")}}</dt>
+ <dd>Devuelve la tangente de un número.</dd>
+ <dt>{{jsxref("Global_Objects/Math/tanh", "Math.tanh(x)")}}</dt>
+ <dd>Devuelve la tangente hiperbólica de un número.</dd>
+ <dt>
+ <pre class="notranslate"><code>Math.toSource()</code> {{non-standard_inline}}</pre>
+ </dt>
+ <dd>Devuelve la cadena "<code>Math</code>".</dd>
+ <dt>{{jsxref("Global_Objects/Math/trunc", "Math.trunc(x)")}}</dt>
+ <dd>Devuelve la parte entera del número x, la eliminación de los dígitos fraccionarios.</dd>
+</dl>
+
+<h2 id="Extendiendo_el_objeto_Math">Extendiendo el objeto <code>Math</code></h2>
+
+<p>Como muchos de los objetos incluidos en JavaScript, el objeto <code>Math</code> puede ser extendido con propiedades y métodos personalizados. Para extender el objeto <code>Math</code> no se debe usar 'prototype'. Es posible extender directamente <code>Math</code>:</p>
+
+<pre class="brush: js notranslate">Math.propName = propValue;
+Math.methodName = methodRef;</pre>
+
+<p>Como demostración, el siguiente ejemplo agrega un método al objeto <code>Math</code> para calcular el <em>máximo común divisor</em> de una lista de argumentos.</p>
+
+<pre class="brush: js notranslate">/* Función variádica -- Retorna el máximo común divisor de una lista de argumentos */
+Math.gcd = function() {
+    if (arguments.length == 2) {
+        if (arguments[1] == 0)
+            return arguments[0];
+        else
+            return Math.gcd(arguments[1], arguments[0] % arguments[1]);
+    } else if (arguments.length &gt; 2) {
+        var result = Math.gcd(arguments[0], arguments[1]);
+        for (var i = 2; i &lt; arguments.length; i++)
+            result = Math.gcd(result, arguments[i]);
+        return result;
+    }
+};</pre>
+
+<p>Pruébalo:</p>
+
+<pre class="brush: js notranslate">console.log(Math.gcd(20, 30, 15, 70, 40)); // `5`</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición Inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8', 'Math')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math-object', 'Math')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Nuevos métodos {{jsxref("Math.log10()", "log10()")}}, {{jsxref("Math.log2()", "log2()")}}, {{jsxref("Math.log1p()", "log1p()")}}, {{jsxref("Math.expm1()", "expm1()")}}, {{jsxref("Math.cosh()", "cosh()")}}, {{jsxref("Math.sinh()", "sinh()")}}, {{jsxref("Math.tanh()", "tanh()")}}, {{jsxref("Math.acosh()", "acosh()")}}, {{jsxref("Math.asinh()", "asinh()")}}, {{jsxref("Math.atanh()", "atanh()")}}, {{jsxref("Math.hypot()", "hypot()")}}, {{jsxref("Math.trunc()", "trunc()")}}, {{jsxref("Math.sign()", "sign()")}}, {{jsxref("Math.imul()", "imul()")}}, {{jsxref("Math.fround()", "fround()")}}, {{jsxref("Math.cbrt()", "cbrt()")}} y {{jsxref("Math.clz32()", "clz32()")}} añadidos.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math-object', 'Math')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Math")}}</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/ln10/index.html b/files/es/web/javascript/reference/global_objects/math/ln10/index.html
new file mode 100644
index 0000000000..507bd03130
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/ln10/index.html
@@ -0,0 +1,85 @@
+---
+title: Math.LN10
+slug: Web/JavaScript/Reference/Global_Objects/Math/LN10
+tags:
+  - JavaScript
+  - Math
+  - Property
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN10
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/LN10
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>Math.LN10</strong></code> representa el logaritmo natural de 10, aproximadamente 2.302:</p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LN10</mi></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mn>10</mn><mo stretchy="false">)</mo><mo>≈</mo><mn>2.302</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LN10}} = \ln(10) \approx 2.302</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-ln10.html")}}</div>
+
+<div> </div>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Porque <code>LN10</code> es una propiedad estática de <code>Math</code>, siempre usted lo usa como <code>Math.LN10</code>, en lugar de como una propiedad de un objeto <code>Math</code> creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_Math.LN10" name="Example:_Using_Math.LN10">Utilizando <code>Math.LN10</code></h3>
+
+<p>La función siguiente devuelve el logaritmo natural de 10:</p>
+
+<pre class="brush:js">function getNatLog10() {
+   return Math.LN10
+}
+
+getNatLog10(); // 2.302585092994046
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.1.2', 'Math.LN10')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.ln10', 'Math.LN10')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.ln10', 'Math.LN10')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.LN10")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log10()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/ln2/index.html b/files/es/web/javascript/reference/global_objects/math/ln2/index.html
new file mode 100644
index 0000000000..e6090db3e0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/ln2/index.html
@@ -0,0 +1,84 @@
+---
+title: Math.LN2
+slug: Web/JavaScript/Reference/Global_Objects/Math/LN2
+tags:
+  - JavaScript
+  - Math
+  - Property
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN2
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/LN2
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <strong><code>Math.LN2</code></strong> representa el logaritmo natural de 2, aproximadamente 0.693:</p>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LN2</mi></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mn>2</mn><mo stretchy="false">)</mo><mo>≈</mo><mn>0.693</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LN2}} = \ln(2) \approx 0.693</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-ln2.html")}}</div>
+
+<div> </div>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Como <code>LN2</code> es una propiedad estática de <code>Math</code>, siempre se usa como <code>Math.LN2</code>, en lugar de como una propiedad de un objeto <code>Math</code> que ha creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_Math.LN2" name="Example:_Using_Math.LN2">Utilizando <code>Math.LN2</code></h3>
+
+<p>La función siguiente devuelve el logaritmo natural de 2:</p>
+
+<pre class="brush: js">function getNatLog2() {
+  return Math.LN2;
+}
+
+getNatLog2(); // 0.6931471805599453</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.1.3', 'Math.LN2')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.ln2', 'Math.LN2')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.ln2', 'Math.LN2')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.LN2")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log2()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/log/index.html b/files/es/web/javascript/reference/global_objects/math/log/index.html
new file mode 100644
index 0000000000..cb68315017
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/log/index.html
@@ -0,0 +1,113 @@
+---
+title: Math.log()
+slug: Web/JavaScript/Reference/Global_Objects/Math/log
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/log
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/log
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.log()</code></strong> devuelve la base neutral de un número (base {{jsxref ("Math.E", "e")}})</p>
+
+<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>&gt;</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.log</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>e</mi><mi>y</mi></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x &gt; 0, \mathtt{\operatorname{Math.log}(x)} = \ln(x) = \text{el unico} \; y \; \text{tal que} \; e^y = x</annotation></semantics></math></p>
+
+<p> </p>
+
+<p>La función en JavaScrcrip <strong><code>Math.log()</code></strong> es equivalente a <em>ln(x)</em> en matematicas.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-log.html")}}</div>
+
+
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.log(<var>x</var>)</code></pre>
+
+<h3 id="Parametetros">Parametetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Es un numero.</dd>
+</dl>
+
+<h3 id="Retorna_el_valor">Retorna el valor</h3>
+
+<p> </p>
+
+<p>La base natural (base {{jsxref("Math.E", "e")}}) del número dado. Si el número es negativo, se devuelve {{jsxref("NaN")}} </p>
+
+<h2 id="Descripcion">Descripcion</h2>
+
+<p>If the value of <code>x</code> is negative, the return value is always {{jsxref("NaN")}}.</p>
+
+<p>Because <code>log()</code> is a static method of <code>Math</code>, you always use it as <code>Math.log()</code>, rather than as a method of a <code>Math</code> object you created (<code>Math</code> is not a constructor).</p>
+
+<p>If you need the natural log of 2 or 10, use the constants {{jsxref("Math.LN2")}} or {{jsxref("Math.LN10")}} .  If you need a logarithm to base 2 or 10, use {{jsxref("Math.log2()")}} or {{jsxref("Math.log10()")}} .  If you need a logarithm to other bases, use Math.log(x) / Math.log(otherBase) as in the example below; you might want to precalculate 1 / Math.log(otherBase) .</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_Math.log()">Using <code>Math.log()</code></h3>
+
+<pre class="brush: js">Math.log(-1); // NaN, out of range
+Math.log(0);  // -Infinity
+Math.log(1);  // 0
+Math.log(10); // 2.302585092994046
+</pre>
+
+<h3 id="Using_Math.log()_with_a_different_base">Using <code>Math.log()</code> with a different base</h3>
+
+<p>The following function returns the logarithm of <code>y</code> with base <code>x</code> (ie. <math><semantics><mrow><msub><mo>log</mo><mi>x</mi></msub><mi>y</mi></mrow><annotation encoding="TeX">\log_x y</annotation></semantics></math>):</p>
+
+<pre class="brush: js">function getBaseLog(x, y) {
+  return Math.log(y) / Math.log(x);
+}
+</pre>
+
+<p>If you run <code>getBaseLog(10, 1000)</code> it returns <code>2.9999999999999996</code> due to floating-point rounding, which is very close to the actual answer of 3.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.10', 'Math.log')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.log', 'Math.log')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.log', 'Math.log')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.log")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log1p()")}}</li>
+ <li>{{jsxref("Math.log10()")}}</li>
+ <li>{{jsxref("Math.log2()")}}</li>
+ <li>{{jsxref("Math.pow()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/log10/index.html b/files/es/web/javascript/reference/global_objects/math/log10/index.html
new file mode 100644
index 0000000000..d3efd7e3fc
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/log10/index.html
@@ -0,0 +1,138 @@
+---
+title: Math.log10()
+slug: Web/JavaScript/Reference/Global_Objects/Math/log10
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/log10
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/log10
+---
+<div>{{JSRef}}</div>
+
+<p><strong><code>Math.log10()</code></strong> funcion que retorna el logaritmo de base 10 de un numero, esto es</p>
+
+<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>&gt;</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.log10</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>10</mn></msub><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext>la unica</mtext><mspace width="thickmathspace"></mspace><mi>y tal que</mi><mspace width="thickmathspace"></mspace><mtext></mtext><mspace width="thickmathspace"></mspace><msup><mn>10</mn><mi>y</mi></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x &gt; 0, \mathtt{\operatorname{Math.log10}(x)} = \log_10(x) = \text{the unique} \; y \; \text{such that} \; 10^y = x</annotation></semantics></math></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">Math.log10(<var>x</var>)</pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un Numero</dd>
+</dl>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>El logaritmo de base 10 del numero dado. SI el numero es negativo, {{jsxref("NaN")}} es devuelto.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si el valor de x es menor que cero, el valor de retorno siempre es {{jsxref("NaN")}}.</p>
+
+<p>Porque <code>log10()</code> <code>es un metodo estatico de Math</code>, debe usarse siempre <code>Math.log10()</code>, en vez de usarse como un metodo del objeto math que se ha creado (<code>Math</code> no es un constructor).</p>
+
+<p>Esta función es equivalente de Math.log(x) / Math.log(10).  Para log10(e) use la constante {{jsxref("Math.LOG10E")}} que es 1 / {{jsxref("Math.LN10")}}.  </p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="usando_Math.log10()">usando <code>Math.log10()</code></h3>
+
+<pre class="brush: js">Math.log10(2);      // 0.3010299956639812
+Math.log10(1);      // 0
+Math.log10(0);      // -Infinito
+Math.log10(-2);     // NaN
+Math.log10(100000); // 5
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Puede ser emulada con la siguiente función</p>
+
+<pre class="brush: js">Math.log10 = Math.log10 || function(x) {
+  return Math.log(x) * Math.LOG10E;
+};
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.log10', 'Math.log10')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.log10', 'Math.log10')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatChrome("38")}}</td>
+   <td>{{CompatGeckoDesktop("25")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera("25")}}</td>
+   <td>{{CompatSafari("7.1")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("25")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_Tambien">Vea Tambien</h2>
+
+<ul>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log1p()")}}</li>
+ <li>{{jsxref("Math.log2()")}}</li>
+ <li>{{jsxref("Math.pow()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/log10e/index.html b/files/es/web/javascript/reference/global_objects/math/log10e/index.html
new file mode 100644
index 0000000000..5537164097
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/log10e/index.html
@@ -0,0 +1,131 @@
+---
+title: Math.LOG10E
+slug: Web/JavaScript/Reference/Global_Objects/Math/LOG10E
+tags:
+  - JavaScript
+  - Math
+  - Propiedad
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG10E
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/LOG10E
+---
+<div>{{JSRef}}</div>
+
+<div> </div>
+
+<div>La propiedad <strong><code>Math.LOG10E</code></strong> representa el logaritmo base 10 de e, el cual es aproximadamente 0.434:</div>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LOG10E</mi></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>10</mn></msub><mo stretchy="false">(</mo><mi>e</mi><mo stretchy="false">)</mo><mo>≈</mo><mn>0.434</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LOG10E}} = \log_10(e) \approx 0.434</annotation></semantics></math></p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Debido a que LOG10E es una propiedad estatica del módulo Math, se debe de invocar siempre como Math.LOG10E, en lugar de invocarla como una propiedad de algun objeto Math que hayas creado ( Math no es un constructor ).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_Math.LOG10E">Utilizando <code>Math.LOG10E</code></h3>
+
+<p>La siguiente funcion regresa el logaritmo base 10 de e:</p>
+
+<pre class="brush:js">function getLog10e() {
+  return Math.LOG10E;
+}
+
+getLog10e(); // 0.4342944819032518
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>
+    <p>Definición inicial. Implementado en JavaScript 1.0.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.1.5', 'Math.LOG10E')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.log10e', 'Math.LOG10E')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.log10e', 'Math.LOG10E')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadores_Compatibles">Navegadores Compatibles</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_tambien">Ver tambien</h2>
+
+<ul>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log10()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/log2/index.html b/files/es/web/javascript/reference/global_objects/math/log2/index.html
new file mode 100644
index 0000000000..8d8d45c60c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/log2/index.html
@@ -0,0 +1,97 @@
+---
+title: Math.log2()
+slug: Web/JavaScript/Reference/Global_Objects/Math/log2
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/log2
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/log2
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.log2()</code></strong> retorna el logaritmo base 2 de un número, esto es</p>
+
+<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>&gt;</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.log2</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>2</mn></msub><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mn>2</mn><mi>y</mi></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x &gt; 0, \mathtt{\operatorname{Math.log2}(x)} = \log_2(x) = \text{the unique} \; y \; \text{such that} \; 2^y = x</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-log2.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code>Math.log2(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El logaritmo base 2 del número usado como parámetro. Si el número es negativo, {{jsxref("NaN")}} será retornado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si el valor de <code>x</code> es mejor a 0, el valor de retorno es siempre {{jsxref("NaN")}}.</p>
+
+<p>Debido a que <code>log2()</code> es una función estática de <code>Math</code>, siempre debe ser usado como <code>Math.log2()</code>, en lugar de ser usado como un método del objeto <code>Math</code> (<code>Math</code> no es un constructor).</p>
+
+<p>Esta función es equivalente a Math.log(x) / Math.log(2).  Para log2(e) use la constante {{jsxref("Math.LOG2E")}} que es 1 / {{jsxref("Math.LN2")}}.  </p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.log2()">Usando <code>Math.log2()</code></h3>
+
+<pre class="brush: js">Math.log2(3);    // 1.584962500721156
+Math.log2(2);    // 1
+Math.log2(1);    // 0
+Math.log2(0);    // -Infinity
+Math.log2(-2);   // NaN
+Math.log2(1024); // 10
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>This Polyfill emulates the <code>Math.log2</code> function. Note that it returns imprecise values on some inputs (like 1 &lt;&lt; 29), wrap into {{jsxref("Math.round()")}} if working with bit masks.</p>
+
+<pre class="brush: js">Math.log2 = Math.log2 || function(x) {
+  return Math.log(x) * Math.LOG2E;
+};
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-math.log2', 'Math.log2')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.log2', 'Math.log2')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Math.log2")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.log10()")}}</li>
+ <li>{{jsxref("Math.log1p()")}}</li>
+ <li>{{jsxref("Math.pow()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/log2e/index.html b/files/es/web/javascript/reference/global_objects/math/log2e/index.html
new file mode 100644
index 0000000000..e338dcccf1
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/log2e/index.html
@@ -0,0 +1,28 @@
+---
+title: Math.LOG2E
+slug: Web/JavaScript/Reference/Global_Objects/Math/LOG2E
+tags:
+  - JavaScript
+  - Math
+  - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG2E
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/LOG2E
+---
+<div>
+ {{JSRef("Objetos_globales", "Math")}}</div>
+<h2 id="Summary" name="Summary">Resumen</h2>
+<p>El base 2 del logaritmo natural de E (aproximadamente 1.442).</p>
+<div>
+ {{js_property_attributes(0,0,0)}}</div>
+<h2 id="Description" name="Description">Descripción</h2>
+<p>Porque <code>LOG2E</code> es una propiedad estática de <code>Math</code>, siempre usted lo usa como <code>Math.LOG2E</code>, en lugar de una propedad de un objecto de <code>Math</code> usted creó.</p>
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+<h3 id="Example:_Using_Math.LOG2E" name="Example:_Using_Math.LOG2E">Ejemplo: Usar <code>Math.LOG2E</code></h3>
+<p>La función siguiente devuelve el base 2 del logaritmo natural del <code>E</code>:</p>
+<pre class="brush:js">function getLog2e() {
+   return Math.LOG2E
+}</pre>
+<h2 id="Ven_También">Ven También</h2>
+<ul>
+ <li>El {{jsxref("Math")}} objeto.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/max/index.html b/files/es/web/javascript/reference/global_objects/math/max/index.html
new file mode 100644
index 0000000000..5a97440eab
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/max/index.html
@@ -0,0 +1,146 @@
+---
+title: Math.max()
+slug: Web/JavaScript/Reference/Global_Objects/Math/max
+tags:
+  - JavaScript
+  - Math
+  - Método(2)
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/max
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/max
+---
+<div>{{JSRef("Global_Objects", "Math")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La función <strong><code>Math.max()</code></strong> devuelve el mayor de cero o más números.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.max([<var>valor1</var>[, <var>valor2</var>[, ...]]])</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>valor1, valor2, ...</code></dt>
+ <dd>Números.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Ya que <code>max()</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.max()</code>, en lugar de un método de un objeto <code>Math</code> instanciado (<code>Math</code> no es un constructor).</p>
+
+<p>Si no se proporcionan argumentos, el resultado es -{{jsxref("Global_Objects/Infinity", "Infinity")}}.</p>
+
+<p>Si al menos uno de los argumentos no puede ser convertido a número, el resultado es {{jsxref("Global_Objects/NaN", "NaN")}}.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_Math.max" name="Example:_Using_Math.max">Ejemplo: Usando <code>Math.max()</code></h3>
+
+<pre class="brush: js">Math.max(10, 20);   //  20
+Math.max(-10, -20); // -10
+Math.max(-10, 20);  //  20
+</pre>
+
+<p>La siguiente función usa {{jsxref("Function.prototype.apply()")}} para encontrar el elemento mayor en un array numérico. <code>getMaxOfArray([1, 2, 3])</code> es equivalente a <code>Math.max(1, 2, 3)</code>, pero se puede usar <code>getMaxOfArray()</code> sobre arreglos construidos programáticamente de cualquier tamaño.</p>
+
+<pre class="brush: js">function getMaxOfArray(numArray) {
+  return Math.max.apply(null, numArray);
+}
+</pre>
+
+<p>O con el nuevo {{jsxref("Operadores/Spread_operator", "spread operator")}}, obtener el máximo de un arreglo se vuelve mucho más fácil.</p>
+
+<pre class="brush: js">var arr = [1, 2, 3];
+var max = Math.max(...arr);</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1ra Edición.</td>
+   <td>Estandar</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.11', 'Math.max')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.max', 'Math.max')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.max', 'Math.max')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{CompatibilityTable}}</span></h2>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Móvil (Gecko)</th>
+   <th>IE Móvil</th>
+   <th>Opera Móvil</th>
+   <th>Safari Móvil</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver además</h2>
+
+<ul>
+ <li>{{jsxref("Math.min()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/min/index.html b/files/es/web/javascript/reference/global_objects/math/min/index.html
new file mode 100644
index 0000000000..45d0da7d4a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/min/index.html
@@ -0,0 +1,151 @@
+---
+title: Math.min()
+slug: Web/JavaScript/Reference/Global_Objects/Math/min
+tags:
+  - JavaScript
+  - Math
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/min
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/min
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.min()</code></strong> devuelve el menor de cero o más números.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.min([<var>valor1</var>[, <var>valor2</var>[, ...]]])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor1, valor2, ...</code></dt>
+ <dd>Números.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Ya que <code>min()</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.min()</code>, en lugar de como un método de un objeto <code>Math</code> instanciado (Math no es un constructor).</p>
+
+<p>Si no se proporcionan argumentos, el resultado es {{jsxref("Infinity")}}.</p>
+
+<p>Si al menos uno de los argumentos no puede ser convertido a número, el resultado es {{jsxref("NaN")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.min()">Usando <code>Math.min()</code></h3>
+
+<p>Lo siguiente encuentra el mínimo de <code>x</code> e <code>y</code> y lo asigna a <code>z</code>:</p>
+
+<pre class="brush: js">var x = 10, y = -20;
+var z = Math.min(x, y);
+</pre>
+
+<h3 id="Recortando_un_valor_con_Math.min()">Recortando un valor con <code>Math.min()</code></h3>
+
+<p><code>Math.min()</code> es a menudo usado para recortar un valor de tal manera que siempre sea menor o igual a un límite. Este ejemplo</p>
+
+<pre class="brush: js">var x = f(foo);
+
+if (x &gt; limite) {
+  x = limite;
+}
+</pre>
+
+<p>puede ser escrito de la siguiente manera</p>
+
+<pre class="brush: js">var x = Math.min(f(foo), limite);
+</pre>
+
+<p>{{jsxref("Math.max()")}} puede ser usado en una forma similar para recortar un valor en el otro extremo.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.12', 'Math.min')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.min', 'Math.min')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.min', 'Math.min')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Móvil (Gecko)</th>
+   <th>IE Móvil</th>
+   <th>Opera Móvil</th>
+   <th>Safari Móvil</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_además">Ver además</h2>
+
+<ul>
+ <li>{{jsxref("Math.max()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/pi/index.html b/files/es/web/javascript/reference/global_objects/math/pi/index.html
new file mode 100644
index 0000000000..e4bdf042d6
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/pi/index.html
@@ -0,0 +1,127 @@
+---
+title: Math.PI
+slug: Web/JavaScript/Reference/Global_Objects/Math/PI
+tags:
+  - JavaScript
+  - Math
+  - Propiedad
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/PI
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/PI
+---
+<div>{{JSRef}}</div>
+
+<div>La propiedad <code><strong>Math.PI</strong></code> representa la relacion entre la longitud de la circunferencia de un circulo y su diametro, la cual es aproximadamente 3.14159.</div>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.PI</mi></mstyle><mo>=</mo><mi>π</mi><mo>≈</mo><mn>3.14159</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.PI}} = \pi \approx 3.14159</annotation></semantics></math></p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Debido a que PI es una propiedad estatica del modulo <strong><code>Math</code></strong>, siempre debes de utilizarla como <strong><code>Math.PI</code></strong>, en lugar de una propiedad de un objeto <strong><code>Math</code></strong> que tu hayas creado ( <strong><code>Math</code></strong> no es un constructor ).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_Math.PI">Utilizando <code>Math.PI</code></h3>
+
+<p>La siguiente función utiliza <strong><code>Math.PI</code></strong> para calcular la longitud de la circunferencia de un circulo mediante el radio del circulo proporcionado como parametro.</p>
+
+<pre class="brush: js">function calculaCircunferencia(radio) {
+  return 2 * Math.PI * radio;
+}
+
+calculaCircunferencia(1);  // 6.283185307179586
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>
+    <p>Definición inicial. Implementado en JavaScript 1.0.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.1.6', 'Math.PI')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.pi', 'Math.PI')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.pi', 'Math.PI')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadores_Compatibles">Navegadores Compatibles</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_tambien">Ver tambien</h2>
+
+<ul>
+ <li>{{jsxref("Math")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/pow/index.html b/files/es/web/javascript/reference/global_objects/math/pow/index.html
new file mode 100644
index 0000000000..a19835458c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/pow/index.html
@@ -0,0 +1,141 @@
+---
+title: Math.pow()
+slug: Web/JavaScript/Reference/Global_Objects/Math/pow
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/pow
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/pow
+---
+<div>{{JSRef("Global_Objects", "Math")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La función  <strong><code>Math.pow()</code></strong> devuelve la  <code>base elevada al</code> <code>exponente</code> , esto es, <code>base<sup>exponente</sup></code>.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.pow(<var>base</var>, <var>exponente</var>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parametros</h3>
+
+<dl>
+ <dt><code>base</code></dt>
+ <dd>El número base.</dd>
+ <dt><code>exponente</code></dt>
+ <dd>El exponente utilizado para elevar la <code>base</code>.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>La función <strong><code>Math.pow()</code></strong> retorna la <code>base</code> elevada al <code>exponente</code>, es decir, <code>base<sup>exponente</sup></code>. La base y el exponente estan en el sistema numérico decimal.</p>
+
+<p>Puesto que <code>pow()</code> es un método estático de <code>Math</code>, siempre se utiliza como <code>Math.pow()</code>. Si la base es negativa y el exponente no es un número entero, el resultado será NaN.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example_Using_Math.pow" name="Example:_Using_Math.pow">Ejemplo: Usando <code>Math.pow()</code></h3>
+
+<pre class="brush: js">// simple
+Math.pow(7, 2);    // 49
+Math.pow(7, 3);    // 343
+Math.pow(2, 10);   // 1024
+// exponentes fraccionales
+Math.pow(4, 0.5);  // 2 (raíz cuadrada de 4)
+Math.pow(8, 1/3);  // 2 (raíz cúbica de 8)
+Math.pow(2, 0.5);  // 1.412135623730951 (raíz cuadrada de 2)
+Math.pow(2, 1/3);  // 1.2599210498948732 (raíz cúbica de 2)
+// exponentes con signo
+Math.pow(7, -2);   // 0.02040816326530612 (1/49)
+Math.pow(8, -1/3); // 0.5
+// bases con signo
+Math.pow(-7, 2);   // 49 (los cuadrados son positivos)
+Math.pow(-7, 3);   // -343 (El cubo de una base negativa puede ser negativo)
+Math.pow(-7, 0.5); // NaN (Los números negativos no tienen raíz cuadrada real)
+Math.pow(-7, 1/3); // NaN
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Estándar</td>
+   <td>Definición inicial implementada en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.13', 'Math.pow')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.pow', 'Math.pow')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.cbrt()")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.sqrt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/random/index.html b/files/es/web/javascript/reference/global_objects/math/random/index.html
new file mode 100644
index 0000000000..78e82424bf
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/random/index.html
@@ -0,0 +1,133 @@
+---
+title: Math.random()
+slug: Web/JavaScript/Reference/Global_Objects/Math/random
+tags:
+  - JavaScript
+  - Math
+  - Números Aleatorios
+  - Random
+  - Referências
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/random
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/random
+---
+<div>{{JSRef("Global_Objects", "Math")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>La función <strong><code>Math.random()</code></strong> retorna un punto flotante, un número pseudo-aleatorio dentro del rango <code>[0, 1).</code> Esto es, desde el 0 (Incluido) hasta el 1 pero sin incluirlo (excluido), el cual se puede escalar hasta el rango deseado. La implementación selecciona la semilla inicial hasta el algoritmo que genera el número aleatorio; este no puede ser elegido o cambiado por el usuario.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> <code>Math.random()</code> <strong>NO</strong> provee números aleatorios con seguridad criptográfica. No deben ser usados para algo relacionado con seguridad. En vez de eso, usar la API Web Crypto, y más precisamente el método: {{domxref("RandomSource.getRandomValues()", "window.crypto.getRandomValues()")}}.</p>
+</div>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.random()</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<p>Ninguno.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_Math.random" name="Example:_Using_Math.random">Ejemplo: Usando <code>Math.random()</code></h3>
+
+<p>Notar que, como los números en Javascript son números de punto flotante IEEE 754 con redondeo-al-par-más-cercano, los rangos generados por las funciones de abajo (excluyendo a <code>Math.random()</code> en sí misma) no son exactos. Si se eligen límites extremadamente grandes (2<sup>53</sup> o más), es posible, en casos extremadamente raros, calcular el generalmente-excluído límite superior.</p>
+
+<pre class="brush: js">// Retorna un número aleatorio entre 0 (incluido) y 1 (excluido)
+function getRandom() {
+  return Math.random();
+}
+</pre>
+
+<pre class="brush: js">// Retorna un número aleatorio entre min (incluido) y max (excluido)
+function getRandomArbitrary(min, max) {
+  return Math.random() * (max - min) + min;
+}
+</pre>
+
+<pre class="brush: js">// Retorna un entero aleatorio entre min (incluido) y max (excluido)
+// ¡Usando Math.round() te dará una distribución no-uniforme!
+function getRandomInt(min, max) {
+  return Math.floor(Math.random() * (max - min)) + min;
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1a Edición.</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. JavaScript 1.0 (Sólo UNIX) / JavaScript 1.1 (Todas las plataformas).</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.14', 'Math.random')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.random', 'Math.random')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/javascript/reference/global_objects/math/round/index.html b/files/es/web/javascript/reference/global_objects/math/round/index.html
new file mode 100644
index 0000000000..13458d660e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/round/index.html
@@ -0,0 +1,219 @@
+---
+title: Math.round()
+slug: Web/JavaScript/Reference/Global_Objects/Math/round
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/round
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/round
+---
+<div>{{JSRef}}</div>
+
+<div>La función <strong><code>Math.round() </code></strong><code>retorna el valor de un número redondeado al entero más cercano.</code></div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>Devuelve el valor del número dado redondeado al entero más cercano.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Math.round(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<dl>
+ <dd>El valor del número dado redondeado al entero más cercano.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si la porción fraccionaría del número es 0.5 o mayor, el argumento es redondeado al siguiente número entero superior. Si la porción de la fracción del número es menor a 0.5, el argumento es redondeado al siguiente número entero inferior.</p>
+
+<p>Debido a que round() es un método estático de Math, siempre se debe utilizar como  Math.round(),  en vez de un método del objeto Math que ha creado. (Math no es un constructor)</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.round">Usando <code>Math.round()</code></h3>
+
+<pre class="brush: js notranslate">// Retorna el valor 20
+x = Math.round(20.49);
+
+// Retorna el valor 21
+x = Math.round(20.5);
+
+// Retorna el valor -20
+x = Math.round(-20.5);
+
+// Retorna el valor -21
+x = Math.round(-20.51);
+
+// Retorna el valor 1 (!)
+// Note el error de redondeo debido a la inexactitud del punto aritmético.
+// Compare esto con Math.round10(1.005, -2) de el ejemplo de abajo.
+x = Math.round(1.005*100)/100;
+</pre>
+
+<h3 id="Redondeo_decimal">Redondeo decimal</h3>
+
+<pre class="brush: js notranslate">// Conclusión
+(function() {
+  /**
+   * Ajuste decimal de un número.
+   *
+   * @param {String}  tipo  El tipo de ajuste.
+   * @param {Number}  valor El numero.
+   * @param {Integer} exp   El exponente (el logaritmo 10 del ajuste base).
+   * @returns {Number} El valor ajustado.
+   */
+  function decimalAdjust(type, value, exp) {
+    // Si el exp no está definido o es cero...
+    if (typeof exp === 'undefined' || +exp === 0) {
+      return Math[type](value);
+    }
+    value = +value;
+    exp = +exp;
+    // Si el valor no es un número o el exp no es un entero...
+    if (isNaN(value) || !(typeof exp === 'number' &amp;&amp; exp % 1 === 0)) {
+      return NaN;
+    }
+    // Shift
+    value = value.toString().split('e');
+    value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
+    // Shift back
+    value = value.toString().split('e');
+    return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
+  }
+
+  // Decimal round
+  if (!Math.round10) {
+    Math.round10 = function(value, exp) {
+      return decimalAdjust('round', value, exp);
+    };
+  }
+  // Decimal floor
+  if (!Math.floor10) {
+    Math.floor10 = function(value, exp) {
+      return decimalAdjust('floor', value, exp);
+    };
+  }
+  // Decimal ceil
+  if (!Math.ceil10) {
+    Math.ceil10 = function(value, exp) {
+      return decimalAdjust('ceil', value, exp);
+    };
+  }
+})();
+
+// Round
+Math.round10(55.55, -1);   // 55.6
+Math.round10(55.549, -1);  // 55.5
+Math.round10(55, 1);       // 60
+Math.round10(54.9, 1);     // 50
+Math.round10(-55.55, -1);  // -55.5
+Math.round10(-55.551, -1); // -55.6
+Math.round10(-55, 1);      // -50
+Math.round10(-55.1, 1);    // -60
+Math.round10(1.005, -2);   // 1.01 -- compare this with Math.round(1.005*100)/100 above
+// Floor
+Math.floor10(55.59, -1);   // 55.5
+Math.floor10(59, 1);       // 50
+Math.floor10(-55.51, -1);  // -55.6
+Math.floor10(-51, 1);      // -60
+// Ceil
+Math.ceil10(55.51, -1);    // 55.6
+Math.ceil10(51, 1);        // 60
+Math.ceil10(-55.59, -1);   // -55.5
+Math.ceil10(-59, 1);       // -50
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>
+    <p>Definición inicial. Implementada en JavaScript 1.0.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.15', 'Math.round')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.round', 'Math.round')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Math.abs()")}}</li>
+ <li>{{jsxref("Math.ceil()")}}</li>
+ <li>{{jsxref("Math.floor()")}}</li>
+ <li>{{jsxref("Math.sign()")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Math.trunc()")}} {{experimental_inline}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/sign/index.html b/files/es/web/javascript/reference/global_objects/math/sign/index.html
new file mode 100644
index 0000000000..472f01e6a1
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/sign/index.html
@@ -0,0 +1,152 @@
+---
+title: Math.sign()
+slug: Web/JavaScript/Reference/Global_Objects/Math/sign
+tags:
+  - JavaScript
+  - Math
+  - Method
+  - Reference
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/sign
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/sign
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.sign()</code></strong> retorna el signo de un número, indicando si el número es positivo, negativo o cero.</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<pre class="syntaxbox"><code>Math.sign(<var>x</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno.">Valor de retorno.</h3>
+
+<p>Un número representando el signo del argumento dado. Si el argumento es un número positivo, negativo, cero positivo, o cero negativo, la función retornará <code>1</code>, <code>-1</code>, <code>0</code> or <code>-0</code> respectivamente. De lo contrario, retorna {{jsxref("NaN")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Como <code>sign()</code> es un método estático de <code>Math</code>, siempre se utiliza como <code>Math.sign()</code>, en vez de un método de un objeto Math que hayas creado. (<code>Math</code> no es un constructor).</p>
+
+<p>Esta función tiene 5 tipos de valores de retorno, <code>1</code>, <code>-1</code>, <code>0</code>, <code>-0</code>, <code>NaN</code>, que representan "número positivo", "número negativo", "cero positivo", "cero negativo" y {{jsxref("NaN")}} respectivamente.</p>
+
+<p>El argumento pasado a esta función será convertido a tipo <code>x</code> implicitamente.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.sign()">Usando <code>Math.sign()</code></h3>
+
+<pre class="brush: js">Math.sign(3);     //  1
+Math.sign(-3);    // -1
+Math.sign('-3');  // -1
+Math.sign(0);     //  0
+Math.sign(-0);    // -0
+Math.sign(NaN);   // NaN
+Math.sign('foo'); // NaN
+Math.sign();      // NaN
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">if (!Math.sign) {
+  Math.sign = function(x) {
+    // Si x es NaN, el resultado es NaN.
+    // Si x es -0, el resultado es -0.
+    // Si x es +0, el resultado es +0.
+    // Si x es negativo y no -0, el resultado es -1.
+    // Si x es positivo y no +0, el resultado es +1.
+    x = +x; // convertir a número
+    if (x === 0 || isNaN(x)) {
+      return Number(x);
+    }
+    return x &gt; 0 ? 1 : -1;
+  };
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.sign', 'Math.sign')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.sign', 'Math.sign')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Propiedad</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("38")}}</td>
+   <td>{{CompatGeckoDesktop("25")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera("25")}}</td>
+   <td>{{CompatSafari("9")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Propiedad</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("25")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_También">Ver También</h2>
+
+<ul>
+ <li>{{jsxref("Math.abs()")}}</li>
+ <li>{{jsxref("Math.ceil()")}}</li>
+ <li>{{jsxref("Math.floor()")}}</li>
+ <li>{{jsxref("Math.round()")}}</li>
+ <li>{{jsxref("Math.trunc()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/sin/index.html b/files/es/web/javascript/reference/global_objects/math/sin/index.html
new file mode 100644
index 0000000000..27ec24425f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/sin/index.html
@@ -0,0 +1,127 @@
+---
+title: Math.sin()
+slug: Web/JavaScript/Reference/Global_Objects/Math/sin
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/sin
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/seno
+---
+<div>{{JSRef("Global_Objects", "Math")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La función <strong><code>Math.sin()</code></strong><code> devuelve el seno de un número</code>.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.sin(<var>x</var>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número (en radianes).</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>El método <code>Math.sin()</code> devuelve  un valor numérico entre -1 y 1, que representa el seno del ángulo dado en radianes.<br>
+ Debido a que <code>sin()</code> es un método estático de <code>Math</code>, siempre se usa como <code>Math.sin()</code>, en vez de  crear un objeto <code>Math</code> y usarlo como un método (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_Math.sin" name="Example:_Using_Math.sin">Ejemplo: Usando <code>Math.sin()</code></h3>
+
+<pre class="brush: js">Math.sin(0);           // 0
+Math.sin(1);           // 0.8414709848078965
+
+Math.sin(Math.PI / 2); // 1
+</pre>
+
+<h2 id="Specifications" name="Specifications">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1ª Edición.</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.16', 'Math.sin')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.sin', 'Math.sin')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.acos()")}}</li>
+ <li>{{jsxref("Math.asin()")}}</li>
+ <li>{{jsxref("Math.atan()")}}</li>
+ <li>{{jsxref("Math.atan2()")}}</li>
+ <li>{{jsxref("Math.cos()")}}</li>
+ <li>{{jsxref("Math.tan()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/sqrt/index.html b/files/es/web/javascript/reference/global_objects/math/sqrt/index.html
new file mode 100644
index 0000000000..3db4ff52e8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/sqrt/index.html
@@ -0,0 +1,135 @@
+---
+title: Math.sqrt()
+slug: Web/JavaScript/Reference/Global_Objects/Math/sqrt
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/sqrt
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/sqrt
+---
+<div>{{JSRef}}</div>
+
+<p>La  función <strong><code>Math.sqrt()</code></strong> retorna la raíz cuadrada de un número, que es<math display="block"><semantics><mrow><mi>x</mi><mo>≥</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mi>M</mi><mi>a</mi><mi>t</mi><mi>h</mi><mo>.</mo><mi>s</mi><mi>q</mi><mi>r</mi><mi>t</mi><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msqrt><mi>x</mi></msqrt><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>≥</mo><mn>0</mn><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>y</mi><mn>2</mn></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \geq 0, \mathtt{Math.sqrt(x)} = \sqrt{x} = \text{the unique} \; y \geq 0 \; \text{such that} \; y^2 = x</annotation></semantics></math></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.sqrt(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un numero</dd>
+</dl>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>La raíz cuadrada del número proporcionado. Si los números son negativos, {{jsxref("NaN")}} es devuelto.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si el valor de <code>x</code> es negativo <code>Math.sqrt()</code> retorna {{jsxref("NaN")}}.</p>
+
+<p>Debido a que <code>sqrt()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.sqrt()</code>, en lugar de un método del objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.sqrt()">Usando <code>Math.sqrt()</code></h3>
+
+<pre class="brush: js">Math.sqrt(9); // 3
+Math.sqrt(2); // 1.414213562373095
+
+Math.sqrt(1);  // 1
+Math.sqrt(0);  // 0
+Math.sqrt(-1); // NaN
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.2.17', 'Math.sqrt')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.sqrt', 'Math.sqrt')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.sqrt', 'Math.sqrt')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad">Compatibilidad</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.cbrt()")}}</li>
+ <li>{{jsxref("Math.exp()")}}</li>
+ <li>{{jsxref("Math.log()")}}</li>
+ <li>{{jsxref("Math.pow()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/sqrt1_2/index.html b/files/es/web/javascript/reference/global_objects/math/sqrt1_2/index.html
new file mode 100644
index 0000000000..012fa5d07e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/sqrt1_2/index.html
@@ -0,0 +1,124 @@
+---
+title: Math.SQRT1_2
+slug: Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2
+tags:
+  - JavaScript
+  - Math
+  - Propiedad
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/SQRT1_2
+---
+<div>{{JSRef}}</div>
+
+<div>La propiedad <strong><code>Math.SQRT1_2</code></strong> representa la raiz cuadrada de 1/2, la cual es equivalente al inverso de la raiz cuadrada de 2, aproximadadamente 0.707:</div>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.SQRT1_2</mi></mstyle><mo>=</mo><msqrt><mfrac><mn>1</mn><mn>2</mn></mfrac></msqrt><mo>=</mo><mfrac><mn>1</mn><msqrt><mn>2</mn></msqrt></mfrac><mo>≈</mo><mn>0.707</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.SQRT1_2}} = \sqrt{\frac{1}{2}} = \frac{1}{\sqrt{2}} \approx 0.707</annotation></semantics></math></p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Debido a que SQRT1_2 es una propiedad estatica de Math, siempre debes utilizarla como Math.SQRT1_2, en lugar de invocarla como una propiedad de alguna instancia de Math que hayas creado ( Math no es un constructor ).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_Math.SQRT1_2">Utilizando <code>Math.SQRT1_2</code></h3>
+
+<p>La siguiente funcion regresa la raiz cuadrada de 1/2:</p>
+
+<pre class="brush:js">function getRoot1_2() {
+  return Math.SQRT1_2;
+}
+
+getRoot1_2(); // 0.7071067811865476
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en Javascript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.1.7', 'Math.SQRT1_2')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.sqrt1_2', 'Math.SQRT1_2')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.sqrt1_2', 'Math.SQRT1_2')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Navegadores_Compatibles">Navegadores Compatibles</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_Tambien">Ver Tambien</h2>
+
+<ul>
+ <li>{{jsxref("Math.pow()")}}</li>
+ <li>{{jsxref("Math.sqrt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/sqrt2/index.html b/files/es/web/javascript/reference/global_objects/math/sqrt2/index.html
new file mode 100644
index 0000000000..6ae6cfa70e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/sqrt2/index.html
@@ -0,0 +1,125 @@
+---
+title: Math.SQRT2
+slug: Web/JavaScript/Reference/Global_Objects/Math/SQRT2
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT2
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/SQRT2
+---
+<div>{{JSRef}}</div>
+
+<div>La propiedad <strong>Math.SQRT2</strong> representa la raíz cuadrada de de 2, aproximadamente 1.414:</div>
+
+<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.SQRT2</mi></mstyle><mo>=</mo><msqrt><mn>2</mn></msqrt><mo>≈</mo><mn>1.414</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.SQRT2}} = \sqrt{2} \approx 1.414</annotation></semantics></math></p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Debido a que SQRT2 es una propiedad estática de <code>Math</code>, siempre se utiliza como <code>Math.SQRT2</code>, en lugar de una propiedad de un objeto <code>Math</code> creado<code>.</code></p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_Math.SQRT2">Utilizando Math.SQRT2</h3>
+
+<p>La siguiente función retorna la raíz cuadrada de 2:</p>
+
+<pre class="brush: js">function getRoot2() {
+  return Math.SQRT2;
+}
+
+getRoot2(); // 1.4142135623730951
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>
+    <p>Definición inicial. Implementada en JavaScript 1.0.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.8.1.8', 'Math.SQRT2')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.sqrt2', 'Math.SQRT2')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.sqrt2', 'Math.SQRT2')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"> </h2>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.pow()")}}</li>
+ <li>{{jsxref("Math.sqrt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/tan/index.html b/files/es/web/javascript/reference/global_objects/math/tan/index.html
new file mode 100644
index 0000000000..578cfa720f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/tan/index.html
@@ -0,0 +1,83 @@
+---
+title: Math.tan()
+slug: Web/JavaScript/Reference/Global_Objects/Math/tan
+tags:
+  - Matemáticas
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/tan
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/tan
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.tan()</code></strong> retorna la tangente de un número.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-tan.html")}}</div>
+
+<p class="hidden">La fuente para este ejemplo interactivo se encuentra almacenada en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor, clona el repositorio en este link: <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un <em>Pull Request</em>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.tan(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número que representa un ángulo en radianes.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>La tangente del número proporcionado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>Math.tan()</code> retorna un valor numérico que representa la tangente de un ángulo.</p>
+
+<p>Dado que <code>tan()</code> es un método estático de <code>Math</code>, siempre debes usarlo como <code>Math.tan()</code>, y no como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.tan">Usando <code>Math.tan()</code></h3>
+
+<pre class="brush: js">Math.tan(1); // 1.5574077246549023
+</pre>
+
+<p>Ya que la función <code>Math.tan()</code> acepta radianes, pero es más fácil trabajar con grados, la siguiente función acepta un valor en grados, lo convierte a radianes, y retorna la tangente de dicho valor.</p>
+
+<pre class="brush: js">function getTanDeg(deg) {
+  var rad = deg * Math.PI/180;
+  return Math.tan(rad);
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.tan', 'Math.tan')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quieres contribuir a los datos, por favor consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>, y envíanos un <em>Pull Request</em>.</p>
+
+<p>{{Compat("javascript.builtins.Math.tan")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Math.acos()")}}</li>
+ <li>{{jsxref("Math.asin()")}}</li>
+ <li>{{jsxref("Math.atan()")}}</li>
+ <li>{{jsxref("Math.atan2()")}}</li>
+ <li>{{jsxref("Math.cos()")}}</li>
+ <li>{{jsxref("Math.sin()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/tanh/index.html b/files/es/web/javascript/reference/global_objects/math/tanh/index.html
new file mode 100644
index 0000000000..c4b0fae2cb
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/tanh/index.html
@@ -0,0 +1,96 @@
+---
+title: Math.tanh()
+slug: Web/JavaScript/Reference/Global_Objects/Math/tanh
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/tanh
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/tanh
+---
+<div>{{JSRef}}</div>
+
+<p>La funcion <strong><code>Math.tanh()</code></strong> devuelve la hyperbolica tangente de un numero, esto es </p>
+
+<p><math display="block"><semantics><mrow><mo lspace="0em" rspace="0em">tanh</mo><mi>x</mi><mo>=</mo><mfrac><mrow><mo lspace="0em" rspace="0em">sinh</mo><mi>x</mi></mrow><mrow><mo lspace="0em" rspace="0em">cosh</mo><mi>x</mi></mrow></mfrac><mo>=</mo><mfrac><mrow><msup><mi>e</mi><mi>x</mi></msup><mo>-</mo><msup><mi>e</mi><mrow><mo>-</mo><mi>x</mi></mrow></msup></mrow><mrow><msup><mi>e</mi><mi>x</mi></msup><mo>+</mo><msup><mi>e</mi><mrow><mo>-</mo><mi>x</mi></mrow></msup></mrow></mfrac><mo>=</mo><mfrac><mrow><msup><mi>e</mi><mrow><mn>2</mn><mi>x</mi></mrow></msup><mo>-</mo><mn>1</mn></mrow><mrow><msup><mi>e</mi><mrow><mn>2</mn><mi>x</mi></mrow></msup><mo>+</mo><mn>1</mn></mrow></mfrac></mrow><annotation encoding="TeX">\tanh x = \frac{\sinh x}{\cosh x} = \frac {e^x - e^{-x}} {e^x + e^{-x}} = \frac{e^{2x} - 1}{e^{2x}+1}</annotation></semantics></math></p>
+
+<div>{{EmbedInteractiveExample("pages/js/math-tanh.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Math.tanh(<var>x</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un numero.</dd>
+</dl>
+
+<h3 id="Devolver_valor">Devolver valor</h3>
+
+<p>La hyperbolica tangente del numero obtenido.</p>
+
+<h2 id="Descripcion">Descripcion</h2>
+
+<p>Porque <code>tanh()</code> es un metodo estatico de <code>Math</code>, siempre se usa como <code>Math.tanh()</code>, en lugar de ser un metodo de <code>Math</code> objeto que creas (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Math.tanh()">Usando <code>Math.tanh()</code></h3>
+
+<pre class="brush: js">Math.tanh(0);        // 0
+Math.tanh(Infinity); // 1
+Math.tanh(1);        // 0.7615941559557649
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Esto puede ser emulado con ayuda de {{jsxref("Math.exp()")}} funcion:</p>
+
+<pre class="brush: js">Math.tanh = Math.tanh || function(x){
+    var a = Math.exp(+x), b = Math.exp(-x);
+    return a == Infinity ? 1 : b == Infinity ? -1 : (a - b) / (a + b);
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificacion</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-math.tanh', 'Math.tanh')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>
+    <p>Definicion inicial.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.tanh', 'Math.tanh')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">La compatibilidad de la tabla en esta pagina esta generada desde una structura data. Si quiers contribuir a la data, visita  <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un propuesta.</p>
+
+<p>{{Compat("javascript.builtins.Math.tanh")}}</p>
+
+<h2 id="sect1"> </h2>
+
+<ul>
+ <li>{{jsxref("Math.acosh()")}}</li>
+ <li>{{jsxref("Math.asinh()")}}</li>
+ <li>{{jsxref("Math.atanh()")}}</li>
+ <li>{{jsxref("Math.cosh()")}}</li>
+ <li>{{jsxref("Math.sinh()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/math/trunc/index.html b/files/es/web/javascript/reference/global_objects/math/trunc/index.html
new file mode 100644
index 0000000000..4ed64bfc7a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/math/trunc/index.html
@@ -0,0 +1,145 @@
+---
+title: Math.trunc()
+slug: Web/JavaScript/Reference/Global_Objects/Math/trunc
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Math
+  - Método(2)
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Math/trunc
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Math/trunc
+---
+<div>{{JSRef}}</div>
+
+<p>La función <strong><code>Math.trunc()</code></strong> devuelve la parte entera de un numero removiendo cualquier dígito decimal (dígitos situados después de la coma).</p>
+
+<h2 id="Sintaxis.">Sintaxis.</h2>
+
+<pre class="syntaxbox notranslate"><code>Math.trunc(<var>x</var>)</code></pre>
+
+<h3 id="Parámetros.">Parámetros.</h3>
+
+<dl>
+ <dt><code>x</code></dt>
+ <dd>Un número.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno.">Valor de retorno.</h3>
+
+<p>La parte entera del número dado.</p>
+
+<h2 id="Descripción.">Descripción.</h2>
+
+<p>A diferencia de los otros tres métodos de <code>Math</code>: {{jsxref("Math.floor()")}}, {{jsxref("Math.ceil()")}} y {{jsxref("Math.round()")}}, la forma en que <code>Math.trunc()</code> funciona es muy simple.  <em>trunca</em> (corta) el punto y los dígitos a la derecha de él, sin importar si el argumento es un número positivo o negativo.</p>
+
+<p>Si el argumento es un número positivo, <code>Math.trunc()</code> es equivalente a <code>Math.floor();</code> de otra forma <code>Math.trunc()</code> es equivalente a <code>Math.ceil()</code>.</p>
+
+<p>El argumento pasado a este método será convertido a un tipo numérico entero.</p>
+
+<p>Debido a que <code>trunc()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.trunc()</code>, en lugar de como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
+
+<h2 id="Ejemplos.">Ejemplos.</h2>
+
+<h3 id="Usando_Math.trunc">Usando <code>Math.trunc()</code></h3>
+
+<pre class="brush: js notranslate">Math.trunc(13.37);    // 13
+Math.trunc(42.84);    // 42
+Math.trunc(0.123);    //  0
+Math.trunc(-0.123);   // -0
+Math.trunc('-1.123'); // -1
+Math.trunc(NaN);      // NaN
+Math.trunc('foo');    // NaN
+Math.trunc();         // NaN
+</pre>
+
+<h2 id="Polyfill.">Polyfill.</h2>
+
+<pre class="brush: js notranslate">Math.trunc = Math.trunc || function (x) {
+    return (x &lt; 0 ? Math.ceil(x) : Math.floor(x));
+}
+</pre>
+
+<h2 id="Especificaciones.">Especificaciones.</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-math.trunc', 'Math.trunc')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-math.trunc', 'Math.trunc')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores.">Compatibilidad con navegadores.</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("38")}}</td>
+   <td>{{CompatGeckoDesktop("25")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera("25")}}</td>
+   <td>{{CompatSafari("7.1")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("25")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también.">Vea también.</h2>
+
+<ul>
+ <li>{{jsxref("Math.abs()")}}</li>
+ <li>{{jsxref("Math.ceil()")}}</li>
+ <li>{{jsxref("Math.floor()")}}</li>
+ <li>{{jsxref("Math.round()")}}</li>
+ <li>{{jsxref("Math.sign()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/nan/index.html b/files/es/web/javascript/reference/global_objects/nan/index.html
new file mode 100644
index 0000000000..0b7cfe4b11
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/nan/index.html
@@ -0,0 +1,47 @@
+---
+title: NaN
+slug: Web/JavaScript/Reference/Global_Objects/NaN
+tags:
+  - JavaScript
+  - Propiedad
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/NaN
+original_slug: Web/JavaScript/Referencia/Objetos_globales/NaN
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<div>
+<p dir="ltr" id="tw-target-text">La propiedad global <code>NaN</code> es un valor que representa Not-A-Number.</p>
+</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>Un valor representando un Not-A-Number (No es Un Número).</p>
+
+<p>{{js_property_attributes(0,0,0)}}</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<p><code>NaN</code></p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p><code>NaN</code> es una propiedad del <em>global object (objeto global)</em>, por ejemplo, es una variable de alcance global.</p>
+
+<p>El valor inicial de <code>NaN</code> es Not-A-Number (No es Un Número) - lo mismo que el valor de {{jsxref("Number.NaN")}}.</p>
+
+<p><span class="comment">Keep text below in sync with Number.NaN page</span> <code>NaN</code> nunca es equivalente con cualquier otro número, incluido el mismo <code>NaN</code>; no puedes chequear el valor de un not-a-number comparándolo con <code>Number.NaN</code>. Usar la función {{jsxref("isNaN()")}} para aquello.</p>
+
+<p>Muchos métodos de JavaScript (como son el {{jsxref("Number")}} constructor, {{jsxref("parseFloat")}} y {{jsxref("parseInt")}}) retornan <code>NaN</code> si el valor especificado en el parámetro no puede ser parseado como un número.</p>
+
+<p><span class="hps">Puedes utilizar</span> <span class="hps">la propiedad</span> <code>NaN</code> <span class="hps">para indicar</span> <span class="hps">una condición de error</span> <span class="hps">para</span> tu<span class="hps"> función</span> <span class="hps">que devuelva un número</span> <span class="hps">en caso de éxito</span><span>.</span></p>
+
+<p>JavaScript imprime el valor <code>Number.NaN</code> como <code>NaN</code>.</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number.NaN")}}</li>
+ <li>{{jsxref("Number.isNaN()")}}</li>
+ <li>{{jsxref("Objetos_globales/isNaN", "isNaN()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/null/index.html b/files/es/web/javascript/reference/global_objects/null/index.html
new file mode 100644
index 0000000000..173b31bc50
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/null/index.html
@@ -0,0 +1,130 @@
+---
+title: 'null'
+slug: Web/JavaScript/Reference/Global_Objects/null
+tags:
+  - JavaScript
+  - Literal
+  - Primitivo
+translation_of: Web/JavaScript/Reference/Global_Objects/null
+original_slug: Web/JavaScript/Referencia/Objetos_globales/null
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El valor <code>null</code> es un literal de Javascript que representa intencionalmente un valor nulo o "vacío". Es uno de los {{Glossary("Primitive", "valores primitivos")}} de Javascript.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/globalprops-null.html")}}</div>
+
+
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>null </code></pre>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>El valor <code>null</code> es un literal (no una propiedad del objeto global como podría ser <code>{{jsxref("undefined", "undefined")}}</code>). En APIs, se devuelve <code>null</code> normalmente dónde se espera un objeto pero éste no es relevante. Al comparar con <code style="font-style: normal;">null</code> o  <code>{{jsxref("undefined", "undefined")}}</code><code> </code>hay que tener en cuenta las <a href="/es/docs/Web/JavaScript/Referencia/Operadores/Comparison_Operators">diferencias entre los operadores de igualdad (==) e identidad (===) </a>(con el primero se realiza una conversión de tipo).</p>
+
+<pre class="brush: js">// foo no existe, no está definido y nunca ha sido inicializado:
+&gt; foo
+"ReferenceError: foo is not defined"
+
+// foo existe, pero no tiene tipo ni valor:
+&gt; var foo = null; foo
+"null"
+</pre>
+
+<h3 id="Diferencias_entre_null_y_undefined">Diferencias entre <code>null</code> y <code>undefined</code></h3>
+
+<pre class="brush: js">typeof null        // object (bug en ECMAScript, debería ser null)
+typeof undefined   // undefined
+null === undefined // false
+null  == undefined // true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Standard</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-4.3.11', 'null value')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-null-value', 'null value')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("undefined", "undefined")}}</li>
+ <li>{{jsxref("NaN", "NaN")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/index.html b/files/es/web/javascript/reference/global_objects/number/index.html
new file mode 100644
index 0000000000..9e14baa221
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/index.html
@@ -0,0 +1,182 @@
+---
+title: Number
+slug: Web/JavaScript/Reference/Global_Objects/Number
+tags:
+  - JavaScript
+  - Number
+  - Referencia
+  - Referência(2)
+translation_of: Web/JavaScript/Reference/Global_Objects/Number
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number
+---
+<div>{{JSRef}}</div>
+
+<p><strong><code>Number</code></strong> es un objeto primitivo envolvente que permite representar y manipular valores numéricos cómo 37 o -9.25. El constructor Number contiene constantes y métodos para trabajar con números. Valores de otro tipo pueden ser convertidos a números usando la función Number().</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">new Number(<em>value</em>);
+var <em>a</em> = new Number('123'); // a === 123 es false
+var <em>b</em> = Number('123'); // b === 123 es true
+<em>a</em> instanceof Number; // es true
+<em>b</em> instanceof Number; // es false</pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor</code></dt>
+ <dd>El valor numérico de un objeto que está siendo creado.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Los principales usos del objeto <code>Number(valor)</code> son convertir un string u otro valor a uno de tipo numérico; si el argumento no puede ser convertido a un número, devuelve {{jsxref("NaN")}}.</p>
+
+<h3 id="Literal_syntax">Literal syntax</h3>
+
+<pre class="notranslate">123    // one-hundred twenty-three
+123.0  // same
+123 === 123.0  // true</pre>
+
+<h3 id="Function_syntax">Function syntax</h3>
+
+<pre class="notranslate">Number('123')  // retorna el número 123
+Number('123') === 123  // retorna true
+
+Number("unicorn")  // NaN
+Number(undefined)  // NaN</pre>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/Number"><code>Number()</code></a></dt>
+ <dd>Crea un nuevo valor Numérico ( <code>Number</code> value).</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("Number.EPSILON")}}</dt>
+ <dd>El intervalo más pequeño entre dos números representables</dd>
+ <dt>{{jsxref("Number.MAX_SAFE_INTEGER")}}</dt>
+ <dd>El número máximo representable en JavaScript (<code>2<sup>53</sup> - 1</code>).</dd>
+ <dt>{{jsxref("Number.MAX_VALUE")}}</dt>
+ <dd>El número más grande representable.</dd>
+ <dt>{{jsxref("Number.MIN_SAFE_INTEGER")}}</dt>
+ <dd>El número mínimo representable en JavaScript (<code>-(2<sup>53</sup> - 1)</code>).</dd>
+ <dt>{{jsxref("Number.MIN_VALUE")}}</dt>
+ <dd>El número más pequeño representable - que es el número positivo más cercano a cero (sin llegar a ser cero)-.</dd>
+ <dt>{{jsxref("Number.NaN")}}</dt>
+ <dd>Valor especial "no es número" NaN.</dd>
+ <dt>{{jsxref("Number.NEGATIVE_INFINITY")}}</dt>
+ <dd>Valor especial para representar infinitos negativos; retorno de un desborde de pila overflow.</dd>
+ <dt>{{jsxref("Number.POSITIVE_INFINITY")}}</dt>
+ <dd>Valor especial para representar infinitos positivos; retorno de un desborde de pila overflow.</dd>
+ <dt>{{jsxref("Number.prototype")}}</dt>
+ <dd>Permite la adición de propiedades a un objeto <code>Number</code>.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Number.isNaN()")}}</dt>
+ <dd>Determina si el valor es NaN.</dd>
+ <dt>{{jsxref("Number.isFinite()")}}</dt>
+ <dd>Determina si el valor es un numero infinito.</dd>
+ <dt>{{jsxref("Number.isInteger()")}}</dt>
+ <dd>Determina si un numero es entero.</dd>
+ <dt>{{jsxref("Number.isSafeInteger()")}}</dt>
+ <dd>Determine si el valor pasado es un entero seguro (número entre <code>-(2<sup>53</sup> - 1)</code> y <code>2<sup>53</sup> - 1</code>).</dd>
+ <dt><s class="obsoleteElement">{{jsxref("Number.toInteger()")}} {{obsolete_inline}}</s></dt>
+ <dd><s class="obsoleteElement">Se usa para evaluar el valor pasado y convertirlo en un entero (or {{jsxref("Global_Objects/Infinity", "Infinity")}}), pero ha sido eliminado.</s></dd>
+ <dt>{{jsxref("Number.parseFloat()")}}</dt>
+ <dd>El valor es el mismo que {{jsxref ("parseFloat", "parseFloat ()")}} del objeto global.</dd>
+ <dt>{{jsxref("Number.parseInt()")}}</dt>
+ <dd>El valor es el mismo que {{jsxref("parseInt", "parseInt()")}} del objeto global.</dd>
+</dl>
+
+<h2 id="Instancias_Number">Instancias <code>Number</code></h2>
+
+<p>Todas las instancias <code>Number</code> heredan de {{jsxref("Number.prototype")}}. El objeto prototipo del constructor de <code>Number</code> puede modificarse para aceptar a todas las instancias de <code>Number</code>.</p>
+
+<h3 id="Métodos_2">Métodos</h3>
+
+<dl>
+ <dt>{{jsxref("Number.prototype.toExponential()" ,"Number.prototype.toExponential(<var>fractionDigits</var>)")}}</dt>
+ <dd>Devuelve una cadena que representa el número en notación exponencial.</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("Number.prototype.toFixed()", "Number.prototype.toFixed(<var>digits</var>)")}}</dt>
+ <dd>Devuelve una cadena que representa el número en notación de punto fijo.</dd>
+ <dt>{{jsxref("Number.prototype.toLocaleString()", "Number.prototype.toLocaleString([<var>locales</var> [, <var>options</var>]])")}}</dt>
+ <dd>Devuelve una cadena con una representación sensible al idioma de este número. Invalida el método {{jsxref ("Object.prototype.toLocaleString ()")}}.</dd>
+</dl>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Utilizando_el_objeto_Number_para_asignar_valores_a_variables_num.C3.A9ricas" name="Ejemplo:_Utilizando_el_objeto_Number_para_asignar_valores_a_variables_num.C3.A9ricas">Ejemplo: Utilizando el objeto <code>Number</code> para asignar valores a variables numéricas</h3>
+
+<p>El siguiente ejemplo utiliza las propiedades del objeto <code>Number</code> para asignar valores a varias variables numéricas:</p>
+
+<pre class="brush: js notranslate">const MásgrandeNum    = Number.MAX_VALUE;
+const MáspequeNum     = Number.MIN_VALUE;
+const infinitoNum     = Number.POSITIVE_INFINITY;
+const notInfinitoNum  = Number.NEGATIVE_INFINITY;
+const noEsNum         = Number.NaN;
+</pre>
+
+<h3 id="Ejemplo_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number" name="Ejemplo:_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number">Intervalo de enteros para Number</h3>
+
+<p>El siguiente ejemplo muestra los valores máximos y minimos que pueden ser representados mediante el objeto Number: </p>
+
+<p>Cuando se analizan datos que se han serializado en JSON, se puede esperar que los valores enteros que se encuentran fuera de este rango se corrompan cuando el analizador JSON los coacciona al tipo Number.</p>
+
+<p>Una posible solución es usar {{jsxref ("String")}} en su lugar.</p>
+
+<p>Los números más grandes se pueden representar usando el tipo {{jsxref ("BigInt")}}.</p>
+
+<pre class="notranslate">const biggestInt  = Number.MAX_SAFE_INTEGER  //  (<code>2<sup>53</sup> - 1</code>) =&gt;  9007199254740991
+const smallestInt = Number.MIN_SAFE_INTEGER  // -(<code>2<sup>53</sup> - 1</code>) =&gt; -9007199254740991</pre>
+
+<h3 id="Ejemplo_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number" name="Ejemplo:_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number">Ejemplo: Utilizando el objeto <code>Number</code> para modificar todos los objetos <code>Number</code></h3>
+
+<p>El siguiente ejemplo crea un objeto Number, miNúmero, luego añade la propiedad descripción a todos los objetos Number. Luego el valor es asignado a la propiedad descripción del objeto miNúmero.</p>
+
+<pre class="brush: js notranslate">miNúmero = new Number(65);
+Number.prototype.descripción = null;
+miNúmero.descripción = "velocidad del viento";
+</pre>
+
+<h3 id="Utilizando_el_objecto_Number_para_transformar_un_objeto_Date">Utilizando el objecto <code>Number</code> para transformar un objeto <code>Date</code> </h3>
+
+<p>El siguiente ejemplo convierte el objeto {{jsxref ("Date")}} a un valor numérico usando <code>Number</code>  como función:</p>
+
+<pre class="notranslate"><code>var d = new Date('December 17, 1995 03:24:00');
+console.log(Number(d));</code></pre>
+
+<p>Esto muestra "819199440000".</p>
+
+<h3 id="Convierte_cadenas_numéricas_a_números">Convierte cadenas numéricas a números</h3>
+
+<pre class="notranslate"><code>Number('123')     // 123
+Number('12.3')    // 12.3
+Number('123e-1')  // 12.3
+Number('')        // 0
+Number('0x11')    // 17
+Number('0b11')    // 3
+Number('0o11')    // 9
+Number('foo')     // NaN
+Number('100a')    // NaN</code></pre>
+
+<pre dir="rtl">Number('-Infinity') //-Infinity</pre>
+
+
+
+<h3 id="Vea_También">Vea También</h3>
+
+<ul>
+ <li>{{jsxref("Global_Objects/NaN", "NaN")}}</li>
+ <li>{{jsxref("Global_Objects/Math", "Math")}}</li>
+ <li>{{jsxref("Arithmetic operators")}} </li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/isfinite/index.html b/files/es/web/javascript/reference/global_objects/number/isfinite/index.html
new file mode 100644
index 0000000000..7435a50179
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/isfinite/index.html
@@ -0,0 +1,89 @@
+---
+title: Number.isFinite()
+slug: Web/JavaScript/Reference/Global_Objects/Number/isFinite
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/isFinite
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/isFinite
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Number.isFinite()</code></strong> determina si el valor pasado es un número finito.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-isfinite.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">Number.isFinite(valor)</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+ <dt><code>valor</code></dt>
+ <dd>El valor cuya finitud será probada.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>Un {{jsxref("Boolean")}} indicando si el valor dado es finito o no.</p>
+
+<h2 id="Description">Description</h2>
+
+<p>En comparación con la funcion global {{jsxref("isFinite", "isFinite()")}} , este método no convierte el parámetro forzádamente a un número. Esto significa que solo valores de tipo númerico, que también son finitos, retornan <code>true</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">Number.isFinite(Infinity);  // false
+Number.isFinite(NaN);       // false
+Number.isFinite(-Infinity); // false
+
+Number.isFinite(0);         // true
+Number.isFinite(2e64);      // true
+
+Number.isFinite('0');       // false, retornaría true con la función
+                            // global isFinite('0')
+Number.isFinite(null);      // false, retornaría true con la función
+                            // global isFinite(null)
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">Number.isFinite = Number.isFinite || function(value) {
+    return typeof value === 'number' &amp;&amp; isFinite(value);
+}
+</pre>
+
+<h2 id="Specificaciones">Specificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.isfinite', 'Number.isInteger')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.isfinite', 'Number.isInteger')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Number.isFinite")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El objeto {{jsxref("Number")}} al que pertenece esta función.</li>
+ <li>La función global {{jsxref("isFinite")}}.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/isinteger/index.html b/files/es/web/javascript/reference/global_objects/number/isinteger/index.html
new file mode 100644
index 0000000000..f21e26ed84
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/isinteger/index.html
@@ -0,0 +1,95 @@
+---
+title: Number.isInteger()
+slug: Web/JavaScript/Reference/Global_Objects/Number/isInteger
+tags:
+  - JavaScript
+  - Number
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/isInteger
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/isInteger
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Number.isInteger()</code></strong> determina si el valor pasado es de tipo entero.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-isinteger.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Number.isInteger(valor)</code></pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor</code></dt>
+ <dd>El valor a ser probado si es un entero.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un {{jsxref("Boolean")}} indicando si el valor dado es un entero o no.</p>
+
+<h2 id="Descripción">Descripción </h2>
+
+<p>Si el valor seleccionado es un entero, devuelve <code>true</code>, de lo contrario <code>false</code>. Si el valor es {{jsxref("NaN")}} o infinito, devuelve <code>false</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">Number.isInteger(0);         // true
+Number.isInteger(1);         // true
+Number.isInteger(-100000);   // true
+Number.isInteger(99999999999999999999999); // true
+
+Number.isInteger(0.1);       // false
+Number.isInteger(Math.PI);   // false
+
+Number.isInteger(NaN);       // false
+Number.isInteger(Infinity);  // false
+Number.isInteger(-Infinity); // false
+Number.isInteger('10');      // false
+Number.isInteger(true);      // false
+Number.isInteger(false);     // false
+Number.isInteger([1]);       // false
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">Number.isInteger = Number.isInteger || function(value) {
+  return typeof value === 'number' &amp;&amp;
+    isFinite(value) &amp;&amp;
+    Math.floor(value) === value;
+};
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.isinteger', 'Number.isInteger')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.isinteger', 'Number.isInteger')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatitibilidad_con_navegadores">Compatitibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Number.isInteger")}}</p>
+
+<h2 id="Ver también" name="Ver también">Ver también</h2>
+
+<ul>
+ <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/isnan/index.html b/files/es/web/javascript/reference/global_objects/number/isnan/index.html
new file mode 100644
index 0000000000..5d638d528f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/isnan/index.html
@@ -0,0 +1,141 @@
+---
+title: Number.isNaN()
+slug: Web/JavaScript/Reference/Global_Objects/Number/isNaN
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/isNaN
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/isNaN
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Number.isNaN()</code></strong> determina si el valor pasado es {{jsxref("NaN")}}. Versión más robusta de la función global {{jsxref("isNaN", "isNaN()")}}.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Number.isNaN(v<var>alue</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor</code></dt>
+ <dd>El valor para ser evaluado por {{jsxref("NaN")}}.</dd>
+</dl>
+
+<h2 id="Description">Description</h2>
+
+<p>Debido a los dos operadores de igualdad, {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} y {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}, evaluando a <code>false</code> cuando al comprobar si {{jsxref("NaN")}} <em>is</em> {{jsxref("NaN")}}, la función <code>Number.isNaN()</code> se ha convertido en necesaria. Esta situación es diferente a las otras comparaciones de valor en JavaScript.</p>
+
+<p>En comparación a la función global {{jsxref("isNaN", "isNaN()")}}, <code>Number.isNaN()</code> no sufre el problema de forzar la conversión del parámetro a un número. Esto significa que ahora es seguro pasar valores que normalmente se convertirían a {{jsxref("NaN")}}, pero no son del mismo valor que {{jsxref("NaN")}}. Esto también significa que solo los valores de tipo número, que también son {{jsxref("NaN")}}, retornan <code>true</code>.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js notranslate">Number.isNaN(NaN);        // true
+Number.isNaN(Number.NaN); // true
+Number.isNaN(0 / 0)       // true
+
+// e.g. estos hubiesen sido true con la función global isNaN()
+Number.isNaN("NaN");      // false
+Number.isNaN(undefined);  // false
+Number.isNaN({});         // false
+Number.isNaN("blabla");   // false
+
+// Todos retornan false
+Number.isNaN(true);
+Number.isNaN(null);
+Number.isNaN(37);
+Number.isNaN("37");
+Number.isNaN("37.37");
+Number.isNaN("");
+Number.isNaN(" ");
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js notranslate">Number.isNaN = Number.isNaN || function(value) {
+    return typeof value === "number" &amp;&amp; isNaN(value);
+}
+
+// O
+Number.isNaN = Number.isNaN || function(value) {
+    return value !== value;
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.isnan', 'Number.isnan')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.isnan', 'Number.isnan')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome("25")}}</td>
+   <td>{{CompatGeckoDesktop("15")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>9</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("15")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>9</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number")}}</li>
+ <li>{{jsxref("isNaN", "isNaN()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/issafeinteger/index.html b/files/es/web/javascript/reference/global_objects/number/issafeinteger/index.html
new file mode 100644
index 0000000000..e7e9fb7855
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/issafeinteger/index.html
@@ -0,0 +1,100 @@
+---
+title: Number.isSafeInteger()
+slug: Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Number
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/isSafeInteger
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Number.isSafeInteger()</code></strong> determina si el valor provisto es un número que es un entero seguro.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-issafeinteger.html")}}</div>
+
+
+
+<p>Un entero seguro es un entero que</p>
+
+<ul>
+ <li>puede ser exactamente representado como un número IEEE-754 de doble presición, y</li>
+ <li>su representación IEEE-754 no puede ser el resultado de redondear cualquier otro entero para  adaptarse a la representación de IEEE-754.</li>
+</ul>
+
+<p>Por ejemplo, <code>2<sup>53</sup> - 1</code> es un entero seguro: puede ser exactamente representado y ningún otro entero puede ser redondeado a él bajo cualquier modo de redondeo de IEEE-754. En contraste, <code>2<sup>53</sup></code> <em>no</em> es un entero seguro, puede ser exactamente representado en IEEE-754, pero el entero <code>2<sup>53</sup> + 1</code> no puede ser directamente representado en IEEE-754 pero en su lugar, redondea a <code>2<sup>53</sup></code> bajo los modos de redondeo <em>redondeo-al-más-cercano</em> y <em>redondeo-a-cero</em>.  Los enteros seguros consisten en todos los enteros desde <code>-(2<sup>53</sup> - 1)</code> inclusivo, hasta <code>2<sup>53</sup> - 1</code> inclusivo (± <code>9007199254740991</code> o ± 9,007,199,254,740,991).  </p>
+
+<p>Manejar valores más grandes o más pequeños que ~9 cuatrillones con presición completa requiere usar una <a href="https://en.wikipedia.org/wiki/Arbitrary-precision_arithmetic">biblioteca de artimética de presición arbitraria</a>.  Ver <a href="http://floating-point-gui.de/">Lo que todo programador necesita saber sobre aritmética de punto flotante</a> para más información sobre representaciones de punto flotante de los números.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Number.isSafeInteger(<em>valorDePrueba</em>)</code>
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><em>valorDePrueba</em></code></dt>
+ <dd>El valor a probar si es un entero seguro.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un {{jsxref("Boolean")}} que indica si el valor dado es un número que es entero seguro.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">Number.isSafeInteger(3);                    // true
+Number.isSafeInteger(Math.pow(2, 53));      // false
+Number.isSafeInteger(Math.pow(2, 53) - 1);  // true
+Number.isSafeInteger(NaN);                  // false
+Number.isSafeInteger(Infinity);             // false
+Number.isSafeInteger('3');                  // false
+Number.isSafeInteger(3.1);                  // false
+Number.isSafeInteger(3.0);                  // true
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">Number.isSafeInteger = Number.isSafeInteger || function (value) {
+   return Number.isInteger(value) &amp;&amp; Math.abs(value) &lt;= Number.MAX_SAFE_INTEGER;
+};
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Number.isSafeInteger")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
+ <li>{{jsxref("Number.MIN_SAFE_INTEGER")}}</li>
+ <li>{{jsxref("Number.MAX_SAFE_INTEGER")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/max_safe_integer/index.html b/files/es/web/javascript/reference/global_objects/number/max_safe_integer/index.html
new file mode 100644
index 0000000000..9dd417e292
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/max_safe_integer/index.html
@@ -0,0 +1,69 @@
+---
+title: Number.MAX_SAFE_INTEGER
+slug: Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Number
+  - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/MAX_SAFE_INTEGER
+---
+<div>{{JSRef}}</div>
+
+<p>La constante <strong><code>Number.MAX_SAFE_INTEGER</code></strong> es el número mas grande 'seguro' en JavaScript (<code>2<sup>53</sup> - 1</code>).</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-maxsafeinteger.html")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo está almacenada en GitHub. Si quieres contribuir al proyecto de ejmplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un 'pull request'.</p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La constante <code>MAX_SAFE_INTEGER</code> tiene un valor de <code>9007199254740991</code> (9,007,199,254,740,991 o ~9 mil billones). El razonamiento detrás de ese número es que JavaScript usa <a href="http://en.wikipedia.org/wiki/Double_precision_floating-point_format">números flotantes de doble precisión</a> tal como está especfificado en <a href="http://en.wikipedia.org/wiki/IEEE_floating_point">IEEE 754</a> por lo que puedes representar números de forma segura entre <code>-(2<sup>53</sup> - 1)</code> y  <code>2<sup>53</sup> - 1</code>.</p>
+
+<p>Seguro, en este contexto, se refiere a la habilidad de representar enteros de forma exacta y compararlos de forma correcta. Por ejemplo, <code>Number.MAX_SAFE_INTEGER + 1 === Number.MAX_SAFE_INTEGER + 2</code> evaluará como 'verdadero', lo cual es matemáticamente incorrecto. Ver {{jsxref("Number.isSafeInteger()")}} para más información.</p>
+
+<p>Debido a que <code>MAX_SAFE_INTEGER</code> es una propiedad estática de {{jsxref("Number")}}, siempre se usa como <code>Number.MAX_SAFE_INTEGER</code>, en lugar de como una propiedad de un objeto {{jsxref("Number")}} que hayas creado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">Number.MAX_SAFE_INTEGER // 9007199254740991
+Math.pow(2, 53) - 1     // 9007199254740991
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página está generada con base en información estructurada. Si quieres contribuir a dicha información, por favor revisa  <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un 'pull request'.</p>
+
+<p>{{Compat("javascript.builtins.Number.MAX_SAFE_INTEGER")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number.MIN_SAFE_INTEGER")}}</li>
+ <li>{{jsxref("Number.isSafeInteger()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/max_value/index.html b/files/es/web/javascript/reference/global_objects/number/max_value/index.html
new file mode 100644
index 0000000000..814beaac14
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/max_value/index.html
@@ -0,0 +1,132 @@
+---
+title: Number.MAX_VALUE
+slug: Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/MAX_VALUE
+---
+<div>{{JSRef}}</div>
+
+<div>La propiedad <strong><code>Number.MAX_VALUE</code></strong><code> </code>representa el valor numérico positivo máximo representable en JavaScript.</div>
+
+<div> </div>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad <code>MAX_VALUE</code> tiene un valor aproximado a <code>1.79E+308</code>. Si el valor es mayor será representado como <em><code>Infinity</code></em>.</p>
+
+<p>Dado que <code>MAX_VALUE</code> es una propiedad estática de {{jsxref("Number")}}, siempre ha de usarse como <code>Number.MAX_VALUE</code>, y no como propiedad del objeto que has creado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_MAX_VALUE">Usando <code>MAX_VALUE</code></h3>
+
+<p>La función <em>verificarValorMaximo </em>recibe un número como parámetro que se compara con <em>Number.MAX_VALUE. </em>Si el número es menor se imprime por consola <em>"El número no es infinito"</em>, de ser mayor <em>"El número es infinito"</em>.</p>
+
+<pre class="brush: js">var numero1 = 1.79E+307;
+var numero2 = 1.79E+310;
+
+function verificarValorMaximo(num){
+
+	if (num &lt;= Number.MAX_VALUE) {
+	  console.log("El número no es infinito");
+	} else {
+	  console.log("El número es infinito");
+	}
+
+}
+
+verificarValorMaximo(numero1); // El número no es infinito
+verificarValorMaximo(numero2); // El número es infinito
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.7.3.2', 'Number.MAX_VALUE')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.max_value', 'Number.MAX_VALUE')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.max_value', 'Number.MAX_VALUE')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad">Compatibilidad</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number.MIN_VALUE")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/min_value/index.html b/files/es/web/javascript/reference/global_objects/number/min_value/index.html
new file mode 100644
index 0000000000..3b0b515b63
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/min_value/index.html
@@ -0,0 +1,122 @@
+---
+title: Number.MIN_VALUE
+slug: Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/MIN_VALUE
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code><strong>Number.MIN_VALUE</strong></code> representa el menor valor positivo numérico representable en JavaScript.</p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad <code>MIN_VALUE </code>es el número más cercano a 0, no el más negativo, que JavaScript puede representar.</p>
+
+<p><code>MIN_VALUE </code>tiene un valor aproximado de <code>5e-324</code>. Los valores menores que <code>MIN_VALUE </code>(“subdesbordamiento de valores”) son convertidos a 0.</p>
+
+<p>Ya que <code>MIN_VALUE </code>es una propiedad estática de {{jsxref("Number")}}, debes utilizarla como <code>Number.MIN_VALUE</code>, más que como una propiedad del objeto {{jsxref("Number")}} que has creado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_MIN_VALUE">Usando <code>MIN_VALUE</code></h3>
+
+<p>El siguiente código divide dos valores numéricos. Si el resultado es mayor o igual a <code>MIN_VALUE</code>, se ejecuta la función <code>func1</code>, si no, se ejecuta la función <code>func2</code>.</p>
+
+<pre class="brush: js">if (num1 / num2 &gt;= Number.MIN_VALUE) {
+  func1();
+} else {
+  func2();
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.7.3.3', 'Number.MIN_VALUE')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.min_value', 'Number.MIN_VALUE')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.min_value', 'Number.MIN_VALUE')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number.MAX_VALUE")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/nan/index.html b/files/es/web/javascript/reference/global_objects/number/nan/index.html
new file mode 100644
index 0000000000..dd71aa97df
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/nan/index.html
@@ -0,0 +1,60 @@
+---
+title: Number.NaN
+slug: Web/JavaScript/Reference/Global_Objects/Number/NaN
+tags:
+  - JavaScript
+  - Número
+  - Propiedad
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/NaN
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/NaN
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <strong><code>Number.NaN</code></strong> representa Not-A-Number (No es numero). Equivalente de  {{jsxref("NaN")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-nan.html")}}</div>
+
+<p>No tienes que crear un objeto {{jsxref("Number")}} para acceder a esta propiedad estática (usa <code>Number.NaN</code>).</p>
+
+<div>{{js_property_attributes(0, 0, 0)}}</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Chequea_si_los_valores_son_numericos">Chequea si los valores son numericos</h3>
+
+<pre class="brush: js notranslate">function sanitise(x) {
+  if (isNaN(x)) {
+    return Number.NaN;
+  }
+  return x;
+}</pre>
+
+<h3 id="Testing_against_NaN">Testing against NaN</h3>
+
+<p>See <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN#Testing_against_NaN">Testing against NaN</a> on the <code>NaN</code> page.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.nan', 'Number.NaN')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Number.NaN")}}</p>
+
+<h2 id="Tambien_mira">Tambien mira</h2>
+
+<ul>
+ <li>El objeto global {{jsxref("NaN")}} .</li>
+ <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/negative_infinity/index.html b/files/es/web/javascript/reference/global_objects/number/negative_infinity/index.html
new file mode 100644
index 0000000000..5103aa5df2
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/negative_infinity/index.html
@@ -0,0 +1,118 @@
+---
+title: Number.NEGATIVE_INFINITY
+slug: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY
+tags:
+  - JavaScript
+  - Number
+  - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY
+---
+<div>
+ {{JSRef("Objetos_globales", "Number")}}</div>
+<h2 id="Summary" name="Summary">Resumen</h2>
+<p>La propiedad <code><strong>Number.NEGATIVE_INFINITY</strong></code> representa el valor del infinito negativo.</p>
+<p>No se tiene que crear un objeto {{jsxref("Number")}} para acceder a esta propiedad estática (use <code>Number.NEGATIVE_INFINITY</code>).</p>
+<p>{{js_property_attributes(0,0,0)}}</p>
+<h2 id="Description" name="Description">Descripción</h2>
+<p>El valor <code>Number.NEGATIVE_INFINITY</code> es el mismo que el valor negativo de la propiedad del objeto global {{jsxref( "Infinity")}}<strong><code>.</code></strong></p>
+<p>Este valor tiene un comportamiento ligeramente diferente que el del infinito matematico:</p>
+<ul>
+ <li>Cualquier valor positivo, incluyendo <code>POSITIVE_INFINITY</code>, multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado <code>NEGATIVE_INFINITY</code>.</li>
+ <li>Cualquier valor negativo, incluyendo <code>NEGATIVE_INFINITY</code>, multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado <code>POSITIVE_INFINITY</code>.</li>
+ <li>Cero multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado <code>NaN</code>.</li>
+ <li>NaN multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado  <code>NaN</code>.</li>
+ <li><code>NEGATIVE_INFINITY</code>, divido por cualquier valor negativo excepto <code>NEGATIVE_INFINITY</code>, da como resultado <code>POSITIVE_INFINITY</code>.</li>
+ <li><code>NEGATIVE_INFINITY</code>, divido por cualquier valor positivo excepto <code>POSITIVE_INFINITY</code>, da como resultado <code>NEGATIVE_INFINITY</code>.</li>
+ <li><code>NEGATIVE_INFINITY</code>, divido por <code>NEGATIVE_INFINITY</code> o por <code>POSITIVE_INFINITY</code>, da como resultado <code>NaN</code>.</li>
+ <li>Cualquier numero divido por <code>NEGATIVE_INFINITY</code> da como resultado cero.</li>
+</ul>
+<p>Muchos métodos JavaScript (tales como el constructor del objeto <code>Number</code>, <code>parseFloat</code>, y <code>parseInt</code>) retornan <code>NaN</code> si el valor especifico en el párametro es significativamente menor a <code>Number.MIN_VALUE</code>.</p>
+<p>Podrías utilizar la propiedad <code>Number.NEGATIVE_INFINITY</code> para indicar una condición de error que retorne un numero finito en caso de que esto suceda. Note, sin embargo, que <code><a href="/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isFinite">isFinite</a></code> seria mas apropiado en estos casos.</p>
+<h2 id="Example" name="Example">Example</h2>
+<p>En el siguiente ejemplo, a la variable <code>smallNumber </code>se le asigna un valor mucho mas pequeño al valor minimo. Cuando la sentencia <code>if</code> es ejecutada, <code>smallNumber </code>tiene el valor "<code>-Infinity</code>", por lo cual a <code>smallNumber </code>le es asignado un valor finito mas manejable antes de continuar.</p>
+<pre class="brush:js">var smallNumber = (-Number.MAX_VALUE) * 2
+
+if (smallNumber === Number.NEGATIVE_INFINITY) {
+ smallNumber = returnFinite();
+}
+</pre>
+<h2 id="Especificaciones">Especificaciones</h2>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1ra Edición. Implementado en JavaScript 1.1</td>
+   <td>Estándar</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.7.3.5', 'Number.NEGATIVE_INFINITY')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.negative_infinity', 'Number.NEGATIVE_INFINITY')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Característica</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Característica</th>
+    <th>Android</th>
+    <th>Chrome for Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h2 id="See_also" name="See_also">Ver también</h2>
+<ul>
+ <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li>
+ <li>{{jsxref( "Infinity")}}</li>
+ <li>{{jsxref("isFinite")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/parsefloat/index.html b/files/es/web/javascript/reference/global_objects/number/parsefloat/index.html
new file mode 100644
index 0000000000..d4797cfe3f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/parsefloat/index.html
@@ -0,0 +1,77 @@
+---
+title: Number.parseFloat()
+slug: Web/JavaScript/Reference/Global_Objects/Number/parseFloat
+tags:
+  - ECMAScript2015
+  - ECMAScript6
+  - JavaScript
+  - Número
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseFloat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/parseFloat
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Number.parseFloat()</code></strong> parsea un argumento cadena y regresa un número de punto flotante. Este método se comporta de igual forma a la función global {{jsxref("parseFloat", "parseFloat()")}} y es parte de ECMAScript 2015 (su propósito es la modularización de los globales).</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-parsefloat.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Number.parseFloat(<var>string</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat", "Parameters")}}</p>
+
+<h3 id="Valor_de_regreso">Valor de regreso</h3>
+
+<p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat", "Return value")}}</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Por favor ver {{jsxref("parseFloat", "parseFloat()")}} para más detalles y ejemplos.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js notranslate">if (Number.parseFloat === void 0) {
+    Number.parseFloat = parseFloat;
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-number.parsefloat', 'Number.parseFloat')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.parsefloat', 'Number.parseFloat')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Number.parseFloat")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
+ <li>El método global {{jsxref("parseFloat", "parseFloat()")}}.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/parseint/index.html b/files/es/web/javascript/reference/global_objects/number/parseint/index.html
new file mode 100644
index 0000000000..5d2120ca5b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/parseint/index.html
@@ -0,0 +1,81 @@
+---
+title: Number.parseInt()
+slug: Web/JavaScript/Reference/Global_Objects/Number/parseInt
+tags:
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseInt
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/parseInt
+---
+<div>{{JSRef}}</div>
+
+<p>The <strong><code>Number.parseInt()</code></strong> method parses a string argument and returns an integer of the specified radix or base.</p>
+
+<p>The <strong><code>Number.parseInt()</code></strong> El método Number.parseInt () analiza un argumento de cadena y devuelve un entero de la raíz o base especificada.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-parseint.html", "taller")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">Number.parseInt(<var>string,</var>[ <var>radix</var>])</pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<div>
+<dl>
+ <dt><code><var>string</var></code></dt>
+ <dd>The value to parse. If this argument is not a string, then it is converted to one using the <code><a href="https://tc39.es/ecma262/#sec-tostring">ToString</a></code> abstract operation. Leading whitespace in this argument is ignored.</dd>
+ <dt><code><var>radix</var></code><var> {{optional_inline}}</var></dt>
+ <dd>An integer between <code>2</code> and <code>36</code> that represents the <em>radix</em> (the base in mathematical numeral systems) of the <code><var>string</var></code>. Be careful—this does <strong><em>not</em></strong> default to <code>10</code>!</dd>
+</dl>
+</div>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>An integer parsed from the given <code><var>string</var></code>.</p>
+
+<p>If the <code><var>radix</var></code> is smaller than <code>2</code> or bigger than <code>36</code>, and the first non-whitespace character cannot be converted to a number, {{jsxref("NaN")}} is returned.</p>
+
+<h2 id="Description">Description</h2>
+
+<p>This method has the same functionality as the global {{jsxref("parseInt", "parseInt()")}} function:</p>
+
+<pre class="brush: js">Number.parseInt === parseInt // true</pre>
+
+<p>and is part of ECMAScript 2015 (its purpose is modularization of globals). Please see {{jsxref("parseInt", "parseInt()")}} for more detail and examples.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<pre class="brush: js">if (Number.parseInt === undefined) {
+    Number.parseInt = window.parseInt
+}
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.parseint', 'Number.parseInt')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Number.parseInt")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>The {{jsxref("Number")}} object it belongs to.</li>
+ <li>The global {{jsxref("parseInt", "parseInt()")}} method.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/positive_infinity/index.html b/files/es/web/javascript/reference/global_objects/number/positive_infinity/index.html
new file mode 100644
index 0000000000..72c482b252
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/positive_infinity/index.html
@@ -0,0 +1,116 @@
+---
+title: Number.POSITIVE_INFINITY
+slug: Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY
+tags:
+  - JavaScript
+  - Number
+  - Property
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY
+---
+<p>{{JSRef("Objetos_globales", "Number")}}</p>
+<h2 id="Resumen">Resumen</h2>
+<p>La propiedad <code><strong>Number.POSITIVE_INFINITY</strong></code> representa el infinito positivo.</p>
+<p>No se tiene que crear un objeto {{jsxref("Number")}} para acceder a esta propiedad estática (use <code>Number.POSITIVE_INFINITY</code>).</p>
+<p>{{js_property_attributes(0,0,0)}}</p>
+<h2 id="Descripción">Descripción</h2>
+<p>El valor de <code>Number.POSITIVE_INFINITY</code> es el mismo valor de la propiedad {{jsxref( "Infinity")}} del objeto global.</p>
+<p>Este valor tiene un comportamiento ligeramente diferente al infinio matemático:</p>
+<ul>
+ <li>Cualquier valor positivo, incluyendo <code>POSITIVE_INFINITY</code>, multiplicado por <code>POSITIVE_INFINITY</code> da como resultado <code>POSITIVE_INFINITY</code>.</li>
+ <li>Cualquier valor negativo, incluyendo <code>NEGATIVE_INFINITY</code>, multiplicado por <code>POSITIVE_INFINITY</code> da como resultado <code>NEGATIVE_INFINITY</code>.</li>
+ <li>Cero multiplicado por <code>POSITIVE_INFINITY</code> da como resultado NaN.</li>
+ <li>NaN multiplicado por <code>POSITIVE_INFINITY</code> da como resultado NaN.</li>
+ <li><code>POSITIVE_INFINITY</code>,  dividido por cualquier valor negativo excepto <code>NEGATIVE_INFINITY</code>, da como resultado <code>NEGATIVE_INFINITY</code>.</li>
+ <li><code>POSITIVE_INFINITY</code>, divido por cualquier valor positivo excepto <code>POSITIVE_INFINITY</code>, da como resultado <code>POSITIVE_INFINITY</code>.</li>
+ <li><code>POSITIVE_INFINITY</code>, divido por <code>INFINITY</code> o por <code>POSITIVE_INFINITY</code>, da como resultado NaN.</li>
+ <li>Cualquier numero divido por <code>POSITIVE_INFINITY</code> da como resultado cero.</li>
+</ul>
+<p>Muchos métodos de JavaScript (tales como el constructor del objeto <code>Number</code>, <code>parseFloat</code> y <code>parseInt</code>) retornan <code>NaN</code> si el valor especificado en el parámetro es signficativamente mayor a <code>Number.MAX_VALUE</code>.</p>
+<p>Podrías utilizar la propiedad <code>Number.POSITIVE_INFINITY</code> para indicar una condición de error que retorne un numero finito en caso de que esto suceda. Note, sin embargo, que <code><a href="/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isFinite">isFinite</a></code> seria mas apropiado en estos casos.</p>
+<h2 id="Ejemplo">Ejemplo</h2>
+<p>En el siguiente ejemplo, a la variable <code>bigNumber </code>se le asigna un valor mucho mayor al valor máximo. Cuando la sentencia <code>if</code> es ejecutada, <code>bigNumber </code>tiene el valor "<code>Infinity</code>", por lo cual a <code>bigNumber</code> le es asignado un valor mas manejable antes de continuar.</p>
+<pre class="brush: js">var bigNumber = Number.MAX_VALUE * 2;
+if (bigNumber === Number.POSITIVE_INFINITY) {
+ bigNumber = returnFinite();
+}
+</pre>
+<h2 id="Especificaciones">Especificaciones</h2>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td>
+   <td>Estándar</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.7.3.6', 'Number.POSITIVE_INFINITY')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.positive_infinity', 'Number.POSITIVE_INFINITY')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+<p>{{ CompatibilityTable() }}</p>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Caracteristica</th>
+    <th>Chrome</th>
+    <th>Firefox (Gecko)</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>Soporte básico</td>
+    <td>(SI)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Caracteristica</th>
+    <th>Android</th>
+    <th>Chrome for Android</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Soprote básico</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+    <td>(Si)</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<h2 id="See_also" name="See_also">Ver también</h2>
+<ul>
+ <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li>
+ <li>{{jsxref("Infinity")}}</li>
+ <li>{{jsxref("isFinite")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/tofixed/index.html b/files/es/web/javascript/reference/global_objects/number/tofixed/index.html
new file mode 100644
index 0000000000..429a8f5a85
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/tofixed/index.html
@@ -0,0 +1,148 @@
+---
+title: Number.prototype.toFixed()
+slug: Web/JavaScript/Reference/Global_Objects/Number/toFixed
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/toFixed
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toFixed()</code></strong> formatea un número usando notación de punto fijo.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-tofixed.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>numObj</var>.toFixed([<var>digitos</var>])</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>digitos</code></dt>
+ <dd>Opcional. El número de digitos que aparecen después del punto decimal; este puede ser un valor entre 0 y 20, inclusive, algunas implementaciones pueden soportar un rango más amplio de valores. Si el argumento es omitido, es tratado como 0.</dd>
+</dl>
+
+<h3 id="Valor_Devuelto">Valor Devuelto</h3>
+
+<p>Una cadena que representa el número dado, usando notación de punto fijo.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<dl>
+ <dt>{{jsxref("RangeError")}}</dt>
+ <dd>Si <code>digits</code> es demasiado pequeño o demasiado grande. Los valores entre 0 y 20, inclusive, no causarán un error tipo<code> {{jsxref("RangeError")}}</code>. Las implementaciones también pueden admitir valores cada vez más grandes.</dd>
+ <dt>{{jsxref("TypeError")}}</dt>
+ <dd>Si este método se invoca en un objeto que no es un {{jsxref("Number")}}.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><strong><code>toFixed()</code></strong> devuelve una representación de cadena de <code> numObj </code> que no usa notación exponencial y tiene exactamente <code> dígitos </code> dígitos después del decimal. El número se redondea si es necesario, y la parte fraccional se rellena con ceros si es necesario para que tenga la longitud especificada.Si <code>numObj</code> es mayor que <code>1e+21</code>, este metodo llama a {{jsxref("Number.prototype.toString()")}} y retorna una cadena de notacion exponencial.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_toFixed">Using <code>toFixed</code></h3>
+
+<pre class="brush: js">var numObj = 12345.6789;
+
+numObj.toFixed();       // Returns '12346': note rounding, no fractional part
+numObj.toFixed(1);      // Returns '12345.7': note rounding
+numObj.toFixed(6);      // Returns '12345.678900': note added zeros
+(1.23e+20).toFixed(2);  // Returns '123000000000000000000.00'
+(1.23e-10).toFixed(2);  // Returns '0.00'
+2.34.toFixed(1);        // Returns '2.3'
+2.35.toFixed(1);        // Returns '2.4'. Note that it rounds up in this case.
+-2.34.toFixed(1);       // Returns -2.3 (due to operator precedence, negative number literals don't return a string...)
+(-2.34).toFixed(1);     // Returns '-2.3' (...unless you use parentheses)
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.7.4.5', 'Number.prototype.toFixed')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Number.prototype.toExponential()")}}</li>
+ <li>{{jsxref("Number.prototype.toPrecision()")}}</li>
+ <li>{{jsxref("Number.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/tolocalestring/index.html b/files/es/web/javascript/reference/global_objects/number/tolocalestring/index.html
new file mode 100644
index 0000000000..c0d411b844
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/tolocalestring/index.html
@@ -0,0 +1,156 @@
+---
+title: Number.prototype.toLocaleString()
+slug: Web/JavaScript/Reference/Global_Objects/Number/toLocaleString
+tags:
+  - Internacionalizacion
+  - JavaScript
+  - Número
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/toLocaleString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/toLocaleString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toLocaleString()</code></strong> retorna una representacion localizada del número en forma de texto</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-tolocalestring.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox notranslate"><code><em>numObj</em>.toLocaleString(</code><code>[locales [, options]])</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<p>Los argumentos <code>locales</code> y <code>options</code> personalizan el comportamiento de la funcion y permite especificar el lenguaje cuyo formato deberá ser utilizado. En implementaciones, que ignoran los argumentos <code>locales</code> y <code>options</code> la localización utilizada y la forma del texto retornado es enteramente dependiente de la implementación.</p>
+
+<div>Mira el  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat">constructor Intl.NumberFormat()</a> para ver más detalles sobre los parámetros y como se utilizan.</div>
+
+<div></div>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un texto con una representación localizada del número dado.</p>
+
+<h2 id="Performance">Performance</h2>
+
+<p>Cuando formateas una gran cantidad de números, es mejor crear un objeto {{jsxref("NumberFormat")}} y utilizar la función {{jsxref("NumberFormat.format")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toLocaleString">Usando <code>toLocaleString</code></h3>
+
+<p>Un uso básico sin especificar <code>locales</code>, retorna un texto formateado con el <code>locales</code> y <code>options</code> por defecto.</p>
+
+<pre class="brush: js notranslate">var number = 3500;
+
+console.log(number.toLocaleString()); // Muestra "3,500" si se está utilizando la localización U.S. English
+</pre>
+
+<h3 id="Verificando_el_soporte_de_los_parámetros_locales_y_options">Verificando el soporte de los parámetros <code>locales</code> y <code>options</code></h3>
+
+<p>Los parámetros <code>locales</code> y <code>options</code> no son soportados aún por todos los navegadores. Para verificar el soporte en ES5.1 y posteriores implementaciones, se puede utilizar el hecho que los tags inválidos en la localización son rechazados con una excepción {{jsxref("Global_Objects/RangeError", "RangeError")}}:</p>
+
+<pre class="brush: js notranslate">function toLocaleStringSupportsLocales() {
+  var number = 0;
+  try {
+    number.toLocaleString('i');
+  } catch (e) {
+    return e.name === 'RangeError';
+  }
+  return false;
+}
+</pre>
+
+<p>Antes de ES5.1, las implementaciones no requieren devolver una exepción {{jsxref("Global_Objects/RangeError", "RangeError")}} cuando <code>toLocaleString </code>es llamado sin argumentos.</p>
+
+<p>Para verificar que funciona todos los navegadores, incluyendo aquellos que soportan ECMA-262, anterior a ES5.1, se puede verificar por las funcionalidades especificadas en ECMA-402 que requieren soportar opciones regionales para <code>Number.prototype.toLocaleString</code> directamente:</p>
+
+<pre class="brush: js notranslate">function toLocaleStringSupportsOptions() {
+  return !!(typeof Intl == 'object' &amp;&amp; Intl &amp;&amp; typeof Intl.NumberFormat == 'function');
+}
+</pre>
+
+<p>Esta validación del objeto global <code>Intl</code> , verificar que no es <code>null</code> (nulo) y que tiene la propiedad <code>NumberFormat</code> que es una función.</p>
+
+<h3 id="Utilizando_locales">Utilizando <code>locales</code></h3>
+
+<p>Este ejemplo muestra alguna de las variaciones en los formatos de números localizados. Para obtener el formato de la localización utilizada en la interfaz del usuario de tu aplicación, asegurate de especificar la localización (y de ser posible alguna localización de respaldo) utilizando el parámetro <code>locales</code>:</p>
+
+<pre class="brush: js notranslate">var number = 123456.789;
+
+// Aleman utiliza comas como separador decimal y puntos miles
+console.log(number.toLocaleString('de-DE'));
+// → 123.456,789
+
+// Arabe en la mayoría de países de habla Arabe utilizan numerales <a href="https://en.wikipedia.org/wiki/Eastern_Arabic_numerals">Eastern Arabic</a>
+console.log(number.toLocaleString('ar-EG'));
+// → ١٢٣٤٥٦٫٧٨٩
+
+// India utiliza separadores de miles/lakh/crore
+console.log(number.toLocaleString('en-IN'));
+// → 1,23,456.789
+
+// la extensión nu requiere un sistema numerico, e.g. Decimales Chino
+console.log(number.toLocaleString('zh-Hans-CN-u-nu-hanidec'));
+// → 一二三,四五六.七八九
+
+// cuando solicitas un lenguage que podria no ser soportado, como
+// Balinese, incluye un lenguaje de respaldo, en este caso Indonesio
+console.log(number.toLocaleString(['ban', 'id']));
+// → 123.456,789
+</pre>
+
+<h3 id="Utilizando_options">Utilizando <code>options</code></h3>
+
+<p>El resultado proveido por  <code>toLocaleString</code> puede ser personalizado utilizando el parámetro <code>options</code> :</p>
+
+<pre class="brush: js notranslate">var number = 123456.789;
+
+// solicitar un formato de moneda
+console.log(number.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' }));
+// → 123.456,79 €
+
+// en Japones yen no utiliza una moneda menor
+console.log(number.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }))
+// → ￥123,457
+
+// limitar a tres digitos el significante
+console.log(number.toLocaleString('en-IN', { maximumSignificantDigits: 3 }));
+// → 1,23,000
+
+// Utilizar el lenguaje por defecto del host con opciones para el formato del número
+var num = 30000.65;
+console.log(num.toLocaleString(undefined, {minimumFractionDigits: 2, maximumFractionDigits: 2}));
+// → "30,000.65" donde English es el lenguaje por defecto, o
+// → "30.000,65" donde Aleman es el lenguaje por defecto, o
+// → "30 000,65" donde French es el lenguaje por defecto
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.prototype.tolocalestring', 'Number.prototype.toLocaleString')}}</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sup-number.prototype.tolocalestring', 'Number.prototype.toLocaleString')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Number.toLocaleString")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/toprecision/index.html b/files/es/web/javascript/reference/global_objects/number/toprecision/index.html
new file mode 100644
index 0000000000..b8133df255
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/toprecision/index.html
@@ -0,0 +1,103 @@
+---
+title: Number.prototype.toPrecision()
+slug: Web/JavaScript/Reference/Global_Objects/Number/toPrecision
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/toPrecision
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/toPrecision
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toPrecision()</code></strong> devuelve una cadena que representa un objeto {{jsxref("Number")}} según la precisión especificada.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/number-toprecision.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>numObj</var>.toPrecision([<var>precision</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>precision</code></dt>
+ <dd>Opcional. Un entero que especifica el número de digitos significativos.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena que representa un objeto {{jsxref("Number")}} en punto fijo o en notación exponencial redondeada a <code>precision</code> de digitos significativos. Vea la discusión acerca del redondeo en la descripción del método {{jsxref("Number.prototype.toFixed()")}} , que además aplica a <code>toPrecision()</code>.</p>
+
+<p>Si el parámetro <code>precision</code> es omitido, se comporta como {{jsxref("Number.prototype.toString()")}}. Si el parámetro <code>precision</code> es un valor no entero, el valor es redondeado al entero más cercano.</p>
+
+<h3 id="Exceptions">Exceptions</h3>
+
+<dl>
+ <dt>{{jsxref("Global_Objects/RangeError", "RangeError")}}</dt>
+ <dd>If <code>precision</code> is not between 1 and 100 (inclusive), a {{jsxref("RangeError")}} is thrown. Implementations are allowed to support larger and smaller values as well. ECMA-262 only requires a precision of up to 21 significant digits.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toPrecision">Usando <code>toPrecision</code></h3>
+
+<pre class="brush: js">var numObj = 5.123456;
+
+console.log(numObj.toPrecision());    // logs '5.123456'
+console.log(numObj.toPrecision(5));   // logs '5.1235'
+console.log(numObj.toPrecision(2));   // logs '5.1'
+console.log(numObj.toPrecision(1));   // logs '5'
+
+numObj = 0.000123
+
+console.log(numObj.toPrecision());    // logs '0.000123'
+console.log(numObj.toPrecision(5));   // logs '0.00012300'
+console.log(numObj.toPrecision(2));   // logs '0.00012'
+console.log(numObj.toPrecision(1));   // logs '0.0001'
+
+// observe que bajo algunas circunstancias el valor retornado es en notación exponencial
+console.log((1234.5).toPrecision(2)); // logs '1.2e+3'
+</pre>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Primera definición. Implementada en JavaScript 1.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.7.4.7', 'Number.prototype.toPrecision')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.prototype.toprecision', 'Number.prototype.toPrecision')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.prototype.toprecision', 'Number.prototype.toPrecision')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.Number.toPrecision")}}</p>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Number.prototype.toFixed()")}}</li>
+ <li>{{jsxref("Number.prototype.toExponential()")}}</li>
+ <li>{{jsxref("Number.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/tostring/index.html b/files/es/web/javascript/reference/global_objects/number/tostring/index.html
new file mode 100644
index 0000000000..58821a4423
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/tostring/index.html
@@ -0,0 +1,64 @@
+---
+title: Number.prototype.toString()
+slug: Web/JavaScript/Reference/Global_Objects/Number/toString
+tags:
+  - JavaScript
+  - Method
+  - Number
+  - Prototype
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/toString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/toString
+---
+<div>{{JSRef("Objetos_globales", "Number")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Devuelve una cadena que representa al objeto <em>Number</em> especificado</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<p><code><em>number</em> .toString( {{ mediawiki.external('<em>base</em> ') }} )</code></p>
+
+<h3 id="Par.C3.A1metro" name="Par.C3.A1metro">Parámetro</h3>
+
+<dl>
+ <dt>base</dt>
+ <dd>Un entero entre 2 y 36 especificando la base a usar para representar los valores numéricos.</dd>
+</dl>
+
+<h3 id="Devuelve" name="Devuelve">Devuelve</h3>
+
+<p>Una cadena que representa al objeto.</p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>El objeto <code>Number</code> sobreescribe el método <code>toString</code> y no lo hereda del objeto {{jsxref("Object")}}; por tanto no hereda {{jsxref("Object.prototype.toString()")}}. Para objetos <code>Number</code>, el método <code>toString</code> devuelve una cadena que representa al objeto en la base especificada.</p>
+
+<p>El método toString comprueba su primer argumento, e intenta devolver una cadena de representación en la base especificada. Para bases superiores a 10, las letras del alfabeto indican numerales mayores de 9. Por ejemplo, para números hexadecimales (base 16), se utiliza de A hasta F.</p>
+
+<p>Si no se da a toString una base entre 2 y 36, se lanza una excepción.</p>
+
+<p>Si no se especifica la base, JavaScript asume la base predefinida, que es 10.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">var howMany = 10;
+
+alert("howMany.toString() is " + howMany.toString()); // displays "10"
+
+alert("45 .toString() is " + 45 .toString()); //displays "45"
+
+var x = 7;
+alert(x.toString(2))      // Displays "111"
+</pre>
+
+
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Number.prototype.toFixed()")}}</li>
+ <li>{{jsxref("Number.prototype.toExponential()")}}</li>
+ <li>{{jsxref("Number.prototype.toPrecision()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/number/valueof/index.html b/files/es/web/javascript/reference/global_objects/number/valueof/index.html
new file mode 100644
index 0000000000..5ee896c1f7
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/number/valueof/index.html
@@ -0,0 +1,82 @@
+---
+title: Number.prototype.valueOf()
+slug: Web/JavaScript/Reference/Global_Objects/Number/valueOf
+tags:
+  - JavaScript
+  - Métodos
+  - Number
+  - Prototype
+translation_of: Web/JavaScript/Reference/Global_Objects/Number/valueOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Number/valueOf
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>valueOf()</code></strong> retorna el valor primitivo inserto en un objeto {{jsxref("Number")}}.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>numObj</var>.valueOf()</code></pre>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Un número representando al valor primitivo del objeto  {{jsxref("Number")}} especificado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Este método es usualmente llamado de forma interna por JavaScript y no es explicitado en el código web.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_valueOf">Utilizando <code>valueOf</code></h3>
+
+<pre class="brush: js">var numObj = new Number(10);
+console.log(typeof numObj); // objeto
+
+var num = numObj.valueOf();
+console.log(num);           // 10
+console.log(typeof num);    // número
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.7.4.4', 'Number.prototype.valueOf')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-number.prototype.valueof', 'Number.prototype.valueOf')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-number.prototype.valueof', 'Number.prototype.valueOf')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegador">Compatibilidad con navegador</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si deseas contribuir con los datos, por favor, revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud.</p>
+
+<p>{{Compat("javascript.builtins.Number.valueOf")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Number.prototype.toSource()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/__definegetter__/index.html b/files/es/web/javascript/reference/global_objects/object/__definegetter__/index.html
new file mode 100644
index 0000000000..42b2aeb0a4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/__definegetter__/index.html
@@ -0,0 +1,145 @@
+---
+title: Object.prototype.__defineGetter__()
+slug: Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__
+tags:
+  - JavaScript
+  - Objeto
+  - Prototipo
+  - Prototype
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/__defineGetter__
+---
+<div>{{JSRef}}</div>
+
+<div class="warning">
+<p>Esta característica está obsoleta en favor de definir getters usando el <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer syntax</a> o la API {{jsxref("Object.defineProperty()")}}.</p>
+
+<p>En todo caso, como es ampliamente implementada y usada en la Web,  es poco probable que los navegadores dejen de implementarla.</p>
+</div>
+
+<p>El método <code><strong>__defineGetter__</strong></code> enlaza una propiedad de un objeto a una función a ser llamada cuando esa propiedad es buscada.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>obj</var>.__defineGetter__(<var>prop</var>, <var>func</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>prop</code></dt>
+ <dd>Un texto (string) que contiene el nombre de la propiedad para enlazar la función dada.</dd>
+ <dt><code>func</code></dt>
+ <dd>A function to be bound to a lookup of the specified property.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>The <code>__defineGetter__</code> allows a {{jsxref("Operators/get", "getter", "", 1)}} to be defined on a pre-existing object.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">// Forma no-estándar y obsoleta
+
+var o = {};
+o.__defineGetter__('gimmeFive', function() { return 5; });
+console.log(o.gimmeFive); // 5
+
+
+// Formas compatibles con el estándar
+
+// Usando el operador get
+var o = { get gimmeFive() { return 5; } };
+console.log(o.gimmeFive); // 5
+
+// Usando Object.defineProperty
+var o = {};
+Object.defineProperty(o, 'gimmeFive', {
+  get: function() {
+    return 5;
+  }
+});
+console.log(o.gimmeFive); // 5
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="spectable standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('JavaScript', '#object.prototype.__definegetter__', 'Object.prototype.__defineGetter__()')}}</td>
+   <td>{{Spec2('JavaScript')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatIE("11")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.__defineSetter__()")}}</li>
+ <li>{{jsxref("Operators/get", "get")}} operator</li>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+ <li>{{jsxref("Object.prototype.__lookupGetter__()")}}</li>
+ <li>{{jsxref("Object.prototype.__lookupSetter__()")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">JS Guide: Defining Getters and Setters</a></li>
+ <li><a href="http://whereswalden.com/2010/04/16/more-spidermonkey-changes-ancient-esoteric-very-rarely-used-syntax-for-creating-getters-and-setters-is-being-removed/">[Blog Post] Deprecation of __defineGetter__ and __defineSetter__</a></li>
+ <li>{{bug(647423)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/__lookupgetter__/index.html b/files/es/web/javascript/reference/global_objects/object/__lookupgetter__/index.html
new file mode 100644
index 0000000000..d99273a3fe
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/__lookupgetter__/index.html
@@ -0,0 +1,85 @@
+---
+title: Object.prototype.__lookupGetter__()
+slug: Web/JavaScript/Reference/Global_Objects/Object/__lookupGetter__
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/__lookupGetter__
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/__lookupGetter__
+---
+<div>{{JSRef}} {{deprecated_header}}</div>
+
+<p>Los <code><strong>__lookupGetter__</strong></code> metodos retornan la funcion  enlazada como un getter para especificar la propiedad.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code><var>obj</var>.__lookupGetter__(<var>sprop</var>)</code></pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+ <dt><code>sprop</code></dt>
+ <dd>A string containing the name of the property whose getter should be returned.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>The function bound as a getter to the specified property.</p>
+
+<h2 id="Description">Description</h2>
+
+<p>If a getter has been defined for an object's property, it's not possible to reference the getter function through that property, because that property refers to the return value of that function. <code>__lookupGetter__</code> can be used to obtain a reference to the getter function.</p>
+
+<p>It is now possible to do this in a standardized way using {{jsxref("Object.getOwnPropertyDescriptor()")}} and {{jsxref("Object.getPrototypeOf()")}}.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js">var obj = {
+  get foo() {
+    return Math.random() &gt; 0.5 ? 'foo' : 'bar';
+  }
+};
+
+
+// Non-standard and deprecated way
+obj.__lookupGetter__('foo');
+// (function() { return Math.random() &gt; 0.5 ? 'foo' : 'bar'; })
+
+
+// Standard-compliant way
+Object.getOwnPropertyDescriptor(obj, "foo").get;
+// (function() { return Math.random() &gt; 0.5 ? 'foo' : 'bar'; })
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="spectable standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.prototype.__lookupGetter__', 'Object.prototype.__lookupGetter__()')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Included in the (normative) annex for additional ECMAScript legacy features for Web browsers (note that the specification codifies what is already in implementations).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Object.lookupGetter")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.__lookupSetter__()")}}</li>
+ <li>{{jsxref("Functions/get", "get")}} operator</li>
+ <li>{{jsxref("Object.getOwnPropertyDescriptor()")}} and {{jsxref("Object.getPrototypeOf()")}}</li>
+ <li>{{jsxref("Object.prototype.__defineGetter__()")}}</li>
+ <li>{{jsxref("Object.prototype.__defineSetter__()")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">JS Guide: Defining Getters and Setters</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/assign/index.html b/files/es/web/javascript/reference/global_objects/object/assign/index.html
new file mode 100644
index 0000000000..bc8dec4d8a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/assign/index.html
@@ -0,0 +1,275 @@
+---
+title: Object.assign()
+slug: Web/JavaScript/Reference/Global_Objects/Object/assign
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Objeto
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/assign
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/assign
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Object.assign()</code></strong> copia todas las propiedades enumerables de uno o más objetos fuente a un objeto destino. Devuelve el objeto destino. </p>
+
+<div>{{EmbedInteractiveExample("pages/js/object-assign.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">Object.assign(<var>objetivo</var>, ...<var>fuentes</var>)</pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>objetivo</code></dt>
+ <dd>El objeto destino.</dd>
+ <dt><code>fuentes</code></dt>
+ <dd>Los objetos origen.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El objeto destino.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las propiedades en el objeto destino serán sobrescritas por las propiedades en las fuentes si tienen la misma clave. Propiedades posteriores de las fuentes podrán sobrescribir las anteriores.</p>
+
+<p>El método <code>Object.assign()</code> copia sólo las propiedades <em>enumerables</em> y <em>propias</em> del objeto origen a un objeto destino. Usa <code>[[Get]]</code> en la origen y <code>[[Set]] </code>en el destino, por lo que invocará los métodos de acceso y establecimiento (<em>getters</em> y <em>setters</em>). Por consiguiente <em>asignará</em> propiedades frente a sólo copiar o definir propiedades nuevas. Esto puede hacer que sea inadecuado para fusionar propiedades nuevas en un prototipo si los objetos fuente contienen métodos de acceso (<em>getters</em>). Para copiar definiciones de propiedades en prototipos, incluyendo su enumerabilidad, se deben usar {{jsxref("Object.getOwnPropertyDescriptor()")}} y {{jsxref("Object.defineProperty()")}}.</p>
+
+<p>Tanto las propiedades {{jsxref("String")}} como {{jsxref("Symbol")}} son copiadas.</p>
+
+<p>En caso de un error, por ejemplo si una propiedad es de solo lectura, se lanza un {{jsxref("TypeError")}}, y el objeto destino se mantendrá sin cambios.</p>
+
+<p>Note que <code>Object.assign()</code> no lanza excepciones al encontrar en las fuentes propiedades {{jsxref("null")}} o {{jsxref("undefined")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Clonando_un_objeto">Clonando un objeto</h3>
+
+<pre class="brush: js">var obj = { a: 1 };
+var copy = Object.assign({}, obj);
+console.log(copy); // { a: 1 }
+</pre>
+
+<h3 id="Advertencia_para_clonado_profundo">Advertencia para clonado profundo</h3>
+
+<p>Para un clonado profundo, necesitamos usar otra alternativa ya que <code>Object.assign()</code> copia valores de propiedades. Si el valor en la fuente es una referencia a un objeto, solo se copia la referencia en sí, como valor de la propiedad.</p>
+
+<pre class="brush: js">function test() {
+  'use strict';
+
+  let obj1 = { a: 0 , b: { c: 0}};
+  let obj2 = Object.assign({}, obj1);
+  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
+
+  obj1.a = 1;
+  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
+  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
+
+  obj2.a = 2;
+  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
+  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}
+
+  obj2.b.c = 3;
+  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
+  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}}
+
+  // Deep Clone
+  obj1 = { a: 0 , b: { c: 0}};
+  let obj3 = JSON.parse(JSON.stringify(obj1));
+  obj1.a = 4;
+  obj1.b.c = 4;
+  console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}
+}
+
+test();</pre>
+
+<h3 id="Fusionando_objetos">Fusionando objetos</h3>
+
+<pre class="brush: js">var o1 = { a: 1 };
+var o2 = { b: 2 };
+var o3 = { c: 3 };
+
+var obj = Object.assign(o1, o2, o3);
+console.log(obj); // { a: 1, b: 2, c: 3 }
+console.log(o1);  // { a: 1, b: 2, c: 3 }, target object itself is changed.</pre>
+
+<h3 id="Fusionando_objetos_con_las_mismas_propiedades">Fusionando objetos con las mismas propiedades</h3>
+
+<pre class="brush: js">var o1 = { a: 1, b: 1, c: 1 };
+var o2 = { b: 2, c: 2 };
+var o3 = { c: 3 };
+
+var obj = Object.assign({}, o1, o2, o3);
+console.log(obj); // { a: 1, b: 2, c: 3 }</pre>
+
+<p>Las propiedades también son sobreescritas por otros objetos que aparecen posteriormente en la lista de parámetros y que tienen propiedades con el mismo nombre.</p>
+
+<h3 id="Copiando_propiedades_de_tipo_símbolo">Copiando propiedades de tipo símbolo</h3>
+
+<pre class="brush: js">var o1 = { a: 1 };
+var o2 = { [Symbol('foo')]: 2 };
+
+var obj = Object.assign({}, o1, o2);
+console.log(obj); // { a : 1, [Symbol("foo")]: 2 } (cf. bug 1207182 on Firefox)
+Object.getOwnPropertySymbols(obj); // [Symbol(foo)]
+</pre>
+
+<h3 id="Las_propiedades_heredadas_y_las_no_enumerables_no_pueden_ser_copiadas">Las propiedades heredadas y las no enumerables no pueden ser copiadas</h3>
+
+<pre class="brush: js">var obj = Object.create({ foo: 1 }, { // foo es una propiedad heredada.
+  bar: {
+    value: 2  // bar es una propiedad no enumerable.
+  },
+  baz: {
+    value: 3,
+    enumerable: true  // baz es una propiedad propia enumerable.
+  }
+});
+
+var copy = Object.assign({}, obj);
+console.log(copy); // { baz: 3 }
+</pre>
+
+<h3 id="Los_tipos_primitivos_serán_encapsulados_en_objetos">Los tipos primitivos serán encapsulados en objetos</h3>
+
+<pre class="brush: js">var v1 = 'abc';
+var v2 = true;
+var v3 = 10;
+var v4 = Symbol('foo')
+
+var obj = Object.assign({}, v1, null, v2, undefined, v3, v4);
+// Los tipos primitivos son encapsulados en objetos y se ignoran las propiedades con valor null o undefined.
+// Nótese que sólo los wrappers de cadenas tienen propiedades enumerables:
+console.log(obj); // { "0": "a", "1": "b", "2": "c" }
+</pre>
+
+<h3 id="Las_excepciones_interrumpen_la_tarea_de_copiado">Las excepciones interrumpen la tarea de copiado</h3>
+
+<pre class="brush: js">var target = Object.defineProperty({}, 'foo', {
+  value: 1,
+  writeable: false
+}); // target.foo es una propiedad de sólo lectura
+
+Object.assign(target, { bar: 2 }, { foo2: 3, foo: 3, foo3: 3 }, { baz: 4 });
+// TypeError: "foo" es de sólo lectura
+// La excepción se lanza cuando se intenta asignar un valor a target.foo
+
+console.log(target.bar);  // 2, la primera fuente fue copiada.
+console.log(target.foo2); // 3, la primera propiedad del segundo objeto fuente se copió correctamente.
+console.log(target.foo);  // 1, se lanza la excepción.
+console.log(target.foo3); // undefined, el método assign ha finalizado, no se copiará foo3.
+console.log(target.baz);  // undefined, tampoco se copiará el tercer objecto fuente.
+</pre>
+
+<h3 id="Copiando_métodos_de_acceso">Copiando métodos de acceso</h3>
+
+<pre class="brush: js">var obj = {
+  foo: 1,
+  get bar() {
+    return 2;
+  }
+};
+
+var copy = Object.assign({}, obj);
+console.log(copy);
+// { foo: 1, bar: 2 }, the value of copy.bar is obj.bar's getter's return value.
+
+// This is an assign function that copies full descriptors
+function completeAssign(target, ...sources) {
+  sources.forEach(source =&gt; {
+    let descriptors = Object.keys(source).reduce((descriptors, key) =&gt; {
+      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
+      return descriptors;
+    }, {});
+    // by default, Object.assign copies enumerable Symbols too
+    Object.getOwnPropertySymbols(source).forEach(sym =&gt; {
+      let descriptor = Object.getOwnPropertyDescriptor(source, sym);
+      if (descriptor.enumerable) {
+        descriptors[sym] = descriptor;
+      }
+    });
+    Object.defineProperties(target, descriptors);
+  });
+  return target;
+}
+
+var copy = completeAssign({}, obj);
+console.log(copy);
+// { foo:1, get bar() { return 2 } }
+</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<p>Este {{Glossary("Polyfill","polyfill")}} no soporta propiedades símbolo, ya que ES5 no tiene símbolos.</p>
+
+<pre class="brush: js">if (typeof Object.assign != 'function') {
+  // Must be writable: true, enumerable: false, configurable: true
+  Object.defineProperty(Object, "assign", {
+    value: function assign(target, varArgs) { // .length of function is 2
+      'use strict';
+      if (target == null) { // TypeError if undefined or null
+        throw new TypeError('Cannot convert undefined or null to object');
+      }
+
+      var to = Object(target);
+
+      for (var index = 1; index &lt; arguments.length; index++) {
+        var nextSource = arguments[index];
+
+        if (nextSource != null) { // Skip over if undefined or null
+          for (var nextKey in nextSource) {
+            // Avoid bugs when hasOwnProperty is shadowed
+            if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) {
+              to[nextKey] = nextSource[nextKey];
+            }
+          }
+        }
+      }
+      return to;
+    },
+    writable: true,
+    configurable: true
+  });
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-object.assign', 'Object.assign')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.assign', 'Object.assign')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<p>{{Compat("javascript.builtins.Object.assign")}}</p>
+</div>
+
+<h2 id="Ver_también" name="Ver también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.defineProperties()")}}</li>
+ <li><a href="/es/docs/Web/JavaScript/enumeracion_y_propietario_de_propiedades">Enumeración y propietarios de propiedades</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/Sintaxis_Spread#Spread_en_literales_tipo_Objeto">Spread en literales tipo Objeto</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/constructor/index.html b/files/es/web/javascript/reference/global_objects/object/constructor/index.html
new file mode 100644
index 0000000000..3388078b3d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/constructor/index.html
@@ -0,0 +1,162 @@
+---
+title: Object.prototype.constructor
+slug: Web/JavaScript/Reference/Global_Objects/Object/constructor
+tags:
+  - JavaScript
+  - Object
+  - Property
+  - Prototype
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/constructor
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/constructor
+---
+<div>{{JSRef("Objetos_globales", "Object")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>Retorna una referencia a la función del {{jsxref("Object")}} que creó el objeto de la instancia. Note que el valor de esta propiedad es una referencia a la función misma, no a un string conteniendo el nombre de la función. El valor es sólo de lectura para valores primitivos tales como 1, true y 'test'.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Todos los objetos tienen una propiedad <code>constructor.</code> Los objetos creados sin explicitar el uso de una función (como son los objetos y las cadenas literales) tendrán una propiedad de <code>constructor</code> que apunta al tipo de constructor del Objeto Fundamento para ese objeto.</p>
+
+<pre class="brush:js">var o = {};
+o.constructor === Object; // true
+
+var a = [];
+a.constructor === Array; // true
+
+var n = new Number(3);
+n.constructor === Number; // true</pre>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Displaying_the_constructor_of_an_object" name="Example:_Displaying_the_constructor_of_an_object">Ejemplo: Mostrando el constructor de un objeto.</h3>
+
+<p>El siguiente ejemplo crea un prototipo, <code>Tree</code>, y un objeto de este tipo, <code>theTree</code>. El ejemplo muestra entonces la propiedad <code>constructor</code> para el objeto <code>theTree</code>.</p>
+
+<pre class="brush:js">function Tree (name) {
+   this.name = name;
+}
+
+var theTree = new Tree( "Redwood" );
+console.log( "theTree.constructor is " + theTree.constructor );</pre>
+
+<p>Este ejemplo muestra la siguiente salida:</p>
+
+<pre class="brush:js">theTree.constructor is function Tree (name) {
+    this.name = name;
+}</pre>
+
+<h3 id="Example:_Changing_the_constructor_of_an_object" name="Example:_Changing_the_constructor_of_an_object">Ejemplo: Cambiando el constructor de un objeto.</h3>
+
+<p>El siguiente ejemplo demuestra como modificar el valor del constructor de objetos genéricos. Solo <code>true</code>, <code>1</code> y <code>"test"</code> no serán afectados ya que ellos tienen constructores nativos de solo lectura. Este ejemplo demuestra que no siempre es seguro confiar en la propiedad constructor de un objeto.</p>
+
+<pre class="brush:js">function Type () {}
+
+var types = [
+    new Array(),
+    [],
+    new Boolean(),
+    true,             // no cambia
+<span style="line-height: normal;">    </span>new Date(),
+<span style="line-height: normal;">    </span>new Error(),
+<span style="line-height: normal;">    </span>new Function(),
+    function () {},
+<span style="line-height: normal;">    </span>Math,
+<span style="line-height: normal;">    </span>new Number(),
+    1,                // no cambia
+<span style="line-height: normal;">    </span>new Object(),
+    {},
+<span style="line-height: normal;">    </span>new RegExp(),
+    /(?:)/,
+<span style="line-height: normal;">    </span>new String(),
+    "test"            // no cambia
+];
+
+for( var i = 0; i &lt; types.length; i++ ) {
+    types[i].constructor = Type;
+    types[i] = [ types[i].constructor, types[i] instanceof Type, types[i].toString() ];
+}
+
+console.log( types.join( "\n" ) );</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1ra. Edición. Implementado en JavaScript 1.1</td>
+   <td>Estandar.</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.4.1', 'Objectprototype.constructor')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.prototype.constructor', 'Object.prototype.constructor')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p> </p>
diff --git a/files/es/web/javascript/reference/global_objects/object/create/index.html b/files/es/web/javascript/reference/global_objects/object/create/index.html
new file mode 100644
index 0000000000..b64c45e970
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/create/index.html
@@ -0,0 +1,378 @@
+---
+title: Object.create()
+slug: Web/JavaScript/Reference/Global_Objects/Object/create
+tags:
+  - ECMAScript5
+  - JavaScript
+  - 'Null'
+  - Objeto
+  - Referencia
+  - metodo
+  - polyfill
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/create
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/create
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.create()</strong></code> crea un objeto nuevo, utilizando un objeto existente como el prototipo del nuevo objeto creado.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/object-create.html")}}</div>
+
+<div></div>
+
+<div>La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción (pull request).</div>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">Object.create(<var>proto</var>[, <var>propertiesObject</var>])</pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><em>proto</em></dt>
+ <dd>Objeto el cual debe ser el prototipo del nuevo objeto creado.</dd>
+ <dt><em>propertiesObject</em></dt>
+ <dd>Opcional. Si se especifica y no es {{jsxref("undefined")}}, un objeto cuyas propiedades enumerables propias (es decir, aquellas propiedades definidas sobre si mismo y <em>no</em> son propiedades enumerable a lo largo de su cadena de prototipos) espefica descriptores de propiedad para ser agregadas al objeto recien creado, con los nombres de propiedad correspondiente. Estas propiedades corresponden al segundo argumento de {{jsxref("Object.defineProperties")}}.</dd>
+</dl>
+
+<h3 id="Description" name="Description">Valor devuelto</h3>
+
+<p>Un nuevo objeto con el prototipo y propiedades del objeto especificado.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<p>Una excepción {{jsxref("TypeError")}} si el parámetro <code>propertiesObject</code> es {{jsxref("null")}} o un objeto envolvente no primitivo.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Herencia_clásica_con_Object.create">Herencia clásica con <code>Object.create()</code></h3>
+
+<p>Debajo se encuentra un ejemplo de cómo usar <code>Object.create()</code> para lograr herencia clásica. Este es para herencia simple, la cual es todo lo que soporta JavaScript.</p>
+
+<pre class="brush: js notranslate">// Shape - superclase
+function Shape() {
+  this.x = 0;
+  this.y = 0;
+}
+
+// método de la superclase
+Shape.prototype.move = function(x, y) {
+    this.x += x;
+    this.y += y;
+    console.info("Shape moved.");
+};
+
+// Rectangle - subclase
+function Rectangle() {
+  Shape.call(this); // llama al contructor de la superclase.
+}
+
+// subclase extiende superclase
+Rectangle.prototype = Object.create(Shape.prototype);
+Rectangle.prototype.constructor = Rectangle;
+
+var rect = new Rectangle();
+
+console.log('¿Es rect una instancia de Rectangle?',
+  rect instanceof Rectangle); // true
+console.log('¿Es rect una instancia de Shape?',
+  rect instanceof Shape); // true
+rect.move(1, 1); // Imprime, 'Shape moved.'
+</pre>
+
+<p>Si desea heredar desde múltiples objetos, entonces los mixins son una posibilidad.</p>
+
+<pre class="brush: js notranslate">function MyClass() {
+  SuperClass.call(this);
+  OtherSuperClass.call(this);
+}
+
+// inherit one class
+MyClass.prototype = Object.create(SuperClass.prototype);
+// mixin another
+Object.assign(MyClass.prototype, OtherSuperClass.prototype);
+// re-assign constructor
+MyClass.prototype.constructor = MyClass;
+
+MyClass.prototype.myMethod = function() {
+  // do something
+};
+</pre>
+
+<p>{{jsxref("Object.assign()")}} copia las propiedades del prototipo <em>OtherSuperClass</em> al prototipo de <em>MyClass</em>, haciéndolas disponibles en todas las instancias de <em>MyClass</em>. <code>Object.assign()</code> se introdujo con ES2015 y <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/assign#Polyfill">tiene polyfill</a>. Si el soporte para navegadores antiguos es necesario, se puede utilizar <code><a href="https://api.jquery.com/jQuery.extend/">jQuery.extend()</a></code> o <code><a href="https://lodash.com/docs/#assign">_.assign()</a></code>.</p>
+
+<h3 id="Usando_el_argumento_propertiesObject_con_Object.create">Usando el argumento <code>propertiesObject</code> con <code>Object.create()</code></h3>
+
+<pre class="brush: js notranslate">var o;
+
+// crea un objeto con un prototipo como null
+o = Object.create(null);
+
+
+o = {};
+// esto equivale a:
+o = Object.create(Object.prototype);
+
+
+// Ejemplo en donde creamos un objeto con un par de propiedades de ejemplo.
+// (Note que el segundo parámetro mapea claves para los *descriptores de propiedad*.)
+o = Object.create(Object.prototype, {
+  // foo es un habitual "propiedad de valor"
+  foo: { writable:true, configurable:true, value: "hello" },
+  // bar es una propiedad getter-and-setter (de acceso)
+  bar: {
+    configurable: false,
+    get: function() { return 10 },
+    set: function(value) { console.log("Setting `o.bar` to", value) }
+}});
+
+
+function Constructor(){}
+o = new Constructor();
+// es equivalente a:
+o = Object.create(Constructor.prototype);
+// Por supuesto, si hay un código de inicialización en la
+// función Constructor, el Object.create no puede reflejar esta.
+
+
+// crear un nuevo objeto cuyo prototipo es un nuevo, objeto vacío
+// y agregar una única propiedad 'p', con el valor 42
+o = Object.create({}, { p: { value: 42 } })
+
+// por defecto las propiedades NO SON editables, enumerables o configurables:
+o.p = 24
+o.p
+// 42
+
+o.q = 12
+for (var prop in o) {
+   console.log(prop)
+}
+// "q"
+
+delete o.p
+// false
+
+// <span style="font-size: 1rem;">para especificar una propiedad en ES3</span>
+
+o2 = Object.create({}, { p: {
+      value: 42,
+      writable: true,
+      enumerable: true,
+      configurable: true }
+});
+</pre>
+
+<h2 id="Objetos_personalizados_y_nulos">Objetos personalizados y nulos</h2>
+
+<p>Un objeto nuevo creado de un objeto completamente personalizado (especialmente uno creado de un objeto nulo, que es básicamente un objeto personalizado sin miembros) puede comportarse de manera inesperada. Esto es especialmente cierto cuando se depura, ya que las funciones comunes  de conversión/detección de propiedad de objeto pueden generar errores, o simplemente perder información (especialmente si se atrapan excepciones de manera silenciosa que ignoran los errores). Por ejemplo, aquí hay dos objetos:</p>
+
+<pre class="brush: js notranslate">oco = Object.create( {} );   // Crea un objeto normal
+ocn = Object.create( null ); // Crea un objeto "null"
+
+&gt; console.log(oco) // {} -- Parece normal
+&gt; console.log(ocn) // {} -- Parece normal aquí también, hasta este momento
+
+oco.p = 1; // Crea una propiedad simple en un objeto normal
+ocn.p = 0; // Crea una propiedad simple en un objeto "null"
+
+&gt; console.log(oco) // {p: 1} -- Todavía parece normal
+&gt; console.log(ocn) // {p: 0} --Todavía parece normal aquí también. PERO ESPERA...
+</pre>
+
+<p>Como se muestra arriba, todo parece normal hasta ahora. Sin embargo, al intentar usar estos objetos, sus diferencias se hacen evidentes rápidamente:</p>
+
+<pre class="brush: js notranslate">&gt; "oco is: " + oco // Muestra "ocn is: [object Object]"
+
+&gt; "ocn is: " + ocn // Arroja error: Cannot convert object to primitive value
+</pre>
+
+<p>Probar solo algunas de las funciones incorporadas más básicas muestra la magnitud del problema más claramente:</p>
+
+<pre class="brush: js notranslate">&gt; alert(oco) // Muestra: [object Object]
+&gt; alert(ocn) // Arroja error: Cannot convert object to primitive value
+
+&gt; oco.toString() // Muestra [object Object]
+&gt; ocn.toString() // Arroja error: ocn.toString is not a function
+
+&gt; oco.valueOf() // Muestra{}
+&gt; ocn.valueOf() // Arroja error: ocn.valueOf is not a function
+
+&gt; oco.hasOwnProperty("p") // Muestra "true"
+&gt; ocn.hasOwnProperty("p") // Arroja error: ocn.hasOwnProperty is not a function
+
+&gt; oco.constructor // Muestra "Object() { [native code] }"
+&gt; ocn.constructor // Muestra "undefined"
+</pre>
+
+<p>Como se dijo, estas diferencias pueden hacer que la depuración e incluso problemas aparentemente simples se pierdan rápidamente. Por ejemplo:</p>
+
+<p><em>Una función simple de depuración:</em></p>
+
+<pre class="brush: js notranslate">// mostrar nombre de propiedad de nivel superior: pares de valores de un objeto dado
+function ShowProperties( b ){
+  for( var i in b ){  console.log( i + ": " + b[i] + "\n" )  }
+}</pre>
+
+<p><em>Resultados no tan simples: (especialmente si la captura silenciosa de errores había ocultado los mensajes de error)</em></p>
+
+<pre class="brush: js notranslate">ob={}; ob.po=oco; ob.pn=ocn; // crear un objeto compuesto usando los objetos de prueba de arriba como valores de propiedad
+
+&gt; ShowProperties( ob ) // Muestra propiedades de nivel superior
+- po: [object Object]
+- Error: Cannot convert object to primitive value
+
+Tenga en cuenta que solo se muestra la primera propiedad.
+</pre>
+
+<p><em>(Pero si se crea el mismo objeto simplemente en un orden diferente, al menos en algunas implementaciones ...)</em></p>
+
+<pre class="brush: js notranslate">ob={}; ob.pn=ocn; ob.po=oco; // cree el mismo objeto compuesto nuevamente, pero cree las mismas propiedades en un orden diferente
+
+&gt; ShowProperties( ob ) // Muestra propiedades de nivel superior
+- Error: Cannot convert object to primitive value
+
+Tenga en cuenta que ninguna propiedad se muestra.</pre>
+
+<p>Tenga en cuenta que un orden tan diferente puede surgir estáticamente a través de codificaciones fijas dispares, como aquí, pero también dinámicamente a través del orden en que se ejecutan dichas ramas de código de adición de propiedades en tiempo de ejecución, ya que depende de entradas y / o variables aleatorias. Por otra parte, el orden de iteración real no está garantizado, independientemente de cómo son agregados los miembros.</p>
+
+<h4 id="Algunas_NO-soluciones">Algunas NO-soluciones</h4>
+
+<p>A good solution for the missing object-methods is not immediately apparent.</p>
+
+<p>Adding the missing object-method directly from the standard-object does NOT work:</p>
+
+<pre class="brush: js notranslate">ocn = Object.create( null ); // create "null" object (same as before)
+
+ocn.toString = Object.toString; // since new object lacks method then try assigning it directly from standard-object
+
+<span style="">&gt; ocn.toString // shows "toString() { [native code] }" -- missing method seems to be there now</span>
+&gt; ocn.toString == Object.toString // shows "true" -- method seems to be same as the standard object-method
+
+&gt; ocn.toString() // error: Function.prototype.toString requires that 'this' be a Function
+</pre>
+
+<p><br>
+ Adding the missing object-method directly to new object's "prototype" does not work either, since new object does not have a real prototype (which is really the cause of ALL these problems) and one cannot be <strong>directly</strong> added:</p>
+
+<pre class="brush: js notranslate">ocn = Object.create( null ); // create "null" object (same as before)
+
+ocn.prototype.toString = Object.toString; // Error: Cannot set property 'toString' of undefined
+
+ocn.prototype = {};                       // try to create a prototype
+ocn.prototype.toString = Object.toString; // since new object lacks method then try assigning it from standard-object  <span style="">
+
+&gt; ocn.toString() // error: ocn.toString is not a function</span>
+</pre>
+
+<p><br>
+ Adding the missing object-method by using the standard-object<strong> </strong>as new object's prototype does not work either:</p>
+
+<pre class="brush: js notranslate">ocn = Object.create( null );        // create "null" object (same as before)
+Object.setPrototypeOf(ocn, Object); // set new object's prototype to the standard-object
+
+&gt; ocn.toString() // error: Function.prototype.toString requires that 'this' be a Function
+</pre>
+
+<h4 id="Algunas_soluciones_aceptables">Algunas soluciones aceptables</h4>
+
+<p>Again, adding the missing object-method directly from the <strong>standard-object </strong>does NOT work. However, adding the <strong>generic</strong> method directly, DOES:</p>
+
+<pre class="brush: js notranslate">ocn = Object.create( null ); // create "null" object (same as before)
+
+ocn.toString = toString; // since new object lacks method then assign it directly from generic version
+
+&gt; ocn.toString() // shows "[object Object]"
+&gt; "ocn is: " + ocn // shows "ocn is: [object Object]"
+
+
+ob={}; ob.pn=ocn; ob.po=oco; // create a compound object (same as before)
+
+&gt; ShowProperties(ob) // display top-level properties
+- po: [object Object]
+- pn: [object Object]
+</pre>
+
+<p>However, setting the generic <strong>prototype</strong> as the new object's prototype works even better:</p>
+
+<pre class="brush: js notranslate">ocn = Object.create( null );                  // create "null" object (same as before)
+Object.setPrototypeOf(ocn, Object.prototype); // set new object's prototype to the "generic" object (NOT standard-object)
+</pre>
+
+<p><em>(In addition to all the string-related functions shown above, this also adds:)</em></p>
+
+<pre class="brush: js notranslate">&gt; ocn.valueOf() // shows {}
+&gt; ocn.hasOwnProperty("x") // shows "false"
+&gt; ocn.constructor // shows "Object() { [native code] }"
+
+// ...and all the rest of the properties and methods of Object.prototype.
+</pre>
+
+<p>As shown, objects modified this way now look very much like ordinary objects.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este polyfill cubre el caso de uso principal  el cual es la creación de un nuevo objeto para el prototipo que ha sido escogido pero no toma el segundo argumento en cuenta.</p>
+
+<p>Note that while the setting of <code>null</code> as <code>[[Prototype]]</code> is supported in the real ES5 <code>Object.create</code>, this polyfill cannot support it due to a limitation inherent in versions of ECMAScript lower than 5.</p>
+
+<pre class="brush: js notranslate"> if (typeof Object.create !== "function") {
+    Object.create = function (proto, propertiesObject) {
+        if (typeof proto !== 'object' &amp;&amp; typeof proto !== 'function') {
+            throw new TypeError('Object prototype may only be an Object: ' + proto);
+        } else if (proto === null) {
+            throw new Error("This browser's implementation of Object.create is a shim and doesn't support 'null' as the first argument.");
+        }
+
+        if (typeof propertiesObject != 'undefined') {
+            throw new Error("This browser's implementation of Object.create is a shim and doesn't support a second argument.");
+        }
+
+        function F() {}
+        F.prototype = proto;
+
+        return new F();
+    };
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.5', 'Object.create')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.8.5</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.create', 'Object.create')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.create', 'Object.create')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Object.create")}}</div>
+
+<h2 id="Ver_tambien" name="Ver_tambien">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.defineProperty")}}</li>
+ <li>{{jsxref("Object.defineProperties")}}</li>
+ <li>{{jsxref("Object.prototype.isPrototypeOf")}}</li>
+ <li>{{jsxref("Reflect.construct()")}}</li>
+ <li>Publicación de John Resig sobre <a class="external" href="http://ejohn.org/blog/objectgetprototypeof/" title="http://ejohn.org/blog/objectgetprototypeof/">getPrototypeOf()</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/defineproperties/index.html b/files/es/web/javascript/reference/global_objects/object/defineproperties/index.html
new file mode 100644
index 0000000000..3758d4cbfc
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/defineproperties/index.html
@@ -0,0 +1,195 @@
+---
+title: Object.defineProperties()
+slug: Web/JavaScript/Reference/Global_Objects/Object/defineProperties
+tags:
+  - ECMAScript5
+  - JavaScript
+  - JavaScript 1.8.5
+  - Método(2)
+  - Objeto
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/defineProperties
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/defineProperties
+---
+<div>{{JSRef("Objetos_globales", "Object")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>El metodo <strong><code>Object.defineProperties()</code></strong> define nuevas o modifica propiedades existentes directamente en el objeto, retornando el objeto.</p>
+
+<h2 id="Syntax" name="Syntax">Sintáxis</h2>
+
+<pre class="syntaxbox"><code>Object.defineProperties(<em>obj</em>, <em>propiedades</em>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt>obj</dt>
+ <dd>El objeto sobre el cual se crearán o modificaran sus propiedades.</dd>
+ <dt>propiedades</dt>
+ <dd>Un objeto cuyas propiedades enumerables propias consituyen descriptores para las propiedades a ser definidas o modificadas.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p><code>Object.defineProperties</code>, en escencia, define todas las propiedades correspondientes a las propiedades propias con capacidad de enumeración de <code>props</code> en el objeto <code>objrops.</code></p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: js">Object.defineProperties(obj, {
+  "property1": {
+    value: true,
+    writable: true
+  },
+  "property2": {
+    value: "Hello",
+    writable: false
+  }
+  // etc. etc.
+});</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Asumiendo una ejecución pristina del entorno con todos los nombres y propiedades referidas a sus valores iniciales, <code>Object.defineProperties</code> es casi completamente equivalente (note el comentario en <code>isCallable</code>) a la siguiente reimplementación de JavaScript:</p>
+
+<pre class="brush: js;highlight:[8]">function defineProperties(obj, properties) {
+  function convertToDescriptor(desc) {
+    function hasProperty(obj, prop) {
+      return Object.prototype.hasOwnProperty.call(obj, prop);
+    }
+
+    function isCallable(v) {
+      // NB: modify as necessary if other values than functions are callable.
+      return typeof v === "function";
+    }
+
+    if (typeof desc !== "object" || desc === null)
+      throw new TypeError("bad desc");
+
+    var d = {};
+
+    if (hasProperty(desc, "enumerable"))
+      d.enumerable = !!obj.enumerable;
+    if (hasProperty(desc, "configurable"))
+      d.configurable = !!obj.configurable;
+    if (hasProperty(desc, "value"))
+      d.value = obj.value;
+    if (hasProperty(desc, "writable"))
+      d.writable = !!desc.writable;
+    if ( hasProperty(desc, "get") ) {
+      var g = desc.get;
+
+      if (!isCallable(g) &amp;&amp; g !== "undefined")
+        throw new TypeError("bad get");
+      d.get = g;
+    }
+    if ( hasProperty(desc, "set") ) {
+      var s = desc.set;
+      if (!isCallable(s) &amp;&amp; s !== "undefined")
+        throw new TypeError("bad set");
+      d.set = s;
+    }
+
+    if (("get" in d || "set" in d) &amp;&amp; ("value" in d || "writable" in d))
+      throw new TypeError("identity-confused descriptor");
+
+    return d;
+  }
+
+  if (typeof obj !== "object" || obj === null)
+    throw new TypeError("bad obj");
+
+  properties = Object(properties);
+
+  var keys = Object.keys(properties);
+  var descs = [];
+
+  for (var i = 0; i &lt; keys.length; i++)
+    descs.push([keys[i], convertToDescriptor(properties[keys[i]])]);
+
+  for (var i = 0; i &lt; descs.length; i++)
+    Object.defineProperty(obj, descs[i][0], descs[i][1]);
+
+  return obj;
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.7', 'Object.defineProperties')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.8.5</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.defineproperties', 'Object.defineProperties')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
+
+<p>Basado en <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat tables</a>.</p>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatGeckoDesktop("2")}}</td>
+   <td>5 (previous versions untested)</td>
+   <td>9</td>
+   <td>11.60</td>
+   <td>5</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatGeckoMobile("2")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>11.50</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+ <li>{{jsxref("Object.keys()")}}</li>
+ <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties" title="Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/defineproperty/index.html b/files/es/web/javascript/reference/global_objects/object/defineproperty/index.html
new file mode 100644
index 0000000000..7d7051764f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/defineproperty/index.html
@@ -0,0 +1,420 @@
+---
+title: Object.defineProperty()
+slug: Web/JavaScript/Reference/Global_Objects/Object/defineProperty
+tags:
+  - ECMAScript5
+  - JavaScript
+  - JavaScript 1.8.5
+  - Método(2)
+  - Objeto
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/defineProperty
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/defineProperty
+---
+<div>{{JSRef("Global_Objects", "Object")}}</div>
+
+<h2 id="summary" name="summary">Resumen</h2>
+
+<p>El  método estático <code><strong>Object.defineProperty()</strong></code> define una nueva propiedad sobre un objeto, o modifica una ya existente, y devuelve el objeto modificado.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Ud. puede llamar a este método directamente mediante el constructor {{jsxref("Object")}} en vez de crear una instancia del tipo <code>Object</code>.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Object.defineProperty(<var>obj</var>, <var>prop</var>, <var>descriptor</var>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto sobre el cual se define la propiedad.</dd>
+ <dt><code>prop</code></dt>
+ <dd>El nombre de la propiedad a ser definida o modificada.</dd>
+ <dt><code>descriptor</code></dt>
+ <dd>El descriptor de la propiedad que está siendo definida o modificada.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Este método permite añadir o modificar una propiedad en un objeto.</p>
+
+<p>La adición normal de una propiedad a través de la asignación crea propiedades que aparecen durante la enumeración de propiedades en el bucle ({{jsxref("Sentencias/for...in", "for...in")}} o el método {{jsxref("Object.keys")}}), cuyos valores pueden modificarse y pudiendo incluso eliminar la propiedad del objeto mediante el método {{jsxref("Operadores/delete", "delete")}}.</p>
+
+<p>Este método nos permite modificar el comportamiento por defecto de las propiedades. Es decir, nos permite definir una propiedad como no enumerable, no modificable o incluso evitar que pueda ser eliminada del objeto.</p>
+
+<p>Existen dos tipos de descriptores: De datos y de acceso.  Un <em><dfn>descriptor de datos</dfn></em> define una propiedad que tiene un valor, el cual puede ser o no modificado. Un descriptor de acceso define una propiedad mediante un par de funciones getter-setter que describe como se obtiene o se modifica el contenido de dicha propiedad. Un descriptor debe de ser de uno de estos dos tipos; no puede ser ambos.</p>
+
+<p>Ambos tipos de descriptores son objetos y comparten las siguientes claves opcionales:</p>
+
+<dl>
+ <dt><code>configurable</code></dt>
+ <dd><code>true</code> si y solo si el tipo de descriptor de propiedad puede modificarse y si la propiedad puede ser eliminada del correspondiente objeto.<br>
+ <strong>Por defecto es <code>false</code>.</strong></dd>
+ <dt><code>enumerable</code></dt>
+ <dd><code>true</code> si y solo si dicha propiedad se muestra durante la enumeración de las propiedades del objeto correspondiente.<br>
+ <strong>Por defecto es <code>false</code>.</strong></dd>
+</dl>
+
+<p>Un descriptor de datos tiene además las siguientes claves opcionales:</p>
+
+<dl>
+ <dt><code>value</code></dt>
+ <dd>El valor asociado a la propiedad. Puede ser cualquier tipo valido de JavaScript  (number, object, function, etc).<br>
+ <strong>Por defecto es {{jsxref("Objetos_Globales/undefined", "undefined")}}.</strong></dd>
+ <dt><code>writable</code></dt>
+ <dd><code>true</code> Indica si el valor de la propiedad puede modificarse con el  {{jsxref("Operators/Assignment_Operators", "operador de asignación", "", 1)}}.<br>
+ <strong>Defaults to <code>false</code>.</strong></dd>
+</dl>
+
+<p>Un descriptor de acceso además tiene las siguientes claves opcionales:</p>
+
+<dl>
+ <dt><code>get</code></dt>
+ <dd>Una función cuyo valor retornado será el que se use como valor de la propiedad.<br>
+ <strong>Defaults to {{jsxref("Objetos_Globales/undefined", "undefined")}}.</strong></dd>
+ <dt><code>set</code></dt>
+ <dd>Una función que recibe como único argumento el nuevo valor que se desea asignar a la propiedad y que devuelve el valor que se almacenará finalmente en el objeto.<br>
+ <strong>Defaults to {{jsxref("Objetos_Globales/undefined", "undefined")}}.</strong></dd>
+</dl>
+
+<p>Hay que tener en cuenta que estas opciones también pueden heredarse; es decir, las opciones de la propiedad se han podido establecer en el prototipo de una clase de la que hereda el objeto. De modo que si queremos asegurarnos unos valores por defecto tenemos tres opciones: fijar el {{jsxref("Object.prototype")}} con {{jsxref("Object.freeze")}}, definir todas las opciones explicitamente, o establecer a {{jsxref("Objetos_Globales/null", "null")}} la propiedad {{jsxref("Object.prototype.__proto__", "__proto__")}}.</p>
+
+<pre class="brush: js">// Usando __proto__
+Object.defineProperty(obj, 'key', {
+  __proto__: null, // no aceptar propiedades heredadas
+  value: 'static'  // no enumerable
+                   // no configurable
+                   // no modificable
+                   // como opciones por defecto
+});
+
+// Definiendo todo explicitamente
+Object.defineProperty(obj, 'key', {
+  enumerable: false,
+  configurable: false,
+  writable: false,
+  value: 'static'
+});
+
+// Reciclando el mismo objeto
+function withValue(value) {
+  var d = withValue.d || (
+    withValue.d = {
+      enumerable: false,
+      writable: false,
+      configurable: false,
+      value: null
+    }
+  );
+  d.value = value;
+  return d;
+}
+// ... y ...
+Object.defineProperty(obj, 'key', withValue('static'));
+
+// Si está disponible freeze, previene añadir o eliminar
+//del prototipo del objeto las propiedades
+// (value, get, set, enumerable, writable, configurable)
+(Object.freeze || Object)(Object.prototype);
+</pre>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<p>Si quiere ver algunos ejemplos de utilización del método <code>Object.defineProperty</code> con una sintaxis tipo <em>binary-flags</em>, vea <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty/Additional_examples">ejemplos adicionales</a>.</p>
+
+<h3 id="Example:_Creating_a_property" name="Example:_Creating_a_property">Ejemplo: Creando una propiedad</h3>
+
+<p>Cuando la propiedad especificada no existe en el objeto<code>, Object.defineProperty()</code> crea una nueva. En el descriptor pueden omitirse campos, a los cuales se les asignará el valor por defecto. A todos los que sean de tipo Booleano se les asignará el valor falso. Los campos <code>value</code>, <code>get</code> y <code>set</code> se establecerán por defecto a {{jsxref("Objetos_Globales/undefined", "undefined")}}. Una propiedad definida sin indicar  <code>get</code>/<code>set</code>/<code>value</code>/<code>writable</code> es denominada “genérica” y  “tipificada” como un descriptor de datos.</p>
+
+<pre class="brush: js">var o = {}; // Creates a new object
+
+// Example of an object property added with defineProperty with a data property descriptor
+Object.defineProperty(o, 'a', {
+  value: 37,
+  writable: true,
+  enumerable: true,
+  configurable: true
+});
+// 'a' property exists in the o object and its value is 37
+
+// Example of an object property added with defineProperty with an accessor property descriptor
+var bValue = 38;
+Object.defineProperty(o, 'b', {
+  get: function() { return bValue; },
+  set: function(newValue) { bValue = newValue; },
+  enumerable: true,
+  configurable: true
+});
+o.b; // 38
+// 'b' property exists in the o object and its value is 38
+// The value of o.b is now always identical to bValue, unless o.b is redefined
+
+// You cannot try to mix both:
+Object.defineProperty(o, 'conflict', {
+  value: 0x9f91102,
+  get: function() { return 0xdeadbeef; }
+});
+// throws a TypeError: value appears only in data descriptors, get appears only in accessor descriptors
+</pre>
+
+<h3 id="Example:_Modifying_a_property" name="Example:_Modifying_a_property">Ejemplo: Modificando una propiedad</h3>
+
+<p>Cuando la propiedad realmente existe, <code>Object.defineProperty()</code> intenta modificar la propiedad de acuerdo a los valores en la descripción y la configuración actual del objeto. Si la descripción antigüa tenía su atributo de configuración establecido en <code>false</code> (la propiedad se dice "sin capacidad de configuración"), entonces ningún atributo además de los que tienen capacidad de escritura pueden ser cambiados. En ese caso, no es posible cambiar hacía atras o hacía delante entre datos y métodos de acceso de tipos de propiedades.</p>
+
+<p>Si una propiedad no tiene capacidad de configuración, su atributo <code>writabble</code> solo puede ser cambiada to <code>false</code>.</p>
+
+<p>Un {{jsxref("Global_Objects/TypeError", "TypeError")}} es arrojado cuando se intenta cambiar las propiedades de atributos sin capacidad de configuración (adeḿas del atributo <code>writable</code>) a menos que el valor actual y el valor nuevo sean los mismos.</p>
+
+<h4 id="Writable_attribute" name="Writable_attribute">Atributo writable</h4>
+
+<p>Cuando la propiedad de un atributo <code>writable</code> es establecido to <code>false</code>, la propiedad se dice esta "sin capacidad de escritura". No puede ser reasignada.</p>
+
+<pre class="brush: js">var o = {}; // Crea un objeto nuevo
+
+Object.defineProperty(o, 'a', {
+  value: 37,
+  writable: false
+});
+
+console.log(o.a); // logs 37
+o.a = 25; // Ningún error arrojado (lo tiraría en modo estricto, aún si el valor fuera el mismo)
+console.log(o.a); // muestra 37. La asignación no funcionó
+</pre>
+
+<p>Como es visto en el ejemplo anterior, intentar escribir en una propiedad "sin capacidad de  escritura" no la cambia pero sí arroja un error.</p>
+
+<h4 id="Enumerable_attribute" name="Enumerable_attribute">Atributo enumerable</h4>
+
+<p>El atributo de la propiedad <code>enumerable</code> se define si la propiedad aparece en un ciclo {{jsxref("Statements/for...in", "for...in")}} y {{jsxref("Object.keys()")}} o no.</p>
+
+<pre class="brush: js">var o = {};
+Object.defineProperty(o, 'a', { value: 1, enumerable: true });
+Object.defineProperty(o, 'b', { value: 2, enumerable: false });
+Object.defineProperty(o, 'c', { value: 3 }); // enumerable defaults to false
+o.d = 4; // enumerable defaults to true when creating a property by setting it
+
+for (var i in o) {
+  console.log(i);
+}
+// logs 'a' and 'd' (in undefined order)
+
+Object.keys(o); // ['a', 'd']
+
+o.propertyIsEnumerable('a'); // true
+o.propertyIsEnumerable('b'); // false
+o.propertyIsEnumerable('c'); // false
+</pre>
+
+<h4 id="Configurable_attribute" name="Configurable_attribute">Atributo configurable</h4>
+
+<p>El atributo <code>configurable</code> define si la propiedad puede ser eliminada del objeto, y si sus atributos (excepto <code>writable</code>) pueden ser modificados</p>
+
+<pre class="brush: js">var o = {};
+Object.defineProperty(o, 'a', {
+  get: function() { return 1; },
+  configurable: false
+});
+
+Object.defineProperty(o, 'a', { configurable: true }); // arroja TypeError
+Object.defineProperty(o, 'a', { enumerable: true }); //  arroja  TypeError
+Object.defineProperty(o, 'a', { set: function() {} }); //  arroja  TypeError (set estaba definido como undefined)
+Object.defineProperty(o, 'a', { get: function() { return 1; } }); // arroja TypeError (incluso aunque los get hacen lo mismo)
+Object.defineProperty(o, 'a', { value: 12 }); // arroja TypeError
+
+console.log(o.a); // logs 1
+delete o.a; // No hace nada
+console.log(o.a); // logs 1
+</pre>
+
+<p>Si <code>o.a</code> tuviese <code>configurable</code>  a <code>true</code>, no se habrían arrojado errores y la propiedad habría sido eliminada. </p>
+
+<h3 id="Example:_Adding_properties_and_default_values" name="Example:_Adding_properties_and_default_values">Ejemplo: Añadiendo propiedades y valores por defecto</h3>
+
+<p>Es importante tener en cuenta la forma en la se aplican los valores por defecto de los atributos. Suele haber diferencias entre simplemente usar la notación con '.' y usar <code>Object.defineProperty()</code>, como se muestra en el siguiente ejemplo:</p>
+
+<pre class="brush: js">var o = {};
+
+o.a = 1;
+// es equivalente a :
+Object.defineProperty(o, 'a', {
+  value: 1,
+  writable: true,
+  configurable: true,
+  enumerable: true
+});
+
+
+// Sin embargo,
+Object.defineProperty(o, 'a', { value: 1 });
+// es equivalente a :
+Object.defineProperty(o, 'a', {
+  value: 1,
+  writable: false,
+  configurable: false,
+  enumerable: false
+});
+</pre>
+
+<h3 id="Example:_Custom_setters_and_getters" name="Example:_Custom_setters_and_getters">Ejemplo: Setters y Getters a medida</h3>
+
+<p>Example below shows how to implement a self-archiving object. When <code>temperature</code> property is set, the <code>archive</code> array gets a log entry.</p>
+
+<pre class="brush: js">function Archiver() {
+  var temperature = null;
+  var archive = [];
+
+  Object.defineProperty(this, 'temperature', {
+    get: function() {
+      console.log('get!');
+      return temperature;
+    },
+    set: function(value) {
+      temperature = value;
+      archive.push({ val: temperature });
+    }
+  });
+
+  this.getArchive = function() { return archive; };
+}
+
+var arc = new Archiver();
+arc.temperature; // 'get!'
+arc.temperature = 11;
+arc.temperature = 13;
+arc.getArchive(); // [{ val: 11 }, { val: 13 }]
+</pre>
+
+<p>or</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> pattern <span class="operator token">=</span> <span class="punctuation token">{</span>
+    <span class="keyword token">get</span><span class="punctuation token">:</span> <span class="keyword token">function</span> <span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">return</span> <span class="string token">'I always return this string, whatever you have assigned'</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span><span class="punctuation token">,</span>
+    <span class="keyword token">set</span><span class="punctuation token">:</span> <span class="keyword token">function</span> <span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">this</span><span class="punctuation token">.</span>myname <span class="operator token">=</span> <span class="string token">'this is my name string'</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">;</span>
+
+
+<span class="keyword token">function</span> <span class="function token">TestDefineSetAndGet</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    Object<span class="punctuation token">.</span><span class="function token">defineProperty</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">,</span> <span class="string token">'myproperty'</span><span class="punctuation token">,</span> pattern<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+
+<span class="keyword token">var</span> instance <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">TestDefineSetAndGet</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+instance<span class="punctuation token">.</span>myproperty <span class="operator token">=</span> <span class="string token">'test'</span><span class="punctuation token">;</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>instance<span class="punctuation token">.</span>myproperty<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// I always return this string, whatever you have assigned</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>instance<span class="punctuation token">.</span>myname<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// this is my name string</span></code></pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.6', 'Object.defineProperty')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.defineproperty', 'Object.defineProperty')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Firefox (Gecko)</th>
+   <th>Chrome</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatGeckoDesktop("2")}}</td>
+   <td>{{CompatChrome("5")}} (versiones previas sin testear)</td>
+   <td>{{CompatIE("9")}} ({{CompatIE("8")}}, pero solo con objetos DOM y con muchos comportamientos no estándares  <a href="#Internet_Explorer_8_specific_notes">See below</a>.)</td>
+   <td>{{CompatOpera("11.60")}}</td>
+   <td>{{CompatSafari("5.1")}} ({{CompatSafari("5")}}, but not on DOM objects)</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Android</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatGeckoMobile("2")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatIE("9")}} and above</td>
+   <td>{{CompatOperaMobile("11.50")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Based on <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat tables</a>.</p>
+
+<h3 id="Redefining_the_length_property_of_an_Array_object" name="Redefining_the_length_property_of_an_Array_object">Redefining the <code>length</code> property of an <code>Array</code> object</h3>
+
+<p>It is possible to redefine the {{jsxref("Array.length", "length")}} property of arrays, subject to the usual redefinition restrictions. (The {{jsxref("Array.length", "length")}} property is initially non-configurable, non-enumerable, and writable. Thus on an unaltered array it is possible to change the {{jsxref("Array.length", "length")}} property's value, or to make it non-writable. It is not allowed to change its enumerability or configurability, or if it is non-writable to change its value or writability.) However, not all browsers permit this redefinition.</p>
+
+<p>Firefox 4 through 22 will throw a {{jsxref("Global_Objects/TypeError", "TypeError")}} on any attempt whatsoever (whether permitted or not) to redefine the {{jsxref("Array.length", "length")}} property of an array.</p>
+
+<p>Versions of Chrome which implement <code>Object.defineProperty()</code> in some circumstances ignore a length value different from the array's current {{jsxref("Array.length", "length")}} property. In some circumstances changing writability seems to silently not work (and not throw an exception). Also, relatedly, some array-mutating methods like {{jsxref("Array.prototype.push")}} don't respect a non-writable length.</p>
+
+<p>Versions of Safari which implement <code>Object.defineProperty()</code> ignore a <code>length</code> value different from the array's current {{jsxref("Array.length", "length")}} property, and attempts to change writability execute without error but do not actually change the property's writability.</p>
+
+<p>Only Internet Explorer 9 and later, and Firefox 23 and later, appear to fully and correctly implement redefinition of the {{jsxref("Array.length", "length")}} property of arrays. For now, don't rely on redefining the {{jsxref("Array.length", "length")}} property of an array to either work, or to work in a particular manner. And even when you <em>can</em> rely on it, <a href="http://whereswalden.com/2013/08/05/new-in-firefox-23-the-length-property-of-an-array-can-be-made-non-writable-but-you-shouldnt-do-it/">there's really no good reason to do so</a>.</p>
+
+<h3 id="Particularidades_de_Internet_Explorer_8">Particularidades de Internet Explorer 8</h3>
+
+<p>El método <code>Object.defineProperty()</code> de Internet Explorer <a href="http://msdn.microsoft.com/en-us/library/dd229916%28VS.85%29.aspx">sólo puede ser usado en objetos del DOM.</a> Algunas explicaciones al respecto:</p>
+
+<ul>
+ <li>Intentar usar <code>Object.defineProperty()</code> en objetos nativos produce un error.</li>
+ <li>Hay que definir un valor para todos los atributos de una propiedad: <code>true, true, true</code> para descriptores de datos y <code>true</code> para configurables, <code>false</code> para el descriptor de acceso   <code>enumerable</code>.(?) Cualquier intento de proporcionar otro valor(?) lanzará un error.</li>
+ <li>Para reconfirurar una propiedad primero hay que eliminarla. Si no se elimina, la propiedad no cambia aunque se intente modificar.</li>
+</ul>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
+ <li>{{jsxref("Object.defineProperties()")}}</li>
+ <li>{{jsxref("Object.propertyIsEnumerable()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
+ <li>{{jsxref("Object.prototype.watch()")}}</li>
+ <li>{{jsxref("Object.prototype.unwatch()")}}</li>
+ <li>{{jsxref("Operators/get", "get")}}</li>
+ <li>{{jsxref("Operators/set", "set")}}</li>
+ <li>{{jsxref("Object.create()")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty/Additional_examples">Additional <code>Object.defineProperty</code> examples</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/entries/index.html b/files/es/web/javascript/reference/global_objects/object/entries/index.html
new file mode 100644
index 0000000000..2f1d669489
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/entries/index.html
@@ -0,0 +1,162 @@
+---
+title: Object.entries()
+slug: Web/JavaScript/Reference/Global_Objects/Object/entries
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/entries
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.entries()</strong></code> devuelve una matriz de pares propios de una propiedad enumerable [key, value] de un objeto dado, en el mismo orden que es proporcionado por {{jsxref("Sentencias/for...in", "for...in")}} (La diferencia es que un bucle for-in enumera las propiedades en la cadena de prototipos).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">Object.entries(<var>obj</var>)</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>The object whose enumerable own property <code>[key, value]</code> pairs are to be returned.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>An array of the given object's own enumerable property <code>[key, value]</code> pairs.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>Object.entries()</code> returns an array whose elements are arrays corresponding to the enumerable property <code>[key, value]</code> pairs found directly upon <code>object</code>. The ordering of the properties is the same as that given by looping over the property values of the object manually.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">var obj = { foo: 'bar', baz: 42 };
+console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]
+
+// array like object
+var obj = { 0: 'a', 1: 'b', 2: 'c' };
+console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]
+
+// array like object with random key ordering
+var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
+console.log(Object.entries(an_obj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]
+
+// getFoo is property which isn't enumerable
+var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
+my_obj.foo = 'bar';
+console.log(Object.entries(my_obj)); // [ ['foo', 'bar'] ]
+
+// non-object argument will be coerced to an object
+console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]
+
+// iterate through key-value gracefully
+var obj = {a: 5, b: 7, c: 9};
+for (var [key, value] of Object.entries(obj)) {
+    console.log(key + ' ' + value); // "a 5", "b 7", "c 9"
+}
+
+// Or, using array extras
+Object.entries(obj).forEach(([key, value]) =&gt; {
+    console.log(key + ' ' + value); // "a 5", "b 7", "c 9"
+});
+</pre>
+
+<h3 id="Converting_an_Object_to_a_Map">Converting an <code>Object</code> to a <code>Map</code></h3>
+
+<p>The {{jsxref("Map", "new Map()")}} constructor accepts an iterable of <code>entries</code>. With <code>Object.entries</code>, you can easily convert from {{jsxref("Object")}} to {{jsxref("Map")}}:</p>
+
+<pre class="brush: js">var obj = { foo: 'bar', baz: 42 };
+var map = new Map(Object.entries(obj));
+console.log(map); // Map { foo: "bar", baz: 42 }</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>To add compatible <code>Object.entries</code> support in older environments that do not natively support it, you can find a Polyfill in the <a href="https://github.com/tc39/proposal-object-values-entries">tc39/proposal-object-values-entries</a> or in the <a href="https://github.com/es-shims/Object.entries">es-shims/Object.entries</a> repositories.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.entries', 'Object.entries')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES8', '#sec-object.entries', 'Object.entries')}}</td>
+   <td>{{Spec2('ES8')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(54)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop(47)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatSafari(10.1)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android Webview</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(54)}}</td>
+   <td>{{CompatChrome(54)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile(47)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
+ <li>{{jsxref("Object.keys()")}}</li>
+ <li>{{jsxref("Object.values()")}} {{experimental_inline}}</li>
+ <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li>
+ <li>{{jsxref("Object.create()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/freeze/index.html b/files/es/web/javascript/reference/global_objects/object/freeze/index.html
new file mode 100644
index 0000000000..aadecb8b57
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/freeze/index.html
@@ -0,0 +1,175 @@
+---
+title: Object.freeze()
+slug: Web/JavaScript/Reference/Global_Objects/Object/freeze
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/freeze
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/freeze
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.freeze()</strong></code> <em>congela</em> un objeto, es decir: impide que se le agreguen nuevas propiedades; impide que se puedan eliminar las propiedades ya existentes; impide que dichas propiedades, o su capacidad de enumeración, configuración, o escritura, puedan ser modificadas; impide también que se pueda modificar su prototipo. El método devuelve el objeto recibido.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/object-freeze.html")}}</div>
+
+<p class="hidden">El código de este ejemplo interactivo está almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, puedes clonar <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y enviarnos un <em>pull request</em>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Object.freeze(<var>obj</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto a <em>congelar</em>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El mismo objeto</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Nada puede ser agregado o removido de las propiedades establecidas de un objeto <em>congelado</em>. Cualquier intento de hacerlo fallará, ya sea de manera silenciosa o <em>arrojando una excepción </em>{{jsxref("TypeError")}} (más comunmente, pero no exclusivamente, en {{jsxref("Strict_mode", "strict mode", "", 1)}}).</p>
+
+<p>Los valores no pueden ser cambiados por propiedades de datos. Propiedades de acceso (<em>getters</em> y <em>setters</em>) funcionan igual (y aún dan la ilusión de que estas cambiando el valor). Note que los valores que son objetos aún pueden ser modificados, a menos que esten <em>congelados</em> tambien.</p>
+
+<p>La función retorna el mismo objeto pasado en ella, no crea una copia <em>congelada</em></p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Congelando_Objetos">Congelando Objetos</h3>
+
+<pre class="brush: js">var obj = {
+  prop: function() {},
+  foo: 'bar'
+};
+
+// Nuevas propiedades pueden ser agregadas,
+// propiedades existentes pueden cambiar o removerse
+obj.foo = 'baz';
+obj.lumpy = 'woof';
+delete obj.prop;
+
+// Ambos, el objeto pasado como argumento tanto como el que se regresa
+// serán congelados
+// Es innecesario salvar el objeto que es regresado en orden de <em>congelar</em>
+// el original.
+var o = Object.freeze(obj);
+
+assert(Object.isFrozen(obj) === true);
+
+// Ahora cualquier cambio fallará
+obj.foo = 'quux'; // No hace nada de manera silenciosa
+obj.quaxxor = 'the friendly duck'; // No agrega una nueva propiedad, de manera silenciosa
+
+// ...y en modo estrico tal intento arrojará TypeErrors
+function fail(){
+  'use strict';
+  obj.foo = 'sparky'; // arroja un TypeError
+  delete obj.quaxxor; // arroja un TypeError
+  obj.sparky = 'arf'; // arroja un TypeError
+}
+
+fail();
+
+// Los intentos utilizando Object.defineProperty tambien arrojarán una excepción...
+Object.defineProperty(obj, 'ohai', { value: 17 }); // arroja un TypeError
+Object.defineProperty(obj, 'foo', { value: 'eit' }); // arroja un TypeError
+
+// Es imposible cambiar un prototipo
+// Estos ejemplos retornan un error TypeError
+Object.setPrototype(obj,{x:20})
+obj.__proto__ = {x:20}
+</pre>
+
+<p>El siguiente ejemplo muestra que los valores de objetos en un objeto congelado pueden ser mutados (la congelación es superficial).</p>
+
+<pre class="brush: js">obj1 = {
+  internal: {}
+};
+
+Object.freeze(obj1);
+obj1.internal.a = 'aValue';
+
+obj1.internal.a // 'aValue'
+
+// Para hacer obj completamente inmutable, congelamos cada objeto en obj.
+// Para hacerlo, usamos esta función.
+function deepFreeze(obj) {
+
+  // Recuperamos el nombre de las propiedades en obj
+  var propNames = Object.getOwnPropertyNames(obj);
+
+  // Congelamos las propiedades antes de congelar a obj
+  propNames.forEach(function(name) {
+    var prop = obj[name];
+
+    // Si la propiedad es un objeto, llamaremos a deepFreezze para que congele las propiedades de ese objeto
+    if (typeof prop == 'object' &amp;&amp; prop !== null &amp;&amp; !Object.isFrozen(prop))
+      deepFreeze(prop);
+  });
+
+  // congelamos a obj
+  return Object.freeze(obj);
+}
+
+obj2 = {
+  internal: {}
+};
+
+deepFreeze(obj2);
+obj2.internal.a = 'anotherValue';
+obj2.internal.a; // undefined
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>En ES5, si el argumento pasado a este método no es un objeto (un primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un argumento no-objeto será tratado como si fuera un objeto <em>congelado</em> cualquiera, simplemente lo regresa.</p>
+
+<pre class="brush: js">&gt; Object.freeze(1)
+TypeError: 1 is not an object // Código ES5
+
+&gt; Object.freeze(1)
+1                             // Código ES6
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.9', 'Object.freeze')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.freeze', 'Object.freeze')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.freeze', 'Object.freeze')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{Compat("javascript.builtins.Object.freeze")}}</p>
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li>{{jsxref("Object.isFrozen()")}}</li>
+ <li>{{jsxref("Object.preventExtensions()")}}</li>
+ <li>{{jsxref("Object.isExtensible()")}}</li>
+ <li>{{jsxref("Object.seal()")}}</li>
+ <li>{{jsxref("Object.isSealed()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/fromentries/index.html b/files/es/web/javascript/reference/global_objects/object/fromentries/index.html
new file mode 100644
index 0000000000..f551a54d08
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/fromentries/index.html
@@ -0,0 +1,107 @@
+---
+title: Object.fromEntries()
+slug: Web/JavaScript/Reference/Global_Objects/Object/fromEntries
+tags:
+  - JavaScript
+  - Objeto
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/fromEntries
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/fromEntries
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.fromEntries()</strong></code> transforma una lista de pares con <code>[clave-valor] </code>en un objeto.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/object-fromentries.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">Object.fromEntries(<var>iterable</var>);</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>iterador</var></code></dt>
+ <dd>Un iterador como {{jsxref("Array")}}, {{jsxref("Map")}} u otros objetos que implementen el <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">protocolo iterable</a>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un nuevo objeto cuyas propiedades son dadas por las entradas del iterador.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>Object.fromEntries()</code> toma una lista de pares con clave-valor y devuelve un nuevo objeto cuyas propiedades son dadas por éstas entradas. El argumento <em>iterador </em>se espera que sea un objeto que implemente un método <code>@@iterator</code>, que devuelve un objeto iterador, que produce un objeto tipo array de dos elementos, donde el primer elemento es un valor que se usará como la clave de la propiedad, y el segundo elemento es el valor a asociar con esa clave de propiedad.</p>
+
+<p><code>Object.fromEntries()</code> realiza lo inverso de {{jsxref("Object.entries()")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Convirtiendo_un_Map_en_un_Objeto">Convirtiendo un <code>Map</code> en un <code>Objeto</code></h3>
+
+<p>Con <code>Object.fromEntries</code>, puedes convertir de un {{jsxref("Map")}} a un {{jsxref("Object")}}:</p>
+
+<pre class="brush: js notranslate">const map = new Map([ ['foo', 'bar'], ['baz', 42] ]);
+const obj = Object.fromEntries(map);
+console.log(obj); // { foo: "bar", baz: 42 }
+</pre>
+
+<h3 id="Convirtiendo_un_Arreglo_en_un_Objeto">Convirtiendo un <code>Arreglo</code> en un <code>Objeto</code></h3>
+
+<p>Con <code>Object.fromEntries</code>, puedes convertir de un {{jsxref("Array")}} a un {{jsxref("Object")}}:</p>
+
+<pre class="brush: js notranslate">const arr = [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ];
+const obj = Object.fromEntries(arr);
+console.log(obj); // { 0: "a", 1: "b", 2: "c" }
+</pre>
+
+<h3 id="Transformación_de_Objetos">Transformación de Objetos</h3>
+
+<p>Con <code>Object.fromEntries</code>, su método inverso {{jsxref("Object.entries()")}}, y <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array#Methods_2">array métodos de manipulaciín de arreglos</a>, puedes transformar objetos así:</p>
+
+<pre class="brush: js notranslate">const object1 = { a: 1, b: 2, c: 3 };
+
+const object2 = Object.fromEntries(
+  Object.entries(object1)
+  .map(([ key, val ]) =&gt; [ key, val * 2 ])
+);
+
+console.log(object2);
+// { a: 2, b: 4, c: 6 }</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.fromentries', 'Object.fromEntries')}}</td>
+   <td>Etapa 4</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Object.fromEntries")}}</p>
+
+<h2 id="Véase_tambien">Véase tambien</h2>
+
+<ul>
+ <li>{{jsxref("Object.entries()")}}</li>
+ <li>{{jsxref("Object.keys()")}}</li>
+ <li>{{jsxref("Object.values()")}}</li>
+ <li>{{jsxref("Map.prototype.entries()")}}</li>
+ <li>{{jsxref("Map.prototype.keys()")}}</li>
+ <li>{{jsxref("Map.prototype.values()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/getownpropertydescriptor/index.html b/files/es/web/javascript/reference/global_objects/object/getownpropertydescriptor/index.html
new file mode 100644
index 0000000000..7d9542c349
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/getownpropertydescriptor/index.html
@@ -0,0 +1,162 @@
+---
+title: Object.getOwnPropertyDescriptor()
+slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor
+tags:
+  - ECMAScript5
+  - JavaScript
+  - Método(2)
+  - Objeto
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptor
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.getOwnPropertyDescriptor()</strong></code> regresa como descripción de propiedad para una propiedad propia (eso es, una presente directamente en el objeto, no presente por la fuerza a través de la cadena de prototipo del objeto) de un objeto dado.</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox"><code>Object.getOwnPropertyDescriptor(<var>obj</var>, <var>prop</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto en el que se busca la propiedad.</dd>
+ <dt><code>prop</code></dt>
+ <dd>El nombre de la propiedad del cuál se obtendrá la descripción.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un descriptor de propiedad de una propiedad dada si existe en el objeto,  {{jsxref("undefined")}} en cualquier otro caso.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Éste método permite la examinación precisa de la descripción de una propiedad. Una propiedad en JavaScript consiste de el nombre de una cadena de valor y un descriptor de propiedad. Información más detallada acerca de los tipos de descripciones y sus atributos puede ser encontrada en {{jsxref("Object.defineProperty()")}}.</p>
+
+<p>Una descripción de propiedad es un registro con alguno de los siguientes atributos:</p>
+
+<dl>
+ <dt><code>value</code></dt>
+ <dd>El valor asociado con la propiedad (descriptores de datos unicamente).</dd>
+ <dt><code><strong>writable</strong></code></dt>
+ <dd><code>true</code> si y solo si el valor asociado con la propiedad puede ser cambiada (descriptores de datos unicamente).</dd>
+ <dt><code>get</code></dt>
+ <dd>Una función que sirve como método de acceso para la propiedad, o {{jsxref("undefined")}} si no hay método de acceso (métodos de acceso de descripciones unicamente).</dd>
+ <dt><code>set</code></dt>
+ <dd>Una función que sirve como método de establecimiento para la propieda, o {{jsxref("undefined")}} si no hay método de establecimiento (métodos de establecimiento de descripciones unicamente).</dd>
+ <dt><code>configurable</code></dt>
+ <dd><code>true</code> si y solo si el tipo de ésta descripción de propiedad puede ser cambiada y si la propiedad puede ser eliminada del objeto correspondiente.</dd>
+ <dt><code>enumerable</code></dt>
+ <dd><code>true</code> si y solo si ésta propiedad aparece durante la enumeración de las propiedades del objeto correspondiente.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">var o, d;
+
+o = { get foo() { return 17; } };
+d = Object.getOwnPropertyDescriptor(o, 'foo');
+// d is { configurable: true, enumerable: true, get: /* la función de acceso */, set: undefined }
+
+o = { bar: 42 };
+d = Object.getOwnPropertyDescriptor(o, 'bar');
+// d is { configurable: true, enumerable: true, value: 42, writable: true }
+
+o = {};
+Object.defineProperty(o, 'baz', { value: 8675309, writable: false, enumerable: false });
+d = Object.getOwnPropertyDescriptor(o, 'baz');
+// d es { value: 8675309, writable: false, enumerable: false, configurable: false }
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>En ES5, si el primer argumento que se le pasa a éste método no es un objeto (primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un no-objeto pasado como primer argumento será convertido (coerción) a un objeto en primera instancia.</p>
+
+<pre class="brush: js">Object.getOwnPropertyDescriptor("foo", 0);
+// TypeError: "foo" is not an object  // Código ES5
+
+Object.getOwnPropertyDescriptor("foo", 0);
+// {configurable:false, enumerable:true, value:"f", writable:false}  // Código ES6
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.3', 'Object.getOwnPropertyDescriptor')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.getownpropertydescriptor', 'Object.getOwnPropertyDescriptor')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("5")}}</td>
+   <td>{{CompatGeckoDesktop("2")}}</td>
+   <td>{{CompatIE("8")}}</td>
+   <td>{{CompatOpera("12")}}</td>
+   <td>{{CompatSafari("5")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+ <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html b/files/es/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html
new file mode 100644
index 0000000000..3c928e4188
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/getownpropertydescriptors/index.html
@@ -0,0 +1,118 @@
+---
+title: Object.getOwnPropertyDescriptors()
+slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptors
+tags:
+  - JavaScript
+  - Objeto
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptors
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptors
+---
+<div>{{JSRef}}</div>
+
+<p>El método<code><strong>Object.getOwnPropertyDescriptors()</strong></code><strong> </strong>regresa todos los descriptores de propiedad propios de un objeto dado.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/object-getownpropertydescriptors.html")}}</div>
+
+<h2 id="Sintáxis">Sintáxis</h2>
+
+<pre class="syntaxbox">Object.getOwnPropertyDescriptors(<var>obj</var>)</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto para el cual obtener todos los descriptores de propiedad.</dd>
+</dl>
+
+<h3 id="Valores_devueltos">Valores devueltos</h3>
+
+<p>Un objeto que contiene todos los descriptores de propiedad propios de un objeto.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Este método permite la examinación de la descripción precisa de todas las propiedades de un objeto. Una propiedad en JavaScript consiste en un valor-cadena nombre y un descriptor de propiedad. Más información acerca de los tipos de descriptores de propiedad y sus atributos pueden ser encontrados en {{jsxref("Object.defineProperty()")}}.</p>
+
+<p>Un descriptor de propiedad es un registro con algunos de los siguientes atributos:</p>
+
+<dl>
+ <dt><code>value</code></dt>
+ <dd>El valor asociado con la propiedad (solo descriptores de datos).</dd>
+ <dt><code><strong>writable</strong></code></dt>
+ <dd><code>true</code> si y solo si el valor asociado con la propiedad puede ser cambiado (solo descriptores de datos).</dd>
+ <dt><code>get</code></dt>
+ <dd>Un función que sirve como un getter para la propiedad, o {{jsxref("undefined")}} si no hay getter (solo descriptores de acceso).</dd>
+ <dt><code>set</code></dt>
+ <dd>Una función que sirve como un setter para la propiedad, o {{jsxref("undefined")}} si no hay setter (solo descriptores de acceso).</dd>
+ <dt><code>configurable</code></dt>
+ <dd><code>true</code> si y solo si el tipo de este descriptor de propiedad puede ser cambiado y si la propiedad puede ser borrada de el objeto correspondiente.</dd>
+ <dt><code>enumerable</code></dt>
+ <dd><code>true</code> si y solo si esta propiedad aparece durante la enumeración de las propiedad en el objeto correspondiente.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Creando_un_clon_superficial">Creando un clon superficial</h3>
+
+<p>Mientras el método {{jsxref("Object.assign()")}} solo copiará las propiedades enumerables y propias de un objeto fuente a un objeto destino, puedes usar este método y {{jsxref("Object.create()")}} para una copia superficial entre dos objetos desconocidos:</p>
+
+<pre class="brush: js">Object.create(
+  Object.getPrototypeOf(obj),
+  Object.getOwnPropertyDescriptors(obj)
+);
+</pre>
+
+<h3 id="Creando_una_subclase">Creando una subclase</h3>
+
+<p>Una manera típica de crear una subclase es definir la subclase, establecer su prototipo a una instancia de la superclase, y después definir propiedades en esa instancia. Esto puede ponerse incómodo especialmente por los getters y setters. En cambio, tú puedes usar este código para establecer el prototipo:</p>
+
+<pre class="brush: js">function superclass() {}
+superclass.prototype = {
+  // Define tus métodos y propiedades aquí
+};
+function subclass() {}
+subclass.prototype = Object.create(
+  superclass.prototype,
+  {
+    // Define tus métodos y propiedades aquí
+  }
+);
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.getownpropertydescriptors', 'Object.getOwnPropertyDescriptors')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Definición inicial en ECMAScript 2017.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2017', '#sec-object.getownpropertydescriptors', 'Object.getOwnPropertyDescriptors')}}</td>
+   <td>{{Spec2('ES2017')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quisieras contribuir con los datos, por favor vaya a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> mándenos una petición pull.</div>
+
+<p>{{Compat("javascript.builtins.Object.getOwnPropertyDescriptors")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también:</h2>
+
+<ul>
+ <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+ <li><a href="https://github.com/tc39/proposal-object-getownpropertydescriptors">Polyfill</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/getownpropertynames/index.html b/files/es/web/javascript/reference/global_objects/object/getownpropertynames/index.html
new file mode 100644
index 0000000000..6844d4df35
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/getownpropertynames/index.html
@@ -0,0 +1,164 @@
+---
+title: Object.getOwnPropertyNames()
+slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyNames
+---
+<div>
+ {{JSRef("Global_Objects", "Object")}}</div>
+<h2 id="Summary" name="Summary">Resumen</h2>
+<p>El método <code><strong>Object.getOwnPropertyNames()</strong></code> devuelve un array con todas las propiedades (numerables o no) encontradas en un objeto dado.</p>
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+<pre class="syntaxbox"><code>Object.getOwnPropertyNames(<em>obj</em>)</code></pre>
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+<dl>
+ <dt>
+  obj</dt>
+ <dd>
+  El objeto cuyas propiedades directas, numerables <em>y no-numerables</em>, serán devueltas.</dd>
+</dl>
+<h2 id="Description" name="Description">Descripción</h2>
+<p><code>Object.getOwnPropertyNames</code> devuelve un array cuyos elementos son <em>strings </em>correspondientes a cada una de las propiedades encontradas directamente en <code>obj</code>. El orden de las propiedades numerables en el array coincide con el expuesto para <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in loop</a> (o para {{jsxref("Object.keys")}}) con respecto a las propiedades del object. El orden de las propiedades no-numerables del array, y de éstas respecto a las numerables, no está definido.</p>
+<h2 id="Ejemplos">Ejemplos</h2>
+<pre class="brush: js">var arr = ["a", "b", "c"];
+print(Object.getOwnPropertyNames(arr).sort()); // imprime "0,1,2,length"
+
+// Objeto similar a Array
+var obj = { 0: "a", 1: "b", 2: "c"};
+print(Object.getOwnPropertyNames(obj).sort()); // imprime "0,1,2"
+
+// Imprime nombres de variables y valores usando Array.forEach
+Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) {
+  print(val + " -&gt; " + obj[val]);
+});
+// imprime
+// 0 -&gt; a
+// 1 -&gt; b
+// 2 -&gt; c
+
+// propiedad no-numerable
+var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; }, enumerable: false } });
+my_obj.foo = 1;
+
+print(Object.getOwnPropertyNames(my_obj).sort()); // imprime "foo, getFoo"
+</pre>
+<p>Si se quiere solo las propiedades numerables, ver {{jsxref("Object.keys")}} o usar un <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in loop</a> (aunque esto devolvería propiedades numerables no directas del <span style="line-height: 1.5;">objeto pertenecientes a la cadena de <em>prototype</em> a la que pertenezca, a menos que finalmente se filtre con hasOwnProperty()).</span></p>
+<p>Items de la cadena <em>prototype</em> no se listan:</p>
+<pre class="brush: js">function ParentClass () {
+}
+ParentClass.prototype.inheritedMethod = function () {
+};
+
+function ChildClass () {
+  this.prop = 5;
+  this.method = function () {};
+}
+ChildClass.prototype = new ParentClass;
+ChildClass.prototype.prototypeMethod = function () {
+};
+
+alert(
+  Object.getOwnPropertyNames(
+    new ChildClass() // ["prop", "method"]
+  )
+)
+</pre>
+<h3 id="Get_Non-Enumerable_Only">Get Non-Enumerable Only</h3>
+<p>Aquí se usa la función Array.prototype.filter para quitar las <em>keys</em> numerables (obtenidas con Object.keys) de una lista con todas las <em>keys</em> (obtenida con Object.getOwnPropertynames) dejando solo las no-numerables.</p>
+<pre class="brush: js">var target = myObject;
+var enum_and_nonenum = Object.getOwnPropertyNames(target);
+var enum_only = Object.keys(target);
+var nonenum_only = enum_and_nonenum.filter(function(key) {
+  var indexInEnum = enum_only.indexOf(key)
+  if (indexInEnum == -1) {
+    //no encontrada en las keys de enum_only, por lo que se trata de una key numerable, se devuelve true para mantenerla en filter
+    return true;
+  } else {
+    return false;
+  }
+});
+
+console.log(nonenum_only);
+</pre>
+<h2 id="Especificaciones">Especificaciones</h2>
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.4', 'Object.getOwnPropertyNames')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Initial definition.<br>
+    Implemented in JavaScript 1.8.5</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.getownpropertynames', 'Object.getOwnPropertyNames')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+<h2 id="Compatibilidad_con_Navegadores"> Compatibilidad con Navegadores</h2>
+<div>
+ {{CompatibilityTable}}</div>
+<div id="compat-desktop">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Firefox (Gecko)</th>
+    <th>Chrome</th>
+    <th>Internet Explorer</th>
+    <th>Opera</th>
+    <th>Safari</th>
+   </tr>
+   <tr>
+    <td>Basic support</td>
+    <td>4 (2.0)</td>
+    <td>5</td>
+    <td>9</td>
+    <td>12</td>
+    <td>5</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<div id="compat-mobile">
+ <table class="compat-table">
+  <tbody>
+   <tr>
+    <th>Feature</th>
+    <th>Firefox Mobile (Gecko)</th>
+    <th>Android</th>
+    <th>IE Mobile</th>
+    <th>Opera Mobile</th>
+    <th>Safari Mobile</th>
+   </tr>
+   <tr>
+    <td>Basic support</td>
+    <td>{{CompatUnknown}}</td>
+    <td>{{CompatUnknown}}</td>
+    <td>{{CompatUnknown}}</td>
+    <td>{{CompatUnknown}}</td>
+    <td>{{CompatUnknown}}</td>
+   </tr>
+  </tbody>
+ </table>
+</div>
+<p>Based on <a href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
+<h3 id="SpiderMonkey-specific_notes">SpiderMonkey-specific notes</h3>
+<ul>
+ <li>Prior to SpiderMonkey 28 {{geckoRelease("28")}}, <code>Object.getOwnPropertyNames</code> did not see unresolved properties of {{jsxref("Error")}} objects. This has been fixed in later versions ({{bug("724768")}}).</li>
+</ul>
+<h2 id="See_also" name="See_also">Ver también</h2>
+<ul>
+ <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties" title="Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
+ <li>{{jsxref("Object.prototype.hasOwnProperty")}}</li>
+ <li>{{jsxref("Object.prototype.propertyIsEnumerable")}}</li>
+ <li>{{jsxref("Object.create")}}</li>
+ <li>{{jsxref("Object.keys")}}</li>
+ <li>{{jsxref("Array.forEach()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/getownpropertysymbols/index.html b/files/es/web/javascript/reference/global_objects/object/getownpropertysymbols/index.html
new file mode 100644
index 0000000000..c57f9f3c88
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/getownpropertysymbols/index.html
@@ -0,0 +1,124 @@
+---
+title: Object.getOwnPropertySymbols()
+slug: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertySymbols
+tags:
+  - ECMAScript6
+  - Experimental
+  - JavaScript
+  - Método(2)
+  - Objeto
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertySymbols
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertySymbols
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.getOwnPropertySymbols()</strong></code> regresa una colección de todos las propiedades de los simbolos encontrados directamente en un objeto dado.</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox"><code>Object.getOwnPropertySymbols(<var>obj</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto del cual los simbolos de propiedades son devueltos.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Similar a {{jsxref("Object.getOwnPropertyNames()")}}, puedes obtener todas las propiedades de simbolos de un objeto dado como una colección de simbolos. Note que {{jsxref("Object.getOwnPropertyNames()")}} no contiene en sí mismo las propiedades de simbolos de un objeto y solo contiene las propiedades de cadenas.</p>
+
+<p>Cómo todos los objetos no tienen inicialmente propiedades simbolos propios, <code>Object.getOwnPropertySymbols()</code> regresa una colección vacia a menos que tengas propiedades de simbolos establecidas en tu objeto.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">var obj = {};
+var a = Symbol('a');
+var b = Symbol.for('b');
+
+obj[a] = 'localSymbol';
+obj[b] = 'globalSymbol';
+
+var objectSymbols = Object.getOwnPropertySymbols(obj);
+
+console.log(objectSymbols.length); // 2
+console.log(objectSymbols);        // [Symbol(a), Symbol(b)]
+console.log(objectSymbols[0]);     // Symbol(a)
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.getownpropertysymbols', 'Object.getOwnPropertySymbols')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{CompatGeckoDesktop("36.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>5.1</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{CompatGeckoMobile("36.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+ <li>{{jsxref("Symbol")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/getprototypeof/index.html b/files/es/web/javascript/reference/global_objects/object/getprototypeof/index.html
new file mode 100644
index 0000000000..2da5fc410a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/getprototypeof/index.html
@@ -0,0 +1,138 @@
+---
+title: Object.getPrototypeOf()
+slug: Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf
+tags:
+  - ECMAScript5
+  - JavaScript
+  - Objeto
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/getPrototypeOf
+---
+<div>{{JSRef("Global_Objects", "Object")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <code><strong>Object.getPrototypeOf()</strong></code> devuelve el prototipo (es decir, el valor de la propiedad interna <code>[[Prototype]]</code>) del objeto especificado.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Object.getPrototypeOf(<var>obj</var>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto cuyo prototipo va a ser devuelto.</dd>
+</dl>
+
+<h3 id="Valor_Devuelto">Valor Devuelto</h3>
+
+<p>El prototipo del objeto dado. Si no existen propiedades heredadas se devolverá {{jsxref("null")}}.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<pre class="brush: js">var proto = {};
+var obj= Object.create(proto);
+Object.getPrototypeOf(obj) === proto; // true
+</pre>
+
+<h2 id="Notes" name="Notes">Notas</h2>
+
+<p>En ES5, lanzará una excepción {{jsxref("Global_Objects/TypeError", "TypeError")}} si el parámetro <code>obj</code> no es un objeto. en ES6, El parámetro será forzado a un {{jsxref("Global_Objects/Object", "Object")}}.</p>
+
+<pre class="brush: js">&gt; Object.getPrototypeOf('foo')
+TypeError: "foo" is not an object  // ES5 code
+&gt; Object.getPrototypeOf('foo')
+String.prototype                   // ES6 code
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.2', 'Object.getPrototypeOf')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.getprototypeof', 'Object.getProtoypeOf')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("5")}}</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatOpera("12.10")}} (tal vez en las últimas versiones)</td>
+   <td>{{CompatSafari("5")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>Based on <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
+
+<h3 id="Notas_espécificas_sobre_Opera">Notas espécificas sobre Opera</h3>
+
+<p>A pesar de que las versiones anteriores de opera no soportan aun <code>Object.getPrototypeOf()</code>, Opera soporta la propiedad no estándar {{jsxref("Object.proto", "__proto__")}} desde Opera 10.50.</p>
+
+<h2 id="See_also" name="See_also">Mira también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li>
+ <li>{{jsxref("Object.setPrototypeOf()")}} {{experimental_inline}}</li>
+ <li>John Resig's post on <a class="external" href="http://ejohn.org/blog/objectgetprototypeof/">getPrototypeOf</a></li>
+ <li>{{jsxref("Object.prototype.__proto__")}}</li>
+ <li>{{jsxref("Reflect.getPrototypeOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/hasownproperty/index.html b/files/es/web/javascript/reference/global_objects/object/hasownproperty/index.html
new file mode 100644
index 0000000000..34060bba68
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/hasownproperty/index.html
@@ -0,0 +1,187 @@
+---
+title: Object.prototype.hasOwnProperty()
+slug: Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
+tags:
+  - JavaScript
+  - Method
+  - Object
+  - Prototype
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty
+---
+<div>{{JSRef("Objetos_globales", "Object")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <code><strong>hasOwnProperty()</strong></code> devuelve un booleano indicando si el objeto tiene la propiedad especificada.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>obj</em>.hasOwnProperty(<em>prop</em>)</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>prop</code></dt>
+ <dd>El nombre de la propiedad a buscar.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Todo objeto descendiente de <code>Object</code> hereda el método <code>hasOwnProperty</code>. Este método puede ser usando para determinar si un objeto tiene la propiedad especificada como una propiedad directa de ese objeto; a diferencia del operador {{jsxref("Operators/in", "in")}}, este método no verifica la cadena prototipo del objeto.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_hasOwnProperty_to_test_for_a_property.27s_existence" name="Example:_Using_hasOwnProperty_to_test_for_a_property.27s_existence">Ejemplo: usar <code>hasOwnProperty</code> para comprobar la existencia de una propiedad</h3>
+
+<p>El siguiente ejemplo determina si el objeto <code>o</code> contiene una propiedad llamada <code>prop</code>:</p>
+
+<pre class="brush: js">o = new Object();
+o.prop = 'exists';
+
+function changeO() {
+  o.newprop = o.prop;
+  delete o.prop;
+}
+
+o.hasOwnProperty('prop');   // returns true
+changeO();
+o.hasOwnProperty('prop');   // returns false</pre>
+
+<h3 id="Example:_Direct_versus_inherited_properties" name="Example:_Direct_versus_inherited_properties">Ejemplo: Directo versus propiedades heredadas</h3>
+
+<p>El siguiente ejemplo diferencia entre propiedades directas y propiedades heredadas a través de la cadena prototype:</p>
+
+<pre class="brush: js">o = new Object();
+o.prop = 'exists';
+o.hasOwnProperty('prop');             // returns true
+o.hasOwnProperty('toString');         // returns false
+o.hasOwnProperty('hasOwnProperty');   // returns false</pre>
+
+<h3 id="Example:_Itarate_over_properties_not_considering_inherited_properties" name="Example:_Itarate_over_properties_not_considering_inherited_properties">Ejemplo: Iterando sobre las propiedades de un objeto</h3>
+
+<p>El siguiente ejemplo muestra como iterar sobre las propiedades de un objeto sin ejecutar sobre propiedades heredadas. Observe que el bucle for..in ya está no solo iterando elementos enumerables, por consiguiente uno no debería asumir que basado en la falta de propiedades no numerales mostrando en el bucle que hasOwnProperty por si misma no está solo es estrictamente para iterar elementos numerados (como con {{jsxref("Object.getOwnPropertyNames()")}}).</p>
+
+<pre class="brush: js">var buz = {
+    fog: 'stack'
+};
+
+for (var name in buz) {
+    if (buz.hasOwnProperty(name)) {
+        alert("this is fog (" + name + ") for sure. Value: " + buz[name]);
+    }
+    else {
+        alert(name); // toString or something else
+    }
+}</pre>
+
+<h3 id="Ejemplo_hasOwnProperty_como_una_propiedad">Ejemplo: <code>hasOwnProperty</code> como una propiedad</h3>
+
+<p>JavaScript no protege el nombre de la propiedad <code>hasOwnProperty</code>; en consecuencia, si existe la posibilidad  de que un objeto pudiera tener la propiedad con ese nombre, es necesario usar un externo <code>hasOwnProperty</code> para obtener los correctos resultados:</p>
+
+<pre class="brush: js">var foo = {
+    hasOwnProperty: function() {
+        return false;
+    },
+    bar: 'Here be dragons'
+};
+
+foo.hasOwnProperty('bar'); // always returns false
+
+// Use another Object's hasOwnProperty and call it with 'this' set to foo
+({}).hasOwnProperty.call(foo, 'bar'); // true
+
+// It's also possible to use the hasOwnProperty property from the Object property for this purpose
+Object.prototype.hasOwnProperty.call(foo, 'bar'); // true
+</pre>
+
+<p>Observe que en el último caso no han habido nuevos objetos creados.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 3rd Edition. Implemented in JavaScript 1.5</td>
+   <td>Standard</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.4.5', 'Object.prototype.hasOwnProperty')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_Also" name="See_Also">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties" title="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></li>
+ <li>{{jsxref("Operators/in", "in")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_Revisited">JavaScript Guide: Inheritance revisted</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/index.html b/files/es/web/javascript/reference/global_objects/object/index.html
new file mode 100644
index 0000000000..0814565c36
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/index.html
@@ -0,0 +1,188 @@
+---
+title: Object
+slug: Web/JavaScript/Reference/Global_Objects/Object
+tags:
+  - Constructor
+  - JavaScript
+  - Objeto
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/Object
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object
+---
+<div>{{JSRef}}</div>
+
+<div>La clase Object representa uno de los tipos de datos de Javascript. Es es usado para guardar una colección de datos definidos y entidades más complejas. Los objetos pueden ser creados utilzando el constructor {{jsxref("Object/Object", "Object()")}} o la sintaxis literal de objeto. </div>
+
+<p>El constructor <code><strong>Object</strong></code> crea una envoltura al objeto.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+
+
+<pre class="syntaxbox notranslate">// Object initialiser or literal
+{ [ <var>nameValuePair1</var>[, <var>nameValuePair2</var>[, ...<var>nameValuePairN</var>] ] ] }
+
+// Called as a constructor
+new Object([<var>value</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>nameValuePair1, nameValuePair2, ... nameValuePair<em>N</em></code></dt>
+ <dd>Los pares de nombres (strings) y los valores (cualquier valor) donde los nombres son separados por una coma.</dd>
+ <dt><code>valor</code></dt>
+ <dd>Cualquier valor.</dd>
+</dl>
+
+<h2 id="Description">Description</h2>
+
+<p>El constructor <code>Object</code> crea una envoltura de objeto  al valor dado.  Si el valor es  {{jsxref("null")}} o {{jsxref("undefined")}}, creará y retornará un objeto vacío, de otra forma, retornará un objeto de un tipo que corresponda al valor dado. Si el valor ya es un objeto devolverá el valor.</p>
+
+<p>Cuando es llamano en un contexto non-constructor, <code>Object </code>se comportará indenticamente a <code>new Object()</code>.</p>
+
+<p>Ver <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer / literal syntax</a>.</p>
+
+<h2 id="Propiedades_del_constructor_Object">Propiedades del constructor <code>Object</code></h2>
+
+<dl>
+ <dt><code>Object.length</code></dt>
+ <dd>Tiene un valor de 1.</dd>
+ <dt>{{jsxref("Object.prototype")}}</dt>
+ <dd>Permite añadir propiedades a todos los objetos del tipo Object.</dd>
+</dl>
+
+<h2 id="Métodos_del_constructor_Object">Métodos del constructor  <code>Object</code></h2>
+
+<dl>
+ <dt>{{jsxref("Object.assign()")}}</dt>
+ <dd>Copia los valores de todas sus propiedades enumerables desde uno o más objetos fuente a un objeto destino.</dd>
+ <dt>{{jsxref("Object.create()")}}</dt>
+ <dd>Crea un nuevo objeto con el prototipo objeto y propiedades específicadas.</dd>
+ <dt>{{jsxref("Object.defineProperty()")}}</dt>
+ <dd>Añade la propiedad nombrada descrita por un descriptor dado a un objeto.</dd>
+ <dt>{{jsxref("Object.defineProperties()")}}</dt>
+ <dd>Agrega las propiedades nombradas descritas por los descriptores dados a un objeto.</dd>
+ <dt>{{jsxref("Object.entries()")}}</dt>
+ <dd>Returns an array containing all of the <code>[key, value]</code> pairs of a given object's <strong>own</strong> enumerable string properties.</dd>
+ <dt>{{jsxref("Object.freeze()")}}</dt>
+ <dd>Freezes an object: other code can't delete or change any properties.</dd>
+ <dt>{{jsxref("Object.fromEntries()")}}</dt>
+ <dd>Returns a new object from an iterable of key-value pairs (reverses {{jsxref("Object.entries")}}).</dd>
+ <dt>{{jsxref("Object.getOwnPropertyDescriptor()")}}</dt>
+ <dd>Returns a property descriptor for a named property on an object.</dd>
+ <dt>{{jsxref("Object.getOwnPropertyDescriptors()")}}</dt>
+ <dd>Returns an object containing all own property descriptors for an object.</dd>
+ <dt>{{jsxref("Object.getOwnPropertyNames()")}}</dt>
+ <dd>Returns an array containing the names of all of the given object's <strong>own</strong> enumerable and non-enumerable properties.</dd>
+ <dt>{{jsxref("Object.getOwnPropertySymbols()")}}</dt>
+ <dd>Returns an array of all symbol properties found directly upon a given object.</dd>
+ <dt>{{jsxref("Object.getPrototypeOf()")}}</dt>
+ <dd>Returns the prototype of the specified object.</dd>
+ <dt>{{jsxref("Object.is()")}}</dt>
+ <dd>Compares if two values are the same value. Equates all NaN values (which differs from both Abstract Equality Comparison and Strict Equality Comparison).</dd>
+ <dt>{{jsxref("Object.isExtensible()")}}</dt>
+ <dd>Determines if extending of an object is allowed.</dd>
+ <dt>{{jsxref("Object.isFrozen()")}}</dt>
+ <dd>Determines if an object was frozen.</dd>
+ <dt>{{jsxref("Object.isSealed()")}}</dt>
+ <dd>Determines if an object is sealed.</dd>
+ <dt>{{jsxref("Object.keys()")}}</dt>
+ <dd>Returns an array containing the names of all of the given object's <strong>own</strong> enumerable string properties.</dd>
+ <dt>{{jsxref("Object.preventExtensions()")}}</dt>
+ <dd>Prevents any extensions of an object.</dd>
+ <dt>{{jsxref("Object.seal()")}}</dt>
+ <dd>Prevents other code from deleting properties of an object.</dd>
+ <dt>{{jsxref("Object.setPrototypeOf()")}}</dt>
+ <dd>Sets the prototype (i.e., the internal <code>[[Prototype]]</code> property).</dd>
+ <dt>{{jsxref("Object.values()")}}</dt>
+ <dd>Returns an array containing the values that correspond to all of a given object's <strong>own</strong> enumerable string properties.</dd>
+</dl>
+
+<h2 id="Object_instances_and_Object_prototype_object"><code>Object</code> instances and <code>Object</code> prototype object</h2>
+
+<p>All objects in JavaScript are descended from <code>Object</code>; all objects inherit methods and properties from {{jsxref("Object.prototype")}}, although they may be overridden. For example, other constructors' prototypes override the <code>constructor</code> property and provide their own <code>toString()</code> methods. Changes to the <code>Object</code> prototype object are propagated to all objects unless the properties and methods subject to those changes are overridden further along the prototype chain.</p>
+
+<h3 id="Properties">Properties</h3>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype', 'Properties') }}</div>
+
+<h3 id="Methods">Methods</h3>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype', 'Methods') }}</div>
+
+<h2 id="Deleting_a_property_from_an_object">Deleting a property from an object</h2>
+
+<p>There isn't any method in an Object itself to delete its own properties (e.g. like <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete">Map.prototype.delete()</a></code>). To do so one has to use the <a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete">delete operator</a>.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_Object_given_undefined_and_null_types">Using <code>Object</code> given <code>undefined</code> and <code>null</code> types</h3>
+
+<p>The following examples store an empty <code>Object</code> object in <code>o</code>:</p>
+
+<pre class="brush: js notranslate">var o = new Object();
+</pre>
+
+<pre class="brush: js notranslate">var o = new Object(undefined);
+</pre>
+
+<pre class="brush: js notranslate">var o = new Object(null);
+</pre>
+
+<h3 id="Using_Object_to_create_Boolean_objects">Using <code>Object</code> to create <code>Boolean</code> objects</h3>
+
+<p>The following examples store {{jsxref("Boolean")}} objects in <code>o</code>:</p>
+
+<pre class="brush: js notranslate">// equivalent to o = new Boolean(true);
+var o = new Object(true);
+</pre>
+
+<pre class="brush: js notranslate">// equivalent to o = new Boolean(false);
+var o = new Object(Boolean());
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2', 'Object')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object-objects', 'Object')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Added Object.assign, Object.getOwnPropertySymbols, Object.setPrototypeOf, Object.is</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object-objects', 'Object')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Added Object.entries, Object.values and Object.getOwnPropertyDescriptors.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Object")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">Object initializer</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/is/index.html b/files/es/web/javascript/reference/global_objects/object/is/index.html
new file mode 100644
index 0000000000..6234fa5cef
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/is/index.html
@@ -0,0 +1,173 @@
+---
+title: Object.is()
+slug: Web/JavaScript/Reference/Global_Objects/Object/is
+tags:
+  - Comparación
+  - Condición
+  - ECMAScript2015
+  - JavaScript
+  - Objeto
+  - condicional
+  - igualdad
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/is
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/is
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.is()</strong></code> determina si dos valores <a href="/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness">son iguales</a>.</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Object.is(<var>valor1</var>, <var>valor2</var>);</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>valor1</code></dt>
+ <dd>Primer valor a comparar.</dd>
+ <dt><code>valor2</code></dt>
+ <dd>Segundo valor a comparar.</dd>
+</dl>
+
+<h3 id="Valor_return_del_método">Valor return del método</h3>
+
+<p>Este método devuelve un valor de tipo {{jsxref("Boolean")}} indicando si los valores pasados como parámetros son iguales o no.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>Object.is()</code> determina si dos valores <a href="/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness">son iguales</a>. Dos valores son iguales si se puede asegurar que:</p>
+
+<ul>
+ <li>ambos son {{jsxref("undefined")}}</li>
+ <li>ambos son {{jsxref("null")}}</li>
+ <li>ambos son <code>true</code> o <code>false</code></li>
+ <li>ambos son strings y tienen la misma longitud con los mismos carácteres</li>
+ <li>ambos son el mismo objeto</li>
+ <li>ambos son números y
+  <ul>
+   <li><code>ambos +0 (mayores que 0)</code></li>
+   <li><code>ambos -0 (menores que 0)</code></li>
+   <li>ambos son {{jsxref("NaN")}}</li>
+   <li>o ambos no son cero o no son de tipo {{jsxref("NaN")}} y tienen el mismo valor</li>
+  </ul>
+ </li>
+</ul>
+
+<p>Esta comparación <em>no</em> es igual a la que realiza el operador {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}}. El operador {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} aplica varias coerciones(comprobaciones) en ambos sentidos (si no tienen el mismo Type) antes de probar la igualdad (lo que resulta en comportamientos como  <code>"" == false</code> siendo <code>true</code>), pero <code>Object.is</code> no obliga a niguno de los valores.</p>
+
+<p>Esta <em>tampoco</em> es igual a la que realiza el operador {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}. El operador {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}} (y el operador {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}}) trata los valores <code>-0</code> <code>y +0</code> como iguales, y además, trata {{jsxref("Number.NaN")}} como no igual a {{jsxref("NaN")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js notranslate">Object.is('foo', 'foo');     // true
+Object.is(window, window);   // true
+
+Object.is('foo', 'bar');     // false
+Object.is([], []);           // false
+
+var test = { a: 1 };
+Object.is(test, test);       // true
+
+Object.is(null, null);       // true
+
+// Special Cases
+Object.is(0, -0);            // false
+Object.is(-0, -0);           // true
+Object.is(NaN, 0/0);         // true
+</pre>
+
+<h2 id="Polyfill_para_navegadores_no_ES6"><a href="https://en.wikipedia.org/wiki/Polyfill">Polyfill</a> para navegadores no ES6</h2>
+
+<p><code>Object.is()</code> es una adición propuesta en el estandar ECMA-262; y como tal, puede no estar presente en todos los navegadores. Para los casos en que no tenga disponible este método, podría utilizar este código haciendolo que se cargue antes que cualquier otro script. Esto permite que puedas utilizar <code>Object.is()</code> en los navegadores que no lo llevan incluído.</p>
+
+<pre class="brush: js notranslate">if (!Object.is) {
+  Object.is = function(x, y) {
+    // SameValue algorithm
+    if (x === y) { // Steps 1-5, 7-10
+      // Steps 6.b-6.e: +0 != -0
+      return x !== 0 || 1 / x === 1 / y;
+    } else {
+      // Step 6.a: NaN == NaN
+      return x !== x &amp;&amp; y !== y;
+    }
+  };
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.is', 'Object.is')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome("30")}}</td>
+   <td>{{CompatGeckoDesktop("22")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("22")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"></h2>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Equality_comparisons_and_sameness">Comparadores de igualdad e identidad</a> —Una comparación de las 3 operaciones de cotejamiento integradas.</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/isextensible/index.html b/files/es/web/javascript/reference/global_objects/object/isextensible/index.html
new file mode 100644
index 0000000000..e1d35ea612
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/isextensible/index.html
@@ -0,0 +1,145 @@
+---
+title: Object.isExtensible()
+slug: Web/JavaScript/Reference/Global_Objects/Object/isExtensible
+tags:
+  - ECMAScript5
+  - JavaScript
+  - JavaScript 1.8.5
+  - Objeto
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/isExtensible
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/isExtensible
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>Object.isExtensible()</code></strong> determina si un objeto es extendible (si puede tener propiedades nuevas agregadas a éste).</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox"><code>Object.isExtensible(<var>obj</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto a ser revisado.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los objetos son extendibles por defecto: ellos pueden tener propiedades nuevas agregadas a ellos, y (en motores que soportan {{jsxref("Object.proto", "__proto__")}} {{deprecated_inline}} la propiedad __proto__) pueden ser modificados. Un objeto puede ser marcado como no extendible usando {{jsxref("Object.preventExtensions()")}}, {{jsxref("Object.seal()")}}, o {{jsxref("Object.freeze()")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">// Los Objetos nuevos son extendibles (por defecto).
+var empty = {};
+Object.isExtensible(empty); // === true
+
+// ...pero eso puede cambiar.
+Object.preventExtensions(empty);
+Object.isExtensible(empty); // === false
+
+// Objetos sellados por definición son no-extendibles.
+var sealed = Object.seal({});
+Object.isExtensible(sealed); // === false
+
+// Objetos congelados también por definición son no-extendibles.
+var frozen = Object.freeze({});
+Object.isExtensible(frozen); // === false
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>En ES5, si el argumento pasado a éste método no es un objeto (primitivo), entonces regresará {{jsxref("TypeError")}}. En ES6, un no-objeto pasado como argumento será tratado como si fuera un objeto no-extendible ordinario, simplemente regresa <code>false</code>.</p>
+
+<pre class="brush: js">Object.isExtensible(1);
+// TypeError: 1 is not an object (ES5 code)
+
+Object.isExtensible(1);
+// false                         (ES6 code)
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.13', 'Object.isExtensible')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.isextensible', 'Object.isExtensible')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("6")}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatOpera("12")}}</td>
+   <td>{{CompatSafari("5.1")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporote básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.preventExtensions()")}}</li>
+ <li>{{jsxref("Object.seal()")}}</li>
+ <li>{{jsxref("Object.isSealed()")}}</li>
+ <li>{{jsxref("Object.freeze()")}}</li>
+ <li>{{jsxref("Object.isFrozen()")}}</li>
+ <li>{{jsxref("Reflect.isExtensible()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/isfrozen/index.html b/files/es/web/javascript/reference/global_objects/object/isfrozen/index.html
new file mode 100644
index 0000000000..fdd9162c7c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/isfrozen/index.html
@@ -0,0 +1,191 @@
+---
+title: Object.isFrozen()
+slug: Web/JavaScript/Reference/Global_Objects/Object/isFrozen
+tags:
+  - ECMAScript5
+  - JavaScript
+  - JavaScript 1.8.5
+  - Objeto
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/isFrozen
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/isFrozen
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.isFrozen()</strong></code> determina si un objeto está <em>congelado</em>.</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox"><code>Object.isFrozen(<var>obj</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto a ser revisado.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Un objeto está congelado si y solo si no es {{jsxref("Object.isExtensible()", "extendible", "", 1)}}, todas sus propiedades son no-configurables, y todos los datos de sus propiedades no tienen capacidad de escritura.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">// Un objeto nuevo es extendible, así que no está congelado.
+Object.isFrozen({}); // === false
+
+// Un objeto vacio el cuál no es extendible está congelado vacuamente.
+var vacuouslyFrozen = Object.preventExtensions({});
+Object.isFrozen(vacuouslyFrozen); // === true
+
+// Un objeto nuevo con una propiedad es tabién extendible, ergo no congelado.
+var oneProp = { p: 42 };
+Object.isFrozen(oneProp); // === false
+
+// Prevenir la extensión de un objeto no lo congela.
+// porque la propiedad sigue teniendo capacidad de configuración (y capacidad de escritura).
+Object.preventExtensions(oneProp);
+Object.isFrozen(oneProp); // === false
+
+// ...pero eliminar la propiedad congela el objeto vacuamente.
+delete oneProp.p;
+Object.isFrozen(oneProp); // === true
+
+// Un ojbeto no-extendible con una propiedad sin capacidad de escritura pero si con capacidad de configuración no está congelado.
+var nonWritable = { e: 'plep' };
+Object.preventExtensions(nonWritable);
+Object.defineProperty(nonWritable, 'e', { writable: false }); // Le quita la capacidad de escritura.
+Object.isFrozen(nonWritable); // === false
+
+// Quitarle la capacidad de configuración a una propiedad congela el objeto.
+Object.defineProperty(nonWritable, 'e', { configurable: false }); // le quita la capacidad de configuración.
+Object.isFrozen(nonWritable); // === true
+
+// Un objeto no-extendible con una propiedad sin capacidad de configuración pero con capacidad de escritura no congela a dicho objeto.
+var nonConfigurable = { release: 'the kraken!' };
+Object.preventExtensions(nonConfigurable);
+Object.defineProperty(nonConfigurable, 'release', { configurable: false });
+Object.isFrozen(nonConfigurable); // === false
+
+// Quitarle la capacidad de configuración a esa propiedad congela el objeto.
+Object.defineProperty(nonConfigurable, 'release', { writable: false });
+Object.isFrozen(nonConfigurable); // === true
+
+// A non-extensible object with a configurable accessor property isn't frozen.
+var accessor = { get food() { return 'yum'; } };
+Object.preventExtensions(accessor);
+Object.isFrozen(accessor); // === false
+
+// ...but make that property non-configurable and it becomes frozen.
+Object.defineProperty(accessor, 'food', { configurable: false });
+Object.isFrozen(accessor); // === true
+
+// But the easiest way for an object to be frozen is if Object.freeze has been called on it.
+var frozen = { 1: 81 };
+Object.isFrozen(frozen); // === false
+Object.freeze(frozen);
+Object.isFrozen(frozen); // === true
+
+// By definition, a frozen object is non-extensible.
+Object.isExtensible(frozen); // === false
+
+// Also by definition, a frozen object is sealed.
+Object.isSealed(frozen); // === true
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>En ES5, si el argumento pasado a éste método no es un objeto (primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un no-objeto pasado como argumento será tratado como si fuera un objeto ordinario congelado, simplemente regresa <code>true</code>.</p>
+
+<pre class="brush: js">Object.isFrozen(1);
+// TypeError: 1 is not an object (ES5 code)
+
+Object.isFrozen(1);
+// true                          (ES6 code)
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.12', 'Object.isFrozen')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>
+    <p>Definición inicial. Implementada en JavaScript 1.8.5.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.isfrozen', 'Object.isFrozen')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristicas</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("6")}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatOpera("12")}}</td>
+   <td>{{CompatSafari("5.1")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristicas</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.freeze()")}}</li>
+ <li>{{jsxref("Object.preventExtensions()")}}</li>
+ <li>{{jsxref("Object.isExtensible()")}}</li>
+ <li>{{jsxref("Object.seal()")}}</li>
+ <li>{{jsxref("Object.isSealed()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/isprototypeof/index.html b/files/es/web/javascript/reference/global_objects/object/isprototypeof/index.html
new file mode 100644
index 0000000000..fc1fed82de
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/isprototypeof/index.html
@@ -0,0 +1,159 @@
+---
+title: Object.prototype.isPrototypeOf()
+slug: Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/isPrototypeOf
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>isPrototypeOf()</strong></code> comprueba si un objeto se encuentra en la cadena de prototipado de otro.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> <code>isPrototypeOf</code> difiere del operador {{jsxref("Operators/instanceof", "instanceof")}}. En la expresión "<code>object instanceof AFunction</code>", la cadena de prototipado de <code>object</code> es comprobada contra <code>AFunction.prototype</code>, no contra la propia <code>AFunction</code>.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>prototypeObj</var>.isPrototypeOf(<var>obj</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>prototypeObj</code></dt>
+ <dd>Un objeto para ver comprobado contra cada vínculo en la cadena de prototipado del argumento <strong>object</strong>.</dd>
+ <dt><code>object</code></dt>
+ <dd>El object sobre cuya cadena de prototipado se realizará la búsqueda.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>isPrototypeOf</code> permite comprobar si un objetyo existe o no en la cadena de prototipado de otro.</p>
+
+<p>Por ejemplo, considerese la siguiente cadena de prototipado:</p>
+
+<pre class="brush: js">function Fee() {
+  // ...
+}
+
+function Fi() {
+  // ...
+}
+Fi.prototype = new Fee();
+
+function Fo() {
+  // ...
+}
+Fo.prototype = new Fi();
+
+function Fum() {
+  // ...
+}
+Fum.prototype = new Fo();
+</pre>
+
+<p>Al final de la secuencia, si se instanci <code>Fum</code> y se necesita verificar si el prototipo de <code>Fi</code> existe en la cadena de prototipado de <code>Fum</code> prototype chain, puede hacerse esto:</p>
+
+<pre class="brush: js">var fum = new Fum();
+// ...
+
+if (Fi.prototype.isPrototypeOf(fum)) {
+  // do something safe
+}
+</pre>
+
+<p>Esto, junto con el operador {{jsxref("Operators/instanceof", "instanceof")}} resulta especialmente útil si se tiene código que sólo puede operar cuando se trata de objetos descendientes de una cadena de prototipado específica, p.e., para garantizar que ciertos métodos o propiedades estén presentes en dichos objetos.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.4.5', 'Object.prototype.hasOwnProperty')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/instanceof", "instanceof")}}</li>
+ <li>{{jsxref("Object.getPrototypeOf()")}}</li>
+ <li>
+  <div>{{jsxref("Object.setPrototypeOf()")}}</div>
+ </li>
+ <li>{{jsxref("Object.prototype.__proto__")}} </li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/issealed/index.html b/files/es/web/javascript/reference/global_objects/object/issealed/index.html
new file mode 100644
index 0000000000..b783633d47
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/issealed/index.html
@@ -0,0 +1,141 @@
+---
+title: Object.isSealed()
+slug: Web/JavaScript/Reference/Global_Objects/Object/isSealed
+tags:
+  - ECMAScript5
+  - JavaScript
+  - JavaScript 1.8.5
+  - Objeto
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/isSealed
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/isSealed
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.isSealed()</strong></code> si el objeto está sellado.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/object-issealed.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code>Object.isSealed(<var>obj</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto que debe ser verificado.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un {{jsxref("Boolean")}} indicando si el objeto dado está sellado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Devuelve <code>true</code> si el objeto está sellado, de lo contrario devuelve <code>false</code>. Un objeto está sellado si no es {{jsxref("Object.isExtensible", "extensible", "", 1)}} y si todas sus propiedades no se pueden configurar y por lo tanto no removibles (pero no necesariamente no modificables).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">// Los objetos no están sellados por defecto
+var empty = {};
+Object.isSealed(empty); // === false
+
+// Si haces un objeto vacío no extendible,
+// está vacíamente sellado
+Object.preventExtensions(empty);
+Object.isSealed(empty); // === true
+
+// Lo mismo no es vedad sobre un objeto no vacío,
+// a menos que sus propiedades son todas no configurables.
+var hasProp = { fee: 'fie foe fum' };
+Object.preventExtensions(hasProp);
+Object.isSealed(hasProp); // === false
+
+// Pero hazlas todas no configurables
+// y el objeto se vuelve sellado.
+Object.defineProperty(hasProp, 'fee', {
+  configurable: false
+});
+Object.isSealed(hasProp); // === true
+
+// La manerá más facil de sellar un objeto, por supuesto,
+// es Object.seal
+var sealed = {};
+Object.seal(sealed);
+Object.isSealed(sealed); // === true
+
+// Un objeto sellado es, por definición, no extendible.
+Object.isExtensible(sealed); // === false
+
+// Un objeto sellado puodría estar congelado,
+// pero no tiene que ser.
+Object.isFrozen(sealed); // === true
+// (Todas las propiedades también no modificables)
+
+var s2 = Object.seal({ p: 3 });
+Object.isFrozen(s2); // === false
+// ('p' todavía es modificable)
+
+var s3 = Object.seal({ get p() { return 0; } });
+Object.isFrozen(s3); // === true
+// (solo la configurabilidad es importante para las propiedades de acceso)
+</pre>
+
+<h2 id="Notes">Notes</h2>
+
+<p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">En ES5, si el argumento de este método no es un objeto (primitivo), entonces causará un </span></font></code>{{jsxref("TypeError")}}. En ES2015, un argumento que no sea un objeto será tratado como si fuera un objeto sellado ordinario, simplemente devuelve <code>true</code>.</p>
+
+<pre class="brush: js">Object.isSealed(1);
+// TypeError: 1 no es un objeto (ES5 code)
+
+Object.isSealed(1);
+// true                          (ES2015 code)
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.11', 'Object.isSealed')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.issealed', 'Object.isSealed')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.issealed', 'Object.isSealed')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Object.isSealed")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Object.seal()")}}</li>
+ <li>{{jsxref("Object.preventExtensions()")}}</li>
+ <li>{{jsxref("Object.isExtensible()")}}</li>
+ <li>{{jsxref("Object.freeze()")}}</li>
+ <li>{{jsxref("Object.isFrozen()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/keys/index.html b/files/es/web/javascript/reference/global_objects/object/keys/index.html
new file mode 100644
index 0000000000..5f55b70857
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/keys/index.html
@@ -0,0 +1,157 @@
+---
+title: Object.keys()
+slug: Web/JavaScript/Reference/Global_Objects/Object/keys
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/keys
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/keys
+---
+<div>{{JSRef("Global_Objects", "Object")}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El método <code>Object.keys()</code> devuelve un array de las propiedades <strong><code>names</code> </strong>de un objeto, en el mismo orden como se obtienen en un loop normal</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>Object.keys(<var>obj</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto cuyas propiedades enumerables serán devueltas.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un array de strings que representan toda las propiedades  del objeto</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>Object.keys</code> devuelve un array cuyos elementos son strings correspondientes a las propiedades enumerables que se encuentran directamente en el object. El orden de las propiedades es el mismo que se proporciona al iterar manualmente sobre las propiedades del objeto.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js notranslate">var arr = ['a', 'b', 'c'];
+console.log(Object.keys(arr)); // console: ['0', '1', '2']
+
+// arreglo como objeto
+var obj = { 0: 'a', 1: 'b', 2: 'c' };
+console.log(Object.keys(obj)); // console: ['0', '1', '2']
+
+// arreglo como objeto con nombres ordenados aleatoriamente
+var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
+console.log(Object.keys(an_obj)); // console: ['2', '7', '100']
+
+// getFoo es una propiedad no enumerable
+var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
+my_obj.foo = 1;
+
+console.log(Object.keys(my_obj)); // console: ['foo']
+</pre>
+
+<p>Si quieres todas las propiedades, incluso las no enumerables, mira {{jsxref("Object.getOwnPropertyNames()")}}.</p>
+
+<h2 id="Notas">Notas</h2>
+
+<p>En ES5, si el argumento para este método no es un objeto (uno primitivo), causará un {{jsxref("Global_Objects/TypeError", "TypeError")}}. En ES2015, un argumento no-objeto será coaccionado hacia un objeto.</p>
+
+<pre class="brush: js notranslate">&gt; Object.keys("foo")
+// TypeError: "foo" is not an object  (ES5)
+
+&gt; Object.keys("foo")
+// ["0", "1", "2"]                    (ES2015)</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Para añadir soporte <code>Object.keys</code> en entornos más antiguos que no lo soportan de forma nativa, copia el siguiente fragmento:</p>
+
+<pre class="brush: js notranslate">// De https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
+if (!Object.keys) {
+  Object.keys = (function() {
+    'use strict';
+    var hasOwnProperty = Object.prototype.hasOwnProperty,
+        hasDontEnumBug = !({ toString: null }).propertyIsEnumerable('toString'),
+        dontEnums = [
+          'toString',
+          'toLocaleString',
+          'valueOf',
+          'hasOwnProperty',
+          'isPrototypeOf',
+          'propertyIsEnumerable',
+          'constructor'
+        ],
+        dontEnumsLength = dontEnums.length;
+
+    return function(obj) {
+      if (typeof obj !== 'object' &amp;&amp; (typeof obj !== 'function' || obj === null)) {
+        throw new TypeError('Object.keys called on non-object');
+      }
+
+      var result = [], prop, i;
+
+      for (prop in obj) {
+        if (hasOwnProperty.call(obj, prop)) {
+          result.push(prop);
+        }
+      }
+
+      if (hasDontEnumBug) {
+        for (i = 0; i &lt; dontEnumsLength; i++) {
+          if (hasOwnProperty.call(obj, dontEnums[i])) {
+            result.push(dontEnums[i]);
+          }
+        }
+      }
+      return result;
+    };
+  }());
+}
+</pre>
+
+<p>Ten en cuenta que el código anterior incluye claves no-enumerables en IE7 (y quizás IE8), al pasar en un objeto desde una ventana diferente.</p>
+
+<p>Para un simple Polyfill del Navegador, mira <a href="http://tokenposts.blogspot.com.au/2012/04/javascript-objectkeys-browser.html">Javascript - Compatibilidad de Object.keys en Navegadores</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.14', 'Object.keys')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-object.keys', 'Object.keys')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.keys', 'Object.keys')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Object.keys")}}</div>
+
+
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Propiedades de enumerabilidad y pertenencia</a></li>
+ <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li>
+ <li>{{jsxref("Object.create()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+ <li>{{jsxref("Object.values()")}}</li>
+ <li>{{jsxref("Object.entries()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/preventextensions/index.html b/files/es/web/javascript/reference/global_objects/object/preventextensions/index.html
new file mode 100644
index 0000000000..3ae7c006d3
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/preventextensions/index.html
@@ -0,0 +1,177 @@
+---
+title: Object.preventExtensions()
+slug: Web/JavaScript/Reference/Global_Objects/Object/preventExtensions
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/preventExtensions
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/preventExtensions
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.preventExtensions()</strong></code> previene que nuevas propiedades sean agregadas a un objeto (p.e. previene la extensión futuras al objeto).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Object.preventExtensions(<var>obj</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto que debería hacerse inextendible.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Un objeto es extendible si propiedades nuevas pueden ser agregadas a este. Object.preventExtensions() marca un objecto como no extendible, así nunca más tendrá propiedades más allá de las tenía en el momento en que fue marcado como no extendible. Note que las propiedades de un objeto no-extendible, en general, aún pueden ser eliminadas. Los intentos de agregar propiedades nuevas a un objeto no-extendible fallarán, ya sea de manera silenciosa o arrojando una excepción {{jsxref("TypeError")}} (comunmente, pero no de manera exclusiva, en {{jsxref("Functions_and_function_scope/Strict_mode", "strict mode", "", 1)}}).</p>
+
+<p><code>Object.preventExtensions()</code> solo previene la adición de propiedades propias. Las propiedades aún pueden ser agregadas a object.prototype. Sin embargo, llamar <code>Object.preventExtensions()</code> sobre un objeto tambien prevendrá extensiones sobre la propiedad {{jsxref("Object.proto", "__proto__")}} {{deprecated_inline}}.</p>
+
+<p>Si hay una manera de cambiar un objeto extendible a uno no-extendible, hay una manera de hacer lo opuesto en ECMAScript 5.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">// Object.preventExtensions regresa el objeto hecho no-extendible.
+var obj = {};
+var obj2 = Object.preventExtensions(obj);
+obj === obj2; // true
+
+// Los Objetos son extendibles por defecto.
+var empty = {};
+Object.isExtensible(empty); // === true
+
+// ...pero pueden ser cambiados.
+Object.preventExtensions(empty);
+Object.isExtensible(empty); // === false
+
+// Object.defineProperty arroja una excepción cuando se agrega
+// una propiedad nueva a un objeto no-extendible.
+var nonExtensible = { removable: true };
+Object.preventExtensions(nonExtensible);
+Object.defineProperty(nonExtensible, 'new', { value: 8675309 }); // arroja TypeError
+
+// En modo estricto, tratar de agregar propiedades nuevas
+// a un objeto no-extensible arroja una excepción TypeError.
+function fail() {
+  'use strict';
+  nonExtensible.newProperty = 'FAIL'; // arroja TypeError
+}
+fail();
+
+// EXTENSION (solo funciona en motores que soporten __proto__
+// (el cual esta obsoleto. Usar Object.getPrototypeOf en su lugar)):
+// La propiedad prototype de un objeto no-extendible es inmutable.
+var fixed = Object.preventExtensions({});
+fixed.__proto__ = { oh: 'hai' }; // arroja TypeError
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>En ES5, si el argumento pasado a este método no es un objeto (primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un argumento no-objeto será tratado como si fuera un objeto ordinario no-extendible, simplemente lo regresa.</p>
+
+<pre class="brush: js">Object.preventExtensions(1);
+// TypeError: 1 is not an object (ES5 code)
+
+Object.preventExtensions(1);
+// 1                             (ES6 code)
+</pre>
+
+<h2 id="Especificación">Especificación</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.10', 'Object.preventExtensions')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementada en JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.preventextensions', 'Object.preventExtensions')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("6")}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatOpera("12")}}</td>
+   <td>{{CompatSafari("5.1")}}</td>
+  </tr>
+  <tr>
+   <td>Comportamiento en ES6 para un no-objeto pasado como argumento</td>
+   <td>{{CompatChrome("44")}}</td>
+   <td>{{CompatGeckoDesktop("35.0")}}</td>
+   <td>{{CompatIE("11")}}</td>
+   <td>{{CompatOpera("31")}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Comportamiento en ES6 para no-objetos pasados como argumentos</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("35.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li>{{jsxref("Object.isExtensible()")}}</li>
+ <li>{{jsxref("Object.seal()")}}</li>
+ <li>{{jsxref("Object.isSealed()")}}</li>
+ <li>{{jsxref("Object.freeze()")}}</li>
+ <li>{{jsxref("Object.isFrozen()")}}</li>
+ <li>{{jsxref("Reflect.preventExtensions()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/propertyisenumerable/index.html b/files/es/web/javascript/reference/global_objects/object/propertyisenumerable/index.html
new file mode 100644
index 0000000000..b67d46d680
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/propertyisenumerable/index.html
@@ -0,0 +1,186 @@
+---
+title: Object.prototype.propertyIsEnumerable()
+slug: Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable
+tags:
+  - JavaScript
+  - Objecto
+  - Property
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/propertyIsEnumerable
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>propertyIsEnumerable()</strong></code> regresa un Boleano indicando si la propiedad especificada es enumerable.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>obj</var>.propertyIsEnumerable(<var>prop</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>prop</code></dt>
+ <dd>Nombre de la propiedad a probar.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Todos los objetos tienen un método <code>propertyIsEnumerable</code>. Este método puede determinar si la propiedad especificada en el objeto puede ser enumerada por un ciclo {{jsxref("Statements/for...in", "for...in")}}, con la excepción de propiedades heredadas a través de prototype. Si el objeto no tiene la propiedad especificada, este método regresa un valor <code>false</code>.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Uso_básico_de_propertyIsEnumerable">Uso básico de <code>propertyIsEnumerable</code></h3>
+
+<p>El siguiente ejemplo muestra el uso de <code>propertyIsEnumerable</code> en objetos y arrays:</p>
+
+<pre class="brush: js">var o = {};
+var a = [];
+o.prop = 'es enumerable';
+a[0] = 'es enumerable';
+
+o.propertyIsEnumerable('prop');   // regresa true
+a.propertyIsEnumerable(0);        // regresa true
+</pre>
+
+<h3 id="Definidas_por_usuario_vs_predefinidas">Definidas por usuario vs predefinidas</h3>
+
+<p>El siguiente ejemplo demuestra la enumerabilidad de las propiedades definidas por el usuario contra las predefinidas:</p>
+
+<pre class="brush: js">var a = ['es enumerable'];
+
+a.propertyIsEnumerable(0);          // regresa true
+a.propertyIsEnumerable('length');   // regresa false
+
+Math.propertyIsEnumerable('random');   // regresa false
+this.propertyIsEnumerable('Math');     // regresa false
+</pre>
+
+<h3 id="Directa_vs_heredadas">Directa vs  heredadas</h3>
+
+<pre class="brush: js">var a = [];
+a.propertyIsEnumerable('constructor');         // regresa false
+
+function primerConstructor() {
+  this.propiedad = 'no es enumerable';
+}
+
+primerConstructor.prototype.primerMetodo = function() {};
+
+function segundoConstructor() {
+  this.metodo = function() { return 'es enumerable'; };
+}
+
+secondConstructor.prototype = new primerConstructor;
+secondConstructor.prototype.constructor = segundoConstructor;
+
+var o = new segundoConstructor();
+o.propiedadArbitraria = 'is enumerable';
+
+o.propertyIsEnumerable('propiedadArbitraria ');   // regresa true
+o.propertyIsEnumerable('metodo');                 // regresa true
+o.propertyIsEnumerable('propiedad');              // regresa false
+
+o.propiedad = 'es enumerable';
+
+o.propertyIsEnumerable('propiedad');              // regresa true
+
+// Regresan false por estar en el prototipo el cual no es
+// considerado por propertyIsEnumerable (a pesar de que las dos ultimas son
+// iterables con un for-in)
+o.propertyIsEnumerable('prototype');   // regresa false (como en JS 1.8.1/FF3.6)
+o.propertyIsEnumerable('constructor'); // regresa false
+o.propertyIsEnumerable('firstMethod'); // regresa false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.4.7', 'Object.prototype.propertyIsEnumerable')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.prototype.propertyisenumerable', 'Object.prototype.propertyIsEnumerable')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h2>
+
+<p>Al inicio de JavaScript 1.8.1 (in Firefox 3.6), <code>propertyIsEnumerable('prototype')</code> regresa <code>false</code> en lugar de <code>true</code>; esto hace que el resultado cumpla con la especificación de ECMAScript 5.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
+ <li>{{jsxref("Statements/for...in", "for...in")}}</li>
+ <li>{{jsxref("Object.keys()")}}</li>
+ <li>{{jsxref("Object.defineProperty()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/proto/index.html b/files/es/web/javascript/reference/global_objects/object/proto/index.html
new file mode 100644
index 0000000000..e47ded2e92
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/proto/index.html
@@ -0,0 +1,129 @@
+---
+title: Object.prototype.__proto__
+slug: Web/JavaScript/Reference/Global_Objects/Object/proto
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/proto
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/proto
+---
+<div class="warning">
+<p><strong>Advertencia:</strong> Cambiar la propiedad <code>[[Prototype]]</code> de un objeto es, por como los navegadores modernos optimizan las propiedades de acceso, una operación muy lenta en <strong><em>todos</em></strong> los navegadores y motores JavaScript. Los efectos en el rendimiento de alterar la herencia son muchos y delicados, y no se limita simplemente al tiempo que necesita la asignación <code>obj.__proto__ = ...</code> sentencia,  sin embargo afecta a  <strong><em>cualquier</em></strong> código que tiene acceso a  <strong><em>cualquier</em></strong> objeto cuya propiedad <code>[[Prototype]]</code> ha sido alterada, por lo que se debe de tener mucho cuidado.</p>
+
+<p>Si el rendimiento en tu aplicación es necesario, deberías evitar modificar la propiedad <code>[[Prototype]]</code> de un objeto. En su lugar, crea un objecto nuevo con la propiedad <code>[[Prototype]]</code> deseada usando {{jsxref("Object.create()")}}.</p>
+</div>
+
+<div class="warning">
+<p><strong>Advertencia:</strong> Mientras <code>Object.prototype.__proto__</code> es soportado hoy día por la mayoría de navegadores, su existencia y comportamiento exacto solo ha sido estandarizado en la especificación ECMAScript 6 como una característica de legado y para asegurar la compatibilidad entre los navegadores web. Para tener un mejor soporte, es recomendable que se utilice {{jsxref("Object.getPrototypeOf()")}} para obtener el prototipo de un objeto.</p>
+</div>
+
+<div>{{JSRef}}</div>
+
+<p>La propiedad <code>__proto__</code> de {{jsxref("Object.prototype")}} es una propiedad llamada de acceso (una función getter y también función setter) que provee acceso al interior de <code>[[Prototype]]</code> (ya sea un objeto o {{jsxref("Global_Objects/null", "null")}}) del objeto a través del cual se accede a ella.</p>
+
+<p>El uso de la propiedad <code>__proto__</code> es polémico actualmente, y está rechazado. Originalmente, nunca fué incluído en la especificación de EcmaScript, pero los navegadores modernos decidieron implementarla de todas maneras. Sólo actualmente, <code>la propiedad __proto__</code> ha sido estandarizada en la especificación del lenguaje ECMAScript 6, para asegurar la compatibilidad entre navegadores, por lo tanto, esta será soportada en el futuro. Actualmente está obsoleta  en favor de {{jsxref("Object.getPrototypeOf")}}/{{jsxref("Reflect.getPrototypeOf")}} y {{jsxref("Object.setPrototypeOf")}}/{{jsxref("Reflect.setPrototypeOf")}} (aunque todavía establecer el <code>[[Prototype]]</code> de un objeto es una operación muy lenta, por lo que si nos preocupa el rendimiento, debemos de evitarlo).</p>
+
+<p>La propiedad <code>__proto__</code> puede ser usada también en un objeto definido de forma literal, para establecer el <code>[[Prototype]]</code> en la creación de este, como alternativa a {{jsxref("Object.create()")}}. Ver: <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer / literal syntax</a>.</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="brush: js">var shape = {};
+var circle = new Circle();
+
+// Establecer el objeto prototype.
+// OBSOLETO. Esto es solo un ejemplo. NO HACER ESTO en código real.
+shape.__proto__ = circle;
+
+// Obtener el objeto prototype
+console.log(shape.__proto__ === circle); // true
+</pre>
+
+<p>Nota: esto es, dos guiones bajos, seguidos de cinco carácteres "proto", seguido de dos guiones bajos mas.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La función getter <code>__proto__</code>el valor interno del <code>[[Prototype]]</code> de un objeto. Para objetos creados usando un objeto literal, el valor es {{jsxref("Object.prototype")}}. Para objetos creados usando literales de array, este valor es {{jsxref("Array.prototype")}}. Para funciones, este valor {{jsxref("Function.prototype")}}. Para objetos creados utilizando el operador new fun, donde <strong>fun</strong> es una función constructora incluída en JavaScript  ({{jsxref("Array")}}, {{jsxref("Boolean")}}, {{jsxref("Date")}}, {{jsxref("Number")}}, {{jsxref("Object")}}, {{jsxref("String")}}, etcétera—incluyendo nuevos contrusctores conforme JavaScript evoluciona), este valor es <code>fun.prototype</code>.  (Esto es, si el constructor no devuelve un objeto de forma explícita, o el <code>fun.prototype</code> ha sido reasignado desde que la instancia fué creada).</p>
+
+<p>El <code>__proto__</code> setter la mutación del objeto <code>[[Prototype]]</code> de un objeto. El objeto debe ser extensible según {{jsxref("Object.isExtensible()")}}: si no, un {{jsxref("Global_Objects/TypeError", "TypeError")}} es lanzado. El valor proveído debe ser un objeto o {{jsxref("Global_Objects/null", "null")}}. Provetendo otro tipo de valor no hará nada.</p>
+
+<p>Para entender como los prototipos son usados para herencia, ver el artículo <a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">Inheritance and the prototype chain</a>.</p>
+
+<p>La propiedad <code>__proto__</code> es una simple propiedad de acceso a {{jsxref("Object.prototype")}} que consiste en una función getter y setter. Un acceso a la propiedad  <code>__proto__</code> que eventualmente consulta {{jsxref("Object.prototype")}} encontrará esta propiedad, pero un acceso que no consulta {{jsxref("Object.prototype")}} no lo encontrará. Si alguna otra propiedad <code>__proto__</code> es encontrada antes {{jsxref("Object.prototype")}} es consultada, esta propiedad sera ocultada por la encontrada en {{jsxref("Object.prototype")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-additional-properties-of-the-object.prototype-object', 'Object.prototype.__proto__')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Incluída en el anexo (normativa) para características de legado ECMAScript para navegadores web (observar que la especificación de codificación es lo que ya está en las implementaciones).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatIE("11")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Caracteristica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
+
+<p>Mientras la especificación ECMAScript 2015 (ES6) dicta que el soporte para <code>__proto__</code> es requerido <em>solo</em> para navegadores web (a pesar de ser normativo), otros medios pueden soportarlo por uso de legado.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li>
+ <li>{{jsxref("Object.getPrototypeOf()")}}</li>
+ <li>{{jsxref("Object.setPrototypeOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/seal/index.html b/files/es/web/javascript/reference/global_objects/object/seal/index.html
new file mode 100644
index 0000000000..33c3065088
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/seal/index.html
@@ -0,0 +1,168 @@
+---
+title: Object.seal()
+slug: Web/JavaScript/Reference/Global_Objects/Object/seal
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/seal
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/seal
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.seal()</strong></code> sella un objeto, previniendo que puedan añadirse nuevas propiedades al mismo, y marcando todas las propiedades existentes como no-configurables. Los valores de las propiedades presentes permanecen pudiendo cambiarse en tanto en cuanto dichas propiedades sean de escritura.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Object.seal(<var>obj</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto que ha de ser sellado.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Por defecto, los objetos son {{jsxref("Object.isExtensible()", "extensibles", "", 1)}} (pueden añadirse nuevas propiedades a los mismos). Sellar un objeto previene que nuevas propiedades puedan ser añadidas y marca todas las propiedades existentes como no-configurables. Esto tiene el efecto de hacer fijo e inmutable el juego de propiedades del objeto. Al hacer todas las propiedades no-configurables previene también que se puedan convertir propiedades de datos en propiedades de acceso y viceversa, pero no evita que los valores de las propiedades de datos puedan ser modificados. Intentar eliminar o añadir propiedades a un objeto sellado, o convertir una propiedad de datos en una propiedad de acceso fallará, bien silenciadamente o bien produciendo un {{jsxref("TypeError")}} (más frecuentemente, aunque no exclusivamente, con código en {{jsxref("Strict_mode", "modo estricto", "", 1)}}).</p>
+
+<p>La cadena de prototiado permanece inalterada. No obstante, la propiedad {{jsxref("Object.proto", "__proto__")}} {{deprecated_inline}} es también sellada.</p>
+
+<p>Retorna una referencia al Objeto pasado.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">var obj = {
+  prop: function() {},
+  foo: 'bar'
+};
+
+// Pueden añadirse nuevas propiedades, propiedades existentes pueden cambiarse o eliminarse.
+obj.foo = 'baz';
+obj.lumpy = 'woof';
+delete obj.prop;
+
+var o = Object.seal(obj);
+
+o === obj; // true
+Object.isSealed(obj); // === true
+
+// Sigue permitido modificar valores de propiedades en un objeto sellado.
+obj.foo = 'quux';
+
+// Pero no puedes convertir propiedades de datos en propiedades de acceso, ni viveversa
+Object.defineProperty(obj, 'foo', { get: function() { return 'g'; } }); // produce un TypeError
+
+// Ahora, cualquier cambio que no sea modificar valores de propiedades fallará
+obj.quaxxor = 'the friendly duck'; // silenciosamente, no añadirá la propiedad
+delete obj.foo; // silenciosamente, no eliminará la propiedad
+
+// ...y en modo estricto esos intentos producirán TypeErrors.
+function fail() {
+  'use strict';
+  delete obj.foo; // genera un TypeError
+  obj.sparky = 'arf'; // genera un TypeError
+}
+fail();
+
+// Intentar añadir propiedades mediante Object.defineProperty también fallará.
+Object.defineProperty(obj, 'ohai', { value: 17 }); // genera un TypeError
+Object.defineProperty(obj, 'foo', { value: 'eit' }); // cambia el valor exisitente
+</pre>
+
+<h2 id="Notas">Notas</h2>
+
+<p>En ES5, si el argumento de este método no es un objeto (una primitiva), se generará un {{jsxref("TypeError")}}. En ES6, un argumento no-objeto será tratado como si se sellase un objeto ordinario, símplemente retornándolo.</p>
+
+<pre class="brush: js">Object.seal(1);
+// TypeError: 1 no es un objeto (código ES5)
+
+Object.seal(1);
+// 1                             (código ES6)
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Observaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.3.8', 'Object.seal')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial. Implementado en  JavaScript 1.8.5.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.seal', 'Object.seal')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.seal', 'Object.seal')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestación</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("6")}}</td>
+   <td>{{CompatGeckoDesktop("2.0")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatOpera("12")}}</td>
+   <td>{{CompatSafari("5.1")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Prestiación</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.isSealed()")}}</li>
+ <li>{{jsxref("Object.preventExtensions()")}}</li>
+ <li>{{jsxref("Object.isExtensible()")}}</li>
+ <li>{{jsxref("Object.freeze()")}}</li>
+ <li>{{jsxref("Object.isFrozen()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/setprototypeof/index.html b/files/es/web/javascript/reference/global_objects/object/setprototypeof/index.html
new file mode 100644
index 0000000000..d7b19fea89
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/setprototypeof/index.html
@@ -0,0 +1,238 @@
+---
+title: Object.setPrototypeOf()
+slug: Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf
+tags:
+  - ECMAScript6
+  - Experimental
+  - JavaScript
+  - Método(2)
+  - Objeto
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/setPrototypeOf
+---
+<p>{{JSRef}}</p>
+
+<p>El método <code><strong>Object.setPrototypeOf()</strong></code> establece el prototipo (p.e., la propiedad interna <code>[[Prototype]]</code>) de un objeto especificado a otro objeto o sino establece {{jsxref("null")}}.</p>
+
+<div class="warning">
+<p><strong>Adverdencia:</strong> Cambiar la propiedad <code>[[Prototype]]</code> de un objeto, debido a la naturaleza de la optimización del acceso a propiedades de los motores modernos de JavaScript, es una operación bastante lenta, en todo <strong><em>todo</em></strong> navegador y motor de JavaScript. Los efectos sobre el rendimiento al alterar la herencia son sutiles y vastos., y no están limitados a simplemente el tiempo gastado en la sentencia <code>obj.__proto___ = ...</code>,  but may extend to <strong><em>any</em></strong> code that has access to <strong><em>any</em></strong> object whose <code>[[Prototype]]</code> has been altered. If you care about performance you should avoid setting the <code>[[Prototype]]</code> of an object. Instead, create a new object with the desired <code>[[Prototype]]</code> using {{jsxref("Object.create()")}}.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Object.setPrototypeOf(<var>obj</var>, <var>prototype</var>);</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>El objeto al que se ha de establecer el prototipo.</dd>
+ <dt><code>prototype</code></dt>
+ <dd>El nuevo prototipo del objeto, (un objeto o {{jsxref("null")}}).</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Arroja una excepción del tipo {{jsxref("TypeError")}} si el objeto cuyo <code>[[Prototype]]</code> se va a modificar no es extensible de acuerdo con {{jsxref("Object.isExtensible()")}}. No hace nada si el parametro <code>prototype</code> no es un objeto o {{jsxref("null")}} (p.e., número, cadena, booleano, o {{jsxref("undefined")}}). De cualquier otra forma, este método cambia la propiedad <code>[[Prototype]]</code> del <code>obj</code> al valor nuevo.</p>
+
+<p><code>Object.setPrototypeOf()</code> está en el último borrador del estandar ECMAScript6. Es considerado generalmente la manera adecuada de establecer el prototipo de un objeto, contra la propiedad más controversial {{jsxref("Object.prototype.__proto__")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">var dict = Object.setPrototypeOf({}, null);
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Utilizando la vieja propiedad {{jsxref("Object.prototype.__proto__")}}, podemos definir facilmente <code>Object.setPrototypeOf</code> si aún no está disponible:</p>
+
+<pre class="brush: js">// Solo funciona en Chrome y FirefoxOnly works in Chrome y FireFox, no funciona en IE:
+Object.setPrototypeOf = Object.setPrototypeOf || function(obj, proto) {
+  obj.__proto__ = proto;
+  return obj;
+}
+</pre>
+
+<h2 id="Agregando_cadenas_de_prototipo">Agregando cadenas de prototipo</h2>
+
+<p>Una combinación de <code>Object.getPrototypeOf()</code> y {{jsxref("Object.proto", "Object.prototype.__proto__")}} permite agregar una nueva cadena de prototipos al nuevo  prototipo del objeto.</p>
+
+<pre class="brush: js">/**
+*** Object.appendChain(@object, @prototype)
+*
+* Agrega el primer prototipo no-nativo de una cadena a un nuevo prototipo.
+* Retorna @object (si es Primitivo (Primitive value) será transoformado a Objeto).
+*
+*** Object.appendChain(@object [, "@arg_name_1", "@arg_name_2", "@arg_name_3", "..."], "@function_body")
+*** Object.appendChain(@object [, "@arg_name_1, @arg_name_2, @arg_name_3, ..."], "@function_body")
+*
+*  Agrega el primer prototipo no-nativo de una cadena a la Function.prototype nativa del objeto, luego agrega una
+* ueva Function(["@arg"(s)], "@function_body") a la cadena.
+* Retorna la función.
+*
+**/
+
+Object.appendChain = function(oChain, oProto) {
+  if (arguments.length &lt; 2) {
+    throw new TypeError('Object.appendChain - Not enough arguments');
+  }
+  if (typeof oProto === 'number' || typeof oProto === 'boolean') {
+    throw new TypeError('second argument to Object.appendChain must be an object or a string');
+  }
+
+  var oNewProto = oProto,
+      oReturn = o2nd = oLast = oChain instanceof this ? oChain : new oChain.constructor(oChain);
+
+  for (var o1st = this.getPrototypeOf(o2nd);
+    o1st !== Object.prototype &amp;&amp; o1st !== Function.prototype;
+    o1st = this.getPrototypeOf(o2nd)
+  ) {
+    o2nd = o1st;
+  }
+
+  if (oProto.constructor === String) {
+    oNewProto = Function.prototype;
+    oReturn = Function.apply(null, Array.prototype.slice.call(arguments, 1));
+    this.setPrototypeOf(oReturn, oLast);
+  }
+
+  this.setPrototypeOf(o2nd, oNewProto);
+  return oReturn;
+}
+</pre>
+
+<h3 id="Uso">Uso</h3>
+
+<h4 id="Primer_ejemplo_Agregar_una_cadena_a_un_prototipo">Primer ejemplo: Agregar una cadena a un prototipo</h4>
+
+<pre class="brush: js">function Mammal() {
+  this.isMammal = 'yes';
+}
+
+function MammalSpecies(sMammalSpecies) {
+  this.species = sMammalSpecies;
+}
+
+MammalSpecies.prototype = new Mammal();
+MammalSpecies.prototype.constructor = MammalSpecies;
+
+var oCat = new MammalSpecies('Felis');
+
+console.log(oCat.isMammal); // 'yes'
+
+function Animal() {
+  this.breathing = 'yes';
+}
+
+Object.appendChain(oCat, new Animal());
+
+console.log(oCat.breathing); // 'yes'
+</pre>
+
+<h4 id="Segundo_ejemplo_Transofrmando_un_valor_Primitivo_en_una_instancia_de_su_constructor_y_agregar_su_cadena_al_prototipo">Segundo ejemplo: Transofrmando un valor Primitivo en una instancia de su constructor y agregar su cadena al prototipo</h4>
+
+<pre class="brush: js">function Symbol() {
+  this.isSymbol = 'yes';
+}
+
+var nPrime = 17;
+
+console.log(typeof nPrime); // 'number'
+
+var oPrime = Object.appendChain(nPrime, new Symbol());
+
+console.log(oPrime); // '17'
+console.log(oPrime.isSymbol); // 'yes'
+console.log(typeof oPrime); // 'object'
+</pre>
+
+<h4 id="Tercer_ejemplo_Agregando_una_cadena_a_la_Function.prototype_de_un_objeto_y_agregando_una_nueva_función_a_la_cadena">Tercer ejemplo: Agregando una cadena a la Function.prototype de un objeto y agregando una nueva función a la cadena</h4>
+
+<pre class="brush: js">function Person(sName) {
+  this.identity = sName;
+}
+
+var george = Object.appendChain(new Person('George'),
+                                'console.log("Hello guys!!");');
+
+console.log(george.identity); // 'George'
+george(); // 'Hello guys!!'
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.setprototypeof', 'Object.setProtoypeOf')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome("34")}}</td>
+   <td>{{CompatGeckoDesktop("31")}}</td>
+   <td>{{CompatIE("11")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("31")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Reflect.setPrototypeOf()")}}</li>
+ <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li>
+ <li>{{jsxref("Object.getPrototypeOf()")}}</li>
+ <li>{{jsxref("Object.prototype.__proto__")}} </li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/tolocalestring/index.html b/files/es/web/javascript/reference/global_objects/object/tolocalestring/index.html
new file mode 100644
index 0000000000..8e9f152bd1
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/tolocalestring/index.html
@@ -0,0 +1,107 @@
+---
+title: Object.prototype.toLocaleString()
+slug: Web/JavaScript/Reference/Global_Objects/Object/toLocaleString
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/toLocaleString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/toLocaleString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>toLocaleString()</strong></code> devuelve un string que representa a un objeto. Este método está pensado para ser redefinido en los objetos derivados, para los propósitos específicos de cada configuración regional.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/object-prototype-tolocalestring.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>objeto</var>.toLocaleString()</pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un string que representa al objeto.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>{{jsxref("Object")}}'s <code>toLocaleString</code> devuelve el resultado de llamar a {{jsxref("Object.toString", "toString()")}}.</p>
+
+<p>Se proporciona esta función para que los objetos dispongan de un método <code>toLocaleString</code> genérico, aunque puede que no todos la utilicen. Véase la lista siguiente.</p>
+
+<h3 id="Objetos_que_redefinen_toLocaleString">Objetos que redefinen <code>toLocaleString</code></h3>
+
+<ul>
+ <li>{{jsxref("Array")}}: {{jsxref("Array.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("Number")}}: {{jsxref("Number.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("Date")}}: {{jsxref("Date.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("TypedArray")}}: {{jsxref("TypedArray.prototype.toLocaleString()")}}</li>
+ <li>{{jsxref("BigInt")}}: {{jsxref("BigInt.prototype.toLocaleString()")}}</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Redefinición_de_toLocaleString_en_Array">Redefinición de toLocaleString() en Array</h3>
+
+<p>En los objetos <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></code> se puede utilizar <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/toLocaleString">toLocaleString()</a></code> para imprimir los valores del <em>array</em> como un string, con indicadores opcionales de configuración regional (como símbolos de moneda) aplicados.</p>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: js notranslate">const unArray = [4, 7, 10];
+
+let preciosEnEuros = unArray.toLocaleString('fr', { style: 'currency', currency: 'EUR'});
+// "4,00 €,7,00 €,10,00 €"</pre>
+
+<h3 id="Redefinición_de_toLocaleString_para_Date">Redefinición de toLocaleString() para Date</h3>
+
+<p>En los objetos <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date">Date</a></code> se usa <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString">toLocaleString()</a></code> para imprimir fechas en un formato adecuado a la configuración regional.</p>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: js notranslate">const unaFecha = new Date(Date.now());
+// <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox"><span class="objectTitle">"</span>2020-07-07T19:51:44.046Z<span class="Date">"
+
+</span></span></span></span></span>let fechaAleman = unaFecha.toLocaleString('de');
+// "7.7.2020, 21:55:22"
+
+var fechaFrances= unaFecha.toLocaleString('fr');
+//"07/07/2020 à 21:55:22"</pre>
+
+<h3 id="Redefinición_de_toLocaleString_para_Number">Redefinición de toLocaleString() para Number</h3>
+
+<p>En los objetos <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">Number</a></code> se usa <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString">toLocaleString()</a></code> para imprimir números de forma adecuada a la configuración regional, p. ej. para usar los separadores de miles correctos.</p>
+
+<p>Por ejemplo:</p>
+
+<pre class="brush: js notranslate">const unNumero = 2901234564;
+// <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox objectBox-number">"2901234564"
+
+</span></span></span></span>let numeroAleman = unNumero.toLocaleString('de');
+// "2.901.234.564"
+
+let numeroFrances = unNumero.toLocaleString('fr');
+// "2 901 234 564"</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.prototype.tolocalestring', 'Object.prototype.toLocaleString')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Object.toLocaleString")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/tosource/index.html b/files/es/web/javascript/reference/global_objects/object/tosource/index.html
new file mode 100644
index 0000000000..da317bd2e1
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/tosource/index.html
@@ -0,0 +1,127 @@
+---
+title: Object.prototype.toSource()
+slug: Web/JavaScript/Reference/Global_Objects/Object/toSource
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/toSource
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/toSource
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>El método <strong><code>toSource()</code></strong> regresa una cadena representando el código fuente del objeto.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code>Object.toSource();
+<var>obj</var>.toSource();
+</code></pre>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>Una cadena representando el código fuente del objeto.</p>
+
+<h2 id="Description">Description</h2>
+
+<p>EL método <code>toSource()</code> regresa los siguientes valores:</p>
+
+<ul>
+ <li>Para el objeto incorporado {{jsxref("Object")}}, <code>toSource()</code> regresa la siguiente cadena indicando que el código fuente no está disponible:
+
+  <pre class="brush: js">function Object() {
+    [native code]
+}
+</pre>
+ </li>
+ <li>Para instancias de {{jsxref("Object")}}, <code>toSource()</code> regresa una cadena representando el código fuente.</li>
+</ul>
+
+<p>Puedes llamar el método <code>toSource()</code> durante el depurado para examinar el contenido de un objeto.</p>
+
+<h3 id="Sobreescribir_el_método_toSource()"><code><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="background-color: #333333;">Sobreescribir el método </span></font>toSource()</code></h3>
+
+<p>Es seguro para los objetos sobreescribir el método <strong>toSource()</strong><strong>.</strong> Por ejemplo:</p>
+
+<pre class="brush: js">function Person(name) {
+  this.name = name;
+}
+
+Person.prototype.toSource = function Person_toSource() {
+  return 'new Person(' + uneval(this.name) + ')';
+};
+
+console.log(new Person('Joe').toSource()); // ---&gt; nueva Person("Joe")
+</pre>
+
+<h3 id="Métodos_de_toSource()_incorporados">Métodos de <code>toSource()</code> incorporados</h3>
+
+<p>Cada tipo fundamental de JavaScript tiene su propio método <code>toSource()</code>.  Éstos objetos son:</p>
+
+<ul>
+ <li>{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Array")}} object.</li>
+ <li>{{jsxref("Boolean.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Boolean")}} object.</li>
+ <li>{{jsxref("Date.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Date")}} object.</li>
+ <li>{{jsxref("Function.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Function")}} object.</li>
+ <li>{{jsxref("Number.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Number")}} object.</li>
+ <li>{{jsxref("RegExp.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("RegExp")}} object.</li>
+ <li>{{jsxref("SIMD.toSource()", "SIMD.%type%.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("SIMD")}} objects.</li>
+ <li>{{jsxref("String.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("String")}} object.</li>
+ <li>{{jsxref("Symbol.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Symbol")}} object.</li>
+ <li><code>Math.toSource()</code> — Regrsa la cadena "Math".</li>
+</ul>
+
+<h3 id="Limitaciones_en_objetos_cíclicos">Limitaciones en objetos cíclicos</h3>
+
+<p>EN el caso de los objetos que contienen referencia a ellos mismos, por ejemplo, una lista enlazada cíclicamente o un árbol que puede ser atravesado en ambas formas, <code>toSource()</code> no recreará la referencia a sí mismo, a partir de Firefox 24. Por ejemplo:</p>
+
+<pre class="brush: js">var obj1 = {};
+var obj2 = { a: obj1 };
+obj1.b = obj2;
+
+console.log('Ciclico: ' + (obj1.b.a == obj1));
+
+var objSource = obj1.toSource(); // regresa "({b:{a:{}}})"
+
+obj1 = eval(objSource);
+
+console.log('Ciclico: ' + (obj1.b.a == obj1));
+</pre>
+
+<p>Si una estructura cíclica es usada y se necesita el método <code>toSource()</code>, el objeto debe proveer la sobreescritura de <code>toSource()</code>, ya sea usando una referencia a un constructor o proveyendo una función anónima.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toSource()">Usando <code>toSource()</code></h3>
+
+<p>El código siguiente define el objeto tipo <code>Dog</code> y crea a <code>theDog</code>, un objeto tipo <code>Dog</code>:</p>
+
+<pre class="brush: js">function Dog(name, breed, color, sex) {
+  this.name = name;
+  this.breed = breed;
+  this.color = color;
+  this.sex = sex;
+}
+
+theDog = new Dog('Gabby', 'Lab', 'chocolate', 'female');
+</pre>
+
+<p>Llamando al método <code>toSource() de</code> <code>theDog</code> muestra el código JavaScript que define al objeto:</p>
+
+<pre class="brush: js">theDog.toSource();
+// returns ({name:"Gabby", breed:"Lab", color:"chocolate", sex:"female"})
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ningún estándar. Implementado en JavaScript 1.3.</p>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Object.toSource")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/tostring/index.html b/files/es/web/javascript/reference/global_objects/object/tostring/index.html
new file mode 100644
index 0000000000..0b1605afa8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/tostring/index.html
@@ -0,0 +1,71 @@
+---
+title: Object.prototype.toString()
+slug: Web/JavaScript/Reference/Global_Objects/Object/toString
+tags:
+  - JavaScript
+  - Method
+  - Object
+  - Prototype
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/toString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/toString
+---
+<div>{{JSRef("Objetos_globales", "Object")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Devuelve una cadena que representa al objeto.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<p><code>toString() </code></p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Todos los objetos tienen un método <code>toString</code> que se llama automáticamente cuando el objeto se representa como un valor de texto o cuando un objeto se referencia de tal manera que se espera una cadena. Por defecto, el método <code>toString</code> es heredado por todos los objetos que descienden de <code>Object</code>. Si este método no se sobreescribe en el objeto personalizado, <code>toString</code> devuelve <code>{{ mediawiki.external('object<em>type</em> ') }}</code>, donde <code><em>type</em> </code> es el tipo de objeto. El siguiente código ilustra esto:</p>
+
+<pre class="brush: js">var objeto = new Object();
+objeto.toString(); // Devuelve [object Object]
+</pre>
+
+<h3 id="Examples" name="Examples">Ejemplos</h3>
+
+<h4 id="Sobreescribir_el_m.C3.A9todo_por_defecto_toString" name="Sobreescribir_el_m.C3.A9todo_por_defecto_toString">Sobreescribir el método por defecto <code>toString</code></h4>
+
+<p>Puede crear una función que sea llamada en lugar del método predeterminado <code>toString</code>. El método <code>toString</code> no toma argumentos y debería devolver una cadena. El método <code>toString</code> que cree puede ser cualquier valor que quiera, pero será más útil si aporta información sobre el objeto.</p>
+
+<p>El siguiente código define el tipo de objeto <code>Perro</code> y crea <code>elPerro</code>, un objeto de tipo <code>Perro</code>:</p>
+
+<pre class="brush: js">function Perro(nombre,criadero,color,sexo) {
+   this.nombre=nombre;
+   this.criadero=criadero;
+   this.color=color;
+   this.sexo=sexo;
+}
+
+elPerro = new Perro("Gabby","Laboratorio","chocolate","femenino")
+</pre>
+
+<p>Si llama al método <code>toString</code> en el objeto personalizado, devuelve el valor predeterminado heredado de <code>Object</code>:</p>
+
+<pre class="brush: js">elPerro.toString() //devuelve [object Object]
+</pre>
+
+<p>El siguiente código crea y asigna <code>perroToString</code> para sobreescribir el método predeterminado <code>toString</code>. Esta función genera una cadena que contiene nombre, criadero, color, y sexo del objeto, en la forma "<code>propiedad = valor;</code>".</p>
+
+<pre class="brush: js">Perro.prototype.toString = function perroToString() {
+  var retorno = "Perro " + this.nombre + " es " + this.sexo + " " + this.color + " " + this.criadero;
+  return retorno;
+}
+</pre>
+
+<p>Con el código precedente en su lugar, cualquier vez que se use <code>elDog</code> en un contexto de una cadena, JavaScript automáticamente llamará a la función <code>perroToString</code>, la cuál devuelve la siguiente cadena:</p>
+
+<pre>Perro Gabby es femenino chocolate Laboratorio
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toSource()")}}</li>
+ <li>{{jsxref("Object.prototype.valueOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/valueof/index.html b/files/es/web/javascript/reference/global_objects/object/valueof/index.html
new file mode 100644
index 0000000000..c6dcb07ca4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/valueof/index.html
@@ -0,0 +1,158 @@
+---
+title: Object.prototype.valueOf()
+slug: Web/JavaScript/Reference/Global_Objects/Object/valueOf
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/valueOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/valueOf
+---
+<div>{{JSRef("Global_Objects", "Object")}}</div>
+
+<p>El método <code><strong>valueOf()</strong></code> retorna el valor primitivo del objeto especificado.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>object</var>.valueOf()</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>El valor primitivo del objeto especificado.</p>
+
+<p> </p>
+
+<p>{{EmbedInteractiveExample("pages/js/object-prototype-valueof.html")}}</p>
+
+<p> </p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>JavaScript utiliza el método <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> para convertir un objeto a un valor primitivo. Raramente usted necesitará invocar el método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> por su cuenta; JavaScript lo realizará de forma automática cuando encuentre un objeto, donde un valor primitivo es esperado.</span></p>
+
+<p>Por defecto, el método <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> es heredado por cada objeto descendiente de </span>{{jsxref("Object")}}.<span style="line-height: 1.5;"> Cada objeto incorporado en el núcleo del lenguaje sobreescribe este método para retornar un valor apropiado. Si un objeto no tiene un valor primitivo, </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> devuelve el objeto en sí.</span></p>
+
+<p>Puede utilizar <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf </span><span style="line-height: 1.5;">dentro de su propio código para convertir un objeto incorporado en el núcleo del lenguaje en un valor primitivo. Cuando usted crea un objeto personalizado, puede sobreescribir el comportamiento de </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">Object.prototype.valueOf()</span><span style="line-height: 1.5;"> para invocar un método personalizado, en vez de utilizar el método por defecto </span><span style="line-height: 1.5;">{{jsxref("Object")}}.</span></p>
+
+<h3 id="Sobreescribiendo_valueOf_para_objetos_personalizados">Sobreescribiendo <code>valueOf</code> para objetos personalizados</h3>
+
+<p>Puede crear una función para ser invocada en lugar de utilizar el método <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> por defecto. Su función no debe contener ningún parámetro.</span></p>
+
+<p><span style="line-height: 1.5;">Suponga que tiene un objeto de tipo </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">myNumberType</span><span style="line-height: 1.5;"> y usted quiere crear un método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> para este. El código a continuación asigna una función personalizada al método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;">:</span></p>
+
+<pre class="brush: js">myNumberType.prototype.valueOf = function() { return customPrimitiveValue; };</pre>
+
+<p>Al tener el código anterior funcionando, cada vez que un objeto de tipo <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">myNumberType</span><span style="line-height: 1.5;"> es utilizado en un contexto donde deba ser representado por un valor primitivo, JavaScript automáticamente invocará la función definida en el código anterior.</span></p>
+
+<p><span style="line-height: 1.5;">El método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> es invocado usualmente por JavaScript pero usted puede invocarlo directamente como sigue a continuación:</span></p>
+
+<pre class="brush: js">myNumber.valueOf()</pre>
+
+<div class="note">
+<p><strong>Nota: </strong>Objetos en contextos de string realizan la conversión a string a través del método <span style="line-height: 1.5;">{{jsxref("Object.toString", "toString()")}} </span><span style="line-height: 1.5;">, el cual, es diferente de </span><span style="line-height: 1.5;">{{jsxref("String")}}</span><span style="line-height: 1.5;"> para convertir objetos a primitivos string utilizando el método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;">. Todos los objetos pueden ser convertidos a string, si solo "</span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">[object </span><em>type</em><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">]</span><span style="line-height: 1.5;">". Pero muchos objetos no se pueden convertir a number, boolean o function.</span></p>
+</div>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_valueOf" name="Example:_Using_valueOf">Utilizando <code>valueOf</code></h3>
+
+<pre class="brush: js">function myNumberType(n) {
+    this.number = n;
+}
+
+myNumberType.prototype.valueOf = function() {
+    return this.number;
+};
+
+myObj = new myNumberType(4);
+myObj + 3; // 7
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Commentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1ra Edición.</td>
+   <td>Estándar</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.2.4.4', 'Object.prototype.valueOf')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>
+    <p> </p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}</td>
+   <td>{{Spec2('ESDraft')}}   </td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Elemento</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Elemento</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toString()")}}</li>
+ <li>{{jsxref("parseInt", "parseInt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/object/values/index.html b/files/es/web/javascript/reference/global_objects/object/values/index.html
new file mode 100644
index 0000000000..6e0f8880c7
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/object/values/index.html
@@ -0,0 +1,98 @@
+---
+title: Object.values()
+slug: Web/JavaScript/Reference/Global_Objects/Object/values
+tags:
+  - JavaScript
+  - Objeto
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Object/values
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Object/values
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Object.values()</strong></code><strong> </strong>devuelve un array con los valores correspondientes a las propiedades <strong>enumerables</strong> de un objeto. Las propiedades son devueltas en el mismo orden a como lo haría un bucle {{jsxref("Statements/for...in", "for...in")}} (la única diferencia es que un bucle <code>for-in</code> también enumera las propiedades en la cadena de prototipo de un objeto).</p>
+
+<p>{{EmbedInteractiveExample("pages/js/object-values.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">Object.values(<var>obj</var>)</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>obj</code></dt>
+ <dd>Objeto cuyas propiedades enumerables serán devueltas.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un <code>array</code><strong> </strong>con las propiedades enumerables del objeto pasado como parámetro.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>Object.values()</code><strong> </strong>devuelve un array cuyos elementos son valores de propiedades enumarables que se encuentran en el objeto. El orden de las propiedades es el mismo que el dado cuando se recorre el objeto de forma manual.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">var obj = { foo: 'bar', baz: 42 };
+console.log(Object.values(obj)); // ['bar', 42]
+
+// array como objeto
+var obj = { 0: 'a', 1: 'b', 2: 'c' };
+console.log(Object.values(obj)); // ['a', 'b', 'c']
+
+// array como objeto con una ordenación aleatoria de las claves
+var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
+console.log(Object.values(an_obj)); // ['b', 'c', 'a']
+
+// getFoo no es una propiedade enumerable, por lo que como se observa, no se devuelve
+var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
+my_obj.foo = 'bar';
+console.log(Object.values(my_obj)); // ['bar']
+
+// parámetros que no son Objetos<strong> </strong>se fuerzan a que se comporten como tal
+console.log(Object.values('foo')); // ['f', 'o', 'o']
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Para dar soporte compatible con  <code>Object.values()</code> a entornos antiguos que no la soportan de forma nativa, puedes encontrar un Polyfill<strong> </strong>en <a href="https://github.com/tc39/proposal-object-values-entries">tc39/proposal-object-values-entries</a> o en los repositorios <a href="https://github.com/es-shims/Object.values">es-shims/Object.values</a>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object.values', 'Object.values')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES8', '#sec-object.values', 'Object.values')}}</td>
+   <td>{{Spec2('ES8')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{Compat("javascript.builtins.Object.values")}}</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/enumeracion_y_propietario_de_propiedades">Enumeración y propietarios de propiedades</a></li>
+ <li>{{jsxref("Object.keys()")}}</li>
+ <li>{{jsxref("Object.entries()")}}</li>
+ <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li>
+ <li>{{jsxref("Object.create()")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/parsefloat/index.html b/files/es/web/javascript/reference/global_objects/parsefloat/index.html
new file mode 100644
index 0000000000..fcd8873e53
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/parsefloat/index.html
@@ -0,0 +1,59 @@
+---
+title: parseFloat()
+slug: Web/JavaScript/Reference/Global_Objects/parseFloat
+translation_of: Web/JavaScript/Reference/Global_Objects/parseFloat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/parseFloat
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Convierte (parsea) un argumento de tipo cadena y devuelve un número de punto flotante.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<p><code>parseFloat(<em>cadena</em> ) </code></p>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>cadena</code></dt>
+ <dd>Una cadena que representa al valor que se desea convertir.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>parseFloat</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
+
+<p><code>parseFloat</code> convierte su argumento, una cadena, y devuelve un número de punto flotante. Si encuentra un carácter diferente al signo (+ o -), numerales (0-9), un punto decimal o un exponente, devuelve el valor hasta ese punto e ignora ese carácter y todos los correctos siguientes. Se permiten espacios anteriores y posteriores.</p>
+
+<p>Si el primer carácter no se puede convertir a número, <code>parseFloat</code> devuelve <code>NaN</code>.</p>
+
+<p>Para fines aritméticos, el valor <code>NaN</code> no es un número para ninguna base. Puede llamar a la función {{jsxref("isNaN")}} para determinar si el resultado de <code>parseFloat</code> es <code>NaN</code>. Si se pasa <code>NaN</code> en operaciones aritméticas, la operación resultante también será <code>NaN</code>.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_parseFloat_devolviendo_un_n.C3.BAmero" name="Ejemplo:_parseFloat_devolviendo_un_n.C3.BAmero">Ejemplo: <code>parseFloat</code> devolviendo un número</h3>
+
+<p>Todos los siguientes ejemplos devuelven 3.14.</p>
+
+<pre class="brush: js notranslate">parseFloat("3.14");
+parseFloat("314e-2");
+parseFloat("0.0314E+2"); v
+var cadena = "3.14"; parseFloat(cadena);
+parseFloat("3.14más caracteres no dígitos");</pre>
+
+<h3 id="Example_parseFloat_returning_NaN" name="Example:_parseFloat_returning_NaN">Example: <code>parseFloat</code> returning NaN</h3>
+
+<p>El siguiente ejemplo devuelve <code>NaN</code>:</p>
+
+<pre class="brush: js notranslate"><code>parseFloat("F</code><code>F2");</code></pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Objetos_globales/parseInt", "parseInt()")}}</li>
+ <li>{{jsxref("Number.parseFloat()")}}</li>
+ <li>{{jsxref("Number.parseInt()")}}</li>
+ <li>{{jsxref("Objetos_globales/isNan", "isNaN()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/parseint/index.html b/files/es/web/javascript/reference/global_objects/parseint/index.html
new file mode 100644
index 0000000000..6ec75c1eec
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/parseint/index.html
@@ -0,0 +1,90 @@
+---
+title: parseInt()
+slug: Web/JavaScript/Reference/Global_Objects/parseInt
+translation_of: Web/JavaScript/Reference/Global_Objects/parseInt
+original_slug: Web/JavaScript/Referencia/Objetos_globales/parseInt
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Convierte (parsea) un argumento de tipo cadena y devuelve un entero de la base especificada.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">parseInt(<em>string</em>, <em>base</em>);</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>cadena</code></dt>
+ <dd>Una cadena que representa el valor que se desea convertir.</dd>
+</dl>
+
+<dl>
+ <dt><code>base</code></dt>
+ <dd>Un entero que representa la base de la mencionada cadena.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>parseInt</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
+
+<p>La función <code>parseInt</code> comprueba el primer argumento, una cadena, e intenta devolver un entero de la base especificada. Por ejemplo, una base de 10 indica una conversión a número decimal, 8 octal, 16 hexadecimal, y así sucesivamente. Para bases superiores a 10, las letras del alfabeto indican numerales mayores que 9. Por ejemplo, para números hexadecimales (base 16), se utiliza de la A hasta la F.</p>
+
+<p>Si <code>parseInt</code> encuentra un carácter que no es un numeral de la base especificada, lo ignora a él y a todos los caracteres correctos siguientes, devolviendo el valor entero obtenido hasta ese punto. <code>parseInt</code> trunca los números en valores enteros. Se permiten espacios anteriores y posteriores.</p>
+
+<p>Si no se especifica la base o se especifica como 0, JavaScript asume lo siguiente:</p>
+
+<ul>
+ <li>Si el parámetro <code>cadena</code> comienza por "0x", la base es 16 (hexadecimal).</li>
+ <li>Si el parámetro <code>cadena</code> comienza por "0", la base es de 8 (octal). Esta característica está desaconsejada.</li>
+ <li>Si el parámetro <code>cadena</code> comienza por cualquier otro valor, la base es 10 (decimal).</li>
+</ul>
+
+<p>Si el primer carácter no se puede convertir en número, <code>parseInt</code> devuelve <code>NaN</code>.</p>
+
+<p>Para fines aritméticos, el valor <code>NaN</code> no es un número en ninguna base. Puede llamar a la función {{jsxref("Objetos_globales/isNaN", "isNaN")}} para determinar se el resultado de <code>parseInt</code> es <code>NaN</code>. Si se pasa <code>NaN</code> en operaciones aritméticas, la operación resultante también será <code>NaN</code>.</p>
+
+<p>Para convertir números a su literal cadena en una base en particular, utilice <code>intValue.toString(base)</code>.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_parseInt" name="Ejemplo:_Usando_parseInt">Ejemplo: Usando <code>parseInt</code></h3>
+
+<p>Todos los siguientes ejemplos devuelven 15:</p>
+
+<pre class="brush: js">parseInt("F", 16);
+parseInt("17", 8);
+parseInt("15", 10);
+parseInt(15.99, 10);
+parseInt("FXX123", 16);
+parseInt("1111", 2);
+parseInt("15*3", 10);
+parseInt("12", 13);
+</pre>
+
+<p>Todos los siguientes ejemplos devuelven <code>NaN</code>:</p>
+
+<pre class="brush: js">parseInt("Hello", 8); // No es un número en absoluto
+parseInt("0x7", 10);  // No es de base 10
+parseInt("546", 2);   // Los dígitos no son válidos para representaciones binarias.
+</pre>
+
+<p>Incluso aunque la base especificada es diferente, todos los siguientes ejemplos devuelven 17 ya que el argumento <code>cadena</code> comienza por "<code>0x</code>".</p>
+
+<pre class="brush: js">parseInt("0x11", 16);
+parseInt("0x11", 0);
+parseInt("0x11");
+</pre>
+
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Véase También</h3>
+
+<ul>
+ <li>{{jsxref("Objetos_globales/parseFloat", "parseFloat()")}}</li>
+ <li>{{jsxref("Number.parseFloat()")}}</li>
+ <li>{{jsxref("Number.parseInt()")}}</li>
+ <li>{{jsxref("Objetos_globales/isNaN", "isNaN()")}}</li>
+ <li>{{jsxref("Number.toString()")}}</li>
+ <li>{{jsxref("Object.valueOf")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/all/index.html b/files/es/web/javascript/reference/global_objects/promise/all/index.html
new file mode 100644
index 0000000000..32c3f20a51
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/all/index.html
@@ -0,0 +1,124 @@
+---
+title: Promise.all()
+slug: Web/JavaScript/Reference/Global_Objects/Promise/all
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Método(2)
+  - Promesa
+  - Promise
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/all
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Promise.all(iterable)</strong></code> devuelve una promesa que termina correctamente cuando todas las promesas en el argumento iterable han sido concluídas con éxito, o bien rechaza la petición con el motivo pasado por la primera promesa que es rechazada.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>Promise.all(iterable)</var>;</pre>
+
+<dl>
+ <dt>iterable</dt>
+ <dd>Un objeto iterable, por ejemplo un {{jsxref("Array")}}. Vea <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable</a>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una {{jsxref("Promise")}}  que se cumplirá cuando todas las promesas del argumento iterable hayan sido cumplidas, o bien se rechazará cuando alguna de ellas se rechace.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><strong><code>Promise.all</code> </strong> se cumple cuando todas las promesas del iterable dado se han cumplido, o es rechazada si alguna promesa no se cumple. {{jsxref("Promise.resolve")}}.</p>
+
+<p>Si alguna de las promesas pasadas en el argumento iterable falla, la promesa <code>all</code> es rechazada inmediatamente con el valor de la promesa que fué rechazada, descartando todas las demás promesas hayan sido o no cumplidas. Si se pasa un array vacío a <code>all</code> , la promesa se cumple inmediatamente.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_de_Promise.all">Uso de <code>Promise.all</code></h3>
+
+<p><code>Promise.all</code> espera a que todo se cumpla (o bien al primer rechazo).</p>
+
+<pre class="brush: js">var p1 = Promise.resolve(3);
+var p2 = 1337;
+var p3 = new Promise((resolve, reject) =&gt; {
+  setTimeout(resolve, 100, "foo");
+});
+
+Promise.all([p1, p2, p3]).then(values =&gt; {
+  console.log(values); // [3, 1337, "foo"]
+});</pre>
+
+<h3 id="Promise.all_comportamiento_de_fallo-rápido"><code>Promise.all</code> comportamiento de fallo-rápido</h3>
+
+<p><code>Promise.all</code> se rechaza si uno de los elementos ha sido rechazado y <code>Promise.all</code> falla rápido: Si tienes cuatro promesas que se resuelven después de un timeout y una de ellas falla inmediatamente, entonces <code>Promise.all</code> se rechaza inmediatamente.</p>
+
+<pre class="brush: js">var p1 = new Promise((resolve, reject) =&gt; {
+  setTimeout(resolve, 1000, "one");
+});
+var p2 = new Promise((resolve, reject) =&gt; {
+  setTimeout(resolve, 2000, "two");
+});
+var p3 = new Promise((resolve, reject) =&gt; {
+  setTimeout(resolve, 3000, "three");
+});
+var p4 = new Promise((resolve, reject) =&gt; {
+  setTimeout(resolve, 4000, "four");
+});
+var p5 = new Promise((resolve, reject) =&gt; {
+  reject("reject");
+});
+
+Promise.all([p1, p2, p3, p4, p5]).then(values =&gt; {
+  console.log(values);
+}, reason =&gt; {
+  console.log(reason)
+});
+
+//From console:
+//"reject"
+
+// Evenly, it's possible to use .catch
+Promise.all([p1, p2, p3, p4, p5]).then(values =&gt; {
+  console.log(values);
+}).catch(reason =&gt; {
+  console.log(reason)
+});
+
+//From console:
+//"reject"
+
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-promise.all', 'Promise.all')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition in an ECMA standard.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.all', 'Promise.all')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{Compat("javascript/promise","Promise.all")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+ <li>{{jsxref("Promise.race()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/catch/index.html b/files/es/web/javascript/reference/global_objects/promise/catch/index.html
new file mode 100644
index 0000000000..00f851fe3b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/catch/index.html
@@ -0,0 +1,184 @@
+---
+title: Promise.prototype.catch()
+slug: Web/JavaScript/Reference/Global_Objects/Promise/catch
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/catch
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong>catch()</strong> retorna una <code>Promise</code> y solo se ejecuta en los casos en los que la promesa se marca como <code>Reject</code>. Se comporta igual que al llamar {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}} (de hecho, al llamar <code>obj.catch(onRejected)</code> internamente llama a <code>obj.then(undefined, onRejected)</code>).</p>
+
+<h2 id="Síntaxis">Síntaxis</h2>
+
+<pre class="syntaxbox"><var>p.catch(onRejected)</var>;
+
+p.catch(function(reason) {
+   // rejection
+});
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>onRejected</dt>
+ <dd>Una {{jsxref("Function")}} llamada cuando la <code>Promise</code> es rechazada. Esta función tiene un argumento:
+ <dl>
+  <dt><code>reason</code></dt>
+  <dd>La razón del rechazo.</dd>
+ </dl>
+ La promesa devuelta por <code>catch()</code> es rechazada si <code>onRejected</code> lanza un error o retorna una <code>Promise</code> que a su vez se rechaza, de cualquier otra manera la <code>Promise</code> es resuelta.</dd>
+</dl>
+
+<h3 id="Valor_de_Retorno_(Return)">Valor de Retorno (Return)</h3>
+
+<p>Internamente llama a <code>Promise.prototype.then</code> en el objeto sobre el que se llama, pasándole el parámetro <code>undefined</code> y el manejador <code>onRejected</code> recibido; luego devuelve un valor de esa llamada (que es una {{jsxref("Promise")}}).</p>
+
+<p><strong>Demostración de la llamada interna:</strong></p>
+
+<pre class="brush: js">// overriding original Promise.prototype.then/catch just to add some logs
+(function(Promise){
+    var originalThen = Promise.prototype.then;
+    var originalCatch = Promise.prototype.catch;
+
+    Promise.prototype.then = function(){
+        console.log('&gt; &gt; &gt; &gt; &gt; &gt; called .then on %o with arguments: %o', this, arguments);
+        return originalThen.apply(this, arguments);
+    };
+    Promise.prototype.catch = function(){
+        console.log('&gt; &gt; &gt; &gt; &gt; &gt; called .catch on %o with arguments: %o', this, arguments);
+        return originalCatch.apply(this, arguments);
+    };
+
+})(this.Promise);
+
+
+
+// calling catch on an already resolved promise
+Promise.resolve().catch(function XXX(){});
+
+// logs:
+// &gt; &gt; &gt; &gt; &gt; &gt; called .catch on Promise{} with arguments: Arguments{1} [0: function XXX()]
+// &gt; &gt; &gt; &gt; &gt; &gt; called .then on Promise{} with arguments: Arguments{2} [0: undefined, 1: function XXX()]
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>catch</code> puede ser muy útil para el manejo de errores en tu código con promesas.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_y_encadenando_el_método_catch">Usando y encadenando el método <code>catch</code></h3>
+
+<pre class="brush: js">var p1 = new Promise(function(resolve, reject) {
+  resolve('Success');
+});
+
+p1.then(function(value) {
+  console.log(value); // "Success!"
+  throw 'oh, no!';
+}).catch(function(e) {
+  console.log(e); // "oh, no!"
+}).then(function(){
+  console.log('after a catch the chain is restored');
+}, function () {
+  console.log('Not fired due to the catch');
+});
+
+// The following behaves the same as above
+p1.then(function(value) {
+  console.log(value); // "Success!"
+  return Promise.reject('oh, no!');
+}).catch(function(e) {
+  console.log(e); // "oh, no!"
+}).then(function(){
+  console.log('after a catch the chain is restored');
+}, function () {
+  console.log('Not fired due to the catch');
+});
+</pre>
+
+<h3 id="Trucos_cuando_lanzamos_errores">Trucos cuando lanzamos errores</h3>
+
+<pre class="brush: js">// Hacer un throw llamará al método catch
+var p1 = new Promise(function(resolve, reject) {
+  throw 'Uh-oh!';
+});
+
+p1.catch(function(e) {
+  console.log(e); // "Uh-oh!"
+});
+
+// Los errores que se lancen dentro de funciones asíncronas actuarán como errores no capturados
+var p2 = new Promise(function(resolve, reject) {
+  setTimeout(function() {
+    throw 'Uncaught Exception!';
+  }, 1000);
+});
+
+p2.catch(function(e) {
+  console.log(e); // Nunca será llamado
+});
+
+// Errores lanzados después de resolve() serán omitidos
+var p3 = new Promise(function(resolve, reject) {
+  resolve();
+  throw 'Silenced Exception!';
+});
+
+p3.catch(function(e) {
+   console.log(e); // Nunca será llamado
+});</pre>
+
+<h3 id="Si_se_resuelve_la_promesa">Si se resuelve la promesa</h3>
+
+<pre class="brush: js">// Crea una promesa que no llamará a <code>onReject</code>
+var p1 = Promise.resolve("calling next");
+
+var p2 = p1.catch(function (reason) {
+    // Nunca será llamado
+    console.log("catch p1!");
+    console.log(reason);
+});
+
+p2.then(function (value) {
+    console.log("next promise's onFulfilled"); /* next promise's onFulfilled */
+    console.log(value); /* calling next */
+}, function (reason) {
+    console.log("next promise's onRejected");
+    console.log(reason);
+});</pre>
+
+<h2 id="Especificación">Especificación</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial en el standar ECMA.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
+
+<p>{{Compat("javascript.builtins.promise.catch")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+ <li>{{jsxref("Promise.prototype.then()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/finally/index.html b/files/es/web/javascript/reference/global_objects/promise/finally/index.html
new file mode 100644
index 0000000000..77c0f0ce72
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/finally/index.html
@@ -0,0 +1,96 @@
+---
+title: Promise.prototype.finally()
+slug: Web/JavaScript/Reference/Global_Objects/Promise/finally
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/finally
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>finally()</strong></code> devuelve una {{jsxref("Promise")}}. Cuando la promesa se resuelve, sea exitosa o rechazada, la función de callback específicada será ejecutada. Esto ofrece una forma de ejecutar código sin importar como se haya resuelto la promesa.</p>
+
+<p>Esto ayuda a evitar tener código duplicado tanto en el {{jsxref("Promise.then", "then()")}} como en el {{jsxref("Promise.catch", "catch()")}}.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>p.finally(alFinalizar)</var>;
+
+p.finally(function() {
+   // finalizada (exitosa o rechazada)
+});
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>alFinalizar</code></dt>
+ <dd>Una {{jsxref("Function")}} llamada cuando la <code>Promise</code> se resuelve con éxito o falla.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Devuelve una {{jsxref("Promise")}} cuyo <code>finally</code> fue fijado a la función específicada en <code>alFinalizar</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>finally()</code> puede ser de utilidad si quieres hacer algún proceso o limpieza una vez que la promesa termina, sin importar su resultado.</p>
+
+<p>Utilizar <code>finally()</code> es muy similar a llamar <code>.then(onFinally, onFinally)</code>, sin embargo tiene algunas diferencias:</p>
+
+<ul>
+ <li>Cuando usamos una función <code>inline</code>, se la puede pasar una sola vez, en vez de estar forzado a declararla dos veces, o guardarla en una variable.</li>
+ <li>Un callback <code>finally</code> no recibe ningún argumento, ya que no hay una manera fehaciente de determinar si la promesa fue exitosa o fallida. Este caso de uso es precisamente para cuando <em>no nos importa</em> la razón por la que falló o el valor al que resuelve, y no hay necesidad de proveerlos.</li>
+ <li>A diferencia de <code>Promise.resolve(2).then(() =&gt; {}, () =&gt; {})</code> (que va a resolver a <code>undefined</code>), <code>Promise.resolve(2).finally(() =&gt; {})</code> resolverá con un <code>2</code>.</li>
+ <li>Del mismo modo, a diferencia de <code>Promise.reject(3).then(() =&gt; {}, () =&gt; {})</code> (que resolverá con <code>undefined</code>), <code>Promise.reject(3).finally(() =&gt; {})</code> será rechazada con un <code>3</code>.</li>
+</ul>
+
+<div class="note">
+<p><strong>Nota:</strong> Un <code>throw</code> (o retornar una promesa rechazada) en el callback <code>finally</code> va a rechazar la nueva promesa con la razón de rechazo especificada al llamar <code>throw()</code>.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">let isLoading = true;
+
+fetch(myRequest).then(function(response) {
+    var contentType = response.headers.get("content-type");
+    if(contentType &amp;&amp; contentType.includes("application/json")) {
+      return response.json();
+    }
+    throw new TypeError("Oops, no hemos obtenido un JSON!");
+  })
+  .then(function(json) { /* procesar el JSON */ })
+  .catch(function(error) { console.log(error); /* esta línea podría arrojar error, e.g. cuando console = {} */ })
+  .finally(function() { isLoading = false; });
+
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.prototype.finally', 'Promise.prototype.finally')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegador">Compatibilidad en navegador</h2>
+
+<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
+
+<p>{{Compat("javascript.builtins.Promise.finally")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+ <li>{{jsxref("Promise.prototype.then()")}}</li>
+ <li>{{jsxref("Promise.prototype.catch()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/index.html b/files/es/web/javascript/reference/global_objects/promise/index.html
new file mode 100644
index 0000000000..b7183d15ac
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/index.html
@@ -0,0 +1,223 @@
+---
+title: Promise
+slug: Web/JavaScript/Reference/Global_Objects/Promise
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Promesa
+  - Promise
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>Promise</code></strong> (Promesa) es usado para computaciones asíncronas. Una promesa representa un valor que puede estar disponible ahora, en el futuro, o nunca.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">new Promise( /* ejecutor */ function(resolver, rechazar) { ... } );</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>ejecutor</dt>
+ <dd>Una función con los argumentos <code>resolver</code> y <code>rechazar</code>. La función <code>ejecutor</code> es ejecutada inmediatamente por la implementación de la Promesa, pasándole las funciones <code>resolver</code> y <code>rechazar</code> (el ejecutor es llamado incluso antes de que el constructor de la <code>Promesa</code> devuelva el objeto creado). Las funciones <code>resolver</code> y <code>rechazar</code>, al ser llamadas, resuelven o rechazan la promesa, respectivamente. Normalmente el ejecutor inicia un trabajo asíncrono, y luego, una vez que es completado, llama a la función <code>resolver</code> para resolver la promesa o la rechaza si ha ocurrido un error.<br>
+ Si un error es lanzado en la función ejecutor, la promesa es rechazada y el valor de retorno del ejecutor es rechazado.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Una <strong>Promesa</strong> es un proxy para un valor no necesariamente conocido en el momento que es creada la promesa. Permite asociar manejadores que actuarán asincrónicamente sobre un eventual valor en caso de éxito, o la razón de falla en caso de una falla. Esto permite que métodos asíncronos devuelvan valores como si fueran síncronos: en vez de inmediatamente retornar el valor final, el método asíncrono devuelve una <em>promesa</em> de suministrar el valor en algún momento en el futuro.</p>
+
+<p>Una <code>Promesa</code> se encuentra en uno de los siguientes estados:</p>
+
+<ul>
+ <li><em>pendiente (pending)</em>: estado inicial, no cumplida o rechazada.</li>
+ <li><em>cumplida (fulfilled)</em>: significa que la operación se completó satisfactoriamente.</li>
+ <li><em>rechazada (rejected)</em>: significa que la operación falló.</li>
+</ul>
+
+<p>Una promesa pendiente puede ser <em>cumplida</em> con un valor, o <em>rechazada</em> con una razón (error). Cuando cualquiera de estas dos opciones sucede, los métodos asociados, encolados por el método <em>then</em> de la promesa, son llamados. (Si la promesa ya ha sido cumplida o rechazada en el momento que es anexado su correspondiente manejador, el manejador será llamado, de tal manera que no exista una condición de carrera entre la operación asíncrona siendo completada y los manejadores siendo anexados)</p>
+
+<p>Como los métodos <code>{{jsxref("Promise.then", "Promise.prototype.then()")}}</code> y <code>{{jsxref("Promise.catch", "Promise.prototype.catch()")}}</code> retornan promesas, éstas pueden ser encadenadas.</p>
+
+<p><img alt="" src="https://mdn.mozillademos.org/files/8633/promises.png"></p>
+
+<div class="note">
+<p><strong>No confundir con:</strong> Varios lenguajes tienen mecanismos para evaluar perezosamente y postergar una computación, a los que también les llaman "promesas" - p.ej.: Scheme. Las promesas en JavaScript representan procesos que ya están sucediendo, y pueden ser encadenados con funciones callback. Si lo que se busca es evaluar perezosamente una expresión, se debe considerar la función <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">flecha </a> (arrow function) sin argumentos: <code>f = () =&gt; <em>expresión</em></code> para crear la expresión evaluada perezosamente, y <code>f()</code> para evaluar.</p>
+</div>
+
+<div class="note" id="settledNote">
+<p><strong>Nota</strong>: Una promesa se dice que está <em>determinada (settled)</em> si se ha cumplido o si se ha rechazado, pero no está pendiente. Con promesas también se usa el término <em>resuelta</em> — esto significa que la promesa está determinada, o que se encuentra bloqueada dentro de una cadena de promesas. <a href="https://github.com/domenic/promises-unwrapping/blob/master/docs/states-and-fates.md">States and fates</a> de Domenic Denicola contiene mas detalles sobre la terminología de las promesas.</p>
+</div>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>Promise.length</code></dt>
+ <dd>Propiedad longitud cuyo valor es siempre 1 (numero de argumentos del constructor).</dd>
+ <dt>{{jsxref("Promise.prototype")}}</dt>
+ <dd>Representa el prototipo del constructor <code>Promise</code>.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Promise.all", "Promise.all(iterable)")}}</dt>
+ <dd>Devuelve una de dos promesas: una que se cumple cuando todas las promesas en el argumento iterable han sido cumplidas, o una que se rechaza tan pronto como una de las promesas del argumento iterable es rechazada. Si la promesa retornada es cumplida, lo hace con un arreglo de los valores de las promesas cumplidas en el mismo orden definido en el iterable. Si la promesa retornada es rechazada, es rechazada con la razón de la primera promesa rechazada en el iterable. Este método puede ser útil para agregar resultados de múltiples promesas</dd>
+ <dt>{{jsxref("Promise.race", "Promise.race(iterable)")}}</dt>
+ <dd>Devuelve una promesa que se cumple o rechaza tan pronto como una de las promesas del iterable se cumple o rechaza, con el valor o razón de esa promesa.</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("Promise.reject", "Promise.reject(reason)")}}</dt>
+ <dd>Devuelve un objeto <code>Promise</code> que es rechazado con la razón dada.</dd>
+</dl>
+
+<dl>
+ <dt>{{jsxref("Promise.resolve", "Promise.resolve(value)")}}</dt>
+ <dd>Devuelve un objeto <code>Promise</code> que es resuelto con el valor dado. Si el valor es un <em>thenable</em> (p.ej. tiene un método <code>then</code>), la promesa devuelta "seguirá" este thenable, adoptando su eventual estado; de lo contrario la promesa devuelta será cumplida con el valor. Generalmente, si se quiere saber si un valor es una promesa o no, se podría usar - {{jsxref("Promise.resolve", "Promise.resolve(value)")}} y trabajar con el valor devuelto como una promesa.</dd>
+</dl>
+
+<h2 id="Prototipo_Promise">Prototipo <code>Promise</code></h2>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Properties')}}</p>
+
+<h3 id="Métodos_2">Métodos</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Methods')}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Súper_simple_¡10_líneas!">Súper simple (¡10 líneas!)</h3>
+
+<pre class="brush: js notranslate"><code>let miPrimeraPromise = new Promise((resolve, reject) =&gt; {
+  // Llamamos a resolve(...) cuando lo que estabamos haciendo finaliza con éxito, y reject(...) cuando falla.
+  // En este ejemplo, usamos setTimeout(...) para simular código asíncrono.
+  // En la vida real, probablemente uses algo como XHR o una API HTML5.
+  setTimeout(function(){
+    resolve("¡Éxito!"); // ¡Todo salió bien!
+  }, 250);
+});
+
+miPrimeraPromise.then((successMessage) =&gt; {
+  // succesMessage es lo que sea que pasamos en la función resolve(...) de arriba.
+  // No tiene por qué ser un string, pero si solo es un mensaje de éxito, probablemente lo sea.
+  console.log("¡Sí! " + successMessage);
+});</code></pre>
+
+<h3 id="Creando_una_Promise">Creando una Promise</h3>
+
+<p>Este pequeño ejemplo muestra el mecanismo de una <code>Promise</code>. El método <code>testPromise()</code> se llama cada vez que se pulsa el {{HTMLElement("button")}}. Esto crea una promesa que se cumplirá, aplicando {{domxref("window.setTimeout()")}}, al contador de la promesa (partiendo desde 1) aleatoriamente cada 1-3 segundos. El constructor de la Promise() es usado para crear dicha promesa.</p>
+
+<p>El cumplimiento de la promesa simplemente se registra, a través de una llamada de retorno al cumplirse utilizando {{jsxref("Promise.prototype.then()","p1.then()")}}. A los pocos registros muestra cómo la parte síncrona del método se desacopla de la finalización asíncrona de la promesa.</p>
+
+<pre class="brush: js notranslate">'use strict';
+var promiseCount = 0;
+
+function testPromise() {
+  var thisPromiseCount = ++promiseCount;
+
+  var log = document.getElementById('log');
+  log.insertAdjacentHTML('beforeend', thisPromiseCount +
+    ') Comenzó (&lt;small&gt;Comenzó el código sincrónico&lt;/small&gt;)&lt;br/&gt;');
+
+  // Hacemos una promesa: prometemos un contador numérico de esta promesa,
+  // empezando por 1 (después de esperar 3s)
+  var p1 = new Promise(
+    // La función resolvedora es llamada con la
+    // habilidad de resolver o rechazar la promesa
+    function(resolve, reject) {
+      log.insertAdjacentHTML('beforeend', thisPromiseCount +
+        ') Comenzó la promesa (&lt;small&gt;Código asíncrono comenzó&lt;/small&gt;)&lt;br/&gt;');
+
+      // Esto es solo un ejemplo para crear asincronismo
+      window.setTimeout(
+        function() {
+          // ¡Cumplimos la promesa!
+          resolve(thisPromiseCount);
+        }, Math.random() * 2000 + 1000);
+    }
+  );
+
+  // Definimos qué hacer cuando la promesa es resuelta/cumplida con la llamada
+  // al método then(). La llamada al método catch() define qué hacer si
+  // la promesa es rechazada
+  p1.then(
+    // Registrar el valor de la promesa cumplida
+    function(val) {
+      log.insertAdjacentHTML('beforeend', val +
+        ') Promesa cumplida (&lt;small&gt;Código asíncrono terminado.&lt;/small&gt;)&lt;br/&gt;');
+    })
+  .catch(
+    // Registrar la razón del rechazo
+    function(reason) {
+      console.log('Manejar promesa rechazada ('+reason+') aquí.');
+    });
+
+  log.insertAdjacentHTML('beforeend', thisPromiseCount +
+    ') Promesa hecha (&lt;small&gt;Código síncrono terminado. &lt;/small&gt;)&lt;br/&gt;');
+}
+</pre>
+
+<pre class="brush:js hidden notranslate">if ("Promise" in window) {
+  var btn = document.getElementById("btn");
+  btn.addEventListener("click",testPromise);
+} else {
+  log = document.getElementById('log');
+  log.innerHTML = "El ejemplo en vivo no está disponible ya que tu navegador no soporta la interfaz &lt;code&gt;Promise&lt;code&gt;.";
+}
+</pre>
+
+<p>Este ejemplo es ejecutado cuando pulsas el botón. Necesitas un navegador que soporte <code>Promise</code>. Al pulsar el botón varias veces en un período corto de tiempo, verás las diferentes promesas siendo cumplidas una tras otra.</p>
+
+<p>{{EmbedLiveSample("Creando_una_Promise", "500", "200")}}</p>
+
+<h2 id="Cargando_una_imagen_con_XHR">Cargando una imagen con XHR</h2>
+
+<p>Otro ejemplo sencillo utilizando <code>Promise</code> y <code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> para cargar una imagen está disponible en el repositorio <a href="https://github.com/mdn/js-examples/tree/master/promises-test">js-examples</a> de MDN en GitHub. También puedes <a href="https://mdn.github.io/js-examples/promises-test/">verlo en acción</a>. Cada paso está comentado y te permite seguir de cerca la arquitectura detrás de las Promesas y XHR.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-promise-objects', 'Promise')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition in an ECMA standard.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise-objects', 'Promise')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">To contribute to this compatibility data, please write a pull request against this file: <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json">https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json</a>.</p>
+
+<p>{{Compat("javascript/promise")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="http://promisesaplus.com/">Promises/A+ specification</a></li>
+ <li><a href="https://medium.com/@ramsunvtech/promises-of-promise-part-1-53f769245a53">Venkatraman.R - JS Promise (Part 1, Basics)</a></li>
+ <li><a href="https://medium.com/@ramsunvtech/js-promise-part-2-q-js-when-js-and-rsvp-js-af596232525c#.dzlqh6ski">Venkatraman.R - JS Promise (Part 2 - Using Q.js, When.js and RSVP.js)</a></li>
+ <li><a href="http://www.html5rocks.com/en/tutorials/es6/promises/">Jake Archibald: JavaScript Promises: There and Back Again</a></li>
+ <li><a href="http://de.slideshare.net/domenicdenicola/callbacks-promises-and-coroutines-oh-my-the-evolution-of-asynchronicity-in-javascript">Domenic Denicola: Callbacks, Promises, and Coroutines – Asynchronous Programming Patterns in JavaScript</a></li>
+ <li><a href="http://www.mattgreer.org/articles/promises-in-wicked-detail/">Matt Greer: JavaScript Promises ... In Wicked Detail</a></li>
+ <li><a href="https://www.promisejs.org/">Forbes Lindesay: promisejs.org</a></li>
+ <li><a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">Nolan Lawson: We have a problem with promises — Common mistakes with promises</a></li>
+ <li><a href="https://github.com/jakearchibald/es6-promise/">Promise polyfill</a></li>
+ <li><a href="https://www.udacity.com/course/javascript-promises--ud898">Udacity: JavaScript Promises</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/race/index.html b/files/es/web/javascript/reference/global_objects/promise/race/index.html
new file mode 100644
index 0000000000..14d765215c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/race/index.html
@@ -0,0 +1,113 @@
+---
+title: Promise.race()
+slug: Web/JavaScript/Reference/Global_Objects/Promise/race
+tags:
+  - ECMAScript2015
+  - ECMAScript6
+  - JavaScript
+  - Promesa
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/race
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Promise.race(iterable)</strong></code> retorna una promesa que se cumplirá o no tan pronto como una de las promesas del argumento iterable se cumpla o se rechace, con el valor o razón de rechazo de ésta.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>Promise.race(iterable)</var>;</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>iterable</dt>
+ <dd>Un objeto iterable , como por ejemplo un {{jsxref("Array")}}. Vea <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable</a>.</dd>
+</dl>
+
+<h3 id="Retorna">Retorna</h3>
+
+<p>Una {{jsxref("Promise")}} que se cumple o se rechaza tan pronto como una de las promesas dadas en el argumento iterable se cumple o se rechaza.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La función <code>race</code> retorna una <code>Promise</code> que se comporta como tal. Se cumple o se rechaza, lo que suceda antes en alguno de sus argumentos (iterable).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Promise.race_–_ejemplos_con_setTimeout">Usando <code>Promise.race</code> – ejemplos con <code>setTimeout</code></h3>
+
+<pre class="brush: js">var p1 = new Promise( (resolve, reject) =&gt; {
+    setTimeout(resolve, 500, "uno");
+});
+var p2 = new Promise( (resolve, reject) =&gt; {
+    setTimeout(resolve, 100, "dos");
+});
+
+Promise.race([p1, p2]).then( value =&gt; {
+  console.log(value); // "dos"
+  // Ambas se resuelven, pero la p2 antes.
+});
+
+  // Ejemplo con un resolve y un reject en el mismo método race.
+var p3 = new Promise( (resolve, reject) =&gt; {
+    setTimeout(resolve, 100, "tres");
+});
+var p4 = new Promise( (resolve, reject) =&gt; {
+    setTimeout(reject, 500, "cuatro");
+});
+
+Promise.race([p3, p4]).then( value =&gt; {
+  console.log(value); // "tres"
+  // p3 es mas rápida, así que se resuelve el race
+}, reason =&gt; {
+  // No es llamado
+});
+
+var p5 = new Promise( (resolve, reject) =&gt; {
+    setTimeout(resolve, 500, "cinoc");
+});
+var p6 = new Promise( (resolve, reject) =&gt; {
+    setTimeout(reject, 100, "seis");
+});
+
+Promise.race([p5, p6]).then( value =&gt; {
+  // No es llamado
+}, reason =&gt; {
+  console.log(reason); // "seis"
+  // p6 es mas rápida, así que se rechaza
+});
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentar</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-promise.race', 'Promise.race')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition in an ECMA standard.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+ <li>{{jsxref("Promise.all()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/reject/index.html b/files/es/web/javascript/reference/global_objects/promise/reject/index.html
new file mode 100644
index 0000000000..73f7629307
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/reject/index.html
@@ -0,0 +1,81 @@
+---
+title: Promise.reject()
+slug: Web/JavaScript/Reference/Global_Objects/Promise/reject
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/reject
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Promise.reject(reason)</strong></code> retorna un objeto <code>Promise</code> que es rechazado por la razón específicada.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/promise-reject.html")}}</div>
+
+<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
+
+<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
+
+<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>Promise.reject(reason)</var>;</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>reason</dt>
+ <dd>Razón por la cual esta {jsxref("Promise")}} fue rechazada.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>Un objeto {{jsxref("Promise")}} que es rechazado por la razón específicada.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La función estática <code>Promise.reject</code> retorna un objecto {{jsxref("Promise")}} que es rechazado. Para fines de depuración y captura selectiva de error, se suele pasar por el parámetro <code>reason</code> un  <code>instanceof</code> {{jsxref("Error")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_estático_Promise.reject">Usando el método estático Promise.reject()</h3>
+
+<pre class="brush: js">Promise.reject(new Error('fail')).then(function() {
+  // no entra en esta función
+}, function(error) {
+  console.log(error); // Stacktrace
+});</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition in an ECMA standard.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.reject', 'Promise.reject')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
+
+<p>{{Compat("javascript.builtins.Promise.reject")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+ <li><a href="https://github.com/petkaantonov/bluebird#error-handling">Selective error catching using the BlueBird Promise library</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/resolve/index.html b/files/es/web/javascript/reference/global_objects/promise/resolve/index.html
new file mode 100644
index 0000000000..473ce753ac
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/resolve/index.html
@@ -0,0 +1,151 @@
+---
+title: Promise.resolve()
+slug: Web/JavaScript/Reference/Global_Objects/Promise/resolve
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Promise
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/resolve
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Promise.resolve(value)</strong></code> retorna un objeto {{jsxref("Promise")}} que es resuelto con el valor dado. Si el valor es una <em>promise</em>, esa <em>promise </em>es devuelta; si el valor es un <em>thenable </em>(si tiene un {{jsxref("Promise.then", "método \"then\"")}}), el valor devuelto le seguirá a ese <em>thenable</em>, adoptando su estado; de otro modo la <em>promise</em> devuelta estará completada con el valor.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/promise-resolve.html")}}</div>
+
+<p class="hidden">La fuente para esta demostración interactiva se encuentra en un repositorio de GitHub. Si te gustaría contribuir al proyecto de la demostración interactiva, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una <em>pull request</em>.</p>
+
+<h2 id="Sintáxis">Sintáxis</h2>
+
+<pre class="brush: js">Promise.resolve(value);
+Promise.resolve(promise);
+Promise.resolve(thenable);
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>value</dt>
+ <dd>Argumento por resolver por esta <code>Promise</code>. También puede ser una <code>Promise</code> o un <em>thenable</em> por resolver.</dd>
+</dl>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Una {{jsxref("Promise")}} que es resuelta con el valor dado, o con la <em>promise </em>pasada como valor, si el valor era un objeto <em>promise</em>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La función estática <code>Promise.resolve</code> retorna una <code>Promise</code> que es resuelta.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_el_método_estático_Promise.resolve">Utilizando el método estático <code>Promise.resolve</code></h3>
+
+<pre class="brush: js">Promise.resolve('Éxito').then(function(value) {
+  console.log(value); // "Éxito"
+}, function(value) {
+  // no es llamada
+});
+</pre>
+
+<h3 id="Resolviendo_un_arreglo">Resolviendo un arreglo</h3>
+
+<pre class="brush: js">var p = Promise.resolve([1,2,3]);
+p.then(function(v) {
+  console.log(v[0]); // 1
+});</pre>
+
+<h3 id="Resolviendo_otra_Promise">Resolviendo otra <code>Promise</code></h3>
+
+<pre class="brush: js">var original = Promise.resolve(33);
+var cast = Promise.resolve(original);
+cast.then(function(value) {
+  console.log('valor: ' + value);
+});
+console.log('original === cast ? ' + (original === cast));
+
+// registros, en orden:
+// original === cast ? true
+// valor: 33
+</pre>
+
+<p>El orden invertido de los registros se debe al hecho de que los <em>handler </em><code>then</code> sean llamados asíncronamente. Vea cómo funciona <code>then</code> <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then#Return_value">aquí</a>.</p>
+
+<h3 id="Resolviendo_thenables_y_arrojando_Errores">Resolviendo thenables y arrojando Errores</h3>
+
+<pre class="brush: js">// Resolviendo un objeto thenable
+var p1 = Promise.resolve({
+  then: function(onFulfill, onReject) { onFulfill('¡Completada!'); }
+});
+console.log(p1 instanceof Promise) // true, objeto convertido en una Promise
+j
+p1.then(function(v) {
+    console.log(v); // "¡Completada!"
+  }, function(e) {
+    // no es llamada
+});
+
+// Thenable arroja antes del callback
+// Rechaza la Promise
+var thenable = { then: function(resolve) {
+  throw new TypeError('Arrojando');
+  resolve('Resolviendo');
+}};
+
+var p2 = Promise.resolve(thenable);
+p2.then(function(v) {
+  // no es llamada
+}, function(e) {
+  console.log(e); // TypeError: Arrojando
+});
+
+// Thenable arroja después del callback
+// Resuelve la Promise
+var thenable = { then: function(resolve) {
+  resolve('Resolviendo');
+  throw new TypeError('Arrojando');
+}};
+
+var p3 = Promise.resolve(thenable);
+p3.then(function(v) {
+  console.log(v); // "Resolviendo"
+}, function(e) {
+  // no es llamada
+});
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-promise.resolve', 'Promise.resolve')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial en un estándar de ECMA.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.resolve', 'Promise.resolve')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p class="hidden">Para contribuir a esta información de compatibilidad, porfavor haz una <em>pull request</em> contra este repositorio: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
+
+<p>{{Compat("javascript.builtins.Promise.resolve")}}</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/promise/then/index.html b/files/es/web/javascript/reference/global_objects/promise/then/index.html
new file mode 100644
index 0000000000..cffe9231d2
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/promise/then/index.html
@@ -0,0 +1,303 @@
+---
+title: Promise.prototype.then()
+slug: Web/JavaScript/Reference/Global_Objects/Promise/then
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Method
+  - Promise
+  - Prototype
+translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Promise/then
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>then()</strong></code> retorna una {{domxref("Promesa")}}. Recibe dos argumentos: funciones callback  para los casos de éxito y fallo de <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise">Promise</a></code>.</p>
+
+<p>Nota: Si ambos argumentos son omitidos, o se proveen métodos que no sean funciones, se creará una nueva <code>Promesa</code> sin handlers adicionales, que simplemente adoptan el estado final de la <code>Promesa</code> que entonces es llamado. Si el primer argumento es omitido o se provee una no-función, el nuevo <code>Promise</code> que es creado simplemente adopta el  estado cumplido del <code>Promise</code> que entonces es llamado (si se convierte en fulfilled). Si el segundo argument es omitido o se provee una no-función, el nuevo <code>Promise</code> que es creado simplemente adopta  el estado de rechazo del <code>Promesa</code> que entonces es llamado (si se convierte en rechazado).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>p.then(alCumplir[, enRechazo])</var>;
+
+p.then(function(value) {
+   // cumplimiento
+  }, function(reason) {
+  // rechazo
+});
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Retorna un <code>Promise</code> el cual es determinado por las funciones input:</p>
+
+<ul>
+ <li>Si <font face="consolas, Liberation Mono, courier, monospace">alCumplir</font> o <code>enRechazo</code> arroja un error, o retorna un <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise">Promise</a></code> rechazado, <code>then</code> retorna un <code>Promise</code> rechazado.</li>
+ <li>Si <font face="consolas, Liberation Mono, courier, monospace">alCumplir</font> o <code>enRechazo</code> retorna un <code>Promise</code> que resuelve, o retorna cualquier otro valor, <code>then</code> retorna un <code>Promise </code>resuelto.</li>
+</ul>
+
+<dl>
+ <dt><font face="consolas, Liberation Mono, courier, monospace">alCumplir </font>{{optional_inline}}</dt>
+ <dd>Una <a href="es/docs/Web/JavaScript/Referencia/Objetos_globales/Function">Función</a> es llamada si la <code>Promesa</code> se cumple. Esta función tiene un argumento, el <code>valor de</code> cumplimiento. Si no es una función, se reemplaza internamente con una función de "Identidad"  (devuelve el argumento recibido).</dd>
+ <dt><code>enRechazo</code> {{optional_inline}}</dt>
+ <dd>Una <a href="es/docs/Web/JavaScript/Referencia/Objetos_globales/Function">Función</a> es llamada si la <code>Promesa </code>es rechazada. Esta función tiene un argumento, la <code>razón</code> de rechazo. Si no es una función, se reemplaza internamente con una función "Lanzador" (lanza un error que recibió como argumento).</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise">Promise</a></code> en estado <strong>pendiente.</strong> La función de control (<code>alCumplir o enRechazo)</code> es llamada de forma <strong>asíncrona</strong> (tan pronto como el stack se vacíe). Después de la invocación de la función de control pueden darse diferentes casos:</p>
+
+<ul>
+ <li>Si se recibe un valor, la Promesa devuelta por el método <code>then</code> queda resuelta adoptando el valor de retorno.</li>
+ <li>Si se produce un error, la Promesa devuelta por el método <code>then</code> es rechazada, adoptando el error como su valor.</li>
+ <li>Si se devuelve una Promesa ya resuelta, la Promesa devuelta por el método <code>then</code> queda resuelta adoptando el valor de la promesa anterior.</li>
+ <li>Si se devuelve una Promesa con un objeto <strong>pendiente</strong> de resolver, la resolución o rechazo devueltos por  <code>then</code> quedará a esperas de que la Promesa establecida para la función de control quede resuelta. Además, el valor de la Promesa en estado pendiente será el mismo que el valor devuelto por el controlador.</li>
+</ul>
+
+<p>Veamos un ejemplo para demostrar la asincronía del método <code>then</code>.</p>
+
+<pre class="notranslate"><code>// al usar una promesa revuelta, el bloque 'then' se lanzará automáticamente,
+// pero sus funciones controladoras se lanzarán asíncronamente,
+// como demuestran los console.logs
+var promResuelta = Promise.resolve(33);
+
+var thenProm = promResuelta.then(función(valor){
+    console.log("ésto será invocado cuando acabe el stack principal. El valor recibido y devuelto es: " + valor);
+    return valor;
+});
+// imprimimos al momento el valor de thenProm()
+console.log(thenProm);
+
+// usando setTimeout podemos posponer la ejecución de una función al momento en el que el stack quede vacío.
+setTimeout(función(){
+    console.log(thenProm);
+});
+
+
+// logs, en orden:
+// Promise {[[EstadoPromise¡]]: "pendiente", [[ValorPromise]]: undefined}
+// "ésto será invocado cuando acabe el stack principal. El valor recibido y devuelto es: "33"
+// Promise {[[EstadoPromise]]: "resuelta", [[ValorPromise]]: 33}</code></pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Ya que los métodos <code>then</code> y {{jsxref("Promise.prototype.catch()")}} devuelven promesas, pueden ser encadenados — una operación llamada <em>composición</em>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_metodo_then">Usando el metodo <code>then</code></h3>
+
+<pre class="brush: js notranslate">var p1 = new Promise(function(resolve, reject) {
+  resolve('Success!');
+  // or
+  // reject ("Error!");
+});
+
+p1.then(function(value) {
+  console.log(value); // Success!
+}, function(reason) {
+  console.log(reason); // Error!
+});
+</pre>
+
+<h3 id="Encadenamiento">Encadenamiento</h3>
+
+<p>El método <code>then</code> devuelve una <code>Promise</code> que permite encadenar métodos.</p>
+
+<p>Puedes pasar una lambda a <code>then</code> y si devuelve una promesa, una <code>Promise</code> equivalente será expuesta al <code>then</code> subsecuente en la cadena de métodos. El fragmento incluido debajo simula un código asíncrono mediante la función <code>setTimeout</code>. </p>
+
+<pre class="brush: js notranslate">Promise.resolve('foo')
+  // 1. Recibe "foo", concatena "bar" con él, y resuelve la cadena con el siguiente 'then'
+  .then(función(hilo) {
+    return new Promise(function(resolve, reject) {
+      setTimeout(función() {
+        hilo += 'bar';
+        resolve(hilo);
+      }, 1);
+    });
+  })
+  // 2. recibe "foobar", registra una función de llamada para opear sobre ese hilo
+  // e imprimirlo en la consola, pero no antes de devolver el hilo sin modificar
+  // en la resolución del siguiente 'then'
+  .then(función(hilo) {
+    setTimeout(función() {
+      hilo += 'baz';
+      console.log(hilo);
+    }, 1)
+    return hilo;
+  })
+  // 3. imprime mensajes útiles sobre cómo funcionará el código en esta sección
+  // antes de que el hilo se procese por el código de prueba
+  // antes del bloque 'then'.
+  .then(función(hilo) {
+    console.log("Último Then:  oops... no me he molestado en instanciar y devolver " +
+                "una promesa en el then anterior, así que la secuencia puede ser un poco " +
+                "sorprendente");
+
+    // Observemos que `string` no incluye el trozo 'baz' en éste punto. Ésto ocurre
+    // porque lo hemos contruido para que ocurra asíncronamente con una función setTimeout
+    console.log(hilo);
+});</pre>
+
+<p>Cuando un valor sencillamente se devuelve desde un lambda <code>then</code> , devolverá un <code>Promise.resolve(&lt;valor devuelto por el controlador que haya sido invocado&gt;)</code>.</p>
+
+<pre class="brush: js notranslate">var p2 = nueva Promise(function(resolver, rechazar) {
+  resolver(1);
+});
+
+p2.then(función(valor) {
+  console.log(valor); // 1
+  return valor + 1;
+}).then(function(value) {
+  console.log(valor + '- Este uso síncrono es prácticamente inútil'); // 2- Este uso síncrono es prácticamente inútil
+});
+
+p2.then(función(valor) {
+  console.log(valor); // 1
+});
+</pre>
+
+<p>Una llamada a  <code>then</code> devolverá una promesa rechazada si la función lanza un error o devuelve una Promise rechazada.</p>
+
+<pre class="brush: js notranslate">Promise.resolve()
+  .then( () =&gt; {
+    // Hace que .then() devuelva una promera rechazada
+    throw new Error('Oh no!');
+  })
+  .then( () =&gt; {
+    console.log( 'No invocada.' );
+  }, error =&gt; {
+    console.error( 'Función de rechazo llamada: ', error );
+});</pre>
+
+<p>En cualquier otro caso, una Promise en resolución será devuelta. El el siguiente ejemplo, el primer <code>then()</code> devolverá un <code>42</code> dentro de una Promise en resolución, aunque la Promise de la cadena fue rechazada.</p>
+
+<pre class="brush: js notranslate">Promise.reject()
+  .then( () =&gt; 99, () =&gt; 42 ) // enRechazo devuelve 42, que está dentro de una Promise en resolución
+  .then( respuesta =&gt; console.log( 'Resuelta con ' + respuesta ) ); // Resuelta con 42</pre>
+
+<p>En la práctica, suele ser preferible capturar promesas rechazadas en lugar de utilizar la sintaxis de dos casos de <code>then,</code> como demostramos abajo.</p>
+
+<pre class="brush: js notranslate">Promise.resolve()
+  .then( () =&gt; {
+    // Hace que .then() devuelva una promesa rechazada
+    throw new Error('Oh no!');
+  })
+  .catch( error =&gt; {
+    console.error( 'función enRechazo invocada: ', error );
+  })
+  .then( () =&gt; {
+    console.log( "Siempre soy invocada, incluso si la promesa del then previo es rechazada" );
+  });</pre>
+
+<p><br>
+ También puedes usar encadenamiento para implementar una función con una API basada en promesas, sobre una función del mismo tipo.</p>
+
+<pre class="brush: js notranslate">function traer_datos_actuales() {
+  // La función <a href="/en-US/docs/Web/API/GlobalFetch/fetch">fetch</a>() de la API devuelve una Promesa. Esta función
+  // expone una API similar, pero el valor de cumplimiento
+  // de la Promesa de esta función tiene más tareas
+  // implementadas sobre ella.
+  return fetch('datos_actuales.json').then((response) =&gt; {
+    if (response.headers.get('content-type') != 'application/json') {
+      throw new TypeError();
+    }
+    var j = response.json();
+    // podríamos hacer algo con j
+    return j; // valor de cumplimiento asignado al usuario de
+              // fetch_datos_actuales().then()
+  });
+}
+</pre>
+
+<p>Si <code>alCumplir</code> devuelve una promesa, el valor de retorno de <code>then</code> será resuelto o rechazado por la promesa.</p>
+
+<pre class="brush: js notranslate">function resolverDespues(resolver, reject) {
+  setTimeout(función () {
+    resolver(10);
+  }, 1000);
+}
+function rechazarDespues(resolver, reject) {
+  setTimeout(function () {
+    resolver(new Error('Error'));
+  }, 1000);
+}
+
+var p1 = Promise.resolve('foo');
+var p2 = p1.then(función() {
+  // Devuelve la promesa aquí, que será resuelta igualada a 10 tras 1 segundo
+  return new Promise(resolverDespues);
+});
+p2.then(función(v) {
+  console.log('resuelta', v);  // "resuelta", 10
+}, función(e) {
+  // no invocada
+  console.log('rechazada', e);
+});
+
+var p3 = p1.then(funcion() {
+ // Devuelve la promesa aquí, que será rechazada con 'Error' despues de 1 segundo
+ return new Promise(rechazarDespues);
+});
+p3.then(funcion(v) {
+ // no invocada
+  console.log('resuelta', v);
+}, funcion(e) {
+  console.log('rechazada', e); // "rechazada", 'Error'
+});
+</pre>
+
+<h3 id="window.setImmediate_estilo_polyfill_basado_en_promesas"><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/Window/setImmediate" title="This method is used to break up long running operations and run a callback function immediately after the browser has completed other operations such as events and display updates."><code>window.setImmediate</code></a> estilo polyfill basado en promesas</h3>
+
+<p>Usar un método {{jsxref("Function.prototype.bind()")}}<code>Reflect.apply</code> ({{jsxref("Reflect.apply()")}}) para crear un (non-cancellable) setImmediate-style function.</p>
+
+<pre class="notranslate">const nextTick = (() =&gt; {
+  const noop = () =&gt; {}; // literally
+  const nextTickPromise = () =&gt; Promise.resolve().then(noop);
+
+  const rfab = Reflect.apply.bind; // (thisArg, fn, thisArg, [...args])
+  const nextTick = (fn, ...args) =&gt; (
+    fn !== undefined
+    ? Promise.resolve(args).then(rfab(null, fn, null))
+    : nextTickPromise(),
+    undefined
+  );
+  nextTick.ntp = nextTickPromise;
+
+  return nextTick;
+})();</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial en el estándar ECMA.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegador">Compatibilidad en navegador</h2>
+
+<p class="hidden">Para contribuir a la compatibilidad de estos datos, realiza una pull request sobre éste archivo: <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json">https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json</a>.</p>
+
+<p>{{Compat("javascript/promise","Promise.prototype.then")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Promise")}}</li>
+ <li>{{jsxref("Promise.prototype.catch()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/proxy/handler/getownpropertydescriptor/index.html b/files/es/web/javascript/reference/global_objects/proxy/handler/getownpropertydescriptor/index.html
deleted file mode 100644
index 6c050f7f0a..0000000000
--- a/files/es/web/javascript/reference/global_objects/proxy/handler/getownpropertydescriptor/index.html
+++ /dev/null
@@ -1,129 +0,0 @@
----
-title: handler.getOwnPropertyDescriptor()
-slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/getOwnPropertyDescriptor
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Proxy
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/getOwnPropertyDescriptor
----
-<div>{{JSRef}}</div>
-
-<div>El método <strong><code>handler.getOwnPropertyDescriptor()</code></strong> captura {{jsxref("Object.getOwnPropertyDescriptor()")}}.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: js">var p = new Proxy(target, {
-  getOwnPropertyDescriptor: function(target, prop) {
-  }
-});
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>El método <code>getOwnPropertyDescriptor</code> recibe los siguiente parámetros. <code>this</code> está asociado al handler del proxy.</p>
-
-<dl>
- <dt><code>target</code></dt>
- <dd>El objeto destino.</dd>
- <dt><code>prop</code></dt>
- <dd>El nombre de la propiedad cuya descripción ha de ser devuelta.</dd>
-</dl>
-
-<h3 id="Valor_Devuelto">Valor Devuelto</h3>
-
-<p>El método <code>getOwnPropertyDescriptor</code> debe devolver un objeto o  <code>undefined</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code><strong>handler.getOwnPropertyDescriptor()</strong></code> captura {{jsxref("Object.getOwnPropertyDescriptor()")}}.</p>
-
-<h3 id="Intercepciones">Intercepciones</h3>
-
-<p>Este método intercepta las siguientes operaciones:</p>
-
-<ul>
- <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
- <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li>
-</ul>
-
-<h3 id="Invariantes">Invariantes</h3>
-
-<p>Si los siguientes invariantes son violados, el proxy lanzará {{jsxref("TypeError")}}:</p>
-
-<ul>
- <li><code>getOwnPropertyDescriptor</code> debe devolver un objeto o  <code>undefined</code>.</li>
- <li>No puede devolver que una propiedad no existe si está presente en el objeto como no configurable.</li>
- <li>No puede devolver que una propiedad no existe si esta está presente como una propiedad propia del objeto destino y el objeto no es extensible.</li>
- <li>No puede devolver que una propuedad existe, si esta no está presente en el objeto destino y el objeto no es extensible. </li>
- <li>No puede devolver que una propiedad es no configurable si esta no existe en el objeto destino o si existe pero sí es configurable.</li>
- <li>El resultado de  <code>Object.getOwnPropertyDescriptor(target)</code> puede ser aplicado al objeto destino mediante <code>Object.defineProperty </code>y no lanzará ningún tipo de excepción.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente código captura {{jsxref("Object.getOwnPropertyDescriptor()")}}.</p>
-
-<pre class="brush: js">var p = new Proxy({ a: 20}, {
-  getOwnPropertyDescriptor: function(target, prop) {
-    console.log('called: ' + prop);
-    return { configurable: true, enumerable: true, value: 10 };
-  }
-});
-
-console.log(Object.getOwnPropertyDescriptor(p, 'a').value); // "called: a"
-                                                            // 10
-</pre>
-
-<p>El siguiente código viola uno de los invariantes definidos previamente.</p>
-
-<pre class="brush: js">var obj = { a: 10 };
-Object.preventExtensions(obj);
-var p = new Proxy(obj, {
-  getOwnPropertyDescriptor: function(target, prop) {
-    return undefined;
-  }
-});
-
-Object.getOwnPropertyDescriptor(p, 'a'); // TypeError is thrown
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots-getownproperty-p', '[[GetOwnProperty]]')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición Inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-getownproperty-p', '[[GetOwnProperty]]')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_buscadores">Compatibilidad con buscadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Proxy.handler.getOwnPropertyDescriptor")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Proxy")}}</li>
- <li>{{jsxref("Proxy.handler", "handler")}}</li>
- <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
- <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/reference/global_objects/proxy/handler/index.html b/files/es/web/javascript/reference/global_objects/proxy/handler/index.html
deleted file mode 100644
index 2be6abb116..0000000000
--- a/files/es/web/javascript/reference/global_objects/proxy/handler/index.html
+++ /dev/null
@@ -1,84 +0,0 @@
----
-title: Proxy handler
-slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - NeedsTranslation
-  - Proxy
-  - TopicStub
-translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Proxy/handler
----
-<div>{{JSRef}}</div>
-
-<p>The proxy's handler object is a placeholder object which contains traps for {{jsxref("Proxy", "proxies", "", 1)}}.</p>
-
-<h2 id="Methods">Methods</h2>
-
-<p>All traps are optional. If a trap has not been defined, the default behavior is to forward the operation to the target.</p>
-
-<dl>
- <dt>{{jsxref("Global_Objects/Proxy/handler/getPrototypeOf", "handler.getPrototypeOf()")}}</dt>
- <dd>A trap for {{jsxref("Object.getPrototypeOf")}}.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/setPrototypeOf", "handler.setPrototypeOf()")}}</dt>
- <dd>A trap for {{jsxref("Object.setPrototypeOf")}}.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/isExtensible", "handler.isExtensible()")}}</dt>
- <dd>A trap for {{jsxref("Object.isExtensible")}}.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/preventExtensions", "handler.preventExtensions()")}}</dt>
- <dd>A trap for {{jsxref("Object.preventExtensions")}}.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/getOwnPropertyDescriptor", "handler.getOwnPropertyDescriptor()")}}</dt>
- <dd>A trap for {{jsxref("Object.getOwnPropertyDescriptor")}}.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/defineProperty", "handler.defineProperty()")}}</dt>
- <dd>A trap for {{jsxref("Object.defineProperty")}}.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/has", "handler.has()")}}</dt>
- <dd>A trap for the {{jsxref("Operators/in", "in")}} operator.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/get", "handler.get()")}}</dt>
- <dd>A trap for getting property values.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/set", "handler.set()")}}</dt>
- <dd>A trap for setting property values.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/deleteProperty", "handler.deleteProperty()")}}</dt>
- <dd>A trap for the {{jsxref("Operators/delete", "delete")}} operator.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/ownKeys", "handler.ownKeys()")}}</dt>
- <dd>A trap for {{jsxref("Object.getOwnPropertyNames")}} and {{jsxref("Object.getOwnPropertySymbols")}}.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/apply", "handler.apply()")}}</dt>
- <dd>A trap for a function call.</dd>
- <dt>{{jsxref("Global_Objects/Proxy/handler/construct", "handler.construct()")}}</dt>
- <dd>A trap for the {{jsxref("Operators/new", "new")}} operator.</dd>
-</dl>
-
-<p>Some non-standard traps are <a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features#Proxy">obsolete and have been removed</a>.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots', 'Proxy Object Internal Methods and Internal Slots')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots', 'Proxy Object Internal Methods and Internal Slots')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>The <code>enumerate</code> handler has been removed.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Proxy.handler")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Proxy")}}</li>
-</ul>
diff --git a/files/es/web/javascript/reference/global_objects/proxy/handler/set/index.html b/files/es/web/javascript/reference/global_objects/proxy/handler/set/index.html
deleted file mode 100644
index ee5ac155e7..0000000000
--- a/files/es/web/javascript/reference/global_objects/proxy/handler/set/index.html
+++ /dev/null
@@ -1,122 +0,0 @@
----
-title: handler.set()
-slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/set
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Proxy
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/set
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>handler.set()</strong></code> captura las asignaciones de un valor a una determinada propiedad.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: js">var p = new Proxy(target, {
-  set: function(target, property, value, receiver) {
-  }
-});
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>El método <code>set</code> recibe los siguientes parámetros.<code>this</code> se asocia al handler.</p>
-
-<dl>
- <dt><code>target</code></dt>
- <dd>El objeto objetivo.</dd>
- <dt><code>property</code></dt>
- <dd>El nombre de la propiedad a la que se le asignará el valor.</dd>
- <dt><code>value</code></dt>
- <dd>El nuevo valor asignado a la propiedad.</dd>
- <dt><code>receiver</code></dt>
- <dd>El objeto al que originalmente iba dirigida la asignación. Normalmente es el proxy. Sin embargo el manejador o <code>set</code> handler puede ser llamado de forma indirecta a través de un prototipo entre otros.</dd>
- <dd>Por ejemplo, suponga que un escript ejecuta la sentencia <code>obj.name = "jen"</code>, y <code>obj</code> no es un proxy, y no posee la propiedad <code>.name</code>, pero tiene un proxy en su cadena de prototipos. El manejador <code>set</code> de este proxy será llamado y  obj será pasado como el receiver.</dd>
-</dl>
-
-<h3 id="Valor_Devuelto">Valor Devuelto</h3>
-
-<p>El método <code>set</code> debe devolver un valor booleano. Devolverá <code>true</code> para indicar que la asignación se ha llevado a cabo con éxito. Si devuelve <code>false</code>, y la asignación tiene lugar en modo estricto, se lanzará un error de tipo <code>TypeError</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code><strong>handler.set</strong></code> captura la asignación de un valor a una propiedad.</p>
-
-<h3 id="Qué_intercepta">Qué intercepta</h3>
-
-<p>Las siguientes operaciones son capturadas:</p>
-
-<ul>
- <li>Asignación a propiedades: <code>proxy[foo] = bar</code> y <code>proxy.foo = bar</code></li>
- <li>Asignación a propiedades heredadas: <code>Object.create(proxy)[foo] = bar</code></li>
- <li>{{jsxref("Reflect.set()")}}</li>
-</ul>
-
-<h3 id="Invariantes">Invariantes</h3>
-
-<p>Si los siguientes invariantes son violados, el proxy lanzará un {{jsxref("TypeError")}}:</p>
-
-<ul>
- <li>El valor de la propiedad no puede ser diferente al de la correspondiente propiedad del objeto, si esta es una propiedad no configurable, o sin permisos de escritura.</li>
- <li>No se puede asignar un valor a una propiedad si la correspondiente propiedad en el objeto objetivo es no configurable y tiene <code>undefined</code> como su atributo [[Set]].</li>
- <li>En modo estricto, la devolución de <code>false</code> pro parte del manejador <code>set</code> lanzará una excepción del tipo {{jsxref("TypeError")}}.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente código captura la asignación de un valor a una propiedad.</p>
-
-<pre class="brush: js">var p = new Proxy({}, {
-  set: function(target, prop, value, receiver) {
-    target[prop] = value
-    console.log('property set: ' + prop + ' = ' + value)
-    return true
-  }
-})
-
-console.log('a' in p)  // false
-
-p.a = 10               // "propiedad asignada: a = 10"
-console.log('a' in p)  // true
-console.log(p.a)       // 10
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots-set-p-v-receiver', '[[Set]]')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-set-p-v-receiver', '[[Set]]')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_buscadores">Compatibilidad con los buscadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Proxy.handler.set")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Proxy")}}</li>
- <li>{{jsxref("Proxy.handler", "handler")}}</li>
- <li>{{jsxref("Reflect.set()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/reference/global_objects/proxy/index.html b/files/es/web/javascript/reference/global_objects/proxy/index.html
new file mode 100644
index 0000000000..7254cb4525
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/proxy/index.html
@@ -0,0 +1,440 @@
+---
+title: Proxy
+slug: Web/JavaScript/Reference/Global_Objects/Proxy
+translation_of: Web/JavaScript/Reference/Global_Objects/Proxy
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Proxy
+---
+<div>
+<div>{{JSRef}}</div>
+</div>
+
+<p>El objeto <strong>Proxy</strong> se usa para definir un comportamiento personalizado para operaciones fundamentales (por ejemplo, para observar propiedades, cuando se asignan, enumeración, invocación de funciones, etc).</p>
+
+<h2 id="Terminología">Terminología</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler">handler</a></dt>
+ <dd>Objeto que gestiona las intercepciones a las propiedades del objeto proxy.</dd>
+ <dt>traps</dt>
+ <dd>Son los métodos interceptores que proveen acceso a las propiedades. Es análogo al concepto de <em>traps</em> en los sistemas operativos.</dd>
+ <dt>target</dt>
+ <dd>El objeto que virtualiza este objeto. Suele usarse como <em>backend</em> de almacenamiento del proxy. Invariantes (semántica que no acepta cambios) respecto a la no extensibilidad del objeto o propiedades no configurables se verifican contra este <em>target</em>.</dd>
+</dl>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">var p = new Proxy(target, handler);
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>target</code></dt>
+ <dd>Un objeto <em>target </em>(puede ser cualquier órden de objetos, incluyendo un array nativa, funcion o incluso otro proxy) o función que contenga el <code>Proxy</code></dd>
+ <dt><code>handler</code></dt>
+ <dd>Un objeto cuyas propiedades son funciones que definen el comportamiento del proxy cuando una operación es realizada en él.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Proxy.revocable()")}}</dt>
+ <dd>Crea un objeto <code>Proxy</code> revocable</dd>
+</dl>
+
+<h2 id="Métodos_del_objeto_handler">Métodos del objeto handler</h2>
+
+<p>The handler object is a placeholder object which contains traps for <code>Proxy</code>.</p>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler', 'Methods') }}</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_básico">Ejemplo básico</h3>
+
+<p>En este simple ejemplo el número <code>37</code> se devuelve como valor predeterminado cuando la propiedad <code>name</code> no se encuentra en el objeto. Se utilizando el manejador <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/get">get</a></code>.</p>
+
+<pre class="brush: js notranslate">var handler = {
+    get: function(target, name){
+        return name in target?
+            target[name] :
+            37;
+    }
+};
+
+var p = new Proxy({}, handler);
+p.a = 1;
+p.b = undefined;
+
+console.log(p.a, p.b); // 1, undefined
+console.log('c' in p, p.c); // false, 37
+</pre>
+
+<h3 id="No-op_forwarding_proxy">No-op forwarding proxy</h3>
+
+<p>In this example, we are using a native JavaScript object to which our proxy will forward all operations that are applied to it.</p>
+
+<pre class="brush: js notranslate">var target = {};
+var p = new Proxy(target, {});
+
+p.a = 37; // operation forwarded to the target
+
+console.log(target.a); // 37. The operation has been properly forwarded
+</pre>
+
+<h3 id="Validación">Validación</h3>
+
+<p>Con un <code>Proxy</code>, puedes validar fácilmente el valor puesto a un objeto. Este ejemplo usa el handler (manejador) <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/set"><code>set</code></a>.</p>
+
+<pre class="brush: js notranslate">let validator = {
+  set: function(obj, prop, value) {
+    if (prop === 'age') {
+      if (!Number.isInteger(value)) {
+        throw new TypeError('The age is not an integer');
+      }
+      if (value &gt; 200) {
+        throw new RangeError('The age seems invalid');
+      }
+    }
+
+    // The default behavior to store the value
+    obj[prop] = value;
+  }
+};
+
+let person = new Proxy({}, validator);
+
+person.age = 100;
+console.log(person.age); // 100
+person.age = 'young'; // Throws an exception
+person.age = 300; // Throws an exception
+</pre>
+
+<h3 id="Extending_constructor">Extending constructor</h3>
+
+<p>A function proxy could easily extend a constructor with a new constructor. This example uses the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/construct"><code>construct</code></a> and <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/apply"><code>apply</code></a> handlers.</p>
+
+<pre class="brush: js notranslate">function extend(sup,base) {
+  var descriptor = Object.getOwnPropertyDescriptor(
+    base.prototype,"constructor"
+  );
+  base.prototype = Object.create(sup.prototype);
+  var handler = {
+    construct: function(target, args) {
+      var obj = Object.create(base.prototype);
+      this.apply(target,obj,args);
+      return obj;
+    },
+    apply: function(target, that, args) {
+      sup.apply(that,args);
+      base.apply(that,args);
+    }
+  };
+  var proxy = new Proxy(base,handler);
+  descriptor.value = proxy;
+  Object.defineProperty(base.prototype, "constructor", descriptor);
+  return proxy;
+}
+
+var Person = function(name){
+  this.name = name;
+};
+
+var Boy = extend(Person, function(name, age) {
+  this.age = age;
+});
+
+Boy.prototype.sex = "M";
+
+var Peter = new Boy("Peter", 13);
+console.log(Peter.sex);  // "M"
+console.log(Peter.name); // "Peter"
+console.log(Peter.age);  // 13</pre>
+
+<h3 id="Manipular_nodos_del_DOM">Manipular nodos del DOM</h3>
+
+<p>A veces queremos cambiar el atributo clase de dos elementos diferentes. Aquí se muestra cómo usando el handler (manejador) <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/set"><code>set</code></a>.</p>
+
+<pre class="brush: js notranslate">let view = new Proxy({
+  selected: null
+},
+{
+  set: function(obj, prop, newval) {
+    let oldval = obj[prop];
+
+    if (prop === 'selected') {
+      if (oldval) {
+        oldval.setAttribute('aria-selected', 'false');
+      }
+      if (newval) {
+        newval.setAttribute('aria-selected', 'true');
+      }
+    }
+
+    // The default behavior to store the value
+    obj[prop] = newval;
+  }
+});
+
+let i1 = view.selected = document.getElementById('item-1');
+console.log(i1.getAttribute('aria-selected')); // 'true'
+
+let i2 = view.selected = document.getElementById('item-2');
+console.log(i1.getAttribute('aria-selected')); // 'false'
+console.log(i2.getAttribute('aria-selected')); // 'true'
+</pre>
+
+<h3 id="Value_correction_and_an_extra_property">Value correction and an extra property</h3>
+
+<p>The <code>products</code> proxy object evaluates the passed value and convert it to an array if needed. The object also supports an extra property called <code>latestBrowser</code> both as a getter and a setter.</p>
+
+<pre class="brush: js notranslate">let products = new Proxy({
+  browsers: ['Internet Explorer', 'Netscape']
+},
+{
+  get: function(obj, prop) {
+    // An extra property
+    if (prop === 'latestBrowser') {
+      return obj.browsers[obj.browsers.length - 1];
+    }
+
+    // The default behavior to return the value
+    return obj[prop];
+  },
+  set: function(obj, prop, value) {
+    // An extra property
+    if (prop === 'latestBrowser') {
+      obj.browsers.push(value);
+      return;
+    }
+
+    // Convert the value if it is not an array
+    if (typeof value === 'string') {
+      value = [value];
+    }
+
+    // The default behavior to store the value
+    obj[prop] = value;
+  }
+});
+
+console.log(products.browsers); // ['Internet Explorer', 'Netscape']
+products.browsers = 'Firefox'; // pass a string (by mistake)
+console.log(products.browsers); // ['Firefox'] &lt;- no problem, the value is an array
+
+products.latestBrowser = 'Chrome';
+console.log(products.browsers); // ['Firefox', 'Chrome']
+console.log(products.latestBrowser); // 'Chrome'
+</pre>
+
+<h3 id="Finding_an_array_item_object_by_its_property">Finding an array item object by its property</h3>
+
+<p>This proxy extends an array with some utility features. As you see, you can flexibly "define" properties without using <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties"><code>Object.defineProperties</code></a>. This example can be adapted to find a table row by its cell. In that case, the target will be <a href="/en-US/docs/DOM/table.rows"><code>table.rows</code></a>.</p>
+
+<pre class="brush: js notranslate">let products = new Proxy([
+  { name: 'Firefox', type: 'browser' },
+  { name: 'SeaMonkey', type: 'browser' },
+  { name: 'Thunderbird', type: 'mailer' }
+],
+{
+  get: function(obj, prop) {
+    // The default behavior to return the value; prop is usually an integer
+    if (prop in obj) {
+      return obj[prop];
+    }
+
+    // Get the number of products; an alias of products.length
+    if (prop === 'number') {
+      return obj.length;
+    }
+
+    let result, types = {};
+
+    for (let product of obj) {
+      if (product.name === prop) {
+        result = product;
+      }
+      if (types[product.type]) {
+        types[product.type].push(product);
+      } else {
+        types[product.type] = [product];
+      }
+    }
+
+    // Get a product by name
+    if (result) {
+      return result;
+    }
+
+    // Get products by type
+    if (prop in types) {
+      return types[prop];
+    }
+
+    // Get product types
+    if (prop === 'types') {
+      return Object.keys(types);
+    }
+
+    return undefined;
+  }
+});
+
+console.log(products[0]); // { name: 'Firefox', type: 'browser' }
+console.log(products['Firefox']); // { name: 'Firefox', type: 'browser' }
+console.log(products['Chrome']); // undefined
+console.log(products.browser); // [{ name: 'Firefox', type: 'browser' }, { name: 'SeaMonkey', type: 'browser' }]
+console.log(products.types); // ['browser', 'mailer']
+console.log(products.number); // 3
+</pre>
+
+<h3 id="A_complete_traps_list_example">A complete <code>traps</code> list example</h3>
+
+<p>Now in order to create a complete sample <code>traps</code> list, for didactic purposes, we will try to proxify a <em>non native</em> object that is particularly suited to this type of operation: the <code>docCookies</code> global object created by <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie/Simple_document.cookie_framework" title="https://developer.mozilla.org/en-US/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support">the "little framework" published on the <code>document.cookie</code> page</a>.</p>
+
+<pre class="brush: js notranslate">/*
+  var docCookies = ... get the "docCookies" object here:
+  https://developer.mozilla.org/en-US/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support
+*/
+
+var docCookies = new Proxy(docCookies, {
+  get: function (oTarget, sKey) {
+    return oTarget[sKey] || oTarget.getItem(sKey) || undefined;
+  },
+  set: function (oTarget, sKey, vValue) {
+    if (sKey in oTarget) { return false; }
+    return oTarget.setItem(sKey, vValue);
+  },
+  deleteProperty: function (oTarget, sKey) {
+    if (sKey in oTarget) { return false; }
+    return oTarget.removeItem(sKey);
+  },
+  enumerate: function (oTarget, sKey) {
+    return oTarget.keys();
+  },
+  ownKeys: function (oTarget, sKey) {
+    return oTarget.keys();
+  },
+  has: function (oTarget, sKey) {
+    return sKey in oTarget || oTarget.hasItem(sKey);
+  },
+  defineProperty: function (oTarget, sKey, oDesc) {
+    if (oDesc &amp;&amp; "value" in oDesc) { oTarget.setItem(sKey, oDesc.value); }
+    return oTarget;
+  },
+  getOwnPropertyDescriptor: function (oTarget, sKey) {
+    var vValue = oTarget.getItem(sKey);
+    return vValue ? {
+      value: vValue,
+      writable: true,
+      enumerable: true,
+      configurable: false
+    } : undefined;
+  },
+});
+
+/* Cookies test */
+
+console.log(docCookies.my_cookie1 = "First value");
+console.log(docCookies.getItem("my_cookie1"));
+
+docCookies.setItem("my_cookie1", "Changed value");
+console.log(docCookies.my_cookie1);</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-proxy-objects', 'Proxy')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-proxy-objects', 'Proxy')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(49.0)}}</td>
+   <td>13 (10586)</td>
+   <td>{{ CompatGeckoDesktop("18") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(49.0)}}</td>
+   <td>{{ CompatGeckoDesktop("18") }}</td>
+   <td>13 (10586)</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Gecko_specific_notes">Gecko specific notes</h2>
+
+<ul>
+ <li>At present, <code>Object.getPrototypeOf(proxy)</code> unconditionally returns <code>Object.getPrototypeOf(target)</code>, because the ES6 getPrototypeOf trap is not yet implemented ({{bug(795904)}}, {{bug(888969)}}).</li>
+ <li><code>Array.isArray(proxy)</code> unconditionally returns <code>Array.isArray(target)</code> ({{bug(1096753)}}, {{bug(1111785)}}).</li>
+ <li><code>Object.prototype.toString.call(proxy)</code> unconditionally returns <code>Object.prototype.toString.call(target)</code>, because ES6 Symbol.toStringTag is not yet implemented ({{bug(1114580)}}).</li>
+</ul>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li><a class="external" href="https://www.youtube.com/watch?v=sClk6aB_CPk">"Proxies are awesome" Brendan Eich presentation at JSConf</a> (<a class="external" href="http://www.slideshare.net/BrendanEich/metaprog-5303821">slides</a>)</li>
+ <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:proxies">ECMAScript Harmony Proxy proposal page</a> and <a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:proxies_semantics">ECMAScript Harmony proxy semantics page</a></li>
+ <li><a class="external" href="http://soft.vub.ac.be/~tvcutsem/proxies/">Tutorial on proxies</a></li>
+ <li><a href="/en-US/docs/JavaScript/Old_Proxy_API" title="/en-US/docs/JavaScript/Old_Proxy_API">SpiderMonkey specific Old Proxy API</a></li>
+ <li>{{jsxref("Object.watch()")}} is a non-standard feature but has been supported in Gecko for a long time.</li>
+</ul>
+
+<h2 id="Licensing_note">Licensing note</h2>
+
+<p>Some content (text, examples) in this page has been copied or adapted from the <a class="external" href="http://wiki.ecmascript.org/doku.php">ECMAScript wiki</a> which content is licensed <a class="external" href="http://creativecommons.org/licenses/by-nc-sa/2.0/">CC 2.0 BY-NC-SA</a>.</p>
diff --git a/files/es/web/javascript/reference/global_objects/proxy/proxy/getownpropertydescriptor/index.html b/files/es/web/javascript/reference/global_objects/proxy/proxy/getownpropertydescriptor/index.html
new file mode 100644
index 0000000000..3a32edd2c9
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/proxy/proxy/getownpropertydescriptor/index.html
@@ -0,0 +1,130 @@
+---
+title: handler.getOwnPropertyDescriptor()
+slug: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/getOwnPropertyDescriptor
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Proxy
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/getOwnPropertyDescriptor
+original_slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/getOwnPropertyDescriptor
+---
+<div>{{JSRef}}</div>
+
+<div>El método <strong><code>handler.getOwnPropertyDescriptor()</code></strong> captura {{jsxref("Object.getOwnPropertyDescriptor()")}}.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: js">var p = new Proxy(target, {
+  getOwnPropertyDescriptor: function(target, prop) {
+  }
+});
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>El método <code>getOwnPropertyDescriptor</code> recibe los siguiente parámetros. <code>this</code> está asociado al handler del proxy.</p>
+
+<dl>
+ <dt><code>target</code></dt>
+ <dd>El objeto destino.</dd>
+ <dt><code>prop</code></dt>
+ <dd>El nombre de la propiedad cuya descripción ha de ser devuelta.</dd>
+</dl>
+
+<h3 id="Valor_Devuelto">Valor Devuelto</h3>
+
+<p>El método <code>getOwnPropertyDescriptor</code> debe devolver un objeto o  <code>undefined</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code><strong>handler.getOwnPropertyDescriptor()</strong></code> captura {{jsxref("Object.getOwnPropertyDescriptor()")}}.</p>
+
+<h3 id="Intercepciones">Intercepciones</h3>
+
+<p>Este método intercepta las siguientes operaciones:</p>
+
+<ul>
+ <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
+ <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li>
+</ul>
+
+<h3 id="Invariantes">Invariantes</h3>
+
+<p>Si los siguientes invariantes son violados, el proxy lanzará {{jsxref("TypeError")}}:</p>
+
+<ul>
+ <li><code>getOwnPropertyDescriptor</code> debe devolver un objeto o  <code>undefined</code>.</li>
+ <li>No puede devolver que una propiedad no existe si está presente en el objeto como no configurable.</li>
+ <li>No puede devolver que una propiedad no existe si esta está presente como una propiedad propia del objeto destino y el objeto no es extensible.</li>
+ <li>No puede devolver que una propuedad existe, si esta no está presente en el objeto destino y el objeto no es extensible. </li>
+ <li>No puede devolver que una propiedad es no configurable si esta no existe en el objeto destino o si existe pero sí es configurable.</li>
+ <li>El resultado de  <code>Object.getOwnPropertyDescriptor(target)</code> puede ser aplicado al objeto destino mediante <code>Object.defineProperty </code>y no lanzará ningún tipo de excepción.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente código captura {{jsxref("Object.getOwnPropertyDescriptor()")}}.</p>
+
+<pre class="brush: js">var p = new Proxy({ a: 20}, {
+  getOwnPropertyDescriptor: function(target, prop) {
+    console.log('called: ' + prop);
+    return { configurable: true, enumerable: true, value: 10 };
+  }
+});
+
+console.log(Object.getOwnPropertyDescriptor(p, 'a').value); // "called: a"
+                                                            // 10
+</pre>
+
+<p>El siguiente código viola uno de los invariantes definidos previamente.</p>
+
+<pre class="brush: js">var obj = { a: 10 };
+Object.preventExtensions(obj);
+var p = new Proxy(obj, {
+  getOwnPropertyDescriptor: function(target, prop) {
+    return undefined;
+  }
+});
+
+Object.getOwnPropertyDescriptor(p, 'a'); // TypeError is thrown
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots-getownproperty-p', '[[GetOwnProperty]]')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición Inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-getownproperty-p', '[[GetOwnProperty]]')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_buscadores">Compatibilidad con buscadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Proxy.handler.getOwnPropertyDescriptor")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Proxy")}}</li>
+ <li>{{jsxref("Proxy.handler", "handler")}}</li>
+ <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
+ <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/proxy/proxy/index.html b/files/es/web/javascript/reference/global_objects/proxy/proxy/index.html
new file mode 100644
index 0000000000..695cf4ce22
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/proxy/proxy/index.html
@@ -0,0 +1,85 @@
+---
+title: Proxy handler
+slug: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - NeedsTranslation
+  - Proxy
+  - TopicStub
+translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy
+translation_of_original: Web/JavaScript/Reference/Global_Objects/Proxy/handler
+original_slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler
+---
+<div>{{JSRef}}</div>
+
+<p>The proxy's handler object is a placeholder object which contains traps for {{jsxref("Proxy", "proxies", "", 1)}}.</p>
+
+<h2 id="Methods">Methods</h2>
+
+<p>All traps are optional. If a trap has not been defined, the default behavior is to forward the operation to the target.</p>
+
+<dl>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/getPrototypeOf", "handler.getPrototypeOf()")}}</dt>
+ <dd>A trap for {{jsxref("Object.getPrototypeOf")}}.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/setPrototypeOf", "handler.setPrototypeOf()")}}</dt>
+ <dd>A trap for {{jsxref("Object.setPrototypeOf")}}.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/isExtensible", "handler.isExtensible()")}}</dt>
+ <dd>A trap for {{jsxref("Object.isExtensible")}}.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/preventExtensions", "handler.preventExtensions()")}}</dt>
+ <dd>A trap for {{jsxref("Object.preventExtensions")}}.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/getOwnPropertyDescriptor", "handler.getOwnPropertyDescriptor()")}}</dt>
+ <dd>A trap for {{jsxref("Object.getOwnPropertyDescriptor")}}.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/defineProperty", "handler.defineProperty()")}}</dt>
+ <dd>A trap for {{jsxref("Object.defineProperty")}}.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/has", "handler.has()")}}</dt>
+ <dd>A trap for the {{jsxref("Operators/in", "in")}} operator.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/get", "handler.get()")}}</dt>
+ <dd>A trap for getting property values.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/set", "handler.set()")}}</dt>
+ <dd>A trap for setting property values.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/deleteProperty", "handler.deleteProperty()")}}</dt>
+ <dd>A trap for the {{jsxref("Operators/delete", "delete")}} operator.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/ownKeys", "handler.ownKeys()")}}</dt>
+ <dd>A trap for {{jsxref("Object.getOwnPropertyNames")}} and {{jsxref("Object.getOwnPropertySymbols")}}.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/apply", "handler.apply()")}}</dt>
+ <dd>A trap for a function call.</dd>
+ <dt>{{jsxref("Global_Objects/Proxy/handler/construct", "handler.construct()")}}</dt>
+ <dd>A trap for the {{jsxref("Operators/new", "new")}} operator.</dd>
+</dl>
+
+<p>Some non-standard traps are <a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features#Proxy">obsolete and have been removed</a>.</p>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots', 'Proxy Object Internal Methods and Internal Slots')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots', 'Proxy Object Internal Methods and Internal Slots')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>The <code>enumerate</code> handler has been removed.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Proxy.handler")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Proxy")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/proxy/proxy/set/index.html b/files/es/web/javascript/reference/global_objects/proxy/proxy/set/index.html
new file mode 100644
index 0000000000..2ab7598376
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/proxy/proxy/set/index.html
@@ -0,0 +1,123 @@
+---
+title: handler.set()
+slug: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/set
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Proxy
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/Proxy/Proxy/set
+original_slug: Web/JavaScript/Reference/Global_Objects/Proxy/handler/set
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>handler.set()</strong></code> captura las asignaciones de un valor a una determinada propiedad.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: js">var p = new Proxy(target, {
+  set: function(target, property, value, receiver) {
+  }
+});
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>El método <code>set</code> recibe los siguientes parámetros.<code>this</code> se asocia al handler.</p>
+
+<dl>
+ <dt><code>target</code></dt>
+ <dd>El objeto objetivo.</dd>
+ <dt><code>property</code></dt>
+ <dd>El nombre de la propiedad a la que se le asignará el valor.</dd>
+ <dt><code>value</code></dt>
+ <dd>El nuevo valor asignado a la propiedad.</dd>
+ <dt><code>receiver</code></dt>
+ <dd>El objeto al que originalmente iba dirigida la asignación. Normalmente es el proxy. Sin embargo el manejador o <code>set</code> handler puede ser llamado de forma indirecta a través de un prototipo entre otros.</dd>
+ <dd>Por ejemplo, suponga que un escript ejecuta la sentencia <code>obj.name = "jen"</code>, y <code>obj</code> no es un proxy, y no posee la propiedad <code>.name</code>, pero tiene un proxy en su cadena de prototipos. El manejador <code>set</code> de este proxy será llamado y  obj será pasado como el receiver.</dd>
+</dl>
+
+<h3 id="Valor_Devuelto">Valor Devuelto</h3>
+
+<p>El método <code>set</code> debe devolver un valor booleano. Devolverá <code>true</code> para indicar que la asignación se ha llevado a cabo con éxito. Si devuelve <code>false</code>, y la asignación tiene lugar en modo estricto, se lanzará un error de tipo <code>TypeError</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code><strong>handler.set</strong></code> captura la asignación de un valor a una propiedad.</p>
+
+<h3 id="Qué_intercepta">Qué intercepta</h3>
+
+<p>Las siguientes operaciones son capturadas:</p>
+
+<ul>
+ <li>Asignación a propiedades: <code>proxy[foo] = bar</code> y <code>proxy.foo = bar</code></li>
+ <li>Asignación a propiedades heredadas: <code>Object.create(proxy)[foo] = bar</code></li>
+ <li>{{jsxref("Reflect.set()")}}</li>
+</ul>
+
+<h3 id="Invariantes">Invariantes</h3>
+
+<p>Si los siguientes invariantes son violados, el proxy lanzará un {{jsxref("TypeError")}}:</p>
+
+<ul>
+ <li>El valor de la propiedad no puede ser diferente al de la correspondiente propiedad del objeto, si esta es una propiedad no configurable, o sin permisos de escritura.</li>
+ <li>No se puede asignar un valor a una propiedad si la correspondiente propiedad en el objeto objetivo es no configurable y tiene <code>undefined</code> como su atributo [[Set]].</li>
+ <li>En modo estricto, la devolución de <code>false</code> pro parte del manejador <code>set</code> lanzará una excepción del tipo {{jsxref("TypeError")}}.</li>
+</ul>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente código captura la asignación de un valor a una propiedad.</p>
+
+<pre class="brush: js">var p = new Proxy({}, {
+  set: function(target, prop, value, receiver) {
+    target[prop] = value
+    console.log('property set: ' + prop + ' = ' + value)
+    return true
+  }
+})
+
+console.log('a' in p)  // false
+
+p.a = 10               // "propiedad asignada: a = 10"
+console.log('a' in p)  // true
+console.log(p.a)       // 10
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots-set-p-v-receiver', '[[Set]]')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-proxy-object-internal-methods-and-internal-slots-set-p-v-receiver', '[[Set]]')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_buscadores">Compatibilidad con los buscadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Proxy.handler.set")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Proxy")}}</li>
+ <li>{{jsxref("Proxy.handler", "handler")}}</li>
+ <li>{{jsxref("Reflect.set()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/rangeerror/prototype/index.html b/files/es/web/javascript/reference/global_objects/rangeerror/prototype/index.html
deleted file mode 100644
index fa75157c9d..0000000000
--- a/files/es/web/javascript/reference/global_objects/rangeerror/prototype/index.html
+++ /dev/null
@@ -1,131 +0,0 @@
----
-title: RangeError.prototype
-slug: Web/JavaScript/Reference/Global_Objects/RangeError/prototype
-tags:
-  - Error
-  - JavaScript
-  - Propiedad
-  - Prototipo
-  - Prototype
-  - RangeError
-translation_of: Web/JavaScript/Reference/Global_Objects/RangeError
-translation_of_original: Web/JavaScript/Reference/Global_Objects/RangeError/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>RangeError.prototype</strong></code> representa el prototipo de {{jsxref("RangeError")}}.</p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Todas las instancias de {{jsxref("RangeError")}} heredan de <code>RangeError.prototype</code>. Puede utilizar el prototipo para añadir propiedades o métodos a todas las instancias.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>RangeError.prototype.constructor</code></dt>
- <dd>Especifica la función que crea instancias del prototipo.</dd>
- <dt>{{jsxref("Error.prototype.message", "RangeError.prototype.message")}}</dt>
- <dd>Mensaje de error. Aunque ECMA-262 especifica que {{jsxref("RangeError")}} debe procurar su propio <code>message</code>, en <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, se hereda de {{jsxref("Error.prototype.message")}}.</dd>
- <dt>{{jsxref("Error.prototype.name", "RangeError.prototype.name")}}</dt>
- <dd>Nombre del error. Heredada de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.fileName", "RangeError.prototype.fileName")}}</dt>
- <dd>Ruta al fichero en el que se produjo el error. Heredada de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.lineNumber", "RangeError.prototype.lineNumber")}}</dt>
- <dd>Número de línea en el fichero en el que se produjo el error. Heredada de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.columnNumber", "RangeError.prototype.columnNumber")}}</dt>
- <dd>Número de columna de la línea en la que se produjo. Heredada de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.stack", "RangeError.prototype.stack")}}</dt>
- <dd>Pila de llamadas. Heredada de {{jsxref("Error")}}.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<p>Aunque el prototipo del objeto {{jsxref("RangeError")}} no contiene métodos propios, las instancias de {{jsxref("RangeError")}} heredan algunos a través de la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Herencia_y_la_cadena_de_protipos">cadena de prototipos</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Commentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definido como <code><em>NativeError</em>.prototype</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definido como <code><em>NativeError</em>.prototype</code>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Error.prototype")}}</li>
- <li>{{jsxref("Function.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/reference/global_objects/referenceerror/index.html b/files/es/web/javascript/reference/global_objects/referenceerror/index.html
new file mode 100644
index 0000000000..cc2cba44f7
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/referenceerror/index.html
@@ -0,0 +1,100 @@
+---
+title: ReferenceError
+slug: Web/JavaScript/Reference/Global_Objects/ReferenceError
+tags:
+  - Clase
+  - Class
+  - JavaScript
+  - Object
+  - Objeto
+  - ReferenceError
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/ReferenceError
+original_slug: Web/JavaScript/Referencia/Objetos_globales/ReferenceError
+---
+<div>{{JSRef("Objetos_globales", "ReferenceError")}}</div>
+
+<p>El objeto <strong><code>ReferenceError</code></strong> representa un error cuando se hace referencia a una variable inexistente.</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError/ReferenceError"><code>ReferenceError()</code></a></dt>
+ <dd>Crea un nuevo objeto <code>ReferenceError</code>.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{jsxref("Error.prototype.message", "ReferenceError.prototype.message")}}</dt>
+ <dd>Mensaje de error. Aunque ECMA-262 especifica que {{jsxref("ReferenceError")}} debe proporcionar su propia propiedad <code>message</code>, en <a href="/es/docs/Mozilla/Projects/SpiderMonkey"><code>SpiderMonkey</code></a>, hereda {{jsxref("Error.prototype.message")}}.</dd>
+ <dt>{{jsxref("Error.prototype.name", "ReferenceError.prototype.name")}}</dt>
+ <dd>Nombre del error. Heredado de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.fileName", "ReferenceError.prototype.fileName")}}</dt>
+ <dd>Ruta al archivo que generó este error. Heredado de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.lineNumber", "ReferenceError.prototype.lineNumber")}}</dt>
+ <dd>Número de línea en el archivo que generó este error. Heredado de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.columnNumber", "ReferenceError.prototype.columnNumber")}}</dt>
+ <dd>Número de columna en la línea que generó este error. Heredado de {{jsxref("Error")}}.</dd>
+ <dt>{{jsxref("Error.prototype.stack", "ReferenceError.prototype.stack")}}</dt>
+ <dd>Seguimiento de la pila. Heredado de {{jsxref("Error")}}.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Capturar_un_ReferenceError">Capturar un <code>ReferenceError</code></h3>
+
+<pre class="brush: js notranslate">try {
+  let a = undefinedVariable
+} catch (e) {
+  console.log(e instanceof ReferenceError)  // true
+  console.log(e.message)                    // "undefinedVariable no está definida"
+  console.log(e.name)                       // "ReferenceError"
+  console.log(e.fileName)                   // "Scratchpad/1"
+  console.log(e.lineNumber)                 // 2
+  console.log(e.columnNumber)               // 6
+  console.log(e.stack)                      // "@Scratchpad/2:2:7\n"
+}
+</pre>
+
+<h3 id="Crear_un_ReferenceError">Crear un <code>ReferenceError</code></h3>
+
+<pre class="brush: js notranslate">try {
+  throw new ReferenceError('Hola', 'someFile.js', 10)
+} catch (e) {
+  console.log(e instanceof ReferenceError)  // true
+  console.log(e.message)                    // "Hola"
+  console.log(e.name)                       // "ReferenceError"
+  console.log(e.fileName)                   // "someFile.js"
+  console.log(e.lineNumber)                 // 10
+  console.log(e.columnNumber)               // 0
+  console.log(e.stack)                      // "@Scratchpad/2:2:9\n"
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-referenceerror', 'ReferenceError')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.ReferenceError")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Error")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/compile/index.html b/files/es/web/javascript/reference/global_objects/regexp/compile/index.html
new file mode 100644
index 0000000000..9f23a0b47f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/compile/index.html
@@ -0,0 +1,94 @@
+---
+title: RegExp.prototype.compile()
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/compile
+tags:
+  - Desaprovado
+  - Expresion Regular
+  - JavaScript
+  - Obsoleto
+  - Prototype
+  - Referencia
+  - RegExp
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/compile
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/compile
+---
+<div>{{JSRef}} {{deprecated_header}}</div>
+
+<p>El método obsoleto <code><strong>compile</strong></code><strong><code>()</code></strong> es usado para (re-)compilar una expresión regular durante la ejecución del script. Es básicamente lo mismo que el constructor <code>RegExp</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>regexObj</var>.compile(<var>patrón, flags</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>patrón</code></dt>
+ <dd>El texto de la expresión regular.</dd>
+ <dt><code>flags</code></dt>
+ <dd>
+ <p>Si es especificado, las flags pueden tener cualquier combinación de los siguientes valores:</p>
+
+ <dl>
+  <dt><code>g</code></dt>
+  <dd>búsqueda global (global match)</dd>
+  <dt><code>i</code></dt>
+  <dd>ignorar mayúsculas o minúsculas</dd>
+  <dt><code>m</code></dt>
+  <dd>Tratar caracteres de inicio y fin (^ y $) como multiples líneas de texto(por ejemplo: encontrar el inicio o fin de cada línea delimitada por \n o \r, no sólo al inicio o fin de toda la entrada de texto)</dd>
+  <dt><code>y</code></dt>
+  <dd>sticky; busca solamente desde el índice indicado por la propiedad <code>lastIndex</code> de esta expresión regular en la cadena objetivo (y no intenta buscar desde ningún índice posterior).</dd>
+ </dl>
+ </dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p> El método <code>compile</code> es obsoleto. Puedes simplemente utilizar el constructor <code>RegExp</code> para lograr el mismo efecto.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_compile">Usando <code>compile()</code></h3>
+
+<p>El siguiente ejemplo muestra como recompilar una expresión regultar con un nuevo patrón y nuevas flags.</p>
+
+<pre class="brush: js">var regexObj = new RegExp('foo', 'gi');
+regexObj.compile('new foo', 'g');
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Commentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-regexp.prototype.compile', 'RegExp.prototype.compile')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial. Definido en la (norma) Annex B ECMAScript para Características Adicionales para Navegadores Web.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.compile', 'RegExp.prototype.compile')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Definido en la (norma) Annex B ECMAScript para Características Adicionales para Navegadores Web.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.RegExp.compile")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("RegExp")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/exec/index.html b/files/es/web/javascript/reference/global_objects/regexp/exec/index.html
new file mode 100644
index 0000000000..a285f13a40
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/exec/index.html
@@ -0,0 +1,239 @@
+---
+title: RegExp.prototype.exec()
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/exec
+tags:
+  - Expresiones Regulares
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - RegExp
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/exec
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/exec
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>exec()</code></strong> ejecuta una busqueda sobre las coincidencias de una expresión regular en una cadena especifica. Devuelve el resultado como array, o {{jsxref("null")}}.</p>
+
+<p>Si está ejecutando una expresión regular solo para buscar si algo se cumple o no, usa el método {{jsxref("RegExp.prototype.test()")}} o el método {{jsxref("String.prototype.search()")}}.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>regexObj</var>.exec(<em>cadena</em>)</pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>cadena</code></dt>
+ <dd>Cadena sobre la cual se quiere aplicar la expresión regular</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Si se encuentran coincidencial, el método <code>exec()</code> devuelve un array y actualiza las propiedades del objecto de la expresión regular. El array devuelto contiene los elementos encontrados en su primer elemento, y un elemento por cada parte de la expresión regular que se encuentra entre parentesis y se encuentra dentro del texto que fué capturado.</p>
+
+<p>Si la busqueda falla, el método <code>exec()</code> devuelve {{jsxref("null")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Considerando el siguiente ejemplo:</p>
+
+<pre class="brush: js">// Busca "quick brown" seguido de "jumps", ignorando los caracteres que se
+// encuentren entre medias.
+// Recuerda "brown" y "jumps"
+// Ignora mayusculas y minusculas
+var re = /quick\s(brown).+?(jumps)/ig;
+var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');
+</pre>
+
+<p>La siguiente tabla muestra el resultado de este script:</p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <td class="header">Objeto</td>
+   <td class="header">Propiedad/Índice</td>
+   <td class="header">Descripción</td>
+   <td class="header">Ejemplo</td>
+  </tr>
+  <tr>
+   <td rowspan="4"><code>result</code></td>
+   <td><code>[0]</code></td>
+   <td>Todas las partes de la cadena que cumplen la expresión regular</td>
+   <td><code>Quick Brown Fox Jumps</code></td>
+  </tr>
+  <tr>
+   <td><code>[1],...[<em>n</em>]</code></td>
+   <td>
+    <p>Las subcadenas entre parentesis que han sido encontradas, si hay alguna. El número de subcadenas encontradas es ilimitado</p>
+   </td>
+   <td><code>[1] = Brown<br>
+    [2] = Jumps</code></td>
+  </tr>
+  <tr>
+   <td><code>index</code></td>
+   <td>El índice de base-0 del elemento encontrado en la cadena.</td>
+   <td><code>4</code></td>
+  </tr>
+  <tr>
+   <td><code>input</code></td>
+   <td>La cadena original.</td>
+   <td><code>The Quick Brown Fox Jumps Over The Lazy Dog</code></td>
+  </tr>
+  <tr>
+   <td rowspan="5"><code>re</code></td>
+   <td><code>lastIndex</code></td>
+   <td>El índice sobre el cual empieza la siguiente busqueda. Cuando no se usa g (busqueda global), esto va a ser siempre 0.</td>
+   <td><code>25</code></td>
+  </tr>
+  <tr>
+   <td><code>ignoreCase</code></td>
+   <td>Indica si la bandera "<code>i</code>" ha sido usada para ignorar mayusculas y minusculas.</td>
+   <td><code>true</code></td>
+  </tr>
+  <tr>
+   <td><code>global</code></td>
+   <td>Indica si la bandera "<code>g</code>" fue usada para hacer una busqueda global.</td>
+   <td><code>true</code></td>
+  </tr>
+  <tr>
+   <td><code>multiline</code></td>
+   <td>Indica si la bandera "<code>m"</code> fue usada para buscar en cadenas sobre multiples lineas</td>
+   <td><code>false</code></td>
+  </tr>
+  <tr>
+   <td><code>source</code></td>
+   <td>El texto del patrón de busqueda</td>
+   <td><code>quick\s(brown).+?(jumps)</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Encontrando_coincidencias_sucesivas">Encontrando coincidencias sucesivas</h3>
+
+<p>Si tu expresión regular contiene la bandera "<code>g</code>", puedes usar el método <code>exec()</code> varias veces para encontrar coincidencias sucesivas en la misma cadena. Cuando lo haces, la busqueda empieza en la subcadena <code>str</code> especificada por la propiedad {{jsxref("RegExp.lastIndex", "lastIndex")}} de la expresión regular ({{jsxref("RegExp.prototype.test()", "test()")}} también movera hacia adelante el indice de la propiedad {{jsxref("RegExp.lastIndex", "lastIndex")}}). Por ejemplo, asumiendo que tienes este script:</p>
+
+<pre class="brush: js">var myRe = /ab*/g;
+var str = 'abbcdefabh';
+var myArray;
+while ((myArray = myRe.exec(str)) !== null) {
+  var msg = 'Se ha encontrado ' + myArray[0] + '. ';
+  msg += 'La siguiente coincidencia empieza en el indice ' + myRe.lastIndex;
+  console.log(msg);
+}
+</pre>
+
+<p>Este script muestra el siguiente texto:</p>
+
+<pre>Se ha encontrado abb. La siguiente coincidencia empieza en el indice 3
+Se ha encontrado ab. La siguiente coincidencia empieza en el indice 9
+</pre>
+
+<p>Nota: No uses la expresión regular literalmente (o el constructor {{jsxref("RegExp")}}) dentro de la condición del bucle while o se creará un bucle infinito si hay una coincidencia, por culpa de que la propiedad {{jsxref("RegExp.lastIndex", "lastIndex")}} va a ser reiniciada por cada iteración del bucle. Además asegurate de que has usado la bandera de busqueda global "g" o se creará un bucle también.</p>
+
+<h3 id="Usando_exec()_con_RegExp_literales">Usando <code>exec()</code> con <code>RegExp</code> literales</h3>
+
+<p>También se puede usar <code>exec() sin crear un objeto de </code> {{jsxref("RegExp")}}:</p>
+
+<pre class="brush: js">var matches = /(hola \S+)/.exec('Esto es un hola mundo!');
+console.log(matches[1]);
+</pre>
+
+<p>Esto logueará un mensaje que contiene 'hola mundo!'.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.10.6.21', 'RegExp.exec')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-regexp.prototype.exec', 'RegExp.exec')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.exec', 'RegExp.exec')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Móvil (Gecko)</th>
+   <th>IE Móvil</th>
+   <th>Opera Móvil</th>
+   <th>Safari Móvil</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>Capítulo de <a href="/en-US/docs/Web/JavaScript/Guide/Regular_Expressions">Expresiones Regulares</a> en la <a href="/en-US/docs/Web/JavaScript/Guide">Guía de Javascript</a></li>
+ <li>{{jsxref("RegExp")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/ignorecase/index.html b/files/es/web/javascript/reference/global_objects/regexp/ignorecase/index.html
new file mode 100644
index 0000000000..24e70a06ac
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/ignorecase/index.html
@@ -0,0 +1,143 @@
+---
+title: RegExp.prototype.ignoreCase
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/ignoreCase
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/ignoreCase
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/ignoreCase
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad <strong><code>ignoreCase</code></strong> indica si la expresión regular está usando la bandera "i". <code>ignoreCase</code> es una propiedad de <em>sólo lectura </em>de una instancia de expresión regular.</p>
+
+<div>{{js_property_attributes(0, 0, 1)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El valor de <code>ignoreCase es un </code>{{jsxref("Boolean")}} y <code>true si la bandera "i" fue usada. De otra manera es false. La bandera "i" indica que el se debe ignorar la capitalización al tratar de encontrar los equivalentes en un texto.</code></p>
+
+<p>No se puede cambiar esta propiedad directamente.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_ignoreCase">Usando <code>ignoreCase</code></h3>
+
+<pre class="brush: js">var regex = new RegExp('foo', 'i');
+
+console.log(regex.ignoreCase); // true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.2. JavaScript 1.5: <code>ignoreCase</code> es una propiedad de la instancia  {{jsxref("RegExp")}}, y no del objecto {{jsxref("RegExp")}}.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.10.7.3', 'RegExp.prototype.ignoreCase')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-get-regexp.prototype.ignorecase', 'RegExp.prototype.ignoreCase')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td><code>ignoreCase</code> es ahora una propiedad accesora del prototipo en lugar de una propiedad de dato de una instancia.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-get-regexp.prototype.ignorecase', 'RegExp.prototype.ignoreCase')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Propiedad accesor del Prototipo</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop(38)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Propiedad accesor del Prototipo</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile(38)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("RegExp.lastIndex")}}</li>
+ <li>{{jsxref("RegExp.prototype.global")}}</li>
+ <li>{{jsxref("RegExp.prototype.multiline")}}</li>
+ <li>{{jsxref("RegExp.prototype.source")}}</li>
+ <li>{{jsxref("RegExp.prototype.sticky")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/index.html b/files/es/web/javascript/reference/global_objects/regexp/index.html
new file mode 100644
index 0000000000..8439c565a9
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/index.html
@@ -0,0 +1,265 @@
+---
+title: RegExp
+slug: Web/JavaScript/Reference/Global_Objects/RegExp
+tags:
+  - Clase
+  - Expresiones Regulares
+  - JavaScript
+  - Referencia
+  - RegExp
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>RegExp</code></strong> se utiliza para hacer coincidir texto con un patrón.</p>
+
+<p>Para obtener una introducción a las expresiones regulares, lee el {{JSxRef("../Guide/Regular_Expressions", "capítulo sobre expresiones regulares")}} en la {{JSxRef("../Guide/Regular_Expressions", "Guía de JavaScript")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<h3 id="Notación_literal_y_constructor">Notación literal y constructor</h3>
+
+<p>Hay dos formas de crear un objeto <code>RegExp</code>: una <em>notación literal</em> y un <em>constructor</em>.</p>
+
+<ul>
+ <li>Los parámetros de <strong>la notación literal</strong> se encierran entre barras y no utilizan comillas.</li>
+ <li>Los parámetros de <strong>la función constructora</strong> no se encierran entre barras, pero utilizan comillas.</li>
+</ul>
+
+<p>Las siguientes tres expresiones crean el mismo objeto de expresión regular:</p>
+
+<pre class="brush: js notranslate">let er = /ab+c/i; // notación literal
+let er = new RegExp('ab+c', 'i') // constructor con patrón de cadena como primer argumento
+let er = new RegExp(/ab+c/, 'i') // constructor con expresión regular literal como primer argumento (a partir de ECMAScript 6)
+</pre>
+
+<p>La notación literal da como resultado la compilación de la expresión regular cuando se evalúa la expresión. Utiliza la notación literal cuando la expresión regular permanecerá constante. Por ejemplo, si usas notación literal para construir una expresión regular usada en un bucle, la expresión regular no se volverá a compilar en cada iteración.</p>
+
+<p>El constructor del objeto de expresión regular, por ejemplo, <code>new RegExp('ab+c')</code>, da como resultado la compilación en tiempo de ejecución de la expresión regular. Utiliza la función constructora cuando sepas que el patrón de expresión regular cambiará, o no conozcas el patrón y lo obtienes de otra fuente, tal como la entrada del usuario.</p>
+
+<h3 id="Banderas_en_el_constructor">Banderas en el constructor</h3>
+
+<p>A partir de ECMAScript 6, <code>new RegExp(/ab+c/, 'i')</code> ya no arroja un {{JSxRef("TypeError")}} (<code>"no puedes proporcionar banderas cuando construyes una expresión regular a partir de otra"</code>) cuando el primer argumento es una <code>RegExp</code> y el segundo argumento <code><var>flags</var></code> está presente. En su lugar, se crea una nueva <code>RegExp</code> a partir de los argumentos.</p>
+
+<p>Cuando se utiliza la función constructora, las reglas de escape de cadenas normales (antes de los caracteres especiales con <code>\</code> cuando se incluyen en una cadena) son necesarias.</p>
+
+<p>Por ejemplo, los siguientes son equivalentes:</p>
+
+<pre class="brush: js notranslate">let er = /\w+/
+let er = new RegExp('\\w+')
+</pre>
+
+<h3 id="Propiedades_de_expresiones_regulares_similares_a_Perl">Propiedades de expresiones regulares similares a Perl</h3>
+
+<p>Ten en cuenta que varias de las propiedades de {{JSxRef("RegExp")}} tienen nombres largos y cortos (tipo Perl). Ambos nombres siempre se refieren al mismo valor. (Perl es el lenguaje de programación a partir del cual JavaScript modeló sus expresiones regulares). Consulta también las propiedades {{JSxRef("Características_Desaprobadas", "en desuso de RegExp", "#Propiedades_de_RegExp")}}</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{JSxRef("Objetos_globales/RegExp/RegExp", "RegExp()")}}</dt>
+ <dd>Crea un nuevo objeto <code>RegExp</code>.</dd>
+</dl>
+
+<h2 id="Propiedades_estáticas">Propiedades estáticas</h2>
+
+<dl>
+ <dt>{{JSxRef("RegExp.@@species", "get RegExp[@@species]")}}</dt>
+ <dd>La función constructora utilizada para crear objetos derivados.</dd>
+ <dt>{{JSxRef("RegExp.lastIndex")}}</dt>
+ <dd>El índice en el que comenzará la siguiente búsqueda.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{JSxRef("RegExp.prototype.flags")}}</dt>
+ <dd>Una cadena que contiene las banderas del objeto <code>RegExp</code>.</dd>
+ <dt>{{JSxRef("RegExp.prototype.dotAll")}}</dt>
+ <dd>Si el "<code>.</code>" coincide con nuevas líneas o no.</dd>
+ <dt>{{JSxRef("RegExp.prototype.global")}}</dt>
+ <dd>Si se debe probar o no la expresión regular con todas las posibles ocurrencias en una cadena, o solo con la primera.</dd>
+ <dt>{{JSxRef("RegExp.prototype.ignoreCase")}}</dt>
+ <dd>Si se deben o no ignorar las mayúsculas/minúsculas al buscar en una cadena.</dd>
+ <dt>{{JSxRef("RegExp.prototype.multiline")}}</dt>
+ <dd>Si buscar o no en cadenas multilínea.</dd>
+ <dt>{{JSxRef("RegExp.prototype.source")}}</dt>
+ <dd>El texto del patrón.</dd>
+ <dt>{{JSxRef("RegExp.prototype.sticky")}}</dt>
+ <dd>Si la búsqueda es pegajosa o no.</dd>
+ <dt>{{JSxRef("RegExp.prototype.unicode")}}</dt>
+ <dd>Si las funciones Unicode están habilitadas o no.</dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt>{{JSxRef("RegExp.prototype.compile()")}}</dt>
+ <dd>(Re)compila una expresión regular durante la ejecución de un script.</dd>
+ <dt>{{JSxRef("RegExp.prototype.exec()")}}</dt>
+ <dd>Ejecuta una búsqueda de una coincidencia en su parámetro de cadena.</dd>
+ <dt>{{JSxRef("RegExp.prototype.test()")}}</dt>
+ <dd>Prueba una coincidencia en su parámetro de cadena.</dd>
+ <dt>{{JSxRef("RegExp.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el objeto especificado. Redefine el método {{JSxRef("Object.prototype.toString()")}}.</dd>
+ <dt>{{JSxRef("RegExp.prototype.@@match()", "RegExp.prototype[@@match]()")}}</dt>
+ <dd>Realiza la coincidencia con la cadena dada y devuelve el resultado de la coincidencia.</dd>
+ <dt>{{JSxRef("RegExp.prototype.@@matchAll()", "RegExp.prototype[@@matchAll]()")}}</dt>
+ <dd>Devuelve todas las coincidencias de la expresión regular con una cadena.</dd>
+ <dt>{{JSxRef("RegExp.prototype.@@replace()", "RegExp.prototype[@@replace]()")}}</dt>
+ <dd>Reemplaza las coincidencias en una cadena dada con una nueva subcadena.</dd>
+ <dt>{{JSxRef("RegExp.prototype.@@search()", "RegExp.prototype[@@search]()")}}</dt>
+ <dd>Busca la coincidencia en la cadena dada y devuelve el índice del patrón encontrado en la cadena.</dd>
+ <dt>{{JSxRef("RegExp.prototype.@@split()", "RegExp.prototype[@@split]()")}}</dt>
+ <dd>Divide la cadena dada en un arreglo separando la cadena en subcadenas.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usar_una_expresión_regular_para_cambiar_el_formato_de_los_datos">Usar una expresión regular para cambiar el formato de los datos</h3>
+
+<p>El siguiente script usa el método {{JSxRef("String.prototype.replace()", "replace()")}} de la instancia {{JSxRef("Objetos_globales/String", "String")}} para hacer coincidir una nombre en el formato <em>primero último</em> y enviarlo en el formato <em>último, primero</em>.</p>
+
+<p>En el texto de reemplazo, el script usa <code>$1</code> y <code>$2</code> para indicar los resultados de los correspondientes paréntesis coincidentes en el patrón de expresión regular.</p>
+
+<pre class="brush: js notranslate">let er = /(\w+)\s(\w+)/
+let str = 'John Smith'
+let newstr = str.replace(er, '$2, $1')
+console.log(newstr)
+</pre>
+
+<p>Esto muestra <code>"Smith, John"</code>.</p>
+
+<h3 id="Uso_de_expresiones_regulares_para_dividir_líneas_con_diferentes_finales_de_líneasaltos_de_línea">Uso de expresiones regulares para dividir líneas con diferentes finales de línea/saltos de línea</h3>
+
+<p>El final de línea predeterminado varía según la plataforma (Unix, Windows, etc.). La división de líneas proporcionada en este ejemplo funciona en todas las plataformas.</p>
+
+<pre class="brush: js notranslate">let texto = 'Un poco de texto\ny un poco más\r\ny aún\reste es el final'
+let lineas = texto.split(/\r\n|\r|\n/)
+console.log(lineas) // logs [ 'Un poco de texto', 'y un poco más', 'y aún', 'este es el final' ]
+</pre>
+
+<p>Ten en cuenta que el orden de los patrones en la expresión regular es importante.</p>
+
+<h3 id="Usar_expresiones_regulares_en_varias_líneas">Usar expresiones regulares en varias líneas</h3>
+
+<pre class="brush: js notranslate">let s = '¡Por favor, sí\nhazme el día!'
+
+s.match(/sí.*día/);
+// Devuelve null
+
+s.match(/sí[^]*día/);
+// Devuelve ["sí\nhazme el día"]
+</pre>
+
+<h3 id="Usar_una_expresión_regular_con_la_bandera_pegajosa">Usar una expresión regular con la bandera pegajosa</h3>
+
+<p>La bandera {{JSxRef("Objetos_globales/RegExp/sticky", "sticky")}} indica que la expresión regular realiza una coincidencia permanente en la cadena de destino al intentar hacer coincidir a partir de {{JSxRef("RegExp.prototype.lastIndex")}}.</p>
+
+<pre class="brush: js notranslate">let str = '#foo#'
+let regex = /foo/y
+
+regex.lastIndex = 1
+regex.test(str)      // true
+regex.lastIndex = 5
+regex.test(str)      // false (lastIndex se tiene en cuenta con una bandera pegajosa)
+regex.lastIndex      // 0 (restablecer después de un error de coincidencia)</pre>
+
+<h3 id="La_diferencia_entre_la_bandera_pegajosa_y_la_bandera_global">La diferencia entre la bandera pegajosa y la bandera global</h3>
+
+<p>Con la bandera pegajosa <code>y</code>, la siguiente coincidencia tiene que ocurrir en la posición <code>lastIndex</code>, mientras que con la bandera global <code>g</code>, la coincidencia puede ocurrir en la posición <code>lastIndex</code> o posterior:</p>
+
+<pre class="brush: js notranslate">er = /\d/y;
+while (r = re.exec("123 456")) console.log(r, "Y er.lastIndex", er.lastIndex);
+
+// [ '1', index: 0, input: '123 456', groups: undefined ] AND er.lastIndex 1
+// [ '2', index: 1, input: '123 456', groups: undefined ] AND er.lastIndex 2
+// [ '3', index: 2, input: '123 456', groups: undefined ] AND er.lastIndex 3
+//   ... y no más coincidencias.</pre>
+
+<p>Con la bandera global <code>g</code>, coincidirían los 6 dígitos, no solo 3.</p>
+
+<h3 id="Expresión_regular_y_caracteres_Unicode">Expresión regular y caracteres Unicode</h3>
+
+<p><code>\w</code> y <code>\W</code> solo coincide con caracteres basados en ASCII; por ejemplo, <code>a</code> a <code>z</code>, <code>A</code> a <code>Z</code>, <code>0</code> a <code>9</code> y <code>_</code>.</p>
+
+<p>Para hacer coincidir caracteres de otros idiomas como Cirílico o Hebreo, usa <code>\u<var>hhhh</var></code>, donde <code><var>hhhh</var></code> es el Valor Unicode en hexadecimal.</p>
+
+<p>Este ejemplo demuestra cómo se pueden separar los caracteres Unicode de una palabra.</p>
+
+<pre class="brush: js notranslate">let texto = 'Образец texto на русском языке'
+let regex = /[\u0400-\u04FF]+/g
+
+let match = regex.exec(text)
+console.log(match[0])        // registra 'Образец'
+console.log(regex.lastIndex) // registra '7'
+
+let match2 = regex.exec(texto)
+console.log(match2[0])       // registra 'на' [no registró 'texto']
+console.log(regex.lastIndex) // registra '15'
+
+// y así sucesivamente
+</pre>
+
+<p>La función {{JSxRef("../Guide/Regular_Expressions/Unicode_Property_Escapes", "Escapes de propiedad Unicode")}} presenta una solución, al permitir una declaración tan simple como <code>\p{scx=Cyrl}</code>.</p>
+
+<h3 id="Extraer_el_nombre_de_subdominio_de_la_URL">Extraer el nombre de subdominio de la URL</h3>
+
+<pre class="brush: js notranslate">let url = 'http://xxx.dominio.com'
+console.log(/[^.]+/.exec(url)[0].substr(7)) // registra 'xxx'
+</pre>
+
+<div class="blockIndicator note">
+<p>En lugar de utilizar expresiones regulares para analizar las URL, normalmente es mejor utilizar el analizador de URL integrado en los navegadores mediante la <a href="/es/docs/Web/API/URL_API">API URL</a>.</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-regexp-regular-expression-objects', 'RegExp')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.RegExp")}}</p>
+</div>
+
+<h3 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h3>
+
+<p>A partir de Firefox 34, en el caso de un grupo de captura con cuantificadores que impiden su ejercicio, el texto coincidente para un grupo de captura ahora es <code>undefined</code> en lugar de una cadena vacía:</p>
+
+<pre class="brush: js notranslate">// Firefox 33 o anterior
+'x'.replace(/x(.)?/g, function(m, group) {
+  console.log("'grupo: " + group + "'");
+});
+// 'grupo: '
+
+// Firefox 34 o más reciente
+'x'.replace(/x(.)?/g, function(m, group) {
+  console.log("'grupo: " + group + "'");
+});
+// 'grupo: undefined'
+</pre>
+
+<p>Ten en cuenta que, debido a la compatibilidad web, <code>RegExp.<var>$N</var></code> seguirá devolviendo una cadena vacía en lugar de <code>undefined</code> ({{bug(1053944)}}).</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>El capítulo de {{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}} en la {{JSxRef("../Guide", "Guía de JavaScript")}}</li>
+ <li>{{JSxRef("String.prototype.match()")}}</li>
+ <li>{{JSxRef("String.prototype.replace()")}}</li>
+ <li>{{JSxRef("String.prototype.split()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/regexp/index.html b/files/es/web/javascript/reference/global_objects/regexp/regexp/index.html
new file mode 100644
index 0000000000..f4d4cfb535
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/regexp/index.html
@@ -0,0 +1,115 @@
+---
+title: Constructor RegExp()
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/RegExp
+tags:
+  - Constructor
+  - JavaScript
+  - Referencia
+  - RegExp
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/RegExp
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/RegExp
+---
+<div>{{JSRef}}</div>
+
+<p>El constructor <strong><code>RegExp</code></strong> crea un objeto de expresión regular para hacer coincidir el texto con un patrón.</p>
+
+<p>Para ver la introducción a las expresiones regulares, lee el {{JSxRef("../Guide/Regular_Expressions", "capítulo sobre expresiones regulares")}} en la {{JSxRef("../Guide", "Guía de JavaScript")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/regexp-constructor.html")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p>Son posibles las notaciones literal, constructor y de fábrica:</p>
+
+<pre class="syntaxbox notranslate">/<var>patrón</var>/<var>banderas</var>
+new RegExp(<var>patrón</var>[, <var>banderas</var>])
+RegExp(<var>patrón</var>[, <var>banderas</var>])
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>patrón</var></code></dt>
+ <dd>El texto de la expresión regular.</dd>
+ <dd>A partir de ES5, también puede ser otro objeto o <code>RegExp</code> literal (solo para las dos notaciones del constructor RegExp). Los patrones pueden incluir {{JSxRef("../Guide/Regular_Expressions", "caracteres especiales", "#Usar_caracteres_especiales")}} para que coincidan con un rango de valores más amplio que el de una cadena literal.</dd>
+ <dt><code><var>banderas</var></code></dt>
+ <dd>
+ <p>Si se especifica, <code><var>banderas</var></code> es una cadena que contiene las banderas para agregar.</p>
+
+ <p>Alternativamente, si se proporciona un objeto para el patrón, la cadena <code><var>banderas</var></code> reemplazará cualquiera de las banderas de ese objeto (y <code>lastIndex</code> se restablecerá a <code>0</code>) (a partir de ES2015).</p>
+
+ <p>Si no se especifica <code><var>banderas</var></code> y se proporciona un objeto de expresiones regulares, las banderas de ese objeto (y el valor de <code>lastIndex</code>) se copiarán.</p>
+
+ <p><code>banderas</code> puede contener cualquier combinación de los siguientes caracteres:</p>
+
+ <dl>
+  <dt><code>g</code> (coincidencia global)</dt>
+  <dd>Encuentra todas las coincidencias en lugar de detenerse después de la primera.</dd>
+  <dt><code>i</code> (ignorar mayúsculas y minúsculas)</dt>
+  <dd>Si el indicador <code>u</code> también está habilitado, utiliza el plegado de mayúsculas y minúsculas Unicode.</dd>
+  <dt><code>m</code> (multilínea)</dt>
+  <dd>Trata los caracteres iniciales y finales (<code>^</code> y <code>$</code>) como si estuvieran trabajando en varias líneas. En otras palabras, hace coincidir el principio o el final de <em>cada</em> línea (delimitada por <code>\n</code> o <code>\r</code>), no solo al principio o final de toda la cadena de entrada.</dd>
+  <dt><code>s</code> («<em>dotAll</em>» o punto para todo)</dt>
+  <dd>Permite que el punto (<code>.</code> coincida con nuevas líneas o no.</dd>
+  <dt><code>u</code> (unicode)</dt>
+  <dd>Trata el <code><var>patrón</var></code> como una secuencia de puntos de código Unicode. (Consulta también <a href="/es/docs/Web/API/DOMString/Binary">Cadenas binarias</a>).</dd>
+  <dt><code>y</code> (sticky)</dt>
+  <dd>Coincide solo con el índice indicado por la propiedad <code>lastIndex</code> de esta expresión regular en la cadena destino. No intenta coincidir con índices posteriores.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Notación_literal_y_constructor">Notación literal y constructor</h3>
+
+<p>Hay dos formas de crear un objeto <code>RegExp</code>: una <em>notación literal</em> y un <em>constructor</em>.</p>
+
+<ul>
+ <li>Los parámetros de <strong>la notación literal</strong> se encierran entre barras y no utilizan comillas.</li>
+ <li>Los parámetros de <strong>la función constructora</strong> no se encierran entre barras, pero utilizan comillas.</li>
+</ul>
+
+<p>Las siguientes tres expresiones crean la misma expresión regular:</p>
+
+<pre class="brush: js notranslate">/ab+c/i
+new RegExp(/ab+c/, 'i') // notación literal
+new RegExp('ab+c', 'i') // constructor
+</pre>
+
+<p>La notación literal da como resultado la compilación de la expresión regular cuando se evalúa la expresión. Utiliza la notación literal cuando la expresión regular permanecerá constante. Por ejemplo, si usas notación literal para construir una expresión regular usada en un bucle, la expresión regular no se volverá a compilar en cada iteración.</p>
+
+<p>El constructor del objeto de expresión regular, por ejemplo, <code>new RegExp('ab+c')</code>, da como resultado la compilación en tiempo de ejecución de la expresión regular. Usa la función constructora cuando sepas que el patrón de la expresión regular cambiará, o no conoces el patrón y lo obtienes de otra fuente, como la entrada del usuario.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-regexp-constructor', 'RegExp constructor')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.RegExp.RegExp")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>El capítulo de {{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}} en la {{JSxRef("../Guide", "Guía de JavaScript")}}</li>
+ <li>{{JSxRef("String.prototype.match()")}}</li>
+ <li>{{JSxRef("String.prototype.replace()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/rightcontext/index.html b/files/es/web/javascript/reference/global_objects/regexp/rightcontext/index.html
new file mode 100644
index 0000000000..ad127b9f08
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/rightcontext/index.html
@@ -0,0 +1,55 @@
+---
+title: RegExp.rightContext ($')
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/rightContext
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/rightContext
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/rightContext
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>La propiedad <strong>rightContext <em>(No es estándar)</em></strong> es una propiedad estática y de solo lectura de expresiones regulares que contiene la subcadena que sigue a la coincidencia más reciente. el alias para esta propiedad es <code>RegExp.$'</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>RegExp</var>.rightContext
+RegExp["$'"]</code>
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad <code>rightContext</code> es estática, no es una propiedad de un objeto de expresión regular individual. Debe usarse como <code>RegExp.rightContext</code> o <code>RegExp["$'"].</code></p>
+
+<p>El valor de la propiedad <code>rightContext</code> es de solo lectura y se modifica cada que hay una coincidencia exitosa.</p>
+
+<p>Tenga presente que no puede usar la abreviatura (<code>RegExp.$'</code>), porque el analizador espera una cadena de inicio, si lo hace optendra un error de sintaxis {{jsxref("SyntaxError")}} , para este caso, usted debe usar corchetes. consulte <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">notación de paréntesis para acceso a la propiedad</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_rightContext_y_'">Usando <code>rightContext</code> y <code>$'</code></h3>
+
+<pre class="brush: js">var re = /hola/g;
+re.test('hola mundo!');
+RegExp.rightContext; // " mundo!"
+RegExp["$'"];       // " mundo!"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No estándar. No forma parte de ninguna especificación actual.</p>
+
+<h2 id="Navegadores_compactibles">Navegadores compactibles</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.RegExp.rightContext")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{non-standard_inline}} {{jsxref("RegExp.input", "RegExp.input ($_)")}}</li>
+ <li>{{non-standard_inline}} {{jsxref("RegExp.lastMatch", "RegExp.lastMatch ($&amp;)")}}</li>
+ <li>{{non-standard_inline}} {{jsxref("RegExp.lastParen", "RegExp.lastParen ($+)")}}</li>
+ <li>{{non-standard_inline}} {{jsxref("RegExp.leftContext", "RegExp.leftContext ($`)")}}</li>
+ <li>{{non-standard_inline}} {{jsxref("RegExp.n", "RegExp.$1-$9")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/test/index.html b/files/es/web/javascript/reference/global_objects/regexp/test/index.html
new file mode 100644
index 0000000000..712b914236
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/test/index.html
@@ -0,0 +1,153 @@
+---
+title: RegExp.prototype.test()
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/test
+tags:
+  - Expresion Regular
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/test
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/test
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>test()</strong></code> ejecuta la búsqueda de una ocurrencia entre una expresión regular y una cadena especificada. Devuelve <code>true</code> o <code>false</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>regexObj</var>.test(<var>cadena</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>cadena</code></dt>
+ <dd>La cadena a comparar contra la expresión regular.</dd>
+</dl>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>Retorna <code>true</code> si existe una coincidencia entre la expresión regular y la cadena especificada; de lo contrario retorna <code>false</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Use <code>test()</code> cuando desee saber si existe la ocurrencia de un patrón en una cadena (similar al método {{jsxref("String.prototype.search()")}}, la diferencia es que <code>test()</code> devuelve un booleano, mientras que <code>search()</code> devuelve el índice de la coincidencia (si la encuentra) o -1 si no la encuentra).</p>
+
+<p>Si requiere más información (a coste de una ejecución más lenta) utilice el método {{jsxref("RegExp.prototype.exec()", "exec()")}}. Al igual que este último, multiples llamadas a <code>test()</code> sobre la misma instancia global de una expresión regular avanzará desde de la ocurrencia anterior.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_test()">Usando <code>test()</code></h3>
+
+<p>Ejemplo simple que prueba si "hello" está contenido al principio de una cadena y devuelve un valor booleano.</p>
+
+<pre class="brush: js">var cadena = "hello world!";
+var result = /^hello/.test(cadena);
+console.log(result); // true
+</pre>
+
+<p dir="ltr" id="tw-target-text">El siguiente ejemplo registra un mensaje que depende del éxito de la prueba:</p>
+
+<pre class="brush: js">function probarEntrada(regexp, cadena){
+  var subcadena;
+  if (regexp.test(cadena)) {
+    subcadena = ' contiene ';
+  } else {
+    subcadena = ' no contiene ';
+  }
+  console.log(cadena + subcadena + regexp.source);
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definition inicial. Implementado en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.10.6.3', 'RegExp.test')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-regexp.prototype.test', 'RegExp.test')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.test', 'RegExp.test')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h3>
+
+<p>Antes de Gecko 8.0 {{geckoRelease("8.0")}}, <code>test()</code> estaba incorrectamente implementado; cuando era llamado sin parámetros, buscaba emparejar contra el valor de la entrada anterior (la propiedad <code>RegExp.input</code>) en lugar de hacerlo contra la cadena <code>"undefined"</code>. Esto ha sido corregido; ahora <code>/undefined/.test()</code> resulta correctamente en <code>true</code>, en lugar de un error.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>El capítulo <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">Expresiones Regulares</a> de la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide">Guía JavaScript</a></li>
+ <li>{{jsxref("RegExp")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/regexp/tostring/index.html b/files/es/web/javascript/reference/global_objects/regexp/tostring/index.html
new file mode 100644
index 0000000000..724de783f7
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/regexp/tostring/index.html
@@ -0,0 +1,172 @@
+---
+title: RegExp.prototype.toString()
+slug: Web/JavaScript/Reference/Global_Objects/RegExp/toString
+tags:
+  - Expresion Regular
+  - Prototipo
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/toString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/toString
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toString()</code></strong> devuelve una cadena que representa el patrón de la expresión regular.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>regexObj</var>.toString();</code></pre>
+
+<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
+
+<p>Una cadena que representa el objeto dado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El objeto {{jsxref("RegExp")}} reemplaza el método <code>toString()</code> del objeto {{jsxref("Object")}}; no hereda de {{jsxref("Object.prototype.toString()")}}. Para objetos {{jsxref("RegExp")}}, el método <code>toString()</code> retorna una cadena que representa el patrón de la expresión regular.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toString()">Usando <code>toString()</code></h3>
+
+<p dir="ltr" id="tw-target-text">El siguiente ejemplo muestra la cadena de representación de un objeto {{jsxref("RegExp")}}:</p>
+
+<pre class="brush: js">var myExp = new RegExp('a+b+c');
+console.log(myExp.toString());  // '/a+b+c/'
+
+var foo = new RegExp('bar', 'g');
+console.log(foo.toString());    // '/bar/g'
+</pre>
+
+<h3 id="Expresiones_regulares_vacías_y_escapado">Expresiones regulares vacías y escapado</h3>
+
+<p>A partir de ECMAScript 5, una expresión regular vacía devuelve la cadena "/(?:)/" y los terminadores de línea tales como "\n" son escapados:</p>
+
+<pre class="brush: js">new RegExp().toString(); // "/(?:)/"
+
+new RegExp('\n').toString() === "/\n/";  // true, antes de ES5
+new RegExp('\n').toString() === "/\\n/"; // true, desde ES5
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table" style="color: #3b3c40; font-size: 14px; font-weight: normal;">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.9.5.2', 'RegExp.prototype.toString')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Agregado de la definición para escapado de caracteres especiales y "(?:)" para expresiones regulares vacías.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-regexp.prototype.tostring', 'RegExp.prototype.toString')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.tostring', 'RegExp.prototype.toString')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Escaping</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop(38)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Generic function</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop(39)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Escaping</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile(38)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Generic function</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile(39)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toString()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/@@iterator/index.html b/files/es/web/javascript/reference/global_objects/set/@@iterator/index.html
new file mode 100644
index 0000000000..81b87c5ea3
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/@@iterator/index.html
@@ -0,0 +1,87 @@
+---
+title: Set.prototype[@@iterator]()
+slug: Web/JavaScript/Reference/Global_Objects/Set/@@iterator
+tags:
+  - Iteradores
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/@@iterator
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/@@iterator
+---
+<div>{{JSRef}}</div>
+
+<p>El valor inicial de la propiedad <code><strong>@@iterator</strong></code>, es la misma función objeto que el valor inicial de la propiedad {{jsxref("Set.prototype.values()", "values")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/set-prototype-@@iterator.html")}}</div>
+
+<p class="hidden">El código fuente de este ejemplo interactivo lo puedes encontrar en el repositorio de Github. Si quieres contribuir con más ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>mySet</em>[Symbol.iterator]</code></pre>
+
+<h3 id="Valor_retornado"> Valor retornado</h3>
+
+<p>La función <strong>iteradora</strong> <code>Set</code> , la cuál es {{jsxref("Set.prototype.values()", "values()")}} por defecto.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_iterator">Usando <code>[@@iterator]()</code></h3>
+
+<pre class="brush:js">const mySet = new Set();
+mySet.add('0');
+mySet.add(1);
+mySet.add({});
+
+const setIter = mySet[Symbol.iterator]();
+
+console.log(setIter.next().value); // "0"
+console.log(setIter.next().value); // 1
+console.log(setIter.next().value); // Object
+</pre>
+
+<h3 id="Usando_iterator_con_for..of">Usando <code>[@@iterator]()</code> con <code>for..of</code></h3>
+
+<pre class="brush:js">const mySet = new Set();
+mySet.add('0');
+mySet.add(1);
+mySet.add({});
+
+for (const v of mySet) {
+  console.log(v);
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-set.prototype-@@iterator', 'Set.prototype[@@iterator]')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set.prototype-@@iterator', 'Set.prototype[@@iterator]')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página está generada a partir de datos estructurados. Si quieres contribuir con ello, por favor comprueba <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una pull request.</div>
+
+<p>{{Compat("javascript.builtins.Set.@@iterator")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Set.prototype.entries()")}}</li>
+ <li>{{jsxref("Set.prototype.keys()")}}</li>
+ <li>{{jsxref("Set.prototype.values()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/add/index.html b/files/es/web/javascript/reference/global_objects/set/add/index.html
new file mode 100644
index 0000000000..32e21d52c1
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/add/index.html
@@ -0,0 +1,125 @@
+---
+title: Set.prototype.add()
+slug: Web/JavaScript/Reference/Global_Objects/Set/add
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/add
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/add
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>add()</strong></code> añade un nuevo elemento con un valor específico al final del objeto <code>Set</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>mySet</em>.add(value);</code></pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+ <dt>value</dt>
+ <dd>Requerido. El valor del elemento a ser añadido al objeto <code>Set</code>.</dd>
+</dl>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>El objeto <code>Set</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_add">Usando el método add</h3>
+
+<pre class="brush: js">var mySet = new Set();
+
+mySet.add(1);
+mySet.add(5).add("some text"); // chainable
+
+console.log(mySet);
+// Set [1, 5, "some text"]
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-set.prototype.add', 'Set.prototype.add')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set.prototype.add', 'Set.prototype.add')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("13.0")}}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("13.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Firefox-specific_notes">Firefox-specific notes</h2>
+
+<ul>
+ <li>Prior to Firefox 33 {{geckoRelease("33")}}, <code>Set.prototype.add</code> returned <code>undefined</code> and was not chainable. This has been fixed ({{bug(1031632)}}). The behavior can be found in Chrome/v8 as well (<a href="https://code.google.com/p/v8/issues/detail?id=3410">issue</a>).</li>
+</ul>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("Set.prototype.delete()")}}</li>
+ <li>{{jsxref("Set.prototype.has()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/clear/index.html b/files/es/web/javascript/reference/global_objects/set/clear/index.html
new file mode 100644
index 0000000000..ff5bb74171
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/clear/index.html
@@ -0,0 +1,120 @@
+---
+title: Set.prototype.clear()
+slug: Web/JavaScript/Reference/Global_Objects/Set/clear
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Prototype
+  - set
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/clear
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/clear
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>clear()</strong></code> remueve todos los elementos de un objeto <code>Set</code>.</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<pre class="syntaxbox"><code><em>mySet</em>.clear();</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>{{jsxref("undefined")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_clear">Usando el método clear</h3>
+
+<pre class="brush: js">var mySet = new Set();
+mySet.add(1);
+mySet.add("foo");
+
+mySet.size;       // 2
+mySet.has("foo"); // true
+
+mySet.clear();
+
+mySet.size;       // 0
+mySet.has("bar")  // false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-set.prototype.clear', 'Set.prototype.clear')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set.prototype.clear', 'Set.prototype.clear')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("19.0")}}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>{{CompatGeckoMobile("19.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("Set.prototype.delete()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/delete/index.html b/files/es/web/javascript/reference/global_objects/set/delete/index.html
new file mode 100644
index 0000000000..efaeb4ee7b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/delete/index.html
@@ -0,0 +1,118 @@
+---
+title: Set.prototype.delete()
+slug: Web/JavaScript/Reference/Global_Objects/Set/delete
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/delete
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>delete()</strong></code> remueve el elemento especificado del objeto <code>Set</code>.</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<pre class="syntaxbox"><code><em>mySet</em>.delete(value);</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt>valor</dt>
+ <dd>Requerido. El valor del elemento a remover del objeto <code>Set</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p><code>true</code> si el elemento ha sido removido exitosamente en el <code>Set</code>; de otra manera retorna <code>false</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_delete">Usando el método <code>delete</code></h3>
+
+<pre class="brush: js">var mySet = new Set();
+mySet.add("foo");
+
+mySet.delete("bar"); // Retorna false. No hay elemento "bar" para ser removido.
+mySet.delete("foo"); // Retorna true.  Removido exitosamente.
+
+mySet.has("foo");    // Retorna false. El elemento "foo" ya no está presente.
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-set.prototype.delete', 'Set.prototype.delete')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set.prototype.delete', 'Set.prototype.delete')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("13.0")}}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("13.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("Set.prototype.clear()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/entries/index.html b/files/es/web/javascript/reference/global_objects/set/entries/index.html
new file mode 100644
index 0000000000..dc1dc5ff69
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/entries/index.html
@@ -0,0 +1,72 @@
+---
+title: Set.prototype.entries()
+slug: Web/JavaScript/Reference/Global_Objects/Set/entries
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/entries
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/entries
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>entries()</strong></code> devuelve un nuevo objeto de tipo <code>Iterator</code> que contiene<strong> un array de tuplas <code>[value, value]</code></strong> por cada elemento en el <code>Set</code> original, manteniendo el orden de inserción. En los objetos de tipo <code>Set</code> no existe una clave <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">key</span></font> como ocurre en los objetos de tipo <code>Map</code>. Sin embargo, para mantener una API similar a la de los objetos de tipo <code>Map</code>, cada <em>entry</em> contiene el mismo valor para su clave y valor, devolviendo por tanto un array de tuplas <code>[value, value]</code>.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/set-prototype-entries.html")}}</div>
+
+<p class="hidden">El código de este ejemplo interactivo esta almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interativos, simplemente clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>mySet</em>.entries()</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un nuevo objeto de tipo <code>Iterator</code> que contiene un array de tuplas <code>[value, value]</code> por cada elemento en el <code>Set</code> original, en orden de inserción.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_entries">Usando el método <code>entries</code></h3>
+
+<pre class="brush:js">var mySet = new Set();
+mySet.add('foobar');
+mySet.add(1);
+mySet.add('baz');
+
+var setIter = mySet.entries();
+
+console.log(setIter.next().value); // ["foobar", "foobar"]
+console.log(setIter.next().value); // [1, 1]
+console.log(setIter.next().value); // ["baz", "baz"]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Commentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-set.prototype.entries', 'Set.prototype.entries')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set.prototype.entries', 'Set.prototype.entries')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página ha sido generada a partir de datos estructurados. Si te apetece contribuir, comprueba <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una pull request.</div>
+
+<p>{{Compat("javascript.builtins.Set.entries")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Set.prototype.keys()")}}</li>
+ <li>{{jsxref("Set.prototype.values()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/has/index.html b/files/es/web/javascript/reference/global_objects/set/has/index.html
new file mode 100644
index 0000000000..8f1beef376
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/has/index.html
@@ -0,0 +1,125 @@
+---
+title: Set.prototype.has()
+slug: Web/JavaScript/Reference/Global_Objects/Set/has
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Prototype
+  - set
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/has
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/has
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>has()</strong></code> retorna un booleano indicando si el elemento especificado existe en el objeto <code>Set</code> o no.</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<pre class="syntaxbox"><code><em>mySet</em>.has(value);</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt>valor</dt>
+ <dd>Requerido. El valor del cual se probará su presencia en el objeto <code>Set</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<dl>
+ <dt>Booleano</dt>
+ <dd>Retorna <code>true</code> si el elemento con el valor especificado existe en el objeto  <code>Set</code>; de otra manera retorna <code>false</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_has">Usando el método <code>has</code></h3>
+
+<pre class="brush: js">var mySet = new Set();
+mySet.add("foo");
+
+mySet.has("foo");  // retorna true
+mySet.has("bar");  // retorna false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-set.prototype.has', 'Set.prototype.has')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set.prototype.has', 'Set.prototype.has')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("13.0")}}</td>
+   <td>11</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("13.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("Set.prototype.add()")}}</li>
+ <li>{{jsxref("Set.prototype.delete()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/index.html b/files/es/web/javascript/reference/global_objects/set/index.html
new file mode 100644
index 0000000000..11cdcf0e42
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/index.html
@@ -0,0 +1,231 @@
+---
+title: Set
+slug: Web/JavaScript/Reference/Global_Objects/Set
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Object
+  - set
+translation_of: Web/JavaScript/Reference/Global_Objects/Set
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>Set</code></strong> permite almacenar valores únicos de cualquier tipo, incluso {{Glossary("Primitive", "valores primitivos")}} u referencias a objetos.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">new Set([iterable]);</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>iterable</dt>
+ <dd>Si un <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">objeto iterable </a>es pasado, todos sus elementos serán añadidos al nuevo Set. Si no se especifica este parámetro, o si su valor es <code>null,</code> el nuevo <code>Set</code> estará vacío.</dd>
+</dl>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Una nueva instancia de <code>Set</code>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los objetos <code><strong>Set</strong></code> son colecciones de valores. Se puede iterar sus elementos en el orden de su inserción. Un valor en un <code>Set</code> <strong>sólo puede estar una vez</strong>; éste es único en la colección <code>Set</code>.</p>
+
+<h3 id="Igualdad_de_valores">Igualdad de valores</h3>
+
+<p>Ya que cada valor en el Set tiene que ser único, la igualdad del valor será comprobada y esta igualdad no se basa en el mismo algoritmo usado en el operador <code>===</code>. Específicamente, para Sets, <code>+0</code> (el cual es estrictamente igual a <code>-0</code>) y <code>-0</code> son valores distintos. Sin embargo, esto ha cambiado en la última especificación ECMAScript 6. Iniciando con Gecko 29.0 {{geckoRelease("29")}} ({{bug("952870")}}) y un <a href="https://code.google.com/p/v8/issues/detail?id=3069">recent nightly Chrome</a>, <code>+0</code> y <code>-0</code> son tratados como el mismo valor en objetos <code>Set</code>. </p>
+
+<p><code>NaN</code> y <code>undefined</code> también pueden ser almacenados en un Set. <code>NaN</code> es considerado igual que <code>NaN</code> (A pesar que <code>NaN !== NaN</code>).</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>Set.length</code></dt>
+ <dd>El valor de la propiedad <code>length</code> es 0.</dd>
+ <dt>{{jsxref("Set.@@species", "get Set[@@species]")}}</dt>
+ <dd>La función constructora que es usada para crear objetos derivados.</dd>
+ <dt>{{jsxref("Set.prototype")}}</dt>
+ <dd>Representa el prototipo para el constructor Set. Permite la adición de propiedades a todos los objetos Set.</dd>
+</dl>
+
+<h2 id="Instancias_Set">Instancias <code>Set</code></h2>
+
+<p>Todas las instancias de <code>Set</code> heredan de {{jsxref("Set.prototype")}}.</p>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Set/prototype','Properties')}}</p>
+
+<h3 id="Métodos">Métodos</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Set/prototype','Methods')}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_objeto_Set">Usando el objeto <code>Set</code></h3>
+
+<pre class="brush: js">const mySet = new Set();
+
+mySet.add(1);
+mySet.add(5);
+mySet.add('some text');
+
+const o = {a: 1, b: 2};
+mySet.add(o);
+
+<code>mySet.add({a: 1, b: 2}); // La variable "o" referencia a otro objeto, por lo que agrega otro valor.
+</code>
+mySet.has(1); // true
+mySet.has(3); // false, 3 no ha sido añadido al Set
+mySet.has(5);              // true
+mySet.has(Math.sqrt(25));  // true
+mySet.has('Some Text'.toLowerCase()); // true
+mySet.has(o); // true
+
+mySet.size; // 5
+
+mySet.delete(5); // Elimina 5 del Set
+mySet.has(5);    // false, 5 fue eliminado
+
+mySet.size; // 4, sólo removimos un valor
+<code>console.log(mySet);// Set {1, "some text", Object {a: 1, b: 2}, Object {a: 1, b: 2}}</code></pre>
+
+<h3 id="Iterando_los_Sets">Iterando los Sets</h3>
+
+<pre class="brush: js">// iterar todos los items de un set
+// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
+for (let item of mySet) console.log(item);
+
+// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
+for (let item of mySet.keys()) console.log(item);
+
+// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
+for (let item of mySet.values()) console.log(item);
+
+// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
+//(key y value poseen en mismo valor en este caso)
+for (let [key, value] of mySet.entries()) console.log(key);
+
+// crear un Array plano con los mismos valores, utilizando Array.from
+const myArr = Array.from(mySet); // [1, 'some text', {a: 1, b: 2}]
+
+// también se puede utilizar para guardar elementos del DOM
+mySet.add(document.body);
+mySet.has(document.querySelector('body')); // true
+
+// crear un Array plano con los mismos valores, utilizando propagación
+const mySet2 = new Set([1,2,3,4]);
+mySet2.size; // 4
+[...mySet2]; // [1,2,3,4]
+
+// la intersección entre dos sets puede ser simulada con
+const intersection = <code>new Set([...set1].filter(x =&gt; set2.has(x)));</code>
+
+<code>// la diferencia puede ser simulada con
+const difference = new Set([...set1].filter(x =&gt; !set2.has(x)));</code>
+
+// Iteración utilizando forEach
+mySet.forEach((value) =&gt; {
+  console.log(value);
+});
+
+// 1
+// 2
+// 3
+// 4</pre>
+
+<h3 id="Implementando_operaciones_básicas">Implementando operaciones básicas</h3>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>isSuperset <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>subset<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> subset<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span><span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+            <span class="keyword token">return</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
+        <span class="punctuation token">}</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">return</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>union <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">var</span> union <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        union<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">return</span> union<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>intersection <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">var</span> intersection <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+            intersection<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">;</span>
+        <span class="punctuation token">}</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">return</span> intersection<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>difference <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">var</span> difference <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        difference<span class="punctuation token">.</span><span class="keyword token">delete</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">return</span> difference<span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="comment token">//Examples</span>
+<span class="keyword token">var</span> setA <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">[</span><span class="number token">1</span><span class="punctuation token">,</span><span class="number token">2</span><span class="punctuation token">,</span><span class="number token">3</span><span class="punctuation token">,</span><span class="number token">4</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
+    setB <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">[</span><span class="number token">2</span><span class="punctuation token">,</span><span class="number token">3</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
+    setC <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">[</span><span class="number token">3</span><span class="punctuation token">,</span><span class="number token">4</span><span class="punctuation token">,</span><span class="number token">5</span><span class="punctuation token">,</span><span class="number token">6</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+setA<span class="punctuation token">.</span><span class="function token">isSuperset</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; true</span>
+setA<span class="punctuation token">.</span><span class="function token">union</span><span class="punctuation token">(</span>setC<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; Set [1, 2, 3, 4, 5, 6]</span>
+setA<span class="punctuation token">.</span><span class="function token">intersection</span><span class="punctuation token">(</span>setC<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; Set [3, 4]</span>
+setA<span class="punctuation token">.</span><span class="function token">difference</span><span class="punctuation token">(</span>setC<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; Set [1, 2]</span></code></pre>
+
+<h3 id="Relación_con_los_objetos_Array">Relación con los objetos <code>Array</code></h3>
+
+<pre class="brush: js">const myArray = ['value1', 'value2', 'value3'];
+
+// Utiliza el constructor para para crear un set con el mismo contenido que un array
+const mySet = new Set(myArray);
+
+mySet.has('value1'); // devuelve true
+
+// Utiliza la propagación para crear un array con los contenidos de un set
+console.log([...mySet]); // Muestra lo mismo utilizando myArray</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-set-objects', 'Set')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set-objects', 'Set')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada desde información estructurada. Si desea contribuir, por favor revise la información en <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envie un pull request/merge request.</div>
+
+<p>{{Compat("javascript.builtins.Set")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+ <li>{{jsxref("WeakMap")}}</li>
+ <li>{{jsxref("WeakSet")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/size/index.html b/files/es/web/javascript/reference/global_objects/set/size/index.html
new file mode 100644
index 0000000000..2a3fb4f5d1
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/size/index.html
@@ -0,0 +1,107 @@
+---
+title: Set.prototype.size
+slug: Web/JavaScript/Reference/Global_Objects/Set/size
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/size
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/size
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad de acceso <code><strong>size</strong></code> devuelve el número de elementos que hay en el objeto {{jsxref("Set")}}.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El valor de <code>size</code> es un entero que representa cuantas entradas tiene el objeto <code>Set</code>. La función de accesso set para <code>size</code> es <code>undefined</code>; no se puede cambiar esta propiedad.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_size">Usando <code>size</code></h3>
+
+<pre class="brush:js">var mySet = new Set();
+mySet.add(1);
+mySet.add(5);
+mySet.add("un texto")
+
+mySet.size; // 3
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-get-set.prototype.size', 'Set.prototype.size')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-get-set.prototype.size', 'Set.prototype.size')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>38</td>
+   <td>{{ CompatGeckoDesktop("19") }} [1]</td>
+   <td>{{ CompatIE("11") }}</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("19")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] From Gecko 13 (Firefox 13 / Thunderbird 13 / SeaMonkey 2.10) to Gecko 18 (Firefox 18 / Thunderbird 18 / SeaMonkey 2.15 / Firefox OS 1.0.1 / Firefox OS 1.1) la propiedad size fue implementado como un método <code>Set.prototype.size()</code>, esto fue cambiado a una propiedad en versiones posteriores conforme la especificación ECMAScript 6 (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=807001">bug 807001</a>).</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Set")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/set/values/index.html b/files/es/web/javascript/reference/global_objects/set/values/index.html
new file mode 100644
index 0000000000..c37d5ee4fd
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/set/values/index.html
@@ -0,0 +1,73 @@
+---
+title: Set.prototype.values()
+slug: Web/JavaScript/Reference/Global_Objects/Set/values
+translation_of: Web/JavaScript/Reference/Global_Objects/Set/values
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Set/values
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>values()</strong></code> retorna un objeto de tipo <code>Iterator</code> que contiene los valores para cada elemento en el objecto <code>Set</code> en orden de inserción.</p>
+
+<p>El metodo <strong><code>keys()</code></strong> es un alias para este metodo (por similaridad con objetos {{jsxref("Map")}}); se comporta exactamente igual y retorna <strong>valores</strong> para cada elemento de un <code>Set</code>.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/set-prototype-values.html")}}</div>
+
+
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code><em>mySet</em>.values();
+</code></pre>
+
+<h3 id="Return_value">Return value</h3>
+
+<p>Un nuevo objeto <code><strong>Iterator</strong></code> que contiene los valores para cada elemento en el <code>Set</code> dado,  en orden de inserción.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_values">Using <code>values()</code></h3>
+
+<pre class="brush:js">var mySet = new Set();
+mySet.add('foo');
+mySet.add('bar');
+mySet.add('baz');
+
+var setIter = mySet.values();
+
+console.log(setIter.next().value); // "foo"
+console.log(setIter.next().value); // "bar"
+console.log(setIter.next().value); // "baz"</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-set.prototype.values', 'Set.prototype.values')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-set.prototype.values', 'Set.prototype.values')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Set.values")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Set.prototype.entries()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/anchor/index.html b/files/es/web/javascript/reference/global_objects/string/anchor/index.html
new file mode 100644
index 0000000000..2a63c56bc6
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/anchor/index.html
@@ -0,0 +1,57 @@
+---
+title: String.prototype.anchor()
+slug: Web/JavaScript/Reference/Global_Objects/String/anchor
+tags:
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/anchor
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/anchor
+---
+<div>{{JSRef("Objetos_globales", "String")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <strong><code>anchor()</code></strong> crea un ancla HTML, {{HTMLElement("a")}}, que se usa como un enlace a hipertexto.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.anchor(<em>nombreAtributo</em>)</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>nombreAtributo</code></dt>
+ <dd>Una cadena.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Usa el método <code>anchor</code> con los métodos <code>document.write</code> o <code>document.writeln</code> para crear y mostrar programando un ancla en un documento. Crea el ancla con el método <code>anchor</code>, y entonces llama a <code>write</code> o <code>writeln</code> para mostrar el ancla en el documento. En JavaScript en el lado Servidor, usa la función <code>write</code> para mostrar el ancla.</p>
+
+<p>En la sintaxis, la cadena de texto representa el texto literal que usted quiere que el usuario vea. La cadena <code>nombreAtributo</code> representa el atributo <code>NAME</code> de la etiqueta A.</p>
+
+<p>Los anclas creados con el método <code>anchor</code> serán elementos del arreglo {{domxref("document.anchors")}}</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_anchor" name="Ejemplo:_Usando_anchor">Ejemplo: Usando <code>anchor</code></h3>
+
+<p>El siguiente código de ejemplo dentro de un elemento HTML <code>script</code>:</p>
+
+<pre class="brush: js">var miCadena = "Tabla de Contenidos";
+document.body.innerHTML = miCadena.anchor("ancla_contenidos");
+</pre>
+
+<p>obtendrá el siguiente HTML:</p>
+
+<pre class="brush: html">&lt;a name="ancla_contenidos"&gt;Tabla de Contenidos&lt;/A&gt;
+</pre>
+
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+
+<ul>
+ <li>{{jsxref("String.prototype.link()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/big/index.html b/files/es/web/javascript/reference/global_objects/string/big/index.html
new file mode 100644
index 0000000000..ad13429a09
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/big/index.html
@@ -0,0 +1,55 @@
+---
+title: String.prototype.big()
+slug: Web/JavaScript/Reference/Global_Objects/String/big
+tags:
+  - Deprecated
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/big
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/big
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<p>{{deprecated_header}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Provoca que una cadena sea mostrada con un tamaño de fuente grade, como si estuviese en una etiqueta {{HTMLElement("big")}}.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.big()</pre>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Usa el método <code>big</code> para formatear y mostrar una cadena en un documento.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_big" name="Ejemplo:_Usando_big">Ejemplo: Usando <code>big</code></h3>
+
+<p>El siguiente ejemplo usa los métodos de <code>string</code> para cambiar el tamañó de una cadena:</p>
+
+<pre>var cadenaMundo="¡Hola Mundo!";
+
+console.log(cadenaMundo.small());
+console.log("&lt;P&gt;" + cadenaMundo.big());
+console.log("&lt;P&gt;" + cadenaMundo.fontsize(7));
+</pre>
+
+<p>Este ejemplo produce el mismo resultado que el siguiente HTML:</p>
+
+<pre>&lt;small&gt;¡Hola Mundo!&lt;/small&gt;
+&lt;p&gt;&lt;big&gt;¡Hola Mundo!&lt;/big&gt;
+&lt;p&gt;&lt;fontsize=7&gt;¡Hola Mundo!&lt;/fontsize&gt;
+</pre>
+
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+
+<ul>
+ <li>{{jsxref("String.prototype.fontsize()")}}</li>
+ <li>{{jsxref("String.prototype.small()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/blink/index.html b/files/es/web/javascript/reference/global_objects/string/blink/index.html
new file mode 100644
index 0000000000..390b415777
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/blink/index.html
@@ -0,0 +1,43 @@
+---
+title: String.prototype.blink()
+slug: Web/JavaScript/Reference/Global_Objects/String/blink
+tags:
+  - Deprecated
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/blink
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/blink
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<p>{{deprecated_header}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Causa que una cadena parpadee como si estuviese en una etiqueta {{HTMLElement("blink")}}.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox"><em>cadena</em>.blink()</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Usa el método <code>blink</code> para formatear y mostrar una cadena en un documento.</p>
+<h2 id="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el formateado de una cadena</h3>
+<p>El siguiente ejemplo usa métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
+<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
+
+console.log(cadenaMundo.blink())
+console.log(cadenaMundo.bold())
+console.log(cadenaMundo.italics())
+console.log(cadenaMundo.strike())
+</pre>
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+<pre class="brush: html">&lt;blink&gt;¡Hola mundo!&lt;/blink&gt;
+&lt;b&gt;¡Hola mundo!&lt;/b&gt;
+&lt;i&gt;¡Hola mundo!&lt;/b&gt;
+&lt;strike&gt;¡Hola mundo!&lt;/strike&gt;
+</pre>
+<h2 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h2>
+<ul>
+ <li>{{jsxref("String.prototype.bold()")}}</li>
+ <li>{{jsxref("String.prototype.italics()")}}</li>
+ <li>{{jsxref("String.prototype.strike()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/bold/index.html b/files/es/web/javascript/reference/global_objects/string/bold/index.html
new file mode 100644
index 0000000000..130e23b001
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/bold/index.html
@@ -0,0 +1,44 @@
+---
+title: String.prototype.bold()
+slug: Web/JavaScript/Reference/Global_Objects/String/bold
+tags:
+  - Deprecated
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/bold
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/bold
+---
+<p>{{JSRef("Objetos_globales", "String")}}<br>
+ <br>
+ {{Deprecated_header}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Provoca que una cadena se muestre en negrita como si estuviera en una etiqueta {{HTMLElement("b")}}.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox"><em>cadena</em>.bold()</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Usa el método <code>bold</code> para formatear y mostrar una cadena en un documento.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el formateado de una cadena</h3>
+<p>El siguiente ejemplo usa métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
+<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
+
+console.log(cadenaMundo.blink())
+console.log(cadenaMundo.bold())
+console.log(cadenaMundo.italics())
+console.log(cadenaMundo.strike())
+</pre>
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+<pre class="brush: html">&lt;blink&gt;¡Hola mundo!&lt;/blink&gt;
+&lt;b&gt;¡Hola mundo!&lt;/b&gt;
+&lt;i&gt;¡Hola mundo!&lt;/i&gt;
+&lt;strike&gt;¡Hola mundo!&lt;/strike&gt;
+</pre>
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+<ul>
+ <li>{{jsxref("String.prototype.blink()")}}</li>
+ <li>{{jsxref("String.prototype.italics()")}}</li>
+ <li>{{jsxref("String.prototype.strike()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/charat/index.html b/files/es/web/javascript/reference/global_objects/string/charat/index.html
new file mode 100644
index 0000000000..3194b6bca4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/charat/index.html
@@ -0,0 +1,144 @@
+---
+title: String.prototype.charAt()
+slug: Web/JavaScript/Reference/Global_Objects/String/charAt
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/charAt
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/charAt
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <strong><code>charAt() </code></strong><code>de</code><strong><code> </code></strong>{{jsxref("String")}} devuelve en un nuevo String el carácter UTF-16 de una cadena.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>str</em>.charAt(<em>indice</em>)</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>indice</code></dt>
+ <dd>Un entero entre 0 y 1 menos que la longitud de la cadena. Si no se proporciona ningún indice charAt() utilizará 0.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Los caracteres de una cadena se indexan de izquierda a derecha. El índice del primer caracter es 0, y el índice del último caracter en una cadena llamada <code>nombreCadena</code> es <code>nombreCadena.length - 1</code>. Si el <code>indice</code> que usted proporciona está fuera del rango, JavaScript devuelve una cadena vacía.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Mostrando_caracteres_de_diferentes_localizaciones_en_una_cadena" name="Ejemplo:_Mostrando_caracteres_de_diferentes_localizaciones_en_una_cadena">Ejemplo: Mostrando caracteres de diferentes localizaciones en una cadena</h3>
+
+<p>El siguiente ejemplo muestra caracteres de diferentes localizaciones en la cadena "<code>Brave new world</code>":</p>
+
+<pre class="brush: js">var cualquierCadena="Brave new world";
+
+console.log("El carácter en el índice 0 es '" + cualquierCadena.charAt(0) + "'")
+console.log("El carácter en el índice 1 es '" + cualquierCadena.charAt(1) + "'")
+console.log("El carácter en el índice 2 es '" + cualquierCadena.charAt(2) + "'")
+console.log("El carácter en el índice 3 es '" + cualquierCadena.charAt(3) + "'")
+console.log("El carácter en el índice 4 es '" + cualquierCadena.charAt(4) + "'")
+console.log("El carácter en el índice 999 es '" + cualquierCadena.charAt(999) + "'")
+</pre>
+
+<p>Estas líneas muestran lo siguiente:</p>
+
+<pre>El carácter en el índice 0 es 'B'
+El carácter en el índice 1 es 'r'
+El carácter en el índice 2 es 'a'
+El carácter en el índice 3 es 'v'
+El carácter en el índice 4 es 'e'
+El carácter en el índice 999 es ''
+</pre>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Estándar</td>
+   <td>Primera definición</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.4', 'String.prototype.charAt')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.charat', 'String.prototype.charAt')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.indexOf()")}}, {{jsxref("String.prototype.lastIndexOf()")}}</li>
+ <li>{{jsxref("String.prototype.split()")}}</li>
+ <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
+ <li>{{jsxref("String.fromCodePoint()")}}</li>
+ <li>{{jsxref("String.prototype.codePointAt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/charcodeat/index.html b/files/es/web/javascript/reference/global_objects/string/charcodeat/index.html
new file mode 100644
index 0000000000..c7f449bc08
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/charcodeat/index.html
@@ -0,0 +1,66 @@
+---
+title: String.prototype.charCodeAt()
+slug: Web/JavaScript/Reference/Global_Objects/String/charCodeAt
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+  - Unicode
+translation_of: Web/JavaScript/Reference/Global_Objects/String/charCodeAt
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/charCodeAt
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El <code><strong>charCodeAt()</strong></code> método devuelve un número indicando el valor Unicode del carácter en el índice proporcionado.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.charCodeAt(<em>indice</em>);
+</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>indice</code></dt>
+ <dd>Un entero entre 0 y 1 menos que la longitud de la cadena; si no se especifica, su valor predeterminado es 0.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>El rango del código Unicode va del 0 al 1,114,111<span class="comment">0x10FFFF</span>. Los primeros 128 códigos de Unicode encajan directamente con los códigos de caractéres de la codificación ASCII. Para información sobre Unicode, vea la <a href="/es/docs/Web/JavaScript/Guide/Valores,_variables_y_literales#Unicode">Guía de JavaScript</a>. Observe que <code>charCodeAt</code> siempre devolverá un valor menor de 65.536.</p>
+
+<p><code>charCodeAt</code> devuelve {{jsxref("NaN")}} si el indice proporcionado no está entre 0 y 1 menos de la longitud de la cadena.</p>
+
+<p>En JavaScript 1.2 el método <code>charCodeAt</code> devuelve un número indicando el valor de la hoja de códigos ISO-Latin-1 del carácter correspondiente al índice proporcionado. El rango de la hoja de códigos ISO-Latin-1 va del 0 al 255. Del 0 al 127 encajan directamente con la hoja de códigos ASCII.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_charCodeAt" name="Ejemplo:_Usando_charCodeAt">Ejemplo: Usando <code>charCodeAt</code></h3>
+
+<p>El siguiente ejemplo devuelve 65, el valor Unicode para A. </p>
+
+<pre class="eval">"ABC".charCodeAt(0) // returns 65
+</pre>
+
+<p>El siguiente ejemplo devuelve 83.</p>
+
+<pre>"AaSdas".charCodeAt(2) // returns 83
+</pre>
+
+<p>teniendo en cuenta que 2 es la posicion de la letra. Si `S` fuera minuscula, el Unicode es diferente</p>
+
+<pre>"Aasdas".charCodeAt(2) // returns 115</pre>
+
+<p> </p>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.fromCharCode()")}}</li>
+ <li>{{jsxref("String.prototype.charAt()")}}</li>
+ <li>{{jsxref("String.fromCodePoint()")}}</li>
+ <li>{{jsxref("String.prototype.codePointAt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/codepointat/index.html b/files/es/web/javascript/reference/global_objects/string/codepointat/index.html
new file mode 100644
index 0000000000..fabd85a657
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/codepointat/index.html
@@ -0,0 +1,128 @@
+---
+title: String.prototype.codePointAt()
+slug: Web/JavaScript/Reference/Global_Objects/String/codePointAt
+translation_of: Web/JavaScript/Reference/Global_Objects/String/codePointAt
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/codePointAt
+---
+<div>{{JSRef}}</div>
+
+<div> </div>
+
+<div>El método <strong><code>codePointAt() </code></strong><code>d</code>evuelve un entero no negativo que equivale al valor Unicode code point del carácter.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>str</var>.codePointAt(<var>indice</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>indice</code></dt>
+ <dd>Índice del carácter en la cadena del que se quiere obtener el valor del Unicode code point.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un número que equivale al valor code point del carácter especificado en el índice de la cadena; devuelve {{jsxref("undefined")}} si no se encuentra carácter en la posición especifica.</p>
+
+<h2 id="Description">Description</h2>
+
+<p>If there is no element at the specified position, {{jsxref("undefined")}} is returned. If no UTF-16 surrogate pair begins at <code>pos</code>, the code unit at <code>pos</code> is returned.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_codePointAt()">Using <code>codePointAt()</code></h3>
+
+<pre class="brush: js">'ABC'.codePointAt(1);          // 66
+'\uD800\uDC00'.codePointAt(0); // 65536
+
+'XYZ'.codePointAt(42); // undefined
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>The following extends Strings to include the <code>codePointAt()</code> function as specified in ECMAScript 2015 for browsers not supporting it natively.</p>
+
+<pre class="brush: js">/*! http://mths.be/codepointat v0.1.0 by @mathias */
+if (!String.prototype.codePointAt) {
+  (function() {
+    'use strict'; // needed to support `apply`/`call` with `undefined`/`null`
+    var codePointAt = function(position) {
+      if (this == null) {
+        throw TypeError();
+      }
+      var string = String(this);
+      var size = string.length;
+      // `ToInteger`
+      var index = position ? Number(position) : 0;
+      if (index != index) { // better `isNaN`
+        index = 0;
+      }
+      // Account for out-of-bounds indices:
+      if (index &lt; 0 || index &gt;= size) {
+        return undefined;
+      }
+      // Get the first code unit
+      var first = string.charCodeAt(index);
+      var second;
+      if ( // check if it’s the start of a surrogate pair
+        first &gt;= 0xD800 &amp;&amp; first &lt;= 0xDBFF &amp;&amp; // high surrogate
+        size &gt; index + 1 // there is a next code unit
+      ) {
+        second = string.charCodeAt(index + 1);
+        if (second &gt;= 0xDC00 &amp;&amp; second &lt;= 0xDFFF) { // low surrogate
+          // http://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae
+          return (first - 0xD800) * 0x400 + second - 0xDC00 + 0x10000;
+        }
+      }
+      return first;
+    };
+    if (Object.defineProperty) {
+      Object.defineProperty(String.prototype, 'codePointAt', {
+        'value': codePointAt,
+        'configurable': true,
+        'writable': true
+      });
+    } else {
+      String.prototype.codePointAt = codePointAt;
+    }
+  }());
+}
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-string.prototype.codepointat', 'String.prototype.codePointAt')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.codepointat', 'String.prototype.codePointAt')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.codePointAt")}}</p>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("String.fromCodePoint()")}}</li>
+ <li>{{jsxref("String.fromCharCode()")}}</li>
+ <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
+ <li>{{jsxref("String.prototype.charAt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/concat/index.html b/files/es/web/javascript/reference/global_objects/string/concat/index.html
new file mode 100644
index 0000000000..461ac1de8b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/concat/index.html
@@ -0,0 +1,91 @@
+---
+title: String.prototype.concat()
+slug: Web/JavaScript/Reference/Global_Objects/String/concat
+tags:
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - String
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/concat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/concat
+---
+<div>{{JSRef}}</div>
+
+<p><span class="seoSummary">El método <strong><code>concat()</code></strong> combina dos o más cadenas de texto y devuelve una cadena de texto nueva.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-concat.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>str</var>.concat(<var>str2</var> [, ...<var>strN</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>str2</var> [, ...<var>strN</var>]</code></dt>
+ <dd>Cadenas que se concatenarán con <code><var>str</var></code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una nueva cadena que contiene el texto combinado de las cadenas proporcionadas.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La función <code>concat()</code> concatena los argumentos de tipo texto con la cadena de sobre la que se llama a la función y devuelve una nueva cadena de texto. Los cambios en la cadena original o la cadena devuelta no afectan al otro.</p>
+
+<p>Si los argumentos no son de tipo texto, son convertidos a texto antes de concatenarlos</p>
+
+<h2 id="Rendimiento">Rendimiento</h2>
+
+<p>Es altamente recomendado que se utilicen {{jsxref("Operators/Assignment_Operators", "operadores de asignación", "", 1)}} (<code>+</code>, <code>+=</code>) en lugar del método <code>concat()</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_concat">Usando concat()</h3>
+
+<p>El siguiente ejemplo combina cadenas de texto en una nueva.</p>
+
+<pre class="brush: js notranslate">let hello = 'Hello, '
+console.log(hello.concat('Kevin', '. Have a nice day.'))
+// Hello, Kevin. Have a nice day.
+
+let greetList = ['Hello', ' ', 'Venkat', '!']
+"".concat(...greetList)  // "Hello Venkat!"
+
+"".concat({})    // [object Object]
+"".concat([])    // ""
+"".concat(null)  // "null"
+"".concat(true)  // "true"
+"".concat(4, 5)  // "45"
+
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.concat', 'String.prototype.concat')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.String.concat")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.concat()")}}</li>
+ <li>{{jsxref("Operators/Assignment_Operators", "Operadores de asignación", "", 1)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/endswith/index.html b/files/es/web/javascript/reference/global_objects/string/endswith/index.html
new file mode 100644
index 0000000000..7284e9fa63
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/endswith/index.html
@@ -0,0 +1,89 @@
+---
+title: String.prototype.endsWith()
+slug: Web/JavaScript/Reference/Global_Objects/String/endsWith
+tags:
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - String
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/endsWith
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/endsWith
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>endsWith()</code></strong> determina si una cadena de texto termina con los caracteres de una cadena indicada, devolviendo <code>true</code> o <code>false</code> según corresponda.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-endswith.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>str</var>.endsWith(<var>searchString</var>[, <var>position</var>])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>searchString</var></code></dt>
+ <dd>Los caracteres a buscar hasta el final de la cadena <em><code>str</code></em>.</dd>
+ <dt><code><var>length</var></code> {{optional_inline}}</dt>
+ <dd>Si se indica, se utiliza como el tamaño de <em><code>str</code></em>. Por defecto se usa <code><em>str</em>.length</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p><strong><code>true</code></strong> si los caracteres proporcionados se encuentran al final de la cadena de texto; en caso contrario, <strong><code>false</code></strong>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Este método determina si una cadena de texto termina en otra cadena o no. Este método distingue entre mayúsculas y minúsculas.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este método ha sido añadido a la especificación ECMAScript 6 y puede no estar disponible en todas las implementaciones de JavaScript. Sin embargo, puedes implementar el polyfill <code>String.prototype.endsWith()</code> con el siguiente fragmento de código:</p>
+
+<pre class="brush: js notranslate">if (!String.prototype.endsWith) {
+	String.prototype.endsWith = function(search, this_len) {
+		if (this_len === undefined || this_len &gt; this.length) {
+			this_len = this.length;
+		}
+		return this.substring(this_len - search.length, this_len) === search;
+	};
+}
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_endsWith">Usando <code>endsWith()</code></h3>
+
+<pre class="brush: js notranslate">let str = 'To be, or not to be, that is the question.'
+
+console.log(str.endsWith('question.'))  // true
+console.log(str.endsWith('to be'))      // false
+console.log(str.endsWith('to be', 19))  // true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.endswith', 'String.prototype.endsWith')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{Compat("javascript.builtins.String.endsWith")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.startsWith()")}}</li>
+ <li>{{jsxref("String.prototype.includes()")}}</li>
+ <li>{{jsxref("String.prototype.indexOf()")}}</li>
+ <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/fixed/index.html b/files/es/web/javascript/reference/global_objects/string/fixed/index.html
new file mode 100644
index 0000000000..dc9638944b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/fixed/index.html
@@ -0,0 +1,36 @@
+---
+title: String.prototype.fixed()
+slug: Web/JavaScript/Reference/Global_Objects/String/fixed
+tags:
+  - Deprecated
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/fixed
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/fixed
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<p>{{deprecated_header}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Causa que una cadena se muestre con una fuente de ancho fijo, como si estuviesde dentro de una <span class="external">etiqueta {{HTMLElement("tt")}}</span>.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox"><em>cadena</em>.fixed()</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Usa el método <code>fixed</code> para formatear y mostrar unacadena en un documento.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_fixed_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_fixed_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando <code>fixed</code> para cambiar el formateado de una cadena</h3>
+<p>El siguiente ejemplo usa el método <code>fixed</code> para cambiar el formateado de una cadena:</p>
+<pre class="brush: js">var cadenaMundo="¡Hola Mundo!"
+console.log(cadenaMundo.fixed())
+</pre>
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+<pre class="brush: html">&lt;tt&gt;¡Hola Mundo!&lt;/tt&gt;
+</pre>
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+<ul>
+ <li>{{jsxref("String.prototype.bold()")}}</li>
+ <li>{{jsxref("String.prototype.italics()")}}</li>
+ <li>{{jsxref("String.prototype.strike()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/fontcolor/index.html b/files/es/web/javascript/reference/global_objects/string/fontcolor/index.html
new file mode 100644
index 0000000000..934a1fd69c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/fontcolor/index.html
@@ -0,0 +1,123 @@
+---
+title: String.prototype.fontcolor()
+slug: Web/JavaScript/Reference/Global_Objects/String/fontcolor
+translation_of: Web/JavaScript/Reference/Global_Objects/String/fontcolor
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/fontcolor
+---
+<div>{{JSRef}} {{deprecated_header}}</div>
+
+<p><code>El método </code><strong><code>fontcolor()</code></strong> crea {{HTMLElement("font")}} elemento HTML que cambia el color de la cadena.</p>
+
+<div class="note">
+<p><strong>Usage note:</strong> La etiqueta &lt;font&gt; fue eliminada en <a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> y no debe ser usada. En lugar de es, es necesario aplicar propiedades <a href="/en-US/docs/Web/CSS">CSS</a>.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>str</var>.fontcolor(<var>color</var>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>color</code></dt>
+ <dd>A string expressing the color as a hexadecimal RGB triplet or as a string literal. String literals for color names are listed in the <a href="/en-US/docs/Web/CSS/color_value">CSS color reference</a>.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si expresas el color como hexadecimal, usa el formato rrggbb. Por ejemplo, el color hexadecimal para salmón es R=FA, G=80, B=72, así que el valor será <code>"FA8072"</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usos_fontcolor()"><code>Usos fontcolor()</code></h3>
+
+<p>Los siguientes ejemplos usan el método <code>fontcolor()</code> para cambiar el color de una cadena.</p>
+
+<pre class="brush: js">var worldString = 'Hello, world';
+
+console.log(worldString.fontcolor('red') +  ' en rojo');
+// '&lt;font color="red"&gt;Hello, world&lt;/font&gt; en rojo'
+
+console.log(worldString.fontcolor('FF00') + ' es rojo en hexadecimal');
+// '&lt;font color="FF00"&gt;Hello, world&lt;/font&gt; es rojo en hexadecimal'
+</pre>
+
+<p>Con el objeto {{domxref("HTMLElement.style", "element.style")}} obtienes el atributo <code>style</code> y manipularlo:</p>
+
+<pre class="brush: js">document.getElementById('yourElemId').style.color = 'red';
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.fontcolor', 'String.prototype.fontcolor')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Basico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.fontsize()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/fontsize/index.html b/files/es/web/javascript/reference/global_objects/string/fontsize/index.html
new file mode 100644
index 0000000000..d00b7636e4
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/fontsize/index.html
@@ -0,0 +1,124 @@
+---
+title: String.prototype.fontsize()
+slug: Web/JavaScript/Reference/Global_Objects/String/fontsize
+translation_of: Web/JavaScript/Reference/Global_Objects/String/fontsize
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/fontsize
+---
+<div>{{JSRef}} {{deprecated_header}}</div>
+
+<p><code>El método </code><strong><code>fontsize()</code></strong> crea {{HTMLElement("font")}} elemento HTML que muestra una cadena con el tamaño especificado.</p>
+
+<div class="note">
+<p><strong>Usage note:</strong> El elemento &lt;font&gt; ha sido eliminado <a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> y no se debe usar. Los desarrolladores web deben usar propiedades <a href="/en-US/docs/Web/CSS">CSS</a>.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>str</var>.fontsize(<var>size</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>size</code></dt>
+ <dd>Un entero entre 1 y 7.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Cuando especificas el tamaño como entero, estableces el tamaño de la fuente. Cuando especificas el tamaño como cadena tal como "-2", se ajusta el tamaño de la fuente al de la etiqueta {{HTMLElement("basefont")}}.</p>
+
+<p>When you specify size as an integer, you set the font size of <code>str</code> to one of the 7 defined sizes. When you specify <code>size</code> as a string such as "-2", you adjust the font size of <code>str</code> relative to the size set in the {{HTMLElement("basefont")}} tag.</p>
+
+<h2 id="Ejemlpos">Ejemlpos</h2>
+
+<h3 id="Usos_fontsize()"><code>Usos fontsize()</code></h3>
+
+<p>The following example uses string methods to change the size of a string:</p>
+
+<pre class="brush: js">var worldString = 'Hello, world';
+
+console.log(worldString.small());     // &lt;small&gt;Hello, world&lt;/small&gt;
+console.log(worldString.big());       // &lt;big&gt;Hello, world&lt;/big&gt;
+console.log(worldString.fontsize(7)); // &lt;font size="7"&gt;Hello, world&lt;/fontsize&gt;
+</pre>
+
+<p>With the {{domxref("HTMLElement.style", "element.style")}} object you can get the element's <code>style</code> attribute and manipulate it more generically, for example:</p>
+
+<pre class="brush: js">document.getElementById('yourElemId').style.fontSize = '0.7em';
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.fontsize', 'String.prototype.fontsize')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.big()")}}</li>
+ <li>{{jsxref("String.prototype.small()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/fromcharcode/index.html b/files/es/web/javascript/reference/global_objects/string/fromcharcode/index.html
new file mode 100644
index 0000000000..5eb6071c52
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/fromcharcode/index.html
@@ -0,0 +1,131 @@
+---
+title: String.fromCharCode()
+slug: Web/JavaScript/Reference/Global_Objects/String/fromCharCode
+tags:
+  - JavaScript
+  - Method
+  - String
+  - Unicode
+translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCharCode
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/fromCharCode
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El <strong><code>String.fromCharCode()</code></strong> método estático que devuelve una cadena creada mediante el uso de una secuencia de valores Unicode especificada.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">String.fromCharCode(<em>num1</em>,<em> ...</em>,<em> numN</em>) </pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>num1, ..., num<em>N</em> </code></dt>
+ <dd>Secuencia de números con los valores Unicode.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Este método devuelve una cadena y no un objeto <code>String</code>.</p>
+
+<p>Debido a que <code>fromCharCode</code> es un método estático de <code>String</code>, usted siempre lo usará como <code>String.fromCharCode()</code>, en vez de un método de un objeto <code>String</code> creado por usted.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_fromCharCode" name="Ejemplo:_Usando_fromCharCode">Ejemplo: Usando <code>fromCharCode</code></h3>
+
+<p>El siguiene ejemplo devuelve la cadena "ABC".</p>
+
+<pre class="brush: js">String.fromCharCode(65,66,67)
+</pre>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Estándar</td>
+   <td>Primera definicíon<br>
+    Implementada en JavaScript 1.2</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.3.2', 'StringfromCharCode')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.fromcharcodes', 'String.fromCharCode')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
+ <li>{{jsxref("String.prototype.charAt()")}}</li>
+ <li>{{jsxref("String.fromCodePoint()")}}</li>
+ <li>{{jsxref("String.prototype.codePointAt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/fromcodepoint/index.html b/files/es/web/javascript/reference/global_objects/string/fromcodepoint/index.html
new file mode 100644
index 0000000000..9acb7d455a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/fromcodepoint/index.html
@@ -0,0 +1,205 @@
+---
+title: String.fromCodePoint()
+slug: Web/JavaScript/Reference/Global_Objects/String/fromCodePoint
+translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCodePoint
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/fromCodePoint
+---
+<div>{{JSRef("Global_Objects", "String")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método estatico <strong><code>String.fromCodePoint()</code></strong> devuelve una cadena creada por una secuencia de puntos de codigo.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>String.fromCodePoint(<var>num1</var>[, ...[, <var>numN</var>]])</code></pre>
+
+<h3 id="Parameters" name="Parameters">Parametros</h3>
+
+<dl>
+ <dt><code>num1, ..., num<em>N</em></code></dt>
+ <dd>Una secuencia de puntos de código.</dd>
+</dl>
+
+<h3 id="Throws">Throws</h3>
+
+<dl>
+ <dt>{{jsxref("Global_Objects/RangeError", "RangeError")}}</dt>
+ <dd>A {{jsxref("Global_Objects/RangeError", "RangeError")}} is thrown if an invalid Unicode code point is given (e.g. "RangeError: NaN is not a valid code point").</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Because <code>fromCodePoint()</code> is a static method of {{jsxref("Global_Objects/String", "String")}}, you always use it as <code>String.fromCodePoint()</code>, rather than as a method of a {{jsxref("Global_Objects/String", "String")}} object you created.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_fromCharCode" name="Example:_Using_fromCharCode">Ejemplos: Usando <code>fromCodePoint()</code></h3>
+
+<pre class="brush: js">String.fromCodePoint(42);       // "*"
+String.fromCodePoint(65, 90);   // "AZ"
+String.fromCodePoint(0x404);    // "\u0404"
+String.fromCodePoint(0x2F804);  // "\uD87E\uDC04"
+String.fromCodePoint(194564);   // "\uD87E\uDC04"
+String.fromCodePoint(0x1D306, 0x61, 0x1D307) // "\uD834\uDF06a\uD834\uDF07"
+
+String.fromCodePoint('_');      // RangeError
+String.fromCodePoint(Infinity); // RangeError
+String.fromCodePoint(-1);       // RangeError
+String.fromCodePoint(3.14);     // RangeError
+String.fromCodePoint(3e-2);     // RangeError
+String.fromCodePoint(NaN);      // RangeError
+</pre>
+
+<pre class="brush: js">// String.fromCharCode() alone cannot get the character at such a high code point
+// The following, on the other hand, can return a 4-byte character as well as the
+// usual 2-byte ones (i.e., it can return a single character which actually has
+// a string length of 2 instead of 1!)
+console.log(String.fromCodePoint(0x2F804)); // or 194564 in decimal
+</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<p>The <code>String.fromCodePoint</code> method has been added to the ECMAScript standard in version 6 and may not be supported in all web browsers or environments yet. Use the code below for a polyfill:</p>
+
+<pre class="brush: js">/*! http://mths.be/fromcodepoint v0.1.0 by @mathias */
+if (!String.fromCodePoint) {
+  (function() {
+    var defineProperty = (function() {
+      // IE 8 only supports `Object.defineProperty` on DOM elements
+      try {
+        var object = {};
+        var $defineProperty = Object.defineProperty;
+        var result = $defineProperty(object, object, object) &amp;&amp; $defineProperty;
+      } catch(error) {}
+      return result;
+    }());
+    var stringFromCharCode = String.fromCharCode;
+    var floor = Math.floor;
+    var fromCodePoint = function() {
+      var MAX_SIZE = 0x4000;
+      var codeUnits = [];
+      var highSurrogate;
+      var lowSurrogate;
+      var index = -1;
+      var length = arguments.length;
+      if (!length) {
+        return '';
+      }
+      var result = '';
+      while (++index &lt; length) {
+        var codePoint = Number(arguments[index]);
+        if (
+          !isFinite(codePoint) ||       // `NaN`, `+Infinity`, or `-Infinity`
+          codePoint &lt; 0 ||              // not a valid Unicode code point
+          codePoint &gt; 0x10FFFF ||       // not a valid Unicode code point
+          floor(codePoint) != codePoint // not an integer
+        ) {
+          throw RangeError('Invalid code point: ' + codePoint);
+        }
+        if (codePoint &lt;= 0xFFFF) { // BMP code point
+          codeUnits.push(codePoint);
+        } else { // Astral code point; split in surrogate halves
+          // http://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae
+          codePoint -= 0x10000;
+          highSurrogate = (codePoint &gt;&gt; 10) + 0xD800;
+          lowSurrogate = (codePoint % 0x400) + 0xDC00;
+          codeUnits.push(highSurrogate, lowSurrogate);
+        }
+        if (index + 1 == length || codeUnits.length &gt; MAX_SIZE) {
+          result += stringFromCharCode.apply(null, codeUnits);
+          codeUnits.length = 0;
+        }
+      }
+      return result;
+    };
+    if (defineProperty) {
+      defineProperty(String, 'fromCodePoint', {
+        'value': fromCodePoint,
+        'configurable': true,
+        'writable': true
+      });
+    } else {
+      String.fromCodePoint = fromCodePoint;
+    }
+  }());
+}
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.fromcodepoint', 'String.fromCodePoint')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>41</td>
+   <td>{{CompatGeckoDesktop("29")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("29")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("String.fromCharCode()")}}</li>
+ <li>{{jsxref("String.prototype.charAt()")}}</li>
+ <li>{{jsxref("String.prototype.codePointAt()")}}</li>
+ <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/includes/index.html b/files/es/web/javascript/reference/global_objects/string/includes/index.html
new file mode 100644
index 0000000000..d2bead7086
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/includes/index.html
@@ -0,0 +1,109 @@
+---
+title: String.prototype.includes()
+slug: Web/JavaScript/Reference/Global_Objects/String/includes
+tags:
+  - Cadena de texto
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - String
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/includes
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/includes
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>includes()</code></strong> determina si una cadena de texto puede ser encontrada dentro de otra cadena de texto, devolviendo <code><strong>true</strong></code> o <strong><code>false</code></strong> según corresponda.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-includes.html", "shorter")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>str</var>.includes(<var>searchString</var>[, <var>position</var>])</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code><var>searchString</var></code></dt>
+ <dd>Una cadena a buscar en el texto <em><code>str</code></em>.</dd>
+ <dt><code><var>position</var></code> {{optional_inline}}</dt>
+ <dd>La posición dentro de la cadena en la cual empieza la búsqueda de <code>searchString</code> (Por defecto este valor es 0).</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p><strong><code>true</code></strong> si la cadena de texto contiene la cadena buscada; en caso contrario, <strong><code>false</code></strong>.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Este método permite determinar si una cadena de texto se encuentra incluida dentro de la otra.</p>
+
+<h3 id="Sensibilidad_a_MayúsculasMinúsculas">Sensibilidad a Mayúsculas/Minúsculas</h3>
+
+<p>El método <code>includes()</code> es "case sensitive" (tiene en cuenta mayúsculas y minúsculas). Por ejemplo, la siguiente expresión devolverá <code>false</code>:</p>
+
+<pre class="brush: js notranslate">'Ballena azul'.includes('ballena'); // devuelve false
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este método ha sido agregado a la especificación ECMAScript 2015 y puede no estar  disponible en toda las implementaciones de JavaScript.</p>
+
+<p>Sin embargo, puedes usar este método como polyfill:</p>
+
+<pre class="brush: js notranslate">if (!String.prototype.includes) {
+  String.prototype.includes = function(search, start) {
+    'use strict';
+
+    if (search instanceof RegExp) {
+      throw TypeError('first argument must not be a RegExp');
+    }
+    if (start === undefined) { start = 0; }
+    return this.indexOf(search, start) !== -1;
+  };
+}
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_includes">Usando <code>includes()</code></h3>
+
+<pre class="brush: js notranslate">const str = 'To be, or not to be, that is the question.'
+
+console.log(str.includes('To be'))        // true
+console.log(str.includes('question'))     // true
+console.log(str.includes('nonexistent'))  // false
+console.log(str.includes('To be', 1))     // false
+console.log(str.includes('TO BE'))        // false
+console.log(str.includes(''))             // true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.includes', 'String.prototype.includes')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{Compat("javascript.builtins.String.includes")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.includes()")}}</li>
+ <li>{{jsxref("TypedArray.prototype.includes()")}}</li>
+ <li>{{jsxref("String.prototype.indexOf()")}}</li>
+ <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
+ <li>{{jsxref("String.prototype.startsWith()")}}</li>
+ <li>{{jsxref("String.prototype.endsWith()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/index.html b/files/es/web/javascript/reference/global_objects/string/index.html
new file mode 100644
index 0000000000..acf3cdcae5
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/index.html
@@ -0,0 +1,386 @@
+---
+title: String — Cadena de caracteres
+slug: Web/JavaScript/Reference/Global_Objects/String
+tags:
+  - Clase
+  - Class
+  - ECMAScript 2015
+  - JavaScript
+  - Referencia
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>String</code></strong> se utiliza para representar y manipular una secuencia de caracteres.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las cadenas son útiles para almacenar datos que se pueden representar en forma de texto. Algunas de las operaciones más utilizadas en cadenas son verificar su {{jsxref("String.length", "length")}}, para construirlas y concatenarlas usando <a href="/es/docs/Web/JavaScript/Reference/Operators/String_Operators">operadores de cadena + y +=</a>, verificando la existencia o ubicación de subcadenas con {{jsxref("String.prototype.indexOf()", "indexOf()")}} o extraer subcadenas con el método {{jsxref("String.prototype.substring()", "substring()")}}.</p>
+
+<h3 id="Crear_cadenas">Crear cadenas</h3>
+
+<p>Las cadenas se pueden crear como primitivas, a partir de cadena literales o como objetos, usando el constructor {{jsxref("String/String", "String()")}}:</p>
+
+<pre class="syntaxbox notranslate">const string1 = "Una cadena primitiva";
+const string2 = 'También una cadena primitiva';
+const string3 = `Otra cadena primitiva más`;</pre>
+
+<pre class="syntaxbox notranslate">const string4 = new String("Un objeto String");
+</pre>
+
+<p>Las <code>string</code>s primitivas y los objetos <code>string</code> se pueden usar indistintamente en la mayoría de las situaciones. Consulta "<a href="#Primitivas_string_y_objetos_string">Primitivas <code>String</code> y objetos <code>String</code></a>" a continuación.</p>
+
+<p>Los cadena literales se pueden especificar usando comillas simples o dobles, que se tratan de manera idéntica, o usando el carácter de comilla invertida <kbd>`</kbd>. Esta última forma especifica una <a href="/es/docs/Web/JavaScript/Reference/Template_literals">Plantilla literal</a>: con esta forma puedes interpolar expresiones.</p>
+
+<h3 id="Acceder_a_un_caracter">Acceder a un caracter</h3>
+
+<p>Hay dos formas de acceder a un caracter individual en una cadena. La primera es con el método {{jsxref("String.prototype.charAt()", "charAt()")}}:</p>
+
+<pre class="brush: js notranslate">return 'cat'.charAt(1) // devuelve "a"
+</pre>
+
+<p>La otra forma (introducida en ECMAScript 5) es tratar a la cadena como un objeto similar a un arreglo, donde los caracteres individuales corresponden a un índice numérico:</p>
+
+<pre class="brush: js notranslate">return 'cat'[1] // devuelve "a"
+</pre>
+
+<p>Cuando se usa la notación entre corchetes para acceder a los caracteres, no se puede intentar eliminar o asignar un valor a estas propiedades. Las propiedades involucradas no se pueden escribir ni configurar. (Ve {{jsxref("Object.defineProperty()")}} para más información).</p>
+
+<h3 id="Comparar_cadenas">Comparar cadenas</h3>
+
+<p>En C, se usa la función <code>strcmp()</code> para comparar cadenas. En JavaScript, solo usas los <a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">operadores menor que y mayor que</a>:</p>
+
+<pre class="brush: js notranslate">let a = 'a'
+let b = 'b'
+if (a &lt; b) { // true
+  console.log(a + ' es menor que ' + b)
+} else if (a &gt; b) {
+  console.log(a + ' es mayor que ' + b)
+} else {
+  console.log(a + ' y ' + b + ' son iguales.')
+}
+</pre>
+
+<p>Puedes lograr un resultado similar usando el método {{jsxref("String.prototype.localeCompare()", "localeCompare()")}} heredado por las instancias de <code>String</code>.</p>
+
+<p>Ten en cuenta que <code>a == b</code> compara las cadenas en <code><var>a</var></code> y <code><var>b</var></code> por ser igual en la forma habitual que distingue entre mayúsculas y minúsculas. Si deseas comparar sin tener en cuenta los caracteres en mayúsculas o minúsculas, usa una función similar a esta:</p>
+
+<pre class="notranslate">function isEqual(str1, str2)
+{
+    return str1.toUpperCase() === str2.toUpperCase()
+} // isEqual
+</pre>
+
+<p>En esta función se utilizan mayúsculas en lugar de minúsculas, debido a problemas con ciertas conversiones de caracteres UTF-8.</p>
+
+<h3 id="Primitivas_String_y_objetos_String">Primitivas <code>String</code> y objetos <code>String</code></h3>
+
+<p>Ten en cuenta que JavaScript distingue entre objetos <code>String</code> y valores de {{Glossary("Primitive", "primitivas string")}}. (Lo mismo ocurre con {{jsxref("Boolean", "Booleanos")}} y {{jsxref("Global_Objects/Number", "Números")}}).</p>
+
+<p>Las cadenas literales (denotadas por comillas simples o dobles) y cadenas devueltas de llamadas a <code>String</code> en un contexto que no es de constructor (es decir, llamado sin usar la palabra clave {{jsxref("Operators/new", "new")}}) son cadenas primitivas. JavaScript automáticamente convierte las primitivas en objetos <code>String</code>, por lo que es posible utilizar métodos del objeto <code>String</code> en cadenas primitivas. En contextos donde se va a invocar a un método en una cadena primitiva o se produce una búsqueda de propiedad, JavaScript ajustará automáticamente la cadena primitiva y llamará al método o realizará la búsqueda de la propiedad.</p>
+
+<pre class="brush: js notranslate">let s_prim = 'foo'
+let s_obj = new String(s_prim)
+
+console.log(typeof s_prim) // Registra "string"
+console.log(typeof s_obj)  // Registra "object"
+</pre>
+
+<p>Las primitivas de <code>String</code> y los objetos <code>String</code> también dan diferente resultado cuando se usa {{jsxref("Global_Objects/eval", "eval()")}}. Las primitivas pasadas a <code>eval</code> se tratan como código fuente; Los objetos <code>String</code> se tratan como todos los demás objetos, devuelven el objeto. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">let s1 = '2 + 2'              // crea una string primitiva
+let s2 = new String('2 + 2')  // crea un objeto String
+console.log(eval(s1))         // devuelve el número 4
+console.log(eval(s2))         // devuelve la cadena "2 + 2"
+</pre>
+
+<p>Por estas razones, el código se puede romper cuando encuentra objetos <code>String</code> y espera una <code>string</code> primitiva en su lugar, aunque generalmente los autores no necesitan preocuparse por la distinción.</p>
+
+<p>Un objeto <code>String</code> siempre se puede convertir a su contraparte primitiva con el método {{jsxref("String.prototype.valueOf()", "valueOf()")}}.</p>
+
+<pre class="brush: js notranslate">console.log(eval(s2.valueOf()))  // devuelve el número 4
+</pre>
+
+<h3 id="Notación_de_escape">Notación de escape</h3>
+
+<p>Los caracteres especiales se pueden codificar mediante notación de escape:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Código</th>
+   <th scope="col">Salida</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>\<var>XXX</var></code><br>
+    (donde <code><var>XXX</var></code> es de 1 a 3 dígitos octales; rango de <code>0</code>-<code>377</code>)</td>
+   <td>Punto de código Unicode/carácter ISO-8859-1 entre <code>U+0000</code> y <code>U+00FF</code></td>
+  </tr>
+  <tr>
+   <td><code>\'</code></td>
+   <td>Comilla sencilla</td>
+  </tr>
+  <tr>
+   <td><code>\"</code></td>
+   <td>Comilla doble</td>
+  </tr>
+  <tr>
+   <td><code>\\</code></td>
+   <td>Barra inversa</td>
+  </tr>
+  <tr>
+   <td><code>\n</code></td>
+   <td>Nueva línea</td>
+  </tr>
+  <tr>
+   <td><code>\r</code></td>
+   <td>Retorno de carro</td>
+  </tr>
+  <tr>
+   <td><code>\v</code></td>
+   <td>Tabulación vertical</td>
+  </tr>
+  <tr>
+   <td><code>\t</code></td>
+   <td>Tabulación</td>
+  </tr>
+  <tr>
+   <td><code>\b</code></td>
+   <td>Retroceso</td>
+  </tr>
+  <tr>
+   <td><code>\f</code></td>
+   <td>Avance de página</td>
+  </tr>
+  <tr>
+   <td><code>\u<var>XXXX</var></code> (donde <code><var>XXXX</var></code> son 4 dígitos hexadecimales; rango de <code>0x0000</code>-<code>0xFFFF</code>)</td>
+   <td>Unidad de código UTF-16/punto de código Unicode entre <code>U+0000</code> y <code>U+FFFF</code></td>
+  </tr>
+  <tr>
+   <td><code>\u{<var>X</var>}</code> ... <code>\u{<var>XXXXXX</var>}</code><br>
+    (donde <code><var>X</var>…<var>XXXXXX</var></code> es de 1 a 6 dígitos hexadecimales; rango de <code>0x0</code>-<code>0x10FFFF</code>)</td>
+   <td>Unidad de código UTF-32/punto de código Unicode entre <code>U+0000</code> y <code>U+10FFFF</code></td>
+  </tr>
+  <tr>
+   <td><code>\x<var>XX</var></code><br>
+    (donde <code><var>XX</var></code> son 2 dígitos hexadecimales; rango de <code>0x00</code>-<code>0xFF</code>)</td>
+   <td>Punto de código Unicode/carácter ISO-8859-1 entre <code>U+0000</code> y <code>U+00FF</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Cadenas_literales_largas">Cadenas literales largas</h3>
+
+<p>A veces, tu código incluirá cadenas que son muy largas. En lugar de tener líneas que se prolongan interminablemente o que se ajustan según el capricho de tu editor, es posible que desees dividir específicamente la cadena en varias líneas en el código fuente sin afectar el contenido real de la cadena. hay dos maneras de conseguirlo.</p>
+
+<h4 id="Método_1">Método 1</h4>
+
+<p>Puedes usar el operador <a href="/es/docs/Web/JavaScript/Reference/Operators/Addition">+</a> para agregar varias cadenas juntas, así:</p>
+
+<pre class="brush: js notranslate">let longString = "Esta es una cadena muy larga que necesita " +
+                 "que dividimos en varias líneas porque " +
+                 "de lo contrario, mi código es ilegible."
+</pre>
+
+<h4 id="Método_2">Método 2</h4>
+
+<p>Puedes usar el caracter de barra invertida (<code>\</code>) al final de cada línea para indicar que la cadena continúa en la siguiente línea. Asegúrate de que no haya ningún espacio ni ningún otro carácter después de la barra invertida (a excepción de un salto de línea) o como sangría; de lo contrario, no trabajará.</p>
+
+<p>Esa forma se ve así:</p>
+
+<pre class="brush: js notranslate">let longString = "Esta es una cadena muy larga que necesita \
+que dividimos en varias líneas porque \
+de lo contrario, mi código es ilegible."
+</pre>
+
+<p>Ambos métodos anteriores dan como resultado cadenas idénticas.</p>
+
+<h2 id="Constructor">Constructor</h2>
+
+<dl>
+ <dt>{{jsxref("String/String", "String()")}}</dt>
+ <dd>Crea un nuevo objeto <code>String</code>. Realiza la conversión de tipos cuando se llama como función, en lugar de como constructor, lo cual suele ser más útil.</dd>
+</dl>
+
+<h2 id="Métodos_estáticos">Métodos estáticos</h2>
+
+<dl>
+ <dt>{{jsxref("String.fromCharCode()", "String.fromCharCode(<var>num1</var> [, ...[, <var>numN</var>]])")}}</dt>
+ <dd>Devuelve una cadena creada utilizando la secuencia de valores Unicode especificada.</dd>
+ <dt>{{jsxref("String.fromCodePoint()", "String.fromCodePoint(<var>num1</var> [, ...[, <var>numN</var>]])")}}</dt>
+ <dd>Devuelve una cadena creada utilizando la secuencia de puntos de código especificada.</dd>
+ <dt>{{jsxref("String.raw()")}}</dt>
+ <dd>Devuelve una cadena creada a partir de una plantilla literal sin formato.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{jsxref("String.prototype.length")}}</dt>
+ <dd>Refleja la <code>length</code> de la cadena. Solo lectura.</dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt>{{jsxref("String.prototype.charAt()", "String.prototype.charAt(<var>index</var>)")}}</dt>
+ <dd>Devuelve el caracter (exactamente una unidad de código UTF-16) en el <code><var>index</var></code> especificado.</dd>
+ <dt>{{jsxref("String.prototype.charCodeAt()", "String.prototype.charCodeAt(<var>index</var>)")}}</dt>
+ <dd>Devuelve un número que es el valor de la unidad de código UTF-16 en el <code><var>index</var></code> dado.</dd>
+ <dt>{{jsxref("String.prototype.codePointAt()", "String.prototype.codePointAt(<var>pos</var>)")}}</dt>
+ <dd>Devuelve un número entero no negativo que es el valor del punto de código del punto de código codificado en UTF-16 que comienza en la <code><var>pos</var></code> especificada.</dd>
+ <dt>{{jsxref("String.prototype.concat()", "String.prototype.concat(<var>str</var>[, ...<var>strN</var>])")}}</dt>
+ <dd>Combina el texto de dos (o más) cadenas y devuelve una nueva cadena.</dd>
+ <dt>{{jsxref("String.prototype.includes()", "String.prototype.includes(<var>searchString</var> [, <var>position</var>])")}}</dt>
+ <dd>Determina si la cadena de la llamada contiene <code><var>searchString</var></code>.</dd>
+ <dt>{{jsxref("String.prototype.endsWith()", "String.prototype.endsWith(<var>searchString</var>[, <var>length</var>])")}}</dt>
+ <dd>Determina si una cadena termina con los caracteres de la cadena <code><var>searchString</var></code>.</dd>
+ <dt>{{jsxref("String.prototype.indexOf()", "String.prototype.indexOf(<var>searchValue</var>[, <var>fromIndex</var>])")}}</dt>
+ <dd>Devuelve el índice dentro del objeto {{jsxref("String")}} llamador de la primera aparición de <code><var>searchValue</var></code>, o <code>-1</code> si no lo encontró.</dd>
+ <dt>{{jsxref("String.prototype.lastIndexOf()", "String.prototype.lastIndexOf(<var>searchValue</var>[, <var>fromIndex</var>])")}}</dt>
+ <dd>Devuelve el índice dentro del objeto {{jsxref("String")}} llamador de la última aparición de <code><var>searchValue</var></code>, o <code>-1</code> si no lo encontró.</dd>
+ <dt>{{jsxref("String.prototype.localeCompare()", "String.prototype.localeCompare(<var>compareString</var>[, <var>locales</var>[, <var>options</var>]])")}}</dt>
+ <dd>Devuelve un número que indica si la cadena de referencia <code><var>compareString</var></code> viene antes, después o es equivalente a la cadena dada en el orden de clasificación.</dd>
+ <dt>{{jsxref("String.prototype.match()", "String.prototype.match(<var>regexp</var>)")}}</dt>
+ <dd>Se utiliza para hacer coincidir la expresión regular <code><var>regexp</var></code> con una cadena.</dd>
+ <dt>{{jsxref("String.prototype.matchAll()", "String.prototype.matchAll(<var>regexp</var>)")}}</dt>
+ <dd>Devuelve un iterador de todas las coincidencias de <code><var>regexp</var></code>.</dd>
+ <dt>{{jsxref("String.prototype.normalize()", "String.prototype.normalize([<var>form</var>])")}}</dt>
+ <dd>Devuelve la forma de normalización Unicode del valor de la cadena llamada.</dd>
+ <dt>{{jsxref("String.prototype.padEnd()", "String.prototype.padEnd(<var>targetLength</var>[, <var>padString</var>])")}}</dt>
+ <dd>Rellena la cadena actual desde el final con una cadena dada y devuelve una nueva cadena de longitud <code><var>targetLength</var></code>.</dd>
+ <dt>{{jsxref("String.prototype.padStart()", "String.prototype.padStart(<var>targetLength</var>[, <var>padString</var>])")}}</dt>
+ <dd>Rellena la cadena actual desde el principio con una determinada cadena y devuelve una nueva cadena de longitud <code><var>targetLength</var></code>.</dd>
+ <dt>{{jsxref("String.prototype.repeat()", "String.prototype.repeat(<var>count</var>)")}}</dt>
+ <dd>Devuelve una cadena que consta de los elementos del objeto repetidos <code><var>count</var></code> veces.</dd>
+ <dt>{{jsxref("String.prototype.replace()" , "String.prototype.replace(<var>searchFor</var>, <var>replaceWith</var>)")}}</dt>
+ <dd>Se usa para reemplazar ocurrencias de <code><var>searchFor</var></code> usando <code><var>replaceWith</var></code>. <code><var>searchFor</var></code> puede ser una cadena o expresión regular, y <code><var>replaceWith</var></code> puede ser una cadena o función.</dd>
+ <dt>{{jsxref("String.prototype.replaceAll()", "String.prototype.replaceAll(<var>searchFor</var>, <var>replaceWith</var>)")}}</dt>
+ <dd>Se utiliza para reemplazar todas las apariciones de <code><var>searchFor</var></code> usando <code><var>replaceWith</var></code>. <code><var>searchFor</var></code> puede ser una cadena o expresión regular, y <code><var>replaceWith</var></code> puede ser una cadena o función.</dd>
+ <dt>{{jsxref("String.prototype.search()", "String.prototype.search(<var>regexp</var>)")}}</dt>
+ <dd>Busca una coincidencia entre una expresión regular <code><var>regexp</var></code> y la cadena llamadora.</dd>
+ <dt>{{jsxref("String.prototype.slice()", "String.prototype.slice(<var>beginIndex</var>[, <var>endIndex</var>])")}}</dt>
+ <dd>Extrae una sección de una cadena y devuelve una nueva cadena.</dd>
+ <dt>{{jsxref("String.prototype.split()", "String.prototype.split([<var>sep</var>[, <var>limit</var>] ])")}}</dt>
+ <dd>Devuelve un arreglo de cadenas pobladas al dividir la cadena llamadora en las ocurrencias de la subcadena <code><var>sep</var></code>.</dd>
+ <dt>{{jsxref("String.prototype.startsWith()", "String.prototype.startsWith(<var>searchString</var>[, <var>length</var>])")}}</dt>
+ <dd>Determina si la cadena llamadora comienza con los caracteres de la cadena <code><var>searchString</var></code>.</dd>
+ <dt>{{jsxref("String.prototype.substr()")}}</dt>
+ <dd>Devuelve los caracteres en una cadena que comienza en la ubicación especificada hasta el número especificado de caracteres.</dd>
+ <dt>{{jsxref("String.prototype.substring()", "String.prototype.substring(<var>indexStart</var>[, <var>indexEnd</var>])")}}</dt>
+ <dd>Devuelve una nueva cadena que contiene caracteres de la cadena llamadora de (o entre) el índice (o indeces) especificados.</dd>
+ <dt>{{jsxref("String.prototype.toLocaleLowerCase()", "String.prototype.toLocaleLowerCase( [<var>locale</var>, ...<var>locales</var>])")}}</dt>
+ <dd>
+ <p>Los caracteres dentro de una cadena se convierten a minúsculas respetando la configuración regional actual.</p>
+
+ <p>Para la mayoría de los idiomas, devolverá lo mismo que {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}.</p>
+ </dd>
+ <dt>{{jsxref("String.prototype.toLocaleUpperCase()", "String.prototype.toLocaleUpperCase( [<var>locale</var>, ...<var>locales</var>])")}}</dt>
+ <dd>
+ <p>Los caracteres dentro de una cadena se convierten a mayúsculas respetando la configuración regional actual.</p>
+
+ <p>Para la mayoría de los idiomas, devolverá lo mismo que {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}.</p>
+ </dd>
+ <dt>{{jsxref("String.prototype.toLowerCase()")}}</dt>
+ <dd>Devuelve el valor de la cadena llamadora convertido a minúsculas.</dd>
+ <dt>{{jsxref("String.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el objeto especificado. Redefine el método {{jsxref("Object.prototype.toString()")}}.</dd>
+ <dt>{{jsxref("String.prototype.toUpperCase()")}}</dt>
+ <dd>Devuelve el valor de la cadena llamadora convertido a mayúsculas.</dd>
+ <dt>{{jsxref("String.prototype.trim()")}}</dt>
+ <dd>Recorta los espacios en blanco desde el principio y el final de la cadena. Parte del estándar ECMAScript 5.</dd>
+ <dt>{{jsxref("String.prototype.trimStart()")}}</dt>
+ <dd>Recorta los espacios en blanco desde el principio de la cadena.</dd>
+ <dt>{{jsxref("String.prototype.trimEnd()")}}</dt>
+ <dd>Recorta los espacios en blanco del final de la cadena.</dd>
+ <dt>{{jsxref("String.prototype.valueOf()")}}</dt>
+ <dd>Devuelve el valor primitivo del objeto especificado. Redefine el método {{jsxref("Object.prototype.valueOf()")}}.</dd>
+ <dt>{{jsxref("String.prototype.@@iterator()")}}</dt>
+ <dd>Devuelve un nuevo objeto <code>Iterator</code> que itera sobre los puntos de código de un valor de cadena, devolviendo cada punto de código como un valor de cadena.</dd>
+</dl>
+
+<h2 id="Métodos_de_contenedor_HTML">Métodos de contenedor HTML</h2>
+
+<div>
+<div class="blockIndicator note">
+<p><strong>Desaprobado. Evita estos métodos.</strong></p>
+
+<p>Son de uso limitado, ya que proporcionan solo un subconjunto de las etiquetas y atributos HTML disponibles.</p>
+</div>
+
+<dl>
+ <dt>{{jsxref("String.prototype.anchor()")}}</dt>
+ <dd>{{htmlattrxref("name", "a", "&lt;a name=\"name\"&gt;")}} (hipertexto destino)</dd>
+ <dt>{{jsxref("String.prototype.big()")}}</dt>
+ <dd>{{HTMLElement("big")}}</dd>
+ <dt>{{jsxref("String.prototype.blink()")}}</dt>
+ <dd>{{HTMLElement("blink")}}</dd>
+ <dt>{{jsxref("String.prototype.bold()")}}</dt>
+ <dd>{{HTMLElement("b")}}</dd>
+ <dt>{{jsxref("String.prototype.fixed()")}}</dt>
+ <dd>{{HTMLElement("tt")}}</dd>
+ <dt>{{jsxref("String.prototype.fontcolor()")}}</dt>
+ <dd>{{htmlattrxref("color", "font", "&lt;font color=\"color\"&gt;")}}</dd>
+ <dt>{{jsxref("String.prototype.fontsize()")}}</dt>
+ <dd>{{htmlattrxref("size", "font", "&lt;font size=\"size\"&gt;")}}</dd>
+ <dt>{{jsxref("String.prototype.italics()")}}</dt>
+ <dd>{{HTMLElement("i")}}</dd>
+ <dt>{{jsxref("String.prototype.link()")}}</dt>
+ <dd>{{htmlattrxref("href", "a", "&lt;a href=\"url\"&gt;")}} (enlace a URL)</dd>
+ <dt>{{jsxref("String.prototype.small()")}}</dt>
+ <dd>{{HTMLElement("small")}}</dd>
+ <dt>{{jsxref("String.prototype.strike()")}}</dt>
+ <dd>{{HTMLElement("strike")}}</dd>
+ <dt>{{jsxref("String.prototype.sub()")}}</dt>
+ <dd>{{HTMLElement("sub")}}</dd>
+ <dt>{{jsxref("String.prototype.sup()")}}</dt>
+ <dd>{{HTMLElement("sup")}}</dd>
+</dl>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Conversión_de_cadenas">Conversión de cadenas</h3>
+
+<p>Es posible usar <code>String</code> como una alternativa más confiable de {{jsxref("String.prototype.toString()", "toString()")}}, ya que funciona cuando se usa en {{jsxref( "null")}}, {{jsxref("undefined")}} y en {{jsxref("Symbol", "símbolos")}}. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">let outputStrings = []
+for (let i = 0, n = inputValues.length; i &lt; n; ++i) {
+  outputStrings.push(String(inputValues[i]));
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string-objects', 'String')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.String")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Guide/Text_formatting">Formato de texto en la Guía de JavaScript</a></li>
+ <li>{{jsxref("RegExp")}}</li>
+ <li>{{domxref("DOMString")}}</li>
+ <li><a href="/es/Add-ons/Code_snippets/StringView"><code>StringView</code> — una representación similar a C de cadenas basada en arreglos tipados</a></li>
+ <li><a href="/es/docs/Web/API/DOMString/Binary">Cadenas binarias</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/indexof/index.html b/files/es/web/javascript/reference/global_objects/string/indexof/index.html
new file mode 100644
index 0000000000..8cdadf2cb9
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/indexof/index.html
@@ -0,0 +1,105 @@
+---
+title: String.prototype.indexOf()
+slug: Web/JavaScript/Reference/Global_Objects/String/indexOf
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/indexOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/indexOf
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <code><strong>indexOf()</strong></code>devuelve el índice, dentro del objeto <code>String</code> que realiza la llamada, de la primera ocurrencia del valor especificado, comenzando la búsqueda desde <code>indiceDesde</code>; o -1 si no se encuentra dicho valor.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.indexOf(<em>valorBusqueda</em>[,<em> indiceDesde</em>])</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>valorBusqueda</code></dt>
+ <dd>Una cadena que representa el valor de búsqueda.</dd>
+</dl>
+
+<dl>
+ <dt><code>indiceDesde</code></dt>
+ <dd>La localización dentro de la cadena llamada desde la que empezará la búsqueda. Puede ser un entero entre 0 y la longitud de la cadena. El valor predeterminado es 0.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Los caracteres de una cadena se indexan de izquierda a derecha. El índice del primer carácter es 0, y el índice del último carácter de una cadena llamada <code>nombreCadena</code> es <code>nombreCadena.length - 1</code>.</p>
+
+<pre class="brush: js">"Blue Whale".indexOf("Blue")    // returns 0
+"Blue Whale".indexOf("Blute")   // returns -1
+"Blue Whale".indexOf("Whale",0) // returns 5
+"Blue Whale".indexOf("Whale",5) // returns 5
+"Blue Whale".indexOf("",9)      // returns 9
+"Blue Whale".indexOf("",10)     // returns 10
+"Blue Whale".indexOf("",11)     // returns 10
+</pre>
+
+<p>El método <code>indexOf</code> es sensible a mayúsculas. Por ejemplo, la siguiente expresión devuelve -1:</p>
+
+<pre class="brush: js">"Ballena Azul".indexOf("azul")
+</pre>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_indexOf_y_lastIndexOf" name="Ejemplo:_Usando_indexOf_y_lastIndexOf">Ejemplo: Usando <code>indexOf</code> y <code>lastIndexOf</code></h3>
+
+<p>El siguiente ejemplo utiliza <code>indexOf</code> y <code>lastIndexOf</code> para localizar valores dentro de la cadena "<code>Brave new world</code>".</p>
+
+<pre class="brush: js">var cualquierCadena="Brave new world"
+
+
+document.write("&lt;P&gt;The index of the first w from the beginning is " +
+   cualquierCadena.indexOf("w"))         // Muestra 8
+
+document.write("&lt;P&gt;The index of the first w from the end is " +
+   cualquierCadena.lastIndexOf("w"))    // Muestra 10
+
+document.write("&lt;P&gt;The index of 'new' from the beginning is " +
+   cualquierCadena.indexOf("new"))      // Muestra 6
+
+document.write("&lt;P&gt;The index of 'new' from the end is " +
+   cualquierCadena.lastIndexOf("new"))  // Muestra 6
+</pre>
+
+<h3 id="Ejemplo:_indexOf_y_sensibilidad_a_may.C3.BAsculas" name="Ejemplo:_indexOf_y_sensibilidad_a_may.C3.BAsculas">Ejemplo: <code>indexOf</code> y sensibilidad a mayúsculas</h3>
+
+<p>El siguiente ejemplo define dos variables de tipo cadena. Las variables contienen la misma cadena excepto que la segunda cadena contienen letras en mayúscula. El primer método <code>writeln</code> muestra 19. Pero a que el método <code>indexOf</code> es sensible a mayúsculas, no se encuentra la cadena "<code>cheddar</code>" en <code>miCadenaMayusculas</code>, así que el segundo método <code>writeln</code> muestra -1.</p>
+
+<pre class="brush: js">miCadena="brie, pepper jack, cheddar"
+miCadenaMayusculas="Brie, Pepper Jack, Cheddar"
+document.writeln('miCadena.indexOf("cheddar") is ' +
+   miCadena.indexOf("cheddar"))
+document.writeln('&lt;P&gt;miCadenaMayusculas.indexOf("cheddar") is ' +
+   miCadenaMayusculas.indexOf("cheddar"))
+</pre>
+
+<h3 id="Ejemplo:_Usando_indexOf_para_contar_ocurrencias_de_una_letra_en_una_cadena" name="Ejemplo:_Usando_indexOf_para_contar_ocurrencias_de_una_letra_en_una_cadena">Ejemplo: Usando <code>indexOf</code> para contar ocurrencias de una letra en una cadena</h3>
+
+<p>El siguiente ejemplo establece <code>cuenta</code> como el número de ocurrencias de la letra <code>x</code> dentro de la cadena <code>miCadena</code>:</p>
+
+<pre class="brush: js">cuenta = 0;
+posicion = miCadena.indexOf("x");
+while ( posicion != -1 ) {
+   cuenta++;
+   posicion = miCadena.indexOf("x",posicion+1);
+}
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.charAt()")}}</li>
+ <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
+ <li>{{jsxref("String.prototype.split()")}}</li>
+ <li>{{jsxref("Array.prototype.indexOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/italics/index.html b/files/es/web/javascript/reference/global_objects/string/italics/index.html
new file mode 100644
index 0000000000..858e66df91
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/italics/index.html
@@ -0,0 +1,50 @@
+---
+title: String.prototype.italics()
+slug: Web/JavaScript/Reference/Global_Objects/String/italics
+tags:
+  - Deprecated
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/italics
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/italics
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<p>{{deprecated_header}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Provoca que una cadena ponga en cursiva, como si estuviese dentro de una etiqueta {{HTMLElement("i")}}.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.italics()</pre>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Usa el método <code>italics</code> para formatear y mostrar una cadena en un documento.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>italics()</code></h3>
+
+<p>El siguiente ejemplo usa métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
+
+<pre class="brush: js">var cadenaMundo="¡Hola mundo!";
+
+console.log(cadenaMundo.blink());
+console.log(cadenaMundo.bold());
+console.log(cadenaMundo.italics());
+console.log(cadenaMundo.strike());
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.blink()")}}</li>
+ <li>{{jsxref("String.prototype.bold()")}}</li>
+ <li>{{jsxref("String.prototype.strike()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/lastindexof/index.html b/files/es/web/javascript/reference/global_objects/string/lastindexof/index.html
new file mode 100644
index 0000000000..93c113b13e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/lastindexof/index.html
@@ -0,0 +1,80 @@
+---
+title: String.prototype.lastIndexOf()
+slug: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
+tags:
+  - Cadena
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/lastIndexOf
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El  método <strong><code>lastIndexOf() </code></strong><code>devuelve </code>la posicion (indice) en la que se encuentra el <strong>valorBusqueda</strong>, dentro del objeto <code>String</code> que realiza la llamada, de la última ocurrencia del valor especificado; o -1 si no se halla. La búsqueda se realiza empezando por el final de la cadena que realiza la llamada, empezando en <strong><code>indiceDesde</code></strong>.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.lastIndexOf(<em>valorBusqueda</em>[,<em> indiceDesde</em>]<em>)</em></pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>valorBusqueda</code></dt>
+ <dd>Una cadena que representa el valor que se desea buscar.</dd>
+</dl>
+
+<dl>
+ <dt><code>indiceDesde</code></dt>
+ <dd>La localización dentro de la cadena que realiza la llamada desde donde comenzará la búsqueda. Puede ser cualquier entero entre 0 y la longitud de la cadena. El valor predeterminado es la longitud de la cadena.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Los caracteres de una cadena se indexan de izquierda a derecha. El índice del primer carácter es 0, y el índice del último carácter es <code>nombreCadena.length - 1</code>.</p>
+
+<pre class="brush: js">"canal".lastIndexOf("a")   // returns 3
+"canal".lastIndexOf("a",2) // returns 1
+"canal".lastIndexOf("a",0) // returns -1
+"canal".lastIndexOf("x")   // returns -1
+</pre>
+
+<p>El método <code>lastIndexOf</code> es sensible a mayúsculas. Por ejemplo, la siguiente expresión devuelve -1:</p>
+
+<pre class="brush: js">"Ballena Azul, Ballena Asesina".lastIndexOf("azul")
+</pre>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_indexOf_y_lastIndexOf" name="Ejemplo:_Usando_indexOf_y_lastIndexOf">Ejemplo: Usando <code>indexOf</code> y <code>lastIndexOf</code></h3>
+
+<p>The following example uses <code>indexOf</code> and <code>lastIndexOf</code> to locate values in the string "<code>Brave new world</code>".</p>
+
+<pre class="brush: js">var anyString="Brave new world"
+
+// Displays 8
+document.write("&lt;P&gt;The index of the first w from the beginning is " +
+   anyString.indexOf("w"))
+// Displays 10
+document.write("&lt;P&gt;The index of the first w from the end is " +
+   anyString.lastIndexOf("w"))
+// Displays 6
+document.write("&lt;P&gt;The index of 'new' from the beginning is " +
+   anyString.indexOf("new"))
+// Displays 6
+document.write("&lt;P&gt;The index of 'new' from the end is " +
+   anyString.lastIndexOf("new"))
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.charAt()")}}</li>
+ <li>{{jsxref("String.prototype.indexOf()")}}</li>
+ <li>{{jsxref("String.prototype.split()")}}</li>
+ <li>{{jsxref("Array.prototype.indexOf()")}}</li>
+ <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/length/index.html b/files/es/web/javascript/reference/global_objects/string/length/index.html
new file mode 100644
index 0000000000..34479ec497
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/length/index.html
@@ -0,0 +1,95 @@
+---
+title: String.length
+slug: Web/JavaScript/Reference/Global_Objects/String/length
+tags:
+  - JavaScript
+  - Propiedad
+  - Prototipo
+  - Referencia
+  - String
+  - length
+translation_of: Web/JavaScript/Reference/Global_Objects/String/length
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/length
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad<strong> </strong><code><strong>length</strong></code> de un objeto {{jsxref("String")}} representa la longitud de una cadena, en unidades de código UTF-16.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>str</var>.length</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Esta propiedad devuelve el número de caracteres de una cadena. {{interwiki("wikipedia", "UTF-16")}}, el formato usado por JavaScript, usa 16-bit para representar los caracteres más comunes, pero necesita usar dos caracteres para otros menos usados, así que es posible que el valor devuelto por <code>length</code> no corresponda al número de caracteres de la cadena.</p>
+
+<p>ECMASCript 2016 (ed. 7) estableció una longitud máxima de <code>2^53 - 1</code> elementos. Anteriormente, ninguna longitud máxima era especificada. </p>
+
+<p>Para una cadena vacía, <code>length</code> es 0.</p>
+
+<p>La propiedad static <code>String.length</code> devuelve 1.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_Básico">Uso Básico</h3>
+
+<pre class="brush: js notranslate">var x = 'Mozilla';
+var empty = '';
+
+console.log('Mozilla is ' + x.length + ' code units long');
+/* "Mozilla is 7 code units long" */
+
+console.log('The empty string has a length of ' + empty.length);
+/* "The empty string has a length of 0" */</pre>
+
+<h3 id="Asignando_a_length">Asignando a length</h3>
+
+<pre class="brush: js notranslate">var myString = "bluebells";
+
+// Attempting to assign a value to a string's .length property has no observable effect.
+myString.length = 4;
+console.log(myString);
+/* "bluebells" */
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Estándar</td>
+   <td>Primera definicíon. Implementado en JavaScript 1.0.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.5.1', 'String.prototype.length')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-properties-of-string-instances-length', 'String.prototype.length')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-properties-of-string-instances-length', 'String.prototype.length')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{Compat("javascript.builtins.String.length")}}</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li><a class="external" href="http://developer.teradata.com/blog/jasonstrimpel/2011/11/javascript-string-length-and-internationalizing-web-applications">JavaScript String.length and Internationalizing Web Applications</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/link/index.html b/files/es/web/javascript/reference/global_objects/string/link/index.html
new file mode 100644
index 0000000000..5cab4dd8e6
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/link/index.html
@@ -0,0 +1,57 @@
+---
+title: String.prototype.link()
+slug: Web/JavaScript/Reference/Global_Objects/String/link
+tags:
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/link
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/link
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Crea un enlace de hipertexto HTML, {{HTMLElement("a")}}, que solicita otra URL.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.link(<em>atributoHref</em>)</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>atributoHref</code></dt>
+ <dd>Cualquier cadena que especifique el atributo {{htmlattrxref("href", "a")}} de la etiqueta {{HTMLElement("a")}}; debería ser una URL válida (relativa o absoluta).</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Usa el método <code>link</code> para crear un atajo HTML para un enlace de hipertexto. La cadena devuelta puede ser añadida al documento vía {{domxref("element.innerHTML")}}.</p>
+
+<p>Los enlaces creados con el método <code>link</code> serán elementos del array <code>links</code> del objeto <code>document</code>. Vea {{domxref("document.links")}}.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_link" name="Ejemplo:_Usando_link">Ejemplo: Usando <code>link</code></h3>
+
+<p>El siguiente ejemplo muestra la palabra "Netscape" como un enlace de hipertexto que devuelve al usuario a la página inicial de Netscape:</p>
+
+<pre>var textoActivo="MDN"
+var URL="<code class="language-js"><span class="brush: js">https://developer.mozilla.org/</span></code>"
+
+console.log("Haga click para volver a " + textoActivo.link(URL))
+</pre>
+
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+
+<pre class="brush: html">Haga click para volver a &lt;a href="http://<code class="language-js"><span class="brush: js">developer.mozilla.org/</span></code>"&gt;MDN&lt;/a&gt;
+</pre>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.anchor()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/localecompare/index.html b/files/es/web/javascript/reference/global_objects/string/localecompare/index.html
new file mode 100644
index 0000000000..3b926398a8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/localecompare/index.html
@@ -0,0 +1,160 @@
+---
+title: String.prototype.localeCompare()
+slug: Web/JavaScript/Reference/Global_Objects/String/localeCompare
+translation_of: Web/JavaScript/Reference/Global_Objects/String/localeCompare
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/localeCompare
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>localeCompare()</code></strong> devuelve un número que indica si la cadena de caracteres actual es anterior, posterior o igual a la cadena pasada como parámetro, en orden lexicográfico.</p>
+
+<p>Los nuevos argumentos <code>locales</code> y <code>options</code> permiten a las aplicaciones especificar el idioma y el orden de clasificación que debe usarse y personalizar el comportamiento de la función. En las implementaciones más antiguas, que ignoran los argumentos <code>locales</code> y <code>options</code>, la configuración <code>locale</code> y el orden de clasificación utilizados dependen enteramente de la implementación</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>referenceStr</var>.localeCompare(<var>compareString</var>[, <var>locales</var>[, <var>options</var>]])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<p>Comprueba la sección <a href="#Compatibilidad_con_el_navegador">Compatibilidad con el navegador</a> para ver que navegadores soportan los argumentos <code>locales</code> y <code>options</code>, and the <a href="#Checking_for_support_for_locales_and_options_arguments">Checking for support for <code>locales</code> and <code>options</code> arguments</a> for feature detection.</p>
+
+<dl>
+ <dt><code>compareString</code></dt>
+ <dd>La cadena con la que queremos comparar la cadena actual de caracteres.</dd>
+</dl>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator', 'Parameters')}}</div>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un número <strong>negativo</strong> si la cadena de referencia ocurre antes de la cadena de comparación; <strong>positivo</strong> si la cadena de referencia ocurre después de la cadena de comparación; <strong>0</strong> si son equivalentes.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Returns an integer indicating whether the <strong>referenceStr</strong> comes before, after or is equivalent to the <strong>compareStr</strong>.</p>
+
+<ul>
+ <li>Negative when the <strong>referenceStr</strong> occurs before <strong>compareStr</strong></li>
+ <li>Positive when the <strong>referenceStr</strong> occurs after <strong>compareStr</strong></li>
+ <li>Returns 0 if they are equivalent</li>
+</ul>
+
+<p><strong>NO CONFIAR en que los valores devueltos sean siempre -1 o 1. </strong>Los resultados de enteros negativos y positivos varían entre los navegadores (así como entre diferentes versiones de un mismo navegador) porque la especificación W3C solo exige valores negativos y positivos. Algunos navegadores pueden devolver -2 o 2 o incluso algún otro valor negativo o positivo.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_de_localeCompare()">Uso de <code>localeCompare()</code></h3>
+
+<pre class="brush: js">// La letra "a" es anterior a la "c" produciendo un valor negativo
+'a'.localeCompare('c'); // -2 o -1 (u otro valor negativo)
+
+// Alfabeticamente la palabra "check" viene después de "against" produciendo un valor ppositivo
+'check'.localeCompare('against'); // 2 o 1 (u otro valor positivo)
+
+// "a" y "a" son equivalentes produciendo un valor neutro de 0
+'a'.localeCompare('a'); // 0
+</pre>
+
+<h3 id="Ordenar_un_array">Ordenar un array</h3>
+
+<p><code>localeCompare</code> enables a case-insensitive sort of an array.</p>
+
+<pre class="brush: js">var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];
+items.sort((a, b) =&gt; a.localeCompare(b)); // ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']
+</pre>
+
+<h3 id="Verificar_si_el_navegador_soporta_argumentos_extendidos">Verificar si el navegador soporta argumentos extendidos</h3>
+
+<p>The <code>locales</code> and <code>options</code> arguments are not supported in all browsers yet. To check whether an implementation supports them, use the "i" argument (a requirement that illegal language tags are rejected) and look for a {{jsxref("RangeError")}} exception:</p>
+
+<pre class="brush: js">function localeCompareSupportsLocales() {
+  try {
+    'foo'.localeCompare('bar', 'i');
+  } catch (e) {
+    return e.name === 'RangeError';
+  }
+  return false;
+}
+</pre>
+
+<h3 id="Uso_de_locales">Uso de <code>locales</code></h3>
+
+<p>The results provided by <code>localeCompare()</code> vary between languages. In order to get the sort order of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the <code>locales</code> argument:</p>
+
+<pre class="brush: js">console.log('ä'.localeCompare('z', 'de')); // a negative value: in German, ä sorts before z
+console.log('ä'.localeCompare('z', 'sv')); // a positive value: in Swedish, ä sorts after z
+</pre>
+
+<h3 id="Uso_de_options">Uso de <code>options</code></h3>
+
+<p>The results provided by <code>localeCompare()</code> can be customized using the <code>options</code> argument:</p>
+
+<pre class="brush: js">// in German, ä has a as the base letter
+console.log('ä'.localeCompare('a', 'de', { sensitivity: 'base' })); // 0
+
+// in Swedish, ä and a are separate base letters
+console.log('ä'.localeCompare('a', 'sv', { sensitivity: 'base' })); // a positive value
+</pre>
+
+<h2 id="Performance">Performance</h2>
+
+<p>When comparing large numbers of strings, such as in sorting large arrays, it is better to create an {{jsxref("Global_Objects/Collator", "Intl.Collator")}} object and use the function provided by its {{jsxref("Collator.prototype.compare", "compare")}} property.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.9', 'String.prototype.localeCompare')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.localecompare', 'String.prototype.localeCompare')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.localecompare', 'String.prototype.localeCompare')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 1.0', '#sec-13.1.1', 'String.prototype.localeCompare')}}</td>
+   <td>{{Spec2('ES Int 1.0')}}</td>
+   <td>Definiciones de los parámetros <code>locale</code> y <code>option</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int 2.0', '#sec-13.1.1', 'String.prototype.localeCompare')}}</td>
+   <td>{{Spec2('ES Int 2.0')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sec-String.prototype.localeCompare', 'String.prototype.localeCompare')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.localeCompare")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/match/index.html b/files/es/web/javascript/reference/global_objects/string/match/index.html
new file mode 100644
index 0000000000..528c9ff89c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/match/index.html
@@ -0,0 +1,79 @@
+---
+title: String.prototype.match()
+slug: Web/JavaScript/Reference/Global_Objects/String/match
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - RegExp
+  - Regular Expressions
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/match
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/match
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <strong><code>match()</code></strong> se usa para obtener todas las ocurrencias de una <em>expresión regular</em> dentro de una <em>cadena</em>.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.match(<em>regexp</em>)</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>regexp</code></dt>
+ <dd>Un objeto <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp"> expresión regular</a>. Si se pasa un objeto <code>obj</code> que no es expresión regular, se convierte implícitamente a RegExp usando <code>new RegExp(obj)</code>.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Si la expresión regular no incluye el flag <code>g</code>, devuelve el mismo resultado que {{jsxref("Regexp.exec()")}}.</p>
+
+<p>Si la expresión regular incluye el flag <code>g</code>, el método devuelve un {{jsxref("Array")}} que contiene todos los emparejamientos.</p>
+
+<h3 id="Notas" name="Notas">Notas</h3>
+
+<ul>
+ <li>Si necesita conocer si una cadena se empareja con una expresión regular <code>regexp</code>, use {{jsxref("Regexp.test()")}}.</li>
+ <li>Si sólo quiere el primer emparejamiento hallado, podría querer usar {{jsxref("Regexp.exec()")}} a cambio.</li>
+</ul>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_match" name="Ejemplo:_Usando_match">Ejemplo: Usando <code>match</code></h3>
+
+<p>En el siguiente ejemplo, se usa <code>match</code> para hallar "<code>Capítulo</code>" seguido de 1 o más caracteres numéricos seguidos de un punto decimal y caracteres numéricos cero o más veces. La expresión regular incluye el flag <code>i</code> por lo que las mayúsculas serán ignoradas.</p>
+
+<pre class="brush: js">cadena = "Para más información, vea Capítulo 3.4.5.1";
+expresion = /(capítulo \d+(\.\d)*)/i;
+hallado = cadena.match(expresion);
+console.log(hallado);
+</pre>
+
+<p>Esto devuelve un array que contiene Capítulo 3.4.5.1,Capítulo 3.4.5.1,.1</p>
+
+<p>"<code>Capítulo 3.4.5.1</code>" es el primer emparejamiento y el primer valor referenciado por <code>(Chapter \d+(\.\d)*)</code>.</p>
+
+<p>"<code>.1</code>" es el segundo valor referenciado por <code>(\.\d)</code>.</p>
+
+<h3 id="Ejemplo:_Usando_los_flags_global_e_ignorar_may.C3.BAsculas_con_match" name="Ejemplo:_Usando_los_flags_global_e_ignorar_may.C3.BAsculas_con_match">Ejemplo: Usando los flags global e ignorar mayúsculas con <code>match</code></h3>
+
+<p>El siguiente ejemplo demuestra el uso de los flags global e ignorar mayúsculas con <code>match</code>. Todas las letras de A hasta E y de a hasta e son devueltas, en su propio elemento dentro del array.</p>
+
+<pre class="brush: js">var cadena = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
+var expresion = /[A-E]/gi;
+var array_emparejamientos = cadena.match(expresion);
+console.log(array_emparejamientos);
+</pre>
+
+<p><code>array_emparejamientos</code> será <code>{{ mediawiki.external('\'A\', \'B\', \'C\', \'D\', \'E\', \'a\', \'b\', \'c\', \'d\', \'e\'') }}</code></p>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("RegExp.prototype.exec()")}}</li>
+ <li>{{jsxref("RegExp.prototype.test()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/matchall/index.html b/files/es/web/javascript/reference/global_objects/string/matchall/index.html
new file mode 100644
index 0000000000..309198bd7a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/matchall/index.html
@@ -0,0 +1,135 @@
+---
+title: String.prototype.matchAll()
+slug: Web/JavaScript/Reference/Global_Objects/String/matchAll
+tags:
+  - Cadena
+  - Expresiones Regulares
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/matchAll
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/matchAll
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>matchAll()</code></strong> retorna un iterador de todos los resultados de ocurrencia en una <em>cadena de texto</em> contra una expresión regular, incluyendo grupos de captura.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-matchall.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>cadena</var>.matchAll(<var>expresionRegular</var>)</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><var>expresionRegular</var></dt>
+ <dd>Un objeto expresión regular. Si se pasa un objeto no-RegExp <code>obj</code>, este es implícitamente convertido a {{jsxref("RegExp")}} vía <code>new RegExp(obj)</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un <a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">iterador</a> (el cual no es reiniciable).</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Regexp.exec()_y_matchAll()">Regexp.exec() y matchAll()</h3>
+
+<p>Antes de la adición de  <code>matchAll</code> a JavaScript, fue posible hacer llamados a <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec">regexp.exec</a> (y usar expresiones regulares con la bandera <code>/g</code>) en un ciclo para obtener las ocurrencias:</p>
+
+<pre class="brush: js">const regexp = RegExp('foo[a-z]*','g');
+const cadena = 'mesa football, foosball';
+let ocurrencia;
+
+while ((ocurrencia = regexp.exec(cadena)) !== null) {
+  console.log(`Encontrado ${ocurrencia[0]} inicio=${ocurrencia.index} final=${regexp.lastIndex}.`);
+  // salida esperada: "Encontrado football inicio=5 final=13."
+  // salida esperada: "Encontrado foosball inicio=15 final=23."
+}</pre>
+
+<p>Con <code>matchAll</code> disponible, puedes evitar el ciclo <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/while">while</a></code> y <code>exec</code> con <code>/g</code>. Por el contrario, usando <code>matchAll</code>, obtienes un iterador con el cual puedes usar con constructores más convenientes  <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></code>, <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax">array spread</a>, o {{jsxref("Array.from()")}}:</p>
+
+<pre class="brush: js">const regexp = RegExp('foo[a-z]*','g');
+const cadena = 'mesa football, foosball';
+const ocurrencias = cadena.matchAll(regexp);
+
+for (const ocurrencia of ocurrencias) {
+  console.log(`Encontrado ${ocurrencia[0]} inicio=${ocurrencia.index} final=${ocurrencia.index + ocurrencia[0].length}.`);
+}
+// salida esperada: "Encontrado football start=5 end=13."
+// salida esperada: "Encontrado foosball start=15 end=23."
+
+// el iterador ocurrencias es agotado después de la iteración for..of
+// Llama matchAll de nuevo para crear un nuevo iterador
+Array.from(cadena.matchAll(regexp), m =&gt; m[0]);
+// Array [ "football", "foosball" ]</pre>
+
+<p><code>matchAll</code> solo devuelve la primer ocurrencia si la bandera <code>/g</code> está ausente.</p>
+
+<pre class="brush: js">const regexp = RegExp('[a-c]','');
+const cadena = 'abc';
+Array.from(cadena.matchAll(regexp), m =&gt; m[0]);
+// Array [ "a" ]
+</pre>
+
+<p><code>matchAll</code> internamente hace un clon de la expresión regular, entonces a diferencia de <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec">regexp.exec</a>,  <code>lastIndex</code> no cambia a medida que la cadena es escaneada.</p>
+
+<pre class="brush: js">const regexp = RegExp('[a-c]','g');
+regexp.lastIndex = 1;
+const cadena = 'abc';
+Array.from(cadena.matchAll(regexp), m =&gt; `${regexp.lastIndex} ${m[0]}`);
+// Array [ "1 b", "1 c" ]</pre>
+
+<h3 id="Mejor_acceso_para_capturar_grupos">Mejor acceso para capturar grupos</h3>
+
+<p>Otra buena razón para <code>matchAll</code> es el mejorado acceso a los grupos de captura. Los grupos de captura son ignorados cuando se usa <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match">match()</a></code> con la bandera global <code>/g</code>:</p>
+
+<pre class="brush: js">var regexp = /t(e)(st(\d?))/g;
+var cadena = 'test1test2';
+
+cadena.match(regexp);
+// Array ['test1', 'test2']</pre>
+
+<p>Con <code>matchAll</code> puedes acceder a ellos:</p>
+
+<pre class="brush: js">let array = [...str.matchAll(regexp)];
+
+array[0];
+// ['test1', 'e', 'st1', '1', index: 0, input: 'test1test2', length: 4]
+array[1];
+// ['test2', 'e', 'st2', '2', index: 5, input: 'test1test2', length: 4]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.matchall', 'String.prototype.matchAll')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.matchAll")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("RegExp")}}</li>
+ <li>{{jsxref("RegExp.prototype.exec()")}}</li>
+ <li>{{jsxref("RegExp.prototype.test()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/normalize/index.html b/files/es/web/javascript/reference/global_objects/string/normalize/index.html
new file mode 100644
index 0000000000..ecff675bc3
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/normalize/index.html
@@ -0,0 +1,127 @@
+---
+title: String.prototype.normalize()
+slug: Web/JavaScript/Reference/Global_Objects/String/normalize
+tags:
+  - Cadena
+  - ECMAScript 2015
+  - JavaScript
+  - Prototipo
+  - Referencia
+  - String
+  - Unicode
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/normalize
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/normalize
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>normalize()</code></strong> retorna la Forma de Normalización Unicode de la cadena dada (si el valor no es una cadena, primero será convertido a ese tipo).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>str</var>.normalize([<var>form</var>])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>form</code></dt>
+ <dd>Uno de<code>"NFC"</code>, <code>"NFD"</code>, <code>"NFKC"</code>, o <code>"NFKD"</code>, especificando la Forma de Normalización Unicode. Si es omitida o {{jsxref("undefined")}}, se utiliza <code>"NFC"</code>.
+ <ul>
+  <li><code>NFC</code> — Forma de Normalización de Composición Canónica.</li>
+  <li><code>NFD</code> — Forma de Normalización de Descomposición Canónica.</li>
+  <li><code>NFKC</code> — Forma de Normalización de Composición de Compatibilidad.</li>
+  <li><code>NFKD</code> — Forma de Normalización de Descomposición de Compatibilidad.</li>
+ </ul>
+ </dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una cadena que contiene la Forma de Normalización Unicode de la cadena dada.</p>
+
+<h3 id="Errores_lanzados">Errores lanzados</h3>
+
+<dl>
+ <dt>{{jsxref("RangeError")}}</dt>
+ <dd>Un error {{jsxref("RangeError")}} es lanzado si <code>form</code> no es uno de los valores especificados arriba.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>normalize()</code> retorna la Forma de Normalización Unicode de una cadena. No afecta el valor de la cadena en sí misma.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Uso_de_normalize()">Uso de <code>normalize()</code></h3>
+
+<pre class="brush: js">// Cadena inicial
+
+// U+1E9B: LETRA S LATINA MINÚSCULA CON PUNTO ARRIBA
+// U+0323: COMBINACIÓN CON PUNTO ABAJO
+var str = '\u1E9B\u0323';
+
+
+// Forma compuesta canónicamente (NFC)
+
+// U+1E9B: LETRA S LATINA MINÚSCULA CON PUNTO ARRIBA
+// U+0323: COMBINACIÓN CON PUNTO ABAJO
+str.normalize('NFC'); // '\u1E9B\u0323'
+str.normalize();      // lo mismo que arriba
+
+
+// Forma canónicamente descompuesta (NFD)
+
+// U+017F: LETRA S LATINA MINÚSCULA
+// U+0323: COMBINACIÓN CON PUNTO ABAJO
+// U+0307: COMBINACIÓN CON PUNTO ARRIBA
+str.normalize('NFD'); // '\u017F\u0323\u0307'
+
+
+// Compuesta con compatibilidad (NFKC)
+
+// U+1E69: LETRA S LATINA MINÚSCULA CON PUNTO ARRIBA Y ABAJO
+str.normalize('NFKC'); // '\u1E69'
+
+
+// Descompuesta con compatibilidad (NFKD)
+
+// U+0073: LETRA S LATINA MINÚSCULA
+// U+0323: COMBINACIÓN CON PUNTO ABAJO
+// U+0307: COMBINACIÓN CON PUNTO ARRIBA
+str.normalize('NFKD'); // '\u0073\u0323\u0307'
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-string.prototype.normalize', 'String.prototype.normalize')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.normalize', 'String.prototype.normalize')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si quiere contribuir a estos datos, por favor hágalo utilizando éste repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.normalize")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="http://www.unicode.org/reports/tr15/">Anexo del Estándar Unicode #15, Formas de Normalización Unicode</a></li>
+ <li><a href="http://en.wikipedia.org/wiki/Unicode_equivalence">Equivalencia Unicode</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/padstart/index.html b/files/es/web/javascript/reference/global_objects/string/padstart/index.html
new file mode 100644
index 0000000000..34361d0e3f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/padstart/index.html
@@ -0,0 +1,101 @@
+---
+title: String.prototype.padStart()
+slug: Web/JavaScript/Reference/Global_Objects/String/padStart
+tags:
+  - Cadena
+  - Experimental
+  - JavaScript
+  - Método(2)
+  - Referencia
+translation_of: Web/JavaScript/Reference/Global_Objects/String/padStart
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/padStart
+---
+<div>{{JSRef}}{{SeeCompatTable}}</div>
+
+<p>El método <code><strong>padStart()</strong></code> rellena la cadena actual con una cadena dada (repetida eventualmente) de modo que la cadena resultante alcance una longitud dada. El relleno es aplicado desde el inicio (izquierda) de la cadena actual.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>str</var>.padStart(<var>targetLength</var> [, <var>padString</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>targetLength</code></dt>
+ <dd>La longitud de la cadena resultante una vez la cadena actual haya sido rellenada. Si este parámetro es más pequeño que la longitud de la cadena actual, la cadena actual será devuelta sin modificar.</dd>
+ <dt><code>padString</code> {{optional_inline}}</dt>
+ <dd>La cadena para rellenar la cadena actual. Si esta cadena es muy larga, será recortada y la parte más a la izquierda será aplicada. El valor por defecto para este parámetro es " " (U+0020).</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un {{jsxref("String")}} de la longitud específicada con la cadena de relleno aplicada desde el inicio.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">'abc'.padStart(10);         // "       abc"
+'abc'.padStart(10, "foo");  // "foofoofabc"
+'abc'.padStart(6,"123465"); // "123abc"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>Este método aún no ha alcanzado el estándar ECMAScript. Actualmente es una <a href="https://github.com/tc39/proposal-string-pad-start-end">propuesta para ECMAScript</a>.</p>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome("52")}} </td>
+   <td>{{CompatGeckoDesktop(48)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile(48)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.padEnd()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/raw/index.html b/files/es/web/javascript/reference/global_objects/string/raw/index.html
new file mode 100644
index 0000000000..fbdc195d5c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/raw/index.html
@@ -0,0 +1,113 @@
+---
+title: String.raw()
+slug: Web/JavaScript/Reference/Global_Objects/String/raw
+translation_of: Web/JavaScript/Reference/Global_Objects/String/raw
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/raw
+---
+<div>{{JSRef}}</div>
+
+<p>El método estatico <strong><code>String.raw()</code> </strong> es una función de <a href="/en-US/docs/Web/JavaScript/Reference/template_strings"> plantilla de literales</a>, similar al prefijo <code>r</code> en Python o al prefijo <code>@</code> en C# para strings literales (con ciertas diferencias: ver la explicación en <a href="https://bugs.chromium.org/p/v8/issues/detail?id=5016">este problema</a>). Se utiliza para obtener un <em>string</em> crudo a partir de plantillas de <em>string</em> (es decir, el original, texto no interpretado).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>String.raw(<var>callSite</var>, <var>...substitutions</var>)
+
+String.raw`templateString`
+</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>callSite</code></dt>
+ <dd>Plantilla bien estructurada, similar a <code>{ raw: ['foo', 'bar', 'baz'] }</code>.</dd>
+ <dt><code>...substitutions</code></dt>
+ <dd>Contiene valores de sustitución.</dd>
+ <dt><code>templateString</code></dt>
+ <dd>[opcional] Una <a href="/en-US/docs/Web/JavaScript/Reference/template_strings">plantilla <em>string</em></a>, con sustituciones (<code>${...}</code>).</dd>
+</dl>
+
+<h3 id="Valor_de_regreso">Valor de regreso</h3>
+
+<p>La forma cruda del <em>string </em>de una plantilla <em>string </em>proporcionada.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<dl>
+ <dt>{{jsxref("TypeError")}}</dt>
+ <dd>Un {{jsxref("TypeError")}} es arrojado si el primer argumento no es un objeto bien estructurado.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>En la mayoría de los casos, <code>String.raw()</code> es usado con plantillas <em>string</em>. La primera sintaxis mencionada arriba es raramente usada,  porque el motor de JavaScript hará la llamada por ti con los argumentos apropiados, al igual que otras <a href="/en-US/docs/Web/JavaScript/Reference/template_strings#Tagged_template_literals">funciones de etiqueta</a>.</p>
+
+<p><code>String.raw()</code> es la unica función de etiqueta incorporada en las plantillas <em>string</em>; trabaja igual que la función de la plantilla por defecto y ejecuta la concatenación. Incluso puedes reimplementarlo con código normal de JavaScript.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_String.raw()">Usando <code>String.raw()</code></h3>
+
+<pre class="brush: js">String.raw`Hi\n${2+3}!`;
+// 'Hi\n5!', the character after 'Hi'
+// is not a newline character,
+// '\' and 'n' are two characters.
+
+String.raw`Hi\u000A!`;
+// 'Hi\u000A!', same here, this time we will get the
+//  \, u, 0, 0, 0, A, 6 characters.
+// All kinds of escape characters will be ineffective
+// and backslashes will be present in the output string.
+// You can confirm this by checking the .length property
+// of the string.
+
+let name = 'Bob';
+String.raw`Hi\n${name}!`;
+// 'Hi\nBob!', substitutions are processed.
+
+// Normally you would not call String.raw() as a function,
+// but to simulate `t${0}e${1}s${2}t` you can do:
+String.raw({ raw: 'test' }, 0, 1, 2); // 't0e1s2t'
+// Note that 'test', a string, is an array-like object
+// The following is equivalent to
+// `foo${2 + 3}bar${'Java' + 'Script'}baz`
+String.raw({
+  raw: ['foo', 'bar', 'baz']
+}, 2 + 3, 'Java' + 'Script'); // 'foo5barJavaScriptbaz'
+
+</pre>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-string.raw', 'String.raw')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definicion inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.raw', 'String.raw')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.raw")}}</p>
+
+<h2 id="Tambien_ver">Tambien ver</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/template_strings">Template strings</a></li>
+ <li>{{jsxref("String")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Lexical grammar</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/repeat/index.html b/files/es/web/javascript/reference/global_objects/string/repeat/index.html
new file mode 100644
index 0000000000..239fe52fbe
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/repeat/index.html
@@ -0,0 +1,129 @@
+---
+title: String.prototype.repeat()
+slug: Web/JavaScript/Reference/Global_Objects/String/repeat
+tags:
+  - ECMAScript2015
+  - JavaScript
+  - Prototype
+  - Referencia
+  - String
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/repeat
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/repeat
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>repeat()</code></strong> construye y devuelve una nueva cadena que contiene el número especificado de copias de la cadena en la cual fue llamada, concatenados.</p>
+
+<h2 id="Sintáxis">Sintáxis</h2>
+
+<pre class="syntaxbox"><code><var>str</var>.repeat(<var>count</var>)</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>count</code></dt>
+ <dd>Un entero entre 0 y +∞: [0, +∞), indicando el número de veces a repetir la cadena en la nueva cadenada creada que será devuelta.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Un nuevo string que contiene el número especificado de copias del string original.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<ul>
+ <li>{{jsxref("Errors/Negative_repetition_count", "RangeError")}}: El número de repeticiones no debe ser negativo.</li>
+ <li>{{jsxref("Errors/Resulting_string_too_large", "RangeError")}}: El número de repeticiones debe ser menor que infinito y no desbordar el tamaño máximo para un string.</li>
+</ul>
+
+<dl>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">'abc'.repeat(-1);   // RangeError
+'abc'.repeat(0);    // ''
+'abc'.repeat(1);    // 'abc'
+'abc'.repeat(2);    // 'abcabc'
+'abc'.repeat(3.5);  // 'abcabcabc' (count will be converted to integer)
+'abc'.repeat(1/0);  // RangeError
+
+({ toString: () =&gt; 'abc', repeat: String.prototype.repeat }).repeat(2);
+// 'abcabc' (repeat() is a generic method)
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este método ha sido añadido a la especificación ECMAScript 6 y tal vez aún no se encuentre disponible en todas las implementaciones de JavaScript. Sin embargo, usted puede establecer <code>String.prototype.repeat()</code> con el siguiente fragmento de código:</p>
+
+<pre class="brush: js">if (!String.prototype.repeat) {
+  String.prototype.repeat = function(count) {
+    'use strict';
+    if (this == null) {
+      throw new TypeError('can\'t convert ' + this + ' to object');
+    }
+    var str = '' + this;
+    count = +count;
+    if (count != count) {
+      count = 0;
+    }
+    if (count &lt; 0) {
+      throw new RangeError('repeat count must be non-negative');
+    }
+    if (count == Infinity) {
+      throw new RangeError('repeat count must be less than infinity');
+    }
+    count = Math.floor(count);
+    if (str.length == 0 || count == 0) {
+      return '';
+    }
+    // Ensuring count is a 31-bit integer allows us to heavily optimize the
+    // main part. But anyway, most current (August 2014) browsers can't handle
+    // strings 1 &lt;&lt; 28 chars or longer, so:
+    if (str.length * count &gt;= 1 &lt;&lt; 28) {
+      throw new RangeError('repeat count must not overflow maximum string size');
+    }
+    var rpt = '';
+    for (;;) {
+      if ((count &amp; 1) == 1) {
+        rpt += str;
+      }
+      count &gt;&gt;&gt;= 1;
+      if (count == 0) {
+        break;
+      }
+      str += str;
+    }
+    return rpt;
+  }
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<div>{{Compat("javascript.builtins.String.repeat")}}</div>
+
+<div id="compat-mobile"> </div>
diff --git a/files/es/web/javascript/reference/global_objects/string/replace/index.html b/files/es/web/javascript/reference/global_objects/string/replace/index.html
new file mode 100644
index 0000000000..83d77434f8
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/replace/index.html
@@ -0,0 +1,203 @@
+---
+title: String.prototype.replace()
+slug: Web/JavaScript/Reference/Global_Objects/String/replace
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - Regular Expressions
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/replace
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/replace
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p><span class="seoSummary">El método <strong><code>replace()</code></strong> devuelve una nueva cadena con algunas o todas las coincidencias de un <code>patrón</code>, siendo cada una de estas coincidencias reemplazadas por <code>remplazo</code></span>. El <code>patrón</code> puede ser una cadena o una {{jsxref("RegExp")}}, y el <code>reemplazo</code> puede ser una cadena o una función que será llamada para cada coincidencia. Si el <code>patrón</code> es una cadena, sólo la primera coincidencia será reemplazada.</p>
+
+<p>La cadena original permanecerá inalterada.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-replace.html")}}</div>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="eval"><code class="language-html"><em>cadena</em>.replace(regexp|substr, newSubStr|function[, </code>{{ Non-standard_inline() }} <code class="language-html">flags]);</code>
+</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>expresionregular</code></dt>
+ <dd>Un objeto {{jsxref("RegExp")}} o literal. Las coincidencias son reemplazadas por <code class="language-html">ewSubSt</code> o el valor devuelto por la función especificada.</dd>
+</dl>
+
+<dl>
+ <dt><code>subcadena</code></dt>
+ <dd>Un objeto {{jsxref("String")}} que será reemplazado por <code>nuevaSubcadena</code>.</dd>
+</dl>
+
+<dl>
+ <dt><code>nuevaSubcadena</code></dt>
+ <dd>El objeto {{jsxref("String")}} que reemplaza la subcadena que recibida desde el primer parámetro.</dd>
+</dl>
+
+<dl>
+ <dt><code>funcion</code></dt>
+ <dd>Una función que será invocada para crear la nueva subcadena (para ponerla en lugar de la subcadena recibida por el primer parámetro).</dd>
+</dl>
+
+<dl>
+ <dt><code>flags</code> {{ non-standard_inline() }}</dt>
+ <dd>Un objeto {{jsxref("String")}} que contiene cualquier combinación de flags de la clase RegExp: <code>g</code> - emparejamiento global, <code>i</code> - ignorar mayúsculas, <code>m</code> - emparejar multiples líneas. Este parámetro se usa sólo si el primer parámetro es una cadena.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Este método no cambia el objeto <code>String</code> sobre el que se realiza la llamada. Simplemente devuelve una nueva cadena.</p>
+
+<p>Para realizar una búsqueda global y reemplazarla, o se incluye el flag <code>g</code> en la expresión regular o si el primer parámetro es una cadena, se incluye <code>g</code> en el parámetro <code>flags</code>.</p>
+
+<h4 id="Especificando_una_cadena_como_un_par.C3.A1metro" name="Especificando_una_cadena_como_un_par.C3.A1metro">Especificando una cadena como un parámetro</h4>
+
+<p>La cadena de reemplazo puede incluir los siguientes patrones de reemplazo especiales:</p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <td class="header">Patrón</td>
+   <td class="header">Inserta</td>
+  </tr>
+  <tr>
+   <td><code>$$</code></td>
+   <td>Inserta una "$".</td>
+  </tr>
+  <tr>
+   <td><code>$&amp;</code></td>
+   <td>Inserta la subcadena emparejada.</td>
+  </tr>
+  <tr>
+   <td><code>$`</code></td>
+   <td>Inserta la sección de cadena que precede a la subcadena emparejada.</td>
+  </tr>
+  <tr>
+   <td><code>$'</code></td>
+   <td>Inserta la porción de subcadena que sigue a la subcadena emparejada.</td>
+  </tr>
+  <tr>
+   <td style="white-space: nowrap;"><code>$<em>n</em> </code> o <code>$<em>nn</em> </code></td>
+   <td>Donde <code><em>n</em> </code> o <code><em>nn</em> </code> son dígitos decimales positivos menores a 100, inserta la subcadena emparejada de orden <em>n</em> del paréntesis, proporcionado por el primer argumento del objeto <code>RegExp</code>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Especificando_una_funci.C3.B3n_con_un_par.C3.A1metro" name="Especificando_una_funci.C3.B3n_con_un_par.C3.A1metro">Especificando una función con un parámetro</h3>
+
+<p>Cuando se especifica una función en el segundo parámetro, la función es invocada después de que el emparejamiento se haya realizado. (El uso de una función de este modo se llama expresión lambda.)</p>
+
+<p>En la función, puedes generar dinámicamente la cadena que reemplaza la subcadena emparejada. El resultado de la llamada de la función se usa como valor de reemplazo.</p>
+
+<p>The nested function can use the matched substrings to determine the new string (<code>newSubStr</code>) that replaces the found substring. You get the matched substrings through the parameters of your function. The first parameter of your function holds the complete matched substring. If the first argument was a <code>RegExp</code> object, then the following<em>n</em> parameters can be used for parenthetical matches, remembered submatch strings, where<em>n</em> is the number of submatch strings in the regular expression. Finally, the last two parameters are the offset within the string where the match occurred and the string itself. For example, the following <code>replace</code> method returns XXzzzz - XX , zzzz.</p>
+
+<pre class="brush: js">function replacer(str, p1, p2, offset, s)
+{
+  return str + " - " + p1 + " , " + p2;
+}
+var newString = "XXzzzz".replace(/(X*)(z*)/, replacer);
+console.log(newString); // XXzzzz - XX , zzzz
+</pre>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Using_global_and_ignore_with_replace" name="Ejemplo:_Using_global_and_ignore_with_replace">Ejemplo: Usando <code>global</code> e <code>ignore</code> con <code>replace</code></h3>
+
+<p>En el siguiente ejemplo, la expresión regular incluye las banderas "global" e "ignore case", las cuales permiten al método <code>replace</code> reemplazar cada aparición de la cadena 'apples' por la cadena 'oranges'.</p>
+
+<pre class="eval">var re = /apples/gi;
+var str = "Apples are round, and apples are juicy.";
+var newstr = str.replace(re, "oranges");
+print(newstr);
+</pre>
+
+<p>In this version, a string is used as the first parameter and the global and ignore case flags are specified in the <code>flags</code> parameter.</p>
+
+<pre class="eval">var str = "Apples are round, and apples are juicy.";
+var newstr = str.replace("apples", "oranges", "gi");
+print(newstr);
+</pre>
+
+<p>Both of these examples print "oranges are round, and oranges are juicy."</p>
+
+<h3 id="Ejemplo_Definiendo_la_expresi.C3.B3n_regular_en_replace" name="Ejemplo:_Definiendo_la_expresi.C3.B3n_regular_en_replace">Ejemplo: Definiendo la expresión regular en <code>replace</code></h3>
+
+<p>En el siguiente ejemplo, se define la expresión regular en <code>replace</code> e incluye el flag de ignorar mayúsculas.</p>
+
+<pre class="eval">var cadena = "Twas the night before Xmas...";
+var nuevaCadena = cadena.replace(/xmas/i, "Christmas");
+print(nuevaCadena);
+</pre>
+
+<p>Esto muestra "Twas the night before Christmas..."</p>
+
+<h3 id="Ejemplo_Conectando_palabras_en_una_cadena" name="Ejemplo:_Conectando_palabras_en_una_cadena">Ejemplo: Conectando palabras en una cadena</h3>
+
+<p>El siguiente código conecta las palabras dentro de la cadena. Para reemplazar el texto, el código usa <code>$1</code> y <code>$2</code> como patrones de reemplazo.</p>
+
+<pre class="eval">var expresion = /(\w+)\s(\w+)/;
+var cadena = "John Smith";
+var nuevaCadena = cadena.replace(expresion, "$2, $1");
+print(nuevaCadena);
+</pre>
+
+<p>Esto muestra "Smith, John".</p>
+
+<h3 id="Ejemplo_Using_an_inline_function_that_modifies_the_matched_characters" name="Ejemplo:_Using_an_inline_function_that_modifies_the_matched_characters">Ejemplo: Using an inline function that modifies the matched characters</h3>
+
+<p>In this example, all occurrences of capital letters in the string are converted to lower case, and a hyphen is inserted just before the match location. The important thing here is that additional operations are needed on the matched item before it is given back as a replacement.</p>
+
+<p>The replacement function accepts the matched snippet as its parameter, and uses it to transform the case and concatenate the hyphen before returning.</p>
+
+<pre class="brush: js">function styleHyphenFormat(propertyName)
+{
+  function upperToHyphenLower(match)
+  {
+    return '-' + match.toLowerCase();
+  }
+  return propertyName.replace(/[A-Z]/, upperToHyphenLower);
+}
+</pre>
+
+<p>Given <code>styleHyphenFormat('borderTop')</code>, this returns 'border-top'.</p>
+
+<p>Because we want to further transform the<em>result</em> of the match before the final substitution is made, we must use a function. This forces the evaluation of the match prior to the <code>toLowerCase()</code> method. If we had tried to do this using the match without a function, the toLowerCase() would have no effect.</p>
+
+<pre class="brush: js">var newString = propertyName.replace(/[A-Z]/, '-' + '$&amp;'.toLowerCase());  // won't work
+</pre>
+
+<p>This is because <code>'$&amp;'.toLowerCase()</code> would be evaluated first as a string literal (resulting in the same <code>'$&amp;'</code>) before using the characters as a pattern.</p>
+
+<h3 id="Ejemplo_Reemplazando_grandos_Fahrenheit_con_su_equivalente_Celsius" name="Ejemplo:_Reemplazando_grandos_Fahrenheit_con_su_equivalente_Celsius">Ejemplo: Reemplazando grados Fahrenheit con su equivalente Celsius</h3>
+
+<p>El siguiente ejemplo reemplaza los grados Fahrenheit con su enquivalente en grados Celsius. Los grados Fahrenheit deberían ser un número acabado en F. La función devuelve el número Celsius acabado en C. Por ejemplo, si el número de entrada es 212F, la función devuelve 100C. Si el número es 0F, la función devuelve -17.77777777777778C.</p>
+
+<p>La expresión regular <code>test</code> revisa si para un número termina en F. El número de grados Fahrenheit es accesible a la función a través de su segundo parámetro, <code>p1</code>. La función establece el número Celsius basado en los grados Fahrenheit pasados en una cadena a la función <code>f2c</code>. Entonces <code>f2c</code> devuelve el número Celsius. Esta función aproxima al flag de Perl s///e.</p>
+
+<pre class="brush: js">function f2c(x)
+{
+  function convert(str, p1, offset, s)
+  {
+    return ((p1-32) * 5/9) + "C";
+  }
+  var s = String(x);
+  var test = /(\d+(?:\.\d*)?)F\b/g;
+  return s.replace(test, convert);
+}
+</pre>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.match()")}}</li>
+ <li>{{jsxref("RegExp.prototype.exec()")}}</li>
+ <li>{{jsxref("RegExp.prototype.test()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/search/index.html b/files/es/web/javascript/reference/global_objects/string/search/index.html
new file mode 100644
index 0000000000..b1217f65cd
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/search/index.html
@@ -0,0 +1,154 @@
+---
+title: String.prototype.search()
+slug: Web/JavaScript/Reference/Global_Objects/String/search
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - Reference
+  - Regular Expressions
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/search
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/search
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <code><strong>search() </strong></code>ejecuta una búsqueda que encaje entre una expresión regular y el objeto <code>String</code> desde el que se llama.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>str</em>.search(<em>expresionregular</em>)</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt>regexp</dt>
+ <dd>Un objeto <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp"> expresión regular</a>. Si se pasa un objeto <code>obj </code>que no sea una expresión regular, se convierte implicitamente en una expresión regualar usando <code>new RegExp(obj)</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El índice de la primera coincidencia entre la expresión regular y la cadena de texto proporcionada, si no se encuentra devuelve <strong>-1</strong>.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Cuando se desee saber en qué casos un patrón se encuentra en una cadena de texto utiliza <code>search()</code> (si sólo deseas saber si existe, utiliza el método {{jsxref("RegExp.prototype.test()", "test()")}} del prototipo de <code>RegExp</code>); para más información (pero de ejecución más lenta) utiliza {{jsxref("String.prototype.match()", "match()")}} (similar al método {{jsxref("RegExp.prototype.exec()", "exec()")}} de las expresiones regulares).</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_search" name="Example:_Using_search">Utilizando <code>search()</code></h3>
+
+<p>El siguiente ejemplo imprime un mensaje dependiendo de cuál sea el resultado de la evaluación.</p>
+
+<pre class="brush: js">function testinput(re, str) {
+  var midstring;
+  if (str.search(re) != -1) {
+    midstring = ' contains ';
+  } else {
+    midstring = ' does not contain ';
+  }
+  console.log(str + midstring + re);
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.12', 'String.prototype.search')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.search', 'String.prototype.search')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.search', 'String.prototype.search')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_específicas_de_Gecko">Notas específicas de Gecko</h2>
+
+<ul>
+ <li>Antes de {{Gecko("8.0")}}, <code>search()</code> estaba mal implementado; cuando se invocaba sin parámetros o con {{jsxref("undefined")}}, buscaría coincidencias con la cadena 'undefined' en lugar de la cadena vacía. Esto está corregido; ahora <code>'a'.search()</code> y <code>'a'.search(undefined)</code> devuelven correctamente un 0.</li>
+ <li>Desde Gecko 39 {{geckoRelease(39)}}, el argumento no estándar <code>flags </code>está obsoleto y muestra un aviso en la consola ({{bug(1142351)}}).</li>
+ <li>Desde Gecko 47 {{geckoRelease(47)}}, el argumento no estándar <code>flags</code> no es soportado en compilaciones que no sean lanzamientos y pronto serán eliminadas por completo ({{bug(1245801)}}).</li>
+ <li>Desde Gecko 49 {{geckoRelease(49)}}, el argumento no estándar <code>flags </code>no es soportado ({{bug(1108382)}}).</li>
+</ul>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.match()")}}</li>
+ <li>{{jsxref("RegExp.prototype.exec()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/slice/index.html b/files/es/web/javascript/reference/global_objects/string/slice/index.html
new file mode 100644
index 0000000000..b8d637f57b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/slice/index.html
@@ -0,0 +1,162 @@
+---
+title: String.prototype.slice()
+slug: Web/JavaScript/Reference/Global_Objects/String/slice
+tags:
+  - Cadena
+  - JavaScript
+  - Método(2)
+  - Prototipo
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/slice
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/slice
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <strong><code>slice()</code></strong> extrae una sección de una cadena y devuelve una cadena nueva.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="eval"><code class="language-html"><em>cadena</em>.slice(<em>inicioTrozo</em>[, <em>finTrozo</em>])</code>
+</pre>
+
+<h3 id="Parameters" name="Parameters">Parameters</h3>
+
+<dl>
+ <dt><code>inicioTrozo</code></dt>
+ <dd>El índice basado en cero en el cual empieza la extracción.  Si es negativo, se trata como <code>longCadena + inicioTrozo</code> donde <code>longCadena</code> es la longitud de la cadena (por ejemplo, si <code>inicioTrozo</code> es <code>-3</code> se trata como <code>longCadena - 3</code>)</dd>
+</dl>
+
+<dl>
+ <dt><code>finTrozo</code></dt>
+ <dd>Opcional. El índice basado en cero en el que termina la extracción. Si se omite, <code>slice</code> extrae hasta el final de la cadena.  Si es negativo, se trata como <code>longCadena + finTrozo</code> donde <code>longCadena</code> es la longitud de la cadena (por ejemplo, si <code>finTrozo </code>es <code>-3</code> se trata como <code>longCadena - 3</code>).</dd>
+</dl>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Una nueva cadena que contiene la sección de la cadena.</p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>slice</code> extrae el texto de una cadena y devuelve una nueva cadena. Los cambios en el texto de una cadena no afectan a la otra cadena.</p>
+
+<p><code>slice</code> extrae hasta, pero sin incluir <code>finalTrozo</code>. <code>string.slice(1,4)</code> extrae del segundo carácter hasta el cuarto carácter (caracteres con índice 1, 2 y 3).</p>
+
+<p>Si se usa un índice negativo, finalTrozo indica el punto desde el final de la cadena.string.slice(2, -1) extrae desde tercer carácter hasta el último carácter de la cadena.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_slice_para_crear_una_nueva_cadena" name="Ejemplo:_Usando_slice_para_crear_una_nueva_cadena">Ejemplo: Uso de <code>slice()</code> para crear una nueva cadena</h3>
+
+<p>El siguiente ejemplo usa <code>slice()</code> para crear una nueva cadena.</p>
+
+<pre class="brush: js">var cadena1 = "La mañana se nos echa encima.";
+var cadena2 = cadena1.slice(3, -2);
+console.log(cadena2);
+</pre>
+
+<p>Esto escribe:</p>
+
+<pre class="eval">mañana se nos echa encim</pre>
+
+<h3 id="Uso_de_slice()_con_índices_negativos">Uso de <code>slice()</code> con índices negativos</h3>
+
+<p>El siguiente ejemplo usa <code>slice()</code> con índices negativos.</p>
+
+<pre>var cad = "La mañana se nos echa encima.";<code>
+cad.slice(-3);     // retorna 'ma.'
+cad.slice(-3, -1); // retorna 'ma'
+cad.slice(0, -1);  // retorna 'La mañana se nos echa encima'</code></pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.13', 'String.prototype.slice')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.slice', 'String.prototype.slice')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.slice', 'String.prototype.slice')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.substr()")}}</li>
+ <li>{{jsxref("String.prototype.substring()")}}</li>
+ <li>{{jsxref("Array.prototype.slice()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/small/index.html b/files/es/web/javascript/reference/global_objects/string/small/index.html
new file mode 100644
index 0000000000..4f31bd7a2b
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/small/index.html
@@ -0,0 +1,39 @@
+---
+title: String.prototype.small()
+slug: Web/JavaScript/Reference/Global_Objects/String/small
+tags:
+  - Deprecated
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/small
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/small
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<p>{{deprecated_header}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Causa que una cadena se muestra con una fuente pequeña, como si estuviese dentro de una etiqueta {{HTMLElement("small")}}.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox"><em>cadena</em>.small()</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Usa el método <code>small</code> para formatear y mostrar una cadena en un documento.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_tama.C3.B1o_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_tama.C3.B1o_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el tamaño de una cadena</h3>
+<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
+
+console.log(cadenaMundo.small())
+console.log(cadenaMundo.big())
+console.log(cadenaMundo.fontsize(7))
+</pre>
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+<pre class="brush: html">&lt;small&gt;¡Hola mundo!&lt;/small&gt;
+&lt;big&gt;¡Hola mundo!&lt;/big&gt;
+&lt;fontsize=7&gt;¡Hola mundo!&lt;/fontsize&gt;
+</pre>
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+<ul>
+ <li>{{jsxref("String.prototype.fontsize()")}}</li>
+ <li>{{jsxref("String.prototype.big()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/split/index.html b/files/es/web/javascript/reference/global_objects/string/split/index.html
new file mode 100644
index 0000000000..d9e7ee5b92
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/split/index.html
@@ -0,0 +1,241 @@
+---
+title: String.prototype.split()
+slug: Web/JavaScript/Reference/Global_Objects/String/split
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - Regular Expressions
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/split
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/split
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<p>El método <strong><code>split()</code></strong> divide un objeto de tipo <code>String</code> en un array (vector) de cadenas mediante la separación de la cadena en subcadenas.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.split([<em>separador</em>][,<em>limite</em>])</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>separador</code></dt>
+ <dd>Especifica el carácter a usar para la separación de la cadena. El <code>separador</code> es tratado como una cadena o como una <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp"> </a>{{jsxref("Objetos_globales/RegExp", "expresión regular", "", 1)}}. Si se omite el <code>separador</code>, el array devuelto contendrá un sólo elemento con la cadena completa.</dd>
+</dl>
+
+<dl>
+ <dt><code>limite</code></dt>
+ <dd>Opcional. Entero que especifica un límite sobre el número de divisiones a realizar. El método <code>split()</code> todavía se divide en todas las concordancias del <code>separador</code>, pero divide la matriz devuelta en la cantidad de elementos impuesta por el <code>limite</code>.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>El método <code>split()</code> devuelve el nuevo array.</p>
+
+<p>Cuando se encuentra, el <code>separador</code> es eliminado de la cadena y las subcadenas obtenidas se devuelven en un array. Si el <code>separador</code> no es encontrado o se omite, el array contendrá un único elemento con la cadena original completa. Si el <code>separador</code> es una cadena vacía la cadena es convertida en un array de carácteres.</p>
+
+<p>Si el <code>separador</code> es una expresión regular que contiene paréntesis de captura, entonces cada vez que el <code>separador</code> concuerda, los resultados (incluído cualquier resultado indefinido) de los paréntesis de captura son divididos en el array resultante. Sin embargo no todos los navegadores soportan esta característica.</p>
+
+<p>{{Note("Cuando la cadena está vacía, <code>split()</code> devuelve un array que contiene una cadena vacía, en lugar de un array vacío.")}}</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_split" name="Ejemplo:_Usando_split">Usando <code>split()</code></h3>
+
+<p>El siguiente ejemplo define una función que divide una cadena en un array de cadenas usando el separador especificado. Después de la división de la cadena, la función muestra mensajes indicando la cadena original (antes de la división), el separador usado, el número de elementos del array y los elementos individuales del array.</p>
+
+<pre class="brush: js">function dividirCadena(cadenaADividir,separador) {
+   var arrayDeCadenas = cadenaADividir.split(separador);
+   document.write('&lt;p&gt;La cadena original es: "' + cadenaADividir + '"');
+   document.write('&lt;br&gt;El separador es: "' + separador + '"');
+   document.write("&lt;br&gt;El array tiene " + arrayDeCadenas.length + " elementos: ");
+
+   for (var i=0; i &lt; arrayDeCadenas.length; i++) {
+      document.write(arrayDeCadenas[i] + " / ");
+   }
+}
+
+var cadenaVerso = "Oh brave new world that has such people in it.";
+var cadenaMeses = "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec";
+
+var espacio = " ";
+var coma = ",";
+
+dividirCadena(cadenaVerso, espacio);
+dividirCadena(cadenaVerso);
+dividirCadena(cadenaMeses, coma);
+</pre>
+
+<p>Este ejemplo produce el siguiente resultado:</p>
+
+<pre>La cadena original es: "Oh brave new world that has such people in it."
+El separador es: " "
+El array tiene 10 elementos: Oh / brave / new / world / that / has / such / people / in / it. /
+
+La cadena original es: "Oh brave new world that has such people in it."
+El separador es: "undefined"
+El array tiene 1 elementos: Oh brave new world that has such people in it. /
+
+La cadena original es: "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec"
+El separador es: ","
+El array tiene 12 elementos: Jan / Feb / Mar / Apr / May / Jun / Jul / Aug / Sep / Oct / Nov / Dec /
+</pre>
+
+<h3 id="Ejemplo:_Eliminar_espacios_de_una_cadena" name="Ejemplo:_Eliminar_espacios_de_una_cadena">Eliminar espacios de una cadena</h3>
+
+<p>En el siguiente ejemplo, <code>split</code> busca 0 o más espacios seguidos de un punto y coma seguido por 0 o más espacios y, cuando los halla, elimina los espacios de la cadena. <code>listaNombres</code> es el array devuelto como resultado de la llamada a <code>split</code>.</p>
+
+<pre class="brush: js">var nombres = "Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand ";
+document.write(nombres + "&lt;br&gt;" + "&lt;br&gt;");
+var expresionRegular = /\s*;\s*/;
+var listaNombres = nombres.split(expresionRegular);
+document.write(listaNombres);
+</pre>
+
+<p>Esto imprime dos líneas; la primera línea imprime la cadena original, y la segunda línea imprime el array resultante.</p>
+
+<pre>Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand
+Harry Trump,Fred Barney,Helen Rigby,Bill Abel,Chris Hand
+</pre>
+
+<h3 id="Ejemplo:_Devolviendo_un_n.C3.BAmero_limitado_de_divisiones" name="Ejemplo:_Devolviendo_un_n.C3.BAmero_limitado_de_divisiones">Devolviendo un número limitado de divisiones</h3>
+
+<p>El el siguiente ejemplo, <code>split</code> busca 0 o más espacios en una cadena y devuelve las tres primeras divisiones que encuentra.</p>
+
+<pre class="brush: js">var miCadena = "Hola Mundo. Cómo estás hoy?";
+var divisiones = miCadena.split(" ", 3);
+
+print(divisiones);
+</pre>
+
+<p>Este script muestra lo siguiente:</p>
+
+<pre>Hola,Mundo.,Cómo
+</pre>
+
+<h3 id="Paréntesis_de_captura" style="font-size: 1.71428571428571rem;">Paréntesis de captura</h3>
+
+<p>Si el separador contiene paréntesis de capturaI los resultados que concuerden son devueltos en el array.</p>
+
+<pre class="brush: js  language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> miCadena <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">'Hola 1 mundo. Oración número 2.'</span><span class="punctuation token" style="color: #999999;">;</span>
+<span class="keyword token" style="color: #0077aa;">var</span> division <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> miCadena<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">split<span class="punctuation token" style="color: #999999;">(</span></span><span class="regex token" style="color: #ee9900;">/(\d)/</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span>
+
+console<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">log<span class="punctuation token" style="color: #999999;">(</span></span>division<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 57px; background: 0px 0px;"> </div>
+
+<p>Este script muestra lo siguiente:</p>
+
+<pre class="language-html" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;">Hola ,1, mundo. Oración número ,2,.</code></pre>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div>
+
+<h3 id="Dar_la_vuelta_a_una_cadena_usando_split()" style="font-size: 1.71428571428571rem;">Dar la vuelta a una cadena usando <code>split()</code></h3>
+
+<pre class="brush: js  language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> str <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">'asdfghjkl'</span><span class="punctuation token" style="color: #999999;">;</span>
+<span class="keyword token" style="color: #0077aa;">var</span> strReverse <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> str<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">split<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">''</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">reverse<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">join<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">''</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090;"> // 'lkjhgfdsa'
+</span><span class="comment token" style="color: #708090;">// split() retorna un array en el cual reverse() y join() pueden ser aplicados</span></code></pre>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div>
+
+<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div>
+
+<p><strong>Extra:</strong> usar el operador <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Identity_.2F_strict_equality_(.3D.3D.3D)">===</a> para verificar si la cadena anterior era un palíndromo.</p>
+
+<h2 id="Specifications" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 3rd Edition.</td>
+   <td>Estándar</td>
+   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.14', 'String.prototype.split')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.split', 'String.prototype.split')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_los_navegadores" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">Compatibilidad con los navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table" style="border-color: transparent;">
+ <tbody>
+  <tr>
+   <th style="line-height: 16px;">Característica</th>
+   <th style="line-height: 16px;">Chrome</th>
+   <th style="line-height: 16px;">Firefox (Gecko)</th>
+   <th style="line-height: 16px;">Internet Explorer</th>
+   <th style="line-height: 16px;">Opera</th>
+   <th style="line-height: 16px;">Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table" style="border-color: transparent;">
+ <tbody>
+  <tr>
+   <th style="line-height: 16px;">Característica</th>
+   <th style="line-height: 16px;">Android</th>
+   <th style="line-height: 16px;">Chrome for Android</th>
+   <th style="line-height: 16px;">Firefox Mobile (Gecko)</th>
+   <th style="line-height: 16px;">IE Mobile</th>
+   <th style="line-height: 16px;">Opera Mobile</th>
+   <th style="line-height: 16px;">Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.charAt()")}}</li>
+ <li>{{jsxref("String.prototype.indexOf()")}}</li>
+ <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
+ <li>{{jsxref("Array.prototype.join()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/startswith/index.html b/files/es/web/javascript/reference/global_objects/string/startswith/index.html
new file mode 100644
index 0000000000..338a9170d9
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/startswith/index.html
@@ -0,0 +1,98 @@
+---
+title: String.prototype.startsWith()
+slug: Web/JavaScript/Reference/Global_Objects/String/startsWith
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Method
+  - Prototipo
+  - Prototype
+  - Reference
+  - Referencia
+  - String
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/startsWith
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/startsWith
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>startsWith()</code></strong> indica si una cadena de texto comienza con los caracteres de una cadena de texto concreta, devolviendo <code>true</code> o <code>false</code> según corresponda.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-startswith.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><var>str</var>.startsWith(<var>stringBuscada</var>[, <var>posicion</var>])</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>stringBuscada</var></code></dt>
+ <dd>Los caracteres a ser buscados al inicio de la cadena de texto.</dd>
+ <dt><code><var>posicion</var></code> {{optional_inline}}</dt>
+ <dd>La posición de <code><em>str</em></code> en la cual debe comenzar la búsqueda de <code>stringBuscada</code>. El valor por defecto es <code>0</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p><strong><code>true</code></strong> si los caracteres dados se encuentran al inicio de la cadena de texto; <strong><code>false</code></strong> en cualquier otro caso.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Este método te permite saber si una cadena de texto comienza o no con otra cadena de texto. Este método distingue entre mayúsculas y minúsculas.</p>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p>Este método se ha añadido a la especificación ECMAScript 2015 y podría no estar disponible aún en todas las implementaciones de JavaScript. Sin embargo, puedes utilizar un <em>polyfill</em> de <code>String.prototype.startsWith()</code> con el siguiente fragmento de código:</p>
+
+<pre class="brush: js notranslate">if (!String.prototype.startsWith) {
+    Object.defineProperty(String.prototype, 'startsWith', {
+        value: function(search, rawPos) {
+            var pos = rawPos &gt; 0 ? rawPos|0 : 0;
+            return this.substring(pos, pos + search.length) === search;
+        }
+    });
+}
+</pre>
+
+<p>Un <em>polyfill</em> más robusto (totalmente compatible con la especificación ES2015), pero con menos rendimiento y menos compacto está disponible <a href="https://github.com/mathiasbynens/String.prototype.startsWith">en GitHub, por Mathias Bynens</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_startsWith">Usando <code>startsWith()</code></h3>
+
+<pre class="brush: js notranslate">//startswith
+var str = 'Ser, o no ser. ¡Esa es la cuestión!';
+
+console.log(str.startsWith('Ser'));           // true
+console.log(str.startsWith('no ser'));        // false
+console.log(str.startsWith('Esa es la', 16)); // true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.startswith', 'String.prototype.startsWith')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{Compat("javascript.builtins.String.startsWith")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.endsWith()")}}</li>
+ <li>{{jsxref("String.prototype.includes()")}}</li>
+ <li>{{jsxref("String.prototype.indexOf()")}}</li>
+ <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/strike/index.html b/files/es/web/javascript/reference/global_objects/string/strike/index.html
new file mode 100644
index 0000000000..2acdb23881
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/strike/index.html
@@ -0,0 +1,43 @@
+---
+title: String.prototype.strike()
+slug: Web/JavaScript/Reference/Global_Objects/String/strike
+tags:
+  - Deprecated
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/strike
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/strike
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<p>{{deprecated_header}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Causa que una cadena se muestre como texto tachado, como si estuviese dentro de una etiqueta {{HTMLElement("strike")}}.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox"><em>cadena</em>.strike()</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Usa el método <code>strike</code> para formatear y mostrar una cadena en un documento.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el formateado de una cadena</h3>
+<p>El siguiente ejemplo usa los métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
+<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
+
+console.log(cadenaMundo.blink())
+console.log(cadenaMundo.bold())
+console.log(cadenaMundo.italics())
+console.log(cadenaMundo.strike())
+</pre>
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+<pre class="brush: html">&lt;blink&gt;¡Hola mundo!&lt;/blink&gt;
+&lt;b&gt;¡Hola mundo!&lt;/b&gt;
+&lt;i&gt;¡Hola mundo!&lt;/i&gt;
+&lt;strike&gt;¡Hola mundo!&lt;/strike&gt;
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("String.prototype.blink()")}}</li>
+ <li>{{jsxref("String.prototype.bold()")}}</li>
+ <li>{{jsxref("String.prototype.italics()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/sub/index.html b/files/es/web/javascript/reference/global_objects/string/sub/index.html
new file mode 100644
index 0000000000..7d11d8612d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/sub/index.html
@@ -0,0 +1,36 @@
+---
+title: String.prototype.sub()
+slug: Web/JavaScript/Reference/Global_Objects/String/sub
+tags:
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/sub
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/sub
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Causa que una cadena se muestre como subíndice, como si estuviese dentro de una etiqueta {{HTMLElement("sub")}}.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox"><em>cadena</em>.sub()</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Usa el método <code>sub</code> junto para formatear y mostrar una cadena en un documento.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena" name="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena">Ejemplo: Usando los métodos <code>sub</code> y <code>sup</code> para formatear una cadena</h3>
+<p>El siguiente ejemplo usa los métodos <code>sub</code> y <code>sup</code> para formatear una cadena:</p>
+<pre class="brush: js">var superText="superscript"
+var subText="subscript"
+
+console.log("Esto es lo que un " + superText.sup() + " parece.")
+console.log("Esto es lo que un " + subText.sub() + " parece.")
+</pre>
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+<pre class="brush: html">Esto es lo que &lt;sup&gt;superscript&lt;/sup&gt; parece.
+Esto es lo que &lt;sub&gt;subscript&lt;/sub&gt; parece.
+</pre>
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+<ul>
+ <li>{{jsxref("String.prototype.sup()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/substr/index.html b/files/es/web/javascript/reference/global_objects/string/substr/index.html
new file mode 100644
index 0000000000..743ff03672
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/substr/index.html
@@ -0,0 +1,84 @@
+---
+title: String.prototype.substr()
+slug: Web/JavaScript/Reference/Global_Objects/String/substr
+tags:
+  - JavaScript
+  - Método(2)
+  - Prototipo
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/substr
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/substr
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<div class="warning">Advertencia: Aunque <code>String.prototype.substr(…) </code><span style="font-size: 1.125rem;">no está estrictamente obsoleto (como en "eliminado de los estándares web"), se define en el anexo B de la norma ECMA-262, cuya introducción establece:</span>
+
+<blockquote>... Todas las características y comportamientos del lenguaje especificados en este anexo tienen una o más características indeseables y, en ausencia de uso heredado, se eliminarían de esta especificación. ... ... Los programadores no deben usar ni asumir la existencia de estas características y comportamientos al escribir un nuevo código ECMAScript.</blockquote>
+</div>
+
+<p> </p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <strong><code>substr()</code></strong> devuelve los caracteres de una cadena que comienzan en una localización especificada y de acuerdo al número de caracteres que se especifiquen.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.substr(<em>inicio</em>[, <em>longitud</em>])</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>inicio</code></dt>
+ <dd>Localización en la cual se empiezan a extraer caracteres. Si se da un número negativo, se trata como <code>longCad + inicio</code> donde  <code>longCad</code> es la longitud de la cadena (por ejemplo, si <code>inicio</code> es -3 se trata como <code>longCad - 3</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>longitud</code></dt>
+ <dd>Opcional. El número de caracteres a extraer. Si este argumento es {{jsxref("undefined")}}, todos los caracteres desde <code><em>inicio</em></code> hasta el final de la cadena serán extraidos.</dd>
+</dl>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Una nueva cadena que contiende la sección extraída de la cadena dada. Sí la longitud es 0 o un número negativo, retorna la cadena vacía.</p>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>inicio</code> es el índice de un carácter. El índice del primer carácter es 0, y el índice del último carácter es la longitud de la cadena menos 1. <code>substr</code> comienza extrayendo caracteres a partir de <code>inicio</code> y recolecta <code>longitud</code>  caracteres (a menos que se alcance primero el final de la cadena, en cuyo caso devuelve menos).</p>
+
+<p>Si <code>inicio</code> es positivo y es mayor o igual que la longitud de la cadena, <code>substr()</code> devuelve una cadena vacía.</p>
+
+<p>Si <code>inicio</code> es negativo, <code>substr()</code> lo usa como un índice de carácter desde el final de la cadena. Si <code>inicio</code> es negativo y <code>abs(inicio)</code> es mayor que la longitud de la cadena, <code>substr</code> usa 0 como índice inical. Nota: el uso descrito de valores negativos del argumento <code>inicio</code> no es soportado por Microsoft JScript <a class="external" href="http://msdn2.microsoft.com/en-us/library/0esxc5wy.aspx">. </a></p>
+
+<p>Si <code>longitud</code> es 0 o negativa, <code>substr</code> devuelve una cadena vacía. Si se omite <code>longitud</code>, <code>inicio</code> extrae caracteres hasta el final de la cadena.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_substr" name="Ejemplo:_Usando_substr">Ejemplo: Uso de <code>substr()</code></h3>
+
+<pre class="brush: js">var cadena = "abcdefghij";
+
+console.log("(1,2): "    + cadena.substr(1,2));   <code>// '(1, 2): bc'</code>
+console.log("(-3,2): "   + cadena.substr(-3,2));  <code>// '(-3, 2): hi'</code>
+console.log("(-3): "     + cadena.substr(-3));    // '(-3): hij'
+console.log("(1): "      + cadena.substr(1));     // '(1): bcdefghij'
+console.log("(-20, 2): " + cadena.substr(-20,2)); // '(-20, 2): ab'
+console.log("(20, 2): "  + cadena.substr(20,2));  // '(20, 2): '
+</pre>
+
+<p>Este script muestra:</p>
+
+<pre class="eval">(1,2): bc
+(-3,2): hi
+(-3): hij
+(1): bcdefghij
+(-20, 2): ab
+(20, 2):
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.slice()")}}</li>
+ <li>{{jsxref("String.prototype.substring()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/substring/index.html b/files/es/web/javascript/reference/global_objects/string/substring/index.html
new file mode 100644
index 0000000000..8c14c9fff0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/substring/index.html
@@ -0,0 +1,93 @@
+---
+title: String.prototype.substring()
+slug: Web/JavaScript/Reference/Global_Objects/String/substring
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/substring
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/substring
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El <strong><code>substring()</code></strong> método devuelve un subconjunto de un objeto <code>String</code>.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>cadena</em>.substring(<em>indiceA</em>[, <em>indiceB</em>'])</pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>indiceA</code></dt>
+ <dd>Un entero entre 0 y la longitud de la cadena menos 1.</dd>
+ <dt><code>indiceB</code></dt>
+ <dd>(opcional) Un entero entre 0 y la longitud de la cadena.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>substring</code> extrae caracteres desde <code>indiceA</code> hasta <code>indiceB</code> sin incluirlo. En particular:</p>
+
+<ul>
+ <li>Si <code>indiceA</code> es igual a <code>indiceB</code>, <code>substring</code> devuelve una cadena vacía.</li>
+ <li>Si se omite el <code>indiceB</code>, <code>substring</code> extrae caracteres hasta el final de la cadena.</li>
+ <li>Si el argumento es menor que 0 o es <code>NaN</code>, se trata como si fuese 0.</li>
+ <li>Si el argumento es mayor que <code>nombreCadena.length</code>, se trata como si fuese <code>nombreCadena.length</code>.</li>
+</ul>
+
+<p>Si <code>indiceA</code> es mayor que <code>indiceB</code>, entonces el efecto de <code>substring</code> es como si los dos argumentos se intercambiasen; por ejemplo, <code><em>cadena</em>.substring(1, 0) == <em>cadena</em>.substring(0, 1)</code>.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_substring" name="Ejemplo:_Usando_substring">Ejemplo: Usando <code>substring</code></h3>
+
+<p>El siguiente ejemplo usa <code>substring</code> para mostrar caracteres de la cadena "<code>Mozilla</code>":</p>
+
+<pre class="brush:js">// asume una función print ya definida
+var cualquierCadena = "Mozilla";
+
+// Muestra "Moz"
+print(cualquierCadena.substring(0,3));
+print(cualquierCadena.substring(3,0));
+
+// Muestra "lla"
+print(cualquierCadena.substring(4,7));
+print(cualquierCadena.substring(7,4));
+
+// Muestra "Mozill"
+print(cualquierCadena.substring(0,6));
+print(cualquierCadena.substring(6,0));
+
+// Muestra "Mozilla"
+print(cualquierCadena.substring(0,7));
+print(cualquierCadena.substring(0,10));
+</pre>
+
+<h3 id="Ejemplo:_Reemplazar_una_subcadena_dentro_de_una_cadena" name="Ejemplo:_Reemplazar_una_subcadena_dentro_de_una_cadena">Ejemplo: Reemplazar una subcadena dentro de una cadena</h3>
+
+<p>El siguiente ejemplo reemplaza una subcadena dentro de una cadena. Reemplazará tanto caracteres individuales como subcadenas. La llamada de la función al final del ejemplo cambia la cadena "<code>Bravo Nuevo Mundo</code>" por "<code>Bravo Nueva Web</code>".</p>
+
+<pre class="brush:js">function reemplazarCadena(cadenaVieja, cadenaNueva, cadenaCompleta) {
+// Reemplaza cadenaVieja por cadenaNueva en cadenaCompleta
+
+   for (var i = 0; i &lt; cadenaCompleta.length; i++) {
+      if (cadenaCompleta.substring(i, i + cadenaVieja.length) == cadenaVieja) {
+         cadenaCompleta= cadenaCompleta.substring(0, i) + cadenaNueva + cadenaCompleta.substring(i + cadenaVieja.length, cadenaCompleta.length);
+      }
+   }
+   return cadenaCompleta;
+}
+
+reemplazarCadena("Mundo", "Web", "Bravo Nuevo Mundo");
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.substr()")}}</li>
+ <li>{{jsxref("String.prototype.slice()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/sup/index.html b/files/es/web/javascript/reference/global_objects/string/sup/index.html
new file mode 100644
index 0000000000..cf9670f064
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/sup/index.html
@@ -0,0 +1,36 @@
+---
+title: String.prototype.sup()
+slug: Web/JavaScript/Reference/Global_Objects/String/sup
+tags:
+  - HTML wrapper methods
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/sup
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/sup
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Causa que una cadena se muestre como superíndice, como si estuviese dentro de una etiqueta {{HTMLElement("sup")}}.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox"><em>cadena</em>.sup()</pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Usa el método <code>sup</code> junto para formatear y mostrar una cadena en un documento.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena" name="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena">Ejemplo: Usando los métodos <code>sub</code> y <code>sup</code> para formatear una cadena</h3>
+<p>El siguiente ejemplo usa los métodos <code>sub</code> y <code>sup</code> para formatear una cadena:</p>
+<pre class="brush: js">var textoSuper="superscript"
+var textoSub="subscript"
+
+console.log("Esto es lo que un " + textoSuper.sup() + " parece.")
+console.log("Esto es lo que un " + textoSub.sub() + " parece.")
+</pre>
+<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
+<pre class="brush: html">Esto es lo que &lt;sup&gt;superscript&lt;/sup&gt; parece.
+Esto es lo que &lt;sub&gt;subscript&lt;/sub&gt; parece.
+</pre>
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+<ul>
+ <li>{{jsxref("String.prototype.sub()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/tolocalelowercase/index.html b/files/es/web/javascript/reference/global_objects/string/tolocalelowercase/index.html
new file mode 100644
index 0000000000..6c926fbb3f
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/tolocalelowercase/index.html
@@ -0,0 +1,114 @@
+---
+title: String.prototype.toLocaleLowerCase()
+slug: Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase
+tags:
+  - Cadena
+  - Internacionalizacion
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/toLocaleLowerCase
+---
+<div>{{JSRef}}</div>
+
+<div>El método <strong><code>toLocaleLowerCase()</code> </strong>retorna la cadena de texto desde la que se llama convertida en minúsculas, de acuerdo con cualquier localización específica de correspondencia de mayúsculas y minúsculas.</div>
+
+<div> </div>
+
+<div>{{EmbedInteractiveExample("pages/js/string-tolocalelowercase.html")}}</div>
+
+<p class="hidden">Los fuentes para este ejemplo interactivo están almacenados en un repositorio GitHub. Si quieres contribuir en el proyecto de ejemplos interactivos, por favor clona https://github.com/mdn/interactive-examples y envíanos un pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>str</var>.toLocaleLowerCase()
+<var>str</var>.toLocaleLowerCase(locale)
+<var>str</var>.toLocaleLowerCase([locale, locale, ...])
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>locale</code> {{optional_inline}}</dt>
+ <dd>El parámetro <code>locale</code> indica la localización que se utilizará para convertir a minúsculas de acuerdo con culalquier correspondencia de mayúsculas y minúsculas. Si se proporcionan múltiples locales en un {{jsxref("Array")}}, se utiliza <a href="https://tc39.github.io/ecma402/#sec-bestavailablelocale">el mejor local disponible</a>. La localización por defecto es la localización actual configurada en el <em>host</em>.</dd>
+</dl>
+
+<h3 id="Valor_retornado">Valor retornado</h3>
+
+<p>Una nueva cadena que representa la cadena desde la que se llama convertida a minúsculas, de acuerdo con cualquier localización específica de correspondencia de mayúsculas y minúsculas.</p>
+
+<h3 id="Excepciones">Excepciones</h3>
+
+<ul>
+ <li>Una excepción de tipo {{jsxref("RangeError")}} ("invalid language tag: xx_yy") se lanzará si el argumento <code>locale</code> no es una etiqueta válida de lenguaje.</li>
+ <li>Una excepción de tipo {{jsxref("TypeError")}} ("invalid element in locales argument") se lanzará si un elemento del arreglo no es del tipo cadena.</li>
+</ul>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>toLocaleLowerCase()</code><strong> </strong>retorna la cadena de texto desde la que se llama convertida en minúsculas, de acuerdo con cualquier localización específica de correspondencia de mayúsculas y minúsculas.  <code>toLocaleLowerCase()</code> no afecta el valor de la cadena desde la que se llama. En la mayoría de los casos, producirá el mismo resultado que {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}, pero para algunos locales, como el turco, cuyas correspondencias de mayúsculas y minúsculas no siguen las correpsondencias por defecto de Unicode, podría producir de un resultado diferente.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizando_toLocaleLowerCase()">Utilizando <code>toLocaleLowerCase()</code></h3>
+
+<pre class="brush: js">'ALPHABET'.toLocaleLowerCase(); // 'alphabet'
+
+'\u0130'.toLocaleLowerCase('tr') === 'i';    // true
+'\u0130'.toLocaleLowerCase('en-US') === 'i'; // false
+
+let locales = ['tr', 'TR', 'tr-TR', 'tr-u-co-search', 'tr-x-turkish'];
+'\u0130'.toLocaleLowerCase(locales) === 'i'; // true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.17', 'String.prototype.toLocaleLowerCase')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td>ES Intl 2017 added the <code>locale</code> parameter.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta pádina se gnera desde datos estructurados. Si quieres contribuir a estos datos, por favor obtén <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.toLocaleLowerCase")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li>
+ <li>{{jsxref("String.prototype.toLowerCase()")}}</li>
+ <li>{{jsxref("String.prototype.toUpperCase()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html b/files/es/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html
new file mode 100644
index 0000000000..6ff17f382a
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html
@@ -0,0 +1,101 @@
+---
+title: String.prototype.toLocaleUpperCase()
+slug: Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase
+translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/toLocaleUpperCase
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>toLocaleUpperCase()</code></strong> devuelve el valor de la cadena que lo llama convertido en mayúsculas, de acuerdo con las asignaciones de casos específicos de la configuración regional.</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<pre class="syntaxbox"><var>str</var>.toLocaleUpperCase()
+<var>str</var>.toLocaleUpperCase(locale)
+<var>str</var>.toLocaleUpperCase([locale, locale, ...])
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>locale</code> {{optional_inline}}</dt>
+ <dd>El parámetro <code>locale</code> indica la configuración regional que se va a utilizar para convertir en mayúsculas según las asignaciones de casos específicos de la configuración regional. Si se proporcionan varios locales en un {{jsxref ("Array")}}, se utiliza la mejor configuración regional disponible. La configuración regional predeterminada es la configuración regional actual del entorno de host.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una nueva cadena que representa la cadena de llamada convertida en mayúsculas, de acuerdo con cualquier asignación de mayúsculas de idioma específico.</p>
+
+<h3 id="Exceciones">Exceciones</h3>
+
+<ul>
+ <li>Un {{jsxref("RangeError")}} ("invalid language tag: xx_yy") se arroja si un argumento de configuración regional no es una etiqueta de idioma válida.</li>
+ <li>Un {{jsxref("TypeError")}} ("invalid element in locales argument")  se lanzará si un elemento de matriz no es de tipo cadena.</li>
+</ul>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>toLocaleUpperCase()</code> devuelve el valor de la cadena convertida en mayúsculas según las asignaciones de casos específicos de la configuración regional. <code>toLocaleUpperCase()</code> no afecta al valor de la cadena en sí. En la mayoría de los casos, esto producirá el mismo resultado que {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}, pero para algunas localidades, como turco, cuyas asignaciones de mayúsculas y minúsculas no siguen la mayúsculas y minúsculas en Unicode, puede haber un resultado diferente.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_toLocaleUpperCase()">Usando <code>toLocaleUpperCase()</code></h3>
+
+<pre class="brush: js">'alphabet'.toLocaleUpperCase(); // 'ALPHABET'
+
+'i\u0307'.toLocaleUpperCase('lt-LT'); // 'I'
+
+let locales = ['lt', 'LT', 'lt-LT', 'lt-u-co-phonebk', 'lt-x-lietuva'];
+'i\u0307'.toLocaleUpperCase(locales); // 'I'
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition. Implemented in JavaScript 1.2.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.19', 'String.prototype.toLocaleUpperCase')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td>
+   <td>{{Spec2('ES Int Draft')}}</td>
+   <td>ES Intl 2017 added the <code>locale</code> parameter.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.toLocaleUpperCase")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li>
+ <li>{{jsxref("String.prototype.toLowerCase()")}}</li>
+ <li>{{jsxref("String.prototype.toUpperCase()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/tolowercase/index.html b/files/es/web/javascript/reference/global_objects/string/tolowercase/index.html
new file mode 100644
index 0000000000..0b29db4339
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/tolowercase/index.html
@@ -0,0 +1,41 @@
+---
+title: String.prototype.toLowerCase()
+slug: Web/JavaScript/Reference/Global_Objects/String/toLowerCase
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/toLowerCase
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/toLowerCase
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El método <strong><code>toLowerCase()</code></strong> devuelve el valor <strong>en minúsculas </strong>de la cadena que realiza la llamada.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre><code><em>cadena</em>.toLowerCase() </code></pre>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>El método <code>toLowerCase</code> devuelve el valor de la cadena convertida a minúsculas. <code>toLowerCase</code> no afecta al valor de la cadena en sí misma.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_toLowerCase" name="Ejemplo:_Usando_toLowerCase">Ejemplo: Usando <code>toLowerCase</code></h3>
+
+<p>El siguiente ejemplo muestra la cadena "alfabeto" en minúsculas:</p>
+
+<pre>var textoMayusculas="ALFABETO"
+document.write(textoMayusculas.toLowerCase())
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li>
+ <li>{{jsxref("String.prototype.toUpperCase()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/tosource/index.html b/files/es/web/javascript/reference/global_objects/string/tosource/index.html
new file mode 100644
index 0000000000..5e0e470536
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/tosource/index.html
@@ -0,0 +1,57 @@
+---
+title: String.prototype.toSource()
+slug: Web/JavaScript/Reference/Global_Objects/String/toSource
+tags:
+  - Cadena
+  - JavaScript
+  - No estandar
+  - Prototipo
+  - Referencia
+  - metodo
+translation_of: Web/JavaScript/Reference/Global_Objects/String/toSource
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/toSource
+---
+<div>{{JSRef}} {{non-standard_header}}</div>
+
+<p>El método <strong><code>toSource()</code></strong> devuelve una cadena que representa el código fuente del objeto.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>String.toSource()
+<var>str</var>.toSource()
+</code></pre>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>Una cadena que representa el código fuente del objeto.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El método <code>toSource()</code> devuelve los siguientes valores:</p>
+
+<p>Para el objeto incorporado {{jsxref("String")}}, <code>toSource()</code> devuelve la siguiente cadena indicando que el código fuente no está disponible:</p>
+
+<pre class="brush: js">function String() {
+    [native code]
+}
+</pre>
+
+<p>Para instancias de {{jsxref("String")}} o cadenas literales, <code>toSource()</code> devuelve una cadena representando el código fuente.</p>
+
+<p>Este método usualmente es llamado internamente por JavaScript y no explícitamente en código.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ningún estándar. Implementado en JavaScript 1.3.</p>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si deseas contribuir a los datos, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.toSource")}}</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Object.prototype.toSource()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/tostring/index.html b/files/es/web/javascript/reference/global_objects/string/tostring/index.html
new file mode 100644
index 0000000000..52f14051a0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/tostring/index.html
@@ -0,0 +1,29 @@
+---
+title: String.prototype.toString()
+slug: Web/JavaScript/Reference/Global_Objects/String/toString
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/toString
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/toString
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>El <strong><code>toString()</code></strong> método devuelve una cadena que representa al objeto especificado.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre><code><em>cadena</em>.toString() </code></pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>El objeto <code>String</code> sobreescribe el método <code>toString</code> del objeto {{jsxref("Object")}} object; no hereda {{jsxref("Object.toString()")}}. Para objetos <code>String</code>, el método <code>toString</code> devuelve una cadena que representa al objeto.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_toString" name="Ejemplo:_Usando_toString">Ejemplo: Usando <code>toString</code></h3>
+<p>El siguiente ejemplo muestra el valor cadena de un objeto String:</p>
+<pre class="brush: js">cadena = new String("Hello world");
+alert(cadena.toString())      // Displays "Hello world"
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("Object.prototype.toSource()")}}</li>
+ <li>{{jsxref("String.prototype.valueOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/touppercase/index.html b/files/es/web/javascript/reference/global_objects/string/touppercase/index.html
new file mode 100644
index 0000000000..27eef892e5
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/touppercase/index.html
@@ -0,0 +1,40 @@
+---
+title: String.prototype.toUpperCase()
+slug: Web/JavaScript/Reference/Global_Objects/String/toUpperCase
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/toUpperCase
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/toUpperCase
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El <strong><code>toUpperCase()</code></strong> método devuelve el valor convertido en mayúsculas de la cadena que realiza la llamada.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre><code><em>cadena</em>.toUpperCase() </code></pre>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>El método <code>toUpperCase</code> devuelve el valor de la cadena convertida a mayúsculas. <code>toUpperCase</code> no afecta al valor de la cadena en sí mismo.</p>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_toUpperCase" name="Ejemplo:_Usando_toUpperCase">Ejemplo: Usando <code>toUpperCase</code></h3>
+
+<p>El siguiente ejemplo muestra la cadena "<code>ALPHABET</code>":</p>
+
+<pre class="brush: js">console.log( "alphabet".toUpperCase() ); // "ALPHABET"
+</pre>
+
+<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
+
+<ul>
+ <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li>
+ <li>{{jsxref("String.prototype.toLowerCase()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/trim/index.html b/files/es/web/javascript/reference/global_objects/string/trim/index.html
new file mode 100644
index 0000000000..4c6ff91bee
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/trim/index.html
@@ -0,0 +1,134 @@
+---
+title: String.prototype.trim()
+slug: Web/JavaScript/Reference/Global_Objects/String/Trim
+translation_of: Web/JavaScript/Reference/Global_Objects/String/Trim
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/Trim
+---
+<div>{{JSRef("Global_Objects", "String")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El método <strong>trim( )</strong> elimina los espacios en blanco en ambos extremos del string. Los espacios en blanco en este contexto, son todos los caracteres sin contenido (espacio, tabulación, etc.) y todos los caracteres de nuevas lineas (LF,CR,etc.).</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><var>str</var>.trim()</code></pre>
+
+<p>Una nueva cadena que representa la cadena de llamada sin espacios en blanco de ambos extremos.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>El método <strong>trim( ) </strong>devuelve la cadena de texto despojada de los espacios en blanco en ambos extremos. El método no afecta al valor de la cadena de texto.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_trim" name="Example:_Using_trim">Ejemplo: Uso de <code>trim()</code></h3>
+
+<p>El siguiente ejemplo muestra la cadena de texto en minúsculas 'foo':</p>
+
+<pre class="brush: js">var orig = '   foo  ';
+console.log(orig.trim()); // 'foo'
+
+// Otro ejemplo de .trim() eliminando el espacio en blanco sólo de un lado.
+
+var orig = 'foo    ';
+console.log(orig.trim()); // 'foo'
+</pre>
+
+<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
+
+<p>Ejecutar el siguiente código antes de cualquier otro código creará un trim ( ) si este no está disponible de manera nativa.</p>
+
+<pre class="brush: js">if (!String.prototype.trim) {
+  (function() {
+    // Make sure we trim BOM and NBSP
+    var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
+    String.prototype.trim = function() {
+      return this.replace(rtrim, '');
+    };
+  })();
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.5.4.20', 'String.prototype.trim')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>
+    <p>Definición inicial. Implementado en JavaScript 1.8.1.</p>
+   </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-string.prototype.trim', 'String.prototype.trim')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
+   <td>{{CompatIE("9")}}</td>
+   <td>{{CompatOpera("10.5")}}</td>
+   <td>{{CompatSafari("5")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte Básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.trimLeft()")}} {{non-standard_inline}}</li>
+ <li>{{jsxref("String.prototype.trimRight()")}} {{non-standard_inline}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/trimend/index.html b/files/es/web/javascript/reference/global_objects/string/trimend/index.html
new file mode 100644
index 0000000000..5ee771055c
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/trimend/index.html
@@ -0,0 +1,83 @@
+---
+title: String.prototype.trimEnd()
+slug: Web/JavaScript/Reference/Global_Objects/String/trimEnd
+tags:
+  - Espacios en blanco
+  - JavaScript
+  - Métodos
+  - Prototype
+  - String
+  - Texto
+  - cadenas de texto
+translation_of: Web/JavaScript/Reference/Global_Objects/String/trimEnd
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/trimEnd
+---
+<div>{{JSRef}}</div>
+
+<p>El método <strong><code>trimEnd()</code></strong> elimina los espacios en blanco al final de una cadena de carácteres. <code>trimRight()</code> es el alias de este método.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/string-trimend.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code><var>str</var>.trimEnd();
+<var>str</var>.trimRight();</code></pre>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Una nueva cadena de texto que representa la cadena de texto llamada sin espacios en blanco de su extremo (derecho).</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><code>trimEnd()</code> / <code>trimRight()</code> Los metodos devuelven una cadena de texto sin espacios en blanco desde su extremo derecho. <code>trimEnd()</code> ó <code>trimRight()</code> no afectan el valor de la cadena de texto en sí.</p>
+
+<h3 id="Superposición">Superposición</h3>
+
+<p>Por coherencia de funciones como {{jsxref("String.prototype.padEnd")}} el nombre del método estandar es <code>trimEnd</code>. Sin embargo por compatibilidad web, <code>trimRight</code> permanece como un alias para <code>trimEnd</code>. En algunos motores esto significa: </p>
+
+<pre class="brush: js notranslate">String.prototype.trimRight.name === "trimEnd";</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Usando_trimEnd">Usando <code>trimEnd()</code></h3>
+
+<p>El siguiente ejemplo muestra la cadena de texto en minusculas <code>'   foo'</code>:</p>
+
+<pre class="brush: js; highlight: [5] notranslate">var str = '   foo  ';
+
+console.log(str.length); // 8
+
+str = str.trimEnd();
+console.log(str.length); // 6
+console.log(str);        // '   foo'
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-string.prototype.trimend', 'String.prototype.trimEnd')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+
+<p>{{Compat("javascript.builtins.String.trimEnd")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String.prototype.trim()")}}</li>
+ <li>{{jsxref("String.prototype.trimStart()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/string/valueof/index.html b/files/es/web/javascript/reference/global_objects/string/valueof/index.html
new file mode 100644
index 0000000000..a744d783b0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/string/valueof/index.html
@@ -0,0 +1,29 @@
+---
+title: String.prototype.valueOf()
+slug: Web/JavaScript/Reference/Global_Objects/String/valueOf
+tags:
+  - JavaScript
+  - Method
+  - Prototype
+  - String
+translation_of: Web/JavaScript/Reference/Global_Objects/String/valueOf
+original_slug: Web/JavaScript/Referencia/Objetos_globales/String/valueOf
+---
+<p>{{JSRef("Objetos_globales", "String")}}</p>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>The <strong><code>valueOf()</code></strong> método devuelve el valor primitivo de un objeto String.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre><code><em>caneda</em>.valueOf() </code></pre>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>El método <code>valueOf</code> de <code>String</code> devuelve el valor primitivo de un objeto String como un tipo de dato cadena. Este valor es equivalente a String.toString.</p>
+<p>Normalmente este método es llamado internamente por JavaScript y no en el código.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_valueOf" name="Ejemplo:_Usando_valueOf">Ejemplo: Usando <code>valueOf</code></h3>
+<pre class="brush: js">cadena = new String("Hello world");
+alert(cadena.valueOf())          // Displays "Hello world"
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("String.prototype.toString()")}}</li>
+ <li>{{jsxref("Object.prototype.valueOf()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/symbol/for/index.html b/files/es/web/javascript/reference/global_objects/symbol/for/index.html
new file mode 100644
index 0000000000..4af80e0072
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/symbol/for/index.html
@@ -0,0 +1,154 @@
+---
+title: Symbol.for()
+slug: Web/JavaScript/Reference/Global_Objects/Symbol/for
+translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/for
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Symbol/for
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>Symbol.for(key)</strong></code> busca símbolos existentes en el runtime global del registro de <em>symbols</em> con la <code>key</code> enviada cómo argumento y devuelve el symbol si fue encontrada. Sino, un nuevo symbol es creado en el registro global de <em>symbols </em>con dicha <code>key</code> .</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><var>Symbol.for(key)</var>;</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>key</dt>
+ <dd>String, requirido. La <em>key </em>para el símbolo (y también usada para la descripción del <em>Symbol</em>).</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un <em>Symbol </em>existente para la <em>key </em>enviada si se encuentra, un nuevo <em>Symbol</em> creado para la <em>key </em>si no es encontrado.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>A diferencia de <code>Symbol()</code>,  la función <code>Symbol.for()</code> crea un symbol disponible el registro global de symbols.</p>
+
+<p>Sin embargo, <code>Symbol.for()</code> no crea un nuevo symbol en cada llamada: primero chequea si existe un symbol para la <code>key</code> en el registro y sólo crea un nuevo symbol si la <code>key</code> no es encontrada.</p>
+
+<p>El registro global de symbol es una lista con la siguiente estructura (inicializada vacía):</p>
+
+<table class="standard-table">
+ <caption>Estructura registro global de symbol</caption>
+ <tbody>
+  <tr>
+   <th>Field name</th>
+   <th>Value</th>
+  </tr>
+  <tr>
+   <td>[[key]]</td>
+   <td>Un string usado como key para identifcar al símbolo.</td>
+  </tr>
+  <tr>
+   <td>[[symbol]]</td>
+   <td>El symbol que es guardado globalmente.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js">Symbol.for('foo'); // crea un nuevo global symbol
+Symbol.for('foo'); // devuelve el symbol creado
+
+// El mismo symbol global, pero no localmente
+Symbol.for('bar') === Symbol.for('bar'); // true
+Symbol('bar') === Symbol('bar'); // false
+
+// La key es usada en la descripción
+var sym = Symbol.for('mario');
+sym.toString(); // "Symbol(mario)"
+</pre>
+
+<p>Es una buena práctica agregar un prefijo a los symbols para evitar conflictos con otras librerias del código:</p>
+
+<pre class="brush: js">Symbol.for('mdn.foo');
+Symbol.for('mdn.bar');
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-symbol.for', 'Symbol.for')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-symbol.for', 'Symbol.for')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_exploradores">Compatibilidad entre exploradores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatChrome(40) }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("36.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>9</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("36.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Symbol.keyFor()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/symbol/hasinstance/index.html b/files/es/web/javascript/reference/global_objects/symbol/hasinstance/index.html
new file mode 100644
index 0000000000..c930685453
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/symbol/hasinstance/index.html
@@ -0,0 +1,106 @@
+---
+title: Symbol.hasInstance
+slug: Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance
+translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Symbol/hasInstance
+---
+<div>{{JSRef}}</div>
+
+<p>El bien conocido símbolo <strong><code>Symbol.hasInstance</code></strong> es usado para determinar si un constructor reconoce un objeto como su instancia. El comportamiento del operador {{jsxref("Operators/instanceof", "instanceof")}} puede ser personalizado con este símbolo.</p>
+
+<div>{{js_property_attributes(0,0,0)}}</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Usted puede implementar un comportamiento personalizado para el operador <code>instanceof</code> tal que así:</p>
+
+<pre class="brush: js">class MyArray {
+  static [Symbol.hasInstance](instance) {
+    return Array.isArray(instance);
+  }
+}
+console.log([] instanceof MyArray); // true</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-symbol.hasinstance', 'Symbol.hasInstance')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-symbol.hasinstance', 'Symbol.hasInstance')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(51)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoDesktop(50) }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile(50) }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/instanceof", "instanceof")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/symbol/index.html b/files/es/web/javascript/reference/global_objects/symbol/index.html
new file mode 100644
index 0000000000..8279b2a8a7
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/symbol/index.html
@@ -0,0 +1,365 @@
+---
+title: Symbol
+slug: Web/JavaScript/Reference/Global_Objects/Symbol
+translation_of: Web/JavaScript/Reference/Global_Objects/Symbol
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Symbol
+---
+<div>{{JSRef}}</div>
+
+<p><em><strong>Symbol</strong></em> es un tipo de datos cuyos valores son únicos e immutables. Dichos valores pueden ser utilizados como identificadores (claves) de las propiedades de los objetos.  Cada valor del tipo Symbol tiene asociado un valor del tipo String o Undefined que sirve únicamente como descripción del símbolo.</p>
+
+<p>La función <code>Symbol</code> {{Glossary("Primitive", "primitive data type")}} es el constructor de valores del tipo <em><strong>Symbol</strong></em>. Cuando <code>Symbol </code>es llamado como función nos devuelve una nuevo valor del tipo <em><strong>Symbol.</strong></em> El constructor <code>Symbol</code> no debe ser usado con el operador <code>new</code>. Tampoco debe ser extendido mediante clases.</p>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>Symbol(<em>[description]</em>)</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>Descripcion</code> {{optional_inline}}</dt>
+ <dd>Es un valor opcional de tipo String. Únicamente sirve como descripción del símbolo que puede ser útil para depurar. No permite el acceso al símbolo que describe.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Para crear un nuevo símbolo, simplemente escribimos  <code>Symbol()</code>, opcionalmente  con un argumento de tipo String que constituiría la descripción del símbolo:</p>
+
+<pre class="brush: js">var sym1 = Symbol();
+var sym2 = Symbol("foo");
+var sym3 = Symbol("foo");
+</pre>
+
+<p>El código anterior crea tres símbolos nuevos. Hay que destacar que  <code>Symbol("foo")</code> no convierte la cadena "foo" en un símbolo, sino que crea un símbolo nuevo que tiene la misma descripción.</p>
+
+<pre class="brush: js">Symbol("foo") === Symbol("foo"); // false</pre>
+
+<p>La siguiente sintaxis con el operador {{jsxref("Operators/new", "new")}} lanzará un {{jsxref("TypeError")}}:</p>
+
+<pre class="brush: js">var sym = new Symbol(); // TypeError</pre>
+
+<p>Esto evita la creación de un objeto envolvente explícito de Symbol en lugar de un nuevo valor de tipo símbolo. Si realmente se desea crear un <code>Symbol</code> wrapper object,  podemos usar la función <code>Object()</code>:</p>
+
+<pre class="brush: js">var sym = Symbol("foo");
+typeof sym;     // "symbol"
+var symObj = Object(sym);
+typeof symObj;  // "object"
+</pre>
+
+<h3 id="Símbolos_compartidos_en_el_registro_global_de_símbolos">Símbolos compartidos en el registro global de símbolos</h3>
+
+<p>La sintaxis anteriormente descrita que usa la función <code>Symbol()</code> no creara un símbolo global disponible para toda el código base. Para crear símbolos accesibles a través de los archivos incluso a través de <em>realms</em> (cada uno de los cuales tiene su propio <em>global scope</em>) es necesario utilizar los métodos {{jsxref("Symbol.for()")}} y {{jsxref("Symbol.keyFor()")}} para crear y acceder a los símbolos desde un registro global de valores del tipo <em>Symbol</em>.</p>
+
+<h3 id="Encontrando_las_claves_de_tipo_símbolo_de_un_objeto">Encontrando las claves de tipo símbolo de un objeto</h3>
+
+<p>El método {{jsxref("Object.getOwnPropertySymbols()")}} devuelve un <em>array</em> con los símbolos que sirven como claves de las propiedades propias de un objeto. Hay que destacar que cada objeto es inicializado sin propiedades propias con claves de tipo <em>Symbol</em>, así que este <em>array</em> estará vacio a menos que se hayan creado explicitamente propiedades con clave de tipo símbolo en el objeto.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>Symbol.length</code></dt>
+ <dd>La propiedad <code>length</code> cuyo valor es 0 para todos los símbolos.</dd>
+ <dt>{{jsxref("Symbol.prototype")}}</dt>
+ <dd>Representa el prototipo constructor <code>Symbol</code>. Es un objeto ordinario.</dd>
+</dl>
+
+<h3 id="Símbolos_bien_conocidos">Símbolos bien conocidos</h3>
+
+<p>JavaScript tiene algunos <em>símbolos incorporados</em> que representan comportamientos internos del lenguaje que no fueron expuestos a los programadores antes de ECMAScript 6. Se accede a los dichos símbolos a través de las siguientes propiedades del constructor <code>Symbol.</code></p>
+
+<h4 id="Símbolo_de_iteración">Símbolo de iteración</h4>
+
+<dl>
+ <dt>{{jsxref("Symbol.iterator")}}</dt>
+ <dd>Los objetos que implementen la interfaz <em><a href="http://www.ecma-international.org/ecma-262/6.0/#sec-iterable-interface">Iterable</a></em> deben tener una propiedad que tenga como clave este símbolo. Dicha propiedad debe ser una función que devuelva un objeto que implemente la interfaz <em><a href="http://www.ecma-international.org/ecma-262/6.0/#sec-iterator-interface">Iterator</a></em>.  Usado por <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of"><code>for...of</code></a>.</dd>
+</dl>
+
+<h4 id="Símbolos_de_expresiones_regulares">Símbolos de expresiones regulares</h4>
+
+<dl>
+ <dt>{{jsxref("Symbol.match")}}</dt>
+ <dd>Un método que iguala a un String, también usado para determinar si un objeto puede ser usado como una expresión regular. Usado por {{jsxref("String.prototype.match()")}}.</dd>
+ <dt>{{jsxref("Symbol.replace")}}</dt>
+ <dd>Un método que reemplaza las subcadenas que coinciden con una cadena. Utilizado por {{jsxref("String.prototype.replace()")}}.</dd>
+ <dt>{{jsxref("Symbol.search")}}</dt>
+ <dd>Un método que devuelve el índice dentro de una cadena que coincide con la expresión regular. Utilizado por {{jsxref("String.prototype.search()")}}.</dd>
+ <dt>{{jsxref("Symbol.split")}}</dt>
+ <dd>Un método que separa una cadena en los índices que coincide una expresión regular. Utilizado por {{jsxref("String.prototype.split()")}}.</dd>
+</dl>
+
+<h4 id="Otros_símbolos">Otros símbolos</h4>
+
+<dl>
+ <dt>{{jsxref("Symbol.hasInstance")}}</dt>
+ <dd>Un método que determina si un objeto constructor reconoce al objeto como su instancia. Utilizado por {{jsxref("Operators/instanceof", "instanceof")}}.</dd>
+ <dt>{{jsxref("Symbol.isConcatSpreadable")}}</dt>
+ <dd>Un valor booleano que indica si un objeto debe ser aplanado a sus elementos de matriz. Usado por {{jsxref("Array.prototype.concat()")}}.</dd>
+ <dt>{{jsxref("Symbol.unscopables")}}</dt>
+ <dd>An Array of string values that are property values. These are excluded from the <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/with">with</a></code> environment bindings of the associated objects.</dd>
+ <dt>{{jsxref("Symbol.species")}}</dt>
+ <dd>Una función <code>constructor</code> utilizada para crear objetos derivados.</dd>
+ <dt>{{jsxref("Symbol.toPrimitive")}}</dt>
+ <dd>Un método para convertir un objeto a su valor primitivo.</dd>
+ <dt>{{jsxref("Symbol.toStringTag")}}</dt>
+ <dd>Un método para definir la descripción por defecto de un objeto. Usado por {{jsxref("Object.prototype.toString()")}}.</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("Symbol.for()", "Symbol.for(key)")}}</dt>
+ <dd>Searches for existing symbols with the given key and returns it if found. Otherwise a new symbol gets created in the global symbol registry with this key.</dd>
+ <dt>{{jsxref("Symbol.keyFor", "Symbol.keyFor(sym)")}}</dt>
+ <dd>Retrieves a shared symbol key from the global symbol registry for the given symbol.</dd>
+</dl>
+
+<h2 id="Symbol_prototype"><code>Symbol</code> prototype</h2>
+
+<p>All Symbols inherit from {{jsxref("Symbol.prototype")}}.</p>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Symbol/prototype','Properties')}}</p>
+
+<h3 id="Métodos_2">Métodos</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Symbol/prototype','Methods')}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_operador_typeof_con_symbols">Usando el operador <code>typeof</code> con  symbols</h3>
+
+<p>El operador {{jsxref("Operators/typeof", "typeof")}} puede ayudar a identificar los Symbol.</p>
+
+<pre class="brush: js">typeof Symbol() === 'symbol'
+typeof Symbol('foo') === 'symbol'
+typeof Symbol.iterator === 'symbol'
+</pre>
+
+<h3 id="Symbol_type_conversions">Symbol type conversions</h3>
+
+<p>Some things to note when working with type conversion of symbols.</p>
+
+<ul>
+ <li>When trying to convert a symbol to a number, a {{jsxref("TypeError")}} will be thrown<br>
+  (e.g. <code>+sym</code> or <code>sym | 0</code>).</li>
+ <li>When using loose equality, <code>Object(sym) == sym</code> returns <code>true.</code></li>
+ <li><code>Symbol("foo") + "bar" </code>throws a {{jsxref("TypeError")}} (can't convert symbol to string). This prevents you from silently creating a new string property name from a symbol, for example.</li>
+ <li>The <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String#String_conversion">"safer" <code>String(sym)</code> conversion</a> works like a call to {{jsxref("Symbol.prototype.toString()")}} with symbols, but note that <code>new String(sym)</code> will throw.</li>
+</ul>
+
+<h3 id="Symbols_y_el_iterador_for...in">Symbols y el iterador <code>for...in</code></h3>
+
+<p>Symbols are not visible in <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in"><code>for...in</code></a> iterations. In addition, {{jsxref("Object.getOwnPropertyNames()")}} will not return symbol object properties, however, you can use {{jsxref("Object.getOwnPropertySymbols()")}} to get these.</p>
+
+<pre class="brush: js">var obj = {};
+
+obj[Symbol("a")] = "a";
+obj[Symbol.for("b")] = "b";
+obj["c"] = "c";
+obj.d = "d";
+
+for (var i in obj) {
+   console.log(i); // logs "c" and "d"
+}</pre>
+
+<h3 id="Symbols_y_JSON.stringify()">Symbols y <code>JSON.stringify()</code></h3>
+
+<p>Symbol-keyed properties will be completely ignored when using <code>JSON.stringify()</code>:</p>
+
+<pre class="brush: js">JSON.stringify({[Symbol("foo")]: "foo"});
+// '{}'</pre>
+
+<p>For more details, see {{jsxref("JSON.stringify()")}}.</p>
+
+<h3 id="Symbol_wrapper_objects_as_property_keys">Symbol wrapper objects as property keys</h3>
+
+<p>When a Symbol wrapper object is used as a property key, this object will be coerced to its wrapped symbol:</p>
+
+<pre class="brush: js">var sym = Symbol("foo");
+var obj = {[sym]: 1};
+obj[sym];            // 1
+obj[Object(sym)];    // still 1
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-symbol-objects', 'Symbol')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{CompatGeckoDesktop("36.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Symbol.iterator (@@iterator)</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{CompatGeckoDesktop("36.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Symbol.unscopables (@@unscopables)</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Symbol.match (@@match)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("40.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Symbol.species (@@species)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("41.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Symbol.toPrimitive (@@toPrimitive)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoDesktop("44.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Other well-known symbols</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{ CompatGeckoMobile("36.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Symbol.iterator (@@iterator)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{ CompatGeckoMobile("36.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Symbol.unscopables (@@unscopables)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(38)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Symbol.match (@@match)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("40.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Symbol.species (@@species)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("41.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Symbol.toPrimitive (@@toPrimitive)</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("44.0") }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Other well-known symbols</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Mira_también">Mira también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Glossary/Symbol">Glossary: Symbol data type</a></li>
+ <li>{{jsxref("Operators/typeof", "typeof")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Data_structures">Data types and data structures</a></li>
+ <li><a href="https://hacks.mozilla.org/2015/06/es6-in-depth-symbols/">"ES6 In Depth: Symbols" on hacks.mozilla.org</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/symbol/iterator/index.html b/files/es/web/javascript/reference/global_objects/symbol/iterator/index.html
new file mode 100644
index 0000000000..7638e3e4e3
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/symbol/iterator/index.html
@@ -0,0 +1,99 @@
+---
+title: Symbol.iterator
+slug: Web/JavaScript/Reference/Global_Objects/Symbol/iterator
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Property
+  - Symbol
+translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/iterator
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Symbol/iterator
+---
+<div>{{JSRef}}</div>
+
+<p>El símbolo <code><strong>Symbol.iterator</strong></code> especifica al iterador por defecto de un objeto. Es utilizado por el bucle {{jsxref("Sentencias/for","for")}}.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/symbol-iterator.html")}}</div>
+
+<p class="hidden">El código fuente de este ejemplo interactivo está guardado en un repositorio en GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envía un pull request.</p>
+
+<div>{{js_property_attributes(0,0,0)}}</div>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>En cualquier situación donde se necesita iterar un objeto (por ejemplo al inicio de un bucle <code>for..of</code>), su método <code>@@iterator</code> es invocado sin argumentos, y el <strong>iterador</strong> regresado es utilizador para obtener los valores a iterar.</p>
+
+<p>Algunos tipos integrados cuentan con un comportamiento de iterar por defecto, mientras que otros tipos (como {{jsxref("Object")}}) no. Los tipos integrados con un método <code>@@iterator</code> son:</p>
+
+<ul>
+ <li>{{jsxref("Array.@@iterator", "Array.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("TypedArray.@@iterator", "TypedArray.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("String.@@iterator", "String.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("Set.@@iterator", "Set.prototype[@@iterator]()")}}</li>
+</ul>
+
+<p>Ver <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Protocolos de iteración</a> para más información.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Iterables_definidos_por_el_usuario">Iterables definidos por el usuario</h3>
+
+<p>Podemos definir nuestros propios iterables de la siguiente forma:</p>
+
+<pre class="brush: js notranslate">var myIterable = {}
+myIterable[Symbol.iterator] = function* () {
+    yield 1;
+    yield 2;
+    yield 3;
+};
+[...myIterable] // [1, 2, 3]
+</pre>
+
+<h3 id="Iterables_mal_formados">Iterables mal formados</h3>
+
+<p>Si un método iterador <code>@@iterator</code> no devuelve un objeto iterador, es un iterable mal formado. Usarlo como tal es probable que genere excepciones en tiempo de ejecución, o comportamientos inesperados.</p>
+
+<pre class="brush: js notranslate">var nonWellFormedIterable = {}
+nonWellFormedIterable[Symbol.iterator] = () =&gt; 1
+[...nonWellFormedIterable] // TypeError: [] is not a function
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciób</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-symbol.iterator', 'Symbol.iterator')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-symbol.iterator', 'Symbol.iterator')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.Symbol.iterator")}}</p>
+
+<h2 id="Temas_relacionados">Temas relacionados</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a></li>
+ <li>{{jsxref("Array.@@iterator", "Array.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("TypedArray.@@iterator", "TypedArray.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("String.@@iterator", "String.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</li>
+ <li>{{jsxref("Set.@@iterator", "Set.prototype[@@iterator]()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/syntaxerror/index.html b/files/es/web/javascript/reference/global_objects/syntaxerror/index.html
new file mode 100644
index 0000000000..e22a4623ee
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/syntaxerror/index.html
@@ -0,0 +1,177 @@
+---
+title: SyntaxError
+slug: Web/JavaScript/Reference/Global_Objects/SyntaxError
+tags:
+  - Constructor
+  - Error
+  - JavaScript
+  - SyntaxError
+translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError
+original_slug: Web/JavaScript/Referencia/Objetos_globales/SyntaxError
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <code><strong>SyntaxError</strong></code> representa un error cuando se trata de interpretar codigo sintacticamente invalido.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Un <code>SyntaxError</code> es lanzado cuando el motor de JavaScript se encuentra con partes de código que no forman parte de la sintaxtis del lenguaje al momento analizar el código.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>new SyntaxError([<var>mensaje</var>[, <var>nombreArchivo</var>[, <var>numeroLinea</var>]]])</code></pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt><code>mensaje</code></dt>
+ <dd>Opcional. Descripción legible del error.</dd>
+ <dt><code>nombreArchivo</code> {{non-standard_inline}}</dt>
+ <dd>Opcional. El nombre del archivo que contiene el código que causó la excepción.</dd>
+ <dt><code>numeroLinea</code> {{non-standard_inline}}</dt>
+ <dd>Opcional. El numero de linea del código que causó la excepción.</dd>
+</dl>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("SyntaxError.prototype")}}</dt>
+ <dd>Permite el agregado de propiedades al objeto <code>SyntaxError</code>.</dd>
+</dl>
+
+<h2 id="Metodos">Metodos</h2>
+
+<p>El objeto global <code>SyntaxError</code> no contiene metodos propios, sin embargo, hereda algunos metodos debido a la cadena de prototipos.</p>
+
+<h2 id="Instancias_de_SyntaxError"><code>Instancias de SyntaxError</code></h2>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype', 'Propiedades')}}</div>
+
+<h3 id="Metodos_2">Metodos</h3>
+
+<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype', 'Metodos')}}</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Capturando_un_SyntaxError">Capturando un <code>SyntaxError</code></h3>
+
+<pre class="brush: js">try {
+  eval('hoo bar');
+} catch (e) {
+  console.log(e instanceof SyntaxError); // true
+  console.log(e.message);                // "missing ; before statement"
+  console.log(e.name);                   // "SyntaxError"
+  console.log(e.fileName);               // "Scratchpad/1"
+  console.log(e.lineNumber);             // 1
+  console.log(e.columnNumber);           // 4
+  console.log(e.stack);                  // "@Scratchpad/1:2:3\n"
+}
+</pre>
+
+<h3 id="Creando_un_SyntaxError">Creando un <code>SyntaxError</code></h3>
+
+<pre class="brush: js">try {
+  throw new SyntaxError('Hola', 'unArchivo.js', 10);
+} catch (e) {
+  console.log(e instanceof SyntaxError); // true
+  console.log(e.message);                // "Hola"
+  console.log(e.name);                   // "SyntaxError"
+  console.log(e.fileName);               // "unArchivo.js"
+  console.log(e.lineNumber);             // 10
+  console.log(e.columnNumber);           // 0
+  console.log(e.stack);                  // "@Scratchpad/2:11:9\n"
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.11.6.4', 'SyntaxError')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-syntaxerror', 'SyntaxError')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-syntaxerror', 'SyntaxError')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegarores">Compatibilidad con Navegarores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Error")}}</li>
+ <li>{{jsxref("SyntaxError.prototype")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/typedarray/buffer/index.html b/files/es/web/javascript/reference/global_objects/typedarray/buffer/index.html
new file mode 100644
index 0000000000..a7e54f7bb5
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/typedarray/buffer/index.html
@@ -0,0 +1,111 @@
+---
+title: TypedArray.prototype.buffer
+slug: Web/JavaScript/Reference/Global_Objects/TypedArray/buffer
+tags:
+  - Buffer
+  - JavaScript
+  - Propiedad
+translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/buffer
+original_slug: Web/JavaScript/Referencia/Objetos_globales/TypedArray/buffer
+---
+<div>{{JSRef}}</div>
+
+<p>La propiedad de acceso <strong><code>buffer</code></strong> representa el {{jsxref("ArrayBuffer")}} referenciada por un <em>TypedArray</em> en tiempo de construcción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>typedArray</var>.buffer</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La propiedad <code>buffer</code> es una propiedad de acceso cuya función <em>set accessor</em> es <code>undefined</code>, significa que tu sólo puedes leer esta propiedad. El valor es establecido cuando <em>TypedArray</em> se construye y no puede ser cambiado. <em>TypedArray</em> es uno de los <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">TypedArray objects</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_la_propiedad_buffer">Usando la propiedad <code>buffer</code></h3>
+
+<pre class="brush:js">var buffer = new ArrayBuffer(8);
+var uint16 = new Uint16Array(buffer);
+uint16.buffer; // ArrayBuffer { byteLength: 8 }
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-get-%typedarray%.prototype.buffer', 'TypedArray.prototype.buffer')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-get-%typedarray%.prototype.buffer', 'TypedArray.prototype.buffer')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>7.0</td>
+   <td>{{ CompatGeckoDesktop("2") }}</td>
+   <td>10</td>
+   <td>11.6</td>
+   <td>5.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile("2") }}</td>
+   <td>10</td>
+   <td>11.6</td>
+   <td>4.2</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li>
+ <li>{{jsxref("TypedArray")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/typedarray/index.html b/files/es/web/javascript/reference/global_objects/typedarray/index.html
new file mode 100644
index 0000000000..870d601ccf
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/typedarray/index.html
@@ -0,0 +1,318 @@
+---
+title: TypedArray
+slug: Web/JavaScript/Reference/Global_Objects/TypedArray
+tags:
+  - Clase
+  - Class
+  - JavaScript
+  - TypedArray
+  - TypedArrays
+translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray
+original_slug: Web/JavaScript/Referencia/Objetos_globales/TypedArray
+---
+<div>{{JSRef}}</div>
+
+<p>Un objeto <strong><em>TypedArray</em></strong> describe una vista similar a un arreglo de un <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">búfer de datos binarios subyacente</a>. No existe una propiedad global denominada <code>TypedArray</code>, ni existe un constructor <code>TypedArray</code> directamente visible. En cambio, hay una serie de diferentes propiedades globales, cuyos valores son constructores de arreglos tipados para tipos de elementos específicos, que se enumeran a continuación. En las siguientes páginas, encontrarás propiedades y métodos comunes que se pueden utilizar con cualquier arreglo tipado que contenga elementos de cualquier tipo.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/typedarray-constructor.html")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<dl>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>ECMAScript 2015 define un constructor <code><var>TypedArray</var></code> que sirve como <code>[[Prototype]]</code> de todos los constructores <code><var>TypedArray</var></code>. Este constructor no está expuesto directamente: no existe una propiedad global <code>%TypedArray%</code> o <code>TypedArray</code>. Solo es accesible directamente a través de <code>Object.getPrototypeOf(Int8Array)</code> y similares. Todos los constructores de <code><var>TypedArray</var></code> heredan propiedades comunes de la función constructora <code>%TypedArray%</code>. Además, todos los prototipos de arreglos con tipo (<code><var>TypedArray.</var></code><code>prototype</code>) tienen <code>%TypedArray%.prototype</code> como su <code>[[Prototype]]</code>.</p>
+
+<p>El constructor <code>%TypedArray%</code> por sí solo no es particularmente útil. Llamarlo o usarlo en una expresión <code>new</code> arrojará un {{jsxref("TypeError")}}, excepto cuando se usa durante la creación de objetos en motores JS que admiten subclases. Actualmente no existen tales motores, por lo que <code>%TypedArray%</code> solo es útil para rellenar funciones o propiedades en todos los constructores <code><var>TypedArray</var></code>.</p>
+
+<p>Al crear una instancia de <code><var>TypedArray</var></code> (p. ej., <code>Int8Array</code>), se crea un arreglo de búfer internamente en la memoria o, si se proporciona un objeto <code>ArrayBuffer</code> como argumento del constructor, entonces se usa en su lugar. La dirección del búfer se guarda como una propiedad interna de la instancia y todos los métodos de <code>%<var>TypedArray</var>%.prototype</code>, es decir, establecer el valor y obtener valor, etc.., operan en esa dirección del arreglo de búfer.</p>
+
+<h3 id="Objetos_TypedArray">Objetos TypedArray</h3>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th class="header" scope="col">Tipo</th>
+   <th class="header" scope="col">Intervalo de valores</th>
+   <th class="header" scope="col">Tamaño en bytes</th>
+   <th class="header" scope="col">Descripción</th>
+   <th class="header" scope="col">Tipo de IDL web</th>
+   <th class="header" scope="col">Tipo C equivalente</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{jsxref("Int8Array")}}</td>
+   <td><code>-128</code> a <code>127</code></td>
+   <td>1</td>
+   <td>Dos enteros complementarios de 8 bits con signo</td>
+   <td><code>byte</code></td>
+   <td><code>int8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint8Array")}}</td>
+   <td><code>0</code> a <code>255</code></td>
+   <td>1</td>
+   <td>Entero de 8-bit sin signo</td>
+   <td><code>octet</code></td>
+   <td><code>uint8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint8ClampedArray")}}</td>
+   <td><code>0</code> a <code>255</code></td>
+   <td>1</td>
+   <td>Entero de 8 bits sin signo (sujeto)</td>
+   <td><code>octet</code></td>
+   <td><code>uint8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Int16Array")}}</td>
+   <td><code>-32768</code> a <code>32767</code></td>
+   <td>2</td>
+   <td>Dos enteros complementarios de 16 bits con signo</td>
+   <td><code>short</code></td>
+   <td><code>int16_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint16Array")}}</td>
+   <td><code>0</code> a <code>65535</code></td>
+   <td>2</td>
+   <td>Entero de 16 bits sin signo</td>
+   <td><code>Short sin signo</code></td>
+   <td><code>uint16_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Int32Array")}}</td>
+   <td><code>-2147483648</code> a <code>2147483647</code></td>
+   <td>4</td>
+   <td>dos enteros complementarios de 32 bits con signo</td>
+   <td><code>long</code></td>
+   <td><code>int32_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Uint32Array")}}</td>
+   <td><code>0</code> a <code>4294967295</code></td>
+   <td>4</td>
+   <td>Enteros de 32 bits sin signo</td>
+   <td><code>long sin signo</code></td>
+   <td><code>uint32_t</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Float32Array")}}</td>
+   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>38</sup></code></td>
+   <td>4</td>
+   <td>Número de coma flotante IEEE de 32 bits (7 dígitos significativos, p. ej., <code>1.1234567</code>)</td>
+   <td><code>float sin restricciones</code></td>
+   <td><code>float</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("Float64Array")}}</td>
+   <td><code>5.0</code><span>×</span><code>10<sup>-324</sup></code> a <code>1.8</code><span>×</span><code>10<sup>308</sup></code></td>
+   <td>8</td>
+   <td>Número de coma flotante IEEE de 64 bits (16 dígitos significativos, p. Ej., <code>1.123...15</code>)</td>
+   <td><code>doble sin restricciones</code></td>
+   <td><code>double</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("BigInt64Array")}}</td>
+   <td><code>-2<sup>63</sup></code> a <code>2<sup>63</sup>-1</code></td>
+   <td>8</td>
+   <td>Dos enteros complementarios de 64 bits con signo</td>
+   <td><code>bigint</code></td>
+   <td><code>int64_t (long long con signo)</code></td>
+  </tr>
+  <tr>
+   <td>{{jsxref("BigUint64Array")}}</td>
+   <td><code>0</code> a <code>2<sup>64</sup>-1</code></td>
+   <td>8</td>
+   <td>Entero de 64 bits sin signo</td>
+   <td><code>bigint</code></td>
+   <td><code>uint64_t (long long sin signo)</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Constructor">Constructor</h2>
+
+<p>No se puede crear una instancia de este objeto directamente. En su lugar, crea una instancia de un arreglo de un tipo particular, tal como {{jsxref("Int8Array")}} o {{jsxref("BigInt64Array")}}. Todos estos objetos tienen una sintaxis común para sus constructores:</p>
+
+<pre class="syntaxbox notranslate">new <var>TypedArray</var>();
+new <var>TypedArray</var>(<var>length</var>);
+new <var>TypedArray</var>(<var>typedArray</var>);
+new <var>TypedArray</var>(<var>object</var>);
+new <var>TypedArray</var>(<var>buffer</var> [, <var>byteOffset</var> [, <var>length</var>]]);
+</pre>
+
+<p>Donde <var>TypedArray</var> es un constructor para uno de los tipos concretos.</p>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>length</var></code></dt>
+ <dd>Cuando se llama con un argumento <code><var>length</var></code>, se crea un búfer de arreglo interno en la memoria, de tamaño <code><var>length</var></code> <em>multiplicado por <code>BYTES_PER_ELEMENT</code></em> bytes, que contienen ceros.</dd>
+ <dt><code><var>typedArray</var></code></dt>
+ <dd>Cuando se llama con un argumento <code>typedArray</code>, que puede ser un objeto de cualquiera de los tipos de arreglo con tipo (como <code>Int32Array</code>), el <code><var>typedArray</var></code> se copia en un nuevo arreglo tipado. Cada valor en <code><var>typedArray</var></code> se convierte al tipo correspondiente del constructor antes de ser copiado en el nuevo arreglo. La longitud del nuevo arreglo tipado será la misma que la longitud del argumento <code><var>typedArray</var></code>.</dd>
+ <dt><code><var>object</var></code></dt>
+ <dd>Cuando se llama con un argumento <code><var>object</var></code>, se crea un nuevo arreglo tipado como si fuera el método <code><var>TypedArray</var>.from()</code>.</dd>
+ <dt><code><var>buffer</var></code>, <code><var>byteOffset</var></code>, <code><var>length</var></code></dt>
+ <dd>Cuando se llama con un <code><var>buffer</var></code> y, opcionalmente, un <code><var>byteOffset</var></code> y un <code><var>length</var></code>, se crea una nueva vista del arreglo tipado que visualiza el {{jsxref("ArrayBuffer")}} especificado. Los parámetros <code><var>byteOffset</var></code> y <code><var>length</var></code> especifican el rango de memoria que será expuesto por la vista del arreglo tipado. Si se omiten ambos, se visualiza todo el <code><var>buffer</var></code>; si solo se omite <code><var>length</var></code>, se visualiza el resto de <code><var>buffer</var></code>.</dd>
+</dl>
+
+<h2 id="Propiedades_estáticas">Propiedades estáticas</h2>
+
+<dl>
+ <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT")}}</dt>
+ <dd>Devuelve un valor numérico del tamaño del elemento para los diferentes objetos <code><var>TypedArray</var></code>.</dd>
+ <dt>{{jsxref("TypedArray.name")}}</dt>
+ <dd>Devuelve el valor de cadena del nombre del constructor (por ejemplo, <code>"Int8Array"</code>).</dd>
+ <dt>{{jsxref("TypedArray.@@species", "get TypedArray[@@species]")}}</dt>
+ <dd>La función constructora utilizada para crear objetos derivados.</dd>
+ <dt>{{jsxref("TypedArray.prototype")}}</dt>
+ <dd>Prototipo para objetos <code><var>TypedArray</var></code>.</dd>
+</dl>
+
+<h2 id="Métodos_estáticos">Métodos estáticos</h2>
+
+<dl>
+ <dt>{{jsxref("TypedArray.from()")}}</dt>
+ <dd>Crea un nuevo <code><var>TypedArray</var></code> a partir de un objeto iterable o similar a un arreglo. Consulta también {{jsxref("Array.from()")}}.</dd>
+ <dt>{{jsxref("TypedArray.of()")}}</dt>
+ <dd>Crea un nuevo <code><var>TypedArray</var></code> con un número variable de argumentos. Consulta también {{jsxref("Array.of()")}}.</dd>
+</dl>
+
+<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
+
+<dl>
+ <dt>{{jsxref("TypedArray.prototype.buffer")}}</dt>
+ <dd>Devuelve el {{jsxref("ArrayBuffer")}} al que hace referencia el arreglo tipado. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura</strong>.</dd>
+ <dt>{{jsxref("TypedArray.prototype.byteLength")}}</dt>
+ <dd>Devuelve la longitud (en bytes) del arreglo tipado. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura.</strong></dd>
+ <dt>{{jsxref("TypedArray.prototype.byteOffset")}}</dt>
+ <dd>Devuelve el desplazamiento (en bytes) del arreglo tipado desde el inicio de su {{jsxref("ArrayBuffer")}}. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura.</strong></dd>
+ <dt>{{jsxref("TypedArray.prototype.length")}}</dt>
+ <dd>Devuelve el número de elementos contenidos en el arreglo tipado. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura.</strong></dd>
+</dl>
+
+<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
+
+<dl>
+ <dt>{{jsxref("TypedArray.prototype.copyWithin()")}}</dt>
+ <dd>Copia una secuencia de elementos de arreglo dentro del arreglo. Consulta también {{jsxref("Array.prototype.copyWithin()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.entries()")}}</dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los pares clave/valor para cada índice del arreglo. Consulta también {{jsxref("Array.prototype.entries()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.every()")}}</dt>
+ <dd>Comprueba si todos los elementos del arreglo pasan la prueba proporcionada por una función. Consulta también {{jsxref("Array.prototype.every()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.fill()")}}</dt>
+ <dd>Rellena todos los elementos de un arreglo desde un índice inicial hasta un índice final con un valor estático. Consulta también {{jsxref("Array.prototype.fill()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.filter()")}}</dt>
+ <dd>Crea un nuevo arreglo con todos los elementos de este arreglo para la cual la función de filtrado proporcionada devuelve <code>true</code>. Consulta también {{jsxref("Array.prototype.filter()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.find()")}}</dt>
+ <dd>Devuelve el valor encontrado en el arreglo, si un elemento del arreglo satisface la función de prueba proporcionada, o <code>undefined</code> si no se encuentra. Consulta también {{jsxref("Array.prototype.find()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.findIndex()")}}</dt>
+ <dd>Devuelve el índice encontrado en el arreglo, si un elemento del arreglo satisface la función de prueba proporcionada o <code>-1</code> si no se encuentra. Consulta también {{jsxref("Array.prototype.findIndex()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.forEach()")}}</dt>
+ <dd>Llama a una función para cada elemento del arreglo. Consulta también {{jsxref("Array.prototype.forEach()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.includes()")}}</dt>
+ <dd>Determina si un arreglo tipado incluye un determinado elemento, devolviendo <code>true</code> o <code>false</code> según corresponda. Consulta también {{jsxref("Array.prototype.includes()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.indexOf()")}}</dt>
+ <dd>Devuelve el primer (mínimo) índice de un elemento dentro del arreglo igual al valor especificado, o <code>-1</code> si no se encuentra ninguno. Consulta también {{jsxref("Array.prototype.indexOf()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.join()")}}</dt>
+ <dd>Une todos los elementos de un arreglo en una cadena. Consulta también {{jsxref("Array.prototype.join()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.keys()")}}</dt>
+ <dd>Devuelve un nuevo <code>Array Iterator</code> que contiene las claves para cada índice del arreglo. Consulta también {{jsxref("Array.prototype.keys()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</dt>
+ <dd>Devuelve el último (mayor) índice de un elemento dentro del arreglo igual al valor especificado, o <code>-1</code> si no se encuentra ninguno. Consulta también {{jsxref("Array.prototype.lastIndexOf()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.map()")}}</dt>
+ <dd>Crea un nuevo arreglo con los resultados de llamar a una función proporcionada en cada elemento de este arreglo. Consulta también {{jsxref("Array.prototype.map()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.reduce()")}}</dt>
+ <dd>Aplica una función contra un acumulador y cada valor del arreglo (de izquierda a derecha) para reducirlo a un solo valor. Consulta también {{jsxref("Array.prototype.reduce()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.reduceRight()")}}</dt>
+ <dd>Aplica una función contra un acumulador y cada valor del arreglo (de derecha a izquierda) para reducirlo a un solo valor. Consulta también {{jsxref("Array.prototype.reduceRight()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.reverse()")}}</dt>
+ <dd>Invierte el orden de los elementos de un arreglo: el primero se convierte en el último y el último en el primero. Consulta también {{jsxref("Array.prototype.reverse()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.set()")}}</dt>
+ <dd>Almacena múltiples valores en el arreglo tipado, leyendo valores de entrada de un arreglo especificado.</dd>
+ <dt>{{jsxref("TypedArray.prototype.slice()")}}</dt>
+ <dd>Extrae una sección de un arreglo y devuelve un nuevo arreglo. Consulta también {{jsxref("Array.prototype.slice()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.some()")}}</dt>
+ <dd>Devuelve <code>true</code> si al menos un elemento de este arreglo satisface la función de prueba proporcionada. Consulta también {{jsxref("Array.prototype.some()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.sort()")}}</dt>
+ <dd>Ordena los elementos de un arreglo en su lugar y devuelve el arreglo. Consulta también {{jsxref("Array.prototype.sort()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.subarray()")}}</dt>
+ <dd>Devuelve un nuevo <code><var>TypedArray</var></code> del índice del elemento inicial y final dado.</dd>
+ <dt>{{jsxref("TypedArray.prototype.values()")}}</dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores de cada índice del arreglo. Consulta también {{jsxref("Array.prototype.values()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.toLocaleString()")}}</dt>
+ <dd>Devuelve una cadena localizada que representa el arreglo y sus elementos. Consulta también {{jsxref("Array.prototype.toLocaleString()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.toString()")}}</dt>
+ <dd>Devuelve una cadena que representa el arreglo y sus elementos. Consulta también {{jsxref("Array.prototype.toString()")}}.</dd>
+ <dt>{{jsxref("TypedArray.prototype.@@iterator()", "TypedArray.prototype[@@iterator]()")}}</dt>
+ <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores de cada índice del arreglo.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Se_requiere_new">Se requiere <code>new</code></h3>
+
+<p>A partir de ECMAScript 2015, los constructores <code>TypedArray</code> se deben construir con el operador {{jsxref("Operators/new", "new")}}. Llamar a un constructor <code>TypedArray</code> como una función sin <code>new</code> arrojará un {{jsxref("TypeError")}}.</p>
+
+<pre class="brush: js example-bad notranslate">var dv = Int8Array([1, 2, 3]);
+// TypeError: llamar a un constructor Int8Array incorporado
+// sin new está prohibido</pre>
+
+<pre class="brush: js example-good notranslate">var dv = new Int8Array([1, 2, 3]);</pre>
+
+<h3 id="Acceso_a_la_propiedad">Acceso a la propiedad</h3>
+
+<p>Puedes hacer referencia a elementos en el arreglo utilizando la sintaxis de índice de arreglo estándar (es decir, utilizando la notación entre corchetes). Sin embargo, obtener o establecer propiedades indexadas en arreglos tipados no buscará esta propiedad en la cadena de prototipos, incluso cuando los índices estén fuera de límites. Las propiedades indexadas consultarán el {{jsxref("ArrayBuffer")}} y nunca mirarán las propiedades del objeto. Aún puedes usar propiedades con nombre, al igual que con todos los objetos.</p>
+
+<pre class="brush: js notranslate">// Configuración y obtención usando la sintaxis de arreglo estándar
+var int16 = new Int16Array(2);
+int16[0] = 42;
+[parcial]console.log(0);
+
+// No se consultan las propiedades indexadas en los prototipos (Fx 25)
+Int8Array.prototype[20] = 'foo';
+(new Int8Array(32))[20]; // 0
+// incluso cuando está fuera del límite
+Int8Array.prototype[20] = 'foo';
+(new Int8Array(8))[20]; // undefined
+// o con enteros negativos
+Int8Array.prototype[-1] = 'foo';
+(new Int8Array(8))[-1]; // undefined
+
+// Sin embargo, se permiten propiedades con nombre (Fx 30)
+Int8Array.prototype.foo = 'bar';
+(new Int8Array(32)).foo; // "bar"</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-typedarray-objects', 'TypedArray Objects')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.TypedArray")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Typed_arrays" title="es/JavaScript arreglos tipados">Arreglos tipados JavaScript</a></li>
+ <li>{{jsxref("ArrayBuffer")}}</li>
+ <li>{{jsxref("DataView")}}</li>
+ <li><a href="/es/docs/Web/API/TextDecoder">TextDecoder</a> — Ayuda que decodifica cadenas a partir de datos numéricos</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/uint8array/index.html b/files/es/web/javascript/reference/global_objects/uint8array/index.html
new file mode 100644
index 0000000000..9027d9e1b0
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/uint8array/index.html
@@ -0,0 +1,261 @@
+---
+title: Uint8Array
+slug: Web/JavaScript/Reference/Global_Objects/Uint8Array
+tags:
+  - Arreglo
+  - JavaScript
+  - array de enteros
+translation_of: Web/JavaScript/Reference/Global_Objects/Uint8Array
+original_slug: Web/JavaScript/Referencia/Objetos_globales/Uint8Array
+---
+<div>{{JSRef}}</div>
+
+<p>Los <strong><code>Uint8Array</code></strong> representan un array de enteros sin signo de 8 bits. El contenido se inicializa a 0. Una vez establecido, puedes hacer referencia a un elemento usando los métodos del objeto o usando la sintaxis de array estándar (esto es, usando la notación de corchetes).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">new Uint8Array(tamaño);
+new Uint8Array(typedArray);
+new Uint8Array(objeto);
+new Uint8Array(buffer [, byteOffset [, tamaño]]);</pre>
+
+<p>Para más información acerca de la sintaxis del constructor y sus parámetros, mire <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Uint8Array.BYTES_PER_ELEMENT")}}</dt>
+ <dd>Retorna un número con el valor del tamaño del elemento. <code>1</code> en el caso del <code>Uint8Array</code>.</dd>
+ <dt>Uint8Array.length</dt>
+ <dd>Propiedad estática de tamaño cuyo valor es 3. Para el tamaño actual (número d elementos), mire {{jsxref("TypedArray.prototype.length", "Uint8Array.prototype.length")}}.</dd>
+ <dt>{{jsxref("TypedArray.name", "Uint8Array.name")}}</dt>
+ <dd>Devuelve el nombre del constructor en un string. En el caso de <code>Uint8Array</code> devuelve: "Uint8Array".</dd>
+ <dt>{{jsxref("TypedArray.prototype", "Uint8Array.prototype")}}</dt>
+ <dd>Prototipo para los objetos <em>TypedArray</em> .</dd>
+</dl>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("TypedArray.from", "Uint8Array.from()")}}</dt>
+ <dd>Crea un nuevo <code>Uint8Array</code> desde un array o un objeto iterable. Véase también {{jsxref("Array.from()")}}.</dd>
+ <dt>{{jsxref("TypedArray.of", "Uint8Array.of()")}}</dt>
+ <dd>Crea un  <code>Uint8Array con un número variable de argumentos</code>. Véase también {{jsxref("Array.of()")}}.</dd>
+</dl>
+
+<h2 id="Uint8Array_prototype"><code>Uint8Array</code> prototype</h2>
+
+<p>Todos los objetos <code>Uint8Array</code> son heredados de {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.</p>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<dl>
+ <dt><code>Uint8Array.prototype.constructor</code></dt>
+ <dd>Retorna la función que crea una instancia del prototype. Éste es el constructor por defecto de <code>Uint8Array</code>.</dd>
+ <dt>{{jsxref("TypedArray.prototype.buffer", "Uint8Array.prototype.buffer")}} {{readonlyInline}}</dt>
+ <dd>Retorna el {{jsxref("ArrayBuffer")}} con la referencia del <code>Uint8Array. </code>Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
+ <dt>{{jsxref("TypedArray.prototype.byteLength", "Uint8Array.prototype.byteLength")}} {{readonlyInline}}</dt>
+ <dd>Retorna el tamaño (en bytes) del array <code>Uint8Array</code>. Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
+ <dt>{{jsxref("TypedArray.prototype.byteOffset", "Uint8Array.prototype.byteOffset")}} {{readonlyInline}}</dt>
+ <dd>Retorna el offset (en bytes) del <code>Uint8Array</code> desde el inicio de su  {{jsxref("ArrayBuffer")}}. Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
+ <dt>{{jsxref("TypedArray.prototype.length", "Uint8Array.prototype.length")}} {{readonlyInline}}</dt>
+ <dd>Retorna el número de elementos contenidos en el <code>Uint8Array</code>. Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
+</dl>
+
+<h3 id="Métodos_2">Métodos</h3>
+
+<dl>
+ <dt>{{jsxref("TypedArray.copyWithin", "Uint8Array.prototype.copyWithin()")}}</dt>
+ <dd>Copia una secuencia de elementos del array dentro del array. Véase también {{jsxref("Array.prototype.copyWithin()")}}.</dd>
+ <dt>{{jsxref("TypedArray.entries", "Uint8Array.prototype.entries()")}}</dt>
+ <dd>Retorna un nuevo objeto <code>Array Iterator</code> que contiene los pares de valores para cada índice del array. Véase también {{jsxref("Array.prototype.entries()")}}.</dd>
+ <dt>{{jsxref("TypedArray.every", "Uint8Array.prototype.every()")}}</dt>
+ <dd>Prueba si todos los elementos del array cumplen las condiciones de una función. Véase también {{jsxref("Array.prototype.every()")}}.</dd>
+ <dt>{{jsxref("TypedArray.fill", "Uint8Array.prototype.fill()")}}</dt>
+ <dd>Llena todos los elementos del array desde el principio hasta el final con un valor dado. Véase también {{jsxref("Array.prototype.fill()")}}.</dd>
+ <dt>{{jsxref("TypedArray.filter", "Uint8Array.prototype.filter()")}}</dt>
+ <dd>Crea un nuevo array con todos los elementos del array que satisfacen las condiciones de una función que devuelve verdadero. Véase también {{jsxref("Array.prototype.filter()")}}.</dd>
+ <dt>{{jsxref("TypedArray.find", "Uint8Array.prototype.find()")}}</dt>
+ <dd>Devuelve el valor encontrado en el array, si un elemento del array satisface una función dada de prueba o undefined si no es encontrada. Véase también {{jsxref("Array.prototype.find()")}}.</dd>
+ <dt>{{jsxref("TypedArray.findIndex", "Uint8Array.prototype.findIndex()")}}</dt>
+ <dd>Devuelve el índice encontrado en el array, si un elemento del array satisface una función dada de prueba o -1 si no es encontrada. Véase también {{jsxref("Array.prototype.findIndex()")}}.</dd>
+ <dt>{{jsxref("TypedArray.forEach", "Uint8Array.prototype.forEach()")}}</dt>
+ <dd>Llama a una función para cada elemento del array. Véase también {{jsxref("Array.prototype.forEach()")}}.</dd>
+ <dt>{{jsxref("TypedArray.includes", "Uint8Array.prototype.includes()")}} {{experimental_inline}}</dt>
+ <dd>Determina si un <font face="consolas, Liberation Mono, courier, monospace">array</font> incluye un cierto elemento, retornando <code>true</code> o <code>false</code> según corresponda. Véase también {{jsxref("Array.prototype.includes()")}}.</dd>
+ <dt>{{jsxref("TypedArray.indexOf", "Uint8Array.prototype.indexOf()")}}</dt>
+ <dd>Devuelve el primer (menor) índice de un elemento dentro del array igual al valor especificado, o -1 si no es encontrado. Véase también {{jsxref("Array.prototype.indexOf()")}}.</dd>
+ <dt>{{jsxref("TypedArray.join", "Uint8Array.prototype.join()")}}</dt>
+ <dd>Une todos los elementos de un array a una cadena.  Véase también {{jsxref("Array.prototype.join()")}}.</dd>
+ <dt>{{jsxref("TypedArray.keys", "Uint8Array.prototype.keys()")}}</dt>
+ <dd>Retorna un nuevo <code>Array Iterator</code> que contiene las claves para cada índice en el array. Véase también {{jsxref("Array.prototype.keys()")}}.</dd>
+ <dt>{{jsxref("TypedArray.lastIndexOf", "Uint8Array.prototype.lastIndexOf()")}}</dt>
+ <dd>Devuelve el último (mayor) índice de un elemento dentro del array igual al valor especificado, o -1 si no fue encontrado. Véase también {{jsxref("Array.prototype.lastIndexOf()")}}.</dd>
+ <dt>{{jsxref("TypedArray.map", "Uint8Array.prototype.map()")}}</dt>
+ <dd>Crea un nuevo array con los resultados de la llamada a la función indicada aplicados a cada uno de sus elementos. Véase también {{jsxref("Array.prototype.map()")}}.</dd>
+ <dt>{{jsxref("TypedArray.move", "Uint8Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt>
+ <dd>Primera versión no-estandar de {{jsxref("TypedArray.copyWithin", "Uint8Array.prototype.copyWithin()")}}.</dd>
+ <dt>{{jsxref("TypedArray.reduce", "Uint8Array.prototype.reduce()")}}</dt>
+ <dd>
+ <p>Aplica una función a un acumulador y a cada valor de un array (de izquierda a derecha) para reducirlo a un único valor. Véase también {{jsxref("Array.prototype.reduce()")}}.</p>
+ </dd>
+ <dt>{{jsxref("TypedArray.reduceRight", "Uint8Array.prototype.reduceRight()")}}</dt>
+ <dd>Aplica una función a un acumulador y a cada valor de un array (de derecha a izquierda) para reducirlo a un único valor. Véase también {{jsxref("Array.prototype.reduceRight()")}}.</dd>
+ <dt>{{jsxref("TypedArray.reverse", "Uint8Array.prototype.reverse()")}}</dt>
+ <dd>Inverte el orden de los elementos de un array, el primero se convierte en el último y el último en el primero. See also {{jsxref("Array.prototype.reverse()")}}.</dd>
+ <dt>{{jsxref("TypedArray.set", "Uint8Array.prototype.set()")}}</dt>
+ <dd>Almacena múltiples valores en el array, leyendo los valores de entrada de un array específico.</dd>
+ <dt>{{jsxref("TypedArray.slice", "Uint8Array.prototype.slice()")}}</dt>
+ <dd>Extrae una porción de un array y devuelve uno nuevo. Véase también {{jsxref("Array.prototype.slice()")}}.</dd>
+ <dt>{{jsxref("TypedArray.some", "Uint8Array.prototype.some()")}}</dt>
+ <dd>Devuelve <code>true</code> si al menos un elemento de este array satisface la función de prueba proporcionada. Véase también {{jsxref("Array.prototype.some()")}}.</dd>
+ <dt>{{jsxref("TypedArray.sort", "Uint8Array.prototype.sort()")}}</dt>
+ <dd>Ordena los elementos de un array localmente y devuelve el array. Véase también {{jsxref("Array.prototype.sort()")}}.</dd>
+ <dt>{{jsxref("TypedArray.subarray", "Uint8Array.prototype.subarray()")}}</dt>
+ <dd>Retorna un nuevo <code>Uint8Array</code> desde el índice de elementos iniciales y finales proporcionados.</dd>
+ <dt>{{jsxref("TypedArray.values", "Uint8Array.prototype.values()")}}</dt>
+ <dd>Retorna un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array. Véase también {{jsxref("Array.prototype.values()")}}.</dd>
+ <dt>{{jsxref("TypedArray.toLocaleString", "Uint8Array.prototype.toLocaleString()")}}</dt>
+ <dd>Devuelve una cadena localizada que representa el array y sus elementos. Véase también {{jsxref("Array.prototype.toLocaleString()")}}.</dd>
+ <dt>{{jsxref("TypedArray.toString", "Uint8Array.prototype.toString()")}}</dt>
+ <dd>Retorna una cadena representando el array sus elementos. Véase también {{jsxref("Array.prototype.toString()")}}.</dd>
+ <dt>{{jsxref("TypedArray.@@iterator", "Uint8Array.prototype[@@iterator]()")}}</dt>
+ <dd>Retorna un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">// Desde una longitud
+var uint8 = new Uint8Array(2);
+uint8[0] = 42;
+console.log(uint8[0]); // 42
+console.log(uint8.length); // 2
+console.log(uint8.BYTES_PER_ELEMENT); // 1
+
+// Desde un array
+var arr = new Uint8Array([21,31]);
+console.log(arr[1]); // 31
+
+// Desde otro TypedArray
+var x = new Uint8Array([21, 31]);
+var y = new Uint8Array(x);
+console.log(y[0]); // 21
+
+// Desde un ArrayBuffer
+var buffer = new ArrayBuffer(8);
+var z = new Uint8Array(buffer, 1, 4);
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('Typed Array')}}</td>
+   <td>{{Spec2('Typed Array')}}</td>
+   <td>Sustituida por ECMAScript 6.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial en un ECMA standard. Se especificó que <code>new</code> es requirerido.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>7.0</td>
+   <td>{{ CompatGeckoDesktop(2) }}</td>
+   <td>10</td>
+   <td>11.6</td>
+   <td>5.1</td>
+  </tr>
+  <tr>
+   <td><code>new</code> es requerido</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{ CompatGeckoDesktop(44) }}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>4.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile(2) }}</td>
+   <td>10</td>
+   <td>11.6</td>
+   <td>4.2</td>
+  </tr>
+  <tr>
+   <td><code>new</code> es requerido</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{ CompatGeckoMobile(44) }}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
+
+<p>A partir de ECMAScript 2015 (ES6), los constructors de <code>Uint8Array</code> requiren ser construidos con un operador {{jsxref("Operators/new", "new")}}. Llamar a un contructor de <code>Uint8Array</code> como una función sin <code>new</code>, lanzará un {{jsxref("TypeError")}} de ahora en adelante.</p>
+
+<pre class="brush: js example-bad">var dv = Uint8Array([1, 2, 3]);
+// TypeError: calling a builtin Uint8Array constructor
+// without new is forbidden</pre>
+
+<pre class="brush: js example-good">var dv = new Uint8Array([1, 2, 3]);</pre>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li>
+ <li>{{jsxref("ArrayBuffer")}}</li>
+ <li>{{jsxref("DataView")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/undefined/index.html b/files/es/web/javascript/reference/global_objects/undefined/index.html
new file mode 100644
index 0000000000..7f29697655
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/undefined/index.html
@@ -0,0 +1,184 @@
+---
+title: undefined
+slug: Web/JavaScript/Reference/Global_Objects/undefined
+tags:
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Global_Objects/undefined
+original_slug: Web/JavaScript/Referencia/Objetos_globales/undefined
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>La propiedad global <strong>undefined</strong> representa el valor primitivo <code>{{Glossary("Undefined", "undefined")}}</code>. Es uno de los {{Glossary("Primitive", "valores primitivos")}} de JavaScript.</p>
+
+<p>{{js_property_attributes(0,0,0)}}</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>undefined</code></pre>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p><code>undefined</code> es una propiedad del <em>objeto global</em>, es decir, una variable de alcance global. El valor inicial de <code>undefined</code> es el valor primitivo <code>{{Glossary("Undefined", "undefined")}}</code>.<span class="comment">this needs clarification, but that would require explaining primitive values</span></p>
+
+<p>En navegadores modernos (JavaScript 1.8.5 / Firefox 4+), <code>undefined </code>es una propiedad <em>no-configurable</em>, <em>no-grabable</em> según la especificación ECMAScript 5. Aún cuando este no sea el caso, evite sobreescribirlo.</p>
+
+<p>Una variable a la que no se le ha asignado valor, o no se ha declarado en absoluto (no se declara, no existe) son de tipo <code>undefined</code>. Un método o sentencia también devuelve <code>undefined</code> si la variable que se está evaluando no tiene asignado un valor. Una función devuelve <code>undefined</code> si no se ha {{jsxref("Sentencias/return", "devuelto")}} un valor.</p>
+
+<div class="blockIndicator note">
+<p>Ten en cuenta que si no se ha declarado una variable ni explícita ni implícitamente, no puedes compararla con <strong>undefined  </strong>ya que obtendrías un <strong><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError">ReferenceError</a>, </strong> pero puedes comparar su tipo con la cadena (<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/String">String</a>) "undefined". En el ejemplo más abajo se podrá ver cómo conseguir esto usando el operador <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/typeof">typeof</a>.</p>
+</div>
+
+<div class="warning">
+<p>Aunque es posible usarlo como un {{Glossary("Identifier", "identificador")}} (nombre de variable) en cualquier otro ámbito que no sea el ámbito global (porque <code>undefined </code>no es una {{jsxref("Reserved_Words", "palabra reservada")}}), hacerlo es una mala idea que provocará que tú código sea difícil de mantener y depurar.</p>
+
+<pre class="brush: js">//NO HAGAS ESTO
+
+// registra "foo string"
+(function(){ var undefined = 'foo'; console.log(undefined, typeof undefined); })()
+
+// registra "foo string"
+(function(undefined){ console.log(undefined, typeof undefined); })('foo');</pre>
+</div>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Ejemplos</h2>
+
+<h3 id="Igualdad_estricta_y_undefined">Igualdad estricta y <code>undefined</code></h3>
+
+<p>Puedes usar <code>undefined</code> y los operadores de igualdad y desigualdad estricta para determinar si una variable tiene un valor asignado. En el siguiente ejemplo la variable <code>x</code> no está inicializada, y la sentencia <code>if</code> se evalúa como verdadera.</p>
+
+<pre class="brush: js">var x;
+if (x === undefined) {
+   // se ejecutan estas instrucciones
+}
+else {
+   // estas instrucciones no se ejecutan
+}</pre>
+
+<div class="note">
+<p>Nota: Aquí se debe usar el operador de igualdad estricta en lugar del operador de igualdad estándar, ya que <code>x == undefined</code> también verifica si <code>x</code> es <code>null</code>, mientras que el de igualdad estricta no. <code>null</code> no es equivalente a <code>undefined</code>. Vea {{jsxref("Operadores/Comparison_Operators", "operadores de comparación")}} para más detalles.</p>
+</div>
+
+<h3 id="Typeof_operador_y_undefined">Typeof operador y <code>undefined</code></h3>
+
+<p>Alternativamente se puede usar {{jsxref("Operadores/typeof","typeof")}}.  Recuerda que este siempre devolverá una cadena de texto con el tipo:</p>
+
+<pre class="brush: js">var x;
+if (typeof x === 'undefined') {
+   // se ejecutan estas instrucciones
+}
+</pre>
+
+<p>Una razón para usar {{jsxref("Operadores/typeof","typeof")}} es que no devuelve un error si la variable no fue declarada.</p>
+
+<pre class="brush: js">// x no fue declarada antes
+if (typeof x === 'undefined') { // devuelve true
+   //se ejecutan estas instrucciones
+}
+
+if (x === undefined) { // lanza un ReferenceError
+
+}
+</pre>
+
+<p>Sin embargo, este tipo de técnica debe evitarse. JavaScript es un lenguaje de ámbito estático, por lo que determinar si una variable se encuentra declarada puede ser definido al ver si está declarada en un contexto de inclusión. La única excepción es el ámbito global, pero el ámbito global está vinculado al objeto global, por lo que comprobar la existencia de una variable en el contexto global puede realizarse comprobando la existencia de una propiedad del <em>objeto global</em> (utilizando el operador {{jsxref("Operators/in", "in")}}, por ejemplo).</p>
+
+<h3 id="Operador_void_y_undefined">Operador void y <code>undefined</code></h3>
+
+<p>El operador {{jsxref("Operadores/void", "void")}} es una tercer alternativa.</p>
+
+<pre class="brush: js">var x;
+if (x === void 0) {
+   // se ejecutan estas instrucciones
+}
+
+// y no fue declarada antes
+if (y === void 0) {
+   // lanza un ReferenceError (a diferencia de  `typeof`)
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-4.3.9', 'undefined')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.3.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.1.1.3', 'undefined')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-undefined', 'undefined')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-undefined', 'undefined')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/es/web/javascript/reference/global_objects/unescape/index.html b/files/es/web/javascript/reference/global_objects/unescape/index.html
new file mode 100644
index 0000000000..8dc207db78
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/unescape/index.html
@@ -0,0 +1,124 @@
+---
+title: unescape()
+slug: Web/JavaScript/Reference/Global_Objects/unescape
+translation_of: Web/JavaScript/Reference/Global_Objects/unescape
+original_slug: Web/JavaScript/Referencia/Objetos_globales/unescape
+---
+<div>{{jsSidebar("Objects")}}</div>
+
+<p>La función deprecada <code><strong>unescape()</strong></code> calcula un nuevo string  en el cual secuencia de valores hexadecimales son reemplazados con el caracter que representa. La secuencia de calculo deber{ia ser introducida por una función como {{jsxref("escape")}}. Por que <code>unescape</code> está deprecada, usar {{jsxref("decodeURI")}} or {{jsxref("decodeURIComponent")}}.</p>
+
+<div class="note"><strong>Note:</strong> Do not use <code>unescape</code> to decode URIs, use <code>decodeURI</code> instead.</div>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code>unescape(str)</code></pre>
+
+<h3 id="Parameters">Parameters</h3>
+
+<dl>
+ <dt><code>str</code></dt>
+ <dd>A string to be decoded.</dd>
+</dl>
+
+<h2 id="Description">Description</h2>
+
+<p>The <code>unescape</code> function is a property of the <em>global object</em>.</p>
+
+<h2 id="Examples">Examples</h2>
+
+<pre class="brush: js">unescape("abc123");     // "abc123"
+unescape("%E4%F6%FC");  // "äöü"
+unescape("%u0107");     // "ć"
+</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-15.1.2.5', 'unescape')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-B.2.2', 'unescape')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Defined in the (informative) Compatibility Annex B</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-unescape-string', 'unescape')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-unescape-string', 'unescape')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("decodeURI")}}</li>
+ <li>{{jsxref("decodeURIComponent")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/urierror/index.html b/files/es/web/javascript/reference/global_objects/urierror/index.html
new file mode 100644
index 0000000000..cfe212746e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/urierror/index.html
@@ -0,0 +1,137 @@
+---
+title: URIError
+slug: Web/JavaScript/Reference/Global_Objects/URIError
+tags:
+  - Error
+  - JavaScript
+  - Reference
+  - URIError
+translation_of: Web/JavaScript/Reference/Global_Objects/URIError
+original_slug: Web/JavaScript/Referencia/Objetos_globales/URIError
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <code><strong>URIError</strong></code>  representa un error cuando una función de uso URI global se usó de manera incorrecta.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox"><code>new URIError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>message</code></dt>
+ <dd>Opcional. Descripción del error legible para una persona.</dd>
+ <dt><code>fileName</code> {{non-standard_inline}}</dt>
+ <dd>Opcional. El nombre del archivo que contien el código causante de la excepción.</dd>
+ <dt><code>lineNumber</code> {{non-standard_inline}}</dt>
+ <dd>Opcional. El número de línea del código que ha causado la excepción.</dd>
+</dl>
+
+<h2 id="Description">Description</h2>
+
+<p>Se envía <code>URIError</code>  cuando las fuciones de uso del URI global pasan pro un URI con formato incorrecto.</p>
+
+<h2 id="Properties">Properties</h2>
+
+<dl>
+ <dt>{{jsxref("URIError.prototype")}}</dt>
+ <dd>Permite agregar propiedades a un objeto URIError</dd>
+</dl>
+
+<h2 id="Methods">Methods</h2>
+
+<p>El <code>URIError</code> global no contiene métodos propios, sin embargo, sí hereda algunos métodos a través de la cadena de prototipos.</p>
+
+<h2 id="URIError_instancias"><code>URIError</code> instancias</h2>
+
+<h3 id="Propiedades">Propiedades</h3>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/URIError/prototype', 'Properties')}}</div>
+
+<h3 id="Métodos">Métodos</h3>
+
+<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/URIError/prototype', 'Methods')}}</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Recoger_un_URIError">Recoger un <code>URIError</code></h3>
+
+<pre class="brush: js">try {
+  decodeURIComponent('%');
+} catch (e) {
+  console.log(e instanceof URIError); // true
+  console.log(e.message);             // "malformed URI sequence"
+  console.log(e.name);                // "URIError"
+  console.log(e.fileName);            // "Scratchpad/1"
+  console.log(e.lineNumber);          // 2
+  console.log(e.columnNumber);        // 2
+  console.log(e.stack);               // "@Scratchpad/2:2:3\n"
+}
+</pre>
+
+<h3 id="Creando_un_URIError">Creando un <code>URIError</code></h3>
+
+<pre class="brush: js">try {
+  throw new URIError('Hello', 'someFile.js', 10);
+} catch (e) {
+  console.log(e instanceof URIError); // true
+  console.log(e.message);             // "Hello"
+  console.log(e.name);                // "URIError"
+  console.log(e.fileName);            // "someFile.js"
+  console.log(e.lineNumber);          // 10
+  console.log(e.columnNumber);        // 0
+  console.log(e.stack);               // "@Scratchpad/2:2:9\n"
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3', '#sec-15.11.6.6', 'URIError')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Initial definition</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-15.11.6.6', 'URIError')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-urierror', 'URIError')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-urierror', 'URIError')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de los datos estructurados. Si desea contribuir con los datos, visite <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenes una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.URIError")}}</p>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Error")}}</li>
+ <li>{{jsxref("URIError.prototype")}}</li>
+ <li>{{jsxref("Global_Objects/decodeURI", "decodeURI()")}}</li>
+ <li>{{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent()")}}</li>
+ <li>{{jsxref("Global_Objects/encodeURI", "encodeURI()")}}</li>
+ <li>{{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/weakmap/clear/index.html b/files/es/web/javascript/reference/global_objects/weakmap/clear/index.html
new file mode 100644
index 0000000000..8437213d61
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/weakmap/clear/index.html
@@ -0,0 +1,53 @@
+---
+title: WeakMap.prototype.clear()
+slug: Web/JavaScript/Reference/Global_Objects/WeakMap/clear
+tags:
+  - JavaScript
+  - Obsolete
+  - Protocols
+  - WeakMap
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/clear
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/clear
+---
+<div>{{JSRef}} {{obsolete_header}}</div>
+
+<p>El método <code><strong>clear()</strong></code> es utilizado para suprimir todos los elementos del objeto <code>WeakMap</code>, sin embargo, ya no es parte de ECMAScript, ni de sus implementaciones.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>wm</em>.clear();</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilización_del_método_clear">Utilización del método <code>clear</code> </h3>
+
+<pre class="brush: js;highlight:[10] example-bad">var wm = new WeakMap();
+var obj = {};
+
+wm.set(obj, 'foo');
+wm.set(window, 'bar');
+
+wm.has(obj); // true
+wm.has(window); // true
+
+wm.clear();
+
+wm.has(obj)  // false
+wm.has(window)  // false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<p>No es parte de ninguna especificación actual o borrador. Este método fue parte de ECMAScript 6 como un bosquejo hasta la revisión 28 (versión de Octubre 14, 2014), sin embargo ha sido eliminado en versiones posteriores. No es parte de la última versión estándar.</p>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.WeakMap.clear")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("WeakMap")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/weakmap/delete/index.html b/files/es/web/javascript/reference/global_objects/weakmap/delete/index.html
new file mode 100644
index 0000000000..4661f1b843
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/weakmap/delete/index.html
@@ -0,0 +1,125 @@
+---
+title: WeakMap.prototype.delete()
+slug: Web/JavaScript/Reference/Global_Objects/WeakMap/delete
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Prototype
+  - WeakMap
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/delete
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/delete
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>delete()</strong></code> elimina un elemento específico del objeto <code>WeakMap</code> .</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>wm</em>.delete(key);</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>identificador (key)</dt>
+ <dd>Requerido. El identificador del elemento a eliminar en el objeto <code>WeakMap</code>.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p><code>true</code> si el elemento del objeto <code>WeakMap</code> ha sido eliminado correctamente. Y <code>false</code> si la llave a eliminar no fue encontrada en el objeto <code>WeakMap</code> o bien, si la llave no es un objeto.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilización_del_método_delete">Utilización del método <code>delete</code> </h3>
+
+<pre class="brush: js;highlight:[4]">var wm = new WeakMap();
+wm.set(window, "foo");
+
+wm.delete(window); // Devuelve true. Eliminado correctamente.
+
+wm.has(window);    // Devuelve false. El elemento window ya no es parte de WeakMap.
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-weakmap.prototype.delete', 'WeakMap.prototype.delete')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.delete', 'WeakMap.prototype.delete')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>36</td>
+   <td>{{CompatGeckoDesktop("6.0")}}</td>
+   <td>11</td>
+   <td>23</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatGeckoMobile("6.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_especificas_de_Firefox">Notas especificas de Firefox</h2>
+
+<ul>
+ <li>Anterior a SpiderMonkey 38 {{geckoRelease(38)}}, este método lanzaba {{jsxref("TypeError")}} cuando el parámetro <code>key</code> no era un objeto. Esto ha sido corregido en la versión 38 y posteriormente devuelve <code>false</code> como parte del estándar de ES6 ({{bug(1127827)}}).</li>
+</ul>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("WeakMap")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/weakmap/get/index.html b/files/es/web/javascript/reference/global_objects/weakmap/get/index.html
new file mode 100644
index 0000000000..33b02e4419
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/weakmap/get/index.html
@@ -0,0 +1,81 @@
+---
+title: WeakMap.prototype.get()
+slug: Web/JavaScript/Reference/Global_Objects/WeakMap/get
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Method
+  - Prototype
+  - WeakMap
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/get
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/get
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>get()</strong></code> devuelve un elemento específico del objeto <code>WeakMap</code>.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/weakmap-prototype-get.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>wm</em>.get(key);</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>key</dt>
+ <dd>Requerido. Es la llave del elemento a retornar desde el objeto WeakMap.</dd>
+</dl>
+
+<h3 id="Valores_devueltos">Valores devueltos</h3>
+
+<p>El elemento asociado con la llave específica en el objeto WeakMap. Si la llave no está presente, devolverá {{jsxref("undefined")}}.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_método_get">Usando el método <code>get</code> </h3>
+
+<pre class="brush: js">var wm = new WeakMap();
+wm.set(window, 'foo');
+
+wm.get(window); // Devuelve "foo".
+wm.get('baz');  // Devuelve undefined.
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-weakmap.prototype.get', 'WeakMap.prototype.get')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.get', 'WeakMap.prototype.get')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.WeakMap.get")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("WeakMap")}}</li>
+ <li>{{jsxref("WeakMap.set()")}}</li>
+ <li>{{jsxref("WeakMap.has()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/weakmap/has/index.html b/files/es/web/javascript/reference/global_objects/weakmap/has/index.html
new file mode 100644
index 0000000000..06b5c296ed
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/weakmap/has/index.html
@@ -0,0 +1,84 @@
+---
+title: WeakMap.prototype.has()
+slug: Web/JavaScript/Reference/Global_Objects/WeakMap/has
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Method
+  - Protocols
+  - WeakMap
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/has
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/has
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>has()</strong></code> devuelve un boleano indicando ya sea, si el elemento con la llave específica existe o no en el objeto <code>WeakMap</code>.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/weakmap-prototype-has.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>wm</em>.has(key);</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>identificador (key)</dt>
+ <dd>Requerido. La llave del elemento a comprobar en el objeto <code>WeakMap</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<dl>
+ <dt>Boolean</dt>
+ <dd>Devuelve <code>true</code> si el elemento con la llave específica existe en el objeto <code>WeakMap</code>; de no encontrarse, devolverá <code>false</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilización_del_método_has">Utilización del método <code>has</code> </h3>
+
+<pre class="brush: js">var wm = new WeakMap();
+wm.set(window, 'foo');
+
+wm.has(window); // Devuelve true
+wm.has('baz');  // Devuelve false
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-weakmap.prototype.has', 'WeakMap.prototype.has')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.has', 'WeakMap.prototype.has')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.WeakMap.has")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("WeakMap")}}</li>
+ <li>{{jsxref("WeakMap.prototype.set()")}}</li>
+ <li>{{jsxref("WeakMap.prototype.get()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/weakmap/index.html b/files/es/web/javascript/reference/global_objects/weakmap/index.html
new file mode 100644
index 0000000000..7d85820c1d
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/weakmap/index.html
@@ -0,0 +1,279 @@
+---
+title: WeakMap
+slug: Web/JavaScript/Reference/Global_Objects/WeakMap
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - WeakMap
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>WeakMap</code></strong> es una colección de pares clave/valor en la que las claves son objetos y los valores son valores arbitrarios.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><code>new WeakMap([iterable])
+</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>iterable</code></dt>
+ <dd>Iterable es un Array u otro objeto iterable cuyos elementos son pares clave-valor (Arrays de dos elementos). Cada par clave-valor será añadido al nuevo WeakMap. null es tratado como undefined.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las claves de los WeakMaps solamente pueden ser del tipo<code> Object</code>. Los {{Glossary("Primitive", "Primitive data types")}} como claves no están permitidos (ej. un {{jsxref("Symbol")}} no pueden ser una clave de <code>WeakMap</code>).</p>
+
+<h3 id="¿Por_qué_WeakMap">¿Por qué <em>Weak</em>Map?</h3>
+
+<p>El programador de JavaScript experimentado se habrá dado cuenta que esta API podría ser implementada en JavaScript con dos arrays (uno para las claves, otro para los valores) compartidos por los cuatro métodos de la API. Dicha implementación habría tenido dos inconvenientes principales: El primero es una búsqueda O(n) (siendo n el número de claves en el mapa). El segundo es un problema de pérdida de memoria. Con mapas escritos manualmente, el array de las claves mantendría referencias a la objetos clave, impidiéndoles ser recolectados. En los WeakMap nativos, las referencias a los objetos clave son mantenidas "débilmente", lo que quiere decir que no impiden la recolección de basura en caso de que no haya otras referencias al objeto.</p>
+
+<p>Dado que las referencias son débiles, <code>las claves de WeakMap</code> no son enumerables (ej: no existe un método que te devuelva la lista de las claves). Si existiera, la lista dependería de la recolección de basura, introduciendo indeterminismo. Si quieres una lista de las claves, se debe usar un  {{jsxref("Map")}} o mantenerla tu mismo.</p>
+
+<h2 id="Propiedades">Propiedades</h2>
+
+<dl>
+ <dt><code>WeakMap.length</code></dt>
+ <dd>El valor de la propiedad <code>length</code> es 0.</dd>
+ <dt>{{jsxref("WeakMap.prototype")}}</dt>
+ <dd>Representa el prototipo para el nuevo constructor<code> WeakMap</code>. Permite añadir propiedades a todos los objetos <code>WeakMap</code>.</dd>
+</dl>
+
+<h2 id="Instancias_de_WeakMap"><code>Instancias de WeakMap</code></h2>
+
+<p>Todas las instancias de <code>WeakMap</code> heredan de {{jsxref("WeakMap.prototype")}}.</p>
+
+<h3 id="Propiedades_2">Propiedades</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','Properties')}}</p>
+
+<h3 id="Métodos">Métodos</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','Methods')}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_WeakMap">Usando <code>WeakMap</code></h3>
+
+<pre class="brush: js notranslate">var wm1 = new WeakMap(),
+    wm2 = new WeakMap(),
+    wm3 = new WeakMap();
+var o1 = {},
+    o2 = function(){},
+    o3 = window;
+
+wm1.set(o1, 37);
+wm1.set(o2, "azerty");
+wm2.set(o1, o2); // un valor puede ser cualquier cosa, incluidos objetos o funciones
+wm2.set(o3, undefined);
+wm2.set(wm1, wm2); // claves y valores pueden ser objetos cualesquiera. !Incluso WeakMaps!
+
+wm1.get(o2); // "azerty"
+wm2.get(o2); // undefined, porque no hay valor para o2 en wm2
+wm2.get(o3); // undefined, porque es es el valor del conjunto
+wm1.has(o2); // true
+wm2.has(o2); // false
+wm2.has(o3); // true (incluso si el valor es 'undefined')
+
+wm3.set(o1, 37);
+wm3.get(o1); // 37
+
+wm1.has(o1);   // true
+wm1.delete(o1);
+wm1.has(o1);   // false
+
+</pre>
+
+<h3 id="Implementando_una_clase_tipo-WeakMap_con_un_método_.clear">Implementando una clase tipo-<code>WeakMap</code> con un método .clear()</h3>
+
+<p>Con propósito expositivo, el siguiente ejemplo usa el nuevo costruct class  de ECMAScript 2015, que actualmente no ha sido implementado de forma amplia.</p>
+
+<pre class="brush: js notranslate">class ClearableWeakMap {
+  constructor(init) {
+    this._wm = new WeakMap(init)
+  }
+  clear() {
+    this._wm = new WeakMap()
+  }
+  delete(k) {
+    return this._wm.delete(k)
+  }
+  get(k) {
+    return this._wm.get(k)
+  }
+  has(k) {
+    return this._wm.has(k)
+  }
+  set(k, v) {
+    this._wm.set(k, v)
+    return this
+  }
+}
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('ES2015', '#sec-weakmap-objects', 'WeakMap')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (SpiderMonkey)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>36</td>
+   <td>{{CompatGeckoDesktop("6.0")}}</td>
+   <td>11</td>
+   <td>{{ CompatOpera(23) }}</td>
+   <td>7.1</td>
+  </tr>
+  <tr>
+   <td><code>new WeakMap(iterable)</code></td>
+   <td>38</td>
+   <td>{{CompatGeckoDesktop("36")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatOpera(25) }}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>clear()</code></td>
+   <td>36</td>
+   <td>{{CompatGeckoDesktop("20.0")}}</td>
+   <td>11</td>
+   <td>{{ CompatOpera(23) }}</td>
+   <td>7.1</td>
+  </tr>
+  <tr>
+   <td>Constructor argument: <code>new WeakMap(null)</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("37")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Monkey-patched <code>set()</code> in Constructor</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("37")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>WeakMap()</code> without <code>new</code> throws</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("42")}}</td>
+   <td>11</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (SpiderMonkey)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>35</td>
+   <td>{{CompatGeckoMobile("6.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>iOS 8</td>
+  </tr>
+  <tr>
+   <td><code>new WeakMap(iterable)</code></td>
+   <td>38</td>
+   <td>{{CompatGeckoMobile("36")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>clear()</code></td>
+   <td>35</td>
+   <td>{{CompatGeckoMobile("20.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>iOS 8</td>
+  </tr>
+  <tr>
+   <td>Constructor argument: <code>new WeakMap(null)</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("37")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Monkey-patched <code>set()</code> in Constructor</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("37")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>WeakMap()</code> without <code>new</code> throws</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile("42")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td></td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="sect1"></h2>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=547941">WeakMap bug en Mozilla</a></li>
+ <li><a href="http://fitzgeraldnick.com/weblog/53/">Ocultando los detalles de implementación con los WeakMaps de ECMAScript </a>2015</li>
+ <li>{{jsxref("Map")}}</li>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("WeakSet")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/weakmap/set/index.html b/files/es/web/javascript/reference/global_objects/weakmap/set/index.html
new file mode 100644
index 0000000000..b06438719e
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/weakmap/set/index.html
@@ -0,0 +1,92 @@
+---
+title: WeakMap.prototype.set()
+slug: Web/JavaScript/Reference/Global_Objects/WeakMap/set
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Method
+  - Protocols
+  - WeakMap
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/set
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/set
+---
+<div>{{JSRef}}</div>
+
+<p>El método <code><strong>set()</strong></code> añade un nuevo elemento con su <code>key</code> y <code>value</code> específicos al objeto <code>WeakMap</code>.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/weakmap-prototype-set.html")}}</div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><em>wm</em>.set(key, value);</code></pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt>indentificador (key)</dt>
+ <dd>Requerido. El identificador (objeto) del elemento a añadir al objeto <code>WeakMap</code>.</dd>
+ <dt>valor (value)</dt>
+ <dd>Requerido. El valor del elemento a añadir al objeto <code>WeakMap</code>.</dd>
+</dl>
+
+<h3 id="Valor_devuelto">Valor devuelto</h3>
+
+<p>El objeto <code>WeakMap</code>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilización_del_método_set">Utilización del método <code>set</code> </h3>
+
+<pre class="brush: js">var wm = new WeakMap();
+var obj = {};
+
+// Agregando nuevos elementos a WeakMap
+wm.set(obj, 'foo').set(window, 'bar'); // encadenamiento
+// Actualiza el un elemento en el objeto WeakMap
+wm.set(obj, 'baz');
+
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-weakmap.prototype.set', 'WeakMap.prototype.set')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.set', 'WeakMap.prototype.set')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.builtins.WeakMap.set")}}</p>
+
+<h2 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h2>
+
+<ul>
+ <li>Antes de Firefox 33 {{geckoRelease("33")}}, <code>WeakMap.prototype.set</code> devolvía  <code>undefined</code> y no permitía el encadenamiento. Esto ha sido corregido ({{bug(1031632)}}). Este comportamiento puede encontrarse también en Chrome/v8 (<a href="https://code.google.com/p/v8/issues/detail?id=3410">fallo</a>).</li>
+</ul>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("WeakMap")}}</li>
+ <li>{{jsxref("WeakMap.prototype.get()")}}</li>
+ <li>{{jsxref("WeakMap.prototype.has()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/weakset/index.html b/files/es/web/javascript/reference/global_objects/weakset/index.html
new file mode 100644
index 0000000000..b259b82030
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/weakset/index.html
@@ -0,0 +1,228 @@
+---
+title: WeakSet
+slug: Web/JavaScript/Reference/Global_Objects/WeakSet
+translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WeakSet
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>WeakSet</code></strong>  te deja almacenar y mantener objectos debilmente en una colección.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"> new WeakSet([iterable]);</pre>
+
+<h3 id="Parametros">Parametros</h3>
+
+<dl>
+ <dt>iterable</dt>
+ <dd>Si un  <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">objeto interable </a>es pasado, todos sus elementos se agregarán al nuevo <code>WeakSet</code>. null es tratado como undefined.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p> </p>
+
+<p>Los objetos <code>WeakSet</code> son colecciones de objetos. Un objecto en <code>WeakSet</code> solo puede ser agregado una vez; Esto quiere decir que es unico en la coleccion <code>WeakSet.</code></p>
+
+<p>Las principales diferencias con el objeto {{jsxref("Set")}} son:</p>
+
+<ul>
+ <li>A diferencia de  <code>Sets</code>, <code>WeakSets</code>  son <strong>solamente colecciones de objetos </strong>y no contienen valores arbitrarios de cualquier otro tipo.</li>
+ <li>El <code>WeakSet</code>  es<em> débil</em>: Las referencias a objetos en la colección se mantienen débilmente.. Si ya no hay otra referencia a un objeto almacenado en el  <code>WeakSet</code>, ellos pueden ser removidos por el recolector de basura. Esto también significa que no hay ninguna lista de objetos almacenados en la colección. Los <code>WeakSets</code> no son enumerables.</li>
+</ul>
+
+<h2 id="Properties">Properties</h2>
+
+<dl>
+ <dt><code>WeakSet.length</code></dt>
+ <dd>El valor de la propiedad <code>length</code>  es 0.</dd>
+ <dt>{{jsxref("WeakSet.prototype")}}</dt>
+ <dd>Representa el prototipo para el constructor <code>Set</code> . Permite la adición de propiedades a todos los objetos WeakSet</dd>
+</dl>
+
+<h2 id="WeakSet_instances"><code>WeakSet</code> instances</h2>
+
+<p>Todas las instancias a <code>WeakSet</code> son heredadas de {{jsxref("WeakSet.prototype")}}.</p>
+
+<h3 id="Propiedades">Propiedades</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakSet/prototype','Properties')}}</p>
+
+<h3 id="Métodos">Métodos</h3>
+
+<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakSet/prototype','Methods')}}</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_el_objetoWeakSet">Usando el objeto<code>WeakSet</code> </h3>
+
+<pre class="brush: js">var ws = new WeakSet();
+var obj = {};
+var foo = {};
+
+ws.add(window);
+ws.add(obj);
+
+ws.has(window); // true
+ws.has(foo);    // false, foo no fue agregado al conjunto
+
+ws.delete(window); // elimina window del conjunto
+ws.has(window);    // false, window fue eliminado
+</pre>
+
+<h2 id="Especificaciónes">Especificaciónes</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-weakset-objects', 'WeakSet')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-weakset-objects', 'WeakSet')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(36)}}</td>
+   <td>12</td>
+   <td>{{ CompatGeckoDesktop(34) }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatOpera(23) }}</td>
+   <td>{{CompatSafari(9)}}</td>
+  </tr>
+  <tr>
+   <td><code>new WeakSet(iterable)</code></td>
+   <td>38</td>
+   <td>12</td>
+   <td>{{ CompatGeckoDesktop(34) }}</td>
+   <td>{{CompatNo}}</td>
+   <td>25</td>
+   <td>{{CompatSafari(9)}}</td>
+  </tr>
+  <tr>
+   <td>Constructor argument: <code>new WeakSet(null)</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>12</td>
+   <td>{{CompatGeckoDesktop("37")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatSafari(9)}}</td>
+  </tr>
+  <tr>
+   <td>Monkey-patched <code>add()</code> in Constructor</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>12</td>
+   <td>{{CompatGeckoDesktop("37")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatSafari(9)}}</td>
+  </tr>
+  <tr>
+   <td>Obsolete clear() method removed</td>
+   <td>{{CompatChrome(43)}}</td>
+   <td>12</td>
+   <td>{{CompatGeckoDesktop(46)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera(30)}}</td>
+   <td>{{CompatSafari(9)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile(34) }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td><code>new WeakMap(iterable)</code></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatGeckoMobile(34) }}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Constructor argument: <code>new WeakSet(null)</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Monkey-patched <code>add()</code> in Constructor</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>9</td>
+  </tr>
+  <tr>
+   <td>Obsolete clear() method removed</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>9</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Tambien_ver">Tambien ver</h2>
+
+<ul>
+ <li>{{jsxref("Map")}}</li>
+ <li>{{jsxref("Set")}}</li>
+ <li>{{jsxref("WeakMap")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/global_objects/webassembly/index.html b/files/es/web/javascript/reference/global_objects/webassembly/index.html
new file mode 100644
index 0000000000..e1e64baa21
--- /dev/null
+++ b/files/es/web/javascript/reference/global_objects/webassembly/index.html
@@ -0,0 +1,121 @@
+---
+title: WebAssembly
+slug: Web/JavaScript/Reference/Global_Objects/WebAssembly
+tags:
+  - API
+  - Experimental
+  - JavaScript
+  - Objeto
+  - Referencia
+  - WebAssembly
+translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly
+original_slug: Web/JavaScript/Referencia/Objetos_globales/WebAssembly
+---
+<div>{{JSRef}}</div>
+
+<p>El objeto <strong><code>WebAssembly</code></strong> de JavaScript actua como un namespace para todas las funcionalidades realcionados con <a href="/en-US/docs/WebAssembly">WebAssembly</a>.</p>
+
+<p>A diferencia de otros objetos globales, <code>WebAssembly</code> no tiene un constructor (no tiene una función para crear el objeto). Puedes ser comparado con el objeto {{jsxref("Math")}}, que también es un namespace, para funciones y constantes matemáticas, o también con {{jsxref("Intl")}} que es un namespace para internacionalización y otras funciones de idioma.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los usos primarios para el objeto <code>WebAssembly</code> son:</p>
+
+<ul>
+ <li>Cargar código WebAssembly, utilizando la función {{jsxref("WebAssembly.instantiate()")}}.</li>
+ <li>Crear nuevas instancias de memoria y de tablas mediante los constructores {{jsxref("WebAssembly.Memory()")}}/{{jsxref("WebAssembly.Table()")}}.</li>
+ <li>Facilitar el manejo de errores que ocurren dentro de un WebAssembly mediante los constructores:{{jsxref("WebAssembly.CompileError()")}}/{{jsxref("WebAssembly.LinkError()")}}/{{jsxref("WebAssembly.RuntimeError()")}}.</li>
+</ul>
+
+<h2 id="Métodos">Métodos</h2>
+
+<dl>
+ <dt>{{jsxref("WebAssembly.instantiate()")}}</dt>
+ <dd>El API primaria para compilar e instanciar código WebAssembly, ambos regresan un <code>Module</code> y el primero <code>Instance</code>.</dd>
+ <dt>{{jsxref("WebAssembly.instantiateStreaming()")}}</dt>
+ <dd>Compila e instancia un módulo WebAssembly directamente desde un flujo de origen subyacente, ambos regresan un <code>Module</code> y el primero <code>Instance</code>.</dd>
+ <dt>{{jsxref("WebAssembly.compile()")}}</dt>
+ <dd>Compila un {{jsxref("WebAssembly.Module")}} desde el código binario de un WebAssembly, manteniendo la creación de la instancia como un objeto separado.</dd>
+ <dt>{{jsxref("WebAssembly.compileStreaming()")}}</dt>
+ <dd>compila un {{jsxref("WebAssembly.Module")}} directamente desde un flujo de origen subyacente, manteniendo la creación de la instancia como un objeto sepraado.</dd>
+ <dt>{{jsxref("WebAssembly.validate()")}}</dt>
+ <dd>Valida un arreglo con tipo de código binario de un WebAssembly, regresando si los bytes son código válido WebAssembly (<code>true</code>) o de lo contrario (<code>false</code>).</dd>
+</dl>
+
+<h2 id="Constructores">Constructores</h2>
+
+<dl>
+ <dt>{{jsxref("WebAssembly.Module()")}}</dt>
+ <dd>Crea un nuevo objeto WebAssembly <code>Module</code>.</dd>
+ <dt>{{jsxref("WebAssembly.Instance()")}}</dt>
+ <dd>Crear un nuevo objeto WebAssembly <code>Instance</code>.</dd>
+ <dt>{{jsxref("WebAssembly.Memory()")}}</dt>
+ <dd>Crear un nuevo objeto WebAssembly <code>Memory</code>.</dd>
+ <dt>{{jsxref("WebAssembly.Table()")}}</dt>
+ <dd>Crear un nuevo objeto WebAssembly <code>Table</code>.</dd>
+ <dt>{{jsxref("WebAssembly.CompileError()")}}</dt>
+ <dd>Crear un nuevo objeto WebAssembly <code>CompileError</code>.</dd>
+ <dt>{{jsxref("WebAssembly.LinkError()")}}</dt>
+ <dd>Crear un nuevo objeto WebAssembly <code>LinkError</code>.</dd>
+ <dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt>
+ <dd>Crear un nuevo objeto WebAssembly <code>RuntimeError</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Después de obtener algún bytecode de WebAssembly usando la sentencia fetch, nosotros compilamos e instanciamos el módulo usando la función {{jsxref("WebAssembly.instantiate()")}} , importando una función de JavaScript en el WebAssembly Module en el proceso. Esta premisa resuelve a un objeto (<code>result</code>) que contenga un objeto <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module">Module</a></code> compilado y un objeto <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance">Instance</a></code> . Entonces tenemos una llamada a <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly function</a> que es exportada por <code>Instance</code>.</p>
+
+<pre class="brush: js">var importObject = {
+  imports: {
+    imported_func: function(arg) {
+      console.log(arg);
+    }
+  }
+};
+
+fetch('simple.wasm').then(response =&gt;
+  response.arrayBuffer()
+).then(bytes =&gt;
+  WebAssembly.instantiate(bytes, importObject)
+).then(result =&gt;
+  result.instance.exports.exported_func()
+);</pre>
+
+<div class="note">
+<p><strong>Nota</strong>: Ver <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index.html">index.html</a> en GitHub (<a href="https://mdn.github.io/webassembly-examples/js-api-examples/">view it live also</a>) para un ejemplo que hace uso de la función <code><a href="https://github.com/mdn/webassembly-examples/blob/master/wasm-utils.js#L1">fetchAndInstantiate()</a></code>.</p>
+</div>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('WebAssembly JS', '#the-webassembly-object', 'WebAssembly')}}</td>
+   <td>{{Spec2('WebAssembly JS')}}</td>
+   <td>Definición inicial del borrador.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de Navegadores</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad en esta página es generado desde datos estructurados. Si deseas contribuir a esta información, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envía una solicitud.</div>
+
+<p>{{Compat("javascript.builtins.WebAssembly")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/WebAssembly">Vista General de WebAssembly</a></li>
+ <li><a href="/en-US/docs/WebAssembly/Concepts">Conceptos de WebAssembly </a></li>
+ <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Uso de la API de JavaScript de WebAssembly </a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/index.html b/files/es/web/javascript/reference/index.html
new file mode 100644
index 0000000000..4550bea633
--- /dev/null
+++ b/files/es/web/javascript/reference/index.html
@@ -0,0 +1,32 @@
+---
+title: Referencia de JavaScript
+slug: Web/JavaScript/Reference
+tags:
+  - JavaScript
+translation_of: Web/JavaScript/Reference
+original_slug: Web/JavaScript/Referencia
+---
+<p>{{JsSidebar}}</p>
+
+<h2 id="Objetos_globales" name="Objetos_globales"><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales">Objetos globales</a></h2>
+
+<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales', 'Objetos_est.C3.A1ndar_(por_categor.C3.ADa)')}}</div>
+
+<h2 id="Sentencias" name="Sentencias"><a href="/es/docs/Web/JavaScript/Referencia/Sentencias">Sentencias</a></h2>
+
+<p>{{page('/es/docs/Web/JavaScript/Referencia/Sentencias', 'Statements_and_declarations_by_category')}}</p>
+
+<h2 id="Operadores" name="Operadores"><a href="/es/docs/Web/JavaScript/Referencia/Operadores">Expresiónes y Operadores</a></h2>
+
+<p>{{page('/es/docs/Web/JavaScript/Referencia/Operadores', 'Expressions_and_operators_by_category')}}</p>
+
+<h2 id="Gramática_léxica"><a href="/es/docs/Web/JavaScript/Reference/Gramatica_lexica">Gramática léxica</a></h2>
+
+<ul>
+ <li><a href="/es/Referencia_de_JavaScript_1.5/Comentarios/comentario" title="es/Referencia_de_JavaScript_1.5/Comentarios/comentario">comentarios en el Código</a> (<code>//</code> and <code>/* */</code>)</li>
+ <li><a href="/es/Referencia_de_JavaScript_1.5/Palabras_Reservadas" title="es/Referencia_de_JavaScript_1.5/Palabras_Reservadas">Palabras reservadas</a></li>
+</ul>
+
+<h2 id="Ap.C3.A9ndice_B_-_Caracter.C3.ADsticas_Desprobadas" name="Ap.C3.A9ndice_B_-_Caracter.C3.ADsticas_Desprobadas"><a href="/es/docs/Web/JavaScript/Referencia/Caracter%C3%ADsticas_Desaprobadas" title="es/Referencia_de_JavaScript_1.5/Características_Desaprobadas">Apéndice - Características Desaprobadas</a></h2>
+
+<p><span class="comment">Original Document At: <a class="external" href="http://devedge-temp.mozilla.org/library/manuals/2000/javascript/1.5/reference/" rel="freelink">http://devedge-temp.mozilla.org/libr...1.5/reference/</a></span></p>
diff --git a/files/es/web/javascript/reference/iteration_protocols/index.html b/files/es/web/javascript/reference/iteration_protocols/index.html
new file mode 100644
index 0000000000..7155ebbd25
--- /dev/null
+++ b/files/es/web/javascript/reference/iteration_protocols/index.html
@@ -0,0 +1,321 @@
+---
+title: Protocolos de Iteración
+slug: Web/JavaScript/Reference/Iteration_protocols
+tags:
+  - ECMAScript6
+  - Experimental
+  - Intermedio
+  - Iterable
+  - Iterador
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Iteration_protocols
+original_slug: Web/JavaScript/Referencia/Iteration_protocols
+---
+<div>{{jsSidebar("More")}}</div>
+
+<div>Las nuevas características de ECMAScript 6 no solo están asociadas a cambios y adiciones de sintaxis o a nuevos objetos nativos, sino también a protocolos. Dichos protocolos puede ser implementados por cualquier objeto en relación a algunas convenciones.</div>
+
+<div> </div>
+
+<div>Existen dos protocolos: El<a href="#The_.22iterable.22_protocol"> protocolo iterable</a> y el<a href="#The_.22iterator.22_protocol"> protocolo iterador</a>.</div>
+
+<div> </div>
+
+<h2 id="El_protocolo_iterable">El protocolo iterable</h2>
+
+<p>El protocolo <strong>iterable</strong> le permite a los objetos en JavaScript definir o personalizar su comportamiento de iteración, como por ejemplo qué valores son iterados dentro de una sentencia {{jsxref("Statements/for...of", "for..of")}}. Algunos objetos nativos, como {{jsxref("Array")}} o {{jsxref("Map")}}, tienen un comportamiento de iteración por defecto, mientras otros objetos (como por ejemplo {{jsxref("Object")}}) no.</p>
+
+<p>Para ser iterable, un objeto debe implementar el método <strong>@@iterator</strong>, lo cual significa que el objeto (o uno de los objetos dentro de su <a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">cadena de prototipos</a>) debe tener una propiedad con un identificador {{jsxref("Symbol")}}<code style="font-style: normal;">.iterator</code>:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Propiedad</th>
+   <th scope="col">Valor</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>[Symbol.iterator]</code></td>
+   <td>Una función sin argumentos que retorna un objeto, de acuerdo al <a href="#The_.22iterator.22_protocol">protocolo iterador</a>.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Siempre que un objeto necesite ser iterado (como al comienzo de un <code>for..of</code> loop), su método <code>@@iterator</code> es llamado sin argumentos, y el <strong>iterador</strong> retornado es usado para obtener los valores a ser iterados.</p>
+
+<h2 id="El_protocolo_iterador">El protocolo iterador</h2>
+
+<p>El protocolo <strong>iterador</strong> define una forma estándar que permite producir una secuencia de valores (sean estos finitos o infinitos).</p>
+
+<p>Un objeto es un iterador cuando este implementa un método <code><strong>next()</strong></code> con la siguiente semántica:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Propiedad</th>
+   <th scope="col">Valor</th>
+  </tr>
+  <tr>
+   <td><code>next</code></td>
+   <td>
+    <p>Una función sin argumentos que retorna un objeto con dos propiedades:</p>
+
+    <ul>
+     <li><code>done</code> (boleano)
+
+      <ul>
+       <li>Su valor es <code>true</code> si el iterador está más allá del final de la secuencia iterada. En este caso <code>value</code> opcionalmente especifica el <em>valor retornado</em> por el iterador. Los valores retornados son explicados <a href="http://www.2ality.com/2013/06/iterators-generators.html#generators-as-threads">aquí</a>.</li>
+       <li>Su valor es <code>false</code> si el iterador pudo producir el siguiente valor en la secuencia. Esto es equivalente a no especificar la propiedad <code>done</code> en su totalidad.</li>
+      </ul>
+     </li>
+     <li><code>value</code> - cualquier valor de JavaScript retornado por el iterador. Puede ser omitido cuando el valor de <code>done</code> es <code>true</code>.</li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Algunos iteradores son a su vez iterables:</p>
+
+<pre class="brush: js">var someArray = [1, 5, 7];
+var someArrayEntries = someArray.entries();
+
+someArrayEntries.toString();           // "[object Array Iterator]"
+someArrayEntries === someArrayEntries[Symbol.iterator]();    // true
+</pre>
+
+<h2 id="Ejemplos_de_protocolos_de_iteración">Ejemplos de protocolos de iteración</h2>
+
+<p>Un {{jsxref("String")}} es un ejemplo de un objeto iterable nativo:</p>
+
+<pre class="brush: js">var someString = "hi";
+typeof someString[Symbol.iterator];          // "function"
+</pre>
+
+<p>Para objetos <code>String</code> su iterador por defecto retorna cada uno de sus caracteres, uno a la vez:</p>
+
+<pre class="brush: js">var iterator = someString[Symbol.iterator]();
+iterator + "";                               // "[object String Iterator]"
+
+iterator.next();                             // { value: "h", done: false }
+iterator.next();                             // { value: "i", done: false }
+iterator.next();                             // { value: undefined, done: true }</pre>
+
+<p>En algunas estructuras nativas del lenguaje como en el caso del <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator">operador de propagación <em>spread operator</em></a>, el mismo protocolo de iteración está presente en su parte interna:</p>
+
+<pre class="brush: js">[...someString]                              // ["h", "i"]</pre>
+
+<p>Podemos redefinir el comportamiento de iteración creando nuestro propio  <code>@@iterator</code>:</p>
+
+<pre class="brush: js">// es necesario el uso de un objeto creado a partir de la función constructora String,
+// ya que al usar un string primitivo el <em>auto-boxing</em> generaría una referencia temporal
+// a un iterador que luego es descartado en el <em>unbox</em>
+
+var someString = new String("hi");
+
+someString[Symbol.iterator] = function() {
+  return { // este es el objeto iterador que retorna un único elemento, la cadena string "bye"
+    next: function() {
+      if (this._first) {
+        this._first = false;
+        return { value: "bye", done: false };
+      } else {
+        return { done: true };
+      }
+    },
+    _first: true
+  };
+};
+</pre>
+
+<p>Nótese que al redefinir un <code>@@iterator</code> se puede afectar el comportamiento  de construcciones nativas que usan el protocolo de iteración:</p>
+
+<pre class="brush: js">[...someString];                              // ["bye"]
+someString + "";                              // "hi"
+</pre>
+
+<h2 id="Ejemplos_de_iterables">Ejemplos de iterables</h2>
+
+<h3 id="Iterables_nativos">Iterables nativos</h3>
+
+<p>{{jsxref("String")}}, {{jsxref("Array")}}, {{jsxref("TypedArray")}}, {{jsxref("Map")}} y {{jsxref("Set")}} son objetos iterables nativos, ya que en su objeto prototipo existe un método <code>@@</code><code>iterator.</code></p>
+
+<h3 id="Iterables_personalizados">Iterables personalizados</h3>
+
+<p>Podemos crear nuestros propios iterables de la siguiente manera:</p>
+
+<pre class="brush: js">var myIterable = {};
+myIterable[Symbol.iterator] = function* () {
+    yield 1;
+    yield 2;
+    yield 3;
+};
+[...myIterable]; // [1, 2, 3]
+</pre>
+
+<h3 id="APIs_nativas_que_aceptan_iterables">APIs nativas que aceptan iterables</h3>
+
+<p>Existen varios APIs que aceptan iterables, como en el caso de: {{jsxref("Map", "Map([iterable])")}}, {{jsxref("WeakMap", "WeakMap([iterable])")}}, {{jsxref("Set", "Set([iterable])")}} y {{jsxref("WeakSet", "WeakSet([iterable])")}}:</p>
+
+<pre class="brush: js">var myObj = {};
+new Map([[1,"a"],[2,"b"],[3,"c"]]).get(2);               // "b"
+new WeakMap([[{},"a"],[myObj,"b"],[{},"c"]]).get(myObj); // "b"
+new Set([1, 2, 3]).has(3);                               // true
+new Set("123").has("2");                                 // true
+new WeakSet(function*() {
+    yield {};
+    yield myObj;
+    yield {};
+}()).has(myObj);                                         // true
+</pre>
+
+<p>De igual manera {{jsxref("Promise.all", "Promise.all(iterable)")}}, {{jsxref("Promise.race", "Promise.race(iterable)")}}, y {{jsxref("Array.from", "Array.from()")}}.</p>
+
+<h3 id="Sintaxis_que_espera_un_iterable">Sintaxis que espera un iterable</h3>
+
+<p>Algunas declaraciones y expresiones esperan iterables, por ejemplo el bucle <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for-of</a></code>, el<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator"> operador de propagación <em>spread operator</em></a>,  la expresión <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/yield*">Yield*</a></code>, y la <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">asignación desestructurada <em>destructuring assignment</em></a>.</p>
+
+<pre class="brush: js">for(let value of ["a", "b", "c"]){
+    console.log(value);
+}
+// "a"
+// "b"
+// "c"
+
+[..."abc"]; // ["a", "b", "c"]
+
+function* gen(){
+  yield* ["a", "b", "c"];
+}
+
+gen().next(); // { value:"a", done:false }
+
+[a, b, c] = new Set(["a", "b", "c"]);
+a // "a"
+
+</pre>
+
+<h3 id="Iterables_mal_definidos">Iterables mal definidos</h3>
+
+<p>Un método <code>@@iterator</code> iterable que no retorne un objeto iterador no está correctamente definido, por lo tanto al ejecutarlo de esta manera podría resultar en excepciones en tiempo de ejecución y otros errores:</p>
+
+<pre class="brush: js">var nonWellFormedIterable = {}
+nonWellFormedIterable[Symbol.iterator] = () =&gt; 1
+[...nonWellFormedIterable] // TypeError: [] is not a function
+</pre>
+
+<h2 id="Ejemplos_de_iteradores">Ejemplos de iteradores</h2>
+
+<h3 id="Iterador_simple">Iterador simple</h3>
+
+<pre class="brush: js">function makeIterator(array){
+    var nextIndex = 0;
+
+    return {
+       next: function(){
+           return nextIndex &lt; array.length ?
+               {value: array[nextIndex++], done: false} :
+               {done: true};
+       }
+    };
+}
+
+var it = makeIterator(['yo', 'ya']);
+
+console.log(it.next().value); // 'yo'
+console.log(it.next().value); // 'ya'
+console.log(it.next().done);  // true
+</pre>
+
+<h3 id="Iterador_infinito">Iterador infinito</h3>
+
+<pre class="brush: js">function idMaker(){
+    var index = 0;
+
+    return {
+       next: function(){
+           return {value: index++, done: false};
+       }
+    };
+}
+
+var it = idMaker();
+
+console.log(it.next().value); // '0'
+console.log(it.next().value); // '1'
+console.log(it.next().value); // '2'
+// ...
+</pre>
+
+<h3 id="Con_un_generador">Con un generador</h3>
+
+<pre class="brush: js">function* makeSimpleGenerator(array){
+    var nextIndex = 0;
+
+    while(nextIndex &lt; array.length){
+        yield array[nextIndex++];
+    }
+}
+
+var gen = makeSimpleGenerator(['yo', 'ya']);
+
+console.log(gen.next().value); // 'yo'
+console.log(gen.next().value); // 'ya'
+console.log(gen.next().done);  // true
+
+
+
+function* idMaker(){
+    var index = 0;
+    while(true)
+        yield index++;
+}
+
+var gen = idMaker();
+
+console.log(gen.next().value); // '0'
+console.log(gen.next().value); // '1'
+console.log(gen.next().value); // '2'
+// ...
+</pre>
+
+<h2 id="¿Un_objeto_generador_es_un_iterador_o_un_iterable">¿Un objeto generador es un iterador o un iterable?</h2>
+
+<p>Un <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Generator">objeto iterador</a> es tanto un iterador como un iterable:</p>
+
+<pre class="brush: js">var aGeneratorObject = function*(){
+    yield 1;
+    yield 2;
+    yield 3;
+}();
+typeof aGeneratorObject.next;
+// "function", ya que tiene un método next, por lo tanto es un iterador
+typeof aGeneratorObject[Symbol.iterator];
+// "function", ya que tiene un método @@iterator, por lo tanto es un iterable
+aGeneratorObject[Symbol.iterator]() === aGeneratorObject;
+// true, ya que su método @@iterator retorna a sí mismo (un iterador), por lo tanto es un iterable bien formado
+[...aGeneratorObject];
+// [1, 2, 3]
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-iteration', 'Iteration')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Temas_relacionados">Temas relacionados</h2>
+
+<p>Para información adicional acerca de generadores <em>generators</em> en ES6, puede visitar la  <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">página específica</a> sobre este tema.</p>
diff --git a/files/es/web/javascript/reference/lexical_grammar/index.html b/files/es/web/javascript/reference/lexical_grammar/index.html
new file mode 100644
index 0000000000..b67cb98196
--- /dev/null
+++ b/files/es/web/javascript/reference/lexical_grammar/index.html
@@ -0,0 +1,662 @@
+---
+title: Gramática léxica
+slug: Web/JavaScript/Reference/Lexical_grammar
+tags:
+  - Gramática léxica
+  - Guía
+  - JaveScript
+  - Literal
+  - Palabra clave
+translation_of: Web/JavaScript/Reference/Lexical_grammar
+original_slug: Web/JavaScript/Referencia/Gramatica_lexica
+---
+<div>{{JsSidebar("Más")}}</div>
+
+<p>Esta página describe la gramática léxica de JavaScript. El texto fuente de los scripts de ECMAScript se escanea de izquierda a derecha y se convierte en una secuencia de elementos de entrada que son segmentos, caracteres de control, terminadores de línea, comentarios o {{Glossary("Espacio en blanco")}}. ECMAScript también define ciertas palabras clave y literales y tiene reglas para la inserción automática del punto y coma en las declaraciones finales.</p>
+
+<h2 id="Caracteres_de_control">Caracteres de control</h2>
+
+<p>Los caracteres de control no tienen representación visual, pero se utilizan para controlar la interpretación del texto.</p>
+
+<table class="standard-table">
+ <caption>Caracteres de control de formato Unicode</caption>
+ <thead>
+  <tr>
+   <th>Punto de código</th>
+   <th>Nombre</th>
+   <th>Abreviatura</th>
+   <th>Descripción</th>
+  </tr>
+ </thead>
+ <thead>
+  <tr>
+   <td><code>U+200C</code></td>
+   <td>Separador de ancho cero</td>
+   <td>&lt;ZWNJ&gt;</td>
+   <td>Colocado entre caracteres para evitar que se conecten a ligaduras en ciertos idiomas (<a href="https://en.wikipedia.org/wiki/Zero-width_non-joiner">Wikipedia</a>).</td>
+  </tr>
+  <tr>
+   <td><code>U+200D</code></td>
+   <td>Conector de ancho cero</td>
+   <td>&lt;ZWJ&gt;</td>
+   <td>Colocado entre caracteres que normalmente no estarían conectados para hacer que los caracteres se rendericen usando su forma conectada en ciertos idiomas (<a href="https://en.wikipedia.org/wiki/Zero-width_joiner">Wikipedia</a>).</td>
+  </tr>
+  <tr>
+   <td><code>U+FEFF</code></td>
+   <td>Marca de orden de bytes</td>
+   <td>&lt;BOM&gt;</td>
+   <td>Se usa al comienzo del script para marcarlo como Unicode y el orden de bytes del texto (<a href="https://en.wikipedia.org/wiki/Marca_de_orden_de_bytes">Wikipedia</a>).</td>
+  </tr>
+ </thead>
+</table>
+
+<h2 id="Espacio_en_blanco">Espacio en blanco</h2>
+
+<p>Los caracteres de {{Glossary("Espacio_en_blanco")}} mejoran la legibilidad del texto fuente y separan los fragmentos entre sí. Estos caracteres suelen ser innecesarios para la funcionalidad del código. Las <a href="https://en.wikipedia.org/wiki/Minification_%28programming%29">herramientas de minificación</a> se utilizan a menudo para eliminar espacios en blanco con el fin de reducir la cantidad de datos que se deben transferir.</p>
+
+<table class="standard-table">
+ <caption>Caracteres de espacio en blanco</caption>
+ <thead>
+  <tr>
+   <th>Punto de código</th>
+   <th>Nombre</th>
+   <th>Abreviatura</th>
+   <th>Descripción</th>
+   <th>Secuencia de escape</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>U+0009</td>
+   <td>Caracter de tabulación</td>
+   <td>&lt;HT&gt;</td>
+   <td>Tabulación horizontal</td>
+   <td>\t</td>
+  </tr>
+  <tr>
+   <td>U+000B</td>
+   <td>Tabulación de línea</td>
+   <td>&lt;VT&gt;</td>
+   <td>Tabulación vertical</td>
+   <td>\v</td>
+  </tr>
+  <tr>
+   <td>U+000C</td>
+   <td>Avance de Página</td>
+   <td>&lt;FF&gt;</td>
+   <td>Carácter de control de salto de página (<a href="https://en.wikipedia.org/wiki/Page_break#Form_feed">Wikipedia</a>).</td>
+   <td>\f</td>
+  </tr>
+  <tr>
+   <td>U+0020</td>
+   <td>Espacio</td>
+   <td>&lt;SP&gt;</td>
+   <td>Espacio normal</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>U+00A0</td>
+   <td>Espacio irrompible</td>
+   <td>&lt;NBSP&gt;</td>
+   <td>Espacio normal, pero ningún punto en el que una línea se pueda romper</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>Otros</td>
+   <td>Otros caracteres de espacio Unicode</td>
+   <td>&lt;USP&gt;</td>
+   <td><a href="https://es.wikipedia.org/wiki/Espacio_(puntuaci%C3%B3n)">Espacios Unicode en Wikipedia</a></td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Terminadores_de_línea">Terminadores de línea</h2>
+
+<p>Además de los caracteres de {{Glossary("Espacio_en_blanco", "espacio en blanco")}}, los caracteres de terminación de línea se utilizan para mejorar la legibilidad del texto fuente. Sin embargo, en algunos casos, los terminadores de línea pueden influir en la ejecución del código JavaScript, ya que hay algunos lugares donde están prohibidos. Los terminadores de línea también afectan el proceso de la <a href="#Inserción_automática_de_punto_y_coma">inserción automática de punto y coma</a>. Los terminadores de línea se corresponden con la clase <strong>\s</strong> en <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresiones regulares</a>.</p>
+
+<p>Solo los siguientes puntos de código Unicode se tratan como terminadores de línea en ECMAScript, otros caracteres de salto de línea se tratan como espacios en blanco (por ejemplo, <code>Next Line</code>, <code>NEL</code>, <code>U+0085</code> se consideran como espacios en blanco).</p>
+
+<table class="standard-table">
+ <caption>Caracteres terminadores de línea</caption>
+ <thead>
+  <tr>
+   <th>Punto de código</th>
+   <th>Nombre</th>
+   <th>Abreviatura</th>
+   <th>Descripción</th>
+   <th>Secuencia de escape</th>
+  </tr>
+ </thead>
+ <thead>
+ </thead>
+ <tbody>
+  <tr>
+   <td>U+000A</td>
+   <td>Alimentación de linea</td>
+   <td>&lt;LF&gt;</td>
+   <td>Caracter de nueva línea en sistemas UNIX.</td>
+   <td>\n</td>
+  </tr>
+  <tr>
+   <td>U+000D</td>
+   <td>Retorno de carro</td>
+   <td>&lt;CR&gt;</td>
+   <td>Caracter de nueva línea en Commodore y los primeros sistemas Mac.</td>
+   <td>\r</td>
+  </tr>
+  <tr>
+   <td>U+2028</td>
+   <td>Separador de línea</td>
+   <td>&lt;LS&gt;</td>
+   <td><a href="https://es.wikipedia.org/wiki/Nueva_l%C3%ADnea">Wikipedia</a></td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>U+2029</td>
+   <td>Separador de párrafos</td>
+   <td>&lt;PS&gt;</td>
+   <td><a href="https://es.wikipedia.org/wiki/Nueva_l%C3%ADnea">Wikipedia</a></td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Comentarios">Comentarios</h2>
+
+<p>Los comentarios se utilizan para agregar consejos, notas, sugerencias o advertencias al código JavaScript. Esto puede facilitar su lectura y comprensión. También se pueden utilizar para deshabilitar el código y evitar que se ejecute; esta puede ser una valiosa herramienta de depuración.</p>
+
+<p>JavaScript tiene dos formas antiguas de agregar comentarios al código.</p>
+
+<p>La primera forma son las dobles barras inclinadas <code>//</code> comentario<strong>;</strong> esta convierte en comentario todo el texto que le sigue en la misma línea. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">function comment() {
+  // Este es un comentario JavaScript de una línea
+  console.log('¡Hola mundo!');
+}
+comment();
+</pre>
+
+<p>La segunda forma es el estilo <code>/* */</code>, que es mucho más flexible.</p>
+
+<p>Por ejemplo, lo puedes usar en una sola línea:</p>
+
+<pre class="brush: js notranslate">function comment() {
+  /* Este es un comentario JavaScript de una línea */
+  console.log('¡Hola mundo!');
+}
+comment();</pre>
+
+<p>También puedes hacer comentarios de varias líneas, como este:</p>
+
+<pre class="brush: js notranslate">function comment() {
+  /* Este comentario abarca varias líneas. Aviso
+     No necesitamos cerrar el comentario hasta que terminemos. */
+  console.log('¡Hola mundo!');
+}
+comment();</pre>
+
+<p>También lo puedes usar en medio de una línea, si lo deseas, aunque esto puede hacer que tu código sea más difícil de leer, por lo que se debe usar con precaución:</p>
+
+<pre class="brush: js notranslate">function comment(x) {
+  console.log('¡Hola' + x /* inserta el valor de x */ + ' !');
+}
+comment('mundo');</pre>
+
+<p>Además, lo puedes usar para deshabilitar el código y evitar que se ejecute, envolviendo el código en un comentario, como este:</p>
+
+<pre class="brush: js notranslate">function comment() {
+  /* console.log('¡Hola mundo!'); */
+}
+comment();</pre>
+
+<p>En este caso, la llamada a <code>console.log()</code> nunca se emite, debido a que está dentro de un comentario. De esta forma se puede desactivar cualquier número de líneas de código.</p>
+
+<h2 id="Comentarios_hashbang">Comentarios <code>hashbang</code></h2>
+
+<p>Una sintaxis de tercer comentario especializado, el <strong>comentario <code>hashbang</code></strong>, está en proceso de estandarización en ECMAScript (consulta la <a href="https://github.com/tc39/proposal-hashbang">Propuesta de gramática <code>Hashbang</code></a>).</p>
+
+<p>Un comentario <code>hashbang</code> se comporta exactamente como un comentario de una sola línea (<code>//</code>). En cambio, comienza con <code>#!</code> y <strong>solo son válidos al comienzo absoluto de un script o módulo</strong>. También ten en cuenta que no se permiten espacios en blanco de ningún tipo antes del <code>#!</code>. El comentario consta de todos los caracteres después de <code>#!</code> hasta el final de la primera línea; sólo se permite uno de esos comentarios.</p>
+
+<p>El comentario <code>hashbang</code> especifica la ruta a un intérprete de JavaScript específico que deseas utilizar para ejecutar el script. Aquí tienes un sencillo ejemplo:</p>
+
+<pre class="brush: js notranslate">#!/usr/bin/env node
+
+console.log("Hola mundo");
+</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota</strong>: Los comentarios <code>hashbang</code> en JavaScript imitan a los <a href="https://en.wikipedia.org/wiki/Shebang_(Unix)"><code>shebangs</code> en Unix</a> utilizados para ejecutar archivos con el intérprete apropiado.</p>
+</div>
+
+<div class="blockIndicator warning">
+<p>Aunque <a href="https://https://es.wikipedia.org/wiki/Marca_de_orden_de_bytes">BOM</a> antes de que el comentario <code>hashbang</code> funcione en un navegador, no se recomienda utilizar BOM en un script con <code>hashbang</code>. BOM no funcionará cuando intentes ejecutar el script en Unix/Linux. Por lo tanto, usa UTF-8 sin BOM si deseas ejecutar scripts directamente desde el intérprete.</p>
+</div>
+
+<p>¡Solo debes usar el estilo de comentario <code>#!</code> para especificar un intérprete de JavaScript. En todos los demás casos, utiliza un comentario <code>//</code> (o un comentario multilínea).</p>
+
+<h2 id="Palabras_clave">Palabras clave</h2>
+
+<h3 id="Palabras_clave_reservadas_a_partir_de_ECMAScript_2015">Palabras clave reservadas a partir de ECMAScript 2015</h3>
+
+<ul class="threecolumns">
+ <li>{{jsxref("Statements/break", "break")}}</li>
+ <li>{{jsxref("Statements/switch", "case")}}</li>
+ <li>{{jsxref("Statements/try...catch", "catch")}}</li>
+ <li>{{jsxref("Statements/class", "class")}}</li>
+ <li>{{jsxref("Statements/const", "const")}}</li>
+ <li>{{jsxref("Statements/continue", "continue")}}</li>
+ <li>{{jsxref("Statements/debugger", "debugger")}}</li>
+ <li>{{jsxref("Statements/default", "default")}}</li>
+ <li>{{jsxref("Operators/delete", "delete")}}</li>
+ <li>{{jsxref("Statements/do...while", "do")}}</li>
+ <li>{{jsxref("Statements/if...else", "else")}}</li>
+ <li>{{jsxref("Statements/export", "export")}}</li>
+ <li>{{jsxref("Statements/class", "extends")}}</li>
+ <li>{{jsxref("Statements/try...catch", "finally")}}</li>
+ <li>{{jsxref("Statements/for", "for")}}</li>
+ <li>{{jsxref("Statements/function", "function")}}</li>
+ <li>{{jsxref("Statements/if...else", "if")}}</li>
+ <li>{{jsxref("Statements/import", "import")}}</li>
+ <li>{{jsxref("Operators/in", "in")}}</li>
+ <li>{{jsxref("Operators/instanceof", "instanceof")}}</li>
+ <li>{{jsxref("Operators/new", "new")}}</li>
+ <li>{{jsxref("Statements/return", "return")}}</li>
+ <li>{{jsxref("Operators/super", "super")}}</li>
+ <li>{{jsxref("Statements/switch", "switch")}}</li>
+ <li>{{jsxref("Operators/this", "this")}}</li>
+ <li>{{jsxref("Statements/throw", "throw")}}</li>
+ <li>{{jsxref("Statements/try...catch", "try")}}</li>
+ <li>{{jsxref("Operators/typeof", "typeof")}}</li>
+ <li>{{jsxref("Statements/var", "var")}}</li>
+ <li>{{jsxref("Operators/void", "void")}}</li>
+ <li>{{jsxref("Statements/while", "while")}}</li>
+ <li>{{jsxref("Statements/with", "with")}}</li>
+ <li>{{jsxref("Operators/yield", "yield")}}</li>
+</ul>
+
+<h3 id="Futuras_palabras_clave_reservadas">Futuras palabras clave reservadas</h3>
+
+<p>Las siguientes están reservadas como palabras clave futuras por la especificación ECMAScript. No tienen ninguna funcionalidad especial en la actualidad, pero es posible que lo hagan en el futuro, por lo que no se pueden utilizar como identificadores.</p>
+
+<p>Estas siempre están reservadas:</p>
+
+<ul>
+ <li><code>enum</code></li>
+</ul>
+
+<p>Las siguientes solo están reservadas cuando se encuentran en código de modo estricto:</p>
+
+<ul class="threecolumns">
+ <li><code>implements</code></li>
+ <li><code>interface</code></li>
+ <li>{{jsxref("Statements/let", "let")}}</li>
+ <li><code>package</code></li>
+ <li><code>private</code></li>
+ <li><code>protected</code></li>
+ <li><code>public</code></li>
+ <li><code>static</code></li>
+ <li>{{jsxref("Operators/yield", "yield")}}</li>
+</ul>
+
+<p>Las siguientes solo están reservadas cuando se encuentran en código de módulo:</p>
+
+<ul>
+ <li><code>await</code></li>
+</ul>
+
+<h4 id="Futuras_palabras_clave_reservadas_en_estándares_más_antiguos">Futuras palabras clave reservadas en estándares más antiguos</h4>
+
+<p>Las siguientes están reservadas como palabras clave futuras según las especificaciones de ECMAScript anteriores (ECMAScript 1 a 3).</p>
+
+<ul class="threecolumns">
+ <li><code>abstract</code></li>
+ <li><code>boolean</code></li>
+ <li><code>byte</code></li>
+ <li><code>char</code></li>
+ <li><code>double</code></li>
+ <li><code>final</code></li>
+ <li><code>float</code></li>
+ <li><code>goto</code></li>
+ <li><code>int</code></li>
+ <li><code>long</code></li>
+ <li><code>native</code></li>
+ <li><code>short</code></li>
+ <li><code>synchronized</code></li>
+ <li><code>throws</code></li>
+ <li><code>transient</code></li>
+ <li><code>volatile</code></li>
+</ul>
+
+<p>Además, los literales <code>null</code>, <code>true</code> y <code>false</code> no se pueden utilizar como identificadores en ECMAScript.</p>
+
+<h3 id="Uso_de_palabras_reservadas">Uso de palabras reservadas</h3>
+
+<p>Las palabras reservadas en realidad solo se aplican a los <em>identificadores</em> (frente a los <em>nombres de identificadores</em>). Como se describe en <a href="http://es5.github.com/#A.1">es5.github.com/#A.1</a>, todos estos son <em>IdentifierName</em>s que no excluyen <em>Palabras reservadas</em>.</p>
+
+<pre class="brush: js notranslate">a.import
+a['import']
+a = { import: 'test' }.
+</pre>
+
+<p>Por otro lado, lo siguiente es ilegal porque es un <em>Identificador</em>, que es un <em>IdentifierName</em> sin palabras reservadas. Los identificadores se utilizan para <em>FunctionDeclaration</em>, <em>FunctionExpression</em>, <em>VariableDeclaration</em> y así sucesivamente. Los <em>IdentifierNames</em> se utilizan para <em>MemberExpression</em>, <em>CallExpression</em> y así sucesivamente.</p>
+
+<pre class="brush: js notranslate">function import() {} // Ilegal.</pre>
+
+<h3 id="Identificadores_con_significado_especial">Identificadores con significado especial</h3>
+
+<p>Algunos identificadores tienen un significado especial en algunos contextos sin ser palabras clave de ningún tipo. Estos incluyen:</p>
+
+<ul class="threecolumns">
+ <li>{{jsxref("Functions/arguments", "arguments")}}</li>
+ <li>{{jsxref("Functions/get", "get")}}</li>
+ <li>{{jsxref("Functions/set", "set")}}</li>
+</ul>
+
+<h2 id="Literales">Literales</h2>
+
+<h3 id="null_literal"><code>null</code> literal</h3>
+
+<p>Consulta también {{jsxref("null")}} para obtener más información.</p>
+
+<pre class="brush: js notranslate">null</pre>
+
+<h3 id="Booleanos_literales">Booleanos literales</h3>
+
+<p>Consulta también {{jsxref("Boolean", "Booleano")}} para obtener más información.</p>
+
+<pre class="brush: js notranslate">true
+false</pre>
+
+<h3 id="Literales_numéricos">Literales numéricos</h3>
+
+<p>Los tipos {{jsxref("Number")}} y {{jsxref("BigInt")}} usan literales numéricos.</p>
+
+<h4 id="Decimal">Decimal</h4>
+
+<pre class="brush: js notranslate">1234567890
+42
+
+// Precaución al usar con un cero a la izquierda:
+0888 // 888 procesado como decimal
+0777 // procesado como octal, 511 en decimal
+</pre>
+
+<p>Ten en cuenta que los decimales literales pueden comenzar con un cero (<code>0</code>) seguido de otro dígito decimal, pero si todos los dígitos después del <code>0</code> inicial son menores que 8, el número se interpreta como un número octal. Esto no arrojará JavaScript, consulta <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=957513">error 957513</a>. Consulta también la página sobre {{jsxref("parseInt", "parseInt()")}}</p>
+
+<h5 id="Exponencial">Exponencial</h5>
+
+<p>El literal exponencial decimal se especifica mediante el siguiente formato: <code>beN</code>; donde <code>b</code> es un número base (entero o flotante), seguido del caracter <code>e</code> (que sirve como separador o <em>indicador de exponente</em>) y <code>N</code>, que es un número <em>exponente</em> o <em>potencia</em>: un entero con signo (según las especificaciones ECMA-262 de 2019):</p>
+
+<pre class="brush: js notranslate">0e-5   // =&gt; 0
+0e+5   // =&gt; 0
+5e1    // =&gt; 50
+175e-2 // =&gt; 1.75
+1e3    // =&gt; 1000
+1e-3   // =&gt; 0.001
+</pre>
+
+<h4 id="Binario">Binario</h4>
+
+<p>La sintaxis de números binarios utiliza un cero inicial seguido de una letra "B" latina en minúscula o mayúscula (<code>0b</code> o <code>0B</code>). Debido a que esta sintaxis es nueva en ECMAScript 2015, consulta la tabla de compatibilidad del navegador a continuación. Si los dígitos después de <code>0b</code> no son 0 o 1, se muestra el siguiente {{jsxref("SyntaxError")}}: "Faltan dígitos binarios después de 0b".</p>
+
+<pre class="brush: js notranslate">var FLT_SIGNBIT  = 0b10000000000000000000000000000000; // 2147483648
+var FLT_EXPONENT = 0b01111111100000000000000000000000; // 2139095040
+var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607</pre>
+
+<h4 id="Octal">Octal</h4>
+
+<p>La sintaxis de números octales utiliza un cero inicial seguido de una letra "O" latina en minúscula o mayúscula (<code>0o</code> o <code>0O</code>). Debido a que esta sintaxis es nueva en ECMAScript 2015, consulta la tabla de compatibilidad del navegador a continuación. Si los dígitos después del <code>0o</code> están fuera del rango (01234567), se lanza el siguiente {{jsxref("SyntaxError")}}: "Dígitos octales faltantes después del 0o".</p>
+
+<pre class="brush: js notranslate">var n = 0O755; // 493
+var m = 0o644; // 420
+
+// También es posible con solo un cero inicial (ve la nota sobre los decimales arriba)
+0755
+0644
+</pre>
+
+<h4 id="Hexadecimal">Hexadecimal</h4>
+
+<p>La sintaxis de números hexadecimales utiliza un cero inicial seguido de una letra "X" latina en minúscula o mayúscula (<code>0x</code> o <code>0X</code>). Si los dígitos después de 0x están fuera del rango (0123456789ABCDEF), se lanza el siguiente {{jsxref("SyntaxError")}}: "El identificador comienza inmediatamente después del literal numérico".</p>
+
+<pre class="brush: js notranslate">0xFFFFFFFFFFFFFFFFF // 295147905179352830000
+0x123456789ABCDEF   // 81985529216486900
+0XA                 // 10
+</pre>
+
+<h4 id="BigInt_literal">BigInt literal</h4>
+
+<p>El tipo {{jsxref("BigInt")}} es una primitiva numérica en JavaScript que puede representar números enteros con precisión arbitraria. Los BigInt literales se crean agregando <code>n</code> al final de un número entero.</p>
+
+<pre class="brush: js notranslate">123456789123456789n     // 123456789123456789
+0o777777777777n         // 68719476735
+0x123456789ABCDEFn      // 81985529216486895‬
+0b11101001010101010101n // 955733
+</pre>
+
+<p>Ten en cuenta que los números octales heredados con solo un cero a la izquierda no funcionarán para <code>BigInt</code>:</p>
+
+<pre class="brush: js example-bad notranslate">// 0755n
+// SyntaxError: sintaxis de BigInt no válida</pre>
+
+<p>Para números <code>BigInt</code> octales, siempre utiliza cero seguido de la letra "o" (mayúscula o minúscula):</p>
+
+<pre class="brush: js example-good notranslate">0o755n</pre>
+
+<p>Para obtener más información sobre <code>BigInt</code>, consulta también <a href="/es/docs/Web/JavaScript/Data_structures#BigInt_type">estructuras de datos JavaScript</a>.</p>
+
+<h4 id="Separadores_numéricos">Separadores numéricos</h4>
+
+<p>Para mejorar la legibilidad de literales numéricos, se pueden usar guiones bajos (<code>_</code>, <code>U+005F</code>) como separadores:</p>
+
+<pre class="brush: js notranslate">// separadores en números decimales
+1_000_000_000_000
+1_050.95
+
+// separadores en números binarios
+0b1010_0001_1000_0101
+
+// separadores en números octales
+0o2_2_5_6
+
+// separadores en números hexadecimales
+0xA0_B0_C0
+
+// separadores en BigInts
+1_000_000_000_000_000_000_000n
+</pre>
+
+<p>Ten en cuenta estas limitaciones:</p>
+
+<pre class="brush: js example-bad notranslate"> // No se permite más de un guión bajo en una fila
+100__000; // SyntaxError
+
+// No permitido al final de literales numéricos
+100_; // SyntaxError
+
+// No se puede usar después de 0
+0_1; // SyntaxError
+</pre>
+
+<h3 id="Objetos_literales">Objetos literales</h3>
+
+<p>Consulta también {{jsxref("Object")}} e <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">Iniciador de objeto</a> para obtener más información.</p>
+
+<pre class="brush: js notranslate">var o = { a: 'foo', b: 'bar', c: 42 };
+
+// notación abreviada. Nueva en ES2015
+var a = 'foo', b = 'bar', c = 42;
+var o = {a, b, c};
+
+// en vez de
+var o = { a: a, b: b, c: c };
+</pre>
+
+<h3 id="Arreglos_literales">Arreglos literales</h3>
+
+<p>Consulta también {{jsxref("Array")}} para obtener más información.</p>
+
+<pre class="brush: js notranslate">[1954, 1974, 1990, 2014]</pre>
+
+<h3 id="Cadenas_literales">Cadenas literales</h3>
+
+<p>Una cadena literal es cero o más puntos de código Unicode entre comillas simples o dobles. Los puntos de código Unicode también se pueden representar mediante una secuencia de escape. Literalmente todos los puntos de código pueden aparecer en una cadena literal, excepto estos puntos de código de cierre de cita:</p>
+
+<ul>
+ <li>U+005C \ (backslash),</li>
+ <li>U+000D &lt;CR&gt;,</li>
+ <li>y U+000A &lt;LF&gt;.</li>
+</ul>
+
+<p>Antes de la <a href="https://github.com/tc39/proposal-json-superset">propuesta para hacer que todo el texto JSON sea ECMA-262 válido</a>, U+2028 &lt;LS&gt; y U+2029 &lt;PS&gt;, tampoco se permitió que aparecieran sin escape en las cadenas literales.</p>
+
+<p>Cualquier punto de código puede aparecer en forma de secuencia de escape. Las cadenas literales se evalúan como valores de cadena de ECMAScript. Al generar estos valores de cadena, los puntos de código Unicode están codificados en UTF-16.</p>
+
+<pre class="brush: js notranslate">'foo'
+"bar"</pre>
+
+<h4 id="Secuencias_de_escape_hexadecimales">Secuencias de escape hexadecimales</h4>
+
+<p>Las secuencias de escape hexadecimales constan de <code>\x</code> seguido de exactamente dos dígitos hexadecimales que representan una unidad de código o un punto de código en el rango de 0x0000 a 0x00FF.</p>
+
+<pre class="brush: js notranslate">'\xA9' // "©"
+</pre>
+
+<h4 id="Secuencias_de_escape_Unicode">Secuencias de escape Unicode</h4>
+
+<p>Una secuencia de escape Unicode consta exactamente de cuatro dígitos hexadecimales después de <code>\u</code>. Representa una unidad de código en la codificación UTF-16. Para los puntos de código U+0000 a U+FFFF, la unidad de código es igual al punto de código. Los puntos de código U+10000 a U+10FFFF requieren dos secuencias de escape que representan las dos unidades de código (un par sustituto) utilizadas para codificar el carácter; el par sustituto es distinto del punto de código.</p>
+
+<p>Consulta también {{jsxref("String.fromCharCode()")}} y {{jsxref("String.prototype.charCodeAt()")}}.</p>
+
+<pre class="brush: js notranslate">'\u00A9' // "©" (U+A9)</pre>
+
+<h4 id="Puntos_de_escape_de_código_Unicode">Puntos de escape de código Unicode</h4>
+
+<p>Un punto de código de escape Unicode consta de <code>\u{</code>, seguido de un punto de código en base hexadecimal, seguido de <code>}</code>. El valor de los dígitos hexadecimales debe estar en el rango 0 y 0x10FFFF inclusive. Los puntos de código en el rango U+10000 a U+10FFFF no necesitan representarse como un par sustituto. Se agregaron puntos de código de escape a JavaScript en ECMAScript 2015 (ES6).</p>
+
+<p>Consulta también {{jsxref("String.fromCodePoint()")}} y {{jsxref("String.prototype.codePointAt()")}}.</p>
+
+<pre class="brush: js notranslate">'\u{2F804}' // CJK COMPATIBILIDAD IDEOGRÁFICA-2F804 (U+2F804)
+
+// el mismo caracter representado como un par suplente
+'\uD87E\uDC04'</pre>
+
+<h3 id="Expresión_regular_literal">Expresión regular literal</h3>
+
+<p>Consulta también {{jsxref("RegExp")}} para obtener más información.</p>
+
+<pre class="brush: js notranslate">/ab+c/g
+
+// Una expresión regular literal "vacía"
+// El grupo de no captura vacío es necesario
+// para evitar la ambigüedad con comentarios de una sola línea.
+/(?:)/</pre>
+
+<h3 id="Plantillas_literales">Plantillas literales</h3>
+
+<p>Consulta también <a href="/es/docs/Web/JavaScript/Reference/template_strings">cadenas de plantilla</a> para obtener más información.</p>
+
+<pre class="brush: js notranslate">`string text`
+
+`string text line 1
+ string text line 2`
+
+`string text ${expression} string text`
+
+tag `string text ${expression} string text`</pre>
+
+<h2 id="Inserción_automática_de_punto_y_coma">Inserción automática de punto y coma</h2>
+
+<p>Algunas <a href="/es/docs/Web/JavaScript/Reference/Statements">declaraciones JavaScript</a> se deben terminar con punto y coma y, por lo tanto, se ven afectadas por la inserción automática del punto y coma (IAPC):</p>
+
+<ul>
+ <li>Declaración vacía</li>
+ <li><code>let</code>, <code>const</code>, declaración de variable</li>
+ <li><code>import</code>, <code>export</code>, declaración de módulo</li>
+ <li>Declaración de expresión</li>
+ <li><code>debugger</code></li>
+ <li><code>continue</code>, <code>break</code>, <code>throw</code></li>
+ <li><code>return</code></li>
+</ul>
+
+<p>La especificación ECMAScript menciona <a href="https://tc39.github.io/ecma262/#sec-rules-of-automatic-semicolon-insertion">tres reglas de inserción de punto y coma</a>.</p>
+
+<p>1. Se inserta un punto y coma antes, cuando se encuentra un <a href="#Line_terminators">terminador de línea</a> o "}" que no está permitido por la gramática.</p>
+
+<pre class="brush: js notranslate">{ 1 2 } 3
+
+// La IAPC lo transforma en
+
+{ 1 2 ;} 3;</pre>
+
+<p>2. Se inserta un punto y coma al final, cuando se detecta el final del flujo de entrada de símbolos y el analizador no puede procesar el único flujo de entrada como un programa completo.</p>
+
+<p>Aquí <code>++</code> no se trata como un <a href="/es/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment">operador sufijo</a> que se aplica a la variable <code>b</code>, porque se produce un terminador de línea entre <code>b</code> y <code>++</code>.</p>
+
+<pre class="brush: js notranslate">a = b
+++c
+
+// IAPC lo transforma en
+
+a = b;
+++c;
+</pre>
+
+<p>3. Se inserta un punto y coma al final, cuando una declaración con producción restringida en la gramática va seguida de un terminador de línea. Estas declaraciones con reglas "no LineTerminator aquí" son:</p>
+
+<ul>
+ <li>PostfixExpressions (<code>++</code> y <code>--</code>)</li>
+ <li><code>continue</code></li>
+ <li><code>break</code></li>
+ <li><code>return</code></li>
+ <li><code>yield</code>, <code>yield*</code></li>
+ <li><code>module</code></li>
+</ul>
+
+<pre class="brush: js notranslate">return
+a + b
+
+// La IAPC lo transforma en
+
+return;
+a + b;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-ecmascript-language-lexical-grammar', 'Gramática léxica')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.grammar")}}</p>
+
+<h3 id="Progreso_de_la_implementación">Progreso de la implementación</h3>
+
+<p>La siguiente tabla proporciona un estado de implementación diario para esta función, porque esta función aún no ha alcanzado la estabilidad entre navegadores. Los datos se generan al ejecutar las pruebas de funciones relevantes en <a href="https://github.com/tc39/test262">Test262</a>, el conjunto de pruebas estándar de JavaScript, en la compilación nocturna o en la última versión del motor JavaScript de cada navegador.</p>
+
+<div>{{EmbedTest262ReportResultsTable("hashbang")}}</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="http://whereswalden.com/2013/08/12/micro-feature-from-es6-now-in-firefox-aurora-and-nightly-binary-and-octal-numbers/">Jeff Walden: números binarios y octales</a></li>
+ <li><a href="http://mathiasbynens.be/notes/javascript-escapes">Mathias Bynens: caracteres de secuencias de escape JavaScript</a></li>
+ <li>{{jsxref("Boolean", "Booleanos")}}</li>
+ <li>{{jsxref("Number", "Números")}}</li>
+ <li>{{jsxref("RegExp")}}</li>
+ <li>{{jsxref("String", "Cadenas de texto (Strings)")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/addition/index.html b/files/es/web/javascript/reference/operators/addition/index.html
new file mode 100644
index 0000000000..58e5d58dae
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/addition/index.html
@@ -0,0 +1,78 @@
+---
+title: Adición (+)
+slug: Web/JavaScript/Reference/Operators/Addition
+translation_of: Web/JavaScript/Reference/Operators/Addition
+original_slug: Web/JavaScript/Referencia/Operadores/Adición
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de adición (<code>+</code>) produce la suma de operandos numéricos o la concatenación de (cadenas) string.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-addition.html")}}</div>
+
+<div></div>
+
+<p class="hidden">La fuente para este ejemplo interactivo está almacenado en un repositorio Github. Si te gustaría contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envianos una pull-request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><strong>Operator:</strong> <var>x</var> + <var>y</var>
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Adición_numérica">Adición numérica</h3>
+
+<pre class="brush: js notranslate">// Número + Número -&gt; adición
+1 + 2 // 3
+
+// Booleano + Número -&gt; adición
+true + 1 // 2
+
+// Booleano + Booleano -&gt; adición
+false + false // 0
+</pre>
+
+<h3 id="Concatenación_de_cadenas_String">Concatenación de (cadenas) String</h3>
+
+<pre class="brush: js notranslate">// String + String -&gt; concatenación
+'fut' + 'bol' // "futbol"
+
+// Número + String -&gt; concatenación
+5 + 'oh' // "5oh"
+
+// String + Booleano -&gt; concatenación
+'fut' + false // "futfalse"</pre>
+
+<h2 id="Especificación">Especificación</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-addition-operator-plus', 'Addition operator')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_Explorador">Compatibilidad de Explorador</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si quieres contribuir a estos datos, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envía un pull request.</div>
+
+<p>{{Compat("javascript.operators.addition")}}</p>
+
+<h2 id="También_revisa">También revisa</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/assignment/index.html b/files/es/web/javascript/reference/operators/assignment/index.html
new file mode 100644
index 0000000000..0ec71e252e
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/assignment/index.html
@@ -0,0 +1,63 @@
+---
+title: Asignacion (=)
+slug: Web/JavaScript/Reference/Operators/Assignment
+tags:
+  - JS
+  - JavaScript
+  - Operador de Asignacion
+  - Operadores JavaScript
+  - Referências
+translation_of: Web/JavaScript/Reference/Operators/Assignment
+original_slug: Web/JavaScript/Referencia/Operadores/Asignacion
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de asignación (=) se utiliza para asignar un valor a una variable. La operación de asignación evalúa el valor asignado. Es posible encadenar el operador de asignación para asignar un solo valor a múltiples variables</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-assignment.html")}}</div>
+
+<div></div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> x = y
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Asignación">Asignación</h3>
+
+<pre class="brush: js notranslate">// Asumimos las siguientes variables
+//  x = 5
+//  n = 10
+//  z = 25
+
+x = n     // La variable x contiene el valor 10
+x = n = z // x = n (es decir 10) y z pisa el valor total remplazandolo por 25</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-assignment-operators', 'Assignment operators')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.assignment")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#Assignment">Assignment operators in the JS guide</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/async_function/index.html b/files/es/web/javascript/reference/operators/async_function/index.html
new file mode 100644
index 0000000000..679e82d997
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/async_function/index.html
@@ -0,0 +1,103 @@
+---
+title: Expresión de función asíncrona
+slug: Web/JavaScript/Reference/Operators/async_function
+tags:
+  - Expresión Primaria
+  - JavaScript
+  - Operador
+  - función
+translation_of: Web/JavaScript/Reference/Operators/async_function
+original_slug: Web/JavaScript/Referencia/Operadores/async_function
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>La palabra clave <strong><code>async function</code></strong> puede ser utilizada para definir funciones <code>async</code> dento de expresiones.</p>
+
+<p>También se pueden definir funciones asíncronas utilizando un<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function" title="The async function keyword can be used to define async functions inside expressions."> enunciado de función asíncrona</a>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">async function [nombre]([<var>param1</var>[, <var>param2</var>[, ..., <var>paramN</var>]]]) {
+   <var>enunciados</var>
+}</pre>
+
+<p>A partir de ES2015 (ES6), también se pueden emplear <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">funciones flecha.</a></p>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>name</var></code></dt>
+ <dd>El nombre de la función. Puede ser omitida, en cuy caso la función es <em>anónima</em>. El nombre es sólo local al cuerpo de la función The name is only local to the function body.</dd>
+ <dt><code><var>paramN</var></code></dt>
+ <dd>El nombre de un argumento a ser pasado a la función.</dd>
+ <dt><code><var>statements</var></code></dt>
+ <dd>Los enunciados que componen el cuerpo de la función.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Una expresión <code>async function</code> es miuy similar, y casi tiene la misma sintaxis que, una {{jsxref('Statements/async_function', 'async function statement')}}. La principal diferencia entre una expresión <code>async function</code> y un enunciado <code>async function</code> es el <em>nombre de la función</em>, que puede ser omitido en una expresión <code>async function</code> para crear funciones <em>anonymous</em>. Una expresión <code>async function</code> puede ser utilizada como un {{Glossary("IIFE")}} (Expresión de función inmediatamente invocada, Immediately Invoked Function Expression) que se ejecuta tan rápido como es definida. Ver el capítulo sobre <a href="/en-US/docs/Web/JavaScript/Reference/Functions">funciones</a> para tener más información.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_sencillo">Ejemplo sencillo</h3>
+
+<pre class="brush: js">function resuelve2SegundosDespues(x) {
+  return new Promise(resolve =&gt; {
+    setTimeout(() =&gt; {
+      resolve(x);
+    }, 2000);
+  });
+};
+
+
+const agregar= async function(x) { // Expresión de una función asíncrona asignada a una variable
+  let a = await resuelve2SegundosDespues(20);
+  let b = await resuelve2SegundosDespues(30);
+  return x + a + b;
+};
+
+agregar(10).then(v =&gt; {
+  console.log(v);  // imprime 60 después de 4 segundos.
+});
+
+
+(async function(x) { // expresión de una función asíncrona utilizada como una IIFE
+  let p_a = resuelve2SegundosDespues(20);
+  let p_b = resuelve2SegundosDespues(30);
+  return x + await p_a + await p_b;
+})(10).then(v =&gt; {
+  console.log(v);  // imprime 60 después de 2 segundos.
+});
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-async-function-definitions', 'async function')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.operators.async_function_expression")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Statements/async_function", "async function")}}</li>
+ <li>Objeto {{jsxref("AsyncFunction")}}</li>
+ <li>{{jsxref("Operators/await", "await")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/await/index.html b/files/es/web/javascript/reference/operators/await/index.html
new file mode 100644
index 0000000000..74f94bf214
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/await/index.html
@@ -0,0 +1,103 @@
+---
+title: await
+slug: Web/JavaScript/Reference/Operators/await
+translation_of: Web/JavaScript/Reference/Operators/await
+original_slug: Web/JavaScript/Referencia/Operadores/await
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<div>El operador <code>await</code> es usado para esperar a una {{jsxref("Promise")}}. Sólo puede ser usado dentro de una función {{jsxref("Statements/async_function", "async function")}}.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">[<em>rv</em>] = await <em>expression</em>;</pre>
+
+<dl>
+ <dt><code>expression</code></dt>
+ <dd>Una {{jsxref("Promise")}} o cualquier otro valor por el cual haya que esperar.</dd>
+ <dt><code>rv</code></dt>
+ <dd>
+ <p>Regresa el valor terminado de la promesa o solamente un valor si no es una<code>Promise</code>.</p>
+ </dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La expresión <code>await</code> provoca que la ejecución de una función <code>async</code> sea pausada hasta que una <code>Promise</code> sea terminada o rechazada, y regresa a la ejecución de la función <code>async</code> después del término. Al regreso de la ejecución, el valor de la expresión <code>await</code> es la regresada por una promesa terminada.</p>
+
+<p>Si la <code>Promise</code> es rechazada, el valor de la expresión <code>await</code> tendrá el valor de rechazo.</p>
+
+<p>Si el valor de la expresión seguida del operador <code>await</code>  no es una promesa, será convertido a una <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/resolve">resolved Promise</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Si una <code>Promise</code> se pasa a una expresión <code>await</code>, espera a que la <code>Promise</code> se resuelva y devuelve el valor resuelto.</p>
+
+<pre class="brush: js">function resolveAfter2Seconds(x) {
+  return new Promise(resolve =&gt; {
+    setTimeout(() =&gt; {
+      resolve(x);
+    }, 2000);
+  });
+}
+
+async function f1() {
+  var x = await resolveAfter2Seconds(10);
+  console.log(x); // 10
+}
+f1();
+</pre>
+
+<p>Si el valor no es una <code>Promise</code>, convierte el valor a una <code>Promise</code> resuelta, y espera por dicho valor.</p>
+
+<pre class="brush: js">async function f2() {
+  var y = await 20;
+  console.log(y); // 20
+}
+f2();</pre>
+
+<p>Si la <code>Promise</code> es rechazada, se lanza una excepción con dicho el valor.</p>
+
+<pre class="brush: js">async function f3() {
+  try {
+    var z = await Promise.reject(30);
+  } catch(e) {
+    console.log(e); // 30
+  }
+}
+f3();</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-async-function-definitions', 'async functions')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Initial definition in ES2017.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página es generada a partir de información estructurada. Si quisieras contribuir a esta información, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</div>
+
+<p>{{Compat("javascript.operators.await")}}</p>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Statements/async_function", "async function")}}</li>
+ <li>{{jsxref("Operators/async_function", "async function expression")}}</li>
+ <li>{{jsxref("AsyncFunction")}} object</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/class/index.html b/files/es/web/javascript/reference/operators/class/index.html
new file mode 100644
index 0000000000..9800963fd7
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/class/index.html
@@ -0,0 +1,158 @@
+---
+title: expresión class
+slug: Web/JavaScript/Reference/Operators/class
+tags:
+  - Classes
+  - ECMAScript6
+  - Expression
+  - JavaScript
+  - Operator
+  - Reference
+translation_of: Web/JavaScript/Reference/Operators/class
+original_slug: Web/JavaScript/Referencia/Operadores/class
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>La <strong>expresión class</strong> es una forma de definir una clase en ECMAScript 2015 (ES6). Similar a las <a href="/es/docs/Web/JavaScript/Referencia/Operadores/function">funciones</a>, las expresiones de clase pueden ser nombradas o no. Si se nombran, el nombre de la clase es local sólo en el cuerpo de la clase. Las clases en JavaScript utilizan herencia basada en prototipos.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">var MyClass = class <em>[className]</em> [extends] {
+  // class body
+};</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Una expresión de clase tiene una sintaxis similar a la <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/class">declaración de una clase</a>. Sin embargo, con las expresiones de clases, está permitido omitir el nombre de la clase ("identificador de enlace"), cosa que no se puede hacer con las declaraciones de clases. Además, las expresiones de clases permiten redefinir/redeclarar clases y <strong>no lanzar</strong> ningún tipo de error como las <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/class">declaraciones de clases</a>. La propiedad <code>constructor</code> es opcional. Y el <em>typeof </em>de las clases generadas con esta palabra clave siempre será "function".</p>
+
+<p>Tal y como en la declaración de clases, el cuerpo de la expresión de clase se ejecuta en <a href="/es/docs/Web/JavaScript/Referencia/Modo_estricto">modo estricto</a>.</p>
+
+<pre class="brush: js">'use strict';
+var Foo = class {}; // la propiedad constructor es opcional
+var Foo = class {}; // Se permite repetir declaraciones
+
+typeof Foo; // devuelve "function"
+typeof class {}; // devuelve "function"
+
+Foo instanceof Object; // true
+Foo instanceof Function; // true
+class Foo {}; // Lanza TypeError, no permite volver a declararla
+</pre>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Una_clase_sencilla">Una clase sencilla</h3>
+
+<p>Esta es una sencilla expresión de clase anónima a la que se puede hacer referencia utilizando la variable "Foo".</p>
+
+<pre class="brush: js">var Foo = class {
+  constructor() {}
+  bar() {
+    return "Hello World!";
+  }
+};
+
+var instance = new Foo();
+instance.bar(); // "Hello World!"
+Foo.name; // "Foo"
+</pre>
+
+<h3 id="Expresiones_de_clase_con_nombre">Expresiones de clase con nombre</h3>
+
+<p>Si se quiere hacer referencia a la clase actual dentro del cuerpo de la clase, se puede crear una expresión de clase con nombre. Este nombre sólo será visible en el mismo contexto de la expresión de clase.</p>
+
+<pre class="brush: js">var Foo = class NamedFoo {
+  constructor() {}
+  whoIsThere() {
+    return NamedFoo.name;
+  }
+}
+var bar = new Foo();
+bar.whoIsThere(); // "NamedFoo"
+NamedFoo.name; // ReferenceError: NamedFoo no está definido
+Foo.name; // "NamedFoo"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-class-definitions', 'Class definitions')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>{{CompatGeckoDesktop(45)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome para Android</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>{{CompatGeckoMobile(45)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(42.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Operadores/function">expresión <code>function</code></a></li>
+ <li><code><a href="/es/docs/Web/JavaScript/Referencia/Sentencias/class">declaración class</a></code></li>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Classes">Clases</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/comma_operator/index.html b/files/es/web/javascript/reference/operators/comma_operator/index.html
new file mode 100644
index 0000000000..b1325fbea0
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/comma_operator/index.html
@@ -0,0 +1,133 @@
+---
+title: Operador Coma
+slug: Web/JavaScript/Reference/Operators/Comma_Operator
+tags:
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Operators/Comma_Operator
+original_slug: Web/JavaScript/Referencia/Operadores/operador_coma
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador coma evalua cada uno de sus operandos (de izquierda a derecha) y retorna el valor del último operando.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>expr1</em>, <em>expr2, expr3...</em></pre>
+
+<h2 id="Parámetros">Parámetros</h2>
+
+<dl>
+ <dt><code>expr1</code>, <code>expr2, expr3...</code></dt>
+ <dd>Cualquier expresión.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Puede usar el operador coma cuando deseé mútiples expresiones en una localización que requiere una sola expresión. El uso más común de este operador es proveer múltiples parámetros en un búcle for</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<p>Si a es un array de dos dimensiones con 10 elementos en un lado, el siguiente código usa el operador coma para incrementar dos variables a la vez. Note que la coma en la sentencia var <strong>no </strong>es el operador coma, porque no existe adentro de una expresión.Más bien, es un carácter especial en sentencias var para combinar a múltiples de ellas en una sola. Sin embargo, esa coma se comporta casi igual que el operador coma. El código imprime los valores de los elementos diagonales en el array:</p>
+
+<pre class="brush:js;highlight:[1]">for (var i = 0, j = 9; i &lt;= 9; i++, j--)
+  document.writeln("a[" + i + "][" + j + "] = " + a[i][j]);</pre>
+
+<h3 id="Procesar_y_luego_retornar">Procesar y luego retornar:</h3>
+
+<p>Otro ejemplo de lo que se puede hacer con el operador coma es procesar antes de retornar. Como se mencionó, solo el último elemento será retornado pero todos los otros también van a ser evaluados. Así, se puede hacer:</p>
+
+<pre class="brush: js">function myFunc () {
+  var x = 0;
+
+  return (x += 1, x); // the same as return ++x;
+}</pre>
+
+<h2 id="Específicaciones">Específicaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-comma-operator', 'Comma operator')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-comma-operator', 'Comma operator')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.14', 'Comma operator')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-11.14', 'Comma operator')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>3.0</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for">for loop</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/conditional_operator/index.html b/files/es/web/javascript/reference/operators/conditional_operator/index.html
new file mode 100644
index 0000000000..8f26d6ce67
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/conditional_operator/index.html
@@ -0,0 +1,172 @@
+---
+title: Operador condicional (ternario)
+slug: Web/JavaScript/Reference/Operators/Conditional_Operator
+tags:
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators/Conditional_Operator
+original_slug: Web/JavaScript/Referencia/Operadores/Conditional_Operator
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<div>El<strong> operador condicional </strong>(<strong>ternario</strong>) es el único operador en JavaScript que tiene tres operandos. Este operador se usa con frecuencia como atajo para la instrucción <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/if...else">if</a>.</div>
+
+<div> </div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>condición </em>? <em>expr1</em> : <em>expr2</em> </pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>condición</code></dt>
+ <dd>Una expresión que se evalúa como true o false.</dd>
+ <dt>
+ <div class="syntaxbox"><code>expr1</code>, <code>expr2</code></div>
+ </dt>
+ <dd>Expresión con valores de algún tipo.</dd>
+ <dt>
+ <h2 id="Descripción">Descripción</h2>
+ </dt>
+</dl>
+
+<p>Si la <code>condición</code> es <code>true</code>, el operador retorna el valor de la <code>expr1</code>; de lo contrario,  devuelve el valor de <code>expr2</code>. Por ejemplo, para mostrar un mensaje diferente en función del valor de la variable <em><code>isMember,</code></em> se puede usar esta declaración:</p>
+
+<pre class="brush: js">"La Cuota es de:  " + (isMember ? "$2.00" : "$10.00")
+</pre>
+
+<p>También puedes asignar variables dependiendo del resultado de la condición ternaria:</p>
+
+<pre class="brush: js">var elvisLives = Math.PI &gt; 4 ? "Sip" : "Nop";</pre>
+
+<p>También es posible realizar evaluaciones ternarias múltiples (Nota: El operador condicional es asociativo):</p>
+
+<pre class="brush: js">var firstCheck = false,
+    secondCheck = false,
+    access = firstCheck ? "Acceso Denegado" : secondCheck ? "Acceso Denegado" : "Acceso Permitido";
+
+console.log( access ); // muestra "Acceso Permitido"</pre>
+
+<p>También puede usar operaciones ternarias en espacio vacío con el propósito de realizar diferentes operaciones:</p>
+
+<pre class="brush: js">var stop = false, age = 16;
+
+age &gt; 18 ? location.assign("continue.html") : stop = true;
+</pre>
+
+<p>También puede realizar más de una operación por caso, separándolas con una coma:</p>
+
+<pre class="brush: js">var stop = false, age = 23;
+
+age &gt; 18 ? (
+    alert("OK, puedes continuar."),
+    location.assign("continue.html")
+) : (
+    stop = true,
+    alert("Disculpa, eres menor de edad!")
+);
+</pre>
+
+<p>También puede realizar más de una operación durante la asignación de un valor. En este caso, <strong><em>el último valor separado por una coma del paréntesis </em>será el valor asignado</strong>.</p>
+
+<pre class="brush: js">var age = 16;
+
+var url = age &gt; 18 ? (
+    alert("OK, puedes continuar."),
+    // alert devuelve "undefined", pero será ignorado porque
+    // no es el último valor separado por comas del paréntesis
+    "continue.html" // el valor a ser asignado si age &gt; 18
+) : (
+    alert("Eres menor de edad!"),
+    alert("Disculpa :-("),
+    // etc. etc.
+    "stop.html" // el valor a ser asignado si !(age &gt; 18)
+);
+
+location.assign(url); // "stop.html"</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-conditional-operator', 'Conditional Operator')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.12', 'The conditional operator')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-11.12', 'The conditional operator')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial implementada en JavaScript 1.0.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/if...else">if statement</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/decrement/index.html b/files/es/web/javascript/reference/operators/decrement/index.html
new file mode 100644
index 0000000000..5be9b1f986
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/decrement/index.html
@@ -0,0 +1,84 @@
+---
+title: Decremento(--)
+slug: Web/JavaScript/Reference/Operators/Decrement
+tags:
+  - Decremento
+  - JavaScript
+  - JavaScript basico
+  - Operadores
+translation_of: Web/JavaScript/Reference/Operators/Decrement
+original_slug: Web/JavaScript/Referencia/Operadores/Decremento
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de decremento (--) disminuye (o resta de a uno) su operando y retorna un valor.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-decrement.html")}}</div>
+
+<div></div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><strong>Operadores:</strong> <var>x</var>-- o --<var>x</var>
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si usamos la forma de sufijo, operador después del operando (por ejemplo, <code>x--</code>), el operador de disminución disminuye y devuelve el valor antes de disminuir.</p>
+
+<p>Si se usamos la forma de prefijo, operador antes del operando (por ejemplo, <code>--x</code>), el operador de disminución disminuye y devuelve el valor después de disminuir.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_Sufijo">Usando Sufijo </h3>
+
+<pre class="brush: js notranslate">let x = 3;
+y = x--;
+
+// y = 3
+// x = 2
+</pre>
+
+<h3 id="Usando_Prefijo">Usando Prefijo</h3>
+
+<pre class="brush: js notranslate">let a = 2;
+b = --a;
+
+// a = 1
+// b = 1
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-postfix-decrement-operator', 'Decrement operator')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.decrement")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/delete/index.html b/files/es/web/javascript/reference/operators/delete/index.html
new file mode 100644
index 0000000000..94ede3308d
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/delete/index.html
@@ -0,0 +1,243 @@
+---
+title: operador delete
+slug: Web/JavaScript/Reference/Operators/delete
+translation_of: Web/JavaScript/Reference/Operators/delete
+original_slug: Web/JavaScript/Referencia/Operadores/delete
+---
+<div>
+<div>{{jsSidebar("Operators")}}</div>
+</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>El operador <code>delete</code>  elimina una propiedad de un objeto.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox">delete expresión </pre>
+
+<p>donde la <em>expresión</em> debe evaluar una referencia de la propiedad, por ejemplo:</p>
+
+<pre class="syntaxbox">delete <em>objeto.propiedad</em>
+delete <em>objeto</em>['<em>propiedad</em>']
+</pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<dl>
+ <dt><code>objeto</code></dt>
+ <dd>El nombre de un objeto, o una expresión que evalua a un objeto.</dd>
+ <dt><code>propiedad</code></dt>
+ <dd>La propiedad a eliminar.</dd>
+</dl>
+
+<h3 id="Returns" name="Returns">Retorno</h3>
+
+<p>En <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">modo estricto</a> arroja una excepción si la propiedad no es configurable (retorna <code>false</code> en modo no estricto). Retorna <code>true</code> en cualquier otro caso.</p>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Al contrario de lo que se podría pensar, el operador <code>delete</code> no tiene nada que ver con liberar memoria (sólo lo hace de manera indirecta eliminando referencias. Más detalles en la página de<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Gestion_de_Memoria"> gestión de memoria</a>).</p>
+
+<p>Si la operación <code>delete</code> funciona correctamente, eliminará la propiedad del objeto por completo. Sin embargo, si existe otra propiedad con el mismo nombre en la cadena del <code>prototype </code>del objeto, éste heredará la propiedad del <code>prototype</code>.</p>
+
+<p><code>delete</code> sólo es efectivo en propiedades de objetos. No tiene ningún efecto en variables o en nombres de funciones.<br>
+ Aunque a veces son mal identificados como variables globales, las asignaciones que no especifican al objeto (ejemplo: x = 5), son en realidad propiedades que se asignan al objeto global.</p>
+
+<p><code>delete</code> no puede eliminar ciertas propiedades de los objetos predefinidos (como Object, Array, Math etc). Estos están descritos en ECMAScript 5 y más tarde como no configurables.</p>
+
+<h3 id="Temporal_dead_zone">Temporal dead zone</h3>
+
+<p>The "<a href="/en-US/docs/Web/JavaScript/Reference/Statements/let#Temporal_dead_zone_and_errors_with_let">temporal dead zone"</a> (TDZ), specified in ECMAScript 6 for <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/const">const</a></code> and <a href="/en-US/docs/Web/JavaScript/Reference/Statements/let"><code>let</code></a> declarations, also applies to the <code>delete</code> operator. Thus, code like the following will throw a {{jsxref("ReferenceError")}}.</p>
+
+<pre class="brush: js">function foo() {
+  delete x;
+  let x;
+}
+
+function bar() {
+  delete y;
+  const y;
+}</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: js">x = 42;         // crea la propiedad x en el objeto global
+var y = 43;     // crea la propiedad y en el objeto global, y la marca como no configurable
+myobj = {
+  h: 4,
+  k: 5
+};
+
+// x es una propiedad del objeto global y puede ser eliminada
+delete x;       // retorna true
+
+// y no es configurable, por lo tanto no puede ser eliminada
+delete y;       // retorna false
+
+// delete no afecta a ciertas propiedades predefinidas
+delete Math.PI; // retorna false
+
+// las propiedades definidas por el usuario pueden eliminarse
+delete myobj.h; // retorna true
+
+// myobj es una propiedad del objeto global, no una variable,
+// por lo tanto puede eliminarse
+delete myobj;   // retorna true
+
+function f() {
+  var z = 44;
+
+  // delete no afecta a nombres de variables locales
+  delete z;     // retorna false
+}
+</pre>
+
+<p>Si el objeto hereda una propiedad de un prototype, y no tiene la propiedad en sí, la propiedad no puede ser eliminada por referencia al objeto. Aun así, puedes eliminarla directamente en el prototype.</p>
+
+<p>If the object inherits a property from a prototype, and doesn't have the property itself, the property can't be deleted by referencing the object. You can, however, delete it directly on the prototype.</p>
+
+<pre class="brush: js">function Foo(){}
+Foo.prototype.bar = 42;
+var foo = new Foo();
+
+// retorna true, pero sin ningún efecto,
+// ya que bar es una propiedad heredada
+delete foo.bar;
+
+// logs 42, propiedad aún heredada
+console.log(foo.bar);
+
+// elimina la propiedad en el prototype
+delete Foo.prototype.bar;
+
+// logs "undefined", propiedad no heredada
+console.log(foo.bar);           </pre>
+
+<h3 id="Deleting_array_elements" name="Deleting_array_elements">Eliminando elementos de un array</h3>
+
+<p>Cuando eliminas un elemento de un array, la longitud del array no se ve afectada. Esta se mantiene incluso si eliminas el último elemento del array.</p>
+
+<p>Cuando el operador <code>delete</code> elimina un elemento de un array, este elemento ya no está en el array. En el siguiente ejemplo, <code>trees[3]</code> es eliminado mediante <code>delete</code>.</p>
+
+<pre class="brush: js">var trees = ["redwood","bay","cedar","oak","maple"];
+delete trees[3];
+if (3 in trees) {
+    // esto no se ejecuta
+}</pre>
+
+<p>Si quieres que exista un elemento de un array pero que tengo un valor no definido, utiliza el valor <code>undefined</code> en vez del operador <code>delete</code>. En el siguiente ejemplo, <code>trees[3]</code> es asignado con el valor <code>undefined</code>, pero el elemento del array aún existe:</p>
+
+<pre class="brush: js">var trees = ["redwood","bay","cedar","oak","maple"];
+trees[3] = undefined;
+if (3 in trees) {
+    // esto se ejecuta
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Standard</td>
+   <td>Definición inicial. Implementado en JavaScript 1.2</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.4.1', 'The delete Operator')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-delete-operator', 'The delete Operator')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Temporal dead zone</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop(36)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{ CompatVersionUnknown() }}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Temporal dead zone</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoMobile(36)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Cross-browser_issues">Cross-browser issues</h3>
+
+<p>Although ECMAScript makes iteration order of objects implementation-dependent, it may appear that all major browsers support an iteration order based on the earliest added property coming first (at least for properties not on the prototype). However, in the case of Internet Explorer, when one uses <code>delete</code> on a property, some confusing behavior results, preventing other browsers from using simple objects like object literals as ordered associative arrays. In Explorer, while the property <em>value</em> is indeed set to undefined, if one later adds back a property with the same name, the property will be iterated in its <em>old</em> position--not at the end of the iteration sequence as one might expect after having deleted the property and then added it back.</p>
+
+<p>So, if you want to simulate an ordered associative array in a cross-browser environment, you are forced to either use two separate arrays (one for the keys and the other for the values), or build an array of single-property objects, etc.</p>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li><a href="http://perfectionkills.com/understanding-delete/">Análisis en profundidad sobre delete</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/destructuring_assignment/index.html b/files/es/web/javascript/reference/operators/destructuring_assignment/index.html
new file mode 100644
index 0000000000..3f070055b5
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/destructuring_assignment/index.html
@@ -0,0 +1,443 @@
+---
+title: La desestructuración
+slug: Web/JavaScript/Reference/Operators/Destructuring_assignment
+tags:
+  - Característica del lenguaje
+  - Desestructuración
+  - Desestructurar arreglos y objetos anidados
+  - ECMAScript 2015
+  - ES6
+  - JavaScript
+  - Objetos anidados y desestructuración de array
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators/Destructuring_assignment
+original_slug: Web/JavaScript/Referencia/Operadores/Destructuring_assignment
+---
+<div>{{jsSidebar("Operators", "Operadores")}}</div>
+
+<p>La sintaxis de <strong>desestructuración</strong> es una expresión de JavaScript que permite desempacar valores de arreglos o propiedades de objetos en distintas variables.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-destructuringassignment.html", "taller")}}</div>
+
+<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush:js notranslate">let a, b, rest;
+[a, b] = [10, 20];
+console.log(a); // 10
+console.log(b); // 20
+
+[a, b, ...rest] = [10, 20, 30, 40, 50];
+console.log(a); // 10
+console.log(b); // 20
+console.log(rest); // [30, 40, 50]
+
+({ a, b } = { a: 10, b: 20 });
+console.log(a); // 10
+console.log(b); // 20
+
+
+// Propuesta de etapa 4 (terminada)
+({a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40});
+console.log(a); // 10
+console.log(b); // 20
+console.log(rest); // {c: 30, d: 40}
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Las expresiones de objetos y arreglos literales proporcionan una manera fácil de crear paquetes de datos <em>ad hoc</em>.</p>
+
+<pre class="brush: js notranslate">const x = [1, 2, 3, 4, 5];</pre>
+
+<p>La desestructuración utiliza una sintaxis similar, pero en el lado izquierdo de la asignación para definir qué valores desempacar de la variable origen.</p>
+
+<pre class="brush: js notranslate">const x = [1, 2, 3, 4, 5];
+const [y, z] = x;
+console.log(y); // 1
+console.log(z); // 2
+</pre>
+
+<p>Esta capacidad es similar a las características presentes en lenguajes como Perl y Python.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Desestructuración_de_arreglos">Desestructuración de arreglos</h3>
+
+<h4 id="Asignación_básica_de_variables">Asignación básica de variables</h4>
+
+<pre class="brush: js notranslate">const foo = ['one', 'two', 'three'];
+
+const [red, yellow, green] = foo;
+console.log(red); // "one"
+console.log(yellow); // "two"
+console.log(green); // "three"
+</pre>
+
+<h4 id="Asignación_separada_de_la_declaración">Asignación separada de la declaración</h4>
+
+<p>A una variable se le puede asignar su valor mediante una desestructuración separada de la declaración de la variable.</p>
+
+<pre class="brush:js notranslate">let a, b;
+
+[a, b] = [1, 2];
+console.log(a); // 1
+console.log(b); // 2
+</pre>
+
+<h4 id="Valores_predeterminados">Valores predeterminados</h4>
+
+<p>A una variable se le puede asignar un valor predeterminado, en el caso de que el valor desempacado del arreglo sea <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">let a, b;
+
+[a=5, b=7] = [1];
+console.log(a); // 1
+console.log(b); // 7
+</pre>
+
+<h4 id="Intercambio_de_variables">Intercambio de variables</h4>
+
+<p>Los valores de dos variables se pueden intercambiar en una expresión de desestructuración.</p>
+
+<p>Sin desestructurar la asignación, intercambiar dos valores requiere una variable temporal (o, en algunos lenguajes de bajo nivel, el algoritmo del <a class="external" href="https://en.wikipedia.org/wiki/XOR_swap_algorithm">truco XOR-swap</a>).</p>
+
+<pre class="brush:js notranslate">let a = 1;
+let b = 3;
+
+[a, b] = [b, a];
+console.log(a); // 3
+console.log(b); // 1
+
+const arr = [1,2,3];
+[arr[2], arr[1]] = [arr[1], arr[2]];
+console.log(arr); // [1,3,2]
+
+</pre>
+
+<h4 id="Analizar_un_arreglo_devuelto_por_una_función">Analizar un arreglo devuelto por una función</h4>
+
+<p>Siempre ha sido posible devolver un arreglo desde una función. La desestructuración puede hacer que trabajar con un valor de retorno de arreglo sea más conciso.</p>
+
+<p>En este ejemplo, <code>f()</code> devuelve los valores <code>[1, 2]</code> como su salida, que se puede procesar en una sola línea con desestructuración.</p>
+
+<pre class="brush:js notranslate">function f() {
+  return [1, 2];
+}
+
+let a, b;
+[a, b] = f();
+console.log(a); // 1
+console.log(b); // 2
+</pre>
+
+<h4 id="Ignorar_algunos_valores_devueltos">Ignorar algunos valores devueltos</h4>
+
+<p>Puedes ignorar los valores de retorno que no te interesan:</p>
+
+<pre class="brush:js notranslate">function f() {
+  return [1, 2, 3];
+}
+
+const [a, , b] = f();
+console.log(a); // 1
+console.log(b); // 3
+
+const [c] = f();
+console.log(c); // 1
+</pre>
+
+<p>También puedes ignorar todos los valores devueltos:</p>
+
+<pre class="brush:js notranslate">[,,] = f();
+</pre>
+
+<h4 id="Asignar_el_resto_de_un_arreglo_a_una_variable">Asignar el resto de un arreglo a una variable</h4>
+
+<p>Al desestructurar un arreglo, puedes desempacar y asignar la parte restante a una variable usando el patrón <code>rest</code>o:</p>
+
+<pre class="brush: js notranslate">const [a, ...b] = [1, 2, 3];
+console.log(a); // 1
+console.log(b); // [2, 3]</pre>
+
+<p>Ten en cuenta que se lanzará un {{jsxref("SyntaxError")}} si se usa una coma final en el lado derecho con un elemento <code>rest</code>o:</p>
+
+<pre class="brush: js example-bad notranslate">const [a, ...b,] = [1, 2, 3];
+
+// SyntaxError: el elemento rest no puede tener una coma al final
+// Siempre considera usar el operador rest como último elemento
+</pre>
+
+<h4 id="Desempacar_valores_coincidentes_con_una_expresión_regular">Desempacar valores coincidentes con una expresión regular</h4>
+
+<p>Cuando el método de expresión regular {{jsxref("Global_Objects/RegExp/exec", "exec()", "", 1)}} encuentra una coincidencia, devuelve un arreglo que contiene primero toda la parte coincidente de la cadena y luego las partes de la cadena que coinciden con cada grupo entre paréntesis en la expresión regular. La desestructuración te permite desempacar fácilmente las partes de este arreglo, ignorando la coincidencia completa si no es necesaria.</p>
+
+<pre class="brush:js notranslate">function parseProtocol(url) {
+  const parsedURL = /^(\w+)\:\/\/([^\/]+)\/(.*)$/.exec(url);
+  if (!parsedURL) {
+    return false;
+  }
+  console.log(parsedURL);
+  // ["https://developer.mozilla.org/es/Web/JavaScript",
+      "https", "developer.mozilla.org", "es/Web/JavaScript"]
+
+  const [, protocol, fullhost, fullpath] = parsedURL;
+  return protocol;
+}
+
+console.log(parseProtocol('https://developer.mozilla.org/es/Web/JavaScript'));
+// "https"
+</pre>
+
+<h3 id="Desestructuración_de_objetos">Desestructuración de objetos</h3>
+
+<h4 id="Asignación_básica">Asignación básica</h4>
+
+<pre class="brush: js notranslate">const user = {
+    id: 42,
+    is_verified: true
+};
+
+const {id, is_verified} = user;
+
+console.log(id); // 42
+console.log(is_verified); // true
+</pre>
+
+<h4 id="Asignación_sin_declaración">Asignación sin declaración</h4>
+
+<p>A una variable se le puede asignar su valor con desestructuración separada de su declaración.</p>
+
+<pre class="brush:js notranslate">let a, b;
+
+({a, b} = {a: 1, b: 2});</pre>
+
+<div class="note">
+<p><strong>Notas</strong>: los paréntesis <code>(...)</code> alrededor de la declaración de asignación son obligatorios cuando se usa la desestructuración de un objeto literal sin una declaración.</p>
+
+<p><code>{a, b} = {a: 1, b: 2}</code> no es una sintaxis independiente válida, debido a que <code>{a, b}</code> en el lado izquierdo se considera un bloque y no un objeto literal.</p>
+
+<p>Sin embargo, <code>({a, b} = {a: 1, b: 2})</code> es válido, al igual que <code>const {a, b} = {a: 1, b: 2}</code></p>
+
+<p>tu expresión <code>( ... )</code> debe estar precedida por un punto y coma o se puede usar para ejecutar una función en la línea anterior.</p>
+</div>
+
+<h4 id="Asignar_a_nuevos_nombres_de_variable">Asignar a nuevos nombres de variable</h4>
+
+<p>Una propiedad se puede desempacar de un objeto y asignar a una variable con un nombre diferente al de la propiedad del objeto.</p>
+
+<pre class="brush: js notranslate">const o = {p: 42, q: true};
+const {p: foo, q: bar} = o;
+
+console.log(foo); // 42
+console.log(bar); // true</pre>
+
+<p>Aquí, por ejemplo, <code>const {p: foo} = o</code> toma del objeto <code>o</code> la propiedad llamada <code>p</code> y la asigna a una variable local llamada <code>foo</code>.</p>
+
+<h4 id="Valores_predeterminados_2">Valores predeterminados</h4>
+
+<p>A una variable se le puede asignar un valor predeterminado, en el caso de que el valor desempacado del objeto sea <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">const {a = 10, b = 5} = {a: 3};
+
+console.log(a); // 3
+console.log(b); // 5</pre>
+
+<h4 id="Asignar_nombres_a_nuevas_variables_y_proporcionar_valores_predeterminados">Asignar nombres a nuevas variables y proporcionar valores predeterminados</h4>
+
+<p>Una propiedad puede ser ambas</p>
+
+<ul>
+ <li>Desempacada de un objeto y asignada a una variable con un nombre diferente.</li>
+ <li>Se le asigna un valor predeterminado en caso de que el valor desempacado sea <code>undefined</code>.</li>
+</ul>
+
+<pre class="brush: js notranslate">const {a: aa = 10, b: bb = 5} = {a: 3};
+
+console.log(aa); // 3
+console.log(bb); // 5
+</pre>
+
+<h4 id="Desempacar_campos_de_objetos_pasados_como_parámetro_de_función">Desempacar campos de objetos pasados como parámetro de función</h4>
+
+<pre class="brush:js notranslate">const user = {
+  id: 42,
+  displayName: 'jdoe',
+  fullName: {
+    firstName: 'John',
+    lastName: 'Doe'
+  }
+};
+
+function userId({id}) {
+  return id;
+}
+
+function whois({displayName, fullName: {firstName: name}}) {
+  return `${displayName} es ${name}`;
+}
+
+console.log(userId(user)); // 42
+console.log(whois(user));  // "jdoe es John"</pre>
+
+<p>Esto desempaca el <code>id</code>, <code>displayName</code> y <code>firstName</code> del objeto <code>user</code> y los imprime.</p>
+
+<h4 id="Establecer_el_valor_predeterminado_de_un_parámetro_de_función">Establecer el valor predeterminado de un parámetro de función</h4>
+
+<pre class="brush: js notranslate">function drawChart({size = 'big', coords = {x: 0, y: 0}, radius = 25} = {}) {
+  console.log(size, coords, radius);
+  // haz un dibujo de gráfico
+}
+
+drawChart({
+  coords: {x: 18, y: 30},
+  radius: 30
+});</pre>
+
+<div class="note">
+<p>En la firma de la función para <strong><code>drawChart</code></strong> anterior, el lado izquierdo desestructurado se asigna a un objeto literal vacío en el lado derecho: <code>{size = 'big', coords = {x: 0, y: 0}, radius = 25} = {}</code>. También podrías haber escrito la función sin la asignación del lado derecho. Sin embargo, si omites la asignación del lado derecho, la función buscará al menos un argumento para ser proporcionado cuando se invoca, mientras que en su forma actual, simplemente puedes llamar a <code><strong>drawChart()</strong></code> sin proporcionar ningún parámetro. El diseño actual es útil si deseas poder llamar a la función sin proporcionar ningún parámetro, el otro puede ser útil cuando deseas asegurarte de que se pase un objeto a la función.</p>
+</div>
+
+<h4 id="Desestructuración_de_arreglos_y_objetos_anidados">Desestructuración de arreglos y objetos anidados</h4>
+
+<pre class="brush:js notranslate">const metadata = {
+  title: 'Scratchpad',
+  translations: [
+    {
+      locale: 'de',
+      localization_tags: [],
+      last_edit: '2020-08-29T08:43:37',
+      url: '/de/docs/Tools/Scratchpad',
+      title: 'JavaScript-Umgebung'
+    }
+  ],
+  url: '/es/docs/Tools/Scratchpad'
+};
+
+let {
+  title: englishTitle, // renombrar
+  translations: [
+    {
+       title: localeTitle, // renombrar
+    },
+  ],
+} = metadata;
+
+console.log(englishTitle); // "Scratchpad"
+console.log(localeTitle);  // "JavaScript-Umgebung"</pre>
+
+<h4 id="Iteración_for...of_y_desestructuración">Iteración "<code>for...of</code>" y desestructuración</h4>
+
+<pre class="brush: js notranslate">const people = [
+  {
+    name: 'Mike Smith',
+    family: {
+      mother: 'Jane Smith',
+      father: 'Harry Smith',
+      sister: 'Samantha Smith'
+    },
+    age: 35
+  },
+  {
+    name: 'Tom Jones',
+    family: {
+      mother: 'Norah Jones',
+      father: 'Richard Jones',
+      brother: 'Howard Jones'
+    },
+    age: 25
+  }
+];
+
+for (const {name: n, family: {father: f}} of people) {
+  console.log('Nombre: ' + n + ', Padre: ' + f);
+}
+
+// "Nombre: Mike Smith, Padre: Harry Smith"
+// "Nombre: Tom Jones, Padre: Richard Jones"
+</pre>
+
+<h4 id="Nombres_de_propiedades_de_objetos_calculados_y_desestructuración">Nombres de propiedades de objetos calculados y desestructuración</h4>
+
+<p>Los nombres de propiedad calculados, como en un {{jsxref("Operators/Object_initializer", "Objeto literal", "#Computed_property_names", 1)}}, se pueden usar con la desestructuración.</p>
+
+<pre class="brush: js notranslate">let key = 'z';
+let {[key]: foo} = {z: 'bar'};
+
+console.log(foo); // "bar"
+</pre>
+
+<h4 id="Rest_en_la_desestructuración_de_objetos"><code>Rest</code> en la desestructuración de objetos</h4>
+
+<p>La propuesta <a class="external external-icon" href="https://github.com/tc39/proposal-object-rest-spread">Propiedades <code>rest</code>/propagación para ECMAScript</a> (etapa 4) agrega la sintaxis {{jsxref("Functions/rest_parameters", "rest", "", 1)}} para desestructurar. Las propiedades de <code>rest</code> recopilan las claves de propiedades enumerables restantes que aún no han sido seleccionadas por el patrón de desestructuración.</p>
+
+<pre class="brush: js notranslate">let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40}
+a; // 10
+b; // 20
+rest; // { c: 30, d: 40 }</pre>
+
+<h4 id="Identificador_de_JavaScript_no_válido_como_nombre_de_propiedad">Identificador de JavaScript no válido como nombre de propiedad</h4>
+
+<p>La desestructuración se puede utilizar con nombres de propiedad que no son {{Glossary("Identifier", "identificadores")}} válidos en JavaScript proporcionando un identificador alternativo que sea válido.</p>
+
+<pre class="brush: js notranslate">const foo = { 'fizz-buzz': true };
+const { 'fizz-buzz': fizzBuzz } = foo;
+
+console.log(fizzBuzz); // "true"
+</pre>
+
+<h4 id="Desestructuración_combinada_de_arreglos_y_objetos">Desestructuración combinada de arreglos y objetos</h4>
+
+<p>La desestructuración de arreglos y objetos se puede combinar. Supongamos que deseas manipular el tercer elemento del siguiente arreglo <code>props</code>, y luego deseas la propiedad <code>name</code> en el objeto, puedes hacer lo siguiente:</p>
+
+<pre class="brush: js notranslate">const props = [
+  { id: 1, name: 'Fizz'},
+  { id: 2, name: 'Buzz'},
+  { id: 3, name: 'FizzBuzz'}
+];
+
+const [,, { name }] = props;
+
+console.log(name); // "FizzBuzz"
+</pre>
+
+<h4 id="Se_busca_la_cadena_de_prototipos_al_desestructurar_el_objeto.">Se busca la cadena de prototipos al desestructurar el objeto.</h4>
+
+<p>Al deconstruir un objeto, si no se accede a una propiedad en sí misma, continuará buscando a lo largo de la cadena de prototipos.</p>
+
+<pre class="brush: js notranslate">let obj = {self: '123'};
+obj.__proto__.prot = '456';
+const {self, prot} = obj;
+// self "123"
+// prot "456" (Acceso a la cadena de prototipos)</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-destructuring-assignment', 'Desestructuración de asignación')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.operators.destructuring")}}</p>
+</div>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/Assignment_Operators", "Operadores de asignación", "", 1)}}</li>
+ <li><a href="https://hacks.mozilla.org/2015/05/es6-in-depth-destructuring/">"ES6 en profundidad: Desestructuración" en hacks.mozilla.org</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/division/index.html b/files/es/web/javascript/reference/operators/division/index.html
new file mode 100644
index 0000000000..08074f727d
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/division/index.html
@@ -0,0 +1,78 @@
+---
+title: Division (/)
+slug: Web/JavaScript/Reference/Operators/Division
+tags:
+  - JS
+  - JavaScript
+  - Operador de Division
+  - Operadores
+  - Referências
+translation_of: Web/JavaScript/Reference/Operators/Division
+original_slug: Web/JavaScript/Referencia/Operadores/Division
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de división (<code>/</code>) produce el cociente de sus operandos donde el operando izquierdo es el dividendo y el operando derecho es el divisor.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-division.html")}}</div>
+
+<div></div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> <var>x</var> / <var>y</var>
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Division_basica">Division basica</h3>
+
+<pre class="brush: js notranslate">1 / 2              // 0.5
+
+Math.floor(3 / 2) // 1
+
+1.0 / 2.0         // 0.5
+</pre>
+
+<h3 id="Division_por_cero">Division por cero</h3>
+
+<pre class="brush: js notranslate">2.0 / 0     // Retorna Infinity
+
+2.0 / 0.0   // Retorna Infinity, Dado que 0.0 === 0
+
+2.0 / -0.0  // Retorna -Infinity</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-multiplicative-operators', 'Division operator')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.division")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/equality/index.html b/files/es/web/javascript/reference/operators/equality/index.html
new file mode 100644
index 0000000000..d191c15d3b
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/equality/index.html
@@ -0,0 +1,130 @@
+---
+title: Comparación (==)
+slug: Web/JavaScript/Reference/Operators/Equality
+tags:
+  - JS
+  - JavaScript
+  - Operador de comparacion
+  - Operadores
+  - Referências
+translation_of: Web/JavaScript/Reference/Operators/Equality
+original_slug: Web/JavaScript/Referencia/Operadores/Comparacion
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de comparacion  (<code>==</code>) comprueba si sus dos operandos son iguales y devuelve un resultado booleano. A diferencia del operador de igualdad estricta (<code>===</code>), es que este convierte y compara operandos que son de diferentes tipos.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-equality.html")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">x == y
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los operadores de igualdad (<code>==</code>y <code>!=</code>) Utilizan el algoritmo de comparación de igualdad abstracta para comparar dos operandos. Esto se puede resumir a grandes rasgos como:</p>
+
+<ul>
+ <li>Si los operandos ambos son objetos, devuelve <code>true </code>solo si ambos operandos hacen referencia al mismo objeto.</li>
+ <li>Si un operando es <code>null</code>y el otro <code>undefined</code>, devuelve verdadero(<code>true</code>).</li>
+ <li>Si los operandos son de diferente tipos, intenta convertirlos al mismo tipo antes de comparar:
+  <ul>
+   <li>Al comparar un número con una cadena, convierte la cadena en un valor numérico.</li>
+   <li>Si uno de los operandos es booleano, convierte el operando booleano en 1 si es verdadero y en 0 en el caso de falso.</li>
+   <li>Si uno de los operandos es un objeto y el otro es un número o una cadena, convierte el objeto en una primitiva utilizando los métodos <code>valueOf()</code>y <code>toString()</code> del objeto.</li>
+  </ul>
+ </li>
+ <li>Si los operandos tienen el mismo tipo, se comparan de la siguiente manera:
+  <ul>
+   <li><code>String</code>: devuelve verdadero solo si ambos operandos tienen los mismos caracteres y en el mismo orden.</li>
+   <li><code>Number</code>: devuelve verdadero solo si ambos operandos tienen el mismo valor. <code>+0</code> y <code>-0</code> se tratan como el mismo valor. Si alguno de los operandos es <code>NaN</code>, devuelve falso.</li>
+   <li><code>Boolean</code>: retorna verdadero solo si ambos operandos son verdaderos o falsos.</li>
+  </ul>
+ </li>
+</ul>
+
+<p>La diferencia más notable entre este operador y el operador de igualdad estricta (<code>===</code>) es que el operador de igualdad estricta no realiza la conversión de tipos. </p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Comparación_sin_conversión_de_tipo">Comparación sin conversión de tipo</h3>
+
+<pre class="brush: js notranslate">1 == 1;              // true
+"Hola" == "Hola";  // true</pre>
+
+<h3 id="Comparación_con_conversión_de_tipos">Comparación con conversión de tipos</h3>
+
+<pre class="brush: js notranslate">"1" ==  1;            // true
+1 == "1";             // true
+0 == false;           // true
+0 == null;            // false
+0 == undefined;       // false
+0 == !!null;          // true, Operador Logico NOT
+0 == !!undefined;     // true, Operador Logico NOT
+null == undefined;    // true
+
+const number1 = new Number(3);
+const number2 = new Number(3);
+number1 == 3;         // true
+number1 == number2;   // false</pre>
+
+<h3 id="Comparación_de_objetos">Comparación de objetos</h3>
+
+<pre class="brush: js notranslate">const object1 = {"key": "value"}
+const object2 = {"key": "value"};
+
+object1 == object2 // false
+object2 == object2 // true</pre>
+
+<h3 id="Comparar_String_y_objetos_String">Comparar String y objetos String</h3>
+
+<p>Tenga en cuenta que las cadenas construidas con <code>new String() </code>son objetos. Si compara uno de estos con un String literal, el objeto String se convertirá en un <code>String</code> literal y se comparará el contenido. Sin embargo, si ambos operandos son objetos de tipo String, entonces se comparan como objetos y deben hacer referencia al mismo objeto para que la comparación sea exitosa:</p>
+
+<pre class="brush: js notranslate">const string1 = "Hola";
+const string2 = String("Hola");
+const string3 = new String("Hola");
+const string4 = new String("Hola");
+
+console.log(string1 == string2); // true
+console.log(string1 == string3); // true
+console.log(string2 == string3); // true
+console.log(string3 == string4); // false
+console.log(string4 == string4); // true</pre>
+
+<h3 id="Comparación_de_fechas_y_cadenas">Comparación de fechas y cadenas</h3>
+
+<pre class="brush: js notranslate">const d = new Date('December 17, 1995 03:24:00');
+const s = d.toString(); // Por ejemplo: "Sun Dec 17 1995 03:24:00 GMT-0800 (Hora estándar del Pacífico)"
+console.log(d == s);    //true</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificaciones</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-equality-operators', 'Equality operators')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.equality")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Inequality">Inequality operator</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Strict_equality">Strict equality operator</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Strict_inequality">Strict inequality operator</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/function/index.html b/files/es/web/javascript/reference/operators/function/index.html
new file mode 100644
index 0000000000..c4f7c4233f
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/function/index.html
@@ -0,0 +1,74 @@
+---
+title: function
+slug: Web/JavaScript/Reference/Operators/function
+tags:
+  - Function
+  - JavaScript
+  - Operator
+  - Primary Expressions
+translation_of: Web/JavaScript/Reference/Operators/function
+original_slug: Web/JavaScript/Referencia/Operadores/function
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>El operador <code>function</code> define una función dentro de una expresión.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="eval">function [<em>name</em>]([<em>param1</em>, <em>param2</em>, ..., <em>paramN</em>]) {
+   <em>statements</em>
+}
+</pre>
+
+<h2 id="Parameters" name="Parameters">Parámetros</h2>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>El nombre de la función. Puede ser omitido, en cuyo caso la función es <em>anonymous</em>. El nombre sólo es local para el cuerpo de la función.</dd>
+</dl>
+
+<dl>
+ <dt><code>paramN</code></dt>
+ <dd>El nombre de un argumento que será pasado a la función. Una función puede tener hasta 255 argumentos.</dd>
+</dl>
+
+<dl>
+ <dt><code>statements</code></dt>
+ <dd>Las declaraciones que conforman el cuerpo de la función.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>La expresión de una función es muy similar y tiene casi la misma sintaxis que la declaración de una función (véase {{jsxref("Sentencias/function", "function")}} para más detalles). Véase <a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a> para ver más información sobre las diferencias  entre declaraciones de funciones y expresiones de funciones.</p>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<p>El siguiente ejemplo define una función sin nombre y se le asigna a la variable x. La función devuelve como resultado el cuadrado de su argumento:</p>
+
+<pre class="brush: js">var x = function(y) {
+   return y * y;
+};
+</pre>
+
+<h3 id="Expresión_de_función_nombrada">Expresión de función nombrada</h3>
+
+<p>Si quiere referirse a la función actual dentro del cuerpo de la función, debe crear una expresión de función nombrada. Luego, este nombre será local solo para el cuerpo de la función (alcance). Esto también evita usar la propiedad no estándar {{jsxref("Funciones/arguments/callee", "arguments.callee")}}.</p>
+
+<pre class="brush: js">var math = {
+  'factorial': function factorial(n) {
+    if (n &lt;= 1)
+      return 1;
+    return n * factorial(n - 1);
+  }
+};
+</pre>
+
+<h2 id="See_also" name="See_also">Consulte también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
+ <li>{{jsxref("Function")}}</li>
+ <li>Sentencias {{jsxref("Sentencias/function", "function")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/function_star_/index.html b/files/es/web/javascript/reference/operators/function_star_/index.html
new file mode 100644
index 0000000000..632906f1c8
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/function_star_/index.html
@@ -0,0 +1,92 @@
+---
+title: expresión function*
+slug: Web/JavaScript/Reference/Operators/function*
+tags:
+  - ECMAScript 2015
+  - Expresión Primaria
+  - Function
+  - Iterator
+  - JavaScript
+  - Operator
+translation_of: Web/JavaScript/Reference/Operators/function*
+original_slug: Web/JavaScript/Referencia/Operadores/function*
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>La palabra clave <strong><code>function*</code></strong> puede ser utilizada para definir una función generadora en una expresión.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-functionasteriskexpression.html")}}</div>
+
+<p class="hidden">El código fuente de este ejemplo interactivo se encuentra almacenado en un repositorio GitHub. Si le gustaría contribuir al proyecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíenos un pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">function* [<em>nombre</em>]([<em>param1</em>[, <em>param2[</em>, ..., <em>paramN</em>]]]) {
+   <em>sentencias</em>
+}</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>nombre</code></dt>
+ <dd>Nombre de la función. Puede ser omitido, en cuyo caso la funcipón es <em>anínima</em>. El nombre sólo es local al cuerpo de la función.</dd>
+ <dt><code>paramN</code></dt>
+ <dd>Nombre de un parámetro a ser pasado a la función. Una función puede tener hasta 255 argumentos.</dd>
+ <dt><code>sentencias</code></dt>
+ <dd>Sentencias que componen el cuerpo de la función.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Una expresión <code>function*</code> es muy similar y tiene casi la misma sintaxis que una {{jsxref('Statements/function*', 'function* statement')}}. La principal diferencia entre una expresión <code>function*</code> y una sentencia <code>function*</code> es el <em>nombre de la función</em>, que en expresiones <code>function*</code> puede ser omitido para creaar funciones generadoras <em>anónimas</em>. Para más información vea también el capítulo acerca de <a href="/en-US/docs/Web/JavaScript/Reference/Functions">funciones</a>.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente ejemplo define una función generadora sin nombre y la asigna a <code>x</code>. La función produce el cuadrado de su argumento:</p>
+
+<pre class="brush: js">var x = function*(y) {
+   yield y * y;
+};
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#', 'function*')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición Inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#', 'function*')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si usted desea contribuir a esos datos, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
+
+<p>{{Compat("javascript.operators.function_star")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Statements/function*", "Sentencia function*")}}</li>
+ <li>Objeto {{jsxref("GeneratorFunction")}}</li>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Iteration_protocols">El protocolo iterable</a></li>
+ <li>{{jsxref("Operators/yield", "yield")}}</li>
+ <li>{{jsxref("Operators/yield*", "yield*")}}</li>
+ <li>Objeto {{jsxref("Function")}}</li>
+ <li>{{jsxref("Statements/function", "Sentencia function")}}</li>
+ <li>{{jsxref("Operators/function", "Expresión function")}}</li>
+ <li>{{jsxref("Functions_and_function_scope", "Funciones y alcance de funciones")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/grouping/index.html b/files/es/web/javascript/reference/operators/grouping/index.html
new file mode 100644
index 0000000000..0d41dd7d03
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/grouping/index.html
@@ -0,0 +1,129 @@
+---
+title: Operador de agrupación
+slug: Web/JavaScript/Reference/Operators/Grouping
+tags:
+  - Expresiones primarias
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators/Grouping
+original_slug: Web/JavaScript/Referencia/Operadores/Grouping
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de agrupación <code>( )</code> controla la precedencia de las expresiones a evaluar.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"> ( )</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El operador de agrupación consiste en un par de paréntesis alrededor de la expresión (o sub-expresión) que sobrescribe el comportamiento por defecto de la <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">precedencia de operadores</a>, lo que causa que expresiones con menor precedencia puedan ser evaluadas antes que expresiones con una mayor precedencia.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Sobrescribir la precedencia de operadores aritméticos por defecto para que se evalúe primero la adición y luego la multiplicación.</p>
+
+<pre class="brush:js">var a = 1;
+var b = 2;
+var c = 3;
+
+// precedencia por defecto
+a + b * c     // 7
+// es evaluada por defecto como:
+a + (b * c)   // 7
+
+// ahora se sobrescribe la precedencia
+// para que la adición se evalúe antes que la multiplicación
+(a + b) * c   // 9
+
+// que es equivalente a:
+a * c + b * c // 9
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>ECMAScript 1st Edition.</td>
+   <td>Estándar</td>
+   <td>Definición inicial. Implementado en JavaScript 1.0</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.1.6', 'The Grouping Operator')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-grouping-operator', 'The Grouping Operator')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Temas_relacionados">Temas relacionados</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">Precedencia de operadores</a></li>
+ <li>{{jsxref("Operators/delete", "delete")}}</li>
+ <li>{{jsxref("Operators/typeof", "typeof")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/in/index.html b/files/es/web/javascript/reference/operators/in/index.html
new file mode 100644
index 0000000000..649f3f9595
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/in/index.html
@@ -0,0 +1,140 @@
+---
+title: in
+slug: Web/JavaScript/Reference/Operators/in
+tags:
+  - JavaScript
+  - Operator
+  - Relational Operators
+translation_of: Web/JavaScript/Reference/Operators/in
+original_slug: Web/JavaScript/Referencia/Operadores/in
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<div>El <strong>operador <code>in</code></strong> devuelve <code>true</code> si la propiedad especificada está en el objeto especificado o su prototipo.</div>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre><code><em>prop</em> in <em>object</em></code></pre>
+
+<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>prop</code></dt>
+ <dd>Una cadena o expresión númerica que representa el nombre de una propiedad o el índice de un array (lo que no sea un símbolo se forzará a string).</dd>
+</dl>
+
+<dl>
+ <dt><code>object</code></dt>
+ <dd>El objeto (o su cadena de prototipo) sobre el que comprobar si contiene la propiedad con el nombre especificado.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Los siguientes ejemplos muestran algunos de los usos del operador <code>in</code>.</p>
+
+<pre class="brush:js">// Arrays
+var arboles = new Array("secoya", "pino", "cedro", "roble", "arce");
+0 in arboles        // devuelve true
+3 in arboles        // devuelve true
+6 in arboles        // devuelve false
+"pino" in arboles   // devuelve false (debe especificar el número de índice,
+                    // no el valor del índice)
+"length" in arboles // devuelve true (length es una propiedad de Array)
+
+// Objetos predefinidos
+"PI" in Math        // devuelve true
+
+// Objetos personalizados
+var micoche = {marca: "Honda", modelo: "Accord", año: 1998};
+"marca" in micoche  // devuelve true
+"modelo" in micoche // devuelve true
+</pre>
+
+<p>Debe especificar un objeto en el lado derecho del operador <code>in</code>. Por ejemplo, puede especificar una cadena creada con el constructor <code>String</code> , pero no puede especificar una cadena literal.</p>
+
+<pre class="brush:js">var color1 = new String("verde");
+"length" in color1 // devuelve true
+
+var color2 = "coral";
+"length" in color2 // genera un error (color2 no es un objeto String)
+</pre>
+
+<h3 id="Using_in_with_deleted_or_undefined_properties" name="Using_in_with_deleted_or_undefined_properties">Usando <code>in</code> con propiedades eliminadas o no definidas</h3>
+
+<p>Si se elimina una propiedad con el operador {{jsxref("Operadores/delete", "delete")}}, el operador <code>in</code> devuelve <code>false</code> para esa propiedad.</p>
+
+<pre class="brush:js">var micoche= {marca: "Honda", modelo: "Accord", año: 1998};
+delete micoche.marca;
+"marca" in micoche;  // devuelve false
+
+var arboles = new Array("secoya", "pino", "cedro", "roble", "arce");
+delete arboles[3];
+3 in arboles; // devuelve false
+</pre>
+
+<p>Si se cambia una propiedad a {{jsxref("Objetos_globales/undefined", "undefined")}} pero no se elimina, el operador <code>in</code> devuelve true para esa propiedad.</p>
+
+<pre class="brush:js">var micoche = {marca: "Honda", modelo: "Accord", año: 1998};
+micoche.marca = undefined;
+"marca" in micoche;  // devuelve true
+</pre>
+
+<pre class="brush:js">var arboles = new Array("secayo", "pino", "cedro", "roble", "arce");
+arboles[3] = undefined;
+3 in arboles; // devuelve true
+</pre>
+
+<h3 id="Inherited_properties" name="Inherited_properties">Propiedades heredadas</h3>
+
+<p>El operador <code>in</code> devuelve <code>true</code> para propiedades en la cadena del prototipo.</p>
+
+<pre class="brush:js">"toString" in {}; // devuelve true
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-relational-operators', 'Relational Operators')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-relational-operators', 'Relational Operators')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-11.8.7', 'The in Operator')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3', '#sec-11.8.7', 'The in Operator')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td>Definición inicial. Implementado en JavaScript 1.4.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.in")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><code><a href="/es-ES/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></code></li>
+ <li><code><a href="/es-ES/docs/Web/JavaScript/Reference/Operators/delete">delete</a></code></li>
+ <li>{{jsxref("Object.prototype.hasOwnProperty()")}}</li>
+ <li>{{jsxref("Reflect.has()")}}</li>
+ <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/index.html b/files/es/web/javascript/reference/operators/index.html
new file mode 100644
index 0000000000..b4ead2ee42
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/index.html
@@ -0,0 +1,281 @@
+---
+title: Expresiones y operadores
+slug: Web/JavaScript/Reference/Operators
+tags:
+  - Descripción
+  - JavaScript
+  - Operadores
+  - Operators
+  - Referencia
+translation_of: Web/JavaScript/Reference/Operators
+original_slug: Web/JavaScript/Referencia/Operadores
+---
+<div>{{jsSidebar("Operators", "Operadores")}}</div>
+
+<p class="summary">Este capítulo documenta todos los operadores, expresiones y palabras clave del lenguaje JavaScript.</p>
+
+<h2 id="Expresiones_y_operadores_por_categoría">Expresiones y operadores por categoría</h2>
+
+<p>Para obtener una lista alfabética, consulta la barra lateral de la izquierda.</p>
+
+<h3 id="Expresiones_primarias">Expresiones primarias</h3>
+
+<p>Palabras clave básicas y expresiones generales en JavaScript.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/this", "this")}}</dt>
+ <dd>La palabra clave <code>this</code> se refiere a una propiedad especial de un contexto de ejecución.</dd>
+ <dt>{{jsxref("Operators/function", "function")}}</dt>
+ <dd>La palabra clave <code>function</code> define una expresión de función.</dd>
+ <dt>{{jsxref("Operators/class", "class")}}</dt>
+ <dd>La palabra clave <code>class</code> define una expresión de clase.</dd>
+ <dt>{{jsxref("Operators/function", "function")}}</dt>
+ <dd>La palabra clave <code>function*</code> define una expresión de función generadora.</dd>
+ <dt>{{jsxref("Operators/yield", "yield")}}</dt>
+ <dd>Pausar y reanudar una función generadora.</dd>
+ <dt>{{jsxref("Operators/yield*", "yield*")}}</dt>
+ <dd>Delegar a otra función generadora u objeto iterable.</dd>
+ <dt>{{jsxref("Operators/async_function", "async function")}}</dt>
+ <dd>La <code>async function</code> define una expresión de función asíncrona.</dd>
+ <dt>{{jsxref("Operators/await", "await")}}</dt>
+ <dd>Pausa y reanuda una función asíncrona y espera la resolución/rechazo de la promesa.</dd>
+ <dt>{{jsxref("Global_Objects/Array", "[]")}}</dt>
+ <dd>Iniciador de arreglo/sintaxis literal.</dd>
+ <dt>{{jsxref("Operators/Object_initializer", "{}")}}</dt>
+ <dd>Iniciador de objeto/sintaxis literal.</dd>
+ <dt>{{jsxref("Global_Objects/RegExp", "/ab+c/i")}}</dt>
+ <dd>Sintaxis de expresión regular literal.</dd>
+ <dt>{{jsxref("Operators/Grouping", "( )")}}</dt>
+ <dd>Operador de agrupación.</dd>
+</dl>
+
+<h3 id="Expresiones_del_lado_izquierdo">Expresiones del lado izquierdo</h3>
+
+<p>Los valores de la izquierda son el destino de una asignación.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Property_accessors", "Propiedad accessors", "", 1)}}</dt>
+ <dd>Los operadores miembro proporcionan acceso a una propiedad o método de un objeto<br>
+ (<code>object.property</code> y <code>object["property"]</code>).</dd>
+ <dt>{{jsxref("Operators/new", "new")}}</dt>
+ <dd>El operador <code>new</code> crea una instancia auxiliado por un constructor.</dd>
+ <dt>{{jsxref("Operators/new%2Etarget", "new.target")}}</dt>
+ <dd>En los constructores, <code>new.target</code> se refiere al constructor que fue invocado por {{jsxref("Operators/new", "new")}}.</dd>
+ <dt>{{jsxref("Operators/super", "super")}}</dt>
+ <dd>La palabra clave <code>super</code> llama al constructor padre.</dd>
+ <dt>{{jsxref("Operators/Spread_syntax", "...obj")}}</dt>
+ <dd>La sintaxis de extensión permite expandir una expresión en lugares donde se esperan múltiples argumentos (para llamadas a funciones) o múltiples elementos (para arreglos literales).</dd>
+</dl>
+
+<h3 id="Incremento_y_decremento">Incremento y decremento</h3>
+
+<p>Operadores de incremento sufijo/prefijo y decremento sufijo/prefijo.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Increment", "A++")}}</dt>
+ <dd>Operador de incremento sufijo.</dd>
+ <dt>{{jsxref("Operators/Decrement", "A--")}}</dt>
+ <dd>Operador de incremento sufijo.</dd>
+ <dt>{{jsxref("Operators/Increment", "A++")}}</dt>
+ <dd>Operador de incremento prefijo.</dd>
+ <dt>{{jsxref("Operators/Decrement", "--A")}}</dt>
+ <dd>Operador de decremento prefijo.</dd>
+</dl>
+
+<h3 id="Operadores_unarios">Operadores unarios</h3>
+
+<p>Una operación unaria es una operación con un solo operando.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/delete", "delete")}}</dt>
+ <dd>El operador <code>delete</code> elimina una propiedad de un objeto.</dd>
+ <dt>{{jsxref("Operators/void", "void")}}</dt>
+ <dd>El operador <code>void</code> descarta el valor de retorno de una expresión.</dd>
+ <dt>{{jsxref("Operators/typeof", "typeof")}}</dt>
+ <dd>El operador <code>typeof</code> determina el tipo de un objeto dado.</dd>
+ <dt>{{jsxref("Operators/Unary_plus", "+")}}</dt>
+ <dd>El operador unario <code>más</code> convierte su operando al tipo <code>Number</code>.</dd>
+ <dt>{{jsxref("Operators/Unary_negation", "-")}}</dt>
+ <dd>El operador unario de negación convierte su operando al tipo <code>Number</code> y luego lo niega.</dd>
+ <dt>{{jsxref("Operators/Bitwise_NOT", "~")}}</dt>
+ <dd>Operador <code>NOT</code> bit a bit.</dd>
+ <dt>{{jsxref("Operators/Logical_NOT", "!")}}</dt>
+ <dd>Operador <code>NOT</code> lógico.</dd>
+</dl>
+
+<h3 id="Operadores_aritméticos">Operadores aritméticos</h3>
+
+<p>Los operadores aritméticos toman valores numéricos (ya sean literales o variables) como sus operandos y devuelven un solo valor numérico.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Addition", "+")}}</dt>
+ <dd>Operador de adición o suma.</dd>
+ <dt>{{jsxref("Operators/Subtraction", "-")}}</dt>
+ <dd>Operador de sustracción o resta.</dd>
+ <dt>{{jsxref("Operators/Division", "/")}}</dt>
+ <dd>Operador de división.</dd>
+ <dt>{{jsxref("Operators/Multiplication", "*")}}</dt>
+ <dd>Operador de multiplicación.</dd>
+ <dt>{{jsxref("Operators/Remainder", "%")}}</dt>
+ <dd>Operador de residuo.</dd>
+ <dt>{{jsxref("Operators/Exponentiation", "**")}}</dt>
+ <dd>Operador de exponenciación.</dd>
+</dl>
+
+<h3 id="Operadores_relacionales">Operadores relacionales</h3>
+
+<p>Un operador de comparación compara sus operandos y devuelve un valor <code>Boolean</code> basado en si la comparación es verdadera o no.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/in", "in")}}</dt>
+ <dd>El operador <code>in</code> determina si un objeto tiene una determinada propiedad.</dd>
+ <dt>{{jsxref("Operators/instanceof", "instanceof")}}</dt>
+ <dd>El operador <code>instanceof</code> determina si un objeto es una instancia de otro objeto.</dd>
+ <dt>{{jsxref("Operators/Less_than", "&lt;")}}</dt>
+ <dd>Operador menor que.</dd>
+ <dt>{{jsxref("Operators/Greater_than", "&gt;")}}</dt>
+ <dd>Operador mayor que.</dd>
+ <dt>{{jsxref("Operators/Less_than_or_equal", "&lt;=")}}</dt>
+ <dd>Operador menor o igual a.</dd>
+ <dt>{{jsxref("Operators/Greater_than_or_equal", "&gt;=")}}</dt>
+ <dd>Operador mayor o igual a.</dd>
+</dl>
+
+<div class="blockIndicator note">
+<p><strong>Nota: =&gt;</strong> no es un operador, sino la notación para {{jsxref("Functions/Arrow_functions", "Funciones de flecha")}}.</p>
+</div>
+
+<h3 id="Operadores_de_igualdad">Operadores de igualdad</h3>
+
+<p>El resultado de evaluar un operador de igualdad siempre es de tipo <code>Boolean</code> basado en si la comparación es verdadera.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Equality", "==")}}</dt>
+ <dd>Operador de igualdad.</dd>
+ <dt>{{jsxref("Operators/Inequality", "!=")}}</dt>
+ <dd>Operador de desigualdad.</dd>
+ <dt>{{jsxref("Operators/Strict_equality", "===")}}</dt>
+ <dd>Operador de igualdad estricta.</dd>
+ <dt>{{jsxref("Operators/Strict_inequality", "!==")}}</dt>
+ <dd>Operador de desigualdad estricta.</dd>
+</dl>
+
+<h3 id="Operadores_de_desplazamiento_de_bits">Operadores de desplazamiento de bits</h3>
+
+<p>Operaciones para cambiar todos los bits del operando.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Left_shift", "&lt;&lt;")}}</dt>
+ <dd>Operador de desplazamiento bit a bit a la izquierda.</dd>
+ <dt>{{jsxref("Operators/Right_shift", "&gt;&gt;")}}</dt>
+ <dd>Operador de desplazamiento bit a bit a la derecha.</dd>
+ <dt>{{jsxref("Operators/Unsigned_right_shift", "&gt;&gt;&gt;")}}</dt>
+ <dd>Operador de desplazamiento bit a bit a la derecha sin signo.</dd>
+</dl>
+
+<h3 id="Operadores_binarios_bit_a_bit">Operadores binarios bit a bit</h3>
+
+<p>Los operadores bit a bit tratan a sus operandos como un conjunto de 32 bits (ceros y unos) y devuelven valores numéricos estándar de JavaScript.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Bitwise_AND", "&amp;")}}</dt>
+ <dd><code>AND</code> bit a bit.</dd>
+ <dt>{{jsxref("Operators/Bitwise_OR", "|")}}</dt>
+ <dd><code>OR</code> bit a bit.</dd>
+ <dt>{{jsxref("Operators/Bitwise_XOR", "^")}}</dt>
+ <dd><code>XOR</code> bit a bit.</dd>
+</dl>
+
+<h3 id="Operadores_lógicos_binarios">Operadores lógicos binarios</h3>
+
+<p>Los operadores lógicos se utilizan normalmente con valores booleanos (lógicos); cuando lo son, devuelven un valor booleano.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Logical_AND", "&amp;&amp;")}}</dt>
+ <dd><code>AND</code> lógico.</dd>
+ <dt>{{jsxref("Operators/Logical_OR", "||")}}</dt>
+ <dd><code>OR</code> lógico.</dd>
+</dl>
+
+<h3 id="Operador_condicional_ternario">Operador condicional (ternario)</h3>
+
+<dl>
+ <dt>{{jsxref("Operators/Conditional_Operator", "(condition ? ifTrue : ifFalse)")}}</dt>
+ <dd>
+ <p>El operador condicional devuelve uno de dos valores según el valor lógico de la condición.</p>
+ </dd>
+</dl>
+
+<h3 id="Operadores_de_asignación">Operadores de asignación</h3>
+
+<p>Un operador de asignación asigna un valor a su operando izquierdo basándose en el valor de su operando derecho.</p>
+
+<dl>
+ <dt>{{jsxref("Operators/Assignment", "=")}}</dt>
+ <dd>Operador de asignación.</dd>
+ <dt>{{jsxref("Operators/Multiplication_assignment", "*=")}}</dt>
+ <dd>Asignación de multiplicación.</dd>
+ <dt>{{jsxref("Operators/Division_assignment", "/=")}}</dt>
+ <dd>Asignación de división.</dd>
+ <dt>{{jsxref("Operators/Remainder_assignment", "%=")}}</dt>
+ <dd>Asignación de residuo.</dd>
+ <dt>{{jsxref("Operators/Addition_assignment", "+=")}}</dt>
+ <dd>Asignación de suma.</dd>
+ <dt>{{jsxref("Operators/Subtraction_assignment", "-=")}}</dt>
+ <dd>Asignación de sustracción</dd>
+ <dt>{{jsxref("Operators/Left_shift_assignment", "&lt;&lt;=")}}</dt>
+ <dd>Asignación de desplazamiento a la izquierda.</dd>
+ <dt>{{jsxref("Operators/Right_shift_assignment", "&gt;&gt;=")}}</dt>
+ <dd>Asignación de desplazamiento a la derecha.</dd>
+ <dt>{{jsxref("Operators/Unsigned_right_shift_assignment", "&gt;&gt;&gt;=")}}</dt>
+ <dd>Asignación de desplazamiento a la derecha sin signo.</dd>
+ <dt>{{jsxref("Operators/Bitwise_AND_assignment", "&amp;=")}}</dt>
+ <dd>Asignación de <code>AND</code> bit a bit.</dd>
+ <dt>{{jsxref("Operators/Bitwise_XOR_assignment", "^=")}}</dt>
+ <dd>Asignación de <code>XOR</code> bit a bit.</dd>
+ <dt>{{jsxref("Operators/Bitwise_OR_assignment", "|=")}}</dt>
+ <dd>Asignación de <code>OR</code> bit a bit.</dd>
+ <dt>{{jsxref("Operators/Logical_AND_assignment", "&amp;&amp;=")}}</dt>
+ <dd>Asignación de <code>AND</code> lógico.</dd>
+ <dt>{{jsxref("Operators/Logical_OR_assignment", "||=")}}</dt>
+ <dd>Asignación de <code>OR</code> lógico.</dd>
+ <dt>{{jsxref("Operators/Logical_nullish_assignment", "??=")}}</dt>
+ <dd>Asignación de anulación lógica.</dd>
+ <dt>{{jsxref("Operators/Destructuring_assignment", "[a, b] = [1, 2]")}}<br>
+ {{jsxref("Operators/Destructuring_assignment", "{a, b} = {a:1, b:2}")}}</dt>
+ <dd>
+ <p>La desestructuración te permite asignar las propiedades de un arreglo u objeto a variables utilizando una sintaxis que se parece a los arreglos u objetos literales.</p>
+ </dd>
+</dl>
+
+<h3 id="Operador_coma">Operador coma</h3>
+
+<dl>
+ <dt>{{jsxref("Operators/Comma_Operator", ",")}}</dt>
+ <dd>El operador <code>coma</code> permite evaluar múltiples expresiones en una sola declaración y devuelve el resultado de la última expresión.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-ecmascript-language-expressions', 'ECMAScript Language: Expressions')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.operators")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/Operator_Precedence", "Operator de precedencia")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/instanceof/index.html b/files/es/web/javascript/reference/operators/instanceof/index.html
new file mode 100644
index 0000000000..4acc592da6
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/instanceof/index.html
@@ -0,0 +1,89 @@
+---
+title: instanceof
+slug: Web/JavaScript/Reference/Operators/instanceof
+tags:
+  - JavaScript
+  - Operator
+  - Relational Operators
+translation_of: Web/JavaScript/Reference/Operators/instanceof
+original_slug: Web/JavaScript/Referencia/Operadores/instanceof
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El operador <strong><code>instanceof</code></strong> verifica si un objeto en su cadena de prototipos contiene la propiedad <code>prototype</code> de un constructor.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>objeto</em> instanceof <em>constructor</em></pre>
+
+<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
+
+<dl>
+ <dt><code>objeto</code></dt>
+ <dd>Objeto a verificar.</dd>
+</dl>
+
+<dl>
+ <dt><code>constructor</code></dt>
+ <dd>Función contra la que se hará la verificación.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Utilice <code>instanceof</code> cuando necesite confirmar el tipo de un objeto en tiempo de ejecución. Por ejemplo, cuando controle excepciones, puede recurrir a diferentes códigos de manipulación de excepciones dependiendo del tipo de excepción tomada.</p>
+
+<p>Debe especificar un objeto en el lado derecho del operador <code>instanceof</code>. Por ejemplo, puede especificar una cadena creada con el constructor <code>String</code>, pero no puede especificar un literal de cadena.</p>
+
+<pre>color1=new String("verde")
+color1 instanceof String // devuelve verdadero (true)
+color2="coral"
+color2 instanceof String // devuelve falso (color2 no es un objeto String)
+</pre>
+
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+
+<p>También vea los ejemplos de {{jsxref("Sentencias/throw", "throw")}}.</p>
+
+<h4 id="Ejemplo:_Determinando_si_elDia_es_un_objeto_Date" name="Ejemplo:_Determinando_si_elDia_es_un_objeto_Date">Ejemplo: Determinando si <code>elDia</code> es un objeto <code>Date</code></h4>
+
+<p>El siguiente código utiliza <code>instanceof</code> para determinar si <code>elDia</code> es un objeto <code>Date</code>. Debido a que <code>elDia</code> es un objeto <code>Date</code>, las instrucciones de la sentencia if se ejecutan.</p>
+
+<pre>elDia = new Date(1995, 12, 17)
+if (elDia instanceof Date) {
+   // instrucciones a ejecutar
+}
+</pre>
+
+<h4 id="Ejemplo:_Demostrando_que_String_y_Date_son_del_tipo_Object" name="Ejemplo:_Demostrando_que_String_y_Date_son_del_tipo_Object">Ejemplo: Demostrando que <code>String</code> y <code>Date</code> son del tipo <code>Object</code></h4>
+
+<p>El siguiente código utiliza <code>instanceof</code> para demostrar que los objetos <code>String</code> y <code>Date</code> son también del tipo <code>Object</code> (éstos se derivan de <code>Object</code>).</p>
+
+<pre>miCadena = new String()
+miFecha = new Date()
+
+miCadena instanceof String // devuelve true
+miCadena instanceof Object // devuelve true
+miCadena instanceof Date   // devuelve false
+
+miFecha instanceof Date     // devuelve true
+miFecha instanceof Object   // devuelve true
+miFecha instanceof String   // devuelve false
+</pre>
+
+<h4 id="Ejemplo:_Demostrando_que_miCoche_es_del_tipo_Coche_y_del_tipo_Object" name="Ejemplo:_Demostrando_que_miCoche_es_del_tipo_Coche_y_del_tipo_Object">Ejemplo: Demostrando que <code>miCoche</code> es del tipo <code>Coche</code> y del tipo <code>Object</code></h4>
+
+<p>El siguiente código crea un objeto del tipo <code>Coche</code> y una instancia de ese tipo de objeto, <code>miCoche</code>. El operador <code>instanceof</code> demuestra que el objeto <code>miCoche</code> es del tipo <code>Coche</code> y del tipo <code>Object</code>.</p>
+
+<pre>function Coche(fabricante, modelo, ejercicio) {
+   this.fabricante = fabricante
+   this.modelo = modelo
+   this.ejercicio= ejercicio
+}
+miCoche = new Coche("Honda", "Accord", 1998)
+a = miCoche instanceof Coche // devuelve verdadero (true)
+b = miCoche instanceof Object // devuelve verdadero (true)
+</pre>
+
+<div class="noinclude"> </div>
diff --git a/files/es/web/javascript/reference/operators/new.target/index.html b/files/es/web/javascript/reference/operators/new.target/index.html
new file mode 100644
index 0000000000..d327e63c35
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/new.target/index.html
@@ -0,0 +1,140 @@
+---
+title: new.target
+slug: Web/JavaScript/Reference/Operators/new.target
+tags:
+  - Clases
+  - ECMAScript6
+  - JavaScript
+  - Referencia
+translation_of: Web/JavaScript/Reference/Operators/new.target
+original_slug: Web/JavaScript/Referencia/Operadores/new.target
+---
+<div>{{JSSidebar("Operators")}}</div>
+
+<p>La propiedad<strong> <code>new.target</code></strong> te permite detectar si una función o constructor fue llamado usando el operador <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a>. En constructores y funciones instanciadas con el operador <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a>, <code>new.target</code> devuelve una referencia al constructor o función. En llamadas a funciones normales, <code>new.target</code> es {{jsxref("undefined")}}.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">new.target</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La sintaxis <code>new.target</code> consiste en el keyword <code>"new</code>", un punto, y el nombre de propiedad <code>"target"</code>. Normalmente "<code>new."</code> sirve como contexto para el acceso a la propiedad, pero aquí, <code>"new."</code> no es realmente un objeto. En llamadas a constructores, sin embargo, <code>new.target</code> hace referencia al constructor invocado por new por lo que "<code>new.</code>" se convierte en un contexto virtual.</p>
+
+<p>La propiedad <code>new.target</code> es una meta propiedad que está disponible para todas las funciones. En <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">funciones flecha</a>, <code>new.target</code> se refiere al <code>new.target</code> de la función que la contiene.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="new.target_en_llamadas_a_funciones">new.target en llamadas a funciones</h3>
+
+<p>En llamadas a funciones normales (en contraposición a llamadas a constructores), <code>new.target</code> es {{jsxref("undefined")}}. Esto te permite detectar si la función fue llamada con <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a> como constructor.</p>
+
+<pre class="brush: js">function Foo() {
+  if (!new.target) throw 'Foo() debe ser llamado con new';
+  console.log('Foo instanciado con new');
+}
+
+Foo(); // Lanza "Foo() debe ser llamado con new"
+new Foo(); // escribe en el log "Foo instanciado con new"
+</pre>
+
+<h3 id="new.target_en_constructores">new.target en constructores</h3>
+
+<p>En constructores de clase, <code>new.target</code> hace referencia al constructor que fue directamente invocado por <code>new</code>. Este también es el caso si el constructor está en una clase padre y fue delegado desdes el constructor hijo.</p>
+
+<pre class="brush: js">class A {
+  constructor() {
+    console.log(new.target.name);
+  }
+}
+
+class B extends A { constructor() { super(); } }
+
+var a = new A(); // escribe en el log "A"
+var b = new B(); // escribe en el log "B"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estatus</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-built-in-function-objects', 'Built-in Function Objects')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-built-in-function-objects', 'Built-in Function Objects')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(46.0)}}</td>
+   <td>{{CompatGeckoDesktop(41)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(46.0)}}</td>
+   <td>{{CompatGeckoMobile(41)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(46.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Funciones">Funciones</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Classes">Clases</a></li>
+ <li><code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a></code></li>
+ <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">this</a></code></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/new/index.html b/files/es/web/javascript/reference/operators/new/index.html
new file mode 100644
index 0000000000..6bfeff9461
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/new/index.html
@@ -0,0 +1,180 @@
+---
+title: Operador new
+slug: Web/JavaScript/Reference/Operators/new
+tags:
+  - Expresiones del lado izquierdo
+  - JavaScript
+  - Left-hand-side expressions
+  - Operador
+  - Operator
+  - Referencia
+translation_of: Web/JavaScript/Reference/Operators/new
+original_slug: Web/JavaScript/Referencia/Operadores/new
+---
+<div>{{jsSidebar("Operators", "Operadores")}}</div>
+
+<p><span class="seoSummary">El <strong>operador <code>new</code></strong> permite a los desarrolladores crear una instancia de un tipo de objeto definido por el usuario o de uno de los tipos de objeto integrados que tiene un función constructora.</span></p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-newoperator.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">new <var>constructor</var>[([<var>arguments</var>])]</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code><var>constructor</var></code></dt>
+ <dd>Una clase o función que especifica el tipo de instancia del objeto.</dd>
+</dl>
+
+<dl>
+ <dt><code><var>arguments</var></code></dt>
+ <dd>Una lista de valores con los que se llamará al <code><var>constructor</var></code>.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La palabra clave <strong><code>new</code></strong> hace lo siguiente:</p>
+
+<ol>
+ <li>Crea un objeto JavaScript simple y en blanco;</li>
+ <li>Vincula (establece el constructor de) este objeto a otro objeto;</li>
+ <li>Pasa el objeto recién creado del <em>Paso 1</em> como el contexto <code>this</code>;</li>
+ <li>Devuelve <code>this</code> si la función no devuelve un objeto.</li>
+</ol>
+
+<p>La creación de un objeto definido por el usuario requiere dos pasos:</p>
+
+<ol>
+ <li>Defina el tipo de objeto escribiendo una función.</li>
+ <li>Crea una instancia del objeto con <code>new</code>.</li>
+</ol>
+
+<p>Para definir un tipo de objeto, crea una función para el tipo de objeto que especifique su nombre y propiedades. Un objeto puede tener una propiedad que en sí misma es otro objeto. Ve los siguientes ejemplos.</p>
+
+<p>Cuando se ejecuta el código <code>new <em>Foo</em>(...)</code>, sucede lo siguiente:</p>
+
+<ol>
+ <li>Se crea un nuevo objeto, heredado de <code><em>Foo</em>.prototype</code>.</li>
+ <li>La función constructora <code><em>Foo</em></code> se llama con los argumentos especificados y con {{JSxRef("Operators/this", "this")}} vinculado al objeto recién creado. <code>new <em>Foo</em></code> es equivalente a <code>new <em>Foo</em>()</code>, es decir, si no se especifica una lista de argumentos, <code><em>Foo</em></code> se llama sin argumentos.</li>
+ <li>El objeto (no nulo, <code>false</code>, 3.1415 u otros tipos primitivos) devuelto por la función constructora se convierte en el resultado de toda la expresión <code>new</code>. Si la función constructora no devuelve explícitamente un objeto, en su lugar se utiliza el objeto creado en el paso 1. (Normalmente, los constructores no devuelven un valor, pero pueden elegir hacerlo si quieren redefinir el proceso normal de creación de objetos).</li>
+</ol>
+
+<p>Siempre puedes agregar una propiedad a un objeto definido previamente. Por ejemplo, la instrucción <code>car1.color = "black"</code> agrega una propiedad <code>color</code> a <code>car1</code> y le asigna un valor de "<code>black</code>". Sin embargo, esto no afecta a ningún otro objeto. Para agregar la nueva propiedad a todos los objetos del mismo tipo, debes agregar la propiedad a la definición del tipo de objeto <code>Car</code>.</p>
+
+<p>Puedes agregar una propiedad compartida a un tipo de objeto definido previamente mediante la propiedad {{JSxRef("Global_Objects/Function/prototype", "Function.prototype")}}. Esto define una propiedad que comparten todos los objetos creados con esa función, en lugar de solo una instancia del tipo de objeto. El siguiente código agrega una propiedad de color con el valor <code>"color original"</code> a todos los objetos de tipo <code>Car</code>, y luego redefine ese valor con la cadena "<code>black</code>" solo en la instancia <code>car1</code> del objeto. Para obtener más información, consulta {{JSxRef("Global_Objects/Function/prototype", "prototype")}}.</p>
+
+<pre class="brush: js notranslate">function Car() {}
+car1 = new Car();
+car2 = new Car();
+
+console.log(car1.color);    // undefined
+
+Car.prototype.color = 'color original';
+console.log(car1.color);    // 'color original'
+
+car1.color = 'black';
+console.log(car1.color);    // 'black'
+
+console.log(Object.getPrototypeOf(car1).color); // 'color original'
+console.log(Object.getPrototypeOf(car2).color); // 'color original'
+console.log(car1.color);   // 'black'
+console.log(car2.color);   // 'color original'
+</pre>
+
+<div class="note">
+<p>Si no escribiste el operador <code>new</code>, <strong>la función <code>constructor</code> se invocará como cualquier función normal</strong>, <em>sin crear un objeto.</em> En este caso, el valor de <code>this</code> también es diferente.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Tipo_de_objeto_e_instancia_de_objeto">Tipo de objeto e instancia de objeto</h3>
+
+<p>Supongamos que deseas crear un tipo de objeto para <code>cars</code>. Quieres que este tipo de objeto se llame <code>Car</code>, y quieres que tenga propiedades para marca, modelo y año (<code>make</code>, <code>model</code> y <code>year</code> en inglés respectivamente). Para ello, podrías escribir la siguiente función:</p>
+
+<pre class="brush: js notranslate">function Car(make, model, year) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+}
+</pre>
+
+<p>Ahora puedes crear un objeto llamado <code>myCar</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">var myCar = new Car('Eagle', 'Talon TSi', 1993);
+</pre>
+
+<p>Esta declaración crea <code>myCar</code> y le asigna los valores especificados para sus propiedades. Entonces el valor de <code>myCar.make</code> es la cadena "Eagle", <code>myCar.year</code> es el entero 1993, y así sucesivamente.</p>
+
+<p>Puedes crear cualquier número de objetos <code>car</code> mediante llamadas a <code>new</code>. Por ejemplo:</p>
+
+<pre class="brush: js notranslate">var kensCar = new Car('Nissan', '300ZX', 1992);
+</pre>
+
+<h3 id="Propiedad_del_objeto_que_en_sí_mismo_es_otro_objeto">Propiedad del objeto que en sí mismo es otro objeto</h3>
+
+<p>Supongamos que defines un objeto llamado <code>Person</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">function Person(name, age, sex) {
+  this.name = name;
+  this.age = age;
+  this.sex = sex;
+}
+</pre>
+
+<p>Y luego creas una instancia de dos nuevos objetos <code>Person</code> de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">var rand = new Person('Rand McNally', 33, 'M');
+var ken = new Person('Ken Jones', 39, 'M');
+</pre>
+
+<p>Luego, puedes reescribir la definición de <code>Car</code> para incluir una propiedad para <code>owner</code> (propietario en español) que tome un objeto <code>Person</code>, de la siguiente manera:</p>
+
+<pre class="brush: js notranslate">function Car(make, model, year, owner) {
+  this.make = make;
+  this.model = model;
+  this.year = year;
+  this.owner = owner;
+}
+</pre>
+
+<p>Para crear instancias de los nuevos objetos, utiliza lo siguiente:</p>
+
+<pre class="brush: js notranslate">var car1 = new Car('Eagle', 'Talon TSi', 1993, rand);
+var car2 = new Car('Nissan', '300ZX', 1992, ken);
+</pre>
+
+<p>En lugar de pasar una cadena literal o un valor entero al crear los nuevos objetos, las declaraciones anteriores pasan los objetos <code>rand</code> y <code>ken</code> como parámetros para los propietarios. Para conocer el nombre del propietario de <code>car2</code>, puedes acceder a la siguiente propiedad:</p>
+
+<pre class="brush: js notranslate">car2.owner.name
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-new-operator', 'El operador new')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.operators.new")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Function", "Funciones")}}</li>
+ <li>{{jsxref("Reflect.construct()")}}</li>
+ <li>{{jsxref("Object.prototype")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/operator_precedence/index.html b/files/es/web/javascript/reference/operators/operator_precedence/index.html
new file mode 100644
index 0000000000..06a51d7241
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/operator_precedence/index.html
@@ -0,0 +1,298 @@
+---
+title: Precedencia de operadores
+slug: Web/JavaScript/Reference/Operators/Operator_Precedence
+tags:
+  - JavaScript
+  - Operator
+  - operator details
+  - operator precedence
+translation_of: Web/JavaScript/Reference/Operators/Operator_Precedence
+original_slug: Web/JavaScript/Referencia/Operadores/Operator_Precedence
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<h2 id="Summary" name="Summary">Sumario</h2>
+
+<p>La precedencia de operadores determina el orden en el cual los operadores son evaluados. Los operadores con mayor precedencia son evaluados primero.</p>
+
+<p>Ejemplo:</p>
+
+<pre class="brush: js">3 + 4 * 5 // retorna 23
+</pre>
+
+<p>El operador de multiplicación ("*") tiene una precedencia mas alta que el operador de suma ("+") y por eso sera evaluado primero.</p>
+
+<h2 id="Associativity" name="Associativity">Asociatividad</h2>
+
+<p>La asociatividad determina el orden en el cual los operadores con el mismo nivel de precedencia son procesados. Por ejemplo:</p>
+
+<pre class="brush: js">a OP b OP c
+</pre>
+
+<p>La asociatividad de izquierda a derecha significa que esa expresión es procesada como <code>(a OP b) OP c, </code>mientras que la asociatividad de derecha a izquierda significa que es procesada como a<code> OP (b OP c). </code>Los operadores de asignación tienen asociatividad de derecha a izquierda, por lo que puedes escribir:</p>
+
+<pre class="brush: js">a = b = 5;
+</pre>
+
+<p>para asignar 5 a las dos variables. Esto es porque el operador de asignación retorna el valor que asignó. Primero <code>b</code> es inicializada a 5. Despues <code>a</code> es inicializada al valor de <code>b</code>.</p>
+
+<h2 id="Table" name="Table">Tabla</h2>
+
+<p>La siguiente tabla esta ordenada de la precedencia más alta (0) a la más baja (18).</p>
+
+<table class="fullwidth-table">
+ <tbody>
+  <tr>
+   <th>Precedencia</th>
+   <th>Tipo de operador</th>
+   <th>Asociatividad</th>
+   <th>Operador</th>
+  </tr>
+  <tr>
+   <td>0</td>
+   <td>grouping</td>
+   <td>n/a</td>
+   <td><code>(</code>…<code>)</code></td>
+  </tr>
+  <tr>
+   <td rowspan="3">1</td>
+   <td rowspan="2"><a href="/en-US/docs/JavaScript/Reference/Operators/Member_Operators" title="JavaScript/Reference/Operators/Member_Operators">member</a></td>
+   <td rowspan="2">left-to-right</td>
+   <td>…<code>.<var>…</var></code></td>
+  </tr>
+  <tr>
+   <td>…<code>[<var>…</var>]</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/new" title="JavaScript/Reference/Operators/Special_Operators/new_Operator">new</a></td>
+   <td>n/a</td>
+   <td><code>new</code> … <code>(<var>…</var>)</code></td>
+  </tr>
+  <tr>
+   <td rowspan="2">2</td>
+   <td><a href="/en-US/docs/JavaScript/Guide/Functions" title="JavaScript/Reference/Operators/Special_Operators/function_call">function call</a></td>
+   <td>left-to-right</td>
+   <td>…<code>(<var>…</var>)</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/new" title="JavaScript/Reference/Operators/Special_Operators/new_Operator">new</a></td>
+   <td>right-to-left</td>
+   <td><code>new</code> …</td>
+  </tr>
+  <tr>
+   <td rowspan="2">3</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">increment</a></td>
+   <td>n/a</td>
+   <td>…<code>++</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">decrement</a></td>
+   <td>n/a</td>
+   <td>…<code>--</code></td>
+  </tr>
+  <tr>
+   <td rowspan="7">4</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Logical_Operators" title="JavaScript/Reference/Operators/Logical_Operators">logical-not</a></td>
+   <td>right-to-left</td>
+   <td><code>!</code>…</td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise not</a></td>
+   <td>right-to-left</td>
+   <td><code>~</code>…</td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">unary +</a></td>
+   <td>right-to-left</td>
+   <td><code>+</code>…</td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">unary negation</a></td>
+   <td>right-to-left</td>
+   <td><code>-</code>…</td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/typeof" title="JavaScript/Reference/Operators/Special_Operators/typeof_Operator">typeof</a></td>
+   <td>right-to-left</td>
+   <td><code>typeof</code> …</td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/void" title="JavaScript/Reference/Operators/Special_Operators/void_Operator">void</a></td>
+   <td>right-to-left</td>
+   <td><code>void</code> …</td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/delete" title="JavaScript/Reference/Operators/Special_Operators/delete_Operator">delete</a></td>
+   <td>right-to-left</td>
+   <td><code>delete</code> …</td>
+  </tr>
+  <tr>
+   <td rowspan="3">5</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">multiplication</a></td>
+   <td>left-to-right</td>
+   <td><code>*</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">division</a></td>
+   <td>left-to-right</td>
+   <td><code>/</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">modulus</a></td>
+   <td>left-to-right</td>
+   <td><code>%</code></td>
+  </tr>
+  <tr>
+   <td rowspan="2">6</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">addition</a></td>
+   <td>left-to-right</td>
+   <td><code>+</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">subtraction</a></td>
+   <td>left-to-right</td>
+   <td><code>-</code></td>
+  </tr>
+  <tr>
+   <td rowspan="3">7</td>
+   <td rowspan="3"><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise shift</a></td>
+   <td rowspan="3">left-to-right</td>
+   <td><code>&lt;&lt;</code></td>
+  </tr>
+  <tr>
+   <td><code>&gt;&gt;</code></td>
+  </tr>
+  <tr>
+   <td><code>&gt;&gt;&gt;</code></td>
+  </tr>
+  <tr>
+   <td rowspan="6">8</td>
+   <td rowspan="4"><a href="/en-US/docs/JavaScript/Reference/Operators/Comparison_Operators" title="JavaScript/Reference/Operators/Comparison_Operators">relational</a></td>
+   <td rowspan="4">left-to-right</td>
+   <td><code>&lt;</code></td>
+  </tr>
+  <tr>
+   <td><code>&lt;=</code></td>
+  </tr>
+  <tr>
+   <td><code>&gt;</code></td>
+  </tr>
+  <tr>
+   <td><code>&gt;=</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/in" title="JavaScript/Reference/Operators/Special_Operators/in_Operator">in</a></td>
+   <td>left-to-right</td>
+   <td><code>in</code></td>
+  </tr>
+  <tr>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/instanceof" title="JavaScript/Reference/Operators/Special_Operators/instanceof_Operator">instanceof</a></td>
+   <td>left-to-right</td>
+   <td><code>instanceof</code></td>
+  </tr>
+  <tr>
+   <td rowspan="4">9</td>
+   <td rowspan="4"><a href="/en-US/docs/JavaScript/Reference/Operators/Comparison_Operators" title="JavaScript/Reference/Operators/Comparison_Operators">equality</a></td>
+   <td rowspan="4">left-to-right</td>
+   <td><code>==</code></td>
+  </tr>
+  <tr>
+   <td><code>!=</code></td>
+  </tr>
+  <tr>
+   <td><code>===</code></td>
+  </tr>
+  <tr>
+   <td><code>!==</code></td>
+  </tr>
+  <tr>
+   <td>10</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise-and</a></td>
+   <td>left-to-right</td>
+   <td><code>&amp;</code></td>
+  </tr>
+  <tr>
+   <td>11</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise-xor</a></td>
+   <td>left-to-right</td>
+   <td><code>^</code></td>
+  </tr>
+  <tr>
+   <td>12</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise-or</a></td>
+   <td>left-to-right</td>
+   <td><code>|</code></td>
+  </tr>
+  <tr>
+   <td>13</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Logical_Operators" title="JavaScript/Reference/Operators/Logical_Operators">logical-and</a></td>
+   <td>left-to-right</td>
+   <td><code>&amp;&amp;</code></td>
+  </tr>
+  <tr>
+   <td>14</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Logical_Operators" title="JavaScript/Reference/Operators/Logical_Operators">logical-or</a></td>
+   <td>left-to-right</td>
+   <td><code>||</code></td>
+  </tr>
+  <tr>
+   <td>15</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/Conditional_Operator" title="JavaScript/Reference/Operators/Special_Operators/Conditional_Operator">conditional</a></td>
+   <td>right-to-left</td>
+   <td>… <code>?</code> … <code>:</code> …</td>
+  </tr>
+  <tr>
+   <td rowspan="12">16</td>
+   <td rowspan="12"><a href="/en-US/docs/JavaScript/Reference/Operators/Assignment_Operators" title="JavaScript/Reference/Operators/Assignment_Operators">assignment</a></td>
+   <td rowspan="12">right-to-left</td>
+   <td><code>=</code></td>
+  </tr>
+  <tr>
+   <td><code>+=</code></td>
+  </tr>
+  <tr>
+   <td><code>-=</code></td>
+  </tr>
+  <tr>
+   <td><code>*=</code></td>
+  </tr>
+  <tr>
+   <td><code>/=</code></td>
+  </tr>
+  <tr>
+   <td><code>%=</code></td>
+  </tr>
+  <tr>
+   <td><code>&lt;&lt;=</code></td>
+  </tr>
+  <tr>
+   <td><code>&gt;&gt;=</code></td>
+  </tr>
+  <tr>
+   <td><code>&gt;&gt;&gt;=</code></td>
+  </tr>
+  <tr>
+   <td><code>&amp;=</code></td>
+  </tr>
+  <tr>
+   <td><code>^=</code></td>
+  </tr>
+  <tr>
+   <td><code>|=</code></td>
+  </tr>
+  <tr>
+   <td>17</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/yield" title="JavaScript/Reference/Operators/yield">yield</a></td>
+   <td>right-to-left</td>
+   <td><code>yield</code>…</td>
+  </tr>
+  <tr>
+   <td>18</td>
+   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/Comma_Operator" title="JavaScript/Reference/Operators/Special_Operators/Comma_Operator">comma</a></td>
+   <td>left-to-right</td>
+   <td><code>,</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<p></p>
diff --git a/files/es/web/javascript/reference/operators/optional_chaining/index.html b/files/es/web/javascript/reference/operators/optional_chaining/index.html
new file mode 100644
index 0000000000..ff12caff68
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/optional_chaining/index.html
@@ -0,0 +1,188 @@
+---
+title: Encadenamiento opcional
+slug: Web/JavaScript/Reference/Operators/Optional_chaining
+translation_of: Web/JavaScript/Reference/Operators/Optional_chaining
+original_slug: Web/JavaScript/Referencia/Operadores/Encadenamiento_opcional
+---
+<div>{{JSSidebar("Operators")}}</div>
+
+<p>El operador de <strong>encadenamiento opcional</strong> <strong><code>?.</code></strong> permite leer el valor de una propiedad ubicada dentro de una cadena de objetos conectados sin tener que validar expresamente que cada referencia en la cadena sea válida. <span class="seoSummary">El operador <code>?.</code> funciona de manera similar a el operador de encadenamiento <code>.</code>, excepto que en lugar de causar un error si una referencia es <a href="/en-US/docs/Glossary/nullish">casi-nula</a> ({{JSxRef("null")}} o {{JSxRef("undefined")}}), la expresión hace una evaluación de circuito corto con un valor de retorno de <code>undefined</code>.</span> Cuando se usa con llamadas a funciones, devuelve <code>undefined</code> si la función dada no existe.</p>
+
+<p>Esto da como resultado expresiones más cortas y simples cuando se accede a propiedades encadenadas dónde existe la posibilidad de que falte una referencia. También puede ser útil al explorar el contenido de un objeto cuando no hay una garantía conocida de qué propiedades se requieren.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-optionalchainingoperator.html", "taller")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><var>obj</var>?.<var>prop</var>
+<var>obj</var>?.[<var>expr</var>]
+<em>arr</em>?.[<var>index</var>]
+<var>func</var>?.(<var>args</var>)
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El operador de encadenamiento opcional proporciona una forma de simplificar el acceso a los valores a través de objetos conectados cuando es posible que una referencia o función sea <code>undefined</code> o <code>null</code>.</p>
+
+<p>Por ejemplo, considere un objeto <code>obj</code> que tiene una estructura anidada. Sin encadenamiento opcional, buscar una subpropiedad profundamente anidada requiere validar las referencias intermedias, como:</p>
+
+<pre class="brush: js">let nestedProp = obj.first &amp;&amp; obj.first.second;
+</pre>
+
+<p>Se confirma que el valor de <code>obj.first</code> no es <code>null</code> (y no es <code>undefined</code>) antes de acceder al valor de <code>obj.first.second</code>. Esto evita el error que ocurriría si simplemente accediera a <code>obj.first.second</code> directamente sin probar <code>obj.first</code>.</p>
+
+<p>Sin embargo, con el operador de encadenamiento opcional (<code>?.</code>), No tiene que probar explícitamente, ni realizar una evaluación de circuito corto basada en el estado de <code>obj.first</code> antes de intentar acceder a <code>obj.first.second</code>:</p>
+
+<pre class="brush: js">let nestedProp = obj.first?.second;
+</pre>
+
+<p>Al usar el operador <code>?.</code> en lugar de solo el <code>.</code>, JavaScript sabe verificar implícitamente para asegurarse de que <code>obj.first</code> no es <code>null</code> o <code>undefined</code> antes de intentar acceder  <code>obj.first.second</code>. Si <code>obj.first</code> es <code>null</code> o <code>undefined</code>, la expresión hace una evaluación de circuito corto automáticamente y retorna <code>undefined</code>.</p>
+
+<p>Esto es equivalente a lo siguiente, excepto que la variable temporal es de hecho no creada:</p>
+
+<pre class="brush: js">let temp = obj.first;
+let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.second);
+</pre>
+
+<h3 id="Encadenamiento_opcional_con_llamadas_a_funciones">Encadenamiento opcional con llamadas a funciones</h3>
+
+<p>Puede usar el encadenamiento opcional cuando intente llamar a un método que puede no existir. Esto puede ser útil, por ejemplo, cuando se usa una API en la que un método podría no estar disponible, ya sea debido a la antigüedad de la implementación o debido a una característica que no está disponible en el dispositivo del usuario.</p>
+
+<p>El uso de encadenamiento opcional con llamadas a funciones hace que la expresión regrese automáticamente <code>undefined</code> en lugar de lanzar una excepción si no se encuentra el método:</p>
+
+<pre class="brush: js">let result = someInterface.customMethod?.();</pre>
+
+<div class="blockIndicator note">
+<p><strong>Nota:</strong> Si hay una propiedad con ese nombre y que no es una función, usar <code>?.</code> aún levantará una excepción {{JSxRef("TypeError")}} (<code>x.y</code><code> is not a function</code>).</p>
+</div>
+
+<h4 id="Manejo_de_callbacks_opcionales_o_manejadores_de_eventos">Manejo de callbacks opcionales o manejadores de eventos</h4>
+
+<p>Si utiliza callbacks o métodos de recuperación de un objeto con<a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring"> una asignación de desestructuración</a>, es posible que tenga valores inexistentes que no puede llamar como funciones a menos que haya probado su existencia. Usando <code>?.</code>, Puede evitar esta prueba adicional:</p>
+
+<pre class="brush: js">// Escrito a partir de ES2019
+function doSomething(onContent, onError) {
+  try {
+    // ... hacer algo con los datos
+  }
+  catch (err) {
+    if (onError) { // Probando si onError realmente existe
+      onError(err.message);
+    }
+  }
+}
+</pre>
+
+<pre class="brush: js">// Usando encadenamiento opcional con llamado de funciones
+function doSomething(onContent, onError) {
+  try {
+   // ... hacer algo con los datos
+  }
+  catch (err) {
+    onError?.(err.message); // Sin excepción si onError esta undefined
+  }
+}
+</pre>
+
+<h3 id="Encadenamiento_opcional_con_expresiones">Encadenamiento opcional con expresiones</h3>
+
+<p>También puede usar el operador de encadenamiento opcional al acceder a propiedades con una expresión usando <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors#Bracket_notation">la notación de corchetes</a>:</p>
+
+<pre class="brush: js">let nestedProp = obj?.['prop' + 'Name'];
+</pre>
+
+<h3 id="El_encadenamiento_opcional_no_es_válido_al_lado_izquierdo_de_una_asignación">El encadenamiento opcional no es válido al lado izquierdo de una asignación</h3>
+
+<pre class="brush: js"><code>let object = {};
+object?.property = 1; // Uncaught SyntaxError: Invalid left-hand side in assignment</code></pre>
+
+<h3 id="Acceso_a_elementos_de_un_arreglo_con_encadenamiento_opcional">Acceso a elementos de un arreglo con encadenamiento opcional</h3>
+
+<pre class="brush: js">let arrayItem = arr?.[42];</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_básico">Ejemplo básico</h3>
+
+<p>Este ejemplo busca el valor de la propiedad <code>name</code> para el miembro <code>bar</code> en un mapa cuando no existe dicho miembro. El resultado es por lo tanto es <code>undefined</code>.</p>
+
+<pre class="brush: js">let myMap = new Map();
+myMap.set("foo", {name: "baz", desc: "inga"});
+
+let nameBar = myMap.get("bar")?.name;</pre>
+
+<h3 id="Evaluación_de_circuito_corto">Evaluación de circuito corto</h3>
+
+<p>Cuando se usa el encadenamiento opcional con expresiones, si el operando izquierdo es <code>null</code> o <code>undefined</code>, la expresión no se evaluará. Por ejemplo:</p>
+
+<pre class="brush: js">let potentiallyNullObj = null;
+let x = 0;
+let prop = potentiallyNullObj?.[x++];
+
+console.log(x); // 0 como x no se incrementó
+</pre>
+
+<h3 id="Apilando_el_operador_de_encadenamiento_opcional">Apilando el operador de encadenamiento opcional</h3>
+
+<p>Con estructuras anidadas, es posible usar encadenamiento opcional varias veces:</p>
+
+<pre class="brush: js">let customer = {
+  name: "Carl",
+  details: {
+    age: 82,
+    location: "Paradise Falls" // "detailed address" es desconocida
+  }
+};
+let customerCity = customer.details?.address?.city;
+
+// … esto también funciona con la función opcional de encadenamiento
+let duration = vacations.trip?.getTime?.();
+</pre>
+
+<h3 id="Combinando_con_el_operador_de_fusión_nulo">Combinando con el operador de fusión nulo</h3>
+
+<p>El {{JSxRef("Operators/Nullish_Coalescing_Operator", "operador de fusión nulo", '', 1)}} se puede usar después del encadenamiento opcional para generar un valor predeterminado cuando no se encontró ninguno:</p>
+
+<pre class="brush: js">let customer = {
+  name: "Carl",
+  details: { age: 82 }
+};
+const customerCity = customer?.city ?? "Unknown city";
+console.log(customerCity); // Unknown city</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#prod-OptionalExpression', 'optional expression')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.operators.optional_chaining")}}</p>
+</div>
+
+<h3 id="Progreso_de_implementación">Progreso de implementación</h3>
+
+<p>La siguiente tabla proporciona un estado de implementación diaria para esta característica, porque esta característica aún no ha alcanzado la estabilidad entre navegadores. Los datos se generan ejecutando las pruebas de características relevantes en <a href="https://github.com/tc39/test262">Test262</a>, el conjunto de pruebas estándar de JavaScript, en la compilación nocturna o la última versión del motor de JavaScript de cada navegador.</p>
+
+<div>{{EmbedTest262ReportResultsTable("optional-chaining")}}</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>El {{JSxRef("Operators/Nullish_Coalescing_Operator", "Nullish Coalescing Operator", '', 1)}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/pipeline_operator/index.html b/files/es/web/javascript/reference/operators/pipeline_operator/index.html
new file mode 100644
index 0000000000..60b1de0858
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/pipeline_operator/index.html
@@ -0,0 +1,79 @@
+---
+title: Operador Pipeline
+slug: Web/JavaScript/Reference/Operators/Pipeline_operator
+tags:
+  - Encadenamiento
+  - Experimental
+  - JavaScript
+  - Operador
+  - Pipeline
+translation_of: Web/JavaScript/Reference/Operators/Pipeline_operator
+original_slug: Web/JavaScript/Referencia/Operadores/Pipeline_operator
+---
+<div>{{jsSidebar("Operators")}} {{SeeCompatTable}}</div>
+
+<p>El operador experimental pipeline <code>|&gt;</code> (actualmente en su fase1) conduce el valor de una expresión dentro de una función. Esto permite la creación de llamadas de función en cadena de un modo más legible. El resultado es una simplificación sintáctica en la cual la llamada a una función con un único parámetro puede ser escrita del siguiente modo:</p>
+
+<pre class="brush: js">let url = "%21" |&gt; decodeURI;</pre>
+
+<p>La llamada equivalente en sintaxis tradicional tiene este aspecto:</p>
+
+<pre class="brush: js">let url = decodeURI("%21");
+</pre>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><em>expression</em> |&gt; <em>function</em>
+</pre>
+
+<p>El valor especificado en la <code>expression</code> se pasa dentro de la  <code>function</code> como su único parámetro.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Encadenando_llamadas_a_funciones">Encadenando llamadas  a funciones</h3>
+
+<p>El operador pipeline puede mejorar la legibilidad cuando se encadenan varias funciones entre si.</p>
+
+<pre class="brush: js">const double = (n) =&gt; n * 2;
+const increment = (n) =&gt; n + 1;
+
+// sin operador pipeline
+double(increment(double(double(5)))); // 42
+
+// con operador pipeline
+5 |&gt; double |&gt; double |&gt; increment |&gt; double; // 42
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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><a href="https://tc39.github.io/proposal-pipeline-operator/#sec-intro">Borrador del operador Pipeline</a></td>
+   <td>Fase 1</td>
+   <td>Todavía no forma parte de la especificación ECMAScript</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>
+<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si quieres contribuir a estos datos, por favor consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y mándanos una pull request.</div>
+
+<p>{{Compat("javascript.operators.pipeline")}}</p>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://github.com/tc39/proposal-pipeline-operator">Github - Proposal-pipeline-operator</a></li>
+ <li><a href="https://github.com/tc39/proposals">TC39 proposals</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/property_accessors/index.html b/files/es/web/javascript/reference/operators/property_accessors/index.html
new file mode 100644
index 0000000000..32f20fd150
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/property_accessors/index.html
@@ -0,0 +1,86 @@
+---
+title: Miembros
+slug: Web/JavaScript/Reference/Operators/Property_Accessors
+tags:
+  - JavaScript
+  - Operator
+translation_of: Web/JavaScript/Reference/Operators/Property_Accessors
+original_slug: Web/JavaScript/Referencia/Operadores/Miembros
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Los operadores de miembros proporcionan acceso a las propiedades y métodos de un objeto.</p>
+
+<p>Un objeto es en realidad un<em> arreglo asociativo</em> (por ejemplo<em> map</em> ,<em>dictionary</em> ,<em>hash</em> ,<em>lookup table</em> ). Las <em>claves</em> en este arreglo son los nombres de las propiedades y los métodos (propiedades que hacen referencia a funciones). Hay dos modos de acceder a estas propiedades: notación por punto y notación por corchete (es decir, operador de subscripción).</p>
+
+<p>Nota: La especificación <a href="/es/docs/Glossary/ECMAScript">ECMAScript</a> etiqueta estos operadores como "property accessors" en vez de "operadores de miembro" (member operators).</p>
+
+<h3 id="Notaci.C3.B3n_por_punto" name="Notaci.C3.B3n_por_punto">Notación por punto</h3>
+
+<pre class="brush: js">get = objeto.propiedad;
+objeto.propiedad = set;
+</pre>
+
+<p><code>propiedad</code> debe ser un identificador válido de JavaScript, esto es, una secuencia alfanumérica de caracteres, incluyendo también el guión bajo ("<code>_</code>") y el signo dolar ("<code>$</code>"), que no puede comenzar por un número. Por ejemplo, <code>objeto.$1</code> es válido, mientras que <code>objeto.1</code> no lo es.</p>
+
+<p>Ejemplo:</p>
+
+<pre class="brush: js">document.createElement('pre');
+</pre>
+
+<p>Aquí, el método llamado "createElement" se recupera de <code>document</code> y se le llama.</p>
+
+<h3 id="Notaci.C3.B3n_por_corchetes" name="Notaci.C3.B3n_por_corchetes">Notación por corchetes</h3>
+
+<pre class="brush: js">get = objeto[nombre_propiedad];
+objeto[nombre_propiedad] = set;
+</pre>
+
+<p><code>nombre_propiedad</code> es una cadena. La cadena no tiene que ser un identificador válido; puede tener cualquier valor, por ejemplo "1foo", "!bar!", o incluso " " (un espacio).</p>
+
+<p>Ejemplo:</p>
+
+<pre class="brush: js">document['createElement']('pre');
+</pre>
+
+<p>Esto hace exactamente lo mismo que el ejemplo anterior.</p>
+
+<h3 id="Nombres_de_propiedades" name="Nombres_de_propiedades">Nombres de propiedades</h3>
+
+<p>Los nombres de propiedades deben ser cadenas. Esto significa que no pueden usarse objetos distintos a cadenas como claves en un objeto. Cualquier objeto que no sea una cadena, incluyendo números, se convierte al tipo cadena a través de su método {{jsxref("Object.toString")}}.</p>
+
+<p>Ejemplos:</p>
+
+<pre class="brush: js">var objeto = {};
+objeto['1'] = 'valor';
+alert(objeto[1]);
+</pre>
+
+<p>Ésto tendrá como resultado "valor", ya que 1 se convertirá por tipo a '1'.</p>
+
+<pre class="brush: js">var foo = {propiedad_unica: 1}, bar = {propiedad_unica: 2}, objeto = {};
+objeto[foo] = 'valor';
+alert(objeto[bar]);
+</pre>
+
+<p>Ésto también tiene como resultado "valor", ya que tanto foo como bar se convierten a la misma cadena. En el motor de JavaScript <a href="/es/docs/Mozilla/SpiderMonkey">SpiderMonkey</a>, esta cadena sería "{{ mediawiki.external('objeto Object') }}".</p>
+
+<h3 id="Enlace_a_m.C3.A9todos" name="Enlace_a_m.C3.A9todos">Enlace a métodos</h3>
+
+<p>Un método no está enlazado al objeto del que es método. Específicamente, <code>this</code> no está establecido en un método, es decir, <code>this</code> no se refiere necesariamente a un objeto conteniendo el método. <code>this</code>, en cambio, se "pasa" mediante la llamada de función.</p>
+
+<p>Vea <a href="/es/docs/Web/JavaScript/Referencia/Operadores/this#Funciones_enlazadas">enlace a métodos</a>.</p>
+
+<h3 id="Nota_sobre_eval" name="Nota_sobre_eval">Nota sobre <code>eval</code></h3>
+
+<p>Los principiantes en JavaScript a menudo tienen el error de usar {{jsxref("eval")}} cuando la notación por corchetes puede usarse a cambio. Por ejemplo, la siguiente sintaxis se ve a menudo en muchos scripts.</p>
+
+<pre class="brush: js">x = eval('document.nombre_formulario.' + cadenaControlFormulario + '.value');
+</pre>
+
+<p><code>eval</code> es lenta y se debería evitar en la medida de lo posible. Es mejor usar la notación por corchetes a cambio:</p>
+
+<pre class="brush: js">x = document.nombre_formulario[cadenaControlFormulario].value;
+</pre>
diff --git a/files/es/web/javascript/reference/operators/remainder/index.html b/files/es/web/javascript/reference/operators/remainder/index.html
new file mode 100644
index 0000000000..b8e4540902
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/remainder/index.html
@@ -0,0 +1,83 @@
+---
+title: Resto (%)
+slug: Web/JavaScript/Reference/Operators/Remainder
+translation_of: Web/JavaScript/Reference/Operators/Remainder
+original_slug: Web/JavaScript/Referencia/Operadores/Resto
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador resto (<code>%</code>) devuelve el resto de la división entre dos operandos. Siempre toma el signo del dividendo.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-remainder.html")}}</div>
+
+<div></div>
+
+<p class="hidden">El código fuente para este ejemplo interactivo se encuentra en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivas, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y realiza un pull request.</p>
+
+<p>Tener en cuenta que en la mayoría de los lenguajes de programación, el operador de resto es ‘%’, pero en otros (como <a href="https://en.wikipedia.org/wiki/Modulo_operation#In_programming_languages">Python, Perl</a>) es el operador módulo. Ambos son iguales para valores positivos, pero cuando el divisor y el dividendo son de signos distintos, se obtienen distintos resultados. Para obtener el módulo en JavaScript, en lugar de <code>a % n</code>, usa <code>((a % n ) + n ) % n</code>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><strong>Operador:</strong> <var>var1</var> % <var>var2</var>
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Resto_con_dividendo_positivo">Resto con dividendo positivo</h3>
+
+<pre class="brush: js notranslate"> 12 % 5  //  2
+ 1 % -2 //  1
+ 1 % 2  //  1
+ 2 % 3  //  2
+5.5 % 2 // 1.5
+</pre>
+
+<h3 id="Resto_con_dividendo_negativo">Resto con dividendo negativo</h3>
+
+<pre class="brush: js notranslate">-12 % 5 // -2
+-1 % 2  // -1
+-4 % 2  // -0</pre>
+
+<h3 id="Resto_con_NaN">Resto con NaN</h3>
+
+<pre class="brush: js notranslate">NaN % 2 // NaN</pre>
+
+<h3 id="Resto_con_Infinity">Resto con Infinity</h3>
+
+<pre class="brush: js notranslate">Infinity % 2 // NaN
+Infinity % 0 // NaN
+Infinity % Infinity // NaN
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-multiplicative-operators', 'Remainder operator')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.remainder")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/spread_syntax/index.html b/files/es/web/javascript/reference/operators/spread_syntax/index.html
new file mode 100644
index 0000000000..1738484548
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/spread_syntax/index.html
@@ -0,0 +1,243 @@
+---
+title: Sintáxis Spread
+slug: Web/JavaScript/Reference/Operators/Spread_syntax
+tags:
+  - ECMAScript6
+  - Iteradores
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Operators/Spread_syntax
+original_slug: Web/JavaScript/Referencia/Operadores/Sintaxis_Spread
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<div><strong>La sintaxis extendida o spread</strong> <strong>syntax</strong> permite a un elemento iterable tal como un arreglo o cadena ser expandido en lugares donde cero o más argumentos (para llamadas de  función) o elementos (para <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Grammar_and_types#Literales_Array">Array literales</a>) son esperados, o a un objeto ser expandido en lugares donde cero o más pares de valores clave (para <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Grammar_and_types#Literales">literales Tipo Objeto</a>) son esperados.</div>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-spreadsyntax.html")}}</div>
+
+<div></div>
+
+<p class="hidden">La fuente para este ejemplo interactivo está almacenada en el repositorio de GitHub. Si quieres contribuir al proyecto interactivo de ejemplos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de descarga (pull).</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<p>Para llamadas de funciones:</p>
+
+<pre class="syntaxbox notranslate">myFunction(...iterableObj);
+</pre>
+
+<p>Para arreglos literales o cadenas de caracteres:</p>
+
+<pre class="syntaxbox notranslate">[...iterableObj, '4', 'five', 6];</pre>
+
+<p>Para objetos literales (nuevo en ECMAScript 2018):</p>
+
+<pre class="syntaxbox notranslate">let objClone = { ...obj };</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Spread_en_llamadas_de_función">Spread en llamadas de función</h3>
+
+<h4 id="Reemplaza_apply">Reemplaza "apply"</h4>
+
+<p>Es frecuente usar {{jsxref( "Function.prototype.apply")}} en casos donde quieres usar los elementos de un arreglo como argumentos de una función.</p>
+
+<pre class="brush: js notranslate">function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction.apply(null, args);</pre>
+
+<p>Con la sintaxis expandida (spread syntax), el código anterior puede ser escrito como:</p>
+
+<pre class="brush: js notranslate">function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction(...args);</pre>
+
+<p>Cualquier argumento en la lista de argumentos puede usar la sintáxis expandida y esto puede ser usado varias veces.</p>
+
+<pre class="brush: js notranslate">function myFunction(v, w, x, y, z) { }
+var args = [0, 1];
+myFunction(-1, ...args, 2, ...[3]);</pre>
+
+<h4 id="Apply_para_new">"Apply" para "new"</h4>
+
+<p>Cuando se llama un constructor con <code>new</code>, no es posible usar <strong>directamente</strong> un arreglo y <code>apply</code> (<code>apply</code> hace un <code>[[Call]]</code> y no un <code>[[Construct]]</code>). Sin embargo, un arreglo puede ser fácilmente usado con un new gracias a la sintáxis expandida:</p>
+
+<pre class="brush: js notranslate">var dateFields = [1970, 0, 1];  // 1 Jan 1970
+var d = new Date(...dateFields);
+</pre>
+
+<p>Para usar <strong>new </strong>con un arreglo de parámetros sin la sintáxis expandida, podrías tener que hacerlo <strong>indirectamente </strong>a través de una aplicación parcial:</p>
+
+<pre class="brush: js notranslate">function applyAndNew(constructor, args) {
+   function partial () {
+      return constructor.apply(this, args);
+   };
+   if (typeof constructor.prototype === "object") {
+      partial.prototype = Object.create(constructor.prototype);
+   }
+   return partial;
+}
+
+
+function myConstructor () {
+   console.log("arguments.length: " + arguments.length);
+   console.log(arguments);
+   this.prop1="val1";
+   this.prop2="val2";
+};
+
+var myArguments = ["hi", "how", "are", "you", "mr", null];
+var myConstructorWithArguments = applyAndNew(myConstructor, myArguments);
+
+console.log(new myConstructorWithArguments);
+// (internal log of myConstructor):           arguments.length: 6
+// (internal log of myConstructor):           ["hi", "how", "are", "you", "mr", null]
+// (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"}</pre>
+
+<h3 id="Expandir_Array_literales">Expandir Array literales</h3>
+
+<h4 id="Un_literal_Array_más_poderoso">Un literal Array más poderoso</h4>
+
+<p>Sin <code><strong>sintaxis expandida (spread syntax)</strong></code>, para crear un nuevo arreglo usando un arreglo existente como parte de él,no es suficiente la sintaxis de Array literal y en su lugar se debe usar código imperativo con una combinación de <code>push</code>, <code>splice</code>, <code>concat</code>, etc. Con la sintaxis expandida, esto se vuelve mucho mas práctico:</p>
+
+<pre class="brush: js notranslate">var parts = ['shoulders', 'knees'];
+var lyrics = ['head', ...parts, 'and', 'toes'];
+// ["head", "shoulders", "knees", "and", "toes"]
+</pre>
+
+<p>Así como para expandir listas de argumentos, <code>...</code> puede ser usado en cualquier parte dentro del Array literal, y múltiples veces.</p>
+
+<h4 id="Copiar_un_arreglo">Copiar un arreglo</h4>
+
+<pre class="brush: js notranslate">var arr = [1, 2, 3];
+var arr2 = [...arr]; // like arr.slice()
+arr2.push(4);
+
+// arr2 becomes [1, 2, 3, 4]
+// arr remains unaffected
+</pre>
+
+<p><strong>Nota:</strong> La sintaxis expandida efectivamente va a un nivel de profundidad mientras copia un arreglo. Por lo tanto, esto no permite copiar arreglos multidimensionales como se muestra en los siguientes ejemplos (es lo mismo con {{jsxref("Object.assign()")}} y sintaxis spread).</p>
+
+<pre class="brush: js notranslate">var a = [[1], [2], [3]];
+var b = [...a];
+b.shift().shift(); // 1
+// Now array a is affected as well: [[], [2], [3]]
+</pre>
+
+<h4 id="Una_forma_mejor_para_concatenar_arreglos">Una forma mejor para concatenar arreglos</h4>
+
+<p>{{jsxref("Array.concat")}} es usada a menudo para concatenar un arreglo al final de un arreglo ya existente. Sin la sintaxis spread se realiza:</p>
+
+<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+// Append all items from arr2 onto arr1
+arr1 = arr1.concat(arr2);</pre>
+
+<p>Con la sintaxis spread se transforma en:</p>
+
+<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+arr1 = [...arr1, ...arr2];
+</pre>
+
+<p>{{jsxref("Array.unshift")}} es a menudo usada para insertar un arreglo de valores al inicio de un arreglo existente. Sin la sintáxis spread, esto es hecho como:</p>
+
+<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+// Prepend all items from arr2 onto arr1
+Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2]</pre>
+
+<p>Con la sintaxis spread se convierte en [Observa, sin embargo, que esto crea un nuevo arreglo <code>arr1</code>.  Diferente a {{jsxref("Array.unshift")}}, esto no modifica el arreglo original en sitio <code>arr1</code>]:</p>
+
+<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+arr1 = [...arr2, ...arr1]; // arr1 is now [3, 4, 5, 0, 1, 2]
+</pre>
+
+<h3 id="Spread_en_literales_tipo_Objeto">Spread en literales tipo Objeto</h3>
+
+<p>La propuesta <a href="https://github.com/tc39/proposal-object-rest-spread">Propiedades Rest/Spread para ECMAScript</a> (etapa 4) agrega propiedades spread a los <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">literales Tipo Objeto</a>. Esto copia sus propiedades enumerables desde un objeto provisto dentro de un nuevo objeto.</p>
+
+<p>Shallow-cloning (excluyendo prototype) o la combinación de objetos es ahora posible usando una sintaxis más corta que {{jsxref("Object.assign()")}}.</p>
+
+<pre class="brush: js notranslate">var obj1 = { foo: 'bar', x: 42 };
+var obj2 = { foo: 'baz', y: 13 };
+
+var clonedObj = { ...obj1 };
+// Object { foo: "bar", x: 42 }
+
+var mergedObj = { ...obj1, ...obj2 };
+// Object { foo: "baz", x: 42, y: 13 }</pre>
+
+<p>Observa que {{jsxref("Object.assign()")}} desencadena <a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">setters</a> mientras que la sintaxis spread no lo hace.</p>
+
+<p>Observa que tú no puedes reemplazar o replicar la función {{jsxref("Object.assign()")}}:</p>
+
+<pre class="brush: js notranslate">var obj1 = { foo: 'bar', x: 42 };
+var obj2 = { foo: 'baz', y: 13 };
+const merge = ( ...objects ) =&gt; ( { ...objects } );
+
+var mergedObj = merge ( obj1, obj2);
+// Object { 0: { foo: 'bar', x: 42 }, 1: { foo: 'baz', y: 13 } }
+
+var mergedObj = merge ( {}, obj1, obj2);
+// Object { 0: {}, 1: { foo: 'bar', x: 42 }, 2: { foo: 'baz', y: 13 } }</pre>
+
+<p>En el ejemplo de arriba, el operador spread no trabaja como uno podría esperar: este dispersa un <em>arreglo</em> de argumentos en el literal Tipo Objeto, debido al parámetro rest.</p>
+
+<h3 id="Sólo_para_iterables">Sólo para iterables</h3>
+
+<p>La sintaxis Spread (otra que en el caso de las propiedades spread) puede ser aplicada sólo a los objetos <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol/iterator">iterables</a>:</p>
+
+<pre class="brush: js notranslate">var obj = {'key1': 'value1'};
+var array = [...obj]; // TypeError: obj is not iterable
+</pre>
+
+<h3 id="Spread_con_muchos_valores">Spread con muchos valores</h3>
+
+<p>Cuando se usa la sintaxis spread para llamados de funciones, tenga en cuenta la posibilidad de exceder el límite de longitud de argumentos del motor de JavaScript. Vea <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply" title="The apply() method calls a function with a given this value, and arguments provided as an array (or an array-like object)."><code>apply()</code></a> para más detalles.</p>
+
+<h2 id="Sintaxis_Rest_parámetros">Sintaxis Rest (parámetros)</h2>
+
+<p>La sintaxis Rest luce exactamente como la sintaxis spread, pero esto es usado por la desestructuración de arreglos y objetos. De cierta forma, la sintaxis rest es la opuesta a la sintaxis spread: spread 'expande' un arreglo en sus elementos, mientras rest agrupa múltiples elementos y los 'condensa' en un único elemento. Consulta <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/rest_parameters">parámetros rest.</a></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-array-initializer')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-array-initializer">Array Initializer</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-argument-lists">Argument Lists</a></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array-initializer')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Sin cambios.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-object-initializer')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Definido en <a href="https://tc39.github.io/ecma262/2018/#sec-object-initializer">Object Initializer</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quieres contribuir con esta información, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud (pull).</div>
+
+<p>{{Compat("javascript.operators.spread")}}</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/rest_parameters">Rest parameters</a> (también ‘<code>...</code>’)</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/strict_equality/index.html b/files/es/web/javascript/reference/operators/strict_equality/index.html
new file mode 100644
index 0000000000..b9d9522565
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/strict_equality/index.html
@@ -0,0 +1,102 @@
+---
+title: Igualdad Estricta (===)
+slug: Web/JavaScript/Reference/Operators/Strict_equality
+translation_of: Web/JavaScript/Reference/Operators/Strict_equality
+original_slug: Web/JavaScript/Referencia/Operadores/Strict_equality
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de estricta igualdad (<code>===</code>) revisa si dos operandos son iguales y produce un resultado Booleano. A diferencia del operador de igualdad regular (==), el operador de estricta igualdad siempre considera que los operandos de distinto tipo de valor son diferentes y nunca similares.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-strict-equality.html")}}</div>
+
+<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">x === y</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los operadores de estricta igualdad (<code>===</code> y <code>!==</code>) usan el <a class="external external-icon" href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.6" rel="noopener">Algoritmo Estricto Comparativo de Igualdad </a> para comparar dos operandos:</p>
+
+<ul>
+ <li>Si los operandos son de diferente tipo de valor, produce <code>false</code>.</li>
+ <li> Si ambos operandos son objetos, produce <code>true</code> solo si se refiere al mismo objeto.</li>
+ <li>Si ambos operandos son de tipo <code>null</code> o ambos operandos son <code>undefined</code>, produce <code>true</code>.</li>
+ <li>Si cualquier operando es de tipo <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">NaN</span></font>, produce <code>false</code>.</li>
+ <li>En otros casos, compara los valores de ambos operandos:
+  <ul>
+   <li>Los números deben tener el mismo valor numérico, aunque <code>+0</code> y <code>-0</code> son considerados como del mismo valor.</li>
+   <li>Los strings deben tener los mismos caracteres en el mismo orden.</li>
+   <li>Los booleanos deben ambos ser <code>true</code> o ambos ser <code>false</code>.</li>
+  </ul>
+ </li>
+</ul>
+
+<p>La diferencia más notable entre este operador y el operador de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Equality">igualdad</a> regular (<code>==</code>) es que si los operandos son de distinto tipo de valor, el operador <code>==</code> intenta convertir los valores a un mismo tipo de dato antes de compararlos.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Comparando_operandos_del_mismo_tipo">Comparando operandos del mismo tipo</h3>
+
+<pre class="brush: js notranslate">console.log("hello" === "hello");   // true
+console.log("hello" === "hola");    // false
+
+console.log(3 === 3);               // true
+console.log(3 === 4);               // false
+
+console.log(true === true);         // true
+console.log(true === false);        // false
+
+console.log(null === null);         // true</pre>
+
+<h3 id="Comparando_operandos_de_distinto_tipo">Comparando operandos de distinto tipo</h3>
+
+<pre class="brush: js notranslate">console.log("3" === 3);           // false
+
+console.log(true === 1);          // false
+
+console.log(null === undefined);  // false</pre>
+
+<h3 id="Comparando_objetos">Comparando objetos</h3>
+
+<pre class="brush: js notranslate">const object1 = {
+  name: "hello"
+}
+
+const object2 = {
+  name: "hello"
+}
+
+console.log(object1 === object2);  // false
+console.log(object1 === object1);  // true</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-equality-operators', 'Equality operators')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_exploradores">Compatibilidad entre exploradores</h2>
+
+
+
+<p>{{Compat("javascript.operators.strict_equality")}}</p>
+
+<h2 id="También_revisa">También revisa</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Equality">Operador de igualdad</a></li>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Inequality">Operador de desigualdad</a></li>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Strict_inequality">Operador de estricta desigualdad</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/subtraction/index.html b/files/es/web/javascript/reference/operators/subtraction/index.html
new file mode 100644
index 0000000000..06a7852ee6
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/subtraction/index.html
@@ -0,0 +1,66 @@
+---
+title: Sustracción (-)
+slug: Web/JavaScript/Reference/Operators/Subtraction
+tags:
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Operators/Subtraction
+original_slug: Web/JavaScript/Referencia/Operadores/Sustracción
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>El operador de sustracción (<code>-</code>) sustrae dos operandos, produciendo su diferencia.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-subtraction.html")}}</div>
+
+<div></div>
+
+
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate"><strong>Operator:</strong> <var>x</var> - <var>y</var>
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Sustracción_con_números">Sustracción con números</h3>
+
+<pre class="brush: js notranslate">5 - 3     // 2
+3 - 5     // -2</pre>
+
+<h3 id="Sustracción_de_no_numéricos">Sustracción de no numéricos</h3>
+
+<pre class="brush: js notranslate">'foo' - 3 // NaN</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-subtraction-operator-minus', 'Subtraction operator')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_exploradores">Compatibilidad entre exploradores</h2>
+
+
+
+<p>{{Compat("javascript.operators.subtraction")}}</p>
+
+<h2 id="También_revisa">También revisa</h2>
+
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/super/index.html b/files/es/web/javascript/reference/operators/super/index.html
new file mode 100644
index 0000000000..03e900b564
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/super/index.html
@@ -0,0 +1,179 @@
+---
+title: super
+slug: Web/JavaScript/Reference/Operators/super
+tags:
+  - Clases
+  - ECMAScript 2015
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators/super
+original_slug: Web/JavaScript/Referencia/Operadores/super
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p>La palabra clave <strong>super</strong> es usada para acceder y llamar funciones del padre de un objeto.</p>
+
+<p>Las expresiones <code>super.prop</code> y <code>super[expr]</code> son válidas en cualquier <a href="/es/docs/Web/JavaScript/Reference/Functions/Method_definitions">definición de método</a> tanto para <a href="/es/docs/Web/JavaScript/Reference/Classes">clases</a> como para <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">objetos literales</a>.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">// llama al método constructor del objeto padre.
+super([arguments]);
+
+// llama cualquier otro método del objeto padre.
+super.functionOnParent([arguments]);
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Cuando es usado en un constructor, la palabra clave <code>super</code> aparece  sola lo cual invoca el constructor del objeto padre. En este caso debe usarse antes de que la palabra clave <code>this</code> sea usada. La palabra clave <code>super</code> también puede utilizarse para llamar otras funciones del objeto padre.</p>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<h3 id="Usando_super_en_clases">Usando <code>super</code> en clases</h3>
+
+<p>Este fragmento de código se toma del <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">ejemplo de clases</a> (<a href="https://googlechrome.github.io/samples/classes-es6/index.html">demo en vivo</a>). Aquí se llama a <code>super()</code> para evitar la duplicación de las partes del constructor que son comunes entre <code>Rectangle</code> y <code>Square</code>.</p>
+
+<pre class="brush: js">class Rectangle {
+  constructor(height, width) {
+    this.name = 'Rectangle';
+    this.height = height;
+    this.width = width;
+  }
+  sayName() {
+    console.log('Hi, I am a ', this.name + '.');
+  }
+  get area() {
+    return this.height * this.width;
+  }
+  set area(value) {
+    this.height = this.width = Math.sqrt(value);
+  }
+}
+
+class Square extends Rectangle {
+  constructor(length) {
+    this.height; // ReferenceError, super necesita ser llamado primero!
+
+    // Aquí, llama al constructor de la clase padre con las longitudes
+    // previstas para el ancho y la altura de Rectangle
+    super(length, length);
+
+    // Nota: En las clases derivadas, se debe llamar a super() antes de
+    // poder usar 'this'. Salir de esto provocará un error de referencia.
+    this.name = 'Square';
+  }
+}</pre>
+
+<h3 id="Super-llamando_a_métodos_estáticos">Super-llamando a métodos estáticos</h3>
+
+<p>También puede llamar a super en métodos estáticos.</p>
+
+<pre class="brush: js">class Rectangle {
+  constructor() {}
+  static logNbSides() {
+    return 'I have 4 sides';
+  }
+}
+
+class Square extends Rectangle {
+  constructor() {}
+  static logDescription() {
+    return super.logNbSides() + ' which are all equal';
+  }
+}
+Square.logDescription(); // 'Tengo 4 lados que son todos iguales'
+</pre>
+
+<h3 id="Eliminar_propiedades_super_generará_un_error">Eliminar propiedades <code>super</code> generará un error</h3>
+
+<p>No puede usar el <a href="/es/docs/Web/JavaScript/Reference/Operators/delete">operador de eliminación</a> y <code>super.prop</code> o <code>super[expr]</code> para eliminar la propiedad de una clase principal, lanzará {{jsxref("ReferenceError")}}.</p>
+
+<pre class="brush: js">class Base {
+  constructor() {}
+  foo() {}
+}
+class Derived extends Base {
+  constructor() {}
+  delete() {
+    delete super.foo; // esto es malo
+  }
+}
+
+new Derived().delete(); // ReferenceError: eliminación no válida que implica 'super'. </pre>
+
+<h3 id="super.prop_no_puede_sobrescribir_las_propiedades_no_modificables"><code>super.prop</code> no puede sobrescribir las propiedades no modificables</h3>
+
+<p>Al definir propiedades que no se pueden escribir, p. Ej. {{jsxref("Object.defineProperty")}}, <code>super</code> no puede sobrescribir el valor de la propiedad.</p>
+
+<pre class="brush: js">class X {
+  constructor() {
+    Object.defineProperty(this, 'prop', {
+      configurable: true,
+      writable: false,
+      value: 1
+    });
+  }
+  f() {
+    super.prop = 2;
+  }
+}
+
+var x = new X();
+x.f(); // TypeError: "prop" es de solo lectura
+console.log(x.prop); // 1
+</pre>
+
+<h3 id="Usando_super.prop_en_objetos_literales">Usando <code>super.prop</code> en objetos literales</h3>
+
+<p>Super también se puede usar en el <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">inicializador de objetos / notación literal</a>. En este ejemplo, dos objetos definen un método. En el segundo objeto, <code>super</code> llama al primer método del objeto. Esto funciona con la ayuda de {{jsxref("Object.setPrototypeOf()")}} con el que podemos establecer el prototipo de <code>obj2</code> en <code>obj1</code>, de modo que <code>super</code> pueda encontrar el <code>method1</code> en <code>obj1</code>.</p>
+
+<pre class="brush: js">var obj1 = {
+  method1() {
+    console.log('method 1');
+  }
+}
+
+var obj2 = {
+  method2() {
+   super.method1();
+  }
+}
+
+Object.setPrototypeOf(obj2, obj1);
+obj2.method2(); // logs "method 1"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-super-keyword', 'super')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-super-keyword', 'super')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+
+
+<p>{{Compat("javascript.operators.super")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Reference/Classes">Clases</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/this/index.html b/files/es/web/javascript/reference/operators/this/index.html
new file mode 100644
index 0000000000..da34707919
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/this/index.html
@@ -0,0 +1,240 @@
+---
+title: this
+slug: Web/JavaScript/Reference/Operators/this
+translation_of: Web/JavaScript/Reference/Operators/this
+original_slug: Web/JavaScript/Referencia/Operadores/this
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<h2 id="Introducción">Introducción</h2>
+
+<p>La palabra clave <strong><code>this</code></strong> de una función se comporta un poco diferente en Javascript en comparación con otros lenguajes. Además tiene algunas diferencias entre el <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Modo_estricto" title="en-US/docs/JavaScript/Strict mode">modo estricto</a> y el modo no estricto.</p>
+
+<p>En general, el valor de <code>this</code> está determinado por cómo se invoca a la función. No puede ser establecida mediante una asignación en tiempo de ejecución, y puede ser diferente cada vez que la función es invocada. ES5 introdujo el método {{jsxref("Function.bind()", "bind()")}} para <a href="#Funciones_enlazadas" title="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Special/this#Bound_functions">establecer el valor de la función <code>this</code> independientemente de como es llamada</a>, y ES2015 introdujo las <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">funciones flecha</a> que no proporcionan su propio "binding" de <code>this</code> (se mantiene el valor de <code>this</code> del contexto léxico que envuelve a la función)</p>
+
+<p>{{EmbedInteractiveExample("pages/js/expressions-this.html")}}</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">this</pre>
+
+<h3 id="Valor">Valor</h3>
+
+<p>El objeto contexto de JavaScript en el cual se está ejecutando el código actual.</p>
+
+<h2 id="Contexto_global">Contexto global</h2>
+
+<p>En el contexto de ejecución global (fuera de cualquier función), <strong><code>this</code></strong> se refiere al objeto global, ya sea en modo estricto o no.</p>
+
+<pre class="brush:js">console.log(this.document === document); // true
+
+// En los navegadores web, el objeto window también es un objeto global:
+console.log(this === window); // true
+
+this.a = 37;
+console.log(window.a); // 37
+</pre>
+
+<div class="blockIndicator note">
+<p><font><font>Nota: Puedes obtener el objeto global usando la propieda global <code>globalThis</code>, no importa el contexto donde se ejecute esta propiedad, siempre hará referencia al objeto global. </font></font></p>
+</div>
+
+<h2 id="Contexto_de_la_función">Contexto de la función</h2>
+
+<p><span class="hps" style="line-height: 1.5;">Dentro de una</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">función</span><span style="line-height: 1.5;">, </span><span class="hps" style="line-height: 1.5;">el valor de this</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">depende de cómo</span><span style="line-height: 1.5;"> la función es l</span><span class="hps" style="line-height: 1.5;">lamada</span><span id="result_box" lang="es" style="line-height: 1.5;">.</span></p>
+
+<h3 id="Llamada_simple">Llamada simple</h3>
+
+<pre class="brush:js">function f1(){
+  return this;
+}
+
+f1() === window; // objeto global
+</pre>
+
+<div><span class="hps" style="line-height: 1.5;">En</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">este caso</span><span style="line-height: 1.5;">,</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">el valor de <strong>this</strong></span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">no está establecido</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">por</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">la llamada</span><span style="line-height: 1.5;">.</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">Dado que el código</span><span style="line-height: 1.5;"> </span><span class="alt-edited hps" style="line-height: 1.5;">no está</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">en modo estricto</span><span style="line-height: 1.5;">, </span><span class="hps" style="line-height: 1.5;">el valor de this</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">debe ser siempre</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">un objeto</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">por lo que</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">por defecto es el</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">objeto global</span><span style="line-height: 1.5;">.</span></div>
+
+<div></div>
+
+<div>
+<pre class="brush:js" style="font-size: 14px;">function f2(){
+  "use strict"; // consultar modo estricto
+  return this;
+}
+
+f2() === undefined;</pre>
+</div>
+
+<div><span style="line-height: 1.5;">En modo estricto, el valor de <strong>this</strong> se mantiene en lo que está establecida al entrar en el contexto de ejecución. Si no está definido, permanece undefined. También se puede ajustar a cualquier valor, tales como <strong>null</strong> o <strong>42</strong> o "<strong>Yo no soy this</strong>".</span></div>
+
+<div></div>
+
+<div class="note">
+<p><strong>Nota:</strong> En el segundo ejemplo, <strong><code>this</code></strong> debería ser {{jsxref("undefined")}}, porque <code>f2</code> fue llamado sin proporcionar ninguna base (ej. <code>window.f2()</code>). Esta característica no fue implementada en algunos navegadores cuando se comenzó a dar soporte al <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Modo_estricto" title="Strict mode">modo estricto</a>. Como resultado, retorna incorrectamente el objeto window.</p>
+</div>
+
+<div><span>Como un método de un objeto</span></div>
+
+<p>Cuando una función es llamada como un método de un objeto, el <strong><code>this</code></strong> cambia por el metodo del objeto llamado.</p>
+
+<p>En el siguiente ejemplo, cuando <strong><code>o.f()</code></strong> es invocado, dentro de la función <strong><code>this</code></strong> es ligado al objeto <strong><code>o</code></strong>.</p>
+
+<pre class="brush:js">var o = {
+  prop: 37,
+  f: function() {
+    return this.prop;
+  }
+};
+
+console.log(o.f()); // logs 37
+</pre>
+
+<p>Note que el comportamiento no es del todo afectado por cómo o dónde la función fue definida. En el ejemplo anterior, nosotros definimos la función en línea como el elemento <code>f</code> durante la definición de <code>o</code>.  Sin embargo, podriamos haber definido con la misma facilidad la primera función y luego  adjuntarlo a <code>o.f</code>. Hacerlo da como resultado el mismo comportamiento.</p>
+
+<pre class="brush:js">var o = {prop: 37};
+
+function independent() {
+  return this.prop;
+}
+
+o.f = independent;
+
+console.log(o.f()); // logs 37
+</pre>
+
+<p>Esto demuestra que sólo importa que la función fue invocada del elemento <code>f</code> de <code>o</code>.</p>
+
+<p>Asimismo, el enlace <code>this</code> sólo se ve afectado por la referencia del miembro más inmediata. En el siguiente ejemplo, cuando invocamos a la función, lo llamamos como metodo <code>g</code> del objeto <code>o.b</code>. Esta vez durante la ejecución, <code>this </code>dentro de la función se referirá a <code>o.b</code>. <span id="result_box" lang="es"><span class="hps">El hecho de que</span> <span class="hps">el objeto</span> <span class="hps">es en sí mismo</span> <span class="alt-edited hps">un elemento</span> <span class="hps">de </span></span><code>o</code><span id="result_box" lang="es"> <span class="hps">no tiene ninguna</span> <span class="hps">consecuencia</span><span>,</span> <span class="hps">la referencia más</span> <span class="hps">inmediata es</span> <span class="hps">todo lo que importa</span><span>.</span></span></p>
+
+<pre class="brush:js">o.b = {g: independent, prop: 42};
+console.log(o.b.g()); // logs 42
+</pre>
+
+<h4 id="..._en_la_cadena_de_prototipo">... en la cadena de prototipo</h4>
+
+<p>El mismo concepto es válido para los métodos definidos en alguna parte de la cadena de prototipo del objeto. Si el método esta sobre una cadena de prototipo del objeto, <code>this</code> se referirá al objeto donde está el método de donde fue llamado. Como si ese método estuviera dentro del objeto. </p>
+
+<pre class="brush:js">var o = {f:function(){ return this.a + this.b; }};
+var p = Object.create(o);
+p.a = 1;
+p.b = 4;
+
+console.log(p.f()); // 5
+</pre>
+
+<p>En este ejemplo, el objeto asignado a la variable <code>p</code> no tiene su propia propiedad <code>f</code>, esto lo hereda de su prototipo. Pero no importa que la búsqueda de <code>f</code> eventualmente encuentre un elemento con ese nombre en <code>o</code>; la búsqueda comenzó como una referencia a <code>p.f</code>, asi <code>this </code>dentro de la funcion toma el valor del objeto referido como <code>p</code>. Es decir, desde que <code>f</code> es llamado como método de <code>p</code>, su <code>this</code> refiere a <code>p</code>. Esto es una interesante característica de la herencia de prototipo de JavaScript.</p>
+
+<h4 id="..._o_como_un_getter_o_setter">... o como un getter o setter</h4>
+
+<p>Nuevamente, el mismo concepto es válido cuando una función es invocada de un getter o un setter. Una función usado como getter o setter tiene su enlace <code>this</code> al objeto desde el cual la propiedad esta siendo establecida u obtenida.</p>
+
+<pre class="brush:js">function modulus(){
+  return Math.sqrt(this.re * this.re + this.im * this.im);
+}
+
+var o = {
+  re: 1,
+  im: -1,
+  get phase(){
+    return Math.atan2(this.im, this.re);
+  }
+};
+
+Object.defineProperty(o, 'modulus', {get: modulus, enumerable:true, configurable:true});
+
+console.log(o.phase, o.modulus); // logs -0.78 1.4142
+</pre>
+
+<h3 id="Como_un_constructor">Como un constructor</h3>
+
+<p>Cuando una función es usada como un constructor (con la palabra clave {{jsxref("Operadores/new", "new")}}), su <code>this</code> es enlazado al nuevo objeto en construcción, a menos que la ejecución de los resultados del constructor en el motor JavaScript encuentren una instrucción de retorno donde el valor de retorno sea un objeto.</p>
+
+<pre class="brush:js">/*
+ * Los constructores trabajan algo asi:
+ *
+ * function MyConstructor(){
+ *   // El cuerpo del código de la función actual va aquí.  Crear las propiedades en |this| como
+ *   // se desee mediante la asignación a los mismos.  E.g.,
+ *   this.fum = "nom";
+ *   // etcetera...
+ *
+ *   // Si la función tiene una sentencia de retorno este retorna un objeto,
+ *   // este objeto será el resultado de la expresión |new|.  Por otro lado, el
+ *   // resultado de la expresión es el objeto actualmente enlazado a |this|
+ *   // (i.e., el caso más común suele verse).
+ * }
+ */
+
+function C(){
+  this.a = 37;
+}
+
+var o = new C();
+console.log(o.a); // logs 37
+
+
+function C2(){
+  this.a = 37;
+  return {a:38};
+}
+
+o = new C2();
+console.log(o.a); // logs 38
+</pre>
+
+<p>En el último ejemplo (<code>C2</code>), debido a que un objeto fue devuelto durante la construcción, el nuevo objeto que fue enlazado a <code>this</code> simplemente se descarta.( Esto esencialmente hace de la declaración "<code>this.a = 37;</code>" codigo muerto. No esta exactamente muerto,porque es ejecutado pero se puede eliminar sin efectos externos.)</p>
+
+<h3 id="call_y_apply"><code>call</code> y <code>apply</code></h3>
+
+<p>Cuando una función usa la plabra clave <code>this</code> en su cuerpo, su valor puede ser enlazado a un objeto particular durante la ejecución del método {{jsxref("Function.call()", "call()")}} or {{jsxref("Function.apply()", "apply()")}} que todas las funciones hereden de  <code>Function.prototype</code>.</p>
+
+<pre class="brush:js">function add(c, d){
+  return this.a + this.b + c + d;
+}
+
+var o = {a:1, b:3};
+
+// El primer parámetro es el objeto a usar como 'this', parámetros posteriores se pasan como argumentos
+// en la llamada a la función
+add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16
+
+//El primer parámetro es el objeto a usar como 'this''this', la segunda es una matriz cuyos elementos
+//  se utilizan como argumentos en la llamada a la función
+add.apply(o, [10, 20]); // 1 + 3 + 10 + 20 = 34
+</pre>
+
+<h3 id="Funciones_enlazadas">Funciones enlazadas</h3>
+
+<p>ECMAScript 5 introduce {{jsxref("Function.prototype.bind()")}}. Llamando a <code>f.bind(someObject)</code> crea una nueva función con el mismo cuerpo y alcance de <code>f</code>, pero donde <code>this</code> se produce en la función original, en la nueva función esto esta permanentemente ligado al primer argumento de <code>bind</code>, independientemente de cómo la función está siendo utilizada.</p>
+
+<pre class="brush:js">function f(){
+  return this.a;
+}
+
+var g = f.bind({a:"azerty"});
+console.log(g()); // azerty
+
+var o = {a:37, f:f, g:g};
+console.log(o.f(), o.g()); // 37, azerty
+</pre>
+
+<h3 id="Como_un_controlador_de_eventos_DOM">Como un controlador de eventos DOM</h3>
+
+<p>Cuando una función es usada como un controlador de eventos, su <code>this</code> es cambiado desde el elemento del evento disparado (algunos navegadores no siguen esta convención para los listeners agregados dinámicamente con otros métodos <code>addEventListener</code>).</p>
+
+<pre class="brush:js">// Cuando se llama como un listener, convierte en azul el elemento
+// relacionado
+function bluify(e){
+  console.log(this === e.currentTarget); // Siempre true
+  console.log(this === e.target);        // true cuando currentTarget y target son el mismo objeto
+  this.style.backgroundColor = '#A5D9F3';
+}
+
+// Consigue una lista de cada elemento en un documento
+var elements = document.getElementsByTagName('*');
+
+// Añade bluify como un click listener asi cuando se hace click sobre el elemento,
+// este cambia a azul
+for(var i=0 ; i&lt;elements.length ; i++){
+  elements[i].addEventListener('click', bluify, false);
+}</pre>
diff --git a/files/es/web/javascript/reference/operators/typeof/index.html b/files/es/web/javascript/reference/operators/typeof/index.html
new file mode 100644
index 0000000000..01b9237ba0
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/typeof/index.html
@@ -0,0 +1,77 @@
+---
+title: typeof
+slug: Web/JavaScript/Reference/Operators/typeof
+tags:
+  - JavaScript
+  - Operator
+  - Unary
+translation_of: Web/JavaScript/Reference/Operators/typeof
+original_slug: Web/JavaScript/Referencia/Operadores/typeof
+---
+<div><span class="diff_add">{{jsSidebar("Operators")}}</span></div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El operador <code>typeof</code> se usa en cualquiera de los siguientes modos:</p>
+
+<ol>
+ <li><code>typeof <em>operando</em> </code></li>
+ <li><code>typeof (<em>operando</em>)</code></li>
+</ol>
+
+<p>El operador <code>typeof</code> devuelve una cadena que indica el tipo del operando sin evaluarlo. <code>operando</code> es la cadena, variable, palabra clave u objeto para el que se devolverá su tipo. Los paréntesis son opcionales.</p>
+
+<p>Suponga que define las siguientes variables:</p>
+
+<pre class="brush: js">var miFuncion = new Function("5+2")
+var forma = "redonda"
+var tamano = 1
+var hoy = new Date()
+</pre>
+
+<p>El operador <code>typeof</code> devuelve los siguientes resultados para estas variables</p>
+
+<pre class="brush: js">typeof miFuncion === 'function'
+typeof forma === 'string'
+typeof tamano === 'number'
+typeof hoy === 'object'
+typeof noExiste === 'undefined'
+</pre>
+
+<p>Para las palabras clave <code>true</code> y <code>null</code>, el operador <code>typeof</code> devuelve los siguientes resultados:</p>
+
+<pre class="brush: js">typeof true === 'boolean'
+typeof null === 'object'
+</pre>
+
+<p>Para un número o una cadena, el operador <code>typeof</code> devuelve los siguientes resultados:</p>
+
+<pre class="brush: js">typeof 62 === 'number'
+typeof 'Hola mundo' === 'string'
+</pre>
+
+<p>Para valores de propiedades, el operador <code>typeof</code> devuelve el tipo del valor que contiene la propiedad:</p>
+
+<pre class="brush: js">typeof document.lastModified === 'string'
+typeof window.length === 'number'
+typeof Math.LN2 === 'number'
+</pre>
+
+<p>Para métodos y funciones, el operador <code>typeof</code> devuelve los resultados siguientes:</p>
+
+<pre class="brush: js">typeof blur === 'function'
+typeof eval === 'function'
+typeof parseInt === 'function'
+typeof shape.split === 'function'
+</pre>
+
+<p>Para objetos predefinidos, el operador <code>typeof</code> devuelve los siguientes resultados:</p>
+
+<pre class="brush: js">typeof Date === 'function'
+typeof Function === 'function'
+typeof Math === 'object'
+typeof Object === 'function'
+typeof String === 'function'
+</pre>
+
+<p> </p>
diff --git a/files/es/web/javascript/reference/operators/void/index.html b/files/es/web/javascript/reference/operators/void/index.html
new file mode 100644
index 0000000000..a9b8c1ac93
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/void/index.html
@@ -0,0 +1,37 @@
+---
+title: void
+slug: Web/JavaScript/Reference/Operators/void
+tags:
+  - JavaScript
+  - Operator
+  - Unary
+translation_of: Web/JavaScript/Reference/Operators/void
+original_slug: Web/JavaScript/Referencia/Operadores/void
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>El operador <code>void</code> se usa en cualquiera de los siguientes modos:</p>
+
+<ol>
+ <li><code>void (<em>expresion</em> )</code></li>
+ <li><code>void <em>expresion</em> </code></li>
+</ol>
+
+<p>El operador <code>void</code> especifica una expresión que se evalúa sin devolver un valor. <code>expresion</code> es una expresión JavaScript para evaluar. El paréntesis rodeando la expresión es opcional, pero usarlos es una buena práctica al programar.</p>
+
+<p>Puede usar el operador <code>void</code> para especificar una expresión como un enlace de hipertexto. La expresión se evalúa pero no se carga en lugar del documento actual.</p>
+
+<p>El siguiente código crea un enlace de hipertexto que no hace nada cuando el usuario hace click en él. Cuando el usuario hace click en el enlace, void(0) se evalúa como 0, pero eso no tiene ningún efecto en JavaScript.</p>
+
+<pre class="brush: html">&lt;a href="javascript:void(0)"&gt;Haga click aquí para no hacer nada&lt;/a&gt;
+</pre>
+
+<p>El siguiente código crea un enlace de hipertexto que envía un formulario cuando el usuario hace click en él.</p>
+
+<pre class="brush: html">&lt;a href="javascript:void(document.forms["miFormulario"].submit())"&gt;
+Haga click aquí para enviar&lt;/a&gt;
+</pre>
+
+<div class="noinclude"></div>
diff --git a/files/es/web/javascript/reference/operators/yield/index.html b/files/es/web/javascript/reference/operators/yield/index.html
new file mode 100644
index 0000000000..1783cb6f50
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/yield/index.html
@@ -0,0 +1,131 @@
+---
+title: yield
+slug: Web/JavaScript/Reference/Operators/yield
+tags:
+  - Característica del lenguaje
+  - ECMAScript 2015
+  - Generadores
+  - Iterador
+  - JavaScript
+  - Operador
+translation_of: Web/JavaScript/Reference/Operators/yield
+original_slug: Web/JavaScript/Referencia/Operadores/yield
+---
+<div>{{jsSidebar("Operadores")}}</div>
+
+<p>La palabra clave <code>yield</code> se usa para pausar y reanudar una función generadora ({{jsxref("Statements/function*", "function*")}} o {{jsxref("Statements/Legacy_generator_function", "función generadora heredada")}}).</p>
+
+<div>{{EmbedInteractiveExample("pages/js/expressions-yield.html", "taller")}}</div>
+
+<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">[<var>rv</var>] = <strong>yield</strong> [<var>expression</var>]</pre>
+
+<dl>
+ <dt><code><var>expression</var></code> {{optional_inline}}</dt>
+ <dd>Define el valor que se devolverá desde la función generadora a través del {{jsxref("Iteration_protocols", "protocolo iterador", "#El_protocolo_iterador")}}. Si se omite, devuelve <code>undefined</code> en su lugar.</dd>
+ <dt><code><var>rv</var></code> {{optional_inline}}</dt>
+ <dd>
+ <p>Recupera el valor opcional pasado al método <code>next()</code> del generador para reanudar su ejecución.</p>
+ </dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La palabra clave <code>yield</code> detiene la ejecución de la función del generador y el valor de la expresión que sigue a la palabra clave <code>yield</code> se devuelve al llamador del generador. Se puede considerar como una versión basada en un generador de la palabra clave <code>return</code>.</p>
+
+<p><code>yield</code> solo se puede llamar directamente desde la función generadora que la contiene. No se puede llamar desde funciones anidadas o retrollamadas.</p>
+
+<p>La palabra clave <code>yield</code> hace que la llamada al método <code>next()</code> del generador devuelva un objeto <code>IteratorResult</code> con dos propiedades: <code>value</code> y <code>done</code>. La propiedad <code>value</code> es el resultado de evaluar la expresión <code>yield</code>, y <code>done</code> es <code>false</code>, lo cual indica que la función generadora no se ha completado completamente.</p>
+
+<p>Una vez en pausa en una expresión <code>yield</code>, la ejecución del código del generador permanece en pausa hasta que se llama al método <code>next()</code> del generador. Cada vez que se llama al método <code>next()</code> del generador, el generador reanuda la ejecución y se ejecuta hasta que alcanza uno de los siguientes:</p>
+
+<ul>
+ <li>Un <code>yield</code>, el cual hace que el generador vuelva a pausar y devuelva el nuevo valor del generador. La próxima vez que se llame a <code>next()</code>, la ejecución se reanudará con la instrucción inmediatamente después de <code>yield</code>.</li>
+ <li>{{jsxref("Statements/throw", "throw")}} se usa para lanzar una excepción desde el generador. Esta detiene la ejecución del generador por completo y la ejecución se reanuda en el llamador (como suele ser el caso cuando se lanza una excepción).</li>
+ <li>Se alcanza el final de la función generadora. En este caso, la ejecución del generador finaliza y se devuelve un <code>IteratorResult</code> al llamador en el que el <code>value</code> es {{jsxref("undefined")}} y <code>done</code> es <code>true</code>.</li>
+ <li>Se alcanza una instrucción {{jsxref("Statements/return", "return")}}. En este caso, la ejecución del generador finaliza y se devuelve un <code>IteratorResult</code> al llamador en el que el <code>value</code> es el valor especificado por la instrucción <code>return</code> y <code>done</code> es <code>true</code>.</li>
+</ul>
+
+<p>Si se pasa un valor opcional al método <code>next()</code> del generador, ese valor se convierte en el valor devuelto por la operación <code>yield</code> actual del generador.</p>
+
+<p>Entre la ruta del código del generador, sus operadores <code>yield</code> y la capacidad de especificar un nuevo valor inicial pasándolo a {{jsxref("Generator.prototype.next()")}}, los generadores ofrecen enorme poder y control.</p>
+
+<div class="blockIndicator warning">
+<p>Desafortunadamente, <code>next()</code> es asimétrico, pero eso no se puede evitar: siempre envía un valor al <code>yield</code> actualmente suspendido, pero devuelve el operando del siguiente <code>yield</code>.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usar_yield">Usar <code>yield</code></h3>
+
+<p>El siguiente código es la declaración de una función generadora de ejemplo.</p>
+
+<pre class="brush: js notranslate">function* countAppleSales () {
+  let saleList = [3, 7, 5]
+  for (let i = 0; i &lt; saleList.length; i++) {
+    yield saleList[i]
+  }
+}</pre>
+
+<p>Una vez que se define una función generadora, se puede usar construyendo un iterador como el siguiente.</p>
+
+<pre class="brush: js notranslate">let appleStore = countAppleSales()  // Generator { }
+console.log(appleStore.next())      // { value: 3, done: false }
+console.log(appleStore.next())      // { value: 7, done: false }
+console.log(appleStore.next())      // { value: 5, done: false }
+console.log(appleStore.next())      // { value: undefined, done: true }</pre>
+
+<p>También puedes enviar un valor con <code>next(value)</code> al generador. '<code>step</code>' se evalúa como un valor de retorno en esta sintaxis [<var>rv</var>] = <strong>yield</strong> [<var>expression</var>]</p>
+
+<pre class="brush: js notranslate">function* counter(value) {
+ let step;
+
+ while (true) {
+   step = yield ++value;
+
+   if (step) {
+     value += step;
+   }
+ }
+}
+
+const generatorFunc = counter(0);
+console.log(generatorFunc.next().value);   // 1
+console.log(generatorFunc.next().value);   // 2
+console.log(generatorFunc.next().value);   // 3
+console.log(generatorFunc.next(10).value); // 14
+console.log(generatorFunc.next().value);   // 15
+console.log(generatorFunc.next(10).value); // 26</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#prod-YieldExpression', 'Yield')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.operators.yield")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">El protocolo <code>Iterator</code></a></li>
+ <li>{{jsxref("Statements/function*", "function*")}}</li>
+ <li>{{jsxref("Operators/function*", "function* expression")}}</li>
+ <li>{{jsxref("Operators/yield*", "yield*")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/operators/yield_star_/index.html b/files/es/web/javascript/reference/operators/yield_star_/index.html
new file mode 100644
index 0000000000..7a728175ba
--- /dev/null
+++ b/files/es/web/javascript/reference/operators/yield_star_/index.html
@@ -0,0 +1,200 @@
+---
+title: yield*
+slug: Web/JavaScript/Reference/Operators/yield*
+tags:
+  - ECMAScript6
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Operators/yield*
+original_slug: Web/JavaScript/Referencia/Operadores/yield*
+---
+<div>{{jsSidebar("Operators")}}</div>
+
+<p><code>La expresión </code><strong><code>yield*</code></strong><strong> </strong>es usada para delegar a otro {{jsxref("Statements/function*", "generator")}} u objeto iterable.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"> yield* [[expression]];</pre>
+
+<dl>
+ <dt><code>expression</code></dt>
+ <dd>La expresión que retorna un objeto iterable</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La expresión <code>yield*</code> itera sobre el operador realizando yield de cada valor retornado por este.</p>
+
+<p>El valor de la expresion <code>yield*</code> es el valor retornado por el iterador en si mismo cuando es finalizado (ej., cuando <code>done</code> es true).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Delegando_a_otro_generator">Delegando a otro generator</h3>
+
+<p>En el siguiente código, los valores declarados con yield en <code>g1()</code> son devueltos por las llamadas a <code>next() al igual que en</code> <code>g2()</code>.</p>
+
+<pre class="brush: js">function* g1() {
+  yield 2;
+  yield 3;
+  yield 4;
+}
+
+function* g2() {
+  yield 1;
+  yield* g1();
+  yield 5;
+}
+
+var iterator = g2();
+
+console.log(iterator.next()); // { value: 1, done: false }
+console.log(iterator.next()); // { value: 2, done: false }
+console.log(iterator.next()); // { value: 3, done: false }
+console.log(iterator.next()); // { value: 4, done: false }
+console.log(iterator.next()); // { value: 5, done: false }
+console.log(iterator.next()); // { value: undefined, done: true }
+</pre>
+
+<h3 id="Otros_objetos_iterables">Otros objetos iterables</h3>
+
+<p>Además de los objetos generator, <code>yield*</code> también se puede usar <code>yield sobre otros tipos de iterables</code>, ej. arrays, strings u objetos arguments.</p>
+
+<pre class="brush: js">function* g3() {
+  yield* [1, 2];
+  yield* "34";
+  yield* Array.from(arguments);
+}
+
+var iterator = g3(5, 6);
+
+console.log(iterator.next()); // { value: 1, done: false }
+console.log(iterator.next()); // { value: 2, done: false }
+console.log(iterator.next()); // { value: "3", done: false }
+console.log(iterator.next()); // { value: "4", done: false }
+console.log(iterator.next()); // { value: 5, done: false }
+console.log(iterator.next()); // { value: 6, done: false }
+console.log(iterator.next()); // { value: undefined, done: true }
+</pre>
+
+<h3 id="El_valor_de_la_expresión_yield*">El valor de la expresión <code>yield*</code></h3>
+
+<p><code>yield*</code> es una expresión, no una declaración, por lo que se evalua como un valor.</p>
+
+<pre class="brush: js">function* g4() {
+  yield* [1, 2, 3];
+  return "foo";
+}
+
+var result;
+
+function* g5() {
+  result = yield* g4();
+}
+
+var iterator = g5();
+
+console.log(iterator.next()); // { value: 1, done: false }
+console.log(iterator.next()); // { value: 2, done: false }
+console.log(iterator.next()); // { value: 3, done: false }
+console.log(iterator.next()); // { value: undefined, done: true },
+                              // g4() returned { value: "foo", done: true } at this point
+
+console.log(result);          // "foo"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ES6', '#', 'Yield')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inical.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#', 'Yield')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico </td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("27.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("27.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h2>
+
+<ul>
+ <li>Iniciando con Gecko 33 {{geckoRelease(33)}}, el análisis del yield expression ha sido actualizado para cumplir con la última especificación ES6 ({{bug(981599)}}):
+  <ul>
+   <li>Ahora está implementada la restricción de salto de línea. No está permitido el salto de línea entre "yield" y "*". Código como el siguiente lanzará una {{jsxref("SyntaxError")}}:
+    <pre class="brush: js">function* foo() {
+  yield
+  *[];
+}</pre>
+   </li>
+  </ul>
+ </li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Iteration_protocols">Protocolos de iteración</a></li>
+ <li>{{jsxref("Statements/function*", "function*")}}</li>
+ <li>{{jsxref("Operators/function*", "function* expression")}}</li>
+ <li>{{jsxref("Operators/yield", "yield")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/async_function/index.html b/files/es/web/javascript/reference/statements/async_function/index.html
new file mode 100644
index 0000000000..966886e331
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/async_function/index.html
@@ -0,0 +1,174 @@
+---
+title: Función async
+slug: Web/JavaScript/Reference/Statements/async_function
+tags:
+  - Declaración
+  - Ejemplo
+  - JavaScript
+  - función
+translation_of: Web/JavaScript/Reference/Statements/async_function
+original_slug: Web/JavaScript/Referencia/Sentencias/funcion_asincrona
+---
+<div>
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La declaración de función <code><strong>async</strong></code> define una <em>función asíncrona</em>, la cual devuelve un objeto {{jsxref("Global_Objects/AsyncFunction","AsyncFunction")}}.</p>
+
+<div class="noinclude">
+<p>Es posible definir también funciones asíncronas a través de una {{jsxref("Operators/async_function", "expresión de función async", "", 1)}}.</p>
+</div>
+</div>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-async.html", "taller")}}</div>
+
+<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">async function <em>name</em>([<em>param</em>[, <em>param</em>[, ... <em>param</em>]]]) {
+   <em>statements</em>
+}
+</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>El nombre de la función.</dd>
+</dl>
+
+<dl>
+ <dt><code>param</code></dt>
+ <dd>El nombre de un argumento que se debe pasar a la función.</dd>
+</dl>
+
+<dl>
+ <dt><code>statements</code></dt>
+ <dd>Las declaraciones que conforman el cuerpo de la función.</dd>
+</dl>
+
+<h3 id="Valor_de_retorno">Valor de retorno</h3>
+
+<p>Un objeto {{jsxref("Global_Objects/AsyncFunction","AsyncFunction")}}, que representa una función asíncrona que ejecuta el código contenido dentro de la función.</p>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Cuando se llama a una función <code>async</code>, esta devuelve un elemento {{jsxref("Promise")}}. Cuando la función <code>async</code> devuelve un valor, <code>Promise</code> se resolverá con el valor devuelto. Si la función <code>async</code> genera una excepción o algún valor, <code>Promise</code> se rechazará con el valor generado.</p>
+
+<p>Una función <code>async</code> puede contener una expresión {{jsxref("Operators/await", "await")}}, la cual pausa la ejecución de la función asíncrona y espera la resolución de la <code>Promise</code> pasada y, a continuación, reanuda la ejecución de la función <code>async</code> y devuelve el valor resuelto.</p>
+
+<div class="note">
+<p>La finalidad de las funciones <code>async</code>/<code>await</code> es simplificar el comportamiento del uso síncrono de promesas y realizar algún comportamiento específico en un grupo de <code>Promises</code>. Del mismo modo que las <code>Promises</code> son semejantes a las devoluciones de llamadas estructuradas, <code>async</code>/<code>await</code> se asemejan a una combinación de generadores y promesas.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_sencillo">Ejemplo sencillo</h3>
+
+<pre class="brush: js">function resolveAfter2Seconds(x) {
+  return new Promise(resolve =&gt; {
+    setTimeout(() =&gt; {
+      resolve(x);
+    }, 2000);
+  });
+}
+
+
+async function add1(x) {
+  const a = await resolveAfter2Seconds(20);
+  const b = await resolveAfter2Seconds(30);
+  return x + a + b;
+}
+
+add1(10).then(v =&gt; {
+  console.log(v);  // prints 60 after 4 seconds.
+});
+
+
+async function add2(x) {
+  const p_a = resolveAfter2Seconds(20);
+  const p_b = resolveAfter2Seconds(30);
+  return x + await p_a + await p_b;
+}
+
+add2(10).then(v =&gt; {
+  console.log(v);  // prints 60 after 2 seconds.
+});
+</pre>
+
+<div class="warning">
+<h4 id="No_se_deben_confundir_await_y_Promise.all">No se deben confundir <code>await</code> y <code>Promise.all</code></h4>
+
+<p>En <code>add1</code>, la ejecución se suspende durante dos segundos correspondientes al primer operador <code>await</code>, y luego durante otros dos segundos correspondientes al segundo <code>await</code>. El segundo temporizador no se crea hasta que el primero no se haya disparado ya. En <code>add2</code>, ambos temporizadores se crean y, acto seguido, ambos reciben <code>await</code>. Esto provoca la resolución en dos segundos y no cuatro, ya que los temporizadores se ejecutaron de manera simultánea. Sin embargo, ambas llamadas <code>await</code> aún pueden ejecutarse en series, no en paralelo: esto <strong>no</strong> constituye ninguna aplicación automática de <code>Promise.all</code>. Si se desea aplicar <code>await</code> a dos o más promesas en paralelo, es preciso utilizar <code>Promise.all</code>.</p>
+</div>
+
+<h3 id="Reescritura_de_una_cadena_de_promesas_con_una_función_async">Reescritura de una cadena de promesas con una función <code>async</code></h3>
+
+<p>Una API que devuelva una {{jsxref("Promise")}} tendrá como resultado una cadena de promesas, y dividirá la función en muchas partes. Estudie este código:</p>
+
+<pre class="brush: js">function getProcessedData(url) {
+  return downloadData(url) // returns a promise
+    .catch(e =&gt; {
+      return downloadFallbackData(url)  // returns a promise
+    })
+    .then(v =&gt; {
+      return processDataInWorker(v); // returns a promise
+    });
+}
+</pre>
+
+<p>Es posible reescribirlo utilizando un solo operador <code>async</code> de esta manera:</p>
+
+<pre class="brush: js">async function getProcessedData(url) {
+  let v;
+  try {
+    v = await downloadData(url);
+  } catch(e) {
+    v = await downloadFallbackData(url);
+  }
+  return processDataInWorker(v);
+}
+</pre>
+
+<p>Observe que, en el ejemplo anterior, no hay ninguna instrucción <code>await</code> dentro de la instrucción <code>return</code>, porque el valor de retorno de una <code>async function</code> queda implícitamente dentro de un {{jsxref("Promise.resolve")}}.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('ESDraft', '#sec-async-function-definitions', 'Función async')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td>Definición inicial en ES2017.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES8', '#sec-async-function-definitions', 'Función async')}}</td>
+   <td>{{Spec2('ES8')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.statements.async_function")}}</p>
+</div>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/async_function", "Expresión de función async")}}</li>
+ <li>Objeto {{jsxref("AsyncFunction")}}</li>
+ <li>{{jsxref("Operators/await", "await")}}</li>
+ <li><a href="http://innolitics.com/10x/javascript-decorators-for-promise-returning-functions/">«Decorar funciones async de JavaScript» en innolitics.com</a> (en inglés)</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/block/index.html b/files/es/web/javascript/reference/statements/block/index.html
new file mode 100644
index 0000000000..b40269ab27
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/block/index.html
@@ -0,0 +1,90 @@
+---
+title: block
+slug: Web/JavaScript/Reference/Statements/block
+tags:
+  - JavaScript
+  - Referencia
+  - Referência(2)
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/block
+original_slug: Web/JavaScript/Referencia/Sentencias/block
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Una sentencia block se utiliza para agrupar cero o más sentencias. Este grupo block se delimita por un par de llaves.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="eval">{<em> sentencia_1</em><em>; sentencia_2</em>; ...<em> sentencia_n</em>; }
+</pre>
+
+<dl>
+ <dt><code>sentencia_1</code>, <code>sentencia_2</code>, <code>sentencia_n</code></dt>
+ <dd>Sentencias agrupadas dentro de una sentencia block.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Esta sentencia se utiliza comúnmente para controlar sentencias de flujo (es decir <code>if</code>, <code>for</code>, <code>while</code>). Por ejemplo:</p>
+
+<pre class="brush: js">while (x &lt; 10) {
+   x++;
+}
+</pre>
+
+<p><font><font>Las variables declaradas con </font></font><code>var</code> <strong><font><font>no</font></font></strong><font><font> tienen alcance de bloque(</font></font>block scope<font><font>)</font></font>. Las variables introducidas dentro de un grupo block tienen el alcance de la función que lo contiene o del script, y los efectos de su asignación persisten más allá del grupo block en sí mismo. En otras palabras, las sentencias block no incluyen ningún alcance. Aunque los grupos block "en solitario" (standalone) son una sintaxis válida, usted no querrá utilizar grupos block en solitario en JavaScript, ya que ellos no hacen lo que parecen, si piensa que funcionan de manera similar a los bloques en C o Java. Por ejemplo:</p>
+
+<pre class="brush: js">var x = 1;
+{
+   var x = 2;
+}
+alert(x); // resultado 2
+</pre>
+
+<p>Este obtiene el resultado 2 ya que la sentencia <code>var x</code> dentro del grupo block tiene el mismo alcance que la sentencia <code>var x</code> antes del mismo. En C o Java, el código equivalente tendría como resultado 1.</p>
+
+<h4 id="Con_let_y_const"><font><font>Con </font></font><code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/let">let</a> </code><font><font>y </font></font><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/const">const</a></h4>
+
+<p>Por el contrario, las variables declaradas con <code>let</code> y <code>const</code> tienen alcance de bloque.</p>
+
+<pre><code>let x = 1;
+{
+  let x = 2;
+}
+console.log(x); // logs 1</code>
+</pre>
+
+<p><font><font>El alcance </font></font><code>x = 2</code><font><font> es limitado solamente al bloque en el que está definido.</font></font></p>
+
+<p><font><font>Lo mismo para  </font></font><code>const</code><font><font>:</font></font></p>
+
+<pre><code>const c = 1;
+{
+  const c = 2;
+}
+console.log(c); // logs 1 </code>y no lanza SyntaxError...
+</pre>
+
+<p>Tenga en cuenta que la variable  <code>const c = 2 con alcance de bloque, </code><strong><em>no</em> lanza</strong> un  <code>SyntaxError: </code>El identificador 'c' ya ha sido declarado. Esto es porque <strong>se puede declarar de forma única</strong> dentro del bloque, sin interferir con la otra que tiene un  alcance global.</p>
+
+<h4 id="Con_function"><font><font>Con </font></font><code>function</code></h4>
+
+<p>La <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function">declaración de una función</a> también tiene un alcance limitado dentro del bloque donde se produce la declaración:</p>
+
+<pre class="brush: js">nacion('frances');  // TypeError: nacion no es una función
+{
+  function nacion(nacionalidad) {
+   console.log('Yo soy ' + nacionalidad);
+  }
+nacion('español'); // correcto. logs Yo soy español
+}</pre>
+
+<p> </p>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/while", "while")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/break/index.html b/files/es/web/javascript/reference/statements/break/index.html
new file mode 100644
index 0000000000..26d2b95506
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/break/index.html
@@ -0,0 +1,42 @@
+---
+title: break
+slug: Web/JavaScript/Reference/Statements/break
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/break
+original_slug: Web/JavaScript/Referencia/Sentencias/break
+---
+<div>
+ {{jsSidebar("Statements")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Termina el bucle actual, sentecia switch o label y transfiere el control del programa a la siguiente sentencia a la sentecia de terminación de éstos elementos.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox">break [<em>etiqueta</em>];</pre>
+<dl>
+ <dt>
+  <code>etiqueta</code></dt>
+ <dd>
+  Identificador asociado con la etiqueta de la sentencia.</dd>
+</dl>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>La sentencia <code>break</code> incluye una etiqueta opcional que permite al programa salir de una sentencia etiquetada. La sentencia <code>break</code> necesita estar anidada dentro de la sentencia etiquetada. La sentencia etiquetada puede ser cualquier tipo de sentencia; no tiene que ser una sentencia de bucle.</p>
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+<h4 id="Ejemplo:_Usando_break" name="Ejemplo:_Usando_break">Ejemplo: Usando <code>break</code></h4>
+<p>La siguiente función tiene una sentencia que termina el bucle {{jsxref("Sentencias/while", "while")}} cuando <code>i</code> es 3, y entonces devuelve el valor 3 * <code>x</code>.</p>
+<pre class="brush: js">function comprobarBreak(x) {
+   var i = 0;
+   while (i &lt; 6) {
+      if (i == 3)
+         break;
+      i++;
+   }
+   return i * x;
+}
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("Sentencias/continue", "continue")}}</li>
+ <li>{{jsxref("Sentencias/label", "label")}}</li>
+ <li>{{jsxref("Sentencias/switch", "switch")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/class/index.html b/files/es/web/javascript/reference/statements/class/index.html
new file mode 100644
index 0000000000..107c0ab32c
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/class/index.html
@@ -0,0 +1,149 @@
+---
+title: class
+slug: Web/JavaScript/Reference/Statements/class
+translation_of: Web/JavaScript/Reference/Statements/class
+original_slug: Web/JavaScript/Referencia/Sentencias/class
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La<strong> declaración class</strong> crea una nueva clase con el nombre proporcionado utilizando la herencia basada en prototipos</p>
+
+<div class="noinclude">
+<p>También se puede definir una clase usando una {{jsxref("Operators/class", "expresión de clase", "", 1)}}. Pero a diferencia de las expresiones de clases, la declaración de clases no permite que una clase existente sea declarada de nuevo y en caso de hacerse, lanzará un error de tipo.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: js">class <em>name</em> [extends] {
+  // Contenido de la clase
+}
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>De la misma manera que con las expresiones de clase, el contenido de una clase se ejecuta en <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode">modo estricto</a>.</p>
+
+<p>Las declaraciones de clases no están {{Glossary("Hoisting", "izadas")}} (al contrario que las <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function">declaraciones de funciones</a>).</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Declaración_sencilla_de_una_clase">Declaración sencilla de una clase</h3>
+
+<p>En el siguiente ejemplo, primero definimos la clase <code>Polygon</code>, luego extendemos de ella para crear la clase <code>Square</code>. Notar que <code>super()</code>, utilizado en el constructor, sólo puede ser llamado dentro del constructor y debe ser llamado antes de que la palabra clave <code>this</code> pueda ser usada.</p>
+
+<pre class="brush: js">class Polygon {
+  constructor(height, width) {
+    this.name = 'Polygon';
+    this.height = height;
+    this.width = width;
+  }
+}
+
+class Square extends Polygon {
+  constructor(length) {
+    super(length, length);
+    this.name = 'Square';
+  }
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-class-definitions', 'Class definitions')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>{{CompatGeckoDesktop(45)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Array subclassing</td>
+   <td>{{CompatChrome(43.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome para Android</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(42.0)}}</td>
+   <td>{{CompatGeckoMobile(45)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(42.0)}}</td>
+  </tr>
+  <tr>
+   <td>Array subclassing</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(43.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function"><code>declaración de funciones</code></a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/class"><code>expresión de clases</code></a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Clases</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/const/index.html b/files/es/web/javascript/reference/statements/const/index.html
new file mode 100644
index 0000000000..df3cc4a028
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/const/index.html
@@ -0,0 +1,128 @@
+---
+title: const
+slug: Web/JavaScript/Reference/Statements/const
+tags:
+  - ECMAScript6
+  - Experimental
+  - Expérimental(2)
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/const
+original_slug: Web/JavaScript/Referencia/Sentencias/const
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<h2 id="Resumen">Resumen</h2>
+
+<p>Las variables constantes presentan un <strong>ámbito de bloque </strong><font><font>(</font></font><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/block">block </a>scope<font><font>)</font></font> tal y como lo hacen las variables definidas usando la instrucción <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/let">let</a>, con la particularidad de que el valor de una constante no puede cambiarse a través de la reasignación. Las constantes <u>no se pueden redeclarar</u>.</p>
+
+<div class="warning">
+<p>La <strong>redeclaración</strong> de la misma variable bajo un mismo <font><font><a href="https://www.ecma-international.org/ecma-262/6.0/#sec-lexical-environments" rel="noopener">ámbito léxico</a></font></font> terminaría en un error de tipo <code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError" title="SyntaxError">SyntaxError</a></code>. Esto también es <strong>extensible</strong> si usamos <code>var</code> dentro del <font><font>ámbito léxico</font></font>. Esto nos salvaguarda de redeclarar una variable accidentalmente y que no era posible  solo con <code>var.</code></p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">const <em>varname1 = <em>value1 [</em>, <em>varname2</em> = <em>value2 [</em>, <em>varname3</em> = <em>value3 [</em>, ... [</em>, <em>varnameN</em> = <em>valueN]]]]</em>;</pre>
+
+<dl>
+ <dt><code>varnameN</code></dt>
+ <dd>Nombre de la constante. Puede ser un identificador legal.</dd>
+</dl>
+
+<dl>
+ <dt><code>valueN</code></dt>
+ <dd>Valor de la constante. Puede ser cualquier expresión legal.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Esta declaración crea una constante cuyo alcance puede ser <strong>global o local para el bloque en el que se declara</strong>. Es necesario <strong>inicializar</strong> la constante, es decir, se debe especificar su valor en la misma sentencia en la que se declara, lo que tiene sentido, dado que no se puede cambiar posteriormente.</p>
+
+<p>La declaración de una constante crea una referencia de sólo lectura. No significa que el valor que tiene sea inmutable, sino que el identificador de variable no puede ser reasignado, por lo tanto, en el caso de que la asignación a la constante sea un objeto, el objeto sí que puede ser alterado.</p>
+
+<p>Una constante <strong>no puede compartir su nombre</strong> con una función o variable en el mismo ámbito.</p>
+
+<p><font><font>Todas las consideraciones acerca de la " <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/let#muerta">zona muerta temporal</a> " se aplican tanto a </font></font><code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let">let</a></code><font><font>y</font></font><code>const</code><font><font>.</font></font></p>
+
+<div class="warning">
+<p><code>const</code> <s>es </s><u>fue</u> una <strong>extensión especifica de Mozilla</strong>, no <s>es</s> <u>era</u> soportado en IE, pero <s>tiene</s> <u>tenia</u> soporte parcial por Opera desde la versión 9.0 y por Safari.</p>
+</div>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente ejemplo produce una salida <code>"a es 7."</code></p>
+
+<pre class="brush: js">const a = 7;
+document.writeln("a es " + a + ".");
+</pre>
+
+<p>Las siguientes instrucciones demuestra como se comporta <code>const</code></p>
+
+<div class="warning">
+<p>Las instrucciones deberán ser ordenadas correctamente para conseguir la salida esperada a los ejemplos</p>
+</div>
+
+<pre class="brush: js">// NOTA: Las constantes pueden ser declaradas en mayusculas o minusculaas,
+//pero por convencion para distinguirlas del resto de variables se escribe todo en mayusculas
+
+// definimos MY_FAV como constante y le damos un valor de 7
+const MY_FAV = 7;
+
+// lanzara un error: Unkeught TypeError: Asignación a variable constante.
+MY_FAV = 20;
+
+// imprimira 7
+console.log('my favorite number is: ' + MY_FAV);
+
+// lanzara un error: SyntaxError: tratando de redeclarar una constante. El identificador 'MY_FAV' ya ha sido declarado
+const MY_FAV = 20;
+
+// el nombre MY_FAV esta reservado para la constante anterior, también fallara y lanzara un SyntaxError por la redeclaración
+var MY_FAV = 20;
+
+// el nombre MY_FAV esta reservado para la variable anterior, esto también lanzara un SyntaxError por la redeclaración
+let MY_FAV = 20;
+
+// es importante tener en cuenta como funciona el alcance de bloque
+if (MY_FAV === 7) {
+    // esto esta bien y crea una variable MY_FAV de alcance/ambito de bloque
+    // (funciona igual de bien con let para declarar un alcance de bloque/ambito de variable no-constante)
+    const MY_FAV = 20;
+
+    // MY_FAV ahora es 20
+    console.log('my favorite number is ' + MY_FAV);
+
+    // aquín también lanzara un SyntaxError por la redeclaración
+    var MY_FAV = 20;
+}
+
+// MY_FAV todavia es 7
+console.log('my favorite number is ' + MY_FAV);
+
+// lanza error, falta el inicializador en la declaracion de const
+const FOO;
+
+// const tambien funciona en objetos
+const MY_OBJECT = {'key': 'value'};
+
+// Intentando sobrescribir el objeto nos lanza un error
+MY_OBJECT = {'OTHER_KEY': 'value'};
+
+// Sin embargo, los object keys no estan protegidas,
+// por lo que la siguiente sentencia se ejecutara sin problema
+MY_OBJECT.key = 'otherValue'; // Use Object.freeze() para hacer un objeto inmutable
+
+// Lo mismo se aplica a los arrays
+const MY_ARRAY = [];
+// es posible empujar elementos en el array
+MY_ARRAY.push('A'); // ["A"]
+// Sin embargo, asignar un nuevo array a la variable lanza error
+MY_ARRAY = ['B']</pre>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/var", "var")}}</li>
+ <li>{{jsxref("Sentencias/let", "let")}}</li>
+ <li><a href="/en/JavaScript/Guide/Values,_Variables,_and_Literals#Constants" title="en/JavaScript/Guide/Values, Variables, and Literals#Constants">Constants in JavaScript Guide</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/continue/index.html b/files/es/web/javascript/reference/statements/continue/index.html
new file mode 100644
index 0000000000..b05ade9113
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/continue/index.html
@@ -0,0 +1,67 @@
+---
+title: continue
+slug: Web/JavaScript/Reference/Statements/continue
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/continue
+original_slug: Web/JavaScript/Referencia/Sentencias/continue
+---
+<div>
+ {{jsSidebar("Statements")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Termina la ejecución de las sentencias de la iteración actual del bucle actual o la etiqueta y continua la ejecución del bucle con la próxima iteración.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox">continue [ <em>etiqueta</em> ];</pre>
+<dl>
+ <dt>
+  <code>label</code></dt>
+ <dd>
+  Identificador asociado con la etiqueta de la sentencia.</dd>
+</dl>
+<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
+<p>En contraste con la sentencia {{jsxref("Sentencias/break", "break")}}, <code>continue</code> no termina la ejecución del bucle por completo; en cambio,</p>
+<ul>
+ <li>En un bucle {{jsxref("Sentencias/while", "while")}}, salta de regreso a la condición.</li>
+</ul>
+<ul>
+ <li>En un bucle {{jsxref("Sentencias/for", "for")}}, salta a la expresión actualizada.</li>
+</ul>
+<p>La sentencia <code>continue</code> puede incluir una etiqueta opcional que permite al programa saltar a la siguiente iteración del bucle etiquetado en vez del bucle actual. En este caso, la sentencia <code>continue</code> necesita estar anidada dentro de esta sentecia etiquetada.</p>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<h3 id="Ejemplo:_Usando_continue_con_while" name="Ejemplo:_Usando_continue_con_while">Ejemplo: Usando <code>continue</code> con <code>while</code></h3>
+<p>El siguiente ejemplo muestra un bucle {{jsxref("Sentencias/while", "while")}} que tiene una sentencia <code>continue</code> que se ejecuta cuando el valor de <code>i</code> es 3. Así, <code>n</code> toma los valores 1, 3, 7 y 12.</p>
+<pre class="brush: js">i = 0;
+n = 0;
+while (i &lt; 5) {
+   i++;
+   if (i == 3)
+      continue;
+   n += i;
+}
+</pre>
+<h3 id="Ejemplo:_Usando_continue_con_una_etiqueta" name="Ejemplo:_Usando_continue_con_una_etiqueta">Ejemplo: Usando <code>continue</code> con una etiqueta</h3>
+<p>En el siguiente ejemplo, una sentencia etiquetada <code>checkiandj</code> contiene una sentencia etiquetada <code>checkj</code>. Si se encuentra <code>continue</code>, el programa continua hasta encima de la sentencia <code>checkj</code>. Cada vez que se encuentra <code>continue</code>, <code>checkj</code> se reitera hasta que su condición devuelve false. Cuando se devuelve false, el recordatorio de la sentencia <code>checkiandj</code> se completa.</p>
+<p>Si <code>continue</code> tuviese una etiqueta <code>checkiandj</code>, el programa continuaría hasta encima de la sentencia <code>checkiandj</code>.</p>
+<pre>checkiandj:
+while (i &lt; 4) {
+   document.write(i + "&lt;br&gt;");
+   i += 1;
+
+   checkj:
+   while (j &gt; 4) {
+      document.write(j + "&lt;br&gt;");
+      j -= 1;
+      if ((j % 2) == 0)
+         continue checkj;
+      document.write(j + " is odd.&lt;br&gt;");
+   }
+   document.write("i = " + i + "&lt;br&gt;");
+   document.write("j = " + j + "&lt;br&gt;");
+}
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("Sentencias/break", "break")}}</li>
+ <li>{{jsxref("Sentencias/label", "label")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/debugger/index.html b/files/es/web/javascript/reference/statements/debugger/index.html
new file mode 100644
index 0000000000..2560e7d99c
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/debugger/index.html
@@ -0,0 +1,126 @@
+---
+title: debugger
+slug: Web/JavaScript/Reference/Statements/debugger
+tags:
+  - JavaScript
+  - Sentencia
+translation_of: Web/JavaScript/Reference/Statements/debugger
+original_slug: Web/JavaScript/Referencia/Sentencias/debugger
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La sentencia <strong>debugger</strong> invoca cualquier funcionalidad de depuración disponible, tiene la misma función que un breakpoint. Si la funcionalidad de depuración no está disponible, esta sentencia no tiene efecto alguno.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox"><code>debugger;</code></pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente ejemplo muestra un bloque de código donde ha sido insertada una sentencia debugger, para invocar el depurador (si existe) cuando la función es ejecutada.</p>
+
+<pre class="brush:js">function codigoPotencialmenteDefectuoso() {
+    debugger;
+    // realizar paso a paso o examinar código que contiene
+    // potenciales errores
+}</pre>
+
+<p>Cuando el depurador es invocado, la ejecución se detiene en la sentencia debugger. Es como un punto de interrupción en el script.</p>
+
+<p><a href="https://mdn.mozillademos.org/files/6963/Screen Shot 2014-02-07 at 9.14.35 AM.png"><img alt="Paused at a debugger statement." src="https://mdn.mozillademos.org/files/6963/Screen%20Shot%202014-02-07%20at%209.14.35%20AM.png" style="height: 371px; width: 700px;"></a></p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-debugger-statement', 'Debugger statement')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-debugger-statement', 'Debugger statement')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-12.15', 'Debugger statement')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3', '#sec-7.5.3', 'Debugger statement')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-7.4.3', 'Debugger statement')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Solo mencionada como palabra reservada</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Debugging_JavaScript">Debugging JavaScript</a></li>
+ <li><a href="/en-US/docs/Tools/Debugger">The Debugger in the Firefox Developer Tools</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/do...while/index.html b/files/es/web/javascript/reference/statements/do...while/index.html
new file mode 100644
index 0000000000..6143268407
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/do...while/index.html
@@ -0,0 +1,50 @@
+---
+title: do...while
+slug: Web/JavaScript/Reference/Statements/do...while
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/do...while
+original_slug: Web/JavaScript/Referencia/Sentencias/do...while
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La sentencia (hacer mientras) crea un bucle que ejecuta una sentencia especificada, hasta que la condición de comprobación se evalúa como falsa. La condición se evalúa después de ejecutar la sentencia, dando como resultado que la sentencia especificada se ejecute al menos una vez.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-dowhile.html")}}</div>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">do
+   <em>sentencia</em>
+while (<em>condición</em>);
+</pre>
+
+<dl>
+ <dt><code>sentencia</code></dt>
+ <dd>Una sentencia que se ejecuta al menos una vez y es reejecutada cada vez que la condición se evalúa a verdadera. Para ejecutar múltiples sentencias dentro de un bucle, utilice la sentencia {{jsxref("Statements/block", "block")}} (<code>{ ... }</code>) para agrupar aquellas sentencias.</dd>
+</dl>
+
+<dl>
+ <dt><code>condición</code></dt>
+ <dd>Una expresión se evalúa después de cada pase del bucle. Si <code>condición</code> se evalúa como verdadera, la <code>sentencia</code> se re-ejecuta. Cuando <code>condición</code> se evalúa como falsa, el control pasa a la siguiente sentencia hacer mientras.</dd>
+</dl>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_Usando_do...while" name="Ejemplo:_Usando_do...while">Usando <code>hacer mientras</code></h3>
+
+<p>En el siguiente ejemplo, el bucle hacer mientras itera al menos una vez y se reitera hasta que <code>i</code> ya no sea menor que 5.</p>
+
+<pre class="brush: js">do {
+   i += 1;
+   document.write(i);
+} while (i &lt; 5);
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/while", "while")}}</li>
+ <li>{{jsxref("Sentencias/for", "for")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/empty/index.html b/files/es/web/javascript/reference/statements/empty/index.html
new file mode 100644
index 0000000000..d35f3ba504
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/empty/index.html
@@ -0,0 +1,142 @@
+---
+title: empty
+slug: Web/JavaScript/Reference/Statements/Empty
+tags:
+  - JavaScript
+  - Sentencia
+  - Vacía
+translation_of: Web/JavaScript/Reference/Statements/Empty
+original_slug: Web/JavaScript/Referencia/Sentencias/Empty
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>Un <strong>empty statement</strong> o sentencia vacía es usada para no proveer una sentencia, incluso si la sintaxis JavaScript esperase una.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">;
+</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La sentencia vacía es un punto y coma (;) que indica que no se ejecutará ninguna sentencia, incluso si la sintaxis JavaScript requiere una. El comportamiento opuesto, donde se desean ejecutar varias sentencias pero JavaScript solo permite una sola, es posible usando una <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/block">sentencia de bloque</a>; la cual combina varias declaraciones en una.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>La sentencia vacía es comúnmente usada en bucles. Por ejemplo, un bucle for sin bloque de sentencias:</p>
+
+<pre class="brush: js">var arr = [1, 2, 3];
+
+// Asignar el valor 0 a todos los elementos del array
+for (i = 0; i &lt; arr.length; arr[i++] = 0) /* sentencia vacía */ ;
+
+console.log(arr);
+// [0, 0, 0]
+</pre>
+
+<p><strong>Nota:</strong> Es una buena práctica comentar el uso intencional de la sentencia vacía, ya que no es fácilmente distinguible de un punto y coma normal. Un ejemplo de uso probablemente no intencional:</p>
+
+<pre class="brush: js">if (condicion);  // Esta condición no ejerce ningún control!
+   borrarTodo()  // Por lo cual esta sentencia será ejecutada siempre!!!
+</pre>
+
+<p>Otro ejemplo de uso:</p>
+
+<pre class="brush: js">var a = 1, b = 1;
+if((a == 0) || (b = 0)); // Asigna a '<code>b'</code> el valor cero si '<code>a'</code> no es cero.
+console.log(b); // 0</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-empty-statement', 'Empty statement')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-empty-statement', 'Empty statement')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-12.3', 'Empty statement')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3', '#sec-12.3', 'Empty statement')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-12.3', 'Empty statement')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/block", "Sentencia de bloque")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/export/index.html b/files/es/web/javascript/reference/statements/export/index.html
new file mode 100644
index 0000000000..35df1733fc
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/export/index.html
@@ -0,0 +1,176 @@
+---
+title: export
+slug: Web/JavaScript/Reference/Statements/export
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Módulos
+  - Sentencia
+  - export
+translation_of: Web/JavaScript/Reference/Statements/export
+original_slug: Web/JavaScript/Referencia/Sentencias/export
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La declaración <strong><code>export</code></strong> se utiliza al crear módulos de JavaScript para exportar funciones, objetos o tipos de dato primitivos del módulo para que puedan ser utilizados por otros programas con la sentencia {{jsxref("Statements/import", "import")}}.</p>
+
+<p>Los módulos exportados están en {{jsxref("Strict_mode","strict mode")}} tanto si se declaran así como si no. La sentencia export no puede ser utilizada en scripts embebidos.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="brush: js">export { <var>name1</var>, <var>name2</var>, …, <var>nameN</var> };
+export { <var>variable1</var> as <var>name1</var>, <var>variable2</var> as <var>name2</var>, …, <var>nameN</var> };
+export let <var>name1</var>, <var>name2</var>, …, <var>nameN</var>; // también var
+export let <var>name1</var> = …, <var>name2</var> = …, …, <var>nameN</var>; // también var, const
+export function FunctionName(){...}
+export class ClassName {...}
+
+export default <em>expression</em>;
+export default function (…) { … } // también class, function*
+export default function name1(…) { … } // también class, function*
+export { <var>name1</var> as default, … };
+
+export * from …;
+export { <var>name1</var>, <var>name2</var>, …, <var>nameN</var> } from …;
+export { <var>import1</var> as <var>name1</var>, <var>import2</var> as <var>name2</var>, …, <var>nameN</var> } from …;
+export { default } from …;
+</pre>
+
+<dl>
+ <dt><code>nameN</code></dt>
+ <dd>Identificador a ser exportado (es posible importarlo a través de {{jsxref("Statements/import", "import")}} en otro script).</dd>
+</dl>
+
+<h2 id="Descripción" name="Descripción">Descripción</h2>
+
+<p>Existen dos tipos diferentes de exportación , <strong>nombrada</strong> y <strong>por defecto</strong>. Se pueden tener varias exportaciones nombradas por módulo pero sólo una exportación por defecto. Cada tipo corresponde a una de las sintaxis siguientes:</p>
+
+<ul>
+ <li>Exports con nombre:
+  <pre class="brush: js">// exporta la función previamente declarada
+export { myFunction };
+
+// exporta una constante
+export const foo = Math.sqrt(2);</pre>
+ </li>
+ <li>Exports por defecto (function):
+  <pre class="brush: js">export default function() {} </pre>
+ </li>
+ <li>Exports por defecto (class):
+  <pre class="brush: js">export default class {} </pre>
+ </li>
+</ul>
+
+<p>Los export con nombre son útiles cuando se necesitan exportar múltiples valores. Durante el import, es obligatorio usar el mismo nombre que el correspondiente objeto.</p>
+
+<p>Pero un export por defecto puede ser importado con cualquier nombre, por ejemplo:</p>
+
+<pre class="brush: js">export default k = 12; // en el archivo test.js
+
+import m from './test' // notese que tenemos la libertad de usar import m en lugar de import k, porque k era el export por defecto
+
+console.log(m); // escribirá 12</pre>
+
+<p>Sólo puede haber un export por defecto.</p>
+
+<p>La siguiente sintaxis no exporta un export por defecto del módulo importado:</p>
+
+<pre class="brush: js">export * from …;</pre>
+
+<p>Si necesita exportar por defecto, escriba lo siguiente en su lugar:</p>
+
+<pre class="brush: js">import mod from 'mod';
+export default mod;</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Syntax" name="Syntax">Usando exports con nombre</h3>
+
+<p>En el módulo, podremos usar el siguiente código:</p>
+
+<pre class="brush: js">// module "my-module.js"
+function cube(x) {
+  return x * x * x;
+}
+const foo = Math.PI + Math.SQRT2;
+var graph = {
+    options:{
+        color:'white',
+        thickness:'2px'
+    },
+    draw: function(){
+        console.log('From graph draw function');
+    }
+}
+export { cube, foo, graph };</pre>
+
+<p>De esta forma, en otro script, podemos tener:</p>
+
+<pre class="brush: js">//You should use this script in html with the type module ,
+//eg ''&lt;script type="module" src="demo.js"&gt;&lt;/script&gt;",
+//open the page in a httpserver,otherwise there will be a CORS policy error.
+//script demo.js
+
+import { cube, foo, graph } from 'my-module';
+graph.options = {
+    color:'blue',
+    thickness:'3px'
+};
+graph.draw();
+console.log(cube(3)); // 27
+console.log(foo);    // 4.555806215962888
+</pre>
+
+<h3 id="Usando_el_export_por_defecto">Usando el export por defecto</h3>
+
+<p>Si queremos exportar un sólo valor o tener uno por defecto para nuestro módulo, podemos usar un export por defecto:</p>
+
+<pre class="brush: js">// module "my-module.js"
+export default function cube(x) {
+  return x * x * x;
+}
+</pre>
+
+<p>De esta forma la importación de un export default será sumamemte sencilla:</p>
+
+<pre class="brush: js">import cube from 'my-module';
+console.log(cube(3)); // 27</pre>
+
+<p>Tenga en cuenta que no es posible usar <code>var</code>, <code>let</code> o <code>const</code> con <code>export default</code>.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-exports', 'Exports')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-exports', 'Exports')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatiblidad_en_navegadores">Compatiblidad en navegadores</h2>
+
+<p>{{Compat("javascript.statements.export")}}</p>
+
+<h2 id="Vea también" name="Vea también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/import", "import")}}</li>
+ <li><a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a>, publicación del blog de Hacks por Jason Orendorff</li>
+ <li><a href="https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/">ES modules: A cartoon deep-dive</a>, publicación del blog de Hacks por Lin Clark</li>
+ <li><a href="http://exploringjs.com/es6/ch_modules.html">Libro de Axel Rauschmayer: "Exploring JS: Modules"</a></li>
+</ul>
+
+<p> </p>
diff --git a/files/es/web/javascript/reference/statements/for-await...of/index.html b/files/es/web/javascript/reference/statements/for-await...of/index.html
new file mode 100644
index 0000000000..5ae8a306f3
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/for-await...of/index.html
@@ -0,0 +1,145 @@
+---
+title: for await...of
+slug: Web/JavaScript/Reference/Statements/for-await...of
+tags:
+  - Iteración
+  - JavaScript
+  - Referencia
+  - Sentencia
+  - asincrónico
+  - await
+  - iterar
+translation_of: Web/JavaScript/Reference/Statements/for-await...of
+original_slug: Web/JavaScript/Referencia/Sentencias/for-await...of
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La <strong>sentencia</strong> <strong><code>for await...of</code> </strong>crea un bucle iterando tanto sobre objetos iterables asincrónicos como sincrónicos, incluyendo: built-in {{jsxref("String")}}, {{jsxref("Array")}}, objetos <code>Array</code>-like (por ej., {{jsxref("Functions/arguments", "arguments")}} o {{domxref("NodeList")}}), {{jsxref("TypedArray")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, y async/sync iterables definidos por el usuario. Invoca un hook de iteración personalizada con sentencias a ser ejecutadas por el valor de cada propiedad diferente del objeto.</p>
+
+<p class="hidden">El código fuente de este ejemplo interactivo está almacenado en un repositorio Github. Si te gustaría contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull request.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">for await (<em>variable</em> of <em>iterable</em>) {
+  <em>sentencia
+</em>}
+</pre>
+
+<dl>
+ <dt><code>variable</code></dt>
+ <dd>En cada iteración, el valor de una propiedad diferente es asignado a <em>variable</em>. <em>variable</em> puede ser declarada con <code>const</code>, <code>let</code>, o <code>var</code>.</dd>
+ <dt><code>iterable</code></dt>
+ <dd>Objeto sobre cuyas propiedades se itera.</dd>
+</dl>
+
+<h3 id="Iterando_sobre_iterables_asincrónicos">Iterando sobre iterables asincrónicos</h3>
+
+<p>También puedes iterar sobre un objeto que explícitamente implementa el protocolo async iterable:</p>
+
+<pre class="brush:js">var asyncIterable = {
+  [Symbol.asyncIterator]() {
+    return {
+      i: 0,
+      next() {
+        if (this.i &lt; 3) {
+          return Promise.resolve({ value: this.i++, done: false });
+        }
+
+        return Promise.resolve({ done: true });
+      }
+    };
+  }
+};
+
+(async function() {
+   for await (let num of asyncIterable) {
+     console.log(num);
+   }
+})();
+
+// 0
+// 1
+// 2
+</pre>
+
+<h3 id="Iterando_sobre_funciones_generadoras_asincrónicas">Iterando sobre funciones generadoras asincrónicas</h3>
+
+<p>Debido a que las funciones generadoras asincrónicas implementan el protocolo async iterator, las mismas pueden ser iteradas utilizando <code>for await... of</code></p>
+
+<pre class="brush: js">async function* asyncGenerator() {
+  var i = 0;
+  while (i &lt; 3) {
+    yield i++;
+  }
+}
+
+(async function() {
+  for await (let num of asyncGenerator()) {
+    console.log(num);
+  }
+})();
+// 0
+// 1
+// 2</pre>
+
+<p>Para un ejemplo más concreto de iteración sobre una función generadora utilizando <code>for await... of</code>, considera iterar sobre datos provistos por una API. Este ejemplo primero crea un iterador asincrónico para un stream de datos, luego lo utiliza para obtener el tamaño de la respuesta desde la API.</p>
+
+<pre class="brush: js">async function* streamAsyncIterator(stream) {
+  const reader = stream.getReader();
+  try {
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) {
+        return;
+      }
+      yield value;
+    }
+  } finally {
+    reader.releaseLock();
+  }
+}
+// Obtiene datos desde url y calcula el tamaño de la respuesta utilizando la función generadora asincrónica.
+async function getResponseSize(url) {
+  const response = await fetch(url);
+  // Almacenará el tamaño de la respuesta en bytes.
+  let responseSize = 0;
+  // El buble for-await-of. Itera asincrónicamente sobre cada parte de la respuesta.
+  for await (const chunk of streamAsyncIterator(response.body)) {
+    // Incrementando el tamaño total.
+    responseSize += chunk.length;
+  }
+
+  console.log(`Tamaño de la respuesta: ${responseSize} bytes`);
+  // salida esperada: "Tamaño de la respuesta: 1071472"
+  return responseSize;
+}
+getResponseSize('https://jsonplaceholder.typicode.com/photos');</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'ECMAScript Language: The for-in, for-of, and for-await-of Statements')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
+
+<div class="hidden">La tabla de compatiblidad de esta página es generada a partir de datos estructurados. Si te gustaría contribuir a estos datos, por favor clona <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</div>
+
+<p>{{Compat("javascript.statements.for_await_of")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Statements/for...of")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/for...in/index.html b/files/es/web/javascript/reference/statements/for...in/index.html
new file mode 100644
index 0000000000..706e6b6be6
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/for...in/index.html
@@ -0,0 +1,151 @@
+---
+title: for...in
+slug: Web/JavaScript/Reference/Statements/for...in
+tags:
+  - Característica del lenguaje
+  - Declaración
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Statements/for...in
+original_slug: Web/JavaScript/Referencia/Sentencias/for...in
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La instrucción {{JSxRef("Sentencias/for...in", "for-in")}} itera sobre todas las {{JSxRef("../Enumerability_and_ownership_of_properties", "propiedades enumerables")}} de un objeto que está codificado por cadenas (ignorando los codificados por {{JSxRef("Objetos_globales/Symbol", "Símbolos")}}, incluidas las propiedades enumerables heredadas.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-forin.html")}}</div>
+
+<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">for (<var>variable</var> in <var>objeto</var>)
+  instrucción</pre>
+
+<dl>
+ <dt><code>variable</code></dt>
+ <dd>Asigna un nombre de propiedad diferente a la <em>variable</em> en cada iteración.</dd>
+ <dt><code>objeto</code></dt>
+ <dd>Objeto cuyas propiedades enumerables que no son símbolos se iteran.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Un bucle <code>for...in</code> solo itera sobre propiedades enumerables que no son símbolo. Los objetos creados a partir de constructores integrados como <code>Array</code> y <code>Object</code> han heredado propiedades no enumerables de <code>Object.prototype</code> y <code>String.prototype</code>, como el método {{JSxRef("String.indexOf", "indexOf()")}} de {{JSxRef("String")}} o el método {{JSxRef("Object.toString", "toString()")}} de {{JSxRef("Object")}}. El bucle iterará sobre todas las propiedades enumerables del objeto en sí y aquellas que el objeto hereda de su cadena de prototipos (las propiedades de los prototipos más cercanos tienen prioridad sobre las de los prototipos más alejados del objeto en su cadena de prototipos).</p>
+
+<h3 id="Propiedades_deleted_added_o_modified">Propiedades <code>deleted</code>, <code>added</code> o <code>modified</code></h3>
+
+<p>Un bucle <code>for...in</code> itera sobre las propiedades de un objeto en un orden arbitrario (consulta el operador {{JSxRef("Operadores/delete", "delete")}} para obtener más información sobre por qué no puede depender del aparente orden de la iteración, al menos en una configuración entre navegadores).</p>
+
+<p>Si una propiedad se modifica en una iteración y luego se visita en un momento posterior, su valor en el bucle es su valor en ese momento posterior. Una propiedad que se elimina antes de haber sido visitada no se visitará más tarde. Las propiedades agregadas al objeto sobre el que se está produciendo la iteración se pueden visitar u omitir de la iteración.</p>
+
+<p>En general, es mejor no agregar, modificar o eliminar propiedades del objeto durante la iteración, aparte de la propiedad que se está visitando actualmente. No hay garantía de si se visitará una propiedad agregada, si se visitará una propiedad modificada (distinta de la actual) antes o después de que se modifique, o si se visitará una propiedad eliminada antes de eliminarla.</p>
+
+<h3 id="Iteración_en_arreglos_y_for...in">Iteración en arreglos y <code>for</code>...<code>in</code></h3>
+
+<div class="note">
+<p><strong>Nota</strong>: <code>for...in</code> no se debe usar para iterar sobre un {{JSxRef("Array")}} donde el orden del índice es importante.</p>
+</div>
+
+<p>Los índices del arreglo son solo propiedades enumerables con nombres enteros y, por lo demás, son idénticos a las propiedades generales del objeto. No hay garantía de que <code>for...in</code> devuelva los índices en un orden en particular. La instrucción de bucle <code>for...in</code> devolverá todas las propiedades enumerables, incluidas aquellas con nombres no enteros y aquellas que se heredan.</p>
+
+<p>Debido a que el orden de iteración depende de la implementación, es posible que la iteración sobre un arreglo no visite los elementos en un orden coherente. Por lo tanto, es mejor usar un bucle {{JSxRef("Sentencias/for", "for")}} con un índice numérico (o {{JSxRef("Array.prototype.forEach()")}} o el bucle {{JSxRef("Sentencias/for...of", "for...of")}}) cuando se itera sobre arreglos donde el orden de acceso es importante.</p>
+
+<h3 id="Iterar_solo_sobre_propiedades_directas">Iterar solo sobre propiedades directas</h3>
+
+<p>Si solo deseas considerar las propiedades adjuntas al objeto en sí mismo, y no sus prototipos, usa {{JSxRef("Object.getOwnPropertyNames", "getOwnPropertyNames()")}} o realiza una {{JSxRef("Object.prototype.hasOwnProperty", "hasOwnProperty()")}} verificación ({{jsxref("Object.prototype.propertyIsEnumerable", "propertyIsEnumerable()")}} también se puede utilizar). Alternativamente, si sabes que no habrá ninguna interferencia de código externo, puedes extender los prototipos incorporados con un método de verificación.</p>
+
+<h2 id="¿Por_qué_usar_for...in">¿Por qué usar <code>for</code>...<code>in</code>?</h2>
+
+<p>Dado que <code>for...in</code> está construido para iterar propiedades de objeto, no se recomienda su uso con arreglos y opciones como <code>Array.prototype.forEach()</code> y existe <code>for...of</code>, ¿cuál podría ser el uso de <code>for...in</code>?</p>
+
+<p>Es posible que se utilice de forma más práctica con fines de depuración, ya que es una forma fácil de comprobar las propiedades de un objeto (mediante la salida a la consola o de otro modo). Aunque los arreglos suelen ser más prácticos para almacenar datos, en situaciones en las que se prefiere un par clave-valor para trabajar con datos (con propiedades que actúan como la "clave"), puede haber casos en los que desees comprobar si alguna de esas claves cumple un valor particular.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Utilizar_for...in">Utilizar <code>for</code>...<code>in</code></h3>
+
+<p>El siguiente bucle <code>for...in</code> itera sobre todas las propiedades enumerables que no son símbolos del objeto y registra una cadena de los nombres de propiedad y sus valores.</p>
+
+<pre class="brush: js notranslate">var obj = {a: 1, b: 2, c: 3};
+
+for (const prop in obj) {
+  console.log(`obj.${prop} = ${obj[prop]}`);
+}
+
+// Produce:
+// "obj.a = 1"
+// "obj.b = 2"
+// "obj.c = 3"</pre>
+
+<h3 id="Iterar_propiedades_directas">Iterar propiedades directas</h3>
+
+<p>La siguiente función ilustra el uso de {{JSxRef("Object.prototype.hasOwnProperty", "hasOwnProperty()")}} — las propiedades heredadas no se muestran.</p>
+
+<pre class="brush: js notranslate">var triangle = {a: 1, b: 2, c: 3};
+
+function ColoredTriangle() {
+  this.color = 'red';
+}
+
+ColoredTriangle.prototype = triangle;
+
+var obj = new ColoredTriangle();
+
+for (const prop in obj) {
+  if (obj.hasOwnProperty(prop)) {
+    console.log(`obj.${prop} = ${obj[prop]}`);
+  }
+}
+
+// Produce:
+// "obj.color = red"
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'declaración for...in')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.statements.for_in")}}</p>
+
+<h3 id="Compatibilidad_expresiones_iniciadoras_en_modo_estricto">Compatibilidad: expresiones iniciadoras en modo estricto</h3>
+
+<p>Antes de Firefox 40, era posible utilizar una expresión iniciadora (<code>i=0</code>) en un bucle <code>for...in</code>:</p>
+
+<pre class="brush: js example-bad notranslate">var obj = {a: 1, b: 2, c: 3};
+for (var i = 0 in obj) {
+  console.log(obj[i]);
+}
+// 1
+// 2
+// 3
+</pre>
+
+<p>Este comportamiento no estándar ahora se ignora en la versión 40 y posteriores, y presentará un {{JSxRef("SyntaxError")}} ("{{JSxRef("errors/Invalid_for-in_initializer", "iniciador for...in no válido", "las declaraciones de encabezado del bucle for-in posiblemente no tengan iniciadores")}} en {{JSxRef("Strict_mode", "modo estricto")}} ({{bug(748550)}} y {{bug(1164741)}}").</p>
+
+<p>Otros motores como v8 (Chrome), Chakra (IE/Edge) y JSC (WebKit/Safari) están investigando si eliminar también el comportamiento no estándar.</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{JSxRef("Sentencias/for...of", "for...of")}} — una declaración similar que itera sobre la propiedad <code>values</code></li>
+ <li>{{JSxRef("Sentencias/for_each...in", "for each...in")}} — una declaración similar pero obsoleta que itera sobre los valores de las propiedades de un objeto, en lugar de los nombres de las propiedades en sí</li>
+ <li>{{JSxRef("Sentencias/for", "for")}}</li>
+ <li>{{JSxRef("../Guide/Iterators_and_Generators", "Expresiones generadoras")}} (usa la sintaxis <code>for...in</code>)</li>
+ <li>{{JSxRef("../Enumerability_and_ownership_of_properties", "Enumerabilidad y posesión de propiedades")}}</li>
+ <li>{{JSxRef("Object.getOwnPropertyNames()")}}</li>
+ <li>{{JSxRef("Object.prototype.hasOwnProperty()")}}</li>
+ <li>{{JSxRef("Array.prototype.forEach()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/for...of/index.html b/files/es/web/javascript/reference/statements/for...of/index.html
new file mode 100644
index 0000000000..f475243c91
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/for...of/index.html
@@ -0,0 +1,320 @@
+---
+title: for...of
+slug: Web/JavaScript/Reference/Statements/for...of
+tags:
+  - ECMAScript6
+  - JavaScript
+  - Referencia
+  - Sentencia
+translation_of: Web/JavaScript/Reference/Statements/for...of
+original_slug: Web/JavaScript/Referencia/Sentencias/for...of
+---
+<div>
+<div>{{jsSidebar("Statements")}}</div>
+
+<p><span style="font-size: 1rem; letter-spacing: -0.00278rem;">La sentencia </span><strong style="font-size: 1rem; letter-spacing: -0.00278rem;">sentencia <code>for...of</code></strong><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> ejecuta un bloque de código para cada elemento de un </span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/iterable" style="font-size: 1rem; letter-spacing: -0.00278rem;">objeto iterable</a>,<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> como lo son: {{jsxref("String")}}, {{jsxref("Array")}}, objetos similares a array (por ejemplo, {{jsxref("Functions/arguments", "arguments")}} or </span><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/NodeList" style="font-size: 1rem; letter-spacing: -0.00278rem;" title="NodeList objects are collections of nodes, usually returned by properties such as Node.childNodes and methods such as document.querySelectorAll()."><code>NodeList</code></a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">), {{jsxref("TypedArray")}}, {{jsxref("Map")}}, {{jsxref("Set")}} e iterables definidos por el usuario.</span></p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">for (<em>variable</em> of <em>iterable</em>) {
+  <em>statement
+</em>}
+</pre>
+
+<dl>
+ <dt><code>variable</code></dt>
+ <dd>En cada iteración el elemento (propiedad enumerable) correspondiente es asignado a <em>variable</em>. </dd>
+ <dt><code>iterable</code></dt>
+ <dd>Objeto cuyas propiedades enumerables son iteradas. </dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Iterando_un_jsxrefArray">Iterando un {{jsxref("Array")}}</h3>
+
+<pre class="brush: js">let iterable = [10, 20, 30];
+
+for (let value of iterable) {
+  value += 1;
+  console.log(value);
+}
+// 11
+// 21
+// 31
+</pre>
+
+<p>Es posible usar <code>const</code> en lugar de <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let">let</a> </code>si no se va a modificar la variable dentro del bloque.</p>
+
+<pre class="brush: js">let iterable = [10, 20, 30];
+
+for (const value of iterable) {
+  console.log(value);
+}
+// 10
+// 20
+// 30</pre>
+
+<h3 id="Iterando_un_jsxrefString">Iterando un {{jsxref("String")}}</h3>
+
+<pre class="brush: js">let iterable = "boo";
+
+for (let value of iterable) {
+  console.log(value);
+}
+// "b"
+// "o"
+// "o"</pre>
+
+<h3 id="Iterando_un_jsxrefTypedArray">Iterando un {{jsxref("TypedArray")}}</h3>
+
+<pre class="brush: js">let iterable = new Uint8Array([0x00, 0xff]);
+
+for (let value of iterable) {
+  console.log(value);
+}
+// 0
+// 255</pre>
+
+<h3 id="Iterando_un_jsxrefMap">Iterando un {{jsxref("Map")}}</h3>
+
+<pre class="brush: js">let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
+
+for (let entry of iterable) {
+  console.log(entry);
+}
+// ['a', 1]
+// ['b', 2]
+// ['c', 3]
+
+for (let [key, value] of iterable) {
+  console.log(value);
+}
+// 1
+// 2
+// 3</pre>
+
+<h3 id="Iterando_un_jsxrefSet">Iterando un {{jsxref("Set")}}</h3>
+
+<pre class="brush: js">let iterable = new Set([1, 1, 2, 2, 3, 3]);
+
+for (let value of iterable) {
+  console.log(value);
+}
+// 1
+// 2
+// 3</pre>
+
+<h3 id="Iterando_un_objeto_arguments">Iterando un objeto <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/arguments">arguments</a></h3>
+
+<pre class="brush: js">(function() {
+  for (let argument of arguments) {
+    console.log(argument);
+  }
+})(1, 2, 3);
+
+// 1
+// 2
+// 3</pre>
+
+<h3 id="Iterando_una_colección_del_DOM">Iterando una colección del DOM</h3>
+
+<p>Iterando colecciones del DOM como un {{domxref("NodeList")}}: el siguiente ejemplo añade la clase "read" a los párrafos (<code>&lt;p&gt;</code>) que son descendientes directos de un (<code>&lt;article&gt;</code>):</p>
+
+<pre class="brush: js">// Nota: Esto solo funcionará en plataformas que tengan
+// implementado NodeList.prototype[Symbol.iterator]
+let articleParagraphs = document.querySelectorAll("article &gt; p");
+
+for (let paragraph of articleParagraphs) {
+  paragraph.classList.add("read");
+}</pre>
+
+<h3 id="Clausurando_iteraciones">Clausurando iteraciones</h3>
+
+<p>En los bucles <code>for...of</code>, se puede causar que la iteración termine de un modo brusco usando: <code>break</code>, <code>continue<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Chrome_closing_1">[4]</a></code>, <code>throw</code> or <code>return<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Chrome_closing_2">[5]</a></code>. En estos casos la iteración se cierra.</p>
+
+<pre><code>function* foo(){
+  yield 1;
+  yield 2;
+  yield 3;
+};
+
+for (let o of foo()) {
+  console.log(o);
+  break; // closes iterator, triggers return
+}</code></pre>
+
+<h3 id="Iterando_generadores">Iterando generadores</h3>
+
+<p>También es posible iterar las nuevas funciones <strong><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*">generator</a></strong>:</p>
+
+<pre class="brush: js">function* fibonacci() { // una función generador
+  let [prev, curr] = [0, 1];
+  while (true) {
+    [prev, curr] = [curr, prev + curr];
+    yield curr;
+  }
+}
+
+for (let n of fibonacci()) {
+  console.log(n);
+  // interrumpir la secuencia en 1000
+  if (n &gt;= 1000) {
+    break;
+  }
+}</pre>
+
+<div class="note">
+<h4 id="No_se_deben_reutilizar_los_generadores"><a id="#re-use" name="#re-use">No se deben reutilizar los generadores</a></h4>
+
+<p>Los generadores no deben ser reutilizados, incluso si el bucle <strong><code>for...of</code></strong> se ha terminado antes de tiempo con la sentencia <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/break">break</a>. Una vez abandonado el bucle, el generador está cerrado y tratar de iterar sobre él de nuevo no dará más resultados. Firefox no ha implementado aún este comportamiento y el generador puede ser reutilizado en contra de lo escrito en el estándar ES6 (<a href="https://www.ecma-international.org/ecma-262/6.0/#sec-13.7.5.13">13.7.5.13, step 5m</a>), pero esto cambiará una vez que el bug {{Bug(1147371)}} haya sido corregido.</p>
+</div>
+
+<pre class="brush: js example-bad">var gen = (function *(){
+  yield 1;
+  yield 2;
+  yield 3;
+})();
+for (let o of gen) {
+  console.log(o);
+  break;  // Finaliza la iteración
+}
+
+// El generador no debe ser reutilizado, lo siguiente no tiene sentido
+for (let o of gen) {
+  console.log(o); // Nunca será llamado
+}</pre>
+
+<h3 id="Iterando_otros_objetos_iterables">Iterando otros objetos iterables</h3>
+
+<p>Es posible, además, iterar un objeto que explicitamente implemente el protocolo <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#iterable">iterable</a>:</p>
+
+<pre class="brush: js">var iterable = {
+  [Symbol.iterator]() {
+    return {
+      i: 0,
+      next() {
+        if (this.i &lt; 3) {
+          return { value: this.i++, done: false };
+        }
+        return { value: undefined, done: true };
+      }
+    };
+  }
+};
+
+for (var value of iterable) {
+  console.log(value);
+}
+// 0
+// 1
+// 2</pre>
+
+<h3 id="Diferencia_entre_for...of_y_for...in">Diferencia entre <code>for...of</code> y <code>for...in</code></h3>
+
+<p>El bucle <code><strong><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in" title="en-US/docs/JavaScript/Reference/Statements/for...in">for...in</a></strong> iterará sobre <strong>todas las propiedades de un objeto</strong>.</code> Más tecnicamente, iterará sobre cualquier propiedad en el objeto que haya sido internamente definida con su propiedad <code>[[Enumerable]] </code>configurada como <code>true</code>. </p>
+
+<p>La sintaxis de  <strong><code>for...of</code> </strong>es específica para las <strong>colecciones</strong>, y no para todos los objetos. Esta Iterará sobre cualquiera de los elementos de una colección que tengan la propiedad <code>[Symbol.iterator]</code>.</p>
+
+<p>El siguiente ejemplo muestra las diferencias entre un bucle<strong> <code>for...of</code></strong> y un bucle <strong>f<code>or...in</code></strong>. </p>
+
+<pre class="brush: js">let arr = [3, 5, 7];
+arr.foo = "hola";
+
+for (let i in arr) {
+   console.log(i); // logs "0", "1", "2", "foo"
+}
+
+for (let i of arr) {
+   console.log(i); // logs "3", "5", "7"
+}</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Cometario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-for-in-and-for-of-statements', 'for...of statement')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'for...of statement')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Edge</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome(38)}} <a href="##Chrome_note_1">[1]</a><br>
+    {{CompatChrome(51)}} <a href="##Chrome_note_3">[3]</a></td>
+   <td>{{CompatGeckoDesktop("13")}} <a href="##Gecko_note_2">[2]</a> <a href="##Chrome_note_4">[4]</a></td>
+   <td>12</td>
+   <td>25</td>
+   <td>7.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>5.1</td>
+   <td>{{CompatChrome(38)}} <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Chrome_note_1">[1]</a></td>
+   <td>{{CompatGeckoMobile("13")}} <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Gecko_note_2">[2]</a></td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>8</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p><a id="#Chrome_note_1" name="#Chrome_note_1">[1]</a> Desde Chrome 29 a Chrome 37 esta funcionalidad estuvo disponible al activar la opción chrome://flags/#enable-javascript-harmony: “JavaScript experimental”.</p>
+
+<p><a id="#Gecko_note_2" name="#Gecko_note_2">[2]</a> Antes de Firefox 51, el uso de <code>for...of usando</code> {{jsxref("const")}}<code> resultaba en un</code> {{jsxref("SyntaxError")}} ("missing = in const declaration"). El problema ha sido resuelto ({{bug(1101653)}}).</p>
+
+<p><a id="#Chrome_note_3" name="#Chrome_note_3">[3]</a> Chrome 51 añadió soporte para iterar objetos.</p>
+
+<p><a id="#Chrome_note_4" name="#Chrome_note_4">[4]</a> Firefox aún permite el uso de un generador después de haber interrumpido el bucle {{Bug(1147371)}}. Como se vio más arriba, <a href="##re-use">no se deben reutilizar los generadores</a>.</p>
+
+<h2 id="Vea_también">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Array.prototype.forEach()")}}</li>
+ <li>{{jsxref("Map.prototype.forEach()")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/for/index.html b/files/es/web/javascript/reference/statements/for/index.html
new file mode 100644
index 0000000000..8cb0c1131f
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/for/index.html
@@ -0,0 +1,58 @@
+---
+title: for
+slug: Web/JavaScript/Reference/Statements/for
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/for
+original_slug: Web/JavaScript/Referencia/Sentencias/for
+---
+<div>
+ {{jsSidebar("Statements")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Crea un bucle que consiste en tres expresiones opcionales, encerradas en paréntesis y separadas por puntos y comas, seguidas de una sentencia ejecutada en un bucle.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox">for ([<em>expresion-inicial</em>]; [<em>condicion</em>]; [<em>expresion-final</em>])<em>sentencia</em>
+</pre>
+<dl>
+ <dt>
+  <code>expresion-inicial</code></dt>
+ <dd>
+  Una expresión (incluyendo las expresiones de asignación) o la declaración de variable. Típicamente se utiliza para usarse como variable contador. Esta expresión puede opcionalmente declarar nuevas variables con la palabra clave <code>var</code>. Estas variables no son locales del bucle, es decir, están en el mismo alcance en el que está el bucle <code>for</code>. El resultado de esta expresión es descartado.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>condicion</code></dt>
+ <dd>
+  Una expresión para ser evaluada antes de cada iteración del bucle. Si esta expresión se evalúa como verdadera, se ejecuta <code>sentencia</code>. Esta comprobación condicional es opcional. Si se omite, la condición siempre se evalúa como verdadera. Si la expresión se evalúa como falsa, la ejecución salta a la primera expresión que sigue al constructor de <code>for</code>.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>expresion-final</code></dt>
+ <dd>
+  Una expresión para ser evaluada al final de cada iteración del bucle. Esto ocurre antes de la siguiente evaluación de la <code>condicion</code>. Generalmente se usa para actualizar o incrementar la variable contador.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>sentencia</code></dt>
+ <dd>
+  Una sentencia que se ejecuta mientras la condición se evalúa como verdadera. Para ejecutar múltiples sentencias dentro del bucle, utilice una sentencia {{jsxref("Sentencias/block", "block")}} (<code>{ ... }</code>) para agrupar aquellas sentecias.</dd>
+</dl>
+<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
+<h4 id="Ejemplo:_Usando_for" name="Ejemplo:_Usando_for">Ejemplo: Usando <code>for</code></h4>
+<p>La siguiente sentencia <code>for</code> comienza mediante la declaración de la variable <code>i</code> y se inicializa a <code>0</code>. Comprueba que <code>i</code> es menor que nueve, realiza las dos sentencias con éxito e incrementa <code>i</code> en 1 después de cada pase del bucle.</p>
+<pre class="eval">for (var i = 0; i &lt; 9; i++) {
+   n += i;
+   mifuncion(n);
+}
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("Sentencias/break", "break")}}</li>
+ <li>{{jsxref("Sentencias/continue", "continue")}}</li>
+ <li>{{jsxref("Sentencias/empty", "empty")}}</li>
+ <li>{{jsxref("Sentencias/while", "while")}}</li>
+ <li>{{jsxref("Sentencias/do...while", "do...while")}}</li>
+ <li>{{jsxref("Sentencias/for...in", "for...in")}}</li>
+ <li>{{jsxref("Sentencias/for...of", "for...of")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/function/index.html b/files/es/web/javascript/reference/statements/function/index.html
new file mode 100644
index 0000000000..675b8da2f2
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/function/index.html
@@ -0,0 +1,53 @@
+---
+title: function
+slug: Web/JavaScript/Reference/Statements/function
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/function
+original_slug: Web/JavaScript/Referencia/Sentencias/function
+---
+<div>
+ {{jsSidebar("Statements")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Declara una función con los parámetros especificados.</p>
+<p>Puede también definir funciones usando el constructor {{jsxref("Function")}} y el {{jsxref("Operadors/function", "function")}} (expresión function).</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="syntaxbox">function <em>nombre</em>([<em>parametro1</em>] [,<em>parametro2</em>] [..., <em>parametroN</em>]) {<em>sentencias</em>}
+</pre>
+<dl>
+ <dt>
+  <code>nombre</code></dt>
+ <dd>
+  El nombre de la función.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>parametroN</code></dt>
+ <dd>
+  El nombre de un argumento que se pasa a la función. Una función puede tener hasta 255 argumentos.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>sentencias</code></dt>
+ <dd>
+  Las sentencias que comprenden el cuerpo de la función.</dd>
+</dl>
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+<p>Para devolver un valor, la función debe tener una sentencia {{jsxref("Sentencias/return", "return")}} que especifica el valor a devolver.</p>
+<p>Una función creada con la sentencia <code>function</code> es un objeto <code>Function</code> y tiene todas las propiedades, métodos, y comportamiento de los objetos <code>Function</code>. Vea {{jsxref("Function")}} para información detallada sobre funciones.</p>
+<p>Una función puede también ser declarada dentro de una expresión. En este caso la función es normalmente anónima. Vea {{jsxref("Operadores/function", "function expression")}} para más información acerca de <code>function</code> (expresión function).</p>
+<p>Las funciones pueden declararse condicionalmente. Es decir, una definición de una función puede estar anidada dentro de una sentecia <code>if</code>. Técnicamente, tales declaraciones no son en realidad declaraciones de funciones; son expresiones function (expresiones de función).</p>
+<h2 id="Ejemplo" name="Ejemplo">Ejemplo</h2>
+<h3 id="Ejemplo:_Usando_function" name="Ejemplo:_Usando_function">Ejemplo: Usando <code>function</code></h3>
+<p>El siguiente código declara una función que devuelve la cantidad total de ventas, cuando se da el número de unidades vendidas de productos <code>a</code>, <code>b</code>, y <code>c</code>.</p>
+<pre class="brush: js">function calcular_ventas(unidades_a, unidades_b, unidades_c) {
+   return unidades_a*79 + unidades_b * 129 + unidades_c * 699;
+}
+</pre>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
+ <li>{{jsxref("Function")}}</li>
+ <li>Operadores{{jsxref("Operadores/function", "function")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/function_star_/index.html b/files/es/web/javascript/reference/statements/function_star_/index.html
new file mode 100644
index 0000000000..d44d3f50af
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/function_star_/index.html
@@ -0,0 +1,225 @@
+---
+title: function*
+slug: Web/JavaScript/Reference/Statements/function*
+tags:
+  - Declaración
+  - Experimental
+  - Expérimental(2)
+  - Iterador
+  - función
+translation_of: Web/JavaScript/Reference/Statements/function*
+original_slug: Web/JavaScript/Referencia/Sentencias/function*
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La declaración <code><strong>function*</strong></code> (la palabra clave <code>function</code> seguida de un asterisco) define una <em>función generadora</em>, que devuelve un objeto {{jsxref("Global_Objects/Generator","Generator")}}.</p>
+
+<div class="noinclude">
+<p>También puedes definir funciones generadoras usando el constructor {{jsxref("GeneratorFunction")}} y una {{jsxref("Operators/function*", "function* expression")}}.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">function* <em>nombre</em>([<em>param</em>[, <em>param</em>[, ... <em>param</em>]]]) {
+   <em>instrucciones</em>
+}
+</pre>
+
+<dl>
+ <dt><code>nombre</code></dt>
+ <dd>El nombre de la función.</dd>
+</dl>
+
+<dl>
+ <dt><code>param</code></dt>
+ <dd>El nombre de los argumentos que se le van a pasar a la función. Una función puede tener hasta 255 argumentos.</dd>
+</dl>
+
+<dl>
+ <dt><code>instrucciones</code></dt>
+ <dd>Las instrucciones que componen el cuerpo de la función.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Los generadores son funciones de las que se puede salir y volver a entrar. Su contexto (asociación de variables) será conservado entre las reentradas.</p>
+
+<p>La llamada a una función generadora no ejecuta su cuerpo inmediatamente; se devuelve un objeto <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#iterator">iterador</a> para la función en su lugar. Cuando el metodo <code>next()</code> del iterador es llamado , el cuerpo de la función generadora es ejecutado hasta la primera expresión {{jsxref("Operators/yield", "yield")}}, la cual especifica el valor que será retornado por el iterador o con, {{jsxref("Operators/yield*", "yield*")}}, delega a otra función generadora. El método <code>next()</code> retorna un objeto con una propiedad <em>value</em> que contiene el valor bajo el operador yield y una propiedad <em>done </em>que indica, con un booleano, si la función generadora ha hecho yield al último valor.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo_simple">Ejemplo simple</h3>
+
+<pre class="brush: js">function* idMaker(){
+  var index = 0;
+  while(index &lt; 3)
+    yield index++;
+}
+
+var gen = idMaker();
+
+console.log(gen.next().value); // 0
+console.log(gen.next().value); // 1
+console.log(gen.next().value); // 2
+console.log(gen.next().value); // undefined
+// ...</pre>
+
+<h3 id="Ejemplo_con_yield*">Ejemplo con yield*</h3>
+
+<pre class="brush: js">function* anotherGenerator(i) {
+  yield i + 1;
+  yield i + 2;
+  yield i + 3;
+}
+
+function* generator(i){
+  yield i;
+  yield* anotherGenerator(i);
+  yield i + 10;
+}
+
+var gen = generator(10);
+
+console.log(gen.next().value); // 10
+console.log(gen.next().value); // 11
+console.log(gen.next().value); // 12
+console.log(gen.next().value); // 13
+console.log(gen.next().value); // 20
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificaciones</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ES2015', '#', 'function*')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome(39.0)}}</td>
+   <td>{{CompatGeckoDesktop("26.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>26</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>yield*</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("27.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>26</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>IteratorResult</code> object instead of throwing</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("29.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatChrome(39.0)}}</td>
+   <td>{{CompatGeckoMobile("26.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>yield*</code></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("27.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>IteratorResult</code> object instead of throwing</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("29.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h3>
+
+<h4 id="Generadores_e_iteradores_en_versiones_de_Firefox_anteriores_a_26">Generadores e iteradores en versiones de Firefox anteriores a 26</h4>
+
+<p>Las versiones anteriores de FireFox implementan así mismo una versión anterior de la propuesta de generadores. En la versión anterior, los generadores eran definidos utilizando la declaración <code>function</code> de una manera regular (Sin asterisco).  Véase <a href="/en-US/docs/Web/JavaScript/Reference/Statements/Legacy_generator_function">Legacy generator function </a>para mayor información.</p>
+
+<h4 id="IteratorResult_object_returned_instead_of_throwing"><code>IteratorResult</code> object returned instead of throwing</h4>
+
+<p>Starting with Gecko 29 {{geckoRelease(29)}}, the completed generator function no longer throws a {{jsxref("TypeError")}} "generator has already finished". Instead, it returns an <code>IteratorResult</code> object like <code>{ value: undefined, done: true }</code> ({{bug(958951)}}).</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Operators/function*", "function* expression")}}</li>
+ <li>{{jsxref("GeneratorFunction")}} object</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">The Iterator protocol</a></li>
+ <li>{{jsxref("Operators/yield", "yield")}}</li>
+ <li>{{jsxref("Operators/yield*", "yield*")}}</li>
+ <li>{{jsxref("Function")}} object</li>
+ <li>{{jsxref("Statements/function", "function declaration")}}</li>
+ <li>{{jsxref("Operators/function", "function expression")}}</li>
+ <li>{{jsxref("Functions_and_function_scope", "Functions and function scope")}}</li>
+ <li>Other web resources:
+  <ul>
+   <li><a href="http://facebook.github.io/regenerator/">Regenerator</a> an ES2015 generator compiler to ES5</li>
+   <li><a href="http://www.youtube.com/watch?v=qbKWsbJ76-s">Forbes Lindesay: Promises and Generators: control flow utopia -- JSConf EU 2013</a></li>
+   <li><a href="https://www.youtube.com/watch?v=ZrgEZykBHVo&amp;list=PLuoyIZT5fPlG44bPq50Wgh0INxykdrYX7&amp;index=1">Hemanth.HM: The New gen of *gen(){}</a></li>
+   <li><a href="http://taskjs.org/">Task.js</a></li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/if...else/index.html b/files/es/web/javascript/reference/statements/if...else/index.html
new file mode 100644
index 0000000000..32a044324f
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/if...else/index.html
@@ -0,0 +1,110 @@
+---
+title: if...else
+slug: Web/JavaScript/Reference/Statements/if...else
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/if...else
+original_slug: Web/JavaScript/Referencia/Sentencias/if...else
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>Ejecuta una sentencia si una condición específicada es evaluada como verdadera. Si la condición es evaluada como falsa, otra sentencia puede ser ejecutada.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="eval">if (<em>condición</em>) <em>sentencia1</em> [else <em>sentencia2</em>]
+</pre>
+
+<dl>
+ <dt><code>condición</code></dt>
+ <dd>Una expresión que puede ser evaluada como verdadera o falsa.</dd>
+</dl>
+
+<dl>
+ <dt><code>sentencia1</code></dt>
+ <dd>Sentencia que se ejecutará si <code>condición</code> es evaluada como verdadera. Puede ser cualquier sentencia, incluyendo otras sentenccias <code>if</code> anidadas. Para ejecutar múltiples sentencias, use una sentencia {{jsxref("Sentencias/block", "block")}} ({ ... }) para agruparlas.</dd>
+</dl>
+
+<dl>
+ <dt><code>sentencia2</code></dt>
+ <dd>Sentencia que se ejecutará si <code>condición</code> se evalúa como falsa, y exista una cláusula <code>else</code>. Puede ser cualquier sentencia, incluyendo sentencias block y otras sentencias <code>if</code> anidadas.</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Multiples sentencias <code>if...else</code> pueden ser anidadas para crear una cláusula <code>else if</code>:</p>
+
+<pre>if (<em>condición1</em>)
+   <em>sentencia1</em>
+else if (<em>condición2</em>)
+   <em>sentencia2</em>
+else if (<em>condición3</em>)
+   <em>sentencia3</em>
+...
+else
+   <em>sentenciaN</em>
+</pre>
+
+<p>Para entender como esto funciona, así es como se vería si el anidamiento hubiera sido indentado correctamente:</p>
+
+<pre>if (<em>condición1</em>)
+   <em>sentencia1</em>
+else
+   if (<em>condición2</em>)
+      <em>sentencia2</em>
+   else
+      if (<em>condición3</em>)
+        ...
+</pre>
+
+<p>Para ejecutar varias sentencias en una cláusula, use una sentencia block (<code>{ ... }</code>) para agruparlas. Generalmente, es una buena práctica usar siempre sentencias block, especialmente en código que incluya sentencias if anidadas:</p>
+
+<pre class="brush: js">if (condición) {
+   sentencia1
+} else {
+   sentencia2
+}
+</pre>
+
+<p>No confundir los valores primitivos <code>true</code> y <code>false</code> con los valores true y false del objeto {{jsxref("Boolean")}}. Cualquier valor diferente de <code>undefined</code>, <code>null</code>, <code>0</code>, <code>-0</code>, <code>NaN</code>, o la cadena vacía (<code>""</code>), y cualquier objecto, incluso un objeto Boolean cuyo valor es false, se evalúa como verdadero en una sentencia condicional. Por ejemplo:</p>
+
+<pre class="brush: js">var b = new Boolean(false);
+if (b) // Esta condición se evalúa como verdadera
+</pre>
+
+<h2 id="Examples" name="Examples">Ejemplos</h2>
+
+<h3 id="Example:_Using_if...else" name="Example:_Using_if...else">Ejemplo: Uso de <code>if...else</code></h3>
+
+<pre class="brush: js">if (cipher_char == from_char) {
+   result = result + to_char;
+   x++;
+} else
+   result = result + clear_char;
+</pre>
+
+<h3 id="Example:_Assignment_within_the_conditional_expression" name="Example:_Assignment_within_the_conditional_expression">Ejemplo: Asignación en una expresión condicional</h3>
+
+<p>Es aconsejable no usar asignaciones simples en una expresión condicional, porque la asignación puede ser confundida con igualdad (operador relacional) cuando se lee el código. Por ejemplo, no use el siguiente código:</p>
+
+<pre class="brush: js">if (x = y) {
+   /* sentencia */
+}
+</pre>
+
+<p>Si realmente necesita una asignación dentro de una exprsión condicional, una práctica común es poner paréntesis adicionales alrededor del la asignación, por ejemplo:</p>
+
+<pre class="brush: js">if ((x = y)) {
+   /* sentencia */
+}
+</pre>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/block", "block")}}</li>
+ <li>{{jsxref("Sentencias/switch", "switch")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/import.meta/index.html b/files/es/web/javascript/reference/statements/import.meta/index.html
new file mode 100644
index 0000000000..95499ac414
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/import.meta/index.html
@@ -0,0 +1,94 @@
+---
+title: import.meta
+slug: Web/JavaScript/Reference/Statements/import.meta
+translation_of: Web/JavaScript/Reference/Statements/import.meta
+original_slug: Web/JavaScript/Referencia/Sentencias/import.meta
+---
+<div>{{JSSidebar("Statements")}}</div>
+
+<p>El objeto<strong> <code>import.meta</code></strong> expone el contenido especifico de la metadata al módulo JavaScript. Este contiene informacion sobre el módulo, como por ejemplo, la URL del mismo.</p>
+
+<h2 id="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">import.meta</pre>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La sintasis consiste de la palabra clave  {{JSxRef("Statements/import","import")}},un punto, y un identificador <code>meta</code>. Normalmente, la parte a la izquierda del punto es el objeto sobre el cual la accion es realizada, pero aqui <code>import</code> no es realmente un objeto.</p>
+
+<p>El objeto <code>import.meta</code> es creado por la implementacion ECMAScript , con un prototipo {{JSxRef("null")}} . El objeto es extensible y sus propiedades son grabables, editables y enumerables.</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_import.meta">Usando import.meta</h3>
+
+<p>Dado un módulo <code>my-module.js</code></p>
+
+<pre class="brush: html">&lt;script type="module" src="my-module.js"&gt;&lt;/script&gt;
+</pre>
+
+<p>puedes acceder a la meta información  sobre el módulo usando el objeto <code>import.meta</code>.</p>
+
+<pre class="brush: js;">console.log(import.meta); // { url: "file:///home/user/my-module.js" }</pre>
+
+<p>Este retorna un objeto con una propiedad  <code>url</code>  indicando la URL base del módulo.Esta será la URL de la que el script fue obtenido, por scripts externos, o  la URL base del documento que contiene el documento, por scripts inline.</p>
+
+<p>Nota que este incluirá parametros de la consulta y/o el hash (ej: seguido del <code>?</code> or <code>#</code>).</p>
+
+<p>Por ejemplo, con el siguiente HTML:</p>
+
+<pre class="brush: html">&lt;script type="module"&gt;
+import './index.mjs?someURLInfo=5';
+&lt;/script&gt;</pre>
+
+<p>..El siguiente archivo JavaScript registrará el parámetro <code>someURLInfo</code>:</p>
+
+<pre class="brush: js">// index.mjs
+new URL(import.meta.url).searchParams.get('someURLInfo'); // 5</pre>
+
+<p>Lo mismo aplica cuando un archivo importa otro:</p>
+
+<pre class="brush: js">// index.mjs
+import './index2.mjs?someURLInfo=5';
+
+// index2.mjs
+new URL(import.meta.url).searchParams.get('someURLInfo'); // 5</pre>
+
+<p>Nota que mientras Node.js pasa en la consulta los parámetros (o el hash ) como en el último ejemplo, a partir de Node 14.1.0, una URL con parametros en la consulta fallará  cuando se  carguen en el formato <code>node --experimental-modules index.mjs?someURLInfo=5</code> (es tratado como un archivo en lugar de una URL en este contexto).</p>
+
+<p>Tal argumento específico del archivo podria ser complementario al  usado en toda la aplicacion  <code>location.href</code> (con consultas strings o hash añadidas despues de la ruta HTML) (o en Node.js, mediante <code>process.argv</code>).</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificaciones</th>
+  </tr>
+  <tr>
+   <td><code><a href="https://tc39.es/proposal-import-meta/#prod-ImportMeta">import.meta</a></code> proposal</td>
+  </tr>
+  <tr>
+   <td>{{SpecName("HTML WHATWG", "webappapis.html#hostgetimportmetaproperties", "import.meta")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+
+
+<p>{{Compat("javascript.statements.import_meta")}}</p>
+
+<h3 id="Implementation_Progress">Implementation Progress</h3>
+
+<p>La siguiente tabla provee el estatus de implementación diaria para esta caracteristica, porque esta caracteristica aun no ha alcanzado la estabilidad entre navegadores. La información es generada corriendo los test relevantes de la caracteristica en <a href="https://github.com/tc39/test262">Test262</a>, la suite estandar de test de JavaScript, en el build nocturno,  o en el último release de cada  motor de los browser de JavaScript.</p>
+
+<div>{{EmbedTest262ReportResultsTable("import.meta")}}</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{JSxRef("Statements/import", "import")}}</li>
+ <li>{{JSxRef("Statements/export", "export")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/import/index.html b/files/es/web/javascript/reference/statements/import/index.html
new file mode 100644
index 0000000000..b889a8babb
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/import/index.html
@@ -0,0 +1,178 @@
+---
+title: import
+slug: Web/JavaScript/Reference/Statements/import
+tags:
+  - ECMAScript 2015
+  - JavaScript
+  - Módulos
+  - Sentencia
+  - import
+translation_of: Web/JavaScript/Reference/Statements/import
+original_slug: Web/JavaScript/Referencia/Sentencias/import
+---
+<div>{{jsSidebar("Sentencias")}}</div>
+
+<p>La sentencia <code><strong>import</strong></code> se usa para importar funciones que han sido exportadas desde un módulo externo.</p>
+
+<div class="note">
+<p>Por el momento, esta característica sólo está <a href="https://jakearchibald.com/2017/es-modules-in-browsers/">comenzando a ser implementada</a> de forma nativa en los navegadores. Está implementada en muchos transpiladores, tales como Typescript y <a href="http://babeljs.io/">Babel</a>, y en empaquetadores como <a href="https://github.com/rollup/rollup">Rollup</a> y <a href="https://webpack.js.org/">Webpack</a>.</p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">import <em>defaultExport</em> from "<em>module-name</em>";
+import * as <em>name</em> from "<em>module-name</em>";
+import { <em>export </em>} from "<em>module-name</em>";
+import { <em>export</em> as <em>alias </em>} from "<em>module-name</em>";
+import { <em>export1 , export2</em> } from "<em>module-name</em>";
+import { <em>export1 , export2</em> as <em>alias2</em> , <em>[...]</em> } from "<em>module-name</em>";
+import <em>defaultExport</em>, { <em>export</em> [ , <em>[...]</em> ] } from "<em>module-name</em>";
+import <em>defaultExport</em>, * as <em>name</em> from "<em>module-name</em>";
+import "<em>module-name</em>";</pre>
+
+<dl>
+ <dt><code>defaultExport</code></dt>
+ <dd>Nombre que se referirá al export por defecto del módulo.</dd>
+ <dt><code>module-name</code></dt>
+ <dd>El módulo desde el que importar. Normalmente es una ruta relativa o absoluta al archivo <code><strong>.js</strong></code> que contiene el módulo, excluyendo la extensión <code><strong>.js</strong></code>. Algunos empaquetadores pueden permitir o requerir el uso de la extensión; comprueba tu entorno. Sólo se permiten Strings con comillas simples o dobles.</dd>
+ <dt><code>name</code></dt>
+ <dd>Nombre del objeto del módulo que se utilizará como nombre de dominio al hacer referencia a los imports.</dd>
+ <dt><span style='background-color: rgba(220, 220, 220, 0.5); font-family: consolas,"Liberation Mono",courier,monospace; font-style: inherit; font-weight: inherit;'>export, exportN</span></dt>
+</dl>
+
+<dl>
+ <dd>Nombre de los exports a ser importados.</dd>
+ <dt><code>alias, aliasN</code></dt>
+ <dd>Nombre del objeto que recibirá la propiedad importada.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>El parámetro <code>name</code> es el nombre del objeto que recibirá los miembros exportados. El parámetro <code>member</code> especifica miembros individuales, mientras el parámetro <code>name</code> importa todos ellos. <font face="Courier New, Andale Mono, monospace">name</font> puede también ser una función si el módulo exporta un sólo parámetro por defecto en lugar de una serie de miembros. Abajo hay ejemplos que explican la sintaxis.</p>
+
+<h3 id="Importa_el_contenido_de_todo_un_módulo.">Importa el contenido de todo un módulo.</h3>
+
+<p>Esto inserta <code>myModule</code> en el ámbito actual, que contiene todos los elementos exportados en el archivo ubicado en  <code>/modules/my-module.js</code>.</p>
+
+<pre class="brush: js">import * as myModule from '/modules/my-module.js';</pre>
+
+<p>Aquí, para acceder a los miembros exportados habrá que usar el alias del módulo ("myModule" en este caso) como namespace. Por ejemplo, si el módulo importado arriba incluye un miembre exportado llamado <code>doAllTheAmazingThings()</code>, habría que invocarlo de la siguiente manera:</p>
+
+<pre class="brush: js">myModule.doAllTheAmazingThings();</pre>
+
+<h3 id="Importa_un_solo_miembro_de_un_módulo.">Importa un solo miembro de un módulo.</h3>
+
+<p>Dado un objeto o valor llamado <code>myExport</code> que ha sido exportado del módulo <code>my-module</code> ya sea implícitamente (porque todo el módulo ha sido exportado) o explícitamente (usando la sentencia {{jsxref("Sentencias/export", "export")}} ), esto inserta <code>myExport</code> en el ámbito actual.</p>
+
+<pre class="brush: js">import {myExport} from '/modules/my-module.js';</pre>
+
+<h3 id="Importa_multiples_miembros_de_un_módulo.">Importa multiples miembros de un módulo.</h3>
+
+<p>Esto inserta <code>foo</code> y <code>bar</code> en el ámbito actual.</p>
+
+<pre class="brush: js">import {foo, bar} from "my-module.js";</pre>
+
+<h3 id="Importa_un_miembre_con_un_alias_mas_conveniente">Importa un miembre con un alias mas conveniente</h3>
+
+<p>Se puede renombrar un miembro exportado cuando se importa. Por ejemplo, esto inserta <code>shortName</code> en el ámbito actual.</p>
+
+<pre class="brush: js">import {reallyReallyLongModuleExportName as shortName}
+  from '/modules/my-module.js';</pre>
+
+<h3 id="Renombra_multiples_miembros_durante_la_importación">Renombra multiples miembros durante la importación</h3>
+
+<p>Importa múltiples miembros exportados de un módulo con un alias conveniente.</p>
+
+<pre class="brush: js">import {
+  reallyReallyLongModuleExportName as shortName,
+  anotherLongModuleName as short
+} from '/modules/my-module.js';</pre>
+
+<h3 id="Importa_un_módulo_entero_para_efectos_secundarios_sólamente">Importa un módulo entero para efectos secundarios sólamente</h3>
+
+<p>Importa un módulo entero para efectos secundarios sólamente, sin importar ningun elemento. Esto ejecuta el código global del módulo, pero no importa ningún valor.</p>
+
+<pre class="brush: js">import '/modules/my-module.js';</pre>
+
+<h3 id="Importación_de_elementos_por_defecto">Importación de elementos por defecto</h3>
+
+<p>Es posible tener una exportación por defecto (tanto si se trata de un objeto, función, clase, etc.). Recíprocamente, es posible usa la instrucción <code>import</code> para importar esos elementos establecidos como por defecto.</p>
+
+<p>La versión más sencilla de importar un elemento por defecto es:</p>
+
+<pre class="brush: js">import myDefault from '/modules/my-module.js';</pre>
+
+<p>También es posible usar la sintaxis por defecto con lo que hemos visto anteriormente (importación de espacios de nombres o importaciones con nombre. En esos casos, la importación por defecto se deberá realizar en primer lugar. Por ejemplo:</p>
+
+<pre class="brush: js">import myDefault, * as myModule from '/modules/my-module.js';
+// myModule used as a namespace</pre>
+
+<p>o</p>
+
+<pre class="brush: js">import myDefault, {foo, bar} from '/modules/my-module.js';
+// specific, named imports</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p>Importar un archivo secundario para asistir en un procesamiento de una petición JSON AJAX.</p>
+
+<h3 id="El_módulo_file.js">El módulo: file.js</h3>
+
+<pre class="brush: js">function getJSON(url, callback) {
+  let xhr = new XMLHttpRequest();
+  xhr.onload = function () {
+    callback(this.responseText)
+  };
+  xhr.open('GET', url, true);
+  xhr.send();
+}
+
+export function getUsefulContents(url, callback) {
+  getJSON(url, data =&gt; callback(JSON.parse(data)));
+}</pre>
+
+<h3 id="El_programa_principal_main.js">El programa principal: main.js</h3>
+
+<pre class="brush: js">import { getUsefulContents } from '/modules/file.js';
+
+getUsefulContents('http://www.example.com',
+    data =&gt; { doSomethingUseful(data); });</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table>
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-imports', 'Imports')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inical</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-imports', 'Imports')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
+
+<div class="hidden">
+<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
+</div>
+
+<p>{{Compat("javascript.statements.import")}}</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/export", "export")}}</li>
+ <li><a href="https://blogs.windows.com/msedgedev/2016/05/17/es6-modules-and-beyond/">Previewing ES6 Modules and more from ES2015, ES2016 and beyond</a></li>
+ <li><a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a>, Hacks blog post by Jason Orendorff</li>
+ <li><a href="http://exploringjs.com/es6/ch_modules.html">Axel Rauschmayer's book: "Exploring JS: Modules"</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/index.html b/files/es/web/javascript/reference/statements/index.html
new file mode 100644
index 0000000000..b45aaa109b
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/index.html
@@ -0,0 +1,142 @@
+---
+title: Sentencias
+slug: Web/JavaScript/Reference/Statements
+tags:
+  - JavaScript
+  - Referencia
+  - sentencias
+translation_of: Web/JavaScript/Reference/Statements
+original_slug: Web/JavaScript/Referencia/Sentencias
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>Las aplicaciones JavaScript se componen de sentencias con una sintaxis propia. Una sentencia puede estar formada por múltiples líneas. Puede haber varias sentencias en una sola línea si separamos cada una de las sentencias por un punto y coma. No es una palabra clave, sino un grupo de palabras clave.</p>
+
+<h2 id="Sentencias_y_declaraciones_por_categoría">Sentencias y declaraciones por categoría</h2>
+
+<p>Puedes encontrarlas por orden alfabético en la columna de la izquierda .</p>
+
+<h3 id="Control_de_flujo">Control de flujo</h3>
+
+<dl>
+ <dt>{{jsxref("Sentencias/block", "Block")}}</dt>
+ <dd>Un bloque de sentencias se utiliza para agrupar cero o mas sentencias. El bloque se delimita por un par de llaves.</dd>
+ <dt>{{jsxref("Sentencias/break", "break")}}</dt>
+ <dd>Finaliza la sentencia actual loop, switch, o label y transfiere el control del programa a la siguiente sentencia de la sentencia finalizada.</dd>
+ <dt>{{jsxref("Sentencias/continue", "continue")}}</dt>
+ <dd>Finaliza la ejecucion de las sentencias dentro de la iteracion actual del actual bucle,  y continua la ejecucion del bucle con la siguiente iteracion.</dd>
+ <dt>{{jsxref("Sentencias/Empty", "Empty")}}</dt>
+ <dd>Una sentencia vacía se utiliza para proveer una "no sentencia", aunque la sintaxis de JavaScript esperaba una.</dd>
+ <dt>{{jsxref("Sentencias/if...else", "if...else")}}</dt>
+ <dd>Ejecuta una sentencia si una condición especificada es true. Si la condición es false, otra sentencia puede ser ejecutada.</dd>
+ <dt>{{jsxref("Sentencias/switch", "switch")}}</dt>
+ <dd>Evalua una expresión, igualando el valor de la expresión a una clausula case y ejecuta las sentencias asociadas con dicho case.</dd>
+ <dt>{{jsxref("Sentencias/throw", "throw")}}</dt>
+ <dd>Lanza una excepción definida por el usuario.</dd>
+ <dt>{{jsxref("Sentencias/try...catch", "try...catch")}}</dt>
+ <dd>Marca un bloque de sentencias para ser probadas (try) y especifica una respuesta, en caso de que se lance una excepción.</dd>
+</dl>
+
+<h3 id="Declaraciones">Declaraciones</h3>
+
+<dl>
+ <dt>{{jsxref("Sentencias/var", "var")}}</dt>
+ <dd>Declara una variable, opcionalmente inicializándola a un valor.</dd>
+ <dt>{{jsxref("Sentencias/let", "let")}}</dt>
+ <dd>Declara una variable local de ambito de bloque, opcionalmente inicializándola a un valor.</dd>
+ <dt>{{jsxref("Sentencias/const", "const")}}</dt>
+ <dd>Declara una constante de solo lectura.</dd>
+</dl>
+
+<h3 id="Funciones">Funciones</h3>
+
+<dl>
+ <dt>{{jsxref("Sentencias/function", "function")}}</dt>
+ <dd>Declara una función con los parámetros especificados.</dd>
+ <dt>{{jsxref("Sentencias/function*", "function*")}}</dt>
+ <dd>Los generadores de funciones permiten escribir {{jsxref("Iteration_protocols", "iteradores")}} con mas facilidad.</dd>
+ <dt>{{experimental_inline}} {{jsxref("Statements/async_function", "async function")}}</dt>
+ <dd>Declara una función asíncrona con los parámetros especificados.</dd>
+ <dt>{{jsxref("Statements/return", "return")}}</dt>
+ <dd>Especifica el valor a ser retornado por una función.</dd>
+ <dt>{{jsxref("Statements/class", "class")}}</dt>
+ <dd>Declara una clase.</dd>
+</dl>
+
+<h3 id="Iteraciones">Iteraciones</h3>
+
+<dl>
+ <dt>{{jsxref("Sentencias/do...while", "do...while")}}</dt>
+ <dd>Crea un bucle que ejecuta una instrucción especificada hasta que la condición de prueba se evalúa como falsa. La condición se evalúa después de ejecutar la instrucción, lo que da como resultado que la instrucción especificada se ejecute al menos una vez.</dd>
+ <dt>{{jsxref("Sentencias/for", "for")}}</dt>
+ <dd>Creates a loop that consists of three optional expressions, enclosed in parentheses and separated by semicolons, followed by a statement executed in the loop.</dd>
+ <dt>{{deprecated_inline()}} {{non-standard_inline()}}{{jsxref("Sentencias/for_each...in", "for each...in")}}</dt>
+ <dd>Itera una variable especificada sobre todos los valores de las propiedades del objeto. Para cada propiedad distinta, se ejecuta una instrucción especificada.</dd>
+ <dt>{{jsxref("Sentencias/for...in", "for...in")}}</dt>
+ <dd>Itera sobre las propiedades enumerables de un objeto, en orden albitrario. Para cada propiedad distinta, las instrucciones pueden ser ejecutadas.</dd>
+ <dt>{{jsxref("Sentencias/for...of", "for...of")}}</dt>
+ <dd>Iterates over iterable objects (including {{jsxref("Array", "array")}}, array-like objects, <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Iterators_and_Generators" title="Iterators and generators">iterators and generators</a>), invoking a custom iteration hook with statements to be executed for the value of each distinct property.</dd>
+ <dt>{{jsxref("Sentencias/while", "while")}}</dt>
+ <dd>Crea un bucle que ejecuta la instrucción especificada siempre que la condición de prueba se evalúe como verdadera. La condición se evalúa antes de ejecutar la instrucción.</dd>
+</dl>
+
+<h3 id="Otros">Otros</h3>
+
+<dl>
+ <dt>{{jsxref("Sentencias/debugger", "debugger")}}</dt>
+ <dd>Invoca cualquier funcionalidad de depuración disponible. Si no hay funcionalidad de depuración disponible, esta isntrucción no tiene efecto.</dd>
+ <dt>{{jsxref("Sentencias/export", "export")}}</dt>
+ <dd>Usada para permitir a un script firmada proveer propiedades, funciones y objetos a otros scripts firmada o sin firmar. Esta antigua funcionalidad de Netscape ha sido removida y será redefinida por los modulos de ECMAScript 6</dd>
+ <dt>{{jsxref("Sentencias/import", "import")}}</dt>
+ <dd>Usada para permitir a un escript importar propiedades, funciones y objetos desde otro script firmado que ha exportado su información. Esta antigua funcionalidad de Netscape ha sido removida y será redefinida por los modulos de ECMAScript 6.</dd>
+ <dt>{{jsxref("Sentencias/label", "label")}}</dt>
+ <dd>Provee una instrucción con un identificador que puedes referir usando una instrucción <code>break</code> o <code>continue</code> .</dd>
+</dl>
+
+<dl>
+ <dt>{{deprecated_inline()}} {{jsxref("Sentencias/with", "with")}}</dt>
+ <dd>Extiende la cadena de alcance para una instrucción.</dd>
+</dl>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentario</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-12', 'Statements')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Definición inicial</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3', '#sec-12', 'Statements')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-12', 'Statements')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Nuevo: function*, let, for...of, yield, class</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Vea_También">Vea También</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Operadores">Operadores</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/label/index.html b/files/es/web/javascript/reference/statements/label/index.html
new file mode 100644
index 0000000000..5c89b61a55
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/label/index.html
@@ -0,0 +1,36 @@
+---
+title: label
+slug: Web/JavaScript/Reference/Statements/label
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/label
+original_slug: Web/JavaScript/Referencia/Sentencias/label
+---
+<div>
+ {{jsSidebar("Statements")}}</div>
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+<p>Proporciona una sentencia con un identificador al que se puede referir al usar las sentencias {{jsxref("Sentencias/break", "break")}} o {{jsxref("Sentencias/continue", "continue")}}.</p>
+<p>Por ejemplo, puede usar una etiqueta para identificar un bucle, y entonces usar las sentencias <code>break</code> o <code>continue</code> para indicar si un programa debería interrumpir el bucle o continuar su ejecución.</p>
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+<pre class="eval"><i>etiqueta</i> :<i>sentencia</i>
+</pre>
+<dl>
+ <dt>
+  <code>etiqueta</code></dt>
+ <dd>
+  Cualquier identificador JavaScript que no sea una palabra reservada.</dd>
+</dl>
+<dl>
+ <dt>
+  <code>sentencia</code></dt>
+ <dd>
+  Sentencias. <code>break</code> puede ser usado con cualquier sentencia etiquetada, y <code>continue</code> puede usarse con bucles etiquetados de sentencias.</dd>
+</dl>
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+<p>Para un ejemplo de una sentencia label usando <code>break</code>, vea <code>break</code>. Para un ejemplo de una sentencia label usando <code>continue</code>, vea <code>continue</code>.</p>
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+<ul>
+ <li>{{jsxref("Sentencias/break", "break")}}</li>
+ <li>{{jsxref("Sentencias/continue", "continue")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/let/index.html b/files/es/web/javascript/reference/statements/let/index.html
new file mode 100644
index 0000000000..872bd15a48
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/let/index.html
@@ -0,0 +1,394 @@
+---
+title: let
+slug: Web/JavaScript/Reference/Statements/let
+tags:
+  - Característica del lenguaje
+  - Declaración de variable
+  - ECMAScript 2015
+  - JavaScript
+  - Variables
+  - let
+  - sentencias
+translation_of: Web/JavaScript/Reference/Statements/let
+original_slug: Web/JavaScript/Referencia/Sentencias/let
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La instrucción <strong><code>let</code></strong> declara una variable de alcance local con ámbito de bloque<font><font>(</font></font><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/block">block </a>scope<font><font>)</font></font>, la cual, opcionalmente, puede ser inicializada con algún valor.</p>
+
+<div class="warning">
+<p class="p1">La palabra reservada <strong><code><span class="s1">let </span></code></strong>en Mozilla Firefox 44 y anteriores, está solo disponible para bloques de código en HTML que esten envueltos en una etiqueta <code><span class="s1">&lt;script type="application/javascript;version=1.7"&gt;</span></code> (o de una version mayor). Las etiquetas <a href="https://developer.mozilla.org/en-US/docs/XUL">XUL</a> tienen acceso a esas características sin necesidad de dicho bloque.  Es necesario tomar en cuenta que esta es una característica <s>no estándar</s> <u>que ya se ha hecho actualmente estándar</u>, <s>esto</s> <u>pero</u> puede crear conflictos con otros navegadores<u>, ya que fue una característica no estándar.</u></p>
+</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">let var1 [= valor1] [, var2 [= valor2]] [, ..., varN [= valorN]];</pre>
+
+<h3 id="Parámetros">Parámetros</h3>
+
+<dl>
+ <dt><code>var1</code>, <code>var2</code>, …, <code>varN</code></dt>
+ <dd>Los nombres de la variable o las variables a declarar. Cada una de ellas debe ser un identificador legal de JavaScript</dd>
+ <dt><code>value1</code>, <code>value2</code>, …, <code>valueN</code></dt>
+ <dd>Por cada una de las variables declaradas puedes, opcionalmente, especificar su valor inicial como una expresión legal JavaScript.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p><strong><code>let</code> </strong>te permite declarar variables limitando su alcance (<em>scope</em>) al bloque, declaración, o expresión donde se está usando.a diferencia de la palabra clave <code>var</code> la cual define una variable global o local en una función sin importar el ámbito del bloque. La otra diferencia entre <code>var</code> y <code>let</code> <span class="VIiyi" lang="es"><span class="ChMk0b JLqJ4b"><span>es que este último se inicializa a un valor sólo cuando un analizador lo evalúa (ver abajo).</span></span></span></p>
+
+<p>Al igual que <code>const</code>, <code>let </code>no crea propiedades del objeto se declara globalmente (en el alcance más alto).</p>
+
+<h3 id="Alcance_scope_a_nivel_de_bloque_con_let">Alcance (<em>scope</em>) a nivel de bloque con <code>let</code></h3>
+
+<p>Usar la palabra reservada <code>let</code> para definir variables dentro de un bloque.</p>
+
+<pre class="brush:js notranslate">if (x &gt; y) {
+  let gamma = 12.7 + y;
+  i = gamma * x;
+}
+</pre>
+
+<p>Es posible usar definiciones <code>let</code> para asociar código en extensiones con un pseudo-espacio-de-nombre (pseudo-namespace). (Ver <a href="/en-US/docs/Security_best_practices_in_extensions" title="en-US/docs/Security_best_practices_in_extensions">Mejores prácticas de seguridad en extensiones</a>.)</p>
+
+<pre class="brush:js notranslate">let Cc = Components.classes, Ci = Components.interfaces;
+</pre>
+
+<p><code>let</code> puede ser útil para escribir código más limpio cuando usamos funciones internas.</p>
+
+<pre class="brush:js notranslate">var list = document.getElementById("list");
+
+for (var i = 1; i &lt;= 5; i++) {
+  var item = document.createElement("LI");
+  item.appendChild(document.createTextNode("Item " + i));
+
+  let j = i;
+  item.onclick = function (ev) {
+    console.log("Item " + j + " is clicked.");
+  };
+  list.appendChild(item);
+}
+</pre>
+
+<p>El ejemplo anterior trabaja como se espera porque las cinco instancias de la función (anónima) interna hacen referencia a cinco diferentes instancias de la variable <code>j</code>. Nótese que esto no funcionaría como se espera si reemplazamos <code>let</code> con <code>var</code> o si removemos la variable <code>j</code> y simplemente usamos la variable <code>i</code> dentro de la función interna.</p>
+
+<h4 id="Reglas_de_alcance">Reglas de alcance</h4>
+
+<p>Variables declaradas por <code>let</code> tienen por alcance el bloque en el que se han definido, así mismo, como en cualquier bloque interno. De esta manera, <code>let</code> trabaja muy parecido a <code>var</code>. La más notable diferencia es que el alcance de una variable <code>var</code> es la función contenedora:</p>
+
+<pre class="brush:js notranslate">function varTest() {
+  var x = 31;
+  if (true) {
+    var x = 71;  // ¡misma variable!
+    console.log(x);  // 71
+  }
+  console.log(x);  // 71
+}
+
+function letTest() {
+  let x = 31;
+  if (true) {
+    let x = 71;  // variable diferente
+    console.log(x);  // 71
+  }
+  console.log(x);  // 31
+}
+// llamamos a las funciones
+varTest();
+letTest();
+</pre>
+
+<p>En el nivel superior de un programa y funciones, <code>let</code> , a diferencia de <code>var</code>, <strong>no crea</strong> una propiedad en el objeto global, por ejemplo:</p>
+
+<pre class="brush:js notranslate">var x = 'global';
+let y = 'global';
+console.log(this.x); // "global"
+console.log(this.y); // undefined
+</pre>
+
+<p>La salida de este código desplegaría "global" una vez.</p>
+
+<h3 id="Zona_muerta_temporal_y_errores_con_let">Zona muerta temporal y errores con <code>let<a id="muerta" name="muerta"></a></code></h3>
+
+<p>La <strong>redeclaración</strong> de la misma variable bajo un mismo <font><font><a href="https://www.ecma-international.org/ecma-262/6.0/#sec-lexical-environments">ámbito léxico</a> </font></font>terminaría en un error de tipo <code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError" title="SyntaxError">SyntaxError</a></code>. Esto también es <strong>extensible</strong> si usamos <code>var</code> dentro del <font><font>ámbito léxico</font></font>. Esto nos salvaguarda de redeclarar una variable accidentalmente y que no era posible  solo con <code>var.</code></p>
+
+<pre class="brush: js notranslate">if (x) {
+  let foo;
+  let foo; // Terminamos con un SyntaxError.
+}
+if (x) {
+  let foo;
+  var foo; // Terminamos con un SyntaxError.
+}
+</pre>
+
+<p>En ECMAScript 2015, <code>let</code> <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/var#Description">no eleva</a> la variable a la parte superior del bloque. Si se hace una referencia a la variable declarada con <code>let</code> (<code>let foo</code>) antes de su declaración, terminaríamos con un error de tipo <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/ReferenceError" title="TypeError">ReferenceError</a> </code>(al contrario de la variable declarada con <code>var</code>, que tendrá el valor <code>undefined</code>), esto porque la variables vive en una "zona muerta temporal" desde el inicio del bloque hasta que la declaración ha sido procesada.</p>
+
+<pre class="notranslate"><code>function do_something() {
+  console.log(bar); // undefined
+  console.log(foo); // ReferenceError: foo </code>no está definido<code>
+  var bar = 1;
+  let foo = 2;
+}</code></pre>
+
+<p>Es posible encontrar errores en bloques de control <a href="/en-US/docs/JavaScript/Reference/Statements/switch" title="switch"><code>switch</code></a> debido a que solamente existe un block subyacente.</p>
+
+<pre class="brush: js notranslate">switch (x) {
+  case 0:
+    let foo;
+    break;
+
+  case 1:
+    let foo; // Terminamos con un error de tipo SyntaxError.
+             // esto debido a la redeclaracion
+    break;
+}</pre>
+
+<h3 id="Otro_ejemplo_de_zona_muerta_temporal_combinada_con_ámbito_léxico"><font><font>Otro ejemplo de zona muerta temporal combinada con <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-lexical-environments">ámbito léxico</a></font></font></h3>
+
+<p>Debido al alcance léxico, el identificador <code>num</code> dentro de la expresión (<code>num + 55</code>) se evalúa como <code>num</code> del bloque <code>if</code>, y no como la variable <code>num</code> con el valor 33 que esta por encima</p>
+
+<p>En esa misma línea, el <code>num </code>del bloque <code>if</code> ya se ha creado en el ámbito léxico, pero aún no ha alcanzado (y <strong>terminado</strong>) su inicialización (que es parte de la propia declaración): todavía está en la zona muerta temporal.</p>
+
+<pre class="notranslate"><code>function prueba(){
+   var num = 33;
+   if (true) {
+      let num = (num + 55);</code>//ReferenceError: no se puede acceder a la declaración léxica `num'antes de la inicialización <code>
+   }
+}
+prueba();</code>
+</pre>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="let_vs_var"><code>let</code> vs <code>var</code></h3>
+
+<p>Cuando usamos <code>let</code> dentro de un bloque, podemos limitar el alcance de la variable a dicho bloque. Notemos la diferencia con <code>var</code>, cuyo alcance reside dentro de la función donde ha sido declarada la variable.</p>
+
+<pre class="brush: js notranslate">var a = 5;
+var b = 10;
+
+if (a === 5) {
+  let a = 4; // El alcance es dentro del bloque if
+  var b = 1; // El alcance es global
+
+  console.log(a);  // 4
+  console.log(b);  // 1
+}
+
+console.log(a); // 5
+console.log(b); // 1</pre>
+
+<h3 id="let_en_bucles"><code>let</code> en bucles</h3>
+
+<p>Es posible usar la palabra reservada <code>let</code> para enlazar variables con alcance local dentro del alcance de un bucle en lugar de usar una variable global (definida usando <code>var</code>) para dicho propósito.</p>
+
+<pre class="brush: js notranslate">for (let i = 0; i&lt;10; i++) {
+  console.log(i); // 0, 1, 2, 3, 4 ... 9
+}
+
+console.log(i); // ReferenceError: i is not defined
+</pre>
+
+<h2 id="Extensiones_let_no-estandar">Extensiones <code>let</code> no-estandar</h2>
+
+<h3 id="Bloques_let">Bloques<code> let</code></h3>
+
+<div class="warning">
+<p>La <strong>sintaxis del bloque y expresion</strong> <code>let</code> es no-estandar y sera deshechado en un futuro. ¡No deben ser usados! ver <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1023609" rel="noopener" title="FIXED: Remove SpiderMonkey support for let expressions">error 1023609</a> y <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1167029" rel="noopener" title="FIXED: Remove SpiderMonkey support for let blocks">error 1167029</a> para mas detalles.</p>
+</div>
+
+<p>Un <strong>bloque <code>let</code></strong> provee una manera de asociar valores con variables dentro del alcance de un bloque sin afectar el valor de variables con nombre similar fuera del bloque.</p>
+
+<h4 id="Sintaxis_2">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate">let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) {declaración};</pre>
+
+<h4 id="Descripción_2">Descripción</h4>
+
+<p>El bloque <code>let</code> provee alcance local para las variables. Funciona enlazando cero o más variables en el alcance léxico de un solo bloque de código; de otra manera, es exactamente lo mismo que una declaración de bloque. Hay que notar particularmente que el alcance de una variable declarada dentro de un bloque <code>let</code> usando var es equivalente a declarar esa variable fuera del bloque <code>let</code>; dicha variable aún tiene alcance dentro de la función. Al usar la sintaxis de bloque <code>let</code>, los paréntesis siguientes a <code>let</code> son requeridos. Una falla al incluir dichos paréntesis resultará en un error de sintaxis.</p>
+
+<h4 id="Ejemplo">Ejemplo</h4>
+
+<pre class="brush:js notranslate">var x = 5;
+var y = 0;
+
+let (x = x+10, y = 12) {
+  console.log(x+y); // 27
+}
+
+console.log(x + y); // 5
+</pre>
+
+<p>Las reglas para el bloque de código son las mismas que para cualquier otro bloque de código en JavaScript. Es posible tener sus propias variables locales usando declaraciones <code>let</code> en dicho bloque.</p>
+
+<h4 id="Reglas_de_alcance_2">Reglas de alcance</h4>
+
+<p>El alcance de las variables definidas usando <code>let</code> es el mismo bloque <code>let</code>, así como cualquier bloque interno contenido dentro de el bloque, a menos que esos bloques internos definan variables con el mismo nombre.</p>
+
+<h3 id="expresiones_let">expresiones <code>let</code></h3>
+
+<div class="warning">
+<p><code>Soporte de <strong>expresiones</strong> let</code> ha sido removido en Gecko 41 ({{bug(1023609)}}).</p>
+</div>
+
+<p>Una <strong>expresion <code>let</code></strong> permite establecer variables con alcance dentro de una expresión.</p>
+
+<h4 id="Sintaxis_3">Sintaxis</h4>
+
+<pre class="syntaxbox notranslate">let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) expression;</pre>
+
+<h4 id="Ejemplo_2">Ejemplo</h4>
+
+<p>Podemos usar <code>let</code> para establecer variables que tienen como alcance solo una expresión:</p>
+
+<pre class="brush: js notranslate">var a = 5;
+let(a = 6) console.log(a); // 6
+console.log(a); // 5</pre>
+
+<h4 id="Reglas_de_alcance_3">Reglas de alcance</h4>
+
+<p>Dada la expresión <code>let</code> siguiente:</p>
+
+<pre class="eval notranslate">let (<var>decls</var>) <var>expr</var>
+</pre>
+
+<p>Existe un bloque implícito creado alrededor de expr.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Estado</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Definición initial. No especifica expresiones ni declaraciones let.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
+
+<h2 id="CompatibilityTable"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{CompatibilityTable}}</span></h2>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>
+    <p class="p1">{{CompatChrome(41.0)}}</p>
+   </td>
+   <td>{{ CompatGeckoDesktop("1.8.1") }} [1]</td>
+   <td>11</td>
+   <td>17</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Zona muerta temporal</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{ CompatGeckoDesktop("35") }} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Expresión<code> let</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("1.8.1") }}-{{ CompatGeckoDesktop("40") }} [1]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Bloque<code> let</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoDesktop("1.8.1") }} [1]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Android</th>
+   <th>Chrome para Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatUnknown}}</td>
+   <td>
+    <p class="p1">{{CompatChrome(41.0)}}</p>
+   </td>
+   <td>{{ CompatGeckoMobile("1.8.1") }} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Zona muerta temporal</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{ CompatGeckoMobile("35") }} [1]</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+  <tr>
+   <td>Expresión<code> let</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("1.8.1") }}-{{ CompatGeckoMobile("40") }}[1]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td>Bloque<code> let</code> {{non-standard_inline}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{ CompatGeckoMobile("1.8.1") }} [1]</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h3 id="Notas_específicas_a_Firefox">Notas específicas a Firefox</h3>
+
+<ul>
+ <li>[1]: Solo disponible para bloques de codigo HTML dentro de una etiqueta <code>&lt;script&gt; type="application/javascript;version=1.7"&gt;</code> (o de una versión mayor). Es necesario tomar en cuenta que esta es una característica no estándar, esto puede crear conflictos con otros navegadores. Las etiquetas <a href="https://developer.mozilla.org/en-US/docs/XUL">XUL</a> tienen acceso a esas características sin necesidad de dicho bloque. Ver<span style="line-height: 1.5;">{{bug(932513)}}.</span></li>
+ <li>Conformidad con ES2015 para <code>let</code> en SpIderMonkey es monitoreado en {{bug(950547)}} y extensiones no-standar seran eliminadas en el futuro {{bug(1023609)}}.</li>
+</ul>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/var"><code>var</code></a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/const"><code>const</code></a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/return/index.html b/files/es/web/javascript/reference/statements/return/index.html
new file mode 100644
index 0000000000..3a1797d24d
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/return/index.html
@@ -0,0 +1,74 @@
+---
+title: return
+slug: Web/JavaScript/Reference/Statements/return
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/return
+original_slug: Web/JavaScript/Referencia/Sentencias/return
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p><span id="result_box" lang="es"><span>La</span> <span>sentencia <code>return</code></span> <span class="alt-edited">finaliza la</span> <span>ejecución de la función</span> <span>y especifica</span> <span>un valor</span> <span>para ser devuelto</span> <span class="alt-edited">a quien llama a la</span> <span>función.</span></span></p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">return [[ <em>expresion</em> ]];</pre>
+
+<dl>
+ <dt><span class="short_text" id="result_box" lang="es"><span>expresion</span></span></dt>
+ <dd>La expresión a retornar. Si se omite, <code>undefined</code> es retornado en su lugar.</dd>
+</dl>
+
+<h2 id="Description">Description</h2>
+
+<p>Cuando una instrucción de retorno se llama en una función, se detiene la ejecución de esta. Si se especifica un valor dado, este se devuelve a quien llama a la función. Si se omite la expresión, <code>undefined</code> se devuelve en su lugar. Todas las siguientes sentencias de retorno rompen la ejecución de la función:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">return</span><span class="punctuation token">;</span>
+<span class="keyword token">return</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
+<span class="keyword token">return</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
+<span class="keyword token">return</span> x<span class="punctuation token">;</span>
+<span class="keyword token">return</span> x <span class="operator token">+</span> y <span class="operator token">/</span> <span class="number token">3</span><span class="punctuation token">;</span></code></pre>
+
+<h2 id="Sintaxis" name="Sintaxis"><br>
+ La inserción automática Punto y coma</h2>
+
+<p>La instrucción de retorno se ve afectada por la inserción automática de punto y coma (ASI). No se permite el terminador de línea entre la palabra clave de retorno y la expresión.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">return</span>
+a <span class="operator token">+</span> b<span class="punctuation token">;</span></code></pre>
+
+<dl>
+</dl>
+
+<p><br>
+ se transforma por ASI en:</p>
+
+<pre class="line-numbers  language-html"><code class="language-html">return;
+a + b;</code></pre>
+
+<p><br>
+ La consola le advertirá "código inalcanzable después de la declaración de retorno".</p>
+
+<div class="note">
+<p>A partir de Gecko 40 {{geckoRelease(40)}}, una advertencia es mostrada en la consola si se encuentra código inalcanzable despues de una instrucción return.</p>
+</div>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Usando_return" name="Ejemplo:_Usando_return">Ejemplo: Usando <code>return</code></h3>
+
+<p>La siguiente función devuelve el cuadrado de su argumento, <code>x</code>, donde <code>x</code> es un número.</p>
+
+<pre class="brush: js">function cuadrado(x) {
+   return x * x;
+}
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/switch/index.html b/files/es/web/javascript/reference/statements/switch/index.html
new file mode 100644
index 0000000000..29c5a63f93
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/switch/index.html
@@ -0,0 +1,246 @@
+---
+title: switch
+slug: Web/JavaScript/Reference/Statements/switch
+translation_of: Web/JavaScript/Reference/Statements/switch
+original_slug: Web/JavaScript/Referencia/Sentencias/switch
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La <strong>declaración</strong> <code><strong>switch</strong></code> evalúa una <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Expressions_and_Operators">expresión</a>, comparando el valor de esa expresión con una instancia <code><strong>case</strong></code>, y ejecuta <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias">declaraciones</a> asociadas a ese <code>case</code>, así como las declaraciones en los <code>case</code> que siguen.</p>
+
+<h2 id="Syntaxis">Syntaxis</h2>
+
+<pre class="syntaxbox notranslate">switch (expresión) {
+  case valor1:
+    //Declaraciones ejecutadas cuando el resultado de expresión coincide con el valor1
+    [break;]
+  case valor2:
+    //Declaraciones ejecutadas cuando el resultado de expresión coincide con el valor2
+    [break;]
+  ...
+  case valorN:
+    //Declaraciones ejecutadas cuando el resultado de expresión coincide con valorN
+    [break;]
+  default:
+    //Declaraciones ejecutadas cuando ninguno de los valores coincide con el valor de la expresión
+    [break;]
+}</pre>
+
+<dl>
+ <dt><code>expresión</code></dt>
+ <dd>Es una expresión que es comparada con el valor de cada instancia <code>case</code>.</dd>
+ <dt><code>case valorN</code></dt>
+ <dd>Una instancia <code>case valorN</code> es usada para ser comparada con la <code>expresión</code>. Si la <code>expresión</code> coincide con el <code>valorN</code>, las declaraciones dentro de la instancia <code>case</code> se ejecutan hasta que se encuentre el final de la declaración <code>switch</code> o hasta encontrar una interrupción <code>break</code>.</dd>
+</dl>
+
+<dl>
+ <dt><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">default</span></font></dt>
+ <dd>Una instancia <code>default</code>, cuando es declarada, es ejecutada si el valor de la <code>expresión</code> no coincide con cualquiera de las otras instancias <code>case valorN</code>.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>Si ocurre una coincidencia, el programa ejecuta las declaraciones asociadas correspondientes. Si la expresión coincide con múltiples entradas, la primera será la seleccionada, incluso si las mayúsculas son tenidas en cuenta.</p>
+
+<p>El programa primero busca la primer instacia <code>case</code> cuya expresión se evalúa con el mismo valor de la expresión de entrada (usando <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">comparación estricta</a>, <code>===)</code> y luego transfiere el control a esa cláusula, ejecutando las declaraciones asociadas. Si no se encuentra una cláusula de <code>case</code> coincidente, el programa busca la cláusula <code>default</code> opcional, y si se encuentra, transfiere el control a esa instancia, ejecutando las declaraciones asociadas. Si no se encuentra una instancia <code>default</code>  el programa continúa la ejecución en la instrucción siguiente al final del <code>switch</code>. Por convención, la instancia <code>default</code> es la última cláusula, pero no tiene que ser así.</p>
+
+<p>La declaración <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/break" title="JavaScript/Reference/Statements/break">break</a></code> es opcional y está asociada con cada etiqueta de <code>case</code> y asegura que el programa salga del <code>switch</code> una vez que se ejecute la instrucción coincidente y continúe la ejecución en la instrucción siguiente. Si se omite el  <code>break</code>  el programa continúa la ejecución en la siguiente instrucción en la declaración de <code>switch</code> .</p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usando_switch">Usando <code>switch</code></h3>
+
+<p>En el siguiente ejemplo, si <code>expresión</code> se resuelve a "Platanos", el algoritmo compara el valor con el <code>case</code> "Platanos" y ejecuta la declaración asociada. Cuando se encuentra un <code>break</code>, el programa sale del condicional <code>switch</code> y ejecuta la declaración que lo procede. Si se omite el <code>break</code>, el <code>case</code> "Cerezas" también es ejecutado.</p>
+
+<pre class="notranslate"><code>switch (expr) {
+  case 'Naranjas':
+    console.log('El kilogramo de naranjas cuesta $0.59.');
+    break;
+  case 'Manzanas':
+    console.log('El kilogramo de manzanas cuesta $0.32.');
+    break;
+  case 'Platanos':
+    console.log('El kilogramo de platanos cuesta $0.48.');
+    break;
+  case 'Cerezas':
+    console.log('El kilogramo de cerezas cuesta $3.00.');
+    break;
+  case 'Mangos':
+  case 'Papayas':
+    console.log('El kilogramo de mangos y papayas cuesta $2.79.');
+    break;
+  default:
+    console.log('Lo lamentamos, por el momento no disponemos de ' + expr + '.');
+}
+
+console.log("¿Hay algo más que te quisiera consultar?");</code></pre>
+
+<h3 id="¿Qué_pasa_si_olvido_un_break">¿Qué pasa si olvido un break?</h3>
+
+<p>Si olvidas un <code>break</code>, el script se ejecutará desde donde se cumple la condición y ejecutará el siguiente <code>case</code> independientemente si esta condición se cumple o no. Ver el siguiente ejemplo:</p>
+
+<pre class="brush: js notranslate">var foo = 0;
+switch (foo) {
+  case -1:
+    console.log('1 negativo');
+    break;
+  case 0: // foo es 0, por lo tanto se cumple la condición y se ejecutara el siguiente bloque
+    console.log(0)
+    // NOTA: el "break" olvidado debería estar aquí
+  case 1: // No hay sentencia "break" en el 'case 0:', por lo tanto este caso también será ejecutado
+    console.log(1);
+    break; // Al encontrar un "break", no será ejecutado el 'case 2:'
+  case 2:
+    console.log(2);
+    break;
+  default:
+    console.log('default');
+}
+</pre>
+
+<h3 id="¿Puedo_usar_un_&lt;default>_entre_condiciones">¿Puedo usar un &lt;default&gt; entre condiciones?</h3>
+
+<p>Sí, ¡es posible! JavaScript retornará a la instancia <code>default</code> en caso de no encontrar una coincidencia:</p>
+
+<pre class="notranslate"><code>var foo = 5;
+switch (foo) {
+  case 2:
+    console.log(2);
+    break; // al encontrar este 'break' no se continuará con el siguiente 'default:'
+  default:
+    console.log('default')
+    // fall-through
+  case 1:
+    console.log('1');
+}</code></pre>
+
+<p>Al estar el <code>case 1:</code> a continuación de <code>default</code>, y al no haber un <code>break </code>de por medio, veremos que la declaración del <code>case 1:</code> será ejecutada, apareciendo el resultado <code>1</code> en el <em>log de consola.</em></p>
+
+<h3 id="Metodos_para_casos_con_múltiple_criterio">Metodos para casos con múltiple criterio</h3>
+
+<p>La fuente de esta técnica esta aquí:</p>
+
+<p><a href="http://stackoverflow.com/questions/13207927/switch-statement-multiple-cases-in-javascript">Switch statement multiple cases in JavaScript (Stack Overflow)</a></p>
+
+<h4 id="Operación_única_con_múltiples_casos">Operación única con múltiples casos</h4>
+
+<p>Este método toma ventaja del hecho de que, si no hay un <code>break</code> debajo de una declaración <code>case</code>, continuará la ejecución hasta el siguiente <code>case</code>, ignorando si en dicho caso se cumple o no el criterio indicado. Comprobar en la sección <em>¿Qué pasa si olvido un <code>break</code>?</em></p>
+
+<p>Este es un ejemplo de operación única con sentencia <code>switch</code> secuencial, donde cuatro valores diferentes se comportan exactamente de la misma manera:</p>
+
+<pre class="brush: js notranslate">var Animal = 'Jirafa';
+switch (Animal) {
+  case 'Vaca':
+  case 'Jirafa':
+  case 'Perro':
+  case 'Cerdo':
+    console.log('Este animal subirá al Arca de Noé.');
+    break;
+  case 'Dinosaurio':
+  default:
+    console.log('Este animal no lo hará.');
+}</pre>
+
+<h4 id="Operaciones_encadenadas_con_múltiples_casos">Operaciones encadenadas con múltiples casos</h4>
+
+<p>Este es un ejemplo de una sentencia <code>switch</code> secuencial con múltiples operaciones, donde, dependiendo del valor entero dado, se pueden recibir diferentes resultados. Esto demuestra que el algoritmo correrá en el orden en que se coloquen las declaraciones <code>case</code>, y que no tiene que ser numéricamente secuencial. En JavaScript, también es posible combinar definiciones con valores <em><code>"string"</code> </em>dentro de estas declaraciones <code>case</code>.</p>
+
+<pre class="brush: js notranslate">var foo = 1;
+var output = 'Salida: ';
+switch (foo) {
+  case 10:
+    output += '¿Y ';
+  case 1:
+    output += 'Cuál ';
+    output += 'Es ';
+  case 2:
+    output += 'Tu ';
+  case 3:
+    output += 'Nombre';
+  case 4:
+    output += '?';
+    console.log(output);
+    break;
+  case 5:
+    output += '!';
+    console.log(output);
+    break;
+  default:
+    console.log('Por favor, selecciona un valor del 1 al 6.');
+}</pre>
+
+<p>La salida (output) de este ejemplo:</p>
+
+<table class="standard-table" style="height: 270px; width: 522px;">
+ <tbody>
+  <tr>
+   <th scope="col">Value</th>
+   <th scope="col">Log text</th>
+  </tr>
+  <tr>
+   <td>foo es NaN o no es 1, 2, 3, 4, 5 ni 10</td>
+   <td>Por favor, selecciona un valor del 1 al 6.</td>
+  </tr>
+  <tr>
+   <td>10</td>
+   <td>Salida: ¿Y Cuál Es Tu Nombre?</td>
+  </tr>
+  <tr>
+   <td>1</td>
+   <td>Salida: Cuál Es Tu Nombre?</td>
+  </tr>
+  <tr>
+   <td>2</td>
+   <td>Salida: Tu Nombre?</td>
+  </tr>
+  <tr>
+   <td>3</td>
+   <td>Salida: Nombre?</td>
+  </tr>
+  <tr>
+   <td>4</td>
+   <td>Salida: ?</td>
+  </tr>
+  <tr>
+   <td>5</td>
+   <td>Salida: !</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Variables_centradas_en_bloques_sin_un_estamento_de_switch">Variables centradas en bloques sin un estamento de switch</h3>
+
+<p>Con ECMAScript 2015 (ES6) </p>
+
+<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/if...else"><code>if...else</code></a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/throw/index.html b/files/es/web/javascript/reference/statements/throw/index.html
new file mode 100644
index 0000000000..c7776414d0
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/throw/index.html
@@ -0,0 +1,154 @@
+---
+title: throw
+slug: Web/JavaScript/Reference/Statements/throw
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/throw
+original_slug: Web/JavaScript/Referencia/Sentencias/throw
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Lanza una excepcion definida por el usuario.</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">throw <em>expresion</em>;</pre>
+
+<dl>
+ <dt><code>expresion</code></dt>
+ <dd>Expresión a lanzar.</dd>
+</dl>
+
+<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
+
+<p>Utilice la sentencia <code>throw</code> para lanzar una excepción. Cuando lanza una excepción, <code>expresion</code> especifica el valor de la excepción. Cada uno de los siguientes ejemplos lanza una excepción:</p>
+
+<pre class="brush: js">throw "Error2"; // genera una excepción con un valor cadena
+throw 42; // genera una excepción con un valor 42
+throw true; // genera una excepción con un valor true</pre>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="Ejemplo:_Lanzar_un_objeto" name="Ejemplo:_Lanzar_un_objeto">Ejemplo: Lanzar un objeto</h3>
+
+<p>Puede especificar un objeto cuando lanza una excepción. Puede entonces referenciar las propiedades del objeto en el bloque <code>catch</code>. El siguiente ejemplo crea un objeto <code>miExcepcionUsuario</code> del tipo <code>ExceptionUsuario</code> y la utiliza usándola en una sentencia <code>throw</code>.</p>
+
+<pre class="brush: js">function ExceptionUsuario(mensaje) {
+   this.mensaje = mensaje;
+   this.nombre = "ExceptionUsuario";
+}
+
+function getNombreMes(mes) {
+   mes = mes - 1; // Ajustar el número de mes al índice del arreglo (1 = Ene, 12 = Dic)
+   var meses = new Array("Ene", "Feb", "Mar", "Abr", "May", "Jun", "Jul",
+      "Ago", "Sep", "Oct", "Nov", "Dic");
+   if (meses[mes] != null) {
+      return meses[mes];
+   } else {
+      miExcepcionUsuario = new ExceptionUsuario("NumeroMesNoValido");
+      throw miExcepcionUsuario;
+   }
+}
+
+try {
+   // sentencias para try
+   nombreMes = getNombreMes(miMes);
+} catch (excepcion) {
+   nombreMes = "desconocido";
+   registrarMisErrores(excepcion.mensaje, excepcion.nombre); // pasa el objeto exception al manejador de errores
+}
+</pre>
+
+<h3 id="Ejemplo:_Otro_ejemplo_sobre_lanzar_un_objeto" name="Ejemplo:_Otro_ejemplo_sobre_lanzar_un_objeto">Ejemplo: Otro ejemplo sobre lanzar un objeto</h3>
+
+<p>El siguiente ejemplo comprueba una cadena de entrada para un código postal de EE.UU. Si el código postal utiliza un formato no válido, la sentencia throw lanza una excepción creando un objeto de tipo <code>ExcepcionFormatoCodigoPostal</code>.</p>
+
+<pre class="brush: js">/*
+ * Creates a ZipCode object.
+ *
+ * Accepted formats for a zip code are:
+ *    12345
+ *    12345-6789
+ *    123456789
+ *    12345 6789
+ *
+ * If the argument passed to the ZipCode constructor does not
+ * conform to one of these patterns, an exception is thrown.
+ */
+
+function ZipCode(zip) {
+   zip = new String(zip);
+   pattern = /[0-9]{5}([- ]?[0-9]{4})?/;
+   if (pattern.test(zip)) {
+      // zip code value will be the first match in the string
+      this.value = zip.match(pattern)[0];
+      this.valueOf = function() {
+         return this.value
+      };
+      this.toString = function() {
+         return String(this.value)
+      };
+   } else {
+      throw new ExcepcionFormatoCodigoPostal(zip);
+   }
+}
+
+function ExcepcionFormatoCodigoPostal(valor) {
+   this.valor = valor;
+   this.mensaje = "no conforme con el formato esperado de código postal";
+   this.toString = function() {
+      return this.valor + this.mensaje
+   };
+}
+
+/*
+ * Esto podría estar en un script que valida los datos de una dirección de EE.UU.
+ */
+
+var CODIGOPOSTAL_NOVALIDO = -1;
+var CODIGOPOSTAL_DESCONOCIDO_ERROR = -2;
+
+function verificarCodigoPostal(codigo) {
+   try {
+      codigo = new CodigoPostal(codigo);
+   } catch (excepcion) {
+      if (excepcion instanceof ExcepcionFormatoCodigoPostal) {
+         return CODIGOPOSTAL_NOVALIDO;
+      } else {
+         return CODIGOPOSTAL_DESCONOCIDO_ERROR;
+      }
+   }
+   return codigo;
+}
+
+a = verificarCodigoPostal(95060);         // devuelve 95060
+b = verificarCodigoPostal(9560;)          // devuelve -1
+c = verificarCodigoPostal("a");           // devuelve -1
+d = verificarCodigoPostal("95060");       // devuelve 95060
+e = verificarCodigoPostal("95060 1234");  // devuelve 95060 1234
+</pre>
+
+<h3 id="Ejemplo:_Relanzar_una_excepci.C3.B3n" name="Ejemplo:_Relanzar_una_excepci.C3.B3n">Ejemplo: Relanzar una excepción</h3>
+
+<p>Puede usar <code>throw</code> para volver a lanzar una excepción después de cogerla. El siguiente ejemplo coge una excepción con un valor numérico y la vuelve a lanzar si el valor es superior a 50. La excepción relanzada propaga hacia arriba la función adjunta o a un nivel superior para que el usuario pueda verla.</p>
+
+<pre class="eval">try {
+   throw n; // lanza una excepción con un valor numérico
+} catch (excepcion) {
+   if (excepcion &lt;= 50) {
+      // sentencias para manejar la excepción 1-50
+   } else {
+      // no se puede manejar esta excepción, así que se vuelve a lanzar
+      throw excepcion;
+   }
+}
+</pre>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/try...catch", "try...catch")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/try...catch/index.html b/files/es/web/javascript/reference/statements/try...catch/index.html
new file mode 100644
index 0000000000..6985695ccb
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/try...catch/index.html
@@ -0,0 +1,255 @@
+---
+title: try...catch
+slug: Web/JavaScript/Reference/Statements/try...catch
+tags:
+  - Error
+  - Excepción
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/try...catch
+original_slug: Web/JavaScript/Referencia/Sentencias/try...catch
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La declaración <strong><code>try...catch</code></strong> señala un bloque de instrucciones a intentar (<strong><code>try</code></strong>), y especifica una respuesta si se produce una excepción (<strong><code>catch</code></strong>).</p>
+
+<div>{{EmbedInteractiveExample("pages/js/statement-trycatch.html")}}</div>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">try {
+   <em>try_statements</em>
+}
+[catch (<em>exception_var_1</em> if <em>condition_1</em>) { // non-standard
+   <em>catch_statements_1</em>
+}]
+...
+[catch (<em>exception_var_2</em>) {
+   <em>catch_statements_2</em>
+}]
+[finally {
+   <em>finally_statements</em>
+}]
+</pre>
+
+<dl>
+ <dt><code>try_statements</code></dt>
+ <dd>Las sentencias que serán ejecutadas.</dd>
+</dl>
+
+<dl>
+ <dt><code>catch_statements_1</code>, <code>catch_statements_2</code></dt>
+ <dd>Sentencias que se ejecutan si una excepción es lanzada en el bloque <code>try</code>.</dd>
+</dl>
+
+<dl>
+ <dt><code>exception_var_1</code>, <code>exception_var_2</code></dt>
+ <dd>Identificador que contiene un objeto de excepcion asociado a la cláusula <code>catch</code>.</dd>
+</dl>
+
+<dl>
+ <dt><code>condition_1</code></dt>
+ <dd>Una expresión condicional.</dd>
+</dl>
+
+<dl>
+ <dt><code>finally_statements</code></dt>
+ <dd>Sentencias que se ejecutan después de que se completa la declaración <code>try</code> . Estas sentencias se ejecutan independientemente de si una excepcion fue lanzada o capturada.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>La sentencia <code>try</code> consiste en un bloque <code>try</code> que contiene una o más sentencias. Las llaves <code>{}</code> se deben utilizar siempre<code>,</code> incluso para una bloques de una sola sentencia. Al menos un bloque <code>catch</code> o un bloque <code>finally</code> debe estar presente. Esto nos da tres formas posibles para la sentencia <code>try</code>:</p>
+
+<ol>
+ <li><code>try...catch</code></li>
+ <li><code>try...finally</code></li>
+ <li><code>try...catch...finally</code></li>
+</ol>
+
+<p>Un bloque <code>catch</code> contiene sentencias que especifican que hacer si una excepción es lanzada en el bloque <code>try</code>. Si cualquier sentencia dentro del bloque <code>try</code> (o en una funcion llamada desde dentro del bloque <code>try</code>) lanza una excepción, el control cambia inmediatamente al bloque <code>catch</code> . Si no se lanza ninguna excepcion en el bloque <code>try</code>, el bloque <code>catch</code> se omite.</p>
+
+<p>La bloque <code>finally</code> se ejecuta despues del bloque <code>try</code> y el/los bloque(s) <code>catch</code> hayan finalizado su ejecución. Éste bloque siempre se ejecuta, independientemente de si una excepción fue lanzada o capturada.</p>
+
+<p>Puede anidar una o más sentencias <code>try</code>. Si una sentencia <code>try</code> interna no tiene una bloque <code>catch</code>, se ejecuta el bloque <code>catch</code> de la sentencia <code>try</code> que la encierra.</p>
+
+<p>Usted también puede usar la declaración <code>try</code> para manejar excepciones de JavaScript. Consulte la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide">Guía de JavaScript</a> para obtener mayor información sobre excepciones de JavaScript.<br>
+  </p>
+
+<h3 id="Bloque_catch_incondicional">Bloque catch incondicional</h3>
+
+<p>Cuando solo se utiliza un bloque <code>catch</code>, el bloque <code>catch</code> es ejecutado cuando cualquier excepción es lanzada. Por ejemplo, cuando la excepción ocurre en el siguiente código, el control se transfiere a la cláusula <code>catch</code>.</p>
+
+<pre class="brush: js">try {
+   throw "myException"; // genera una excepción
+}
+catch (e) {
+   // sentencias para manejar cualquier excepción
+   logMyErrors(e); // pasa el objeto de la excepción al manejador de errores
+}
+</pre>
+
+<p>El bloque <code>catch</code> especifíca un identificador ( <code>e</code> en el ejemplo anterior) que contiene el valor de la excepción. Este valor está solo disponible en el {{Glossary("Scope", "scope")}} de el bloque<code> catch</code></p>
+
+<h3 id="Bloques_catch_condicionales">Bloques catch condicionales</h3>
+
+<p>Tambien se pueden crear "bloques <code>catch</code> condicionales", combinando bloques <code>try...catch</code> con estructuras  <code>if...else if...else</code> como estas:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
+    <span class="function token">myroutine</span><span class="punctuation token">();<code class="language-js"><span class="comment token">  </span></code></span><span class="comment token">// puede lanzar tres tipos de excepciones</span><span class="punctuation token"><code class="language-js">
+</code>}</span> <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">e</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    <span class="keyword token">if</span> <span class="punctuation token">(</span>e <span class="keyword token">instanceof</span> <span class="class-name token">TypeError</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="comment token">// sentencias para manejar excepciones TypeError</span>
+    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>e <span class="keyword token">instanceof</span> <span class="class-name token">RangeError</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="comment token">// sentencias para manejar excepciones RangeError</span>
+    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>e <span class="keyword token">instanceof</span> <span class="class-name token">EvalError</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+        <span class="comment token">// sentencias para manejar excepciones EvalError</span>
+    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="punctuation token">{</span>
+       <span class="comment token">// sentencias para manejar cualquier excepción no especificada</span>
+       <span class="function token">logMyErrors</span><span class="punctuation token">(</span>e<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// </span><span class="punctuation token">pasa el objeto de la excepción al manejador de errores</span>
+<span class="punctuation token">}</span></code></pre>
+
+<h3 id="The_exception_identifier" name="The_exception_identifier">El identificador de excepciones</h3>
+
+<p>Cuando una excepción es lanzada en el bloque <code>try</code>, <code><em>exception_var</em></code> (por ejemplo, la <code>e</code> en <code>catch (e)</code>) guarda el valor de la excepción. Se puede usar éste identificador para obtener información acerca de la excepción que fue lanzada. Este valor está solo disponible en el {{Glossary("Scope", "scope")}} de el bloque<code> catch.</code></p>
+
+<pre class="brush: js">function isValidJSON(text) {
+  try {
+    JSON.parse(text);
+    return true;
+  } catch {
+    return false;
+  }
+}</pre>
+
+<h3 id="The_finally_clause" name="The_finally_clause">La cláusula <code>finally</code></h3>
+
+<p>La cláusula <code>finally</code> contiene sentencias a ejecutarse después de que las cláusulas <code>try</code> y <code>catch</code> se ejecuten, pero antes de las sentencias que le siguen al bloque <code>try..catch..finally</code>. Note que la cláusula <code>finally</code> se ejecuta sin importar si una excepción es o no lanzada. Si una excepción es lanzada, las instrucciones en la cláusula <code>finally</code> se ejecutan incluso si ninguna cláusula <code>catch</code> maneja la excepción.</p>
+
+<p>Usted puede usar la cláusula finally para hacer que su script falle plácidamente cuando una excepción ocurra; por ejemplo, para hacer una limpieza general, usted puede necesitar liberar un recurso que su script haya retenido.</p>
+
+<p>Puede parecer extraño tener una cláusula relacionada a una excepción que se ejecuta sin importar si hay una excepción o no, pero esta concepción en realidad sirve a un propósito. El punto importante no es que la cláusula <code>finally</code> siempre se ejecuta, si no más bien que el codigo ordinario que le sigue a <code>try..catch</code> no.</p>
+
+<p>Por ejemplo, si otra excepción ocurre dentro de un bloque <code>catch</code> de una declaración <code>try</code>, cualquier codigo restante en el mismo bloque exterior <code>try</code> que encierra ese <code>try..catch</code> (o en el flujo principal, si no es un bloque <code>try</code> exterior) , no será ejecutado, dado que el control es inmediatamente transferido al bloque <code>catch</code> del <code>try</code> exterior (o el generador de error interno, si no es en un bloque <code>try</code>).</p>
+
+<p>Por lo tanto, cualquier rutina de limpieza hecha en esa sección encerrada (o la principal) antes de que exista, será saltada. Sin embargo, si la declaración <code>try</code> tiene un bloque <code>finally</code>, entonces el código de ese bloque <code>finally</code> será ejecutado primero para permitir tal limpieza, y ENTONCES el bloque <code>catch</code> de la otra declaración <code>try</code> (o el generador de error) tomará el control para manejar la segunda excepción.</p>
+
+<p>Ahora, si esa rutina de limpieza debiera ser hecha ya sea que el código del <code>try..catch</code> tenga éxito o no, entonces si el bloque <code>finally</code> se ejecutase solo después de una excepción, el mismo código de limpieza tendría que estar presente dentro y fuera del bloque <code>finally</code>, y por lo tanto no hay razón para no tener el bloque <code>finally</code> solo, y dejarlo ejecutarse sin importar si hay excepciones o no.</p>
+
+<p>El siguiente ejemplo abre un archivo y despues ejecuta sentencias que usan el archivo (JavaScript del lado del servidor permite acceder a archivos). Si una excepción es lanzada mientras el archivo está abierto, la cláusula <code>finally</code> cierra el archivo antes de que el script falle. El código en <code>finally</code> también se ejecuta después de un retorno explícito de los bloques <code>try</code> o <code>catch</code>.</p>
+
+<pre class="brush: js">openMyFile()
+try {
+   // retiene un recurso
+   writeMyFile(theData);
+}
+finally {
+   closeMyFile(); // siempre cierra el recurso
+}
+</pre>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<h3 id="The_finally_clause" name="The_finally_clause">Bloques try anidados</h3>
+
+<p>Primero, veamos que pasa con esto:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
+  <span class="keyword token">try</span> <span class="punctuation token">{</span>
+    <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">finally</span> <span class="punctuation token">{</span>
+    console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+<span class="punctuation token">}</span>
+<span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="comment token">// Output:</span>
+<span class="comment token">// "finally"</span>
+<span class="comment token">// "outer" "oops"</span></code></pre>
+
+<p>Ahora, si nosotros ya capturamos la excepción en una declaración try interna agregando un bloque catch.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
+  <span class="keyword token">try</span> <span class="punctuation token">{</span>
+    <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'inner'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">finally</span> <span class="punctuation token">{</span>
+    console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+<span class="punctuation token">}</span>
+<span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="comment token">// Output:</span>
+<span class="comment token">// "inner" "oops"</span>
+<span class="comment token">// "finally"</span></code></pre>
+
+<p>Y ahora vamos a relanzar el error.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
+  <span class="keyword token">try</span> <span class="punctuation token">{</span>
+    <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'inner'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="keyword token">throw</span> ex<span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">finally</span> <span class="punctuation token">{</span>
+    console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+<span class="punctuation token">}</span>
+<span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="comment token">// Output:</span>
+<span class="comment token">// "inner" "oops"</span>
+<span class="comment token">// "finally"</span>
+<span class="comment token">// "outer" "oops"</span></code></pre>
+
+<p>Cualquier excepción dad será capturada solo una vez por el bloque catch más cercano a menos que sea relanzado. Por supuesto cualquier nueva excepción que se origine en el bloque 'interno' (porque el código en el bloque catch puede hacer algo que lanze un error), será capturado por el bloque 'externo'.</p>
+
+<h3 id="Retornando_de_un_bloque_finally">Retornando de un bloque finally</h3>
+
+<p>Si el bloque <code>finally</code> retorna un valor, este valor se convierte en el valor de retorno de toda la producción <code>try-catch-finally</code>, a pesar de cualquier sentencia <code>return</code> en los bloques <code>try</code> y <code>catch</code>. Esto incluye excepciones lanzadas dentro del bloque catch.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">try</span> <span class="punctuation token">{</span>
+    <span class="keyword token">try</span> <span class="punctuation token">{</span>
+      <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+      console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'inner'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
+      <span class="keyword token">throw</span> ex<span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+    <span class="keyword token">finally</span> <span class="punctuation token">{</span>
+      console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+      <span class="keyword token">return</span><span class="punctuation token">;</span>
+    <span class="punctuation token">}</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+    console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+<span class="comment token">// Output:</span>
+<span class="comment token">// "inner" "oops"</span>
+<span class="comment token">// "finally"</span></code></pre>
+
+<p>El "oops" externo no es lanzado debido al retorno en el bloque finally. Lo mismo aplicaría para cualquier valor retornado del bloque catch.</p>
+
+<p>Vea los ejemplos para {{jsxref("Sentencias/throw", "throw")}}.</p>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea también</h2>
+
+<ul>
+ <li>{{jsxref("Error")}}</li>
+ <li>{{jsxref("Sentencias/throw", "throw")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/var/index.html b/files/es/web/javascript/reference/statements/var/index.html
new file mode 100644
index 0000000000..3559792940
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/var/index.html
@@ -0,0 +1,164 @@
+---
+title: var
+slug: Web/JavaScript/Reference/Statements/var
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/var
+original_slug: Web/JavaScript/Referencia/Sentencias/var
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<h2 id="Summary" name="Summary">Resumen</h2>
+
+<p>La sentencia <strong><code>var</code></strong> declara una variable, opcionalmente inicializándola con un valor.</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox"><code><strong>var</strong> <em>nombreDeVariable1 [= valor1] [, nombreDeVariable2 [= valor2] ... [, nombreDeVariableN [=valorN]]]; </em></code></pre>
+
+<dl>
+ <dt><code>nombreDeVariableN</code></dt>
+ <dd>Representa el nombre que el programador da a la variable. Puede ser cualquier identificador legal.</dd>
+</dl>
+
+<dl>
+ <dt><code>valorN</code></dt>
+ <dd>Valor inicial de la variable. Puede ser cualquier expresión legal. El valor predeterminado es <em>undefined</em> (en español, <em>indefinida</em>).</dd>
+</dl>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Las  declaraciones de variables, donde sea que ocurran, son procesadas antes de que cualquier otro código sea ejecutado. El ámbito de una variable declarada con la palabra reservada <strong><code>var</code></strong> es su <em>contexto de ejecución</em> en curso<em>,</em> que puede ser la función que la contiene o, para las variables declaradas afuera de cualquier función, un ámbito global. Si re-declaras una variable Javascript, esta no perderá su valor.</p>
+
+<p>Asignar un valor a una variable no declarada implica crearla como variable global (se convierte en una propiedad del objeto global) cuando la asignación es ejecutada. Las diferencias entre una variable declarada y otra sin declarar son:</p>
+
+<p>1. Las variables declaradas se limitan al contexto de ejecución en el cual son declaradas. Las variables no declaradas siempre son globales.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">x</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  y <span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span>   <span class="comment token">// Lanza un error de tipo "ReferenceError" en modo estricto ('use strict')</span>
+  <span class="keyword token">var</span> z <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="function token">x</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime "1" </span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>z<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError": z no está definida afuera de x</span></code></pre>
+
+<p>2. Las variables declaradas son creadas antes de ejecutar cualquier otro código. Las variables sin declarar no existen hasta que el código que las asigna es ejecutado.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>a<span class="punctuation token">)</span><span class="punctuation token">;</span>                <span class="comment token">// Lanza un error de tipo "ReferenceError".</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'trabajando...'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Nunca se ejecuta.</span></code></pre>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a<span class="punctuation token">;</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>a<span class="punctuation token">)</span><span class="punctuation token">;</span>                <span class="comment token">// Imprime "undefined" o "" dependiendo del navegador.</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'trabajando...'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime "</span><span class="string token">trabajando</span><span class="comment token">...".</span></code></pre>
+
+<p>3. Las variables declaradas son una propiedad no-configurable de su contexto de ejecución (de función o global). Las variables sin declarar son configurables (p. ej. pueden borrarse).</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span>
+b <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>
+
+<span class="keyword token">delete</span> <span class="keyword token">this</span><span class="punctuation token">.</span>a<span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError" en modo estricto ('use strict'), de lo contrario falla silenciosamente.</span>
+<span class="keyword token">delete</span> <span class="keyword token">this</span><span class="punctuation token">.</span>b<span class="punctuation token">;</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>a<span class="punctuation token">,</span> b<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError". </span>
+<span class="comment token">// La propiedad 'b' se eliminó y ya no existe.</span></code></pre>
+
+<p>Debido a esas tres diferencias, fallar al declarar variables muy probablemente llevará a resultados inesperados. Por tanto <strong>se recomienda siempre declarar las variables, sin importar si están en una función o un ámbito global</strong>. Y en el modo estricto (<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">strict mode</a>) de ECMAScript 5, asignar valor a una variable sin declarar lanzará un error.</p>
+
+<h3 id="Elevación_de_variables">Elevación de variables</h3>
+
+<p>Como la declaración de variables (y todas las declaraciones en general) se procesa antes de ejecutar cualquier código, declarar una variable en cualquier parte del código es equivalente a declararla al inicio del mismo. Esto también significa que una variable puede parecer usarse antes de ser declarada. Este comportamiento es llamado <em>hoisting </em>(del inglés "elevación"), ya que la declaración de una variable parecer haber sido movida a la cima de la función o código global.</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">bla <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> bla<span class="punctuation token">;</span>
+<span class="comment token">// ...</span>
+
+<span class="comment token">// Es entendido implicitamente como:</span>
+
+<span class="keyword token">var</span> bla<span class="punctuation token">;</span>
+bla <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span></code></pre>
+
+<p>Por esa razón, se recomienda siempre declarar variables al inicio de su ámbito (la cima del código global y la cima del código de función) para que sea claro cuáles variables pertenecen al ámbito de función (local) y cuáles son resueltas en la cadena de ámbito.</p>
+
+<p>Es importante señalar que <strong>la elevación afectará la declaración</strong> de variables, pero <strong>no su inicialización</strong>. El valor será asignado precisamente cuando la sentencia de asignación sea alcanzada:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">haz_algo</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// undefined (valor indefinido)</span>
+  <span class="keyword token">var</span> bar <span class="operator token">=</span> <span class="number token">111</span><span class="punctuation token">;</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 111</span>
+<span class="punctuation token">}</span>
+
+<span class="comment token">// Se entiende implícitamente como: </span>
+<span class="keyword token">function</span> <span class="function token">haz_algo</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">var</span> bar<span class="punctuation token">;</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// undefined (valor indefinido)</span>
+  bar <span class="operator token">=</span> <span class="number token">111</span><span class="punctuation token">;</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 111</span>
+<span class="punctuation token">}</span></code></pre>
+
+<p> </p>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Declarando_e_inicializando_dos_variables">Declarando e inicializando dos variables</h3>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">,</span> b <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span></code></pre>
+
+<h3 id="Asignando_dos_variables_con_un_solo_valor_de_cadena">Asignando dos variables con un solo valor de cadena</h3>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="string token">'A'</span><span class="punctuation token">;</span>
+<span class="keyword token">var</span> b <span class="operator token">=</span> a<span class="punctuation token">;</span>
+
+<span class="comment token">// Equivalente a:</span>
+
+<span class="keyword token">var</span> a<span class="punctuation token">,</span> b <span class="operator token">=</span> a <span class="operator token">=</span> <span class="string token">'A'</span><span class="punctuation token">;</span></code></pre>
+
+<p>Sé consciente del orden:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> y<span class="punctuation token">,</span> y <span class="operator token">=</span> <span class="string token">'A'</span><span class="punctuation token">;</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x <span class="operator token">+</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprimirá "undefinedA"</span></code></pre>
+
+<p>Aquí, '<code>x</code>' &amp; '<code>y</code>' son declaradas antes de ejecutarse cualquier código, y la asignación ocurre después. Al momento de evaluar "<code>x = y</code>", '<code>y</code>' existe así que ningún error "<code>ReferenceError</code>" es lanzado y su valor es '<code>undefined</code>', de modo que '<code>x</code>' también tiene asignada el valor '<code>undefined</code>'. Después, a 'y' se le asigna el valor 'A'. Consecuentemente, luego de la primera línea, '<code>x</code>' es exactamente igual a <code>'undefined</code>' &amp; '<code>y</code>' es igual a <code>'A'</code>, de ahí el resultado.</p>
+
+<h3 id="Initialización_de_muchas_variables">Initialización de muchas variables</h3>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
+
+<span class="keyword token">function</span> <span class="function token">f</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
+  <span class="keyword token">var</span> x <span class="operator token">=</span> y <span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span> <span class="comment token">// 'x' es declarada localmente, ¡'y' no lo es!</span>
+<span class="punctuation token">}</span>
+<span class="function token">f</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError" en modo estricto ('y' no está definida). De lo contrario se imprimiría "0, 1".</span>
+<span class="comment token">// En modo no-estricto:</span>
+<span class="comment token">// 'x' es la variable global como se esperaría</span>
+<span class="comment token">// 'y' sin embargo, se sale de la función</span></code></pre>
+
+<h3 id="Globales_implícitas_y_ámbito_externo_a_una_función">Globales implícitas y ámbito externo a una función</h3>
+
+<p>Las variables que parecen ser globales implícitas pueden ser referencias a variables en un ámbito externo a  la función:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>  <span class="comment token">// 'x' es declarada globalmente, luego se le asigna el valor 0</span>.
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="keyword token">typeof</span> z<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime "undefined", pues 'z' aún no existe</span>.
+
+<span class="keyword token">function</span> <span class="function token">a</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="comment token">// Cuando 'a()' es invocada,</span>
+  <span class="keyword token">var</span> y <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>   <span class="comment token">// 'y' es declarada localmente en la function 'a()', después se le asigna el valor 2</span>.
+
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span>   <span class="comment token">// Imprime "0, 2</span>".
+
+  <span class="keyword token">function</span> <span class="function token">b</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>       <span class="comment token">// Cuando 'b()' es invocada,</span>
+    x <span class="operator token">=</span> <span class="number token">3</span><span class="punctuation token">;</span>  <span class="comment token">// Asigna el valor 3 a la global 'x' ya existente, no crea una nueva variable global.</span>
+    y <span class="operator token">=</span> <span class="number token">4</span><span class="punctuation token">;</span>  <span class="comment token">// Asigna 4 a la externa existente 'y', no crea una nueva variable global.</span>
+    z <span class="operator token">=</span> <span class="number token">5</span><span class="punctuation token">;</span>  <span class="comment token">// Crea una nueva variable global 'z' y le asigna un valor de 5. </span>
+  <span class="punctuation token">}</span>         <span class="comment token">// (Lanza un error de tipo "ReferenceError" en modo estricto.)</span>
+
+  <span class="function token">b</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>     <span class="comment token">// Invocar 'b()' crea 'z' como variable global.</span>
+  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> y<span class="punctuation token">,</span> z<span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// Imprime "3, 4, 5</span>".
+<span class="punctuation token">}</span>
+
+<span class="function token">a</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>                   <span class="comment token">// Invocar 'a()' también llama a 'b</span>()'.
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> z<span class="punctuation token">)</span><span class="punctuation token">;</span>     <span class="comment token">// Imprime "3, 5</span>", porque 'z' ya es una global.
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="keyword token">typeof</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime 'undefined' porque 'y' es local en la función 'a()'</span></code></pre>
diff --git a/files/es/web/javascript/reference/statements/while/index.html b/files/es/web/javascript/reference/statements/while/index.html
new file mode 100644
index 0000000000..dc51ec1980
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/while/index.html
@@ -0,0 +1,59 @@
+---
+title: while
+slug: Web/JavaScript/Reference/Statements/while
+tags:
+  - JavaScript
+  - Statement
+translation_of: Web/JavaScript/Reference/Statements/while
+original_slug: Web/JavaScript/Referencia/Sentencias/while
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<h2 id="Resumen" name="Resumen">Resumen</h2>
+
+<p>Crea un bucle que ejecuta una sentencia especificada mientras cierta condición se evalúe como verdadera. Dicha condición es evaluada antes de ejecutar la sentencia</p>
+
+<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
+
+<pre class="eval">while (<em>condicion</em>)
+  <em>sentencia</em>
+</pre>
+
+<dl>
+ <dt><code>condicion</code></dt>
+ <dd>Una expresión que se evalúa antes de cada paso del bucle. Si esta condición se evalúa como verdadera, se ejecuta <code>sentencia</code>. Cuando la condición se evalúa como false, la ejecución continúa con la <code>sentencia </code>posterior al bucle <code>while</code>.</dd>
+</dl>
+
+<dl>
+ <dt><code>sentencia</code></dt>
+ <dd>Una sentecia que se ejecuta mientras la condición se evalúa como verdadera. Para ejecutar múltiples sentencias dentro de un bucle, utiliza una sentencia {{jsxref("Sentencias/block", "block")}} (<code>{ ... }</code>) para agrupar esas sentencias.</dd>
+</dl>
+
+<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
+
+<p>El siguiente bucle <code>while</code> itera mientras <code>n</code> es menor que tres.</p>
+
+<pre class="brush: js">n = 0;
+x = 0;
+while (n &lt; 3) {
+  n ++;
+  x += n;
+}
+</pre>
+
+<p>Cada interación, el bucle incrementa <code>n</code> y la añade a <code>x</code>. Por lo tanto, <code>x</code> y <code>n</code> toman los siguientes valores:</p>
+
+<ul>
+ <li>Después del primer pase: <code>n</code> = 1 y <code>x</code> = 1</li>
+ <li>Después del segundo pase: <code>n</code> = 2 y <code>x</code> = 3</li>
+ <li>Después del tercer pase: <code>n</code> = 3 y <code>x</code> = 6</li>
+</ul>
+
+<p>Después de completar el tercer pase, la condición <code>n</code> &lt; 3 no será verdadera más tiempo, por lo que el bucle terminará.</p>
+
+<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
+
+<ul>
+ <li>{{jsxref("Sentencias/do...while", "do...while")}}</li>
+ <li>{{jsxref("Sentencias/for", "for")}}</li>
+</ul>
diff --git a/files/es/web/javascript/reference/statements/with/index.html b/files/es/web/javascript/reference/statements/with/index.html
new file mode 100644
index 0000000000..9ad9f256c4
--- /dev/null
+++ b/files/es/web/javascript/reference/statements/with/index.html
@@ -0,0 +1,167 @@
+---
+title: with
+slug: Web/JavaScript/Reference/Statements/with
+translation_of: Web/JavaScript/Reference/Statements/with
+original_slug: Web/JavaScript/Referencia/Sentencias/with
+---
+<div class="warning">El uso de la declaración no es recomendado,  ya que puede ser el origen de los errores de confusión y problemas de compatibilidad. See the "Ambiguity Con" paragraph in the "Description" section below for details.</div>
+
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>La <strong>sentencia with</strong> extiende el alcance de una cadena con la declaración.</p>
+
+<h2 id="Sintaxis">Sintaxis</h2>
+
+<pre class="syntaxbox">with (expresión) {
+  <em>declaración</em>
+}
+</pre>
+
+<dl>
+ <dt><font face="Consolas, Liberation Mono, Courier, monospace">expresión</font></dt>
+ <dd>Añade la expresión dada a la declaración. Los parentesis alrededor de la expresión son necesarios.</dd>
+ <dt><code>declaración</code></dt>
+ <dd>Se puede ejecutar cualquier declaración. Para ejecutar varias declaraciónes, utilizar una declaración de bloque ({ ... }) para agrupar esas declaraciónes.</dd>
+</dl>
+
+<h2 id="Descripción">Descripción</h2>
+
+<p>JavaScript looks up an unqualified name by searching a scope chain associated with the execution context of the script or function containing that unqualified name. The 'with' statement adds the given object to the head of this scope chain during the evaluation of its statement body. If an unqualified name used in the body matches a property in the scope chain, then the name is bound to the property and the object containing the property. Otherwise a {{jsxref("ReferenceError")}} is thrown.</p>
+
+<div class="note">Using <code>with</code> is not recommended, and is forbidden in ECMAScript 5 <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode" title="JavaScript/Strict mode">strict mode</a>. The recommended alternative is to assign the object whose properties you want to access to a temporary variable.</div>
+
+<h3 id="Performance_pro_contra">Performance pro &amp; contra</h3>
+
+<p><strong>Pro:</strong> The <code>with</code> statement can help reduce file size by reducing the need to repeat a lengthy object reference without performance penalty. The scope chain change required by 'with' is not computationally expensive. Use of 'with' will relieve the interpreter of parsing repeated object references. Note, however, that in many cases this benefit can be achieved by using a temporary variable to store a reference to the desired object.</p>
+
+<p><strong>Contra:</strong> The <code>with</code> statement forces the specified object to be searched first for all name lookups. Therefore all identifiers that aren't members of the specified object will be found more slowly in a 'with' block. Where performance is important, 'with' should only be used to encompass code blocks that access members of the specified object.</p>
+
+<h3 id="Ambiguity_contra">Ambiguity contra</h3>
+
+<p><strong>Contra:</strong> The <code>with</code> statement makes it hard for a human reader or JavaScript compiler to decide whether an unqualified name will be found along the scope chain, and if so, in which object. So given this example:</p>
+
+<pre class="brush: js">function f(x, o) {
+  with (o)
+    print(x);
+}</pre>
+
+<p>Only when <code>f</code> is called is <code>x</code> either found or not, and if found, either in <code>o</code> or (if no such property exists) in <code>f</code>'s activation object, where <code>x</code> names the first formal argument. If you forget to define <code>x</code> in the object you pass as the second argument, or if there's some similar bug or confusion, you won't get an error -- just unexpected results.</p>
+
+<p><strong>Contra: </strong>Code using <code>with</code> may not be forward compatible, especially when used with something else than a plain object. Consider this example:</p>
+
+<div>
+<pre class="brush:js">function f(foo, values) {
+    with (foo) {
+        console.log(values)
+    }
+}
+</pre>
+
+<p>If you call <code>f([1,2,3], obj)</code> in an ECMAScript 5 environment, then the <code>values</code> reference inside the <code>with</code> statement will resolve to <code>obj</code>. However, ECMAScript 6 introduces a <code>values</code> property on <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype">Array.prototype</a></code> (so that it will be available on every array). So, in a JavaScript environment that supports ECMAScript 6, the <code>values</code> reference inside the <code>with</code> statement will resolve to <code>[1,2,3].values</code>.</p>
+</div>
+
+<h2 id="Examples">Examples</h2>
+
+<h3 id="Using_with">Using <code>with</code></h3>
+
+<p>The following <code>with</code> statement specifies that the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math" title="JavaScript/Reference/Global_Objects/Math"><code>Math</code></a> object is the default object. The statements following the <code>with</code> statement refer to the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI" title="JavaScript/Reference/Global_Objects/Math/PI"><code>PI</code></a> property and the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/cos" title="JavaScript/Reference/Global_Objects/Math/cos"><code>cos</code></a> and <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sin" title="JavaScript/Reference/Global_Objects/Math/sin"><code>sin</code></a> methods, without specifying an object. JavaScript assumes the <code>Math</code> object for these references.</p>
+
+<pre class="brush:js">var a, x, y;
+var r = 10;
+
+with (Math) {
+  a = PI * r * r;
+  x = r * cos(PI);
+  y = r * sin(PI / 2);
+}</pre>
+
+<h2 id="Specifications">Specifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-with-statement', 'with statement')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES5.1', '#sec-12.10', 'with statement')}}</td>
+   <td>{{Spec2('ES5.1')}}</td>
+   <td>Now forbidden in strict mode.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES3', '#sec-12.10', 'with statement')}}</td>
+   <td>{{Spec2('ES3')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES1', '#sec-12.10', 'with statement')}}</td>
+   <td>{{Spec2('ES1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also">See also</h2>
+
+<ul>
+ <li>{{jsxref("Statements/block", "block")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">Strict mode</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/strict_mode/index.html b/files/es/web/javascript/reference/strict_mode/index.html
new file mode 100644
index 0000000000..d3d17fabd3
--- /dev/null
+++ b/files/es/web/javascript/reference/strict_mode/index.html
@@ -0,0 +1,369 @@
+---
+title: Modo Estricto
+slug: Web/JavaScript/Reference/Strict_mode
+tags:
+  - ECMAScript5
+  - Guía
+  - JavaScript
+  - Modo estricto
+translation_of: Web/JavaScript/Reference/Strict_mode
+original_slug: Web/JavaScript/Referencia/Modo_estricto
+---
+<div>{{JsSidebar("More", "Más")}}</div>
+
+<div class="callout-box">A veces, verás que llaman {{Glossary("Sloppy_mode", "sloppy mode — modo poco riguroso")}} al modo no estricto predeterminado. Este no es un término oficial, pero tenlo en cuenta, por si acaso.</div>
+
+<p>El modo estricto de <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript 5</a> es una forma de elegir una variante <em>restringida</em> de <em>JavaScript</em>, así implícitamente se deja de lado el modo poco riguroso. El modo estricto no es sólo un subconjunto: <em>intencionalmente</em> tiene diferencia semántica del código normal. Los navegadores que no admiten el modo estricto ejecutarán el código con un comportamiento diferente a los que sí lo soportan, por lo tanto no confíes en el modo estricto sin antes hacer pruebas de sus características más relevantes. Los modos estricto y no estricto pueden coexistir, por lo tanto el código se puede transformar a modo estricto incrementalmente.</p>
+
+<p>El modo estricto tiene varios cambios en la semántica normal de JavaScript:</p>
+
+<ol>
+ <li>Elimina algunos errores silenciosos de JavaScript cambiándolos para que lancen errores.</li>
+ <li>Corrige errores que hacen difícil para los motores de JavaScript realizar optimizaciones: a veces, el código en modo estricto puede correr más rápido que un código idéntico pero no estricto.</li>
+ <li>Prohíbe cierta sintaxis que probablemente sea definida en futuras versiones de ECMAScript.</li>
+</ol>
+
+<p>Ve <a href="/es/docs/Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mode">transición a modo estricto</a>, si deseas cambiar tu código para trabajar en la variante estricta de JavaScript.</p>
+
+<h2 id="Invocar_el_modo_estricto">Invocar el modo estricto</h2>
+
+<p>El modo estricto se aplica a un <em>script completo</em> o a <em>funciones individuales</em>. No se aplica a bloques entre corchetes <code>{}</code>; intentar aplicarlo en tales contextos no hace nada. Código <code>eval</code>, código <code>Function</code>, atributos de controladores de eventos, cadenas pasadas a <a href="/es/docs/Web/API/WindowTimers.setTimeout" title="es/DOM/window.setTimeout"><code>setTimeout</code></a>, y similares son scripts enteros, de modo que invocar modo estricto en tales contextos funciona como se espera.</p>
+
+<h3 id="Modo_estricto_para_scripts">Modo estricto para scripts</h3>
+
+<p>Para invocar el modo estricto en todo un script, escribe <em>exactamente</em> <code>"use strict";</code> (o <code>'use strict';</code>) antes de cualquier otra expresión.</p>
+
+<pre class="brush: js notranslate">// Sintaxis del modo estricto para todo el script
+'use strict';
+var v = "¡Hola! ¡Estoy en modo estricto para script!";
+</pre>
+
+<p>Esta sintaxis tiene un problema que <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=579119">ya ha afectado</a> a <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=627531">cierta página bien conocida</a>: no es posible concatenar ciegamente scripts conflictivos entre sí. Si concatena un script en modo estricto con otro que no es, la concatenación de ambos producirá código en modo estricto. Lo contrario también es cierto: código en modo no estricto mas código estricto produce código que no es estricto. Concatenar scripts no produce problemas si todos están en modo estricto (o si todos están en modo no estricto). El problema es mezclar scripts en modo estricto con scripts en modo no estricto. Por eso se recomienda habilitar el modo estricto a nivel de función solamente (al menos durante el periodo de transición de un programa).</p>
+
+<p>Otra opción es envolver el contenido completo del script en una función y tener esa función externa en modo estricto. Así se elimina el problema de la concatenación, pero entonces tienes que hacerte cargo de exportar explícitamente las variables globales fuera del ámbito de la función.</p>
+
+<h3 id="Modo_estricto_para_funciones">Modo estricto para funciones</h3>
+
+<p>De igual forma, para invocar el modo estricto para una función, escribe <em>exactamente</em> <code>"use strict";</code> (o <code>'use strict';</code>) en el cuerpo de la función antes de cualquier otra expresión.</p>
+
+<pre class="brush: js notranslate">function strict() {
+  // Sintaxis del modo estricto a nivel de función
+  'use strict';
+  function nested() { return "¡Y yo también!"; }
+  return "¡Hola!  ¡Soy una función en modo estricto!  " + nested();
+}
+function notStrict() { return "Yo no soy estricto."; }
+</pre>
+
+<h3 id="Modo_estricto_para_módulos">Modo estricto para módulos</h3>
+
+<p>ECMAScript 2015 introdujo módulos y por tanto una tercera manera de entrar en el modo estricto. Todo el contenido de los módulos de JavaScript se encuentra automáticamente en modo estricto, sin necesidad de una declaración para iniciarlo.</p>
+
+<pre class="brush: js notranslate">function strict() {
+    // debido a que este es un módulo, soy estricto por omisión
+}
+export default strict;
+</pre>
+
+<h2 id="Cambios_en_modo_estricto">Cambios en modo estricto</h2>
+
+<p>El modo estricto cambia la sintaxis y el comportamiento en tiempo de ejecución. Los cambios generalmente caen dentro de estas categorías: cambios que convierten equivocaciones en errores (como errores de sintaxis o en tiempo de ejecución), cambios que simplifican cómo se calcula el nombre de una variable particular, cambios que simplifican el uso de <code>eval</code> y <code>arguments</code>, cambios que hacen más fácil escribir JavaScript "seguro", y cambios que anticipan la evolución futura de ECMAScript.</p>
+
+<h3 id="Convertir_equivocaciones_en_errores">Convertir equivocaciones en errores</h3>
+
+<p>El modo estricto cambia algunos errores de sintaxis tolerados en modo no estricto y los convierte en errores. JavaScript fue diseñado de modo que fuera fácil para programadores novatos, y puede haber operaciones semánticas que deberían ser errores pero son tratadas como libres de error. A veces esto sirve para solucionar el problema en el momento, pero puede crear problemas más graves en el futuro. El modo estricto trata las equivocaciones como errores, para que se puedan descubrir y subsanar inmediatamente.</p>
+
+<p>En primer lugar, el modo estricto hace imposible crear variables globales por accidente. En JavaScript no estricto, si se escribe mal una variable en una asignación, se creará una nueva propiedad en el objeto global y el código continuará "trabajando" como si nada (aunque es posible que el código así escrito falle en el futuro, en concreto, en JavaScript moderno). En modo estricto, cualquier asignación que produzca variables globales por accidente lanzará un error:</p>
+
+<pre class="brush: js notranslate">'use strict';
+                       // Asumiendo que exista una variable global llamada mistypedVariable
+mistypeVariable = 17;  // esta línea lanza un ReferenceError debido a
+                       // una errata en el nombre de la variable
+</pre>
+
+<p>En segundo lugar, el modo estricto lanza una excepción en asignaciones que de otro modo fallarían silenciosamente. Por ejemplo, <code>NaN</code> es una variable global que no puede ser asignada. En un código normal, asignar a <code>NaN</code> no tiene efecto; el programador no recibe ningún mensaje de error. En cambio, en modo estricto, si se intenta asignar un valor a <code>NaN</code>, el programador recibirá una excepción. Cualquier asignación que falle silenciosamente en código normal (asignaciones a una propiedad de no escritura, asignaciones a una propiedad captadora, asignaciones a una nueva propiedad o a un objecto {{jsxref("Global_Objects/Object/preventExtensions", "no extensible")}}) lanzará una excepción en modo estricto:</p>
+
+<pre class="brush: js notranslate">'use strict';
+
+// Asignación a una no-escritura global
+var undefined = 5; // lanza un TypeError
+var Infinity = 5; // lanza un TypeError
+
+// Asignación a una propiedad de no-escritura
+var obj1 = {};
+Object.defineProperty(obj1, "x", { value: 42, writable: false });
+obj1.x = 9; // lanza un TypeError
+
+// Asignación a una propiedad de tipo getter
+var obj2 = { get x() { return 17; } };
+obj2.x = 5; // lanza un TypeError
+
+// Asignación a una nueva propiedad en un objeto no extensible
+var fixed = {};
+Object.preventExtensions(fixed);
+fixed.newProp = "ohai"; // lanza un TypeError
+</pre>
+
+<p>En tercer lugar, el modo estricto lanza una excepción al intentar eliminar propiedades no eliminables (mientra que en código normal el intento no tendría ningún efecto):</p>
+
+<pre class="brush: js notranslate">'use strict';
+delete Object.prototype; // lanza un TypeError
+</pre>
+
+<p>En cuarto lugar, la versión de modo estricto anterior a Gecko 34 requiere que todas las propiedades nombradas en un objeto sean únicas. En código normal se pueden duplicar nombres, siendo el último el que determina el valor de la propiedad. Pero como el último es el único que hace algo, la duplicidad da origen a errores si el código se modifica para cambiar el valor de la propiedad. Duplicar nombres de propiedades es un error de sintaxis en modo estricto.</p>
+
+<div class="note">
+<p>Este ya no es el caso en ECMAScript 2015 (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1041128">error 1041128</a>).</p>
+</div>
+
+<pre class="brush: js notranslate">'use strict';
+var o = { p: 1, p: 2 }; // !!! error de sintaxis
+</pre>
+
+<p>En quinto lugar, el modo estricto requiere que los nombres de los parámetros de una función sean únicos. En código normal, el último argumento repetido oculta argumentos anteriores con el mismo nombre. Estos argumentos permanecen disponibles a través de <code>arguments[i]</code>, de modo que no son completamente inaccesibles. Aun así, esta ocultación tiene poco sentido y es probablemente indeseable (pues puede ocultar, por ejemplo, un error al teclear una letra). Por lo tanto, en modo estricto, duplicar nombres de argumentos es un error de sintaxis:</p>
+
+<pre class="brush: js notranslate">function sum(a, a, c) { // !!! error de sintaxis
+  'use strict';
+  return a + a + c; // incorrecto si este código se ejecutó
+}
+</pre>
+
+<p>En sexto lugar, en modo estricto ECMAScript 5 se prohíbe la notación octal. La notación octal no es parte de ECMAScript 5, pero está soportada en todos los navegadores al poner como prefijo un cero al número: <code>0644 == 420</code> y <code>"\045" === "%"</code>. En ECMAScript 2015, el número octal es compatible con el prefijo de un número con "<code>0o</code>". Es decir:</p>
+
+<pre class="brush: js notranslate">var a = 0o10; // ES2015: Octal</pre>
+
+<p>Los programadores novatos a veces creen que un prefijo cero inicial no tiene un significado semántico, por lo que lo usan como dispositivo de alineación, ¡pero esto cambia el significado del número! Una sintaxis de cero a la izquierda para los octales rara vez es útil y se puede usar por error, por lo que el modo estricto lo convierte en un error de sintaxis:</p>
+
+<pre class="brush: js notranslate">'use strict';
+var sum = 015 + // !!! error de sintaxis
+          197 +
+          142;
+
+var sumWithOctal = 0o10 + 8;
+console.log(sumWithOctal); // 16
+</pre>
+
+<p>Séptimo, el modo estricto en ECMAScript 2015 prohíbe establecer propiedades en valores {{Glossary("Primitive", "primitivos")}}. La sintaxis octal rara vez es útil y se puede usar equivocadamente, de modo que en modo estricto, utilizar notación octal lanza un {{jsxref("TypeError")}}:</p>
+
+<pre class="brush: js notranslate">(function() {
+'use strict';
+
+false.true = '';         // TypeError
+(14).sailing = 'home';   // TypeError
+'with'.you = 'far away'; // TypeError
+
+})();</pre>
+
+<h3 id="Simplificación_en_el_uso_de_variables">Simplificación en el uso de variables</h3>
+
+<p>El modo estricto simplifica el modo en que el nombre de una variable es asignado a un variable particular en el código. Muchas optimizaciones del compilador se basan en la habilidad para decir el lugar específico en que una variable está almacenada, lo cual es crítico para una optimización completa del código JavaScript. Algunas veces JavaScript hace que esta asignación básica del nombre de una variable y su valor no suceda hasta que no se está en tiempo de ejecución. El modo estricto elimina muchos de los casos en los que esto pasa, de modo que el compilador puede optimizar mejor el código que es estricto.</p>
+
+<p>Primero, el modo estricto prohíbe el uso de <code>with</code>. El problema con <code>with</code> es que cualquier nombre dentro del bloque pude ser asignado a una propiedad del objecto pasado como argumento, o a una variable en su ámbito circundante (o incluso global), en tiempo de ejecución: es imposible saber de antemano cuál será. El modo estricto hace que el uso de <code>with</code> sea un error de sintaxis, de modo que no hay oportunidad de que una variable dentro de un <code>with</code> se refiera a una dirección desconocida en tiempo de ejecución:</p>
+
+<pre class="brush: js notranslate">'use strict';
+var x = 17;
+with (obj) { // !!! error de sintaxis
+  // Si este no estuviera un modo estricto, ¿sería var x?, o
+  // ¿sería obj.x en su lugar?  Es imposible en general
+  // decirlo sin ejecutar el código, por lo que el nombre no
+  // se puede optimizar.
+  x;
+}
+</pre>
+
+<p>En vez de usar <code>with</code>, existe la simple alternativa de asignar el objecto a una variable de nombre más corto, y después acceder a la propiedad correspondiente de esa variable.</p>
+
+<p>Segundo, el uso de <code>eval</code> en modo estricto no introduce nuevas variables en el ámbito circundante. En código normal, <code>eval("var x;")</code> introduce una variable <code>x</code> dentro de la función circundante o el ámbito global. Esto significa que, en general, en una función que contiene una llamada a <code>eval</code> en cada nombre que no se refiera a un argumento o a una variable local, se debe asignar a una definición en particular en tiempo de ejecución (debido a que <code>eval</code> puedo haber introducido una nueva variable que podría ocultar una variable externa). En modo estricto, <code>eval</code> crea variables solo para el código que se está evaluando, por lo que <code>eval</code> no puede afectar si un nombre se refiere a una variable externa o a alguna variable local:</p>
+
+<pre class="brush: js notranslate">var x = 17;
+var evalX = eval("'use strict'; var x = 42; x");
+console.assert(x === 17);
+console.assert(evalX === 42);
+</pre>
+
+<p>En el ejemplo anterior, si la función <code>eval</code> es invocada por una expresión de la forma <code>eval(...)</code> en código de modo estricto, el código será evaluado en modo estricto. El código puede explícitamente invocar el modo estricto, pero no es necesario.</p>
+
+<pre class="brush: js notranslate">function strict1(str) {
+  'use strict';
+  return eval(str); // str será tratado como código de modo estricto
+}
+function strict2(f, str) {
+  'use strict';
+  return f(str); // no eval(...): str es estricto si y solo
+                 // si invoca el modo estricto
+}
+function nonstrict(str) {
+  return eval(str); // str es estricto si y solo
+                    // si invoca el modo estricto
+}
+
+strict1("'¡Código en modo estricto!'");
+strict1("'use strict'; '¡Código en modo estricto!'");
+estricto2(eval, "'Código no estricto'");
+strict2(eval, "'use strict'; '¡Código en modo estricto!'");
+nonstrict("'Código no estricto'");
+nonstrict("'use strict'; '¡Código en modo estricto!'");
+</pre>
+
+<p>Así los nombres en modo estricto usando <code>eval</code> se comportan idénticamente a los nombres en modo estricto no siendo evaluados como resultado de <code>eval</code>.</p>
+
+<p>Tercero, el modo estricto prohíbe eliminar nombres planos. De este modo, <code>delete name</code> produce un error de sintaxis.</p>
+
+<pre class="brush: js notranslate">'use strict';
+
+var x;
+delete x; // !!! error de sintaxis
+
+eval("var y; delete y;"); // !!! error de sintaxis</pre>
+
+<h3 id="Haciendo_eval_y_arguments_más_simples">Haciendo <code>eval</code> y <code>arguments</code> más simples</h3>
+
+<p>El modo estricto hace que el uso de <code>arguments</code> y <code>eval</code> sea más intuitivo. Ambos envuelven un considerable misticismo en código normal: <code>eval</code> al añadir o remover los enlaces y cambiar los valores de dichos enlaces, y <code>arguments</code> al poder sustituir los nombres de los argumentos por propiedades indexadas. El modo estricto ofrece un gran paso al tratar a <code>eval</code> y a <code>arguments</code> como palabras clave, aunque soluciones finales no estarán disponibles hasta futuras ediciones de ECMAScript.</p>
+
+<p>Primero, las palabras <code>eval</code> y <code>arguments</code> no se pueden ligar o asignar en la sintaxis del lenguaje. Cualquier intento producirá un error de sintaxis:</p>
+
+<pre class="brush: js notranslate">'use strict';
+eval = 17;
+arguments++;
+++eval;
+var obj = { set p(arguments) { } };
+var eval;
+try { } catch (arguments) { }
+function x(eval) { }
+function arguments() { }
+var y = function eval() { };
+var f = new Function("arguments", "'use strict'; return 17;");
+</pre>
+
+<p>Segundo, el modo estricto no permite usar alias en elementos del objecto <code>arguments</code> creados dentro de la función. En una función en código normal cuyo primer parámetro sea <code>args</code>, si se cambia el valor de <code>args</code> también se cambiará de <code>arguments[0]</code>, y viceversa (a menos que no se proporcionen parámetros o se elimine <code>arguments[0]</code>). El objecto <code>arguments</code> para el modo estricto almacena los parámetros originales cuando la función es invocada. <code>arguments[i]</code> no guarda el valor del correspondiente nombre del parámetro, ni tampoco un parámetro con nombre guarda el valor correspondiente de <code>arguments[i]</code>.</p>
+
+<pre class="brush: js notranslate">function f(a) {
+  'use strict';
+  a = 42;
+  return [a, arguments[0]];
+}
+var pair = f(17);
+console.assert(pair[0] === 42);
+console.assert(pair[1] === 17);
+</pre>
+
+<p>Tercero, <code>arguments.callee</code> no está soportado. En código normal, <code> arguments.callee</code> se refiere a la función envolvente. Este caso de uso es débil: ¡simplemente nombra la función envolvente!. Además <code>arguments.callee</code> merma el desempeño de funciones en línea pues debe ser posible proveer la referencia de la función que llamó a la función original cada vez que se usa <code>arguments.callee</code>. <code>arguments.callee</code> en modo estricto es una propiedad no eliminable y lanza una excepción cuando se le asigna un valor o se intenta regresar su valor.</p>
+
+<pre class="brush: js notranslate">'use strict';
+var f = function() { return arguments.callee; };
+f(); // lanza un TypeError
+</pre>
+
+<h3 id="sect1"></h3>
+
+<p>El modo estricto hace más fácil el escribir código "seguro" en JavaScript. Algunos sitios web ofrecen ahora medios para que los usuarios codifiquen en JavaScript para que el código corra en el sitio en <em>beneficio de otros usuarios</em>. JavaScript en los navegadores puede acceder a la información privada del usuario, por lo que dicho JavaScript se debe transformar parcialmente antes de ejecutarse, para censurar el acceso a funciones prohibidas. La flexibilidad de JavaScript hace que efectivamente sea imposible hacer esto sin muchas comprobaciones en tiempo de ejecución. La flexibilidad de JavaScript hace casi imposible hacer esto sin hacer revisiones en tiempo de ejecución. Unos pocos ajustes del modo estricto, además de requerir que el JavaScript enviado por el usuario sea código de modo estricto y que se invoque de cierta manera, reducen sustancialmente la necesidad de esas comprobaciones en tiempo de ejecución.</p>
+
+<p>Primero, el valor <code>this</code> pasado a una función en modo estricto no forzosamente debe ser un objeto (es decir, "empaquetado"). Para una función normal, <code>this</code> siempre es un objeto: o el objeto proporcionado si se llama con un <code>this</code> con valor de objeto; el valor, empaquetado, si se llama con un booleano, una cadena o un número <code>this</code>; o el objeto global si se llama con un <code>undefined</code> o <code>null</code> <code>this</code>. (Usar {{jsxref("Global_Objects/Function/call", "call")}}, {{jsxref("Global_Objects/Function/apply", "apply")}}, o {{jsxref("Global_Objects/Function/bind", "bind")}} para especificar un valor del <code>this</code> particular). Este empaquetado automático al pasar valores a una función tiene un costo en el rendimiento; no solo eso, si no que al exponer el objeto global en los navegadores es un riesgo de seguridad, debido a que el objeto global provee acceso a una funcionalidad que el código de JavaScript "seguro" debe restringir. Así, en una función en modo estricto , el valor de <code>this</code> no está empaquetado dentro de un objecto, y si no se especifica, <code>this</code> toma el valor de <code>undefined</code>.</p>
+
+<pre class="brush: js notranslate">'use strict';
+function fun() { return this; }
+console.assert(fun() === undefined);
+console.assert(fun.call(2) === 2);
+console.assert(fun.apply(null) === null);
+console.assert(fun.call(undefined) === undefined);
+console.assert(fun.bind(true)() === true);
+</pre>
+
+<p>Esto significa, entre otras cosas, que en los navegadores no es posible hacer referencia al objeto <code>window</code> a través de <code>this</code> dentro de una función en modo estricto.</p>
+
+<p>Segundo, en modo estricto ya no es posible "recorrer" la pila de JavaScript a través de extensiones de ECMAScript. En código normal con estas extensiones, cuando una función llamada <code>fun</code> está en medio de su ejecución, <code>fun.caller</code> es la función que más recientemente llamó a <code>fun</code>, y <code>fun.arguments</code> son los parámetros para esa invocación de <code>fun</code>. Ambas extensiones son problemáticas para JavaScript "seguro", debido a que permiten acceder a funciones "privilegiadas" y sus (potencialmente inseguros) argumentos. Si <code>fun</code> está en modo estricto, tanto <code>fun.caller</code> como <code>fun.arguments</code> son propiedades no eliminables que lanzan una excepción cuando se establecen o recuperan:</p>
+
+<pre class="brush: js notranslate">function restricted() {
+  'use strict';
+  restricted.caller;    // lanza un TypeError
+  restricted.arguments; // lanza un TypeError
+}
+function privilegedInvoker() {
+  return restricted();
+}
+privilegedInvoker();
+</pre>
+
+<p>Tercero, en funciones de modo estricto, el objeto <code>arguments</code> no provee acceso a las variables usadas al llamar a la función. En algunas implementaciones antiguas de ECMAScript, <code>arguments.caller</code> era un objeto cuyas propiedades apuntaban a las variables en la función. Esto es una <a href="http://stuff.mit.edu/iap/2008/facebook/">amenaza de seguridad</a> por que rompe la habilidad de ocultar valores privilegiados a través de la abstracción de la función; además, frena algunas optimizaciones. Por estas razones los navegadores modernos no la implementan. Por su funcionalidad a lo largo de los años, <code>arguments.caller</code> en una función de modo estricto es una propiedad que lanza una excepción cuando se usa.</p>
+
+<pre class="brush: js notranslate">'use strict';
+function fun(a, b) {
+  'use strict';
+  var v = 12;
+  return arguments.caller; // lanza un TypeError
+}
+fun(1, 2); // no expone v (o a o b)
+</pre>
+
+<h3 id="Preparando_el_camino_para_futuras_versiones_de_ECMAScript">Preparando el camino para futuras versiones de ECMAScript</h3>
+
+<p>Las futuras versiones de ECMAScript introducirán nuevos cambios, y el modo estricto en ECMAScript 5 aplica algunos de esos cambios para hacer una transición más suave. Será más fácil hacer cambios si las bases de esos cambios son prohibidas en modo estricto.</p>
+
+<p>Primero, en modo estricto una lista de identificadores se convierte en palabras reservadas. Estas palabras son <code>implements</code>, <code>interface</code>, <code>let</code>, <code>package</code>, <code>private</code>, <code>protected</code>, <code>public</code>, <code>static</code>, y <code>yield</code>. De modo que en modo estricto, no se pueden usar estas palabras para nombrar variables o argumentos.</p>
+
+<pre class="brush: js notranslate">function package(protected) { // !!!
+  'use strict';
+  var implements; // !!!
+
+  interface: // !!!
+  while (true) {
+    break interface; // !!!
+  }
+
+  function private() { } // !!!
+}
+function fun(static) { 'use strict'; } // !!!
+
+</pre>
+
+<p><em>Dos advertencias específicas de Mozilla</em>: Primero, si tu código esta escrito en JavaScript 1.7 o mayor (por ejemplo en código chrome o cuando se usa bien <code>&lt;script type=""&gt;</code>) y el código esta en modo estricto, <code>let</code> y <code>yield</code> tienen la funcionalidad <span id="result_box" lang="es">que han tenido desde que esas palabras clave se introdujeron por primera vez</span>. Pero el código en modo estricto en la web, cargado con <code>&lt;script src=""&gt;</code> o <code>&lt;script&gt;...&lt;/script&gt;</code>, no podrá usar <code>let</code>/<code>yield</code> como identificadores. <em>Segundo, mientras que ES5 incondicionalmente reserva las palabras <code>class</code>, <code>enum</code>, <code>export</code>, <code>extends</code>, <code>import</code> y <code>super</code>, Mozilla Firefox 5 solo las reserva en modo estricto</em>.</p>
+
+<p>En segundo lugar, <a class="external" href="http://whereswalden.com/2011/01/24/new-es5-strict-mode-requirement-function-statements-not-at-top-level-of-a-program-or-function-are-prohibited/">el modo estricto prohíbe las declaraciones de función, no en el nivel superior de un script o función</a>. En el modo normal de los navegadores, las declaraciones de función se permiten "en todas partes". <em>¡Esto no es parte de ES5 (ni siquiera de ES3)!</em> Es una extensión con semántica incompatible en diferentes navegadores. Ten en cuenta que en ES2015 se permiten declaraciones de función fuera del nivel superior.</p>
+
+<pre class="brush: js notranslate">'use strict';
+if (true) {
+  function f() { } // !!! error de sintaxis
+  f();
+}
+
+for (var i = 0; i &lt; 5; i++) {
+  function f2() { } // !!! error de sintaxis
+  f2();
+}
+
+function baz() {   // legal
+  function eit() { } // también legal
+}
+</pre>
+
+<p>Esta prohibición no es el modo estricto propiamente dicho porque tales declaraciones de función son una extensión de ES5 básico. Pero es la recomendación del comité ECMAScript y los navegadores la implementarán.</p>
+
+<h2 id="Modo_estricto_en_navegadores">Modo estricto en navegadores</h2>
+
+<p>La mayoría de los navegadores ya implementan el modo estricto. Sin embargo, no dependas ciegamente de él, ya que todavía hay numerosas <a class="external" href="http://caniuse.com/use-strict" rel="external" title="caniuse.com disponibilidad de modo estricto">Versiones del navegador utilizadas en la naturaleza que solo tienen soporte parcial para el modo estricto</a> o no lo admiten en absoluto (por ejemplo, Internet Explorer por debajo de la versión 10). <em>El modo estricto cambia la semántica</em>. Depender de esos cambios provocará equivocaciones y errores en los navegadores que no implementan el modo estricto. Ten cuidado al usar el modo estricto y respalda la dependencia del modo estricto con pruebas de funciones que comprueben si se implementan las partes relevantes del modo estricto. Finalmente, asegúrate de <em>probar tu código en navegadores que admitan y no admitan el modo estricto</em>. Si realizas tus pruebas solo en navegadores que no admiten el modo estricto, es muy probable que tengas problemas en los navegadores que sí lo hacen, y viceversa.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-strict-mode-code', 'Código en modo estricto')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li><a class="external" href="http://whereswalden.com/2010/09/08/new-es5-strict-mode-support-now-with-poison-pills/" title="http://whereswalden.com/2010/09/08/new-es5-strict-mode-support-now-with-poison-pills/">¿Dónde está Walden? » Nuevo soporte de modo estricto ES5: ¡ahora con píldoras venenosas!</a></li>
+ <li><a class="external" href="http://whereswalden.com/2011/01/24/new-es5-strict-mode-requirement-function-statements-not-at-top-level-of-a-program-or-function-are-prohibited/" title="http://whereswalden.com/2011/01/24/new-es5-strict-mode-requirement-function-statements-not-at-top-level-of-a-program-or-function-are-prohibited/">¿Dónde está Walden? » Nuevo requisito del modo estricto de ES5: se prohíben las declaraciones de función que no estén en el nivel superior de un programa o función</a></li>
+ <li><a class="external" href="http://whereswalden.com/2011/01/10/new-es5-strict-mode-support-new-vars-created-by-strict-mode-eval-code-are-local-to-that-code-only/" title="http://whereswalden.com/2011/01/10/new-es5-strict-mode-support-new-vars-created-by-strict-mode-eval-code-are-local-to-that-code-only/">¿Dónde está Walden? » Nueva compatibilidad con el modo estricto de ES5: las nuevas variables creadas por el código de evaluación del modo estricto son locales solo para ese código</a></li>
+ <li><a href="http://qnimate.com/javascript-strict-mode-in-nutshell/">Tutorial de "uso estricto" de JavaScript para principiantes.</a></li>
+ <li><a class="external" href="http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/" title="http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/">John Resig — Modo estricto ECMAScript 5, JSON y más</a></li>
+ <li><a class="external" href="http://dmitrysoshnikov.com/ecmascript/es5-chapter-2-strict-mode/">ECMA-262-5 en detalle. Capitulo 2. Modo estricto.</a></li>
+ <li><a class="external" href="http://kangax.github.io/compat-table/es5/#Strict_mode">Tabla de compatibilidad del modo estricto</a></li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mode">Transición al modo estricto</a></li>
+</ul>
diff --git a/files/es/web/javascript/reference/template_literals/index.html b/files/es/web/javascript/reference/template_literals/index.html
new file mode 100644
index 0000000000..a1ce5052d1
--- /dev/null
+++ b/files/es/web/javascript/reference/template_literals/index.html
@@ -0,0 +1,315 @@
+---
+title: Plantillas literales (plantillas de cadenas)
+slug: Web/JavaScript/Reference/Template_literals
+tags:
+  - ECMAScript 2015
+  - Experimental
+  - Expérimental(2)
+  - JavaScript
+translation_of: Web/JavaScript/Reference/Template_literals
+original_slug: Web/JavaScript/Referencia/template_strings
+---
+<div>{{JsSidebar("More")}}</div>
+
+<p>Las plantillas literales son cadenas literales que habilitan el uso de expresiones incrustadas. Con ellas, es posible utilizar cadenas de caracteres de más de una línea, y funcionalidades de interpolación de cadenas de caracteres.</p>
+
+<p>En ediciones anteriores de la especificación ES2015, solían llamarse "plantillas de cadenas de caracteres".</p>
+
+<h2 id="Syntax" name="Syntax">Sintaxis</h2>
+
+<pre class="syntaxbox notranslate">`texto de cadena de caracteres`
+
+`línea 1 de la cadena de caracteres
+ línea 2 de la cadena de caracteres`
+
+`texto de cadena de caracteres ${expresión} texto adicional`
+
+<em>etiqueta</em>`texto de cadena de caracteres ${expresión} texto adicional`
+</pre>
+
+<h2 id="Description" name="Description">Descripción</h2>
+
+<p>Las plantillas literales se delimitan con el caracter de comillas o tildes invertidas (` `) (<a href="http://en.wikipedia.org/wiki/Grave_accent">grave accent</a>), en lugar de las comillas sencillas o dobles.</p>
+
+<p>Las plantillas de cadena de caracteres pueden contener marcadores, identificados por el signo de dólar y envueltos en llaves (<code>${expresión}</code>). Las expresiones contenidas en los marcadores, junto con el texto entre ellas, son enviados como argumentos a una función.</p>
+
+<p>La función por defecto sencillamente concatena las partes para formar una única cadena de caracteres. Si hay una expresión antes de la plantilla literal (aquí indicada mediante <em><code>etiqueta</code></em>), se le conoce como "plantilla etiquetada". En este caso, la expresión de etiqueta (típicamente una función) es llamada con la plantilla literal como parámetro, que luego puede ser manipulada antes de ser devuelta.</p>
+
+<p>En caso de querer escapar una comilla o tilde invertida en una plantilla literal, se debe poner una barra invertida (<code>\</code>) antes de la comilla o tilde invertida.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="template-string token"><span class="string token">`\``</span></span> <span class="operator token">===</span> <span class="string token">'`'</span> <span class="comment token">// --&gt; true (cierto)</span></code></pre>
+
+<h3 id="Cadenas_de_más_de_una_línea">Cadenas de más de una línea</h3>
+
+<p>Los caracteres de fin de línea encontrados forman parte de la plantilla literal.</p>
+
+<p>Utilizando cadenas de caracteres normales, sería necesario utilizar la siguiente sintaxes para producir cadenas de más de una línea:</p>
+
+<pre class="brush: js notranslate">console.log('línea 1 de cadena de texto\n' +
+'\línea 2 de cadena de texto');
+// "línea 1 de cadena de texto
+// línea 2 de cadena de texto"
+</pre>
+
+<p>Utilizando plantillas literales, se puede obtener el mismo resultado de la siguiente forma:</p>
+
+<pre class="brush: js notranslate">console.log(`línea 1 de la cadena de texto
+línea 2 de la cadena de texto`);
+// "línea 1 de la cadena de texto
+// línea 2 de la cadena de texto"</pre>
+
+<h3 id="Interpolación_de_expresiones">Interpolación de expresiones</h3>
+
+<p>Para insertar expresiones dentro de cadenas de caracteres normales, se utilizaría la siguiente sintaxis:</p>
+
+<pre class="brush: js notranslate">let a = 5;
+let b = 10;
+console.log('Quince es ' + (a + b) + ' y\nno ' + (2 * a + b) + '.');
+// "Quince es 15 y
+// no 20."</pre>
+
+<p>Ahora, con las plantillas literales, se pueden utilizar sus nuevas capacidades (es decir, insertar expresiones con <code>${ }</code> e incluir caracteres de fin de linea literales dentro de la cadena) para simplificar la sintaxis:</p>
+
+<pre class="brush: js notranslate">let a = 5;
+let b = 10;
+console.log(`Quince es ${a + b} y
+no ${2 * a + b}.`);
+// "Quince es 15 y
+// no 20."</pre>
+
+<h3 id="Anidamiento_de_plantillas">Anidamiento de plantillas</h3>
+
+<p>En ciertos casos, anidar una plantilla es la forma más fácil, e incluso más legible, de tener cadenas configurables. Dentro de una plantilla con tildes invertidas, es sencillo permitir tildes invertidas interiores simplemente usándolas dentro de un marcador de posición <code>${ }</code> dentro de la plantilla.</p>
+
+<p>Por ejemplo, si la condición a es <code>true</code> (cierta): entonces <code>return</code> (devuelva) este literal con plantilla.</p>
+
+<p>En ES5:</p>
+
+<pre class="brush: js notranslate"><code class="language-js">let classes <span class="operator token">=</span> <span class="string token">'header'</span>
+classes <span class="operator token">+</span><span class="operator token">=</span> <span class="punctuation token">(</span><span class="function token">isLargeScreen</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">?</span>
+   <span class="string token">''</span> <span class="punctuation token">:</span> item<span class="punctuation token">.</span>isCollapsed <span class="operator token">?</span>
+     <span class="string token">' icon-expander'</span> <span class="punctuation token">:</span> <span class="string token">' icon-collapser'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>En ES2015 con plantillas literales y sin anidamiento:</p>
+
+<pre class="brush: js notranslate"><code>const classes = `header ${ isLargeScreen() ? '' :
+    (item.isCollapsed ? 'icon-expander' : 'icon-collapser') }`;</code></pre>
+
+<p>En ES5 con plantillas literales anidadas:</p>
+
+<pre class="brush: js notranslate"><code>const classes = `header ${ isLargeScreen() ? '' :
+ `icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`;</code></pre>
+
+<h3 id="Plantillas_etiquetadas">Plantillas etiquetadas</h3>
+
+<p>Una forma más avanzada de plantillas literales son las plantillas <em>etiquetadas</em>.</p>
+
+<p>Con ellas es posible modificar la salida de las plantillas utilizando una función. El primer argumento contiene un array con una o más cadenas de caracteres. El segundo y subsiguientes argumentos se asocian con las expresiones de la plantilla.</p>
+
+<p>La función de etiqueta puede ejecutar cualesquiera operaciones deseadas con estos argumentos, y luego devolver la cadena manipulada. (También puede devolver algo totalmente distinto, como se muestra en uno de los siguientes ejemplos.)</p>
+
+<p>El nombre de la función utilizada con la etiqueta no es nada especial, se puede utilizar cualquier nombre de función en su lugar.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">let persona <span class="operator token">=</span> <span class="string token">'Mike'</span><span class="punctuation token">;</span>
+let edad <span class="operator token">=</span> <span class="number token">28</span><span class="punctuation token">;</span>
+
+<span class="keyword token">function</span> <span class="function token">myTag</span><span class="punctuation token">(</span>strings<span class="punctuation token">,</span> expPersona<span class="punctuation token">,</span> expEdad<span class="punctuation token">)</span>
+<span class="punctuation token">{</span>
+  let str0 <span class="operator token">=</span> strings<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">;</span> <span class="comment token">// "Ese "</span>
+  let str1 <span class="operator token">=</span> strings<span class="punctuation token">[</span><span class="number token">1</span><span class="punctuation token">]</span><span class="punctuation token">;</span> <span class="comment token">// " es un "</span>
+
+  <span class="comment token">// Tecnicamente, hay una cadena de
+  // caracteres después de la expresión
+  // final (en nuestro ejemplo) pero
+  // está vacia (""), asi que se ignora.</span>
+  <span class="comment token">// let str2 = strings[2];</span>
+
+  let strEdad<span class="punctuation token">;</span>
+  <span class="keyword token">if</span> <span class="punctuation token">(expEdad</span> <span class="operator token">&gt;</span> <span class="number token">99</span><span class="punctuation token">)</span>
+<span class="punctuation token">  {</span>
+    strEdad <span class="operator token">=</span> <span class="string token">'viejo'</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+  <span class="keyword token">else</span>
+  <span class="punctuation token">{</span>
+    strEdad <span class="operator token">=</span> <span class="string token">'joven'</span><span class="punctuation token">;</span>
+  <span class="punctuation token">}</span>
+
+  <span class="comment token">// Podemos incluso retornar una cadena de
+  // caracteres utilizando una plantilla literal.</span>
+  <span class="keyword token">return</span> <span class="template-string token"><span class="string token">`</span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>str0<span class="interpolation-punctuation punctuation token">}</span></span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${expPersona</span><span class="interpolation-punctuation punctuation token">}</span></span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>str1<span class="interpolation-punctuation punctuation token">}</span></span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>strEdad<span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">;</span>
+<span class="punctuation token">}</span>
+
+<span class="keyword token">var</span> salida <span class="operator token">=</span> myTag<span class="template-string token"><span class="string token">`Ese </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span> persona <span class="interpolation-punctuation punctuation token">}</span></span><span class="string token"> es un </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span> edad <span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">;</span>
+
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>salida<span class="punctuation token">)</span><span class="punctuation token">;</span>
+<span class="comment token">// Ese Mike es un joven</span></code>
+</pre>
+
+<p>Las funciones de etiqueta incluso pueden devolver valores que no sean cadenas de caracteres:</p>
+
+<pre class="brush: js notranslate">function plantilla(cadenas, ...claves) {
+  return (function(...valores) {
+    let diccio = valores[valores.length - 1] || {};
+    let resultado = [cadenas[0]];
+    claves.forEach(function(clave, i) {
+      let valor = Number.isInteger(clave) ? valores[clave] : diccio[clave];
+      resultado.push(valor, cadenas[i + 1]);
+    });
+    return resultado.join('');
+  });
+}
+
+let t1Closure = plantilla`¡${0}${1}${2}${2}${3}!`;
+//let t1Closure = plantilla(["¡","","","","","","!"],0,1,2,3);
+t1Closure('H', 'U', 'R', 'A');              // "¡HURRA!"
+
+let t2Closure = plantilla`${0} ${'foo'}!`;
+//let t2Closure = plantilla(["¡",""," ","!"],0,"foo");
+t2Closure('Hola', {foo: 'Mundo'}); // "¡Hola Mundo!"
+
+let t3Closure = plantilla`Me llamo ${'nombre'}. Tengo casi ${'edad'} años.`;
+//let t3Closure = plantilla(["Me llamo ", ". Tengo casi ", " años."], "nombre", "edad");
+t3Closure('foo', {nombre: 'MDN', edad: 30}); //"Me llamo MDN. Tengo casi 30 años."
+t3Closure({nombre: 'MDN', edad: 30}); //"Me llamo MDN. Tengo casi 30 años."</pre>
+
+<h3 id="Cadenas_en_crudo_raw">Cadenas en crudo (<em>raw</em>)</h3>
+
+<p>La propiedad especial <code>raw</code>, disponible en el primer argumento de la función de etiqueta, permite acceso a las cadenas de caracteres tal como fueron ingresadas, sin procesar <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Grammar_and_types#Literales_String">secuencias de escape</a>.</p>
+
+<pre class="brush: js notranslate">function etiqueta(cadenas) {
+  console.log(cadenas.raw[0]);
+}
+
+etiqueta`texto de cadena de caracteres 1 \n texto de cadena de caracteres 2`;
+// muestra "texto de cadena de caracteres 1 \n texto de cadena de caracteres 2" ,
+// incluyendo los caracteres '\' y 'n'</pre>
+
+<p>Adicionalmente, el método {{jsxref("String.raw()")}} permite crear cadenas de caracteres en crudo tal como serían generadas por la función por defecto de plantilla, concatenando sus partes.</p>
+
+<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">let cadena <span class="operator token">=</span> String<span class="punctuation token">.</span>raw<span class="template-string token"><span class="string token">`¡Hola\n</span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span><span class="number token">2</span><span class="operator token">+</span><span class="number token">3</span><span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">!`</span></span><span class="punctuation token">;</span>
+<span class="comment token">// "¡Hola\n5!"</span>
+
+cadena<span class="punctuation token">.</span>length<span class="punctuation token">;</span>
+<span class="comment token">// 9
+
+</span>Array.from(cadena).join(',');
+// "</code>¡,<code class="language-js">H,o,l,a,\,n,5,!"</code>
+</pre>
+
+<h3 id="Plantillas_etiquetadas_y_secuencias_de_escape">Plantillas etiquetadas y secuencias de escape</h3>
+
+<h4 id="Comportamiento_en_ES2016">Comportamiento en ES2016</h4>
+
+<p>Comenzando con ECMAScript 2016, las plantillas etiquetadas se comportan de acuerdo con las normas de las siguientes secuencias de escape:</p>
+
+<ul>
+ <li>Secuencias de escape de formato Unicode comenzando con "<code>\u</code>", como <code>\u00A9</code></li>
+ <li>Secuencias de escape de formato Unicode de punto de código, indicadas con "<code>\u{}</code>", como <code>\u{2F804}</code></li>
+ <li>Secuencias de escape de numeros hexadecimales comenzando con "<code>\x</code>", como <code>\xA9</code></li>
+ <li>Secuencias de escape de octales literales comenzando con "<code>\0o</code>" seguidas de uno o más dígitos, como <code>\0o251</code></li>
+</ul>
+
+<p>Esto significa que una plantilla etiquetada como la siguiente podría causar problemas, dado que, de acuerdo con la gramática de ECMAScript, un analizador buscará secuencias de escape de formato Unicode válidas pero encontrará sintaxis equivocado:</p>
+
+<pre class="brush: js notranslate">latex`\unicode`
+// En ECMAScript 2016 y versiones anteriores, lanza
+// SyntaxError: malformed Unicode character escape sequence</pre>
+
+<h3 id="Revision_de_secuencias_de_escape_no_permitidas_en_ES2018">Revision de secuencias de escape no permitidas en ES2018</h3>
+
+<p>Las plantillas etiquetadas deberías permitir la inserción de lenguages (como los <a href="https://en.wikipedia.org/wiki/Domain-specific_language">DSL</a>, o <a href="https://en.wikipedia.org/wiki/LaTeX">LaTeX</a>), en donde otras secuencias de escape se ven comúnmente. La propuesta para ECMAScript <a href="https://tc39.es/proposal-template-literal-revision/">Template Literal Revision</a> (Revisión de Plantilla Literal) (Cuarta Etapa, en camino a ser integrada al estándar de ECMAScript 2018) elimina la restricción de las secuencias de escape en ECMAScript para las plantillas etiquetadas.</p>
+
+<p>Aún así, las secuencias de escape no permitidas deben ser representadas en la representación "cocinada" de la cadena. Aparecerán como elementos <a href="https://developer.mozilla.org/es/docs/Glossary/undefined">no definidos</a> en el array llamado "cocinado" en el siguiente ejemplo.</p>
+
+<pre class="brush: js notranslate">function latex(str) {
+  return { "cocinado": str[0], "en crudo": str.raw[0] }
+}
+
+latex`\unicode`
+
+// { cocinado: undefined, en crudo: "\\unicode" }</pre>
+
+<p>Cabe destacar que la restricción para secuencias de escape solo ha sido eliminada para plantillas <em>etiquetadas</em>. Aún permanece para plantillas literales sin etiqueta:</p>
+
+<pre class="brush: js example-bad notranslate">let bad = `bad escape sequence: \unicode`;</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Especificación</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comentarios</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES6', '#sec-template-literals', 'Template Literals')}}<br>
+    {{SpecName('ES6', '#sec-tagged-templates', 'Tagged Templates')}}</td>
+   <td>{{Spec2('ES6')}}</td>
+   <td>Definición inicial.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Soporte básico</td>
+   <td>{{CompatChrome(41)}}</td>
+   <td>{{CompatGeckoDesktop("34")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera(29)}}</td>
+   <td>{{CompatSafari(9.1)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Funcionalidad</th>
+   <th>Android</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td><span style="font-size: 12px; line-height: 18px;">Soporte básico</span></td>
+   <td>{{CompatAndroid(67)}}</td>
+   <td>
+    <p class="p1">{{CompatChrome(71)}}</p>
+   </td>
+   <td>{{CompatGeckoMobile("63")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatOpera(46)}}</td>
+   <td>{{CompatSafari(9)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="See_also" name="See_also">Ver también</h2>
+
+<ul>
+ <li>{{jsxref("String")}}</li>
+ <li>{{jsxref("String.raw()")}}</li>
+ <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Lexical grammar</a></li>
+ <li><a href="https://gist.github.com/WebReflection/8f227532143e63649804">Template-like strings in ES3 compatible syntax</a></li>
+</ul>
diff --git a/files/es/web/javascript/referencia/acerca_de/index.html b/files/es/web/javascript/referencia/acerca_de/index.html
deleted file mode 100644
index 3382ea7dca..0000000000
--- a/files/es/web/javascript/referencia/acerca_de/index.html
+++ /dev/null
@@ -1,158 +0,0 @@
----
-title: Acerca de
-slug: Web/JavaScript/Referencia/Acerca_de
-tags:
-  - JavaScript
-translation_of: Web/JavaScript/Reference/About
----
-<div>{{JsSidebar}}</div>
-
-<h3 id="Nuevas_caracter.C3.ADsticas_en_esta_versi.C3.B3n" name="Nuevas_caracter.C3.ADsticas_en_esta_versi.C3.B3n">Nuevas características en esta versión</h3>
-
-<p>JavaScript versión 1.5 provee las siguientes nuevas características y extensiones:</p>
-
-<p><strong>Errores en tiempo de ejecución </strong><br>
- Los errores en tiempo de ejecución son ahora reportados como <a href="/es/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones" title="es/Guía_JavaScript_1.5/Sentencias_de_manejo_de_excepciones">excepciones</a>.</p>
-
-<p><strong>Extensiones para el formato de números </strong><br>
- El formato de números ha sido extendido para incluir los métodos <code>Number.prototype.toExponential</code>, <code>Number.prototype.toFixed</code> y <code>Number.prototype.toPrecision</code>.</p>
-
-<p><strong>Extensiones de expresiones regulares </strong><br>
- Las siguientes extensiones para expresiones regulares han sido añadidas:</p>
-
-<ul>
- <li>Cuantificadores avaros: <code>— +, *, ? y {}</code>:ahora pueden seguirse por un <code>?</code> para forzarlos ha no ser avaros. Para la entrada <strong>?</strong> Véase la página <a href="/es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales" title="es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales">Escribir un patrón de expresiones regulares</a>.</li>
- <li>Paréntesis sin captura: <code>(?:x)</code>:pueden ser usados en vez de paréntesis con captura <code>(x)</code>. Cuando son utilizados, las sub expresiones de compatibilidad {{ mediawiki.external('match') }} no están disponibles como referencias de respaldo {{ mediawiki.external('back-references') }}. Para la entrada <strong>(?:x)</strong> Véase la página: <a href="/es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales" title="es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales">Escribir un patrón de expresiones regulares</a>.</li>
- <li>Aserciones predictivas {{ mediawiki.external('lookahead assertions') }} positivas y negativas son soportadas. Las dos aserguran una comparación dependiente de lo que sigue en la cadena de texto que está siendo cotejada. Ver las entradas para <code>x(?=y) y x(?!y)</code> en la página: <a href="/es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales" title="es/Guía_JavaScript_1.5/Escribir_un_patrón_de_expresión_regular#Uso_de_caracteres_especiales">Escribir un patrón de expresiónes regulares</a>.</li>
- <li>La bandera m ha sido añadida para especificar que la expresión regular deberá cotejarse sobre múltiples líneas.</li>
-</ul>
-
-<p><strong>Declaraciones condicionales de funciones </strong><br>
- Las funciones ahora pueden ser declaradas al interior de una cláusula if.</p>
-
-<p><strong>Expresiones funcionales </strong><br>
- Las funciones ahora pueden ser declaradas al interior de una expresión.</p>
-
-<p><strong>Cláusulas Catch múltiples </strong><br>
- Las cláusulas Catch múltiples en una sentencia try...catch son soportadas.</p>
-
-<p><strong>Constantes </strong><br>
- Constantes nominadas como sólo de lectura son soportadas. Esta característica está disponible únicamente en la implementación C de JavaScript.</p>
-
-<p><strong>Obtenedores y Modificadores (Getters and Setters) </strong><br>
- Los editores de JavaScript ahora pueden añadir obtenedores {{ mediawiki.external('getters') }} y modificadores {{ mediawiki.external('setters') }} a sus objetos. Esta característica está disponible únicamente en la implementación C de JavaScript.</p>
-
-<h3 id="Qu.C3.A9_deber.C3.ADa_saberse_ya" name="Qu.C3.A9_deber.C3.ADa_saberse_ya">Qué debería saberse ya</h3>
-
-<p>Esta referencia asume que usted tiene a su respaldo el siguiente conocimiento básico:</p>
-
-<ul>
- <li>Un entendimiento general de la Internet y de la World Wide Web (WWW).</li>
- <li>Un conocimiento práctico del lenguaje de marcas para Hipertexto {{ mediawiki.external('HyperText Markup Language') }} (<a href="/es/HTML" title="es/HTML">HTML</a>).</li>
-</ul>
-
-<p>Es beneficioso alguna experiencia en programación en lenguajes como C o Visual Basic, pero no es requerido.</p>
-
-<h3 id="Versiones_de_JavaScript" name="Versiones_de_JavaScript">Versiones de JavaScript</h3>
-
-<p>Cada versión del servidor Netscape Enterprise también soporta una versión diferente de JavaScript. Para ayudarle a escribir sus scripts para que sean compatibles con múltiples versiones de un servidor Enterprise, este manual lista la versión de JavaScript en la cual cada característica fue implementada.</p>
-
-<p>La siguiente tabla lista las veriones de JavaScript soportadas por las diferentes versiones de Navegadores. Versiones de Navegadores anteriores a la 2.0 no soportan JavaScript.</p>
-
-<h4 id="JavaScript_y_Versiones_de_Navegadores" name="JavaScript_y_Versiones_de_Navegadores">JavaScript y Versiones de Navegadores</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Versión de JavaScript</td>
-   <td class="header">Versión del Navegador</td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.0</td>
-   <td>Navegador 2.0</td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.1</td>
-   <td>Navegador 3.0</td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.2</td>
-   <td>Navegador 4.0-4.05</td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.3</td>
-   <td>Navegador 4.06-4.7x</td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.4</td>
-   <td>n/a</td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.5</td>
-   <td>Navegador 6.0
-    <p>Mozilla 0.6x-0.9x<br>
-     (navegador de código abierto)</p>
-   </td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.6</td>
-   <td>Mozilla Firefox 1.5</td>
-  </tr>
-  <tr>
-   <td>JavaScript 1.7</td>
-   <td>Mozilla Firefox 2</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Cada versión del servidor Netscape Enterprise también soporta una versión diferente de JavaScript. Para ayudarle a escribir sus scripts para que sean compatibles con múltiples versiones de un servidor Enterprise, este manual usa una abreviación para indicar la versión del servidor en el cual cada característica fue implementada.</p>
-
-<h4 id="JavaScript_and_Netscape_Enterprise_Server_Versions" name="JavaScript_and_Netscape_Enterprise_Server_Versions">JavaScript and Netscape Enterprise Server Versions</h4>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">Abbreviation</td>
-   <td class="header">Enterprise Server Version</td>
-  </tr>
-  <tr>
-   <td>NES 2.0</td>
-   <td>Netscape Enterprise Server 2.0</td>
-  </tr>
-  <tr>
-   <td>NES 3.0</td>
-   <td>Netscape Enterprise Server 3.0</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="D.C3.B3nde_encontrar_informaci.C3.B3n_de_JavaScript" name="D.C3.B3nde_encontrar_informaci.C3.B3n_de_JavaScript">Dónde encontrar información de JavaScript</h3>
-
-<p>La documentación de JavaScript incluye los siguientes libros:</p>
-
-<ul>
- <li><a href="/es/Guía_JavaScript_1.5" title="es/Guía_JavaScript_1.5">Guía de JavaScript 1.5</a> provee la información sobre el lenguaje JavaScript y sus objetos.</li>
- <li><a href="/es/Referencia_de_JavaScript_1.5" title="es/Referencia_de_JavaScript_1.5">Referencia de JavaScript 1.5</a> (éste manual) provee material de referencia para el lenguaje JavaScript.</li>
-</ul>
-
-<p>Si usted es principiante con JavaScript, comience por la <a href="/es/Guía_JavaScript_1.5" title="es/Guía_JavaScript_1.5">Guía de JavaScript</a> y una vez que haya obtenido firmes entendimientos de sus fundamentos, debe seguir con la <a href="/es/Referencia_de_JavaScript_1.5" title="es/Referencia_de_JavaScript_1.5">Referencia de JavaScript 1.5</a> para conseguir más detalles individuales acerca de los objetos y las sentencias.</p>
-
-<h3 id="Convenciones_en_el_documento" name="Convenciones_en_el_documento">Convenciones en el documento</h3>
-
-<p>Las aplicaciones JavaScript se ejecutan en muchos sistemas operativos; la información en este libro se aplica a todas las versiones. Las rutas {{ mediawiki.external('paths') }} para archivos y directorios están dadas en un formato Windows (con backslashes separando los nombres de directorios). Para las versiones Unix, la ruta de los directorios son las mismas, excepto que deben usarse slashes en vez de backslashes para separar los directorios.</p>
-
-<p>Esta guía utiliza los localizadores uniformes de recursos {{ mediawiki.external('uniform resource locators') }} (URLs) de la siguiente forma:</p>
-
-<p><code><span class="nowiki">http://servidor.dominio/path/file.html</span></code></p>
-
-<p>En estos URLs, "servidor" representa el nombre del servidor en el cual puede ejecutar su aplicación (p.e., busqueda1, www), "dominio" representa un nombre de dominio de Internet (p.e., netscape.com, uiuc.edu), "path" representa la estructura de directorios en el servidor y "file.html" representa un nombre individual de archivo. En general, los items en italica en un URLs se mantienen en su lugar y los items en un tipo normal de fuente monospace son literales. Si su servidor tiene habilitada la capa de sockets seguros {{ mediawiki.external('Secure Sockets Layer') }} (SSL), deberá usar https en lugar de http en el URL.</p>
-
-<p>Esta guía utiliza las siguientes convenciones de tipo de fuente:</p>
-
-<ul>
- <li>La fuente <code>monospace font</code> es usada para listados de código y código de ejemplo, para las API y elementos del lenguaje (tales como nombres de métodos y nombres de propiedades), nombres de archivos, nombres de rutas, nombres de directorios, etiquetas HTML y cualquier texto que deberá ser digitado en la pantalla. (La fuente Monospace italic es usada para fijar lugares embedidos que deben mantenerse en el código.)</li>
- <li>El tipo <em>Italic type</em> es usado para títulos de libros, para enfatizar, para variables y lugares que deben mantenerse y las palabras usadas en sentido literal.</li>
- <li>La negrillas <strong>Boldface type</strong> son utilizadas para términos del glosario.</li>
-</ul>
-
-<p> </p>
diff --git a/files/es/web/javascript/referencia/características_desaprobadas/index.html b/files/es/web/javascript/referencia/características_desaprobadas/index.html
deleted file mode 100644
index f0f18cfbd7..0000000000
--- a/files/es/web/javascript/referencia/características_desaprobadas/index.html
+++ /dev/null
@@ -1,292 +0,0 @@
----
-title: Características en desuso y obsoletas
-slug: Web/JavaScript/Referencia/Características_Desaprobadas
-tags:
-  - Deprecated
-  - JavaScript
-  - Obsolete
-translation_of: Web/JavaScript/Reference/Deprecated_and_obsolete_features
----
-<p>{{JsSidebar("More")}}</p>
-
-
-<p>Esta página enumera las características de JavaScript que están en desuso (es decir, todavía están disponibles pero se planea eliminarlas) y obsoletas (es decir, que ya no se pueden usar).</p>
-
-<h2 id="Características_en_desuso">Características en desuso</h2>
-
-<p>Estas características desaconsejadas aún se pueden usar, pero se deben usar con precaución porque se espera que se eliminen por completo en el futuro. Deberías trabajar para sustituirlas con las versiones recomendadas en tu código.</p>
-
-<h3 id="Propiedades_de_RegExp">Propiedades de RegExp</h3>
-
-<p>las siguientes propiedades están en desuso. Esto no afecta su uso en el {{jsxref("String.replace", "reemplazo de cadenas", "", 1)}}:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Propiedad</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.n", "$1-$9")}}</td>
-   <td>
-    <p>Coincidencias de subcadenas entre paréntesis, si las hay.<br>
-     <strong>Precaución:</strong> El uso de estas propiedades puede generar problemas, ya que las extensiones del navegador pueden modificarlas. ¡Evítalas!</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.input", "$_")}}</td>
-   <td>Consulta <code>entrada</code>.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.multiline", "$*")}}</td>
-   <td>Consulta <code>multiline</code>.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.lastMatch", "$&amp;")}}</td>
-   <td>Consulta <code>lastMatch</code>.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.lastParen", "$+")}}</td>
-   <td>Consulta <code>lastParen</code>.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.leftContext", "$`")}}</td>
-   <td>Consulta <code>leftContext</code>.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.rightContext", "$'")}}</td>
-   <td>Consulta <code>rightContext</code>.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.input", "input")}}</td>
-   <td>La cadena contra la que se compara una expresión regular.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.lastMatch", "lastMatch")}}</td>
-   <td>Los últimos caracteres coincidentes.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.lastParen", "lastParen")}}</td>
-   <td>La última coincidencia de subcadena entre paréntesis, si la hubiera.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.leftContext", "leftContext")}}</td>
-   <td>La subcadena que precede a la coincidencia más reciente.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.rightContext", "rightContext")}}</td>
-   <td>La subcadena que sigue a la coincidencia más reciente.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Las siguientes ahora son propiedades de instancias de <code>RegExp</code>, ya no del objeto <code>RegExp</code>:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Propiedad</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.global", "global")}}</td>
-   <td>Si se debe probar o no la expresión regular con todas las posibles coincidencias en una cadena, o solo con la primera.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.ignoreCase", "ignoreCase")}}</td>
-   <td>Si se deben o no ignorar las mayúsculas/minúsculas al intentar una coincidencia en una cadena.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.lastIndex", "lastIndex")}}</td>
-   <td>El índice en el que comenzará la siguiente coincidencia.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.multiline", "multiline")}}</td>
-   <td>Si buscar o no en cadenas de varias líneas.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("RegExp.source", "source")}}</td>
-   <td>El texto del patrón.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Métodos_RegExp">Métodos RegExp</h3>
-
-<ul>
- <li>El método {{jsxref("RegExp.compile", "compile()")}} está en desuso.</li>
- <li>El método <code>valueOf</code> ya no está especializado para <code>RegExp</code>. Usa {{jsxref ("Object.valueOf()")}}.</li>
-</ul>
-
-<h3 id="Propiedades_de_función">Propiedades de función</h3>
-
-<ul>
- <li>Las propiedades {{jsxref("Global_Objects Function/caller", "caller")}} y {{jsxref("Global_Objects/Function/argument", "argument")}} están obsoletas porque filtran la función llamadora. En lugar de la propiedad arguments, debes usar el objeto {{jsxref("Functions/arguments", "arguments")}} dentro de los cierres de funciones.</li>
-</ul>
-
-<h3 id="Generador_heredado">Generador heredado</h3>
-
-<ul>
- <li>La {{jsxref("Statements/Legacy_generator_function", "Declaración de función del generador heredado")}} y {{jsxref("Operators/Legacy_generator_function", "Expresión de función del generador heredado")}} están en desuso. En su lugar usa {{jsxref("Statements/function*", "declaraciones function*")}} y {{jsxref ("Operators/function *", "expresión function*")}}.</li>
- <li>{{jsxref("Operators/Array_comprehensions", "JS1.7/JS1.8 Array comprehension", "#Differences_to_the_older_JS1.7.2FJS1.8_comprehensions")}} y {{jsxref("Operators/Generator_comprehensions", "JS1.7/JS1.8 Generator comprehension", "#Differences_to_the_older_JS1.7.2FJS1.8_comprehensions")}} están en desuso.</li>
-</ul>
-
-<h3 id="Iterador">Iterador</h3>
-
-<ul>
- <li>{{jsxref("Global_Objects/StopIteration", "StopIteration")}} está en desuso.</li>
- <li>{{jsxref("Global_Objects/Iterator", "Iterator")}} está en desuso.</li>
-</ul>
-
-<h3 id="Métodos_de_objeto">Métodos de objeto</h3>
-
-<ul>
- <li>{{jsxref("Object.watch", "watch")}} y {{jsxref("Object.unwatch", "unwatch")}} están en desuso. En su lugar usa {{jsxref("Proxy")}}.</li>
- <li><code>__iterator__</code> está en desuso.</li>
- <li>{{jsxref("Object.noSuchMethod", "__noSuchMethod__")}} está en desuso. En su lugar usa {{jsxref("Proxy")}}.</li>
-</ul>
-
-<h3 id="Métodos_de_Date">Métodos de <code>Date</code></h3>
-
-<ul>
- <li>{{jsxref("Global_Objects/Date/getYear", "getYear")}} y {{jsxref("Global_Objects/Date/setYear", "setYear")}} se ven afectados por el problema del año 2000 y se han subsumido por {{jsxref("Global_Objects/Date/getFullYear", "getFullYear")}} y {{jsxref("Global_Objects/Date/setFullYear", "setFullYear")}}.</li>
- <li>En nuevo código, debes usar {{jsxref("Global_Objects/Date/toISOString", "toISOString")}} en lugar del método en desuso {{jsxref("Global_Objects/Date/toGMTString", "toGMTString")}}.</li>
- <li>{{jsxref("Global_Objects/Date/toLocaleFormat", "toLocaleFormat")}} está en desuso.</li>
-</ul>
-
-<h3 id="Funciones">Funciones</h3>
-
-<ul>
- <li>Las {{jsxref ("Operadores/Expression_closures", "expresiones closure", "", 1)}} están en desuso. En su lugar, utiliza {{jsxref("Operators/function", "funciones")}} o {{jsxref("Functions/Arrow_functions", "funciones de flecha", "", 1)}} normales.</li>
-</ul>
-
-<h3 id="Proxy">Proxy</h3>
-
-<ul>
- <li><a href="/es/docs/Archive/Web/Old_Proxy_API">Proxy.create</a> y <a href="/es/docs/Archive/Web/Old_Proxy_API">Proxy.createFunction</a> están en desuso. En su lugar usa {{jsxref("Proxy")}}.</li>
- <li>Las siguientes trampas están obsoletas:
-  <ul>
-   <li><code>hasOwn</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=980565">bug 980565</a>, Firefox 33).</li>
-   <li><code>getEnumerablePropertyKeys</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=783829">bug 783829</a>, Firefox 37)</li>
-   <li><code>getOwnPropertyNames</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1007334">bug 1007334</a>, Firefox 33)</li>
-   <li><code>keys</code> (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1007334">bug 1007334</a>, Firefox 33)</li>
-  </ul>
- </li>
-</ul>
-
-<h3 id="Secuencias_de_escape">Secuencias de escape</h3>
-
-<ul>
- <li>Las secuencias de escape octales (\ seguida de uno, dos o tres dígitos octales) están en desuso en los literales de cadenas y expresiones regulares.</li>
- <li>Las funciones {{jsxref("Global_Objects/escape", "escape")}} y {{jsxref("Global_Objects/unescape", "unescape")}} están en desuso. Usa {{jsxref("Global_Objects/encodeURI", "encodeURI")}}, {{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent")}}, {{jsxref("Global_Objects/decodeURI", "decodeURI")}} o {{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent")}} para codificar y decodificar secuencias de escape para caracteres especiales.</li>
-</ul>
-
-<h3 id="Métodos_de_cadena">Métodos de cadena</h3>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/tag/HTML%20wrapper%20methods">Métodos de envoltura HTML</a> tal como {{jsxref("String.prototype.fontsize")}} y {{jsxref("String.prototype.big")}}.</li>
- <li>{{jsxref("String.prototype.quote")}} se eliminó desde Firefox 37.</li>
- <li>el parámetro no estándar <code>flags</code> en {{jsxref("String.prototype.search")}}, {{jsxref("String.prototype.match")}} y {{jsxref("String.prototype.replace ")}} están en desuso.</li>
- <li>{{jsxref("String.prototype.substr")}} probablemente no se eliminará pronto, pero está definido en el <a href="https://www.ecma-international.org/ecma-262/9.0/index.html#sec-string.prototype.substr" rel="noopener">Anexo B</a> del estándar ECMA-262, cuya <a href="https://www.ecma-international.org/ecma-262/9.0/index.html#sec-additional-ecmascript-features-for-web-browsers">introducción</a> dice: "... Los programadores no deben usar o asumir la existencia de estas características y comportamientos al escribir un nuevo código ECMAScript. ..."</li>
-</ul>
-
-<h2 id="Características_obsoletas">Características obsoletas</h2>
-
-<p>Estas características obsoletas se han eliminado por completo de JavaScript y ya no se pueden utilizar a partir de la versión indicada de JavaScript.</p>
-
-<h3 id="Objeto">Objeto</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Propiedad</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>{{jsxref("Global_Objects/Object/count", "__count__")}}</td>
-   <td>Devuelve el número de propiedades enumerables directamente en un objeto definido por el usuario.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Global_Objects/Object/Parent", "__parent__")}}</td>
-   <td>Apunta al contexto de un objeto.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Global_Objects/Object/eval", "Object.prototype.eval()")}}</td>
-   <td>Evalúa una cadena de código JavaScript en el contexto del objeto especificado.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Object.observe()")}}</td>
-   <td>Observar de forma asincrónica los cambios en un objeto.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Object.unobserve()")}}</td>
-   <td>Elimina observadores.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Object.getNotifier()")}}</td>
-   <td>Crea un objeto que permite desencadenar sintéticamente un cambio.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Función">Función</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Propiedad</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>{{jsxref("Global_Objects/Function/arity", "arity")}}</td>
-   <td>Número de argumentos formales.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Array">Array</h3>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Propiedad</td>
-   <td>Descripción</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Array.observe()")}}</td>
-   <td>Observación asincrónica de cambios en los arreglos.</td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Array.unobserve()")}}</td>
-   <td>Elimina observadores.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Número">Número</h3>
-
-<ul>
- <li>{{jsxref("Number.toInteger()")}}</li>
-</ul>
-
-<h3 id="ParallelArray">ParallelArray</h3>
-
-<ul>
- <li>{{jsxref("ParallelArray")}}</li>
-</ul>
-
-<h3 id="Declaraciones">Declaraciones</h3>
-
-<ul>
- <li>{{jsxref("Statements/for_each...in", "for each...in")}} está obsoleta. En su lugar utiliza {{jsxref("Statements/for...of", "for...of")}}.</li>
- <li>La desestructuración {{jsxref("Statements/for...in", "for...in")}} está obsoleta. En su lugar utiliza {{jsxref("Statements/for...of", "for...of")}}.</li>
- <li>los bloques let y la expresiones let están obsoletas.</li>
-</ul>
-
-<h3 id="E4X">E4X</h3>
-
-<p>Consulta <a href="/es/docs/Archive/Web/E4X">E4X</a> para obtener más información.</p>
-
-<h3 id="Variables_nítidas">Variables nítidas</h3>
-
-<p>Consulta <a href="/es/docs/Archive/Web/Sharp_variables_in_JavaScript">Variables nítidas en JavaScript</a> para obtener más información.</p>
diff --git a/files/es/web/javascript/referencia/características_desaprobadas/the_legacy_iterator_protocol/index.html b/files/es/web/javascript/referencia/características_desaprobadas/the_legacy_iterator_protocol/index.html
deleted file mode 100644
index 5ef865f0bb..0000000000
--- a/files/es/web/javascript/referencia/características_desaprobadas/the_legacy_iterator_protocol/index.html
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: The legacy Iterator protocol
-slug: >-
-  Web/JavaScript/Referencia/Características_Desaprobadas/The_legacy_Iterator_protocol
-translation_of: >-
-  Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol
----
-<div>{{jsSidebar("More")}}</div>
-
-<div class="warning"><strong>Non-standard.</strong> The legacy iterator protocol is a SpiderMonkey-specific feature, and will be removed at some point. For future-facing usages, consider using <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of" title="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for..of</a> loops and the <a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">iterator protocol</a>.</div>
-
-<h2 id="The_deprecated_Firefox-only_iterator_protocol">The deprecated Firefox-only iterator protocol</h2>
-
-<p>Firefox, prior to version 26 implemented another iterator protocol that is similar to the standard <a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">ES6 Iterator protocol</a>.</p>
-
-<p>An object is an legacy iterator when it implements a <code>next()</code> method with the following semantics, and throws {{jsxref("Global_Objects/StopIteration", "StopIteration")}} at the end of iteration.</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Property</th>
-   <th scope="col">Value</th>
-  </tr>
-  <tr>
-   <td><code>next</code></td>
-   <td>A zero arguments function that returns an value.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Difference_between_legacy_and_ES6_iterator_protocols">Difference between legacy and ES6 iterator protocols</h3>
-
-<ul>
- <li>The value was returned directly as a return value of calls to <code>next</code>, instead of the <code>value</code> property of a placeholder object</li>
- <li>Iteration termination was expressed by throwing a {{jsxref("Global_Objects/StopIteration", "StopIteration")}} object.</li>
-</ul>
-
-<h3 id="Simple_example_with_the_old_protocol">Simple example with the old protocol</h3>
-
-<pre class="brush: js">function makeIterator(array){
-    var nextIndex = 0;
-
-    return {
-       next: function(){
-           if(nextIndex &lt; array.length){
-               return array[nextIndex++];
-           else
-               throw new StopIteration();
-       }
-    }
-}
-
-var it = makeIterator(['yo', 'ya']);
-
-console.log(it.next()); // 'yo'
-console.log(it.next()); // 'ya'
-try{
-    console.log(it.next());
-}
-catch(e){
-    if(e instanceof StopIteration){
-         // iteration over
-    }
-}
-</pre>
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iteradores y generadores</a></li>
- <li>Más More <a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features">características obsoletas</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/classes/class_fields/index.html b/files/es/web/javascript/referencia/classes/class_fields/index.html
deleted file mode 100644
index 446c63c001..0000000000
--- a/files/es/web/javascript/referencia/classes/class_fields/index.html
+++ /dev/null
@@ -1,386 +0,0 @@
----
-title: Class fields
-slug: Web/JavaScript/Referencia/Classes/Class_fields
-tags:
-  - Clases
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Classes/Public_class_fields
----
-<div>{{JsSidebar("Classes")}}</div>
-
-<div class="note">Las declaraciones de campos públicos y privados son una <a href="https://github.com/tc39/proposal-class-fields">característica experimental (en estado 3)</a> propuesta por el <a href="https://tc39.github.io/beta/">TC39</a>, el comite de estandares de JavaScript. El soporte y funcionamiento en navegadores es limitado, pero la funcionalidad puede ser usada a través de un paso durante el proceso del build por medio de sistemas como <a href="https://babeljs.io/">Babel</a>. Revise <a href="#Browser_compatibility">compat information</a> mas abajo.</div>
-
-<p>Los campos públicos y estáticos son propieades editables, enumerables, y configurables. A diferencia de su contraparte privada, estos participan en la herencia de prototipo.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">class ClassWithInstanceField {
-  instanceField = 'instance field'
-}
-
-class ClassWithStaticField {
-  static staticField = 'static field'
-}
-
-class ClassWithPublicInstanceMethod {
-  publicMethod() {
-    return 'hello world'
-  }
-}
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Campos_públicos_estáticos">Campos públicos estáticos</h3>
-
-<p>Los campos estáticos públicos son útiles cuando desea que exista un campo solo una vez por clase, no en cada instancia de clase que cree. Esto es útil para cachés, configuración fija o cualquier otro dato que no necesite replicarse en todas las instancias.</p>
-
-<p>Los campos estáticos públicos se declaran utilizando la palabra clave <code>static</code>. Se agregan al constructor de la clase en el momento de la evaluación de la clase utilizando {{jsxref("Global_Objects/Object/defineProperty", "Object.defineProperty()")}}. Se accede nuevamente desde el constructor de la clase.</p>
-
-<pre class="brush: js notranslate">class ClassWithStaticField {
-  static staticField = 'static field';
-}
-
-console.log(ClassWithStaticField.staticField);
-// expected output: "static field"​
-</pre>
-
-<p>Campos sin inicializadores son inicializados como <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">class ClassWithStaticField {
-  static staticField;
-}
-
-console.assert(ClassWithStaticField.hasOwnProperty('staticField'));
-console.log(ClassWithStaticField.staticField);
-// expected output: "undefined"</pre>
-
-<p>Los campos estáticos públicos no se reinicializan en las subclases, pero se puede acceder a ellos a través de la cadena de prototipo.</p>
-
-<pre class="brush: js notranslate">class ClassWithStaticField {
-  static baseStaticField = 'base field';
-}
-
-class SubClassWithStaticField extends ClassWithStaticField {
-  static subStaticField = 'sub class field';
-}
-
-console.log(SubClassWithStaticField.subStaticField);
-// expected output: "sub class field"
-
-console.log(SubClassWithStaticField.baseStaticField);
-// expected output: "base field"</pre>
-
-<p>Cuando se inicializasn campos <code>this</code> se refiere al constuctor de clase. Tambien puede ser referenciado por nombre, y se puede usar <code>super</code> para obtener el constructor de la superclase si lo tiene.</p>
-
-<pre class="brush: js notranslate">class ClassWithStaticField {
-  static baseStaticField = 'base static field';
-  static anotherBaseStaticField = this.baseStaticField;
-
-  static baseStaticMethod() { return 'base static method output'; }
-}
-
-class SubClassWithStaticField extends ClassWithStaticField {
-  static subStaticField = super.baseStaticMethod();
-}
-
-console.log(ClassWithStaticField.anotherBaseStaticField);
-// expected output: "base static field"
-
-console.log(SubClassWithStaticField.subStaticField);
-// expected output: "base static method output"
-</pre>
-
-<h3 id="Campos_de_instancia_públicos">Campos de instancia públicos</h3>
-
-<p>Los campos de instancia públicos existen en cada instancia de la clase que se ha creado. Al declarar un campo publico podemos asegurarnos que dicho campo siempre esta presente, y la definicion de la clase esta auto-documentada.</p>
-
-<p>Los campos de instancia públicos son agregados with <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a> ya sea a la hora de ser construido en la clase base (antes que el metodo constructor corra), o justo despues que  <code>super()</code> returne en una subclase.</p>
-
-<pre class="brush: js notranslate">class ClassWithInstanceField {
-  instanceField = 'instance field';
-}
-
-const instance = new ClassWithInstanceField();
-console.log(instance.instanceField);
-// expected output: "instance field"</pre>
-
-<p>Campos sin inicializadores son inicilizados en <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">class ClassWithInstanceField {
-  instanceField;
-}
-
-const instance = new ClassWithInstanceField();
-console.assert(instance.hasOwnProperty('instanceField'));
-console.log(instance.instanceField);
-// expected output: "undefined"</pre>
-
-<p>Al igual que las propiedades, los nombres de campos pueden ser calculados (computed)</p>
-
-<pre class="brush: js notranslate">const PREFIX = 'prefix';
-
-class ClassWithComputedFieldName {
-    [`${PREFIX}Field`] = 'prefixed field';
-}
-
-const instance = new ClassWithComputedFieldName();
-console.log(instance.prefixField);
-// expected output: "prefixed field"</pre>
-
-<p>Cuando se inicializan campos <code>this</code> se refiere a la instancia de clase que esta siendo construida. Al igual que con los metodos publicos de instancia, si usted esta en una subclase puede acceder a al prototypo de la superclase usando <code>super</code>.</p>
-
-<pre class="brush: js notranslate">class ClassWithInstanceField {
-  baseInstanceField = 'base field';
-  anotherBaseInstanceField = this.baseInstanceField;
-  baseInstanceMethod() { return 'base method output'; }
-}
-
-class SubClassWithInstanceField extends ClassWithInstanceField {
-  subInstanceField = super.baseInstanceMethod();
-}
-
-const base = new ClassWithInstanceField();
-const sub = new SubClassWithInstanceField();
-
-console.log(base.anotherBaseInstanceField);
-// expected output: "base field"
-
-console.log(sub.subInstanceField);
-// expected output: "base method output"</pre>
-
-<h3 id="Métodos_públicos">Métodos públicos</h3>
-
-<h4 id="Métodos_públicos_estáticos">Métodos públicos estáticos</h4>
-
-<p>La palabra reservada <code><strong>static</strong></code> define un metodo estático para una clase. Los métodos estáticos no son llamads usando una instancia de la clase. En lugar de eso son llamados sobre la clase como tal. Estos metodos estáticos son frecuentemente funciones utilitarias que permiten por ejemplo la creación y clonacion de objetos.</p>
-
-<pre class="brush: js notranslate">class ClassWithStaticMethod {
-  static staticMethod() {
-    return 'static method has been called.';
-  }
-}
-
-console.log(ClassWithStaticMethod.staticMethod());
-// expected output: "static method has been called."</pre>
-
-<p>Los métodos estáticos son agregados al constructor de la clase usando <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a> duranten el evaluación de la clase. Estos metodos son "escribibles" (writable), no-enumerables y configurables.</p>
-
-<h4 id="Métodos_públicos_de_instancia">Métodos públicos de instancia</h4>
-
-<p>Como su nombre lo indica, los métodos publicos de instancia son metodos que estan disponibles para cualquier instancia de una clase.</p>
-
-<pre class="brush: js notranslate">class ClassWithPublicInstanceMethod {
-  publicMethod() {
-    return 'hello world';
-  }
-}
-
-const instance = new ClassWithPublicInstanceMethod();
-console.log(instance.publicMethod());
-// expected output: "hello worl​d"</pre>
-
-<p>Los métodos públicos de instancia son agregeados al prototipo de clase durante la evaluacón de la clase usando <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a>. Estos metodos son "escribibles" (writable), no-enumerables y configurables.</p>
-
-<p>Usted puede usar un generador, async y funciones generadoras asincronas</p>
-
-<pre class="brush: js notranslate">class ClassWithFancyMethods {
-  *generatorMethod() { }
-  async asyncMethod() { }
-  async *asyncGeneratorMethod() { }
-}</pre>
-
-<p>Dentro de un metodo de instancia, <code>this</code> se referie a la instancia como tal. En las subclases, <code>super</code> le permite acceder el prototipo de la superclase, permitiendo así llamar métodos de la superclase.</p>
-
-<pre class="brush: js notranslate">class BaseClass {
-  msg = 'hello world';
-  basePublicMethod() {
-    return this.msg;
-  }
-}
-
-class SubClass extends BaseClass {
-  subPublicMethod() {
-    return super.basePublicMethod();
-  }
-}
-
-const instance = new SubClass();
-console.log(instance.subPublicMethod());
-// expected output: "hello worl​d"
-</pre>
-
-<p>Existen metodos especiales llamados "Getters" y "Setters" que se vinculan a una propiedad de una clase, y que son ejecutados o llamados cuando esa propiedad es consultada o moditficada. Puede usar las palabras reservaddas <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get">get</a> y <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set">set</a> para declarar una instancia pública de "getter" or "setter". [N.T. preferí decir Getter/Setter que decir Consultadores/Mofificadores]</p>
-
-<pre class="brush: js notranslate">class ClassWithGetSet {
-  #msg = 'hello world';
-  get msg() {
-    return this.#msg;
-  }
-  set msg(x) {
-    this.#msg = `hello ${x}`;
-  }
-}
-
-const instance = new ClassWithGetSet();
-console.log(instance.msg);
-// expected output: "hello worl​d"
-
-instance.msg = 'cake';
-console.log(instance.msg);
-// expected output: "hello cake"
-</pre>
-
-<h2 id="Campos_privados">Campos privados</h2>
-
-<h3 id="Campos_privados_estáticos">Campos privados estáticos</h3>
-
-<p>Private fields are accessible on the class constructor from inside the class declaration itself.</p>
-
-<p>The limitation of static variables being called by only static methods still holds.</p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateStaticField {
-  static #PRIVATE_STATIC_FIELD;
-
-  static publicStaticMethod() {
-    ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD = 42;
-    return ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD;
-  }
-}
-
-assert(ClassWithPrivateStaticField.publicStaticMethod() === 42);</pre>
-
-<p>Private static fields are added to the class constructor at class evaluation time.</p>
-
-<p>There is a provenance restriction on private static fields. Only the class which defines the private static field can access the field. This can lead to unexpected behaviour when using <strong><code>this</code></strong></p>
-
-<pre class="brush: js notranslate">class BaseClassWithPrivateStaticField {
-  static #PRIVATE_STATIC_FIELD;
-
-  static basePublicStaticMethod() {
-    this.#PRIVATE_STATIC_FIELD = 42;
-    return this.#PRIVATE_STATIC_FIELD;
-  }
-}
-
-class SubClass extends BaseClassWithPrivateStaticField { }
-
-assertThrows(() =&gt; SubClass.basePublicStaticMethod(), TypeError);
-</pre>
-
-<h3 id="Campos_privados_de_instancia">Campos privados de instancia</h3>
-
-<p>Private instance fields are declared with <strong># names </strong>( pronounced "hash names"), which are identifiers prefixed with #. The # is a part of the name itself and is used for declaration and accessing as well.</p>
-
-<p>The encapsulation is enforced by the language. It is a syntax error to refer to # names not in scope.</p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateField {
-  #privateField;
-
-  constructor() {
-    this.#privateField = 42;
-    this.#randomField = 666; # Syntax error
-  }
-}
-
-const instance = new ClassWithPrivateField();
-instance.#privateField === 42; // Syntax error
-</pre>
-
-<h2 id="Métodos_privados">Métodos privados</h2>
-
-<h3 id="Métodos_privados_estáticos">Métodos privados estáticos</h3>
-
-<p>Like their public equivalent, private static methods are called on the class, not instances of the class. Like private static fields, they are only accessible from inside the class declaration.</p>
-
-<p>Private static methods may be generator, async and async generator functions.</p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateStaticMethod {
-    static #privateStaticMethod() {
-        return 42;
-    }
-
-    static publicStaticMethod() {
-        return ClassWithPrivateStaticMethod.#privateStaticMethod();
-    }
-}
-
-assert(ClassWithPrivateStaticField.publicStaticMethod() === 42);
-</pre>
-
-<h3 id="Métodos_privados_de_instancia">Métodos privados de instancia</h3>
-
-<p>Private instance methods are methods available on class instances whose access is restricted in the same manner as private instance fields.</p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateMethod {
-  #privateMethod() {
-    return 'hello world';
-  }
-
-  getPrivateMessage() {
-      return #privateMethod();
-  }
-}
-
-const instance = new ClassWithPrivateMethod();
-console.log(instance.getPrivateMessage());
-// expected output: "hello worl​d"</pre>
-
-<p>Private instance methods may be generator, async or async generator functions. Private getters and setters are also possible:</p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateAccessor {
-  #message;
-
-  get #decoratedMessage() {
-    return `✨${this.#message}✨`;
-  }
-  set #decoratedMessage(msg) {
-    this.#message = msg;
-  }
-
-  constructor() {
-    this.#decoratedMessage = 'hello world';
-    console.log(this.#decoratedMessage);
-  }
-}
-
-new ClassWithPrivateAccessor();
-// expected output: "✨hello worl​d✨"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td><a href="https://tc39.es/proposal-class-fields/#prod-FieldDefinition">FieldDefinition production</a></td>
-   <td>Stage 3</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<h3 id="Campos_públicos_de_clse">Campos públicos de clse</h3>
-
-
-
-<p>{{Compat("javascript.classes.public_class_fields")}}</p>
-
-<h3 id="Campos_privados_de_clase">Campos privados de clase</h3>
-
-<div class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</div>
-
-<p>{{Compat("javascript.classes.private_class_fields")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://rfrn.org/~shu/2018/05/02/the-semantics-of-all-js-class-elements.html">The Semantics of All JS Class Elements</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/classes/constructor/index.html b/files/es/web/javascript/referencia/classes/constructor/index.html
deleted file mode 100644
index 9ad7ec8de9..0000000000
--- a/files/es/web/javascript/referencia/classes/constructor/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: constructor
-slug: Web/JavaScript/Referencia/Classes/constructor
-tags:
-  - Clases
-  - ECMAScript6
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Classes/constructor
----
-<div>{{jsSidebar("Classes")}}</div>
-
-<p>El método constructor es un metodo especial para crear e inicializar un objeto creado a partir de una clase.</p>
-
-<p>El código fuente para este ejemplo interactivo se encuentra almacenado en un repositorio de Github. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud para extraer el código (pull request).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">constructor([argumentos]) { ... }</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Sólo puede haber un método especial con el nombre de "constructor" en una clase. Un error de sintaxis será lanzado, si la clase contiene más de una ocurrencia de un método constructor.</p>
-
-<p>Un constructor puede utilizar la palabra clave super para llamar al constructor de una clase padre.</p>
-
-<p>Si no especifica un método constructor, se utiliza un constructor predeterminado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_constructor">Usando el método constructor</h3>
-
-<p>Este fragmento de código se toma de la <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">classes sample</a> (<a href="https://googlechrome.github.io/samples/classes-es6/index.html">live demo</a>).</p>
-
-<pre class="brush: js notranslate">class Square extends Polygon {
-  constructor(length) {
-    // Aquí, llama al constructor de la clase padre con sus longitudes
-    // contemplando la anchura y la altura del Polígono
-    super(length, length);
-    // Nota: En las clases derivadas, super() se debe llamar primero
-    // Se puede utilizar "this". Dejando esto causará un error de
-    //referencia.
-    this.name = 'Square';
-  }
-
-  get area() {
-    return this.height * this.width;
-  }
-
-  set area(value) {
-    this.area = value;
-  }
-}</pre>
-
-<h3 id="Constructores_por_defecto">Constructores por defecto</h3>
-
-<p>Si no especifica un método constructor, se utiliza un constructor predeterminado. Para las clases base, el constructor por defecto es:</p>
-
-<pre class="brush: js notranslate">constructor() {}
-</pre>
-
-<p>Para las clases derivadas, el constructor por defecto es:</p>
-
-<pre class="brush: js notranslate">constructor(...args) {
-  super(...args);
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-static-semantics-constructormethod', 'Constructor Method')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{Compat("javascript.classes.constructor")}}</p>
-
-<p>La tabla de compatibilidad de esta pagina está generada a partir de data estructurada. Si quieres contribuir a la data, por favor dirígete a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super()</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/class"><code>class</code> expression</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/class"><code>class</code> declaration</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Classes</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/classes/extends/index.html b/files/es/web/javascript/referencia/classes/extends/index.html
deleted file mode 100644
index 6781c3801e..0000000000
--- a/files/es/web/javascript/referencia/classes/extends/index.html
+++ /dev/null
@@ -1,167 +0,0 @@
----
-title: extends
-slug: Web/JavaScript/Referencia/Classes/extends
-translation_of: Web/JavaScript/Reference/Classes/extends
----
-<div>{{jsSidebar("Classes")}}</div>
-
-<p>La palabra clave <strong>extends</strong> es usada en la <a href="/en-US/docs/Web/JavaScript/Reference/Statements/class">declaración</a> o <a href="/en-US/docs/Web/JavaScript/Reference/Operators/class">expresión</a> de clases, para crear una clase hija de otra.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">class ChildClass extends ParentClass { ... }</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La palabra clave <code>extends</code> se puede usar para crear una subclase a partir de clases personalizadas, así como sus objetos incorporados.</p>
-
-<p>La propiedad <code>.prototype</code> de la nueva subclase debe ser un {{jsxref("Object")}} o {{jsxref("null")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Como_usar_extends">Como usar <code>extends</code></h3>
-
-<p>El primer ejemplo crea una clase con el nombre <code>Square</code> a partir de una clase llamada <code>Polygon</code>. Este ejemplo ha sido extraido del siguiente <a href="https://googlechrome.github.io/samples/classes-es6/index.html">live demo</a> <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">(código fuente)</a>.</p>
-
-<pre class="brush: js">class Square extends Polygon {
-  constructor(length) {
-    // Aquí se invoca el constructor de la clase padre con longitud
-    // proporcionada por el ancho y alto de Polygon
-    super(length, length);
-    // Nota: En las clases extendidas, se debe llamar a super()
-    // antes de poder usar 'this'. El no hacerlo provocará un reference error.
-    this.name = 'Square';
-  }
-
-  get area() {
-    return this.height * this.width;
-  }
-
-  set area(value) {
-    this.area = value;
-  }
-}</pre>
-
-<h3 id="Como_usar_extends_con_objetos_incorporados">Como usar <code>extends</code> con objetos incorporados</h3>
-
-<p>Este ejemplo extiende el objeto incorporado {{jsxref("Date")}}. Este ejemplo ha sido extraido del siguiente <a href="https://googlechrome.github.io/samples/classes-es6/index.html">live demo</a> <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">(código fuente)</a>.</p>
-
-<pre class="brush: js">class myDate extends Date {
-  constructor() {
-    super();
-  }
-
-  getFormattedDate() {
-    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
-    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
-  }
-}</pre>
-
-<h3 id="Extendiendo_de_null">Extendiendo de <code>null</code></h3>
-
-<p>Extender de {{jsxref("null")}} es como hacerlo de una clase normal, excepto que el objeto prototype no hereda de {{jsxref("Object.prototype")}}.</p>
-
-<pre class="brush: js">class nullExtends extends null {
-  constructor() {}
-}
-
-Object.getPrototypeOf(nullExtends); // Function.prototype
-Object.getPrototypeOf(nullExtends.prototype) // null</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-class-definitions', 'extends')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-class-definitions', 'extends')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>{{CompatGeckoDesktop(45)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Array subclassing</td>
-   <td>{{CompatChrome(43.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile(45)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(42.0)}}</td>
-  </tr>
-  <tr>
-   <td>Array subclassing</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(43.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Clases</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/classes/index.html b/files/es/web/javascript/referencia/classes/index.html
deleted file mode 100644
index 0f108dda68..0000000000
--- a/files/es/web/javascript/referencia/classes/index.html
+++ /dev/null
@@ -1,372 +0,0 @@
----
-title: Clases
-slug: Web/JavaScript/Referencia/Classes
-tags:
-  - Classes
-  - ECMAScript 2015
-  - Herencia
-  - Intermedio
-  - JavaScript
-  - NeedsContent
-  - NeedsTranslation
-  - Reference
-  - TopicStub
-translation_of: Web/JavaScript/Reference/Classes
----
-<div>{{JsSidebar("Classes")}}</div>
-
-<p>Las clases de javascript, introducidas en ECMAScript 2015, son una mejora sintáctica sobre la herencia basada en prototipos de JavaScript. La sintaxis de las clases <strong>no</strong> introduce un nuevo modelo de herencia orientada a objetos en JavaScript. Las clases de JavaScript proveen una sintaxis mucho más clara y simple para crear objetos y lidiar con la herencia.</p>
-
-<h2 id="Definiendo_clases">Definiendo clases</h2>
-
-<p>Las clases son "<a href="/en-US/docs/Web/JavaScript/Reference/Functions">funciones</a> especiales", como las <a href="/en-US/docs/Web/JavaScript/Reference/Operators/function">expresiones de funciones</a> y <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function">declaraciones de funciones</a>, la sintaxis de una clase tiene dos componentes: <a href="/en-US/docs/Web/JavaScript/Reference/Operators/class">expresiones de clases</a> y <a href="/en-US/docs/Web/JavaScript/Reference/Statements/class">declaraciones de clases</a>.</p>
-
-<h3 id="Declaración_de_clases">Declaración de clases</h3>
-
-<p>Una manera de definir una clase es mediante una <strong>declaración de clase</strong><em>. </em>Para declarar una clase, se utiliza la palabra reservada <code>class</code> y un nombre para la clase "Rectangulo".</p>
-
-<pre class="brush: js notranslate">class Rectangulo {
-  constructor(alto, ancho) {
-    this.alto = alto;
-    this.ancho = ancho;
-  }
-}</pre>
-
-<h4 id="Alojamiento">Alojamiento</h4>
-
-<p>Una importante diferencia entre las <strong>declaraciones de funciones</strong><em> y </em>las <strong>declaraciones de clases</strong> es que las <strong>declaraciones de funciones</strong><em> </em>son alojadas y las <strong>declaraciones de clases</strong><em> </em>no lo son. En primer lugar necesitas declarar tu clase y luego acceder a ella, de otro modo el ejemplo de código siguiente arrojará un {{jsxref("ReferenceError")}}:</p>
-
-<pre class="brush: js example-bad notranslate">const p = new Rectangle(); // ReferenceError
-
-class Rectangle {}
-</pre>
-
-<h3 id="Expresiones_de_clases">Expresiones de clases</h3>
-
-<p>Una <strong>expresión de clase</strong> es otra manera de definir una clase. Las expresiones de clase pueden ser nombradas o anónimas. El nombre dado a la <strong>expresión de clase</strong> nombrada es local dentro del cuerpo de la misma.</p>
-
-<pre class="notranslate">// Anonima
-let Rectangulo = class {
-  constructor(alto, ancho) {
-    this.alto = alto;
-    this.ancho = ancho;
-  }
-};
-
-console.log(Rectangulo.name);
-// output: "Rectangulo"
-
-// Nombrada
-let Rectangulo = class Rectangulo2 {
-  constructor(alto, ancho) {
-    this.alto = alto;
-    this.ancho = ancho;
-  }
-};
-console.log(Rectangulo.name);
-// output: "Rectangulo2"
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> Las <strong>expresiones</strong> de clase están sujetas a las mismas restricciones de elevación que se describen en la sección {{anch("Class declarations")}}.</p>
-</div>
-
-<h2 id="Cuerpo_de_la_clase_y_definición_de_métodos">Cuerpo de la clase y definición de métodos</h2>
-
-<p>El contenido<em> </em>de una <strong>clase </strong>es la parte que se encuentra entre las llaves <code>{}</code>. Este es el lugar se definen los <strong>miembros de clase,</strong> como los <strong>métodos </strong>o <strong>constructores.</strong></p>
-
-<h3 id="Modo_estricto">Modo estricto</h3>
-
-<p>El cuerpo de las <em>declaraciones de clase</em> y las <em>expresiones de clase</em> son ejecutadas en <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode">modo estricto.</a> En otras palabras, el código escrito aquí está sujeto a una sintaxis más estricta para aumentar el rendimiento, se arrojarán algunos errores silenciosos y algunas palabras clave están reservadas para versiones futuras de ECMAScript.</p>
-
-<h3 id="Constructor">Constructor</h3>
-
-<p>El método <code><a href="/en-US/docs/Web/JavaScript/Reference/Classes/constructor">constructor</a></code> es un método especial para crear e inicializar un objeto creado con una <code>clase</code>. Solo puede haber un método especial con el nombre "constructor" en una clase. Si esta contiene mas de una ocurrencia del método <code><strong>constructor, </strong></code>se arrojará un <em>Error </em>{{jsxref("SyntaxError")}}</p>
-
-<p>Un <strong>constructor</strong> puede usar la <em>palabra reservada</em> <strong><code>super </code></strong>para llamar al <strong>constructor </strong>de una <em>superclase</em></p>
-
-<h3 id="Métodos_prototipo">Métodos prototipo</h3>
-
-<p>Vea también <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">métodos definidos</a>.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">class Rectangulo {
-  constructor (alto, ancho) {
-    this.alto = alto;
-    this.ancho = ancho;
-  }
-  // Getter
-  get area() {
-     return this.calcArea();
-   }
-  // Método
-  calcArea () {
-    return this.alto * this.ancho;
-  }
-}
-
-const cuadrado = new Rectangulo(10, 10);
-
-console.log(cuadrado.area); // 100</code></pre>
-
-<div class="syntaxbox"></div>
-
-<h3 id="Métodos_estáticos">Métodos estáticos</h3>
-
-<p>La <em>palabra clave</em> <code><a href="/en-US/docs/Web/JavaScript/Reference/Classes/static">static</a></code> define un método estático para una clase. Los métodos estáticos son llamados sin instanciar su clase y <strong>no</strong> pueden ser llamados mediante una instancia de clase. Los métodos estáticos son a menudo usados para crear funciones de utilidad para una aplicación.</p>
-
-<pre class="brush: js notranslate">class Punto {
-  constructor ( x , y ){
-    this.x = x;
-    this.y = y;
-  }
-
-  static distancia ( a , b) {
-    const dx = a.x - b.x;
-    const dy = a.y - b.y;
-
-    return Math.sqrt ( dx * dx + dy * dy );
-  }
-}
-
-const p1 = new Punto(5, 5);
-const p2 = new Punto(10, 10);
-
-console.log (Punto.distancia(p1, p2)); // 7.0710678118654755</pre>
-
-<h3 id="Boxing_con_prototipos_y_métodos_estáticos">"Boxing" con prototipos y métodos estáticos</h3>
-
-<p>Cuando un método estático o método del prototipo es llamado sin un valor para "this" (o con "this" como booleano, cadena, número, undefined o null), entonces el valor de "this" será <strong>undefined</strong> dentro de la funciona llamada. <em>Autoboxing </em>no ocurrirá. El comportamiento será igual inclusive si se escribe el código en modo no estricto.</p>
-
-<pre class="notranslate"><code>class Animal {
-  hablar() {
-    return this;
-  }
-  static comer() {
-    return this;
-  }
-}
-
-let obj = new Animal();
-obj.hablar(); // Animal {}
-let hablar = obj.hablar;
-hablar(); // undefined
-
-Animal.comer() // class Animal
-let comer = Animal.comer;
-comer(); // undefined</code></pre>
-
-<p>Si se escribe el código del cuadro superior usando clases función tradicionales, entonces autoboxing ocurrirara porque tomará valor de "this" sobre la función que es llamada.</p>
-
-<pre class="notranslate"><code>function Animal() { }
-
-Animal.prototype.hablar = function(){
-  return this;
-}
-
-Animal.comer = function() {
-  return this;
-}
-
-let obj = new Animal();
-let hablar = obj.hablar;
-hablar(); // global object
-
-let hablar = Animal.hablar;
-hablar(); // global object</code></pre>
-
-<h2 id="Subclases_con_extends">Subclases con <code>extends</code></h2>
-
-<p>La palabra clave <code><a href="/en-US/docs/Web/JavaScript/Reference/Classes/extends">extends</a></code> es usada en <em>declaraciones de clase</em> o <em>expresiones de clase</em> para crear una clase hija.</p>
-
-<pre class="brush: js notranslate"><code>class Animal {
-  constructor(nombre) {
-    this.nombre = nombre;
-  }
-
-  hablar() {
-    console.log(this.nombre + ' hace un ruido.');
-  }
-}
-
-class Perro extends Animal {
-  hablar() {
-    console.log(this.nombre + ' ladra.');
-  }
-}</code></pre>
-
-<p>También se pueden extender las clases tradicionales basadas en funciones:</p>
-
-<pre class="brush: js notranslate">function Animal (nombre) {
-  this.nombre = nombre;
-}
-Animal.prototype.hablar = function () {
-  console.log(this.nombre + 'hace un ruido.');
-}
-
-class Perro extends Animal {
-  hablar() {
-    super.hablar();
-    console.log(this.nombre + ' ladra.');
-  }
-}
-
-var p = new Perro('Mitzie');
-p.hablar();</pre>
-
-<p>Fijarse que las clases no pueden extender objectos regulares (literales). Si se quiere heredar de un objecto regular, se debe user {{jsxref("Object.setPrototypeOf()")}}::</p>
-
-<pre class="notranslate"><code>var Animal = {
-  hablar() {
-    console.log(this.nombre + 'hace ruido.');
-  }
-};
-
-class Perro {
-  constructor(nombre) {
-    this.nombre = nombre;
-  }
-  hablar() {
-    console.log(this.nombre + ' ladra.');
-  }
-}
-
-Object.setPrototypeOf(Perro.prototype, Animal);
-
-var d = new Perro('Mitzie');
-d.hablar();</code></pre>
-
-<h2 id="Especies">Especies</h2>
-
-<p>Quizás se quiera devolver objetos {{jsxref("Array")}} derivados de la clase array MyArray. El patron <em>species</em> permite sobreescribir constructores por defecto.</p>
-
-<p>Por ejemplo, cuando se usan metodos del tipo {{jsxref("Array.map", "map()")}} que devuelven el constructor por defecto, se quiere que esos métodos devuelvan un objeto padre Array, en vez de MyArray. El símbolo {{jsxref("Symbol.species")}} permite hacer:</p>
-
-<pre class="brush: js notranslate"><code>class MyArray extends Array {
-  // Sobre escribe species sobre el constructor padre Array
-  static get [Symbol.species]() { return Array; }
-}
-
-var a = new MyArray(1,2,3);
-var mapped = a.map(x =&gt; x * x);
-
-console.log(mapped instanceof MyArray); // false
-console.log(mapped instanceof Array);   // true</code>
-</pre>
-
-<h2 id="Llamadas_a_súperclases_con_super">Llamadas a súperclases con <code>super</code></h2>
-
-<p>La palabra clave <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/super">super</a></code> es usada para llamar funciones del objeto padre.</p>
-
-<pre class="notranslate"><code>class Gato {
-  constructor(nombre) {
-    this.nombre = nombre;
-  }
-
-  hablar() {
-    console.log(this.nombre + ' hace ruido.');
-  }
-}
-
-class Leon extends Gato {
-  hablar() {
-    super.hablar();
-    console.log(this.nombre + ' maulla.');
-  }
-}</code></pre>
-
-<h2 id="Mix-ins">Mix-ins</h2>
-
-<p>Subclases abstractas or <em>mix-ins</em> son plantillas de clases. Una clase ECMAScript solo puede tener una clase padre, con lo cual la herencia multiple no es posible. La funcionalidad debe ser proporcionada por la clase padre.</p>
-
-<p>Una función con una clase padre como entrada y una subclase extendiendo la clase padre como salida puede ser usado para implementar mix-ins en EMCAScript:</p>
-
-<pre class="brush: js notranslate"><code>var calculatorMixin = Base =&gt; class extends Base {
-  calc() { }
-};
-
-var randomizerMixin = Base =&gt; class extends Base {
-  randomize() { }
-};</code></pre>
-
-<p>Una clase que use este método puede ser escrita tal que así:</p>
-
-<pre class="brush: js notranslate"><code>class Foo { }
-class Bar extends calculatorMixin(randomizerMixin(Foo)) { }</code></pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-class-definitions', 'Class definitions')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>Available in the Nightly channel only (since February 2015)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>Available in the Nightly channel only (since February 2015)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(42.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
- <li>{{jsxref("Statements/class", "class declaration")}}</li>
- <li>{{jsxref("Operators/class", "class expression")}}</li>
- <li>{{jsxref("Operators/super", "super")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/classes/private_class_fields/index.html b/files/es/web/javascript/referencia/classes/private_class_fields/index.html
deleted file mode 100644
index 5826cc125b..0000000000
--- a/files/es/web/javascript/referencia/classes/private_class_fields/index.html
+++ /dev/null
@@ -1,201 +0,0 @@
----
-title: Private class fields
-slug: Web/JavaScript/Referencia/Classes/Private_class_fields
-translation_of: Web/JavaScript/Reference/Classes/Private_class_fields
----
-<div>
-<p><font><font>Las propiedades de la clase son públicas de forma predeterminada y se pueden examinar o modificar fuera de la clase. </font><font>Sin embargo, existe </font></font><a class="external" href="https://translate.googleusercontent.com/translate_c?depth=1&amp;pto=aue&amp;rurl=translate.google.com&amp;sl=en&amp;sp=nmt4&amp;tl=es&amp;u=https://github.com/tc39/proposal-class-fields&amp;usg=ALkJrhgmG5nvuZjYd2YQRSuRJHti_gdXeQ" rel="noopener"><font><font>una propuesta experimental</font></font></a><font><font>  para permitir la definición de campos de clase privados utilizando un </font></font><code>#</code><font><font>prefijo </font><font>hash </font><font>.</font></font></p>
-</div>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox notranslate">class ClassWithPrivateField {
-  #privateField
-}
-
-class ClassWithPrivateMethod {
-  #privateMethod() {
-    return 'hello world'
- }
-}
-
-class ClassWithPrivateStaticField {
-  static #PRIVATE_STATIC_FIELD
-}
-</pre>
-
-<h3 id="Campos_estáticos_privados"><font><font>Campos estáticos privados </font></font></h3>
-
-<p><font><font>Los campos privados son accesibles en el constructor de clases desde dentro de la propia declaración de clases.</font></font></p>
-
-<p><font><font>La limitación de las variables estáticas que se llaman solo por métodos estáticos aún se mantiene</font></font></p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateStaticField {
-  static #PRIVATE_STATIC_FIELD
-
-  static publicStaticMethod() {
-    ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD = 42
-    return ClassWithPrivateStaticField.#PRIVATE_STATIC_FIELD
-  }
-}
-
-console.assert(ClassWithPrivateStaticField.publicStaticMethod() === 42)</pre>
-
-<p><font><font>Los campos estáticos privados se agregan al constructor de la clase en el momento de la evaluación de la clase.</font></font></p>
-
-<p><font><font>Existe una restricción de procedencia en los campos estáticos privados. </font><font>Solo la clase que define el campo estático privado puede acceder al campo.</font></font></p>
-
-<p><font><font>Esto puede conducir a un comportamiento inesperado al usar </font></font><strong><code>this</code></strong><font><font>.</font></font></p>
-
-<pre class="brush: js notranslate">class BaseClassWithPrivateStaticField {
-  static #PRIVATE_STATIC_FIELD
-
-  static basePublicStaticMethod() {
-    this.#PRIVATE_STATIC_FIELD = 42
-    return this.#PRIVATE_STATIC_FIELD
-  }
-}
-
-class SubClass extends BaseClassWithPrivateStaticField { }
-
-let error = null
-
-try {
-  SubClass.basePublicStaticMethod()
-} catch(e) { error = e}
-
-console.assert(error instanceof TypeError)
-</pre>
-
-<h3 id="Campos_de_instancia_privados"><font><font>Campos de instancia privados</font></font></h3>
-
-<p><font><font>Los campos de instancia privados se declaran con </font></font><strong><font><font># nombres </font></font></strong><font><font> (pronunciados " </font></font><em><font><font>nombres hash</font></font></em><font><font> "), que son identificadores con el prefijo </font></font><code>#</code><font><font>. </font><font>El </font></font><code>#</code><font><font>es una parte del nombre propio. </font><font>También se utiliza para la declaración y el acceso.</font></font></p>
-
-<p><font><font>La encapsulación es impuesta por el lenguaje. </font><font>Es un error de sintaxis referirse a </font></font><code>#</code><font><font>nombres que están fuera del alcance.</font></font></p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateField {
-  #privateField
-
-  constructor() {
-    this.#privateField = 42
-    this.#randomField = 666 // Syntax error
-  }
-}
-
-const instance = new ClassWithPrivateField()
-instance.#privateField === 42 // Syntax error
-</pre>
-
-<h3 id="Métodos_privados"><font><font>Métodos privados</font></font></h3>
-
-<h4 id="Métodos_estáticos_privados"><font><font>Métodos estáticos privados</font></font></h4>
-
-<p><font><font>Al igual que su equivalente público, los métodos estáticos privados se invocan en la propia clase, no en instancias de la clase. </font><font>Al igual que los campos estáticos privados, solo se puede acceder a ellos desde dentro de la declaración de clase.</font></font></p>
-
-<p><font><font>Los métodos estáticos privados pueden ser funciones generadoras, asíncronas y asíncronas.</font></font></p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateStaticMethod {
-    static #privateStaticMethod() {
-        return 42
-    }
-
-    static publicStaticMethod1() {
-        return ClassWithPrivateStaticMethod.#privateStaticMethod();
-    }
-
-    static publicStaticMethod2() {
-        return this.#privateStaticMethod();
-    }
-}
-
-console.assert(ClassWithPrivateStaticMethod.publicStaticMethod1() === 42);
-console.assert(ClassWithPrivateStaticMethod.publicStaticMethod2() === 42);
-</pre>
-
-<p><font><font>Esto puede conducir a un comportamiento inesperado al usar </font></font><strong><code>this</code></strong><font><font>. </font><font>En el siguiente ejemplo se </font></font><code>this</code><font><font>hace referencia a la </font></font><code>Derived</code><font><font>clase (no a la </font></font><code>Base</code><font><font>clase) cuando intentamos llamar </font></font><code>Derived.publicStaticMethod2()</code><font><font>, y por lo tanto exhibe la misma "restricción de procedencia" que se mencionó anteriormente:</font></font></p>
-
-<pre class="brush: js notranslate">class Base {
-    static #privateStaticMethod() {
-        return 42;
-    }
-    static publicStaticMethod1() {
-        return Base.#privateStaticMethod();
-    }
-    static publicStaticMethod2() {
-        return this.#privateStaticMethod();
-    }
-}
-
-class Derived extends Base {}
-
-console.log(Derived.publicStaticMethod1()); // 42
-console.log(Derived.publicStaticMethod2()); // TypeError
-</pre>
-
-<h4 id="Métodos_de_instancia_privada"><font><font>Métodos de instancia privada</font></font></h4>
-
-<p><font><font>Los métodos de instancia privada son métodos disponibles en instancias de clase cuyo acceso está restringido de la misma manera que los campos de instancia privada.</font></font></p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateMethod {
-  #privateMethod() {
-    return 'hello world'
-  }
-
-  getPrivateMessage() {
-      return this.#privateMethod()
-  }
-}
-
-const instance = new ClassWithPrivateMethod()
-console.log(instance.getPrivateMessage())
-// expected output: "hello worl​d"</pre>
-
-<p><font><font>Los métodos de instancia privada pueden ser funciones generadoras, asíncronas o asíncronas. </font><font>Los getters y setters privados también son posibles:</font></font></p>
-
-<pre class="brush: js notranslate">class ClassWithPrivateAccessor {
-  #message
-
-  get #decoratedMessage() {
-    return `✨${this.#message}✨`
-  }
-  set #decoratedMessage(msg) {
-    this.#message = msg
-  }
-
-  constructor() {
-    this.#decoratedMessage = 'hello world'
-    console.log(this.#decoratedMessage)
-  }
-}
-
-new ClassWithPrivateAccessor();
-// expected output: "✨hello worl​d✨"
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Public and private instance fields', '#prod-FieldDefinition', 'FieldDefinition')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("javascript.classes.private_class_fields")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes/Public_class_fields">Public class fields</a></li>
- <li><a href="https://rfrn.org/~shu/2018/05/02/the-semantics-of-all-js-class-elements.html">The Semantics of All JS Class Elements</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/classes/static/index.html b/files/es/web/javascript/referencia/classes/static/index.html
deleted file mode 100644
index 92f972f171..0000000000
--- a/files/es/web/javascript/referencia/classes/static/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: static
-slug: Web/JavaScript/Referencia/Classes/static
-translation_of: Web/JavaScript/Reference/Classes/static
----
-<div>{{jsSidebar("Classes")}}</div>
-
-<p>La palabra clave <strong>static</strong> define un método estático para una clase.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">static methodName() { ... }</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los métodos estáticos son llamados sin instanciar su clase. Son habitualmente utilizados para crear funciones para una aplicación.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente ejemplo demuestra varias cosas. Una de ellas es cómo un método estático es implementado en una clase, otra es que una clase con un miembro estático puede ser sub-claseada. Finalmente demuestra cómo un método estático puede (y cómo no) ser llamado.</p>
-
-<pre class="brush: js">class Tripple {
-  static tripple(n) {
-    n = n || 1;
-    return n * 3;
-  }
-}
-
-class BiggerTripple extends Tripple {
-  static tripple(n) {
-    return super.tripple(n) * super.tripple(n);
-  }
-}
-
-console.log(Tripple.tripple());
-console.log(Tripple.tripple(6));
-console.log(BiggerTripple.tripple(3));
-var tp = new Tripple();
-console.log(tp.tripple()); //Logs 'tp.tripple is not a function'.</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-class-definitions', 'Class definitions')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>Available in the Nightly channel only (since February 2015)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>Available in the Nightly channel only (since February 2015)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"> </h2>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/class"><code>class</code> expression</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/class"><code>class</code> declaration</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Classes</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/funciones/arguments/callee/index.html b/files/es/web/javascript/referencia/funciones/arguments/callee/index.html
deleted file mode 100644
index 1902131055..0000000000
--- a/files/es/web/javascript/referencia/funciones/arguments/callee/index.html
+++ /dev/null
@@ -1,48 +0,0 @@
----
-title: callee
-slug: Web/JavaScript/Referencia/Funciones/arguments/callee
-tags:
-  - JavaScript
-  - JavaScript Reference
-  - Referencia
-translation_of: Web/JavaScript/Reference/Functions/arguments/callee
----
-<div>
-<div>{{jsSidebar("Functions")}}</div>
-</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Especifica la función que se está ejecutando actualmente.</p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>callee</code> es una propiedad de la variable local <code>arguments</code> disponible dentro de todos los objetos function; <code>callee</code> como una propiedad de {{jsxref("Funciones/arguments", "Function.arguments")}} ya no se utiliza. (<code>Function.arguments</code> en sí mismo está también desaconsejado.)</p>
-
-<p><code>arguments.callee</code> permite a funciones anónimas referirse a ellas mismas, lo cual es necesario en funciones anónimas recursivas.</p>
-
-<p>La palabra clave <code>this</code> no se refiere a la función que se ejecuta actualmente. Use la propiedad <code>callee</code> para referirse a la función dentro del cuerpo de la función.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_arguments.callee_en_funciones_an.C3.B3nimas_recursivas" name="Ejemplo:_Usando_arguments.callee_en_funciones_an.C3.B3nimas_recursivas">Ejemplo: Usando <code>arguments.callee</code> en funciones anónimas recursivas</h3>
-
-<p>Una función recursiva debe ser capaz de referirse a sí misma. Típicamente, una función se refiere a sí misma por su nombre. Sin embargo, una función anónima no tiene nombre y por tanto es una variable de referencia para ella, es decir, si la función no está asignada a ninguna variable, la función no puede referirse a sí misma. (Se pueden crear funciones anónimas mediante una expresión {{jsxref("Operadores/function", "function")}} o el constructor {{jsxref("Function")}}.) Aquí es donde entra <code>arguments.callee</code>.</p>
-
-<p>El siguiente ejemplo define una función, la cuál, en cada turno, define y devuelve una función factorial.</p>
-
-<pre class="brush: js">function makeFactorialFunc() {
-   alert('making a factorial function!');
-   return function(x) {
-      if (x &lt;= 1)
-         return 1;
-      return x * arguments.callee(x - 1);
-   };
-}
-
-var result = makeFactorialFunc()(5); // returns 120 (5 * 4 * 3 * 2 * 1)
-</pre>
-
-<p><span class="comment">this example isn't very practical, but then again, there are few practical cases where arguments.callee is necessary, and most of the those cases involve closures</span></p>
-
-<p> </p>
diff --git a/files/es/web/javascript/referencia/funciones/arguments/index.html b/files/es/web/javascript/referencia/funciones/arguments/index.html
deleted file mode 100644
index ab768cff21..0000000000
--- a/files/es/web/javascript/referencia/funciones/arguments/index.html
+++ /dev/null
@@ -1,229 +0,0 @@
----
-title: El objeto arguments
-slug: Web/JavaScript/Referencia/Funciones/arguments
-tags:
-  - Funciones
-  - JavaScript
-  - Namespace
-  - argumentos
-  - arguments
-  - espacio de nombres
-  - multiples
-translation_of: Web/JavaScript/Reference/Functions/arguments
----
-<div>{{jsSidebar("Functions", "Funciones")}}</div>
-
-<p><strong><code>arguments</code></strong> es un objeto similar a <code>Array</code> accesible dentro de <a href="/es/docs/Web/JavaScript/Guide/Functions">funciones</a> que contiene los valores de los argumentos pasados a esa función.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/functions-arguments.html")}}</div>
-
-<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Si estás escribiendo código compatible con ES6, entonces se deben preferir los {{jsxref("Functions/rest_parameters", "parámetros resto")}}.</p>
-</div>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: "similar a Array" significa que <code>arguments</code> tiene una propiedad {{jsxref("Functions/arguments/length", "lenght")}} y propiedades indexadas desde cero, pero no tiene métodos integrados de {{jsxref("Array")}} como {{jsxref("Array.forEach", "forEach()")}} o {{jsxref("Array.map", "map()")}}. Ve la <a href="#Descripción">§Descripción</a> para obtener más detalles.</p>
-</div>
-
-<p>El objeto <code>arguments</code> es una variable local disponible en todas las funciones que no son {{jsxref("Functions/Arrow_functions", "funciones flecha")}}. Puedes hacer referencia a los argumentos de una función dentro de esa función utilizando su objeto <code>arguments</code>. Tiene entradas para cada argumento con el que se llamó a la función, con el índice de la primera entrada en <code>0</code>.</p>
-
-<p>Por ejemplo, si a una función se le pasan 3 argumentos, puedes acceder a ellos de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">arguments[0] // primer argumento
-arguments[1] // segundo argumento
-arguments[2] // tercer argumento
-</pre>
-
-<p>También puedes establecer o reasignar cada argumento:</p>
-
-<pre class="brush: js notranslate">arguments[1] = 'new value';
-</pre>
-
-<p>El objeto <code>arguments</code> no es un {{jsxref("Array")}}. Es similar, pero carece de todas las propiedades de <code>Array</code> excepto de {{jsxref("Array.length", "length")}}. Por ejemplo, no tiene el método {{jsxref("Array.pop", "pop()")}}.</p>
-
-<p>Sin embargo, se puede convertir en un <code>Array</code> real:</p>
-
-<pre class="brush: js notranslate">var args = Array.prototype.slice.call(arguments);
-// El uso de un arreglo literal es más corto que el anterior pero asigna un arreglo vacío
-var args = [].slice.call(arguments);
-</pre>
-
-<p>Así como puedes hacer con cualquier objeto tipo <code>Array</code>, puedes usar el método {{jsxref("Array.from()")}} de ES2015 o la {{jsxref("Operators/Spread_syntax", "propagación de sintaxis")}} para convertir <code>arguments</code> en un arreglo real:</p>
-
-<pre class="brush: js notranslate">let args = Array.from(arguments);
-// o
-let args = [...arguments];
-</pre>
-
-<p>El objeto <code>arguments</code> es útil para funciones llamadas con más argumentos de los que declara aceptar formalmente. Esta técnica es útil para funciones a las que se les puede pasar un número variable de argumentos, como {{jsxref("Math.min()")}}. Esta función de ejemplo acepta cualquier número de argumentos de cadena y devuelve la más larga:</p>
-
-<pre class="brush: js notranslate">function longestString() {
-  var longest = '';
-  for (var i=0; i &lt; arguments.length; i++) {
-    if (arguments[i].length &gt; longest.length) {
-      longest = arguments[i];
-    }
-  }
-  return longest;
-}
-</pre>
-
-<p>Puedes usar {{jsxref("Functions/arguments/lenght", "arguments.length")}} para contar con cuántos argumentos se llamó a la función. Si, en cambio, deseas contar cuántos parámetros se declara que acepta una función, inspecciona la propiedad {{jsxref("Function.length", "length")}} de esa función.</p>
-
-<h3 id="Usar_typeof_con_arguments">Usar <code>typeof</code> con <code>arguments</code></h3>
-
-<p>El operador {{jsxref("Operators/typeof", "typeof")}} devuelve <code>'object'</code> cuando se usa con <code>arguments</code></p>
-
-<pre class="brush: js notranslate">console.log(typeof arguments); // 'object' </pre>
-
-<p>El tipo de argumentos individuales se puede determinar indexando <code>arguments</code>:</p>
-
-<pre class="notranslate">console.log(typeof arguments[0]); // devuelve el tipo del primer argumento</pre>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("Functions/arguments/callee", "arguments.callee")}}</dt>
- <dd>Referencia a la función en ejecución a la que pertenecen los argumentos. Prohibida en modo estricto.</dd>
- <dt>{{jsxref("Functions/arguments/length", "arguments.length")}}</dt>
- <dd>El número de argumentos que se pasaron a la función.</dd>
- <dt>{{jsxref("Functions/arguments/@@iterator", "arguments[@@iterator]")}}</dt>
- <dd>Devuelve un nuevo objeto {{jsxref("Array/@@iterator", "Array iterator", "", 0)}} que contiene los valores de cada índice en <code>arguments</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Definición_de_una_función_que_concatena_varias_cadenas">Definición de una función que concatena varias cadenas</h3>
-
-<p>Este ejemplo define una función que concatena varias cadenas. El único argumento formal de la función es una cadena que contiene los caracteres que separan los elementos a concatenar.</p>
-
-<pre class="brush:js notranslate">function myConcat(separator) {
-  let args = Array.prototype.slice.call(arguments, 1);
-  return args.join(separator);
-}</pre>
-
-<p>Puedes pasar tantos argumentos como desees a esta función. Devuelve una lista de cadenas usando cada argumento en la lista:</p>
-
-<pre class="brush:js notranslate">// returns "red, orange, blue"
-myConcat(', ', 'red', 'orange', 'blue');
-
-// devuelve "elephant; giraffe; lion; cheetah"
-myConcat('; ', 'elephant', 'giraffe', 'lion', 'cheetah');
-
-// devuelve "sage. basil. oregano. pepper. parsley"
-myConcat('. ', 'sage', 'basil', 'oregano', 'pepper', 'parsley');</pre>
-
-<h3 id="Definición_de_una_función_que_crea_listas_HTML">Definición de una función que crea listas HTML</h3>
-
-<p>Este ejemplo define una función que crea una cadena que contiene HTML para una lista. El único argumento formal para la función es una cadena que es "<code>u</code>" si la lista debe estar {{htmlelement("ul", "desordenada (con viñetas)")}}, u "<code>o</code>" si la lista es {{htmlelement("ol", "ordenada (numerada)")}}. La función se define de la siguiente manera:</p>
-
-<pre class="brush:js notranslate">function list(type) {
-  var html = '&lt;' + type + 'l&gt;&lt;li&gt;';
-  var args = Array.prototype.slice.call(arguments, 1);
-  html += args.join('&lt;/li&gt;&lt;li&gt;');
-  html += '&lt;/li&gt;&lt;/' + type + 'l&gt;'; // fin de la lista
-  return html;
-}</pre>
-
-<p>Puedes pasar cualquier número de argumentos a esta función y agregar cada argumento como un elemento de lista a una lista del tipo indicado. Por ejemplo:</p>
-
-<pre class="brush:js notranslate">let listHTML = list('u', 'One', 'Two', 'Three');
-
-/* la listHTML es:
-"&lt;ul&gt;&lt;li&gt;One&lt;/li&gt;&lt;li&gt;Two&lt;/li&gt;&lt;li&gt;Three&lt;/li&gt;&lt;/ul&gt;"
-*/</pre>
-
-<h3 id="Parámetros_rest_predeterminados_y_desestructurados">Parámetros <code>rest</code>, predeterminados y desestructurados</h3>
-
-<div>
-<p>El objeto <code>arguments</code> se puede utilizar junto con parámetros {{jsxref("Functions/rest_parameters", "rest")}}, {{jsxref("Functions/Default_parameters", "predeterminados")}} y {{jsxref("Operators/Destructuring_assignment", "desestructurados")}}.</p>
-</div>
-
-<pre class="brush: js notranslate">function foo(...args) {
-  return args;
-}
-foo(1, 2, 3); // [1, 2, 3]
-</pre>
-
-<p>Si bien la presencia de parámetros <code>rest</code>, predeterminados o desestructurados no altera <a href="/es/docs/Web/JavaScript/Reference/Strict_mode#Haciendo_eval_y_arguments_más_simples">el comportamiento del objeto <code>arguments</code> en el código de modo estricto</a>, existen sutiles diferencias para el código no estricto.</p>
-
-<p>En el código de modo estricto, el objeto <code>arguments</code> se comporta de la misma manera independientemente de que se pasen parámetros <code>rest</code>, predeterminados o desestructurados a una función. Es decir, asignar nuevos valores a las variables en el cuerpo de la función no afectará al objeto <code>arguments</code>. La asignación de nuevas variables al objeto <code>arguments</code> tampoco afectará el valor de las variables.</p>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: No puedes escribir una directiva <code>"use strict";</code> en el cuerpo de una definición de función que acepte parámetros <code>rest</code>, predeterminados o desestructurados. Si lo haces, generará un {{jsxref("Errors/Strict_Non_Simple_Params", "error de sintaxis")}}.</p>
-</div>
-
-<p>Las funciones no estrictas a las que se les pasan solo parámetros simples (es decir, no parámetros <code>rest</code>, predeterminados o desestructurados) sincronizarán el valor de los nuevos valores de las variables en el cuerpo de la función con el objeto <code>arguments</code>, y viceversa:</p>
-
-<pre class="brush: js notranslate">function func(a) {
-  arguments[0] = 99; // actualiza arguments[0] además actualiza a
-  console.log(a);
-}
-func(10); // 99
-</pre>
-
-<p>Y también:</p>
-
-<pre class="brush: js notranslate">function func(a) {
-  a = 99; // la actualización también actualiza arguments[0]
-  console.log(arguments[0]);
-}
-func(10); // 99
-</pre>
-
-<p>Por el contrario, las funciones no estrictas a las que <strong>se les pasan</strong> parámetros <code>rest</code>, predeterminados o desestructurados <strong>no</strong> sincronizarán los nuevos valores asignados a las variables de los argumentos en el cuerpo de la función con el objeto <code>arguments</code>. En cambio, el objeto <code>arguments</code> en funciones no estrictas con parámetros complejos <strong>siempre</strong> reflejarán los valores pasados a la función cuando se invocó (este es el mismo comportamiento exhibido por todas las funciones en modo estricto, independientemente del tipo de variables que se le pasen):</p>
-
-<pre class="brush: js notranslate">function func(a = 55) {
-  arguments[0] = 99; // actualizar arguments[0] tampoco actualiza a
-  console.log(a);
-}
-func(10); // 10</pre>
-
-<p>Y también:</p>
-
-<pre class="brush: js notranslate">function func(a = 55) {
-  a = 99; // actualizar a tampoco actualiza arguments[0]
-  console.log(arguments[0]);
-}
-func(10); // 10
-</pre>
-
-<p>Y también:</p>
-
-<pre class="brush: js notranslate">// Un parámetro predeterminado sin seguimiento
-function func(a = 55) {
-  console.log(arguments[0]);
-}
-func(); // undefined</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Objectos arguments exóticos')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.functions.arguments")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Function", "Función")}}</li>
- <li>{{jsxref("Functions/rest_parameters", "Parámetros resto")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/funciones/arguments/length/index.html b/files/es/web/javascript/referencia/funciones/arguments/length/index.html
deleted file mode 100644
index b1d7698194..0000000000
--- a/files/es/web/javascript/referencia/funciones/arguments/length/index.html
+++ /dev/null
@@ -1,131 +0,0 @@
----
-title: arguments.length
-slug: Web/JavaScript/Referencia/Funciones/arguments/length
-tags:
-  - Funciones
-  - JavaScript
-  - Propiedades
-  - argumentos
-translation_of: Web/JavaScript/Reference/Functions/arguments/length
----
-<div>{{jsSidebar("Functions")}}</div>
-
-<p>La propiedad <strong><code>arguments.length</code></strong> contiene el número de argumentos pasados a una función.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">arguments.length</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad arguments.length devuelve el número total de argumentos pasados a una función. Esto puede ser más o menos que el número de parametros definidos. (Véase {{jsxref("Function.length")}}).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_arguments.length">Usando <code>arguments.length</code></h3>
-
-<p>En este ejemplo definimos una función que puede sumar dos o más números.</p>
-
-<pre class="brush: js">function adder(base /*, n2, ... */) {
-  base = Number(base);
-  for (var i = 1; i &lt; arguments.length; i++) {
-    base += Number(arguments[i]);
-  }
-  return base;
-}
-</pre>
-
-<div class="note">
-<p>Tenga en cuenta la diferencia entre {{jsxref("Function.length")}} y arguments.length</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-10.6', 'Arguments Object')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_navegadores">Compatibilidad con los navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Function")}}</li>
- <li>{{jsxref("Function.length")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/funciones/arrow_functions/index.html b/files/es/web/javascript/referencia/funciones/arrow_functions/index.html
deleted file mode 100644
index 6ea9a35595..0000000000
--- a/files/es/web/javascript/referencia/funciones/arrow_functions/index.html
+++ /dev/null
@@ -1,530 +0,0 @@
----
-title: Funciones Flecha
-slug: Web/JavaScript/Referencia/Funciones/Arrow_functions
-tags:
-  - ECMAScript6
-  - Intermedio
-  - JavaScript
-  - Referencia
-  - función
-translation_of: Web/JavaScript/Reference/Functions/Arrow_functions
----
-<div>{{jsSidebar("Functions", "Funciones")}}</div>
-
-<p>Una <strong>expresión de función flecha</strong> es una alternativa compacta a una {{JSxRef("Operadores/function", "expresión de función")}} tradicional, pero es limitada y no se puede utilizar en todas las situaciones.</p>
-
-<p><strong>Diferencias y limitaciones:</strong></p>
-
-<ul>
- <li>No tiene sus propios enlaces a {{JSxRef("Operadores/this", "this")}} o {{JSxRef("Operadores/super", "super")}} y no se debe usar como {{Glossary("Method", "métodos")}}.</li>
- <li>No tiene {{JSxRef("Funciones/arguments", "argumentos")}} o palabras clave {{JSxRef("../Operadores/new.target", "new.target")}}.</li>
- <li>No apta para los métodos {{JSxRef("Objetos_globales/Function/call", "call")}}, {{JSxRef("Objetos_globales/Function/apply", "apply")}} y {{JSxRef("Objetos_globales/Function/bind", "bind")}}, que generalmente se basan en establecer un {{Glossary("Scope", "ámbito o alcance")}}</li>
- <li>No se puede utilizar como {{Glossary("constructor", "constructor")}}.</li>
- <li>No se puede utilizar {{JSxRef("Operadores/yield", "yield")}} dentro de su cuerpo.</li>
-</ul>
-
-<p>{{EmbedInteractiveExample("pages/js/functions-arrow.html")}}</p>
-
-<h3 id="Comparación_de_funciones_tradicionales_con_funciones_flecha">Comparación de funciones tradicionales con funciones flecha</h3>
-
-<p>Observa, paso a paso, la descomposición de una "función tradicional" hasta la "función flecha" más simple:<br>
- <strong>Nota</strong>: Cada paso a lo largo del camino es una "función flecha" válida</p>
-
-<pre class="brush: js notranslate">// Función tradicional
-function (a){
-  return a + 100;
-}
-
-// Desglose de la función flecha
-
-// 1. Elimina la palabra "function" y coloca la flecha entre el argumento y el corchete de apertura.
-(a) =&gt; {
-  return a + 100;
-}
-
-// 2. Quita los corchetes del cuerpo y la palabra "return" — el return está implícito.
-(a) =&gt; a + 100;
-
-// 3. Suprime los paréntesis de los argumentos
-a =&gt; a + 100;</pre>
-
-<div class="blockIndicator note">
-<p>Como se muestra arriba, los { corchetes }, ( paréntesis ) y "return" son opcionales, pero pueden ser obligatorios.</p>
-</div>
-
-<p>Por ejemplo, si tienes <strong>varios argumentos</strong> o <strong>ningún argumento</strong>, deberás volver a introducir paréntesis alrededor de los argumentos:</p>
-
-<pre class="brush: js notranslate">// Función tradicional
-function (a, b){
-  return a + b + 100;
-}
-
-// Función flecha
-(a, b) =&gt; a + b + 100;
-
-// Función tradicional (sin argumentos)
-let a = 4;
-let b = 2;
-function (){
-  return a + b + 100;
-}
-
-// Función flecha (sin argumentos)
-let a = 4;
-let b = 2;
-() =&gt; a + b + 100;</pre>
-
-<p>Del mismo modo, si el cuerpo requiere <strong>líneas de procesamiento adicionales</strong>, deberás volver a introducir los corchetes <strong>Más el "return"</strong> (las funciones flecha no adivinan mágicamente qué o cuándo quieres "volver"):</p>
-
-<pre class="brush: js notranslate">// Función tradicional
-function (a, b){
-  let chuck = 42;
-  return a + b + chuck;
-}
-
-// Función flecha
-(a, b) =&gt; {
-  let chuck = 42;
-  return a + b + chuck;
-}</pre>
-
-<div>Y finalmente, en las <strong>funciones con nombre</strong> tratamos las expresiones de flecha como variables</div>
-
-<div>
-<pre class="brush: js notranslate">// Función tradicional
-function bob (a){
-  return a + 100;
-}
-
-// Función flecha
-let bob = a =&gt; a + 100;</pre>
-</div>
-
-<div></div>
-
-<div></div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<h3 id="Sintaxis_básica">Sintaxis básica</h3>
-
-<p class="syntaxbox notranslate">Un parámetro. Con una expresión simple no se necesita <code>return</code>:</p>
-
-<pre class="brush: js notranslate">param =&gt; expression</pre>
-
-<p class="syntaxbox notranslate">Varios parámetros requieren paréntesis. Con una expresión simple no se necesita <code>return</code>:</p>
-
-<pre class="brush: js notranslate">(param1, paramN) =&gt; expression</pre>
-
-<p class="syntaxbox notranslate">Las declaraciones de varias líneas requieren corchetes y <code>return</code>:</p>
-
-<pre class="brush: js notranslate">param =&gt; {
-  let a = 1;
-  return a + b;
-}</pre>
-
-<p class="syntaxbox notranslate">Varios parámetros requieren paréntesis. Las declaraciones de varias líneas requieren corchetes y <code>return</code>:</p>
-
-<pre class="brush: js notranslate">(param1, paramN) =&gt; {
-   let a = 1;
-   return a + b;
-}</pre>
-
-<h3 id="Sintaxis_avanzada">Sintaxis avanzada</h3>
-
-<p class="syntaxbox notranslate">Para devolver una expresión de objeto literal, se requieren paréntesis alrededor de la expresión:</p>
-
-<pre class="brush: js notranslate">params =&gt; ({foo: "a"}) // devuelve el objeto {foo: "a"}</pre>
-
-<p class="syntaxbox notranslate">Los {{JSxRef("Funciones/parametros_rest", "parámetros rest")}} son compatibles:</p>
-
-<pre class="brush: js notranslate">(a, b, ...r) =&gt; expression</pre>
-
-<p class="syntaxbox notranslate">Se admiten los {{JSxRef("Funciones/Parametros_por_defecto", "parámetros predeterminados")}}:</p>
-
-<pre class="brush: js notranslate">(a=400, b=20, c) =&gt; expression</pre>
-
-<p class="brush: js">{{JSxRef("Operadores/Destructuring_assignment", "Desestructuración")}} dentro de los parámetros admitidos:</p>
-
-<pre class="brush: js notranslate">([a, b] = [10, 20]) =&gt; a + b;  // el resultado es 30
-({ a, b } = { a: 10, b: 20 }) =&gt; a + b; // resultado es 30
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Consulta también <a href="https://hacks.mozilla.org/2015/06/es6-in-depth-arrow-functions/">"ES6 en profundidad: funciones flecha" en hacks.mozilla.org</a>.</p>
-
-<h3 id="this_y_funciones_flecha">"<code>this</code>" y funciones flecha</h3>
-
-<p class="brush: js notranslate">Una de las razones por las que se introdujeron las funciones flecha fue para eliminar complejidades del ámbito ({{JSxRef("Operadores/this", "this")}}) y hacer que la ejecución de funciones sea mucho más intuitiva.</p>
-
-<div class="blockIndicator note">
-<p class="brush: js notranslate">Si <code>this</code> es un misterio para ti, consulta {{JSxRef("Operadores/this", "este documento")}} para obtener más información sobre cómo funciona <code>this</code>. Para resumir, <code>this</code> se refiere a la instancia. Las instancias se crean cuando se invoca la palabra clave <code>new</code>. De lo contrario, <code>this</code> se establecerá —de forma predeterminada— en el {{Glossary("Scope", "ámbito o alcance")}} de window.</p>
-</div>
-
-<p class="brush: js notranslate">En las <strong>funciones tradicionales</strong> de manera predeterminada <code>this</code> está en el ámbito de <code>window</code>:</p>
-
-<ul>
-</ul>
-
-<pre class="brush: js notranslate">window.age = 10; // &lt;-- ¿me notas?
-function Person() {
-  this.age = 42; // &lt;-- ¿me notas?
-  setTimeout(function () {// &lt;-- La función tradicional se está ejecutando en el ámbito de window
-    console.log("this.age", this.age); // genera "10" porque la función se ejecuta en el ámbito de window
-  }, 100);
-}
-
-var p = new Person();
-
-</pre>
-
-<p>Las <strong>funciones flecha</strong> <strong>no</strong> predeterminan <code>this</code> al {{Glossary("Scope", "ámbito o alcance")}} de <code>window</code>, más bien se ejecutan en el {{Glossary("Scope", "ámbito o alcance")}} en que se crean:</p>
-
-<pre class="brush: js notranslate">window.age = 10; // &lt;-- ¿me notas?
-function Person() {
-  this.age = 42; // &lt;-- ¿me notas?
-  setTimeout(() =&gt; {// &lt;-- Función flecha ejecutándose en el ámbito de "p" (una instancia de Person)
-    console.log("this.age", this.age); // genera "42" porque la función se ejecuta en el ámbito de Person
-  }, 100);
-}
-
-var p = new Person();
-
-</pre>
-
-<p>En el ejemplo anterior, la función flecha no tiene su propio <code>this</code>. Se utiliza el valor <code>this</code> del {{Glossary("Scope", "ámbito")}} léxico adjunto; las funciones flecha siguen las reglas normales de búsqueda de variables. Entonces, mientras busca <code>this</code> que no está presente en el {{Glossary("Scope", "ámbito")}} actual, una función flecha termina encontrando el <code>this</code> de su {{Glossary("Scope", "ámbito")}} adjunto.</p>
-
-<p><strong>Relación con el modo estricto</strong></p>
-
-<p>Dado que <code>this</code> proviene del contexto léxico circundante, en el {{JSxRef("Modo_estricto", "modo estricto")}} se ignoran las reglas con respecto a <code>this</code>.</p>
-
-<pre class="brush: js notranslate">var f = () =&gt; {
-    'use strict';
-    return this;
-};
-
-f() === window; // o el objeto global</pre>
-
-<p>Todas las demás reglas del {{JSxRef("Modo_estricto", "modo estricto")}} se aplican normalmente.</p>
-
-<div class="blockIndicator warning">
-<p><strong>Nota</strong>: Comprueba las notas sobre el {{JSxRef("Modo_estricto", "modo estricto")}}.</p>
-</div>
-
-<h3 id="Funciones_flecha_utilizadas_como_métodos">Funciones flecha utilizadas como métodos</h3>
-
-<p>Como se indicó anteriormente, las expresiones de función flecha son más adecuadas para funciones que no son métodos. Observa qué sucede cuando intentas usarlas como métodos:</p>
-
-<pre class="brush: js notranslate">'use strict';
-
-var obj = { // no crea un nuevo ámbito
-  i: 10,
-  b: () =&gt; console.log(this.i, this),
-  c: function() {
-    console.log(this.i, this);
-  }
-}
-
-obj.b(); // imprime indefinido, Window {...} (o el objeto global)
-obj.c(); // imprime 10, Object {...}</pre>
-
-<p>Las funciones flecha no tienen su propio <code>this</code>. Otro ejemplo que involucra {{JSxRef("Object.defineProperty()")}}:</p>
-
-<pre class="brush: js notranslate">'use strict';
-
-var obj = {
-  a: 10
-};
-
-Object.defineProperty(obj, 'b', {
-  get: () =&gt; {
-    console.log(this.a, typeof this.a, this); // indefinida 'undefined' Window {...} (o el objeto global)
-    return this.a + 10; // representa el objeto global 'Window', por lo tanto 'this.a' devuelve 'undefined'
-  }
-});
-</pre>
-
-<h3 id="call_apply_y_bind"><code>call</code>, <code>apply</code> y <code>bind</code></h3>
-
-<p>Los métodos {{JSxRef("Objetos_globales/Function/call", "call")}}, {{JSxRef("Objetos_globales/Function/apply", "apply")}} y {{JSxRef("Objetos_globales/Function/bind", "bind")}} <strong>NO son adecuados</strong> para las funciones flecha, ya que fueron diseñados para permitir que los métodos se ejecuten dentro de diferentes ámbitos, porque <strong>las funciones flecha establecen "<code>this</code>" según el ámbito dentro del cual se define la función flecha.</strong></p>
-
-<p>Por ejemplo, {{JSxRef("Objetos_globales/Function/call", "call")}}, {{JSxRef("Objetos_globales/Function/apply", "apply")}} y {{JSxRef("Objetos_globales/Function/bind", "bind")}} funcionan como se esperaba con las funciones tradicionales, porque establecen el ámbito para cada uno de los métodos:</p>
-
-<pre class="brush: js notranslate">// ----------------------
-// Ejemplo tradicional
-// ----------------------
-// Un objeto simplista con su propio "this".
-var obj = {
-    num: 100
-}
-
-// Establece "num" en window para mostrar cómo NO se usa.
-window.num = 2020; // ¡Ay!
-
-// Una función tradicional simple para operar en "this"
-var add = function (a, b, c) {
-  return this.num + a + b + c;
-}
-
-// call
-var result = add.call(obj, 1, 2, 3) // establece el ámbito como "obj"
-console.log(result) // resultado 106
-
-// apply
-const arr = [1, 2, 3]
-var result = add.apply(obj, arr) // establece el ámbito como "obj"
-console.log(result) // resultado 106
-
-// bind
-var result = add.bind(obj) // estable el ámbito como "obj"
-console.log(result(1, 2, 3)) // resultado 106</pre>
-
-<p>Con las funciones flecha, dado que la función <code>add</code> esencialmente se crea en el ámbito del <code>window</code> (global), asumirá que <code>this</code> es window.</p>
-
-<pre class="brush: js notranslate">// ----------------------
-// Ejemplo de flecha
-// ----------------------
-
-// Un objeto simplista con su propio "this".
-var obj = {
-    num: 100
-}
-
-// Establecer "num" en window para mostrar cómo se recoge.
-window.num = 2020; // ¡Ay!
-
-// Función flecha
-var add = (a, b, c) =&gt; this.num + a + b + c;
-
-// call
-console.log(add.call(obj, 1, 2, 3)) // resultado 2026
-
-// apply
-const arr = [1, 2, 3]
-console.log(add.apply(obj, arr)) // resultado 2026
-
-// bind
-const bound = add.bind(obj)
-console.log(bound(1, 2, 3)) // resultado 2026
-</pre>
-
-<p>Quizás el mayor beneficio de usar las funciones flecha es con los métodos a nivel del DOM (<code>setTimeout</code>, <code>setInterval</code>, <code>addEventListener</code>) que generalmente requieren algún tipo de cierre, llamada, aplicación o vinculación para garantizar que la función se ejecute en el ámbito adecuado.</p>
-
-<p><strong>Ejemplo tradicional:</strong></p>
-
-<pre class="brush: js notranslate">var obj = {
-    count : 10,
-    doSomethingLater : function (){
-        setTimeout(function(){ // la función se ejecuta en el ámbito de window
-            this.count++;
-            console.log(this.count);
-        }, 300);
-    }
-}
-
-obj.doSomethingLater(); // la consola imprime "NaN", porque la propiedad "count" no está en el ámbito de window.</pre>
-
-<p><strong>Ejemplo de flecha:</strong></p>
-
-<pre class="brush: js notranslate">var obj = {
-    count : 10,
-    doSomethingLater : function(){  // por supuesto, las funciones flecha no son adecuadas para métodos
-        setTimeout( () =&gt; { // dado que la función flecha se creó dentro del "obj", asume el "this" del objeto
-            this.count++;
-            console.log(this.count);
-        }, 300);
-    }
-}
-
-obj.doSomethingLater();</pre>
-
-<h3 id="Sin_enlace_de_arguments">Sin enlace de <code>arguments</code></h3>
-
-<p>Las funciones flecha no tienen su propio objeto {{JSxRef("Funciones/arguments", "arguments")}}. Por tanto, en este ejemplo, <code>arguments</code> simplemente es una referencia a los argumentos del ámbito adjunto:</p>
-
-<pre class="brush: js notranslate">var arguments = [1, 2, 3];
-var arr = () =&gt; arguments[0];
-
-arr(); // 1
-
-function foo(n) {
-  var f = () =&gt; arguments[0] + n; // Los argumentos implícitos de foo son vinculantes. arguments[0] es n
-  return f();
-}
-
-foo(3); // 6</pre>
-
-<p>En la mayoría de los casos, usar {{JSxRef("Funciones/parametros_rest", "parámetros rest")}} es una buena alternativa a usar un objeto <code>arguments</code>.</p>
-
-<pre class="brush: js notranslate">function foo(n) {
-  var f = (...args) =&gt; args[0] + n;
-  return f(10);
-}
-
-foo(1); // 11</pre>
-
-<h3 id="Uso_del_operador_new">Uso del operador <code>new</code></h3>
-
-<p>Las funciones flecha no se pueden usar como constructores y arrojarán un error cuando se usen con <code>new</code>.</p>
-
-<pre class="brush: js notranslate">var Foo = () =&gt; {};
-var foo = new Foo(); // TypeError: Foo no es un constructor</pre>
-
-<h3 id="Uso_de_la_propiedad_prototype">Uso de la propiedad <code>prototype</code></h3>
-
-<p>Las funciones flecha no tienen una propiedad <code>prototype</code>.</p>
-
-<pre class="brush: js notranslate">var Foo = () =&gt; {};
-console.log(Foo.prototype); // undefined
-</pre>
-
-<h3 id="Uso_de_la_palabra_clave_yield">Uso de la palabra clave <code>yield</code></h3>
-
-<p>La palabra clave {{JSxRef("Operadores/yield", "yield")}} no se puede utilizar en el cuerpo de una función flecha (excepto cuando está permitido dentro de las funciones anidadas dentro de ella). Como consecuencia, las funciones flecha no se pueden utilizar como generadores.</p>
-
-<h3 id="Cuerpo_de_función">Cuerpo de función</h3>
-
-<p>Las funciones flecha pueden tener un "cuerpo conciso" o el "cuerpo de bloque" habitual.</p>
-
-<p>En un cuerpo conciso, solo se especifica una expresión, que se convierte en el valor de retorno implícito. En el cuerpo de un bloque, debes utilizar una instrucción <code>return</code> explícita.</p>
-
-<pre class="brush: js notranslate">var func = x =&gt; x * x;
-// sintaxis de cuerpo conciso, "return" implícito
-
-var func = (x, y) =&gt; { return x + y; };
-// con cuerpo de bloque, se necesita un "return" explícito
-</pre>
-
-<h3 id="Devolver_objetos_literales">Devolver objetos literales</h3>
-
-<p>Ten en cuenta que devolver objetos literales utilizando la sintaxis de cuerpo conciso <code>params =&gt; {object: literal}</code> no funcionará como se esperaba.</p>
-
-<pre class="brush: js notranslate">var func = () =&gt; { foo: 1 };
-// ¡Llamar a func() devuelve undefined!
-
-var func = () =&gt; { foo: function() {} };
-// SyntaxError: la declaración function requiere un nombre</pre>
-
-<p>Esto se debe a que el código entre llaves ({}) se procesa como una secuencia de declaraciones (es decir, <code>foo</code> se trata como una etiqueta, no como una clave en un objeto literal).</p>
-
-<p>Debes envolver el objeto literal entre paréntesis:</p>
-
-<pre class="brush: js notranslate">var func = () =&gt; ({ foo: 1 });</pre>
-
-<h3 id="Saltos_de_línea">Saltos de línea</h3>
-
-<p>Una función flecha no puede contener un salto de línea entre sus parámetros y su flecha.</p>
-
-<pre class="brush: js notranslate">var func = (a, b, c)
-  =&gt; 1;
-// SyntaxError: expresión esperada, obtuve '=&gt;'</pre>
-
-<p>Sin embargo, esto se puede modificar colocando el salto de línea después de la flecha o usando paréntesis/llaves como se ve a continuación para garantizar que el código se mantenga bonito y esponjoso. También puedes poner saltos de línea entre argumentos.</p>
-
-<pre class="brush: js notranslate">var func = (a, b, c) =&gt;
-  1;
-
-var func = (a, b, c) =&gt; (
-  1
-);
-
-var func = (a, b, c) =&gt; {
-  return 1
-};
-
-var func = (
-  a,
-  b,
-  c
-) =&gt; 1;
-
-// no se lanza SyntaxError</pre>
-
-<h3 id="Orden_de_procesamiento">Orden de procesamiento</h3>
-
-<p>Aunque la flecha en una función flecha no es un operador, las funciones flecha tienen reglas de procesamiento especiales que interactúan de manera diferente con {{JSxRef("Operadores/Operator_Precedence", "prioridad de operadores")}} en comparación con las funciones regulares.</p>
-
-<pre class="brush: js notranslate">let callback;
-
-callback = callback || function() {}; // ok
-
-callback = callback || () =&gt; {};
-// SyntaxError: argumentos de función flecha no válidos
-
-callback = callback || (() =&gt; {});    // bien
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_básico">Uso básico</h3>
-
-<pre class="brush: js notranslate">// Una función flecha vacía devuelve undefinided
-let empty = () =&gt; {};
-
-(() =&gt; 'foobar')();
-// Devuelve "foobar"
-// (esta es una expresión de función invocada inmediatamente)
-
-var simple = a =&gt; a &gt; 15 ? 15 : a;
-simple(16); // 15
-simple(10); // 10
-
-let max = (a, b) =&gt; a &gt; b ? a : b;
-
-// Fácil filtrado de arreglos, mapeo, ...
-
-var arr = [5, 6, 13, 0, 1, 18, 23];
-
-var sum = arr.reduce((a, b) =&gt; a + b);
-// 66
-
-var even = arr.filter(v =&gt; v % 2 == 0);
-// [6, 0, 18]
-
-var double = arr.map(v =&gt; v * 2);
-// [10, 12, 26, 0, 2, 36, 46]
-
-// Cadenas de promesas más concisas
-promise.then(a =&gt; {
-  // ...
-}).then(b =&gt; {
-  // ...
-});
-
-// Funciones flecha sin parámetros que son visualmente más fáciles de procesar
-setTimeout( () =&gt; {
-  console.log('sucederá antes');
-  setTimeout( () =&gt; {
-    // código más profundo
-    console.log ('Sucederá más tarde');
-  }, 1);
-}, 1);
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-arrow-function-definitions', 'Definición de función flecha')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.functions.arrow_functions")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="https://hacks.mozilla.org/2015/06/es6-in-depth-arrow-functions/">"ES6 en profundidad: funciones flecha" en hacks.mozilla.org</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/funciones/get/index.html b/files/es/web/javascript/referencia/funciones/get/index.html
deleted file mode 100644
index 7125ab0caa..0000000000
--- a/files/es/web/javascript/referencia/funciones/get/index.html
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: get
-slug: Web/JavaScript/Referencia/Funciones/get
-tags:
-  - ECMAScript5
-  - JavaScript
-  - Operator
-translation_of: Web/JavaScript/Reference/Functions/get
----
-<div>{{jsSidebar("Funciones")}}</div>
-
-<p>Enlaza la propiedad de un objeto con una función que será llamada cuando la propiedad es buscada.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p><code>{get <em>prop</em>() { . . . } }</code></p>
-
-<h2 id="Parámetros">Parámetros</h2>
-
-<dl>
- <dt><code>prop</code></dt>
- <dd>el nombre de la propiedad a unir con la función dada</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>A veces es deseable permitir acceso a una propiedad que retorna un valor dinámicamente calculado, o si desea mostrar el estado de alguna variable interna sin requerir el uso de llamadas a métodos explícitos. En JavaScript, esto se puede lograr con el uso de un getter (captador). No es posible tener simultáneamente un getter ligado a una propiedad y que dicha propiedad tenga actualmente un valor, aunque es posible usar un getter junto con un setter para crear un tipo de pseudo-propiedad.</p>
-
-<p>Tenga en cuenta lo siguiente al trabajar con la sintaxis <code>get</code>:</p>
-
-<ul>
- <li>Puede tener un identificador que sea un número o una cadena.</li>
- <li>Debe tener exactamente cero parametros (ver <a href="http://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/">Cambio ES5 incompatible: las funciones getter y setter literal deben tener ahora exactamente cero o un argumento </a>para mas información);</li>
- <li>No debe haber múltiples getters para una misma propiedad (<code>{ get x() { }, get x() { } }</code> y <code>{ x: ..., get x() { } }</code> están prohibidos).</li>
-</ul>
-
-<p>El getter puede ser removido usando el operador {{jsxref("Operadores/delete", "delete")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Example:_Defining_a_getter_with_the_get_operator" name="Example:_Defining_a_getter_with_the_get_operator">Definir un getter con el operador <code>get</code></h3>
-
-<p>Esto creará una pseudo-propiedad <code>latest</code> (ver ejemplo) del objecto <code>o</code> que podría retornar la más reciente entrada dentro de <code>o.log</code>:</p>
-
-<pre class="brush: js">var o = {
-  get latest () {
-    if (this.log.length &gt; 0) {
-      return this.log[this.log.length - 1];
-    }
-    else {
-      return null;
-    }
-  },
-  log: []
-}
-</pre>
-
-<p>Note que intentar asignar un valor a <code>latest</code> no lo cambiará.</p>
-
-<h3 id="Example:_Deleting_a_getter_using_the_delete_operator" name="Example:_Deleting_a_getter_using_the_delete_operator">Borrar un getter usando el operador <code>delete</code></h3>
-
-<pre class="brush: js">delete o.latest;
-</pre>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>Basado en la página de <a class="external" href="http://robertnyman.com/javascript/javascript-getters-setters.html#regular-getters-and-setters">página de Robert Nyman</a></p>
-
-<p>Sin soporte (notablemente en IE6-8) significa que el script lanzará un error de sintaxis.</p>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
-   <td>1</td>
-   <td>9</td>
-   <td>9.5</td>
-   <td>3</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Android</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-   <td>{{ CompatUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Consulta también</h2>
-
-<ul>
- <li>{{jsxref("Operators/delete", "delete")}}</li>
- <li>{{jsxref("Operators/set", "set")}}</li>
- <li>{{jsxref("Object.defineProperty()")}}</li>
- <li>{{jsxref("Object.defineGetter", "__defineGetter__")}}</li>
- <li>{{jsxref("Object.defineSetter", "__defineSetter__")}}</li>
- <li><a href="/es/JavaScript/Guide/Working_with_Objects#Defining_Getters_and_Setters" title="en/JavaScript/Guide/Working with Objects#Defining Getters and Setters">Defining Getters and Setters</a> in JavaScript Guide</li>
-</ul>
-
-<div class="noinclude">
-<p> </p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/javascript/referencia/funciones/index.html b/files/es/web/javascript/referencia/funciones/index.html
deleted file mode 100644
index ac1bea24ea..0000000000
--- a/files/es/web/javascript/referencia/funciones/index.html
+++ /dev/null
@@ -1,661 +0,0 @@
----
-title: Funciones
-slug: Web/JavaScript/Referencia/Funciones
-tags:
-  - Funciones
-  - Guia(2)
-  - JavaScript
-  - función
-translation_of: Web/JavaScript/Reference/Functions
----
-<div>{{jsSidebar("Functions")}}</div>
-
-<p>En términos generales, una función es un "subprograma" que puede ser <em>llamado</em> por código externo (o interno en caso de recursión) a la función. Al igual que el programa en sí mismo, una función se compone de una secuencia de declaraciones, que conforman el llamado <em>cuerpo de la función</em>. Se pueden pasar valores a una función, y la función puede <em>devolver</em> un valor.</p>
-
-<p>En JavaScript, las funciones son objetos de primera clase, es decir, son objetos y se pueden manipular y transmitir al igual que cualquier otro objeto. Concretamente son objetos {{jsxref("Function")}}.</p>
-
-<h2 id="General" name="General">General</h2>
-
-<p>Toda función en JavaScript es un objeto Function. Ver {{jsxref("Function")}} para obtener información sobre las propiedades y métodos de los objetos <code>Function</code>.</p>
-
-<p>Las funciones no son lo mismo que los procedimientos. Una función siempre devuelve un valor, pero un procedimiento, puede o no puede devolver un valor.</p>
-
-<p>Para devolver un valor especifico distinto del predeterminado, una función debe tener una sentencia {{jsxref("Sentencias/return", "return")}}, que especifique el valor a devolver. Una función sin una instrucción return devolverá el valor predeterminado. En el caso de un {{jsxref("Object.prototype.constructor", "constructor")}} llamado con la palabra clave {{jsxref("new")}}, el valor predeterminado es el valor de su parametro. Para el resto de funciones, el valor predeterminado es undefined.</p>
-
-<p>Los parámetros en la llamada a una función son los argumentos de la función. Los argumentos se pasan a las funciones <em>por valor</em>. Si la función cambia el valor de un argumento, este cambio no se refleja globalmente ni en la llamada de la función. Sin embargo, las referencias a objetos también son valores, y son especiales: si la función cambia las propiedades del objeto referenciado, ese cambio es visible fuera de la función, tal y como se muestra en el siguiente ejemplo:</p>
-
-<pre><code class="language-js"><span class="comment token">/* Declarando la función 'myFunc' */</span>
- <span class="keyword token">function</span> <span class="function token">myFunc<span class="punctuation token">(elobjeto</span></span><span class="punctuation token">)</span>
- <span class="punctuation token">{</span>
-   elobjeto<span class="punctuation token">.marca</span><span class="operator token">=</span> <span class="string token">"Toyota"</span><span class="brush: js">;</span>
- <span class="punctuation token">}</span>
-
- <span class="comment token">/*
-  * Declarando la variable 'mycar';
-  * Se crea e inicializa el nuevo objeto;
-  * para hacer referencia a él mediante 'mycar'
-  */</span>
- <span class="keyword token">var</span> mycar <span class="operator token">=</span> <span class="punctuation token">{</span>
-   marca<span class="punctuation token">:</span> <span class="string token">"Honda"</span><span class="punctuation token">,</span>
-   modelo<span class="punctuation token">:</span> <span class="string token">"Accord"</span><span class="punctuation token">,</span>
-   año<span class="punctuation token">:</span> <span class="number token">1998</span>
- <span class="punctuation token">}</span><span class="punctuation token">;</span>
-
- <span class="comment token">/* Mostrando 'Honda' */</span>
- window<span class="punctuation token">.</span><span class="function token">alert<span class="punctuation token">(</span></span>mycar<span class="punctuation token">.marca</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
- <span class="comment token">/* Paso por referencia del objeto 'mycar' a la función 'myFunc'*/</span>
- <span class="function token">myFunc<span class="punctuation token">(</span></span>mycar<span class="punctuation token">)</span><span class="punctuation token">;</span>
-
- <span class="comment token">/*
-  * Muestra 'Toyota' como valor de la propiedad 'marca'
-  * del objeto, que ha sido cambiado por la función.
-  */</span>
- window<span class="punctuation token">.</span><span class="function token">alert<span class="punctuation token">(</span></span>mycar<span class="punctuation token">.marca</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>La palabra clave <a href="/es/docs/Web/JavaScript/Referencia/Operadores/this"><code>this</code></a> no hace referencia a la función que está ejecutandose actualmente, por lo que debes referirte a los objetos Function por nombre, incluso dentro del cuerpo de la función. Como alternativa, puedes utilizar la propiedad <a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/callee">arguments.callee</a> (que no se recomienda).</p>
-
-<h2 id="Defining_functions" name="Defining_functions">Definiendo funciones</h2>
-
-<p>Hay varias formas de definir funciones:</p>
-
-<h3 id="The_function_declaration_.28function_statement.29" name="The_function_declaration_.28function_statement.29">Declaración de una función (La instrucción <code>function</code>)</h3>
-
-<p>Hay una sintaxis especial para declarar funciones (ver la instrucción {{jsxref("Sentencias/function","function")}} para más detalles):</p>
-
-<pre class="eval">function nombre([<em>param</em>[,<em>param</em>[, ...<em>param</em>]]]) {
-   instrucciones
-}
-</pre>
-
-<dl>
- <dt><code>nombre</code></dt>
- <dd>El nombre de la función.</dd>
-</dl>
-
-<dl>
- <dt><code>param</code></dt>
- <dd>El nombre de un argumento que se pasará a la función. Una función puede tener hasta 255 argumentos.</dd>
-</dl>
-
-<dl>
- <dt><code>instrucciones</code></dt>
- <dd>Las instruciones que forman el cuerpo de la función.</dd>
-</dl>
-
-<h3 id="The_function_declaration_.28function_statement.29" name="The_function_declaration_.28function_statement.29">Expresión de una función (El operador <code>function</code>)</h3>
-
-<p>Una expresión function es similar y tiene la misma sintaxis que una declaración de función (ver operador {{jsxref("Operadores/function", "function")}} para más detalles):</p>
-
-<pre class="eval">function [nombre]([<em>param</em>[, <em>param</em>[, ...<em>param</em>]]]) {
-   instrucciones
-}
-</pre>
-
-<dl>
- <dt><code>nombre</code></dt>
- <dd>El nombre de la función, se puede omitir, en ese caso la función se conoce como función anónima.</dd>
-</dl>
-
-<dl>
- <dt><code>param</code></dt>
- <dd>El nombre de los argumentos que se pasarán a la función. Una función puede tener hasta 255 argumentos.</dd>
-</dl>
-
-<dl>
- <dt><code>instrucciones</code></dt>
- <dd>Las instrucciones que forman el cuerpo de la función.</dd>
-</dl>
-
-<h3 id="La_expresión_de_función_flecha_>">La expresión de función flecha (=&gt;)</h3>
-
-<div class="note">
-<p><strong>Nota:</strong> Las expresiones de función Flecha son una tecnología experimental, parte de la proposición Harmony (EcmaScript 6) y no son ampliamente implementadas por los navegadores.</p>
-</div>
-
-<p>Una expresión de función flecha tiene una sintaxis más corta y su léxico se une a este valor (ver {{jsxref("Funciones/Arrow_functions", "arrow functions", "", 1)}} para más detalles):</p>
-
-<pre class="language-html">([param] [, param]) =&gt; { instrucciones }
-
-param =&gt; expresión
-</pre>
-
-<dl>
- <dt><code>param</code></dt>
- <dd>El nombre de un argumento. Si no hay argumentos se tiene que indicar con <code>()</code>. Para un único argumento no son necesarios los parentesis. (como <code>foo =&gt; 1</code>)</dd>
- <dt><code>instrucciones o expresión</code></dt>
- <dd>Multiples instrucciones deben ser encerradas entre llaves. Una única expresión no necesita llaves. La expresión es, así mismo, el valor de retorno implícito de esa función.</dd>
-</dl>
-
-<h3 id="The_Function_constructor" name="The_Function_constructor">El constructor <code>Function</code></h3>
-
-<p>Como todos los demás objetos, los objetos {{jsxref("Function")}} se pueden crear mediante el operador new:</p>
-
-<pre class="language-html">new Function (<em>arg1</em>, <em>arg2</em>, ... <em>argN</em>, <em>functionBody</em>)
-</pre>
-
-<dl>
- <dt><code>arg1, arg2, ... arg<em>N</em></code></dt>
- <dd>Ningún o varios argumentos  son pasados para ser utilizados por la función como nombres de argumentos formales. Cada uno debe ser una cadena que se ajuste a las reglas de identificadores válidos en JavaScript, o a una lista de este tipo de cadenas separadas por comas; por ejemplo "x", "theValue", o "a,b".</dd>
-</dl>
-
-<dl>
- <dt><code>Cuerpo de la función</code></dt>
- <dd>Una cadena conteniendo las instrucciones JavaScript que comprenden la definición de la función.</dd>
-</dl>
-
-<p>Llamar al contructor Function como una función, sin el operador new, tiene el mismo efecto que llamarlo como un constructor.</p>
-
-<div class="note"><strong>Nota:</strong> Utilizar el constructor Function no se recomienda, ya que necesita el cuerpo de la función como una cadena, lo cual puede ocasionar que no se optimize correctamente por el motor JS, y puede también causar otros problemas.</div>
-
-<h2 id="The_arguments_object" name="The_arguments_object">El objeto <code>arguments</code></h2>
-
-<p>Puedes referirte a los argumentos de una función dentro de la misma, utilizando el objeto arguments. Ver {{jsxref("Functiones/argument", "Function")}}.</p>
-
-<h2 id="Scope_and_the_function_stack" name="Scope_and_the_function_stack">Ámbito de ejecución y pila de funciones</h2>
-
-<p><span class="comment">some section about scope and functions calling other functions</span></p>
-
-<h3 id="Repaso" name="Repaso">Repaso</h3>
-
-<p>Una función puede referirse y llamarse a sí misma. Hay tres maneras en la que una función puede referirse a sí misma.</p>
-
-<ol>
- <li>El nombre de la función</li>
- <li>{{jsxref("arguments.callee")}}</li>
- <li>una función dentro del ambito de ejecución que refiere a la función</li>
-</ol>
-
-<p>Por ejemplo, considere la siguiente definición de función:</p>
-
-<pre class="brush: js">var foo = function bar() {
-   // el cuerpo va aqui
-};
-</pre>
-
-<p>Dentro del cuerpo de la función, todo lo siguientes son lo mismo:</p>
-
-<ol>
- <li><code>bar()</code></li>
- <li><code>arguments.callee()</code></li>
- <li><code>foo()</code></li>
-</ol>
-
-<p>Una función que se llama a sí misma es llamada una <em>función recursiva. </em>En algunas ocaciones, la recursión es análoga a un bucle. Ambos ejecutan el mismo código múltiples veces, y ambas requieren una condición (para evitar un bucle infinito, o en su lugar, recursión infinita en este caso). Por ejemplo, el siguiente bucle:</p>
-
-<pre class="brush: js">var x = 0;
-while (x &lt; 10) { // "x &lt; 10" es la condición
-   // haz algo
-   x++;
-}
-</pre>
-
-<p>puede ser convertida en una función recursiva y una llamada a esa función:</p>
-
-<pre class="brush: js">function loop(x) {
-   if (x &gt;= 10) // "x &gt;= 10" es la condición de salida (equivalente a "!(x &lt; 10)")
-      return;
-   // haz algo
-   loop(x + 1); // la llamada recursiva
-}
-loop(0);
-</pre>
-
-<p>Sin embargo, algunos algoritmos no pueden ser bucles iterativos simples. Por ejemplo, obtener todos los nodos de una estructura de arbol (e.g. el <a href="https://developer.mozilla.org/en-US/docs/DOM">DOM</a>) es realizado de manera más fácil usando recursión:</p>
-
-<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">recorrerArbol <span class="punctuation token">(</span></span>nodo<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-   <span class="keyword token">if</span> <span class="punctuation token">(</span>nodo <span class="operator token">==</span> <span class="keyword token">null</span><span class="punctuation token">)</span><span class="comment token"> //
-</span>      <span class="keyword token">return</span><span class="punctuation token">;</span>
-  <span class="comment token"> // haz algo con el nodo
-</span>   <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> i <span class="operator token">&lt;</span> nodo<span class="punctuation token">.</span>nodosHijos<span class="punctuation token">.</span>length<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-<span class="function token"><span class="punctuation token">       recorrerArbol(</span></span>nodo<span class="punctuation token">.nodosHijos</span><span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-   <span class="punctuation token">}</span>
-<span class="punctuation token">}</span></code>
-</pre>
-
-<p>En comparación con el bucle de la función <code>loop</code>, cada llamada recursiva hace muchas llamadas recursivas aquí.</p>
-
-<p>Es posible convertir cualquier algoritmo recursivo en uno no recursivo, pero a menudo la lógica es mucho más compleja y hacerlo requiere el uso de una pila. De hecho, la recursión utiliza una pila: la pila de funciones.</p>
-
-<p>El comportamiento similar a la pila se puede ver en el ejemplo siguiente:</p>
-
-<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">foo<span class="punctuation token">(</span></span>i<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-   <span class="keyword token">if</span> <span class="punctuation token">(</span>i <span class="operator token">&lt;</span> <span class="number token">0</span><span class="punctuation token">)</span>
-      <span class="keyword token">return</span><span class="punctuation token">;</span>
-   document<span class="punctuation token">.</span><span class="function token">writeln<span class="punctuation token">(</span></span><span class="string token">'inicio:'</span> <span class="operator token">+</span> i<span class="punctuation token">)</span><span class="punctuation token">;</span>
-   <span class="function token">foo<span class="punctuation token">(</span></span>i <span class="operator token">-</span> <span class="number token">1</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-   document<span class="punctuation token">.</span><span class="function token">writeln<span class="punctuation token">(</span></span><span class="string token">'fin:'</span> <span class="operator token">+</span> i<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-<span class="function token">foo<span class="punctuation token">(</span></span><span class="number token">3</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>que produce:</p>
-
-<pre class="language-html">inicio:3
-inicio:2
-inicio:1
-inicio:0
-fin:0
-fin:1
-fin:2
-fin:3
-</pre>
-
-<h2 id="Nested_functions_and_closures" name="Nested_functions_and_closures">Funciones anidadas y cierres</h2>
-
-<p>Puede anidar una función dentro de una función. La función anidada (inner) es privada a la función que la contiene (outer). También con la forma: aclosure.</p>
-
-<dl>
- <dd>Un cierre es una expresión (normalmente una función) que puede tener variables libres junto con un entorno que enlaza esas variables (que "cierra" la expresión).<br>
- Dado que una función anidada es un cierre, esto significa que una función anidada puede "heredar" los argumentos y las variables de su función contenedora. En otras palabras, la función interna contiene el ámbito de la función externa. <a class="external" href="http://jibbering.com/faq/faq_notes/closures.html"> </a></dd>
-</dl>
-
-<p>Desde que la función anidada es un cierre (closure), esto significa que una función anidada puede "heredar" los argumentos y variables de su función contenedora. En otras palabras, la función interna contiene un scope (alcance) de la función externa.</p>
-
-<p><span class="external">Para resumir: </span></p>
-
-<ul>
- <li><span class="external">La función interna se puede acceder sólo a partir de sentencias en la función externa. </span></li>
-</ul>
-
-<ul>
- <li><span class="external">La función interna forma un cierre: la función interna puede utilizar los argumentos y las variables de la función externa, mientras que la función externa no puede utilizar los argumentos y las variables de la función interna. </span></li>
-</ul>
-
-<p><span class="external">El ejemplo siguiente muestra funciones anidadas: </span></p>
-
-<pre class="eval"><span class="brush: js">function addCuadrado(a,b) {
-   function cuadrado(x) {
-      return x * x;
-   }
-   return cuadrado(a) + cuadrado(b);
-}
-a = addCuadrado(2,3); // retorna 13
-b = addCuadrado(3,4); // retorna 25
-c = addCuadrado(4,5); // retorna 41
-</span></pre>
-
-<p><span class="external">Dado que la función interna forma un cierre, puede llamar a la función externa y especificar argumentos para la función externa e interna</span></p>
-
-<pre class="eval"><span class="brush: js">function fuerade(x) {
-   function dentro(y) {
-      return x + y;
-   }
-   return dentro;
-}
-resultado = fuerade(3)(5); // retorna 8
-</span></pre>
-
-<h3 id="Efficiency_considerations" name="Efficiency_considerations"><span class="external">Consideraciones sobre la eficiencia</span></h3>
-
-<p><span class="external">Observe cómo se conserva <code>x</code> cuando se devuelve <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: #eeeeee;">dentro</span></font>. Un cierre conserva los argumentos y las variables en todos los ámbitos que contiene. Puesto que cada llamada proporciona argumentos potencialmente diferentes, debe crearse un cierre para cada llamada a la función externa. En otras palabras, cada llamada a <code>fuerade</code> crea un cierre. Por esta razón, los cierres pueden usar una gran cantidad de memoria. La memoria se puede liberar sólo cuando el <code>dentro</code> devuelto ya no es accesible. En este caso, el cierre del <code>dentro</code> se almacena en <code>resultado</code>. Como el <code>resultado</code> está en el ámbito global, el cierre permanecerá hasta que se descargue el script (en un navegador, esto sucedería cuando la página que contiene el script esté cerrada).</span></p>
-
-<p><span class="external">Debido a esta ineficiencia, evite cierres siempre que sea posible, es decir, evite las funciones de anidamiento siempre que sea posible. Por ejemplo, considere el siguiente ejemplo:</span></p>
-
-<pre class="eval"><span class="brush: js">function assignOnclick(elemento) {
-   element.onclick = function() {
-      this.style.backgroundColor = 'blue';
-   };
-}
-</span></pre>
-
-<p><span class="external">Esto se puede volver a escribir para evitar el cierre. Sin embargo, la función interna anónima necesitaría ser nombrada y ya no sería privada para <code>assignOnclick</code>: </span></p>
-
-<pre class="eval"><span class="brush: json">function assignOnclick(elemento) {
-   elemento.onclick = elemento_onclick;
-}
-
-function elemento_onclick() {
-   this.style.backgroundColor = 'blue';
-}
-</span></pre>
-
-<h4 id="Multiply-nested_functions" name="Multiply-nested_functions">Multiples funciones anidadas</h4>
-
-<p><span class="external">Las funciones pueden ser anidadas contigua de la otra, es decir, una función (A) que contiene una función (B) que contiene una función (C), etc. Ambas funciones B y C forman cierres aquí, por lo que B puede acceder a A y C pueden acceder a B. Además, como C puede acceder a B, que puede acceder a A, C también puede acceder a A. Por lo tanto, los cierres pueden contener múltiples ámbitos; contienen recursivamente el alcance de las funciones que lo contienen. Esto es llamado encadenamiento de objetos(<em>scope chaining</em>). (Por qué se llama "<em>chaining</em>"("encadenamiento") se explicará más adelante.)</span></p>
-
-<p><span class="external">Considere el siguiente ejemplo:</span></p>
-
-<pre class="eval"><span class="brush: js">function A(x) {
-   function B(y) {
-      function C(z) {
-         alert(x + y + z);
-      }
-      C(3);
-   }
-   B(2);
-}
-A(1); // alerts 6 (1 + 2 + 3)
-</span></pre>
-
-<p><span class="external">En este ejemplo, <code>C</code> accede a las <code>B</code> que hayan en <code>y</code> y <code>A</code> en <code>x</code>. Esto se puede hacer porque: </span></p>
-
-<ol>
- <li><span class="external"><code>B</code> forma un cierre que incluye a <code>A</code>, es decir, <code>B</code> puede acceder a los argumentos y variables de <code>A</code>. </span></li>
- <li><span class="external"><code>C</code> forma un cierre que incluye a <code>B</code>. </span></li>
- <li><span class="external">Como el cierre de <code>B</code> incluye a <code>A</code>, el cierre de <code>C</code> incluye a <code>A</code>, <code>C</code> puede acceder a los argumentos y variables de la Banda <code>A</code>. En otras palabras, codifica los ámbitos de <code>B</code> y A en ese orden. </span></li>
-</ol>
-
-<p><span class="external">Lo contrario, sin embargo, no es cierto. <code>A</code> no puede acceder a <code>C</code>, porque <code>A</code> no puede acceder a ningún argumento o variable de <code>B</code>, que <code>C</code> es una variable de. Así, <code>C</code> permanece privado de sólo <code>B</code>. </span></p>
-
-<h3 id="Conflictos_de_nombre" name="Conflictos_de_nombre"><span class="external">Conflictos de nombre </span></h3>
-
-<p><span class="external">Cuando dos argumentos o variables en los ámbitos de un cierre tienen el mismo nombre, existe un conflicto de nombres("<em>name conflict</em>"). Más alcances internos tienen prioridad, por lo que el alcance más interno tiene la más alta precedencia, mientras que el alcance más externo toma el más bajo. Esta es la cadena de alcance. El primero en la cadena es el alcance más interno, y el último es el alcance más exterior. Considera lo siguiente:</span></p>
-
-<pre class="eval"><span class="brush: js">function fuerade() {
-   var x = 10;
-   function dentro(x) {
-      return x;
-   }
-   return dentro;
-}
-resultado = fuerade()(20); // retorna 20 en lugar de 10</span>
-</pre>
-
-<p><span class="external">El conflicto de nombres ocurre en la sentencia <code>return x</code> y está entre el parámetro <code>x</code> del <code>dentro</code>y la variable <code>x</code> del <code>fuerade</code>. La cadena de alcance aquí es {<code>dentro</code>, <code>fuerade</code>, global object}. Por lo tanto, la <code>x</code> de <code>inside</code>tiene precedentes sobre la <code>x</code> de <code>fuerade</code>, y 20 (<code>dentro</code>de <code>x</code>) se devuelve en lugar de 10 (<code>fuerade</code> de <code>x</code>).</span></p>
-
-<h2 id="constructor_versus_declaration_versus_expression" name="constructor_versus_declaration_versus_expression"><span class="external">Constructor vs declaración vs expresión</span></h2>
-
-<p><span class="external">Las diferencias entre la <code>Function</code> constructora, la de declaración y la de expresión. </span></p>
-
-<p><span class="external">Compare lo siguiente: </span></p>
-
-<ol>
- <li><span class="external">Una función definida con el constructor <code>Function</code> asignado a la variable <code>multiply</code>                                                                                                                    </span>
-
-  <pre><span class="brush: js">var multiply = new Function("x", "y", "return x * y;");
-</span></pre>
- </li>
- <li><span class="external">Una declaración de una función denominada <code>multiply</code>                                                 </span>
-  <pre><span class="brush: js">function multiply(x, y) {
-   return x * y;
-}
-</span></pre>
- </li>
- <li><span class="external">Una expresión de función anónima asignada a la variable <code>multiply</code>                          </span>
-  <pre><span class="brush: js">var multiply = function(x, y) {
-   return x * y;
-}
-</span></pre>
- </li>
- <li><span class="external">Una declaración de una función denominada <code>func_name</code> asignada a la variable <code>multiply</code>                                                                                                                 </span>
-  <pre><span class="brush: js">var multiply = function func_name(x, y) {
-   return x * y;
-}
-</span></pre>
- </li>
-</ol>
-
-<p><span class="external">Todos hacen aproximadamente la misma cosa, con algunas diferencias sutiles:</span></p>
-
-<ul>
- <li><span class="external">Existe una distinción entre el nombre de la función y la variable a la que se asigna la función:</span><span class="external"> </span>
-
-  <ul>
-   <li><span class="external">El nombre de la función no se puede cambiar, mientras que la variable a la que se asigna la función puede ser reasignada.</span></li>
-   <li><span class="external">El nombre de la función sólo se puede utilizar en el cuerpo de la función. Intentar utilizarlo fuera del cuerpo de la función da como resultado un error (o <code>undefined</code> si el nombre de la función se declaró previamente mediante una instrucción <code>var</code>). Por ejemplo:                                                                                                           </span>
-    <pre><span class="brush: js">var y = function x() {};
-alert(x); // arroja un error
-</span></pre>
-
-    <p><span class="external">El nombre de la función también aparece cuando la función se serializa vía el método de la </span><code>Function</code> 'toString'.</p>
-
-    <p>Por otro lado, la variable a la que se asigna la función está limitada sólo por su ámbito, que está garantizado para incluir el ámbito en el que se declara la función.</p>
-   </li>
-   <li>Como muestra el ejemplo 4, el nombre de la función puede ser diferente de la variable a la que se asigna la función. No tienen relación entre sí.</li>
-  </ul>
- </li>
- <li>Una declaración de función también crea una variable con el mismo nombre que el nombre de la función. Por lo tanto, a diferencia de las definidas por las expresiones de función, las funciones definidas por las declaraciones de función se puede acceder por su nombre en el ámbito que se definieron en:
-  <pre class="brush: js">function x() {}
-alert(x); // salida x serializado en un string
-</pre>
-
-  <p>El siguiente ejemplo muestra cómo los nombres de las funciones no están relacionados con las variables a las que están asignadas las funciones. Si una "variable de función" se asigna a otro valor, seguirá teniendo el mismo nombre de función:</p>
-
-  <pre class="brush: js">function foo() {}
-alert(foo); // el string alterado contiene el nombre
-            // de la función "foo"
-var bar = foo;
-alert(bar); // el string todavía contiene el nombre
-            // de la función "foo"
-</pre>
- </li>
- <li>Una función definida por un<code>Function</code> no tiene un nombre de función. Sin embargo, en el <a href="/es/docs/Mozilla/Projetos/SpiderMonkey">SpiderMonkey</a> en el motor de JavaScript, la forma serializada de la función muestra como si tuviera el nombre "anónimo"("anonymous"). Por ejemplo, <code>alert(new Function())</code> salida:
-  <pre class="brush: js">function anonymous() {
-}
-</pre>
-
-  <p>Dado que la función en realidad no tiene un nombre, <code>anonymous</code> no es una variable que se puede acceder dentro de la función. Por ejemplo, lo siguiente resultaría en un error:</p>
-
-  <pre class="brush: js">var foo = new Function("alert(anonymous);");
-foo();
-</pre>
- </li>
- <li>A diferencia de las funciones definidas por expresiones de función o constructores <code>Function</code> se puede utilizar una función definida por una declaración de función antes de la propia declaración de la función. Por ejemplo:
-  <pre class="brush: js">foo(); // alerts FOO!
-function foo() {
-   alert('FOO!');
-}
-</pre>
- </li>
- <li>Una función definida por una expresión de función hereda el ámbito actual. Es decir, la función forma un cierre. Por otro lado, una función definida por un constructor de <code>Function</code> no hereda ningún ámbito que no sea el ámbito global (que todas las funciones heredan).</li>
- <li>Las funciones definidas por expresiones de función y declaraciones de función son analizadas una sola vez, mientras que las definidas por el constructor de <code>Function</code> no lo son. Es decir, la cadena de cuerpo de función pasada al constructor de <code>Function</code> debe ser analizada cada vez que se evalúa.  Aunque una expresión de función crea un cierre cada vez, el cuerpo de la función no es reparsed, por lo que las expresiones de función son aún más rápido que "<code>new Function(...)</code>". Por lo tanto, el constructor de la <code>Function</code> debe evitarse siempre que sea posible.</li>
-</ul>
-
-<p>Una declaración de función es muy fácilmente (ya menudo involuntariamente) convertida en una expresión de función. Una declaración de función deja de ser una cuando:</p>
-
-<ul>
- <li>Se convierte en parte de una expresión</li>
- <li>Ya no es un "elemento fuente" de una función o el propio script. Un "elemento de origen" es una sentencia no anidada en el script o un cuerpo de función:
-  <pre class="brush: js">var x = 0;               // elemento fuente
-if (x == 0) {            // elemento fuente
-   x = 10;               // no es un elemento fuente
-   function boo() {}     // no es un elemento fuente
-}
-function foo() {         // elemento fuente
-   var y = 20;           // elemento fuente
-   function bar() {}     // elemento fuente
-   while (y == 10) {     // elemento fuente
-      function blah() {} // no es un elemento fuente
-      y++;               // no es un elemento fuente
-   }
-}
-</pre>
- </li>
-</ul>
-
-<p>Ejemplos:</p>
-
-<ul>
- <li>
-  <pre class="brush: js">// function declaración
-function foo() {}
-
-// expresión de una función
-(function bar() {})
-
-// expresión de una función
-x = function hello() {}
-</pre>
- </li>
- <li>
-  <pre class="brush: js">if (x) {
-   // expresión de la función
-   function world() {}
-}
-</pre>
- </li>
- <li>
-  <pre class="brush: js">// instrucción de la función
-function a() {
-   // instrucción de la función
-   function b() {}
-   if (0) {
-      // expresión de la función
-      function c() {}
-   }
-}
-</pre>
- </li>
-</ul>
-
-<h3 id="Conditionally_defining_a_function" name="Conditionally_defining_a_function">Definición condicional de una función</h3>
-
-<p>Las funciones se pueden definir de forma condicional utilizando expresiones de función o el constructor <code>Function</code>.</p>
-
-<p>En la siguiente secuencia de comandos, la función <code>zero</code> nunca se define y no se puede invocar, porque '<code>if (0)</code>' se evalúa como false:</p>
-
-<pre class="brush: js">if (0)
-   function zero() {
-      document.writeln("Esto es zero.");
-   }
-</pre>
-
-<p>Si se cambia el script para que la condición se convierta en '<code>if (1)</code>', se define la función <code>zero</code>.</p>
-
-<div class="note">
-<p>Nota: Aunque esto parece una declaración de función, ésta es en realidad una expresión de función ya que está anidada dentro de otra instrucción. Ver <a href="#constructor_versus_declaration_versus_expression">las diferencias entre las funciones de declaración y de expresión</a>.</p>
-</div>
-
-<div class="note">
-<p>Nota: Algunos motores JavaScript, sin incluir <a href="/es/docs/Mozilla/Projetos/SpiderMonkey">SpiderMonkey</a>, tratan incorrectamente cualquier expresión de función con un nombre como una declaración de función. Esto llevaría a que se definiera <code>zero</code> incluso con el siempre-falso("<em>always-false</em>") condicional. Una manera más segura de definir funciones condicionalmente es definir la función anónimamente y asignarla a una variable:</p>
-</div>
-
-<pre class="brush: js">if (0)
-   var zero = function() {
-      document.writeln("Esto es zero.");
-   }
-</pre>
-
-<h2 id="Functions_as_event_handlers" name="Functions_as_event_handlers">Funciones como manejadores de eventos</h2>
-
-<p>En JavaScript, los controladores de eventos <a href="es/DOM">DOM</a> son funciones (en oposición a los objetos que contienen un método <code>handleEvent</code> en otros enlaces de idioma DOM). Las funciones se pasan un objeto de <a href="es/DOM/event">evento</a> como el primer y único parámetro. Como cualquier otro parámetro, si el objeto de evento no necesita ser utilizado, puede omitirse en la lista de parámetros formales.</p>
-
-<p>Los posibles objetivos de eventos en un documento <a href="es/HTML">HTML</a> incluyen: <code>window</code> (<code>Window</code> objects("objeto de ventana"), including frames("marcos")), <code>document</code> (<code>HTMLDocument</code> objects("objetos HTMLDocument")), y elementos (<code>Element</code> objects("objetos Elemento")). En el <a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/">HTML DOM</a>, los destinos de evento tienen propiedades de controlador de eventos. Estas propiedades son nombres de eventos en minúsculas con prefijo "on", e.g. <code>onfocus</code>. Los eventos <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/">DOM Level 2 Events</a> proporcionan una forma alternativa y más sólida de agregar oyentes de eventos.</p>
-
-<div class="note">
-<p>Nota: Los eventos son parte del DOM, no de JavaScript. (JavaScript simplemente proporciona un enlace al DOM.)</p>
-</div>
-
-<p>El ejemplo siguiente asigna una función a un manejador de eventos de "foco"("focus") de ventana.</p>
-
-<pre>window.onfocus = function() {
-   document.body.style.backgroundColor = 'white';
-}
-</pre>
-
-<p>Si se asigna una función a una variable, puede asignar la variable a un controlador de eventos. El siguiente código asigna una función a la variable <code>setBGColor</code>.</p>
-
-<pre>var setBGColor = new Function("document.body.style.backgroundColor = 'white';");
-</pre>
-
-<p>Puede utilizar esta variable para asignar una función a un controlador de eventos de varias maneras. Aquí hay dos formas:</p>
-
-<ol>
- <li>Escritura con propiedades de evento DOM HTML<br>
-
-  <pre>document.form1.colorButton.onclick = setBGColor;
-</pre>
- </li>
- <li>Atributo de evento HTML<br>
-
-  <pre>&lt;input name="colorBoton" type="button"
-   value="Cambia color de fondo"
-   onclick="setBGColor();"/&gt;
-</pre>
-
-  <p>Un manejador de eventos establecido de esta manera es en realidad una función, denominada después del atributo, envuelta alrededor del código especificado. Esta es la razón por la que los paréntesis en "<code>setBGColor()</code>" son necesarios aquí (en lugar de sólo "<code>setBGColor</code>").</p>
- </li>
-</ol>
-
-<p>Es equivalente a:</p>
-
-<pre>document.form1.colorButton.onclick = function onclick(event) {
-   setBGColor();
-}
-</pre>
-
-<p>Observe cómo se pasa el objeto de evento a esta función anónima como <code>event</code> de parámetro. Esto permite que el código especificado utilice el objeto Evento("Event object)":</p>
-
-<pre>&lt;input ...
-    onclick="alert(event.target.tagName);"/&gt;
-</pre>
-
-<p>Al igual que cualquier otra propiedad que se refiere a una función, el controlador de eventos puede actuar como un método, y <code>this</code> se refiere al elemento que contiene el controlador de eventos. En el ejemplo siguiente, se llama a la función referida por <code>onfocus</code> con <code>this</code> igual a <code>window</code>.</p>
-
-<pre class="eval">window.onfocus();
-</pre>
-
-<p>Un error común de principiante de JavaScript es el añadir paréntesis y / o parámetros al final de la variable, es decir, llamar al manejador de eventos cuando lo asigna. La adición de estos paréntesis asignará el <em>valor devuelto al llamar al manejador de eventos</em>, que a menudo es <code>undefined</code> (si la función no devuelve nada), en lugar del controlador de eventos en sí:</p>
-
-<pre class="eval">document.form1.button1.onclick = setBGColor();
-</pre>
-
-<p>Para pasar parámetros a un manejador de eventos, el manejador debe ser envuelto en otra función de la siguiente manera:</p>
-
-<pre class="eval">document.form1.button1.onclick = function() {
-   setBGColor('Algun valor');
-};
-</pre>
-
-<h3 id="Backward_compatibility" name="Backward_compatibility">Compatibilidad con versiones anteriores</h3>
-
-<h4 id="JavaScript_1.1_and_earlier" name="JavaScript_1.1_and_earlier">JavaScript 1.1 y anteriores</h4>
-
-<p>No puede anidar una sentencia de función en otra instrucción o en sí misma.</p>
-
-<h3 id="Local_variables_within_functions" name="Local_variables_within_functions">Variables locales dentro de las funciones</h3>
-
-<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments">arguments</a>: Objeto similar a una matriz que contiene los argumentos pasados a la función en ejecución.</p>
-
-<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/callee">arguments.callee</a>: Especifica la función en ejecución.</p>
-
-<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/caller">arguments.caller</a>: Especifica la función que invocó la función en ejecución.</p>
-
-<p><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments/length">arguments.length</a>: Especifica el número de argumentos pasados a la función.</p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<h4 id="1.29_Returning_a_formatted_number" name="1.29_Returning_a_formatted_number">1) Devolver un número con formato</h4>
-
-<p>La siguiente función devuelve una cadena que contiene la representación formateada de un número rellenado con ceros a la izquierda.</p>
-
-<pre class="eval">// Esta función devuelve una cadena rellenada con ceros a la izquierda
-
-function padZeros(num, totalLen) {
-   var numStr = num.toString();             // Inicializa un valor de retorno como cadena
-   var numZeros = totalLen - numStr.length; // Calcula el no. de ceros
-   for (var i = 1; i &lt;= numZeros; i++) {
-      numStr = "0" + numStr;
-   }
-   return numStr;
-}
-</pre>
-
-<p>Las siguientes sentencias llaman a la función padZeros.</p>
-
-<pre class="eval">var resultado;
-resultado = padZeros(42,4); // retorna "0042"
-resultado = padZeros(42,2); // retorna "42"
-resultado = padZeros(5,4);  // retorna "0005"
-</pre>
-
-<h4 id="2.29_Determining_whether_a_function_exists" name="2.29_Determining_whether_a_function_exists">2) Determinar si existe una función</h4>
-
-<p>Puede determinar si existe una función utilizando el operador <code>typeof</code>. En el ejemplo siguiente, se realiza una prueba para determinar si el objeto <code>window</code> tiene una propiedad llamada <code>noFunc</code> que es una función. Si es así, se utiliza; de lo contrario, se tomarán otras medidas.</p>
-
-<pre> if ('function' == typeof window.noFunc) {
-   // utiliza noFunc()
- } else {
-   // hacer algo mas
- }
-</pre>
-
-<div class="note">
-<p>Nota: Tenga en cuenta que en la prueba <code>if</code>, e utiliza una referencia a <code>noFunc</code> aquí no hay paréntesis "()" después del nombre de la función para que la función real no se llame.</p>
-</div>
-
-<h3 id="Ver_tambi.C3.A9n" name="Ver_tambi.C3.A9n">Ver también</h3>
-
-<p><a href="es/Referencia_de_JavaScript_1.5/Objetos_globales/Function">Function</a>, <a href="es/Referencia_de_JavaScript_1.5/Sentencias/function">sentencia function</a>, <a href="es/Referencia_de_JavaScript_1.5/Operadores/Operadores_globales/function">operador function</a></p>
-
-<p>{{ languages( { "en": "en/Core_JavaScript_1.5_Reference/Functions", "ru": "ru/\u042f\u0434\u0440\u043e_JavaScript_1.5_\u0421\u043f\u0440\u043e\u0432\u0447\u043d\u0438\u043a/Functions", "fr": "fr/R\u00e9f\u00e9rence_de_JavaScript_1.5_Core/Fonctions", "ja": "ja/Core_JavaScript_1.5_Reference/Functions" } ) }}</p>
diff --git a/files/es/web/javascript/referencia/funciones/method_definitions/index.html b/files/es/web/javascript/referencia/funciones/method_definitions/index.html
deleted file mode 100644
index 2aa23ca9b3..0000000000
--- a/files/es/web/javascript/referencia/funciones/method_definitions/index.html
+++ /dev/null
@@ -1,226 +0,0 @@
----
-title: Method definitions
-slug: Web/JavaScript/Referencia/Funciones/Method_definitions
-translation_of: Web/JavaScript/Reference/Functions/Method_definitions
----
-<div>{{JsSidebar("Functions")}}</div>
-
-<div>A partir de ECMAScript 2015 (ES6), se introdujo una sintaxis abreviada para la definición de métodos en inicializadores de objetos. Es una forma abreviada para la asignación de una función al nombre del método.</div>
-
-<div> </div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var obj = {
-  <var>property</var>( <var>parameters…</var> ) {},
-  *<var>generator</var>( <var>parameters…</var> ) {},
-// also with computed keys:
-  [property]( <var>parameters…</var> ) {},
-  *[generator]( <var>parameters…</var> ) {},
-// compare ES5 getter/setter syntax:
-  get <var>property</var>() {},
-  set <var>property</var>(<var>value</var>) {}
-};
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La sintaxis abreviada es similar a la introducida en ECMAScript 5 con <a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">getter</a> y <a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">setter</a>.</p>
-
-<p>Dado el siguiente código:</p>
-
-<pre class="brush: js">var obj = {
-  foo: function() {},
-  bar: function() {}
-};</pre>
-
-<p>Ahora se puede abreviar esto mismo como:</p>
-
-<pre class="brush: js">var obj = {
-  foo() {},
-  bar() {}
-};</pre>
-
-<div class="note">
-<p><strong>Nota :</strong> La sintaxis abreviada usa funciones con nombre en lugar de funciones anónimas (como en …<code>foo: function() {}</code>…). Las funciones con nombre pueden ser llamadas desde el cuerpo de la función (esto es imposible con funciones anónimas, ya que no existe un identificador al que referirse). Para más detalles, ver {{jsxref("Operators/function","function","#Examples")}}.</p>
-</div>
-
-<h3 id="Abreviatura_de_métodos_generadores">Abreviatura de métodos generadores</h3>
-
-<p>Los <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">métodos generadores</a> también pueden definirse usando la sintaxis abreviada. Note que el asterisco (*) en la sintaxis abreviada debe estar antes del nombre de propiedad del generador. Esto es, <code>* g(){}</code> funcionará, pero <code>g *(){}</code> no.</p>
-
-<pre class="brush: js;highlight[12]">// Usando una propiedad con nombre (pre-ES6)
-var obj2 = {
-  g: function*() {
-    var index = 0;
-    while(true)
-      yield index++;
-  }
-};
-
-// El mismo objeto, usando la sintaxis abreviada
-var obj2 = {
-  * g() {
-    var index = 0;
-    while(true)
-      yield index++;
-  }
-};
-
-var it = obj2.g();
-console.log(it.next().value); // 0
-console.log(it.next().value); // 1</pre>
-
-<h3 id="Las_definiciones_de_métodos_no_son_constructores_(instanciables_con_new)">Las definiciones de métodos no son constructores (instanciables con new)</h3>
-
-<p>Las las definiciones de métodos no son constructores y generarán un {{jsxref("TypeError")}} si intenta instanciarlos.</p>
-
-<pre class="brush: js example-bad">var obj = {
-  method() {},
-};
-new obj.method; // TypeError: obj.method no es un constructor
-
-var obj = {
-  * g() {}
-};
-new obj.g; // TypeError: obj.g no es un constructor (cambiado en ES2016)
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Caso_de_prueba_simple">Caso de prueba simple</h3>
-
-<pre class="brush: js;highlight[3]">var obj = {
-  a : "foo",
-  b(){ return this.a; }
-};
-console.log(obj.b()); // "foo"
-</pre>
-
-<h3 id="Nombres_de_propiedad_computados">Nombres de propiedad computados</h3>
-
-<p>La sintaxis abreviada también soporta nombres de propiedades computados.</p>
-
-<pre class="brush: js;highlight[4]">var bar = {
-  foo0 : function (){return 0;},
-  foo1(){return 1;},
-  ["foo" + 2](){return 2;},
-};
-
-console.log(bar.foo0()); // 0
-console.log(bar.foo1()); // 1
-console.log(bar.foo2()); // 2</pre>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-method-definitions', 'Method definitions')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES7', '#sec-method-definitions', 'Method definitions')}}</td>
-   <td>{{Spec2('ES7')}}</td>
-   <td>Cambiado el que los métodos generadores no deban tener una  trampa [[Construct]] y deban fallar cuando se usen con <code>new</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Definición de métodos abreviada</td>
-   <td>{{CompatChrome("39")}}</td>
-   <td>{{CompatGeckoDesktop("34")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera("26")}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Métodos generadors no son constructores (ES2016)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("43")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Definición de métodos abreviada</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("34")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Métodos generadores no son constructores (ES2016)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("43")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_específicas_para_SpiderMonkey">Notas específicas para SpiderMonkey</h2>
-
-<ul>
- <li>Anteriormente a SpiderMonkey 38 {{geckoRelease(38)}},  "<code>get</code>" y "<code>set</code>" eran nombres no válidos para métodos generadores. Esto ha sido corregido en {{bug(1073809)}}.</li>
- <li>Anteriormente a SpiderMonkey 41 {{geckoRelease(41)}}, las llaves no eran requeridas en las definiciones de métodos. Estas son requeridas de ahora en adelante conforme a la especificación ES6 y su omisión arrojará un {{jsxref("SyntaxError")}} en esta versión y posteriores ({{bug(1150855)}}).
-  <pre class="brush: js example-bad">var o = {x() 12}; // SyntaxError</pre>
- </li>
- <li>La restricción de que sólo los métodos generadores sean constructores fue implementada en SpiderMonkey 41 {{geckoRelease(41)}}. Ver también {{bug(1059908)}} y {{bug(1166950)}}.</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">get</a></code></li>
- <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">set</a></code></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Lexica grammatical</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/funciones/parametros_por_defecto/index.html b/files/es/web/javascript/referencia/funciones/parametros_por_defecto/index.html
deleted file mode 100644
index e319a3606b..0000000000
--- a/files/es/web/javascript/referencia/funciones/parametros_por_defecto/index.html
+++ /dev/null
@@ -1,234 +0,0 @@
----
-title: Parámetros predeterminados
-slug: Web/JavaScript/Referencia/Funciones/Parametros_por_defecto
-tags:
-  - Característica del lenguaje
-  - ECMAScript 2015
-  - Funciones
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Functions/Default_parameters
----
-<div>{{jsSidebar("Functions", "Funciones")}}</div>
-
-<p><span class="seoSummary"><strong>Parámetros predeterminados de función</strong> permiten que los parámetros con nombre se inicien con valores predeterminados si no se pasa ningún valor o <code>undefined</code>.</span></p>
-
-<div>{{EmbedInteractiveExample("pages/js/functions-default.html")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">function [<var>name</var>]([<var>param1</var>[ = <var>defaultValue1</var> ][, ..., <var>paramN</var>[ = <var>defaultValueN</var> ]]]) {
-   <var>statements</var>
-}
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>En JavaScript, los parámetros de función están predeterminados en {{jsxref("undefined")}}. Sin embargo, a menudo es útil establecer un valor predeterminado diferente. Aquí es donde los parámetros predeterminados pueden ayudar.</p>
-
-<p>En el pasado, la estrategia general para establecer valores predeterminados era probar los valores de los parámetros en el cuerpo de la función y asignar un valor si eran <code>undefined</code>.</p>
-
-<p>En el siguiente ejemplo, si no se proporciona ningún valor para <code><var>b</var></code> cuando se llama a <code>multiply</code>, el valor de <code><var>b</var></code> sería <code>undefined</code> al evaluar <code><var>a</var> * <var>b</var></code> y <code>multiply</code> devolvería <code>NaN</code>.</p>
-
-<pre class="brush: js notranslate">function multiply(a, b) {
-  return a * b
-}
-
-multiply(5, 2)  // 10
-multiply(5)     // NaN !
-</pre>
-
-<p>Para protegerte contra esto, usarías algo como la segunda línea, donde <code><var>b</var></code> se establece en <code>1</code> si llamas a <code>multiply</code> con un solo argumento:</p>
-
-<pre class="brush: js notranslate">function multiply(a, b) {
-  b = (typeof b !== 'undefined') ?  b : 1
-  return a * b
-}
-
-multiply(5, 2)  // 10
-multiply(5)     // 5
-</pre>
-
-<p>Con los parámetros predeterminados en ES2015, las comprobaciones en el cuerpo de la función ya no son necesarias. Ahora, puedes asignar <code>1</code> como valor predeterminado para <code><var>b</var></code> en el encabezado de la función:</p>
-
-<pre class="brush: js notranslate">function multiply(a, b = 1) {
-  return a * b
-}
-
-multiply(5, 2)          // 10
-multiply(5)             // 5
-multiply(5, undefined)  // 5
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Pasar_undefined_vs._otros_valores_falsos">Pasar <code>undefined</code> vs. otros valores falsos</h3>
-
-<p>En la segunda llamada de este ejemplo, incluso si el primer argumento se establece explícitamente en <code>undefined</code> (aunque no <code>null</code> u otros valores {{Glossary("falsy", "falsos", "", 1)}} , el valor del argumento <code><var>num</var></code> sigue siendo el predeterminado.</p>
-
-<pre class="brush: js notranslate">function test(num = 1) {
-  console.log(typeof num)
-}
-
-test()           // 'number' (num se establece en 1)
-test(undefined)  // 'number' (num se establece en 1 también)
-
-// prueba con otros valores falsos:
-test('')         // 'string' (num se establece en '')
-test(null)       // 'object' (num se establece en null)
-</pre>
-
-<h3 id="Evaluado_en_el_momento_de_la_llamada">Evaluado en el momento de la llamada</h3>
-
-<p>El argumento predeterminado se evalúa en el <em>momento de la llamada</em>. Entonces, a diferencia de (por ejemplo) Python, se crea un nuevo objeto cada vez que se llama a la función.</p>
-
-<pre class="brush: js notranslate">function append(value, array = []) {
-  array.push(value)
-  return array
-}
-
-append(1)  // [1]
-append(2)  // [2], no [1, 2]
-</pre>
-
-<p>Esto incluso se aplica a funciones y variables:</p>
-
-<pre class="brush: js notranslate">function callSomething(thing = something()) {
-  return thing
-}
-
-let numberOfTimesCalled = 0
-function something() {
-  numberOfTimesCalled += 1
-  return numberOfTimesCalled
-}
-
-callSomething()  // 1
-callSomething()  // 2
-</pre>
-
-<h3 id="Los_parámetros_anteriores_están_disponibles_para_los_parámetros_predeterminados_posteriores">Los parámetros anteriores están disponibles para los parámetros predeterminados posteriores</h3>
-
-<p>Los parámetros definidos anteriormente (a la izquierda) están disponibles para los parámetros predeterminados posteriores:</p>
-
-<pre class="brush: js notranslate">function greet(name, greeting, message = greeting + ' ' + name) {
-  return [name, greeting, message]
-}
-
-greet('David', 'Hi')                     // ["David", "Hi", "Hi David"]
-greet('David', 'Hi', 'Happy Birthday!')  // ["David", "Hi", "Happy Birthday!"]
-</pre>
-
-<p>Esta funcionalidad se puede aproximar de esta manera, lo que demuestra cuántos casos extremos se manejan:</p>
-
-<pre class="brush: js notranslate">function go() {
-  return ':P'
-}
-
-function withDefaults(a, b = 5, c = b, d = go(), e = this,
-                      f = arguments, g = this.value) {
-  return [a, b, c, d, e, f, g]
-}
-
-function withoutDefaults(a, b, c, d, e, f, g) {
-  switch (arguments.length) {
-    case 0:
-      a;
-    case 1:
-      b = 5;
-    case 2:
-      c = b;
-    case 3:
-      d = go();
-    case 4:
-      e = this;
-    case 5:
-      f = arguments;
-    case 6:
-      g = this.value;
-    default:
-  }
-  return [a, b, c, d, e, f, g];
-}
-
-withDefaults.call({value: '=^_^='});
-// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]
-
-withoutDefaults.call({value: '=^_^='});
-// [undefined, 5, 5, ":P", {value:"=^_^="}, arguments, "=^_^="]
-</pre>
-
-<h3 id="Efectos_de_el_ámbito">Efectos de el ámbito</h3>
-
-<p>Si se definen parámetros predeterminados para uno o más parámetros, se crea un <a href="https://tc39.es/ecma262/#sec-functiondeclarationinstantiation">segundo ámbito</a> (registro de entorno), específicamente para los identificadores dentro de la lista de parámetros. Este ámbito es padre del ámbito creado para el cuerpo de la función.</p>
-
-<p>Esto significa que no se puede hacer referencia a las funciones y variables declaradas en el cuerpo de la función desde los iniciadores de parámetros de valor predeterminado; intentar hacerlo arroja un {{jsxref("ReferenceError")}} en tiempo de ejecución.</p>
-
-<p>También significa que las variables declaradas dentro del cuerpo de la función usando <code>var</code> enmascararán los parámetros del mismo nombre, en lugar de que el comportamiento habitual de las declaraciones <code>var</code> duplicadas no tenga ningún efecto.</p>
-
-<p>La siguiente función arrojará un <code>ReferenceError</code> cuando se invoca, porque el valor del parámetro predeterminado no tiene acceso al ámbito secundario del cuerpo de la función:</p>
-
-<pre class="brush: js example-bad notranslate">function f(a = go()) { // Lanza un `ReferenceError` cuando se invoca a `f`.
-  function go() { return ':P' }
-}
-</pre>
-
-<p>...y esta función imprimirá <code>undefined</code> porque la variable <code>var a</code> se eleva solo a la parte superior del ámbito creado para el cuerpo de la función (y no hasta el ámbito principal creado para la lista de parámetros):</p>
-
-<pre class="brush: js example-bad notranslate">function f(a, b = () =&gt; console.log(a)) {
-  var a = 1
-  b() // Imprime `undefined`, porque los valores de los parámetros predeterminados existen en su propio ámbito
-}
-</pre>
-
-<h3 id="Parámetros_sin_valores_predeterminados_después_de_los_parámetros_predeterminados">Parámetros sin valores predeterminados después de los parámetros predeterminados</h3>
-
-<p>Los parámetros aún se establecen de izquierda a derecha, sobrescribiendo los parámetros predeterminados incluso si hay parámetros posteriores sin valores predeterminados.</p>
-
-<pre class="brush: js notranslate">function f(x = 1, y) {
-  return [x, y]
-}
-
-f()   // [1, undefined]
-f(2)  // [2, undefined]
-</pre>
-
-<h3 id="Parámetro_desestructurado_con_asignación_de_valor_predeterminado">Parámetro desestructurado con asignación de valor predeterminado</h3>
-
-<p>Puedes usar la asignación de valor predeterminado con la notación {{jsxref("Operators/Destructuring_assignment", "la desestructuración", "", 1)}}:</p>
-
-<pre class="brush: js notranslate">function f([x, y] = [1, 2], {z: z} = {z: 3}) {
-  return x + y + z
-}
-
-f()  // 6</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Definición de Funciones')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.functions.default_parameters")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:parameter_default_values" rel="external" title="http://wiki.ecmascript.org/doku.php?id=harmony:parameter_default_values">Propuesta original en ecmascript.org</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/funciones/parametros_rest/index.html b/files/es/web/javascript/referencia/funciones/parametros_rest/index.html
deleted file mode 100644
index 2e26e2c6e0..0000000000
--- a/files/es/web/javascript/referencia/funciones/parametros_rest/index.html
+++ /dev/null
@@ -1,266 +0,0 @@
----
-title: Parámetros Rest
-slug: Web/JavaScript/Referencia/Funciones/parametros_rest
-tags:
-  - Funciones
-  - JavaScript
-  - Parametros Rest
-translation_of: Web/JavaScript/Reference/Functions/rest_parameters
----
-<div>{{jsSidebar("Functions")}}</div>
-
-<p>La sintaxis de los <strong>parámetros rest </strong>nos permiten representar un número indefinido de argumentos como un array.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/functions-restparameters.html")}}</p>
-
-<p>La fuente interactiva de este ejemplo es almacenado en un repositorio de GitHub. Si a ti te gustaría contribuir al proyecto de ejemplos interactivos, por favor clona este repositorio <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull-request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: js notranslate">function(a, b, ...theArgs) {
-  // ...
-}
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p class="brush: js">El último parámetro de una función se puede prefijar con <code>...</code>, lo que hará que todos los argumentos restantes (suministrados por el usuario) se coloquen dentro de un array de javascript "estándar".</p>
-
-<p class="brush: js">Sólo el último parámetro puede ser un "parámetro rest".</p>
-
-<pre class="brush: js notranslate">function myFun(a, b, ...manyMoreArgs) {
-  console.log("a", a);
-  console.log("b", b);
-  console.log("manyMoreArgs", manyMoreArgs);
-}
-
-myFun("one", "two", "three", "four", "five", "six");
-
-// Console Output:
-// a, one
-// b, two
-// manyMoreArgs, [three, four, five, six]
-</pre>
-
-<h3 id="Diferencia_entre_los_parámetros_rest_y_el_objeto_arguments">Diferencia entre los parámetros rest y el objeto <code>arguments</code></h3>
-
-<p>Hay tres principales diferencias entre los parámetros rest y el objeto <a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments" title="arguments"><code>arguments</code></a>:</p>
-
-<ul>
- <li>los parámetros rest son sólo aquellos a los que no se les ha asignado un nombre, mientras que el objeto <code>arguments</code> contiene todos los argumentos que se le han pasado a la función;</li>
- <li>el objeto <code>arguments</code> no es un array real, mientras que los parámetros rest son instancias de  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" title="Array"><code>Array</code></a> , lo que significa que lo los métodos como <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort" title="Array sort method"><code>sort</code></a>, <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map" title="Array map method"><code>map</code></a>, <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach" title="Array forEach method"><code>forEach</code></a> o <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop" title="Array pop method"><code>pop</code></a> pueden aplicarse directamente;</li>
- <li>el objeto <code>arguments</code> tiene una funcionalidad adicional específica para sí mismo (como la propiedad <code>callee</code>).</li>
-</ul>
-
-<h3 id="De_argumentos_a_array">De argumentos a array</h3>
-
-<p>Los parámetros rest han sido agregados para reducir el código repetitivo que se usaba en los parámetros.</p>
-
-<pre class="brush: js notranslate">// Antes de los parámetros rest, "arguments" se podía convertir en un array usando:
-
-function f(a, b) {
-
-  let normalArray = Array.prototype.slice.call(arguments)
-  // -- o  --
-  let normalArray = [].slice.call(arguments)
-  // -- o  --
-  let normalArray = Array.from(arguments)
-
-  let first = normalArray.shift()  // OK, nos da el primer argumento
-  let first = arguments.shift()    // ERROR (arguments no es un array)
-}
-
-// Ahora, puedes acceder fácilmente a un array usando un parametro rest.
-
-function f(...args) {
-  let normalArray = args
-  let first = normalArray.shift() // OK, gives the first argument
-}</pre>
-
-<h3 id="Desestructuración_de_los_parametros_rest">Desestructuración de los parametros rest</h3>
-
-<p>Los parámetros rest pueden ser desestructurados, eso significa que sus datos pueden ser desempaquetados dentro de distintas variables. Ver <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">Destructuring assignment</a>.</p>
-
-<pre class="notranslate"><code>function f(...[a, b, c]) {
-  return a + b + c;
-}
-
-f(1)          // NaN (b y c son indefinidos)
-f(1, 2, 3)    // 6
-f(1, 2, 3, 4) // 6 (el cuarto parámetro no está desestructurado)</code></pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_parámetros_rest">Usando parámetros rest</h3>
-
-<p>En este ejemplo, el primer argumento es mapeado con 'a' y el segundo con 'b', entonces, esos argumentos nombrados, son usados normalmente</p>
-
-<p>De todas formas, el tercer argumento, <code>manyMoreArgs</code>, será un array que contendrá tantos argumentos como el usuario incluya (3er, 4to, 5to ...).</p>
-
-<pre class="brush: js notranslate">function myFun(a, b, ...manyMoreArgs) {
-  console.log("a", a)
-  console.log("b", b)
-  console.log("manyMoreArgs", manyMoreArgs)
-}
-
-myFun("one", "two", "three", "four", "five", "six")
-
-// a, one
-// b, two
-// manyMoreArgs, [three, four, five, six]</pre>
-
-<p>Debajo... incluso si hay solo un valor, el ultimo argumento seguirá siendo colocado dentro de un array.</p>
-
-<pre class="brush: js notranslate">// usando la misma definición de función del ejemplo anterior
-myFun("one", "two", "three")
-
-// a, one
-// b, two
-// manyMoreArgs, [three]</pre>
-
-<p>Debajo, el tercer argumento no esta provisto, pero <code>manyMoreArgs</code> continúa siendo un array (aunque uno vacío).</p>
-
-<pre class="brush: js notranslate">//usando la misma definición de función del ejemplo anterior
-
-myFun("one", "two")
-
-// a, one
-// b, two
-// manyMoreArgs, []</pre>
-
-<h3 id="Argument_length">Argument length</h3>
-
-<p>Puesto que <code>theArgs</code> es un array, su tamaño (un conteo de sus elementos) es dado por la propiedad <code>length</code> :</p>
-
-<pre class="brush: js notranslate">function fun1(...theArgs) {
-  console.log(theArgs.length);
-}
-
-fun1();  // 0
-fun1(5); // 1
-fun1(5, 6, 7); // 3
-</pre>
-
-<h3 id="Ordinary_parameter_and_rest_parameters">Ordinary parameter and rest parameters</h3>
-
-<p>En el siguiente ejemplo, se usa un parámetro rest para agrupar  dentro de un array a todos los argumentos despues del primero.  Luego cada uno es multiplicado por el primero y el arreglo es retornado:</p>
-
-<pre class="brush: js notranslate">function multiply(multiplier, ...theArgs) {
-  return theArgs.map(function (element) {
-    return multiplier * element;
-  });
-}
-
-let arr = multiply(2, 1, 2, 3);
-console.log(arr); // [2, 4, 6]
-</pre>
-
-<p>El siguiente ejemplo muestra que se puede usar los métodos de <code>Array</code> en los parámetros rest , pero no en el objeto <code>arguments</code>:</p>
-
-<pre class="brush: js notranslate">function sortRestArgs(...theArgs) {
-  var sortedArgs = theArgs.sort();
-  return sortedArgs;
-}
-
-console.log(sortRestArgs(5,3,7,1)); // muestra 1,3,5,7
-
-function sortArguments() {
-  var sortedArgs = arguments.sort();
-  return sortedArgs; // esto nunca va a ocurrir
-}
-
-// lanza un TypeError: arguments.sort is not a function
-console.log(sortArguments(5,3,7,1));
-</pre>
-
-<p>Para poder usar los métodos de  <code>Array</code> en el objeto <code>arguments</code>, se debe convertir a un <code>Array</code> primero.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-function-definitions', 'Function Definitions')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>definción inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-function-definitions', 'Function Definitions')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatChrome(47)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("15.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>34</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(47)}}</td>
-   <td>{{CompatGeckoMobile("15.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(47)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator" title="spread operator">Spread Operator</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/arguments" title="arguments">Arguments object</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array" title="Arreglos">Array</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions" title="Functions and function scope">Functions</a></li>
- <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:rest_parameters">Original proposal at ecmascript.org</a></li>
- <li><a class="external" href="http://javascriptweblog.wordpress.com/2011/01/18/javascripts-arguments-object-and-beyond/">JavaScript arguments object and beyond</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">Destructuring assignment</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/funciones/set/index.html b/files/es/web/javascript/referencia/funciones/set/index.html
deleted file mode 100644
index ef555e6759..0000000000
--- a/files/es/web/javascript/referencia/funciones/set/index.html
+++ /dev/null
@@ -1,217 +0,0 @@
----
-title: setter
-slug: Web/JavaScript/Referencia/Funciones/set
-translation_of: Web/JavaScript/Reference/Functions/set
----
-<div>{{jsSidebar("Funciones")}}</div>
-
-<p>La sintaxis  <strong><code>set</code></strong>  asocia la propiedad de un objeto a una función que será llamada cuando haya un intento de asignar valor a esa propiedad.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">{set <em>prop</em>(<em>val</em>) { . . . }}
-{set [expression](<em>val</em>) { . . . }}</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><em><code>prop</code></em></dt>
- <dd>El nombre de la propiedad a asociar con la función dada.</dd>
-</dl>
-
-<dl>
- <dt><em><code>val</code></em></dt>
- <dd>Un alias para la variable que contiene el valor a asignar a la <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">propiedad</span></font>.</dd>
- <dt><em><code>expression</code></em></dt>
- <dd>A partir de ECMAScript 2015, se puede también usar expresiones para nombres de propiedades computados para asociar a la función dada.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>En JavaScript, un setter puede ser usado para ejecutar una función donde sea que una propiedad se intente cambiar. Los setters son regularmente usados en conjunto con getters para crear un tipo de pseudo-propiedad. No es posible tener simultáneamente un setter en una propiedad que ya tiene un valor.</p>
-
-<p>Tenga en cuenta lo siguiente al trabajar con setters:</p>
-
-<div>
-<ul>
- <li>Puede tener un identificador ya sea number o string;</li>
- <li>Debe tener exactamente un parámentro (ver <a class="external" href="http://whereswalden.com/2010/08/22/incompatible-es5-change-literal-getter-and-setter-functions-must-now-have-exactly-zero-or-one-arguments/" rel="external nofollow">Incompatible <abbr title="ECMAScript 5th edition">ES5</abbr> change: literal getter and setter functions must now have exactly zero or one arguments</a> para más información);</li>
- <li>No debe aparecer en un objeto de notación literal con otro <code>set</code> o con otra entrada de datos con la misma propiedad.<br>
-  ( <code>{ set x(v) { }, set x(v) { } }</code> y <code>{ x: ..., set x(v) { } }</code> están prohibidos )</li>
-</ul>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Definiendo_un_setter_en_el_inicializador_de_nuevos_objetos">Definiendo un setter en el inicializador de nuevos objetos</h3>
-
-<p>En el siguiente ejemplo definimos una pseudo-propiedad  <code>actual</code>  al objeto <code>lenguaje</code>. Cuando se le asigne un valor a <code>actual</code>, actualiza <code>log</code> con ese valor:</p>
-
-<pre class="brush: js notranslate">var lenguaje = {
-  set actual(mensaje) {
-    this.log.push(mensaje);
-  },
-  log: []
-}
-lenguaje.actual='ES';
-console.log(lenguaje.log); // ['ES']
-
-lenguaje.actual='FR';
-console.log(lenguaje.log); // ['ES', 'FR']
-</pre>
-
-
-
-<p>Note que <code>actual</code> no está definido y cualquier intento de accederlo devolverá <code>undefined</code>.</p>
-
-<h3 id="Eliminando_un_setter_con_el_operador_delete">Eliminando un setter con el operador <code>delete</code> </h3>
-
-<p>Si desea eliminar el setter, puede simplemente aplicar <a href="/es/docs/Web/JavaScript/Referencia/Operadores/delete" title="en-US/docs/JavaScript/Reference/Operators/Special/delete"><code>delete</code></a> en él:</p>
-
-<pre class="brush: js notranslate">delete lenguaje.actual;
-</pre>
-
-<h3 id="Definiendo_un_setter_en_un_objecto_existente_usando_defineProperty">Definiendo un setter en un objecto existente usando <code>defineProperty</code></h3>
-
-<p>Para añadir un setter a un objeto <em>existente</em>,<em> </em>use {{jsxref("Object.defineProperty()")}}</p>
-
-<pre class="brush: js notranslate">consr o = {a: 0};
-
-Object.defineProperty(o, 'b', {
-  set: function (x) { this.a = x / 2; }
-});
-
-o.b = 10; // Ejecuta el setter, el cual asigna 10 / 2 (5) a la propiedad 'a'
-console.log(o.a) // 5</pre>
-
-<h3 id="Usando_un_nombre_de_propiedad_computado">Usando un nombre de propiedad computado</h3>
-
-<div class="note">
-<p><strong>Nota:</strong> Propiedades computadas son 'experimental technology'<em>,</em> parte de la propuesta para ECMAScript 6, y no está soportado en todos los navegadores. Dará error de sintaxis en entornos no soportados.</p>
-</div>
-
-<pre class="brush: js notranslate">const expr = 'foo';
-
-var obj = {
-  baz: 'bar',
-  set [expr](v) { this.baz = v; }
-};
-
-console.log(obj.baz); // "bar"
-obj.foo = "baz";      // ejecuta el setter
-console.log(obj.baz); // "baz"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.1.5', 'Object Initializer')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-method-definitions', 'Method definitions')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Se añaden las propiedades computadas.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-method-definitions', 'Method definitions')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(1)}}</td>
-   <td>{{ CompatGeckoDesktop("1.8.1") }}</td>
-   <td>{{ CompatIE(9) }}</td>
-   <td>9.5</td>
-   <td>3</td>
-  </tr>
-  <tr>
-   <td>Computed property names</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoDesktop("34") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile("1.8.1") }}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Computed property names</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("34.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_específicas_para_SpiderMonkey-specific">Notas específicas para SpiderMonkey-specific</h2>
-
-<ul>
- <li>Comenzando con<a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/1.8.1"> JavaScript 1.8.1</a>, los setters ya no son llamados cuando se definen las propiedades en los inicializadores de objetos y arrays.</li>
- <li>De SpiderMonkey 38 en adelante, un setter con un {{jsxref("Functions/rest_parameters", "rest parameter", "", 1)}} es un {{jsxref("SyntaxError")}} conforme a la especificación ES6.</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">getter</a></li>
- <li>{{jsxref("Operators/delete", "delete")}}</li>
- <li>{{jsxref("Object.defineProperty()")}}</li>
- <li>{{jsxref("Object.defineGetter", "__defineGetter__")}}</li>
- <li>{{jsxref("Object.defineSetter", "__defineSetter__")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">Definiendo Getters y Setters</a> en la Guía JavaScript</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/gramatica_lexica/index.html b/files/es/web/javascript/referencia/gramatica_lexica/index.html
deleted file mode 100644
index fd6a12d8c5..0000000000
--- a/files/es/web/javascript/referencia/gramatica_lexica/index.html
+++ /dev/null
@@ -1,661 +0,0 @@
----
-title: Gramática léxica
-slug: Web/JavaScript/Referencia/Gramatica_lexica
-tags:
-  - Gramática léxica
-  - Guía
-  - JaveScript
-  - Literal
-  - Palabra clave
-translation_of: Web/JavaScript/Reference/Lexical_grammar
----
-<div>{{JsSidebar("Más")}}</div>
-
-<p>Esta página describe la gramática léxica de JavaScript. El texto fuente de los scripts de ECMAScript se escanea de izquierda a derecha y se convierte en una secuencia de elementos de entrada que son segmentos, caracteres de control, terminadores de línea, comentarios o {{Glossary("Espacio en blanco")}}. ECMAScript también define ciertas palabras clave y literales y tiene reglas para la inserción automática del punto y coma en las declaraciones finales.</p>
-
-<h2 id="Caracteres_de_control">Caracteres de control</h2>
-
-<p>Los caracteres de control no tienen representación visual, pero se utilizan para controlar la interpretación del texto.</p>
-
-<table class="standard-table">
- <caption>Caracteres de control de formato Unicode</caption>
- <thead>
-  <tr>
-   <th>Punto de código</th>
-   <th>Nombre</th>
-   <th>Abreviatura</th>
-   <th>Descripción</th>
-  </tr>
- </thead>
- <thead>
-  <tr>
-   <td><code>U+200C</code></td>
-   <td>Separador de ancho cero</td>
-   <td>&lt;ZWNJ&gt;</td>
-   <td>Colocado entre caracteres para evitar que se conecten a ligaduras en ciertos idiomas (<a href="https://en.wikipedia.org/wiki/Zero-width_non-joiner">Wikipedia</a>).</td>
-  </tr>
-  <tr>
-   <td><code>U+200D</code></td>
-   <td>Conector de ancho cero</td>
-   <td>&lt;ZWJ&gt;</td>
-   <td>Colocado entre caracteres que normalmente no estarían conectados para hacer que los caracteres se rendericen usando su forma conectada en ciertos idiomas (<a href="https://en.wikipedia.org/wiki/Zero-width_joiner">Wikipedia</a>).</td>
-  </tr>
-  <tr>
-   <td><code>U+FEFF</code></td>
-   <td>Marca de orden de bytes</td>
-   <td>&lt;BOM&gt;</td>
-   <td>Se usa al comienzo del script para marcarlo como Unicode y el orden de bytes del texto (<a href="https://en.wikipedia.org/wiki/Marca_de_orden_de_bytes">Wikipedia</a>).</td>
-  </tr>
- </thead>
-</table>
-
-<h2 id="Espacio_en_blanco">Espacio en blanco</h2>
-
-<p>Los caracteres de {{Glossary("Espacio_en_blanco")}} mejoran la legibilidad del texto fuente y separan los fragmentos entre sí. Estos caracteres suelen ser innecesarios para la funcionalidad del código. Las <a href="https://en.wikipedia.org/wiki/Minification_%28programming%29">herramientas de minificación</a> se utilizan a menudo para eliminar espacios en blanco con el fin de reducir la cantidad de datos que se deben transferir.</p>
-
-<table class="standard-table">
- <caption>Caracteres de espacio en blanco</caption>
- <thead>
-  <tr>
-   <th>Punto de código</th>
-   <th>Nombre</th>
-   <th>Abreviatura</th>
-   <th>Descripción</th>
-   <th>Secuencia de escape</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>U+0009</td>
-   <td>Caracter de tabulación</td>
-   <td>&lt;HT&gt;</td>
-   <td>Tabulación horizontal</td>
-   <td>\t</td>
-  </tr>
-  <tr>
-   <td>U+000B</td>
-   <td>Tabulación de línea</td>
-   <td>&lt;VT&gt;</td>
-   <td>Tabulación vertical</td>
-   <td>\v</td>
-  </tr>
-  <tr>
-   <td>U+000C</td>
-   <td>Avance de Página</td>
-   <td>&lt;FF&gt;</td>
-   <td>Carácter de control de salto de página (<a href="https://en.wikipedia.org/wiki/Page_break#Form_feed">Wikipedia</a>).</td>
-   <td>\f</td>
-  </tr>
-  <tr>
-   <td>U+0020</td>
-   <td>Espacio</td>
-   <td>&lt;SP&gt;</td>
-   <td>Espacio normal</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>U+00A0</td>
-   <td>Espacio irrompible</td>
-   <td>&lt;NBSP&gt;</td>
-   <td>Espacio normal, pero ningún punto en el que una línea se pueda romper</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>Otros</td>
-   <td>Otros caracteres de espacio Unicode</td>
-   <td>&lt;USP&gt;</td>
-   <td><a href="https://es.wikipedia.org/wiki/Espacio_(puntuaci%C3%B3n)">Espacios Unicode en Wikipedia</a></td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Terminadores_de_línea">Terminadores de línea</h2>
-
-<p>Además de los caracteres de {{Glossary("Espacio_en_blanco", "espacio en blanco")}}, los caracteres de terminación de línea se utilizan para mejorar la legibilidad del texto fuente. Sin embargo, en algunos casos, los terminadores de línea pueden influir en la ejecución del código JavaScript, ya que hay algunos lugares donde están prohibidos. Los terminadores de línea también afectan el proceso de la <a href="#Inserción_automática_de_punto_y_coma">inserción automática de punto y coma</a>. Los terminadores de línea se corresponden con la clase <strong>\s</strong> en <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">expresiones regulares</a>.</p>
-
-<p>Solo los siguientes puntos de código Unicode se tratan como terminadores de línea en ECMAScript, otros caracteres de salto de línea se tratan como espacios en blanco (por ejemplo, <code>Next Line</code>, <code>NEL</code>, <code>U+0085</code> se consideran como espacios en blanco).</p>
-
-<table class="standard-table">
- <caption>Caracteres terminadores de línea</caption>
- <thead>
-  <tr>
-   <th>Punto de código</th>
-   <th>Nombre</th>
-   <th>Abreviatura</th>
-   <th>Descripción</th>
-   <th>Secuencia de escape</th>
-  </tr>
- </thead>
- <thead>
- </thead>
- <tbody>
-  <tr>
-   <td>U+000A</td>
-   <td>Alimentación de linea</td>
-   <td>&lt;LF&gt;</td>
-   <td>Caracter de nueva línea en sistemas UNIX.</td>
-   <td>\n</td>
-  </tr>
-  <tr>
-   <td>U+000D</td>
-   <td>Retorno de carro</td>
-   <td>&lt;CR&gt;</td>
-   <td>Caracter de nueva línea en Commodore y los primeros sistemas Mac.</td>
-   <td>\r</td>
-  </tr>
-  <tr>
-   <td>U+2028</td>
-   <td>Separador de línea</td>
-   <td>&lt;LS&gt;</td>
-   <td><a href="https://es.wikipedia.org/wiki/Nueva_l%C3%ADnea">Wikipedia</a></td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>U+2029</td>
-   <td>Separador de párrafos</td>
-   <td>&lt;PS&gt;</td>
-   <td><a href="https://es.wikipedia.org/wiki/Nueva_l%C3%ADnea">Wikipedia</a></td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Comentarios">Comentarios</h2>
-
-<p>Los comentarios se utilizan para agregar consejos, notas, sugerencias o advertencias al código JavaScript. Esto puede facilitar su lectura y comprensión. También se pueden utilizar para deshabilitar el código y evitar que se ejecute; esta puede ser una valiosa herramienta de depuración.</p>
-
-<p>JavaScript tiene dos formas antiguas de agregar comentarios al código.</p>
-
-<p>La primera forma son las dobles barras inclinadas <code>//</code> comentario<strong>;</strong> esta convierte en comentario todo el texto que le sigue en la misma línea. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">function comment() {
-  // Este es un comentario JavaScript de una línea
-  console.log('¡Hola mundo!');
-}
-comment();
-</pre>
-
-<p>La segunda forma es el estilo <code>/* */</code>, que es mucho más flexible.</p>
-
-<p>Por ejemplo, lo puedes usar en una sola línea:</p>
-
-<pre class="brush: js notranslate">function comment() {
-  /* Este es un comentario JavaScript de una línea */
-  console.log('¡Hola mundo!');
-}
-comment();</pre>
-
-<p>También puedes hacer comentarios de varias líneas, como este:</p>
-
-<pre class="brush: js notranslate">function comment() {
-  /* Este comentario abarca varias líneas. Aviso
-     No necesitamos cerrar el comentario hasta que terminemos. */
-  console.log('¡Hola mundo!');
-}
-comment();</pre>
-
-<p>También lo puedes usar en medio de una línea, si lo deseas, aunque esto puede hacer que tu código sea más difícil de leer, por lo que se debe usar con precaución:</p>
-
-<pre class="brush: js notranslate">function comment(x) {
-  console.log('¡Hola' + x /* inserta el valor de x */ + ' !');
-}
-comment('mundo');</pre>
-
-<p>Además, lo puedes usar para deshabilitar el código y evitar que se ejecute, envolviendo el código en un comentario, como este:</p>
-
-<pre class="brush: js notranslate">function comment() {
-  /* console.log('¡Hola mundo!'); */
-}
-comment();</pre>
-
-<p>En este caso, la llamada a <code>console.log()</code> nunca se emite, debido a que está dentro de un comentario. De esta forma se puede desactivar cualquier número de líneas de código.</p>
-
-<h2 id="Comentarios_hashbang">Comentarios <code>hashbang</code></h2>
-
-<p>Una sintaxis de tercer comentario especializado, el <strong>comentario <code>hashbang</code></strong>, está en proceso de estandarización en ECMAScript (consulta la <a href="https://github.com/tc39/proposal-hashbang">Propuesta de gramática <code>Hashbang</code></a>).</p>
-
-<p>Un comentario <code>hashbang</code> se comporta exactamente como un comentario de una sola línea (<code>//</code>). En cambio, comienza con <code>#!</code> y <strong>solo son válidos al comienzo absoluto de un script o módulo</strong>. También ten en cuenta que no se permiten espacios en blanco de ningún tipo antes del <code>#!</code>. El comentario consta de todos los caracteres después de <code>#!</code> hasta el final de la primera línea; sólo se permite uno de esos comentarios.</p>
-
-<p>El comentario <code>hashbang</code> especifica la ruta a un intérprete de JavaScript específico que deseas utilizar para ejecutar el script. Aquí tienes un sencillo ejemplo:</p>
-
-<pre class="brush: js notranslate">#!/usr/bin/env node
-
-console.log("Hola mundo");
-</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota</strong>: Los comentarios <code>hashbang</code> en JavaScript imitan a los <a href="https://en.wikipedia.org/wiki/Shebang_(Unix)"><code>shebangs</code> en Unix</a> utilizados para ejecutar archivos con el intérprete apropiado.</p>
-</div>
-
-<div class="blockIndicator warning">
-<p>Aunque <a href="https://https://es.wikipedia.org/wiki/Marca_de_orden_de_bytes">BOM</a> antes de que el comentario <code>hashbang</code> funcione en un navegador, no se recomienda utilizar BOM en un script con <code>hashbang</code>. BOM no funcionará cuando intentes ejecutar el script en Unix/Linux. Por lo tanto, usa UTF-8 sin BOM si deseas ejecutar scripts directamente desde el intérprete.</p>
-</div>
-
-<p>¡Solo debes usar el estilo de comentario <code>#!</code> para especificar un intérprete de JavaScript. En todos los demás casos, utiliza un comentario <code>//</code> (o un comentario multilínea).</p>
-
-<h2 id="Palabras_clave">Palabras clave</h2>
-
-<h3 id="Palabras_clave_reservadas_a_partir_de_ECMAScript_2015">Palabras clave reservadas a partir de ECMAScript 2015</h3>
-
-<ul class="threecolumns">
- <li>{{jsxref("Statements/break", "break")}}</li>
- <li>{{jsxref("Statements/switch", "case")}}</li>
- <li>{{jsxref("Statements/try...catch", "catch")}}</li>
- <li>{{jsxref("Statements/class", "class")}}</li>
- <li>{{jsxref("Statements/const", "const")}}</li>
- <li>{{jsxref("Statements/continue", "continue")}}</li>
- <li>{{jsxref("Statements/debugger", "debugger")}}</li>
- <li>{{jsxref("Statements/default", "default")}}</li>
- <li>{{jsxref("Operators/delete", "delete")}}</li>
- <li>{{jsxref("Statements/do...while", "do")}}</li>
- <li>{{jsxref("Statements/if...else", "else")}}</li>
- <li>{{jsxref("Statements/export", "export")}}</li>
- <li>{{jsxref("Statements/class", "extends")}}</li>
- <li>{{jsxref("Statements/try...catch", "finally")}}</li>
- <li>{{jsxref("Statements/for", "for")}}</li>
- <li>{{jsxref("Statements/function", "function")}}</li>
- <li>{{jsxref("Statements/if...else", "if")}}</li>
- <li>{{jsxref("Statements/import", "import")}}</li>
- <li>{{jsxref("Operators/in", "in")}}</li>
- <li>{{jsxref("Operators/instanceof", "instanceof")}}</li>
- <li>{{jsxref("Operators/new", "new")}}</li>
- <li>{{jsxref("Statements/return", "return")}}</li>
- <li>{{jsxref("Operators/super", "super")}}</li>
- <li>{{jsxref("Statements/switch", "switch")}}</li>
- <li>{{jsxref("Operators/this", "this")}}</li>
- <li>{{jsxref("Statements/throw", "throw")}}</li>
- <li>{{jsxref("Statements/try...catch", "try")}}</li>
- <li>{{jsxref("Operators/typeof", "typeof")}}</li>
- <li>{{jsxref("Statements/var", "var")}}</li>
- <li>{{jsxref("Operators/void", "void")}}</li>
- <li>{{jsxref("Statements/while", "while")}}</li>
- <li>{{jsxref("Statements/with", "with")}}</li>
- <li>{{jsxref("Operators/yield", "yield")}}</li>
-</ul>
-
-<h3 id="Futuras_palabras_clave_reservadas">Futuras palabras clave reservadas</h3>
-
-<p>Las siguientes están reservadas como palabras clave futuras por la especificación ECMAScript. No tienen ninguna funcionalidad especial en la actualidad, pero es posible que lo hagan en el futuro, por lo que no se pueden utilizar como identificadores.</p>
-
-<p>Estas siempre están reservadas:</p>
-
-<ul>
- <li><code>enum</code></li>
-</ul>
-
-<p>Las siguientes solo están reservadas cuando se encuentran en código de modo estricto:</p>
-
-<ul class="threecolumns">
- <li><code>implements</code></li>
- <li><code>interface</code></li>
- <li>{{jsxref("Statements/let", "let")}}</li>
- <li><code>package</code></li>
- <li><code>private</code></li>
- <li><code>protected</code></li>
- <li><code>public</code></li>
- <li><code>static</code></li>
- <li>{{jsxref("Operators/yield", "yield")}}</li>
-</ul>
-
-<p>Las siguientes solo están reservadas cuando se encuentran en código de módulo:</p>
-
-<ul>
- <li><code>await</code></li>
-</ul>
-
-<h4 id="Futuras_palabras_clave_reservadas_en_estándares_más_antiguos">Futuras palabras clave reservadas en estándares más antiguos</h4>
-
-<p>Las siguientes están reservadas como palabras clave futuras según las especificaciones de ECMAScript anteriores (ECMAScript 1 a 3).</p>
-
-<ul class="threecolumns">
- <li><code>abstract</code></li>
- <li><code>boolean</code></li>
- <li><code>byte</code></li>
- <li><code>char</code></li>
- <li><code>double</code></li>
- <li><code>final</code></li>
- <li><code>float</code></li>
- <li><code>goto</code></li>
- <li><code>int</code></li>
- <li><code>long</code></li>
- <li><code>native</code></li>
- <li><code>short</code></li>
- <li><code>synchronized</code></li>
- <li><code>throws</code></li>
- <li><code>transient</code></li>
- <li><code>volatile</code></li>
-</ul>
-
-<p>Además, los literales <code>null</code>, <code>true</code> y <code>false</code> no se pueden utilizar como identificadores en ECMAScript.</p>
-
-<h3 id="Uso_de_palabras_reservadas">Uso de palabras reservadas</h3>
-
-<p>Las palabras reservadas en realidad solo se aplican a los <em>identificadores</em> (frente a los <em>nombres de identificadores</em>). Como se describe en <a href="http://es5.github.com/#A.1">es5.github.com/#A.1</a>, todos estos son <em>IdentifierName</em>s que no excluyen <em>Palabras reservadas</em>.</p>
-
-<pre class="brush: js notranslate">a.import
-a['import']
-a = { import: 'test' }.
-</pre>
-
-<p>Por otro lado, lo siguiente es ilegal porque es un <em>Identificador</em>, que es un <em>IdentifierName</em> sin palabras reservadas. Los identificadores se utilizan para <em>FunctionDeclaration</em>, <em>FunctionExpression</em>, <em>VariableDeclaration</em> y así sucesivamente. Los <em>IdentifierNames</em> se utilizan para <em>MemberExpression</em>, <em>CallExpression</em> y así sucesivamente.</p>
-
-<pre class="brush: js notranslate">function import() {} // Ilegal.</pre>
-
-<h3 id="Identificadores_con_significado_especial">Identificadores con significado especial</h3>
-
-<p>Algunos identificadores tienen un significado especial en algunos contextos sin ser palabras clave de ningún tipo. Estos incluyen:</p>
-
-<ul class="threecolumns">
- <li>{{jsxref("Functions/arguments", "arguments")}}</li>
- <li>{{jsxref("Functions/get", "get")}}</li>
- <li>{{jsxref("Functions/set", "set")}}</li>
-</ul>
-
-<h2 id="Literales">Literales</h2>
-
-<h3 id="null_literal"><code>null</code> literal</h3>
-
-<p>Consulta también {{jsxref("null")}} para obtener más información.</p>
-
-<pre class="brush: js notranslate">null</pre>
-
-<h3 id="Booleanos_literales">Booleanos literales</h3>
-
-<p>Consulta también {{jsxref("Boolean", "Booleano")}} para obtener más información.</p>
-
-<pre class="brush: js notranslate">true
-false</pre>
-
-<h3 id="Literales_numéricos">Literales numéricos</h3>
-
-<p>Los tipos {{jsxref("Number")}} y {{jsxref("BigInt")}} usan literales numéricos.</p>
-
-<h4 id="Decimal">Decimal</h4>
-
-<pre class="brush: js notranslate">1234567890
-42
-
-// Precaución al usar con un cero a la izquierda:
-0888 // 888 procesado como decimal
-0777 // procesado como octal, 511 en decimal
-</pre>
-
-<p>Ten en cuenta que los decimales literales pueden comenzar con un cero (<code>0</code>) seguido de otro dígito decimal, pero si todos los dígitos después del <code>0</code> inicial son menores que 8, el número se interpreta como un número octal. Esto no arrojará JavaScript, consulta <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=957513">error 957513</a>. Consulta también la página sobre {{jsxref("parseInt", "parseInt()")}}</p>
-
-<h5 id="Exponencial">Exponencial</h5>
-
-<p>El literal exponencial decimal se especifica mediante el siguiente formato: <code>beN</code>; donde <code>b</code> es un número base (entero o flotante), seguido del caracter <code>e</code> (que sirve como separador o <em>indicador de exponente</em>) y <code>N</code>, que es un número <em>exponente</em> o <em>potencia</em>: un entero con signo (según las especificaciones ECMA-262 de 2019):</p>
-
-<pre class="brush: js notranslate">0e-5   // =&gt; 0
-0e+5   // =&gt; 0
-5e1    // =&gt; 50
-175e-2 // =&gt; 1.75
-1e3    // =&gt; 1000
-1e-3   // =&gt; 0.001
-</pre>
-
-<h4 id="Binario">Binario</h4>
-
-<p>La sintaxis de números binarios utiliza un cero inicial seguido de una letra "B" latina en minúscula o mayúscula (<code>0b</code> o <code>0B</code>). Debido a que esta sintaxis es nueva en ECMAScript 2015, consulta la tabla de compatibilidad del navegador a continuación. Si los dígitos después de <code>0b</code> no son 0 o 1, se muestra el siguiente {{jsxref("SyntaxError")}}: "Faltan dígitos binarios después de 0b".</p>
-
-<pre class="brush: js notranslate">var FLT_SIGNBIT  = 0b10000000000000000000000000000000; // 2147483648
-var FLT_EXPONENT = 0b01111111100000000000000000000000; // 2139095040
-var FLT_MANTISSA = 0B00000000011111111111111111111111; // 8388607</pre>
-
-<h4 id="Octal">Octal</h4>
-
-<p>La sintaxis de números octales utiliza un cero inicial seguido de una letra "O" latina en minúscula o mayúscula (<code>0o</code> o <code>0O</code>). Debido a que esta sintaxis es nueva en ECMAScript 2015, consulta la tabla de compatibilidad del navegador a continuación. Si los dígitos después del <code>0o</code> están fuera del rango (01234567), se lanza el siguiente {{jsxref("SyntaxError")}}: "Dígitos octales faltantes después del 0o".</p>
-
-<pre class="brush: js notranslate">var n = 0O755; // 493
-var m = 0o644; // 420
-
-// También es posible con solo un cero inicial (ve la nota sobre los decimales arriba)
-0755
-0644
-</pre>
-
-<h4 id="Hexadecimal">Hexadecimal</h4>
-
-<p>La sintaxis de números hexadecimales utiliza un cero inicial seguido de una letra "X" latina en minúscula o mayúscula (<code>0x</code> o <code>0X</code>). Si los dígitos después de 0x están fuera del rango (0123456789ABCDEF), se lanza el siguiente {{jsxref("SyntaxError")}}: "El identificador comienza inmediatamente después del literal numérico".</p>
-
-<pre class="brush: js notranslate">0xFFFFFFFFFFFFFFFFF // 295147905179352830000
-0x123456789ABCDEF   // 81985529216486900
-0XA                 // 10
-</pre>
-
-<h4 id="BigInt_literal">BigInt literal</h4>
-
-<p>El tipo {{jsxref("BigInt")}} es una primitiva numérica en JavaScript que puede representar números enteros con precisión arbitraria. Los BigInt literales se crean agregando <code>n</code> al final de un número entero.</p>
-
-<pre class="brush: js notranslate">123456789123456789n     // 123456789123456789
-0o777777777777n         // 68719476735
-0x123456789ABCDEFn      // 81985529216486895‬
-0b11101001010101010101n // 955733
-</pre>
-
-<p>Ten en cuenta que los números octales heredados con solo un cero a la izquierda no funcionarán para <code>BigInt</code>:</p>
-
-<pre class="brush: js example-bad notranslate">// 0755n
-// SyntaxError: sintaxis de BigInt no válida</pre>
-
-<p>Para números <code>BigInt</code> octales, siempre utiliza cero seguido de la letra "o" (mayúscula o minúscula):</p>
-
-<pre class="brush: js example-good notranslate">0o755n</pre>
-
-<p>Para obtener más información sobre <code>BigInt</code>, consulta también <a href="/es/docs/Web/JavaScript/Data_structures#BigInt_type">estructuras de datos JavaScript</a>.</p>
-
-<h4 id="Separadores_numéricos">Separadores numéricos</h4>
-
-<p>Para mejorar la legibilidad de literales numéricos, se pueden usar guiones bajos (<code>_</code>, <code>U+005F</code>) como separadores:</p>
-
-<pre class="brush: js notranslate">// separadores en números decimales
-1_000_000_000_000
-1_050.95
-
-// separadores en números binarios
-0b1010_0001_1000_0101
-
-// separadores en números octales
-0o2_2_5_6
-
-// separadores en números hexadecimales
-0xA0_B0_C0
-
-// separadores en BigInts
-1_000_000_000_000_000_000_000n
-</pre>
-
-<p>Ten en cuenta estas limitaciones:</p>
-
-<pre class="brush: js example-bad notranslate"> // No se permite más de un guión bajo en una fila
-100__000; // SyntaxError
-
-// No permitido al final de literales numéricos
-100_; // SyntaxError
-
-// No se puede usar después de 0
-0_1; // SyntaxError
-</pre>
-
-<h3 id="Objetos_literales">Objetos literales</h3>
-
-<p>Consulta también {{jsxref("Object")}} e <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">Iniciador de objeto</a> para obtener más información.</p>
-
-<pre class="brush: js notranslate">var o = { a: 'foo', b: 'bar', c: 42 };
-
-// notación abreviada. Nueva en ES2015
-var a = 'foo', b = 'bar', c = 42;
-var o = {a, b, c};
-
-// en vez de
-var o = { a: a, b: b, c: c };
-</pre>
-
-<h3 id="Arreglos_literales">Arreglos literales</h3>
-
-<p>Consulta también {{jsxref("Array")}} para obtener más información.</p>
-
-<pre class="brush: js notranslate">[1954, 1974, 1990, 2014]</pre>
-
-<h3 id="Cadenas_literales">Cadenas literales</h3>
-
-<p>Una cadena literal es cero o más puntos de código Unicode entre comillas simples o dobles. Los puntos de código Unicode también se pueden representar mediante una secuencia de escape. Literalmente todos los puntos de código pueden aparecer en una cadena literal, excepto estos puntos de código de cierre de cita:</p>
-
-<ul>
- <li>U+005C \ (backslash),</li>
- <li>U+000D &lt;CR&gt;,</li>
- <li>y U+000A &lt;LF&gt;.</li>
-</ul>
-
-<p>Antes de la <a href="https://github.com/tc39/proposal-json-superset">propuesta para hacer que todo el texto JSON sea ECMA-262 válido</a>, U+2028 &lt;LS&gt; y U+2029 &lt;PS&gt;, tampoco se permitió que aparecieran sin escape en las cadenas literales.</p>
-
-<p>Cualquier punto de código puede aparecer en forma de secuencia de escape. Las cadenas literales se evalúan como valores de cadena de ECMAScript. Al generar estos valores de cadena, los puntos de código Unicode están codificados en UTF-16.</p>
-
-<pre class="brush: js notranslate">'foo'
-"bar"</pre>
-
-<h4 id="Secuencias_de_escape_hexadecimales">Secuencias de escape hexadecimales</h4>
-
-<p>Las secuencias de escape hexadecimales constan de <code>\x</code> seguido de exactamente dos dígitos hexadecimales que representan una unidad de código o un punto de código en el rango de 0x0000 a 0x00FF.</p>
-
-<pre class="brush: js notranslate">'\xA9' // "©"
-</pre>
-
-<h4 id="Secuencias_de_escape_Unicode">Secuencias de escape Unicode</h4>
-
-<p>Una secuencia de escape Unicode consta exactamente de cuatro dígitos hexadecimales después de <code>\u</code>. Representa una unidad de código en la codificación UTF-16. Para los puntos de código U+0000 a U+FFFF, la unidad de código es igual al punto de código. Los puntos de código U+10000 a U+10FFFF requieren dos secuencias de escape que representan las dos unidades de código (un par sustituto) utilizadas para codificar el carácter; el par sustituto es distinto del punto de código.</p>
-
-<p>Consulta también {{jsxref("String.fromCharCode()")}} y {{jsxref("String.prototype.charCodeAt()")}}.</p>
-
-<pre class="brush: js notranslate">'\u00A9' // "©" (U+A9)</pre>
-
-<h4 id="Puntos_de_escape_de_código_Unicode">Puntos de escape de código Unicode</h4>
-
-<p>Un punto de código de escape Unicode consta de <code>\u{</code>, seguido de un punto de código en base hexadecimal, seguido de <code>}</code>. El valor de los dígitos hexadecimales debe estar en el rango 0 y 0x10FFFF inclusive. Los puntos de código en el rango U+10000 a U+10FFFF no necesitan representarse como un par sustituto. Se agregaron puntos de código de escape a JavaScript en ECMAScript 2015 (ES6).</p>
-
-<p>Consulta también {{jsxref("String.fromCodePoint()")}} y {{jsxref("String.prototype.codePointAt()")}}.</p>
-
-<pre class="brush: js notranslate">'\u{2F804}' // CJK COMPATIBILIDAD IDEOGRÁFICA-2F804 (U+2F804)
-
-// el mismo caracter representado como un par suplente
-'\uD87E\uDC04'</pre>
-
-<h3 id="Expresión_regular_literal">Expresión regular literal</h3>
-
-<p>Consulta también {{jsxref("RegExp")}} para obtener más información.</p>
-
-<pre class="brush: js notranslate">/ab+c/g
-
-// Una expresión regular literal "vacía"
-// El grupo de no captura vacío es necesario
-// para evitar la ambigüedad con comentarios de una sola línea.
-/(?:)/</pre>
-
-<h3 id="Plantillas_literales">Plantillas literales</h3>
-
-<p>Consulta también <a href="/es/docs/Web/JavaScript/Reference/template_strings">cadenas de plantilla</a> para obtener más información.</p>
-
-<pre class="brush: js notranslate">`string text`
-
-`string text line 1
- string text line 2`
-
-`string text ${expression} string text`
-
-tag `string text ${expression} string text`</pre>
-
-<h2 id="Inserción_automática_de_punto_y_coma">Inserción automática de punto y coma</h2>
-
-<p>Algunas <a href="/es/docs/Web/JavaScript/Reference/Statements">declaraciones JavaScript</a> se deben terminar con punto y coma y, por lo tanto, se ven afectadas por la inserción automática del punto y coma (IAPC):</p>
-
-<ul>
- <li>Declaración vacía</li>
- <li><code>let</code>, <code>const</code>, declaración de variable</li>
- <li><code>import</code>, <code>export</code>, declaración de módulo</li>
- <li>Declaración de expresión</li>
- <li><code>debugger</code></li>
- <li><code>continue</code>, <code>break</code>, <code>throw</code></li>
- <li><code>return</code></li>
-</ul>
-
-<p>La especificación ECMAScript menciona <a href="https://tc39.github.io/ecma262/#sec-rules-of-automatic-semicolon-insertion">tres reglas de inserción de punto y coma</a>.</p>
-
-<p>1. Se inserta un punto y coma antes, cuando se encuentra un <a href="#Line_terminators">terminador de línea</a> o "}" que no está permitido por la gramática.</p>
-
-<pre class="brush: js notranslate">{ 1 2 } 3
-
-// La IAPC lo transforma en
-
-{ 1 2 ;} 3;</pre>
-
-<p>2. Se inserta un punto y coma al final, cuando se detecta el final del flujo de entrada de símbolos y el analizador no puede procesar el único flujo de entrada como un programa completo.</p>
-
-<p>Aquí <code>++</code> no se trata como un <a href="/es/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Increment">operador sufijo</a> que se aplica a la variable <code>b</code>, porque se produce un terminador de línea entre <code>b</code> y <code>++</code>.</p>
-
-<pre class="brush: js notranslate">a = b
-++c
-
-// IAPC lo transforma en
-
-a = b;
-++c;
-</pre>
-
-<p>3. Se inserta un punto y coma al final, cuando una declaración con producción restringida en la gramática va seguida de un terminador de línea. Estas declaraciones con reglas "no LineTerminator aquí" son:</p>
-
-<ul>
- <li>PostfixExpressions (<code>++</code> y <code>--</code>)</li>
- <li><code>continue</code></li>
- <li><code>break</code></li>
- <li><code>return</code></li>
- <li><code>yield</code>, <code>yield*</code></li>
- <li><code>module</code></li>
-</ul>
-
-<pre class="brush: js notranslate">return
-a + b
-
-// La IAPC lo transforma en
-
-return;
-a + b;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-ecmascript-language-lexical-grammar', 'Gramática léxica')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.grammar")}}</p>
-
-<h3 id="Progreso_de_la_implementación">Progreso de la implementación</h3>
-
-<p>La siguiente tabla proporciona un estado de implementación diario para esta función, porque esta función aún no ha alcanzado la estabilidad entre navegadores. Los datos se generan al ejecutar las pruebas de funciones relevantes en <a href="https://github.com/tc39/test262">Test262</a>, el conjunto de pruebas estándar de JavaScript, en la compilación nocturna o en la última versión del motor JavaScript de cada navegador.</p>
-
-<div>{{EmbedTest262ReportResultsTable("hashbang")}}</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="http://whereswalden.com/2013/08/12/micro-feature-from-es6-now-in-firefox-aurora-and-nightly-binary-and-octal-numbers/">Jeff Walden: números binarios y octales</a></li>
- <li><a href="http://mathiasbynens.be/notes/javascript-escapes">Mathias Bynens: caracteres de secuencias de escape JavaScript</a></li>
- <li>{{jsxref("Boolean", "Booleanos")}}</li>
- <li>{{jsxref("Number", "Números")}}</li>
- <li>{{jsxref("RegExp")}}</li>
- <li>{{jsxref("String", "Cadenas de texto (Strings)")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/index.html b/files/es/web/javascript/referencia/index.html
deleted file mode 100644
index 29d75a4161..0000000000
--- a/files/es/web/javascript/referencia/index.html
+++ /dev/null
@@ -1,31 +0,0 @@
----
-title: Referencia de JavaScript
-slug: Web/JavaScript/Referencia
-tags:
-  - JavaScript
-translation_of: Web/JavaScript/Reference
----
-<p>{{JsSidebar}}</p>
-
-<h2 id="Objetos_globales" name="Objetos_globales"><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales">Objetos globales</a></h2>
-
-<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales', 'Objetos_est.C3.A1ndar_(por_categor.C3.ADa)')}}</div>
-
-<h2 id="Sentencias" name="Sentencias"><a href="/es/docs/Web/JavaScript/Referencia/Sentencias">Sentencias</a></h2>
-
-<p>{{page('/es/docs/Web/JavaScript/Referencia/Sentencias', 'Statements_and_declarations_by_category')}}</p>
-
-<h2 id="Operadores" name="Operadores"><a href="/es/docs/Web/JavaScript/Referencia/Operadores">Expresiónes y Operadores</a></h2>
-
-<p>{{page('/es/docs/Web/JavaScript/Referencia/Operadores', 'Expressions_and_operators_by_category')}}</p>
-
-<h2 id="Gramática_léxica"><a href="/es/docs/Web/JavaScript/Reference/Gramatica_lexica">Gramática léxica</a></h2>
-
-<ul>
- <li><a href="/es/Referencia_de_JavaScript_1.5/Comentarios/comentario" title="es/Referencia_de_JavaScript_1.5/Comentarios/comentario">comentarios en el Código</a> (<code>//</code> and <code>/* */</code>)</li>
- <li><a href="/es/Referencia_de_JavaScript_1.5/Palabras_Reservadas" title="es/Referencia_de_JavaScript_1.5/Palabras_Reservadas">Palabras reservadas</a></li>
-</ul>
-
-<h2 id="Ap.C3.A9ndice_B_-_Caracter.C3.ADsticas_Desprobadas" name="Ap.C3.A9ndice_B_-_Caracter.C3.ADsticas_Desprobadas"><a href="/es/docs/Web/JavaScript/Referencia/Caracter%C3%ADsticas_Desaprobadas" title="es/Referencia_de_JavaScript_1.5/Características_Desaprobadas">Apéndice - Características Desaprobadas</a></h2>
-
-<p><span class="comment">Original Document At: <a class="external" href="http://devedge-temp.mozilla.org/library/manuals/2000/javascript/1.5/reference/" rel="freelink">http://devedge-temp.mozilla.org/libr...1.5/reference/</a></span></p>
diff --git a/files/es/web/javascript/referencia/iteration_protocols/index.html b/files/es/web/javascript/referencia/iteration_protocols/index.html
deleted file mode 100644
index 7d8d31f2cd..0000000000
--- a/files/es/web/javascript/referencia/iteration_protocols/index.html
+++ /dev/null
@@ -1,320 +0,0 @@
----
-title: Protocolos de Iteración
-slug: Web/JavaScript/Referencia/Iteration_protocols
-tags:
-  - ECMAScript6
-  - Experimental
-  - Intermedio
-  - Iterable
-  - Iterador
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Iteration_protocols
----
-<div>{{jsSidebar("More")}}</div>
-
-<div>Las nuevas características de ECMAScript 6 no solo están asociadas a cambios y adiciones de sintaxis o a nuevos objetos nativos, sino también a protocolos. Dichos protocolos puede ser implementados por cualquier objeto en relación a algunas convenciones.</div>
-
-<div> </div>
-
-<div>Existen dos protocolos: El<a href="#The_.22iterable.22_protocol"> protocolo iterable</a> y el<a href="#The_.22iterator.22_protocol"> protocolo iterador</a>.</div>
-
-<div> </div>
-
-<h2 id="El_protocolo_iterable">El protocolo iterable</h2>
-
-<p>El protocolo <strong>iterable</strong> le permite a los objetos en JavaScript definir o personalizar su comportamiento de iteración, como por ejemplo qué valores son iterados dentro de una sentencia {{jsxref("Statements/for...of", "for..of")}}. Algunos objetos nativos, como {{jsxref("Array")}} o {{jsxref("Map")}}, tienen un comportamiento de iteración por defecto, mientras otros objetos (como por ejemplo {{jsxref("Object")}}) no.</p>
-
-<p>Para ser iterable, un objeto debe implementar el método <strong>@@iterator</strong>, lo cual significa que el objeto (o uno de los objetos dentro de su <a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">cadena de prototipos</a>) debe tener una propiedad con un identificador {{jsxref("Symbol")}}<code style="font-style: normal;">.iterator</code>:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedad</th>
-   <th scope="col">Valor</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>[Symbol.iterator]</code></td>
-   <td>Una función sin argumentos que retorna un objeto, de acuerdo al <a href="#The_.22iterator.22_protocol">protocolo iterador</a>.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Siempre que un objeto necesite ser iterado (como al comienzo de un <code>for..of</code> loop), su método <code>@@iterator</code> es llamado sin argumentos, y el <strong>iterador</strong> retornado es usado para obtener los valores a ser iterados.</p>
-
-<h2 id="El_protocolo_iterador">El protocolo iterador</h2>
-
-<p>El protocolo <strong>iterador</strong> define una forma estándar que permite producir una secuencia de valores (sean estos finitos o infinitos).</p>
-
-<p>Un objeto es un iterador cuando este implementa un método <code><strong>next()</strong></code> con la siguiente semántica:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Propiedad</th>
-   <th scope="col">Valor</th>
-  </tr>
-  <tr>
-   <td><code>next</code></td>
-   <td>
-    <p>Una función sin argumentos que retorna un objeto con dos propiedades:</p>
-
-    <ul>
-     <li><code>done</code> (boleano)
-
-      <ul>
-       <li>Su valor es <code>true</code> si el iterador está más allá del final de la secuencia iterada. En este caso <code>value</code> opcionalmente especifica el <em>valor retornado</em> por el iterador. Los valores retornados son explicados <a href="http://www.2ality.com/2013/06/iterators-generators.html#generators-as-threads">aquí</a>.</li>
-       <li>Su valor es <code>false</code> si el iterador pudo producir el siguiente valor en la secuencia. Esto es equivalente a no especificar la propiedad <code>done</code> en su totalidad.</li>
-      </ul>
-     </li>
-     <li><code>value</code> - cualquier valor de JavaScript retornado por el iterador. Puede ser omitido cuando el valor de <code>done</code> es <code>true</code>.</li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>Algunos iteradores son a su vez iterables:</p>
-
-<pre class="brush: js">var someArray = [1, 5, 7];
-var someArrayEntries = someArray.entries();
-
-someArrayEntries.toString();           // "[object Array Iterator]"
-someArrayEntries === someArrayEntries[Symbol.iterator]();    // true
-</pre>
-
-<h2 id="Ejemplos_de_protocolos_de_iteración">Ejemplos de protocolos de iteración</h2>
-
-<p>Un {{jsxref("String")}} es un ejemplo de un objeto iterable nativo:</p>
-
-<pre class="brush: js">var someString = "hi";
-typeof someString[Symbol.iterator];          // "function"
-</pre>
-
-<p>Para objetos <code>String</code> su iterador por defecto retorna cada uno de sus caracteres, uno a la vez:</p>
-
-<pre class="brush: js">var iterator = someString[Symbol.iterator]();
-iterator + "";                               // "[object String Iterator]"
-
-iterator.next();                             // { value: "h", done: false }
-iterator.next();                             // { value: "i", done: false }
-iterator.next();                             // { value: undefined, done: true }</pre>
-
-<p>En algunas estructuras nativas del lenguaje como en el caso del <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator">operador de propagación <em>spread operator</em></a>, el mismo protocolo de iteración está presente en su parte interna:</p>
-
-<pre class="brush: js">[...someString]                              // ["h", "i"]</pre>
-
-<p>Podemos redefinir el comportamiento de iteración creando nuestro propio  <code>@@iterator</code>:</p>
-
-<pre class="brush: js">// es necesario el uso de un objeto creado a partir de la función constructora String,
-// ya que al usar un string primitivo el <em>auto-boxing</em> generaría una referencia temporal
-// a un iterador que luego es descartado en el <em>unbox</em>
-
-var someString = new String("hi");
-
-someString[Symbol.iterator] = function() {
-  return { // este es el objeto iterador que retorna un único elemento, la cadena string "bye"
-    next: function() {
-      if (this._first) {
-        this._first = false;
-        return { value: "bye", done: false };
-      } else {
-        return { done: true };
-      }
-    },
-    _first: true
-  };
-};
-</pre>
-
-<p>Nótese que al redefinir un <code>@@iterator</code> se puede afectar el comportamiento  de construcciones nativas que usan el protocolo de iteración:</p>
-
-<pre class="brush: js">[...someString];                              // ["bye"]
-someString + "";                              // "hi"
-</pre>
-
-<h2 id="Ejemplos_de_iterables">Ejemplos de iterables</h2>
-
-<h3 id="Iterables_nativos">Iterables nativos</h3>
-
-<p>{{jsxref("String")}}, {{jsxref("Array")}}, {{jsxref("TypedArray")}}, {{jsxref("Map")}} y {{jsxref("Set")}} son objetos iterables nativos, ya que en su objeto prototipo existe un método <code>@@</code><code>iterator.</code></p>
-
-<h3 id="Iterables_personalizados">Iterables personalizados</h3>
-
-<p>Podemos crear nuestros propios iterables de la siguiente manera:</p>
-
-<pre class="brush: js">var myIterable = {};
-myIterable[Symbol.iterator] = function* () {
-    yield 1;
-    yield 2;
-    yield 3;
-};
-[...myIterable]; // [1, 2, 3]
-</pre>
-
-<h3 id="APIs_nativas_que_aceptan_iterables">APIs nativas que aceptan iterables</h3>
-
-<p>Existen varios APIs que aceptan iterables, como en el caso de: {{jsxref("Map", "Map([iterable])")}}, {{jsxref("WeakMap", "WeakMap([iterable])")}}, {{jsxref("Set", "Set([iterable])")}} y {{jsxref("WeakSet", "WeakSet([iterable])")}}:</p>
-
-<pre class="brush: js">var myObj = {};
-new Map([[1,"a"],[2,"b"],[3,"c"]]).get(2);               // "b"
-new WeakMap([[{},"a"],[myObj,"b"],[{},"c"]]).get(myObj); // "b"
-new Set([1, 2, 3]).has(3);                               // true
-new Set("123").has("2");                                 // true
-new WeakSet(function*() {
-    yield {};
-    yield myObj;
-    yield {};
-}()).has(myObj);                                         // true
-</pre>
-
-<p>De igual manera {{jsxref("Promise.all", "Promise.all(iterable)")}}, {{jsxref("Promise.race", "Promise.race(iterable)")}}, y {{jsxref("Array.from", "Array.from()")}}.</p>
-
-<h3 id="Sintaxis_que_espera_un_iterable">Sintaxis que espera un iterable</h3>
-
-<p>Algunas declaraciones y expresiones esperan iterables, por ejemplo el bucle <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for-of</a></code>, el<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_operator"> operador de propagación <em>spread operator</em></a>,  la expresión <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/yield*">Yield*</a></code>, y la <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">asignación desestructurada <em>destructuring assignment</em></a>.</p>
-
-<pre class="brush: js">for(let value of ["a", "b", "c"]){
-    console.log(value);
-}
-// "a"
-// "b"
-// "c"
-
-[..."abc"]; // ["a", "b", "c"]
-
-function* gen(){
-  yield* ["a", "b", "c"];
-}
-
-gen().next(); // { value:"a", done:false }
-
-[a, b, c] = new Set(["a", "b", "c"]);
-a // "a"
-
-</pre>
-
-<h3 id="Iterables_mal_definidos">Iterables mal definidos</h3>
-
-<p>Un método <code>@@iterator</code> iterable que no retorne un objeto iterador no está correctamente definido, por lo tanto al ejecutarlo de esta manera podría resultar en excepciones en tiempo de ejecución y otros errores:</p>
-
-<pre class="brush: js">var nonWellFormedIterable = {}
-nonWellFormedIterable[Symbol.iterator] = () =&gt; 1
-[...nonWellFormedIterable] // TypeError: [] is not a function
-</pre>
-
-<h2 id="Ejemplos_de_iteradores">Ejemplos de iteradores</h2>
-
-<h3 id="Iterador_simple">Iterador simple</h3>
-
-<pre class="brush: js">function makeIterator(array){
-    var nextIndex = 0;
-
-    return {
-       next: function(){
-           return nextIndex &lt; array.length ?
-               {value: array[nextIndex++], done: false} :
-               {done: true};
-       }
-    };
-}
-
-var it = makeIterator(['yo', 'ya']);
-
-console.log(it.next().value); // 'yo'
-console.log(it.next().value); // 'ya'
-console.log(it.next().done);  // true
-</pre>
-
-<h3 id="Iterador_infinito">Iterador infinito</h3>
-
-<pre class="brush: js">function idMaker(){
-    var index = 0;
-
-    return {
-       next: function(){
-           return {value: index++, done: false};
-       }
-    };
-}
-
-var it = idMaker();
-
-console.log(it.next().value); // '0'
-console.log(it.next().value); // '1'
-console.log(it.next().value); // '2'
-// ...
-</pre>
-
-<h3 id="Con_un_generador">Con un generador</h3>
-
-<pre class="brush: js">function* makeSimpleGenerator(array){
-    var nextIndex = 0;
-
-    while(nextIndex &lt; array.length){
-        yield array[nextIndex++];
-    }
-}
-
-var gen = makeSimpleGenerator(['yo', 'ya']);
-
-console.log(gen.next().value); // 'yo'
-console.log(gen.next().value); // 'ya'
-console.log(gen.next().done);  // true
-
-
-
-function* idMaker(){
-    var index = 0;
-    while(true)
-        yield index++;
-}
-
-var gen = idMaker();
-
-console.log(gen.next().value); // '0'
-console.log(gen.next().value); // '1'
-console.log(gen.next().value); // '2'
-// ...
-</pre>
-
-<h2 id="¿Un_objeto_generador_es_un_iterador_o_un_iterable">¿Un objeto generador es un iterador o un iterable?</h2>
-
-<p>Un <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Generator">objeto iterador</a> es tanto un iterador como un iterable:</p>
-
-<pre class="brush: js">var aGeneratorObject = function*(){
-    yield 1;
-    yield 2;
-    yield 3;
-}();
-typeof aGeneratorObject.next;
-// "function", ya que tiene un método next, por lo tanto es un iterador
-typeof aGeneratorObject[Symbol.iterator];
-// "function", ya que tiene un método @@iterator, por lo tanto es un iterable
-aGeneratorObject[Symbol.iterator]() === aGeneratorObject;
-// true, ya que su método @@iterator retorna a sí mismo (un iterador), por lo tanto es un iterable bien formado
-[...aGeneratorObject];
-// [1, 2, 3]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-iteration', 'Iteration')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Temas_relacionados">Temas relacionados</h2>
-
-<p>Para información adicional acerca de generadores <em>generators</em> en ES6, puede visitar la  <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">página específica</a> sobre este tema.</p>
diff --git a/files/es/web/javascript/referencia/modo_estricto/index.html b/files/es/web/javascript/referencia/modo_estricto/index.html
deleted file mode 100644
index d6a596b3e5..0000000000
--- a/files/es/web/javascript/referencia/modo_estricto/index.html
+++ /dev/null
@@ -1,368 +0,0 @@
----
-title: Modo Estricto
-slug: Web/JavaScript/Referencia/Modo_estricto
-tags:
-  - ECMAScript5
-  - Guía
-  - JavaScript
-  - Modo estricto
-translation_of: Web/JavaScript/Reference/Strict_mode
----
-<div>{{JsSidebar("More", "Más")}}</div>
-
-<div class="callout-box">A veces, verás que llaman {{Glossary("Sloppy_mode", "sloppy mode — modo poco riguroso")}} al modo no estricto predeterminado. Este no es un término oficial, pero tenlo en cuenta, por si acaso.</div>
-
-<p>El modo estricto de <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript 5</a> es una forma de elegir una variante <em>restringida</em> de <em>JavaScript</em>, así implícitamente se deja de lado el modo poco riguroso. El modo estricto no es sólo un subconjunto: <em>intencionalmente</em> tiene diferencia semántica del código normal. Los navegadores que no admiten el modo estricto ejecutarán el código con un comportamiento diferente a los que sí lo soportan, por lo tanto no confíes en el modo estricto sin antes hacer pruebas de sus características más relevantes. Los modos estricto y no estricto pueden coexistir, por lo tanto el código se puede transformar a modo estricto incrementalmente.</p>
-
-<p>El modo estricto tiene varios cambios en la semántica normal de JavaScript:</p>
-
-<ol>
- <li>Elimina algunos errores silenciosos de JavaScript cambiándolos para que lancen errores.</li>
- <li>Corrige errores que hacen difícil para los motores de JavaScript realizar optimizaciones: a veces, el código en modo estricto puede correr más rápido que un código idéntico pero no estricto.</li>
- <li>Prohíbe cierta sintaxis que probablemente sea definida en futuras versiones de ECMAScript.</li>
-</ol>
-
-<p>Ve <a href="/es/docs/Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mode">transición a modo estricto</a>, si deseas cambiar tu código para trabajar en la variante estricta de JavaScript.</p>
-
-<h2 id="Invocar_el_modo_estricto">Invocar el modo estricto</h2>
-
-<p>El modo estricto se aplica a un <em>script completo</em> o a <em>funciones individuales</em>. No se aplica a bloques entre corchetes <code>{}</code>; intentar aplicarlo en tales contextos no hace nada. Código <code>eval</code>, código <code>Function</code>, atributos de controladores de eventos, cadenas pasadas a <a href="/es/docs/Web/API/WindowTimers.setTimeout" title="es/DOM/window.setTimeout"><code>setTimeout</code></a>, y similares son scripts enteros, de modo que invocar modo estricto en tales contextos funciona como se espera.</p>
-
-<h3 id="Modo_estricto_para_scripts">Modo estricto para scripts</h3>
-
-<p>Para invocar el modo estricto en todo un script, escribe <em>exactamente</em> <code>"use strict";</code> (o <code>'use strict';</code>) antes de cualquier otra expresión.</p>
-
-<pre class="brush: js notranslate">// Sintaxis del modo estricto para todo el script
-'use strict';
-var v = "¡Hola! ¡Estoy en modo estricto para script!";
-</pre>
-
-<p>Esta sintaxis tiene un problema que <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=579119">ya ha afectado</a> a <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=627531">cierta página bien conocida</a>: no es posible concatenar ciegamente scripts conflictivos entre sí. Si concatena un script en modo estricto con otro que no es, la concatenación de ambos producirá código en modo estricto. Lo contrario también es cierto: código en modo no estricto mas código estricto produce código que no es estricto. Concatenar scripts no produce problemas si todos están en modo estricto (o si todos están en modo no estricto). El problema es mezclar scripts en modo estricto con scripts en modo no estricto. Por eso se recomienda habilitar el modo estricto a nivel de función solamente (al menos durante el periodo de transición de un programa).</p>
-
-<p>Otra opción es envolver el contenido completo del script en una función y tener esa función externa en modo estricto. Así se elimina el problema de la concatenación, pero entonces tienes que hacerte cargo de exportar explícitamente las variables globales fuera del ámbito de la función.</p>
-
-<h3 id="Modo_estricto_para_funciones">Modo estricto para funciones</h3>
-
-<p>De igual forma, para invocar el modo estricto para una función, escribe <em>exactamente</em> <code>"use strict";</code> (o <code>'use strict';</code>) en el cuerpo de la función antes de cualquier otra expresión.</p>
-
-<pre class="brush: js notranslate">function strict() {
-  // Sintaxis del modo estricto a nivel de función
-  'use strict';
-  function nested() { return "¡Y yo también!"; }
-  return "¡Hola!  ¡Soy una función en modo estricto!  " + nested();
-}
-function notStrict() { return "Yo no soy estricto."; }
-</pre>
-
-<h3 id="Modo_estricto_para_módulos">Modo estricto para módulos</h3>
-
-<p>ECMAScript 2015 introdujo módulos y por tanto una tercera manera de entrar en el modo estricto. Todo el contenido de los módulos de JavaScript se encuentra automáticamente en modo estricto, sin necesidad de una declaración para iniciarlo.</p>
-
-<pre class="brush: js notranslate">function strict() {
-    // debido a que este es un módulo, soy estricto por omisión
-}
-export default strict;
-</pre>
-
-<h2 id="Cambios_en_modo_estricto">Cambios en modo estricto</h2>
-
-<p>El modo estricto cambia la sintaxis y el comportamiento en tiempo de ejecución. Los cambios generalmente caen dentro de estas categorías: cambios que convierten equivocaciones en errores (como errores de sintaxis o en tiempo de ejecución), cambios que simplifican cómo se calcula el nombre de una variable particular, cambios que simplifican el uso de <code>eval</code> y <code>arguments</code>, cambios que hacen más fácil escribir JavaScript "seguro", y cambios que anticipan la evolución futura de ECMAScript.</p>
-
-<h3 id="Convertir_equivocaciones_en_errores">Convertir equivocaciones en errores</h3>
-
-<p>El modo estricto cambia algunos errores de sintaxis tolerados en modo no estricto y los convierte en errores. JavaScript fue diseñado de modo que fuera fácil para programadores novatos, y puede haber operaciones semánticas que deberían ser errores pero son tratadas como libres de error. A veces esto sirve para solucionar el problema en el momento, pero puede crear problemas más graves en el futuro. El modo estricto trata las equivocaciones como errores, para que se puedan descubrir y subsanar inmediatamente.</p>
-
-<p>En primer lugar, el modo estricto hace imposible crear variables globales por accidente. En JavaScript no estricto, si se escribe mal una variable en una asignación, se creará una nueva propiedad en el objeto global y el código continuará "trabajando" como si nada (aunque es posible que el código así escrito falle en el futuro, en concreto, en JavaScript moderno). En modo estricto, cualquier asignación que produzca variables globales por accidente lanzará un error:</p>
-
-<pre class="brush: js notranslate">'use strict';
-                       // Asumiendo que exista una variable global llamada mistypedVariable
-mistypeVariable = 17;  // esta línea lanza un ReferenceError debido a
-                       // una errata en el nombre de la variable
-</pre>
-
-<p>En segundo lugar, el modo estricto lanza una excepción en asignaciones que de otro modo fallarían silenciosamente. Por ejemplo, <code>NaN</code> es una variable global que no puede ser asignada. En un código normal, asignar a <code>NaN</code> no tiene efecto; el programador no recibe ningún mensaje de error. En cambio, en modo estricto, si se intenta asignar un valor a <code>NaN</code>, el programador recibirá una excepción. Cualquier asignación que falle silenciosamente en código normal (asignaciones a una propiedad de no escritura, asignaciones a una propiedad captadora, asignaciones a una nueva propiedad o a un objecto {{jsxref("Global_Objects/Object/preventExtensions", "no extensible")}}) lanzará una excepción en modo estricto:</p>
-
-<pre class="brush: js notranslate">'use strict';
-
-// Asignación a una no-escritura global
-var undefined = 5; // lanza un TypeError
-var Infinity = 5; // lanza un TypeError
-
-// Asignación a una propiedad de no-escritura
-var obj1 = {};
-Object.defineProperty(obj1, "x", { value: 42, writable: false });
-obj1.x = 9; // lanza un TypeError
-
-// Asignación a una propiedad de tipo getter
-var obj2 = { get x() { return 17; } };
-obj2.x = 5; // lanza un TypeError
-
-// Asignación a una nueva propiedad en un objeto no extensible
-var fixed = {};
-Object.preventExtensions(fixed);
-fixed.newProp = "ohai"; // lanza un TypeError
-</pre>
-
-<p>En tercer lugar, el modo estricto lanza una excepción al intentar eliminar propiedades no eliminables (mientra que en código normal el intento no tendría ningún efecto):</p>
-
-<pre class="brush: js notranslate">'use strict';
-delete Object.prototype; // lanza un TypeError
-</pre>
-
-<p>En cuarto lugar, la versión de modo estricto anterior a Gecko 34 requiere que todas las propiedades nombradas en un objeto sean únicas. En código normal se pueden duplicar nombres, siendo el último el que determina el valor de la propiedad. Pero como el último es el único que hace algo, la duplicidad da origen a errores si el código se modifica para cambiar el valor de la propiedad. Duplicar nombres de propiedades es un error de sintaxis en modo estricto.</p>
-
-<div class="note">
-<p>Este ya no es el caso en ECMAScript 2015 (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1041128">error 1041128</a>).</p>
-</div>
-
-<pre class="brush: js notranslate">'use strict';
-var o = { p: 1, p: 2 }; // !!! error de sintaxis
-</pre>
-
-<p>En quinto lugar, el modo estricto requiere que los nombres de los parámetros de una función sean únicos. En código normal, el último argumento repetido oculta argumentos anteriores con el mismo nombre. Estos argumentos permanecen disponibles a través de <code>arguments[i]</code>, de modo que no son completamente inaccesibles. Aun así, esta ocultación tiene poco sentido y es probablemente indeseable (pues puede ocultar, por ejemplo, un error al teclear una letra). Por lo tanto, en modo estricto, duplicar nombres de argumentos es un error de sintaxis:</p>
-
-<pre class="brush: js notranslate">function sum(a, a, c) { // !!! error de sintaxis
-  'use strict';
-  return a + a + c; // incorrecto si este código se ejecutó
-}
-</pre>
-
-<p>En sexto lugar, en modo estricto ECMAScript 5 se prohíbe la notación octal. La notación octal no es parte de ECMAScript 5, pero está soportada en todos los navegadores al poner como prefijo un cero al número: <code>0644 == 420</code> y <code>"\045" === "%"</code>. En ECMAScript 2015, el número octal es compatible con el prefijo de un número con "<code>0o</code>". Es decir:</p>
-
-<pre class="brush: js notranslate">var a = 0o10; // ES2015: Octal</pre>
-
-<p>Los programadores novatos a veces creen que un prefijo cero inicial no tiene un significado semántico, por lo que lo usan como dispositivo de alineación, ¡pero esto cambia el significado del número! Una sintaxis de cero a la izquierda para los octales rara vez es útil y se puede usar por error, por lo que el modo estricto lo convierte en un error de sintaxis:</p>
-
-<pre class="brush: js notranslate">'use strict';
-var sum = 015 + // !!! error de sintaxis
-          197 +
-          142;
-
-var sumWithOctal = 0o10 + 8;
-console.log(sumWithOctal); // 16
-</pre>
-
-<p>Séptimo, el modo estricto en ECMAScript 2015 prohíbe establecer propiedades en valores {{Glossary("Primitive", "primitivos")}}. La sintaxis octal rara vez es útil y se puede usar equivocadamente, de modo que en modo estricto, utilizar notación octal lanza un {{jsxref("TypeError")}}:</p>
-
-<pre class="brush: js notranslate">(function() {
-'use strict';
-
-false.true = '';         // TypeError
-(14).sailing = 'home';   // TypeError
-'with'.you = 'far away'; // TypeError
-
-})();</pre>
-
-<h3 id="Simplificación_en_el_uso_de_variables">Simplificación en el uso de variables</h3>
-
-<p>El modo estricto simplifica el modo en que el nombre de una variable es asignado a un variable particular en el código. Muchas optimizaciones del compilador se basan en la habilidad para decir el lugar específico en que una variable está almacenada, lo cual es crítico para una optimización completa del código JavaScript. Algunas veces JavaScript hace que esta asignación básica del nombre de una variable y su valor no suceda hasta que no se está en tiempo de ejecución. El modo estricto elimina muchos de los casos en los que esto pasa, de modo que el compilador puede optimizar mejor el código que es estricto.</p>
-
-<p>Primero, el modo estricto prohíbe el uso de <code>with</code>. El problema con <code>with</code> es que cualquier nombre dentro del bloque pude ser asignado a una propiedad del objecto pasado como argumento, o a una variable en su ámbito circundante (o incluso global), en tiempo de ejecución: es imposible saber de antemano cuál será. El modo estricto hace que el uso de <code>with</code> sea un error de sintaxis, de modo que no hay oportunidad de que una variable dentro de un <code>with</code> se refiera a una dirección desconocida en tiempo de ejecución:</p>
-
-<pre class="brush: js notranslate">'use strict';
-var x = 17;
-with (obj) { // !!! error de sintaxis
-  // Si este no estuviera un modo estricto, ¿sería var x?, o
-  // ¿sería obj.x en su lugar?  Es imposible en general
-  // decirlo sin ejecutar el código, por lo que el nombre no
-  // se puede optimizar.
-  x;
-}
-</pre>
-
-<p>En vez de usar <code>with</code>, existe la simple alternativa de asignar el objecto a una variable de nombre más corto, y después acceder a la propiedad correspondiente de esa variable.</p>
-
-<p>Segundo, el uso de <code>eval</code> en modo estricto no introduce nuevas variables en el ámbito circundante. En código normal, <code>eval("var x;")</code> introduce una variable <code>x</code> dentro de la función circundante o el ámbito global. Esto significa que, en general, en una función que contiene una llamada a <code>eval</code> en cada nombre que no se refiera a un argumento o a una variable local, se debe asignar a una definición en particular en tiempo de ejecución (debido a que <code>eval</code> puedo haber introducido una nueva variable que podría ocultar una variable externa). En modo estricto, <code>eval</code> crea variables solo para el código que se está evaluando, por lo que <code>eval</code> no puede afectar si un nombre se refiere a una variable externa o a alguna variable local:</p>
-
-<pre class="brush: js notranslate">var x = 17;
-var evalX = eval("'use strict'; var x = 42; x");
-console.assert(x === 17);
-console.assert(evalX === 42);
-</pre>
-
-<p>En el ejemplo anterior, si la función <code>eval</code> es invocada por una expresión de la forma <code>eval(...)</code> en código de modo estricto, el código será evaluado en modo estricto. El código puede explícitamente invocar el modo estricto, pero no es necesario.</p>
-
-<pre class="brush: js notranslate">function strict1(str) {
-  'use strict';
-  return eval(str); // str será tratado como código de modo estricto
-}
-function strict2(f, str) {
-  'use strict';
-  return f(str); // no eval(...): str es estricto si y solo
-                 // si invoca el modo estricto
-}
-function nonstrict(str) {
-  return eval(str); // str es estricto si y solo
-                    // si invoca el modo estricto
-}
-
-strict1("'¡Código en modo estricto!'");
-strict1("'use strict'; '¡Código en modo estricto!'");
-estricto2(eval, "'Código no estricto'");
-strict2(eval, "'use strict'; '¡Código en modo estricto!'");
-nonstrict("'Código no estricto'");
-nonstrict("'use strict'; '¡Código en modo estricto!'");
-</pre>
-
-<p>Así los nombres en modo estricto usando <code>eval</code> se comportan idénticamente a los nombres en modo estricto no siendo evaluados como resultado de <code>eval</code>.</p>
-
-<p>Tercero, el modo estricto prohíbe eliminar nombres planos. De este modo, <code>delete name</code> produce un error de sintaxis.</p>
-
-<pre class="brush: js notranslate">'use strict';
-
-var x;
-delete x; // !!! error de sintaxis
-
-eval("var y; delete y;"); // !!! error de sintaxis</pre>
-
-<h3 id="Haciendo_eval_y_arguments_más_simples">Haciendo <code>eval</code> y <code>arguments</code> más simples</h3>
-
-<p>El modo estricto hace que el uso de <code>arguments</code> y <code>eval</code> sea más intuitivo. Ambos envuelven un considerable misticismo en código normal: <code>eval</code> al añadir o remover los enlaces y cambiar los valores de dichos enlaces, y <code>arguments</code> al poder sustituir los nombres de los argumentos por propiedades indexadas. El modo estricto ofrece un gran paso al tratar a <code>eval</code> y a <code>arguments</code> como palabras clave, aunque soluciones finales no estarán disponibles hasta futuras ediciones de ECMAScript.</p>
-
-<p>Primero, las palabras <code>eval</code> y <code>arguments</code> no se pueden ligar o asignar en la sintaxis del lenguaje. Cualquier intento producirá un error de sintaxis:</p>
-
-<pre class="brush: js notranslate">'use strict';
-eval = 17;
-arguments++;
-++eval;
-var obj = { set p(arguments) { } };
-var eval;
-try { } catch (arguments) { }
-function x(eval) { }
-function arguments() { }
-var y = function eval() { };
-var f = new Function("arguments", "'use strict'; return 17;");
-</pre>
-
-<p>Segundo, el modo estricto no permite usar alias en elementos del objecto <code>arguments</code> creados dentro de la función. En una función en código normal cuyo primer parámetro sea <code>args</code>, si se cambia el valor de <code>args</code> también se cambiará de <code>arguments[0]</code>, y viceversa (a menos que no se proporcionen parámetros o se elimine <code>arguments[0]</code>). El objecto <code>arguments</code> para el modo estricto almacena los parámetros originales cuando la función es invocada. <code>arguments[i]</code> no guarda el valor del correspondiente nombre del parámetro, ni tampoco un parámetro con nombre guarda el valor correspondiente de <code>arguments[i]</code>.</p>
-
-<pre class="brush: js notranslate">function f(a) {
-  'use strict';
-  a = 42;
-  return [a, arguments[0]];
-}
-var pair = f(17);
-console.assert(pair[0] === 42);
-console.assert(pair[1] === 17);
-</pre>
-
-<p>Tercero, <code>arguments.callee</code> no está soportado. En código normal, <code> arguments.callee</code> se refiere a la función envolvente. Este caso de uso es débil: ¡simplemente nombra la función envolvente!. Además <code>arguments.callee</code> merma el desempeño de funciones en línea pues debe ser posible proveer la referencia de la función que llamó a la función original cada vez que se usa <code>arguments.callee</code>. <code>arguments.callee</code> en modo estricto es una propiedad no eliminable y lanza una excepción cuando se le asigna un valor o se intenta regresar su valor.</p>
-
-<pre class="brush: js notranslate">'use strict';
-var f = function() { return arguments.callee; };
-f(); // lanza un TypeError
-</pre>
-
-<h3 id="sect1"></h3>
-
-<p>El modo estricto hace más fácil el escribir código "seguro" en JavaScript. Algunos sitios web ofrecen ahora medios para que los usuarios codifiquen en JavaScript para que el código corra en el sitio en <em>beneficio de otros usuarios</em>. JavaScript en los navegadores puede acceder a la información privada del usuario, por lo que dicho JavaScript se debe transformar parcialmente antes de ejecutarse, para censurar el acceso a funciones prohibidas. La flexibilidad de JavaScript hace que efectivamente sea imposible hacer esto sin muchas comprobaciones en tiempo de ejecución. La flexibilidad de JavaScript hace casi imposible hacer esto sin hacer revisiones en tiempo de ejecución. Unos pocos ajustes del modo estricto, además de requerir que el JavaScript enviado por el usuario sea código de modo estricto y que se invoque de cierta manera, reducen sustancialmente la necesidad de esas comprobaciones en tiempo de ejecución.</p>
-
-<p>Primero, el valor <code>this</code> pasado a una función en modo estricto no forzosamente debe ser un objeto (es decir, "empaquetado"). Para una función normal, <code>this</code> siempre es un objeto: o el objeto proporcionado si se llama con un <code>this</code> con valor de objeto; el valor, empaquetado, si se llama con un booleano, una cadena o un número <code>this</code>; o el objeto global si se llama con un <code>undefined</code> o <code>null</code> <code>this</code>. (Usar {{jsxref("Global_Objects/Function/call", "call")}}, {{jsxref("Global_Objects/Function/apply", "apply")}}, o {{jsxref("Global_Objects/Function/bind", "bind")}} para especificar un valor del <code>this</code> particular). Este empaquetado automático al pasar valores a una función tiene un costo en el rendimiento; no solo eso, si no que al exponer el objeto global en los navegadores es un riesgo de seguridad, debido a que el objeto global provee acceso a una funcionalidad que el código de JavaScript "seguro" debe restringir. Así, en una función en modo estricto , el valor de <code>this</code> no está empaquetado dentro de un objecto, y si no se especifica, <code>this</code> toma el valor de <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">'use strict';
-function fun() { return this; }
-console.assert(fun() === undefined);
-console.assert(fun.call(2) === 2);
-console.assert(fun.apply(null) === null);
-console.assert(fun.call(undefined) === undefined);
-console.assert(fun.bind(true)() === true);
-</pre>
-
-<p>Esto significa, entre otras cosas, que en los navegadores no es posible hacer referencia al objeto <code>window</code> a través de <code>this</code> dentro de una función en modo estricto.</p>
-
-<p>Segundo, en modo estricto ya no es posible "recorrer" la pila de JavaScript a través de extensiones de ECMAScript. En código normal con estas extensiones, cuando una función llamada <code>fun</code> está en medio de su ejecución, <code>fun.caller</code> es la función que más recientemente llamó a <code>fun</code>, y <code>fun.arguments</code> son los parámetros para esa invocación de <code>fun</code>. Ambas extensiones son problemáticas para JavaScript "seguro", debido a que permiten acceder a funciones "privilegiadas" y sus (potencialmente inseguros) argumentos. Si <code>fun</code> está en modo estricto, tanto <code>fun.caller</code> como <code>fun.arguments</code> son propiedades no eliminables que lanzan una excepción cuando se establecen o recuperan:</p>
-
-<pre class="brush: js notranslate">function restricted() {
-  'use strict';
-  restricted.caller;    // lanza un TypeError
-  restricted.arguments; // lanza un TypeError
-}
-function privilegedInvoker() {
-  return restricted();
-}
-privilegedInvoker();
-</pre>
-
-<p>Tercero, en funciones de modo estricto, el objeto <code>arguments</code> no provee acceso a las variables usadas al llamar a la función. En algunas implementaciones antiguas de ECMAScript, <code>arguments.caller</code> era un objeto cuyas propiedades apuntaban a las variables en la función. Esto es una <a href="http://stuff.mit.edu/iap/2008/facebook/">amenaza de seguridad</a> por que rompe la habilidad de ocultar valores privilegiados a través de la abstracción de la función; además, frena algunas optimizaciones. Por estas razones los navegadores modernos no la implementan. Por su funcionalidad a lo largo de los años, <code>arguments.caller</code> en una función de modo estricto es una propiedad que lanza una excepción cuando se usa.</p>
-
-<pre class="brush: js notranslate">'use strict';
-function fun(a, b) {
-  'use strict';
-  var v = 12;
-  return arguments.caller; // lanza un TypeError
-}
-fun(1, 2); // no expone v (o a o b)
-</pre>
-
-<h3 id="Preparando_el_camino_para_futuras_versiones_de_ECMAScript">Preparando el camino para futuras versiones de ECMAScript</h3>
-
-<p>Las futuras versiones de ECMAScript introducirán nuevos cambios, y el modo estricto en ECMAScript 5 aplica algunos de esos cambios para hacer una transición más suave. Será más fácil hacer cambios si las bases de esos cambios son prohibidas en modo estricto.</p>
-
-<p>Primero, en modo estricto una lista de identificadores se convierte en palabras reservadas. Estas palabras son <code>implements</code>, <code>interface</code>, <code>let</code>, <code>package</code>, <code>private</code>, <code>protected</code>, <code>public</code>, <code>static</code>, y <code>yield</code>. De modo que en modo estricto, no se pueden usar estas palabras para nombrar variables o argumentos.</p>
-
-<pre class="brush: js notranslate">function package(protected) { // !!!
-  'use strict';
-  var implements; // !!!
-
-  interface: // !!!
-  while (true) {
-    break interface; // !!!
-  }
-
-  function private() { } // !!!
-}
-function fun(static) { 'use strict'; } // !!!
-
-</pre>
-
-<p><em>Dos advertencias específicas de Mozilla</em>: Primero, si tu código esta escrito en JavaScript 1.7 o mayor (por ejemplo en código chrome o cuando se usa bien <code>&lt;script type=""&gt;</code>) y el código esta en modo estricto, <code>let</code> y <code>yield</code> tienen la funcionalidad <span id="result_box" lang="es">que han tenido desde que esas palabras clave se introdujeron por primera vez</span>. Pero el código en modo estricto en la web, cargado con <code>&lt;script src=""&gt;</code> o <code>&lt;script&gt;...&lt;/script&gt;</code>, no podrá usar <code>let</code>/<code>yield</code> como identificadores. <em>Segundo, mientras que ES5 incondicionalmente reserva las palabras <code>class</code>, <code>enum</code>, <code>export</code>, <code>extends</code>, <code>import</code> y <code>super</code>, Mozilla Firefox 5 solo las reserva en modo estricto</em>.</p>
-
-<p>En segundo lugar, <a class="external" href="http://whereswalden.com/2011/01/24/new-es5-strict-mode-requirement-function-statements-not-at-top-level-of-a-program-or-function-are-prohibited/">el modo estricto prohíbe las declaraciones de función, no en el nivel superior de un script o función</a>. En el modo normal de los navegadores, las declaraciones de función se permiten "en todas partes". <em>¡Esto no es parte de ES5 (ni siquiera de ES3)!</em> Es una extensión con semántica incompatible en diferentes navegadores. Ten en cuenta que en ES2015 se permiten declaraciones de función fuera del nivel superior.</p>
-
-<pre class="brush: js notranslate">'use strict';
-if (true) {
-  function f() { } // !!! error de sintaxis
-  f();
-}
-
-for (var i = 0; i &lt; 5; i++) {
-  function f2() { } // !!! error de sintaxis
-  f2();
-}
-
-function baz() {   // legal
-  function eit() { } // también legal
-}
-</pre>
-
-<p>Esta prohibición no es el modo estricto propiamente dicho porque tales declaraciones de función son una extensión de ES5 básico. Pero es la recomendación del comité ECMAScript y los navegadores la implementarán.</p>
-
-<h2 id="Modo_estricto_en_navegadores">Modo estricto en navegadores</h2>
-
-<p>La mayoría de los navegadores ya implementan el modo estricto. Sin embargo, no dependas ciegamente de él, ya que todavía hay numerosas <a class="external" href="http://caniuse.com/use-strict" rel="external" title="caniuse.com disponibilidad de modo estricto">Versiones del navegador utilizadas en la naturaleza que solo tienen soporte parcial para el modo estricto</a> o no lo admiten en absoluto (por ejemplo, Internet Explorer por debajo de la versión 10). <em>El modo estricto cambia la semántica</em>. Depender de esos cambios provocará equivocaciones y errores en los navegadores que no implementan el modo estricto. Ten cuidado al usar el modo estricto y respalda la dependencia del modo estricto con pruebas de funciones que comprueben si se implementan las partes relevantes del modo estricto. Finalmente, asegúrate de <em>probar tu código en navegadores que admitan y no admitan el modo estricto</em>. Si realizas tus pruebas solo en navegadores que no admiten el modo estricto, es muy probable que tengas problemas en los navegadores que sí lo hacen, y viceversa.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-strict-mode-code', 'Código en modo estricto')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a class="external" href="http://whereswalden.com/2010/09/08/new-es5-strict-mode-support-now-with-poison-pills/" title="http://whereswalden.com/2010/09/08/new-es5-strict-mode-support-now-with-poison-pills/">¿Dónde está Walden? » Nuevo soporte de modo estricto ES5: ¡ahora con píldoras venenosas!</a></li>
- <li><a class="external" href="http://whereswalden.com/2011/01/24/new-es5-strict-mode-requirement-function-statements-not-at-top-level-of-a-program-or-function-are-prohibited/" title="http://whereswalden.com/2011/01/24/new-es5-strict-mode-requirement-function-statements-not-at-top-level-of-a-program-or-function-are-prohibited/">¿Dónde está Walden? » Nuevo requisito del modo estricto de ES5: se prohíben las declaraciones de función que no estén en el nivel superior de un programa o función</a></li>
- <li><a class="external" href="http://whereswalden.com/2011/01/10/new-es5-strict-mode-support-new-vars-created-by-strict-mode-eval-code-are-local-to-that-code-only/" title="http://whereswalden.com/2011/01/10/new-es5-strict-mode-support-new-vars-created-by-strict-mode-eval-code-are-local-to-that-code-only/">¿Dónde está Walden? » Nueva compatibilidad con el modo estricto de ES5: las nuevas variables creadas por el código de evaluación del modo estricto son locales solo para ese código</a></li>
- <li><a href="http://qnimate.com/javascript-strict-mode-in-nutshell/">Tutorial de "uso estricto" de JavaScript para principiantes.</a></li>
- <li><a class="external" href="http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/" title="http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/">John Resig — Modo estricto ECMAScript 5, JSON y más</a></li>
- <li><a class="external" href="http://dmitrysoshnikov.com/ecmascript/es5-chapter-2-strict-mode/">ECMA-262-5 en detalle. Capitulo 2. Modo estricto.</a></li>
- <li><a class="external" href="http://kangax.github.io/compat-table/es5/#Strict_mode">Tabla de compatibilidad del modo estricto</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mode">Transición al modo estricto</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/aggregateerror/index.html b/files/es/web/javascript/referencia/objetos_globales/aggregateerror/index.html
deleted file mode 100644
index 524d0f9f5a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/aggregateerror/index.html
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: AggregateError
-slug: Web/JavaScript/Referencia/Objetos_globales/AggregateError
-tags:
-  - AggregateError
-  - Clase
-  - Experimental
-  - Interfaz
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Global_Objects/AggregateError
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <code><strong>AggregateError</strong></code> representa un error cuando se deben agrupar varios errores en un solo error. Se lanza cuando una operación necesita informar de varios errores, por ejemplo, {{JSxRef("Promise.any()")}}, cuando todas las promesas que se le pasan son rechazadas.</p>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{JSxRef("Global_Objects/AggregateError/AggregateError", "AggregateError()")}}</dt>
- <dd>Crea un nuevo objeto <code>AggregateError</code>.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{JSxRef("Error.prototype.message", "AggregateError.prototype.message")}}</dt>
- <dd>Mensaje de error, el valor predeterminado es <code>""</code> (la cadena vacía).</dd>
- <dt>{{JSxRef("Error.prototype.name", "AggregateError.prototype.name")}}</dt>
- <dd>Nombre del error, el valor predeterminado es <code>AggregateError</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Capturar_un_error_agregado">Capturar un error agregado</h3>
-
-<pre class="brush: js; notranslate">Promise.any([
-  Promise.reject(new Error("algún error")),
-]).catch(e =&gt; {
-  console.log(e instanceof AggregateError); // true
-  console.log(e.message);                   // "Todas las promesas rechazadas"
-  console.log(e.name);                      // "AggregateError"
-  console.log(e.errors);                    // [ Error: "algún error" ]
-});
-</pre>
-
-<h3 id="Crear_un_AggregateError">Crear un <code>AggregateError</code></h3>
-
-<pre class="brush: js; notranslate">try {
-  throw new AggregateError([
-    new Error("algún error"),
-  ], 'Hola');
-} catch (e) {
-  console.log(e instanceof AggregateError); // true
-  console.log(e.message);                   // "Hola"
-  console.log(e.name);                      // "AggregateError"
-  console.log(e.errors);                    // [ Error: "algún error" ]
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Promise.any', '#sec-aggregate-error-objects', 'AggregateError')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.AggregateError")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Error")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/@@iterator/index.html b/files/es/web/javascript/referencia/objetos_globales/array/@@iterator/index.html
deleted file mode 100644
index 65ac581204..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/@@iterator/index.html
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: 'Array.prototype[@@iterator]()'
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/@@iterator
-tags:
-  - Array
-  - ECMAScript 2015
-  - Iterator
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@iterator
----
-<div>{{JSRef}}</div>
-
-<p>El valor inicial de la propiedad <code><strong>@@iterator</strong></code> es el mismo objeto de función que el valor inicial de la propiedad {{jsxref("Array.prototype.values()", "values()")}}.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>arr</var>[Symbol.iterator]()</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El valor inicial dado por el <strong>iterador</strong> {{jsxref("Array.prototype.values()", "values()")}}. Por defecto, usar <code>arr[Symbol.iterator]</code> devolverá la función {{jsxref("Array.prototype.values()", "values()")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Iteración_usando_el_bucle_for...of">Iteración usando el bucle <code>for...of</code> </h3>
-
-<pre class="brush: js">var arr = ['w', 'y', 'k', 'o', 'p'];
-var eArr = arr[Symbol.iterator]();
-// nuestro navegador debe ser compatible con el bucle for..of
-// y variables let-scoped en bucles for
-for (let letter of eArr) {
-  console.log(letter);
-}
-</pre>
-
-<h3 id="Iteración_alternativa">Iteración alternativa</h3>
-
-<pre class="brush: js">var arr = ['w', 'y', 'k', 'o', 'p'];
-var eArr = arr[Symbol.iterator]();
-console.log(eArr.next().value); // w
-console.log(eArr.next().value); // y
-console.log(eArr.next().value); // k
-console.log(eArr.next().value); // o
-console.log(eArr.next().value); // p
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial..</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.@@iterator")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.keys()")}}</li>
- <li>{{jsxref("Array.prototype.entries()")}}</li>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Array.prototype.every()")}}</li>
- <li>{{jsxref("Array.prototype.some()")}}</li>
- <li>{{jsxref("Array.prototype.values()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/@@species/index.html b/files/es/web/javascript/referencia/objetos_globales/array/@@species/index.html
deleted file mode 100644
index 2f15ad345a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/@@species/index.html
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: 'get Array[@@species]'
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/@@species
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@species
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad de acceso <code><strong>Array[@@species]</strong></code> devuelve el constructor de <code>Array</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">Array[Symbol.species]
-</pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El constructor {{jsxref("Array")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad de acceso <code>species</code> devuelve el constructor predeterminado para objetos <code>Array</code>. Los constructores de subclase pueden anularlo para cambiar la asignación del constructor.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>La propiedad <code>species</code> devuelve la función de constructor predeterminada, que es el constructor <code>Array</code> para objetos <code>Array</code>:</p>
-
-<pre class="brush: js">Array[Symbol.species]; // function Array()</pre>
-
-<p>In a derived collection object (e.g. your custom array <code>MyArray</code>), the <code>MyArray</code> species is the <code>MyArray</code> constructor. However, you might want to overwrite this, in order to return parent <code>Array</code> objects in your derived class methods:</p>
-
-<pre class="brush: js">class MyArray extends Array {
-  // Overwrite MyArray species to the parent Array constructor
-  static get [Symbol.species]() { return Array; }
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-get-array-@@species', 'get Array [ @@species ]')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-get-array-@@species', 'get Array [ @@species ]')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.@@species")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
- <li>{{jsxref("Symbol.species")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/@@unscopables/index.html b/files/es/web/javascript/referencia/objetos_globales/array/@@unscopables/index.html
deleted file mode 100644
index 43dc771ae7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/@@unscopables/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: 'Array.prototype[@@unscopables]'
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/@@unscopables
-tags:
-  - Array
-  - JavaScript
-  - Matriz
-  - Propiedad
-  - Prototipo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad de símbolo <code><strong>@@unscopable</strong></code> contiene nombres de propiedad que no se incluyeron en el estándar ECMAScript antes de la versión ES2015. Estas propiedades se excluyen de los enlaces de declaración <code><a href="/es/docs/Web/JavaScript/Reference/Statements/with">with</a></code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>[Symbol.unscopables]</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p> </p>
-
-<p>Las propiedades de matriz predeterminadas que se excluyen de los enlaces <code>with</code> son: copyWithin, entries, fill, find, findIndex, includes, keys, y values.</p>
-
-<p>Consulte {{jsxref("Symbol.unscopables")}} para saber cómo configurar <code>unscopables</code> para sus propios objetos.</p>
-
-<p>{{js_property_attributes(0,0,1)}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente código funciona bien en ES5 y más abajo. Sin embargo, en ECMAScript 2015 y posterior, se introdujo el método {{jsxref("Array.prototype.keys()")}}. Eso significa que dentro de los entornos <code>with</code>, las "keys" ahora serían el método y no la variable. Aquí es donde entra en juego la propiedad de símbolo <code>@@unscopables</code> <code>Array.prototype[@@unscopables]</code> incorporada y evita que algunos de los métodos Array tengan un alcance en la instrucción <code>with</code>.</p>
-
-<pre class="brush: js">var keys = [];
-
-with (Array.prototype) {
-  keys.push('something');
-}
-
-Object.keys(Array.prototype[Symbol.unscopables]);
-// ["copyWithin", "entries", "fill", "find", "findIndex",
-//  "includes", "keys", "values"]</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.@@unscopables")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Symbol.unscopables")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/concat/index.html b/files/es/web/javascript/referencia/objetos_globales/array/concat/index.html
deleted file mode 100644
index dc7dfc999d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/concat/index.html
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: Array.prototype.concat()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/concat
-tags:
-  - Array
-  - JavaScript
-  - Métodos
-  - Prototipo
-  - Referencia
-  - array.concat
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/concat
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>concat()</strong></code> se usa para unir dos o más arrays. Este método no cambia los arrays existentes, sino que devuelve un nuevo array.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/array-concat.html","shorter")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var <var>nuevo_array</var> = <var>viejo_array</var>.concat(<var>valor1</var>[, <var>valor2</var>[, ...[, <var>valorN</var>]]])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor<em>N</em></code> {{optional_inline}}</dt>
- <dd>Arrays y/o valores a concatenar en el nuevo array. Ver la descripción posterior para más detalles.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<dl>
- <dd>Una nueva instancia de {{jsxref("Array")}}.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>concat</code> crea un nuevo array que consta de los elementos del objeto que lo llama, seguido, en orden de ingreso, por los elementos de cada parámetro (en caso de que el parámetro sea un array), o el parámetro mismo (en caso de que no sea un array). No se aplica de forma recursiva a parámetros con arreglos anidados.</p>
-
-<p>El método <code>concat</code> no altera <code>this</code> el array original, ni ninguno de los que fueron ingresados como parámetros, sino que devuelve una copia superficial que contiene copias de los mismos elementos de los arrays originales combinados. Los elementos de los arrays originales son copiados en el nuevo array de la siguiente manera:</p>
-
-<ul>
- <li>Referencias a Objetos (no el objeto real): <code>concat</code> copia las referencias de objetos en el nuevo array. Ambos, el array original y el nuevo refieren al mismo objeto. Es decir, si un objeto referenciado es modificado, los cambios serán visibles tanto en el array nuevo como en el antiguo.</li>
- <li>Tipo de de datos como cadenas, números y boleanos (no objetos {{jsxref("Global_Objects/String", "String")}}, {{jsxref("Global_Objects/Number", "Number")}} o {{jsxref("Global_Objects/Boolean", "Boolean")}} objects): <code>concat</code> copia los valores de los strings y numeros en el nuevo array.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota:</strong> Al concatenar arrays o valores no se modificarán los originales. Además, las operaciones en el nuevo array (excepto las operaciones en elementos que son referencias a objetos) no tendrán efecto en el array original, y viceversa.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Concatenando_dos_arrays">Concatenando dos arrays</h3>
-
-<p>En el siguiente código se concatenan dos arrays:</p>
-
-<pre class="brush: js">const letters = ['a', 'b', 'c'];
-const numbers = [1, 2, 3];
-
-letters.concat(numbers);
-// result in ['a', 'b', 'c', 1, 2, 3]
-</pre>
-
-<h3 id="Concatenando_tres_arrays">Concatenando tres arrays</h3>
-
-<p>En el siguiente código se concatenan tres arrays:</p>
-
-<pre class="brush: js">const num1 = [1, 2, 3];
-const num2 = [4, 5, 6];
-const num3 = [7, 8, 9];
-
-const numbers = num1.concat(num2, num3);
-
-console.log(numbers);
-// results in [1, 2, 3, 4, 5, 6, 7, 8, 9]
-</pre>
-
-<h3 id="Concatenando_valores_a_un_array">Concatenando valores a un array</h3>
-
-<p>En el siguiente código se concatenan tres valores a un array:</p>
-
-<pre class="brush: js">var alpha = ['a', 'b', 'c'];
-
-var alphaNumeric = alpha.concat(1, [2, 3]);
-
-console.log(alphaNumeric);
-// Da como resultado: ['a', 'b', 'c', 1, 2, 3]
-</pre>
-
-<h3 id="Concatenando_arrays_anidados">Concatenando arrays anidados</h3>
-
-<p>En el siguiente código concatena arrays anidados y demuestra retención de referencias:</p>
-
-<pre class="brush: js">var num1 = [[1]];
-var num2 = [2, [3]];
-
-var nums = num1.concat(num2);
-
-console.log(nums);
-// Da como resultado: [[1], 2, [3]]
-
-// modifica el primer elemento de num1
-num1[0].push(4);
-
-console.log(nums);
-// Da como resultado: [[1, 4], 2, [3]]</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.concat', 'Array.prototype.concat')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.concat")}}</p>
-</div>
-
-<div id="compat-mobile"></div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.push", "push")}} / {{jsxref("Array.pop", "pop")}} — añadir/eliminar elementos desde el fin del array</li>
- <li>{{jsxref("Array.unshift", "unshift")}} / {{jsxref("Array.shift", "shift")}} — añadir/eliminar elementos desde el comienzo del array</li>
- <li>{{jsxref("Array.splice", "splice")}} — añadir/eliminar elementos desde una posición específica del array</li>
- <li>{{jsxref("String.prototype.concat()")}}</li>
- <li>{{jsxref("Symbol.isConcatSpreadable")}} – controla el flattening (aplanamiento).</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/copywithin/index.html b/files/es/web/javascript/referencia/objetos_globales/array/copywithin/index.html
deleted file mode 100644
index e28b99c382..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/copywithin/index.html
+++ /dev/null
@@ -1,165 +0,0 @@
----
-title: Array.prototype.copyWithin()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/copyWithin
-tags:
-  - Array
-  - ECMAScript 2015
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/copyWithin
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>copyWithin()</strong></code> transfiere una copia  plana de una sección a otra dentro del mismo array ( o contexto similar ), sin modificar su propiedad length y lo devuelve.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-copywithin.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr.copyWithin(target)
-arr.copyWithin(target, start)
-arr.copyWithin(target, start, end)</var></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>target</code></dt>
- <dd>Índice basado en cero que establece en dónde dentro de la secuencia original se insertará la secuencia copiada.  Si es negativo, <code>target</code> se contará desde el final. -1 es el último elemento, -2 el penúltimo, etc.</dd>
- <dd>Si <code>target</code> es  igual o mayor que  <code>arr.length</code>, no se copiará nada. Si <code>target</code> es posicionado después de <code>start</code>, la secuencia copiada se recortará para que encaje con <code>arr.length</code>.</dd>
- <dt><code>start</code> {{optional_inline}}</dt>
- <dd>Índice basado en cero a partir del cual comenzar la copia de elementos. Si es negativo, start comenzará a contarse desde el final.</dd>
- <dd>Si <code>start</code> es omitido, <code>copyWithin</code> copiará desde el principio (por defecto es 0).</dd>
- <dt><code>end</code> {{optional_inline}}</dt>
- <dd>Índice basado en cero hasta el cual se copiarán los elementos. <code>copyWithin</code> copiará hasta pero sin incluir el end. Si es negativo, <code>end</code> será contado desde el final.</dd>
- <dd>Si <code>end</code> es omitido, <code>copyWithin</code> copiará hasta el final ( por defecto es <code>arr.length </code>).</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El array modificado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>copyWithin</code> es similar a la función <code>memmove</code> de C y C++  , siendo altamente eficiente para desplazar los datos en un {{jsxref("Array")}} o  {{jsxref("TypedArray")}}. La secuencia de datos es leída y escrita en una sola operación;  la escritura será correcta incluso en el caso de que la zona de lectura y el destino de escritura se solapen.</p>
-
-<p>La función <code>copyWithin</code> es intencionadamente <em>genérica</em>, permitiendo que se aplique en contextos en los cuales <code>this</code> no sea necesariamente un objeto {{jsxref("Array")}}.</p>
-
-<p>El método <code>copyWithin</code> es un método mutador. No altera la propiedad <code>length</code> de <code>this</code>, pero cambiará su contenido y creará nuevas propiedades si es necesario.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>En los siguientes ejemplos céntrate en los siguientes aspectos:</p>
-
-<ul>
- <li>El tamaño del contexto en el que se aplica no cambia. En los ejemplos el array parte con cinco elementos y siempre mantiene cinco elementos.</li>
- <li><code>start</code> y <code>end</code> trabajan juntos para decidir qué se copiará.  Siempre tienen valor por defecto aunque omitas <code>end</code>, o <code>start</code> y <code>end</code>.</li>
- <li><code>target</code> trabaja solo y debe especificarse.  Indica el lugar para en el que la copia comenzará a sobreescribir datos existentes. Debe estar dentro de los límites en el contexto que se aplique.</li>
- <li>escribir <code>arr.copyWithin( n ) </code>es lo mismo que <code>arr.copyWithin( n, 0, arr.length)</code></li>
-</ul>
-
-<pre class="brush: js">[1, 2, 3, 4, 5].copyWithin(-2);
-// [1, 2, 3, 1, 2]
-
-[1, 2, 3, 4, 5].copyWithin(0, 3);
-// [4, 5, 3, 4, 5]
-
-[1, 2, 3, 4, 5].copyWithin(0, 3, 4);
-// [4, 2, 3, 4, 5]
-
-[1, 2, 3, 4, 5].copyWithin(-2, -3, -1);
-// [1, 2, 3, 3, 4]
-</pre>
-
-<p>A continuación se aplica en el contexto de un objeto <strong>array-like</strong>:</p>
-
-<ul>
- <li>El objeto contextual tiene alguna propiedad con clave numérica, y una propiedad length. Esto es suficiente para considerarse array-like.</li>
- <li>observa que <strong>no</strong> se modifica la propiedad length, a pesar de que se ha introducido una nueva propiedad con clave 0. A esto ser refiere cuando se dice que <code>copyWithin</code> es un método <strong>mutador</strong>.  ¿Por qué se creó esta nueva propiedad?  porque mediante el argumento target se especificó que  la copia debía comenzar a partir de un índice que ¡¡no existía!!</li>
-</ul>
-
-<pre class="brush: js">[].copyWithin.call({length: 5, 3: 1}, 0, 3);
-// {0: 1, 3: 1, length: 5}
-
-</pre>
-
-<p>Lo que sigue ahora son las subclases tipadas de Array en ES6:</p>
-
-<pre class="brush: js">// Arrays tipados en ES6. Son subclases de Array
-var i32a = new Int32Array([1, 2, 3, 4, 5]);
-
-i32a.copyWithin(0, 2);
-// Int32Array [3, 4, 5, 4, 5]
-
-// En plataformas que todavía no siguen la norma ES6:
-[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4);
-// Int32Array [4, 2, 3, 4, 5]</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">if (!Array.prototype.copyWithin) {
-  Array.prototype.copyWithin =
-  // Array: Number[, Number[, Number]]
-  function copyWithin(target, start, stop) {
-    var positiveT = target &gt;= 0,
-        positiveS = (start = start | 0) &gt;= 0,
-        length    = this.length,
-        zero      = 0,
-        r         = function() {return ((+new Date) * Math.random()).toString(36)},
-        delimiter = "\b" + r() + "-" + r() + "-" + r() + "\b",
-        hold;
-
-    stop = stop || this.length;
-    hold = this.slice.apply(this,
-      positiveT?
-        [start, stop]:
-      positiveS?
-        [start, -target]:
-      [start])
-    .join(delimiter);
-
-    return this.splice.apply(this,
-      positiveT?
-        [target, stop - start, hold]:
-      positiveS?
-        [target, stop, hold]:
-      [target, start, hold]),
-            this.join(delimiter).split(delimiter).slice(zero, length);
-  }
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.copyWithin', 'Array.prototype.copyWithin')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.copyWithin', 'Array.prototype.copyWithin')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.copyWithin")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/entries/index.html b/files/es/web/javascript/referencia/objetos_globales/array/entries/index.html
deleted file mode 100644
index 89fef6475f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/entries/index.html
+++ /dev/null
@@ -1,86 +0,0 @@
----
-title: Array.prototype.entries()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/entries
-tags:
-  - Array
-  - ECMAScript 2015
-  - Iterador
-  - Iterator
-  - JavaScript
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/entries
----
-<div>{{JSRef}}</div>
-
-<div>El método <code><strong>entries()</strong></code> retorna un nuevo objeto <strong><code>Array Iterator</code></strong> que contiene los pares clave/valor para cada índice de la matriz.</div>
-
-<div> </div>
-
-<div>
-<p>{{EmbedInteractiveExample("pages/js/array-entries.html")}}</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.entries()</pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un nuevo objeto iterador {{jsxref("Array")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_un_bucle_for…of">Usando un bucle <a href="/es/docs/Web/JavaScript/Reference/Statements/for...of">for…of</a> </h3>
-
-<pre class="brush: js">var a = ['a', 'b', 'c'];
-var iterator = a.entries();
-
-for (let e of iterator) {
-  console.log(e);
-}
-// [0, 'a']
-// [1, 'b']
-// [2, 'c']</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.entries', 'Array.prototype.entries')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.entries', 'Array.prototype.entries')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.entries")}}</p>
-</div>
-
-<div id="compat-mobile"> </div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.keys()")}}</li>
- <li>{{jsxref("Array.prototype.values()")}}</li>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Array.prototype.every()")}}</li>
- <li>{{jsxref("Array.prototype.some()")}}</li>
- <li><a href="/es/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></li>
- <li><a href="/es/docs/Web/JavaScript/Reference/Iteration_protocols">Protocolos de iteración</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/every/index.html b/files/es/web/javascript/referencia/objetos_globales/array/every/index.html
deleted file mode 100644
index 540ebbdfa9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/every/index.html
+++ /dev/null
@@ -1,195 +0,0 @@
----
-title: Array.prototype.every()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/every
-tags:
-  - Arreglo
-  - ECMAScript 5
-  - JavaScript
-  - Prototipo
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/every
----
-<div>{{JSRef}}</div>
-
-<p><span class="seoSummary">Determina si todos los elementos en el array satisfacen una condición.</span></p>
-
-<div class="note">
-<p><strong>Precaución</strong>: ¡Llamar este método en un array vacío devuelve <code>true</code> para cualquier condición!</p>
-</div>
-
-<div>{{EmbedInteractiveExample("pages/js/array-every.html")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se encuentra en GitHub. Si desea contribuir con el proyecto de ejemplos interactivos, clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíenos un<em>pull</em><em> request</em>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.every(<var>callback</var>(<var>element</var>[, <var>index</var>[, <var>array</var>]])[, <var>thisArg</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Una función para probar cada elemento; recibe tres argumentos:
- <dl>
-  <dt><code>currentValue</code> (required)</dt>
-  <dd>El elemento actual del arreglo que está siendo procesado.</dd>
-  <dt><code>index</code> {{Optional_inline}}</dt>
-  <dd>El índice del elemento actual del arreglo que está siendo procesado.</dd>
-  <dt><code>array</code> {{Optional_inline}}</dt>
-  <dd>El arreglo sobre el cual fue llamado <code>every</code>.</dd>
- </dl>
- </dd>
- <dt><code>thisArg</code> {{Optional_inline}}</dt>
- <dd>Valor por usar como <code>this</code> cuando se ejecute <code>callback</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p><code>true</code> si la función de devolución de llamada devuelve un valor de {{Glossary("truthy")}} para cada elemento de matriz; de lo contrario, <code>false</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>every</code> ejecuta la función <code>callback</code> dada una vez por cada elemento presente en el arreglo hasta encontrar uno que haga retornar un valor falso a <code>callback</code> (un valor que resulte falso cuando se convierta a booleano).  Si no se encuentra tal elemento, el método <code>every</code> de inmediato retorna  <code>false</code>. O si  <code>callback</code> retorna verdadero para todos los elementos, <code>every</code> retornará <code>true</code>. <code>callback</code> es llamada sólo para índices del arreglo que tengan valores asignados; no se llama para índices que hayan sido eliminados o a los que no se les haya asignado un valor.</p>
-
-<p><code>callback</code> es llamada con tres argumetos: el valor del elemento, el índice del elemento y el objeto Array que está siendo recorrido.</p>
-
-<p>Si se proporciona un parámetro <code>thisArg</code> a <code>every</code>, será pasado a la función <code>callback</code> cuando sea llamada, usándolo como valor <code>this</code>. En otro caso, se pasará el valor <code>undefined</code> para que sea usado como valor <code>this</code>.  El valor <code>this</code> observable por parte de  <code>callback</code> se determina de acuerdo a <a href="/es/docs/Web/JavaScript/Reference/Operators/this">las normas usuales para determinar el <code>this</code> visto por una función</a>.</p>
-
-<p><code>every</code> no modifica el arreglo sobre el cual es llamado.</p>
-
-<p>El intervalo de elementos procesados por <code>every</code> se establece antes de la primera llamada a <code>callback</code>.  Los elementos que se agreguen al arreglo después de que la función <code>every</code> comience no serán vistos por la función <code>callback</code>.  Si se modifican elementos existentes en el arreglo, su valor cuando sea pasado a <code>callback</code> será el valor que tengan cuando sean visitados; los elementos que se eliminen no serán visitados.</p>
-
-<p><code>every</code> opera como el cuantificador "para todo" en matemáticas. En particular con el arreglo vacío retorna true. (es una <a href="http://en.wikipedia.org/wiki/Vacuous_truth#Vacuous_truths_in_mathematics">verdad vacua</a> que todos los elementos del <a href="http://en.wikipedia.org/wiki/Empty_set#Common_problems">conjunto vacío</a> satisfacen una condición dada.)</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Probando_el_tamaño_de_todos_los_elementos_de_un_arreglo">Probando el tamaño de todos los elementos de un arreglo</h3>
-
-<p>El siguiente ejemplo prueba si todos los elementos de un arreglo son mayores que 10.</p>
-
-<pre class="brush: js">function esSuficientementeGrande(elemento, indice, arrreglo) {
-  return elemento &gt;= 10;
-}
-[12, 5, 8, 130, 44].every(esSuficientementeGrande);   // false
-[12, 54, 18, 130, 44].every(esSuficientementeGrande); // true
-</pre>
-
-<h3 id="Usar_funciones_flecha">Usar funciones flecha</h3>
-
-<p>Las <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">funciones flecha</a> proveen una sintaxis más corta para la misma prueba.</p>
-
-<pre class="brush: js">[12, 5, 8, 130, 44].every(elem =&gt; elem &gt;= 10); // false
-[12, 54, 18, 130, 44].every(elem =&gt; elem &gt;= 10); // true</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p><code>every</code> fue añadida a la norma ECMA-262 en la 5ta edición; por lo que podría no estar presente en otras implementaciones de la norma.  Puede sobrellevarlo insertando el siguiente código al comienzo de su programa,  permitiendo el uso de <code>every</code>  en implementación que no lo soporten de manera nativa. Este algoritmo es exactamente el especificado en ECMA-262, 5ta edición, suponiendo que  <code>Object</code> y <code>TypeError</code> tienen sus valores originales y que  <code>callbackfn.call</code> evalua al valor original de {{jsxref("Function.prototype.call")}}</p>
-
-<pre class="brush: js">if (!Array.prototype.every) {
-  Array.prototype.every = function(callbackfn, thisArg) {
-    'use strict';
-    var T, k;
-
-    if (this == null) {
-      throw new TypeError('this is null or not defined');
-    }
-
-    // 1. Let O be the result of calling ToObject passing the this
-    //    value as the argument.
-    var O = Object(this);
-
-    // 2. Let lenValue be the result of calling the Get internal method
-    //    of O with the argument "length".
-    // 3. Let len be ToUint32(lenValue).
-    var len = O.length &gt;&gt;&gt; 0;
-
-    // 4. If IsCallable(callbackfn) is false, throw a TypeError exception.
-    if (typeof callbackfn !== 'function') {
-      throw new TypeError();
-    }
-
-    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
-    if (arguments.length &gt; 1) {
-      T = thisArg;
-    }
-
-    // 6. Let k be 0.
-    k = 0;
-
-    // 7. Repeat, while k &lt; len
-    while (k &lt; len) {
-
-      var kValue;
-
-      // a. Let Pk be ToString(k).
-      //   This is implicit for LHS operands of the in operator
-      // b. Let kPresent be the result of calling the HasProperty internal
-      //    method of O with argument Pk.
-      //   This step can be combined with c
-      // c. If kPresent is true, then
-      if (k in O) {
-
-        // i. Let kValue be the result of calling the Get internal method
-        //    of O with argument Pk.
-        kValue = O[k];
-
-        // ii. Let testResult be the result of calling the Call internal method
-        //     of callbackfn with T as the this value and argument list
-        //     containing kValue, k, and O.
-        var testResult = callbackfn.call(T, kValue, k, O);
-
-        // iii. If ToBoolean(testResult) is false, return false.
-        if (!testResult) {
-          return false;
-        }
-      }
-      k++;
-    }
-    return true;
-  };
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.16', 'Array.prototype.every')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.every', 'Array.prototype.every')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.every', 'Array.prototype.every')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.every")}}</p>
-</div>
-
-<div id="compat-mobile"></div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Array.prototype.some()")}}</li>
- <li>{{jsxref("TypedArray.prototype.every()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/fill/index.html b/files/es/web/javascript/referencia/objetos_globales/array/fill/index.html
deleted file mode 100644
index 7113df34bd..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/fill/index.html
+++ /dev/null
@@ -1,145 +0,0 @@
----
-title: Array.prototype.fill()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/fill
-tags:
-  - Array
-  - ECMAScript 2015
-  - JavaScript
-  - Prototipo
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/fill
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>fill()</strong></code> cambia todos los elementos en un arreglo por un valor estático, desde el índice start (por defecto 0) hasta el índice end (por defecto <code>array.length</code>). Devuelve el arreglo modificado.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-fill.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.fill(<var>value</var>[, <var>start<var> = 0[, <var>end</var> = this.length]])</var></var></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>value</code></dt>
- <dd>Valor con el que se va a rellenar el arreglo. (Nótese que todos los elementos en el arreglo tendrán este mismo valor).</dd>
- <dt><code>start</code> {{optional_inline}}</dt>
- <dd>Índice inicial, por defecto 0.</dd>
- <dt><code>end</code> {{optional_inline}}</dt>
- <dd>Índice final, por defecto <code>this.length</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El arreglo modificado, rellenado con <code>valor</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<ul>
- <li>Si <code>start</code> es negativo, se interpreta como <code>array.length + start</code>.</li>
- <li>Si <code>end</code> es negativo, se interpreta como <code>array.length + end</code>.</li>
- <li><code>fill</code> es genérico de forma intencional: no requiere que su valor <code>this</code> sea un objeto <code>Array</code>.</li>
- <li><code>fill</code> es un método mutador: modifica el arreglo sobre el que se invoca; no devuelve una copia de éste.</li>
- <li>Si el primer parámetro es un objeto, copia su referencia y rellena el arreglo con referencias a dicho objeto.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">[1, 2, 3].fill(4);               // [4, 4, 4]
-[1, 2, 3].fill(4, 1);            // [1, 4, 4]
-[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
-[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
-[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
-[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
-[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
-[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
-Array(3).fill(4);                // [4, 4, 4]
-[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}
-
-// Objects by reference.
-var arr = Array(3).fill({}) // [{}, {}, {}];
-arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">if (!Array.prototype.fill) {
-  Object.defineProperty(Array.prototype, 'fill', {
-    value: function(value) {
-
-      // Pasos 1-2.
-      if (this == null) {
-        throw new TypeError('esto es nulo o no definido');
-      }
-
-      var O = Object(this);
-
-      // Pasos 3-5.
-      var len = O.length &gt;&gt;&gt; 0;
-
-      // Pasos 6-7.
-      var start = arguments[1];
-      var relativeStart = start &gt;&gt; 0;
-
-      // Paso 8.
-      var k = relativeStart &lt; 0 ?
-        Math.max(len + relativeStart, 0) :
-        Math.min(relativeStart, len);
-
-      // Pasos 9-10.
-      var end = arguments[2];
-      var relativeEnd = end === undefined ?
-        len : end &gt;&gt; 0;
-
-      // Paso 11.
-      var final = relativeEnd &lt; 0 ?
-        Math.max(len + relativeEnd, 0) :
-        Math.min(relativeEnd, len);
-
-      // Paso 12.
-      while (k &lt; final) {
-        O[k] = value;
-        k++;
-      }
-
-      // Paso 13.
-      return O;
-    }
-  });
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.fill', 'Array.prototype.fill')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.fill', 'Array.prototype.fill')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.fill")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
- <li>{{jsxref("TypedArray.prototype.fill()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/filter/index.html b/files/es/web/javascript/referencia/objetos_globales/array/filter/index.html
deleted file mode 100644
index 98e6843c4f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/filter/index.html
+++ /dev/null
@@ -1,231 +0,0 @@
----
-title: Array.prototype.filter()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/filter
-tags:
-  - Array
-  - ECMAScript 5
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/filter
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>filter()</strong></code> crea un nuevo array con todos los elementos que cumplan la condición implementada por la función dada.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-filter.html")}}</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="notranslate"><var>var newArray = arr</var>.filter(<var>callback(currentValue[, index[, array]])</var>[, <var>thisArg</var>])</pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función que <strong>comprueba cada elemento </strong>del array para ver si cumple la condición (también llamada predicado).  Retorna <code>true</code> si el elemento la cumple o en caso contrario retornará <code>false</code>. Acepta tres parámetros:</dd>
- <dd>
- <dl>
-  <dt><code>currentValue</code></dt>
-  <dd>El elemento actual del array que está siendo procesado.</dd>
-  <dt><code>index</code> {{optional_inline}}</dt>
-  <dd>El índice del elemento actual del array que está siendo procesado.</dd>
-  <dt><code>array</code> {{optional_inline}}</dt>
-  <dd>El array sobre el que se ha llamado <code>filter</code>.</dd>
- </dl>
- </dd>
- <dt><code>thisArg</code> {{optional_inline}}</dt>
- <dd>Opcional. Valor a utilizar como <code>this</code> cuando se ejecuta <code>callback</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un nuevo array con los elementos que cumplen la condición. Si ningún elemento cumple la condición, se devolverá un array vacío.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p><code>filter()</code> llama a la función <code>callback</code>  sobre cada elemento del array, y construye un nuevo array con todos los valores para los cuales  <code>callback</code> devuelve un valor verdadero. <code>callback</code> es invocada sólo para índices del array que tengan un valor asignado. No se invoca sobre índices que hayan sido borrados o a los que no se les haya asignado algún valor. Los elementos del array que no cumplan la condición <code>callback</code>  simplemente los salta, y no son incluidos en el nuevo array.</p>
-
-<p><code>callback</code> se invoca con tres argumentos:</p>
-
-<ol>
- <li>El valor de cada elemento</li>
- <li>El índice del elemento</li>
- <li>El objeto Array que se está recorriendo</li>
-</ol>
-
-<p>Si se proporciona un parámetro <code>thisArg</code> a <code>filter()</code>, este será pasado a <code>callback</code> cuando sea invocado, para usarlo como valor <code>this</code>.  De lo contrario, se pasará el valor <code>undefined</code> como valor <code>this</code>.  El valor <code>this</code> dentro del <code>callback</code> se determina conforme a las <a href="/es/docs/Web/JavaScript/Reference/Operators/this">las normas habituales para determinar el <em>this </em>visto por una función.</a></p>
-
-<p><code>filter()</code> no hace mutar el array sobre el cual es llamado.</p>
-
-<p>El rango de elementos procesados por <code>filter()</code> se establece antes de la primera invocación de  <code>callback</code>. Los elementos que se añadan al array después de que comience la llamada a <code>filter()</code> no serán visitados por <code>callback</code>. Si se modifica o elimina un elemento existente del array, cuando pase su valor a <code>callback</code> será el que tenga cuando <code>filter()</code> lo recorra; los elementos que son eliminados no son recorridos.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example_Filtering_out_all_small_values" name="Example:_Filtering_out_all_small_values">Filtrando todos los valores pequeños</h3>
-
-<p>El siguiente ejemplo usa <code>filter()</code> para crear un array filtrado que excluye todos los elementos con valores inferiores a 10.</p>
-
-<pre class="brush: js notranslate">function esSuficientementeGrande(elemento) {
-  return elemento &gt;= 10;
-}
-var filtrados = [12, 5, 8, 130, 44].filter(esSuficientementeGrande);
-// filtrados es [12, 130, 44]
-</pre>
-
-<h3 id="Filtrando_entradas_inválidas_desde_un_JSON">Filtrando entradas inválidas desde un JSON</h3>
-
-<p>El siguiente ejemplo emplea <code>filter()</code> para crear un json filtrado con todos lo elementos que tengan id numérico distinto de cero.</p>
-
-<pre class="brush: js notranslate">var arr = [
-  { id: 15 },
-  { id: -1 },
-  { id: 0 },
-  { id: 3 },
-  { id: 12.2 },
-  { },
-  { id: null },
-  { id: NaN },
-  { id: 'undefined' }
-];
-
-var entradasInvalidas = 0;
-// Si el elemento tiene un atributo id, y su valor correspondiente es un numero
-// Y no es el valor NaN, entonces es una entrada válida
-function filtrarPorID(obj) {
-  if ('id' in obj &amp;&amp; typeof(obj.id) === 'number' &amp;&amp; !isNaN(obj.id)) {
-    return true;
-  } else {
-    entradasInvalidas++;
-    return false;
-  }
-}
-
-var arrPorID = arr.filter(filtrarPorID);
-
-console.log('Array Filtrado\n', arrPorID);
-// [{ id: 15 }, { id: -1 }, { id: 0 }, { id: 3 }, { id: 12.2 }]
-
-console.log('Número de Entradas Invalidas = ', entradasInvalidas);
-// 4</pre>
-
-<h3 id="Búsqueda_en_el_arreglo">Búsqueda en el arreglo</h3>
-
-<p>El siguiente ejemplo emplea filter() para filtrar el contendio de un arreglo en función de un criterio de búsqueda.</p>
-
-<pre class="brush: js notranslate">var fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
-
-/**
- * Filtra la matríz en función de un criterio de búsqueda (query)
- */
-function filterItems(query) {
-  return fruits.filter(function(el) {
-      return el.toLowerCase().indexOf(query.toLowerCase()) &gt; -1;
-  })
-}
-
-console.log(filterItems('ap')); // ['apple', 'grapes']
-console.log(filterItems('an')); // ['banana', 'mango', 'orange']</pre>
-
-<h3 id="Implementación_en_ES2015">Implementación en ES2015</h3>
-
-<pre class="brush: js notranslate">const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
-
-/**
- * Filtra la matríz en función de un criterio de búsqueda (query)
- */
-const filterItems = query =&gt; {
-  return fruits.filter((el) =&gt;
-    el.toLowerCase().indexOf(query.toLowerCase()) &gt; -1
-  );
-}
-
-console.log(filterItems('ap')); // ['apple', 'grapes']
-console.log(filterItems('an')); // ['banana', 'mango', 'orange']</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p><code>filter()</code> se añadió a la norma ECMA-262 en la 5ta edición; como tal puede no estar presente en todas las implementaciones de la norma. Puedes sobrellevarlo insertando el siguiente código al comienzo de su programa, para permitir el uso de <code>filter()</code> en implementaciones de ECMA-262 que no lo soporten de forma nativa. Este algoritmo es exactamente el especificado en ECMA-262, 5ta edición, supone que  <code>fn.call</code> evalua al valor original de {{jsxref("Function.prototype.call")}}, y que {{jsxref("Array.prototype.push")}} tiene su valor original.</p>
-
-<pre class="notranslate">if (!Array.prototype.filter){
-  Array.prototype.filter = function(func, thisArg) {
-    'use strict';
-    if ( ! ((typeof func === 'Function' || typeof func === 'function') &amp;&amp; this) )
-        throw new TypeError();
-
-    var len = this.length &gt;&gt;&gt; 0,
-        res = new Array(len), // preallocate array
-        t = this, c = 0, i = -1;
-
-    var kValue;
-    if (thisArg === undefined){
-      while (++i !== len){
-        // checks to see if the key was set
-        if (i in this){
-          kValue = t[i]; // in case t is changed in callback
-          if (func(t[i], i, t)){
-            res[c++] = kValue;
-          }
-        }
-      }
-    }
-    else{
-      while (++i !== len){
-        // checks to see if the key was set
-        if (i in this){
-          kValue = t[i];
-          if (func.call(thisArg, t[i], i, t)){
-            res[c++] = kValue;
-          }
-        }
-      }
-    }
-
-    res.length = c; // shrink down array to proper size
-    return res;
-  };
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.20', 'Array.prototype.filter')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición Inicial. Implementado en JavaScript 1.6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.filter', 'Array.prototype.filter')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.filter', 'Array.prototype.filter')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.filter")}}</p>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Array.prototype.every()")}}</li>
- <li>{{jsxref("Array.prototype.some()")}}</li>
- <li>{{jsxref("Array.prototype.reduce()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/find/index.html b/files/es/web/javascript/referencia/objetos_globales/array/find/index.html
deleted file mode 100644
index 7de7850cca..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/find/index.html
+++ /dev/null
@@ -1,233 +0,0 @@
----
-title: Array.prototype.find()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/find
-tags:
-  - Array
-  - ECMAScript 2015
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/find
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>find()</strong></code> devuelve el <strong>valor</strong> del <strong>primer elemento</strong> del array que cumple la función de prueba proporcionada.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/array-find.html","shorter")}}</div>
-
-
-
-<ul>
- <li>Si necesitas el <strong>índice</strong> del elemento encontrado en el array, utiliza {{jsxref("Array.findIndex", "findIndex()")}}.</li>
- <li>Si necesitas encontrar el <strong>índice de un elemento</strong>, {{jsxref("Array.prototype.indexOf()")}}. (Es similar a {{jsxref("Array.findIndex", "findIndex()")}}, pero comprueba la igualdad de cada elemento con el valor en lugar de usar una función de prueba.)</li>
- <li>Si necesitas encontrar si un valor <strong>existe</strong> en un array, utiliza {{jsxref("Array.prototype.includes()")}}.</li>
- <li>Si necesitas encontrar si algún elemento cumple la función de prueba proporcionada, usa {{jsxref("Array.prototype.some()")}}.</li>
-</ul>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.find(<var>callback(element[, index[, array]])</var>[, <var>thisArg</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función que se ejecuta sobre cada valor en el array, tomando tres argumentos:
- <dl>
-  <dt><code>element</code></dt>
-  <dd>El elemento actual que se está procesando en el array.</dd>
-  <dt><code>index</code> {{optional_inline}}</dt>
-  <dd>El índice (posición) del elemento actual que se está procesando en el array.</dd>
-  <dt><code>array</code> {{optional_inline}}</dt>
-  <dd>El array desde el que se llama al método <code>find</code>.</dd>
- </dl>
- </dd>
- <dt><code>thisArg</code> {{optional_inline}}</dt>
- <dd>Objeto a usar como <code><a href="/es/docs/Web/JavaScript/Referencia/Operadores/this">this</a></code> cuando se ejecuta <code>callback</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El <strong>valor</strong> del <strong>primer elemento</strong> del array que cumple la función de prueba proporcionada; de lo contrario, devuelve {{jsxref("undefined")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>find</code> ejecuta la función <code>callback</code> una vez por cada índice del array hasta que encuentre uno en el que el <code>callback</code> devuelva un valor <a href="/es/docs/Glossary/Truthy">verdadero</a>. Si es así, <code>find</code> devuelve inmediatamente el valor del elemento. En caso contrario, <code>find</code> devuelve {{jsxref("undefined")}}.</p>
-
-<p><code>callback</code> se invoca con tres argumentos: el valor del elemento, el índice del elemento y el objeto <code>Array</code> que está siendo recorrido.</p>
-
-<p>Si un parámetro <code>thisArg</code> es proporcionado al método <code>find</code>, este será utilizado como <code>this</code> para cada invocación del callback. Si no se proporciona el parámetro, entonces se utiliza {{jsxref("undefined")}}.</p>
-
-<p>El método <code>find</code> no transforma el array desde el cual es llamado, pero la función proporcionada en <code>callback</code> sí. En ese caso, los elementos procesados por <code>find</code> son establecidos <em>antes</em> de la primera invocación de <code>callback</code>. Por lo tanto:</p>
-
-<ul>
- <li><code>callback</code> no visitará ningún elemento añadido al array después de que comience la llamada a <code>find</code>.</li>
- <li>Si un elemento existente no visitado del array es modificado por <code>callback</code>, su valor que se pasa al <code>callback</code> que lo visita será el valor en el momento en que <code>find</code> visita ese índice del elemento.</li>
- <li>Los elementos que sean {{jsxref("delete", "deleted")}} (eliminados) aún se visitan.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Encontrar_un_objeto_en_un_array_por_una_de_sus_propiedades">Encontrar un objeto en un array por una de sus propiedades</h3>
-
-<pre class="brush: js">const inventario = [
-    {nombre: 'manzanas', cantidad: 2},
-    {nombre: 'bananas', cantidad: 0},
-    {nombre: 'cerezas', cantidad: 5}
-];
-
-function esCereza(fruta) {
-    return fruta.nombre === 'cerezas';
-}
-
-console.log(inventario.find(esCereza));
-// { nombre: 'cerezas', cantidad: 5 }</pre>
-
-<h4 id="Utilizando_funciones_flecha_y_destructuring">Utilizando funciones flecha y destructuring</h4>
-
-<pre class="brush: js">const inventario = [
-    {nombre: 'manzanas', cantidad: 2},
-    {nombre: 'bananas', cantidad: 0},
-    {nombre: 'cerezas', cantidad: 5}
-];
-
-const resultado = inventario.find( fruta =&gt; fruta.nombre === 'cerezas' );
-
-console.log(resultado); // { nombre: 'cerezas', cantidad: 5 }</pre>
-
-<h3 id="Encontrar_un_número_primo_en_un_array">Encontrar un número primo en un array</h3>
-
-<p>El siguiente ejemplo encuentra un elemento en un array que sea un número primo (o devuelve {{jsxref("undefined")}} si no hay un número primo).</p>
-
-<pre class="brush: js">function isPrime(element, index, array) {
-  let start = 2;
-  while (start &lt;= Math.sqrt(element)) {
-    if (element % start++ &lt; 1) {
-      return false;
-    }
-  }
-  return element &gt; 1;
-}
-
-console.log([4, 6, 8, 12].find(isPrime)); // undefined, no encontrado
-console.log([4, 5, 8, 12].find(isPrime)); // 5
-</pre>
-
-<p>Los siguientes ejemplos muestran cómo elementos no existentes o eliminados son visitados y el valor pasado a <code>callback</code> es su valor cuando son visitados.</p>
-
-<pre class="brush: js">// Declarar un array sin elementos en los índices 2, 3 y 4
-const array = [0,1,,,,5,6];
-
-// Muestra todos los índices, no sólo aquellos que tienen valores asignados
-array.find(function(value, index) {
-  console.log('Visited index ' + index + ' with value ' + value);
-});
-
-// Mostrar todos los índices, incluyendo los eliminados
-array.find(function(value, index) {
-
-  // Eliminar el elemento 5 en la primera iteración
-  if (index == 0) {
-    console.log('Deleting array[5] with value ' + array[5]);
-    delete array[5];
-  }
-  // El elemento 5 se visita aun habiendo sido eliminado
-  console.log('Visited index ' + index + ' with value ' + value);
-});
-// expected output:
-// Deleting array[5] with value 5
-// Visited index 0 with value 0
-// Visited index 1 with value 1
-// Visited index 2 with value undefined
-// Visited index 3 with value undefined
-// Visited index 4 with value undefined
-// Visited index 5 with value undefined
-// Visited index 6 with value 6
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este método ha sido añadido a la espeficicación ECMAScript 2015 y puede no estar disponible en todas las implementaciones de JavaScript aún. Sin embargo, puedes utilizar el siguiente polyfill de <code>Array.prototype.find</code>:</p>
-
-<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.find
-if (!Array.prototype.find) {
-  Object.defineProperty(Array.prototype, 'find', {
-    value: function(predicate) {
-     // 1. Let O be ? ToObject(this value).
-      if (this == null) {
-        throw new TypeError('"this" is null or not defined');
-      }
-
-      var o = Object(this);
-
-      // 2. Let len be ? ToLength(? Get(O, "length")).
-      var len = o.length &gt;&gt;&gt; 0;
-
-      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
-      if (typeof predicate !== 'function') {
-        throw new TypeError('predicate must be a function');
-      }
-
-      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
-      var thisArg = arguments[1];
-
-      // 5. Let k be 0.
-      var k = 0;
-
-      // 6. Repeat, while k &lt; len
-      while (k &lt; len) {
-        // a. Let Pk be ! ToString(k).
-        // b. Let kValue be ? Get(O, Pk).
-        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
-        // d. If testResult is true, return kValue.
-        var kValue = o[k];
-        if (predicate.call(thisArg, kValue, k, o)) {
-          return kValue;
-        }
-        // e. Increase k by 1.
-        k++;
-      }
-
-      // 7. Return undefined.
-      return undefined;
-    },
-    configurable: true,
-    writable: true
-  });
-}
-</pre>
-
-<p>Si necesitas dar soporte a motores de JavaScript realmente obsoletos que no soportan <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, es mejor no utilizar el polyfill para los métodos <code>Array.prototype</code>, ya que no podrás hacerlos no enumerables.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.find', 'Array.prototype.find')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.find")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.findIndex()")}} – encuentra y devuelve un índice</li>
- <li>{{jsxref("Array.prototype.includes()")}} – comprueba que un valor existe en el array</li>
- <li>{{jsxref("Array.prototype.filter()")}} – elimina todos los elementos que no coincidan</li>
- <li>{{jsxref("Array.prototype.every()")}} – comprueba todos los elementos</li>
- <li>{{jsxref("Array.prototype.some()")}} – comprueba hasta que un elemento coincide</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/findindex/index.html b/files/es/web/javascript/referencia/objetos_globales/array/findindex/index.html
deleted file mode 100644
index c249a3b2df..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/findindex/index.html
+++ /dev/null
@@ -1,187 +0,0 @@
----
-title: Array.prototype.findIndex()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/findIndex
-tags:
-  - Array
-  - ECMAScript 2015
-  - JavaScript
-  - Protitipo
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/findIndex
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>findIndex()</strong></code> devuelve el <strong>índice</strong> del <strong>primer elemento</strong> de un array que cumpla con la función de prueba proporcionada. En caso contrario devuelve -1.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/array-findindex.html","shorter")}}</div>
-
-<p>Vea también el método {{jsxref("Array.find", "find()")}}, que devuelve el <strong>valor </strong>de un elemento encontrado en el array en lugar de su índice.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.findIndex(<var>callback</var>( <var>element</var>[, <var>index</var>[, <var>array</var>]] )[, <var>thisArg</var>])
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>callback</var></code></dt>
- <dd>
- <p>Función a ejecutar en cada uno de los valores del array hasta que devuelve <code>true</code>, indicando que el elemento que la cumple fue encontrado.</p>
-
- <p>Recibe tres argumentos:</p>
-
- <dl>
-  <dt><code><var>element</var></code></dt>
-  <dd>El elemento actual siendo procesado en el array.</dd>
-  <dt><code><var>index</var></code> {{optional_inline}}</dt>
-  <dd>El índice del elemento actual que está siendo procesado en el array.</dd>
-  <dt><code><var>array</var></code> {{optional_inline}}</dt>
-  <dd>El array <code>findIndex()</code> de donde fue llamado.</dd>
- </dl>
- </dd>
- <dt><code><var>thisArg</var></code> {{optional_inline}}</dt>
- <dd>Objeto opcional para usar como <code>this</code> cuando se ejecuta el <code><var>callback</var></code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un índice en el array si un elemento pasa la prueba; en caso contrario, <code>-1</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>findIndex()</code> ejecuta la función de <em><code>callback</code></em> una vez por cada índice del array hasta que encuentre uno donde <em><code>callback</code></em> devuelva un valor verdadero (eso es, un valor que <a href="/en-US/docs/Glossary/Type_Conversion">fuerza</a> un <code>true</code>).</p>
-
-<p>Si dicho elemento es encontrado, <code>findIndex()</code> inmediatamente devuelve el índice del elemento. Si la función <em><code>callback</code></em> nunca devuelve un valor verdadero (o el tamaño del array es 0), <code>findIndex</code> devuelve <code>-1</code>.</p>
-
-<div class="blockIndicator note">
-<p><strong>Alerta de Edge Case:</strong> A diferencia de otros métodos de arrays como {{jsxref("Array.some()")}}, <code><var>callback</var></code> se ejecuta incluso en índices sin valores asignados.</p>
-</div>
-
-<p><em><code>callback</code></em> se invoca con tres argumentos:</p>
-
-<ol>
- <li>El valor del elemento</li>
- <li>El índice del elemento</li>
- <li>El Array que será recorrido.</li>
-</ol>
-
-<p>Si el parámetro <code>thisArg</code> es provisto a findIndex, entonces será usado como el this para cada invocación del <code>callback</code>. Si no es provisto, entonces {{jsxref("undefined")}} será utilizado. </p>
-
-<p>El rango de elementos procesados por <code>findIndex()</code> se establece antes de la primera invocación de la función <em><code>callback</code></em>. Los elementos añadidos al array después de que la llamada a <code>findIndex()</code> comience no serán visitados por el <code>callback</code>. Si un elemento existente que no ha sido visitado en el array es modificado por el <em><code>callback</code></em>, el valor pasado al <em><code>callback</code></em> que lo visite será el valor en el momento en que <code>findIndex()</code> visite el índice del elemento.</p>
-
-<p>Los elementos <a href="/es/docs/Web/JavaScript/Referencia/Operadores/delete">eliminados</a> aún son visitados.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Encontrar_el_índice_de_un_número_primo_en_un_array">Encontrar el índice de un número primo en un array</h3>
-
-<p>El siguiente ejemplo encuentra el índice de un elemento en el array que sea número primo (o devuelve <code>-1</code> si no hay ningún número primo).</p>
-
-<pre class="brush: js">function isPrime(element, index, array) {
-  var start = 2;
-  while (start &lt;= Math.sqrt(element)) {
-    if (element % start &lt; 1) {
-      return false;
-    } else {
-      start++;
-    }
-  }
-  return element &gt; 1;
-}
-
-console.log([4, 6, 8, 12].findIndex(isPrime)); // -1, no encontrado
-console.log([4, 6, 7, 12].findIndex(isPrime)); // 2
-</pre>
-
-<h3 id="Encontrar_un_índice_utilizando_funciones_flecha">Encontrar un índice utilizando funciones flecha</h3>
-
-<p>El siguiente ejemplo encuentra el índice de una fruta utilizando funciones flecha.</p>
-
-<pre class="brush: js">const fruits = ["apple", "banana", "cantaloupe", "blueberries", "grapefruit"];
-
-const index = fruits.findIndex(fruit =&gt; fruit === "blueberries");
-
-console.log(index); // 3
-console.log(fruits[index]); // blueberries
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.findIndex
-if (!Array.prototype.findIndex) {
-  Object.defineProperty(Array.prototype, 'findIndex', {
-    value: function(predicate) {
-     // 1. Let O be ? ToObject(this value).
-      if (this == null) {
-        throw new TypeError('"this" is null or not defined');
-      }
-
-      var o = Object(this);
-
-      // 2. Let len be ? ToLength(? Get(O, "length")).
-      var len = o.length &gt;&gt;&gt; 0;
-
-      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
-      if (typeof predicate !== 'function') {
-        throw new TypeError('predicate must be a function');
-      }
-
-      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
-      var thisArg = arguments[1];
-
-      // 5. Let k be 0.
-      var k = 0;
-
-      // 6. Repeat, while k &lt; len
-      while (k &lt; len) {
-        // a. Let Pk be ! ToString(k).
-        // b. Let kValue be ? Get(O, Pk).
-        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
-        // d. If testResult is true, return k.
-        var kValue = o[k];
-        if (predicate.call(thisArg, kValue, k, o)) {
-          return k;
-        }
-        // e. Increase k by 1.
-        k++;
-      }
-
-      // 7. Return -1.
-      return -1;
-    },
-    configurable: true,
-    writable: true
-  });
-}
-</pre>
-
-<p>Si necesita soporte para motores de JavaScript obsoletos que no soportan <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/defineProperty">Object.defineProperty</a></code> es mejor no emplear polyfills para métodos <code>Array.prototype</code>, ya que no puede hacerlos no-enumerables.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.findindex', 'Array.prototype.findIndex')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.findIndex")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.find()")}}</li>
- <li>{{jsxref("Array.prototype.indexOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/flat/index.html b/files/es/web/javascript/referencia/objetos_globales/array/flat/index.html
deleted file mode 100644
index 67d1b3a4c7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/flat/index.html
+++ /dev/null
@@ -1,174 +0,0 @@
----
-title: Array.prototype.flat()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/flat
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/flat
----
-<div>{{JSRef}} {{SeeCompatTable}}</div>
-
-<p>El método <code><strong>flat()</strong></code> crea una nueva matriz con todos los elementos de sub-array concatenados recursivamente hasta la profundidad especificada.</p>
-
-<p class="hidden">\{{EmbedInteractiveExample("pages/js/array-flat.html")}}</p>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>var newArray = arr</var>.flat(<var>[depth]</var>);</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>depth</code> {{optional_inline}}</dt>
- <dd>El nivel de profundidad que especifica qué tan profunda debe aplanarse una estructura de matriz anidada. El valor predeterminado es 1.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una nueva matriz con los elementos de la sub-matriz concatenados en ella.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Aplanar_matrices_anidadas">Aplanar matrices anidadas</h3>
-
-<pre class="brush: js">var arr1 = [1, 2, [3, 4]];
-arr1.flat();
-// [1, 2, 3, 4]
-
-var arr2 = [1, 2, [3, 4, [5, 6]]];
-arr2.flat();
-// [1, 2, 3, 4, [5, 6]]
-
-var arr3 = [1, 2, [3, 4, [5, 6]]];
-arr3.flat(2);
-// [1, 2, 3, 4, 5, 6]
-</pre>
-
-<h3 id="Aplanamiento_y_huecos_de_matriz">Aplanamiento y huecos de matriz</h3>
-
-<p>El método de aplanar elimina las ranuras vacías en las matrices:</p>
-
-<pre class="brush: js">var arr4 = [1, 2, , 4, 5];
-arr4.flat();
-// [1, 2, 4, 5]
-</pre>
-
-<h2 id="Alternativa">Alternativa</h2>
-
-<h3 id="reduce_y_concat"><code>reduce</code> y <code>concat</code></h3>
-
-<pre class="brush: js">var arr1 = [1, 2, [3, 4]];
-arr1.flat();
-
-//aplanar una matriz de nivel único
-arr1.reduce((acc, val) =&gt; acc.concat(val), []);// [1, 2, 3, 4]
-
-//o
-const flatSingle = arr =&gt; [].concat(...arr);
-</pre>
-
-<p> </p>
-
-<pre class="brush: js">//para permitir el aplanamiento a nivel profundo use recursión con reduce y concat
-var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
-
-function flattenDeep(arr1) {
-   return arr1.reduce((acc, val) =&gt; Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
-}
-flattenDeep(arr1); // [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]
-</pre>
-
-<p> </p>
-
-<pre class="brush: js">//aplanamiento profundo no recursivo usando un stack
-var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
-function flatten(input) {
-  const stack = [...input];
-  const res = [];
-  while (stack.length) {
-    // elimina ultimo valor del stack
-    const next = stack.pop();
-    if (Array.isArray(next)) {
-      // agrega de nuevo los items al array, sin modificar la entrada original
-      stack.push(...next);
-    } else {
-      res.push(next);
-    }
-  }
-  //invierte para restaurar el orden de entrada
-  return res.reverse();
-}
-flatten(arr1);// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]</pre>
-
-<p> </p>
-
-<pre class="brush: js">//Aplanamiento profundo recursivo
-function flatten(array) {
-  var flattend = [];
-  !(function flat(array) {
-    array.forEach(function(el) {
-      if (Array.isArray(el)) flat(el);
-      else flattend.push(el);
-    });
-  })(array);
-  return flattend;
-}</pre>
-
-<p> </p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">if (!Array.prototype.flat) {
-  Array.prototype.flat = function(depth) {
-    var flattend = [];
-    (function flat(array, depth) {
-      for (let el of array) {
-        if (Array.isArray(el) &amp;&amp; depth &gt; 0) {
-          flat(el, depth - 1);
-        } else {
-          flattend.push(el);
-        }
-      }
-    })(this, Math.floor(depth) || 1);
-    return flattend;
-  };
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td><a href="https://tc39.github.io/proposal-flatMap/#sec-Array.prototype.flat"><code>Array.prototype.flat</code> proposal</a></td>
-   <td>Finalizado (4)</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.flat")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.flatMap()")}}</li>
- <li>{{jsxref("Array.prototype.map()")}}</li>
- <li>{{jsxref("Array.prototype.reduce()")}}</li>
- <li>{{jsxref("Array.prototype.concat()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/flatmap/index.html b/files/es/web/javascript/referencia/objetos_globales/array/flatmap/index.html
deleted file mode 100644
index 0a93f97675..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/flatmap/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: Array.prototype.flatMap()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/flatMap
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/flatMap
----
-<div>{{JSRef}} {{SeeCompatTable}}</div>
-
-<p>El método <code><strong>flatMap()</strong></code> primero mapea cada elemento usando una función de mapeo, luego aplana el resultado en una nueva matriz. Es idéntico a un <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a> seguido de un <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/flatten">flatten </a>de profundidad 1, pero <code>flatMap</code> es a menudo útil y la fusión de ambos en un método es ligeramente más eficiente.</p>
-
-<p class="hidden">\{{EmbedInteractiveExample("pages/js/array-flatmap.html")}}</p>
-
-<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo, se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone </span></span><a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a><span class="tlid-translation translation" lang="es"><span title=""> y envíenos una solicitud de extracción.</span></span></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>var new_array = arr</var>.flatMap(function <var>callback(currentValue[, index[, array]]) {
-    // return element for new_array
-}</var>[, <var>thisArg</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función que produce un elemento de la nueva matriz, tomando tres argumentos:
- <dl>
-  <dt></dt>
-  <dt><code>currentValue</code></dt>
-  <dd>El elemento actual que se procesa en la matriz.</dd>
-  <dt><code>index</code>{{optional_inline}}</dt>
-  <dd>El índice del elemento actual que se procesa en la matriz.</dd>
-  <dt><code>array</code>{{optional_inline}}</dt>
-  <dd>La matriz <code>map</code> fue llamada.</dd>
- </dl>
- </dd>
- <dt><code>thisArg</code>{{optional_inline}}</dt>
- <dd>Valor para usar como <code>this</code> al ejecutar <code>callback</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una nueva matriz con cada elemento es el resultado de la función de devolución de llamada y se aplana a una profundidad de 1.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Ver {{jsxref("Array.prototype.map()")}} para una descripción detallada de la función de devolución de llamada. El método <code>flatMap</code> es idéntico a <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a></code> seguido de una llamada a <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array/flatten">flatten</a></code> de profundidad 1.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="map_y_flatMap"><code>map</code> y <code>flatMap</code></h3>
-
-<pre class="brush: js">var arr1 = <span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>[</span></span><span class="constant decimal js numeric"><span>1</span></span><span class="comma delimiter js meta object"><span>,</span></span><span> </span><span class="brace js meta square"><span>2, 3, 4];
-
-arr1.map(</span></span></span></span></span>x =&gt; [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>);</span></span></span></span></span>
-// [[2], [4], [6], [8]]
-
-arr1.flatMap(x =&gt; [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>);
-// [2, 4, 6, 8]</span></span></span></span></span>
-
-// solo un nivel es aplanado
-arr1.flatMap(x =&gt; [[x * 2]]);
-// [[2], [4], [6], [8]]
-</pre>
-
-<div class="line"><span class="js source"><span class="comment double-slash js line"><span class="comment definition js punctuation"><span>//</span></span><span>=&gt; [1, 2, 3, 4, 5, 6, 7, 8, 9]</span></span></span></div>
-
-<h2 id="Alternativa">Alternativa</h2>
-
-<h3 id="reduce_y_concat"><code>reduce</code> y <code>concat</code></h3>
-
-<pre class="brush: js">var arr1 = <span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>[</span></span><span class="constant decimal js numeric"><span>1</span></span><span class="comma delimiter js meta object"><span>,</span></span><span> </span><span class="brace js meta square"><span>2, 3, 4];
-</span></span></span></span></span>
-arr1.flatMap(x =&gt; [x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>);</span></span></span></span></span>
-// es equivalente a
-arr1.reduce((acc, x) =&gt; acc.concat([x * 2]<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>), []);</span></span></span></span></span>
-<span class="js source"><span class="function-call js meta"><span class="js meta"><span class="brace js meta square"><span>// [2, 4, 6, 8]</span></span></span></span></span>
-</pre>
-
-<div class="line"><span class="js source"><span class="comment double-slash js line"><span class="comment definition js punctuation"><span>//</span></span><span>=&gt; [1, 2, 3, 4, 5, 6, 7, 8, 9]</span></span></span></div>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este polyfill necesita <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat" title="Array.prototype.flat()">Array.prototype.flat polyfill</a></p>
-
-<pre class="brush: js">if (!Array.prototype.flatMap) {
-  Array.prototype.flatMap = function() {
-    return Array.prototype.map.apply(this, arguments).flat(1);
-  };
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td><a href="https://tc39.github.io/proposal-flatMap/#sec-Array.prototype.flatMap"><code>Array.prototype.flatMap</code> </a></td>
-   <td>Finalizado (4)</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.flatMap")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.flatten()")}}</li>
- <li>{{jsxref("Array.prototype.map()")}}</li>
- <li>{{jsxref("Array.prototype.reduce()")}}</li>
- <li>{{jsxref("Array.prototype.concat()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/foreach/index.html b/files/es/web/javascript/referencia/objetos_globales/array/foreach/index.html
deleted file mode 100644
index bc6b693176..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/foreach/index.html
+++ /dev/null
@@ -1,257 +0,0 @@
----
-title: Array.prototype.forEach()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/forEach
-tags:
-  - Array
-  - ECMAScript5
-  - JavaScript
-  - JavaScript 1.6
-  - Method
-  - Prototype
-  - Referencia
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>forEach()</strong></code> ejecuta la función indicada una vez por cada elemento del array.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-foreach.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>arr</var>.forEach(function <var>callback(currentValue, index, array) {
-    // tu iterador
-}</var>[, <var>thisArg</var>]);</pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función a ejecutar por cada elemento, que recibe tres argumentos:</dd>
- <dd>
- <dl>
-  <dt><code>currentValue</code></dt>
-  <dd>El elemento actual siendo procesado en el array.</dd>
-  <dt><code>index</code> {{optional_inline}}</dt>
-  <dd>El índice del elemento actual siendo procesado en el array.</dd>
-  <dt><code>array</code> {{optional_inline}}</dt>
-  <dd>El vector en el que <code>forEach()</code> esta siendo aplicado.</dd>
- </dl>
- </dd>
- <dt><code>thisArg</code> {{optional_inline}}</dt>
- <dd>Valor que se usará como <code>this</code> cuando se ejecute el <code>callback</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>{{jsxref("undefined")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>forEach()</code> ejecuta la función <code>callback</code> una vez por cada elemento presente en el array en orden ascendente. No es invocada para índices que han sido eliminados o que no hayan sido inicializados (Ej. sobre arrays <code>sparse</code>)</p>
-
-<p><code>callback</code> es invocada con tres argumentos:</p>
-
-<ol>
- <li>el valor del elemento</li>
- <li>el índice del elemento</li>
- <li>el array que está siendo recorrido</li>
-</ol>
-
-<p>Si un parámetro <code>thisArg</code> es proporcionado a <code>forEach</code>, será usado como el valor <code>this</code> para cada invocación de <code>callback</code> como si se llamara a <code>callback.call(thisArg, element, index, array)</code>. Si <code>thisArg</code> es <code>undefined</code> o <code>null</code>, el valor <code>this</code> dentro de la función depende si la función está o no en <a href="/es/docs/Web/JavaScript/Referencia/Modo_estricto" title="JavaScript/Strict_mode">modo estricto</a> (valor pasado si está en modo estricto, objeto global si está en modo no-estricto).</p>
-
-<p>El rango de elementos procesados por <code>forEach()</code> se establece antes de la primera invocación del <code>callback</code>. Los elementos que sean añadidos al vector después de que inicie la llamada a <code>forEach</code> no serán visitados por <code>callback</code>. Si los valores de los elementos existentes en el vector son modificados, el valor pasado al <code>callback</code> será el valor al momento de que forEach los visite; no se evaluarán los elementos borrados antes de ser visitados por <code>forEach</code>.</p>
-
-<p><code>forEach()</code> ejecuta la función <code>callback</code> una vez por cada elemento del array; a diferencia de {{jsxref("Array.prototype.map()", "map()")}} o {{jsxref("Array.prototype.reduce()", "reduce()")}} este siempre devuelve el valor {{jsxref("undefined")}} y no es encadenable. El típico uso es ejecutar los efectos secundarios al final de la cadena.</p>
-
-<p><code>foreach()</code> no muta/modifica el array desde el que es llamado (aunque <code>callback</code>, si se invoca, podría hacerlo).</p>
-
-<div class="note"><strong>Nota :</strong> No hay forma de detener o cortar un bucle <code>forEach</code> que no sea lanzar una excepción. Si necesita dicho comportamiento, el método <code>.forEach()</code> es la herramienta equivocada, use una simple iteración en su lugar. Si está probando los elementos del array para un predicado y necesita devolver un valor boleano, puede usar {{jsxref("Array.prototype.every()", "every()")}} o {{jsxref("Array.prototype.some()", "some()")}} en su lugar.</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Imprimiendo_el_contenido_de_un_array">Imprimiendo el contenido de un <code>array</code></h3>
-
-<p>El siguiente código imprime una línea por cada elemento en un array:</p>
-
-<pre class="brush:js notranslate">function logArrayElements(element, index, array) {
-    console.log("a[" + index + "] = " + element);
-}
-// Nótese que se evita el 2° índice ya que no hay ningún elemento en esa posición del array
-[2, 5, , 9].forEach(logArrayElements);
-// salida:
-// a[0] = 2
-// a[1] = 5
-// a[2] = 9
-</pre>
-
-<h3 id="Usando_thisArg">Usando <code>thisArg</code></h3>
-
-<p>El siguiente ejemplo actualiza las propiedades del objeto por cada entrada en el array:</p>
-
-<pre class="brush:js notranslate">function Counter() {
-  this.sum = 0;
-  this.count = 0;
-}
-Counter.prototype.add = function(array) {
-  array.forEach(function(entry) {
-    this.sum += entry;
-    ++this.count;
-  }, this);
-  // ^---- Note
-};
-
-var obj = new Counter();
-obj.add([2, 5, 9]);
-obj.count
-// 3
-obj.sum
-// 16</pre>
-
-<p>Nota: Dado que el parámetro <code>thisArg</code> (this) se referencia en el <code>forEach()</code>, será pasado al <code>callback</code> cuando se invoque, para utilizarse como su valor <code>this</code>.</p>
-
-<h3 id="Ejemplo_Función_que_copia_objetos">Ejemplo: Función que copia objetos</h3>
-
-<p>El siguiente código crea una copia de un objeto dado. Hay diferentes formas de crear una copia de un objeto, ésta es sólo una de ellas y sirve para explicar cómo funciona <code>Array.prototype.forEach </code>utilizando funciones <code>Object.*</code> de ECMAScript 5.</p>
-
-<pre class="brush: js notranslate">function copy(o){
-  var copy = Object.create( Object.getPrototypeOf(o) );
-  var propNames = Object.getOwnPropertyNames(o);
-
-  propNames.forEach(function(name){
-    var desc = Object.getOwnPropertyDescriptor(o, name);
-    Object.defineProperty(copy, name, desc);
-  });
-
-  return copy;
-}
-
-var o1 = {a:1, b:2};
-var o2 = copy(o1); // o2 ahora se parece a o1
-</pre>
-
-<h3 id="Si_el_array_se_modifica_durante_la_iteración_otros_elementos_pueden_ser_omitidos.">Si el array se modifica durante la iteración, otros elementos pueden ser omitidos.</h3>
-
-<p>El siguiente ejemplo muestra por consola "uno", "dos", "cuatro". Cuando se alcanza el registro que contiene el valor "dos", el primer registro del array se desplaza, lo que hace que los registros restantes se muevan una posición. Debido a que el elemento "cuatro" está ahora en una posición anterior en el array, "tres" se omitirá. <code>forEach()</code> no hace una copia del array antes de iterar.</p>
-
-<pre class="brush:js notranslate">var words = ['uno', 'dos', 'tres', 'cuatro'];
-words.forEach(function(word) {
-  console.log(word);
-  if (word === 'dos') {
-    words.shift();
-  }
-});
-// uno
-// dos
-// cuatro
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p><code>forEach</code> se agregó de manera reciente al estándar ECMA-262; así que puede no estar presente en otras implementaciones del estándar. Se puede asegurar el uso del <span style="font-family: consolas,monaco,andale mono,monospace;">forEach</span> con tan solo agregar el siguiente código al inicio de los scripts, permitiendo así el uso de <span style="font-family: consolas,monaco,andale mono,monospace;">forEach</span> en implementaciones que no lo soportan de manera nativa. El algoritmo es el mismo que se especifica en la quinta versión de ECMA-262, asumiendo que {{jsxref("Object")}} y {{jsxref("TypeError")}} tienen sus valores originales y que <span style="font-family: consolas,monaco,andale mono,monospace;">callback.call </span>evalúa el valor original de {{jsxref("Function.prototype.call()")}}.</p>
-
-<pre class="brush: js notranslate">// Production steps of ECMA-262, Edition 5, 15.4.4.18
-// Reference: http://es5.github.com/#x15.4.4.18
-if (!Array.prototype.forEach) {
-
-  Array.prototype.forEach = function forEach(callback, thisArg) {
-    'use strict';
-    var T, k;
-
-    if (this == null) {
-      throw new TypeError("this is null or not defined");
-    }
-
-    var kValue,
-        // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
-        O = Object(this),
-
-        // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
-        // 3. Let len be ToUint32(lenValue).
-        len = O.length &gt;&gt;&gt; 0; // Hack to convert O.length to a UInt32
-
-    // 4. If IsCallable(callback) is false, throw a TypeError exception.
-    // See: http://es5.github.com/#x9.11
-    if ({}.toString.call(callback) !== "[object Function]") {
-      throw new TypeError(callback + " is not a function");
-    }
-
-    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
-    if (arguments.length &gt;= 2) {
-      T = thisArg;
-    }
-
-    // 6. Let k be 0
-    k = 0;
-
-    // 7. Repeat, while k &lt; len
-    while (k &lt; len) {
-
-      // a. Let Pk be ToString(k).
-      //   This is implicit for LHS operands of the in operator
-      // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
-      //   This step can be combined with c
-      // c. If kPresent is true, then
-      if (k in O) {
-
-        // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
-        kValue = O[k];
-
-        // ii. Call the Call internal method of callback with T as the this value and
-        // argument list containing kValue, k, and O.
-        callback.call(T, kValue, k, O);
-      }
-      // d. Increase k by 1.
-      k++;
-    }
-    // 8. return undefined
-  };
-}
-
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.18', 'Array.prototype.forEach')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.forEach")}}</div>
-
-<div id="compat-mobile"></div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.find()")}}</li>
- <li>{{jsxref("Array.prototype.findIndex()")}}</li>
- <li>{{jsxref("Array.prototype.map()")}}</li>
- <li>{{jsxref("Array.prototype.every()")}}</li>
- <li>{{jsxref("Array.prototype.some()")}}</li>
- <li>{{jsxref("Map.prototype.forEach()")}}</li>
- <li>{{jsxref("Set.prototype.forEach()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/from/index.html b/files/es/web/javascript/referencia/objetos_globales/array/from/index.html
deleted file mode 100644
index a11d0ebd53..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/from/index.html
+++ /dev/null
@@ -1,242 +0,0 @@
----
-title: Array.from()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/from
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Referencia
-  - Vector
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/from
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Array.from()</strong></code> crea una nueva instancia de <code>Array</code> a partir de un objeto iterable.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-from.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Array.from(arrayLike[, mapFn[, thisArg]])
-</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>arrayLike</code></dt>
- <dd>Objeto iterable para convertirlo en un array.</dd>
- <dt><code>mapFn</code>{{Optional_inline}}</dt>
- <dd>Función de mapa para llamar a cada elemento de la matriz.</dd>
- <dt><code>thisArg</code>{{Optional_inline}}</dt>
- <dd>Valor para usar como <code>this</code> al ejecutar <code>mapFn</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una nueva instancia de {{jsxref("Array")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>Array.from()</code> permite crear <code>Arrays</code> de:</p>
-
-<ul>
- <li>Objetos array-like (objetos con propiedad <code>length</code> o elementos indexados).</li>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Iteration_protocols">Objetos iterables</a> (objetos de los cuales se pueden obtener sus elementos como {{jsxref("Map")}} y {{jsxref("Set")}}).</li>
-</ul>
-
-<p><code>Array.from()</code> tiene un parámetro opcional <code>mapFn</code>, que te permite ejecutar una función {{jsxref("Array.prototype.map", "map")}}  a cada elemento del array (o a la subclase del objeto) que se ha creado. Para aclararlo, <code>Array.from(obj, mapFn, thisArg)</code> es igual que <code>Array.from(obj).map(mapFn, thisArg)</code>, excepto en que éste no crea un array intermedio. Esto es importante para ciertas subclases de array, <a href="/es/docs/Web/JavaScript/Vectores_tipados">vectores tipados</a>, ya que el vector intermedio necesitaría tener valores truncados para trabajar con el tipo adecuado.</p>
-
-<p>La propiedad <code>length</code> del método <code>from()</code> es 1.</p>
-
-<p>En ES2015, la sintaxis de clase permite la subclasificación de clases integradas y definidas por el usuario; como resultado, los métodos estáticos como <code>Array.from</code> son "heredados" por subclases de <code>Array</code> y crean nuevas instancias de la subclase, no <code>Array</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Array_desde_un_String">Array desde un <code>String</code></h3>
-
-<pre class="brush: js">Array.from('foo');
-// [ "f", "o", "o" ]</pre>
-
-<h3 id="Array_desde_un_Set">Array desde un <code>Set</code></h3>
-
-<pre class="brush: js">const set = new Set(['foo', 'bar', 'baz', 'foo']);
-Array.from(set);
-// [ "foo", "bar", "baz" ]</pre>
-
-<h3 id="Array_desde_un_Map">Array desde un <code>Map</code></h3>
-
-<pre class="brush: js">const map = new Map([[1, 2], [2, 4], [4, 8]]);
-Array.from(map);
-// [[1, 2], [2, 4], [4, 8]]
-
-const mapper = new Map([['1', 'a'], ['2', 'b']]);
-Array.from(mapper.values());
-// ['a', 'b'];
-
-Array.from(mapper.keys());
-// ['1', '2'];
-</pre>
-
-<h3 id="Array_desde_un_objeto_Array-like_(argumentos)">Array desde un objeto Array-like (argumentos)</h3>
-
-<pre class="brush: js">function f() {
-  return Array.from(arguments);
-}
-
-f(1, 2, 3);
-
-// [ 1, 2, 3 ]</pre>
-
-<h3 id="Usando_una_función_de_flecha_y_Array.from">Usando una función de flecha y <code>Array.from</code></h3>
-
-<pre class="brush: js">// Usando una función de flecha como función
-// para manipular los elementos
-Array.from([1, 2, 3], x =&gt; x + x);
-// [2, 4, 6]
-
-
-// Generar secuencia de números
-// Puesto que el array se inicializa con `undefined` en cada posición,
-// el valor de `v` a continuación será `undefined`
-Array.from({length: 5}, (v, i) =&gt; i);
-// [0, 1, 2, 3, 4]
-</pre>
-
-<h3 id="Generador_de_secuencia_(rango)">Generador de secuencia (rango)</h3>
-
-<pre class="brush: js">// Función generadora de secuencia (comúnmente llamado "rango", ej. Clojure, PHP, etc.)
-const range = (start, stop, step) =&gt; Array.from({ length: (stop - start) / step + 1}, (_, i) =&gt; start + (i * step));
-
-// Genera un rango de números entre 0..4
-range(0, 4, 1);
-// [0, 1, 2, 3, 4]
-
-// Genera un rango de números entre 1..10 con saltos de 2
-range(1, 10, 2);
-// [1, 3, 5, 7, 9]
-
-// Generar el abecedario utilizando Array.from haciendo uso de que se ordena como secuencia
-range('A'.charCodeAt(0), 'Z'.charCodeAt(0), 1).map(x =&gt; String.fromCharCode(x));
-// ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p><code>Array.from</code> fue añadido en el estándar ECMA-262 en la 6ta edición (ES2015); así que no puede estar presente en otras implementaciones del estándar. Puedes usarlo insertando este código al comienzo de sus scripts, permitiendo el uso de <code>Array.from</code> en implementaciones que no lo soportan. Este algoritmo es el mismo especificado en ECMA-262, 6ta edición, suponiendo que <code>Object</code> y <code>TypeError</code> tengan sus valores originales y <code>callback.call</code> evalúa el valor original de {{jsxref("Function.prototype.call")}}. Adicionalmente, ya que verdaderos iterables pueden no ser polyficados, esta implementación no soporta iterables genéricos como definidos en la 6ta edición de ECMA-262.</p>
-
-<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 6, 22.1.2.1
-// Referencia: https://people.mozilla.org/~jorendorff/es6-draft.html#sec-array.from
-if (!Array.from) {
-  Array.from = (function () {
-    var toStr = Object.prototype.toString;
-    var isCallable = function (fn) {
-      return typeof fn === 'function' || toStr.call(fn) === '[object Function]';
-    };
-    var toInteger = function (value) {
-      var number = Number(value);
-      if (isNaN(number)) { return 0; }
-      if (number === 0 || !isFinite(number)) { return number; }
-      return (number &gt; 0 ? 1 : -1) * Math.floor(Math.abs(number));
-    };
-    var maxSafeInteger = Math.pow(2, 53) - 1;
-    var toLength = function (value) {
-      var len = toInteger(value);
-      return Math.min(Math.max(len, 0), maxSafeInteger);
-    };
-
-    // La propiedad length del método from es 1.
-    return function from(arrayLike/*, mapFn, thisArg */) {
-      // 1. Deje a C ser el este valor.
-      var C = this;
-
-      // 2. Deje que los elementos sean ToObject(arrayLike).
-      var items = Object(arrayLike);
-
-      // 3. Retornar IfAbrupt(items).
-      if (arrayLike == null) {
-        throw new TypeError("Array.from requiere un objeto array-like - not null or undefined");
-      }
-
-      // 4. Si mapfn no está definida, entonces deja que sea false.
-      var mapFn = arguments.length &gt; 1 ? arguments[1] : void undefined;
-      var T;
-      if (typeof mapFn !== 'undefined') {
-        // 5. si no
-        // 5. a If IsCallable(mapfn) es false, lanza una excepción TypeError.
-        if (!isCallable(mapFn)) {
-          throw new TypeError('Array.from: si hay mapFn, el segundo argumento debe ser una función');
-        }
-
-        // 5. b. Si thisArg se suministró, deje que T sea thisArg; si no, deje que T esté indefinido.
-        if (arguments.length &gt; 2) {
-          T = arguments[2];
-        }
-      }
-
-      // 10. Let lenValue be Get(items, "length").
-      // 11. Let len be ToLength(lenValue).
-      var len = toLength(items.length);
-
-      // 13. If IsConstructor(C) is true, then
-      // 13. a. Let A be the result of calling the [[Construct]] internal method of C with an argument list containing the single item len.
-      // 14. a. Else, Let A be ArrayCreate(len).
-      var A = isCallable(C) ? Object(new C(len)) : new Array(len);
-
-      // 16. Let k be 0.
-      var k = 0;
-      // 17. Repeat, while k &lt; len… (also steps a - h)
-      var kValue;
-      while (k &lt; len) {
-        kValue = items[k];
-        if (mapFn) {
-          A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);
-        } else {
-          A[k] = kValue;
-        }
-        k += 1;
-      }
-      // 18. Let putStatus be Put(A, "length", len, true).
-      A.length = len;
-      // 20. Return A.
-      return A;
-    };
-  }());
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.from', 'Array.from')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.from")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
- <li>{{jsxref("Array.prototype.map()")}}</li>
- <li>{{jsxref("TypedArray.from()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/includes/index.html b/files/es/web/javascript/referencia/objetos_globales/array/includes/index.html
deleted file mode 100644
index 3831c7d73d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/includes/index.html
+++ /dev/null
@@ -1,181 +0,0 @@
----
-title: Array.prototype.includes()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/includes
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/includes
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>includes()</strong></code> determina si una matriz incluye un determinado elemento, devuelve <code>true</code> o <code>false</code> según corresponda.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-includes.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre><var>arr</var>.includes(<var>searchElement[</var>, <var>fromIndex]</var>)</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valueToFind</code></dt>
- <dd>
- <p>El valor a buscar.</p>
-
- <div class="blockIndicator note">
- <p><strong>Nota: </strong>Al comparar cadenas de texto y caracteres, <code>includes()</code> <strong>distingue mayúsculas y minúsculas</strong>.</p>
- </div>
- </dd>
- <dt><code>fromIndex</code> {{optional_inline}}</dt>
- <dd>Posición en la matriz en la cuál se debe comenzar a buscar <code>valueToFind</code>; el primer caracter a buscar se encuentra en <code>fromIndex</code>. Un valor negativo inicia la búsqueda desde array.length + fromIndex en adelante. El valor por defecto es 0.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un {{jsxref ("Boolean")}} que es <code>true</code> si el valor <code>valueToFind</code> se encuentra dentro de la matriz (o la parte de la matriz indicada por el índice <code>fromIndex</code>, si se especifica). Todos los valores de cero se consideran iguales independientemente del signo (es decir, -0 se considera igual a 0 y +0), pero <code>false</code> no se considera igual a 0.</p>
-
-<div class="note">
-<p><strong>Note:</strong> Técnicamente hablando, <code>include()</code> usa el algoritmo <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#Same-value-zero_equality">sameValueZero</a></code> para determinar si se encuentra el elemento dado</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">[1, 2, 3].includes(2);     // true
-[1, 2, 3].includes(4);     // false
-[1, 2, 3].includes(3, 3);  // false
-[1, 2, 3].includes(3, -1); // true
-[1, 2, NaN].includes(NaN); // true
-</pre>
-
-<h3 id="fromIndex_es_mayor_o_igual_que_la_longitud_de_la_matriz"><code>fromIndex</code> es mayor o igual que la longitud de la matriz</h3>
-
-<p>Si <code>fromIndex</code> es mayor o igual que la longitud de la matriz, se devuelve <code>false</code>. No se buscará en la matriz.</p>
-
-<pre class="brush: js">var arr = ['a', 'b', 'c'];
-
-arr.includes('c', 3);   // false
-arr.includes('c', 100); // false</pre>
-
-<h3 id="El_índice_calculado_es_menor_que_0">El índice calculado es menor que 0</h3>
-
-<p>Si <code>fromIndex</code> es negativo, el índice calculado se calcula para usarse como una posición en la matriz en la cual comenzar a buscar <code>searchElement</code>. Si el índice calculado es menor que 0, se buscará la matriz completa.</p>
-
-<pre class="brush: js">// la longitud de la matriz es 3
-// fromIndex es -100
-// el índice calculado es 3 + (-100) = -97
-
-var arr = ['a', 'b', 'c'];
-
-arr.includes('a', -100); // true
-arr.includes('b', -100); // true
-arr.includes('c', -100); // true</pre>
-
-<h3 id="includes()_utilizado_como_método_genérico"><code>includes()</code> utilizado como método genérico</h3>
-
-<p>El método <code>includes()</code> es intencionalmente genérico. No requiere que este valor sea un objeto Array, por lo que se puede aplicar a otros tipos de objetos (por ejemplo, objetos tipo array). El siguiente ejemplo ilustra el método <code>includes()</code> llamado en el objeto de argumentos de la función.</p>
-
-<pre class="brush: js">(function() {
-  console.log([].includes.call(arguments, 'a')); // true
-  console.log([].includes.call(arguments, 'd')); // false
-})('a','b','c');</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">// https://tc39.github.io/ecma262/#sec-array.prototype.includes
-if (!Array.prototype.includes) {
-  Object.defineProperty(Array.prototype, 'includes', {
-    value: function(searchElement, fromIndex) {
-
-      if (this == null) {
-        throw new TypeError('"this" es null o no está definido');
-      }
-
-      // 1. Dejar que O sea ? ToObject(this value).
-      var o = Object(this);
-
-      // 2. Dejar que len sea ? ToLength(? Get(O, "length")).
-      var len = o.length &gt;&gt;&gt; 0;
-
-      // 3. Si len es 0, devuelve false.
-      if (len === 0) {
-        return false;
-      }
-
-      // 4. Dejar que n sea ? ToInteger(fromIndex).
-      //    (Si fromIndex no está definido, este paso produce el valor 0.)
-      var n = fromIndex | 0;
-
-      // 5. Si n ≥ 0, entonces
-      //  a. Dejar que k sea n.
-      // 6. Else n &lt; 0,
-      //  a. Dejar que k sea len + n.
-      //  b. Si k &lt; 0, Dejar que k sea 0.
-      var k = Math.max(n &gt;= 0 ? n : len - Math.abs(n), 0);
-
-      function sameValueZero(x, y) {
-        return x === y || (typeof x === 'number' &amp;&amp; typeof y === 'number' &amp;&amp; isNaN(x) &amp;&amp; isNaN(y));
-      }
-
-      // 7. Repite, mientras k &lt; len
-      while (k &lt; len) {
-        // a. Dejar que elementK sea el resultado de ? Get(O, ! ToString(k)).
-        // b. Si SameValueZero(searchElement, elementK) es true, devuelve true.
-        if (sameValueZero(o[k], searchElement)) {
-          return true;
-        }
-        // c. Incrementa k por 1.
-        k++;
-      }
-
-      // 8. Devuelve false
-      return false;
-    }
-  });
-}</pre>
-
-<p>Si necesita admitir motores de JavaScript realmente obsoletos que no son compatibles con <code><a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, es mejor no rellenar los métodos <code>Array.prototype</code>, ya que no puede hacerlos no enumerables.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES7', '#sec-array.prototype.includes', 'Array.prototype.includes')}}</td>
-   <td>{{Spec2('ES7')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.includes', 'Array.prototype.includes')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.includes")}}</p>
-</div>
-
-<div id="compat-mobile"></div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("TypedArray.prototype.includes()")}}</li>
- <li>{{jsxref("String.prototype.includes()")}}</li>
- <li>{{jsxref("Array.prototype.indexOf()")}}</li>
- <li>{{jsxref("Array.prototype.find()")}}</li>
- <li>{{jsxref("Array.prototype.findIndex()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/index.html b/files/es/web/javascript/referencia/objetos_globales/array/index.html
deleted file mode 100644
index 45531c7a3e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/index.html
+++ /dev/null
@@ -1,449 +0,0 @@
----
-title: Array
-slug: Web/JavaScript/Referencia/Objetos_globales/Array
-tags:
-  - Array
-  - JavaScript
-  - Matriz unidimensional
-  - Referencia
-  - Vector
-translation_of: Web/JavaScript/Reference/Global_Objects/Array
----
-<p>{{JSRef}}<br>
- El objeto <strong><code>Array</code> </strong>de JavaScript es un objeto global que es usado en la construcción de <em>arrays</em>, que son objetos tipo lista de alto nivel.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los <em>arrays</em> son objetos similares a una lista cuyo prototipo proporciona métodos para efectuar operaciones de recorrido y de mutación. Tanto la longitud como el tipo de los elementos de un <em>array</em> son variables. Dado que la longitud de un <em>array </em>puede cambiar en cualquier momento, y los datos se pueden almacenar en ubicaciones no contiguas, no hay garantía de que los <em>arrays </em>de JavaScript sean densos; esto depende de cómo el programador elija usarlos. En general estas características son cómodas, pero si, en su caso particular, no resultan deseables, puede considerar el uso de <em>arrays</em> con tipo.</p>
-
-<h3 id="Operaciones_habituales">Operaciones habituales</h3>
-
-<p><strong>Crear un Array</strong></p>
-
-<pre class="brush: js notranslate">let frutas = ["Manzana", "Banana"]
-
-console.log(frutas.length)
-// 2
-</pre>
-
-<p><strong>Acceder a un elemento de Array mediante su índice</strong></p>
-
-<pre class="brush: js notranslate">let primero = frutas[0]
-// Manzana
-
-let ultimo = frutas[frutas.length - 1]
-// Banana</pre>
-
-<p><strong>Recorrer un Array</strong></p>
-
-<pre class="brush: js notranslate">frutas.forEach(function(elemento, indice, array) {
-    console.log(elemento, indice);
-})
-// Manzana 0
-// Banana 1</pre>
-
-<p><strong>Añadir un elemento al final de un Array</strong></p>
-
-<pre class="brush: js notranslate">let nuevaLongitud = frutas<strong>.push</strong>('Naranja') // Añade "Naranja" al final
-// ["Manzana", "Banana", "Naranja"]</pre>
-
-<p><strong>Eliminar el último elemento de un Array</strong></p>
-
-<pre class="brush: js notranslate">let ultimo = frutas<strong>.pop</strong>() // Elimina "Naranja" del final
-// ["Manzana", "Banana"]</pre>
-
-<p><strong>Añadir un elemento al principio de un Array</strong></p>
-
-<pre class="brush: js notranslate">let nuevaLongitud = frutas<strong>.unshift</strong>('Fresa') // Añade "Fresa" al inicio
-// ["Fresa" ,"Manzana", "Banana"]
-</pre>
-
-<p><strong>Eliminar el primer elemento de un Array</strong></p>
-
-<pre class="brush: js notranslate">let primero = frutas<strong>.shift</strong>() // Elimina "Fresa" del inicio
-// ["Manzana", "Banana"]
-</pre>
-
-<p><strong>Encontrar el índice de un elemento del Array</strong></p>
-
-<pre class="brush: js notranslate">frutas.push('Fresa')
-// ["Manzana", "Banana", "Fresa"]
-
-let pos = frutas<strong>.indexOf</strong>('Banana') // (pos) es la posición para abreviar
-// 1</pre>
-
-<p><strong>Eliminar un único elemento mediante su posición</strong></p>
-
-<dl>
- <dt>  Ejemplo:</dt>
- <dd>Eliminamos "Banana" del <em>array </em>pasándole dos parámetros: la posición del primer elemento que se elimina y el número de elementos que queremos eliminar. De esta forma, <code><strong>.splice</strong>(pos, 1)</code> empieza en la posición que nos indica el valor de la variable <code>pos</code> y elimina 1 elemento. En este caso, como <code>pos</code> vale 1, elimina un elemento comenzando en la posición 1 del <em>array,</em> es decir "Banana".</dd>
-</dl>
-
-<pre class="brush: js notranslate">let elementoEliminado = frutas<strong>.splice</strong>(pos, 1)
-// ["Manzana", "Fresa"]</pre>
-
-<p><strong>Eliminar varios elementos a partir de una posición</strong></p>
-
-<dl>
- <dt>  Nota:</dt>
- <dd>Con <code><strong>.splice</strong>()</code> no solo se puede eliminar elementos del array, si no que también podemos extraerlos guardándolo en un nuevo array. ¡Ojo! que al hacer esto estaríamos modificando el array de origen.</dd>
-</dl>
-
-<pre class="brush: js notranslate">let vegetales = ['Repollo', 'Nabo', 'Rábano', 'Zanahoria']
-console.log(vegetales)
-// ["Repollo", "Nabo", "Rábano", "Zanahoria"]
-
-let pos = 1, numElementos = 2
-
-let elementosEliminados = vegetales<strong>.splice</strong>(pos, numElementos)
-// ["Nabo", "Rábano"] ==&gt; Lo que se ha guardado en "elementosEliminados"
-
-console.log(vegetales)
-// ["Repollo", "Zanahoria"] ==&gt; Lo que actualmente tiene "vegetales" </pre>
-
-<p><strong>Copiar un Array</strong></p>
-
-<pre class="brush: js notranslate">let copiaArray = vegetales<strong>.slice</strong>();
-// ["Repollo", "Zanahoria"]; ==&gt; Copiado en "copiaArray"</pre>
-
-<h3 id="Acceso_a_elementos_de_un_array">Acceso a elementos de un <em>array</em></h3>
-
-<p>Los índices de los <em>arrays</em> de JavaScript comienzan en cero, es decir, el índice del primer elemento de un <em>array</em> es <code>0</code>, y el del último elemento es igual al valor de la propiedad <code>length</code> del <em>array </em>restándole 1.</p>
-
-<p>Si se utiliza un número de índice no válido, se obtendrá <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">let arr = ['este es el primer elemento', 'este es el segundo elemento', 'este es el último elemento']
-console.log(arr[0])              // escribe en consola 'este es el primer elemento'
-console.log(arr[1])              // escribe en consola 'este es el segundo elemento'
-console.log(arr[arr.length - 1]) // escribe en consola 'este es el último elemento'
-</pre>
-
-<p>Los elementos de un <em>array</em> pueden considerarse propiedades del objeto tanto como <code>toString</code> (sin embargo, para ser precisos, <code>toString()</code> es un método). Sin embargo, se obtendrá un error de sintaxis si se intenta acceder a un elemento de un <em>array</em> de la forma siguiente, ya que el nombre de la propiedad no sería válido:</p>
-
-<pre class="brush: js notranslate">console.log(arr.0) // error de sintaxis</pre>
-
-<p>No hay nada especial ni en los <em>arrays</em> de JavaScript ni en sus propiedades que ocasione esto. En JavaScript, las propiedades cuyo nombre comienza con un dígito no pueden referenciarse con la notación punto y debe accederse a ellas mediante la notación corchete.</p>
-
-<p>Por ejemplo, dado un objeto con una propiedad de nombre <code>'3d'</code>, sólo podría accederse a dicha propiedad con la notación corchete.</p>
-
-<pre class="brush: js notranslate">let decadas = [1950, 1960, 1970, 1980, 1990, 2000, 2010]
-console.log(decadas.0)  // error de sintaxis
-console.log(decadas[0]) // funciona correctamente
-</pre>
-
-<pre class="brush: js notranslate">renderizador.3d.usarTextura(modelo, 'personaje.png')
-renderizador['3d'].usarTextura(modelo, 'personaje.png')</pre>
-
-<p>Obsérvese que, en el último ejemplo, ha sido necesario poner <code>'3d'</code> entre comillas. Es posible usar también comillas con los índices del los <em>arrays</em> de JavaScript (p. ej., <code>decadas['2']</code> en vez de <code>decadas[2]</code>), aunque no es necesario.</p>
-
-<p>El motor de JavaScript transforma en un string el 2 de <code>decadas[2]</code> a través de una conversión implícita mediante <code>toString</code>. Por tanto, <code>'2'</code> y <code>'02'</code> harían referencia a dos posiciones diferentes en el objeto <code>decadas</code>, y el siguiente ejemplo podría dar <code>true</code> como resultado:</p>
-
-<pre class="brush: js notranslate">console.log(decadas['2'] != decadas['02'])</pre>
-
-<h3 id="Relación_entre_length_y_las_propiedades_numéricas">Relación entre <code>length</code> y las propiedades numéricas</h3>
-
-<p>La propiedad <code>length</code> de un <em>array</em> de JavaScript está conectada con algunas otras de sus propiedades numéricas.</p>
-
-<p>Varios de los métodos propios de un <em>array</em> (p. ej., <code>join()</code>, <code>slice()</code>, <code>indexOf()</code>, etc.) tienen en cuenta el valor de la propiedad <code>length</code> de un array cuando se les llama.</p>
-
-<p>Otros métodos (p. ej., <code>push()</code>, <code>splice()</code>, etc.) modifican la propiedad <code>length</code> de un array.</p>
-
-<pre class="brush: js notranslate">const frutas = []
-frutas.push('banana', 'manzana', 'pera')
-
-console.log(frutas.length) // 3
-</pre>
-
-<p>Cuando se le da a una propiedad de un <em>array</em> JavaScript un valor que corresponda a un índice válido para el <em>array</em> pero que se encuentre fuera de sus límites, el motor actualizará el valor de la propiedad <code>length</code> como corresponda:</p>
-
-<pre class="brush: js notranslate">frutas[5] = 'fresa'
-console.log(frutas[5])           // 'fresa'
-console.log(Object.keys(frutas)) // ['0', '1', '2', '5']
-console.log(frutas.length)       // 6
-</pre>
-
-<p>Si se aumenta el valor de <code>length</code>:</p>
-
-<pre class="brush: js notranslate">frutas.length = 10
-console.log(frutas)              // ['banana', 'manzana', 'pera', &lt;2 empty items&gt;, 'fresa', &lt;4 empty items&gt;]
-console.log(Object.keys(frutas)) // ['0', '1', '2', '5']
-console.log(frutas.length)       // 10
-console.log(frutas[8])           // undefined
-</pre>
-
-<p>Si se disminuye el valor de la propiedad <code>length</code> pueden eliminarse elementos:</p>
-
-<pre class="brush: js notranslate">frutas.length = 2
-console.log(Object.keys(frutas)) // ['0', '1']
-console.log(frutas.length)       // 2
-</pre>
-
-<p>Hay más información sobre este tema en la página sobre <code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/length">Array.length</a></code>.</p>
-
-<h3 id="Creación_de_un_array_a_partir_de_una_expresión_regular">Creación de un <em>array</em> a partir de una expresión regular</h3>
-
-<p>El resultado de una búsqueda con una <code>RegExp</code> en un string puede crear un <em>array</em> de JavaScript. Este array tendrá propiedades y elementos que proporcionan información sobre la correspondencia encontrada. Para obtener un <em>array</em> de esta forma puede utilizarse <code>RegExp.exec()</code>, <code>String.match()</code> o <code>String.replace()</code>.</p>
-
-<p>El siguiente ejemplo, y la tabla que le sigue, pueden ayudar a comprender mejor las propiedades y elementos a los que nos referimos:</p>
-
-<pre class="brush: js notranslate">// Buscar una d seguida de una o más b y, al final, de otra d
-// Recordar las b y la d final
-// No distinguir mayúsculas y minúsculas
-
-const miRe = /d(b+)(d)/i
-const miArray = miRe.exec('cdbBdbsbz')</pre>
-
-<p>Las propiedades y elementos que se obtienen de esta búsqueda son los siguientes:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Propiedad/Elemento</th>
-   <th scope="col">Descripción</th>
-   <th scope="col">Ejemplo</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>input</code><br>
-    {{ReadOnlyInline}}</td>
-   <td>El string original sobre el que se ha realizado la búsqueda con la expresión regular</td>
-   <td><code>"cdbBdbsbz"</code></td>
-  </tr>
-  <tr>
-   <td><code>index</code><br>
-    {{ReadOnlyInline}}</td>
-   <td>El índice de la correspondencia en el string, siendo cero el de la primera posición.</td>
-   <td><code>1</code></td>
-  </tr>
-  <tr>
-   <td><code>[0]</code><br>
-    {{ReadOnlyInline}}</td>
-   <td>Los últimos caracteres que cumplen la correspondencia</td>
-   <td><code>"dbBd"</code></td>
-  </tr>
-  <tr>
-   <td><code>[1], ...[n]</code><br>
-    {{ReadOnlyInline}}</td>
-   <td>Elementos que indican las correspondencias de substrings entre paréntesis (si se han incluido) de la expresión regular. No hay límite al número de substrings entre paréntesis que se puedan utilizar.</td>
-   <td><code>[1]: "bB"<br>
-    [2]: "d"</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt><strong><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array">Array()</a></code></strong></dt>
- <dd>Crea un nuevo objeto <code>Array</code>.</dd>
-</dl>
-
-<h2 id="Propiedades_estáticas">Propiedades estáticas</h2>
-
-<dl>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@species">get Array[@@species]</a></code></dt>
- <dd>La función del constructor se utiliza para crear objetos derivados.</dd>
-</dl>
-
-<h2 id="Métodos_estáticos">Métodos estáticos</h2>
-
-<dl>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/from">Array.from()</a></code></dt>
- <dd>Crea una nueva instancia de <code>Array</code> a partir de <code><em>similarAUnArray</em></code>, un objeto iterable o parecido a un <em>array.</em></dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/isArray">Array.isArray()</a></code></dt>
- <dd>Devuelve <code>true</code> si <code><em>valor</em></code> es un <em>array</em>, y <code>false</code> en caso contrario.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/of">Array.of()</a></code></dt>
- <dd>Crea una nueva instancia de <code>Array</code> con un número variable de parámetros, independientemente del número y del tipo de dichos parámetros.</dd>
-</dl>
-
-<h2 id="Propiedades_de_instancia">Propiedades de instancia</h2>
-
-<dl>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/length">Array.prototype.length</a></code></dt>
- <dd>Indica el número de elementos de un <em>array</em>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@unscopables">Array.prototype[@@unscopables]</a></code></dt>
- <dd>Símbolo que contiene todos los nombres de las propiedades que se excluyen de un ámbito de enlace <code><a href="/es/docs/Web/JavaScript/Referencia/Sentencias/with">with</a></code>.</dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/concat">Array.prototype.concat()</a></code></dt>
- <dd>Devuelve un nuevo <em>array</em> que es la concatenación de aquél sobre el que se invoca, seguido de otros <em>array(s)</em> o valor(es).</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/copyWithin">Array.prototype.copyWithin()</a></code></dt>
- <dd>Copia una secuencia de elementos de un <em>array</em> dentro del propio <em>array</em>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/entries">Array.prototype.entries()</a></code></dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los pares clave/valor para cada índice del <em>array</em>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/every">Array.prototype.every()</a></code></dt>
- <dd>Devuelve <code>true</code> si todos los elementos del <em>array</em> cumplen el predicado que recibe como parámetro.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/fill">Array.prototype.fill()</a></code></dt>
- <dd>Asigna un <em><code>valor</code></em> estático a todos los elementos del <em>array</em> entre las posiciones <code><em>inicio</em></code> y <code><em>fin</em></code>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/filter">Array.prototype.filter()</a></code></dt>
- <dd>Devuelve un nuevo <em>array</em> que contiene todos los elementos de aquél para el cual se llama que cumplan el predicado que se le pasa como parámetro.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/find">Array.prototype.find()</a></code></dt>
- <dd>Devuelve el primer <em><code>elemento</code></em> del <em>array </em>que cumpla el predicado que se pasa como parámetro, o <code>undefined</code> si ninguno lo cumple.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/findIndex">Array.prototype.findIndex()</a></code></dt>
- <dd>Devuelve el índice del primer elemento del <em>array</em> que cumpla el predicado que se pasa como parámetro, o <code>-1</code> si nunguno lo cumple.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/forEach">Array.prototype.forEach()</a></code></dt>
- <dd>Llama a la función pasada como parámetro para todos los elementos del <em>array.</em></dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/includes">Array.prototype.includes()</a></code></dt>
- <dd>Determina si el <em>array</em> contiene el <code><em>valorBuscado</em></code> y devuelve <code>true</code> o <code>false</code> según sea el caso.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/indexOf">Array.prototype.indexOf()</a></code></dt>
- <dd>Devuelve el índice del primer elemento del <em>array</em> que sea igual a <code><em>elementoBuscado</em></code>, o <code>-1</code> si no existe.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/join">Array.prototype.join()</a></code></dt>
- <dd>Concatena en un string todos los elementos de un <em>array.</em></dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/keys">Array.prototype.keys()</a></code></dt>
- <dd>Devuelve un nuevo <code>Array Iterator</code> que contiene las claves de cada índice del <em>array.</em></dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/lastIndexOf">Array.prototype.lastIndexOf()</a></code></dt>
- <dd>Devuelve el índice del último elemento del <em>array</em> que sea igual a <code><em>elementoBuscado</em></code>, o <code>-1</code> si no existe.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/map">Array.prototype.map()</a></code></dt>
- <dd>Devuelve un nuevo <em>array</em> que contiene el resultado de llamar a la función pasada como parámetro a todos los elementos del <em>array</em> sobre el que se invoca.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/pop">Array.prototype.pop()</a></code></dt>
- <dd>Elimina el último elemento de un <em>array</em>, y devuelve dicho elemento.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/push">Array.prototype.push()</a></code></dt>
- <dd>Añade uno o más elementos al final de un <em>array</em> y devuelve el nuevo valor de su propiedad <code>length</code>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduce">Array.prototype.reduce()</a></code></dt>
- <dd>Aplica la función pasada como parámetro a un <code><em>acumulador</em></code> y a cada valor del <em>array</em>, que se recorre de izquierda a derecha, para reducirlo a un único valor.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight">Array.prototype.reduceRight()</a></code></dt>
- <dd>Aplica la función pasada como parámetro a un <em><code>acumulador</code></em> y a cada valor del <em>array</em>, que se recorre de derecha a izquierda, para reducirlo a un único valor.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reverse">Array.prototype.reverse()</a></code></dt>
- <dd>Invierte el orden de los elementos de un <em>array</em> (el primero pasa a ser el último y el último a ser el primero) en el propio <em>array.</em> Este método modifica el array.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/shift">Array.prototype.shift()</a></code></dt>
- <dd>Elimina el primer elemento de un <em>array</em>, y devuelve dicho elemento.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/slice">Array.prototype.slice()</a></code></dt>
- <dd>Extrae una porción del <em>array</em> sobre el que se llama y devuelve un nuevo <em>array</em>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/some">Array.prototype.some()</a></code></dt>
- <dd>Devuelve <code>true</code> si al menos un elemento del <em>array</em> cumple con el predicado que se pasa como parámetro.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/sort">Array.prototype.sort()</a></code></dt>
- <dd>Ordena los elementos de un <em>array</em>, modificando éste, y devuelve el array ordenado.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/splice">Array.prototype.splice()</a></code></dt>
- <dd>Añade, borra o modifica elementos de un <em>array</em>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/toLocaleString">Array.prototype.toLocaleString()</a></code></dt>
- <dd>Devuelve un string adaptado a la configuración regional que representa el <em>array</em> y sus elementos. Redefine el método <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toLocaleString">Object.prototype.toLocaleString()</a></code>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/toString">Array.prototype.toString()</a></code></dt>
- <dd>Devuelve un string que representa el <em>array</em> y sus elementos. Redefine el método <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/toString">Object.prototype.toString()</a></code>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/unshift">Array.prototype.unshift()</a></code></dt>
- <dd>Añada uno o más elementos al inicio de un <em>array</em> y devuelve el nuevo valor de <code>length</code> para el <em>array</em> resultante.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/values">Array.prototype.values()</a></code></dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice del <em>array</em>.</dd>
- <dt><code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/@@iterator">Array.prototype[@@iterator]()</a></code></dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice del <em>array</em>.</dd>
-</dl>
-
-<p>Ejemplos</p>
-
-<h3 id="Creando_un_Arreglo" name="Creando_un_Arreglo">Creación de una matriz unidimensional</h3>
-
-<p>El siguiente ejemplo crea un <em>array </em><code>mensajes</code> con una longitud de 0, y luego asigna valores a <code>mensajes[0]</code> y a <code>mensajes[99]</code>, con lo que la longitud del <em>array</em> pasa a ser 100.</p>
-
-<pre class="brush: js notranslate">let mensajes = [];
-mensajes[0] = "Hola";
-mensajes[99] = "mundo";
-
-if (mensajes.length === 100) {
-   console.log("La longitud es de 100.");
-}
-</pre>
-
-<h3 id="Creaci.C3.B3n_de_un_arreglo_de_dos_dimensiones" name="Creaci.C3.B3n_de_un_arreglo_de_dos_dimensiones">Creación de una matriz de dos dimensiones</h3>
-
-<p>El siguiente ejemplo crea una matriz bidimensional que representa un tablero de ajedrez. El primer movimiento se realiza copiando la <code>'p'</code> de <code>tablero[6][4]</code> en <code>tablero[4][4]</code>. La posición <code>[6][4]</code> se limpia.</p>
-
-<pre class="notranslate">let tablero = [
-  ['T','C','A','D','R','A','C','T'],
-  ['P','P','P','P','P','P','P','P'],
-  [' ',' ',' ',' ',' ',' ',' ',' '],
-  [' ',' ',' ',' ',' ',' ',' ',' '],
-  [' ',' ',' ',' ',' ',' ',' ',' '],
-  [' ',' ',' ',' ',' ',' ',' ',' '],
-  ['p','p','p','p','p','p','p','p'],
-  ['t','c','a','d','r','a','c','t'] ]
-
-console.log(tablero.join('\n') + '\n\n')
-
-// Adelantar dos posiciones el peón de rey
-tablero[4][4] = tablero[6][4]
-tablero[6][4] = ' '
-console.log(tablero.join('\n'))</pre>
-
-<p>Este es el resultado:</p>
-
-<pre class="eval notranslate">T,C,A,D,R,A,C,T
-P,P,P,P,P,P,P,P
- , , , , , , ,
- , , , , , , ,
- , , , , , , ,
- , , , , , , ,
-p,p,p,p,p,p,p,p
-t,c,a,d,r,a,c,t
-
-P,P,P,P,P,P,P,P
- , , , , , , ,
- , , , , , , ,
- , , , ,p, , ,
- , , , , , , ,
-p,p,p,p, ,p,p,p
-t,c,a,d,r,a,c,t
-</pre>
-
-<h3 id="Uso_de_un_array_para_tabular_un_conjunto_de_valores">Uso de un <em>array</em> para tabular un conjunto de valores</h3>
-
-<pre class="notranslate">valores = []
-for (let x = 0; x &lt; 10; x++){
- valores.push([
-  2 ** x,
-  2 * x ** 2
- ])
-}
-console.table(valores)</pre>
-
-<p>da como resultado:</p>
-
-<pre class="notranslate">0	1	0
-1	2	2
-2	4	8
-3	8	18
-4	16	32
-5	32	50
-6	64	72
-7	128	98
-8	256	128
-9	512	162</pre>
-
-<p>(La primera columna es el índice).</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Publicación inicial</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array-objects', 'Array')}}</td>
-   <td>ECMAScript 1</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si te gustaría contribuir a los datos, por favor visite <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una solicitud de extracción(pull request).</div>
-
-<p>{{Compat("javascript.builtins.Array")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>En la Guía de JavaScript:
-  <ul>
-   <li><a href="/es/docs/Web/JavaScript/Guide/Working_with_Objects#Indexing_object_properties">"Propiedades indexadas de un objeto"</a></li>
-   <li><a href="/es/docs/Web/JavaScript/Guide/Indexed_collections#Array_object">"Colecciones con índice: objeto Array"</a></li>
-  </ul>
- </li>
- <li><a href="/es/docs/JavaScript_typed_arrays">Arrays tipados</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/indexof/index.html b/files/es/web/javascript/referencia/objetos_globales/array/indexof/index.html
deleted file mode 100644
index 7aad7773b1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/indexof/index.html
+++ /dev/null
@@ -1,248 +0,0 @@
----
-title: Array.prototype.indexOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/indexOf
-tags:
-  - Array
-  - JavaScript
-  - Method
-  - Prototype
-  - Referencia
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/indexOf
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong>indexOf()</strong> retorna el primer índice en el que se puede encontrar un elemento dado en el array, ó retorna -1 si el elemento no esta presente.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Para el método String, ver {{jsxref("String.prototype.indexOf()")}}.</p>
-</div>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>array</em>.indexOf(<em>searchElement</em>[, <em>fromIndex</em>])</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>searchElement</code></dt>
- <dd>Elemento a encontrar en el array.</dd>
- <dt><code>fromIndex</code> {{optional_inline}}</dt>
- <dd>Indica el índice por el que se comienza la búsqueda. Por defecto es 0, por lo que se busca en todo el array. Si el índice es mayor o igual a la longitud del array, devuelve -1, ya que no se buscaría en el array. Si el valor es negativo, se toma restando posiciones desde el final del array. Hay que tener en cuenta que aunque el índice sea negativo, la búsqueda seguirá realizándose en un orden incremental. Si el índice calculado es menor de 0, la búsqueda se realizará por todo el array.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El primer índice del elemento en la matriz; -1 si no se encuentra.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p><code>indexOf()</code> compara <code>searchElement</code> con los elementos del array usando <a href="/es/docs/Web/JavaScript/Referencia/Operadores/Comparison_Operators#Using_the_Equality_Operators" title="JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">igualdad estricta</a> (el mismo método que cuando se usa ===, o el operador igualdad-triple).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_indexOf()">Usando <code>indexOf()</code></h3>
-
-<p>El siguiente ejemplo usa <code>indexof()</code> para localizar valores en un array </p>
-
-<pre class="brush: js">var array = [2, 9, 9];
-array.indexOf(2);     // 0
-array.indexOf(7);     // -1
-array.indexOf(9, 2);  // 2
-array.indexOf(2, -1); // -1
-array.indexOf(2, -3); // 0</pre>
-
-<h3 id="Encontrar_todas_las_apariciones_de_un_elemento">Encontrar todas las apariciones de un elemento</h3>
-
-<pre class="brush: js">var indices = [];
-var array = ['a', 'b', 'a', 'c', 'a', 'd'];
-var element = 'a';
-var idx = array.indexOf(element);
-while (idx != -1) {
-  indices.push(idx);
-  idx = array.indexOf(element, idx + 1);
-}
-console.log(indices);
-// [0, 2, 4]</pre>
-
-<h3 id="Encontrar_si_un_elemento_existe_en_la_matriz_o_no_y_actualizar_la_matriz">Encontrar si un elemento existe en la matriz o no y actualizar la matriz</h3>
-
-<pre class="brush: js">function updateVegetablesCollection (veggies, veggie) {
-    if (veggies.indexOf(veggie) === -1) {
-        veggies.push(veggie);
-        console.log('La nueva colección de vegetales es: ' + veggies);
-    } else if (veggies.indexOf(veggie) &gt; -1) {
-        console.log(veggie + ' ya existe en la colección de verduras.');
-    }
-}
-
-var veggies = ['patata', 'tomate', 'chiles', 'pimientoverde'];
-
-updateVegetablesCollection(veggies, 'espinaca');
-// La nueva colección de verduras es : patata, tomate, chiles, pimientoverde, espinaca
-updateVegetablesCollection(veggies, 'espinaca');
-// La espinaca ya existe en la colección de verduras.</pre>
-
-<p> </p>
-
-<h2 id="Compatibility" name="Compatibility">Polyfill</h2>
-
-<p><code>indexOf()</code> se agregó al estándar ECMA-262 en la 5<sup>a</sup> edición; por tanto no está implementado en todos los navegadores. Puedes hacerlo funcionar insertando el siguiente código al comienzo de tus scripts, permitiendo usar  <code>indexOf()</code> en implementaciones que no lo soporten de forma nativa. Este algoritmo es exáctamente el especificado en ECMA-262, 5ª edición, suponiendo que {{jsxref("Global_Objects/TypeError", "TypeError")}} y {{jsxref("Math.abs()")}} tienen sus valores originales.</p>
-
-
-<pre class="brush: js">if (!Array.prototype.indexOf) {
-  Array.prototype.indexOf = function indexOf(member, startFrom) {
-    /*
-    En el modo no estricto, si la variable `this` es null o indefinida, entonces se establece
-    en el objeto ventana. De lo contrario, `this` se convierte automáticamente en un objeto.
-    En modo estricto, si la variable `this` es nula o indefinida, se lanza `TypeError`.
-    */
-    if (this == null) {
-      throw new TypeError("Array.prototype.indexOf() - no se puede convertir `" + this + "` en objeto");
-    }
-
-    var
-      index = isFinite(startFrom) ? Math.floor(startFrom) : 0,
-      that = this instanceof Object ? this : new Object(this),
-      length = isFinite(that.length) ? Math.floor(that.length) : 0;
-
-    if (index &gt;= length) {
-      return -1;
-    }
-
-    if (index &lt; 0) {
-      index = Math.max(length + index, 0);
-    }
-
-    if (member === undefined) {
-      /*
-        Dado que `member` no está definido, las claves que no existan tendrán el valor de `same`
-        como `member` y, por lo tanto, es necesario verificarlas.
-      */
-      do {
-        if (index in that &amp;&amp; that[index] === undefined) {
-          return index;
-        }
-      } while (++index &lt; length);
-    } else {
-      do {
-        if (that[index] === member) {
-          return index;
-        }
-      } while (++index &lt; length);
-    }
-
-    return -1;
-  };
-}</pre>
-
-<p>Sin embargo, si está más interesado en todos los pequeños trozos técnicos definidos por el estándar ECMA, y está menos preocupado por el rendimiento o la concisión, entonces usted puede encontrar esta polyfill más descriptivo que sea más útil.</p>
-
-<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 5, 15.4.4.14
-// Referencia: http://es5.github.io/#x15.4.4.14
-if (!Array.prototype.indexOf) {
-  Array.prototype.indexOf = function(searchElement, fromIndex) {
-
-    var k;
-
-    // 1. Dejar que `o` sea el resultado de llamar a ToObject
-    //    pasando este valor como argumento.
-    if (this == null) {
-      throw new TypeError('"this" is null or not defined');
-    }
-
-    var o = Object(this);
-
-    // 2. Dejar que `lenValue` sea el resultado de llamar al método interno
-    //    de `o` con el argumento "length".
-    // 3. Dejar que len sea ToUint32(lenValue).
-    var len = o.length &gt;&gt;&gt; 0;
-
-    // 4. Si `len` es 0, devolver -1.
-    if (len === 0) {
-      return -1;
-    }
-
-    // 5. Si se pasó el argumento `fromIndex`, deje que `n` sea
-    //    ToInteger(fromIndex); si no, que `n` sea 0.
-    var n = fromIndex | 0;
-
-    // 6. Si n &gt;= len, devolver -1.
-    if (n &gt;= len) {
-      return -1;
-    }
-
-    // 7. Si n &gt;= 0, entonces deja que `k` sea `n`.
-    // 8. Si no, n&lt;0, deja que `k` sea `len - abs(n)`.
-    //    Si `k` es menor que 0, entonces deja que `k` sea 0.
-    k = Math.max(n &gt;= 0 ? n : len - Math.abs(n), 0);
-
-    // 9. Repite, mientras k &lt; len
-    while (k &lt; len) {
-      // a. Dejar que `Pk` sea ToString(k).
-      //   Esto está implícito para los operandos LHS del operador in
-      // b. Dejar que kPresent sea el resultado de llamar al método
-      //    interno `HasProperty` de `o` con el argumento `Pk`.
-      //   Este paso se puede combinar con `c`
-      // c. Si kPresent es verdadero, entonces
-      //    i.  Dejar que `elementK` sea el resultado de llamar al método
-      //        interno de `o` con el argumento ToString(k).
-      //   ii.  Deje que `same` sea el resultado de aplicar el
-      //        Algoritmo de comparación de igualdad estricta a
-      //        searchElement y elementK.
-      //  iii.  Si `same` es true, devuelve `k`.
-      if (k in o &amp;&amp; o[k] === searchElement) {
-        return k;
-      }
-      k++;
-    }
-    return -1;
-  };
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.14', 'Array.prototype.indexOf')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Array.indexOf")}}</p>
-
-<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
-
-<ul>
- <li>Comenzando con Firefox 47 {{geckoRelease(47)}}, este método ya no devolverá <code>-0</code>. Por ejemplo, <code>[0] .indexOf (0, -0)</code> siempre devolverá <code>+0</code> ({{bug(1242043)}}).</li>
-</ul>
-
-<div id="compat-mobile"> </div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li>
- <li>{{jsxref("TypedArray.prototype.indexOf()")}}</li>
- <li>{{jsxref("String.prototype.indexOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/isarray/index.html b/files/es/web/javascript/referencia/objetos_globales/array/isarray/index.html
deleted file mode 100644
index b2a115a814..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/isarray/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: Array.isArray()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/isArray
-tags:
-  - Array
-  - ECMAScript5
-  - JavaScript
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/isArray
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Array.isArray()</strong></code> determina si el valor pasado es un {{jsxref("Array")}}.</p>
-
-<pre class="brush: js">Array.isArray([1, 2, 3]);  // true
-Array.isArray({foo: 123}); // false
-Array.isArray('foobar');   // false
-Array.isArray(undefined);  // false
-</pre>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Array.isArray(<var>obj</var>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto a evaluar.</dd>
-</dl>
-
-<h3 id="Description" name="Description">Valor de retorno</h3>
-
-<p><code>true</code> si el objeto es un {{jsxref("Array")}}; en caso contrario, <code>false</code>.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Si el objeto es un {{jsxref("Array")}}, devuelve <code>true</code>; <code>false</code>, en cualquier otro caso.</p>
-
-<p>Vea el artículo <a href="http://web.mit.edu/jwalden/www/isArray.html">“Determining with absolute accuracy whether or not a JavaScript object is an array”</a> para más detalles.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<pre class="brush: js">// las siguientes llamadas devuelven true
-Array.isArray([]);
-Array.isArray([1]);
-Array.isArray(new Array());
-Array.isArray(new Array('a', 'b', 'c', 'd'));
-Array.isArray(new Array(3));
-// Hecho poco conocido: Array.prototype es también un array:
-Array.isArray(Array.prototype);
-
-// todas las siguientes llamadas devuelven false
-Array.isArray();
-Array.isArray({});
-Array.isArray(null);
-Array.isArray(undefined);
-Array.isArray(17);
-Array.isArray('Array');
-Array.isArray(true);
-Array.isArray(false);
-Array.isArray({ __proto__: Array.prototype });
-</pre>
-
-<h3 id="instanceof_vs_isArray"><code>instanceof</code> vs <code>isArray</code></h3>
-
-<p>Al comprobar una instancia <code>Array</code>, <code>Array.isArray</code> es más recomendado que <code>instanceof</code> porque funciona a través de <code>iframes</code>.</p>
-
-<pre class="brush: js">var iframe = document.createElement('iframe');
-document.body.appendChild(iframe);
-xArray = window.frames[window.frames.length - 1].Array;
-var arr = new xArray(1,2,3); // [1,2,3]
-
-// Comprobando correctamente un Array
-Array.isArray(arr);  // true
-// Considerado peligroso, porque no funciona a través de iframes
-arr instanceof Array; // false
-</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<p>Ejecutar el siguiente código antes de cualquier otro código creará un <code>Array.isArray()</code> si no está disponible de forma nativa.</p>
-
-<pre class="brush: js">if (!Array.isArray) {
-  Array.isArray = function(arg) {
-    return Object.prototype.toString.call(arg) === '[object Array]';
-  };
-}
-</pre>
-
-<h2 id="Especificaciones" name="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.3.2', 'Array.isArray')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.isarray', 'Array.isArray')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.isarray', 'Array.isArray')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.isArray")}}</div>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/join/index.html b/files/es/web/javascript/referencia/objetos_globales/array/join/index.html
deleted file mode 100644
index ea9ba3e544..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/join/index.html
+++ /dev/null
@@ -1,110 +0,0 @@
----
-title: Array.prototype.join()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/join
-tags:
-  - Array
-  - JavaScript
-  - Matriz
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/join
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>join()</code></strong> une todos los elementos de una matriz (o un <a href="/es/docs/Web/JavaScript/Guide/Indexed_collections#Working_with_array-like_objects">objeto similar a una matriz</a>) en una cadena y devuelve esta cadena.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-join.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr.join([separator])</var></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>separador</code> {{optional_inline}}</dt>
- <dd>Es una <code>cadena</code> usada para separar cada uno de los elementos del arreglo. El separador es convertido a una <code>cadena</code> si es necesario. Si este se omite, los elementos del arreglo son separados con una coma (","). Si el <code>separador</code> es una <code>cadena</code> vacía todos los elementos son unidos sin ningún carácter entre ellos.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una cadena con todos los elementos de la matriz unidos. Si <code><em>arr</em>.length</code> es <code>0</code>, se devuelve la cadena vacía.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las conversiones de cadena de todos los elementos de la matriz se unen en una cadena.</p>
-
-<div class="warning">
-<p>Si un elemento <code>no está definido</code> o es <code>nulo</code>, se convierte en la cadena vacía.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uniendo_un_arreglo_cuatro_veces_en_diferentes_formas">Uniendo un arreglo cuatro veces en diferentes formas</h3>
-
-<p>El siguiente ejemplo crea un arreglo <code>a</code> con tres elementos para luego unir el arreglo cuatro veces: usando el separador predeterminado, luego una coma y un espacio, luego un signo de suma, y finalmente una cadena vacío.</p>
-
-<pre class="brush: js">var a = ['Viento', 'Lluvia', 'Fuego'];
-var miVar1 = a.join();      // asigna 'Viento,Lluvia,Fuego' a miVar1
-var miVar2 = a.join(', ');  // asigna 'Viento, Lluvia, Fuego' a miVar2
-var miVar3 = a.join(' + '); // asigna 'Viento + Lluvia + Fuego' a miVar3
-var miVar4 = a.join('');    // asigna 'VientoLluviaFuego' a miVar4
-</pre>
-
-<h3 id="Unirse_a_un_objeto_tipo_matriz">Unirse a un objeto tipo matriz</h3>
-
-<p>El siguiente ejemplo une un objeto parecido a una matriz (<code><a href="/es/docs/Web/JavaScript/Reference/Functions/arguments">argumentos</a></code>), llamando a {{jsxref("Function.prototype.call")}} en <code>Array.prototype.join</code>.</p>
-
-<pre class="brush: js">function f(a, b, c) {
-  var s = Array.prototype.join.call(arguments);
-  console.log(s); // '1,a,true'
-}
-f(1, 'a', true);
-//resultado esperado: "1,a,true"</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition</td>
-   <td>Estándar</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.5', 'Array.prototype.join')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.join', 'Array.prototype.join')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.join', 'Array.prototype.join')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.join")}}</div>
-
-<div id="compat-desktop"> </div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.split()")}}</li>
- <li>{{jsxref("Array.prototype.toString()")}}</li>
- <li>{{jsxref("TypedArray.prototype.join()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/keys/index.html b/files/es/web/javascript/referencia/objetos_globales/array/keys/index.html
deleted file mode 100644
index ff7cb593f5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/keys/index.html
+++ /dev/null
@@ -1,84 +0,0 @@
----
-title: Array.prototype.keys()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/keys
-tags:
-  - Array
-  - ECMAScript 2015
-  - Iterator
-  - JavaScript
-  - Matriz
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/keys
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>keys()</strong></code> devuelve un nuevo objeto  <code><strong>Array Iterator</strong></code> que contiene las claves de índice con las que acceder a cada elemento en el array.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-keys.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.keys()</pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un nuevo objeto iterador {{jsxref("Array")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_básico">Uso básico</h3>
-
-<pre class="brush: js">var arr = ['a', 'b', 'c'];
-var iterator = arr.keys();
-
-console.log(iterator.next()); // { value: 0, done: false }
-console.log(iterator.next()); // { value: 1, done: false }
-console.log(iterator.next()); // { value: 2, done: false }
-console.log(iterator.next()); // { value: undefined, done: true }
-</pre>
-
-<h3 id="El_iterador_no_ignora_los_huecos">El iterador no ignora los huecos</h3>
-
-<pre class="brush: js">var arr = ['a', , 'c'];
-var sparseKeys = Object.keys(arr);
-var denseKeys = [...arr.keys()];
-console.log(sparseKeys); // ['0', '2']
-console.log(denseKeys);  // [0, 1, 2]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.keys', 'Array.prototype.keys')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.keys', 'Array.prototype.keys')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.keys")}}</div>
-
-<div id="compat-mobile"> </div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.values()")}}</li>
- <li>{{jsxref("Array.prototype.entries()")}}</li>
- <li><a href="/es/docs/Web/JavaScript/Reference/Iteration_protocols">Protocolos de iteración</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/lastindexof/index.html b/files/es/web/javascript/referencia/objetos_globales/array/lastindexof/index.html
deleted file mode 100644
index 19667a54af..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/lastindexof/index.html
+++ /dev/null
@@ -1,164 +0,0 @@
----
-title: Array.prototype.lastIndexOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/lastIndexOf
-tags:
-  - Array
-  - Arreglo
-  - ECMAScript 5
-  - JavaScript
-  - Matriz
-  - Prototipo
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>lastIndexOf()</strong></code> devuelve el último índice en el que un cierto elemento puede encontrarse en el arreglo, ó <code>-1</code> si el elemento no se encontrara. El arreglo es recorrido en sentido contrario, empezando por el índice <code>fromIndex</code>.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-lastindexof.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr.lastIndexOf(searchElement) arr.lastIndexOf(searchElement, fromIndex)</var></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>searchElement</code></dt>
- <dd>Elemento a encontrar en el arreglo.</dd>
- <dt><code>fromIndex</code> {{optional_inline}}</dt>
- <dd>El índice en el que empieza la búsqueda en sentido contrario. Por defecto la longitud del arreglo menos uno (<code>arr.length - 1</code>), es decir, todo el arreglo será recorrido. Si el índice es mayor o igual que la longitud del arreglo, todo el arreglo será recorrido. Si es un valor negatigo, se usará como inicio del desplazamiento el final del arreglo. Darse cuenta que aún cuando el índice es negativo, el arreglo todavía será recorrido desde atrás hacia delante. Si el índice calculado es menor de <code>0</code>, se devolverá <code>-1</code>, es decir, el arreglo no será recorrido.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El último índice del elemento en el arreglo; <code>-1</code> si no se encuentra.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>lastIndexOf</code> compara <code>searchElement</code> con los elementos del arreglo usando <a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Using_the_Equality_Operators">igualdad estricta</a> (el mismo método es usado para la ===, operador triple igualdad).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_lastIndexOf">Usando <code>lastIndexOf</code></h3>
-
-<p>El siguiente ejemplo usa <code>lastIndexOf</code> para encontrar valores en un arreglo.</p>
-
-<pre class="brush: js">var array = [2, 5, 9, 2];
-array.lastIndexOf(2);     // 3
-array.lastIndexOf(7);     // -1
-array.lastIndexOf(2, 3);  // 3
-array.lastIndexOf(2, 2);  // 0
-array.lastIndexOf(2, -2); // 0
-array.lastIndexOf(2, -1); // 3
-</pre>
-
-<h3 id="Encontrar_todas_las_apariciones_de_un_elemento">Encontrar todas las apariciones de un elemento</h3>
-
-<p>El siguiente ejemplo uses <code>lastIndexOf</code> encuentra todos los índices de un elemento en un arreglo dado, usando {{jsxref("Array.prototype.push", "push")}} añadiéndolos a otro arreglo como elementos encontrados.</p>
-
-<pre class="brush: js">var indices = [];
-var array = ['a', 'b', 'a', 'c', 'a', 'd'];
-var element = 'a';
-var idx = array.lastIndexOf(element);
-while (idx != -1) {
-  indices.push(idx);
-  idx = (idx &gt; 0 ? array.lastIndexOf(element, idx - 1) : -1);
-}
-
-console.log(indices);
-// [4, 2, 0]
-</pre>
-
-<p>Darse cuenta que en este caso tenemos que tratar <code>idx == 0</code>  de forma separada por que el elemento siempre será encontrado independiemente del valor del parámetro <code>fromIndex</code>  si este es el primer elemento del arreglo. Diferente de como se trata en el método {{jsxref("Array.prototype.indexOf", "indexOf")}}.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p><code>lastIndexOf</code> fue añadido al estándar ECMA-262 en la 5ª edición; por tanto puede que no este presente en otras implementaciones del estándar. Puedes solucionarlo escribiendo el siguiente código al principio de tus scripts, pudiendo usar <code>lastIndexOf</code> en implementaciones que no tiene soporte de forma nativa. Este algoritmo es exactamente el especificado en ECMA-262, 5ª edición, suponiendo que {{jsxref("Object")}}, {{jsxref("TypeError")}}, {{jsxref("Number")}}, {{jsxref("Math.floor")}}, {{jsxref("Math.abs")}}, y {{jsxref("Math.min")}} tienen sus valores originales.</p>
-
-<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 5, 15.4.4.15
-// Referencia: http://es5.github.io/#x15.4.4.15
-if (!Array.prototype.lastIndexOf) {
-  Array.prototype.lastIndexOf = function(searchElement /*, fromIndex*/) {
-    'use strict';
-
-    if (this === void 0 || this === null) {
-      throw new TypeError();
-    }
-
-    var n, k,
-      t = Object(this),
-      len = t.length &gt;&gt;&gt; 0;
-    if (len === 0) {
-      return -1;
-    }
-
-    n = len - 1;
-    if (arguments.length &gt; 1) {
-      n = Number(arguments[1]);
-      if (n != n) {
-        n = 0;
-      }
-      else if (n != 0 &amp;&amp; n != (1 / 0) &amp;&amp; n != -(1 / 0)) {
-        n = (n &gt; 0 || -1) * Math.floor(Math.abs(n));
-      }
-    }
-
-    for (k = n &gt;= 0 ? Math.min(n, len - 1) : len - Math.abs(n); k &gt;= 0; k--) {
-      if (k in t &amp;&amp; t[k] === searchElement) {
-        return k;
-      }
-    }
-    return -1;
-  };
-}
-</pre>
-
-<p>De nuevo, darse cuenta que esta implementación tiene como objeto la completa compatibilidad con <code>lastIndexOf</code> en Firefox y el motor SpiderMonkey JavaScript, en particular en varios casos que son posiblemente extremos. Si pretendes usar esta funcionalidad en aplicaciones reales, es posible que puedes calcular <code>from</code> con código menos complejo si ignoras estos casos.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.15', 'Array.prototype.lastIndexOf')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.lastIndexOf")}}</div>
-
-<div id="compat-mobile"></div>
-
-<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
-
-<ul>
- <li>Desde Firefox 47 {{geckoRelease(47)}},  el método ya no devolverá <code>-0</code>. Por ejemplo, <code>[0].lastIndexOf(0, -0)</code> siempre devolverá <code>+0</code> ({{bug(1242043)}}).</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.indexOf()")}}</li>
- <li>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/length/index.html b/files/es/web/javascript/referencia/objetos_globales/array/length/index.html
deleted file mode 100644
index cbbb1a46db..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/length/index.html
+++ /dev/null
@@ -1,143 +0,0 @@
----
-title: Array.prototype.length
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/length
-tags:
-  - Array
-  - JavaScript
-  - Propiedad
-  - Referencia
-  - Vector
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/length
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>length</strong></code> de un objeto que es una instancia de tipo Array establece o devuelve la cantidad de elementos en esa matriz. El valor es un entero sin signo de 32 bits que siempre es numéricamente mayor que el índice más alto en la matriz.</p>
-
-<div>
-<p>{{EmbedInteractiveExample("pages/js/array-length.html")}}</p>
-</div>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>El valor de la propiedad <code>length</code> es un número entero con un signo positivo y un valor menor que 2 a la 32<sup>a</sup> potencia (2<sup>32</sup>).</p>
-
-<pre class="brush: js">var namelistA = new Array(4294967296); //2 a la 32a potencia = 4294967296
-var namelistC = new Array(-100) //signo negativo
-
-console.log(namelistA.length); //RangeError: longitud de la matriz inválida
-console.log(namelistC.length); //RangeError: longitud de la matriz inválida
-
-
-
-var namelistB = [];
-namelistB.length = Math.pow(2,32)-1; //establecer una longitud de la matriz menor que 2 a la 32ª potencia
-console.log(namelistB.length);
-
-//4294967295</pre>
-
-<p>Puedes establecer la propiedad <code>length</code> para truncar una matriz unidimensional en cualquier momento. Cuando extiende una matriz cambiando su propiedad <code>length</code>, el número de elementos reales aumenta; por ejemplo, si se establece <code>length</code> en 3 cuando actualmente es 2, la matriz ahora contiene 3 elementos, lo que hace que el tercer elemento sea <code>undefined</code>.</p>
-
-<pre class="brush: js">var arr = [1, 2, 3];
-printEntries(arr);
-
-arr.length = 5; // establecer la longitud de la matriz en 5 mientras que actualmente es 3.
-printEntries(arr);
-
-function printEntries(arr) {
-  var length = arr.length;
-  for (var i = 0; i &lt; length; i++) {
-    console.log(arr[i]);
-  }
-  console.log('=== printed ===');
-}
-
-// 1
-// 2
-// 3
-// === impreso ===
-// 1
-// 2
-// 3
-// undefined
-// undefined
-// === impreso ===</pre>
-
-<p>Pero, la propiedad <code>length</code> no necesariamente indica el número de valores definidos en la matriz. Ver también <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/Array#Relationship_between_length_and_numerical_properties" title="Relationship between length and numerical properties">Relación entre <code>length</code> y las propiedades numéricas</a>.</p>
-
-<p>{{js_property_attributes(1, 0, 0)}}</p>
-
-<ul>
- <li><code>Sobrescribir</code>: si este atributo se establece en <code>false</code>, el valor de la propiedad no se puede cambiar.</li>
- <li><code>Configurable</code>: si este atributo se establece en <code>false</code>, cualquier intento de eliminar la propiedad o cambiar sus atributos (<code>Sobrescribir</code>, <code>Configurable </code>o <code>Numerable</code>) fallará.</li>
- <li><code>Numerable</code>: si este atributo se establece en <code>true</code>, la propiedad se repetirá durante los bucles <a href="/es/docs/Web/JavaScript/Reference/Statements/for">for</a> o <a href="/es/docs/Web/JavaScript/Reference/Statements/for...in">for..in</a>.</li>
-</ul>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Iterating_over_an_array" name="Example:_Iterating_over_an_array">Iterando sobre una matriz</h3>
-
-<p>En el siguiente ejemplo, la matriz <code>numbers</code> se itera a través de la propiedad <code>length</code>. El valor en cada elemento se duplica.</p>
-
-<pre class="brush: js">var numbers = [1, 2, 3, 4, 5];
-var length = numbers.length;
-for (var i = 0; i &lt; length; i++) {
-  numbers[i] *= 2;
-}
-// numbers ahora es [2, 4, 6, 8, 10]</pre>
-
-<h3 id="Example:_Shortening_an_array" name="Example:_Shortening_an_array">Acortando una matriz</h3>
-
-<p>El siguiente ejemplo acorta los <code>numbers</code> de la matriz a una longitud de <code>3</code> si la longitud actual es mayor que <code>3</code>.</p>
-
-<pre class="brush: js">var numbers = [1, 2, 3, 4, 5];
-
-if (numbers.length &gt; 3) {
-  numbers.length = 3;
-}
-
-console.log(numbers); // [1, 2, 3]
-console.log(numbers.length); // 3</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1ra Edición.</td>
-   <td>Estándar</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.5.2', 'Array.length')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-properties-of-array-instances-length', 'Array.length')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-properties-of-array-instances-length', 'Array.length')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.length")}}</div>
-
-<div id="compat-mobile"> </div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/map/index.html b/files/es/web/javascript/referencia/objetos_globales/array/map/index.html
deleted file mode 100644
index 8b958a4945..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/map/index.html
+++ /dev/null
@@ -1,360 +0,0 @@
----
-title: Array.prototype.map()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/map
-tags:
-  - Array
-  - Arreglo
-  - Callback
-  - ECMAScript5
-  - Polifill
-  - Prototype
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/map
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>map()</strong></code> crea un nuevo array con los resultados de la llamada a la función indicada aplicados a cada uno de sus elementos.</p>
-
-<pre class="brush: js">var numbers = [1, 5, 10, 15];
-var doubles = numbers.map(function(x) {
-   return x * 2;
-});
-// doubles is now [2, 10, 20, 30]
-// numbers is still [1, 5, 10, 15]
-
-var numbers = [1, 4, 9];
-var roots = numbers.map(function(num) {
-    return Math.sqrt(num);
-});
-// roots is now [1, 2, 3]
-// numbers is still [1, 4, 9]
-</pre>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>var nuevo_array = arr</var>.map(function <var>callback(currentValue, index, array) {
-    // Elemento devuelto de nuevo_array
-}</var>[, <var>thisArg</var>])</pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función que producirá un elemento del nuevo array, recibe tres argumentos:</dd>
- <dd>
- <dl>
-  <dt><code>currentValue</code></dt>
-  <dd>El elemento actual del array que se está procesando.</dd>
-  <dt><code>index</code></dt>
-  <dd>El índice del elemento actual dentro del array.</dd>
-  <dt><code>array</code></dt>
-  <dd>El array sobre el que se llama <code>map.</code></dd>
- </dl>
- </dd>
- <dt><code>thisArg</code></dt>
- <dd>Opcional. Valor a usar como <code>this </code>al ejecutar <code>callback</code>.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p><code>map</code> llama a la función <code>callback</code> provista <strong>una vez por elemento</strong> de un array, en orden, y construye un nuevo array con los resultados. <code>callback</code> se invoca sólo para los índices del array que tienen valores asignados; no se invoca en los índices que han sido borrados o a los que no se ha asignado valor.</p>
-
-<p><code>callback</code> es llamada con tres argumentos: el valor del elemento, el índice del elemento, y el objeto array que se está recorriendo.</p>
-
-<p>Si se indica un parámetro <code>thisArg</code> a un <code>map</code>, se usará como valor de <code>this</code> en la función <code>callback</code>. En otro caso, se pasará {{jsxref("Global_Objects/undefined", "undefined")}} como su valor <code>this</code>. El valor de <code>this</code> observable por el <code>callback</code> se determina de acuerdo a las <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">reglas habituales para determinar el valor this visto por una función.</a></p>
-
-<p><code>map</code> no modifica el array original en el que es llamado (aunque <code>callback</code>, si es llamada, puede modificarlo).</p>
-
-<p>El rango de elementos procesado por <code>map</code> es establecido antes de la primera invocación del <code>callback</code>. Los elementos que sean agregados al array después de que la llamada a <code>map </code>comience no serán visitados por el <code>callback</code>. Si los elementos existentes del array son modificados o eliminados, su valor pasado al <code>callback</code> será el valor en el momento que el <code>map</code> lo visita; los elementos que son eliminados no son visitados.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example_Mapping_an_array_of_numbers_to_an_array_of_square_roots" name="Example:_Mapping_an_array_of_numbers_to_an_array_of_square_roots">Procesar un array de números aplicándoles la raíz cuadrada</h3>
-
-<p>El siguiente código itera sobre un array de números, aplicándoles la raíz cuadrada a cada uno de sus elementos, produciendo un nuevo array a partir del inicial.</p>
-
-<pre class="brush: js">var numeros= [1, 4, 9];
-var raices = numeros.map(Math.sqrt);
-// raices tiene [1, 2, 3]
-// numeros aún mantiene [1, 4, 9]
-</pre>
-
-<h3 id="Example_Mapping_an_array_of_numbers_to_an_array_of_square_roots" name="Example:_Mapping_an_array_of_numbers_to_an_array_of_square_roots">Usando map para dar un nuevo formato a los objetos de un array</h3>
-
-<p>El siguiente código toma un array de objetos y crea un nuevo array que contiene los nuevos objetos formateados.</p>
-
-<pre class="brush: js">var kvArray = [{clave:1, valor:10},
-               {clave:2, valor:20},
-               {clave:3, valor: 30}];
-
-var reformattedArray = kvArray.map(function(obj){
-   var rObj = {};
-   rObj[obj.clave] = obj.valor;
-   return rObj;
-});
-
-// reformattedArray es ahora [{1:10}, {2:20}, {3:30}],
-
-// kvArray sigue siendo:
-// [{clave:1, valor:10},
-//  {clave:2, valor:20},
-//  {clave:3, valor: 30}]
-</pre>
-
-<h3 id="Example_Mapping_an_array_of_numbers_using_a_function_containing_an_argument" name="Example:_Mapping_an_array_of_numbers_using_a_function_containing_an_argument">Mapear un array de números usando una función con un argumento</h3>
-
-<p>El siguiente código muestra cómo trabaja <code>map </code>cuando se utiliza una función que requiere de un argumento. El argumento será asignado automáticamente a cada elemento del arreglo conforme <code>map </code>itera el arreglo original.</p>
-
-<pre class="brush: js">var numeros = [1, 4, 9];
-var dobles  = numeros.map(function(num) {
-  return num * 2;
-});
-
-// dobles es ahora [2, 8, 18]
-// numeros sigue siendo [1, 4, 9]
-</pre>
-
-<h3 id="Example_using_map_generically" name="Example:_using_map_generically">Usando <code>map</code> de forma genérica</h3>
-
-<p>Este ejemplo muestra como usar <code>map </code>en {{jsxref("Global_Objects/String", "String")}} para obtener un arreglo de bytes en codifcación ASCII representando el valor de los caracteres:</p>
-
-<pre class="brush: js">var map = Array.prototype.map;
-var valores = map.call('Hello World', function(char) { return char.charCodeAt(0); });
-// valores ahora tiene [72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
-</pre>
-
-<h3 id="Example_using_map_generically_querySelectorAll" name="Example:_using_map_generically_querySelectorAll">Usando <code>map</code> genérico con <code>querySelectorAll</code></h3>
-
-<p>Este ejemplo muestra como iterar sobre una colección de objetos obtenidos por <code>querySelectorAll</code>. En este caso obtenemos todas las opciones seleccionadas en pantalla y se imprimen en la consola:</p>
-
-<pre class="brush: js">var elems = document.querySelectorAll('select option:checked');
-var values = [].map.call(elems, function(obj) {
-  return obj.value;
-});
-</pre>
-
-<h3 id="Usando_map_para_invertir_una_cadena">Usando <code>map</code> para invertir una cadena</h3>
-
-<pre class="brush: js">var str = '12345';
-[].map.call(str, function(x) {
-  return x;
-}).reverse().join('');
-
-// Salida: '54321'
-// Bonus: usa'===' para probar si la cadena original era un palindromo
-</pre>
-
-<h3 id="Example_Tricky_use_case" name="Example:_Tricky_use_case">Caso de uso engañoso</h3>
-
-<p><a href="http://www.wirfs-brock.com/allen/posts/166">(inspirado por este artículo)</a></p>
-
-<p>Es común utilizar el callback con un argumento (el elemento siendo pasado). Ciertas funciones son también usadas comunmente con un argumento, aún cuando toman argumentos adicionales opcionales.  Estos hábitos pueden llevar a comportamientos confusos.</p>
-
-<pre class="brush: js">// Considera:
-['1', '2', '3'].map(parseInt);
-// Mientras uno esperaría [1, 2, 3]
-// en realidad se obtiene [1, NaN, NaN]
-
-// parseInt se usa comúnmente con un argumento, pero toma dos.
-// El primero es una expresión y el segundo el radix.
-// a la función callback, Array.prototype.map pasa 3 argumentos:
-// el elemento, el índice y el array.
-// El tercer argumento es ignorado por parseInt, pero no el segundo,
-// de ahí la posible confusión. Véase el artículo del blog para más detalles
-
-function returnInt(element) {
-  return parseInt(element, 10);
-}
-
-['1', '2', '3'].map(returnInt); // [1, 2, 3]
-// El resultado es un arreglo de números (como se esperaba)
-
-// Un modo más simple de lograr lo de arriba, mientras de evita el "gotcha":
-['1', '2', '3'].map(Number); // [1, 2, 3]
-</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<p><code>map</code> fue agregado al estandar ECMA-262 en la 5th edición; por lo tanto podría no estar presente en todas la implementaciones del estándar. Puedes sobrepasar esto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>map</code> en implementaciones que no lo soportan de forma nativa. Este algoritmo es exactamente el mismo especificado en ECMA-262, 5th edición, asumiendo {{jsxref("Global_Objects/Object", "Object")}}, {{jsxref("Global_Objects/TypeError", "TypeError")}}, y {{jsxref("Global_Objects/Array", "Array")}} tienen sus valores originales y que el <code>callback.call</code> evalua el valor original de <code>{{jsxref("Function.prototype.call")}}</code>.</p>
-
-<pre class="brush: js">// Production steps of ECMA-262, Edition 5, 15.4.4.19
-// Reference: http://es5.github.io/#x15.4.4.19
-if (!Array.prototype.map) {
-
-  Array.prototype.map = function(callback, thisArg) {
-
-    var T, A, k;
-
-    if (this == null) {
-      throw new TypeError(' this is null or not defined');
-    }
-
-    // 1. Let O be the result of calling ToObject passing the |this|
-    //    value as the argument.
-    var O = Object(this);
-
-    // 2. Let lenValue be the result of calling the Get internal
-    //    method of O with the argument "length".
-    // 3. Let len be ToUint32(lenValue).
-    var len = O.length &gt;&gt;&gt; 0;
-
-    // 4. If IsCallable(callback) is false, throw a TypeError exception.
-    // See: http://es5.github.com/#x9.11
-    if (typeof callback !== 'function') {
-      throw new TypeError(callback + ' is not a function');
-    }
-
-    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
-    if (arguments.length &gt; 1) {
-      T = thisArg;
-    }
-
-    // 6. Let A be a new array created as if by the expression new Array(len)
-    //    where Array is the standard built-in constructor with that name and
-    //    len is the value of len.
-    A = new Array(len);
-
-    // 7. Let k be 0
-    k = 0;
-
-    // 8. Repeat, while k &lt; len
-    while (k &lt; len) {
-
-      var kValue, mappedValue;
-
-      // a. Let Pk be ToString(k).
-      //   This is implicit for LHS operands of the in operator
-      // b. Let kPresent be the result of calling the HasProperty internal
-      //    method of O with argument Pk.
-      //   This step can be combined with c
-      // c. If kPresent is true, then
-      if (k in O) {
-
-        // i. Let kValue be the result of calling the Get internal
-        //    method of O with argument Pk.
-        kValue = O[k];
-
-        // ii. Let mappedValue be the result of calling the Call internal
-        //     method of callback with T as the this value and argument
-        //     list containing kValue, k, and O.
-        mappedValue = callback.call(T, kValue, k, O);
-
-        // iii. Call the DefineOwnProperty internal method of A with arguments
-        // Pk, Property Descriptor
-        // { Value: mappedValue,
-        //   Writable: true,
-        //   Enumerable: true,
-        //   Configurable: true },
-        // and false.
-
-        // In browsers that support Object.defineProperty, use the following:
-        // Object.defineProperty(A, k, {
-        //   value: mappedValue,
-        //   writable: true,
-        //   enumerable: true,
-        //   configurable: true
-        // });
-
-        // For best browser support, use the following:
-        A[k] = mappedValue;
-      }
-      // d. Increase k by 1.
-      k++;
-    }
-
-    // 9. return A
-    return A;
-  };
-}
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.19', 'Array.prototype.map')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.map', 'Array.prototype.map')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.map', 'Array.prototype.map')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.8")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.8")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Map")}} object</li>
- <li>{{jsxref("Array.from()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/of/index.html b/files/es/web/javascript/referencia/objetos_globales/array/of/index.html
deleted file mode 100644
index f57c7e2bc1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/of/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: Array.of()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/of
-tags:
-  - Array
-  - ECMAScript 2015
-  - JavaScript
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/of
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Array.of()</strong></code> crea una nueva instancia <code>Array</code> con un número variable de elementos pasados como argumento, independientemente del número o del tipo.</p>
-
-<p>La diferencia entre <code><strong>Array.of()</strong></code> y el constructor <code><strong>Array</strong></code> reside en como maneja los parámetros de tipo entero: <code><strong>Array.of(7)</strong></code> crea un array con un solo elemento, <code>7</code>, mientras que <code><strong>Array(7)</strong></code> crea un array vacío con una propiedad <code>length</code> de 7 (<strong>Nota:</strong> esto implica un array de 7 ranuras vacías, no ranuras con valores <code>undefined</code>).</p>
-
-<pre class="brush: js">Array.of(7);       // [7]
-Array.of(1, 2, 3); // [1, 2, 3]
-
-Array(7);          // [ , , , , , , ]
-Array(1, 2, 3);    // [1, 2, 3]</pre>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">Array.of(<var>elemento0</var>[, <var>elemento1</var>[, ...[, <var>elementoN</var>]]])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>elemento<em>N</em></code></dt>
- <dd>Valores con los que se creará el Array en su respectivo indice.</dd>
- <dt>
- <h3 id="Valor_de_retorno">Valor de retorno</h3>
- </dt>
- <dd>Una nueva instancia de {{jsxref("Array")}}.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Esta función es parte del estándar ECMAScript 2015. Para obtener más información, consulte <a href="https://gist.github.com/rwaldron/1074126"><code>Array.of</code> y <code>Array.from</code> proposal</a> y <a href="https://gist.github.com/rwaldron/3186576"><code>Array.of</code> polyfill</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">Array.of(1);         // [1]
-Array.of(1, 2, 3);   // [1, 2, 3]
-Array.of(undefined); // [undefined]
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Escribiendo el siguiente código antes que cualquier otro, podemos emular la funcionalidad de <code>Array.of()</code> si es que ésta no está disponible de forma nativa.</p>
-
-<pre class="brush: js">if (!Array.of) {
-  Array.of = function() {
-    return Array.prototype.slice.call(arguments);
-  };
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-array.of', 'Array.of')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.of', 'Array.of')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.of")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
- <li>{{jsxref("Array.from()")}}</li>
- <li>{{jsxref("TypedArray.of()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/pop/index.html b/files/es/web/javascript/referencia/objetos_globales/array/pop/index.html
deleted file mode 100644
index acc6d06885..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/pop/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: Array.prototype.pop()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/pop
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/pop
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>pop()</strong></code> elimina el <strong>último</strong> elemento de un array y lo devuelve. Este método cambia la longitud del array.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/array-pop.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.pop()</pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El elemento que ha sido eliminado del array; {{jsxref("undefined")}} si el array está vacío.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>pop</code> elimina el último elemento de un array y devuelve su valor al método que lo llamó.</p>
-
-<p><code>pop</code> es intencionadamente genérico; este método puede ser {{jsxref("Function.call", "called", "", 1)}} o {{jsxref("Function.apply", "applied", "", 1)}} en objectos similares a un array. En objetos que no contengan una propiedad <code>length</code>, que refleje su forma en una serie de propiedades numéricas consecutivas en base cero, puede no comportarse de manera significativa.</p>
-
-<p>Si se llama a <code>pop()</code> en un array vacío, devuelve {{jsxref("undefined")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Eliminando_el_último_elemento_de_un_array">Eliminando el último elemento de un array</h3>
-
-<p>El siguiente código crea el array <code>myFish</code>, que contiene cuatro elementos, a continuación, elimina su último elemento.</p>
-
-<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
-
-var popped = myFish.pop();
-
-console.log(myFish); // ['angel', 'clown', 'mandarin' ]
-
-console.log(popped); // 'sturgeon'</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>Estándar</td>
-   <td>Definición inicial. Implementada en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.6', 'Array.prototype.pop')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.pop', 'Array.prototype.pop')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.pop', 'Array.prototype.pop')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.pop")}}</p>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.push()")}}</li>
- <li>{{jsxref("Array.prototype.shift()")}}</li>
- <li>{{jsxref("Array.prototype.unshift()")}}</li>
- <li>{{jsxref("Array.prototype.concat()")}}</li>
- <li>{{jsxref("Array.prototype.splice()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/array/prototype/index.html
deleted file mode 100644
index 2098f514ad..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/prototype/index.html
+++ /dev/null
@@ -1,188 +0,0 @@
----
-title: Array.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/prototype
-tags:
-  - Array
-  - Arreglo
-  - JavaScript
-  - Property
-  - Propiedad
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <strong><code>Array.prototype</code></strong> representa el prototipo del constructor {{jsxref("Array")}} y le permite agregar nuevas propiedades y métodos a todos los objetos Array.</p>
-
-<pre class="brush: js">// Si JavaScript no proporciona un método first() de forma nativa,
-// agrega un nuevo método que devuelve el primer elemento de una matriz.
-
-if (!Array.prototype.first) {
-  Array.prototype.first = function() {
-    return this[0];
-  }
-}
-</pre>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Las instancias {{jsxref("Array")}} heredan de <code>Array.prototype</code>. Al igual que con todos los constructores, puede cambiar el prototipo del constructor del objeto para realizar cambios en todas las instancias {{jsxref("Array")}} . Por ejemplo, puede agregar nuevos métodos y propiedades para extender todos los objetos <code>Array</code>. Esto se usa para {{Glossary("Polyfill", "polyfilling")}}, por ejemplo.</p>
-
-<p>Un hecho poco conocido: <code>Array.prototype</code> en sí es un {{jsxref("Array")}}:</p>
-
-<pre class="brush: js">Array.isArray(Array.prototype); // true</pre>
-
-<p>{{js_property_attributes(0, 0, 0)}}</p>
-
-<h2 id="Properties" name="Properties">Propiedades</h2>
-
-<dl>
- <dt><code>Array.prototype.constructor</code></dt>
- <dd>Especifica la función que crea el prototipo de un objeto.</dd>
- <dt>{{jsxref("Array.prototype.length")}}</dt>
- <dd>Refleja el número de elementos en un array.</dd>
- <dt>{{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}}</dt>
- <dd>Un símbolo que contiene nombres de propiedades para excluir de un ámbito vinculante <code><a href="/es/docs/Web/JavaScript/Reference/Statements/with">with</a></code>.</dd>
-</dl>
-
-<h2 id="Methods" name="Methods">Métodos</h2>
-
-<h3 id="Mutator_methods" name="Mutator_methods">Métodos de mutación</h3>
-
-<p>Estos métodos modifican el array:</p>
-
-<dl>
- <dt>{{jsxref("Array.prototype.copyWithin()")}}</dt>
- <dd>Copia una secuencia de elementos dentro del array.</dd>
- <dt>{{jsxref("Array.prototype.fill()")}}</dt>
- <dd>Rellena todos los elementos de un array desde un índice de inicio hasta un índice de fin con un valor determinado.</dd>
- <dt>{{jsxref("Array.prototype.pop()")}}</dt>
- <dd>Elimina el último elemento de un array y devuelve dicho elemento.</dd>
- <dt>{{jsxref("Array.prototype.push()")}}</dt>
- <dd>Añade uno o más elementos al final de un array y devuelve la nueva longitud del array.</dd>
- <dt>{{jsxref("Array.prototype.reverse()")}}</dt>
- <dd>Invierte el orden de los elementos de un array — el primero será el último y el último será el primero.</dd>
- <dt>{{jsxref("Array.prototype.shift()")}}</dt>
- <dd>Elimina el primer elemento de un array y devuelve dicho elemento.</dd>
- <dt>{{jsxref("Array.prototype.sort()")}}</dt>
- <dd>Ordena los elementos de un array y devuelve el array.</dd>
- <dt>{{jsxref("Array.prototype.splice()")}}</dt>
- <dd>Añade o elimina elementos de un array.</dd>
- <dt>{{jsxref("Array.prototype.unshift()")}}</dt>
- <dd>Añade uno o más elementos al principio del array y devuelve la nueva longitud del array.</dd>
-</dl>
-
-<h3 id="Accessor_methods" name="Accessor_methods">Métodos de consulta</h3>
-
-<p>Estos métodos no modifican el array y devuelven alguna representación del array.</p>
-
-<dl>
- <dt>{{jsxref("Array.prototype.concat()")}}</dt>
- <dd>Devuelve un nuevo array compuesto por este array unido con otro(s) array(s) y/o valor(es).</dd>
- <dt>{{jsxref("Array.prototype.includes()")}}</dt>
- <dd>Determina si un array contiene cierto elemento, devolviendo <code>true</code> o <code>false</code> apropiadamente.</dd>
- <dt>{{jsxref("Array.prototype.indexOf()")}}</dt>
- <dd>Devuelve el primer (menor) índice de un elemento dentro del array que sea igual al valor especificado, o -1 si no contiene dicho valor.</dd>
- <dt>{{jsxref("Array.prototype.join()")}}</dt>
- <dd>Une todos los elementos de un array en una cadena de texto.</dd>
- <dt>{{jsxref("Array.prototype.lastIndexOf()")}}</dt>
- <dd>Devuelve el último (mayor) índice de un elemento dentro del array que sea igual al valor especificado, o -1 si no contiene dicho valor.</dd>
- <dt>{{jsxref("Array.prototype.slice()")}}</dt>
- <dd>Extrae una sección de un array y devuelve un nuevo array.</dd>
- <dt>{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}}</dt>
- <dd>Devuelve el array literal que representa al propio array especificado; puedes usar este valor para crear un nuevo array. Reemplaza al método {{jsxref("Object.prototype.toSource()")}}.</dd>
- <dt>{{jsxref("Array.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena de texto que representa el array y sus elementos. Reemplaza el método {{jsxref("Object.prototype.toString()")}}.</dd>
- <dt>{{jsxref("Array.prototype.toLocaleString()")}}</dt>
- <dd>Devuelve una cadena de texto localizada que representa el array y sus elementos. Reemplaza el método {{jsxref("Object.prototype.toLocaleString()")}}.</dd>
-</dl>
-
-<h3 id="Iteration_methods" name="Iteration_methods">Métodos de iteración</h3>
-
-<p>Muchos métodos toman como argumentos funciones que son llamadas mientras se procesa el array. Cuando estos métodos son llamados, la longitud (<code style="font-style: normal;">length</code>) del array es muestreado, y cualquier elemento añadido por encima de esta longitud dentro de la función (<span style="font-family: consolas,monaco,andale mono,monospace;">callback</span>) no es visitado. Otros cambios sobre el array (establecer el valor o eliminar un elemento) podría afectar el resultado de la operación si el método visita el elemento después. Mientras que el comportamiento especifico de estos métodos en muchos casos es bien definido, no deberías delegar sobre eso con la finalidad de no confundir a otros que podrían leer tu código. Si debes modificar el array, copialo en un nuevo array en su lugar.</p>
-
-<dl>
- <dt>{{jsxref("Array.prototype.entries()")}}</dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los pares clave/valor para cada índice en el array.</dd>
- <dt>{{jsxref("Array.prototype.every()")}}</dt>
- <dd>Devuelve true si cada elemento en este array satisface la función de testeo proporcionada.</dd>
- <dt>{{jsxref("Array.prototype.filter()")}}</dt>
- <dd>Crea un nuevo array con todos los elementos de este array para los cuales la función de filtrado proporcionada devuelve true.</dd>
- <dt>{{jsxref("Array.prototype.find()")}}</dt>
- <dd>Devuelve el elemento hallado en el array si un elemento en el array satisface la función de testeo proporcionada, o <code>undefined</code> si no se halla ninguno.</dd>
- <dt>{{jsxref("Array.prototype.findIndex()")}}</dt>
- <dd>Devuelve el índice hallado en el array si un elemento en el array satisface la función de testeo proporcionada, o -1 si no se halla ninguno.</dd>
-</dl>
-
-<dl>
- <dt>{{jsxref("Array.prototype.forEach()")}}</dt>
- <dd>Llama a una función para cada elemento del array.</dd>
- <dt>{{jsxref("Array.prototype.keys()")}}</dt>
- <dd>Devuelve un nuevo <code>Array Iterator</code> que contiene las claves para cada índice en el array.</dd>
- <dt>{{jsxref("Array.prototype.map()")}}</dt>
- <dd>Crea un nuevo array con el resultado de llamar a la función proporcionada sobre cada elemento de este array.</dd>
- <dt>{{jsxref("Array.prototype.reduce()")}}</dt>
- <dd>Aplica una función que recibe un acumulador y cada valor del array (de izquierda a derecha) para reducirlo a un único valor.</dd>
- <dt>{{jsxref("Array.prototype.reduceRight()")}}</dt>
- <dd>Aplica una función que recibe un acumulador y cada valor del array (de derecha a izquierda) para reducirlo a un único valor.</dd>
- <dt>{{jsxref("Array.prototype.some()")}}</dt>
- <dd>Devuelve true si al menos un elemento en este array satisface la función de testeo proporcionada.</dd>
- <dt>{{jsxref("Array.prototype.values()")}}</dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array.</dd>
- <dt>{{jsxref("Array.prototype.@@iterator()", "Array.prototype[@@iterator]()")}}</dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array.</dd>
-</dl>
-
-<h3 id="Generic_methods" name="Generic_methods">Métodos genéricos (no estándar)</h3>
-
-<p>Muchos métodos en el objeto Javascript Array son diseñados para ser generalmente llamados para todos los objetos que "parecen" Arrays. Es decir, pueden ser usados sobre cualquier objeto que tenga una propiedad longitud (<code style="font-style: normal;">length</code>), y puedan ser accedidos usando nombres de propiedades numéricos (como con la indexación <code><span style="font-family: consolas,monaco,andale mono,monospace;">array[5]</span></code>). Algunos métodos, tales como {{jsxref("Array.join", "join")}}, sólo leen la <code>longitud</code> y propiedades numéricas del objeto sobre el cual son llamados. Otros, como {{jsxref("Array.reverse", "reverse")}}, requieren que las propiedades numéricas del objeto y la <code>longitud</code> sean mutables; estos métodos, por tanto, no pueden ser llamados sobre objetos como {{jsxref("String")}}, los cuales no permiten que su longitud o propiedades numéricas sintetizadas sean establecidas.</p>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<p> </p>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.3.1', 'Array.prototype')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype', 'Array.prototype')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>
-    <p>Se agregaron los métodos <code>copyWithin()</code>, <code>fill()</code>, <code>entries()</code>, <code>keys()</code>, <code>values()</code>, <code>find()</code>, <code>findIndex()</code>.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES7', '#sec-array.prototype', 'Array.prototype')}}</td>
-   <td>{{Spec2('ES7')}}</td>
-   <td>Se agregó el método <code>includes()</code>.</td>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.prototype")}}</div>
-
-<div id="compat-mobile"> </div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
- <li>{{jsxref("Function.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/push/index.html b/files/es/web/javascript/referencia/objetos_globales/array/push/index.html
deleted file mode 100644
index fc00ce7e7a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/push/index.html
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: Array.prototype.push()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/push
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/push
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>push()</strong></code> añade uno o más elementos al final de un array y devuelve la nueva longitud del array.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/array-push.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.push(<var>element1</var>[, ...[, <var>elementN</var>]])</pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>element<em>N</em></code></dt>
- <dd>Los elementos a añadir al final del array.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>La nueva propiedad {{jsxref("Array.length", "length")}} del objeto sobre el cual se efectuó la llamada.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>El método <code>push</code> es muy práctico para añadir valores a un array.</p>
-
-<p><code>push</code> es genérico intencionadamente. Este método puede ser {{jsxref("Function.call", "call()")}} o {{jsxref("Function.apply", "apply()")}} a objetos que representen arrays. El método <code>push</code> depende de la propiedad <code>length</code> para decidir donde empezar a insertar los valores dados. Si el valor de la propiedad <code>length</code> no puede ser convertido en numérico, el índice 0 es usado. Esto permite la posibilidad de que la propiedad <code>length</code> sea inexistente, y en este caso <code>length</code> será creado.</p>
-
-<p>Los únicos objetos nativos que se asemejen al array son {{jsxref("Global_Objects/String", "strings", "", 1)}} objetos, aunque estos no se puedan usar en la aplicación de este método ya que son inmutables.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Ejemplo: Añadiendo elementos a un array" name="Ejemplo: Añadiendo elementos a un array">Ejemplo: Añadiendo elementos a un array</h3>
-
-<p>El siguiente código crea el array <code>sports</code> que contiene dos elementos, luego añade 2 elementos más. Tras ejecutar el código, <code>sports</code> contiene 4 elementos: "soccer", "baseball", "football" and "swimming".</p>
-
-<pre class="brush: js">var sports = ['soccer', 'baseball'];
-var total = sports.push('football', 'swimming');
-
-console.log(sports); // ['soccer', 'baseball', 'football', 'swimming']
-console.log(total);  // 4
-</pre>
-
-<h3 id="Uniendo_dos_arrays">Uniendo dos arrays</h3>
-
-<p>This example uses {{jsxref("Function.apply", "apply()")}} to push all elements from a second array.</p>
-
-<p>Do <em>not</em> use this method if the second array (<code>moreVegs</code> in the example) is very large, because the maximum number of parameters that one function can take is limited in practice. See {{jsxref("Function.apply", "apply()")}} for more details.</p>
-
-<pre class="brush: js">var vegetables = ['parsnip', 'potato'];
-var moreVegs = ['celery', 'beetroot'];
-
-// Merge the second array into the first one
-// Equivalent to vegetables.push('celery', 'beetroot');
-Array.prototype.push.apply(vegetables, moreVegs);
-
-console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']
-</pre>
-
-<h3 id="Using_an_object_in_an_array-like_fashion">Using an object in an array-like fashion</h3>
-
-<p>Como se menciona anteriormente, <code>push</code> es intencionadamente genérico, y podemos usar eso a nuestro favor. <code>Array.prototype.push</code> puede funcionar bien con un objeto, como muestra este ejemplo. Ten en cuenta que no se crea un array para almacenar una colección de objetos. En su lugar, almacenamos la colección en el propio objeto y se utiliza el método <code>call</code> sobre <code>Array.prototype.push</code> para hacer creer al método que estamos tratando a un array, y simplemente funciona, gracias a la forma en que JavaScript nos permite establecer el contexto de la ejecución.</p>
-
-<pre class="brush: js">var obj = {
-    length: 0,
-
-    addElem: function addElem(elem) {
-        // obj.length is automatically incremented
-        // every time an element is added.
-        [].push.call(this, elem);
-    }
-};
-
-// Let's add some empty objects just to illustrate.
-obj.addElem({});
-obj.addElem({});
-console.log(obj.length);
-// → 2
-</pre>
-
-<p>Tenga en cuenta que aunque <code>obj</code> no es un array, el método <code>push</code> ha incrementado satisfactoriamente la propiedad <code>length</code> de <code>obj</code> tal y como si se tratara de un array.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.7', 'Array.prototype.push')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.push")}}</p>
-</div>
-
-<h2 id="Ver también" name="Ver también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.pop()")}}</li>
- <li>{{jsxref("Array.prototype.shift()")}}</li>
- <li>{{jsxref("Array.prototype.unshift()")}}</li>
- <li>{{jsxref("Array.prototype.concat()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/reduce/index.html b/files/es/web/javascript/referencia/objetos_globales/array/reduce/index.html
deleted file mode 100644
index 68d7a9cb2f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/reduce/index.html
+++ /dev/null
@@ -1,215 +0,0 @@
----
-title: Array.prototype.reduce()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/reduce
-tags:
-  - Array
-  - ECMAScript 5
-  - JavaScript
-  - Prototype
-  - Reduce
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/Reduce
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>reduce()</strong></code> ejecuta una función <strong>reductora</strong> sobre cada elemento de un array, devolviendo como resultado un único valor.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/array-reduce.html")}}</div>
-
-<p>La función <strong>reductora</strong> recibe cuatro argumentos:</p>
-
-<ol>
- <li>Acumulador (<code><em>acc</em></code>)</li>
- <li>Valor Actual (<code><em>cur</em></code>)</li>
- <li>Índice Actual (<em><code>idx</code></em>)</li>
- <li>Array (<em><code>src</code></em>)</li>
-</ol>
-
-<p>El valor devuelto de la función <strong>reductora</strong> se asigna al acumulador, cuyo valor se recuerda en cada iteración de la matriz y, en última instancia, se convierte en el valor final, único y resultante.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr.reduce(callback(acumulador, valorActual[, índice[, array]])[, valorInicial])</var></pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función a ejecutar sobre cada elemento del array (excepto para el primero, si no se proporciona <code>valorInicial</code>), que recibe cuatro parámetros:
- <dl>
-  <dt><code>acumulador</code></dt>
-  <dd>El acumulador acumula el valor devuelto por la función callback. Es el valor acumulado devuelto en la última invocación de callback, o el <code>valorInicial</code>, si se proveyó. (Ver a continuación).</dd>
-  <dt><code>valorActual</code></dt>
-  <dd>El elemento actual que está siendo procesado en el array.</dd>
-  <dt><code>índice</code> {{optional_inline}}</dt>
-  <dd>El índice del elemento actual que está siendo procesado en el array. Empieza desde el índice 0 si se provee <code>valorInicial</code>. En caso contrario, comienza desde el índice 1.</dd>
-  <dt><code>array</code> {{optional_inline}}</dt>
-  <dd>El array sobre el cual se llamó el método <code>reduce()</code>.</dd>
- </dl>
- </dd>
- <dt><code>valorInicial</code> {{optional_inline}}</dt>
- <dd>Un valor a usar como primer argumento en la primera llamada de la función <em><code>callback</code></em>. Si no se proporciona el <em><code>valorInicial</code></em>, el primer elemento del array será utilizado y saltado. Llamando a <code>reduce()</code> sobre un array vacío sin un <em><code>valorInicial</code></em> lanzará un {{jsxref("TypeError")}}.</dd>
-</dl>
-
-<h2 id="Descripción" name="Descripción">Descripción</h2>
-
-<p>El método <code>reduce()</code> ejecuta <code>callback</code> una vez por cada elemento presente en el array, excluyendo los huecos del mismo, recibe cuatro argumentos:</p>
-
-<ul>
- <li><code>valorAnterior</code></li>
- <li><code>valorActual</code></li>
- <li><code>indiceActual</code></li>
- <li><code>array</code></li>
-</ul>
-
-<p>La primera vez que se llama la función, <code>valorAnterior</code> y <code>valorActual</code> pueden tener uno de dos valores. Si se proveyó un <code>valorInicial</code> al llamar a <code>reduce</code>, entonces <code>valorAnterior</code> será igual al <code>valorInicial</code> y <code>valorActual</code> será igual al primer elemento del array. Si no se proveyó un <code>valorInicial</code>, entonces <code>valorAnterior</code> será igual al primer valor en el <code>array</code> y <code>valorActual</code> será el segundo.</p>
-
-<p>Si el <code>array</code> está vacío y no se proveyó un <code>valorInicial</code> lanzará un {{jsxref("Global_Objects/TypeError", "TypeError")}}. Si el <code>array</code> tiene un sólo elemento (sin importar la posición) y no se proveyó un <code>valorInicial</code>, o si se proveyó un <code>valorInicial</code> pero el arreglo está vacío, se retornará ese único valor sin llamar a la <code>función</code>.</p>
-
-<p>Suponga que ocurre el siguiente uso de <code>reduce</code>:</p>
-
-<pre class="brush: js">[0,1,2,3,4].reduce(function(valorAnterior, valorActual, indice, vector){
-  return valorAnterior + valorActual;
-});
-
-// Primera llamada
-valorAnterior = 0, valorActual = 1, indice = 1
-
-// Segunda llamada
-valorAnterior = 1, valorActual = 2, indice = 2
-
-// Tercera llamada
-valorAnterior = 3, valorActual = 3, indice = 3
-
-// Cuarta llamada
-valorAnterior = 6, valorActual = 4, indice = 4
-
-// el <code>array</code> sobre el que se llama a reduce siempre es el objeto [0,1,2,3,4]
-
-// Valor Devuelto: 10
-</pre>
-
-<p>Y si proporcionas un <code>valorInicial</code>, el resultado sería como este:</p>
-
-<pre class="brush: js">[0,1,2,3,4].reduce(function(valorAnterior, valorActual, indice, vector){
-  return valorAnterior + valorActual;
-}, 10);
-
-// Primera llamada
-valorAnterior = 10, valorActual = 0, indice = 0
-
-// Segunda llamada
-valorAnterior = 10, valorActual = 1, indice = 1
-
-// Tercera llamada
-valorAnterior = 11, valorActual = 2, indice = 2
-
-// Cuarta llamada
-valorAnterior = 13, valorActual = 3, indice = 3
-
-// Quinta llamada
-valorAnterior = 16, valorActual = 4, indice = 4
-
-// el <code>array</code> sobre el que se llama a reduce siempre es el objeto [0,1,2,3,4]
-
-// Valor Devuelto: 20
-</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<div class="note">
-<p><strong>Polyfill</strong> se refiere a unas líneas de código o un plugin que permite "tener"  (en realidad se simulan de alguna otra manera) las nuevas funcionalidades   de HTML5 en aquellos navegadores que nativamente no lo soportan. Consigue que, en adelante, el código sea transparente para el programador, como si el navegador soportase la funcionalidad nativamente.</p>
-</div>
-
-<p><code>reduce</code> es una extensión de JavaScript al estándar ECMA-262; como tal puede que no esté presente en otras implementaciones del estándar. Puedes trabajar con ésto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>reduce</code> en implementaciones de ECMA-262 que no lo implementan de modo nativo. Este algoritmo es exactamente el mismo usando en Firefox y SpiderMonkey.</p>
-
-<pre class="brush: js">if (!Array.prototype.reduce)
-{
-  Array.prototype.reduce = function(fun /*, inicial*/)
-  {
-    var longitud = this.length;
-    if (typeof fun != "function")
-      throw new TypeError();
-
-    // no se devuelve ningún valor si no hay valor inicial y el array está vacío
-    if (longitud == 0 &amp;&amp; arguments.length == 1)
-      throw new TypeError();
-
-    var indice = 0;
-    if (arguments.length &gt;= 2)
-    {
-      var rv = arguments[1];
-    }
-    else
-    {
-      do
-      {
-        if (indice in this)
-        {
-          rv = this[indice++];
-          break;
-        }
-
-        // si el array no contiene valores, no existe valor inicial a devolver
-        if (++indice &gt;= longitud)
-          throw new TypeError();
-      }
-      while (true);
-    }
-
-    for (; indice &lt; longitud; indice++)
-    {
-      if (indice in this)
-        rv = fun.call(null, rv, this[indice], indice, this);
-    }
-
-    return rv;
-  };
-}
-</pre>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Resumir_todos_los_valores_de_un_array" name="Ejemplo:_Resumir_todos_los_valores_de_un_array">Ejemplo: Sumar todos los valores de un <code>array</code></h3>
-
-<pre class="brush: js">var total = [0, 1, 2, 3].reduce(function(a, b){ return a + b; });
-// total == 6
-</pre>
-
-<h3 id="Ejemplo_Integrar_un_array_a_partir_de_varios_arrays" name="Ejemplo:_Integrar_un_array_a_partir_de_varios_arrays">Ejemplo: Integrar un <code>array</code> a partir de varios <code>arrays</code></h3>
-
-<pre class="brush: js">var integrado = [[0,1], [2,3], [4,5]].reduce(function(a,b) {
-  return a.concat(b);
-});
-// integrado es [0, 1, 2, 3, 4, 5]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.reduce', 'Array.prototype.reduce()')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.reduce")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.reduceRight()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/reduceright/index.html b/files/es/web/javascript/referencia/objetos_globales/array/reduceright/index.html
deleted file mode 100644
index cff59fddf4..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/reduceright/index.html
+++ /dev/null
@@ -1,166 +0,0 @@
----
-title: Array.prototype.reduceRight()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/reduceRight
-tags:
-  - Array
-  - ECMAScript5
-  - JavaScript
-  - JavaScript 1.8
-  - Method
-  - Prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight
----
-<div>{{JSRef("Objetos_globales", "Array")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Aplica una función simultáneamente contra un acumulador y cada elemento de un array (de derecha a izquierda) para reducirlo a un único valor.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="eval"><i>array</i>.reduceRight(
-<i>funcion</i>[,
-<i>valorInicial</i>])
-</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función a ejecutar para cada valor del array.</dd>
- <dt><code>initialValue</code></dt>
- <dd>Objeto a usar como primer argumento en la primera llamada de la <code>funcion</code>.</dd>
-</dl>
-
-<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
-
-<p><code>reduceRight</code> ejecuta la <code>funcion</code> una vez para cada elemento presente en el array, excluyendo los huecos del mismo, recibiendo cuatro argumentos: el valor inicial (o valor de la llamada previa de <code>funcion</code>), el valor del elemento actual, el índice actual y el array sobre el que ocurre la iteración.</p>
-
-<p>La llamada a la <code>funcion</code> de reduceRight sería similar a esto:</p>
-
-<pre class="brush: js">.reduceRight(function(valorPrevio, valorActual, indice, array){
-  // ...
-})
-</pre>
-
-<p>La primera vez que se llama a la función, el <code>valorPrevio</code> y el <code>valorActual</code> puede ser uno de los dos valores. Si se incluye un <code>valorInicial</code> en la llamada a <code>reduceRight</code>, entonces el <code>valorPrevio</code> será igual al <code>valorInicial</code> y el <code>valorActual</code> será igual al último valor del array. Si no se incluye ningún <code>valorInicial</code>, entonces el <code>valorPrevio</code> será igual al último valor del array y el <code>valorActual</code> será igual al penúltimo valor.</p>
-
-<p>Algún ejemplo de la ejecución de la función paso a paso sería similar a esto:</p>
-
-<pre class="brush: js">[0,1,2,3,4].reduceRight(function(valorPrevio, valorActual, indice, array){
-  return valorPrevio + valorActual;
-});
-
-// First call
-valorPrevio = 4, valorActual = 3, indice = 3
-
-// Second call
-valorPrevio = 7, valorActual = 2, indice = 2
-
-// Third call
-valorPrevio = 9, valorActual = 1, indice = 1
-
-// Fourth call
-valorPrevio = 10, valorActual = 0, indice = 0
-
-// el array sobre el que se llama a reduceRight siempre es el objeto [0,1,2,3,4]
-
-// Valor Devuelto: 10
-</pre>
-
-<p>Y si proporcionas un <code>valorInicial</code>, el resultado sería como este:</p>
-
-<pre class="brush: js">[0,1,2,3,4].reduceRight(function(valorPrevio, valorActual, indice, array){
-  return valorPrevio + currentValue;
-}, 10);
-
-// Primera llamada
-valorPrevio = 10, valorActual = 4, indice = 4
-
-// Segunda llamada
-valorPrevio = 14, valorActual = 3, indice = 3
-
-// Tercera llamada
-valorPrevio = 17, valorActual = 2, indice = 2
-
-// Cuarta llamada
-valorPrevio = 19, valorActual = 1, indice = 1
-
-// Quinta llamada
-valorPrevio = 20, valorActual = 0, indice = 0
-
-// el array sobre el que se llama a reduce siempre es el objeto [0,1,2,3,4]
-
-// Valor Devuelto: 20
-</pre>
-
-<h2 id="Compatibilidad" name="Compatibilidad">Compatibilidad</h2>
-
-<p><code>reduceRight</code> es una extensión de JavaScript al estándar ECMA-262; como tal puede que no esté presente en otras implementaciones del estándar. Puedes trabajar con ésto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>reduceRight</code> en implementaciones de ECMA-262 que no lo implementan de modo nativo. Este algoritmo es exactamente el mismo usando en Firefox y SpiderMonkey.</p>
-
-<pre class="brush: js">if (!Array.prototype.reduceRight)
-{
-  Array.prototype.reduceRight = function(fun /*, inicial*/)
-  {
-    var longitud = this.length;
-    if (typeof fun != "function")
-      throw new TypeError();
-
-    // no se devuelve ningún valor si no hay valor inicial y el array está vacío
-    if (longitud == 0 &amp;&amp; arguments.length == 1)
-      throw new TypeError();
-
-    var indice = longitud - 1;
-    if (arguments.length &gt;= 2)
-    {
-      var rv = arguments[1];
-    }
-    else
-    {
-      do
-      {
-        if (indice in this)
-        {
-          rv = this[indice--];
-          break;
-        }
-
-        // si el array no contiene valores, no existe valor incial a devolver
-        if (--indice &lt; 0)
-          throw new TypeError();
-      }
-      while (true);
-    }
-
-    for (; indice &gt;= 0; indice--)
-    {
-      if (indice in this)
-        rv = fun.call(null, rv, this[indice], indice, this);
-    }
-
-    return rv;
-  };
-}
-</pre>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplos:_Resumir_todos_los_valores_de_un_array" name="Ejemplos:_Resumir_todos_los_valores_de_un_array">Ejemplos: Resumir todos los valores de un array</h3>
-
-<pre class="brush: js">var total = [0, 1, 2, 3].reduceRight(function(a, b) { return a + b; });
-// total == 6
-</pre>
-
-<h3 id="Ejemplo:_Integrar_un_array_a_partir_de_varios_arrays" name="Ejemplo:_Integrar_un_array_a_partir_de_varios_arrays">Ejemplo: Integrar un array a partir de varios arrays</h3>
-
-<pre class="brush: js">var integrado = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
-  return a.concat(b);
-}, []);
-// integrado es [4, 5, 2, 3, 0, 1]
-</pre>
-
-<h2 id="V.C3.A9ase_tambi.C3.A9n" name="V.C3.A9ase_tambi.C3.A9n">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.reduce()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/reverse/index.html b/files/es/web/javascript/referencia/objetos_globales/array/reverse/index.html
deleted file mode 100644
index 7399f8dcda..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/reverse/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: Array.prototype.reverse()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/reverse
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/reverse
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>reverse()</strong></code> invierte el orden de los elementos de un array <em><a href="https://en.wikipedia.org/wiki/In-place_algorithm">in place</a></em>. El primer elemento pasa a ser el último y el último pasa a ser el primero.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-reverse.html")}}</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>a</var>.reverse()</pre>
-
-<h3 id="Valor devuelto" name="Valor devuelto">Valor devuelto</h3>
-
-<p>El array invertido.</p>
-
-<h2 id="Descripción" name="Descripción">Descripción</h2>
-
-<p>El método <code>reverse</code> cruza los elementos del objeto matriz invocados en su lugar, mutando la matriz, y retornando una referencia a la misma.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:Colocar al revés los elementos de un array" name="Ejemplo:Colocar al revés los elementos de un array">Colocar al revés los elementos de un array</h3>
-
-<p>El siguiente ejemplo crea un array <code>a</code> que contiene tres elementos y luego lo invierte.<br>
- La llamada a <code>reverse()</code> devuelve una referencia al array <code>a</code> invertido.</p>
-
-<pre class="brush: js">const a = [1, 2, 3];
-
-console.log(a); // [1, 2, 3]
-
-a.reverse();
-
-console.log(a); // [3, 2, 1]
-
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.8', 'Array.prototype.reverse')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad en navegadores" name="Compatibilidad en navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Array.reverse")}}</p>
-
-<h2 id="Ver también" name="Ver también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.join()")}}</li>
- <li>{{jsxref("Array.prototype.sort()")}}</li>
- <li>{{jsxref("TypedArray.prototype.reverse()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/shift/index.html b/files/es/web/javascript/referencia/objetos_globales/array/shift/index.html
deleted file mode 100644
index 7391f6c325..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/shift/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: Array.prototype.shift()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/shift
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/shift
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>shift()</strong></code> elimina el <strong>primer</strong> elemento del array y lo retorna. Este método modifica la longitud del array.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>arr</var>.shift()</code></pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>shift</code> elimina el elemento en el índice cero y desplaza los valores consecutivos hacia abajo, devolviendo el valor eliminado. Si la propiedad {{jsxref("Array.length", "length")}} es 0, devuelve {{jsxref("undefined")}}.</p>
-
-<p><code>shift</code> es genérico; este método puede utilizarse con {{jsxref("Function.call", "call", "", 1)}} o {{jsxref("Function.apply", "apply", "", 1)}} a objetos simliares a arrays. Los objetos que no tengan una propiedad <code>length</code> que refleje el último elemento de una serie consecutiva de propiedades numéricas con índice base cero pueden no comportarse de manera significativa.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Eliminando_un_elemento_de_un_array">Eliminando un elemento de un array</h3>
-
-<p>El siguiente código muestra el contenido del array <code>miPescado</code> antes y después de eliminar el primer elemento. También muestra el elemento eliminado:</p>
-
-<pre class="brush: js notranslate">var miPescado = ['ángel', 'payaso', 'mandarín', 'cirujano'];
-
-console.log('miPescado antes: ' + miPescado);
-// "miPescado antes: ángel,payaso,mandarín,cirujano"
-
-var eliminado = miPescado.shift();
-
-console.log('miPescado después: ' + miPescado);
-// "miPescado after: payaso,mandarín,cirujano"
-
-console.log('Elemento eliminado: ' + eliminado);
-// "Elemento eliminado: ángel"</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en Javascript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.9', 'Array.prototype.shift')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.shift', 'Array.prototype.shift')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("1.0")}}</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>{{CompatIE("5.5")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.push()")}}</li>
- <li>{{jsxref("Array.prototype.pop()")}}</li>
- <li>{{jsxref("Array.prototype.unshift()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/slice/index.html b/files/es/web/javascript/referencia/objetos_globales/array/slice/index.html
deleted file mode 100644
index e3ddd7e8a5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/slice/index.html
+++ /dev/null
@@ -1,287 +0,0 @@
----
-title: Array.prototype.slice()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/slice
-tags:
-  - Arreglo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice
----
-<div>{{JSRef}}</div>
-
-<p><code><font face="Open Sans, Arial, sans-serif">El método </font><strong>slice()</strong></code> devuelve una copia de una parte del array dentro de un nuevo array empezando por <em>inicio </em>hasta <em>fin</em> (<em>fin </em>no incluido). El array original no se modificará.</p>
-
-<p>El código fuente de esta demostración interactiva está alojado en un repositorio Github. Si desea contribuir con ella, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíenos un <em>"pull request"</em>.</p>
-
-<h2 id="Sintaxis">Sintaxis </h2>
-
-<pre class="syntaxbox"><code><var>arr</var>.slice([<var>inicio </var>[, <var>fin</var>]])</code></pre>
-
-<h2 id="Parámetros">Parámetros</h2>
-
-<dl>
- <dt><code>inicio</code></dt>
- <dd>Índice donde empieza la extracción. El primer elemento corresponde con el índice  0.</dd>
- <dd>Si el índice especificado es negativo, indica un desplazamiento desde el final del array.<code> slice(-2)</code>extrae los dos últimos elementos del array</dd>
- <dd>Si <code>inicio</code> es omitido el valor por defecto es <code>0</code>.</dd>
- <dd>Si <code>inicio</code> es mayor a la longitud del array, se devuelve un array vacío.</dd>
- <dt><code>fin</code></dt>
- <dd>Índice  que marca el final de la extracción. <code>slice</code> extrae hasta, pero sin incluir el final.</dd>
- <dd><code>slice(1,4)</code> extrae desde el segundo elemento hasta el cuarto  (los elementos con índices 1, 2,  y 3).</dd>
- <dd>Con un índice negativo, <code>fin</code> indica un desplazamiento desde el final de la secuencia. <code>slice(2,-1)</code> extrae desde el tercer hasta el penúltimo elemento en la secuencia.</dd>
- <dd>Si <code>fin</code> es omitido, slice extrae hasta el final de la secuencia (<code>arr.length</code>)<code>.</code></dd>
- <dd>Si <code>fin</code> es mayor a la longitud del array, <code>slice</code> extrae hasta el final de la secuencia (<code>arr.length</code>)<code>.</code></dd>
-</dl>
-
-<h3 id="Valor_de_retorno"><code>Valor de retorno</code></h3>
-
-<p>Un nuevo array con los valores extraídos.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>slice</code> <strong>no modifica</strong> el array original. Devuelve una copia plana (<em>shallow copy</em>) de los elementos especificados del array original. Los elementos del array original son copiados en el array devuelto de la siguiente manera:</p>
-
-<ul>
- <li>Para referencias de objeto ( <strong>no</strong> el objeto en sí ), <code>slice copia la referencia dentro del nuevo array</code>. Ambos, el array original y el nuevo, referencian al mismo objeto. Si un objeto referenciado cambia, los cambios son visibles para ambos arrays.</li>
- <li>Para strings, numbers y boolean (<strong>no</strong> objetos {{jsxref("Global_Objects/String", "String")}} y {{jsxref("Global_Objects/Number", "Number")}}), <code>slice</code> copia los valores en el nuevo array. Los cambios a los string, numbers y boolean en un array no afectan a los del otro array.</li>
-</ul>
-
-<p>Si un nuevo elemento es agregado a cualquiera de los arrays, el otro array no es afectado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Devolver_una_porción_de_un_array_existente">Ejemplo: Devolver una porción de un array existente</h3>
-
-<pre class="brush: js">var nombres = ['Rita', 'Pedro', 'Miguel', 'Ana', 'Vanesa'];
-var masculinos = nombres.slice(1, 3);
-
-// masculinos contiene ['Pedro','Miguel']
-</pre>
-
-<h3 id="Ejemplo_Utilizando_slice">Ejemplo: Utilizando slice</h3>
-
-<p><span style="font-size: 14px; line-height: 1.5;">Presta especial atención a:</span></p>
-
-<ul>
- <li>Valores de tipos básicos, como string o number, son copiados al nuevo array. Cambiar estos valores en la copia no afecta al array original.</li>
- <li>Las referencias también se copian. Mismas referencias acceden al mismo objeto destino. Cambios en el objeto destino son compartidos por todos sus accesos.</li>
-</ul>
-
-<p>En el siguiente ejemplo, <code>slice</code> crea un nuevo array, <code>nuevoCoche</code>, de <code>myCoche</code>. Los dos incluyen una referncia al objecto <code>miHonda</code> se cambia a púrpura, ambas matrices reflejan el cambio.</p>
-
-<pre class="brush: js"><code>var miHonda = { color: 'red', ruedas: 4, motor: { cilindros: 4, cantidad: 2.2 } };
-var miCoche = [miHonda, 2, 'Buen estado', 'comprado 1997'];
-var nuevoCoche = miCoche.slice(0, 2);</code>
-
-//  Muestra los valores de myCar, newCar y el color de myHonda.<code>
-console.log('miCoche = ' + JSON.stringify(miCoche));
-console.log('nuevoCoche = ' + JSON.stringify(nuevoCoche));
-console.log('miCoche[0].color = ' + miCoche[0].color);
-console.log('nuevoCoche[0].color = ' + nuevoCoche[0].color);</code>
-
-// Cambia el color de miHonda.
-miHonda.color = 'azul';
-console.log('El nuevo color de mi Honda es ' + miHonda.color);
-
-// Muestra el color de myHonda referenciado desde ambos arrays. <code>
-console.log('miCoche[0].color = ' + miCoche[0].color);</code>
-
-console.log('nuevoCoche[0].color = ' + nuevoCoche[0].color);</pre>
-
-<p>Este script escribe:</p>
-
-<pre class="brush: js"><code>miCoche = [{color: 'rojo', ruedas: 4, motor: {cilindros: 4, cantidad: 2.2}}, 2,
-         'buen estado', 'comprado 1997']
-nuevoCoche = [{color: 'rojo', ruedas: 4, motor: {cilindros: 4, cantidad: 2.2}}, 2]
-miCoche[0].color = rojo
-nuevoCoche[0].color = rojo
-El nuevo color de miHonda es azul
-miCoche[0].color = azul
-nuevoCoche[0].color = azul</code></pre>
-
-<h2 id="Objetos_array-like">Objetos array-like</h2>
-
-<div class="note">
-<p>Se dice que un objeto es <strong>array-like</strong> ( similar o que se asemeja a un array) cuando entre sus propiedades existen algunas cuyos nombres son <strong>números</strong> y en particular tiene una propiedad llamada <strong>length</strong>. Este hecho  hace  suponer que el objeto es algún tipo de colección de elementos indexados por números. Es conveniente, a veces, convertir estos objetos a arrays para otorgarles la funcionalidad que de serie se incorpora en todos los arrays a través de su prototipo. </p>
-</div>
-
-<p>El método <code>slice</code> puede ser usado para convertir objetos parecidos a arrays o colecciones a un nuevo Array. Simplemente debe enlazar el método al objeto. El  {{jsxref("Functions_and_function_scope/arguments", "arguments")}} dentro de una función es un ejemplo de un objeto parecido a arrays.</p>
-
-<pre class="brush: js">function list() {
-  return Array.prototype.slice.call(arguments, 0);
-}
-
-var list1 = list(1, 2, 3); // [1, 2, 3]
-</pre>
-
-<p>El enlazado puede realizarse con la función <code>.call</code> de  {{jsxref("Function.prototype")}} y puede ser abreviado también usando  <code>[].slice.call(arguments)</code> en lugar de <code>Array.prototype.slice.call</code>. En cualquier caso, puede ser simplificado usando {{jsxref("Function.prototype.bind", "bind")}}.</p>
-
-<pre class="brush: js">var unboundSlice = Array.prototype.slice;
-var slice = Function.prototype.call.bind(unboundSlice);
-
-function list() {
-  return slice(arguments, 0);
-}
-
-var list1 = list(1, 2, 3); // [1, 2, 3]
-</pre>
-
-<h2 id="Coordinación_del_comportamiento_entre_navegadores">Coordinación del comportamiento entre navegadores</h2>
-
-<p> </p>
-
-<p>La especificación permite a los objetos del host  ( entre ellos los objetos del DOM )  ser dependientes de la implementación.  Esta <strong>NO</strong> obligatoriedad, origina diferencias en el comportamiento entre aquellos comprometidos con los estándares, como Mozilla, y los que no. En lo que concierne a  <code>Array.prototype.slice</code> , por lo tanto, existen importantes incompatibilidades en IE &lt; 9 . Versiones de IE a partir de la 9 permiten un comportamiento compatible más fiable.  Se puede recurrir al  “<em>shimming</em>”  para alcanzar la compatibilidad en otros casos.  Mientras otros navegadores modernos continúan mejorando para soportar esta habilidad, en la forma en que actualmente lo hacen Mozilla, Chrome, Safari, Opera  e IE, los desarrolladores de código preocupados por el soporte DOM que confíen en este <em>shim</em> no deben dejarse engañar por la semántica, deben confiar de forma segura en ella para proporcionar el comportamiento estándar que aparentemente ahora es la norma.</p>
-
-<p>El <em>shim</em> también soluciona que IE pueda tratar con el caso de que el segundo argumento de <code>slice()</code> pueda ser un valor {{jsxref("Global_Objects/null", "null")}}/{{jsxref("Global_Objects/undefined", "undefined")}} explícito. Esto era un problema en versiones anteriores de IE, pero todos los navegadores modernos, incluído IE &gt;= 9, lo hacen actualmente.</p>
-
-<pre class="brush: js">/**
- * <em>Shim</em> para "solucionar" la falta de soporte de IE (IE &lt; 9) para aplicar slice
- * sobre objetos del host, tal como NamedNodeMap, NodeList, y HTMLCollection
- * (técnicamente, al ser los objetos del host dependientes de la implementación,
- * al menos anteriormente a ES2015, IE no tenía la necesidad de trabajar de este modo).
- * También funciona sobre strings, solucionando que IE &lt; 9 admita un undefined explícito
- * como segundo argumento (igual que en Firefox), y previniendo errores cuando se llama
- * sobre otros objetos del DOM.
- */
-(function () {
-  'use strict';
-  var _slice = Array.prototype.slice;
-
-  try {
-    // Fallará al usarse con elementos DOM en IE &lt; 9
-    _slice.call(document.documentElement);
-  } catch (e) { // Fails in IE &lt; 9
-    // Funcionará con arrays genuinos, objetos array-like,
-    // NamedNodeMap (attributes, entities, notations),
-    // NodeList (e.g., getElementsByTagName), HTMLCollection (e.g., childNodes),
-    // and will not fail on other DOM objects (as do DOM elements in IE &lt; 9)
-    Array.prototype.slice = function(begin, end) {
-      // A IE &lt; 9 no le gustan los undefined como argumento end.
-      end = (typeof end !== 'undefined') ? end : this.length;
-
-      // Con objetos Array nativos, podemos usar la función slice
-      if (Object.prototype.toString.call(this) === '[object Array]'){
-        return _slice.call(this, begin, end);
-      }
-
-      // Con objetos array-like debemos manejarlo por nuestra cuenta.
-      var i, cloned = [],
-        size, len = this.length;
-
-      // Maneja valores negativos para el argumento "inicio"
-      var start = begin || 0;
-      start = (start &gt;= 0) ? start : Math.max(0, len + start);
-
-      // Maneja valores negativos para el argumento "fin"
-      var upTo = (typeof end == 'number') ? Math.min(end, len) : len;
-      if (end &lt; 0) {
-        upTo = len + end;
-      }
-
-      // Tamaño esperado para el slice
-      size = upTo - start;
-
-      if (size &gt; 0) {
-        cloned = new Array(size);
-        if (this.charAt) {
-          for (i = 0; i &lt; size; i++) {
-            cloned[i] = this.charAt(start + i);
-          }
-        } else {
-          for (i = 0; i &lt; size; i++) {
-            cloned[i] = this[start + i];
-          }
-        }
-      }
-
-      return cloned;
-    };
-  }
-}());
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 3ª edición</td>
-   <td>Estandar</td>
-   <td>Definición inicial Implementado en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.10', 'Array.prototype.slice')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-array.prototype.slice', 'Array.prototype.slice')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>La tabla de compatibilidad en esta página esta generada desde datos estructurados. Si desea contribuir con los datos, por favor <em>"checkout" </em><a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data </a> y envíenos un <em>"pull request"</em>.</p>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("1.0")}}</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también </h2>
-
-<ul>
- <li>{{jsxref("Function.prototype.call()")}}</li>
- <li>{{jsxref("Function.prototype.bind()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/some/index.html b/files/es/web/javascript/referencia/objetos_globales/array/some/index.html
deleted file mode 100644
index d04b57b025..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/some/index.html
+++ /dev/null
@@ -1,204 +0,0 @@
----
-title: Array.prototype.some()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/some
-tags:
-  - Array
-  - ECMAScript5
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/some
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>some()</strong></code> comprueba si al menos un elemento del array cumple con la condición implementada por la función proporcionada.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Este método devuelve <code>false</code> para cualquier condición puesta en un array vacío.</p>
-</div>
-
-<div>{{EmbedInteractiveExample("pages/js/array-some.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.some(<var>callback(element[, index[, array]])</var>[, <var>thisArg</var>])</pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función que verifica cada elemento, toma tres argumentos:
- <dl>
-  <dt><code>element</code></dt>
-  <dd>El elemento actual siendo procesado en el array.</dd>
-  <dt><code>index</code> {{Optional_inline}}</dt>
-  <dd>El índice del elemento del array que se está procesando.</dd>
-  <dt><code>array</code> {{Optional_inline}}</dt>
-  <dd>El array sobre el que ha sido llamada la función <code>some()</code>.</dd>
- </dl>
- </dd>
- <dt><code>thisArg</code> {{Optional_inline}}</dt>
- <dd>Valor a usar como <code>this</code> cuando se ejecute <code>callback</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p><code><strong>true</strong></code> si la función <code>callback</code> devuelve un valor {{Glossary("truthy")}} para cualquier elemento del array; en caso contrario, <code><strong>false</strong></code>.</p>
-
-<h2 id="Descripción" name="Descripción">Descripción</h2>
-
-<p><code>some()</code> ejecuta la función <code>callback</code> una vez por cada elemento presente en el array hasta que encuentre uno donde <code>callback</code> retorna un valor verdadero (true). Si se encuentra dicho elemento, <code>some()</code> retorna <code>true</code> inmediatamente. Si no, <code>some()</code> retorna <code>false</code>. <code>callback</code> es invocada sólo para los índices del array que tienen valores asignados; no es invocada para índices que han sido borrados o a los que nunca se les han asignado valores.</p>
-
-<p><code>callback</code> es invocada con tres argumentos: el valor del elemento, el índice del elemento, y el objeto array sobre el que se itera.</p>
-
-<p>Si se indica un parámetro <code>thisArg</code> a <code>some()</code>, se pasará a <code>callback</code> cuando es invocada, para usar como valor <code>this</code>. Si no, el valor {{jsxref("undefined")}} será pasado para usar como valor <code>this</code>. El valor <code>this</code> value observable por <code>callback</code> se determina de acuerdo a <a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">las reglas habituales para determinar el <code>this</code> visible por una función</a>.</p>
-
-<p><code>some()</code> no modifica el array con el cual fue llamada.</p>
-
-<p>El rango de elementos procesados por <code>some()</code> es configurado antes de la primera invocación de <code>callback</code>. Los elementos anexados al array luego de que comience la llamada a <code>some()</code> no serán visitados por <code>callback</code>. Si un elemento existente y no visitado del array es alterado por <code>callback</code>, su valor pasado al <code>callback</code> será el valor al momento que <code>some()</code> visita el índice del elemento; los elementos borrados no son visitados.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Testing_size_of_all_array_elements" name="Example:_Testing_size_of_all_array_elements">Verificando el valor de los elementos de un array</h3>
-
-<p>El siguiente ejemplo verifica si algún elemento del array es mayor a 10.</p>
-
-<pre class="brush: js">function isBiggerThan10(element, index, array) {
-  return element &gt; 10;
-}
-[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
-[12, 5, 8, 1, 4].some(isBiggerThan10); // true
-</pre>
-
-<h3 id="Example:_Testing_array_elements_using_arrow_functions" name="Example:_Testing_array_elements_using_arrow_functions">Verificando los elementos de un array usando funciones flecha</h3>
-
-<p><a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">Las funciones flecha (Arrow functions)</a> brindan una sintáxis más corta para el mismo test.</p>
-
-<pre class="brush: js">[2, 5, 8, 1, 4].some(elem =&gt; elem &gt; 10);  // false
-[12, 5, 8, 1, 4].some(elem =&gt; elem &gt; 10); // true
-</pre>
-
-<h3 id="Comprobando_si_un_elemento_existe_en_un_array">Comprobando si un elemento existe en un array</h3>
-
-<p>Para imitar la función del método <code>includes()</code>, esta función personalizada devuelve <code>true</code> si el elemento existe en el array:</p>
-
-<pre class="brush: js">var fruits = ['apple', 'banana', 'mango', 'guava'];
-
-function checkAvailability(arr, val) {
-  return arr.some(function(arrVal) {
-    return val === arrVal;
-  });
-}
-
-checkAvailability(fruits, 'kela');   // false
-checkAvailability(fruits, 'banana'); // true</pre>
-
-<h3 id="Comprobando_si_un_elemento_existe_en_un_array_con_funciones_flecha">Comprobando si un elemento existe en un array con funciones flecha</h3>
-
-<pre class="brush: js">var fruits = ['apple', 'banana', 'mango', 'guava'];
-
-function checkAvailability(arr, val) {
-  return arr.some(arrVal =&gt; val === arrVal);
-}
-
-checkAvailability(fruits, 'kela');   // false
-checkAvailability(fruits, 'banana'); // true</pre>
-
-<h3 id="Convirtiendo_cualquier_valor_a_Boolean">Convirtiendo cualquier valor a Boolean</h3>
-
-<pre class="brush: js">var TRUTHY_VALUES = [true, 'true', 1];
-
-function getBoolean(value) {
-  'use strict';
-
-  if (typeof value === 'string') {
-    value = value.toLowerCase().trim();
-  }
-
-  return TRUTHY_VALUES.some(function(t) {
-    return t === value;
-  });
-}
-
-getBoolean(false);   // false
-getBoolean('false'); // false
-getBoolean(1);       // true
-getBoolean('true');  // true</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<p><code>some()</code> fue agregado al estándar ECMA-262 en la 5ta edición; por ello, puede no estar presente en todas las implementaciones del estándar. Puedes trabajar sobre esto insertando el siguiente código al comienzo de tus scripts, permitiendo el uso de <code>some()</code> en implementaciones que no tienen soporte nativo. Este algoritmo es exactamente el mismo especificado en ECMA-262, 5ta edición, asumiendo que {{jsxref("Global_Objects/Object", "Object")}} y {{jsxref("Global_Objects/TypeError", "TypeError")}} tienen sus valores originales y que <code>fun.call</code> evalúa el valor original de{{jsxref("Function.prototype.call()")}}.</p>
-
-<pre class="brush: js">// Pasos de producción de ECMA-262, Edición 5, 15.4.4.17
-// Referencia: http://es5.github.io/#x15.4.4.17
-if (!Array.prototype.some) {
-  Array.prototype.some = function(fun/*, thisArg*/) {
-    'use strict';
-
-    if (this == null) {
-      throw new TypeError('Array.prototype.some called on null or undefined');
-    }
-
-    if (typeof fun !== 'function') {
-      throw new TypeError();
-    }
-
-    var t = Object(this);
-    var len = t.length &gt;&gt;&gt; 0;
-
-    var thisArg = arguments.length &gt;= 2 ? arguments[1] : void 0;
-    for (var i = 0; i &lt; len; i++) {
-      if (i in t &amp;&amp; fun.call(thisArg, t[i], i, t)) {
-        return true;
-      }
-    }
-
-    return false;
-  };
-}
-</pre>
-
-<h2 id="Especificaciones" name="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.17', 'Array.prototype.some')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.some', 'Array.prototype.some')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.some', 'Array.prototype.some')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores" name="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.some")}}</p>
-</div>
-
-<h2 id="Ver_también" name="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Array.prototype.every()")}}</li>
- <li>{{jsxref("Array.prototype.find()")}}</li>
- <li>{{jsxref("TypedArray.prototype.some()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/sort/index.html b/files/es/web/javascript/referencia/objetos_globales/array/sort/index.html
deleted file mode 100644
index ac28826327..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/sort/index.html
+++ /dev/null
@@ -1,301 +0,0 @@
----
-title: Array.prototype.sort()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/sort
-tags:
-  - Array
-  - JavaScript
-  - Método(2)
-  - Prototipo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/sort
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>sort()</strong></code> ordena los elementos de un arreglo (array) <em>localmente</em> y devuelve el arreglo ordenado. La ordenación no es necesariamente <a href="https://en.wikipedia.org/wiki/Sorting_algorithm#Stability">estable</a>. El modo de ordenación por defecto responde a la posición del valor del string de acuerdo a su valor <a href="https://es.wikipedia.org/wiki/Unicode">Unicode</a>.</p>
-
-<p id="tw-target-text">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción (pull request).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>arr</var>.sort([<var>compareFunction</var>])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>compareFunction</code></dt>
- <dd>Opcional. Especifica una función que define el modo de ordenamiento. Si se omite, el array es ordenado atendiendo a la posición del valor <a href="/en-US/docs/Web/JavaScript/Guide/Values,_variables,_and_literals#Unicode">Unicode</a> de cada caracter, según la conversión a string de cada elemento.</dd>
- <dt><code>firstEl</code></dt>
- <dd>El primer elemento a comparar.</dd>
- <dt><code>secondEl</code></dt>
- <dd>El segundo elemento a comparar.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El array ordenado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si no se provee <code>compareFunction</code>, los elementos son ordenados convirtiéndolos a strings y comparando la posición del valor Unicode de dichos strings. Por ejemplo, "Cherry" viene antes que "banana"  (porque las mayúsculas van antes que las minúsculas en la codificación Unicode) . En un ordenamiento numérico, 9 está antes que 80, pero dado que los números son convertidos a strings y ordenados según el valor Unicode, el resultado será "80" antes que "9".</p>
-
-<pre class="brush: js notranslate">var frutas = ['guindas', 'manzanas', 'bananas'];
-frutas.sort(); // ['bananas', 'guindas', 'manzanas']
-
-var puntos = [1, 10, 2, 21];
-puntos.sort(); // [1, 10, 2, 21]
-// Tenga en cuenta que 10 viene antes que 2
-// porque '10' viene antes que '2' según la posición del valor Unicode.
-
-var cosas = ['word', 'Word', '1 Word', '2 Words'];
-cosas.sort(); // ['1 Word', '2 Words', 'Word', 'word']
-// En Unicode, los números vienen antes que las letras mayúsculas
-// y estas vienen antes que las letras minúsculas.
-</pre>
-
-<p>Si se provee <code>compareFunction</code>, los elementos del array son ordenados de acuerdo al valor que retorna dicha función de comparación. Siendo <code>a</code> y <code>b</code> dos elementos comparados, entonces:</p>
-
-<ul>
- <li>Si <code>compareFunction(a, b)</code> es menor que 0, se sitúa <code>a</code> en un indice menor que <code>b</code>. Es decir, <code>a</code> viene primero.</li>
- <li>Si <code>compareFunction(a, b)</code> retorna 0, se deja <code>a</code> y <code>b</code> sin cambios entre ellos, pero ordenados con respecto a todos los elementos diferentes. Nota: el estandar ECMAscript no garantiza este comportamiento, por esto no todos los navegadores (p.ej.  Mozilla en versiones que datan hasta el 2003) respetan esto.</li>
- <li>Si <code>compareFunction(a, b)</code> es mayor que 0, se sitúa <code>b</code> en un indice menor que <code>a</code>.</li>
- <li><code>compareFunction(a, b)</code> siempre debe retornar el mismo valor dado un par especifico de elementos a y b como sus argumentos. Si se retornan resultados inconsistentes entonces el orden de ordenamiento es indefinido.</li>
-</ul>
-
-<p>Entonces, la función de comparación tiene la siguiente forma:</p>
-
-<pre class="brush: js notranslate">function compare(a, b) {
-  if (a es menor que b según criterio de ordenamiento) {
-    return -1;
-  }
-  if (a es mayor que b según criterio de ordenamiento) {
-    return 1;
-  }
-  // a debe ser igual b
-  return 0;
-}
-</pre>
-
-<p>Para comparar números en lugar de strings, la función de comparación puede simplemente restar <code>b</code> de <code>a</code>. La siguiente función ordena el array de modo ascendente:</p>
-
-<pre class="brush: js notranslate">function compareNumbers(a, b) {
-  return a - b;
-}
-</pre>
-
-<p>El metodo <code>sort</code> puede ser usado convenientemente con {{jsxref("Operators/function", "function expressions", "", 1)}} (y <a href="/en-US/docs/Web/JavaScript/Guide/Closures">closures</a>):</p>
-
-<pre class="brush: js notranslate">var numbers = [4, 2, 5, 1, 3];
-numbers.sort(function(a, b) {
-  return a - b;
-});
-console.log(numbers);
-
-</pre>
-
-<pre class="notranslate"><code>// [1, 2, 3, 4, 5]</code></pre>
-
-<p>Los objectos pueden ser ordenados por el valor de una de sus propiedades.</p>
-
-<pre class="brush: js notranslate">var items = [
-  { name: 'Edward', value: 21 },
-  { name: 'Sharpe', value: 37 },
-  { name: 'And', value: 45 },
-  { name: 'The', value: -12 },
-  { name: 'Magnetic', value: 13 },
-  { name: 'Zeros', value: 37 }
-];
-items.sort(function (a, b) {
-  if (a.name &gt; b.name) {
-    return 1;
-  }
-  if (a.name &lt; b.name) {
-    return -1;
-  }
-  // a must be equal to b
-  return 0;
-});
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Creating.2C_displaying.2C_and_sorting_an_array" name="Creating.2C_displaying.2C_and_sorting_an_array">Ordenando un array</h3>
-
-<p>Un array de elementos string, sin especificar una función de comparación:</p>
-
-<pre class="brush: js notranslate">var arr = [ 'a', 'b', 'Z', 'Aa', 'AA' ];
-arr.sort();  //[ 'AA', 'Aa', 'Z', 'a', 'b' ]
-</pre>
-
-<p>Un array de elementos numéricos,  sin función de comparación:</p>
-
-<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
-arr.sort();  //[ 1, 200, 40, 5 ]
-</pre>
-
-<p>Un array de elementos numéricos, usando una función de comparación:</p>
-
-<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
-function comparar ( a, b ){ return a - b; }
-arr.sort( comparar );  // [ 1, 5, 40, 200 ]</pre>
-
-<p>Lo mismo pero usando una función anónima normal:</p>
-
-<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
-arr.sort(function(a,b){return a - b;});  // [ 1, 5, 40, 200 ]</pre>
-
-<p>Lo mismo escrito más compacto mediante una <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">función flecha</a>:</p>
-
-<pre class="brush: js notranslate">var arr = [ 40, 1, 5, 200 ];
-arr.sort((a,b)=&gt;a-b);  // [ 1, 5, 40, 200 ]</pre>
-
-<h3 id="Creating.2C_displaying.2C_and_sorting_an_array" name="Creating.2C_displaying.2C_and_sorting_an_array"></h3>
-
-<h3 id="Creating.2C_displaying.2C_and_sorting_an_array" name="Creating.2C_displaying.2C_and_sorting_an_array">Creando, mostrando, y ordenando un array</h3>
-
-<p>El siguiente ejemplo abunda en la idea de ordenar con y sin función de comparación. Además, ilustra una manera de mostrar un array una vez creado. El método <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/join">join</a> es usado para convertir el array en una cadena de texto que imprimir. Al no pasarle un argumento que indique el separador, usará la coma por defecto para separar los elementos del array dentro de la cadena.</p>
-
-<pre class="brush: js notranslate">var arr = ['80', '9', '700', 40, 1, 5, 200];
-function comparar(a, b) {
-  return a - b;
-}
-console.log('original:', arr.join());
-console.log('ordenado sin función:', arr.sort());
-console.log('ordenado con función:', arr.sort(comparar));
-</pre>
-
-<p>El ejemplo produce el siguiente resultado. Como muestra la salida, cuando una función de comparación es usada, los números se ordenan correctamente, sean estos valores numéricos o strings numéricos.</p>
-
-<pre class="notranslate">original: 80,9,700,40,1,5,200
-ordenado sin función: 1,200,40,5,700,80,9
-ordenado con función: 1,5,9,40,80,200,700
-</pre>
-
-<h3 id="Ordenando_caracteres_no_ASCII">Ordenando caracteres no ASCII</h3>
-
-<p>Para ordenar strings con characters no ASCII, i.e. strings con caracteres con acento (e, é, è, a, ä, etc.), strings de lenguajes diferentes al inglés: use {{jsxref("String.localeCompare")}}. Esta función puede comparar esos caracteres para que aparezcan en el orden correcto.</p>
-
-<pre class="brush: js notranslate">var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];
-items.sort(function (a, b) {
-  return a.localeCompare(b);
-});
-
-// items is ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']
-</pre>
-
-<h3 id="Ordenando_con_map">Ordenando con map</h3>
-
-<p>La <code>compareFunction</code> puede ser invocada múltiples veces por elemento dentro del array. Dependiendo de la naturaleza de <code>compareFunction</code>, este puede resultar en una alta penalización de rendimiento. Cuanto más trabajo hace una <code>compareFunction</code> y más elementos hay para ordenar, resulta más recomendable usar una función <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map">map</a> para ordenar. La idea es recorrer el array una sola vez para extraer los valores usados para ordenar en un array temporal, ordenar el array temporal y luego recorrer el array para lograr el orden correcto.</p>
-
-<pre class="brush: js notranslate">// el array a ordenar
-var list = ['Delta', 'alpha', 'CHARLIE', 'bravo'];
-
-// array temporal contiene objetos con posición y valor de ordenamiento
-var mapped = list.map(function(el, i) {
-  return { index: i, value: el.toLowerCase() };
-})
-
-// ordenando el array mapeado que contiene los valores reducidos
-mapped.sort(function(a, b) {
-  if (a.value &gt; b.value) {
-    return 1;
-  }
-  if (a.value &lt; b.value) {
-    return -1;
-  }
-  return 0;
-});
-
-// contenedor para el orden resultante
-var result = mapped.map(function(el){
-  return list[el.index];
-});
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition</td>
-   <td>Standard</td>
-   <td>Definicióñ inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.11', 'Array.prototype.sort')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.sort', 'Array.prototype.sort')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome("1.0")}}</td>
-   <td>{{CompatGeckoDesktop("1.7")}}</td>
-   <td>{{CompatIE("5.5")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Compatibilidad_en_navegadores_2">Compatibilidad en navegadores</h2>
-
-<p>La tabla de compatibilidad en esta página es generada por una data estructurada. Si deseas contribuir a la data, por favor entra a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.reverse()")}}</li>
- <li>{{jsxref("String.prototype.localeCompare()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/splice/index.html b/files/es/web/javascript/referencia/objetos_globales/array/splice/index.html
deleted file mode 100644
index 5d7992a2c4..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/splice/index.html
+++ /dev/null
@@ -1,148 +0,0 @@
----
-title: Array.prototype.splice()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/splice
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/splice
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>splice()</strong></code> cambia el contenido de un array eliminando elementos existentes y/o agregando nuevos elementos.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-splice.html")}}</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>array</var>.splice(<var>start[</var>, <var>deleteCount[</var>, <var>item1[</var>, <var>item2[</var>, <em>...]]]]</em>)
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>start</code></dt>
- <dd>Índice donde se comenzará a cambiar el array (con 0 como origen). Si es mayor que la longitud del array, el punto inicial será la longitud del array. Si es negativo, empezará esa cantidad de elementos contando desde el final.</dd>
- <dt><code>deleteCount</code> {{optional_inline}}</dt>
- <dd>Un entero indicando el número de elementos a eliminar del array antiguo.</dd>
- <dd>Si <code>deleteCount</code> se omite, o si su valor es mayor que <code>arr.length - start</code> (esto significa, si es mayor que el número de elementos restantes del array, comenzando desde <code>start</code>), entonces todos los elementos desde <code>start</code> hasta el final del array serán eliminados.</dd>
- <dd>Si <code>deleteCount</code> es igual a 0 o negativo, no se eliminará ningún elemento. En este caso, se debe especificar al menos un nuevo elemento (ver más abajo).</dd>
- <dt><code>item1, item2, <em>...</em></code>  {{optional_inline}}</dt>
- <dd>Los elementos que se agregarán al array, empezando en el índice <code>start</code>. Si no se especifica ningún elemento, <code>splice()</code> solamente eliminará elementos del array.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un array que contiene los elementos eliminados. Si sólo se ha eliminado un elemento, devuelve un array con un solo elemento. Si no se ha eliminado ningún elemento, devuelve un array vacío.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si especifica un número diferente de elementos a agregar que los que se eliminarán, el array tendrá un tamaño diferente al original una vez finalizada la llamada.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Eliminar_0_elementos_desde_el_índice_2_e_insertar_drum">Eliminar 0 elementos desde el índice 2 e insertar "drum"</h3>
-
-<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
-var removed = myFish.splice(2, 0, 'drum');
-
-// myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"]
-// removed is [], no elements removed
-</pre>
-
-<h3 id="Eliminar_1_elemento_desde_el_índice_3">Eliminar 1 elemento desde el índice 3</h3>
-
-<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
-var removed = myFish.splice(3, 1);
-
-// removed is ["mandarin"]
-// myFish is ["angel", "clown", "drum", "sturgeon"]
-</pre>
-
-<h3 id="Eliminar_1_elemento_desde_el_índice_2_e_insertar_trumpet">Eliminar 1 elemento desde el índice 2 e insertar "trumpet"</h3>
-
-<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'sturgeon'];
-var removed = myFish.splice(2, 1, 'trumpet');
-
-// myFish is ["angel", "clown", "trumpet", "sturgeon"]
-// removed is ["drum"]</pre>
-
-<h3 id="Eliminar_2_elementos_desde_el_índice_0_e_insertar_parrot_anemone_y_blue">Eliminar 2 elementos desde el índice 0 e insertar "parrot", "anemone" y "blue"</h3>
-
-<pre class="brush: js">var myFish = ['angel', 'clown', 'trumpet', 'sturgeon'];
-var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');
-
-// myFish is ["parrot", "anemone", "blue", "trumpet", "sturgeon"]
-// removed is ["angel", "clown"]</pre>
-
-<h3 id="Eliminar_2_elementos_desde_el_índice_2">Eliminar 2 elementos desde el índice 2</h3>
-
-<pre class="brush: js">var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
-var removed = myFish.splice(myFish.length - 3, 2);
-
-// myFish is ["parrot", "anemone", "sturgeon"]
-// removed is ["blue", "trumpet"]</pre>
-
-<h3 id="Eliminar_1_elemento_desde_el_índice_-2">Eliminar 1 elemento desde el índice -2</h3>
-
-<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
-var removed = myFish.splice(-2, 1);
-
-// myFish is ["angel", "clown", "sturgeon"]
-// removed is ["mandarin"]</pre>
-
-<h3 id="Eliminar_todos_los_elementos_tras_el_índice_2_(incl.)">Eliminar todos los elementos tras el índice 2 (incl.)</h3>
-
-<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
-var removed = myFish.splice(2);
-
-// myFish is ["angel", "clown"]
-// removed is ["mandarin", "sturgeon"]</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.12', 'Array.prototype.splice')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.splice")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.push()", "push()")}} / {{jsxref("Array.prototype.pop()", "pop()")}} — añade/elimina elementos desde el final de un array</li>
- <li>{{jsxref("Array.prototype.unshift()", "unshift()")}} / {{jsxref("Array.prototype.shift()", "shift()")}} — añade/elimina elementos desde el principio de un array</li>
- <li>{{jsxref("Array.prototype.concat()", "concat()")}} — devuelve un nuevo array compuesto por este array unido a otro/s array/s y/o valor/es</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/tolocalestring/index.html b/files/es/web/javascript/referencia/objetos_globales/array/tolocalestring/index.html
deleted file mode 100644
index 0fc418ab47..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/tolocalestring/index.html
+++ /dev/null
@@ -1,177 +0,0 @@
----
-title: Array.prototype.toLocaleString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/toLocaleString
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>toLocaleString()</strong></code> devuelve una cadena de texto representando los elementos del array. Los elementos son convertidos a texto usando su método <code>toLocaleString</code>  y dichos Strings son separados por un caracter específico para la localidad (como una coma para la separación de decimales “,”).</p>
-
-<div>{{EmbedInteractiveExample("pages/js/array-tolocalestring.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.toLocaleString([<var>locales[</var>, <var>options]]</var>);
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>locales</code> {{optional_inline}}</dt>
- <dd>Una cadena de texto con una etiqueta de idioma BCP 47, o un array de dichos strings. Para la forma general e interpretación the los argumentos <code>locales</code>, ver la página {{jsxref("Intl")}}.</dd>
- <dt><code>options</code> {{optional_inline}}</dt>
- <dd>Un objeto con las configuraciones, para números ver {{jsxref("Number.prototype.toLocaleString()")}}, y para fechas ver {{jsxref("Date.prototype.toLocaleString()")}}.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una cadena de texto representando los elementos del array.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_locales_y_options">Usando <code>locales</code> y <code>options</code></h3>
-
-<p>Los elementos del array son convertidos a strings usando sus métodos <code>toLocaleString</code>.</p>
-
-<ul>
- <li><code>Object</code>: {{jsxref("Object.prototype.toLocaleString()")}}</li>
- <li><code>Number</code>: {{jsxref("Number.prototype.toLocaleString()")}}</li>
- <li><code>Date</code>: {{jsxref("Date.prototype.toLocaleString()")}}</li>
-</ul>
-
-<p>Siempre mostrar la moneda para los strings y números en el array <code>precios</code>:</p>
-
-<pre class="brush: js">var precios = ['$7', 500, 8123, 12];
-precios.toLocaleString('es-AR', { style: 'currency', currency: 'ARS' });
-
-// "$7, $500, $8.123, $12"
-</pre>
-
-<p>Para más ejemplos, ver también {{jsxref("Intl")}}, {{jsxref("NumberFormat")}}, y {{jsxref("DateTimeFormat")}}.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">// https://tc39.github.io/ecma402/#sup-array.prototype.tolocalestring
-if (!Array.prototype.toLocaleString) {
-  Object.defineProperty(Array.prototype, 'toLocaleString', {
-    value: function(locales, options) {
-      // 1. Let O be ? ToObject(this value).
-      if (this == null) {
-        throw new TypeError('"this" is null or not defined');
-      }
-
-      var a = Object(this);
-
-      // 2. Let len be ? ToLength(? Get(A, "length")).
-      var len = a.length &gt;&gt;&gt; 0;
-
-      // 3. Let separator be the String value for the
-      //    list-separator String appropriate for the
-      //    host environment's current locale (this is
-      //    derived in an implementation-defined way).
-      // NOTE: In this case, we will use a comma
-      var separator = ',';
-
-      // 4. If len is zero, return the empty String.
-      if (len === 0) {
-        return '';
-      }
-
-      // 5. Let firstElement be ? Get(A, "0").
-      var firstElement = a[0];
-      // 6. If firstElement is undefined or null, then
-      //  a.Let R be the empty String.
-      // 7. Else,
-      //  a. Let R be ?
-      //     ToString(?
-      //       Invoke(
-      //        firstElement,
-      //        "toLocaleString",
-      //        « locales, options »
-      //       )
-      //     )
-      var r = firstElement == null ?
-        '' : firstElement.toLocaleString(locales, options);
-
-      // 8. Let k be 1.
-      var k = 1;
-
-      // 9. Repeat, while k &lt; len
-      while (k &lt; len) {
-        // a. Let S be a String value produced by
-        //   concatenating R and separator.
-        var s = r + separator;
-
-        // b. Let nextElement be ? Get(A, ToString(k)).
-        var nextElement = a[k];
-
-        // c. If nextElement is undefined or null, then
-        //   i. Let R be the empty String.
-        // d. Else,
-        //   i. Let R be ?
-        //     ToString(?
-        //       Invoke(
-        //        nextElement,
-        //        "toLocaleString",
-        //        « locales, options »
-        //       )
-        //     )
-        r = nextElement == null ?
-          '' : nextElement.toLocaleString(locales, options);
-
-        // e. Let R be a String value produced by
-        //   concatenating S and R.
-        r = s + r;
-
-        // f. Increase k by 1.
-        k++;
-      }
-
-      // 10. Return R.
-      return r;
-    }
-  });
-}
-</pre>
-
-<p>Si necesitas soportar motores de JavaScript obsoletos que no compatibilizan con <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty</a></code>, es mejor no utilizar los métodos <code>Array.prototype</code>, ya que no se pueden hacer no-enumerables.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>La definicion original fue en ECMAScript 3.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sup-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}</td>
-   <td>{{Spec2('ES Int Draft')}}</td>
-   <td>Esta definición reemplaza la proporcionada en ECMA-262.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.toLocaleString")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.toString()")}}</li>
- <li>{{jsxref("Intl")}}</li>
- <li>{{jsxref("Object.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("Number.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/tosource/index.html b/files/es/web/javascript/referencia/objetos_globales/array/tosource/index.html
deleted file mode 100644
index ffd8df0b3b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/tosource/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: Array.prototype.toSource()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/toSource
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/toSource
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>El método <code><strong>toSource()</strong></code> devuelve un string representando el código fuente de un arreglo.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.toSource()</pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un string representando el código fuente del arreglo.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>toSource</code>r retorna los siguientes valores:</p>
-
-<ul>
- <li>Para el objeto global {{jsxref("Array")}}, <code>toSource</code> devuelve el siguiente string indicando que el código fuente no está disponible:
-
-  <pre class="brush: js">function Array() {
-    [native code]
-}
-</pre>
- </li>
- <li>Para instancias de {{jsxref("Array")}}, <code>toSource</code> devuelve un string representando el código fuente.</li>
-</ul>
-
-<p>Este método suele ser llamado internamente por JavaScript y no explícitamente en código. Puede usar <code>toSource</code> mientras depura para examinar el contenido de un arreglo.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Examinar_el_código_fuente_de_un_arreglo">Examinar el código fuente de un arreglo</h3>
-
-<p>Para examinar el código fuente de un arreglo:</p>
-
-<pre class="brush: js">var alpha = new Array('a', 'b', 'c');
-
-alpha.toSource();
-//devuelve ['a', 'b', 'c']
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No hace parte de ningún estándar. Implementado en JavaScript 1.3.</p>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básicot</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toSource()")}}</li>
- <li>{{jsxref("Array.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/tostring/index.html b/files/es/web/javascript/referencia/objetos_globales/array/tostring/index.html
deleted file mode 100644
index 402f011e0f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/tostring/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: Array.prototype.toString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/toString
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/toString
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>toString()</strong></code> devuelve una cadena de caracteres representando el array especificado y sus elementos.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-tostring.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis </h2>
-
-<pre class="syntaxbox"><code><var>arr</var>.toString()</code></pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena de caracteres representando los elementos del array.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El objeto {{jsxref("Array")}} sustituye al método <code>toString</code> de {{jsxref("Object")}}. Para los objetos <code>Array</code>, el método <code>toString</code> une el array y devuelve una cadena de caracteres que contiene cada elemento del array separado por comas.</p>
-
-<p>JavaScript llama al método <code>toString</code> automáticamente cuando un array va a ser representado como un valor de texto o cuando se referencia a un array en una concatenación de caracteres.</p>
-
-<h3 id="Semántica_de_ECMAScript_5">Semántica de ECMAScript 5 </h3>
-
-<p>Desde JavaScript 1.8.5 (Firefox 4), y consistente con la 5ª edición de semántica de ECMAScript, el método <code>toString()</code> es genérico y puede ser usado con cualquier objeto. {{jsxref("Object.prototype.toString()")}} será llamado y devolverá el valor resultante.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.2', 'Array.prototype.toString')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Array.toString")}}</p>
-</div>&gt;
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.join()")}}</li>
- <li>{{jsxref("Object.prototype.toSource()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/unshift/index.html b/files/es/web/javascript/referencia/objetos_globales/array/unshift/index.html
deleted file mode 100644
index 4641a05d98..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/unshift/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: Array.prototype.unshift()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/unshift
-tags:
-  - Array
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/unshift
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>unshift()</strong></code> agrega uno o más elementos al inicio del array, y devuelve la nueva longitud del array.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/array-unshift.html")}}</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.unshift(<var>elemento1</var>[, ...[, <var>elementoN</var>]])</pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>elemento<em>N</em></code></dt>
- <dd>Elementos a agregar al inicio del array.</dd>
-</dl>
-
-<h3 id="Returns" name="Returns">Devuelve</h3>
-
-<p>La nueva propiedad {{jsxref("Array.length", "length")}} del objeto sobre el cual el método fue llamado.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>El método <code>unshift</code> inserta los valores proporcionados al inicio de un objeto del tipo array.</p>
-
-<p><code>unshift</code> es intencionalmente genérico; este método puede ser {{jsxref("Function.call", "called", "", 1)}} o {{jsxref("Function.apply", "applied", "", 1)}} a objetos similares a arrays. Objetos que no contengan una propiedad <code>length</code> reflejando una serie de propiedades numéricas consecutivas, comenzada a partir del cero, pueden no comportarse de una manera comprensible.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<pre class="brush: js">var arr = [1, 2];
-
-arr.unshift(0); // resultado de la llamada es 3, la nueva longitud del array
-// arr es [0, 1, 2]
-
-arr.unshift(-2, -1); // = 5
-// arr es [-2, -1, 0, 1, 2]
-
-arr.unshift([-3]);
-// arr es [[-3], -2, -1, 0, 1, 2]
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.4.4.13', 'Array.prototype.unshift')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Array.unshift")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.push()")}}</li>
- <li>{{jsxref("Array.prototype.pop()")}}</li>
- <li>{{jsxref("Array.prototype.shift()")}}</li>
- <li>{{jsxref("Array.prototype.concat()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/array/values/index.html b/files/es/web/javascript/referencia/objetos_globales/array/values/index.html
deleted file mode 100644
index dbc76e8634..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/array/values/index.html
+++ /dev/null
@@ -1,82 +0,0 @@
----
-title: Array.prototype.values()
-slug: Web/JavaScript/Referencia/Objetos_globales/Array/values
-tags:
-  - Array
-  - ECMAScript 2015
-  - Iterador
-  - JavaScript
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Array/values
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>values()</code></strong> devuelve un nuevo objeto <strong><code>Array Iterator</code></strong> que contiene los valores para cada índice del array.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="punctuation token">[</span><span class="string token">'w'</span><span class="punctuation token">,</span> <span class="string token">'y'</span><span class="punctuation token">,</span> <span class="string token">'k'</span><span class="punctuation token">,</span> <span class="string token">'o'</span><span class="punctuation token">,</span> <span class="string token">'p'</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> iterator <span class="operator token">=</span> a<span class="punctuation token">.</span><span class="function token">values</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// w </span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// y </span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// k </span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// o </span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>iterator<span class="punctuation token">.</span><span class="function token">next</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">.</span>value<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// p</span></code>
-</pre>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>.values()
-</pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un nuevo objeto {{jsxref("Array")}} iterator.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Iteración_usando_un_bucle_for...of">Iteración usando un bucle <code>for...of</code></h3>
-
-<pre class="brush: js">var arr = ['w', 'y', 'k', 'o', 'p'];
-var iterador = arr.values();
-
-for (let letra of iterador) {
-  console.log(letra);
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-array.prototype.values', 'Array.prototype.values')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array.prototype.values', 'Array.prototype.values')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Array.values")}}</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.keys()")}}</li>
- <li>{{jsxref("Array.prototype.entries()")}}</li>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Array.prototype.every()")}}</li>
- <li>{{jsxref("Array.prototype.some()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/@@species/index.html b/files/es/web/javascript/referencia/objetos_globales/arraybuffer/@@species/index.html
deleted file mode 100644
index ab87242260..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/@@species/index.html
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: 'get ArrayBuffer[@@species]'
-slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/@@species
-tags:
-  - ArrayBuffer
-  - JavaScript
-  - Propiedad
-  - TypedArrays
-translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/@@species
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad de acceso <code><strong>ArrayBuffer[@@species]</strong></code> devuelve el constructor <code>ArrayBuffer</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">ArrayBuffer[Symbol.species]
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad de acceso <code>species</code> devuelve el constructor predeterminado para los objetos <code>ArrayBuffer</code>. Los constructores de subclase pueden anularlo para cambiar la asignación del constructor.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>La propiedad <code>species</code> devuelve la función constructora predeterminada, que es el constructor <code>ArrayBuffer</code> para los objetos <code>ArrayBuffer</code>:</p>
-
-<pre class="brush: js">ArrayBuffer[Symbol.species]; // función ArrayBuffer()</pre>
-
-<p>En un objeto de colección derivado (por ejemplo, su búfer de array personalizado <code>MyArrayBuffer</code>), <code>MyArrayBuffer</code> species es el constructor <code>MyArrayBuffer</code>. Sin embargo, es posible que desee sobrescribir esto para devolver objetos <code>ArrayBuffer</code> principales en sus métodos de clase derivados:</p>
-
-<pre class="brush: js">class MyArrayBuffer extends ArrayBuffer {
-  // Overwrite MyArrayBuffer species to the parent ArrayBuffer constructor
-  static get [Symbol.species]() { return ArrayBuffer; }
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-get-arraybuffer-@@species', 'get ArrayBuffer [ @@species ]')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.ArrayBuffer.@@species")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("ArrayBuffer")}}</li>
- <li>{{jsxref("Symbol.species")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/bytelength/index.html b/files/es/web/javascript/referencia/objetos_globales/arraybuffer/bytelength/index.html
deleted file mode 100644
index e553024b1e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/bytelength/index.html
+++ /dev/null
@@ -1,70 +0,0 @@
----
-title: ArrayBuffer.prototype.byteLength
-slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/byteLength
-tags:
-  - ArrayBuffer
-  - JavaScript
-  - Propiedad
-  - Prototipo
-translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/byteLength
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad de acceso <code><strong>byteLength</strong></code> representa la longitud de {{jsxref("ArrayBuffer")}} en bytes.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/arraybuffer-bytelength.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>arr</var>aybuffer.byteLength</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad <code>byteLength</code> es una propiedad de acceso cuya función de acceso de conjunto es <code>undefined</code>, lo que significa que solo puede leer esta propiedad. El valor se establece cuando la matriz se construye y no se puede cambiar. Esta propiedad devuelve <code>0</code> si este <code>ArrayBuffer</code> ha sido separado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush:js">var buffer = new ArrayBuffer(8);
-buffer.byteLength; // 8
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Typed Array')}}</td>
-   <td>{{Spec2('Typed Array')}}</td>
-   <td>Reemplazado por ECMAScript 2015.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-get-arraybuffer.prototype.bytelength', 'ArrayBuffer.prototype.byteLength')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial en un estándar ECMA.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-get-arraybuffer.prototype.bytelength', 'ArrayBuffer.prototype.byteLength')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.ArrayBuffer.byteLength")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("ArrayBuffer")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/index.html b/files/es/web/javascript/referencia/objetos_globales/arraybuffer/index.html
deleted file mode 100644
index 4a83b5a24d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/index.html
+++ /dev/null
@@ -1,139 +0,0 @@
----
-title: ArrayBuffer
-slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer
-tags:
-  - ArrayBuffer
-  - Constructor
-  - JavaScript
-  - TypedArrays
-translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>ArrayBuffer</code></strong> se usa para representar un buffer genérico, de datos binarios crudos (raw) con una longitud específica. No se puede manipular directamente el contenido de un <code>ArrayBuffer</code>; sin embargo, puedes crear uno de los <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">arrays tipados</a> o un objeto {{jsxref("DataView")}} que representa el buffer en un formato especifico, y usarlo para leer y escribir el contenido del buffer.</p>
-
-<p>{{EmbedInteractiveExample("pages/js/arraybuffer-constructor.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">new ArrayBuffer(length)
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>length</code></dt>
- <dd>El tamaño en bytes, del array buffer que quieres crear.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un nuevo objeto <code>ArrayBuffer</code> de tamaño específico. Su contenido se inicializa a cero.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<p>Se lanza un {{jsxref("RangeError")}} si la longitud (<code>length</code>) es mayor que {{jsxref("Number.MAX_SAFE_INTEGER")}} (&gt; = 2 ** 53) o negativa.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El constructor de <code>ArrayBuffer</code> crea un nuevo <code>ArrayBuffer</code> del tamaño especificado en bytes.</p>
-
-<h3 id="Obtener_un_array_buffer_sobre_datos_existentes">Obtener un array buffer sobre datos existentes</h3>
-
-<ul>
- <li><a href="/es/docs/Web/API/WindowBase64/Base64_encoding_and_decoding#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer">Desde un string Base64</a></li>
- <li><a href="/es/docs/Web/API/FileReader#readAsArrayBuffer()">Desde un fichero local</a></li>
-</ul>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>ArrayBuffer.length</code></dt>
- <dd>El tamaño de constructor de <code>ArrayBuffer</code> cuyo valor es 1.</dd>
- <dt>{{jsxref("ArrayBuffer.@@species", "get ArrayBuffer[@@species]")}}</dt>
- <dd>La función de constructor que se usa para crear objetos derivados.</dd>
- <dt>{{jsxref("ArrayBuffer.prototype")}}</dt>
- <dd>Permite añadir propiedades a todos los objetos <code>ArrayBuffer</code>.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("ArrayBuffer.isView", "ArrayBuffer.isView(arg)")}}</dt>
- <dd>Devuelve <code>true</code> si <code>arg</code> es una de las vistas de ArrayBuffer, como pueden ser los <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/TypedArray">arrays tipados</a> o un {{jsxref("DataView")}}. Sino devuelve <code>false</code>.</dd>
- <dt>{{jsxref("ArrayBuffer.transfer", "ArrayBuffer.transfer(oldBuffer [, newByteLength])")}} {{experimental_inline}}</dt>
- <dd>
- <div class="line" id="file-arraybuffer-transfer-LC6">Devuelve un nuevo <code>ArrayBuffer</code> cuyo contenido se toma de los datos de <code>oldBuffer</code> y luego es truncado o extendido por cero por <code>newByteLength</code>.</div>
- </dd>
-</dl>
-
-<h2 id="Instancias">Instancias</h2>
-
-<p>Todas las instancias de <code>ArrayBuffer</code> heredan de {{jsxref("ArrayBuffer.prototype")}}.</p>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<p>{{page('es/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','Propiedades')}}</p>
-
-<h3 id="Métodos_2">Métodos</h3>
-
-<p>{{page('es/Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype','Métodos')}}</p>
-
-<dl>
- <dt>{{jsxref("ArrayBuffer.slice()")}} {{non-standard_inline}}</dt>
- <dd>Tiene la misma funcionalidad que {{jsxref("ArrayBuffer.prototype.slice()")}}.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>En este ejemplo creamos un buffer de 8-bytes con una vista del tipo {{jsxref("Global_Objects/Int32Array", "Int32Array")}} referenciando dicho buffer:</p>
-
-<pre class="brush: js">var buffer = new ArrayBuffer(8);
-var view   = new Int32Array(buffer);</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Typed Array')}}</td>
-   <td>{{Spec2('Typed Array')}}</td>
-   <td>Sustituida por ECMAScript 6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial en un estándar ECMA. Especifica que new es obligatorio.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-arraybuffer-constructor', 'ArrayBuffer')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.ArrayBuffer")}}</p>
-
-<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
-
-<p>Desde el ECMAScript 2015, los constructores de <code>ArrayBuffer</code> requieren ser instanciados usando el operador {{jsxref("Operators/new", "new")}}. Ejecutar el constructor de un <code>ArrayBuffer</code> como una funciónsin el <code>new</code>, lanzará un {{jsxref("TypeError")}} de ahora en adelante.</p>
-
-<pre class="brush: js example-bad">var dv = ArrayBuffer(10);
-// TypeError: llamar al constructor ArrayBuffer sin new está prohibido</pre>
-
-<pre class="brush: js example-good">var dv = new ArrayBuffer(10);</pre>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li>
- <li>{{jsxref("SharedArrayBuffer")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/arraybuffer/prototype/index.html
deleted file mode 100644
index fef80071de..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/arraybuffer/prototype/index.html
+++ /dev/null
@@ -1,69 +0,0 @@
----
-title: ArrayBuffer.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/ArrayBuffer/prototype
-tags:
-  - ArrayBuffer
-  - JavaScript
-  - Propiedad
-translation_of: Web/JavaScript/Reference/Global_Objects/ArrayBuffer
-translation_of_original: Web/JavaScript/Reference/Global_Objects/ArrayBuffer/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <strong><code>ArrayBuffer.prototype</code></strong> representa el prototipo para el objeto {{jsxref("ArrayBuffer")}}.</p>
-
-<div>{{js_property_attributes(0,0,0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las instancias de <code>ArrayBuffer</code> heredan de <code>ArrayBuffer.prototype</code>. Como con todos los constructores, puedes modificar el prototipo del constructor para aplicar cambios sobre todas las instancias de <code>ArrayBuffer</code>.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>ArrayBuffer.prototype.constructor</dt>
- <dd>Especifica la función que se encarga de crear el prototipo del objeto. El valor inicial es el constructor incluido en el estándar <code>ArrayBuffer</code>.</dd>
- <dt>{{jsxref("ArrayBuffer.prototype.byteLength")}} {{readonlyInline}}</dt>
- <dd>El tamaño, en bytes, del array. Este valor se establece al construir el objeto y no se puede modificar. <strong>Sólo lectura.</strong></dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("ArrayBuffer.prototype.slice()")}}</dt>
- <dd>Retorna un nuevo <code>ArrayBuffer</code> cuyo contenido es una copia los bytes de este <code>ArrayBuffer</code> desde <code>begin</code>, incluido, hasta  <code>end</code>, no incluido. Si <code>begin</code> o <code>end</code> son negativos, éstos hacen referencia a un índice que comienza a partir del final del array.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-arraybuffer.prototype', 'ArrayBuffer.prototype')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.ArrayBuffer.prototype")}}</p>
-
-<div id="compat-mobile"> </div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("ArrayBuffer")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/boolean/boolean/index.html b/files/es/web/javascript/referencia/objetos_globales/boolean/boolean/index.html
deleted file mode 100644
index 924ab7ccef..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/boolean/boolean/index.html
+++ /dev/null
@@ -1,75 +0,0 @@
----
-title: Boolean() constructor
-slug: Web/JavaScript/Referencia/Objetos_globales/Boolean/Boolean
-tags:
-  - Booleano
-  - Constructor
-  - JavaScript
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/Boolean
----
-<div>{{JSRef}}</div>
-
-<p>El constructor <strong><code>Boolean()</code></strong> se usa para crear objetos {{jsxref("Boolean")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/boolean-constructor.html", "shorter")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">new Boolean([<var>value</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>value</code> {{optional_inline}}</dt>
- <dd>El valor inicial del objeto <code>Boolean</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_false">Creación de objetos <code>Boolean</code> con un valor inicial de <code>false</code></h3>
-
-<pre class="brush: js notranslate">var bNoParam = new Boolean();
-var bZero = new Boolean(0);
-var bNull = new Boolean(null);
-var bEmptyString = new Boolean('');
-var bfalse = new Boolean(false);
-</pre>
-
-<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_true">Creación de objetos <code>Boolean</code> con un valor inicial de <code>true</code></h3>
-
-<pre class="brush: js notranslate">var btrue = new Boolean(true);
-var btrueString = new Boolean('true');
-var bfalseString = new Boolean('false');
-var bSuLin = new Boolean('Su Lin');
-var bArrayProto = new Boolean([]);
-var bObjProto = new Boolean({});</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-boolean-constructor', 'Boolean constructor')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Boolean.Boolean")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="/es/docs/Glossary/Boolean">Boolean</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/boolean/index.html b/files/es/web/javascript/referencia/objetos_globales/boolean/index.html
deleted file mode 100644
index 17a0f7d9e9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/boolean/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: Booleano
-slug: Web/JavaScript/Referencia/Objetos_globales/Boolean
-tags:
-  - Boolean
-  - Clase
-  - Class
-  - Constructor
-  - JavaScript
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Boolean
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>Boolean</code></strong> es un objeto contenedor para un valor booleano.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El valor pasado como primer parámetro se convierte en un valor booleano, si es necesario. Si el valor se omite o es <code>0</code>, <code>-0</code>, {{jsxref("null")}}, <code>false</code>, {{jsxref("NaN")}}, {{jsxref("undefined")}}, o la cadena vacía (<code>""</code>), el objeto tiene un valor inicial de <code>false</code>. Todos los demás valores, incluido cualquier objeto, un arreglo vacío (<code>[]</code>) o la cadena "<code>false</code>", crean un objeto con un valor inicial de <code>true</code>.</p>
-
-<p>No confundas los valores del <code>Boolean</code> {{Glossary("Primitive", "primitivo")}}, <code>true</code> y <code>false</code> con los valores <code>true</code> y <code>false</code> del objeto <code>Boolean</code>.</p>
-
-<p><strong>Cualquier</strong> objeto cuyo valor no sea {{jsxref("undefined")}} o {{jsxref("null")}}, incluido un objeto <code>Boolean</code> cuyo valor es <code>false</code>, se evalúa como <code>true</code> cuando se pasa a una declaración condicional. Por ejemplo, la condición en la siguiente declaración {{jsxref("Statements/if...else", "if")}} se evalúa como <code>true</code>:</p>
-
-<pre class="brush: js notranslate">var x = new Boolean(false);
-if (x) {
-  // este código se ejecuta
-}
-</pre>
-
-<p>Este comportamiento no se aplica a los <code>Boolean</code> primitivos. Por ejemplo, la condición en la siguiente instrucción {{jsxref("Statements/if...else", "if")}} se evalúa como <code>false</code>:</p>
-
-<pre class="brush: js notranslate">var x = false;
-if (x) {
-  // este código no se ejecuta
-}
-</pre>
-
-<p>No utilices un objeto <code>Boolean</code> para convertir un valor no booleano en un valor booleano. Para realizar esta tarea, en su lugar, usa <code>Boolean</code> como función, o un <a href="/es/docs/Web/JavaScript/Reference/Operators/Logical_NOT">operador <code>NOT</code> doble</a>:</p>
-
-<pre class="brush: js notranslate">var x = Boolean(expression);     // usa esta...
-var x = !!(expression);          // ... o esta
-var x = new Boolean(expression); // ¡no uses esta!
-</pre>
-
-<p>Si especificas cualquier objeto, incluido un objeto <code>Boolean</code> cuyo valor es <code>false</code>, como valor inicial de un objeto <code>Boolean</code>, el nuevo objeto <code>Boolean</code> tiene un valor de <code>true</code>.</p>
-
-<pre class="brush: js notranslate">var myFalse = new Boolean(false);   // valor inicial de false
-var g = Boolean(myFalse);           // valor inicial de true
-var myString = new String('Hola');  // objeto string
-var s = Boolean(myString);          // valor inicial de true
-</pre>
-
-<p>No utilices un objeto <code>Boolean</code> en lugar de un <code>Boolean</code> primitivo.</p>
-
-<div class="note">
-<p><strong>Nota</strong> Cuando la propiedad no estándar <a href="/es/docs/Web/API/Document#Properties"><code>document.all</code></a> se usa como argumento para este constructor, el resultado es un objeto <code>Boolean</code> con el valor <code>false</code>. Esta propiedad es heredada y no estándar y no se debe usar.</p>
-</div>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{jsxref("Global_Objects/Boolean/Boolean", "Boolean()")}}</dt>
- <dd>Crea un nuevo objeto <code>Boolean</code>.</dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt>{{jsxref("Boolean.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena de <code>true</code> o <code>false</code> dependiendo del valor del objeto. Redefine el método {{jsxref("Object.prototype.toString()")}}.</dd>
- <dt>{{jsxref("Boolean.prototype.valueOf()")}}</dt>
- <dd>Devuelve el valor primitivo del objeto {{jsxref("Boolean")}}. Redefine el método {{jsxref("Object.prototype.valueOf()")}}.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_false">Creación de objetos <code>Boolean</code> con un valor inicial de <code>false</code></h3>
-
-<pre class="brush: js notranslate">var bNoParam = new Boolean();
-var bZero = new Boolean(0);
-var bNull = new Boolean(null);
-var bEmptyString = new Boolean('');
-var bfalse = new Boolean(false);
-</pre>
-
-<h3 id="Creación_de_objetos_Boolean_con_un_valor_inicial_de_true">Creación de objetos <code>Boolean</code> con un valor inicial de <code>true</code></h3>
-
-<pre class="brush: js notranslate">var btrue = new Boolean(true);
-var btrueString = new Boolean('true');
-var bfalseString = new Boolean('false');
-var bSuLin = new Boolean('Su Lin');
-var bArrayProto = new Boolean([]);
-var bObjProto = new Boolean({});
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-boolean-objects', 'Boolean')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Boolean")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="/es/docs/Glossary/Boolean">Boolean</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Data_structures#Boolean_type">Boolean primitivo</a></li>
- <li><a href="https://es.wikipedia.org/wiki/Tipo_de_dato_lógico">Tipo de dato <code>Boolean</code> (Wikipedia)</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/boolean/tosource/index.html b/files/es/web/javascript/referencia/objetos_globales/boolean/tosource/index.html
deleted file mode 100644
index e42f79f26b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/boolean/tosource/index.html
+++ /dev/null
@@ -1,36 +0,0 @@
----
-title: Boolean.prototype.toSource()
-slug: Web/JavaScript/Referencia/Objetos_globales/Boolean/toSource
-tags:
-  - Boolean
-  - JavaScript
-  - Method
-  - Non-standard
-  - Prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Boolean/toSource
----
-<div>
- {{JSRef("Objetos_globales", "Boolean")}} {{ Non-standard_header() }}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Devuelve una cadena que representa el código fuente del objeto.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<p><code>toSource() </code></p>
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-<p>Ninguno.</p>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>El método <code>toSource</code> devuelve los siguientes valores:</p>
-<ul>
- <li>Para objetos built-in <code>Boolean</code>, <code>toSource</code> devuelve la siguiente cadena indicando que el código fuente no está disponible:</li>
-</ul>
-<pre class="brush: js">function Boolean() {
-   [código nativo]
-}
-</pre>
-<ul>
- <li>Para instancias de <code>Boolean</code>, <code>toSource</code> devuelve una cadena representando el código fuente.</li>
-</ul>
-<p>Este método se utiliza habitualmente en llamadas internas por JavaScript y no en código explícito.</p>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("Object.prototype.toSource()")}} {{Non-standard_inline()}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getdate/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getdate/index.html
deleted file mode 100644
index 451f889003..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getdate/index.html
+++ /dev/null
@@ -1,119 +0,0 @@
----
-title: Date.prototype.getDate()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getDate
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDate
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getDate()</code></strong> devuelve el día del mes para la fecha especificada de acuerdo con la hora local.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getDate()</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El valor devuelto por <code>getDate() es u</code>n número entero, entre 1 y 31, que representa el día del mes para la fecha dada según la hora local.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_de_getDate()">Uso de <code>getDate()</code></h3>
-
-<p>La segunda instrucción asigna el valor 25 a la variable <code>day</code>, en función del valor del objeto {{jsxref("Date")}} <code>Xmas95</code>.</p>
-
-<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
-var day = Xmas95.getDate();
-
-console.log(day); // 25
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getdate', 'Date.prototype.getDate')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.14', 'Date.prototype.getDate')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implantado en JavaScript 1.1.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCDate()")}}</li>
- <li>{{jsxref("Date.prototype.getUTCDay()")}}</li>
- <li>{{jsxref("Date.prototype.setDate()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getday/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getday/index.html
deleted file mode 100644
index f384f21b71..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getday/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: Date.prototype.getDay()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getDay
-tags:
-  - Date
-  - JavaScript
-  - Prototype
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getDay
----
-<div>{{JSRef}}</div>
-
-<p><code>El método </code><strong><code>getDay()</code></strong> devuelve el día de la semana de la fecha especificada en función de la fecha local; siendo 0 (Domingo) el primer día.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getDay()</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El valor devuelto por <code>getDay()</code> es un entero correspondiente al día de la semana; siendo 0 (Domingo) el primer día, 1 (Lunes) el segundo, etcétera. </p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usos_de_getDay()"><code>Usos de getDay()</code></h3>
-
-<p>La segunda sentencia asigna el valor 1 a <code>weekday, </code>basado en el valor del objeto Xmas95  {{jsxref("Date")}}. December 25, 1995,  que corresponde a Lunes.</p>
-
-<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
-var weekday = Xmas95.getDay();
-
-console.log(weekday); // 1
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getday', 'Date.prototype.getDay')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.16', 'Date.prototype.getDay')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JS 1.0.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte báisco</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCDate()")}}</li>
- <li>{{jsxref("Date.prototype.getUTCDay()")}}</li>
- <li>{{jsxref("Date.prototype.setDate()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getfullyear/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getfullyear/index.html
deleted file mode 100644
index 0d047fbbc3..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getfullyear/index.html
+++ /dev/null
@@ -1,67 +0,0 @@
----
-title: Date.prototype.getFullYear()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getFullYear
-tags:
-  - Fecha
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getFullYear
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getFullYear()</code></strong> devuelve el año de la fecha indicada acorde a la hora local.</p>
-
-<p>Usa este método en lugar del método {{jsxref("Date.prototype.getYear()", "getYear()")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/date-getfullyear.html","shorter")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>dateObj</var>.getFullYear()</pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un número correspondiente al año de la fecha indicada, según la hora local.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El valor devuelto por <code>getFullYear()</code> es un número absoluto. Para fechas entre los años 1000 y 9999, <code>getFullYear()</code> devuelve un número de cuatro cifras, por ejemplo, 1995. Utiliza esta función para obtener un año que cumpla con los años posteriores al 2000.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_getFullYear">Utilizando getFullYear()</h3>
-
-<p>El siguiente ejemplo asigna el valor de cuatro dígitos del año actual a la variable <code>year</code>.</p>
-
-<pre class="brush: js notranslate">var today = new Date();
-var year = today.getFullYear();
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.getfullyear', 'Date.prototype.getFullYear')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Date.getFullYear")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li>
- <li>{{jsxref("Date.prototype.setFullYear()")}}</li>
- <li>{{jsxref("Date.prototype.getYear()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/gethours/index.html b/files/es/web/javascript/referencia/objetos_globales/date/gethours/index.html
deleted file mode 100644
index b669c976c7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/gethours/index.html
+++ /dev/null
@@ -1,119 +0,0 @@
----
-title: Date.prototype.getHours()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getHours
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getHours
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getHours()</code></strong> retorna la hora de la fecha especificada, de acuerdo a la hora local.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getHours()</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un número entero, entre 0 y 23, representando la hora de la fecha dada de acuerdo a la hora local.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_getHours()">Usando <code>getHours()</code></h3>
-
-<p>La segunda sentencia abajo asigna el valor 23 a la variable hours, basado en el valor del objeto {{jsxref("Global_Objects/Date", "Date")}} <code>Xmas95</code>.</p>
-
-<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
-var hours = Xmas95.getHours();
-
-console.log(hours); // 23
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definicion inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.18', 'Date.prototype.getHours')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.gethours', 'Date.prototype.getHours')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.gethours', 'Date.prototype.getHours')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_tambien">Ver tambien</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCHours()")}}</li>
- <li>{{jsxref("Date.prototype.setHours()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getmilliseconds/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getmilliseconds/index.html
deleted file mode 100644
index cf673a530a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getmilliseconds/index.html
+++ /dev/null
@@ -1,121 +0,0 @@
----
-title: Date.prototype.getMilliseconds()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getMilliseconds
-tags:
-  - Fecha
-  - Milisegundos
-  - Prototipo
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMilliseconds
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getMilliseconds()</code></strong> devuelve la cantidad de milisegundos en el objeto fecha especificado de acuerdo a la hora local.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getMilliseconds()</code></pre>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>Un número, entre 0 y 999, que representa la cantidad de milisegundos en la fecha dada, de acuerdo a la hora local.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_getMilliseconds()">Usando <code>getMilliseconds()</code></h3>
-
-<p>El siguiente ejemplo asigna la cantidad de milisegundos de la hora actual a la variable <code>milisegundos</code>:</p>
-
-<pre class="brush: js">var ahora = new Date();
-var milisegundos = ahora.getMilliseconds();
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.3.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.24', 'Date.prototype.getMilliseconds')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getmilliseconds', 'Date.prototype.getMilliseconds')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.getmilliseconds', 'Date.prototype.getMilliseconds')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<h2 id="CompatibilityTable">{{CompatibilityTable}}</h2>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCMilliseconds()")}}</li>
- <li>{{jsxref("Date.prototype.setMilliseconds()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getminutes/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getminutes/index.html
deleted file mode 100644
index 9b144239b9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getminutes/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: Date.prototype.getMinutes()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getMinutes
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMinutes
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getMinutes()</code></strong> devuelve los minutos de la fecha especificada en función de la hora local. </p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getMinutes()</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Devuelve">Devuelve</h3>
-
-<p>El valor devuelto por <code>getMinutes()</code> es un número entero entre 0 y 59.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_de_getMinutes()"><code>Uso de getMinutes()</code></h3>
-
-<p>La segunda declaración del código mostrado a continuación le asigna el valor 15 a la variable <code>minutos</code>, basado en el valor del {{jsxref("Global_Objects/Date", "Date")}} <code>objeto Xmas95</code>.</p>
-
-<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
-var minutos = Xmas95.getMinutes();
-
-console.log(minutos); // 15
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.20', 'Date.prototype.getMinutes')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getminutes', 'Date.prototype.getMinutes')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCMinutes()")}}</li>
- <li>{{jsxref("Date.prototype.setMinutes()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getmonth/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getmonth/index.html
deleted file mode 100644
index 08a7e1d143..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getmonth/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: Date.prototype.getMonth()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getMonth
-tags:
-  - Date
-  - JavaScript
-  - Method
-  - Reference
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getMonth
----
-<div>{{JSRef}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El método getMonth() devuelve el mes del objeto Date según la hora local, donde el número cero indica el primer mes del año.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getMonth()</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>El valor devuelto por getMonth() es un entero entre 0 y 11, donde 0 corresponde a Enero, 1 a Febrero y así sucesivamente.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_getMonth()">Usando <code>getMonth()</code></h3>
-
-<p>En el siguiente ejemplo, la segunda línea asigna el valor 11 a la variable mes, basado en el valor del objeto {{jsxref("Date")}} N<code>avidad</code>.</p>
-
-<pre class="brush: js">var Navidad = new Date('December 25, 2014 23:15:30');
-var mes = Navidad.getMonth();
-
-console.log(mes); // 11
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Primera definición. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.12', 'Date.prototype.getMonth')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getmonth', 'Date.prototype.getMonth')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad">Compatibilidad</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCMonth()")}}</li>
- <li>{{jsxref("Date.prototype.setMonth()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getseconds/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getseconds/index.html
deleted file mode 100644
index 875fe3f48b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getseconds/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: Date.prototype.getSeconds()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getSeconds
-tags:
-  - Fecha
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getSeconds
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getSeconds()</code></strong> devuelve los segundos en la fecha especificada de acuerdo a la hora local.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/date-getseconds.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getSeconds()</code></pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un número entero, entro 0 y 59, representando los segundos en la fecha dada de acuerdo a la hora local.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_getSeconds()">Utilizando <code>getSeconds()</code></h3>
-
-<p>La segunda sentencia asigna el valor 30 a la variable <code>seconds</code>, en base al valor del objeto {{jsxref("Global_Objects/Date", "Date")}} <code>Xmas95</code>.</p>
-
-<pre class="brush: js">var Xmas95 = new Date('December 25, 1995 23:15:30');
-var seconds = Xmas95.getSeconds();
-
-console.log(seconds); // 30
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.22', 'Date.prototype.getSeconds')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getseconds', 'Date.prototype.getSeconds')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.getseconds', 'Date.prototype.getSeconds')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Date.getSeconds")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCSeconds()")}}</li>
- <li>{{jsxref("Date.prototype.setSeconds()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/gettime/index.html b/files/es/web/javascript/referencia/objetos_globales/date/gettime/index.html
deleted file mode 100644
index f08882be5e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/gettime/index.html
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: Date.prototype.getTime()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getTime
-tags:
-  - Date
-  - Metodo getTime()
-  - Referencia
-  - getTime
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getTime
----
-<div>{{JSRef("Global_Objects", "Date")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <strong><code>getTime()</code></strong> devuelve el valor numérico correspondiente a la hora para la fecha especificada según la hora universal.</p>
-
-
-
-<p>Puede utilizar este método para ayudar a asignar una fecha y hora a otro objeto {{jsxref("Global_Objects/Date", "Date")}}. Este método es funcionalmente equivalente al metodo {{jsxref("Date.valueof", "valueOf()")}}.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>dateObj</var>.getTime()</code>
-</pre>
-
-<h3 id="Returns" name="Returns">Valor devuelto</h3>
-
-<p>El valor devuelto por el método <code>getTime()</code> es un número de milisegundos desde el 1 de enero de 1970 00:00:00 UTC.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Ejemplo_Uso_de_getTime_para_copiar_fechas.">Ejemplo: Uso de <code>getTime()</code> para copiar fechas.</h3>
-
-<p>Construir un objeto de fecha con el mismo valor de tiempo.</p>
-
-<pre class="brush: js notranslate">var birthday = new Date(1994, 12, 10);
-var copy = new Date();
-copy.setTime(birthday.getTime());
-</pre>
-
-<h3 id="Ejemplo_Medir_el_tiempo_de_ejecución">Ejemplo: Medir el tiempo de ejecución</h3>
-
-<p>Restando dos llamadas <code>getTime() </code>subsiguientes en objetos {{jsxref("Global_Objects/Date", "Date")}} recién generados, dé el intervalo de tiempo entre estas dos llamadas. Esto se puede utilizar para calcular el tiempo de ejecución de algunas operaciones.</p>
-
-<pre class="brush: js notranslate">var end, start;
-
-start = new Date();
-for (var i = 0; i &lt; 1000; i++) {
-  Math.sqrt(i);
-}
-end = new Date();
-
-console.log('Operation took ' + (end.getTime() - start.getTime()) + ' msec');
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Standard</td>
-   <td>Initial definition. Implemented in JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.9', 'Date.prototype.getTime')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.gettime', 'Date.prototype.getTime')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.setTime()")}}</li>
- <li>{{jsxref("Date.prototype.valueOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getutcfullyear/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getutcfullyear/index.html
deleted file mode 100644
index f2133bfc02..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getutcfullyear/index.html
+++ /dev/null
@@ -1,121 +0,0 @@
----
-title: Date.prototype.getUTCFullYear()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getUTCFullYear
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCFullYear
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getUTCFullYear()</code></strong> devuelve el año en la fecha especificada en tiempo universal.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>objectoFecha</var>.getUTCFullYear()</code></pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un número que representa el año en la fecha representada por el <code><var>objectoFecha</var></code> en tiempo universal.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El valor devuelto por <code>getUTCFullYear()</code> es un número que no está afectado por  el efecto año 2000, por ejemplo, 1995.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Empleo_de_getUTCFullYear()">Empleo de <code>getUTCFullYear()</code></h3>
-
-<p>El siguiente ejemplo asigna el valor de cuatro digitos del año actual a la variable <code>year</code>.</p>
-
-<pre class="brush: js">var today = new Date();
-var year = today.getUTCFullYear();
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.3.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.11', 'Date.prototype.getUTCFullYear')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getutcfullyear', 'Date.prototype.getUTCFullYear')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.getutcfullyear', 'Date.prototype.getUTCFullYear')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getFullYear()")}}</li>
- <li>{{jsxref("Date.prototype.setFullYear()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/getutchours/index.html b/files/es/web/javascript/referencia/objetos_globales/date/getutchours/index.html
deleted file mode 100644
index 1e7a7a1ce2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/getutchours/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: Date.prototype.getUTCHours()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/getUTCHours
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/getUTCHours
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>getUTCHours()</code></strong> retorna las horas especificadas en la fecha deacuerdo al horario universal.</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.getUTCHours()</code></pre>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>An integer number, between 0 and 23, representing the hours in the given date according to universal time.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_getUTCHours()">Using <code>getUTCHours()</code></h3>
-
-<p>The following example assigns the hours portion of the current time to the variable <code>hours</code>.</p>
-
-<pre class="brush: js">var today = new Date();
-var hours = today.getUTCHours();
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.3.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.19', 'Date.prototype.getUTCHours')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.getutchours', 'Date.prototype.getUTCHours')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.getutchours', 'Date.prototype.getUTCHours')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getHours()")}}</li>
- <li>{{jsxref("Date.prototype.setUTCHours()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/index.html b/files/es/web/javascript/referencia/objetos_globales/date/index.html
deleted file mode 100644
index 20e05539e5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: Date
-slug: Web/JavaScript/Referencia/Objetos_globales/Date
-tags:
-  - Date
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Global_Objects/Date
----
-<div>{{JSRef("Objetos_globales", "Date")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Permite trabajar con fechas y horas.</p>
-
-<h2 id="Se_Crea_Con" name="Se_Crea_Con">El constructor</h2>
-
-<p>El constructor <code>Date</code>:</p>
-
-<pre class="brush: js">new Date()
-new Date(<em>milisegundos</em>)
-new Date(<em>cadenaFecha</em>)
-new Date(<em>año_num</em>,<em>mes_num</em>,<em>dia_num</em>
-        [,<em>hor_num</em>,<em>min_num</em>,<em>seg_num</em>,<em>mils_num</em>])
-</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>milisegundos</code></dt>
- <dd>Valor entero que representa el número de milisegundos desde las 00:00:00 UTC del 1 de enero de 1970.</dd>
-</dl>
-
-<dl>
- <dt><code>cadenaFecha</code></dt>
- <dd>Valor de tipo cadena que representa una fecha. La cadena debería estar en un formato reconocido por el método {{jsxref("Date.parse()")}}.</dd>
-</dl>
-
-<dl>
- <dt><code>año_num, mes_num, dia_num</code></dt>
- <dd>Valores enteros con las representaciones de las partes de una fecha. Como valor entero, el mes se representa de 0 a 11, con 0=enero and 11=diciembre.</dd>
-</dl>
-
-<dl>
- <dt><code>hor_num, min_num, seg_num, mils_num</code></dt>
- <dd>Valores enteros que representan las partes de una hora completa.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Si no proporciona argumentos, el constructor crea un objeto <code>Date</code> con la hora y fecha de hoy según la hora local.</p>
-
-<p><span style="font-size: 14.3999996185303px; line-height: 16.7999992370605px;">Si proporciona algun</span><span style="font-size: 14.3999996185303px; line-height: 16.7999992370605px;">os argumentos, debe proporcionar al menos 2 argumentos.</span> Los argumentos vacíos se establecen a 0 (ó 1 si falta el día). </p>
-
-<p>La fecha se mide en milisegundos desde la media noche exacta del 01 de enero de 1970 en formato UTC. Un día contiene 86.400.000 milisegundos. El rango del objeto Date va desde -100,000,000 días hasta 100,000,000 días respecto del 01 de enero de 1970 UTC.</p>
-
-<p>El objeto <code>Date</code> proporciona un comportamiento uniforme entre plataformas.</p>
-
-<p>El objeto <code>Date</code> soporta métodos UTC (universales), además de métodos horarios locales. UTC, también conocido como Greenwich Mean Time (GMT), se refiere a la hora según el Estádar Horario Mundial (World Time Standard). La hora local es la hora establecida por el ordenador donde se ejecuta JavaScript.</p>
-
-<p>Por compatibilidad con los cálculos del nuevo milenio (en otras palabras, para tener en cuenta el efecto 2000), debería especificar siempre el año completo; por ejemplo, utilice 1998, y no 98. Para ayudarle a especificar el año completo, JavaScript incluye los métodos {{jsxref("Date.prototype.getFullYear()")}}, {{jsxref("Date.prototype.setFullYear()")}}, {{jsxref("Date.prototype.getUTCFullYear()")}}, y {{jsxref("Date.prototype.setUTCFullYear()")}}.</p>
-
-<p>El siguiente ejemplo devuelve el tiempo transcurrido entre <code>horaA</code> y <code>horaB</code> en milisegundos.</p>
-
-<pre class="eval">horaA = new Date();
-// Sentencias que realizan alguna acción.
-horaB = new Date();
-diferenciaHoras = horaB - horaA;
-</pre>
-
-<h2 id="Propiedades" name="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("Date.prototype")}}</dt>
- <dd>Permite añadir propiedades a un objeto <code>Date</code>.</dd>
-</dl>
-
-<p>{{ jsOverrides("Function", "properties", "prototype") }}</p>
-
-<h2 id="M.C3.A9todos_Est.C3.A1ticos" name="M.C3.A9todos_Est.C3.A1ticos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Date.now()")}}</dt>
- <dd>Devuelve el valor numérico correspondiente a la hora actual.</dd>
-</dl>
-
-<dl>
- <dt>{{jsxref("Date.parse()")}}</dt>
- <dd>Transforma una cadena que representa una fecha, y devuelve el número de milisegundos desde el 1 de enero de 1970, hora local 00:00:00.</dd>
-</dl>
-
-<dl>
- <dt>{{jsxref("Date.UTC()")}}</dt>
- <dd>Acepta los mismos parámetros que la forma más larga del constructor, y devuelve el número de milisegundos en un objeto <code>Date</code> desde el 1 de enero de 1970, hora universal 00:00:00.</dd>
-</dl>
-
-<h2 id="M.C3.A9todos" name="M.C3.A9todos">Instancias de  <code>Date</code></h2>
-
-<h3 id="Métodos">Métodos</h3>
-
-<p>{{ page("/es/docs/Web/JavaScript/Referencia/Objetos_globales/Date/prototype", "M.C3.A9todos") }}</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Diversas_maneras_de_asignar_fechas" name="Ejemplo:_Diversas_maneras_de_asignar_fechas">Ejemplo: Diversas maneras de asignar fechas</h3>
-
-<p>Los ejemplos siguientes muestran diversos modos de asignar fechas:</p>
-
-<pre class="brush: js">hoy = new Date();
-cumpleanos = new Date("December 17, 1995 03:24:00");
-cumpleanos = new Date(1995,11,17);
-cumpleanos = new Date(1995,11,17,3,24,0);
-</pre>
-
-<h3 id="Ejemplo:_Calcular_el_tiempo_transcurrido" name="Ejemplo:_Calcular_el_tiempo_transcurrido">Ejemplo: Calcular el tiempo transcurrido</h3>
-
-<p>Los siguientes ejemplos muestran como determinar el tiempo transcurrido entre dos fechas:</p>
-
-<pre class="brush: js">// usando métodos estáticos
-var inicio = Date.now();
-// el evento cuyo tiempo ha transcurrido aquí:
-hacerAlgoPorAlgunTiempo();
-var fin = Date.now();
-var transcurso = fin - inicio; // tiempo en milisegundos
-</pre>
-
-<pre class="brush: js">// si tiene objetos Date
-var inicio = new Date();
-// el evento cuyo tiempo ha transcurrido aquí:
-hacerAlgoPorAlgunTiempo();
-var fin = new Date();
-var transcurso = fin.getTime() - inicio.getTime(); // tiempo en milisegundos
-</pre>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/now/index.html b/files/es/web/javascript/referencia/objetos_globales/date/now/index.html
deleted file mode 100644
index 6c611710bb..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/now/index.html
+++ /dev/null
@@ -1,30 +0,0 @@
----
-title: Date.now()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/now
-tags:
-  - Date
-  - JavaScript
-  - Method
-  - Reference
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/now
----
-<div>
- {{JSRef("Objetos_globales", "Date")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Devuelve el número de milisegundos transcurridos desde las 00:00:00 UTC del 1 de enero de 1970.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox">var <em>fechaEnMiliseg</em> = Date.now();
-</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>El método <code>now</code> devuelve los milisegundos transcurridos desde las 00:00:00 UTC del 1 de enero de 1970 justo hasta ahora como un {{jsxref("Number")}}.</p>
-<p>Cuando se usa <code>now</code> para crear registros temporales or identificadores únicos, tenga en cuenta que la precisión de Windows puede ser de 15 milisegundos (vea {{Bug(363258)}}), lo que puede provocar valores iguales si <code>now</code> se llama múltiples veces en un breve intervalo de tiempo.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_now" name="Ejemplo:_Usando_now">Ejemplo: Usando <code>now</code></h3>
-<p>El siguiente ejemplo usa <code>now</code> para crear un registro temporal.</p>
-<pre class="brush:js">var registro = Date.now();
-</pre>
-<h2 id="Vea_También">Vea También</h2>
-<ul>
- <li>{{domxref("window.performance.now")}}</li>
- <li>{{domxref("console.time")}} / {{domxref("console.timeEnd")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/parse/index.html b/files/es/web/javascript/referencia/objetos_globales/date/parse/index.html
deleted file mode 100644
index 15536775d7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/parse/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: Date.parse()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/parse
-tags:
-  - Date
-  - JavaScript
-  - Method
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/parse
----
-<div>
- {{JSRef("Objetos_globales", "Date")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Transforma una cadena con la representación de una fecha y hora, y devuelve el número de milisegundos desde las 00:00:00 del 1 de enero de 1970, hora local.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox">Date.parse(cadenaFecha)</pre>
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-<dl>
- <dt>
-  <code>cadenaFecha</code></dt>
- <dd>
-  Una cadena con la representación de una fecha y hora.</dd>
-</dl>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>El método <code>parse</code> toma una cadena con una fecha en inglés (como por ejemplo "<code>Dec 25, 1995</code>") y devuelve el número de milisegundos desde las 00:00:00 del 1 de enero de 1970 (hora local). Esta función es útil para establecer valores de fecha basados en cadenas con fechas, por ejemplo junto con el método {{jsxref("Date.prototype.setTime()")}} y el objeto {{jsxref("Date")}}.</p>
-<p>Dada una cadena con una hora, <code>parse</code> devuelve el valor de la hora. Acepta la sintaxis del estándar IETF (en inglés): "<code>Mon, 25 Dec 1995 13:30:00 GMT</code>". Comprende las abreviaciones de la zona horaria continental de Estados Unidos, pero para su uso general, use la diferencia de zona horaria, como por ejemplo, "<code>Mon, 25 Dec 1995 13:30:00 GMT+0430</code>" (4 horas, 30 minutos al oeste del meridiano de Greenwich). Si no se especifica una zona horaria, se asumirá la zona de la hora local. GMT y UTC se consideran equivalentes.</p>
-<p>Debido a que <code>parse</code> es un método estático de <code>Date</code>, úselo siempre como <code>Date.parse()</code>, en vez de como un método del objeto <code>Date</code> que usted cree.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_parse" name="Ejemplo:_Usando_parse">Ejemplo: Usando <code>parse</code></h3>
-<p>Si <code>IPOfecha</code> es un objeto existente <code>Date</code>, entonces usted puede asignarlo a 9 de agosto de 1995 de la manera siguiente:</p>
-<pre class="brush: js">IPOfecha.setTime(Date.parse("Aug 9, 1995")) ;
-</pre>
-<h2 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h2>
-<ul>
- <li>{{jsxref("Date.UTC()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/date/prototype/index.html
deleted file mode 100644
index de92c8ee02..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/prototype/index.html
+++ /dev/null
@@ -1,201 +0,0 @@
----
-title: Date.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/prototype
-tags:
-  - Date
-  - JavaScript
-  - Property
-translation_of: Web/JavaScript/Reference/Global_Objects/Date
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Date/prototype
----
-<div>
- {{JSRef("Objetos_globales", "Date")}}</div>
-<h2 id="Resumen">Resumen</h2>
-<p>Representa el prototipo para esta clase. Puede utilizar el prototipo para añadir propiedades o métodos a todas las instancias de una clase.</p>
-<div>
- {{js_property_attributes(0,0,1)}}</div>
-<h2 class="noinclude" id="Propriedades">Propriedades</h2>
-<dl>
- <dt class="noinclude">
-  <code>Date.prototype.constructor</code></dt>
- <dd>
-   </dd>
-</dl>
-<div>
- {{ jsOverrides("Object", "properties", "constructor") }}</div>
-<h2 id="Métodos">Métodos</h2>
-<dl>
- <dt>
-  {{jsxref("Date.prototype.getDate()")}}</dt>
- <dd>
-  Devuelve el día del mes de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getDay()")}}</dt>
- <dd>
-  Devuelve el día de la semana de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getFullYear()")}}</dt>
- <dd>
-  Devuelve el año de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getHours()")}}</dt>
- <dd>
-  Devuelve la hora de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getMilliseconds()")}}</dt>
- <dd>
-  Devuelve los milisegundos de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getMinutes()")}}</dt>
- <dd>
-  Devuelve los minutos de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getMonth()")}}</dt>
- <dd>
-  Devuelve el mes de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getSeconds()")}}</dt>
- <dd>
-  Devuelve los segundos de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.getTime()")}}</dt>
- <dd>
-  Devuelve el valor numérico correspondiente a la hora especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getTimezoneOffset()")}}</dt>
- <dd>
-  Devuelve la diferencia horaria en minutos para la zona geográfica actual.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCDate()")}}</dt>
- <dd>
-  Devuelve el día del mes de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCDay()")}}</dt>
- <dd>
-  Devuelve el día de la semana de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCFullYear()")}}</dt>
- <dd>
-  Devuelve el día el año de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCHours()")}}</dt>
- <dd>
-  Devuelve las horas de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCMilliseconds()")}}</dt>
- <dd>
-  Devuelve los milisegundos de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCMinutes()")}}</dt>
- <dd>
-  Devuelve los minutos de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCMonth()")}}</dt>
- <dd>
-  Devuelve el mes de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getUTCSeconds()")}}</dt>
- <dd>
-  Devuelve los segundos de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.getYear()")}} {{ deprecated_inline() }}</dt>
- <dd>
-  Devuelve el año de la fecha especificada según la hora local. Use {{jsxref("Date.prototype.getFullYear()")}} a cambio.</dd>
- <dt>
-  {{jsxref("Date.prototype.setDate()")}}</dt>
- <dd>
-  Establece el día del mes de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setFullYear()")}}</dt>
- <dd>
-  Establece el año completo de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setHours()")}}</dt>
- <dd>
-  Establece las horas de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setMilliseconds()")}}</dt>
- <dd>
-  Establece los milisegundos de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setMinutes()")}}</dt>
- <dd>
-  Establece los minutos de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setMonth()")}}</dt>
- <dd>
-  Establece el mes de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setSeconds()")}}</dt>
- <dd>
-  Establece los segundos de la fecha especificada según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setTime()")}}</dt>
- <dd>
-  Establece el valor del objeto <code>Date</code> según la hora local.</dd>
- <dt>
-  {{jsxref("Date.prototype.setUTCDate()")}}</dt>
- <dd>
-  Establece el día del mes de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.setUTCFullYear()")}}</dt>
- <dd>
-  Establece el año completo de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.setUTCHours()")}}</dt>
- <dd>
-  Establece la hora de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.setUTCMilliseconds()")}}</dt>
- <dd>
-  Establece los milisegundos de la fecha especificada según la hora universal..</dd>
- <dt>
-  {{jsxref("Date.prototype.setUTCMinutes()")}}</dt>
- <dd>
-  Establece los minutos de la fecha especificada según la hora universal..</dd>
- <dt>
-  {{jsxref("Date.prototype.setUTCMonth()")}}</dt>
- <dd>
-  Establece el mes de la fecha especificada según la hora universal.</dd>
- <dt>
-  {{jsxref("Date.prototype.setUTCSeconds()")}}</dt>
- <dd>
-  Establece los segundos de la fecha especificada según la hora universal..</dd>
- <dt>
-  {{jsxref("Date.prototype.setYear ()")}}{{deprecated_inline}}</dt>
- <dd>
-  Establece el año de la fecha especificada según la hora local. Use {{jsxref("Date.prototype.setFullYear()")}} a cambio.</dd>
- <dt>
-  {{jsxref("Date.prototype.toGMTString()")}} {{ deprecated_inline}}</dt>
- <dd>
-  Convierte una fecha en una cadena, usando las convenciones de Internet GMT. Utilice {{jsxref("Date.prototype.toUTCString()")}} a cambio.</dd>
- <dt>
-  {{jsxref("Date.prototype.toLocaleString()")}}</dt>
- <dd>
-  Convierte una fecha en una cadena, usando las reglas de la localización actual. Sobreescribe el método {{jsxref("Object.toLocaleString()")}}.</dd>
- <dt>
-  {{jsxref("Date.prototype.toLocaleDateString()")}}</dt>
- <dd>
-  Devuelve la porción fecha (sin la hora) de una fecha como una cadena, usando las reglas de la localización actual.</dd>
- <dt>
-  {{jsxref("Date.prototype.toLocaleTimeString()")}}</dt>
- <dd>
-  Devuelve la porción hora (sin la fecha) de una fecha como una cadena, siguiendo las reglas de la localización actual.</dd>
- <dt>
-  {{jsxref("Date.prototype.toSource()")}}</dt>
- <dd>
-  Devuelve un literal que representa al objeto <code>Date</code> especificado; puede usar este valor para crear un nuevo objeto. Sobreescribe el método {{jsxref("Object.toSource()")}}.</dd>
- <dt>
-  {{jsxref("Date.prototype.toString()")}}</dt>
- <dd>
-  Devuelve una cadena representando el objeto <code>Date</code> especificado. Sobreescribe el método {{jsxref("Object.toString()")}}.</dd>
- <dt>
-  {{jsxref("Date.prototype.toUTCString()")}}</dt>
- <dd>
-  Convierte una fecha en una cadena, usando las reglas horarias universales.</dd>
- <dt>
-  {{jsxref("Date.prototype.valueOf()")}}</dt>
- <dd>
-  Devuelve el valor primitivo de un objeto <code>Date</code>. Sobreescribe el método {{jsxref("Object.valueOf()")}}.</dd>
-</dl>
-<p>{{ jsOverrides("Object", "methods", "getDate", "getDay", "getFullYear", "getHours", "getMilliseconds", "getMinutes", "getMonth", "getSeconds", "getTime", "getTimezoneOffset", "getUTCDate", "getUTCDay", "getUTCFullYear", "getUTCHours", "getUTCMilliseconds", "getUTCMinutes", "getUTCMonth", "getUTCSeconds", "getYear", "setdate", "setFullYear", "setHours", "setMilliseconds", "setMinutes", "setMontth", "setSeconds", "setTime", "setUTCDate", "setUTCFullYear", "setUTCHours", "setUTCMilliseconds", "setUTCMinutes", "setUTCMonth", "setUTCSeconds", "setYear", "toDateString", "toGMTString", "toLocaleDateString", "toLocaleFormat", "toLocaleString", "toLocaleTimeString", "toSource", "toString", "toTimeString", "toUTCString", "valueOf") }}</p>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/setfullyear/index.html b/files/es/web/javascript/referencia/objetos_globales/date/setfullyear/index.html
deleted file mode 100644
index e272f78fc3..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/setfullyear/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: Date.prototype.setFullYear()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/setFullYear
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/setFullYear
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>setFullYear()</code></strong> fija el año completo para una fecha específica de acuerdo a la zona horaria local. Devuelve un nuevo valor de tipo timestamp.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.setFullYear(<var>valorAño</var>[, <var>valorMes</var>[, <var>valorDia</var>]])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valorAño</code></dt>
- <dd>Valor de tipo entero que contiene el valor numérico del año, por ejemplo, 1995.</dd>
- <dt><code>valorMes</code></dt>
- <dd>Opcional. Valor entero entre 0 y 11 que representa el mes de Enero a Diciembre.</dd>
- <dt><code>valorDia</code></dt>
- <dd>Opcional. Valor entero entre 1 y 31 que representa el día del mes. Si se especifica este parámetro debe incluirse también el parámetro <code>valorMes</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El número de milisegundos entre 1 Enero 1970 00:00:00 UTC y a la fecha actualizada con el valor del año.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si en la invocación al método no se especifican los parámetros <code>valorMes</code> y <code>valorDia, se emplean en su lugar los valores devueltos por </code> {{jsxref("Date.prototype.getMonth()", "getMonth()")}} y {{jsxref("Date.prototype.getDate()", "getDate()")}}.</p>
-
-<p>Si se especifica un parámetro con un valor fuera del rango esperado,  <code>setFullYear()</code> intenta actualizar el resto de parámetros y la informacion de fecha en el objeto {{jsxref("Date")}} de manera consistente. Por ejemplo, si se especifica el valor 15 para el parametro <code>valorMes</code>, el parámetro año se incrementa en 1  (<code>valorAño+ 1</code>), y se emplea  3 como valor para el parámetro mes.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_de_setFullYear()">Uso de <code>setFullYear()</code></h3>
-
-<pre class="brush: js">var theBigDay = new Date();
-theBigDay.setFullYear(1997);
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.3.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.40', 'Date.prototype.setFullYear')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.setfullyear', 'Date.prototype.setFullYear')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.setfullyear', 'Date.prototype.setFullYear')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getUTCFullYear()")}}</li>
- <li>{{jsxref("Date.prototype.setUTCFullYear()")}}</li>
- <li>{{jsxref("Date.prototype.setYear()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/setmonth/index.html b/files/es/web/javascript/referencia/objetos_globales/date/setmonth/index.html
deleted file mode 100644
index 04aa9ec82a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/setmonth/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: Date.prototype.setMonth()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/setMonth
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/setMonth
----
-<div>{{JSRef}}</div>
-
-<div>El método <strong><code>setMonth()</code></strong> establece el mes para una fecha específica de acuerdo con el año establecido actualmente.</div>
-
-<div>{{EmbedInteractiveExample("pages/js/date-setmonth.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.setMonth(<var>monthValue</var>[,<em>dayValue</em>])</code></pre>
-
-<h3 id="Versiones_anteriores_a_JavaScript_1.3">Versiones anteriores a JavaScript 1.3</h3>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.setMonth(<var>monthValue</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>monthValue</code></dt>
- <dd>Un entero entre 0 y 11, representando los meses de Enero a Diciembre.</dd>
- <dt><code>dayValue</code></dt>
- <dd>Opcional. Un entero de 1 a 31, representando el dia del mes.</dd>
-</dl>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>El valor retornado es el número de milisegundos entre el 1 de Enero de 1970 00:00:00 UTC y la fecha actualizada.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si no especificas el parámetro <code>dayValue</code>, el valor retornado del metodo {{jsxref("Date.prototype.getDate()", "getDate()")}} es usado.</p>
-
-<p>Si un parámetro especificado esta fuera del rango esperado, <code>setMonth()</code> intenta actualizar la información de la fecha en el objeto {{jsxref("Date")}} en consecuencia. Por ejemplo, si usted usa 15 para <code>monthValue</code>, usa 12 para incrementar el año en 1, y los 3 restantes para calcular el mes.</p>
-
-<p>El día actual del mes tendrá un impacto en el comportamiento de este método. Conceptualmente agregará el número de días dados por el día actual del mes al primer día del nuevo mes especificado como parámetro, para devolver la nueva fecha. Por ejemplo, si el valor actual es el 31 de agosto de 2016, llamar a setMonth con un valor de 1 devolverá el 2 de marzo de 2016. Esto se debe a que en febrero de 2016 tuvo 29 días.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_setMonth">Usando <code>setMonth()</code></h3>
-
-<pre class="brush: js">var theBigDay = new Date();
-theBigDay.setMonth(6);
-
-//Cuidado con las transiciones de fin de mes
-var endOfMonth = new Date(2016, 7, 31);
-endOfMonth.setMonth(1);
-console.log(endOfMonth); //Wed Mar 02 2016 00:00:00
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.setmonth', 'Date.prototype.setMonth')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de extracción.</p>
-
-<p>{{Compat("javascript.builtins.Date.setMonth")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.getMonth()")}}</li>
- <li>{{jsxref("Date.prototype.setUTCMonth()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/todatestring/index.html b/files/es/web/javascript/referencia/objetos_globales/date/todatestring/index.html
deleted file mode 100644
index b0a3b5f431..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/todatestring/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: Date.prototype.toDateString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/toDateString
-tags:
-  - Fecha
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/toDateString
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toDateString()</code></strong> devuelve la porción de la fecha de un objeto {{jsxref("Date")}} en formato humano legible en Inglés Americano.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.toDateString()</code></pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena que representa la porción de fecha de un determinado objeto {{jsxref("Date")}} en formato humano legible en Inglés Americano.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las instancias de {{jsxref("Date")}} representan momentos especificos en el tiempo. Un llamado a {{jsxref("Date.prototype.toString()", "toString()")}} devolverá la fecha formateada en un formato humano legible en Inglés Americano. En <a href="/en-US/docs/SpiderMonkey">SpiderMonkey</a>, esto consiste en la porción de la fecha (día, mes, y año) seguido por la porción de la hora (horas, minutos, segundos, y zona horaria). Algunas veces sólo se necesita obtener una cadena de la porción de la hora; esto puede lograrse con el método <code>toTimeString()</code>.</p>
-
-<p>El método <code>toDateString()</code> es especialmente útil, pues los distintos motores compatibles que implementan <a href="/en-US/docs/ECMAScript">ECMA-262</a> pueden diferir en la cadena obtenida al ejecutar {{jsxref("Date.prototype.toString()", "toString()")}} para los objetos de tipo {{jsxref("Date")}}, pues dicho formato depende de la implementación, por lo que es posible que el enfoque de la segmentación simple de cadenas no produzca resultados consistentes entre distintos motores.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_básico_de_toDateString()">Uso básico de <code>toDateString()</code></h3>
-
-<pre class="brush: js">var d = new Date(1993, 5, 28, 14, 39, 7);
-
-console.log(d.toString());     // logs Wed Jun 28 1993 14:39:07 GMT-0600 (PDT)
-console.log(d.toDateString()); // logs Wed Jun 28 1993
-</pre>
-
-<div class="note">
-<p><strong>Nota:</strong> Los meses son 0-indexados cuando son utilizados como parámetros de {{jsxref("Date")}} (Siendo así, el cero (0) corresponde a Enero y el once (11) a Diciembre).</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Epecificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.3', 'Date.prototype.toDateString')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.todatestring', 'Date.prototype.toDateString')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.todatestring', 'Date.prototype.toDateString')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quisieras contrubuir con esos datos, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y genera un pull request.</p>
-
-<p>{{Compat("javascript.builtins.Date.toDateString")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
- <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
- <li>{{jsxref("Date.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/toisostring/index.html b/files/es/web/javascript/referencia/objetos_globales/date/toisostring/index.html
deleted file mode 100644
index b3461f355d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/toisostring/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Date.prototype.toISOString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/toISOString
-tags:
-  - Date
-  - JavaScript
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/toISOString
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toISOString()</code></strong> devuelve una cadena en el formato <em>simplificado</em> extendido ISO (<a href="http://en.wikipedia.org/wiki/ISO_8601">ISO 8601</a>), que siempre mide 24 o 27 caracteres de largo: (<code><var>YYYY</var>-<var>MM</var>-<var>DD</var>T<var>HH</var>:<var>mm</var>:<var>ss.sss</var>Z</code> or <code><var>±</var><var>YYYYYY</var>-<var>MM</var>-<var>DD</var>T<var>HH</var>:<var>mm</var>:<var>ss.sss</var>Z</code>, respectivamente). El uso horario no tiene retraso respecto a UTC, como lo denota el sufijo <code>"Z"</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>dateObj</var>.toISOString()</code>
-</pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena que representa la fecha dada en el formato <a href="http://en.wikipedia.org/wiki/ISO_8601">ISO 8601</a> según la hora universal.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toISOString">Usando <code>toISOString()</code></h3>
-
-<pre class="brush: js notranslate">var today = new Date('05 October 2011 14:48 UTC');
-
-console.log(today.toISOString()); // Devuelve 2011-10-05T14:48:00.000Z
-</pre>
-
-<p>El ejemplo de arriba usa una cadena no estándar que podría no ser interpretada correctamente en navegadores distintos de Firefox.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este método fue estandarizado en ECMA-262 5° edición. Los motores javascript que no han sido actualizados para soportar este método pueden solucionar su ausencia de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">if (!Date.prototype.toISOString) {
-  (function() {
-
-    function pad(number) {
-      if (number &lt; 10) {
-        return '0' + number;
-      }
-      return number;
-    }
-
-    Date.prototype.toISOString = function() {
-      return this.getUTCFullYear() +
-        '-' + pad(this.getUTCMonth() + 1) +
-        '-' + pad(this.getUTCDate()) +
-        'T' + pad(this.getUTCHours()) +
-        ':' + pad(this.getUTCMinutes()) +
-        ':' + pad(this.getUTCSeconds()) +
-        '.' + (this.getUTCMilliseconds() / 1000).toFixed(3).slice(2, 5) +
-        'Z';
-    };
-
-  }());
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.43', 'Date.prototype.toISOString')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en javascript 1.8</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-date.prototype.toisostring', 'Date.prototype.toISOString')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
- <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
- <li>{{jsxref("Date.prototype.toUTCString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/tojson/index.html b/files/es/web/javascript/referencia/objetos_globales/date/tojson/index.html
deleted file mode 100644
index 7d44a716c2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/tojson/index.html
+++ /dev/null
@@ -1,61 +0,0 @@
----
-title: Date.prototype.toJSON()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/toJSON
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/toJSON
----
-<div>{{JSRef}}</div>
-
-<p>El metodo <strong><code>toJSON()</code></strong> retorna una representacion de cadena del objeto {{jsxref("Date")}}</p>
-
-<div>{{EmbedInteractiveExample("pages/js/date-tojson.html")}}</div>
-
-<p class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, por favor clone  <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envienos un pull request.</p>
-
-<h2 id="Syntaxis">Syntaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>dateObj</var>.toJSON()</code></pre>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Una representación de cadena de la fecha dada.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>{{jsxref("Date")}} las instancias se refieren a un momento específico en el tiempo. Llamando a <code>toJSON()</code> retorna un string (usando {{jsxref("Date.prototype.toISOString()", "toISOString()")}}) representando el {{jsxref("Date")}} valor del objeto. Este método generalmente está destinado, de forma predeterminada, a serializar de manera útil {{jsxref("Date")}} objetos durante la serialización <a href="/en-US/docs/Glossary/JSON">JSON</a> .</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toJSON">Usando <code>toJSON()</code></h3>
-
-<pre class="brush:js notranslate">var jsonDate = (new Date()).toJSON();
-var backToDate = new Date(jsonDate);
-
-console.log(jsonDate); //2015-10-26T07:46:36.611Z
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.tojson', 'Date.prototype.toJSON')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_buscadores">Compatibilidad en buscadores</h2>
-
-<p class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envienos un pull request.</p>
-
-<p>{{Compat("javascript.builtins.Date.toJSON")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
- <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
- <li>{{jsxref("Date.prototype.toUTCString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/tolocaledatestring/index.html b/files/es/web/javascript/referencia/objetos_globales/date/tolocaledatestring/index.html
deleted file mode 100644
index 26b773ba9a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/tolocaledatestring/index.html
+++ /dev/null
@@ -1,159 +0,0 @@
----
-title: Date.prototype.toLocaleDateString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleDateString
-tags:
-  - Fecha
-  - IANA formato horario
-  - Internacionalizacion
-  - JavaScript
-  - Prototipo
-  - Prototype
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toLocaleDateString()</code></strong> devuelve una cadena con una representación de la fecha sensible al lenguaje. Los nuevos argumentos <code>locales</code> y <code>options</code> permiten a las aplicaciones especificar el lenguaje cuyas convenciones de formato deben usarse y permitir personalizar el comportamiento de la función. En implementaciones anteriores, las cuales ignoran los argumentos <code>locales</code> y <code>options</code>, el configuración regional usada y el formato de cadena devuelto dependen completamente de la implementación.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/date-tolocaledatestring.html")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo está almacenado en el repositorio de GitHub. Si usted quiere contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción (pull request).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>dateObj</var>.toLocaleDateString([<var>locales</var> [, <var>options</var>]])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Compruebe la sección de <a href="#Browser_compatibility">Compatibilidad con su navegador</a> para ver qué navegadores suportan los argumentos <code>locales</code> y <code>options</code>, y el Ejemplo: <a href="#Checking_for_support_for_locales_and_options_arguments">Comprobando el soporte para los argumentos locales y options</a> para detectar dicha característica.</p>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat', 'Parameters')}}</div>
-
-<p>El valor por defecto para cada propiedad del componente date-time es {{jsxref("undefined")}}, pero si las propiedades <code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code> son todas {{jsxref("undefined")}}, entonces <code>year</code>, <code>month</code>, y <code>day</code> se asumen tener el valor <code>"numeric"</code>.</p>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena representando una porción de fecha de la instancia {{jsxref("Global_Objects/Date", "Date")}} indicada de acuerdo con las convenciones específicas del lenguaje.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toLocaleDateString">Usando <code>toLocaleDateString()</code></h3>
-
-<p>En un caso básico sin especificar una configuración regional, se devolverá una cadena formateada en la configuración regional y las opciones por defecto.</p>
-
-<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
-
-// toLocaleDateString() sin argumentos dependientes de la implementación,
-// de la configuración regional por defecto y la zona horaria por defecto
-console.log(date.toLocaleDateString());
-// → "12/11/2012" si se ejecuta en una configuración regional en-US con zona horaria America/Los_Angeles
-</pre>
-
-<h3 id="Comprobando_el_soporte_para_los_argumentos_locales_y_options">Comprobando el soporte para los argumentos <code>locales</code> y <code>options</code></h3>
-
-<p>Los argumentos <code>locales</code> y <code>options</code> no son soportados aún por todos los navegadores. Para comprobar si una implementación los soporta, puede usar el requerimiento To check whether an implementation supports them already, you can use the requirement that illegal language tags are rejected with a {{jsxref("RangeError")}} exception:</p>
-
-<pre>function toLocaleDateStringSupportsLocales() {
-  try {
-    new Date().toLocaleDateString('i');
-  } catch (e) {
-    return e.name === 'RangeError';
-  }
-  return false;
-}
-
-Using <code>locales</code></pre>
-
-<h3 id="Usando_locales">Usando <code>locales</code></h3>
-
-<p>Este ejemplo muestra algunas de las variaciones en los formatos de configuración regional de las fechas. Para poder obtener el formato del idioma usado en la interfaz de usuario de su aplicación, asegúrese de especificar el idioma (y posiblemente algunos idiomas alternativos) usando el argumento <code>locales</code>:</p>
-
-<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
-
-// Los formatos de abajo asumen la zona horaria local de la configuración regional;
-// America/Los_Angeles para US
-
-// El inglés de USA hace uso de orden mes-día-año
-console.log(date.toLocaleDateString('en-US'));
-// → "12/19/2012"
-
-// El inglés británico hace uso del orden día-mes-año
-console.log(date.toLocaleDateString('en-GB'));
-// → "20/12/2012"
-
-// El coreano hace uso del orden año-mes-día
-console.log(date.toLocaleDateString('ko-KR'));
-// → "2012. 12. 20."
-
-// Evento para persa. Es difícil convertir manualmente la fecha a Solar Hijri
-console.log(date.toLocaleDateString('fa-IR'));
-// → "۱۳۹۱/۹/۳۰"
-
-// El árave en la mayoría de paises arabehablantes hace uso de los dígitos árabes
-console.log(date.toLocaleDateString('ar-EG'));
-// → "<span dir="rtl">٢٠‏/١٢‏/٢٠١٢</span>"
-
-// Para el japonés, las aplicaciones quieren poder usar el calendario japonés,
-// donde 2012 era el año 24 de la era Heisei
-console.log(date.toLocaleDateString('ja-JP-u-ca-japanese'));
-// → "24/12/20"
-
-// Cuando solicite un idioma que no esté soportado, por ejemplo el balinés,
-// incluya un idioma alternativo, en este caso el indonesio
-console.log(date.toLocaleDateString(['ban', 'id']));
-// → "20/12/2012"
-</pre>
-
-<h3 id="Usando_options">Usando <code>options</code></h3>
-
-<p>Los resultados aportados por <code>toLocaleDateString()</code> pueden ser personalizados usando el argumento <code>options</code>:</p>
-
-<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
-
-// Solicita el día de la semana junto a una fecha larga
-var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
-console.log(date.toLocaleDateString('de-DE', options));
-// → "Donnerstag, 20. Dezember 2012"
-
-// Una aplicación puede querer usar UTC y hacer que sea visible
-options.timeZone = 'UTC';
-options.timeZoneName = 'short';
-console.log(date.toLocaleDateString('en-US', options));
-// → "Thursday, December 20, 2012, GMT"
-</pre>
-
-<h2 id="Performance">Performance</h2>
-
-<p>Cuando se formatea números largos de fechas, es mejor crear un objeto {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} y usar la función aportada por esta propiedad {{jsxref("DateTimeFormat.prototype.format", "format")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.tolocaledatestring', 'Date.prototype.toLocaleDateString')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocaledatestring', 'Date.prototype.toLocaleDateString')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada desde una estructura de datos. Si usted desea contribuir a los datos, por favor compruebe <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de extracción (pull request).</p>
-
-<p>{{Compat("javascript.builtins.Date.toLocaleDateString")}}</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
- <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
- <li>{{jsxref("Date.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/tolocalestring/index.html b/files/es/web/javascript/referencia/objetos_globales/date/tolocalestring/index.html
deleted file mode 100644
index 77f48344d3..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/tolocalestring/index.html
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: Date.prototype.toLocaleString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleString
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleString
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toLocaleString()</code></strong> devuelve un cadena con la representación al idioma de la fecha especificada. <span class="tlid-translation translation" lang="es"><span title="">Los nuevos argumentos </span></span> <code>locales</code> <span class="tlid-translation translation" lang="es"><span title="">y </span></span> <code>options</code> <span class="tlid-translation translation" lang="es"><span title=""> permiten a las aplicaciones especificar el idioma cuyas convenciones de formato deben usarse y personalizar el comportamiento de la función</span></span>. <span class="tlid-translation translation" lang="es"><span title="">En implementaciones anteriores, ignoran los argumentos de las configuraciones </span></span><code>locales</code><span class="tlid-translation translation" lang="es"><span title=""> y  </span></span><code>options</code> <span class="tlid-translation translation" lang="es"><span title=""> </span></span><span class="tlid-translation translation" lang="es"><span title="">, la configuración regional utilizada y la forma de la cadena devuelta dependen completamente de la implementación</span></span> .</p>
-
-<div>{{EmbedInteractiveExample("pages/js/date-tolocalestring.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><var>dateObj</var>.toLocaleString([<var>locales</var>[, <var>options</var>]])</pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<p>Los argumentos <code>locales</code> y de <code>options</code>  personalizan el comportamiento de la función y permiten que las aplicaciones especifiquen el lenguaje cuyas convenciones de formato deben ser utilizadas. En las implementaciones, que ignoran los argumentos, <code>locales</code> y <code>options</code>, el locale utilizado y la forma de la cadena devuelta dependen totalmente de la implementación.</p>
-
-<p>Vea el  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat">constructor</a> de <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat"><code>Intl.DateTimeFormat()</code> </a> para detalles en esos parametros y como se usan.</p>
-
-<p>El valor por defecto para cada componente <code>date-time</code> es  {{jsxref("undefined")}}, pero si las propiedades <code>weekday</code>, <code>year</code>, <code>month</code>, <code>day</code> son todas {{jsxref("undefined")}}, entonces <code>year</code>, <code>month</code>, y <code>day</code> son asumidas como <code>"numeric"</code>.</p>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>A string representing the given date according to language-specific conventions.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_toLocaleString">Using <code>toLocaleString()</code></h3>
-
-<p>In basic use without specifying a locale, a formatted string in the default locale and with default options is returned.</p>
-
-<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
-
-// toLocaleString() without arguments depends on the implementation,
-// the default locale, and the default time zone
-console.log(date.toLocaleString());
-// → "12/11/2012, 7:00:00 PM" if run in en-US locale with time zone America/Los_Angeles
-</pre>
-
-<h3 id="Checking_for_support_for_locales_and_options_arguments">Checking for support for <code>locales</code> and <code>options</code> arguments</h3>
-
-<p>The <code>locales</code> and <code>options</code> arguments are not supported in all browsers yet. To check whether an implementation supports them already, you can use the requirement that illegal language tags are rejected with a {{jsxref("RangeError")}} exception:</p>
-
-<pre class="brush: js">function toLocaleStringSupportsLocales() {
-  try {
-    new Date().toLocaleString('i');
-  } catch (e) {
-    return e instanceof RangeError;
-  }
-  return false;
-}
-</pre>
-
-<h3 id="Using_locales">Using <code>locales</code></h3>
-
-<p>This example shows some of the variations in localized date and time formats. In order to get the format of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the <code>locales</code> argument:</p>
-
-<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
-
-// formats below assume the local time zone of the locale;
-// America/Los_Angeles for the US
-
-// US English uses month-day-year order and 12-hour time with AM/PM
-console.log(date.toLocaleString('en-US'));
-// → "12/19/2012, 7:00:00 PM"
-
-// British English uses day-month-year order and 24-hour time without AM/PM
-console.log(date.toLocaleString('en-GB'));
-// → "20/12/2012 03:00:00"
-
-// Korean uses year-month-day order and 12-hour time with AM/PM
-console.log(date.toLocaleString('ko-KR'));
-// → "2012. 12. 20. 오후 12:00:00"
-
-// Arabic in most Arabic speaking countries uses real Arabic digits
-console.log(date.toLocaleString('ar-EG'));
-// → "<span dir="rtl">٢٠‏/١٢‏/٢٠١٢ ٥:٠٠:٠٠ ص</span>"
-
-// for Japanese, applications may want to use the Japanese calendar,
-// where 2012 was the year 24 of the Heisei era
-console.log(date.toLocaleString('ja-JP-u-ca-japanese'));
-// → "24/12/20 12:00:00"
-
-// when requesting a language that may not be supported, such as
-// Balinese, include a fallback language, in this case Indonesian
-console.log(date.toLocaleString(['ban', 'id']));
-// → "20/12/2012 11.00.00"
-</pre>
-
-<h3 id="Using_options">Using <code>options</code></h3>
-
-<p>The results provided by <code>toLocaleString()</code> can be customized using the <code>options</code> argument:</p>
-
-<pre class="brush: js">var date = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
-
-// request a weekday along with a long date
-var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
-console.log(date.toLocaleString('de-DE', options));
-// → "Donnerstag, 20. Dezember 2012"
-
-// an application may want to use UTC and make that visible
-options.timeZone = 'UTC';
-options.timeZoneName = 'short';
-console.log(date.toLocaleString('en-US', options));
-// → "Thursday, December 20, 2012, GMT"
-
-// sometimes even the US needs 24-hour time
-console.log(date.toLocaleString('en-US', { hour12: false }));
-// → "12/19/2012, 19:00:00"
-</pre>
-
-<h3 id="Avoid_comparing_formatted_date_values_to_static_values">Avoid comparing formatted date values to static values</h3>
-
-<p>Most of the time, the formatting returned by <code>toLocaleString()</code> is consistent. However, this might change in the future and isn't guaranteed for all languages — output variations are by design and allowed by the specification. Most notably, the IE and Edge browsers insert bidirectional control characters around dates, so the output text will flow properly when concatenated with other text.</p>
-
-<p>For this reason you cannot expect to be able to compare the results of <code>toLocaleString()</code> to a static value:</p>
-
-<pre class="brush: js; example-bad">"1/1/2019, 01:00:00" === new Date("2019-01-01T01:00:00Z").toLocaleString("en-US");
-// true in Firefox and others
-// false in IE and Edge</pre>
-
-<div class="blockIndicator note">
-<p><strong>Note</strong>: See also this <a href="https://stackoverflow.com/questions/25574963/ies-tolocalestring-has-strange-characters-in-results">StackOverflow thread</a> for more details and examples.</p>
-</div>
-
-<h2 id="Performance">Performance</h2>
-
-<p>When formatting large numbers of dates, it is better to create an {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} object and use the function provided by its {{jsxref("DateTimeFormat.prototype.format", "format")}} property.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.tolocalestring', 'Date.prototype.toLocaleString')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocalestring', 'Date.prototype.toLocaleString')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Date.toLocaleString")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
- <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
- <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
- <li>{{jsxref("Date.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/tolocaletimestring/index.html b/files/es/web/javascript/referencia/objetos_globales/date/tolocaletimestring/index.html
deleted file mode 100644
index c3954096f6..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/tolocaletimestring/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: Date.prototype.toLocaleTimeString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/toLocaleTimeString
-tags:
-  - Date
-  - Fecha
-  - Internacionalizacion
-  - JavaScript
-  - Method
-  - Prototype
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/toLocaleTimeString
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toLocaleTimeString()</code></strong> devuelve una cadena con una representación de la parte del tiempo de esta fecha sensible al idioma. Los nuevos argumentos <code>locales</code> y <code>options</code> le permiten a la aplicación especificar el idioma cuyas convenciones de formato deben usarse y personalizan el comportamiento de esta función. En implementaciones antiguas que ignoran los argumentos <code>locales</code> y <code>options</code> la localidad usada y la forma de la cadena devuelta son completamente dependientes de la implementación.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/date-tolocaletimestring.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.toLocaleTimeString([<var>locales[, </var><var>options</var>]])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Los argumentos <code>locales</code> y <code>options</code> personalizan el comportamiento de la función y le permiten a la aplicación especificar el idioma cuyas convenciones de formato deben usarse. En las implementaciones que ignoran los argumentos <code>locales</code> y <code>options</code>, la localidad y la forma de la cadena devuelta son dependientes por completo de la implementación.</p>
-
-<p>Vea el <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat/DateTimeFormat">constructor <code>Intl.DateTimeFormat()</code></a> para los detalles de estos parámetros y sobre cómo usarlos.</p>
-
-<p>El valor predeterminado de cada componente de fecha-hora es {{jsxref("undefined")}}, pero si las propiedades <code>weekday</code>, <code>year</code>, <code>month</code> y <code>day</code> son todas {{jsxref("undefined")}}, entonces <code>year</code>, <code>month</code> y <code>day</code> se asumen como <code>"numeric"</code>.</p>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena representando la porción de tiempo de la instancia {{jsxref("Global_Objects/Date", "Date")}} dada, conforme a las convenciones específicas del idioma.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toLocaleTimeString">Usando <code>toLocaleTimeString()</code></h3>
-
-<p>En el uso básico sin especificar una localidad, una cadena con formato en la localidad y opciones predeterminadas es devuelta.</p>
-
-<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
-
-// toLocaleTimeString() sin argumentos depende de la implementación,
-// la localidad y la zona horaria predeterminadas
-console.log(date.toLocaleTimeString());
-// → "21:00:00" si se ejecuta en la localidad es-MX con la zona horaria America/Mexico_City
-</pre>
-
-<h3 id="Verificando_el_soporte_de_argumentos_locales_y_options">Verificando el soporte de argumentos <code>locales</code> y <code>options</code></h3>
-
-<p>Los argumentos <code>locales</code> y <code>options</code> aún no están soportados en todos los navegadores. Para verificar si alguna implementación ya los soporta, puede usar el requerimiento de que etiquetas inválidas son rechazadas con una excepción {{jsxref("RangeError")}}:</p>
-
-<pre class="brush: js">function toLocaleTimeStringSoportaLocales() {
-  try {
-    new Date().toLocaleTimeString('i');
-  } catch (e) {
-    return e​.name === 'RangeError';
-  }
-  return false;
-}
-</pre>
-
-<h3 id="Usando_locales">Usando <code>locales</code></h3>
-
-<p>Este ejemplo muestra una de las variaciones en formatos de tiempo localizados. Para obtener el formato del idioma usado en la interfaz de su aplicación, asegúrese de especificar ese idioma (y posiblemente algunos de <em>fallback</em>) usando el argumento <code>locales</code>:</p>
-
-<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
-
-// los siguientes formatos asumen la zona horaria de la localidad;
-// America/Los_Angeles para los EEUU
-
-// El inglés americano usa formato de 12 horas con AM/PM
-console.log(fecha.toLocaleTimeString('en-US'));
-// → "7:00:00 PM"
-
-// El inglés británico usa formato de 24 horas sin AM/PM
-console.log(date.toLocaleTimeString('en-GB'));
-// → "03:00:00"
-
-// El koreano usa formato de 12 horas con AM/PM
-console.log(date.toLocaleTimeString('ko-KR'));
-// → "오후 12:00:00"
-
-// En muchos países donde hablan árabe se usan dígitos árabes
-console.log(date.toLocaleTimeString('ar-EG'));
-// → "<span dir="rtl">٧:٠٠:٠٠ م</span>"
-
-// cuando se pide un idioma que puede no estar disponible, como
-// balinés, incluya un idioma de respaldo, como en este caso, indonesio
-console.log(date.toLocaleTimeString(['ban', 'id']));
-// → "11.00.00"
-</pre>
-
-<h3 id="Usando_options">Usando <code>options</code></h3>
-
-<p>Los resultados provistos por <code>toLocaleTimeString()</code> pueden ser personalizados usando el argumento <code>options</code>:</p>
-
-<pre class="brush: js">var fecha = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));
-
-// una aplicación puede querer usar UTC y visibilizarlo:
-var options = { timeZone: 'UTC', timeZoneName: 'short' };
-console.log(date.toLocaleTimeString('en-US', options));
-// → "3:00:00 AM GMT"
-
-// algunas veces incluso en EEUU necesitan el tiempo en 24 horas
-console.log(date.toLocaleTimeString('en-US', { hour12: false }));
-// → "19:00:00"
-
-// mostrar únicamente horas y minutos, use options con la localidad predeterminada - usar un arreglo vacío
-console.log(date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }));
-// → "20:01"
-
-</pre>
-
-<h2 id="Rendimiento">Rendimiento</h2>
-
-<p>Cuando se da formato a un gran número de fechas, es mejor crear un objeto {{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}} y usar su método {{jsxref("DateTimeFormat.prototype.format", "format")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sup-date.prototype.tolocaletimestring', 'Date.prototype.toLocaleTimeString')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Date.toLocaleTimeString")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
- <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
- <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("Date.prototype.toTimeString()")}}</li>
- <li>{{jsxref("Date.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/toutcstring/index.html b/files/es/web/javascript/referencia/objetos_globales/date/toutcstring/index.html
deleted file mode 100644
index 4742a6eacf..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/toutcstring/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: Date.prototype.toUTCString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/toUTCString
-tags:
-  - Date
-  - JavaScript
-  - Method
-  - Prototype
-  - Reference
-  - UTC
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/toUTCString
----
-<div>{{JSRef}}</div>
-
-<p><code>El método</code><strong><code>toUTCString()</code></strong> convierte una fecha en una cadena, utilizando <span class="tlid-translation translation" lang="es"><span title="">la zona horaria UTC.</span></span></p>
-
-<div>{{EmbedInteractiveExample("pages/js/date-toutcstring.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>dateObj</var>.toUTCString()</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una cadena que representa la fecha dada usando la zona horaria UTC</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El valor devuelto por <code>toUTCString()</code> es una cadena con la forma</p>
-
-<p><code>Www, dd Mmm yyyy hh:mm:ss GMT</code></p>
-
-<p>donde:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td>Www</td>
-   <td>Día de la semana, como tres letras (ej. Sun, Mon, ...)</td>
-  </tr>
-  <tr>
-   <td>dd</td>
-   <td>Día del mes, como dos dígitos, con cero a la izquierda si es necesario.</td>
-  </tr>
-  <tr>
-   <td>Mmm</td>
-   <td>Mes, como tres letras (ej. Jan, Feb, ...)</td>
-  </tr>
-  <tr>
-   <td>yyyy</td>
-   <td>Año, como cuatro o más dígitos con cero a la izquierda si es necesario.</td>
-  </tr>
-  <tr>
-   <td>hh</td>
-   <td>Hora, como dos dígitos con cero a la izquierda si es necesario.</td>
-  </tr>
-  <tr>
-   <td>mm</td>
-   <td>Minutos, como dos dígitos con cero a la izquierda si es necesario.</td>
-  </tr>
-  <tr>
-   <td>ss</td>
-   <td>Segundos, como dos dígitos con cero a la izquierda si es necesario.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Antes de ECMAScript 2018, el formato del valor devuelto variaba según la plataforma. El valor devuelto más comun era un sello de fecha con formato RFC-1123, que es una versión ligeramente actualizada de los sellos de fecha RFC-822.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toUTCString">Usando <code>toUTCString()</code></h3>
-
-<pre class="brush: js">var today = new Date('Wed, 14 Jun 2017 00:00:00 PDT');
-var UTCstring = today.toUTCString(); // Wed, 14 Jun 2017 07:00:00 GMT
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-date.prototype.toutcstring', 'Date.prototype.toUTCString')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Date.toUTCString")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("Date.prototype.toDateString()")}}</li>
- <li>{{jsxref("Date.prototype.toISOString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/date/utc/index.html b/files/es/web/javascript/referencia/objetos_globales/date/utc/index.html
deleted file mode 100644
index 605ae2819d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/date/utc/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: Date.UTC()
-slug: Web/JavaScript/Referencia/Objetos_globales/Date/UTC
-tags:
-  - Date
-  - JavaScript
-  - Method
-  - Reference
-translation_of: Web/JavaScript/Reference/Global_Objects/Date/UTC
----
-<div>
- {{JSRef("Objetos_globales", "Date")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Accepts the same parameters as the longest form of the constructor, and returns the number of milliseconds in a <code>Date</code> object since January 1, 1970, 00:00:00, universal time.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox">Date.UTC(<em>año</em>,<em>mes</em>[, <em>dia</em>[, <em>hora</em>[, <em>minutos</em>[, <em>segundos</em>, <em>milisegundos</em>]]]])</pre>
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-<dl>
- <dt>
-  <code>año</code></dt>
- <dd>
-  Un año mayor de 1900.</dd>
-</dl>
-<dl>
- <dt>
-  <code>mes</code></dt>
- <dd>
-  Un entero entre 0 y 11 que representa al mes.</dd>
-</dl>
-<dl>
- <dt>
-  <code>dia</code></dt>
- <dd>
-  Un entero entre 1 y 31 que representa al día del mes.</dd>
-</dl>
-<dl>
- <dt>
-  <code>hora</code></dt>
- <dd>
-  Un entero entre 0 y 23 que representa la hora.</dd>
-</dl>
-<dl>
- <dt>
-  <code>minutos</code></dt>
- <dd>
-  Un entero entre 0 y 59 que representa los minutos.</dd>
-</dl>
-<dl>
- <dt>
-  <code>segundos</code></dt>
- <dd>
-  Un entero entre 0 y 59 que representa los segundos.</dd>
-</dl>
-<dl>
- <dt>
-  <code>milisegundos</code></dt>
- <dd>
-  Un entero entre 0 y 999 que representa los milisegundos.</dd>
-</dl>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p><code>UTC</code> toma los parámetros de la fecha delimitados por punto y comay devuelve el número de milisegundos entre las 00:00:00 del 1 de enero de 1970 (hora universal) y la hora que especifique.</p>
-<p>Debería especificar los dígitos del año completo; por ejemplo, 1998. Si se especifica un año entre 0 y 99, el método convierte dicho año en uno del siglo XX (1900 + año); por ejemplo, si especifica 95, se usará el año 1995.</p>
-<p>El método <code>UTC</code> difiere del constructor de <code>Date</code> de dos modos.</p>
-<ul>
- <li><code>Date.UTC</code> utiliza la fecha y hora universal en vez de la local.</li>
- <li><code>Date.UTC</code> devuelve la fecha y hora como un número en vez de crear un objeto <code>Date</code>.</li>
-</ul>
-<p>Si especifica un parámetro fuera del rango esperado, el método <code>UTC</code> modifica los otros parámetros para tener en cuenta su número. Por ejemplo, si usa 15 para el mes, el año será incrementado en 1 (año + 1), y 3 se usará para el mes.</p>
-<p>Debido a que <code>UTC</code> es un método estático de <code>Date</code>, utilícelo siempre como <code>Date.UTC()</code>, en vez de como un método del objeto <code>Date</code> que usted cree.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_Date.UTC" name="Ejemplo:_Usando_Date.UTC">Ejemplo: Usando <code>Date.UTC</code></h3>
-<p>La sentencia siguiente crea un objeto <code>Date</code> usando GMT en vez de la hora local:</p>
-<pre class="brush: js">fechaGmt = new Date(Date.UTC(96, 11, 1, 0, 0, 0));
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("Date.parse()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/decodeuri/index.html b/files/es/web/javascript/referencia/objetos_globales/decodeuri/index.html
deleted file mode 100644
index dc8264eebe..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/decodeuri/index.html
+++ /dev/null
@@ -1,38 +0,0 @@
----
-title: decodeURI()
-slug: Web/JavaScript/Referencia/Objetos_globales/decodeURI
-tags:
-  - JavaScript
-  - URI
-translation_of: Web/JavaScript/Reference/Global_Objects/decodeURI
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>Decodifica un Identificador de Recurso Uniforme (Uniform Resource Identifier, URI) previamente creado por {{jsxref("encodeURI")}} o por una rutina similar.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<p><code>decodeURI(<em>encodedURI</em>) </code></p>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>encodedURI</code></dt>
- <dd>Un completo, Identificador de Recurso Uniforme.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Sustituye a cada secuencia de escape codificado en URI con el carácter que representa.</p>
-
-<p>No decodifica secuencias de escape que no se puedan haber introducido por {{jsxref("encodeURI")}}.</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("decodeURIComponent")}}</li>
- <li>{{jsxref("encodeURI")}}</li>
- <li>{{jsxref( "encodeURIComponent")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/decodeuricomponent/index.html b/files/es/web/javascript/referencia/objetos_globales/decodeuricomponent/index.html
deleted file mode 100644
index 05d9bd4b52..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/decodeuricomponent/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: decodeURIComponent
-slug: Web/JavaScript/Referencia/Objetos_globales/decodeURIComponent
-tags:
-  - JavaScript
-  - JavaScript Reference
-  - URI
-translation_of: Web/JavaScript/Reference/Global_Objects/decodeURIComponent
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>Decodifica un Identificador de Recurso Uniforme (Uniform Resource Identifier, URI) previamente creado por {{jsxref("encodeURIComponent")}} o por una rutina similar.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p><code>decodeURIComponent(<em>encodedURI</em>) </code></p>
-
-<h2 id="Parameters" name="Parameters">Parámetros</h2>
-
-<dl>
- <dt><code>encodedURI</code></dt>
- <dd>Un Identificador de Recurso Uniforme codificado.</dd>
- <dt> </dt>
-</dl>
-
-<h2 id="Return value" name="Return value">Valor retornado</h2>
-
-<p>Retorna una nueva cadena representando la version decodificada del componente URI dado</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Sustituye a cada secuencia de escape codificado en URI con el carácter que representa.</p>
-
-<h2 id="See_Also" name="See_Also">Ver También</h2>
-
-<ul>
- <li>{{jsxref("decodeURI")}}</li>
- <li>{{jsxref("encodeURI")}}</li>
- <li>{{jsxref("encodeURIComponent")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/encodeuri/index.html b/files/es/web/javascript/referencia/objetos_globales/encodeuri/index.html
deleted file mode 100644
index 51277231e0..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/encodeuri/index.html
+++ /dev/null
@@ -1,61 +0,0 @@
----
-title: encodeURI
-slug: Web/JavaScript/Referencia/Objetos_globales/encodeURI
-tags:
-  - JavaScript
-  - URI
-translation_of: Web/JavaScript/Reference/Global_Objects/encodeURI
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>Codifica un Identificador de Recurso Uniforme (Uniform Resource Identifier, URI) reemplazando cada instancia de ciertos carácteres por uno, dos o tres secuencias de escape representando el carácter codificado en UTF-8.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<p><code>encodeURI(<em>URI</em>) </code></p>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>URI</code></dt>
- <dd>Un Identificador de Recurso Uniforme codificado.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Se asume que el URI es un URI completo, a fin de no codificar caracteres reservados que tienen un significado especial en la URI.</p>
-
-<p><code>encodeURI </code>reemplaza todos los caracteres excepto los siguientes con las secuencias de escape UTF-8:</p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <td class="header">Tipo</td>
-   <td class="header">Incluye</td>
-  </tr>
-  <tr>
-   <td>Caracteres reservados</td>
-   <td><code>; , / ? : @ &amp; = + $</code></td>
-  </tr>
-  <tr>
-   <td>Caracteres No escape</td>
-   <td>Alfabéticos, dígitos decimales, <code>- _ . ! ~ * ' ( )</code></td>
-  </tr>
-  <tr>
-   <td>Almohadilla</td>
-   <td><code>#</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p>Tenga en cuenta que encodeURI por sí sola no puede formar solicitudes correctas HTTP GET y POST, como por XMLHTTPRequests, porque "&amp;", "+", y "=" no están codificados, los cuales son tratados como caracteres especiales en las solicitudes GET y POST. <code><a href="/es/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent" title="es/Core_JavaScript_1.5_Reference/Global_Functions/encodeURIComponent">encodeURIComponent</a></code>, sin embargo, codifica estos caracteres. Lo más probable es que estos comportamientos no sean compatibles en los navegadores Web.</p>
-
-<h2 id="See_also" name="See_also">Ver También</h2>
-
-<ul>
- <li>{{jsxref("decodeURI")}}</li>
- <li>{{jsxref("encodeURIComponent")}}</li>
- <li>{{jsxref("decodeURIComponent")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/encodeuricomponent/index.html b/files/es/web/javascript/referencia/objetos_globales/encodeuricomponent/index.html
deleted file mode 100644
index 53af149970..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/encodeuricomponent/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: encodeURIComponent
-slug: Web/JavaScript/Referencia/Objetos_globales/encodeURIComponent
-tags:
-  - JavaScript
-  - URI
-translation_of: Web/JavaScript/Reference/Global_Objects/encodeURIComponent
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <strong>encodeURIComponent()</strong> codifica un componente URI (Identificador Uniforme de Recursos) al reemplazar cada instancia de ciertos caracteres por una, dos, tres o cuatro secuencias de escape que representan la codificación UTF-8 del carácter (solo serán cuatro secuencias de escape para caracteres compuestos por dos carácteres "sustitutos").</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox">encodeURIComponent(str);</pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>str</code></dt>
- <dd>Cadena. Un componente de un URI.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p><code>encodeURIComponent</code> escapes all characters except the following: alphabetic, decimal digits, <code>- _ . ! ~ * ' ( )</code></p>
-
-<p>Note that an {{jsxref("Objetos_globales/URIError", "URIError")}} will be thrown if one attempts to encode a surrogate which is not part of a high-low pair, e.g.,</p>
-
-<pre class="brush: js">// high-low pair ok
-alert(encodeURIComponent('\uD800\uDFFF'));
-
-// lone high surrogate throws "URIError: malformed URI sequence"
-alert(encodeURIComponent('\uD800'));
-
-// lone low surrogate throws "URIError: malformed URI sequence"
-alert(encodeURIComponent('\uDFFF'));
-</pre>
-
-<p>To avoid unexpected requests to the server, you should call <code>encodeURIComponent</code> on any user-entered parameters that will be passed as part of a URI. For example, a user could type "<code>Thyme &amp;time=again</code>" for a variable <code>comment</code>. Not using <code>encodeURIComponent</code> on this variable will give <code>comment=Thyme%20&amp;time=again</code>. Note that the ampersand and the equal sign mark a new key and value pair. So instead of having a POST <code>comment</code> key equal to "<code>Thyme &amp;time=again</code>", you have two POST keys, one equal to "<code>Thyme </code>" and another (<code>time</code>) equal to <code>again</code>.</p>
-
-<p>For <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html#application/x-www-form-urlencoded-encoding-algorithm"><code>application/x-www-form-urlencoded</code></a> (POST), spaces are to be replaced by '+', so one may wish to follow a <code>encodeURIComponent</code> replacement with an additional replacement of "%20" with "+".</p>
-
-<p>To be more stringent in adhering to <a class="external" href="http://tools.ietf.org/html/rfc3986">RFC 3986</a> (which reserves !, ', (, ), and *), even though these characters have no formalized URI delimiting uses, the following can be safely used:</p>
-
-<pre class="brush: js">function fixedEncodeURIComponent (str) {
-  return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
-}
-</pre>
-
-<h2 id="See_also" name="See_also">Examples</h2>
-
-<p>The following example provides the special encoding required within UTF-8 <code>Content-Disposition</code> and <code>Link</code> server response header parameters (e.g., UTF-8 filenames):</p>
-
-<pre class="brush: js">var fileName = 'my file(2).txt';
-var header = "Content-Disposition: attachment; filename*=UTF-8''" + encodeRFC5987ValueChars(fileName);
-
-console.log(header);
-// logs "Content-Disposition: attachment; filename*=UTF-8''my%20file%282%29.txt"
-
-
-function encodeRFC5987ValueChars (str) {
-    return encodeURIComponent(str).
-        // Note that although RFC3986 reserves "!", RFC5987 does not,
-        // so we do not need to escape it
-        replace(/['()]/g, escape). // i.e., %27 %28 %29
-        replace(/\*/g, '%2A').
-            // The following are not required for percent-encoding per RFC5987,
-            //  so we can allow for a little better readability over the wire: |`^
-            replace(/%(?:7C|60|5E)/g, unescape);
-}
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 3rd Edition.</td>
-   <td>Standard</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.1.3.4', 'encodeURIComponent')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-encodeuricomponent-uricomponent', 'encodeURIComponent')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_Also" name="See_Also">See also</h2>
-
-<ul>
- <li>{{jsxref("decodeURI")}}</li>
- <li>{{jsxref("encodeURI")}}</li>
- <li>{{jsxref("decodeURIComponent")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/constructor_error/index.html b/files/es/web/javascript/referencia/objetos_globales/error/constructor_error/index.html
deleted file mode 100644
index 114831c512..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/constructor_error/index.html
+++ /dev/null
@@ -1,69 +0,0 @@
----
-title: Constructor Error()
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/constructor_Error
-tags:
-  - Constructor
-  - JavaScript
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Error/Error
----
-<div>{{JSRef}}</div>
-
-<p><span class="seoSummary">El constructor <strong><code>Error</code></strong> crea un objeto <code>Error</code>.</span></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">new Error([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>message</var></code>{{Optional_Inline}}</dt>
- <dd>Una descripción del error legible para los humanos.</dd>
- <dt><code><var>fileName</var></code> {{Optional_Inline}}{{Non-standard_inline}}</dt>
- <dd>El valor de la propiedad <code><var>fileName</var></code> en el objeto <code>Error</code> creado. De manera predeterminada, el nombre del archivo que contiene el código que llamó al constructor <code>Error()</code>.</dd>
- <dt><code><var>lineNumber</var></code> {{Optional_Inline}}{{Non-standard_inline}}</dt>
- <dd>El valor de la propiedad <code><var>lineNumber</var></code> en el objeto <code>Error</code> creado. De manera predeterminada, el número de línea que contiene la invocación del constructor <code>Error()</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Llamada_a_función_o_construcción_new">Llamada a función o construcción <code>new</code></h3>
-
-<p>Cuando se usa <code>Error</code> como una función, sin {{JSxRef("Operators/new", "new")}}, devolverá un objeto <code>Error</code>. Por lo tanto, una simple llamada a <code>Error</code> producirá el mismo resultado que la construcción de un objeto <code>Error</code> mediante la palabra clave <code>new</code>.</p>
-
-<pre class="brush: js; notranslate">// esto...
-const x = Error('¡Fui creado usando una llamada a función!')
-
-    // ...tiene la misma funcionalidad que esta.
-const y = new Error('¡Fui construido con la palabra clave "new"!') </pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-error-constructor', 'Error constructor')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Error.Error")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Sentencias/throw", "throw")}}</li>
- <li>{{JSxRef("Sentencias/try...catch", "try...catch")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/filename/index.html b/files/es/web/javascript/referencia/objetos_globales/error/filename/index.html
deleted file mode 100644
index 8e633934e0..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/filename/index.html
+++ /dev/null
@@ -1,48 +0,0 @@
----
-title: Error.prototype.fileName
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/fileName
-tags:
-  - JavaScript
-  - No estandar
-  - Propiedad
-  - Prototipo
-translation_of: Web/JavaScript/Reference/Global_Objects/Error/fileName
----
-<div>{{jsRef}}  {{non-standard_header}}</div>
-
-<p>La propiedad <code><strong>fileName</strong></code> contiene la ruta al archivo que generó este error.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Esta propiedad no estándar contiene la ruta al archivo que generó este error. Si se llama desde un contexto de depuración, devuelve las herramientas de desarrollo de Firefox, por ejemplo, "código de evaluación del depurador".</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usar_fileName">Usar <code>fileName</code></h3>
-
-<pre class="brush: js notranslate">var e = new Error('No se pudo procesar la entrada');
-throw e;
-// e.fileName podría verse como "file:///C:/ejemplo.html"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p><span class="pl-s">No forma parte de ningún estándar.</span></p>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Error.fileName")}}</p>
-</div>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Error.prototype.stack")}}</li>
- <li>{{jsxref("Error.prototype.columnNumber")}}</li>
- <li>{{jsxref("Error.prototype.lineNumber")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/index.html b/files/es/web/javascript/referencia/objetos_globales/error/index.html
deleted file mode 100644
index 03cbd038da..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/index.html
+++ /dev/null
@@ -1,219 +0,0 @@
----
-title: Error
-slug: Web/JavaScript/Referencia/Objetos_globales/Error
-tags:
-  - Error
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Global_Objects/Error
----
-<div>{{JSRef}}</div>
-
-<p>Los objetos <code>Error</code> se lanzan cuando ocurren errores en tiempo de ejecución. También puedes utilizar el objeto <code>Error</code> como objeto base para excepciones definidas por el usuario. Ve más adelante los tipos de errores estándar integrados.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los errores en tiempo de ejecución dan como resultado la creación y lanzamiento de nuevos objetos <code>Error</code>.</p>
-
-<h3 id="Tipos_Error">Tipos <code>Error</code></h3>
-
-<p>Además del constructor genérico <code>Error</code>, hay otros siete constructores de errores en el núcleo de JavaScript. Para conocer las excepciones de lado del cliente, consulta {{JSxRef("../Guide/Control_de_flujo_y_manejo_de_errores", "Declaraciones para el manejo de excepciones", "#Sentencias_de_manejo_de_excepciones", 1)}}.</p>
-
-<dl>
- <dt>{{JSxRef("EvalError")}}</dt>
- <dd>Crea una instancia que representa un error que ocurre con respecto a la función global {{JSxRef("eval", "eval()")}}.</dd>
- <dt>{{JSxRef("InternalError")}} </dt>
- <dd>Crea una instancia que representa un error que ocurre cuando se produce un error interno en el motor de JavaScript. Por ejemplo: "demasiada recursividad".</dd>
- <dt>{{JSxRef("RangeError")}}</dt>
- <dd>Crea una instancia que representa un error que ocurre cuando una variable numérica o parámetro está fuera de su rango válido.</dd>
- <dt>{{JSxRef("ReferenceError")}}</dt>
- <dd>Crea una instancia que representa un error que ocurre cuando se quita la referencia a una referencia no válida.</dd>
- <dt>{{JSxRef("SyntaxError")}}</dt>
- <dd>Crea una instancia que representa un error de sintaxis.</dd>
- <dt>{{JSxRef("TypeError")}}</dt>
- <dd>Crea una instancia que representa un error que ocurre cuando una variable o parámetro no es de un tipo válido.</dd>
- <dt>{{JSxRef("URIError")}}</dt>
- <dd>Crea una instancia que representa un error que ocurre cuando {{JSxRef("encodeURI", "encodeURI()")}} o {{JSxRef("decodeURI", "decodeURI()")}} pasan parámetros no válidos.</dd>
-</dl>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{JSxRef("Objetos_globales/Error/Error", "Error()")}}</dt>
- <dd>Crea un nuevo objeto <code>Error</code>.</dd>
-</dl>
-
-<h2 id="Métodos_estáticos">Métodos estáticos</h2>
-
-<dl>
- <dt>{{JSxRef("Error.captureStackTrace()")}}</dt>
- <dd>Una función <strong>V8</strong> no estándar que crea la propiedad {{JSxRef("Error.prototype.stack", "stack")}} en una instancia de <code>Error</code>.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{jsxref("Error.prototype.message")}}</dt>
- <dd>Mensaje de error.</dd>
- <dt>{{jsxref("Error.prototype.name")}}</dt>
- <dd>Nombre del error.</dd>
- <dt>{{jsxref("Error.prototype.description")}}</dt>
- <dd>Una propiedad no estándar de Microsoft para la descripción del error. Similar a {{jsxref("Error.prototype.message", "message")}}.</dd>
- <dt>{{jsxref("Error.prototype.number")}}</dt>
- <dd>Una propiedad no estándar de Microsoft para un número de error.</dd>
- <dt>{{jsxref("Error.prototype.fileName")}}</dt>
- <dd>Una propiedad no estándar de Mozilla para la ruta al archivo que generó este error.</dd>
- <dt>{{JSxRef("Error.prototype.lineNumber")}}</dt>
- <dd>Una propiedad no estándar de Mozilla para el número de línea en el archivo que generó este error.</dd>
- <dt>{{JSxRef("Error.prototype.columnNumber")}}</dt>
- <dd>Una propiedad no estándar de Mozilla para el número de columna en la línea que generó este error.</dd>
- <dt>{{JSxRef("Error.prototype.stack")}}</dt>
- <dd>Una propiedad no estándar de Mozilla para un seguimiento de la pila.</dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt>{{jsxref("Error.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el objeto especificado. Redefine el método {{JSxRef("Object.prototype.toString()")}}.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Lanzar_un_error_genérico">Lanzar un error genérico</h3>
-
-<p>Normalmente, creas un objeto <code>Error</code> con la intención de generarlo utilizando la palabra clave {{JSxRef("Sentencias/throw", "throw")}}. Puedes manejar el error usando la construcción {{JSxRef("Sentencias/try...catch", "try...catch")}}:</p>
-
-<pre class="brush: js; notranslate">try {
-  throw new Error('¡Ups!')
-} catch (e) {
-  console.error(e.name + ': ' + e.message)
-}
-</pre>
-
-<h3 id="Manejar_de_un_error_específico">Manejar de un error específico</h3>
-
-<p>Puede elegir manejar solo tipos de error específicos probando el tipo de error con la propiedad {{JSxRef("Object.prototype.constructor", "constructor")}} del error o, si estás escribiendo para motores JavaScript modernos, la palabra clave {{JSxRef("Operators/instanceof", "instanceof")}}:</p>
-
-<pre class="brush: js; notranslate">try {
-  foo.bar()
-} catch (e) {
-  if (e instanceof EvalError) {
-    console.error(e.name + ': ' + e.message)
-  } else if (e instanceof RangeError) {
-    console.error(e.name + ': ' + e.message)
-  }
-  // ... etc
-}
-</pre>
-
-<h3 id="Tipos_Error_personalizados">Tipos <code>Error</code> personalizados</h3>
-
-<p>Posiblemente desees definir tus propios tipos de error derivados de <code>Error</code> para poder lanzarlo con <code>throw new MyError()</code> y usar <code>instanceof MyError</code> para verificar el tipo de error en el controlador de excepciones.  Esto da como resultado un código de manejo de errores más limpio y consistente. </p>
-
-<p>Consulta <a href="http://stackoverflow.com/questions/1382107/whats-a-good-way-to-extend-error-in-javascript">"¿Cuál es una buena manera de extender <code>Error</code> en JavaScript?"</a> en StackOverflow para una discusión en profundidad.</p>
-
-<h4 id="Clase_Error_personalizado_en_ES6">Clase <code>Error</code> personalizado en ES6</h4>
-
-<div class="blockIndicator warning">
-<p>Las versiones de Babel anteriores a la 7 pueden manejar métodos de clase <code>CustomError</code>, pero solo cuando se declaran con {{JSxRef("Objetos_globales/Object/defineProperty", "Object.defineProperty()")}}. De lo contrario, las versiones antiguas de Babel y otros transpiladores no manejarán correctamente el siguiente código sin <a href="https://github.com/loganfsmyth/babel-plugin-transform-builtin-extend">configuración adicional</a>.</p>
-</div>
-
-<div class="blockIndicator note">
-<p>Algunos navegadores incluyen el constructor <code>CustomError</code> en el seguimiento de la pila cuando se utilizan clases de ES2015.</p>
-</div>
-
-<pre class="brush: js notranslate">class CustomError extends Error {
-  constructor(foo = 'bar', ...params) {
-    // Pasa los argumentos restantes (incluidos los específicos del proveedor) al constructor padre
-    super(...params)
-
-    // Mantiene un seguimiento adecuado de la pila para el lugar donde se lanzó nuestro error (solo disponible en V8)
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, CustomError)
-    }
-
-    this.name = 'CustomError'
-    // Información de depuración personalizada
-    this.foo = foo
-    this.date = new Date()
-  }
-}
-
-try {
-  throw new CustomError('baz', 'bazMessage')
-} catch(e) {
-  console.error(e.name)    // CustomError
-  console.error(e.foo)     // baz
-  console.error(e.message) // bazMessage
-  console.error(e.stack)   // stacktrace
-}</pre>
-
-<h4 id="Objeto_Error_personalizado_ES5">Objeto <code>Error</code> personalizado ES5</h4>
-
-<div class="warning">
-<p><strong>Todos</strong> los navegadores incluyen el constructor <code>CustomError</code> en el seguimiento de la pila cuando se usa una declaración de prototipo.</p>
-</div>
-
-<pre class="brush: js notranslate">function CustomError(foo, message, fileName, lineNumber) {
-  var instance = new Error(message, fileName, lineNumber);
-  instance.name = 'CustomError';
-  instance.foo = foo;
-  Object.setPrototypeOf(instance, Object.getPrototypeOf(this));
-  if (Error.captureStackTrace) {
-    Error.captureStackTrace(instance, CustomError);
-  }
-  return instance;
-}
-
-CustomError.prototype = Object.create(Error.prototype, {
-  constructor: {
-    value: Error,
-    enumerable: false,
-    writable: true,
-    configurable: true
-  }
-});
-
-if (Object.setPrototypeOf){
-  Object.setPrototypeOf(CustomError, Error);
-} else {
-  CustomError.__proto__ = Error;
-}
-
-try {
-  throw new CustomError('baz', 'bazMessage');
-} catch(e){
-  console.error(e.name); // CustomError
-  console.error(e.foo); // baz
-  console.error(e.message); // bazMessage
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-error-objects', 'Error')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Error")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Sentencias/throw", "throw")}}</li>
- <li>{{JSxRef("Sentencias/try...catch", "try...catch")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/linenumber/index.html b/files/es/web/javascript/referencia/objetos_globales/error/linenumber/index.html
deleted file mode 100644
index 0efec0696f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/linenumber/index.html
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: Error.prototype.lineNumber
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/lineNumber
-translation_of: Web/JavaScript/Reference/Global_Objects/Error/lineNumber
----
-<div>No es una norma<br>
-Esta característica no es una norma y no está en la lista de normas. No la utilice en sitios de producción que enfrenta la Web: no va a funcionar para todos los usuarios. También puede haber grandes incompatibilidades entre implementaciones y el comportamiento puede cambiar en el futuro.</div>
-
-<div> </div>
-
-<div>La propiedad <strong>lineNumber </strong>contiene el número de linea en el archivo que arrojó el error.</div>
-
-<div> </div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_lineNumber">Utilizando <code>lineNumber</code></h3>
-
-<pre class="brush: js">var e = new Error('No fue posible analizar el dato introducido');
-throw e;
-console.log(e.lineNumber) // 2
-</pre>
-
-<h3 id="Ejemplo_alternativo_utilizando_el_evento_'error'">Ejemplo alternativo utilizando el evento '<code>error'</code></h3>
-
-<pre class="brush: js">window.addEventListener('error', function(e) {
-  console.log(e.lineno); // 5
-});
-var e = new Error('No fue posible analizar el dato introducido');
-throw e;
-</pre>
-
-<p>Esta es una norma soportada por Chrome, Firefox entre otros.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No forma parte de ninguna especificación. No es una norma.</p>
-
-<h2 id="Navegadores_compatibles">Navegadores compatibles</h2>
-
-<div>
-<p> </p>
-
-<p>Tabla de compatibilidad</p>
-
-<table class="compat-table" style="line-height: 1.5;">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>Compatible [1]</td>
-   <td>Compatible</td>
-   <td>No compatible</td>
-   <td>No compatible</td>
-   <td>No compatible</td>
-  </tr>
- </tbody>
-</table>
-
-<p> [1] Objeto error en errores manejados.</p>
-
-<table class="compat-table" style="line-height: 1.5;">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chorme para Android</th>
-   <th>Firefox Móvil (Gecko)</th>
-   <th>IE Móvil</th>
-   <th>Opera Móvil</th>
-   <th>Safari Móvil</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>No compatible</td>
-   <td>No compatible</td>
-   <td>Compatible</td>
-   <td>No compatible</td>
-   <td>No compatible</td>
-   <td>No compatible</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"> </h2>
-
-<h2 id="Vea_también">Vea también:</h2>
-
-<ul>
- <li>{{jsxref("Error.prototype.stack")}} {{non-standard_inline}}</li>
- <li>{{jsxref("Error.prototype.columnNumber")}} {{non-standard_inline}}</li>
- <li>{{jsxref("Error.prototype.fileName")}} {{non-standard_inline}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/message/index.html b/files/es/web/javascript/referencia/objetos_globales/error/message/index.html
deleted file mode 100644
index 3f14983d6e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/message/index.html
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: Error.prototype.message
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/message
-translation_of: Web/JavaScript/Reference/Global_Objects/Error/message
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>message</strong></code> es una descripción legible del error.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Esta propiedad contiene una breve descripción del error, si está disponible o ha sido fijado. <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a> hace un amplio uso de esta propiedad para las excepciones. Esta porpiedad combinada con la propiedad {{jsxref("Error.prototype.name", "name")}} es usada por el método {{jsxref("Error.prototype.toString()")}} para crear una cadena de texto del objeto Error.</p>
-
-<p>Por defecto, la propiedad <code>message</code> es una cadena vacía, pero se puede especificar un mensaje a través del primer parámetro del {{jsxref("Error", "constructor Error")}}.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Lanzar_un_error_personalizado">Lanzar un error personalizado</h3>
-
-<pre class="brush: js">var e = new Error('No se pudo analizar la entrada');
-// e.message es 'No se pudo analizar la entrada'
-throw e;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.11.4.3', 'Error.prototype.message')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-error.prototype.message', 'Error.prototype.message')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-error.prototype.message', 'Error.prototype.message')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Error.prototype.name")}}</li>
- <li>{{jsxref("Error.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/name/index.html b/files/es/web/javascript/referencia/objetos_globales/error/name/index.html
deleted file mode 100644
index 841cc7cbc4..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/name/index.html
+++ /dev/null
@@ -1,58 +0,0 @@
----
-title: Error.prototype.name
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/name
-tags:
-  - Error
-  - JavaScript
-  - Propiedad
-  - Prototipo
-translation_of: Web/JavaScript/Reference/Global_Objects/Error/name
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>name</strong></code> representa un nombre para el tipo de error. El valor inicial es "Error".</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>De forma predeterminada, las instancias {{JSxRef("Error")}} reciben el nombre "Error". La propiedad <code>name</code>, además de la propiedad {{JSxRef("Error.prototype.message", "message")}}, la utiliza el método {{JSxRef("Error.prototype.toString()")}} para crear una representación de cadena del error.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Lanzar_un_error_personalizado">Lanzar un error personalizado</h3>
-
-<pre class="brush: js notranslate">var e = new Error('Entrada mal formada'); // e.name es 'Error'
-
-e.name = 'ParseError';
-throw e;
-// e.toString() devolverá 'ParseError: Entrada mal formada'
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-error.prototype.name', 'Error.prototype.name')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Error.name")}}</p>
-</div>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Error.prototype.message")}}</li>
- <li>{{JSxRef("Error.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/error/prototype/index.html
deleted file mode 100644
index aac1516fc2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/prototype/index.html
+++ /dev/null
@@ -1,154 +0,0 @@
----
-title: Error.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Error
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Error/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>Error.prototype</strong></code> representa el prototipo del constructor {{jsxref("Error")}}.</p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Todas las instancias de {{jsxref("Error")}} e instancias de {{jsxref("Global_Objects/Error", "errores no genéricos", "#Error_types", 1)}}, heredan de <code>Error.prototype</code>. Como todas las funciones constructoras, se puede usar el protoipo del constructor para añadir propiedades o métodos a todas las instancias creadas con este constructor.</p>
-
-<h2 id="Properties">Properties</h2>
-
-<h3 id="Propiedades_estándar">Propiedades estándar</h3>
-
-<dl>
- <dt><code>Error.prototype.constructor</code></dt>
- <dd>Especifica la función que crea una instancia del prototipo.</dd>
- <dt>{{jsxref("Error.prototype.message")}}</dt>
- <dd>Mensaje de error.</dd>
- <dt>{{jsxref("Error.prototype.name")}}</dt>
- <dd>Nombre del error.</dd>
-</dl>
-
-<h3 id="Extensiones_específicas_del_proveedor">Extensiones específicas del proveedor</h3>
-
-<div>{{non-standard_header}}</div>
-
-<h4 id="Microsoft">Microsoft</h4>
-
-<dl>
- <dt>{{jsxref("Error.prototype.description")}}</dt>
- <dd>Descripción del error. Similar a {{jsxref("Error.prototype.message", "message")}}.</dd>
- <dt>{{jsxref("Error.prototype.number")}}</dt>
- <dd>Número de error.</dd>
-</dl>
-
-<h4 id="Mozilla">Mozilla</h4>
-
-<dl>
- <dt>{{jsxref("Error.prototype.fileName")}}</dt>
- <dd>Ruta del archivo que lanzó el error.</dd>
- <dt>{{jsxref("Error.prototype.lineNumber")}}</dt>
- <dd>Número de fila en el archivo que lanzó el error.</dd>
- <dt>{{jsxref("Error.prototype.columnNumber")}}</dt>
- <dd>Número de columna en el archivo que lanzó el error.</dd>
- <dt>{{jsxref("Error.prototype.stack")}}</dt>
- <dd>Seguimiento de la pila.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Error.prototype.toSource()")}} {{non-standard_inline}}</dt>
- <dd>Devuelve una cadena que contiene el codígo del objeto {{jsxref("Error")}}; se puede usar este valor para crear un nuevo objeto. Sobreescribe el método {{jsxref("Object.prototype.toSource()")}}.</dd>
- <dt>{{jsxref("Error.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el objeto. Sobreescribe el método {{jsxref("Object.prototype.toString()")}}.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.11.3.1', 'Error')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-error.prototype', 'Error')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-error.prototype', 'Error')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Error")}}</li>
- <li>{{jsxref("Object.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/tosource/index.html b/files/es/web/javascript/referencia/objetos_globales/error/tosource/index.html
deleted file mode 100644
index fb1b429884..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/tosource/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: Error.prototype.toSource()
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/toSource
-tags:
-  - JavaScript
-  - No estandar
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Error/toSource
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>El método <code><strong>toSource()</strong></code> devuelve código que podría evaluar el mismo error.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>e</var>.toSource()</pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una cadena que contiene el código fuente del error.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usar_toSource">Usar toSource</h3>
-
-<p>Llamar al método <code>toSource</code> de una instancia {{JSxRef("Error")}} (incluido {{JSxRef("Global_Objects/Error", "NativeErrors", "#Error_types")}}) devolverá una cadena que contiene el código fuente del error. Esta cadena se puede evaluar para crear un objeto (aproximadamente) igual. Naturalmente, la cadena que contiene la fuente sigue la estructura del constructor {{JSxRef("Error")}}. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">(new<em>name</em>(<em>message</em> ,<em>fileName</em>,<em>lineNumber</em>))
-</pre>
-
-<p>donde estos atributos corresponden a las propiedades respectivas de la instancia de <code>error</code>.</p>
-
-<div class="note">
-<p><strong>Nota</strong>: Ten en cuenta que las propiedades utilizadas por el método <code>toSource</code> en la creación de esta cadena son mutables y es posible que no reflejen con precisión la función utilizada para crear una instancia de <code>error</code> o el nombre de archivo o número de línea donde ocurrió un error real.</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No forma parte de ningún estándar.</p>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Error.toSource")}}</p>
-</div>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Error.prototype.fileName")}}</li>
- <li>{{JSxRef("Error.prototype.lineNumber")}}</li>
- <li>{{JSxRef("Error.prototype.message")}}</li>
- <li>{{JSxRef("Error.prototype.name")}}</li>
- <li>{{jsxref("Object.prototype.toSource()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/error/tostring/index.html b/files/es/web/javascript/referencia/objetos_globales/error/tostring/index.html
deleted file mode 100644
index f4ea4a44b9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/error/tostring/index.html
+++ /dev/null
@@ -1,98 +0,0 @@
----
-title: Error.prototype.toString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Error/toString
-tags:
-  - JavaScript
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Error/toString
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>toString()</strong></code> devuelve una cadena que representa el objeto {{JSxRef("Error")}} especificado.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>e</var>.toString()</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una cadena que representa el objeto {{JSxRef("Error")}} especificado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El objeto {{JSxRef("Error")}} redefine el método {{JSxRef("Object.prototype.toString()")}} heredado por todos los objetos. Su semántica es la siguiente (asumiendo que {{JSxRef("Object")}} y {{JSxRef("String")}} tienen sus valores originales):</p>
-
-<pre class="brush: js notranslate">Error.prototype.toString = function() {
-  'use strict';
-
-  var obj = Object(this);
-  if (obj !== this) {
-    throw new TypeError();
-  }
-
-  var name = this.name;
-  name = (name === undefined) ? 'Error' : String(name);
-
-  var msg = this.message;
-  msg = (msg === undefined) ? '' : String(msg);
-
-  if (name === '') {
-    return msg;
-  }
-  if (msg === '') {
-    return name;
-  }
-
-  return name + ': ' + msg;
-};
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usar_toString">Usar <code>toString()</code></h3>
-
-<pre class="brush: js notranslate">var e = new Error('fatal error');
-console.log(e.toString()); // 'Error: error fatal'
-
-e.name = undefined;
-console.log(e.toString()); // 'Error: error fatal'
-
-e.name = '';
-console.log(e.toString()); // 'error fatal'
-
-e.message = undefined;
-console.log(e.toString()); // ''
-
-e.name = 'hola';
-console.log(e.toString()); // 'hola'
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-error.prototype.tostring', 'Error.prototype.toString')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Error.toString")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Error.prototype.toSource()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/escape/index.html b/files/es/web/javascript/referencia/objetos_globales/escape/index.html
deleted file mode 100644
index 4925618b0e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/escape/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: escape()
-slug: Web/JavaScript/Referencia/Objetos_globales/escape
-tags:
-  - JavaScript
-  - Obsoleto
-  - escape
-translation_of: Web/JavaScript/Reference/Global_Objects/escape
----
-<div class="warning">{{Deprecated_header}} Advertencia <code>escape()</code> no esta estrictamente en desuso("eliminada por los estándares Web"), esta definida en  <a href="https://www.ecma-international.org/ecma-262/9.0/index.html#sec-additional-ecmascript-features-for-web-browsers">Anexo B</a> El estándar ECMA-262 , cuya introducción establece:
-<blockquote>… Todos las características especificas y comportamientos del lenguaje en este anexo tienen mas de una caracterísitca indeseable y en ausencia del legado sera eliminada de esta especificación. …<br>
-… Los programadores no deben usar o suponer la existencia de estas características y/o comportamientos al escribir nuevo código ECMAScript …</blockquote>
-</div>
-
-<div></div>
-
-<p><span class="seoSummary">La función obsoleta <code><strong>escape()</strong></code> crea una nueva cadena de caracteres en los que ciertos caracteres han sido sustituidos por una secuencia hexadecimal de escape.</span></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">escape(str)</pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>str</code></dt>
- <dd>Cadena a codificar.</dd>
-</dl>
-
-<h3 id="Devuelve">Devuelve</h3>
-
-<p>Una nueva cadena en la que ciertos caracteres han sido sustituidos.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La función <code>escape </code>es una propiedad del <em>objeto global. </em>SLos caracteres especiales son codificados a excepción de: @*_+-./</p>
-
-<p>La forma hexadecimal de los caracteres cuyo valor es 0xFF o menor, es una secuencia de escape de dos digitos: %xx. Para caracteres un valor superior, se usa el fomato de cuatro digitos: %<strong>u</strong>xxxx.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">escape('abc123');     // "abc123"
-escape('äöü');        // "%E4%F6%FC"
-escape('ć');          // "%u0107"
-
-// caracteres especiales
-escape('@*_+-./');    // "@*_+-./"</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-B.2.1', 'escape')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Defined in the (informative) Compatibility Annex B</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-escape-string', 'escape')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-escape-string', 'escape')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.escape")}}</p>
-
-<h2 id="Ver_más">Ver más</h2>
-
-<ul>
- <li>{{jsxref("encodeURI")}}</li>
- <li>{{jsxref("encodeURIComponent")}}</li>
- <li>{{jsxref("unescape")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/eval/index.html b/files/es/web/javascript/referencia/objetos_globales/eval/index.html
deleted file mode 100644
index 52375445c4..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/eval/index.html
+++ /dev/null
@@ -1,309 +0,0 @@
----
-title: eval
-slug: Web/JavaScript/Referencia/Objetos_globales/eval
-tags:
-  - JavaScript
-  - eval
-translation_of: Web/JavaScript/Reference/Global_Objects/eval
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>La función <code>eval()</code> evalúa un código JavaScript representado como una cadena de caracteres (string), sin referenciar a un objeto en particular.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: js"><code>eval(<em>cadena</em> de caracteres o string)</code>
-</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>cadena de caracteres (string)</code></dt>
- <dd>Una cadena de caracteres (string) que representa una expresión, sentencia o secuencia de sentencias en JavaScript. La expresión puede incluir variables y propiedades de objetos existentes.</dd>
- <dt>
- <h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Valores retornados o devueltos</h3>
- </dt>
-</dl>
-
-<p>El valor que resulta de la evaluación del código proporcionado. Si este valor está vacío. {{jsxref("undefined")}} (artículo en inglés) es devuelto.</p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>eval()</code> es una propiedad de la función del objeto global.</p>
-
-<p>El argumento de la función <code>eval</code> es una cadena de caracteres. Si la cadena de caracteres representa una expresión, <code>eval()</code> evalúa la expresión. Si el argumento representa una o más sentencias JavaScript, <code>eval()</code> evalúa las sentencias. No se debe llamar a <code>eval()</code> para evaluar una expresión aritmética; ya que JavaScript evalúa las expresiones aritméticas automáticamente.</p>
-
-<p>Si construye una expresión aritmética como una cadena de caracteres, puede usar <code>eval()</code> para evaluarla más tarde. Por ejemplo, suponga que tiene la variable <code>x</code>. Puede posponer la evaluación de una expresión que involucre a <code>x</code> mediante la asignación del valor de la cadena de caracteres de la expresión, asignando "<code>3 * x + 2</code>" a la variable, y entonces llamar a <code>eval()</code> posteriormente en el script.</p>
-
-<p>Si el argumento de <code>eval()</code> no es una cadena de caracteres, <code>eval()</code> devuelve el argumento sin cambio. En el siguiente ejemplo, el constructor <code>String</code> es especificado, y <code>eval()</code> devuelve un objeto <code>String</code> en lugar de evaluar la cadena de caracteres.</p>
-
-<pre>eval(new String("2 + 2")); // devuelve un objeto String que contiene "2 + 2"
-eval("2 + 2");             // devuelve 4
-</pre>
-
-<p>Puede trabajar sobre esta limitación de una manera genérica utilizando <code>toString()</code>.</p>
-
-<pre>var expresion = new String("2 + 2");
-eval(expresion.toString());
-</pre>
-
-<p>Si utiliza la función <code>eval()</code> <em>indirectamente</em>, invocándola a través de una referencia distinta de <code>eval</code>, a partir de ECMAScript 5, ésta funciona en el ámbito global en lugar de hacerlo en el ámbito local; esto quiere decir, por ejemplo, que las declaraciones de función crean funciones globales, y que el código siendo evaluado no tiene acceso a las variables locales dentro del ámbito en donde está siendo llamada.</p>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">test</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">,</span> y <span class="operator token">=</span> <span class="number token">4</span><span class="punctuation token">;</span>
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="function token">eval</span><span class="punctuation token">(</span><span class="string token">"x + y"</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// Llamada directa, utiliza el ámbito local, el resultado es 6</span>
-  <span class="keyword token">var</span> geval <span class="operator token">=</span> eval<span class="punctuation token">;</span>
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="function token">geval</span><span class="punctuation token">(</span><span class="string token">"x + y"</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Llamada indirecta, utiliza el ámbito global, através de ReferenceError por que `x` es indefinida</span>
-<span class="punctuation token">}</span></code></pre>
-
-<h2 id="No_utilice_eval_innecesariamente">No utilice <code>eval</code> innecesariamente</h2>
-
-<p><code>eval()</code> es una función peligrosa, quel ejecuta el código el cual es pasado con los privilegios de quien llama.  Si ejecuta <code>eval()</code> con una cadena de carcteres que podría ser afectada por un elemento malicioso, podría terminar ejecutando código malicioso dentro de la computadora del usuario con los permisos de su página o extensión web . Más importante aún, una parte del código de terceros podría accesar al ámbito en el cual <code>eval()</code> fue invocada, lo que puede permitir la entrada a posibles ataques de formas a las que el constructor {{jsxref("Global_Objects/Function", "Function")}} (art. en inglés) el cual es similar, no es susceptible.</p>
-
-<p><code>eval()</code> es generalmente también más lenta que otras alternativas desde que se invoca en el intérprte de JS, mientras que otros muchos constructores son optimizados por los motores JS modernos.</p>
-
-<p>Existen alternativas más seguras (y rápidas) que <code>eval() </code>para casos de uso común.</p>
-
-<h3 id="Accediendo_a_propiedades_de_los_miembros">Accediendo a propiedades de los miembros</h3>
-
-<p>No debería utilizar <code>eval()</code> con el fin de convertir nombres de propiedades en propiedades. Observe el siguiente ejemplo en el cual la función <code>getNombreCampo(n)</code> devuelve el nombre del elemento del formulario especificado como una cadena. La primera sentencia asigna el valor de cadena del tercer elemento del formulario a la variable <code>campo</code>. La segunda sentencia utiliza <code>eval</code> para mostrar el valor del elemento del formulario.</p>
-
-<pre>var campo = getNombreCampo(3);
-document.write("El campo llamado ", campo, " tiene un valor de ", eval(campo + ".value"));
-</pre>
-
-<p>Sin embargo, <code>eval()</code> no es necesario en este código. De hecho, su uso aquí no se recomienda. En su lugar, utilice los <a href="/es/Web/JavaScript/Referencia/Operadores/Miembros">operadores de miembro</a> (art. en inglés), que son mucho más rápidos y seguros:</p>
-
-<pre class="brush: js">var campo = getFieldName(3);
-document.write("El campo llamado ", campo, " tiene un valor de ", campo[valor]);
-</pre>
-
-<p>Considere ahora este nuevo ejemplo, en donde la propiedad del objeto a ser accesado no es conocida hasta que el código es ejecutado. Esto puede hacerse con eval:</p>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span> a<span class="punctuation token">:</span> <span class="number token">20</span><span class="punctuation token">,</span> b<span class="punctuation token">:</span> <span class="number token">30</span> <span class="punctuation token">}</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> nombreProp <span class="operator token">=</span> obtenerNombreProp<span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// devuelve "a" o "b"</span>
-
-<span class="function token">eval</span><span class="punctuation token">(</span> <span class="string token">"var resultado = obj."</span> <span class="operator token">+</span> nombreProp <span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Y con el uso de los <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors" title="JavaScript/Reference/Operators/Member_Operators">accesores de propiedades</a> (artículo en inglés), el cual es mucho más rápido y seguro, sería así:</p>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span> a<span class="punctuation token">:</span> <span class="number token">20</span><span class="punctuation token">,</span> b<span class="punctuation token">:</span> <span class="number token">30</span> <span class="punctuation token">}</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> nombreProp <span class="operator token">=</span> obtenerNombreProp<span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// devuelve "a" o "b"</span>
-<span class="keyword token">var</span> resultado <span class="operator token">=</span> obj<span class="punctuation token">[</span> nombreProp <span class="punctuation token">]</span><span class="punctuation token">;</span>  <span class="comment token">//  obj[ "a" ] es el mismo que obj.a</span></code></pre>
-
-<p>Puede incluso utilizar este método para acceder a las propiedades de los descendientes. Utilizando <code>eval()</code> esto sería de la siguiente forma:</p>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span>a<span class="punctuation token">:</span> <span class="punctuation token">{</span>b<span class="punctuation token">:</span> <span class="punctuation token">{</span>c<span class="punctuation token">:</span> <span class="number token">0</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> propPath <span class="operator token">=</span> <span class="function token">getPropPath</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// returns e.g. "a.b.c"</span>
-
-<span class="function token">eval</span><span class="punctuation token">(</span> <span class="string token">"var result = obj."</span> <span class="operator token">+</span> propPath <span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Evitando <code>eval()</code>, esto podría hacerse dividiendo la ruta de propiedad y haciendo un bucle a través de las diferentes propiedades:</p>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">getDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> desc<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">var</span> arr <span class="operator token">=</span> desc<span class="punctuation token">.</span><span class="function token">split</span><span class="punctuation token">(</span><span class="string token">"."</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="keyword token">while</span><span class="punctuation token">(</span>arr<span class="punctuation token">.</span>length<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    obj <span class="operator token">=</span> obj<span class="punctuation token">[</span>arr<span class="punctuation token">.</span><span class="function token">shift</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">return</span> obj<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span>a<span class="punctuation token">:</span> <span class="punctuation token">{</span>b<span class="punctuation token">:</span> <span class="punctuation token">{</span>c<span class="punctuation token">:</span> <span class="number token">0</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> propPath <span class="operator token">=</span> <span class="function token">getPropPath</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// returns e.g. "a.b.c"</span>
-<span class="keyword token">var</span> result <span class="operator token">=</span> <span class="function token">getDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> propPath<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Estableciendo una propiedad que funcione de modo similar:</p>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">setDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> desc<span class="punctuation token">,</span> value<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">var</span> arr <span class="operator token">=</span> desc<span class="punctuation token">.</span><span class="function token">split</span><span class="punctuation token">(</span><span class="string token">"."</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="keyword token">while</span><span class="punctuation token">(</span>arr<span class="punctuation token">.</span>length <span class="operator token">&gt;</span> <span class="number token">1</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    obj <span class="operator token">=</span> obj<span class="punctuation token">[</span>arr<span class="punctuation token">.</span><span class="function token">shift</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">]</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  obj<span class="punctuation token">[</span>arr<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">]</span> <span class="operator token">=</span> value<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="keyword token">var</span> obj <span class="operator token">=</span> <span class="punctuation token">{</span>a<span class="punctuation token">:</span> <span class="punctuation token">{</span>b<span class="punctuation token">:</span> <span class="punctuation token">{</span>c<span class="punctuation token">:</span> <span class="number token">0</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> propPath <span class="operator token">=</span> <span class="function token">getPropPath</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// returns e.g. "a.b.c"</span>
-<span class="keyword token">var</span> result <span class="operator token">=</span> <span class="function token">setDescendantProp</span><span class="punctuation token">(</span>obj<span class="punctuation token">,</span> propPath<span class="punctuation token">,</span> <span class="number token">1</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// test.a.b.c will now be 1</span></code></pre>
-
-<h3 id="Utilice_funciones_en_lugar_de_evaluar_fragmentos_de_código">Utilice funciones en lugar de evaluar fragmentos de código</h3>
-
-<p>JavaScript tiene <a class="external external-icon" href="http://en.wikipedia.org/wiki/First-class_function" title="http://en.wikipedia.org/wiki/First-class_function">funciones de primera clase </a>(artículo en inglés), lo que quiere decir que usted puede pasar funciones como argumentos a otras APIs, almacenarlas en variables y propiedades de objetos, etc. Muchas APIs de DOM están diseñadas con esto en mente, o sea que usted puede (y debería) escribir:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="comment token">// instead of setTimeout(" ... ", 1000) use:</span>
-<span class="function token">setTimeout</span><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="punctuation token">.</span><span class="punctuation token">.</span><span class="punctuation token">.</span> <span class="punctuation token">}</span><span class="punctuation token">,</span> <span class="number token">1000</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-<span class="comment token">// instead of elt.setAttribute("onclick", "...") use:</span>
-elt<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">"click"</span><span class="punctuation token">,</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="punctuation token">.</span><span class="punctuation token">.</span><span class="punctuation token">.</span> <span class="punctuation token">}</span> <span class="punctuation token">,</span> <span class="keyword token">false</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>Las <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures" title="JavaScript/Guide/Closures">clausuras o cierres </a>(art. en inglés) son muy útiles como forma de crear funciones parametrizadas sin la concatenación de cadenas de caracteres o strings.</p>
-
-<h3 id="Analizando_JSON_(convirtiendo_cadenas_de_caracteres_(strings)_hacia_objetos_de_JavaScript)">Analizando JSON (convirtiendo cadenas de caracteres (strings) hacia objetos de JavaScript)</h3>
-
-<p>Si la cadena de caracteres que usted esta llamando <code>eval()</code> contiene datos (por ejemplo, un array: <code>"[1, 2, 3]"</code>), en contraposición al código, debería considerar un cambio a <a href="https://developer.mozilla.org/en-US/docs/Glossary/JSON" title="JSON">JSON</a> (art. en inglés), el cual permite a la cadena de caracteres utilizar un subconjunto de sintaxis de JavaScript para representar los datos. Vea también <a href="https://developer.mozilla.org/en-US/docs/Downloading_JSON_and_JavaScript_in_extensions" title="Downloading_JSON_and_JavaScript_in_extensions">Descargando JSON y JavaScript en extensiones</a> (art. en inglés).</p>
-
-<p>Observe, que ya que la sintaxis de JSON es limitada en comparación con la sintaxis de JavaScript, muchas literales válidas de JavaScript no serán analizadas como JSON. Por ejemplo, seguir comas no está permitido en JSON, y los nombres de propiedades (keys) en literales de objeto deben ser entrecomilladas. Asegúrese de utilizar un serializados de JSON para generar cadenas de caracteres que posteriormente sean analizadas como JSON.</p>
-
-<h3 id="Pasar_datos_en_lugar_de_código">Pasar datos en lugar de código</h3>
-
-<p>Por ejemplo, una extensión diseñada para arrastar contenido de páginas web podría tener reglas de arrastre definidas en <a href="https://developer.mozilla.org/en-US/docs/XPath" title="XPath">XPath</a> (art. en inglés) en lugar de código JavaScript.</p>
-
-<h3 id="Ejecutar_código_sin_privilegos_limitados">Ejecutar código sin privilegos limitados</h3>
-
-<p>Si usted debe ejecutar código, considere ejecutarlo con privilegios reducidos. Este consejo aplica principalmente para las extensiones y las aplicaciones XUL, para lo cual puede utilizar <a href="https://developer.mozilla.org/en-US/docs/Components.utils.evalInSandbox" title="Components.utils.evalInSandbox">Components.utils.evalInSandbox</a> (art. en inglés).</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<p>Los siguientes ejemplos muestran el resultado usando <code>document.write</code>. En JavaScript del lado servidor, puede mostrar el mismo resultado llamando a la función <code>write</code> en vez de <code>document.write</code>.</p>
-
-<h3 id="Utlizando_eval">Utlizando <code>eval</code></h3>
-
-<p>En el siguiente código, las dos sentencias que contienen <code>eval</code> devuelven 42. La primera evalúa la cadena "<code>x + y + 1</code>"; la segunda evalúa la cadena "<code>42</code>".</p>
-
-<pre>var x = 2;
-var y = 39;
-var z = "42";
-eval("x + y + 1"); // returns 42
-eval(z);           // returns 42
-</pre>
-
-<h3 id="Utilizando_eval_para_evaluar_una_cadena_de_caracteres_(string)_como_sentencias_de_JavaScript">Utilizando <code>eval</code> para evaluar una cadena de caracteres (string) como sentencias de JavaScript</h3>
-
-<p>El siguiente ejemplo utiliza <code>eval</code> para evaluar una cadena de caracteres <code>str</code>. Esta cadena consiste de sentencias de JavaScript que abren un diálogo <code>Alert</code> y asignan a <code>z</code> un valor de 42 si <code>x</code> es cinco, y asigna 0 a <code>z</code> en caso contrario. Cuando se ejecuta la segunda sentencia, <code>eval</code> ocasionará que estas sentencias sean ejecutadas, y también evaluará el conjunto de sentencias y devolverá que el valor es asignado a <code>z</code>.</p>
-
-<pre class="brush: js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">5</span><span class="punctuation token">;</span></code>
-var str = "if (x == 5) {alert('z is 42'); z = 42;} else z = 0; ";
-
-document.write("&lt;P&gt;z es ", eval(str));
-</pre>
-
-<h3 id="La_última_espresión_es_evaluada">La última espresión es evaluada</h3>
-
-<p><code>eval()</code> devuelve el valor de la última expresión evaluada</p>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> str <span class="operator token">=</span> <span class="string token">"if ( a ) { 1+1; } else { 1+2; }"</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> a <span class="operator token">=</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> b <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>str<span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// devuelve 2</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">"b is : "</span> <span class="operator token">+</span> b<span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-a <span class="operator token">=</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
-b <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>str<span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// devuelve 3</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">"b is : "</span> <span class="operator token">+</span> b<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<h3 id="eval_como_una_cadena_de_caracteres_(string)_definiendo_funciones_requiere_(_y_)_como_prefijo_y_sufijo"><code>eval</code> como una cadena de caracteres (string) definiendo funciones requiere "(" y ")" como prefijo y sufijo</h3>
-
-<pre class="brush:js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> fctStr1 <span class="operator token">=</span> <span class="string token">"function a() {}"</span>
-<span class="keyword token">var</span> fctStr2 <span class="operator token">=</span> <span class="string token">"(function a() {})"</span>
-<span class="keyword token">var</span> fct1 <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>fctStr1<span class="punctuation token">)</span>  <span class="comment token">// devuelve undefined</span>
-<span class="keyword token">var</span> fct2 <span class="operator token">=</span> <span class="function token">eval</span><span class="punctuation token">(</span>fctStr2<span class="punctuation token">)</span>  <span class="comment token">// deuelve una función</span></code></pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.1.2.1', 'eval')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-eval-x', 'eval')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-eval-x', 'eval')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Carác.</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Observaciones_específicas_para_Gecko">Observaciones específicas para Gecko</h2>
-
-<ul>
- <li>Históricamente <code>eval()</code> tenía un segundo argumento opcional, especificando un objeto en cuyo contexto la evaluación era ejecutada. Este argunmento no era estándar, y fue removido del <em>SpiderMonkey en</em> Gecko 1.9.1 (Firefox 3.5). Vea {{bug(442333)}}.</li>
-</ul>
-
-<h2 id="Compatibilidad_Hacia_Atr.C3.A1s" name="Compatibilidad_Hacia_Atr.C3.A1s">Compatibilidad Hacia Atrás</h2>
-
-<h3 id="JavaScript_1.3_y_anteriores" name="JavaScript_1.3_y_anteriores">JavaScript 1.3 y anteriores</h3>
-
-<p>Puede usar <code>eval</code> indirectamente, aunque ésto está desaconsejado.</p>
-
-<h3 id="JavaScript_1.1" name="JavaScript_1.1">JavaScript 1.1</h3>
-
-<p><code>eval</code> también es un método de todos los objetos.</p>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Objetos_globales/uneval", "uneval()")}}</li>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Operadores/Miembros">Miembros de operadores</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/evalerror/index.html b/files/es/web/javascript/referencia/objetos_globales/evalerror/index.html
deleted file mode 100644
index 13fbe371e4..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/evalerror/index.html
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: EvalError
-slug: Web/JavaScript/Referencia/Objetos_globales/EvalError
-tags:
-  - Error
-translation_of: Web/JavaScript/Reference/Global_Objects/EvalError
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong>EvalError </strong>indica un error con respecto a la función global {{jsxref("Global_Objects/eval", "eval()")}}. Esta excepción ya no es lanzada por JavaScript, sin embargo, el objeto EvalError se mantiene por motivos de compatibilidad.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>new EvalError([<var>mensaje</var>[, <var>nombreArchivo</var>[, <var>lineaNumero</var>]]])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>mensaje</code></dt>
- <dd>Opcional. Descripción del error en formato legible.</dd>
- <dt><font face="Consolas, Liberation Mono, Courier, monospace">nombreArchivo</font>{{non-standard_inline}}</dt>
- <dd>
- <p dir="ltr" id="tw-target-text">Opcional. El nombre del archivo que contiene el código que causó la excepción.</p>
- </dd>
- <dt><font face="Consolas, Liberation Mono, Courier, monospace">lineaNumero</font>{{non-standard_inline}}</dt>
- <dd>
- <p dir="ltr" id="tw-target-text">Opcional. El número de línea del código que causó la excepción.</p>
- </dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("EvalError.prototype")}}</dt>
- <dd>
- <p dir="ltr" id="tw-target-text">Permite la adición de propiedades a un objeto <strong>EvalError</strong>.</p>
- </dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<p dir="ltr" id="tw-target-text">El objeto global <strong>EvalError</strong> no contiene ningún método propio, sin embargo, hereda algunos métodos a través de la cadena de prototipos.</p>
-
-<h2 id="Instancias_de_EvalError">Instancias de <code>EvalError</code></h2>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/prototype', 'Properties')}}</div>
-
-<h3 id="Métodos_2">Métodos</h3>
-
-<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/Error/prototype', 'Métodos')}}</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p><code><strong>EvalError </strong></code>no se usa en la especificación actual de ECMAScript y, por ende, no será lanzado en tiempo de ejecución. Sin embargo, el mismo permanece para compatibilidad con versiones anteriores de la especificación.</p>
-
-<h3 id="Creando_un_EvalError">Creando un <code>EvalError</code></h3>
-
-<pre class="brush: js notranslate">try {
-  throw new EvalError('Hello', 'someFile.js', 10);
-} catch (e) {
-  console.log(e instanceof EvalError); // true
-  console.log(e.message);              // "Hello"
-  console.log(e.name);                 // "EvalError"
-  console.log(e.fileName);             // "someFile.js"
-  console.log(e.lineNumber);           // 10
-  console.log(e.columnNumber);         // 0
-  console.log(e.stack);                // "@Scratchpad/2:2:9\n"
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.11.6.1', 'EvalError')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>No usado en esta especificación. Presente por compatibilidad con versiones anteriores.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>No usado en esta especificación. Presente por compatibilidad con versiones anteriores.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-evalerror', 'EvalError')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Error")}}</li>
- <li>{{jsxref("EvalError.prototype")}}</li>
- <li>{{jsxref("Global_Objects/eval", "eval()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/funcionesasíncronas/index.html b/files/es/web/javascript/referencia/objetos_globales/funcionesasíncronas/index.html
deleted file mode 100644
index bdb37b012c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/funcionesasíncronas/index.html
+++ /dev/null
@@ -1,122 +0,0 @@
----
-title: Funciones asíncronas
-slug: Web/JavaScript/Referencia/Objetos_globales/Funcionesasíncronas
-translation_of: Web/JavaScript/Reference/Global_Objects/AsyncFunction
----
-<div>{{JSRef}}</div>
-
-<div>El constructor de las funciones asíncronas crea un nuevo objecto {{jsxref("Statements/async_function", "async function")}}. En JavaScript cada función asíncrona es un objeto AsyncFunction.</div>
-
-<div></div>
-
-<div>Nota: AsyncFunction no es un objeto global. Este puede ser obtenido como resultado del siguiente código.</div>
-
-<div></div>
-
-<pre class="brush: js notranslate">Object.getPrototypeOf(async function(){}).constructor
-</pre>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox notranslate">new AsyncFunction([<var>arg1</var>[, <var>arg2</var>[, ...<var>argN</var>]],] <var>functionBody</var>)</pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>arg1, arg2, ... arg<em>N</em></code></dt>
- <dd>Nombres a ser usados por la función como los nombres de los argumentos. Cada uno debe ser una cadena que corresponda a un identificador válido en JavaScript o una lista de cadenas separadas por coma, ejemplo: "<code>x</code>", "<code>theValue</code>", or "<code>a,b</code>".</dd>
- <dt><code>functionBody</code></dt>
- <dd>Una cadena que contiene las declaraciones de JavaScript que comprenden la definición de la función.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>{{jsxref("Statements/async_function", "async function")}} los objetos creados con el constructor <code>AsyncFunction</code> son analizados gramaticalmente en el momento que la función es creada. Esto es menos eficiente que declarar una función asincrona con un {{jsxref("Statements/async_function", "async function expression")}} y llamarla con eso en tu código , ya que las funciones están analizadas gramaticalmento junto al resto del código.</p>
-
-<p>Todos los argumentos que son pasados por la función son tratados por los nombres de los identificadores con los que fueron creados, en el orden en que son pasados por la función.</p>
-
-<div class="note">
-<p><strong>Note:</strong> {{jsxref("Statements/async_function", "async functions")}} created with the <code>AsyncFunction</code> constructor do not create closures to their creation contexts; they are always created in the global scope. When running them, they will only be able to access their own local variables and global ones, not the ones from the scope in which the <code>AsyncFunction</code> constructor was called. This is different from using {{jsxref("Global_Objects/eval", "eval")}} with code for an async function expression.</p>
-</div>
-
-<p>Invoking the <code>AsyncFunction</code> constructor as a function (without using the <code>new</code> operator) has the same effect as invoking it as a constructor.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code><strong>AsyncFunction.length</strong></code></dt>
- <dd>The <code>AsyncFunction</code> constructor's length property whose value is 1.</dd>
- <dt>{{jsxref("AsyncFunction.prototype")}}</dt>
- <dd>Allows the addition of properties to all async function objects.</dd>
-</dl>
-
-<h2 id="El_objeto_prototipo_AsyncFunction">El objeto prototipo <code> AsyncFunction</code> </h2>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/AsyncFunction/prototype', 'Properties')}}</div>
-
-<h2 id="AsyncFunction_y_sus_instancias"><code>AsyncFunction</code> y sus instancias</h2>
-
-<p>Una instancia de <code>AsyncFunction</code>  hereda métodos y propiedades de {{jsxref("AsyncFunction.prototype")}}. Como son todos los constructores, puedes cambiar el constructor del objeto prototipo para aplicar cambios a todas las instancias de <code>AsyncFunction</code> .</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Creating_an_async_function_from_an_AsyncFunction_constructor">Creating an async function from an <code>AsyncFunction</code> constructor</h3>
-
-<pre class="brush: js notranslate">function resolveAfter2Seconds(x) {
-  return new Promise(resolve =&gt; {
-    setTimeout(() =&gt; {
-      resolve(x);
-    }, 2000);
-  });
-}
-
-var AsyncFunction = Object.getPrototypeOf(async function(){}).constructor
-
-var a = new AsyncFunction('a',
-                          'b',
-                          'return await resolveAfter2Seconds(a) + await resolveAfter2Seconds(b);');
-
-a(10, 20).then(v =&gt; {
-  console.log(v); // prints 30 after 4 seconds
-});
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-async-function-objects', 'AsyncFunction object')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Initial definition in ES2017.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.AsyncFunction")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Statements/async_function", "async function function")}}</li>
- <li>{{jsxref("Operators/async_function", "async function expression")}}</li>
- <li>{{jsxref("Global_Objects/Function", "Function")}}</li>
- <li>{{jsxref("Statements/function", "function statement")}}</li>
- <li>{{jsxref("Operators/function", "function expression")}}</li>
- <li>{{jsxref("Functions_and_function_scope", "Functions and function scope", "", 1)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/apply/index.html b/files/es/web/javascript/referencia/objetos_globales/function/apply/index.html
deleted file mode 100644
index 07f47b42f2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/apply/index.html
+++ /dev/null
@@ -1,233 +0,0 @@
----
-title: Function.prototype.apply()
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/apply
-tags:
-  - Function
-  - JavaScript
-  - Method
-  - función
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/apply
----
-<div>{{JSRef("Objetos_globales", "Function")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <strong>apply()</strong> invoca una determinada función asignando explícitamente el objeto <strong>this</strong> y un array o similar (<a href="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects" title="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects">array like object</a>) como parámetros (<strong>argumentos)</strong> para dicha función.</p>
-
-<div class="note"><strong>NOTA:</strong> Aunque la sintaxis de esta función es casi idéntica a {{jsxref("Function.call", "call()")}}, la diferencia fundamental es que <code>call()</code> acepta una lista de argumentos, mientras que <code>apply()</code> acepta un simple array con los argumentos.</div>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>fun</em>.apply(<em>thisArg</em>[, <em>argsArray</em>])</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>thisArg</code></dt>
- <dd>El valor del objeto <strong>this</strong> a utilizar dentro de la llamada a <em>fun</em>. Cabe mencionar que éste puede no ser el valor visto por el método: si el método es una función del tipo {{jsxref("Functions_and_function_scope/Strict_mode", "non-strict mode", "", 1)}}, {{jsxref("Global_Objects/null", "null")}} o {{jsxref("Global_Objects/undefined", "undefined")}} será reemplazado por el objeto global, y los valores primitivos serán encapsulados.</dd>
- <dt><code>argsArray</code></dt>
- <dd>Un objeto similar a un array (<a href="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects" title="/en-US/docs/JavaScript/Guide/Predefined_Core_Objects#Working_with_Array-like_objects">array like object</a>), que contiene los parámetros con los que será llamada <em><code>fun</code></em>, o <code>null</code> o {{jsxref("undefined")}} si ningún argumento es estipulado. Desde la versión 5 de ECMAScript estos parámetros pueden estar en un objeto similar a un array en lugar de un array. Véase {{anch("Browser_compatibility", "browser compatibility")}} para mayor información.</dd>
- <dt>
- <h3 id="Valor_de_retorno">Valor de retorno</h3>
-
- <p>El resultado de llamar a la función con el valor dado <code><strong>this</strong></code> y argumentos.</p>
- </dt>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Puede estipularse un objeto <code>this</code> diferente al llamar una función. <code>this</code> se refiere al objeto actual, el objeto haciendo la llamada. Con <code>apply</code>, puede escribirse un método una vez y heredarlo a otro objeto, sin necesidad de reescribir el método para adecuarlo al nuevo objeto.</p>
-
-<p><code>apply</code> es muy similar a {{jsxref("Function.call", "call()")}}, excepto por el tipo de argumentos que soporta. Puede utilizarse un arreglo de parámetros en lugar de un conjunto de pares nombre-valor. Con <code>apply</code>, puede utilizarse un arreglo literal, por ejemplo, <code><em>fun</em>.apply(this, ['eat', 'bananas'])</code>, o un objeto <code>Array</code>, por ejemplo, <code><em>fun</em>.apply(this, new Array('eat', 'bananas'))</code>.</p>
-
-<p>Puede también utilizarse {{jsxref("Funciones/arguments", "arguments")}} como parámetro <code>argsArray</code>. <code>arguments</code> es una variable local a la función. Puede utilizarse para acceder a todos los argumentos no específicados en la llamada al objeto. Por lo tanto, no se requiere conocer todos los argumentos del objeto invocado cuando se utiliza el método <code>apply</code>. Puede utilizarse <code>arguments</code> para pasar los argumentos al objeto invocado. El objeto invocado es entonces responsable por el manejo de los argumentos.</p>
-
-<p>Desde la 5ta edición de ECMAScript se puede utilizar también cualquier tipo de objeto similar a un arreglo, que en términos prácticos significa que tendrá una propiedad <code>length</code> y propiedades integer en el rango (<code>0...length)</code>. Por ejemplo, ahora puede utilizarse un {{domxref("NodeList")}} o un objeto personalizado como: <code>{'length': 2, '0': 'eat', '1': 'bananas'}</code>.</p>
-
-<div>{{ note("La mayoría de los navegadores, incluidos Chrome 14 e Internet Explorer 9, aún no soportan el uso de objetos similares a un array y arrojarán una excepción.") }}</div>
-
-<div> </div>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Using_apply_to_chain_constructors" name="Using_apply_to_chain_constructors">Utilizando <strong><code>apply</code></strong> para encadenar constructores</h3>
-
-<p>Puedes utilizar <code>apply</code> para encadenar {{jsxref("Operadores/new", "constructors")}} para un objeto, similar a Java. En el ejemplo siguiente se crea un método global a {{jsxref("Function")}} llamado <code>construct</code>, en cual posibilita el uso de un objeto similar a un arreglo en un constructor en lugar de una lista de argumentos.</p>
-
-<pre class="brush: js">Function.prototype.construct = function (aArgs) {
-    var fConstructor = this, fNewConstr = function () { fConstructor.apply(this, aArgs); };
-    fNewConstr.prototype = fConstructor.prototype;
-    return new fNewConstr();
-};</pre>
-
-<p>Ejemplo de uso:</p>
-
-<pre class="brush: js">function MyConstructor () {
-    for (var nProp = 0; nProp &lt; arguments.length; nProp++) {
-        this["property" + nProp] = arguments[nProp];
-    }
-}
-
-var myArray = [4, "Hello world!", false];
-var myInstance = MyConstructor.construct(myArray);
-
-alert(myInstance.property1); // alerts "Hello world!"
-alert(myInstance instanceof MyConstructor); // alerts "true"
-alert(myInstance.constructor); // alerts "MyConstructor"</pre>
-
-<div class="note"><strong>Nota:</strong> El método <code>Function.construct</code> no nativo no funcionará con algunos constructores nativos (como {{jsxref("Date")}}, por ejemplo). En estos casos se deberá utilizar el método {{jsxref("Function.bind")}} (por ejemplo, supóngase un arreglo como el siguiente para utilizar con el constructor <code>Date</code>: <code>[2012, 11, 4]</code>; en este caso se tendría que escribir algo como: <code>new (Function.prototype.bind.apply(Date, [null].concat([2012, 11, 4])))()</code> – de cualquier manera, ésta no es la mejor manera de hacerlo y probablemente no debería utilizarse en ningún entorno en producción).</div>
-
-<h3 id="apply_and_built-in_functions" name="apply_and_built-in_functions"><strong><code>apply</code></strong> y funciones <strong>built-in</strong></h3>
-
-<p>El uso inteligente de <strong><code>apply</code></strong> permite utilizar funciones built-in para algunas tareas que, de otra manera, habrían sido escritas recorriendo los valores del arreglo dentro de un bucle. Como ejemplo, vamos a utilizar <code>Math.max</code>/<code>Math.min </code>para encontrar el máximo/mínimo valor en un arreglo.</p>
-
-<pre class="brush: js">/* min/max number in an array */
-var numbers = [5, 6, 2, 3, 7];
-
-/* using Math.min/Math.max apply */
-var max = Math.max.apply(null, numbers); /* This about equal to Math.max(numbers[0], ...) or Math.max(5, 6, ..) */
-var min = Math.min.apply(null, numbers);
-
-/* vs. simple loop based algorithm */
-max = -Infinity, min = +Infinity;
-
-for (var i = 0; i &lt; numbers.length; i++) {
-  if (numbers[i] &gt; max)
-    max = numbers[i];
-  if (numbers[i] &lt; min)
-    min = numbers[i];
-}</pre>
-
-<p>Pero cuidado: utilizando <code>apply</code> de esta manera estás corriendo el riesgo de exceder el límite de argumentos permitido por el motor de JavaScript. Las consecuencias de aplicar una función con demasiados argumentos (imagínate más de decenas de miles de argumentos) varían entre los distintos motores (JavaScriptCore tiene un <a href="https://bugs.webkit.org/show_bug.cgi?id=80797">límite de argumentos fijo de 65536</a>), porque el límite (de hecho, incluso el comportamiento de cualquier pila excesivamente larga) no está especificado. Algunos motores lanzarán una excepción. Más perniciosamente, otros limitarán de manera arbitraria el número de argumentos que se están pasando en realidad a la función. (Para ilustrar este último caso: si un motor tuviera un límite de cuatro argumentos [por supuesto, los límites reales son significamente mayores], sería como si los argumentos 5, 6, 2 y 3 hubieran sido pasados a <code>apply</code> en los ejemplos anteriores, en lugar del arreglo completo). Si el valor de tu arreglo pudiera crecer en decenas de miles, utiliza una estrategia híbrida: aplica a tu función trozos del array a la vez:</p>
-
-<pre class="brush: js">function minOfArray(arr) {
-  var min = Infinity;
-  var QUANTUM = 32768;
-
-  for (var i = 0, len = arr.length; i &lt; len; i += QUANTUM) {
-    var submin = Math.min.apply(null, arr.slice(i, Math.min(i + QUANTUM, len)));
-    min = Math.min(submin, min);
-  }
-
-  return min;
-}
-
-var min = minOfArray([5, 6, 2, 3, 7]);</pre>
-
-<h3 id="Utilizando_apply_en_monkey-patching">Utilizando apply en "monkey-patching" </h3>
-
-<p>(Reemplazando de manera dinámica los argumentos en tiempo de ejecución)</p>
-
-<p><code>apply </code>puede ser la mejor manera de reemplazar dinámicamente una función 'built-in' de Firefox, o de una librería de JavaScript. Dada una función <code>someobject.foo</code>, puedes modificar la función de una forma 'hacker', como ésta:</p>
-
-<pre><code>var originalfoo = someobject.foo;
-someobject.foo = function() {
-  // Haz algo antes de llamar a la función
-  console.log(arguments);
-  // Llama a la función como la hubieras llamado normalmente
-  originalfoo.apply(this, arguments);
-  // Aquí, ejecuta algo después
-}</code></pre>
-
-<p>Este método es especialmente útil cuando quieres depurar eventos, o interfaces con algún elemento que no tiene API, al igual que los diversos <code>.on</code> (eventos<code> [event]..., </code>como los que se usan en el <a href="https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector#Developer_API">Devtools Inspector</a>)</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición Inicial. Implementada in JavaScript 1.3.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.3.4.3', 'Function.prototype.apply')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-function.prototype.apply', 'Function.prototype.apply')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-function.prototype.apply', 'Function.prototype.apply')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<table>
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>ES 5.1 generic array-like object as {{jsxref("Functions/arguments", "arguments")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-
-<table>
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>ES 5.1 generic array-like object as {{jsxref("Functions/arguments", "arguments")}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="See_also" name="See_also">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Funciones/arguments", "arguments")}} objetos</li>
- <li>{{jsxref("Function.prototype.bind()")}}</li>
- <li>{{jsxref("Function.prototype.call()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/arguments/index.html b/files/es/web/javascript/referencia/objetos_globales/function/arguments/index.html
deleted file mode 100644
index f0f8f6ca90..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/arguments/index.html
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: Function.arguments
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/arguments
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/arguments
----
-<div>{{JSRef("Objetos_globales", "Function")}} {{deprecated_header}}</div>
-
-<h3 id="Resumen" name="Resumen">Resumen</h3>
-
-<p>Un objeto de tipo arreglo correspondiente a los argumentos pasados a la función.</p>
-
-<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
-
-<p>Use el objeto <code><a href="es/Referencia_de_JavaScript_1.5/Funciones/arguments">arguments</a></code> disponible dentro de las funciones en vez de <code>Function.arguments</code>.</p>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<p>En caso de recursividad, es decir, si la función <code>f</code> aparece varias veces en la pila de llamada, el valor de <code>f.arguments</code> representa los argumentos correspondientes a la invocación más reciente de la función.</p>
-
-<h3 id="Ejemplo" name="Ejemplo">Ejemplo</h3>
-
-<pre class="eval">function f(n) { g(n-1) }
-function g(n) {
-  print("antes: " + g.arguments[0]);
-  if(n&gt;0)
-    f(n);
-  print("después: " + g.arguments[0]);
-}
-f(2)
-</pre>
-
-<p>resultados:</p>
-
-<pre class="eval">antes: 1
-antes: 0
-después: 0
-después: 1
-</pre>
-
-<p> </p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "en": "en/Core_JavaScript_1.5_Reference/Global_Objects/Function/arguments", "pl": "pl/Dokumentacja_j\u0119zyka_JavaScript_1.5/Obiekty/Function/arguments" } ) }}</p>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/bind/index.html b/files/es/web/javascript/referencia/objetos_globales/function/bind/index.html
deleted file mode 100644
index bdc7b5b73c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/bind/index.html
+++ /dev/null
@@ -1,293 +0,0 @@
----
-title: Function.prototype.bind()
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/bind
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/bind
----
-<div>{{JSRef("Global_Objects", "Function")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <code><strong>bind()</strong></code> crea una nueva función, que cuando es llamada, asigna a su operador  <em>this</em> el valor entregado, con una secuencia de argumentos dados precediendo a cualquiera entregados cuando la función es llamada. </p>
-
-<p>El valor de <em>this</em> es ignorado cuando la función es llamada con el operador <em>new</em>.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>fun</var>.bind(<var>thisArg</var>[, <var>arg1</var>[, <var>arg2</var>[, ...]]])</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parametros</h3>
-
-<dl>
- <dt><code>thisArg</code></dt>
- <dd>Es un valor que será enviado a la función destino cuando se llame a la función de enlace. Este valor será ignorado si la función de enlace es construida usando el operador {{jsxref("Operators/new", "new")}}.</dd>
- <dt><code>arg1, arg2, ...</code></dt>
- <dd>Son los argumentos que se enviarán además de los provistos a la función de enlace cuando se invoque la función destino.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una copia de la función entregada con el valor especificado <code>this </code>y los argumentos iniciales.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>La función <code>bind()</code> crea una nueva función (<strong>función ligada</strong>) con el mismo cuerpo (propiedad interna {{jsxref("Function.prototype.call", "call")}} en términos de ECMAScript 5) como la función que será llamada (la <strong>función objetivo</strong> de la función ligada) con la referencia <code>this</code> asociada al primer argumento de <code>bind()</code>, el cual no podrá ser sobreescrito. <code>bind()</code> también acepta parámetros predeterminados que antecederán al resto de los parámetros específicos cuando la función objetivo sea llamada. Una función ligada también puede ser construída utilizando el operador {{jsxref("Operators/new", "new")}}: al hacerlo, actuará como si en su lugar hubiera sido construída la función objetivo.</p>
-
-<p>En este último caso, el parámetro correspondiente para <code>this</code> será ignorado, aunque los parámetros predeterminados que antecederán al resto sí serán provistos para la función emulada.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Ejemplo_Crear_una_función_ligada">Ejemplo: Crear una función ligada</h3>
-
-<p>El uso más simple de <code>bind()</code> es hacer que una función que, sin importar cómo es llamada, siempre apunte al mismo objeto con la referencia <code>this</code>. Un error común para nuevos programadores de JavaScript es que obtienen una referencia a un método de un objeto, posteriormente ejecutan ese método desde la referencia externa y esperan que la referencia de <code>this</code> siga apuntando al objeto original de donde se obtuvo el método (v.g. cuando se usa ese método en un callback). Sin el debido cuidado, el objeto original es comúnmente perdido. Creando una función ligada desde la función  empleando el objeto original, resuelve limpiamente este problema:</p>
-
-<pre class="brush: js">this.x = 9;
-var module = {
-  x: 81,
-  getX: function() { return this.x; }
-};
-
-module.getX(); // 81
-
-var getX = module.getX;
-getX(); // 9, porque en este caso, "this" apunta al objeto global
-
-// Crear una nueva función con 'this' asociado al objeto original 'module'
-var boundGetX = getX.bind(module);
-boundGetX(); // 81</pre>
-
-<h3 id="Ejemplo_Funciones_Parciales">Ejemplo: Funciones Parciales</h3>
-
-<p>El siguiente uso simple de <code>bind()</code> es definir una función con argumentos predeterminados que precederán a los argumentos finales de la función ligada. Estos argumentos iniciales (en caso de haberlos) se definen a continuación de lo que será la referencia de <code>this</code> y son entonces enviados como argumentos de la función objetivo, seguidos por los argumentos enviados a la función ligada cada vez que dicha función sea llamada.</p>
-
-<pre class="brush: js">function list() {
-  return Array.prototype.slice.call(arguments);
-}
-
-var list1 = list(1, 2, 3); // [1, 2, 3]
-
-// Crear funcion (sin referencia this) con argumento inicial predeterminado
-var leadingThirtysevenList = list.bind(undefined, 37);
-
-var list2 = leadingThirtysevenList(); // [37]
-var list3 = leadingThirtysevenList(1, 2, 3); // [37, 1, 2, 3]
-</pre>
-
-<h3 id="Ejemplo_Con_setTimeout">Ejemplo: Con setTimeout</h3>
-
-<p>De manera predeterminada, dentro de {{ domxref("window.setTimeout()") }}, la palabra reservada <code>this</code> será setteada al objeto {{ domxref("window") }} (o a global). Cuando se esté trabajando con métodos de clase que requieran que <code>this</code> se refiera a instancias de clase, usted puede explícitamente ligar <code>this</code> a la función callback para mantener la referencia de la instancia.</p>
-
-<pre class="brush: js">function LateBloomer() {
-  this.petalCount = Math.ceil(Math.random() * 12) + 1;
-}
-
-// Declare bloom after a delay of 1 second
-LateBloomer.prototype.bloom = function() {
-  window.setTimeout(this.declare.bind(this), 1000);
-};
-
-LateBloomer.prototype.declare = function() {
-  console.log('I am a beautiful flower with ' +
-    this.petalCount + ' petals!');
-};
-</pre>
-
-<h3 id="Ejemplo_Funciones_ligadas_usadas_como_constructores">Ejemplo: Funciones ligadas usadas como constructores</h3>
-
-<div class="warning">
-<p><strong>Advetencia:</strong> Esta sección demuestra las capacidades de JavaScript y documenta algunos usos extremos del método <code>bind()</code>. Los métodos mostrados a continuación no son la mejor forma de hacer las cosas y probablemente no deberían ser utilizados en ningún ambiente productivo.</p>
-</div>
-
-<p>Las funciones ligadas son automáticamente adecuadas para usarse con el operador {{jsxref("Operators/new", "new")}} para construir nuevas instancias creadas por la función objetivo. Cuando una función ligada es utilizada para construir un valor, el parámetro enviado para reemplazar la referencia <code>this</code> es ignorado. De cualquier forma, los argumentos iniciales sí son tomados en consideración y antecederán a los parámetros que se envíen al constructor:</p>
-
-<pre class="brush: js">function Point(x, y) {
-  this.x = x;
-  this.y = y;
-}
-
-Point.prototype.toString = function() {
-  return this.x + ',' + this.y;
-};
-
-var p = new Point(1, 2);
-p.toString(); // '1,2'
-
-
-var emptyObj = {};
-var YAxisPoint = Point.bind(emptyObj, 0/*x*/);
-// not supported in the polyfill below,
-// works fine with native bind:
-var YAxisPoint = Point.bind(null, 0/*x*/);
-
-var axisPoint = new YAxisPoint(5);
-axisPoint.toString(); // '0,5'
-
-axisPoint instanceof Point; // true
-axisPoint instanceof YAxisPoint; // true
-new Point(17, 42) instanceof YAxisPoint; // true
-</pre>
-
-<p>Note que no necesita hacer nada especial para crear una función ligada para usarse con {{jsxref("Operators/new", "new")}}. El razonamiento es que usted no necesita hacer nada especial para crear una función ligada para ser llamada planamente, aún si usted prefiriera requerir que la función ligada sea llamada únicamente utilizando {{jsxref("Operators/new", "new")}}.</p>
-
-<pre class="brush: js">// Ejemplo que puede ser ejecutado directamente en tu consola JavaScript
-// ...continúa de arriba
-
-// Aún puede ser invocada como una función normal
-// (aunque es usualmente indeseable)
-YAxisPoint(13);
-
-emptyObj.x + ',' + emptyObj.y;
-// &gt;  '0,13'
-</pre>
-
-<p>Si desea utilizar una función ligada únicamente usando {{jsxref("Operators/new", "new")}}, o únicamente mediante una llamada directa, la función objetivo debe forzar esa restricción.</p>
-
-<h3 id="Example:_Creating_shortcuts" name="Example:_Creating_shortcuts">Ejemplo: Crear atajos</h3>
-
-<p><code>bind()</code> también es útil en casos en los que desea crear un atajo para una función que requiere una referencia específica para <code>this</code>.</p>
-
-<p>Tomando {{jsxref("Array.prototype.slice")}}, por ejemplo, el cual se desearía utilizar para convertir un objeto tipo array a un arreglo real. Podría crear un atajo como el siguiente:</p>
-
-<pre class="brush: js">var slice = Array.prototype.slice;
-
-// ...
-
-slice.call(arguments);
-</pre>
-
-<p>Con <code>bind()</code>, esto puede ser simplificado. En el siguiente fragmento de código, <code>slice</code> es una función ligada a la función {{jsxref("Function.prototype.call()", "call()")}} de {{jsxref("Function.prototype")}}, con la referencia <code>this</code> setteada a la función {{jsxref("Array.prototype.slice()", "slice()")}} de {{jsxref("Array.prototype")}}. Esto significa que llamadas adicionales a <code>call()</code> pueden omitirse:</p>
-
-<pre class="brush: js">// same as "slice" in the previous example
-var unboundSlice = Array.prototype.slice;
-var slice = Function.prototype.call.bind(unboundSlice);
-
-// ...
-
-slice(arguments);
-</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<p>La función <code>bind()</code> fue añadida a la especificación ECMA-262, 5a edición; por lo tanto podría no estar presente en todos los navegadores. Usted puede parcialmente simularla al insertar el siguiente código al inicio de sus scripts, permitiendo emplear muchas de las funcionalidades de <code>bind()</code> en implementaciones que no la soportan nativamente.</p>
-
-<pre class="brush: js">if (!Function.prototype.bind) {
-  Function.prototype.bind = function(oThis) {
-    if (typeof this !== 'function') {
-      // closest thing possible to the ECMAScript 5
-      // internal IsCallable function
-      throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
-    }
-
-    var aArgs   = Array.prototype.slice.call(arguments, 1),
-        fToBind = this,
-        fNOP    = function() {},
-        fBound  = function() {
-          return fToBind.apply(this instanceof fNOP &amp;&amp; oThis
-                 ? this
-                 : oThis,
-                 aArgs.concat(Array.prototype.slice.call(arguments)));
-        };
-
-    fNOP.prototype = this.prototype;
-    fBound.prototype = new fNOP();
-
-    return fBound;
-  };
-}
-</pre>
-
-<p>Algunas de las muchas diferencias (bien podría haber otras, en tanto la siguiente lista no intenta ser exhaustiva) entre este algoritmo y el algoritmo de la especificación son:</p>
-
-<ul>
- <li>La implementación parcial se basa en {{jsxref("Array.prototype.slice()")}}, {{jsxref("Array.prototype.concat()")}}, {{jsxref("Function.prototype.call()")}} y {{jsxref("Function.prototype.apply()")}}, métodos incorporados para tener sus valores originales.</li>
- <li>La implementación parcial crea funciones que no tienen "poison pills" inmutables {{jsxref("Function.caller", "caller")}} y las propiedades de los <code>argumentos</code> que lanzan una {{jsxref("Global_Objects/TypeError", "TypeError")}} sobre get, set, o deletion. (Esto podría ser añadido si la implementación soportara {{jsxref("Object.defineProperty")}}, o parcialmente implementada [sin el comportamiento throw-on-delete] si la implementación soportara las extensiones {{jsxref("Object.defineGetter", "__defineGetter__")}} y {{jsxref("Object.defineSetter", "__defineSetter__")}} ).</li>
- <li>La implementación parcial crea funciones que tienen una propiedad <code>prototype</code>. (Las funciones ligadas no tienen ninguna).</li>
- <li>La implementación parcial crea funciones ligadas cuya propiedad {{jsxref("Function.length", "length")}} no coincide con la indicada por ECMA-262: ésta crea funciones con longitud 0, mientras que la implementación completa, dependiendo de la longitud de la función objetivo y del número de argumentos pre-especificados, podría regresar una longitud mayor a zero.</li>
-</ul>
-
-<p>Si elige usar esta implementación parcial,<strong> no debe de utilizarla en los casos en los que el comportamiento es distinto al de la especificación ECMA-262, 5th edition!</strong> Con un poco de cuidado, de cualquier manera (y tal vez con algunas modificaciones adicionales para adecuarse a sus necesidades específicas), esta implementación parcial podría ser un puente razonable al momento en que <code>bind()</code> sea ampliamente implementada acorde a a la especificación.</p>
-
-<p>Por favor checa <a href="https://github.com/Raynos/function-bind">https://github.com/Raynos/function-bind</a> para ver una solución más profunda.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.3.4.5', 'Function.prototype.bind')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-function.prototype.bind', 'Function.prototype.bind')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome("7")}}</td>
-   <td>{{CompatGeckoDesktop("2")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatOpera("11.60")}}</td>
-   <td>{{CompatSafari("5.1.4")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatAndroid("4.0")}}</td>
-   <td>{{CompatChrome("0.16")}}</td>
-   <td>{{CompatGeckoMobile("2")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatOperaMobile("11.50")}}</td>
-   <td>{{CompatSafari("6.0")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Basado en <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat tables</a>.</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Function.prototype.apply()")}}</li>
- <li>{{jsxref("Function.prototype.call()")}}</li>
- <li>{{jsxref("Functions_and_function_scope", "Functions and function scope", "", 1)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/call/index.html b/files/es/web/javascript/referencia/objetos_globales/function/call/index.html
deleted file mode 100644
index 4200c5d2a5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/call/index.html
+++ /dev/null
@@ -1,113 +0,0 @@
----
-title: Function.prototype.call()
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/call
-tags:
-  - Function
-  - JavaScript
-  - Method
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/call
----
-<div>{{JSRef("Objetos_globales", "Function")}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El método <strong><code>call()</code></strong> llama a una función con un valor dado <code>this</code> y con argumentos provistos individualmente.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><em>function</em>.call(<em>thisArg</em>[, <em>arg1</em>[, <em>arg2</em>[, ...]]])</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code><em>thisArg</em></code> {{optional_inline}}</dt>
- <dd>El valor a usar como <code>this</code> cuando se llama a <em><code>function</code></em>.</dd>
- <dd>
- <div class="blockIndicator note">
- <p><strong>Cuidado:</strong> En ciertos casos, <code><em>thisArg</em></code> puede no ser el valor actual visto por el método.</p>
-
- <p>Si el método es una función en {{jsxref("Strict_mode", "non-strict mode", "", 1)}}, {{jsxref("Global_Objects/null", "null")}} y {{jsxref("Global_Objects/undefined", "undefined")}} serán reemplazados con el objeto global, y valores primitivos serán convertidos a objetos.</p>
- </div>
- </dd>
- <dt><code>arg1, arg2, ...</code></dt>
- <dd>Argumentos para el objeto.</dd>
- <dt>
- <h3 id="Valor_de_retorno">Valor de retorno</h3>
- </dt>
- <dd>El resultado de llamar a la función con el <code>this</code> especificado y los argumentos.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>call()</code> permite que una función/método que pertenece a un objeto, ser asignada y llamada para un objeto diferente.</p>
-
-<p><code>call()</code> provee un nuevo valor de <code>this</code> a la función/método. Con <code>call()</code>, puedes escribir un método ona vez y heredarlo a otro objeto, sin tener que reescribir el método en el nuevo objeto.</p>
-
-<div class="note"><strong>Nota:</strong> Mientras la sintaxis de esta función es casi identica a la función {{jsxref("Function.apply", "apply()")}}, la diferencia fundamental es que <code>call()</code> acepta una <strong>lista de argumentos</strong>, mientras <code>apply()</code> accepta un <strong>arreglo sencillo de argumentos</strong>.</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_call_para_encadenar_constructores_para_un_objeto">Usando <code>call</code> para encadenar constructores para un objeto</h3>
-
-<p>Puede usar <code>call</code> para encadenar constructores para un objeto (similar a Java).</p>
-
-<p>En el siguiente ejemplo, el constructor para el objeto <code>Producto</code> es definido con dos parametros, <code>nombre</code> y <code>precio</code>.</p>
-
-<p>Otras dos funciones <code>Comida</code> y <code>Juguete</code> invocan a <code>Producto</code>, pasándo <code>this</code>, <code>nombre</code> y <code>precio</code>. <code>Producto</code> inicializa las propiedades <code>nombre</code> y <code>precio</code>, ambas funciones especializadas definen la <code>categoria</code>.</p>
-
-<pre class="brush: js notranslate">function Producto(nombre, precio) {
-  this.nombre = nombre;
-  this.precio = precio;
-
-  if (precio &lt; 0)
-    throw RangeError('No se puede crear el producto "' + nombre + '" con un precio negativo');
-  return this;
-}
-
-function Comida(nombre, precio) {
-  Producto.call(this, nombre, precio);
-  this.categoria = 'comida';
-}
-Comida.prototype = new Producto();
-
-function Juguete(nombre, precio) {
-  Producto.call(this, nombre, precio);
-  this.categoria = 'juguete';
-}
-Juguete.prototype = new Producto();
-
-var queso = new Comida('feta', 5);
-var diversion = new Juguete('robot', 40);
-</pre>
-
-<h3 id="Usando_call_para_invocar_una_función_anónima">Usando <code>call</code> para invocar una función anónima</h3>
-
-<p>En este ejemplo, creamos una función anónima y usamos <code>call</code> para invocarla en cada objeto en un arreglo.</p>
-
-<p>El propósito principal de la función anónima aquí es agregar una función <code>print</code>  a cada objeto, el cual puede imprimir el índice correcto en el arreglo.</p>
-
-<div class="blockIndicator note">
-<p>Pasar el objeto como valor <code>this</code> no es estrictamente necesario, pero se hace con propósito explicativo.</p>
-</div>
-
-<pre class="brush: js notranslate">var animales = [
-  {especie: 'Leon', nombre: 'Rey'},
-  {especie: 'Whale', nombre: 'Fail'}
-];
-
-for (var i = 0; i &lt; animales.length; i++) {
-  (function (i) {
-    this.imprimir = function () {
-      console.log('#' + i  + ' ' + this.especie + ': ' + this.nombre);
-    }
-    this.imprimir();
-  }).call(animales[i], i);
-}
-</pre>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Function.prototype.bind()")}}</li>
- <li>{{jsxref("Function.prototype.apply()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/caller/index.html b/files/es/web/javascript/referencia/objetos_globales/function/caller/index.html
deleted file mode 100644
index 942df69a68..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/caller/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: Function.caller
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/caller
-tags:
-  - Función Javascript No-standard Propiedad
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/caller
----
-<div>{{JSRef("Global_Objects", "Function")}} {{non-standard_header}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La propiedad <code><strong><em>function</em>.caller</strong></code> retorna la función que llamó a la función especificada.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Si la función <code>f</code> fue llamada por desde nivel raiz (top level code), el valor de <code>f.caller</code> es {{jsxref("Global_Objects/null", "null")}}, de lo contrario se retorna la función que llamó a <code>f</code>.</p>
-
-<p>Esta propiedad reemplaza a la propiedad obsoleta {{jsxref("Functions_and_function_scope/arguments/caller", "arguments.caller")}} del objeto {{jsxref("Funciones/arguments", "arguments")}}.</p>
-
-<p>la propiedad especial <code>__caller__</code>, la cual retornaba el objeto de activación del llamador y permitía reconstruir la pila de llamadas, ha sido removida por motivos de seguridad.</p>
-
-<h3 id="Notes" name="Notes">Notas</h3>
-
-<p>En caso de recursión se puede reconstruir la pila de llamada utilizando esta propiedad, tal como se muestra a continuación:</p>
-
-<pre class="brush: js">function f(n) { g(n - 1); }
-function g(n) { if (n &gt; 0) { f(n); } else { stop(); } }
-f(2);
-</pre>
-
-<p>Al momento de ejecutar <code>stop()</code> este se llama con la siguiente pila de llamadas:</p>
-
-<pre class="eval">f(2) -&gt; g(1) -&gt; f(1) -&gt; g(0) -&gt; stop()
-</pre>
-
-<p>Siendo verdadero la siguiente consideración:</p>
-
-<pre class="eval">stop.caller === g &amp;&amp; f.caller === g &amp;&amp; g.caller === f
-</pre>
-
-<p>Por lo tanto si se intenta obtener el rastro de llamadas (stack trace) de la función <code>stop()</code> como se muestra a continuación:</p>
-
-<pre class="brush: js">var f = stop;
-var stack = 'Stack trace:';
-while (f) {
-  stack += '\n' + f.name;
-  f = f.caller;
-}
-</pre>
-
-<p>se provocará una bucle que nunca termina.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Checking_the_value_of_a_function.27s_caller_property" name="Example:_Checking_the_value_of_a_function.27s_caller_property">Ejemplo: Verificar el valor de la propiedad <code>caller</code> de una función</h3>
-
-<p>El siguiente código verifica el valor de la propiedad <code>caller</code> de una función.</p>
-
-<pre class="brush: js">function myFunc() {
-  if (myFunc.caller == null) {
-    return 'The function was called from the top!';
-  } else {
-    return 'This function\'s caller was ' + myFunc.caller;
-  }
-}
-</pre>
-
-<h2 id="Especificación">Especificación</h2>
-
-<p>No es parte de ninguna especificación. Se implementa en JavaScript 1.5.</p>
-
-<h2 id="Compatiblilidad_de_Navegadores">Compatiblilidad de Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Véase también</h2>
-
-<ul>
- <li>Problema de implementación para SpiderMonkey {{bug(65683)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/displayname/index.html b/files/es/web/javascript/referencia/objetos_globales/function/displayname/index.html
deleted file mode 100644
index d464266838..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/displayname/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Function.displayName
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/displayName
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/displayName
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>The <code><strong><em>function</em>.displayName</strong></code> property returns the display name of the function.</p>
-
-<h2 id="Description">Description</h2>
-
-<p>Cuando se define la propiedad <code>displayName</code> , retorna un mensaje con el nombre para mostrar en una función:</p>
-
-<pre class="brush: js">function doSomething() {}
-
-console.log(doSomething.displayName); // "undefined"
-
-var popup = function(content) { console.log(content); };
-
-popup.displayName = 'Show Popup';
-
-console.log(popup.displayName); // "Show Popup"
-</pre>
-
-<p>Tu puedes definir una funcion con un nombre a mostrar en un {{jsxref("Functions", "function expression", "", 1)}}:</p>
-
-<pre class="brush: js">var object = {
-  someMethod: function() {}
-};
-
-object.someMethod.displayName = 'someMethod';
-
-console.log(object.someMethod.displayName); // logs "someMethod"
-
-try { someMethod } catch(e) { console.log(e); }
-// ReferenceError: someMethod is not defined
-</pre>
-
-<p>Puedes cambiar dinámicamente el <code>displayName</code> de una función:</p>
-
-<pre class="brush: js">var object = {
-  // anonymous
-  someMethod: function(value) {
-    arguments.callee.displayName = 'someMethod (' + value + ')';
-  }
-};
-
-console.log(object.someMethod.displayName); // "undefined"
-
-object.someMethod('123')
-console.log(object.someMethod.displayName); // "someMethod (123)"
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Normalmente, se prefiere por consolas y profilers sobre {{jsxref("Function.name", "func.name")}} a mostrar el nombre de una función.</p>
-
-<p>Al ingresar lo siguiente en una consola, debería mostrarse como algo así como "<code>function My Function()</code>":</p>
-
-<pre class="brush: js">var a = function() {};
-a.displayName = 'My Function';
-
-a; // "function My Function()"</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<p>Not part of any specification.</p>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Function.displayName")}}</p>
-</div>
-
-<div> </div>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/función/index.html b/files/es/web/javascript/referencia/objetos_globales/function/función/index.html
deleted file mode 100644
index af4dff0361..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/función/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: Function() constructor
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/Función
-tags:
-  - Constructor
-  - Function
-  - JavaScript
-  - Referencia
-  - función
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/Function
----
-<div>{{JSRef("Objetos_globales", "Function")}}</div>
-
-<p><span class="seoSummary">El constructor <strong><code>Function</code></strong> crea un nuevo <strong>objeto</strong> <code>Function</code>. Llamar al constructor directamente puede crear funciones dinámicamente, pero tiene problemas de seguridad y de rendimiento similares (pero mucho menos importantes) para {{jsxref("eval")}}. Sin embargo, a diferencia de eval, el constructor <code>Function</code> crea funciones que solo se ejecutan en el ámbito global.</span></p>
-
-<div>{{EmbedInteractiveExample("pages/js/function-constructor.html","shorter")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>new Function([<var>arg1 </var>[, <var>arg2 </var>[, ...<var>argN</var>]] ,] <var>functionBody</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>arg1</var>, <var>arg2</var>, ... <var>argN</var></code></dt>
- <dd>Nombres que utilizará la función como nombres de argumentos formales. Cada uno debe ser una cadena que corresponda a un identificador JavaScript válido, o una lista de dichas cadenas separadas por una coma. Por ejemplo: "<code>x</code>", "<code>theValue</code>" —o "<code>x,theValue</code>".</dd>
- <dt><code><var>functionBody</var></code></dt>
- <dd>Una cadena que contiene las declaraciones de JavaScript que comprenden la definición de función.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los objetos <code>Function</code> creados con el constructor <code>Function</code> se procesan cuando se crea la función. Esto es menos eficiente que declarar una función con una {{jsxref("Operators/function", "expresión de función")}} o {{jsxref("Statements/function", "declaración de función")}} y llamarla dentro de tu código porque tales funciones se procesan con el resto del código.</p>
-
-<p>Todos los argumentos pasados a la función se tratan como los nombres de los identificadores de los parámetros en la función que se va a crear, en el orden en que se pasan. Omitir un argumento dará como resultado que el valor de ese parámetro sea <code>undefined</code>.</p>
-
-<p>Invocar el constructor <code>Function</code> como función (sin usar el operador <code>new</code>) tiene el mismo efecto que invocarlo como constructor.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Especificar_argumentos_con_el_constructor_Function">Especificar argumentos con el constructor Function</h3>
-
-<p>El siguiente código crea un objeto <code>Function</code> que toma dos argumentos.</p>
-
-<pre class="brush: js notranslate">// El ejemplo se puede ejecutar directamente en tu consola JavaScript
-
-// Crea una función que toma dos argumentos y devuelve la suma de esos argumentos
-const adder = new Function('a', 'b', 'return a + b');
-
-// Llama a la función
-adder(2, 6);
-// 8
-</pre>
-
-<p>Los argumentos "<code>a</code>" y "<code>b</code>" son nombres de argumentos formales que se utilizan en el cuerpo de la función, "<code>return a + b</code>".</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-function-constructor', 'Constructor Function')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Function.Function")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Functions", "Funciones y ámbito de la función", "", 1)}}</li>
- <li>{{jsxref("Statements/function", "Declaración de function")}}</li>
- <li>{{jsxref("Operators/function*", "Expresión function*")}}</li>
- <li>{{jsxref("Statements/function", "Declaración de function*")}}</li>
- <li>{{jsxref("Operators/function*", "Expresión function*")}}</li>
- <li>{{jsxref("AsyncFunction", "Función asíncrona", "", 1)}}</li>
- <li>{{jsxref("GeneratorFunction", "Función generadora", "", 1)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/index.html b/files/es/web/javascript/referencia/objetos_globales/function/index.html
deleted file mode 100644
index 5b586f3611..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: Function
-slug: Web/JavaScript/Referencia/Objetos_globales/Function
-tags:
-  - Clase
-  - Class
-  - Declaración
-  - Expresión
-  - Function
-  - JavaScript
-  - función
-translation_of: Web/JavaScript/Reference/Global_Objects/Function
----
-<div>{{JSRef("Objetos_globales", "Function")}}</div>
-
-<p>Cada función de JavaScript en realidad es un objeto <code>Function</code>. Esto se puede ver con el código <code>(function() {}).constructor === Function</code>, que devuelve <code>true</code>.</p>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{jsxref("Function/Function", "Function()", "", 1)}}</dt>
- <dd>Crea un nuevo objeto <code>Function</code>. Llamar al constructor directamente puede crear funciones dinámicamente, pero tiene problemas de seguridad y de rendimiento similares (pero mucho menos importantes) para {{jsxref("eval")}}. Sin embargo, a diferencia de <code>eval</code>, el constructor <code>Function</code> crea funciones que solo se ejecutan en el ámbito global.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{jsxref("Function.arguments")}}</dt>
- <dd>Un arreglo que corresponde a los argumentos pasados a una función.<br>
- Esto está obsoleto como propiedad de {{jsxref("Function")}}. En su lugar, utiliza el objeto {{jsxref("Functions/arguments", "arguments", "", 1)}} (disponible dentro de la función).</dd>
- <dt>{{jsxref("Function.caller")}}</dt>
- <dd>Especifica la función que invocó a la función que se está ejecutando actualmente.<br>
- Esta propiedad está obsoleta, y solo es funcional para algunas funciones no estrictas.</dd>
- <dt>{{jsxref("Function.displayName")}}</dt>
- <dd>El nombre a mostrar de la función.</dd>
- <dt>{{jsxref("Function.length")}}</dt>
- <dd>Especifica el número de argumentos que espera la función.</dd>
- <dt>{{jsxref("Function.name")}}</dt>
- <dd>El nombre de la función.</dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt>{{jsxref("Function.prototype.apply()", "Function.prototype.apply(<var>thisArg</var> [, <var>argsArray</var>])")}}</dt>
- <dd>Llama a una función y establece su <code>this</code> en el <code><var>thisArg</var></code> proporcionado. Los argumentos se pueden pasar como un objeto {{jsxref("Array")}}.</dd>
- <dt>{{jsxref("Function.prototype.bind()", "Function.prototype.bind(<var>thisArg</var>[, <var>arg1</var>[, <var>arg2</var>[, ...<var>argN</var>]]])")}}</dt>
- <dd>Crea una nueva función que, cuando se llama, tiene su <code>this</code> configurado en el <code><var>thisArg</var></code>. Opcionalmente, una determinada secuencia de argumentos se antepondrá a los argumentos siempre que se llame a la función recién invocada.</dd>
- <dt>{{jsxref("Function.prototype.call()", "Function.prototype.call(<var>thisArg</var>[, <var>arg1</var>, <var>arg2</var>, ...<var>argN</var>])")}}</dt>
- <dd>Llama a una función y establece su <code>this</code> en el valor proporcionado. Los argumentos se pueden pasar tal cual.</dd>
- <dt>{{jsxref("Function.prototype.toString()", "Function.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el código fuente de la función.<br>
- Redefine el método {{jsxref("Object.prototype.toString()")}}.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Diferencia_entre_el_constructor_Function_y_la_declaración_function">Diferencia entre el constructor Function y la declaración function</h3>
-
-<p>Las funciones creadas con el constructor <code>Function</code> no crean cierres para sus contextos de creación; siempre se crean en el ámbito global. Al ejecutarlos, solo podrán acceder a sus propias variables locales y globales, no a las del ámbito en el que se creó el constructor <code>Function</code>. Esto es diferente de usar {{jsxref("eval")}} con código para una expresión de función.</p>
-
-<pre class="brush: js notranslate">var x = 10;
-
-function createFunction1() {
-    var x = 20;
-    return new Function('return x;'); // esta |x| se refiere a la |x| global
-}
-
-function createFunction2() {
-    var x = 20;
-    function f() {
-        return x; // esta |x| se refiere a la |x| local
-    }
-    return f;
-}
-
-var f1 = createFunction1();
-console.log(f1());          // 10
-var f2 = createFunction2();
-console.log(f2());          // 20
-</pre>
-
-<p>Si bien este código funciona en los navegadores web, <code>f1()</code> producirá un <code>ReferenceError</code> en Node.js, ya que no encontrará a <code>x</code>. Esto se debe a que el ámbito de nivel superior en Node no es el ámbito global, y <code>x</code> será local para el módulo.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-function-objects', 'Function')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Function")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Functions", "Funciones y ámbito de la función", "", 1)}}</li>
- <li>Declaración {{jsxref("Statements/function", "function")}}</li>
- <li>Expresión {{jsxref("Operators/function", "function")}}</li>
- <li>Declaración {{jsxref("Statements/function*", "function*")}}</li>
- <li>Expresión {{jsxref("Operators/function*", "function*")}}</li>
- <li>{{jsxref("AsyncFunction", "Función asíncrona", "", 1)}}</li>
- <li>{{jsxref("GeneratorFunction", "Función generadora", "", 1)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/length/index.html b/files/es/web/javascript/referencia/objetos_globales/function/length/index.html
deleted file mode 100644
index 7638859bba..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/length/index.html
+++ /dev/null
@@ -1,151 +0,0 @@
----
-title: Function.length
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/length
-tags:
-  - JavaScript
-  - Propiedad
-  - función
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/length
----
-<div>{{JSRef("Global_Objects", "Function")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>La propiedad <code><strong>length</strong></code> especifica el número de argumentos esperados por la función.</p>
-
-<div>{{js_property_attributes(0,0,1)}}</div>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p><code>length</code> es la propiedad de una función objeto, e indica el número de argumentos que una función requiere, por ejemplo, el número de parámetros formales. Este número no incluye {{jsxref("rest_parameters", "rest parameter", "", 1)}}. En cambio, {{jsxref("Functions_and_function_scope/arguments/length", "arguments.length")}} es local a una función y aporta el número de argumentos actuales pasados a una función.</p>
-
-<h3 id="Propiedades_de_la_Función_constructora">Propiedades de la <code>Función</code> constructora</h3>
-
-<p>El {{jsxref("Global_Objects/Function", "Function")}} constructor en sí mismo es {{jsxref("Global_Objects/Function", "Function")}} un objeto. Sú <code>propiedad length</code> tiene el valor 1. Los atributos son: Grabable: <code>false</code>, Enumerable: <code>false</code>, Configurable: <code>true</code>.</p>
-
-<h3 id="Propiedad_de_la_Función_prototype_object">Propiedad de la  <code>Función</code> prototype object</h3>
-
-<p>La propiedad length del {{jsxref("Global_Objects/Function", "Function")}} objeto prototype tiene el valor 0.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<pre class="brush: js">console.log(Function.length); /* 1 */
-
-console.log((function()        {}).length); /* 0 */
-console.log((function(a)       {}).length); /* 1 */
-console.log((function(a, b)    {}).length); /* 2 etc. */
-console.log((function(...args) {}).length); /* 0, resto de parámetros no se contemplan */
-console.log((function(a, b = 1, c) {}).length); /* 1, solo parámetros antes del primero con un valor por defecto son contados */
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Standard</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td><code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} constructor:<br>
-    {{SpecName('ES5.1', '#sec-15.3.3.2', 'Function.length')}}<br>
-    <code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} prototype object:<br>
-    {{SpecName('ES5.1', '#sec-properties-of-the-function-prototype-object', 'Function.length')}}<br>
-    <code>length</code> property of {{jsxref("Global_Objects/Function", "Function")}} instances:<br>
-    {{SpecName('ES5.1', '#sec-15.3.5.1', 'Function.length')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td><code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} constructor:<br>
-    {{SpecName('ES6', '#sec-function.length', 'Function.length')}}<br>
-    <code>length</code> property of the {{jsxref("Global_Objects/Function", "Function")}} prototype object:<br>
-    {{SpecName('ES6', '#sec-15.3.4', 'Function.length')}}<br>
-    <code>length</code> property of {{jsxref("Global_Objects/Function", "Function")}} instances:<br>
-    {{SpecName('ES6', '#sec-function-instances-length', 'Function.length')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>El atributo <code>configurable</code> de esta propiedad ahora es <code>true</code>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Configurable: true</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop(37)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Configurable: true</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile(37)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Global_Objects/Function", "Función")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/name/index.html b/files/es/web/javascript/referencia/objetos_globales/function/name/index.html
deleted file mode 100644
index 2440bd60f1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/name/index.html
+++ /dev/null
@@ -1,223 +0,0 @@
----
-title: Function.name
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/name
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/name
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong><em>function</em>.name</strong></code> retorna el nombre de la función o retorna <code>"anonymous"</code> por funciones creadas anónimamente.</p>
-
-<div>{{js_property_attributes(0,0,1)}}</div>
-
-<div>Nótese que en implementaciones no estándar previas a ES2015 el atributo <code>configurable</code> también era <code>false</code>.</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Nombre_de_una_declaración_de_función">Nombre de una declaración de función</h3>
-
-<p>La propiedad <code>name</code> retorna el nombre de una declaración de función.</p>
-
-<pre class="brush: js">function doSomething() {}
-
-console.log(doSomething.name); // imprime en pantalla "doSomething"
-</pre>
-
-<h3 id="Nombre_de_constructor_de_función">Nombre de constructor de función</h3>
-
-<p>Las funciones creadas con la sintaxis <code>new Function(...)</code> o simplemente <code>Function(...)</code> tienen como propiedad <code>name</code> una cadena vacía. En los ejemplos a continuación se crean funciones anónimas, tales que su <code>name</code> retorna una cadena vacía:</p>
-
-<pre class="brush: js">var f = function() {};
-var object = {
-  someMethod: function() {}
-};
-
-console.log(f.name == ''); // true
-console.log(object.someMethod.name == ''); // también true
-</pre>
-
-<h3 id="Nombres_de_función_inferidos">Nombres de función inferidos</h3>
-
-<p>Los navegadores que implementan funciones ES2015 pueden inferir el nombre de una función anónima de su posición sintáctica. Por ejemplo:</p>
-
-<pre class="brush: js">var f = function() {};
-console.log(f.name); // "f"</pre>
-
-<p>Se puede definir una función con un nombre en un {{jsxref("Operators/Function", "function expression", "", 1)}}:</p>
-
-<pre class="brush: js">var object = {
-  someMethod: function object_someMethod() {}
-};
-console.log(object.someMethod.name); // imprime "object_someMethod"
-
-try { object_someMethod } catch(e) { console.log(e); }
-// ReferenceError: object_someMethod is not defined
-</pre>
-
-<p>No se puede cambiar el nombre de una función, esta propiedad es de solo lectura:</p>
-
-<pre class="brush: js">var object = {
-  // anonymous
-  someMethod: function() {}
-};
-
-object.someMethod.name = 'someMethod';
-console.log(object.someMethod.name); // cadena vacía, someMethod es anónimo
-</pre>
-
-<p>Sin embargo, se puede usar {{jsxref("Object.defineProperty()")}} para cambiarlo.</p>
-
-<h3 id="Nombres_de_métodos">Nombres de métodos</h3>
-
-<pre class="brush: js">var o = {
-  foo(){}
-};
-o.foo.name; // "foo";</pre>
-
-<h3 id="Nombres_de_funciones_atadas_(creadas_con_.bind())">Nombres de funciones atadas (creadas con .bind())</h3>
-
-<p>{{jsxref("Function.bind()")}} produce una función cuyo nombre es igual a "bound " seguido del nombre de la función original.</p>
-
-<pre class="brush: js">function foo() {};
-foo.bind({}).name; // "bound foo"</pre>
-
-<h3 id="Nombres_de_funciones_getters_y_setters">Nombres de funciones getters y setters</h3>
-
-<p>Cuando se usan <code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">get</a></code> y <code><a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">set</a>, </code>"get" y "set" aparecerán en el nombre de la función.</p>
-
-<pre class="brush: js">var o = {
-  get foo(){},
-  set foo(x){}
-};
-
-var descriptor = Object.getOwnPropertyDescriptor(o, "foo");
-descriptor.get.name; // "get foo"
-descriptor.set.name; // "set foo";</pre>
-
-<h2 id="Ejemplos_2">Ejemplos</h2>
-
-<p>Se puede usar <code>obj.constructor.name</code> para saber cuál es la "clase" de un objeto:</p>
-
-<pre class="brush: js">function a() {}
-
-var b = new a();
-
-console.log(b.constructor.name); // imprime "a"
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Para versiones de IE &lt; 9, se puede usar <code>fn._name()</code> en su lugar. Para IE9 o posteriores se puede usar el siguiente <a href="https://github.com/JamesMGreene/Function.name">polyfill</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-name', 'name')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-name', 'name')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome(33.0)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Configurable: true</td>
-   <td>{{CompatChrome(43.0)}}</td>
-   <td>{{CompatGeckoDesktop(38)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Nombres inferidos en funciones anónimas</td>
-   <td>{{CompatChrome(51.0)}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Configurable: true</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile(38)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Nombres inferidos en funciones anónimas</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(51.0)}}</td>
-   <td>{{CompatNo}} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(51.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] See {{bug(883377)}}.</p>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/function/prototype/index.html
deleted file mode 100644
index 9d8671c534..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/prototype/index.html
+++ /dev/null
@@ -1,65 +0,0 @@
----
-title: Function.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/prototype
-tags:
-  - Function
-  - JavaScript
-  - Property
-translation_of: Web/JavaScript/Reference/Global_Objects/Function
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Function/prototype
----
-<div>{{JSRef("Objetos_globales", "Function")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Un valor desde cuyas instancias de una clase particular son creados. Cada objeto que puede ser creado por la invocación a la función constructora posee una propiedad prototype asociada.</p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Puede añadir propiedades o métodos a una clase existente mediante la adición de ellos al prototipo asociado con la función constructora para esa clase.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("Function.arguments")}} {{Deprecated_inline}}</dt>
- <dd>Una matriz correspondiente a los argumentos pasados a una función. Como propiedad de una <code>Function</code>, este uso está obsoleto. Se recomenda el uso del objeto {{jsxref("Functiones/arguments", "arguments")}}.</dd>
- <dt>{{jsxref("Function.arity")}} {{obsolete_inline}}</dt>
- <dd>Especifica el número de argumentos que espera la función. Se recomienda, no obstante, utilizar la función {{jsxref("Function.length", "length")}}.</dd>
- <dt>{{jsxref("Function.caller")}}</dt>
- <dd>Especifica la función que invoca la ejecución de la función actual (no estándar).</dd>
- <dt>{{jsxref("Function.constructor")}}</dt>
- <dd>Especifica la función que crea un prototipo de objeto.</dd>
- <dt>{{jsxref("Function.length")}}</dt>
- <dd>Specifica el número de argumentos esperados por la función.</dd>
- <dt>{{jsxref("Function.name")}}</dt>
- <dd>El nombre de la función (no forma parte del estándar).</dd>
- <dt>{{jsxref("Function.prototype")}}</dt>
- <dd>Permite añadir propiedades a los objetos función (ambos, los construidos usando <code>Function</code> y los declarados usando una declaración de función o una expresión de función).</dd>
-</dl>
-
-<div>{{ jsOverrides("Object", "properties", "arguments", "arity", "caller", "constructor", "length", "name", "displayName") }}</div>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Function.prototype.apply()")}}</dt>
- <dd>Le permite aplicar el método de otro objeto en el contexto de un objeto diferente (el objeto llamado).</dd>
- <dt>{{jsxref("Function.prototype.call()")}}</dt>
- <dd>Le Permite llamar (ejecutar) a un método de otro objeto en el contexto de un objeto diferente (el objeto que llama).</dd>
- <dt>{{jsxref("Function.prototype.toSource()")}}</dt>
- <dd>Devuelve una cadena que representa el código fuente de la función. Anula al método {{jsxref("Object.toSource")}}.</dd>
- <dt>{{jsxref("Function.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el código fuente de la función. Anula al método {{jsxref("Object.toSource")}}.</dd>
-</dl>
-
-<div>{{ jsOverrides("Object", "methods", "apply", "call", "toSource", "toString") }}</div>
-
-<dl>
- <dt> </dt>
-</dl>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Objetos_globales/Function", "Function")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/tosource/index.html b/files/es/web/javascript/referencia/objetos_globales/function/tosource/index.html
deleted file mode 100644
index 3cee3c1d4c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/tosource/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: Function.prototype.toSource()
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/toSource
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/toSource
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>El método <code><strong>toSource()</strong></code> devuelve un string representando el código fuente del objeto.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>function</var>.toSource();
-Function.toSource();
-</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Ninguno.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>toSource</code> devuelve los siguientes valores:</p>
-
-<ul>
- <li>For the built-in {{jsxref("Function")}} object, <code>toSource()</code> devuelve la siguiente cadena indicando que el código fuente no está disponible:
-
-  <pre class="brush: js">function Function() {
-    [native code]
-}
-</pre>
- </li>
- <li>En funciones personalizadas, <code>toSource()</code> devuelve el código JavaScript que define el objeto como un string.</li>
-</ul>
-
-<p>Éste método es usado de forma interna por JavaScript y no explicitamente desde el código. Puedes usar <code>toSource</code> mientras depuras para examinar el contenido de un objeto.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No está reflejado en ningún estándar. Implementaso en JavaScript 1.3.</p>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toSource()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/function/tostring/index.html b/files/es/web/javascript/referencia/objetos_globales/function/tostring/index.html
deleted file mode 100644
index b5ee70147e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/function/tostring/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: Function.prototype.toString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Function/toString
-translation_of: Web/JavaScript/Reference/Global_Objects/Function/toString
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>toString()</strong></code> retorna una cadena representando el código fuente de la función.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>function</var>.toString(indentation)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>indentation</code> {{non-standard_inline}} {{obsolete_inline(17)}}</dt>
- <dd>La cantidad de espacios a indentar en la representación de cadena del código fuente. Si <code>indentation</code> es menor o igual a <code>-1</code>, la mayoría de los espacios innecesarios son eliminados.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El objeto {{jsxref("Function")}} reconduce el método {{jsxref("Object.prototype.toString", "toString")}} heredado de  {{jsxref("Object")}}; no hereda {{jsxref("Object.prototype.toString")}}. Para objetos {{jsxref("Function")}}, el método <code>toString</code> retorna una representación de cadena del objeto en forma de declaración de función. Esto es, <code>toString</code> descompila la función y la cadena retornada incluye la palabra clave <code>function</code>, la lista de argumentos, llaves y el código fuente del cuerpo de la función.</p>
-
-<p>JavaScript llama al método <code>toString</code> automáticamente cuando una {{jsxref("Function")}} va a ser representada como un valor de texto, p.e. cuando una función es concatenada con un valor de cadena (string).</p>
-
-<p>El método <code>toString()</code> producirá una excepción {{jsxref("TypeError")}} ("Function.prototype.toString called on incompatible object"), si el valor de su objeto <code>this</code> no es un objeto <code>Function</code>. Esto también ocurrirá para objetos {{jsxref("Proxy")}}, por ejemplo:</p>
-
-<pre class="brush: js example-bad">Function.prototype.toString.call("foo"); // TypeError
-
-var proxy = new Proxy(function() {}, {});
-Function.prototype.toString.call(proxy); // TypeError
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.3.4.2', 'Function.prototype.toString')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Añadidos requerimientos más específicos para la representación de cadena.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-function.prototype.tostring', 'Function.prototype.toString')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h2>
-
-<ul>
- <li>Desde Gecko 17.0 {{geckoRelease("17")}}, <code>Function.prototype.toString()</code> fue implementada salvando el código fuente de la función. El descompilador fue eliminado, de modo que el parámetro <code>indentation</code> ya no se necesita más. Ver {{bug("761723")}} para más detalles.</li>
- <li>A partir de Gecko 38 {{geckoRelease("38")}}, <code>Function.prototype.toString()</code> produce error para objetos {{jsxref("Proxy")}}  ({{bug(1100936)}}).</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/generador/index.html b/files/es/web/javascript/referencia/objetos_globales/generador/index.html
deleted file mode 100644
index ec92ca413f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/generador/index.html
+++ /dev/null
@@ -1,228 +0,0 @@
----
-title: Generador
-slug: Web/JavaScript/Referencia/Objetos_globales/Generador
-tags:
-  - ECMAScript2015
-  - ECMAScript6
-  - Generador
-  - Generador Legado
-  - Iterador Legado
-  - JavaScript
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Generator
----
-<div>{{JSRef}}</div>
-
-<div></div>
-
-<p>El objeto <code>Generator</code> es retornado por una {{jsxref("Statements/function*", "función generator", "", 1)}} y es conformado tanto el protocolo iterable como el protocolo iterador.</p>
-
-<h2 id="Constructor">Constructor</h2>
-
-<p>Este objeto no puede ser instanciado directamente. En su lugar, una instancia del objeto <code>Generator</code> puede ser devuelta por una <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/function*">función generator</a>:</p>
-
-<pre class="syntaxbox notranslate">	function* gen() {
-	  yield 1;
-	  yield 2;
-	  yield 3;
-	}
-
-	var g = gen(); // "Generator { }"</pre>
-
-<dl>
-</dl>
-
-<h2 id="Métodos_de_instanciación">Métodos de instanciación</h2>
-
-<p><em>Tambien hereda propiedades de {{JSxRef("Iterator")}}</em></p>
-
-<dl>
- <dt>{{jsxref("Generator.prototype.next()")}}</dt>
- <dd>Retorna el valor ofecido por la expresión {{jsxref("Operators/yield", "yield")}}</dd>
- <dt>{{jsxref("Generator.prototype.return()")}}</dt>
- <dd>Retorna el valor dado y finaliza el generador.</dd>
- <dt>{{jsxref("Generator.prototype.throw()")}}</dt>
- <dd>Lanza un error al generador (también finaliza el generador, a menos que sea atrapado desde ese generador)</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<p><em>Tambien hereda propiedades de {{JSxRef("Iterator")}}</em></p>
-
-<dl>
- <dt><code>Generator.prototype.constructor</code></dt>
- <dd>Especifica la funciòn que construye el prototipo del objeto.</dd>
-</dl>
-
-<dl>
- <dt><code>Generator.prototype[@@toStringTag]</code></dt>
- <dd>La cuerda <code>"Generator"</code>.</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Un_iterador_infinito">Un iterador infinito</h3>
-
-<pre class="brush: js notranslate">	function* idMaker() {
-	    var index = 0;
-	    while(true)
-	        yield index++;
-	}
-
-	var gen = idMaker(); // "Generator { }"
-
-	console.log(gen.next().value); // 0
-	console.log(gen.next().value); // 1
-	console.log(gen.next().value); // 2
-	// ...</pre>
-
-<h2 id="Objetos_generadores_legados">Objetos generadores legados</h2>
-
-<p>Firefox(SpderMonkey) tambén implementa una versón mas temprana de generadores en JavaScript 1.7, donde el asterisco (*) en la declaración de la funcion no era necesario(sólo use la palabra reservada yield en el cuerpo de la función). Sin embargo, los generadores legados se encuentran depreciados. No los use. Serán removidos ({{bug(1083482)}}).</p>
-
-<h3 id="Métodos_de_generadores_legados">Métodos de generadores legados</h3>
-
-<dl>
- <dt><code>Generator.prototype.next() </code>{{non-standard_inline}}</dt>
- <dt></dt>
- <dt>Retorna el valor ofrecido por la expresión {{jsxref("Operators/yield", "yield")}}.  Esto se corresponde con el método next() en el objeto generador de ES2015.</dt>
- <dt></dt>
- <dt><code>Generator.prototype.close()</code> {{non-standard_inline}}</dt>
- <dd><br>
- Cierra el generador. Sí el método next() es llamado por la expresión {{jsxref("StopIteration")}}, un error será lanzado. Esto se corresponde con el método return() del objeto generador de ES2015.</dd>
- <dt><code>Generator.prototype.send()</code> {{non-standard_inline}}</dt>
- <dd>Utilizado para enviar un valor al generador. El valor es retornado por la expresion {{jsxref("Operators/yield", "yield")}}, y retorna el valor ofrecido por la siguiente expresion {{jsxref("Operators/yield", "yield")}}. <code>send(x)</code> Se corresponde a <code>next(x)</code> en el objeto generador de ECMAScript 2015.</dd>
- <dt><strong><code>Generator.</code></strong><code>prototype.</code> <strong><code>throw()</code> </strong> {{non-standard_inline}}</dt>
- <dd>Lanza un error al generador. Esto se corresponde con el metodo throw() en el objeto genererador de ES2015.</dd>
-</dl>
-
-<h3 id="Ejemplo_de_generador_legado">Ejemplo de generador legado</h3>
-
-<pre class="brush: js notranslate">	function fibonacci() {
-	  var a = yield 1;
-	  yield a * 2;
-	}
-
-	var it = fibonacci();
-	console.log(it);          // "Generator {  }"
-	console.log(it.next());   // 1
-	console.log(it.send(10)); // 20
-	console.log(it.close());  // undefined
-	console.log(it.next());   // throws StopIteration (as the generator is now closed)
-	</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-generator-objects', 'Generator objects')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-generator-objects', 'Generator objects')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td></td>
-   <td></td>
-   <td></td>
-  </tr>
-  <tr>
-   <td></td>
-   <td></td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{CompatChrome(39.0)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(39.0)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(39.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"></h2>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<h3 id="Generadores_Legados">Generadores Legados</h3>
-
-<ul>
- <li>{{jsxref("Statements/Legacy_generator_function", "The legacy generator function", "", 1)}}</li>
- <li>{{jsxref("Operators/Legacy_generator_function", "The legacy generator function expression", "", 1)}}</li>
- <li>{{jsxref("StopIteration")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features/The_legacy_Iterator_protocol">The legacy Iterator protocol</a></li>
-</ul>
-
-<h3 id="Generadores_ES2015">Generadores ES2015</h3>
-
-<ul>
- <li>{{jsxref("Functions", "Functions", "", 1)}}</li>
- <li>{{jsxref("Statements/function", "function")}}</li>
- <li>{{jsxref("Operators/function", "function expression")}}</li>
- <li>{{jsxref("Function")}}</li>
- <li>{{jsxref("Statements/function*", "function*")}}</li>
- <li>{{jsxref("Operators/function*", "function* expression")}}</li>
- <li>{{jsxref("GeneratorFunction")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">The Iterator protocol</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/generador/next/index.html b/files/es/web/javascript/referencia/objetos_globales/generador/next/index.html
deleted file mode 100644
index 6b6bf61cbe..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/generador/next/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: Generator.prototype.next()
-slug: Web/JavaScript/Referencia/Objetos_globales/Generador/next
-translation_of: Web/JavaScript/Reference/Global_Objects/Generator/next
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>next</strong></code><strong><code>()</code></strong> regresa un objeto con las propiedades <code>done</code> y <code>value</code>. También puedes pasar un parámetro al método <code>next</code> para enviar un valor al generador.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>gen</var>.next(valor)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor</code></dt>
- <dd>El valor a enviar al generador.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un {{jsxref("Object")}} con dos propiedades:</p>
-
-<ul>
- <li><code>done</code> (booleano)
-
-  <ul>
-   <li>Es <code>verdadero</code> si el iterador ya llegó al final de la secuencia. En este caso <code>valor</code> define opcionalmente el <em>valor de retorno</em> del iterador.</li>
-   <li>Es <code>falso</code> si el iterador puede dar un siguiente valor en la secuencia. Es equivalente a no definir la propiedad <code>done</code>.</li>
-  </ul>
- </li>
- <li><code>value</code> - cualquier valor Javascript regresado por el iterador. Éste puede ser omitido si <code>done</code> is <code>verdadero</code>.</li>
-</ul>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_next()">Using <code>next()</code></h3>
-
-<p>The following example shows a simple generator and the object that the <code>next</code> method returns:</p>
-
-<pre class="brush: js">function* gen() {
-  yield 1;
-  yield 2;
-  yield 3;
-}
-
-var g = gen(); // "Generator { }"
-g.next();      // "Object { value: 1, done: false }"
-g.next();      // "Object { value: 2, done: false }"
-g.next();      // "Object { value: 3, done: false }"
-g.next();      // "Object { value: undefined, done: true }"
-</pre>
-
-<h3 id="Sending_values_to_the_generator">Sending values to the generator</h3>
-
-<p>In this example, <code>next</code> is called with a value. Note that the first call did not log anything, because the generator was not yielding anything initially.</p>
-
-<pre class="brush: js">function* gen() {
-  while(true) {
-    var value = yield null;
-    console.log(value);
-  }
-}
-
-var g = gen();
-g.next(1);
-// "{ value: null, done: false }"
-g.next(2);
-// 2
-// "{ value: null, done: false }"
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-generator.prototype.next', 'Generator.prototype.next')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-generator.prototype.next', 'Generator.prototype.next')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Generator.next")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">function*</a></code></li>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iterators and generators</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/generador/return/index.html b/files/es/web/javascript/referencia/objetos_globales/generador/return/index.html
deleted file mode 100644
index 649d5b8dec..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/generador/return/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: Generator.prototype.return()
-slug: Web/JavaScript/Referencia/Objetos_globales/Generador/return
-tags:
-  - ECMAScript 2015
-  - Generador
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Generator/return
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>return()</strong></code> regresa el valor dado y finaliza al generador.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>gen</var>.return(valor)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor</code></dt>
- <dd>El valor a regresar.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El valor dado como argumento.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_return()">Utilizando <code>return()</code></h3>
-
-<p>El siguiente ejemplo muestra un generador simple y su método <code>return</code>.</p>
-
-<pre class="brush: js">function* gen() {
-  yield 1;
-  yield 2;
-  yield 3;
-}
-
-var g = gen();
-
-g.next();        // { value: 1, done: false }
-g.return('foo'); // { value: "foo", done: true }
-g.next();        // { value: undefined, done: true }
-</pre>
-
-<p>Si <code>return(valor)</code> es invocado en un generador que ya está en su estado "completado", el generador permanecerá en estado "completado". Si no se da ningún argumento, el objeto regresado es el mismo a que si se invocara <code>.next()</code>. Si se da un argumento, éste se asignará como valor en la propiedad <code>value</code> del objeto regresado.</p>
-
-<pre class="brush: js">function* gen() {
-  yield 1;
-  yield 2;
-  yield 3;
-}
-
-var g = gen();
-g.next(); // { value: 1, done: false }
-g.next(); // { value: 2, done: false }
-g.next(); // { value: 3, done: false }
-g.next(); // { value: undefined, done: true }
-g.return(); // { value: undefined, done: true }
-g.return(1); // { value: 1, done: true }
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-generator.prototype.return', 'Generator.prototype.return')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-generator.prototype.return', 'Generator.prototype.return')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quieres contribuir a estos datos, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y manda un pull request.</div>
-
-<p>{{Compat("javascript.builtins.Generator.return")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/function*","function*")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/generador/throw/index.html b/files/es/web/javascript/referencia/objetos_globales/generador/throw/index.html
deleted file mode 100644
index 9f4cd76fbe..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/generador/throw/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: Generator.prototype.throw()
-slug: Web/JavaScript/Referencia/Objetos_globales/Generador/throw
-translation_of: Web/JavaScript/Reference/Global_Objects/Generator/throw
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>throw()</strong></code> reanuda la ejecución de un generador al lanzar un error en éste y regresar un objeto con las dos propiedades <code>done</code> y <code>value</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>gen</var>.throw(excepción)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>excepción</code></dt>
- <dd>La excepción a lanzar. Al hacer depuración, es útil que la excepción cumpla con <code>instanceof</code> {{jsxref("Error")}}.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un {{jsxref("Object")}} con dos propiedades:</p>
-
-<ul>
- <li><code>done</code> (booleano)
-
-  <ul>
-   <li>Es <code>verdadero</code> si el iterador ya llegó al final de la secuencia. En este caso <code>valor</code> define opcionalmente el <em>valor de retorno</em> del iterador.</li>
-   <li>Es <code>falso</code> si el iterador puede dar un siguiente valor en la secuencia. Es equivalente a no definir la propiedad <code>done</code>.</li>
-  </ul>
- </li>
- <li><code>value</code> - cualquier valor Javascript regresado por el iterador. Éste puede ser omitido si <code>done</code> is <code>verdadero</code>.</li>
-</ul>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_throw()">Using <code>throw()</code></h3>
-
-<p>The following example shows a simple generator and an error that is thrown using the <code>throw</code> method. An error can be caught by a <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/try...catch">try...catch</a></code> block as usual.</p>
-
-<pre class="brush: js">function* gen() {
-  while(true) {
-    try {
-       yield 42;
-    } catch(e) {
-      console.log('Error caught!');
-    }
-  }
-}
-
-var g = gen();
-g.next();
-// { value: 42, done: false }
-g.throw(new Error('Something went wrong'));
-// "Error caught!"
-// { value: 42, done: false }
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-generator.prototype.throw', 'Generator.prototype.throw')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Generator.throw")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function*">function*</a></code></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/index.html b/files/es/web/javascript/referencia/objetos_globales/index.html
deleted file mode 100644
index 9946b3f648..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/index.html
+++ /dev/null
@@ -1,203 +0,0 @@
----
-title: Objetos globales
-slug: Web/JavaScript/Referencia/Objetos_globales
-tags:
-  - JavaScript
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<p>Este capítulo documenta todo acerca de estándares de Javascript, los objetos integrados en  JavaScript, así como los métodos y propiedades de cada uno.</p>
-
-<p>El término "objetos globales" (u objetos incorporados estándar) aquí no debe confundirse con el <strong>objeto global</strong>. Aquí, los objetos globales se refieren a <strong>objetos en el ámbito global</strong>. Se puede acceder al <strong>objeto global</strong> en sí usando el operador {{jsxref("Operadores/this", "this")}} en el ámbito global (pero solo si no se usa el modo estricto ECMAScript 5, en ese caso devuelve {{jsxref("undefined")}}). De hecho, el alcance global consiste en las propiedades del objeto global, incluidas las propiedades heredadas, si las hay.</p>
-
-<p>Otros objetos en el alcance global son <a href="/es/docs/Web/JavaScript/Guide/Working_with_Objects#Creating_new_objects">creados por el script de usuario</a> o son proporcionados por la aplicación host. Los objetos host disponibles en los contextos del navegador están documentados en la <span style="line-height: 1.5;"><a href="/es/docs/Web/API/Reference">referencia de la API</a></span>. Para obtener más información acerca de la distinción entre <span style="line-height: 1.5;">el <a href="/es/docs/DOM/DOM_Reference">DOM</a> y el núcleo de <a href="/es/docs/Web/JavaScript">JavaScript</a></span>, <span style="line-height: 1.5;">vea <a href="/es/docs/Web/JavaScript/JavaScript_technologies_overview">Introducción a las tecnologías JavaScript</a>.</span></p>
-
-<h2 id="Objetos_estándar_por_categoría">Objetos estándar por categoría</h2>
-
-<h3 id="Propiedades_de_valor">Propiedades de valor</h3>
-
-<p>Estas propiedades globales devuelven un valor simple; ellos no tienen propiedades o métodos.</p>
-
-<ul>
- <li>{{jsxref("Infinity")}}</li>
- <li>{{jsxref("NaN")}}</li>
- <li>{{jsxref("undefined")}}</li>
- <li>{{jsxref("null")}} literal</li>
- <li>{{JSxRef("globalThis")}}</li>
-</ul>
-
-<h3 id="Propiedades_de_funciones">Propiedades de funciones</h3>
-
-<p>Estas funciones globales -funciones llamadas globalmente en lugar de un objeto- devuelven directamente sus resultados a la persona que llama.</p>
-
-<ul>
- <li>{{jsxref("Objetos_globales/eval", "eval()")}}</li>
- <li>{{jsxref("Objetos_globales/uneval", "uneval()")}} {{non-standard_inline}}</li>
- <li>{{jsxref("Objetos_globales/isFinite", "isFinite()")}}</li>
- <li>{{jsxref("Objetos_globales/isNaN", "isNaN()")}}</li>
- <li>{{jsxref("Objetos_globales/parseFloat", "parseFloat()")}}</li>
- <li>{{jsxref("Objetos_globales/parseInt", "parseInt()")}}</li>
- <li>{{jsxref("Objetos_globales/decodeURI", "decodeURI()")}}</li>
- <li>{{jsxref("Objetos_globales/decodeURIComponent", "decodeURIComponent()")}}</li>
- <li>{{jsxref("Objetos_globales/encodeURI", "encodeURI()")}}</li>
- <li>{{jsxref("Objetos_globales/encodeURIComponent", "encodeURIComponent()")}}</li>
- <li>{{jsxref("Objetos_globales/escape", "escape()")}} {{deprecated_inline}}</li>
- <li>{{jsxref("Objetos_globales/unescape", "unescape()")}} {{deprecated_inline}}</li>
-</ul>
-
-<h3 id="Objetos_fundamentales">Objetos fundamentales</h3>
-
-<p>Estos son los objetos fundamentales y básicos sobre los que se basan todos los demás objetos. Esto incluye objetos que representan objetos generales, funciones y errores.</p>
-
-<ul>
- <li>{{jsxref("Object")}}</li>
- <li>{{jsxref("Function")}}</li>
- <li>{{jsxref("Boolean")}}</li>
- <li>{{jsxref("Symbol")}}</li>
- <li>{{jsxref("Error")}}</li>
- <li>{{jsxref("EvalError")}}</li>
- <li>{{jsxref("InternalError")}}</li>
- <li>{{jsxref("RangeError")}}</li>
- <li>{{jsxref("ReferenceError")}}</li>
- <li>{{jsxref("SyntaxError")}}</li>
- <li>{{jsxref("TypeError")}}</li>
- <li>{{jsxref("URIError")}}</li>
-</ul>
-
-<h3 id="Números_y_fechas">Números y fechas</h3>
-
-<p>Estos son los objetos base que representan números, fechas y cálculos matemáticos.</p>
-
-<ul>
- <li>{{jsxref("Number")}}</li>
- <li>{{JSxRef("BigInt")}}</li>
- <li>{{jsxref("Math")}}</li>
- <li>{{jsxref("Date")}}</li>
-</ul>
-
-<h3 id="Procesamiento_de_texto">Procesamiento de texto</h3>
-
-<p>Estos objetos representan cadenas y soporte para manipularlos.</p>
-
-<ul>
- <li>{{jsxref("String")}}</li>
- <li>{{jsxref("RegExp")}}</li>
-</ul>
-
-<h3 id="Colecciones_indexadas">Colecciones indexadas</h3>
-
-<p>Estos objetos representan colecciones de datos que están ordenadas por un valor de índice. Esto incluye matrices (tipadas) y construcciones tipo array.</p>
-
-<ul>
- <li>{{jsxref("Array")}}</li>
- <li>{{jsxref("Int8Array")}}</li>
- <li>{{jsxref("Uint8Array")}}</li>
- <li>{{jsxref("Uint8ClampedArray")}}</li>
- <li>{{jsxref("Int16Array")}}</li>
- <li>{{jsxref("Uint16Array")}}</li>
- <li>{{jsxref("Int32Array")}}</li>
- <li>{{jsxref("Uint32Array")}}</li>
- <li>{{jsxref("Float32Array")}}</li>
- <li>{{jsxref("Float64Array")}}</li>
- <li>{{JSxRef("BigInt64Array")}}</li>
- <li>{{JSxRef("BigUint64Array")}}</li>
-</ul>
-
-<h3 id="Colecciones_con_clave">Colecciones con clave</h3>
-
-<p>Estos objetos representan colecciones que usan claves; estos contienen elementos que son iterables en el orden de inserción.</p>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("WeakMap")}}</li>
- <li>{{jsxref("WeakSet")}}</li>
-</ul>
-
-<h3 id="Colecciones_de_vectores">Colecciones de vectores</h3>
-
-<p>Los tipos de datos vectoriales {{Glossary("SIMD")}} son objetos donde los datos se organizan en carriles.</p>
-
-<ul>
- <li>{{jsxref("SIMD")}} {{experimental_inline}}</li>
- <li>{{jsxref("Float32x4", "SIMD.Float32x4")}} {{experimental_inline}}</li>
- <li>{{jsxref("Float64x2", "SIMD.Float64x2")}} {{experimental_inline}}</li>
- <li>{{jsxref("Int8x16", "SIMD.Int8x16")}} {{experimental_inline}}</li>
- <li>{{jsxref("Int16x8", "SIMD.Int16x8")}} {{experimental_inline}}</li>
- <li>{{jsxref("Int32x4", "SIMD.Int32x4")}} {{experimental_inline}}</li>
- <li>{{jsxref("Uint8x16", "SIMD.Uint8x16")}} {{experimental_inline}}</li>
- <li>{{jsxref("Uint16x8", "SIMD.Uint16x8")}} {{experimental_inline}}</li>
- <li>{{jsxref("Uint32x4", "SIMD.Uint32x4")}} {{experimental_inline}}</li>
- <li>{{jsxref("Bool8x16", "SIMD.Bool8x16")}} {{experimental_inline}}</li>
- <li>{{jsxref("Bool16x8", "SIMD.Bool16x8")}} {{experimental_inline}}</li>
- <li>{{jsxref("Bool32x4", "SIMD.Bool32x4")}} {{experimental_inline}}</li>
- <li>{{jsxref("Bool64x2", "SIMD.Bool64x2")}} {{experimental_inline}}</li>
-</ul>
-
-<h3 id="Datos_estructurados">Datos estructurados</h3>
-
-<p>Estos objetos representan e interactúan con los búferes de datos estructurados y los datos codificados utilizando la notación de objetos JavaScript (JSON del inglés <strong>J</strong>ava<strong>S</strong>cript <strong>O</strong>bject <strong>N</strong>otation).</p>
-
-<ul>
- <li>{{jsxref("ArrayBuffer")}}</li>
- <li>{{jsxref("SharedArrayBuffer")}} {{experimental_inline}}</li>
- <li>{{jsxref("Atomics")}} {{experimental_inline}}</li>
- <li>{{jsxref("DataView")}}</li>
- <li>{{jsxref("JSON")}}</li>
-</ul>
-
-<h3 id="Objetos_de_abstracción_de_control">Objetos de abstracción de control</h3>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
- <li>{{jsxref("Generator")}}</li>
- <li>{{jsxref("GeneratorFunction")}}</li>
- <li>{{experimental_inline}} {{jsxref("AsyncFunction")}}</li>
-</ul>
-
-<h3 id="Reflexión">Reflexión</h3>
-
-<ul>
- <li>{{jsxref("Reflect")}}</li>
- <li>{{jsxref("Proxy")}}</li>
-</ul>
-
-<h3 id="Internacionalización">Internacionalización</h3>
-
-<p>Adiciones al núcleo de ECMAScript para funcionalidades sensibles al lenguaje.</p>
-
-<ul>
- <li>{{jsxref("Intl")}}</li>
- <li>{{jsxref("Objetos_globales/Collator", "Intl.Collator")}}</li>
- <li>{{jsxref("Objetos_globales/DateTimeFormat", "Intl.DateTimeFormat")}}</li>
- <li>{{jsxref("Objetos_globales/NumberFormat", "Intl.NumberFormat")}}</li>
-</ul>
-
-<h3 id="WebAssembly">WebAssembly</h3>
-
-<ul>
- <li>{{jsxref("WebAssembly")}}</li>
- <li>{{jsxref("WebAssembly.Module")}}</li>
- <li>{{jsxref("WebAssembly.Instance")}}</li>
- <li>{{jsxref("WebAssembly.Memory")}}</li>
- <li>{{jsxref("WebAssembly.Table")}}</li>
- <li>{{jsxref("WebAssembly.CompileError")}}</li>
- <li>{{jsxref("WebAssembly.LinkError")}}</li>
- <li>{{jsxref("WebAssembly.RuntimeError")}}</li>
-</ul>
-
-<h3 id="Otro">Otro</h3>
-
-<ul>
- <li>
-  <article>
-  <p>{{JSxRef("Functions/arguments", "arguments")}}</p>
-  </article>
-
-  <article>
-  <header></header>
-  </article>
- </li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/infinity/index.html b/files/es/web/javascript/referencia/objetos_globales/infinity/index.html
deleted file mode 100644
index 2a0a716eeb..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/infinity/index.html
+++ /dev/null
@@ -1,96 +0,0 @@
----
-title: Infinity
-slug: Web/JavaScript/Referencia/Objetos_globales/Infinity
-tags:
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Global_Objects/Infinity
----
-<div>
- {{jsSidebar("Objects")}}</div>
-<h2 id="Resumen">Resumen</h2>
-<p>La propiedad global <strong><code>Infinity </code></strong>es un valor numérico que representa el infinito.</p>
-<p>{{js_property_attributes(0,0,0)}}</p>
-<h2 id="Sintaxis">Sintaxis</h2>
-<pre class="brush: js">Infinity</pre>
-<h2 id="Description" name="Description" style="padding-top: 0px; padding-left: 0px; border: 0px; line-height: 24px;">Description</h2>
-<p><code>Infinity </code>es una del objeto global, es decir, esta es una variable de alcance global.</p>
-<p>El valor inicial de <code>Infinity</code> es {{jsxref("Number.POSITIVE_INFINITY")}}. El valor de <code>Infinity</code> (infinito positivo) es mayor que cualquier otro numero incluido el mismo. Este valor se comporta matematicamente como el infinito matemático; por ejemplo, cualquier numero multiplicado por <code>Infinity</code> da como resultado <code>Infinity</code>, y cualquier numero divido por <code>Infinity</code> da como resultado cero.</p>
-<p>Para la especificación ECMAScript 5, <code>Infinity </code>es de solo lectura (implementado en JavaScript 1.8.5  / Firefox 4).</p>
-<h2 id="Especificaciones">Especificaciones</h2>
-<table class="standard-table" style="">
- <tbody>
-  <tr>
-   <th scope="col" style="font-style: inherit;">Especificación</th>
-   <th scope="col" style="font-style: inherit;">Estado</th>
-   <th scope="col" style="font-style: inherit;">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1ra edición.</td>
-   <td>Estándar</td>
-   <td>Definición inicial. Implementada en JavaScript 1.3</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.1.1.2', 'Infinity')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-value-properties-of-the-global-object-infinity', 'Infinity')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Compatibilidad_con_navegadores" style="margin-bottom: 20px; padding-top: 0px; padding-left: 0px; font-size: 28px; border: 0px; line-height: 28px;">Compatibilidad con navegadores</h2>
-<p style="padding-top: 0px; padding-left: 0px; border: 0px;">{{ CompatibilityTable() }}</p>
-<div id="compat-desktop" style="padding-top: 0px; padding-left: 0px; border: 0px;">
- <table class="compat-table" style="">
-  <tbody>
-   <tr>
-    <th style="font-style: inherit; line-height: 16px;">Característica</th>
-    <th style="font-style: inherit; line-height: 16px;">Chrome</th>
-    <th style="font-style: inherit; line-height: 16px;">Firefox (Gecko)</th>
-    <th style="font-style: inherit; line-height: 16px;">Internet Explorer</th>
-    <th style="font-style: inherit; line-height: 16px;">Opera</th>
-    <th style="font-style: inherit; line-height: 16px;">Safari</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile" style="padding-top: 0px; padding-left: 0px; border: 0px;">
- <table class="compat-table" style="">
-  <tbody>
-   <tr>
-    <th style="font-style: inherit; line-height: 16px;">Característica</th>
-    <th style="font-style: inherit; line-height: 16px;">Android</th>
-    <th style="font-style: inherit; line-height: 16px;">Chrome for Android</th>
-    <th style="font-style: inherit; line-height: 16px;">Firefox Mobile (Gecko)</th>
-    <th style="font-style: inherit; line-height: 16px;">IE Mobile</th>
-    <th style="font-style: inherit; line-height: 16px;">Opera Mobile</th>
-    <th style="font-style: inherit; line-height: 16px;">Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<h2 id="See_also" name="See_also" style="margin-bottom: 20px; padding-top: 0px; padding-left: 0px; font-size: 28px; border: 0px; line-height: 28px;">Ver también</h2>
-<ul>
- <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li>
- <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/internalerror/constructor_internalerror/index.html b/files/es/web/javascript/referencia/objetos_globales/internalerror/constructor_internalerror/index.html
deleted file mode 100644
index ba895aaff9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/internalerror/constructor_internalerror/index.html
+++ /dev/null
@@ -1,55 +0,0 @@
----
-title: Constructor InternalError()
-slug: >-
-  Web/JavaScript/Referencia/Objetos_globales/InternalError/Constructor_InternalError
-tags:
-  - Constructor
-  - JavaScript
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/InternalError/InternalError
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>El constructor <strong><code>InternalError()</code></strong> crea un error que indica un error que ocurrió internamente en el motor de JavaScript. Por ejemplo: <strong>"InternalError</strong>: demasiada recursividad".</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">new InternalError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>message</code></dt>
- <dd>Opcional. Una descripción del error legible para los humanos.</dd>
- <dt><code>fileName</code></dt>
- <dd>Opcional. El nombre del archivo que contiene el código que provocó la excepción.</dd>
- <dt><code>lineNumber</code></dt>
- <dd>Opcional. El número de línea del código que provocó la excepción.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Crear_un_nuevo_InternalError">Crear un nuevo <code>InternalError</code></h3>
-
-<pre class="brush: js notranslate">new InternalError("Fallo del motor");
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p><span class="pl-s">No forma parte de ningún estándar.</span></p>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.InternalError.InternalError")}}</p>
-</div>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Error")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/internalerror/index.html b/files/es/web/javascript/referencia/objetos_globales/internalerror/index.html
deleted file mode 100644
index e7754d1575..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/internalerror/index.html
+++ /dev/null
@@ -1,98 +0,0 @@
----
-title: InternalError
-slug: Web/JavaScript/Referencia/Objetos_globales/InternalError
-tags:
-  - Clase
-  - Class
-  - InternalError
-  - JavaScript
-  - Objeto
-translation_of: Web/JavaScript/Reference/Global_Objects/InternalError
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>El objeto <strong><code>InternalError</code></strong> indica un error que se produjo internamente en el motor JavaScript.</p>
-
-<p>Los principalmente casos de ejemplo son cuando algo es demasiado grande, por ejemplo:</p>
-
-<ul>
- <li>"demasiados casos del switch",</li>
- <li>"demasiados paréntesis en la expresión regular",</li>
- <li>"iniciador de arreglo demasiado grande",</li>
- <li>"demasiada recursividad".</li>
-</ul>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{JSxRef("Global_Objects/InternalError/InternalError", "InternalError()")}}</dt>
- <dd>Crea un nuevo objeto <code>InternalError</code>.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{jsxref("Error.prototype.message", "InternalError.prototype.message")}}</dt>
- <dd>Mensaje de error. Heredado de {{JSxRef("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.name", "InternalError.prototype.name")}}</dt>
- <dd>Nombre del error. Heredado de {{JSxRef("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.fileName", "InternalError.prototype.fileName")}}</dt>
- <dd>Ruta al archivo que generó este error. Heredado de {{JSxRef("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.lineNumber", "InternalError.prototype.lineNumber")}}</dt>
- <dd>Número de línea en el archivo que generó este error. Heredado de {{JSxRef("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.columnNumber", "InternalError.prototype.columnNumber")}}</dt>
- <dd>Número de columna en la línea que generó este error. Heredado de {{JSxRef("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.stack", "InternalError.prototype.stack")}}</dt>
- <dd>Seguimiento de la pila. Heredado de {{JSxRef("Error")}}.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Demasiada_recursividad">Demasiada recursividad</h3>
-
-<p>Esta función recursiva se ejecuta 10 veces, según la condición de salida.</p>
-
-<pre class="brush: js notranslate">function loop(x) {
-  if (x &gt;= 10) // "x &gt;= 10" es la condición de salida
-    return;
-  // hacer cosas
-  loop(x + 1); // la llamada recursiva
-}
-loop(0);</pre>
-
-<p>Establecer esta condición en un valor extremadamente alto, no funcionará:</p>
-
-<pre class="brush: js example-bad notranslate">function loop(x) {
-  if (x &gt;= 1000000000000)
-    return;
-  // hacer cosas
-  loop(x + 1);
-}
-loop(0);
-
-// InternalError: demasiada recursividad</pre>
-
-<p>Para obtener más información, consulta {{JSxRef("Errors/Too_much_recursion", "InternalError: demasiada recursividad.")}}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p><span class="pl-s">No forma parte de ningún estándar.</span></p>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.InternalError")}}</p>
-</div>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Error")}}</li>
- <li>
-  <p>{{JSxRef("Errors/Too_much_recursion", "demasiada recursividad")}}</p>
- </li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/intl/index.html b/files/es/web/javascript/referencia/objetos_globales/intl/index.html
deleted file mode 100644
index c1a2a47243..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/intl/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: Intl
-slug: Web/JavaScript/Referencia/Objetos_globales/Intl
-translation_of: Web/JavaScript/Reference/Global_Objects/Intl
----
-<div>{{JSRef}}</div>
-
-<p>El objeto de ámbito global <strong><code>Intl</code></strong> es el espacio de nombres para el API de Internacionalización de ECMAScript, éste provee comparación de cadenas y formato de números, fechas y tiempos con sensibilidad al lenguaje. Los constructores para los objetos {{jsxref("Collator")}}, {{jsxref("NumberFormat")}}, y {{jsxref("DateTimeFormat")}} son propiedades del objeto <code>Intl</code>. En ésta página se documentan tales propiedades, así como la funcionalidad común a los constructores de internacionalización y otras funciones sensibles al lenguaje.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</dt>
- <dd>Constructor para collators, objetos que permiten la comparación de cadenas con sensibilidad al lenguaje.</dd>
- <dt>{{jsxref("Global_Objects/DateTimeFormat", "Intl.DateTimeFormat")}}</dt>
- <dd>Constructor para objetos que permiten el formato de fecha y tiempos con sensibilidad al lenguaje.</dd>
- <dt>{{jsxref("Global_Objects/NumberFormat", "Intl.NumberFormat")}}</dt>
- <dd>Constructor para objetos que permiten el formato de números con sensibilidad al lenguaje.</dd>
- <dt>{{jsxref("Global_Objects/PluralRules", "Intl.PluralRules")}}</dt>
- <dd><em>Por definir</em></dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Intl.getCanonicalLocales()")}}</dt>
- <dd>Método que retorna los nombres canónicos de las diferentes variantes de lenguaje.</dd>
-</dl>
-
-<h2 id="Identificación_de_variantes_de_lenguaje_y_negociación">Identificación de variantes de lenguaje y negociación</h2>
-
-<p>Los constructores de internacionalización, así como otros metodos de constructores sensibles al lenguaje (listados bajo {{anch("See_also", "Ver más")}}) siguen un mismo patrón para identificar variantes de lenguaje y determinar aquella a utilizar: todos aceptan los argumentos <code>locales</code> y <code>options</code>, y negocian las variantes requeridas contra aquellas que soportan utilizando un algoritmo especificado en la propiedad <code>options.localeMatcher</code>.</p>
-
-<h3 id="locales"><code>locales</code></h3>
-
-<p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">El argumento </span></font>locales</code> debe ser tanto una cadena que contenga una  <a href="http://tools.ietf.org/html/rfc5646">Etiqueta de Idioma BCP 47</a>, o una matriz de etiquetas de dicho idioma. Si el argumento <code>locales</code> no es provisto o es indefinido, será usado la localicacion predeterminada.</p>
-
-<p>Una etiqueta de idioma BCP 47 define un idioma y minimamente contiene un código primario de idioma. En estos la forma mas comun puede contener, : un código de idioma, un código del sistema de escritura, y un código de país o región, todo separado por guiones. Mientras la etiqueta no es case sensitive, es recomendable usar un titulo para el código del sistema de escritura, mayúsculas para el país y región y minúsculas para todo lo demás.</p>
-
-<p>Ejemplos:</p>
-
-<ul>
- <li><code>"hi"</code>: Hindi (idioma principal).</li>
- <li><code>"de-AT"</code>: Alemán usado en Austria (idioma principal con código del país).</li>
- <li><code>"zh-Hans-CN"</code>: Escritura China en caracteres simplificados como se usa en China (idioma principal con código de escritura y código del país).</li>
-</ul>
-
-<p>Las subetiquetas que identifican idiomas, scripts, países (regiones), y (raramente utilizadas) variantes en las etiquetas de idiomas BCP 47 pueden ser encontradas en el <a href="http://www.iana.org/assignments/language-subtag-registry">Registro de subetiquetas de idioma de la IANA</a>.</p>
-
-<p>BCP 47 permite también extensiones. Las funciones de internacionalización de JavaScript utilizan la extensión <code>"u"</code> (Unicode), misma que puede emplearse para requerir personalizacioón de los objetos {{jsxref("Collator")}}, {{jsxref("NumberFormat")}}, o {{jsxref("DateTimeFormat")}}. A continuación algunos ejemplos:</p>
-
-<ul>
- <li><code>"de-DE-u-co-phonebk"</code>: Utiliza la variante de guía telefónica del orden de clasificación alemán, que expande las vocales con umlaut a pares de caracteres: ä → ae, ö → oe, ü → ue.</li>
- <li><code>"th-TH-u-nu-thai"</code>: Utiliza dígitos tailandeses (๐, ๑, ๒, ๓, ๔, ๕, ๖, ๗, ๘, ๙) para formatear números.</li>
- <li><code>"ja-JP-u-ca-japanese"</code>: Use the Japanese calendar in date and time formatting, so that 2013 is expressed as the year 25 of the Heisei period, or 平成25.</li>
- <li><code>"en-GB-u-ca-islamic"</code>: use British English with the Islamic (Hijri) calendar, where the Gregorian date 14 October, 2017 is the Hijri date 24 Muharram, 1439.</li>
-</ul>
-
-<h3 id="Locale_negotiation">Locale negotiation</h3>
-
-<p>The <code>locales</code> argument, after stripping off all Unicode extensions, is interpreted as a prioritized request from the application. The runtime compares it against the locales it has available and picks the best one available. Two matching algorithms exist: the <code>"lookup"</code> matcher follows the Lookup algorithm specified in <a href="http://tools.ietf.org/html/rfc4647#section-3.4">BCP 47</a>; the <code>"best fit"</code> matcher lets the runtime provide a locale that's at least, but possibly more, suited for the request than the result of the Lookup algorithm. If the application doesn't provide a <code>locales</code> argument, or the runtime doesn't have a locale that matches the request, then the runtime's default locale is used. The matcher can be selected using a property of the <code>options</code> argument (see below).</p>
-
-<p>If the selected language tag had a Unicode extension substring, that extension is now used to customize the constructed object or the behavior of the function. Each constructor or function supports only a subset of the keys defined for the Unicode extension, and the supported values often depend on the language tag. For example, the <code>"co"</code> key (collation) is only supported by {{jsxref("Collator")}}, and its <code>"phonebk"</code> value is only supported for German.</p>
-
-<h3 id="options_argument"><code>options</code> argument</h3>
-
-<p>The <code>options</code> argument must be an object with properties that vary between constructors and functions. If the <code>options</code> argument is not provided or is undefined, default values are used for all properties.</p>
-
-<p>One property is supported by all language sensitive constructors and functions: The <code>localeMatcher</code> property, whose value must be a string <code>"lookup"</code> or <code>"best fit"</code> and which selects one of the locale matching algorithms described above.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 1.0', '#sec-8', 'Intl')}}</td>
-   <td>{{Spec2('ES Int 1.0')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 2.0', '#sec-8', 'Intl')}}</td>
-   <td>{{Spec2('ES Int 2.0')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#intl-object', 'Intl')}}</td>
-   <td>{{Spec2('ES Int Draft')}}</td>
-   <td>Added Intl.getCanonicalLocales in the 4th edition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Intl")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>Introduction: <a href="http://norbertlindenberg.com/2012/12/ecmascript-internationalization-api/index.html">The ECMAScript Internationalization API</a></li>
- <li>Constructors
-  <ul>
-   <li>{{jsxref("Collator", "Intl.Collator")}}</li>
-   <li>{{jsxref("DateTimeFormat", "Intl.DateTimeFormat")}}</li>
-   <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li>
-  </ul>
- </li>
- <li>Methods
-  <ul>
-   <li>{{jsxref("String.prototype.localeCompare()")}}</li>
-   <li>{{jsxref("Number.prototype.toLocaleString()")}}</li>
-   <li>{{jsxref("Date.prototype.toLocaleString()")}}</li>
-   <li>{{jsxref("Date.prototype.toLocaleDateString()")}}</li>
-   <li>{{jsxref("Date.prototype.toLocaleTimeString()")}}</li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/intl/numberformat/format/index.html b/files/es/web/javascript/referencia/objetos_globales/intl/numberformat/format/index.html
deleted file mode 100644
index 713302ea3c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/intl/numberformat/format/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: Intl.NumberFormat.prototype.format()
-slug: Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat/format
-translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/format
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Intl.NumberFormat.prototype.format()</code></strong> formatea un número de acuerdo con la configuración regional y las opciones de formato de este objeto {{jsxref("NumberFormat")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/intl-numberformat-prototype-format.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code><var>numberFormat</var>.format(<var>number</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>number</code></dt>
- <dd>A {{jsxref("Number")}} or {{jsxref("BigInt")}} to format.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>The <code>format</code> getter function formats a number into a string according to the locale and formatting options of this {{jsxref("NumberFormat")}} object.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_format">Usando <code>format</code></h3>
-
-<p>Use the <code>format</code> getter function for formatting a single currency value, here for Russia:</p>
-
-<pre class="brush: js">var options = { style: 'currency', currency: 'RUB' };
-var numberFormat = new Intl.NumberFormat('ru-RU', options);
-console.log(numberFormat.format(654321.987));
-// → "654 321,99 руб."
-</pre>
-
-<h3 id="Usando_format_con_map">Usando <code>format</code> con <code>map</code></h3>
-
-<p>Use the <code>format</code> getter function for formatting all numbers in an array. Note that the function is bound to the {{jsxref("NumberFormat")}} from which it was obtained, so it can be passed directly to {{jsxref("Array.prototype.map")}}.</p>
-
-<pre class="brush: js">var a = [123456.789, 987654.321, 456789.123];
-var numberFormat = new Intl.NumberFormat('es-ES');
-var formatted = a.map(numberFormat.format);
-console.log(formatted.join('; '));
-// → "123.456,789; 987.654,321; 456.789,123"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 1.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}</td>
-   <td>{{Spec2('ES Int 1.0')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 2.0', '#sec-11.3.2', 'Intl.NumberFormat.prototype.format')}}</td>
-   <td>{{Spec2('ES Int 2.0')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sec-intl.numberformat.prototype.format', 'Intl.NumberFormat.prototype.format')}}</td>
-   <td>{{Spec2('ES Int Draft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Intl.NumberFormat.format")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("NumberFormat", "Intl.NumberFormat")}}</li>
- <li>{{jsxref("Number.prototype.toLocaleString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/intl/numberformat/index.html b/files/es/web/javascript/referencia/objetos_globales/intl/numberformat/index.html
deleted file mode 100644
index 7ee880d0e8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/intl/numberformat/index.html
+++ /dev/null
@@ -1,188 +0,0 @@
----
-title: Intl.NumberFormat
-slug: Web/JavaScript/Referencia/Objetos_globales/Intl/NumberFormat
-translation_of: Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
----
-<div>{{JSRef("Global_Objects", "NumberFormat", "Intl,Collator,DateTimeFormat")}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El objeto <strong><code>Intl.NumberFormat</code></strong> es un constructor para objetos que permiten un formato numérico sensible al idioma.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">new Intl.NumberFormat([locales [, <em>options</em>]])
-
-Intl.<code>NumberFormat</code>.call(<em>this</em> [, locales [, <em>options</em>]])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>locales</code></dt>
- <dd>
- <p>Cadena o arreglo de cadenas identificadoras para el código de idioma, conforme a BCP 47. Para mayor información con respecto a la forma e interpretación del argumento <code>locales</code>, visite el siguiente enlace: <a href="/en-US/docs/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation" title="/Intl#Functionality_common_to_internationalization_constructors">página de Intl</a>. Se admite la siguiente clave de extension Unicode:</p>
-
- <dl>
-  <dt>nu</dt>
-  <dd>El sistema numérico a ser utilizado. Los siguientes son valores admisibles: "arab", "arabext", "bali", "beng", "deva", "fullwide", "gujr", "guru", "hanidec", "khmr", "knda", "laoo", "latn", "limb", "mlym", "mong", "mymr", "orya", "tamldec", "telu", "thai", "tibt".</dd>
- </dl>
- </dd>
- <dt><code>options</code></dt>
- <dd>
- <p>Objeto con alguna o todas las propiedas listadas a continuación:</p>
-
- <dl>
-  <dt><code>localeMatcher</code></dt>
-  <dd>Algoritmo a emplear para establecer el idioma. Los valores admitidos son "lookup" (coincidencia exacta) y "best fit" (mejor coincidencia); el valor por defecto es "best fit". Para mayor información respecto a esta opción visite el siguiente enlace: <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_negotiation" title="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_negotiation">página de Intl</a>.</dd>
-  <dt><code>style</code></dt>
-  <dd>El estilo de formato a utilizar. Los valores admisibles son "decimal" para un formato numérico simple, "currency" para un formato de divisa, y "percent" para un formato porcentual; el valor por defecto es "decimal".</dd>
-  <dt><code>currency</code></dt>
-  <dd>La divisa a utilizar para el formato de divisa. Los valores admisibles son los establecidos en ISO 4217, por ejemplo "USD" para el dólar americano, "EUR" para el euro, o "CNY" para el RMB chino - para mayor información se recomienda visitar el siguiente enlace: l<a href="http://www.currency-iso.org/en/home/tables/table-a1.html" title="http://www.currency-iso.org/en/home/tables/table-a1.html">ista actual de códigos de divisa y fondos</a>. No existe un valor por defecto, por lo que si es valor del parámetro <code>style</code> es "currency", deberá proveerse también un valor para la propiedad <code>currency</code>.</dd>
-  <dt><code>currencyDisplay</code></dt>
-  <dd>Descriptor a utilizar para denotar el valor expresado como divisa. Los valores admisibles son "symbol" para utilizar el símbolo local a su contexto, por ejemplo €, "code" para utilizar el código de divisa ISO, "name" para utilizar el nombre local de la divisa, por ejemplo "dollar"; el valor por defecto es "symbol".</dd>
-  <dt><code>useGrouping</code></dt>
-  <dd>Si deberán emplearse o no separadores para agrupamiento, como es el caso de los separadores para millares o separadores millares/lakh/crore. Los valores admisibles son <code>true</code> y <code>false</code>; el valor por defecto es <code>true</code>.</dd>
- </dl>
-
- <p>Las propiedades descritas a continuación se dividen en dos grupos: por un lado <code>minimumIntegerDigits</code>, <code>minimumFractionDigits</code> y <code>maximumFractionDigits</code>, por el otro <code>minimumSignificantDigits</code> y <code>maximumSignificantDigits</code>. Si al menos una propiedad del segundo grupo es definida, todas aquellas del primero serán ignoradas.</p>
-
- <dl>
-  <dt><code>minimumIntegerDigits</code></dt>
-  <dd>El número mínimo de digitos enteros a utilizar. El rango de valores admisibles va desde 1 hasta 21; el valor por defecto es 1.</dd>
-  <dt><code>minimumFractionDigits</code></dt>
-  <dd>El número mínimo de digitos fraccionarios a utilizar. El rango de valores admisibles va desde 0 hasta 20; el valor por defecto para formato simple y porcentual es 0; el valor por defecto para formato de divisa es el indicado en la <a href="http://www.currency-iso.org/en/home/tables/table-a1.html" title="http://www.currency-iso.org/en/home/tables/table-a1.html">lista de códigos de moneda ISO 4217</a> para subdivisiones de tal divisa (o 2 si la lista no establece un valor).</dd>
-  <dt><code>maximumFractionDigits</code></dt>
-  <dd>El número máximo de dígitos de fraccionarios a utilizar. El rango de valores admisibles va desde 0 hasta 20; el valor por defecto para formato simple es el valor más alto admisible en <code>minimumFractionDigits</code> y 3; el valor por defecto para el formato de moneda es el valor más alto admisible en <code>minimumFractionDigits</code> y el indicado en la <a href="http://www.currency-iso.org/en/home/tables/table-a1.html" title="http://www.currency-iso.org/en/home/tables/table-a1.html">lista de cógidos de moneda ISO 4217</a> para subdivisiones de tal divisa (o 2 si la lista no establece un valor); el valor por defecto en el formato porcentual es el valor más alto admisible en <code>minimumFractionDigits</code> y 0.</dd>
-  <dt><code>minimumSignificantDigits</code></dt>
-  <dd>El número mínimo de dígitos significativos a utilizar. El rango de valores admisibles va desde 1 hasta 21; el valor por defecto es 1.</dd>
-  <dt><code>maximumSignificantDigits</code></dt>
-  <dd>El número máximo de dígitos significativos a utilizar. El rango de valores admisibles va desde 1 hasta 21; el valor por defecto es <code>minimumSignificantDigits</code>.</dd>
- </dl>
- </dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<h3 id="Properties" name="Properties">Propiedades</h3>
-
-<dl>
- <dt>{{jsxref("NumberFormat.prototype", "Intl.NumberFormat.prototype")}}</dt>
- <dd>Permite agregar nuevas propiedades a todos los objetos.</dd>
-</dl>
-
-<h3 id="Métodos">Métodos</h3>
-
-<dl>
- <dt>{{jsxref("NumberFormat.supportedLocalesOf", "Intl.NumberFormat.supportedLocalesOf()")}}</dt>
- <dd>Regresa un arreglo con aquellos códigos de idioma proveídos y que son soportados sin necesidad de recurrir a la configuración por defecto en el entorno de ejecucion.</dd>
-</dl>
-
-<h2 id="Instancias_NumberFormat">Instancias <code>NumberFormat</code></h2>
-
-<h3 id="Propiedades">Propiedades</h3>
-
-<p>Toda instancia de <code>NumberFormat</code> hereda las siguientes propiedades de su prototipo:</p>
-
-<div>{{page('en-US/docs/JavaScript/Reference/Global_Objects/NumberFormat/prototype','Properties')}}</div>
-
-<h3 id="Métodos_2">Métodos</h3>
-
-<div>
-<p>Toda instancia de <code>NumberFormat </code>hereda los siguientes métodos de su prototipo:</p>
-{{page('en-US/docs/JavaScript/Reference/Global_Objects/NumberFormat/prototype','Methods')}}</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Al no especificar un código de idioma, se regresa una cadena con el formato correspondiente al código de idioma y opciones disponibles por defecto en el entorno de ejecución.</p>
-
-<pre class="brush: js">var number = 3500;
-
-alert(new Intl.NumberFormat().format(number));
-// → "3,500" si el código de idioma es US English
-</pre>
-
-<h3 id="Example_Using_locales" name="Example:_Using_locales">Ejemplo: Utilizando <code>locales</code></h3>
-
-<p>Este ejemplo muestra algunas de las variantes en formato numérico con diferentes contextos locales. A fin de emplear el idioma correspondiente a aquél en la interfaz del usuario para su aplicación, asegúrese de especificar dicho idioma ( y de ser posible alternativas) utilizando el argumento <code>locales</code>:</p>
-
-<pre class="brush: js">var number = 123456.789;
-
-// En el alemán la coma se utiliza como separador decimal y el punto para los millares
-alert(new Intl.NumberFormat("de-DE").format(number));
-// → 123.456,789
-
-// En la mayoría de los países de lengua arábiga se utilizan también símbolos arábigos
-alert(new Intl.NumberFormat("ar-EG").format(number));
-// → ١٢٣٤٥٦٫٧٨٩
-
-// En la India se utilizan separadores millares/lakh/crore
-alert(new Intl.NumberFormat("en-IN").format(number));
-// → 1,23,456.789
-
-// use de nu para establecer un sistema numérico, el sistema decimal chino por ejemplo
-alert(new Intl.NumberFormat("zh-Hans-CN-u-nu-hanidec").format(number));
-// → 一二三,四五六.七八九
-
-// cuando se requiera un lenguaje que pudiera no ser soportado, como es el caso del Balinés
-// se recomienda incluir un lenguaje alternativo, en éste caso Indonesio
-alert(new Intl.NumberFormat(["ban", "id"]).format(number));
-// → 123.456,789
-</pre>
-
-<h3 id="Example_Using_options" name="Example:_Using_options">Ejemplo: Utilizando <code>options</code></h3>
-
-<p>El valor que regresa la función <code>toLocaleString</code> puede ser modificado utilizando el argumento <code>options</code>:</p>
-
-<pre class="brush: js">var number = 123456.789;
-
-// se establece un formato de divisa
-alert(new Intl.NumberFormat("de-DE", {style: "currency", currency: "EUR"}).format(number));
-// → 123.456,79 €
-
-// el yen japonés no tiene ninguna subdivisión
-alert(new Intl.NumberFormat("ja-JP", {style: "currency", currency: "JPY"}).format(number))
-// → ￥123,457
-
-// limitamos a tres los dígitos significativos
-alert(new Intl.NumberFormat("en-IN", {maximumSignificantDigits: 3}).format(number));
-// → 1,23,000
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado actual</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 1.0', '#sec-11.1', 'Intl.NumberFormat')}}</td>
-   <td>{{Spec2('ES Int 1.0')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 2.0', '#sec-11.1', 'Intl.NumberFormat')}}</td>
-   <td>{{Spec2('ES Int 2.0')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#numberformat-objects', 'Intl.NumberFormat')}}</td>
-   <td>{{Spec2('ES Int Draft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Intl.NumberFormat")}}</p>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<p>{{page('en-US/docs/JavaScript/Reference/Global_Objects/Intl','See_also')}}</p>
diff --git a/files/es/web/javascript/referencia/objetos_globales/intl/relativetimeformat/index.html b/files/es/web/javascript/referencia/objetos_globales/intl/relativetimeformat/index.html
deleted file mode 100644
index fc15049fa6..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/intl/relativetimeformat/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: Intl.RelativeTimeFormat
-slug: Web/JavaScript/Referencia/Objetos_globales/Intl/RelativeTimeFormat
-tags:
-  - RelatimeTimeFormat
-translation_of: Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>Intl.RelativeTimeFormat</code></strong> te proporciona una manera de formatear tiempos relativos con traducciones.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/intl-relativetimeformat.html")}}</div>
-
-<p class="hidden">El código de este ejemplo interactivo está disponible en un repositorio GitHub. Si quieres contribuir a los ejemplos interactivos del proyecto, por favor, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y manda una Pull Request.</p>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{jsxref("RelativeTimeFormat.RelativeTimeFormat()", "Intl.RelativeTimeFormat.RelativeTimeFormat()")}}</dt>
- <dd>Crea una nueva instancia de <code>Intl.RelativeTimeFormat</code>.</dd>
-</dl>
-
-<h2 id="Métodos_estáticos">Métodos estáticos</h2>
-
-<dl>
- <dt>{{jsxref("RelativeTimeFormat.supportedLocalesOf", "Intl.RelativeTimeFormat.supportedLocalesOf()")}}</dt>
- <dd>Devuelve un {{jsxref("Array")}} con todos los idiomas disponibles sin necesidad de usar el que hay por defecto.</dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt>{{jsxref("RelativeTimeFormat.format", "Intl.RelativeTimeFormat.prototype.format()")}}</dt>
- <dd>Formatea <code>value</code> y <code>unit</code> conforme al idioma y las opciones de formateo al crear la instancia con <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl.RelativeTimeFormat"><code>Intl.RelativeTimeFormat</code></a>.</dd>
- <dt>{{jsxref("RelativeTimeFormat.formatToParts", "Intl.RelativeTimeFormat.prototype.formatToParts()")}}</dt>
- <dd>Devuelve un {{jsxref("Array")}} de objetos representando el tiempo relativo en partes que pueden ser usadas en traducciones.</dd>
- <dt>{{jsxref("RelativeTimeFormat.resolvedOptions", "Intl.RelativeTimeFormat.prototype.resolvedOptions()")}}</dt>
- <dd>Devuelve un nuevo objeto con las propiedades que reflejan las opciones de localización y formato usadas durante la inicialización del objeto.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_básico">Ejemplo básico</h3>
-
-<p>El siguiente ejemplo muestra cómo conseguir el tiempo relativo para el mejor idioma según el usuario.</p>
-
-<pre class="brush: js notranslate">// Crea un formateador de tiempo relativo en tu lenguaje
-// con los valores por defectos pasados expresamente.
-const rtf = new Intl.RelativeTimeFormat("en", {
-    localeMatcher: "best fit", // otros valores: "lookup"
-    numeric: "always", // otros valores: "auto"
-    style: "long", // otros valores: "short" or "narrow"
-});
-
-// Formatea el tiempo relativo con valores negativos (-1).
-rtf.format(-1, "day");
-// &gt; "Hace 1 día"
-
-// Formatea el tiempo relativo con valores positivos (1).
-rtf.format(1, "day");
-// &gt; "Dentro de 1 día"</pre>
-
-<h3 id="Usando_formatToParts">Usando <code>formatToParts</code></h3>
-
-<p>El siguiente ejemplo muestra cómo crear un formateador de tiempo relativo que devuelve las partes separadas:</p>
-
-<pre class="brush: js notranslate">const rtf = new Intl.RelativeTimeFormat("es", { numeric: "auto" });
-
-// Formatea el tiempo relativo usando día como unidad.
-rtf.formatToParts(-1, "day");
-// &gt; [{ type: "literal", value: "ayer"}]
-
-rtf.formatToParts(100, "day");
-// &gt; [{ type: "literal", value: "Dentro de " },
-// &gt;  { type: "integer", value: "100", unit: "day" },
-// &gt;  { type: "literal", value: " días" }]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#relativetimeformat-objects', 'RelativeTimeFormat')}}</td>
-   <td></td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad es generada a partir de datos estructurados. Si quieres contribuir, por favor, revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una Pull Request.</div>
-
-<p>{{Compat("javascript.builtins.Intl.RelativeTimeFormat")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://developers.google.com/web/updates/2018/10/intl-relativetimeformat">The Intl.RelativeTimeFormat API</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/isfinite/index.html b/files/es/web/javascript/referencia/objetos_globales/isfinite/index.html
deleted file mode 100644
index 1227071c44..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/isfinite/index.html
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: isFinite()
-slug: Web/JavaScript/Referencia/Objetos_globales/isFinite
-tags:
-  - Function
-  - JavaScript
-  - isFinite()
-translation_of: Web/JavaScript/Reference/Global_Objects/isFinite
----
-<div>
- {{jsSidebar("Objects")}}</div>
-<h2 id="Resumen">Resumen</h2>
-<p>La función global <strong><code>isFinite()</code></strong> determina si el valor que se le pasa como argumento es un numero finito. Si es necesario, realiza una conversión a un numero al parametro pasado.</p>
-<h2 id="Sintaxis">Sintaxis</h2>
-<pre><code>isFinite(testValue)</code></pre>
-<h2 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h2>
-<dl>
- <dt>
-  <code>testvalue</code></dt>
- <dd>
-  Valor a ser evaluado.</dd>
-</dl>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p><code>isFinite</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
-<p>Puede usar esta función para determinar si un número es un número finito. La función <code>isFinite</code> examina el número de su argumento. Si el argumento es <code>NaN</code>, infinito positivo o infinito negativo, este método devuelve <code>false</code>, de otro modo devuelve <code>true</code>.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<pre>isFinite(Infinity);    // falso
-isFinite(NaN);         // falso
-isFinite(-Inifinity);  // falso
-
-isFinite(0);           // verdadero
-isFinite(2e64);        // verdadero
-
-isFinite("0");         // verdadero, hubiera sido falso en el caso de usar Number.isFinite("0") que es mas robusta</pre>
-<h2 id="Especificaciones">Especificaciones</h2>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 2nd Edition.</td>
-   <td>Estándar</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.1.2.5', 'isFinite')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-isfinite-number', 'isFinite')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-<p>{{ CompatibilityTable() }}</p>
-<div id="compat-desktop">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Chrome</th>
-    <th>Firefox (Gecko)</th>
-    <th>Internet Explorer</th>
-    <th>Opera</th>
-    <th>Safari</th>
-   </tr>
-   <tr>
-    <td>Soprte básico</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Android</th>
-    <th>Chrome for Android</th>
-    <th>Firefox Mobile (Gecko)</th>
-    <th>IE Mobile</th>
-    <th>Opera Mobile</th>
-    <th>Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li><code><strong>Number.isFinite()</strong></code></li>
- <li><strong><code>Number.NaN()</code></strong></li>
- <li><a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/POSITIVE_INFINITY"><code><strong>Number.POSITIVE_INFINITY</strong></code></a></li>
- <li><a href="/es/docs/Referencia_de_JavaScript_1.5/Objetos_globales/Number/NEGATIVE_INFINITY"><code><strong>Number.NEGATIVE_INFINITY</strong></code></a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/isnan/index.html b/files/es/web/javascript/referencia/objetos_globales/isnan/index.html
deleted file mode 100644
index d2607d0134..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/isnan/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: isNaN
-slug: Web/JavaScript/Referencia/Objetos_globales/isNaN
-translation_of: Web/JavaScript/Reference/Global_Objects/isNaN
----
-<div>{{jsSidebar("Objects")}}
-<p>La función <code><strong>isNaN()</strong></code> determina cuando el valor es {{jsxref("NaN")}} o no. Tenga presente que la coerción dentro de la función <code>isNaN</code> tiene reglas <a href="https://wiki.developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/isNaN$edit#Description">interesantes</a>; tal vez quieras usar de forma alternativa <strong><code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Number/isNaN">Number.isNaN()</a></code></strong>, como fue definido en ECMAScript 2015.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/globalprops-isnan.html")}}</div>
-</div>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre><code>isNaN(<em>valor</em>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><strong><code>valor</code></strong></dt>
- <dd>El valor a probar o evaluar.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p><strong><code>true</code></strong> si es valor dado es {{jsxref("NaN")}}, de otro modo, <code><strong>false</strong></code>.</p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>isNaN</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
-
-<p><code>isNaN</code> intenta convertir el parámetro pasado a un número. Si el parámetro no se puede convertir, devuelve true; en caso contrario, devuelve false.</p>
-
-<p>Esta función es útil ya que el valor {{jsxref("Objetos_globales/NaN", "NaN")}} no puede se probado correctamente con operadores de igualdad. <code>x == NaN</code> y <code>x === NaN</code> son siempre false, sin importar lo que sea <code>x</code>, incluso si <code>x</code> es <code>NaN</code>. Por ejemplo, tanto <code>1 == NaN</code> como <code>NaN == NaN</code> devuelven <code>false</code>.</p>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<pre class="brush: js">isNaN(NaN) //devuelve true
-isNaN("string") //devuelve true
-isNaN("12") //devuelve false
-isNaN(12) //devuelve false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.1.2.4', 'isNaN')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-isnan-number', 'isNaN')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-isnan-number', 'isNaN')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.isNaN")}}</p>
-
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-
-<ul>
- <li>{{jsxref("Objetos_globales/NaN", "NaN")}}</li>
- <li>{{jsxref("Number.isNaN()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/json/index.html b/files/es/web/javascript/referencia/objetos_globales/json/index.html
deleted file mode 100644
index 2744fb71e5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/json/index.html
+++ /dev/null
@@ -1,231 +0,0 @@
----
-title: JSON
-slug: Web/JavaScript/Referencia/Objetos_globales/JSON
-tags:
-  - JSON
-  - JavaScript
-  - NeedsTranslation
-  - Object
-  - TopicStub
-translation_of: Web/JavaScript/Reference/Global_Objects/JSON
----
-<div>{{JSRef("Objetos_globales", "JSON")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El objeto JSON contiene métodos para analizar <a class="external" href="http://json.org/">JavaScript Object Notation</a> (JSON) y convertir valores a JSON. No puede ser llamado o construído, y aparte de estas dos propiedades, no tiene funcionalidad interesante por sí mismo.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<h3 id="JavaScript_Object_Notation">JavaScript Object Notation</h3>
-
-<p>JSON es una sintaxis para serializar objetos, arreglos, números, cadenas, booleanos y nulos. Está basado sobre sintaxis JavaScript pero es diferente a ella: algo JavaScript no es JSON, y algo JSON no es JavaScript. Mira también: <a href="http://timelessrepo.com/json-isnt-a-javascript-subset">JSON: The JavaScript subset that isn't</a>.</p>
-
-<table>
- <caption>Diferencias entre JavaScript y JSON</caption>
- <thead>
-  <tr>
-   <th scope="col">Tipo JavaScript</th>
-   <th scope="col">Diferencia JSON</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>Objetos y arreglos</td>
-   <td>
-    <p>Los nombres de las propiedades deben tener doble comilla; las comas finales están prohibidas.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>Números</td>
-   <td>Los ceros a la izquierda están prohibidos; <span id="result_box" lang="es"><span class="hps">un punto</span> <span class="hps">decimal</span> <span class="hps">debe ser seguido</span> <span class="hps">al menos por un dígito</span><span>.</span></span></td>
-  </tr>
-  <tr>
-   <td>Cadenas</td>
-   <td>
-    <p>Solo un limitado conjunto de caracteres pueden ser de escape; ciertos caracteres de control estan prohibidos; los caracteres de separador de linea Unicode (U+2028) y el separador de parrafo (U+2029) son permitidos; las cadenas deben estar entre comillas dobles. Mira el siguiente ejemplo donde {{jsxref("JSON.parse")}} funciona bien y un{{jsxref("SyntaxError")}} es generado cuando se evalua el codigo como JavaScript:</p>
-
-    <pre class="brush: js notranslate" id="comment_text_1">
-var code = '"\u2028\u2029"';
-JSON.parse(code); // works fine
-eval(code); // fails</pre>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>La sintaxis JSON completa es la siguiente:</p>
-
-<pre class="eval notranslate"><var>JSON</var> = <strong>null</strong>
-    <em>or</em> <strong>true</strong> <em>or</em> <strong>false</strong>
-    <em>or</em> <var>JSONNumber</var>
-    <em>or</em> <var>JSONString</var>
-    <em>or</em> <var>JSONObject</var>
-    <em>or</em> <var>JSONArray</var>
-
-<var>JSONNumber</var> = <strong>-</strong> <var>PositiveNumber</var>
-          <em>or</em> <var>PositiveNumber</var>
-<var>PositiveNumber</var> = DecimalNumber
-              or <var>DecimalNumber</var> <strong>.</strong> <var>Digits</var>
-              or <var>DecimalNumber</var> <strong>.</strong> <var>Digits</var> <var>ExponentPart</var>
-              or <var>DecimalNumber</var> <var>ExponentPart</var>
-<var>DecimalNumber</var> = <strong>0</strong>
-             <em>or</em> <var>OneToNine</var> <var>Digits</var>
-<var>ExponentPart</var> = <strong>e</strong> <var>Exponent</var>
-            <em>or</em> <strong>E</strong> <var>Exponent</var>
-<var>Exponent</var> = <var>Digits</var>
-        <em>or</em> <strong>+</strong> <var>Digits</var>
-        <em>or</em> <strong>-</strong> <var>Digits</var>
-<var>Digits</var> = <var>Digit</var>
-      <em>or</em> <var>Digits</var> <var>Digit</var>
-<var>Digit</var> = <strong>0</strong> through <strong>9</strong>
-<var>OneToNine</var> = <strong>1</strong> through <strong>9</strong>
-
-<var>JSONString</var> = <strong>""</strong>
-          <em>or</em> <strong>"</strong> <var>StringCharacters</var> <strong>"</strong>
-<var>StringCharacters</var> = <var>StringCharacter</var>
-                <em>or</em> <var>StringCharacters</var> <var>StringCharacter</var>
-<var>StringCharacter</var> = any character
-                  <em>except</em> <strong>"</strong> <em>or</em> <strong>\</strong> <em>or</em> U+0000 through U+001F
-               <em>or</em> <var>EscapeSequence</var>
-<var>EscapeSequence</var> = <strong>\" </strong><em>or</em> <strong>\/ </strong><em>or</em> <strong>\\ </strong><em>or</em> <strong>\b </strong><em>or</em> <strong>\f </strong><em>or</em> <strong>\n </strong><em>or</em> <strong>\r </strong><em>or</em> <strong>\t</strong>
-              <em>or</em> <strong>\u</strong> <var>HexDigit</var> <var>HexDigit</var> <var>HexDigit</var> <var>HexDigit</var>
-<var>HexDigit</var> = <strong>0</strong> through <strong>9</strong>
-        <em>or</em> <strong>A</strong> through <strong>F</strong>
-        <em>or</em> <strong>a</strong> through <strong>f</strong>
-
-<var>JSONObject</var> = <strong>{</strong> <strong>}</strong>
-          <em>or</em> <strong>{</strong> <var>Members</var> <strong>}</strong>
-<var>Members</var> = <var>JSONString</var> <strong>:</strong> <var>JSON</var>
-       <em>or</em> <var>Members</var> <strong>,</strong> <var>JSONString</var> <strong>:</strong> <var>JSON</var>
-
-<var>JSONArray</var> = <strong>[</strong> <strong>]</strong>
-         <em>or</em> <strong>[</strong> <var>ArrayElements</var> <strong>]</strong>
-<var>ArrayElements</var> = <var>JSON</var>
-             <em>or</em> <var>ArrayElements</var> <strong>,</strong> <var>JSON</var></pre>
-
-<p>Espacios en blanco insignificantes pueden estar presentes en cualquier lugar excepto en un <var>JSONNumber</var> (los números no deben contener ningún espacio) o en una <var>JSONString</var> (donde es interpretado como el caracter correspondiente en la cadena, o podría causar un error). Los caracteres de Tabulación (U+0009), de retorno de carro (U+000D), de nueva línea (U+000A), y de espacio (U+0020) son los únicos caracteres de espacios en blanco válidos.</p>
-
-<h2 id="Methods" name="Methods">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("JSON.parse()")}}</dt>
- <dd>Analiza una cadena de texto JSON, opcionalmente transformando el valor producido y sus propiedades, retornando el valor.</dd>
- <dt>{{jsxref("JSON.stringify()")}}</dt>
- <dd>Devuelve un string JSON correspondiente al valor especificado, incluyendo opcionalmente ciertas propiedades o reemplazando valores de propiedades de la manera definida por el usuario.</dd>
-</dl>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>El objeto JSON no es soportado por navegadores antiguos. Se puede solucionar esto insertando el siguiente código al inicio del script, permitiendo usar el objeto JSON en navegadores que no soportan su implementación de forma nativa (por ejemplo en Internet Explorer 6).</p>
-
-<p>El siguiente algoritmo es una imitación del objeto JSON nativo:</p>
-
-<pre class="brush: js notranslate">if (!window.JSON) {
-  window.JSON = {
-    parse: function (sJSON) { return eval("(" + sJSON + ")"); },
-    stringify: function (vContent) {
-      if (vContent instanceof Object) {
-        var sOutput = "";
-        if (vContent.constructor === Array) {
-          for (var nId = 0; nId &lt; vContent.length; sOutput += this.stringify(vContent[nId]) + ",", nId++);
-            return "[" + sOutput.substr(0, sOutput.length - 1) + "]";
-        }
-        if (vContent.toString !== Object.prototype.toString) {
-          return "\"" + vContent.toString().replace(/"/g, "\\$&amp;") + "\"";
-        }
-        for (var sProp in vContent) {
-          sOutput += "\"" + sProp.replace(/"/g, "\\$&amp;") + "\":" + this.stringify(vContent[sProp]) + ",";
-        }
-        return "{" + sOutput.substr(0, sOutput.length - 1) + "}";
-     }
-     return typeof vContent === "string" ? "\"" + vContent.replace(/"/g, "\\$&amp;") + "\"" : String(vContent);
-    }
-  };
-}
-</pre>
-
-<p>Los objectos <a class="link-https" href="https://github.com/douglascrockford/JSON-js" title="https://github.com/douglascrockford/JSON-js">JSON2</a> y <a class="external" href="http://bestiejs.github.com/json3" title="http://bestiejs.github.com/json3">JSON3</a> son mas complejos que el objeto JSON ya que manejan <a class="external" href="http://remysharp.com/2010/10/08/what-is-a-polyfill/" title="http://remysharp.com/2010/10/08/what-is-a-polyfill/">polyfills</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.12', 'JSON')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-json-object', 'JSON')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
-   <td>8.0</td>
-   <td>10.5</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("1.0") }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Basado en <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Using_native_JSON">Using native JSON</a></li>
- <li>{{jsxref("Date.prototype.toJSON()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/json/parse/index.html b/files/es/web/javascript/referencia/objetos_globales/json/parse/index.html
deleted file mode 100644
index d8816fe8ff..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/json/parse/index.html
+++ /dev/null
@@ -1,178 +0,0 @@
----
-title: JSON.parse()
-slug: Web/JavaScript/Referencia/Objetos_globales/JSON/parse
-tags:
-  - ECMAScript5
-  - JSON
-  - JavaScript
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/JSON/parse
----
-<div>{{JSRef("Global_Objects", "JSON")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <code><strong>JSON.parse()</strong></code> analiza una cadena de texto como JSON, transformando opcionalmente  el valor producido por el análisis.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>JSON.parse(<em>text</em>[, <em>reviver</em>])</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>text</code></dt>
- <dd>El texto que se convertirá a JSON. Vea el objeto {{jsxref("JSON")}} para una descripción de la sintaxis JSON.</dd>
- <dt><code>reviver</code> {{optional_inline()}}</dt>
- <dd>Si una función, <span id="result_box" lang="es"><span class="hps">prescribe</span> <span class="hps">cómo se transforma</span> <span class="hps">el valor producido</span> <span class="hps">originalmente por</span> <span class="hps">el parsing</span></span>, antes de retornar.</dd>
-</dl>
-
-<h3 id="Returns">Returns</h3>
-
-<p>Retorna el objeto que se corresponde con el texto JSON entregado.</p>
-
-<h3 id="Exceptions">Exceptions</h3>
-
-<p>Lanza una excepción {{jsxref("SyntaxError")}} si la cadena a transformar no es un JSON válido.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Usando_JSON.parse()">Ejemplo: Usando <code>JSON.parse()</code></h3>
-
-<pre class="brush: js">JSON.parse('{}');              // {}
-JSON.parse('true');            // true
-JSON.parse('"foo"');           // "foo"
-JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
-JSON.parse('null');            // null
-</pre>
-
-<h3 id="Ejemplo_Usando_el_parámetro_reviver">Ejemplo: <code>Usando el parámetro reviver</code></h3>
-
-<p>Si se especifica un reviver, el valor computado por el parsing <em>es transformado </em>antes de retornar. Específicamente, el valor computado, y todas sus propiedades (comenzando con las propiedades más anidadas y siguiendo al propio valor original), son individualmente ejecutados a través del <code>reviver</code>, el cual es llamado con el objeto que contiene la propiedad que está siendo procesada como <code>this</code> y con el nombre de la propiedad como cadena y el valor de la propiedad como argumentos. Si la función <code>reviver</code> retorna <code>undefined</code> (o no retorna algún valor, por ejemplo: si la ejecución cae el final de la función), la propiedad es eliminada del objeto. De otra manera, la propiedad es redefinidad para ser el valor de retorno.</p>
-
-<p>El <code>reviver</code> es llamada último con la cadena vacía y el valor más alto <span class="short_text" id="result_box" lang="es"><span class="hps">para permitir</span> <span class="hps">la transformación</span> <span class="hps">del valor</span> <span class="hps">más alto</span></span>. <span class="short_text" id="result_box" lang="es"><span class="hps">Asegúrese de</span> <span class="hps">manejar este caso</span> <span class="hps">adecuadamente</span></span>, <span id="result_box" lang="es"><span class="hps">por lo general</span> <span class="hps">mediante la devolución del</span> <span class="hps">valor proporcionado</span></span>, o <code>JSON.parse</code> will retorna <code>undefined</code>.</p>
-
-<pre class="brush: js">JSON.parse('{"p": 5}', function (k, v) {
-    if(k === "") return v;     // if topmost value, return it,
-    return v * 2;              // else return v * 2.
-});                            // { p: 10 }
-
-JSON.parse('{"1": 1, "2": 2,"3": {"4": 4, "5": {"6": 6}}}', function (k, v) {
-    console.log(k);            // log the current property name, the last is "".
-    return v;                  // return the unchanged property value.
-});
-
-// 1
-// 2
-// 4
-// 6
-// 5
-// 3
-// ""
-</pre>
-
-<h3 id="JSON.parse()_no_admite_comas_finales"><code>JSON.parse()</code> no admite comas finales</h3>
-
-<pre class="example-bad brush: js example-bad line-numbers  language-js"><code class="language-js"><span class="comment token">// ambos lanzarán un SyntaxError</span>
-JSON<span class="punctuation token">.</span><span class="function token">parse</span><span class="punctuation token">(</span><span class="string token">'[1, 2, 3, 4, ]'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-JSON<span class="punctuation token">.</span><span class="function token">parse</span><span class="punctuation token">(</span><span class="string token">'{"foo" : 1, }'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.12.2', 'JSON.parse')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial.<br>
-    Implementado en JavaScript 1.7.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-json.parse', 'JSON.parse')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>
-    <p> </p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-json.parse', 'JSON.parse')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoDesktop("1.9.1") }}</td>
-   <td>8.0</td>
-   <td>10.5</td>
-   <td>4.0</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatGeckoMobile("1.0") }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Based on <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
-
-<h3 id="Especificaciones_Gecko">Especificaciones Gecko</h3>
-
-<p>Comenzando con Gecko 29 {{geckoRelease("29")}},<span class="short_text" id="result_box" lang="es"><span class="hps"> unas cadenas JSON malformadas</span></span><span class="short_text" lang="es"><span class="hps"> producen</span> </span><span id="result_box" lang="es"><span class="hps">un mensaje</span> <span class="hps">de error más detallado</span> <span class="hps">que contiene el</span> <span class="hps">número de línea y</span> <span class="hps">columna</span> <span class="hps">que provocó el</span> <span class="hps">error de parsing</span></span>. Esto es útil cuando se está haciendo debug de un JSON grande.</p>
-
-<pre class="brush: js">JSON.parse('[1, 2, 3,]')
-// SyntaxError: JSON.parse: unexpected character at
-// line 1 column 10 of the JSON data
-</pre>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Using_native_JSON">Utilizando</a> <a href="/en-US/docs/Web/JavaScript/Guide/Using_native_JSON">JSON nativo</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/json/stringify/index.html b/files/es/web/javascript/referencia/objetos_globales/json/stringify/index.html
deleted file mode 100644
index 13f508d7f7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/json/stringify/index.html
+++ /dev/null
@@ -1,265 +0,0 @@
----
-title: JSON.stringify()
-slug: Web/JavaScript/Referencia/Objetos_globales/JSON/stringify
-tags:
-  - JSON
-  - JavaScript
-  - Method
-  - stringify
-translation_of: Web/JavaScript/Reference/Global_Objects/JSON/stringify
----
-<p>{{JSRef}}</p>
-
-<p>El método <code><strong>JSON.stringify()</strong></code> convierte un objeto o valor de JavaScript en una cadena de texto JSON, opcionalmente reemplaza valores si se indica una función de reemplazo, o si se especifican las propiedades mediante un array de reemplazo.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/json-stringify.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>JSON.stringify(<var>value</var>[, <var>replacer</var>[, <var>space</var>]])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>value</code></dt>
- <dd>El valor que será convertido a una cadena JSON.</dd>
- <dt><code>replacer</code>{{Optional_Inline}}</dt>
- <dd>Una función que altera el comportamiento del proceso de conversión a cadena de texto, o un array de objetos {{JSxRef("String")}} o {{JSxRef("Number")}} que representan una lista de elementos válidos que se incluyen en la cadena JSON. Si este valor es {{JSxRef("null")}} o no se define, todas las propiedades del objeto son incluidas en la cadena de texto JSON resultante.</dd>
- <dt><code>space</code>{{Optional_Inline}}</dt>
- <dd>Un objeto de tipo {{JSxRef("String")}} o {{JSxRef("Number")}} que se utiliza para insertar un espacio en blanco dentro de la cadena de salida JSON para mejorar su legibilidad.
- <p>Si es de tipo <code>Number</code>, indica el número de espacios a usar como espacios en blanco; este número está limitado se limita a 10 (si es mayor, el valor es sólo <code>10</code>). Los valores inferiores a 1 indican que no se deben utilizar espacios.</p>
-
- <p>Si es de tipo <code>String</code>, la cadena de texto (o sus 10 primeros caracteres, si es mayor) se utiliza como espacios en blanco. Si este parámetro no se define o es {{JSxRef("null")}}, no se utilizará ningún espacio en blanco.</p>
- </dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena de texto JSON que representa el valor dado.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<p>Lanza una excepción {{JSxRef("TypeError")}} ("cyclic object value") cuando encuentra una referencia circular.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>JSON.stringify</code> convierte un valor a notación JSON representándolo:</p>
-
-<ul>
- <li>Si el valor tiene un método <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/JSON/stringify$edit#toJSON()_behavior">toJSON()</a>, es responsable de definir qué será serializado.</li>
- <li>Los objetos {{JSxRef("Boolean")}}, {{JSxRef("Number")}}, and {{JSxRef("String")}} se convierten a sus valores primitivos, de acuerdo con la conversión semántica tradicional.</li>
- <li>Si durante la conversión se encuentra un {{JSxRef("undefined")}}, una {{JSxRef("Function")}}, o un {{JSxRef("Symbol")}} se omite (cuando se encuentra en un objeto) o se censura a {{JSxRef("null")}} (cuando se encuentra en un array). <code>JSON.stringify()</code> puede devolver <code>undefined</code> cuando se pasan valores "puros" como <code>JSON.stringify(function(){}</code>) o <code>JSON.stringify(undefined)</code>.</li>
- <li>Todas las propiedades que utilicen {{JSxRef("Symbol")}} en los nombres de la clave se ignoran por completo, incluso si utilizan una función <code>replacer</code>.</li>
- <li>Las instancias de {{JSxRef("Date")}} implementan la función <code>toJSON()</code> devolviendo una cadena de texto (igual que <code>date.toISOString()</code>). Por lo que son tratadas como strings.</li>
- <li>Los números {{JSxRef("Infinity")}} y {{JSxRef("NaN")}}, así como el valor {{JSxRef("null")}}, se consideran <code>null</code>.</li>
- <li>El resto de instancias de {{JSxRef("Object")}} (incluyendo {{JSxRef("Map")}}, {{JSxRef("Set")}}, {{JSxRef("WeakMap")}}, y {{JSxRef("WeakSet")}}) sólo tendrán serializadas sus propiedades enumerables.</li>
-</ul>
-
-<pre class="brush: js">JSON.stringify({});                    // '{}'
-JSON.stringify(true);                  // 'true'
-JSON.stringify('foo');                 // '"foo"'
-JSON.stringify([1, 'false', false]);   // '[1,"false",false]'
-JSON.stringify([NaN, null, Infinity]); // '[null,null,null]'
-JSON.stringify({ x: 5 });              // '{"x":5}'
-
-JSON.stringify(new Date(2006, 0, 2, 15, 4, 5))
-// '"2006-01-02T15:04:05.000Z"'
-
-JSON.stringify({ x: 5, y: 6 });
-// '{"x":5,"y":6}'
-JSON.stringify([new Number(3), new String('false'), new Boolean(false)]);
-// '[3,"false",false]'
-
-// Elementos de array identificados por string no son enumerables y no tienen sentido en JSON
-let a = ['foo', 'bar'];
-a['baz'] = 'quux';      // a: [ 0: 'foo', 1: 'bar', baz: 'quux' ]
-JSON.stringify(a);
-// '["foo","bar"]'
-
-JSON.stringify({ x: [10, undefined, function(){}, Symbol('')] });
-// '{"x":[10,null,null,null]}'
-
-// Estructuras de datos standard
-JSON.stringify([new Set([1]), new Map([[1, 2]]), new WeakSet([{a: 1}]), new WeakMap([[{a: 1}, 2]])]);
-// '[{},{},{},{}]'
-
-// TypedArray
-JSON.stringify([new Int8Array([1]), new Int16Array([1]), new Int32Array([1])]);
-// '[{"0":1},{"0":1},{"0":1}]'
-JSON.stringify([new Uint8Array([1]), new Uint8ClampedArray([1]), new Uint16Array([1]), new Uint32Array([1])]);
-// '[{"0":1},{"0":1},{"0":1},{"0":1}]'
-JSON.stringify([new Float32Array([1]), new Float64Array([1])]);
-// '[{"0":1},{"0":1}]'
-
-// toJSON()
-JSON.stringify({ x: 5, y: 6, toJSON(){ return this.x + this.y; } });
-// '11'
-
-// Símbolos:
-JSON.stringify({ x: undefined, y: Object, z: Symbol('') });
-// '{}'
-JSON.stringify({ [Symbol('foo')]: 'foo' });
-// '{}'
-JSON.stringify({ [Symbol.for('foo')]: 'foo' }, [Symbol.for('foo')]);
-// '{}'
-JSON.stringify({ [Symbol.for('foo')]: 'foo' }, function(k, v) {
-  if (typeof k === 'symbol') {
-    return 'a symbol';
-  }
-});
-// undefined
-
-// Propiedades no enumerables:
-JSON.stringify( Object.create(null, { x: { value: 'x', enumerable: false }, y: { value: 'y', enumerable: true } }) );
-// '{"y":"y"}'
-</pre>
-
-<h3 id="El_parámetro_replacer">El parámetro <code>replacer</code></h3>
-
-<p>El parámetro <code>replacer</code> (de reemplazo) puede ser tanto una función como o un array.</p>
-
-<p><strong>Como una función</strong> toma dos parámetros: el <em>valor</em> y la <em>clave</em> que van a ser procesados. El objeto al cual pertenece la clave representa el parametro this del reemplazo.</p>
-
-<p>Inicialmente es llamado con una clave vacía y representa el objeto que se va a procesar, y solo después es llamado por cada propiedad en el objeto o array que se va a procesar.</p>
-
-<p>Devuelve el valor que se va a agregar a la cadena JSON, de la siguiente manera:</p>
-
-<ul>
- <li>Si se devuelve un número, la cadena correspondiente es usada como el valor de la propiedad cuando se agrega a la cadena JSON.</li>
- <li>Si se devuelve una cadena, esta es usuada cono el valor de la propiedad cuando se agrega a la cadena JSON.</li>
- <li>Si se devuelve un Boolean, true o false son usados como el valor de la propiedad cuando se agrega a la cadena JSON.</li>
- <li>Si se devuelve algún otro objeto, este es recursivamente procesado en una cadena JSON llamando a la función de reemplazo para cada propiedad, amenos que el objeto sea una función, en tal caso nada se agrega a la cadena JSON.</li>
- <li>Si se devuelve undefined, la propiedad no se incluye en la salida de la cadena JSON.</li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> No se puede usar la función de reemplazo para borrar los valores de un array. Si se devuelve undefined o una función, entonces se usara null en su lugar.</div>
-
-<h4 id="Ejemplo_con_una_función">Ejemplo con una función</h4>
-
-<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">replacer<span class="punctuation token">(</span></span>key<span class="punctuation token">,</span> value<span class="punctuation token">)</span> <span class="punctuation token">{
-  // Filtrando propiedades </span>
-  <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">typeof</span> value <span class="operator token">===</span> <span class="string token">"string"</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">return</span> undefined<span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">return</span> value<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="keyword token">var</span> foo <span class="operator token">=</span> <span class="punctuation token">{</span>foundation<span class="punctuation token">:</span> <span class="string token">"Mozilla"</span><span class="punctuation token">,</span> model<span class="punctuation token">:</span> <span class="string token">"box"</span><span class="punctuation token">,</span> week<span class="punctuation token">:</span> <span class="number token">45</span><span class="punctuation token">,</span> transport<span class="punctuation token">:</span> <span class="string token">"car"</span><span class="punctuation token">,</span> month<span class="punctuation token">:</span> <span class="number token">7</span><span class="punctuation token">}</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> jsonString <span class="operator token">=</span> JSON<span class="punctuation token">.</span><span class="function token">stringify<span class="punctuation token">(</span></span>foo<span class="punctuation token">,</span> replacer<span class="punctuation token">)</span><span class="punctuation token">;</span>
-// '{"week":45, "month":7}'
-</code></pre>
-
-<p>El resultado en una cadena JSON sería:  <code>{"week":45,"month":7}</code>.</p>
-
-<p>Ejemplo con un array</p>
-
-<p>Si el reemplazo es un array, los valores indican los nombres de las propiedades del objeto que se va a incluir en la cadena JSON resultado.</p>
-
-<pre class="brush: js  language-js"><code class="language-js">JSON<span class="punctuation token">.</span><span class="function token">stringify<span class="punctuation token">(</span></span>foo<span class="punctuation token">,</span> <span class="punctuation token">[</span><span class="string token">'week'</span><span class="punctuation token">,</span> <span class="string token">'month'</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">
-// '{"week":45,"month":7}', sólo mantiene las propiedades de "week" y de "month"</span></code>
-</pre>
-
-<h3 id="Argumento_space">Argumento <code>space</code></h3>
-
-<p>Este argumento puede ser empleado para controlar el espaciado en la cadena final. Si es un número, los niveles sucesivos del proceso serán identados cada uno por tantos espacios como se indique (hasta 10). Si es una cadena, serán identados con dicha cadena (o los primeros diez caracteres de la misma).</p>
-
-<pre class="brush: js">JSON.stringify({ a: 2 }, null, ' ');
-// regresa la cadena de texto:
-// '{
-//  "a": 2
-// }'</pre>
-
-<p>Usar el carácter tabulador simula la apariencia de impresión:</p>
-
-<pre class="brush: js">JSON.stringify({ uno: 1, dos : 2 }, null, '\t')
-// devuelve el string:
-// '{            \
-//     "uno": 1, \
-//     "dos": 2  \
-// }' </pre>
-
-<h3 id="Comportamiento_toJSON()">Comportamiento toJSON()</h3>
-
-<p>Si un objeto que sera estringificado tiene una propiedad llamada <span style="font-family: consolas,monaco,andale mono,monospace;">toJSON</span> donde su valor es una función, entonces el método <span style="font-family: consolas,monaco,andale mono,monospace;">toJSON</span> modifica el comportamiento de la estringificación JSON: en lugar del objeto que esta siendo serializado, el valor retornado por el método <span style="font-family: consolas,monaco,andale mono,monospace;">toJSON</span> será serializado cuando el mismo sea llamado. Por ejemplo:</p>
-
-<pre class="brush: js">var obj = {
-  foo: 'foo',
-  toJSON: function () {
-    return 'bar';
-  }
-};
-var json = JSON.stringify({x: obj}); // <code>'{"x":"bar"}'</code>.
-</pre>
-
-<h3 id="Example_of_using_JSON.stringify_with_localStorage" name="Example_of_using_JSON.stringify_with_localStorage">Ejemplo de como usar <code>JSON.stringify()</code> con <code>localStorage</code></h3>
-
-<p>En dado caso en el cual se requiera que un objeto creado por el usuario y al cual se le permita ser restaurado incluso cuando el navegador ha sido cerrado, el siguiente ejemplo es un modelo de la aplicabilidad del metodo JSON. stringify().</p>
-
-<div class="warning">
-<p>Las funciones no son un tipo de dato valido por lo cual estas no funcionaran. Algunos objetos como tipo DATE, se convertiran a cadenas de texto despues de ejecutar JSON.parse().</p>
-</div>
-
-<pre class="brush: js  language-js"><code class="language-js"><span class="comment token">// Creando un ejemplo de JSON
-</span><span class="keyword token">var</span> session <span class="operator token">=</span> <span class="punctuation token">{</span>
-  <span class="string token">'screens'</span><span class="punctuation token">:</span> <span class="punctuation token">[</span><span class="punctuation token">]</span><span class="punctuation token">,</span>
-  <span class="string token">'state'</span><span class="punctuation token">:</span> <span class="keyword token">true</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span>
-session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenA'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">450</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">250</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenB'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">650</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">350</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenC'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">750</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">120</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenD'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">250</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">60</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenE'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">390</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">120</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-session<span class="punctuation token">.</span>screens<span class="punctuation token">.</span><span class="function token">push<span class="punctuation token">(</span></span><span class="punctuation token">{</span> <span class="string token">'name'</span><span class="punctuation token">:</span> <span class="string token">'screenF'</span><span class="punctuation token">,</span> <span class="string token">'width'</span><span class="punctuation token">:</span> <span class="number token">1240</span><span class="punctuation token">,</span> <span class="string token">'height'</span><span class="punctuation token">:</span> <span class="number token">650</span> <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="comment token">
-// Convirte el JSON string con JSON.stringify()
-</span><span class="comment token">// entonces guarda con localStorage con el nombre de la sesión
-</span>localStorage<span class="punctuation token">.</span><span class="function token">setItem<span class="punctuation token">(</span></span><span class="string token">'session'</span><span class="punctuation token">,</span> JSON<span class="punctuation token">.</span><span class="function token">stringify<span class="punctuation token">(</span></span>session<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="comment token">
-// Ejemplo de como transformar el String generado usando
-// JSON.stringify() y guardándolo en localStorage como objeto JSON otra vez
-</span><span class="keyword token">var</span> restoredSession <span class="operator token">=</span> JSON<span class="punctuation token">.</span><span class="function token">parse<span class="punctuation token">(</span></span>localStorage<span class="punctuation token">.</span><span class="function token">getItem<span class="punctuation token">(</span></span><span class="string token">'session'</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="comment token">
-// Ahora la variable restoredSession contiene el objeto que fue guardado
-// en localStorage
-</span>console<span class="punctuation token">.</span><span class="function token">log<span class="punctuation token">(</span></span>restoredSession<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.12.3', 'JSON.stringify')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición incial.<br>
-    Implementada en JavaScript 1.7.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-json.stringify', 'JSON.stringify')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>
-    <p> </p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-json.stringify', 'JSON.stringify')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.JSON.stringify")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{JSxRef("JSON.parse()")}}</li>
- <li><a href="https://github.com/douglascrockford/JSON-js/blob/master/cycle.js">cycle.js</a> – Introduces two functions: <code>JSON.decycle</code> and <code>JSON.retrocycle</code>. These allow encoding and decoding of cyclical structures and DAGs into an extended and retrocompatible JSON format.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/clear/index.html b/files/es/web/javascript/referencia/objetos_globales/map/clear/index.html
deleted file mode 100644
index 67e8288ad2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/clear/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: Map.prototype.clear()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/clear
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/clear
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>clear()</strong></code> elimina todos los elementos de un objeto <code>Map.</code></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>myMap</em>.clear();</code></pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_clear">Usando el método <code>clear</code></h3>
-
-<pre class="brush: js">var myMap = new Map();
-myMap.set("bar", "baz");
-myMap.set(1, "foo");
-
-myMap.size;       // 2
-myMap.has("bar"); // true
-
-myMap.clear();
-
-myMap.size;       // 0
-myMap.has("bar")  // false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-map.prototype.clear', 'Map.prototype.clear')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.clear', 'Map.prototype.clear')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico.</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("19.0")}}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico.</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("19.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/delete/index.html b/files/es/web/javascript/referencia/objetos_globales/map/delete/index.html
deleted file mode 100644
index cbd6e02a50..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/delete/index.html
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: Map.prototype.delete()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/delete
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/delete
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>delete()</strong></code> elimina el elemento especificado de un objeto <code>Map.</code></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: js">myMap.delete(clave);</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>clave</dt>
- <dd>Requerido. La clave del elemento a eliminar del objeto <code>Map</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Retorna <code>true</code> si el elemento existe en el objeto <code>Map</code> objecty fue eliminado, o <code>false</code> si el elemento no existe.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Usando_el_método_delete">Usando el método <code>delete</code></h3>
-
-<pre class="brush: js">var myMap = new Map();
-myMap.set("bar", "foo");
-
-myMap.delete("bar"); // Retorna true. Eliminado con éxito.
-myMap.has("bar");    // Retorna false. El elemento "bar" ya no está presente.
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-map.prototype.delete', 'Map.prototype.delete')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.delete', 'Map.prototype.delete')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("13.0")}}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("13.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/entries/index.html b/files/es/web/javascript/referencia/objetos_globales/map/entries/index.html
deleted file mode 100644
index 76a4ca10b7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/entries/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: Map.prototype.entries()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/entries
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/entries
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>entries()</strong></code> retorna un nuevo objeto <code><strong>Iterator</strong></code> que contiene los pares <code>[clave, valor]</code> para cada elemento en el objeto <code>Map</code> en orden de inserción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>myMap</em>.entries()</code></pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_entries()">Usando <code>entries()</code></h3>
-
-<pre class="brush:js">var myMap = new Map();
-myMap.set("0", "foo");
-myMap.set(1, "bar");
-myMap.set({}, "baz");
-
-var mapIter = myMap.entries();
-
-console.log(mapIter.next().value); // ["0", "foo"]
-console.log(mapIter.next().value); // [1, "bar"]
-console.log(mapIter.next().value); // [Object, "baz"]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-map.prototype.entries', 'Map.prototype.entries')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.entries', 'Map.prototype.entries')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>38</td>
-   <td>{{ CompatGeckoDesktop("20") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico.</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("20")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map.prototype.keys()")}}</li>
- <li>{{jsxref("Map.prototype.values()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/foreach/index.html b/files/es/web/javascript/referencia/objetos_globales/map/foreach/index.html
deleted file mode 100644
index 00d8e85ff8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/foreach/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: Map.prototype.forEach()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/forEach
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/forEach
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>forEach()</strong></code> ejecuta una función por cada par clave / valor en el objeto Map, en orden de inserción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>myMap</em>.forEach(<em>callback</em>[, <em>thisArg</em>])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>callback</code></dt>
- <dd>Función ejecutada en cada elemento.</dd>
- <dt><code>thisArg</code></dt>
- <dd>Valor a usar por la funcion <code>callback</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>{{jsxref("undefined")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>forEach</code> ejecuta la devolución de llamada (<code>callback</code>) proporcionada una vez para cada clave del mapa que realmente exista. No se invoca para las claves que se han eliminado. Sin embargo, se ejecuta para los valores que están presentes pero tienen el valor indefinido (<code>undefined</code>).</p>
-
-<p>La función (<code>callback</code>) es invocada con <strong>3 argumentos</strong>:</p>
-
-<ul>
- <li><strong>valor del elemento</strong></li>
- <li><strong>clave del elemento</strong></li>
- <li><strong>El objeto utilizado</strong></li>
-</ul>
-
-<p>Si se provee un parámetro <code>thisArg</code> al método <code>forEach</code>, pasará al <code>callback</code> cuando sea invocado, para ser utilizado como su valor <code>this</code>. De otra manera, el valor <code>undefined</code> pasará para ser usado como su valor <code>this</code>. El valor <code>this</code> finalmente observable por el <code>callback</code> se determina de acuerdo a <a href="/es/docs/Web/JavaScript/Referencia/Operadores/this">las reglas usuales para determinar la visibilidad de <code>this</code> por una función</a>.</p>
-
-<p>Cada valor es usado una vez, excepto en este caso cuando es eliminado y agregado de nuevo antes de que el <code>forEach</code> haya terminado. <code>callback</code> no es invocado para valores eliminados antes de que sean usados. </p>
-
-<p>El método <code>forEach</code> ejecuta la función <code>callback</code> una vez para cada elemento en el objeto <code>Map</code>; No se retornan valores.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Imprimiendo_el_contenido_de_un_objeto_Map">Imprimiendo el contenido de un objeto <code>Map</code></h3>
-
-<p>El siguiente código imprime una línea por cada elemento en el objeto <code>Map</code>:</p>
-
-<pre class="brush:js">function logMapElements(value, key, map) {
-    console.log(`m[${key}] = ${value}`);
-}
-new Map([['foo', 3], ['bar', {}], ['baz', undefined]]).forEach(logMapElements);
-// logs:
-// "m[foo] = 3"
-// "m[bar] = [object Object]"
-// "m[baz] = undefined"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-map.prototype.foreach', 'Map.prototype.forEach')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición Inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.foreach', 'Map.prototype.forEach')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Map.forEach")}}</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Set.prototype.forEach()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/get/index.html b/files/es/web/javascript/referencia/objetos_globales/map/get/index.html
deleted file mode 100644
index 7f53d850e3..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/get/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Map.prototype.get()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/get
-tags:
-  - JavaScript
-  - Map
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/get
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>get()</strong></code> devuelve un elemento específico de un objeto <code>Map</code>.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/map-prototype-get.html")}}</div>
-
-<p class="hidden">El código fuente de este ejemplo se escuentra en un repositorio de GitHub. Si quieres contribuir al projecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envianos una solicitud de pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>miMapa</em>.get(clave);</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt>clave</dt>
- <dd>Requerido. La clave del elemento del objeto <code>Map</code> que queremos obtener.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Devuelve el elemento asociado a la clave indicada o <code>undefined</code> si la clave no ha sido encontrada en el objeto <code>Map</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_get">Usando el método <code>get</code></h3>
-
-<pre class="brush: js">var miMapa = new Map();
-miMapa.set('bar', 'foo');
-
-miMapa.get('bar');  // Devuelve "foo".
-miMapa.get('baz');  // Devuelve undefined.
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-map.prototype.get', 'Map.prototype.get')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.get', 'Map.prototype.get')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
-
-<div class="hidden">La tabla de compatiblidad en esta página es generada desde datos estructurados. Si quieres contribuir a los datos, por favor mira <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una solicitud de pull request.</div>
-
-<p>{{Compat("javascript.builtins.Map.get")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
- <li>{{jsxref("Map.prototype.set()")}}</li>
- <li>{{jsxref("Map.prototype.has()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/has/index.html b/files/es/web/javascript/referencia/objetos_globales/map/has/index.html
deleted file mode 100644
index c556a00dae..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/has/index.html
+++ /dev/null
@@ -1,65 +0,0 @@
----
-title: Map.prototype.has()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/has
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/has
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>has()</strong></code> devuelve un booleano indicando si el elemento con la llave especificada existe o no.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/map-prototype-has.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>myMap</var>.has(<var>key</var>)</pre>
-
-<h3 id="Parameteros">Parameteros</h3>
-
-<dl>
- <dt><code><var>key</var></code></dt>
- <dd>La llave del elemento a probar si esta presente en el objeto <code>Map</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p><code>true</code> si el elemento con la llave especificada existe en el objeto <code>Map</code>; de lo contrario <code>false</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_has">Usando <code>has()</code></h3>
-
-<pre class="brush: js notranslate">let myMap = new Map()
-myMap.set('bar', "foo")
-
-myMap.has('bar')   // returns true
-myMap.has('baz')   // returns false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.has', 'Map.prototype.has')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Map.has")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
- <li>{{jsxref("Map.prototype.set()")}}</li>
- <li>{{jsxref("Map.prototype.get()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/index.html b/files/es/web/javascript/referencia/objetos_globales/map/index.html
deleted file mode 100644
index e3ad7812b7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/index.html
+++ /dev/null
@@ -1,213 +0,0 @@
----
-title: Map
-slug: Web/JavaScript/Referencia/Objetos_globales/Map
-tags:
-  - ECMAScript2015
-  - JavaScript
-  - Map
-translation_of: Web/JavaScript/Reference/Global_Objects/Map
----
-<div>{{JSRef("Global_Objects", "Map")}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El objeto <strong><code>Map</code></strong> almacena pares clave/valor. Cualquier valor (tanto objetos como {{Glossary("Primitive", "valores primitivos")}}) pueden ser usados como clave o valor.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>new Map([iterable])
-</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>iterable</code></dt>
- <dd>Iterable es un array o cualquier otro objeto <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Iteration_protocols">iterable</a> cuyos elementos son pares clave-valor (arrays de 2 elementos). Cada par clave-valor será agregado al nuevo Map.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Un objeto Map puede iterar sobre sus elementos en orden de inserción. Un bucle <code>for..of</code> devolverá un array de <code>[clave, valor]</code> en cada iteración.</p>
-
-<p>Cabe destacar que un <strong>Map </strong>el cual es un mapa de un objeto, especialmente un diccionario de diccionarios, solo se va a mapear en el orden de inserción del objeto — el cual es aleatorio y no ordenado.</p>
-
-<h3 id="Igualdad_de_claves">Igualdad de claves</h3>
-
-<p>La igualdad de claves esta basada en el algoritmo "SameValueZero": <code>NaN</code> es considerado lo mismo que <code>NaN </code>(sin importar que <code>NaN !== NaN</code>) y todos los otros operadores son considerados iguales de acuerdo a la semantica del operador ===. En las primeras versiones de ECMAScript 6 <code>-0</code> y <code>+0</code> eran considarados distintos (even though <code>-0 === +0</code>), esto fue cambiado en posteriores versiones y ha sido implementado en Gecko 29 {{geckoRelease("29")}} ({{bug("952870")}}) and a <a href="https://code.google.com/p/v8/issues/detail?id=3069">recent nightly Chrome</a>.</p>
-
-<h3 id="Objetos_y_mapas_comparados">Objetos y mapas comparados</h3>
-
-<p>Los {{jsxref("Object", "Objetos")}} son similares a los <code>Maps</code> en cuanto a que ambos permiten establecer claves a valores, recuperar dichos valores, eliminar claves, y detectar si existe algo almacenado en una clave determinada. Por esto, los <code>Objects</code> han sido usados históricamente como <code>Maps</code>; no obstante, hay diferencias importantes entre  <code>Objects</code> y <code>Maps</code> que hacen mejor usar un  <code>Map</code>  en la mayoría de casos.</p>
-
-<ul>
- <li>Las claves de un <code>Object</code> son {{jsxref("String", "Strings")}} y {{jsxref("Symbol", "Symbols")}}, mientras que para un <code>Map</code> pueden ser de cualquier tipo, incluyendo funciones, objetos y cualquier otro tipo primitivo.</li>
- <li>Puedes saber facilmente el tamaño de un <code>Map</code> usando la propiedad <code>size</code>, mientras que le número de propiedades en un <code>Object</code> tiene que ser deternminado manualmente.</li>
- <li>Un <code>Map</code> es un <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Iteration_protocols">iterable</a> lo que permite iterar directamente sobre el, mientras que si queremos iterar sobre un <code>Object</code> necesitamos obtener primero las claves de alguna forma para después iterar sobre el.</li>
- <li>Un <code>Object</code> tiene prototipo, por lo que hay claves por defecto en tu mapa que pueden colisionar con tus claves si no eres cuidadoso. En el estandard ES5 esto se puede evitar usando <code>mapa = Object.create(null)</code>, pero esto raramente se hace.</li>
-</ul>
-
-<h2 id="Properties" name="Properties">Propiedades</h2>
-
-<dl>
- <dt><code>Map.length</code></dt>
- <dd>El valor de la propiedad de longitud es 0</dd>
- <dt>{{jsxref("Map.@@species", "get Map[@@species]")}}</dt>
- <dd>La función constructor que se usa para crear objetos derivados.</dd>
- <dt>{{jsxref("Map.prototype")}}</dt>
- <dd>Representa el prototipo para el constructor de Map. Permite añadir propiedades a todos los objetos <code>Map</code>.</dd>
-</dl>
-
-<h2 id="Boolean_instances" name="Boolean_instances">Instancias de Map</h2>
-
-<p>Todas las instancias de Map heredan de {{jsxref("Map.prototype")}}.</p>
-
-<h3 id="Propiedades">Propiedades</h3>
-
-<p>{{page('es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/prototype','Propiedades')}}</p>
-
-<h3 id="Métodos">Métodos</h3>
-
-<p>{{page('es/docs/Web/JavaScript/Referencia/Objetos_globales/Map/prototype','Métodos')}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Usando_el_objeto_Map">Ejemplo: Usando el objeto Map</h3>
-
-<pre class="brush: js">var miMapa = new Map();
-
-var claveObj = {},
-    claveFunc = function () {},
-    claveCadena = "una cadena";
-
-// asignando valores
-miMapa.set(claveCadena, "valor asociado con 'una cadena'");
-miMapa.set(claveObj, "valor asociado con claveObj");
-miMapa.set(claveFunc, "valor asociado with claveFunc");
-
-miMapa.size; // 3
-
-// obteniendo los valores
-miMapa.get(claveCadena);    // "valor asociado con 'una cadena'"
-miMapa.get(claveObj);       // "valor asociado con claveObj"
-miMapa.get(claveFunc);      // "valor asociado con claveFunc"
-
-miMapa.get("una cadena");   // ""valor asociado con 'una cadena'"
-                         // porque claveCadena === 'una cadena'
-miMapa.get({});           // undefined, porque claveObj !== {}
-miMapa.get(function() {}) // undefined, porque claveFunc !== function () {}
-</pre>
-
-<h3 id="Ejemplo_Usando_NaN_como_claves_de_Map">Ejemplo: Usando <code>NaN</code> como claves de Map</h3>
-
-<p><code>NaN</code> también puede ser usado como una clave. Aún cuando cada clave <code>NaN</code> no es igual a sí misma (<code>NaN !== NaN</code> es verdadera), el siguiente ejemplo funciona, porque las claves NaNs <code>NaN</code>s no son distinguibles unas de otras:</p>
-
-<pre class="brush: js">var miMapa = new Map();
-miMapa.set(NaN, "no es un número");
-
-miMapa.get(NaN); // "no es un número"
-
-var otroNaN = Number("foo");
-miMapa.get(otroNaN); // "no es un número"
-</pre>
-
-<h3 id="Ejemplo_Iterando_Map_con_for..of">Ejemplo: Iterando <code>Map</code> con <code>for..of</code></h3>
-
-<p>Los Map pueden ser iterados usando un bucle <code>for..of</code>:</p>
-
-<pre class="brush: js">var miMapa = new Map();
-miMapa.set(0, "cero");
-miMapa.set(1, "uno");
-for (var [clave, valor] of miMapa) {
-  alert(clave + " = " + valor);
-}
-// Mostrará 2 alertas; primero con "0 = cero" y segundo con "1 = uno"
-
-for (var clave of miMapa.keys()) {
-  alert(clave);
-}
-// Mostrará 2 alertas; primero con "0" y segundo con "1"
-
-for (var valor of miMapa.values()) {
-  alert(valor);
-}
-// Mostrará 2 alertas; primero con "cero" y segundo con "uno"
-
-for (var [clave, valor] of miMapa.entries()) {
-  alert(clave + " = " + valor);
-}
-// Mostrará 2 alertas; primero con "0 = cero" y segundo con "1 = uno"
-
-miMapa.forEach(function(valor, clave, miMapa) {
-  alert(clave + " = " + valor);
-})
-// Mostrará 2 alertas; primero con "0 = cero" y segundo con "1 = uno"
-</pre>
-
-<h3 id="Iterando_Maps_usando_forEach()">Iterando <code>Maps</code> usando <code>forEach()</code></h3>
-
-<p>Los Map pueden ser iterados usando el método <code>forEach()</code>:</p>
-
-<pre><code>miMapa.forEach(function(valor, clave) {
-  console.log(clave + ' = ' + valor);
-});
-// Mostrará 2 logs; el primero con "0 = cero" y el segundo con "1 = uno"</code></pre>
-
-<h3 id="Ejemplo_Relación_con_los_objetos_Array">Ejemplo: Relación con los objetos <code>Array</code></h3>
-
-<pre class="brush: js">var kvArray = [["clave1", "valor1"], ["clave2", "valor2"]];
-
-// El constructor por defecto de Map para transforar un Array 2D (clave-valor) en un mapa
-var miMapa = new Map(kvArray);
-
-miMapa.get("clave1"); // devuelve "valor1"
-
-// Usando la función Array.from para transformar el mapa a un Array 2D clave-valor.
-console.log(Array.from(miMapa)); // Muestra exactamente el mismo Array que kvArray
-
-// O usando los iteradores de claves o valores y convirtiendo a array.
-console.log(Array.from(miMapa.keys())); // Muestra ["clave1", "clave2"]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-map-objects', 'Map')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map-objects', 'Map')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<p> </p>
-
-<div class="hidden">
-<p>La tabla de compatiblidad en esta página es generada desde datos estructurados. Si quieres contribuir a los datos, pro favor mira <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una solicitud de pull request.</p>
-</div>
-
-<p>{{Compat("javascript.builtins.Map")}}</p>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=697479">Map and Set bug at Mozilla</a></li>
- <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:simple_maps_and_sets">ECMAScript Harmony proposal</a></li>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("WeakMap")}}</li>
- <li>{{jsxref("WeakSet")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/keys/index.html b/files/es/web/javascript/referencia/objetos_globales/map/keys/index.html
deleted file mode 100644
index 6f67e49dee..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/keys/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: Map.prototype.keys()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/keys
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/keys
----
-<div>{{JSRef}}</div>
-
-<p>El metodo <code><strong>keys()</strong></code> returna un nuevo objeto <code><strong>Iterator</strong></code> que contiene las llaves/keys por cada elemento en el objeto en orden de insercion.</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code><em>myMap</em>.keys()</code></pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_keys()">Usando <code>keys()</code></h3>
-
-<pre class="brush:js">var myMap = new Map();
-myMap.set("0", "foo");
-myMap.set(1, "bar");
-myMap.set({}, "baz");
-
-var mapIter = myMap.keys();
-
-console.log(mapIter.next().value); // "0"
-console.log(mapIter.next().value); // 1
-console.log(mapIter.next().value); // Object
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-map.prototype.keys', 'Map.prototype.keys')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.keys', 'Map.prototype.keys')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("20")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("20") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Map.prototype.entries()")}}</li>
- <li>{{jsxref("Map.prototype.values()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/map/prototype/index.html
deleted file mode 100644
index b255e65b69..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/prototype/index.html
+++ /dev/null
@@ -1,135 +0,0 @@
----
-title: Map.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Map
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Map/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>Map</strong></code><strong><code>.prototype</code></strong>  representa el prototipo del constructor {{jsxref("Map")}}.</p>
-
-<div>{{js_property_attributes(0,0,0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La instancia de {{jsxref("Map")}} hereda de {{jsxref("Map.prototype")}}. Puedes utilizar el constructor del prototipo del objeto para agregar propiedades o métodos a todas las instancias de <code>Map</code>.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>Map.prototype.constructor</code></dt>
- <dd>Devuelve la función que creó el prototipo de una instancia. Esta es la función de {{jsxref("Map")}} por defecto.</dd>
- <dt>{{jsxref("Map.prototype.size")}}</dt>
- <dd>Devuelve el número de conjuntos de llave/valor en el objeto <code>Map</code>.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Map.prototype.clear()")}}</dt>
- <dd>Elimina todos los conjuntos de llave/valor del objeto <code>Map</code>.</dd>
- <dt>{{jsxref("Map.delete", "Map.prototype.delete(key)")}}</dt>
- <dd>Elimina cualquier valor asociado a la <code>llave</code> y devuelve el valor que  <code>Map.prototype.has(key)</code> tenía previamente. Después  <code>Map.prototype.has(key)</code> devolverá <code>false</code>.</dd>
- <dt>{{jsxref("Map.prototype.entries()")}}</dt>
- <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene<strong> un array de <code>[llave, valor]</code></strong> para cada elemento en el objeto  <code>Map</code> en orden de inserción.</dd>
- <dt>{{jsxref("Map.forEach", "Map.prototype.forEach(callbackFn[, thisArg])")}}</dt>
- <dd>Llama a la callbackFn una vez por cada conjunto llave/valor presentes en cada objeto  <code>Map</code>, en orden de inserción. Si se le proporciona un parámetro thisArg a forEach, se usará como valor "this" para cada callback.</dd>
- <dt>{{jsxref("Map.get", "Map.prototype.get(key)")}}</dt>
- <dd>Devuelve el valor asociado a la  <code>llave</code>, o <code>undefined</code> si no tiene ninguno.</dd>
- <dt>{{jsxref("Map.has", "Map.prototype.has(key)")}}</dt>
- <dd>Devuelve un booleano que indica si un valor se ha asociado a la <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: #eeeeee;">llave</span></font> en el objeto <code>Map</code> o no se ha asociado.</dd>
- <dt>{{jsxref("Map.prototype.keys()")}}</dt>
- <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene las <strong>llaves</strong> para cada elemento en el objeto <code>Map</code> en orden de inserción.</dd>
- <dt>{{jsxref("Map.set", "Map.prototype.set(key, value)")}}</dt>
- <dd>Establece un valor para la <code>llave</code> en el objeto <code>Map</code>. Devuelve el objeto  <code>Map</code>.</dd>
- <dt>{{jsxref("Map.prototype.values()")}}</dt>
- <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene los <strong>valores</strong> para cada elemento en el objeto  <code>Map</code> en orden de inserción.</dd>
- <dt>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</dt>
- <dd>Devuelve un nuevo objeto  <code>Iterador</code> que contiene<strong> un array de <code>[llave, valor]</code></strong> para cada elemento en el objeto <code>Map</code> en orden de inserción.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-map.prototype', 'Map.prototype')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype', 'Map.prototype')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoDesktop("13") }}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("13")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>
-    <p>8</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Set.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/set/index.html b/files/es/web/javascript/referencia/objetos_globales/map/set/index.html
deleted file mode 100644
index 27faa5a1a6..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/set/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: Map.prototype.set()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/set
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Mapa
-  - Prototype
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/set
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong>set()</strong> agrega un nuevo elemento al objeto Map con la llave y el valor especificado.</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code><em>myMap</em>.set(llave, valor);</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>llave</dt>
- <dd>Requerido. La llave del elemento a agregar al objeto Map.</dd>
- <dt>valor</dt>
- <dd>Requerido. El valor del elemento a agregar al objeto Map.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El objeto Map.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_set">Usando el método set</h3>
-
-<pre class="brush: js">var miMapa = new Map();
-
-// Agregar nuevos elementos al mapa
-miMapa.set("bar", "foo");
-miMapa.set(1, "foobar");
-
-// Actualizar un elemento en el mapa
-miMapa.set("bar", "baz");
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-map.prototype.set', 'Map.prototype.set')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.set', 'Map.prototype.set')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterítica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("13.0")}}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracterítica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("13.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
-
-<ul>
- <li>En versiones inferiores a Firefox 33 {{geckoRelease("33")}}, <code>Map.prototype.set</code> retorna <code>undefined</code> y no es encadenable. Esto se ha reparado ({{bug(1031632)}}). Este comportamiento también se encontró en Chrome/v8 (<a href="https://code.google.com/p/v8/issues/detail?id=3410">issue</a>).</li>
-</ul>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
- <li>{{jsxref("Map.prototype.get()")}}</li>
- <li>{{jsxref("Map.prototype.has()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/size/index.html b/files/es/web/javascript/referencia/objetos_globales/map/size/index.html
deleted file mode 100644
index 3ca4d446db..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/size/index.html
+++ /dev/null
@@ -1,110 +0,0 @@
----
-title: Map.prototype.size
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/size
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/size
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad evaluada <code><strong>size</strong></code> retorna el número de elementos en un objeto  {{jsxref("Map")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El valor de <code>size</code> es un entero representando cuántas entradas tiene el objeto <code>Map</code>. No hay definida una función de evalador set  para <code>size</code>; uted no puede cambiar esta propiedad.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_size">Usando <code>size</code></h3>
-
-<pre class="brush:js">var myMap = new Map();
-myMap.set("a", "alpha");
-myMap.set("b", "beta");
-myMap.set("g", "gamma");
-
-myMap.size // 3
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-get-map.prototype.size', 'Map.prototype.size')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-get-map.prototype.size', 'Map.prototype.size')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibildad_entre_navegadores">Compatibildad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{ CompatGeckoDesktop("19") }}</td>
-   <td>{{ CompatIE("11") }}</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("19")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h2>
-
-<ul>
- <li>Desde Gecko 13 {{geckoRelease("13")}} a Gecko 18 {{geckoRelease("18")}} la propiedad size era implementada como un método <strong><code>Map.prototype.size()</code></strong>, esto ha sido modificado a propiedad en versiones posteriores de acuerdo a la especficiación ECMAScript 6 ({{bug("807001")}}).</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/map/values/index.html b/files/es/web/javascript/referencia/objetos_globales/map/values/index.html
deleted file mode 100644
index c81b54dbe7..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/map/values/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Map.prototype.values()
-slug: Web/JavaScript/Referencia/Objetos_globales/Map/values
-tags:
-  - ECMAScript 2015
-  - Iterador
-  - JavaScript
-  - Map
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Map/values
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>values()</strong></code> devuelve un nuevo objeto <strong><a href="/es/docs/Web/JavaScript/Guide/Iterators_and_Generators">Iterador</a></strong> que contiene los valores para cada elemento en el objeto <code>Map</code> en el mismo orden de inserción.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/map-prototype-values.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>myMap</em>.values()</code></pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un nuevo objeto iterador {{jsxref("Map")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_values()">Utilizando <code>values()</code></h3>
-
-<pre class="brush:js">var myMap = new Map();
-myMap.set('0', 'foo');
-myMap.set(1, 'bar');
-myMap.set({}, 'baz');
-
-var mapIter = myMap.values();
-
-console.log(mapIter.next().value); // "foo"
-console.log(mapIter.next().value); // "bar"
-console.log(mapIter.next().value); // "baz"</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-map.prototype.values', 'Map.prototype.values')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-map.prototype.values', 'Map.prototype.values')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Map.values")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map.prototype.entries()")}}</li>
- <li>{{jsxref("Map.prototype.keys()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/abs/index.html b/files/es/web/javascript/referencia/objetos_globales/math/abs/index.html
deleted file mode 100644
index eb286dcc59..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/abs/index.html
+++ /dev/null
@@ -1,149 +0,0 @@
----
-title: Math.abs()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/abs
-tags:
-  - JavaScript
-  - Math
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/abs
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.abs()</code></strong> retorna el valor absoluto de un número, que es </p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.abs</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mrow><mo stretchy="false">|</mo><mi>x</mi><mo stretchy="false">|</mo></mrow><mo>=</mo><mrow><mo>{</mo><mtable columnalign="left left"><mtr><mtd><mi>x</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo>&gt;</mo><mn>0</mn></mtd></mtr><mtr><mtd><mi>0</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo>=</mo><mn>0</mn></mtd></mtr><mtr><mtd><mo>-</mo><mi>x</mi></mtd><mtd><mtext>if</mtext><mspace width="1em"></mspace><mi>x</mi><mo>&lt;</mo><mn>0</mn></mtd></mtr></mtable></mrow></mrow><annotation encoding="TeX">{\mathtt{\operatorname{Math.abs}(x)}} = {|x|} = \begin{cases} x &amp; \text{if} \quad x \geq 0 \\ -x &amp; \text{if} \quad x &lt; 0 \end{cases} </annotation></semantics></math></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.abs(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
- <dt>
- <h3 dir="ltr" id="Valor_de_retorno">Valor de retorno</h3>
-
- <p dir="ltr">El valor absoluto del número dado.</p>
-
- <p dir="ltr"></p>
- </dt>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Como <code>abs()</code> es un método estático de <code>Math</code>, deberías siempre usar <code>Math.abs()</code>, en lugar de un método de un objeto <code>Math</code> que crees (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Comportamiento_de_Math.abs">Comportamiento de <code>Math.abs()</code></h3>
-
-<p>Pasando un string no-numérico o una variable {{jsxref("undefined")}}/empty retorna {{jsxref("NaN")}}. Pasando {{jsxref("null")}} retorna 0.</p>
-
-<pre class="brush: js">Math.abs('-1');     // 1
-Math.abs(-2);       // 2
-Math.abs(null);     // 0
-<code>Math.abs('');       // 0
-</code>Math.abs([]);       // 0
-<code>Math.abs([2]);      // 2
-</code>Math.abs([1,2]);    // NaN
-<code>Math.abs({});       // NaN</code>
-Math.abs('string'); // NaN
-Math.abs();         // NaN
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.1', 'Math.abs')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.abs', 'Math.abs')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.abs', 'Math.abs')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.ceil()")}}</li>
- <li>{{jsxref("Math.floor()")}}</li>
- <li>{{jsxref("Math.round()")}}</li>
- <li>{{jsxref("Math.sign()")}} {{experimental_inline}}</li>
- <li>{{jsxref("Math.trunc()")}} {{experimental_inline}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/acos/index.html b/files/es/web/javascript/referencia/objetos_globales/math/acos/index.html
deleted file mode 100644
index 3280a9b17f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/acos/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: Math.acos()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/acos
-tags:
-  - JavaScript
-  - Math
-  - Métodos
-  - Referências
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/acos
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.acos()</code></strong> devuelve el arco coseno (en radianes) de un número que es</p>
-
-<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mo stretchy="false">[</mo><mrow><mo>-</mo><mn>1</mn></mrow><mo>;</mo><mn>1</mn><mo stretchy="false">]</mo><mo>,</mo><mspace width="thickmathspace"></mspace><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.acos</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arccos</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mo stretchy="false">[</mo><mn>0</mn><mo>;</mo><mi>π</mi><mo stretchy="false">]</mo><mspace width="thinmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">cos</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.acos}(x)} = \arccos(x) = \text{ the unique } \; y \in [0; \pi] \, \text{such that} \; \cos(y) = x</annotation></semantics></math></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.acos(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El arco coseno (en radianes) de un número dado si se encuentra entre <strong>-1</strong> y <strong>1</strong>; de otro modo, {{jsxref("NaN")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>Math.acos()</code> devuelve un valor numérico entre 0 y π radianes para <code>x</code> entre -1 y 1. Si el valor de <code>x</code> está fuera de este rango, devuelve {{jsxref("NaN")}}.</p>
-
-<p>Debido a que <code>acos()</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.acos()</code>, en vez de como un método de un objeto <code>Math</code> creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.acos()">Usando <code>Math.acos()</code></h3>
-
-<pre class="brush: js">Math.acos(-2);  // NaN
-Math.acos(-1);  // 3.141592653589793
-Math.acos(0);   // 1.5707963267948966
-Math.acos(0.5); // 1.0471975511965979
-Math.acos(1);   // 0
-Math.acos(2);   // NaN
-</pre>
-
-<p>Para valores menores que  -1 o mayores que 1, <code>Math.acos()</code> devuelve {{jsxref("NaN")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.2', 'Math.acos')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.acos', 'Math.acos')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.acos', 'Math.acos')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegador">Compatibilidad con navegador</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.acos")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.asin()")}}</li>
- <li>{{jsxref("Math.atan()")}}</li>
- <li>{{jsxref("Math.atan2()")}}</li>
- <li>{{jsxref("Math.cos()")}}</li>
- <li>{{jsxref("Math.sin()")}}</li>
- <li>{{jsxref("Math.tan()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/acosh/index.html b/files/es/web/javascript/referencia/objetos_globales/math/acosh/index.html
deleted file mode 100644
index 8819e3c69a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/acosh/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: Math.acosh()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/acosh
-tags:
-  - JavaScript
-  - Math
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/acosh
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.acosh()</code></strong> retorna el arco coseno hiperbólico de un número que es: </p>
-
-<p><math display="block"><semantics><annotation encoding="TeX">Para todo x mayor ó igual a 1,se cumple que : la funcion Math.acosh(x) = arcosh(x) = al único y mayor ó igual a 0 ; tal que; cosh(y) = x</annotation></semantics></math></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.acosh(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>El arco coseno hiperbólico del número dado. Si el número es menor que 1, {{jsxref("NaN")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Como <code>acosh()</code> es un método estático de <code>Math</code>, siempre debe ser usado como <code>Math.acosh()</code>, en vez de como un método de un objeto <code>Math</code> creado (<code>Math</code> no es constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_Math.acosh()">Utilizando <code>Math.acosh()</code></h3>
-
-<pre class="brush: js">Math.acosh(-1);  // NaN
-Math.acosh(0);   // NaN
-Math.acosh(0.5); // NaN
-Math.acosh(1);   // 0
-Math.acosh(2);   // 1.3169578969248166
-</pre>
-
-<p>Para valores menores que 1 <code>Math.acosh()</code> retorna {{jsxref("NaN")}}.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Para todo <math><semantics><mrow><mi>x</mi><mo>≥</mo><mn>1</mn></mrow><annotation encoding="TeX">x mayor ó igual a 1</annotation></semantics></math>, se tiene que el arcosh(x) <math><semantics><annotation encoding="TeX">= ln(x + la raiz cuadrada de(x cuadrado - 1)) </annotation></semantics></math> y esto puede ser emulado con la siguiente funcion:</p>
-
-<pre class="brush: js">Math.acosh = Math.acosh || function(x) {
-  return Math.log(x + Math.sqrt(x * x - 1));
-};
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.acosh', 'Math.acosh')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{ SpecName('ESDraft', '#sec-math.acosh', 'Math.acosh')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada de datos estructurados. Si desea contribuir a los datos, por favor, revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una solicitud de edición.</p>
-
-<p>{{Compat("javascript.builtins.Math.acosh")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.asinh()")}}</li>
- <li>{{jsxref("Math.atanh()")}}</li>
- <li>{{jsxref("Math.cosh()")}}</li>
- <li>{{jsxref("Math.sinh()")}}</li>
- <li>{{jsxref("Math.tanh()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/asin/index.html b/files/es/web/javascript/referencia/objetos_globales/math/asin/index.html
deleted file mode 100644
index 1a6c78d6a5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/asin/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Math.asin()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/asin
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/asin
----
-<div>{{JSRef}}</div>
-
-<p>La Funcion <strong><code>Math.asin()</code></strong> retorna El arco seno (en radianes) de un número, eso es.</p>
-
-<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mo stretchy="false">[</mo><mrow><mo>-</mo><mn>1</mn></mrow><mo>;</mo><mn>1</mn><mo stretchy="false">]</mo><mo>,</mo><mspace width="thickmathspace"></mspace><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.asin</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arcsin</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mrow><mo>[</mo><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac><mo>;</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><mo>]</mo></mrow><mspace width="thinmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">sin</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in [{-1};1],\;\mathtt{\operatorname{Math.asin}(x)} = \arcsin(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \sin(y) = x</annotation></semantics></math></p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code>Math.asin(<var>x</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un Numero.</dd>
-</dl>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>The arcsine (in radians) of the given number if it's between <strong>-1</strong> and <strong>1</strong>; otherwise, {{jsxref("NaN")}}.</p>
-
-<h2 id="Descripcion">Descripcion</h2>
-
-<p>The <code>Math.asin()</code> method returns a numeric value between <math><semantics><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><annotation encoding="TeX">-\frac{\pi}{2}</annotation></semantics></math> and <math><semantics><mfrac><mi>π</mi><mn>2</mn></mfrac><annotation encoding="TeX">\frac{\pi}{2}</annotation></semantics></math> radians for <code>x</code> between -1 and 1. If the value of <code>x</code> is outside this range, it returns {{jsxref("NaN")}}.</p>
-
-<p>Because <code>asin()</code> is a static method of <code>Math</code>, you always use it as <code>Math.asin()</code>, rather than as a method of a <code>Math</code> object you created (<code>Math</code> is not a constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.asin()">Usando <code>Math.asin()</code></h3>
-
-<pre class="brush: js">Math.asin(-2);  // NaN
-Math.asin(-1);  // -1.5707963267948966 (-pi/2)
-Math.asin(0);   // 0
-Math.asin(0.5); // 0.5235987755982989
-Math.asin(1);   // 1.5707963267948966 (pi/2)
-Math.asin(2);   // NaN
-</pre>
-
-<p>For values less than -1 or greater than 1, <code>Math.asin()</code> returns {{jsxref("NaN")}}.</p>
-
-<h2 id="Espesificaciones">Espesificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Espesificacion</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.3', 'Math.asin')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.asin', 'Math.asin')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.asin', 'Math.asin')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_Mas">Ver Mas</h2>
-
-<ul>
- <li>{{jsxref("Math.acos()")}}</li>
- <li>{{jsxref("Math.atan()")}}</li>
- <li>{{jsxref("Math.atan2()")}}</li>
- <li>{{jsxref("Math.cos()")}}</li>
- <li>{{jsxref("Math.sin()")}}</li>
- <li>{{jsxref("Math.tan()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/asinh/index.html b/files/es/web/javascript/referencia/objetos_globales/math/asinh/index.html
deleted file mode 100644
index 9a3204a6a8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/asinh/index.html
+++ /dev/null
@@ -1,90 +0,0 @@
----
-title: Math.asinh()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/asinh
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/asinh
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.asinh()</code></strong> retorna el arcoseno hyperbólico de un número, es decir</p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.asinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="thinmathspace">arsinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">sinh</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.asinh}(x)} = \operatorname{arsinh}(x) = \text{ the unique } \; y \; \text{such that} \; \sinh(y) = x</annotation></semantics></math></p>
-
-<h2 id="Sintáxis">Sintáxis</h2>
-
-<pre class="syntaxbox"><code>Math.asinh(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El arcoseno hyperbólico del número dado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Debido a que <code>asinh()</code> es un método estático de  <code>Math</code>, siempre hay que usarlo como <code>Math.asinh()</code>, en lugar de como un método del objeto <code>Math</code> que se hayamos creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usos_de_Math.asinh()">Usos de <code>Math.asinh()</code></h3>
-
-<pre class="brush: js">Math.asinh(1);  // 0.881373587019543
-Math.asinh(0);  // 0
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>As a quick and dirty hack the expression <math><semantics><mrow><mo lspace="0em" rspace="thinmathspace">arsinh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mrow><mo>(</mo><mrow><mi>x</mi><mo>+</mo><msqrt><mrow><msup><mi>x</mi><mn>2</mn></msup><mo>+</mo><mn>1</mn></mrow></msqrt></mrow><mo>)</mo></mrow></mrow><annotation encoding="TeX">\operatorname {arsinh} (x) = \ln \left(x + \sqrt{x^{2} + 1} \right)</annotation></semantics></math> may be used directly for a coarse emulation by the following function:</p>
-
-<pre class="brush: js">Math.asinh = Math.asinh || function(x) {
-  if (x === -Infinity) {
-    return x;
-  } else {
-    return Math.log(x + Math.sqrt(x * x + 1));
-  }
-};
-</pre>
-
-<p>Been formally correct it suffers from a number of issues related to floating point computations. Accurate result requires special handling of positive/negative, small/large arguments as it done e.g. in <a href="https://sourceware.org/git/?p=glibc.git;a=blob;f=sysdeps/ieee754/dbl-64/s_asinh.c">glibc</a> or <a href="http://git.savannah.gnu.org/cgit/gsl.git/tree/sys/invhyp.c">GNU Scientific Library</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.asinh', 'Math.asinh')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.asinh', 'Math.asinh')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidades_de_buscadores">Compatibilidades de buscadores</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si desea contribuir con los datos, consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.asinh")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Math.acosh()")}}</li>
- <li>{{jsxref("Math.atanh()")}}</li>
- <li>{{jsxref("Math.cosh()")}}</li>
- <li>{{jsxref("Math.sinh()")}}</li>
- <li>{{jsxref("Math.tanh()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/atan/index.html b/files/es/web/javascript/referencia/objetos_globales/math/atan/index.html
deleted file mode 100644
index abb0453e6c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/atan/index.html
+++ /dev/null
@@ -1,107 +0,0 @@
----
-title: Math.atan()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/atan
-tags:
-  - JavaScript
-  - Matemática
-  - Math
-  - Method
-  - Trigonometría
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.atan()</code></strong> retorna el arcotangente (en radianes) de un number, esto es</p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.atan</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">arctan</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> el único </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>∊</mo><mrow><mo>[</mo><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac><mo>;</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><mo>]</mo></mrow><mspace width="thinmathspace"></mspace><mtext> tal que</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">tan</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.atan}(x)} = \arctan(x) = \text{ the unique } \; y \in \left[-\frac{\pi}{2}; \frac{\pi}{2}\right] \, \text{such that} \; \tan(y) = x</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-atan.html")}}</div>
-
-<p class="hidden">La fuente para este ejemplo interactivo se encuentra almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona el repositorio que hay en este link: <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> ; y envíanos una <em>pull request</em>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.atan(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El arcotangente (en radianes) de el número dado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>Math.atan()</code> retorna un valor numérico entre <math><semantics><mrow><mo>-</mo><mfrac><mi>π</mi><mn>2</mn></mfrac></mrow><annotation encoding="TeX">-\frac{\pi}{2}</annotation></semantics></math> y <math><semantics><mfrac><mi>π</mi><mn>2</mn></mfrac><annotation encoding="TeX">\frac{\pi}{2}</annotation></semantics></math> radianes.</p>
-
-<p>Dado que <code>atan()</code> es un método estático de <code>Math</code>, siempre debes usarlo como <code>Math.atan()</code>, y no como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.atan()">Usando <code>Math.atan()</code></h3>
-
-<pre class="brush: js">Math.atan(1);   // 0.7853981633974483
-Math.atan(0);   // 0
-Math.atan(-0);  // -0
-
-Math.atan(Infinity); <span class="objectBox objectBox-number">  //  1.5707963267948966
-Math.atan(-Infinity);  // -1.5707963267948966
-
-</span>// El ángulo que la línea [(0,0);(x,y)] forma con el eje-x en un sistema de coordenadas Cartesianas.
-Math.atan(y / x);
-</pre>
-
-<p>Nota que podrías querer evitar usar <strong>±</strong><code>Infinity</code> por razones de estilo. En este caso, {{jsxref("Math.atan2()")}} con <code>0</code> como segundo argumento puede ser una mejor solución.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.4', 'Math.atan')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.atan', 'Math.atan')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.atan', 'Math.atan')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada apartir de datos estructurados. Si quieres contribuir a los datos, por favor consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos una <em>pull request</em>.</p>
-
-<p>{{Compat("javascript.builtins.Math.atan")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.acos()")}}</li>
- <li>{{jsxref("Math.asin()")}}</li>
- <li>{{jsxref("Math.atan2()")}}</li>
- <li>{{jsxref("Math.cos()")}}</li>
- <li>{{jsxref("Math.sin()")}}</li>
- <li>{{jsxref("Math.tan()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/atan2/index.html b/files/es/web/javascript/referencia/objetos_globales/math/atan2/index.html
deleted file mode 100644
index 7b0dc147da..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/atan2/index.html
+++ /dev/null
@@ -1,141 +0,0 @@
----
-title: Math.atan2()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/atan2
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/atan2
----
-<div>{{JSRef("Global_Objects", "Math")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La función <strong><code>Math.atan2()</code></strong> retorna la arcotangente del cociente de los argumentos.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.atan2(<var>y</var>, <var>x</var>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>y</code></dt>
- <dd>Primer número.</dd>
- <dt><code>x</code></dt>
- <dd>Segundo número.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>El método <code>Math.atan2()</code> retorna un valor númerico entre -π y π representando el ángulo theta de un punto <code>(x, y)</code>. Este es un ángulo en sentido antihorario, medido en radianes, entre el eje positivo X, y el punto (<code>x, y)</code>. Tenga en cuenta que esta función recibe la coordenada Y como primer argumento y X como segundo.</p>
-
-<p>A la función<code> Math.atan2()</code> se  le pasan los argumentos <code>x</code> y <code>y</code> por separado, y a <code>Math.atan()</code> se le pasa la relación de los dos argumentos.</p>
-
-<p>Debido a que  <code>atan2()</code> es un método estatico de <code>Math</code>, siempre se debe usar <code>Math.atan2()</code>, en vez de usarlo como un método creado por el objeto <code>Math</code> (<code>Math</code> no es un contructor).</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_Math.atan2" name="Example:_Using_Math.atan2">Ejemplo: Usando <code>Math.atan2()</code></h3>
-
-<pre class="brush: js">Math.atan2(90, 15); // 1.4056476493802699
-Math.atan2(15, 90); // 0.16514867741462683
-
-Math.atan2(±0, -0);               // ±PI.
-Math.atan2(±0, +0);               // ±0.
-Math.atan2(±0, -x);               // ±PI for x &gt; 0.
-Math.atan2(±0, x);                // ±0 for x &gt; 0.
-Math.atan2(-y, ±0);               // -PI/2 for y &gt; 0.
-Math.atan2(y, ±0);                // PI/2 for y &gt; 0.
-Math.atan2(±y, -Infinity);        // ±PI for finite y &gt; 0.
-Math.atan2(±y, +Infinity);        // ±0 for finite y &gt; 0.
-Math.atan2(±Infinity, x);         // ±PI/2 for finite x.
-Math.atan2(±Infinity, -Infinity); // ±3*PI/4.
-Math.atan2(±Infinity, +Infinity); // ±PI/4.
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Standard</td>
-   <td>Initial definition. Implemented in JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.5', 'Math.atan2')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.atan2', 'Math.atan2')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.acos()")}}</li>
- <li>{{jsxref("Math.asin()")}}</li>
- <li>{{jsxref("Math.atan()")}}</li>
- <li>{{jsxref("Math.cos()")}}</li>
- <li>{{jsxref("Math.sin()")}}</li>
- <li>{{jsxref("Math.tan()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/atanh/index.html b/files/es/web/javascript/referencia/objetos_globales/math/atanh/index.html
deleted file mode 100644
index 85022b4138..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/atanh/index.html
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: Math.atanh()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/atanh
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/atanh
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.atanh()</code></strong> nos retorna un arco hiperbólico de un numero, eso es:</p>
-
-<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>∊</mo><mrow><mo>(</mo><mrow><mo>-</mo><mn>1</mn><mo>,</mo><mn>1</mn></mrow><mo>)</mo></mrow><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.atanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="thinmathspace">arctanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext> the unique </mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><mo lspace="0em" rspace="0em">tanh</mo><mo stretchy="false">(</mo><mi>y</mi><mo stretchy="false">)</mo><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \in \left( -1, 1 \right), \mathtt{\operatorname{Math.atanh}(x)} = \operatorname{arctanh}(x) = \text{ el unico } \; y \; \text{de tal manera que} \; \tanh(y) = x</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-atanh.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Math.atanh(<var>x</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><var>x</var></dt>
- <dd>Un numero.</dd>
-</dl>
-
-<h3 id="Retorna_un_valor">Retorna un valor</h3>
-
-<p>El arco hiperbolico tangible nos otorga un numero.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Por que <code>atanh()</code> es un metodo estatico de <code>Math</code>, tu siempre puedes usar eso como <code>Math.atanh()</code>, se puede usar como un metod de <code>Math</code> objeto que tu creaste (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Polimorfismo">Polimorfismo</h2>
-
-<p>Para <math><semantics><mrow><mrow><mo>|</mo><mi>x</mi><mo>|</mo></mrow><mo>&lt;</mo><mn>1</mn></mrow><annotation encoding="TeX">\left|x\right| &lt; 1</annotation></semantics></math>, tenemos <math><semantics><mrow><mo lspace="0em" rspace="thinmathspace">artanh</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mfrac><mn>1</mn><mn>2</mn></mfrac><mo lspace="0em" rspace="0em">ln</mo><mrow><mo>(</mo><mfrac><mrow><mn>1</mn><mo>+</mo><mi>x</mi></mrow><mrow><mn>1</mn><mo>-</mo><mi>x</mi></mrow></mfrac><mo>)</mo></mrow></mrow><annotation encoding="TeX">\operatorname {artanh} (x) = \frac{1}{2}\ln \left( \frac{1 + x}{1 - x} \right)</annotation></semantics></math> por lo que esto puede estar emulado con la siguiente función:</p>
-
-<pre class="brush: js notranslate">Math.atanh = Math.atanh || function(x) {
-  return Math.log((1+x)/(1-x)) / 2;
-};
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Using_Math.atanh">Using <code>Math.atanh()</code></h3>
-
-<pre class="brush: js notranslate">Math.atanh(-2);  // NaN
-Math.atanh(-1);  // -Infinito
-Math.atanh(0);   // 0
-Math.atanh(0.5); // 0.5493061443340548
-Math.atanh(1);   // Infinito
-Math.atanh(2);   // NaN
-</pre>
-
-<p>Para valores mayores a 1 o menores a -1, {{jsxref("NaN")}} retorna.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.atanh', 'Math.atanh')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.atanh")}}</p>
-
-<h2 id="Puedes_leer">Puedes leer</h2>
-
-<ul>
- <li>{{jsxref("Math.acosh()")}}</li>
- <li>{{jsxref("Math.asinh()")}}</li>
- <li>{{jsxref("Math.cosh()")}}</li>
- <li>{{jsxref("Math.sinh()")}}</li>
- <li>{{jsxref("Math.tanh()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/cbrt/index.html b/files/es/web/javascript/referencia/objetos_globales/math/cbrt/index.html
deleted file mode 100644
index 350bc03054..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/cbrt/index.html
+++ /dev/null
@@ -1,96 +0,0 @@
----
-title: Math.cbrt()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/cbrt
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/cbrt
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.cbrt()</code></strong> nos retorna la raíz del cubo del numero, eso es</p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mi>M</mi><mi>a</mi><mi>t</mi><mi>h</mi><mo>.</mo><mi>c</mi><mi>b</mi><mi>r</mi><mi>t</mi><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mroot><mi>x</mi><mn>3</mn></mroot><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>y</mi><mn>3</mn></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\mathtt{Math.cbrt(x)} = \sqrt[3]{x} = \text{un unico} \; y \; \text{de tal manera que} \; y^3 = x</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-cbrt.html")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Math.cbrt(<var>x</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><var>x</var></dt>
- <dd>Un numero</dd>
-</dl>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>La raíz cubica del numero proporcionado</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Al <code>cbrt()</code> ser un metodo estatico de <code>Math</code>, tu siempre la puedes usar como <code>Math.cbrt()</code>,un metodo de <code>Math</code> que es un objeto que se crea (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Poliformismo">Poliformismo</h2>
-
-<p>Para <math><semantics><mrow><mi>x</mi><mo>≥</mo><mn>0</mn></mrow><annotation encoding="TeX">x \geq 0</annotation></semantics></math>, tenemos <math><semantics><mrow><mroot><mi>x</mi><mn>3</mn></mroot><mo>=</mo><msup><mi>x</mi><mrow><mn>1</mn><mo>/</mo><mn>3</mn></mrow></msup></mrow><annotation encoding="TeX">\sqrt[3]{x} = x^{1/3}</annotation></semantics></math> esto puede ser emulado con la siguiente función:</p>
-
-<pre class="brush: js notranslate">if (!Math.cbrt) {
-  Math.cbrt = (function(pow) {
-    return function cbrt(x){
-      // Esto asegura que numeros negativos sigan siendo negativos
-      return x &lt; 0 ? -pow(-x, 1/3) : pow(x, 1/3);
-    };
-  })(Math.pow); // Localiza Math.pow para una mayor eficiencía
-}
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.cbrt">Usando Math.cbrt()</h3>
-
-<pre class="brush: js notranslate">Math.cbrt(NaN); // NaN
-Math.cbrt(-1); // -1
-Math.cbrt(-0); // -0
-Math.cbrt(-Infinity); // -Infinito
-Math.cbrt(0); // 0
-Math.cbrt(1); // 1
-Math.cbrt(Infinity); // Infinito
-Math.cbrt(null); // 0
-Math.cbrt(2);  // 1.2599210498948732
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.cbrt', 'Math.cbrt')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad">Compatibilidad</h2>
-
-<div class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a></div>
-
-<div class="hidden">
-
-</div>
-
-<p><a href="https://github.com/mdn/browser-compat-data">and send us a pull request.</a></p>
-
-<p><a href="https://github.com/mdn/browser-compat-data">{{Compat("javascript.builtins.Math.cbrt")}}</a></p>
-
-<h2 id="Puedes_leer">Puedes leer</h2>
-
-<ul>
- <li><a href="https://github.com/mdn/browser-compat-data">{{jsxref("Math.pow()")}}</a></li>
- <li><a href="https://github.com/mdn/browser-compat-data">{{jsxref("Math.sqrt()")}}</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/ceil/index.html b/files/es/web/javascript/referencia/objetos_globales/math/ceil/index.html
deleted file mode 100644
index 52b43cd3a2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/ceil/index.html
+++ /dev/null
@@ -1,166 +0,0 @@
----
-title: Math.ceil()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/ceil
-tags:
-  - JavaScript
-  - Math
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/ceil
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.ceil()</code></strong> devuelve el entero mayor o igual más próximo a un número dado.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-ceil.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.ceil(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El número entero mayor o igual más próximo que el número dado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Como <code>ceil()</code> es un método estático de <code>Math</code>, siempre debe usarlo como <code>Math.ceil()</code>, en lugar de como un método de un objeto que ha creado <code>Math</code> (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_Math.ceil()">Utilizando <code>Math.ceil()</code></h3>
-
-<p>El siguiente ejemplo muestra el uso de <code>Math.ceil()</code>.</p>
-
-<pre class="brush: js">Math.ceil(.95);    // 1
-Math.ceil(4);      // 4
-Math.ceil(7.004);  // 8
-Math.ceil(-0.95);  // -0
-Math.ceil(-4);     // -4
-Math.ceil(-7.004); // -7
-</pre>
-
-<h3 id="Ajuste_decimal">Ajuste decimal</h3>
-
-<pre class="brush: js">// Closure
-(function() {
-  /**
-   * Ajuste decimal de un número.
-   *
-   * @param {String}  type  El tipo de ajuste.
-   * @param {Number}  value El número.
-   * @param {Integer} exp   El exponente (El logaritmo de ajuste en base 10).
-   * @returns {Number} El valor ajustado.
-   */
-  function decimalAdjust(type, value, exp) {
-    // Si exp es undefined o cero...
-    if (typeof exp === 'undefined' || +exp === 0) {
-      return Math[type](value);
-    }
-    value = +value;
-    exp = +exp;
-    // Si el valor no es un número o exp no es un entero...
-    if (isNaN(value) || !(typeof exp === 'number' &amp;&amp; exp % 1 === 0)) {
-      return NaN;
-    }
-    // Shift
-    value = value.toString().split('e');
-    value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
-    // Shift back
-    value = value.toString().split('e');
-    return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
-  }
-
-  // Decimal round
-  if (!Math.round10) {
-    Math.round10 = function(value, exp) {
-      return decimalAdjust('round', value, exp);
-    };
-  }
-  // Decimal floor
-  if (!Math.floor10) {
-    Math.floor10 = function(value, exp) {
-      return decimalAdjust('floor', value, exp);
-    };
-  }
-  // Decimal ceil
-  if (!Math.ceil10) {
-    Math.ceil10 = function(value, exp) {
-      return decimalAdjust('ceil', value, exp);
-    };
-  }
-})();
-
-// Round
-Math.round10(55.55, -1);   // 55.6
-Math.round10(55.549, -1);  // 55.5
-Math.round10(55, 1);       // 60
-Math.round10(54.9, 1);     // 50
-Math.round10(-55.55, -1);  // -55.5
-Math.round10(-55.551, -1); // -55.6
-Math.round10(-55, 1);      // -50
-Math.round10(-55.1, 1);    // -60
-// Floor
-Math.floor10(55.59, -1);   // 55.5
-Math.floor10(59, 1);       // 50
-Math.floor10(-55.51, -1);  // -55.6
-Math.floor10(-51, 1);      // -60
-// Ceil
-Math.ceil10(55.51, -1);    // 55.6
-Math.ceil10(51, 1);        // 60
-Math.ceil10(-55.59, -1);   // -55.5
-Math.ceil10(-59, 1);       // -50
-</pre>
-
-<h2 id="Espicificaciones">Espicificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.6', 'Math.ceil')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.ceil', 'Math.ceil')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.ceil', 'Math.ceil')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Math.ceil")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.abs()")}}</li>
- <li>{{jsxref("Math.floor()")}}</li>
- <li>{{jsxref("Math.round()")}}</li>
- <li>{{jsxref("Math.sign()")}}</li>
- <li>{{jsxref("Math.trunc()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/cos/index.html b/files/es/web/javascript/referencia/objetos_globales/math/cos/index.html
deleted file mode 100644
index 82a0793769..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/cos/index.html
+++ /dev/null
@@ -1,74 +0,0 @@
----
-title: Math.cos()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/cos
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/cos
----
-<div>{{JSRef}}</div>
-
-<p><span class="seoSummary">La función estática <strong><code>Math.cos()</code></strong> devuelve el <a href="https://es.wikipedia.org/wiki/Coseno">coseno</a> del ángulo especificado, que debe ser especificado en <a href="https://es.wikipedia.org/wiki/Radi%C3%A1n" title="radians">radianes</a>. Este valor es </span><math style="display: inline;"> <mstyle displaystyle="true"> <mfrac> <msub> <mrow> <mtext>longitud</mtext> </mrow> <mrow> <mrow> <mtext>adyacente</mtext> </mrow> </mrow> </msub> <msub> <mrow> <mtext>longitud</mtext> </mrow> <mrow> <mrow> <mtext>hipotenusa</mtext> </mrow> </mrow> </msub> </mfrac> </mstyle> </math>.<span style="display: none;"> </span></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-cos.html")}}</div>
-
-<p class="hidden">El código fuente de este ejemplo interactivo está almacenado en un repositorio de GitHub. Si te gustaría contribuir con el proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Math.cos(<var>x</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>El ángulo en radianes por el cual devolverá el coseno.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El coseno del número dado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>Math.cos()</code> retorna un valor numérico entre -1 y 1, que representa el coseno del ángulo.</p>
-
-<p>Debido a que <code>cos()</code> es un método estático de <code>Math</code>, siempre debes utilizarlo como <code>Math.cos()</code>, en lugar de como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.cos">Usando <code>Math.cos()</code></h3>
-
-<pre class="brush: js notranslate">Math.cos(0);           // 1
-Math.cos(1);           // 0.5403023058681398
-
-Math.cos(Math.PI);     // -1
-Math.cos(2 * Math.PI); // 1
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.cos', 'Math.cos')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si te gustaría contribuir a los datos, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.cos")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.acos()")}}</li>
- <li>{{jsxref("Math.asin()")}}</li>
- <li>{{jsxref("Math.atan()")}}</li>
- <li>{{jsxref("Math.atan2()")}}</li>
- <li>{{jsxref("Math.sin()")}}</li>
- <li>{{jsxref("Math.tan()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/e/index.html b/files/es/web/javascript/referencia/objetos_globales/math/e/index.html
deleted file mode 100644
index 2fdc92d125..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/e/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: Math.E
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/E
-tags:
-  - JavaScript
-  - Math
-  - Property
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/E
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>Math.E</strong></code> representa la base de los logaritmos naturales, e, aproximadamente 2.718.</p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.E</mi></mstyle><mo>=</mo><mi>e</mi><mo>≈</mo><mn>2.718</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.E}} = e \approx 2.718</annotation></semantics></math></p>
-
-<p>{{EmbedInteractiveExample("pages/js/math-e.html")}}</p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Porque <code>E</code> es una propiedad estática de <code>Math</code>, siempre usted lo usa como <code>Math.E</code>, en lugar de como una propiedad de un objeto <code>Math</code> creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_Math.E" name="Example:_Using_Math.E">Utilizando <code>Math.E</code></h3>
-
-<p>La función siguiente devuelve e:</p>
-
-<pre class="brush:js">function getNapier() {
-   return Math.E
-}
-
-getNapier(); // 2.718281828459045</pre>
-
-<p> </p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.1.1', 'Math.E')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.e', 'Math.E')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.e', 'Math.E')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Math.E")}}</p>
-
-<p> </p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log1p()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/exp/index.html b/files/es/web/javascript/referencia/objetos_globales/math/exp/index.html
deleted file mode 100644
index ca60758600..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/exp/index.html
+++ /dev/null
@@ -1,136 +0,0 @@
----
-title: Math.exp()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/exp
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/exp
----
-<div>{{JSRef}}</div>
-
-<div>La función <strong>Math.exp()</strong> devuelve <code>e<sup>x</sup></code>, donde <code>x</code> es el argumento, y <code>e</code> es {{jsxref("Math.E", "El número de Euler (también conocido como la constante de Napier)", "", 1)}}, la base de los algoritmos naturales.</div>
-
-<div> </div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.exp(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un número represetando <code>e<sup>x</sup></code>, donde <code>e</code> es {{jsxref("Math.E", "número de Euler", "", 1)}} y <code>x</code> es el argumento.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Porque <code>exp()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.exp()</code>, en vez de un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.exp()">Usando <code>Math.exp()</code></h3>
-
-<pre class="brush: js">Math.exp(-1); // 0.36787944117144233
-Math.exp(0);  // 1
-Math.exp(1);  // 2.718281828459045
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>
-    <p>Definición inicial. Implementado en JavaScript 1.0.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.8', 'Math.exp')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.exp', 'Math.exp')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.exp', 'Math.exp')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Math.E")}}</li>
- <li>{{jsxref("Math.expm1()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log10()")}}</li>
- <li>{{jsxref("Math.log1p()")}}</li>
- <li>{{jsxref("Math.log2()")}}</li>
- <li>{{jsxref("Math.pow()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/expm1/index.html b/files/es/web/javascript/referencia/objetos_globales/math/expm1/index.html
deleted file mode 100644
index d8679d9230..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/expm1/index.html
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: Math.expm1()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/expm1
-tags:
-  - JavaScript
-  - Matemáticas
-  - Math
-  - Method
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/expm1
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.expm1()</code></strong> regresa <code>e<sup>x</sup> - 1</code>, donde <code>x</code> es el argumento, y {{jsxref("Math.E", "e", "", 1)}} la base del logaritmo natural.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-expm1.html")}}</div>
-
-<div class="hidden">El código para este ejemplo interactivo está almacenado en un repositorio de GitHub. Sí te gustaría contribuir al proyecto de ejemplos interactivos If you'd like to contribute, por favor clona  <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull request.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">Math.expm1(<var>x</var>)</pre>
-
-<h3 id="Parámetos">Parámetos</h3>
-
-<dl>
- <dt><code><var>x</var></code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un número representando <code>e<sup>x</sup> - 1</code>, donde <code>e</code> es {{jsxref("Math.E", "Número de Euler", "", 1)}} y  <code>x</code> es el argumento.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Debido a que <code>expm1()</code> es un método estático de <code>Math</code>, uselo siempre como <code>Math.expm1()</code>, en lugar de como un método del objeto <code>Math</code> que creó (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.expm1">Usando Math.expm1()</h3>
-
-<pre class="brush: js notranslate">Math.expm1(-1); // -0.6321205588285577
-Math.expm1(0);  // 0
-Math.expm1(1);  // 1.718281828459045
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Esto puede ser emulado con la ayuda de la función {{jsxref("Math.exp()")}}:</p>
-
-<pre class="brush: js notranslate">Math.expm1 = Math.expm1 || function(x) {
-  return Math.exp(x) - 1;
-};
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.expm1', 'Math.expm1')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada de información estructurada. Sí le gustaría contribuir a la información, por favor consulte <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
-
-<p>{{Compat("javascript.builtins.Math.expm1")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Math.E")}}</li>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log10()")}}</li>
- <li>{{jsxref("Math.log1p()")}}</li>
- <li>{{jsxref("Math.log2()")}}</li>
- <li>{{jsxref("Math.pow()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/floor/index.html b/files/es/web/javascript/referencia/objetos_globales/math/floor/index.html
deleted file mode 100644
index 867f3e8dac..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/floor/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: Math.floor()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/floor
-tags:
-  - JavaScript
-  - Math
-  - Method
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/floor
----
-<div>{{JSRef("Objetos_globales", "Math")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>Devuelve el máximo entero menor o igual a un número.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Math.floor(<em>x</em>) </code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Es número.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Como <code>floor</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.floor()</code>, en lugar de usarlo como un método de un objeto <code>Math</code> creado.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example_Using_Math.floor" name="Example:_Using_Math.floor">Ejemplo: Usando <code>Math.floor</code></h3>
-
-<p>La siguiente función devuelve el valor entero redondeado más bajo de la variable <code>x</code>:</p>
-
-<pre class="brush:js notranslate">function getFloor(x) {
-   return Math.floor(x);
-}</pre>
-
-<p>Si se pasa <code>45.95</code> a <code>getFloor</code>, éste devuelve <code>45</code>; si se le pasa <code>-45.95</code>,  devuelve <code>-46</code>.</p>
-
-<h3 id="Example_Decimal_adjustment" name="Example:_Decimal_adjustment">Ejemplo: Ajuste decimal</h3>
-
-<pre class="brush:js notranslate">// Cierre
-(function(){
-
-	/**
-	 * Ajuste decimal de un número.
-	 *
-	 * @param	{String}	type	El tipo de ajuste.
-	 * @param	{Number}	value	El número.
-	 * @param	{Integer}	exp		El exponente(el logaritmo en base 10 del ajuste).
-	 * @returns	{Number}			El valor ajustado.
-	 */
-	function decimalAdjust(type, value, exp) {
-		// Si el exp es indefinido o cero...
-		if (typeof exp === 'undefined' || +exp === 0) {
-			return Math[type](value);
-		}
-		value = +value;
-		exp = +exp;
-		// Si el valor no es un número o el exp no es un entero...
-		if (isNaN(value) || !(typeof exp === 'number' &amp;&amp; exp % 1 === 0)) {
-			return NaN;
-		}
-		// Cambio
-		value = value.toString().split('e');
-		value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
-		// Volver a cambiar
-		value = value.toString().split('e');
-		return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
-	}
-
-	// Redondeo decimal
-	if (!Math.round10) {
-		Math.round10 = function(value, exp) {
-			return decimalAdjust('round', value, exp);
-		};
-	}
-	// Redondeo hacia abajo
-	if (!Math.floor10) {
-		Math.floor10 = function(value, exp) {
-			return decimalAdjust('floor', value, exp);
-		};
-	}
-	// Redondeo hacia arriba
-	if (!Math.ceil10) {
-		Math.ceil10 = function(value, exp) {
-			return decimalAdjust('ceil', value, exp);
-		};
-	}
-
-})();
-
-// Redondeo
-Math.round10(55.55, -1); // 55.6
-Math.round10(55.549, -1); // 55.5
-Math.round10(55, 1); // 60
-Math.round10(54.9, 1); // 50
-Math.round10(-55.55, -1); // -55.5
-Math.round10(-55.551, -1); // -55.6
-Math.round10(-55, 1); // -50
-Math.round10(-55.1, 1); // -60
-// Piso
-Math.floor10(55.59, -1); // 55.5
-Math.floor10(59, 1); // 50
-Math.floor10(-55.51, -1); // -55.6
-Math.floor10(-51, 1); // -60
-// Techo
-Math.ceil10(55.51, -1); // 55.6
-Math.ceil10(51, 1); // 60
-Math.ceil10(-55.59, -1); // -55.5
-Math.ceil10(-59, 1); // -50
-</pre>
-
-<h2 id="See_also" name="See_also">Ven También</h2>
-
-<ul>
- <li>El {{jsxref("Math")}} objeto.</li>
- <li>{{jsxref("Math.abs")}}</li>
- <li>{{jsxref("Math.ceil()")}}</li>
- <li>{{jsxref("Math.round()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/fround/index.html b/files/es/web/javascript/referencia/objetos_globales/math/fround/index.html
deleted file mode 100644
index 73d773e5b0..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/fround/index.html
+++ /dev/null
@@ -1,199 +0,0 @@
----
-title: Math.fround()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/fround
-tags:
-  - JavaScript
-  - Math
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/fround
----
-<div>{{JSRef}}</div>
-
-<p class="seoSummary">The <strong><code>Math.fround()</code></strong> function returns the nearest <a class="external" href="https://en.wikipedia.org/wiki/Single-precision_floating-point_format" title="link to the wikipedia page on single-precision floating-point format">32-bit single precision</a> float representation of a {{jsxref("Number")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-fround.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox">var <em>singleFloat</em> = Math.fround(<em>doubleFloat</em>);</pre>
-
-<h3 id="Parameters">Parameters</h3>
-
-<dl>
- <dt><code>doubleFloat</code></dt>
- <dd>A {{jsxref("Number")}}. If the parameter is of a different type, it will get converted to a number or to {{jsxref("NaN")}} if it cannot be converted.</dd>
-</dl>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>The nearest <a class="external" href="https://en.wikipedia.org/wiki/Single-precision_floating-point_format" title="link to the wikipedia page on single-precision floating-point format">32-bit single precision</a> float representation of the given number.</p>
-
-<h2 id="Description">Description</h2>
-
-<p>JavaScript uses 64-bit double floating-point numbers internally, which offer a very high precision. However, sometimes you may be working with 32-bit floating-point numbers, for example if you are reading values from a {{jsxref("Float32Array")}}. This can create confusion: Checking a 64-bit float and a 32-bit float for equality may fail even though the numbers are seemingly identical.</p>
-
-<p>To solve this, <code>Math.fround()</code> can be used to cast the 64-bit float to a 32-bit float. Internally, JavaScript continues to treat the number as a 64-bit float, it just performs a "round to even" on the 23rd bit of the mantissa, and sets all following mantissa bits to <code>0</code>. If the number is outside the range of a 32-bit float, <code>{{jsxref("Infinity")}}</code> or <code>-Infinity</code> is returned.</p>
-
-<p>Because <code>fround()</code> is a static method of <code>Math</code>, you always use it as <code>Math.fround()</code>, rather than as a method of a <code>Math</code> object you created (<code>Math</code> is not a constructor).</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_Math.fround()">Using <code>Math.fround()</code></h3>
-
-<p>The number 1.5 can be precisely represented in the binary numeral system, and is identical in 32-bit and 64-bit:</p>
-
-<pre class="brush: js">Math.fround(1.5); // 1.5
-Math.fround(1.5) === 1.5; // true
-</pre>
-
-<p>However, the number 1.337 cannot be precisely represented in the binary numeral system, so it differs in 32-bit and 64-bit:</p>
-
-<pre class="brush: js">Math.fround(1.337); // 1.3370000123977661
-Math.fround(1.337) === 1.337; // false
-</pre>
-
-<p><math><semantics><msup><mn>2</mn><mn>150</mn></msup><annotation encoding="TeX">2^150</annotation></semantics></math> is too big for a 32-bit float, so <code>Infinity</code> is returned:</p>
-
-<pre class="brush: js">2 ** 150; // 1.42724769270596e+45
-Math.fround(2 ** 150); // Infinity
-</pre>
-
-<p>If the parameter cannot be converted to a number, or it is <a href="https://en.wikipedia.org/wiki/NaN" title="NaN on Wikipedia">not-a-number</a> (<code>NaN</code>), <code>Math.fround()</code> will return <code>NaN</code>:</p>
-
-<pre class="brush: js">Math.fround('abc'); // NaN
-Math.fround(NaN); // NaN
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>This can be emulated with the following function, if {{jsxref("Float32Array")}} are supported:</p>
-
-<pre class="brush: js">Math.fround = Math.fround || (function (array) {
-  return function(x) {
-    return array[0] = x, array[0];
-  };
-})(new Float32Array(1));
-</pre>
-
-<p>Supporting older browsers is slower, but also possible:</p>
-
-<pre class="brush: js">if (!Math.fround) Math.fround = function(arg) {
-  arg = Number(arg);
-  // Return early for ±0 and NaN.
-  if (!arg) return arg;
-  var sign = arg &lt; 0 ? -1 : 1;
-  if (sign &lt; 0) arg = -arg;
-  // Compute the exponent (8 bits, signed).
-  var exp = Math.floor(Math.log(arg) / Math.LN2);
-  var powexp = Math.pow(2, Math.max(-126, Math.min(exp, 127)));
-  // Handle subnormals: leading digit is zero if exponent bits are all zero.
-  var leading = exp &lt; -127 ? 0 : 1;
-  // Compute 23 bits of mantissa, inverted to round toward zero.
-  var mantissa = Math.round((leading - arg / powexp) * 0x800000);
-  if (mantissa &lt;= -0x800000) return sign * Infinity;
-  return sign * powexp * (leading - mantissa / 0x800000);
-};</pre>
-
-<h2 id="Faster_Alternative_Polyfill_(Work_In_Progress)">Faster Alternative Polyfill (Work In Progress)</h2>
-
-<p>The below polyfill is much faster and uses double-precision rounding errors to emulate the rounding errors caused by floating point narrowing. Although the polyfill higher on the page is good for comprehension, all of the complex Math function that it uses make it terrible slow. Although this polyfill is much faster, it is off by a bit in about 1 out of 2048 of the tests due to the tendency to round upwards like <code>Math.ceil</code> instead of like <code>Math.round</code> in the division of the subnormal-handling section of the code. Because single precision floating points have 23 bits of precision, the mean error deviation from the correct value is roughly <code>2**-28</code> or 0.0000000058%. This deviation from the correct value should be insignifigant in most circumstances, however please edit this polyfill if you have some tweaks to increase correctness without bloating the code size too much. NaN is not optimized for because it is most likely (almost certain) that you will not be calling <code>Math.fround</code> with NaN exclusively in a tight loop. Moreover, an additional check just for NaN instead of letting NaN naturally arise would induce a performance penalty for this function in older browsers when not called with NaN. Thus, the code below handles NaN correctly, but inefficiently for good reason.</p>
-
-<pre class="brush: js">const Math_round = Math.round;
-if (!Math.fround) Math.fround = function(x) {
-    if (x &gt; 3.402823669209385e+38) return Infinity; // maximum float is 2**128
-    if (x &lt; -3.402823669209385e+38) return -Infinity; // minimum is -2**128
-    if (-1.1754943508222875e-38 &lt; x &amp;&amp; x &lt; 1.1754943508222875e-38) {
-        if (-1.401298464324817e-45 &lt; x &amp;&amp; x &lt; 1.401298464324817e-45) return 0;
-        // else, it is a subnormal
-        var mul = Math_round(x/1.4012984643e-45)*1e-323;
-        return mul * 1.418129833677085e+278;
-    }
-
-    var hi = x * 9007199254740992; // 9007199254740992 is 2**53 which is the maximum of double precision
-    var exp = (x + hi) - hi; // adding this number chops off all lower bits, rounding the number.
-    exp /= 16777216; // 8388608 = 2**23 * 2, so preserve 23 bits in x because there are 23 bits in a float
-                     //            The "* 2" compensates for the addition shifting up the bits unwantedly
-    return Math_round(x / exp) * exp;
-}
-</pre>
-
-<p>Below is code used to test for deviations from the correct value. The code below is meant for testing the merit of the function, not for polyfilling older browsers (as evidenced by the fact that the native Math.fround function is used).</p>
-
-<pre class="brush: js">requestIdleCallback(function(){"use strict";
-    const Math_fround = Math.fround;
-    const Math_round = Math.round;
-    function my_fround(x) {
-        if (x &gt; 3.402823669209385e+38) return Infinity; // maximum float is 2**128
-        if (x &lt; -3.402823669209385e+38) return -Infinity; // minimum is -2**128
-        if (-1.1754943508222875e-38 &lt; x &amp;&amp; x &lt; 1.1754943508222875e-38) {
-            if (-1.401298464324817e-45 &lt; x &amp;&amp; x &lt; 1.401298464324817e-45) return 0;
-            // else, it is a subnormal
-            var mul = Math_round(x/1.4012984643e-45)*1e-323;
-            return mul * 1.418129833677085e+278;
-        }
-
-        var hi = x * 9007199254740992; // 9007199254740992 is 2**53 which is the maximum of double precision
-        var exp = (x + hi) - hi; // adding this number chops off all lower bits, rounding the number.
-        exp /= 16777216; // 8388608 = 2**23 * 2, so preserve 23 bits in x because there are 23 bits in a float
-                         //            The "* 2" compensates for the addition shifting up the bits unwantedly
-        return Math_round(x / exp) * exp;
-    }
-
-    const doublesArray = new Float64Array(8192);
-    const int32s = new Uint32Array(doublesArray.buffer);
-
-    const crypto = window.crypto;
-
-    var hasWarned = false, warnings=0;
-    for (var i=0; i&lt;4; i=i+1|0) {
-        crypto.getRandomValues(int32s);
-        for (var k=0; k&lt;8192; k=k+1|0) {
-            const myValue = my_fround(doublesArray[k]);
-            const froundVal = Math_fround(doublesArray[k]);
-            // quicker version of Object.is because of no function call overhead:
-            if (myValue === myValue ? myValue !== froundVal : froundVal === froundVal) {
-                if (!hasWarned) console.error(doublesArray[k]); // only show the first incorrect number
-                hasWarned = true;
-                warnings = warnings + 1|0;
-            }
-        }
-    }
-    console[warnings &gt; 0 ? "warn" : "log"]( "Total number of mishandled floats: " + warnings );
-});</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.fround', 'Math.fround')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.fround', 'Math.fround')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.fround")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Math.round()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/hypot/index.html b/files/es/web/javascript/referencia/objetos_globales/math/hypot/index.html
deleted file mode 100644
index 21d6850e44..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/hypot/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: Math.hypot()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/hypot
-tags:
-  - JavaScript
-  - Math
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/hypot
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.hypot()</code></strong> retorna la raíz cuadrada de la suma de los cuadrados de sus argumentos, es decir:</p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.hypot</mo><mo stretchy="false">(</mo><msub><mi>v</mi><mn>1</mn></msub><mo>,</mo><msub><mi>v</mi><mn>2</mn></msub><mo>,</mo><mo>…</mo><mo>,</mo><msub><mi>v</mi><mi>n</mi></msub><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msqrt><mrow><munderover><mo>∑</mo><mrow><mi>i</mi><mo>=</mo><mn>1</mn></mrow><mi>n</mi></munderover><msubsup><mi>v</mi><mi>i</mi><mn>2</mn></msubsup></mrow></msqrt><mo>=</mo><msqrt><mrow><msubsup><mi>v</mi><mn>1</mn><mn>2</mn></msubsup><mo>+</mo><msubsup><mi>v</mi><mn>2</mn><mn>2</mn></msubsup><mo>+</mo><mo>…</mo><mo>+</mo><msubsup><mi>v</mi><mi>n</mi><mn>2</mn></msubsup></mrow></msqrt></mrow><annotation encoding="TeX">\mathtt{\operatorname{Math.hypot}(v_1, v_2, \dots, v_n)} = \sqrt{\sum_{i=1}^n v_i^2} = \sqrt{v_1^2 + v_2^2 + \dots + v_n^2}</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-hypot.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.hypot(<var>valor1</var>, <var>valor2</var>, ..., <em>valorN</em>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>Valor1, Valor2, ...</code></dt>
- <dd>Números.</dd>
-</dl>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>La raíz cuadrada de la suma de los cuadrados de los argumentos proporcionados. Si tan sólo uno de los argumentos no pudiese ser convertido a un número, se retornaría {{jsxref("NaN")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Para calcular la hipotenusa de un triángulo rectángulo, o la magnitud de un número complejo, se usa el Teorema de Pitágoras, representado en la siguiente fórmula <code>Math.sqrt(v1*v1 + v2*v2)</code> donde <em>v1</em> y <em>v2</em> son, o los catetos del triángulo, o los valores reales y complejos usados para hallar la mencionada magnitud. Para calcular distancias de dos o más dimensiones, simplemente añade más valores al cuadrado (multiplicado por sí mismo) dentro de el método <code>sqrt()</code> del objeto <code>Math</code>, algo como: <code>Math.sqrt(v1*v1 + v2*v2 + v3*v3 + v4*v4)</code>.  </p>
-
-<p>Esta función lo hace un poco más fácil y rápido, sólo coloca: <code>Math.hypot(v1, v2)</code> , o <code>Math.hypot(v1, v2, v3, v4, ...)</code> .  </p>
-
-<p>Esto también evita un problema si la magnitud de tus números es muy elevada. El número más largo que puedes representar en JavaScript es <span style="line-height: 1.5;"><code>Number.MAX_VALUE = 1.797...e+308</code> .  Si tus números son mayores que 1e154, tomando el cuadrado de esos valores resultaría en infinito destruyendo así tus resultados. Por ejemplo, <code>Math.sqrt(1e200*1e200 + 1e200*1e200) = Infinito</code>. Si usas <code>hypot()</code> en su lugar, tú obtendrías un buen resultado <code>Math.hypot(1e200, 1e200) = 1.4142...e+200</code> .  Eso también es verdad con números demasiados pequeños.  <code>Math.sqrt(1e-200*1e-200 + 1e-200*1e-200) = 0</code>, pero si en su lugar, usamos </span><code><span style="line-height: 1.5;">Math.hypot(1e-200, 1e-200) =</span></code><span style="line-height: 1.5;"><code>1.4142...e-200</code>, obtendríamos un buen resultado una vez más.</span></p>
-
-<p>Debido a que <code>hypot()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.hypot()</code>, en lugar de un método del objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
-
-<p>Si ningún argumento es provisto, el resultado es 0.</p>
-
-<p>Con sólo un argumento, <code>Math.hypot()</code> retornaría lo mismo que <code>Math.abs()</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.hypot()">Usando <code>Math.hypot()</code></h3>
-
-<pre class="brush: js">Math.hypot(3, 4);        // 5
-Math.hypot(3, 4, 5);     // 7.0710678118654755
-Math.hypot();            // 0
-Math.hypot(NaN);         // NaN
-Math.hypot(3, 4, 'foo'); // NaN, +'foo' =&gt; NaN
-Math.hypot(3, 4, '5');   // 7.0710678118654755, +'5' =&gt; 5
-Math.hypot(-3);          // 3, lo mismo que Math.abs(-3)
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Esto puede ser emulado usando la siguiente función:</p>
-
-<pre class="brush: js">Math.hypot = Math.hypot || function() {
-  var y = 0, i = arguments.length;
-  while (i--) y += arguments[i] * arguments[i];
-  return Math.sqrt(y);
-};
-</pre>
-
-<p>Un polyfill que evita subdesbordamientos (underflows) y desbordamientos (overflows):</p>
-
-<pre class="brush: js">Math.hypot = function (x, y) {
-  // https://bugzilla.mozilla.org/show_bug.cgi?id=896264#c28
-  var max = 0;
-  var s = 0;
-  for (var i = 0; i &lt; arguments.length; i += 1) {
-    var arg = Math.abs(Number(arguments[i]));
-    if (arg &gt; max) {
-      s *= (max / arg) * (max / arg);
-      max = arg;
-    }
-    s += arg === 0 &amp;&amp; max === 0 ? 0 : (arg / max) * (arg / max);
-  }
-  return max === 1 / 0 ? 1 / 0 : max * Math.sqrt(s);
-};
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-math.hypot', 'Math.hypot')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.hypot', 'Math.hypot')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.hypot")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.abs()")}}</li>
- <li>{{jsxref("Math.pow()")}}</li>
- <li>{{jsxref("Math.sqrt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/index.html b/files/es/web/javascript/referencia/objetos_globales/math/index.html
deleted file mode 100644
index bdf0d21e74..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/index.html
+++ /dev/null
@@ -1,196 +0,0 @@
----
-title: Math
-slug: Web/JavaScript/Referencia/Objetos_globales/Math
-tags:
-  - JavaScript
-  - Math
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math
----
-<div>{{JSRef}}</div>
-
-<p><strong><code>Math</code></strong> es un objeto incorporado que tiene propiedades y métodos para constantes y funciones matemáticas. No es un objeto de función.</p>
-
-<p><strong><code>Math</code></strong> funciona con el tipo {{jsxref("Number")}}. No funciona con {{jsxref("BigInt")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>A diferencia de los demás objetos globales, el objeto <code>Math</code><strong> </strong>no se puede editar. Todas las propiedades y métodos de <code>Math</code> son<strong> </strong>estáticos. Usted se puede referir a la constante <em>pi</em> como <code>Math.PI</code><em><strong> </strong> </em>y puede llamar a la función <em>seno </em>como <code>Math.sin(x)</code>,<em><strong> </strong></em>donde<em><strong> </strong></em><code><strong>x</strong></code><em><strong> </strong></em>es el argumento del método. Las constantes se definen con la precisión completa de los números reales en JavaScript.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("Math.E")}}</dt>
- <dd>Constante de Euler, la base de los logaritmos naturales, aproximadamente 2.718.</dd>
- <dt>{{jsxref("Math.LN2")}}</dt>
- <dd>Logaritmo natural de 2, aproximadamente 0.693.</dd>
- <dt>{{jsxref("Math.LN10")}}</dt>
- <dd>Logaritmo natural de 10, aproximadamente 2.303.</dd>
- <dt>{{jsxref("Math.LOG2E")}}</dt>
- <dd>Logaritmo de E con base 2, aproximadamente 1.443.</dd>
- <dt>{{jsxref("Math.LOG10E")}}</dt>
- <dd>Logaritmo de E con base 10, aproximadamente 0.434.</dd>
- <dt>{{jsxref("Math.PI")}}</dt>
- <dd>Ratio de la circunferencia de un circulo respecto a su diámetro, aproximadamente 3.14159.</dd>
- <dt>{{jsxref("Math.SQRT1_2")}}</dt>
- <dd>Raíz cuadrada de 1/2; Equivalentemente, 1 sobre la raíz cuadrada de 2, aproximadamente 0.707.</dd>
- <dt>{{jsxref("Math.SQRT2")}}</dt>
- <dd>Raíz cuadrada de 2, aproximadamente 1.414.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<div class="note">
-<p>Tenga en cuenta que las funciones trigonométricas (<code>sin()</code>, <code>cos()</code>, <code>tan()</code>, <code>asin()</code>, <code>acos()</code>, <code>atan()</code>, <code>atan2()</code>) devuelven ángulos en radianes. Para convertir radianes a grados, divida por <code>(Math.PI / 180)</code>, y multiplique por esto para convertir a la inversa.</p>
-</div>
-
-<div class="note">
-<p>Tenga en cuenta que muchas de las funciones matemáticas tienen una precisión que es dependiente de la implementación. Esto significa que los diferentes navegadores pueden dar un resultado diferente, e incluso el mismo motor de JS en un sistema operativo o arquitectura diferente puede dar resultados diferentes.</p>
-</div>
-
-<dl>
- <dt>{{jsxref("Global_Objects/Math/abs", "Math.abs(x)")}}</dt>
- <dd>Devuelve el valor absoluto de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/acos", "Math.acos(x)")}}</dt>
- <dd>Devuelve el arco coseno de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/acosh", "Math.acosh(x)")}}</dt>
- <dd>Devuelve el arco coseno hiperbólico de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/asin", "Math.asin(x)")}}</dt>
- <dd>Devuelve el arco seno de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/asinh", "Math.asinh(x)")}}</dt>
- <dd>Devuelve el arco seno hiperbólico de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/atan", "Math.atan(x)")}}</dt>
- <dd>Devuelve el arco tangente de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/atanh", "Math.atanh(x)")}}</dt>
- <dd>Devuelve el arco tangente hiperbólico de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/atan2", "Math.atan2(y, x)")}}</dt>
- <dd>Devuelve el arco tangente del cuociente de sus argumentos.</dd>
- <dt>{{jsxref("Global_Objects/Math/cbrt", "Math.cbrt(x)")}}</dt>
- <dd>Devuelve la raíz cúbica de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/ceil", "Math.ceil(x)")}}</dt>
- <dd>Devuelve el entero más pequeño mayor o igual que un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/clz32", "Math.clz32(x)")}}</dt>
- <dd>Devuelve el número de ceros iniciales de un entero de 32 bits.</dd>
- <dt>{{jsxref("Global_Objects/Math/cos", "Math.cos(x)")}}</dt>
- <dd>Devuelve el coseno de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/cosh", "Math.cosh(x)")}}</dt>
- <dd>Devuelve el coseno hiperbólico de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/exp", "Math.exp(x)")}}</dt>
- <dd>Devuelve <code>E<sup>x</sup></code>, donde <var>x</var> es el argumento, y <code>E</code> es la constante de Euler (2.718...), la base de los logaritmos naturales.</dd>
- <dt>{{jsxref("Global_Objects/Math/expm1", "Math.expm1(x)")}}</dt>
- <dd>Devuelve e<sup>x</sup> - 1.</dd>
- <dt>{{jsxref("Global_Objects/Math/floor", "Math.floor(x)")}}</dt>
- <dd>Devuelve el mayor entero menor que o igual a un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/fround", "Math.fround(x)")}}</dt>
- <dd>Devuelve la representación flotante de precisión simple más cercana de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/hypot", "Math.hypot([x[, y[, …]]])")}}</dt>
- <dd>Devuelve la raíz cuadrada de la suma de los cuadrados de sus argumentos.</dd>
- <dt>{{jsxref("Global_Objects/Math/imul", "Math.imul(x, y)")}}</dt>
- <dd>Devuelve el resultado de una multiplicación de enteros de 32 bits.</dd>
- <dt>{{jsxref("Global_Objects/Math/log", "Math.log(x)")}}</dt>
- <dd>Devuelve el logaritmo natural (log, también ln) de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/log1p", "Math.log1p(x)")}}</dt>
- <dd>Devuelve el logaritmo natural de x + 1 (loge, también ln) de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/log10", "Math.log10(x)")}}</dt>
- <dd>Devuelve el logaritmo en base 10 de x.</dd>
- <dt>{{jsxref("Global_Objects/Math/log2", "Math.log2(x)")}}</dt>
- <dd>Devuelve el logaritmo en base 2 de x.</dd>
- <dt>{{jsxref("Global_Objects/Math/max", "Math.max([x[, y[, …]]])")}}</dt>
- <dd>Devuelve el mayor de cero o más números.</dd>
- <dt>{{jsxref("Global_Objects/Math/min", "Math.min([x[, y[, …]]])")}}</dt>
- <dd>Devuelve el más pequeño de cero o más números.</dd>
- <dt>{{jsxref("Global_Objects/Math/pow", "Math.pow(x, y)")}}</dt>
- <dd>Las devoluciones de base a la potencia de exponente, que es, baseexponent.</dd>
- <dt>{{jsxref("Global_Objects/Math/random", "Math.random()")}}</dt>
- <dd>Devuelve un número pseudo-aleatorio entre 0 y 1.</dd>
- <dt>{{jsxref("Global_Objects/Math/round", "Math.round(x)")}}</dt>
- <dd>Devuelve el valor de un número redondeado al número entero más cercano.</dd>
- <dt>{{jsxref("Global_Objects/Math/sign", "Math.sign(x)")}}</dt>
- <dd>Devuelve el signo de la x, que indica si x es positivo, negativo o cero.</dd>
- <dt>{{jsxref("Global_Objects/Math/sin", "Math.sin(x)")}}</dt>
- <dd>Devuelve el seno de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/sinh", "Math.sinh(x)")}}</dt>
- <dd>Devuelve el seno hiperbólico de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/sqrt", "Math.sqrt(x)")}}</dt>
- <dd>Devuelve la raíz cuadrada positiva de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/tan", "Math.tan(x)")}}</dt>
- <dd>Devuelve la tangente de un número.</dd>
- <dt>{{jsxref("Global_Objects/Math/tanh", "Math.tanh(x)")}}</dt>
- <dd>Devuelve la tangente hiperbólica de un número.</dd>
- <dt>
- <pre class="notranslate"><code>Math.toSource()</code> {{non-standard_inline}}</pre>
- </dt>
- <dd>Devuelve la cadena "<code>Math</code>".</dd>
- <dt>{{jsxref("Global_Objects/Math/trunc", "Math.trunc(x)")}}</dt>
- <dd>Devuelve la parte entera del número x, la eliminación de los dígitos fraccionarios.</dd>
-</dl>
-
-<h2 id="Extendiendo_el_objeto_Math">Extendiendo el objeto <code>Math</code></h2>
-
-<p>Como muchos de los objetos incluidos en JavaScript, el objeto <code>Math</code> puede ser extendido con propiedades y métodos personalizados. Para extender el objeto <code>Math</code> no se debe usar 'prototype'. Es posible extender directamente <code>Math</code>:</p>
-
-<pre class="brush: js notranslate">Math.propName = propValue;
-Math.methodName = methodRef;</pre>
-
-<p>Como demostración, el siguiente ejemplo agrega un método al objeto <code>Math</code> para calcular el <em>máximo común divisor</em> de una lista de argumentos.</p>
-
-<pre class="brush: js notranslate">/* Función variádica -- Retorna el máximo común divisor de una lista de argumentos */
-Math.gcd = function() {
-    if (arguments.length == 2) {
-        if (arguments[1] == 0)
-            return arguments[0];
-        else
-            return Math.gcd(arguments[1], arguments[0] % arguments[1]);
-    } else if (arguments.length &gt; 2) {
-        var result = Math.gcd(arguments[0], arguments[1]);
-        for (var i = 2; i &lt; arguments.length; i++)
-            result = Math.gcd(result, arguments[i]);
-        return result;
-    }
-};</pre>
-
-<p>Pruébalo:</p>
-
-<pre class="brush: js notranslate">console.log(Math.gcd(20, 30, 15, 70, 40)); // `5`</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición Inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8', 'Math')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math-object', 'Math')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Nuevos métodos {{jsxref("Math.log10()", "log10()")}}, {{jsxref("Math.log2()", "log2()")}}, {{jsxref("Math.log1p()", "log1p()")}}, {{jsxref("Math.expm1()", "expm1()")}}, {{jsxref("Math.cosh()", "cosh()")}}, {{jsxref("Math.sinh()", "sinh()")}}, {{jsxref("Math.tanh()", "tanh()")}}, {{jsxref("Math.acosh()", "acosh()")}}, {{jsxref("Math.asinh()", "asinh()")}}, {{jsxref("Math.atanh()", "atanh()")}}, {{jsxref("Math.hypot()", "hypot()")}}, {{jsxref("Math.trunc()", "trunc()")}}, {{jsxref("Math.sign()", "sign()")}}, {{jsxref("Math.imul()", "imul()")}}, {{jsxref("Math.fround()", "fround()")}}, {{jsxref("Math.cbrt()", "cbrt()")}} y {{jsxref("Math.clz32()", "clz32()")}} añadidos.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math-object', 'Math')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Math")}}</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/ln10/index.html b/files/es/web/javascript/referencia/objetos_globales/math/ln10/index.html
deleted file mode 100644
index 8b9f40b77b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/ln10/index.html
+++ /dev/null
@@ -1,84 +0,0 @@
----
-title: Math.LN10
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/LN10
-tags:
-  - JavaScript
-  - Math
-  - Property
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN10
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>Math.LN10</strong></code> representa el logaritmo natural de 10, aproximadamente 2.302:</p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LN10</mi></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mn>10</mn><mo stretchy="false">)</mo><mo>≈</mo><mn>2.302</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LN10}} = \ln(10) \approx 2.302</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-ln10.html")}}</div>
-
-<div> </div>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Porque <code>LN10</code> es una propiedad estática de <code>Math</code>, siempre usted lo usa como <code>Math.LN10</code>, en lugar de como una propiedad de un objeto <code>Math</code> creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_Math.LN10" name="Example:_Using_Math.LN10">Utilizando <code>Math.LN10</code></h3>
-
-<p>La función siguiente devuelve el logaritmo natural de 10:</p>
-
-<pre class="brush:js">function getNatLog10() {
-   return Math.LN10
-}
-
-getNatLog10(); // 2.302585092994046
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.1.2', 'Math.LN10')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.ln10', 'Math.LN10')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.ln10', 'Math.LN10')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.LN10")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log10()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/ln2/index.html b/files/es/web/javascript/referencia/objetos_globales/math/ln2/index.html
deleted file mode 100644
index 4a447f677a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/ln2/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: Math.LN2
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/LN2
-tags:
-  - JavaScript
-  - Math
-  - Property
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/LN2
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <strong><code>Math.LN2</code></strong> representa el logaritmo natural de 2, aproximadamente 0.693:</p>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LN2</mi></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mn>2</mn><mo stretchy="false">)</mo><mo>≈</mo><mn>0.693</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LN2}} = \ln(2) \approx 0.693</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-ln2.html")}}</div>
-
-<div> </div>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Como <code>LN2</code> es una propiedad estática de <code>Math</code>, siempre se usa como <code>Math.LN2</code>, en lugar de como una propiedad de un objeto <code>Math</code> que ha creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_Math.LN2" name="Example:_Using_Math.LN2">Utilizando <code>Math.LN2</code></h3>
-
-<p>La función siguiente devuelve el logaritmo natural de 2:</p>
-
-<pre class="brush: js">function getNatLog2() {
-  return Math.LN2;
-}
-
-getNatLog2(); // 0.6931471805599453</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.1.3', 'Math.LN2')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.ln2', 'Math.LN2')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.ln2', 'Math.LN2')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.LN2")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log2()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/log/index.html b/files/es/web/javascript/referencia/objetos_globales/math/log/index.html
deleted file mode 100644
index d243cd0501..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/log/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: Math.log()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/log
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/log
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.log()</code></strong> devuelve la base neutral de un número (base {{jsxref ("Math.E", "e")}})</p>
-
-<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>&gt;</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.log</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><mo lspace="0em" rspace="0em">ln</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>e</mi><mi>y</mi></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x &gt; 0, \mathtt{\operatorname{Math.log}(x)} = \ln(x) = \text{el unico} \; y \; \text{tal que} \; e^y = x</annotation></semantics></math></p>
-
-<p> </p>
-
-<p>La función en JavaScrcrip <strong><code>Math.log()</code></strong> es equivalente a <em>ln(x)</em> en matematicas.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-log.html")}}</div>
-
-
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.log(<var>x</var>)</code></pre>
-
-<h3 id="Parametetros">Parametetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Es un numero.</dd>
-</dl>
-
-<h3 id="Retorna_el_valor">Retorna el valor</h3>
-
-<p> </p>
-
-<p>La base natural (base {{jsxref("Math.E", "e")}}) del número dado. Si el número es negativo, se devuelve {{jsxref("NaN")}} </p>
-
-<h2 id="Descripcion">Descripcion</h2>
-
-<p>If the value of <code>x</code> is negative, the return value is always {{jsxref("NaN")}}.</p>
-
-<p>Because <code>log()</code> is a static method of <code>Math</code>, you always use it as <code>Math.log()</code>, rather than as a method of a <code>Math</code> object you created (<code>Math</code> is not a constructor).</p>
-
-<p>If you need the natural log of 2 or 10, use the constants {{jsxref("Math.LN2")}} or {{jsxref("Math.LN10")}} .  If you need a logarithm to base 2 or 10, use {{jsxref("Math.log2()")}} or {{jsxref("Math.log10()")}} .  If you need a logarithm to other bases, use Math.log(x) / Math.log(otherBase) as in the example below; you might want to precalculate 1 / Math.log(otherBase) .</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_Math.log()">Using <code>Math.log()</code></h3>
-
-<pre class="brush: js">Math.log(-1); // NaN, out of range
-Math.log(0);  // -Infinity
-Math.log(1);  // 0
-Math.log(10); // 2.302585092994046
-</pre>
-
-<h3 id="Using_Math.log()_with_a_different_base">Using <code>Math.log()</code> with a different base</h3>
-
-<p>The following function returns the logarithm of <code>y</code> with base <code>x</code> (ie. <math><semantics><mrow><msub><mo>log</mo><mi>x</mi></msub><mi>y</mi></mrow><annotation encoding="TeX">\log_x y</annotation></semantics></math>):</p>
-
-<pre class="brush: js">function getBaseLog(x, y) {
-  return Math.log(y) / Math.log(x);
-}
-</pre>
-
-<p>If you run <code>getBaseLog(10, 1000)</code> it returns <code>2.9999999999999996</code> due to floating-point rounding, which is very close to the actual answer of 3.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.10', 'Math.log')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.log', 'Math.log')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.log', 'Math.log')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.log")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log1p()")}}</li>
- <li>{{jsxref("Math.log10()")}}</li>
- <li>{{jsxref("Math.log2()")}}</li>
- <li>{{jsxref("Math.pow()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/log10/index.html b/files/es/web/javascript/referencia/objetos_globales/math/log10/index.html
deleted file mode 100644
index dc97208b63..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/log10/index.html
+++ /dev/null
@@ -1,137 +0,0 @@
----
-title: Math.log10()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/log10
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/log10
----
-<div>{{JSRef}}</div>
-
-<p><strong><code>Math.log10()</code></strong> funcion que retorna el logaritmo de base 10 de un numero, esto es</p>
-
-<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>&gt;</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.log10</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>10</mn></msub><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext>la unica</mtext><mspace width="thickmathspace"></mspace><mi>y tal que</mi><mspace width="thickmathspace"></mspace><mtext></mtext><mspace width="thickmathspace"></mspace><msup><mn>10</mn><mi>y</mi></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x &gt; 0, \mathtt{\operatorname{Math.log10}(x)} = \log_10(x) = \text{the unique} \; y \; \text{such that} \; 10^y = x</annotation></semantics></math></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">Math.log10(<var>x</var>)</pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un Numero</dd>
-</dl>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>El logaritmo de base 10 del numero dado. SI el numero es negativo, {{jsxref("NaN")}} es devuelto.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si el valor de x es menor que cero, el valor de retorno siempre es {{jsxref("NaN")}}.</p>
-
-<p>Porque <code>log10()</code> <code>es un metodo estatico de Math</code>, debe usarse siempre <code>Math.log10()</code>, en vez de usarse como un metodo del objeto math que se ha creado (<code>Math</code> no es un constructor).</p>
-
-<p>Esta función es equivalente de Math.log(x) / Math.log(10).  Para log10(e) use la constante {{jsxref("Math.LOG10E")}} que es 1 / {{jsxref("Math.LN10")}}.  </p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="usando_Math.log10()">usando <code>Math.log10()</code></h3>
-
-<pre class="brush: js">Math.log10(2);      // 0.3010299956639812
-Math.log10(1);      // 0
-Math.log10(0);      // -Infinito
-Math.log10(-2);     // NaN
-Math.log10(100000); // 5
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Puede ser emulada con la siguiente función</p>
-
-<pre class="brush: js">Math.log10 = Math.log10 || function(x) {
-  return Math.log(x) * Math.LOG10E;
-};
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.log10', 'Math.log10')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.log10', 'Math.log10')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatChrome("38")}}</td>
-   <td>{{CompatGeckoDesktop("25")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera("25")}}</td>
-   <td>{{CompatSafari("7.1")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("25")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_Tambien">Vea Tambien</h2>
-
-<ul>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log1p()")}}</li>
- <li>{{jsxref("Math.log2()")}}</li>
- <li>{{jsxref("Math.pow()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/log10e/index.html b/files/es/web/javascript/referencia/objetos_globales/math/log10e/index.html
deleted file mode 100644
index 755b6ceb1a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/log10e/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: Math.LOG10E
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/LOG10E
-tags:
-  - JavaScript
-  - Math
-  - Propiedad
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG10E
----
-<div>{{JSRef}}</div>
-
-<div> </div>
-
-<div>La propiedad <strong><code>Math.LOG10E</code></strong> representa el logaritmo base 10 de e, el cual es aproximadamente 0.434:</div>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.LOG10E</mi></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>10</mn></msub><mo stretchy="false">(</mo><mi>e</mi><mo stretchy="false">)</mo><mo>≈</mo><mn>0.434</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.LOG10E}} = \log_10(e) \approx 0.434</annotation></semantics></math></p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Debido a que LOG10E es una propiedad estatica del módulo Math, se debe de invocar siempre como Math.LOG10E, en lugar de invocarla como una propiedad de algun objeto Math que hayas creado ( Math no es un constructor ).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_Math.LOG10E">Utilizando <code>Math.LOG10E</code></h3>
-
-<p>La siguiente funcion regresa el logaritmo base 10 de e:</p>
-
-<pre class="brush:js">function getLog10e() {
-  return Math.LOG10E;
-}
-
-getLog10e(); // 0.4342944819032518
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>
-    <p>Definición inicial. Implementado en JavaScript 1.0.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.1.5', 'Math.LOG10E')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.log10e', 'Math.LOG10E')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.log10e', 'Math.LOG10E')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Navegadores_Compatibles">Navegadores Compatibles</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_tambien">Ver tambien</h2>
-
-<ul>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log10()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/log2/index.html b/files/es/web/javascript/referencia/objetos_globales/math/log2/index.html
deleted file mode 100644
index b394270684..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/log2/index.html
+++ /dev/null
@@ -1,96 +0,0 @@
----
-title: Math.log2()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/log2
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/log2
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.log2()</code></strong> retorna el logaritmo base 2 de un número, esto es</p>
-
-<p><math display="block"><semantics><mrow><mo>∀</mo><mi>x</mi><mo>&gt;</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mo lspace="0em" rspace="thinmathspace">Math.log2</mo><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msub><mo lspace="0em" rspace="0em">log</mo><mn>2</mn></msub><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mn>2</mn><mi>y</mi></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x &gt; 0, \mathtt{\operatorname{Math.log2}(x)} = \log_2(x) = \text{the unique} \; y \; \text{such that} \; 2^y = x</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-log2.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code>Math.log2(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El logaritmo base 2 del número usado como parámetro. Si el número es negativo, {{jsxref("NaN")}} será retornado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si el valor de <code>x</code> es mejor a 0, el valor de retorno es siempre {{jsxref("NaN")}}.</p>
-
-<p>Debido a que <code>log2()</code> es una función estática de <code>Math</code>, siempre debe ser usado como <code>Math.log2()</code>, en lugar de ser usado como un método del objeto <code>Math</code> (<code>Math</code> no es un constructor).</p>
-
-<p>Esta función es equivalente a Math.log(x) / Math.log(2).  Para log2(e) use la constante {{jsxref("Math.LOG2E")}} que es 1 / {{jsxref("Math.LN2")}}.  </p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.log2()">Usando <code>Math.log2()</code></h3>
-
-<pre class="brush: js">Math.log2(3);    // 1.584962500721156
-Math.log2(2);    // 1
-Math.log2(1);    // 0
-Math.log2(0);    // -Infinity
-Math.log2(-2);   // NaN
-Math.log2(1024); // 10
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>This Polyfill emulates the <code>Math.log2</code> function. Note that it returns imprecise values on some inputs (like 1 &lt;&lt; 29), wrap into {{jsxref("Math.round()")}} if working with bit masks.</p>
-
-<pre class="brush: js">Math.log2 = Math.log2 || function(x) {
-  return Math.log(x) * Math.LOG2E;
-};
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-math.log2', 'Math.log2')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.log2', 'Math.log2')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Math.log2")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.log10()")}}</li>
- <li>{{jsxref("Math.log1p()")}}</li>
- <li>{{jsxref("Math.pow()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/log2e/index.html b/files/es/web/javascript/referencia/objetos_globales/math/log2e/index.html
deleted file mode 100644
index f9593b4bc6..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/log2e/index.html
+++ /dev/null
@@ -1,27 +0,0 @@
----
-title: Math.LOG2E
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/LOG2E
-tags:
-  - JavaScript
-  - Math
-  - Property
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/LOG2E
----
-<div>
- {{JSRef("Objetos_globales", "Math")}}</div>
-<h2 id="Summary" name="Summary">Resumen</h2>
-<p>El base 2 del logaritmo natural de E (aproximadamente 1.442).</p>
-<div>
- {{js_property_attributes(0,0,0)}}</div>
-<h2 id="Description" name="Description">Descripción</h2>
-<p>Porque <code>LOG2E</code> es una propiedad estática de <code>Math</code>, siempre usted lo usa como <code>Math.LOG2E</code>, en lugar de una propedad de un objecto de <code>Math</code> usted creó.</p>
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-<h3 id="Example:_Using_Math.LOG2E" name="Example:_Using_Math.LOG2E">Ejemplo: Usar <code>Math.LOG2E</code></h3>
-<p>La función siguiente devuelve el base 2 del logaritmo natural del <code>E</code>:</p>
-<pre class="brush:js">function getLog2e() {
-   return Math.LOG2E
-}</pre>
-<h2 id="Ven_También">Ven También</h2>
-<ul>
- <li>El {{jsxref("Math")}} objeto.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/max/index.html b/files/es/web/javascript/referencia/objetos_globales/math/max/index.html
deleted file mode 100644
index 0e0f82881c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/max/index.html
+++ /dev/null
@@ -1,145 +0,0 @@
----
-title: Math.max()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/max
-tags:
-  - JavaScript
-  - Math
-  - Método(2)
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/max
----
-<div>{{JSRef("Global_Objects", "Math")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La función <strong><code>Math.max()</code></strong> devuelve el mayor de cero o más números.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.max([<var>valor1</var>[, <var>valor2</var>[, ...]]])</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>valor1, valor2, ...</code></dt>
- <dd>Números.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Ya que <code>max()</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.max()</code>, en lugar de un método de un objeto <code>Math</code> instanciado (<code>Math</code> no es un constructor).</p>
-
-<p>Si no se proporcionan argumentos, el resultado es -{{jsxref("Global_Objects/Infinity", "Infinity")}}.</p>
-
-<p>Si al menos uno de los argumentos no puede ser convertido a número, el resultado es {{jsxref("Global_Objects/NaN", "NaN")}}.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_Math.max" name="Example:_Using_Math.max">Ejemplo: Usando <code>Math.max()</code></h3>
-
-<pre class="brush: js">Math.max(10, 20);   //  20
-Math.max(-10, -20); // -10
-Math.max(-10, 20);  //  20
-</pre>
-
-<p>La siguiente función usa {{jsxref("Function.prototype.apply()")}} para encontrar el elemento mayor en un array numérico. <code>getMaxOfArray([1, 2, 3])</code> es equivalente a <code>Math.max(1, 2, 3)</code>, pero se puede usar <code>getMaxOfArray()</code> sobre arreglos construidos programáticamente de cualquier tamaño.</p>
-
-<pre class="brush: js">function getMaxOfArray(numArray) {
-  return Math.max.apply(null, numArray);
-}
-</pre>
-
-<p>O con el nuevo {{jsxref("Operadores/Spread_operator", "spread operator")}}, obtener el máximo de un arreglo se vuelve mucho más fácil.</p>
-
-<pre class="brush: js">var arr = [1, 2, 3];
-var max = Math.max(...arr);</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1ra Edición.</td>
-   <td>Estandar</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.11', 'Math.max')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.max', 'Math.max')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.max', 'Math.max')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{CompatibilityTable}}</span></h2>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Móvil (Gecko)</th>
-   <th>IE Móvil</th>
-   <th>Opera Móvil</th>
-   <th>Safari Móvil</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver además</h2>
-
-<ul>
- <li>{{jsxref("Math.min()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/min/index.html b/files/es/web/javascript/referencia/objetos_globales/math/min/index.html
deleted file mode 100644
index a2dbf8348a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/min/index.html
+++ /dev/null
@@ -1,150 +0,0 @@
----
-title: Math.min()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/min
-tags:
-  - JavaScript
-  - Math
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/min
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.min()</code></strong> devuelve el menor de cero o más números.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.min([<var>valor1</var>[, <var>valor2</var>[, ...]]])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor1, valor2, ...</code></dt>
- <dd>Números.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Ya que <code>min()</code> es un método estático de <code>Math</code>, siempre debe usarse como <code>Math.min()</code>, en lugar de como un método de un objeto <code>Math</code> instanciado (Math no es un constructor).</p>
-
-<p>Si no se proporcionan argumentos, el resultado es {{jsxref("Infinity")}}.</p>
-
-<p>Si al menos uno de los argumentos no puede ser convertido a número, el resultado es {{jsxref("NaN")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.min()">Usando <code>Math.min()</code></h3>
-
-<p>Lo siguiente encuentra el mínimo de <code>x</code> e <code>y</code> y lo asigna a <code>z</code>:</p>
-
-<pre class="brush: js">var x = 10, y = -20;
-var z = Math.min(x, y);
-</pre>
-
-<h3 id="Recortando_un_valor_con_Math.min()">Recortando un valor con <code>Math.min()</code></h3>
-
-<p><code>Math.min()</code> es a menudo usado para recortar un valor de tal manera que siempre sea menor o igual a un límite. Este ejemplo</p>
-
-<pre class="brush: js">var x = f(foo);
-
-if (x &gt; limite) {
-  x = limite;
-}
-</pre>
-
-<p>puede ser escrito de la siguiente manera</p>
-
-<pre class="brush: js">var x = Math.min(f(foo), limite);
-</pre>
-
-<p>{{jsxref("Math.max()")}} puede ser usado en una forma similar para recortar un valor en el otro extremo.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.12', 'Math.min')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.min', 'Math.min')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.min', 'Math.min')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Móvil (Gecko)</th>
-   <th>IE Móvil</th>
-   <th>Opera Móvil</th>
-   <th>Safari Móvil</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_además">Ver además</h2>
-
-<ul>
- <li>{{jsxref("Math.max()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/pi/index.html b/files/es/web/javascript/referencia/objetos_globales/math/pi/index.html
deleted file mode 100644
index d4428498cd..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/pi/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: Math.PI
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/PI
-tags:
-  - JavaScript
-  - Math
-  - Propiedad
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/PI
----
-<div>{{JSRef}}</div>
-
-<div>La propiedad <code><strong>Math.PI</strong></code> representa la relacion entre la longitud de la circunferencia de un circulo y su diametro, la cual es aproximadamente 3.14159.</div>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.PI</mi></mstyle><mo>=</mo><mi>π</mi><mo>≈</mo><mn>3.14159</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.PI}} = \pi \approx 3.14159</annotation></semantics></math></p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Debido a que PI es una propiedad estatica del modulo <strong><code>Math</code></strong>, siempre debes de utilizarla como <strong><code>Math.PI</code></strong>, en lugar de una propiedad de un objeto <strong><code>Math</code></strong> que tu hayas creado ( <strong><code>Math</code></strong> no es un constructor ).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_Math.PI">Utilizando <code>Math.PI</code></h3>
-
-<p>La siguiente función utiliza <strong><code>Math.PI</code></strong> para calcular la longitud de la circunferencia de un circulo mediante el radio del circulo proporcionado como parametro.</p>
-
-<pre class="brush: js">function calculaCircunferencia(radio) {
-  return 2 * Math.PI * radio;
-}
-
-calculaCircunferencia(1);  // 6.283185307179586
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>
-    <p>Definición inicial. Implementado en JavaScript 1.0.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.1.6', 'Math.PI')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.pi', 'Math.PI')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.pi', 'Math.PI')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Navegadores_Compatibles">Navegadores Compatibles</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_tambien">Ver tambien</h2>
-
-<ul>
- <li>{{jsxref("Math")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/pow/index.html b/files/es/web/javascript/referencia/objetos_globales/math/pow/index.html
deleted file mode 100644
index 7185cffede..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/pow/index.html
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: Math.pow()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/pow
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/pow
----
-<div>{{JSRef("Global_Objects", "Math")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La función  <strong><code>Math.pow()</code></strong> devuelve la  <code>base elevada al</code> <code>exponente</code> , esto es, <code>base<sup>exponente</sup></code>.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.pow(<var>base</var>, <var>exponente</var>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parametros</h3>
-
-<dl>
- <dt><code>base</code></dt>
- <dd>El número base.</dd>
- <dt><code>exponente</code></dt>
- <dd>El exponente utilizado para elevar la <code>base</code>.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>La función <strong><code>Math.pow()</code></strong> retorna la <code>base</code> elevada al <code>exponente</code>, es decir, <code>base<sup>exponente</sup></code>. La base y el exponente estan en el sistema numérico decimal.</p>
-
-<p>Puesto que <code>pow()</code> es un método estático de <code>Math</code>, siempre se utiliza como <code>Math.pow()</code>. Si la base es negativa y el exponente no es un número entero, el resultado será NaN.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example_Using_Math.pow" name="Example:_Using_Math.pow">Ejemplo: Usando <code>Math.pow()</code></h3>
-
-<pre class="brush: js">// simple
-Math.pow(7, 2);    // 49
-Math.pow(7, 3);    // 343
-Math.pow(2, 10);   // 1024
-// exponentes fraccionales
-Math.pow(4, 0.5);  // 2 (raíz cuadrada de 4)
-Math.pow(8, 1/3);  // 2 (raíz cúbica de 8)
-Math.pow(2, 0.5);  // 1.412135623730951 (raíz cuadrada de 2)
-Math.pow(2, 1/3);  // 1.2599210498948732 (raíz cúbica de 2)
-// exponentes con signo
-Math.pow(7, -2);   // 0.02040816326530612 (1/49)
-Math.pow(8, -1/3); // 0.5
-// bases con signo
-Math.pow(-7, 2);   // 49 (los cuadrados son positivos)
-Math.pow(-7, 3);   // -343 (El cubo de una base negativa puede ser negativo)
-Math.pow(-7, 0.5); // NaN (Los números negativos no tienen raíz cuadrada real)
-Math.pow(-7, 1/3); // NaN
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Estándar</td>
-   <td>Definición inicial implementada en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.13', 'Math.pow')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.pow', 'Math.pow')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.cbrt()")}} {{experimental_inline}}</li>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.sqrt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/random/index.html b/files/es/web/javascript/referencia/objetos_globales/math/random/index.html
deleted file mode 100644
index ace95bc0cf..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/random/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: Math.random()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/random
-tags:
-  - JavaScript
-  - Math
-  - Números Aleatorios
-  - Random
-  - Referências
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/random
----
-<div>{{JSRef("Global_Objects", "Math")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>La función <strong><code>Math.random()</code></strong> retorna un punto flotante, un número pseudo-aleatorio dentro del rango <code>[0, 1).</code> Esto es, desde el 0 (Incluido) hasta el 1 pero sin incluirlo (excluido), el cual se puede escalar hasta el rango deseado. La implementación selecciona la semilla inicial hasta el algoritmo que genera el número aleatorio; este no puede ser elegido o cambiado por el usuario.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> <code>Math.random()</code> <strong>NO</strong> provee números aleatorios con seguridad criptográfica. No deben ser usados para algo relacionado con seguridad. En vez de eso, usar la API Web Crypto, y más precisamente el método: {{domxref("RandomSource.getRandomValues()", "window.crypto.getRandomValues()")}}.</p>
-</div>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.random()</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<p>Ninguno.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_Math.random" name="Example:_Using_Math.random">Ejemplo: Usando <code>Math.random()</code></h3>
-
-<p>Notar que, como los números en Javascript son números de punto flotante IEEE 754 con redondeo-al-par-más-cercano, los rangos generados por las funciones de abajo (excluyendo a <code>Math.random()</code> en sí misma) no son exactos. Si se eligen límites extremadamente grandes (2<sup>53</sup> o más), es posible, en casos extremadamente raros, calcular el generalmente-excluído límite superior.</p>
-
-<pre class="brush: js">// Retorna un número aleatorio entre 0 (incluido) y 1 (excluido)
-function getRandom() {
-  return Math.random();
-}
-</pre>
-
-<pre class="brush: js">// Retorna un número aleatorio entre min (incluido) y max (excluido)
-function getRandomArbitrary(min, max) {
-  return Math.random() * (max - min) + min;
-}
-</pre>
-
-<pre class="brush: js">// Retorna un entero aleatorio entre min (incluido) y max (excluido)
-// ¡Usando Math.round() te dará una distribución no-uniforme!
-function getRandomInt(min, max) {
-  return Math.floor(Math.random() * (max - min)) + min;
-}
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1a Edición.</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. JavaScript 1.0 (Sólo UNIX) / JavaScript 1.1 (Todas las plataformas).</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.14', 'Math.random')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.random', 'Math.random')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/round/index.html b/files/es/web/javascript/referencia/objetos_globales/math/round/index.html
deleted file mode 100644
index 0257148e69..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/round/index.html
+++ /dev/null
@@ -1,218 +0,0 @@
----
-title: Math.round()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/round
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/round
----
-<div>{{JSRef}}</div>
-
-<div>La función <strong><code>Math.round() </code></strong><code>retorna el valor de un número redondeado al entero más cercano.</code></div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>Devuelve el valor del número dado redondeado al entero más cercano.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Math.round(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<dl>
- <dd>El valor del número dado redondeado al entero más cercano.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si la porción fraccionaría del número es 0.5 o mayor, el argumento es redondeado al siguiente número entero superior. Si la porción de la fracción del número es menor a 0.5, el argumento es redondeado al siguiente número entero inferior.</p>
-
-<p>Debido a que round() es un método estático de Math, siempre se debe utilizar como  Math.round(),  en vez de un método del objeto Math que ha creado. (Math no es un constructor)</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.round">Usando <code>Math.round()</code></h3>
-
-<pre class="brush: js notranslate">// Retorna el valor 20
-x = Math.round(20.49);
-
-// Retorna el valor 21
-x = Math.round(20.5);
-
-// Retorna el valor -20
-x = Math.round(-20.5);
-
-// Retorna el valor -21
-x = Math.round(-20.51);
-
-// Retorna el valor 1 (!)
-// Note el error de redondeo debido a la inexactitud del punto aritmético.
-// Compare esto con Math.round10(1.005, -2) de el ejemplo de abajo.
-x = Math.round(1.005*100)/100;
-</pre>
-
-<h3 id="Redondeo_decimal">Redondeo decimal</h3>
-
-<pre class="brush: js notranslate">// Conclusión
-(function() {
-  /**
-   * Ajuste decimal de un número.
-   *
-   * @param {String}  tipo  El tipo de ajuste.
-   * @param {Number}  valor El numero.
-   * @param {Integer} exp   El exponente (el logaritmo 10 del ajuste base).
-   * @returns {Number} El valor ajustado.
-   */
-  function decimalAdjust(type, value, exp) {
-    // Si el exp no está definido o es cero...
-    if (typeof exp === 'undefined' || +exp === 0) {
-      return Math[type](value);
-    }
-    value = +value;
-    exp = +exp;
-    // Si el valor no es un número o el exp no es un entero...
-    if (isNaN(value) || !(typeof exp === 'number' &amp;&amp; exp % 1 === 0)) {
-      return NaN;
-    }
-    // Shift
-    value = value.toString().split('e');
-    value = Math[type](+(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp)));
-    // Shift back
-    value = value.toString().split('e');
-    return +(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp));
-  }
-
-  // Decimal round
-  if (!Math.round10) {
-    Math.round10 = function(value, exp) {
-      return decimalAdjust('round', value, exp);
-    };
-  }
-  // Decimal floor
-  if (!Math.floor10) {
-    Math.floor10 = function(value, exp) {
-      return decimalAdjust('floor', value, exp);
-    };
-  }
-  // Decimal ceil
-  if (!Math.ceil10) {
-    Math.ceil10 = function(value, exp) {
-      return decimalAdjust('ceil', value, exp);
-    };
-  }
-})();
-
-// Round
-Math.round10(55.55, -1);   // 55.6
-Math.round10(55.549, -1);  // 55.5
-Math.round10(55, 1);       // 60
-Math.round10(54.9, 1);     // 50
-Math.round10(-55.55, -1);  // -55.5
-Math.round10(-55.551, -1); // -55.6
-Math.round10(-55, 1);      // -50
-Math.round10(-55.1, 1);    // -60
-Math.round10(1.005, -2);   // 1.01 -- compare this with Math.round(1.005*100)/100 above
-// Floor
-Math.floor10(55.59, -1);   // 55.5
-Math.floor10(59, 1);       // 50
-Math.floor10(-55.51, -1);  // -55.6
-Math.floor10(-51, 1);      // -60
-// Ceil
-Math.ceil10(55.51, -1);    // 55.6
-Math.ceil10(51, 1);        // 60
-Math.ceil10(-55.59, -1);   // -55.5
-Math.ceil10(-59, 1);       // -50
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>
-    <p>Definición inicial. Implementada en JavaScript 1.0.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.15', 'Math.round')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.round', 'Math.round')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Math.abs()")}}</li>
- <li>{{jsxref("Math.ceil()")}}</li>
- <li>{{jsxref("Math.floor()")}}</li>
- <li>{{jsxref("Math.sign()")}} {{experimental_inline}}</li>
- <li>{{jsxref("Math.trunc()")}} {{experimental_inline}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/seno/index.html b/files/es/web/javascript/referencia/objetos_globales/math/seno/index.html
deleted file mode 100644
index a89a6e635e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/seno/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: Math.sin()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/seno
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/sin
----
-<div>{{JSRef("Global_Objects", "Math")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La función <strong><code>Math.sin()</code></strong><code> devuelve el seno de un número</code>.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.sin(<var>x</var>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número (en radianes).</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>El método <code>Math.sin()</code> devuelve  un valor numérico entre -1 y 1, que representa el seno del ángulo dado en radianes.<br>
- Debido a que <code>sin()</code> es un método estático de <code>Math</code>, siempre se usa como <code>Math.sin()</code>, en vez de  crear un objeto <code>Math</code> y usarlo como un método (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_Math.sin" name="Example:_Using_Math.sin">Ejemplo: Usando <code>Math.sin()</code></h3>
-
-<pre class="brush: js">Math.sin(0);           // 0
-Math.sin(1);           // 0.8414709848078965
-
-Math.sin(Math.PI / 2); // 1
-</pre>
-
-<h2 id="Specifications" name="Specifications">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1ª Edición.</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.16', 'Math.sin')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.sin', 'Math.sin')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.acos()")}}</li>
- <li>{{jsxref("Math.asin()")}}</li>
- <li>{{jsxref("Math.atan()")}}</li>
- <li>{{jsxref("Math.atan2()")}}</li>
- <li>{{jsxref("Math.cos()")}}</li>
- <li>{{jsxref("Math.tan()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/sign/index.html b/files/es/web/javascript/referencia/objetos_globales/math/sign/index.html
deleted file mode 100644
index 3c48027556..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/sign/index.html
+++ /dev/null
@@ -1,151 +0,0 @@
----
-title: Math.sign()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/sign
-tags:
-  - JavaScript
-  - Math
-  - Method
-  - Reference
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/sign
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.sign()</code></strong> retorna el signo de un número, indicando si el número es positivo, negativo o cero.</p>
-
-<h2 id="Syntaxis">Syntaxis</h2>
-
-<pre class="syntaxbox"><code>Math.sign(<var>x</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno.">Valor de retorno.</h3>
-
-<p>Un número representando el signo del argumento dado. Si el argumento es un número positivo, negativo, cero positivo, o cero negativo, la función retornará <code>1</code>, <code>-1</code>, <code>0</code> or <code>-0</code> respectivamente. De lo contrario, retorna {{jsxref("NaN")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Como <code>sign()</code> es un método estático de <code>Math</code>, siempre se utiliza como <code>Math.sign()</code>, en vez de un método de un objeto Math que hayas creado. (<code>Math</code> no es un constructor).</p>
-
-<p>Esta función tiene 5 tipos de valores de retorno, <code>1</code>, <code>-1</code>, <code>0</code>, <code>-0</code>, <code>NaN</code>, que representan "número positivo", "número negativo", "cero positivo", "cero negativo" y {{jsxref("NaN")}} respectivamente.</p>
-
-<p>El argumento pasado a esta función será convertido a tipo <code>x</code> implicitamente.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.sign()">Usando <code>Math.sign()</code></h3>
-
-<pre class="brush: js">Math.sign(3);     //  1
-Math.sign(-3);    // -1
-Math.sign('-3');  // -1
-Math.sign(0);     //  0
-Math.sign(-0);    // -0
-Math.sign(NaN);   // NaN
-Math.sign('foo'); // NaN
-Math.sign();      // NaN
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">if (!Math.sign) {
-  Math.sign = function(x) {
-    // Si x es NaN, el resultado es NaN.
-    // Si x es -0, el resultado es -0.
-    // Si x es +0, el resultado es +0.
-    // Si x es negativo y no -0, el resultado es -1.
-    // Si x es positivo y no +0, el resultado es +1.
-    x = +x; // convertir a número
-    if (x === 0 || isNaN(x)) {
-      return Number(x);
-    }
-    return x &gt; 0 ? 1 : -1;
-  };
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.sign', 'Math.sign')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.sign', 'Math.sign')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Propiedad</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("38")}}</td>
-   <td>{{CompatGeckoDesktop("25")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera("25")}}</td>
-   <td>{{CompatSafari("9")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Propiedad</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("25")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_También">Ver También</h2>
-
-<ul>
- <li>{{jsxref("Math.abs()")}}</li>
- <li>{{jsxref("Math.ceil()")}}</li>
- <li>{{jsxref("Math.floor()")}}</li>
- <li>{{jsxref("Math.round()")}}</li>
- <li>{{jsxref("Math.trunc()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/sqrt/index.html b/files/es/web/javascript/referencia/objetos_globales/math/sqrt/index.html
deleted file mode 100644
index a3977c6f08..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/sqrt/index.html
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: Math.sqrt()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/sqrt
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/sqrt
----
-<div>{{JSRef}}</div>
-
-<p>La  función <strong><code>Math.sqrt()</code></strong> retorna la raíz cuadrada de un número, que es<math display="block"><semantics><mrow><mi>x</mi><mo>≥</mo><mn>0</mn><mo>,</mo><mstyle mathvariant="monospace"><mrow><mi>M</mi><mi>a</mi><mi>t</mi><mi>h</mi><mo>.</mo><mi>s</mi><mi>q</mi><mi>r</mi><mi>t</mi><mo stretchy="false">(</mo><mi>x</mi><mo stretchy="false">)</mo></mrow></mstyle><mo>=</mo><msqrt><mi>x</mi></msqrt><mo>=</mo><mtext>the unique</mtext><mspace width="thickmathspace"></mspace><mi>y</mi><mo>≥</mo><mn>0</mn><mspace width="thickmathspace"></mspace><mtext>such that</mtext><mspace width="thickmathspace"></mspace><msup><mi>y</mi><mn>2</mn></msup><mo>=</mo><mi>x</mi></mrow><annotation encoding="TeX">\forall x \geq 0, \mathtt{Math.sqrt(x)} = \sqrt{x} = \text{the unique} \; y \geq 0 \; \text{such that} \; y^2 = x</annotation></semantics></math></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.sqrt(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un numero</dd>
-</dl>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>La raíz cuadrada del número proporcionado. Si los números son negativos, {{jsxref("NaN")}} es devuelto.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si el valor de <code>x</code> es negativo <code>Math.sqrt()</code> retorna {{jsxref("NaN")}}.</p>
-
-<p>Debido a que <code>sqrt()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.sqrt()</code>, en lugar de un método del objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.sqrt()">Usando <code>Math.sqrt()</code></h3>
-
-<pre class="brush: js">Math.sqrt(9); // 3
-Math.sqrt(2); // 1.414213562373095
-
-Math.sqrt(1);  // 1
-Math.sqrt(0);  // 0
-Math.sqrt(-1); // NaN
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.2.17', 'Math.sqrt')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.sqrt', 'Math.sqrt')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.sqrt', 'Math.sqrt')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad">Compatibilidad</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.cbrt()")}}</li>
- <li>{{jsxref("Math.exp()")}}</li>
- <li>{{jsxref("Math.log()")}}</li>
- <li>{{jsxref("Math.pow()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/sqrt1_2/index.html b/files/es/web/javascript/referencia/objetos_globales/math/sqrt1_2/index.html
deleted file mode 100644
index de9bd99eb9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/sqrt1_2/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: Math.SQRT1_2
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/SQRT1_2
-tags:
-  - JavaScript
-  - Math
-  - Propiedad
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT1_2
----
-<div>{{JSRef}}</div>
-
-<div>La propiedad <strong><code>Math.SQRT1_2</code></strong> representa la raiz cuadrada de 1/2, la cual es equivalente al inverso de la raiz cuadrada de 2, aproximadadamente 0.707:</div>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.SQRT1_2</mi></mstyle><mo>=</mo><msqrt><mfrac><mn>1</mn><mn>2</mn></mfrac></msqrt><mo>=</mo><mfrac><mn>1</mn><msqrt><mn>2</mn></msqrt></mfrac><mo>≈</mo><mn>0.707</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.SQRT1_2}} = \sqrt{\frac{1}{2}} = \frac{1}{\sqrt{2}} \approx 0.707</annotation></semantics></math></p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Debido a que SQRT1_2 es una propiedad estatica de Math, siempre debes utilizarla como Math.SQRT1_2, en lugar de invocarla como una propiedad de alguna instancia de Math que hayas creado ( Math no es un constructor ).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_Math.SQRT1_2">Utilizando <code>Math.SQRT1_2</code></h3>
-
-<p>La siguiente funcion regresa la raiz cuadrada de 1/2:</p>
-
-<pre class="brush:js">function getRoot1_2() {
-  return Math.SQRT1_2;
-}
-
-getRoot1_2(); // 0.7071067811865476
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en Javascript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.1.7', 'Math.SQRT1_2')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.sqrt1_2', 'Math.SQRT1_2')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.sqrt1_2', 'Math.SQRT1_2')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Navegadores_Compatibles">Navegadores Compatibles</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_Tambien">Ver Tambien</h2>
-
-<ul>
- <li>{{jsxref("Math.pow()")}}</li>
- <li>{{jsxref("Math.sqrt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/sqrt2/index.html b/files/es/web/javascript/referencia/objetos_globales/math/sqrt2/index.html
deleted file mode 100644
index 7e23295f25..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/sqrt2/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: Math.SQRT2
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/SQRT2
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/SQRT2
----
-<div>{{JSRef}}</div>
-
-<div>La propiedad <strong>Math.SQRT2</strong> representa la raíz cuadrada de de 2, aproximadamente 1.414:</div>
-
-<p><math display="block"><semantics><mrow><mstyle mathvariant="monospace"><mi>Math.SQRT2</mi></mstyle><mo>=</mo><msqrt><mn>2</mn></msqrt><mo>≈</mo><mn>1.414</mn></mrow><annotation encoding="TeX">\mathtt{\mi{Math.SQRT2}} = \sqrt{2} \approx 1.414</annotation></semantics></math></p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Debido a que SQRT2 es una propiedad estática de <code>Math</code>, siempre se utiliza como <code>Math.SQRT2</code>, en lugar de una propiedad de un objeto <code>Math</code> creado<code>.</code></p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_Math.SQRT2">Utilizando Math.SQRT2</h3>
-
-<p>La siguiente función retorna la raíz cuadrada de 2:</p>
-
-<pre class="brush: js">function getRoot2() {
-  return Math.SQRT2;
-}
-
-getRoot2(); // 1.4142135623730951
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>
-    <p>Definición inicial. Implementada en JavaScript 1.0.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.8.1.8', 'Math.SQRT2')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.sqrt2', 'Math.SQRT2')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.sqrt2', 'Math.SQRT2')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"> </h2>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.pow()")}}</li>
- <li>{{jsxref("Math.sqrt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/tan/index.html b/files/es/web/javascript/referencia/objetos_globales/math/tan/index.html
deleted file mode 100644
index 8a773b0da5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/tan/index.html
+++ /dev/null
@@ -1,82 +0,0 @@
----
-title: Math.tan()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/tan
-tags:
-  - Matemáticas
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/tan
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.tan()</code></strong> retorna la tangente de un número.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-tan.html")}}</div>
-
-<p class="hidden">La fuente para este ejemplo interactivo se encuentra almacenada en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor, clona el repositorio en este link: <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un <em>Pull Request</em>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.tan(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número que representa un ángulo en radianes.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>La tangente del número proporcionado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>Math.tan()</code> retorna un valor numérico que representa la tangente de un ángulo.</p>
-
-<p>Dado que <code>tan()</code> es un método estático de <code>Math</code>, siempre debes usarlo como <code>Math.tan()</code>, y no como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.tan">Usando <code>Math.tan()</code></h3>
-
-<pre class="brush: js">Math.tan(1); // 1.5574077246549023
-</pre>
-
-<p>Ya que la función <code>Math.tan()</code> acepta radianes, pero es más fácil trabajar con grados, la siguiente función acepta un valor en grados, lo convierte a radianes, y retorna la tangente de dicho valor.</p>
-
-<pre class="brush: js">function getTanDeg(deg) {
-  var rad = deg * Math.PI/180;
-  return Math.tan(rad);
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.tan', 'Math.tan')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quieres contribuir a los datos, por favor consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>, y envíanos un <em>Pull Request</em>.</p>
-
-<p>{{Compat("javascript.builtins.Math.tan")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Math.acos()")}}</li>
- <li>{{jsxref("Math.asin()")}}</li>
- <li>{{jsxref("Math.atan()")}}</li>
- <li>{{jsxref("Math.atan2()")}}</li>
- <li>{{jsxref("Math.cos()")}}</li>
- <li>{{jsxref("Math.sin()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/tanh/index.html b/files/es/web/javascript/referencia/objetos_globales/math/tanh/index.html
deleted file mode 100644
index 138c466b37..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/tanh/index.html
+++ /dev/null
@@ -1,95 +0,0 @@
----
-title: Math.tanh()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/tanh
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/tanh
----
-<div>{{JSRef}}</div>
-
-<p>La funcion <strong><code>Math.tanh()</code></strong> devuelve la hyperbolica tangente de un numero, esto es </p>
-
-<p><math display="block"><semantics><mrow><mo lspace="0em" rspace="0em">tanh</mo><mi>x</mi><mo>=</mo><mfrac><mrow><mo lspace="0em" rspace="0em">sinh</mo><mi>x</mi></mrow><mrow><mo lspace="0em" rspace="0em">cosh</mo><mi>x</mi></mrow></mfrac><mo>=</mo><mfrac><mrow><msup><mi>e</mi><mi>x</mi></msup><mo>-</mo><msup><mi>e</mi><mrow><mo>-</mo><mi>x</mi></mrow></msup></mrow><mrow><msup><mi>e</mi><mi>x</mi></msup><mo>+</mo><msup><mi>e</mi><mrow><mo>-</mo><mi>x</mi></mrow></msup></mrow></mfrac><mo>=</mo><mfrac><mrow><msup><mi>e</mi><mrow><mn>2</mn><mi>x</mi></mrow></msup><mo>-</mo><mn>1</mn></mrow><mrow><msup><mi>e</mi><mrow><mn>2</mn><mi>x</mi></mrow></msup><mo>+</mo><mn>1</mn></mrow></mfrac></mrow><annotation encoding="TeX">\tanh x = \frac{\sinh x}{\cosh x} = \frac {e^x - e^{-x}} {e^x + e^{-x}} = \frac{e^{2x} - 1}{e^{2x}+1}</annotation></semantics></math></p>
-
-<div>{{EmbedInteractiveExample("pages/js/math-tanh.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Math.tanh(<var>x</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un numero.</dd>
-</dl>
-
-<h3 id="Devolver_valor">Devolver valor</h3>
-
-<p>La hyperbolica tangente del numero obtenido.</p>
-
-<h2 id="Descripcion">Descripcion</h2>
-
-<p>Porque <code>tanh()</code> es un metodo estatico de <code>Math</code>, siempre se usa como <code>Math.tanh()</code>, en lugar de ser un metodo de <code>Math</code> objeto que creas (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Math.tanh()">Usando <code>Math.tanh()</code></h3>
-
-<pre class="brush: js">Math.tanh(0);        // 0
-Math.tanh(Infinity); // 1
-Math.tanh(1);        // 0.7615941559557649
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Esto puede ser emulado con ayuda de {{jsxref("Math.exp()")}} funcion:</p>
-
-<pre class="brush: js">Math.tanh = Math.tanh || function(x){
-    var a = Math.exp(+x), b = Math.exp(-x);
-    return a == Infinity ? 1 : b == Infinity ? -1 : (a - b) / (a + b);
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificacion</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-math.tanh', 'Math.tanh')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>
-    <p>Definicion inicial.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.tanh', 'Math.tanh')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">La compatibilidad de la tabla en esta pagina esta generada desde una structura data. Si quiers contribuir a la data, visita  <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un propuesta.</p>
-
-<p>{{Compat("javascript.builtins.Math.tanh")}}</p>
-
-<h2 id="sect1"> </h2>
-
-<ul>
- <li>{{jsxref("Math.acosh()")}}</li>
- <li>{{jsxref("Math.asinh()")}}</li>
- <li>{{jsxref("Math.atanh()")}}</li>
- <li>{{jsxref("Math.cosh()")}}</li>
- <li>{{jsxref("Math.sinh()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/math/trunc/index.html b/files/es/web/javascript/referencia/objetos_globales/math/trunc/index.html
deleted file mode 100644
index 9efe511927..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/math/trunc/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Math.trunc()
-slug: Web/JavaScript/Referencia/Objetos_globales/Math/trunc
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Math
-  - Método(2)
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Math/trunc
----
-<div>{{JSRef}}</div>
-
-<p>La función <strong><code>Math.trunc()</code></strong> devuelve la parte entera de un numero removiendo cualquier dígito decimal (dígitos situados después de la coma).</p>
-
-<h2 id="Sintaxis.">Sintaxis.</h2>
-
-<pre class="syntaxbox notranslate"><code>Math.trunc(<var>x</var>)</code></pre>
-
-<h3 id="Parámetros.">Parámetros.</h3>
-
-<dl>
- <dt><code>x</code></dt>
- <dd>Un número.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno.">Valor de retorno.</h3>
-
-<p>La parte entera del número dado.</p>
-
-<h2 id="Descripción.">Descripción.</h2>
-
-<p>A diferencia de los otros tres métodos de <code>Math</code>: {{jsxref("Math.floor()")}}, {{jsxref("Math.ceil()")}} y {{jsxref("Math.round()")}}, la forma en que <code>Math.trunc()</code> funciona es muy simple.  <em>trunca</em> (corta) el punto y los dígitos a la derecha de él, sin importar si el argumento es un número positivo o negativo.</p>
-
-<p>Si el argumento es un número positivo, <code>Math.trunc()</code> es equivalente a <code>Math.floor();</code> de otra forma <code>Math.trunc()</code> es equivalente a <code>Math.ceil()</code>.</p>
-
-<p>El argumento pasado a este método será convertido a un tipo numérico entero.</p>
-
-<p>Debido a que <code>trunc()</code> es un método estático de <code>Math</code>, siempre úsalo como <code>Math.trunc()</code>, en lugar de como un método de un objeto <code>Math</code> que hayas creado (<code>Math</code> no es un constructor).</p>
-
-<h2 id="Ejemplos.">Ejemplos.</h2>
-
-<h3 id="Usando_Math.trunc">Usando <code>Math.trunc()</code></h3>
-
-<pre class="brush: js notranslate">Math.trunc(13.37);    // 13
-Math.trunc(42.84);    // 42
-Math.trunc(0.123);    //  0
-Math.trunc(-0.123);   // -0
-Math.trunc('-1.123'); // -1
-Math.trunc(NaN);      // NaN
-Math.trunc('foo');    // NaN
-Math.trunc();         // NaN
-</pre>
-
-<h2 id="Polyfill.">Polyfill.</h2>
-
-<pre class="brush: js notranslate">Math.trunc = Math.trunc || function (x) {
-    return (x &lt; 0 ? Math.ceil(x) : Math.floor(x));
-}
-</pre>
-
-<h2 id="Especificaciones.">Especificaciones.</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-math.trunc', 'Math.trunc')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-math.trunc', 'Math.trunc')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores.">Compatibilidad con navegadores.</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("38")}}</td>
-   <td>{{CompatGeckoDesktop("25")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera("25")}}</td>
-   <td>{{CompatSafari("7.1")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("25")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también.">Vea también.</h2>
-
-<ul>
- <li>{{jsxref("Math.abs()")}}</li>
- <li>{{jsxref("Math.ceil()")}}</li>
- <li>{{jsxref("Math.floor()")}}</li>
- <li>{{jsxref("Math.round()")}}</li>
- <li>{{jsxref("Math.sign()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/nan/index.html b/files/es/web/javascript/referencia/objetos_globales/nan/index.html
deleted file mode 100644
index f107f1bb3c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/nan/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: NaN
-slug: Web/JavaScript/Referencia/Objetos_globales/NaN
-tags:
-  - JavaScript
-  - Propiedad
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/NaN
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<div>
-<p dir="ltr" id="tw-target-text">La propiedad global <code>NaN</code> es un valor que representa Not-A-Number.</p>
-</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>Un valor representando un Not-A-Number (No es Un Número).</p>
-
-<p>{{js_property_attributes(0,0,0)}}</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<p><code>NaN</code></p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p><code>NaN</code> es una propiedad del <em>global object (objeto global)</em>, por ejemplo, es una variable de alcance global.</p>
-
-<p>El valor inicial de <code>NaN</code> es Not-A-Number (No es Un Número) - lo mismo que el valor de {{jsxref("Number.NaN")}}.</p>
-
-<p><span class="comment">Keep text below in sync with Number.NaN page</span> <code>NaN</code> nunca es equivalente con cualquier otro número, incluido el mismo <code>NaN</code>; no puedes chequear el valor de un not-a-number comparándolo con <code>Number.NaN</code>. Usar la función {{jsxref("isNaN()")}} para aquello.</p>
-
-<p>Muchos métodos de JavaScript (como son el {{jsxref("Number")}} constructor, {{jsxref("parseFloat")}} y {{jsxref("parseInt")}}) retornan <code>NaN</code> si el valor especificado en el parámetro no puede ser parseado como un número.</p>
-
-<p><span class="hps">Puedes utilizar</span> <span class="hps">la propiedad</span> <code>NaN</code> <span class="hps">para indicar</span> <span class="hps">una condición de error</span> <span class="hps">para</span> tu<span class="hps"> función</span> <span class="hps">que devuelva un número</span> <span class="hps">en caso de éxito</span><span>.</span></p>
-
-<p>JavaScript imprime el valor <code>Number.NaN</code> como <code>NaN</code>.</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number.NaN")}}</li>
- <li>{{jsxref("Number.isNaN()")}}</li>
- <li>{{jsxref("Objetos_globales/isNaN", "isNaN()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/null/index.html b/files/es/web/javascript/referencia/objetos_globales/null/index.html
deleted file mode 100644
index 94d1a392c5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/null/index.html
+++ /dev/null
@@ -1,129 +0,0 @@
----
-title: 'null'
-slug: Web/JavaScript/Referencia/Objetos_globales/null
-tags:
-  - JavaScript
-  - Literal
-  - Primitivo
-translation_of: Web/JavaScript/Reference/Global_Objects/null
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El valor <code>null</code> es un literal de Javascript que representa intencionalmente un valor nulo o "vacío". Es uno de los {{Glossary("Primitive", "valores primitivos")}} de Javascript.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/globalprops-null.html")}}</div>
-
-
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>null </code></pre>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>El valor <code>null</code> es un literal (no una propiedad del objeto global como podría ser <code>{{jsxref("undefined", "undefined")}}</code>). En APIs, se devuelve <code>null</code> normalmente dónde se espera un objeto pero éste no es relevante. Al comparar con <code style="font-style: normal;">null</code> o  <code>{{jsxref("undefined", "undefined")}}</code><code> </code>hay que tener en cuenta las <a href="/es/docs/Web/JavaScript/Referencia/Operadores/Comparison_Operators">diferencias entre los operadores de igualdad (==) e identidad (===) </a>(con el primero se realiza una conversión de tipo).</p>
-
-<pre class="brush: js">// foo no existe, no está definido y nunca ha sido inicializado:
-&gt; foo
-"ReferenceError: foo is not defined"
-
-// foo existe, pero no tiene tipo ni valor:
-&gt; var foo = null; foo
-"null"
-</pre>
-
-<h3 id="Diferencias_entre_null_y_undefined">Diferencias entre <code>null</code> y <code>undefined</code></h3>
-
-<pre class="brush: js">typeof null        // object (bug en ECMAScript, debería ser null)
-typeof undefined   // undefined
-null === undefined // false
-null  == undefined // true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Standard</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-4.3.11', 'null value')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-null-value', 'null value')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Véase también</h2>
-
-<ul>
- <li>{{jsxref("undefined", "undefined")}}</li>
- <li>{{jsxref("NaN", "NaN")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/index.html b/files/es/web/javascript/referencia/objetos_globales/number/index.html
deleted file mode 100644
index 72c1425b8b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/index.html
+++ /dev/null
@@ -1,181 +0,0 @@
----
-title: Number
-slug: Web/JavaScript/Referencia/Objetos_globales/Number
-tags:
-  - JavaScript
-  - Number
-  - Referencia
-  - Referência(2)
-translation_of: Web/JavaScript/Reference/Global_Objects/Number
----
-<div>{{JSRef}}</div>
-
-<p><strong><code>Number</code></strong> es un objeto primitivo envolvente que permite representar y manipular valores numéricos cómo 37 o -9.25. El constructor Number contiene constantes y métodos para trabajar con números. Valores de otro tipo pueden ser convertidos a números usando la función Number().</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">new Number(<em>value</em>);
-var <em>a</em> = new Number('123'); // a === 123 es false
-var <em>b</em> = Number('123'); // b === 123 es true
-<em>a</em> instanceof Number; // es true
-<em>b</em> instanceof Number; // es false</pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor</code></dt>
- <dd>El valor numérico de un objeto que está siendo creado.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Los principales usos del objeto <code>Number(valor)</code> son convertir un string u otro valor a uno de tipo numérico; si el argumento no puede ser convertido a un número, devuelve {{jsxref("NaN")}}.</p>
-
-<h3 id="Literal_syntax">Literal syntax</h3>
-
-<pre class="notranslate">123    // one-hundred twenty-three
-123.0  // same
-123 === 123.0  // true</pre>
-
-<h3 id="Function_syntax">Function syntax</h3>
-
-<pre class="notranslate">Number('123')  // retorna el número 123
-Number('123') === 123  // retorna true
-
-Number("unicorn")  // NaN
-Number(undefined)  // NaN</pre>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/Number"><code>Number()</code></a></dt>
- <dd>Crea un nuevo valor Numérico ( <code>Number</code> value).</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("Number.EPSILON")}}</dt>
- <dd>El intervalo más pequeño entre dos números representables</dd>
- <dt>{{jsxref("Number.MAX_SAFE_INTEGER")}}</dt>
- <dd>El número máximo representable en JavaScript (<code>2<sup>53</sup> - 1</code>).</dd>
- <dt>{{jsxref("Number.MAX_VALUE")}}</dt>
- <dd>El número más grande representable.</dd>
- <dt>{{jsxref("Number.MIN_SAFE_INTEGER")}}</dt>
- <dd>El número mínimo representable en JavaScript (<code>-(2<sup>53</sup> - 1)</code>).</dd>
- <dt>{{jsxref("Number.MIN_VALUE")}}</dt>
- <dd>El número más pequeño representable - que es el número positivo más cercano a cero (sin llegar a ser cero)-.</dd>
- <dt>{{jsxref("Number.NaN")}}</dt>
- <dd>Valor especial "no es número" NaN.</dd>
- <dt>{{jsxref("Number.NEGATIVE_INFINITY")}}</dt>
- <dd>Valor especial para representar infinitos negativos; retorno de un desborde de pila overflow.</dd>
- <dt>{{jsxref("Number.POSITIVE_INFINITY")}}</dt>
- <dd>Valor especial para representar infinitos positivos; retorno de un desborde de pila overflow.</dd>
- <dt>{{jsxref("Number.prototype")}}</dt>
- <dd>Permite la adición de propiedades a un objeto <code>Number</code>.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Number.isNaN()")}}</dt>
- <dd>Determina si el valor es NaN.</dd>
- <dt>{{jsxref("Number.isFinite()")}}</dt>
- <dd>Determina si el valor es un numero infinito.</dd>
- <dt>{{jsxref("Number.isInteger()")}}</dt>
- <dd>Determina si un numero es entero.</dd>
- <dt>{{jsxref("Number.isSafeInteger()")}}</dt>
- <dd>Determine si el valor pasado es un entero seguro (número entre <code>-(2<sup>53</sup> - 1)</code> y <code>2<sup>53</sup> - 1</code>).</dd>
- <dt><s class="obsoleteElement">{{jsxref("Number.toInteger()")}} {{obsolete_inline}}</s></dt>
- <dd><s class="obsoleteElement">Se usa para evaluar el valor pasado y convertirlo en un entero (or {{jsxref("Global_Objects/Infinity", "Infinity")}}), pero ha sido eliminado.</s></dd>
- <dt>{{jsxref("Number.parseFloat()")}}</dt>
- <dd>El valor es el mismo que {{jsxref ("parseFloat", "parseFloat ()")}} del objeto global.</dd>
- <dt>{{jsxref("Number.parseInt()")}}</dt>
- <dd>El valor es el mismo que {{jsxref("parseInt", "parseInt()")}} del objeto global.</dd>
-</dl>
-
-<h2 id="Instancias_Number">Instancias <code>Number</code></h2>
-
-<p>Todas las instancias <code>Number</code> heredan de {{jsxref("Number.prototype")}}. El objeto prototipo del constructor de <code>Number</code> puede modificarse para aceptar a todas las instancias de <code>Number</code>.</p>
-
-<h3 id="Métodos_2">Métodos</h3>
-
-<dl>
- <dt>{{jsxref("Number.prototype.toExponential()" ,"Number.prototype.toExponential(<var>fractionDigits</var>)")}}</dt>
- <dd>Devuelve una cadena que representa el número en notación exponencial.</dd>
-</dl>
-
-<dl>
- <dt>{{jsxref("Number.prototype.toFixed()", "Number.prototype.toFixed(<var>digits</var>)")}}</dt>
- <dd>Devuelve una cadena que representa el número en notación de punto fijo.</dd>
- <dt>{{jsxref("Number.prototype.toLocaleString()", "Number.prototype.toLocaleString([<var>locales</var> [, <var>options</var>]])")}}</dt>
- <dd>Devuelve una cadena con una representación sensible al idioma de este número. Invalida el método {{jsxref ("Object.prototype.toLocaleString ()")}}.</dd>
-</dl>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Utilizando_el_objeto_Number_para_asignar_valores_a_variables_num.C3.A9ricas" name="Ejemplo:_Utilizando_el_objeto_Number_para_asignar_valores_a_variables_num.C3.A9ricas">Ejemplo: Utilizando el objeto <code>Number</code> para asignar valores a variables numéricas</h3>
-
-<p>El siguiente ejemplo utiliza las propiedades del objeto <code>Number</code> para asignar valores a varias variables numéricas:</p>
-
-<pre class="brush: js notranslate">const MásgrandeNum    = Number.MAX_VALUE;
-const MáspequeNum     = Number.MIN_VALUE;
-const infinitoNum     = Number.POSITIVE_INFINITY;
-const notInfinitoNum  = Number.NEGATIVE_INFINITY;
-const noEsNum         = Number.NaN;
-</pre>
-
-<h3 id="Ejemplo_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number" name="Ejemplo:_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number">Intervalo de enteros para Number</h3>
-
-<p>El siguiente ejemplo muestra los valores máximos y minimos que pueden ser representados mediante el objeto Number: </p>
-
-<p>Cuando se analizan datos que se han serializado en JSON, se puede esperar que los valores enteros que se encuentran fuera de este rango se corrompan cuando el analizador JSON los coacciona al tipo Number.</p>
-
-<p>Una posible solución es usar {{jsxref ("String")}} en su lugar.</p>
-
-<p>Los números más grandes se pueden representar usando el tipo {{jsxref ("BigInt")}}.</p>
-
-<pre class="notranslate">const biggestInt  = Number.MAX_SAFE_INTEGER  //  (<code>2<sup>53</sup> - 1</code>) =&gt;  9007199254740991
-const smallestInt = Number.MIN_SAFE_INTEGER  // -(<code>2<sup>53</sup> - 1</code>) =&gt; -9007199254740991</pre>
-
-<h3 id="Ejemplo_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number" name="Ejemplo:_Utilizando_el_objeto_Number_para_modificar_todos_los_objetos__Number">Ejemplo: Utilizando el objeto <code>Number</code> para modificar todos los objetos <code>Number</code></h3>
-
-<p>El siguiente ejemplo crea un objeto Number, miNúmero, luego añade la propiedad descripción a todos los objetos Number. Luego el valor es asignado a la propiedad descripción del objeto miNúmero.</p>
-
-<pre class="brush: js notranslate">miNúmero = new Number(65);
-Number.prototype.descripción = null;
-miNúmero.descripción = "velocidad del viento";
-</pre>
-
-<h3 id="Utilizando_el_objecto_Number_para_transformar_un_objeto_Date">Utilizando el objecto <code>Number</code> para transformar un objeto <code>Date</code> </h3>
-
-<p>El siguiente ejemplo convierte el objeto {{jsxref ("Date")}} a un valor numérico usando <code>Number</code>  como función:</p>
-
-<pre class="notranslate"><code>var d = new Date('December 17, 1995 03:24:00');
-console.log(Number(d));</code></pre>
-
-<p>Esto muestra "819199440000".</p>
-
-<h3 id="Convierte_cadenas_numéricas_a_números">Convierte cadenas numéricas a números</h3>
-
-<pre class="notranslate"><code>Number('123')     // 123
-Number('12.3')    // 12.3
-Number('123e-1')  // 12.3
-Number('')        // 0
-Number('0x11')    // 17
-Number('0b11')    // 3
-Number('0o11')    // 9
-Number('foo')     // NaN
-Number('100a')    // NaN</code></pre>
-
-<pre dir="rtl">Number('-Infinity') //-Infinity</pre>
-
-
-
-<h3 id="Vea_También">Vea También</h3>
-
-<ul>
- <li>{{jsxref("Global_Objects/NaN", "NaN")}}</li>
- <li>{{jsxref("Global_Objects/Math", "Math")}}</li>
- <li>{{jsxref("Arithmetic operators")}} </li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/isfinite/index.html b/files/es/web/javascript/referencia/objetos_globales/number/isfinite/index.html
deleted file mode 100644
index f26af9f671..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/isfinite/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: Number.isFinite()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/isFinite
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/isFinite
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Number.isFinite()</code></strong> determina si el valor pasado es un número finito.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-isfinite.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox">Number.isFinite(valor)</pre>
-
-<h3 id="Parameters">Parameters</h3>
-
-<dl>
- <dt><code>valor</code></dt>
- <dd>El valor cuya finitud será probada.</dd>
-</dl>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>Un {{jsxref("Boolean")}} indicando si el valor dado es finito o no.</p>
-
-<h2 id="Description">Description</h2>
-
-<p>En comparación con la funcion global {{jsxref("isFinite", "isFinite()")}} , este método no convierte el parámetro forzádamente a un número. Esto significa que solo valores de tipo númerico, que también son finitos, retornan <code>true</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">Number.isFinite(Infinity);  // false
-Number.isFinite(NaN);       // false
-Number.isFinite(-Infinity); // false
-
-Number.isFinite(0);         // true
-Number.isFinite(2e64);      // true
-
-Number.isFinite('0');       // false, retornaría true con la función
-                            // global isFinite('0')
-Number.isFinite(null);      // false, retornaría true con la función
-                            // global isFinite(null)
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">Number.isFinite = Number.isFinite || function(value) {
-    return typeof value === 'number' &amp;&amp; isFinite(value);
-}
-</pre>
-
-<h2 id="Specificaciones">Specificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.isfinite', 'Number.isInteger')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.isfinite', 'Number.isInteger')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Number.isFinite")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El objeto {{jsxref("Number")}} al que pertenece esta función.</li>
- <li>La función global {{jsxref("isFinite")}}.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/isinteger/index.html b/files/es/web/javascript/referencia/objetos_globales/number/isinteger/index.html
deleted file mode 100644
index 6fdafca32e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/isinteger/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: Number.isInteger()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/isInteger
-tags:
-  - JavaScript
-  - Number
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/isInteger
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Number.isInteger()</code></strong> determina si el valor pasado es de tipo entero.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-isinteger.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Number.isInteger(valor)</code></pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor</code></dt>
- <dd>El valor a ser probado si es un entero.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un {{jsxref("Boolean")}} indicando si el valor dado es un entero o no.</p>
-
-<h2 id="Descripción">Descripción </h2>
-
-<p>Si el valor seleccionado es un entero, devuelve <code>true</code>, de lo contrario <code>false</code>. Si el valor es {{jsxref("NaN")}} o infinito, devuelve <code>false</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">Number.isInteger(0);         // true
-Number.isInteger(1);         // true
-Number.isInteger(-100000);   // true
-Number.isInteger(99999999999999999999999); // true
-
-Number.isInteger(0.1);       // false
-Number.isInteger(Math.PI);   // false
-
-Number.isInteger(NaN);       // false
-Number.isInteger(Infinity);  // false
-Number.isInteger(-Infinity); // false
-Number.isInteger('10');      // false
-Number.isInteger(true);      // false
-Number.isInteger(false);     // false
-Number.isInteger([1]);       // false
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">Number.isInteger = Number.isInteger || function(value) {
-  return typeof value === 'number' &amp;&amp;
-    isFinite(value) &amp;&amp;
-    Math.floor(value) === value;
-};
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.isinteger', 'Number.isInteger')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.isinteger', 'Number.isInteger')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatitibilidad_con_navegadores">Compatitibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Number.isInteger")}}</p>
-
-<h2 id="Ver también" name="Ver también">Ver también</h2>
-
-<ul>
- <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/isnan/index.html b/files/es/web/javascript/referencia/objetos_globales/number/isnan/index.html
deleted file mode 100644
index cc9c62274c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/isnan/index.html
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: Number.isNaN()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/isNaN
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/isNaN
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Number.isNaN()</code></strong> determina si el valor pasado es {{jsxref("NaN")}}. Versión más robusta de la función global {{jsxref("isNaN", "isNaN()")}}.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Number.isNaN(v<var>alue</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor</code></dt>
- <dd>El valor para ser evaluado por {{jsxref("NaN")}}.</dd>
-</dl>
-
-<h2 id="Description">Description</h2>
-
-<p>Debido a los dos operadores de igualdad, {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} y {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}, evaluando a <code>false</code> cuando al comprobar si {{jsxref("NaN")}} <em>is</em> {{jsxref("NaN")}}, la función <code>Number.isNaN()</code> se ha convertido en necesaria. Esta situación es diferente a las otras comparaciones de valor en JavaScript.</p>
-
-<p>En comparación a la función global {{jsxref("isNaN", "isNaN()")}}, <code>Number.isNaN()</code> no sufre el problema de forzar la conversión del parámetro a un número. Esto significa que ahora es seguro pasar valores que normalmente se convertirían a {{jsxref("NaN")}}, pero no son del mismo valor que {{jsxref("NaN")}}. Esto también significa que solo los valores de tipo número, que también son {{jsxref("NaN")}}, retornan <code>true</code>.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<pre class="brush: js notranslate">Number.isNaN(NaN);        // true
-Number.isNaN(Number.NaN); // true
-Number.isNaN(0 / 0)       // true
-
-// e.g. estos hubiesen sido true con la función global isNaN()
-Number.isNaN("NaN");      // false
-Number.isNaN(undefined);  // false
-Number.isNaN({});         // false
-Number.isNaN("blabla");   // false
-
-// Todos retornan false
-Number.isNaN(true);
-Number.isNaN(null);
-Number.isNaN(37);
-Number.isNaN("37");
-Number.isNaN("37.37");
-Number.isNaN("");
-Number.isNaN(" ");
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js notranslate">Number.isNaN = Number.isNaN || function(value) {
-    return typeof value === "number" &amp;&amp; isNaN(value);
-}
-
-// O
-Number.isNaN = Number.isNaN || function(value) {
-    return value !== value;
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.isnan', 'Number.isnan')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.isnan', 'Number.isnan')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome("25")}}</td>
-   <td>{{CompatGeckoDesktop("15")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>9</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("15")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>9</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number")}}</li>
- <li>{{jsxref("isNaN", "isNaN()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/issafeinteger/index.html b/files/es/web/javascript/referencia/objetos_globales/number/issafeinteger/index.html
deleted file mode 100644
index b12c4cf4d6..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/issafeinteger/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: Number.isSafeInteger()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/isSafeInteger
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Number
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/isSafeInteger
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Number.isSafeInteger()</code></strong> determina si el valor provisto es un número que es un entero seguro.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-issafeinteger.html")}}</div>
-
-
-
-<p>Un entero seguro es un entero que</p>
-
-<ul>
- <li>puede ser exactamente representado como un número IEEE-754 de doble presición, y</li>
- <li>su representación IEEE-754 no puede ser el resultado de redondear cualquier otro entero para  adaptarse a la representación de IEEE-754.</li>
-</ul>
-
-<p>Por ejemplo, <code>2<sup>53</sup> - 1</code> es un entero seguro: puede ser exactamente representado y ningún otro entero puede ser redondeado a él bajo cualquier modo de redondeo de IEEE-754. En contraste, <code>2<sup>53</sup></code> <em>no</em> es un entero seguro, puede ser exactamente representado en IEEE-754, pero el entero <code>2<sup>53</sup> + 1</code> no puede ser directamente representado en IEEE-754 pero en su lugar, redondea a <code>2<sup>53</sup></code> bajo los modos de redondeo <em>redondeo-al-más-cercano</em> y <em>redondeo-a-cero</em>.  Los enteros seguros consisten en todos los enteros desde <code>-(2<sup>53</sup> - 1)</code> inclusivo, hasta <code>2<sup>53</sup> - 1</code> inclusivo (± <code>9007199254740991</code> o ± 9,007,199,254,740,991).  </p>
-
-<p>Manejar valores más grandes o más pequeños que ~9 cuatrillones con presición completa requiere usar una <a href="https://en.wikipedia.org/wiki/Arbitrary-precision_arithmetic">biblioteca de artimética de presición arbitraria</a>.  Ver <a href="http://floating-point-gui.de/">Lo que todo programador necesita saber sobre aritmética de punto flotante</a> para más información sobre representaciones de punto flotante de los números.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Number.isSafeInteger(<em>valorDePrueba</em>)</code>
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><em>valorDePrueba</em></code></dt>
- <dd>El valor a probar si es un entero seguro.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un {{jsxref("Boolean")}} que indica si el valor dado es un número que es entero seguro.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">Number.isSafeInteger(3);                    // true
-Number.isSafeInteger(Math.pow(2, 53));      // false
-Number.isSafeInteger(Math.pow(2, 53) - 1);  // true
-Number.isSafeInteger(NaN);                  // false
-Number.isSafeInteger(Infinity);             // false
-Number.isSafeInteger('3');                  // false
-Number.isSafeInteger(3.1);                  // false
-Number.isSafeInteger(3.0);                  // true
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">Number.isSafeInteger = Number.isSafeInteger || function (value) {
-   return Number.isInteger(value) &amp;&amp; Math.abs(value) &lt;= Number.MAX_SAFE_INTEGER;
-};
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.issafeinteger', 'Number.isSafeInteger')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Number.isSafeInteger")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
- <li>{{jsxref("Number.MIN_SAFE_INTEGER")}}</li>
- <li>{{jsxref("Number.MAX_SAFE_INTEGER")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/max_safe_integer/index.html b/files/es/web/javascript/referencia/objetos_globales/number/max_safe_integer/index.html
deleted file mode 100644
index e5fa9df144..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/max_safe_integer/index.html
+++ /dev/null
@@ -1,68 +0,0 @@
----
-title: Number.MAX_SAFE_INTEGER
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/MAX_SAFE_INTEGER
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Number
-  - Property
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER
----
-<div>{{JSRef}}</div>
-
-<p>La constante <strong><code>Number.MAX_SAFE_INTEGER</code></strong> es el número mas grande 'seguro' en JavaScript (<code>2<sup>53</sup> - 1</code>).</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-maxsafeinteger.html")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo está almacenada en GitHub. Si quieres contribuir al proyecto de ejmplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un 'pull request'.</p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La constante <code>MAX_SAFE_INTEGER</code> tiene un valor de <code>9007199254740991</code> (9,007,199,254,740,991 o ~9 mil billones). El razonamiento detrás de ese número es que JavaScript usa <a href="http://en.wikipedia.org/wiki/Double_precision_floating-point_format">números flotantes de doble precisión</a> tal como está especfificado en <a href="http://en.wikipedia.org/wiki/IEEE_floating_point">IEEE 754</a> por lo que puedes representar números de forma segura entre <code>-(2<sup>53</sup> - 1)</code> y  <code>2<sup>53</sup> - 1</code>.</p>
-
-<p>Seguro, en este contexto, se refiere a la habilidad de representar enteros de forma exacta y compararlos de forma correcta. Por ejemplo, <code>Number.MAX_SAFE_INTEGER + 1 === Number.MAX_SAFE_INTEGER + 2</code> evaluará como 'verdadero', lo cual es matemáticamente incorrecto. Ver {{jsxref("Number.isSafeInteger()")}} para más información.</p>
-
-<p>Debido a que <code>MAX_SAFE_INTEGER</code> es una propiedad estática de {{jsxref("Number")}}, siempre se usa como <code>Number.MAX_SAFE_INTEGER</code>, en lugar de como una propiedad de un objeto {{jsxref("Number")}} que hayas creado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">Number.MAX_SAFE_INTEGER // 9007199254740991
-Math.pow(2, 53) - 1     // 9007199254740991
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.max_safe_integer', 'Number.MAX_SAFE_INTEGER')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página está generada con base en información estructurada. Si quieres contribuir a dicha información, por favor revisa  <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un 'pull request'.</p>
-
-<p>{{Compat("javascript.builtins.Number.MAX_SAFE_INTEGER")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number.MIN_SAFE_INTEGER")}}</li>
- <li>{{jsxref("Number.isSafeInteger()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/max_value/index.html b/files/es/web/javascript/referencia/objetos_globales/number/max_value/index.html
deleted file mode 100644
index 60c3d04e95..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/max_value/index.html
+++ /dev/null
@@ -1,131 +0,0 @@
----
-title: Number.MAX_VALUE
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/MAX_VALUE
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/MAX_VALUE
----
-<div>{{JSRef}}</div>
-
-<div>La propiedad <strong><code>Number.MAX_VALUE</code></strong><code> </code>representa el valor numérico positivo máximo representable en JavaScript.</div>
-
-<div> </div>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad <code>MAX_VALUE</code> tiene un valor aproximado a <code>1.79E+308</code>. Si el valor es mayor será representado como <em><code>Infinity</code></em>.</p>
-
-<p>Dado que <code>MAX_VALUE</code> es una propiedad estática de {{jsxref("Number")}}, siempre ha de usarse como <code>Number.MAX_VALUE</code>, y no como propiedad del objeto que has creado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_MAX_VALUE">Usando <code>MAX_VALUE</code></h3>
-
-<p>La función <em>verificarValorMaximo </em>recibe un número como parámetro que se compara con <em>Number.MAX_VALUE. </em>Si el número es menor se imprime por consola <em>"El número no es infinito"</em>, de ser mayor <em>"El número es infinito"</em>.</p>
-
-<pre class="brush: js">var numero1 = 1.79E+307;
-var numero2 = 1.79E+310;
-
-function verificarValorMaximo(num){
-
-	if (num &lt;= Number.MAX_VALUE) {
-	  console.log("El número no es infinito");
-	} else {
-	  console.log("El número es infinito");
-	}
-
-}
-
-verificarValorMaximo(numero1); // El número no es infinito
-verificarValorMaximo(numero2); // El número es infinito
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.7.3.2', 'Number.MAX_VALUE')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.max_value', 'Number.MAX_VALUE')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.max_value', 'Number.MAX_VALUE')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad">Compatibilidad</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number.MIN_VALUE")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/min_value/index.html b/files/es/web/javascript/referencia/objetos_globales/number/min_value/index.html
deleted file mode 100644
index dadda2e337..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/min_value/index.html
+++ /dev/null
@@ -1,121 +0,0 @@
----
-title: Number.MIN_VALUE
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/MIN_VALUE
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/MIN_VALUE
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>Number.MIN_VALUE</strong></code> representa el menor valor positivo numérico representable en JavaScript.</p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad <code>MIN_VALUE </code>es el número más cercano a 0, no el más negativo, que JavaScript puede representar.</p>
-
-<p><code>MIN_VALUE </code>tiene un valor aproximado de <code>5e-324</code>. Los valores menores que <code>MIN_VALUE </code>(“subdesbordamiento de valores”) son convertidos a 0.</p>
-
-<p>Ya que <code>MIN_VALUE </code>es una propiedad estática de {{jsxref("Number")}}, debes utilizarla como <code>Number.MIN_VALUE</code>, más que como una propiedad del objeto {{jsxref("Number")}} que has creado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_MIN_VALUE">Usando <code>MIN_VALUE</code></h3>
-
-<p>El siguiente código divide dos valores numéricos. Si el resultado es mayor o igual a <code>MIN_VALUE</code>, se ejecuta la función <code>func1</code>, si no, se ejecuta la función <code>func2</code>.</p>
-
-<pre class="brush: js">if (num1 / num2 &gt;= Number.MIN_VALUE) {
-  func1();
-} else {
-  func2();
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.7.3.3', 'Number.MIN_VALUE')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.min_value', 'Number.MIN_VALUE')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.min_value', 'Number.MIN_VALUE')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number.MAX_VALUE")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/nan/index.html b/files/es/web/javascript/referencia/objetos_globales/number/nan/index.html
deleted file mode 100644
index 79db15a598..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/nan/index.html
+++ /dev/null
@@ -1,59 +0,0 @@
----
-title: Number.NaN
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/NaN
-tags:
-  - JavaScript
-  - Número
-  - Propiedad
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/NaN
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <strong><code>Number.NaN</code></strong> representa Not-A-Number (No es numero). Equivalente de  {{jsxref("NaN")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-nan.html")}}</div>
-
-<p>No tienes que crear un objeto {{jsxref("Number")}} para acceder a esta propiedad estática (usa <code>Number.NaN</code>).</p>
-
-<div>{{js_property_attributes(0, 0, 0)}}</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Chequea_si_los_valores_son_numericos">Chequea si los valores son numericos</h3>
-
-<pre class="brush: js notranslate">function sanitise(x) {
-  if (isNaN(x)) {
-    return Number.NaN;
-  }
-  return x;
-}</pre>
-
-<h3 id="Testing_against_NaN">Testing against NaN</h3>
-
-<p>See <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/NaN#Testing_against_NaN">Testing against NaN</a> on the <code>NaN</code> page.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.nan', 'Number.NaN')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Number.NaN")}}</p>
-
-<h2 id="Tambien_mira">Tambien mira</h2>
-
-<ul>
- <li>El objeto global {{jsxref("NaN")}} .</li>
- <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/negative_infinity/index.html b/files/es/web/javascript/referencia/objetos_globales/number/negative_infinity/index.html
deleted file mode 100644
index 2e2d7d1573..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/negative_infinity/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: Number.NEGATIVE_INFINITY
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/NEGATIVE_INFINITY
-tags:
-  - JavaScript
-  - Number
-  - Property
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/NEGATIVE_INFINITY
----
-<div>
- {{JSRef("Objetos_globales", "Number")}}</div>
-<h2 id="Summary" name="Summary">Resumen</h2>
-<p>La propiedad <code><strong>Number.NEGATIVE_INFINITY</strong></code> representa el valor del infinito negativo.</p>
-<p>No se tiene que crear un objeto {{jsxref("Number")}} para acceder a esta propiedad estática (use <code>Number.NEGATIVE_INFINITY</code>).</p>
-<p>{{js_property_attributes(0,0,0)}}</p>
-<h2 id="Description" name="Description">Descripción</h2>
-<p>El valor <code>Number.NEGATIVE_INFINITY</code> es el mismo que el valor negativo de la propiedad del objeto global {{jsxref( "Infinity")}}<strong><code>.</code></strong></p>
-<p>Este valor tiene un comportamiento ligeramente diferente que el del infinito matematico:</p>
-<ul>
- <li>Cualquier valor positivo, incluyendo <code>POSITIVE_INFINITY</code>, multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado <code>NEGATIVE_INFINITY</code>.</li>
- <li>Cualquier valor negativo, incluyendo <code>NEGATIVE_INFINITY</code>, multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado <code>POSITIVE_INFINITY</code>.</li>
- <li>Cero multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado <code>NaN</code>.</li>
- <li>NaN multiplicado por <code>NEGATIVE_INFINITY</code> da como resultado  <code>NaN</code>.</li>
- <li><code>NEGATIVE_INFINITY</code>, divido por cualquier valor negativo excepto <code>NEGATIVE_INFINITY</code>, da como resultado <code>POSITIVE_INFINITY</code>.</li>
- <li><code>NEGATIVE_INFINITY</code>, divido por cualquier valor positivo excepto <code>POSITIVE_INFINITY</code>, da como resultado <code>NEGATIVE_INFINITY</code>.</li>
- <li><code>NEGATIVE_INFINITY</code>, divido por <code>NEGATIVE_INFINITY</code> o por <code>POSITIVE_INFINITY</code>, da como resultado <code>NaN</code>.</li>
- <li>Cualquier numero divido por <code>NEGATIVE_INFINITY</code> da como resultado cero.</li>
-</ul>
-<p>Muchos métodos JavaScript (tales como el constructor del objeto <code>Number</code>, <code>parseFloat</code>, y <code>parseInt</code>) retornan <code>NaN</code> si el valor especifico en el párametro es significativamente menor a <code>Number.MIN_VALUE</code>.</p>
-<p>Podrías utilizar la propiedad <code>Number.NEGATIVE_INFINITY</code> para indicar una condición de error que retorne un numero finito en caso de que esto suceda. Note, sin embargo, que <code><a href="/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isFinite">isFinite</a></code> seria mas apropiado en estos casos.</p>
-<h2 id="Example" name="Example">Example</h2>
-<p>En el siguiente ejemplo, a la variable <code>smallNumber </code>se le asigna un valor mucho mas pequeño al valor minimo. Cuando la sentencia <code>if</code> es ejecutada, <code>smallNumber </code>tiene el valor "<code>-Infinity</code>", por lo cual a <code>smallNumber </code>le es asignado un valor finito mas manejable antes de continuar.</p>
-<pre class="brush:js">var smallNumber = (-Number.MAX_VALUE) * 2
-
-if (smallNumber === Number.NEGATIVE_INFINITY) {
- smallNumber = returnFinite();
-}
-</pre>
-<h2 id="Especificaciones">Especificaciones</h2>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1ra Edición. Implementado en JavaScript 1.1</td>
-   <td>Estándar</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.7.3.5', 'Number.NEGATIVE_INFINITY')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.negative_infinity', 'Number.NEGATIVE_INFINITY')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-<p>{{ CompatibilityTable() }}</p>
-<div id="compat-desktop">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Característica</th>
-    <th>Chrome</th>
-    <th>Firefox (Gecko)</th>
-    <th>Internet Explorer</th>
-    <th>Opera</th>
-    <th>Safari</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Característica</th>
-    <th>Android</th>
-    <th>Chrome for Android</th>
-    <th>Firefox Mobile (Gecko)</th>
-    <th>IE Mobile</th>
-    <th>Opera Mobile</th>
-    <th>Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<h2 id="See_also" name="See_also">Ver también</h2>
-<ul>
- <li>{{jsxref("Number.POSITIVE_INFINITY")}}</li>
- <li>{{jsxref( "Infinity")}}</li>
- <li>{{jsxref("isFinite")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/parsefloat/index.html b/files/es/web/javascript/referencia/objetos_globales/number/parsefloat/index.html
deleted file mode 100644
index 6285aa9b5a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/parsefloat/index.html
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: Number.parseFloat()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/parseFloat
-tags:
-  - ECMAScript2015
-  - ECMAScript6
-  - JavaScript
-  - Número
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseFloat
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Number.parseFloat()</code></strong> parsea un argumento cadena y regresa un número de punto flotante. Este método se comporta de igual forma a la función global {{jsxref("parseFloat", "parseFloat()")}} y es parte de ECMAScript 2015 (su propósito es la modularización de los globales).</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-parsefloat.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Number.parseFloat(<var>string</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat", "Parameters")}}</p>
-
-<h3 id="Valor_de_regreso">Valor de regreso</h3>
-
-<p>{{page("en-US/docs/Web/JavaScript/Reference/Global_Objects/parseFloat", "Return value")}}</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Por favor ver {{jsxref("parseFloat", "parseFloat()")}} para más detalles y ejemplos.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js notranslate">if (Number.parseFloat === void 0) {
-    Number.parseFloat = parseFloat;
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-number.parsefloat', 'Number.parseFloat')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.parsefloat', 'Number.parseFloat')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Number.parseFloat")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El objeto {{jsxref("Number")}} al que pertenece.</li>
- <li>El método global {{jsxref("parseFloat", "parseFloat()")}}.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/parseint/index.html b/files/es/web/javascript/referencia/objetos_globales/number/parseint/index.html
deleted file mode 100644
index e899827599..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/parseint/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: Number.parseInt()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/parseInt
-tags:
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/parseInt
----
-<div>{{JSRef}}</div>
-
-<p>The <strong><code>Number.parseInt()</code></strong> method parses a string argument and returns an integer of the specified radix or base.</p>
-
-<p>The <strong><code>Number.parseInt()</code></strong> El método Number.parseInt () analiza un argumento de cadena y devuelve un entero de la raíz o base especificada.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-parseint.html", "taller")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox">Number.parseInt(<var>string,</var>[ <var>radix</var>])</pre>
-
-<h3 id="Parameters">Parameters</h3>
-
-<div>
-<dl>
- <dt><code><var>string</var></code></dt>
- <dd>The value to parse. If this argument is not a string, then it is converted to one using the <code><a href="https://tc39.es/ecma262/#sec-tostring">ToString</a></code> abstract operation. Leading whitespace in this argument is ignored.</dd>
- <dt><code><var>radix</var></code><var> {{optional_inline}}</var></dt>
- <dd>An integer between <code>2</code> and <code>36</code> that represents the <em>radix</em> (the base in mathematical numeral systems) of the <code><var>string</var></code>. Be careful—this does <strong><em>not</em></strong> default to <code>10</code>!</dd>
-</dl>
-</div>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>An integer parsed from the given <code><var>string</var></code>.</p>
-
-<p>If the <code><var>radix</var></code> is smaller than <code>2</code> or bigger than <code>36</code>, and the first non-whitespace character cannot be converted to a number, {{jsxref("NaN")}} is returned.</p>
-
-<h2 id="Description">Description</h2>
-
-<p>This method has the same functionality as the global {{jsxref("parseInt", "parseInt()")}} function:</p>
-
-<pre class="brush: js">Number.parseInt === parseInt // true</pre>
-
-<p>and is part of ECMAScript 2015 (its purpose is modularization of globals). Please see {{jsxref("parseInt", "parseInt()")}} for more detail and examples.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<pre class="brush: js">if (Number.parseInt === undefined) {
-    Number.parseInt = window.parseInt
-}
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.parseint', 'Number.parseInt')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Number.parseInt")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>The {{jsxref("Number")}} object it belongs to.</li>
- <li>The global {{jsxref("parseInt", "parseInt()")}} method.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/positive_infinity/index.html b/files/es/web/javascript/referencia/objetos_globales/number/positive_infinity/index.html
deleted file mode 100644
index 41d101a569..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/positive_infinity/index.html
+++ /dev/null
@@ -1,115 +0,0 @@
----
-title: Number.POSITIVE_INFINITY
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/POSITIVE_INFINITY
-tags:
-  - JavaScript
-  - Number
-  - Property
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/POSITIVE_INFINITY
----
-<p>{{JSRef("Objetos_globales", "Number")}}</p>
-<h2 id="Resumen">Resumen</h2>
-<p>La propiedad <code><strong>Number.POSITIVE_INFINITY</strong></code> representa el infinito positivo.</p>
-<p>No se tiene que crear un objeto {{jsxref("Number")}} para acceder a esta propiedad estática (use <code>Number.POSITIVE_INFINITY</code>).</p>
-<p>{{js_property_attributes(0,0,0)}}</p>
-<h2 id="Descripción">Descripción</h2>
-<p>El valor de <code>Number.POSITIVE_INFINITY</code> es el mismo valor de la propiedad {{jsxref( "Infinity")}} del objeto global.</p>
-<p>Este valor tiene un comportamiento ligeramente diferente al infinio matemático:</p>
-<ul>
- <li>Cualquier valor positivo, incluyendo <code>POSITIVE_INFINITY</code>, multiplicado por <code>POSITIVE_INFINITY</code> da como resultado <code>POSITIVE_INFINITY</code>.</li>
- <li>Cualquier valor negativo, incluyendo <code>NEGATIVE_INFINITY</code>, multiplicado por <code>POSITIVE_INFINITY</code> da como resultado <code>NEGATIVE_INFINITY</code>.</li>
- <li>Cero multiplicado por <code>POSITIVE_INFINITY</code> da como resultado NaN.</li>
- <li>NaN multiplicado por <code>POSITIVE_INFINITY</code> da como resultado NaN.</li>
- <li><code>POSITIVE_INFINITY</code>,  dividido por cualquier valor negativo excepto <code>NEGATIVE_INFINITY</code>, da como resultado <code>NEGATIVE_INFINITY</code>.</li>
- <li><code>POSITIVE_INFINITY</code>, divido por cualquier valor positivo excepto <code>POSITIVE_INFINITY</code>, da como resultado <code>POSITIVE_INFINITY</code>.</li>
- <li><code>POSITIVE_INFINITY</code>, divido por <code>INFINITY</code> o por <code>POSITIVE_INFINITY</code>, da como resultado NaN.</li>
- <li>Cualquier numero divido por <code>POSITIVE_INFINITY</code> da como resultado cero.</li>
-</ul>
-<p>Muchos métodos de JavaScript (tales como el constructor del objeto <code>Number</code>, <code>parseFloat</code> y <code>parseInt</code>) retornan <code>NaN</code> si el valor especificado en el parámetro es signficativamente mayor a <code>Number.MAX_VALUE</code>.</p>
-<p>Podrías utilizar la propiedad <code>Number.POSITIVE_INFINITY</code> para indicar una condición de error que retorne un numero finito en caso de que esto suceda. Note, sin embargo, que <code><a href="/es/docs/Referencia_de_JavaScript_1.5/Funciones_globales/isFinite">isFinite</a></code> seria mas apropiado en estos casos.</p>
-<h2 id="Ejemplo">Ejemplo</h2>
-<p>En el siguiente ejemplo, a la variable <code>bigNumber </code>se le asigna un valor mucho mayor al valor máximo. Cuando la sentencia <code>if</code> es ejecutada, <code>bigNumber </code>tiene el valor "<code>Infinity</code>", por lo cual a <code>bigNumber</code> le es asignado un valor mas manejable antes de continuar.</p>
-<pre class="brush: js">var bigNumber = Number.MAX_VALUE * 2;
-if (bigNumber === Number.POSITIVE_INFINITY) {
- bigNumber = returnFinite();
-}
-</pre>
-<h2 id="Especificaciones">Especificaciones</h2>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition. Implemented in JavaScript 1.1</td>
-   <td>Estándar</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.7.3.6', 'Number.POSITIVE_INFINITY')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.positive_infinity', 'Number.POSITIVE_INFINITY')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-<p>{{ CompatibilityTable() }}</p>
-<div id="compat-desktop">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Caracteristica</th>
-    <th>Chrome</th>
-    <th>Firefox (Gecko)</th>
-    <th>Internet Explorer</th>
-    <th>Opera</th>
-    <th>Safari</th>
-   </tr>
-   <tr>
-    <td>Soporte básico</td>
-    <td>(SI)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Caracteristica</th>
-    <th>Android</th>
-    <th>Chrome for Android</th>
-    <th>Firefox Mobile (Gecko)</th>
-    <th>IE Mobile</th>
-    <th>Opera Mobile</th>
-    <th>Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Soprote básico</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-    <td>(Si)</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<h2 id="See_also" name="See_also">Ver también</h2>
-<ul>
- <li>{{jsxref("Number.NEGATIVE_INFINITY")}}</li>
- <li>{{jsxref("Infinity")}}</li>
- <li>{{jsxref("isFinite")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/number/prototype/index.html
deleted file mode 100644
index c15b5b5fcb..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/prototype/index.html
+++ /dev/null
@@ -1,16 +0,0 @@
----
-title: Number.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/prototype
-tags:
-  - JavaScript
-  - Number
-  - Property
-translation_of: Web/JavaScript/Reference/Global_Objects/Number
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Number/prototype
----
-<div>
- {{JSRef("Objetos_globales", "Number")}}</div>
-<h3 id="Resumen" name="Resumen">Resumen</h3>
-<p>Representa el prototipo para esta clase. Puede utilizar el prototipo para añadir propiedades o métodos a todas las instancias de una clase. Para información acerca de prototipos.</p>
-<div class="noinclude">
-  </div>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/tofixed/index.html b/files/es/web/javascript/referencia/objetos_globales/number/tofixed/index.html
deleted file mode 100644
index f11ccc3938..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/tofixed/index.html
+++ /dev/null
@@ -1,147 +0,0 @@
----
-title: Number.prototype.toFixed()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/toFixed
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/toFixed
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toFixed()</code></strong> formatea un número usando notación de punto fijo.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-tofixed.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>numObj</var>.toFixed([<var>digitos</var>])</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>digitos</code></dt>
- <dd>Opcional. El número de digitos que aparecen después del punto decimal; este puede ser un valor entre 0 y 20, inclusive, algunas implementaciones pueden soportar un rango más amplio de valores. Si el argumento es omitido, es tratado como 0.</dd>
-</dl>
-
-<h3 id="Valor_Devuelto">Valor Devuelto</h3>
-
-<p>Una cadena que representa el número dado, usando notación de punto fijo.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<dl>
- <dt>{{jsxref("RangeError")}}</dt>
- <dd>Si <code>digits</code> es demasiado pequeño o demasiado grande. Los valores entre 0 y 20, inclusive, no causarán un error tipo<code> {{jsxref("RangeError")}}</code>. Las implementaciones también pueden admitir valores cada vez más grandes.</dd>
- <dt>{{jsxref("TypeError")}}</dt>
- <dd>Si este método se invoca en un objeto que no es un {{jsxref("Number")}}.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><strong><code>toFixed()</code></strong> devuelve una representación de cadena de <code> numObj </code> que no usa notación exponencial y tiene exactamente <code> dígitos </code> dígitos después del decimal. El número se redondea si es necesario, y la parte fraccional se rellena con ceros si es necesario para que tenga la longitud especificada.Si <code>numObj</code> es mayor que <code>1e+21</code>, este metodo llama a {{jsxref("Number.prototype.toString()")}} y retorna una cadena de notacion exponencial.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_toFixed">Using <code>toFixed</code></h3>
-
-<pre class="brush: js">var numObj = 12345.6789;
-
-numObj.toFixed();       // Returns '12346': note rounding, no fractional part
-numObj.toFixed(1);      // Returns '12345.7': note rounding
-numObj.toFixed(6);      // Returns '12345.678900': note added zeros
-(1.23e+20).toFixed(2);  // Returns '123000000000000000000.00'
-(1.23e-10).toFixed(2);  // Returns '0.00'
-2.34.toFixed(1);        // Returns '2.3'
-2.35.toFixed(1);        // Returns '2.4'. Note that it rounds up in this case.
--2.34.toFixed(1);       // Returns -2.3 (due to operator precedence, negative number literals don't return a string...)
-(-2.34).toFixed(1);     // Returns '-2.3' (...unless you use parentheses)
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.7.4.5', 'Number.prototype.toFixed')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.prototype.tofixed', 'Number.prototype.toFixed')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Number.prototype.toExponential()")}}</li>
- <li>{{jsxref("Number.prototype.toPrecision()")}}</li>
- <li>{{jsxref("Number.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/tolocalestring/index.html b/files/es/web/javascript/referencia/objetos_globales/number/tolocalestring/index.html
deleted file mode 100644
index d0c28b1431..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/tolocalestring/index.html
+++ /dev/null
@@ -1,155 +0,0 @@
----
-title: Number.prototype.toLocaleString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/toLocaleString
-tags:
-  - Internacionalizacion
-  - JavaScript
-  - Número
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/toLocaleString
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toLocaleString()</code></strong> retorna una representacion localizada del número en forma de texto</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-tolocalestring.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox notranslate"><code><em>numObj</em>.toLocaleString(</code><code>[locales [, options]])</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<p>Los argumentos <code>locales</code> y <code>options</code> personalizan el comportamiento de la funcion y permite especificar el lenguaje cuyo formato deberá ser utilizado. En implementaciones, que ignoran los argumentos <code>locales</code> y <code>options</code> la localización utilizada y la forma del texto retornado es enteramente dependiente de la implementación.</p>
-
-<div>Mira el  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat">constructor Intl.NumberFormat()</a> para ver más detalles sobre los parámetros y como se utilizan.</div>
-
-<div></div>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un texto con una representación localizada del número dado.</p>
-
-<h2 id="Performance">Performance</h2>
-
-<p>Cuando formateas una gran cantidad de números, es mejor crear un objeto {{jsxref("NumberFormat")}} y utilizar la función {{jsxref("NumberFormat.format")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toLocaleString">Usando <code>toLocaleString</code></h3>
-
-<p>Un uso básico sin especificar <code>locales</code>, retorna un texto formateado con el <code>locales</code> y <code>options</code> por defecto.</p>
-
-<pre class="brush: js notranslate">var number = 3500;
-
-console.log(number.toLocaleString()); // Muestra "3,500" si se está utilizando la localización U.S. English
-</pre>
-
-<h3 id="Verificando_el_soporte_de_los_parámetros_locales_y_options">Verificando el soporte de los parámetros <code>locales</code> y <code>options</code></h3>
-
-<p>Los parámetros <code>locales</code> y <code>options</code> no son soportados aún por todos los navegadores. Para verificar el soporte en ES5.1 y posteriores implementaciones, se puede utilizar el hecho que los tags inválidos en la localización son rechazados con una excepción {{jsxref("Global_Objects/RangeError", "RangeError")}}:</p>
-
-<pre class="brush: js notranslate">function toLocaleStringSupportsLocales() {
-  var number = 0;
-  try {
-    number.toLocaleString('i');
-  } catch (e) {
-    return e.name === 'RangeError';
-  }
-  return false;
-}
-</pre>
-
-<p>Antes de ES5.1, las implementaciones no requieren devolver una exepción {{jsxref("Global_Objects/RangeError", "RangeError")}} cuando <code>toLocaleString </code>es llamado sin argumentos.</p>
-
-<p>Para verificar que funciona todos los navegadores, incluyendo aquellos que soportan ECMA-262, anterior a ES5.1, se puede verificar por las funcionalidades especificadas en ECMA-402 que requieren soportar opciones regionales para <code>Number.prototype.toLocaleString</code> directamente:</p>
-
-<pre class="brush: js notranslate">function toLocaleStringSupportsOptions() {
-  return !!(typeof Intl == 'object' &amp;&amp; Intl &amp;&amp; typeof Intl.NumberFormat == 'function');
-}
-</pre>
-
-<p>Esta validación del objeto global <code>Intl</code> , verificar que no es <code>null</code> (nulo) y que tiene la propiedad <code>NumberFormat</code> que es una función.</p>
-
-<h3 id="Utilizando_locales">Utilizando <code>locales</code></h3>
-
-<p>Este ejemplo muestra alguna de las variaciones en los formatos de números localizados. Para obtener el formato de la localización utilizada en la interfaz del usuario de tu aplicación, asegurate de especificar la localización (y de ser posible alguna localización de respaldo) utilizando el parámetro <code>locales</code>:</p>
-
-<pre class="brush: js notranslate">var number = 123456.789;
-
-// Aleman utiliza comas como separador decimal y puntos miles
-console.log(number.toLocaleString('de-DE'));
-// → 123.456,789
-
-// Arabe en la mayoría de países de habla Arabe utilizan numerales <a href="https://en.wikipedia.org/wiki/Eastern_Arabic_numerals">Eastern Arabic</a>
-console.log(number.toLocaleString('ar-EG'));
-// → ١٢٣٤٥٦٫٧٨٩
-
-// India utiliza separadores de miles/lakh/crore
-console.log(number.toLocaleString('en-IN'));
-// → 1,23,456.789
-
-// la extensión nu requiere un sistema numerico, e.g. Decimales Chino
-console.log(number.toLocaleString('zh-Hans-CN-u-nu-hanidec'));
-// → 一二三,四五六.七八九
-
-// cuando solicitas un lenguage que podria no ser soportado, como
-// Balinese, incluye un lenguaje de respaldo, en este caso Indonesio
-console.log(number.toLocaleString(['ban', 'id']));
-// → 123.456,789
-</pre>
-
-<h3 id="Utilizando_options">Utilizando <code>options</code></h3>
-
-<p>El resultado proveido por  <code>toLocaleString</code> puede ser personalizado utilizando el parámetro <code>options</code> :</p>
-
-<pre class="brush: js notranslate">var number = 123456.789;
-
-// solicitar un formato de moneda
-console.log(number.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' }));
-// → 123.456,79 €
-
-// en Japones yen no utiliza una moneda menor
-console.log(number.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }))
-// → ￥123,457
-
-// limitar a tres digitos el significante
-console.log(number.toLocaleString('en-IN', { maximumSignificantDigits: 3 }));
-// → 1,23,000
-
-// Utilizar el lenguaje por defecto del host con opciones para el formato del número
-var num = 30000.65;
-console.log(num.toLocaleString(undefined, {minimumFractionDigits: 2, maximumFractionDigits: 2}));
-// → "30,000.65" donde English es el lenguaje por defecto, o
-// → "30.000,65" donde Aleman es el lenguaje por defecto, o
-// → "30 000,65" donde French es el lenguaje por defecto
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.prototype.tolocalestring', 'Number.prototype.toLocaleString')}}</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sup-number.prototype.tolocalestring', 'Number.prototype.toLocaleString')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Number.toLocaleString")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/toprecision/index.html b/files/es/web/javascript/referencia/objetos_globales/number/toprecision/index.html
deleted file mode 100644
index 7a5110d7a9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/toprecision/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: Number.prototype.toPrecision()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/toPrecision
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/toPrecision
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toPrecision()</code></strong> devuelve una cadena que representa un objeto {{jsxref("Number")}} según la precisión especificada.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/number-toprecision.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>numObj</var>.toPrecision([<var>precision</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>precision</code></dt>
- <dd>Opcional. Un entero que especifica el número de digitos significativos.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena que representa un objeto {{jsxref("Number")}} en punto fijo o en notación exponencial redondeada a <code>precision</code> de digitos significativos. Vea la discusión acerca del redondeo en la descripción del método {{jsxref("Number.prototype.toFixed()")}} , que además aplica a <code>toPrecision()</code>.</p>
-
-<p>Si el parámetro <code>precision</code> es omitido, se comporta como {{jsxref("Number.prototype.toString()")}}. Si el parámetro <code>precision</code> es un valor no entero, el valor es redondeado al entero más cercano.</p>
-
-<h3 id="Exceptions">Exceptions</h3>
-
-<dl>
- <dt>{{jsxref("Global_Objects/RangeError", "RangeError")}}</dt>
- <dd>If <code>precision</code> is not between 1 and 100 (inclusive), a {{jsxref("RangeError")}} is thrown. Implementations are allowed to support larger and smaller values as well. ECMA-262 only requires a precision of up to 21 significant digits.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toPrecision">Usando <code>toPrecision</code></h3>
-
-<pre class="brush: js">var numObj = 5.123456;
-
-console.log(numObj.toPrecision());    // logs '5.123456'
-console.log(numObj.toPrecision(5));   // logs '5.1235'
-console.log(numObj.toPrecision(2));   // logs '5.1'
-console.log(numObj.toPrecision(1));   // logs '5'
-
-numObj = 0.000123
-
-console.log(numObj.toPrecision());    // logs '0.000123'
-console.log(numObj.toPrecision(5));   // logs '0.00012300'
-console.log(numObj.toPrecision(2));   // logs '0.00012'
-console.log(numObj.toPrecision(1));   // logs '0.0001'
-
-// observe que bajo algunas circunstancias el valor retornado es en notación exponencial
-console.log((1234.5).toPrecision(2)); // logs '1.2e+3'
-</pre>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Primera definición. Implementada en JavaScript 1.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.7.4.7', 'Number.prototype.toPrecision')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.prototype.toprecision', 'Number.prototype.toPrecision')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.prototype.toprecision', 'Number.prototype.toPrecision')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.Number.toPrecision")}}</p>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Number.prototype.toFixed()")}}</li>
- <li>{{jsxref("Number.prototype.toExponential()")}}</li>
- <li>{{jsxref("Number.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/tostring/index.html b/files/es/web/javascript/referencia/objetos_globales/number/tostring/index.html
deleted file mode 100644
index f911fa271e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/tostring/index.html
+++ /dev/null
@@ -1,63 +0,0 @@
----
-title: Number.prototype.toString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/toString
-tags:
-  - JavaScript
-  - Method
-  - Number
-  - Prototype
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/toString
----
-<div>{{JSRef("Objetos_globales", "Number")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Devuelve una cadena que representa al objeto <em>Number</em> especificado</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<p><code><em>number</em> .toString( {{ mediawiki.external('<em>base</em> ') }} )</code></p>
-
-<h3 id="Par.C3.A1metro" name="Par.C3.A1metro">Parámetro</h3>
-
-<dl>
- <dt>base</dt>
- <dd>Un entero entre 2 y 36 especificando la base a usar para representar los valores numéricos.</dd>
-</dl>
-
-<h3 id="Devuelve" name="Devuelve">Devuelve</h3>
-
-<p>Una cadena que representa al objeto.</p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>El objeto <code>Number</code> sobreescribe el método <code>toString</code> y no lo hereda del objeto {{jsxref("Object")}}; por tanto no hereda {{jsxref("Object.prototype.toString()")}}. Para objetos <code>Number</code>, el método <code>toString</code> devuelve una cadena que representa al objeto en la base especificada.</p>
-
-<p>El método toString comprueba su primer argumento, e intenta devolver una cadena de representación en la base especificada. Para bases superiores a 10, las letras del alfabeto indican numerales mayores de 9. Por ejemplo, para números hexadecimales (base 16), se utiliza de A hasta F.</p>
-
-<p>Si no se da a toString una base entre 2 y 36, se lanza una excepción.</p>
-
-<p>Si no se especifica la base, JavaScript asume la base predefinida, que es 10.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">var howMany = 10;
-
-alert("howMany.toString() is " + howMany.toString()); // displays "10"
-
-alert("45 .toString() is " + 45 .toString()); //displays "45"
-
-var x = 7;
-alert(x.toString(2))      // Displays "111"
-</pre>
-
-
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Number.prototype.toFixed()")}}</li>
- <li>{{jsxref("Number.prototype.toExponential()")}}</li>
- <li>{{jsxref("Number.prototype.toPrecision()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/number/valueof/index.html b/files/es/web/javascript/referencia/objetos_globales/number/valueof/index.html
deleted file mode 100644
index 588c421746..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/number/valueof/index.html
+++ /dev/null
@@ -1,81 +0,0 @@
----
-title: Number.prototype.valueOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/Number/valueOf
-tags:
-  - JavaScript
-  - Métodos
-  - Number
-  - Prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Number/valueOf
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>valueOf()</code></strong> retorna el valor primitivo inserto en un objeto {{jsxref("Number")}}.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>numObj</var>.valueOf()</code></pre>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Un número representando al valor primitivo del objeto  {{jsxref("Number")}} especificado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Este método es usualmente llamado de forma interna por JavaScript y no es explicitado en el código web.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_valueOf">Utilizando <code>valueOf</code></h3>
-
-<pre class="brush: js">var numObj = new Number(10);
-console.log(typeof numObj); // objeto
-
-var num = numObj.valueOf();
-console.log(num);           // 10
-console.log(typeof num);    // número
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.7.4.4', 'Number.prototype.valueOf')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-number.prototype.valueof', 'Number.prototype.valueOf')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-number.prototype.valueof', 'Number.prototype.valueOf')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegador">Compatibilidad con navegador</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si deseas contribuir con los datos, por favor, revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud.</p>
-
-<p>{{Compat("javascript.builtins.Number.valueOf")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Number.prototype.toSource()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/__definegetter__/index.html b/files/es/web/javascript/referencia/objetos_globales/object/__definegetter__/index.html
deleted file mode 100644
index fceb708912..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/__definegetter__/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Object.prototype.__defineGetter__()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/__defineGetter__
-tags:
-  - JavaScript
-  - Objeto
-  - Prototipo
-  - Prototype
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/__defineGetter__
----
-<div>{{JSRef}}</div>
-
-<div class="warning">
-<p>Esta característica está obsoleta en favor de definir getters usando el <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer syntax</a> o la API {{jsxref("Object.defineProperty()")}}.</p>
-
-<p>En todo caso, como es ampliamente implementada y usada en la Web,  es poco probable que los navegadores dejen de implementarla.</p>
-</div>
-
-<p>El método <code><strong>__defineGetter__</strong></code> enlaza una propiedad de un objeto a una función a ser llamada cuando esa propiedad es buscada.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>obj</var>.__defineGetter__(<var>prop</var>, <var>func</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>prop</code></dt>
- <dd>Un texto (string) que contiene el nombre de la propiedad para enlazar la función dada.</dd>
- <dt><code>func</code></dt>
- <dd>A function to be bound to a lookup of the specified property.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>The <code>__defineGetter__</code> allows a {{jsxref("Operators/get", "getter", "", 1)}} to be defined on a pre-existing object.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">// Forma no-estándar y obsoleta
-
-var o = {};
-o.__defineGetter__('gimmeFive', function() { return 5; });
-console.log(o.gimmeFive); // 5
-
-
-// Formas compatibles con el estándar
-
-// Usando el operador get
-var o = { get gimmeFive() { return 5; } };
-console.log(o.gimmeFive); // 5
-
-// Usando Object.defineProperty
-var o = {};
-Object.defineProperty(o, 'gimmeFive', {
-  get: function() {
-    return 5;
-  }
-});
-console.log(o.gimmeFive); // 5
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="spectable standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('JavaScript', '#object.prototype.__definegetter__', 'Object.prototype.__defineGetter__()')}}</td>
-   <td>{{Spec2('JavaScript')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatIE("11")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.__defineSetter__()")}}</li>
- <li>{{jsxref("Operators/get", "get")}} operator</li>
- <li>{{jsxref("Object.defineProperty()")}}</li>
- <li>{{jsxref("Object.prototype.__lookupGetter__()")}}</li>
- <li>{{jsxref("Object.prototype.__lookupSetter__()")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">JS Guide: Defining Getters and Setters</a></li>
- <li><a href="http://whereswalden.com/2010/04/16/more-spidermonkey-changes-ancient-esoteric-very-rarely-used-syntax-for-creating-getters-and-setters-is-being-removed/">[Blog Post] Deprecation of __defineGetter__ and __defineSetter__</a></li>
- <li>{{bug(647423)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/__lookupgetter__/index.html b/files/es/web/javascript/referencia/objetos_globales/object/__lookupgetter__/index.html
deleted file mode 100644
index 8292222a38..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/__lookupgetter__/index.html
+++ /dev/null
@@ -1,84 +0,0 @@
----
-title: Object.prototype.__lookupGetter__()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/__lookupGetter__
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/__lookupGetter__
----
-<div>{{JSRef}} {{deprecated_header}}</div>
-
-<p>Los <code><strong>__lookupGetter__</strong></code> metodos retornan la funcion  enlazada como un getter para especificar la propiedad.</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code><var>obj</var>.__lookupGetter__(<var>sprop</var>)</code></pre>
-
-<h3 id="Parameters">Parameters</h3>
-
-<dl>
- <dt><code>sprop</code></dt>
- <dd>A string containing the name of the property whose getter should be returned.</dd>
-</dl>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>The function bound as a getter to the specified property.</p>
-
-<h2 id="Description">Description</h2>
-
-<p>If a getter has been defined for an object's property, it's not possible to reference the getter function through that property, because that property refers to the return value of that function. <code>__lookupGetter__</code> can be used to obtain a reference to the getter function.</p>
-
-<p>It is now possible to do this in a standardized way using {{jsxref("Object.getOwnPropertyDescriptor()")}} and {{jsxref("Object.getPrototypeOf()")}}.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<pre class="brush: js">var obj = {
-  get foo() {
-    return Math.random() &gt; 0.5 ? 'foo' : 'bar';
-  }
-};
-
-
-// Non-standard and deprecated way
-obj.__lookupGetter__('foo');
-// (function() { return Math.random() &gt; 0.5 ? 'foo' : 'bar'; })
-
-
-// Standard-compliant way
-Object.getOwnPropertyDescriptor(obj, "foo").get;
-// (function() { return Math.random() &gt; 0.5 ? 'foo' : 'bar'; })
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="spectable standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.prototype.__lookupGetter__', 'Object.prototype.__lookupGetter__()')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Included in the (normative) annex for additional ECMAScript legacy features for Web browsers (note that the specification codifies what is already in implementations).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Object.lookupGetter")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.__lookupSetter__()")}}</li>
- <li>{{jsxref("Functions/get", "get")}} operator</li>
- <li>{{jsxref("Object.getOwnPropertyDescriptor()")}} and {{jsxref("Object.getPrototypeOf()")}}</li>
- <li>{{jsxref("Object.prototype.__defineGetter__()")}}</li>
- <li>{{jsxref("Object.prototype.__defineSetter__()")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters">JS Guide: Defining Getters and Setters</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/assign/index.html b/files/es/web/javascript/referencia/objetos_globales/object/assign/index.html
deleted file mode 100644
index 17de417d75..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/assign/index.html
+++ /dev/null
@@ -1,274 +0,0 @@
----
-title: Object.assign()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/assign
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Objeto
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/assign
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Object.assign()</code></strong> copia todas las propiedades enumerables de uno o más objetos fuente a un objeto destino. Devuelve el objeto destino. </p>
-
-<div>{{EmbedInteractiveExample("pages/js/object-assign.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">Object.assign(<var>objetivo</var>, ...<var>fuentes</var>)</pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>objetivo</code></dt>
- <dd>El objeto destino.</dd>
- <dt><code>fuentes</code></dt>
- <dd>Los objetos origen.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El objeto destino.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las propiedades en el objeto destino serán sobrescritas por las propiedades en las fuentes si tienen la misma clave. Propiedades posteriores de las fuentes podrán sobrescribir las anteriores.</p>
-
-<p>El método <code>Object.assign()</code> copia sólo las propiedades <em>enumerables</em> y <em>propias</em> del objeto origen a un objeto destino. Usa <code>[[Get]]</code> en la origen y <code>[[Set]] </code>en el destino, por lo que invocará los métodos de acceso y establecimiento (<em>getters</em> y <em>setters</em>). Por consiguiente <em>asignará</em> propiedades frente a sólo copiar o definir propiedades nuevas. Esto puede hacer que sea inadecuado para fusionar propiedades nuevas en un prototipo si los objetos fuente contienen métodos de acceso (<em>getters</em>). Para copiar definiciones de propiedades en prototipos, incluyendo su enumerabilidad, se deben usar {{jsxref("Object.getOwnPropertyDescriptor()")}} y {{jsxref("Object.defineProperty()")}}.</p>
-
-<p>Tanto las propiedades {{jsxref("String")}} como {{jsxref("Symbol")}} son copiadas.</p>
-
-<p>En caso de un error, por ejemplo si una propiedad es de solo lectura, se lanza un {{jsxref("TypeError")}}, y el objeto destino se mantendrá sin cambios.</p>
-
-<p>Note que <code>Object.assign()</code> no lanza excepciones al encontrar en las fuentes propiedades {{jsxref("null")}} o {{jsxref("undefined")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Clonando_un_objeto">Clonando un objeto</h3>
-
-<pre class="brush: js">var obj = { a: 1 };
-var copy = Object.assign({}, obj);
-console.log(copy); // { a: 1 }
-</pre>
-
-<h3 id="Advertencia_para_clonado_profundo">Advertencia para clonado profundo</h3>
-
-<p>Para un clonado profundo, necesitamos usar otra alternativa ya que <code>Object.assign()</code> copia valores de propiedades. Si el valor en la fuente es una referencia a un objeto, solo se copia la referencia en sí, como valor de la propiedad.</p>
-
-<pre class="brush: js">function test() {
-  'use strict';
-
-  let obj1 = { a: 0 , b: { c: 0}};
-  let obj2 = Object.assign({}, obj1);
-  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
-
-  obj1.a = 1;
-  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
-  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
-
-  obj2.a = 2;
-  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
-  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}
-
-  obj2.b.c = 3;
-  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
-  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}}
-
-  // Deep Clone
-  obj1 = { a: 0 , b: { c: 0}};
-  let obj3 = JSON.parse(JSON.stringify(obj1));
-  obj1.a = 4;
-  obj1.b.c = 4;
-  console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}
-}
-
-test();</pre>
-
-<h3 id="Fusionando_objetos">Fusionando objetos</h3>
-
-<pre class="brush: js">var o1 = { a: 1 };
-var o2 = { b: 2 };
-var o3 = { c: 3 };
-
-var obj = Object.assign(o1, o2, o3);
-console.log(obj); // { a: 1, b: 2, c: 3 }
-console.log(o1);  // { a: 1, b: 2, c: 3 }, target object itself is changed.</pre>
-
-<h3 id="Fusionando_objetos_con_las_mismas_propiedades">Fusionando objetos con las mismas propiedades</h3>
-
-<pre class="brush: js">var o1 = { a: 1, b: 1, c: 1 };
-var o2 = { b: 2, c: 2 };
-var o3 = { c: 3 };
-
-var obj = Object.assign({}, o1, o2, o3);
-console.log(obj); // { a: 1, b: 2, c: 3 }</pre>
-
-<p>Las propiedades también son sobreescritas por otros objetos que aparecen posteriormente en la lista de parámetros y que tienen propiedades con el mismo nombre.</p>
-
-<h3 id="Copiando_propiedades_de_tipo_símbolo">Copiando propiedades de tipo símbolo</h3>
-
-<pre class="brush: js">var o1 = { a: 1 };
-var o2 = { [Symbol('foo')]: 2 };
-
-var obj = Object.assign({}, o1, o2);
-console.log(obj); // { a : 1, [Symbol("foo")]: 2 } (cf. bug 1207182 on Firefox)
-Object.getOwnPropertySymbols(obj); // [Symbol(foo)]
-</pre>
-
-<h3 id="Las_propiedades_heredadas_y_las_no_enumerables_no_pueden_ser_copiadas">Las propiedades heredadas y las no enumerables no pueden ser copiadas</h3>
-
-<pre class="brush: js">var obj = Object.create({ foo: 1 }, { // foo es una propiedad heredada.
-  bar: {
-    value: 2  // bar es una propiedad no enumerable.
-  },
-  baz: {
-    value: 3,
-    enumerable: true  // baz es una propiedad propia enumerable.
-  }
-});
-
-var copy = Object.assign({}, obj);
-console.log(copy); // { baz: 3 }
-</pre>
-
-<h3 id="Los_tipos_primitivos_serán_encapsulados_en_objetos">Los tipos primitivos serán encapsulados en objetos</h3>
-
-<pre class="brush: js">var v1 = 'abc';
-var v2 = true;
-var v3 = 10;
-var v4 = Symbol('foo')
-
-var obj = Object.assign({}, v1, null, v2, undefined, v3, v4);
-// Los tipos primitivos son encapsulados en objetos y se ignoran las propiedades con valor null o undefined.
-// Nótese que sólo los wrappers de cadenas tienen propiedades enumerables:
-console.log(obj); // { "0": "a", "1": "b", "2": "c" }
-</pre>
-
-<h3 id="Las_excepciones_interrumpen_la_tarea_de_copiado">Las excepciones interrumpen la tarea de copiado</h3>
-
-<pre class="brush: js">var target = Object.defineProperty({}, 'foo', {
-  value: 1,
-  writeable: false
-}); // target.foo es una propiedad de sólo lectura
-
-Object.assign(target, { bar: 2 }, { foo2: 3, foo: 3, foo3: 3 }, { baz: 4 });
-// TypeError: "foo" es de sólo lectura
-// La excepción se lanza cuando se intenta asignar un valor a target.foo
-
-console.log(target.bar);  // 2, la primera fuente fue copiada.
-console.log(target.foo2); // 3, la primera propiedad del segundo objeto fuente se copió correctamente.
-console.log(target.foo);  // 1, se lanza la excepción.
-console.log(target.foo3); // undefined, el método assign ha finalizado, no se copiará foo3.
-console.log(target.baz);  // undefined, tampoco se copiará el tercer objecto fuente.
-</pre>
-
-<h3 id="Copiando_métodos_de_acceso">Copiando métodos de acceso</h3>
-
-<pre class="brush: js">var obj = {
-  foo: 1,
-  get bar() {
-    return 2;
-  }
-};
-
-var copy = Object.assign({}, obj);
-console.log(copy);
-// { foo: 1, bar: 2 }, the value of copy.bar is obj.bar's getter's return value.
-
-// This is an assign function that copies full descriptors
-function completeAssign(target, ...sources) {
-  sources.forEach(source =&gt; {
-    let descriptors = Object.keys(source).reduce((descriptors, key) =&gt; {
-      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
-      return descriptors;
-    }, {});
-    // by default, Object.assign copies enumerable Symbols too
-    Object.getOwnPropertySymbols(source).forEach(sym =&gt; {
-      let descriptor = Object.getOwnPropertyDescriptor(source, sym);
-      if (descriptor.enumerable) {
-        descriptors[sym] = descriptor;
-      }
-    });
-    Object.defineProperties(target, descriptors);
-  });
-  return target;
-}
-
-var copy = completeAssign({}, obj);
-console.log(copy);
-// { foo:1, get bar() { return 2 } }
-</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<p>Este {{Glossary("Polyfill","polyfill")}} no soporta propiedades símbolo, ya que ES5 no tiene símbolos.</p>
-
-<pre class="brush: js">if (typeof Object.assign != 'function') {
-  // Must be writable: true, enumerable: false, configurable: true
-  Object.defineProperty(Object, "assign", {
-    value: function assign(target, varArgs) { // .length of function is 2
-      'use strict';
-      if (target == null) { // TypeError if undefined or null
-        throw new TypeError('Cannot convert undefined or null to object');
-      }
-
-      var to = Object(target);
-
-      for (var index = 1; index &lt; arguments.length; index++) {
-        var nextSource = arguments[index];
-
-        if (nextSource != null) { // Skip over if undefined or null
-          for (var nextKey in nextSource) {
-            // Avoid bugs when hasOwnProperty is shadowed
-            if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) {
-              to[nextKey] = nextSource[nextKey];
-            }
-          }
-        }
-      }
-      return to;
-    },
-    writable: true,
-    configurable: true
-  });
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-object.assign', 'Object.assign')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.assign', 'Object.assign')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<p>{{Compat("javascript.builtins.Object.assign")}}</p>
-</div>
-
-<h2 id="Ver_también" name="Ver también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.defineProperties()")}}</li>
- <li><a href="/es/docs/Web/JavaScript/enumeracion_y_propietario_de_propiedades">Enumeración y propietarios de propiedades</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/Sintaxis_Spread#Spread_en_literales_tipo_Objeto">Spread en literales tipo Objeto</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/constructor/index.html b/files/es/web/javascript/referencia/objetos_globales/object/constructor/index.html
deleted file mode 100644
index 3871c41fe3..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/constructor/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Object.prototype.constructor
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/constructor
-tags:
-  - JavaScript
-  - Object
-  - Property
-  - Prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/constructor
----
-<div>{{JSRef("Objetos_globales", "Object")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>Retorna una referencia a la función del {{jsxref("Object")}} que creó el objeto de la instancia. Note que el valor de esta propiedad es una referencia a la función misma, no a un string conteniendo el nombre de la función. El valor es sólo de lectura para valores primitivos tales como 1, true y 'test'.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Todos los objetos tienen una propiedad <code>constructor.</code> Los objetos creados sin explicitar el uso de una función (como son los objetos y las cadenas literales) tendrán una propiedad de <code>constructor</code> que apunta al tipo de constructor del Objeto Fundamento para ese objeto.</p>
-
-<pre class="brush:js">var o = {};
-o.constructor === Object; // true
-
-var a = [];
-a.constructor === Array; // true
-
-var n = new Number(3);
-n.constructor === Number; // true</pre>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Displaying_the_constructor_of_an_object" name="Example:_Displaying_the_constructor_of_an_object">Ejemplo: Mostrando el constructor de un objeto.</h3>
-
-<p>El siguiente ejemplo crea un prototipo, <code>Tree</code>, y un objeto de este tipo, <code>theTree</code>. El ejemplo muestra entonces la propiedad <code>constructor</code> para el objeto <code>theTree</code>.</p>
-
-<pre class="brush:js">function Tree (name) {
-   this.name = name;
-}
-
-var theTree = new Tree( "Redwood" );
-console.log( "theTree.constructor is " + theTree.constructor );</pre>
-
-<p>Este ejemplo muestra la siguiente salida:</p>
-
-<pre class="brush:js">theTree.constructor is function Tree (name) {
-    this.name = name;
-}</pre>
-
-<h3 id="Example:_Changing_the_constructor_of_an_object" name="Example:_Changing_the_constructor_of_an_object">Ejemplo: Cambiando el constructor de un objeto.</h3>
-
-<p>El siguiente ejemplo demuestra como modificar el valor del constructor de objetos genéricos. Solo <code>true</code>, <code>1</code> y <code>"test"</code> no serán afectados ya que ellos tienen constructores nativos de solo lectura. Este ejemplo demuestra que no siempre es seguro confiar en la propiedad constructor de un objeto.</p>
-
-<pre class="brush:js">function Type () {}
-
-var types = [
-    new Array(),
-    [],
-    new Boolean(),
-    true,             // no cambia
-<span style="line-height: normal;">    </span>new Date(),
-<span style="line-height: normal;">    </span>new Error(),
-<span style="line-height: normal;">    </span>new Function(),
-    function () {},
-<span style="line-height: normal;">    </span>Math,
-<span style="line-height: normal;">    </span>new Number(),
-    1,                // no cambia
-<span style="line-height: normal;">    </span>new Object(),
-    {},
-<span style="line-height: normal;">    </span>new RegExp(),
-    /(?:)/,
-<span style="line-height: normal;">    </span>new String(),
-    "test"            // no cambia
-];
-
-for( var i = 0; i &lt; types.length; i++ ) {
-    types[i].constructor = Type;
-    types[i] = [ types[i].constructor, types[i] instanceof Type, types[i].toString() ];
-}
-
-console.log( types.join( "\n" ) );</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1ra. Edición. Implementado en JavaScript 1.1</td>
-   <td>Estandar.</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.4.1', 'Objectprototype.constructor')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.prototype.constructor', 'Object.prototype.constructor')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p> </p>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/create/index.html b/files/es/web/javascript/referencia/objetos_globales/object/create/index.html
deleted file mode 100644
index 94608d1c58..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/create/index.html
+++ /dev/null
@@ -1,377 +0,0 @@
----
-title: Object.create()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/create
-tags:
-  - ECMAScript5
-  - JavaScript
-  - 'Null'
-  - Objeto
-  - Referencia
-  - metodo
-  - polyfill
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/create
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.create()</strong></code> crea un objeto nuevo, utilizando un objeto existente como el prototipo del nuevo objeto creado.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/object-create.html")}}</div>
-
-<div></div>
-
-<div>La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción (pull request).</div>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">Object.create(<var>proto</var>[, <var>propertiesObject</var>])</pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><em>proto</em></dt>
- <dd>Objeto el cual debe ser el prototipo del nuevo objeto creado.</dd>
- <dt><em>propertiesObject</em></dt>
- <dd>Opcional. Si se especifica y no es {{jsxref("undefined")}}, un objeto cuyas propiedades enumerables propias (es decir, aquellas propiedades definidas sobre si mismo y <em>no</em> son propiedades enumerable a lo largo de su cadena de prototipos) espefica descriptores de propiedad para ser agregadas al objeto recien creado, con los nombres de propiedad correspondiente. Estas propiedades corresponden al segundo argumento de {{jsxref("Object.defineProperties")}}.</dd>
-</dl>
-
-<h3 id="Description" name="Description">Valor devuelto</h3>
-
-<p>Un nuevo objeto con el prototipo y propiedades del objeto especificado.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<p>Una excepción {{jsxref("TypeError")}} si el parámetro <code>propertiesObject</code> es {{jsxref("null")}} o un objeto envolvente no primitivo.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Herencia_clásica_con_Object.create">Herencia clásica con <code>Object.create()</code></h3>
-
-<p>Debajo se encuentra un ejemplo de cómo usar <code>Object.create()</code> para lograr herencia clásica. Este es para herencia simple, la cual es todo lo que soporta JavaScript.</p>
-
-<pre class="brush: js notranslate">// Shape - superclase
-function Shape() {
-  this.x = 0;
-  this.y = 0;
-}
-
-// método de la superclase
-Shape.prototype.move = function(x, y) {
-    this.x += x;
-    this.y += y;
-    console.info("Shape moved.");
-};
-
-// Rectangle - subclase
-function Rectangle() {
-  Shape.call(this); // llama al contructor de la superclase.
-}
-
-// subclase extiende superclase
-Rectangle.prototype = Object.create(Shape.prototype);
-Rectangle.prototype.constructor = Rectangle;
-
-var rect = new Rectangle();
-
-console.log('¿Es rect una instancia de Rectangle?',
-  rect instanceof Rectangle); // true
-console.log('¿Es rect una instancia de Shape?',
-  rect instanceof Shape); // true
-rect.move(1, 1); // Imprime, 'Shape moved.'
-</pre>
-
-<p>Si desea heredar desde múltiples objetos, entonces los mixins son una posibilidad.</p>
-
-<pre class="brush: js notranslate">function MyClass() {
-  SuperClass.call(this);
-  OtherSuperClass.call(this);
-}
-
-// inherit one class
-MyClass.prototype = Object.create(SuperClass.prototype);
-// mixin another
-Object.assign(MyClass.prototype, OtherSuperClass.prototype);
-// re-assign constructor
-MyClass.prototype.constructor = MyClass;
-
-MyClass.prototype.myMethod = function() {
-  // do something
-};
-</pre>
-
-<p>{{jsxref("Object.assign()")}} copia las propiedades del prototipo <em>OtherSuperClass</em> al prototipo de <em>MyClass</em>, haciéndolas disponibles en todas las instancias de <em>MyClass</em>. <code>Object.assign()</code> se introdujo con ES2015 y <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/assign#Polyfill">tiene polyfill</a>. Si el soporte para navegadores antiguos es necesario, se puede utilizar <code><a href="https://api.jquery.com/jQuery.extend/">jQuery.extend()</a></code> o <code><a href="https://lodash.com/docs/#assign">_.assign()</a></code>.</p>
-
-<h3 id="Usando_el_argumento_propertiesObject_con_Object.create">Usando el argumento <code>propertiesObject</code> con <code>Object.create()</code></h3>
-
-<pre class="brush: js notranslate">var o;
-
-// crea un objeto con un prototipo como null
-o = Object.create(null);
-
-
-o = {};
-// esto equivale a:
-o = Object.create(Object.prototype);
-
-
-// Ejemplo en donde creamos un objeto con un par de propiedades de ejemplo.
-// (Note que el segundo parámetro mapea claves para los *descriptores de propiedad*.)
-o = Object.create(Object.prototype, {
-  // foo es un habitual "propiedad de valor"
-  foo: { writable:true, configurable:true, value: "hello" },
-  // bar es una propiedad getter-and-setter (de acceso)
-  bar: {
-    configurable: false,
-    get: function() { return 10 },
-    set: function(value) { console.log("Setting `o.bar` to", value) }
-}});
-
-
-function Constructor(){}
-o = new Constructor();
-// es equivalente a:
-o = Object.create(Constructor.prototype);
-// Por supuesto, si hay un código de inicialización en la
-// función Constructor, el Object.create no puede reflejar esta.
-
-
-// crear un nuevo objeto cuyo prototipo es un nuevo, objeto vacío
-// y agregar una única propiedad 'p', con el valor 42
-o = Object.create({}, { p: { value: 42 } })
-
-// por defecto las propiedades NO SON editables, enumerables o configurables:
-o.p = 24
-o.p
-// 42
-
-o.q = 12
-for (var prop in o) {
-   console.log(prop)
-}
-// "q"
-
-delete o.p
-// false
-
-// <span style="font-size: 1rem;">para especificar una propiedad en ES3</span>
-
-o2 = Object.create({}, { p: {
-      value: 42,
-      writable: true,
-      enumerable: true,
-      configurable: true }
-});
-</pre>
-
-<h2 id="Objetos_personalizados_y_nulos">Objetos personalizados y nulos</h2>
-
-<p>Un objeto nuevo creado de un objeto completamente personalizado (especialmente uno creado de un objeto nulo, que es básicamente un objeto personalizado sin miembros) puede comportarse de manera inesperada. Esto es especialmente cierto cuando se depura, ya que las funciones comunes  de conversión/detección de propiedad de objeto pueden generar errores, o simplemente perder información (especialmente si se atrapan excepciones de manera silenciosa que ignoran los errores). Por ejemplo, aquí hay dos objetos:</p>
-
-<pre class="brush: js notranslate">oco = Object.create( {} );   // Crea un objeto normal
-ocn = Object.create( null ); // Crea un objeto "null"
-
-&gt; console.log(oco) // {} -- Parece normal
-&gt; console.log(ocn) // {} -- Parece normal aquí también, hasta este momento
-
-oco.p = 1; // Crea una propiedad simple en un objeto normal
-ocn.p = 0; // Crea una propiedad simple en un objeto "null"
-
-&gt; console.log(oco) // {p: 1} -- Todavía parece normal
-&gt; console.log(ocn) // {p: 0} --Todavía parece normal aquí también. PERO ESPERA...
-</pre>
-
-<p>Como se muestra arriba, todo parece normal hasta ahora. Sin embargo, al intentar usar estos objetos, sus diferencias se hacen evidentes rápidamente:</p>
-
-<pre class="brush: js notranslate">&gt; "oco is: " + oco // Muestra "ocn is: [object Object]"
-
-&gt; "ocn is: " + ocn // Arroja error: Cannot convert object to primitive value
-</pre>
-
-<p>Probar solo algunas de las funciones incorporadas más básicas muestra la magnitud del problema más claramente:</p>
-
-<pre class="brush: js notranslate">&gt; alert(oco) // Muestra: [object Object]
-&gt; alert(ocn) // Arroja error: Cannot convert object to primitive value
-
-&gt; oco.toString() // Muestra [object Object]
-&gt; ocn.toString() // Arroja error: ocn.toString is not a function
-
-&gt; oco.valueOf() // Muestra{}
-&gt; ocn.valueOf() // Arroja error: ocn.valueOf is not a function
-
-&gt; oco.hasOwnProperty("p") // Muestra "true"
-&gt; ocn.hasOwnProperty("p") // Arroja error: ocn.hasOwnProperty is not a function
-
-&gt; oco.constructor // Muestra "Object() { [native code] }"
-&gt; ocn.constructor // Muestra "undefined"
-</pre>
-
-<p>Como se dijo, estas diferencias pueden hacer que la depuración e incluso problemas aparentemente simples se pierdan rápidamente. Por ejemplo:</p>
-
-<p><em>Una función simple de depuración:</em></p>
-
-<pre class="brush: js notranslate">// mostrar nombre de propiedad de nivel superior: pares de valores de un objeto dado
-function ShowProperties( b ){
-  for( var i in b ){  console.log( i + ": " + b[i] + "\n" )  }
-}</pre>
-
-<p><em>Resultados no tan simples: (especialmente si la captura silenciosa de errores había ocultado los mensajes de error)</em></p>
-
-<pre class="brush: js notranslate">ob={}; ob.po=oco; ob.pn=ocn; // crear un objeto compuesto usando los objetos de prueba de arriba como valores de propiedad
-
-&gt; ShowProperties( ob ) // Muestra propiedades de nivel superior
-- po: [object Object]
-- Error: Cannot convert object to primitive value
-
-Tenga en cuenta que solo se muestra la primera propiedad.
-</pre>
-
-<p><em>(Pero si se crea el mismo objeto simplemente en un orden diferente, al menos en algunas implementaciones ...)</em></p>
-
-<pre class="brush: js notranslate">ob={}; ob.pn=ocn; ob.po=oco; // cree el mismo objeto compuesto nuevamente, pero cree las mismas propiedades en un orden diferente
-
-&gt; ShowProperties( ob ) // Muestra propiedades de nivel superior
-- Error: Cannot convert object to primitive value
-
-Tenga en cuenta que ninguna propiedad se muestra.</pre>
-
-<p>Tenga en cuenta que un orden tan diferente puede surgir estáticamente a través de codificaciones fijas dispares, como aquí, pero también dinámicamente a través del orden en que se ejecutan dichas ramas de código de adición de propiedades en tiempo de ejecución, ya que depende de entradas y / o variables aleatorias. Por otra parte, el orden de iteración real no está garantizado, independientemente de cómo son agregados los miembros.</p>
-
-<h4 id="Algunas_NO-soluciones">Algunas NO-soluciones</h4>
-
-<p>A good solution for the missing object-methods is not immediately apparent.</p>
-
-<p>Adding the missing object-method directly from the standard-object does NOT work:</p>
-
-<pre class="brush: js notranslate">ocn = Object.create( null ); // create "null" object (same as before)
-
-ocn.toString = Object.toString; // since new object lacks method then try assigning it directly from standard-object
-
-<span style="">&gt; ocn.toString // shows "toString() { [native code] }" -- missing method seems to be there now</span>
-&gt; ocn.toString == Object.toString // shows "true" -- method seems to be same as the standard object-method
-
-&gt; ocn.toString() // error: Function.prototype.toString requires that 'this' be a Function
-</pre>
-
-<p><br>
- Adding the missing object-method directly to new object's "prototype" does not work either, since new object does not have a real prototype (which is really the cause of ALL these problems) and one cannot be <strong>directly</strong> added:</p>
-
-<pre class="brush: js notranslate">ocn = Object.create( null ); // create "null" object (same as before)
-
-ocn.prototype.toString = Object.toString; // Error: Cannot set property 'toString' of undefined
-
-ocn.prototype = {};                       // try to create a prototype
-ocn.prototype.toString = Object.toString; // since new object lacks method then try assigning it from standard-object  <span style="">
-
-&gt; ocn.toString() // error: ocn.toString is not a function</span>
-</pre>
-
-<p><br>
- Adding the missing object-method by using the standard-object<strong> </strong>as new object's prototype does not work either:</p>
-
-<pre class="brush: js notranslate">ocn = Object.create( null );        // create "null" object (same as before)
-Object.setPrototypeOf(ocn, Object); // set new object's prototype to the standard-object
-
-&gt; ocn.toString() // error: Function.prototype.toString requires that 'this' be a Function
-</pre>
-
-<h4 id="Algunas_soluciones_aceptables">Algunas soluciones aceptables</h4>
-
-<p>Again, adding the missing object-method directly from the <strong>standard-object </strong>does NOT work. However, adding the <strong>generic</strong> method directly, DOES:</p>
-
-<pre class="brush: js notranslate">ocn = Object.create( null ); // create "null" object (same as before)
-
-ocn.toString = toString; // since new object lacks method then assign it directly from generic version
-
-&gt; ocn.toString() // shows "[object Object]"
-&gt; "ocn is: " + ocn // shows "ocn is: [object Object]"
-
-
-ob={}; ob.pn=ocn; ob.po=oco; // create a compound object (same as before)
-
-&gt; ShowProperties(ob) // display top-level properties
-- po: [object Object]
-- pn: [object Object]
-</pre>
-
-<p>However, setting the generic <strong>prototype</strong> as the new object's prototype works even better:</p>
-
-<pre class="brush: js notranslate">ocn = Object.create( null );                  // create "null" object (same as before)
-Object.setPrototypeOf(ocn, Object.prototype); // set new object's prototype to the "generic" object (NOT standard-object)
-</pre>
-
-<p><em>(In addition to all the string-related functions shown above, this also adds:)</em></p>
-
-<pre class="brush: js notranslate">&gt; ocn.valueOf() // shows {}
-&gt; ocn.hasOwnProperty("x") // shows "false"
-&gt; ocn.constructor // shows "Object() { [native code] }"
-
-// ...and all the rest of the properties and methods of Object.prototype.
-</pre>
-
-<p>As shown, objects modified this way now look very much like ordinary objects.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este polyfill cubre el caso de uso principal  el cual es la creación de un nuevo objeto para el prototipo que ha sido escogido pero no toma el segundo argumento en cuenta.</p>
-
-<p>Note that while the setting of <code>null</code> as <code>[[Prototype]]</code> is supported in the real ES5 <code>Object.create</code>, this polyfill cannot support it due to a limitation inherent in versions of ECMAScript lower than 5.</p>
-
-<pre class="brush: js notranslate"> if (typeof Object.create !== "function") {
-    Object.create = function (proto, propertiesObject) {
-        if (typeof proto !== 'object' &amp;&amp; typeof proto !== 'function') {
-            throw new TypeError('Object prototype may only be an Object: ' + proto);
-        } else if (proto === null) {
-            throw new Error("This browser's implementation of Object.create is a shim and doesn't support 'null' as the first argument.");
-        }
-
-        if (typeof propertiesObject != 'undefined') {
-            throw new Error("This browser's implementation of Object.create is a shim and doesn't support a second argument.");
-        }
-
-        function F() {}
-        F.prototype = proto;
-
-        return new F();
-    };
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.5', 'Object.create')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.8.5</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.create', 'Object.create')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.create', 'Object.create')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Object.create")}}</div>
-
-<h2 id="Ver_tambien" name="Ver_tambien">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.defineProperty")}}</li>
- <li>{{jsxref("Object.defineProperties")}}</li>
- <li>{{jsxref("Object.prototype.isPrototypeOf")}}</li>
- <li>{{jsxref("Reflect.construct()")}}</li>
- <li>Publicación de John Resig sobre <a class="external" href="http://ejohn.org/blog/objectgetprototypeof/" title="http://ejohn.org/blog/objectgetprototypeof/">getPrototypeOf()</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/defineproperties/index.html b/files/es/web/javascript/referencia/objetos_globales/object/defineproperties/index.html
deleted file mode 100644
index 3002dd200d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/defineproperties/index.html
+++ /dev/null
@@ -1,194 +0,0 @@
----
-title: Object.defineProperties()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/defineProperties
-tags:
-  - ECMAScript5
-  - JavaScript
-  - JavaScript 1.8.5
-  - Método(2)
-  - Objeto
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/defineProperties
----
-<div>{{JSRef("Objetos_globales", "Object")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>El metodo <strong><code>Object.defineProperties()</code></strong> define nuevas o modifica propiedades existentes directamente en el objeto, retornando el objeto.</p>
-
-<h2 id="Syntax" name="Syntax">Sintáxis</h2>
-
-<pre class="syntaxbox"><code>Object.defineProperties(<em>obj</em>, <em>propiedades</em>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt>obj</dt>
- <dd>El objeto sobre el cual se crearán o modificaran sus propiedades.</dd>
- <dt>propiedades</dt>
- <dd>Un objeto cuyas propiedades enumerables propias consituyen descriptores para las propiedades a ser definidas o modificadas.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p><code>Object.defineProperties</code>, en escencia, define todas las propiedades correspondientes a las propiedades propias con capacidad de enumeración de <code>props</code> en el objeto <code>objrops.</code></p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: js">Object.defineProperties(obj, {
-  "property1": {
-    value: true,
-    writable: true
-  },
-  "property2": {
-    value: "Hello",
-    writable: false
-  }
-  // etc. etc.
-});</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Asumiendo una ejecución pristina del entorno con todos los nombres y propiedades referidas a sus valores iniciales, <code>Object.defineProperties</code> es casi completamente equivalente (note el comentario en <code>isCallable</code>) a la siguiente reimplementación de JavaScript:</p>
-
-<pre class="brush: js;highlight:[8]">function defineProperties(obj, properties) {
-  function convertToDescriptor(desc) {
-    function hasProperty(obj, prop) {
-      return Object.prototype.hasOwnProperty.call(obj, prop);
-    }
-
-    function isCallable(v) {
-      // NB: modify as necessary if other values than functions are callable.
-      return typeof v === "function";
-    }
-
-    if (typeof desc !== "object" || desc === null)
-      throw new TypeError("bad desc");
-
-    var d = {};
-
-    if (hasProperty(desc, "enumerable"))
-      d.enumerable = !!obj.enumerable;
-    if (hasProperty(desc, "configurable"))
-      d.configurable = !!obj.configurable;
-    if (hasProperty(desc, "value"))
-      d.value = obj.value;
-    if (hasProperty(desc, "writable"))
-      d.writable = !!desc.writable;
-    if ( hasProperty(desc, "get") ) {
-      var g = desc.get;
-
-      if (!isCallable(g) &amp;&amp; g !== "undefined")
-        throw new TypeError("bad get");
-      d.get = g;
-    }
-    if ( hasProperty(desc, "set") ) {
-      var s = desc.set;
-      if (!isCallable(s) &amp;&amp; s !== "undefined")
-        throw new TypeError("bad set");
-      d.set = s;
-    }
-
-    if (("get" in d || "set" in d) &amp;&amp; ("value" in d || "writable" in d))
-      throw new TypeError("identity-confused descriptor");
-
-    return d;
-  }
-
-  if (typeof obj !== "object" || obj === null)
-    throw new TypeError("bad obj");
-
-  properties = Object(properties);
-
-  var keys = Object.keys(properties);
-  var descs = [];
-
-  for (var i = 0; i &lt; keys.length; i++)
-    descs.push([keys[i], convertToDescriptor(properties[keys[i]])]);
-
-  for (var i = 0; i &lt; descs.length; i++)
-    Object.defineProperty(obj, descs[i][0], descs[i][1]);
-
-  return obj;
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.7', 'Object.defineProperties')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.8.5</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.defineproperties', 'Object.defineProperties')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de navegadores</h2>
-
-<p>Basado en <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat tables</a>.</p>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatGeckoDesktop("2")}}</td>
-   <td>5 (previous versions untested)</td>
-   <td>9</td>
-   <td>11.60</td>
-   <td>5</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Android</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatGeckoMobile("2")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>11.50</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.defineProperty()")}}</li>
- <li>{{jsxref("Object.keys()")}}</li>
- <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties" title="Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/defineproperty/index.html b/files/es/web/javascript/referencia/objetos_globales/object/defineproperty/index.html
deleted file mode 100644
index f971d5a131..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/defineproperty/index.html
+++ /dev/null
@@ -1,419 +0,0 @@
----
-title: Object.defineProperty()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/defineProperty
-tags:
-  - ECMAScript5
-  - JavaScript
-  - JavaScript 1.8.5
-  - Método(2)
-  - Objeto
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/defineProperty
----
-<div>{{JSRef("Global_Objects", "Object")}}</div>
-
-<h2 id="summary" name="summary">Resumen</h2>
-
-<p>El  método estático <code><strong>Object.defineProperty()</strong></code> define una nueva propiedad sobre un objeto, o modifica una ya existente, y devuelve el objeto modificado.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Ud. puede llamar a este método directamente mediante el constructor {{jsxref("Object")}} en vez de crear una instancia del tipo <code>Object</code>.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Object.defineProperty(<var>obj</var>, <var>prop</var>, <var>descriptor</var>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto sobre el cual se define la propiedad.</dd>
- <dt><code>prop</code></dt>
- <dd>El nombre de la propiedad a ser definida o modificada.</dd>
- <dt><code>descriptor</code></dt>
- <dd>El descriptor de la propiedad que está siendo definida o modificada.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Este método permite añadir o modificar una propiedad en un objeto.</p>
-
-<p>La adición normal de una propiedad a través de la asignación crea propiedades que aparecen durante la enumeración de propiedades en el bucle ({{jsxref("Sentencias/for...in", "for...in")}} o el método {{jsxref("Object.keys")}}), cuyos valores pueden modificarse y pudiendo incluso eliminar la propiedad del objeto mediante el método {{jsxref("Operadores/delete", "delete")}}.</p>
-
-<p>Este método nos permite modificar el comportamiento por defecto de las propiedades. Es decir, nos permite definir una propiedad como no enumerable, no modificable o incluso evitar que pueda ser eliminada del objeto.</p>
-
-<p>Existen dos tipos de descriptores: De datos y de acceso.  Un <em><dfn>descriptor de datos</dfn></em> define una propiedad que tiene un valor, el cual puede ser o no modificado. Un descriptor de acceso define una propiedad mediante un par de funciones getter-setter que describe como se obtiene o se modifica el contenido de dicha propiedad. Un descriptor debe de ser de uno de estos dos tipos; no puede ser ambos.</p>
-
-<p>Ambos tipos de descriptores son objetos y comparten las siguientes claves opcionales:</p>
-
-<dl>
- <dt><code>configurable</code></dt>
- <dd><code>true</code> si y solo si el tipo de descriptor de propiedad puede modificarse y si la propiedad puede ser eliminada del correspondiente objeto.<br>
- <strong>Por defecto es <code>false</code>.</strong></dd>
- <dt><code>enumerable</code></dt>
- <dd><code>true</code> si y solo si dicha propiedad se muestra durante la enumeración de las propiedades del objeto correspondiente.<br>
- <strong>Por defecto es <code>false</code>.</strong></dd>
-</dl>
-
-<p>Un descriptor de datos tiene además las siguientes claves opcionales:</p>
-
-<dl>
- <dt><code>value</code></dt>
- <dd>El valor asociado a la propiedad. Puede ser cualquier tipo valido de JavaScript  (number, object, function, etc).<br>
- <strong>Por defecto es {{jsxref("Objetos_Globales/undefined", "undefined")}}.</strong></dd>
- <dt><code>writable</code></dt>
- <dd><code>true</code> Indica si el valor de la propiedad puede modificarse con el  {{jsxref("Operators/Assignment_Operators", "operador de asignación", "", 1)}}.<br>
- <strong>Defaults to <code>false</code>.</strong></dd>
-</dl>
-
-<p>Un descriptor de acceso además tiene las siguientes claves opcionales:</p>
-
-<dl>
- <dt><code>get</code></dt>
- <dd>Una función cuyo valor retornado será el que se use como valor de la propiedad.<br>
- <strong>Defaults to {{jsxref("Objetos_Globales/undefined", "undefined")}}.</strong></dd>
- <dt><code>set</code></dt>
- <dd>Una función que recibe como único argumento el nuevo valor que se desea asignar a la propiedad y que devuelve el valor que se almacenará finalmente en el objeto.<br>
- <strong>Defaults to {{jsxref("Objetos_Globales/undefined", "undefined")}}.</strong></dd>
-</dl>
-
-<p>Hay que tener en cuenta que estas opciones también pueden heredarse; es decir, las opciones de la propiedad se han podido establecer en el prototipo de una clase de la que hereda el objeto. De modo que si queremos asegurarnos unos valores por defecto tenemos tres opciones: fijar el {{jsxref("Object.prototype")}} con {{jsxref("Object.freeze")}}, definir todas las opciones explicitamente, o establecer a {{jsxref("Objetos_Globales/null", "null")}} la propiedad {{jsxref("Object.prototype.__proto__", "__proto__")}}.</p>
-
-<pre class="brush: js">// Usando __proto__
-Object.defineProperty(obj, 'key', {
-  __proto__: null, // no aceptar propiedades heredadas
-  value: 'static'  // no enumerable
-                   // no configurable
-                   // no modificable
-                   // como opciones por defecto
-});
-
-// Definiendo todo explicitamente
-Object.defineProperty(obj, 'key', {
-  enumerable: false,
-  configurable: false,
-  writable: false,
-  value: 'static'
-});
-
-// Reciclando el mismo objeto
-function withValue(value) {
-  var d = withValue.d || (
-    withValue.d = {
-      enumerable: false,
-      writable: false,
-      configurable: false,
-      value: null
-    }
-  );
-  d.value = value;
-  return d;
-}
-// ... y ...
-Object.defineProperty(obj, 'key', withValue('static'));
-
-// Si está disponible freeze, previene añadir o eliminar
-//del prototipo del objeto las propiedades
-// (value, get, set, enumerable, writable, configurable)
-(Object.freeze || Object)(Object.prototype);
-</pre>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<p>Si quiere ver algunos ejemplos de utilización del método <code>Object.defineProperty</code> con una sintaxis tipo <em>binary-flags</em>, vea <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty/Additional_examples">ejemplos adicionales</a>.</p>
-
-<h3 id="Example:_Creating_a_property" name="Example:_Creating_a_property">Ejemplo: Creando una propiedad</h3>
-
-<p>Cuando la propiedad especificada no existe en el objeto<code>, Object.defineProperty()</code> crea una nueva. En el descriptor pueden omitirse campos, a los cuales se les asignará el valor por defecto. A todos los que sean de tipo Booleano se les asignará el valor falso. Los campos <code>value</code>, <code>get</code> y <code>set</code> se establecerán por defecto a {{jsxref("Objetos_Globales/undefined", "undefined")}}. Una propiedad definida sin indicar  <code>get</code>/<code>set</code>/<code>value</code>/<code>writable</code> es denominada “genérica” y  “tipificada” como un descriptor de datos.</p>
-
-<pre class="brush: js">var o = {}; // Creates a new object
-
-// Example of an object property added with defineProperty with a data property descriptor
-Object.defineProperty(o, 'a', {
-  value: 37,
-  writable: true,
-  enumerable: true,
-  configurable: true
-});
-// 'a' property exists in the o object and its value is 37
-
-// Example of an object property added with defineProperty with an accessor property descriptor
-var bValue = 38;
-Object.defineProperty(o, 'b', {
-  get: function() { return bValue; },
-  set: function(newValue) { bValue = newValue; },
-  enumerable: true,
-  configurable: true
-});
-o.b; // 38
-// 'b' property exists in the o object and its value is 38
-// The value of o.b is now always identical to bValue, unless o.b is redefined
-
-// You cannot try to mix both:
-Object.defineProperty(o, 'conflict', {
-  value: 0x9f91102,
-  get: function() { return 0xdeadbeef; }
-});
-// throws a TypeError: value appears only in data descriptors, get appears only in accessor descriptors
-</pre>
-
-<h3 id="Example:_Modifying_a_property" name="Example:_Modifying_a_property">Ejemplo: Modificando una propiedad</h3>
-
-<p>Cuando la propiedad realmente existe, <code>Object.defineProperty()</code> intenta modificar la propiedad de acuerdo a los valores en la descripción y la configuración actual del objeto. Si la descripción antigüa tenía su atributo de configuración establecido en <code>false</code> (la propiedad se dice "sin capacidad de configuración"), entonces ningún atributo además de los que tienen capacidad de escritura pueden ser cambiados. En ese caso, no es posible cambiar hacía atras o hacía delante entre datos y métodos de acceso de tipos de propiedades.</p>
-
-<p>Si una propiedad no tiene capacidad de configuración, su atributo <code>writabble</code> solo puede ser cambiada to <code>false</code>.</p>
-
-<p>Un {{jsxref("Global_Objects/TypeError", "TypeError")}} es arrojado cuando se intenta cambiar las propiedades de atributos sin capacidad de configuración (adeḿas del atributo <code>writable</code>) a menos que el valor actual y el valor nuevo sean los mismos.</p>
-
-<h4 id="Writable_attribute" name="Writable_attribute">Atributo writable</h4>
-
-<p>Cuando la propiedad de un atributo <code>writable</code> es establecido to <code>false</code>, la propiedad se dice esta "sin capacidad de escritura". No puede ser reasignada.</p>
-
-<pre class="brush: js">var o = {}; // Crea un objeto nuevo
-
-Object.defineProperty(o, 'a', {
-  value: 37,
-  writable: false
-});
-
-console.log(o.a); // logs 37
-o.a = 25; // Ningún error arrojado (lo tiraría en modo estricto, aún si el valor fuera el mismo)
-console.log(o.a); // muestra 37. La asignación no funcionó
-</pre>
-
-<p>Como es visto en el ejemplo anterior, intentar escribir en una propiedad "sin capacidad de  escritura" no la cambia pero sí arroja un error.</p>
-
-<h4 id="Enumerable_attribute" name="Enumerable_attribute">Atributo enumerable</h4>
-
-<p>El atributo de la propiedad <code>enumerable</code> se define si la propiedad aparece en un ciclo {{jsxref("Statements/for...in", "for...in")}} y {{jsxref("Object.keys()")}} o no.</p>
-
-<pre class="brush: js">var o = {};
-Object.defineProperty(o, 'a', { value: 1, enumerable: true });
-Object.defineProperty(o, 'b', { value: 2, enumerable: false });
-Object.defineProperty(o, 'c', { value: 3 }); // enumerable defaults to false
-o.d = 4; // enumerable defaults to true when creating a property by setting it
-
-for (var i in o) {
-  console.log(i);
-}
-// logs 'a' and 'd' (in undefined order)
-
-Object.keys(o); // ['a', 'd']
-
-o.propertyIsEnumerable('a'); // true
-o.propertyIsEnumerable('b'); // false
-o.propertyIsEnumerable('c'); // false
-</pre>
-
-<h4 id="Configurable_attribute" name="Configurable_attribute">Atributo configurable</h4>
-
-<p>El atributo <code>configurable</code> define si la propiedad puede ser eliminada del objeto, y si sus atributos (excepto <code>writable</code>) pueden ser modificados</p>
-
-<pre class="brush: js">var o = {};
-Object.defineProperty(o, 'a', {
-  get: function() { return 1; },
-  configurable: false
-});
-
-Object.defineProperty(o, 'a', { configurable: true }); // arroja TypeError
-Object.defineProperty(o, 'a', { enumerable: true }); //  arroja  TypeError
-Object.defineProperty(o, 'a', { set: function() {} }); //  arroja  TypeError (set estaba definido como undefined)
-Object.defineProperty(o, 'a', { get: function() { return 1; } }); // arroja TypeError (incluso aunque los get hacen lo mismo)
-Object.defineProperty(o, 'a', { value: 12 }); // arroja TypeError
-
-console.log(o.a); // logs 1
-delete o.a; // No hace nada
-console.log(o.a); // logs 1
-</pre>
-
-<p>Si <code>o.a</code> tuviese <code>configurable</code>  a <code>true</code>, no se habrían arrojado errores y la propiedad habría sido eliminada. </p>
-
-<h3 id="Example:_Adding_properties_and_default_values" name="Example:_Adding_properties_and_default_values">Ejemplo: Añadiendo propiedades y valores por defecto</h3>
-
-<p>Es importante tener en cuenta la forma en la se aplican los valores por defecto de los atributos. Suele haber diferencias entre simplemente usar la notación con '.' y usar <code>Object.defineProperty()</code>, como se muestra en el siguiente ejemplo:</p>
-
-<pre class="brush: js">var o = {};
-
-o.a = 1;
-// es equivalente a :
-Object.defineProperty(o, 'a', {
-  value: 1,
-  writable: true,
-  configurable: true,
-  enumerable: true
-});
-
-
-// Sin embargo,
-Object.defineProperty(o, 'a', { value: 1 });
-// es equivalente a :
-Object.defineProperty(o, 'a', {
-  value: 1,
-  writable: false,
-  configurable: false,
-  enumerable: false
-});
-</pre>
-
-<h3 id="Example:_Custom_setters_and_getters" name="Example:_Custom_setters_and_getters">Ejemplo: Setters y Getters a medida</h3>
-
-<p>Example below shows how to implement a self-archiving object. When <code>temperature</code> property is set, the <code>archive</code> array gets a log entry.</p>
-
-<pre class="brush: js">function Archiver() {
-  var temperature = null;
-  var archive = [];
-
-  Object.defineProperty(this, 'temperature', {
-    get: function() {
-      console.log('get!');
-      return temperature;
-    },
-    set: function(value) {
-      temperature = value;
-      archive.push({ val: temperature });
-    }
-  });
-
-  this.getArchive = function() { return archive; };
-}
-
-var arc = new Archiver();
-arc.temperature; // 'get!'
-arc.temperature = 11;
-arc.temperature = 13;
-arc.getArchive(); // [{ val: 11 }, { val: 13 }]
-</pre>
-
-<p>or</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> pattern <span class="operator token">=</span> <span class="punctuation token">{</span>
-    <span class="keyword token">get</span><span class="punctuation token">:</span> <span class="keyword token">function</span> <span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">return</span> <span class="string token">'I always return this string, whatever you have assigned'</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span><span class="punctuation token">,</span>
-    <span class="keyword token">set</span><span class="punctuation token">:</span> <span class="keyword token">function</span> <span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">this</span><span class="punctuation token">.</span>myname <span class="operator token">=</span> <span class="string token">'this is my name string'</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">;</span>
-
-
-<span class="keyword token">function</span> <span class="function token">TestDefineSetAndGet</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    Object<span class="punctuation token">.</span><span class="function token">defineProperty</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">,</span> <span class="string token">'myproperty'</span><span class="punctuation token">,</span> pattern<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-
-<span class="keyword token">var</span> instance <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">TestDefineSetAndGet</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-instance<span class="punctuation token">.</span>myproperty <span class="operator token">=</span> <span class="string token">'test'</span><span class="punctuation token">;</span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>instance<span class="punctuation token">.</span>myproperty<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// I always return this string, whatever you have assigned</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>instance<span class="punctuation token">.</span>myname<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// this is my name string</span></code></pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.6', 'Object.defineProperty')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.defineproperty', 'Object.defineProperty')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Firefox (Gecko)</th>
-   <th>Chrome</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatGeckoDesktop("2")}}</td>
-   <td>{{CompatChrome("5")}} (versiones previas sin testear)</td>
-   <td>{{CompatIE("9")}} ({{CompatIE("8")}}, pero solo con objetos DOM y con muchos comportamientos no estándares  <a href="#Internet_Explorer_8_specific_notes">See below</a>.)</td>
-   <td>{{CompatOpera("11.60")}}</td>
-   <td>{{CompatSafari("5.1")}} ({{CompatSafari("5")}}, but not on DOM objects)</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Android</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatGeckoMobile("2")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatIE("9")}} and above</td>
-   <td>{{CompatOperaMobile("11.50")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Based on <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat tables</a>.</p>
-
-<h3 id="Redefining_the_length_property_of_an_Array_object" name="Redefining_the_length_property_of_an_Array_object">Redefining the <code>length</code> property of an <code>Array</code> object</h3>
-
-<p>It is possible to redefine the {{jsxref("Array.length", "length")}} property of arrays, subject to the usual redefinition restrictions. (The {{jsxref("Array.length", "length")}} property is initially non-configurable, non-enumerable, and writable. Thus on an unaltered array it is possible to change the {{jsxref("Array.length", "length")}} property's value, or to make it non-writable. It is not allowed to change its enumerability or configurability, or if it is non-writable to change its value or writability.) However, not all browsers permit this redefinition.</p>
-
-<p>Firefox 4 through 22 will throw a {{jsxref("Global_Objects/TypeError", "TypeError")}} on any attempt whatsoever (whether permitted or not) to redefine the {{jsxref("Array.length", "length")}} property of an array.</p>
-
-<p>Versions of Chrome which implement <code>Object.defineProperty()</code> in some circumstances ignore a length value different from the array's current {{jsxref("Array.length", "length")}} property. In some circumstances changing writability seems to silently not work (and not throw an exception). Also, relatedly, some array-mutating methods like {{jsxref("Array.prototype.push")}} don't respect a non-writable length.</p>
-
-<p>Versions of Safari which implement <code>Object.defineProperty()</code> ignore a <code>length</code> value different from the array's current {{jsxref("Array.length", "length")}} property, and attempts to change writability execute without error but do not actually change the property's writability.</p>
-
-<p>Only Internet Explorer 9 and later, and Firefox 23 and later, appear to fully and correctly implement redefinition of the {{jsxref("Array.length", "length")}} property of arrays. For now, don't rely on redefining the {{jsxref("Array.length", "length")}} property of an array to either work, or to work in a particular manner. And even when you <em>can</em> rely on it, <a href="http://whereswalden.com/2013/08/05/new-in-firefox-23-the-length-property-of-an-array-can-be-made-non-writable-but-you-shouldnt-do-it/">there's really no good reason to do so</a>.</p>
-
-<h3 id="Particularidades_de_Internet_Explorer_8">Particularidades de Internet Explorer 8</h3>
-
-<p>El método <code>Object.defineProperty()</code> de Internet Explorer <a href="http://msdn.microsoft.com/en-us/library/dd229916%28VS.85%29.aspx">sólo puede ser usado en objetos del DOM.</a> Algunas explicaciones al respecto:</p>
-
-<ul>
- <li>Intentar usar <code>Object.defineProperty()</code> en objetos nativos produce un error.</li>
- <li>Hay que definir un valor para todos los atributos de una propiedad: <code>true, true, true</code> para descriptores de datos y <code>true</code> para configurables, <code>false</code> para el descriptor de acceso   <code>enumerable</code>.(?) Cualquier intento de proporcionar otro valor(?) lanzará un error.</li>
- <li>Para reconfirurar una propiedad primero hay que eliminarla. Si no se elimina, la propiedad no cambia aunque se intente modificar.</li>
-</ul>
-
-<h2 id="See_also" name="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
- <li>{{jsxref("Object.defineProperties()")}}</li>
- <li>{{jsxref("Object.propertyIsEnumerable()")}}</li>
- <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
- <li>{{jsxref("Object.prototype.watch()")}}</li>
- <li>{{jsxref("Object.prototype.unwatch()")}}</li>
- <li>{{jsxref("Operators/get", "get")}}</li>
- <li>{{jsxref("Operators/set", "set")}}</li>
- <li>{{jsxref("Object.create()")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty/Additional_examples">Additional <code>Object.defineProperty</code> examples</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/entries/index.html b/files/es/web/javascript/referencia/objetos_globales/object/entries/index.html
deleted file mode 100644
index 98aff1178a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/entries/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Object.entries()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/entries
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/entries
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.entries()</strong></code> devuelve una matriz de pares propios de una propiedad enumerable [key, value] de un objeto dado, en el mismo orden que es proporcionado por {{jsxref("Sentencias/for...in", "for...in")}} (La diferencia es que un bucle for-in enumera las propiedades en la cadena de prototipos).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">Object.entries(<var>obj</var>)</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>The object whose enumerable own property <code>[key, value]</code> pairs are to be returned.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>An array of the given object's own enumerable property <code>[key, value]</code> pairs.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>Object.entries()</code> returns an array whose elements are arrays corresponding to the enumerable property <code>[key, value]</code> pairs found directly upon <code>object</code>. The ordering of the properties is the same as that given by looping over the property values of the object manually.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">var obj = { foo: 'bar', baz: 42 };
-console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]
-
-// array like object
-var obj = { 0: 'a', 1: 'b', 2: 'c' };
-console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]
-
-// array like object with random key ordering
-var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
-console.log(Object.entries(an_obj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]
-
-// getFoo is property which isn't enumerable
-var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
-my_obj.foo = 'bar';
-console.log(Object.entries(my_obj)); // [ ['foo', 'bar'] ]
-
-// non-object argument will be coerced to an object
-console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]
-
-// iterate through key-value gracefully
-var obj = {a: 5, b: 7, c: 9};
-for (var [key, value] of Object.entries(obj)) {
-    console.log(key + ' ' + value); // "a 5", "b 7", "c 9"
-}
-
-// Or, using array extras
-Object.entries(obj).forEach(([key, value]) =&gt; {
-    console.log(key + ' ' + value); // "a 5", "b 7", "c 9"
-});
-</pre>
-
-<h3 id="Converting_an_Object_to_a_Map">Converting an <code>Object</code> to a <code>Map</code></h3>
-
-<p>The {{jsxref("Map", "new Map()")}} constructor accepts an iterable of <code>entries</code>. With <code>Object.entries</code>, you can easily convert from {{jsxref("Object")}} to {{jsxref("Map")}}:</p>
-
-<pre class="brush: js">var obj = { foo: 'bar', baz: 42 };
-var map = new Map(Object.entries(obj));
-console.log(map); // Map { foo: "bar", baz: 42 }</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>To add compatible <code>Object.entries</code> support in older environments that do not natively support it, you can find a Polyfill in the <a href="https://github.com/tc39/proposal-object-values-entries">tc39/proposal-object-values-entries</a> or in the <a href="https://github.com/es-shims/Object.entries">es-shims/Object.entries</a> repositories.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.entries', 'Object.entries')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES8', '#sec-object.entries', 'Object.entries')}}</td>
-   <td>{{Spec2('ES8')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(54)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop(47)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatSafari(10.1)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android Webview</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(54)}}</td>
-   <td>{{CompatChrome(54)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile(47)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
- <li>{{jsxref("Object.keys()")}}</li>
- <li>{{jsxref("Object.values()")}} {{experimental_inline}}</li>
- <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li>
- <li>{{jsxref("Object.create()")}}</li>
- <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/freeze/index.html b/files/es/web/javascript/referencia/objetos_globales/object/freeze/index.html
deleted file mode 100644
index 890d0d07b4..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/freeze/index.html
+++ /dev/null
@@ -1,174 +0,0 @@
----
-title: Object.freeze()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/freeze
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/freeze
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.freeze()</strong></code> <em>congela</em> un objeto, es decir: impide que se le agreguen nuevas propiedades; impide que se puedan eliminar las propiedades ya existentes; impide que dichas propiedades, o su capacidad de enumeración, configuración, o escritura, puedan ser modificadas; impide también que se pueda modificar su prototipo. El método devuelve el objeto recibido.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/object-freeze.html")}}</div>
-
-<p class="hidden">El código de este ejemplo interactivo está almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, puedes clonar <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y enviarnos un <em>pull request</em>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Object.freeze(<var>obj</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto a <em>congelar</em>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El mismo objeto</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Nada puede ser agregado o removido de las propiedades establecidas de un objeto <em>congelado</em>. Cualquier intento de hacerlo fallará, ya sea de manera silenciosa o <em>arrojando una excepción </em>{{jsxref("TypeError")}} (más comunmente, pero no exclusivamente, en {{jsxref("Strict_mode", "strict mode", "", 1)}}).</p>
-
-<p>Los valores no pueden ser cambiados por propiedades de datos. Propiedades de acceso (<em>getters</em> y <em>setters</em>) funcionan igual (y aún dan la ilusión de que estas cambiando el valor). Note que los valores que son objetos aún pueden ser modificados, a menos que esten <em>congelados</em> tambien.</p>
-
-<p>La función retorna el mismo objeto pasado en ella, no crea una copia <em>congelada</em></p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Congelando_Objetos">Congelando Objetos</h3>
-
-<pre class="brush: js">var obj = {
-  prop: function() {},
-  foo: 'bar'
-};
-
-// Nuevas propiedades pueden ser agregadas,
-// propiedades existentes pueden cambiar o removerse
-obj.foo = 'baz';
-obj.lumpy = 'woof';
-delete obj.prop;
-
-// Ambos, el objeto pasado como argumento tanto como el que se regresa
-// serán congelados
-// Es innecesario salvar el objeto que es regresado en orden de <em>congelar</em>
-// el original.
-var o = Object.freeze(obj);
-
-assert(Object.isFrozen(obj) === true);
-
-// Ahora cualquier cambio fallará
-obj.foo = 'quux'; // No hace nada de manera silenciosa
-obj.quaxxor = 'the friendly duck'; // No agrega una nueva propiedad, de manera silenciosa
-
-// ...y en modo estrico tal intento arrojará TypeErrors
-function fail(){
-  'use strict';
-  obj.foo = 'sparky'; // arroja un TypeError
-  delete obj.quaxxor; // arroja un TypeError
-  obj.sparky = 'arf'; // arroja un TypeError
-}
-
-fail();
-
-// Los intentos utilizando Object.defineProperty tambien arrojarán una excepción...
-Object.defineProperty(obj, 'ohai', { value: 17 }); // arroja un TypeError
-Object.defineProperty(obj, 'foo', { value: 'eit' }); // arroja un TypeError
-
-// Es imposible cambiar un prototipo
-// Estos ejemplos retornan un error TypeError
-Object.setPrototype(obj,{x:20})
-obj.__proto__ = {x:20}
-</pre>
-
-<p>El siguiente ejemplo muestra que los valores de objetos en un objeto congelado pueden ser mutados (la congelación es superficial).</p>
-
-<pre class="brush: js">obj1 = {
-  internal: {}
-};
-
-Object.freeze(obj1);
-obj1.internal.a = 'aValue';
-
-obj1.internal.a // 'aValue'
-
-// Para hacer obj completamente inmutable, congelamos cada objeto en obj.
-// Para hacerlo, usamos esta función.
-function deepFreeze(obj) {
-
-  // Recuperamos el nombre de las propiedades en obj
-  var propNames = Object.getOwnPropertyNames(obj);
-
-  // Congelamos las propiedades antes de congelar a obj
-  propNames.forEach(function(name) {
-    var prop = obj[name];
-
-    // Si la propiedad es un objeto, llamaremos a deepFreezze para que congele las propiedades de ese objeto
-    if (typeof prop == 'object' &amp;&amp; prop !== null &amp;&amp; !Object.isFrozen(prop))
-      deepFreeze(prop);
-  });
-
-  // congelamos a obj
-  return Object.freeze(obj);
-}
-
-obj2 = {
-  internal: {}
-};
-
-deepFreeze(obj2);
-obj2.internal.a = 'anotherValue';
-obj2.internal.a; // undefined
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>En ES5, si el argumento pasado a este método no es un objeto (un primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un argumento no-objeto será tratado como si fuera un objeto <em>congelado</em> cualquiera, simplemente lo regresa.</p>
-
-<pre class="brush: js">&gt; Object.freeze(1)
-TypeError: 1 is not an object // Código ES5
-
-&gt; Object.freeze(1)
-1                             // Código ES6
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.9', 'Object.freeze')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.freeze', 'Object.freeze')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.freeze', 'Object.freeze')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Object.freeze")}}</p>
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li>{{jsxref("Object.isFrozen()")}}</li>
- <li>{{jsxref("Object.preventExtensions()")}}</li>
- <li>{{jsxref("Object.isExtensible()")}}</li>
- <li>{{jsxref("Object.seal()")}}</li>
- <li>{{jsxref("Object.isSealed()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/fromentries/index.html b/files/es/web/javascript/referencia/objetos_globales/object/fromentries/index.html
deleted file mode 100644
index 023cc5f8ca..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/fromentries/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: Object.fromEntries()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/fromEntries
-tags:
-  - JavaScript
-  - Objeto
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/fromEntries
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.fromEntries()</strong></code> transforma una lista de pares con <code>[clave-valor] </code>en un objeto.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/object-fromentries.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">Object.fromEntries(<var>iterable</var>);</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>iterador</var></code></dt>
- <dd>Un iterador como {{jsxref("Array")}}, {{jsxref("Map")}} u otros objetos que implementen el <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">protocolo iterable</a>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un nuevo objeto cuyas propiedades son dadas por las entradas del iterador.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>Object.fromEntries()</code> toma una lista de pares con clave-valor y devuelve un nuevo objeto cuyas propiedades son dadas por éstas entradas. El argumento <em>iterador </em>se espera que sea un objeto que implemente un método <code>@@iterator</code>, que devuelve un objeto iterador, que produce un objeto tipo array de dos elementos, donde el primer elemento es un valor que se usará como la clave de la propiedad, y el segundo elemento es el valor a asociar con esa clave de propiedad.</p>
-
-<p><code>Object.fromEntries()</code> realiza lo inverso de {{jsxref("Object.entries()")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Convirtiendo_un_Map_en_un_Objeto">Convirtiendo un <code>Map</code> en un <code>Objeto</code></h3>
-
-<p>Con <code>Object.fromEntries</code>, puedes convertir de un {{jsxref("Map")}} a un {{jsxref("Object")}}:</p>
-
-<pre class="brush: js notranslate">const map = new Map([ ['foo', 'bar'], ['baz', 42] ]);
-const obj = Object.fromEntries(map);
-console.log(obj); // { foo: "bar", baz: 42 }
-</pre>
-
-<h3 id="Convirtiendo_un_Arreglo_en_un_Objeto">Convirtiendo un <code>Arreglo</code> en un <code>Objeto</code></h3>
-
-<p>Con <code>Object.fromEntries</code>, puedes convertir de un {{jsxref("Array")}} a un {{jsxref("Object")}}:</p>
-
-<pre class="brush: js notranslate">const arr = [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ];
-const obj = Object.fromEntries(arr);
-console.log(obj); // { 0: "a", 1: "b", 2: "c" }
-</pre>
-
-<h3 id="Transformación_de_Objetos">Transformación de Objetos</h3>
-
-<p>Con <code>Object.fromEntries</code>, su método inverso {{jsxref("Object.entries()")}}, y <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array#Methods_2">array métodos de manipulaciín de arreglos</a>, puedes transformar objetos así:</p>
-
-<pre class="brush: js notranslate">const object1 = { a: 1, b: 2, c: 3 };
-
-const object2 = Object.fromEntries(
-  Object.entries(object1)
-  .map(([ key, val ]) =&gt; [ key, val * 2 ])
-);
-
-console.log(object2);
-// { a: 2, b: 4, c: 6 }</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.fromentries', 'Object.fromEntries')}}</td>
-   <td>Etapa 4</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Object.fromEntries")}}</p>
-
-<h2 id="Véase_tambien">Véase tambien</h2>
-
-<ul>
- <li>{{jsxref("Object.entries()")}}</li>
- <li>{{jsxref("Object.keys()")}}</li>
- <li>{{jsxref("Object.values()")}}</li>
- <li>{{jsxref("Map.prototype.entries()")}}</li>
- <li>{{jsxref("Map.prototype.keys()")}}</li>
- <li>{{jsxref("Map.prototype.values()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertydescriptor/index.html b/files/es/web/javascript/referencia/objetos_globales/object/getownpropertydescriptor/index.html
deleted file mode 100644
index fb2eaf68da..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertydescriptor/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: Object.getOwnPropertyDescriptor()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptor
-tags:
-  - ECMAScript5
-  - JavaScript
-  - Método(2)
-  - Objeto
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptor
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.getOwnPropertyDescriptor()</strong></code> regresa como descripción de propiedad para una propiedad propia (eso es, una presente directamente en el objeto, no presente por la fuerza a través de la cadena de prototipo del objeto) de un objeto dado.</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox"><code>Object.getOwnPropertyDescriptor(<var>obj</var>, <var>prop</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto en el que se busca la propiedad.</dd>
- <dt><code>prop</code></dt>
- <dd>El nombre de la propiedad del cuál se obtendrá la descripción.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un descriptor de propiedad de una propiedad dada si existe en el objeto,  {{jsxref("undefined")}} en cualquier otro caso.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Éste método permite la examinación precisa de la descripción de una propiedad. Una propiedad en JavaScript consiste de el nombre de una cadena de valor y un descriptor de propiedad. Información más detallada acerca de los tipos de descripciones y sus atributos puede ser encontrada en {{jsxref("Object.defineProperty()")}}.</p>
-
-<p>Una descripción de propiedad es un registro con alguno de los siguientes atributos:</p>
-
-<dl>
- <dt><code>value</code></dt>
- <dd>El valor asociado con la propiedad (descriptores de datos unicamente).</dd>
- <dt><code><strong>writable</strong></code></dt>
- <dd><code>true</code> si y solo si el valor asociado con la propiedad puede ser cambiada (descriptores de datos unicamente).</dd>
- <dt><code>get</code></dt>
- <dd>Una función que sirve como método de acceso para la propiedad, o {{jsxref("undefined")}} si no hay método de acceso (métodos de acceso de descripciones unicamente).</dd>
- <dt><code>set</code></dt>
- <dd>Una función que sirve como método de establecimiento para la propieda, o {{jsxref("undefined")}} si no hay método de establecimiento (métodos de establecimiento de descripciones unicamente).</dd>
- <dt><code>configurable</code></dt>
- <dd><code>true</code> si y solo si el tipo de ésta descripción de propiedad puede ser cambiada y si la propiedad puede ser eliminada del objeto correspondiente.</dd>
- <dt><code>enumerable</code></dt>
- <dd><code>true</code> si y solo si ésta propiedad aparece durante la enumeración de las propiedades del objeto correspondiente.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">var o, d;
-
-o = { get foo() { return 17; } };
-d = Object.getOwnPropertyDescriptor(o, 'foo');
-// d is { configurable: true, enumerable: true, get: /* la función de acceso */, set: undefined }
-
-o = { bar: 42 };
-d = Object.getOwnPropertyDescriptor(o, 'bar');
-// d is { configurable: true, enumerable: true, value: 42, writable: true }
-
-o = {};
-Object.defineProperty(o, 'baz', { value: 8675309, writable: false, enumerable: false });
-d = Object.getOwnPropertyDescriptor(o, 'baz');
-// d es { value: 8675309, writable: false, enumerable: false, configurable: false }
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>En ES5, si el primer argumento que se le pasa a éste método no es un objeto (primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un no-objeto pasado como primer argumento será convertido (coerción) a un objeto en primera instancia.</p>
-
-<pre class="brush: js">Object.getOwnPropertyDescriptor("foo", 0);
-// TypeError: "foo" is not an object  // Código ES5
-
-Object.getOwnPropertyDescriptor("foo", 0);
-// {configurable:false, enumerable:true, value:"f", writable:false}  // Código ES6
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.3', 'Object.getOwnPropertyDescriptor')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.getownpropertydescriptor', 'Object.getOwnPropertyDescriptor')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("5")}}</td>
-   <td>{{CompatGeckoDesktop("2")}}</td>
-   <td>{{CompatIE("8")}}</td>
-   <td>{{CompatOpera("12")}}</td>
-   <td>{{CompatSafari("5")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.defineProperty()")}}</li>
- <li>{{jsxref("Reflect.getOwnPropertyDescriptor()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertydescriptors/index.html b/files/es/web/javascript/referencia/objetos_globales/object/getownpropertydescriptors/index.html
deleted file mode 100644
index 9585fa80e8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertydescriptors/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: Object.getOwnPropertyDescriptors()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyDescriptors
-tags:
-  - JavaScript
-  - Objeto
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyDescriptors
----
-<div>{{JSRef}}</div>
-
-<p>El método<code><strong>Object.getOwnPropertyDescriptors()</strong></code><strong> </strong>regresa todos los descriptores de propiedad propios de un objeto dado.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/object-getownpropertydescriptors.html")}}</div>
-
-<h2 id="Sintáxis">Sintáxis</h2>
-
-<pre class="syntaxbox">Object.getOwnPropertyDescriptors(<var>obj</var>)</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto para el cual obtener todos los descriptores de propiedad.</dd>
-</dl>
-
-<h3 id="Valores_devueltos">Valores devueltos</h3>
-
-<p>Un objeto que contiene todos los descriptores de propiedad propios de un objeto.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Este método permite la examinación de la descripción precisa de todas las propiedades de un objeto. Una propiedad en JavaScript consiste en un valor-cadena nombre y un descriptor de propiedad. Más información acerca de los tipos de descriptores de propiedad y sus atributos pueden ser encontrados en {{jsxref("Object.defineProperty()")}}.</p>
-
-<p>Un descriptor de propiedad es un registro con algunos de los siguientes atributos:</p>
-
-<dl>
- <dt><code>value</code></dt>
- <dd>El valor asociado con la propiedad (solo descriptores de datos).</dd>
- <dt><code><strong>writable</strong></code></dt>
- <dd><code>true</code> si y solo si el valor asociado con la propiedad puede ser cambiado (solo descriptores de datos).</dd>
- <dt><code>get</code></dt>
- <dd>Un función que sirve como un getter para la propiedad, o {{jsxref("undefined")}} si no hay getter (solo descriptores de acceso).</dd>
- <dt><code>set</code></dt>
- <dd>Una función que sirve como un setter para la propiedad, o {{jsxref("undefined")}} si no hay setter (solo descriptores de acceso).</dd>
- <dt><code>configurable</code></dt>
- <dd><code>true</code> si y solo si el tipo de este descriptor de propiedad puede ser cambiado y si la propiedad puede ser borrada de el objeto correspondiente.</dd>
- <dt><code>enumerable</code></dt>
- <dd><code>true</code> si y solo si esta propiedad aparece durante la enumeración de las propiedad en el objeto correspondiente.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Creando_un_clon_superficial">Creando un clon superficial</h3>
-
-<p>Mientras el método {{jsxref("Object.assign()")}} solo copiará las propiedades enumerables y propias de un objeto fuente a un objeto destino, puedes usar este método y {{jsxref("Object.create()")}} para una copia superficial entre dos objetos desconocidos:</p>
-
-<pre class="brush: js">Object.create(
-  Object.getPrototypeOf(obj),
-  Object.getOwnPropertyDescriptors(obj)
-);
-</pre>
-
-<h3 id="Creando_una_subclase">Creando una subclase</h3>
-
-<p>Una manera típica de crear una subclase es definir la subclase, establecer su prototipo a una instancia de la superclase, y después definir propiedades en esa instancia. Esto puede ponerse incómodo especialmente por los getters y setters. En cambio, tú puedes usar este código para establecer el prototipo:</p>
-
-<pre class="brush: js">function superclass() {}
-superclass.prototype = {
-  // Define tus métodos y propiedades aquí
-};
-function subclass() {}
-subclass.prototype = Object.create(
-  superclass.prototype,
-  {
-    // Define tus métodos y propiedades aquí
-  }
-);
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.getownpropertydescriptors', 'Object.getOwnPropertyDescriptors')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Definición inicial en ECMAScript 2017.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2017', '#sec-object.getownpropertydescriptors', 'Object.getOwnPropertyDescriptors')}}</td>
-   <td>{{Spec2('ES2017')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quisieras contribuir con los datos, por favor vaya a <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> mándenos una petición pull.</div>
-
-<p>{{Compat("javascript.builtins.Object.getOwnPropertyDescriptors")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también:</h2>
-
-<ul>
- <li>{{jsxref("Object.getOwnPropertyDescriptor()")}}</li>
- <li>{{jsxref("Object.defineProperty()")}}</li>
- <li><a href="https://github.com/tc39/proposal-object-getownpropertydescriptors">Polyfill</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertynames/index.html b/files/es/web/javascript/referencia/objetos_globales/object/getownpropertynames/index.html
deleted file mode 100644
index 5c3819045a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertynames/index.html
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: Object.getOwnPropertyNames()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertyNames
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertyNames
----
-<div>
- {{JSRef("Global_Objects", "Object")}}</div>
-<h2 id="Summary" name="Summary">Resumen</h2>
-<p>El método <code><strong>Object.getOwnPropertyNames()</strong></code> devuelve un array con todas las propiedades (numerables o no) encontradas en un objeto dado.</p>
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-<pre class="syntaxbox"><code>Object.getOwnPropertyNames(<em>obj</em>)</code></pre>
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-<dl>
- <dt>
-  obj</dt>
- <dd>
-  El objeto cuyas propiedades directas, numerables <em>y no-numerables</em>, serán devueltas.</dd>
-</dl>
-<h2 id="Description" name="Description">Descripción</h2>
-<p><code>Object.getOwnPropertyNames</code> devuelve un array cuyos elementos son <em>strings </em>correspondientes a cada una de las propiedades encontradas directamente en <code>obj</code>. El orden de las propiedades numerables en el array coincide con el expuesto para <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in loop</a> (o para {{jsxref("Object.keys")}}) con respecto a las propiedades del object. El orden de las propiedades no-numerables del array, y de éstas respecto a las numerables, no está definido.</p>
-<h2 id="Ejemplos">Ejemplos</h2>
-<pre class="brush: js">var arr = ["a", "b", "c"];
-print(Object.getOwnPropertyNames(arr).sort()); // imprime "0,1,2,length"
-
-// Objeto similar a Array
-var obj = { 0: "a", 1: "b", 2: "c"};
-print(Object.getOwnPropertyNames(obj).sort()); // imprime "0,1,2"
-
-// Imprime nombres de variables y valores usando Array.forEach
-Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) {
-  print(val + " -&gt; " + obj[val]);
-});
-// imprime
-// 0 -&gt; a
-// 1 -&gt; b
-// 2 -&gt; c
-
-// propiedad no-numerable
-var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; }, enumerable: false } });
-my_obj.foo = 1;
-
-print(Object.getOwnPropertyNames(my_obj).sort()); // imprime "foo, getFoo"
-</pre>
-<p>Si se quiere solo las propiedades numerables, ver {{jsxref("Object.keys")}} o usar un <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in loop</a> (aunque esto devolvería propiedades numerables no directas del <span style="line-height: 1.5;">objeto pertenecientes a la cadena de <em>prototype</em> a la que pertenezca, a menos que finalmente se filtre con hasOwnProperty()).</span></p>
-<p>Items de la cadena <em>prototype</em> no se listan:</p>
-<pre class="brush: js">function ParentClass () {
-}
-ParentClass.prototype.inheritedMethod = function () {
-};
-
-function ChildClass () {
-  this.prop = 5;
-  this.method = function () {};
-}
-ChildClass.prototype = new ParentClass;
-ChildClass.prototype.prototypeMethod = function () {
-};
-
-alert(
-  Object.getOwnPropertyNames(
-    new ChildClass() // ["prop", "method"]
-  )
-)
-</pre>
-<h3 id="Get_Non-Enumerable_Only">Get Non-Enumerable Only</h3>
-<p>Aquí se usa la función Array.prototype.filter para quitar las <em>keys</em> numerables (obtenidas con Object.keys) de una lista con todas las <em>keys</em> (obtenida con Object.getOwnPropertynames) dejando solo las no-numerables.</p>
-<pre class="brush: js">var target = myObject;
-var enum_and_nonenum = Object.getOwnPropertyNames(target);
-var enum_only = Object.keys(target);
-var nonenum_only = enum_and_nonenum.filter(function(key) {
-  var indexInEnum = enum_only.indexOf(key)
-  if (indexInEnum == -1) {
-    //no encontrada en las keys de enum_only, por lo que se trata de una key numerable, se devuelve true para mantenerla en filter
-    return true;
-  } else {
-    return false;
-  }
-});
-
-console.log(nonenum_only);
-</pre>
-<h2 id="Especificaciones">Especificaciones</h2>
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.4', 'Object.getOwnPropertyNames')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Initial definition.<br>
-    Implemented in JavaScript 1.8.5</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.getownpropertynames', 'Object.getOwnPropertyNames')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-<h2 id="Compatibilidad_con_Navegadores"> Compatibilidad con Navegadores</h2>
-<div>
- {{CompatibilityTable}}</div>
-<div id="compat-desktop">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Firefox (Gecko)</th>
-    <th>Chrome</th>
-    <th>Internet Explorer</th>
-    <th>Opera</th>
-    <th>Safari</th>
-   </tr>
-   <tr>
-    <td>Basic support</td>
-    <td>4 (2.0)</td>
-    <td>5</td>
-    <td>9</td>
-    <td>12</td>
-    <td>5</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<div id="compat-mobile">
- <table class="compat-table">
-  <tbody>
-   <tr>
-    <th>Feature</th>
-    <th>Firefox Mobile (Gecko)</th>
-    <th>Android</th>
-    <th>IE Mobile</th>
-    <th>Opera Mobile</th>
-    <th>Safari Mobile</th>
-   </tr>
-   <tr>
-    <td>Basic support</td>
-    <td>{{CompatUnknown}}</td>
-    <td>{{CompatUnknown}}</td>
-    <td>{{CompatUnknown}}</td>
-    <td>{{CompatUnknown}}</td>
-    <td>{{CompatUnknown}}</td>
-   </tr>
-  </tbody>
- </table>
-</div>
-<p>Based on <a href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
-<h3 id="SpiderMonkey-specific_notes">SpiderMonkey-specific notes</h3>
-<ul>
- <li>Prior to SpiderMonkey 28 {{geckoRelease("28")}}, <code>Object.getOwnPropertyNames</code> did not see unresolved properties of {{jsxref("Error")}} objects. This has been fixed in later versions ({{bug("724768")}}).</li>
-</ul>
-<h2 id="See_also" name="See_also">Ver también</h2>
-<ul>
- <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties" title="Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
- <li>{{jsxref("Object.prototype.hasOwnProperty")}}</li>
- <li>{{jsxref("Object.prototype.propertyIsEnumerable")}}</li>
- <li>{{jsxref("Object.create")}}</li>
- <li>{{jsxref("Object.keys")}}</li>
- <li>{{jsxref("Array.forEach()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertysymbols/index.html b/files/es/web/javascript/referencia/objetos_globales/object/getownpropertysymbols/index.html
deleted file mode 100644
index cf8be23f59..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/getownpropertysymbols/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: Object.getOwnPropertySymbols()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/getOwnPropertySymbols
-tags:
-  - ECMAScript6
-  - Experimental
-  - JavaScript
-  - Método(2)
-  - Objeto
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/getOwnPropertySymbols
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.getOwnPropertySymbols()</strong></code> regresa una colección de todos las propiedades de los simbolos encontrados directamente en un objeto dado.</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox"><code>Object.getOwnPropertySymbols(<var>obj</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto del cual los simbolos de propiedades son devueltos.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Similar a {{jsxref("Object.getOwnPropertyNames()")}}, puedes obtener todas las propiedades de simbolos de un objeto dado como una colección de simbolos. Note que {{jsxref("Object.getOwnPropertyNames()")}} no contiene en sí mismo las propiedades de simbolos de un objeto y solo contiene las propiedades de cadenas.</p>
-
-<p>Cómo todos los objetos no tienen inicialmente propiedades simbolos propios, <code>Object.getOwnPropertySymbols()</code> regresa una colección vacia a menos que tengas propiedades de simbolos establecidas en tu objeto.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">var obj = {};
-var a = Symbol('a');
-var b = Symbol.for('b');
-
-obj[a] = 'localSymbol';
-obj[b] = 'globalSymbol';
-
-var objectSymbols = Object.getOwnPropertySymbols(obj);
-
-console.log(objectSymbols.length); // 2
-console.log(objectSymbols);        // [Symbol(a), Symbol(b)]
-console.log(objectSymbols[0]);     // Symbol(a)
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.getownpropertysymbols', 'Object.getOwnPropertySymbols')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{CompatGeckoDesktop("36.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>5.1</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{CompatGeckoMobile("36.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
- <li>{{jsxref("Symbol")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/getprototypeof/index.html b/files/es/web/javascript/referencia/objetos_globales/object/getprototypeof/index.html
deleted file mode 100644
index a9b50ec2ec..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/getprototypeof/index.html
+++ /dev/null
@@ -1,137 +0,0 @@
----
-title: Object.getPrototypeOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/getPrototypeOf
-tags:
-  - ECMAScript5
-  - JavaScript
-  - Objeto
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/getPrototypeOf
----
-<div>{{JSRef("Global_Objects", "Object")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <code><strong>Object.getPrototypeOf()</strong></code> devuelve el prototipo (es decir, el valor de la propiedad interna <code>[[Prototype]]</code>) del objeto especificado.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Object.getPrototypeOf(<var>obj</var>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto cuyo prototipo va a ser devuelto.</dd>
-</dl>
-
-<h3 id="Valor_Devuelto">Valor Devuelto</h3>
-
-<p>El prototipo del objeto dado. Si no existen propiedades heredadas se devolverá {{jsxref("null")}}.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<pre class="brush: js">var proto = {};
-var obj= Object.create(proto);
-Object.getPrototypeOf(obj) === proto; // true
-</pre>
-
-<h2 id="Notes" name="Notes">Notas</h2>
-
-<p>En ES5, lanzará una excepción {{jsxref("Global_Objects/TypeError", "TypeError")}} si el parámetro <code>obj</code> no es un objeto. en ES6, El parámetro será forzado a un {{jsxref("Global_Objects/Object", "Object")}}.</p>
-
-<pre class="brush: js">&gt; Object.getPrototypeOf('foo')
-TypeError: "foo" is not an object  // ES5 code
-&gt; Object.getPrototypeOf('foo')
-String.prototype                   // ES6 code
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.2', 'Object.getPrototypeOf')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.getprototypeof', 'Object.getProtoypeOf')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("5")}}</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatOpera("12.10")}} (tal vez en las últimas versiones)</td>
-   <td>{{CompatSafari("5")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>Based on <a class="external" href="http://kangax.github.com/es5-compat-table/">Kangax's compat table</a>.</p>
-
-<h3 id="Notas_espécificas_sobre_Opera">Notas espécificas sobre Opera</h3>
-
-<p>A pesar de que las versiones anteriores de opera no soportan aun <code>Object.getPrototypeOf()</code>, Opera soporta la propiedad no estándar {{jsxref("Object.proto", "__proto__")}} desde Opera 10.50.</p>
-
-<h2 id="See_also" name="See_also">Mira también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li>
- <li>{{jsxref("Object.setPrototypeOf()")}} {{experimental_inline}}</li>
- <li>John Resig's post on <a class="external" href="http://ejohn.org/blog/objectgetprototypeof/">getPrototypeOf</a></li>
- <li>{{jsxref("Object.prototype.__proto__")}}</li>
- <li>{{jsxref("Reflect.getPrototypeOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/hasownproperty/index.html b/files/es/web/javascript/referencia/objetos_globales/object/hasownproperty/index.html
deleted file mode 100644
index d84e5d6a52..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/hasownproperty/index.html
+++ /dev/null
@@ -1,186 +0,0 @@
----
-title: Object.prototype.hasOwnProperty()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/hasOwnProperty
-tags:
-  - JavaScript
-  - Method
-  - Object
-  - Prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
----
-<div>{{JSRef("Objetos_globales", "Object")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <code><strong>hasOwnProperty()</strong></code> devuelve un booleano indicando si el objeto tiene la propiedad especificada.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>obj</em>.hasOwnProperty(<em>prop</em>)</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>prop</code></dt>
- <dd>El nombre de la propiedad a buscar.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Todo objeto descendiente de <code>Object</code> hereda el método <code>hasOwnProperty</code>. Este método puede ser usando para determinar si un objeto tiene la propiedad especificada como una propiedad directa de ese objeto; a diferencia del operador {{jsxref("Operators/in", "in")}}, este método no verifica la cadena prototipo del objeto.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_hasOwnProperty_to_test_for_a_property.27s_existence" name="Example:_Using_hasOwnProperty_to_test_for_a_property.27s_existence">Ejemplo: usar <code>hasOwnProperty</code> para comprobar la existencia de una propiedad</h3>
-
-<p>El siguiente ejemplo determina si el objeto <code>o</code> contiene una propiedad llamada <code>prop</code>:</p>
-
-<pre class="brush: js">o = new Object();
-o.prop = 'exists';
-
-function changeO() {
-  o.newprop = o.prop;
-  delete o.prop;
-}
-
-o.hasOwnProperty('prop');   // returns true
-changeO();
-o.hasOwnProperty('prop');   // returns false</pre>
-
-<h3 id="Example:_Direct_versus_inherited_properties" name="Example:_Direct_versus_inherited_properties">Ejemplo: Directo versus propiedades heredadas</h3>
-
-<p>El siguiente ejemplo diferencia entre propiedades directas y propiedades heredadas a través de la cadena prototype:</p>
-
-<pre class="brush: js">o = new Object();
-o.prop = 'exists';
-o.hasOwnProperty('prop');             // returns true
-o.hasOwnProperty('toString');         // returns false
-o.hasOwnProperty('hasOwnProperty');   // returns false</pre>
-
-<h3 id="Example:_Itarate_over_properties_not_considering_inherited_properties" name="Example:_Itarate_over_properties_not_considering_inherited_properties">Ejemplo: Iterando sobre las propiedades de un objeto</h3>
-
-<p>El siguiente ejemplo muestra como iterar sobre las propiedades de un objeto sin ejecutar sobre propiedades heredadas. Observe que el bucle for..in ya está no solo iterando elementos enumerables, por consiguiente uno no debería asumir que basado en la falta de propiedades no numerales mostrando en el bucle que hasOwnProperty por si misma no está solo es estrictamente para iterar elementos numerados (como con {{jsxref("Object.getOwnPropertyNames()")}}).</p>
-
-<pre class="brush: js">var buz = {
-    fog: 'stack'
-};
-
-for (var name in buz) {
-    if (buz.hasOwnProperty(name)) {
-        alert("this is fog (" + name + ") for sure. Value: " + buz[name]);
-    }
-    else {
-        alert(name); // toString or something else
-    }
-}</pre>
-
-<h3 id="Ejemplo_hasOwnProperty_como_una_propiedad">Ejemplo: <code>hasOwnProperty</code> como una propiedad</h3>
-
-<p>JavaScript no protege el nombre de la propiedad <code>hasOwnProperty</code>; en consecuencia, si existe la posibilidad  de que un objeto pudiera tener la propiedad con ese nombre, es necesario usar un externo <code>hasOwnProperty</code> para obtener los correctos resultados:</p>
-
-<pre class="brush: js">var foo = {
-    hasOwnProperty: function() {
-        return false;
-    },
-    bar: 'Here be dragons'
-};
-
-foo.hasOwnProperty('bar'); // always returns false
-
-// Use another Object's hasOwnProperty and call it with 'this' set to foo
-({}).hasOwnProperty.call(foo, 'bar'); // true
-
-// It's also possible to use the hasOwnProperty property from the Object property for this purpose
-Object.prototype.hasOwnProperty.call(foo, 'bar'); // true
-</pre>
-
-<p>Observe que en el último caso no han habido nuevos objetos creados.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 3rd Edition. Implemented in JavaScript 1.5</td>
-   <td>Standard</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.4.5', 'Object.prototype.hasOwnProperty')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_Also" name="See_Also">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties" title="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
- <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></li>
- <li>{{jsxref("Operators/in", "in")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_Revisited">JavaScript Guide: Inheritance revisted</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/index.html b/files/es/web/javascript/referencia/objetos_globales/object/index.html
deleted file mode 100644
index 99089bd28e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/index.html
+++ /dev/null
@@ -1,187 +0,0 @@
----
-title: Object
-slug: Web/JavaScript/Referencia/Objetos_globales/Object
-tags:
-  - Constructor
-  - JavaScript
-  - Objeto
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/Object
----
-<div>{{JSRef}}</div>
-
-<div>La clase Object representa uno de los tipos de datos de Javascript. Es es usado para guardar una colección de datos definidos y entidades más complejas. Los objetos pueden ser creados utilzando el constructor {{jsxref("Object/Object", "Object()")}} o la sintaxis literal de objeto. </div>
-
-<p>El constructor <code><strong>Object</strong></code> crea una envoltura al objeto.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-
-
-<pre class="syntaxbox notranslate">// Object initialiser or literal
-{ [ <var>nameValuePair1</var>[, <var>nameValuePair2</var>[, ...<var>nameValuePairN</var>] ] ] }
-
-// Called as a constructor
-new Object([<var>value</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>nameValuePair1, nameValuePair2, ... nameValuePair<em>N</em></code></dt>
- <dd>Los pares de nombres (strings) y los valores (cualquier valor) donde los nombres son separados por una coma.</dd>
- <dt><code>valor</code></dt>
- <dd>Cualquier valor.</dd>
-</dl>
-
-<h2 id="Description">Description</h2>
-
-<p>El constructor <code>Object</code> crea una envoltura de objeto  al valor dado.  Si el valor es  {{jsxref("null")}} o {{jsxref("undefined")}}, creará y retornará un objeto vacío, de otra forma, retornará un objeto de un tipo que corresponda al valor dado. Si el valor ya es un objeto devolverá el valor.</p>
-
-<p>Cuando es llamano en un contexto non-constructor, <code>Object </code>se comportará indenticamente a <code>new Object()</code>.</p>
-
-<p>Ver <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer / literal syntax</a>.</p>
-
-<h2 id="Propiedades_del_constructor_Object">Propiedades del constructor <code>Object</code></h2>
-
-<dl>
- <dt><code>Object.length</code></dt>
- <dd>Tiene un valor de 1.</dd>
- <dt>{{jsxref("Object.prototype")}}</dt>
- <dd>Permite añadir propiedades a todos los objetos del tipo Object.</dd>
-</dl>
-
-<h2 id="Métodos_del_constructor_Object">Métodos del constructor  <code>Object</code></h2>
-
-<dl>
- <dt>{{jsxref("Object.assign()")}}</dt>
- <dd>Copia los valores de todas sus propiedades enumerables desde uno o más objetos fuente a un objeto destino.</dd>
- <dt>{{jsxref("Object.create()")}}</dt>
- <dd>Crea un nuevo objeto con el prototipo objeto y propiedades específicadas.</dd>
- <dt>{{jsxref("Object.defineProperty()")}}</dt>
- <dd>Añade la propiedad nombrada descrita por un descriptor dado a un objeto.</dd>
- <dt>{{jsxref("Object.defineProperties()")}}</dt>
- <dd>Agrega las propiedades nombradas descritas por los descriptores dados a un objeto.</dd>
- <dt>{{jsxref("Object.entries()")}}</dt>
- <dd>Returns an array containing all of the <code>[key, value]</code> pairs of a given object's <strong>own</strong> enumerable string properties.</dd>
- <dt>{{jsxref("Object.freeze()")}}</dt>
- <dd>Freezes an object: other code can't delete or change any properties.</dd>
- <dt>{{jsxref("Object.fromEntries()")}}</dt>
- <dd>Returns a new object from an iterable of key-value pairs (reverses {{jsxref("Object.entries")}}).</dd>
- <dt>{{jsxref("Object.getOwnPropertyDescriptor()")}}</dt>
- <dd>Returns a property descriptor for a named property on an object.</dd>
- <dt>{{jsxref("Object.getOwnPropertyDescriptors()")}}</dt>
- <dd>Returns an object containing all own property descriptors for an object.</dd>
- <dt>{{jsxref("Object.getOwnPropertyNames()")}}</dt>
- <dd>Returns an array containing the names of all of the given object's <strong>own</strong> enumerable and non-enumerable properties.</dd>
- <dt>{{jsxref("Object.getOwnPropertySymbols()")}}</dt>
- <dd>Returns an array of all symbol properties found directly upon a given object.</dd>
- <dt>{{jsxref("Object.getPrototypeOf()")}}</dt>
- <dd>Returns the prototype of the specified object.</dd>
- <dt>{{jsxref("Object.is()")}}</dt>
- <dd>Compares if two values are the same value. Equates all NaN values (which differs from both Abstract Equality Comparison and Strict Equality Comparison).</dd>
- <dt>{{jsxref("Object.isExtensible()")}}</dt>
- <dd>Determines if extending of an object is allowed.</dd>
- <dt>{{jsxref("Object.isFrozen()")}}</dt>
- <dd>Determines if an object was frozen.</dd>
- <dt>{{jsxref("Object.isSealed()")}}</dt>
- <dd>Determines if an object is sealed.</dd>
- <dt>{{jsxref("Object.keys()")}}</dt>
- <dd>Returns an array containing the names of all of the given object's <strong>own</strong> enumerable string properties.</dd>
- <dt>{{jsxref("Object.preventExtensions()")}}</dt>
- <dd>Prevents any extensions of an object.</dd>
- <dt>{{jsxref("Object.seal()")}}</dt>
- <dd>Prevents other code from deleting properties of an object.</dd>
- <dt>{{jsxref("Object.setPrototypeOf()")}}</dt>
- <dd>Sets the prototype (i.e., the internal <code>[[Prototype]]</code> property).</dd>
- <dt>{{jsxref("Object.values()")}}</dt>
- <dd>Returns an array containing the values that correspond to all of a given object's <strong>own</strong> enumerable string properties.</dd>
-</dl>
-
-<h2 id="Object_instances_and_Object_prototype_object"><code>Object</code> instances and <code>Object</code> prototype object</h2>
-
-<p>All objects in JavaScript are descended from <code>Object</code>; all objects inherit methods and properties from {{jsxref("Object.prototype")}}, although they may be overridden. For example, other constructors' prototypes override the <code>constructor</code> property and provide their own <code>toString()</code> methods. Changes to the <code>Object</code> prototype object are propagated to all objects unless the properties and methods subject to those changes are overridden further along the prototype chain.</p>
-
-<h3 id="Properties">Properties</h3>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype', 'Properties') }}</div>
-
-<h3 id="Methods">Methods</h3>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype', 'Methods') }}</div>
-
-<h2 id="Deleting_a_property_from_an_object">Deleting a property from an object</h2>
-
-<p>There isn't any method in an Object itself to delete its own properties (e.g. like <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete">Map.prototype.delete()</a></code>). To do so one has to use the <a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete">delete operator</a>.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_Object_given_undefined_and_null_types">Using <code>Object</code> given <code>undefined</code> and <code>null</code> types</h3>
-
-<p>The following examples store an empty <code>Object</code> object in <code>o</code>:</p>
-
-<pre class="brush: js notranslate">var o = new Object();
-</pre>
-
-<pre class="brush: js notranslate">var o = new Object(undefined);
-</pre>
-
-<pre class="brush: js notranslate">var o = new Object(null);
-</pre>
-
-<h3 id="Using_Object_to_create_Boolean_objects">Using <code>Object</code> to create <code>Boolean</code> objects</h3>
-
-<p>The following examples store {{jsxref("Boolean")}} objects in <code>o</code>:</p>
-
-<pre class="brush: js notranslate">// equivalent to o = new Boolean(true);
-var o = new Object(true);
-</pre>
-
-<pre class="brush: js notranslate">// equivalent to o = new Boolean(false);
-var o = new Object(Boolean());
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2', 'Object')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object-objects', 'Object')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Added Object.assign, Object.getOwnPropertySymbols, Object.setPrototypeOf, Object.is</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object-objects', 'Object')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Added Object.entries, Object.values and Object.getOwnPropertyDescriptors.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Object")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">Object initializer</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/is/index.html b/files/es/web/javascript/referencia/objetos_globales/object/is/index.html
deleted file mode 100644
index 926357d0ab..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/is/index.html
+++ /dev/null
@@ -1,172 +0,0 @@
----
-title: Object.is()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/is
-tags:
-  - Comparación
-  - Condición
-  - ECMAScript2015
-  - JavaScript
-  - Objeto
-  - condicional
-  - igualdad
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/is
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.is()</strong></code> determina si dos valores <a href="/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness">son iguales</a>.</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Object.is(<var>valor1</var>, <var>valor2</var>);</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>valor1</code></dt>
- <dd>Primer valor a comparar.</dd>
- <dt><code>valor2</code></dt>
- <dd>Segundo valor a comparar.</dd>
-</dl>
-
-<h3 id="Valor_return_del_método">Valor return del método</h3>
-
-<p>Este método devuelve un valor de tipo {{jsxref("Boolean")}} indicando si los valores pasados como parámetros son iguales o no.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>Object.is()</code> determina si dos valores <a href="/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness">son iguales</a>. Dos valores son iguales si se puede asegurar que:</p>
-
-<ul>
- <li>ambos son {{jsxref("undefined")}}</li>
- <li>ambos son {{jsxref("null")}}</li>
- <li>ambos son <code>true</code> o <code>false</code></li>
- <li>ambos son strings y tienen la misma longitud con los mismos carácteres</li>
- <li>ambos son el mismo objeto</li>
- <li>ambos son números y
-  <ul>
-   <li><code>ambos +0 (mayores que 0)</code></li>
-   <li><code>ambos -0 (menores que 0)</code></li>
-   <li>ambos son {{jsxref("NaN")}}</li>
-   <li>o ambos no son cero o no son de tipo {{jsxref("NaN")}} y tienen el mismo valor</li>
-  </ul>
- </li>
-</ul>
-
-<p>Esta comparación <em>no</em> es igual a la que realiza el operador {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}}. El operador {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}} aplica varias coerciones(comprobaciones) en ambos sentidos (si no tienen el mismo Type) antes de probar la igualdad (lo que resulta en comportamientos como  <code>"" == false</code> siendo <code>true</code>), pero <code>Object.is</code> no obliga a niguno de los valores.</p>
-
-<p>Esta <em>tampoco</em> es igual a la que realiza el operador {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}}. El operador {{jsxref("Operators/Comparison_Operators", "===", "#Identity")}} (y el operador {{jsxref("Operators/Comparison_Operators", "==", "#Equality")}}) trata los valores <code>-0</code> <code>y +0</code> como iguales, y además, trata {{jsxref("Number.NaN")}} como no igual a {{jsxref("NaN")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js notranslate">Object.is('foo', 'foo');     // true
-Object.is(window, window);   // true
-
-Object.is('foo', 'bar');     // false
-Object.is([], []);           // false
-
-var test = { a: 1 };
-Object.is(test, test);       // true
-
-Object.is(null, null);       // true
-
-// Special Cases
-Object.is(0, -0);            // false
-Object.is(-0, -0);           // true
-Object.is(NaN, 0/0);         // true
-</pre>
-
-<h2 id="Polyfill_para_navegadores_no_ES6"><a href="https://en.wikipedia.org/wiki/Polyfill">Polyfill</a> para navegadores no ES6</h2>
-
-<p><code>Object.is()</code> es una adición propuesta en el estandar ECMA-262; y como tal, puede no estar presente en todos los navegadores. Para los casos en que no tenga disponible este método, podría utilizar este código haciendolo que se cargue antes que cualquier otro script. Esto permite que puedas utilizar <code>Object.is()</code> en los navegadores que no lo llevan incluído.</p>
-
-<pre class="brush: js notranslate">if (!Object.is) {
-  Object.is = function(x, y) {
-    // SameValue algorithm
-    if (x === y) { // Steps 1-5, 7-10
-      // Steps 6.b-6.e: +0 != -0
-      return x !== 0 || 1 / x === 1 / y;
-    } else {
-      // Step 6.a: NaN == NaN
-      return x !== x &amp;&amp; y !== y;
-    }
-  };
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.is', 'Object.is')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome("30")}}</td>
-   <td>{{CompatGeckoDesktop("22")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("22")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"></h2>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Equality_comparisons_and_sameness">Comparadores de igualdad e identidad</a> —Una comparación de las 3 operaciones de cotejamiento integradas.</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/isextensible/index.html b/files/es/web/javascript/referencia/objetos_globales/object/isextensible/index.html
deleted file mode 100644
index 30082032ea..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/isextensible/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: Object.isExtensible()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/isExtensible
-tags:
-  - ECMAScript5
-  - JavaScript
-  - JavaScript 1.8.5
-  - Objeto
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/isExtensible
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>Object.isExtensible()</code></strong> determina si un objeto es extendible (si puede tener propiedades nuevas agregadas a éste).</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox"><code>Object.isExtensible(<var>obj</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto a ser revisado.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los objetos son extendibles por defecto: ellos pueden tener propiedades nuevas agregadas a ellos, y (en motores que soportan {{jsxref("Object.proto", "__proto__")}} {{deprecated_inline}} la propiedad __proto__) pueden ser modificados. Un objeto puede ser marcado como no extendible usando {{jsxref("Object.preventExtensions()")}}, {{jsxref("Object.seal()")}}, o {{jsxref("Object.freeze()")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">// Los Objetos nuevos son extendibles (por defecto).
-var empty = {};
-Object.isExtensible(empty); // === true
-
-// ...pero eso puede cambiar.
-Object.preventExtensions(empty);
-Object.isExtensible(empty); // === false
-
-// Objetos sellados por definición son no-extendibles.
-var sealed = Object.seal({});
-Object.isExtensible(sealed); // === false
-
-// Objetos congelados también por definición son no-extendibles.
-var frozen = Object.freeze({});
-Object.isExtensible(frozen); // === false
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>En ES5, si el argumento pasado a éste método no es un objeto (primitivo), entonces regresará {{jsxref("TypeError")}}. En ES6, un no-objeto pasado como argumento será tratado como si fuera un objeto no-extendible ordinario, simplemente regresa <code>false</code>.</p>
-
-<pre class="brush: js">Object.isExtensible(1);
-// TypeError: 1 is not an object (ES5 code)
-
-Object.isExtensible(1);
-// false                         (ES6 code)
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.13', 'Object.isExtensible')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.isextensible', 'Object.isExtensible')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("6")}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatOpera("12")}}</td>
-   <td>{{CompatSafari("5.1")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporote básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.preventExtensions()")}}</li>
- <li>{{jsxref("Object.seal()")}}</li>
- <li>{{jsxref("Object.isSealed()")}}</li>
- <li>{{jsxref("Object.freeze()")}}</li>
- <li>{{jsxref("Object.isFrozen()")}}</li>
- <li>{{jsxref("Reflect.isExtensible()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/isfrozen/index.html b/files/es/web/javascript/referencia/objetos_globales/object/isfrozen/index.html
deleted file mode 100644
index 9a2bc2ee94..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/isfrozen/index.html
+++ /dev/null
@@ -1,190 +0,0 @@
----
-title: Object.isFrozen()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/isFrozen
-tags:
-  - ECMAScript5
-  - JavaScript
-  - JavaScript 1.8.5
-  - Objeto
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/isFrozen
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.isFrozen()</strong></code> determina si un objeto está <em>congelado</em>.</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox"><code>Object.isFrozen(<var>obj</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto a ser revisado.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Un objeto está congelado si y solo si no es {{jsxref("Object.isExtensible()", "extendible", "", 1)}}, todas sus propiedades son no-configurables, y todos los datos de sus propiedades no tienen capacidad de escritura.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">// Un objeto nuevo es extendible, así que no está congelado.
-Object.isFrozen({}); // === false
-
-// Un objeto vacio el cuál no es extendible está congelado vacuamente.
-var vacuouslyFrozen = Object.preventExtensions({});
-Object.isFrozen(vacuouslyFrozen); // === true
-
-// Un objeto nuevo con una propiedad es tabién extendible, ergo no congelado.
-var oneProp = { p: 42 };
-Object.isFrozen(oneProp); // === false
-
-// Prevenir la extensión de un objeto no lo congela.
-// porque la propiedad sigue teniendo capacidad de configuración (y capacidad de escritura).
-Object.preventExtensions(oneProp);
-Object.isFrozen(oneProp); // === false
-
-// ...pero eliminar la propiedad congela el objeto vacuamente.
-delete oneProp.p;
-Object.isFrozen(oneProp); // === true
-
-// Un ojbeto no-extendible con una propiedad sin capacidad de escritura pero si con capacidad de configuración no está congelado.
-var nonWritable = { e: 'plep' };
-Object.preventExtensions(nonWritable);
-Object.defineProperty(nonWritable, 'e', { writable: false }); // Le quita la capacidad de escritura.
-Object.isFrozen(nonWritable); // === false
-
-// Quitarle la capacidad de configuración a una propiedad congela el objeto.
-Object.defineProperty(nonWritable, 'e', { configurable: false }); // le quita la capacidad de configuración.
-Object.isFrozen(nonWritable); // === true
-
-// Un objeto no-extendible con una propiedad sin capacidad de configuración pero con capacidad de escritura no congela a dicho objeto.
-var nonConfigurable = { release: 'the kraken!' };
-Object.preventExtensions(nonConfigurable);
-Object.defineProperty(nonConfigurable, 'release', { configurable: false });
-Object.isFrozen(nonConfigurable); // === false
-
-// Quitarle la capacidad de configuración a esa propiedad congela el objeto.
-Object.defineProperty(nonConfigurable, 'release', { writable: false });
-Object.isFrozen(nonConfigurable); // === true
-
-// A non-extensible object with a configurable accessor property isn't frozen.
-var accessor = { get food() { return 'yum'; } };
-Object.preventExtensions(accessor);
-Object.isFrozen(accessor); // === false
-
-// ...but make that property non-configurable and it becomes frozen.
-Object.defineProperty(accessor, 'food', { configurable: false });
-Object.isFrozen(accessor); // === true
-
-// But the easiest way for an object to be frozen is if Object.freeze has been called on it.
-var frozen = { 1: 81 };
-Object.isFrozen(frozen); // === false
-Object.freeze(frozen);
-Object.isFrozen(frozen); // === true
-
-// By definition, a frozen object is non-extensible.
-Object.isExtensible(frozen); // === false
-
-// Also by definition, a frozen object is sealed.
-Object.isSealed(frozen); // === true
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>En ES5, si el argumento pasado a éste método no es un objeto (primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un no-objeto pasado como argumento será tratado como si fuera un objeto ordinario congelado, simplemente regresa <code>true</code>.</p>
-
-<pre class="brush: js">Object.isFrozen(1);
-// TypeError: 1 is not an object (ES5 code)
-
-Object.isFrozen(1);
-// true                          (ES6 code)
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.12', 'Object.isFrozen')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>
-    <p>Definición inicial. Implementada en JavaScript 1.8.5.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.isfrozen', 'Object.isFrozen')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristicas</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("6")}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatOpera("12")}}</td>
-   <td>{{CompatSafari("5.1")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristicas</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.freeze()")}}</li>
- <li>{{jsxref("Object.preventExtensions()")}}</li>
- <li>{{jsxref("Object.isExtensible()")}}</li>
- <li>{{jsxref("Object.seal()")}}</li>
- <li>{{jsxref("Object.isSealed()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/isprototypeof/index.html b/files/es/web/javascript/referencia/objetos_globales/object/isprototypeof/index.html
deleted file mode 100644
index 8275ebafac..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/isprototypeof/index.html
+++ /dev/null
@@ -1,158 +0,0 @@
----
-title: Object.prototype.isPrototypeOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/isPrototypeOf
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/isPrototypeOf
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>isPrototypeOf()</strong></code> comprueba si un objeto se encuentra en la cadena de prototipado de otro.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> <code>isPrototypeOf</code> difiere del operador {{jsxref("Operators/instanceof", "instanceof")}}. En la expresión "<code>object instanceof AFunction</code>", la cadena de prototipado de <code>object</code> es comprobada contra <code>AFunction.prototype</code>, no contra la propia <code>AFunction</code>.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>prototypeObj</var>.isPrototypeOf(<var>obj</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>prototypeObj</code></dt>
- <dd>Un objeto para ver comprobado contra cada vínculo en la cadena de prototipado del argumento <strong>object</strong>.</dd>
- <dt><code>object</code></dt>
- <dd>El object sobre cuya cadena de prototipado se realizará la búsqueda.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>isPrototypeOf</code> permite comprobar si un objetyo existe o no en la cadena de prototipado de otro.</p>
-
-<p>Por ejemplo, considerese la siguiente cadena de prototipado:</p>
-
-<pre class="brush: js">function Fee() {
-  // ...
-}
-
-function Fi() {
-  // ...
-}
-Fi.prototype = new Fee();
-
-function Fo() {
-  // ...
-}
-Fo.prototype = new Fi();
-
-function Fum() {
-  // ...
-}
-Fum.prototype = new Fo();
-</pre>
-
-<p>Al final de la secuencia, si se instanci <code>Fum</code> y se necesita verificar si el prototipo de <code>Fi</code> existe en la cadena de prototipado de <code>Fum</code> prototype chain, puede hacerse esto:</p>
-
-<pre class="brush: js">var fum = new Fum();
-// ...
-
-if (Fi.prototype.isPrototypeOf(fum)) {
-  // do something safe
-}
-</pre>
-
-<p>Esto, junto con el operador {{jsxref("Operators/instanceof", "instanceof")}} resulta especialmente útil si se tiene código que sólo puede operar cuando se trata de objetos descendientes de una cadena de prototipado específica, p.e., para garantizar que ciertos métodos o propiedades estén presentes en dichos objetos.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.4.5', 'Object.prototype.hasOwnProperty')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.prototype.hasownproperty', 'Object.prototype.hasOwnProperty')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Operators/instanceof", "instanceof")}}</li>
- <li>{{jsxref("Object.getPrototypeOf()")}}</li>
- <li>
-  <div>{{jsxref("Object.setPrototypeOf()")}}</div>
- </li>
- <li>{{jsxref("Object.prototype.__proto__")}} </li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/issealed/index.html b/files/es/web/javascript/referencia/objetos_globales/object/issealed/index.html
deleted file mode 100644
index c28437561a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/issealed/index.html
+++ /dev/null
@@ -1,140 +0,0 @@
----
-title: Object.isSealed()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/isSealed
-tags:
-  - ECMAScript5
-  - JavaScript
-  - JavaScript 1.8.5
-  - Objeto
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/isSealed
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.isSealed()</strong></code> si el objeto está sellado.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/object-issealed.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code>Object.isSealed(<var>obj</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto que debe ser verificado.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un {{jsxref("Boolean")}} indicando si el objeto dado está sellado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Devuelve <code>true</code> si el objeto está sellado, de lo contrario devuelve <code>false</code>. Un objeto está sellado si no es {{jsxref("Object.isExtensible", "extensible", "", 1)}} y si todas sus propiedades no se pueden configurar y por lo tanto no removibles (pero no necesariamente no modificables).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">// Los objetos no están sellados por defecto
-var empty = {};
-Object.isSealed(empty); // === false
-
-// Si haces un objeto vacío no extendible,
-// está vacíamente sellado
-Object.preventExtensions(empty);
-Object.isSealed(empty); // === true
-
-// Lo mismo no es vedad sobre un objeto no vacío,
-// a menos que sus propiedades son todas no configurables.
-var hasProp = { fee: 'fie foe fum' };
-Object.preventExtensions(hasProp);
-Object.isSealed(hasProp); // === false
-
-// Pero hazlas todas no configurables
-// y el objeto se vuelve sellado.
-Object.defineProperty(hasProp, 'fee', {
-  configurable: false
-});
-Object.isSealed(hasProp); // === true
-
-// La manerá más facil de sellar un objeto, por supuesto,
-// es Object.seal
-var sealed = {};
-Object.seal(sealed);
-Object.isSealed(sealed); // === true
-
-// Un objeto sellado es, por definición, no extendible.
-Object.isExtensible(sealed); // === false
-
-// Un objeto sellado puodría estar congelado,
-// pero no tiene que ser.
-Object.isFrozen(sealed); // === true
-// (Todas las propiedades también no modificables)
-
-var s2 = Object.seal({ p: 3 });
-Object.isFrozen(s2); // === false
-// ('p' todavía es modificable)
-
-var s3 = Object.seal({ get p() { return 0; } });
-Object.isFrozen(s3); // === true
-// (solo la configurabilidad es importante para las propiedades de acceso)
-</pre>
-
-<h2 id="Notes">Notes</h2>
-
-<p><code><font face="Open Sans, arial, x-locale-body, sans-serif"><span style="background-color: #ffffff;">En ES5, si el argumento de este método no es un objeto (primitivo), entonces causará un </span></font></code>{{jsxref("TypeError")}}. En ES2015, un argumento que no sea un objeto será tratado como si fuera un objeto sellado ordinario, simplemente devuelve <code>true</code>.</p>
-
-<pre class="brush: js">Object.isSealed(1);
-// TypeError: 1 no es un objeto (ES5 code)
-
-Object.isSealed(1);
-// true                          (ES2015 code)
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.11', 'Object.isSealed')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.issealed', 'Object.isSealed')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.issealed', 'Object.isSealed')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Object.isSealed")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Object.seal()")}}</li>
- <li>{{jsxref("Object.preventExtensions()")}}</li>
- <li>{{jsxref("Object.isExtensible()")}}</li>
- <li>{{jsxref("Object.freeze()")}}</li>
- <li>{{jsxref("Object.isFrozen()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/keys/index.html b/files/es/web/javascript/referencia/objetos_globales/object/keys/index.html
deleted file mode 100644
index d6bd068f2f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/keys/index.html
+++ /dev/null
@@ -1,156 +0,0 @@
----
-title: Object.keys()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/keys
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/keys
----
-<div>{{JSRef("Global_Objects", "Object")}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El método <code>Object.keys()</code> devuelve un array de las propiedades <strong><code>names</code> </strong>de un objeto, en el mismo orden como se obtienen en un loop normal</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>Object.keys(<var>obj</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto cuyas propiedades enumerables serán devueltas.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un array de strings que representan toda las propiedades  del objeto</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>Object.keys</code> devuelve un array cuyos elementos son strings correspondientes a las propiedades enumerables que se encuentran directamente en el object. El orden de las propiedades es el mismo que se proporciona al iterar manualmente sobre las propiedades del objeto.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js notranslate">var arr = ['a', 'b', 'c'];
-console.log(Object.keys(arr)); // console: ['0', '1', '2']
-
-// arreglo como objeto
-var obj = { 0: 'a', 1: 'b', 2: 'c' };
-console.log(Object.keys(obj)); // console: ['0', '1', '2']
-
-// arreglo como objeto con nombres ordenados aleatoriamente
-var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
-console.log(Object.keys(an_obj)); // console: ['2', '7', '100']
-
-// getFoo es una propiedad no enumerable
-var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
-my_obj.foo = 1;
-
-console.log(Object.keys(my_obj)); // console: ['foo']
-</pre>
-
-<p>Si quieres todas las propiedades, incluso las no enumerables, mira {{jsxref("Object.getOwnPropertyNames()")}}.</p>
-
-<h2 id="Notas">Notas</h2>
-
-<p>En ES5, si el argumento para este método no es un objeto (uno primitivo), causará un {{jsxref("Global_Objects/TypeError", "TypeError")}}. En ES2015, un argumento no-objeto será coaccionado hacia un objeto.</p>
-
-<pre class="brush: js notranslate">&gt; Object.keys("foo")
-// TypeError: "foo" is not an object  (ES5)
-
-&gt; Object.keys("foo")
-// ["0", "1", "2"]                    (ES2015)</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Para añadir soporte <code>Object.keys</code> en entornos más antiguos que no lo soportan de forma nativa, copia el siguiente fragmento:</p>
-
-<pre class="brush: js notranslate">// De https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
-if (!Object.keys) {
-  Object.keys = (function() {
-    'use strict';
-    var hasOwnProperty = Object.prototype.hasOwnProperty,
-        hasDontEnumBug = !({ toString: null }).propertyIsEnumerable('toString'),
-        dontEnums = [
-          'toString',
-          'toLocaleString',
-          'valueOf',
-          'hasOwnProperty',
-          'isPrototypeOf',
-          'propertyIsEnumerable',
-          'constructor'
-        ],
-        dontEnumsLength = dontEnums.length;
-
-    return function(obj) {
-      if (typeof obj !== 'object' &amp;&amp; (typeof obj !== 'function' || obj === null)) {
-        throw new TypeError('Object.keys called on non-object');
-      }
-
-      var result = [], prop, i;
-
-      for (prop in obj) {
-        if (hasOwnProperty.call(obj, prop)) {
-          result.push(prop);
-        }
-      }
-
-      if (hasDontEnumBug) {
-        for (i = 0; i &lt; dontEnumsLength; i++) {
-          if (hasOwnProperty.call(obj, dontEnums[i])) {
-            result.push(dontEnums[i]);
-          }
-        }
-      }
-      return result;
-    };
-  }());
-}
-</pre>
-
-<p>Ten en cuenta que el código anterior incluye claves no-enumerables en IE7 (y quizás IE8), al pasar en un objeto desde una ventana diferente.</p>
-
-<p>Para un simple Polyfill del Navegador, mira <a href="http://tokenposts.blogspot.com.au/2012/04/javascript-objectkeys-browser.html">Javascript - Compatibilidad de Object.keys en Navegadores</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.14', 'Object.keys')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-object.keys', 'Object.keys')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.keys', 'Object.keys')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Object.keys")}}</div>
-
-
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Propiedades de enumerabilidad y pertenencia</a></li>
- <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li>
- <li>{{jsxref("Object.create()")}}</li>
- <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
- <li>{{jsxref("Object.values()")}}</li>
- <li>{{jsxref("Object.entries()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/preventextensions/index.html b/files/es/web/javascript/referencia/objetos_globales/object/preventextensions/index.html
deleted file mode 100644
index 50f51214a8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/preventextensions/index.html
+++ /dev/null
@@ -1,176 +0,0 @@
----
-title: Object.preventExtensions()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/preventExtensions
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/preventExtensions
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.preventExtensions()</strong></code> previene que nuevas propiedades sean agregadas a un objeto (p.e. previene la extensión futuras al objeto).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Object.preventExtensions(<var>obj</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto que debería hacerse inextendible.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Un objeto es extendible si propiedades nuevas pueden ser agregadas a este. Object.preventExtensions() marca un objecto como no extendible, así nunca más tendrá propiedades más allá de las tenía en el momento en que fue marcado como no extendible. Note que las propiedades de un objeto no-extendible, en general, aún pueden ser eliminadas. Los intentos de agregar propiedades nuevas a un objeto no-extendible fallarán, ya sea de manera silenciosa o arrojando una excepción {{jsxref("TypeError")}} (comunmente, pero no de manera exclusiva, en {{jsxref("Functions_and_function_scope/Strict_mode", "strict mode", "", 1)}}).</p>
-
-<p><code>Object.preventExtensions()</code> solo previene la adición de propiedades propias. Las propiedades aún pueden ser agregadas a object.prototype. Sin embargo, llamar <code>Object.preventExtensions()</code> sobre un objeto tambien prevendrá extensiones sobre la propiedad {{jsxref("Object.proto", "__proto__")}} {{deprecated_inline}}.</p>
-
-<p>Si hay una manera de cambiar un objeto extendible a uno no-extendible, hay una manera de hacer lo opuesto en ECMAScript 5.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">// Object.preventExtensions regresa el objeto hecho no-extendible.
-var obj = {};
-var obj2 = Object.preventExtensions(obj);
-obj === obj2; // true
-
-// Los Objetos son extendibles por defecto.
-var empty = {};
-Object.isExtensible(empty); // === true
-
-// ...pero pueden ser cambiados.
-Object.preventExtensions(empty);
-Object.isExtensible(empty); // === false
-
-// Object.defineProperty arroja una excepción cuando se agrega
-// una propiedad nueva a un objeto no-extendible.
-var nonExtensible = { removable: true };
-Object.preventExtensions(nonExtensible);
-Object.defineProperty(nonExtensible, 'new', { value: 8675309 }); // arroja TypeError
-
-// En modo estricto, tratar de agregar propiedades nuevas
-// a un objeto no-extensible arroja una excepción TypeError.
-function fail() {
-  'use strict';
-  nonExtensible.newProperty = 'FAIL'; // arroja TypeError
-}
-fail();
-
-// EXTENSION (solo funciona en motores que soporten __proto__
-// (el cual esta obsoleto. Usar Object.getPrototypeOf en su lugar)):
-// La propiedad prototype de un objeto no-extendible es inmutable.
-var fixed = Object.preventExtensions({});
-fixed.__proto__ = { oh: 'hai' }; // arroja TypeError
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>En ES5, si el argumento pasado a este método no es un objeto (primitivo), entonces causará un {{jsxref("TypeError")}}. En ES6, un argumento no-objeto será tratado como si fuera un objeto ordinario no-extendible, simplemente lo regresa.</p>
-
-<pre class="brush: js">Object.preventExtensions(1);
-// TypeError: 1 is not an object (ES5 code)
-
-Object.preventExtensions(1);
-// 1                             (ES6 code)
-</pre>
-
-<h2 id="Especificación">Especificación</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.10', 'Object.preventExtensions')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementada en JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.preventextensions', 'Object.preventExtensions')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("6")}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatOpera("12")}}</td>
-   <td>{{CompatSafari("5.1")}}</td>
-  </tr>
-  <tr>
-   <td>Comportamiento en ES6 para un no-objeto pasado como argumento</td>
-   <td>{{CompatChrome("44")}}</td>
-   <td>{{CompatGeckoDesktop("35.0")}}</td>
-   <td>{{CompatIE("11")}}</td>
-   <td>{{CompatOpera("31")}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Comportamiento en ES6 para no-objetos pasados como argumentos</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("35.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li>{{jsxref("Object.isExtensible()")}}</li>
- <li>{{jsxref("Object.seal()")}}</li>
- <li>{{jsxref("Object.isSealed()")}}</li>
- <li>{{jsxref("Object.freeze()")}}</li>
- <li>{{jsxref("Object.isFrozen()")}}</li>
- <li>{{jsxref("Reflect.preventExtensions()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/propertyisenumerable/index.html b/files/es/web/javascript/referencia/objetos_globales/object/propertyisenumerable/index.html
deleted file mode 100644
index b2ede9dd60..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/propertyisenumerable/index.html
+++ /dev/null
@@ -1,185 +0,0 @@
----
-title: Object.prototype.propertyIsEnumerable()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/propertyIsEnumerable
-tags:
-  - JavaScript
-  - Objecto
-  - Property
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>propertyIsEnumerable()</strong></code> regresa un Boleano indicando si la propiedad especificada es enumerable.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>obj</var>.propertyIsEnumerable(<var>prop</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>prop</code></dt>
- <dd>Nombre de la propiedad a probar.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Todos los objetos tienen un método <code>propertyIsEnumerable</code>. Este método puede determinar si la propiedad especificada en el objeto puede ser enumerada por un ciclo {{jsxref("Statements/for...in", "for...in")}}, con la excepción de propiedades heredadas a través de prototype. Si el objeto no tiene la propiedad especificada, este método regresa un valor <code>false</code>.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Uso_básico_de_propertyIsEnumerable">Uso básico de <code>propertyIsEnumerable</code></h3>
-
-<p>El siguiente ejemplo muestra el uso de <code>propertyIsEnumerable</code> en objetos y arrays:</p>
-
-<pre class="brush: js">var o = {};
-var a = [];
-o.prop = 'es enumerable';
-a[0] = 'es enumerable';
-
-o.propertyIsEnumerable('prop');   // regresa true
-a.propertyIsEnumerable(0);        // regresa true
-</pre>
-
-<h3 id="Definidas_por_usuario_vs_predefinidas">Definidas por usuario vs predefinidas</h3>
-
-<p>El siguiente ejemplo demuestra la enumerabilidad de las propiedades definidas por el usuario contra las predefinidas:</p>
-
-<pre class="brush: js">var a = ['es enumerable'];
-
-a.propertyIsEnumerable(0);          // regresa true
-a.propertyIsEnumerable('length');   // regresa false
-
-Math.propertyIsEnumerable('random');   // regresa false
-this.propertyIsEnumerable('Math');     // regresa false
-</pre>
-
-<h3 id="Directa_vs_heredadas">Directa vs  heredadas</h3>
-
-<pre class="brush: js">var a = [];
-a.propertyIsEnumerable('constructor');         // regresa false
-
-function primerConstructor() {
-  this.propiedad = 'no es enumerable';
-}
-
-primerConstructor.prototype.primerMetodo = function() {};
-
-function segundoConstructor() {
-  this.metodo = function() { return 'es enumerable'; };
-}
-
-secondConstructor.prototype = new primerConstructor;
-secondConstructor.prototype.constructor = segundoConstructor;
-
-var o = new segundoConstructor();
-o.propiedadArbitraria = 'is enumerable';
-
-o.propertyIsEnumerable('propiedadArbitraria ');   // regresa true
-o.propertyIsEnumerable('metodo');                 // regresa true
-o.propertyIsEnumerable('propiedad');              // regresa false
-
-o.propiedad = 'es enumerable';
-
-o.propertyIsEnumerable('propiedad');              // regresa true
-
-// Regresan false por estar en el prototipo el cual no es
-// considerado por propertyIsEnumerable (a pesar de que las dos ultimas son
-// iterables con un for-in)
-o.propertyIsEnumerable('prototype');   // regresa false (como en JS 1.8.1/FF3.6)
-o.propertyIsEnumerable('constructor'); // regresa false
-o.propertyIsEnumerable('firstMethod'); // regresa false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.4.7', 'Object.prototype.propertyIsEnumerable')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.prototype.propertyisenumerable', 'Object.prototype.propertyIsEnumerable')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h2>
-
-<p>Al inicio de JavaScript 1.8.1 (in Firefox 3.6), <code>propertyIsEnumerable('prototype')</code> regresa <code>false</code> en lugar de <code>true</code>; esto hace que el resultado cumpla con la especificación de ECMAScript 5.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
- <li>{{jsxref("Statements/for...in", "for...in")}}</li>
- <li>{{jsxref("Object.keys()")}}</li>
- <li>{{jsxref("Object.defineProperty()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/proto/index.html b/files/es/web/javascript/referencia/objetos_globales/object/proto/index.html
deleted file mode 100644
index 24055ac261..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/proto/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: Object.prototype.__proto__
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/proto
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/proto
----
-<div class="warning">
-<p><strong>Advertencia:</strong> Cambiar la propiedad <code>[[Prototype]]</code> de un objeto es, por como los navegadores modernos optimizan las propiedades de acceso, una operación muy lenta en <strong><em>todos</em></strong> los navegadores y motores JavaScript. Los efectos en el rendimiento de alterar la herencia son muchos y delicados, y no se limita simplemente al tiempo que necesita la asignación <code>obj.__proto__ = ...</code> sentencia,  sin embargo afecta a  <strong><em>cualquier</em></strong> código que tiene acceso a  <strong><em>cualquier</em></strong> objeto cuya propiedad <code>[[Prototype]]</code> ha sido alterada, por lo que se debe de tener mucho cuidado.</p>
-
-<p>Si el rendimiento en tu aplicación es necesario, deberías evitar modificar la propiedad <code>[[Prototype]]</code> de un objeto. En su lugar, crea un objecto nuevo con la propiedad <code>[[Prototype]]</code> deseada usando {{jsxref("Object.create()")}}.</p>
-</div>
-
-<div class="warning">
-<p><strong>Advertencia:</strong> Mientras <code>Object.prototype.__proto__</code> es soportado hoy día por la mayoría de navegadores, su existencia y comportamiento exacto solo ha sido estandarizado en la especificación ECMAScript 6 como una característica de legado y para asegurar la compatibilidad entre los navegadores web. Para tener un mejor soporte, es recomendable que se utilice {{jsxref("Object.getPrototypeOf()")}} para obtener el prototipo de un objeto.</p>
-</div>
-
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code>__proto__</code> de {{jsxref("Object.prototype")}} es una propiedad llamada de acceso (una función getter y también función setter) que provee acceso al interior de <code>[[Prototype]]</code> (ya sea un objeto o {{jsxref("Global_Objects/null", "null")}}) del objeto a través del cual se accede a ella.</p>
-
-<p>El uso de la propiedad <code>__proto__</code> es polémico actualmente, y está rechazado. Originalmente, nunca fué incluído en la especificación de EcmaScript, pero los navegadores modernos decidieron implementarla de todas maneras. Sólo actualmente, <code>la propiedad __proto__</code> ha sido estandarizada en la especificación del lenguaje ECMAScript 6, para asegurar la compatibilidad entre navegadores, por lo tanto, esta será soportada en el futuro. Actualmente está obsoleta  en favor de {{jsxref("Object.getPrototypeOf")}}/{{jsxref("Reflect.getPrototypeOf")}} y {{jsxref("Object.setPrototypeOf")}}/{{jsxref("Reflect.setPrototypeOf")}} (aunque todavía establecer el <code>[[Prototype]]</code> de un objeto es una operación muy lenta, por lo que si nos preocupa el rendimiento, debemos de evitarlo).</p>
-
-<p>La propiedad <code>__proto__</code> puede ser usada también en un objeto definido de forma literal, para establecer el <code>[[Prototype]]</code> en la creación de este, como alternativa a {{jsxref("Object.create()")}}. Ver: <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">object initializer / literal syntax</a>.</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="brush: js">var shape = {};
-var circle = new Circle();
-
-// Establecer el objeto prototype.
-// OBSOLETO. Esto es solo un ejemplo. NO HACER ESTO en código real.
-shape.__proto__ = circle;
-
-// Obtener el objeto prototype
-console.log(shape.__proto__ === circle); // true
-</pre>
-
-<p>Nota: esto es, dos guiones bajos, seguidos de cinco carácteres "proto", seguido de dos guiones bajos mas.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La función getter <code>__proto__</code>el valor interno del <code>[[Prototype]]</code> de un objeto. Para objetos creados usando un objeto literal, el valor es {{jsxref("Object.prototype")}}. Para objetos creados usando literales de array, este valor es {{jsxref("Array.prototype")}}. Para funciones, este valor {{jsxref("Function.prototype")}}. Para objetos creados utilizando el operador new fun, donde <strong>fun</strong> es una función constructora incluída en JavaScript  ({{jsxref("Array")}}, {{jsxref("Boolean")}}, {{jsxref("Date")}}, {{jsxref("Number")}}, {{jsxref("Object")}}, {{jsxref("String")}}, etcétera—incluyendo nuevos contrusctores conforme JavaScript evoluciona), este valor es <code>fun.prototype</code>.  (Esto es, si el constructor no devuelve un objeto de forma explícita, o el <code>fun.prototype</code> ha sido reasignado desde que la instancia fué creada).</p>
-
-<p>El <code>__proto__</code> setter la mutación del objeto <code>[[Prototype]]</code> de un objeto. El objeto debe ser extensible según {{jsxref("Object.isExtensible()")}}: si no, un {{jsxref("Global_Objects/TypeError", "TypeError")}} es lanzado. El valor proveído debe ser un objeto o {{jsxref("Global_Objects/null", "null")}}. Provetendo otro tipo de valor no hará nada.</p>
-
-<p>Para entender como los prototipos son usados para herencia, ver el artículo <a href="/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">Inheritance and the prototype chain</a>.</p>
-
-<p>La propiedad <code>__proto__</code> es una simple propiedad de acceso a {{jsxref("Object.prototype")}} que consiste en una función getter y setter. Un acceso a la propiedad  <code>__proto__</code> que eventualmente consulta {{jsxref("Object.prototype")}} encontrará esta propiedad, pero un acceso que no consulta {{jsxref("Object.prototype")}} no lo encontrará. Si alguna otra propiedad <code>__proto__</code> es encontrada antes {{jsxref("Object.prototype")}} es consultada, esta propiedad sera ocultada por la encontrada en {{jsxref("Object.prototype")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-additional-properties-of-the-object.prototype-object', 'Object.prototype.__proto__')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Incluída en el anexo (normativa) para características de legado ECMAScript para navegadores web (observar que la especificación de codificación es lo que ya está en las implementaciones).</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatIE("11")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Caracteristica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
-
-<p>Mientras la especificación ECMAScript 2015 (ES6) dicta que el soporte para <code>__proto__</code> es requerido <em>solo</em> para navegadores web (a pesar de ser normativo), otros medios pueden soportarlo por uso de legado.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li>
- <li>{{jsxref("Object.getPrototypeOf()")}}</li>
- <li>{{jsxref("Object.setPrototypeOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/object/prototype/index.html
deleted file mode 100644
index 9b55c9cccc..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/prototype/index.html
+++ /dev/null
@@ -1,195 +0,0 @@
----
-title: Object.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/prototype
-tags:
-  - JavaScript
-  - Objeto
-  - Propiedad
-translation_of: Web/JavaScript/Reference/Global_Objects/Object
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Object/prototype
----
-<div>{{JSRef("Objetos_globales", "Object")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La propiedad <code><strong>Object.prototype</strong></code> representa al objeto prototipo de {{jsxref("Object")}}.</p>
-
-<p>{{js_property_attributes(0,0,0)}}</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Todos los objetos en JavaScript provienen de {{jsxref("Global_Objects/Object", "Object")}}; todos los objetos heredan métodos y propiedades de<code> Object.prototype</code>, aunque pueden ser sobrecargados. Sin embargo, un <code>Object</code>  puede ser deliberadamente creado para que esto no sea cierto (por ejemplo usando  {{jsxref("Object.create", "Object.create(null)")}}), o bien alterado para que no cumpla esta propiedad (por ejemplo usando {{jsxref("Object.setPrototypeOf")}}).</p>
-
-<p>Cambios en el prototipo de {{jsxref("Object")}} son vistos por <strong>todos </strong>los objetos a traves de el encadenado de prototype, a no ser que las propiedades y los metodos sujetos a estos cambios sean sobreescritos en algun lugar de la cadena de prototype. Este poderoso y a la vez potencialmente peligroso mecanismo permite extender o sobreescribir el comportamiento de un objeto.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("Object.prototype.constructor")}}</dt>
- <dd>Especifica la función que crea el prototipo de un objeto.</dd>
- <dt>{{jsxref("Object.proto", "Object.prototype.__proto__")}} {{Non-standard_inline}}</dt>
- <dd>Apunta al objeto que se usó como prototipo cuando fue instanciado.</dd>
- <dt>{{jsxref("Object.noSuchMethod", "Object.prototype.__noSuchMethod__")}} {{Non-standard_inline}}</dt>
- <dd>Permite a una función ser definida que sera ejecutada cuando un miembro del objeto es llamado como un metodo.</dd>
- <dt><s class="obsoleteElement">{{jsxref("Object.count", "Object.prototype.__count__")}} {{obsolete_inline()}}</s></dt>
- <dd>Se utiliza para devolver el número de propiedades enumerables directamente en un objeto definido por el usuario, pero que ha sido eliminado.</dd>
- <dt><s class="obsoleteElement">{{jsxref("Object.parent", "Object.prototype.__parent__")}} {{obsolete_inline()}}</s></dt>
- <dd><s class="obsoleteElement">Apunta al contexto de un objeto. Ha sido borrado.</s></dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Object.defineGetter", "Object.prototype.__defineGetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
- <dd>Asocia una función con una propiedad que, cuando se accede a ella, ejecuta esa función y devuelve su valor de retorno.</dd>
- <dt>{{jsxref("Object.defineSetter", "Object.prototype.__defineSetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
- <dd>Asocia una función con una propiedad que al establecerse ejecuta esa función que modifica la propiedad.</dd>
- <dt>{{jsxref("Object.lookupGetter", "Object.prototype.__lookupGetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
- <dd>Devuelve la función asociada con la propiedad indicada por el método {{jsxref("Object.defineGetter", "__defineGetter__")}}.</dd>
- <dt>{{jsxref("Object.lookupSetter", "Object.prototype.__lookupSetter__()")}} {{Non-standard_inline}} {{deprecated_inline()}}</dt>
- <dd>Devuelve la función asociada con la propiedad indicada en el método {{jsxref("Object.defineSetter", "__defineSetter__")}}.</dd>
- <dt>{{jsxref("Object.prototype.hasOwnProperty()")}}</dt>
- <dd>Devuelve un valor lógico (boolean) que indica si el objeto contiene la propiedad indicada como una propiedad directa de ese objeto y no heredada por la cadena de prototipo.</dd>
- <dt>{{jsxref("Object.prototype.isPrototypeOf()")}}</dt>
- <dd>Devuelve una indicación <em>booleana</em> cuando el objeto especificado está en la cadena de prototipos del objeto sobre el cuál éste método es llamado.</dd>
- <dt>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</dt>
- <dd>Devuelve un valor lógico (boolean) indicando si el attributo <a href="/es/docs/Web/JavaScript/Data_structures#Objetos">ECMAScript [[Enumerable]]</a> está definido.</dd>
- <dt>{{jsxref("Object.prototype.toSource()")}} {{Non-standard_inline}}</dt>
- <dd>Devuelve una cadena con el fuente de un literal de objeto que representa el objeto desde el que este método es llamado; se puede usar este valor para crear un nuevo objeto.</dd>
- <dt>{{jsxref("Object.prototype.toLocaleString()")}}</dt>
- <dd>Llama a {{jsxref("Object.toString", "toString()")}}.</dd>
- <dt>{{jsxref("Object.prototype.toString()")}}</dt>
- <dd>Devuelve la cadena de texto (string) que representa al objeto.</dd>
- <dt>{{jsxref("Object.prototype.unwatch()")}} {{Non-standard_inline}}</dt>
- <dd>Remueve un punto de mira de una propiedad del objeto.</dd>
- <dt>{{jsxref("Object.prototype.valueOf()")}}</dt>
- <dd>Devuelve el valor primitivo del objeto indicado.</dd>
- <dt>{{jsxref("Object.prototype.watch()")}} {{Non-standard_inline}}</dt>
- <dd>Agrega un punto de mira a una propiedad del objeto.</dd>
- <dt><s class="obsoleteElement">{{jsxref("Object.prototype.eval()")}} {{ obsolete_inline()}}</s></dt>
- <dd><s class="obsoleteElement">Se utiliza para evaluar una cadena de código JavaScript  en el contexto del objeto especificado, pero que ha sido removido.</s></dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Al alterar el comportamiento de un método existente en Object.prototype, es oportuno considerar envolver el código de tu extensión antes o después de la existente lógica. Por ejemplo, este trozo de código (sin testear) ejecutara una determinada lógica antes de que la lógica existente o la de algún otro elemento sea ejecutada.</p>
-
-<p>Cuando una función es llamada, los parámetros de la llamada son mantenidos en el argumento parecido a una array llamado "arguments". Por ejemplo, en la llamada "myFn(a, b, c)", los parámetros dentro del cuerpo de la función myFn estarán contenidos en una variable llamada "arguments". Si se desea llamar al siguiente método de la cadena de prototype, simplemente añade this y arguments a la funcion apply(). Este patrón puede ser usado en cualquier prototype, por ejemplo Node.prototype, Function.prototype, etc.</p>
-
-<pre class="brush: js">var current = Object.prototype.valueOf;
-
-// Como mi propiedad "-prop-value" es un atajo y no se encuentra siempre
-// en la cadena de prototype, queremos modificar Object.prototype:
-Object.prototype.valueOf = function() {
-  if (this.hasOwnProperty('-prop-value')) {
-    return this['-prop-value'];
-  } else {
-    // No parece que este objeto sea uno de los mios, por lo que recaeeremos
-    // en el comportamiento por defecto lo mejor que podamos.
-    // La llamada apply se comporta como el "super" en otros lenguages de programación.
-    // A pesar de que valueOf() no tiene parametros, alguna otra llamada podria tenerlos.
-    return current.apply(this, arguments);
-  }
-}</pre>
-
-<p>Como JavaScript no tiene objetos de tipo “subclase”, prototype es realmente útil para crear un objeto “base” donde ciertas funciones actúan como objetos. Por ejemplo:</p>
-
-<pre class="brush: js">var Person = function(name) {
-  this.name = name;
-  this.canTalk = true;
-};
-
-Person.prototype.greet = function() {
-  if (this.canTalk) {
-    console.log('Hi, I am ' + this.name);
-  }
-};
-
-var Employee = function(name, title) {
-  Person.call(this, name);
-  this.title = title;
-};
-
-Employee.prototype = Object.create(Person.prototype);
-Employee.prototype.constructor = Employee;
-
-Employee.prototype.greet = function() {
-  if (this.canTalk) {
-    console.log('Hi, I am ' + this.name + ', the ' + this.title);
-  }
-};
-
-var Customer = function(name) {
-  Person.call(this, name);
-};
-
-Customer.prototype = Object.create(Person.prototype);
-Customer.prototype.constructor = Customer;
-
-var Mime = function(name) {
-  Person.call(this, name);
-  this.canTalk = false;
-};
-
-Mime.prototype = Object.create(Person.prototype);
-Mime.prototype.constructor = Mime;
-
-var bob = new Employee('Bob', 'Builder');
-var joe = new Customer('Joe');
-var rg = new Employee('Red Green', 'Handyman');
-var mike = new Customer('Mike');
-var mime = new Mime('Mime');
-
-bob.greet();
-// Hi, I am Bob, the Builder
-
-joe.greet();
-// Hi, I am Joe
-
-rg.greet();
-// Hi, I am Red Green, the Handyman
-
-mike.greet();
-// Hi, I am Mike
-
-mime.greet();</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>
-    <p>Definición inicial.Implementado en  JavaScript 1.0.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.1', 'Object.prototype')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.prototype', 'Object.prototype')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>
-    <p> </p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.prototype', 'Object.prototype')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.Object.prototype")}}</p>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/seal/index.html b/files/es/web/javascript/referencia/objetos_globales/object/seal/index.html
deleted file mode 100644
index 42c89175a3..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/seal/index.html
+++ /dev/null
@@ -1,167 +0,0 @@
----
-title: Object.seal()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/seal
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/seal
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.seal()</strong></code> sella un objeto, previniendo que puedan añadirse nuevas propiedades al mismo, y marcando todas las propiedades existentes como no-configurables. Los valores de las propiedades presentes permanecen pudiendo cambiarse en tanto en cuanto dichas propiedades sean de escritura.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Object.seal(<var>obj</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto que ha de ser sellado.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Por defecto, los objetos son {{jsxref("Object.isExtensible()", "extensibles", "", 1)}} (pueden añadirse nuevas propiedades a los mismos). Sellar un objeto previene que nuevas propiedades puedan ser añadidas y marca todas las propiedades existentes como no-configurables. Esto tiene el efecto de hacer fijo e inmutable el juego de propiedades del objeto. Al hacer todas las propiedades no-configurables previene también que se puedan convertir propiedades de datos en propiedades de acceso y viceversa, pero no evita que los valores de las propiedades de datos puedan ser modificados. Intentar eliminar o añadir propiedades a un objeto sellado, o convertir una propiedad de datos en una propiedad de acceso fallará, bien silenciadamente o bien produciendo un {{jsxref("TypeError")}} (más frecuentemente, aunque no exclusivamente, con código en {{jsxref("Strict_mode", "modo estricto", "", 1)}}).</p>
-
-<p>La cadena de prototiado permanece inalterada. No obstante, la propiedad {{jsxref("Object.proto", "__proto__")}} {{deprecated_inline}} es también sellada.</p>
-
-<p>Retorna una referencia al Objeto pasado.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">var obj = {
-  prop: function() {},
-  foo: 'bar'
-};
-
-// Pueden añadirse nuevas propiedades, propiedades existentes pueden cambiarse o eliminarse.
-obj.foo = 'baz';
-obj.lumpy = 'woof';
-delete obj.prop;
-
-var o = Object.seal(obj);
-
-o === obj; // true
-Object.isSealed(obj); // === true
-
-// Sigue permitido modificar valores de propiedades en un objeto sellado.
-obj.foo = 'quux';
-
-// Pero no puedes convertir propiedades de datos en propiedades de acceso, ni viveversa
-Object.defineProperty(obj, 'foo', { get: function() { return 'g'; } }); // produce un TypeError
-
-// Ahora, cualquier cambio que no sea modificar valores de propiedades fallará
-obj.quaxxor = 'the friendly duck'; // silenciosamente, no añadirá la propiedad
-delete obj.foo; // silenciosamente, no eliminará la propiedad
-
-// ...y en modo estricto esos intentos producirán TypeErrors.
-function fail() {
-  'use strict';
-  delete obj.foo; // genera un TypeError
-  obj.sparky = 'arf'; // genera un TypeError
-}
-fail();
-
-// Intentar añadir propiedades mediante Object.defineProperty también fallará.
-Object.defineProperty(obj, 'ohai', { value: 17 }); // genera un TypeError
-Object.defineProperty(obj, 'foo', { value: 'eit' }); // cambia el valor exisitente
-</pre>
-
-<h2 id="Notas">Notas</h2>
-
-<p>En ES5, si el argumento de este método no es un objeto (una primitiva), se generará un {{jsxref("TypeError")}}. En ES6, un argumento no-objeto será tratado como si se sellase un objeto ordinario, símplemente retornándolo.</p>
-
-<pre class="brush: js">Object.seal(1);
-// TypeError: 1 no es un objeto (código ES5)
-
-Object.seal(1);
-// 1                             (código ES6)
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Observaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.3.8', 'Object.seal')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial. Implementado en  JavaScript 1.8.5.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.seal', 'Object.seal')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.seal', 'Object.seal')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestación</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("6")}}</td>
-   <td>{{CompatGeckoDesktop("2.0")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatOpera("12")}}</td>
-   <td>{{CompatSafari("5.1")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Prestiación</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.isSealed()")}}</li>
- <li>{{jsxref("Object.preventExtensions()")}}</li>
- <li>{{jsxref("Object.isExtensible()")}}</li>
- <li>{{jsxref("Object.freeze()")}}</li>
- <li>{{jsxref("Object.isFrozen()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/setprototypeof/index.html b/files/es/web/javascript/referencia/objetos_globales/object/setprototypeof/index.html
deleted file mode 100644
index ff32fc5738..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/setprototypeof/index.html
+++ /dev/null
@@ -1,237 +0,0 @@
----
-title: Object.setPrototypeOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/setPrototypeOf
-tags:
-  - ECMAScript6
-  - Experimental
-  - JavaScript
-  - Método(2)
-  - Objeto
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/setPrototypeOf
----
-<p>{{JSRef}}</p>
-
-<p>El método <code><strong>Object.setPrototypeOf()</strong></code> establece el prototipo (p.e., la propiedad interna <code>[[Prototype]]</code>) de un objeto especificado a otro objeto o sino establece {{jsxref("null")}}.</p>
-
-<div class="warning">
-<p><strong>Adverdencia:</strong> Cambiar la propiedad <code>[[Prototype]]</code> de un objeto, debido a la naturaleza de la optimización del acceso a propiedades de los motores modernos de JavaScript, es una operación bastante lenta, en todo <strong><em>todo</em></strong> navegador y motor de JavaScript. Los efectos sobre el rendimiento al alterar la herencia son sutiles y vastos., y no están limitados a simplemente el tiempo gastado en la sentencia <code>obj.__proto___ = ...</code>,  but may extend to <strong><em>any</em></strong> code that has access to <strong><em>any</em></strong> object whose <code>[[Prototype]]</code> has been altered. If you care about performance you should avoid setting the <code>[[Prototype]]</code> of an object. Instead, create a new object with the desired <code>[[Prototype]]</code> using {{jsxref("Object.create()")}}.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Object.setPrototypeOf(<var>obj</var>, <var>prototype</var>);</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>El objeto al que se ha de establecer el prototipo.</dd>
- <dt><code>prototype</code></dt>
- <dd>El nuevo prototipo del objeto, (un objeto o {{jsxref("null")}}).</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Arroja una excepción del tipo {{jsxref("TypeError")}} si el objeto cuyo <code>[[Prototype]]</code> se va a modificar no es extensible de acuerdo con {{jsxref("Object.isExtensible()")}}. No hace nada si el parametro <code>prototype</code> no es un objeto o {{jsxref("null")}} (p.e., número, cadena, booleano, o {{jsxref("undefined")}}). De cualquier otra forma, este método cambia la propiedad <code>[[Prototype]]</code> del <code>obj</code> al valor nuevo.</p>
-
-<p><code>Object.setPrototypeOf()</code> está en el último borrador del estandar ECMAScript6. Es considerado generalmente la manera adecuada de establecer el prototipo de un objeto, contra la propiedad más controversial {{jsxref("Object.prototype.__proto__")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">var dict = Object.setPrototypeOf({}, null);
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Utilizando la vieja propiedad {{jsxref("Object.prototype.__proto__")}}, podemos definir facilmente <code>Object.setPrototypeOf</code> si aún no está disponible:</p>
-
-<pre class="brush: js">// Solo funciona en Chrome y FirefoxOnly works in Chrome y FireFox, no funciona en IE:
-Object.setPrototypeOf = Object.setPrototypeOf || function(obj, proto) {
-  obj.__proto__ = proto;
-  return obj;
-}
-</pre>
-
-<h2 id="Agregando_cadenas_de_prototipo">Agregando cadenas de prototipo</h2>
-
-<p>Una combinación de <code>Object.getPrototypeOf()</code> y {{jsxref("Object.proto", "Object.prototype.__proto__")}} permite agregar una nueva cadena de prototipos al nuevo  prototipo del objeto.</p>
-
-<pre class="brush: js">/**
-*** Object.appendChain(@object, @prototype)
-*
-* Agrega el primer prototipo no-nativo de una cadena a un nuevo prototipo.
-* Retorna @object (si es Primitivo (Primitive value) será transoformado a Objeto).
-*
-*** Object.appendChain(@object [, "@arg_name_1", "@arg_name_2", "@arg_name_3", "..."], "@function_body")
-*** Object.appendChain(@object [, "@arg_name_1, @arg_name_2, @arg_name_3, ..."], "@function_body")
-*
-*  Agrega el primer prototipo no-nativo de una cadena a la Function.prototype nativa del objeto, luego agrega una
-* ueva Function(["@arg"(s)], "@function_body") a la cadena.
-* Retorna la función.
-*
-**/
-
-Object.appendChain = function(oChain, oProto) {
-  if (arguments.length &lt; 2) {
-    throw new TypeError('Object.appendChain - Not enough arguments');
-  }
-  if (typeof oProto === 'number' || typeof oProto === 'boolean') {
-    throw new TypeError('second argument to Object.appendChain must be an object or a string');
-  }
-
-  var oNewProto = oProto,
-      oReturn = o2nd = oLast = oChain instanceof this ? oChain : new oChain.constructor(oChain);
-
-  for (var o1st = this.getPrototypeOf(o2nd);
-    o1st !== Object.prototype &amp;&amp; o1st !== Function.prototype;
-    o1st = this.getPrototypeOf(o2nd)
-  ) {
-    o2nd = o1st;
-  }
-
-  if (oProto.constructor === String) {
-    oNewProto = Function.prototype;
-    oReturn = Function.apply(null, Array.prototype.slice.call(arguments, 1));
-    this.setPrototypeOf(oReturn, oLast);
-  }
-
-  this.setPrototypeOf(o2nd, oNewProto);
-  return oReturn;
-}
-</pre>
-
-<h3 id="Uso">Uso</h3>
-
-<h4 id="Primer_ejemplo_Agregar_una_cadena_a_un_prototipo">Primer ejemplo: Agregar una cadena a un prototipo</h4>
-
-<pre class="brush: js">function Mammal() {
-  this.isMammal = 'yes';
-}
-
-function MammalSpecies(sMammalSpecies) {
-  this.species = sMammalSpecies;
-}
-
-MammalSpecies.prototype = new Mammal();
-MammalSpecies.prototype.constructor = MammalSpecies;
-
-var oCat = new MammalSpecies('Felis');
-
-console.log(oCat.isMammal); // 'yes'
-
-function Animal() {
-  this.breathing = 'yes';
-}
-
-Object.appendChain(oCat, new Animal());
-
-console.log(oCat.breathing); // 'yes'
-</pre>
-
-<h4 id="Segundo_ejemplo_Transofrmando_un_valor_Primitivo_en_una_instancia_de_su_constructor_y_agregar_su_cadena_al_prototipo">Segundo ejemplo: Transofrmando un valor Primitivo en una instancia de su constructor y agregar su cadena al prototipo</h4>
-
-<pre class="brush: js">function Symbol() {
-  this.isSymbol = 'yes';
-}
-
-var nPrime = 17;
-
-console.log(typeof nPrime); // 'number'
-
-var oPrime = Object.appendChain(nPrime, new Symbol());
-
-console.log(oPrime); // '17'
-console.log(oPrime.isSymbol); // 'yes'
-console.log(typeof oPrime); // 'object'
-</pre>
-
-<h4 id="Tercer_ejemplo_Agregando_una_cadena_a_la_Function.prototype_de_un_objeto_y_agregando_una_nueva_función_a_la_cadena">Tercer ejemplo: Agregando una cadena a la Function.prototype de un objeto y agregando una nueva función a la cadena</h4>
-
-<pre class="brush: js">function Person(sName) {
-  this.identity = sName;
-}
-
-var george = Object.appendChain(new Person('George'),
-                                'console.log("Hello guys!!");');
-
-console.log(george.identity); // 'George'
-george(); // 'Hello guys!!'
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.setprototypeof', 'Object.setProtoypeOf')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome("34")}}</td>
-   <td>{{CompatGeckoDesktop("31")}}</td>
-   <td>{{CompatIE("11")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("31")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Reflect.setPrototypeOf()")}}</li>
- <li>{{jsxref("Object.prototype.isPrototypeOf()")}}</li>
- <li>{{jsxref("Object.getPrototypeOf()")}}</li>
- <li>{{jsxref("Object.prototype.__proto__")}} </li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/tolocalestring/index.html b/files/es/web/javascript/referencia/objetos_globales/object/tolocalestring/index.html
deleted file mode 100644
index d0de708b98..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/tolocalestring/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: Object.prototype.toLocaleString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/toLocaleString
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/toLocaleString
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>toLocaleString()</strong></code> devuelve un string que representa a un objeto. Este método está pensado para ser redefinido en los objetos derivados, para los propósitos específicos de cada configuración regional.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/object-prototype-tolocalestring.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>objeto</var>.toLocaleString()</pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un string que representa al objeto.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>{{jsxref("Object")}}'s <code>toLocaleString</code> devuelve el resultado de llamar a {{jsxref("Object.toString", "toString()")}}.</p>
-
-<p>Se proporciona esta función para que los objetos dispongan de un método <code>toLocaleString</code> genérico, aunque puede que no todos la utilicen. Véase la lista siguiente.</p>
-
-<h3 id="Objetos_que_redefinen_toLocaleString">Objetos que redefinen <code>toLocaleString</code></h3>
-
-<ul>
- <li>{{jsxref("Array")}}: {{jsxref("Array.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("Number")}}: {{jsxref("Number.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("Date")}}: {{jsxref("Date.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("TypedArray")}}: {{jsxref("TypedArray.prototype.toLocaleString()")}}</li>
- <li>{{jsxref("BigInt")}}: {{jsxref("BigInt.prototype.toLocaleString()")}}</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Redefinición_de_toLocaleString_en_Array">Redefinición de toLocaleString() en Array</h3>
-
-<p>En los objetos <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array">Array</a></code> se puede utilizar <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/toLocaleString">toLocaleString()</a></code> para imprimir los valores del <em>array</em> como un string, con indicadores opcionales de configuración regional (como símbolos de moneda) aplicados.</p>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: js notranslate">const unArray = [4, 7, 10];
-
-let preciosEnEuros = unArray.toLocaleString('fr', { style: 'currency', currency: 'EUR'});
-// "4,00 €,7,00 €,10,00 €"</pre>
-
-<h3 id="Redefinición_de_toLocaleString_para_Date">Redefinición de toLocaleString() para Date</h3>
-
-<p>En los objetos <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date">Date</a></code> se usa <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString">toLocaleString()</a></code> para imprimir fechas en un formato adecuado a la configuración regional.</p>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: js notranslate">const unaFecha = new Date(Date.now());
-// <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox"><span class="objectTitle">"</span>2020-07-07T19:51:44.046Z<span class="Date">"
-
-</span></span></span></span></span>let fechaAleman = unaFecha.toLocaleString('de');
-// "7.7.2020, 21:55:22"
-
-var fechaFrances= unaFecha.toLocaleString('fr');
-//"07/07/2020 à 21:55:22"</pre>
-
-<h3 id="Redefinición_de_toLocaleString_para_Number">Redefinición de toLocaleString() para Number</h3>
-
-<p>En los objetos <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">Number</a></code> se usa <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString">toLocaleString()</a></code> para imprimir números de forma adecuada a la configuración regional, p. ej. para usar los separadores de miles correctos.</p>
-
-<p>Por ejemplo:</p>
-
-<pre class="brush: js notranslate">const unNumero = 2901234564;
-// <span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><span class="objectBox objectBox-number">"2901234564"
-
-</span></span></span></span>let numeroAleman = unNumero.toLocaleString('de');
-// "2.901.234.564"
-
-let numeroFrances = unNumero.toLocaleString('fr');
-// "2 901 234 564"</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.prototype.tolocalestring', 'Object.prototype.toLocaleString')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Object.toLocaleString")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/tosource/index.html b/files/es/web/javascript/referencia/objetos_globales/object/tosource/index.html
deleted file mode 100644
index 713a176b0b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/tosource/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: Object.prototype.toSource()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/toSource
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/toSource
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>El método <strong><code>toSource()</code></strong> regresa una cadena representando el código fuente del objeto.</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code>Object.toSource();
-<var>obj</var>.toSource();
-</code></pre>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>Una cadena representando el código fuente del objeto.</p>
-
-<h2 id="Description">Description</h2>
-
-<p>EL método <code>toSource()</code> regresa los siguientes valores:</p>
-
-<ul>
- <li>Para el objeto incorporado {{jsxref("Object")}}, <code>toSource()</code> regresa la siguiente cadena indicando que el código fuente no está disponible:
-
-  <pre class="brush: js">function Object() {
-    [native code]
-}
-</pre>
- </li>
- <li>Para instancias de {{jsxref("Object")}}, <code>toSource()</code> regresa una cadena representando el código fuente.</li>
-</ul>
-
-<p>Puedes llamar el método <code>toSource()</code> durante el depurado para examinar el contenido de un objeto.</p>
-
-<h3 id="Sobreescribir_el_método_toSource()"><code><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="background-color: #333333;">Sobreescribir el método </span></font>toSource()</code></h3>
-
-<p>Es seguro para los objetos sobreescribir el método <strong>toSource()</strong><strong>.</strong> Por ejemplo:</p>
-
-<pre class="brush: js">function Person(name) {
-  this.name = name;
-}
-
-Person.prototype.toSource = function Person_toSource() {
-  return 'new Person(' + uneval(this.name) + ')';
-};
-
-console.log(new Person('Joe').toSource()); // ---&gt; nueva Person("Joe")
-</pre>
-
-<h3 id="Métodos_de_toSource()_incorporados">Métodos de <code>toSource()</code> incorporados</h3>
-
-<p>Cada tipo fundamental de JavaScript tiene su propio método <code>toSource()</code>.  Éstos objetos son:</p>
-
-<ul>
- <li>{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Array")}} object.</li>
- <li>{{jsxref("Boolean.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Boolean")}} object.</li>
- <li>{{jsxref("Date.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Date")}} object.</li>
- <li>{{jsxref("Function.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Function")}} object.</li>
- <li>{{jsxref("Number.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Number")}} object.</li>
- <li>{{jsxref("RegExp.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("RegExp")}} object.</li>
- <li>{{jsxref("SIMD.toSource()", "SIMD.%type%.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("SIMD")}} objects.</li>
- <li>{{jsxref("String.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("String")}} object.</li>
- <li>{{jsxref("Symbol.prototype.toSource()")}} {{non-standard_inline}} — {{jsxref("Symbol")}} object.</li>
- <li><code>Math.toSource()</code> — Regrsa la cadena "Math".</li>
-</ul>
-
-<h3 id="Limitaciones_en_objetos_cíclicos">Limitaciones en objetos cíclicos</h3>
-
-<p>EN el caso de los objetos que contienen referencia a ellos mismos, por ejemplo, una lista enlazada cíclicamente o un árbol que puede ser atravesado en ambas formas, <code>toSource()</code> no recreará la referencia a sí mismo, a partir de Firefox 24. Por ejemplo:</p>
-
-<pre class="brush: js">var obj1 = {};
-var obj2 = { a: obj1 };
-obj1.b = obj2;
-
-console.log('Ciclico: ' + (obj1.b.a == obj1));
-
-var objSource = obj1.toSource(); // regresa "({b:{a:{}}})"
-
-obj1 = eval(objSource);
-
-console.log('Ciclico: ' + (obj1.b.a == obj1));
-</pre>
-
-<p>Si una estructura cíclica es usada y se necesita el método <code>toSource()</code>, el objeto debe proveer la sobreescritura de <code>toSource()</code>, ya sea usando una referencia a un constructor o proveyendo una función anónima.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toSource()">Usando <code>toSource()</code></h3>
-
-<p>El código siguiente define el objeto tipo <code>Dog</code> y crea a <code>theDog</code>, un objeto tipo <code>Dog</code>:</p>
-
-<pre class="brush: js">function Dog(name, breed, color, sex) {
-  this.name = name;
-  this.breed = breed;
-  this.color = color;
-  this.sex = sex;
-}
-
-theDog = new Dog('Gabby', 'Lab', 'chocolate', 'female');
-</pre>
-
-<p>Llamando al método <code>toSource() de</code> <code>theDog</code> muestra el código JavaScript que define al objeto:</p>
-
-<pre class="brush: js">theDog.toSource();
-// returns ({name:"Gabby", breed:"Lab", color:"chocolate", sex:"female"})
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ningún estándar. Implementado en JavaScript 1.3.</p>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.Object.toSource")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/tostring/index.html b/files/es/web/javascript/referencia/objetos_globales/object/tostring/index.html
deleted file mode 100644
index a9ffc11535..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/tostring/index.html
+++ /dev/null
@@ -1,70 +0,0 @@
----
-title: Object.prototype.toString()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/toString
-tags:
-  - JavaScript
-  - Method
-  - Object
-  - Prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/toString
----
-<div>{{JSRef("Objetos_globales", "Object")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Devuelve una cadena que representa al objeto.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<p><code>toString() </code></p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Todos los objetos tienen un método <code>toString</code> que se llama automáticamente cuando el objeto se representa como un valor de texto o cuando un objeto se referencia de tal manera que se espera una cadena. Por defecto, el método <code>toString</code> es heredado por todos los objetos que descienden de <code>Object</code>. Si este método no se sobreescribe en el objeto personalizado, <code>toString</code> devuelve <code>{{ mediawiki.external('object<em>type</em> ') }}</code>, donde <code><em>type</em> </code> es el tipo de objeto. El siguiente código ilustra esto:</p>
-
-<pre class="brush: js">var objeto = new Object();
-objeto.toString(); // Devuelve [object Object]
-</pre>
-
-<h3 id="Examples" name="Examples">Ejemplos</h3>
-
-<h4 id="Sobreescribir_el_m.C3.A9todo_por_defecto_toString" name="Sobreescribir_el_m.C3.A9todo_por_defecto_toString">Sobreescribir el método por defecto <code>toString</code></h4>
-
-<p>Puede crear una función que sea llamada en lugar del método predeterminado <code>toString</code>. El método <code>toString</code> no toma argumentos y debería devolver una cadena. El método <code>toString</code> que cree puede ser cualquier valor que quiera, pero será más útil si aporta información sobre el objeto.</p>
-
-<p>El siguiente código define el tipo de objeto <code>Perro</code> y crea <code>elPerro</code>, un objeto de tipo <code>Perro</code>:</p>
-
-<pre class="brush: js">function Perro(nombre,criadero,color,sexo) {
-   this.nombre=nombre;
-   this.criadero=criadero;
-   this.color=color;
-   this.sexo=sexo;
-}
-
-elPerro = new Perro("Gabby","Laboratorio","chocolate","femenino")
-</pre>
-
-<p>Si llama al método <code>toString</code> en el objeto personalizado, devuelve el valor predeterminado heredado de <code>Object</code>:</p>
-
-<pre class="brush: js">elPerro.toString() //devuelve [object Object]
-</pre>
-
-<p>El siguiente código crea y asigna <code>perroToString</code> para sobreescribir el método predeterminado <code>toString</code>. Esta función genera una cadena que contiene nombre, criadero, color, y sexo del objeto, en la forma "<code>propiedad = valor;</code>".</p>
-
-<pre class="brush: js">Perro.prototype.toString = function perroToString() {
-  var retorno = "Perro " + this.nombre + " es " + this.sexo + " " + this.color + " " + this.criadero;
-  return retorno;
-}
-</pre>
-
-<p>Con el código precedente en su lugar, cualquier vez que se use <code>elDog</code> en un contexto de una cadena, JavaScript automáticamente llamará a la función <code>perroToString</code>, la cuál devuelve la siguiente cadena:</p>
-
-<pre>Perro Gabby es femenino chocolate Laboratorio
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toSource()")}}</li>
- <li>{{jsxref("Object.prototype.valueOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/valueof/index.html b/files/es/web/javascript/referencia/objetos_globales/object/valueof/index.html
deleted file mode 100644
index 5cf466078d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/valueof/index.html
+++ /dev/null
@@ -1,157 +0,0 @@
----
-title: Object.prototype.valueOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/valueOf
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/valueOf
----
-<div>{{JSRef("Global_Objects", "Object")}}</div>
-
-<p>El método <code><strong>valueOf()</strong></code> retorna el valor primitivo del objeto especificado.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>object</var>.valueOf()</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>El valor primitivo del objeto especificado.</p>
-
-<p> </p>
-
-<p>{{EmbedInteractiveExample("pages/js/object-prototype-valueof.html")}}</p>
-
-<p> </p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>JavaScript utiliza el método <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> para convertir un objeto a un valor primitivo. Raramente usted necesitará invocar el método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> por su cuenta; JavaScript lo realizará de forma automática cuando encuentre un objeto, donde un valor primitivo es esperado.</span></p>
-
-<p>Por defecto, el método <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> es heredado por cada objeto descendiente de </span>{{jsxref("Object")}}.<span style="line-height: 1.5;"> Cada objeto incorporado en el núcleo del lenguaje sobreescribe este método para retornar un valor apropiado. Si un objeto no tiene un valor primitivo, </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> devuelve el objeto en sí.</span></p>
-
-<p>Puede utilizar <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf </span><span style="line-height: 1.5;">dentro de su propio código para convertir un objeto incorporado en el núcleo del lenguaje en un valor primitivo. Cuando usted crea un objeto personalizado, puede sobreescribir el comportamiento de </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">Object.prototype.valueOf()</span><span style="line-height: 1.5;"> para invocar un método personalizado, en vez de utilizar el método por defecto </span><span style="line-height: 1.5;">{{jsxref("Object")}}.</span></p>
-
-<h3 id="Sobreescribiendo_valueOf_para_objetos_personalizados">Sobreescribiendo <code>valueOf</code> para objetos personalizados</h3>
-
-<p>Puede crear una función para ser invocada en lugar de utilizar el método <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> por defecto. Su función no debe contener ningún parámetro.</span></p>
-
-<p><span style="line-height: 1.5;">Suponga que tiene un objeto de tipo </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">myNumberType</span><span style="line-height: 1.5;"> y usted quiere crear un método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> para este. El código a continuación asigna una función personalizada al método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;">:</span></p>
-
-<pre class="brush: js">myNumberType.prototype.valueOf = function() { return customPrimitiveValue; };</pre>
-
-<p>Al tener el código anterior funcionando, cada vez que un objeto de tipo <span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">myNumberType</span><span style="line-height: 1.5;"> es utilizado en un contexto donde deba ser representado por un valor primitivo, JavaScript automáticamente invocará la función definida en el código anterior.</span></p>
-
-<p><span style="line-height: 1.5;">El método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;"> es invocado usualmente por JavaScript pero usted puede invocarlo directamente como sigue a continuación:</span></p>
-
-<pre class="brush: js">myNumber.valueOf()</pre>
-
-<div class="note">
-<p><strong>Nota: </strong>Objetos en contextos de string realizan la conversión a string a través del método <span style="line-height: 1.5;">{{jsxref("Object.toString", "toString()")}} </span><span style="line-height: 1.5;">, el cual, es diferente de </span><span style="line-height: 1.5;">{{jsxref("String")}}</span><span style="line-height: 1.5;"> para convertir objetos a primitivos string utilizando el método </span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">valueOf</span><span style="line-height: 1.5;">. Todos los objetos pueden ser convertidos a string, si solo "</span><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">[object </span><em>type</em><span style="font-family: 'Courier New','Andale Mono',monospace; line-height: 1.5;">]</span><span style="line-height: 1.5;">". Pero muchos objetos no se pueden convertir a number, boolean o function.</span></p>
-</div>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_valueOf" name="Example:_Using_valueOf">Utilizando <code>valueOf</code></h3>
-
-<pre class="brush: js">function myNumberType(n) {
-    this.number = n;
-}
-
-myNumberType.prototype.valueOf = function() {
-    return this.number;
-};
-
-myObj = new myNumberType(4);
-myObj + 3; // 7
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Commentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1ra Edición.</td>
-   <td>Estándar</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.2.4.4', 'Object.prototype.valueOf')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>
-    <p> </p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.prototype.valueof', 'Object.prototype.valueOf')}}</td>
-   <td>{{Spec2('ESDraft')}}   </td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Elemento</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Elemento</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toString()")}}</li>
- <li>{{jsxref("parseInt", "parseInt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/object/values/index.html b/files/es/web/javascript/referencia/objetos_globales/object/values/index.html
deleted file mode 100644
index 81b56ef1e0..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/object/values/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: Object.values()
-slug: Web/JavaScript/Referencia/Objetos_globales/Object/values
-tags:
-  - JavaScript
-  - Objeto
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Object/values
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Object.values()</strong></code><strong> </strong>devuelve un array con los valores correspondientes a las propiedades <strong>enumerables</strong> de un objeto. Las propiedades son devueltas en el mismo orden a como lo haría un bucle {{jsxref("Statements/for...in", "for...in")}} (la única diferencia es que un bucle <code>for-in</code> también enumera las propiedades en la cadena de prototipo de un objeto).</p>
-
-<p>{{EmbedInteractiveExample("pages/js/object-values.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">Object.values(<var>obj</var>)</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>obj</code></dt>
- <dd>Objeto cuyas propiedades enumerables serán devueltas.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un <code>array</code><strong> </strong>con las propiedades enumerables del objeto pasado como parámetro.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>Object.values()</code><strong> </strong>devuelve un array cuyos elementos son valores de propiedades enumarables que se encuentran en el objeto. El orden de las propiedades es el mismo que el dado cuando se recorre el objeto de forma manual.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">var obj = { foo: 'bar', baz: 42 };
-console.log(Object.values(obj)); // ['bar', 42]
-
-// array como objeto
-var obj = { 0: 'a', 1: 'b', 2: 'c' };
-console.log(Object.values(obj)); // ['a', 'b', 'c']
-
-// array como objeto con una ordenación aleatoria de las claves
-var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
-console.log(Object.values(an_obj)); // ['b', 'c', 'a']
-
-// getFoo no es una propiedade enumerable, por lo que como se observa, no se devuelve
-var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
-my_obj.foo = 'bar';
-console.log(Object.values(my_obj)); // ['bar']
-
-// parámetros que no son Objetos<strong> </strong>se fuerzan a que se comporten como tal
-console.log(Object.values('foo')); // ['f', 'o', 'o']
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Para dar soporte compatible con  <code>Object.values()</code> a entornos antiguos que no la soportan de forma nativa, puedes encontrar un Polyfill<strong> </strong>en <a href="https://github.com/tc39/proposal-object-values-entries">tc39/proposal-object-values-entries</a> o en los repositorios <a href="https://github.com/es-shims/Object.values">es-shims/Object.values</a>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object.values', 'Object.values')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES8', '#sec-object.values', 'Object.values')}}</td>
-   <td>{{Spec2('ES8')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{Compat("javascript.builtins.Object.values")}}</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/enumeracion_y_propietario_de_propiedades">Enumeración y propietarios de propiedades</a></li>
- <li>{{jsxref("Object.keys()")}}</li>
- <li>{{jsxref("Object.entries()")}}</li>
- <li>{{jsxref("Object.prototype.propertyIsEnumerable()")}}</li>
- <li>{{jsxref("Object.create()")}}</li>
- <li>{{jsxref("Object.getOwnPropertyNames()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/parsefloat/index.html b/files/es/web/javascript/referencia/objetos_globales/parsefloat/index.html
deleted file mode 100644
index 16510d882d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/parsefloat/index.html
+++ /dev/null
@@ -1,58 +0,0 @@
----
-title: parseFloat()
-slug: Web/JavaScript/Referencia/Objetos_globales/parseFloat
-translation_of: Web/JavaScript/Reference/Global_Objects/parseFloat
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Convierte (parsea) un argumento de tipo cadena y devuelve un número de punto flotante.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<p><code>parseFloat(<em>cadena</em> ) </code></p>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>cadena</code></dt>
- <dd>Una cadena que representa al valor que se desea convertir.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>parseFloat</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
-
-<p><code>parseFloat</code> convierte su argumento, una cadena, y devuelve un número de punto flotante. Si encuentra un carácter diferente al signo (+ o -), numerales (0-9), un punto decimal o un exponente, devuelve el valor hasta ese punto e ignora ese carácter y todos los correctos siguientes. Se permiten espacios anteriores y posteriores.</p>
-
-<p>Si el primer carácter no se puede convertir a número, <code>parseFloat</code> devuelve <code>NaN</code>.</p>
-
-<p>Para fines aritméticos, el valor <code>NaN</code> no es un número para ninguna base. Puede llamar a la función {{jsxref("isNaN")}} para determinar si el resultado de <code>parseFloat</code> es <code>NaN</code>. Si se pasa <code>NaN</code> en operaciones aritméticas, la operación resultante también será <code>NaN</code>.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_parseFloat_devolviendo_un_n.C3.BAmero" name="Ejemplo:_parseFloat_devolviendo_un_n.C3.BAmero">Ejemplo: <code>parseFloat</code> devolviendo un número</h3>
-
-<p>Todos los siguientes ejemplos devuelven 3.14.</p>
-
-<pre class="brush: js notranslate">parseFloat("3.14");
-parseFloat("314e-2");
-parseFloat("0.0314E+2"); v
-var cadena = "3.14"; parseFloat(cadena);
-parseFloat("3.14más caracteres no dígitos");</pre>
-
-<h3 id="Example_parseFloat_returning_NaN" name="Example:_parseFloat_returning_NaN">Example: <code>parseFloat</code> returning NaN</h3>
-
-<p>El siguiente ejemplo devuelve <code>NaN</code>:</p>
-
-<pre class="brush: js notranslate"><code>parseFloat("F</code><code>F2");</code></pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Objetos_globales/parseInt", "parseInt()")}}</li>
- <li>{{jsxref("Number.parseFloat()")}}</li>
- <li>{{jsxref("Number.parseInt()")}}</li>
- <li>{{jsxref("Objetos_globales/isNan", "isNaN()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/parseint/index.html b/files/es/web/javascript/referencia/objetos_globales/parseint/index.html
deleted file mode 100644
index 30e3874a34..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/parseint/index.html
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: parseInt()
-slug: Web/JavaScript/Referencia/Objetos_globales/parseInt
-translation_of: Web/JavaScript/Reference/Global_Objects/parseInt
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Convierte (parsea) un argumento de tipo cadena y devuelve un entero de la base especificada.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">parseInt(<em>string</em>, <em>base</em>);</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>cadena</code></dt>
- <dd>Una cadena que representa el valor que se desea convertir.</dd>
-</dl>
-
-<dl>
- <dt><code>base</code></dt>
- <dd>Un entero que representa la base de la mencionada cadena.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>parseInt</code> es una función de alto nivel y no está asociada a ningún objeto.</p>
-
-<p>La función <code>parseInt</code> comprueba el primer argumento, una cadena, e intenta devolver un entero de la base especificada. Por ejemplo, una base de 10 indica una conversión a número decimal, 8 octal, 16 hexadecimal, y así sucesivamente. Para bases superiores a 10, las letras del alfabeto indican numerales mayores que 9. Por ejemplo, para números hexadecimales (base 16), se utiliza de la A hasta la F.</p>
-
-<p>Si <code>parseInt</code> encuentra un carácter que no es un numeral de la base especificada, lo ignora a él y a todos los caracteres correctos siguientes, devolviendo el valor entero obtenido hasta ese punto. <code>parseInt</code> trunca los números en valores enteros. Se permiten espacios anteriores y posteriores.</p>
-
-<p>Si no se especifica la base o se especifica como 0, JavaScript asume lo siguiente:</p>
-
-<ul>
- <li>Si el parámetro <code>cadena</code> comienza por "0x", la base es 16 (hexadecimal).</li>
- <li>Si el parámetro <code>cadena</code> comienza por "0", la base es de 8 (octal). Esta característica está desaconsejada.</li>
- <li>Si el parámetro <code>cadena</code> comienza por cualquier otro valor, la base es 10 (decimal).</li>
-</ul>
-
-<p>Si el primer carácter no se puede convertir en número, <code>parseInt</code> devuelve <code>NaN</code>.</p>
-
-<p>Para fines aritméticos, el valor <code>NaN</code> no es un número en ninguna base. Puede llamar a la función {{jsxref("Objetos_globales/isNaN", "isNaN")}} para determinar se el resultado de <code>parseInt</code> es <code>NaN</code>. Si se pasa <code>NaN</code> en operaciones aritméticas, la operación resultante también será <code>NaN</code>.</p>
-
-<p>Para convertir números a su literal cadena en una base en particular, utilice <code>intValue.toString(base)</code>.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_parseInt" name="Ejemplo:_Usando_parseInt">Ejemplo: Usando <code>parseInt</code></h3>
-
-<p>Todos los siguientes ejemplos devuelven 15:</p>
-
-<pre class="brush: js">parseInt("F", 16);
-parseInt("17", 8);
-parseInt("15", 10);
-parseInt(15.99, 10);
-parseInt("FXX123", 16);
-parseInt("1111", 2);
-parseInt("15*3", 10);
-parseInt("12", 13);
-</pre>
-
-<p>Todos los siguientes ejemplos devuelven <code>NaN</code>:</p>
-
-<pre class="brush: js">parseInt("Hello", 8); // No es un número en absoluto
-parseInt("0x7", 10);  // No es de base 10
-parseInt("546", 2);   // Los dígitos no son válidos para representaciones binarias.
-</pre>
-
-<p>Incluso aunque la base especificada es diferente, todos los siguientes ejemplos devuelven 17 ya que el argumento <code>cadena</code> comienza por "<code>0x</code>".</p>
-
-<pre class="brush: js">parseInt("0x11", 16);
-parseInt("0x11", 0);
-parseInt("0x11");
-</pre>
-
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Véase También</h3>
-
-<ul>
- <li>{{jsxref("Objetos_globales/parseFloat", "parseFloat()")}}</li>
- <li>{{jsxref("Number.parseFloat()")}}</li>
- <li>{{jsxref("Number.parseInt()")}}</li>
- <li>{{jsxref("Objetos_globales/isNaN", "isNaN()")}}</li>
- <li>{{jsxref("Number.toString()")}}</li>
- <li>{{jsxref("Object.valueOf")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/all/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/all/index.html
deleted file mode 100644
index 79a16aadc6..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/all/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: Promise.all()
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/all
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Método(2)
-  - Promesa
-  - Promise
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Promise.all(iterable)</strong></code> devuelve una promesa que termina correctamente cuando todas las promesas en el argumento iterable han sido concluídas con éxito, o bien rechaza la petición con el motivo pasado por la primera promesa que es rechazada.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>Promise.all(iterable)</var>;</pre>
-
-<dl>
- <dt>iterable</dt>
- <dd>Un objeto iterable, por ejemplo un {{jsxref("Array")}}. Vea <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable</a>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una {{jsxref("Promise")}}  que se cumplirá cuando todas las promesas del argumento iterable hayan sido cumplidas, o bien se rechazará cuando alguna de ellas se rechace.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><strong><code>Promise.all</code> </strong> se cumple cuando todas las promesas del iterable dado se han cumplido, o es rechazada si alguna promesa no se cumple. {{jsxref("Promise.resolve")}}.</p>
-
-<p>Si alguna de las promesas pasadas en el argumento iterable falla, la promesa <code>all</code> es rechazada inmediatamente con el valor de la promesa que fué rechazada, descartando todas las demás promesas hayan sido o no cumplidas. Si se pasa un array vacío a <code>all</code> , la promesa se cumple inmediatamente.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_de_Promise.all">Uso de <code>Promise.all</code></h3>
-
-<p><code>Promise.all</code> espera a que todo se cumpla (o bien al primer rechazo).</p>
-
-<pre class="brush: js">var p1 = Promise.resolve(3);
-var p2 = 1337;
-var p3 = new Promise((resolve, reject) =&gt; {
-  setTimeout(resolve, 100, "foo");
-});
-
-Promise.all([p1, p2, p3]).then(values =&gt; {
-  console.log(values); // [3, 1337, "foo"]
-});</pre>
-
-<h3 id="Promise.all_comportamiento_de_fallo-rápido"><code>Promise.all</code> comportamiento de fallo-rápido</h3>
-
-<p><code>Promise.all</code> se rechaza si uno de los elementos ha sido rechazado y <code>Promise.all</code> falla rápido: Si tienes cuatro promesas que se resuelven después de un timeout y una de ellas falla inmediatamente, entonces <code>Promise.all</code> se rechaza inmediatamente.</p>
-
-<pre class="brush: js">var p1 = new Promise((resolve, reject) =&gt; {
-  setTimeout(resolve, 1000, "one");
-});
-var p2 = new Promise((resolve, reject) =&gt; {
-  setTimeout(resolve, 2000, "two");
-});
-var p3 = new Promise((resolve, reject) =&gt; {
-  setTimeout(resolve, 3000, "three");
-});
-var p4 = new Promise((resolve, reject) =&gt; {
-  setTimeout(resolve, 4000, "four");
-});
-var p5 = new Promise((resolve, reject) =&gt; {
-  reject("reject");
-});
-
-Promise.all([p1, p2, p3, p4, p5]).then(values =&gt; {
-  console.log(values);
-}, reason =&gt; {
-  console.log(reason)
-});
-
-//From console:
-//"reject"
-
-// Evenly, it's possible to use .catch
-Promise.all([p1, p2, p3, p4, p5]).then(values =&gt; {
-  console.log(values);
-}).catch(reason =&gt; {
-  console.log(reason)
-});
-
-//From console:
-//"reject"
-
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-promise.all', 'Promise.all')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition in an ECMA standard.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.all', 'Promise.all')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{Compat("javascript/promise","Promise.all")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
- <li>{{jsxref("Promise.race()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/catch/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/catch/index.html
deleted file mode 100644
index a99a071979..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/catch/index.html
+++ /dev/null
@@ -1,183 +0,0 @@
----
-title: Promise.prototype.catch()
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/catch
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong>catch()</strong> retorna una <code>Promise</code> y solo se ejecuta en los casos en los que la promesa se marca como <code>Reject</code>. Se comporta igual que al llamar {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}} (de hecho, al llamar <code>obj.catch(onRejected)</code> internamente llama a <code>obj.then(undefined, onRejected)</code>).</p>
-
-<h2 id="Síntaxis">Síntaxis</h2>
-
-<pre class="syntaxbox"><var>p.catch(onRejected)</var>;
-
-p.catch(function(reason) {
-   // rejection
-});
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>onRejected</dt>
- <dd>Una {{jsxref("Function")}} llamada cuando la <code>Promise</code> es rechazada. Esta función tiene un argumento:
- <dl>
-  <dt><code>reason</code></dt>
-  <dd>La razón del rechazo.</dd>
- </dl>
- La promesa devuelta por <code>catch()</code> es rechazada si <code>onRejected</code> lanza un error o retorna una <code>Promise</code> que a su vez se rechaza, de cualquier otra manera la <code>Promise</code> es resuelta.</dd>
-</dl>
-
-<h3 id="Valor_de_Retorno_(Return)">Valor de Retorno (Return)</h3>
-
-<p>Internamente llama a <code>Promise.prototype.then</code> en el objeto sobre el que se llama, pasándole el parámetro <code>undefined</code> y el manejador <code>onRejected</code> recibido; luego devuelve un valor de esa llamada (que es una {{jsxref("Promise")}}).</p>
-
-<p><strong>Demostración de la llamada interna:</strong></p>
-
-<pre class="brush: js">// overriding original Promise.prototype.then/catch just to add some logs
-(function(Promise){
-    var originalThen = Promise.prototype.then;
-    var originalCatch = Promise.prototype.catch;
-
-    Promise.prototype.then = function(){
-        console.log('&gt; &gt; &gt; &gt; &gt; &gt; called .then on %o with arguments: %o', this, arguments);
-        return originalThen.apply(this, arguments);
-    };
-    Promise.prototype.catch = function(){
-        console.log('&gt; &gt; &gt; &gt; &gt; &gt; called .catch on %o with arguments: %o', this, arguments);
-        return originalCatch.apply(this, arguments);
-    };
-
-})(this.Promise);
-
-
-
-// calling catch on an already resolved promise
-Promise.resolve().catch(function XXX(){});
-
-// logs:
-// &gt; &gt; &gt; &gt; &gt; &gt; called .catch on Promise{} with arguments: Arguments{1} [0: function XXX()]
-// &gt; &gt; &gt; &gt; &gt; &gt; called .then on Promise{} with arguments: Arguments{2} [0: undefined, 1: function XXX()]
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>catch</code> puede ser muy útil para el manejo de errores en tu código con promesas.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_y_encadenando_el_método_catch">Usando y encadenando el método <code>catch</code></h3>
-
-<pre class="brush: js">var p1 = new Promise(function(resolve, reject) {
-  resolve('Success');
-});
-
-p1.then(function(value) {
-  console.log(value); // "Success!"
-  throw 'oh, no!';
-}).catch(function(e) {
-  console.log(e); // "oh, no!"
-}).then(function(){
-  console.log('after a catch the chain is restored');
-}, function () {
-  console.log('Not fired due to the catch');
-});
-
-// The following behaves the same as above
-p1.then(function(value) {
-  console.log(value); // "Success!"
-  return Promise.reject('oh, no!');
-}).catch(function(e) {
-  console.log(e); // "oh, no!"
-}).then(function(){
-  console.log('after a catch the chain is restored');
-}, function () {
-  console.log('Not fired due to the catch');
-});
-</pre>
-
-<h3 id="Trucos_cuando_lanzamos_errores">Trucos cuando lanzamos errores</h3>
-
-<pre class="brush: js">// Hacer un throw llamará al método catch
-var p1 = new Promise(function(resolve, reject) {
-  throw 'Uh-oh!';
-});
-
-p1.catch(function(e) {
-  console.log(e); // "Uh-oh!"
-});
-
-// Los errores que se lancen dentro de funciones asíncronas actuarán como errores no capturados
-var p2 = new Promise(function(resolve, reject) {
-  setTimeout(function() {
-    throw 'Uncaught Exception!';
-  }, 1000);
-});
-
-p2.catch(function(e) {
-  console.log(e); // Nunca será llamado
-});
-
-// Errores lanzados después de resolve() serán omitidos
-var p3 = new Promise(function(resolve, reject) {
-  resolve();
-  throw 'Silenced Exception!';
-});
-
-p3.catch(function(e) {
-   console.log(e); // Nunca será llamado
-});</pre>
-
-<h3 id="Si_se_resuelve_la_promesa">Si se resuelve la promesa</h3>
-
-<pre class="brush: js">// Crea una promesa que no llamará a <code>onReject</code>
-var p1 = Promise.resolve("calling next");
-
-var p2 = p1.catch(function (reason) {
-    // Nunca será llamado
-    console.log("catch p1!");
-    console.log(reason);
-});
-
-p2.then(function (value) {
-    console.log("next promise's onFulfilled"); /* next promise's onFulfilled */
-    console.log(value); /* calling next */
-}, function (reason) {
-    console.log("next promise's onRejected");
-    console.log(reason);
-});</pre>
-
-<h2 id="Especificación">Especificación</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial en el standar ECMA.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
-
-<p>{{Compat("javascript.builtins.promise.catch")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
- <li>{{jsxref("Promise.prototype.then()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/finally/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/finally/index.html
deleted file mode 100644
index 8d21aa785a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/finally/index.html
+++ /dev/null
@@ -1,95 +0,0 @@
----
-title: Promise.prototype.finally()
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/finally
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>finally()</strong></code> devuelve una {{jsxref("Promise")}}. Cuando la promesa se resuelve, sea exitosa o rechazada, la función de callback específicada será ejecutada. Esto ofrece una forma de ejecutar código sin importar como se haya resuelto la promesa.</p>
-
-<p>Esto ayuda a evitar tener código duplicado tanto en el {{jsxref("Promise.then", "then()")}} como en el {{jsxref("Promise.catch", "catch()")}}.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>p.finally(alFinalizar)</var>;
-
-p.finally(function() {
-   // finalizada (exitosa o rechazada)
-});
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>alFinalizar</code></dt>
- <dd>Una {{jsxref("Function")}} llamada cuando la <code>Promise</code> se resuelve con éxito o falla.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Devuelve una {{jsxref("Promise")}} cuyo <code>finally</code> fue fijado a la función específicada en <code>alFinalizar</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>finally()</code> puede ser de utilidad si quieres hacer algún proceso o limpieza una vez que la promesa termina, sin importar su resultado.</p>
-
-<p>Utilizar <code>finally()</code> es muy similar a llamar <code>.then(onFinally, onFinally)</code>, sin embargo tiene algunas diferencias:</p>
-
-<ul>
- <li>Cuando usamos una función <code>inline</code>, se la puede pasar una sola vez, en vez de estar forzado a declararla dos veces, o guardarla en una variable.</li>
- <li>Un callback <code>finally</code> no recibe ningún argumento, ya que no hay una manera fehaciente de determinar si la promesa fue exitosa o fallida. Este caso de uso es precisamente para cuando <em>no nos importa</em> la razón por la que falló o el valor al que resuelve, y no hay necesidad de proveerlos.</li>
- <li>A diferencia de <code>Promise.resolve(2).then(() =&gt; {}, () =&gt; {})</code> (que va a resolver a <code>undefined</code>), <code>Promise.resolve(2).finally(() =&gt; {})</code> resolverá con un <code>2</code>.</li>
- <li>Del mismo modo, a diferencia de <code>Promise.reject(3).then(() =&gt; {}, () =&gt; {})</code> (que resolverá con <code>undefined</code>), <code>Promise.reject(3).finally(() =&gt; {})</code> será rechazada con un <code>3</code>.</li>
-</ul>
-
-<div class="note">
-<p><strong>Nota:</strong> Un <code>throw</code> (o retornar una promesa rechazada) en el callback <code>finally</code> va a rechazar la nueva promesa con la razón de rechazo especificada al llamar <code>throw()</code>.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">let isLoading = true;
-
-fetch(myRequest).then(function(response) {
-    var contentType = response.headers.get("content-type");
-    if(contentType &amp;&amp; contentType.includes("application/json")) {
-      return response.json();
-    }
-    throw new TypeError("Oops, no hemos obtenido un JSON!");
-  })
-  .then(function(json) { /* procesar el JSON */ })
-  .catch(function(error) { console.log(error); /* esta línea podría arrojar error, e.g. cuando console = {} */ })
-  .finally(function() { isLoading = false; });
-
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.prototype.finally', 'Promise.prototype.finally')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegador">Compatibilidad en navegador</h2>
-
-<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
-
-<p>{{Compat("javascript.builtins.Promise.finally")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
- <li>{{jsxref("Promise.prototype.then()")}}</li>
- <li>{{jsxref("Promise.prototype.catch()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/index.html
deleted file mode 100644
index 58a2319c2f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/index.html
+++ /dev/null
@@ -1,222 +0,0 @@
----
-title: Promise
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Promesa
-  - Promise
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>Promise</code></strong> (Promesa) es usado para computaciones asíncronas. Una promesa representa un valor que puede estar disponible ahora, en el futuro, o nunca.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">new Promise( /* ejecutor */ function(resolver, rechazar) { ... } );</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>ejecutor</dt>
- <dd>Una función con los argumentos <code>resolver</code> y <code>rechazar</code>. La función <code>ejecutor</code> es ejecutada inmediatamente por la implementación de la Promesa, pasándole las funciones <code>resolver</code> y <code>rechazar</code> (el ejecutor es llamado incluso antes de que el constructor de la <code>Promesa</code> devuelva el objeto creado). Las funciones <code>resolver</code> y <code>rechazar</code>, al ser llamadas, resuelven o rechazan la promesa, respectivamente. Normalmente el ejecutor inicia un trabajo asíncrono, y luego, una vez que es completado, llama a la función <code>resolver</code> para resolver la promesa o la rechaza si ha ocurrido un error.<br>
- Si un error es lanzado en la función ejecutor, la promesa es rechazada y el valor de retorno del ejecutor es rechazado.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Una <strong>Promesa</strong> es un proxy para un valor no necesariamente conocido en el momento que es creada la promesa. Permite asociar manejadores que actuarán asincrónicamente sobre un eventual valor en caso de éxito, o la razón de falla en caso de una falla. Esto permite que métodos asíncronos devuelvan valores como si fueran síncronos: en vez de inmediatamente retornar el valor final, el método asíncrono devuelve una <em>promesa</em> de suministrar el valor en algún momento en el futuro.</p>
-
-<p>Una <code>Promesa</code> se encuentra en uno de los siguientes estados:</p>
-
-<ul>
- <li><em>pendiente (pending)</em>: estado inicial, no cumplida o rechazada.</li>
- <li><em>cumplida (fulfilled)</em>: significa que la operación se completó satisfactoriamente.</li>
- <li><em>rechazada (rejected)</em>: significa que la operación falló.</li>
-</ul>
-
-<p>Una promesa pendiente puede ser <em>cumplida</em> con un valor, o <em>rechazada</em> con una razón (error). Cuando cualquiera de estas dos opciones sucede, los métodos asociados, encolados por el método <em>then</em> de la promesa, son llamados. (Si la promesa ya ha sido cumplida o rechazada en el momento que es anexado su correspondiente manejador, el manejador será llamado, de tal manera que no exista una condición de carrera entre la operación asíncrona siendo completada y los manejadores siendo anexados)</p>
-
-<p>Como los métodos <code>{{jsxref("Promise.then", "Promise.prototype.then()")}}</code> y <code>{{jsxref("Promise.catch", "Promise.prototype.catch()")}}</code> retornan promesas, éstas pueden ser encadenadas.</p>
-
-<p><img alt="" src="https://mdn.mozillademos.org/files/8633/promises.png"></p>
-
-<div class="note">
-<p><strong>No confundir con:</strong> Varios lenguajes tienen mecanismos para evaluar perezosamente y postergar una computación, a los que también les llaman "promesas" - p.ej.: Scheme. Las promesas en JavaScript representan procesos que ya están sucediendo, y pueden ser encadenados con funciones callback. Si lo que se busca es evaluar perezosamente una expresión, se debe considerar la función <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">flecha </a> (arrow function) sin argumentos: <code>f = () =&gt; <em>expresión</em></code> para crear la expresión evaluada perezosamente, y <code>f()</code> para evaluar.</p>
-</div>
-
-<div class="note" id="settledNote">
-<p><strong>Nota</strong>: Una promesa se dice que está <em>determinada (settled)</em> si se ha cumplido o si se ha rechazado, pero no está pendiente. Con promesas también se usa el término <em>resuelta</em> — esto significa que la promesa está determinada, o que se encuentra bloqueada dentro de una cadena de promesas. <a href="https://github.com/domenic/promises-unwrapping/blob/master/docs/states-and-fates.md">States and fates</a> de Domenic Denicola contiene mas detalles sobre la terminología de las promesas.</p>
-</div>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>Promise.length</code></dt>
- <dd>Propiedad longitud cuyo valor es siempre 1 (numero de argumentos del constructor).</dd>
- <dt>{{jsxref("Promise.prototype")}}</dt>
- <dd>Representa el prototipo del constructor <code>Promise</code>.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Promise.all", "Promise.all(iterable)")}}</dt>
- <dd>Devuelve una de dos promesas: una que se cumple cuando todas las promesas en el argumento iterable han sido cumplidas, o una que se rechaza tan pronto como una de las promesas del argumento iterable es rechazada. Si la promesa retornada es cumplida, lo hace con un arreglo de los valores de las promesas cumplidas en el mismo orden definido en el iterable. Si la promesa retornada es rechazada, es rechazada con la razón de la primera promesa rechazada en el iterable. Este método puede ser útil para agregar resultados de múltiples promesas</dd>
- <dt>{{jsxref("Promise.race", "Promise.race(iterable)")}}</dt>
- <dd>Devuelve una promesa que se cumple o rechaza tan pronto como una de las promesas del iterable se cumple o rechaza, con el valor o razón de esa promesa.</dd>
-</dl>
-
-<dl>
- <dt>{{jsxref("Promise.reject", "Promise.reject(reason)")}}</dt>
- <dd>Devuelve un objeto <code>Promise</code> que es rechazado con la razón dada.</dd>
-</dl>
-
-<dl>
- <dt>{{jsxref("Promise.resolve", "Promise.resolve(value)")}}</dt>
- <dd>Devuelve un objeto <code>Promise</code> que es resuelto con el valor dado. Si el valor es un <em>thenable</em> (p.ej. tiene un método <code>then</code>), la promesa devuelta "seguirá" este thenable, adoptando su eventual estado; de lo contrario la promesa devuelta será cumplida con el valor. Generalmente, si se quiere saber si un valor es una promesa o no, se podría usar - {{jsxref("Promise.resolve", "Promise.resolve(value)")}} y trabajar con el valor devuelto como una promesa.</dd>
-</dl>
-
-<h2 id="Prototipo_Promise">Prototipo <code>Promise</code></h2>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Properties')}}</p>
-
-<h3 id="Métodos_2">Métodos</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Promise/prototype','Methods')}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Súper_simple_¡10_líneas!">Súper simple (¡10 líneas!)</h3>
-
-<pre class="brush: js notranslate"><code>let miPrimeraPromise = new Promise((resolve, reject) =&gt; {
-  // Llamamos a resolve(...) cuando lo que estabamos haciendo finaliza con éxito, y reject(...) cuando falla.
-  // En este ejemplo, usamos setTimeout(...) para simular código asíncrono.
-  // En la vida real, probablemente uses algo como XHR o una API HTML5.
-  setTimeout(function(){
-    resolve("¡Éxito!"); // ¡Todo salió bien!
-  }, 250);
-});
-
-miPrimeraPromise.then((successMessage) =&gt; {
-  // succesMessage es lo que sea que pasamos en la función resolve(...) de arriba.
-  // No tiene por qué ser un string, pero si solo es un mensaje de éxito, probablemente lo sea.
-  console.log("¡Sí! " + successMessage);
-});</code></pre>
-
-<h3 id="Creando_una_Promise">Creando una Promise</h3>
-
-<p>Este pequeño ejemplo muestra el mecanismo de una <code>Promise</code>. El método <code>testPromise()</code> se llama cada vez que se pulsa el {{HTMLElement("button")}}. Esto crea una promesa que se cumplirá, aplicando {{domxref("window.setTimeout()")}}, al contador de la promesa (partiendo desde 1) aleatoriamente cada 1-3 segundos. El constructor de la Promise() es usado para crear dicha promesa.</p>
-
-<p>El cumplimiento de la promesa simplemente se registra, a través de una llamada de retorno al cumplirse utilizando {{jsxref("Promise.prototype.then()","p1.then()")}}. A los pocos registros muestra cómo la parte síncrona del método se desacopla de la finalización asíncrona de la promesa.</p>
-
-<pre class="brush: js notranslate">'use strict';
-var promiseCount = 0;
-
-function testPromise() {
-  var thisPromiseCount = ++promiseCount;
-
-  var log = document.getElementById('log');
-  log.insertAdjacentHTML('beforeend', thisPromiseCount +
-    ') Comenzó (&lt;small&gt;Comenzó el código sincrónico&lt;/small&gt;)&lt;br/&gt;');
-
-  // Hacemos una promesa: prometemos un contador numérico de esta promesa,
-  // empezando por 1 (después de esperar 3s)
-  var p1 = new Promise(
-    // La función resolvedora es llamada con la
-    // habilidad de resolver o rechazar la promesa
-    function(resolve, reject) {
-      log.insertAdjacentHTML('beforeend', thisPromiseCount +
-        ') Comenzó la promesa (&lt;small&gt;Código asíncrono comenzó&lt;/small&gt;)&lt;br/&gt;');
-
-      // Esto es solo un ejemplo para crear asincronismo
-      window.setTimeout(
-        function() {
-          // ¡Cumplimos la promesa!
-          resolve(thisPromiseCount);
-        }, Math.random() * 2000 + 1000);
-    }
-  );
-
-  // Definimos qué hacer cuando la promesa es resuelta/cumplida con la llamada
-  // al método then(). La llamada al método catch() define qué hacer si
-  // la promesa es rechazada
-  p1.then(
-    // Registrar el valor de la promesa cumplida
-    function(val) {
-      log.insertAdjacentHTML('beforeend', val +
-        ') Promesa cumplida (&lt;small&gt;Código asíncrono terminado.&lt;/small&gt;)&lt;br/&gt;');
-    })
-  .catch(
-    // Registrar la razón del rechazo
-    function(reason) {
-      console.log('Manejar promesa rechazada ('+reason+') aquí.');
-    });
-
-  log.insertAdjacentHTML('beforeend', thisPromiseCount +
-    ') Promesa hecha (&lt;small&gt;Código síncrono terminado. &lt;/small&gt;)&lt;br/&gt;');
-}
-</pre>
-
-<pre class="brush:js hidden notranslate">if ("Promise" in window) {
-  var btn = document.getElementById("btn");
-  btn.addEventListener("click",testPromise);
-} else {
-  log = document.getElementById('log');
-  log.innerHTML = "El ejemplo en vivo no está disponible ya que tu navegador no soporta la interfaz &lt;code&gt;Promise&lt;code&gt;.";
-}
-</pre>
-
-<p>Este ejemplo es ejecutado cuando pulsas el botón. Necesitas un navegador que soporte <code>Promise</code>. Al pulsar el botón varias veces en un período corto de tiempo, verás las diferentes promesas siendo cumplidas una tras otra.</p>
-
-<p>{{EmbedLiveSample("Creando_una_Promise", "500", "200")}}</p>
-
-<h2 id="Cargando_una_imagen_con_XHR">Cargando una imagen con XHR</h2>
-
-<p>Otro ejemplo sencillo utilizando <code>Promise</code> y <code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> para cargar una imagen está disponible en el repositorio <a href="https://github.com/mdn/js-examples/tree/master/promises-test">js-examples</a> de MDN en GitHub. También puedes <a href="https://mdn.github.io/js-examples/promises-test/">verlo en acción</a>. Cada paso está comentado y te permite seguir de cerca la arquitectura detrás de las Promesas y XHR.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-promise-objects', 'Promise')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition in an ECMA standard.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise-objects', 'Promise')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">To contribute to this compatibility data, please write a pull request against this file: <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json">https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json</a>.</p>
-
-<p>{{Compat("javascript/promise")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="http://promisesaplus.com/">Promises/A+ specification</a></li>
- <li><a href="https://medium.com/@ramsunvtech/promises-of-promise-part-1-53f769245a53">Venkatraman.R - JS Promise (Part 1, Basics)</a></li>
- <li><a href="https://medium.com/@ramsunvtech/js-promise-part-2-q-js-when-js-and-rsvp-js-af596232525c#.dzlqh6ski">Venkatraman.R - JS Promise (Part 2 - Using Q.js, When.js and RSVP.js)</a></li>
- <li><a href="http://www.html5rocks.com/en/tutorials/es6/promises/">Jake Archibald: JavaScript Promises: There and Back Again</a></li>
- <li><a href="http://de.slideshare.net/domenicdenicola/callbacks-promises-and-coroutines-oh-my-the-evolution-of-asynchronicity-in-javascript">Domenic Denicola: Callbacks, Promises, and Coroutines – Asynchronous Programming Patterns in JavaScript</a></li>
- <li><a href="http://www.mattgreer.org/articles/promises-in-wicked-detail/">Matt Greer: JavaScript Promises ... In Wicked Detail</a></li>
- <li><a href="https://www.promisejs.org/">Forbes Lindesay: promisejs.org</a></li>
- <li><a href="http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html">Nolan Lawson: We have a problem with promises — Common mistakes with promises</a></li>
- <li><a href="https://github.com/jakearchibald/es6-promise/">Promise polyfill</a></li>
- <li><a href="https://www.udacity.com/course/javascript-promises--ud898">Udacity: JavaScript Promises</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/prototype/index.html
deleted file mode 100644
index c15107912a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/prototype/index.html
+++ /dev/null
@@ -1,69 +0,0 @@
----
-title: Promise.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/prototype
-tags:
-  - JavaScript
-  - Promesa
-  - Propiedad
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise
-translation_of_original: Web/JavaScript/Reference/Global_Objects/Promise/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>Promise.prototype</strong></code> representa el prototipo del constructor de {{jsxref("Promise")}}</p>
-
-<div>{{js_property_attributes(0,0,0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las instancias de {{jsxref("Promise")}} heredan de {{jsxref("Promise.prototype")}}. Se puede usar el objeto prototipo del constructor para agregar propiedades o métodos a todas las instancias de <code>Promise</code>.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>Promise.prototype.constructor</code></dt>
- <dd>Retorna la función que creó el prototipo de una instancia. Esta es la función por defecto de {{jsxref("Promise")}}.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Promise.catch", "Promise.prototype.catch(alRechazarse)")}}</dt>
- <dd>Anexa a la promesa un callback manejador de rechazo, y retorna una nueva promesa que resuelve al valor de retorno del callback si es llamado, o de lo contrario a su valor de cumplimiento original si la promesa es cumplida.</dd>
- <dt>{{jsxref("Promise.then", "Promise.prototype.then(alCumplirse, alRechazarse)")}}</dt>
- <dd>Anexa a la promesa manejadores de cumplimiento y rechazo, y retorna una nueva promesa que resuelve al valor de retorno del manejador llamado, o a su valor de <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise#settledNote">determinación (settled)</a> original si la promesa no fue manejada (p.ej. si el manejador relevante <code>alCumplirse</code> o <code>alRechazarse</code> no es una función).</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-promise.prototype', 'Promise.prototype')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.prototype', 'Promise.prototype')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">To contribute to this compatibility data, please write a pull request against this file: <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json">https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json</a>.</p>
-
-<p>{{Compat("javascript/promise","Promise.prototype")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/race/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/race/index.html
deleted file mode 100644
index f24be82a9c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/race/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: Promise.race()
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/race
-tags:
-  - ECMAScript2015
-  - ECMAScript6
-  - JavaScript
-  - Promesa
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Promise.race(iterable)</strong></code> retorna una promesa que se cumplirá o no tan pronto como una de las promesas del argumento iterable se cumpla o se rechace, con el valor o razón de rechazo de ésta.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>Promise.race(iterable)</var>;</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>iterable</dt>
- <dd>Un objeto iterable , como por ejemplo un {{jsxref("Array")}}. Vea <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable</a>.</dd>
-</dl>
-
-<h3 id="Retorna">Retorna</h3>
-
-<p>Una {{jsxref("Promise")}} que se cumple o se rechaza tan pronto como una de las promesas dadas en el argumento iterable se cumple o se rechaza.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La función <code>race</code> retorna una <code>Promise</code> que se comporta como tal. Se cumple o se rechaza, lo que suceda antes en alguno de sus argumentos (iterable).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Promise.race_–_ejemplos_con_setTimeout">Usando <code>Promise.race</code> – ejemplos con <code>setTimeout</code></h3>
-
-<pre class="brush: js">var p1 = new Promise( (resolve, reject) =&gt; {
-    setTimeout(resolve, 500, "uno");
-});
-var p2 = new Promise( (resolve, reject) =&gt; {
-    setTimeout(resolve, 100, "dos");
-});
-
-Promise.race([p1, p2]).then( value =&gt; {
-  console.log(value); // "dos"
-  // Ambas se resuelven, pero la p2 antes.
-});
-
-  // Ejemplo con un resolve y un reject en el mismo método race.
-var p3 = new Promise( (resolve, reject) =&gt; {
-    setTimeout(resolve, 100, "tres");
-});
-var p4 = new Promise( (resolve, reject) =&gt; {
-    setTimeout(reject, 500, "cuatro");
-});
-
-Promise.race([p3, p4]).then( value =&gt; {
-  console.log(value); // "tres"
-  // p3 es mas rápida, así que se resuelve el race
-}, reason =&gt; {
-  // No es llamado
-});
-
-var p5 = new Promise( (resolve, reject) =&gt; {
-    setTimeout(resolve, 500, "cinoc");
-});
-var p6 = new Promise( (resolve, reject) =&gt; {
-    setTimeout(reject, 100, "seis");
-});
-
-Promise.race([p5, p6]).then( value =&gt; {
-  // No es llamado
-}, reason =&gt; {
-  console.log(reason); // "seis"
-  // p6 es mas rápida, así que se rechaza
-});
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentar</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-promise.race', 'Promise.race')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition in an ECMA standard.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{Compat}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
- <li>{{jsxref("Promise.all()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/reject/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/reject/index.html
deleted file mode 100644
index 70505d7471..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/reject/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: Promise.reject()
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/reject
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Promise.reject(reason)</strong></code> retorna un objeto <code>Promise</code> que es rechazado por la razón específicada.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/promise-reject.html")}}</div>
-
-<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
-
-<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
-
-<p class="hidden"><span class="tlid-translation translation" lang="es"><span title="">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub.</span> <span title="">Si desea contribuir al proyecto de ejemplos interactivos, clone https://github.com/mdn/interactive-examples y envíenos una solicitud de extracción.</span></span></p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>Promise.reject(reason)</var>;</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>reason</dt>
- <dd>Razón por la cual esta {jsxref("Promise")}} fue rechazada.</dd>
-</dl>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>Un objeto {{jsxref("Promise")}} que es rechazado por la razón específicada.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La función estática <code>Promise.reject</code> retorna un objecto {{jsxref("Promise")}} que es rechazado. Para fines de depuración y captura selectiva de error, se suele pasar por el parámetro <code>reason</code> un  <code>instanceof</code> {{jsxref("Error")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_estático_Promise.reject">Usando el método estático Promise.reject()</h3>
-
-<pre class="brush: js">Promise.reject(new Error('fail')).then(function() {
-  // no entra en esta función
-}, function(error) {
-  console.log(error); // Stacktrace
-});</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-promise.reject', 'Promise.reject')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition in an ECMA standard.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.reject', 'Promise.reject')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
-
-<p>{{Compat("javascript.builtins.Promise.reject")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
- <li><a href="https://github.com/petkaantonov/bluebird#error-handling">Selective error catching using the BlueBird Promise library</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/resolve/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/resolve/index.html
deleted file mode 100644
index e91dc7b80d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/resolve/index.html
+++ /dev/null
@@ -1,150 +0,0 @@
----
-title: Promise.resolve()
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/resolve
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Promise
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Promise.resolve(value)</strong></code> retorna un objeto {{jsxref("Promise")}} que es resuelto con el valor dado. Si el valor es una <em>promise</em>, esa <em>promise </em>es devuelta; si el valor es un <em>thenable </em>(si tiene un {{jsxref("Promise.then", "método \"then\"")}}), el valor devuelto le seguirá a ese <em>thenable</em>, adoptando su estado; de otro modo la <em>promise</em> devuelta estará completada con el valor.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/promise-resolve.html")}}</div>
-
-<p class="hidden">La fuente para esta demostración interactiva se encuentra en un repositorio de GitHub. Si te gustaría contribuir al proyecto de la demostración interactiva, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una <em>pull request</em>.</p>
-
-<h2 id="Sintáxis">Sintáxis</h2>
-
-<pre class="brush: js">Promise.resolve(value);
-Promise.resolve(promise);
-Promise.resolve(thenable);
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>value</dt>
- <dd>Argumento por resolver por esta <code>Promise</code>. También puede ser una <code>Promise</code> o un <em>thenable</em> por resolver.</dd>
-</dl>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Una {{jsxref("Promise")}} que es resuelta con el valor dado, o con la <em>promise </em>pasada como valor, si el valor era un objeto <em>promise</em>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La función estática <code>Promise.resolve</code> retorna una <code>Promise</code> que es resuelta.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_el_método_estático_Promise.resolve">Utilizando el método estático <code>Promise.resolve</code></h3>
-
-<pre class="brush: js">Promise.resolve('Éxito').then(function(value) {
-  console.log(value); // "Éxito"
-}, function(value) {
-  // no es llamada
-});
-</pre>
-
-<h3 id="Resolviendo_un_arreglo">Resolviendo un arreglo</h3>
-
-<pre class="brush: js">var p = Promise.resolve([1,2,3]);
-p.then(function(v) {
-  console.log(v[0]); // 1
-});</pre>
-
-<h3 id="Resolviendo_otra_Promise">Resolviendo otra <code>Promise</code></h3>
-
-<pre class="brush: js">var original = Promise.resolve(33);
-var cast = Promise.resolve(original);
-cast.then(function(value) {
-  console.log('valor: ' + value);
-});
-console.log('original === cast ? ' + (original === cast));
-
-// registros, en orden:
-// original === cast ? true
-// valor: 33
-</pre>
-
-<p>El orden invertido de los registros se debe al hecho de que los <em>handler </em><code>then</code> sean llamados asíncronamente. Vea cómo funciona <code>then</code> <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then#Return_value">aquí</a>.</p>
-
-<h3 id="Resolviendo_thenables_y_arrojando_Errores">Resolviendo thenables y arrojando Errores</h3>
-
-<pre class="brush: js">// Resolviendo un objeto thenable
-var p1 = Promise.resolve({
-  then: function(onFulfill, onReject) { onFulfill('¡Completada!'); }
-});
-console.log(p1 instanceof Promise) // true, objeto convertido en una Promise
-j
-p1.then(function(v) {
-    console.log(v); // "¡Completada!"
-  }, function(e) {
-    // no es llamada
-});
-
-// Thenable arroja antes del callback
-// Rechaza la Promise
-var thenable = { then: function(resolve) {
-  throw new TypeError('Arrojando');
-  resolve('Resolviendo');
-}};
-
-var p2 = Promise.resolve(thenable);
-p2.then(function(v) {
-  // no es llamada
-}, function(e) {
-  console.log(e); // TypeError: Arrojando
-});
-
-// Thenable arroja después del callback
-// Resuelve la Promise
-var thenable = { then: function(resolve) {
-  resolve('Resolviendo');
-  throw new TypeError('Arrojando');
-}};
-
-var p3 = Promise.resolve(thenable);
-p3.then(function(v) {
-  console.log(v); // "Resolviendo"
-}, function(e) {
-  // no es llamada
-});
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-promise.resolve', 'Promise.resolve')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial en un estándar de ECMA.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.resolve', 'Promise.resolve')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p class="hidden">Para contribuir a esta información de compatibilidad, porfavor haz una <em>pull request</em> contra este repositorio: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
-
-<p>{{Compat("javascript.builtins.Promise.resolve")}}</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/promise/then/index.html b/files/es/web/javascript/referencia/objetos_globales/promise/then/index.html
deleted file mode 100644
index 8998f3b180..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/promise/then/index.html
+++ /dev/null
@@ -1,302 +0,0 @@
----
-title: Promise.prototype.then()
-slug: Web/JavaScript/Referencia/Objetos_globales/Promise/then
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Method
-  - Promise
-  - Prototype
-translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>then()</strong></code> retorna una {{domxref("Promesa")}}. Recibe dos argumentos: funciones callback  para los casos de éxito y fallo de <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise">Promise</a></code>.</p>
-
-<p>Nota: Si ambos argumentos son omitidos, o se proveen métodos que no sean funciones, se creará una nueva <code>Promesa</code> sin handlers adicionales, que simplemente adoptan el estado final de la <code>Promesa</code> que entonces es llamado. Si el primer argumento es omitido o se provee una no-función, el nuevo <code>Promise</code> que es creado simplemente adopta el  estado cumplido del <code>Promise</code> que entonces es llamado (si se convierte en fulfilled). Si el segundo argument es omitido o se provee una no-función, el nuevo <code>Promise</code> que es creado simplemente adopta  el estado de rechazo del <code>Promesa</code> que entonces es llamado (si se convierte en rechazado).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>p.then(alCumplir[, enRechazo])</var>;
-
-p.then(function(value) {
-   // cumplimiento
-  }, function(reason) {
-  // rechazo
-});
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Retorna un <code>Promise</code> el cual es determinado por las funciones input:</p>
-
-<ul>
- <li>Si <font face="consolas, Liberation Mono, courier, monospace">alCumplir</font> o <code>enRechazo</code> arroja un error, o retorna un <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise">Promise</a></code> rechazado, <code>then</code> retorna un <code>Promise</code> rechazado.</li>
- <li>Si <font face="consolas, Liberation Mono, courier, monospace">alCumplir</font> o <code>enRechazo</code> retorna un <code>Promise</code> que resuelve, o retorna cualquier otro valor, <code>then</code> retorna un <code>Promise </code>resuelto.</li>
-</ul>
-
-<dl>
- <dt><font face="consolas, Liberation Mono, courier, monospace">alCumplir </font>{{optional_inline}}</dt>
- <dd>Una <a href="es/docs/Web/JavaScript/Referencia/Objetos_globales/Function">Función</a> es llamada si la <code>Promesa</code> se cumple. Esta función tiene un argumento, el <code>valor de</code> cumplimiento. Si no es una función, se reemplaza internamente con una función de "Identidad"  (devuelve el argumento recibido).</dd>
- <dt><code>enRechazo</code> {{optional_inline}}</dt>
- <dd>Una <a href="es/docs/Web/JavaScript/Referencia/Objetos_globales/Function">Función</a> es llamada si la <code>Promesa </code>es rechazada. Esta función tiene un argumento, la <code>razón</code> de rechazo. Si no es una función, se reemplaza internamente con una función "Lanzador" (lanza un error que recibió como argumento).</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un <code><a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise">Promise</a></code> en estado <strong>pendiente.</strong> La función de control (<code>alCumplir o enRechazo)</code> es llamada de forma <strong>asíncrona</strong> (tan pronto como el stack se vacíe). Después de la invocación de la función de control pueden darse diferentes casos:</p>
-
-<ul>
- <li>Si se recibe un valor, la Promesa devuelta por el método <code>then</code> queda resuelta adoptando el valor de retorno.</li>
- <li>Si se produce un error, la Promesa devuelta por el método <code>then</code> es rechazada, adoptando el error como su valor.</li>
- <li>Si se devuelve una Promesa ya resuelta, la Promesa devuelta por el método <code>then</code> queda resuelta adoptando el valor de la promesa anterior.</li>
- <li>Si se devuelve una Promesa con un objeto <strong>pendiente</strong> de resolver, la resolución o rechazo devueltos por  <code>then</code> quedará a esperas de que la Promesa establecida para la función de control quede resuelta. Además, el valor de la Promesa en estado pendiente será el mismo que el valor devuelto por el controlador.</li>
-</ul>
-
-<p>Veamos un ejemplo para demostrar la asincronía del método <code>then</code>.</p>
-
-<pre class="notranslate"><code>// al usar una promesa revuelta, el bloque 'then' se lanzará automáticamente,
-// pero sus funciones controladoras se lanzarán asíncronamente,
-// como demuestran los console.logs
-var promResuelta = Promise.resolve(33);
-
-var thenProm = promResuelta.then(función(valor){
-    console.log("ésto será invocado cuando acabe el stack principal. El valor recibido y devuelto es: " + valor);
-    return valor;
-});
-// imprimimos al momento el valor de thenProm()
-console.log(thenProm);
-
-// usando setTimeout podemos posponer la ejecución de una función al momento en el que el stack quede vacío.
-setTimeout(función(){
-    console.log(thenProm);
-});
-
-
-// logs, en orden:
-// Promise {[[EstadoPromise¡]]: "pendiente", [[ValorPromise]]: undefined}
-// "ésto será invocado cuando acabe el stack principal. El valor recibido y devuelto es: "33"
-// Promise {[[EstadoPromise]]: "resuelta", [[ValorPromise]]: 33}</code></pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Ya que los métodos <code>then</code> y {{jsxref("Promise.prototype.catch()")}} devuelven promesas, pueden ser encadenados — una operación llamada <em>composición</em>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_metodo_then">Usando el metodo <code>then</code></h3>
-
-<pre class="brush: js notranslate">var p1 = new Promise(function(resolve, reject) {
-  resolve('Success!');
-  // or
-  // reject ("Error!");
-});
-
-p1.then(function(value) {
-  console.log(value); // Success!
-}, function(reason) {
-  console.log(reason); // Error!
-});
-</pre>
-
-<h3 id="Encadenamiento">Encadenamiento</h3>
-
-<p>El método <code>then</code> devuelve una <code>Promise</code> que permite encadenar métodos.</p>
-
-<p>Puedes pasar una lambda a <code>then</code> y si devuelve una promesa, una <code>Promise</code> equivalente será expuesta al <code>then</code> subsecuente en la cadena de métodos. El fragmento incluido debajo simula un código asíncrono mediante la función <code>setTimeout</code>. </p>
-
-<pre class="brush: js notranslate">Promise.resolve('foo')
-  // 1. Recibe "foo", concatena "bar" con él, y resuelve la cadena con el siguiente 'then'
-  .then(función(hilo) {
-    return new Promise(function(resolve, reject) {
-      setTimeout(función() {
-        hilo += 'bar';
-        resolve(hilo);
-      }, 1);
-    });
-  })
-  // 2. recibe "foobar", registra una función de llamada para opear sobre ese hilo
-  // e imprimirlo en la consola, pero no antes de devolver el hilo sin modificar
-  // en la resolución del siguiente 'then'
-  .then(función(hilo) {
-    setTimeout(función() {
-      hilo += 'baz';
-      console.log(hilo);
-    }, 1)
-    return hilo;
-  })
-  // 3. imprime mensajes útiles sobre cómo funcionará el código en esta sección
-  // antes de que el hilo se procese por el código de prueba
-  // antes del bloque 'then'.
-  .then(función(hilo) {
-    console.log("Último Then:  oops... no me he molestado en instanciar y devolver " +
-                "una promesa en el then anterior, así que la secuencia puede ser un poco " +
-                "sorprendente");
-
-    // Observemos que `string` no incluye el trozo 'baz' en éste punto. Ésto ocurre
-    // porque lo hemos contruido para que ocurra asíncronamente con una función setTimeout
-    console.log(hilo);
-});</pre>
-
-<p>Cuando un valor sencillamente se devuelve desde un lambda <code>then</code> , devolverá un <code>Promise.resolve(&lt;valor devuelto por el controlador que haya sido invocado&gt;)</code>.</p>
-
-<pre class="brush: js notranslate">var p2 = nueva Promise(function(resolver, rechazar) {
-  resolver(1);
-});
-
-p2.then(función(valor) {
-  console.log(valor); // 1
-  return valor + 1;
-}).then(function(value) {
-  console.log(valor + '- Este uso síncrono es prácticamente inútil'); // 2- Este uso síncrono es prácticamente inútil
-});
-
-p2.then(función(valor) {
-  console.log(valor); // 1
-});
-</pre>
-
-<p>Una llamada a  <code>then</code> devolverá una promesa rechazada si la función lanza un error o devuelve una Promise rechazada.</p>
-
-<pre class="brush: js notranslate">Promise.resolve()
-  .then( () =&gt; {
-    // Hace que .then() devuelva una promera rechazada
-    throw new Error('Oh no!');
-  })
-  .then( () =&gt; {
-    console.log( 'No invocada.' );
-  }, error =&gt; {
-    console.error( 'Función de rechazo llamada: ', error );
-});</pre>
-
-<p>En cualquier otro caso, una Promise en resolución será devuelta. El el siguiente ejemplo, el primer <code>then()</code> devolverá un <code>42</code> dentro de una Promise en resolución, aunque la Promise de la cadena fue rechazada.</p>
-
-<pre class="brush: js notranslate">Promise.reject()
-  .then( () =&gt; 99, () =&gt; 42 ) // enRechazo devuelve 42, que está dentro de una Promise en resolución
-  .then( respuesta =&gt; console.log( 'Resuelta con ' + respuesta ) ); // Resuelta con 42</pre>
-
-<p>En la práctica, suele ser preferible capturar promesas rechazadas en lugar de utilizar la sintaxis de dos casos de <code>then,</code> como demostramos abajo.</p>
-
-<pre class="brush: js notranslate">Promise.resolve()
-  .then( () =&gt; {
-    // Hace que .then() devuelva una promesa rechazada
-    throw new Error('Oh no!');
-  })
-  .catch( error =&gt; {
-    console.error( 'función enRechazo invocada: ', error );
-  })
-  .then( () =&gt; {
-    console.log( "Siempre soy invocada, incluso si la promesa del then previo es rechazada" );
-  });</pre>
-
-<p><br>
- También puedes usar encadenamiento para implementar una función con una API basada en promesas, sobre una función del mismo tipo.</p>
-
-<pre class="brush: js notranslate">function traer_datos_actuales() {
-  // La función <a href="/en-US/docs/Web/API/GlobalFetch/fetch">fetch</a>() de la API devuelve una Promesa. Esta función
-  // expone una API similar, pero el valor de cumplimiento
-  // de la Promesa de esta función tiene más tareas
-  // implementadas sobre ella.
-  return fetch('datos_actuales.json').then((response) =&gt; {
-    if (response.headers.get('content-type') != 'application/json') {
-      throw new TypeError();
-    }
-    var j = response.json();
-    // podríamos hacer algo con j
-    return j; // valor de cumplimiento asignado al usuario de
-              // fetch_datos_actuales().then()
-  });
-}
-</pre>
-
-<p>Si <code>alCumplir</code> devuelve una promesa, el valor de retorno de <code>then</code> será resuelto o rechazado por la promesa.</p>
-
-<pre class="brush: js notranslate">function resolverDespues(resolver, reject) {
-  setTimeout(función () {
-    resolver(10);
-  }, 1000);
-}
-function rechazarDespues(resolver, reject) {
-  setTimeout(function () {
-    resolver(new Error('Error'));
-  }, 1000);
-}
-
-var p1 = Promise.resolve('foo');
-var p2 = p1.then(función() {
-  // Devuelve la promesa aquí, que será resuelta igualada a 10 tras 1 segundo
-  return new Promise(resolverDespues);
-});
-p2.then(función(v) {
-  console.log('resuelta', v);  // "resuelta", 10
-}, función(e) {
-  // no invocada
-  console.log('rechazada', e);
-});
-
-var p3 = p1.then(funcion() {
- // Devuelve la promesa aquí, que será rechazada con 'Error' despues de 1 segundo
- return new Promise(rechazarDespues);
-});
-p3.then(funcion(v) {
- // no invocada
-  console.log('resuelta', v);
-}, funcion(e) {
-  console.log('rechazada', e); // "rechazada", 'Error'
-});
-</pre>
-
-<h3 id="window.setImmediate_estilo_polyfill_basado_en_promesas"><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/Window/setImmediate" title="This method is used to break up long running operations and run a callback function immediately after the browser has completed other operations such as events and display updates."><code>window.setImmediate</code></a> estilo polyfill basado en promesas</h3>
-
-<p>Usar un método {{jsxref("Function.prototype.bind()")}}<code>Reflect.apply</code> ({{jsxref("Reflect.apply()")}}) para crear un (non-cancellable) setImmediate-style function.</p>
-
-<pre class="notranslate">const nextTick = (() =&gt; {
-  const noop = () =&gt; {}; // literally
-  const nextTickPromise = () =&gt; Promise.resolve().then(noop);
-
-  const rfab = Reflect.apply.bind; // (thisArg, fn, thisArg, [...args])
-  const nextTick = (fn, ...args) =&gt; (
-    fn !== undefined
-    ? Promise.resolve(args).then(rfab(null, fn, null))
-    : nextTickPromise(),
-    undefined
-  );
-  nextTick.ntp = nextTickPromise;
-
-  return nextTick;
-})();</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial en el estándar ECMA.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegador">Compatibilidad en navegador</h2>
-
-<p class="hidden">Para contribuir a la compatibilidad de estos datos, realiza una pull request sobre éste archivo: <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json">https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json</a>.</p>
-
-<p>{{Compat("javascript/promise","Promise.prototype.then")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Promise")}}</li>
- <li>{{jsxref("Promise.prototype.catch()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/proxy/index.html b/files/es/web/javascript/referencia/objetos_globales/proxy/index.html
deleted file mode 100644
index 1469b1f138..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/proxy/index.html
+++ /dev/null
@@ -1,439 +0,0 @@
----
-title: Proxy
-slug: Web/JavaScript/Referencia/Objetos_globales/Proxy
-translation_of: Web/JavaScript/Reference/Global_Objects/Proxy
----
-<div>
-<div>{{JSRef}}</div>
-</div>
-
-<p>El objeto <strong>Proxy</strong> se usa para definir un comportamiento personalizado para operaciones fundamentales (por ejemplo, para observar propiedades, cuando se asignan, enumeración, invocación de funciones, etc).</p>
-
-<h2 id="Terminología">Terminología</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler">handler</a></dt>
- <dd>Objeto que gestiona las intercepciones a las propiedades del objeto proxy.</dd>
- <dt>traps</dt>
- <dd>Son los métodos interceptores que proveen acceso a las propiedades. Es análogo al concepto de <em>traps</em> en los sistemas operativos.</dd>
- <dt>target</dt>
- <dd>El objeto que virtualiza este objeto. Suele usarse como <em>backend</em> de almacenamiento del proxy. Invariantes (semántica que no acepta cambios) respecto a la no extensibilidad del objeto o propiedades no configurables se verifican contra este <em>target</em>.</dd>
-</dl>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">var p = new Proxy(target, handler);
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>target</code></dt>
- <dd>Un objeto <em>target </em>(puede ser cualquier órden de objetos, incluyendo un array nativa, funcion o incluso otro proxy) o función que contenga el <code>Proxy</code></dd>
- <dt><code>handler</code></dt>
- <dd>Un objeto cuyas propiedades son funciones que definen el comportamiento del proxy cuando una operación es realizada en él.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Proxy.revocable()")}}</dt>
- <dd>Crea un objeto <code>Proxy</code> revocable</dd>
-</dl>
-
-<h2 id="Métodos_del_objeto_handler">Métodos del objeto handler</h2>
-
-<p>The handler object is a placeholder object which contains traps for <code>Proxy</code>.</p>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler', 'Methods') }}</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_básico">Ejemplo básico</h3>
-
-<p>En este simple ejemplo el número <code>37</code> se devuelve como valor predeterminado cuando la propiedad <code>name</code> no se encuentra en el objeto. Se utilizando el manejador <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/get">get</a></code>.</p>
-
-<pre class="brush: js notranslate">var handler = {
-    get: function(target, name){
-        return name in target?
-            target[name] :
-            37;
-    }
-};
-
-var p = new Proxy({}, handler);
-p.a = 1;
-p.b = undefined;
-
-console.log(p.a, p.b); // 1, undefined
-console.log('c' in p, p.c); // false, 37
-</pre>
-
-<h3 id="No-op_forwarding_proxy">No-op forwarding proxy</h3>
-
-<p>In this example, we are using a native JavaScript object to which our proxy will forward all operations that are applied to it.</p>
-
-<pre class="brush: js notranslate">var target = {};
-var p = new Proxy(target, {});
-
-p.a = 37; // operation forwarded to the target
-
-console.log(target.a); // 37. The operation has been properly forwarded
-</pre>
-
-<h3 id="Validación">Validación</h3>
-
-<p>Con un <code>Proxy</code>, puedes validar fácilmente el valor puesto a un objeto. Este ejemplo usa el handler (manejador) <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/set"><code>set</code></a>.</p>
-
-<pre class="brush: js notranslate">let validator = {
-  set: function(obj, prop, value) {
-    if (prop === 'age') {
-      if (!Number.isInteger(value)) {
-        throw new TypeError('The age is not an integer');
-      }
-      if (value &gt; 200) {
-        throw new RangeError('The age seems invalid');
-      }
-    }
-
-    // The default behavior to store the value
-    obj[prop] = value;
-  }
-};
-
-let person = new Proxy({}, validator);
-
-person.age = 100;
-console.log(person.age); // 100
-person.age = 'young'; // Throws an exception
-person.age = 300; // Throws an exception
-</pre>
-
-<h3 id="Extending_constructor">Extending constructor</h3>
-
-<p>A function proxy could easily extend a constructor with a new constructor. This example uses the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/construct"><code>construct</code></a> and <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/apply"><code>apply</code></a> handlers.</p>
-
-<pre class="brush: js notranslate">function extend(sup,base) {
-  var descriptor = Object.getOwnPropertyDescriptor(
-    base.prototype,"constructor"
-  );
-  base.prototype = Object.create(sup.prototype);
-  var handler = {
-    construct: function(target, args) {
-      var obj = Object.create(base.prototype);
-      this.apply(target,obj,args);
-      return obj;
-    },
-    apply: function(target, that, args) {
-      sup.apply(that,args);
-      base.apply(that,args);
-    }
-  };
-  var proxy = new Proxy(base,handler);
-  descriptor.value = proxy;
-  Object.defineProperty(base.prototype, "constructor", descriptor);
-  return proxy;
-}
-
-var Person = function(name){
-  this.name = name;
-};
-
-var Boy = extend(Person, function(name, age) {
-  this.age = age;
-});
-
-Boy.prototype.sex = "M";
-
-var Peter = new Boy("Peter", 13);
-console.log(Peter.sex);  // "M"
-console.log(Peter.name); // "Peter"
-console.log(Peter.age);  // 13</pre>
-
-<h3 id="Manipular_nodos_del_DOM">Manipular nodos del DOM</h3>
-
-<p>A veces queremos cambiar el atributo clase de dos elementos diferentes. Aquí se muestra cómo usando el handler (manejador) <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy/handler/set"><code>set</code></a>.</p>
-
-<pre class="brush: js notranslate">let view = new Proxy({
-  selected: null
-},
-{
-  set: function(obj, prop, newval) {
-    let oldval = obj[prop];
-
-    if (prop === 'selected') {
-      if (oldval) {
-        oldval.setAttribute('aria-selected', 'false');
-      }
-      if (newval) {
-        newval.setAttribute('aria-selected', 'true');
-      }
-    }
-
-    // The default behavior to store the value
-    obj[prop] = newval;
-  }
-});
-
-let i1 = view.selected = document.getElementById('item-1');
-console.log(i1.getAttribute('aria-selected')); // 'true'
-
-let i2 = view.selected = document.getElementById('item-2');
-console.log(i1.getAttribute('aria-selected')); // 'false'
-console.log(i2.getAttribute('aria-selected')); // 'true'
-</pre>
-
-<h3 id="Value_correction_and_an_extra_property">Value correction and an extra property</h3>
-
-<p>The <code>products</code> proxy object evaluates the passed value and convert it to an array if needed. The object also supports an extra property called <code>latestBrowser</code> both as a getter and a setter.</p>
-
-<pre class="brush: js notranslate">let products = new Proxy({
-  browsers: ['Internet Explorer', 'Netscape']
-},
-{
-  get: function(obj, prop) {
-    // An extra property
-    if (prop === 'latestBrowser') {
-      return obj.browsers[obj.browsers.length - 1];
-    }
-
-    // The default behavior to return the value
-    return obj[prop];
-  },
-  set: function(obj, prop, value) {
-    // An extra property
-    if (prop === 'latestBrowser') {
-      obj.browsers.push(value);
-      return;
-    }
-
-    // Convert the value if it is not an array
-    if (typeof value === 'string') {
-      value = [value];
-    }
-
-    // The default behavior to store the value
-    obj[prop] = value;
-  }
-});
-
-console.log(products.browsers); // ['Internet Explorer', 'Netscape']
-products.browsers = 'Firefox'; // pass a string (by mistake)
-console.log(products.browsers); // ['Firefox'] &lt;- no problem, the value is an array
-
-products.latestBrowser = 'Chrome';
-console.log(products.browsers); // ['Firefox', 'Chrome']
-console.log(products.latestBrowser); // 'Chrome'
-</pre>
-
-<h3 id="Finding_an_array_item_object_by_its_property">Finding an array item object by its property</h3>
-
-<p>This proxy extends an array with some utility features. As you see, you can flexibly "define" properties without using <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties"><code>Object.defineProperties</code></a>. This example can be adapted to find a table row by its cell. In that case, the target will be <a href="/en-US/docs/DOM/table.rows"><code>table.rows</code></a>.</p>
-
-<pre class="brush: js notranslate">let products = new Proxy([
-  { name: 'Firefox', type: 'browser' },
-  { name: 'SeaMonkey', type: 'browser' },
-  { name: 'Thunderbird', type: 'mailer' }
-],
-{
-  get: function(obj, prop) {
-    // The default behavior to return the value; prop is usually an integer
-    if (prop in obj) {
-      return obj[prop];
-    }
-
-    // Get the number of products; an alias of products.length
-    if (prop === 'number') {
-      return obj.length;
-    }
-
-    let result, types = {};
-
-    for (let product of obj) {
-      if (product.name === prop) {
-        result = product;
-      }
-      if (types[product.type]) {
-        types[product.type].push(product);
-      } else {
-        types[product.type] = [product];
-      }
-    }
-
-    // Get a product by name
-    if (result) {
-      return result;
-    }
-
-    // Get products by type
-    if (prop in types) {
-      return types[prop];
-    }
-
-    // Get product types
-    if (prop === 'types') {
-      return Object.keys(types);
-    }
-
-    return undefined;
-  }
-});
-
-console.log(products[0]); // { name: 'Firefox', type: 'browser' }
-console.log(products['Firefox']); // { name: 'Firefox', type: 'browser' }
-console.log(products['Chrome']); // undefined
-console.log(products.browser); // [{ name: 'Firefox', type: 'browser' }, { name: 'SeaMonkey', type: 'browser' }]
-console.log(products.types); // ['browser', 'mailer']
-console.log(products.number); // 3
-</pre>
-
-<h3 id="A_complete_traps_list_example">A complete <code>traps</code> list example</h3>
-
-<p>Now in order to create a complete sample <code>traps</code> list, for didactic purposes, we will try to proxify a <em>non native</em> object that is particularly suited to this type of operation: the <code>docCookies</code> global object created by <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie/Simple_document.cookie_framework" title="https://developer.mozilla.org/en-US/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support">the "little framework" published on the <code>document.cookie</code> page</a>.</p>
-
-<pre class="brush: js notranslate">/*
-  var docCookies = ... get the "docCookies" object here:
-  https://developer.mozilla.org/en-US/docs/DOM/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support
-*/
-
-var docCookies = new Proxy(docCookies, {
-  get: function (oTarget, sKey) {
-    return oTarget[sKey] || oTarget.getItem(sKey) || undefined;
-  },
-  set: function (oTarget, sKey, vValue) {
-    if (sKey in oTarget) { return false; }
-    return oTarget.setItem(sKey, vValue);
-  },
-  deleteProperty: function (oTarget, sKey) {
-    if (sKey in oTarget) { return false; }
-    return oTarget.removeItem(sKey);
-  },
-  enumerate: function (oTarget, sKey) {
-    return oTarget.keys();
-  },
-  ownKeys: function (oTarget, sKey) {
-    return oTarget.keys();
-  },
-  has: function (oTarget, sKey) {
-    return sKey in oTarget || oTarget.hasItem(sKey);
-  },
-  defineProperty: function (oTarget, sKey, oDesc) {
-    if (oDesc &amp;&amp; "value" in oDesc) { oTarget.setItem(sKey, oDesc.value); }
-    return oTarget;
-  },
-  getOwnPropertyDescriptor: function (oTarget, sKey) {
-    var vValue = oTarget.getItem(sKey);
-    return vValue ? {
-      value: vValue,
-      writable: true,
-      enumerable: true,
-      configurable: false
-    } : undefined;
-  },
-});
-
-/* Cookies test */
-
-console.log(docCookies.my_cookie1 = "First value");
-console.log(docCookies.getItem("my_cookie1"));
-
-docCookies.setItem("my_cookie1", "Changed value");
-console.log(docCookies.my_cookie1);</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-proxy-objects', 'Proxy')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-proxy-objects', 'Proxy')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(49.0)}}</td>
-   <td>13 (10586)</td>
-   <td>{{ CompatGeckoDesktop("18") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(49.0)}}</td>
-   <td>{{ CompatGeckoDesktop("18") }}</td>
-   <td>13 (10586)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Gecko_specific_notes">Gecko specific notes</h2>
-
-<ul>
- <li>At present, <code>Object.getPrototypeOf(proxy)</code> unconditionally returns <code>Object.getPrototypeOf(target)</code>, because the ES6 getPrototypeOf trap is not yet implemented ({{bug(795904)}}, {{bug(888969)}}).</li>
- <li><code>Array.isArray(proxy)</code> unconditionally returns <code>Array.isArray(target)</code> ({{bug(1096753)}}, {{bug(1111785)}}).</li>
- <li><code>Object.prototype.toString.call(proxy)</code> unconditionally returns <code>Object.prototype.toString.call(target)</code>, because ES6 Symbol.toStringTag is not yet implemented ({{bug(1114580)}}).</li>
-</ul>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a class="external" href="https://www.youtube.com/watch?v=sClk6aB_CPk">"Proxies are awesome" Brendan Eich presentation at JSConf</a> (<a class="external" href="http://www.slideshare.net/BrendanEich/metaprog-5303821">slides</a>)</li>
- <li><a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:proxies">ECMAScript Harmony Proxy proposal page</a> and <a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:proxies_semantics">ECMAScript Harmony proxy semantics page</a></li>
- <li><a class="external" href="http://soft.vub.ac.be/~tvcutsem/proxies/">Tutorial on proxies</a></li>
- <li><a href="/en-US/docs/JavaScript/Old_Proxy_API" title="/en-US/docs/JavaScript/Old_Proxy_API">SpiderMonkey specific Old Proxy API</a></li>
- <li>{{jsxref("Object.watch()")}} is a non-standard feature but has been supported in Gecko for a long time.</li>
-</ul>
-
-<h2 id="Licensing_note">Licensing note</h2>
-
-<p>Some content (text, examples) in this page has been copied or adapted from the <a class="external" href="http://wiki.ecmascript.org/doku.php">ECMAScript wiki</a> which content is licensed <a class="external" href="http://creativecommons.org/licenses/by-nc-sa/2.0/">CC 2.0 BY-NC-SA</a>.</p>
diff --git a/files/es/web/javascript/referencia/objetos_globales/referenceerror/index.html b/files/es/web/javascript/referencia/objetos_globales/referenceerror/index.html
deleted file mode 100644
index 5b48497b5d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/referenceerror/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: ReferenceError
-slug: Web/JavaScript/Referencia/Objetos_globales/ReferenceError
-tags:
-  - Clase
-  - Class
-  - JavaScript
-  - Object
-  - Objeto
-  - ReferenceError
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/ReferenceError
----
-<div>{{JSRef("Objetos_globales", "ReferenceError")}}</div>
-
-<p>El objeto <strong><code>ReferenceError</code></strong> representa un error cuando se hace referencia a una variable inexistente.</p>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError/ReferenceError"><code>ReferenceError()</code></a></dt>
- <dd>Crea un nuevo objeto <code>ReferenceError</code>.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{jsxref("Error.prototype.message", "ReferenceError.prototype.message")}}</dt>
- <dd>Mensaje de error. Aunque ECMA-262 especifica que {{jsxref("ReferenceError")}} debe proporcionar su propia propiedad <code>message</code>, en <a href="/es/docs/Mozilla/Projects/SpiderMonkey"><code>SpiderMonkey</code></a>, hereda {{jsxref("Error.prototype.message")}}.</dd>
- <dt>{{jsxref("Error.prototype.name", "ReferenceError.prototype.name")}}</dt>
- <dd>Nombre del error. Heredado de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.fileName", "ReferenceError.prototype.fileName")}}</dt>
- <dd>Ruta al archivo que generó este error. Heredado de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.lineNumber", "ReferenceError.prototype.lineNumber")}}</dt>
- <dd>Número de línea en el archivo que generó este error. Heredado de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.columnNumber", "ReferenceError.prototype.columnNumber")}}</dt>
- <dd>Número de columna en la línea que generó este error. Heredado de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.stack", "ReferenceError.prototype.stack")}}</dt>
- <dd>Seguimiento de la pila. Heredado de {{jsxref("Error")}}.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Capturar_un_ReferenceError">Capturar un <code>ReferenceError</code></h3>
-
-<pre class="brush: js notranslate">try {
-  let a = undefinedVariable
-} catch (e) {
-  console.log(e instanceof ReferenceError)  // true
-  console.log(e.message)                    // "undefinedVariable no está definida"
-  console.log(e.name)                       // "ReferenceError"
-  console.log(e.fileName)                   // "Scratchpad/1"
-  console.log(e.lineNumber)                 // 2
-  console.log(e.columnNumber)               // 6
-  console.log(e.stack)                      // "@Scratchpad/2:2:7\n"
-}
-</pre>
-
-<h3 id="Crear_un_ReferenceError">Crear un <code>ReferenceError</code></h3>
-
-<pre class="brush: js notranslate">try {
-  throw new ReferenceError('Hola', 'someFile.js', 10)
-} catch (e) {
-  console.log(e instanceof ReferenceError)  // true
-  console.log(e.message)                    // "Hola"
-  console.log(e.name)                       // "ReferenceError"
-  console.log(e.fileName)                   // "someFile.js"
-  console.log(e.lineNumber)                 // 10
-  console.log(e.columnNumber)               // 0
-  console.log(e.stack)                      // "@Scratchpad/2:2:9\n"
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-referenceerror', 'ReferenceError')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.ReferenceError")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Error")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/compile/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/compile/index.html
deleted file mode 100644
index 0bce81a56d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/compile/index.html
+++ /dev/null
@@ -1,93 +0,0 @@
----
-title: RegExp.prototype.compile()
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/compile
-tags:
-  - Desaprovado
-  - Expresion Regular
-  - JavaScript
-  - Obsoleto
-  - Prototype
-  - Referencia
-  - RegExp
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/compile
----
-<div>{{JSRef}} {{deprecated_header}}</div>
-
-<p>El método obsoleto <code><strong>compile</strong></code><strong><code>()</code></strong> es usado para (re-)compilar una expresión regular durante la ejecución del script. Es básicamente lo mismo que el constructor <code>RegExp</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>regexObj</var>.compile(<var>patrón, flags</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>patrón</code></dt>
- <dd>El texto de la expresión regular.</dd>
- <dt><code>flags</code></dt>
- <dd>
- <p>Si es especificado, las flags pueden tener cualquier combinación de los siguientes valores:</p>
-
- <dl>
-  <dt><code>g</code></dt>
-  <dd>búsqueda global (global match)</dd>
-  <dt><code>i</code></dt>
-  <dd>ignorar mayúsculas o minúsculas</dd>
-  <dt><code>m</code></dt>
-  <dd>Tratar caracteres de inicio y fin (^ y $) como multiples líneas de texto(por ejemplo: encontrar el inicio o fin de cada línea delimitada por \n o \r, no sólo al inicio o fin de toda la entrada de texto)</dd>
-  <dt><code>y</code></dt>
-  <dd>sticky; busca solamente desde el índice indicado por la propiedad <code>lastIndex</code> de esta expresión regular en la cadena objetivo (y no intenta buscar desde ningún índice posterior).</dd>
- </dl>
- </dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p> El método <code>compile</code> es obsoleto. Puedes simplemente utilizar el constructor <code>RegExp</code> para lograr el mismo efecto.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_compile">Usando <code>compile()</code></h3>
-
-<p>El siguiente ejemplo muestra como recompilar una expresión regultar con un nuevo patrón y nuevas flags.</p>
-
-<pre class="brush: js">var regexObj = new RegExp('foo', 'gi');
-regexObj.compile('new foo', 'g');
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Commentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-regexp.prototype.compile', 'RegExp.prototype.compile')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial. Definido en la (norma) Annex B ECMAScript para Características Adicionales para Navegadores Web.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.compile', 'RegExp.prototype.compile')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Definido en la (norma) Annex B ECMAScript para Características Adicionales para Navegadores Web.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.RegExp.compile")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("RegExp")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/exec/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/exec/index.html
deleted file mode 100644
index 1925e63b67..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/exec/index.html
+++ /dev/null
@@ -1,238 +0,0 @@
----
-title: RegExp.prototype.exec()
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/exec
-tags:
-  - Expresiones Regulares
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - RegExp
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/exec
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>exec()</code></strong> ejecuta una busqueda sobre las coincidencias de una expresión regular en una cadena especifica. Devuelve el resultado como array, o {{jsxref("null")}}.</p>
-
-<p>Si está ejecutando una expresión regular solo para buscar si algo se cumple o no, usa el método {{jsxref("RegExp.prototype.test()")}} o el método {{jsxref("String.prototype.search()")}}.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>regexObj</var>.exec(<em>cadena</em>)</pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>cadena</code></dt>
- <dd>Cadena sobre la cual se quiere aplicar la expresión regular</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Si se encuentran coincidencial, el método <code>exec()</code> devuelve un array y actualiza las propiedades del objecto de la expresión regular. El array devuelto contiene los elementos encontrados en su primer elemento, y un elemento por cada parte de la expresión regular que se encuentra entre parentesis y se encuentra dentro del texto que fué capturado.</p>
-
-<p>Si la busqueda falla, el método <code>exec()</code> devuelve {{jsxref("null")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Considerando el siguiente ejemplo:</p>
-
-<pre class="brush: js">// Busca "quick brown" seguido de "jumps", ignorando los caracteres que se
-// encuentren entre medias.
-// Recuerda "brown" y "jumps"
-// Ignora mayusculas y minusculas
-var re = /quick\s(brown).+?(jumps)/ig;
-var result = re.exec('The Quick Brown Fox Jumps Over The Lazy Dog');
-</pre>
-
-<p>La siguiente tabla muestra el resultado de este script:</p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <td class="header">Objeto</td>
-   <td class="header">Propiedad/Índice</td>
-   <td class="header">Descripción</td>
-   <td class="header">Ejemplo</td>
-  </tr>
-  <tr>
-   <td rowspan="4"><code>result</code></td>
-   <td><code>[0]</code></td>
-   <td>Todas las partes de la cadena que cumplen la expresión regular</td>
-   <td><code>Quick Brown Fox Jumps</code></td>
-  </tr>
-  <tr>
-   <td><code>[1],...[<em>n</em>]</code></td>
-   <td>
-    <p>Las subcadenas entre parentesis que han sido encontradas, si hay alguna. El número de subcadenas encontradas es ilimitado</p>
-   </td>
-   <td><code>[1] = Brown<br>
-    [2] = Jumps</code></td>
-  </tr>
-  <tr>
-   <td><code>index</code></td>
-   <td>El índice de base-0 del elemento encontrado en la cadena.</td>
-   <td><code>4</code></td>
-  </tr>
-  <tr>
-   <td><code>input</code></td>
-   <td>La cadena original.</td>
-   <td><code>The Quick Brown Fox Jumps Over The Lazy Dog</code></td>
-  </tr>
-  <tr>
-   <td rowspan="5"><code>re</code></td>
-   <td><code>lastIndex</code></td>
-   <td>El índice sobre el cual empieza la siguiente busqueda. Cuando no se usa g (busqueda global), esto va a ser siempre 0.</td>
-   <td><code>25</code></td>
-  </tr>
-  <tr>
-   <td><code>ignoreCase</code></td>
-   <td>Indica si la bandera "<code>i</code>" ha sido usada para ignorar mayusculas y minusculas.</td>
-   <td><code>true</code></td>
-  </tr>
-  <tr>
-   <td><code>global</code></td>
-   <td>Indica si la bandera "<code>g</code>" fue usada para hacer una busqueda global.</td>
-   <td><code>true</code></td>
-  </tr>
-  <tr>
-   <td><code>multiline</code></td>
-   <td>Indica si la bandera "<code>m"</code> fue usada para buscar en cadenas sobre multiples lineas</td>
-   <td><code>false</code></td>
-  </tr>
-  <tr>
-   <td><code>source</code></td>
-   <td>El texto del patrón de busqueda</td>
-   <td><code>quick\s(brown).+?(jumps)</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Encontrando_coincidencias_sucesivas">Encontrando coincidencias sucesivas</h3>
-
-<p>Si tu expresión regular contiene la bandera "<code>g</code>", puedes usar el método <code>exec()</code> varias veces para encontrar coincidencias sucesivas en la misma cadena. Cuando lo haces, la busqueda empieza en la subcadena <code>str</code> especificada por la propiedad {{jsxref("RegExp.lastIndex", "lastIndex")}} de la expresión regular ({{jsxref("RegExp.prototype.test()", "test()")}} también movera hacia adelante el indice de la propiedad {{jsxref("RegExp.lastIndex", "lastIndex")}}). Por ejemplo, asumiendo que tienes este script:</p>
-
-<pre class="brush: js">var myRe = /ab*/g;
-var str = 'abbcdefabh';
-var myArray;
-while ((myArray = myRe.exec(str)) !== null) {
-  var msg = 'Se ha encontrado ' + myArray[0] + '. ';
-  msg += 'La siguiente coincidencia empieza en el indice ' + myRe.lastIndex;
-  console.log(msg);
-}
-</pre>
-
-<p>Este script muestra el siguiente texto:</p>
-
-<pre>Se ha encontrado abb. La siguiente coincidencia empieza en el indice 3
-Se ha encontrado ab. La siguiente coincidencia empieza en el indice 9
-</pre>
-
-<p>Nota: No uses la expresión regular literalmente (o el constructor {{jsxref("RegExp")}}) dentro de la condición del bucle while o se creará un bucle infinito si hay una coincidencia, por culpa de que la propiedad {{jsxref("RegExp.lastIndex", "lastIndex")}} va a ser reiniciada por cada iteración del bucle. Además asegurate de que has usado la bandera de busqueda global "g" o se creará un bucle también.</p>
-
-<h3 id="Usando_exec()_con_RegExp_literales">Usando <code>exec()</code> con <code>RegExp</code> literales</h3>
-
-<p>También se puede usar <code>exec() sin crear un objeto de </code> {{jsxref("RegExp")}}:</p>
-
-<pre class="brush: js">var matches = /(hola \S+)/.exec('Esto es un hola mundo!');
-console.log(matches[1]);
-</pre>
-
-<p>Esto logueará un mensaje que contiene 'hola mundo!'.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.10.6.21', 'RegExp.exec')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-regexp.prototype.exec', 'RegExp.exec')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.exec', 'RegExp.exec')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatiblidad_con_navegadores">Compatiblidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Móvil (Gecko)</th>
-   <th>IE Móvil</th>
-   <th>Opera Móvil</th>
-   <th>Safari Móvil</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>Capítulo de <a href="/en-US/docs/Web/JavaScript/Guide/Regular_Expressions">Expresiones Regulares</a> en la <a href="/en-US/docs/Web/JavaScript/Guide">Guía de Javascript</a></li>
- <li>{{jsxref("RegExp")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/ignorecase/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/ignorecase/index.html
deleted file mode 100644
index 9073d631d1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/ignorecase/index.html
+++ /dev/null
@@ -1,142 +0,0 @@
----
-title: RegExp.prototype.ignoreCase
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/ignoreCase
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/ignoreCase
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <strong><code>ignoreCase</code></strong> indica si la expresión regular está usando la bandera "i". <code>ignoreCase</code> es una propiedad de <em>sólo lectura </em>de una instancia de expresión regular.</p>
-
-<div>{{js_property_attributes(0, 0, 1)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El valor de <code>ignoreCase es un </code>{{jsxref("Boolean")}} y <code>true si la bandera "i" fue usada. De otra manera es false. La bandera "i" indica que el se debe ignorar la capitalización al tratar de encontrar los equivalentes en un texto.</code></p>
-
-<p>No se puede cambiar esta propiedad directamente.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_ignoreCase">Usando <code>ignoreCase</code></h3>
-
-<pre class="brush: js">var regex = new RegExp('foo', 'i');
-
-console.log(regex.ignoreCase); // true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.2. JavaScript 1.5: <code>ignoreCase</code> es una propiedad de la instancia  {{jsxref("RegExp")}}, y no del objecto {{jsxref("RegExp")}}.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.10.7.3', 'RegExp.prototype.ignoreCase')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-get-regexp.prototype.ignorecase', 'RegExp.prototype.ignoreCase')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td><code>ignoreCase</code> es ahora una propiedad accesora del prototipo en lugar de una propiedad de dato de una instancia.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-get-regexp.prototype.ignorecase', 'RegExp.prototype.ignoreCase')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Propiedad accesor del Prototipo</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop(38)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Propiedad accesor del Prototipo</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile(38)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("RegExp.lastIndex")}}</li>
- <li>{{jsxref("RegExp.prototype.global")}}</li>
- <li>{{jsxref("RegExp.prototype.multiline")}}</li>
- <li>{{jsxref("RegExp.prototype.source")}}</li>
- <li>{{jsxref("RegExp.prototype.sticky")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/index.html
deleted file mode 100644
index 9a26edead0..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/index.html
+++ /dev/null
@@ -1,264 +0,0 @@
----
-title: RegExp
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp
-tags:
-  - Clase
-  - Expresiones Regulares
-  - JavaScript
-  - Referencia
-  - RegExp
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>RegExp</code></strong> se utiliza para hacer coincidir texto con un patrón.</p>
-
-<p>Para obtener una introducción a las expresiones regulares, lee el {{JSxRef("../Guide/Regular_Expressions", "capítulo sobre expresiones regulares")}} en la {{JSxRef("../Guide/Regular_Expressions", "Guía de JavaScript")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<h3 id="Notación_literal_y_constructor">Notación literal y constructor</h3>
-
-<p>Hay dos formas de crear un objeto <code>RegExp</code>: una <em>notación literal</em> y un <em>constructor</em>.</p>
-
-<ul>
- <li>Los parámetros de <strong>la notación literal</strong> se encierran entre barras y no utilizan comillas.</li>
- <li>Los parámetros de <strong>la función constructora</strong> no se encierran entre barras, pero utilizan comillas.</li>
-</ul>
-
-<p>Las siguientes tres expresiones crean el mismo objeto de expresión regular:</p>
-
-<pre class="brush: js notranslate">let er = /ab+c/i; // notación literal
-let er = new RegExp('ab+c', 'i') // constructor con patrón de cadena como primer argumento
-let er = new RegExp(/ab+c/, 'i') // constructor con expresión regular literal como primer argumento (a partir de ECMAScript 6)
-</pre>
-
-<p>La notación literal da como resultado la compilación de la expresión regular cuando se evalúa la expresión. Utiliza la notación literal cuando la expresión regular permanecerá constante. Por ejemplo, si usas notación literal para construir una expresión regular usada en un bucle, la expresión regular no se volverá a compilar en cada iteración.</p>
-
-<p>El constructor del objeto de expresión regular, por ejemplo, <code>new RegExp('ab+c')</code>, da como resultado la compilación en tiempo de ejecución de la expresión regular. Utiliza la función constructora cuando sepas que el patrón de expresión regular cambiará, o no conozcas el patrón y lo obtienes de otra fuente, tal como la entrada del usuario.</p>
-
-<h3 id="Banderas_en_el_constructor">Banderas en el constructor</h3>
-
-<p>A partir de ECMAScript 6, <code>new RegExp(/ab+c/, 'i')</code> ya no arroja un {{JSxRef("TypeError")}} (<code>"no puedes proporcionar banderas cuando construyes una expresión regular a partir de otra"</code>) cuando el primer argumento es una <code>RegExp</code> y el segundo argumento <code><var>flags</var></code> está presente. En su lugar, se crea una nueva <code>RegExp</code> a partir de los argumentos.</p>
-
-<p>Cuando se utiliza la función constructora, las reglas de escape de cadenas normales (antes de los caracteres especiales con <code>\</code> cuando se incluyen en una cadena) son necesarias.</p>
-
-<p>Por ejemplo, los siguientes son equivalentes:</p>
-
-<pre class="brush: js notranslate">let er = /\w+/
-let er = new RegExp('\\w+')
-</pre>
-
-<h3 id="Propiedades_de_expresiones_regulares_similares_a_Perl">Propiedades de expresiones regulares similares a Perl</h3>
-
-<p>Ten en cuenta que varias de las propiedades de {{JSxRef("RegExp")}} tienen nombres largos y cortos (tipo Perl). Ambos nombres siempre se refieren al mismo valor. (Perl es el lenguaje de programación a partir del cual JavaScript modeló sus expresiones regulares). Consulta también las propiedades {{JSxRef("Características_Desaprobadas", "en desuso de RegExp", "#Propiedades_de_RegExp")}}</p>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{JSxRef("Objetos_globales/RegExp/RegExp", "RegExp()")}}</dt>
- <dd>Crea un nuevo objeto <code>RegExp</code>.</dd>
-</dl>
-
-<h2 id="Propiedades_estáticas">Propiedades estáticas</h2>
-
-<dl>
- <dt>{{JSxRef("RegExp.@@species", "get RegExp[@@species]")}}</dt>
- <dd>La función constructora utilizada para crear objetos derivados.</dd>
- <dt>{{JSxRef("RegExp.lastIndex")}}</dt>
- <dd>El índice en el que comenzará la siguiente búsqueda.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{JSxRef("RegExp.prototype.flags")}}</dt>
- <dd>Una cadena que contiene las banderas del objeto <code>RegExp</code>.</dd>
- <dt>{{JSxRef("RegExp.prototype.dotAll")}}</dt>
- <dd>Si el "<code>.</code>" coincide con nuevas líneas o no.</dd>
- <dt>{{JSxRef("RegExp.prototype.global")}}</dt>
- <dd>Si se debe probar o no la expresión regular con todas las posibles ocurrencias en una cadena, o solo con la primera.</dd>
- <dt>{{JSxRef("RegExp.prototype.ignoreCase")}}</dt>
- <dd>Si se deben o no ignorar las mayúsculas/minúsculas al buscar en una cadena.</dd>
- <dt>{{JSxRef("RegExp.prototype.multiline")}}</dt>
- <dd>Si buscar o no en cadenas multilínea.</dd>
- <dt>{{JSxRef("RegExp.prototype.source")}}</dt>
- <dd>El texto del patrón.</dd>
- <dt>{{JSxRef("RegExp.prototype.sticky")}}</dt>
- <dd>Si la búsqueda es pegajosa o no.</dd>
- <dt>{{JSxRef("RegExp.prototype.unicode")}}</dt>
- <dd>Si las funciones Unicode están habilitadas o no.</dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt>{{JSxRef("RegExp.prototype.compile()")}}</dt>
- <dd>(Re)compila una expresión regular durante la ejecución de un script.</dd>
- <dt>{{JSxRef("RegExp.prototype.exec()")}}</dt>
- <dd>Ejecuta una búsqueda de una coincidencia en su parámetro de cadena.</dd>
- <dt>{{JSxRef("RegExp.prototype.test()")}}</dt>
- <dd>Prueba una coincidencia en su parámetro de cadena.</dd>
- <dt>{{JSxRef("RegExp.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el objeto especificado. Redefine el método {{JSxRef("Object.prototype.toString()")}}.</dd>
- <dt>{{JSxRef("RegExp.prototype.@@match()", "RegExp.prototype[@@match]()")}}</dt>
- <dd>Realiza la coincidencia con la cadena dada y devuelve el resultado de la coincidencia.</dd>
- <dt>{{JSxRef("RegExp.prototype.@@matchAll()", "RegExp.prototype[@@matchAll]()")}}</dt>
- <dd>Devuelve todas las coincidencias de la expresión regular con una cadena.</dd>
- <dt>{{JSxRef("RegExp.prototype.@@replace()", "RegExp.prototype[@@replace]()")}}</dt>
- <dd>Reemplaza las coincidencias en una cadena dada con una nueva subcadena.</dd>
- <dt>{{JSxRef("RegExp.prototype.@@search()", "RegExp.prototype[@@search]()")}}</dt>
- <dd>Busca la coincidencia en la cadena dada y devuelve el índice del patrón encontrado en la cadena.</dd>
- <dt>{{JSxRef("RegExp.prototype.@@split()", "RegExp.prototype[@@split]()")}}</dt>
- <dd>Divide la cadena dada en un arreglo separando la cadena en subcadenas.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usar_una_expresión_regular_para_cambiar_el_formato_de_los_datos">Usar una expresión regular para cambiar el formato de los datos</h3>
-
-<p>El siguiente script usa el método {{JSxRef("String.prototype.replace()", "replace()")}} de la instancia {{JSxRef("Objetos_globales/String", "String")}} para hacer coincidir una nombre en el formato <em>primero último</em> y enviarlo en el formato <em>último, primero</em>.</p>
-
-<p>En el texto de reemplazo, el script usa <code>$1</code> y <code>$2</code> para indicar los resultados de los correspondientes paréntesis coincidentes en el patrón de expresión regular.</p>
-
-<pre class="brush: js notranslate">let er = /(\w+)\s(\w+)/
-let str = 'John Smith'
-let newstr = str.replace(er, '$2, $1')
-console.log(newstr)
-</pre>
-
-<p>Esto muestra <code>"Smith, John"</code>.</p>
-
-<h3 id="Uso_de_expresiones_regulares_para_dividir_líneas_con_diferentes_finales_de_líneasaltos_de_línea">Uso de expresiones regulares para dividir líneas con diferentes finales de línea/saltos de línea</h3>
-
-<p>El final de línea predeterminado varía según la plataforma (Unix, Windows, etc.). La división de líneas proporcionada en este ejemplo funciona en todas las plataformas.</p>
-
-<pre class="brush: js notranslate">let texto = 'Un poco de texto\ny un poco más\r\ny aún\reste es el final'
-let lineas = texto.split(/\r\n|\r|\n/)
-console.log(lineas) // logs [ 'Un poco de texto', 'y un poco más', 'y aún', 'este es el final' ]
-</pre>
-
-<p>Ten en cuenta que el orden de los patrones en la expresión regular es importante.</p>
-
-<h3 id="Usar_expresiones_regulares_en_varias_líneas">Usar expresiones regulares en varias líneas</h3>
-
-<pre class="brush: js notranslate">let s = '¡Por favor, sí\nhazme el día!'
-
-s.match(/sí.*día/);
-// Devuelve null
-
-s.match(/sí[^]*día/);
-// Devuelve ["sí\nhazme el día"]
-</pre>
-
-<h3 id="Usar_una_expresión_regular_con_la_bandera_pegajosa">Usar una expresión regular con la bandera pegajosa</h3>
-
-<p>La bandera {{JSxRef("Objetos_globales/RegExp/sticky", "sticky")}} indica que la expresión regular realiza una coincidencia permanente en la cadena de destino al intentar hacer coincidir a partir de {{JSxRef("RegExp.prototype.lastIndex")}}.</p>
-
-<pre class="brush: js notranslate">let str = '#foo#'
-let regex = /foo/y
-
-regex.lastIndex = 1
-regex.test(str)      // true
-regex.lastIndex = 5
-regex.test(str)      // false (lastIndex se tiene en cuenta con una bandera pegajosa)
-regex.lastIndex      // 0 (restablecer después de un error de coincidencia)</pre>
-
-<h3 id="La_diferencia_entre_la_bandera_pegajosa_y_la_bandera_global">La diferencia entre la bandera pegajosa y la bandera global</h3>
-
-<p>Con la bandera pegajosa <code>y</code>, la siguiente coincidencia tiene que ocurrir en la posición <code>lastIndex</code>, mientras que con la bandera global <code>g</code>, la coincidencia puede ocurrir en la posición <code>lastIndex</code> o posterior:</p>
-
-<pre class="brush: js notranslate">er = /\d/y;
-while (r = re.exec("123 456")) console.log(r, "Y er.lastIndex", er.lastIndex);
-
-// [ '1', index: 0, input: '123 456', groups: undefined ] AND er.lastIndex 1
-// [ '2', index: 1, input: '123 456', groups: undefined ] AND er.lastIndex 2
-// [ '3', index: 2, input: '123 456', groups: undefined ] AND er.lastIndex 3
-//   ... y no más coincidencias.</pre>
-
-<p>Con la bandera global <code>g</code>, coincidirían los 6 dígitos, no solo 3.</p>
-
-<h3 id="Expresión_regular_y_caracteres_Unicode">Expresión regular y caracteres Unicode</h3>
-
-<p><code>\w</code> y <code>\W</code> solo coincide con caracteres basados en ASCII; por ejemplo, <code>a</code> a <code>z</code>, <code>A</code> a <code>Z</code>, <code>0</code> a <code>9</code> y <code>_</code>.</p>
-
-<p>Para hacer coincidir caracteres de otros idiomas como Cirílico o Hebreo, usa <code>\u<var>hhhh</var></code>, donde <code><var>hhhh</var></code> es el Valor Unicode en hexadecimal.</p>
-
-<p>Este ejemplo demuestra cómo se pueden separar los caracteres Unicode de una palabra.</p>
-
-<pre class="brush: js notranslate">let texto = 'Образец texto на русском языке'
-let regex = /[\u0400-\u04FF]+/g
-
-let match = regex.exec(text)
-console.log(match[0])        // registra 'Образец'
-console.log(regex.lastIndex) // registra '7'
-
-let match2 = regex.exec(texto)
-console.log(match2[0])       // registra 'на' [no registró 'texto']
-console.log(regex.lastIndex) // registra '15'
-
-// y así sucesivamente
-</pre>
-
-<p>La función {{JSxRef("../Guide/Regular_Expressions/Unicode_Property_Escapes", "Escapes de propiedad Unicode")}} presenta una solución, al permitir una declaración tan simple como <code>\p{scx=Cyrl}</code>.</p>
-
-<h3 id="Extraer_el_nombre_de_subdominio_de_la_URL">Extraer el nombre de subdominio de la URL</h3>
-
-<pre class="brush: js notranslate">let url = 'http://xxx.dominio.com'
-console.log(/[^.]+/.exec(url)[0].substr(7)) // registra 'xxx'
-</pre>
-
-<div class="blockIndicator note">
-<p>En lugar de utilizar expresiones regulares para analizar las URL, normalmente es mejor utilizar el analizador de URL integrado en los navegadores mediante la <a href="/es/docs/Web/API/URL_API">API URL</a>.</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-regexp-regular-expression-objects', 'RegExp')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.RegExp")}}</p>
-</div>
-
-<h3 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h3>
-
-<p>A partir de Firefox 34, en el caso de un grupo de captura con cuantificadores que impiden su ejercicio, el texto coincidente para un grupo de captura ahora es <code>undefined</code> en lugar de una cadena vacía:</p>
-
-<pre class="brush: js notranslate">// Firefox 33 o anterior
-'x'.replace(/x(.)?/g, function(m, group) {
-  console.log("'grupo: " + group + "'");
-});
-// 'grupo: '
-
-// Firefox 34 o más reciente
-'x'.replace(/x(.)?/g, function(m, group) {
-  console.log("'grupo: " + group + "'");
-});
-// 'grupo: undefined'
-</pre>
-
-<p>Ten en cuenta que, debido a la compatibilidad web, <code>RegExp.<var>$N</var></code> seguirá devolviendo una cadena vacía en lugar de <code>undefined</code> ({{bug(1053944)}}).</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>El capítulo de {{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}} en la {{JSxRef("../Guide", "Guía de JavaScript")}}</li>
- <li>{{JSxRef("String.prototype.match()")}}</li>
- <li>{{JSxRef("String.prototype.replace()")}}</li>
- <li>{{JSxRef("String.prototype.split()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/regexp/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/regexp/index.html
deleted file mode 100644
index ad3a8c90e9..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/regexp/index.html
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: Constructor RegExp()
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/RegExp
-tags:
-  - Constructor
-  - JavaScript
-  - Referencia
-  - RegExp
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/RegExp
----
-<div>{{JSRef}}</div>
-
-<p>El constructor <strong><code>RegExp</code></strong> crea un objeto de expresión regular para hacer coincidir el texto con un patrón.</p>
-
-<p>Para ver la introducción a las expresiones regulares, lee el {{JSxRef("../Guide/Regular_Expressions", "capítulo sobre expresiones regulares")}} en la {{JSxRef("../Guide", "Guía de JavaScript")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/regexp-constructor.html")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p>Son posibles las notaciones literal, constructor y de fábrica:</p>
-
-<pre class="syntaxbox notranslate">/<var>patrón</var>/<var>banderas</var>
-new RegExp(<var>patrón</var>[, <var>banderas</var>])
-RegExp(<var>patrón</var>[, <var>banderas</var>])
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>patrón</var></code></dt>
- <dd>El texto de la expresión regular.</dd>
- <dd>A partir de ES5, también puede ser otro objeto o <code>RegExp</code> literal (solo para las dos notaciones del constructor RegExp). Los patrones pueden incluir {{JSxRef("../Guide/Regular_Expressions", "caracteres especiales", "#Usar_caracteres_especiales")}} para que coincidan con un rango de valores más amplio que el de una cadena literal.</dd>
- <dt><code><var>banderas</var></code></dt>
- <dd>
- <p>Si se especifica, <code><var>banderas</var></code> es una cadena que contiene las banderas para agregar.</p>
-
- <p>Alternativamente, si se proporciona un objeto para el patrón, la cadena <code><var>banderas</var></code> reemplazará cualquiera de las banderas de ese objeto (y <code>lastIndex</code> se restablecerá a <code>0</code>) (a partir de ES2015).</p>
-
- <p>Si no se especifica <code><var>banderas</var></code> y se proporciona un objeto de expresiones regulares, las banderas de ese objeto (y el valor de <code>lastIndex</code>) se copiarán.</p>
-
- <p><code>banderas</code> puede contener cualquier combinación de los siguientes caracteres:</p>
-
- <dl>
-  <dt><code>g</code> (coincidencia global)</dt>
-  <dd>Encuentra todas las coincidencias en lugar de detenerse después de la primera.</dd>
-  <dt><code>i</code> (ignorar mayúsculas y minúsculas)</dt>
-  <dd>Si el indicador <code>u</code> también está habilitado, utiliza el plegado de mayúsculas y minúsculas Unicode.</dd>
-  <dt><code>m</code> (multilínea)</dt>
-  <dd>Trata los caracteres iniciales y finales (<code>^</code> y <code>$</code>) como si estuvieran trabajando en varias líneas. En otras palabras, hace coincidir el principio o el final de <em>cada</em> línea (delimitada por <code>\n</code> o <code>\r</code>), no solo al principio o final de toda la cadena de entrada.</dd>
-  <dt><code>s</code> («<em>dotAll</em>» o punto para todo)</dt>
-  <dd>Permite que el punto (<code>.</code> coincida con nuevas líneas o no.</dd>
-  <dt><code>u</code> (unicode)</dt>
-  <dd>Trata el <code><var>patrón</var></code> como una secuencia de puntos de código Unicode. (Consulta también <a href="/es/docs/Web/API/DOMString/Binary">Cadenas binarias</a>).</dd>
-  <dt><code>y</code> (sticky)</dt>
-  <dd>Coincide solo con el índice indicado por la propiedad <code>lastIndex</code> de esta expresión regular en la cadena destino. No intenta coincidir con índices posteriores.</dd>
- </dl>
- </dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Notación_literal_y_constructor">Notación literal y constructor</h3>
-
-<p>Hay dos formas de crear un objeto <code>RegExp</code>: una <em>notación literal</em> y un <em>constructor</em>.</p>
-
-<ul>
- <li>Los parámetros de <strong>la notación literal</strong> se encierran entre barras y no utilizan comillas.</li>
- <li>Los parámetros de <strong>la función constructora</strong> no se encierran entre barras, pero utilizan comillas.</li>
-</ul>
-
-<p>Las siguientes tres expresiones crean la misma expresión regular:</p>
-
-<pre class="brush: js notranslate">/ab+c/i
-new RegExp(/ab+c/, 'i') // notación literal
-new RegExp('ab+c', 'i') // constructor
-</pre>
-
-<p>La notación literal da como resultado la compilación de la expresión regular cuando se evalúa la expresión. Utiliza la notación literal cuando la expresión regular permanecerá constante. Por ejemplo, si usas notación literal para construir una expresión regular usada en un bucle, la expresión regular no se volverá a compilar en cada iteración.</p>
-
-<p>El constructor del objeto de expresión regular, por ejemplo, <code>new RegExp('ab+c')</code>, da como resultado la compilación en tiempo de ejecución de la expresión regular. Usa la función constructora cuando sepas que el patrón de la expresión regular cambiará, o no conoces el patrón y lo obtienes de otra fuente, como la entrada del usuario.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-regexp-constructor', 'RegExp constructor')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.RegExp.RegExp")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>El capítulo de {{JSxRef("../Guide/Regular_Expressions", "Expresiones regulares")}} en la {{JSxRef("../Guide", "Guía de JavaScript")}}</li>
- <li>{{JSxRef("String.prototype.match()")}}</li>
- <li>{{JSxRef("String.prototype.replace()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/rightcontext/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/rightcontext/index.html
deleted file mode 100644
index 39530ee1b5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/rightcontext/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: RegExp.rightContext ($')
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/rightContext
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/rightContext
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>La propiedad <strong>rightContext <em>(No es estándar)</em></strong> es una propiedad estática y de solo lectura de expresiones regulares que contiene la subcadena que sigue a la coincidencia más reciente. el alias para esta propiedad es <code>RegExp.$'</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>RegExp</var>.rightContext
-RegExp["$'"]</code>
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad <code>rightContext</code> es estática, no es una propiedad de un objeto de expresión regular individual. Debe usarse como <code>RegExp.rightContext</code> o <code>RegExp["$'"].</code></p>
-
-<p>El valor de la propiedad <code>rightContext</code> es de solo lectura y se modifica cada que hay una coincidencia exitosa.</p>
-
-<p>Tenga presente que no puede usar la abreviatura (<code>RegExp.$'</code>), porque el analizador espera una cadena de inicio, si lo hace optendra un error de sintaxis {{jsxref("SyntaxError")}} , para este caso, usted debe usar corchetes. consulte <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">notación de paréntesis para acceso a la propiedad</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_rightContext_y_'">Usando <code>rightContext</code> y <code>$'</code></h3>
-
-<pre class="brush: js">var re = /hola/g;
-re.test('hola mundo!');
-RegExp.rightContext; // " mundo!"
-RegExp["$'"];       // " mundo!"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No estándar. No forma parte de ninguna especificación actual.</p>
-
-<h2 id="Navegadores_compactibles">Navegadores compactibles</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.builtins.RegExp.rightContext")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{non-standard_inline}} {{jsxref("RegExp.input", "RegExp.input ($_)")}}</li>
- <li>{{non-standard_inline}} {{jsxref("RegExp.lastMatch", "RegExp.lastMatch ($&amp;)")}}</li>
- <li>{{non-standard_inline}} {{jsxref("RegExp.lastParen", "RegExp.lastParen ($+)")}}</li>
- <li>{{non-standard_inline}} {{jsxref("RegExp.leftContext", "RegExp.leftContext ($`)")}}</li>
- <li>{{non-standard_inline}} {{jsxref("RegExp.n", "RegExp.$1-$9")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/test/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/test/index.html
deleted file mode 100644
index 4507b57c97..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/test/index.html
+++ /dev/null
@@ -1,152 +0,0 @@
----
-title: RegExp.prototype.test()
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/test
-tags:
-  - Expresion Regular
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/test
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>test()</strong></code> ejecuta la búsqueda de una ocurrencia entre una expresión regular y una cadena especificada. Devuelve <code>true</code> o <code>false</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>regexObj</var>.test(<var>cadena</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>cadena</code></dt>
- <dd>La cadena a comparar contra la expresión regular.</dd>
-</dl>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>Retorna <code>true</code> si existe una coincidencia entre la expresión regular y la cadena especificada; de lo contrario retorna <code>false</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Use <code>test()</code> cuando desee saber si existe la ocurrencia de un patrón en una cadena (similar al método {{jsxref("String.prototype.search()")}}, la diferencia es que <code>test()</code> devuelve un booleano, mientras que <code>search()</code> devuelve el índice de la coincidencia (si la encuentra) o -1 si no la encuentra).</p>
-
-<p>Si requiere más información (a coste de una ejecución más lenta) utilice el método {{jsxref("RegExp.prototype.exec()", "exec()")}}. Al igual que este último, multiples llamadas a <code>test()</code> sobre la misma instancia global de una expresión regular avanzará desde de la ocurrencia anterior.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_test()">Usando <code>test()</code></h3>
-
-<p>Ejemplo simple que prueba si "hello" está contenido al principio de una cadena y devuelve un valor booleano.</p>
-
-<pre class="brush: js">var cadena = "hello world!";
-var result = /^hello/.test(cadena);
-console.log(result); // true
-</pre>
-
-<p dir="ltr" id="tw-target-text">El siguiente ejemplo registra un mensaje que depende del éxito de la prueba:</p>
-
-<pre class="brush: js">function probarEntrada(regexp, cadena){
-  var subcadena;
-  if (regexp.test(cadena)) {
-    subcadena = ' contiene ';
-  } else {
-    subcadena = ' no contiene ';
-  }
-  console.log(cadena + subcadena + regexp.source);
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definition inicial. Implementado en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.10.6.3', 'RegExp.test')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-regexp.prototype.test', 'RegExp.test')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.test', 'RegExp.test')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Notas_específicas_para_Gecko">Notas específicas para Gecko</h3>
-
-<p>Antes de Gecko 8.0 {{geckoRelease("8.0")}}, <code>test()</code> estaba incorrectamente implementado; cuando era llamado sin parámetros, buscaba emparejar contra el valor de la entrada anterior (la propiedad <code>RegExp.input</code>) en lugar de hacerlo contra la cadena <code>"undefined"</code>. Esto ha sido corregido; ahora <code>/undefined/.test()</code> resulta correctamente en <code>true</code>, en lugar de un error.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>El capítulo <a href="/es/docs/Web/JavaScript/Guide/Regular_Expressions">Expresiones Regulares</a> de la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide">Guía JavaScript</a></li>
- <li>{{jsxref("RegExp")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/regexp/tostring/index.html b/files/es/web/javascript/referencia/objetos_globales/regexp/tostring/index.html
deleted file mode 100644
index 50c10d2bb2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/regexp/tostring/index.html
+++ /dev/null
@@ -1,171 +0,0 @@
----
-title: RegExp.prototype.toString()
-slug: Web/JavaScript/Referencia/Objetos_globales/RegExp/toString
-tags:
-  - Expresion Regular
-  - Prototipo
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/RegExp/toString
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toString()</code></strong> devuelve una cadena que representa el patrón de la expresión regular.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>regexObj</var>.toString();</code></pre>
-
-<h3 id="Valor_de_Retorno">Valor de Retorno</h3>
-
-<p>Una cadena que representa el objeto dado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El objeto {{jsxref("RegExp")}} reemplaza el método <code>toString()</code> del objeto {{jsxref("Object")}}; no hereda de {{jsxref("Object.prototype.toString()")}}. Para objetos {{jsxref("RegExp")}}, el método <code>toString()</code> retorna una cadena que representa el patrón de la expresión regular.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toString()">Usando <code>toString()</code></h3>
-
-<p dir="ltr" id="tw-target-text">El siguiente ejemplo muestra la cadena de representación de un objeto {{jsxref("RegExp")}}:</p>
-
-<pre class="brush: js">var myExp = new RegExp('a+b+c');
-console.log(myExp.toString());  // '/a+b+c/'
-
-var foo = new RegExp('bar', 'g');
-console.log(foo.toString());    // '/bar/g'
-</pre>
-
-<h3 id="Expresiones_regulares_vacías_y_escapado">Expresiones regulares vacías y escapado</h3>
-
-<p>A partir de ECMAScript 5, una expresión regular vacía devuelve la cadena "/(?:)/" y los terminadores de línea tales como "\n" son escapados:</p>
-
-<pre class="brush: js">new RegExp().toString(); // "/(?:)/"
-
-new RegExp('\n').toString() === "/\n/";  // true, antes de ES5
-new RegExp('\n').toString() === "/\\n/"; // true, desde ES5
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table" style="color: #3b3c40; font-size: 14px; font-weight: normal;">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.9.5.2', 'RegExp.prototype.toString')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Agregado de la definición para escapado de caracteres especiales y "(?:)" para expresiones regulares vacías.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-regexp.prototype.tostring', 'RegExp.prototype.toString')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-regexp.prototype.tostring', 'RegExp.prototype.toString')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Escaping</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop(38)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Generic function</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop(39)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Escaping</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile(38)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Generic function</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile(39)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toString()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/@@iterator/index.html b/files/es/web/javascript/referencia/objetos_globales/set/@@iterator/index.html
deleted file mode 100644
index 7445821fc0..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/@@iterator/index.html
+++ /dev/null
@@ -1,86 +0,0 @@
----
-title: 'Set.prototype[@@iterator]()'
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/@@iterator
-tags:
-  - Iteradores
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/@@iterator
----
-<div>{{JSRef}}</div>
-
-<p>El valor inicial de la propiedad <code><strong>@@iterator</strong></code>, es la misma función objeto que el valor inicial de la propiedad {{jsxref("Set.prototype.values()", "values")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/set-prototype-@@iterator.html")}}</div>
-
-<p class="hidden">El código fuente de este ejemplo interactivo lo puedes encontrar en el repositorio de Github. Si quieres contribuir con más ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>mySet</em>[Symbol.iterator]</code></pre>
-
-<h3 id="Valor_retornado"> Valor retornado</h3>
-
-<p>La función <strong>iteradora</strong> <code>Set</code> , la cuál es {{jsxref("Set.prototype.values()", "values()")}} por defecto.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_iterator">Usando <code>[@@iterator]()</code></h3>
-
-<pre class="brush:js">const mySet = new Set();
-mySet.add('0');
-mySet.add(1);
-mySet.add({});
-
-const setIter = mySet[Symbol.iterator]();
-
-console.log(setIter.next().value); // "0"
-console.log(setIter.next().value); // 1
-console.log(setIter.next().value); // Object
-</pre>
-
-<h3 id="Usando_iterator_con_for..of">Usando <code>[@@iterator]()</code> con <code>for..of</code></h3>
-
-<pre class="brush:js">const mySet = new Set();
-mySet.add('0');
-mySet.add(1);
-mySet.add({});
-
-for (const v of mySet) {
-  console.log(v);
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-set.prototype-@@iterator', 'Set.prototype[@@iterator]')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set.prototype-@@iterator', 'Set.prototype[@@iterator]')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página está generada a partir de datos estructurados. Si quieres contribuir con ello, por favor comprueba <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una pull request.</div>
-
-<p>{{Compat("javascript.builtins.Set.@@iterator")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Set.prototype.entries()")}}</li>
- <li>{{jsxref("Set.prototype.keys()")}}</li>
- <li>{{jsxref("Set.prototype.values()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/add/index.html b/files/es/web/javascript/referencia/objetos_globales/set/add/index.html
deleted file mode 100644
index f9385894fb..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/add/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: Set.prototype.add()
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/add
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/add
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>add()</strong></code> añade un nuevo elemento con un valor específico al final del objeto <code>Set</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>mySet</em>.add(value);</code></pre>
-
-<h3 id="Parameters">Parameters</h3>
-
-<dl>
- <dt>value</dt>
- <dd>Requerido. El valor del elemento a ser añadido al objeto <code>Set</code>.</dd>
-</dl>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>El objeto <code>Set</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_add">Usando el método add</h3>
-
-<pre class="brush: js">var mySet = new Set();
-
-mySet.add(1);
-mySet.add(5).add("some text"); // chainable
-
-console.log(mySet);
-// Set [1, 5, "some text"]
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-set.prototype.add', 'Set.prototype.add')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set.prototype.add', 'Set.prototype.add')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("13.0")}}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("13.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Firefox-specific_notes">Firefox-specific notes</h2>
-
-<ul>
- <li>Prior to Firefox 33 {{geckoRelease("33")}}, <code>Set.prototype.add</code> returned <code>undefined</code> and was not chainable. This has been fixed ({{bug(1031632)}}). The behavior can be found in Chrome/v8 as well (<a href="https://code.google.com/p/v8/issues/detail?id=3410">issue</a>).</li>
-</ul>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("Set.prototype.delete()")}}</li>
- <li>{{jsxref("Set.prototype.has()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/clear/index.html b/files/es/web/javascript/referencia/objetos_globales/set/clear/index.html
deleted file mode 100644
index 0fdca7e492..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/clear/index.html
+++ /dev/null
@@ -1,119 +0,0 @@
----
-title: Set.prototype.clear()
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/clear
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Prototype
-  - set
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/clear
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>clear()</strong></code> remueve todos los elementos de un objeto <code>Set</code>.</p>
-
-<h2 id="Syntaxis">Syntaxis</h2>
-
-<pre class="syntaxbox"><code><em>mySet</em>.clear();</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>{{jsxref("undefined")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_clear">Usando el método clear</h3>
-
-<pre class="brush: js">var mySet = new Set();
-mySet.add(1);
-mySet.add("foo");
-
-mySet.size;       // 2
-mySet.has("foo"); // true
-
-mySet.clear();
-
-mySet.size;       // 0
-mySet.has("bar")  // false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-set.prototype.clear', 'Set.prototype.clear')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set.prototype.clear', 'Set.prototype.clear')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("19.0")}}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>{{CompatGeckoMobile("19.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("Set.prototype.delete()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/delete/index.html b/files/es/web/javascript/referencia/objetos_globales/set/delete/index.html
deleted file mode 100644
index 3e5544e06a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/delete/index.html
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: Set.prototype.delete()
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/delete
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/delete
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>delete()</strong></code> remueve el elemento especificado del objeto <code>Set</code>.</p>
-
-<h2 id="Syntaxis">Syntaxis</h2>
-
-<pre class="syntaxbox"><code><em>mySet</em>.delete(value);</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt>valor</dt>
- <dd>Requerido. El valor del elemento a remover del objeto <code>Set</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p><code>true</code> si el elemento ha sido removido exitosamente en el <code>Set</code>; de otra manera retorna <code>false</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_delete">Usando el método <code>delete</code></h3>
-
-<pre class="brush: js">var mySet = new Set();
-mySet.add("foo");
-
-mySet.delete("bar"); // Retorna false. No hay elemento "bar" para ser removido.
-mySet.delete("foo"); // Retorna true.  Removido exitosamente.
-
-mySet.has("foo");    // Retorna false. El elemento "foo" ya no está presente.
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-set.prototype.delete', 'Set.prototype.delete')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set.prototype.delete', 'Set.prototype.delete')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("13.0")}}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("13.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("Set.prototype.clear()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/entries/index.html b/files/es/web/javascript/referencia/objetos_globales/set/entries/index.html
deleted file mode 100644
index ba07d24187..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/entries/index.html
+++ /dev/null
@@ -1,71 +0,0 @@
----
-title: Set.prototype.entries()
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/entries
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/entries
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>entries()</strong></code> devuelve un nuevo objeto de tipo <code>Iterator</code> que contiene<strong> un array de tuplas <code>[value, value]</code></strong> por cada elemento en el <code>Set</code> original, manteniendo el orden de inserción. En los objetos de tipo <code>Set</code> no existe una clave <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">key</span></font> como ocurre en los objetos de tipo <code>Map</code>. Sin embargo, para mantener una API similar a la de los objetos de tipo <code>Map</code>, cada <em>entry</em> contiene el mismo valor para su clave y valor, devolviendo por tanto un array de tuplas <code>[value, value]</code>.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/set-prototype-entries.html")}}</div>
-
-<p class="hidden">El código de este ejemplo interactivo esta almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interativos, simplemente clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>mySet</em>.entries()</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un nuevo objeto de tipo <code>Iterator</code> que contiene un array de tuplas <code>[value, value]</code> por cada elemento en el <code>Set</code> original, en orden de inserción.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_entries">Usando el método <code>entries</code></h3>
-
-<pre class="brush:js">var mySet = new Set();
-mySet.add('foobar');
-mySet.add(1);
-mySet.add('baz');
-
-var setIter = mySet.entries();
-
-console.log(setIter.next().value); // ["foobar", "foobar"]
-console.log(setIter.next().value); // [1, 1]
-console.log(setIter.next().value); // ["baz", "baz"]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Commentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-set.prototype.entries', 'Set.prototype.entries')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set.prototype.entries', 'Set.prototype.entries')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página ha sido generada a partir de datos estructurados. Si te apetece contribuir, comprueba <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos una pull request.</div>
-
-<p>{{Compat("javascript.builtins.Set.entries")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Set.prototype.keys()")}}</li>
- <li>{{jsxref("Set.prototype.values()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/has/index.html b/files/es/web/javascript/referencia/objetos_globales/set/has/index.html
deleted file mode 100644
index e133de2d00..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/has/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: Set.prototype.has()
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/has
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Prototype
-  - set
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/has
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>has()</strong></code> retorna un booleano indicando si el elemento especificado existe en el objeto <code>Set</code> o no.</p>
-
-<h2 id="Syntaxis">Syntaxis</h2>
-
-<pre class="syntaxbox"><code><em>mySet</em>.has(value);</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt>valor</dt>
- <dd>Requerido. El valor del cual se probará su presencia en el objeto <code>Set</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<dl>
- <dt>Booleano</dt>
- <dd>Retorna <code>true</code> si el elemento con el valor especificado existe en el objeto  <code>Set</code>; de otra manera retorna <code>false</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_has">Usando el método <code>has</code></h3>
-
-<pre class="brush: js">var mySet = new Set();
-mySet.add("foo");
-
-mySet.has("foo");  // retorna true
-mySet.has("bar");  // retorna false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-set.prototype.has', 'Set.prototype.has')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set.prototype.has', 'Set.prototype.has')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("13.0")}}</td>
-   <td>11</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("13.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("Set.prototype.add()")}}</li>
- <li>{{jsxref("Set.prototype.delete()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/index.html b/files/es/web/javascript/referencia/objetos_globales/set/index.html
deleted file mode 100644
index db091b3a59..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/index.html
+++ /dev/null
@@ -1,230 +0,0 @@
----
-title: Set
-slug: Web/JavaScript/Referencia/Objetos_globales/Set
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Object
-  - set
-translation_of: Web/JavaScript/Reference/Global_Objects/Set
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>Set</code></strong> permite almacenar valores únicos de cualquier tipo, incluso {{Glossary("Primitive", "valores primitivos")}} u referencias a objetos.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">new Set([iterable]);</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>iterable</dt>
- <dd>Si un <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">objeto iterable </a>es pasado, todos sus elementos serán añadidos al nuevo Set. Si no se especifica este parámetro, o si su valor es <code>null,</code> el nuevo <code>Set</code> estará vacío.</dd>
-</dl>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Una nueva instancia de <code>Set</code>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los objetos <code><strong>Set</strong></code> son colecciones de valores. Se puede iterar sus elementos en el orden de su inserción. Un valor en un <code>Set</code> <strong>sólo puede estar una vez</strong>; éste es único en la colección <code>Set</code>.</p>
-
-<h3 id="Igualdad_de_valores">Igualdad de valores</h3>
-
-<p>Ya que cada valor en el Set tiene que ser único, la igualdad del valor será comprobada y esta igualdad no se basa en el mismo algoritmo usado en el operador <code>===</code>. Específicamente, para Sets, <code>+0</code> (el cual es estrictamente igual a <code>-0</code>) y <code>-0</code> son valores distintos. Sin embargo, esto ha cambiado en la última especificación ECMAScript 6. Iniciando con Gecko 29.0 {{geckoRelease("29")}} ({{bug("952870")}}) y un <a href="https://code.google.com/p/v8/issues/detail?id=3069">recent nightly Chrome</a>, <code>+0</code> y <code>-0</code> son tratados como el mismo valor en objetos <code>Set</code>. </p>
-
-<p><code>NaN</code> y <code>undefined</code> también pueden ser almacenados en un Set. <code>NaN</code> es considerado igual que <code>NaN</code> (A pesar que <code>NaN !== NaN</code>).</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>Set.length</code></dt>
- <dd>El valor de la propiedad <code>length</code> es 0.</dd>
- <dt>{{jsxref("Set.@@species", "get Set[@@species]")}}</dt>
- <dd>La función constructora que es usada para crear objetos derivados.</dd>
- <dt>{{jsxref("Set.prototype")}}</dt>
- <dd>Representa el prototipo para el constructor Set. Permite la adición de propiedades a todos los objetos Set.</dd>
-</dl>
-
-<h2 id="Instancias_Set">Instancias <code>Set</code></h2>
-
-<p>Todas las instancias de <code>Set</code> heredan de {{jsxref("Set.prototype")}}.</p>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Set/prototype','Properties')}}</p>
-
-<h3 id="Métodos">Métodos</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Set/prototype','Methods')}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_objeto_Set">Usando el objeto <code>Set</code></h3>
-
-<pre class="brush: js">const mySet = new Set();
-
-mySet.add(1);
-mySet.add(5);
-mySet.add('some text');
-
-const o = {a: 1, b: 2};
-mySet.add(o);
-
-<code>mySet.add({a: 1, b: 2}); // La variable "o" referencia a otro objeto, por lo que agrega otro valor.
-</code>
-mySet.has(1); // true
-mySet.has(3); // false, 3 no ha sido añadido al Set
-mySet.has(5);              // true
-mySet.has(Math.sqrt(25));  // true
-mySet.has('Some Text'.toLowerCase()); // true
-mySet.has(o); // true
-
-mySet.size; // 5
-
-mySet.delete(5); // Elimina 5 del Set
-mySet.has(5);    // false, 5 fue eliminado
-
-mySet.size; // 4, sólo removimos un valor
-<code>console.log(mySet);// Set {1, "some text", Object {a: 1, b: 2}, Object {a: 1, b: 2}}</code></pre>
-
-<h3 id="Iterando_los_Sets">Iterando los Sets</h3>
-
-<pre class="brush: js">// iterar todos los items de un set
-// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
-for (let item of mySet) console.log(item);
-
-// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
-for (let item of mySet.keys()) console.log(item);
-
-// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
-for (let item of mySet.values()) console.log(item);
-
-// imprimir en consola los items en orden: 1, 'some text', {a: 1, b: 2}
-//(key y value poseen en mismo valor en este caso)
-for (let [key, value] of mySet.entries()) console.log(key);
-
-// crear un Array plano con los mismos valores, utilizando Array.from
-const myArr = Array.from(mySet); // [1, 'some text', {a: 1, b: 2}]
-
-// también se puede utilizar para guardar elementos del DOM
-mySet.add(document.body);
-mySet.has(document.querySelector('body')); // true
-
-// crear un Array plano con los mismos valores, utilizando propagación
-const mySet2 = new Set([1,2,3,4]);
-mySet2.size; // 4
-[...mySet2]; // [1,2,3,4]
-
-// la intersección entre dos sets puede ser simulada con
-const intersection = <code>new Set([...set1].filter(x =&gt; set2.has(x)));</code>
-
-<code>// la diferencia puede ser simulada con
-const difference = new Set([...set1].filter(x =&gt; !set2.has(x)));</code>
-
-// Iteración utilizando forEach
-mySet.forEach((value) =&gt; {
-  console.log(value);
-});
-
-// 1
-// 2
-// 3
-// 4</pre>
-
-<h3 id="Implementando_operaciones_básicas">Implementando operaciones básicas</h3>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>isSuperset <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>subset<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> subset<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span><span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-            <span class="keyword token">return</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
-        <span class="punctuation token">}</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">return</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>union <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">var</span> union <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        union<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">return</span> union<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>intersection <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">var</span> intersection <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">has</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-            intersection<span class="punctuation token">.</span><span class="function token">add</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">;</span>
-        <span class="punctuation token">}</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">return</span> intersection<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-Set<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>difference <span class="operator token">=</span> <span class="keyword token">function</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">var</span> difference <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> elem <span class="keyword token">of</span> setB<span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        difference<span class="punctuation token">.</span><span class="keyword token">delete</span><span class="punctuation token">(</span>elem<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">return</span> difference<span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="comment token">//Examples</span>
-<span class="keyword token">var</span> setA <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">[</span><span class="number token">1</span><span class="punctuation token">,</span><span class="number token">2</span><span class="punctuation token">,</span><span class="number token">3</span><span class="punctuation token">,</span><span class="number token">4</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
-    setB <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">[</span><span class="number token">2</span><span class="punctuation token">,</span><span class="number token">3</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">,</span>
-    setC <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">Set</span><span class="punctuation token">(</span><span class="punctuation token">[</span><span class="number token">3</span><span class="punctuation token">,</span><span class="number token">4</span><span class="punctuation token">,</span><span class="number token">5</span><span class="punctuation token">,</span><span class="number token">6</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-setA<span class="punctuation token">.</span><span class="function token">isSuperset</span><span class="punctuation token">(</span>setB<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; true</span>
-setA<span class="punctuation token">.</span><span class="function token">union</span><span class="punctuation token">(</span>setC<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; Set [1, 2, 3, 4, 5, 6]</span>
-setA<span class="punctuation token">.</span><span class="function token">intersection</span><span class="punctuation token">(</span>setC<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; Set [3, 4]</span>
-setA<span class="punctuation token">.</span><span class="function token">difference</span><span class="punctuation token">(</span>setC<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// =&gt; Set [1, 2]</span></code></pre>
-
-<h3 id="Relación_con_los_objetos_Array">Relación con los objetos <code>Array</code></h3>
-
-<pre class="brush: js">const myArray = ['value1', 'value2', 'value3'];
-
-// Utiliza el constructor para para crear un set con el mismo contenido que un array
-const mySet = new Set(myArray);
-
-mySet.has('value1'); // devuelve true
-
-// Utiliza la propagación para crear un array con los contenidos de un set
-console.log([...mySet]); // Muestra lo mismo utilizando myArray</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-set-objects', 'Set')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set-objects', 'Set')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada desde información estructurada. Si desea contribuir, por favor revise la información en <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envie un pull request/merge request.</div>
-
-<p>{{Compat("javascript.builtins.Set")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
- <li>{{jsxref("WeakMap")}}</li>
- <li>{{jsxref("WeakSet")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/size/index.html b/files/es/web/javascript/referencia/objetos_globales/set/size/index.html
deleted file mode 100644
index 444ad7ae8a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/size/index.html
+++ /dev/null
@@ -1,106 +0,0 @@
----
-title: Set.prototype.size
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/size
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/size
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad de acceso <code><strong>size</strong></code> devuelve el número de elementos que hay en el objeto {{jsxref("Set")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El valor de <code>size</code> es un entero que representa cuantas entradas tiene el objeto <code>Set</code>. La función de accesso set para <code>size</code> es <code>undefined</code>; no se puede cambiar esta propiedad.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_size">Usando <code>size</code></h3>
-
-<pre class="brush:js">var mySet = new Set();
-mySet.add(1);
-mySet.add(5);
-mySet.add("un texto")
-
-mySet.size; // 3
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-get-set.prototype.size', 'Set.prototype.size')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-get-set.prototype.size', 'Set.prototype.size')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>38</td>
-   <td>{{ CompatGeckoDesktop("19") }} [1]</td>
-   <td>{{ CompatIE("11") }}</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("19")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>[1] From Gecko 13 (Firefox 13 / Thunderbird 13 / SeaMonkey 2.10) to Gecko 18 (Firefox 18 / Thunderbird 18 / SeaMonkey 2.15 / Firefox OS 1.0.1 / Firefox OS 1.1) la propiedad size fue implementado como un método <code>Set.prototype.size()</code>, esto fue cambiado a una propiedad en versiones posteriores conforme la especificación ECMAScript 6 (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=807001">bug 807001</a>).</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Set")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/set/values/index.html b/files/es/web/javascript/referencia/objetos_globales/set/values/index.html
deleted file mode 100644
index 8b7ec88ece..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/set/values/index.html
+++ /dev/null
@@ -1,72 +0,0 @@
----
-title: Set.prototype.values()
-slug: Web/JavaScript/Referencia/Objetos_globales/Set/values
-translation_of: Web/JavaScript/Reference/Global_Objects/Set/values
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>values()</strong></code> retorna un objeto de tipo <code>Iterator</code> que contiene los valores para cada elemento en el objecto <code>Set</code> en orden de inserción.</p>
-
-<p>El metodo <strong><code>keys()</code></strong> es un alias para este metodo (por similaridad con objetos {{jsxref("Map")}}); se comporta exactamente igual y retorna <strong>valores</strong> para cada elemento de un <code>Set</code>.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/set-prototype-values.html")}}</div>
-
-
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code><em>mySet</em>.values();
-</code></pre>
-
-<h3 id="Return_value">Return value</h3>
-
-<p>Un nuevo objeto <code><strong>Iterator</strong></code> que contiene los valores para cada elemento en el <code>Set</code> dado,  en orden de inserción.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_values">Using <code>values()</code></h3>
-
-<pre class="brush:js">var mySet = new Set();
-mySet.add('foo');
-mySet.add('bar');
-mySet.add('baz');
-
-var setIter = mySet.values();
-
-console.log(setIter.next().value); // "foo"
-console.log(setIter.next().value); // "bar"
-console.log(setIter.next().value); // "baz"</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-set.prototype.values', 'Set.prototype.values')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-set.prototype.values', 'Set.prototype.values')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Set.values")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Set.prototype.entries()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/anchor/index.html b/files/es/web/javascript/referencia/objetos_globales/string/anchor/index.html
deleted file mode 100644
index c34abd62b1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/anchor/index.html
+++ /dev/null
@@ -1,56 +0,0 @@
----
-title: String.prototype.anchor()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/anchor
-tags:
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/anchor
----
-<div>{{JSRef("Objetos_globales", "String")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <strong><code>anchor()</code></strong> crea un ancla HTML, {{HTMLElement("a")}}, que se usa como un enlace a hipertexto.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.anchor(<em>nombreAtributo</em>)</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>nombreAtributo</code></dt>
- <dd>Una cadena.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Usa el método <code>anchor</code> con los métodos <code>document.write</code> o <code>document.writeln</code> para crear y mostrar programando un ancla en un documento. Crea el ancla con el método <code>anchor</code>, y entonces llama a <code>write</code> o <code>writeln</code> para mostrar el ancla en el documento. En JavaScript en el lado Servidor, usa la función <code>write</code> para mostrar el ancla.</p>
-
-<p>En la sintaxis, la cadena de texto representa el texto literal que usted quiere que el usuario vea. La cadena <code>nombreAtributo</code> representa el atributo <code>NAME</code> de la etiqueta A.</p>
-
-<p>Los anclas creados con el método <code>anchor</code> serán elementos del arreglo {{domxref("document.anchors")}}</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_anchor" name="Ejemplo:_Usando_anchor">Ejemplo: Usando <code>anchor</code></h3>
-
-<p>El siguiente código de ejemplo dentro de un elemento HTML <code>script</code>:</p>
-
-<pre class="brush: js">var miCadena = "Tabla de Contenidos";
-document.body.innerHTML = miCadena.anchor("ancla_contenidos");
-</pre>
-
-<p>obtendrá el siguiente HTML:</p>
-
-<pre class="brush: html">&lt;a name="ancla_contenidos"&gt;Tabla de Contenidos&lt;/A&gt;
-</pre>
-
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-
-<ul>
- <li>{{jsxref("String.prototype.link()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/big/index.html b/files/es/web/javascript/referencia/objetos_globales/string/big/index.html
deleted file mode 100644
index 0aa04e5b74..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/big/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: String.prototype.big()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/big
-tags:
-  - Deprecated
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/big
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<p>{{deprecated_header}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Provoca que una cadena sea mostrada con un tamaño de fuente grade, como si estuviese en una etiqueta {{HTMLElement("big")}}.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.big()</pre>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Usa el método <code>big</code> para formatear y mostrar una cadena en un documento.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_big" name="Ejemplo:_Usando_big">Ejemplo: Usando <code>big</code></h3>
-
-<p>El siguiente ejemplo usa los métodos de <code>string</code> para cambiar el tamañó de una cadena:</p>
-
-<pre>var cadenaMundo="¡Hola Mundo!";
-
-console.log(cadenaMundo.small());
-console.log("&lt;P&gt;" + cadenaMundo.big());
-console.log("&lt;P&gt;" + cadenaMundo.fontsize(7));
-</pre>
-
-<p>Este ejemplo produce el mismo resultado que el siguiente HTML:</p>
-
-<pre>&lt;small&gt;¡Hola Mundo!&lt;/small&gt;
-&lt;p&gt;&lt;big&gt;¡Hola Mundo!&lt;/big&gt;
-&lt;p&gt;&lt;fontsize=7&gt;¡Hola Mundo!&lt;/fontsize&gt;
-</pre>
-
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-
-<ul>
- <li>{{jsxref("String.prototype.fontsize()")}}</li>
- <li>{{jsxref("String.prototype.small()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/blink/index.html b/files/es/web/javascript/referencia/objetos_globales/string/blink/index.html
deleted file mode 100644
index cf49f3d840..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/blink/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: String.prototype.blink()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/blink
-tags:
-  - Deprecated
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/blink
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<p>{{deprecated_header}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Causa que una cadena parpadee como si estuviese en una etiqueta {{HTMLElement("blink")}}.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox"><em>cadena</em>.blink()</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Usa el método <code>blink</code> para formatear y mostrar una cadena en un documento.</p>
-<h2 id="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el formateado de una cadena</h3>
-<p>El siguiente ejemplo usa métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
-<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
-
-console.log(cadenaMundo.blink())
-console.log(cadenaMundo.bold())
-console.log(cadenaMundo.italics())
-console.log(cadenaMundo.strike())
-</pre>
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-<pre class="brush: html">&lt;blink&gt;¡Hola mundo!&lt;/blink&gt;
-&lt;b&gt;¡Hola mundo!&lt;/b&gt;
-&lt;i&gt;¡Hola mundo!&lt;/b&gt;
-&lt;strike&gt;¡Hola mundo!&lt;/strike&gt;
-</pre>
-<h2 id="Vea_tambi.C3.A9n" name="Vea_tambi.C3.A9n">Vea también</h2>
-<ul>
- <li>{{jsxref("String.prototype.bold()")}}</li>
- <li>{{jsxref("String.prototype.italics()")}}</li>
- <li>{{jsxref("String.prototype.strike()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/bold/index.html b/files/es/web/javascript/referencia/objetos_globales/string/bold/index.html
deleted file mode 100644
index cc7c841181..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/bold/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: String.prototype.bold()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/bold
-tags:
-  - Deprecated
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/bold
----
-<p>{{JSRef("Objetos_globales", "String")}}<br>
- <br>
- {{Deprecated_header}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Provoca que una cadena se muestre en negrita como si estuviera en una etiqueta {{HTMLElement("b")}}.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox"><em>cadena</em>.bold()</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Usa el método <code>bold</code> para formatear y mostrar una cadena en un documento.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el formateado de una cadena</h3>
-<p>El siguiente ejemplo usa métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
-<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
-
-console.log(cadenaMundo.blink())
-console.log(cadenaMundo.bold())
-console.log(cadenaMundo.italics())
-console.log(cadenaMundo.strike())
-</pre>
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-<pre class="brush: html">&lt;blink&gt;¡Hola mundo!&lt;/blink&gt;
-&lt;b&gt;¡Hola mundo!&lt;/b&gt;
-&lt;i&gt;¡Hola mundo!&lt;/i&gt;
-&lt;strike&gt;¡Hola mundo!&lt;/strike&gt;
-</pre>
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-<ul>
- <li>{{jsxref("String.prototype.blink()")}}</li>
- <li>{{jsxref("String.prototype.italics()")}}</li>
- <li>{{jsxref("String.prototype.strike()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/charat/index.html b/files/es/web/javascript/referencia/objetos_globales/string/charat/index.html
deleted file mode 100644
index 6ef6d46e37..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/charat/index.html
+++ /dev/null
@@ -1,143 +0,0 @@
----
-title: String.prototype.charAt()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/charAt
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/charAt
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <strong><code>charAt() </code></strong><code>de</code><strong><code> </code></strong>{{jsxref("String")}} devuelve en un nuevo String el carácter UTF-16 de una cadena.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>str</em>.charAt(<em>indice</em>)</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>indice</code></dt>
- <dd>Un entero entre 0 y 1 menos que la longitud de la cadena. Si no se proporciona ningún indice charAt() utilizará 0.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Los caracteres de una cadena se indexan de izquierda a derecha. El índice del primer caracter es 0, y el índice del último caracter en una cadena llamada <code>nombreCadena</code> es <code>nombreCadena.length - 1</code>. Si el <code>indice</code> que usted proporciona está fuera del rango, JavaScript devuelve una cadena vacía.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Mostrando_caracteres_de_diferentes_localizaciones_en_una_cadena" name="Ejemplo:_Mostrando_caracteres_de_diferentes_localizaciones_en_una_cadena">Ejemplo: Mostrando caracteres de diferentes localizaciones en una cadena</h3>
-
-<p>El siguiente ejemplo muestra caracteres de diferentes localizaciones en la cadena "<code>Brave new world</code>":</p>
-
-<pre class="brush: js">var cualquierCadena="Brave new world";
-
-console.log("El carácter en el índice 0 es '" + cualquierCadena.charAt(0) + "'")
-console.log("El carácter en el índice 1 es '" + cualquierCadena.charAt(1) + "'")
-console.log("El carácter en el índice 2 es '" + cualquierCadena.charAt(2) + "'")
-console.log("El carácter en el índice 3 es '" + cualquierCadena.charAt(3) + "'")
-console.log("El carácter en el índice 4 es '" + cualquierCadena.charAt(4) + "'")
-console.log("El carácter en el índice 999 es '" + cualquierCadena.charAt(999) + "'")
-</pre>
-
-<p>Estas líneas muestran lo siguiente:</p>
-
-<pre>El carácter en el índice 0 es 'B'
-El carácter en el índice 1 es 'r'
-El carácter en el índice 2 es 'a'
-El carácter en el índice 3 es 'v'
-El carácter en el índice 4 es 'e'
-El carácter en el índice 999 es ''
-</pre>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Estándar</td>
-   <td>Primera definición</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.4', 'String.prototype.charAt')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.charat', 'String.prototype.charAt')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.indexOf()")}}, {{jsxref("String.prototype.lastIndexOf()")}}</li>
- <li>{{jsxref("String.prototype.split()")}}</li>
- <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
- <li>{{jsxref("String.fromCodePoint()")}}</li>
- <li>{{jsxref("String.prototype.codePointAt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/charcodeat/index.html b/files/es/web/javascript/referencia/objetos_globales/string/charcodeat/index.html
deleted file mode 100644
index 4eccf78f13..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/charcodeat/index.html
+++ /dev/null
@@ -1,65 +0,0 @@
----
-title: String.prototype.charCodeAt()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/charCodeAt
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-  - Unicode
-translation_of: Web/JavaScript/Reference/Global_Objects/String/charCodeAt
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El <code><strong>charCodeAt()</strong></code> método devuelve un número indicando el valor Unicode del carácter en el índice proporcionado.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.charCodeAt(<em>indice</em>);
-</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>indice</code></dt>
- <dd>Un entero entre 0 y 1 menos que la longitud de la cadena; si no se especifica, su valor predeterminado es 0.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>El rango del código Unicode va del 0 al 1,114,111<span class="comment">0x10FFFF</span>. Los primeros 128 códigos de Unicode encajan directamente con los códigos de caractéres de la codificación ASCII. Para información sobre Unicode, vea la <a href="/es/docs/Web/JavaScript/Guide/Valores,_variables_y_literales#Unicode">Guía de JavaScript</a>. Observe que <code>charCodeAt</code> siempre devolverá un valor menor de 65.536.</p>
-
-<p><code>charCodeAt</code> devuelve {{jsxref("NaN")}} si el indice proporcionado no está entre 0 y 1 menos de la longitud de la cadena.</p>
-
-<p>En JavaScript 1.2 el método <code>charCodeAt</code> devuelve un número indicando el valor de la hoja de códigos ISO-Latin-1 del carácter correspondiente al índice proporcionado. El rango de la hoja de códigos ISO-Latin-1 va del 0 al 255. Del 0 al 127 encajan directamente con la hoja de códigos ASCII.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_charCodeAt" name="Ejemplo:_Usando_charCodeAt">Ejemplo: Usando <code>charCodeAt</code></h3>
-
-<p>El siguiente ejemplo devuelve 65, el valor Unicode para A. </p>
-
-<pre class="eval">"ABC".charCodeAt(0) // returns 65
-</pre>
-
-<p>El siguiente ejemplo devuelve 83.</p>
-
-<pre>"AaSdas".charCodeAt(2) // returns 83
-</pre>
-
-<p>teniendo en cuenta que 2 es la posicion de la letra. Si `S` fuera minuscula, el Unicode es diferente</p>
-
-<pre>"Aasdas".charCodeAt(2) // returns 115</pre>
-
-<p> </p>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.fromCharCode()")}}</li>
- <li>{{jsxref("String.prototype.charAt()")}}</li>
- <li>{{jsxref("String.fromCodePoint()")}}</li>
- <li>{{jsxref("String.prototype.codePointAt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/codepointat/index.html b/files/es/web/javascript/referencia/objetos_globales/string/codepointat/index.html
deleted file mode 100644
index ae3fef3ec8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/codepointat/index.html
+++ /dev/null
@@ -1,127 +0,0 @@
----
-title: String.prototype.codePointAt()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/codePointAt
-translation_of: Web/JavaScript/Reference/Global_Objects/String/codePointAt
----
-<div>{{JSRef}}</div>
-
-<div> </div>
-
-<div>El método <strong><code>codePointAt() </code></strong><code>d</code>evuelve un entero no negativo que equivale al valor Unicode code point del carácter.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>str</var>.codePointAt(<var>indice</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>indice</code></dt>
- <dd>Índice del carácter en la cadena del que se quiere obtener el valor del Unicode code point.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un número que equivale al valor code point del carácter especificado en el índice de la cadena; devuelve {{jsxref("undefined")}} si no se encuentra carácter en la posición especifica.</p>
-
-<h2 id="Description">Description</h2>
-
-<p>If there is no element at the specified position, {{jsxref("undefined")}} is returned. If no UTF-16 surrogate pair begins at <code>pos</code>, the code unit at <code>pos</code> is returned.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_codePointAt()">Using <code>codePointAt()</code></h3>
-
-<pre class="brush: js">'ABC'.codePointAt(1);          // 66
-'\uD800\uDC00'.codePointAt(0); // 65536
-
-'XYZ'.codePointAt(42); // undefined
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>The following extends Strings to include the <code>codePointAt()</code> function as specified in ECMAScript 2015 for browsers not supporting it natively.</p>
-
-<pre class="brush: js">/*! http://mths.be/codepointat v0.1.0 by @mathias */
-if (!String.prototype.codePointAt) {
-  (function() {
-    'use strict'; // needed to support `apply`/`call` with `undefined`/`null`
-    var codePointAt = function(position) {
-      if (this == null) {
-        throw TypeError();
-      }
-      var string = String(this);
-      var size = string.length;
-      // `ToInteger`
-      var index = position ? Number(position) : 0;
-      if (index != index) { // better `isNaN`
-        index = 0;
-      }
-      // Account for out-of-bounds indices:
-      if (index &lt; 0 || index &gt;= size) {
-        return undefined;
-      }
-      // Get the first code unit
-      var first = string.charCodeAt(index);
-      var second;
-      if ( // check if it’s the start of a surrogate pair
-        first &gt;= 0xD800 &amp;&amp; first &lt;= 0xDBFF &amp;&amp; // high surrogate
-        size &gt; index + 1 // there is a next code unit
-      ) {
-        second = string.charCodeAt(index + 1);
-        if (second &gt;= 0xDC00 &amp;&amp; second &lt;= 0xDFFF) { // low surrogate
-          // http://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae
-          return (first - 0xD800) * 0x400 + second - 0xDC00 + 0x10000;
-        }
-      }
-      return first;
-    };
-    if (Object.defineProperty) {
-      Object.defineProperty(String.prototype, 'codePointAt', {
-        'value': codePointAt,
-        'configurable': true,
-        'writable': true
-      });
-    } else {
-      String.prototype.codePointAt = codePointAt;
-    }
-  }());
-}
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-string.prototype.codepointat', 'String.prototype.codePointAt')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.codepointat', 'String.prototype.codePointAt')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.codePointAt")}}</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("String.fromCodePoint()")}}</li>
- <li>{{jsxref("String.fromCharCode()")}}</li>
- <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
- <li>{{jsxref("String.prototype.charAt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/concat/index.html b/files/es/web/javascript/referencia/objetos_globales/string/concat/index.html
deleted file mode 100644
index d00ffce70e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/concat/index.html
+++ /dev/null
@@ -1,90 +0,0 @@
----
-title: String.prototype.concat()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/concat
-tags:
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - String
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/concat
----
-<div>{{JSRef}}</div>
-
-<p><span class="seoSummary">El método <strong><code>concat()</code></strong> combina dos o más cadenas de texto y devuelve una cadena de texto nueva.</span></p>
-
-<div>{{EmbedInteractiveExample("pages/js/string-concat.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>str</var>.concat(<var>str2</var> [, ...<var>strN</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>str2</var> [, ...<var>strN</var>]</code></dt>
- <dd>Cadenas que se concatenarán con <code><var>str</var></code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una nueva cadena que contiene el texto combinado de las cadenas proporcionadas.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La función <code>concat()</code> concatena los argumentos de tipo texto con la cadena de sobre la que se llama a la función y devuelve una nueva cadena de texto. Los cambios en la cadena original o la cadena devuelta no afectan al otro.</p>
-
-<p>Si los argumentos no son de tipo texto, son convertidos a texto antes de concatenarlos</p>
-
-<h2 id="Rendimiento">Rendimiento</h2>
-
-<p>Es altamente recomendado que se utilicen {{jsxref("Operators/Assignment_Operators", "operadores de asignación", "", 1)}} (<code>+</code>, <code>+=</code>) en lugar del método <code>concat()</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_concat">Usando concat()</h3>
-
-<p>El siguiente ejemplo combina cadenas de texto en una nueva.</p>
-
-<pre class="brush: js notranslate">let hello = 'Hello, '
-console.log(hello.concat('Kevin', '. Have a nice day.'))
-// Hello, Kevin. Have a nice day.
-
-let greetList = ['Hello', ' ', 'Venkat', '!']
-"".concat(...greetList)  // "Hello Venkat!"
-
-"".concat({})    // [object Object]
-"".concat([])    // ""
-"".concat(null)  // "null"
-"".concat(true)  // "true"
-"".concat(4, 5)  // "45"
-
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.concat', 'String.prototype.concat')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.String.concat")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.concat()")}}</li>
- <li>{{jsxref("Operators/Assignment_Operators", "Operadores de asignación", "", 1)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/endswith/index.html b/files/es/web/javascript/referencia/objetos_globales/string/endswith/index.html
deleted file mode 100644
index cbeac4f481..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/endswith/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: String.prototype.endsWith()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/endsWith
-tags:
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - String
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/endsWith
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>endsWith()</code></strong> determina si una cadena de texto termina con los caracteres de una cadena indicada, devolviendo <code>true</code> o <code>false</code> según corresponda.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/string-endswith.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>str</var>.endsWith(<var>searchString</var>[, <var>position</var>])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>searchString</var></code></dt>
- <dd>Los caracteres a buscar hasta el final de la cadena <em><code>str</code></em>.</dd>
- <dt><code><var>length</var></code> {{optional_inline}}</dt>
- <dd>Si se indica, se utiliza como el tamaño de <em><code>str</code></em>. Por defecto se usa <code><em>str</em>.length</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p><strong><code>true</code></strong> si los caracteres proporcionados se encuentran al final de la cadena de texto; en caso contrario, <strong><code>false</code></strong>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Este método determina si una cadena de texto termina en otra cadena o no. Este método distingue entre mayúsculas y minúsculas.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este método ha sido añadido a la especificación ECMAScript 6 y puede no estar disponible en todas las implementaciones de JavaScript. Sin embargo, puedes implementar el polyfill <code>String.prototype.endsWith()</code> con el siguiente fragmento de código:</p>
-
-<pre class="brush: js notranslate">if (!String.prototype.endsWith) {
-	String.prototype.endsWith = function(search, this_len) {
-		if (this_len === undefined || this_len &gt; this.length) {
-			this_len = this.length;
-		}
-		return this.substring(this_len - search.length, this_len) === search;
-	};
-}
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_endsWith">Usando <code>endsWith()</code></h3>
-
-<pre class="brush: js notranslate">let str = 'To be, or not to be, that is the question.'
-
-console.log(str.endsWith('question.'))  // true
-console.log(str.endsWith('to be'))      // false
-console.log(str.endsWith('to be', 19))  // true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.endswith', 'String.prototype.endsWith')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{Compat("javascript.builtins.String.endsWith")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.startsWith()")}}</li>
- <li>{{jsxref("String.prototype.includes()")}}</li>
- <li>{{jsxref("String.prototype.indexOf()")}}</li>
- <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/fixed/index.html b/files/es/web/javascript/referencia/objetos_globales/string/fixed/index.html
deleted file mode 100644
index 3d188bc39d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/fixed/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: String.prototype.fixed()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/fixed
-tags:
-  - Deprecated
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/fixed
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<p>{{deprecated_header}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Causa que una cadena se muestre con una fuente de ancho fijo, como si estuviesde dentro de una <span class="external">etiqueta {{HTMLElement("tt")}}</span>.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox"><em>cadena</em>.fixed()</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Usa el método <code>fixed</code> para formatear y mostrar unacadena en un documento.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_fixed_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_fixed_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando <code>fixed</code> para cambiar el formateado de una cadena</h3>
-<p>El siguiente ejemplo usa el método <code>fixed</code> para cambiar el formateado de una cadena:</p>
-<pre class="brush: js">var cadenaMundo="¡Hola Mundo!"
-console.log(cadenaMundo.fixed())
-</pre>
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-<pre class="brush: html">&lt;tt&gt;¡Hola Mundo!&lt;/tt&gt;
-</pre>
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-<ul>
- <li>{{jsxref("String.prototype.bold()")}}</li>
- <li>{{jsxref("String.prototype.italics()")}}</li>
- <li>{{jsxref("String.prototype.strike()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/fontcolor/index.html b/files/es/web/javascript/referencia/objetos_globales/string/fontcolor/index.html
deleted file mode 100644
index 135e805cb2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/fontcolor/index.html
+++ /dev/null
@@ -1,122 +0,0 @@
----
-title: String.prototype.fontcolor()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/fontcolor
-translation_of: Web/JavaScript/Reference/Global_Objects/String/fontcolor
----
-<div>{{JSRef}} {{deprecated_header}}</div>
-
-<p><code>El método </code><strong><code>fontcolor()</code></strong> crea {{HTMLElement("font")}} elemento HTML que cambia el color de la cadena.</p>
-
-<div class="note">
-<p><strong>Usage note:</strong> La etiqueta &lt;font&gt; fue eliminada en <a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> y no debe ser usada. En lugar de es, es necesario aplicar propiedades <a href="/en-US/docs/Web/CSS">CSS</a>.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>str</var>.fontcolor(<var>color</var>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>color</code></dt>
- <dd>A string expressing the color as a hexadecimal RGB triplet or as a string literal. String literals for color names are listed in the <a href="/en-US/docs/Web/CSS/color_value">CSS color reference</a>.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si expresas el color como hexadecimal, usa el formato rrggbb. Por ejemplo, el color hexadecimal para salmón es R=FA, G=80, B=72, así que el valor será <code>"FA8072"</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usos_fontcolor()"><code>Usos fontcolor()</code></h3>
-
-<p>Los siguientes ejemplos usan el método <code>fontcolor()</code> para cambiar el color de una cadena.</p>
-
-<pre class="brush: js">var worldString = 'Hello, world';
-
-console.log(worldString.fontcolor('red') +  ' en rojo');
-// '&lt;font color="red"&gt;Hello, world&lt;/font&gt; en rojo'
-
-console.log(worldString.fontcolor('FF00') + ' es rojo en hexadecimal');
-// '&lt;font color="FF00"&gt;Hello, world&lt;/font&gt; es rojo en hexadecimal'
-</pre>
-
-<p>Con el objeto {{domxref("HTMLElement.style", "element.style")}} obtienes el atributo <code>style</code> y manipularlo:</p>
-
-<pre class="brush: js">document.getElementById('yourElemId').style.color = 'red';
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.fontcolor', 'String.prototype.fontcolor')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.fontsize()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/fontsize/index.html b/files/es/web/javascript/referencia/objetos_globales/string/fontsize/index.html
deleted file mode 100644
index 212c49d638..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/fontsize/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: String.prototype.fontsize()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/fontsize
-translation_of: Web/JavaScript/Reference/Global_Objects/String/fontsize
----
-<div>{{JSRef}} {{deprecated_header}}</div>
-
-<p><code>El método </code><strong><code>fontsize()</code></strong> crea {{HTMLElement("font")}} elemento HTML que muestra una cadena con el tamaño especificado.</p>
-
-<div class="note">
-<p><strong>Usage note:</strong> El elemento &lt;font&gt; ha sido eliminado <a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a> y no se debe usar. Los desarrolladores web deben usar propiedades <a href="/en-US/docs/Web/CSS">CSS</a>.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>str</var>.fontsize(<var>size</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>size</code></dt>
- <dd>Un entero entre 1 y 7.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Cuando especificas el tamaño como entero, estableces el tamaño de la fuente. Cuando especificas el tamaño como cadena tal como "-2", se ajusta el tamaño de la fuente al de la etiqueta {{HTMLElement("basefont")}}.</p>
-
-<p>When you specify size as an integer, you set the font size of <code>str</code> to one of the 7 defined sizes. When you specify <code>size</code> as a string such as "-2", you adjust the font size of <code>str</code> relative to the size set in the {{HTMLElement("basefont")}} tag.</p>
-
-<h2 id="Ejemlpos">Ejemlpos</h2>
-
-<h3 id="Usos_fontsize()"><code>Usos fontsize()</code></h3>
-
-<p>The following example uses string methods to change the size of a string:</p>
-
-<pre class="brush: js">var worldString = 'Hello, world';
-
-console.log(worldString.small());     // &lt;small&gt;Hello, world&lt;/small&gt;
-console.log(worldString.big());       // &lt;big&gt;Hello, world&lt;/big&gt;
-console.log(worldString.fontsize(7)); // &lt;font size="7"&gt;Hello, world&lt;/fontsize&gt;
-</pre>
-
-<p>With the {{domxref("HTMLElement.style", "element.style")}} object you can get the element's <code>style</code> attribute and manipulate it more generically, for example:</p>
-
-<pre class="brush: js">document.getElementById('yourElemId').style.fontSize = '0.7em';
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.fontsize', 'String.prototype.fontsize')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.0. Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("1.0")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.big()")}}</li>
- <li>{{jsxref("String.prototype.small()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/fromcharcode/index.html b/files/es/web/javascript/referencia/objetos_globales/string/fromcharcode/index.html
deleted file mode 100644
index 7e87f3d90d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/fromcharcode/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: String.fromCharCode()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/fromCharCode
-tags:
-  - JavaScript
-  - Method
-  - String
-  - Unicode
-translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCharCode
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El <strong><code>String.fromCharCode()</code></strong> método estático que devuelve una cadena creada mediante el uso de una secuencia de valores Unicode especificada.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">String.fromCharCode(<em>num1</em>,<em> ...</em>,<em> numN</em>) </pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>num1, ..., num<em>N</em> </code></dt>
- <dd>Secuencia de números con los valores Unicode.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Este método devuelve una cadena y no un objeto <code>String</code>.</p>
-
-<p>Debido a que <code>fromCharCode</code> es un método estático de <code>String</code>, usted siempre lo usará como <code>String.fromCharCode()</code>, en vez de un método de un objeto <code>String</code> creado por usted.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_fromCharCode" name="Ejemplo:_Usando_fromCharCode">Ejemplo: Usando <code>fromCharCode</code></h3>
-
-<p>El siguiene ejemplo devuelve la cadena "ABC".</p>
-
-<pre class="brush: js">String.fromCharCode(65,66,67)
-</pre>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Estándar</td>
-   <td>Primera definicíon<br>
-    Implementada en JavaScript 1.2</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.3.2', 'StringfromCharCode')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.fromcharcodes', 'String.fromCharCode')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
- <li>{{jsxref("String.prototype.charAt()")}}</li>
- <li>{{jsxref("String.fromCodePoint()")}}</li>
- <li>{{jsxref("String.prototype.codePointAt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/fromcodepoint/index.html b/files/es/web/javascript/referencia/objetos_globales/string/fromcodepoint/index.html
deleted file mode 100644
index 39fe662b75..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/fromcodepoint/index.html
+++ /dev/null
@@ -1,204 +0,0 @@
----
-title: String.fromCodePoint()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/fromCodePoint
-translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCodePoint
----
-<div>{{JSRef("Global_Objects", "String")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método estatico <strong><code>String.fromCodePoint()</code></strong> devuelve una cadena creada por una secuencia de puntos de codigo.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>String.fromCodePoint(<var>num1</var>[, ...[, <var>numN</var>]])</code></pre>
-
-<h3 id="Parameters" name="Parameters">Parametros</h3>
-
-<dl>
- <dt><code>num1, ..., num<em>N</em></code></dt>
- <dd>Una secuencia de puntos de código.</dd>
-</dl>
-
-<h3 id="Throws">Throws</h3>
-
-<dl>
- <dt>{{jsxref("Global_Objects/RangeError", "RangeError")}}</dt>
- <dd>A {{jsxref("Global_Objects/RangeError", "RangeError")}} is thrown if an invalid Unicode code point is given (e.g. "RangeError: NaN is not a valid code point").</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Because <code>fromCodePoint()</code> is a static method of {{jsxref("Global_Objects/String", "String")}}, you always use it as <code>String.fromCodePoint()</code>, rather than as a method of a {{jsxref("Global_Objects/String", "String")}} object you created.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_fromCharCode" name="Example:_Using_fromCharCode">Ejemplos: Usando <code>fromCodePoint()</code></h3>
-
-<pre class="brush: js">String.fromCodePoint(42);       // "*"
-String.fromCodePoint(65, 90);   // "AZ"
-String.fromCodePoint(0x404);    // "\u0404"
-String.fromCodePoint(0x2F804);  // "\uD87E\uDC04"
-String.fromCodePoint(194564);   // "\uD87E\uDC04"
-String.fromCodePoint(0x1D306, 0x61, 0x1D307) // "\uD834\uDF06a\uD834\uDF07"
-
-String.fromCodePoint('_');      // RangeError
-String.fromCodePoint(Infinity); // RangeError
-String.fromCodePoint(-1);       // RangeError
-String.fromCodePoint(3.14);     // RangeError
-String.fromCodePoint(3e-2);     // RangeError
-String.fromCodePoint(NaN);      // RangeError
-</pre>
-
-<pre class="brush: js">// String.fromCharCode() alone cannot get the character at such a high code point
-// The following, on the other hand, can return a 4-byte character as well as the
-// usual 2-byte ones (i.e., it can return a single character which actually has
-// a string length of 2 instead of 1!)
-console.log(String.fromCodePoint(0x2F804)); // or 194564 in decimal
-</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<p>The <code>String.fromCodePoint</code> method has been added to the ECMAScript standard in version 6 and may not be supported in all web browsers or environments yet. Use the code below for a polyfill:</p>
-
-<pre class="brush: js">/*! http://mths.be/fromcodepoint v0.1.0 by @mathias */
-if (!String.fromCodePoint) {
-  (function() {
-    var defineProperty = (function() {
-      // IE 8 only supports `Object.defineProperty` on DOM elements
-      try {
-        var object = {};
-        var $defineProperty = Object.defineProperty;
-        var result = $defineProperty(object, object, object) &amp;&amp; $defineProperty;
-      } catch(error) {}
-      return result;
-    }());
-    var stringFromCharCode = String.fromCharCode;
-    var floor = Math.floor;
-    var fromCodePoint = function() {
-      var MAX_SIZE = 0x4000;
-      var codeUnits = [];
-      var highSurrogate;
-      var lowSurrogate;
-      var index = -1;
-      var length = arguments.length;
-      if (!length) {
-        return '';
-      }
-      var result = '';
-      while (++index &lt; length) {
-        var codePoint = Number(arguments[index]);
-        if (
-          !isFinite(codePoint) ||       // `NaN`, `+Infinity`, or `-Infinity`
-          codePoint &lt; 0 ||              // not a valid Unicode code point
-          codePoint &gt; 0x10FFFF ||       // not a valid Unicode code point
-          floor(codePoint) != codePoint // not an integer
-        ) {
-          throw RangeError('Invalid code point: ' + codePoint);
-        }
-        if (codePoint &lt;= 0xFFFF) { // BMP code point
-          codeUnits.push(codePoint);
-        } else { // Astral code point; split in surrogate halves
-          // http://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae
-          codePoint -= 0x10000;
-          highSurrogate = (codePoint &gt;&gt; 10) + 0xD800;
-          lowSurrogate = (codePoint % 0x400) + 0xDC00;
-          codeUnits.push(highSurrogate, lowSurrogate);
-        }
-        if (index + 1 == length || codeUnits.length &gt; MAX_SIZE) {
-          result += stringFromCharCode.apply(null, codeUnits);
-          codeUnits.length = 0;
-        }
-      }
-      return result;
-    };
-    if (defineProperty) {
-      defineProperty(String, 'fromCodePoint', {
-        'value': fromCodePoint,
-        'configurable': true,
-        'writable': true
-      });
-    } else {
-      String.fromCodePoint = fromCodePoint;
-    }
-  }());
-}
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.fromcodepoint', 'String.fromCodePoint')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>41</td>
-   <td>{{CompatGeckoDesktop("29")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("29")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("String.fromCharCode()")}}</li>
- <li>{{jsxref("String.prototype.charAt()")}}</li>
- <li>{{jsxref("String.prototype.codePointAt()")}}</li>
- <li>{{jsxref("String.prototype.charCodeAt()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/includes/index.html b/files/es/web/javascript/referencia/objetos_globales/string/includes/index.html
deleted file mode 100644
index 094a3fd648..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/includes/index.html
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: String.prototype.includes()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/includes
-tags:
-  - Cadena de texto
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - String
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/includes
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>includes()</code></strong> determina si una cadena de texto puede ser encontrada dentro de otra cadena de texto, devolviendo <code><strong>true</strong></code> o <strong><code>false</code></strong> según corresponda.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/string-includes.html", "shorter")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>str</var>.includes(<var>searchString</var>[, <var>position</var>])</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code><var>searchString</var></code></dt>
- <dd>Una cadena a buscar en el texto <em><code>str</code></em>.</dd>
- <dt><code><var>position</var></code> {{optional_inline}}</dt>
- <dd>La posición dentro de la cadena en la cual empieza la búsqueda de <code>searchString</code> (Por defecto este valor es 0).</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p><strong><code>true</code></strong> si la cadena de texto contiene la cadena buscada; en caso contrario, <strong><code>false</code></strong>.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Este método permite determinar si una cadena de texto se encuentra incluida dentro de la otra.</p>
-
-<h3 id="Sensibilidad_a_MayúsculasMinúsculas">Sensibilidad a Mayúsculas/Minúsculas</h3>
-
-<p>El método <code>includes()</code> es "case sensitive" (tiene en cuenta mayúsculas y minúsculas). Por ejemplo, la siguiente expresión devolverá <code>false</code>:</p>
-
-<pre class="brush: js notranslate">'Ballena azul'.includes('ballena'); // devuelve false
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este método ha sido agregado a la especificación ECMAScript 2015 y puede no estar  disponible en toda las implementaciones de JavaScript.</p>
-
-<p>Sin embargo, puedes usar este método como polyfill:</p>
-
-<pre class="brush: js notranslate">if (!String.prototype.includes) {
-  String.prototype.includes = function(search, start) {
-    'use strict';
-
-    if (search instanceof RegExp) {
-      throw TypeError('first argument must not be a RegExp');
-    }
-    if (start === undefined) { start = 0; }
-    return this.indexOf(search, start) !== -1;
-  };
-}
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_includes">Usando <code>includes()</code></h3>
-
-<pre class="brush: js notranslate">const str = 'To be, or not to be, that is the question.'
-
-console.log(str.includes('To be'))        // true
-console.log(str.includes('question'))     // true
-console.log(str.includes('nonexistent'))  // false
-console.log(str.includes('To be', 1))     // false
-console.log(str.includes('TO BE'))        // false
-console.log(str.includes(''))             // true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.includes', 'String.prototype.includes')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{Compat("javascript.builtins.String.includes")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.includes()")}}</li>
- <li>{{jsxref("TypedArray.prototype.includes()")}}</li>
- <li>{{jsxref("String.prototype.indexOf()")}}</li>
- <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
- <li>{{jsxref("String.prototype.startsWith()")}}</li>
- <li>{{jsxref("String.prototype.endsWith()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/index.html b/files/es/web/javascript/referencia/objetos_globales/string/index.html
deleted file mode 100644
index a6c5aea8e3..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/index.html
+++ /dev/null
@@ -1,385 +0,0 @@
----
-title: String — Cadena de caracteres
-slug: Web/JavaScript/Referencia/Objetos_globales/String
-tags:
-  - Clase
-  - Class
-  - ECMAScript 2015
-  - JavaScript
-  - Referencia
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>String</code></strong> se utiliza para representar y manipular una secuencia de caracteres.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las cadenas son útiles para almacenar datos que se pueden representar en forma de texto. Algunas de las operaciones más utilizadas en cadenas son verificar su {{jsxref("String.length", "length")}}, para construirlas y concatenarlas usando <a href="/es/docs/Web/JavaScript/Reference/Operators/String_Operators">operadores de cadena + y +=</a>, verificando la existencia o ubicación de subcadenas con {{jsxref("String.prototype.indexOf()", "indexOf()")}} o extraer subcadenas con el método {{jsxref("String.prototype.substring()", "substring()")}}.</p>
-
-<h3 id="Crear_cadenas">Crear cadenas</h3>
-
-<p>Las cadenas se pueden crear como primitivas, a partir de cadena literales o como objetos, usando el constructor {{jsxref("String/String", "String()")}}:</p>
-
-<pre class="syntaxbox notranslate">const string1 = "Una cadena primitiva";
-const string2 = 'También una cadena primitiva';
-const string3 = `Otra cadena primitiva más`;</pre>
-
-<pre class="syntaxbox notranslate">const string4 = new String("Un objeto String");
-</pre>
-
-<p>Las <code>string</code>s primitivas y los objetos <code>string</code> se pueden usar indistintamente en la mayoría de las situaciones. Consulta "<a href="#Primitivas_string_y_objetos_string">Primitivas <code>String</code> y objetos <code>String</code></a>" a continuación.</p>
-
-<p>Los cadena literales se pueden especificar usando comillas simples o dobles, que se tratan de manera idéntica, o usando el carácter de comilla invertida <kbd>`</kbd>. Esta última forma especifica una <a href="/es/docs/Web/JavaScript/Reference/Template_literals">Plantilla literal</a>: con esta forma puedes interpolar expresiones.</p>
-
-<h3 id="Acceder_a_un_caracter">Acceder a un caracter</h3>
-
-<p>Hay dos formas de acceder a un caracter individual en una cadena. La primera es con el método {{jsxref("String.prototype.charAt()", "charAt()")}}:</p>
-
-<pre class="brush: js notranslate">return 'cat'.charAt(1) // devuelve "a"
-</pre>
-
-<p>La otra forma (introducida en ECMAScript 5) es tratar a la cadena como un objeto similar a un arreglo, donde los caracteres individuales corresponden a un índice numérico:</p>
-
-<pre class="brush: js notranslate">return 'cat'[1] // devuelve "a"
-</pre>
-
-<p>Cuando se usa la notación entre corchetes para acceder a los caracteres, no se puede intentar eliminar o asignar un valor a estas propiedades. Las propiedades involucradas no se pueden escribir ni configurar. (Ve {{jsxref("Object.defineProperty()")}} para más información).</p>
-
-<h3 id="Comparar_cadenas">Comparar cadenas</h3>
-
-<p>En C, se usa la función <code>strcmp()</code> para comparar cadenas. En JavaScript, solo usas los <a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">operadores menor que y mayor que</a>:</p>
-
-<pre class="brush: js notranslate">let a = 'a'
-let b = 'b'
-if (a &lt; b) { // true
-  console.log(a + ' es menor que ' + b)
-} else if (a &gt; b) {
-  console.log(a + ' es mayor que ' + b)
-} else {
-  console.log(a + ' y ' + b + ' son iguales.')
-}
-</pre>
-
-<p>Puedes lograr un resultado similar usando el método {{jsxref("String.prototype.localeCompare()", "localeCompare()")}} heredado por las instancias de <code>String</code>.</p>
-
-<p>Ten en cuenta que <code>a == b</code> compara las cadenas en <code><var>a</var></code> y <code><var>b</var></code> por ser igual en la forma habitual que distingue entre mayúsculas y minúsculas. Si deseas comparar sin tener en cuenta los caracteres en mayúsculas o minúsculas, usa una función similar a esta:</p>
-
-<pre class="notranslate">function isEqual(str1, str2)
-{
-    return str1.toUpperCase() === str2.toUpperCase()
-} // isEqual
-</pre>
-
-<p>En esta función se utilizan mayúsculas en lugar de minúsculas, debido a problemas con ciertas conversiones de caracteres UTF-8.</p>
-
-<h3 id="Primitivas_String_y_objetos_String">Primitivas <code>String</code> y objetos <code>String</code></h3>
-
-<p>Ten en cuenta que JavaScript distingue entre objetos <code>String</code> y valores de {{Glossary("Primitive", "primitivas string")}}. (Lo mismo ocurre con {{jsxref("Boolean", "Booleanos")}} y {{jsxref("Global_Objects/Number", "Números")}}).</p>
-
-<p>Las cadenas literales (denotadas por comillas simples o dobles) y cadenas devueltas de llamadas a <code>String</code> en un contexto que no es de constructor (es decir, llamado sin usar la palabra clave {{jsxref("Operators/new", "new")}}) son cadenas primitivas. JavaScript automáticamente convierte las primitivas en objetos <code>String</code>, por lo que es posible utilizar métodos del objeto <code>String</code> en cadenas primitivas. En contextos donde se va a invocar a un método en una cadena primitiva o se produce una búsqueda de propiedad, JavaScript ajustará automáticamente la cadena primitiva y llamará al método o realizará la búsqueda de la propiedad.</p>
-
-<pre class="brush: js notranslate">let s_prim = 'foo'
-let s_obj = new String(s_prim)
-
-console.log(typeof s_prim) // Registra "string"
-console.log(typeof s_obj)  // Registra "object"
-</pre>
-
-<p>Las primitivas de <code>String</code> y los objetos <code>String</code> también dan diferente resultado cuando se usa {{jsxref("Global_Objects/eval", "eval()")}}. Las primitivas pasadas a <code>eval</code> se tratan como código fuente; Los objetos <code>String</code> se tratan como todos los demás objetos, devuelven el objeto. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">let s1 = '2 + 2'              // crea una string primitiva
-let s2 = new String('2 + 2')  // crea un objeto String
-console.log(eval(s1))         // devuelve el número 4
-console.log(eval(s2))         // devuelve la cadena "2 + 2"
-</pre>
-
-<p>Por estas razones, el código se puede romper cuando encuentra objetos <code>String</code> y espera una <code>string</code> primitiva en su lugar, aunque generalmente los autores no necesitan preocuparse por la distinción.</p>
-
-<p>Un objeto <code>String</code> siempre se puede convertir a su contraparte primitiva con el método {{jsxref("String.prototype.valueOf()", "valueOf()")}}.</p>
-
-<pre class="brush: js notranslate">console.log(eval(s2.valueOf()))  // devuelve el número 4
-</pre>
-
-<h3 id="Notación_de_escape">Notación de escape</h3>
-
-<p>Los caracteres especiales se pueden codificar mediante notación de escape:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Código</th>
-   <th scope="col">Salida</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>\<var>XXX</var></code><br>
-    (donde <code><var>XXX</var></code> es de 1 a 3 dígitos octales; rango de <code>0</code>-<code>377</code>)</td>
-   <td>Punto de código Unicode/carácter ISO-8859-1 entre <code>U+0000</code> y <code>U+00FF</code></td>
-  </tr>
-  <tr>
-   <td><code>\'</code></td>
-   <td>Comilla sencilla</td>
-  </tr>
-  <tr>
-   <td><code>\"</code></td>
-   <td>Comilla doble</td>
-  </tr>
-  <tr>
-   <td><code>\\</code></td>
-   <td>Barra inversa</td>
-  </tr>
-  <tr>
-   <td><code>\n</code></td>
-   <td>Nueva línea</td>
-  </tr>
-  <tr>
-   <td><code>\r</code></td>
-   <td>Retorno de carro</td>
-  </tr>
-  <tr>
-   <td><code>\v</code></td>
-   <td>Tabulación vertical</td>
-  </tr>
-  <tr>
-   <td><code>\t</code></td>
-   <td>Tabulación</td>
-  </tr>
-  <tr>
-   <td><code>\b</code></td>
-   <td>Retroceso</td>
-  </tr>
-  <tr>
-   <td><code>\f</code></td>
-   <td>Avance de página</td>
-  </tr>
-  <tr>
-   <td><code>\u<var>XXXX</var></code> (donde <code><var>XXXX</var></code> son 4 dígitos hexadecimales; rango de <code>0x0000</code>-<code>0xFFFF</code>)</td>
-   <td>Unidad de código UTF-16/punto de código Unicode entre <code>U+0000</code> y <code>U+FFFF</code></td>
-  </tr>
-  <tr>
-   <td><code>\u{<var>X</var>}</code> ... <code>\u{<var>XXXXXX</var>}</code><br>
-    (donde <code><var>X</var>…<var>XXXXXX</var></code> es de 1 a 6 dígitos hexadecimales; rango de <code>0x0</code>-<code>0x10FFFF</code>)</td>
-   <td>Unidad de código UTF-32/punto de código Unicode entre <code>U+0000</code> y <code>U+10FFFF</code></td>
-  </tr>
-  <tr>
-   <td><code>\x<var>XX</var></code><br>
-    (donde <code><var>XX</var></code> son 2 dígitos hexadecimales; rango de <code>0x00</code>-<code>0xFF</code>)</td>
-   <td>Punto de código Unicode/carácter ISO-8859-1 entre <code>U+0000</code> y <code>U+00FF</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Cadenas_literales_largas">Cadenas literales largas</h3>
-
-<p>A veces, tu código incluirá cadenas que son muy largas. En lugar de tener líneas que se prolongan interminablemente o que se ajustan según el capricho de tu editor, es posible que desees dividir específicamente la cadena en varias líneas en el código fuente sin afectar el contenido real de la cadena. hay dos maneras de conseguirlo.</p>
-
-<h4 id="Método_1">Método 1</h4>
-
-<p>Puedes usar el operador <a href="/es/docs/Web/JavaScript/Reference/Operators/Addition">+</a> para agregar varias cadenas juntas, así:</p>
-
-<pre class="brush: js notranslate">let longString = "Esta es una cadena muy larga que necesita " +
-                 "que dividimos en varias líneas porque " +
-                 "de lo contrario, mi código es ilegible."
-</pre>
-
-<h4 id="Método_2">Método 2</h4>
-
-<p>Puedes usar el caracter de barra invertida (<code>\</code>) al final de cada línea para indicar que la cadena continúa en la siguiente línea. Asegúrate de que no haya ningún espacio ni ningún otro carácter después de la barra invertida (a excepción de un salto de línea) o como sangría; de lo contrario, no trabajará.</p>
-
-<p>Esa forma se ve así:</p>
-
-<pre class="brush: js notranslate">let longString = "Esta es una cadena muy larga que necesita \
-que dividimos en varias líneas porque \
-de lo contrario, mi código es ilegible."
-</pre>
-
-<p>Ambos métodos anteriores dan como resultado cadenas idénticas.</p>
-
-<h2 id="Constructor">Constructor</h2>
-
-<dl>
- <dt>{{jsxref("String/String", "String()")}}</dt>
- <dd>Crea un nuevo objeto <code>String</code>. Realiza la conversión de tipos cuando se llama como función, en lugar de como constructor, lo cual suele ser más útil.</dd>
-</dl>
-
-<h2 id="Métodos_estáticos">Métodos estáticos</h2>
-
-<dl>
- <dt>{{jsxref("String.fromCharCode()", "String.fromCharCode(<var>num1</var> [, ...[, <var>numN</var>]])")}}</dt>
- <dd>Devuelve una cadena creada utilizando la secuencia de valores Unicode especificada.</dd>
- <dt>{{jsxref("String.fromCodePoint()", "String.fromCodePoint(<var>num1</var> [, ...[, <var>numN</var>]])")}}</dt>
- <dd>Devuelve una cadena creada utilizando la secuencia de puntos de código especificada.</dd>
- <dt>{{jsxref("String.raw()")}}</dt>
- <dd>Devuelve una cadena creada a partir de una plantilla literal sin formato.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{jsxref("String.prototype.length")}}</dt>
- <dd>Refleja la <code>length</code> de la cadena. Solo lectura.</dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt>{{jsxref("String.prototype.charAt()", "String.prototype.charAt(<var>index</var>)")}}</dt>
- <dd>Devuelve el caracter (exactamente una unidad de código UTF-16) en el <code><var>index</var></code> especificado.</dd>
- <dt>{{jsxref("String.prototype.charCodeAt()", "String.prototype.charCodeAt(<var>index</var>)")}}</dt>
- <dd>Devuelve un número que es el valor de la unidad de código UTF-16 en el <code><var>index</var></code> dado.</dd>
- <dt>{{jsxref("String.prototype.codePointAt()", "String.prototype.codePointAt(<var>pos</var>)")}}</dt>
- <dd>Devuelve un número entero no negativo que es el valor del punto de código del punto de código codificado en UTF-16 que comienza en la <code><var>pos</var></code> especificada.</dd>
- <dt>{{jsxref("String.prototype.concat()", "String.prototype.concat(<var>str</var>[, ...<var>strN</var>])")}}</dt>
- <dd>Combina el texto de dos (o más) cadenas y devuelve una nueva cadena.</dd>
- <dt>{{jsxref("String.prototype.includes()", "String.prototype.includes(<var>searchString</var> [, <var>position</var>])")}}</dt>
- <dd>Determina si la cadena de la llamada contiene <code><var>searchString</var></code>.</dd>
- <dt>{{jsxref("String.prototype.endsWith()", "String.prototype.endsWith(<var>searchString</var>[, <var>length</var>])")}}</dt>
- <dd>Determina si una cadena termina con los caracteres de la cadena <code><var>searchString</var></code>.</dd>
- <dt>{{jsxref("String.prototype.indexOf()", "String.prototype.indexOf(<var>searchValue</var>[, <var>fromIndex</var>])")}}</dt>
- <dd>Devuelve el índice dentro del objeto {{jsxref("String")}} llamador de la primera aparición de <code><var>searchValue</var></code>, o <code>-1</code> si no lo encontró.</dd>
- <dt>{{jsxref("String.prototype.lastIndexOf()", "String.prototype.lastIndexOf(<var>searchValue</var>[, <var>fromIndex</var>])")}}</dt>
- <dd>Devuelve el índice dentro del objeto {{jsxref("String")}} llamador de la última aparición de <code><var>searchValue</var></code>, o <code>-1</code> si no lo encontró.</dd>
- <dt>{{jsxref("String.prototype.localeCompare()", "String.prototype.localeCompare(<var>compareString</var>[, <var>locales</var>[, <var>options</var>]])")}}</dt>
- <dd>Devuelve un número que indica si la cadena de referencia <code><var>compareString</var></code> viene antes, después o es equivalente a la cadena dada en el orden de clasificación.</dd>
- <dt>{{jsxref("String.prototype.match()", "String.prototype.match(<var>regexp</var>)")}}</dt>
- <dd>Se utiliza para hacer coincidir la expresión regular <code><var>regexp</var></code> con una cadena.</dd>
- <dt>{{jsxref("String.prototype.matchAll()", "String.prototype.matchAll(<var>regexp</var>)")}}</dt>
- <dd>Devuelve un iterador de todas las coincidencias de <code><var>regexp</var></code>.</dd>
- <dt>{{jsxref("String.prototype.normalize()", "String.prototype.normalize([<var>form</var>])")}}</dt>
- <dd>Devuelve la forma de normalización Unicode del valor de la cadena llamada.</dd>
- <dt>{{jsxref("String.prototype.padEnd()", "String.prototype.padEnd(<var>targetLength</var>[, <var>padString</var>])")}}</dt>
- <dd>Rellena la cadena actual desde el final con una cadena dada y devuelve una nueva cadena de longitud <code><var>targetLength</var></code>.</dd>
- <dt>{{jsxref("String.prototype.padStart()", "String.prototype.padStart(<var>targetLength</var>[, <var>padString</var>])")}}</dt>
- <dd>Rellena la cadena actual desde el principio con una determinada cadena y devuelve una nueva cadena de longitud <code><var>targetLength</var></code>.</dd>
- <dt>{{jsxref("String.prototype.repeat()", "String.prototype.repeat(<var>count</var>)")}}</dt>
- <dd>Devuelve una cadena que consta de los elementos del objeto repetidos <code><var>count</var></code> veces.</dd>
- <dt>{{jsxref("String.prototype.replace()" , "String.prototype.replace(<var>searchFor</var>, <var>replaceWith</var>)")}}</dt>
- <dd>Se usa para reemplazar ocurrencias de <code><var>searchFor</var></code> usando <code><var>replaceWith</var></code>. <code><var>searchFor</var></code> puede ser una cadena o expresión regular, y <code><var>replaceWith</var></code> puede ser una cadena o función.</dd>
- <dt>{{jsxref("String.prototype.replaceAll()", "String.prototype.replaceAll(<var>searchFor</var>, <var>replaceWith</var>)")}}</dt>
- <dd>Se utiliza para reemplazar todas las apariciones de <code><var>searchFor</var></code> usando <code><var>replaceWith</var></code>. <code><var>searchFor</var></code> puede ser una cadena o expresión regular, y <code><var>replaceWith</var></code> puede ser una cadena o función.</dd>
- <dt>{{jsxref("String.prototype.search()", "String.prototype.search(<var>regexp</var>)")}}</dt>
- <dd>Busca una coincidencia entre una expresión regular <code><var>regexp</var></code> y la cadena llamadora.</dd>
- <dt>{{jsxref("String.prototype.slice()", "String.prototype.slice(<var>beginIndex</var>[, <var>endIndex</var>])")}}</dt>
- <dd>Extrae una sección de una cadena y devuelve una nueva cadena.</dd>
- <dt>{{jsxref("String.prototype.split()", "String.prototype.split([<var>sep</var>[, <var>limit</var>] ])")}}</dt>
- <dd>Devuelve un arreglo de cadenas pobladas al dividir la cadena llamadora en las ocurrencias de la subcadena <code><var>sep</var></code>.</dd>
- <dt>{{jsxref("String.prototype.startsWith()", "String.prototype.startsWith(<var>searchString</var>[, <var>length</var>])")}}</dt>
- <dd>Determina si la cadena llamadora comienza con los caracteres de la cadena <code><var>searchString</var></code>.</dd>
- <dt>{{jsxref("String.prototype.substr()")}}</dt>
- <dd>Devuelve los caracteres en una cadena que comienza en la ubicación especificada hasta el número especificado de caracteres.</dd>
- <dt>{{jsxref("String.prototype.substring()", "String.prototype.substring(<var>indexStart</var>[, <var>indexEnd</var>])")}}</dt>
- <dd>Devuelve una nueva cadena que contiene caracteres de la cadena llamadora de (o entre) el índice (o indeces) especificados.</dd>
- <dt>{{jsxref("String.prototype.toLocaleLowerCase()", "String.prototype.toLocaleLowerCase( [<var>locale</var>, ...<var>locales</var>])")}}</dt>
- <dd>
- <p>Los caracteres dentro de una cadena se convierten a minúsculas respetando la configuración regional actual.</p>
-
- <p>Para la mayoría de los idiomas, devolverá lo mismo que {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}.</p>
- </dd>
- <dt>{{jsxref("String.prototype.toLocaleUpperCase()", "String.prototype.toLocaleUpperCase( [<var>locale</var>, ...<var>locales</var>])")}}</dt>
- <dd>
- <p>Los caracteres dentro de una cadena se convierten a mayúsculas respetando la configuración regional actual.</p>
-
- <p>Para la mayoría de los idiomas, devolverá lo mismo que {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}.</p>
- </dd>
- <dt>{{jsxref("String.prototype.toLowerCase()")}}</dt>
- <dd>Devuelve el valor de la cadena llamadora convertido a minúsculas.</dd>
- <dt>{{jsxref("String.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el objeto especificado. Redefine el método {{jsxref("Object.prototype.toString()")}}.</dd>
- <dt>{{jsxref("String.prototype.toUpperCase()")}}</dt>
- <dd>Devuelve el valor de la cadena llamadora convertido a mayúsculas.</dd>
- <dt>{{jsxref("String.prototype.trim()")}}</dt>
- <dd>Recorta los espacios en blanco desde el principio y el final de la cadena. Parte del estándar ECMAScript 5.</dd>
- <dt>{{jsxref("String.prototype.trimStart()")}}</dt>
- <dd>Recorta los espacios en blanco desde el principio de la cadena.</dd>
- <dt>{{jsxref("String.prototype.trimEnd()")}}</dt>
- <dd>Recorta los espacios en blanco del final de la cadena.</dd>
- <dt>{{jsxref("String.prototype.valueOf()")}}</dt>
- <dd>Devuelve el valor primitivo del objeto especificado. Redefine el método {{jsxref("Object.prototype.valueOf()")}}.</dd>
- <dt>{{jsxref("String.prototype.@@iterator()")}}</dt>
- <dd>Devuelve un nuevo objeto <code>Iterator</code> que itera sobre los puntos de código de un valor de cadena, devolviendo cada punto de código como un valor de cadena.</dd>
-</dl>
-
-<h2 id="Métodos_de_contenedor_HTML">Métodos de contenedor HTML</h2>
-
-<div>
-<div class="blockIndicator note">
-<p><strong>Desaprobado. Evita estos métodos.</strong></p>
-
-<p>Son de uso limitado, ya que proporcionan solo un subconjunto de las etiquetas y atributos HTML disponibles.</p>
-</div>
-
-<dl>
- <dt>{{jsxref("String.prototype.anchor()")}}</dt>
- <dd>{{htmlattrxref("name", "a", "&lt;a name=\"name\"&gt;")}} (hipertexto destino)</dd>
- <dt>{{jsxref("String.prototype.big()")}}</dt>
- <dd>{{HTMLElement("big")}}</dd>
- <dt>{{jsxref("String.prototype.blink()")}}</dt>
- <dd>{{HTMLElement("blink")}}</dd>
- <dt>{{jsxref("String.prototype.bold()")}}</dt>
- <dd>{{HTMLElement("b")}}</dd>
- <dt>{{jsxref("String.prototype.fixed()")}}</dt>
- <dd>{{HTMLElement("tt")}}</dd>
- <dt>{{jsxref("String.prototype.fontcolor()")}}</dt>
- <dd>{{htmlattrxref("color", "font", "&lt;font color=\"color\"&gt;")}}</dd>
- <dt>{{jsxref("String.prototype.fontsize()")}}</dt>
- <dd>{{htmlattrxref("size", "font", "&lt;font size=\"size\"&gt;")}}</dd>
- <dt>{{jsxref("String.prototype.italics()")}}</dt>
- <dd>{{HTMLElement("i")}}</dd>
- <dt>{{jsxref("String.prototype.link()")}}</dt>
- <dd>{{htmlattrxref("href", "a", "&lt;a href=\"url\"&gt;")}} (enlace a URL)</dd>
- <dt>{{jsxref("String.prototype.small()")}}</dt>
- <dd>{{HTMLElement("small")}}</dd>
- <dt>{{jsxref("String.prototype.strike()")}}</dt>
- <dd>{{HTMLElement("strike")}}</dd>
- <dt>{{jsxref("String.prototype.sub()")}}</dt>
- <dd>{{HTMLElement("sub")}}</dd>
- <dt>{{jsxref("String.prototype.sup()")}}</dt>
- <dd>{{HTMLElement("sup")}}</dd>
-</dl>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Conversión_de_cadenas">Conversión de cadenas</h3>
-
-<p>Es posible usar <code>String</code> como una alternativa más confiable de {{jsxref("String.prototype.toString()", "toString()")}}, ya que funciona cuando se usa en {{jsxref( "null")}}, {{jsxref("undefined")}} y en {{jsxref("Symbol", "símbolos")}}. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">let outputStrings = []
-for (let i = 0, n = inputValues.length; i &lt; n; ++i) {
-  outputStrings.push(String(inputValues[i]));
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string-objects', 'String')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.String")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Guide/Text_formatting">Formato de texto en la Guía de JavaScript</a></li>
- <li>{{jsxref("RegExp")}}</li>
- <li>{{domxref("DOMString")}}</li>
- <li><a href="/es/Add-ons/Code_snippets/StringView"><code>StringView</code> — una representación similar a C de cadenas basada en arreglos tipados</a></li>
- <li><a href="/es/docs/Web/API/DOMString/Binary">Cadenas binarias</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/indexof/index.html b/files/es/web/javascript/referencia/objetos_globales/string/indexof/index.html
deleted file mode 100644
index 14f7b01eb8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/indexof/index.html
+++ /dev/null
@@ -1,104 +0,0 @@
----
-title: String.prototype.indexOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/indexOf
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/indexOf
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <code><strong>indexOf()</strong></code>devuelve el índice, dentro del objeto <code>String</code> que realiza la llamada, de la primera ocurrencia del valor especificado, comenzando la búsqueda desde <code>indiceDesde</code>; o -1 si no se encuentra dicho valor.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.indexOf(<em>valorBusqueda</em>[,<em> indiceDesde</em>])</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>valorBusqueda</code></dt>
- <dd>Una cadena que representa el valor de búsqueda.</dd>
-</dl>
-
-<dl>
- <dt><code>indiceDesde</code></dt>
- <dd>La localización dentro de la cadena llamada desde la que empezará la búsqueda. Puede ser un entero entre 0 y la longitud de la cadena. El valor predeterminado es 0.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Los caracteres de una cadena se indexan de izquierda a derecha. El índice del primer carácter es 0, y el índice del último carácter de una cadena llamada <code>nombreCadena</code> es <code>nombreCadena.length - 1</code>.</p>
-
-<pre class="brush: js">"Blue Whale".indexOf("Blue")    // returns 0
-"Blue Whale".indexOf("Blute")   // returns -1
-"Blue Whale".indexOf("Whale",0) // returns 5
-"Blue Whale".indexOf("Whale",5) // returns 5
-"Blue Whale".indexOf("",9)      // returns 9
-"Blue Whale".indexOf("",10)     // returns 10
-"Blue Whale".indexOf("",11)     // returns 10
-</pre>
-
-<p>El método <code>indexOf</code> es sensible a mayúsculas. Por ejemplo, la siguiente expresión devuelve -1:</p>
-
-<pre class="brush: js">"Ballena Azul".indexOf("azul")
-</pre>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_indexOf_y_lastIndexOf" name="Ejemplo:_Usando_indexOf_y_lastIndexOf">Ejemplo: Usando <code>indexOf</code> y <code>lastIndexOf</code></h3>
-
-<p>El siguiente ejemplo utiliza <code>indexOf</code> y <code>lastIndexOf</code> para localizar valores dentro de la cadena "<code>Brave new world</code>".</p>
-
-<pre class="brush: js">var cualquierCadena="Brave new world"
-
-
-document.write("&lt;P&gt;The index of the first w from the beginning is " +
-   cualquierCadena.indexOf("w"))         // Muestra 8
-
-document.write("&lt;P&gt;The index of the first w from the end is " +
-   cualquierCadena.lastIndexOf("w"))    // Muestra 10
-
-document.write("&lt;P&gt;The index of 'new' from the beginning is " +
-   cualquierCadena.indexOf("new"))      // Muestra 6
-
-document.write("&lt;P&gt;The index of 'new' from the end is " +
-   cualquierCadena.lastIndexOf("new"))  // Muestra 6
-</pre>
-
-<h3 id="Ejemplo:_indexOf_y_sensibilidad_a_may.C3.BAsculas" name="Ejemplo:_indexOf_y_sensibilidad_a_may.C3.BAsculas">Ejemplo: <code>indexOf</code> y sensibilidad a mayúsculas</h3>
-
-<p>El siguiente ejemplo define dos variables de tipo cadena. Las variables contienen la misma cadena excepto que la segunda cadena contienen letras en mayúscula. El primer método <code>writeln</code> muestra 19. Pero a que el método <code>indexOf</code> es sensible a mayúsculas, no se encuentra la cadena "<code>cheddar</code>" en <code>miCadenaMayusculas</code>, así que el segundo método <code>writeln</code> muestra -1.</p>
-
-<pre class="brush: js">miCadena="brie, pepper jack, cheddar"
-miCadenaMayusculas="Brie, Pepper Jack, Cheddar"
-document.writeln('miCadena.indexOf("cheddar") is ' +
-   miCadena.indexOf("cheddar"))
-document.writeln('&lt;P&gt;miCadenaMayusculas.indexOf("cheddar") is ' +
-   miCadenaMayusculas.indexOf("cheddar"))
-</pre>
-
-<h3 id="Ejemplo:_Usando_indexOf_para_contar_ocurrencias_de_una_letra_en_una_cadena" name="Ejemplo:_Usando_indexOf_para_contar_ocurrencias_de_una_letra_en_una_cadena">Ejemplo: Usando <code>indexOf</code> para contar ocurrencias de una letra en una cadena</h3>
-
-<p>El siguiente ejemplo establece <code>cuenta</code> como el número de ocurrencias de la letra <code>x</code> dentro de la cadena <code>miCadena</code>:</p>
-
-<pre class="brush: js">cuenta = 0;
-posicion = miCadena.indexOf("x");
-while ( posicion != -1 ) {
-   cuenta++;
-   posicion = miCadena.indexOf("x",posicion+1);
-}
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.charAt()")}}</li>
- <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
- <li>{{jsxref("String.prototype.split()")}}</li>
- <li>{{jsxref("Array.prototype.indexOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/italics/index.html b/files/es/web/javascript/referencia/objetos_globales/string/italics/index.html
deleted file mode 100644
index 71897293bb..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/italics/index.html
+++ /dev/null
@@ -1,49 +0,0 @@
----
-title: String.prototype.italics()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/italics
-tags:
-  - Deprecated
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/italics
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<p>{{deprecated_header}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Provoca que una cadena ponga en cursiva, como si estuviese dentro de una etiqueta {{HTMLElement("i")}}.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.italics()</pre>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Usa el método <code>italics</code> para formatear y mostrar una cadena en un documento.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>italics()</code></h3>
-
-<p>El siguiente ejemplo usa métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
-
-<pre class="brush: js">var cadenaMundo="¡Hola mundo!";
-
-console.log(cadenaMundo.blink());
-console.log(cadenaMundo.bold());
-console.log(cadenaMundo.italics());
-console.log(cadenaMundo.strike());
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.blink()")}}</li>
- <li>{{jsxref("String.prototype.bold()")}}</li>
- <li>{{jsxref("String.prototype.strike()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/lastindexof/index.html b/files/es/web/javascript/referencia/objetos_globales/string/lastindexof/index.html
deleted file mode 100644
index ffde251071..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/lastindexof/index.html
+++ /dev/null
@@ -1,79 +0,0 @@
----
-title: String.prototype.lastIndexOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/lastIndexOf
-tags:
-  - Cadena
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El  método <strong><code>lastIndexOf() </code></strong><code>devuelve </code>la posicion (indice) en la que se encuentra el <strong>valorBusqueda</strong>, dentro del objeto <code>String</code> que realiza la llamada, de la última ocurrencia del valor especificado; o -1 si no se halla. La búsqueda se realiza empezando por el final de la cadena que realiza la llamada, empezando en <strong><code>indiceDesde</code></strong>.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.lastIndexOf(<em>valorBusqueda</em>[,<em> indiceDesde</em>]<em>)</em></pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>valorBusqueda</code></dt>
- <dd>Una cadena que representa el valor que se desea buscar.</dd>
-</dl>
-
-<dl>
- <dt><code>indiceDesde</code></dt>
- <dd>La localización dentro de la cadena que realiza la llamada desde donde comenzará la búsqueda. Puede ser cualquier entero entre 0 y la longitud de la cadena. El valor predeterminado es la longitud de la cadena.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Los caracteres de una cadena se indexan de izquierda a derecha. El índice del primer carácter es 0, y el índice del último carácter es <code>nombreCadena.length - 1</code>.</p>
-
-<pre class="brush: js">"canal".lastIndexOf("a")   // returns 3
-"canal".lastIndexOf("a",2) // returns 1
-"canal".lastIndexOf("a",0) // returns -1
-"canal".lastIndexOf("x")   // returns -1
-</pre>
-
-<p>El método <code>lastIndexOf</code> es sensible a mayúsculas. Por ejemplo, la siguiente expresión devuelve -1:</p>
-
-<pre class="brush: js">"Ballena Azul, Ballena Asesina".lastIndexOf("azul")
-</pre>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_indexOf_y_lastIndexOf" name="Ejemplo:_Usando_indexOf_y_lastIndexOf">Ejemplo: Usando <code>indexOf</code> y <code>lastIndexOf</code></h3>
-
-<p>The following example uses <code>indexOf</code> and <code>lastIndexOf</code> to locate values in the string "<code>Brave new world</code>".</p>
-
-<pre class="brush: js">var anyString="Brave new world"
-
-// Displays 8
-document.write("&lt;P&gt;The index of the first w from the beginning is " +
-   anyString.indexOf("w"))
-// Displays 10
-document.write("&lt;P&gt;The index of the first w from the end is " +
-   anyString.lastIndexOf("w"))
-// Displays 6
-document.write("&lt;P&gt;The index of 'new' from the beginning is " +
-   anyString.indexOf("new"))
-// Displays 6
-document.write("&lt;P&gt;The index of 'new' from the end is " +
-   anyString.lastIndexOf("new"))
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.charAt()")}}</li>
- <li>{{jsxref("String.prototype.indexOf()")}}</li>
- <li>{{jsxref("String.prototype.split()")}}</li>
- <li>{{jsxref("Array.prototype.indexOf()")}}</li>
- <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/length/index.html b/files/es/web/javascript/referencia/objetos_globales/string/length/index.html
deleted file mode 100644
index 9401b8898a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/length/index.html
+++ /dev/null
@@ -1,94 +0,0 @@
----
-title: String.length
-slug: Web/JavaScript/Referencia/Objetos_globales/String/length
-tags:
-  - JavaScript
-  - Propiedad
-  - Prototipo
-  - Referencia
-  - String
-  - length
-translation_of: Web/JavaScript/Reference/Global_Objects/String/length
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad<strong> </strong><code><strong>length</strong></code> de un objeto {{jsxref("String")}} representa la longitud de una cadena, en unidades de código UTF-16.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>str</var>.length</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Esta propiedad devuelve el número de caracteres de una cadena. {{interwiki("wikipedia", "UTF-16")}}, el formato usado por JavaScript, usa 16-bit para representar los caracteres más comunes, pero necesita usar dos caracteres para otros menos usados, así que es posible que el valor devuelto por <code>length</code> no corresponda al número de caracteres de la cadena.</p>
-
-<p>ECMASCript 2016 (ed. 7) estableció una longitud máxima de <code>2^53 - 1</code> elementos. Anteriormente, ninguna longitud máxima era especificada. </p>
-
-<p>Para una cadena vacía, <code>length</code> es 0.</p>
-
-<p>La propiedad static <code>String.length</code> devuelve 1.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_Básico">Uso Básico</h3>
-
-<pre class="brush: js notranslate">var x = 'Mozilla';
-var empty = '';
-
-console.log('Mozilla is ' + x.length + ' code units long');
-/* "Mozilla is 7 code units long" */
-
-console.log('The empty string has a length of ' + empty.length);
-/* "The empty string has a length of 0" */</pre>
-
-<h3 id="Asignando_a_length">Asignando a length</h3>
-
-<pre class="brush: js notranslate">var myString = "bluebells";
-
-// Attempting to assign a value to a string's .length property has no observable effect.
-myString.length = 4;
-console.log(myString);
-/* "bluebells" */
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Estándar</td>
-   <td>Primera definicíon. Implementado en JavaScript 1.0.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.5.1', 'String.prototype.length')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-properties-of-string-instances-length', 'String.prototype.length')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-properties-of-string-instances-length', 'String.prototype.length')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.builtins.String.length")}}</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li><a class="external" href="http://developer.teradata.com/blog/jasonstrimpel/2011/11/javascript-string-length-and-internationalizing-web-applications">JavaScript String.length and Internationalizing Web Applications</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/link/index.html b/files/es/web/javascript/referencia/objetos_globales/string/link/index.html
deleted file mode 100644
index 021c659f34..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/link/index.html
+++ /dev/null
@@ -1,56 +0,0 @@
----
-title: String.prototype.link()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/link
-tags:
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/link
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Crea un enlace de hipertexto HTML, {{HTMLElement("a")}}, que solicita otra URL.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.link(<em>atributoHref</em>)</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>atributoHref</code></dt>
- <dd>Cualquier cadena que especifique el atributo {{htmlattrxref("href", "a")}} de la etiqueta {{HTMLElement("a")}}; debería ser una URL válida (relativa o absoluta).</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Usa el método <code>link</code> para crear un atajo HTML para un enlace de hipertexto. La cadena devuelta puede ser añadida al documento vía {{domxref("element.innerHTML")}}.</p>
-
-<p>Los enlaces creados con el método <code>link</code> serán elementos del array <code>links</code> del objeto <code>document</code>. Vea {{domxref("document.links")}}.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_link" name="Ejemplo:_Usando_link">Ejemplo: Usando <code>link</code></h3>
-
-<p>El siguiente ejemplo muestra la palabra "Netscape" como un enlace de hipertexto que devuelve al usuario a la página inicial de Netscape:</p>
-
-<pre>var textoActivo="MDN"
-var URL="<code class="language-js"><span class="brush: js">https://developer.mozilla.org/</span></code>"
-
-console.log("Haga click para volver a " + textoActivo.link(URL))
-</pre>
-
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-
-<pre class="brush: html">Haga click para volver a &lt;a href="http://<code class="language-js"><span class="brush: js">developer.mozilla.org/</span></code>"&gt;MDN&lt;/a&gt;
-</pre>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.anchor()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/localecompare/index.html b/files/es/web/javascript/referencia/objetos_globales/string/localecompare/index.html
deleted file mode 100644
index 2bda296c61..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/localecompare/index.html
+++ /dev/null
@@ -1,159 +0,0 @@
----
-title: String.prototype.localeCompare()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/localeCompare
-translation_of: Web/JavaScript/Reference/Global_Objects/String/localeCompare
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>localeCompare()</code></strong> devuelve un número que indica si la cadena de caracteres actual es anterior, posterior o igual a la cadena pasada como parámetro, en orden lexicográfico.</p>
-
-<p>Los nuevos argumentos <code>locales</code> y <code>options</code> permiten a las aplicaciones especificar el idioma y el orden de clasificación que debe usarse y personalizar el comportamiento de la función. En las implementaciones más antiguas, que ignoran los argumentos <code>locales</code> y <code>options</code>, la configuración <code>locale</code> y el orden de clasificación utilizados dependen enteramente de la implementación</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>referenceStr</var>.localeCompare(<var>compareString</var>[, <var>locales</var>[, <var>options</var>]])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<p>Comprueba la sección <a href="#Compatibilidad_con_el_navegador">Compatibilidad con el navegador</a> para ver que navegadores soportan los argumentos <code>locales</code> y <code>options</code>, and the <a href="#Checking_for_support_for_locales_and_options_arguments">Checking for support for <code>locales</code> and <code>options</code> arguments</a> for feature detection.</p>
-
-<dl>
- <dt><code>compareString</code></dt>
- <dd>La cadena con la que queremos comparar la cadena actual de caracteres.</dd>
-</dl>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator', 'Parameters')}}</div>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un número <strong>negativo</strong> si la cadena de referencia ocurre antes de la cadena de comparación; <strong>positivo</strong> si la cadena de referencia ocurre después de la cadena de comparación; <strong>0</strong> si son equivalentes.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Returns an integer indicating whether the <strong>referenceStr</strong> comes before, after or is equivalent to the <strong>compareStr</strong>.</p>
-
-<ul>
- <li>Negative when the <strong>referenceStr</strong> occurs before <strong>compareStr</strong></li>
- <li>Positive when the <strong>referenceStr</strong> occurs after <strong>compareStr</strong></li>
- <li>Returns 0 if they are equivalent</li>
-</ul>
-
-<p><strong>NO CONFIAR en que los valores devueltos sean siempre -1 o 1. </strong>Los resultados de enteros negativos y positivos varían entre los navegadores (así como entre diferentes versiones de un mismo navegador) porque la especificación W3C solo exige valores negativos y positivos. Algunos navegadores pueden devolver -2 o 2 o incluso algún otro valor negativo o positivo.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_de_localeCompare()">Uso de <code>localeCompare()</code></h3>
-
-<pre class="brush: js">// La letra "a" es anterior a la "c" produciendo un valor negativo
-'a'.localeCompare('c'); // -2 o -1 (u otro valor negativo)
-
-// Alfabeticamente la palabra "check" viene después de "against" produciendo un valor ppositivo
-'check'.localeCompare('against'); // 2 o 1 (u otro valor positivo)
-
-// "a" y "a" son equivalentes produciendo un valor neutro de 0
-'a'.localeCompare('a'); // 0
-</pre>
-
-<h3 id="Ordenar_un_array">Ordenar un array</h3>
-
-<p><code>localeCompare</code> enables a case-insensitive sort of an array.</p>
-
-<pre class="brush: js">var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];
-items.sort((a, b) =&gt; a.localeCompare(b)); // ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']
-</pre>
-
-<h3 id="Verificar_si_el_navegador_soporta_argumentos_extendidos">Verificar si el navegador soporta argumentos extendidos</h3>
-
-<p>The <code>locales</code> and <code>options</code> arguments are not supported in all browsers yet. To check whether an implementation supports them, use the "i" argument (a requirement that illegal language tags are rejected) and look for a {{jsxref("RangeError")}} exception:</p>
-
-<pre class="brush: js">function localeCompareSupportsLocales() {
-  try {
-    'foo'.localeCompare('bar', 'i');
-  } catch (e) {
-    return e.name === 'RangeError';
-  }
-  return false;
-}
-</pre>
-
-<h3 id="Uso_de_locales">Uso de <code>locales</code></h3>
-
-<p>The results provided by <code>localeCompare()</code> vary between languages. In order to get the sort order of the language used in the user interface of your application, make sure to specify that language (and possibly some fallback languages) using the <code>locales</code> argument:</p>
-
-<pre class="brush: js">console.log('ä'.localeCompare('z', 'de')); // a negative value: in German, ä sorts before z
-console.log('ä'.localeCompare('z', 'sv')); // a positive value: in Swedish, ä sorts after z
-</pre>
-
-<h3 id="Uso_de_options">Uso de <code>options</code></h3>
-
-<p>The results provided by <code>localeCompare()</code> can be customized using the <code>options</code> argument:</p>
-
-<pre class="brush: js">// in German, ä has a as the base letter
-console.log('ä'.localeCompare('a', 'de', { sensitivity: 'base' })); // 0
-
-// in Swedish, ä and a are separate base letters
-console.log('ä'.localeCompare('a', 'sv', { sensitivity: 'base' })); // a positive value
-</pre>
-
-<h2 id="Performance">Performance</h2>
-
-<p>When comparing large numbers of strings, such as in sorting large arrays, it is better to create an {{jsxref("Global_Objects/Collator", "Intl.Collator")}} object and use the function provided by its {{jsxref("Collator.prototype.compare", "compare")}} property.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.9', 'String.prototype.localeCompare')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.localecompare', 'String.prototype.localeCompare')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.localecompare', 'String.prototype.localeCompare')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 1.0', '#sec-13.1.1', 'String.prototype.localeCompare')}}</td>
-   <td>{{Spec2('ES Int 1.0')}}</td>
-   <td>Definiciones de los parámetros <code>locale</code> y <code>option</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int 2.0', '#sec-13.1.1', 'String.prototype.localeCompare')}}</td>
-   <td>{{Spec2('ES Int 2.0')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sec-String.prototype.localeCompare', 'String.prototype.localeCompare')}}</td>
-   <td>{{Spec2('ES Int Draft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_el_navegador">Compatibilidad con el navegador</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.localeCompare")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/match/index.html b/files/es/web/javascript/referencia/objetos_globales/string/match/index.html
deleted file mode 100644
index 6403dbaf06..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/match/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: String.prototype.match()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/match
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - RegExp
-  - Regular Expressions
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/match
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <strong><code>match()</code></strong> se usa para obtener todas las ocurrencias de una <em>expresión regular</em> dentro de una <em>cadena</em>.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.match(<em>regexp</em>)</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>regexp</code></dt>
- <dd>Un objeto <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp"> expresión regular</a>. Si se pasa un objeto <code>obj</code> que no es expresión regular, se convierte implícitamente a RegExp usando <code>new RegExp(obj)</code>.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Si la expresión regular no incluye el flag <code>g</code>, devuelve el mismo resultado que {{jsxref("Regexp.exec()")}}.</p>
-
-<p>Si la expresión regular incluye el flag <code>g</code>, el método devuelve un {{jsxref("Array")}} que contiene todos los emparejamientos.</p>
-
-<h3 id="Notas" name="Notas">Notas</h3>
-
-<ul>
- <li>Si necesita conocer si una cadena se empareja con una expresión regular <code>regexp</code>, use {{jsxref("Regexp.test()")}}.</li>
- <li>Si sólo quiere el primer emparejamiento hallado, podría querer usar {{jsxref("Regexp.exec()")}} a cambio.</li>
-</ul>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_match" name="Ejemplo:_Usando_match">Ejemplo: Usando <code>match</code></h3>
-
-<p>En el siguiente ejemplo, se usa <code>match</code> para hallar "<code>Capítulo</code>" seguido de 1 o más caracteres numéricos seguidos de un punto decimal y caracteres numéricos cero o más veces. La expresión regular incluye el flag <code>i</code> por lo que las mayúsculas serán ignoradas.</p>
-
-<pre class="brush: js">cadena = "Para más información, vea Capítulo 3.4.5.1";
-expresion = /(capítulo \d+(\.\d)*)/i;
-hallado = cadena.match(expresion);
-console.log(hallado);
-</pre>
-
-<p>Esto devuelve un array que contiene Capítulo 3.4.5.1,Capítulo 3.4.5.1,.1</p>
-
-<p>"<code>Capítulo 3.4.5.1</code>" es el primer emparejamiento y el primer valor referenciado por <code>(Chapter \d+(\.\d)*)</code>.</p>
-
-<p>"<code>.1</code>" es el segundo valor referenciado por <code>(\.\d)</code>.</p>
-
-<h3 id="Ejemplo:_Usando_los_flags_global_e_ignorar_may.C3.BAsculas_con_match" name="Ejemplo:_Usando_los_flags_global_e_ignorar_may.C3.BAsculas_con_match">Ejemplo: Usando los flags global e ignorar mayúsculas con <code>match</code></h3>
-
-<p>El siguiente ejemplo demuestra el uso de los flags global e ignorar mayúsculas con <code>match</code>. Todas las letras de A hasta E y de a hasta e son devueltas, en su propio elemento dentro del array.</p>
-
-<pre class="brush: js">var cadena = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
-var expresion = /[A-E]/gi;
-var array_emparejamientos = cadena.match(expresion);
-console.log(array_emparejamientos);
-</pre>
-
-<p><code>array_emparejamientos</code> será <code>{{ mediawiki.external('\'A\', \'B\', \'C\', \'D\', \'E\', \'a\', \'b\', \'c\', \'d\', \'e\'') }}</code></p>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li>{{jsxref("RegExp.prototype.exec()")}}</li>
- <li>{{jsxref("RegExp.prototype.test()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/matchall/index.html b/files/es/web/javascript/referencia/objetos_globales/string/matchall/index.html
deleted file mode 100644
index a536720dbd..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/matchall/index.html
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: String.prototype.matchAll()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/matchAll
-tags:
-  - Cadena
-  - Expresiones Regulares
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/matchAll
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>matchAll()</code></strong> retorna un iterador de todos los resultados de ocurrencia en una <em>cadena de texto</em> contra una expresión regular, incluyendo grupos de captura.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/string-matchall.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>cadena</var>.matchAll(<var>expresionRegular</var>)</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><var>expresionRegular</var></dt>
- <dd>Un objeto expresión regular. Si se pasa un objeto no-RegExp <code>obj</code>, este es implícitamente convertido a {{jsxref("RegExp")}} vía <code>new RegExp(obj)</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un <a href="/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators">iterador</a> (el cual no es reiniciable).</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Regexp.exec()_y_matchAll()">Regexp.exec() y matchAll()</h3>
-
-<p>Antes de la adición de  <code>matchAll</code> a JavaScript, fue posible hacer llamados a <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec">regexp.exec</a> (y usar expresiones regulares con la bandera <code>/g</code>) en un ciclo para obtener las ocurrencias:</p>
-
-<pre class="brush: js">const regexp = RegExp('foo[a-z]*','g');
-const cadena = 'mesa football, foosball';
-let ocurrencia;
-
-while ((ocurrencia = regexp.exec(cadena)) !== null) {
-  console.log(`Encontrado ${ocurrencia[0]} inicio=${ocurrencia.index} final=${regexp.lastIndex}.`);
-  // salida esperada: "Encontrado football inicio=5 final=13."
-  // salida esperada: "Encontrado foosball inicio=15 final=23."
-}</pre>
-
-<p>Con <code>matchAll</code> disponible, puedes evitar el ciclo <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/while">while</a></code> y <code>exec</code> con <code>/g</code>. Por el contrario, usando <code>matchAll</code>, obtienes un iterador con el cual puedes usar con constructores más convenientes  <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for...of</a></code>, <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax">array spread</a>, o {{jsxref("Array.from()")}}:</p>
-
-<pre class="brush: js">const regexp = RegExp('foo[a-z]*','g');
-const cadena = 'mesa football, foosball';
-const ocurrencias = cadena.matchAll(regexp);
-
-for (const ocurrencia of ocurrencias) {
-  console.log(`Encontrado ${ocurrencia[0]} inicio=${ocurrencia.index} final=${ocurrencia.index + ocurrencia[0].length}.`);
-}
-// salida esperada: "Encontrado football start=5 end=13."
-// salida esperada: "Encontrado foosball start=15 end=23."
-
-// el iterador ocurrencias es agotado después de la iteración for..of
-// Llama matchAll de nuevo para crear un nuevo iterador
-Array.from(cadena.matchAll(regexp), m =&gt; m[0]);
-// Array [ "football", "foosball" ]</pre>
-
-<p><code>matchAll</code> solo devuelve la primer ocurrencia si la bandera <code>/g</code> está ausente.</p>
-
-<pre class="brush: js">const regexp = RegExp('[a-c]','');
-const cadena = 'abc';
-Array.from(cadena.matchAll(regexp), m =&gt; m[0]);
-// Array [ "a" ]
-</pre>
-
-<p><code>matchAll</code> internamente hace un clon de la expresión regular, entonces a diferencia de <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec">regexp.exec</a>,  <code>lastIndex</code> no cambia a medida que la cadena es escaneada.</p>
-
-<pre class="brush: js">const regexp = RegExp('[a-c]','g');
-regexp.lastIndex = 1;
-const cadena = 'abc';
-Array.from(cadena.matchAll(regexp), m =&gt; `${regexp.lastIndex} ${m[0]}`);
-// Array [ "1 b", "1 c" ]</pre>
-
-<h3 id="Mejor_acceso_para_capturar_grupos">Mejor acceso para capturar grupos</h3>
-
-<p>Otra buena razón para <code>matchAll</code> es el mejorado acceso a los grupos de captura. Los grupos de captura son ignorados cuando se usa <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/match">match()</a></code> con la bandera global <code>/g</code>:</p>
-
-<pre class="brush: js">var regexp = /t(e)(st(\d?))/g;
-var cadena = 'test1test2';
-
-cadena.match(regexp);
-// Array ['test1', 'test2']</pre>
-
-<p>Con <code>matchAll</code> puedes acceder a ellos:</p>
-
-<pre class="brush: js">let array = [...str.matchAll(regexp)];
-
-array[0];
-// ['test1', 'e', 'st1', '1', index: 0, input: 'test1test2', length: 4]
-array[1];
-// ['test2', 'e', 'st2', '2', index: 5, input: 'test1test2', length: 4]
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.matchall', 'String.prototype.matchAll')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.matchAll")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("RegExp")}}</li>
- <li>{{jsxref("RegExp.prototype.exec()")}}</li>
- <li>{{jsxref("RegExp.prototype.test()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/normalize/index.html b/files/es/web/javascript/referencia/objetos_globales/string/normalize/index.html
deleted file mode 100644
index 2794644f1c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/normalize/index.html
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: String.prototype.normalize()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/normalize
-tags:
-  - Cadena
-  - ECMAScript 2015
-  - JavaScript
-  - Prototipo
-  - Referencia
-  - String
-  - Unicode
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/normalize
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>normalize()</code></strong> retorna la Forma de Normalización Unicode de la cadena dada (si el valor no es una cadena, primero será convertido a ese tipo).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>str</var>.normalize([<var>form</var>])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>form</code></dt>
- <dd>Uno de<code>"NFC"</code>, <code>"NFD"</code>, <code>"NFKC"</code>, o <code>"NFKD"</code>, especificando la Forma de Normalización Unicode. Si es omitida o {{jsxref("undefined")}}, se utiliza <code>"NFC"</code>.
- <ul>
-  <li><code>NFC</code> — Forma de Normalización de Composición Canónica.</li>
-  <li><code>NFD</code> — Forma de Normalización de Descomposición Canónica.</li>
-  <li><code>NFKC</code> — Forma de Normalización de Composición de Compatibilidad.</li>
-  <li><code>NFKD</code> — Forma de Normalización de Descomposición de Compatibilidad.</li>
- </ul>
- </dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una cadena que contiene la Forma de Normalización Unicode de la cadena dada.</p>
-
-<h3 id="Errores_lanzados">Errores lanzados</h3>
-
-<dl>
- <dt>{{jsxref("RangeError")}}</dt>
- <dd>Un error {{jsxref("RangeError")}} es lanzado si <code>form</code> no es uno de los valores especificados arriba.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>normalize()</code> retorna la Forma de Normalización Unicode de una cadena. No afecta el valor de la cadena en sí misma.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Uso_de_normalize()">Uso de <code>normalize()</code></h3>
-
-<pre class="brush: js">// Cadena inicial
-
-// U+1E9B: LETRA S LATINA MINÚSCULA CON PUNTO ARRIBA
-// U+0323: COMBINACIÓN CON PUNTO ABAJO
-var str = '\u1E9B\u0323';
-
-
-// Forma compuesta canónicamente (NFC)
-
-// U+1E9B: LETRA S LATINA MINÚSCULA CON PUNTO ARRIBA
-// U+0323: COMBINACIÓN CON PUNTO ABAJO
-str.normalize('NFC'); // '\u1E9B\u0323'
-str.normalize();      // lo mismo que arriba
-
-
-// Forma canónicamente descompuesta (NFD)
-
-// U+017F: LETRA S LATINA MINÚSCULA
-// U+0323: COMBINACIÓN CON PUNTO ABAJO
-// U+0307: COMBINACIÓN CON PUNTO ARRIBA
-str.normalize('NFD'); // '\u017F\u0323\u0307'
-
-
-// Compuesta con compatibilidad (NFKC)
-
-// U+1E69: LETRA S LATINA MINÚSCULA CON PUNTO ARRIBA Y ABAJO
-str.normalize('NFKC'); // '\u1E69'
-
-
-// Descompuesta con compatibilidad (NFKD)
-
-// U+0073: LETRA S LATINA MINÚSCULA
-// U+0323: COMBINACIÓN CON PUNTO ABAJO
-// U+0307: COMBINACIÓN CON PUNTO ARRIBA
-str.normalize('NFKD'); // '\u0073\u0323\u0307'
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-string.prototype.normalize', 'String.prototype.normalize')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.normalize', 'String.prototype.normalize')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si quiere contribuir a estos datos, por favor hágalo utilizando éste repositorio <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.normalize")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="http://www.unicode.org/reports/tr15/">Anexo del Estándar Unicode #15, Formas de Normalización Unicode</a></li>
- <li><a href="http://en.wikipedia.org/wiki/Unicode_equivalence">Equivalencia Unicode</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/padstart/index.html b/files/es/web/javascript/referencia/objetos_globales/string/padstart/index.html
deleted file mode 100644
index 57abbd8f5c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/padstart/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: String.prototype.padStart()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/padStart
-tags:
-  - Cadena
-  - Experimental
-  - JavaScript
-  - Método(2)
-  - Referencia
-translation_of: Web/JavaScript/Reference/Global_Objects/String/padStart
----
-<div>{{JSRef}}{{SeeCompatTable}}</div>
-
-<p>El método <code><strong>padStart()</strong></code> rellena la cadena actual con una cadena dada (repetida eventualmente) de modo que la cadena resultante alcance una longitud dada. El relleno es aplicado desde el inicio (izquierda) de la cadena actual.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>str</var>.padStart(<var>targetLength</var> [, <var>padString</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>targetLength</code></dt>
- <dd>La longitud de la cadena resultante una vez la cadena actual haya sido rellenada. Si este parámetro es más pequeño que la longitud de la cadena actual, la cadena actual será devuelta sin modificar.</dd>
- <dt><code>padString</code> {{optional_inline}}</dt>
- <dd>La cadena para rellenar la cadena actual. Si esta cadena es muy larga, será recortada y la parte más a la izquierda será aplicada. El valor por defecto para este parámetro es " " (U+0020).</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un {{jsxref("String")}} de la longitud específicada con la cadena de relleno aplicada desde el inicio.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">'abc'.padStart(10);         // "       abc"
-'abc'.padStart(10, "foo");  // "foofoofabc"
-'abc'.padStart(6,"123465"); // "123abc"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>Este método aún no ha alcanzado el estándar ECMAScript. Actualmente es una <a href="https://github.com/tc39/proposal-string-pad-start-end">propuesta para ECMAScript</a>.</p>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome("52")}} </td>
-   <td>{{CompatGeckoDesktop(48)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile(48)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.padEnd()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/string/prototype/index.html
deleted file mode 100644
index 89519b08d2..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/prototype/index.html
+++ /dev/null
@@ -1,118 +0,0 @@
----
-title: String.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/String/prototype
-tags:
-  - JavaScript
-  - Property
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String
-translation_of_original: Web/JavaScript/Reference/Global_Objects/String/prototype
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>The <strong><code>String.prototype</code></strong> propiedad representa el prototipo de esta clase. Puede usar el prototipo para añadir propiedades o métodos a todas las instancias de una clase.</p>
-
-<div>{{js_property_attributes(0,0,0)}}</div>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>String.prototype.constructor</code></dt>
- <dd>Especifica la función que crea un prototipo de objeto.</dd>
- <dt>{{jsxref("String.prototype.length")}}</dt>
- <dd>Refleja la longitud de la cadena.</dd>
-</dl>
-
-<div>{{ jsOverrides("Object", "properties", "constructor", "length") }}</div>
-
-<h2 id="Métodos">Métodos</h2>
-
-<h3 id="M.C3.A9todos_no_relacionados_con_HTML" name="M.C3.A9todos_no_relacionados_con_HTML">Métodos no relacionados con HTML</h3>
-
-<dl>
- <dt>{{jsxref("String.prototype.charAt()")}}</dt>
- <dd>Devuelve el carácter en el índice especificado.</dd>
- <dt>{{jsxref("String.prototype.charCodeAt()")}}</dt>
- <dd>Devuelve el número que indica el valor Unicode del carácter en el índice especificado.</dd>
- <dt>{{jsxref("String.prototype.concat()")}}</dt>
- <dd>Combina el texto de dos cadenas y devuelve una nueva cadena.</dd>
- <dt>{{jsxref("String.prototype.indexOf()")}}</dt>
- <dd>Devuelve el índice dentro del objeto <code>String</code> que realiza la llamada de la primera ocurrencia del valor especificado, o -1 si no lo encuentra.</dd>
- <dt>{{jsxref("String.prototype.lastIndexOf()")}}</dt>
- <dd>Devuelve el índice dentro del objeto <code>String</code> que realiza la llamada de la última ocurrencia del valor especificado, o -1 si no lo encuentra.</dd>
- <dt>{{jsxref("String.prototype.match()")}}</dt>
- <dd>Se usa para emparejar una expresión regular con una cadena.</dd>
- <dt>{{jsxref("String.prototype.replace()")}}</dt>
- <dd>Se usa para emparejar una expresión regular con una cadena, y reemplezar la subcadena emparejada con una nueva subcadena.</dd>
- <dt>{{jsxref("String.prototype.search()")}}</dt>
- <dd>Realiza una búsqueda de una expresión regular en una cadena especificada.</dd>
- <dt>{{jsxref("String.prototype.slice()")}}</dt>
- <dd>Extrae una sección de una cadena y devuelve una nueva cadena.</dd>
- <dt>{{jsxref("String.prototype.split()")}}</dt>
- <dd>Divide un objeto <code>String</code> en un arreglo de cadenas, separando la cadena en subcadenas.</dd>
- <dt>{{jsxref("String.prototype.substr()")}}</dt>
- <dd>Devuelve los caracteres de una cadena comenzando en la localización especificada y hasta el número de caracteres especificado.</dd>
- <dt>{{jsxref("String.prototype.substring()")}}</dt>
- <dd>Devuelve los caracteres de una cadena entre dos índices dentro de la cadena.</dd>
- <dt>{{jsxref("String.prototype.toLowerCase()")}}</dt>
- <dd>Devuelve el valor de la cadena que realiza la llamada en minúsculas.</dd>
- <dt>{{jsxref("String.prototype.toSource()")}}</dt>
- <dd>Devuelve el objeto literal que representa el objeto especificado; puede usar este valor para crear un nuevo objeto. Sobreescribe el método {{jsxref("Object.prototype.toSource()")}}.</dd>
- <dt>{{jsxref("String.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el objeto especificado. Sobreescribe el método {{jsxref("Object.prototype.toString()")}}.</dd>
- <dt>{{jsxref("String.prototype.toUpperCase()")}}</dt>
- <dd>Devuelve el valor de la cadena que realiza la llamada en mayúsculas.</dd>
- <dt>{{jsxref("String.prototype.valueOf()")}}</dt>
- <dd>Devuelve el valor primitivo del objeto especificado. Sobreescribe el método {{jsxref("Object.prototype.valueOf()")}}.</dd>
-</dl>
-
-<h3 id="HTML_wrapper_methods" name="HTML_wrapper_methods">Métodos de encapsulado HTML</h3>
-
-<p>Cada uno de los métodos siguientes devuelve una copia de la cadena encapsulada dentro de una etiqueta HTML. Por ejemplo, "test".bold() devuelve "&lt;b&gt;test&lt;/b&gt;".</p>
-
-<dl>
- <dt>{{jsxref("String.prototype.anchor()")}}</dt>
- <dd><a class="external" href="http://www.w3.org/TR/html401/struct/links.html#adef-name-A"><code>&lt;a name="<em>name</em>"&gt;</code></a> (Ancha Hipertexto)</dd>
- <dt>{{jsxref("String.prototype.big()")}}</dt>
- <dd>{{HTMLElement("big")}}</dd>
- <dt>{{jsxref("String.prototype.blink()")}}</dt>
- <dd>{{HTMLElement("blink")}}</dd>
- <dt>{{jsxref("String.prototype.bold()")}}</dt>
- <dd>{{HTMLElement("b")}}</dd>
- <dt>{{jsxref("String.prototype.fixed()")}}</dt>
- <dd>{{HTMLElement("tt")}}</dd>
- <dt>{{jsxref("String.prototype.fontcolor()")}}</dt>
- <dd><code>&lt;font color="<em>color</em>"&gt;</code></dd>
- <dt>{{jsxref("String.prototype.fontsize()")}}</dt>
- <dd><code>&lt;font size="<em>size</em>"&gt;</code></dd>
- <dt>{{jsxref("String.prototype.italics()")}}</dt>
- <dd>{{HTMLElement("i")}}</dd>
- <dt>{{jsxref("String.prototype.link()")}}</dt>
- <dd><a class="external" href="http://www.w3.org/TR/html401/struct/links.html#adef-href"><code>&lt;a href="<em>url</em>"&gt;</code></a> (Enlace a URL)</dd>
- <dt>{{jsxref("String.prototype.small()")}}</dt>
- <dd>{{HTMLElement("small")}}</dd>
- <dt>{{jsxref("String.prototype.strike()")}}</dt>
- <dd>{{HTMLElement("strike")}}</dd>
- <dt>{{jsxref("String.prototype.sub()")}}</dt>
- <dd>{{HTMLElement("sub")}}</dd>
- <dt>{{jsxref("String.prototype.sup()")}}</dt>
- <dd>{{HTMLElement("sup")}}</dd>
-</dl>
-
-<p>Estos métodos son de uso limitado, ya que sólo están disponibles un subconjunto de etiquetas HTML y atributos.</p>
-
-<p>{{ jsOverrides("Object", "methods", "charAt", "charCodeAt", "concat", "indexOf", "lastIndexOf", "localeCompare", "match", "quote", "replace", "search", "slice", "split", "substr", "substring", "toLocaleLowerCase", "toLocaleUpperCase", "toLowerCase", "toSource", "toString", "toUpperCase", "trim", "trimLeft", "trimRight", "valueOf", "anchor", "big", "blink", "bold", "fixed", "fontcolor", "fontsize", "italics", "link", "small", "strike", "sub", "sup") }}</p>
-
-<h2 id="See_also" name="See_also">Vea también</h2>
-
-<ul>
- <li>{{jsxref("String")}}</li>
- <li>{{jsxref("Function.prototype")}}</li>
-</ul>
-
-<dl>
- <dt> </dt>
-</dl>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/raw/index.html b/files/es/web/javascript/referencia/objetos_globales/string/raw/index.html
deleted file mode 100644
index 3c8f3c1d55..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/raw/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: String.raw()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/raw
-translation_of: Web/JavaScript/Reference/Global_Objects/String/raw
----
-<div>{{JSRef}}</div>
-
-<p>El método estatico <strong><code>String.raw()</code> </strong> es una función de <a href="/en-US/docs/Web/JavaScript/Reference/template_strings"> plantilla de literales</a>, similar al prefijo <code>r</code> en Python o al prefijo <code>@</code> en C# para strings literales (con ciertas diferencias: ver la explicación en <a href="https://bugs.chromium.org/p/v8/issues/detail?id=5016">este problema</a>). Se utiliza para obtener un <em>string</em> crudo a partir de plantillas de <em>string</em> (es decir, el original, texto no interpretado).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>String.raw(<var>callSite</var>, <var>...substitutions</var>)
-
-String.raw`templateString`
-</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>callSite</code></dt>
- <dd>Plantilla bien estructurada, similar a <code>{ raw: ['foo', 'bar', 'baz'] }</code>.</dd>
- <dt><code>...substitutions</code></dt>
- <dd>Contiene valores de sustitución.</dd>
- <dt><code>templateString</code></dt>
- <dd>[opcional] Una <a href="/en-US/docs/Web/JavaScript/Reference/template_strings">plantilla <em>string</em></a>, con sustituciones (<code>${...}</code>).</dd>
-</dl>
-
-<h3 id="Valor_de_regreso">Valor de regreso</h3>
-
-<p>La forma cruda del <em>string </em>de una plantilla <em>string </em>proporcionada.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<dl>
- <dt>{{jsxref("TypeError")}}</dt>
- <dd>Un {{jsxref("TypeError")}} es arrojado si el primer argumento no es un objeto bien estructurado.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>En la mayoría de los casos, <code>String.raw()</code> es usado con plantillas <em>string</em>. La primera sintaxis mencionada arriba es raramente usada,  porque el motor de JavaScript hará la llamada por ti con los argumentos apropiados, al igual que otras <a href="/en-US/docs/Web/JavaScript/Reference/template_strings#Tagged_template_literals">funciones de etiqueta</a>.</p>
-
-<p><code>String.raw()</code> es la unica función de etiqueta incorporada en las plantillas <em>string</em>; trabaja igual que la función de la plantilla por defecto y ejecuta la concatenación. Incluso puedes reimplementarlo con código normal de JavaScript.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_String.raw()">Usando <code>String.raw()</code></h3>
-
-<pre class="brush: js">String.raw`Hi\n${2+3}!`;
-// 'Hi\n5!', the character after 'Hi'
-// is not a newline character,
-// '\' and 'n' are two characters.
-
-String.raw`Hi\u000A!`;
-// 'Hi\u000A!', same here, this time we will get the
-//  \, u, 0, 0, 0, A, 6 characters.
-// All kinds of escape characters will be ineffective
-// and backslashes will be present in the output string.
-// You can confirm this by checking the .length property
-// of the string.
-
-let name = 'Bob';
-String.raw`Hi\n${name}!`;
-// 'Hi\nBob!', substitutions are processed.
-
-// Normally you would not call String.raw() as a function,
-// but to simulate `t${0}e${1}s${2}t` you can do:
-String.raw({ raw: 'test' }, 0, 1, 2); // 't0e1s2t'
-// Note that 'test', a string, is an array-like object
-// The following is equivalent to
-// `foo${2 + 3}bar${'Java' + 'Script'}baz`
-String.raw({
-  raw: ['foo', 'bar', 'baz']
-}, 2 + 3, 'Java' + 'Script'); // 'foo5barJavaScriptbaz'
-
-</pre>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-string.raw', 'String.raw')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definicion inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.raw', 'String.raw')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.raw")}}</p>
-
-<h2 id="Tambien_ver">Tambien ver</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/template_strings">Template strings</a></li>
- <li>{{jsxref("String")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Lexical grammar</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/repeat/index.html b/files/es/web/javascript/referencia/objetos_globales/string/repeat/index.html
deleted file mode 100644
index a449bdfb27..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/repeat/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: String.prototype.repeat()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/repeat
-tags:
-  - ECMAScript2015
-  - JavaScript
-  - Prototype
-  - Referencia
-  - String
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/repeat
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>repeat()</code></strong> construye y devuelve una nueva cadena que contiene el número especificado de copias de la cadena en la cual fue llamada, concatenados.</p>
-
-<h2 id="Sintáxis">Sintáxis</h2>
-
-<pre class="syntaxbox"><code><var>str</var>.repeat(<var>count</var>)</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>count</code></dt>
- <dd>Un entero entre 0 y +∞: [0, +∞), indicando el número de veces a repetir la cadena en la nueva cadenada creada que será devuelta.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Un nuevo string que contiene el número especificado de copias del string original.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<ul>
- <li>{{jsxref("Errors/Negative_repetition_count", "RangeError")}}: El número de repeticiones no debe ser negativo.</li>
- <li>{{jsxref("Errors/Resulting_string_too_large", "RangeError")}}: El número de repeticiones debe ser menor que infinito y no desbordar el tamaño máximo para un string.</li>
-</ul>
-
-<dl>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">'abc'.repeat(-1);   // RangeError
-'abc'.repeat(0);    // ''
-'abc'.repeat(1);    // 'abc'
-'abc'.repeat(2);    // 'abcabc'
-'abc'.repeat(3.5);  // 'abcabcabc' (count will be converted to integer)
-'abc'.repeat(1/0);  // RangeError
-
-({ toString: () =&gt; 'abc', repeat: String.prototype.repeat }).repeat(2);
-// 'abcabc' (repeat() is a generic method)
-</pre>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este método ha sido añadido a la especificación ECMAScript 6 y tal vez aún no se encuentre disponible en todas las implementaciones de JavaScript. Sin embargo, usted puede establecer <code>String.prototype.repeat()</code> con el siguiente fragmento de código:</p>
-
-<pre class="brush: js">if (!String.prototype.repeat) {
-  String.prototype.repeat = function(count) {
-    'use strict';
-    if (this == null) {
-      throw new TypeError('can\'t convert ' + this + ' to object');
-    }
-    var str = '' + this;
-    count = +count;
-    if (count != count) {
-      count = 0;
-    }
-    if (count &lt; 0) {
-      throw new RangeError('repeat count must be non-negative');
-    }
-    if (count == Infinity) {
-      throw new RangeError('repeat count must be less than infinity');
-    }
-    count = Math.floor(count);
-    if (str.length == 0 || count == 0) {
-      return '';
-    }
-    // Ensuring count is a 31-bit integer allows us to heavily optimize the
-    // main part. But anyway, most current (August 2014) browsers can't handle
-    // strings 1 &lt;&lt; 28 chars or longer, so:
-    if (str.length * count &gt;= 1 &lt;&lt; 28) {
-      throw new RangeError('repeat count must not overflow maximum string size');
-    }
-    var rpt = '';
-    for (;;) {
-      if ((count &amp; 1) == 1) {
-        rpt += str;
-      }
-      count &gt;&gt;&gt;= 1;
-      if (count == 0) {
-        break;
-      }
-      str += str;
-    }
-    return rpt;
-  }
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<div>{{Compat("javascript.builtins.String.repeat")}}</div>
-
-<div id="compat-mobile"> </div>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/replace/index.html b/files/es/web/javascript/referencia/objetos_globales/string/replace/index.html
deleted file mode 100644
index 680393ece1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/replace/index.html
+++ /dev/null
@@ -1,202 +0,0 @@
----
-title: String.prototype.replace()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/replace
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - Regular Expressions
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/replace
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p><span class="seoSummary">El método <strong><code>replace()</code></strong> devuelve una nueva cadena con algunas o todas las coincidencias de un <code>patrón</code>, siendo cada una de estas coincidencias reemplazadas por <code>remplazo</code></span>. El <code>patrón</code> puede ser una cadena o una {{jsxref("RegExp")}}, y el <code>reemplazo</code> puede ser una cadena o una función que será llamada para cada coincidencia. Si el <code>patrón</code> es una cadena, sólo la primera coincidencia será reemplazada.</p>
-
-<p>La cadena original permanecerá inalterada.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/string-replace.html")}}</div>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="eval"><code class="language-html"><em>cadena</em>.replace(regexp|substr, newSubStr|function[, </code>{{ Non-standard_inline() }} <code class="language-html">flags]);</code>
-</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>expresionregular</code></dt>
- <dd>Un objeto {{jsxref("RegExp")}} o literal. Las coincidencias son reemplazadas por <code class="language-html">ewSubSt</code> o el valor devuelto por la función especificada.</dd>
-</dl>
-
-<dl>
- <dt><code>subcadena</code></dt>
- <dd>Un objeto {{jsxref("String")}} que será reemplazado por <code>nuevaSubcadena</code>.</dd>
-</dl>
-
-<dl>
- <dt><code>nuevaSubcadena</code></dt>
- <dd>El objeto {{jsxref("String")}} que reemplaza la subcadena que recibida desde el primer parámetro.</dd>
-</dl>
-
-<dl>
- <dt><code>funcion</code></dt>
- <dd>Una función que será invocada para crear la nueva subcadena (para ponerla en lugar de la subcadena recibida por el primer parámetro).</dd>
-</dl>
-
-<dl>
- <dt><code>flags</code> {{ non-standard_inline() }}</dt>
- <dd>Un objeto {{jsxref("String")}} que contiene cualquier combinación de flags de la clase RegExp: <code>g</code> - emparejamiento global, <code>i</code> - ignorar mayúsculas, <code>m</code> - emparejar multiples líneas. Este parámetro se usa sólo si el primer parámetro es una cadena.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Este método no cambia el objeto <code>String</code> sobre el que se realiza la llamada. Simplemente devuelve una nueva cadena.</p>
-
-<p>Para realizar una búsqueda global y reemplazarla, o se incluye el flag <code>g</code> en la expresión regular o si el primer parámetro es una cadena, se incluye <code>g</code> en el parámetro <code>flags</code>.</p>
-
-<h4 id="Especificando_una_cadena_como_un_par.C3.A1metro" name="Especificando_una_cadena_como_un_par.C3.A1metro">Especificando una cadena como un parámetro</h4>
-
-<p>La cadena de reemplazo puede incluir los siguientes patrones de reemplazo especiales:</p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <td class="header">Patrón</td>
-   <td class="header">Inserta</td>
-  </tr>
-  <tr>
-   <td><code>$$</code></td>
-   <td>Inserta una "$".</td>
-  </tr>
-  <tr>
-   <td><code>$&amp;</code></td>
-   <td>Inserta la subcadena emparejada.</td>
-  </tr>
-  <tr>
-   <td><code>$`</code></td>
-   <td>Inserta la sección de cadena que precede a la subcadena emparejada.</td>
-  </tr>
-  <tr>
-   <td><code>$'</code></td>
-   <td>Inserta la porción de subcadena que sigue a la subcadena emparejada.</td>
-  </tr>
-  <tr>
-   <td style="white-space: nowrap;"><code>$<em>n</em> </code> o <code>$<em>nn</em> </code></td>
-   <td>Donde <code><em>n</em> </code> o <code><em>nn</em> </code> son dígitos decimales positivos menores a 100, inserta la subcadena emparejada de orden <em>n</em> del paréntesis, proporcionado por el primer argumento del objeto <code>RegExp</code>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Especificando_una_funci.C3.B3n_con_un_par.C3.A1metro" name="Especificando_una_funci.C3.B3n_con_un_par.C3.A1metro">Especificando una función con un parámetro</h3>
-
-<p>Cuando se especifica una función en el segundo parámetro, la función es invocada después de que el emparejamiento se haya realizado. (El uso de una función de este modo se llama expresión lambda.)</p>
-
-<p>En la función, puedes generar dinámicamente la cadena que reemplaza la subcadena emparejada. El resultado de la llamada de la función se usa como valor de reemplazo.</p>
-
-<p>The nested function can use the matched substrings to determine the new string (<code>newSubStr</code>) that replaces the found substring. You get the matched substrings through the parameters of your function. The first parameter of your function holds the complete matched substring. If the first argument was a <code>RegExp</code> object, then the following<em>n</em> parameters can be used for parenthetical matches, remembered submatch strings, where<em>n</em> is the number of submatch strings in the regular expression. Finally, the last two parameters are the offset within the string where the match occurred and the string itself. For example, the following <code>replace</code> method returns XXzzzz - XX , zzzz.</p>
-
-<pre class="brush: js">function replacer(str, p1, p2, offset, s)
-{
-  return str + " - " + p1 + " , " + p2;
-}
-var newString = "XXzzzz".replace(/(X*)(z*)/, replacer);
-console.log(newString); // XXzzzz - XX , zzzz
-</pre>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Using_global_and_ignore_with_replace" name="Ejemplo:_Using_global_and_ignore_with_replace">Ejemplo: Usando <code>global</code> e <code>ignore</code> con <code>replace</code></h3>
-
-<p>En el siguiente ejemplo, la expresión regular incluye las banderas "global" e "ignore case", las cuales permiten al método <code>replace</code> reemplazar cada aparición de la cadena 'apples' por la cadena 'oranges'.</p>
-
-<pre class="eval">var re = /apples/gi;
-var str = "Apples are round, and apples are juicy.";
-var newstr = str.replace(re, "oranges");
-print(newstr);
-</pre>
-
-<p>In this version, a string is used as the first parameter and the global and ignore case flags are specified in the <code>flags</code> parameter.</p>
-
-<pre class="eval">var str = "Apples are round, and apples are juicy.";
-var newstr = str.replace("apples", "oranges", "gi");
-print(newstr);
-</pre>
-
-<p>Both of these examples print "oranges are round, and oranges are juicy."</p>
-
-<h3 id="Ejemplo_Definiendo_la_expresi.C3.B3n_regular_en_replace" name="Ejemplo:_Definiendo_la_expresi.C3.B3n_regular_en_replace">Ejemplo: Definiendo la expresión regular en <code>replace</code></h3>
-
-<p>En el siguiente ejemplo, se define la expresión regular en <code>replace</code> e incluye el flag de ignorar mayúsculas.</p>
-
-<pre class="eval">var cadena = "Twas the night before Xmas...";
-var nuevaCadena = cadena.replace(/xmas/i, "Christmas");
-print(nuevaCadena);
-</pre>
-
-<p>Esto muestra "Twas the night before Christmas..."</p>
-
-<h3 id="Ejemplo_Conectando_palabras_en_una_cadena" name="Ejemplo:_Conectando_palabras_en_una_cadena">Ejemplo: Conectando palabras en una cadena</h3>
-
-<p>El siguiente código conecta las palabras dentro de la cadena. Para reemplazar el texto, el código usa <code>$1</code> y <code>$2</code> como patrones de reemplazo.</p>
-
-<pre class="eval">var expresion = /(\w+)\s(\w+)/;
-var cadena = "John Smith";
-var nuevaCadena = cadena.replace(expresion, "$2, $1");
-print(nuevaCadena);
-</pre>
-
-<p>Esto muestra "Smith, John".</p>
-
-<h3 id="Ejemplo_Using_an_inline_function_that_modifies_the_matched_characters" name="Ejemplo:_Using_an_inline_function_that_modifies_the_matched_characters">Ejemplo: Using an inline function that modifies the matched characters</h3>
-
-<p>In this example, all occurrences of capital letters in the string are converted to lower case, and a hyphen is inserted just before the match location. The important thing here is that additional operations are needed on the matched item before it is given back as a replacement.</p>
-
-<p>The replacement function accepts the matched snippet as its parameter, and uses it to transform the case and concatenate the hyphen before returning.</p>
-
-<pre class="brush: js">function styleHyphenFormat(propertyName)
-{
-  function upperToHyphenLower(match)
-  {
-    return '-' + match.toLowerCase();
-  }
-  return propertyName.replace(/[A-Z]/, upperToHyphenLower);
-}
-</pre>
-
-<p>Given <code>styleHyphenFormat('borderTop')</code>, this returns 'border-top'.</p>
-
-<p>Because we want to further transform the<em>result</em> of the match before the final substitution is made, we must use a function. This forces the evaluation of the match prior to the <code>toLowerCase()</code> method. If we had tried to do this using the match without a function, the toLowerCase() would have no effect.</p>
-
-<pre class="brush: js">var newString = propertyName.replace(/[A-Z]/, '-' + '$&amp;'.toLowerCase());  // won't work
-</pre>
-
-<p>This is because <code>'$&amp;'.toLowerCase()</code> would be evaluated first as a string literal (resulting in the same <code>'$&amp;'</code>) before using the characters as a pattern.</p>
-
-<h3 id="Ejemplo_Reemplazando_grandos_Fahrenheit_con_su_equivalente_Celsius" name="Ejemplo:_Reemplazando_grandos_Fahrenheit_con_su_equivalente_Celsius">Ejemplo: Reemplazando grados Fahrenheit con su equivalente Celsius</h3>
-
-<p>El siguiente ejemplo reemplaza los grados Fahrenheit con su enquivalente en grados Celsius. Los grados Fahrenheit deberían ser un número acabado en F. La función devuelve el número Celsius acabado en C. Por ejemplo, si el número de entrada es 212F, la función devuelve 100C. Si el número es 0F, la función devuelve -17.77777777777778C.</p>
-
-<p>La expresión regular <code>test</code> revisa si para un número termina en F. El número de grados Fahrenheit es accesible a la función a través de su segundo parámetro, <code>p1</code>. La función establece el número Celsius basado en los grados Fahrenheit pasados en una cadena a la función <code>f2c</code>. Entonces <code>f2c</code> devuelve el número Celsius. Esta función aproxima al flag de Perl s///e.</p>
-
-<pre class="brush: js">function f2c(x)
-{
-  function convert(str, p1, offset, s)
-  {
-    return ((p1-32) * 5/9) + "C";
-  }
-  var s = String(x);
-  var test = /(\d+(?:\.\d*)?)F\b/g;
-  return s.replace(test, convert);
-}
-</pre>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.match()")}}</li>
- <li>{{jsxref("RegExp.prototype.exec()")}}</li>
- <li>{{jsxref("RegExp.prototype.test()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/search/index.html b/files/es/web/javascript/referencia/objetos_globales/string/search/index.html
deleted file mode 100644
index 23e37234d1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/search/index.html
+++ /dev/null
@@ -1,153 +0,0 @@
----
-title: String.prototype.search()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/search
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - Reference
-  - Regular Expressions
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/search
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <code><strong>search() </strong></code>ejecuta una búsqueda que encaje entre una expresión regular y el objeto <code>String</code> desde el que se llama.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>str</em>.search(<em>expresionregular</em>)</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt>regexp</dt>
- <dd>Un objeto <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp"> expresión regular</a>. Si se pasa un objeto <code>obj </code>que no sea una expresión regular, se convierte implicitamente en una expresión regualar usando <code>new RegExp(obj)</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El índice de la primera coincidencia entre la expresión regular y la cadena de texto proporcionada, si no se encuentra devuelve <strong>-1</strong>.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Cuando se desee saber en qué casos un patrón se encuentra en una cadena de texto utiliza <code>search()</code> (si sólo deseas saber si existe, utiliza el método {{jsxref("RegExp.prototype.test()", "test()")}} del prototipo de <code>RegExp</code>); para más información (pero de ejecución más lenta) utiliza {{jsxref("String.prototype.match()", "match()")}} (similar al método {{jsxref("RegExp.prototype.exec()", "exec()")}} de las expresiones regulares).</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_search" name="Example:_Using_search">Utilizando <code>search()</code></h3>
-
-<p>El siguiente ejemplo imprime un mensaje dependiendo de cuál sea el resultado de la evaluación.</p>
-
-<pre class="brush: js">function testinput(re, str) {
-  var midstring;
-  if (str.search(re) != -1) {
-    midstring = ' contains ';
-  } else {
-    midstring = ' does not contain ';
-  }
-  console.log(str + midstring + re);
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.12', 'String.prototype.search')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.search', 'String.prototype.search')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.search', 'String.prototype.search')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_específicas_de_Gecko">Notas específicas de Gecko</h2>
-
-<ul>
- <li>Antes de {{Gecko("8.0")}}, <code>search()</code> estaba mal implementado; cuando se invocaba sin parámetros o con {{jsxref("undefined")}}, buscaría coincidencias con la cadena 'undefined' en lugar de la cadena vacía. Esto está corregido; ahora <code>'a'.search()</code> y <code>'a'.search(undefined)</code> devuelven correctamente un 0.</li>
- <li>Desde Gecko 39 {{geckoRelease(39)}}, el argumento no estándar <code>flags </code>está obsoleto y muestra un aviso en la consola ({{bug(1142351)}}).</li>
- <li>Desde Gecko 47 {{geckoRelease(47)}}, el argumento no estándar <code>flags</code> no es soportado en compilaciones que no sean lanzamientos y pronto serán eliminadas por completo ({{bug(1245801)}}).</li>
- <li>Desde Gecko 49 {{geckoRelease(49)}}, el argumento no estándar <code>flags </code>no es soportado ({{bug(1108382)}}).</li>
-</ul>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.match()")}}</li>
- <li>{{jsxref("RegExp.prototype.exec()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/slice/index.html b/files/es/web/javascript/referencia/objetos_globales/string/slice/index.html
deleted file mode 100644
index cbfe5a716b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/slice/index.html
+++ /dev/null
@@ -1,161 +0,0 @@
----
-title: String.prototype.slice()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/slice
-tags:
-  - Cadena
-  - JavaScript
-  - Método(2)
-  - Prototipo
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/slice
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <strong><code>slice()</code></strong> extrae una sección de una cadena y devuelve una cadena nueva.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="eval"><code class="language-html"><em>cadena</em>.slice(<em>inicioTrozo</em>[, <em>finTrozo</em>])</code>
-</pre>
-
-<h3 id="Parameters" name="Parameters">Parameters</h3>
-
-<dl>
- <dt><code>inicioTrozo</code></dt>
- <dd>El índice basado en cero en el cual empieza la extracción.  Si es negativo, se trata como <code>longCadena + inicioTrozo</code> donde <code>longCadena</code> es la longitud de la cadena (por ejemplo, si <code>inicioTrozo</code> es <code>-3</code> se trata como <code>longCadena - 3</code>)</dd>
-</dl>
-
-<dl>
- <dt><code>finTrozo</code></dt>
- <dd>Opcional. El índice basado en cero en el que termina la extracción. Si se omite, <code>slice</code> extrae hasta el final de la cadena.  Si es negativo, se trata como <code>longCadena + finTrozo</code> donde <code>longCadena</code> es la longitud de la cadena (por ejemplo, si <code>finTrozo </code>es <code>-3</code> se trata como <code>longCadena - 3</code>).</dd>
-</dl>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Una nueva cadena que contiene la sección de la cadena.</p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>slice</code> extrae el texto de una cadena y devuelve una nueva cadena. Los cambios en el texto de una cadena no afectan a la otra cadena.</p>
-
-<p><code>slice</code> extrae hasta, pero sin incluir <code>finalTrozo</code>. <code>string.slice(1,4)</code> extrae del segundo carácter hasta el cuarto carácter (caracteres con índice 1, 2 y 3).</p>
-
-<p>Si se usa un índice negativo, finalTrozo indica el punto desde el final de la cadena.string.slice(2, -1) extrae desde tercer carácter hasta el último carácter de la cadena.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_slice_para_crear_una_nueva_cadena" name="Ejemplo:_Usando_slice_para_crear_una_nueva_cadena">Ejemplo: Uso de <code>slice()</code> para crear una nueva cadena</h3>
-
-<p>El siguiente ejemplo usa <code>slice()</code> para crear una nueva cadena.</p>
-
-<pre class="brush: js">var cadena1 = "La mañana se nos echa encima.";
-var cadena2 = cadena1.slice(3, -2);
-console.log(cadena2);
-</pre>
-
-<p>Esto escribe:</p>
-
-<pre class="eval">mañana se nos echa encim</pre>
-
-<h3 id="Uso_de_slice()_con_índices_negativos">Uso de <code>slice()</code> con índices negativos</h3>
-
-<p>El siguiente ejemplo usa <code>slice()</code> con índices negativos.</p>
-
-<pre>var cad = "La mañana se nos echa encima.";<code>
-cad.slice(-3);     // retorna 'ma.'
-cad.slice(-3, -1); // retorna 'ma'
-cad.slice(0, -1);  // retorna 'La mañana se nos echa encima'</code></pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.13', 'String.prototype.slice')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.slice', 'String.prototype.slice')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.slice', 'String.prototype.slice')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.substr()")}}</li>
- <li>{{jsxref("String.prototype.substring()")}}</li>
- <li>{{jsxref("Array.prototype.slice()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/small/index.html b/files/es/web/javascript/referencia/objetos_globales/string/small/index.html
deleted file mode 100644
index a8b2f302fd..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/small/index.html
+++ /dev/null
@@ -1,38 +0,0 @@
----
-title: String.prototype.small()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/small
-tags:
-  - Deprecated
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/small
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<p>{{deprecated_header}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Causa que una cadena se muestra con una fuente pequeña, como si estuviese dentro de una etiqueta {{HTMLElement("small")}}.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox"><em>cadena</em>.small()</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Usa el método <code>small</code> para formatear y mostrar una cadena en un documento.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_tama.C3.B1o_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_tama.C3.B1o_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el tamaño de una cadena</h3>
-<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
-
-console.log(cadenaMundo.small())
-console.log(cadenaMundo.big())
-console.log(cadenaMundo.fontsize(7))
-</pre>
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-<pre class="brush: html">&lt;small&gt;¡Hola mundo!&lt;/small&gt;
-&lt;big&gt;¡Hola mundo!&lt;/big&gt;
-&lt;fontsize=7&gt;¡Hola mundo!&lt;/fontsize&gt;
-</pre>
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-<ul>
- <li>{{jsxref("String.prototype.fontsize()")}}</li>
- <li>{{jsxref("String.prototype.big()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/split/index.html b/files/es/web/javascript/referencia/objetos_globales/string/split/index.html
deleted file mode 100644
index ade291da0f..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/split/index.html
+++ /dev/null
@@ -1,240 +0,0 @@
----
-title: String.prototype.split()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/split
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - Regular Expressions
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/split
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<p>El método <strong><code>split()</code></strong> divide un objeto de tipo <code>String</code> en un array (vector) de cadenas mediante la separación de la cadena en subcadenas.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.split([<em>separador</em>][,<em>limite</em>])</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>separador</code></dt>
- <dd>Especifica el carácter a usar para la separación de la cadena. El <code>separador</code> es tratado como una cadena o como una <a href="/es/docs/Web/JavaScript/Referencia/Objetos_globales/RegExp"> </a>{{jsxref("Objetos_globales/RegExp", "expresión regular", "", 1)}}. Si se omite el <code>separador</code>, el array devuelto contendrá un sólo elemento con la cadena completa.</dd>
-</dl>
-
-<dl>
- <dt><code>limite</code></dt>
- <dd>Opcional. Entero que especifica un límite sobre el número de divisiones a realizar. El método <code>split()</code> todavía se divide en todas las concordancias del <code>separador</code>, pero divide la matriz devuelta en la cantidad de elementos impuesta por el <code>limite</code>.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>El método <code>split()</code> devuelve el nuevo array.</p>
-
-<p>Cuando se encuentra, el <code>separador</code> es eliminado de la cadena y las subcadenas obtenidas se devuelven en un array. Si el <code>separador</code> no es encontrado o se omite, el array contendrá un único elemento con la cadena original completa. Si el <code>separador</code> es una cadena vacía la cadena es convertida en un array de carácteres.</p>
-
-<p>Si el <code>separador</code> es una expresión regular que contiene paréntesis de captura, entonces cada vez que el <code>separador</code> concuerda, los resultados (incluído cualquier resultado indefinido) de los paréntesis de captura son divididos en el array resultante. Sin embargo no todos los navegadores soportan esta característica.</p>
-
-<p>{{Note("Cuando la cadena está vacía, <code>split()</code> devuelve un array que contiene una cadena vacía, en lugar de un array vacío.")}}</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_split" name="Ejemplo:_Usando_split">Usando <code>split()</code></h3>
-
-<p>El siguiente ejemplo define una función que divide una cadena en un array de cadenas usando el separador especificado. Después de la división de la cadena, la función muestra mensajes indicando la cadena original (antes de la división), el separador usado, el número de elementos del array y los elementos individuales del array.</p>
-
-<pre class="brush: js">function dividirCadena(cadenaADividir,separador) {
-   var arrayDeCadenas = cadenaADividir.split(separador);
-   document.write('&lt;p&gt;La cadena original es: "' + cadenaADividir + '"');
-   document.write('&lt;br&gt;El separador es: "' + separador + '"');
-   document.write("&lt;br&gt;El array tiene " + arrayDeCadenas.length + " elementos: ");
-
-   for (var i=0; i &lt; arrayDeCadenas.length; i++) {
-      document.write(arrayDeCadenas[i] + " / ");
-   }
-}
-
-var cadenaVerso = "Oh brave new world that has such people in it.";
-var cadenaMeses = "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec";
-
-var espacio = " ";
-var coma = ",";
-
-dividirCadena(cadenaVerso, espacio);
-dividirCadena(cadenaVerso);
-dividirCadena(cadenaMeses, coma);
-</pre>
-
-<p>Este ejemplo produce el siguiente resultado:</p>
-
-<pre>La cadena original es: "Oh brave new world that has such people in it."
-El separador es: " "
-El array tiene 10 elementos: Oh / brave / new / world / that / has / such / people / in / it. /
-
-La cadena original es: "Oh brave new world that has such people in it."
-El separador es: "undefined"
-El array tiene 1 elementos: Oh brave new world that has such people in it. /
-
-La cadena original es: "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec"
-El separador es: ","
-El array tiene 12 elementos: Jan / Feb / Mar / Apr / May / Jun / Jul / Aug / Sep / Oct / Nov / Dec /
-</pre>
-
-<h3 id="Ejemplo:_Eliminar_espacios_de_una_cadena" name="Ejemplo:_Eliminar_espacios_de_una_cadena">Eliminar espacios de una cadena</h3>
-
-<p>En el siguiente ejemplo, <code>split</code> busca 0 o más espacios seguidos de un punto y coma seguido por 0 o más espacios y, cuando los halla, elimina los espacios de la cadena. <code>listaNombres</code> es el array devuelto como resultado de la llamada a <code>split</code>.</p>
-
-<pre class="brush: js">var nombres = "Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand ";
-document.write(nombres + "&lt;br&gt;" + "&lt;br&gt;");
-var expresionRegular = /\s*;\s*/;
-var listaNombres = nombres.split(expresionRegular);
-document.write(listaNombres);
-</pre>
-
-<p>Esto imprime dos líneas; la primera línea imprime la cadena original, y la segunda línea imprime el array resultante.</p>
-
-<pre>Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand
-Harry Trump,Fred Barney,Helen Rigby,Bill Abel,Chris Hand
-</pre>
-
-<h3 id="Ejemplo:_Devolviendo_un_n.C3.BAmero_limitado_de_divisiones" name="Ejemplo:_Devolviendo_un_n.C3.BAmero_limitado_de_divisiones">Devolviendo un número limitado de divisiones</h3>
-
-<p>El el siguiente ejemplo, <code>split</code> busca 0 o más espacios en una cadena y devuelve las tres primeras divisiones que encuentra.</p>
-
-<pre class="brush: js">var miCadena = "Hola Mundo. Cómo estás hoy?";
-var divisiones = miCadena.split(" ", 3);
-
-print(divisiones);
-</pre>
-
-<p>Este script muestra lo siguiente:</p>
-
-<pre>Hola,Mundo.,Cómo
-</pre>
-
-<h3 id="Paréntesis_de_captura" style="font-size: 1.71428571428571rem;">Paréntesis de captura</h3>
-
-<p>Si el separador contiene paréntesis de capturaI los resultados que concuerden son devueltos en el array.</p>
-
-<pre class="brush: js  language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> miCadena <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">'Hola 1 mundo. Oración número 2.'</span><span class="punctuation token" style="color: #999999;">;</span>
-<span class="keyword token" style="color: #0077aa;">var</span> division <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> miCadena<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">split<span class="punctuation token" style="color: #999999;">(</span></span><span class="regex token" style="color: #ee9900;">/(\d)/</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span>
-
-console<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">log<span class="punctuation token" style="color: #999999;">(</span></span>division<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 57px; background: 0px 0px;"> </div>
-
-<p>Este script muestra lo siguiente:</p>
-
-<pre class="language-html" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;">Hola ,1, mundo. Oración número ,2,.</code></pre>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div>
-
-<h3 id="Dar_la_vuelta_a_una_cadena_usando_split()" style="font-size: 1.71428571428571rem;">Dar la vuelta a una cadena usando <code>split()</code></h3>
-
-<pre class="brush: js  language-js" style="padding: 1em 0px 1em 30px; font-size: 14px; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">var</span> str <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> <span class="string token" style="color: #669900;">'asdfghjkl'</span><span class="punctuation token" style="color: #999999;">;</span>
-<span class="keyword token" style="color: #0077aa;">var</span> strReverse <span class="operator token" style="background: rgba(255, 255, 255, 0.498039); color: #a67f59;">=</span> str<span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">split<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">''</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">reverse<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">.</span><span class="function token" style="color: #dd4a68;">join<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">''</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090;"> // 'lkjhgfdsa'
-</span><span class="comment token" style="color: #708090;">// split() retorna un array en el cual reverse() y join() pueden ser aplicados</span></code></pre>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 0px; background: 0px 0px;"> </div>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 19px; background: 0px 0px;"> </div>
-
-<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; line-height: inherit; top: 38px; background: 0px 0px;"> </div>
-
-<p><strong>Extra:</strong> usar el operador <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators#Identity_.2F_strict_equality_(.3D.3D.3D)">===</a> para verificar si la cadena anterior era un palíndromo.</p>
-
-<h2 id="Specifications" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 3rd Edition.</td>
-   <td>Estándar</td>
-   <td>Definición inicial. Implementado en JavaScript 1.1.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.14', 'String.prototype.split')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.split', 'String.prototype.split')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_los_navegadores" style="margin-bottom: 20px; font-size: 2.14285714285714rem;">Compatibilidad con los navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table" style="border-color: transparent;">
- <tbody>
-  <tr>
-   <th style="line-height: 16px;">Característica</th>
-   <th style="line-height: 16px;">Chrome</th>
-   <th style="line-height: 16px;">Firefox (Gecko)</th>
-   <th style="line-height: 16px;">Internet Explorer</th>
-   <th style="line-height: 16px;">Opera</th>
-   <th style="line-height: 16px;">Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table" style="border-color: transparent;">
- <tbody>
-  <tr>
-   <th style="line-height: 16px;">Característica</th>
-   <th style="line-height: 16px;">Android</th>
-   <th style="line-height: 16px;">Chrome for Android</th>
-   <th style="line-height: 16px;">Firefox Mobile (Gecko)</th>
-   <th style="line-height: 16px;">IE Mobile</th>
-   <th style="line-height: 16px;">Opera Mobile</th>
-   <th style="line-height: 16px;">Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.charAt()")}}</li>
- <li>{{jsxref("String.prototype.indexOf()")}}</li>
- <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
- <li>{{jsxref("Array.prototype.join()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/startswith/index.html b/files/es/web/javascript/referencia/objetos_globales/string/startswith/index.html
deleted file mode 100644
index c658cc80da..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/startswith/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: String.prototype.startsWith()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/startsWith
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Method
-  - Prototipo
-  - Prototype
-  - Reference
-  - Referencia
-  - String
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/startsWith
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>startsWith()</code></strong> indica si una cadena de texto comienza con los caracteres de una cadena de texto concreta, devolviendo <code>true</code> o <code>false</code> según corresponda.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/string-startswith.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><var>str</var>.startsWith(<var>stringBuscada</var>[, <var>posicion</var>])</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>stringBuscada</var></code></dt>
- <dd>Los caracteres a ser buscados al inicio de la cadena de texto.</dd>
- <dt><code><var>posicion</var></code> {{optional_inline}}</dt>
- <dd>La posición de <code><em>str</em></code> en la cual debe comenzar la búsqueda de <code>stringBuscada</code>. El valor por defecto es <code>0</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p><strong><code>true</code></strong> si los caracteres dados se encuentran al inicio de la cadena de texto; <strong><code>false</code></strong> en cualquier otro caso.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Este método te permite saber si una cadena de texto comienza o no con otra cadena de texto. Este método distingue entre mayúsculas y minúsculas.</p>
-
-<h2 id="Polyfill">Polyfill</h2>
-
-<p>Este método se ha añadido a la especificación ECMAScript 2015 y podría no estar disponible aún en todas las implementaciones de JavaScript. Sin embargo, puedes utilizar un <em>polyfill</em> de <code>String.prototype.startsWith()</code> con el siguiente fragmento de código:</p>
-
-<pre class="brush: js notranslate">if (!String.prototype.startsWith) {
-    Object.defineProperty(String.prototype, 'startsWith', {
-        value: function(search, rawPos) {
-            var pos = rawPos &gt; 0 ? rawPos|0 : 0;
-            return this.substring(pos, pos + search.length) === search;
-        }
-    });
-}
-</pre>
-
-<p>Un <em>polyfill</em> más robusto (totalmente compatible con la especificación ES2015), pero con menos rendimiento y menos compacto está disponible <a href="https://github.com/mathiasbynens/String.prototype.startsWith">en GitHub, por Mathias Bynens</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_startsWith">Usando <code>startsWith()</code></h3>
-
-<pre class="brush: js notranslate">//startswith
-var str = 'Ser, o no ser. ¡Esa es la cuestión!';
-
-console.log(str.startsWith('Ser'));           // true
-console.log(str.startsWith('no ser'));        // false
-console.log(str.startsWith('Esa es la', 16)); // true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.startswith', 'String.prototype.startsWith')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{Compat("javascript.builtins.String.startsWith")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.endsWith()")}}</li>
- <li>{{jsxref("String.prototype.includes()")}}</li>
- <li>{{jsxref("String.prototype.indexOf()")}}</li>
- <li>{{jsxref("String.prototype.lastIndexOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/strike/index.html b/files/es/web/javascript/referencia/objetos_globales/string/strike/index.html
deleted file mode 100644
index 20ba5e9c90..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/strike/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: String.prototype.strike()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/strike
-tags:
-  - Deprecated
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/strike
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<p>{{deprecated_header}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Causa que una cadena se muestre como texto tachado, como si estuviese dentro de una etiqueta {{HTMLElement("strike")}}.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox"><em>cadena</em>.strike()</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Usa el método <code>strike</code> para formatear y mostrar una cadena en un documento.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena" name="Ejemplo:_Usando_m.C3.A9todos_de_string_para_cambiar_el_formateado_de_una_cadena">Ejemplo: Usando métodos de <code>string</code> para cambiar el formateado de una cadena</h3>
-<p>El siguiente ejemplo usa los métodos de <code>string</code> para cambiar el formateado de una cadena:</p>
-<pre class="brush: js">var cadenaMundo="¡Hola mundo!"
-
-console.log(cadenaMundo.blink())
-console.log(cadenaMundo.bold())
-console.log(cadenaMundo.italics())
-console.log(cadenaMundo.strike())
-</pre>
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-<pre class="brush: html">&lt;blink&gt;¡Hola mundo!&lt;/blink&gt;
-&lt;b&gt;¡Hola mundo!&lt;/b&gt;
-&lt;i&gt;¡Hola mundo!&lt;/i&gt;
-&lt;strike&gt;¡Hola mundo!&lt;/strike&gt;
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("String.prototype.blink()")}}</li>
- <li>{{jsxref("String.prototype.bold()")}}</li>
- <li>{{jsxref("String.prototype.italics()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/sub/index.html b/files/es/web/javascript/referencia/objetos_globales/string/sub/index.html
deleted file mode 100644
index 195bca9d1e..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/sub/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: String.prototype.sub()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/sub
-tags:
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/sub
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Causa que una cadena se muestre como subíndice, como si estuviese dentro de una etiqueta {{HTMLElement("sub")}}.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox"><em>cadena</em>.sub()</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Usa el método <code>sub</code> junto para formatear y mostrar una cadena en un documento.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena" name="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena">Ejemplo: Usando los métodos <code>sub</code> y <code>sup</code> para formatear una cadena</h3>
-<p>El siguiente ejemplo usa los métodos <code>sub</code> y <code>sup</code> para formatear una cadena:</p>
-<pre class="brush: js">var superText="superscript"
-var subText="subscript"
-
-console.log("Esto es lo que un " + superText.sup() + " parece.")
-console.log("Esto es lo que un " + subText.sub() + " parece.")
-</pre>
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-<pre class="brush: html">Esto es lo que &lt;sup&gt;superscript&lt;/sup&gt; parece.
-Esto es lo que &lt;sub&gt;subscript&lt;/sub&gt; parece.
-</pre>
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-<ul>
- <li>{{jsxref("String.prototype.sup()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/substr/index.html b/files/es/web/javascript/referencia/objetos_globales/string/substr/index.html
deleted file mode 100644
index 290d1292ab..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/substr/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: String.prototype.substr()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/substr
-tags:
-  - JavaScript
-  - Método(2)
-  - Prototipo
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/substr
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<div class="warning">Advertencia: Aunque <code>String.prototype.substr(…) </code><span style="font-size: 1.125rem;">no está estrictamente obsoleto (como en "eliminado de los estándares web"), se define en el anexo B de la norma ECMA-262, cuya introducción establece:</span>
-
-<blockquote>... Todas las características y comportamientos del lenguaje especificados en este anexo tienen una o más características indeseables y, en ausencia de uso heredado, se eliminarían de esta especificación. ... ... Los programadores no deben usar ni asumir la existencia de estas características y comportamientos al escribir un nuevo código ECMAScript.</blockquote>
-</div>
-
-<p> </p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <strong><code>substr()</code></strong> devuelve los caracteres de una cadena que comienzan en una localización especificada y de acuerdo al número de caracteres que se especifiquen.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.substr(<em>inicio</em>[, <em>longitud</em>])</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>inicio</code></dt>
- <dd>Localización en la cual se empiezan a extraer caracteres. Si se da un número negativo, se trata como <code>longCad + inicio</code> donde  <code>longCad</code> es la longitud de la cadena (por ejemplo, si <code>inicio</code> es -3 se trata como <code>longCad - 3</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>longitud</code></dt>
- <dd>Opcional. El número de caracteres a extraer. Si este argumento es {{jsxref("undefined")}}, todos los caracteres desde <code><em>inicio</em></code> hasta el final de la cadena serán extraidos.</dd>
-</dl>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Una nueva cadena que contiende la sección extraída de la cadena dada. Sí la longitud es 0 o un número negativo, retorna la cadena vacía.</p>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>inicio</code> es el índice de un carácter. El índice del primer carácter es 0, y el índice del último carácter es la longitud de la cadena menos 1. <code>substr</code> comienza extrayendo caracteres a partir de <code>inicio</code> y recolecta <code>longitud</code>  caracteres (a menos que se alcance primero el final de la cadena, en cuyo caso devuelve menos).</p>
-
-<p>Si <code>inicio</code> es positivo y es mayor o igual que la longitud de la cadena, <code>substr()</code> devuelve una cadena vacía.</p>
-
-<p>Si <code>inicio</code> es negativo, <code>substr()</code> lo usa como un índice de carácter desde el final de la cadena. Si <code>inicio</code> es negativo y <code>abs(inicio)</code> es mayor que la longitud de la cadena, <code>substr</code> usa 0 como índice inical. Nota: el uso descrito de valores negativos del argumento <code>inicio</code> no es soportado por Microsoft JScript <a class="external" href="http://msdn2.microsoft.com/en-us/library/0esxc5wy.aspx">. </a></p>
-
-<p>Si <code>longitud</code> es 0 o negativa, <code>substr</code> devuelve una cadena vacía. Si se omite <code>longitud</code>, <code>inicio</code> extrae caracteres hasta el final de la cadena.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_substr" name="Ejemplo:_Usando_substr">Ejemplo: Uso de <code>substr()</code></h3>
-
-<pre class="brush: js">var cadena = "abcdefghij";
-
-console.log("(1,2): "    + cadena.substr(1,2));   <code>// '(1, 2): bc'</code>
-console.log("(-3,2): "   + cadena.substr(-3,2));  <code>// '(-3, 2): hi'</code>
-console.log("(-3): "     + cadena.substr(-3));    // '(-3): hij'
-console.log("(1): "      + cadena.substr(1));     // '(1): bcdefghij'
-console.log("(-20, 2): " + cadena.substr(-20,2)); // '(-20, 2): ab'
-console.log("(20, 2): "  + cadena.substr(20,2));  // '(20, 2): '
-</pre>
-
-<p>Este script muestra:</p>
-
-<pre class="eval">(1,2): bc
-(-3,2): hi
-(-3): hij
-(1): bcdefghij
-(-20, 2): ab
-(20, 2):
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.slice()")}}</li>
- <li>{{jsxref("String.prototype.substring()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/substring/index.html b/files/es/web/javascript/referencia/objetos_globales/string/substring/index.html
deleted file mode 100644
index 9918417f95..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/substring/index.html
+++ /dev/null
@@ -1,92 +0,0 @@
----
-title: String.prototype.substring()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/substring
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/substring
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El <strong><code>substring()</code></strong> método devuelve un subconjunto de un objeto <code>String</code>.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>cadena</em>.substring(<em>indiceA</em>[, <em>indiceB</em>'])</pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>indiceA</code></dt>
- <dd>Un entero entre 0 y la longitud de la cadena menos 1.</dd>
- <dt><code>indiceB</code></dt>
- <dd>(opcional) Un entero entre 0 y la longitud de la cadena.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>substring</code> extrae caracteres desde <code>indiceA</code> hasta <code>indiceB</code> sin incluirlo. En particular:</p>
-
-<ul>
- <li>Si <code>indiceA</code> es igual a <code>indiceB</code>, <code>substring</code> devuelve una cadena vacía.</li>
- <li>Si se omite el <code>indiceB</code>, <code>substring</code> extrae caracteres hasta el final de la cadena.</li>
- <li>Si el argumento es menor que 0 o es <code>NaN</code>, se trata como si fuese 0.</li>
- <li>Si el argumento es mayor que <code>nombreCadena.length</code>, se trata como si fuese <code>nombreCadena.length</code>.</li>
-</ul>
-
-<p>Si <code>indiceA</code> es mayor que <code>indiceB</code>, entonces el efecto de <code>substring</code> es como si los dos argumentos se intercambiasen; por ejemplo, <code><em>cadena</em>.substring(1, 0) == <em>cadena</em>.substring(0, 1)</code>.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_substring" name="Ejemplo:_Usando_substring">Ejemplo: Usando <code>substring</code></h3>
-
-<p>El siguiente ejemplo usa <code>substring</code> para mostrar caracteres de la cadena "<code>Mozilla</code>":</p>
-
-<pre class="brush:js">// asume una función print ya definida
-var cualquierCadena = "Mozilla";
-
-// Muestra "Moz"
-print(cualquierCadena.substring(0,3));
-print(cualquierCadena.substring(3,0));
-
-// Muestra "lla"
-print(cualquierCadena.substring(4,7));
-print(cualquierCadena.substring(7,4));
-
-// Muestra "Mozill"
-print(cualquierCadena.substring(0,6));
-print(cualquierCadena.substring(6,0));
-
-// Muestra "Mozilla"
-print(cualquierCadena.substring(0,7));
-print(cualquierCadena.substring(0,10));
-</pre>
-
-<h3 id="Ejemplo:_Reemplazar_una_subcadena_dentro_de_una_cadena" name="Ejemplo:_Reemplazar_una_subcadena_dentro_de_una_cadena">Ejemplo: Reemplazar una subcadena dentro de una cadena</h3>
-
-<p>El siguiente ejemplo reemplaza una subcadena dentro de una cadena. Reemplazará tanto caracteres individuales como subcadenas. La llamada de la función al final del ejemplo cambia la cadena "<code>Bravo Nuevo Mundo</code>" por "<code>Bravo Nueva Web</code>".</p>
-
-<pre class="brush:js">function reemplazarCadena(cadenaVieja, cadenaNueva, cadenaCompleta) {
-// Reemplaza cadenaVieja por cadenaNueva en cadenaCompleta
-
-   for (var i = 0; i &lt; cadenaCompleta.length; i++) {
-      if (cadenaCompleta.substring(i, i + cadenaVieja.length) == cadenaVieja) {
-         cadenaCompleta= cadenaCompleta.substring(0, i) + cadenaNueva + cadenaCompleta.substring(i + cadenaVieja.length, cadenaCompleta.length);
-      }
-   }
-   return cadenaCompleta;
-}
-
-reemplazarCadena("Mundo", "Web", "Bravo Nuevo Mundo");
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.substr()")}}</li>
- <li>{{jsxref("String.prototype.slice()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/sup/index.html b/files/es/web/javascript/referencia/objetos_globales/string/sup/index.html
deleted file mode 100644
index 6b8db218b6..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/sup/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: String.prototype.sup()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/sup
-tags:
-  - HTML wrapper methods
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/sup
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Causa que una cadena se muestre como superíndice, como si estuviese dentro de una etiqueta {{HTMLElement("sup")}}.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox"><em>cadena</em>.sup()</pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Usa el método <code>sup</code> junto para formatear y mostrar una cadena en un documento.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena" name="Ejemplo:_Usando_los_m.C3.A9todos_sub_y_sup_para_formatear_una_cadena">Ejemplo: Usando los métodos <code>sub</code> y <code>sup</code> para formatear una cadena</h3>
-<p>El siguiente ejemplo usa los métodos <code>sub</code> y <code>sup</code> para formatear una cadena:</p>
-<pre class="brush: js">var textoSuper="superscript"
-var textoSub="subscript"
-
-console.log("Esto es lo que un " + textoSuper.sup() + " parece.")
-console.log("Esto es lo que un " + textoSub.sub() + " parece.")
-</pre>
-<p>Este ejemplo produce el mismo resultado que el siguiente código HTML:</p>
-<pre class="brush: html">Esto es lo que &lt;sup&gt;superscript&lt;/sup&gt; parece.
-Esto es lo que &lt;sub&gt;subscript&lt;/sub&gt; parece.
-</pre>
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-<ul>
- <li>{{jsxref("String.prototype.sub()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/tolocalelowercase/index.html b/files/es/web/javascript/referencia/objetos_globales/string/tolocalelowercase/index.html
deleted file mode 100644
index 5c1eae2144..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/tolocalelowercase/index.html
+++ /dev/null
@@ -1,113 +0,0 @@
----
-title: String.prototype.toLocaleLowerCase()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/toLocaleLowerCase
-tags:
-  - Cadena
-  - Internacionalizacion
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase
----
-<div>{{JSRef}}</div>
-
-<div>El método <strong><code>toLocaleLowerCase()</code> </strong>retorna la cadena de texto desde la que se llama convertida en minúsculas, de acuerdo con cualquier localización específica de correspondencia de mayúsculas y minúsculas.</div>
-
-<div> </div>
-
-<div>{{EmbedInteractiveExample("pages/js/string-tolocalelowercase.html")}}</div>
-
-<p class="hidden">Los fuentes para este ejemplo interactivo están almacenados en un repositorio GitHub. Si quieres contribuir en el proyecto de ejemplos interactivos, por favor clona https://github.com/mdn/interactive-examples y envíanos un pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>str</var>.toLocaleLowerCase()
-<var>str</var>.toLocaleLowerCase(locale)
-<var>str</var>.toLocaleLowerCase([locale, locale, ...])
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>locale</code> {{optional_inline}}</dt>
- <dd>El parámetro <code>locale</code> indica la localización que se utilizará para convertir a minúsculas de acuerdo con culalquier correspondencia de mayúsculas y minúsculas. Si se proporcionan múltiples locales en un {{jsxref("Array")}}, se utiliza <a href="https://tc39.github.io/ecma402/#sec-bestavailablelocale">el mejor local disponible</a>. La localización por defecto es la localización actual configurada en el <em>host</em>.</dd>
-</dl>
-
-<h3 id="Valor_retornado">Valor retornado</h3>
-
-<p>Una nueva cadena que representa la cadena desde la que se llama convertida a minúsculas, de acuerdo con cualquier localización específica de correspondencia de mayúsculas y minúsculas.</p>
-
-<h3 id="Excepciones">Excepciones</h3>
-
-<ul>
- <li>Una excepción de tipo {{jsxref("RangeError")}} ("invalid language tag: xx_yy") se lanzará si el argumento <code>locale</code> no es una etiqueta válida de lenguaje.</li>
- <li>Una excepción de tipo {{jsxref("TypeError")}} ("invalid element in locales argument") se lanzará si un elemento del arreglo no es del tipo cadena.</li>
-</ul>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>toLocaleLowerCase()</code><strong> </strong>retorna la cadena de texto desde la que se llama convertida en minúsculas, de acuerdo con cualquier localización específica de correspondencia de mayúsculas y minúsculas.  <code>toLocaleLowerCase()</code> no afecta el valor de la cadena desde la que se llama. En la mayoría de los casos, producirá el mismo resultado que {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}}, pero para algunos locales, como el turco, cuyas correspondencias de mayúsculas y minúsculas no siguen las correpsondencias por defecto de Unicode, podría producir de un resultado diferente.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizando_toLocaleLowerCase()">Utilizando <code>toLocaleLowerCase()</code></h3>
-
-<pre class="brush: js">'ALPHABET'.toLocaleLowerCase(); // 'alphabet'
-
-'\u0130'.toLocaleLowerCase('tr') === 'i';    // true
-'\u0130'.toLocaleLowerCase('en-US') === 'i'; // false
-
-let locales = ['tr', 'TR', 'tr-TR', 'tr-u-co-search', 'tr-x-turkish'];
-'\u0130'.toLocaleLowerCase(locales) === 'i'; // true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.17', 'String.prototype.toLocaleLowerCase')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td>
-   <td>{{Spec2('ES Int Draft')}}</td>
-   <td>ES Intl 2017 added the <code>locale</code> parameter.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta pádina se gnera desde datos estructurados. Si quieres contribuir a estos datos, por favor obtén <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.toLocaleLowerCase")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li>
- <li>{{jsxref("String.prototype.toLowerCase()")}}</li>
- <li>{{jsxref("String.prototype.toUpperCase()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/tolocaleuppercase/index.html b/files/es/web/javascript/referencia/objetos_globales/string/tolocaleuppercase/index.html
deleted file mode 100644
index 7199ca3ae5..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/tolocaleuppercase/index.html
+++ /dev/null
@@ -1,100 +0,0 @@
----
-title: String.prototype.toLocaleUpperCase()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/toLocaleUpperCase
-translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>toLocaleUpperCase()</code></strong> devuelve el valor de la cadena que lo llama convertido en mayúsculas, de acuerdo con las asignaciones de casos específicos de la configuración regional.</p>
-
-<h2 id="Syntaxis">Syntaxis</h2>
-
-<pre class="syntaxbox"><var>str</var>.toLocaleUpperCase()
-<var>str</var>.toLocaleUpperCase(locale)
-<var>str</var>.toLocaleUpperCase([locale, locale, ...])
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>locale</code> {{optional_inline}}</dt>
- <dd>El parámetro <code>locale</code> indica la configuración regional que se va a utilizar para convertir en mayúsculas según las asignaciones de casos específicos de la configuración regional. Si se proporcionan varios locales en un {{jsxref ("Array")}}, se utiliza la mejor configuración regional disponible. La configuración regional predeterminada es la configuración regional actual del entorno de host.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una nueva cadena que representa la cadena de llamada convertida en mayúsculas, de acuerdo con cualquier asignación de mayúsculas de idioma específico.</p>
-
-<h3 id="Exceciones">Exceciones</h3>
-
-<ul>
- <li>Un {{jsxref("RangeError")}} ("invalid language tag: xx_yy") se arroja si un argumento de configuración regional no es una etiqueta de idioma válida.</li>
- <li>Un {{jsxref("TypeError")}} ("invalid element in locales argument")  se lanzará si un elemento de matriz no es de tipo cadena.</li>
-</ul>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>toLocaleUpperCase()</code> devuelve el valor de la cadena convertida en mayúsculas según las asignaciones de casos específicos de la configuración regional. <code>toLocaleUpperCase()</code> no afecta al valor de la cadena en sí. En la mayoría de los casos, esto producirá el mismo resultado que {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}}, pero para algunas localidades, como turco, cuyas asignaciones de mayúsculas y minúsculas no siguen la mayúsculas y minúsculas en Unicode, puede haber un resultado diferente.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_toLocaleUpperCase()">Usando <code>toLocaleUpperCase()</code></h3>
-
-<pre class="brush: js">'alphabet'.toLocaleUpperCase(); // 'ALPHABET'
-
-'i\u0307'.toLocaleUpperCase('lt-LT'); // 'I'
-
-let locales = ['lt', 'LT', 'lt-LT', 'lt-u-co-phonebk', 'lt-x-lietuva'];
-'i\u0307'.toLocaleUpperCase(locales); // 'I'
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition. Implemented in JavaScript 1.2.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.19', 'String.prototype.toLocaleUpperCase')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td>
-   <td>{{Spec2('ES Int Draft')}}</td>
-   <td>ES Intl 2017 added the <code>locale</code> parameter.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.toLocaleUpperCase")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li>
- <li>{{jsxref("String.prototype.toLowerCase()")}}</li>
- <li>{{jsxref("String.prototype.toUpperCase()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/tolowercase/index.html b/files/es/web/javascript/referencia/objetos_globales/string/tolowercase/index.html
deleted file mode 100644
index 8060f3dd1c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/tolowercase/index.html
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: String.prototype.toLowerCase()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/toLowerCase
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/toLowerCase
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El método <strong><code>toLowerCase()</code></strong> devuelve el valor <strong>en minúsculas </strong>de la cadena que realiza la llamada.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre><code><em>cadena</em>.toLowerCase() </code></pre>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>El método <code>toLowerCase</code> devuelve el valor de la cadena convertida a minúsculas. <code>toLowerCase</code> no afecta al valor de la cadena en sí misma.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_toLowerCase" name="Ejemplo:_Usando_toLowerCase">Ejemplo: Usando <code>toLowerCase</code></h3>
-
-<p>El siguiente ejemplo muestra la cadena "alfabeto" en minúsculas:</p>
-
-<pre>var textoMayusculas="ALFABETO"
-document.write(textoMayusculas.toLowerCase())
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li>
- <li>{{jsxref("String.prototype.toUpperCase()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/tosource/index.html b/files/es/web/javascript/referencia/objetos_globales/string/tosource/index.html
deleted file mode 100644
index 104738c22d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/tosource/index.html
+++ /dev/null
@@ -1,56 +0,0 @@
----
-title: String.prototype.toSource()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/toSource
-tags:
-  - Cadena
-  - JavaScript
-  - No estandar
-  - Prototipo
-  - Referencia
-  - metodo
-translation_of: Web/JavaScript/Reference/Global_Objects/String/toSource
----
-<div>{{JSRef}} {{non-standard_header}}</div>
-
-<p>El método <strong><code>toSource()</code></strong> devuelve una cadena que representa el código fuente del objeto.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>String.toSource()
-<var>str</var>.toSource()
-</code></pre>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>Una cadena que representa el código fuente del objeto.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El método <code>toSource()</code> devuelve los siguientes valores:</p>
-
-<p>Para el objeto incorporado {{jsxref("String")}}, <code>toSource()</code> devuelve la siguiente cadena indicando que el código fuente no está disponible:</p>
-
-<pre class="brush: js">function String() {
-    [native code]
-}
-</pre>
-
-<p>Para instancias de {{jsxref("String")}} o cadenas literales, <code>toSource()</code> devuelve una cadena representando el código fuente.</p>
-
-<p>Este método usualmente es llamado internamente por JavaScript y no explícitamente en código.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ningún estándar. Implementado en JavaScript 1.3.</p>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si deseas contribuir a los datos, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.toSource")}}</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Object.prototype.toSource()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/tostring/index.html b/files/es/web/javascript/referencia/objetos_globales/string/tostring/index.html
deleted file mode 100644
index 89f53666b1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/tostring/index.html
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: String.prototype.toString()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/toString
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/toString
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>El <strong><code>toString()</code></strong> método devuelve una cadena que representa al objeto especificado.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre><code><em>cadena</em>.toString() </code></pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>El objeto <code>String</code> sobreescribe el método <code>toString</code> del objeto {{jsxref("Object")}} object; no hereda {{jsxref("Object.toString()")}}. Para objetos <code>String</code>, el método <code>toString</code> devuelve una cadena que representa al objeto.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_toString" name="Ejemplo:_Usando_toString">Ejemplo: Usando <code>toString</code></h3>
-<p>El siguiente ejemplo muestra el valor cadena de un objeto String:</p>
-<pre class="brush: js">cadena = new String("Hello world");
-alert(cadena.toString())      // Displays "Hello world"
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("Object.prototype.toSource()")}}</li>
- <li>{{jsxref("String.prototype.valueOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/touppercase/index.html b/files/es/web/javascript/referencia/objetos_globales/string/touppercase/index.html
deleted file mode 100644
index 77b05b28b4..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/touppercase/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: String.prototype.toUpperCase()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/toUpperCase
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/toUpperCase
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El <strong><code>toUpperCase()</code></strong> método devuelve el valor convertido en mayúsculas de la cadena que realiza la llamada.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre><code><em>cadena</em>.toUpperCase() </code></pre>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>El método <code>toUpperCase</code> devuelve el valor de la cadena convertida a mayúsculas. <code>toUpperCase</code> no afecta al valor de la cadena en sí mismo.</p>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_toUpperCase" name="Ejemplo:_Usando_toUpperCase">Ejemplo: Usando <code>toUpperCase</code></h3>
-
-<p>El siguiente ejemplo muestra la cadena "<code>ALPHABET</code>":</p>
-
-<pre class="brush: js">console.log( "alphabet".toUpperCase() ); // "ALPHABET"
-</pre>
-
-<h3 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h3>
-
-<ul>
- <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li>
- <li>{{jsxref("String.prototype.toLowerCase()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/trim/index.html b/files/es/web/javascript/referencia/objetos_globales/string/trim/index.html
deleted file mode 100644
index d958d713eb..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/trim/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: String.prototype.trim()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/Trim
-translation_of: Web/JavaScript/Reference/Global_Objects/String/Trim
----
-<div>{{JSRef("Global_Objects", "String")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El método <strong>trim( )</strong> elimina los espacios en blanco en ambos extremos del string. Los espacios en blanco en este contexto, son todos los caracteres sin contenido (espacio, tabulación, etc.) y todos los caracteres de nuevas lineas (LF,CR,etc.).</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><var>str</var>.trim()</code></pre>
-
-<p>Una nueva cadena que representa la cadena de llamada sin espacios en blanco de ambos extremos.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>El método <strong>trim( ) </strong>devuelve la cadena de texto despojada de los espacios en blanco en ambos extremos. El método no afecta al valor de la cadena de texto.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_trim" name="Example:_Using_trim">Ejemplo: Uso de <code>trim()</code></h3>
-
-<p>El siguiente ejemplo muestra la cadena de texto en minúsculas 'foo':</p>
-
-<pre class="brush: js">var orig = '   foo  ';
-console.log(orig.trim()); // 'foo'
-
-// Otro ejemplo de .trim() eliminando el espacio en blanco sólo de un lado.
-
-var orig = 'foo    ';
-console.log(orig.trim()); // 'foo'
-</pre>
-
-<h2 id="Polyfill" name="Polyfill">Polyfill</h2>
-
-<p>Ejecutar el siguiente código antes de cualquier otro código creará un trim ( ) si este no está disponible de manera nativa.</p>
-
-<pre class="brush: js">if (!String.prototype.trim) {
-  (function() {
-    // Make sure we trim BOM and NBSP
-    var rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
-    String.prototype.trim = function() {
-      return this.replace(rtrim, '');
-    };
-  })();
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.5.4.20', 'String.prototype.trim')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>
-    <p>Definición inicial. Implementado en JavaScript 1.8.1.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-string.prototype.trim', 'String.prototype.trim')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
-   <td>{{CompatIE("9")}}</td>
-   <td>{{CompatOpera("10.5")}}</td>
-   <td>{{CompatSafari("5")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.trimLeft()")}} {{non-standard_inline}}</li>
- <li>{{jsxref("String.prototype.trimRight()")}} {{non-standard_inline}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/trimend/index.html b/files/es/web/javascript/referencia/objetos_globales/string/trimend/index.html
deleted file mode 100644
index 6252141adf..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/trimend/index.html
+++ /dev/null
@@ -1,82 +0,0 @@
----
-title: String.prototype.trimEnd()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/trimEnd
-tags:
-  - Espacios en blanco
-  - JavaScript
-  - Métodos
-  - Prototype
-  - String
-  - Texto
-  - cadenas de texto
-translation_of: Web/JavaScript/Reference/Global_Objects/String/trimEnd
----
-<div>{{JSRef}}</div>
-
-<p>El método <strong><code>trimEnd()</code></strong> elimina los espacios en blanco al final de una cadena de carácteres. <code>trimRight()</code> es el alias de este método.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/string-trimend.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code><var>str</var>.trimEnd();
-<var>str</var>.trimRight();</code></pre>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Una nueva cadena de texto que representa la cadena de texto llamada sin espacios en blanco de su extremo (derecho).</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><code>trimEnd()</code> / <code>trimRight()</code> Los metodos devuelven una cadena de texto sin espacios en blanco desde su extremo derecho. <code>trimEnd()</code> ó <code>trimRight()</code> no afectan el valor de la cadena de texto en sí.</p>
-
-<h3 id="Superposición">Superposición</h3>
-
-<p>Por coherencia de funciones como {{jsxref("String.prototype.padEnd")}} el nombre del método estandar es <code>trimEnd</code>. Sin embargo por compatibilidad web, <code>trimRight</code> permanece como un alias para <code>trimEnd</code>. En algunos motores esto significa: </p>
-
-<pre class="brush: js notranslate">String.prototype.trimRight.name === "trimEnd";</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Usando_trimEnd">Usando <code>trimEnd()</code></h3>
-
-<p>El siguiente ejemplo muestra la cadena de texto en minusculas <code>'   foo'</code>:</p>
-
-<pre class="brush: js; highlight: [5] notranslate">var str = '   foo  ';
-
-console.log(str.length); // 8
-
-str = str.trimEnd();
-console.log(str.length); // 6
-console.log(str);        // '   foo'
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-string.prototype.trimend', 'String.prototype.trimEnd')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-
-<p>{{Compat("javascript.builtins.String.trimEnd")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String.prototype.trim()")}}</li>
- <li>{{jsxref("String.prototype.trimStart()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/string/valueof/index.html b/files/es/web/javascript/referencia/objetos_globales/string/valueof/index.html
deleted file mode 100644
index b287c4d774..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/string/valueof/index.html
+++ /dev/null
@@ -1,28 +0,0 @@
----
-title: String.prototype.valueOf()
-slug: Web/JavaScript/Referencia/Objetos_globales/String/valueOf
-tags:
-  - JavaScript
-  - Method
-  - Prototype
-  - String
-translation_of: Web/JavaScript/Reference/Global_Objects/String/valueOf
----
-<p>{{JSRef("Objetos_globales", "String")}}</p>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>The <strong><code>valueOf()</code></strong> método devuelve el valor primitivo de un objeto String.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre><code><em>caneda</em>.valueOf() </code></pre>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>El método <code>valueOf</code> de <code>String</code> devuelve el valor primitivo de un objeto String como un tipo de dato cadena. Este valor es equivalente a String.toString.</p>
-<p>Normalmente este método es llamado internamente por JavaScript y no en el código.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_valueOf" name="Ejemplo:_Usando_valueOf">Ejemplo: Usando <code>valueOf</code></h3>
-<pre class="brush: js">cadena = new String("Hello world");
-alert(cadena.valueOf())          // Displays "Hello world"
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("String.prototype.toString()")}}</li>
- <li>{{jsxref("Object.prototype.valueOf()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/symbol/for/index.html b/files/es/web/javascript/referencia/objetos_globales/symbol/for/index.html
deleted file mode 100644
index 1111e49b7a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/symbol/for/index.html
+++ /dev/null
@@ -1,153 +0,0 @@
----
-title: Symbol.for()
-slug: Web/JavaScript/Referencia/Objetos_globales/Symbol/for
-translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/for
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>Symbol.for(key)</strong></code> busca símbolos existentes en el runtime global del registro de <em>symbols</em> con la <code>key</code> enviada cómo argumento y devuelve el symbol si fue encontrada. Sino, un nuevo symbol es creado en el registro global de <em>symbols </em>con dicha <code>key</code> .</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><var>Symbol.for(key)</var>;</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>key</dt>
- <dd>String, requirido. La <em>key </em>para el símbolo (y también usada para la descripción del <em>Symbol</em>).</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un <em>Symbol </em>existente para la <em>key </em>enviada si se encuentra, un nuevo <em>Symbol</em> creado para la <em>key </em>si no es encontrado.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>A diferencia de <code>Symbol()</code>,  la función <code>Symbol.for()</code> crea un symbol disponible el registro global de symbols.</p>
-
-<p>Sin embargo, <code>Symbol.for()</code> no crea un nuevo symbol en cada llamada: primero chequea si existe un symbol para la <code>key</code> en el registro y sólo crea un nuevo symbol si la <code>key</code> no es encontrada.</p>
-
-<p>El registro global de symbol es una lista con la siguiente estructura (inicializada vacía):</p>
-
-<table class="standard-table">
- <caption>Estructura registro global de symbol</caption>
- <tbody>
-  <tr>
-   <th>Field name</th>
-   <th>Value</th>
-  </tr>
-  <tr>
-   <td>[[key]]</td>
-   <td>Un string usado como key para identifcar al símbolo.</td>
-  </tr>
-  <tr>
-   <td>[[symbol]]</td>
-   <td>El symbol que es guardado globalmente.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Examples">Examples</h2>
-
-<pre class="brush: js">Symbol.for('foo'); // crea un nuevo global symbol
-Symbol.for('foo'); // devuelve el symbol creado
-
-// El mismo symbol global, pero no localmente
-Symbol.for('bar') === Symbol.for('bar'); // true
-Symbol('bar') === Symbol('bar'); // false
-
-// La key es usada en la descripción
-var sym = Symbol.for('mario');
-sym.toString(); // "Symbol(mario)"
-</pre>
-
-<p>Es una buena práctica agregar un prefijo a los symbols para evitar conflictos con otras librerias del código:</p>
-
-<pre class="brush: js">Symbol.for('mdn.foo');
-Symbol.for('mdn.bar');
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-symbol.for', 'Symbol.for')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-symbol.for', 'Symbol.for')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_exploradores">Compatibilidad entre exploradores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatChrome(40) }}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoDesktop("36.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>9</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile("36.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Symbol.keyFor()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/symbol/hasinstance/index.html b/files/es/web/javascript/referencia/objetos_globales/symbol/hasinstance/index.html
deleted file mode 100644
index 9149aeda00..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/symbol/hasinstance/index.html
+++ /dev/null
@@ -1,105 +0,0 @@
----
-title: Symbol.hasInstance
-slug: Web/JavaScript/Referencia/Objetos_globales/Symbol/hasInstance
-translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/hasInstance
----
-<div>{{JSRef}}</div>
-
-<p>El bien conocido símbolo <strong><code>Symbol.hasInstance</code></strong> es usado para determinar si un constructor reconoce un objeto como su instancia. El comportamiento del operador {{jsxref("Operators/instanceof", "instanceof")}} puede ser personalizado con este símbolo.</p>
-
-<div>{{js_property_attributes(0,0,0)}}</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Usted puede implementar un comportamiento personalizado para el operador <code>instanceof</code> tal que así:</p>
-
-<pre class="brush: js">class MyArray {
-  static [Symbol.hasInstance](instance) {
-    return Array.isArray(instance);
-  }
-}
-console.log([] instanceof MyArray); // true</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-symbol.hasinstance', 'Symbol.hasInstance')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-symbol.hasinstance', 'Symbol.hasInstance')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(51)}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoDesktop(50) }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile(50) }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Operators/instanceof", "instanceof")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/symbol/index.html b/files/es/web/javascript/referencia/objetos_globales/symbol/index.html
deleted file mode 100644
index ef21b5fb6c..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/symbol/index.html
+++ /dev/null
@@ -1,364 +0,0 @@
----
-title: Symbol
-slug: Web/JavaScript/Referencia/Objetos_globales/Symbol
-translation_of: Web/JavaScript/Reference/Global_Objects/Symbol
----
-<div>{{JSRef}}</div>
-
-<p><em><strong>Symbol</strong></em> es un tipo de datos cuyos valores son únicos e immutables. Dichos valores pueden ser utilizados como identificadores (claves) de las propiedades de los objetos.  Cada valor del tipo Symbol tiene asociado un valor del tipo String o Undefined que sirve únicamente como descripción del símbolo.</p>
-
-<p>La función <code>Symbol</code> {{Glossary("Primitive", "primitive data type")}} es el constructor de valores del tipo <em><strong>Symbol</strong></em>. Cuando <code>Symbol </code>es llamado como función nos devuelve una nuevo valor del tipo <em><strong>Symbol.</strong></em> El constructor <code>Symbol</code> no debe ser usado con el operador <code>new</code>. Tampoco debe ser extendido mediante clases.</p>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>Symbol(<em>[description]</em>)</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>Descripcion</code> {{optional_inline}}</dt>
- <dd>Es un valor opcional de tipo String. Únicamente sirve como descripción del símbolo que puede ser útil para depurar. No permite el acceso al símbolo que describe.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Para crear un nuevo símbolo, simplemente escribimos  <code>Symbol()</code>, opcionalmente  con un argumento de tipo String que constituiría la descripción del símbolo:</p>
-
-<pre class="brush: js">var sym1 = Symbol();
-var sym2 = Symbol("foo");
-var sym3 = Symbol("foo");
-</pre>
-
-<p>El código anterior crea tres símbolos nuevos. Hay que destacar que  <code>Symbol("foo")</code> no convierte la cadena "foo" en un símbolo, sino que crea un símbolo nuevo que tiene la misma descripción.</p>
-
-<pre class="brush: js">Symbol("foo") === Symbol("foo"); // false</pre>
-
-<p>La siguiente sintaxis con el operador {{jsxref("Operators/new", "new")}} lanzará un {{jsxref("TypeError")}}:</p>
-
-<pre class="brush: js">var sym = new Symbol(); // TypeError</pre>
-
-<p>Esto evita la creación de un objeto envolvente explícito de Symbol en lugar de un nuevo valor de tipo símbolo. Si realmente se desea crear un <code>Symbol</code> wrapper object,  podemos usar la función <code>Object()</code>:</p>
-
-<pre class="brush: js">var sym = Symbol("foo");
-typeof sym;     // "symbol"
-var symObj = Object(sym);
-typeof symObj;  // "object"
-</pre>
-
-<h3 id="Símbolos_compartidos_en_el_registro_global_de_símbolos">Símbolos compartidos en el registro global de símbolos</h3>
-
-<p>La sintaxis anteriormente descrita que usa la función <code>Symbol()</code> no creara un símbolo global disponible para toda el código base. Para crear símbolos accesibles a través de los archivos incluso a través de <em>realms</em> (cada uno de los cuales tiene su propio <em>global scope</em>) es necesario utilizar los métodos {{jsxref("Symbol.for()")}} y {{jsxref("Symbol.keyFor()")}} para crear y acceder a los símbolos desde un registro global de valores del tipo <em>Symbol</em>.</p>
-
-<h3 id="Encontrando_las_claves_de_tipo_símbolo_de_un_objeto">Encontrando las claves de tipo símbolo de un objeto</h3>
-
-<p>El método {{jsxref("Object.getOwnPropertySymbols()")}} devuelve un <em>array</em> con los símbolos que sirven como claves de las propiedades propias de un objeto. Hay que destacar que cada objeto es inicializado sin propiedades propias con claves de tipo <em>Symbol</em>, así que este <em>array</em> estará vacio a menos que se hayan creado explicitamente propiedades con clave de tipo símbolo en el objeto.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>Symbol.length</code></dt>
- <dd>La propiedad <code>length</code> cuyo valor es 0 para todos los símbolos.</dd>
- <dt>{{jsxref("Symbol.prototype")}}</dt>
- <dd>Representa el prototipo constructor <code>Symbol</code>. Es un objeto ordinario.</dd>
-</dl>
-
-<h3 id="Símbolos_bien_conocidos">Símbolos bien conocidos</h3>
-
-<p>JavaScript tiene algunos <em>símbolos incorporados</em> que representan comportamientos internos del lenguaje que no fueron expuestos a los programadores antes de ECMAScript 6. Se accede a los dichos símbolos a través de las siguientes propiedades del constructor <code>Symbol.</code></p>
-
-<h4 id="Símbolo_de_iteración">Símbolo de iteración</h4>
-
-<dl>
- <dt>{{jsxref("Symbol.iterator")}}</dt>
- <dd>Los objetos que implementen la interfaz <em><a href="http://www.ecma-international.org/ecma-262/6.0/#sec-iterable-interface">Iterable</a></em> deben tener una propiedad que tenga como clave este símbolo. Dicha propiedad debe ser una función que devuelva un objeto que implemente la interfaz <em><a href="http://www.ecma-international.org/ecma-262/6.0/#sec-iterator-interface">Iterator</a></em>.  Usado por <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of"><code>for...of</code></a>.</dd>
-</dl>
-
-<h4 id="Símbolos_de_expresiones_regulares">Símbolos de expresiones regulares</h4>
-
-<dl>
- <dt>{{jsxref("Symbol.match")}}</dt>
- <dd>Un método que iguala a un String, también usado para determinar si un objeto puede ser usado como una expresión regular. Usado por {{jsxref("String.prototype.match()")}}.</dd>
- <dt>{{jsxref("Symbol.replace")}}</dt>
- <dd>Un método que reemplaza las subcadenas que coinciden con una cadena. Utilizado por {{jsxref("String.prototype.replace()")}}.</dd>
- <dt>{{jsxref("Symbol.search")}}</dt>
- <dd>Un método que devuelve el índice dentro de una cadena que coincide con la expresión regular. Utilizado por {{jsxref("String.prototype.search()")}}.</dd>
- <dt>{{jsxref("Symbol.split")}}</dt>
- <dd>Un método que separa una cadena en los índices que coincide una expresión regular. Utilizado por {{jsxref("String.prototype.split()")}}.</dd>
-</dl>
-
-<h4 id="Otros_símbolos">Otros símbolos</h4>
-
-<dl>
- <dt>{{jsxref("Symbol.hasInstance")}}</dt>
- <dd>Un método que determina si un objeto constructor reconoce al objeto como su instancia. Utilizado por {{jsxref("Operators/instanceof", "instanceof")}}.</dd>
- <dt>{{jsxref("Symbol.isConcatSpreadable")}}</dt>
- <dd>Un valor booleano que indica si un objeto debe ser aplanado a sus elementos de matriz. Usado por {{jsxref("Array.prototype.concat()")}}.</dd>
- <dt>{{jsxref("Symbol.unscopables")}}</dt>
- <dd>An Array of string values that are property values. These are excluded from the <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/with">with</a></code> environment bindings of the associated objects.</dd>
- <dt>{{jsxref("Symbol.species")}}</dt>
- <dd>Una función <code>constructor</code> utilizada para crear objetos derivados.</dd>
- <dt>{{jsxref("Symbol.toPrimitive")}}</dt>
- <dd>Un método para convertir un objeto a su valor primitivo.</dd>
- <dt>{{jsxref("Symbol.toStringTag")}}</dt>
- <dd>Un método para definir la descripción por defecto de un objeto. Usado por {{jsxref("Object.prototype.toString()")}}.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("Symbol.for()", "Symbol.for(key)")}}</dt>
- <dd>Searches for existing symbols with the given key and returns it if found. Otherwise a new symbol gets created in the global symbol registry with this key.</dd>
- <dt>{{jsxref("Symbol.keyFor", "Symbol.keyFor(sym)")}}</dt>
- <dd>Retrieves a shared symbol key from the global symbol registry for the given symbol.</dd>
-</dl>
-
-<h2 id="Symbol_prototype"><code>Symbol</code> prototype</h2>
-
-<p>All Symbols inherit from {{jsxref("Symbol.prototype")}}.</p>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Symbol/prototype','Properties')}}</p>
-
-<h3 id="Métodos_2">Métodos</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/Symbol/prototype','Methods')}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_operador_typeof_con_symbols">Usando el operador <code>typeof</code> con  symbols</h3>
-
-<p>El operador {{jsxref("Operators/typeof", "typeof")}} puede ayudar a identificar los Symbol.</p>
-
-<pre class="brush: js">typeof Symbol() === 'symbol'
-typeof Symbol('foo') === 'symbol'
-typeof Symbol.iterator === 'symbol'
-</pre>
-
-<h3 id="Symbol_type_conversions">Symbol type conversions</h3>
-
-<p>Some things to note when working with type conversion of symbols.</p>
-
-<ul>
- <li>When trying to convert a symbol to a number, a {{jsxref("TypeError")}} will be thrown<br>
-  (e.g. <code>+sym</code> or <code>sym | 0</code>).</li>
- <li>When using loose equality, <code>Object(sym) == sym</code> returns <code>true.</code></li>
- <li><code>Symbol("foo") + "bar" </code>throws a {{jsxref("TypeError")}} (can't convert symbol to string). This prevents you from silently creating a new string property name from a symbol, for example.</li>
- <li>The <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String#String_conversion">"safer" <code>String(sym)</code> conversion</a> works like a call to {{jsxref("Symbol.prototype.toString()")}} with symbols, but note that <code>new String(sym)</code> will throw.</li>
-</ul>
-
-<h3 id="Symbols_y_el_iterador_for...in">Symbols y el iterador <code>for...in</code></h3>
-
-<p>Symbols are not visible in <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in"><code>for...in</code></a> iterations. In addition, {{jsxref("Object.getOwnPropertyNames()")}} will not return symbol object properties, however, you can use {{jsxref("Object.getOwnPropertySymbols()")}} to get these.</p>
-
-<pre class="brush: js">var obj = {};
-
-obj[Symbol("a")] = "a";
-obj[Symbol.for("b")] = "b";
-obj["c"] = "c";
-obj.d = "d";
-
-for (var i in obj) {
-   console.log(i); // logs "c" and "d"
-}</pre>
-
-<h3 id="Symbols_y_JSON.stringify()">Symbols y <code>JSON.stringify()</code></h3>
-
-<p>Symbol-keyed properties will be completely ignored when using <code>JSON.stringify()</code>:</p>
-
-<pre class="brush: js">JSON.stringify({[Symbol("foo")]: "foo"});
-// '{}'</pre>
-
-<p>For more details, see {{jsxref("JSON.stringify()")}}.</p>
-
-<h3 id="Symbol_wrapper_objects_as_property_keys">Symbol wrapper objects as property keys</h3>
-
-<p>When a Symbol wrapper object is used as a property key, this object will be coerced to its wrapped symbol:</p>
-
-<pre class="brush: js">var sym = Symbol("foo");
-var obj = {[sym]: 1};
-obj[sym];            // 1
-obj[Object(sym)];    // still 1
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-symbol-objects', 'Symbol')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{CompatGeckoDesktop("36.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Symbol.iterator (@@iterator)</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{CompatGeckoDesktop("36.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Symbol.unscopables (@@unscopables)</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Symbol.match (@@match)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("40.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Symbol.species (@@species)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("41.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Symbol.toPrimitive (@@toPrimitive)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoDesktop("44.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Other well-known symbols</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{ CompatGeckoMobile("36.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Symbol.iterator (@@iterator)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{ CompatGeckoMobile("36.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Symbol.unscopables (@@unscopables)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(38)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Symbol.match (@@match)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("40.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Symbol.species (@@species)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("41.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Symbol.toPrimitive (@@toPrimitive)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("44.0") }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Other well-known symbols</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Mira_también">Mira también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Glossary/Symbol">Glossary: Symbol data type</a></li>
- <li>{{jsxref("Operators/typeof", "typeof")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Data_structures">Data types and data structures</a></li>
- <li><a href="https://hacks.mozilla.org/2015/06/es6-in-depth-symbols/">"ES6 In Depth: Symbols" on hacks.mozilla.org</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/symbol/iterator/index.html b/files/es/web/javascript/referencia/objetos_globales/symbol/iterator/index.html
deleted file mode 100644
index 4f9e0212cc..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/symbol/iterator/index.html
+++ /dev/null
@@ -1,98 +0,0 @@
----
-title: Symbol.iterator
-slug: Web/JavaScript/Referencia/Objetos_globales/Symbol/iterator
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Property
-  - Symbol
-translation_of: Web/JavaScript/Reference/Global_Objects/Symbol/iterator
----
-<div>{{JSRef}}</div>
-
-<p>El símbolo <code><strong>Symbol.iterator</strong></code> especifica al iterador por defecto de un objeto. Es utilizado por el bucle {{jsxref("Sentencias/for","for")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/symbol-iterator.html")}}</div>
-
-<p class="hidden">El código fuente de este ejemplo interactivo está guardado en un repositorio en GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envía un pull request.</p>
-
-<div>{{js_property_attributes(0,0,0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>En cualquier situación donde se necesita iterar un objeto (por ejemplo al inicio de un bucle <code>for..of</code>), su método <code>@@iterator</code> es invocado sin argumentos, y el <strong>iterador</strong> regresado es utilizador para obtener los valores a iterar.</p>
-
-<p>Algunos tipos integrados cuentan con un comportamiento de iterar por defecto, mientras que otros tipos (como {{jsxref("Object")}}) no. Los tipos integrados con un método <code>@@iterator</code> son:</p>
-
-<ul>
- <li>{{jsxref("Array.@@iterator", "Array.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("TypedArray.@@iterator", "TypedArray.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("String.@@iterator", "String.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("Set.@@iterator", "Set.prototype[@@iterator]()")}}</li>
-</ul>
-
-<p>Ver <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Protocolos de iteración</a> para más información.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Iterables_definidos_por_el_usuario">Iterables definidos por el usuario</h3>
-
-<p>Podemos definir nuestros propios iterables de la siguiente forma:</p>
-
-<pre class="brush: js notranslate">var myIterable = {}
-myIterable[Symbol.iterator] = function* () {
-    yield 1;
-    yield 2;
-    yield 3;
-};
-[...myIterable] // [1, 2, 3]
-</pre>
-
-<h3 id="Iterables_mal_formados">Iterables mal formados</h3>
-
-<p>Si un método iterador <code>@@iterator</code> no devuelve un objeto iterador, es un iterable mal formado. Usarlo como tal es probable que genere excepciones en tiempo de ejecución, o comportamientos inesperados.</p>
-
-<pre class="brush: js notranslate">var nonWellFormedIterable = {}
-nonWellFormedIterable[Symbol.iterator] = () =&gt; 1
-[...nonWellFormedIterable] // TypeError: [] is not a function
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciób</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-symbol.iterator', 'Symbol.iterator')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-symbol.iterator', 'Symbol.iterator')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.Symbol.iterator")}}</p>
-
-<h2 id="Temas_relacionados">Temas relacionados</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols">Iteration protocols</a></li>
- <li>{{jsxref("Array.@@iterator", "Array.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("TypedArray.@@iterator", "TypedArray.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("String.@@iterator", "String.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}}</li>
- <li>{{jsxref("Set.@@iterator", "Set.prototype[@@iterator]()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/syntaxerror/index.html b/files/es/web/javascript/referencia/objetos_globales/syntaxerror/index.html
deleted file mode 100644
index 92bf3f4991..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/syntaxerror/index.html
+++ /dev/null
@@ -1,176 +0,0 @@
----
-title: SyntaxError
-slug: Web/JavaScript/Referencia/Objetos_globales/SyntaxError
-tags:
-  - Constructor
-  - Error
-  - JavaScript
-  - SyntaxError
-translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <code><strong>SyntaxError</strong></code> representa un error cuando se trata de interpretar codigo sintacticamente invalido.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Un <code>SyntaxError</code> es lanzado cuando el motor de JavaScript se encuentra con partes de código que no forman parte de la sintaxtis del lenguaje al momento analizar el código.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>new SyntaxError([<var>mensaje</var>[, <var>nombreArchivo</var>[, <var>numeroLinea</var>]]])</code></pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt><code>mensaje</code></dt>
- <dd>Opcional. Descripción legible del error.</dd>
- <dt><code>nombreArchivo</code> {{non-standard_inline}}</dt>
- <dd>Opcional. El nombre del archivo que contiene el código que causó la excepción.</dd>
- <dt><code>numeroLinea</code> {{non-standard_inline}}</dt>
- <dd>Opcional. El numero de linea del código que causó la excepción.</dd>
-</dl>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("SyntaxError.prototype")}}</dt>
- <dd>Permite el agregado de propiedades al objeto <code>SyntaxError</code>.</dd>
-</dl>
-
-<h2 id="Metodos">Metodos</h2>
-
-<p>El objeto global <code>SyntaxError</code> no contiene metodos propios, sin embargo, hereda algunos metodos debido a la cadena de prototipos.</p>
-
-<h2 id="Instancias_de_SyntaxError"><code>Instancias de SyntaxError</code></h2>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype', 'Propiedades')}}</div>
-
-<h3 id="Metodos_2">Metodos</h3>
-
-<div>{{page('/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype', 'Metodos')}}</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Capturando_un_SyntaxError">Capturando un <code>SyntaxError</code></h3>
-
-<pre class="brush: js">try {
-  eval('hoo bar');
-} catch (e) {
-  console.log(e instanceof SyntaxError); // true
-  console.log(e.message);                // "missing ; before statement"
-  console.log(e.name);                   // "SyntaxError"
-  console.log(e.fileName);               // "Scratchpad/1"
-  console.log(e.lineNumber);             // 1
-  console.log(e.columnNumber);           // 4
-  console.log(e.stack);                  // "@Scratchpad/1:2:3\n"
-}
-</pre>
-
-<h3 id="Creando_un_SyntaxError">Creando un <code>SyntaxError</code></h3>
-
-<pre class="brush: js">try {
-  throw new SyntaxError('Hola', 'unArchivo.js', 10);
-} catch (e) {
-  console.log(e instanceof SyntaxError); // true
-  console.log(e.message);                // "Hola"
-  console.log(e.name);                   // "SyntaxError"
-  console.log(e.fileName);               // "unArchivo.js"
-  console.log(e.lineNumber);             // 10
-  console.log(e.columnNumber);           // 0
-  console.log(e.stack);                  // "@Scratchpad/2:11:9\n"
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.11.6.4', 'SyntaxError')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-syntaxerror', 'SyntaxError')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-syntaxerror', 'SyntaxError')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegarores">Compatibilidad con Navegarores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Error")}}</li>
- <li>{{jsxref("SyntaxError.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/syntaxerror/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/syntaxerror/prototype/index.html
deleted file mode 100644
index 2de491bc21..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/syntaxerror/prototype/index.html
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: SyntaxError.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/SyntaxError/prototype
-tags:
-  - Error
-  - JavaScript
-  - Property
-  - Prototype
-  - SyntaxError
-translation_of: Web/JavaScript/Reference/Global_Objects/SyntaxError
-translation_of_original: Web/JavaScript/Reference/Global_Objects/SyntaxError/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>SyntaxError.prototype</strong></code> representa el prototipo para el constructor {{jsxref("SyntaxError")}}.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Todas las instancias de {{jsxref("SyntaxError")}} son heredadas de <code>SyntaxError.prototype</code>. Puedes usar el prototipo para agregar propiedades o metodos a todas las instancias.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>SyntaxError.prototype.constructor</code></dt>
- <dd>Especifica la funcion que creó una instancia del prototipo.</dd>
- <dt>{{jsxref("Error.prototype.message", "SyntaxError.prototype.message")}}</dt>
- <dd>Mensaje de error. A pesar de que ECMA-262 especifica que {{jsxref("SyntaxError")}} debe proveer su propia propiedad <code>message</code> , en <a href="/en-US/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, es heredada de {{jsxref("Error.prototype.message")}}.</dd>
- <dt>{{jsxref("Error.prototype.name", "SyntaxError.prototype.name")}}</dt>
- <dd>Error name. Inherited from {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.fileName", "SyntaxError.prototype.fileName")}}</dt>
- <dd>Ruta al archivo que produjo el error. Heredada de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.lineNumber", "SyntaxError.prototype.lineNumber")}}</dt>
- <dd>Numero de linea en el archivo que produjo el error. Heredada de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.columnNumber", "SyntaxError.prototype.columnNumber")}}</dt>
- <dd>Numero de columna en la linea que produjo el error. Heredada de {{jsxref("Error")}}.</dd>
- <dt>{{jsxref("Error.prototype.stack", "SyntaxError.prototype.stack")}}</dt>
- <dd>Stack trace. Heredada de {{jsxref("Error")}}.</dd>
-</dl>
-
-<h2 id="Metodos">Metodos</h2>
-
-<p>A pesar de que el objeto prototipo de {{jsxref("SyntaxError")}} no contiene metodos propios, las instancias de {{jsxref("SyntaxError")}} heredan algunos metodos debido a la cadena de prototipos.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.11.7.6', 'NativeError.prototype')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Defined as <code><em>NativeError</em>.prototype</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Defined as <code><em>NativeError</em>.prototype</code>.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-nativeerror.prototype', 'NativeError.prototype')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Defined as <code><em>NativeError</em>.prototype</code>.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<h2 id="CompatibilityTable"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{CompatibilityTable}}</span></h2>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Error.prototype")}}</li>
- <li>{{jsxref("Function.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/typedarray/buffer/index.html b/files/es/web/javascript/referencia/objetos_globales/typedarray/buffer/index.html
deleted file mode 100644
index 579f8af9bd..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/typedarray/buffer/index.html
+++ /dev/null
@@ -1,110 +0,0 @@
----
-title: TypedArray.prototype.buffer
-slug: Web/JavaScript/Referencia/Objetos_globales/TypedArray/buffer
-tags:
-  - Buffer
-  - JavaScript
-  - Propiedad
-translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray/buffer
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad de acceso <strong><code>buffer</code></strong> representa el {{jsxref("ArrayBuffer")}} referenciada por un <em>TypedArray</em> en tiempo de construcción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>typedArray</var>.buffer</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La propiedad <code>buffer</code> es una propiedad de acceso cuya función <em>set accessor</em> es <code>undefined</code>, significa que tu sólo puedes leer esta propiedad. El valor es establecido cuando <em>TypedArray</em> se construye y no puede ser cambiado. <em>TypedArray</em> es uno de los <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#TypedArray_objects">TypedArray objects</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_la_propiedad_buffer">Usando la propiedad <code>buffer</code></h3>
-
-<pre class="brush:js">var buffer = new ArrayBuffer(8);
-var uint16 = new Uint16Array(buffer);
-uint16.buffer; // ArrayBuffer { byteLength: 8 }
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-get-%typedarray%.prototype.buffer', 'TypedArray.prototype.buffer')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-get-%typedarray%.prototype.buffer', 'TypedArray.prototype.buffer')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>7.0</td>
-   <td>{{ CompatGeckoDesktop("2") }}</td>
-   <td>10</td>
-   <td>11.6</td>
-   <td>5.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile("2") }}</td>
-   <td>10</td>
-   <td>11.6</td>
-   <td>4.2</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li>
- <li>{{jsxref("TypedArray")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/typedarray/index.html b/files/es/web/javascript/referencia/objetos_globales/typedarray/index.html
deleted file mode 100644
index 644b28c081..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/typedarray/index.html
+++ /dev/null
@@ -1,317 +0,0 @@
----
-title: TypedArray
-slug: Web/JavaScript/Referencia/Objetos_globales/TypedArray
-tags:
-  - Clase
-  - Class
-  - JavaScript
-  - TypedArray
-  - TypedArrays
-translation_of: Web/JavaScript/Reference/Global_Objects/TypedArray
----
-<div>{{JSRef}}</div>
-
-<p>Un objeto <strong><em>TypedArray</em></strong> describe una vista similar a un arreglo de un <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer">búfer de datos binarios subyacente</a>. No existe una propiedad global denominada <code>TypedArray</code>, ni existe un constructor <code>TypedArray</code> directamente visible. En cambio, hay una serie de diferentes propiedades globales, cuyos valores son constructores de arreglos tipados para tipos de elementos específicos, que se enumeran a continuación. En las siguientes páginas, encontrarás propiedades y métodos comunes que se pueden utilizar con cualquier arreglo tipado que contenga elementos de cualquier tipo.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/typedarray-constructor.html")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<dl>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>ECMAScript 2015 define un constructor <code><var>TypedArray</var></code> que sirve como <code>[[Prototype]]</code> de todos los constructores <code><var>TypedArray</var></code>. Este constructor no está expuesto directamente: no existe una propiedad global <code>%TypedArray%</code> o <code>TypedArray</code>. Solo es accesible directamente a través de <code>Object.getPrototypeOf(Int8Array)</code> y similares. Todos los constructores de <code><var>TypedArray</var></code> heredan propiedades comunes de la función constructora <code>%TypedArray%</code>. Además, todos los prototipos de arreglos con tipo (<code><var>TypedArray.</var></code><code>prototype</code>) tienen <code>%TypedArray%.prototype</code> como su <code>[[Prototype]]</code>.</p>
-
-<p>El constructor <code>%TypedArray%</code> por sí solo no es particularmente útil. Llamarlo o usarlo en una expresión <code>new</code> arrojará un {{jsxref("TypeError")}}, excepto cuando se usa durante la creación de objetos en motores JS que admiten subclases. Actualmente no existen tales motores, por lo que <code>%TypedArray%</code> solo es útil para rellenar funciones o propiedades en todos los constructores <code><var>TypedArray</var></code>.</p>
-
-<p>Al crear una instancia de <code><var>TypedArray</var></code> (p. ej., <code>Int8Array</code>), se crea un arreglo de búfer internamente en la memoria o, si se proporciona un objeto <code>ArrayBuffer</code> como argumento del constructor, entonces se usa en su lugar. La dirección del búfer se guarda como una propiedad interna de la instancia y todos los métodos de <code>%<var>TypedArray</var>%.prototype</code>, es decir, establecer el valor y obtener valor, etc.., operan en esa dirección del arreglo de búfer.</p>
-
-<h3 id="Objetos_TypedArray">Objetos TypedArray</h3>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th class="header" scope="col">Tipo</th>
-   <th class="header" scope="col">Intervalo de valores</th>
-   <th class="header" scope="col">Tamaño en bytes</th>
-   <th class="header" scope="col">Descripción</th>
-   <th class="header" scope="col">Tipo de IDL web</th>
-   <th class="header" scope="col">Tipo C equivalente</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{jsxref("Int8Array")}}</td>
-   <td><code>-128</code> a <code>127</code></td>
-   <td>1</td>
-   <td>Dos enteros complementarios de 8 bits con signo</td>
-   <td><code>byte</code></td>
-   <td><code>int8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint8Array")}}</td>
-   <td><code>0</code> a <code>255</code></td>
-   <td>1</td>
-   <td>Entero de 8-bit sin signo</td>
-   <td><code>octet</code></td>
-   <td><code>uint8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint8ClampedArray")}}</td>
-   <td><code>0</code> a <code>255</code></td>
-   <td>1</td>
-   <td>Entero de 8 bits sin signo (sujeto)</td>
-   <td><code>octet</code></td>
-   <td><code>uint8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Int16Array")}}</td>
-   <td><code>-32768</code> a <code>32767</code></td>
-   <td>2</td>
-   <td>Dos enteros complementarios de 16 bits con signo</td>
-   <td><code>short</code></td>
-   <td><code>int16_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint16Array")}}</td>
-   <td><code>0</code> a <code>65535</code></td>
-   <td>2</td>
-   <td>Entero de 16 bits sin signo</td>
-   <td><code>Short sin signo</code></td>
-   <td><code>uint16_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Int32Array")}}</td>
-   <td><code>-2147483648</code> a <code>2147483647</code></td>
-   <td>4</td>
-   <td>dos enteros complementarios de 32 bits con signo</td>
-   <td><code>long</code></td>
-   <td><code>int32_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Uint32Array")}}</td>
-   <td><code>0</code> a <code>4294967295</code></td>
-   <td>4</td>
-   <td>Enteros de 32 bits sin signo</td>
-   <td><code>long sin signo</code></td>
-   <td><code>uint32_t</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Float32Array")}}</td>
-   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>38</sup></code></td>
-   <td>4</td>
-   <td>Número de coma flotante IEEE de 32 bits (7 dígitos significativos, p. ej., <code>1.1234567</code>)</td>
-   <td><code>float sin restricciones</code></td>
-   <td><code>float</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("Float64Array")}}</td>
-   <td><code>5.0</code><span>×</span><code>10<sup>-324</sup></code> a <code>1.8</code><span>×</span><code>10<sup>308</sup></code></td>
-   <td>8</td>
-   <td>Número de coma flotante IEEE de 64 bits (16 dígitos significativos, p. Ej., <code>1.123...15</code>)</td>
-   <td><code>doble sin restricciones</code></td>
-   <td><code>double</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("BigInt64Array")}}</td>
-   <td><code>-2<sup>63</sup></code> a <code>2<sup>63</sup>-1</code></td>
-   <td>8</td>
-   <td>Dos enteros complementarios de 64 bits con signo</td>
-   <td><code>bigint</code></td>
-   <td><code>int64_t (long long con signo)</code></td>
-  </tr>
-  <tr>
-   <td>{{jsxref("BigUint64Array")}}</td>
-   <td><code>0</code> a <code>2<sup>64</sup>-1</code></td>
-   <td>8</td>
-   <td>Entero de 64 bits sin signo</td>
-   <td><code>bigint</code></td>
-   <td><code>uint64_t (long long sin signo)</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Constructor">Constructor</h2>
-
-<p>No se puede crear una instancia de este objeto directamente. En su lugar, crea una instancia de un arreglo de un tipo particular, tal como {{jsxref("Int8Array")}} o {{jsxref("BigInt64Array")}}. Todos estos objetos tienen una sintaxis común para sus constructores:</p>
-
-<pre class="syntaxbox notranslate">new <var>TypedArray</var>();
-new <var>TypedArray</var>(<var>length</var>);
-new <var>TypedArray</var>(<var>typedArray</var>);
-new <var>TypedArray</var>(<var>object</var>);
-new <var>TypedArray</var>(<var>buffer</var> [, <var>byteOffset</var> [, <var>length</var>]]);
-</pre>
-
-<p>Donde <var>TypedArray</var> es un constructor para uno de los tipos concretos.</p>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>length</var></code></dt>
- <dd>Cuando se llama con un argumento <code><var>length</var></code>, se crea un búfer de arreglo interno en la memoria, de tamaño <code><var>length</var></code> <em>multiplicado por <code>BYTES_PER_ELEMENT</code></em> bytes, que contienen ceros.</dd>
- <dt><code><var>typedArray</var></code></dt>
- <dd>Cuando se llama con un argumento <code>typedArray</code>, que puede ser un objeto de cualquiera de los tipos de arreglo con tipo (como <code>Int32Array</code>), el <code><var>typedArray</var></code> se copia en un nuevo arreglo tipado. Cada valor en <code><var>typedArray</var></code> se convierte al tipo correspondiente del constructor antes de ser copiado en el nuevo arreglo. La longitud del nuevo arreglo tipado será la misma que la longitud del argumento <code><var>typedArray</var></code>.</dd>
- <dt><code><var>object</var></code></dt>
- <dd>Cuando se llama con un argumento <code><var>object</var></code>, se crea un nuevo arreglo tipado como si fuera el método <code><var>TypedArray</var>.from()</code>.</dd>
- <dt><code><var>buffer</var></code>, <code><var>byteOffset</var></code>, <code><var>length</var></code></dt>
- <dd>Cuando se llama con un <code><var>buffer</var></code> y, opcionalmente, un <code><var>byteOffset</var></code> y un <code><var>length</var></code>, se crea una nueva vista del arreglo tipado que visualiza el {{jsxref("ArrayBuffer")}} especificado. Los parámetros <code><var>byteOffset</var></code> y <code><var>length</var></code> especifican el rango de memoria que será expuesto por la vista del arreglo tipado. Si se omiten ambos, se visualiza todo el <code><var>buffer</var></code>; si solo se omite <code><var>length</var></code>, se visualiza el resto de <code><var>buffer</var></code>.</dd>
-</dl>
-
-<h2 id="Propiedades_estáticas">Propiedades estáticas</h2>
-
-<dl>
- <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT")}}</dt>
- <dd>Devuelve un valor numérico del tamaño del elemento para los diferentes objetos <code><var>TypedArray</var></code>.</dd>
- <dt>{{jsxref("TypedArray.name")}}</dt>
- <dd>Devuelve el valor de cadena del nombre del constructor (por ejemplo, <code>"Int8Array"</code>).</dd>
- <dt>{{jsxref("TypedArray.@@species", "get TypedArray[@@species]")}}</dt>
- <dd>La función constructora utilizada para crear objetos derivados.</dd>
- <dt>{{jsxref("TypedArray.prototype")}}</dt>
- <dd>Prototipo para objetos <code><var>TypedArray</var></code>.</dd>
-</dl>
-
-<h2 id="Métodos_estáticos">Métodos estáticos</h2>
-
-<dl>
- <dt>{{jsxref("TypedArray.from()")}}</dt>
- <dd>Crea un nuevo <code><var>TypedArray</var></code> a partir de un objeto iterable o similar a un arreglo. Consulta también {{jsxref("Array.from()")}}.</dd>
- <dt>{{jsxref("TypedArray.of()")}}</dt>
- <dd>Crea un nuevo <code><var>TypedArray</var></code> con un número variable de argumentos. Consulta también {{jsxref("Array.of()")}}.</dd>
-</dl>
-
-<h2 id="Propiedades_de_la_instancia">Propiedades de la instancia</h2>
-
-<dl>
- <dt>{{jsxref("TypedArray.prototype.buffer")}}</dt>
- <dd>Devuelve el {{jsxref("ArrayBuffer")}} al que hace referencia el arreglo tipado. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura</strong>.</dd>
- <dt>{{jsxref("TypedArray.prototype.byteLength")}}</dt>
- <dd>Devuelve la longitud (en bytes) del arreglo tipado. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura.</strong></dd>
- <dt>{{jsxref("TypedArray.prototype.byteOffset")}}</dt>
- <dd>Devuelve el desplazamiento (en bytes) del arreglo tipado desde el inicio de su {{jsxref("ArrayBuffer")}}. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura.</strong></dd>
- <dt>{{jsxref("TypedArray.prototype.length")}}</dt>
- <dd>Devuelve el número de elementos contenidos en el arreglo tipado. Corregido en el momento de la construcción y, por lo tanto, de <strong>solo lectura.</strong></dd>
-</dl>
-
-<h2 id="Métodos_de_instancia">Métodos de instancia</h2>
-
-<dl>
- <dt>{{jsxref("TypedArray.prototype.copyWithin()")}}</dt>
- <dd>Copia una secuencia de elementos de arreglo dentro del arreglo. Consulta también {{jsxref("Array.prototype.copyWithin()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.entries()")}}</dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los pares clave/valor para cada índice del arreglo. Consulta también {{jsxref("Array.prototype.entries()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.every()")}}</dt>
- <dd>Comprueba si todos los elementos del arreglo pasan la prueba proporcionada por una función. Consulta también {{jsxref("Array.prototype.every()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.fill()")}}</dt>
- <dd>Rellena todos los elementos de un arreglo desde un índice inicial hasta un índice final con un valor estático. Consulta también {{jsxref("Array.prototype.fill()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.filter()")}}</dt>
- <dd>Crea un nuevo arreglo con todos los elementos de este arreglo para la cual la función de filtrado proporcionada devuelve <code>true</code>. Consulta también {{jsxref("Array.prototype.filter()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.find()")}}</dt>
- <dd>Devuelve el valor encontrado en el arreglo, si un elemento del arreglo satisface la función de prueba proporcionada, o <code>undefined</code> si no se encuentra. Consulta también {{jsxref("Array.prototype.find()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.findIndex()")}}</dt>
- <dd>Devuelve el índice encontrado en el arreglo, si un elemento del arreglo satisface la función de prueba proporcionada o <code>-1</code> si no se encuentra. Consulta también {{jsxref("Array.prototype.findIndex()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.forEach()")}}</dt>
- <dd>Llama a una función para cada elemento del arreglo. Consulta también {{jsxref("Array.prototype.forEach()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.includes()")}}</dt>
- <dd>Determina si un arreglo tipado incluye un determinado elemento, devolviendo <code>true</code> o <code>false</code> según corresponda. Consulta también {{jsxref("Array.prototype.includes()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.indexOf()")}}</dt>
- <dd>Devuelve el primer (mínimo) índice de un elemento dentro del arreglo igual al valor especificado, o <code>-1</code> si no se encuentra ninguno. Consulta también {{jsxref("Array.prototype.indexOf()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.join()")}}</dt>
- <dd>Une todos los elementos de un arreglo en una cadena. Consulta también {{jsxref("Array.prototype.join()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.keys()")}}</dt>
- <dd>Devuelve un nuevo <code>Array Iterator</code> que contiene las claves para cada índice del arreglo. Consulta también {{jsxref("Array.prototype.keys()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.lastIndexOf()")}}</dt>
- <dd>Devuelve el último (mayor) índice de un elemento dentro del arreglo igual al valor especificado, o <code>-1</code> si no se encuentra ninguno. Consulta también {{jsxref("Array.prototype.lastIndexOf()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.map()")}}</dt>
- <dd>Crea un nuevo arreglo con los resultados de llamar a una función proporcionada en cada elemento de este arreglo. Consulta también {{jsxref("Array.prototype.map()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.reduce()")}}</dt>
- <dd>Aplica una función contra un acumulador y cada valor del arreglo (de izquierda a derecha) para reducirlo a un solo valor. Consulta también {{jsxref("Array.prototype.reduce()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.reduceRight()")}}</dt>
- <dd>Aplica una función contra un acumulador y cada valor del arreglo (de derecha a izquierda) para reducirlo a un solo valor. Consulta también {{jsxref("Array.prototype.reduceRight()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.reverse()")}}</dt>
- <dd>Invierte el orden de los elementos de un arreglo: el primero se convierte en el último y el último en el primero. Consulta también {{jsxref("Array.prototype.reverse()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.set()")}}</dt>
- <dd>Almacena múltiples valores en el arreglo tipado, leyendo valores de entrada de un arreglo especificado.</dd>
- <dt>{{jsxref("TypedArray.prototype.slice()")}}</dt>
- <dd>Extrae una sección de un arreglo y devuelve un nuevo arreglo. Consulta también {{jsxref("Array.prototype.slice()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.some()")}}</dt>
- <dd>Devuelve <code>true</code> si al menos un elemento de este arreglo satisface la función de prueba proporcionada. Consulta también {{jsxref("Array.prototype.some()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.sort()")}}</dt>
- <dd>Ordena los elementos de un arreglo en su lugar y devuelve el arreglo. Consulta también {{jsxref("Array.prototype.sort()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.subarray()")}}</dt>
- <dd>Devuelve un nuevo <code><var>TypedArray</var></code> del índice del elemento inicial y final dado.</dd>
- <dt>{{jsxref("TypedArray.prototype.values()")}}</dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores de cada índice del arreglo. Consulta también {{jsxref("Array.prototype.values()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.toLocaleString()")}}</dt>
- <dd>Devuelve una cadena localizada que representa el arreglo y sus elementos. Consulta también {{jsxref("Array.prototype.toLocaleString()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.toString()")}}</dt>
- <dd>Devuelve una cadena que representa el arreglo y sus elementos. Consulta también {{jsxref("Array.prototype.toString()")}}.</dd>
- <dt>{{jsxref("TypedArray.prototype.@@iterator()", "TypedArray.prototype[@@iterator]()")}}</dt>
- <dd>Devuelve un nuevo objeto <code>Array Iterator</code> que contiene los valores de cada índice del arreglo.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Se_requiere_new">Se requiere <code>new</code></h3>
-
-<p>A partir de ECMAScript 2015, los constructores <code>TypedArray</code> se deben construir con el operador {{jsxref("Operators/new", "new")}}. Llamar a un constructor <code>TypedArray</code> como una función sin <code>new</code> arrojará un {{jsxref("TypeError")}}.</p>
-
-<pre class="brush: js example-bad notranslate">var dv = Int8Array([1, 2, 3]);
-// TypeError: llamar a un constructor Int8Array incorporado
-// sin new está prohibido</pre>
-
-<pre class="brush: js example-good notranslate">var dv = new Int8Array([1, 2, 3]);</pre>
-
-<h3 id="Acceso_a_la_propiedad">Acceso a la propiedad</h3>
-
-<p>Puedes hacer referencia a elementos en el arreglo utilizando la sintaxis de índice de arreglo estándar (es decir, utilizando la notación entre corchetes). Sin embargo, obtener o establecer propiedades indexadas en arreglos tipados no buscará esta propiedad en la cadena de prototipos, incluso cuando los índices estén fuera de límites. Las propiedades indexadas consultarán el {{jsxref("ArrayBuffer")}} y nunca mirarán las propiedades del objeto. Aún puedes usar propiedades con nombre, al igual que con todos los objetos.</p>
-
-<pre class="brush: js notranslate">// Configuración y obtención usando la sintaxis de arreglo estándar
-var int16 = new Int16Array(2);
-int16[0] = 42;
-[parcial]console.log(0);
-
-// No se consultan las propiedades indexadas en los prototipos (Fx 25)
-Int8Array.prototype[20] = 'foo';
-(new Int8Array(32))[20]; // 0
-// incluso cuando está fuera del límite
-Int8Array.prototype[20] = 'foo';
-(new Int8Array(8))[20]; // undefined
-// o con enteros negativos
-Int8Array.prototype[-1] = 'foo';
-(new Int8Array(8))[-1]; // undefined
-
-// Sin embargo, se permiten propiedades con nombre (Fx 30)
-Int8Array.prototype.foo = 'bar';
-(new Int8Array(32)).foo; // "bar"</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-typedarray-objects', 'TypedArray Objects')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.TypedArray")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Typed_arrays" title="es/JavaScript arreglos tipados">Arreglos tipados JavaScript</a></li>
- <li>{{jsxref("ArrayBuffer")}}</li>
- <li>{{jsxref("DataView")}}</li>
- <li><a href="/es/docs/Web/API/TextDecoder">TextDecoder</a> — Ayuda que decodifica cadenas a partir de datos numéricos</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/uint8array/index.html b/files/es/web/javascript/referencia/objetos_globales/uint8array/index.html
deleted file mode 100644
index 6402e356b0..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/uint8array/index.html
+++ /dev/null
@@ -1,260 +0,0 @@
----
-title: Uint8Array
-slug: Web/JavaScript/Referencia/Objetos_globales/Uint8Array
-tags:
-  - Arreglo
-  - JavaScript
-  - array de enteros
-translation_of: Web/JavaScript/Reference/Global_Objects/Uint8Array
----
-<div>{{JSRef}}</div>
-
-<p>Los <strong><code>Uint8Array</code></strong> representan un array de enteros sin signo de 8 bits. El contenido se inicializa a 0. Una vez establecido, puedes hacer referencia a un elemento usando los métodos del objeto o usando la sintaxis de array estándar (esto es, usando la notación de corchetes).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">new Uint8Array(tamaño);
-new Uint8Array(typedArray);
-new Uint8Array(objeto);
-new Uint8Array(buffer [, byteOffset [, tamaño]]);</pre>
-
-<p>Para más información acerca de la sintaxis del constructor y sus parámetros, mire <em><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray#Syntax">TypedArray</a></em>.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt>{{jsxref("TypedArray.BYTES_PER_ELEMENT", "Uint8Array.BYTES_PER_ELEMENT")}}</dt>
- <dd>Retorna un número con el valor del tamaño del elemento. <code>1</code> en el caso del <code>Uint8Array</code>.</dd>
- <dt>Uint8Array.length</dt>
- <dd>Propiedad estática de tamaño cuyo valor es 3. Para el tamaño actual (número d elementos), mire {{jsxref("TypedArray.prototype.length", "Uint8Array.prototype.length")}}.</dd>
- <dt>{{jsxref("TypedArray.name", "Uint8Array.name")}}</dt>
- <dd>Devuelve el nombre del constructor en un string. En el caso de <code>Uint8Array</code> devuelve: "Uint8Array".</dd>
- <dt>{{jsxref("TypedArray.prototype", "Uint8Array.prototype")}}</dt>
- <dd>Prototipo para los objetos <em>TypedArray</em> .</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("TypedArray.from", "Uint8Array.from()")}}</dt>
- <dd>Crea un nuevo <code>Uint8Array</code> desde un array o un objeto iterable. Véase también {{jsxref("Array.from()")}}.</dd>
- <dt>{{jsxref("TypedArray.of", "Uint8Array.of()")}}</dt>
- <dd>Crea un  <code>Uint8Array con un número variable de argumentos</code>. Véase también {{jsxref("Array.of()")}}.</dd>
-</dl>
-
-<h2 id="Uint8Array_prototype"><code>Uint8Array</code> prototype</h2>
-
-<p>Todos los objetos <code>Uint8Array</code> son heredados de {{jsxref("TypedArray.prototype", "%TypedArray%.prototype")}}.</p>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<dl>
- <dt><code>Uint8Array.prototype.constructor</code></dt>
- <dd>Retorna la función que crea una instancia del prototype. Éste es el constructor por defecto de <code>Uint8Array</code>.</dd>
- <dt>{{jsxref("TypedArray.prototype.buffer", "Uint8Array.prototype.buffer")}} {{readonlyInline}}</dt>
- <dd>Retorna el {{jsxref("ArrayBuffer")}} con la referencia del <code>Uint8Array. </code>Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
- <dt>{{jsxref("TypedArray.prototype.byteLength", "Uint8Array.prototype.byteLength")}} {{readonlyInline}}</dt>
- <dd>Retorna el tamaño (en bytes) del array <code>Uint8Array</code>. Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
- <dt>{{jsxref("TypedArray.prototype.byteOffset", "Uint8Array.prototype.byteOffset")}} {{readonlyInline}}</dt>
- <dd>Retorna el offset (en bytes) del <code>Uint8Array</code> desde el inicio de su  {{jsxref("ArrayBuffer")}}. Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
- <dt>{{jsxref("TypedArray.prototype.length", "Uint8Array.prototype.length")}} {{readonlyInline}}</dt>
- <dd>Retorna el número de elementos contenidos en el <code>Uint8Array</code>. Fijado en el tiempo de construcción y es de <strong>sólo lectura</strong>.</dd>
-</dl>
-
-<h3 id="Métodos_2">Métodos</h3>
-
-<dl>
- <dt>{{jsxref("TypedArray.copyWithin", "Uint8Array.prototype.copyWithin()")}}</dt>
- <dd>Copia una secuencia de elementos del array dentro del array. Véase también {{jsxref("Array.prototype.copyWithin()")}}.</dd>
- <dt>{{jsxref("TypedArray.entries", "Uint8Array.prototype.entries()")}}</dt>
- <dd>Retorna un nuevo objeto <code>Array Iterator</code> que contiene los pares de valores para cada índice del array. Véase también {{jsxref("Array.prototype.entries()")}}.</dd>
- <dt>{{jsxref("TypedArray.every", "Uint8Array.prototype.every()")}}</dt>
- <dd>Prueba si todos los elementos del array cumplen las condiciones de una función. Véase también {{jsxref("Array.prototype.every()")}}.</dd>
- <dt>{{jsxref("TypedArray.fill", "Uint8Array.prototype.fill()")}}</dt>
- <dd>Llena todos los elementos del array desde el principio hasta el final con un valor dado. Véase también {{jsxref("Array.prototype.fill()")}}.</dd>
- <dt>{{jsxref("TypedArray.filter", "Uint8Array.prototype.filter()")}}</dt>
- <dd>Crea un nuevo array con todos los elementos del array que satisfacen las condiciones de una función que devuelve verdadero. Véase también {{jsxref("Array.prototype.filter()")}}.</dd>
- <dt>{{jsxref("TypedArray.find", "Uint8Array.prototype.find()")}}</dt>
- <dd>Devuelve el valor encontrado en el array, si un elemento del array satisface una función dada de prueba o undefined si no es encontrada. Véase también {{jsxref("Array.prototype.find()")}}.</dd>
- <dt>{{jsxref("TypedArray.findIndex", "Uint8Array.prototype.findIndex()")}}</dt>
- <dd>Devuelve el índice encontrado en el array, si un elemento del array satisface una función dada de prueba o -1 si no es encontrada. Véase también {{jsxref("Array.prototype.findIndex()")}}.</dd>
- <dt>{{jsxref("TypedArray.forEach", "Uint8Array.prototype.forEach()")}}</dt>
- <dd>Llama a una función para cada elemento del array. Véase también {{jsxref("Array.prototype.forEach()")}}.</dd>
- <dt>{{jsxref("TypedArray.includes", "Uint8Array.prototype.includes()")}} {{experimental_inline}}</dt>
- <dd>Determina si un <font face="consolas, Liberation Mono, courier, monospace">array</font> incluye un cierto elemento, retornando <code>true</code> o <code>false</code> según corresponda. Véase también {{jsxref("Array.prototype.includes()")}}.</dd>
- <dt>{{jsxref("TypedArray.indexOf", "Uint8Array.prototype.indexOf()")}}</dt>
- <dd>Devuelve el primer (menor) índice de un elemento dentro del array igual al valor especificado, o -1 si no es encontrado. Véase también {{jsxref("Array.prototype.indexOf()")}}.</dd>
- <dt>{{jsxref("TypedArray.join", "Uint8Array.prototype.join()")}}</dt>
- <dd>Une todos los elementos de un array a una cadena.  Véase también {{jsxref("Array.prototype.join()")}}.</dd>
- <dt>{{jsxref("TypedArray.keys", "Uint8Array.prototype.keys()")}}</dt>
- <dd>Retorna un nuevo <code>Array Iterator</code> que contiene las claves para cada índice en el array. Véase también {{jsxref("Array.prototype.keys()")}}.</dd>
- <dt>{{jsxref("TypedArray.lastIndexOf", "Uint8Array.prototype.lastIndexOf()")}}</dt>
- <dd>Devuelve el último (mayor) índice de un elemento dentro del array igual al valor especificado, o -1 si no fue encontrado. Véase también {{jsxref("Array.prototype.lastIndexOf()")}}.</dd>
- <dt>{{jsxref("TypedArray.map", "Uint8Array.prototype.map()")}}</dt>
- <dd>Crea un nuevo array con los resultados de la llamada a la función indicada aplicados a cada uno de sus elementos. Véase también {{jsxref("Array.prototype.map()")}}.</dd>
- <dt>{{jsxref("TypedArray.move", "Uint8Array.prototype.move()")}} {{non-standard_inline}} {{unimplemented_inline}}</dt>
- <dd>Primera versión no-estandar de {{jsxref("TypedArray.copyWithin", "Uint8Array.prototype.copyWithin()")}}.</dd>
- <dt>{{jsxref("TypedArray.reduce", "Uint8Array.prototype.reduce()")}}</dt>
- <dd>
- <p>Aplica una función a un acumulador y a cada valor de un array (de izquierda a derecha) para reducirlo a un único valor. Véase también {{jsxref("Array.prototype.reduce()")}}.</p>
- </dd>
- <dt>{{jsxref("TypedArray.reduceRight", "Uint8Array.prototype.reduceRight()")}}</dt>
- <dd>Aplica una función a un acumulador y a cada valor de un array (de derecha a izquierda) para reducirlo a un único valor. Véase también {{jsxref("Array.prototype.reduceRight()")}}.</dd>
- <dt>{{jsxref("TypedArray.reverse", "Uint8Array.prototype.reverse()")}}</dt>
- <dd>Inverte el orden de los elementos de un array, el primero se convierte en el último y el último en el primero. See also {{jsxref("Array.prototype.reverse()")}}.</dd>
- <dt>{{jsxref("TypedArray.set", "Uint8Array.prototype.set()")}}</dt>
- <dd>Almacena múltiples valores en el array, leyendo los valores de entrada de un array específico.</dd>
- <dt>{{jsxref("TypedArray.slice", "Uint8Array.prototype.slice()")}}</dt>
- <dd>Extrae una porción de un array y devuelve uno nuevo. Véase también {{jsxref("Array.prototype.slice()")}}.</dd>
- <dt>{{jsxref("TypedArray.some", "Uint8Array.prototype.some()")}}</dt>
- <dd>Devuelve <code>true</code> si al menos un elemento de este array satisface la función de prueba proporcionada. Véase también {{jsxref("Array.prototype.some()")}}.</dd>
- <dt>{{jsxref("TypedArray.sort", "Uint8Array.prototype.sort()")}}</dt>
- <dd>Ordena los elementos de un array localmente y devuelve el array. Véase también {{jsxref("Array.prototype.sort()")}}.</dd>
- <dt>{{jsxref("TypedArray.subarray", "Uint8Array.prototype.subarray()")}}</dt>
- <dd>Retorna un nuevo <code>Uint8Array</code> desde el índice de elementos iniciales y finales proporcionados.</dd>
- <dt>{{jsxref("TypedArray.values", "Uint8Array.prototype.values()")}}</dt>
- <dd>Retorna un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array. Véase también {{jsxref("Array.prototype.values()")}}.</dd>
- <dt>{{jsxref("TypedArray.toLocaleString", "Uint8Array.prototype.toLocaleString()")}}</dt>
- <dd>Devuelve una cadena localizada que representa el array y sus elementos. Véase también {{jsxref("Array.prototype.toLocaleString()")}}.</dd>
- <dt>{{jsxref("TypedArray.toString", "Uint8Array.prototype.toString()")}}</dt>
- <dd>Retorna una cadena representando el array sus elementos. Véase también {{jsxref("Array.prototype.toString()")}}.</dd>
- <dt>{{jsxref("TypedArray.@@iterator", "Uint8Array.prototype[@@iterator]()")}}</dt>
- <dd>Retorna un nuevo objeto <code>Array Iterator</code> que contiene los valores para cada índice en el array.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">// Desde una longitud
-var uint8 = new Uint8Array(2);
-uint8[0] = 42;
-console.log(uint8[0]); // 42
-console.log(uint8.length); // 2
-console.log(uint8.BYTES_PER_ELEMENT); // 1
-
-// Desde un array
-var arr = new Uint8Array([21,31]);
-console.log(arr[1]); // 31
-
-// Desde otro TypedArray
-var x = new Uint8Array([21, 31]);
-var y = new Uint8Array(x);
-console.log(y[0]); // 21
-
-// Desde un ArrayBuffer
-var buffer = new ArrayBuffer(8);
-var z = new Uint8Array(buffer, 1, 4);
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Typed Array')}}</td>
-   <td>{{Spec2('Typed Array')}}</td>
-   <td>Sustituida por ECMAScript 6.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#table-49', 'TypedArray constructors')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial en un ECMA standard. Se especificó que <code>new</code> es requirerido.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#table-49', 'TypedArray constructors')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>7.0</td>
-   <td>{{ CompatGeckoDesktop(2) }}</td>
-   <td>10</td>
-   <td>11.6</td>
-   <td>5.1</td>
-  </tr>
-  <tr>
-   <td><code>new</code> es requerido</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{ CompatGeckoDesktop(44) }}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>4.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile(2) }}</td>
-   <td>10</td>
-   <td>11.6</td>
-   <td>4.2</td>
-  </tr>
-  <tr>
-   <td><code>new</code> es requerido</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{ CompatGeckoMobile(44) }}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_de_compatibilidad">Notas de compatibilidad</h2>
-
-<p>A partir de ECMAScript 2015 (ES6), los constructors de <code>Uint8Array</code> requiren ser construidos con un operador {{jsxref("Operators/new", "new")}}. Llamar a un contructor de <code>Uint8Array</code> como una función sin <code>new</code>, lanzará un {{jsxref("TypeError")}} de ahora en adelante.</p>
-
-<pre class="brush: js example-bad">var dv = Uint8Array([1, 2, 3]);
-// TypeError: calling a builtin Uint8Array constructor
-// without new is forbidden</pre>
-
-<pre class="brush: js example-good">var dv = new Uint8Array([1, 2, 3]);</pre>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Typed_arrays">JavaScript typed arrays</a></li>
- <li>{{jsxref("ArrayBuffer")}}</li>
- <li>{{jsxref("DataView")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/undefined/index.html b/files/es/web/javascript/referencia/objetos_globales/undefined/index.html
deleted file mode 100644
index 1aa7db29b8..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/undefined/index.html
+++ /dev/null
@@ -1,183 +0,0 @@
----
-title: undefined
-slug: Web/JavaScript/Referencia/Objetos_globales/undefined
-tags:
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Global_Objects/undefined
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>La propiedad global <strong>undefined</strong> representa el valor primitivo <code>{{Glossary("Undefined", "undefined")}}</code>. Es uno de los {{Glossary("Primitive", "valores primitivos")}} de JavaScript.</p>
-
-<p>{{js_property_attributes(0,0,0)}}</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>undefined</code></pre>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p><code>undefined</code> es una propiedad del <em>objeto global</em>, es decir, una variable de alcance global. El valor inicial de <code>undefined</code> es el valor primitivo <code>{{Glossary("Undefined", "undefined")}}</code>.<span class="comment">this needs clarification, but that would require explaining primitive values</span></p>
-
-<p>En navegadores modernos (JavaScript 1.8.5 / Firefox 4+), <code>undefined </code>es una propiedad <em>no-configurable</em>, <em>no-grabable</em> según la especificación ECMAScript 5. Aún cuando este no sea el caso, evite sobreescribirlo.</p>
-
-<p>Una variable a la que no se le ha asignado valor, o no se ha declarado en absoluto (no se declara, no existe) son de tipo <code>undefined</code>. Un método o sentencia también devuelve <code>undefined</code> si la variable que se está evaluando no tiene asignado un valor. Una función devuelve <code>undefined</code> si no se ha {{jsxref("Sentencias/return", "devuelto")}} un valor.</p>
-
-<div class="blockIndicator note">
-<p>Ten en cuenta que si no se ha declarado una variable ni explícita ni implícitamente, no puedes compararla con <strong>undefined  </strong>ya que obtendrías un <strong><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError">ReferenceError</a>, </strong> pero puedes comparar su tipo con la cadena (<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/String">String</a>) "undefined". En el ejemplo más abajo se podrá ver cómo conseguir esto usando el operador <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/typeof">typeof</a>.</p>
-</div>
-
-<div class="warning">
-<p>Aunque es posible usarlo como un {{Glossary("Identifier", "identificador")}} (nombre de variable) en cualquier otro ámbito que no sea el ámbito global (porque <code>undefined </code>no es una {{jsxref("Reserved_Words", "palabra reservada")}}), hacerlo es una mala idea que provocará que tú código sea difícil de mantener y depurar.</p>
-
-<pre class="brush: js">//NO HAGAS ESTO
-
-// registra "foo string"
-(function(){ var undefined = 'foo'; console.log(undefined, typeof undefined); })()
-
-// registra "foo string"
-(function(undefined){ console.log(undefined, typeof undefined); })('foo');</pre>
-</div>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Ejemplos</h2>
-
-<h3 id="Igualdad_estricta_y_undefined">Igualdad estricta y <code>undefined</code></h3>
-
-<p>Puedes usar <code>undefined</code> y los operadores de igualdad y desigualdad estricta para determinar si una variable tiene un valor asignado. En el siguiente ejemplo la variable <code>x</code> no está inicializada, y la sentencia <code>if</code> se evalúa como verdadera.</p>
-
-<pre class="brush: js">var x;
-if (x === undefined) {
-   // se ejecutan estas instrucciones
-}
-else {
-   // estas instrucciones no se ejecutan
-}</pre>
-
-<div class="note">
-<p>Nota: Aquí se debe usar el operador de igualdad estricta en lugar del operador de igualdad estándar, ya que <code>x == undefined</code> también verifica si <code>x</code> es <code>null</code>, mientras que el de igualdad estricta no. <code>null</code> no es equivalente a <code>undefined</code>. Vea {{jsxref("Operadores/Comparison_Operators", "operadores de comparación")}} para más detalles.</p>
-</div>
-
-<h3 id="Typeof_operador_y_undefined">Typeof operador y <code>undefined</code></h3>
-
-<p>Alternativamente se puede usar {{jsxref("Operadores/typeof","typeof")}}.  Recuerda que este siempre devolverá una cadena de texto con el tipo:</p>
-
-<pre class="brush: js">var x;
-if (typeof x === 'undefined') {
-   // se ejecutan estas instrucciones
-}
-</pre>
-
-<p>Una razón para usar {{jsxref("Operadores/typeof","typeof")}} es que no devuelve un error si la variable no fue declarada.</p>
-
-<pre class="brush: js">// x no fue declarada antes
-if (typeof x === 'undefined') { // devuelve true
-   //se ejecutan estas instrucciones
-}
-
-if (x === undefined) { // lanza un ReferenceError
-
-}
-</pre>
-
-<p>Sin embargo, este tipo de técnica debe evitarse. JavaScript es un lenguaje de ámbito estático, por lo que determinar si una variable se encuentra declarada puede ser definido al ver si está declarada en un contexto de inclusión. La única excepción es el ámbito global, pero el ámbito global está vinculado al objeto global, por lo que comprobar la existencia de una variable en el contexto global puede realizarse comprobando la existencia de una propiedad del <em>objeto global</em> (utilizando el operador {{jsxref("Operators/in", "in")}}, por ejemplo).</p>
-
-<h3 id="Operador_void_y_undefined">Operador void y <code>undefined</code></h3>
-
-<p>El operador {{jsxref("Operadores/void", "void")}} es una tercer alternativa.</p>
-
-<pre class="brush: js">var x;
-if (x === void 0) {
-   // se ejecutan estas instrucciones
-}
-
-// y no fue declarada antes
-if (y === void 0) {
-   // lanza un ReferenceError (a diferencia de  `typeof`)
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-4.3.9', 'undefined')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.3.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.1.1.3', 'undefined')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-undefined', 'undefined')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-undefined', 'undefined')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
diff --git a/files/es/web/javascript/referencia/objetos_globales/unescape/index.html b/files/es/web/javascript/referencia/objetos_globales/unescape/index.html
deleted file mode 100644
index 48418ef48a..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/unescape/index.html
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: unescape()
-slug: Web/JavaScript/Referencia/Objetos_globales/unescape
-translation_of: Web/JavaScript/Reference/Global_Objects/unescape
----
-<div>{{jsSidebar("Objects")}}</div>
-
-<p>La función deprecada <code><strong>unescape()</strong></code> calcula un nuevo string  en el cual secuencia de valores hexadecimales son reemplazados con el caracter que representa. La secuencia de calculo deber{ia ser introducida por una función como {{jsxref("escape")}}. Por que <code>unescape</code> está deprecada, usar {{jsxref("decodeURI")}} or {{jsxref("decodeURIComponent")}}.</p>
-
-<div class="note"><strong>Note:</strong> Do not use <code>unescape</code> to decode URIs, use <code>decodeURI</code> instead.</div>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code>unescape(str)</code></pre>
-
-<h3 id="Parameters">Parameters</h3>
-
-<dl>
- <dt><code>str</code></dt>
- <dd>A string to be decoded.</dd>
-</dl>
-
-<h2 id="Description">Description</h2>
-
-<p>The <code>unescape</code> function is a property of the <em>global object</em>.</p>
-
-<h2 id="Examples">Examples</h2>
-
-<pre class="brush: js">unescape("abc123");     // "abc123"
-unescape("%E4%F6%FC");  // "äöü"
-unescape("%u0107");     // "ć"
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-15.1.2.5', 'unescape')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-B.2.2', 'unescape')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Defined in the (informative) Compatibility Annex B</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-unescape-string', 'unescape')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-unescape-string', 'unescape')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Defined in the (normative) Annex B for Additional ECMAScript Features for Web Browsers</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("decodeURI")}}</li>
- <li>{{jsxref("decodeURIComponent")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/urierror/index.html b/files/es/web/javascript/referencia/objetos_globales/urierror/index.html
deleted file mode 100644
index 3ba028a2ab..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/urierror/index.html
+++ /dev/null
@@ -1,136 +0,0 @@
----
-title: URIError
-slug: Web/JavaScript/Referencia/Objetos_globales/URIError
-tags:
-  - Error
-  - JavaScript
-  - Reference
-  - URIError
-translation_of: Web/JavaScript/Reference/Global_Objects/URIError
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <code><strong>URIError</strong></code>  representa un error cuando una función de uso URI global se usó de manera incorrecta.</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox"><code>new URIError([<var>message</var>[, <var>fileName</var>[, <var>lineNumber</var>]]])</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>message</code></dt>
- <dd>Opcional. Descripción del error legible para una persona.</dd>
- <dt><code>fileName</code> {{non-standard_inline}}</dt>
- <dd>Opcional. El nombre del archivo que contien el código causante de la excepción.</dd>
- <dt><code>lineNumber</code> {{non-standard_inline}}</dt>
- <dd>Opcional. El número de línea del código que ha causado la excepción.</dd>
-</dl>
-
-<h2 id="Description">Description</h2>
-
-<p>Se envía <code>URIError</code>  cuando las fuciones de uso del URI global pasan pro un URI con formato incorrecto.</p>
-
-<h2 id="Properties">Properties</h2>
-
-<dl>
- <dt>{{jsxref("URIError.prototype")}}</dt>
- <dd>Permite agregar propiedades a un objeto URIError</dd>
-</dl>
-
-<h2 id="Methods">Methods</h2>
-
-<p>El <code>URIError</code> global no contiene métodos propios, sin embargo, sí hereda algunos métodos a través de la cadena de prototipos.</p>
-
-<h2 id="URIError_instancias"><code>URIError</code> instancias</h2>
-
-<h3 id="Propiedades">Propiedades</h3>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/URIError/prototype', 'Properties')}}</div>
-
-<h3 id="Métodos">Métodos</h3>
-
-<div>{{page('/en-US/docs/Web/JavaScript/Reference/Global_Objects/URIError/prototype', 'Methods')}}</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Recoger_un_URIError">Recoger un <code>URIError</code></h3>
-
-<pre class="brush: js">try {
-  decodeURIComponent('%');
-} catch (e) {
-  console.log(e instanceof URIError); // true
-  console.log(e.message);             // "malformed URI sequence"
-  console.log(e.name);                // "URIError"
-  console.log(e.fileName);            // "Scratchpad/1"
-  console.log(e.lineNumber);          // 2
-  console.log(e.columnNumber);        // 2
-  console.log(e.stack);               // "@Scratchpad/2:2:3\n"
-}
-</pre>
-
-<h3 id="Creando_un_URIError">Creando un <code>URIError</code></h3>
-
-<pre class="brush: js">try {
-  throw new URIError('Hello', 'someFile.js', 10);
-} catch (e) {
-  console.log(e instanceof URIError); // true
-  console.log(e.message);             // "Hello"
-  console.log(e.name);                // "URIError"
-  console.log(e.fileName);            // "someFile.js"
-  console.log(e.lineNumber);          // 10
-  console.log(e.columnNumber);        // 0
-  console.log(e.stack);               // "@Scratchpad/2:2:9\n"
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3', '#sec-15.11.6.6', 'URIError')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Initial definition</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-15.11.6.6', 'URIError')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-native-error-types-used-in-this-standard-urierror', 'URIError')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-native-error-types-used-in-this-standard-urierror', 'URIError')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de los datos estructurados. Si desea contribuir con los datos, visite <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenes una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.URIError")}}</p>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Error")}}</li>
- <li>{{jsxref("URIError.prototype")}}</li>
- <li>{{jsxref("Global_Objects/decodeURI", "decodeURI()")}}</li>
- <li>{{jsxref("Global_Objects/decodeURIComponent", "decodeURIComponent()")}}</li>
- <li>{{jsxref("Global_Objects/encodeURI", "encodeURI()")}}</li>
- <li>{{jsxref("Global_Objects/encodeURIComponent", "encodeURIComponent()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakmap/clear/index.html b/files/es/web/javascript/referencia/objetos_globales/weakmap/clear/index.html
deleted file mode 100644
index b5c66c7714..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakmap/clear/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
----
-title: WeakMap.prototype.clear()
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/clear
-tags:
-  - JavaScript
-  - Obsolete
-  - Protocols
-  - WeakMap
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/clear
----
-<div>{{JSRef}} {{obsolete_header}}</div>
-
-<p>El método <code><strong>clear()</strong></code> es utilizado para suprimir todos los elementos del objeto <code>WeakMap</code>, sin embargo, ya no es parte de ECMAScript, ni de sus implementaciones.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>wm</em>.clear();</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilización_del_método_clear">Utilización del método <code>clear</code> </h3>
-
-<pre class="brush: js;highlight:[10] example-bad">var wm = new WeakMap();
-var obj = {};
-
-wm.set(obj, 'foo');
-wm.set(window, 'bar');
-
-wm.has(obj); // true
-wm.has(window); // true
-
-wm.clear();
-
-wm.has(obj)  // false
-wm.has(window)  // false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>No es parte de ninguna especificación actual o borrador. Este método fue parte de ECMAScript 6 como un bosquejo hasta la revisión 28 (versión de Octubre 14, 2014), sin embargo ha sido eliminado en versiones posteriores. No es parte de la última versión estándar.</p>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.WeakMap.clear")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("WeakMap")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakmap/delete/index.html b/files/es/web/javascript/referencia/objetos_globales/weakmap/delete/index.html
deleted file mode 100644
index 7f4933eb0b..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakmap/delete/index.html
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: WeakMap.prototype.delete()
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/delete
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Prototype
-  - WeakMap
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/delete
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>delete()</strong></code> elimina un elemento específico del objeto <code>WeakMap</code> .</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>wm</em>.delete(key);</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>identificador (key)</dt>
- <dd>Requerido. El identificador del elemento a eliminar en el objeto <code>WeakMap</code>.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p><code>true</code> si el elemento del objeto <code>WeakMap</code> ha sido eliminado correctamente. Y <code>false</code> si la llave a eliminar no fue encontrada en el objeto <code>WeakMap</code> o bien, si la llave no es un objeto.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilización_del_método_delete">Utilización del método <code>delete</code> </h3>
-
-<pre class="brush: js;highlight:[4]">var wm = new WeakMap();
-wm.set(window, "foo");
-
-wm.delete(window); // Devuelve true. Eliminado correctamente.
-
-wm.has(window);    // Devuelve false. El elemento window ya no es parte de WeakMap.
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-weakmap.prototype.delete', 'WeakMap.prototype.delete')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.delete', 'WeakMap.prototype.delete')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>36</td>
-   <td>{{CompatGeckoDesktop("6.0")}}</td>
-   <td>11</td>
-   <td>23</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("6.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_especificas_de_Firefox">Notas especificas de Firefox</h2>
-
-<ul>
- <li>Anterior a SpiderMonkey 38 {{geckoRelease(38)}}, este método lanzaba {{jsxref("TypeError")}} cuando el parámetro <code>key</code> no era un objeto. Esto ha sido corregido en la versión 38 y posteriormente devuelve <code>false</code> como parte del estándar de ES6 ({{bug(1127827)}}).</li>
-</ul>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("WeakMap")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakmap/get/index.html b/files/es/web/javascript/referencia/objetos_globales/weakmap/get/index.html
deleted file mode 100644
index e60e34f8f1..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakmap/get/index.html
+++ /dev/null
@@ -1,80 +0,0 @@
----
-title: WeakMap.prototype.get()
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/get
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Method
-  - Prototype
-  - WeakMap
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/get
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>get()</strong></code> devuelve un elemento específico del objeto <code>WeakMap</code>.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/weakmap-prototype-get.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>wm</em>.get(key);</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>key</dt>
- <dd>Requerido. Es la llave del elemento a retornar desde el objeto WeakMap.</dd>
-</dl>
-
-<h3 id="Valores_devueltos">Valores devueltos</h3>
-
-<p>El elemento asociado con la llave específica en el objeto WeakMap. Si la llave no está presente, devolverá {{jsxref("undefined")}}.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_método_get">Usando el método <code>get</code> </h3>
-
-<pre class="brush: js">var wm = new WeakMap();
-wm.set(window, 'foo');
-
-wm.get(window); // Devuelve "foo".
-wm.get('baz');  // Devuelve undefined.
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-weakmap.prototype.get', 'WeakMap.prototype.get')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.get', 'WeakMap.prototype.get')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.WeakMap.get")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("WeakMap")}}</li>
- <li>{{jsxref("WeakMap.set()")}}</li>
- <li>{{jsxref("WeakMap.has()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakmap/has/index.html b/files/es/web/javascript/referencia/objetos_globales/weakmap/has/index.html
deleted file mode 100644
index dd978ede16..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakmap/has/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: WeakMap.prototype.has()
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/has
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Method
-  - Protocols
-  - WeakMap
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/has
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>has()</strong></code> devuelve un boleano indicando ya sea, si el elemento con la llave específica existe o no en el objeto <code>WeakMap</code>.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/weakmap-prototype-has.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>wm</em>.has(key);</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>identificador (key)</dt>
- <dd>Requerido. La llave del elemento a comprobar en el objeto <code>WeakMap</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<dl>
- <dt>Boolean</dt>
- <dd>Devuelve <code>true</code> si el elemento con la llave específica existe en el objeto <code>WeakMap</code>; de no encontrarse, devolverá <code>false</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilización_del_método_has">Utilización del método <code>has</code> </h3>
-
-<pre class="brush: js">var wm = new WeakMap();
-wm.set(window, 'foo');
-
-wm.has(window); // Devuelve true
-wm.has('baz');  // Devuelve false
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-weakmap.prototype.has', 'WeakMap.prototype.has')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.has', 'WeakMap.prototype.has')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.WeakMap.has")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("WeakMap")}}</li>
- <li>{{jsxref("WeakMap.prototype.set()")}}</li>
- <li>{{jsxref("WeakMap.prototype.get()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakmap/index.html b/files/es/web/javascript/referencia/objetos_globales/weakmap/index.html
deleted file mode 100644
index 0fed17e5ca..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakmap/index.html
+++ /dev/null
@@ -1,278 +0,0 @@
----
-title: WeakMap
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - WeakMap
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>WeakMap</code></strong> es una colección de pares clave/valor en la que las claves son objetos y los valores son valores arbitrarios.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><code>new WeakMap([iterable])
-</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>iterable</code></dt>
- <dd>Iterable es un Array u otro objeto iterable cuyos elementos son pares clave-valor (Arrays de dos elementos). Cada par clave-valor será añadido al nuevo WeakMap. null es tratado como undefined.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las claves de los WeakMaps solamente pueden ser del tipo<code> Object</code>. Los {{Glossary("Primitive", "Primitive data types")}} como claves no están permitidos (ej. un {{jsxref("Symbol")}} no pueden ser una clave de <code>WeakMap</code>).</p>
-
-<h3 id="¿Por_qué_WeakMap">¿Por qué <em>Weak</em>Map?</h3>
-
-<p>El programador de JavaScript experimentado se habrá dado cuenta que esta API podría ser implementada en JavaScript con dos arrays (uno para las claves, otro para los valores) compartidos por los cuatro métodos de la API. Dicha implementación habría tenido dos inconvenientes principales: El primero es una búsqueda O(n) (siendo n el número de claves en el mapa). El segundo es un problema de pérdida de memoria. Con mapas escritos manualmente, el array de las claves mantendría referencias a la objetos clave, impidiéndoles ser recolectados. En los WeakMap nativos, las referencias a los objetos clave son mantenidas "débilmente", lo que quiere decir que no impiden la recolección de basura en caso de que no haya otras referencias al objeto.</p>
-
-<p>Dado que las referencias son débiles, <code>las claves de WeakMap</code> no son enumerables (ej: no existe un método que te devuelva la lista de las claves). Si existiera, la lista dependería de la recolección de basura, introduciendo indeterminismo. Si quieres una lista de las claves, se debe usar un  {{jsxref("Map")}} o mantenerla tu mismo.</p>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>WeakMap.length</code></dt>
- <dd>El valor de la propiedad <code>length</code> es 0.</dd>
- <dt>{{jsxref("WeakMap.prototype")}}</dt>
- <dd>Representa el prototipo para el nuevo constructor<code> WeakMap</code>. Permite añadir propiedades a todos los objetos <code>WeakMap</code>.</dd>
-</dl>
-
-<h2 id="Instancias_de_WeakMap"><code>Instancias de WeakMap</code></h2>
-
-<p>Todas las instancias de <code>WeakMap</code> heredan de {{jsxref("WeakMap.prototype")}}.</p>
-
-<h3 id="Propiedades_2">Propiedades</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','Properties')}}</p>
-
-<h3 id="Métodos">Métodos</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakMap/prototype','Methods')}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_WeakMap">Usando <code>WeakMap</code></h3>
-
-<pre class="brush: js notranslate">var wm1 = new WeakMap(),
-    wm2 = new WeakMap(),
-    wm3 = new WeakMap();
-var o1 = {},
-    o2 = function(){},
-    o3 = window;
-
-wm1.set(o1, 37);
-wm1.set(o2, "azerty");
-wm2.set(o1, o2); // un valor puede ser cualquier cosa, incluidos objetos o funciones
-wm2.set(o3, undefined);
-wm2.set(wm1, wm2); // claves y valores pueden ser objetos cualesquiera. !Incluso WeakMaps!
-
-wm1.get(o2); // "azerty"
-wm2.get(o2); // undefined, porque no hay valor para o2 en wm2
-wm2.get(o3); // undefined, porque es es el valor del conjunto
-wm1.has(o2); // true
-wm2.has(o2); // false
-wm2.has(o3); // true (incluso si el valor es 'undefined')
-
-wm3.set(o1, 37);
-wm3.get(o1); // 37
-
-wm1.has(o1);   // true
-wm1.delete(o1);
-wm1.has(o1);   // false
-
-</pre>
-
-<h3 id="Implementando_una_clase_tipo-WeakMap_con_un_método_.clear">Implementando una clase tipo-<code>WeakMap</code> con un método .clear()</h3>
-
-<p>Con propósito expositivo, el siguiente ejemplo usa el nuevo costruct class  de ECMAScript 2015, que actualmente no ha sido implementado de forma amplia.</p>
-
-<pre class="brush: js notranslate">class ClearableWeakMap {
-  constructor(init) {
-    this._wm = new WeakMap(init)
-  }
-  clear() {
-    this._wm = new WeakMap()
-  }
-  delete(k) {
-    return this._wm.delete(k)
-  }
-  get(k) {
-    return this._wm.get(k)
-  }
-  has(k) {
-    return this._wm.has(k)
-  }
-  set(k, v) {
-    this._wm.set(k, v)
-    return this
-  }
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('ES2015', '#sec-weakmap-objects', 'WeakMap')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (SpiderMonkey)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>36</td>
-   <td>{{CompatGeckoDesktop("6.0")}}</td>
-   <td>11</td>
-   <td>{{ CompatOpera(23) }}</td>
-   <td>7.1</td>
-  </tr>
-  <tr>
-   <td><code>new WeakMap(iterable)</code></td>
-   <td>38</td>
-   <td>{{CompatGeckoDesktop("36")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatOpera(25) }}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>clear()</code></td>
-   <td>36</td>
-   <td>{{CompatGeckoDesktop("20.0")}}</td>
-   <td>11</td>
-   <td>{{ CompatOpera(23) }}</td>
-   <td>7.1</td>
-  </tr>
-  <tr>
-   <td>Constructor argument: <code>new WeakMap(null)</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("37")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Monkey-patched <code>set()</code> in Constructor</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("37")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>WeakMap()</code> without <code>new</code> throws</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("42")}}</td>
-   <td>11</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (SpiderMonkey)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>35</td>
-   <td>{{CompatGeckoMobile("6.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>iOS 8</td>
-  </tr>
-  <tr>
-   <td><code>new WeakMap(iterable)</code></td>
-   <td>38</td>
-   <td>{{CompatGeckoMobile("36")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>clear()</code></td>
-   <td>35</td>
-   <td>{{CompatGeckoMobile("20.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>iOS 8</td>
-  </tr>
-  <tr>
-   <td>Constructor argument: <code>new WeakMap(null)</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("37")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Monkey-patched <code>set()</code> in Constructor</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("37")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>WeakMap()</code> without <code>new</code> throws</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("42")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td></td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"></h2>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=547941">WeakMap bug en Mozilla</a></li>
- <li><a href="http://fitzgeraldnick.com/weblog/53/">Ocultando los detalles de implementación con los WeakMaps de ECMAScript </a>2015</li>
- <li>{{jsxref("Map")}}</li>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("WeakSet")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakmap/prototype/index.html b/files/es/web/javascript/referencia/objetos_globales/weakmap/prototype/index.html
deleted file mode 100644
index 41d501135d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakmap/prototype/index.html
+++ /dev/null
@@ -1,143 +0,0 @@
----
-title: WeakMap.prototype
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/prototype
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Property
-  - WeakMap
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap
-translation_of_original: Web/JavaScript/Reference/Global_Objects/WeakMap/prototype
----
-<div>{{JSRef}}</div>
-
-<p>La propiedad <code><strong>WeakMap</strong></code><strong><code>.prototype</code></strong> representa el prototipo para el constructor {{jsxref("WeakMap")}}.</p>
-
-<div>{{js_property_attributes(0,0,0)}}</div>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las instancias de {{jsxref("WeakMap")}} heredan de {{jsxref("WeakMap.prototype")}}. Se puede usar el objeto prototipo del constructor para añadir propiedades o métodos para todas las instancias de  <code>WeakMap</code>.</p>
-
-<p><code>WeakMap.prototype</code> por si mismo es solamente un objeto ordinario:</p>
-
-<pre class="brush: js">Object.prototype.toString.call(WeakMap.prototype); // "[object Object]"</pre>
-
-<h2 id="Propiedades">Propiedades</h2>
-
-<dl>
- <dt><code>WeakMap.prototype.constructor</code></dt>
- <dd>Retorna la función que creó el prototipo de la instanciaReturns the function that created an instance's prototype. Esta es la función {{jsxref("WeakMap")}} por defecto.</dd>
-</dl>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("WeakMap.delete", "WeakMap.prototype.delete(key)")}}</dt>
- <dd>Remueve cualquier valor asociado a la clave. Después de esto <code>WeakMap.prototype.has(key)</code> retornará falso.</dd>
- <dt>{{jsxref("WeakMap.get", "WeakMap.prototype.get(key)")}}</dt>
- <dd>Retorna el valor asociado a la clave, o <code>undefined</code> si no hay ninguno.</dd>
- <dt>{{jsxref("WeakMap.has", "WeakMap.prototype.has(key)")}}</dt>
- <dd>Retorna un valor booleano indicando si hay un valor asociado a la clave en el objeto the <code>WeakMap</code> object o no.</dd>
- <dt>{{jsxref("WeakMap.set", "WeakMap.prototype.set(key, value)")}}</dt>
- <dd>Asigna el valor para la clave en el objeto <code>WeakMap</code>. Retorna el objeto <code>WeakMap</code>.</dd>
- <dt><s class="obsoleteElement">{{jsxref("WeakMap.prototype.clear()")}} {{obsolete_inline}}</s></dt>
- <dd><s class="obsoleteElement">Remueve todas los pares clave/valore del objeto <code>WeakMap</code>. Notese que es posible implementar un objeto parecido al <code>WeakMap</code> que posea un método <code>.clear()</code>, encapsulando el objeto <code>WeakMap</code> que no lo tiene (ver ejemplo en la página {{jsxref("WeakMap")}})</s></dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype', 'WeakMap.prototype')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>36</td>
-   <td>{{CompatGeckoDesktop("6.0")}}</td>
-   <td>11</td>
-   <td>23</td>
-   <td>7.1</td>
-  </tr>
-  <tr>
-   <td>Objeto ordinario</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("40")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatGeckoMobile("6.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>8</td>
-  </tr>
-  <tr>
-   <td>Objeto ordinario</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile("40")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Map.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakmap/set/index.html b/files/es/web/javascript/referencia/objetos_globales/weakmap/set/index.html
deleted file mode 100644
index 0dd654e6ef..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakmap/set/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: WeakMap.prototype.set()
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakMap/set
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Method
-  - Protocols
-  - WeakMap
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakMap/set
----
-<div>{{JSRef}}</div>
-
-<p>El método <code><strong>set()</strong></code> añade un nuevo elemento con su <code>key</code> y <code>value</code> específicos al objeto <code>WeakMap</code>.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/weakmap-prototype-set.html")}}</div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><em>wm</em>.set(key, value);</code></pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt>indentificador (key)</dt>
- <dd>Requerido. El identificador (objeto) del elemento a añadir al objeto <code>WeakMap</code>.</dd>
- <dt>valor (value)</dt>
- <dd>Requerido. El valor del elemento a añadir al objeto <code>WeakMap</code>.</dd>
-</dl>
-
-<h3 id="Valor_devuelto">Valor devuelto</h3>
-
-<p>El objeto <code>WeakMap</code>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilización_del_método_set">Utilización del método <code>set</code> </h3>
-
-<pre class="brush: js">var wm = new WeakMap();
-var obj = {};
-
-// Agregando nuevos elementos a WeakMap
-wm.set(obj, 'foo').set(window, 'bar'); // encadenamiento
-// Actualiza el un elemento en el objeto WeakMap
-wm.set(obj, 'baz');
-
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-weakmap.prototype.set', 'WeakMap.prototype.set')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-weakmap.prototype.set', 'WeakMap.prototype.set')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.builtins.WeakMap.set")}}</p>
-
-<h2 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h2>
-
-<ul>
- <li>Antes de Firefox 33 {{geckoRelease("33")}}, <code>WeakMap.prototype.set</code> devolvía  <code>undefined</code> y no permitía el encadenamiento. Esto ha sido corregido ({{bug(1031632)}}). Este comportamiento puede encontrarse también en Chrome/v8 (<a href="https://code.google.com/p/v8/issues/detail?id=3410">fallo</a>).</li>
-</ul>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("WeakMap")}}</li>
- <li>{{jsxref("WeakMap.prototype.get()")}}</li>
- <li>{{jsxref("WeakMap.prototype.has()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/weakset/index.html b/files/es/web/javascript/referencia/objetos_globales/weakset/index.html
deleted file mode 100644
index ab2af60090..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/weakset/index.html
+++ /dev/null
@@ -1,227 +0,0 @@
----
-title: WeakSet
-slug: Web/JavaScript/Referencia/Objetos_globales/WeakSet
-translation_of: Web/JavaScript/Reference/Global_Objects/WeakSet
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>WeakSet</code></strong>  te deja almacenar y mantener objectos debilmente en una colección.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"> new WeakSet([iterable]);</pre>
-
-<h3 id="Parametros">Parametros</h3>
-
-<dl>
- <dt>iterable</dt>
- <dd>Si un  <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">objeto interable </a>es pasado, todos sus elementos se agregarán al nuevo <code>WeakSet</code>. null es tratado como undefined.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p> </p>
-
-<p>Los objetos <code>WeakSet</code> son colecciones de objetos. Un objecto en <code>WeakSet</code> solo puede ser agregado una vez; Esto quiere decir que es unico en la coleccion <code>WeakSet.</code></p>
-
-<p>Las principales diferencias con el objeto {{jsxref("Set")}} son:</p>
-
-<ul>
- <li>A diferencia de  <code>Sets</code>, <code>WeakSets</code>  son <strong>solamente colecciones de objetos </strong>y no contienen valores arbitrarios de cualquier otro tipo.</li>
- <li>El <code>WeakSet</code>  es<em> débil</em>: Las referencias a objetos en la colección se mantienen débilmente.. Si ya no hay otra referencia a un objeto almacenado en el  <code>WeakSet</code>, ellos pueden ser removidos por el recolector de basura. Esto también significa que no hay ninguna lista de objetos almacenados en la colección. Los <code>WeakSets</code> no son enumerables.</li>
-</ul>
-
-<h2 id="Properties">Properties</h2>
-
-<dl>
- <dt><code>WeakSet.length</code></dt>
- <dd>El valor de la propiedad <code>length</code>  es 0.</dd>
- <dt>{{jsxref("WeakSet.prototype")}}</dt>
- <dd>Representa el prototipo para el constructor <code>Set</code> . Permite la adición de propiedades a todos los objetos WeakSet</dd>
-</dl>
-
-<h2 id="WeakSet_instances"><code>WeakSet</code> instances</h2>
-
-<p>Todas las instancias a <code>WeakSet</code> son heredadas de {{jsxref("WeakSet.prototype")}}.</p>
-
-<h3 id="Propiedades">Propiedades</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakSet/prototype','Properties')}}</p>
-
-<h3 id="Métodos">Métodos</h3>
-
-<p>{{page('en-US/Web/JavaScript/Reference/Global_Objects/WeakSet/prototype','Methods')}}</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_el_objetoWeakSet">Usando el objeto<code>WeakSet</code> </h3>
-
-<pre class="brush: js">var ws = new WeakSet();
-var obj = {};
-var foo = {};
-
-ws.add(window);
-ws.add(obj);
-
-ws.has(window); // true
-ws.has(foo);    // false, foo no fue agregado al conjunto
-
-ws.delete(window); // elimina window del conjunto
-ws.has(window);    // false, window fue eliminado
-</pre>
-
-<h2 id="Especificaciónes">Especificaciónes</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-weakset-objects', 'WeakSet')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-weakset-objects', 'WeakSet')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(36)}}</td>
-   <td>12</td>
-   <td>{{ CompatGeckoDesktop(34) }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatOpera(23) }}</td>
-   <td>{{CompatSafari(9)}}</td>
-  </tr>
-  <tr>
-   <td><code>new WeakSet(iterable)</code></td>
-   <td>38</td>
-   <td>12</td>
-   <td>{{ CompatGeckoDesktop(34) }}</td>
-   <td>{{CompatNo}}</td>
-   <td>25</td>
-   <td>{{CompatSafari(9)}}</td>
-  </tr>
-  <tr>
-   <td>Constructor argument: <code>new WeakSet(null)</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>12</td>
-   <td>{{CompatGeckoDesktop("37")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatSafari(9)}}</td>
-  </tr>
-  <tr>
-   <td>Monkey-patched <code>add()</code> in Constructor</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>12</td>
-   <td>{{CompatGeckoDesktop("37")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatSafari(9)}}</td>
-  </tr>
-  <tr>
-   <td>Obsolete clear() method removed</td>
-   <td>{{CompatChrome(43)}}</td>
-   <td>12</td>
-   <td>{{CompatGeckoDesktop(46)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera(30)}}</td>
-   <td>{{CompatSafari(9)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile(34) }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td><code>new WeakMap(iterable)</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatGeckoMobile(34) }}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Constructor argument: <code>new WeakSet(null)</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Monkey-patched <code>add()</code> in Constructor</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>9</td>
-  </tr>
-  <tr>
-   <td>Obsolete clear() method removed</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>9</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Tambien_ver">Tambien ver</h2>
-
-<ul>
- <li>{{jsxref("Map")}}</li>
- <li>{{jsxref("Set")}}</li>
- <li>{{jsxref("WeakMap")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/objetos_globales/webassembly/index.html b/files/es/web/javascript/referencia/objetos_globales/webassembly/index.html
deleted file mode 100644
index 80542d763d..0000000000
--- a/files/es/web/javascript/referencia/objetos_globales/webassembly/index.html
+++ /dev/null
@@ -1,120 +0,0 @@
----
-title: WebAssembly
-slug: Web/JavaScript/Referencia/Objetos_globales/WebAssembly
-tags:
-  - API
-  - Experimental
-  - JavaScript
-  - Objeto
-  - Referencia
-  - WebAssembly
-translation_of: Web/JavaScript/Reference/Global_Objects/WebAssembly
----
-<div>{{JSRef}}</div>
-
-<p>El objeto <strong><code>WebAssembly</code></strong> de JavaScript actua como un namespace para todas las funcionalidades realcionados con <a href="/en-US/docs/WebAssembly">WebAssembly</a>.</p>
-
-<p>A diferencia de otros objetos globales, <code>WebAssembly</code> no tiene un constructor (no tiene una función para crear el objeto). Puedes ser comparado con el objeto {{jsxref("Math")}}, que también es un namespace, para funciones y constantes matemáticas, o también con {{jsxref("Intl")}} que es un namespace para internacionalización y otras funciones de idioma.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los usos primarios para el objeto <code>WebAssembly</code> son:</p>
-
-<ul>
- <li>Cargar código WebAssembly, utilizando la función {{jsxref("WebAssembly.instantiate()")}}.</li>
- <li>Crear nuevas instancias de memoria y de tablas mediante los constructores {{jsxref("WebAssembly.Memory()")}}/{{jsxref("WebAssembly.Table()")}}.</li>
- <li>Facilitar el manejo de errores que ocurren dentro de un WebAssembly mediante los constructores:{{jsxref("WebAssembly.CompileError()")}}/{{jsxref("WebAssembly.LinkError()")}}/{{jsxref("WebAssembly.RuntimeError()")}}.</li>
-</ul>
-
-<h2 id="Métodos">Métodos</h2>
-
-<dl>
- <dt>{{jsxref("WebAssembly.instantiate()")}}</dt>
- <dd>El API primaria para compilar e instanciar código WebAssembly, ambos regresan un <code>Module</code> y el primero <code>Instance</code>.</dd>
- <dt>{{jsxref("WebAssembly.instantiateStreaming()")}}</dt>
- <dd>Compila e instancia un módulo WebAssembly directamente desde un flujo de origen subyacente, ambos regresan un <code>Module</code> y el primero <code>Instance</code>.</dd>
- <dt>{{jsxref("WebAssembly.compile()")}}</dt>
- <dd>Compila un {{jsxref("WebAssembly.Module")}} desde el código binario de un WebAssembly, manteniendo la creación de la instancia como un objeto separado.</dd>
- <dt>{{jsxref("WebAssembly.compileStreaming()")}}</dt>
- <dd>compila un {{jsxref("WebAssembly.Module")}} directamente desde un flujo de origen subyacente, manteniendo la creación de la instancia como un objeto sepraado.</dd>
- <dt>{{jsxref("WebAssembly.validate()")}}</dt>
- <dd>Valida un arreglo con tipo de código binario de un WebAssembly, regresando si los bytes son código válido WebAssembly (<code>true</code>) o de lo contrario (<code>false</code>).</dd>
-</dl>
-
-<h2 id="Constructores">Constructores</h2>
-
-<dl>
- <dt>{{jsxref("WebAssembly.Module()")}}</dt>
- <dd>Crea un nuevo objeto WebAssembly <code>Module</code>.</dd>
- <dt>{{jsxref("WebAssembly.Instance()")}}</dt>
- <dd>Crear un nuevo objeto WebAssembly <code>Instance</code>.</dd>
- <dt>{{jsxref("WebAssembly.Memory()")}}</dt>
- <dd>Crear un nuevo objeto WebAssembly <code>Memory</code>.</dd>
- <dt>{{jsxref("WebAssembly.Table()")}}</dt>
- <dd>Crear un nuevo objeto WebAssembly <code>Table</code>.</dd>
- <dt>{{jsxref("WebAssembly.CompileError()")}}</dt>
- <dd>Crear un nuevo objeto WebAssembly <code>CompileError</code>.</dd>
- <dt>{{jsxref("WebAssembly.LinkError()")}}</dt>
- <dd>Crear un nuevo objeto WebAssembly <code>LinkError</code>.</dd>
- <dt>{{jsxref("WebAssembly.RuntimeError()")}}</dt>
- <dd>Crear un nuevo objeto WebAssembly <code>RuntimeError</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Después de obtener algún bytecode de WebAssembly usando la sentencia fetch, nosotros compilamos e instanciamos el módulo usando la función {{jsxref("WebAssembly.instantiate()")}} , importando una función de JavaScript en el WebAssembly Module en el proceso. Esta premisa resuelve a un objeto (<code>result</code>) que contenga un objeto <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Module">Module</a></code> compilado y un objeto <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/WebAssembly/Instance">Instance</a></code> . Entonces tenemos una llamada a <a href="/en-US/docs/WebAssembly/Exported_functions">Exported WebAssembly function</a> que es exportada por <code>Instance</code>.</p>
-
-<pre class="brush: js">var importObject = {
-  imports: {
-    imported_func: function(arg) {
-      console.log(arg);
-    }
-  }
-};
-
-fetch('simple.wasm').then(response =&gt;
-  response.arrayBuffer()
-).then(bytes =&gt;
-  WebAssembly.instantiate(bytes, importObject)
-).then(result =&gt;
-  result.instance.exports.exported_func()
-);</pre>
-
-<div class="note">
-<p><strong>Nota</strong>: Ver <a href="https://github.com/mdn/webassembly-examples/blob/master/js-api-examples/index.html">index.html</a> en GitHub (<a href="https://mdn.github.io/webassembly-examples/js-api-examples/">view it live also</a>) para un ejemplo que hace uso de la función <code><a href="https://github.com/mdn/webassembly-examples/blob/master/wasm-utils.js#L1">fetchAndInstantiate()</a></code>.</p>
-</div>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('WebAssembly JS', '#the-webassembly-object', 'WebAssembly')}}</td>
-   <td>{{Spec2('WebAssembly JS')}}</td>
-   <td>Definición inicial del borrador.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidad de Navegadores</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad en esta página es generado desde datos estructurados. Si deseas contribuir a esta información, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envía una solicitud.</div>
-
-<p>{{Compat("javascript.builtins.WebAssembly")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/WebAssembly">Vista General de WebAssembly</a></li>
- <li><a href="/en-US/docs/WebAssembly/Concepts">Conceptos de WebAssembly </a></li>
- <li><a href="/en-US/docs/WebAssembly/Using_the_JavaScript_API">Uso de la API de JavaScript de WebAssembly </a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/adición/index.html b/files/es/web/javascript/referencia/operadores/adición/index.html
deleted file mode 100644
index 888845158a..0000000000
--- a/files/es/web/javascript/referencia/operadores/adición/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Adición (+)
-slug: Web/JavaScript/Referencia/Operadores/Adición
-translation_of: Web/JavaScript/Reference/Operators/Addition
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de adición (<code>+</code>) produce la suma de operandos numéricos o la concatenación de (cadenas) string.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-addition.html")}}</div>
-
-<div></div>
-
-<p class="hidden">La fuente para este ejemplo interactivo está almacenado en un repositorio Github. Si te gustaría contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envianos una pull-request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><strong>Operator:</strong> <var>x</var> + <var>y</var>
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Adición_numérica">Adición numérica</h3>
-
-<pre class="brush: js notranslate">// Número + Número -&gt; adición
-1 + 2 // 3
-
-// Booleano + Número -&gt; adición
-true + 1 // 2
-
-// Booleano + Booleano -&gt; adición
-false + false // 0
-</pre>
-
-<h3 id="Concatenación_de_cadenas_String">Concatenación de (cadenas) String</h3>
-
-<pre class="brush: js notranslate">// String + String -&gt; concatenación
-'fut' + 'bol' // "futbol"
-
-// Número + String -&gt; concatenación
-5 + 'oh' // "5oh"
-
-// String + Booleano -&gt; concatenación
-'fut' + false // "futfalse"</pre>
-
-<h2 id="Especificación">Especificación</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-addition-operator-plus', 'Addition operator')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_Explorador">Compatibilidad de Explorador</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si quieres contribuir a estos datos, por favor revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envía un pull request.</div>
-
-<p>{{Compat("javascript.operators.addition")}}</p>
-
-<h2 id="También_revisa">También revisa</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/aritméticos/index.html b/files/es/web/javascript/referencia/operadores/aritméticos/index.html
deleted file mode 100644
index 71968fda85..0000000000
--- a/files/es/web/javascript/referencia/operadores/aritméticos/index.html
+++ /dev/null
@@ -1,315 +0,0 @@
----
-title: Operadores Aritméticos
-slug: Web/JavaScript/Referencia/Operadores/Aritméticos
-tags:
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators
-translation_of_original: Web/JavaScript/Reference/Operators/Arithmetic_Operators
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>Los operadores Aritméticos toman valores numéricos (ya sean literales o variables) como sus operandos y retornan un valor numérico único. Los operadores aritméticos estándar son adición o suma (+), sustracción o resta (-), multiplicación (*), y división (/).</p>
-
-<p>Estos operadores trabajan al igual que en la mayoría de otros lenguajes de programacion, excepto el operador /, que retorna una división de punto flotante en JavaScript, no una división truncada como en lenguajes tales como C o Java. Por ejemplo:</p>
-
-<p>{{EmbedInteractiveExample("pages/js/expressions-arithmetic.html")}}</p>
-
-<h2 id="Suma_o_adición_()"><a name="Addition">Suma o adición (+)</a></h2>
-
-<p>La operación suma se produce mediante la suma de número o strings concatenados.</p>
-
-<h3 id="Sintaxis">Sintaxis</h3>
-
-<pre class="brush: js"><strong>Operador:</strong> x + y</pre>
-
-<h3 id="Ejemplos">Ejemplos:</h3>
-
-<pre class="brush: js">// Número + Número = Adición
-
-1 + 2 // 3
-
-// Bolean + Número = Adición
-
-true + 1 // 2
-
-// Bolean + Bolean // Adición
-
-false + false // 0
-
-// Número + String = Concatenación
-
-5 + 'foo' // "5foo"
-
-// String + Bolean = Concatenación
-
-'foo' + true // "footrue"
-
-// String + String = Concatenación
-
-'foo' + 'bar' // "foobar"
-</pre>
-
-<h2 id="Resta_o_sustracción_(-)"><a name="Subtraction">Resta o sustracción (-)</a></h2>
-
-<p>La resta se produce cuando se sutraen el resultado de los operadores, produciendo su diferencia.</p>
-
-<h3 id="Sintaxis_2">Sintaxis</h3>
-
-<pre class="brush: js"><strong>Operador:</strong> x - y</pre>
-
-<h3 id="Ejemplos_2">Ejemplos</h3>
-
-<pre class="brush: js">5 - 3     // 2
-3 - 5     // -2
-'foo' - 3 // NaN
-</pre>
-
-<h2 id="División_()"><a name="Division">División (/)</a></h2>
-
-<p>El operador división se produce el cociente de la operación donde el operando izquierdo es el dividendo y el operando derecho es el divisor.</p>
-
-<h3 id="Sintaxis_3">Sintaxis</h3>
-
-<pre class="brush: js"><strong>Operador:</strong> x / y</pre>
-
-<h3 id="Ejemplos_3">Ejemplos</h3>
-
-<pre class="brush: js">1 / 2      // devuelve 0.5 en JavaScript
-1 / 2      // devuelve 0 en Java
-// (Ninguno de los números es explícitamente un número de punto flotante)
-
-1.0 / 2.0  // devuelve 0.5 en JavaScript y Java
-
-2.0 / 0    // devuelve Infinito en JavaScript
-2.0 / 0.0  // devuelve Infinito
-2.0 / -0.0 // devuelve -Infinito en JavaScript
-</pre>
-
-<h2 id="Multiplicación_(*)"><a name="Multiplication">Multiplicación (*)</a></h2>
-
-<p>El operador multiplicación produce el producto de la multiplicación de los operandos.</p>
-
-<h3 id="Sintaxis_4">Sintaxis</h3>
-
-<pre class="brush: js"><strong>Operador:</strong> x * y</pre>
-
-<h3 id="Ejemplos_4">Ejemplos</h3>
-
-<pre class="brush: js">2 * 2 // 4
--2 * 2 // -4
-Infinito * 0 // NaN
-Infinito * Infinito // Infinito
-'foo' * 2 // NaN</pre>
-
-<h2 id=".25_.28modular.29" name=".25_.28modular.29">Resto o Residuo  (%)</h2>
-
-<p>El operador resto devuelve el resto que queda cuando un operando se divide por un segundo operando. Siempre toma el signo del dividendo, no el divisor. Utiliza una función de <code>modulo</code> incorporada para producir el resultado, que es el resto entero de dividir <code>var1</code> por <code>var2</code> - por ejemplo - <code>var1</code> modulo <code>var2</code>. <a href="http://wiki.ecmascript.org/doku.php?id=strawman:modulo_operator">Existe una propuesta para obtener un operador de módulo real en una versión futura de ECMAScript</a>, con la diferencia de que el resultado del operador de módulo tomaría el signo del divisor, no el dividendo.</p>
-
-<h3 id="Sintaxis_5">Sintaxis</h3>
-
-<pre class="brush: js"><strong>Operador:</strong> var1 % var2</pre>
-
-<h3 id="Ejemplos_5">Ejemplos</h3>
-
-<pre class="brush: js">12 % 5  // 2
--1 % 2  // -1
-1 % -2  // 1
-NaN % 2 // NaN
-1 % 2   // 1
-2 % 3   // 2
--4 % 2  // -0
-5.5 % 2 // 1.5</pre>
-
-<h2 id="Exponenciación_(**)">Exponenciación (**)</h2>
-
-<p>El operador de exponenciación devuelve el resultado de elevar el primer operando al segundo operando de potencia. es decir, <code>var1<sup>var2</sup></code>, en la declaración anterior, donde <code>var1</code> y <code>var2</code> son variables. El operador de exponenciación es asociativo a la derecha. <code>a ** b ** c</code> es igual a <code>a ** (b ** c)</code>.</p>
-
-<h3 id="Sintaxis_6">Sintaxis</h3>
-
-<pre><strong>Operador:</strong> var1 ** var2</pre>
-
-<p> </p>
-
-<h3 id="Notas">Notas</h3>
-
-<p>En la mayoría de los lenguajes como PHP y Python y otros que tienen un operador de exponenciación (**), el operador de exponenciación se define para tener una precedencia más alta que los operadores unarios, como unario + y unario -, pero hay algunas excepciones. Por ejemplo, en Bash, el operador ** se define como de menor precedencia que los operadores unarios. En JavaScript, es imposible escribir una expresión de exponenciación ambigua, es decir, no se puede poner un operador unario (<code>+/-/~/!/delete/void/typeof</code>) inmediatamente antes del número de base.</p>
-
-<pre class="brush: js">-2 ** 2;
-// 4 en Bash, -4 en otros idiomas.
-// Esto no es válido en JavaScript, ya que la operación es ambigua.
-
-
--(2 ** 2);
-// -4 en JavaScript y la intención del autor no es ambigua.</pre>
-
-<h3 id="Ejemplos_6">Ejemplos</h3>
-
-<pre class="brush: js">2 ** 3        // 8
-3 ** 2        // 9
-3 ** 2.5      // 15.588457268119896
-10 ** -1      // 0.1
-NaN ** 2      // NaN
-
-2 ** 3 ** 2   // 512
-2 ** (3 ** 2) // 512
-(2 ** 3) ** 2 // 64</pre>
-
-<p>Para invertir el signo del resultado de una expresión de exponenciación:</p>
-
-<pre class="brush: js">-(2 ** 2) // -4</pre>
-
-<p>Para forzar la base de una expresión de exponenciación a ser un número negativo:</p>
-
-<pre class="brush: js">(-2) ** 2 // 4</pre>
-
-<div class="note">
-<p><strong>Nota:</strong> JavaScript también tiene <a href="/es/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#Bitwise_XOR">un operador bit a bit ^ (logical XOR)</a>. <code>**</code> y <code>^</code> son diferentes (por ejemplo: <code>2 ** 3 === 8</code> cuando <code>2 ^ 3 === 1</code>.)</p>
-</div>
-
-<p> </p>
-
-<h2 id=".2B.2B_.28incremento.29" name=".2B.2B_.28incremento.29">Incremento (++)</h2>
-
-<p> </p>
-
-<p>El operador de incremento incrementa (agrega uno a) su operando y devuelve un valor.</p>
-
-<ul>
- <li>Si se usa postfijo, con el operador después del operando (por ejemplo, x++), devuelve el valor antes de incrementar.</li>
- <li>Si se usa prefijo, con el operador antes del operando (por ejemplo, ++x), devuelve el valor después de incrementar.</li>
-</ul>
-
-<h3 id="Sintaxis_7">Sintaxis</h3>
-
-<pre><strong>Operador:</strong> x++ o ++x</pre>
-
-<h3 id="Ejemplos_7">Ejemplos</h3>
-
-<pre class="brush: js">// Postfijo
-var x = 3;
-y = x++; // y = 3, x = 4
-
-// Prefijo
-var a = 2;
-b = ++a; // a = 3, b = 3
-</pre>
-
-<h2 id="--_.28decremento.29" name="--_.28decremento.29">Decremento (--)</h2>
-
-<p>El operador de decremento disminuye (resta uno de) su operando y devuelve un valor.</p>
-
-<ul>
- <li>Si se usa postfijo (por ejemplo, x--), devuelve el valor antes de decrementar.</li>
- <li>Si usa el prefijo (por ejemplo, --x), entonces devuelve el valor después de decrementar.</li>
-</ul>
-
-<h3 id="Sintaxis_8">Sintaxis</h3>
-
-<pre><strong>Operador:</strong> x-- o --x</pre>
-
-<h3 id="Ejemplos_8">Ejemplos</h3>
-
-<pre class="brush: js">// Postfijo
-var x = 3;
-y = x--; // y = 3, x = 2
-
-// Prefijo
-var a = 2;
-b = --a; // a = 1, b = 1</pre>
-
-<p> </p>
-
-<h2 id="-_.28negaci.C3.B3n_unitario.29" name="-_.28negaci.C3.B3n_unitario.29">Negación unaria (-)</h2>
-
-<p>El operador de negación unaria precede su operando y lo niega.</p>
-
-<h3 id="Sintaxis_9">Sintaxis</h3>
-
-<pre><strong>Operador:</strong> -x</pre>
-
-<h3 id="Ejemplos_9">Ejemplos</h3>
-
-<pre class="brush: js">var x = 3;
-y = -x; // y = -3, x = 3
-
-// el operador de negación unario puede convertir no-números en un número
-var x = "4";
-y = -x; // y = -4</pre>
-
-<h2 id="Unario_más_()">Unario más (+)</h2>
-
-<p>El operador unario más precede su operando y evalúa su operando, pero intenta convertirlo en un número, si no lo está. Aunque la negación unaria (-) también puede convertir no números, unario plus es la manera más rápida y preferida de convertir algo en un número, porque no realiza ninguna otra operación en el número. Puede convertir representaciones de cadenas de enteros y flotantes, así como los valores que no sean cadenas <code>true</code>, <code>false</code> y <code>null</code>. Se admiten enteros en formato decimal y hexadecimal ("0x" -prefijado). Los números negativos son compatibles (aunque no para hexadecimal). Si no puede analizar un valor particular, evaluará a <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a>.</p>
-
-<h3 id="Sintaxis_10">Sintaxis</h3>
-
-<pre><strong>Operador:</strong> +x</pre>
-
-<h3 id="Ejemplos_10">Ejemplos</h3>
-
-<pre class="brush: js">+3     // 3
-+'3'   // 3
-+true  // 1
-+false // 0
-+null  // 0
-+function(val){  return val } // NaN</pre>
-
-<p> </p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.3')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>
-    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.6">Operadores aditivos</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.5">Operadores multiplicativos</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.3">Expresiones Postfijas</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4">Operadores unarios.</a></p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-postfix-expressions')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>
-    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-additive-operators">Operadores aditivos</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-multiplicative-operators">Operadores multiplicativos</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-postfix-expressions">Expresiones Postfijas</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-unary-operators">Operadores unarios.</a></p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2016', '#sec-postfix-expressions')}}</td>
-   <td>{{Spec2('ES2016')}}</td>
-   <td><a href="https://github.com/rwaldron/exponentiation-operator">Operador de exponenciación</a> agregado.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2017', '#sec-postfix-expressions')}}</td>
-   <td>{{Spec2('ES2017')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-additive-operators')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{Compat("javascript.operators.arithmetic")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Assignment_Operators">Operadores de Asignación</a></li>
-</ul>
-
-<p> </p>
diff --git a/files/es/web/javascript/referencia/operadores/asignacion/index.html b/files/es/web/javascript/referencia/operadores/asignacion/index.html
deleted file mode 100644
index 1fa4b79ac4..0000000000
--- a/files/es/web/javascript/referencia/operadores/asignacion/index.html
+++ /dev/null
@@ -1,62 +0,0 @@
----
-title: Asignacion (=)
-slug: Web/JavaScript/Referencia/Operadores/Asignacion
-tags:
-  - JS
-  - JavaScript
-  - Operador de Asignacion
-  - Operadores JavaScript
-  - Referências
-translation_of: Web/JavaScript/Reference/Operators/Assignment
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de asignación (=) se utiliza para asignar un valor a una variable. La operación de asignación evalúa el valor asignado. Es posible encadenar el operador de asignación para asignar un solo valor a múltiples variables</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-assignment.html")}}</div>
-
-<div></div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x = y
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Asignación">Asignación</h3>
-
-<pre class="brush: js notranslate">// Asumimos las siguientes variables
-//  x = 5
-//  n = 10
-//  z = 25
-
-x = n     // La variable x contiene el valor 10
-x = n = z // x = n (es decir 10) y z pisa el valor total remplazandolo por 25</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-assignment-operators', 'Assignment operators')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.assignment")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/Expressions_and_Operators#Assignment">Assignment operators in the JS guide</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/assignment_operators/index.html b/files/es/web/javascript/referencia/operadores/assignment_operators/index.html
deleted file mode 100644
index 979eff63f2..0000000000
--- a/files/es/web/javascript/referencia/operadores/assignment_operators/index.html
+++ /dev/null
@@ -1,462 +0,0 @@
----
-title: Operadores de asignación
-slug: Web/JavaScript/Referencia/Operadores/Assignment_Operators
-tags:
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators#Assignment_operators
-translation_of_original: Web/JavaScript/Reference/Operators/Assignment_Operators
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>Un <strong>operador de asignacion</strong> asigna un valor al operando de la izquierda basado en el valor del operando de la derecha.</p>
-
-<h2 id="Visión_general"><span class="short_text" id="result_box" lang="es"><span>Visión general</span></span></h2>
-
-<p>El operador de asignación basico es el igual (<code>=</code>), el cual asigna el valor del operando derecho al operando izquierdo. Es decir, x = y asigna el valor de y a x. El otro operador de asignacion son usualmente son abreviaciones para operaciones estandar, como se muestra en las siguientes definiciones y ejemplos.</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Nombres</th>
-   <th>Abreviaciones</th>
-   <th>Significado</th>
-  </tr>
-  <tr>
-   <td><a href="#Assignment">Asignación</a></td>
-   <td><code>x = y</code></td>
-   <td><code>x = y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Addition_assignment">Asignación de adición</a></td>
-   <td><code>x += y</code></td>
-   <td><code>x = x + y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Subtraction_assignment">Asignación de sustracción</a></td>
-   <td><code>x -= y</code></td>
-   <td><code>x = x - y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Subtraction_assignment">Asignación de multiplicación</a></td>
-   <td><code>x *= y</code></td>
-   <td><code>x = x * y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Subtraction_assignment">Asignación de división</a></td>
-   <td><code>x /= y</code></td>
-   <td><code>x = x / y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Remainder_assignment">Asignación de Resto</a></td>
-   <td><code>x %= y</code></td>
-   <td><code>x = x % y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Exponentiation_assignment">Asignación de exponenciación</a></td>
-   <td><code>x **= y</code></td>
-   <td><code>x = x ** y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Left_shift_assignment">Asignación de desplazamiento a la izquierda</a></td>
-   <td><code>x &lt;&lt;= y</code></td>
-   <td><code>x = x &lt;&lt; y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Left_shift_assignment">Asignación de desplazamiento a la derecha</a></td>
-   <td><code>x &gt;&gt;= y</code></td>
-   <td><code>x = x &gt;&gt; y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Unsigned_right_shift_assignment">Asignación sin signo de desplazamiento a la derecha</a></td>
-   <td><code>x &gt;&gt;&gt;= y</code></td>
-   <td><code>x = x &gt;&gt;&gt; y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_AND_assignment">Asignacion AND</a></td>
-   <td><code>x &amp;= y</code></td>
-   <td><code>x = x &amp; y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_XOR_assignment">Asignacion XOR</a></td>
-   <td><code>x ^= y</code></td>
-   <td><code>x = x ^ y</code></td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_XOR_assignment">Asignacion OR</a></td>
-   <td><code>x |= y</code></td>
-   <td><code>x = x | y</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Asignación"><a name="Assignment">Asignación</a></h2>
-
-<p>Operador de asignación simple que asigna un valor a una variable. EL operador de asignación evalua al valor asignado. Encadenando el operador de asignación es posible en orden de asignar un solo valor a multiples variables. Vea el ejemplo.</p>
-
-<h3 id="Sintaxis">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x = y
-</pre>
-
-<h3 id="Ejemplos">Ejemplos</h3>
-
-<pre class="brush: js notranslate">// Asumiendo las siguientes variables
-//  x = 5
-//  y = 10
-//  z = 25
-
-
-x = y     // x es 10
-x = y = z // x, y, z son todas 25
-</pre>
-
-<h2 id="Asignación_de_Adición"><a name="Addition_assignment">Asignación de Adición</a></h2>
-
-<p>El operador de asignación de suma <strong>agrega</strong> el valor del operando derecho a la variable y le asigna el resultado a la variable. Los dos tipos de operandos determinan el comportamiento del operador de asignación de adición. Adición o concatenación es posible. Mira el {{jsxref("Operators/Arithmetic_Operators", "operador de adición", "#Addition", 1)}} para más detalles.</p>
-
-<h3 id="Sintaxis_2">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x += y
-<strong>Significado:</strong>  x  = x + y
-</pre>
-
-<h3 id="Ejemplos_2">Ejemplos</h3>
-
-<pre class="brush: js notranslate">// Asuma las siguientes variables
-//  foo = "foo"
-//  bar = 5
-//  baz = true
-
-
-// Number + Number -&gt; Adición
-bar += 2 // 7
-
-// Boolean + Number -&gt; Adición
-baz += 1 // 2
-
-// Boolean + Boolean -&gt; Adición
-baz += false // 1
-
-// Number + String -&gt; concatenación
-bar += "foo" // "5foo"
-
-// String + Boolean -&gt; concatenación
-foo += false // "foofalse"
-
-// String + String -&gt; concatenación
-foo += "bar" // "foobar"
-</pre>
-
-<h2 id="Asignación_de_Sustracción"><a name="Subtraction_assignment">Asignación de Sustracción</a></h2>
-
-<p>El operador de asignación de sustracción <strong>sustrae </strong>el valor del operador derecho desde la variable y asigna el resultado a la variable. Mira el {{jsxref("Operators/Arithmetic_Operators", "operador de sustracción", "#Subtraction", 1)}} para mas detalles.</p>
-
-
-
-<h4 id="Sintaxis_3">Sintaxis</h4>
-
-
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x -= y
-<strong>Significado:</strong>  x  = x - y
-</pre>
-
-<h4 id="Ejemplos_3">Ejemplos</h4>
-
-<pre class="brush: js notranslate">// Asumiendo las siguientes variables
-//  bar = 5
-
-bar -= 2     // 3
-bar -= "foo" // NaN
-</pre>
-
-<h2 id="Asignación_de_Multiplicación">Asignación de Multiplicación </h2>
-
-<p>El operador de asignación de multiplicación <strong>multiplica </strong>la variable por el valor del operando derecho y asigna el resultado a la variable. Vea el  {{jsxref("Operators/Arithmetic_Operators", "Operador de Multiplicación", "#Multiplication", 1)}} para mas detalles.</p>
-
-<h3 id="Sintaxis_4">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x *= y
-<strong>Significado:</strong>  x  = x * y
-</pre>
-
-<h3 id="Ejemplos_4">Ejemplos</h3>
-
-<pre class="brush: js notranslate">// Asumiendo la siguiente variable
-//  bar = 5
-
-bar *= 2     // 10
-bar *= "foo" // NaN
-</pre>
-
-<h2 id="Asignación_de_división"><a name="Division_assignment">Asignación de división</a></h2>
-
-<p>El operador de asignación de división <strong>divide </strong>la variable por el valor del operando derecho y asigna el resultado a la variable. Vea el {{jsxref("Operators/Arithmetic_Operators", "operador de división", "#Division", 1)}} para mas detalles.</p>
-
-<h3 id="Sintaxis_5">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x /= y
-<strong>Significado:</strong>  x  = x / y
-</pre>
-
-<h3 id="Ejemplos_5">Ejemplos</h3>
-
-<pre class="brush: js notranslate">// Asumiendo la siguiente variable
-//  bar = 5
-
-bar /= 2     // 2.5
-bar /= "foo" // NaN
-bar /= 0     // Infinity
-</pre>
-
-<h2 id="Asignación_de_resto"><a name="Remainder_assignment">Asignación  de resto</a></h2>
-
-<p>El operador de asignación de resto <strong>divide </strong>la variable por el valor del operador derecho y asigna el <strong>resto </strong>a la variable. Vea el {{jsxref("Operators/Arithmetic_Operators", "Operador de resto", "#Remainder", 1)}} para mas detelles.</p>
-
-<h3 id="Sintaxis_6">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x %= y
-<strong>Significado:</strong>  x  = x % y
-</pre>
-
-<h3 id="Ejemplos_6">Ejemplos</h3>
-
-<pre class="brush: js notranslate">// Asumiendo la siguiente variable
-//  bar = 5
-
-bar %= 2     // 1
-bar %= "foo" // NaN
-bar %= 0     // NaN
-</pre>
-
-<h2 id="Asignación_de_exponenciación"><a id="Exponentiation_assignment" name="Exponentiation_assignment"></a>Asignación de <span id="result_box" lang="es"><span>exponenciación</span></span></h2>
-
-<p>El operador de asignación de exponente evalua el resultado de elevar primero el operando a la <strong>potencia </strong>del segundo operando. Vea el {{jsxref("Operators/Bitwise_Operators", "operador de exponenciación", "#Left_shift", 1)}}para mas detalles</p>
-
-<h3 id="Sintaxis_7">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x **= y
-<strong>Significado:</strong>  x  = x ** y
-</pre>
-
-<h3 id="Ejemplos_7">Ejemplos</h3>
-
-<pre class="brush: js notranslate">// Asumiendo la siguiente variable
-//  bar = 5
-
-bar **= 2     // 25
-bar **= "foo" // NaN</pre>
-
-<h2 id="Asignación_de_desplazamiento_a_la_izquierda"><a name="Left_shift_assignment">Asignación de desplazamiento a la izquierda</a></h2>
-
-<p>El operador de asignación de desplazamiento a la izquierda mueve una cantidad especifica de bits a la izquierda y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador de desplazamiento a la izquierda", "#Left_shift", 1)}} para mas detalles.</p>
-
-<h3 id="Sintaxis_8">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &lt;&lt;= y
-<strong>Significado:</strong>  x   = x &lt;&lt; y
-</pre>
-
-<h3 id="Ejemplos_8">Ejemplos</h3>
-
-<pre class="brush: js notranslate">var bar = 5; //  (00000000000000000000000000000101)
-bar &lt;&lt;= 2; // 20 (00000000000000000000000000010100)
-</pre>
-
-<h2 id="Asignación_de_desplazamiento_a_la_derecha"><a name="Right_shift_assignment">Asignación de desplazamiento a la derecha</a></h2>
-
-<p>El operador de asignación de desplazamiento a la derecha mueve una cantidad especifica de bits a la derecha y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador de desplazamiento a la derecha", "#Right_shift", 1)}} para mas detalles.</p>
-
-<h3 id="Sintaxis_9">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &gt;&gt;= y
-<strong>Significado:</strong>  x   = x &gt;&gt; y
-</pre>
-
-<h3 id="Ejemplos_9">Ejemplos</h3>
-
-<pre class="brush: js notranslate">var bar = 5; //   (00000000000000000000000000000101)
-bar &gt;&gt;= 2;   // 1 (00000000000000000000000000000001)
-
-var bar -5; //    (-00000000000000000000000000000101)
-bar &gt;&gt;= 2;  // -2 (-00000000000000000000000000000010)
-</pre>
-
-<h2 id="Asignación_sin_signo_de_desplazamiento_a_la_derecha"><a name="Unsigned_right_shift_assignment">Asignación sin signo de desplazamiento a la derecha</a></h2>
-
-<p>El operador de asignación sin signo de desplazamiento a la derecha mueve una cantidad especifica de bits a la derecha y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador sin signo de desplazamiento a la derecha", "#Unsigned_right_shift", 1)}} para mas detalles.</p>
-
-<h3 id="Sintaxis_10">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &gt;&gt;&gt;= y
-<strong>Significado:</strong>  x    = x &gt;&gt;&gt; y
-</pre>
-
-<h3 id="Ejemplo">Ejemplo</h3>
-
-<pre class="brush: js notranslate">var bar = 5; //   (00000000000000000000000000000101)
-bar &gt;&gt;&gt;= 2;  // 1 (00000000000000000000000000000001)
-
-var bar = -5; // (-00000000000000000000000000000101)
-bar &gt;&gt;&gt;= 2; // 1073741822 (00111111111111111111111111111110)</pre>
-
-<h2 id="Asignación_AND"><a name="Bitwise_AND_assignment">Asignación AND</a></h2>
-
-<p>El operador de asignacion AND usa la representación binaria de ambos operandos, hace una operacion AND en ellos y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador AND", "#Bitwise_AND", 1)}} para mas detalles.</p>
-
-<h3 id="Sintaxis_11">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x &amp;= y
-<strong>Significado:</strong>  x  = x &amp; y
-</pre>
-
-<h3 id="Ejemplo_2">Ejemplo</h3>
-
-<pre class="brush: js notranslate">var bar = 5;
-// 5:     00000000000000000000000000000101
-// 2:     00000000000000000000000000000010
-bar &amp;= 2; // 0
-</pre>
-
-<h2 id="Asignación_XOR"><a name="Bitwise_XOR_assignment">Asignación XOR</a></h2>
-
-<p>El operador de asignacion XOR usa la representación binaria de ambos operandos, hace una operacion XOR en ellos y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador XOR", "#Bitwise_XOR", 1)}} para mas detalles</p>
-
-<h3 id="Sintaxis_12">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x ^= y
-<strong>Significado:</strong>  x  = x ^ y
-</pre>
-
-<h3 id="Ejemplo_3">Ejemplo</h3>
-
-<pre class="brush: js notranslate">var bar = 5;
-bar ^= 2; // 7
-// 5: 00000000000000000000000000000101
-// 2: 00000000000000000000000000000010
-// -----------------------------------
-// 7: 00000000000000000000000000000111
-</pre>
-
-<h2 id="Asignación_OR"><a name="Bitwise_OR_assignment">Asignación OR</a></h2>
-
-<p>El operador de asignacion OR usa la representación binaria de ambos operandos, hace una operacion OR en ellos y asigna el resultado a la variable. Vea el {{jsxref("Operators/Bitwise_Operators", "operador OR", "#Bitwise_XOR", 1)}} para mas detalles</p>
-
-<h3 id="Sintaxis_13">Sintaxis</h3>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> x |= y
-<strong>Significado:</strong>  x  = x | y
-</pre>
-
-<h3 id="Ejemplo_4">Ejemplo</h3>
-
-<pre class="brush: js notranslate">var bar = 5;
-bar |= 2; // 7
-// 5: 00000000000000000000000000000101
-// 2: 00000000000000000000000000000010
-// -----------------------------------
-// 7: 00000000000000000000000000000111
-</pre>
-
-<h2 id="Ejemplos_10">Ejemplos</h2>
-
-<h3 id="Operador_izquierdo_con_otros_operadores_de_asignación">Operador izquierdo con otros operadores de asignación</h3>
-
-<p>En situaciones inusuales, el operador de asignacion (e.g x += y) no es identico al significado de la expresión (aca x = x + y). Cuando el operando izquierdo de un mismo operador de asignación contiene un operador de asignaciónm el operando izquierdo es evaluado una vez. por ejemplo:</p>
-
-<pre class="brush: js notranslate">a[i++] += 5         // i es evaluado una vez
-a[i++] = a[i++] + 5 // i es evaluado dos veces
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-assignment-operators', 'Operadores de asignación')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-assignment-operators', 'Operadores de asignación')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.13', 'Operadores de asignación')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-11.13', 'Operadores de asignación')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>
-    <p>Definición inicial</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte basico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_tambien">Vea tambien</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators">Operadores Aritméticos</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/async_function/index.html b/files/es/web/javascript/referencia/operadores/async_function/index.html
deleted file mode 100644
index 12e76e6ce5..0000000000
--- a/files/es/web/javascript/referencia/operadores/async_function/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: Expresión de función asíncrona
-slug: Web/JavaScript/Referencia/Operadores/async_function
-tags:
-  - Expresión Primaria
-  - JavaScript
-  - Operador
-  - función
-translation_of: Web/JavaScript/Reference/Operators/async_function
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>La palabra clave <strong><code>async function</code></strong> puede ser utilizada para definir funciones <code>async</code> dento de expresiones.</p>
-
-<p>También se pueden definir funciones asíncronas utilizando un<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function" title="The async function keyword can be used to define async functions inside expressions."> enunciado de función asíncrona</a>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">async function [nombre]([<var>param1</var>[, <var>param2</var>[, ..., <var>paramN</var>]]]) {
-   <var>enunciados</var>
-}</pre>
-
-<p>A partir de ES2015 (ES6), también se pueden emplear <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">funciones flecha.</a></p>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>name</var></code></dt>
- <dd>El nombre de la función. Puede ser omitida, en cuy caso la función es <em>anónima</em>. El nombre es sólo local al cuerpo de la función The name is only local to the function body.</dd>
- <dt><code><var>paramN</var></code></dt>
- <dd>El nombre de un argumento a ser pasado a la función.</dd>
- <dt><code><var>statements</var></code></dt>
- <dd>Los enunciados que componen el cuerpo de la función.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Una expresión <code>async function</code> es miuy similar, y casi tiene la misma sintaxis que, una {{jsxref('Statements/async_function', 'async function statement')}}. La principal diferencia entre una expresión <code>async function</code> y un enunciado <code>async function</code> es el <em>nombre de la función</em>, que puede ser omitido en una expresión <code>async function</code> para crear funciones <em>anonymous</em>. Una expresión <code>async function</code> puede ser utilizada como un {{Glossary("IIFE")}} (Expresión de función inmediatamente invocada, Immediately Invoked Function Expression) que se ejecuta tan rápido como es definida. Ver el capítulo sobre <a href="/en-US/docs/Web/JavaScript/Reference/Functions">funciones</a> para tener más información.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_sencillo">Ejemplo sencillo</h3>
-
-<pre class="brush: js">function resuelve2SegundosDespues(x) {
-  return new Promise(resolve =&gt; {
-    setTimeout(() =&gt; {
-      resolve(x);
-    }, 2000);
-  });
-};
-
-
-const agregar= async function(x) { // Expresión de una función asíncrona asignada a una variable
-  let a = await resuelve2SegundosDespues(20);
-  let b = await resuelve2SegundosDespues(30);
-  return x + a + b;
-};
-
-agregar(10).then(v =&gt; {
-  console.log(v);  // imprime 60 después de 4 segundos.
-});
-
-
-(async function(x) { // expresión de una función asíncrona utilizada como una IIFE
-  let p_a = resuelve2SegundosDespues(20);
-  let p_b = resuelve2SegundosDespues(30);
-  return x + await p_a + await p_b;
-})(10).then(v =&gt; {
-  console.log(v);  // imprime 60 después de 2 segundos.
-});
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-async-function-definitions', 'async function')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_los_navegadores">Compatibilidad de los navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.operators.async_function_expression")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Statements/async_function", "async function")}}</li>
- <li>Objeto {{jsxref("AsyncFunction")}}</li>
- <li>{{jsxref("Operators/await", "await")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/await/index.html b/files/es/web/javascript/referencia/operadores/await/index.html
deleted file mode 100644
index d1a84251f1..0000000000
--- a/files/es/web/javascript/referencia/operadores/await/index.html
+++ /dev/null
@@ -1,102 +0,0 @@
----
-title: await
-slug: Web/JavaScript/Referencia/Operadores/await
-translation_of: Web/JavaScript/Reference/Operators/await
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<div>El operador <code>await</code> es usado para esperar a una {{jsxref("Promise")}}. Sólo puede ser usado dentro de una función {{jsxref("Statements/async_function", "async function")}}.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">[<em>rv</em>] = await <em>expression</em>;</pre>
-
-<dl>
- <dt><code>expression</code></dt>
- <dd>Una {{jsxref("Promise")}} o cualquier otro valor por el cual haya que esperar.</dd>
- <dt><code>rv</code></dt>
- <dd>
- <p>Regresa el valor terminado de la promesa o solamente un valor si no es una<code>Promise</code>.</p>
- </dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La expresión <code>await</code> provoca que la ejecución de una función <code>async</code> sea pausada hasta que una <code>Promise</code> sea terminada o rechazada, y regresa a la ejecución de la función <code>async</code> después del término. Al regreso de la ejecución, el valor de la expresión <code>await</code> es la regresada por una promesa terminada.</p>
-
-<p>Si la <code>Promise</code> es rechazada, el valor de la expresión <code>await</code> tendrá el valor de rechazo.</p>
-
-<p>Si el valor de la expresión seguida del operador <code>await</code>  no es una promesa, será convertido a una <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/resolve">resolved Promise</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Si una <code>Promise</code> se pasa a una expresión <code>await</code>, espera a que la <code>Promise</code> se resuelva y devuelve el valor resuelto.</p>
-
-<pre class="brush: js">function resolveAfter2Seconds(x) {
-  return new Promise(resolve =&gt; {
-    setTimeout(() =&gt; {
-      resolve(x);
-    }, 2000);
-  });
-}
-
-async function f1() {
-  var x = await resolveAfter2Seconds(10);
-  console.log(x); // 10
-}
-f1();
-</pre>
-
-<p>Si el valor no es una <code>Promise</code>, convierte el valor a una <code>Promise</code> resuelta, y espera por dicho valor.</p>
-
-<pre class="brush: js">async function f2() {
-  var y = await 20;
-  console.log(y); // 20
-}
-f2();</pre>
-
-<p>Si la <code>Promise</code> es rechazada, se lanza una excepción con dicho el valor.</p>
-
-<pre class="brush: js">async function f3() {
-  try {
-    var z = await Promise.reject(30);
-  } catch(e) {
-    console.log(e); // 30
-  }
-}
-f3();</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-async-function-definitions', 'async functions')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Initial definition in ES2017.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página es generada a partir de información estructurada. Si quisieras contribuir a esta información, por favor visita <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</div>
-
-<p>{{Compat("javascript.operators.await")}}</p>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Statements/async_function", "async function")}}</li>
- <li>{{jsxref("Operators/async_function", "async function expression")}}</li>
- <li>{{jsxref("AsyncFunction")}} object</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/bitwise_operators/index.html b/files/es/web/javascript/referencia/operadores/bitwise_operators/index.html
deleted file mode 100644
index c4276c1c95..0000000000
--- a/files/es/web/javascript/referencia/operadores/bitwise_operators/index.html
+++ /dev/null
@@ -1,722 +0,0 @@
----
-title: Operadores a nivel de bit
-slug: Web/JavaScript/Referencia/Operadores/Bitwise_Operators
-tags:
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators
-translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p><strong>Los operadores a nivel de bit </strong>tratan sus operandos como una secuencia de 32 bits (unos y ceros) en lugar de <a href="/es/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">números</a> decimales, hexadecimales u octales.  Por ejemplo, el número decimal nueve tiene una representación binaria de 1001. Los operadores a nivel de bit realizan las operaciones en esas representaciones binarias, pero los valores devueltos son los valores numéricos estándar de JavaScript.</p>
-
-<p>La siguiente tabla resume los operadores a nivel de bit de JavaScript:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>Operador</th>
-   <th>Uso</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_AND">AND binario</a></td>
-   <td><code>a &amp; b</code></td>
-   <td>Devuelve un uno en cada posición en la que ambos operandos sea uno.</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_OR">OR binario </a></td>
-   <td><code>a | b</code></td>
-   <td>Devuelve un uno en cada posición en la que uno o ambos operandos sea uno.</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_XOR">Bitwise XOR</a></td>
-   <td><code>a ^ b</code></td>
-   <td>Devuelve un uno en cada posición en la que los bits correspondientes en cada uno de los operandos, pero no en ambos, es uno. </td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_NOT">Bitwise NOT</a></td>
-   <td><code>~ a</code></td>
-   <td>Invierte los bits del operando.</td>
-  </tr>
-  <tr>
-   <td><a href="#Left_shift">Left shift</a></td>
-   <td><code>a &lt;&lt; b</code></td>
-   <td>Desplaza en representación binaria <code>b</code> (&lt; 32) bits a la izquierda, desplazando en ceros desde la derecha.</td>
-  </tr>
-  <tr>
-   <td><a href="#Right_shift">Sign-propagating right shift</a></td>
-   <td><code>a &gt;&gt; b</code></td>
-   <td>Desplaza en representación binaria <code>b</code> (&lt; 32) bits a la derecha, descartando los bits desplazados fuera.</td>
-  </tr>
-  <tr>
-   <td><a href="#Unsigned_right_shift">Zero-fill right shift</a></td>
-   <td><code>a &gt;&gt;&gt; b</code></td>
-   <td>Desplaza en representación binaria <code>b</code> (&lt; 32) bits a la derecha, desplazando en ceros desde la izquierda.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Enteros_con_signo_de_32_bits">Enteros con signo de 32 bits</h2>
-
-<p>Los operandos de todas las operaciones bitwise son convertidos a enteros con signo de 32 bits en complemento a dos. Complemento a dos significa que el equivalente negativo de un número (por ejemplo, 5 y -5) es igual a todos los bits del número invertido (un NOT del número, también conocido como el compelemento a uno del número) más uno. Por ejemplo, a continuación se codifica el entero 314:</p>
-
-<pre>00000000000000000000000100111010
-</pre>
-
-<p>A continuación se codifica <code>~314</code> como complemento a uno de 314:</p>
-
-<pre>11111111111111111111111011000101
-</pre>
-
-<p>Por último, se codifica <code>-314 como complemento a dos de </code><code>314</code>:</p>
-
-<pre>11111111111111111111111011000110
-</pre>
-
-<p>El complemento a dos garantiza que el bit más a la izquierda es 0 cuando el número es positivo, y 1 cuando el número es negativo. Por esto es llamado <em>bit de signo.</em></p>
-
-<p>El número 0 es el entero compuesto íntegramente por bits en 0.</p>
-
-<pre>0 (base 10) = 00000000000000000000000000000000 (base 2)
-
-</pre>
-
-<p>El número -1 es el entero compuesto íntegramente por bits de 1.</p>
-
-<pre>-1 (base 10) = 11111111111111111111111111111111 (base 2)
-</pre>
-
-<p>El número <code>-2147483648</code> (representación hexadecimal: <code>-0x80000000</code>) es el entero compuesto íntegramente por bits de 0 excepto el de más a la izquierda.</p>
-
-<pre>-2147483648 (base 10) = 10000000000000000000000000000000 (base 2)
-</pre>
-
-<p>El número <code>2147483647</code> (representación hexadecimal: <code>0x7fffffff</code>) es el entero compuesto íntegramente por bits de 1 excepto el de más a la izquierda. </p>
-
-<pre>2147483647 (base 10) = 01111111111111111111111111111111 (base 2)
-</pre>
-
-<p>Los números <code>-2147483648</code> and <code>2147483647</code> son el mínimo y el máximo entero que se pueden representar con signo de 32 bits.</p>
-
-<h2 id="Operadores_lógicos_a_nivel_de_bit">Operadores lógicos<strong> a nivel de bit</strong></h2>
-
-<p>Conceptualmente, los operadores lógicos bit a bit funcionan de la siguiente manera:</p>
-
-<ul>
- <li>Los operandos son convertidos en enteros de 32 bits y representados por series de bits (ceros y unos). Los numeros con más de 32 bits se convierten para que sus bits más significativos sean descartados. Por ejemplo, el siguiente entero con más de 32 bits se convierte a un entero de 32 bits.</li>
- <li>
-  <pre><code>Antes:     1100110111110100000000000000110000000000001
-Después:              10100000000000000110000000000001</code></pre>
- </li>
- <li>Cada bit del primer operando es emparejado con su bit correspondiente en el segundo operando: el primero con el primero, el segundo con el segundo, y así.</li>
- <li>El operador se aplica a cada pareja de bits, y el resultado se construye bit a bit. </li>
-</ul>
-
-<h3 id="(Bitwise_AND_o_AND_a_nivel_de_bits)"><a name="Bitwise_AND">&amp; (Bitwise AND o AND a nivel de bits)</a></h3>
-
-<p>Corresponde al operador lógico &amp; o "Y". Ejecuta la operación AND en cada par de bits, <code>a</code> AND <code>b</code> es 1 sólo si tanto a como b son 1. La tabla de verdad del operador AND es:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">a</td>
-   <td class="header">b</td>
-   <td class="header">a AND b</td>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>0</td>
-   <td>0</td>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>1</td>
-   <td>0</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>0</td>
-   <td>0</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>1</td>
-   <td>1</td>
-  </tr>
- </tbody>
-</table>
-
-<pre>     9 (base 10) = 00000000000000000000000000001001 (base 2)
-    14 (base 10) = 00000000000000000000000000001110 (base 2)
-                   --------------------------------
-14 &amp; 9 (base 10) = 00000000000000000000000000001000 (base 2) = 8 (base 10)
-</pre>
-
-<p>El resultado de hacer un AND de cualquier número x con 0 es 0, mientras que el de hacer un AND de cualquier número x con -1 da como resultado x. </p>
-
-<h3 id="(Bitwise_OR_o_OR_a_nivel_de_bits)"><a name="Bitwise_OR">| (Bitwise OR o  OR a nivel de bits)</a></h3>
-
-<p>Realiza la operación OR en cada par de bits. a OR b devuelve 1 si a o b son 1. La tabla de verdad para la operación OR es la siguiente:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">a</td>
-   <td class="header">b</td>
-   <td class="header">a OR b</td>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>0</td>
-   <td>0</td>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>1</td>
-   <td>1</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>0</td>
-   <td>1</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>1</td>
-   <td>1</td>
-  </tr>
- </tbody>
-</table>
-
-<pre>     9 (base 10) = 00000000000000000000000000001001 (base 2)
-    14 (base 10) = 00000000000000000000000000001110 (base 2)
-                   --------------------------------
-14 | 9 (base 10) = 00000000000000000000000000001111 (base 2) = 15 (base 10)
-</pre>
-
-<p>Ejecutar la operación OR sobre cualquier número x y 0 devuelve x. Ejecutar OR sobre cualquier número X y -1 devuelve -1.</p>
-
-<h3 id="(Bitwise_XOR_o_XOR_a_nivel_de_bits)"><a name="Bitwise_XOR">^ (Bitwise XOR o XOR a nivel de bits)</a></h3>
-
-<p>Realiza la operación XOR en cada par de bits. a OR b devuelve 1 si a o b son diferentes. La tabla de verdad para la operación OR es la siguiente:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">a</td>
-   <td class="header">b</td>
-   <td class="header">a XOR b</td>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>0</td>
-   <td>0</td>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>1</td>
-   <td>1</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>0</td>
-   <td>1</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>1</td>
-   <td>0</td>
-  </tr>
- </tbody>
-</table>
-
-<pre>     9 (base 10) = 00000000000000000000000000001001 (base 2)
-    14 (base 10) = 00000000000000000000000000001110 (base 2)
-                   --------------------------------
-14 ^ 9 (base 10) = 00000000000000000000000000000111 (base 2) = 7 (base 10)
-</pre>
-
-<p>Ejecutar la operación XOR sobre cualquier número x y 0 devuelve x. Ejecutar la operación XOR sobre cualquier número x y -1 devuelve ~x</p>
-
-<h3 id="(Bitwise_NOT_o_Negación_a_nivel_de_bits)"><a name="Bitwise_NOT">~ (Bitwise NOT o Negación a nivel de bits)</a></h3>
-
-<p>Realiza la operación NOT a cada bit. NOT devuelve el valor invertido ( conocido como complementario). La tabla de verdad para la operación NOT es la siguiente:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <td class="header">a</td>
-   <td class="header">NOT a</td>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>1</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>0</td>
-  </tr>
- </tbody>
-</table>
-
-<p> </p>
-
-<pre> 9 (base 10) = 00000000000000000000000000001001 (base 2)
-               --------------------------------
-~9 (base 10) = 11111111111111111111111111110110 (base 2) = -10 (base 10)
-</pre>
-
-<p> </p>
-
-<p>Ejecutar la operación NOT sobre cualquier número x devuelve -(x+1). Por ejemplo -5 devuelve 4.</p>
-
-<p>Ejemplo con indexOf:</p>
-
-<pre class="brush: js">var str = 'rawr';
-var searchFor = 'a';
-
-// esta es un forma alternativa de escribir (-1*str.indexOf('a') &lt;= 0)
-if (~str.indexOf(searchFor)) {
-  // searchFor esta en el string
-} else {
-  // searchFor no esta en el string
-}
-
-// aquí verás los valores que retorna (~str.indexOf(searchFor))
-// r == -1
-// a == -2
-// w == -3
-</pre>
-
-<h2 id="Operadores_de_desplazamiento_a_nivel_de_bit">Operadores de desplazamiento <strong>a nivel de bit</strong></h2>
-
-<p>Los operadores de desplazamiento toman dos operandos: el primero es la cantidad a ser desplazados, y el segundo especifica el número de posiciones bits que el primer operando debe ser desplazado. El sentido del operador de desplazamiento es determinado por el operador utilizado.</p>
-
-<p>Shift operators u operadores de desplazamiento, convierten sus operandos a enteros de 32-bit en orden big-endian y retorna el resultado del mismo tipo que el operando izquierdo. El operador derecho debe ser menor que 32, de lo contrario solo se usaran los ultimos cinco bits mas bajos.</p>
-
-<h3 id="&lt;&lt;_(Desplazamiento_a_la_izquierda)"><a name="Left_shift">&lt;&lt; (Desplazamiento a la izquierda)</a></h3>
-
-<p>Este operador desplaza el primer operando el número especificado de bits a la izquierda. Los bits en exceso desplazados hacia la izquierda se descartan. Los bits cero se desplazan desde la derecha.</p>
-
-<p>Por ejemplo, 9 &lt;&lt; 2 devuelve 36:</p>
-
-<pre>     9 (base 10): 00000000000000000000000000001001 (base 2)
-                  --------------------------------
-9 &lt;&lt; 2 (base 10): 00000000000000000000000000100100 (base 2) = 36 (base 10)
-</pre>
-
-<p>Desplazar a la izquierda cualquier número <strong>x</strong> por <strong>y</strong> bits da por resultado <strong>x * 2^y</strong>.</p>
-
-<h3 id=">>_(Desplazamiento_a_la_derecha_con_propagación_de_signo_o_Desplazamiento_aritmético_a_la_derecha)"><a name="Right_shift">&gt;&gt; (Desplazamiento a la derecha con propagación de signo o </a><a name="Unsigned_right_shift">Desplazamiento aritmético a la derecha</a><a name="Right_shift">)</a></h3>
-
-<p>Este operador desplaza el primer operando la cantidad de bits especificada a la derecha. Los bits en exceso desplazados a la derecha se descartan. Las copias del bit del extremo izquierdo se desplazan desde la izquierda. Como el nuevo bit más a la izquierda tiene el mismo valor que el bit anterior más a la izquierda, el bit de signo (el bit más a la izquierda) no cambia. De ahí el nombre "propagación de signo".</p>
-
-<p>Por ejemplo, <code>9 &gt;&gt; 2</code> devuelve 2:</p>
-
-<pre>     9 (base 10): 00000000000000000000000000001001 (base 2)
-                  --------------------------------
-9 &gt;&gt; 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
-</pre>
-
-<p>Igualmente, <code>-9 &gt;&gt; 2</code> devuelve-3, porque se mantiene el signo:</p>
-
-<pre>     -9 (base 10): 11111111111111111111111111110111 (base 2)
-                   --------------------------------
--9 &gt;&gt; 2 (base 10): 11111111111111111111111111111101 (base 2) = -3 (base 10)
-</pre>
-
-<h3 id=">>>_(Desplazamiento_a_la_derecha_con_relleno_de_ceros_o_Desplazamiento_lógico_)"><a name="Unsigned_right_shift">&gt;&gt;&gt; (Desplazamiento a la derecha con relleno de ceros o Desplazamiento lógico )</a></h3>
-
-<p>Este operador desplaza el primer operando la cantidad de bits especificada a la derecha. Los bits en exceso desplazados a la derecha se descartan. Ceros son despalzadas o introducidos desde la izquierda. El bit de signo aútomaticamente se convierte 0, así que el resultado siempre es pósitivo. </p>
-
-<p><br>
- Para números no negativos, el desplazamiento lógico y arítmetico dan el mismo resultado. Por ejemplo, <code>9 &gt;&gt;&gt; 2</code> da 2, al igual que <code>9 &gt;&gt; 2</code>:</p>
-
-<pre>      9 (base 10): 00000000000000000000000000001001 (base 2)
-                   --------------------------------
-9 &gt;&gt;&gt; 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
-</pre>
-
-<p>Sin embargo, no es el caso para números negativos. Por ejemplo, <code>-9 &gt;&gt;&gt; 2</code> da 1073741821, que es diferente de  <code>-9 &gt;&gt; 2</code> (que da -3):</p>
-
-<pre>      -9 (base 10): 11111111111111111111111111110111 (base 2)
-                    --------------------------------
--9 &gt;&gt;&gt; 2 (base 10): 00111111111111111111111111111101 (base 2) = 1073741821 (base 10)
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Banderas_y_máscaras_de_bits">Banderas y máscaras de bits</h3>
-
-<p>Los operadores lógicos a nivel de bits se utilizan a menudo para crear, manipular y leer secuencias de indicadores, que son como variables binarias. Se podrían usar variables en lugar de estas secuencias, pero las banderas binarias toman mucho menos memoria (por un factor de 32).</p>
-
-<p>Supongamos que hay 4 banderas:</p>
-
-<ul>
- <li>bandera A: tenemos un problema de hormigas</li>
- <li>bandera B: somos dueños de un murciélago</li>
- <li>bandera C: somos dueños de un gato</li>
- <li>bandera D: somos dueños de un pato</li>
-</ul>
-
-<p>Estas banderas están representadas por una secuencia de bits: DCBA. Cuando se establece un indicador, tiene un valor de 1. Cuando se elimina un indicador, tiene un valor de 0. Suponga que los indicadores de una variable tienen el valor binario 0101:</p>
-
-<pre class="brush: js">var flags = 5;   // binary 0101
-</pre>
-
-<p>Este valor indica:</p>
-
-<ul>
- <li>la bandera A es verdadera (tenemos un problema de hormigas);</li>
- <li>la bandera B es falsa (no tenemos un murciélago);</li>
- <li>la bandera C es verdadera (somos dueños de un gato);</li>
- <li>la bandera D es falsa (no tenemos pato);</li>
-</ul>
-
-<p>Dado que los operadores bitwise son de 32 bits, 0101 es en realidad 0000000000000000000000000000000101, pero los ceros anteriores pueden ignorarse ya que no contienen información significativa.</p>
-
-<p>Una máscara de bits es una secuencia de bits que puede manipular y / o leer banderas. Normalmente, se define una máscara de bits "primitiva" para cada bandera:</p>
-
-<pre class="brush: js">var FLAG_A = 1; // 0001
-var FLAG_B = 2; // 0010
-var FLAG_C = 4; // 0100
-var FLAG_D = 8; // 1000
-</pre>
-
-<p>Se pueden crear nuevas máscaras de bits utilizando los operadores lógicos a nivel de bits en estas máscaras de bits primitivas. Por ejemplo, la máscara de bits 1011 se puede crear mediante ORing FLAG_A, FLAG_B y FLAG_D:</p>
-
-<pre class="brush: js">var mask = FLAG_A | FLAG_B | FLAG_D; // 0001 | 0010 | 1000 =&gt; 1011
-</pre>
-
-<p>Los valores de los indicadores individuales se pueden extraer mediante AND con una máscara de bits, donde cada bit con el valor de uno "extraerá" el indicador correspondiente. La máscara de bits enmascara las marcas no relevantes mediante AND con ceros (de ahí el término "bitmask"). Por ejemplo, la máscara de bits 0101 se puede usar para ver si el indicador C está establecido:</p>
-
-<pre class="brush: js">// if we own a cat
-if (flags &amp; FLAG_C) { // 0101 &amp; 0100 =&gt; 0100 =&gt; true
-   // do stuff
-}
-</pre>
-
-<p>Una máscara de bits con varios indicadores establecidos actúa como un "either/or". Por ejemplo, los siguientes dos son equivalentes:</p>
-
-<pre class="brush: js">// if we own a bat or we own a cat
-// (0101 &amp; 0010) || (0101 &amp; 0100) =&gt; 0000 || 0100 =&gt; true
-if ((flags &amp; FLAG_B) || (flags &amp; FLAG_C)) {
-   // do stuff
-}
-</pre>
-
-<pre class="brush: js">// if we own a bat or cat
-var mask = FLAG_B | FLAG_C; // 0010 | 0100 =&gt; 0110
-if (flags &amp; mask) { // 0101 &amp; 0110 =&gt; 0100 =&gt; true
-   // do stuff
-}
-</pre>
-
-<p>Los indicadores se pueden establecer mediante ORing con una máscara de bits, donde cada bit con el valor uno establecerá el indicador correspondiente, si ese indicador no está ya establecido. Por ejemplo, la máscara de bits 1100 se puede utilizar para establecer los indicadores C y D:</p>
-
-<pre class="brush: js">// yes, we own a cat and a duck
-var mask = FLAG_C | FLAG_D; // 0100 | 1000 =&gt; 1100
-flags |= mask;   // 0101 | 1100 =&gt; 1101
-</pre>
-
-<p>Los indicadores se pueden borrar ANDing con una máscara de bits, donde cada bit con el valor cero borrará el indicador correspondiente, si aún no se ha borrado. Esta máscara de bits se puede crear NOTing las máscaras de bits primitivas. Por ejemplo, la máscara de bits 1010 se puede utilizar para borrar los indicadores A y C:</p>
-
-<pre class="brush: js">// no, we don't have an ant problem or own a cat
-var mask = ~(FLAG_A | FLAG_C); // ~0101 =&gt; 1010
-flags &amp;= mask;   // 1101 &amp; 1010 =&gt; 1000
-</pre>
-
-<p>La máscara también podría haberse creado con ~ FLAG_A &amp; ~ FLAG_C (ley de De Morgan):</p>
-
-<pre class="brush: js">// no, we don't have an ant problem, and we don't own a cat
-var mask = ~FLAG_A &amp; ~FLAG_C;
-flags &amp;= mask;   // 1101 &amp; 1010 =&gt; 1000
-</pre>
-
-<p>Los indicadores se pueden alternar mediante XORing con una máscara de bits, donde cada bit con el valor uno cambiará el indicador correspondiente. Por ejemplo, la máscara de bits 0110 se puede utilizar para alternar los indicadores B y C:</p>
-
-<pre class="brush: js">// if we didn't have a bat, we have one now,
-// and if we did have one, bye-bye bat
-// same thing for cats
-var mask = FLAG_B | FLAG_C;
-flags = flags ^ mask;   // 1100 ^ 0110 =&gt; 1010
-</pre>
-
-<p>Finalmente, todas las banderas se pueden voltear con el operador NOT:</p>
-
-<pre class="brush: js">// entering parallel universe...
-flags = ~flags;    // ~1010 =&gt; 0101
-</pre>
-
-<h3 id="Fragmentos_de_conversión">Fragmentos de conversión</h3>
-
-<p>Convert a binary <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/String" title="/en-US/docs/JavaScript/Reference/Global_Objects/String">String</a></code> to a decimal <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number" title="/en-US/docs/JavaScript/Reference/Global_Objects/Number">Number</a></code>:</p>
-
-<pre class="brush: js">var sBinString = "1011";
-var nMyNumber = parseInt(sBinString, 2);
-alert(nMyNumber); // prints 11, i.e. 1011
-</pre>
-
-<p> </p>
-
-<p>Convierte una cadena binaria a un número decimal:</p>
-
-<p> </p>
-
-<pre class="brush: js">var nMyNumber = 11;
-var sBinString = nMyNumber.toString(2);
-alert(sBinString); // prints 1011, i.e. 11
-</pre>
-
-<h3 id="Automatiza_la_creación_de_una_máscara.">Automatiza la creación de una máscara.</h3>
-
-<p>Si tiene que crear muchas máscaras a partir de algunos valores booleanos, puede automatizar el proceso:</p>
-
-<pre class="brush: js">function createMask () {
-  var nMask = 0, nFlag = 0, nLen = arguments.length &gt; 32 ? 32 : arguments.length;
-  for (nFlag; nFlag &lt; nLen; nMask |= arguments[nFlag] &lt;&lt; nFlag++);
-  return nMask;
-}
-var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011
-var mask2 = createMask(false, false, true); // 4, i.e.: 0100
-var mask3 = createMask(true); // 1, i.e.: 0001
-// etc.
-
-alert(mask1); // prints 11, i.e.: 1011
-</pre>
-
-<h3 id="Algoritmo_inverso_una_matriz_de_valores_booleanos_de_una_máscara">Algoritmo inverso: una matriz de valores booleanos de una máscara</h3>
-
-<p>Si desea crear una matriz de valores booleanos a partir de una máscara, puede usar este código:</p>
-
-<pre class="brush: js">function arrayFromMask (nMask) {
-  // nMask must be between -2147483648 and 2147483647
-  if (nMask &gt; 0x7fffffff || nMask &lt; -0x80000000) {
-    throw new TypeError("arrayFromMask - out of range");
-  }
-  for (var nShifted = nMask, aFromMask = []; nShifted;
-       aFromMask.push(Boolean(nShifted &amp; 1)), nShifted &gt;&gt;&gt;= 1);
-  return aFromMask;
-}
-
-var array1 = arrayFromMask(11);
-var array2 = arrayFromMask(4);
-var array3 = arrayFromMask(1);
-
-alert("[" + array1.join(", ") + "]");
-// prints "[true, true, false, true]", i.e.: 11, i.e.: 1011
-</pre>
-
-<p>Puedes probar ambos algoritmos al mismo tiempo ...</p>
-
-<pre class="brush: js">var nTest = 19; // our custom mask
-var nResult = createMask.apply(this, arrayFromMask(nTest));
-
-alert(nResult); // 19
-</pre>
-
-<p>Solo para fines didácticos (ya que existe el método Number.toString (2)), mostramos cómo es posible modificar el algoritmo arrayFromMask para crear una cadena que contenga la representación binaria de un número, en lugar de una matriz de booleanos:</p>
-
-<pre class="brush: js">function createBinaryString (nMask) {
-  // nMask must be between -2147483648 and 2147483647
-  for (var nFlag = 0, nShifted = nMask, sMask = ""; nFlag &lt; 32;
-       nFlag++, sMask += String(nShifted &gt;&gt;&gt; 31), nShifted &lt;&lt;= 1);
-  return sMask;
-}
-
-var string1 = createBinaryString(11);
-var string2 = createBinaryString(4);
-var string3 = createBinaryString(1);
-
-alert(string1);
-// prints 00000000000000000000000000001011, i.e. 11
-</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definicion inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.7')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definido en varias secciones de la especificación: operador NOT a nivel de bit, operadores de cambio a nivel de bit, operadores a nivel de bit binarios</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-bitwise-shift-operators')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definido en varias secciones de la especificación: operador NOT a nivel de bit, operadores de cambio a nivel de bit, operadores a nivel de bit binarios</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_NOT">Bitwise NOT (<code>~</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_AND">Bitwise AND (<code>&amp;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_OR">Bitwise OR (<code>|</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_XOR">Bitwise XOR (<code>^</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Left_shift">Left shift (<code>&lt;&lt;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Right_shift">Right shift (<code>&gt;&gt;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Unsigned_right_shift">Unsigned right shift (<code>&gt;&gt;&gt;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_NOT">Bitwise NOT (<code>~</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_AND">Bitwise AND (<code>&amp;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_OR">Bitwise OR (<code>|</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Bitwise_XOR">Bitwise XOR (<code>^</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Left_shift">Left shift (<code>&lt;&lt;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Right_shift">Right shift (<code>&gt;&gt;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><a href="#Unsigned_right_shift">Unsigned right shift (<code>&gt;&gt;&gt;</code>)</a></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators">Operadores logicos</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/class/index.html b/files/es/web/javascript/referencia/operadores/class/index.html
deleted file mode 100644
index e654359035..0000000000
--- a/files/es/web/javascript/referencia/operadores/class/index.html
+++ /dev/null
@@ -1,157 +0,0 @@
----
-title: expresión class
-slug: Web/JavaScript/Referencia/Operadores/class
-tags:
-  - Classes
-  - ECMAScript6
-  - Expression
-  - JavaScript
-  - Operator
-  - Reference
-translation_of: Web/JavaScript/Reference/Operators/class
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>La <strong>expresión class</strong> es una forma de definir una clase en ECMAScript 2015 (ES6). Similar a las <a href="/es/docs/Web/JavaScript/Referencia/Operadores/function">funciones</a>, las expresiones de clase pueden ser nombradas o no. Si se nombran, el nombre de la clase es local sólo en el cuerpo de la clase. Las clases en JavaScript utilizan herencia basada en prototipos.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">var MyClass = class <em>[className]</em> [extends] {
-  // class body
-};</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Una expresión de clase tiene una sintaxis similar a la <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/class">declaración de una clase</a>. Sin embargo, con las expresiones de clases, está permitido omitir el nombre de la clase ("identificador de enlace"), cosa que no se puede hacer con las declaraciones de clases. Además, las expresiones de clases permiten redefinir/redeclarar clases y <strong>no lanzar</strong> ningún tipo de error como las <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/class">declaraciones de clases</a>. La propiedad <code>constructor</code> es opcional. Y el <em>typeof </em>de las clases generadas con esta palabra clave siempre será "function".</p>
-
-<p>Tal y como en la declaración de clases, el cuerpo de la expresión de clase se ejecuta en <a href="/es/docs/Web/JavaScript/Referencia/Modo_estricto">modo estricto</a>.</p>
-
-<pre class="brush: js">'use strict';
-var Foo = class {}; // la propiedad constructor es opcional
-var Foo = class {}; // Se permite repetir declaraciones
-
-typeof Foo; // devuelve "function"
-typeof class {}; // devuelve "function"
-
-Foo instanceof Object; // true
-Foo instanceof Function; // true
-class Foo {}; // Lanza TypeError, no permite volver a declararla
-</pre>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Una_clase_sencilla">Una clase sencilla</h3>
-
-<p>Esta es una sencilla expresión de clase anónima a la que se puede hacer referencia utilizando la variable "Foo".</p>
-
-<pre class="brush: js">var Foo = class {
-  constructor() {}
-  bar() {
-    return "Hello World!";
-  }
-};
-
-var instance = new Foo();
-instance.bar(); // "Hello World!"
-Foo.name; // "Foo"
-</pre>
-
-<h3 id="Expresiones_de_clase_con_nombre">Expresiones de clase con nombre</h3>
-
-<p>Si se quiere hacer referencia a la clase actual dentro del cuerpo de la clase, se puede crear una expresión de clase con nombre. Este nombre sólo será visible en el mismo contexto de la expresión de clase.</p>
-
-<pre class="brush: js">var Foo = class NamedFoo {
-  constructor() {}
-  whoIsThere() {
-    return NamedFoo.name;
-  }
-}
-var bar = new Foo();
-bar.whoIsThere(); // "NamedFoo"
-NamedFoo.name; // ReferenceError: NamedFoo no está definido
-Foo.name; // "NamedFoo"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-class-definitions', 'Class definitions')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>{{CompatGeckoDesktop(45)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome para Android</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>{{CompatGeckoMobile(45)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(42.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Operadores/function">expresión <code>function</code></a></li>
- <li><code><a href="/es/docs/Web/JavaScript/Referencia/Sentencias/class">declaración class</a></code></li>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Classes">Clases</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/comparacion/index.html b/files/es/web/javascript/referencia/operadores/comparacion/index.html
deleted file mode 100644
index c60efcaada..0000000000
--- a/files/es/web/javascript/referencia/operadores/comparacion/index.html
+++ /dev/null
@@ -1,129 +0,0 @@
----
-title: Comparación (==)
-slug: Web/JavaScript/Referencia/Operadores/Comparacion
-tags:
-  - JS
-  - JavaScript
-  - Operador de comparacion
-  - Operadores
-  - Referências
-translation_of: Web/JavaScript/Reference/Operators/Equality
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de comparacion  (<code>==</code>) comprueba si sus dos operandos son iguales y devuelve un resultado booleano. A diferencia del operador de igualdad estricta (<code>===</code>), es que este convierte y compara operandos que son de diferentes tipos.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-equality.html")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">x == y
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los operadores de igualdad (<code>==</code>y <code>!=</code>) Utilizan el algoritmo de comparación de igualdad abstracta para comparar dos operandos. Esto se puede resumir a grandes rasgos como:</p>
-
-<ul>
- <li>Si los operandos ambos son objetos, devuelve <code>true </code>solo si ambos operandos hacen referencia al mismo objeto.</li>
- <li>Si un operando es <code>null</code>y el otro <code>undefined</code>, devuelve verdadero(<code>true</code>).</li>
- <li>Si los operandos son de diferente tipos, intenta convertirlos al mismo tipo antes de comparar:
-  <ul>
-   <li>Al comparar un número con una cadena, convierte la cadena en un valor numérico.</li>
-   <li>Si uno de los operandos es booleano, convierte el operando booleano en 1 si es verdadero y en 0 en el caso de falso.</li>
-   <li>Si uno de los operandos es un objeto y el otro es un número o una cadena, convierte el objeto en una primitiva utilizando los métodos <code>valueOf()</code>y <code>toString()</code> del objeto.</li>
-  </ul>
- </li>
- <li>Si los operandos tienen el mismo tipo, se comparan de la siguiente manera:
-  <ul>
-   <li><code>String</code>: devuelve verdadero solo si ambos operandos tienen los mismos caracteres y en el mismo orden.</li>
-   <li><code>Number</code>: devuelve verdadero solo si ambos operandos tienen el mismo valor. <code>+0</code> y <code>-0</code> se tratan como el mismo valor. Si alguno de los operandos es <code>NaN</code>, devuelve falso.</li>
-   <li><code>Boolean</code>: retorna verdadero solo si ambos operandos son verdaderos o falsos.</li>
-  </ul>
- </li>
-</ul>
-
-<p>La diferencia más notable entre este operador y el operador de igualdad estricta (<code>===</code>) es que el operador de igualdad estricta no realiza la conversión de tipos. </p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Comparación_sin_conversión_de_tipo">Comparación sin conversión de tipo</h3>
-
-<pre class="brush: js notranslate">1 == 1;              // true
-"Hola" == "Hola";  // true</pre>
-
-<h3 id="Comparación_con_conversión_de_tipos">Comparación con conversión de tipos</h3>
-
-<pre class="brush: js notranslate">"1" ==  1;            // true
-1 == "1";             // true
-0 == false;           // true
-0 == null;            // false
-0 == undefined;       // false
-0 == !!null;          // true, Operador Logico NOT
-0 == !!undefined;     // true, Operador Logico NOT
-null == undefined;    // true
-
-const number1 = new Number(3);
-const number2 = new Number(3);
-number1 == 3;         // true
-number1 == number2;   // false</pre>
-
-<h3 id="Comparación_de_objetos">Comparación de objetos</h3>
-
-<pre class="brush: js notranslate">const object1 = {"key": "value"}
-const object2 = {"key": "value"};
-
-object1 == object2 // false
-object2 == object2 // true</pre>
-
-<h3 id="Comparar_String_y_objetos_String">Comparar String y objetos String</h3>
-
-<p>Tenga en cuenta que las cadenas construidas con <code>new String() </code>son objetos. Si compara uno de estos con un String literal, el objeto String se convertirá en un <code>String</code> literal y se comparará el contenido. Sin embargo, si ambos operandos son objetos de tipo String, entonces se comparan como objetos y deben hacer referencia al mismo objeto para que la comparación sea exitosa:</p>
-
-<pre class="brush: js notranslate">const string1 = "Hola";
-const string2 = String("Hola");
-const string3 = new String("Hola");
-const string4 = new String("Hola");
-
-console.log(string1 == string2); // true
-console.log(string1 == string3); // true
-console.log(string2 == string3); // true
-console.log(string3 == string4); // false
-console.log(string4 == string4); // true</pre>
-
-<h3 id="Comparación_de_fechas_y_cadenas">Comparación de fechas y cadenas</h3>
-
-<pre class="brush: js notranslate">const d = new Date('December 17, 1995 03:24:00');
-const s = d.toString(); // Por ejemplo: "Sun Dec 17 1995 03:24:00 GMT-0800 (Hora estándar del Pacífico)"
-console.log(d == s);    //true</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificaciones</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-equality-operators', 'Equality operators')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.equality")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Inequality">Inequality operator</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Strict_equality">Strict equality operator</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Strict_inequality">Strict inequality operator</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/comparison_operators/index.html b/files/es/web/javascript/referencia/operadores/comparison_operators/index.html
deleted file mode 100644
index 8685790d2c..0000000000
--- a/files/es/web/javascript/referencia/operadores/comparison_operators/index.html
+++ /dev/null
@@ -1,262 +0,0 @@
----
-title: Operadores de Comparación
-slug: Web/JavaScript/Referencia/Operadores/Comparison_Operators
-tags:
-  - JavaScript
-  - Operador
-  - Referencia
-translation_of: Web/JavaScript/Reference/Operators
-translation_of_original: Web/JavaScript/Reference/Operators/Comparison_Operators
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>JavaScript tiene comparaciones estrictas y de conversión de tipos. Una comparación estricta (por ejemplo, <code>===</code>) solo es verdadera si los operandos son del mismo tipo y los contenidos coinciden. La comparación abstracta más comúnmente utilizada (por ejemplo, <code>==</code>) convierte los operandos al mismo tipo antes de hacer la comparación. Para las comparaciones abstractas relacionales (p. Ej., <code>&lt;=</code>), Los operandos primero se convierten en primitivos, y luego en el mismo tipo, antes de la comparación.</p>
-
-<p>Las cadenas se comparan en base al orden lexicográfico estándar, utilizando valores Unicode.</p>
-
-<pre class="brush: js notranslate">console.log(1 == 1)
-// Esperamos True
-
-console.log("1" == 1 )
-// Esperamos true
-
-console.log( 1 === 1)
-// Esperamos true
-
-console.log( "1" === 1)
-// Esperamos false
-</pre>
-
-<p>Características de las comparaciones:</p>
-
-<ul>
- <li>Dos cadenas son estrictamente iguales cuando tienen la misma secuencia de caracteres, la misma longitud y los mismos caracteres en las posiciones correspondientes.</li>
- <li>Dos números son estrictamente iguales cuando son numéricamente iguales (tienen el mismo valor numérico). <a href="/es/docs/Web/JavaScript/Reference/Global_Objects/NaN">NaN</a> no es igual a nada, incluido NaN. Los ceros positivos y negativos son iguales entre sí. </li>
- <li>Dos operandos booleanos son estrictamente iguales si ambos son <code>true</code> o ambos son <code>false</code>.</li>
- <li>Dos objetos distintos nunca son iguales para comparaciones estrictas o abstractas.</li>
- <li>Una expresión que compara objetos solo es verdadera si los operandos hacen referencia al mismo objeto.</li>
- <li>Los tipos Null y Undefined son estrictamente iguales a ellos mismos y abstractivamente iguales entre sí.</li>
-</ul>
-
-<h2 id="Operadores_de_igualdad">Operadores de igualdad</h2>
-
-<h3 id="Igualdad"><a name="Equality">Igualdad (==)</a></h3>
-
-<p>El operador de igualdad convierte los operandos si <strong>no son del mismo tipo</strong>, luego aplica una comparación estricta. Si <strong>ambos operandos son objetos</strong>, entonces JavaScript compara las referencias internas que son iguales cuando los operandos se refieren al mismo objeto en la memoria.</p>
-
-<h4 id="Sintaxis">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate">x == y
-</pre>
-
-<h4 id="Ejemplos">Ejemplos</h4>
-
-<pre class="brush: js notranslate">1    ==  1         // true
-'1'  ==  1         // true
-1    == '1'        // true
-0    == false      // true
-0    == null       // false
-var object1 = {'key': 'value'}, object2 = {'key': 'value'};
-object1 == object2 // false
-0    == undefined  // false
-null == undefined  // true
-</pre>
-
-<h3 id="Desigualdad_!"><a name="Inequality">Desigualdad (!=)</a></h3>
-
-<p>El operador de desigualdad devuelve verdadero si los operandos no son iguales. Si los dos operandos <strong>no son del mismo tipo</strong>, JavaScript intenta convertir los operandos a un tipo apropiado para la comparación. Si <strong>ambos operandos son objetos</strong>, entonces JavaScript compara las referencias internas que no son iguales cuando los operandos se refieren a diferentes objetos en la memoria.</p>
-
-<h4 id="Sintaxis_2">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate">x != y</pre>
-
-<h4 id="Ejemplos_2">Ejemplos</h4>
-
-<pre class="brush: js notranslate">1 !=   2     // true
-1 !=  '1'    // false
-1 !=  "1"    // false
-1 !=  true   // false
-0 !=  false  // false
-</pre>
-
-<h3 id="Identidad_igualdad_estricta"><a name="Identity">Identidad / igualdad estricta (===)</a></h3>
-
-<p>El operador de identidad devuelve verdadero si los operandos son estrictamente iguales (ver arriba) <strong>sin conversión de tipo</strong>.</p>
-
-<h4 id="Sintaxis_3">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate">x === y</pre>
-
-<h4 id="Ejemplos_3">Ejemplos</h4>
-
-<pre class="brush: js  notranslate">3 === 3   // true
-3 === '3' // false
-var object1 = {'key': 'value'}, object2 = {'key': 'value'};
-object1 === object2 // false</pre>
-
-
-
-<h3 id="Sin_identidad_desigualdad_estricta_!"><a name="Nonidentity">Sin identidad / desigualdad estricta (!==)</a></h3>
-
-<p>El operador sin identidad devuelve verdadero si los operandos <strong>no son iguales y / o no del mismo tipo</strong>.</p>
-
-<h4 id="Sintaxis_4">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate">x !== y</pre>
-
-<h4 id="Ejemplos_4">Ejemplos</h4>
-
-<pre class="brush: js notranslate">3 !== '3' // true
-4 !== 3   // true
-</pre>
-
-<h2 id="Operadores_relacionales">Operadores relacionales</h2>
-
-<p>Cada uno de estos operadores llamará a la función <code>valueOf()</code> en cada operando antes de realizar una comparación.</p>
-
-<h3 id="Operador_mayor_que_>"><a name="Greater_than_operator">Operador mayor que (&gt;)</a></h3>
-
-<p>El operador mayor que, devuelve verdadero si el operando izquierdo es mayor que el operando derecho.</p>
-
-<h4 id="Sintaxis_5">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate">x &gt; y</pre>
-
-<h4 id="Ejemplos_5">Ejemplos</h4>
-
-<pre class="brush: js notranslate">4 &gt; 3 // true
-</pre>
-
-<h3 id="Operador_mayor_o_igual_>"><a name="Greater_than_or_equal_operator">Operador mayor o igual (&gt;=)</a></h3>
-
-<p>El operador mayor o igual que, devuelve verdadero si el operando izquierdo es mayor o igual que el operando derecho.</p>
-
-<h4 id="Sintaxis_6">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate"> x &gt;= y</pre>
-
-<h4 id="Ejemplos_6">Ejemplos</h4>
-
-<pre class="brush: js notranslate">4 &gt;= 3 // true
-3 &gt;= 3 // true
-</pre>
-
-<h3 id="Operador_menor_que_&lt;"><a name="Less_than_operator"> Operador menor que (&lt;)</a></h3>
-
-<p>El operador menor que devuelve verdadero si el operando de la izquierda es menor que el operando de la derecha.</p>
-
-<h4 id="Sintaxis_7">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate"> x &lt; y</pre>
-
-<h4 id="Ejemplos_7">Ejemplos</h4>
-
-<pre class="brush: js notranslate">3 &lt; 4 // true
-</pre>
-
-<h3 id="Operador_menor_o_igual_&lt;"><a id="Less_than_or_equal_operator" name="Less_than_or_equal_operator">Operador menor o igual (&lt;=)</a></h3>
-
-<p>El operador menor o igual devuelve verdadero si el operando izquierdo es menor o igual que el operando derecho.</p>
-
-<h4 id="Sintaxis_8">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate"> x &lt;= y</pre>
-
-<h4 id="Ejemplos_8">Ejemplos</h4>
-
-<pre class="brush: js notranslate">3 &lt;= 4 // true
-</pre>
-
-<h2 id="Usando_los_operadores_de_igualdad">Usando los operadores de igualdad</h2>
-
-<p>Los operadores de igualdad estándar (<code>==</code> y <code>!=</code>) utilizan el <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.3">Algoritmo de Comparación de Igualdad Abstracta</a> para comparar dos operandos. Si los operandos son de tipos diferentes, intentará convertirlos al mismo tipo antes de hacer la comparación, por ejemplo, en la expresión <code>5 == '5'</code>, la cadena de la derecha se convierte a {{jsxref("Number")}} antes de realizar la comparación.</p>
-
-<p>Los operadores de igualdad estricta (<code>===</code> y <code>!==</code>) usan el <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.6">Algoritmo de Comparación de Igualdad Estricta</a> y están destinados a realizar comparaciones de igualdad en operandos del mismo tipo. Si los operandos son de tipos diferentes, el resultado siempre es <code>false</code>, entonces <code>5 !== '5'</code>.</p>
-
-<p>Utilice operadores de igualdad estrictos si los operandos deben ser de un tipo específico así como de valor o si el tipo exacto de los operandos es importante. De lo contrario, utilice los operadores de igualdad estándar, que le permiten comparar la identidad de dos operandos, incluso si no son del mismo tipo.</p>
-
-<p>Cuando la conversión de tipo está involucrada en la comparación (es decir, comparación no estricta), JavaScript convierte los tipos {{jsxref("String")}}, {{jsxref("Number")}}, {{jsxref("Boolean")}} o {{jsxref("Object")}} operandos de la siguiente manera:</p>
-
-<ul>
- <li>Al comparar un número y una cadena, la cadena se convierte en un valor numérico. JavaScript intenta convertir el literal numérico de cadena a un valor de tipo <code>Number</code>. Primero, un valor matemático se deriva del literal numérico de cadena. A continuación, este valor se redondea al valor de tipo <code>Number</code> más cercano.</li>
- <li>Si uno de los operandos es <code>Boolean</code>, el operando <code>Boolean</code> se convierte en 1 si es <code>true</code> y +0 si es <code>false</code>.</li>
- <li>Si un objeto se compara con un número o cadena, JavaScript intenta devolver el valor predeterminado para el objeto. Los operadores intentan convertir el objeto a un valor primitivo, un valor <code>String</code> o <code>Number</code>, utilizando los métodos <code>valueOf</code> y <code>toString</code> de los objetos. Si falla este intento de convertir el objeto, se genera un error de tiempo de ejecución.</li>
- <li>Tenga en cuenta que un objeto se convierte en una primitiva si, y solo si, su comparando es una primitiva. Si ambos operandos son objetos, se comparan como objetos, y la prueba de igualdad es verdadera solo si ambos refieren el mismo objeto.</li>
-</ul>
-
-<div class="note"><strong>Nota:</strong> Los objetos de cadena son Tipo Objeto, no String! Los objetos de cadena rara vez se utilizan, por lo que los siguientes resultados pueden ser sorprendentes:</div>
-
-<pre class="brush:js notranslate">// true, ya que ambos operandos son de tipo String (es decir, primitivas de cadena):
-'foo' === 'foo'
-
-var a = new String('foo');
-var b = new String('foo');
-
-// false como a y b son tipo Objeto y referencia a diferentes objetos
-a == b
-
-// false como a y b son tipo Objeto y referencia a diferentes objetos
-a === b
-
-// true como a y 'foo' son de tipo diferente y, el Objeto (a)
-// se convierte en cadena 'foo' antes de la comparación
-a == 'foo'</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>
-    <p>Agrega <code>===</code> y <code>!==</code> operadores. Implementado en JavaScript 1.3</p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.8')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>
-    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.8">Operadores Relacionales</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9">Operadores de Igualdad</a></p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-relational-operators')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>
-    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-relational-operators">Operadores Relacionales</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-equality-operators">Operadores de Igualdad</a></p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-relational-operators')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>
-    <p>Definido en varias secciones de la especificación: <a href="http://tc39.github.io/ecma262/#sec-relational-operators">Operadores Relacionales</a>, <a href="http://tc39.github.io/ecma262/#sec-equality-operators">Operadores de Igualdad</a></p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.comparison")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Object.is()")}}</li>
- <li>{{jsxref("Math.sign()")}}</li>
- <li><a href="/es/docs/Web/JavaScript/Equality_comparisons_and_sameness">Comparaciones de igualdad y uniformidad</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/conditional_operator/index.html b/files/es/web/javascript/referencia/operadores/conditional_operator/index.html
deleted file mode 100644
index 6b48295902..0000000000
--- a/files/es/web/javascript/referencia/operadores/conditional_operator/index.html
+++ /dev/null
@@ -1,171 +0,0 @@
----
-title: Operador condicional (ternario)
-slug: Web/JavaScript/Referencia/Operadores/Conditional_Operator
-tags:
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators/Conditional_Operator
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<div>El<strong> operador condicional </strong>(<strong>ternario</strong>) es el único operador en JavaScript que tiene tres operandos. Este operador se usa con frecuencia como atajo para la instrucción <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/if...else">if</a>.</div>
-
-<div> </div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>condición </em>? <em>expr1</em> : <em>expr2</em> </pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>condición</code></dt>
- <dd>Una expresión que se evalúa como true o false.</dd>
- <dt>
- <div class="syntaxbox"><code>expr1</code>, <code>expr2</code></div>
- </dt>
- <dd>Expresión con valores de algún tipo.</dd>
- <dt>
- <h2 id="Descripción">Descripción</h2>
- </dt>
-</dl>
-
-<p>Si la <code>condición</code> es <code>true</code>, el operador retorna el valor de la <code>expr1</code>; de lo contrario,  devuelve el valor de <code>expr2</code>. Por ejemplo, para mostrar un mensaje diferente en función del valor de la variable <em><code>isMember,</code></em> se puede usar esta declaración:</p>
-
-<pre class="brush: js">"La Cuota es de:  " + (isMember ? "$2.00" : "$10.00")
-</pre>
-
-<p>También puedes asignar variables dependiendo del resultado de la condición ternaria:</p>
-
-<pre class="brush: js">var elvisLives = Math.PI &gt; 4 ? "Sip" : "Nop";</pre>
-
-<p>También es posible realizar evaluaciones ternarias múltiples (Nota: El operador condicional es asociativo):</p>
-
-<pre class="brush: js">var firstCheck = false,
-    secondCheck = false,
-    access = firstCheck ? "Acceso Denegado" : secondCheck ? "Acceso Denegado" : "Acceso Permitido";
-
-console.log( access ); // muestra "Acceso Permitido"</pre>
-
-<p>También puede usar operaciones ternarias en espacio vacío con el propósito de realizar diferentes operaciones:</p>
-
-<pre class="brush: js">var stop = false, age = 16;
-
-age &gt; 18 ? location.assign("continue.html") : stop = true;
-</pre>
-
-<p>También puede realizar más de una operación por caso, separándolas con una coma:</p>
-
-<pre class="brush: js">var stop = false, age = 23;
-
-age &gt; 18 ? (
-    alert("OK, puedes continuar."),
-    location.assign("continue.html")
-) : (
-    stop = true,
-    alert("Disculpa, eres menor de edad!")
-);
-</pre>
-
-<p>También puede realizar más de una operación durante la asignación de un valor. En este caso, <strong><em>el último valor separado por una coma del paréntesis </em>será el valor asignado</strong>.</p>
-
-<pre class="brush: js">var age = 16;
-
-var url = age &gt; 18 ? (
-    alert("OK, puedes continuar."),
-    // alert devuelve "undefined", pero será ignorado porque
-    // no es el último valor separado por comas del paréntesis
-    "continue.html" // el valor a ser asignado si age &gt; 18
-) : (
-    alert("Eres menor de edad!"),
-    alert("Disculpa :-("),
-    // etc. etc.
-    "stop.html" // el valor a ser asignado si !(age &gt; 18)
-);
-
-location.assign(url); // "stop.html"</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-conditional-operator', 'Conditional Operator')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.12', 'The conditional operator')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-11.12', 'The conditional operator')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial implementada en JavaScript 1.0.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/if...else">if statement</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/decremento/index.html b/files/es/web/javascript/referencia/operadores/decremento/index.html
deleted file mode 100644
index 01fa5f0ee2..0000000000
--- a/files/es/web/javascript/referencia/operadores/decremento/index.html
+++ /dev/null
@@ -1,83 +0,0 @@
----
-title: Decremento(--)
-slug: Web/JavaScript/Referencia/Operadores/Decremento
-tags:
-  - Decremento
-  - JavaScript
-  - JavaScript basico
-  - Operadores
-translation_of: Web/JavaScript/Reference/Operators/Decrement
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de decremento (--) disminuye (o resta de a uno) su operando y retorna un valor.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-decrement.html")}}</div>
-
-<div></div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><strong>Operadores:</strong> <var>x</var>-- o --<var>x</var>
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si usamos la forma de sufijo, operador después del operando (por ejemplo, <code>x--</code>), el operador de disminución disminuye y devuelve el valor antes de disminuir.</p>
-
-<p>Si se usamos la forma de prefijo, operador antes del operando (por ejemplo, <code>--x</code>), el operador de disminución disminuye y devuelve el valor después de disminuir.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_Sufijo">Usando Sufijo </h3>
-
-<pre class="brush: js notranslate">let x = 3;
-y = x--;
-
-// y = 3
-// x = 2
-</pre>
-
-<h3 id="Usando_Prefijo">Usando Prefijo</h3>
-
-<pre class="brush: js notranslate">let a = 2;
-b = --a;
-
-// a = 1
-// b = 1
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-postfix-decrement-operator', 'Decrement operator')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.decrement")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/delete/index.html b/files/es/web/javascript/referencia/operadores/delete/index.html
deleted file mode 100644
index 99ec3e73dd..0000000000
--- a/files/es/web/javascript/referencia/operadores/delete/index.html
+++ /dev/null
@@ -1,242 +0,0 @@
----
-title: operador delete
-slug: Web/JavaScript/Referencia/Operadores/delete
-translation_of: Web/JavaScript/Reference/Operators/delete
----
-<div>
-<div>{{jsSidebar("Operators")}}</div>
-</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>El operador <code>delete</code>  elimina una propiedad de un objeto.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox">delete expresión </pre>
-
-<p>donde la <em>expresión</em> debe evaluar una referencia de la propiedad, por ejemplo:</p>
-
-<pre class="syntaxbox">delete <em>objeto.propiedad</em>
-delete <em>objeto</em>['<em>propiedad</em>']
-</pre>
-
-<h3 id="Parameters" name="Parameters">Parámetros</h3>
-
-<dl>
- <dt><code>objeto</code></dt>
- <dd>El nombre de un objeto, o una expresión que evalua a un objeto.</dd>
- <dt><code>propiedad</code></dt>
- <dd>La propiedad a eliminar.</dd>
-</dl>
-
-<h3 id="Returns" name="Returns">Retorno</h3>
-
-<p>En <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">modo estricto</a> arroja una excepción si la propiedad no es configurable (retorna <code>false</code> en modo no estricto). Retorna <code>true</code> en cualquier otro caso.</p>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Al contrario de lo que se podría pensar, el operador <code>delete</code> no tiene nada que ver con liberar memoria (sólo lo hace de manera indirecta eliminando referencias. Más detalles en la página de<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Gestion_de_Memoria"> gestión de memoria</a>).</p>
-
-<p>Si la operación <code>delete</code> funciona correctamente, eliminará la propiedad del objeto por completo. Sin embargo, si existe otra propiedad con el mismo nombre en la cadena del <code>prototype </code>del objeto, éste heredará la propiedad del <code>prototype</code>.</p>
-
-<p><code>delete</code> sólo es efectivo en propiedades de objetos. No tiene ningún efecto en variables o en nombres de funciones.<br>
- Aunque a veces son mal identificados como variables globales, las asignaciones que no especifican al objeto (ejemplo: x = 5), son en realidad propiedades que se asignan al objeto global.</p>
-
-<p><code>delete</code> no puede eliminar ciertas propiedades de los objetos predefinidos (como Object, Array, Math etc). Estos están descritos en ECMAScript 5 y más tarde como no configurables.</p>
-
-<h3 id="Temporal_dead_zone">Temporal dead zone</h3>
-
-<p>The "<a href="/en-US/docs/Web/JavaScript/Reference/Statements/let#Temporal_dead_zone_and_errors_with_let">temporal dead zone"</a> (TDZ), specified in ECMAScript 6 for <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/const">const</a></code> and <a href="/en-US/docs/Web/JavaScript/Reference/Statements/let"><code>let</code></a> declarations, also applies to the <code>delete</code> operator. Thus, code like the following will throw a {{jsxref("ReferenceError")}}.</p>
-
-<pre class="brush: js">function foo() {
-  delete x;
-  let x;
-}
-
-function bar() {
-  delete y;
-  const y;
-}</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<pre class="brush: js">x = 42;         // crea la propiedad x en el objeto global
-var y = 43;     // crea la propiedad y en el objeto global, y la marca como no configurable
-myobj = {
-  h: 4,
-  k: 5
-};
-
-// x es una propiedad del objeto global y puede ser eliminada
-delete x;       // retorna true
-
-// y no es configurable, por lo tanto no puede ser eliminada
-delete y;       // retorna false
-
-// delete no afecta a ciertas propiedades predefinidas
-delete Math.PI; // retorna false
-
-// las propiedades definidas por el usuario pueden eliminarse
-delete myobj.h; // retorna true
-
-// myobj es una propiedad del objeto global, no una variable,
-// por lo tanto puede eliminarse
-delete myobj;   // retorna true
-
-function f() {
-  var z = 44;
-
-  // delete no afecta a nombres de variables locales
-  delete z;     // retorna false
-}
-</pre>
-
-<p>Si el objeto hereda una propiedad de un prototype, y no tiene la propiedad en sí, la propiedad no puede ser eliminada por referencia al objeto. Aun así, puedes eliminarla directamente en el prototype.</p>
-
-<p>If the object inherits a property from a prototype, and doesn't have the property itself, the property can't be deleted by referencing the object. You can, however, delete it directly on the prototype.</p>
-
-<pre class="brush: js">function Foo(){}
-Foo.prototype.bar = 42;
-var foo = new Foo();
-
-// retorna true, pero sin ningún efecto,
-// ya que bar es una propiedad heredada
-delete foo.bar;
-
-// logs 42, propiedad aún heredada
-console.log(foo.bar);
-
-// elimina la propiedad en el prototype
-delete Foo.prototype.bar;
-
-// logs "undefined", propiedad no heredada
-console.log(foo.bar);           </pre>
-
-<h3 id="Deleting_array_elements" name="Deleting_array_elements">Eliminando elementos de un array</h3>
-
-<p>Cuando eliminas un elemento de un array, la longitud del array no se ve afectada. Esta se mantiene incluso si eliminas el último elemento del array.</p>
-
-<p>Cuando el operador <code>delete</code> elimina un elemento de un array, este elemento ya no está en el array. En el siguiente ejemplo, <code>trees[3]</code> es eliminado mediante <code>delete</code>.</p>
-
-<pre class="brush: js">var trees = ["redwood","bay","cedar","oak","maple"];
-delete trees[3];
-if (3 in trees) {
-    // esto no se ejecuta
-}</pre>
-
-<p>Si quieres que exista un elemento de un array pero que tengo un valor no definido, utiliza el valor <code>undefined</code> en vez del operador <code>delete</code>. En el siguiente ejemplo, <code>trees[3]</code> es asignado con el valor <code>undefined</code>, pero el elemento del array aún existe:</p>
-
-<pre class="brush: js">var trees = ["redwood","bay","cedar","oak","maple"];
-trees[3] = undefined;
-if (3 in trees) {
-    // esto se ejecuta
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Standard</td>
-   <td>Definición inicial. Implementado en JavaScript 1.2</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.4.1', 'The delete Operator')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-delete-operator', 'The delete Operator')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegador">Compatibilidad de navegador</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Temporal dead zone</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop(36)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{ CompatVersionUnknown() }}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Temporal dead zone</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoMobile(36)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Cross-browser_issues">Cross-browser issues</h3>
-
-<p>Although ECMAScript makes iteration order of objects implementation-dependent, it may appear that all major browsers support an iteration order based on the earliest added property coming first (at least for properties not on the prototype). However, in the case of Internet Explorer, when one uses <code>delete</code> on a property, some confusing behavior results, preventing other browsers from using simple objects like object literals as ordered associative arrays. In Explorer, while the property <em>value</em> is indeed set to undefined, if one later adds back a property with the same name, the property will be iterated in its <em>old</em> position--not at the end of the iteration sequence as one might expect after having deleted the property and then added it back.</p>
-
-<p>So, if you want to simulate an ordered associative array in a cross-browser environment, you are forced to either use two separate arrays (one for the keys and the other for the values), or build an array of single-property objects, etc.</p>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li><a href="http://perfectionkills.com/understanding-delete/">Análisis en profundidad sobre delete</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/destructuring_assignment/index.html b/files/es/web/javascript/referencia/operadores/destructuring_assignment/index.html
deleted file mode 100644
index b56e3d3b52..0000000000
--- a/files/es/web/javascript/referencia/operadores/destructuring_assignment/index.html
+++ /dev/null
@@ -1,442 +0,0 @@
----
-title: La desestructuración
-slug: Web/JavaScript/Referencia/Operadores/Destructuring_assignment
-tags:
-  - Característica del lenguaje
-  - Desestructuración
-  - Desestructurar arreglos y objetos anidados
-  - ECMAScript 2015
-  - ES6
-  - JavaScript
-  - Objetos anidados y desestructuración de array
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators/Destructuring_assignment
----
-<div>{{jsSidebar("Operators", "Operadores")}}</div>
-
-<p>La sintaxis de <strong>desestructuración</strong> es una expresión de JavaScript que permite desempacar valores de arreglos o propiedades de objetos en distintas variables.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-destructuringassignment.html", "taller")}}</div>
-
-<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush:js notranslate">let a, b, rest;
-[a, b] = [10, 20];
-console.log(a); // 10
-console.log(b); // 20
-
-[a, b, ...rest] = [10, 20, 30, 40, 50];
-console.log(a); // 10
-console.log(b); // 20
-console.log(rest); // [30, 40, 50]
-
-({ a, b } = { a: 10, b: 20 });
-console.log(a); // 10
-console.log(b); // 20
-
-
-// Propuesta de etapa 4 (terminada)
-({a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40});
-console.log(a); // 10
-console.log(b); // 20
-console.log(rest); // {c: 30, d: 40}
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Las expresiones de objetos y arreglos literales proporcionan una manera fácil de crear paquetes de datos <em>ad hoc</em>.</p>
-
-<pre class="brush: js notranslate">const x = [1, 2, 3, 4, 5];</pre>
-
-<p>La desestructuración utiliza una sintaxis similar, pero en el lado izquierdo de la asignación para definir qué valores desempacar de la variable origen.</p>
-
-<pre class="brush: js notranslate">const x = [1, 2, 3, 4, 5];
-const [y, z] = x;
-console.log(y); // 1
-console.log(z); // 2
-</pre>
-
-<p>Esta capacidad es similar a las características presentes en lenguajes como Perl y Python.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Desestructuración_de_arreglos">Desestructuración de arreglos</h3>
-
-<h4 id="Asignación_básica_de_variables">Asignación básica de variables</h4>
-
-<pre class="brush: js notranslate">const foo = ['one', 'two', 'three'];
-
-const [red, yellow, green] = foo;
-console.log(red); // "one"
-console.log(yellow); // "two"
-console.log(green); // "three"
-</pre>
-
-<h4 id="Asignación_separada_de_la_declaración">Asignación separada de la declaración</h4>
-
-<p>A una variable se le puede asignar su valor mediante una desestructuración separada de la declaración de la variable.</p>
-
-<pre class="brush:js notranslate">let a, b;
-
-[a, b] = [1, 2];
-console.log(a); // 1
-console.log(b); // 2
-</pre>
-
-<h4 id="Valores_predeterminados">Valores predeterminados</h4>
-
-<p>A una variable se le puede asignar un valor predeterminado, en el caso de que el valor desempacado del arreglo sea <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">let a, b;
-
-[a=5, b=7] = [1];
-console.log(a); // 1
-console.log(b); // 7
-</pre>
-
-<h4 id="Intercambio_de_variables">Intercambio de variables</h4>
-
-<p>Los valores de dos variables se pueden intercambiar en una expresión de desestructuración.</p>
-
-<p>Sin desestructurar la asignación, intercambiar dos valores requiere una variable temporal (o, en algunos lenguajes de bajo nivel, el algoritmo del <a class="external" href="https://en.wikipedia.org/wiki/XOR_swap_algorithm">truco XOR-swap</a>).</p>
-
-<pre class="brush:js notranslate">let a = 1;
-let b = 3;
-
-[a, b] = [b, a];
-console.log(a); // 3
-console.log(b); // 1
-
-const arr = [1,2,3];
-[arr[2], arr[1]] = [arr[1], arr[2]];
-console.log(arr); // [1,3,2]
-
-</pre>
-
-<h4 id="Analizar_un_arreglo_devuelto_por_una_función">Analizar un arreglo devuelto por una función</h4>
-
-<p>Siempre ha sido posible devolver un arreglo desde una función. La desestructuración puede hacer que trabajar con un valor de retorno de arreglo sea más conciso.</p>
-
-<p>En este ejemplo, <code>f()</code> devuelve los valores <code>[1, 2]</code> como su salida, que se puede procesar en una sola línea con desestructuración.</p>
-
-<pre class="brush:js notranslate">function f() {
-  return [1, 2];
-}
-
-let a, b;
-[a, b] = f();
-console.log(a); // 1
-console.log(b); // 2
-</pre>
-
-<h4 id="Ignorar_algunos_valores_devueltos">Ignorar algunos valores devueltos</h4>
-
-<p>Puedes ignorar los valores de retorno que no te interesan:</p>
-
-<pre class="brush:js notranslate">function f() {
-  return [1, 2, 3];
-}
-
-const [a, , b] = f();
-console.log(a); // 1
-console.log(b); // 3
-
-const [c] = f();
-console.log(c); // 1
-</pre>
-
-<p>También puedes ignorar todos los valores devueltos:</p>
-
-<pre class="brush:js notranslate">[,,] = f();
-</pre>
-
-<h4 id="Asignar_el_resto_de_un_arreglo_a_una_variable">Asignar el resto de un arreglo a una variable</h4>
-
-<p>Al desestructurar un arreglo, puedes desempacar y asignar la parte restante a una variable usando el patrón <code>rest</code>o:</p>
-
-<pre class="brush: js notranslate">const [a, ...b] = [1, 2, 3];
-console.log(a); // 1
-console.log(b); // [2, 3]</pre>
-
-<p>Ten en cuenta que se lanzará un {{jsxref("SyntaxError")}} si se usa una coma final en el lado derecho con un elemento <code>rest</code>o:</p>
-
-<pre class="brush: js example-bad notranslate">const [a, ...b,] = [1, 2, 3];
-
-// SyntaxError: el elemento rest no puede tener una coma al final
-// Siempre considera usar el operador rest como último elemento
-</pre>
-
-<h4 id="Desempacar_valores_coincidentes_con_una_expresión_regular">Desempacar valores coincidentes con una expresión regular</h4>
-
-<p>Cuando el método de expresión regular {{jsxref("Global_Objects/RegExp/exec", "exec()", "", 1)}} encuentra una coincidencia, devuelve un arreglo que contiene primero toda la parte coincidente de la cadena y luego las partes de la cadena que coinciden con cada grupo entre paréntesis en la expresión regular. La desestructuración te permite desempacar fácilmente las partes de este arreglo, ignorando la coincidencia completa si no es necesaria.</p>
-
-<pre class="brush:js notranslate">function parseProtocol(url) {
-  const parsedURL = /^(\w+)\:\/\/([^\/]+)\/(.*)$/.exec(url);
-  if (!parsedURL) {
-    return false;
-  }
-  console.log(parsedURL);
-  // ["https://developer.mozilla.org/es/Web/JavaScript",
-      "https", "developer.mozilla.org", "es/Web/JavaScript"]
-
-  const [, protocol, fullhost, fullpath] = parsedURL;
-  return protocol;
-}
-
-console.log(parseProtocol('https://developer.mozilla.org/es/Web/JavaScript'));
-// "https"
-</pre>
-
-<h3 id="Desestructuración_de_objetos">Desestructuración de objetos</h3>
-
-<h4 id="Asignación_básica">Asignación básica</h4>
-
-<pre class="brush: js notranslate">const user = {
-    id: 42,
-    is_verified: true
-};
-
-const {id, is_verified} = user;
-
-console.log(id); // 42
-console.log(is_verified); // true
-</pre>
-
-<h4 id="Asignación_sin_declaración">Asignación sin declaración</h4>
-
-<p>A una variable se le puede asignar su valor con desestructuración separada de su declaración.</p>
-
-<pre class="brush:js notranslate">let a, b;
-
-({a, b} = {a: 1, b: 2});</pre>
-
-<div class="note">
-<p><strong>Notas</strong>: los paréntesis <code>(...)</code> alrededor de la declaración de asignación son obligatorios cuando se usa la desestructuración de un objeto literal sin una declaración.</p>
-
-<p><code>{a, b} = {a: 1, b: 2}</code> no es una sintaxis independiente válida, debido a que <code>{a, b}</code> en el lado izquierdo se considera un bloque y no un objeto literal.</p>
-
-<p>Sin embargo, <code>({a, b} = {a: 1, b: 2})</code> es válido, al igual que <code>const {a, b} = {a: 1, b: 2}</code></p>
-
-<p>tu expresión <code>( ... )</code> debe estar precedida por un punto y coma o se puede usar para ejecutar una función en la línea anterior.</p>
-</div>
-
-<h4 id="Asignar_a_nuevos_nombres_de_variable">Asignar a nuevos nombres de variable</h4>
-
-<p>Una propiedad se puede desempacar de un objeto y asignar a una variable con un nombre diferente al de la propiedad del objeto.</p>
-
-<pre class="brush: js notranslate">const o = {p: 42, q: true};
-const {p: foo, q: bar} = o;
-
-console.log(foo); // 42
-console.log(bar); // true</pre>
-
-<p>Aquí, por ejemplo, <code>const {p: foo} = o</code> toma del objeto <code>o</code> la propiedad llamada <code>p</code> y la asigna a una variable local llamada <code>foo</code>.</p>
-
-<h4 id="Valores_predeterminados_2">Valores predeterminados</h4>
-
-<p>A una variable se le puede asignar un valor predeterminado, en el caso de que el valor desempacado del objeto sea <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">const {a = 10, b = 5} = {a: 3};
-
-console.log(a); // 3
-console.log(b); // 5</pre>
-
-<h4 id="Asignar_nombres_a_nuevas_variables_y_proporcionar_valores_predeterminados">Asignar nombres a nuevas variables y proporcionar valores predeterminados</h4>
-
-<p>Una propiedad puede ser ambas</p>
-
-<ul>
- <li>Desempacada de un objeto y asignada a una variable con un nombre diferente.</li>
- <li>Se le asigna un valor predeterminado en caso de que el valor desempacado sea <code>undefined</code>.</li>
-</ul>
-
-<pre class="brush: js notranslate">const {a: aa = 10, b: bb = 5} = {a: 3};
-
-console.log(aa); // 3
-console.log(bb); // 5
-</pre>
-
-<h4 id="Desempacar_campos_de_objetos_pasados_como_parámetro_de_función">Desempacar campos de objetos pasados como parámetro de función</h4>
-
-<pre class="brush:js notranslate">const user = {
-  id: 42,
-  displayName: 'jdoe',
-  fullName: {
-    firstName: 'John',
-    lastName: 'Doe'
-  }
-};
-
-function userId({id}) {
-  return id;
-}
-
-function whois({displayName, fullName: {firstName: name}}) {
-  return `${displayName} es ${name}`;
-}
-
-console.log(userId(user)); // 42
-console.log(whois(user));  // "jdoe es John"</pre>
-
-<p>Esto desempaca el <code>id</code>, <code>displayName</code> y <code>firstName</code> del objeto <code>user</code> y los imprime.</p>
-
-<h4 id="Establecer_el_valor_predeterminado_de_un_parámetro_de_función">Establecer el valor predeterminado de un parámetro de función</h4>
-
-<pre class="brush: js notranslate">function drawChart({size = 'big', coords = {x: 0, y: 0}, radius = 25} = {}) {
-  console.log(size, coords, radius);
-  // haz un dibujo de gráfico
-}
-
-drawChart({
-  coords: {x: 18, y: 30},
-  radius: 30
-});</pre>
-
-<div class="note">
-<p>En la firma de la función para <strong><code>drawChart</code></strong> anterior, el lado izquierdo desestructurado se asigna a un objeto literal vacío en el lado derecho: <code>{size = 'big', coords = {x: 0, y: 0}, radius = 25} = {}</code>. También podrías haber escrito la función sin la asignación del lado derecho. Sin embargo, si omites la asignación del lado derecho, la función buscará al menos un argumento para ser proporcionado cuando se invoca, mientras que en su forma actual, simplemente puedes llamar a <code><strong>drawChart()</strong></code> sin proporcionar ningún parámetro. El diseño actual es útil si deseas poder llamar a la función sin proporcionar ningún parámetro, el otro puede ser útil cuando deseas asegurarte de que se pase un objeto a la función.</p>
-</div>
-
-<h4 id="Desestructuración_de_arreglos_y_objetos_anidados">Desestructuración de arreglos y objetos anidados</h4>
-
-<pre class="brush:js notranslate">const metadata = {
-  title: 'Scratchpad',
-  translations: [
-    {
-      locale: 'de',
-      localization_tags: [],
-      last_edit: '2020-08-29T08:43:37',
-      url: '/de/docs/Tools/Scratchpad',
-      title: 'JavaScript-Umgebung'
-    }
-  ],
-  url: '/es/docs/Tools/Scratchpad'
-};
-
-let {
-  title: englishTitle, // renombrar
-  translations: [
-    {
-       title: localeTitle, // renombrar
-    },
-  ],
-} = metadata;
-
-console.log(englishTitle); // "Scratchpad"
-console.log(localeTitle);  // "JavaScript-Umgebung"</pre>
-
-<h4 id="Iteración_for...of_y_desestructuración">Iteración "<code>for...of</code>" y desestructuración</h4>
-
-<pre class="brush: js notranslate">const people = [
-  {
-    name: 'Mike Smith',
-    family: {
-      mother: 'Jane Smith',
-      father: 'Harry Smith',
-      sister: 'Samantha Smith'
-    },
-    age: 35
-  },
-  {
-    name: 'Tom Jones',
-    family: {
-      mother: 'Norah Jones',
-      father: 'Richard Jones',
-      brother: 'Howard Jones'
-    },
-    age: 25
-  }
-];
-
-for (const {name: n, family: {father: f}} of people) {
-  console.log('Nombre: ' + n + ', Padre: ' + f);
-}
-
-// "Nombre: Mike Smith, Padre: Harry Smith"
-// "Nombre: Tom Jones, Padre: Richard Jones"
-</pre>
-
-<h4 id="Nombres_de_propiedades_de_objetos_calculados_y_desestructuración">Nombres de propiedades de objetos calculados y desestructuración</h4>
-
-<p>Los nombres de propiedad calculados, como en un {{jsxref("Operators/Object_initializer", "Objeto literal", "#Computed_property_names", 1)}}, se pueden usar con la desestructuración.</p>
-
-<pre class="brush: js notranslate">let key = 'z';
-let {[key]: foo} = {z: 'bar'};
-
-console.log(foo); // "bar"
-</pre>
-
-<h4 id="Rest_en_la_desestructuración_de_objetos"><code>Rest</code> en la desestructuración de objetos</h4>
-
-<p>La propuesta <a class="external external-icon" href="https://github.com/tc39/proposal-object-rest-spread">Propiedades <code>rest</code>/propagación para ECMAScript</a> (etapa 4) agrega la sintaxis {{jsxref("Functions/rest_parameters", "rest", "", 1)}} para desestructurar. Las propiedades de <code>rest</code> recopilan las claves de propiedades enumerables restantes que aún no han sido seleccionadas por el patrón de desestructuración.</p>
-
-<pre class="brush: js notranslate">let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40}
-a; // 10
-b; // 20
-rest; // { c: 30, d: 40 }</pre>
-
-<h4 id="Identificador_de_JavaScript_no_válido_como_nombre_de_propiedad">Identificador de JavaScript no válido como nombre de propiedad</h4>
-
-<p>La desestructuración se puede utilizar con nombres de propiedad que no son {{Glossary("Identifier", "identificadores")}} válidos en JavaScript proporcionando un identificador alternativo que sea válido.</p>
-
-<pre class="brush: js notranslate">const foo = { 'fizz-buzz': true };
-const { 'fizz-buzz': fizzBuzz } = foo;
-
-console.log(fizzBuzz); // "true"
-</pre>
-
-<h4 id="Desestructuración_combinada_de_arreglos_y_objetos">Desestructuración combinada de arreglos y objetos</h4>
-
-<p>La desestructuración de arreglos y objetos se puede combinar. Supongamos que deseas manipular el tercer elemento del siguiente arreglo <code>props</code>, y luego deseas la propiedad <code>name</code> en el objeto, puedes hacer lo siguiente:</p>
-
-<pre class="brush: js notranslate">const props = [
-  { id: 1, name: 'Fizz'},
-  { id: 2, name: 'Buzz'},
-  { id: 3, name: 'FizzBuzz'}
-];
-
-const [,, { name }] = props;
-
-console.log(name); // "FizzBuzz"
-</pre>
-
-<h4 id="Se_busca_la_cadena_de_prototipos_al_desestructurar_el_objeto.">Se busca la cadena de prototipos al desestructurar el objeto.</h4>
-
-<p>Al deconstruir un objeto, si no se accede a una propiedad en sí misma, continuará buscando a lo largo de la cadena de prototipos.</p>
-
-<pre class="brush: js notranslate">let obj = {self: '123'};
-obj.__proto__.prot = '456';
-const {self, prot} = obj;
-// self "123"
-// prot "456" (Acceso a la cadena de prototipos)</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-destructuring-assignment', 'Desestructuración de asignación')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.operators.destructuring")}}</p>
-</div>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Operators/Assignment_Operators", "Operadores de asignación", "", 1)}}</li>
- <li><a href="https://hacks.mozilla.org/2015/05/es6-in-depth-destructuring/">"ES6 en profundidad: Desestructuración" en hacks.mozilla.org</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/division/index.html b/files/es/web/javascript/referencia/operadores/division/index.html
deleted file mode 100644
index d29816e37a..0000000000
--- a/files/es/web/javascript/referencia/operadores/division/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Division (/)
-slug: Web/JavaScript/Referencia/Operadores/Division
-tags:
-  - JS
-  - JavaScript
-  - Operador de Division
-  - Operadores
-  - Referências
-translation_of: Web/JavaScript/Reference/Operators/Division
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de división (<code>/</code>) produce el cociente de sus operandos donde el operando izquierdo es el dividendo y el operando derecho es el divisor.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-division.html")}}</div>
-
-<div></div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> <var>x</var> / <var>y</var>
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Division_basica">Division basica</h3>
-
-<pre class="brush: js notranslate">1 / 2              // 0.5
-
-Math.floor(3 / 2) // 1
-
-1.0 / 2.0         // 0.5
-</pre>
-
-<h3 id="Division_por_cero">Division por cero</h3>
-
-<pre class="brush: js notranslate">2.0 / 0     // Retorna Infinity
-
-2.0 / 0.0   // Retorna Infinity, Dado que 0.0 === 0
-
-2.0 / -0.0  // Retorna -Infinity</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-multiplicative-operators', 'Division operator')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_Navegadores">Compatibilidad con Navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.division")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/encadenamiento_opcional/index.html b/files/es/web/javascript/referencia/operadores/encadenamiento_opcional/index.html
deleted file mode 100644
index 06ccb5a999..0000000000
--- a/files/es/web/javascript/referencia/operadores/encadenamiento_opcional/index.html
+++ /dev/null
@@ -1,187 +0,0 @@
----
-title: Encadenamiento opcional
-slug: Web/JavaScript/Referencia/Operadores/Encadenamiento_opcional
-translation_of: Web/JavaScript/Reference/Operators/Optional_chaining
----
-<div>{{JSSidebar("Operators")}}</div>
-
-<p>El operador de <strong>encadenamiento opcional</strong> <strong><code>?.</code></strong> permite leer el valor de una propiedad ubicada dentro de una cadena de objetos conectados sin tener que validar expresamente que cada referencia en la cadena sea válida. <span class="seoSummary">El operador <code>?.</code> funciona de manera similar a el operador de encadenamiento <code>.</code>, excepto que en lugar de causar un error si una referencia es <a href="/en-US/docs/Glossary/nullish">casi-nula</a> ({{JSxRef("null")}} o {{JSxRef("undefined")}}), la expresión hace una evaluación de circuito corto con un valor de retorno de <code>undefined</code>.</span> Cuando se usa con llamadas a funciones, devuelve <code>undefined</code> si la función dada no existe.</p>
-
-<p>Esto da como resultado expresiones más cortas y simples cuando se accede a propiedades encadenadas dónde existe la posibilidad de que falte una referencia. También puede ser útil al explorar el contenido de un objeto cuando no hay una garantía conocida de qué propiedades se requieren.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-optionalchainingoperator.html", "taller")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><var>obj</var>?.<var>prop</var>
-<var>obj</var>?.[<var>expr</var>]
-<em>arr</em>?.[<var>index</var>]
-<var>func</var>?.(<var>args</var>)
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El operador de encadenamiento opcional proporciona una forma de simplificar el acceso a los valores a través de objetos conectados cuando es posible que una referencia o función sea <code>undefined</code> o <code>null</code>.</p>
-
-<p>Por ejemplo, considere un objeto <code>obj</code> que tiene una estructura anidada. Sin encadenamiento opcional, buscar una subpropiedad profundamente anidada requiere validar las referencias intermedias, como:</p>
-
-<pre class="brush: js">let nestedProp = obj.first &amp;&amp; obj.first.second;
-</pre>
-
-<p>Se confirma que el valor de <code>obj.first</code> no es <code>null</code> (y no es <code>undefined</code>) antes de acceder al valor de <code>obj.first.second</code>. Esto evita el error que ocurriría si simplemente accediera a <code>obj.first.second</code> directamente sin probar <code>obj.first</code>.</p>
-
-<p>Sin embargo, con el operador de encadenamiento opcional (<code>?.</code>), No tiene que probar explícitamente, ni realizar una evaluación de circuito corto basada en el estado de <code>obj.first</code> antes de intentar acceder a <code>obj.first.second</code>:</p>
-
-<pre class="brush: js">let nestedProp = obj.first?.second;
-</pre>
-
-<p>Al usar el operador <code>?.</code> en lugar de solo el <code>.</code>, JavaScript sabe verificar implícitamente para asegurarse de que <code>obj.first</code> no es <code>null</code> o <code>undefined</code> antes de intentar acceder  <code>obj.first.second</code>. Si <code>obj.first</code> es <code>null</code> o <code>undefined</code>, la expresión hace una evaluación de circuito corto automáticamente y retorna <code>undefined</code>.</p>
-
-<p>Esto es equivalente a lo siguiente, excepto que la variable temporal es de hecho no creada:</p>
-
-<pre class="brush: js">let temp = obj.first;
-let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.second);
-</pre>
-
-<h3 id="Encadenamiento_opcional_con_llamadas_a_funciones">Encadenamiento opcional con llamadas a funciones</h3>
-
-<p>Puede usar el encadenamiento opcional cuando intente llamar a un método que puede no existir. Esto puede ser útil, por ejemplo, cuando se usa una API en la que un método podría no estar disponible, ya sea debido a la antigüedad de la implementación o debido a una característica que no está disponible en el dispositivo del usuario.</p>
-
-<p>El uso de encadenamiento opcional con llamadas a funciones hace que la expresión regrese automáticamente <code>undefined</code> en lugar de lanzar una excepción si no se encuentra el método:</p>
-
-<pre class="brush: js">let result = someInterface.customMethod?.();</pre>
-
-<div class="blockIndicator note">
-<p><strong>Nota:</strong> Si hay una propiedad con ese nombre y que no es una función, usar <code>?.</code> aún levantará una excepción {{JSxRef("TypeError")}} (<code>x.y</code><code> is not a function</code>).</p>
-</div>
-
-<h4 id="Manejo_de_callbacks_opcionales_o_manejadores_de_eventos">Manejo de callbacks opcionales o manejadores de eventos</h4>
-
-<p>Si utiliza callbacks o métodos de recuperación de un objeto con<a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring"> una asignación de desestructuración</a>, es posible que tenga valores inexistentes que no puede llamar como funciones a menos que haya probado su existencia. Usando <code>?.</code>, Puede evitar esta prueba adicional:</p>
-
-<pre class="brush: js">// Escrito a partir de ES2019
-function doSomething(onContent, onError) {
-  try {
-    // ... hacer algo con los datos
-  }
-  catch (err) {
-    if (onError) { // Probando si onError realmente existe
-      onError(err.message);
-    }
-  }
-}
-</pre>
-
-<pre class="brush: js">// Usando encadenamiento opcional con llamado de funciones
-function doSomething(onContent, onError) {
-  try {
-   // ... hacer algo con los datos
-  }
-  catch (err) {
-    onError?.(err.message); // Sin excepción si onError esta undefined
-  }
-}
-</pre>
-
-<h3 id="Encadenamiento_opcional_con_expresiones">Encadenamiento opcional con expresiones</h3>
-
-<p>También puede usar el operador de encadenamiento opcional al acceder a propiedades con una expresión usando <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors#Bracket_notation">la notación de corchetes</a>:</p>
-
-<pre class="brush: js">let nestedProp = obj?.['prop' + 'Name'];
-</pre>
-
-<h3 id="El_encadenamiento_opcional_no_es_válido_al_lado_izquierdo_de_una_asignación">El encadenamiento opcional no es válido al lado izquierdo de una asignación</h3>
-
-<pre class="brush: js"><code>let object = {};
-object?.property = 1; // Uncaught SyntaxError: Invalid left-hand side in assignment</code></pre>
-
-<h3 id="Acceso_a_elementos_de_un_arreglo_con_encadenamiento_opcional">Acceso a elementos de un arreglo con encadenamiento opcional</h3>
-
-<pre class="brush: js">let arrayItem = arr?.[42];</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_básico">Ejemplo básico</h3>
-
-<p>Este ejemplo busca el valor de la propiedad <code>name</code> para el miembro <code>bar</code> en un mapa cuando no existe dicho miembro. El resultado es por lo tanto es <code>undefined</code>.</p>
-
-<pre class="brush: js">let myMap = new Map();
-myMap.set("foo", {name: "baz", desc: "inga"});
-
-let nameBar = myMap.get("bar")?.name;</pre>
-
-<h3 id="Evaluación_de_circuito_corto">Evaluación de circuito corto</h3>
-
-<p>Cuando se usa el encadenamiento opcional con expresiones, si el operando izquierdo es <code>null</code> o <code>undefined</code>, la expresión no se evaluará. Por ejemplo:</p>
-
-<pre class="brush: js">let potentiallyNullObj = null;
-let x = 0;
-let prop = potentiallyNullObj?.[x++];
-
-console.log(x); // 0 como x no se incrementó
-</pre>
-
-<h3 id="Apilando_el_operador_de_encadenamiento_opcional">Apilando el operador de encadenamiento opcional</h3>
-
-<p>Con estructuras anidadas, es posible usar encadenamiento opcional varias veces:</p>
-
-<pre class="brush: js">let customer = {
-  name: "Carl",
-  details: {
-    age: 82,
-    location: "Paradise Falls" // "detailed address" es desconocida
-  }
-};
-let customerCity = customer.details?.address?.city;
-
-// … esto también funciona con la función opcional de encadenamiento
-let duration = vacations.trip?.getTime?.();
-</pre>
-
-<h3 id="Combinando_con_el_operador_de_fusión_nulo">Combinando con el operador de fusión nulo</h3>
-
-<p>El {{JSxRef("Operators/Nullish_Coalescing_Operator", "operador de fusión nulo", '', 1)}} se puede usar después del encadenamiento opcional para generar un valor predeterminado cuando no se encontró ninguno:</p>
-
-<pre class="brush: js">let customer = {
-  name: "Carl",
-  details: { age: 82 }
-};
-const customerCity = customer?.city ?? "Unknown city";
-console.log(customerCity); // Unknown city</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#prod-OptionalExpression', 'optional expression')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.operators.optional_chaining")}}</p>
-</div>
-
-<h3 id="Progreso_de_implementación">Progreso de implementación</h3>
-
-<p>La siguiente tabla proporciona un estado de implementación diaria para esta característica, porque esta característica aún no ha alcanzado la estabilidad entre navegadores. Los datos se generan ejecutando las pruebas de características relevantes en <a href="https://github.com/tc39/test262">Test262</a>, el conjunto de pruebas estándar de JavaScript, en la compilación nocturna o la última versión del motor de JavaScript de cada navegador.</p>
-
-<div>{{EmbedTest262ReportResultsTable("optional-chaining")}}</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>El {{JSxRef("Operators/Nullish_Coalescing_Operator", "Nullish Coalescing Operator", '', 1)}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/function/index.html b/files/es/web/javascript/referencia/operadores/function/index.html
deleted file mode 100644
index d5739239b2..0000000000
--- a/files/es/web/javascript/referencia/operadores/function/index.html
+++ /dev/null
@@ -1,73 +0,0 @@
----
-title: function
-slug: Web/JavaScript/Referencia/Operadores/function
-tags:
-  - Function
-  - JavaScript
-  - Operator
-  - Primary Expressions
-translation_of: Web/JavaScript/Reference/Operators/function
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>El operador <code>function</code> define una función dentro de una expresión.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="eval">function [<em>name</em>]([<em>param1</em>, <em>param2</em>, ..., <em>paramN</em>]) {
-   <em>statements</em>
-}
-</pre>
-
-<h2 id="Parameters" name="Parameters">Parámetros</h2>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>El nombre de la función. Puede ser omitido, en cuyo caso la función es <em>anonymous</em>. El nombre sólo es local para el cuerpo de la función.</dd>
-</dl>
-
-<dl>
- <dt><code>paramN</code></dt>
- <dd>El nombre de un argumento que será pasado a la función. Una función puede tener hasta 255 argumentos.</dd>
-</dl>
-
-<dl>
- <dt><code>statements</code></dt>
- <dd>Las declaraciones que conforman el cuerpo de la función.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>La expresión de una función es muy similar y tiene casi la misma sintaxis que la declaración de una función (véase {{jsxref("Sentencias/function", "function")}} para más detalles). Véase <a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a> para ver más información sobre las diferencias  entre declaraciones de funciones y expresiones de funciones.</p>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<p>El siguiente ejemplo define una función sin nombre y se le asigna a la variable x. La función devuelve como resultado el cuadrado de su argumento:</p>
-
-<pre class="brush: js">var x = function(y) {
-   return y * y;
-};
-</pre>
-
-<h3 id="Expresión_de_función_nombrada">Expresión de función nombrada</h3>
-
-<p>Si quiere referirse a la función actual dentro del cuerpo de la función, debe crear una expresión de función nombrada. Luego, este nombre será local solo para el cuerpo de la función (alcance). Esto también evita usar la propiedad no estándar {{jsxref("Funciones/arguments/callee", "arguments.callee")}}.</p>
-
-<pre class="brush: js">var math = {
-  'factorial': function factorial(n) {
-    if (n &lt;= 1)
-      return 1;
-    return n * factorial(n - 1);
-  }
-};
-</pre>
-
-<h2 id="See_also" name="See_also">Consulte también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
- <li>{{jsxref("Function")}}</li>
- <li>Sentencias {{jsxref("Sentencias/function", "function")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/function_star_/index.html b/files/es/web/javascript/referencia/operadores/function_star_/index.html
deleted file mode 100644
index 9c38872b7e..0000000000
--- a/files/es/web/javascript/referencia/operadores/function_star_/index.html
+++ /dev/null
@@ -1,91 +0,0 @@
----
-title: expresión function*
-slug: Web/JavaScript/Referencia/Operadores/function*
-tags:
-  - ECMAScript 2015
-  - Expresión Primaria
-  - Function
-  - Iterator
-  - JavaScript
-  - Operator
-translation_of: Web/JavaScript/Reference/Operators/function*
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>La palabra clave <strong><code>function*</code></strong> puede ser utilizada para definir una función generadora en una expresión.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-functionasteriskexpression.html")}}</div>
-
-<p class="hidden">El código fuente de este ejemplo interactivo se encuentra almacenado en un repositorio GitHub. Si le gustaría contribuir al proyecto de ejemplos interactivos, por favor clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíenos un pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">function* [<em>nombre</em>]([<em>param1</em>[, <em>param2[</em>, ..., <em>paramN</em>]]]) {
-   <em>sentencias</em>
-}</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>nombre</code></dt>
- <dd>Nombre de la función. Puede ser omitido, en cuyo caso la funcipón es <em>anínima</em>. El nombre sólo es local al cuerpo de la función.</dd>
- <dt><code>paramN</code></dt>
- <dd>Nombre de un parámetro a ser pasado a la función. Una función puede tener hasta 255 argumentos.</dd>
- <dt><code>sentencias</code></dt>
- <dd>Sentencias que componen el cuerpo de la función.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Una expresión <code>function*</code> es muy similar y tiene casi la misma sintaxis que una {{jsxref('Statements/function*', 'function* statement')}}. La principal diferencia entre una expresión <code>function*</code> y una sentencia <code>function*</code> es el <em>nombre de la función</em>, que en expresiones <code>function*</code> puede ser omitido para creaar funciones generadoras <em>anónimas</em>. Para más información vea también el capítulo acerca de <a href="/en-US/docs/Web/JavaScript/Reference/Functions">funciones</a>.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente ejemplo define una función generadora sin nombre y la asigna a <code>x</code>. La función produce el cuadrado de su argumento:</p>
-
-<pre class="brush: js">var x = function*(y) {
-   yield y * y;
-};
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#', 'function*')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición Inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#', 'function*')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada desde datos estructurados. Si usted desea contribuir a esos datos, por favor revise <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíenos un pull request.</div>
-
-<p>{{Compat("javascript.operators.function_star")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Statements/function*", "Sentencia function*")}}</li>
- <li>Objeto {{jsxref("GeneratorFunction")}}</li>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Iteration_protocols">El protocolo iterable</a></li>
- <li>{{jsxref("Operators/yield", "yield")}}</li>
- <li>{{jsxref("Operators/yield*", "yield*")}}</li>
- <li>Objeto {{jsxref("Function")}}</li>
- <li>{{jsxref("Statements/function", "Sentencia function")}}</li>
- <li>{{jsxref("Operators/function", "Expresión function")}}</li>
- <li>{{jsxref("Functions_and_function_scope", "Funciones y alcance de funciones")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/grouping/index.html b/files/es/web/javascript/referencia/operadores/grouping/index.html
deleted file mode 100644
index ec78e8518f..0000000000
--- a/files/es/web/javascript/referencia/operadores/grouping/index.html
+++ /dev/null
@@ -1,128 +0,0 @@
----
-title: Operador de agrupación
-slug: Web/JavaScript/Referencia/Operadores/Grouping
-tags:
-  - Expresiones primarias
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators/Grouping
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de agrupación <code>( )</code> controla la precedencia de las expresiones a evaluar.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"> ( )</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El operador de agrupación consiste en un par de paréntesis alrededor de la expresión (o sub-expresión) que sobrescribe el comportamiento por defecto de la <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">precedencia de operadores</a>, lo que causa que expresiones con menor precedencia puedan ser evaluadas antes que expresiones con una mayor precedencia.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Sobrescribir la precedencia de operadores aritméticos por defecto para que se evalúe primero la adición y luego la multiplicación.</p>
-
-<pre class="brush:js">var a = 1;
-var b = 2;
-var c = 3;
-
-// precedencia por defecto
-a + b * c     // 7
-// es evaluada por defecto como:
-a + (b * c)   // 7
-
-// ahora se sobrescribe la precedencia
-// para que la adición se evalúe antes que la multiplicación
-(a + b) * c   // 9
-
-// que es equivalente a:
-a * c + b * c // 9
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>ECMAScript 1st Edition.</td>
-   <td>Estándar</td>
-   <td>Definición inicial. Implementado en JavaScript 1.0</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.1.6', 'The Grouping Operator')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-grouping-operator', 'The Grouping Operator')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Temas_relacionados">Temas relacionados</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">Precedencia de operadores</a></li>
- <li>{{jsxref("Operators/delete", "delete")}}</li>
- <li>{{jsxref("Operators/typeof", "typeof")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/in/index.html b/files/es/web/javascript/referencia/operadores/in/index.html
deleted file mode 100644
index 051056a25f..0000000000
--- a/files/es/web/javascript/referencia/operadores/in/index.html
+++ /dev/null
@@ -1,139 +0,0 @@
----
-title: in
-slug: Web/JavaScript/Referencia/Operadores/in
-tags:
-  - JavaScript
-  - Operator
-  - Relational Operators
-translation_of: Web/JavaScript/Reference/Operators/in
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<div>El <strong>operador <code>in</code></strong> devuelve <code>true</code> si la propiedad especificada está en el objeto especificado o su prototipo.</div>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre><code><em>prop</em> in <em>object</em></code></pre>
-
-<h3 id="Parámetros" name="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>prop</code></dt>
- <dd>Una cadena o expresión númerica que representa el nombre de una propiedad o el índice de un array (lo que no sea un símbolo se forzará a string).</dd>
-</dl>
-
-<dl>
- <dt><code>object</code></dt>
- <dd>El objeto (o su cadena de prototipo) sobre el que comprobar si contiene la propiedad con el nombre especificado.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Los siguientes ejemplos muestran algunos de los usos del operador <code>in</code>.</p>
-
-<pre class="brush:js">// Arrays
-var arboles = new Array("secoya", "pino", "cedro", "roble", "arce");
-0 in arboles        // devuelve true
-3 in arboles        // devuelve true
-6 in arboles        // devuelve false
-"pino" in arboles   // devuelve false (debe especificar el número de índice,
-                    // no el valor del índice)
-"length" in arboles // devuelve true (length es una propiedad de Array)
-
-// Objetos predefinidos
-"PI" in Math        // devuelve true
-
-// Objetos personalizados
-var micoche = {marca: "Honda", modelo: "Accord", año: 1998};
-"marca" in micoche  // devuelve true
-"modelo" in micoche // devuelve true
-</pre>
-
-<p>Debe especificar un objeto en el lado derecho del operador <code>in</code>. Por ejemplo, puede especificar una cadena creada con el constructor <code>String</code> , pero no puede especificar una cadena literal.</p>
-
-<pre class="brush:js">var color1 = new String("verde");
-"length" in color1 // devuelve true
-
-var color2 = "coral";
-"length" in color2 // genera un error (color2 no es un objeto String)
-</pre>
-
-<h3 id="Using_in_with_deleted_or_undefined_properties" name="Using_in_with_deleted_or_undefined_properties">Usando <code>in</code> con propiedades eliminadas o no definidas</h3>
-
-<p>Si se elimina una propiedad con el operador {{jsxref("Operadores/delete", "delete")}}, el operador <code>in</code> devuelve <code>false</code> para esa propiedad.</p>
-
-<pre class="brush:js">var micoche= {marca: "Honda", modelo: "Accord", año: 1998};
-delete micoche.marca;
-"marca" in micoche;  // devuelve false
-
-var arboles = new Array("secoya", "pino", "cedro", "roble", "arce");
-delete arboles[3];
-3 in arboles; // devuelve false
-</pre>
-
-<p>Si se cambia una propiedad a {{jsxref("Objetos_globales/undefined", "undefined")}} pero no se elimina, el operador <code>in</code> devuelve true para esa propiedad.</p>
-
-<pre class="brush:js">var micoche = {marca: "Honda", modelo: "Accord", año: 1998};
-micoche.marca = undefined;
-"marca" in micoche;  // devuelve true
-</pre>
-
-<pre class="brush:js">var arboles = new Array("secayo", "pino", "cedro", "roble", "arce");
-arboles[3] = undefined;
-3 in arboles; // devuelve true
-</pre>
-
-<h3 id="Inherited_properties" name="Inherited_properties">Propiedades heredadas</h3>
-
-<p>El operador <code>in</code> devuelve <code>true</code> para propiedades en la cadena del prototipo.</p>
-
-<pre class="brush:js">"toString" in {}; // devuelve true
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-relational-operators', 'Relational Operators')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-relational-operators', 'Relational Operators')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.8.7', 'The in Operator')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3', '#sec-11.8.7', 'The in Operator')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td>Definición inicial. Implementado en JavaScript 1.4.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.in")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><code><a href="/es-ES/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></code></li>
- <li><code><a href="/es-ES/docs/Web/JavaScript/Reference/Operators/delete">delete</a></code></li>
- <li>{{jsxref("Object.prototype.hasOwnProperty()")}}</li>
- <li>{{jsxref("Reflect.has()")}}</li>
- <li><a href="/en-US/docs/Enumerability_and_ownership_of_properties">Enumerability and ownership of properties</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/index.html b/files/es/web/javascript/referencia/operadores/index.html
deleted file mode 100644
index dca4964faa..0000000000
--- a/files/es/web/javascript/referencia/operadores/index.html
+++ /dev/null
@@ -1,280 +0,0 @@
----
-title: Expresiones y operadores
-slug: Web/JavaScript/Referencia/Operadores
-tags:
-  - Descripción
-  - JavaScript
-  - Operadores
-  - Operators
-  - Referencia
-translation_of: Web/JavaScript/Reference/Operators
----
-<div>{{jsSidebar("Operators", "Operadores")}}</div>
-
-<p class="summary">Este capítulo documenta todos los operadores, expresiones y palabras clave del lenguaje JavaScript.</p>
-
-<h2 id="Expresiones_y_operadores_por_categoría">Expresiones y operadores por categoría</h2>
-
-<p>Para obtener una lista alfabética, consulta la barra lateral de la izquierda.</p>
-
-<h3 id="Expresiones_primarias">Expresiones primarias</h3>
-
-<p>Palabras clave básicas y expresiones generales en JavaScript.</p>
-
-<dl>
- <dt>{{jsxref("Operators/this", "this")}}</dt>
- <dd>La palabra clave <code>this</code> se refiere a una propiedad especial de un contexto de ejecución.</dd>
- <dt>{{jsxref("Operators/function", "function")}}</dt>
- <dd>La palabra clave <code>function</code> define una expresión de función.</dd>
- <dt>{{jsxref("Operators/class", "class")}}</dt>
- <dd>La palabra clave <code>class</code> define una expresión de clase.</dd>
- <dt>{{jsxref("Operators/function", "function")}}</dt>
- <dd>La palabra clave <code>function*</code> define una expresión de función generadora.</dd>
- <dt>{{jsxref("Operators/yield", "yield")}}</dt>
- <dd>Pausar y reanudar una función generadora.</dd>
- <dt>{{jsxref("Operators/yield*", "yield*")}}</dt>
- <dd>Delegar a otra función generadora u objeto iterable.</dd>
- <dt>{{jsxref("Operators/async_function", "async function")}}</dt>
- <dd>La <code>async function</code> define una expresión de función asíncrona.</dd>
- <dt>{{jsxref("Operators/await", "await")}}</dt>
- <dd>Pausa y reanuda una función asíncrona y espera la resolución/rechazo de la promesa.</dd>
- <dt>{{jsxref("Global_Objects/Array", "[]")}}</dt>
- <dd>Iniciador de arreglo/sintaxis literal.</dd>
- <dt>{{jsxref("Operators/Object_initializer", "{}")}}</dt>
- <dd>Iniciador de objeto/sintaxis literal.</dd>
- <dt>{{jsxref("Global_Objects/RegExp", "/ab+c/i")}}</dt>
- <dd>Sintaxis de expresión regular literal.</dd>
- <dt>{{jsxref("Operators/Grouping", "( )")}}</dt>
- <dd>Operador de agrupación.</dd>
-</dl>
-
-<h3 id="Expresiones_del_lado_izquierdo">Expresiones del lado izquierdo</h3>
-
-<p>Los valores de la izquierda son el destino de una asignación.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Property_accessors", "Propiedad accessors", "", 1)}}</dt>
- <dd>Los operadores miembro proporcionan acceso a una propiedad o método de un objeto<br>
- (<code>object.property</code> y <code>object["property"]</code>).</dd>
- <dt>{{jsxref("Operators/new", "new")}}</dt>
- <dd>El operador <code>new</code> crea una instancia auxiliado por un constructor.</dd>
- <dt>{{jsxref("Operators/new%2Etarget", "new.target")}}</dt>
- <dd>En los constructores, <code>new.target</code> se refiere al constructor que fue invocado por {{jsxref("Operators/new", "new")}}.</dd>
- <dt>{{jsxref("Operators/super", "super")}}</dt>
- <dd>La palabra clave <code>super</code> llama al constructor padre.</dd>
- <dt>{{jsxref("Operators/Spread_syntax", "...obj")}}</dt>
- <dd>La sintaxis de extensión permite expandir una expresión en lugares donde se esperan múltiples argumentos (para llamadas a funciones) o múltiples elementos (para arreglos literales).</dd>
-</dl>
-
-<h3 id="Incremento_y_decremento">Incremento y decremento</h3>
-
-<p>Operadores de incremento sufijo/prefijo y decremento sufijo/prefijo.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Increment", "A++")}}</dt>
- <dd>Operador de incremento sufijo.</dd>
- <dt>{{jsxref("Operators/Decrement", "A--")}}</dt>
- <dd>Operador de incremento sufijo.</dd>
- <dt>{{jsxref("Operators/Increment", "A++")}}</dt>
- <dd>Operador de incremento prefijo.</dd>
- <dt>{{jsxref("Operators/Decrement", "--A")}}</dt>
- <dd>Operador de decremento prefijo.</dd>
-</dl>
-
-<h3 id="Operadores_unarios">Operadores unarios</h3>
-
-<p>Una operación unaria es una operación con un solo operando.</p>
-
-<dl>
- <dt>{{jsxref("Operators/delete", "delete")}}</dt>
- <dd>El operador <code>delete</code> elimina una propiedad de un objeto.</dd>
- <dt>{{jsxref("Operators/void", "void")}}</dt>
- <dd>El operador <code>void</code> descarta el valor de retorno de una expresión.</dd>
- <dt>{{jsxref("Operators/typeof", "typeof")}}</dt>
- <dd>El operador <code>typeof</code> determina el tipo de un objeto dado.</dd>
- <dt>{{jsxref("Operators/Unary_plus", "+")}}</dt>
- <dd>El operador unario <code>más</code> convierte su operando al tipo <code>Number</code>.</dd>
- <dt>{{jsxref("Operators/Unary_negation", "-")}}</dt>
- <dd>El operador unario de negación convierte su operando al tipo <code>Number</code> y luego lo niega.</dd>
- <dt>{{jsxref("Operators/Bitwise_NOT", "~")}}</dt>
- <dd>Operador <code>NOT</code> bit a bit.</dd>
- <dt>{{jsxref("Operators/Logical_NOT", "!")}}</dt>
- <dd>Operador <code>NOT</code> lógico.</dd>
-</dl>
-
-<h3 id="Operadores_aritméticos">Operadores aritméticos</h3>
-
-<p>Los operadores aritméticos toman valores numéricos (ya sean literales o variables) como sus operandos y devuelven un solo valor numérico.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Addition", "+")}}</dt>
- <dd>Operador de adición o suma.</dd>
- <dt>{{jsxref("Operators/Subtraction", "-")}}</dt>
- <dd>Operador de sustracción o resta.</dd>
- <dt>{{jsxref("Operators/Division", "/")}}</dt>
- <dd>Operador de división.</dd>
- <dt>{{jsxref("Operators/Multiplication", "*")}}</dt>
- <dd>Operador de multiplicación.</dd>
- <dt>{{jsxref("Operators/Remainder", "%")}}</dt>
- <dd>Operador de residuo.</dd>
- <dt>{{jsxref("Operators/Exponentiation", "**")}}</dt>
- <dd>Operador de exponenciación.</dd>
-</dl>
-
-<h3 id="Operadores_relacionales">Operadores relacionales</h3>
-
-<p>Un operador de comparación compara sus operandos y devuelve un valor <code>Boolean</code> basado en si la comparación es verdadera o no.</p>
-
-<dl>
- <dt>{{jsxref("Operators/in", "in")}}</dt>
- <dd>El operador <code>in</code> determina si un objeto tiene una determinada propiedad.</dd>
- <dt>{{jsxref("Operators/instanceof", "instanceof")}}</dt>
- <dd>El operador <code>instanceof</code> determina si un objeto es una instancia de otro objeto.</dd>
- <dt>{{jsxref("Operators/Less_than", "&lt;")}}</dt>
- <dd>Operador menor que.</dd>
- <dt>{{jsxref("Operators/Greater_than", "&gt;")}}</dt>
- <dd>Operador mayor que.</dd>
- <dt>{{jsxref("Operators/Less_than_or_equal", "&lt;=")}}</dt>
- <dd>Operador menor o igual a.</dd>
- <dt>{{jsxref("Operators/Greater_than_or_equal", "&gt;=")}}</dt>
- <dd>Operador mayor o igual a.</dd>
-</dl>
-
-<div class="blockIndicator note">
-<p><strong>Nota: =&gt;</strong> no es un operador, sino la notación para {{jsxref("Functions/Arrow_functions", "Funciones de flecha")}}.</p>
-</div>
-
-<h3 id="Operadores_de_igualdad">Operadores de igualdad</h3>
-
-<p>El resultado de evaluar un operador de igualdad siempre es de tipo <code>Boolean</code> basado en si la comparación es verdadera.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Equality", "==")}}</dt>
- <dd>Operador de igualdad.</dd>
- <dt>{{jsxref("Operators/Inequality", "!=")}}</dt>
- <dd>Operador de desigualdad.</dd>
- <dt>{{jsxref("Operators/Strict_equality", "===")}}</dt>
- <dd>Operador de igualdad estricta.</dd>
- <dt>{{jsxref("Operators/Strict_inequality", "!==")}}</dt>
- <dd>Operador de desigualdad estricta.</dd>
-</dl>
-
-<h3 id="Operadores_de_desplazamiento_de_bits">Operadores de desplazamiento de bits</h3>
-
-<p>Operaciones para cambiar todos los bits del operando.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Left_shift", "&lt;&lt;")}}</dt>
- <dd>Operador de desplazamiento bit a bit a la izquierda.</dd>
- <dt>{{jsxref("Operators/Right_shift", "&gt;&gt;")}}</dt>
- <dd>Operador de desplazamiento bit a bit a la derecha.</dd>
- <dt>{{jsxref("Operators/Unsigned_right_shift", "&gt;&gt;&gt;")}}</dt>
- <dd>Operador de desplazamiento bit a bit a la derecha sin signo.</dd>
-</dl>
-
-<h3 id="Operadores_binarios_bit_a_bit">Operadores binarios bit a bit</h3>
-
-<p>Los operadores bit a bit tratan a sus operandos como un conjunto de 32 bits (ceros y unos) y devuelven valores numéricos estándar de JavaScript.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Bitwise_AND", "&amp;")}}</dt>
- <dd><code>AND</code> bit a bit.</dd>
- <dt>{{jsxref("Operators/Bitwise_OR", "|")}}</dt>
- <dd><code>OR</code> bit a bit.</dd>
- <dt>{{jsxref("Operators/Bitwise_XOR", "^")}}</dt>
- <dd><code>XOR</code> bit a bit.</dd>
-</dl>
-
-<h3 id="Operadores_lógicos_binarios">Operadores lógicos binarios</h3>
-
-<p>Los operadores lógicos se utilizan normalmente con valores booleanos (lógicos); cuando lo son, devuelven un valor booleano.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Logical_AND", "&amp;&amp;")}}</dt>
- <dd><code>AND</code> lógico.</dd>
- <dt>{{jsxref("Operators/Logical_OR", "||")}}</dt>
- <dd><code>OR</code> lógico.</dd>
-</dl>
-
-<h3 id="Operador_condicional_ternario">Operador condicional (ternario)</h3>
-
-<dl>
- <dt>{{jsxref("Operators/Conditional_Operator", "(condition ? ifTrue : ifFalse)")}}</dt>
- <dd>
- <p>El operador condicional devuelve uno de dos valores según el valor lógico de la condición.</p>
- </dd>
-</dl>
-
-<h3 id="Operadores_de_asignación">Operadores de asignación</h3>
-
-<p>Un operador de asignación asigna un valor a su operando izquierdo basándose en el valor de su operando derecho.</p>
-
-<dl>
- <dt>{{jsxref("Operators/Assignment", "=")}}</dt>
- <dd>Operador de asignación.</dd>
- <dt>{{jsxref("Operators/Multiplication_assignment", "*=")}}</dt>
- <dd>Asignación de multiplicación.</dd>
- <dt>{{jsxref("Operators/Division_assignment", "/=")}}</dt>
- <dd>Asignación de división.</dd>
- <dt>{{jsxref("Operators/Remainder_assignment", "%=")}}</dt>
- <dd>Asignación de residuo.</dd>
- <dt>{{jsxref("Operators/Addition_assignment", "+=")}}</dt>
- <dd>Asignación de suma.</dd>
- <dt>{{jsxref("Operators/Subtraction_assignment", "-=")}}</dt>
- <dd>Asignación de sustracción</dd>
- <dt>{{jsxref("Operators/Left_shift_assignment", "&lt;&lt;=")}}</dt>
- <dd>Asignación de desplazamiento a la izquierda.</dd>
- <dt>{{jsxref("Operators/Right_shift_assignment", "&gt;&gt;=")}}</dt>
- <dd>Asignación de desplazamiento a la derecha.</dd>
- <dt>{{jsxref("Operators/Unsigned_right_shift_assignment", "&gt;&gt;&gt;=")}}</dt>
- <dd>Asignación de desplazamiento a la derecha sin signo.</dd>
- <dt>{{jsxref("Operators/Bitwise_AND_assignment", "&amp;=")}}</dt>
- <dd>Asignación de <code>AND</code> bit a bit.</dd>
- <dt>{{jsxref("Operators/Bitwise_XOR_assignment", "^=")}}</dt>
- <dd>Asignación de <code>XOR</code> bit a bit.</dd>
- <dt>{{jsxref("Operators/Bitwise_OR_assignment", "|=")}}</dt>
- <dd>Asignación de <code>OR</code> bit a bit.</dd>
- <dt>{{jsxref("Operators/Logical_AND_assignment", "&amp;&amp;=")}}</dt>
- <dd>Asignación de <code>AND</code> lógico.</dd>
- <dt>{{jsxref("Operators/Logical_OR_assignment", "||=")}}</dt>
- <dd>Asignación de <code>OR</code> lógico.</dd>
- <dt>{{jsxref("Operators/Logical_nullish_assignment", "??=")}}</dt>
- <dd>Asignación de anulación lógica.</dd>
- <dt>{{jsxref("Operators/Destructuring_assignment", "[a, b] = [1, 2]")}}<br>
- {{jsxref("Operators/Destructuring_assignment", "{a, b} = {a:1, b:2}")}}</dt>
- <dd>
- <p>La desestructuración te permite asignar las propiedades de un arreglo u objeto a variables utilizando una sintaxis que se parece a los arreglos u objetos literales.</p>
- </dd>
-</dl>
-
-<h3 id="Operador_coma">Operador coma</h3>
-
-<dl>
- <dt>{{jsxref("Operators/Comma_Operator", ",")}}</dt>
- <dd>El operador <code>coma</code> permite evaluar múltiples expresiones en una sola declaración y devuelve el resultado de la última expresión.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-ecmascript-language-expressions', 'ECMAScript Language: Expressions')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.operators")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{jsxref("Operators/Operator_Precedence", "Operator de precedencia")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/instanceof/index.html b/files/es/web/javascript/referencia/operadores/instanceof/index.html
deleted file mode 100644
index 3b9a45162d..0000000000
--- a/files/es/web/javascript/referencia/operadores/instanceof/index.html
+++ /dev/null
@@ -1,88 +0,0 @@
----
-title: instanceof
-slug: Web/JavaScript/Referencia/Operadores/instanceof
-tags:
-  - JavaScript
-  - Operator
-  - Relational Operators
-translation_of: Web/JavaScript/Reference/Operators/instanceof
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El operador <strong><code>instanceof</code></strong> verifica si un objeto en su cadena de prototipos contiene la propiedad <code>prototype</code> de un constructor.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>objeto</em> instanceof <em>constructor</em></pre>
-
-<h3 id="Par.C3.A1metros" name="Par.C3.A1metros">Parámetros</h3>
-
-<dl>
- <dt><code>objeto</code></dt>
- <dd>Objeto a verificar.</dd>
-</dl>
-
-<dl>
- <dt><code>constructor</code></dt>
- <dd>Función contra la que se hará la verificación.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Utilice <code>instanceof</code> cuando necesite confirmar el tipo de un objeto en tiempo de ejecución. Por ejemplo, cuando controle excepciones, puede recurrir a diferentes códigos de manipulación de excepciones dependiendo del tipo de excepción tomada.</p>
-
-<p>Debe especificar un objeto en el lado derecho del operador <code>instanceof</code>. Por ejemplo, puede especificar una cadena creada con el constructor <code>String</code>, pero no puede especificar un literal de cadena.</p>
-
-<pre>color1=new String("verde")
-color1 instanceof String // devuelve verdadero (true)
-color2="coral"
-color2 instanceof String // devuelve falso (color2 no es un objeto String)
-</pre>
-
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-
-<p>También vea los ejemplos de {{jsxref("Sentencias/throw", "throw")}}.</p>
-
-<h4 id="Ejemplo:_Determinando_si_elDia_es_un_objeto_Date" name="Ejemplo:_Determinando_si_elDia_es_un_objeto_Date">Ejemplo: Determinando si <code>elDia</code> es un objeto <code>Date</code></h4>
-
-<p>El siguiente código utiliza <code>instanceof</code> para determinar si <code>elDia</code> es un objeto <code>Date</code>. Debido a que <code>elDia</code> es un objeto <code>Date</code>, las instrucciones de la sentencia if se ejecutan.</p>
-
-<pre>elDia = new Date(1995, 12, 17)
-if (elDia instanceof Date) {
-   // instrucciones a ejecutar
-}
-</pre>
-
-<h4 id="Ejemplo:_Demostrando_que_String_y_Date_son_del_tipo_Object" name="Ejemplo:_Demostrando_que_String_y_Date_son_del_tipo_Object">Ejemplo: Demostrando que <code>String</code> y <code>Date</code> son del tipo <code>Object</code></h4>
-
-<p>El siguiente código utiliza <code>instanceof</code> para demostrar que los objetos <code>String</code> y <code>Date</code> son también del tipo <code>Object</code> (éstos se derivan de <code>Object</code>).</p>
-
-<pre>miCadena = new String()
-miFecha = new Date()
-
-miCadena instanceof String // devuelve true
-miCadena instanceof Object // devuelve true
-miCadena instanceof Date   // devuelve false
-
-miFecha instanceof Date     // devuelve true
-miFecha instanceof Object   // devuelve true
-miFecha instanceof String   // devuelve false
-</pre>
-
-<h4 id="Ejemplo:_Demostrando_que_miCoche_es_del_tipo_Coche_y_del_tipo_Object" name="Ejemplo:_Demostrando_que_miCoche_es_del_tipo_Coche_y_del_tipo_Object">Ejemplo: Demostrando que <code>miCoche</code> es del tipo <code>Coche</code> y del tipo <code>Object</code></h4>
-
-<p>El siguiente código crea un objeto del tipo <code>Coche</code> y una instancia de ese tipo de objeto, <code>miCoche</code>. El operador <code>instanceof</code> demuestra que el objeto <code>miCoche</code> es del tipo <code>Coche</code> y del tipo <code>Object</code>.</p>
-
-<pre>function Coche(fabricante, modelo, ejercicio) {
-   this.fabricante = fabricante
-   this.modelo = modelo
-   this.ejercicio= ejercicio
-}
-miCoche = new Coche("Honda", "Accord", 1998)
-a = miCoche instanceof Coche // devuelve verdadero (true)
-b = miCoche instanceof Object // devuelve verdadero (true)
-</pre>
-
-<div class="noinclude"> </div>
diff --git a/files/es/web/javascript/referencia/operadores/miembros/index.html b/files/es/web/javascript/referencia/operadores/miembros/index.html
deleted file mode 100644
index 565a8b7f92..0000000000
--- a/files/es/web/javascript/referencia/operadores/miembros/index.html
+++ /dev/null
@@ -1,85 +0,0 @@
----
-title: Miembros
-slug: Web/JavaScript/Referencia/Operadores/Miembros
-tags:
-  - JavaScript
-  - Operator
-translation_of: Web/JavaScript/Reference/Operators/Property_Accessors
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Los operadores de miembros proporcionan acceso a las propiedades y métodos de un objeto.</p>
-
-<p>Un objeto es en realidad un<em> arreglo asociativo</em> (por ejemplo<em> map</em> ,<em>dictionary</em> ,<em>hash</em> ,<em>lookup table</em> ). Las <em>claves</em> en este arreglo son los nombres de las propiedades y los métodos (propiedades que hacen referencia a funciones). Hay dos modos de acceder a estas propiedades: notación por punto y notación por corchete (es decir, operador de subscripción).</p>
-
-<p>Nota: La especificación <a href="/es/docs/Glossary/ECMAScript">ECMAScript</a> etiqueta estos operadores como "property accessors" en vez de "operadores de miembro" (member operators).</p>
-
-<h3 id="Notaci.C3.B3n_por_punto" name="Notaci.C3.B3n_por_punto">Notación por punto</h3>
-
-<pre class="brush: js">get = objeto.propiedad;
-objeto.propiedad = set;
-</pre>
-
-<p><code>propiedad</code> debe ser un identificador válido de JavaScript, esto es, una secuencia alfanumérica de caracteres, incluyendo también el guión bajo ("<code>_</code>") y el signo dolar ("<code>$</code>"), que no puede comenzar por un número. Por ejemplo, <code>objeto.$1</code> es válido, mientras que <code>objeto.1</code> no lo es.</p>
-
-<p>Ejemplo:</p>
-
-<pre class="brush: js">document.createElement('pre');
-</pre>
-
-<p>Aquí, el método llamado "createElement" se recupera de <code>document</code> y se le llama.</p>
-
-<h3 id="Notaci.C3.B3n_por_corchetes" name="Notaci.C3.B3n_por_corchetes">Notación por corchetes</h3>
-
-<pre class="brush: js">get = objeto[nombre_propiedad];
-objeto[nombre_propiedad] = set;
-</pre>
-
-<p><code>nombre_propiedad</code> es una cadena. La cadena no tiene que ser un identificador válido; puede tener cualquier valor, por ejemplo "1foo", "!bar!", o incluso " " (un espacio).</p>
-
-<p>Ejemplo:</p>
-
-<pre class="brush: js">document['createElement']('pre');
-</pre>
-
-<p>Esto hace exactamente lo mismo que el ejemplo anterior.</p>
-
-<h3 id="Nombres_de_propiedades" name="Nombres_de_propiedades">Nombres de propiedades</h3>
-
-<p>Los nombres de propiedades deben ser cadenas. Esto significa que no pueden usarse objetos distintos a cadenas como claves en un objeto. Cualquier objeto que no sea una cadena, incluyendo números, se convierte al tipo cadena a través de su método {{jsxref("Object.toString")}}.</p>
-
-<p>Ejemplos:</p>
-
-<pre class="brush: js">var objeto = {};
-objeto['1'] = 'valor';
-alert(objeto[1]);
-</pre>
-
-<p>Ésto tendrá como resultado "valor", ya que 1 se convertirá por tipo a '1'.</p>
-
-<pre class="brush: js">var foo = {propiedad_unica: 1}, bar = {propiedad_unica: 2}, objeto = {};
-objeto[foo] = 'valor';
-alert(objeto[bar]);
-</pre>
-
-<p>Ésto también tiene como resultado "valor", ya que tanto foo como bar se convierten a la misma cadena. En el motor de JavaScript <a href="/es/docs/Mozilla/SpiderMonkey">SpiderMonkey</a>, esta cadena sería "{{ mediawiki.external('objeto Object') }}".</p>
-
-<h3 id="Enlace_a_m.C3.A9todos" name="Enlace_a_m.C3.A9todos">Enlace a métodos</h3>
-
-<p>Un método no está enlazado al objeto del que es método. Específicamente, <code>this</code> no está establecido en un método, es decir, <code>this</code> no se refiere necesariamente a un objeto conteniendo el método. <code>this</code>, en cambio, se "pasa" mediante la llamada de función.</p>
-
-<p>Vea <a href="/es/docs/Web/JavaScript/Referencia/Operadores/this#Funciones_enlazadas">enlace a métodos</a>.</p>
-
-<h3 id="Nota_sobre_eval" name="Nota_sobre_eval">Nota sobre <code>eval</code></h3>
-
-<p>Los principiantes en JavaScript a menudo tienen el error de usar {{jsxref("eval")}} cuando la notación por corchetes puede usarse a cambio. Por ejemplo, la siguiente sintaxis se ve a menudo en muchos scripts.</p>
-
-<pre class="brush: js">x = eval('document.nombre_formulario.' + cadenaControlFormulario + '.value');
-</pre>
-
-<p><code>eval</code> es lenta y se debería evitar en la medida de lo posible. Es mejor usar la notación por corchetes a cambio:</p>
-
-<pre class="brush: js">x = document.nombre_formulario[cadenaControlFormulario].value;
-</pre>
diff --git a/files/es/web/javascript/referencia/operadores/new.target/index.html b/files/es/web/javascript/referencia/operadores/new.target/index.html
deleted file mode 100644
index 0faa0f0878..0000000000
--- a/files/es/web/javascript/referencia/operadores/new.target/index.html
+++ /dev/null
@@ -1,139 +0,0 @@
----
-title: new.target
-slug: Web/JavaScript/Referencia/Operadores/new.target
-tags:
-  - Clases
-  - ECMAScript6
-  - JavaScript
-  - Referencia
-translation_of: Web/JavaScript/Reference/Operators/new.target
----
-<div>{{JSSidebar("Operators")}}</div>
-
-<p>La propiedad<strong> <code>new.target</code></strong> te permite detectar si una función o constructor fue llamado usando el operador <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a>. En constructores y funciones instanciadas con el operador <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a>, <code>new.target</code> devuelve una referencia al constructor o función. En llamadas a funciones normales, <code>new.target</code> es {{jsxref("undefined")}}.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">new.target</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La sintaxis <code>new.target</code> consiste en el keyword <code>"new</code>", un punto, y el nombre de propiedad <code>"target"</code>. Normalmente "<code>new."</code> sirve como contexto para el acceso a la propiedad, pero aquí, <code>"new."</code> no es realmente un objeto. En llamadas a constructores, sin embargo, <code>new.target</code> hace referencia al constructor invocado por new por lo que "<code>new.</code>" se convierte en un contexto virtual.</p>
-
-<p>La propiedad <code>new.target</code> es una meta propiedad que está disponible para todas las funciones. En <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">funciones flecha</a>, <code>new.target</code> se refiere al <code>new.target</code> de la función que la contiene.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="new.target_en_llamadas_a_funciones">new.target en llamadas a funciones</h3>
-
-<p>En llamadas a funciones normales (en contraposición a llamadas a constructores), <code>new.target</code> es {{jsxref("undefined")}}. Esto te permite detectar si la función fue llamada con <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a> como constructor.</p>
-
-<pre class="brush: js">function Foo() {
-  if (!new.target) throw 'Foo() debe ser llamado con new';
-  console.log('Foo instanciado con new');
-}
-
-Foo(); // Lanza "Foo() debe ser llamado con new"
-new Foo(); // escribe en el log "Foo instanciado con new"
-</pre>
-
-<h3 id="new.target_en_constructores">new.target en constructores</h3>
-
-<p>En constructores de clase, <code>new.target</code> hace referencia al constructor que fue directamente invocado por <code>new</code>. Este también es el caso si el constructor está en una clase padre y fue delegado desdes el constructor hijo.</p>
-
-<pre class="brush: js">class A {
-  constructor() {
-    console.log(new.target.name);
-  }
-}
-
-class B extends A { constructor() { super(); } }
-
-var a = new A(); // escribe en el log "A"
-var b = new B(); // escribe en el log "B"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estatus</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-built-in-function-objects', 'Built-in Function Objects')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-built-in-function-objects', 'Built-in Function Objects')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatChrome(46.0)}}</td>
-   <td>{{CompatGeckoDesktop(41)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Android</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(46.0)}}</td>
-   <td>{{CompatGeckoMobile(41)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(46.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Funciones">Funciones</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Classes">Clases</a></li>
- <li><code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/new">new</a></code></li>
- <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">this</a></code></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/new/index.html b/files/es/web/javascript/referencia/operadores/new/index.html
deleted file mode 100644
index 4635b12402..0000000000
--- a/files/es/web/javascript/referencia/operadores/new/index.html
+++ /dev/null
@@ -1,179 +0,0 @@
----
-title: Operador new
-slug: Web/JavaScript/Referencia/Operadores/new
-tags:
-  - Expresiones del lado izquierdo
-  - JavaScript
-  - Left-hand-side expressions
-  - Operador
-  - Operator
-  - Referencia
-translation_of: Web/JavaScript/Reference/Operators/new
----
-<div>{{jsSidebar("Operators", "Operadores")}}</div>
-
-<p><span class="seoSummary">El <strong>operador <code>new</code></strong> permite a los desarrolladores crear una instancia de un tipo de objeto definido por el usuario o de uno de los tipos de objeto integrados que tiene un función constructora.</span></p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-newoperator.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">new <var>constructor</var>[([<var>arguments</var>])]</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code><var>constructor</var></code></dt>
- <dd>Una clase o función que especifica el tipo de instancia del objeto.</dd>
-</dl>
-
-<dl>
- <dt><code><var>arguments</var></code></dt>
- <dd>Una lista de valores con los que se llamará al <code><var>constructor</var></code>.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La palabra clave <strong><code>new</code></strong> hace lo siguiente:</p>
-
-<ol>
- <li>Crea un objeto JavaScript simple y en blanco;</li>
- <li>Vincula (establece el constructor de) este objeto a otro objeto;</li>
- <li>Pasa el objeto recién creado del <em>Paso 1</em> como el contexto <code>this</code>;</li>
- <li>Devuelve <code>this</code> si la función no devuelve un objeto.</li>
-</ol>
-
-<p>La creación de un objeto definido por el usuario requiere dos pasos:</p>
-
-<ol>
- <li>Defina el tipo de objeto escribiendo una función.</li>
- <li>Crea una instancia del objeto con <code>new</code>.</li>
-</ol>
-
-<p>Para definir un tipo de objeto, crea una función para el tipo de objeto que especifique su nombre y propiedades. Un objeto puede tener una propiedad que en sí misma es otro objeto. Ve los siguientes ejemplos.</p>
-
-<p>Cuando se ejecuta el código <code>new <em>Foo</em>(...)</code>, sucede lo siguiente:</p>
-
-<ol>
- <li>Se crea un nuevo objeto, heredado de <code><em>Foo</em>.prototype</code>.</li>
- <li>La función constructora <code><em>Foo</em></code> se llama con los argumentos especificados y con {{JSxRef("Operators/this", "this")}} vinculado al objeto recién creado. <code>new <em>Foo</em></code> es equivalente a <code>new <em>Foo</em>()</code>, es decir, si no se especifica una lista de argumentos, <code><em>Foo</em></code> se llama sin argumentos.</li>
- <li>El objeto (no nulo, <code>false</code>, 3.1415 u otros tipos primitivos) devuelto por la función constructora se convierte en el resultado de toda la expresión <code>new</code>. Si la función constructora no devuelve explícitamente un objeto, en su lugar se utiliza el objeto creado en el paso 1. (Normalmente, los constructores no devuelven un valor, pero pueden elegir hacerlo si quieren redefinir el proceso normal de creación de objetos).</li>
-</ol>
-
-<p>Siempre puedes agregar una propiedad a un objeto definido previamente. Por ejemplo, la instrucción <code>car1.color = "black"</code> agrega una propiedad <code>color</code> a <code>car1</code> y le asigna un valor de "<code>black</code>". Sin embargo, esto no afecta a ningún otro objeto. Para agregar la nueva propiedad a todos los objetos del mismo tipo, debes agregar la propiedad a la definición del tipo de objeto <code>Car</code>.</p>
-
-<p>Puedes agregar una propiedad compartida a un tipo de objeto definido previamente mediante la propiedad {{JSxRef("Global_Objects/Function/prototype", "Function.prototype")}}. Esto define una propiedad que comparten todos los objetos creados con esa función, en lugar de solo una instancia del tipo de objeto. El siguiente código agrega una propiedad de color con el valor <code>"color original"</code> a todos los objetos de tipo <code>Car</code>, y luego redefine ese valor con la cadena "<code>black</code>" solo en la instancia <code>car1</code> del objeto. Para obtener más información, consulta {{JSxRef("Global_Objects/Function/prototype", "prototype")}}.</p>
-
-<pre class="brush: js notranslate">function Car() {}
-car1 = new Car();
-car2 = new Car();
-
-console.log(car1.color);    // undefined
-
-Car.prototype.color = 'color original';
-console.log(car1.color);    // 'color original'
-
-car1.color = 'black';
-console.log(car1.color);    // 'black'
-
-console.log(Object.getPrototypeOf(car1).color); // 'color original'
-console.log(Object.getPrototypeOf(car2).color); // 'color original'
-console.log(car1.color);   // 'black'
-console.log(car2.color);   // 'color original'
-</pre>
-
-<div class="note">
-<p>Si no escribiste el operador <code>new</code>, <strong>la función <code>constructor</code> se invocará como cualquier función normal</strong>, <em>sin crear un objeto.</em> En este caso, el valor de <code>this</code> también es diferente.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Tipo_de_objeto_e_instancia_de_objeto">Tipo de objeto e instancia de objeto</h3>
-
-<p>Supongamos que deseas crear un tipo de objeto para <code>cars</code>. Quieres que este tipo de objeto se llame <code>Car</code>, y quieres que tenga propiedades para marca, modelo y año (<code>make</code>, <code>model</code> y <code>year</code> en inglés respectivamente). Para ello, podrías escribir la siguiente función:</p>
-
-<pre class="brush: js notranslate">function Car(make, model, year) {
-  this.make = make;
-  this.model = model;
-  this.year = year;
-}
-</pre>
-
-<p>Ahora puedes crear un objeto llamado <code>myCar</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">var myCar = new Car('Eagle', 'Talon TSi', 1993);
-</pre>
-
-<p>Esta declaración crea <code>myCar</code> y le asigna los valores especificados para sus propiedades. Entonces el valor de <code>myCar.make</code> es la cadena "Eagle", <code>myCar.year</code> es el entero 1993, y así sucesivamente.</p>
-
-<p>Puedes crear cualquier número de objetos <code>car</code> mediante llamadas a <code>new</code>. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">var kensCar = new Car('Nissan', '300ZX', 1992);
-</pre>
-
-<h3 id="Propiedad_del_objeto_que_en_sí_mismo_es_otro_objeto">Propiedad del objeto que en sí mismo es otro objeto</h3>
-
-<p>Supongamos que defines un objeto llamado <code>Person</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">function Person(name, age, sex) {
-  this.name = name;
-  this.age = age;
-  this.sex = sex;
-}
-</pre>
-
-<p>Y luego creas una instancia de dos nuevos objetos <code>Person</code> de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">var rand = new Person('Rand McNally', 33, 'M');
-var ken = new Person('Ken Jones', 39, 'M');
-</pre>
-
-<p>Luego, puedes reescribir la definición de <code>Car</code> para incluir una propiedad para <code>owner</code> (propietario en español) que tome un objeto <code>Person</code>, de la siguiente manera:</p>
-
-<pre class="brush: js notranslate">function Car(make, model, year, owner) {
-  this.make = make;
-  this.model = model;
-  this.year = year;
-  this.owner = owner;
-}
-</pre>
-
-<p>Para crear instancias de los nuevos objetos, utiliza lo siguiente:</p>
-
-<pre class="brush: js notranslate">var car1 = new Car('Eagle', 'Talon TSi', 1993, rand);
-var car2 = new Car('Nissan', '300ZX', 1992, ken);
-</pre>
-
-<p>En lugar de pasar una cadena literal o un valor entero al crear los nuevos objetos, las declaraciones anteriores pasan los objetos <code>rand</code> y <code>ken</code> como parámetros para los propietarios. Para conocer el nombre del propietario de <code>car2</code>, puedes acceder a la siguiente propiedad:</p>
-
-<pre class="brush: js notranslate">car2.owner.name
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-new-operator', 'El operador new')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.operators.new")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Function", "Funciones")}}</li>
- <li>{{jsxref("Reflect.construct()")}}</li>
- <li>{{jsxref("Object.prototype")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/operador_coma/index.html b/files/es/web/javascript/referencia/operadores/operador_coma/index.html
deleted file mode 100644
index a62701b3e1..0000000000
--- a/files/es/web/javascript/referencia/operadores/operador_coma/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: Operador Coma
-slug: Web/JavaScript/Referencia/Operadores/operador_coma
-tags:
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Operators/Comma_Operator
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador coma evalua cada uno de sus operandos (de izquierda a derecha) y retorna el valor del último operando.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>expr1</em>, <em>expr2, expr3...</em></pre>
-
-<h2 id="Parámetros">Parámetros</h2>
-
-<dl>
- <dt><code>expr1</code>, <code>expr2, expr3...</code></dt>
- <dd>Cualquier expresión.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Puede usar el operador coma cuando deseé mútiples expresiones en una localización que requiere una sola expresión. El uso más común de este operador es proveer múltiples parámetros en un búcle for</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Si a es un array de dos dimensiones con 10 elementos en un lado, el siguiente código usa el operador coma para incrementar dos variables a la vez. Note que la coma en la sentencia var <strong>no </strong>es el operador coma, porque no existe adentro de una expresión.Más bien, es un carácter especial en sentencias var para combinar a múltiples de ellas en una sola. Sin embargo, esa coma se comporta casi igual que el operador coma. El código imprime los valores de los elementos diagonales en el array:</p>
-
-<pre class="brush:js;highlight:[1]">for (var i = 0, j = 9; i &lt;= 9; i++, j--)
-  document.writeln("a[" + i + "][" + j + "] = " + a[i][j]);</pre>
-
-<h3 id="Procesar_y_luego_retornar">Procesar y luego retornar:</h3>
-
-<p>Otro ejemplo de lo que se puede hacer con el operador coma es procesar antes de retornar. Como se mencionó, solo el último elemento será retornado pero todos los otros también van a ser evaluados. Así, se puede hacer:</p>
-
-<pre class="brush: js">function myFunc () {
-  var x = 0;
-
-  return (x += 1, x); // the same as return ++x;
-}</pre>
-
-<h2 id="Específicaciones">Específicaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-comma-operator', 'Comma operator')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-comma-operator', 'Comma operator')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.14', 'Comma operator')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-11.14', 'Comma operator')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>3.0</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for">for loop</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/operadores_lógicos/index.html b/files/es/web/javascript/referencia/operadores/operadores_lógicos/index.html
deleted file mode 100644
index 4c9cb860a9..0000000000
--- a/files/es/web/javascript/referencia/operadores/operadores_lógicos/index.html
+++ /dev/null
@@ -1,296 +0,0 @@
----
-title: Operadores lógicos
-slug: Web/JavaScript/Referencia/Operadores/Operadores_lógicos
-translation_of: Web/JavaScript/Reference/Operators
-translation_of_original: Web/JavaScript/Reference/Operators/Logical_Operators
----
-<div>{{jsSidebar("Operadores_lógicos")}}</div>
-
-<p>Los operadores lógicos se usan típicamente con valores {{jsxref("Boolean")}}. En tal caso, regresan un valor Boolean. Sin embargo, los operadores &amp;&amp; y || regresan en realidad el valor de uno de los operandos especificados, por lo que si estos operadores se usan con valores no Boolean, posiblemente regresen un valor no Boolean.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los operadores lógicos se describen en la tabla siguiente:</p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th>Operador</th>
-   <th>Uso</th>
-   <th>Descripción</th>
-  </tr>
-  <tr>
-   <td>AND (<code>&amp;&amp;</code>) lógico</td>
-   <td><code><em>expr1</em> &amp;&amp; <em>expr2</em></code></td>
-   <td>
-    <p>Regresa <code>expr1 </code>si tal puede convertirse a false; de lo contrario, regresa <code>expr2</code>. De esta forma, cuando se usa con valores Boolean, &amp;&amp; regresa true si ambos operandos son verdaderos; de lo contrario regresa false.</p>
-   </td>
-  </tr>
-  <tr>
-   <td>OR (<code>||</code>) lógico</td>
-   <td><code><em>expr1</em> || <em>expr2</em></code></td>
-   <td>
-    <p>Regresa<code> expr1</code> si tal puede convertirse a true; de lo contrario, regresa <code>expr2</code>. De esta forma, cuando se usa con valores Boolean, || regresa true si cualquier operando es verdadero; pero si ambos son falsos, regresa "false".</p>
-   </td>
-  </tr>
-  <tr>
-   <td>NOT (<code>!</code>) lógico</td>
-   <td><code>!<em>expr</em></code></td>
-   <td>
-    <p>Regresa false si su único operando puede convertirse a true; de lo contrario, regresa true.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<p>Algunos ejemplos de expresiones que pueden convertirse a false son aquellas que evalúan a null, 0, un string vacío (""), o undefined.</p>
-
-<p>A pesar de que los operadores &amp;&amp; y ||  pueden ser usados con operandos que no son valores Boolean, aún pueden ser considerados como operadores Boolean porque sus valores de regreso siempre pueden convertirse a valores Boolean.</p>
-
-<h3 id="Evaluación_contra_corto_circuitos">Evaluación contra "corto circuitos"</h3>
-
-<p>Ya que las expresiones lógicas son evaluadas de izquierda a derecha, se prueban con una evaluación contra posibles "cortos circuitos" usando las siguientes normas:</p>
-
-<ul>
- <li><code>false &amp;&amp; (<em>cualquier valor)</em></code> evalúa a "false".</li>
- <li><code>true || (<em>cualquier valor)</em></code> evalúa a "true".</li>
-</ul>
-
-<p>Las reglas de lógica garantizan que estas evaluaciones siempre son correctas. Se debe notar que la parte de "cualquier valor" en las expresiones anteriores no se evalúa, para que tal acción no afecte de ninguna forma. Además, es de notar que la parte de "cualquier valor" en las expresiones anteriores debe ser cualquier expresión lógica (lo que se indica con los paréntesis).</p>
-
-<p>Por ejemplo, las siguientes dos expresiones son equivalentes.</p>
-
-<pre class="brush: js">function shortCircuitEvaluation() {
-  doSomething() || doSomethingElse()
-}
-
-function equivalentEvaluation() {
-  var flag = doSomething();
-  if (!flag) {
-    doSomethingElse();
-  }
-}
-</pre>
-
-<p>Sin embargo, las siguientes expresiones no son equivalentes debido a la <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence">precedencia de operadores</a>, y con tal ejemplo se enfatiza la importancia de que la parte derecha sea una única expresión (agrupada en paréntesis si es necesario).</p>
-
-<pre class="brush: js">false &amp;&amp; true  || true      // regresa true
-false &amp;&amp; (true || true)     // regresa false</pre>
-
-<h3 id="AND_()_lógico"><a name="Logical_AND">AND (<code>&amp;&amp;</code>) lógico</a></h3>
-
-<p>El siguiente código muestra ejemplos del operador &amp;&amp; (AND lógico).</p>
-
-<pre class="brush: js">a1 = true  &amp;&amp; true      // t &amp;&amp; t regresa true
-a2 = true  &amp;&amp; false     // t &amp;&amp; f regresa false
-a3 = false &amp;&amp; true      // f &amp;&amp; t regresa false
-a4 = false &amp;&amp; (3 == 4)  // f &amp;&amp; f regresa false
-a5 = "Cat" &amp;&amp; "Dog"     // t &amp;&amp; t regresa "Dog"
-a6 = false &amp;&amp; "Cat"     // f &amp;&amp; t regresa false
-a7 = "Cat" &amp;&amp; false     // t &amp;&amp; f regresa false
-</pre>
-
-<h3 id="OR_()_lógico"><a name="Logical_OR">OR (<code>||</code>) lógico</a></h3>
-
-<p>El siguiente código muestra ejemplos del operador <code>||</code> (OR lógico).</p>
-
-<pre class="brush: js">o1 = true  || true       // t || t regresa true
-o2 = false || true       // f || t regresa true
-o3 = true  || false      // t || f regresa true
-o4 = false || (3 == 4)   // f || f regresa false
-o5 = "Cat" || "Dog"      // t || t regresa "Cat"
-o6 = false || "Cat"      // f || t regresa "Cat"
-o7 = "Cat" || false      // t || f regresa "Cat"
-</pre>
-
-<h3 id="Logical_NOT_(!)"><a name="Logical_NOT">Logical NOT (<code>!</code>)</a></h3>
-
-<p>El siguiente código muestra ejemplos del operador <code>!</code> (NOT lógico).</p>
-
-<pre class="brush: js">n1 = !true              // !t regresa false
-n2 = !false             // !f regresa true
-n3 = !"Cat"             // !t regresa false
-</pre>
-
-<h3 id="Reglas_de_conversión">Reglas de conversión</h3>
-
-<h4 id="Convertir_de_AND_a_OR">Convertir de AND a OR</h4>
-
-<p>la siguiente operación que involucra Booleans:</p>
-
-<pre class="brush: js">bCondition1 &amp;&amp; bCondition2</pre>
-
-<p>siempre es igual a:</p>
-
-<pre class="brush: js">!(!bCondition1 || !bCondition2)</pre>
-
-<h4 id="Convertir_de_OR_a_AND">Convertir de OR a AND</h4>
-
-<p>la siguiente operación que involucra Booleans:</p>
-
-<pre class="brush: js">bCondition1 || bCondition2</pre>
-
-<p>siempre es igual a:</p>
-
-<pre class="brush: js">!(!bCondition1 &amp;&amp; !bCondition2)</pre>
-
-<h4 id="Convertir_entre_operadores_NOT">Convertir entre operadores NOT</h4>
-
-<p>la siguiente operación que involucra Booleans:</p>
-
-<pre class="brush: js">!!bCondition</pre>
-
-<p>siempre es igual a:</p>
-
-<pre class="brush: js">bCondition</pre>
-
-<h3 id="Eliminando_paréntesis_anidados">Eliminando paréntesis anidados</h3>
-
-<p>Ya que las expresiones lógicas son evaluadas de izquierda a derecha, siempre es posible eliminar paréntesis en una expresión compleja, si se siguen ciertas reglas.</p>
-
-<h4 id="Eliminando_operadores_AND_anidados">Eliminando operadores AND anidados</h4>
-
-<p>La siguiente operación compleja que involucra Booleans:</p>
-
-<pre class="brush: js">bCondition1 || (bCondition2 &amp;&amp; bCondition3)</pre>
-
-<p>siempre es igual a:</p>
-
-<pre class="brush: js">bCondition1 || bCondition2 &amp;&amp; bCondition3</pre>
-
-<h4 id="Eliminando_operadores_OR_anidados">Eliminando operadores OR anidados</h4>
-
-<p>La siguiente operación compleja que involucra Booleans:</p>
-
-<pre class="brush: js">bCondition1 &amp;&amp; (bCondition2 || bCondition3)</pre>
-
-<p>siempre es igual a:</p>
-
-<pre class="brush: js">!(!bCondition1 || !bCondition2 &amp;&amp; !bCondition3)</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-11.11')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>
-    <p>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.4.9">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.11">Binary Logical Operators</a></p>
-   </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-binary-logical-operators')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-binary-logical-operators">Binary Logical Operators</a></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-binary-logical-operators')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Definido en varias secciones de la especificación: <a href="http://tc39.github.io/ecma262/#sec-logical-not-operator">Logical NOT Operator</a>, <a href="http://tc39.github.io/ecma262/#sec-binary-logical-operators">Binary Logical Operators</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>AND (<code>&amp;&amp;</code>) lógico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>OR (<code>||</code>) lógico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>NOT (<code>!</code>) lógico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>AND (<code>&amp;&amp;</code>) lógico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>OR (<code>||</code>) lógico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td>NOT (<code>!</code>) lógico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators">Operaciones binarias</a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">Boolean</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/operator_precedence/index.html b/files/es/web/javascript/referencia/operadores/operator_precedence/index.html
deleted file mode 100644
index 2ff0464afd..0000000000
--- a/files/es/web/javascript/referencia/operadores/operator_precedence/index.html
+++ /dev/null
@@ -1,297 +0,0 @@
----
-title: Precedencia de operadores
-slug: Web/JavaScript/Referencia/Operadores/Operator_Precedence
-tags:
-  - JavaScript
-  - Operator
-  - operator details
-  - operator precedence
-translation_of: Web/JavaScript/Reference/Operators/Operator_Precedence
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<h2 id="Summary" name="Summary">Sumario</h2>
-
-<p>La precedencia de operadores determina el orden en el cual los operadores son evaluados. Los operadores con mayor precedencia son evaluados primero.</p>
-
-<p>Ejemplo:</p>
-
-<pre class="brush: js">3 + 4 * 5 // retorna 23
-</pre>
-
-<p>El operador de multiplicación ("*") tiene una precedencia mas alta que el operador de suma ("+") y por eso sera evaluado primero.</p>
-
-<h2 id="Associativity" name="Associativity">Asociatividad</h2>
-
-<p>La asociatividad determina el orden en el cual los operadores con el mismo nivel de precedencia son procesados. Por ejemplo:</p>
-
-<pre class="brush: js">a OP b OP c
-</pre>
-
-<p>La asociatividad de izquierda a derecha significa que esa expresión es procesada como <code>(a OP b) OP c, </code>mientras que la asociatividad de derecha a izquierda significa que es procesada como a<code> OP (b OP c). </code>Los operadores de asignación tienen asociatividad de derecha a izquierda, por lo que puedes escribir:</p>
-
-<pre class="brush: js">a = b = 5;
-</pre>
-
-<p>para asignar 5 a las dos variables. Esto es porque el operador de asignación retorna el valor que asignó. Primero <code>b</code> es inicializada a 5. Despues <code>a</code> es inicializada al valor de <code>b</code>.</p>
-
-<h2 id="Table" name="Table">Tabla</h2>
-
-<p>La siguiente tabla esta ordenada de la precedencia más alta (0) a la más baja (18).</p>
-
-<table class="fullwidth-table">
- <tbody>
-  <tr>
-   <th>Precedencia</th>
-   <th>Tipo de operador</th>
-   <th>Asociatividad</th>
-   <th>Operador</th>
-  </tr>
-  <tr>
-   <td>0</td>
-   <td>grouping</td>
-   <td>n/a</td>
-   <td><code>(</code>…<code>)</code></td>
-  </tr>
-  <tr>
-   <td rowspan="3">1</td>
-   <td rowspan="2"><a href="/en-US/docs/JavaScript/Reference/Operators/Member_Operators" title="JavaScript/Reference/Operators/Member_Operators">member</a></td>
-   <td rowspan="2">left-to-right</td>
-   <td>…<code>.<var>…</var></code></td>
-  </tr>
-  <tr>
-   <td>…<code>[<var>…</var>]</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/new" title="JavaScript/Reference/Operators/Special_Operators/new_Operator">new</a></td>
-   <td>n/a</td>
-   <td><code>new</code> … <code>(<var>…</var>)</code></td>
-  </tr>
-  <tr>
-   <td rowspan="2">2</td>
-   <td><a href="/en-US/docs/JavaScript/Guide/Functions" title="JavaScript/Reference/Operators/Special_Operators/function_call">function call</a></td>
-   <td>left-to-right</td>
-   <td>…<code>(<var>…</var>)</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/new" title="JavaScript/Reference/Operators/Special_Operators/new_Operator">new</a></td>
-   <td>right-to-left</td>
-   <td><code>new</code> …</td>
-  </tr>
-  <tr>
-   <td rowspan="2">3</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">increment</a></td>
-   <td>n/a</td>
-   <td>…<code>++</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">decrement</a></td>
-   <td>n/a</td>
-   <td>…<code>--</code></td>
-  </tr>
-  <tr>
-   <td rowspan="7">4</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Logical_Operators" title="JavaScript/Reference/Operators/Logical_Operators">logical-not</a></td>
-   <td>right-to-left</td>
-   <td><code>!</code>…</td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise not</a></td>
-   <td>right-to-left</td>
-   <td><code>~</code>…</td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">unary +</a></td>
-   <td>right-to-left</td>
-   <td><code>+</code>…</td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">unary negation</a></td>
-   <td>right-to-left</td>
-   <td><code>-</code>…</td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/typeof" title="JavaScript/Reference/Operators/Special_Operators/typeof_Operator">typeof</a></td>
-   <td>right-to-left</td>
-   <td><code>typeof</code> …</td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/void" title="JavaScript/Reference/Operators/Special_Operators/void_Operator">void</a></td>
-   <td>right-to-left</td>
-   <td><code>void</code> …</td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/delete" title="JavaScript/Reference/Operators/Special_Operators/delete_Operator">delete</a></td>
-   <td>right-to-left</td>
-   <td><code>delete</code> …</td>
-  </tr>
-  <tr>
-   <td rowspan="3">5</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">multiplication</a></td>
-   <td>left-to-right</td>
-   <td><code>*</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">division</a></td>
-   <td>left-to-right</td>
-   <td><code>/</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">modulus</a></td>
-   <td>left-to-right</td>
-   <td><code>%</code></td>
-  </tr>
-  <tr>
-   <td rowspan="2">6</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">addition</a></td>
-   <td>left-to-right</td>
-   <td><code>+</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Arithmetic_Operators" title="JavaScript/Reference/Operators/Arithmetic_Operators">subtraction</a></td>
-   <td>left-to-right</td>
-   <td><code>-</code></td>
-  </tr>
-  <tr>
-   <td rowspan="3">7</td>
-   <td rowspan="3"><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise shift</a></td>
-   <td rowspan="3">left-to-right</td>
-   <td><code>&lt;&lt;</code></td>
-  </tr>
-  <tr>
-   <td><code>&gt;&gt;</code></td>
-  </tr>
-  <tr>
-   <td><code>&gt;&gt;&gt;</code></td>
-  </tr>
-  <tr>
-   <td rowspan="6">8</td>
-   <td rowspan="4"><a href="/en-US/docs/JavaScript/Reference/Operators/Comparison_Operators" title="JavaScript/Reference/Operators/Comparison_Operators">relational</a></td>
-   <td rowspan="4">left-to-right</td>
-   <td><code>&lt;</code></td>
-  </tr>
-  <tr>
-   <td><code>&lt;=</code></td>
-  </tr>
-  <tr>
-   <td><code>&gt;</code></td>
-  </tr>
-  <tr>
-   <td><code>&gt;=</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/in" title="JavaScript/Reference/Operators/Special_Operators/in_Operator">in</a></td>
-   <td>left-to-right</td>
-   <td><code>in</code></td>
-  </tr>
-  <tr>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/instanceof" title="JavaScript/Reference/Operators/Special_Operators/instanceof_Operator">instanceof</a></td>
-   <td>left-to-right</td>
-   <td><code>instanceof</code></td>
-  </tr>
-  <tr>
-   <td rowspan="4">9</td>
-   <td rowspan="4"><a href="/en-US/docs/JavaScript/Reference/Operators/Comparison_Operators" title="JavaScript/Reference/Operators/Comparison_Operators">equality</a></td>
-   <td rowspan="4">left-to-right</td>
-   <td><code>==</code></td>
-  </tr>
-  <tr>
-   <td><code>!=</code></td>
-  </tr>
-  <tr>
-   <td><code>===</code></td>
-  </tr>
-  <tr>
-   <td><code>!==</code></td>
-  </tr>
-  <tr>
-   <td>10</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise-and</a></td>
-   <td>left-to-right</td>
-   <td><code>&amp;</code></td>
-  </tr>
-  <tr>
-   <td>11</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise-xor</a></td>
-   <td>left-to-right</td>
-   <td><code>^</code></td>
-  </tr>
-  <tr>
-   <td>12</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Bitwise_Operators" title="JavaScript/Reference/Operators/Bitwise_Operators">bitwise-or</a></td>
-   <td>left-to-right</td>
-   <td><code>|</code></td>
-  </tr>
-  <tr>
-   <td>13</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Logical_Operators" title="JavaScript/Reference/Operators/Logical_Operators">logical-and</a></td>
-   <td>left-to-right</td>
-   <td><code>&amp;&amp;</code></td>
-  </tr>
-  <tr>
-   <td>14</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Logical_Operators" title="JavaScript/Reference/Operators/Logical_Operators">logical-or</a></td>
-   <td>left-to-right</td>
-   <td><code>||</code></td>
-  </tr>
-  <tr>
-   <td>15</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/Conditional_Operator" title="JavaScript/Reference/Operators/Special_Operators/Conditional_Operator">conditional</a></td>
-   <td>right-to-left</td>
-   <td>… <code>?</code> … <code>:</code> …</td>
-  </tr>
-  <tr>
-   <td rowspan="12">16</td>
-   <td rowspan="12"><a href="/en-US/docs/JavaScript/Reference/Operators/Assignment_Operators" title="JavaScript/Reference/Operators/Assignment_Operators">assignment</a></td>
-   <td rowspan="12">right-to-left</td>
-   <td><code>=</code></td>
-  </tr>
-  <tr>
-   <td><code>+=</code></td>
-  </tr>
-  <tr>
-   <td><code>-=</code></td>
-  </tr>
-  <tr>
-   <td><code>*=</code></td>
-  </tr>
-  <tr>
-   <td><code>/=</code></td>
-  </tr>
-  <tr>
-   <td><code>%=</code></td>
-  </tr>
-  <tr>
-   <td><code>&lt;&lt;=</code></td>
-  </tr>
-  <tr>
-   <td><code>&gt;&gt;=</code></td>
-  </tr>
-  <tr>
-   <td><code>&gt;&gt;&gt;=</code></td>
-  </tr>
-  <tr>
-   <td><code>&amp;=</code></td>
-  </tr>
-  <tr>
-   <td><code>^=</code></td>
-  </tr>
-  <tr>
-   <td><code>|=</code></td>
-  </tr>
-  <tr>
-   <td>17</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/yield" title="JavaScript/Reference/Operators/yield">yield</a></td>
-   <td>right-to-left</td>
-   <td><code>yield</code>…</td>
-  </tr>
-  <tr>
-   <td>18</td>
-   <td><a href="/en-US/docs/JavaScript/Reference/Operators/Special/Comma_Operator" title="JavaScript/Reference/Operators/Special_Operators/Comma_Operator">comma</a></td>
-   <td>left-to-right</td>
-   <td><code>,</code></td>
-  </tr>
- </tbody>
-</table>
-
-<p></p>
diff --git a/files/es/web/javascript/referencia/operadores/pipeline_operator/index.html b/files/es/web/javascript/referencia/operadores/pipeline_operator/index.html
deleted file mode 100644
index cb671264cc..0000000000
--- a/files/es/web/javascript/referencia/operadores/pipeline_operator/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: Operador Pipeline
-slug: Web/JavaScript/Referencia/Operadores/Pipeline_operator
-tags:
-  - Encadenamiento
-  - Experimental
-  - JavaScript
-  - Operador
-  - Pipeline
-translation_of: Web/JavaScript/Reference/Operators/Pipeline_operator
----
-<div>{{jsSidebar("Operators")}} {{SeeCompatTable}}</div>
-
-<p>El operador experimental pipeline <code>|&gt;</code> (actualmente en su fase1) conduce el valor de una expresión dentro de una función. Esto permite la creación de llamadas de función en cadena de un modo más legible. El resultado es una simplificación sintáctica en la cual la llamada a una función con un único parámetro puede ser escrita del siguiente modo:</p>
-
-<pre class="brush: js">let url = "%21" |&gt; decodeURI;</pre>
-
-<p>La llamada equivalente en sintaxis tradicional tiene este aspecto:</p>
-
-<pre class="brush: js">let url = decodeURI("%21");
-</pre>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><em>expression</em> |&gt; <em>function</em>
-</pre>
-
-<p>El valor especificado en la <code>expression</code> se pasa dentro de la  <code>function</code> como su único parámetro.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Encadenando_llamadas_a_funciones">Encadenando llamadas  a funciones</h3>
-
-<p>El operador pipeline puede mejorar la legibilidad cuando se encadenan varias funciones entre si.</p>
-
-<pre class="brush: js">const double = (n) =&gt; n * 2;
-const increment = (n) =&gt; n + 1;
-
-// sin operador pipeline
-double(increment(double(double(5)))); // 42
-
-// con operador pipeline
-5 |&gt; double |&gt; double |&gt; increment |&gt; double; // 42
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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><a href="https://tc39.github.io/proposal-pipeline-operator/#sec-intro">Borrador del operador Pipeline</a></td>
-   <td>Fase 1</td>
-   <td>Todavía no forma parte de la especificación ECMAScript</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>
-<div class="hidden">La tabla de compatibilidad en esta página se genera a partir de datos estructurados. Si quieres contribuir a estos datos, por favor consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y mándanos una pull request.</div>
-
-<p>{{Compat("javascript.operators.pipeline")}}</p>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://github.com/tc39/proposal-pipeline-operator">Github - Proposal-pipeline-operator</a></li>
- <li><a href="https://github.com/tc39/proposals">TC39 proposals</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/resto/index.html b/files/es/web/javascript/referencia/operadores/resto/index.html
deleted file mode 100644
index 1a6a7c56da..0000000000
--- a/files/es/web/javascript/referencia/operadores/resto/index.html
+++ /dev/null
@@ -1,82 +0,0 @@
----
-title: Resto (%)
-slug: Web/JavaScript/Referencia/Operadores/Resto
-translation_of: Web/JavaScript/Reference/Operators/Remainder
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador resto (<code>%</code>) devuelve el resto de la división entre dos operandos. Siempre toma el signo del dividendo.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-remainder.html")}}</div>
-
-<div></div>
-
-<p class="hidden">El código fuente para este ejemplo interactivo se encuentra en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivas, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y realiza un pull request.</p>
-
-<p>Tener en cuenta que en la mayoría de los lenguajes de programación, el operador de resto es ‘%’, pero en otros (como <a href="https://en.wikipedia.org/wiki/Modulo_operation#In_programming_languages">Python, Perl</a>) es el operador módulo. Ambos son iguales para valores positivos, pero cuando el divisor y el dividendo son de signos distintos, se obtienen distintos resultados. Para obtener el módulo en JavaScript, en lugar de <code>a % n</code>, usa <code>((a % n ) + n ) % n</code>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><strong>Operador:</strong> <var>var1</var> % <var>var2</var>
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Resto_con_dividendo_positivo">Resto con dividendo positivo</h3>
-
-<pre class="brush: js notranslate"> 12 % 5  //  2
- 1 % -2 //  1
- 1 % 2  //  1
- 2 % 3  //  2
-5.5 % 2 // 1.5
-</pre>
-
-<h3 id="Resto_con_dividendo_negativo">Resto con dividendo negativo</h3>
-
-<pre class="brush: js notranslate">-12 % 5 // -2
--1 % 2  // -1
--4 % 2  // -0</pre>
-
-<h3 id="Resto_con_NaN">Resto con NaN</h3>
-
-<pre class="brush: js notranslate">NaN % 2 // NaN</pre>
-
-<h3 id="Resto_con_Infinity">Resto con Infinity</h3>
-
-<pre class="brush: js notranslate">Infinity % 2 // NaN
-Infinity % 0 // NaN
-Infinity % Infinity // NaN
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-multiplicative-operators', 'Remainder operator')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.remainder")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Subtraction">Subtraction operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
- <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/sintaxis_spread/index.html b/files/es/web/javascript/referencia/operadores/sintaxis_spread/index.html
deleted file mode 100644
index 5a17cd05a2..0000000000
--- a/files/es/web/javascript/referencia/operadores/sintaxis_spread/index.html
+++ /dev/null
@@ -1,242 +0,0 @@
----
-title: Sintáxis Spread
-slug: Web/JavaScript/Referencia/Operadores/Sintaxis_Spread
-tags:
-  - ECMAScript6
-  - Iteradores
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Operators/Spread_syntax
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<div><strong>La sintaxis extendida o spread</strong> <strong>syntax</strong> permite a un elemento iterable tal como un arreglo o cadena ser expandido en lugares donde cero o más argumentos (para llamadas de  función) o elementos (para <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Grammar_and_types#Literales_Array">Array literales</a>) son esperados, o a un objeto ser expandido en lugares donde cero o más pares de valores clave (para <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Grammar_and_types#Literales">literales Tipo Objeto</a>) son esperados.</div>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-spreadsyntax.html")}}</div>
-
-<div></div>
-
-<p class="hidden">La fuente para este ejemplo interactivo está almacenada en el repositorio de GitHub. Si quieres contribuir al proyecto interactivo de ejemplos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de descarga (pull).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p>Para llamadas de funciones:</p>
-
-<pre class="syntaxbox notranslate">myFunction(...iterableObj);
-</pre>
-
-<p>Para arreglos literales o cadenas de caracteres:</p>
-
-<pre class="syntaxbox notranslate">[...iterableObj, '4', 'five', 6];</pre>
-
-<p>Para objetos literales (nuevo en ECMAScript 2018):</p>
-
-<pre class="syntaxbox notranslate">let objClone = { ...obj };</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Spread_en_llamadas_de_función">Spread en llamadas de función</h3>
-
-<h4 id="Reemplaza_apply">Reemplaza "apply"</h4>
-
-<p>Es frecuente usar {{jsxref( "Function.prototype.apply")}} en casos donde quieres usar los elementos de un arreglo como argumentos de una función.</p>
-
-<pre class="brush: js notranslate">function myFunction(x, y, z) { }
-var args = [0, 1, 2];
-myFunction.apply(null, args);</pre>
-
-<p>Con la sintaxis expandida (spread syntax), el código anterior puede ser escrito como:</p>
-
-<pre class="brush: js notranslate">function myFunction(x, y, z) { }
-var args = [0, 1, 2];
-myFunction(...args);</pre>
-
-<p>Cualquier argumento en la lista de argumentos puede usar la sintáxis expandida y esto puede ser usado varias veces.</p>
-
-<pre class="brush: js notranslate">function myFunction(v, w, x, y, z) { }
-var args = [0, 1];
-myFunction(-1, ...args, 2, ...[3]);</pre>
-
-<h4 id="Apply_para_new">"Apply" para "new"</h4>
-
-<p>Cuando se llama un constructor con <code>new</code>, no es posible usar <strong>directamente</strong> un arreglo y <code>apply</code> (<code>apply</code> hace un <code>[[Call]]</code> y no un <code>[[Construct]]</code>). Sin embargo, un arreglo puede ser fácilmente usado con un new gracias a la sintáxis expandida:</p>
-
-<pre class="brush: js notranslate">var dateFields = [1970, 0, 1];  // 1 Jan 1970
-var d = new Date(...dateFields);
-</pre>
-
-<p>Para usar <strong>new </strong>con un arreglo de parámetros sin la sintáxis expandida, podrías tener que hacerlo <strong>indirectamente </strong>a través de una aplicación parcial:</p>
-
-<pre class="brush: js notranslate">function applyAndNew(constructor, args) {
-   function partial () {
-      return constructor.apply(this, args);
-   };
-   if (typeof constructor.prototype === "object") {
-      partial.prototype = Object.create(constructor.prototype);
-   }
-   return partial;
-}
-
-
-function myConstructor () {
-   console.log("arguments.length: " + arguments.length);
-   console.log(arguments);
-   this.prop1="val1";
-   this.prop2="val2";
-};
-
-var myArguments = ["hi", "how", "are", "you", "mr", null];
-var myConstructorWithArguments = applyAndNew(myConstructor, myArguments);
-
-console.log(new myConstructorWithArguments);
-// (internal log of myConstructor):           arguments.length: 6
-// (internal log of myConstructor):           ["hi", "how", "are", "you", "mr", null]
-// (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"}</pre>
-
-<h3 id="Expandir_Array_literales">Expandir Array literales</h3>
-
-<h4 id="Un_literal_Array_más_poderoso">Un literal Array más poderoso</h4>
-
-<p>Sin <code><strong>sintaxis expandida (spread syntax)</strong></code>, para crear un nuevo arreglo usando un arreglo existente como parte de él,no es suficiente la sintaxis de Array literal y en su lugar se debe usar código imperativo con una combinación de <code>push</code>, <code>splice</code>, <code>concat</code>, etc. Con la sintaxis expandida, esto se vuelve mucho mas práctico:</p>
-
-<pre class="brush: js notranslate">var parts = ['shoulders', 'knees'];
-var lyrics = ['head', ...parts, 'and', 'toes'];
-// ["head", "shoulders", "knees", "and", "toes"]
-</pre>
-
-<p>Así como para expandir listas de argumentos, <code>...</code> puede ser usado en cualquier parte dentro del Array literal, y múltiples veces.</p>
-
-<h4 id="Copiar_un_arreglo">Copiar un arreglo</h4>
-
-<pre class="brush: js notranslate">var arr = [1, 2, 3];
-var arr2 = [...arr]; // like arr.slice()
-arr2.push(4);
-
-// arr2 becomes [1, 2, 3, 4]
-// arr remains unaffected
-</pre>
-
-<p><strong>Nota:</strong> La sintaxis expandida efectivamente va a un nivel de profundidad mientras copia un arreglo. Por lo tanto, esto no permite copiar arreglos multidimensionales como se muestra en los siguientes ejemplos (es lo mismo con {{jsxref("Object.assign()")}} y sintaxis spread).</p>
-
-<pre class="brush: js notranslate">var a = [[1], [2], [3]];
-var b = [...a];
-b.shift().shift(); // 1
-// Now array a is affected as well: [[], [2], [3]]
-</pre>
-
-<h4 id="Una_forma_mejor_para_concatenar_arreglos">Una forma mejor para concatenar arreglos</h4>
-
-<p>{{jsxref("Array.concat")}} es usada a menudo para concatenar un arreglo al final de un arreglo ya existente. Sin la sintaxis spread se realiza:</p>
-
-<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
-var arr2 = [3, 4, 5];
-// Append all items from arr2 onto arr1
-arr1 = arr1.concat(arr2);</pre>
-
-<p>Con la sintaxis spread se transforma en:</p>
-
-<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
-var arr2 = [3, 4, 5];
-arr1 = [...arr1, ...arr2];
-</pre>
-
-<p>{{jsxref("Array.unshift")}} es a menudo usada para insertar un arreglo de valores al inicio de un arreglo existente. Sin la sintáxis spread, esto es hecho como:</p>
-
-<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
-var arr2 = [3, 4, 5];
-// Prepend all items from arr2 onto arr1
-Array.prototype.unshift.apply(arr1, arr2) // arr1 is now [3, 4, 5, 0, 1, 2]</pre>
-
-<p>Con la sintaxis spread se convierte en [Observa, sin embargo, que esto crea un nuevo arreglo <code>arr1</code>.  Diferente a {{jsxref("Array.unshift")}}, esto no modifica el arreglo original en sitio <code>arr1</code>]:</p>
-
-<pre class="brush: js notranslate">var arr1 = [0, 1, 2];
-var arr2 = [3, 4, 5];
-arr1 = [...arr2, ...arr1]; // arr1 is now [3, 4, 5, 0, 1, 2]
-</pre>
-
-<h3 id="Spread_en_literales_tipo_Objeto">Spread en literales tipo Objeto</h3>
-
-<p>La propuesta <a href="https://github.com/tc39/proposal-object-rest-spread">Propiedades Rest/Spread para ECMAScript</a> (etapa 4) agrega propiedades spread a los <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer">literales Tipo Objeto</a>. Esto copia sus propiedades enumerables desde un objeto provisto dentro de un nuevo objeto.</p>
-
-<p>Shallow-cloning (excluyendo prototype) o la combinación de objetos es ahora posible usando una sintaxis más corta que {{jsxref("Object.assign()")}}.</p>
-
-<pre class="brush: js notranslate">var obj1 = { foo: 'bar', x: 42 };
-var obj2 = { foo: 'baz', y: 13 };
-
-var clonedObj = { ...obj1 };
-// Object { foo: "bar", x: 42 }
-
-var mergedObj = { ...obj1, ...obj2 };
-// Object { foo: "baz", x: 42, y: 13 }</pre>
-
-<p>Observa que {{jsxref("Object.assign()")}} desencadena <a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">setters</a> mientras que la sintaxis spread no lo hace.</p>
-
-<p>Observa que tú no puedes reemplazar o replicar la función {{jsxref("Object.assign()")}}:</p>
-
-<pre class="brush: js notranslate">var obj1 = { foo: 'bar', x: 42 };
-var obj2 = { foo: 'baz', y: 13 };
-const merge = ( ...objects ) =&gt; ( { ...objects } );
-
-var mergedObj = merge ( obj1, obj2);
-// Object { 0: { foo: 'bar', x: 42 }, 1: { foo: 'baz', y: 13 } }
-
-var mergedObj = merge ( {}, obj1, obj2);
-// Object { 0: {}, 1: { foo: 'bar', x: 42 }, 2: { foo: 'baz', y: 13 } }</pre>
-
-<p>En el ejemplo de arriba, el operador spread no trabaja como uno podría esperar: este dispersa un <em>arreglo</em> de argumentos en el literal Tipo Objeto, debido al parámetro rest.</p>
-
-<h3 id="Sólo_para_iterables">Sólo para iterables</h3>
-
-<p>La sintaxis Spread (otra que en el caso de las propiedades spread) puede ser aplicada sólo a los objetos <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol/iterator">iterables</a>:</p>
-
-<pre class="brush: js notranslate">var obj = {'key1': 'value1'};
-var array = [...obj]; // TypeError: obj is not iterable
-</pre>
-
-<h3 id="Spread_con_muchos_valores">Spread con muchos valores</h3>
-
-<p>Cuando se usa la sintaxis spread para llamados de funciones, tenga en cuenta la posibilidad de exceder el límite de longitud de argumentos del motor de JavaScript. Vea <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply" title="The apply() method calls a function with a given this value, and arguments provided as an array (or an array-like object)."><code>apply()</code></a> para más detalles.</p>
-
-<h2 id="Sintaxis_Rest_parámetros">Sintaxis Rest (parámetros)</h2>
-
-<p>La sintaxis Rest luce exactamente como la sintaxis spread, pero esto es usado por la desestructuración de arreglos y objetos. De cierta forma, la sintaxis rest es la opuesta a la sintaxis spread: spread 'expande' un arreglo en sus elementos, mientras rest agrupa múltiples elementos y los 'condensa' en un único elemento. Consulta <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/rest_parameters">parámetros rest.</a></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-array-initializer')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definido en varias secciones de la especificación: <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-array-initializer">Array Initializer</a>, <a href="http://www.ecma-international.org/ecma-262/6.0/#sec-argument-lists">Argument Lists</a></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-array-initializer')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Sin cambios.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-object-initializer')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Definido en <a href="https://tc39.github.io/ecma262/2018/#sec-object-initializer">Object Initializer</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta página es generada a partir de datos estructurados. Si quieres contribuir con esta información, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud (pull).</div>
-
-<p>{{Compat("javascript.operators.spread")}}</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/rest_parameters">Rest parameters</a> (también ‘<code>...</code>’)</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/spread_operator/index.html b/files/es/web/javascript/referencia/operadores/spread_operator/index.html
deleted file mode 100644
index 050a2026f6..0000000000
--- a/files/es/web/javascript/referencia/operadores/spread_operator/index.html
+++ /dev/null
@@ -1,220 +0,0 @@
----
-title: Operador de propagación
-slug: Web/JavaScript/Referencia/Operadores/Spread_operator
-tags:
-  - Experimental
-  - Expérimental(2)
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators/Spread_syntax
-translation_of_original: Web/JavaScript/Reference/Operators/Spread_operator
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de propagación <em><strong>spread operator</strong></em> permite que una expresión sea expandida en situaciones donde se esperan múltiples argumentos (llamadas a funciones) o múltiples elementos (arrays literales).</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p>Llamadas a funciones:</p>
-
-<pre class="brush: js">f(...iterableObj);
-</pre>
-
-<p>Arrays literales:</p>
-
-<pre class="brush: js">[...iterableObj, 4, 5, 6]</pre>
-
-<p>Desestructuración <em>destructuring</em>:</p>
-
-<pre class="brush: js">[a, b, ...iterableObj] = [1, 2, 3, 4, 5];</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Un_mejor_método_apply">Un mejor método apply</h3>
-
-<p><strong>Ejemplo:</strong> Es común usar {{jsxref( "Function.prototype.apply")}} en casos donde se require un array como contenedor de los argumentos que se enviarán a una llamada de función:</p>
-
-<pre class="brush: js">function f(x, y, z) { }
-var args = [0, 1, 2];
-f.apply(null, args);</pre>
-
-<p>Con el operador spread de ES6, el ejemplo anterior se puede rescribir como:</p>
-
-<pre class="brush: js">function f(x, y, z) { }
-var args = [0, 1, 2];
-f(...args);</pre>
-
-<p>Cualquier argumento en la lista de argumentos puede usar la sintaxis de propagación <em>spread, </em>donde además puede ser usada varias veces.</p>
-
-<pre class="brush: js">function f(v, w, x, y, z) { }
-var args = [0, 1];
-f(-1, ...args, 2, ...[3]);</pre>
-
-<h3 id="Un_array_literal_mas_poderoso">Un array literal mas poderoso</h3>
-
-<p><strong>Ejemplo:</strong> La sintaxis de un array literal que existe hoy en día no es suficiente si se requiere agregar los elementos de un array dentro de otro array existente. Actualmente se debe escribir código imperativo usando una combinación de métodos como <code>push</code>, <code>splice</code>, <code>concat</code>, etc. Con la sintaxis de propagación <em>spread</em> esta tarea resulta mucho mas concisa:</p>
-
-<pre class="brush: js">var parts = ['shoulder', 'knees'];
-var lyrics = ['head', ...parts, 'and', 'toes'];</pre>
-
-<p>Al igual que con una lista de argumentos, en este caso también puede ser usado en cualquier ubicación dentro del array literal, además de poderse incluir una o varias veces.</p>
-
-<h3 id="Combinación_del_método_apply_y_el_operador_new">Combinación del método apply y el operador new</h3>
-
-<p><strong>Ejemplo:</strong> En ES5 no es posible combinar <code>new</code> y <code>apply</code> (en ES5  el método <code>apply</code> crea un <code>[[Call]]</code> y no un <code>[[Construct]]</code>). En ES6 la sintaxis de propagación <em>spread</em> soporta esto de forma natural:</p>
-
-<pre class="brush: js">var dateFields = readDateFields(database);
-var d = new Date(...dateFields);</pre>
-
-<h3 id="Un_método_push_mejorado">Un método push mejorado</h3>
-
-<p><strong>Ejemplo:</strong> {{jsxref("Global_Objects/Array/push", "push")}} suele usarse para agregar los elementos de un array al final de otro array existente. En ES5 esta tarea puede ser realizada de la siguiente manera:</p>
-
-<pre class="brush: js">var arr1 = [0, 1, 2];
-var arr2 = [3, 4, 5];
-// Agregar todos los elementos de arr2 a arr1
-Array.prototype.push.apply(arr1, arr2);</pre>
-
-<p>Usando el operador de propagación <em>spread</em> de ES6, este sería el resultado:</p>
-
-<pre class="brush: js">var arr1 = [0, 1, 2];
-var arr2 = [3, 4, 5];
-arr1.push(...arr2);</pre>
-
-<h3 id="Solo_funciona_para_iterables">Solo funciona para iterables</h3>
-
-<pre class="brush: js">var obj = {"key1":"value1"};
-function myFunction(x) {
-    console.log(x); // undefined
-}
-myFunction(...obj);
-var args = [...obj];
-console.log(args, args.length) //[] 0</pre>
-
-<h2 id="Operador_Rest">Operador Rest</h2>
-
-<p>El operador <em>Rest</em> es exactamente igual a la sintaxis del operador de propagación, y se utiliza para desestructurar arrays y objetos. En cierto modo, <em>Rest</em> es lo contrario de <em>spread</em>. <em>Spread</em> 'expande' un array en sus elementos, y <em>Rest</em> recoge múltiples elementos y los 'condensa' en uno solo.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Commentario</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>
-    <p>{{SpecName('ES6', '#sec-array-initializer', 'Array Initializer')}}<br>
-     {{SpecName('ES6', '#sec-argument-lists', 'Argument Lists')}}</p>
-   </td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>
-    <ul>
-     <li>12.2.4 Array Initializer</li>
-     <li>12.3.6 Argument Lists</li>
-    </ul>
-   </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Operación de spread en arrays literales</td>
-   <td>{{CompatNo}}<br>
-    <a href="https://code.google.com/p/v8/issues/detail?id=3018">v8 issue 3018</a></td>
-   <td>{{ CompatGeckoDesktop("16") }}<br>
-    {{ CompatGeckoDesktop("36") }} (Symbol.iterator)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>7.1</td>
-  </tr>
-  <tr>
-   <td>Operación de spread en llamadas a funciones</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoDesktop("27") }}<br>
-    {{ CompatGeckoDesktop("36") }} (Symbol.iterator)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>7.1</td>
-  </tr>
-  <tr>
-   <td>Operación de spread en desestructuración<br>
-    <em>destructuring</em></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{ CompatGeckoDesktop("34") }}<br>
-    {{ CompatGeckoDesktop("36") }} (Symbol.iterator)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Características</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td><span style="font-size: 12px; line-height: 18px;">Operación de spread en arrays literales</span></td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("16") }}<br>
-    {{ CompatGeckoMobile("36") }} (Symbol.iterator)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>iOS 8</td>
-  </tr>
-  <tr>
-   <td><span style="font-size: 12px; line-height: 18px;">Operación de spread en llamadas a funciones</span></td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("27") }}<br>
-    {{ CompatGeckoMobile("36") }} (Symbol.iterator)</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>iOS 8</td>
-  </tr>
-  <tr>
-   <td><span style="font-size: 12px; line-height: 18px;">Operación de spread en desestructuración</span><br>
-    <em>destructuring</em></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{ CompatGeckoDesktop("34") }}<br>
-    {{ CompatGeckoMobile("36") }} (Symbol.iterator)</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Temas_relacionados">Temas relacionados</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/rest_parameters">Parámetros rest</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/strict_equality/index.html b/files/es/web/javascript/referencia/operadores/strict_equality/index.html
deleted file mode 100644
index 0d09b1de71..0000000000
--- a/files/es/web/javascript/referencia/operadores/strict_equality/index.html
+++ /dev/null
@@ -1,101 +0,0 @@
----
-title: Igualdad Estricta (===)
-slug: Web/JavaScript/Referencia/Operadores/Strict_equality
-translation_of: Web/JavaScript/Reference/Operators/Strict_equality
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de estricta igualdad (<code>===</code>) revisa si dos operandos son iguales y produce un resultado Booleano. A diferencia del operador de igualdad regular (==), el operador de estricta igualdad siempre considera que los operandos de distinto tipo de valor son diferentes y nunca similares.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-strict-equality.html")}}</div>
-
-<div class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">x === y</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los operadores de estricta igualdad (<code>===</code> y <code>!==</code>) usan el <a class="external external-icon" href="http://www.ecma-international.org/ecma-262/5.1/#sec-11.9.6" rel="noopener">Algoritmo Estricto Comparativo de Igualdad </a> para comparar dos operandos:</p>
-
-<ul>
- <li>Si los operandos son de diferente tipo de valor, produce <code>false</code>.</li>
- <li> Si ambos operandos son objetos, produce <code>true</code> solo si se refiere al mismo objeto.</li>
- <li>Si ambos operandos son de tipo <code>null</code> o ambos operandos son <code>undefined</code>, produce <code>true</code>.</li>
- <li>Si cualquier operando es de tipo <font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">NaN</span></font>, produce <code>false</code>.</li>
- <li>En otros casos, compara los valores de ambos operandos:
-  <ul>
-   <li>Los números deben tener el mismo valor numérico, aunque <code>+0</code> y <code>-0</code> son considerados como del mismo valor.</li>
-   <li>Los strings deben tener los mismos caracteres en el mismo orden.</li>
-   <li>Los booleanos deben ambos ser <code>true</code> o ambos ser <code>false</code>.</li>
-  </ul>
- </li>
-</ul>
-
-<p>La diferencia más notable entre este operador y el operador de <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Equality">igualdad</a> regular (<code>==</code>) es que si los operandos son de distinto tipo de valor, el operador <code>==</code> intenta convertir los valores a un mismo tipo de dato antes de compararlos.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Comparando_operandos_del_mismo_tipo">Comparando operandos del mismo tipo</h3>
-
-<pre class="brush: js notranslate">console.log("hello" === "hello");   // true
-console.log("hello" === "hola");    // false
-
-console.log(3 === 3);               // true
-console.log(3 === 4);               // false
-
-console.log(true === true);         // true
-console.log(true === false);        // false
-
-console.log(null === null);         // true</pre>
-
-<h3 id="Comparando_operandos_de_distinto_tipo">Comparando operandos de distinto tipo</h3>
-
-<pre class="brush: js notranslate">console.log("3" === 3);           // false
-
-console.log(true === 1);          // false
-
-console.log(null === undefined);  // false</pre>
-
-<h3 id="Comparando_objetos">Comparando objetos</h3>
-
-<pre class="brush: js notranslate">const object1 = {
-  name: "hello"
-}
-
-const object2 = {
-  name: "hello"
-}
-
-console.log(object1 === object2);  // false
-console.log(object1 === object1);  // true</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-equality-operators', 'Equality operators')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_exploradores">Compatibilidad entre exploradores</h2>
-
-
-
-<p>{{Compat("javascript.operators.strict_equality")}}</p>
-
-<h2 id="También_revisa">También revisa</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Equality">Operador de igualdad</a></li>
- <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Inequality">Operador de desigualdad</a></li>
- <li><a href="/es/docs/Web/JavaScript/Reference/Operators/Strict_inequality">Operador de estricta desigualdad</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/super/index.html b/files/es/web/javascript/referencia/operadores/super/index.html
deleted file mode 100644
index ff2ac5ae0e..0000000000
--- a/files/es/web/javascript/referencia/operadores/super/index.html
+++ /dev/null
@@ -1,178 +0,0 @@
----
-title: super
-slug: Web/JavaScript/Referencia/Operadores/super
-tags:
-  - Clases
-  - ECMAScript 2015
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators/super
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>La palabra clave <strong>super</strong> es usada para acceder y llamar funciones del padre de un objeto.</p>
-
-<p>Las expresiones <code>super.prop</code> y <code>super[expr]</code> son válidas en cualquier <a href="/es/docs/Web/JavaScript/Reference/Functions/Method_definitions">definición de método</a> tanto para <a href="/es/docs/Web/JavaScript/Reference/Classes">clases</a> como para <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">objetos literales</a>.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">// llama al método constructor del objeto padre.
-super([arguments]);
-
-// llama cualquier otro método del objeto padre.
-super.functionOnParent([arguments]);
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Cuando es usado en un constructor, la palabra clave <code>super</code> aparece  sola lo cual invoca el constructor del objeto padre. En este caso debe usarse antes de que la palabra clave <code>this</code> sea usada. La palabra clave <code>super</code> también puede utilizarse para llamar otras funciones del objeto padre.</p>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<h3 id="Usando_super_en_clases">Usando <code>super</code> en clases</h3>
-
-<p>Este fragmento de código se toma del <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/classes-es6/index.html">ejemplo de clases</a> (<a href="https://googlechrome.github.io/samples/classes-es6/index.html">demo en vivo</a>). Aquí se llama a <code>super()</code> para evitar la duplicación de las partes del constructor que son comunes entre <code>Rectangle</code> y <code>Square</code>.</p>
-
-<pre class="brush: js">class Rectangle {
-  constructor(height, width) {
-    this.name = 'Rectangle';
-    this.height = height;
-    this.width = width;
-  }
-  sayName() {
-    console.log('Hi, I am a ', this.name + '.');
-  }
-  get area() {
-    return this.height * this.width;
-  }
-  set area(value) {
-    this.height = this.width = Math.sqrt(value);
-  }
-}
-
-class Square extends Rectangle {
-  constructor(length) {
-    this.height; // ReferenceError, super necesita ser llamado primero!
-
-    // Aquí, llama al constructor de la clase padre con las longitudes
-    // previstas para el ancho y la altura de Rectangle
-    super(length, length);
-
-    // Nota: En las clases derivadas, se debe llamar a super() antes de
-    // poder usar 'this'. Salir de esto provocará un error de referencia.
-    this.name = 'Square';
-  }
-}</pre>
-
-<h3 id="Super-llamando_a_métodos_estáticos">Super-llamando a métodos estáticos</h3>
-
-<p>También puede llamar a super en métodos estáticos.</p>
-
-<pre class="brush: js">class Rectangle {
-  constructor() {}
-  static logNbSides() {
-    return 'I have 4 sides';
-  }
-}
-
-class Square extends Rectangle {
-  constructor() {}
-  static logDescription() {
-    return super.logNbSides() + ' which are all equal';
-  }
-}
-Square.logDescription(); // 'Tengo 4 lados que son todos iguales'
-</pre>
-
-<h3 id="Eliminar_propiedades_super_generará_un_error">Eliminar propiedades <code>super</code> generará un error</h3>
-
-<p>No puede usar el <a href="/es/docs/Web/JavaScript/Reference/Operators/delete">operador de eliminación</a> y <code>super.prop</code> o <code>super[expr]</code> para eliminar la propiedad de una clase principal, lanzará {{jsxref("ReferenceError")}}.</p>
-
-<pre class="brush: js">class Base {
-  constructor() {}
-  foo() {}
-}
-class Derived extends Base {
-  constructor() {}
-  delete() {
-    delete super.foo; // esto es malo
-  }
-}
-
-new Derived().delete(); // ReferenceError: eliminación no válida que implica 'super'. </pre>
-
-<h3 id="super.prop_no_puede_sobrescribir_las_propiedades_no_modificables"><code>super.prop</code> no puede sobrescribir las propiedades no modificables</h3>
-
-<p>Al definir propiedades que no se pueden escribir, p. Ej. {{jsxref("Object.defineProperty")}}, <code>super</code> no puede sobrescribir el valor de la propiedad.</p>
-
-<pre class="brush: js">class X {
-  constructor() {
-    Object.defineProperty(this, 'prop', {
-      configurable: true,
-      writable: false,
-      value: 1
-    });
-  }
-  f() {
-    super.prop = 2;
-  }
-}
-
-var x = new X();
-x.f(); // TypeError: "prop" es de solo lectura
-console.log(x.prop); // 1
-</pre>
-
-<h3 id="Usando_super.prop_en_objetos_literales">Usando <code>super.prop</code> en objetos literales</h3>
-
-<p>Super también se puede usar en el <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer">inicializador de objetos / notación literal</a>. En este ejemplo, dos objetos definen un método. En el segundo objeto, <code>super</code> llama al primer método del objeto. Esto funciona con la ayuda de {{jsxref("Object.setPrototypeOf()")}} con el que podemos establecer el prototipo de <code>obj2</code> en <code>obj1</code>, de modo que <code>super</code> pueda encontrar el <code>method1</code> en <code>obj1</code>.</p>
-
-<pre class="brush: js">var obj1 = {
-  method1() {
-    console.log('method 1');
-  }
-}
-
-var obj2 = {
-  method2() {
-   super.method1();
-  }
-}
-
-Object.setPrototypeOf(obj2, obj1);
-obj2.method2(); // logs "method 1"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-super-keyword', 'super')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-super-keyword', 'super')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-
-
-<p>{{Compat("javascript.operators.super")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Reference/Classes">Clases</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/sustracción/index.html b/files/es/web/javascript/referencia/operadores/sustracción/index.html
deleted file mode 100644
index 21bfd3a1ac..0000000000
--- a/files/es/web/javascript/referencia/operadores/sustracción/index.html
+++ /dev/null
@@ -1,65 +0,0 @@
----
-title: Sustracción (-)
-slug: Web/JavaScript/Referencia/Operadores/Sustracción
-tags:
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Operators/Subtraction
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p>El operador de sustracción (<code>-</code>) sustrae dos operandos, produciendo su diferencia.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-subtraction.html")}}</div>
-
-<div></div>
-
-
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate"><strong>Operator:</strong> <var>x</var> - <var>y</var>
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Sustracción_con_números">Sustracción con números</h3>
-
-<pre class="brush: js notranslate">5 - 3     // 2
-3 - 5     // -2</pre>
-
-<h3 id="Sustracción_de_no_numéricos">Sustracción de no numéricos</h3>
-
-<pre class="brush: js notranslate">'foo' - 3 // NaN</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-subtraction-operator-minus', 'Subtraction operator')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_exploradores">Compatibilidad entre exploradores</h2>
-
-
-
-<p>{{Compat("javascript.operators.subtraction")}}</p>
-
-<h2 id="También_revisa">También revisa</h2>
-
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Addition">Addition operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Division">Division operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Multiplication">Multiplication operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Remainder">Remainder operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Exponentiation">Exponentiation operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Increment">Increment operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Decrement">Decrement operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_negation">Unary negation operator</a></li>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Operators/Unary_plus">Unary plus operator</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/this/index.html b/files/es/web/javascript/referencia/operadores/this/index.html
deleted file mode 100644
index 74ed62bb60..0000000000
--- a/files/es/web/javascript/referencia/operadores/this/index.html
+++ /dev/null
@@ -1,239 +0,0 @@
----
-title: this
-slug: Web/JavaScript/Referencia/Operadores/this
-translation_of: Web/JavaScript/Reference/Operators/this
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<h2 id="Introducción">Introducción</h2>
-
-<p>La palabra clave <strong><code>this</code></strong> de una función se comporta un poco diferente en Javascript en comparación con otros lenguajes. Además tiene algunas diferencias entre el <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Modo_estricto" title="en-US/docs/JavaScript/Strict mode">modo estricto</a> y el modo no estricto.</p>
-
-<p>En general, el valor de <code>this</code> está determinado por cómo se invoca a la función. No puede ser establecida mediante una asignación en tiempo de ejecución, y puede ser diferente cada vez que la función es invocada. ES5 introdujo el método {{jsxref("Function.bind()", "bind()")}} para <a href="#Funciones_enlazadas" title="https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Special/this#Bound_functions">establecer el valor de la función <code>this</code> independientemente de como es llamada</a>, y ES2015 introdujo las <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Arrow_functions">funciones flecha</a> que no proporcionan su propio "binding" de <code>this</code> (se mantiene el valor de <code>this</code> del contexto léxico que envuelve a la función)</p>
-
-<p>{{EmbedInteractiveExample("pages/js/expressions-this.html")}}</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">this</pre>
-
-<h3 id="Valor">Valor</h3>
-
-<p>El objeto contexto de JavaScript en el cual se está ejecutando el código actual.</p>
-
-<h2 id="Contexto_global">Contexto global</h2>
-
-<p>En el contexto de ejecución global (fuera de cualquier función), <strong><code>this</code></strong> se refiere al objeto global, ya sea en modo estricto o no.</p>
-
-<pre class="brush:js">console.log(this.document === document); // true
-
-// En los navegadores web, el objeto window también es un objeto global:
-console.log(this === window); // true
-
-this.a = 37;
-console.log(window.a); // 37
-</pre>
-
-<div class="blockIndicator note">
-<p><font><font>Nota: Puedes obtener el objeto global usando la propieda global <code>globalThis</code>, no importa el contexto donde se ejecute esta propiedad, siempre hará referencia al objeto global. </font></font></p>
-</div>
-
-<h2 id="Contexto_de_la_función">Contexto de la función</h2>
-
-<p><span class="hps" style="line-height: 1.5;">Dentro de una</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">función</span><span style="line-height: 1.5;">, </span><span class="hps" style="line-height: 1.5;">el valor de this</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">depende de cómo</span><span style="line-height: 1.5;"> la función es l</span><span class="hps" style="line-height: 1.5;">lamada</span><span id="result_box" lang="es" style="line-height: 1.5;">.</span></p>
-
-<h3 id="Llamada_simple">Llamada simple</h3>
-
-<pre class="brush:js">function f1(){
-  return this;
-}
-
-f1() === window; // objeto global
-</pre>
-
-<div><span class="hps" style="line-height: 1.5;">En</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">este caso</span><span style="line-height: 1.5;">,</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">el valor de <strong>this</strong></span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">no está establecido</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">por</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">la llamada</span><span style="line-height: 1.5;">.</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">Dado que el código</span><span style="line-height: 1.5;"> </span><span class="alt-edited hps" style="line-height: 1.5;">no está</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">en modo estricto</span><span style="line-height: 1.5;">, </span><span class="hps" style="line-height: 1.5;">el valor de this</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">debe ser siempre</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">un objeto</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">por lo que</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">por defecto es el</span><span style="line-height: 1.5;"> </span><span class="hps" style="line-height: 1.5;">objeto global</span><span style="line-height: 1.5;">.</span></div>
-
-<div></div>
-
-<div>
-<pre class="brush:js" style="font-size: 14px;">function f2(){
-  "use strict"; // consultar modo estricto
-  return this;
-}
-
-f2() === undefined;</pre>
-</div>
-
-<div><span style="line-height: 1.5;">En modo estricto, el valor de <strong>this</strong> se mantiene en lo que está establecida al entrar en el contexto de ejecución. Si no está definido, permanece undefined. También se puede ajustar a cualquier valor, tales como <strong>null</strong> o <strong>42</strong> o "<strong>Yo no soy this</strong>".</span></div>
-
-<div></div>
-
-<div class="note">
-<p><strong>Nota:</strong> En el segundo ejemplo, <strong><code>this</code></strong> debería ser {{jsxref("undefined")}}, porque <code>f2</code> fue llamado sin proporcionar ninguna base (ej. <code>window.f2()</code>). Esta característica no fue implementada en algunos navegadores cuando se comenzó a dar soporte al <a href="/es/docs/Web/JavaScript/Referencia/Funciones/Modo_estricto" title="Strict mode">modo estricto</a>. Como resultado, retorna incorrectamente el objeto window.</p>
-</div>
-
-<div><span>Como un método de un objeto</span></div>
-
-<p>Cuando una función es llamada como un método de un objeto, el <strong><code>this</code></strong> cambia por el metodo del objeto llamado.</p>
-
-<p>En el siguiente ejemplo, cuando <strong><code>o.f()</code></strong> es invocado, dentro de la función <strong><code>this</code></strong> es ligado al objeto <strong><code>o</code></strong>.</p>
-
-<pre class="brush:js">var o = {
-  prop: 37,
-  f: function() {
-    return this.prop;
-  }
-};
-
-console.log(o.f()); // logs 37
-</pre>
-
-<p>Note que el comportamiento no es del todo afectado por cómo o dónde la función fue definida. En el ejemplo anterior, nosotros definimos la función en línea como el elemento <code>f</code> durante la definición de <code>o</code>.  Sin embargo, podriamos haber definido con la misma facilidad la primera función y luego  adjuntarlo a <code>o.f</code>. Hacerlo da como resultado el mismo comportamiento.</p>
-
-<pre class="brush:js">var o = {prop: 37};
-
-function independent() {
-  return this.prop;
-}
-
-o.f = independent;
-
-console.log(o.f()); // logs 37
-</pre>
-
-<p>Esto demuestra que sólo importa que la función fue invocada del elemento <code>f</code> de <code>o</code>.</p>
-
-<p>Asimismo, el enlace <code>this</code> sólo se ve afectado por la referencia del miembro más inmediata. En el siguiente ejemplo, cuando invocamos a la función, lo llamamos como metodo <code>g</code> del objeto <code>o.b</code>. Esta vez durante la ejecución, <code>this </code>dentro de la función se referirá a <code>o.b</code>. <span id="result_box" lang="es"><span class="hps">El hecho de que</span> <span class="hps">el objeto</span> <span class="hps">es en sí mismo</span> <span class="alt-edited hps">un elemento</span> <span class="hps">de </span></span><code>o</code><span id="result_box" lang="es"> <span class="hps">no tiene ninguna</span> <span class="hps">consecuencia</span><span>,</span> <span class="hps">la referencia más</span> <span class="hps">inmediata es</span> <span class="hps">todo lo que importa</span><span>.</span></span></p>
-
-<pre class="brush:js">o.b = {g: independent, prop: 42};
-console.log(o.b.g()); // logs 42
-</pre>
-
-<h4 id="..._en_la_cadena_de_prototipo">... en la cadena de prototipo</h4>
-
-<p>El mismo concepto es válido para los métodos definidos en alguna parte de la cadena de prototipo del objeto. Si el método esta sobre una cadena de prototipo del objeto, <code>this</code> se referirá al objeto donde está el método de donde fue llamado. Como si ese método estuviera dentro del objeto. </p>
-
-<pre class="brush:js">var o = {f:function(){ return this.a + this.b; }};
-var p = Object.create(o);
-p.a = 1;
-p.b = 4;
-
-console.log(p.f()); // 5
-</pre>
-
-<p>En este ejemplo, el objeto asignado a la variable <code>p</code> no tiene su propia propiedad <code>f</code>, esto lo hereda de su prototipo. Pero no importa que la búsqueda de <code>f</code> eventualmente encuentre un elemento con ese nombre en <code>o</code>; la búsqueda comenzó como una referencia a <code>p.f</code>, asi <code>this </code>dentro de la funcion toma el valor del objeto referido como <code>p</code>. Es decir, desde que <code>f</code> es llamado como método de <code>p</code>, su <code>this</code> refiere a <code>p</code>. Esto es una interesante característica de la herencia de prototipo de JavaScript.</p>
-
-<h4 id="..._o_como_un_getter_o_setter">... o como un getter o setter</h4>
-
-<p>Nuevamente, el mismo concepto es válido cuando una función es invocada de un getter o un setter. Una función usado como getter o setter tiene su enlace <code>this</code> al objeto desde el cual la propiedad esta siendo establecida u obtenida.</p>
-
-<pre class="brush:js">function modulus(){
-  return Math.sqrt(this.re * this.re + this.im * this.im);
-}
-
-var o = {
-  re: 1,
-  im: -1,
-  get phase(){
-    return Math.atan2(this.im, this.re);
-  }
-};
-
-Object.defineProperty(o, 'modulus', {get: modulus, enumerable:true, configurable:true});
-
-console.log(o.phase, o.modulus); // logs -0.78 1.4142
-</pre>
-
-<h3 id="Como_un_constructor">Como un constructor</h3>
-
-<p>Cuando una función es usada como un constructor (con la palabra clave {{jsxref("Operadores/new", "new")}}), su <code>this</code> es enlazado al nuevo objeto en construcción, a menos que la ejecución de los resultados del constructor en el motor JavaScript encuentren una instrucción de retorno donde el valor de retorno sea un objeto.</p>
-
-<pre class="brush:js">/*
- * Los constructores trabajan algo asi:
- *
- * function MyConstructor(){
- *   // El cuerpo del código de la función actual va aquí.  Crear las propiedades en |this| como
- *   // se desee mediante la asignación a los mismos.  E.g.,
- *   this.fum = "nom";
- *   // etcetera...
- *
- *   // Si la función tiene una sentencia de retorno este retorna un objeto,
- *   // este objeto será el resultado de la expresión |new|.  Por otro lado, el
- *   // resultado de la expresión es el objeto actualmente enlazado a |this|
- *   // (i.e., el caso más común suele verse).
- * }
- */
-
-function C(){
-  this.a = 37;
-}
-
-var o = new C();
-console.log(o.a); // logs 37
-
-
-function C2(){
-  this.a = 37;
-  return {a:38};
-}
-
-o = new C2();
-console.log(o.a); // logs 38
-</pre>
-
-<p>En el último ejemplo (<code>C2</code>), debido a que un objeto fue devuelto durante la construcción, el nuevo objeto que fue enlazado a <code>this</code> simplemente se descarta.( Esto esencialmente hace de la declaración "<code>this.a = 37;</code>" codigo muerto. No esta exactamente muerto,porque es ejecutado pero se puede eliminar sin efectos externos.)</p>
-
-<h3 id="call_y_apply"><code>call</code> y <code>apply</code></h3>
-
-<p>Cuando una función usa la plabra clave <code>this</code> en su cuerpo, su valor puede ser enlazado a un objeto particular durante la ejecución del método {{jsxref("Function.call()", "call()")}} or {{jsxref("Function.apply()", "apply()")}} que todas las funciones hereden de  <code>Function.prototype</code>.</p>
-
-<pre class="brush:js">function add(c, d){
-  return this.a + this.b + c + d;
-}
-
-var o = {a:1, b:3};
-
-// El primer parámetro es el objeto a usar como 'this', parámetros posteriores se pasan como argumentos
-// en la llamada a la función
-add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16
-
-//El primer parámetro es el objeto a usar como 'this''this', la segunda es una matriz cuyos elementos
-//  se utilizan como argumentos en la llamada a la función
-add.apply(o, [10, 20]); // 1 + 3 + 10 + 20 = 34
-</pre>
-
-<h3 id="Funciones_enlazadas">Funciones enlazadas</h3>
-
-<p>ECMAScript 5 introduce {{jsxref("Function.prototype.bind()")}}. Llamando a <code>f.bind(someObject)</code> crea una nueva función con el mismo cuerpo y alcance de <code>f</code>, pero donde <code>this</code> se produce en la función original, en la nueva función esto esta permanentemente ligado al primer argumento de <code>bind</code>, independientemente de cómo la función está siendo utilizada.</p>
-
-<pre class="brush:js">function f(){
-  return this.a;
-}
-
-var g = f.bind({a:"azerty"});
-console.log(g()); // azerty
-
-var o = {a:37, f:f, g:g};
-console.log(o.f(), o.g()); // 37, azerty
-</pre>
-
-<h3 id="Como_un_controlador_de_eventos_DOM">Como un controlador de eventos DOM</h3>
-
-<p>Cuando una función es usada como un controlador de eventos, su <code>this</code> es cambiado desde el elemento del evento disparado (algunos navegadores no siguen esta convención para los listeners agregados dinámicamente con otros métodos <code>addEventListener</code>).</p>
-
-<pre class="brush:js">// Cuando se llama como un listener, convierte en azul el elemento
-// relacionado
-function bluify(e){
-  console.log(this === e.currentTarget); // Siempre true
-  console.log(this === e.target);        // true cuando currentTarget y target son el mismo objeto
-  this.style.backgroundColor = '#A5D9F3';
-}
-
-// Consigue una lista de cada elemento en un documento
-var elements = document.getElementsByTagName('*');
-
-// Añade bluify como un click listener asi cuando se hace click sobre el elemento,
-// este cambia a azul
-for(var i=0 ; i&lt;elements.length ; i++){
-  elements[i].addEventListener('click', bluify, false);
-}</pre>
diff --git a/files/es/web/javascript/referencia/operadores/typeof/index.html b/files/es/web/javascript/referencia/operadores/typeof/index.html
deleted file mode 100644
index 088791f228..0000000000
--- a/files/es/web/javascript/referencia/operadores/typeof/index.html
+++ /dev/null
@@ -1,76 +0,0 @@
----
-title: typeof
-slug: Web/JavaScript/Referencia/Operadores/typeof
-tags:
-  - JavaScript
-  - Operator
-  - Unary
-translation_of: Web/JavaScript/Reference/Operators/typeof
----
-<div><span class="diff_add">{{jsSidebar("Operators")}}</span></div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El operador <code>typeof</code> se usa en cualquiera de los siguientes modos:</p>
-
-<ol>
- <li><code>typeof <em>operando</em> </code></li>
- <li><code>typeof (<em>operando</em>)</code></li>
-</ol>
-
-<p>El operador <code>typeof</code> devuelve una cadena que indica el tipo del operando sin evaluarlo. <code>operando</code> es la cadena, variable, palabra clave u objeto para el que se devolverá su tipo. Los paréntesis son opcionales.</p>
-
-<p>Suponga que define las siguientes variables:</p>
-
-<pre class="brush: js">var miFuncion = new Function("5+2")
-var forma = "redonda"
-var tamano = 1
-var hoy = new Date()
-</pre>
-
-<p>El operador <code>typeof</code> devuelve los siguientes resultados para estas variables</p>
-
-<pre class="brush: js">typeof miFuncion === 'function'
-typeof forma === 'string'
-typeof tamano === 'number'
-typeof hoy === 'object'
-typeof noExiste === 'undefined'
-</pre>
-
-<p>Para las palabras clave <code>true</code> y <code>null</code>, el operador <code>typeof</code> devuelve los siguientes resultados:</p>
-
-<pre class="brush: js">typeof true === 'boolean'
-typeof null === 'object'
-</pre>
-
-<p>Para un número o una cadena, el operador <code>typeof</code> devuelve los siguientes resultados:</p>
-
-<pre class="brush: js">typeof 62 === 'number'
-typeof 'Hola mundo' === 'string'
-</pre>
-
-<p>Para valores de propiedades, el operador <code>typeof</code> devuelve el tipo del valor que contiene la propiedad:</p>
-
-<pre class="brush: js">typeof document.lastModified === 'string'
-typeof window.length === 'number'
-typeof Math.LN2 === 'number'
-</pre>
-
-<p>Para métodos y funciones, el operador <code>typeof</code> devuelve los resultados siguientes:</p>
-
-<pre class="brush: js">typeof blur === 'function'
-typeof eval === 'function'
-typeof parseInt === 'function'
-typeof shape.split === 'function'
-</pre>
-
-<p>Para objetos predefinidos, el operador <code>typeof</code> devuelve los siguientes resultados:</p>
-
-<pre class="brush: js">typeof Date === 'function'
-typeof Function === 'function'
-typeof Math === 'object'
-typeof Object === 'function'
-typeof String === 'function'
-</pre>
-
-<p> </p>
diff --git a/files/es/web/javascript/referencia/operadores/void/index.html b/files/es/web/javascript/referencia/operadores/void/index.html
deleted file mode 100644
index 0bf8048b21..0000000000
--- a/files/es/web/javascript/referencia/operadores/void/index.html
+++ /dev/null
@@ -1,36 +0,0 @@
----
-title: void
-slug: Web/JavaScript/Referencia/Operadores/void
-tags:
-  - JavaScript
-  - Operator
-  - Unary
-translation_of: Web/JavaScript/Reference/Operators/void
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>El operador <code>void</code> se usa en cualquiera de los siguientes modos:</p>
-
-<ol>
- <li><code>void (<em>expresion</em> )</code></li>
- <li><code>void <em>expresion</em> </code></li>
-</ol>
-
-<p>El operador <code>void</code> especifica una expresión que se evalúa sin devolver un valor. <code>expresion</code> es una expresión JavaScript para evaluar. El paréntesis rodeando la expresión es opcional, pero usarlos es una buena práctica al programar.</p>
-
-<p>Puede usar el operador <code>void</code> para especificar una expresión como un enlace de hipertexto. La expresión se evalúa pero no se carga en lugar del documento actual.</p>
-
-<p>El siguiente código crea un enlace de hipertexto que no hace nada cuando el usuario hace click en él. Cuando el usuario hace click en el enlace, void(0) se evalúa como 0, pero eso no tiene ningún efecto en JavaScript.</p>
-
-<pre class="brush: html">&lt;a href="javascript:void(0)"&gt;Haga click aquí para no hacer nada&lt;/a&gt;
-</pre>
-
-<p>El siguiente código crea un enlace de hipertexto que envía un formulario cuando el usuario hace click en él.</p>
-
-<pre class="brush: html">&lt;a href="javascript:void(document.forms["miFormulario"].submit())"&gt;
-Haga click aquí para enviar&lt;/a&gt;
-</pre>
-
-<div class="noinclude"></div>
diff --git a/files/es/web/javascript/referencia/operadores/yield/index.html b/files/es/web/javascript/referencia/operadores/yield/index.html
deleted file mode 100644
index 7237b6d689..0000000000
--- a/files/es/web/javascript/referencia/operadores/yield/index.html
+++ /dev/null
@@ -1,130 +0,0 @@
----
-title: yield
-slug: Web/JavaScript/Referencia/Operadores/yield
-tags:
-  - Característica del lenguaje
-  - ECMAScript 2015
-  - Generadores
-  - Iterador
-  - JavaScript
-  - Operador
-translation_of: Web/JavaScript/Reference/Operators/yield
----
-<div>{{jsSidebar("Operadores")}}</div>
-
-<p>La palabra clave <code>yield</code> se usa para pausar y reanudar una función generadora ({{jsxref("Statements/function*", "function*")}} o {{jsxref("Statements/Legacy_generator_function", "función generadora heredada")}}).</p>
-
-<div>{{EmbedInteractiveExample("pages/js/expressions-yield.html", "taller")}}</div>
-
-<div class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">[<var>rv</var>] = <strong>yield</strong> [<var>expression</var>]</pre>
-
-<dl>
- <dt><code><var>expression</var></code> {{optional_inline}}</dt>
- <dd>Define el valor que se devolverá desde la función generadora a través del {{jsxref("Iteration_protocols", "protocolo iterador", "#El_protocolo_iterador")}}. Si se omite, devuelve <code>undefined</code> en su lugar.</dd>
- <dt><code><var>rv</var></code> {{optional_inline}}</dt>
- <dd>
- <p>Recupera el valor opcional pasado al método <code>next()</code> del generador para reanudar su ejecución.</p>
- </dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La palabra clave <code>yield</code> detiene la ejecución de la función del generador y el valor de la expresión que sigue a la palabra clave <code>yield</code> se devuelve al llamador del generador. Se puede considerar como una versión basada en un generador de la palabra clave <code>return</code>.</p>
-
-<p><code>yield</code> solo se puede llamar directamente desde la función generadora que la contiene. No se puede llamar desde funciones anidadas o retrollamadas.</p>
-
-<p>La palabra clave <code>yield</code> hace que la llamada al método <code>next()</code> del generador devuelva un objeto <code>IteratorResult</code> con dos propiedades: <code>value</code> y <code>done</code>. La propiedad <code>value</code> es el resultado de evaluar la expresión <code>yield</code>, y <code>done</code> es <code>false</code>, lo cual indica que la función generadora no se ha completado completamente.</p>
-
-<p>Una vez en pausa en una expresión <code>yield</code>, la ejecución del código del generador permanece en pausa hasta que se llama al método <code>next()</code> del generador. Cada vez que se llama al método <code>next()</code> del generador, el generador reanuda la ejecución y se ejecuta hasta que alcanza uno de los siguientes:</p>
-
-<ul>
- <li>Un <code>yield</code>, el cual hace que el generador vuelva a pausar y devuelva el nuevo valor del generador. La próxima vez que se llame a <code>next()</code>, la ejecución se reanudará con la instrucción inmediatamente después de <code>yield</code>.</li>
- <li>{{jsxref("Statements/throw", "throw")}} se usa para lanzar una excepción desde el generador. Esta detiene la ejecución del generador por completo y la ejecución se reanuda en el llamador (como suele ser el caso cuando se lanza una excepción).</li>
- <li>Se alcanza el final de la función generadora. En este caso, la ejecución del generador finaliza y se devuelve un <code>IteratorResult</code> al llamador en el que el <code>value</code> es {{jsxref("undefined")}} y <code>done</code> es <code>true</code>.</li>
- <li>Se alcanza una instrucción {{jsxref("Statements/return", "return")}}. En este caso, la ejecución del generador finaliza y se devuelve un <code>IteratorResult</code> al llamador en el que el <code>value</code> es el valor especificado por la instrucción <code>return</code> y <code>done</code> es <code>true</code>.</li>
-</ul>
-
-<p>Si se pasa un valor opcional al método <code>next()</code> del generador, ese valor se convierte en el valor devuelto por la operación <code>yield</code> actual del generador.</p>
-
-<p>Entre la ruta del código del generador, sus operadores <code>yield</code> y la capacidad de especificar un nuevo valor inicial pasándolo a {{jsxref("Generator.prototype.next()")}}, los generadores ofrecen enorme poder y control.</p>
-
-<div class="blockIndicator warning">
-<p>Desafortunadamente, <code>next()</code> es asimétrico, pero eso no se puede evitar: siempre envía un valor al <code>yield</code> actualmente suspendido, pero devuelve el operando del siguiente <code>yield</code>.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usar_yield">Usar <code>yield</code></h3>
-
-<p>El siguiente código es la declaración de una función generadora de ejemplo.</p>
-
-<pre class="brush: js notranslate">function* countAppleSales () {
-  let saleList = [3, 7, 5]
-  for (let i = 0; i &lt; saleList.length; i++) {
-    yield saleList[i]
-  }
-}</pre>
-
-<p>Una vez que se define una función generadora, se puede usar construyendo un iterador como el siguiente.</p>
-
-<pre class="brush: js notranslate">let appleStore = countAppleSales()  // Generator { }
-console.log(appleStore.next())      // { value: 3, done: false }
-console.log(appleStore.next())      // { value: 7, done: false }
-console.log(appleStore.next())      // { value: 5, done: false }
-console.log(appleStore.next())      // { value: undefined, done: true }</pre>
-
-<p>También puedes enviar un valor con <code>next(value)</code> al generador. '<code>step</code>' se evalúa como un valor de retorno en esta sintaxis [<var>rv</var>] = <strong>yield</strong> [<var>expression</var>]</p>
-
-<pre class="brush: js notranslate">function* counter(value) {
- let step;
-
- while (true) {
-   step = yield ++value;
-
-   if (step) {
-     value += step;
-   }
- }
-}
-
-const generatorFunc = counter(0);
-console.log(generatorFunc.next().value);   // 1
-console.log(generatorFunc.next().value);   // 2
-console.log(generatorFunc.next().value);   // 3
-console.log(generatorFunc.next(10).value); // 14
-console.log(generatorFunc.next().value);   // 15
-console.log(generatorFunc.next(10).value); // 26</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#prod-YieldExpression', 'Yield')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.operators.yield")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">El protocolo <code>Iterator</code></a></li>
- <li>{{jsxref("Statements/function*", "function*")}}</li>
- <li>{{jsxref("Operators/function*", "function* expression")}}</li>
- <li>{{jsxref("Operators/yield*", "yield*")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/operadores/yield_star_/index.html b/files/es/web/javascript/referencia/operadores/yield_star_/index.html
deleted file mode 100644
index e2167b8c41..0000000000
--- a/files/es/web/javascript/referencia/operadores/yield_star_/index.html
+++ /dev/null
@@ -1,199 +0,0 @@
----
-title: yield*
-slug: Web/JavaScript/Referencia/Operadores/yield*
-tags:
-  - ECMAScript6
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Operators/yield*
----
-<div>{{jsSidebar("Operators")}}</div>
-
-<p><code>La expresión </code><strong><code>yield*</code></strong><strong> </strong>es usada para delegar a otro {{jsxref("Statements/function*", "generator")}} u objeto iterable.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"> yield* [[expression]];</pre>
-
-<dl>
- <dt><code>expression</code></dt>
- <dd>La expresión que retorna un objeto iterable</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La expresión <code>yield*</code> itera sobre el operador realizando yield de cada valor retornado por este.</p>
-
-<p>El valor de la expresion <code>yield*</code> es el valor retornado por el iterador en si mismo cuando es finalizado (ej., cuando <code>done</code> es true).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Delegando_a_otro_generator">Delegando a otro generator</h3>
-
-<p>En el siguiente código, los valores declarados con yield en <code>g1()</code> son devueltos por las llamadas a <code>next() al igual que en</code> <code>g2()</code>.</p>
-
-<pre class="brush: js">function* g1() {
-  yield 2;
-  yield 3;
-  yield 4;
-}
-
-function* g2() {
-  yield 1;
-  yield* g1();
-  yield 5;
-}
-
-var iterator = g2();
-
-console.log(iterator.next()); // { value: 1, done: false }
-console.log(iterator.next()); // { value: 2, done: false }
-console.log(iterator.next()); // { value: 3, done: false }
-console.log(iterator.next()); // { value: 4, done: false }
-console.log(iterator.next()); // { value: 5, done: false }
-console.log(iterator.next()); // { value: undefined, done: true }
-</pre>
-
-<h3 id="Otros_objetos_iterables">Otros objetos iterables</h3>
-
-<p>Además de los objetos generator, <code>yield*</code> también se puede usar <code>yield sobre otros tipos de iterables</code>, ej. arrays, strings u objetos arguments.</p>
-
-<pre class="brush: js">function* g3() {
-  yield* [1, 2];
-  yield* "34";
-  yield* Array.from(arguments);
-}
-
-var iterator = g3(5, 6);
-
-console.log(iterator.next()); // { value: 1, done: false }
-console.log(iterator.next()); // { value: 2, done: false }
-console.log(iterator.next()); // { value: "3", done: false }
-console.log(iterator.next()); // { value: "4", done: false }
-console.log(iterator.next()); // { value: 5, done: false }
-console.log(iterator.next()); // { value: 6, done: false }
-console.log(iterator.next()); // { value: undefined, done: true }
-</pre>
-
-<h3 id="El_valor_de_la_expresión_yield*">El valor de la expresión <code>yield*</code></h3>
-
-<p><code>yield*</code> es una expresión, no una declaración, por lo que se evalua como un valor.</p>
-
-<pre class="brush: js">function* g4() {
-  yield* [1, 2, 3];
-  return "foo";
-}
-
-var result;
-
-function* g5() {
-  result = yield* g4();
-}
-
-var iterator = g5();
-
-console.log(iterator.next()); // { value: 1, done: false }
-console.log(iterator.next()); // { value: 2, done: false }
-console.log(iterator.next()); // { value: 3, done: false }
-console.log(iterator.next()); // { value: undefined, done: true },
-                              // g4() returned { value: "foo", done: true } at this point
-
-console.log(result);          // "foo"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ES6', '#', 'Yield')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inical.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#', 'Yield')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico </td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("27.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("27.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h2>
-
-<ul>
- <li>Iniciando con Gecko 33 {{geckoRelease(33)}}, el análisis del yield expression ha sido actualizado para cumplir con la última especificación ES6 ({{bug(981599)}}):
-  <ul>
-   <li>Ahora está implementada la restricción de salto de línea. No está permitido el salto de línea entre "yield" y "*". Código como el siguiente lanzará una {{jsxref("SyntaxError")}}:
-    <pre class="brush: js">function* foo() {
-  yield
-  *[];
-}</pre>
-   </li>
-  </ul>
- </li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Iteration_protocols">Protocolos de iteración</a></li>
- <li>{{jsxref("Statements/function*", "function*")}}</li>
- <li>{{jsxref("Operators/function*", "function* expression")}}</li>
- <li>{{jsxref("Operators/yield", "yield")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/palabras_reservadas/index.html b/files/es/web/javascript/referencia/palabras_reservadas/index.html
deleted file mode 100644
index 14010f37e3..0000000000
--- a/files/es/web/javascript/referencia/palabras_reservadas/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: Palabras Reservadas
-slug: Web/JavaScript/Referencia/Palabras_Reservadas
-tags:
-  - JavaScript
-  - palabras reservadas
-translation_of: Web/JavaScript/Reference/Lexical_grammar#Keywords
-translation_of_original: Web/JavaScript/Reference/Reserved_Words
----
-<p> </p>
-
-<p>Las siguientes son palabras reservadas y no pueden ser utilizadas como variables, funciones, métodos o identificadores de objetos. Las siguientes son reservadas como palabras claves existentes por la especificación ECMAScript:</p>
-
-<h3 id="Reserved_keywords_as_of_ECMAScript_6">Reserved keywords as of ECMAScript 6</h3>
-
-<div class="threecolumns">
-<ul>
- <li>{{jsxref("Sentencias/break", "break")}}</li>
- <li>{{jsxref("Sentencias/switch", "case")}}</li>
- <li><code>class</code></li>
- <li>{{jsxref("Sentencias/try...catch", "catch")}}</li>
- <li>{{jsxref("Sentencias/const", "const")}}</li>
- <li>{{jsxref("Sentencias/continue", "continue")}}</li>
- <li>{{jsxref("Sentencias/debugger", "debugger")}}</li>
- <li>{{jsxref("Sentencias/switch", "default")}}</li>
- <li>{{jsxref("Operadores/delete", "delete")}}</li>
- <li>{{jsxref("Sentencias/while", "do")}}</li>
- <li>{{jsxref("Sentencias/if...else", "else")}}</li>
- <li>{{jsxref("Sentencias/export", "export")}}</li>
- <li><code>extends</code></li>
- <li>{{jsxref("Sentencias/try...catch", "finally")}}</li>
- <li>{{jsxref("Sentencias/for", "for")}}</li>
- <li>{{jsxref("Sentencias/function", "function")}}</li>
- <li>{{jsxref("Sentencias/if...else", "if")}}</li>
- <li>{{jsxref("Sentencias/import", "import")}}</li>
- <li>{{jsxref("Sentencias/for...in", "in")}}</li>
- <li>{{jsxref("Operadores/instanceof", "instanceof")}}</li>
- <li>{{jsxref("Sentencias/let", "let")}}</li>
- <li>{{jsxref("Operadores/new", "new")}}</li>
- <li>{{jsxref("Sentencias/return", "return")}}</li>
- <li>{{jsxref("Operadores/super", "super")}}</li>
- <li>{{jsxref("Sentencias/switch", "switch")}}</li>
- <li>{{jsxref("Operadores/this", "this")}}</li>
- <li>{{jsxref("Sentencias/throw", "throw")}}</li>
- <li>{{jsxref("Sentencias/try...catch", "try")}}</li>
- <li>{{jsxref("Operadores/typeof", "typeof")}}</li>
- <li>{{jsxref("Sentencias/var", "var")}}</li>
- <li>{{jsxref("Operadores/void", "void")}}</li>
- <li>{{jsxref("Sentencias/while", "while")}}</li>
- <li>{{jsxref("Sentencias/with", "with")}}</li>
- <li><code>yield</code></li>
-</ul>
-</div>
-
-<p>Las siguientes estan reservadas como palabras futuras por la especificación ECMAScript:</p>
-
-<ul>
- <li><code>enum</code></li>
-</ul>
-
-<p>Las siguientes estan reservadas como palabras futuras cuando se encuentre el modo correcto para su estructura de codigo:</p>
-
-<div class="threecolumns">
-<ul>
- <li><code>implements</code></li>
- <li><code>package</code></li>
- <li><code>protected</code></li>
- <li><code>static</code></li>
- <li><code>interface</code></li>
- <li><code>private</code></li>
- <li><code>public</code></li>
-</ul>
-</div>
-
-<h4 id="Futuras_Palabras_Reservadas_en_estandares_antiguos">Futuras Palabras Reservadas en estandares antiguos</h4>
-
-<p>Las siguientes estan reservadas como palabras futuras por la antigua especificación ECMAScript (ECMAScript 1 hasta 3).</p>
-
-<div class="threecolumns">
-<ul>
- <li><code>abstract</code></li>
- <li><code>boolean</code></li>
- <li><code>byte</code></li>
- <li><code>char</code></li>
- <li><code>double</code></li>
- <li><code>final</code></li>
- <li><code>float</code></li>
- <li><code>goto</code></li>
- <li><code>int</code></li>
- <li><code>long</code></li>
- <li><code>native</code></li>
- <li><code>short</code></li>
- <li><code>synchronized</code></li>
- <li><code>transient</code></li>
- <li><code>volatile</code></li>
-</ul>
-</div>
-
-<p>Adicionalmente, los literales "<code>null"</code>, "<code>true"</code>, y "<code>false"</code> estan reservadas en ECMAScript para usos normales.</p>
diff --git a/files/es/web/javascript/referencia/sentencias/block/index.html b/files/es/web/javascript/referencia/sentencias/block/index.html
deleted file mode 100644
index 36b2054d60..0000000000
--- a/files/es/web/javascript/referencia/sentencias/block/index.html
+++ /dev/null
@@ -1,89 +0,0 @@
----
-title: block
-slug: Web/JavaScript/Referencia/Sentencias/block
-tags:
-  - JavaScript
-  - Referencia
-  - Referência(2)
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/block
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Una sentencia block se utiliza para agrupar cero o más sentencias. Este grupo block se delimita por un par de llaves.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="eval">{<em> sentencia_1</em><em>; sentencia_2</em>; ...<em> sentencia_n</em>; }
-</pre>
-
-<dl>
- <dt><code>sentencia_1</code>, <code>sentencia_2</code>, <code>sentencia_n</code></dt>
- <dd>Sentencias agrupadas dentro de una sentencia block.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Esta sentencia se utiliza comúnmente para controlar sentencias de flujo (es decir <code>if</code>, <code>for</code>, <code>while</code>). Por ejemplo:</p>
-
-<pre class="brush: js">while (x &lt; 10) {
-   x++;
-}
-</pre>
-
-<p><font><font>Las variables declaradas con </font></font><code>var</code> <strong><font><font>no</font></font></strong><font><font> tienen alcance de bloque(</font></font>block scope<font><font>)</font></font>. Las variables introducidas dentro de un grupo block tienen el alcance de la función que lo contiene o del script, y los efectos de su asignación persisten más allá del grupo block en sí mismo. En otras palabras, las sentencias block no incluyen ningún alcance. Aunque los grupos block "en solitario" (standalone) son una sintaxis válida, usted no querrá utilizar grupos block en solitario en JavaScript, ya que ellos no hacen lo que parecen, si piensa que funcionan de manera similar a los bloques en C o Java. Por ejemplo:</p>
-
-<pre class="brush: js">var x = 1;
-{
-   var x = 2;
-}
-alert(x); // resultado 2
-</pre>
-
-<p>Este obtiene el resultado 2 ya que la sentencia <code>var x</code> dentro del grupo block tiene el mismo alcance que la sentencia <code>var x</code> antes del mismo. En C o Java, el código equivalente tendría como resultado 1.</p>
-
-<h4 id="Con_let_y_const"><font><font>Con </font></font><code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/let">let</a> </code><font><font>y </font></font><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/const">const</a></h4>
-
-<p>Por el contrario, las variables declaradas con <code>let</code> y <code>const</code> tienen alcance de bloque.</p>
-
-<pre><code>let x = 1;
-{
-  let x = 2;
-}
-console.log(x); // logs 1</code>
-</pre>
-
-<p><font><font>El alcance </font></font><code>x = 2</code><font><font> es limitado solamente al bloque en el que está definido.</font></font></p>
-
-<p><font><font>Lo mismo para  </font></font><code>const</code><font><font>:</font></font></p>
-
-<pre><code>const c = 1;
-{
-  const c = 2;
-}
-console.log(c); // logs 1 </code>y no lanza SyntaxError...
-</pre>
-
-<p>Tenga en cuenta que la variable  <code>const c = 2 con alcance de bloque, </code><strong><em>no</em> lanza</strong> un  <code>SyntaxError: </code>El identificador 'c' ya ha sido declarado. Esto es porque <strong>se puede declarar de forma única</strong> dentro del bloque, sin interferir con la otra que tiene un  alcance global.</p>
-
-<h4 id="Con_function"><font><font>Con </font></font><code>function</code></h4>
-
-<p>La <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function">declaración de una función</a> también tiene un alcance limitado dentro del bloque donde se produce la declaración:</p>
-
-<pre class="brush: js">nacion('frances');  // TypeError: nacion no es una función
-{
-  function nacion(nacionalidad) {
-   console.log('Yo soy ' + nacionalidad);
-  }
-nacion('español'); // correcto. logs Yo soy español
-}</pre>
-
-<p> </p>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/while", "while")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/break/index.html b/files/es/web/javascript/referencia/sentencias/break/index.html
deleted file mode 100644
index aff2a58733..0000000000
--- a/files/es/web/javascript/referencia/sentencias/break/index.html
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: break
-slug: Web/JavaScript/Referencia/Sentencias/break
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/break
----
-<div>
- {{jsSidebar("Statements")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Termina el bucle actual, sentecia switch o label y transfiere el control del programa a la siguiente sentencia a la sentecia de terminación de éstos elementos.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox">break [<em>etiqueta</em>];</pre>
-<dl>
- <dt>
-  <code>etiqueta</code></dt>
- <dd>
-  Identificador asociado con la etiqueta de la sentencia.</dd>
-</dl>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>La sentencia <code>break</code> incluye una etiqueta opcional que permite al programa salir de una sentencia etiquetada. La sentencia <code>break</code> necesita estar anidada dentro de la sentencia etiquetada. La sentencia etiquetada puede ser cualquier tipo de sentencia; no tiene que ser una sentencia de bucle.</p>
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-<h4 id="Ejemplo:_Usando_break" name="Ejemplo:_Usando_break">Ejemplo: Usando <code>break</code></h4>
-<p>La siguiente función tiene una sentencia que termina el bucle {{jsxref("Sentencias/while", "while")}} cuando <code>i</code> es 3, y entonces devuelve el valor 3 * <code>x</code>.</p>
-<pre class="brush: js">function comprobarBreak(x) {
-   var i = 0;
-   while (i &lt; 6) {
-      if (i == 3)
-         break;
-      i++;
-   }
-   return i * x;
-}
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("Sentencias/continue", "continue")}}</li>
- <li>{{jsxref("Sentencias/label", "label")}}</li>
- <li>{{jsxref("Sentencias/switch", "switch")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/class/index.html b/files/es/web/javascript/referencia/sentencias/class/index.html
deleted file mode 100644
index c37b9ba43b..0000000000
--- a/files/es/web/javascript/referencia/sentencias/class/index.html
+++ /dev/null
@@ -1,148 +0,0 @@
----
-title: class
-slug: Web/JavaScript/Referencia/Sentencias/class
-translation_of: Web/JavaScript/Reference/Statements/class
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La<strong> declaración class</strong> crea una nueva clase con el nombre proporcionado utilizando la herencia basada en prototipos</p>
-
-<div class="noinclude">
-<p>También se puede definir una clase usando una {{jsxref("Operators/class", "expresión de clase", "", 1)}}. Pero a diferencia de las expresiones de clases, la declaración de clases no permite que una clase existente sea declarada de nuevo y en caso de hacerse, lanzará un error de tipo.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: js">class <em>name</em> [extends] {
-  // Contenido de la clase
-}
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>De la misma manera que con las expresiones de clase, el contenido de una clase se ejecuta en <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode">modo estricto</a>.</p>
-
-<p>Las declaraciones de clases no están {{Glossary("Hoisting", "izadas")}} (al contrario que las <a href="/en-US/docs/Web/JavaScript/Reference/Statements/function">declaraciones de funciones</a>).</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Declaración_sencilla_de_una_clase">Declaración sencilla de una clase</h3>
-
-<p>En el siguiente ejemplo, primero definimos la clase <code>Polygon</code>, luego extendemos de ella para crear la clase <code>Square</code>. Notar que <code>super()</code>, utilizado en el constructor, sólo puede ser llamado dentro del constructor y debe ser llamado antes de que la palabra clave <code>this</code> pueda ser usada.</p>
-
-<pre class="brush: js">class Polygon {
-  constructor(height, width) {
-    this.name = 'Polygon';
-    this.height = height;
-    this.width = width;
-  }
-}
-
-class Square extends Polygon {
-  constructor(length) {
-    super(length, length);
-    this.name = 'Square';
-  }
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-class-definitions', 'Class definitions')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-class-definitions', 'Class definitions')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>{{CompatGeckoDesktop(45)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Array subclassing</td>
-   <td>{{CompatChrome(43.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Android Webview</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome para Android</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(42.0)}}</td>
-   <td>{{CompatGeckoMobile(45)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(42.0)}}</td>
-  </tr>
-  <tr>
-   <td>Array subclassing</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(43.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(43.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/function"><code>declaración de funciones</code></a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Operators/class"><code>expresión de clases</code></a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Classes">Clases</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/const/index.html b/files/es/web/javascript/referencia/sentencias/const/index.html
deleted file mode 100644
index c55350fbd4..0000000000
--- a/files/es/web/javascript/referencia/sentencias/const/index.html
+++ /dev/null
@@ -1,127 +0,0 @@
----
-title: const
-slug: Web/JavaScript/Referencia/Sentencias/const
-tags:
-  - ECMAScript6
-  - Experimental
-  - Expérimental(2)
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/const
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<h2 id="Resumen">Resumen</h2>
-
-<p>Las variables constantes presentan un <strong>ámbito de bloque </strong><font><font>(</font></font><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/block">block </a>scope<font><font>)</font></font> tal y como lo hacen las variables definidas usando la instrucción <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/let">let</a>, con la particularidad de que el valor de una constante no puede cambiarse a través de la reasignación. Las constantes <u>no se pueden redeclarar</u>.</p>
-
-<div class="warning">
-<p>La <strong>redeclaración</strong> de la misma variable bajo un mismo <font><font><a href="https://www.ecma-international.org/ecma-262/6.0/#sec-lexical-environments" rel="noopener">ámbito léxico</a></font></font> terminaría en un error de tipo <code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError" title="SyntaxError">SyntaxError</a></code>. Esto también es <strong>extensible</strong> si usamos <code>var</code> dentro del <font><font>ámbito léxico</font></font>. Esto nos salvaguarda de redeclarar una variable accidentalmente y que no era posible  solo con <code>var.</code></p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">const <em>varname1 = <em>value1 [</em>, <em>varname2</em> = <em>value2 [</em>, <em>varname3</em> = <em>value3 [</em>, ... [</em>, <em>varnameN</em> = <em>valueN]]]]</em>;</pre>
-
-<dl>
- <dt><code>varnameN</code></dt>
- <dd>Nombre de la constante. Puede ser un identificador legal.</dd>
-</dl>
-
-<dl>
- <dt><code>valueN</code></dt>
- <dd>Valor de la constante. Puede ser cualquier expresión legal.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Esta declaración crea una constante cuyo alcance puede ser <strong>global o local para el bloque en el que se declara</strong>. Es necesario <strong>inicializar</strong> la constante, es decir, se debe especificar su valor en la misma sentencia en la que se declara, lo que tiene sentido, dado que no se puede cambiar posteriormente.</p>
-
-<p>La declaración de una constante crea una referencia de sólo lectura. No significa que el valor que tiene sea inmutable, sino que el identificador de variable no puede ser reasignado, por lo tanto, en el caso de que la asignación a la constante sea un objeto, el objeto sí que puede ser alterado.</p>
-
-<p>Una constante <strong>no puede compartir su nombre</strong> con una función o variable en el mismo ámbito.</p>
-
-<p><font><font>Todas las consideraciones acerca de la " <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/let#muerta">zona muerta temporal</a> " se aplican tanto a </font></font><code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let">let</a></code><font><font>y</font></font><code>const</code><font><font>.</font></font></p>
-
-<div class="warning">
-<p><code>const</code> <s>es </s><u>fue</u> una <strong>extensión especifica de Mozilla</strong>, no <s>es</s> <u>era</u> soportado en IE, pero <s>tiene</s> <u>tenia</u> soporte parcial por Opera desde la versión 9.0 y por Safari.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente ejemplo produce una salida <code>"a es 7."</code></p>
-
-<pre class="brush: js">const a = 7;
-document.writeln("a es " + a + ".");
-</pre>
-
-<p>Las siguientes instrucciones demuestra como se comporta <code>const</code></p>
-
-<div class="warning">
-<p>Las instrucciones deberán ser ordenadas correctamente para conseguir la salida esperada a los ejemplos</p>
-</div>
-
-<pre class="brush: js">// NOTA: Las constantes pueden ser declaradas en mayusculas o minusculaas,
-//pero por convencion para distinguirlas del resto de variables se escribe todo en mayusculas
-
-// definimos MY_FAV como constante y le damos un valor de 7
-const MY_FAV = 7;
-
-// lanzara un error: Unkeught TypeError: Asignación a variable constante.
-MY_FAV = 20;
-
-// imprimira 7
-console.log('my favorite number is: ' + MY_FAV);
-
-// lanzara un error: SyntaxError: tratando de redeclarar una constante. El identificador 'MY_FAV' ya ha sido declarado
-const MY_FAV = 20;
-
-// el nombre MY_FAV esta reservado para la constante anterior, también fallara y lanzara un SyntaxError por la redeclaración
-var MY_FAV = 20;
-
-// el nombre MY_FAV esta reservado para la variable anterior, esto también lanzara un SyntaxError por la redeclaración
-let MY_FAV = 20;
-
-// es importante tener en cuenta como funciona el alcance de bloque
-if (MY_FAV === 7) {
-    // esto esta bien y crea una variable MY_FAV de alcance/ambito de bloque
-    // (funciona igual de bien con let para declarar un alcance de bloque/ambito de variable no-constante)
-    const MY_FAV = 20;
-
-    // MY_FAV ahora es 20
-    console.log('my favorite number is ' + MY_FAV);
-
-    // aquín también lanzara un SyntaxError por la redeclaración
-    var MY_FAV = 20;
-}
-
-// MY_FAV todavia es 7
-console.log('my favorite number is ' + MY_FAV);
-
-// lanza error, falta el inicializador en la declaracion de const
-const FOO;
-
-// const tambien funciona en objetos
-const MY_OBJECT = {'key': 'value'};
-
-// Intentando sobrescribir el objeto nos lanza un error
-MY_OBJECT = {'OTHER_KEY': 'value'};
-
-// Sin embargo, los object keys no estan protegidas,
-// por lo que la siguiente sentencia se ejecutara sin problema
-MY_OBJECT.key = 'otherValue'; // Use Object.freeze() para hacer un objeto inmutable
-
-// Lo mismo se aplica a los arrays
-const MY_ARRAY = [];
-// es posible empujar elementos en el array
-MY_ARRAY.push('A'); // ["A"]
-// Sin embargo, asignar un nuevo array a la variable lanza error
-MY_ARRAY = ['B']</pre>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/var", "var")}}</li>
- <li>{{jsxref("Sentencias/let", "let")}}</li>
- <li><a href="/en/JavaScript/Guide/Values,_Variables,_and_Literals#Constants" title="en/JavaScript/Guide/Values, Variables, and Literals#Constants">Constants in JavaScript Guide</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/continue/index.html b/files/es/web/javascript/referencia/sentencias/continue/index.html
deleted file mode 100644
index 5371b4cdd7..0000000000
--- a/files/es/web/javascript/referencia/sentencias/continue/index.html
+++ /dev/null
@@ -1,66 +0,0 @@
----
-title: continue
-slug: Web/JavaScript/Referencia/Sentencias/continue
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/continue
----
-<div>
- {{jsSidebar("Statements")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Termina la ejecución de las sentencias de la iteración actual del bucle actual o la etiqueta y continua la ejecución del bucle con la próxima iteración.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox">continue [ <em>etiqueta</em> ];</pre>
-<dl>
- <dt>
-  <code>label</code></dt>
- <dd>
-  Identificador asociado con la etiqueta de la sentencia.</dd>
-</dl>
-<h3 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h3>
-<p>En contraste con la sentencia {{jsxref("Sentencias/break", "break")}}, <code>continue</code> no termina la ejecución del bucle por completo; en cambio,</p>
-<ul>
- <li>En un bucle {{jsxref("Sentencias/while", "while")}}, salta de regreso a la condición.</li>
-</ul>
-<ul>
- <li>En un bucle {{jsxref("Sentencias/for", "for")}}, salta a la expresión actualizada.</li>
-</ul>
-<p>La sentencia <code>continue</code> puede incluir una etiqueta opcional que permite al programa saltar a la siguiente iteración del bucle etiquetado en vez del bucle actual. En este caso, la sentencia <code>continue</code> necesita estar anidada dentro de esta sentecia etiquetada.</p>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<h3 id="Ejemplo:_Usando_continue_con_while" name="Ejemplo:_Usando_continue_con_while">Ejemplo: Usando <code>continue</code> con <code>while</code></h3>
-<p>El siguiente ejemplo muestra un bucle {{jsxref("Sentencias/while", "while")}} que tiene una sentencia <code>continue</code> que se ejecuta cuando el valor de <code>i</code> es 3. Así, <code>n</code> toma los valores 1, 3, 7 y 12.</p>
-<pre class="brush: js">i = 0;
-n = 0;
-while (i &lt; 5) {
-   i++;
-   if (i == 3)
-      continue;
-   n += i;
-}
-</pre>
-<h3 id="Ejemplo:_Usando_continue_con_una_etiqueta" name="Ejemplo:_Usando_continue_con_una_etiqueta">Ejemplo: Usando <code>continue</code> con una etiqueta</h3>
-<p>En el siguiente ejemplo, una sentencia etiquetada <code>checkiandj</code> contiene una sentencia etiquetada <code>checkj</code>. Si se encuentra <code>continue</code>, el programa continua hasta encima de la sentencia <code>checkj</code>. Cada vez que se encuentra <code>continue</code>, <code>checkj</code> se reitera hasta que su condición devuelve false. Cuando se devuelve false, el recordatorio de la sentencia <code>checkiandj</code> se completa.</p>
-<p>Si <code>continue</code> tuviese una etiqueta <code>checkiandj</code>, el programa continuaría hasta encima de la sentencia <code>checkiandj</code>.</p>
-<pre>checkiandj:
-while (i &lt; 4) {
-   document.write(i + "&lt;br&gt;");
-   i += 1;
-
-   checkj:
-   while (j &gt; 4) {
-      document.write(j + "&lt;br&gt;");
-      j -= 1;
-      if ((j % 2) == 0)
-         continue checkj;
-      document.write(j + " is odd.&lt;br&gt;");
-   }
-   document.write("i = " + i + "&lt;br&gt;");
-   document.write("j = " + j + "&lt;br&gt;");
-}
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("Sentencias/break", "break")}}</li>
- <li>{{jsxref("Sentencias/label", "label")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/debugger/index.html b/files/es/web/javascript/referencia/sentencias/debugger/index.html
deleted file mode 100644
index bb36e356c0..0000000000
--- a/files/es/web/javascript/referencia/sentencias/debugger/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: debugger
-slug: Web/JavaScript/Referencia/Sentencias/debugger
-tags:
-  - JavaScript
-  - Sentencia
-translation_of: Web/JavaScript/Reference/Statements/debugger
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La sentencia <strong>debugger</strong> invoca cualquier funcionalidad de depuración disponible, tiene la misma función que un breakpoint. Si la funcionalidad de depuración no está disponible, esta sentencia no tiene efecto alguno.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox"><code>debugger;</code></pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente ejemplo muestra un bloque de código donde ha sido insertada una sentencia debugger, para invocar el depurador (si existe) cuando la función es ejecutada.</p>
-
-<pre class="brush:js">function codigoPotencialmenteDefectuoso() {
-    debugger;
-    // realizar paso a paso o examinar código que contiene
-    // potenciales errores
-}</pre>
-
-<p>Cuando el depurador es invocado, la ejecución se detiene en la sentencia debugger. Es como un punto de interrupción en el script.</p>
-
-<p><a href="https://mdn.mozillademos.org/files/6963/Screen Shot 2014-02-07 at 9.14.35 AM.png"><img alt="Paused at a debugger statement." src="https://mdn.mozillademos.org/files/6963/Screen%20Shot%202014-02-07%20at%209.14.35%20AM.png" style="height: 371px; width: 700px;"></a></p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-debugger-statement', 'Debugger statement')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-debugger-statement', 'Debugger statement')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-12.15', 'Debugger statement')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3', '#sec-7.5.3', 'Debugger statement')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-7.4.3', 'Debugger statement')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Solo mencionada como palabra reservada</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Debugging_JavaScript">Debugging JavaScript</a></li>
- <li><a href="/en-US/docs/Tools/Debugger">The Debugger in the Firefox Developer Tools</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/default/index.html b/files/es/web/javascript/referencia/sentencias/default/index.html
deleted file mode 100644
index a25a5a5369..0000000000
--- a/files/es/web/javascript/referencia/sentencias/default/index.html
+++ /dev/null
@@ -1,121 +0,0 @@
----
-title: default
-slug: Web/JavaScript/Referencia/Sentencias/default
-tags:
-  - JavaScript
-  - Palabra clave
-translation_of: Web/JavaScript/Reference/Statements/switch
-translation_of_original: Web/JavaScript/Reference/Statements/default
----
-<div>{{jsSidebar("Sentencias")}}</div>
-
-<p>La palabra clave<strong> default, </strong>en JavaScript puede ser usada en dos situaciones: dentro una sentencia {{jsxref("Sentencias/switch", "switch")}}, o con un sentencia{{jsxref("Sentencias/export", "export")}}.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/statement-default.html")}}</div>
-
-<p class="hidden">El codigo fuente para este ejemplo interactivo esta almacenado en un repositorio de GitHub. Si quieres contribuir al proyecto de ejemplos interactivos, clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y mandenos un pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<p>Dentro de una sentencia {{jsxref("Sentencias/switch", "switch")}}:</p>
-
-<pre class="syntaxbox">switch (expresion) {
-  case valor1:
-    //Declaración ejecutada cuando el resultado de la expresion conincida con valor1
-    [break;]
-  default:
-    //Declaración ejecutada cuando ninguno de los valores conincida con algun valor de la expresion
-    [break;]
-}</pre>
-
-<p>Con una sentencia {{jsxref("Sentencias/export", "export")}}:</p>
-
-<pre class="syntaxbox">export default <em>nameN</em> </pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Para mas detalles vea las paginas:</p>
-
-<ul>
- <li>Sentencia {{jsxref("Sentencias/switch", "switch")}} y</li>
- <li>Sentencia {{jsxref("Sentencias/export", "export")}}.</li>
-</ul>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_default_en_una_sentencia_switch">Usando <code>default</code> en una sentencia <code>switch</code></h3>
-
-<p>En el siguiente ejemplo, si se evalua <code>expr</code>  como "Naranjas" o "Manzanas", el programa coincide los valores en cada caso: "Naranjas" o "Manzanas", y ejecuta la declaración correspondiente. La palabra clave <code>default</code> ayudara en algun otro caso y ejecuta la declaración asociada.</p>
-
-<pre class="brush: js">switch (expr) {
-  case 'Naranjas':
-    console.log('Las Naranjas cuestan $0.59 el kilogramo.');
-    break;
-  case 'Manzanas':
-    console.log('Las Manzanas cuestan $0.32 el kilogramo.');
-    break;
-  default:
-    console.log('Lo esntimos, no tenemos ' + expr + '.');
-}</pre>
-
-<h3 id="Usando_default_con_export">Usando <code>default</code> con <code>export</code></h3>
-
-<p>Si queres exportar un solo valor o necesitas reservar un valor para un modulo, puedes usar una exportación por defecto:</p>
-
-<pre class="brush: js">// modulo "mi-modulo.js"
-let cube = function cube(x) {
-  return x * x * x;
-};
-export default cube;</pre>
-
-<p>Entonces, en otro script, sera sencillo de importar el valor del modulo:</p>
-
-<pre class="brush: js">// modulo "otro-modulo.js"
-import cubeArea from 'mi-modulo';  //default export nos da la libertad de decir import cubeArea, en lugar de import cube from 'my-module'
-console.log(cubeArea(3)); // 27
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-switch-statement', 'switch statement')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-exports', 'Exports')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-switch-statement', 'switch statement')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-exports', 'Exports')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div class="hidden">La tabla de compatibilidad en esta pagina es generada desde datos estruturados. si quieres contribuir con los datos, revisa <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envianos un pull request.</div>
-
-<p>{{Compat("javascript.statements.default")}}</p>
-
-<h2 id="Vea_tambien">Vea tambien</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/export", "export")}}</li>
- <li>{{jsxref("Sentencias/switch", "switch")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/do...while/index.html b/files/es/web/javascript/referencia/sentencias/do...while/index.html
deleted file mode 100644
index 628c1458cd..0000000000
--- a/files/es/web/javascript/referencia/sentencias/do...while/index.html
+++ /dev/null
@@ -1,49 +0,0 @@
----
-title: do...while
-slug: Web/JavaScript/Referencia/Sentencias/do...while
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/do...while
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La sentencia (hacer mientras) crea un bucle que ejecuta una sentencia especificada, hasta que la condición de comprobación se evalúa como falsa. La condición se evalúa después de ejecutar la sentencia, dando como resultado que la sentencia especificada se ejecute al menos una vez.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/statement-dowhile.html")}}</div>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">do
-   <em>sentencia</em>
-while (<em>condición</em>);
-</pre>
-
-<dl>
- <dt><code>sentencia</code></dt>
- <dd>Una sentencia que se ejecuta al menos una vez y es reejecutada cada vez que la condición se evalúa a verdadera. Para ejecutar múltiples sentencias dentro de un bucle, utilice la sentencia {{jsxref("Statements/block", "block")}} (<code>{ ... }</code>) para agrupar aquellas sentencias.</dd>
-</dl>
-
-<dl>
- <dt><code>condición</code></dt>
- <dd>Una expresión se evalúa después de cada pase del bucle. Si <code>condición</code> se evalúa como verdadera, la <code>sentencia</code> se re-ejecuta. Cuando <code>condición</code> se evalúa como falsa, el control pasa a la siguiente sentencia hacer mientras.</dd>
-</dl>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_Usando_do...while" name="Ejemplo:_Usando_do...while">Usando <code>hacer mientras</code></h3>
-
-<p>En el siguiente ejemplo, el bucle hacer mientras itera al menos una vez y se reitera hasta que <code>i</code> ya no sea menor que 5.</p>
-
-<pre class="brush: js">do {
-   i += 1;
-   document.write(i);
-} while (i &lt; 5);
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/while", "while")}}</li>
- <li>{{jsxref("Sentencias/for", "for")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/empty/index.html b/files/es/web/javascript/referencia/sentencias/empty/index.html
deleted file mode 100644
index 627fd889c7..0000000000
--- a/files/es/web/javascript/referencia/sentencias/empty/index.html
+++ /dev/null
@@ -1,141 +0,0 @@
----
-title: empty
-slug: Web/JavaScript/Referencia/Sentencias/Empty
-tags:
-  - JavaScript
-  - Sentencia
-  - Vacía
-translation_of: Web/JavaScript/Reference/Statements/Empty
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>Un <strong>empty statement</strong> o sentencia vacía es usada para no proveer una sentencia, incluso si la sintaxis JavaScript esperase una.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">;
-</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La sentencia vacía es un punto y coma (;) que indica que no se ejecutará ninguna sentencia, incluso si la sintaxis JavaScript requiere una. El comportamiento opuesto, donde se desean ejecutar varias sentencias pero JavaScript solo permite una sola, es posible usando una <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/block">sentencia de bloque</a>; la cual combina varias declaraciones en una.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>La sentencia vacía es comúnmente usada en bucles. Por ejemplo, un bucle for sin bloque de sentencias:</p>
-
-<pre class="brush: js">var arr = [1, 2, 3];
-
-// Asignar el valor 0 a todos los elementos del array
-for (i = 0; i &lt; arr.length; arr[i++] = 0) /* sentencia vacía */ ;
-
-console.log(arr);
-// [0, 0, 0]
-</pre>
-
-<p><strong>Nota:</strong> Es una buena práctica comentar el uso intencional de la sentencia vacía, ya que no es fácilmente distinguible de un punto y coma normal. Un ejemplo de uso probablemente no intencional:</p>
-
-<pre class="brush: js">if (condicion);  // Esta condición no ejerce ningún control!
-   borrarTodo()  // Por lo cual esta sentencia será ejecutada siempre!!!
-</pre>
-
-<p>Otro ejemplo de uso:</p>
-
-<pre class="brush: js">var a = 1, b = 1;
-if((a == 0) || (b = 0)); // Asigna a '<code>b'</code> el valor cero si '<code>a'</code> no es cero.
-console.log(b); // 0</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-empty-statement', 'Empty statement')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-empty-statement', 'Empty statement')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-12.3', 'Empty statement')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3', '#sec-12.3', 'Empty statement')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-12.3', 'Empty statement')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/block", "Sentencia de bloque")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/export/index.html b/files/es/web/javascript/referencia/sentencias/export/index.html
deleted file mode 100644
index 6016afd0ba..0000000000
--- a/files/es/web/javascript/referencia/sentencias/export/index.html
+++ /dev/null
@@ -1,175 +0,0 @@
----
-title: export
-slug: Web/JavaScript/Referencia/Sentencias/export
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Módulos
-  - Sentencia
-  - export
-translation_of: Web/JavaScript/Reference/Statements/export
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La declaración <strong><code>export</code></strong> se utiliza al crear módulos de JavaScript para exportar funciones, objetos o tipos de dato primitivos del módulo para que puedan ser utilizados por otros programas con la sentencia {{jsxref("Statements/import", "import")}}.</p>
-
-<p>Los módulos exportados están en {{jsxref("Strict_mode","strict mode")}} tanto si se declaran así como si no. La sentencia export no puede ser utilizada en scripts embebidos.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="brush: js">export { <var>name1</var>, <var>name2</var>, …, <var>nameN</var> };
-export { <var>variable1</var> as <var>name1</var>, <var>variable2</var> as <var>name2</var>, …, <var>nameN</var> };
-export let <var>name1</var>, <var>name2</var>, …, <var>nameN</var>; // también var
-export let <var>name1</var> = …, <var>name2</var> = …, …, <var>nameN</var>; // también var, const
-export function FunctionName(){...}
-export class ClassName {...}
-
-export default <em>expression</em>;
-export default function (…) { … } // también class, function*
-export default function name1(…) { … } // también class, function*
-export { <var>name1</var> as default, … };
-
-export * from …;
-export { <var>name1</var>, <var>name2</var>, …, <var>nameN</var> } from …;
-export { <var>import1</var> as <var>name1</var>, <var>import2</var> as <var>name2</var>, …, <var>nameN</var> } from …;
-export { default } from …;
-</pre>
-
-<dl>
- <dt><code>nameN</code></dt>
- <dd>Identificador a ser exportado (es posible importarlo a través de {{jsxref("Statements/import", "import")}} en otro script).</dd>
-</dl>
-
-<h2 id="Descripción" name="Descripción">Descripción</h2>
-
-<p>Existen dos tipos diferentes de exportación , <strong>nombrada</strong> y <strong>por defecto</strong>. Se pueden tener varias exportaciones nombradas por módulo pero sólo una exportación por defecto. Cada tipo corresponde a una de las sintaxis siguientes:</p>
-
-<ul>
- <li>Exports con nombre:
-  <pre class="brush: js">// exporta la función previamente declarada
-export { myFunction };
-
-// exporta una constante
-export const foo = Math.sqrt(2);</pre>
- </li>
- <li>Exports por defecto (function):
-  <pre class="brush: js">export default function() {} </pre>
- </li>
- <li>Exports por defecto (class):
-  <pre class="brush: js">export default class {} </pre>
- </li>
-</ul>
-
-<p>Los export con nombre son útiles cuando se necesitan exportar múltiples valores. Durante el import, es obligatorio usar el mismo nombre que el correspondiente objeto.</p>
-
-<p>Pero un export por defecto puede ser importado con cualquier nombre, por ejemplo:</p>
-
-<pre class="brush: js">export default k = 12; // en el archivo test.js
-
-import m from './test' // notese que tenemos la libertad de usar import m en lugar de import k, porque k era el export por defecto
-
-console.log(m); // escribirá 12</pre>
-
-<p>Sólo puede haber un export por defecto.</p>
-
-<p>La siguiente sintaxis no exporta un export por defecto del módulo importado:</p>
-
-<pre class="brush: js">export * from …;</pre>
-
-<p>Si necesita exportar por defecto, escriba lo siguiente en su lugar:</p>
-
-<pre class="brush: js">import mod from 'mod';
-export default mod;</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Syntax" name="Syntax">Usando exports con nombre</h3>
-
-<p>En el módulo, podremos usar el siguiente código:</p>
-
-<pre class="brush: js">// module "my-module.js"
-function cube(x) {
-  return x * x * x;
-}
-const foo = Math.PI + Math.SQRT2;
-var graph = {
-    options:{
-        color:'white',
-        thickness:'2px'
-    },
-    draw: function(){
-        console.log('From graph draw function');
-    }
-}
-export { cube, foo, graph };</pre>
-
-<p>De esta forma, en otro script, podemos tener:</p>
-
-<pre class="brush: js">//You should use this script in html with the type module ,
-//eg ''&lt;script type="module" src="demo.js"&gt;&lt;/script&gt;",
-//open the page in a httpserver,otherwise there will be a CORS policy error.
-//script demo.js
-
-import { cube, foo, graph } from 'my-module';
-graph.options = {
-    color:'blue',
-    thickness:'3px'
-};
-graph.draw();
-console.log(cube(3)); // 27
-console.log(foo);    // 4.555806215962888
-</pre>
-
-<h3 id="Usando_el_export_por_defecto">Usando el export por defecto</h3>
-
-<p>Si queremos exportar un sólo valor o tener uno por defecto para nuestro módulo, podemos usar un export por defecto:</p>
-
-<pre class="brush: js">// module "my-module.js"
-export default function cube(x) {
-  return x * x * x;
-}
-</pre>
-
-<p>De esta forma la importación de un export default será sumamemte sencilla:</p>
-
-<pre class="brush: js">import cube from 'my-module';
-console.log(cube(3)); // 27</pre>
-
-<p>Tenga en cuenta que no es posible usar <code>var</code>, <code>let</code> o <code>const</code> con <code>export default</code>.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-exports', 'Exports')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-exports', 'Exports')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatiblidad_en_navegadores">Compatiblidad en navegadores</h2>
-
-<p>{{Compat("javascript.statements.export")}}</p>
-
-<h2 id="Vea también" name="Vea también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/import", "import")}}</li>
- <li><a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a>, publicación del blog de Hacks por Jason Orendorff</li>
- <li><a href="https://hacks.mozilla.org/2018/03/es-modules-a-cartoon-deep-dive/">ES modules: A cartoon deep-dive</a>, publicación del blog de Hacks por Lin Clark</li>
- <li><a href="http://exploringjs.com/es6/ch_modules.html">Libro de Axel Rauschmayer: "Exploring JS: Modules"</a></li>
-</ul>
-
-<p> </p>
diff --git a/files/es/web/javascript/referencia/sentencias/for-await...of/index.html b/files/es/web/javascript/referencia/sentencias/for-await...of/index.html
deleted file mode 100644
index 49349d7199..0000000000
--- a/files/es/web/javascript/referencia/sentencias/for-await...of/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: for await...of
-slug: Web/JavaScript/Referencia/Sentencias/for-await...of
-tags:
-  - Iteración
-  - JavaScript
-  - Referencia
-  - Sentencia
-  - asincrónico
-  - await
-  - iterar
-translation_of: Web/JavaScript/Reference/Statements/for-await...of
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La <strong>sentencia</strong> <strong><code>for await...of</code> </strong>crea un bucle iterando tanto sobre objetos iterables asincrónicos como sincrónicos, incluyendo: built-in {{jsxref("String")}}, {{jsxref("Array")}}, objetos <code>Array</code>-like (por ej., {{jsxref("Functions/arguments", "arguments")}} o {{domxref("NodeList")}}), {{jsxref("TypedArray")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, y async/sync iterables definidos por el usuario. Invoca un hook de iteración personalizada con sentencias a ser ejecutadas por el valor de cada propiedad diferente del objeto.</p>
-
-<p class="hidden">El código fuente de este ejemplo interactivo está almacenado en un repositorio Github. Si te gustaría contribuir al proyecto de ejemplos interactivos, por favor clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos un pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">for await (<em>variable</em> of <em>iterable</em>) {
-  <em>sentencia
-</em>}
-</pre>
-
-<dl>
- <dt><code>variable</code></dt>
- <dd>En cada iteración, el valor de una propiedad diferente es asignado a <em>variable</em>. <em>variable</em> puede ser declarada con <code>const</code>, <code>let</code>, o <code>var</code>.</dd>
- <dt><code>iterable</code></dt>
- <dd>Objeto sobre cuyas propiedades se itera.</dd>
-</dl>
-
-<h3 id="Iterando_sobre_iterables_asincrónicos">Iterando sobre iterables asincrónicos</h3>
-
-<p>También puedes iterar sobre un objeto que explícitamente implementa el protocolo async iterable:</p>
-
-<pre class="brush:js">var asyncIterable = {
-  [Symbol.asyncIterator]() {
-    return {
-      i: 0,
-      next() {
-        if (this.i &lt; 3) {
-          return Promise.resolve({ value: this.i++, done: false });
-        }
-
-        return Promise.resolve({ done: true });
-      }
-    };
-  }
-};
-
-(async function() {
-   for await (let num of asyncIterable) {
-     console.log(num);
-   }
-})();
-
-// 0
-// 1
-// 2
-</pre>
-
-<h3 id="Iterando_sobre_funciones_generadoras_asincrónicas">Iterando sobre funciones generadoras asincrónicas</h3>
-
-<p>Debido a que las funciones generadoras asincrónicas implementan el protocolo async iterator, las mismas pueden ser iteradas utilizando <code>for await... of</code></p>
-
-<pre class="brush: js">async function* asyncGenerator() {
-  var i = 0;
-  while (i &lt; 3) {
-    yield i++;
-  }
-}
-
-(async function() {
-  for await (let num of asyncGenerator()) {
-    console.log(num);
-  }
-})();
-// 0
-// 1
-// 2</pre>
-
-<p>Para un ejemplo más concreto de iteración sobre una función generadora utilizando <code>for await... of</code>, considera iterar sobre datos provistos por una API. Este ejemplo primero crea un iterador asincrónico para un stream de datos, luego lo utiliza para obtener el tamaño de la respuesta desde la API.</p>
-
-<pre class="brush: js">async function* streamAsyncIterator(stream) {
-  const reader = stream.getReader();
-  try {
-    while (true) {
-      const { done, value } = await reader.read();
-      if (done) {
-        return;
-      }
-      yield value;
-    }
-  } finally {
-    reader.releaseLock();
-  }
-}
-// Obtiene datos desde url y calcula el tamaño de la respuesta utilizando la función generadora asincrónica.
-async function getResponseSize(url) {
-  const response = await fetch(url);
-  // Almacenará el tamaño de la respuesta en bytes.
-  let responseSize = 0;
-  // El buble for-await-of. Itera asincrónicamente sobre cada parte de la respuesta.
-  for await (const chunk of streamAsyncIterator(response.body)) {
-    // Incrementando el tamaño total.
-    responseSize += chunk.length;
-  }
-
-  console.log(`Tamaño de la respuesta: ${responseSize} bytes`);
-  // salida esperada: "Tamaño de la respuesta: 1071472"
-  return responseSize;
-}
-getResponseSize('https://jsonplaceholder.typicode.com/photos');</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'ECMAScript Language: The for-in, for-of, and for-await-of Statements')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_Navegadores">Compatibilidad de Navegadores</h2>
-
-<div class="hidden">La tabla de compatiblidad de esta página es generada a partir de datos estructurados. Si te gustaría contribuir a estos datos, por favor clona <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos un pull request.</div>
-
-<p>{{Compat("javascript.statements.for_await_of")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Statements/for...of")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/for...in/index.html b/files/es/web/javascript/referencia/sentencias/for...in/index.html
deleted file mode 100644
index 0680d69dea..0000000000
--- a/files/es/web/javascript/referencia/sentencias/for...in/index.html
+++ /dev/null
@@ -1,150 +0,0 @@
----
-title: for...in
-slug: Web/JavaScript/Referencia/Sentencias/for...in
-tags:
-  - Característica del lenguaje
-  - Declaración
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Statements/for...in
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La instrucción {{JSxRef("Sentencias/for...in", "for-in")}} itera sobre todas las {{JSxRef("../Enumerability_and_ownership_of_properties", "propiedades enumerables")}} de un objeto que está codificado por cadenas (ignorando los codificados por {{JSxRef("Objetos_globales/Symbol", "Símbolos")}}, incluidas las propiedades enumerables heredadas.</p>
-
-<div>{{EmbedInteractiveExample("pages/js/statement-forin.html")}}</div>
-
-<p class="hidden">La fuente de este ejemplo interactivo se almacena en un repositorio de GitHub. Si deseas contribuir al proyecto de ejemplos interactivos, clona <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> y envíanos una solicitud de extracción.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">for (<var>variable</var> in <var>objeto</var>)
-  instrucción</pre>
-
-<dl>
- <dt><code>variable</code></dt>
- <dd>Asigna un nombre de propiedad diferente a la <em>variable</em> en cada iteración.</dd>
- <dt><code>objeto</code></dt>
- <dd>Objeto cuyas propiedades enumerables que no son símbolos se iteran.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Un bucle <code>for...in</code> solo itera sobre propiedades enumerables que no son símbolo. Los objetos creados a partir de constructores integrados como <code>Array</code> y <code>Object</code> han heredado propiedades no enumerables de <code>Object.prototype</code> y <code>String.prototype</code>, como el método {{JSxRef("String.indexOf", "indexOf()")}} de {{JSxRef("String")}} o el método {{JSxRef("Object.toString", "toString()")}} de {{JSxRef("Object")}}. El bucle iterará sobre todas las propiedades enumerables del objeto en sí y aquellas que el objeto hereda de su cadena de prototipos (las propiedades de los prototipos más cercanos tienen prioridad sobre las de los prototipos más alejados del objeto en su cadena de prototipos).</p>
-
-<h3 id="Propiedades_deleted_added_o_modified">Propiedades <code>deleted</code>, <code>added</code> o <code>modified</code></h3>
-
-<p>Un bucle <code>for...in</code> itera sobre las propiedades de un objeto en un orden arbitrario (consulta el operador {{JSxRef("Operadores/delete", "delete")}} para obtener más información sobre por qué no puede depender del aparente orden de la iteración, al menos en una configuración entre navegadores).</p>
-
-<p>Si una propiedad se modifica en una iteración y luego se visita en un momento posterior, su valor en el bucle es su valor en ese momento posterior. Una propiedad que se elimina antes de haber sido visitada no se visitará más tarde. Las propiedades agregadas al objeto sobre el que se está produciendo la iteración se pueden visitar u omitir de la iteración.</p>
-
-<p>En general, es mejor no agregar, modificar o eliminar propiedades del objeto durante la iteración, aparte de la propiedad que se está visitando actualmente. No hay garantía de si se visitará una propiedad agregada, si se visitará una propiedad modificada (distinta de la actual) antes o después de que se modifique, o si se visitará una propiedad eliminada antes de eliminarla.</p>
-
-<h3 id="Iteración_en_arreglos_y_for...in">Iteración en arreglos y <code>for</code>...<code>in</code></h3>
-
-<div class="note">
-<p><strong>Nota</strong>: <code>for...in</code> no se debe usar para iterar sobre un {{JSxRef("Array")}} donde el orden del índice es importante.</p>
-</div>
-
-<p>Los índices del arreglo son solo propiedades enumerables con nombres enteros y, por lo demás, son idénticos a las propiedades generales del objeto. No hay garantía de que <code>for...in</code> devuelva los índices en un orden en particular. La instrucción de bucle <code>for...in</code> devolverá todas las propiedades enumerables, incluidas aquellas con nombres no enteros y aquellas que se heredan.</p>
-
-<p>Debido a que el orden de iteración depende de la implementación, es posible que la iteración sobre un arreglo no visite los elementos en un orden coherente. Por lo tanto, es mejor usar un bucle {{JSxRef("Sentencias/for", "for")}} con un índice numérico (o {{JSxRef("Array.prototype.forEach()")}} o el bucle {{JSxRef("Sentencias/for...of", "for...of")}}) cuando se itera sobre arreglos donde el orden de acceso es importante.</p>
-
-<h3 id="Iterar_solo_sobre_propiedades_directas">Iterar solo sobre propiedades directas</h3>
-
-<p>Si solo deseas considerar las propiedades adjuntas al objeto en sí mismo, y no sus prototipos, usa {{JSxRef("Object.getOwnPropertyNames", "getOwnPropertyNames()")}} o realiza una {{JSxRef("Object.prototype.hasOwnProperty", "hasOwnProperty()")}} verificación ({{jsxref("Object.prototype.propertyIsEnumerable", "propertyIsEnumerable()")}} también se puede utilizar). Alternativamente, si sabes que no habrá ninguna interferencia de código externo, puedes extender los prototipos incorporados con un método de verificación.</p>
-
-<h2 id="¿Por_qué_usar_for...in">¿Por qué usar <code>for</code>...<code>in</code>?</h2>
-
-<p>Dado que <code>for...in</code> está construido para iterar propiedades de objeto, no se recomienda su uso con arreglos y opciones como <code>Array.prototype.forEach()</code> y existe <code>for...of</code>, ¿cuál podría ser el uso de <code>for...in</code>?</p>
-
-<p>Es posible que se utilice de forma más práctica con fines de depuración, ya que es una forma fácil de comprobar las propiedades de un objeto (mediante la salida a la consola o de otro modo). Aunque los arreglos suelen ser más prácticos para almacenar datos, en situaciones en las que se prefiere un par clave-valor para trabajar con datos (con propiedades que actúan como la "clave"), puede haber casos en los que desees comprobar si alguna de esas claves cumple un valor particular.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Utilizar_for...in">Utilizar <code>for</code>...<code>in</code></h3>
-
-<p>El siguiente bucle <code>for...in</code> itera sobre todas las propiedades enumerables que no son símbolos del objeto y registra una cadena de los nombres de propiedad y sus valores.</p>
-
-<pre class="brush: js notranslate">var obj = {a: 1, b: 2, c: 3};
-
-for (const prop in obj) {
-  console.log(`obj.${prop} = ${obj[prop]}`);
-}
-
-// Produce:
-// "obj.a = 1"
-// "obj.b = 2"
-// "obj.c = 3"</pre>
-
-<h3 id="Iterar_propiedades_directas">Iterar propiedades directas</h3>
-
-<p>La siguiente función ilustra el uso de {{JSxRef("Object.prototype.hasOwnProperty", "hasOwnProperty()")}} — las propiedades heredadas no se muestran.</p>
-
-<pre class="brush: js notranslate">var triangle = {a: 1, b: 2, c: 3};
-
-function ColoredTriangle() {
-  this.color = 'red';
-}
-
-ColoredTriangle.prototype = triangle;
-
-var obj = new ColoredTriangle();
-
-for (const prop in obj) {
-  if (obj.hasOwnProperty(prop)) {
-    console.log(`obj.${prop} = ${obj[prop]}`);
-  }
-}
-
-// Produce:
-// "obj.color = red"
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'declaración for...in')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.statements.for_in")}}</p>
-
-<h3 id="Compatibilidad_expresiones_iniciadoras_en_modo_estricto">Compatibilidad: expresiones iniciadoras en modo estricto</h3>
-
-<p>Antes de Firefox 40, era posible utilizar una expresión iniciadora (<code>i=0</code>) en un bucle <code>for...in</code>:</p>
-
-<pre class="brush: js example-bad notranslate">var obj = {a: 1, b: 2, c: 3};
-for (var i = 0 in obj) {
-  console.log(obj[i]);
-}
-// 1
-// 2
-// 3
-</pre>
-
-<p>Este comportamiento no estándar ahora se ignora en la versión 40 y posteriores, y presentará un {{JSxRef("SyntaxError")}} ("{{JSxRef("errors/Invalid_for-in_initializer", "iniciador for...in no válido", "las declaraciones de encabezado del bucle for-in posiblemente no tengan iniciadores")}} en {{JSxRef("Strict_mode", "modo estricto")}} ({{bug(748550)}} y {{bug(1164741)}}").</p>
-
-<p>Otros motores como v8 (Chrome), Chakra (IE/Edge) y JSC (WebKit/Safari) están investigando si eliminar también el comportamiento no estándar.</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{JSxRef("Sentencias/for...of", "for...of")}} — una declaración similar que itera sobre la propiedad <code>values</code></li>
- <li>{{JSxRef("Sentencias/for_each...in", "for each...in")}} — una declaración similar pero obsoleta que itera sobre los valores de las propiedades de un objeto, en lugar de los nombres de las propiedades en sí</li>
- <li>{{JSxRef("Sentencias/for", "for")}}</li>
- <li>{{JSxRef("../Guide/Iterators_and_Generators", "Expresiones generadoras")}} (usa la sintaxis <code>for...in</code>)</li>
- <li>{{JSxRef("../Enumerability_and_ownership_of_properties", "Enumerabilidad y posesión de propiedades")}}</li>
- <li>{{JSxRef("Object.getOwnPropertyNames()")}}</li>
- <li>{{JSxRef("Object.prototype.hasOwnProperty()")}}</li>
- <li>{{JSxRef("Array.prototype.forEach()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/for...of/index.html b/files/es/web/javascript/referencia/sentencias/for...of/index.html
deleted file mode 100644
index 572308b41a..0000000000
--- a/files/es/web/javascript/referencia/sentencias/for...of/index.html
+++ /dev/null
@@ -1,319 +0,0 @@
----
-title: for...of
-slug: Web/JavaScript/Referencia/Sentencias/for...of
-tags:
-  - ECMAScript6
-  - JavaScript
-  - Referencia
-  - Sentencia
-translation_of: Web/JavaScript/Reference/Statements/for...of
----
-<div>
-<div>{{jsSidebar("Statements")}}</div>
-
-<p><span style="font-size: 1rem; letter-spacing: -0.00278rem;">La sentencia </span><strong style="font-size: 1rem; letter-spacing: -0.00278rem;">sentencia <code>for...of</code></strong><span style="font-size: 1rem; letter-spacing: -0.00278rem;"> ejecuta un bloque de código para cada elemento de un </span><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/iterable" style="font-size: 1rem; letter-spacing: -0.00278rem;">objeto iterable</a>,<span style="font-size: 1rem; letter-spacing: -0.00278rem;"> como lo son: {{jsxref("String")}}, {{jsxref("Array")}}, objetos similares a array (por ejemplo, {{jsxref("Functions/arguments", "arguments")}} or </span><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/API/NodeList" style="font-size: 1rem; letter-spacing: -0.00278rem;" title="NodeList objects are collections of nodes, usually returned by properties such as Node.childNodes and methods such as document.querySelectorAll()."><code>NodeList</code></a><span style="font-size: 1rem; letter-spacing: -0.00278rem;">), {{jsxref("TypedArray")}}, {{jsxref("Map")}}, {{jsxref("Set")}} e iterables definidos por el usuario.</span></p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">for (<em>variable</em> of <em>iterable</em>) {
-  <em>statement
-</em>}
-</pre>
-
-<dl>
- <dt><code>variable</code></dt>
- <dd>En cada iteración el elemento (propiedad enumerable) correspondiente es asignado a <em>variable</em>. </dd>
- <dt><code>iterable</code></dt>
- <dd>Objeto cuyas propiedades enumerables son iteradas. </dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Iterando_un_jsxrefArray">Iterando un {{jsxref("Array")}}</h3>
-
-<pre class="brush: js">let iterable = [10, 20, 30];
-
-for (let value of iterable) {
-  value += 1;
-  console.log(value);
-}
-// 11
-// 21
-// 31
-</pre>
-
-<p>Es posible usar <code>const</code> en lugar de <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let">let</a> </code>si no se va a modificar la variable dentro del bloque.</p>
-
-<pre class="brush: js">let iterable = [10, 20, 30];
-
-for (const value of iterable) {
-  console.log(value);
-}
-// 10
-// 20
-// 30</pre>
-
-<h3 id="Iterando_un_jsxrefString">Iterando un {{jsxref("String")}}</h3>
-
-<pre class="brush: js">let iterable = "boo";
-
-for (let value of iterable) {
-  console.log(value);
-}
-// "b"
-// "o"
-// "o"</pre>
-
-<h3 id="Iterando_un_jsxrefTypedArray">Iterando un {{jsxref("TypedArray")}}</h3>
-
-<pre class="brush: js">let iterable = new Uint8Array([0x00, 0xff]);
-
-for (let value of iterable) {
-  console.log(value);
-}
-// 0
-// 255</pre>
-
-<h3 id="Iterando_un_jsxrefMap">Iterando un {{jsxref("Map")}}</h3>
-
-<pre class="brush: js">let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
-
-for (let entry of iterable) {
-  console.log(entry);
-}
-// ['a', 1]
-// ['b', 2]
-// ['c', 3]
-
-for (let [key, value] of iterable) {
-  console.log(value);
-}
-// 1
-// 2
-// 3</pre>
-
-<h3 id="Iterando_un_jsxrefSet">Iterando un {{jsxref("Set")}}</h3>
-
-<pre class="brush: js">let iterable = new Set([1, 1, 2, 2, 3, 3]);
-
-for (let value of iterable) {
-  console.log(value);
-}
-// 1
-// 2
-// 3</pre>
-
-<h3 id="Iterando_un_objeto_arguments">Iterando un objeto <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/arguments">arguments</a></h3>
-
-<pre class="brush: js">(function() {
-  for (let argument of arguments) {
-    console.log(argument);
-  }
-})(1, 2, 3);
-
-// 1
-// 2
-// 3</pre>
-
-<h3 id="Iterando_una_colección_del_DOM">Iterando una colección del DOM</h3>
-
-<p>Iterando colecciones del DOM como un {{domxref("NodeList")}}: el siguiente ejemplo añade la clase "read" a los párrafos (<code>&lt;p&gt;</code>) que son descendientes directos de un (<code>&lt;article&gt;</code>):</p>
-
-<pre class="brush: js">// Nota: Esto solo funcionará en plataformas que tengan
-// implementado NodeList.prototype[Symbol.iterator]
-let articleParagraphs = document.querySelectorAll("article &gt; p");
-
-for (let paragraph of articleParagraphs) {
-  paragraph.classList.add("read");
-}</pre>
-
-<h3 id="Clausurando_iteraciones">Clausurando iteraciones</h3>
-
-<p>En los bucles <code>for...of</code>, se puede causar que la iteración termine de un modo brusco usando: <code>break</code>, <code>continue<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Chrome_closing_1">[4]</a></code>, <code>throw</code> or <code>return<a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Chrome_closing_2">[5]</a></code>. En estos casos la iteración se cierra.</p>
-
-<pre><code>function* foo(){
-  yield 1;
-  yield 2;
-  yield 3;
-};
-
-for (let o of foo()) {
-  console.log(o);
-  break; // closes iterator, triggers return
-}</code></pre>
-
-<h3 id="Iterando_generadores">Iterando generadores</h3>
-
-<p>También es posible iterar las nuevas funciones <strong><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*">generator</a></strong>:</p>
-
-<pre class="brush: js">function* fibonacci() { // una función generador
-  let [prev, curr] = [0, 1];
-  while (true) {
-    [prev, curr] = [curr, prev + curr];
-    yield curr;
-  }
-}
-
-for (let n of fibonacci()) {
-  console.log(n);
-  // interrumpir la secuencia en 1000
-  if (n &gt;= 1000) {
-    break;
-  }
-}</pre>
-
-<div class="note">
-<h4 id="No_se_deben_reutilizar_los_generadores"><a id="#re-use" name="#re-use">No se deben reutilizar los generadores</a></h4>
-
-<p>Los generadores no deben ser reutilizados, incluso si el bucle <strong><code>for...of</code></strong> se ha terminado antes de tiempo con la sentencia <a href="/es/docs/Web/JavaScript/Referencia/Sentencias/break">break</a>. Una vez abandonado el bucle, el generador está cerrado y tratar de iterar sobre él de nuevo no dará más resultados. Firefox no ha implementado aún este comportamiento y el generador puede ser reutilizado en contra de lo escrito en el estándar ES6 (<a href="https://www.ecma-international.org/ecma-262/6.0/#sec-13.7.5.13">13.7.5.13, step 5m</a>), pero esto cambiará una vez que el bug {{Bug(1147371)}} haya sido corregido.</p>
-</div>
-
-<pre class="brush: js example-bad">var gen = (function *(){
-  yield 1;
-  yield 2;
-  yield 3;
-})();
-for (let o of gen) {
-  console.log(o);
-  break;  // Finaliza la iteración
-}
-
-// El generador no debe ser reutilizado, lo siguiente no tiene sentido
-for (let o of gen) {
-  console.log(o); // Nunca será llamado
-}</pre>
-
-<h3 id="Iterando_otros_objetos_iterables">Iterando otros objetos iterables</h3>
-
-<p>Es posible, además, iterar un objeto que explicitamente implemente el protocolo <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#iterable">iterable</a>:</p>
-
-<pre class="brush: js">var iterable = {
-  [Symbol.iterator]() {
-    return {
-      i: 0,
-      next() {
-        if (this.i &lt; 3) {
-          return { value: this.i++, done: false };
-        }
-        return { value: undefined, done: true };
-      }
-    };
-  }
-};
-
-for (var value of iterable) {
-  console.log(value);
-}
-// 0
-// 1
-// 2</pre>
-
-<h3 id="Diferencia_entre_for...of_y_for...in">Diferencia entre <code>for...of</code> y <code>for...in</code></h3>
-
-<p>El bucle <code><strong><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in" title="en-US/docs/JavaScript/Reference/Statements/for...in">for...in</a></strong> iterará sobre <strong>todas las propiedades de un objeto</strong>.</code> Más tecnicamente, iterará sobre cualquier propiedad en el objeto que haya sido internamente definida con su propiedad <code>[[Enumerable]] </code>configurada como <code>true</code>. </p>
-
-<p>La sintaxis de  <strong><code>for...of</code> </strong>es específica para las <strong>colecciones</strong>, y no para todos los objetos. Esta Iterará sobre cualquiera de los elementos de una colección que tengan la propiedad <code>[Symbol.iterator]</code>.</p>
-
-<p>El siguiente ejemplo muestra las diferencias entre un bucle<strong> <code>for...of</code></strong> y un bucle <strong>f<code>or...in</code></strong>. </p>
-
-<pre class="brush: js">let arr = [3, 5, 7];
-arr.foo = "hola";
-
-for (let i in arr) {
-   console.log(i); // logs "0", "1", "2", "foo"
-}
-
-for (let i of arr) {
-   console.log(i); // logs "3", "5", "7"
-}</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Cometario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-for-in-and-for-of-statements', 'for...of statement')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'for...of statement')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Edge</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome(38)}} <a href="##Chrome_note_1">[1]</a><br>
-    {{CompatChrome(51)}} <a href="##Chrome_note_3">[3]</a></td>
-   <td>{{CompatGeckoDesktop("13")}} <a href="##Gecko_note_2">[2]</a> <a href="##Chrome_note_4">[4]</a></td>
-   <td>12</td>
-   <td>25</td>
-   <td>7.1</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>5.1</td>
-   <td>{{CompatChrome(38)}} <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Chrome_note_1">[1]</a></td>
-   <td>{{CompatGeckoMobile("13")}} <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/for...of$edit#Gecko_note_2">[2]</a></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>8</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p><a id="#Chrome_note_1" name="#Chrome_note_1">[1]</a> Desde Chrome 29 a Chrome 37 esta funcionalidad estuvo disponible al activar la opción chrome://flags/#enable-javascript-harmony: “JavaScript experimental”.</p>
-
-<p><a id="#Gecko_note_2" name="#Gecko_note_2">[2]</a> Antes de Firefox 51, el uso de <code>for...of usando</code> {{jsxref("const")}}<code> resultaba en un</code> {{jsxref("SyntaxError")}} ("missing = in const declaration"). El problema ha sido resuelto ({{bug(1101653)}}).</p>
-
-<p><a id="#Chrome_note_3" name="#Chrome_note_3">[3]</a> Chrome 51 añadió soporte para iterar objetos.</p>
-
-<p><a id="#Chrome_note_4" name="#Chrome_note_4">[4]</a> Firefox aún permite el uso de un generador después de haber interrumpido el bucle {{Bug(1147371)}}. Como se vio más arriba, <a href="##re-use">no se deben reutilizar los generadores</a>.</p>
-
-<h2 id="Vea_también">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Array.prototype.forEach()")}}</li>
- <li>{{jsxref("Map.prototype.forEach()")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/for/index.html b/files/es/web/javascript/referencia/sentencias/for/index.html
deleted file mode 100644
index 875236ba2b..0000000000
--- a/files/es/web/javascript/referencia/sentencias/for/index.html
+++ /dev/null
@@ -1,57 +0,0 @@
----
-title: for
-slug: Web/JavaScript/Referencia/Sentencias/for
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/for
----
-<div>
- {{jsSidebar("Statements")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Crea un bucle que consiste en tres expresiones opcionales, encerradas en paréntesis y separadas por puntos y comas, seguidas de una sentencia ejecutada en un bucle.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox">for ([<em>expresion-inicial</em>]; [<em>condicion</em>]; [<em>expresion-final</em>])<em>sentencia</em>
-</pre>
-<dl>
- <dt>
-  <code>expresion-inicial</code></dt>
- <dd>
-  Una expresión (incluyendo las expresiones de asignación) o la declaración de variable. Típicamente se utiliza para usarse como variable contador. Esta expresión puede opcionalmente declarar nuevas variables con la palabra clave <code>var</code>. Estas variables no son locales del bucle, es decir, están en el mismo alcance en el que está el bucle <code>for</code>. El resultado de esta expresión es descartado.</dd>
-</dl>
-<dl>
- <dt>
-  <code>condicion</code></dt>
- <dd>
-  Una expresión para ser evaluada antes de cada iteración del bucle. Si esta expresión se evalúa como verdadera, se ejecuta <code>sentencia</code>. Esta comprobación condicional es opcional. Si se omite, la condición siempre se evalúa como verdadera. Si la expresión se evalúa como falsa, la ejecución salta a la primera expresión que sigue al constructor de <code>for</code>.</dd>
-</dl>
-<dl>
- <dt>
-  <code>expresion-final</code></dt>
- <dd>
-  Una expresión para ser evaluada al final de cada iteración del bucle. Esto ocurre antes de la siguiente evaluación de la <code>condicion</code>. Generalmente se usa para actualizar o incrementar la variable contador.</dd>
-</dl>
-<dl>
- <dt>
-  <code>sentencia</code></dt>
- <dd>
-  Una sentencia que se ejecuta mientras la condición se evalúa como verdadera. Para ejecutar múltiples sentencias dentro del bucle, utilice una sentencia {{jsxref("Sentencias/block", "block")}} (<code>{ ... }</code>) para agrupar aquellas sentecias.</dd>
-</dl>
-<h3 id="Ejemplos" name="Ejemplos">Ejemplos</h3>
-<h4 id="Ejemplo:_Usando_for" name="Ejemplo:_Usando_for">Ejemplo: Usando <code>for</code></h4>
-<p>La siguiente sentencia <code>for</code> comienza mediante la declaración de la variable <code>i</code> y se inicializa a <code>0</code>. Comprueba que <code>i</code> es menor que nueve, realiza las dos sentencias con éxito e incrementa <code>i</code> en 1 después de cada pase del bucle.</p>
-<pre class="eval">for (var i = 0; i &lt; 9; i++) {
-   n += i;
-   mifuncion(n);
-}
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("Sentencias/break", "break")}}</li>
- <li>{{jsxref("Sentencias/continue", "continue")}}</li>
- <li>{{jsxref("Sentencias/empty", "empty")}}</li>
- <li>{{jsxref("Sentencias/while", "while")}}</li>
- <li>{{jsxref("Sentencias/do...while", "do...while")}}</li>
- <li>{{jsxref("Sentencias/for...in", "for...in")}}</li>
- <li>{{jsxref("Sentencias/for...of", "for...of")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/funcion_asincrona/index.html b/files/es/web/javascript/referencia/sentencias/funcion_asincrona/index.html
deleted file mode 100644
index 573c10fad8..0000000000
--- a/files/es/web/javascript/referencia/sentencias/funcion_asincrona/index.html
+++ /dev/null
@@ -1,173 +0,0 @@
----
-title: Función async
-slug: Web/JavaScript/Referencia/Sentencias/funcion_asincrona
-tags:
-  - Declaración
-  - Ejemplo
-  - JavaScript
-  - función
-translation_of: Web/JavaScript/Reference/Statements/async_function
----
-<div>
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La declaración de función <code><strong>async</strong></code> define una <em>función asíncrona</em>, la cual devuelve un objeto {{jsxref("Global_Objects/AsyncFunction","AsyncFunction")}}.</p>
-
-<div class="noinclude">
-<p>Es posible definir también funciones asíncronas a través de una {{jsxref("Operators/async_function", "expresión de función async", "", 1)}}.</p>
-</div>
-</div>
-
-<div>{{EmbedInteractiveExample("pages/js/statement-async.html", "taller")}}</div>
-
-<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">async function <em>name</em>([<em>param</em>[, <em>param</em>[, ... <em>param</em>]]]) {
-   <em>statements</em>
-}
-</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>El nombre de la función.</dd>
-</dl>
-
-<dl>
- <dt><code>param</code></dt>
- <dd>El nombre de un argumento que se debe pasar a la función.</dd>
-</dl>
-
-<dl>
- <dt><code>statements</code></dt>
- <dd>Las declaraciones que conforman el cuerpo de la función.</dd>
-</dl>
-
-<h3 id="Valor_de_retorno">Valor de retorno</h3>
-
-<p>Un objeto {{jsxref("Global_Objects/AsyncFunction","AsyncFunction")}}, que representa una función asíncrona que ejecuta el código contenido dentro de la función.</p>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Cuando se llama a una función <code>async</code>, esta devuelve un elemento {{jsxref("Promise")}}. Cuando la función <code>async</code> devuelve un valor, <code>Promise</code> se resolverá con el valor devuelto. Si la función <code>async</code> genera una excepción o algún valor, <code>Promise</code> se rechazará con el valor generado.</p>
-
-<p>Una función <code>async</code> puede contener una expresión {{jsxref("Operators/await", "await")}}, la cual pausa la ejecución de la función asíncrona y espera la resolución de la <code>Promise</code> pasada y, a continuación, reanuda la ejecución de la función <code>async</code> y devuelve el valor resuelto.</p>
-
-<div class="note">
-<p>La finalidad de las funciones <code>async</code>/<code>await</code> es simplificar el comportamiento del uso síncrono de promesas y realizar algún comportamiento específico en un grupo de <code>Promises</code>. Del mismo modo que las <code>Promises</code> son semejantes a las devoluciones de llamadas estructuradas, <code>async</code>/<code>await</code> se asemejan a una combinación de generadores y promesas.</p>
-</div>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_sencillo">Ejemplo sencillo</h3>
-
-<pre class="brush: js">function resolveAfter2Seconds(x) {
-  return new Promise(resolve =&gt; {
-    setTimeout(() =&gt; {
-      resolve(x);
-    }, 2000);
-  });
-}
-
-
-async function add1(x) {
-  const a = await resolveAfter2Seconds(20);
-  const b = await resolveAfter2Seconds(30);
-  return x + a + b;
-}
-
-add1(10).then(v =&gt; {
-  console.log(v);  // prints 60 after 4 seconds.
-});
-
-
-async function add2(x) {
-  const p_a = resolveAfter2Seconds(20);
-  const p_b = resolveAfter2Seconds(30);
-  return x + await p_a + await p_b;
-}
-
-add2(10).then(v =&gt; {
-  console.log(v);  // prints 60 after 2 seconds.
-});
-</pre>
-
-<div class="warning">
-<h4 id="No_se_deben_confundir_await_y_Promise.all">No se deben confundir <code>await</code> y <code>Promise.all</code></h4>
-
-<p>En <code>add1</code>, la ejecución se suspende durante dos segundos correspondientes al primer operador <code>await</code>, y luego durante otros dos segundos correspondientes al segundo <code>await</code>. El segundo temporizador no se crea hasta que el primero no se haya disparado ya. En <code>add2</code>, ambos temporizadores se crean y, acto seguido, ambos reciben <code>await</code>. Esto provoca la resolución en dos segundos y no cuatro, ya que los temporizadores se ejecutaron de manera simultánea. Sin embargo, ambas llamadas <code>await</code> aún pueden ejecutarse en series, no en paralelo: esto <strong>no</strong> constituye ninguna aplicación automática de <code>Promise.all</code>. Si se desea aplicar <code>await</code> a dos o más promesas en paralelo, es preciso utilizar <code>Promise.all</code>.</p>
-</div>
-
-<h3 id="Reescritura_de_una_cadena_de_promesas_con_una_función_async">Reescritura de una cadena de promesas con una función <code>async</code></h3>
-
-<p>Una API que devuelva una {{jsxref("Promise")}} tendrá como resultado una cadena de promesas, y dividirá la función en muchas partes. Estudie este código:</p>
-
-<pre class="brush: js">function getProcessedData(url) {
-  return downloadData(url) // returns a promise
-    .catch(e =&gt; {
-      return downloadFallbackData(url)  // returns a promise
-    })
-    .then(v =&gt; {
-      return processDataInWorker(v); // returns a promise
-    });
-}
-</pre>
-
-<p>Es posible reescribirlo utilizando un solo operador <code>async</code> de esta manera:</p>
-
-<pre class="brush: js">async function getProcessedData(url) {
-  let v;
-  try {
-    v = await downloadData(url);
-  } catch(e) {
-    v = await downloadFallbackData(url);
-  }
-  return processDataInWorker(v);
-}
-</pre>
-
-<p>Observe que, en el ejemplo anterior, no hay ninguna instrucción <code>await</code> dentro de la instrucción <code>return</code>, porque el valor de retorno de una <code>async function</code> queda implícitamente dentro de un {{jsxref("Promise.resolve")}}.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('ESDraft', '#sec-async-function-definitions', 'Función async')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td>Definición inicial en ES2017.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES8', '#sec-async-function-definitions', 'Función async')}}</td>
-   <td>{{Spec2('ES8')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<div>
-
-
-<p>{{Compat("javascript.statements.async_function")}}</p>
-</div>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>{{jsxref("Operators/async_function", "Expresión de función async")}}</li>
- <li>Objeto {{jsxref("AsyncFunction")}}</li>
- <li>{{jsxref("Operators/await", "await")}}</li>
- <li><a href="http://innolitics.com/10x/javascript-decorators-for-promise-returning-functions/">«Decorar funciones async de JavaScript» en innolitics.com</a> (en inglés)</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/function/index.html b/files/es/web/javascript/referencia/sentencias/function/index.html
deleted file mode 100644
index 36b02935d9..0000000000
--- a/files/es/web/javascript/referencia/sentencias/function/index.html
+++ /dev/null
@@ -1,52 +0,0 @@
----
-title: function
-slug: Web/JavaScript/Referencia/Sentencias/function
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/function
----
-<div>
- {{jsSidebar("Statements")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Declara una función con los parámetros especificados.</p>
-<p>Puede también definir funciones usando el constructor {{jsxref("Function")}} y el {{jsxref("Operadors/function", "function")}} (expresión function).</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="syntaxbox">function <em>nombre</em>([<em>parametro1</em>] [,<em>parametro2</em>] [..., <em>parametroN</em>]) {<em>sentencias</em>}
-</pre>
-<dl>
- <dt>
-  <code>nombre</code></dt>
- <dd>
-  El nombre de la función.</dd>
-</dl>
-<dl>
- <dt>
-  <code>parametroN</code></dt>
- <dd>
-  El nombre de un argumento que se pasa a la función. Una función puede tener hasta 255 argumentos.</dd>
-</dl>
-<dl>
- <dt>
-  <code>sentencias</code></dt>
- <dd>
-  Las sentencias que comprenden el cuerpo de la función.</dd>
-</dl>
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-<p>Para devolver un valor, la función debe tener una sentencia {{jsxref("Sentencias/return", "return")}} que especifica el valor a devolver.</p>
-<p>Una función creada con la sentencia <code>function</code> es un objeto <code>Function</code> y tiene todas las propiedades, métodos, y comportamiento de los objetos <code>Function</code>. Vea {{jsxref("Function")}} para información detallada sobre funciones.</p>
-<p>Una función puede también ser declarada dentro de una expresión. En este caso la función es normalmente anónima. Vea {{jsxref("Operadores/function", "function expression")}} para más información acerca de <code>function</code> (expresión function).</p>
-<p>Las funciones pueden declararse condicionalmente. Es decir, una definición de una función puede estar anidada dentro de una sentecia <code>if</code>. Técnicamente, tales declaraciones no son en realidad declaraciones de funciones; son expresiones function (expresiones de función).</p>
-<h2 id="Ejemplo" name="Ejemplo">Ejemplo</h2>
-<h3 id="Ejemplo:_Usando_function" name="Ejemplo:_Usando_function">Ejemplo: Usando <code>function</code></h3>
-<p>El siguiente código declara una función que devuelve la cantidad total de ventas, cuando se da el número de unidades vendidas de productos <code>a</code>, <code>b</code>, y <code>c</code>.</p>
-<pre class="brush: js">function calcular_ventas(unidades_a, unidades_b, unidades_c) {
-   return unidades_a*79 + unidades_b * 129 + unidades_c * 699;
-}
-</pre>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
- <li>{{jsxref("Function")}}</li>
- <li>Operadores{{jsxref("Operadores/function", "function")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/function_star_/index.html b/files/es/web/javascript/referencia/sentencias/function_star_/index.html
deleted file mode 100644
index 79ff51b7f2..0000000000
--- a/files/es/web/javascript/referencia/sentencias/function_star_/index.html
+++ /dev/null
@@ -1,224 +0,0 @@
----
-title: function*
-slug: Web/JavaScript/Referencia/Sentencias/function*
-tags:
-  - Declaración
-  - Experimental
-  - Expérimental(2)
-  - Iterador
-  - función
-translation_of: Web/JavaScript/Reference/Statements/function*
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La declaración <code><strong>function*</strong></code> (la palabra clave <code>function</code> seguida de un asterisco) define una <em>función generadora</em>, que devuelve un objeto {{jsxref("Global_Objects/Generator","Generator")}}.</p>
-
-<div class="noinclude">
-<p>También puedes definir funciones generadoras usando el constructor {{jsxref("GeneratorFunction")}} y una {{jsxref("Operators/function*", "function* expression")}}.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">function* <em>nombre</em>([<em>param</em>[, <em>param</em>[, ... <em>param</em>]]]) {
-   <em>instrucciones</em>
-}
-</pre>
-
-<dl>
- <dt><code>nombre</code></dt>
- <dd>El nombre de la función.</dd>
-</dl>
-
-<dl>
- <dt><code>param</code></dt>
- <dd>El nombre de los argumentos que se le van a pasar a la función. Una función puede tener hasta 255 argumentos.</dd>
-</dl>
-
-<dl>
- <dt><code>instrucciones</code></dt>
- <dd>Las instrucciones que componen el cuerpo de la función.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Los generadores son funciones de las que se puede salir y volver a entrar. Su contexto (asociación de variables) será conservado entre las reentradas.</p>
-
-<p>La llamada a una función generadora no ejecuta su cuerpo inmediatamente; se devuelve un objeto <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#iterator">iterador</a> para la función en su lugar. Cuando el metodo <code>next()</code> del iterador es llamado , el cuerpo de la función generadora es ejecutado hasta la primera expresión {{jsxref("Operators/yield", "yield")}}, la cual especifica el valor que será retornado por el iterador o con, {{jsxref("Operators/yield*", "yield*")}}, delega a otra función generadora. El método <code>next()</code> retorna un objeto con una propiedad <em>value</em> que contiene el valor bajo el operador yield y una propiedad <em>done </em>que indica, con un booleano, si la función generadora ha hecho yield al último valor.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo_simple">Ejemplo simple</h3>
-
-<pre class="brush: js">function* idMaker(){
-  var index = 0;
-  while(index &lt; 3)
-    yield index++;
-}
-
-var gen = idMaker();
-
-console.log(gen.next().value); // 0
-console.log(gen.next().value); // 1
-console.log(gen.next().value); // 2
-console.log(gen.next().value); // undefined
-// ...</pre>
-
-<h3 id="Ejemplo_con_yield*">Ejemplo con yield*</h3>
-
-<pre class="brush: js">function* anotherGenerator(i) {
-  yield i + 1;
-  yield i + 2;
-  yield i + 3;
-}
-
-function* generator(i){
-  yield i;
-  yield* anotherGenerator(i);
-  yield i + 10;
-}
-
-var gen = generator(10);
-
-console.log(gen.next().value); // 10
-console.log(gen.next().value); // 11
-console.log(gen.next().value); // 12
-console.log(gen.next().value); // 13
-console.log(gen.next().value); // 20
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificaciones</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentarios</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ES2015', '#', 'function*')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Initial definition.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome(39.0)}}</td>
-   <td>{{CompatGeckoDesktop("26.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>26</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>yield*</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("27.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>26</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>IteratorResult</code> object instead of throwing</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("29.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatChrome(39.0)}}</td>
-   <td>{{CompatGeckoMobile("26.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>yield*</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("27.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td><code>IteratorResult</code> object instead of throwing</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("29.0")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Notas_específicas_de_Firefox">Notas específicas de Firefox</h3>
-
-<h4 id="Generadores_e_iteradores_en_versiones_de_Firefox_anteriores_a_26">Generadores e iteradores en versiones de Firefox anteriores a 26</h4>
-
-<p>Las versiones anteriores de FireFox implementan así mismo una versión anterior de la propuesta de generadores. En la versión anterior, los generadores eran definidos utilizando la declaración <code>function</code> de una manera regular (Sin asterisco).  Véase <a href="/en-US/docs/Web/JavaScript/Reference/Statements/Legacy_generator_function">Legacy generator function </a>para mayor información.</p>
-
-<h4 id="IteratorResult_object_returned_instead_of_throwing"><code>IteratorResult</code> object returned instead of throwing</h4>
-
-<p>Starting with Gecko 29 {{geckoRelease(29)}}, the completed generator function no longer throws a {{jsxref("TypeError")}} "generator has already finished". Instead, it returns an <code>IteratorResult</code> object like <code>{ value: undefined, done: true }</code> ({{bug(958951)}}).</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Operators/function*", "function* expression")}}</li>
- <li>{{jsxref("GeneratorFunction")}} object</li>
- <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">The Iterator protocol</a></li>
- <li>{{jsxref("Operators/yield", "yield")}}</li>
- <li>{{jsxref("Operators/yield*", "yield*")}}</li>
- <li>{{jsxref("Function")}} object</li>
- <li>{{jsxref("Statements/function", "function declaration")}}</li>
- <li>{{jsxref("Operators/function", "function expression")}}</li>
- <li>{{jsxref("Functions_and_function_scope", "Functions and function scope")}}</li>
- <li>Other web resources:
-  <ul>
-   <li><a href="http://facebook.github.io/regenerator/">Regenerator</a> an ES2015 generator compiler to ES5</li>
-   <li><a href="http://www.youtube.com/watch?v=qbKWsbJ76-s">Forbes Lindesay: Promises and Generators: control flow utopia -- JSConf EU 2013</a></li>
-   <li><a href="https://www.youtube.com/watch?v=ZrgEZykBHVo&amp;list=PLuoyIZT5fPlG44bPq50Wgh0INxykdrYX7&amp;index=1">Hemanth.HM: The New gen of *gen(){}</a></li>
-   <li><a href="http://taskjs.org/">Task.js</a></li>
-  </ul>
- </li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/if...else/index.html b/files/es/web/javascript/referencia/sentencias/if...else/index.html
deleted file mode 100644
index 3bac571218..0000000000
--- a/files/es/web/javascript/referencia/sentencias/if...else/index.html
+++ /dev/null
@@ -1,109 +0,0 @@
----
-title: if...else
-slug: Web/JavaScript/Referencia/Sentencias/if...else
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/if...else
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>Ejecuta una sentencia si una condición específicada es evaluada como verdadera. Si la condición es evaluada como falsa, otra sentencia puede ser ejecutada.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="eval">if (<em>condición</em>) <em>sentencia1</em> [else <em>sentencia2</em>]
-</pre>
-
-<dl>
- <dt><code>condición</code></dt>
- <dd>Una expresión que puede ser evaluada como verdadera o falsa.</dd>
-</dl>
-
-<dl>
- <dt><code>sentencia1</code></dt>
- <dd>Sentencia que se ejecutará si <code>condición</code> es evaluada como verdadera. Puede ser cualquier sentencia, incluyendo otras sentenccias <code>if</code> anidadas. Para ejecutar múltiples sentencias, use una sentencia {{jsxref("Sentencias/block", "block")}} ({ ... }) para agruparlas.</dd>
-</dl>
-
-<dl>
- <dt><code>sentencia2</code></dt>
- <dd>Sentencia que se ejecutará si <code>condición</code> se evalúa como falsa, y exista una cláusula <code>else</code>. Puede ser cualquier sentencia, incluyendo sentencias block y otras sentencias <code>if</code> anidadas.</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Multiples sentencias <code>if...else</code> pueden ser anidadas para crear una cláusula <code>else if</code>:</p>
-
-<pre>if (<em>condición1</em>)
-   <em>sentencia1</em>
-else if (<em>condición2</em>)
-   <em>sentencia2</em>
-else if (<em>condición3</em>)
-   <em>sentencia3</em>
-...
-else
-   <em>sentenciaN</em>
-</pre>
-
-<p>Para entender como esto funciona, así es como se vería si el anidamiento hubiera sido indentado correctamente:</p>
-
-<pre>if (<em>condición1</em>)
-   <em>sentencia1</em>
-else
-   if (<em>condición2</em>)
-      <em>sentencia2</em>
-   else
-      if (<em>condición3</em>)
-        ...
-</pre>
-
-<p>Para ejecutar varias sentencias en una cláusula, use una sentencia block (<code>{ ... }</code>) para agruparlas. Generalmente, es una buena práctica usar siempre sentencias block, especialmente en código que incluya sentencias if anidadas:</p>
-
-<pre class="brush: js">if (condición) {
-   sentencia1
-} else {
-   sentencia2
-}
-</pre>
-
-<p>No confundir los valores primitivos <code>true</code> y <code>false</code> con los valores true y false del objeto {{jsxref("Boolean")}}. Cualquier valor diferente de <code>undefined</code>, <code>null</code>, <code>0</code>, <code>-0</code>, <code>NaN</code>, o la cadena vacía (<code>""</code>), y cualquier objecto, incluso un objeto Boolean cuyo valor es false, se evalúa como verdadero en una sentencia condicional. Por ejemplo:</p>
-
-<pre class="brush: js">var b = new Boolean(false);
-if (b) // Esta condición se evalúa como verdadera
-</pre>
-
-<h2 id="Examples" name="Examples">Ejemplos</h2>
-
-<h3 id="Example:_Using_if...else" name="Example:_Using_if...else">Ejemplo: Uso de <code>if...else</code></h3>
-
-<pre class="brush: js">if (cipher_char == from_char) {
-   result = result + to_char;
-   x++;
-} else
-   result = result + clear_char;
-</pre>
-
-<h3 id="Example:_Assignment_within_the_conditional_expression" name="Example:_Assignment_within_the_conditional_expression">Ejemplo: Asignación en una expresión condicional</h3>
-
-<p>Es aconsejable no usar asignaciones simples en una expresión condicional, porque la asignación puede ser confundida con igualdad (operador relacional) cuando se lee el código. Por ejemplo, no use el siguiente código:</p>
-
-<pre class="brush: js">if (x = y) {
-   /* sentencia */
-}
-</pre>
-
-<p>Si realmente necesita una asignación dentro de una exprsión condicional, una práctica común es poner paréntesis adicionales alrededor del la asignación, por ejemplo:</p>
-
-<pre class="brush: js">if ((x = y)) {
-   /* sentencia */
-}
-</pre>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/block", "block")}}</li>
- <li>{{jsxref("Sentencias/switch", "switch")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/import.meta/index.html b/files/es/web/javascript/referencia/sentencias/import.meta/index.html
deleted file mode 100644
index 8c09e97475..0000000000
--- a/files/es/web/javascript/referencia/sentencias/import.meta/index.html
+++ /dev/null
@@ -1,93 +0,0 @@
----
-title: import.meta
-slug: Web/JavaScript/Referencia/Sentencias/import.meta
-translation_of: Web/JavaScript/Reference/Statements/import.meta
----
-<div>{{JSSidebar("Statements")}}</div>
-
-<p>El objeto<strong> <code>import.meta</code></strong> expone el contenido especifico de la metadata al módulo JavaScript. Este contiene informacion sobre el módulo, como por ejemplo, la URL del mismo.</p>
-
-<h2 id="Syntax">Syntax</h2>
-
-<pre class="syntaxbox">import.meta</pre>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La sintasis consiste de la palabra clave  {{JSxRef("Statements/import","import")}},un punto, y un identificador <code>meta</code>. Normalmente, la parte a la izquierda del punto es el objeto sobre el cual la accion es realizada, pero aqui <code>import</code> no es realmente un objeto.</p>
-
-<p>El objeto <code>import.meta</code> es creado por la implementacion ECMAScript , con un prototipo {{JSxRef("null")}} . El objeto es extensible y sus propiedades son grabables, editables y enumerables.</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_import.meta">Usando import.meta</h3>
-
-<p>Dado un módulo <code>my-module.js</code></p>
-
-<pre class="brush: html">&lt;script type="module" src="my-module.js"&gt;&lt;/script&gt;
-</pre>
-
-<p>puedes acceder a la meta información  sobre el módulo usando el objeto <code>import.meta</code>.</p>
-
-<pre class="brush: js;">console.log(import.meta); // { url: "file:///home/user/my-module.js" }</pre>
-
-<p>Este retorna un objeto con una propiedad  <code>url</code>  indicando la URL base del módulo.Esta será la URL de la que el script fue obtenido, por scripts externos, o  la URL base del documento que contiene el documento, por scripts inline.</p>
-
-<p>Nota que este incluirá parametros de la consulta y/o el hash (ej: seguido del <code>?</code> or <code>#</code>).</p>
-
-<p>Por ejemplo, con el siguiente HTML:</p>
-
-<pre class="brush: html">&lt;script type="module"&gt;
-import './index.mjs?someURLInfo=5';
-&lt;/script&gt;</pre>
-
-<p>..El siguiente archivo JavaScript registrará el parámetro <code>someURLInfo</code>:</p>
-
-<pre class="brush: js">// index.mjs
-new URL(import.meta.url).searchParams.get('someURLInfo'); // 5</pre>
-
-<p>Lo mismo aplica cuando un archivo importa otro:</p>
-
-<pre class="brush: js">// index.mjs
-import './index2.mjs?someURLInfo=5';
-
-// index2.mjs
-new URL(import.meta.url).searchParams.get('someURLInfo'); // 5</pre>
-
-<p>Nota que mientras Node.js pasa en la consulta los parámetros (o el hash ) como en el último ejemplo, a partir de Node 14.1.0, una URL con parametros en la consulta fallará  cuando se  carguen en el formato <code>node --experimental-modules index.mjs?someURLInfo=5</code> (es tratado como un archivo en lugar de una URL en este contexto).</p>
-
-<p>Tal argumento específico del archivo podria ser complementario al  usado en toda la aplicacion  <code>location.href</code> (con consultas strings o hash añadidas despues de la ruta HTML) (o en Node.js, mediante <code>process.argv</code>).</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificaciones</th>
-  </tr>
-  <tr>
-   <td><code><a href="https://tc39.es/proposal-import-meta/#prod-ImportMeta">import.meta</a></code> proposal</td>
-  </tr>
-  <tr>
-   <td>{{SpecName("HTML WHATWG", "webappapis.html#hostgetimportmetaproperties", "import.meta")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-
-
-<p>{{Compat("javascript.statements.import_meta")}}</p>
-
-<h3 id="Implementation_Progress">Implementation Progress</h3>
-
-<p>La siguiente tabla provee el estatus de implementación diaria para esta caracteristica, porque esta caracteristica aun no ha alcanzado la estabilidad entre navegadores. La información es generada corriendo los test relevantes de la caracteristica en <a href="https://github.com/tc39/test262">Test262</a>, la suite estandar de test de JavaScript, en el build nocturno,  o en el último release de cada  motor de los browser de JavaScript.</p>
-
-<div>{{EmbedTest262ReportResultsTable("import.meta")}}</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{JSxRef("Statements/import", "import")}}</li>
- <li>{{JSxRef("Statements/export", "export")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/import/index.html b/files/es/web/javascript/referencia/sentencias/import/index.html
deleted file mode 100644
index 7d2c261d0e..0000000000
--- a/files/es/web/javascript/referencia/sentencias/import/index.html
+++ /dev/null
@@ -1,177 +0,0 @@
----
-title: import
-slug: Web/JavaScript/Referencia/Sentencias/import
-tags:
-  - ECMAScript 2015
-  - JavaScript
-  - Módulos
-  - Sentencia
-  - import
-translation_of: Web/JavaScript/Reference/Statements/import
----
-<div>{{jsSidebar("Sentencias")}}</div>
-
-<p>La sentencia <code><strong>import</strong></code> se usa para importar funciones que han sido exportadas desde un módulo externo.</p>
-
-<div class="note">
-<p>Por el momento, esta característica sólo está <a href="https://jakearchibald.com/2017/es-modules-in-browsers/">comenzando a ser implementada</a> de forma nativa en los navegadores. Está implementada en muchos transpiladores, tales como Typescript y <a href="http://babeljs.io/">Babel</a>, y en empaquetadores como <a href="https://github.com/rollup/rollup">Rollup</a> y <a href="https://webpack.js.org/">Webpack</a>.</p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">import <em>defaultExport</em> from "<em>module-name</em>";
-import * as <em>name</em> from "<em>module-name</em>";
-import { <em>export </em>} from "<em>module-name</em>";
-import { <em>export</em> as <em>alias </em>} from "<em>module-name</em>";
-import { <em>export1 , export2</em> } from "<em>module-name</em>";
-import { <em>export1 , export2</em> as <em>alias2</em> , <em>[...]</em> } from "<em>module-name</em>";
-import <em>defaultExport</em>, { <em>export</em> [ , <em>[...]</em> ] } from "<em>module-name</em>";
-import <em>defaultExport</em>, * as <em>name</em> from "<em>module-name</em>";
-import "<em>module-name</em>";</pre>
-
-<dl>
- <dt><code>defaultExport</code></dt>
- <dd>Nombre que se referirá al export por defecto del módulo.</dd>
- <dt><code>module-name</code></dt>
- <dd>El módulo desde el que importar. Normalmente es una ruta relativa o absoluta al archivo <code><strong>.js</strong></code> que contiene el módulo, excluyendo la extensión <code><strong>.js</strong></code>. Algunos empaquetadores pueden permitir o requerir el uso de la extensión; comprueba tu entorno. Sólo se permiten Strings con comillas simples o dobles.</dd>
- <dt><code>name</code></dt>
- <dd>Nombre del objeto del módulo que se utilizará como nombre de dominio al hacer referencia a los imports.</dd>
- <dt><span style='background-color: rgba(220, 220, 220, 0.5); font-family: consolas,"Liberation Mono",courier,monospace; font-style: inherit; font-weight: inherit;'>export, exportN</span></dt>
-</dl>
-
-<dl>
- <dd>Nombre de los exports a ser importados.</dd>
- <dt><code>alias, aliasN</code></dt>
- <dd>Nombre del objeto que recibirá la propiedad importada.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>El parámetro <code>name</code> es el nombre del objeto que recibirá los miembros exportados. El parámetro <code>member</code> especifica miembros individuales, mientras el parámetro <code>name</code> importa todos ellos. <font face="Courier New, Andale Mono, monospace">name</font> puede también ser una función si el módulo exporta un sólo parámetro por defecto en lugar de una serie de miembros. Abajo hay ejemplos que explican la sintaxis.</p>
-
-<h3 id="Importa_el_contenido_de_todo_un_módulo.">Importa el contenido de todo un módulo.</h3>
-
-<p>Esto inserta <code>myModule</code> en el ámbito actual, que contiene todos los elementos exportados en el archivo ubicado en  <code>/modules/my-module.js</code>.</p>
-
-<pre class="brush: js">import * as myModule from '/modules/my-module.js';</pre>
-
-<p>Aquí, para acceder a los miembros exportados habrá que usar el alias del módulo ("myModule" en este caso) como namespace. Por ejemplo, si el módulo importado arriba incluye un miembre exportado llamado <code>doAllTheAmazingThings()</code>, habría que invocarlo de la siguiente manera:</p>
-
-<pre class="brush: js">myModule.doAllTheAmazingThings();</pre>
-
-<h3 id="Importa_un_solo_miembro_de_un_módulo.">Importa un solo miembro de un módulo.</h3>
-
-<p>Dado un objeto o valor llamado <code>myExport</code> que ha sido exportado del módulo <code>my-module</code> ya sea implícitamente (porque todo el módulo ha sido exportado) o explícitamente (usando la sentencia {{jsxref("Sentencias/export", "export")}} ), esto inserta <code>myExport</code> en el ámbito actual.</p>
-
-<pre class="brush: js">import {myExport} from '/modules/my-module.js';</pre>
-
-<h3 id="Importa_multiples_miembros_de_un_módulo.">Importa multiples miembros de un módulo.</h3>
-
-<p>Esto inserta <code>foo</code> y <code>bar</code> en el ámbito actual.</p>
-
-<pre class="brush: js">import {foo, bar} from "my-module.js";</pre>
-
-<h3 id="Importa_un_miembre_con_un_alias_mas_conveniente">Importa un miembre con un alias mas conveniente</h3>
-
-<p>Se puede renombrar un miembro exportado cuando se importa. Por ejemplo, esto inserta <code>shortName</code> en el ámbito actual.</p>
-
-<pre class="brush: js">import {reallyReallyLongModuleExportName as shortName}
-  from '/modules/my-module.js';</pre>
-
-<h3 id="Renombra_multiples_miembros_durante_la_importación">Renombra multiples miembros durante la importación</h3>
-
-<p>Importa múltiples miembros exportados de un módulo con un alias conveniente.</p>
-
-<pre class="brush: js">import {
-  reallyReallyLongModuleExportName as shortName,
-  anotherLongModuleName as short
-} from '/modules/my-module.js';</pre>
-
-<h3 id="Importa_un_módulo_entero_para_efectos_secundarios_sólamente">Importa un módulo entero para efectos secundarios sólamente</h3>
-
-<p>Importa un módulo entero para efectos secundarios sólamente, sin importar ningun elemento. Esto ejecuta el código global del módulo, pero no importa ningún valor.</p>
-
-<pre class="brush: js">import '/modules/my-module.js';</pre>
-
-<h3 id="Importación_de_elementos_por_defecto">Importación de elementos por defecto</h3>
-
-<p>Es posible tener una exportación por defecto (tanto si se trata de un objeto, función, clase, etc.). Recíprocamente, es posible usa la instrucción <code>import</code> para importar esos elementos establecidos como por defecto.</p>
-
-<p>La versión más sencilla de importar un elemento por defecto es:</p>
-
-<pre class="brush: js">import myDefault from '/modules/my-module.js';</pre>
-
-<p>También es posible usar la sintaxis por defecto con lo que hemos visto anteriormente (importación de espacios de nombres o importaciones con nombre. En esos casos, la importación por defecto se deberá realizar en primer lugar. Por ejemplo:</p>
-
-<pre class="brush: js">import myDefault, * as myModule from '/modules/my-module.js';
-// myModule used as a namespace</pre>
-
-<p>o</p>
-
-<pre class="brush: js">import myDefault, {foo, bar} from '/modules/my-module.js';
-// specific, named imports</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p>Importar un archivo secundario para asistir en un procesamiento de una petición JSON AJAX.</p>
-
-<h3 id="El_módulo_file.js">El módulo: file.js</h3>
-
-<pre class="brush: js">function getJSON(url, callback) {
-  let xhr = new XMLHttpRequest();
-  xhr.onload = function () {
-    callback(this.responseText)
-  };
-  xhr.open('GET', url, true);
-  xhr.send();
-}
-
-export function getUsefulContents(url, callback) {
-  getJSON(url, data =&gt; callback(JSON.parse(data)));
-}</pre>
-
-<h3 id="El_programa_principal_main.js">El programa principal: main.js</h3>
-
-<pre class="brush: js">import { getUsefulContents } from '/modules/file.js';
-
-getUsefulContents('http://www.example.com',
-    data =&gt; { doSomethingUseful(data); });</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table>
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-imports', 'Imports')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inical</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-imports', 'Imports')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<div class="hidden">
-<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
-</div>
-
-<p>{{Compat("javascript.statements.import")}}</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/export", "export")}}</li>
- <li><a href="https://blogs.windows.com/msedgedev/2016/05/17/es6-modules-and-beyond/">Previewing ES6 Modules and more from ES2015, ES2016 and beyond</a></li>
- <li><a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a>, Hacks blog post by Jason Orendorff</li>
- <li><a href="http://exploringjs.com/es6/ch_modules.html">Axel Rauschmayer's book: "Exploring JS: Modules"</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/index.html b/files/es/web/javascript/referencia/sentencias/index.html
deleted file mode 100644
index bbf0ce42e8..0000000000
--- a/files/es/web/javascript/referencia/sentencias/index.html
+++ /dev/null
@@ -1,141 +0,0 @@
----
-title: Sentencias
-slug: Web/JavaScript/Referencia/Sentencias
-tags:
-  - JavaScript
-  - Referencia
-  - sentencias
-translation_of: Web/JavaScript/Reference/Statements
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>Las aplicaciones JavaScript se componen de sentencias con una sintaxis propia. Una sentencia puede estar formada por múltiples líneas. Puede haber varias sentencias en una sola línea si separamos cada una de las sentencias por un punto y coma. No es una palabra clave, sino un grupo de palabras clave.</p>
-
-<h2 id="Sentencias_y_declaraciones_por_categoría">Sentencias y declaraciones por categoría</h2>
-
-<p>Puedes encontrarlas por orden alfabético en la columna de la izquierda .</p>
-
-<h3 id="Control_de_flujo">Control de flujo</h3>
-
-<dl>
- <dt>{{jsxref("Sentencias/block", "Block")}}</dt>
- <dd>Un bloque de sentencias se utiliza para agrupar cero o mas sentencias. El bloque se delimita por un par de llaves.</dd>
- <dt>{{jsxref("Sentencias/break", "break")}}</dt>
- <dd>Finaliza la sentencia actual loop, switch, o label y transfiere el control del programa a la siguiente sentencia de la sentencia finalizada.</dd>
- <dt>{{jsxref("Sentencias/continue", "continue")}}</dt>
- <dd>Finaliza la ejecucion de las sentencias dentro de la iteracion actual del actual bucle,  y continua la ejecucion del bucle con la siguiente iteracion.</dd>
- <dt>{{jsxref("Sentencias/Empty", "Empty")}}</dt>
- <dd>Una sentencia vacía se utiliza para proveer una "no sentencia", aunque la sintaxis de JavaScript esperaba una.</dd>
- <dt>{{jsxref("Sentencias/if...else", "if...else")}}</dt>
- <dd>Ejecuta una sentencia si una condición especificada es true. Si la condición es false, otra sentencia puede ser ejecutada.</dd>
- <dt>{{jsxref("Sentencias/switch", "switch")}}</dt>
- <dd>Evalua una expresión, igualando el valor de la expresión a una clausula case y ejecuta las sentencias asociadas con dicho case.</dd>
- <dt>{{jsxref("Sentencias/throw", "throw")}}</dt>
- <dd>Lanza una excepción definida por el usuario.</dd>
- <dt>{{jsxref("Sentencias/try...catch", "try...catch")}}</dt>
- <dd>Marca un bloque de sentencias para ser probadas (try) y especifica una respuesta, en caso de que se lance una excepción.</dd>
-</dl>
-
-<h3 id="Declaraciones">Declaraciones</h3>
-
-<dl>
- <dt>{{jsxref("Sentencias/var", "var")}}</dt>
- <dd>Declara una variable, opcionalmente inicializándola a un valor.</dd>
- <dt>{{jsxref("Sentencias/let", "let")}}</dt>
- <dd>Declara una variable local de ambito de bloque, opcionalmente inicializándola a un valor.</dd>
- <dt>{{jsxref("Sentencias/const", "const")}}</dt>
- <dd>Declara una constante de solo lectura.</dd>
-</dl>
-
-<h3 id="Funciones">Funciones</h3>
-
-<dl>
- <dt>{{jsxref("Sentencias/function", "function")}}</dt>
- <dd>Declara una función con los parámetros especificados.</dd>
- <dt>{{jsxref("Sentencias/function*", "function*")}}</dt>
- <dd>Los generadores de funciones permiten escribir {{jsxref("Iteration_protocols", "iteradores")}} con mas facilidad.</dd>
- <dt>{{experimental_inline}} {{jsxref("Statements/async_function", "async function")}}</dt>
- <dd>Declara una función asíncrona con los parámetros especificados.</dd>
- <dt>{{jsxref("Statements/return", "return")}}</dt>
- <dd>Especifica el valor a ser retornado por una función.</dd>
- <dt>{{jsxref("Statements/class", "class")}}</dt>
- <dd>Declara una clase.</dd>
-</dl>
-
-<h3 id="Iteraciones">Iteraciones</h3>
-
-<dl>
- <dt>{{jsxref("Sentencias/do...while", "do...while")}}</dt>
- <dd>Crea un bucle que ejecuta una instrucción especificada hasta que la condición de prueba se evalúa como falsa. La condición se evalúa después de ejecutar la instrucción, lo que da como resultado que la instrucción especificada se ejecute al menos una vez.</dd>
- <dt>{{jsxref("Sentencias/for", "for")}}</dt>
- <dd>Creates a loop that consists of three optional expressions, enclosed in parentheses and separated by semicolons, followed by a statement executed in the loop.</dd>
- <dt>{{deprecated_inline()}} {{non-standard_inline()}}{{jsxref("Sentencias/for_each...in", "for each...in")}}</dt>
- <dd>Itera una variable especificada sobre todos los valores de las propiedades del objeto. Para cada propiedad distinta, se ejecuta una instrucción especificada.</dd>
- <dt>{{jsxref("Sentencias/for...in", "for...in")}}</dt>
- <dd>Itera sobre las propiedades enumerables de un objeto, en orden albitrario. Para cada propiedad distinta, las instrucciones pueden ser ejecutadas.</dd>
- <dt>{{jsxref("Sentencias/for...of", "for...of")}}</dt>
- <dd>Iterates over iterable objects (including {{jsxref("Array", "array")}}, array-like objects, <a href="https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Iterators_and_Generators" title="Iterators and generators">iterators and generators</a>), invoking a custom iteration hook with statements to be executed for the value of each distinct property.</dd>
- <dt>{{jsxref("Sentencias/while", "while")}}</dt>
- <dd>Crea un bucle que ejecuta la instrucción especificada siempre que la condición de prueba se evalúe como verdadera. La condición se evalúa antes de ejecutar la instrucción.</dd>
-</dl>
-
-<h3 id="Otros">Otros</h3>
-
-<dl>
- <dt>{{jsxref("Sentencias/debugger", "debugger")}}</dt>
- <dd>Invoca cualquier funcionalidad de depuración disponible. Si no hay funcionalidad de depuración disponible, esta isntrucción no tiene efecto.</dd>
- <dt>{{jsxref("Sentencias/export", "export")}}</dt>
- <dd>Usada para permitir a un script firmada proveer propiedades, funciones y objetos a otros scripts firmada o sin firmar. Esta antigua funcionalidad de Netscape ha sido removida y será redefinida por los modulos de ECMAScript 6</dd>
- <dt>{{jsxref("Sentencias/import", "import")}}</dt>
- <dd>Usada para permitir a un escript importar propiedades, funciones y objetos desde otro script firmado que ha exportado su información. Esta antigua funcionalidad de Netscape ha sido removida y será redefinida por los modulos de ECMAScript 6.</dd>
- <dt>{{jsxref("Sentencias/label", "label")}}</dt>
- <dd>Provee una instrucción con un identificador que puedes referir usando una instrucción <code>break</code> o <code>continue</code> .</dd>
-</dl>
-
-<dl>
- <dt>{{deprecated_inline()}} {{jsxref("Sentencias/with", "with")}}</dt>
- <dd>Extiende la cadena de alcance para una instrucción.</dd>
-</dl>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-12', 'Statements')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Definición inicial</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3', '#sec-12', 'Statements')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-12', 'Statements')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td></td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Nuevo: function*, let, for...of, yield, class</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-ecmascript-language-statements-and-declarations', 'ECMAScript Language: Statements and Declarations')}}</td>
-   <td>{{Spec2('ESDraft')}}</td>
-   <td></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Vea_También">Vea También</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Operadores">Operadores</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/label/index.html b/files/es/web/javascript/referencia/sentencias/label/index.html
deleted file mode 100644
index 03f3108e0e..0000000000
--- a/files/es/web/javascript/referencia/sentencias/label/index.html
+++ /dev/null
@@ -1,35 +0,0 @@
----
-title: label
-slug: Web/JavaScript/Referencia/Sentencias/label
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/label
----
-<div>
- {{jsSidebar("Statements")}}</div>
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-<p>Proporciona una sentencia con un identificador al que se puede referir al usar las sentencias {{jsxref("Sentencias/break", "break")}} o {{jsxref("Sentencias/continue", "continue")}}.</p>
-<p>Por ejemplo, puede usar una etiqueta para identificar un bucle, y entonces usar las sentencias <code>break</code> o <code>continue</code> para indicar si un programa debería interrumpir el bucle o continuar su ejecución.</p>
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-<pre class="eval"><i>etiqueta</i> :<i>sentencia</i>
-</pre>
-<dl>
- <dt>
-  <code>etiqueta</code></dt>
- <dd>
-  Cualquier identificador JavaScript que no sea una palabra reservada.</dd>
-</dl>
-<dl>
- <dt>
-  <code>sentencia</code></dt>
- <dd>
-  Sentencias. <code>break</code> puede ser usado con cualquier sentencia etiquetada, y <code>continue</code> puede usarse con bucles etiquetados de sentencias.</dd>
-</dl>
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-<p>Para un ejemplo de una sentencia label usando <code>break</code>, vea <code>break</code>. Para un ejemplo de una sentencia label usando <code>continue</code>, vea <code>continue</code>.</p>
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-<ul>
- <li>{{jsxref("Sentencias/break", "break")}}</li>
- <li>{{jsxref("Sentencias/continue", "continue")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/let/index.html b/files/es/web/javascript/referencia/sentencias/let/index.html
deleted file mode 100644
index 8c450b37d4..0000000000
--- a/files/es/web/javascript/referencia/sentencias/let/index.html
+++ /dev/null
@@ -1,393 +0,0 @@
----
-title: let
-slug: Web/JavaScript/Referencia/Sentencias/let
-tags:
-  - Característica del lenguaje
-  - Declaración de variable
-  - ECMAScript 2015
-  - JavaScript
-  - Variables
-  - let
-  - sentencias
-translation_of: Web/JavaScript/Reference/Statements/let
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La instrucción <strong><code>let</code></strong> declara una variable de alcance local con ámbito de bloque<font><font>(</font></font><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/block">block </a>scope<font><font>)</font></font>, la cual, opcionalmente, puede ser inicializada con algún valor.</p>
-
-<div class="warning">
-<p class="p1">La palabra reservada <strong><code><span class="s1">let </span></code></strong>en Mozilla Firefox 44 y anteriores, está solo disponible para bloques de código en HTML que esten envueltos en una etiqueta <code><span class="s1">&lt;script type="application/javascript;version=1.7"&gt;</span></code> (o de una version mayor). Las etiquetas <a href="https://developer.mozilla.org/en-US/docs/XUL">XUL</a> tienen acceso a esas características sin necesidad de dicho bloque.  Es necesario tomar en cuenta que esta es una característica <s>no estándar</s> <u>que ya se ha hecho actualmente estándar</u>, <s>esto</s> <u>pero</u> puede crear conflictos con otros navegadores<u>, ya que fue una característica no estándar.</u></p>
-</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">let var1 [= valor1] [, var2 [= valor2]] [, ..., varN [= valorN]];</pre>
-
-<h3 id="Parámetros">Parámetros</h3>
-
-<dl>
- <dt><code>var1</code>, <code>var2</code>, …, <code>varN</code></dt>
- <dd>Los nombres de la variable o las variables a declarar. Cada una de ellas debe ser un identificador legal de JavaScript</dd>
- <dt><code>value1</code>, <code>value2</code>, …, <code>valueN</code></dt>
- <dd>Por cada una de las variables declaradas puedes, opcionalmente, especificar su valor inicial como una expresión legal JavaScript.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p><strong><code>let</code> </strong>te permite declarar variables limitando su alcance (<em>scope</em>) al bloque, declaración, o expresión donde se está usando.a diferencia de la palabra clave <code>var</code> la cual define una variable global o local en una función sin importar el ámbito del bloque. La otra diferencia entre <code>var</code> y <code>let</code> <span class="VIiyi" lang="es"><span class="ChMk0b JLqJ4b"><span>es que este último se inicializa a un valor sólo cuando un analizador lo evalúa (ver abajo).</span></span></span></p>
-
-<p>Al igual que <code>const</code>, <code>let </code>no crea propiedades del objeto se declara globalmente (en el alcance más alto).</p>
-
-<h3 id="Alcance_scope_a_nivel_de_bloque_con_let">Alcance (<em>scope</em>) a nivel de bloque con <code>let</code></h3>
-
-<p>Usar la palabra reservada <code>let</code> para definir variables dentro de un bloque.</p>
-
-<pre class="brush:js notranslate">if (x &gt; y) {
-  let gamma = 12.7 + y;
-  i = gamma * x;
-}
-</pre>
-
-<p>Es posible usar definiciones <code>let</code> para asociar código en extensiones con un pseudo-espacio-de-nombre (pseudo-namespace). (Ver <a href="/en-US/docs/Security_best_practices_in_extensions" title="en-US/docs/Security_best_practices_in_extensions">Mejores prácticas de seguridad en extensiones</a>.)</p>
-
-<pre class="brush:js notranslate">let Cc = Components.classes, Ci = Components.interfaces;
-</pre>
-
-<p><code>let</code> puede ser útil para escribir código más limpio cuando usamos funciones internas.</p>
-
-<pre class="brush:js notranslate">var list = document.getElementById("list");
-
-for (var i = 1; i &lt;= 5; i++) {
-  var item = document.createElement("LI");
-  item.appendChild(document.createTextNode("Item " + i));
-
-  let j = i;
-  item.onclick = function (ev) {
-    console.log("Item " + j + " is clicked.");
-  };
-  list.appendChild(item);
-}
-</pre>
-
-<p>El ejemplo anterior trabaja como se espera porque las cinco instancias de la función (anónima) interna hacen referencia a cinco diferentes instancias de la variable <code>j</code>. Nótese que esto no funcionaría como se espera si reemplazamos <code>let</code> con <code>var</code> o si removemos la variable <code>j</code> y simplemente usamos la variable <code>i</code> dentro de la función interna.</p>
-
-<h4 id="Reglas_de_alcance">Reglas de alcance</h4>
-
-<p>Variables declaradas por <code>let</code> tienen por alcance el bloque en el que se han definido, así mismo, como en cualquier bloque interno. De esta manera, <code>let</code> trabaja muy parecido a <code>var</code>. La más notable diferencia es que el alcance de una variable <code>var</code> es la función contenedora:</p>
-
-<pre class="brush:js notranslate">function varTest() {
-  var x = 31;
-  if (true) {
-    var x = 71;  // ¡misma variable!
-    console.log(x);  // 71
-  }
-  console.log(x);  // 71
-}
-
-function letTest() {
-  let x = 31;
-  if (true) {
-    let x = 71;  // variable diferente
-    console.log(x);  // 71
-  }
-  console.log(x);  // 31
-}
-// llamamos a las funciones
-varTest();
-letTest();
-</pre>
-
-<p>En el nivel superior de un programa y funciones, <code>let</code> , a diferencia de <code>var</code>, <strong>no crea</strong> una propiedad en el objeto global, por ejemplo:</p>
-
-<pre class="brush:js notranslate">var x = 'global';
-let y = 'global';
-console.log(this.x); // "global"
-console.log(this.y); // undefined
-</pre>
-
-<p>La salida de este código desplegaría "global" una vez.</p>
-
-<h3 id="Zona_muerta_temporal_y_errores_con_let">Zona muerta temporal y errores con <code>let<a id="muerta" name="muerta"></a></code></h3>
-
-<p>La <strong>redeclaración</strong> de la misma variable bajo un mismo <font><font><a href="https://www.ecma-international.org/ecma-262/6.0/#sec-lexical-environments">ámbito léxico</a> </font></font>terminaría en un error de tipo <code><a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/SyntaxError" title="SyntaxError">SyntaxError</a></code>. Esto también es <strong>extensible</strong> si usamos <code>var</code> dentro del <font><font>ámbito léxico</font></font>. Esto nos salvaguarda de redeclarar una variable accidentalmente y que no era posible  solo con <code>var.</code></p>
-
-<pre class="brush: js notranslate">if (x) {
-  let foo;
-  let foo; // Terminamos con un SyntaxError.
-}
-if (x) {
-  let foo;
-  var foo; // Terminamos con un SyntaxError.
-}
-</pre>
-
-<p>En ECMAScript 2015, <code>let</code> <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/var#Description">no eleva</a> la variable a la parte superior del bloque. Si se hace una referencia a la variable declarada con <code>let</code> (<code>let foo</code>) antes de su declaración, terminaríamos con un error de tipo <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/ReferenceError" title="TypeError">ReferenceError</a> </code>(al contrario de la variable declarada con <code>var</code>, que tendrá el valor <code>undefined</code>), esto porque la variables vive en una "zona muerta temporal" desde el inicio del bloque hasta que la declaración ha sido procesada.</p>
-
-<pre class="notranslate"><code>function do_something() {
-  console.log(bar); // undefined
-  console.log(foo); // ReferenceError: foo </code>no está definido<code>
-  var bar = 1;
-  let foo = 2;
-}</code></pre>
-
-<p>Es posible encontrar errores en bloques de control <a href="/en-US/docs/JavaScript/Reference/Statements/switch" title="switch"><code>switch</code></a> debido a que solamente existe un block subyacente.</p>
-
-<pre class="brush: js notranslate">switch (x) {
-  case 0:
-    let foo;
-    break;
-
-  case 1:
-    let foo; // Terminamos con un error de tipo SyntaxError.
-             // esto debido a la redeclaracion
-    break;
-}</pre>
-
-<h3 id="Otro_ejemplo_de_zona_muerta_temporal_combinada_con_ámbito_léxico"><font><font>Otro ejemplo de zona muerta temporal combinada con <a href="https://www.ecma-international.org/ecma-262/6.0/#sec-lexical-environments">ámbito léxico</a></font></font></h3>
-
-<p>Debido al alcance léxico, el identificador <code>num</code> dentro de la expresión (<code>num + 55</code>) se evalúa como <code>num</code> del bloque <code>if</code>, y no como la variable <code>num</code> con el valor 33 que esta por encima</p>
-
-<p>En esa misma línea, el <code>num </code>del bloque <code>if</code> ya se ha creado en el ámbito léxico, pero aún no ha alcanzado (y <strong>terminado</strong>) su inicialización (que es parte de la propia declaración): todavía está en la zona muerta temporal.</p>
-
-<pre class="notranslate"><code>function prueba(){
-   var num = 33;
-   if (true) {
-      let num = (num + 55);</code>//ReferenceError: no se puede acceder a la declaración léxica `num'antes de la inicialización <code>
-   }
-}
-prueba();</code>
-</pre>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="let_vs_var"><code>let</code> vs <code>var</code></h3>
-
-<p>Cuando usamos <code>let</code> dentro de un bloque, podemos limitar el alcance de la variable a dicho bloque. Notemos la diferencia con <code>var</code>, cuyo alcance reside dentro de la función donde ha sido declarada la variable.</p>
-
-<pre class="brush: js notranslate">var a = 5;
-var b = 10;
-
-if (a === 5) {
-  let a = 4; // El alcance es dentro del bloque if
-  var b = 1; // El alcance es global
-
-  console.log(a);  // 4
-  console.log(b);  // 1
-}
-
-console.log(a); // 5
-console.log(b); // 1</pre>
-
-<h3 id="let_en_bucles"><code>let</code> en bucles</h3>
-
-<p>Es posible usar la palabra reservada <code>let</code> para enlazar variables con alcance local dentro del alcance de un bucle en lugar de usar una variable global (definida usando <code>var</code>) para dicho propósito.</p>
-
-<pre class="brush: js notranslate">for (let i = 0; i&lt;10; i++) {
-  console.log(i); // 0, 1, 2, 3, 4 ... 9
-}
-
-console.log(i); // ReferenceError: i is not defined
-</pre>
-
-<h2 id="Extensiones_let_no-estandar">Extensiones <code>let</code> no-estandar</h2>
-
-<h3 id="Bloques_let">Bloques<code> let</code></h3>
-
-<div class="warning">
-<p>La <strong>sintaxis del bloque y expresion</strong> <code>let</code> es no-estandar y sera deshechado en un futuro. ¡No deben ser usados! ver <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1023609" rel="noopener" title="FIXED: Remove SpiderMonkey support for let expressions">error 1023609</a> y <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1167029" rel="noopener" title="FIXED: Remove SpiderMonkey support for let blocks">error 1167029</a> para mas detalles.</p>
-</div>
-
-<p>Un <strong>bloque <code>let</code></strong> provee una manera de asociar valores con variables dentro del alcance de un bloque sin afectar el valor de variables con nombre similar fuera del bloque.</p>
-
-<h4 id="Sintaxis_2">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate">let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) {declaración};</pre>
-
-<h4 id="Descripción_2">Descripción</h4>
-
-<p>El bloque <code>let</code> provee alcance local para las variables. Funciona enlazando cero o más variables en el alcance léxico de un solo bloque de código; de otra manera, es exactamente lo mismo que una declaración de bloque. Hay que notar particularmente que el alcance de una variable declarada dentro de un bloque <code>let</code> usando var es equivalente a declarar esa variable fuera del bloque <code>let</code>; dicha variable aún tiene alcance dentro de la función. Al usar la sintaxis de bloque <code>let</code>, los paréntesis siguientes a <code>let</code> son requeridos. Una falla al incluir dichos paréntesis resultará en un error de sintaxis.</p>
-
-<h4 id="Ejemplo">Ejemplo</h4>
-
-<pre class="brush:js notranslate">var x = 5;
-var y = 0;
-
-let (x = x+10, y = 12) {
-  console.log(x+y); // 27
-}
-
-console.log(x + y); // 5
-</pre>
-
-<p>Las reglas para el bloque de código son las mismas que para cualquier otro bloque de código en JavaScript. Es posible tener sus propias variables locales usando declaraciones <code>let</code> en dicho bloque.</p>
-
-<h4 id="Reglas_de_alcance_2">Reglas de alcance</h4>
-
-<p>El alcance de las variables definidas usando <code>let</code> es el mismo bloque <code>let</code>, así como cualquier bloque interno contenido dentro de el bloque, a menos que esos bloques internos definan variables con el mismo nombre.</p>
-
-<h3 id="expresiones_let">expresiones <code>let</code></h3>
-
-<div class="warning">
-<p><code>Soporte de <strong>expresiones</strong> let</code> ha sido removido en Gecko 41 ({{bug(1023609)}}).</p>
-</div>
-
-<p>Una <strong>expresion <code>let</code></strong> permite establecer variables con alcance dentro de una expresión.</p>
-
-<h4 id="Sintaxis_3">Sintaxis</h4>
-
-<pre class="syntaxbox notranslate">let (var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]]) expression;</pre>
-
-<h4 id="Ejemplo_2">Ejemplo</h4>
-
-<p>Podemos usar <code>let</code> para establecer variables que tienen como alcance solo una expresión:</p>
-
-<pre class="brush: js notranslate">var a = 5;
-let(a = 6) console.log(a); // 6
-console.log(a); // 5</pre>
-
-<h4 id="Reglas_de_alcance_3">Reglas de alcance</h4>
-
-<p>Dada la expresión <code>let</code> siguiente:</p>
-
-<pre class="eval notranslate">let (<var>decls</var>) <var>expr</var>
-</pre>
-
-<p>Existe un bloque implícito creado alrededor de expr.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES2015', '#sec-let-and-const-declarations', 'Let and Const Declarations')}}</td>
-   <td>{{Spec2('ES2015')}}</td>
-   <td>Definición initial. No especifica expresiones ni declaraciones let.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<h2 id="CompatibilityTable"><span style="font-size: 14px; font-weight: normal; line-height: 1.5;">{{CompatibilityTable}}</span></h2>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>
-    <p class="p1">{{CompatChrome(41.0)}}</p>
-   </td>
-   <td>{{ CompatGeckoDesktop("1.8.1") }} [1]</td>
-   <td>11</td>
-   <td>17</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Zona muerta temporal</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{ CompatGeckoDesktop("35") }} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Expresión<code> let</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoDesktop("1.8.1") }}-{{ CompatGeckoDesktop("40") }} [1]</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Bloque<code> let</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoDesktop("1.8.1") }} [1]</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Android</th>
-   <th>Chrome para Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown}}</td>
-   <td>
-    <p class="p1">{{CompatChrome(41.0)}}</p>
-   </td>
-   <td>{{ CompatGeckoMobile("1.8.1") }} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Zona muerta temporal</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{ CompatGeckoMobile("35") }} [1]</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>Expresión<code> let</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("1.8.1") }}-{{ CompatGeckoMobile("40") }}[1]</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
-  <tr>
-   <td>Bloque<code> let</code> {{non-standard_inline}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{ CompatGeckoMobile("1.8.1") }} [1]</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Notas_específicas_a_Firefox">Notas específicas a Firefox</h3>
-
-<ul>
- <li>[1]: Solo disponible para bloques de codigo HTML dentro de una etiqueta <code>&lt;script&gt; type="application/javascript;version=1.7"&gt;</code> (o de una versión mayor). Es necesario tomar en cuenta que esta es una característica no estándar, esto puede crear conflictos con otros navegadores. Las etiquetas <a href="https://developer.mozilla.org/en-US/docs/XUL">XUL</a> tienen acceso a esas características sin necesidad de dicho bloque. Ver<span style="line-height: 1.5;">{{bug(932513)}}.</span></li>
- <li>Conformidad con ES2015 para <code>let</code> en SpIderMonkey es monitoreado en {{bug(950547)}} y extensiones no-standar seran eliminadas en el futuro {{bug(1023609)}}.</li>
-</ul>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/var"><code>var</code></a></li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/const"><code>const</code></a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/return/index.html b/files/es/web/javascript/referencia/sentencias/return/index.html
deleted file mode 100644
index 6497e97632..0000000000
--- a/files/es/web/javascript/referencia/sentencias/return/index.html
+++ /dev/null
@@ -1,73 +0,0 @@
----
-title: return
-slug: Web/JavaScript/Referencia/Sentencias/return
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/return
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p><span id="result_box" lang="es"><span>La</span> <span>sentencia <code>return</code></span> <span class="alt-edited">finaliza la</span> <span>ejecución de la función</span> <span>y especifica</span> <span>un valor</span> <span>para ser devuelto</span> <span class="alt-edited">a quien llama a la</span> <span>función.</span></span></p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">return [[ <em>expresion</em> ]];</pre>
-
-<dl>
- <dt><span class="short_text" id="result_box" lang="es"><span>expresion</span></span></dt>
- <dd>La expresión a retornar. Si se omite, <code>undefined</code> es retornado en su lugar.</dd>
-</dl>
-
-<h2 id="Description">Description</h2>
-
-<p>Cuando una instrucción de retorno se llama en una función, se detiene la ejecución de esta. Si se especifica un valor dado, este se devuelve a quien llama a la función. Si se omite la expresión, <code>undefined</code> se devuelve en su lugar. Todas las siguientes sentencias de retorno rompen la ejecución de la función:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">return</span><span class="punctuation token">;</span>
-<span class="keyword token">return</span> <span class="keyword token">true</span><span class="punctuation token">;</span>
-<span class="keyword token">return</span> <span class="keyword token">false</span><span class="punctuation token">;</span>
-<span class="keyword token">return</span> x<span class="punctuation token">;</span>
-<span class="keyword token">return</span> x <span class="operator token">+</span> y <span class="operator token">/</span> <span class="number token">3</span><span class="punctuation token">;</span></code></pre>
-
-<h2 id="Sintaxis" name="Sintaxis"><br>
- La inserción automática Punto y coma</h2>
-
-<p>La instrucción de retorno se ve afectada por la inserción automática de punto y coma (ASI). No se permite el terminador de línea entre la palabra clave de retorno y la expresión.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">return</span>
-a <span class="operator token">+</span> b<span class="punctuation token">;</span></code></pre>
-
-<dl>
-</dl>
-
-<p><br>
- se transforma por ASI en:</p>
-
-<pre class="line-numbers  language-html"><code class="language-html">return;
-a + b;</code></pre>
-
-<p><br>
- La consola le advertirá "código inalcanzable después de la declaración de retorno".</p>
-
-<div class="note">
-<p>A partir de Gecko 40 {{geckoRelease(40)}}, una advertencia es mostrada en la consola si se encuentra código inalcanzable despues de una instrucción return.</p>
-</div>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Usando_return" name="Ejemplo:_Usando_return">Ejemplo: Usando <code>return</code></h3>
-
-<p>La siguiente función devuelve el cuadrado de su argumento, <code>x</code>, donde <code>x</code> es un número.</p>
-
-<pre class="brush: js">function cuadrado(x) {
-   return x * x;
-}
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li><a href="/es/docs/Web/JavaScript/Referencia/Funciones">Funciones</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/switch/index.html b/files/es/web/javascript/referencia/sentencias/switch/index.html
deleted file mode 100644
index c550477f2c..0000000000
--- a/files/es/web/javascript/referencia/sentencias/switch/index.html
+++ /dev/null
@@ -1,245 +0,0 @@
----
-title: switch
-slug: Web/JavaScript/Referencia/Sentencias/switch
-translation_of: Web/JavaScript/Reference/Statements/switch
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La <strong>declaración</strong> <code><strong>switch</strong></code> evalúa una <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Expressions_and_Operators">expresión</a>, comparando el valor de esa expresión con una instancia <code><strong>case</strong></code>, y ejecuta <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias">declaraciones</a> asociadas a ese <code>case</code>, así como las declaraciones en los <code>case</code> que siguen.</p>
-
-<h2 id="Syntaxis">Syntaxis</h2>
-
-<pre class="syntaxbox notranslate">switch (expresión) {
-  case valor1:
-    //Declaraciones ejecutadas cuando el resultado de expresión coincide con el valor1
-    [break;]
-  case valor2:
-    //Declaraciones ejecutadas cuando el resultado de expresión coincide con el valor2
-    [break;]
-  ...
-  case valorN:
-    //Declaraciones ejecutadas cuando el resultado de expresión coincide con valorN
-    [break;]
-  default:
-    //Declaraciones ejecutadas cuando ninguno de los valores coincide con el valor de la expresión
-    [break;]
-}</pre>
-
-<dl>
- <dt><code>expresión</code></dt>
- <dd>Es una expresión que es comparada con el valor de cada instancia <code>case</code>.</dd>
- <dt><code>case valorN</code></dt>
- <dd>Una instancia <code>case valorN</code> es usada para ser comparada con la <code>expresión</code>. Si la <code>expresión</code> coincide con el <code>valorN</code>, las declaraciones dentro de la instancia <code>case</code> se ejecutan hasta que se encuentre el final de la declaración <code>switch</code> o hasta encontrar una interrupción <code>break</code>.</dd>
-</dl>
-
-<dl>
- <dt><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);">default</span></font></dt>
- <dd>Una instancia <code>default</code>, cuando es declarada, es ejecutada si el valor de la <code>expresión</code> no coincide con cualquiera de las otras instancias <code>case valorN</code>.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>Si ocurre una coincidencia, el programa ejecuta las declaraciones asociadas correspondientes. Si la expresión coincide con múltiples entradas, la primera será la seleccionada, incluso si las mayúsculas son tenidas en cuenta.</p>
-
-<p>El programa primero busca la primer instacia <code>case</code> cuya expresión se evalúa con el mismo valor de la expresión de entrada (usando <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">comparación estricta</a>, <code>===)</code> y luego transfiere el control a esa cláusula, ejecutando las declaraciones asociadas. Si no se encuentra una cláusula de <code>case</code> coincidente, el programa busca la cláusula <code>default</code> opcional, y si se encuentra, transfiere el control a esa instancia, ejecutando las declaraciones asociadas. Si no se encuentra una instancia <code>default</code>  el programa continúa la ejecución en la instrucción siguiente al final del <code>switch</code>. Por convención, la instancia <code>default</code> es la última cláusula, pero no tiene que ser así.</p>
-
-<p>La declaración <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/break" title="JavaScript/Reference/Statements/break">break</a></code> es opcional y está asociada con cada etiqueta de <code>case</code> y asegura que el programa salga del <code>switch</code> una vez que se ejecute la instrucción coincidente y continúe la ejecución en la instrucción siguiente. Si se omite el  <code>break</code>  el programa continúa la ejecución en la siguiente instrucción en la declaración de <code>switch</code> .</p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usando_switch">Usando <code>switch</code></h3>
-
-<p>En el siguiente ejemplo, si <code>expresión</code> se resuelve a "Platanos", el algoritmo compara el valor con el <code>case</code> "Platanos" y ejecuta la declaración asociada. Cuando se encuentra un <code>break</code>, el programa sale del condicional <code>switch</code> y ejecuta la declaración que lo procede. Si se omite el <code>break</code>, el <code>case</code> "Cerezas" también es ejecutado.</p>
-
-<pre class="notranslate"><code>switch (expr) {
-  case 'Naranjas':
-    console.log('El kilogramo de naranjas cuesta $0.59.');
-    break;
-  case 'Manzanas':
-    console.log('El kilogramo de manzanas cuesta $0.32.');
-    break;
-  case 'Platanos':
-    console.log('El kilogramo de platanos cuesta $0.48.');
-    break;
-  case 'Cerezas':
-    console.log('El kilogramo de cerezas cuesta $3.00.');
-    break;
-  case 'Mangos':
-  case 'Papayas':
-    console.log('El kilogramo de mangos y papayas cuesta $2.79.');
-    break;
-  default:
-    console.log('Lo lamentamos, por el momento no disponemos de ' + expr + '.');
-}
-
-console.log("¿Hay algo más que te quisiera consultar?");</code></pre>
-
-<h3 id="¿Qué_pasa_si_olvido_un_break">¿Qué pasa si olvido un break?</h3>
-
-<p>Si olvidas un <code>break</code>, el script se ejecutará desde donde se cumple la condición y ejecutará el siguiente <code>case</code> independientemente si esta condición se cumple o no. Ver el siguiente ejemplo:</p>
-
-<pre class="brush: js notranslate">var foo = 0;
-switch (foo) {
-  case -1:
-    console.log('1 negativo');
-    break;
-  case 0: // foo es 0, por lo tanto se cumple la condición y se ejecutara el siguiente bloque
-    console.log(0)
-    // NOTA: el "break" olvidado debería estar aquí
-  case 1: // No hay sentencia "break" en el 'case 0:', por lo tanto este caso también será ejecutado
-    console.log(1);
-    break; // Al encontrar un "break", no será ejecutado el 'case 2:'
-  case 2:
-    console.log(2);
-    break;
-  default:
-    console.log('default');
-}
-</pre>
-
-<h3 id="¿Puedo_usar_un_&lt;default>_entre_condiciones">¿Puedo usar un &lt;default&gt; entre condiciones?</h3>
-
-<p>Sí, ¡es posible! JavaScript retornará a la instancia <code>default</code> en caso de no encontrar una coincidencia:</p>
-
-<pre class="notranslate"><code>var foo = 5;
-switch (foo) {
-  case 2:
-    console.log(2);
-    break; // al encontrar este 'break' no se continuará con el siguiente 'default:'
-  default:
-    console.log('default')
-    // fall-through
-  case 1:
-    console.log('1');
-}</code></pre>
-
-<p>Al estar el <code>case 1:</code> a continuación de <code>default</code>, y al no haber un <code>break </code>de por medio, veremos que la declaración del <code>case 1:</code> será ejecutada, apareciendo el resultado <code>1</code> en el <em>log de consola.</em></p>
-
-<h3 id="Metodos_para_casos_con_múltiple_criterio">Metodos para casos con múltiple criterio</h3>
-
-<p>La fuente de esta técnica esta aquí:</p>
-
-<p><a href="http://stackoverflow.com/questions/13207927/switch-statement-multiple-cases-in-javascript">Switch statement multiple cases in JavaScript (Stack Overflow)</a></p>
-
-<h4 id="Operación_única_con_múltiples_casos">Operación única con múltiples casos</h4>
-
-<p>Este método toma ventaja del hecho de que, si no hay un <code>break</code> debajo de una declaración <code>case</code>, continuará la ejecución hasta el siguiente <code>case</code>, ignorando si en dicho caso se cumple o no el criterio indicado. Comprobar en la sección <em>¿Qué pasa si olvido un <code>break</code>?</em></p>
-
-<p>Este es un ejemplo de operación única con sentencia <code>switch</code> secuencial, donde cuatro valores diferentes se comportan exactamente de la misma manera:</p>
-
-<pre class="brush: js notranslate">var Animal = 'Jirafa';
-switch (Animal) {
-  case 'Vaca':
-  case 'Jirafa':
-  case 'Perro':
-  case 'Cerdo':
-    console.log('Este animal subirá al Arca de Noé.');
-    break;
-  case 'Dinosaurio':
-  default:
-    console.log('Este animal no lo hará.');
-}</pre>
-
-<h4 id="Operaciones_encadenadas_con_múltiples_casos">Operaciones encadenadas con múltiples casos</h4>
-
-<p>Este es un ejemplo de una sentencia <code>switch</code> secuencial con múltiples operaciones, donde, dependiendo del valor entero dado, se pueden recibir diferentes resultados. Esto demuestra que el algoritmo correrá en el orden en que se coloquen las declaraciones <code>case</code>, y que no tiene que ser numéricamente secuencial. En JavaScript, también es posible combinar definiciones con valores <em><code>"string"</code> </em>dentro de estas declaraciones <code>case</code>.</p>
-
-<pre class="brush: js notranslate">var foo = 1;
-var output = 'Salida: ';
-switch (foo) {
-  case 10:
-    output += '¿Y ';
-  case 1:
-    output += 'Cuál ';
-    output += 'Es ';
-  case 2:
-    output += 'Tu ';
-  case 3:
-    output += 'Nombre';
-  case 4:
-    output += '?';
-    console.log(output);
-    break;
-  case 5:
-    output += '!';
-    console.log(output);
-    break;
-  default:
-    console.log('Por favor, selecciona un valor del 1 al 6.');
-}</pre>
-
-<p>La salida (output) de este ejemplo:</p>
-
-<table class="standard-table" style="height: 270px; width: 522px;">
- <tbody>
-  <tr>
-   <th scope="col">Value</th>
-   <th scope="col">Log text</th>
-  </tr>
-  <tr>
-   <td>foo es NaN o no es 1, 2, 3, 4, 5 ni 10</td>
-   <td>Por favor, selecciona un valor del 1 al 6.</td>
-  </tr>
-  <tr>
-   <td>10</td>
-   <td>Salida: ¿Y Cuál Es Tu Nombre?</td>
-  </tr>
-  <tr>
-   <td>1</td>
-   <td>Salida: Cuál Es Tu Nombre?</td>
-  </tr>
-  <tr>
-   <td>2</td>
-   <td>Salida: Tu Nombre?</td>
-  </tr>
-  <tr>
-   <td>3</td>
-   <td>Salida: Nombre?</td>
-  </tr>
-  <tr>
-   <td>4</td>
-   <td>Salida: ?</td>
-  </tr>
-  <tr>
-   <td>5</td>
-   <td>Salida: !</td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="Variables_centradas_en_bloques_sin_un_estamento_de_switch">Variables centradas en bloques sin un estamento de switch</h3>
-
-<p>Con ECMAScript 2015 (ES6) </p>
-
-<h2 id="Compatibilidad_en_Navegadores">Compatibilidad en Navegadores</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/if...else"><code>if...else</code></a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/throw/index.html b/files/es/web/javascript/referencia/sentencias/throw/index.html
deleted file mode 100644
index d3e52f83ac..0000000000
--- a/files/es/web/javascript/referencia/sentencias/throw/index.html
+++ /dev/null
@@ -1,153 +0,0 @@
----
-title: throw
-slug: Web/JavaScript/Referencia/Sentencias/throw
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/throw
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Lanza una excepcion definida por el usuario.</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">throw <em>expresion</em>;</pre>
-
-<dl>
- <dt><code>expresion</code></dt>
- <dd>Expresión a lanzar.</dd>
-</dl>
-
-<h2 id="Descripci.C3.B3n" name="Descripci.C3.B3n">Descripción</h2>
-
-<p>Utilice la sentencia <code>throw</code> para lanzar una excepción. Cuando lanza una excepción, <code>expresion</code> especifica el valor de la excepción. Cada uno de los siguientes ejemplos lanza una excepción:</p>
-
-<pre class="brush: js">throw "Error2"; // genera una excepción con un valor cadena
-throw 42; // genera una excepción con un valor 42
-throw true; // genera una excepción con un valor true</pre>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="Ejemplo:_Lanzar_un_objeto" name="Ejemplo:_Lanzar_un_objeto">Ejemplo: Lanzar un objeto</h3>
-
-<p>Puede especificar un objeto cuando lanza una excepción. Puede entonces referenciar las propiedades del objeto en el bloque <code>catch</code>. El siguiente ejemplo crea un objeto <code>miExcepcionUsuario</code> del tipo <code>ExceptionUsuario</code> y la utiliza usándola en una sentencia <code>throw</code>.</p>
-
-<pre class="brush: js">function ExceptionUsuario(mensaje) {
-   this.mensaje = mensaje;
-   this.nombre = "ExceptionUsuario";
-}
-
-function getNombreMes(mes) {
-   mes = mes - 1; // Ajustar el número de mes al índice del arreglo (1 = Ene, 12 = Dic)
-   var meses = new Array("Ene", "Feb", "Mar", "Abr", "May", "Jun", "Jul",
-      "Ago", "Sep", "Oct", "Nov", "Dic");
-   if (meses[mes] != null) {
-      return meses[mes];
-   } else {
-      miExcepcionUsuario = new ExceptionUsuario("NumeroMesNoValido");
-      throw miExcepcionUsuario;
-   }
-}
-
-try {
-   // sentencias para try
-   nombreMes = getNombreMes(miMes);
-} catch (excepcion) {
-   nombreMes = "desconocido";
-   registrarMisErrores(excepcion.mensaje, excepcion.nombre); // pasa el objeto exception al manejador de errores
-}
-</pre>
-
-<h3 id="Ejemplo:_Otro_ejemplo_sobre_lanzar_un_objeto" name="Ejemplo:_Otro_ejemplo_sobre_lanzar_un_objeto">Ejemplo: Otro ejemplo sobre lanzar un objeto</h3>
-
-<p>El siguiente ejemplo comprueba una cadena de entrada para un código postal de EE.UU. Si el código postal utiliza un formato no válido, la sentencia throw lanza una excepción creando un objeto de tipo <code>ExcepcionFormatoCodigoPostal</code>.</p>
-
-<pre class="brush: js">/*
- * Creates a ZipCode object.
- *
- * Accepted formats for a zip code are:
- *    12345
- *    12345-6789
- *    123456789
- *    12345 6789
- *
- * If the argument passed to the ZipCode constructor does not
- * conform to one of these patterns, an exception is thrown.
- */
-
-function ZipCode(zip) {
-   zip = new String(zip);
-   pattern = /[0-9]{5}([- ]?[0-9]{4})?/;
-   if (pattern.test(zip)) {
-      // zip code value will be the first match in the string
-      this.value = zip.match(pattern)[0];
-      this.valueOf = function() {
-         return this.value
-      };
-      this.toString = function() {
-         return String(this.value)
-      };
-   } else {
-      throw new ExcepcionFormatoCodigoPostal(zip);
-   }
-}
-
-function ExcepcionFormatoCodigoPostal(valor) {
-   this.valor = valor;
-   this.mensaje = "no conforme con el formato esperado de código postal";
-   this.toString = function() {
-      return this.valor + this.mensaje
-   };
-}
-
-/*
- * Esto podría estar en un script que valida los datos de una dirección de EE.UU.
- */
-
-var CODIGOPOSTAL_NOVALIDO = -1;
-var CODIGOPOSTAL_DESCONOCIDO_ERROR = -2;
-
-function verificarCodigoPostal(codigo) {
-   try {
-      codigo = new CodigoPostal(codigo);
-   } catch (excepcion) {
-      if (excepcion instanceof ExcepcionFormatoCodigoPostal) {
-         return CODIGOPOSTAL_NOVALIDO;
-      } else {
-         return CODIGOPOSTAL_DESCONOCIDO_ERROR;
-      }
-   }
-   return codigo;
-}
-
-a = verificarCodigoPostal(95060);         // devuelve 95060
-b = verificarCodigoPostal(9560;)          // devuelve -1
-c = verificarCodigoPostal("a");           // devuelve -1
-d = verificarCodigoPostal("95060");       // devuelve 95060
-e = verificarCodigoPostal("95060 1234");  // devuelve 95060 1234
-</pre>
-
-<h3 id="Ejemplo:_Relanzar_una_excepci.C3.B3n" name="Ejemplo:_Relanzar_una_excepci.C3.B3n">Ejemplo: Relanzar una excepción</h3>
-
-<p>Puede usar <code>throw</code> para volver a lanzar una excepción después de cogerla. El siguiente ejemplo coge una excepción con un valor numérico y la vuelve a lanzar si el valor es superior a 50. La excepción relanzada propaga hacia arriba la función adjunta o a un nivel superior para que el usuario pueda verla.</p>
-
-<pre class="eval">try {
-   throw n; // lanza una excepción con un valor numérico
-} catch (excepcion) {
-   if (excepcion &lt;= 50) {
-      // sentencias para manejar la excepción 1-50
-   } else {
-      // no se puede manejar esta excepción, así que se vuelve a lanzar
-      throw excepcion;
-   }
-}
-</pre>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/try...catch", "try...catch")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/try...catch/index.html b/files/es/web/javascript/referencia/sentencias/try...catch/index.html
deleted file mode 100644
index d429db6163..0000000000
--- a/files/es/web/javascript/referencia/sentencias/try...catch/index.html
+++ /dev/null
@@ -1,254 +0,0 @@
----
-title: try...catch
-slug: Web/JavaScript/Referencia/Sentencias/try...catch
-tags:
-  - Error
-  - Excepción
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/try...catch
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La declaración <strong><code>try...catch</code></strong> señala un bloque de instrucciones a intentar (<strong><code>try</code></strong>), y especifica una respuesta si se produce una excepción (<strong><code>catch</code></strong>).</p>
-
-<div>{{EmbedInteractiveExample("pages/js/statement-trycatch.html")}}</div>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">try {
-   <em>try_statements</em>
-}
-[catch (<em>exception_var_1</em> if <em>condition_1</em>) { // non-standard
-   <em>catch_statements_1</em>
-}]
-...
-[catch (<em>exception_var_2</em>) {
-   <em>catch_statements_2</em>
-}]
-[finally {
-   <em>finally_statements</em>
-}]
-</pre>
-
-<dl>
- <dt><code>try_statements</code></dt>
- <dd>Las sentencias que serán ejecutadas.</dd>
-</dl>
-
-<dl>
- <dt><code>catch_statements_1</code>, <code>catch_statements_2</code></dt>
- <dd>Sentencias que se ejecutan si una excepción es lanzada en el bloque <code>try</code>.</dd>
-</dl>
-
-<dl>
- <dt><code>exception_var_1</code>, <code>exception_var_2</code></dt>
- <dd>Identificador que contiene un objeto de excepcion asociado a la cláusula <code>catch</code>.</dd>
-</dl>
-
-<dl>
- <dt><code>condition_1</code></dt>
- <dd>Una expresión condicional.</dd>
-</dl>
-
-<dl>
- <dt><code>finally_statements</code></dt>
- <dd>Sentencias que se ejecutan después de que se completa la declaración <code>try</code> . Estas sentencias se ejecutan independientemente de si una excepcion fue lanzada o capturada.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>La sentencia <code>try</code> consiste en un bloque <code>try</code> que contiene una o más sentencias. Las llaves <code>{}</code> se deben utilizar siempre<code>,</code> incluso para una bloques de una sola sentencia. Al menos un bloque <code>catch</code> o un bloque <code>finally</code> debe estar presente. Esto nos da tres formas posibles para la sentencia <code>try</code>:</p>
-
-<ol>
- <li><code>try...catch</code></li>
- <li><code>try...finally</code></li>
- <li><code>try...catch...finally</code></li>
-</ol>
-
-<p>Un bloque <code>catch</code> contiene sentencias que especifican que hacer si una excepción es lanzada en el bloque <code>try</code>. Si cualquier sentencia dentro del bloque <code>try</code> (o en una funcion llamada desde dentro del bloque <code>try</code>) lanza una excepción, el control cambia inmediatamente al bloque <code>catch</code> . Si no se lanza ninguna excepcion en el bloque <code>try</code>, el bloque <code>catch</code> se omite.</p>
-
-<p>La bloque <code>finally</code> se ejecuta despues del bloque <code>try</code> y el/los bloque(s) <code>catch</code> hayan finalizado su ejecución. Éste bloque siempre se ejecuta, independientemente de si una excepción fue lanzada o capturada.</p>
-
-<p>Puede anidar una o más sentencias <code>try</code>. Si una sentencia <code>try</code> interna no tiene una bloque <code>catch</code>, se ejecuta el bloque <code>catch</code> de la sentencia <code>try</code> que la encierra.</p>
-
-<p>Usted también puede usar la declaración <code>try</code> para manejar excepciones de JavaScript. Consulte la <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide">Guía de JavaScript</a> para obtener mayor información sobre excepciones de JavaScript.<br>
-  </p>
-
-<h3 id="Bloque_catch_incondicional">Bloque catch incondicional</h3>
-
-<p>Cuando solo se utiliza un bloque <code>catch</code>, el bloque <code>catch</code> es ejecutado cuando cualquier excepción es lanzada. Por ejemplo, cuando la excepción ocurre en el siguiente código, el control se transfiere a la cláusula <code>catch</code>.</p>
-
-<pre class="brush: js">try {
-   throw "myException"; // genera una excepción
-}
-catch (e) {
-   // sentencias para manejar cualquier excepción
-   logMyErrors(e); // pasa el objeto de la excepción al manejador de errores
-}
-</pre>
-
-<p>El bloque <code>catch</code> especifíca un identificador ( <code>e</code> en el ejemplo anterior) que contiene el valor de la excepción. Este valor está solo disponible en el {{Glossary("Scope", "scope")}} de el bloque<code> catch</code></p>
-
-<h3 id="Bloques_catch_condicionales">Bloques catch condicionales</h3>
-
-<p>Tambien se pueden crear "bloques <code>catch</code> condicionales", combinando bloques <code>try...catch</code> con estructuras  <code>if...else if...else</code> como estas:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
-    <span class="function token">myroutine</span><span class="punctuation token">();<code class="language-js"><span class="comment token">  </span></code></span><span class="comment token">// puede lanzar tres tipos de excepciones</span><span class="punctuation token"><code class="language-js">
-</code>}</span> <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">e</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    <span class="keyword token">if</span> <span class="punctuation token">(</span>e <span class="keyword token">instanceof</span> <span class="class-name token">TypeError</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="comment token">// sentencias para manejar excepciones TypeError</span>
-    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>e <span class="keyword token">instanceof</span> <span class="class-name token">RangeError</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="comment token">// sentencias para manejar excepciones RangeError</span>
-    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="keyword token">if</span> <span class="punctuation token">(</span>e <span class="keyword token">instanceof</span> <span class="class-name token">EvalError</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-        <span class="comment token">// sentencias para manejar excepciones EvalError</span>
-    <span class="punctuation token">}</span> <span class="keyword token">else</span> <span class="punctuation token">{</span>
-       <span class="comment token">// sentencias para manejar cualquier excepción no especificada</span>
-       <span class="function token">logMyErrors</span><span class="punctuation token">(</span>e<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// </span><span class="punctuation token">pasa el objeto de la excepción al manejador de errores</span>
-<span class="punctuation token">}</span></code></pre>
-
-<h3 id="The_exception_identifier" name="The_exception_identifier">El identificador de excepciones</h3>
-
-<p>Cuando una excepción es lanzada en el bloque <code>try</code>, <code><em>exception_var</em></code> (por ejemplo, la <code>e</code> en <code>catch (e)</code>) guarda el valor de la excepción. Se puede usar éste identificador para obtener información acerca de la excepción que fue lanzada. Este valor está solo disponible en el {{Glossary("Scope", "scope")}} de el bloque<code> catch.</code></p>
-
-<pre class="brush: js">function isValidJSON(text) {
-  try {
-    JSON.parse(text);
-    return true;
-  } catch {
-    return false;
-  }
-}</pre>
-
-<h3 id="The_finally_clause" name="The_finally_clause">La cláusula <code>finally</code></h3>
-
-<p>La cláusula <code>finally</code> contiene sentencias a ejecutarse después de que las cláusulas <code>try</code> y <code>catch</code> se ejecuten, pero antes de las sentencias que le siguen al bloque <code>try..catch..finally</code>. Note que la cláusula <code>finally</code> se ejecuta sin importar si una excepción es o no lanzada. Si una excepción es lanzada, las instrucciones en la cláusula <code>finally</code> se ejecutan incluso si ninguna cláusula <code>catch</code> maneja la excepción.</p>
-
-<p>Usted puede usar la cláusula finally para hacer que su script falle plácidamente cuando una excepción ocurra; por ejemplo, para hacer una limpieza general, usted puede necesitar liberar un recurso que su script haya retenido.</p>
-
-<p>Puede parecer extraño tener una cláusula relacionada a una excepción que se ejecuta sin importar si hay una excepción o no, pero esta concepción en realidad sirve a un propósito. El punto importante no es que la cláusula <code>finally</code> siempre se ejecuta, si no más bien que el codigo ordinario que le sigue a <code>try..catch</code> no.</p>
-
-<p>Por ejemplo, si otra excepción ocurre dentro de un bloque <code>catch</code> de una declaración <code>try</code>, cualquier codigo restante en el mismo bloque exterior <code>try</code> que encierra ese <code>try..catch</code> (o en el flujo principal, si no es un bloque <code>try</code> exterior) , no será ejecutado, dado que el control es inmediatamente transferido al bloque <code>catch</code> del <code>try</code> exterior (o el generador de error interno, si no es en un bloque <code>try</code>).</p>
-
-<p>Por lo tanto, cualquier rutina de limpieza hecha en esa sección encerrada (o la principal) antes de que exista, será saltada. Sin embargo, si la declaración <code>try</code> tiene un bloque <code>finally</code>, entonces el código de ese bloque <code>finally</code> será ejecutado primero para permitir tal limpieza, y ENTONCES el bloque <code>catch</code> de la otra declaración <code>try</code> (o el generador de error) tomará el control para manejar la segunda excepción.</p>
-
-<p>Ahora, si esa rutina de limpieza debiera ser hecha ya sea que el código del <code>try..catch</code> tenga éxito o no, entonces si el bloque <code>finally</code> se ejecutase solo después de una excepción, el mismo código de limpieza tendría que estar presente dentro y fuera del bloque <code>finally</code>, y por lo tanto no hay razón para no tener el bloque <code>finally</code> solo, y dejarlo ejecutarse sin importar si hay excepciones o no.</p>
-
-<p>El siguiente ejemplo abre un archivo y despues ejecuta sentencias que usan el archivo (JavaScript del lado del servidor permite acceder a archivos). Si una excepción es lanzada mientras el archivo está abierto, la cláusula <code>finally</code> cierra el archivo antes de que el script falle. El código en <code>finally</code> también se ejecuta después de un retorno explícito de los bloques <code>try</code> o <code>catch</code>.</p>
-
-<pre class="brush: js">openMyFile()
-try {
-   // retiene un recurso
-   writeMyFile(theData);
-}
-finally {
-   closeMyFile(); // siempre cierra el recurso
-}
-</pre>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<h3 id="The_finally_clause" name="The_finally_clause">Bloques try anidados</h3>
-
-<p>Primero, veamos que pasa con esto:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
-  <span class="keyword token">try</span> <span class="punctuation token">{</span>
-    <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">finally</span> <span class="punctuation token">{</span>
-    console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-<span class="punctuation token">}</span>
-<span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="comment token">// Output:</span>
-<span class="comment token">// "finally"</span>
-<span class="comment token">// "outer" "oops"</span></code></pre>
-
-<p>Ahora, si nosotros ya capturamos la excepción en una declaración try interna agregando un bloque catch.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
-  <span class="keyword token">try</span> <span class="punctuation token">{</span>
-    <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'inner'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">finally</span> <span class="punctuation token">{</span>
-    console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-<span class="punctuation token">}</span>
-<span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="comment token">// Output:</span>
-<span class="comment token">// "inner" "oops"</span>
-<span class="comment token">// "finally"</span></code></pre>
-
-<p>Y ahora vamos a relanzar el error.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">try</span> <span class="punctuation token">{</span>
-  <span class="keyword token">try</span> <span class="punctuation token">{</span>
-    <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'inner'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="keyword token">throw</span> ex<span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">finally</span> <span class="punctuation token">{</span>
-    console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-<span class="punctuation token">}</span>
-<span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="comment token">// Output:</span>
-<span class="comment token">// "inner" "oops"</span>
-<span class="comment token">// "finally"</span>
-<span class="comment token">// "outer" "oops"</span></code></pre>
-
-<p>Cualquier excepción dad será capturada solo una vez por el bloque catch más cercano a menos que sea relanzado. Por supuesto cualquier nueva excepción que se origine en el bloque 'interno' (porque el código en el bloque catch puede hacer algo que lanze un error), será capturado por el bloque 'externo'.</p>
-
-<h3 id="Retornando_de_un_bloque_finally">Retornando de un bloque finally</h3>
-
-<p>Si el bloque <code>finally</code> retorna un valor, este valor se convierte en el valor de retorno de toda la producción <code>try-catch-finally</code>, a pesar de cualquier sentencia <code>return</code> en los bloques <code>try</code> y <code>catch</code>. Esto incluye excepciones lanzadas dentro del bloque catch.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">try</span> <span class="punctuation token">{</span>
-    <span class="keyword token">try</span> <span class="punctuation token">{</span>
-      <span class="keyword token">throw</span> <span class="keyword token">new</span> <span class="class-name token">Error</span><span class="punctuation token">(</span><span class="string token">'oops'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-      console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'inner'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
-      <span class="keyword token">throw</span> ex<span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-    <span class="keyword token">finally</span> <span class="punctuation token">{</span>
-      console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'finally'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-      <span class="keyword token">return</span><span class="punctuation token">;</span>
-    <span class="punctuation token">}</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">catch</span> <span class="punctuation token">(</span><span class="class-name token">ex</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-    console<span class="punctuation token">.</span><span class="function token">error</span><span class="punctuation token">(</span><span class="string token">'outer'</span><span class="punctuation token">,</span> ex<span class="punctuation token">.</span>message<span class="punctuation token">)</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-<span class="comment token">// Output:</span>
-<span class="comment token">// "inner" "oops"</span>
-<span class="comment token">// "finally"</span></code></pre>
-
-<p>El "oops" externo no es lanzado debido al retorno en el bloque finally. Lo mismo aplicaría para cualquier valor retornado del bloque catch.</p>
-
-<p>Vea los ejemplos para {{jsxref("Sentencias/throw", "throw")}}.</p>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea también</h2>
-
-<ul>
- <li>{{jsxref("Error")}}</li>
- <li>{{jsxref("Sentencias/throw", "throw")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/var/index.html b/files/es/web/javascript/referencia/sentencias/var/index.html
deleted file mode 100644
index 006e40a270..0000000000
--- a/files/es/web/javascript/referencia/sentencias/var/index.html
+++ /dev/null
@@ -1,163 +0,0 @@
----
-title: var
-slug: Web/JavaScript/Referencia/Sentencias/var
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/var
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<h2 id="Summary" name="Summary">Resumen</h2>
-
-<p>La sentencia <strong><code>var</code></strong> declara una variable, opcionalmente inicializándola con un valor.</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox"><code><strong>var</strong> <em>nombreDeVariable1 [= valor1] [, nombreDeVariable2 [= valor2] ... [, nombreDeVariableN [=valorN]]]; </em></code></pre>
-
-<dl>
- <dt><code>nombreDeVariableN</code></dt>
- <dd>Representa el nombre que el programador da a la variable. Puede ser cualquier identificador legal.</dd>
-</dl>
-
-<dl>
- <dt><code>valorN</code></dt>
- <dd>Valor inicial de la variable. Puede ser cualquier expresión legal. El valor predeterminado es <em>undefined</em> (en español, <em>indefinida</em>).</dd>
-</dl>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Las  declaraciones de variables, donde sea que ocurran, son procesadas antes de que cualquier otro código sea ejecutado. El ámbito de una variable declarada con la palabra reservada <strong><code>var</code></strong> es su <em>contexto de ejecución</em> en curso<em>,</em> que puede ser la función que la contiene o, para las variables declaradas afuera de cualquier función, un ámbito global. Si re-declaras una variable Javascript, esta no perderá su valor.</p>
-
-<p>Asignar un valor a una variable no declarada implica crearla como variable global (se convierte en una propiedad del objeto global) cuando la asignación es ejecutada. Las diferencias entre una variable declarada y otra sin declarar son:</p>
-
-<p>1. Las variables declaradas se limitan al contexto de ejecución en el cual son declaradas. Las variables no declaradas siempre son globales.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">x</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  y <span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span>   <span class="comment token">// Lanza un error de tipo "ReferenceError" en modo estricto ('use strict')</span>
-  <span class="keyword token">var</span> z <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="function token">x</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime "1" </span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>z<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError": z no está definida afuera de x</span></code></pre>
-
-<p>2. Las variables declaradas son creadas antes de ejecutar cualquier otro código. Las variables sin declarar no existen hasta que el código que las asigna es ejecutado.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>a<span class="punctuation token">)</span><span class="punctuation token">;</span>                <span class="comment token">// Lanza un error de tipo "ReferenceError".</span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'trabajando...'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Nunca se ejecuta.</span></code></pre>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a<span class="punctuation token">;</span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>a<span class="punctuation token">)</span><span class="punctuation token">;</span>                <span class="comment token">// Imprime "undefined" o "" dependiendo del navegador.</span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'trabajando...'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime "</span><span class="string token">trabajando</span><span class="comment token">...".</span></code></pre>
-
-<p>3. Las variables declaradas son una propiedad no-configurable de su contexto de ejecución (de función o global). Las variables sin declarar son configurables (p. ej. pueden borrarse).</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span>
-b <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>
-
-<span class="keyword token">delete</span> <span class="keyword token">this</span><span class="punctuation token">.</span>a<span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError" en modo estricto ('use strict'), de lo contrario falla silenciosamente.</span>
-<span class="keyword token">delete</span> <span class="keyword token">this</span><span class="punctuation token">.</span>b<span class="punctuation token">;</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>a<span class="punctuation token">,</span> b<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError". </span>
-<span class="comment token">// La propiedad 'b' se eliminó y ya no existe.</span></code></pre>
-
-<p>Debido a esas tres diferencias, fallar al declarar variables muy probablemente llevará a resultados inesperados. Por tanto <strong>se recomienda siempre declarar las variables, sin importar si están en una función o un ámbito global</strong>. Y en el modo estricto (<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">strict mode</a>) de ECMAScript 5, asignar valor a una variable sin declarar lanzará un error.</p>
-
-<h3 id="Elevación_de_variables">Elevación de variables</h3>
-
-<p>Como la declaración de variables (y todas las declaraciones en general) se procesa antes de ejecutar cualquier código, declarar una variable en cualquier parte del código es equivalente a declararla al inicio del mismo. Esto también significa que una variable puede parecer usarse antes de ser declarada. Este comportamiento es llamado <em>hoisting </em>(del inglés "elevación"), ya que la declaración de una variable parecer haber sido movida a la cima de la función o código global.</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js">bla <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> bla<span class="punctuation token">;</span>
-<span class="comment token">// ...</span>
-
-<span class="comment token">// Es entendido implicitamente como:</span>
-
-<span class="keyword token">var</span> bla<span class="punctuation token">;</span>
-bla <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span></code></pre>
-
-<p>Por esa razón, se recomienda siempre declarar variables al inicio de su ámbito (la cima del código global y la cima del código de función) para que sea claro cuáles variables pertenecen al ámbito de función (local) y cuáles son resueltas en la cadena de ámbito.</p>
-
-<p>Es importante señalar que <strong>la elevación afectará la declaración</strong> de variables, pero <strong>no su inicialización</strong>. El valor será asignado precisamente cuando la sentencia de asignación sea alcanzada:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">function</span> <span class="function token">haz_algo</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// undefined (valor indefinido)</span>
-  <span class="keyword token">var</span> bar <span class="operator token">=</span> <span class="number token">111</span><span class="punctuation token">;</span>
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 111</span>
-<span class="punctuation token">}</span>
-
-<span class="comment token">// Se entiende implícitamente como: </span>
-<span class="keyword token">function</span> <span class="function token">haz_algo</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">var</span> bar<span class="punctuation token">;</span>
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// undefined (valor indefinido)</span>
-  bar <span class="operator token">=</span> <span class="number token">111</span><span class="punctuation token">;</span>
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>bar<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 111</span>
-<span class="punctuation token">}</span></code></pre>
-
-<p> </p>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Declarando_e_inicializando_dos_variables">Declarando e inicializando dos variables</h3>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">,</span> b <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span></code></pre>
-
-<h3 id="Asignando_dos_variables_con_un_solo_valor_de_cadena">Asignando dos variables con un solo valor de cadena</h3>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> a <span class="operator token">=</span> <span class="string token">'A'</span><span class="punctuation token">;</span>
-<span class="keyword token">var</span> b <span class="operator token">=</span> a<span class="punctuation token">;</span>
-
-<span class="comment token">// Equivalente a:</span>
-
-<span class="keyword token">var</span> a<span class="punctuation token">,</span> b <span class="operator token">=</span> a <span class="operator token">=</span> <span class="string token">'A'</span><span class="punctuation token">;</span></code></pre>
-
-<p>Sé consciente del orden:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> y<span class="punctuation token">,</span> y <span class="operator token">=</span> <span class="string token">'A'</span><span class="punctuation token">;</span>
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x <span class="operator token">+</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprimirá "undefinedA"</span></code></pre>
-
-<p>Aquí, '<code>x</code>' &amp; '<code>y</code>' son declaradas antes de ejecutarse cualquier código, y la asignación ocurre después. Al momento de evaluar "<code>x = y</code>", '<code>y</code>' existe así que ningún error "<code>ReferenceError</code>" es lanzado y su valor es '<code>undefined</code>', de modo que '<code>x</code>' también tiene asignada el valor '<code>undefined</code>'. Después, a 'y' se le asigna el valor 'A'. Consecuentemente, luego de la primera línea, '<code>x</code>' es exactamente igual a <code>'undefined</code>' &amp; '<code>y</code>' es igual a <code>'A'</code>, de ahí el resultado.</p>
-
-<h3 id="Initialización_de_muchas_variables">Initialización de muchas variables</h3>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>
-
-<span class="keyword token">function</span> <span class="function token">f</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>
-  <span class="keyword token">var</span> x <span class="operator token">=</span> y <span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span> <span class="comment token">// 'x' es declarada localmente, ¡'y' no lo es!</span>
-<span class="punctuation token">}</span>
-<span class="function token">f</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Lanza un error de tipo "ReferenceError" en modo estricto ('y' no está definida). De lo contrario se imprimiría "0, 1".</span>
-<span class="comment token">// En modo no-estricto:</span>
-<span class="comment token">// 'x' es la variable global como se esperaría</span>
-<span class="comment token">// 'y' sin embargo, se sale de la función</span></code></pre>
-
-<h3 id="Globales_implícitas_y_ámbito_externo_a_una_función">Globales implícitas y ámbito externo a una función</h3>
-
-<p>Las variables que parecen ser globales implícitas pueden ser referencias a variables en un ámbito externo a  la función:</p>
-
-<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">var</span> x <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span>  <span class="comment token">// 'x' es declarada globalmente, luego se le asigna el valor 0</span>.
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="keyword token">typeof</span> z<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime "undefined", pues 'z' aún no existe</span>.
-
-<span class="keyword token">function</span> <span class="function token">a</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="comment token">// Cuando 'a()' es invocada,</span>
-  <span class="keyword token">var</span> y <span class="operator token">=</span> <span class="number token">2</span><span class="punctuation token">;</span>   <span class="comment token">// 'y' es declarada localmente en la function 'a()', después se le asigna el valor 2</span>.
-
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span>   <span class="comment token">// Imprime "0, 2</span>".
-
-  <span class="keyword token">function</span> <span class="function token">b</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span>       <span class="comment token">// Cuando 'b()' es invocada,</span>
-    x <span class="operator token">=</span> <span class="number token">3</span><span class="punctuation token">;</span>  <span class="comment token">// Asigna el valor 3 a la global 'x' ya existente, no crea una nueva variable global.</span>
-    y <span class="operator token">=</span> <span class="number token">4</span><span class="punctuation token">;</span>  <span class="comment token">// Asigna 4 a la externa existente 'y', no crea una nueva variable global.</span>
-    z <span class="operator token">=</span> <span class="number token">5</span><span class="punctuation token">;</span>  <span class="comment token">// Crea una nueva variable global 'z' y le asigna un valor de 5. </span>
-  <span class="punctuation token">}</span>         <span class="comment token">// (Lanza un error de tipo "ReferenceError" en modo estricto.)</span>
-
-  <span class="function token">b</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>     <span class="comment token">// Invocar 'b()' crea 'z' como variable global.</span>
-  console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> y<span class="punctuation token">,</span> z<span class="punctuation token">)</span><span class="punctuation token">;</span>  <span class="comment token">// Imprime "3, 4, 5</span>".
-<span class="punctuation token">}</span>
-
-<span class="function token">a</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span>                   <span class="comment token">// Invocar 'a()' también llama a 'b</span>()'.
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>x<span class="punctuation token">,</span> z<span class="punctuation token">)</span><span class="punctuation token">;</span>     <span class="comment token">// Imprime "3, 5</span>", porque 'z' ya es una global.
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="keyword token">typeof</span> y<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Imprime 'undefined' porque 'y' es local en la función 'a()'</span></code></pre>
diff --git a/files/es/web/javascript/referencia/sentencias/while/index.html b/files/es/web/javascript/referencia/sentencias/while/index.html
deleted file mode 100644
index 8eab047884..0000000000
--- a/files/es/web/javascript/referencia/sentencias/while/index.html
+++ /dev/null
@@ -1,58 +0,0 @@
----
-title: while
-slug: Web/JavaScript/Referencia/Sentencias/while
-tags:
-  - JavaScript
-  - Statement
-translation_of: Web/JavaScript/Reference/Statements/while
----
-<div>{{jsSidebar("Statements")}}</div>
-
-<h2 id="Resumen" name="Resumen">Resumen</h2>
-
-<p>Crea un bucle que ejecuta una sentencia especificada mientras cierta condición se evalúe como verdadera. Dicha condición es evaluada antes de ejecutar la sentencia</p>
-
-<h2 id="Sintaxis" name="Sintaxis">Sintaxis</h2>
-
-<pre class="eval">while (<em>condicion</em>)
-  <em>sentencia</em>
-</pre>
-
-<dl>
- <dt><code>condicion</code></dt>
- <dd>Una expresión que se evalúa antes de cada paso del bucle. Si esta condición se evalúa como verdadera, se ejecuta <code>sentencia</code>. Cuando la condición se evalúa como false, la ejecución continúa con la <code>sentencia </code>posterior al bucle <code>while</code>.</dd>
-</dl>
-
-<dl>
- <dt><code>sentencia</code></dt>
- <dd>Una sentecia que se ejecuta mientras la condición se evalúa como verdadera. Para ejecutar múltiples sentencias dentro de un bucle, utiliza una sentencia {{jsxref("Sentencias/block", "block")}} (<code>{ ... }</code>) para agrupar esas sentencias.</dd>
-</dl>
-
-<h2 id="Ejemplos" name="Ejemplos">Ejemplos</h2>
-
-<p>El siguiente bucle <code>while</code> itera mientras <code>n</code> es menor que tres.</p>
-
-<pre class="brush: js">n = 0;
-x = 0;
-while (n &lt; 3) {
-  n ++;
-  x += n;
-}
-</pre>
-
-<p>Cada interación, el bucle incrementa <code>n</code> y la añade a <code>x</code>. Por lo tanto, <code>x</code> y <code>n</code> toman los siguientes valores:</p>
-
-<ul>
- <li>Después del primer pase: <code>n</code> = 1 y <code>x</code> = 1</li>
- <li>Después del segundo pase: <code>n</code> = 2 y <code>x</code> = 3</li>
- <li>Después del tercer pase: <code>n</code> = 3 y <code>x</code> = 6</li>
-</ul>
-
-<p>Después de completar el tercer pase, la condición <code>n</code> &lt; 3 no será verdadera más tiempo, por lo que el bucle terminará.</p>
-
-<h2 id="Vea_Tambi.C3.A9n" name="Vea_Tambi.C3.A9n">Vea También</h2>
-
-<ul>
- <li>{{jsxref("Sentencias/do...while", "do...while")}}</li>
- <li>{{jsxref("Sentencias/for", "for")}}</li>
-</ul>
diff --git a/files/es/web/javascript/referencia/sentencias/with/index.html b/files/es/web/javascript/referencia/sentencias/with/index.html
deleted file mode 100644
index d5dc78d600..0000000000
--- a/files/es/web/javascript/referencia/sentencias/with/index.html
+++ /dev/null
@@ -1,166 +0,0 @@
----
-title: with
-slug: Web/JavaScript/Referencia/Sentencias/with
-translation_of: Web/JavaScript/Reference/Statements/with
----
-<div class="warning">El uso de la declaración no es recomendado,  ya que puede ser el origen de los errores de confusión y problemas de compatibilidad. See the "Ambiguity Con" paragraph in the "Description" section below for details.</div>
-
-<div>{{jsSidebar("Statements")}}</div>
-
-<p>La <strong>sentencia with</strong> extiende el alcance de una cadena con la declaración.</p>
-
-<h2 id="Sintaxis">Sintaxis</h2>
-
-<pre class="syntaxbox">with (expresión) {
-  <em>declaración</em>
-}
-</pre>
-
-<dl>
- <dt><font face="Consolas, Liberation Mono, Courier, monospace">expresión</font></dt>
- <dd>Añade la expresión dada a la declaración. Los parentesis alrededor de la expresión son necesarios.</dd>
- <dt><code>declaración</code></dt>
- <dd>Se puede ejecutar cualquier declaración. Para ejecutar varias declaraciónes, utilizar una declaración de bloque ({ ... }) para agrupar esas declaraciónes.</dd>
-</dl>
-
-<h2 id="Descripción">Descripción</h2>
-
-<p>JavaScript looks up an unqualified name by searching a scope chain associated with the execution context of the script or function containing that unqualified name. The 'with' statement adds the given object to the head of this scope chain during the evaluation of its statement body. If an unqualified name used in the body matches a property in the scope chain, then the name is bound to the property and the object containing the property. Otherwise a {{jsxref("ReferenceError")}} is thrown.</p>
-
-<div class="note">Using <code>with</code> is not recommended, and is forbidden in ECMAScript 5 <a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode" title="JavaScript/Strict mode">strict mode</a>. The recommended alternative is to assign the object whose properties you want to access to a temporary variable.</div>
-
-<h3 id="Performance_pro_contra">Performance pro &amp; contra</h3>
-
-<p><strong>Pro:</strong> The <code>with</code> statement can help reduce file size by reducing the need to repeat a lengthy object reference without performance penalty. The scope chain change required by 'with' is not computationally expensive. Use of 'with' will relieve the interpreter of parsing repeated object references. Note, however, that in many cases this benefit can be achieved by using a temporary variable to store a reference to the desired object.</p>
-
-<p><strong>Contra:</strong> The <code>with</code> statement forces the specified object to be searched first for all name lookups. Therefore all identifiers that aren't members of the specified object will be found more slowly in a 'with' block. Where performance is important, 'with' should only be used to encompass code blocks that access members of the specified object.</p>
-
-<h3 id="Ambiguity_contra">Ambiguity contra</h3>
-
-<p><strong>Contra:</strong> The <code>with</code> statement makes it hard for a human reader or JavaScript compiler to decide whether an unqualified name will be found along the scope chain, and if so, in which object. So given this example:</p>
-
-<pre class="brush: js">function f(x, o) {
-  with (o)
-    print(x);
-}</pre>
-
-<p>Only when <code>f</code> is called is <code>x</code> either found or not, and if found, either in <code>o</code> or (if no such property exists) in <code>f</code>'s activation object, where <code>x</code> names the first formal argument. If you forget to define <code>x</code> in the object you pass as the second argument, or if there's some similar bug or confusion, you won't get an error -- just unexpected results.</p>
-
-<p><strong>Contra: </strong>Code using <code>with</code> may not be forward compatible, especially when used with something else than a plain object. Consider this example:</p>
-
-<div>
-<pre class="brush:js">function f(foo, values) {
-    with (foo) {
-        console.log(values)
-    }
-}
-</pre>
-
-<p>If you call <code>f([1,2,3], obj)</code> in an ECMAScript 5 environment, then the <code>values</code> reference inside the <code>with</code> statement will resolve to <code>obj</code>. However, ECMAScript 6 introduces a <code>values</code> property on <code><a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype">Array.prototype</a></code> (so that it will be available on every array). So, in a JavaScript environment that supports ECMAScript 6, the <code>values</code> reference inside the <code>with</code> statement will resolve to <code>[1,2,3].values</code>.</p>
-</div>
-
-<h2 id="Examples">Examples</h2>
-
-<h3 id="Using_with">Using <code>with</code></h3>
-
-<p>The following <code>with</code> statement specifies that the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math" title="JavaScript/Reference/Global_Objects/Math"><code>Math</code></a> object is the default object. The statements following the <code>with</code> statement refer to the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/PI" title="JavaScript/Reference/Global_Objects/Math/PI"><code>PI</code></a> property and the <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/cos" title="JavaScript/Reference/Global_Objects/Math/cos"><code>cos</code></a> and <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sin" title="JavaScript/Reference/Global_Objects/Math/sin"><code>sin</code></a> methods, without specifying an object. JavaScript assumes the <code>Math</code> object for these references.</p>
-
-<pre class="brush:js">var a, x, y;
-var r = 10;
-
-with (Math) {
-  a = PI * r * r;
-  x = r * cos(PI);
-  y = r * sin(PI / 2);
-}</pre>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-with-statement', 'with statement')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES5.1', '#sec-12.10', 'with statement')}}</td>
-   <td>{{Spec2('ES5.1')}}</td>
-   <td>Now forbidden in strict mode.</td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES3', '#sec-12.10', 'with statement')}}</td>
-   <td>{{Spec2('ES3')}}</td>
-   <td> </td>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES1', '#sec-12.10', 'with statement')}}</td>
-   <td>{{Spec2('ES1')}}</td>
-   <td>Initial definition</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li>{{jsxref("Statements/block", "block")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/Strict_mode">Strict mode</a></li>
-</ul>
diff --git a/files/es/web/javascript/referencia/template_strings/index.html b/files/es/web/javascript/referencia/template_strings/index.html
deleted file mode 100644
index 708c879383..0000000000
--- a/files/es/web/javascript/referencia/template_strings/index.html
+++ /dev/null
@@ -1,314 +0,0 @@
----
-title: Plantillas literales (plantillas de cadenas)
-slug: Web/JavaScript/Referencia/template_strings
-tags:
-  - ECMAScript 2015
-  - Experimental
-  - Expérimental(2)
-  - JavaScript
-translation_of: Web/JavaScript/Reference/Template_literals
----
-<div>{{JsSidebar("More")}}</div>
-
-<p>Las plantillas literales son cadenas literales que habilitan el uso de expresiones incrustadas. Con ellas, es posible utilizar cadenas de caracteres de más de una línea, y funcionalidades de interpolación de cadenas de caracteres.</p>
-
-<p>En ediciones anteriores de la especificación ES2015, solían llamarse "plantillas de cadenas de caracteres".</p>
-
-<h2 id="Syntax" name="Syntax">Sintaxis</h2>
-
-<pre class="syntaxbox notranslate">`texto de cadena de caracteres`
-
-`línea 1 de la cadena de caracteres
- línea 2 de la cadena de caracteres`
-
-`texto de cadena de caracteres ${expresión} texto adicional`
-
-<em>etiqueta</em>`texto de cadena de caracteres ${expresión} texto adicional`
-</pre>
-
-<h2 id="Description" name="Description">Descripción</h2>
-
-<p>Las plantillas literales se delimitan con el caracter de comillas o tildes invertidas (` `) (<a href="http://en.wikipedia.org/wiki/Grave_accent">grave accent</a>), en lugar de las comillas sencillas o dobles.</p>
-
-<p>Las plantillas de cadena de caracteres pueden contener marcadores, identificados por el signo de dólar y envueltos en llaves (<code>${expresión}</code>). Las expresiones contenidas en los marcadores, junto con el texto entre ellas, son enviados como argumentos a una función.</p>
-
-<p>La función por defecto sencillamente concatena las partes para formar una única cadena de caracteres. Si hay una expresión antes de la plantilla literal (aquí indicada mediante <em><code>etiqueta</code></em>), se le conoce como "plantilla etiquetada". En este caso, la expresión de etiqueta (típicamente una función) es llamada con la plantilla literal como parámetro, que luego puede ser manipulada antes de ser devuelta.</p>
-
-<p>En caso de querer escapar una comilla o tilde invertida en una plantilla literal, se debe poner una barra invertida (<code>\</code>) antes de la comilla o tilde invertida.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js"><span class="template-string token"><span class="string token">`\``</span></span> <span class="operator token">===</span> <span class="string token">'`'</span> <span class="comment token">// --&gt; true (cierto)</span></code></pre>
-
-<h3 id="Cadenas_de_más_de_una_línea">Cadenas de más de una línea</h3>
-
-<p>Los caracteres de fin de línea encontrados forman parte de la plantilla literal.</p>
-
-<p>Utilizando cadenas de caracteres normales, sería necesario utilizar la siguiente sintaxes para producir cadenas de más de una línea:</p>
-
-<pre class="brush: js notranslate">console.log('línea 1 de cadena de texto\n' +
-'\línea 2 de cadena de texto');
-// "línea 1 de cadena de texto
-// línea 2 de cadena de texto"
-</pre>
-
-<p>Utilizando plantillas literales, se puede obtener el mismo resultado de la siguiente forma:</p>
-
-<pre class="brush: js notranslate">console.log(`línea 1 de la cadena de texto
-línea 2 de la cadena de texto`);
-// "línea 1 de la cadena de texto
-// línea 2 de la cadena de texto"</pre>
-
-<h3 id="Interpolación_de_expresiones">Interpolación de expresiones</h3>
-
-<p>Para insertar expresiones dentro de cadenas de caracteres normales, se utilizaría la siguiente sintaxis:</p>
-
-<pre class="brush: js notranslate">let a = 5;
-let b = 10;
-console.log('Quince es ' + (a + b) + ' y\nno ' + (2 * a + b) + '.');
-// "Quince es 15 y
-// no 20."</pre>
-
-<p>Ahora, con las plantillas literales, se pueden utilizar sus nuevas capacidades (es decir, insertar expresiones con <code>${ }</code> e incluir caracteres de fin de linea literales dentro de la cadena) para simplificar la sintaxis:</p>
-
-<pre class="brush: js notranslate">let a = 5;
-let b = 10;
-console.log(`Quince es ${a + b} y
-no ${2 * a + b}.`);
-// "Quince es 15 y
-// no 20."</pre>
-
-<h3 id="Anidamiento_de_plantillas">Anidamiento de plantillas</h3>
-
-<p>En ciertos casos, anidar una plantilla es la forma más fácil, e incluso más legible, de tener cadenas configurables. Dentro de una plantilla con tildes invertidas, es sencillo permitir tildes invertidas interiores simplemente usándolas dentro de un marcador de posición <code>${ }</code> dentro de la plantilla.</p>
-
-<p>Por ejemplo, si la condición a es <code>true</code> (cierta): entonces <code>return</code> (devuelva) este literal con plantilla.</p>
-
-<p>En ES5:</p>
-
-<pre class="brush: js notranslate"><code class="language-js">let classes <span class="operator token">=</span> <span class="string token">'header'</span>
-classes <span class="operator token">+</span><span class="operator token">=</span> <span class="punctuation token">(</span><span class="function token">isLargeScreen</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="operator token">?</span>
-   <span class="string token">''</span> <span class="punctuation token">:</span> item<span class="punctuation token">.</span>isCollapsed <span class="operator token">?</span>
-     <span class="string token">' icon-expander'</span> <span class="punctuation token">:</span> <span class="string token">' icon-collapser'</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
-
-<p>En ES2015 con plantillas literales y sin anidamiento:</p>
-
-<pre class="brush: js notranslate"><code>const classes = `header ${ isLargeScreen() ? '' :
-    (item.isCollapsed ? 'icon-expander' : 'icon-collapser') }`;</code></pre>
-
-<p>En ES5 con plantillas literales anidadas:</p>
-
-<pre class="brush: js notranslate"><code>const classes = `header ${ isLargeScreen() ? '' :
- `icon-${item.isCollapsed ? 'expander' : 'collapser'}` }`;</code></pre>
-
-<h3 id="Plantillas_etiquetadas">Plantillas etiquetadas</h3>
-
-<p>Una forma más avanzada de plantillas literales son las plantillas <em>etiquetadas</em>.</p>
-
-<p>Con ellas es posible modificar la salida de las plantillas utilizando una función. El primer argumento contiene un array con una o más cadenas de caracteres. El segundo y subsiguientes argumentos se asocian con las expresiones de la plantilla.</p>
-
-<p>La función de etiqueta puede ejecutar cualesquiera operaciones deseadas con estos argumentos, y luego devolver la cadena manipulada. (También puede devolver algo totalmente distinto, como se muestra en uno de los siguientes ejemplos.)</p>
-
-<p>El nombre de la función utilizada con la etiqueta no es nada especial, se puede utilizar cualquier nombre de función en su lugar.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">let persona <span class="operator token">=</span> <span class="string token">'Mike'</span><span class="punctuation token">;</span>
-let edad <span class="operator token">=</span> <span class="number token">28</span><span class="punctuation token">;</span>
-
-<span class="keyword token">function</span> <span class="function token">myTag</span><span class="punctuation token">(</span>strings<span class="punctuation token">,</span> expPersona<span class="punctuation token">,</span> expEdad<span class="punctuation token">)</span>
-<span class="punctuation token">{</span>
-  let str0 <span class="operator token">=</span> strings<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">;</span> <span class="comment token">// "Ese "</span>
-  let str1 <span class="operator token">=</span> strings<span class="punctuation token">[</span><span class="number token">1</span><span class="punctuation token">]</span><span class="punctuation token">;</span> <span class="comment token">// " es un "</span>
-
-  <span class="comment token">// Tecnicamente, hay una cadena de
-  // caracteres después de la expresión
-  // final (en nuestro ejemplo) pero
-  // está vacia (""), asi que se ignora.</span>
-  <span class="comment token">// let str2 = strings[2];</span>
-
-  let strEdad<span class="punctuation token">;</span>
-  <span class="keyword token">if</span> <span class="punctuation token">(expEdad</span> <span class="operator token">&gt;</span> <span class="number token">99</span><span class="punctuation token">)</span>
-<span class="punctuation token">  {</span>
-    strEdad <span class="operator token">=</span> <span class="string token">'viejo'</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-  <span class="keyword token">else</span>
-  <span class="punctuation token">{</span>
-    strEdad <span class="operator token">=</span> <span class="string token">'joven'</span><span class="punctuation token">;</span>
-  <span class="punctuation token">}</span>
-
-  <span class="comment token">// Podemos incluso retornar una cadena de
-  // caracteres utilizando una plantilla literal.</span>
-  <span class="keyword token">return</span> <span class="template-string token"><span class="string token">`</span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>str0<span class="interpolation-punctuation punctuation token">}</span></span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${expPersona</span><span class="interpolation-punctuation punctuation token">}</span></span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>str1<span class="interpolation-punctuation punctuation token">}</span></span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span>strEdad<span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">;</span>
-<span class="punctuation token">}</span>
-
-<span class="keyword token">var</span> salida <span class="operator token">=</span> myTag<span class="template-string token"><span class="string token">`Ese </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span> persona <span class="interpolation-punctuation punctuation token">}</span></span><span class="string token"> es un </span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span> edad <span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">`</span></span><span class="punctuation token">;</span>
-
-console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>salida<span class="punctuation token">)</span><span class="punctuation token">;</span>
-<span class="comment token">// Ese Mike es un joven</span></code>
-</pre>
-
-<p>Las funciones de etiqueta incluso pueden devolver valores que no sean cadenas de caracteres:</p>
-
-<pre class="brush: js notranslate">function plantilla(cadenas, ...claves) {
-  return (function(...valores) {
-    let diccio = valores[valores.length - 1] || {};
-    let resultado = [cadenas[0]];
-    claves.forEach(function(clave, i) {
-      let valor = Number.isInteger(clave) ? valores[clave] : diccio[clave];
-      resultado.push(valor, cadenas[i + 1]);
-    });
-    return resultado.join('');
-  });
-}
-
-let t1Closure = plantilla`¡${0}${1}${2}${2}${3}!`;
-//let t1Closure = plantilla(["¡","","","","","","!"],0,1,2,3);
-t1Closure('H', 'U', 'R', 'A');              // "¡HURRA!"
-
-let t2Closure = plantilla`${0} ${'foo'}!`;
-//let t2Closure = plantilla(["¡",""," ","!"],0,"foo");
-t2Closure('Hola', {foo: 'Mundo'}); // "¡Hola Mundo!"
-
-let t3Closure = plantilla`Me llamo ${'nombre'}. Tengo casi ${'edad'} años.`;
-//let t3Closure = plantilla(["Me llamo ", ". Tengo casi ", " años."], "nombre", "edad");
-t3Closure('foo', {nombre: 'MDN', edad: 30}); //"Me llamo MDN. Tengo casi 30 años."
-t3Closure({nombre: 'MDN', edad: 30}); //"Me llamo MDN. Tengo casi 30 años."</pre>
-
-<h3 id="Cadenas_en_crudo_raw">Cadenas en crudo (<em>raw</em>)</h3>
-
-<p>La propiedad especial <code>raw</code>, disponible en el primer argumento de la función de etiqueta, permite acceso a las cadenas de caracteres tal como fueron ingresadas, sin procesar <a href="https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Grammar_and_types#Literales_String">secuencias de escape</a>.</p>
-
-<pre class="brush: js notranslate">function etiqueta(cadenas) {
-  console.log(cadenas.raw[0]);
-}
-
-etiqueta`texto de cadena de caracteres 1 \n texto de cadena de caracteres 2`;
-// muestra "texto de cadena de caracteres 1 \n texto de cadena de caracteres 2" ,
-// incluyendo los caracteres '\' y 'n'</pre>
-
-<p>Adicionalmente, el método {{jsxref("String.raw()")}} permite crear cadenas de caracteres en crudo tal como serían generadas por la función por defecto de plantilla, concatenando sus partes.</p>
-
-<pre class="brush: js line-numbers  language-js notranslate"><code class="language-js">let cadena <span class="operator token">=</span> String<span class="punctuation token">.</span>raw<span class="template-string token"><span class="string token">`¡Hola\n</span><span class="interpolation token"><span class="interpolation-punctuation punctuation token">${</span><span class="number token">2</span><span class="operator token">+</span><span class="number token">3</span><span class="interpolation-punctuation punctuation token">}</span></span><span class="string token">!`</span></span><span class="punctuation token">;</span>
-<span class="comment token">// "¡Hola\n5!"</span>
-
-cadena<span class="punctuation token">.</span>length<span class="punctuation token">;</span>
-<span class="comment token">// 9
-
-</span>Array.from(cadena).join(',');
-// "</code>¡,<code class="language-js">H,o,l,a,\,n,5,!"</code>
-</pre>
-
-<h3 id="Plantillas_etiquetadas_y_secuencias_de_escape">Plantillas etiquetadas y secuencias de escape</h3>
-
-<h4 id="Comportamiento_en_ES2016">Comportamiento en ES2016</h4>
-
-<p>Comenzando con ECMAScript 2016, las plantillas etiquetadas se comportan de acuerdo con las normas de las siguientes secuencias de escape:</p>
-
-<ul>
- <li>Secuencias de escape de formato Unicode comenzando con "<code>\u</code>", como <code>\u00A9</code></li>
- <li>Secuencias de escape de formato Unicode de punto de código, indicadas con "<code>\u{}</code>", como <code>\u{2F804}</code></li>
- <li>Secuencias de escape de numeros hexadecimales comenzando con "<code>\x</code>", como <code>\xA9</code></li>
- <li>Secuencias de escape de octales literales comenzando con "<code>\0o</code>" seguidas de uno o más dígitos, como <code>\0o251</code></li>
-</ul>
-
-<p>Esto significa que una plantilla etiquetada como la siguiente podría causar problemas, dado que, de acuerdo con la gramática de ECMAScript, un analizador buscará secuencias de escape de formato Unicode válidas pero encontrará sintaxis equivocado:</p>
-
-<pre class="brush: js notranslate">latex`\unicode`
-// En ECMAScript 2016 y versiones anteriores, lanza
-// SyntaxError: malformed Unicode character escape sequence</pre>
-
-<h3 id="Revision_de_secuencias_de_escape_no_permitidas_en_ES2018">Revision de secuencias de escape no permitidas en ES2018</h3>
-
-<p>Las plantillas etiquetadas deberías permitir la inserción de lenguages (como los <a href="https://en.wikipedia.org/wiki/Domain-specific_language">DSL</a>, o <a href="https://en.wikipedia.org/wiki/LaTeX">LaTeX</a>), en donde otras secuencias de escape se ven comúnmente. La propuesta para ECMAScript <a href="https://tc39.es/proposal-template-literal-revision/">Template Literal Revision</a> (Revisión de Plantilla Literal) (Cuarta Etapa, en camino a ser integrada al estándar de ECMAScript 2018) elimina la restricción de las secuencias de escape en ECMAScript para las plantillas etiquetadas.</p>
-
-<p>Aún así, las secuencias de escape no permitidas deben ser representadas en la representación "cocinada" de la cadena. Aparecerán como elementos <a href="https://developer.mozilla.org/es/docs/Glossary/undefined">no definidos</a> en el array llamado "cocinado" en el siguiente ejemplo.</p>
-
-<pre class="brush: js notranslate">function latex(str) {
-  return { "cocinado": str[0], "en crudo": str.raw[0] }
-}
-
-latex`\unicode`
-
-// { cocinado: undefined, en crudo: "\\unicode" }</pre>
-
-<p>Cabe destacar que la restricción para secuencias de escape solo ha sido eliminada para plantillas <em>etiquetadas</em>. Aún permanece para plantillas literales sin etiqueta:</p>
-
-<pre class="brush: js example-bad notranslate">let bad = `bad escape sequence: \unicode`;</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comentarios</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('ES6', '#sec-template-literals', 'Template Literals')}}<br>
-    {{SpecName('ES6', '#sec-tagged-templates', 'Tagged Templates')}}</td>
-   <td>{{Spec2('ES6')}}</td>
-   <td>Definición inicial.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatChrome(41)}}</td>
-   <td>{{CompatGeckoDesktop("34")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera(29)}}</td>
-   <td>{{CompatSafari(9.1)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Funcionalidad</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td><span style="font-size: 12px; line-height: 18px;">Soporte básico</span></td>
-   <td>{{CompatAndroid(67)}}</td>
-   <td>
-    <p class="p1">{{CompatChrome(71)}}</p>
-   </td>
-   <td>{{CompatGeckoMobile("63")}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatOpera(46)}}</td>
-   <td>{{CompatSafari(9)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="See_also" name="See_also">Ver también</h2>
-
-<ul>
- <li>{{jsxref("String")}}</li>
- <li>{{jsxref("String.raw()")}}</li>
- <li><a href="/en-US/docs/Web/JavaScript/Reference/Lexical_grammar">Lexical grammar</a></li>
- <li><a href="https://gist.github.com/WebReflection/8f227532143e63649804">Template-like strings in ES3 compatible syntax</a></li>
-</ul>
diff --git a/files/es/web/javascript/typed_arrays/index.html b/files/es/web/javascript/typed_arrays/index.html
new file mode 100644
index 0000000000..ebc04a9830
--- /dev/null
+++ b/files/es/web/javascript/typed_arrays/index.html
@@ -0,0 +1,273 @@
+---
+title: Arreglos tipados de JavaScript
+slug: Web/JavaScript/Typed_arrays
+tags:
+  - Arreglo tipado
+  - Guía
+  - JavaScript
+translation_of: Web/JavaScript/Typed_arrays
+original_slug: Web/JavaScript/Vectores_tipados
+---
+<div>{{JsSidebar("Advanced")}}</div>
+
+<p><span class="seoSummary"><strong>Los arreglos tipados en JavaScript</strong> son objetos similares a arreglos que proporcionan un mecanismo para leer y escribir datos binarios sin procesar en búferes de memoria.</span> Como ya sabrás, los objetos {{jsxref("Array", "Arreglo")}} crecen y se encogen dinámicamente y pueden tener cualquier valor de JavaScript. Los motores de JavaScript realizan optimizaciones para que estos arreglos sean rápidos.</p>
+
+<p>Sin embargo, a medida que las aplicaciones web se vuelven cada vez más poderosas, agregando características como manipulación de audio y video, acceso a datos sin procesar usando <code>WebSockets</code>, etc., ha quedado claro que hay momentos en los que sería útil que el código JavaScript pudiera manipular rápida y fácilmente datos binarios sin procesar. Aquí es donde entran en juego los arreglos tipados. Cada entrada en un arreglo tipado de JavaScript es un valor binario sin procesar en uno de los formatos admitidos, desde números enteros de 8 bits hasta números de punto flotante de 64 bits.</p>
+
+<p>Sin embargo, los arreglos tipados <em>no</em> se deben confundir con los arreglos normales, ya que llamar a {{JSxRef("Array.isArray()")}} en un arreglo tipado devuelve <code>false</code>. Además, no todos los métodos disponibles para arreglos normales son compatibles con arreglos tipados (por ejemplo, <code>push</code> y <code>pop</code>).</p>
+
+<h2 id="Búferes_y_vistas_arquitectura_de_los_arreglos_tipados">Búferes y vistas: arquitectura de los arreglos tipados</h2>
+
+<p>Para lograr la máxima flexibilidad y eficiencia, los arreglos de JavaScript dividen la implementación en <em>búferes</em> y <em>vistas</em>. Un búfer (implementado por el objeto {{jsxref("ArrayBuffer")}} es un objeto que representa una porción de datos; no tiene ningún formato del que hablar y no ofrece ningún mecanismo para acceder a su contenido. Para acceder a la memoria contenida en un búfer, necesitas usar una vista. Una vista proporciona un contexto — es decir, un tipo de dato, un desplazamiento inicial y el número de elementos — que convierte los datos en un arreglo tipado.</p>
+
+<p><img alt="Arreglos tipados en ArrayBuffer" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p>
+
+<h3 id="ArrayBuffer"><code>ArrayBuffer</code></h3>
+
+<p>{{jsxref("ArrayBuffer")}} es un tipo de dato que se utiliza para representar un búfer de datos binarios genérico de longitud fija. No puedes manipular directamente el contenido de un <code>ArrayBuffer</code>; en su lugar, crea una vista de arreglo tipado o un {{JSxRef("DataView")}} que representa el búfer en un formato específico, y lo usa para leer y escribir el contenido del búfer.</p>
+
+<h3 id="Vistas_de_arreglos_tipados">Vistas de arreglos tipados</h3>
+
+<p>Las vistas de arreglos tipados tienen nombres autodescriptivos y proporcionan vistas para todos los tipos numéricos habituales tal como <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> y así sucesivamente. Hay una vista de arreglo tipado especial, la <code>Uint8ClampedArray</code>. Esta fija los valores entre 0 y 255. {{JSxRef("../Data_structures", "Tipos de datos JavaScript")}}</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th class="header" scope="col">Tipo</th>
+   <th class="header" scope="col">Intervalo de valores</th>
+   <th class="header" scope="col">Tamaño en bytes</th>
+   <th class="header" scope="col">Descripción</th>
+   <th class="header" scope="col">Tipo de IDL web</th>
+   <th class="header" scope="col">Tipo C equivalente</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{JSxRef("Int8Array")}}</td>
+   <td><code>-128</code> a <code>127</code></td>
+   <td>1</td>
+   <td>Dos enteros complementarios de 8 bits con signo</td>
+   <td><code>byte</code></td>
+   <td><code>int8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Uint8Array")}}</td>
+   <td><code>0</code> a <code>255</code></td>
+   <td>1</td>
+   <td>Entero de 8-bit sin signo</td>
+   <td><code>octet</code></td>
+   <td><code>uint8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Uint8ClampedArray")}}</td>
+   <td><code>0</code> a <code>255</code></td>
+   <td>1</td>
+   <td>Entero de 8 bits sin signo (sujeto)</td>
+   <td><code>octet</code></td>
+   <td><code>uint8_t</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Int16Array")}}</td>
+   <td><code>-32768</code> a <code>32767</code></td>
+   <td>2</td>
+   <td>Dos enteros complementarios de 16 bits con signo</td>
+   <td><code>short</code></td>
+   <td><code>int16_t</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Uint16Array")}}</td>
+   <td><code>0</code> a <code>65535</code></td>
+   <td>2</td>
+   <td>Entero de 16 bits sin signo</td>
+   <td><code>Short sin signo</code></td>
+   <td><code>uint16_t</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Int32Array")}}</td>
+   <td><code>-2147483648</code> a <code>2147483647</code></td>
+   <td>4</td>
+   <td>dos enteros complementarios de 32 bits con signo</td>
+   <td><code>long</code></td>
+   <td><code>int32_t</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Uint32Array")}}</td>
+   <td><code>0</code> a <code>4294967295</code></td>
+   <td>4</td>
+   <td>Enteros de 32 bits sin signo</td>
+   <td><code>long sin signo</code></td>
+   <td><code>uint32_t</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Float32Array")}}</td>
+   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>38</sup></code></td>
+   <td>4</td>
+   <td>Número de coma flotante IEEE de 32 bits (7 dígitos significativos, p. ej., <code>1.1234567</code>)</td>
+   <td><code>float sin restricciones</code></td>
+   <td><code>float</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("Float64Array")}}</td>
+   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>308</sup></code></td>
+   <td>8</td>
+   <td>Número de coma flotante IEEE de 64 bits (16 dígitos significativos, p. ej., <code>1.123...15</code>)</td>
+   <td><code>doble sin restricciones</code></td>
+   <td><code>double</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("BigInt64Array")}}</td>
+   <td><code>-2<sup>63</sup></code> a <code>2<sup>63</sup>-1</code></td>
+   <td>8</td>
+   <td>Dos enteros complementarios de 64 bits con signo</td>
+   <td><code>bigint</code></td>
+   <td><code>int64_t (long long con signo)</code></td>
+  </tr>
+  <tr>
+   <td>{{JSxRef("BigUint64Array")}}</td>
+   <td><code>0</code> a <code>2<sup>64</sup>-1</code></td>
+   <td>8</td>
+   <td>Entero de 64 bits sin signo</td>
+   <td><code>bigint</code></td>
+   <td><code>uint64_t (long long sin signo)</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="DataView"><code>DataView</code></h3>
+
+<p>{{jsxref("DataView")}} es una interfaz de bajo nivel que proporciona una API captadora (<code>getter</code>)/(<code>setter</code>) establecedora para leer y escribir datos arbitrarios en el búfer. Esto es útil cuando se trata de diferentes tipos de datos, por ejemplo. Las vistas de arreglos tipados están en el orden de bytes nativo (consulta {{Glossary("Endianness")}} de tu plataforma. Con un <code>DataView</code> puedes controlar el orden de bytes. Es <code>big-endian</code> de manera predeterminada y se puede establecer en <code>little-endian</code> en los métodos captadores/establecedores.</p>
+
+<h2 id="APIs_web_que_utilizan_arreglos_tipados">APIs web que utilizan arreglos tipados</h2>
+
+<p>Estos son algunos ejemplos de APIs que utilizan arreglos tipados; hay otras, y todo el tiempo surgen más.</p>
+
+<dl>
+ <dt>{{Link("/en-US/docs/Web/API/FileReader", "FileReader.prototype.readAsArrayBuffer()", "#readAsArrayBuffer()")}}</dt>
+ <dd>El método <code>FileReader.prototype.readAsArrayBuffer()</code> comienza a leer el contenido del {{Link("/es/docs/Web/API/Blob", "Blob")}} o {{Link("/es/docs/Web/API/File", "File")}}.</dd>
+ <dt><a href="/en-US/docs/Web/API/XMLHttpRequest#send()" title="/en-US/docs/Web/API/XMLHttpRequest#send()"><code>XMLHttpRequest.prototype.send()</code></a></dt>
+ <dd>El método <code>send()</code> de instancias de <code>XMLHttpRequest</code> ahora admiten arreglos tipados y objetos {{JSxRef("ArrayBuffer")}} como argumento.</dd>
+ <dt>{{Link("/en-US/docs/Web/API/ImageData", "ImageData.data")}}</dt>
+ <dd>Es un {{JSxRef("Uint8ClampedArray")}} que representa un arreglo unidimensional que contiene los datos en el orden RGBA, con valores enteros entre <code>0</code> y <code>255</code> inclusive.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<h3 id="Usar_vistas_con_búferes">Usar vistas con búferes</h3>
+
+<p>En primer lugar, necesitaremos crear un búfer, aquí con una longitud fija de 16 bytes:</p>
+
+<pre class="brush:js notranslate">let buffer = new ArrayBuffer(16);
+</pre>
+
+<p>En este punto, tenemos una porción de memoria cuyos bytes están todos preiniciados a 0. Sin embargo, no hay mucho que podamos hacer con él. Podemos confirmar que de hecho tiene 16 bytes de longitud, y eso es todo:</p>
+
+<pre class="brush:js notranslate">if (buffer.byteLength === 16) {
+  console.log("Sí, son 16 bytes");
+} else {
+  console.log("¡Oh no, es del tamaño incorrecto!");
+}
+</pre>
+
+<p>Antes de que podamos trabajar realmente con este búfer, necesitamos crear una vista. Creemos una vista que trate los datos en el búfer como un arreglo de enteros de 32 bits con signo:</p>
+
+<pre class="brush:js notranslate">let int32View = new Int32Array(buffer);
+</pre>
+
+<p>Ahora podemos acceder a los campos del arreglo como un arreglo normal:</p>
+
+<pre class="brush:js notranslate">for (let i = 0; i &lt; int32View.length; i++) {
+  int32View[i] = i * 2;
+}
+</pre>
+
+<p>Esto completa las 4 entradas en el arreglo (4 entradas de 4 bytes cada una suman 16 bytes en total) con los valores <code>0</code>, <code>2</code>, <code>4</code> y <code>6</code>.</p>
+
+<h3 id="Múltiples_vistas_sobre_los_mismos_datos">Múltiples vistas sobre los mismos datos</h3>
+
+<p>Las cosas comienzan a ponerse realmente interesantes cuando consideras que puedes crear múltiples vistas sobre los mismos datos. Por ejemplo, dado el código anterior, podemos continuar así:</p>
+
+<pre class="brush:js notranslate">let int16View = new Int16Array(buffer);
+
+for (let i = 0; i &lt; int16View.length; i++) {
+  console.log('Entrada ' + i + ': ' + int16View[i]);
+}
+</pre>
+
+<p>Aquí creamos una vista entera de 16 bits que comparte el mismo búfer que la vista existente de 32 bits y sacamos todos los valores en el búfer como enteros de 16 bits. Ahora obtenemos la salida <code>0</code>, <code>0</code>, <code>2</code>, <code>0</code>, <code>4</code>, <code>0</code>, <code>6</code>, <code>0</code>.</p>
+
+<p>Sin embargo, puedes dar un paso más. Considera esto:</p>
+
+<pre class="brush:js notranslate">int16View[0] = 32;
+console.log('La entrada 0 en el arreglo de 32 bits ahora es ' + int32View[0]);
+</pre>
+
+<p>La salida de esto es <code>"La entrada 0 en el arreglo de 32 bits ahora es 32"</code>.</p>
+
+<p>En otras palabras, los dos arreglos se ven simplemente en el mismo búfer de datos, tratándolo como formatos diferentes. Lo puedes hacer con cualquier {{JSxRef("Global_Objects/TypedArray", "tipo de vista", "#TypedArray_objects")}}.</p>
+
+<h3 id="Trabajar_con_complejas_estructuras_de_datos">Trabajar con complejas estructuras de datos</h3>
+
+<p>Al combinar un solo búfer con múltiples vistas de diferentes tipos, comenzando con diferentes desplazamientos en el búfer, puedes interactuar con objetos de datos que contienen múltiples tipos de datos. Esto te permite, por ejemplo, interactuar con complejas estructuras de datos {{Link("/es/docs/Web/WebGL", "WebGL")}}, archivos de datos o estructuras C que necesitas utilizar mientras usas {{Link("/en-US/docs/Mozilla/js-ctypes", "js-ctypes")}}.</p>
+
+<p>Considera esta estructura C:</p>
+
+<pre class="brush:cpp notranslate">struct someStruct {
+  unsigned long id;
+  char username[16];
+  float amountDue;
+};</pre>
+
+<p>Puedes acceder a un búfer que contiene datos en un formato como este:</p>
+
+<pre class="brush:js notranslate">let buffer = new ArrayBuffer(24);
+
+// ... lee los datos en el búfer ...
+
+let idView = new Uint32Array(buffer, 0, 1);
+let usernameView = new Uint8Array(buffer, 4, 16);
+let amountDueView = new Float32Array(buffer, 20, 1);</pre>
+
+<p>Luego puedes acceder, por ejemplo, al monto adeudado con <code>amountDueView[0]</code>.</p>
+
+<div class="note"><strong>Nota</strong>: La {{interwiki("wikipedia", "Data_structure_alignment")}} en una estructura C depende de la plataforma. Toma precauciones y consideraciones para estas diferencias de relleno.</div>
+
+<h3 id="Conversión_a_arreglos_normales">Conversión a arreglos normales</h3>
+
+<p>Después de procesar un arreglo con tipo, a veces es útil volver a convertirla en un arreglo normal para beneficiarse del prototipo {{jsxref("Array")}}. Esto se puede hacer usando {{JSxRef("Array.from()")}}, o usando el siguiente código donde <code>Array.from()</code> no es compatible.</p>
+
+<pre class="brush:js notranslate">let typedArray = new Uint8Array([1, 2, 3, 4]),
+    normalArray = Array.prototype.slice.call(typedArray);
+normalArray.length === 4;
+normalArray.constructor === Array;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Especificación</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-typedarray-objects', 'TypedArray Objects')}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
+
+<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
+
+<p>{{Compat("javascript.builtins.Int8Array")}}</p>
+
+<h2 id="Ve_también">Ve también</h2>
+
+<ul>
+ <li>{{Link("/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding", "Conseguir ArrayBuffers o arreglos tipados a partir de cadenas codificadas en Base64", "#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer")}}</li>
+ <li>{{Link("/en-US/docs/Code_snippets/StringView", "StringView: una representación en C de cadenas basadas en arreglos tipados")}}</li>
+ <li><a href="https://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipulation-with-typed-arrays">Rápida manipulación de píxeles en canvas con arreglos tipados</a></li>
+ <li><a href="http://www.html5rocks.com/en/tutorials/webgl/typed_arrays">Arreglos tipados: Datos binarios en el navegador</a></li>
+ <li>{{Glossary("Endianness")}}</li>
+</ul>
diff --git a/files/es/web/javascript/una_re-introducción_a_javascript/index.html b/files/es/web/javascript/una_re-introducción_a_javascript/index.html
deleted file mode 100644
index b8f2756627..0000000000
--- a/files/es/web/javascript/una_re-introducción_a_javascript/index.html
+++ /dev/null
@@ -1,960 +0,0 @@
----
-title: Una reintroducción a JavaScript (Tutorial de JS)
-slug: Web/JavaScript/Una_re-introducción_a_JavaScript
-tags:
-  - Aprender
-  - Guía
-  - Intermedio
-  - Intro
-  - JavaScript
-  - Tutorial
-  - introducción
-translation_of: Web/JavaScript/A_re-introduction_to_JavaScript
----
-<div>{{jsSidebar}}</div>
-
-
-<p>¿Por qué una reintroducción? Porque {{Glossary("JavaScript")}} es conocido por ser <a href="http://crockford.com/javascript/javascript.html">el lenguaje de programación más incomprendido</a>. A menudo se le ridiculiza como un juguete, pero debajo de esa capa de engañosa simplicidad, aguardan poderosas características del lenguaje. Ahora un increíble número de aplicaciones de alto perfil utilizan JavaScript, lo cual demuestra que un conocimiento más profundo de esta tecnología es una habilidad importante para cualquier desarrollador web o móvil.</p>
-
-<p>Es útil comenzar con una descripción general de la historia del lenguaje. JavaScript fue creado en 1995 por Brendan Eich mientras era ingeniero en Netscape. JavaScript se lanzó por primera vez con Netscape 2 a principios de 1996. Originalmente se iba a llamar LiveScript, pero se le cambió el nombre en una desafortunada decisión de marketing que intentó capitalizar la popularidad del lenguaje Java de Sun Microsystem, a pesar de que los dos tienen muy poco en común. Esto ha sido una fuente de confusión desde entonces.</p>
-
-<p>Varios meses después, Microsoft lanzó JScript con Internet Explorer 3. Era un JavaScript prácticamente compatible. Varios meses después de eso, Netscape envió JavaScript a <a class="external" href="http://www.ecma-international.org/">Ecma International</a>, una organización europea de estándares, que resultó en la primera edición del estándar {{Glossary("ECMAScript")}} ese año. El estándar recibió una actualización significativa como <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript edición 3</a> en 1999, y se ha mantenido bastante estable desde entonces. La cuarta edición fue abandonada debido a diferencias políticas sobre la complejidad del lenguaje. Muchas partes de la cuarta edición formaron la base para la edición 5 de ECMAScript, publicada en diciembre de 2009, y para la sexta edición principal del estándar, publicada en junio de 2015.</p>
-
-<div class="note">
-<p>Debido a que es más familiar, nos referiremos a ECMAScript como "JavaScript" de ahora en adelante.</p>
-</div>
-
-<p>A diferencia de la mayoría de los lenguajes de programación, el lenguaje JavaScript no tiene un concepto de entrada o salida. Está diseñado para ejecutarse como un lenguaje de <code>scripting</code> en un entorno hospedado, y depende del entorno para proporcionar los mecanismos para comunicarse con el mundo exterior. El entorno de alojamiento más común es el navegador, pero también se pueden encontrar intérpretes de JavaScript en una gran lista de otros lugares, incluidos Adobe Acrobat, Adobe Photoshop, imágenes SVG, el motor de widgets de Yahoo, entornos de lado del servidor como <a href="http://nodejs.org/">Node.js</a>, bases de datos NoSQL como <a href="http://couchdb.apache.org/">Apache CouchDB</a> de código abierto, computadoras integradas, entornos de escritorio completos como <a href="http://www.gnome.org/">GNOME</a> (una de las IGU —<em>Interfaz Gráfica de Usuario</em>— más populares para sistemas operativos GNU/Linux), y otros.</p>
-
-<h2 id="Información_general">Información general</h2>
-
-<p>JavaScript es un lenguaje dinámico múltiparadigma con tipos y operadores, objetos estándar integrados y métodos. Su sintaxis se basa en los lenguajes Java y C — muchas estructuras de esos lenguajes también se aplican a JavaScript. JavaScript admite la programación orientada a objetos con prototipos de objetos, en lugar de clases (consulta más información sobre {{jsxref("Inheritance_and_the_prototype_chain", "herencia prototípica")}} y ES2015 {{jsxref("Reference/Classes", "clases")}}. JavaScript también admite la programación funcional — debido a que son objetos, las funciones se pueden almacenar en variables y pasarse como cualquier otro objeto.</p>
-
-<p>Comencemos observando los componentes básicos de cualquier lenguaje: los tipos. Los programas JavaScript manipulan valores, y todos esos valores pertenecen a un tipo. Los tipos de JavaScript son:</p>
-
-<ul>
- <li>{{jsxref("Number", "Números")}}</li>
- <li>{{jsxref("String", "Cadenas de texto (Strings)")}}</li>
- <li>{{jsxref("Boolean", "Booleanos")}}</li>
- <li>{{jsxref("Function", "Funciones")}}</li>
- <li>{{jsxref("Object", "Objetos")}}</li>
- <li>{{jsxref("Symbol", "Símbolos")}} (nuevo en ES2015)</li>
-</ul>
-
-<p>... oh, y {{jsxref("undefined")}} y {{jsxref("null")}}, que son ... ligeramente extraños. Y {{jsxref("Array")}}, que es un tipo de objeto especial. Y {{jsxref("Date", "Fechas (Date)")}} y {{jsxref("RegExp", "Expresiones regulares (RegExp)")}}, que son objetos que obtienes de forma gratuita. Y para ser técnicamente precisos, las funciones son solo un tipo especial de objeto. Por lo tanto, el diagrama de tipos se parece más a este:</p>
-
-<ul>
- <li>{{jsxref("Number", "Números")}}</li>
- <li>{{jsxref("String", "Cadenas de texto (Strings)")}}</li>
- <li>{{jsxref("Boolean", "Booleanos")}}</li>
- <li>{{jsxref("Symbol", "Símbolos")}} (nuevo en ES2015)</li>
- <li>{{jsxref("Object", "Objetos")}}
-  <ul>
-   <li>{{jsxref("Function", "Funciones")}}</li>
-   <li>{{jsxref("Array")}}</li>
-   <li>{{jsxref("Date")}}</li>
-   <li>{{jsxref("RegExp")}}</li>
-  </ul>
- </li>
- <li>{{jsxref("null")}}</li>
- <li>{{jsxref("undefined")}}</li>
-</ul>
-
-<p>Y también hay algunos tipos {{jsxref("Error")}} integrados. Sin embargo, las cosas son mucho más fáciles si nos atenemos al primer diagrama, por lo que discutiremos los tipos enumerados allí por ahora.</p>
-
-<h2 id="Números">Números</h2>
-
-<p>Los números en JavaScript son "valores IEEE 754 de formato de 64 bits de doble precisión", de acuerdo con las especificaciones. <strong><em>No existen números enteros</em></strong> en JavaScript (excepto {{jsxref("BigInt")}}), por lo que debes tener un poco de cuidado. Ve este ejemplo:</p>
-
-<pre class="syntaxbox notranslate">console.log(3 / 2);             // 1.5, <em>not</em> 1
-console.log(Math.floor(3 / 2)); // 1</pre>
-
-<p>Entonces, un <em>entero aparente</em> de hecho <em>implícitamente es un <code>float</code></em>.</p>
-
-<p>Además, ten cuidado con cosas como:</p>
-
-<pre class="brush: js notranslate">0.1 + 0.2 == 0.30000000000000004;
-</pre>
-
-<p>En la práctica, los valores enteros se tratan como enteros de 32 bits, y algunas implementaciones incluso los almacenan de esa manera hasta que se les pide que realicen una instrucción que sea válida en un Número pero no en un entero de 32 bits. Esto puede ser importante para operaciones bit a bit.</p>
-
-<p>Se admiten los {{jsxref("Operators", "operadores", "#Operadores_aritméticos")}} estándar, incluidas la aritmética de suma, resta, módulo (o resto), etc. También hay un objeto incorporado que no mencionamos anteriormente llamado {{jsxref("Math")}} que proporciona funciones matemáticas avanzadas y constantes:</p>
-
-<pre class="brush: js notranslate">Math.sin(3.5);
-var circumference = 2 * Math.PI * r;
-</pre>
-
-<p>Puedes convertir una cadena en un número entero usando la función {{jsxref("Objetos_Globales/parseInt", "parseInt()")}} incorporada. Esta toma la base para la conversión como un segundo argumento opcional, que siempre debes proporcionar:</p>
-
-<pre class="brush: js notranslate">parseInt('123', 10); // 123
-parseInt('010', 10); // 10
-</pre>
-
-<p>En los navegadores más antiguos, se supone que las cadenas que comienzan con un "0" están en octal (raíz 8), pero este no ha sido el caso desde 2013 más o menos. A menos que estés seguro de tu formato de cadena, puedes obtener resultados sorprendentes en esos navegadores más antiguos:</p>
-
-<pre class="brush: js notranslate">parseInt('010');  //  8
-parseInt('0x10'); // 16
-</pre>
-
-<p>Aquí, vemos que la función {{jsxref("Objetos_Globales/parseInt", "parseInt()")}} trata la primera cadena como octal debido al 0 inicial, y la segunda cadena como hexadecimal debido al "0x" inicial. La <em>notación hexadecimal todavía está en su lugar</em>; solo se ha eliminado el octal.</p>
-
-<p>Si deseas convertir un número binario en un entero, simplemente cambia la base:</p>
-
-<pre class="brush: js notranslate">parseInt('11', 2); // 3
-</pre>
-
-<p>De manera similar, puedes analizar números de coma flotante utilizando la función incorporada {{jsxref("Objetos_Globales/parseFloat", "parseFloat()")}}. A diferencia de su primo {{jsxref("Objetos_Globales/parseInt", "parseInt()")}}, <code>parseFloat()</code> siempre usa base 10.</p>
-
-<p>También puedes utilizar el operador <code>+</code> unario para convertir valores en números:</p>
-
-<pre class="brush: js notranslate">+ '42';   // 42
-+ '010';  // 10
-+ '0x10'; // 16
-</pre>
-
-<p>Se devuelve un valor especial llamado {{jsxref("NaN")}} (abreviatura de "Not a Number" o "No es un número") si la cadena no es numérica:</p>
-
-<pre class="brush: js notranslate">parseInt('hello', 10); // NaN
-</pre>
-
-<p><code>NaN</code> es tóxico: si lo proporcionas como operando para cualquier operación matemática, el resultado también será <code>NaN</code>:</p>
-
-<pre class="brush: js notranslate">NaN + 5; // NaN
-</pre>
-
-<p>Puedes probar si un valor es <code>NaN</code> utilizando la función incorporada {{jsxref("Objetos_Globales/isNaN", "isNaN()")}}:</p>
-
-<pre class="brush: js notranslate">isNaN(NaN); // true
-</pre>
-
-<p>JavaScript también tiene los valores especiales {{jsxref("Infinity")}} e <code>-Infinity</code>:</p>
-
-<pre class="brush: js notranslate"> 1 / 0; //  Infinity
--1 / 0; // -Infinity
-</pre>
-
-<p>Puedes probar los valores <code>Infinity</code>, <code>-Infinity</code> y <code>NaN</code> utilizando la función integrada {{jsxref("Objetos_Globales/isFinite", "isFinite()")}}:</p>
-
-<pre class="brush: js notranslate">isFinite(1 / 0); // false
-isFinite(-Infinity); // false
-isFinite(NaN); // false
-</pre>
-
-<div class="note">Las funciones {{jsxref("Objetos_Globales/parseInt", "parseInt()")}} y {{jsxref("Objetos_Globales/parseFloat", "parseFloat()")}} analizan una cadena hasta que alcancen un caracter que no es válido para el formato de número especificado, luego devuelve el número analizado hasta ese punto. Sin embargo, el operador "+" simplemente convierte la cadena a <code>NaN</code> si contiene un caracter no válido. Intenta analizar la cadena "10.2abc" con cada método tú mismo en la consola y comprenderás mejor las diferencias.</div>
-
-<h2 id="Strings">Strings)</h2>
-
-<p>Las cadenas en JavaScript son secuencias de <a href="/es/docs/Web/JavaScript/Guide/Values,_variables,_and_literals#Unicode">caracteres Unicode</a>. Esta debería ser una buena noticia para cualquiera que haya tenido que lidiar con la internacionalización. Exactamente, son secuencias de unidades de código UTF-16; cada unidad de código está representada por un número de 16 bits. Cada caracter Unicode está representado por 1 o 2 unidades de código.</p>
-
-<p>Si deseas representar un solo caracter, simplemente usa una cadena que consta de ese único caracter.</p>
-
-<p>Para encontrar la longitud de una cadena (en unidades de código), accede a su propiedad {{jsxref("Objetos_Globales/String/length", "lenght")}}:</p>
-
-<pre class="brush: js notranslate">'hello'.length; // 5
-</pre>
-
-<p>¡Aquí está nuestra primer pincelada con objetos JavaScript! ¿Mencionamos que también puedes usar cadenas como {{jsxref("Object", "objectos", "", 1)}}? También tienen {{jsxref("String", "métodos", "#Métodos", 1)}} que te permiten manipular la cadena y acceder a información sobre la cadena:</p>
-
-<pre class="brush: js notranslate">'hello'.charAt(0); // "h"
-'hello, world'.replace('world', 'mars'); // "hello, mars"
-'hello'.toUpperCase(); // "HELLO"
-</pre>
-
-<h2 id="Otros_tipos">Otros tipos</h2>
-
-<p>JavaScript distingue entre {{jsxref("null")}}, que es un valor que indica un no valor deliberado (y solo se puede acceder a él mediante la palabra clave <code>null</code>), y {{jsxref("undefined")}}, que es un valor de tipo <code>undefined</code> que indica una variable no iniciada es decir, que aún no se le ha asignado un valor. Hablaremos de variables más adelante, pero en JavaScript es posible declarar una variable sin asignarle un valor. Si hace esto, el tipo de la variable es <code>undefined</code>. <code>undefined</code> en realidad es una constante.</p>
-
-<p>JavaScript tiene un tipo booleano, con valores posibles <code>true</code> y <code>false</code> (ambos son palabras clave). Cualquier valor se puede convertir a booleano de acuerdo con las siguientes reglas:</p>
-
-<ol>
- <li><code>false</code>, <code>0</code>, cadenas vacías (<code>""</code>), <code>NaN</code>, <code>null</code>, y <code>undefined</code> todos se vuelven <code>false.</code></li>
- <li>Todos los demás valores se vuelven <code>true.</code></li>
-</ol>
-
-<p>Puedes realizar esta conversión explícitamente utilizando la función <code>Boolean()</code>:</p>
-
-<pre class="brush: js notranslate">Boolean('');  // false
-Boolean(234); // true
-</pre>
-
-<p>Sin embargo, esto rara vez es necesario, ya que JavaScript realizará silenciosamente esta conversión cuando espera un booleano, como en una declaración <code>if</code> (ve más adelante). Por esta razón, a veces hablamos simplemente de "valores verdaderos" y "valores falsos", es decir, valores que se convierten en <code>true</code> y <code>false</code>, respectivamente, cuando se convierten en booleanos. Alternativamente, estos valores se pueden llamar "veracidad" y "falsedad", respectivamente.</p>
-
-<p>Operaciones booleanas como <code>&amp;&amp;</code> (<em>and</em> lógico), <code>||</code> (<em>or</em> lógico) y <code>!</code> (<em>not</em> lógico) son compatibles; ve más adelante.</p>
-
-<h2 id="Variables">Variables</h2>
-
-<p>Las nuevas variables en JavaScript se declaran utilizando una de tres palabras clave: {{jsxref("Sentencias/let", "let")}}, {{jsxref("Sentencias/const", "const")}} o {{jsxref("Sentencias/var", "var")}}.<br>
- <br>
- <strong><code>let</code></strong> te permite declarar variables a nivel de bloque. La variable declarada está disponible en el <em>bloque</em> en el que está incluida.</p>
-
-<pre class="brush: js notranslate">let a;
-let name = 'Simon';
-</pre>
-
-<p>El siguiente es un ejemplo de alcance con una variable declarada con <code><strong>let</strong></code>:</p>
-
-<pre class="brush: js notranslate">// myLetVariable *no* es visible aquí
-
-for (let myLetVariable = 0; myLetVariable &lt; 5; myLetVariable++) {
-  // myLetVariable solo es visible aquí
-}
-
-// myLetVariable *no* es visible aquí
-
-</pre>
-
-<p><code><strong>const</strong></code> te permite declarar variables cuyos valores pretendes nunca cambiar. La variable está disponible en el <em>bloque</em> en el que se declara.</p>
-
-<pre class="brush: js notranslate">const Pi = 3.14; // establece la variable Pi
-Pi = 1; // arrojará un error porque no puede cambiar una variable constante.</pre>
-
-<p><br>
- <code><strong>var</strong></code> es la palabra clave declarativa más común. No tiene las restricciones que tienen las otras dos palabras clave. Esto se debe a que tradicionalmente era la única forma de declarar una variable en JavaScript. Una variable declarada con la palabra clave <strong><code>var</code></strong> está disponible en la <em>función</em> en la que se declara.</p>
-
-<pre class="brush: js notranslate">var a;
-var name = 'Simon';</pre>
-
-<p>Un ejemplo de ámbito con una variable declarada con <strong><code>var</code>:</strong></p>
-
-<pre class="brush: js notranslate">// myVarVariable *es* visible aquí
-
-for (var myVarVariable = 0; myVarVariable &lt; 5; myVarVariable++) {
-  // myVarVariable es visible para toda la función
-}
-
-// myVarVariable *es* visible aquí
-</pre>
-
-<p>Si declaras una variable sin asignarle ningún valor, su tipo es <code>undefined</code>.</p>
-
-<p>Una diferencia importante entre JavaScript y otros lenguajes como Java es que en JavaScript, los bloques no tienen alcance; solo las funciones tienen alcance. Entonces, si una variable se define usando <code>var</code> en una declaración compuesta (por ejemplo, dentro de una estructura de control <code>if</code>), será visible para toda la función. Sin embargo, a partir de ECMAScript 2015, las declaraciones {{jsxref("Sentencias/let", "let")}} y {{jsxref("Sentencias/const", "const")}} te permiten crear variables con alcance de bloque.</p>
-
-<h2 id="Operadores">Operadores</h2>
-
-<p>Los operadores numéricos de JavaScript son <code>+</code>, <code>-</code>, <code>*</code>, <code>/</code> y <code>%</code> que es el operador de residuo o resto (<a href="/es/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Remainder_%28%29">que es lo mismo que módulo</a>). Los valores se asignan usando <code>=</code>, y también hay declaraciones de asignación compuestas como <code>+=</code> y <code>-=</code>. Estas se extienden hasta <code>x = x <em>operador</em> y</code>.</p>
-
-<pre class="brush: js notranslate">x += 5;
-x = x + 5;
-</pre>
-
-<p>Puedes usar <code>++</code> y <code>--</code> para incrementar y disminuir respectivamente. Estos se pueden utilizar como operadores prefijos o sufijos.</p>
-
-<p>El <a href="/es/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Addition" title="/es/JavaScript/Reference/Operators/String_Operators">operador <code>+</code></a> también hace concatenación de cadenas:</p>
-
-<pre class="brush: js notranslate">'hello' + ' world'; // "hello world"
-</pre>
-
-<p>Si agregas una cadena a un número (u otro valor), todo se convierte primero en cadena. Esto podría hacerte tropezar:</p>
-
-<pre class="brush: js notranslate">'3' + 4 + 5;  // "345"
- 3 + 4 + '5'; // "75"
-</pre>
-
-<p>Agregar una cadena vacía a algo es una forma útil de convertirla en cadena.</p>
-
-<p><a href="/es/docs/Web/JavaScript/Reference/Operators/Comparison_Operators" title="/es/JavaScript/Reference/Operators/Comparison_Operators">Se pueden realizar comparaciones</a> en JavaScript utilizando <code>&lt;</code>, <code>&gt;</code>, <code>&lt;=</code> y <code>&gt;=</code>. Estas funcionan tanto para cadenas como para números. La igualdad es un poco menos sencilla. El operador doble-igual realiza la coerción de tipos si le das diferentes tipos, con resultados a veces interesantes:</p>
-
-<pre class="brush: js notranslate">123 == '123'; // true
-1 == true; // true
-</pre>
-
-<p>Para evitar la coerción de tipos, usa el operador triple-igual:</p>
-
-<pre class="brush: js notranslate">123 === '123'; // false
-1 === true;    // false
-</pre>
-
-<p>También hay operadores <code>!=</code> y <code>!==</code>.</p>
-
-<p>JavaScript también tiene <a href="/es/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators" title="/es/JavaScript/Reference/Operators/Bitwise_Operators">operaciones bit a bit</a>. Si quieres usarlas, ahí están.</p>
-
-<h2 id="Estructuras_de_control">Estructuras de control</h2>
-
-<p>JavaScript tiene un conjunto de estructuras de control similar a otros lenguajes de la familia C. Las declaraciones condicionales son compatibles con <code>if</code> y <code>else</code>; las puedes encadenarlas si lo deseas:</p>
-
-<pre class="brush: js notranslate">var name = 'kittens';
-if (name == 'puppies') {
-  name += ' woof';
-} else if (name == 'kittens') {
-  name += ' meow';
-} else {
-  name += '!';
-}
-name == 'kittens meow';
-</pre>
-
-<p>JavaScript tiene bucles <code>while</code> y bucles <code>do-while</code>. El primero es bueno para bucles básicos; el segundo bucle para donde deseas asegurarte de que el cuerpo del bucle se ejecute por lo menos una vez:</p>
-
-<pre class="brush: js notranslate">while (true) {
-  // ¡un bucle infinito!
-}
-
-var input;
-do {
-  input = get_input();
-} while (inputIsNotValid(input));
-</pre>
-
-<p>El <a href="/es/docs/Web/JavaScript/Reference/Statements/for">bucle <code>for</code></a> de JavaScript es igual que el de C y Java: te permite proporcione la información de control para tu bucle en una sola línea.</p>
-
-<pre class="brush: js notranslate">for (var i = 0; i &lt; 5; i++) {
-  // Se ejecutará 5 veces
-}
-</pre>
-
-<p>JavaScript también contiene otros dos bucles <code>for</code> destacados: <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of"><code>for</code>...<code>of</code></a></p>
-
-<pre class="brush: js notranslate">for (let value of array) {
-  // haz algo con valor
-}
-</pre>
-
-<p>y <a href="/es/docs/Web/JavaScript/Reference/Statements/for...in"><code>for</code>...<code>in</code></a>:</p>
-
-<pre class="brush: js notranslate">for (let property in object) {
-  // hacer algo con la propiedad del objeto
-}
-</pre>
-
-<p>Los operadores <code>&amp;&amp;</code> y <code>||</code> utilizan lógica de cortocircuito, lo cual significa que si ejecutarán su segundo operando depende del primero. Esto es útil para verificar objetos nulos antes de acceder a sus atributos:</p>
-
-<pre class="brush: js notranslate">var name = o &amp;&amp; o.getName();
-</pre>
-
-<p>O para almacenar en caché los valores (cuando los valores falsos no son válidos):</p>
-
-<pre class="brush: js notranslate">var name = cachedName || (cachedName = getName());
-</pre>
-
-<p>JavaScript tiene un operador ternario para expresiones condicionales:</p>
-
-<pre class="brush: js notranslate">var allowed = (age &gt; 18) ? 'yes' : 'no';
-</pre>
-
-<p>La instrucción <code>switch</code> se puede usar para múltiples ramas según un número o cadena:</p>
-
-<pre class="brush: js notranslate">switch (action) {
-  case 'draw':
-    drawIt();
-    break;
-  case 'eat':
-    eatIt();
-    break;
-  default:
-    doNothing();
-}
-</pre>
-
-<p>Si no agregas una instrucción <code>break</code>, la ejecución "caerá" al siguiente nivel. Esto muy rara vez es lo que deseas; de hecho, vale la pena etiquetar específicamente la caída deliberada con un comentario si realmente lo pretendías para ayudar a la depuración:</p>
-
-<pre class="brush: js notranslate">switch (a) {
-  case 1: // caída deliberada
-  case 2:
-    eatIt();
-    break;
-  default:
-    doNothing();
-}
-</pre>
-
-<p>La cláusula <code>default</code> es opcional. Puedes tener expresiones tanto en la parte del switch como en los casos si lo deseas; las comparaciones tienen lugar entre los dos utilizando el operador <code>===</code>:</p>
-
-<pre class="brush: js notranslate">switch (1 + 3) {
-  case 2 + 2:
-    yay();
-    break;
-  default:
-    neverhappens();
-}
-</pre>
-
-<h2 id="Objetos">Objetos</h2>
-
-<p>Los objetos de JavaScript se pueden considerar como simples colecciones de pares nombre-valor. Como tal, son similares a:</p>
-
-<ul>
- <li>Diccionarios en Python.</li>
- <li>Hashes en Perl y Ruby.</li>
- <li>Tablas hash en C y C++.</li>
- <li>HashMaps en Java.</li>
- <li>Arreglos asociativas en PHP.</li>
-</ul>
-
-<p>El hecho de que esta estructura de datos se utilice tan ampliamente es un testimonio de su versatilidad. Dado que todo (el núcleo, tipos bar) en JavaScript es un objeto, cualquier programa de JavaScript implica naturalmente una gran cantidad de búsquedas en tablas hash. ¡Qué bueno que sean tan rápidas!</p>
-
-<p>La parte "name" es una cadena JavaScript, mientras que el valor puede ser cualquier valor de JavaScript, incluidos más objetos. Esto te permite construir estructuras de datos de complejidad arbitraria.</p>
-
-<p>Hay dos formas básicas de crear un objeto vacío:</p>
-
-<pre class="brush: js notranslate">var obj = new Object();
-</pre>
-
-<p>Y:</p>
-
-<pre class="brush: js notranslate">var obj = {};
-</pre>
-
-<p>Estas son semánticamente equivalentes; la segunda se llama sintaxis literal de objeto y es más conveniente. Esta sintaxis también es el núcleo del formato JSON y se debe preferir en todo momento.</p>
-
-<p>La sintaxis de objeto literal se puede utilizar para iniciar un objeto en su totalidad:</p>
-
-<pre class="brush: js notranslate">var obj = {
-  name: 'Carrot',
-  for: 'Max', // 'for' es una palabra reservada, use '_for' en su lugar.
-  details: {
-    color: 'orange',
-    size: 12
-  }
-};
-</pre>
-
-<p>El acceso a los atributos se puede encadenar:</p>
-
-<pre class="brush: js notranslate">obj.details.color; // orange
-obj['details']['size']; // 12
-</pre>
-
-<p>El siguiente ejemplo crea un prototipo de objeto (<code>Person</code>) y una instancia de ese prototipo (<code>you</code>).</p>
-
-<pre class="brush: js notranslate">function Person(name, age) {
-  this.name = name;
-  this.age = age;
-}
-
-// Define un objeto
-var you = new Person('You', 24);
-// Estamos creando una nueva persona llamada "You" de 24 años.
-
-</pre>
-
-<p><strong>Una vez creado</strong>, se puede volver a acceder a las propiedades de un objeto de dos formas:</p>
-
-<pre class="brush: js notranslate">// notación de puntos
-obj.name = 'Simon';
-var name = obj.name;
-</pre>
-
-<p>Y...</p>
-
-<pre class="brush: js notranslate">// notación de corchetes
-obj['name'] = 'Simon';
-var name = obj['name'];
-// puedes usar una variable para definir una clave
-var user = prompt('¿cuál es su clave?')
-obj[user] = prompt('¿cuál es su valor?')
-</pre>
-
-<p>Estas también son semánticamente equivalentes. El segundo método tiene la ventaja de que el nombre de la propiedad se proporciona como una cadena, lo cual significa que se puede calcular en tiempo de ejecución. Sin embargo, el uso de este método evita que se apliquen algunas optimizaciones de minificación y del motor de JavaScript. También se puede utilizar para establecer y obtener propiedades con nombres <a href="/es/docs/Web/JavaScript/Reference/Lexical_grammar#Keywords" title="/es/JavaScript/Reference/Reserved_Words">palabras reservadas</a>:</p>
-
-<pre class="brush: js notranslate">obj.for = 'Simon'; // Error de sintaxis, porque 'for' es una palabra reservada
-obj['for'] = 'Simon'; // trabaja bien
-</pre>
-
-<div class="note">
-<p>A partir de ECMAScript 5, las palabras reservadas se pueden utilizar como nombres de propiedad de objeto "en bruto". Esto significa que no necesitan "vestirse" entre comillas al definir objeto literales. Consulta la <a href="http://es5.github.io/#x7.6.1"> especificación</a> de ES5.</p>
-</div>
-
-<p>Para obtener más información sobre objetos y prototipos, consulta {{jsxref("Objetos_Globales/Object/prototype", "Object.prototype")}}. Para obtener una explicación de los prototipos de objetos y las cadenas de prototipos de objetos, consulta <a href="/es/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">Herencia y la cadena de prototipos</a>.</p>
-
-<div class="note">
-<p>A partir de ECMAScript 2015, las claves de objeto se pueden definir mediante la variable en notación de corchetes al crearlas. <code>{[phoneType]: 12345}</code> es posible en lugar de solo <code>var userPhone = {}; userPhone[phoneType] = 12345</code>.</p>
-</div>
-
-<h2 id="Arreglos">Arreglos</h2>
-
-<p>Los arreglos en JavaScript en son realidad un tipo especial de objeto. Funcionan de manera muy parecida a los objetos normales (las propiedades numéricas se pueden acceder naturalmente solo usando la sintaxis <code>[]</code>) pero tienen una propiedad mágica llamada '<code>length</code>'. Este siempre es uno más que el índice más alto de el arreglo.</p>
-
-<p>Una forma de crear arreglos es la siguiente:</p>
-
-<pre class="brush: js notranslate">var a = new Array();
-a[0] = 'dog';
-a[1] = 'cat';
-a[2] = 'hen';
-a.length; // 3
-</pre>
-
-<p>Una notación más conveniente es usar un arreglo literal:</p>
-
-<pre class="brush: js notranslate">var a = ['dog', 'cat', 'hen'];
-a.length; // 3
-</pre>
-
-<p>Ten en cuenta que <code>array.length</code> no necesariamente es el número de elementos del arreglo. Considera lo siguiente:</p>
-
-<pre class="brush: js notranslate">var a = ['dog', 'cat', 'hen'];
-a[100] = 'fox';
-a.length; // 101
-</pre>
-
-<p>Recuerda — la longitud de el arreglo es uno más que el índice más alto.</p>
-
-<p>Si consultas un índice de arreglo que no existe, obtendrás un valor de <code>undefined</code>:</p>
-
-<pre class="brush: js notranslate">typeof a[90]; // undefined
-</pre>
-
-<p>Si tienes en cuenta lo anterior sobre <code>[]</code> y <code>length</code>, puedes iterar sobre un arreglo utilizando el siguiente bucle <code>for</code>:</p>
-
-<pre class="brush: js notranslate">for (var i = 0; i &lt; a.length; i++) {
-  // Haz algo con a[i]
-}
-</pre>
-
-<p>ES2015 introdujo el bucle más conciso <a href="/es/docs/Web/JavaScript/Reference/Statements/for...of"><code>for</code>...<code>of</code></a> para objetos iterables como arreglos:</p>
-
-<pre class="brush:js notranslate">for (const currentValue of a) {
-  // Haz algo con currentValue
-}</pre>
-
-<p>También puedes iterar sobre un arreglo utilizando el bucle <a href="/es/docs/Web/JavaScript/Reference/Statements/for...in" title="/es/JavaScript/Reference/Statements/for...in"><code>for</code>...<code>in</code></a>, sin embargo, este no itera sobre los elementos del arreglo, sino los índices del arreglo. Además, si alguien agrega nuevas propiedades a <code>Array.prototype</code>, también serán iteradas por dicho bucle. Por lo tanto, este tipo de bucle no se recomienda para arreglos.</p>
-
-<p>Otra forma de iterar sobre un arreglo que se agregó con ECMAScript 5 es {{jsxref("Objetos_Globales/Array/forEach", "arr.forEach()")}}:</p>
-
-<pre class="brush: js notranslate">['dog', 'cat', 'hen'].forEach(function(currentValue, index, array) {
-  // Hacer algo con currentValue o array[index]
-});
-</pre>
-
-<p>Si deseas agregar un elemento a un arreglo, simplemente hazlo así:</p>
-
-<pre class="brush: js notranslate">a.push(item);</pre>
-
-<p>Los arreglos vienen con varios métodos. Consulta también la {{jsxref("Objetos_Globales/Array", "documentación completa para métodos de arreglo")}}.</p>
-
-<table>
- <thead>
-  <tr>
-   <th scope="col">Nombre del método</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><code>a.toString()</code></td>
-   <td>Devuelve una cadena con el <code>toString()</code> de cada elemento separado por comas.</td>
-  </tr>
-  <tr>
-   <td><code>a.toLocaleString()</code></td>
-   <td>Devuelve una cadena con el <code>toLocaleString()</code> de cada elemento separado por comas.</td>
-  </tr>
-  <tr>
-   <td><code>a.concat(item1[, item2[, ...[, itemN]]])</code></td>
-   <td>Devuelve un nuevo arreglo con los elementos agregados.</td>
-  </tr>
-  <tr>
-   <td><code>a.join(sep)</code></td>
-   <td>Convierte el arreglo en una cadena, con valores delimitados por el parámetro <code>sep</code></td>
-  </tr>
-  <tr>
-   <td><code>a.pop()</code></td>
-   <td>Elimina y devuelve el último elemento.</td>
-  </tr>
-  <tr>
-   <td><code>a.push(item1, ..., itemN)</code></td>
-   <td>Agrega elementos al final del arreglo.</td>
-  </tr>
-  <tr>
-   <td><code>a.shift()</code></td>
-   <td>Elimina y devuelve el primer elemento.</td>
-  </tr>
-  <tr>
-   <td><code>a.unshift(item1[, item2[, ...[, itemN]]])</code></td>
-   <td>Añade elementos al inicio del arreglo.</td>
-  </tr>
-  <tr>
-   <td><code>a.slice(start[, end])</code></td>
-   <td>Devuelve un subarreglo.</td>
-  </tr>
-  <tr>
-   <td><code>a.sort([cmpfn])</code></td>
-   <td>Toma una función de comparación opcional.</td>
-  </tr>
-  <tr>
-   <td><code>a.splice(start, delcount[, item1[, ...[, itemN]]])</code></td>
-   <td>Te permite modificar un arreglo eliminando una sección y reemplazándola con más elementos.</td>
-  </tr>
-  <tr>
-   <td><code>a.reverse()</code></td>
-   <td>Invierte el arreglo.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Funciones">Funciones</h2>
-
-<p>Junto con los objetos, las funciones son el componente principal para comprender JavaScript. La función más básica no podría ser mucho más sencilla:</p>
-
-<pre class="brush: js notranslate">function add(x, y) {
-  var total = x + y;
-  return total;
-}
-</pre>
-
-<p>Esto demuestra una función básica. Una función de JavaScript puede tomar 0 o más parámetros con nombre. El cuerpo de la función puede contener tantas declaraciones como desees y puedes declarar tus propias variables que son locales para esa función. La declaración <code>return</code> se puede usar para devolver un valor en cualquier momento, terminando la función. Si no se utiliza una declaración <code>return</code> (o <code>return</code> vacía sin valor), JavaScript devuelve <code>undefined</code>.</p>
-
-<p>Los parámetros nombrados resultan ser más intuitivos que cualquier otra cosa. Puedes llamar a una función sin pasar los parámetros que espera, en cuyo caso se establecerán en <code>undefined</code>.</p>
-
-<pre class="brush: js notranslate">add(); // NaN
-// No puedes realizar sumas en undefined
-</pre>
-
-<p>También puedes pasar más argumentos de los que espera la función:</p>
-
-<pre class="brush: js notranslate">add(2, 3, 4); // 5
-// sumó los dos primeros; el 4 fue ignorado
-</pre>
-
-<p>Eso puede parecer un poco tonto, pero las funciones tienen acceso a una variable adicional dentro de su cuerpo llamada <a href="/es/docs/Web/JavaScript/Reference/Functions/argument" title="/es/JavaScript/Reference/Functions_and_function_scope/arguments"><code>argumentos</code></a>, que es un objeto tipo arreglo que contiene todos los valores pasados a la función. Reescribamos la función de suma para tomar tantos valores como queramos:</p>
-
-<pre class="brush: js notranslate">function add() {
-  var sum = 0;
-  for (var i = 0, j = arguments.length; i &lt; j; i++) {
-    sum += arguments[i];
-  }
-  return sum;
-}
-
-add(2, 3, 4, 5); // 14
-</pre>
-
-<p>Sin embargo, eso no es más útil que escribir <code>2 + 3 + 4 + 5</code>. Creemos una función de promedio:</p>
-
-<pre class="brush: js notranslate">function avg() {
-  var sum = 0;
-  for (var i = 0, j = arguments.length; i &lt; j; i++) {
-    sum += arguments[i];
-  }
-  return sum / arguments.length;
-}
-
-avg(2, 3, 4, 5); // 3.5
-</pre>
-
-<p>Esta es bastante útil, pero parece un poco detallada. Para reducir un poco más este código, podemos considerar la sustitución del uso del arreglo de argumentos a través de la <a href="/es/docs/Web/JavaScript/Reference/Functions/rest_parameters">sintaxis del parámetro <code>Rest</code></a>. De esta manera, podemos pasar cualquier número de argumentos a la función manteniendo nuestro código mínimo. El <strong>operador de parámetro <code>rest</code></strong> se usa en listas de parámetros de función con el formato: <strong>...variable</strong> e incluirá dentro de esa variable la lista completa de argumentos no capturados a los que se llamó la función. <code>with</code>. También reemplazaremos el bucle <strong>for</strong> con un bucle <strong>for...of</strong> para devolver los valores dentro de nuestra variable.</p>
-
-<pre class="brush: js notranslate">function avg(...args) {
-  var sum = 0;
-  for (let value of args) {
-    sum += value;
-  }
-  return sum / args.length;
-}
-
-avg(2, 3, 4, 5); // 3.5
-</pre>
-
-<div class="note">En el código anterior, la variable <strong>args</strong> contiene todos los valores que se pasaron a la función.<br>
-<br>
-Es importante tener en cuenta que dondequiera que se coloque el operador de parámetro <code>rest</code> en una declaración de función, almacenará todos los argumentos <em>después</em> de su declaración, pero no antes. <em>es decir, function</em> <em>avg(</em><strong>firstValue, </strong><em>...args)</em> almacenará el primer valor pasado a la función en la variable <strong>firstValue</strong> y los argumentos restantes en <strong>args</strong>. Esa es otra característica útil del lenguaje, pero nos lleva a un nuevo problema. La función <code>avg() </code> toma una lista de argumentos separados por comas, pero ¿qué sucede si deseas encontrar el promedio de un arreglo? Simplemente, podrías reescribir la función de la siguiente manera:</div>
-
-<pre class="brush: js notranslate">function avgArray(arr) {
-  var sum = 0;
-  for (var i = 0, j = arr.length; i &lt; j; i++) {
-    sum += arr[i];
-  }
-  return sum / arr.length;
-}
-
-avgArray([2, 3, 4, 5]); // 3.5
-</pre>
-
-<p>Pero sería bueno poder reutilizar la función que ya hemos creado. Afortunadamente, JavaScript te permite llamar a una función con un arreglo arbitrario de argumentos, usando el método {{jsxref("Function.apply", "apply()")}} de cualquier objeto función.</p>
-
-<pre class="brush: js notranslate">avg.apply(null, [2, 3, 4, 5]); // 3.5
-</pre>
-
-<p>El segundo argumento de <code>apply()</code> es el arreglo que se utilizará como <code>arguments</code>; el primero se explicará más adelante. Esto enfatiza el hecho de que las funciones también son objetos.</p>
-
-<div class="note">
-<p>Puedes lograr el mismo resultado utilizando el <a href="/es/docs/Web/JavaScript/Reference/Operators/Spread_operator">operador de propagación</a> en la llamada de función.</p>
-
-<p>Por ejemplo: <code>avg(...numbers) </code></p>
-</div>
-
-<p>JavaScript te permite crear funciones anónimas.</p>
-
-<pre class="brush: js notranslate">var avg = function() {
-  var sum = 0;
-  for (var i = 0, j = arguments.length; i &lt; j; i++) {
-    sum += arguments[i];
-  }
-  return sum / arguments.length;
-};
-</pre>
-
-<p>Esto semánticamente es equivalente a la forma <code>function avg()</code>. Es extremadamente poderosa, ya que te permite colocar una definición de función completa en cualquier lugar donde normalmente colocarías una expresión. Esto permite todo tipo de ingeniosos trucos. Aquí hay una forma de "ocultar" algunas variables locales — como alcance de bloque en C:</p>
-
-<pre class="brush: js notranslate">var a = 1;
-var b = 2;
-
-(function() {
-  var b = 3;
-  a += b;
-})();
-
-a; // 4
-b; // 2
-</pre>
-
-<p>JavaScript te permite llamar a funciones de forma recursiva. Esto es particularmente útil para tratar con estructuras de árbol, como las que se encuentran en el DOM del navegador.</p>
-
-<pre class="brush: js notranslate">function countChars(elm) {
-  if (elm.nodeType == 3) { // TEXT_NODE
-    return elm.nodeValue.length;
-  }
-  var count = 0;
-  for (var i = 0, child; child = elm.childNodes[i]; i++) {
-    count += countChars(child);
-  }
-  return count;
-}
-</pre>
-
-<p>Esto resalta un problema potencial con las funciones anónimas: ¿cómo las llama de forma recursiva si no tienen un nombre? JavaScript te permite nombrar expresiones de función para esto. Puedes utilizar {{Glossary("IIFE", "IIFE (expresiones de función invocadas inmediatamente)")}} con nombre como se muestra a continuación:</p>
-
-<pre class="brush: js notranslate">var charsInBody = (function counter(elm) {
-  if (elm.nodeType == 3) { // TEXT_NODE
-    return elm.nodeValue.length;
-  }
-  var count = 0;
-  for (var i = 0, child; child = elm.childNodes[i]; i++) {
-    count += counter(child);
-  }
-  return count;
-})(document.body);
-</pre>
-
-<p>El nombre proporcionado a una expresión de función como arriba solo está disponible para el alcance de la función. Esto permite que el motor realice más optimizaciones y da como resultado un código más legible. El nombre también aparece en el depurador y en algunos seguimientos de la pila, lo cual puede ahorrarte tiempo al depurar.</p>
-
-<p>Ten en cuenta que las funciones de JavaScript en sí mismas son objetos, como todo lo demás en JavaScript, y puedes agregar o cambiar propiedades en ellas tal como hemos visto anteriormente en la sección Objetos.</p>
-
-<h2 id="Objetos_personalizados">Objetos personalizados</h2>
-
-<div class="note">Para obtener una descripción más detallada de la programación orientada a objetos en JavaScript, consulta <a href="/es/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript">Introducción a JavaScript orientado a objetos</a>.</div>
-
-<p>En la programación clásica orientada a objetos, los objetos son colecciones de datos y métodos que operan sobre esos datos. JavaScript es un lenguaje basado en prototipos que no contiene una declaración de clase, como la encontrarías en C++ o Java (esto, a veces es confuso para los programadores acostumbrados a lenguajes con una declaración de clase). En cambio, JavaScript usa funciones como clases. Consideremos un objeto <code>person</code> con campos <code>first</code> y <code>last name</code>. Hay dos formas de mostrar el nombre: como "primero último" o como "último, primero". Usando las funciones y objetos que hemos explicado anteriormente, podríamos mostrar los datos de esta manera:</p>
-
-<pre class="brush: js notranslate">function makePerson(first, last) {
-  return {
-    first: first,
-    last: last
-  };
-}
-function personFullName(person) {
-  return person.first + ' ' + person.last;
-}
-function personFullNameReversed(person) {
-  return person.last + ', ' + person.first;
-}
-
-var s = makePerson('Simon', 'Willison');
-personFullName(s); // "Simon Willison"
-personFullNameReversed(s); // "Willison, Simon"
-</pre>
-
-<p>Esto funciona, pero es bastante feo. Terminas con docenas de funciones en tu espacio de nombres global. Lo que realmente necesitamos es una forma de enlazar una función a un objeto. Dado que las funciones son objetos, esto es fácil:</p>
-
-<pre class="brush: js notranslate">function makePerson(first, last) {
-  return {
-    first: first,
-    last: last,
-    fullName: function() {
-      return this.first + ' ' + this.last;
-    },
-    fullNameReversed: function() {
-      return this.last + ', ' + this.first;
-    }
-  };
-}
-
-var s = makePerson('Simon', 'Willison');
-s.fullName(); // "Simon Willison"
-s.fullNameReversed(); // "Willison, Simon"
-</pre>
-
-<p>Nota sobre la palabra clave <code><a href="/es/docs/Web/JavaScript/Reference/Operators/this" title="/es/JavaScript/Reference/Operators/this">this</a></code>. Usada dentro de una función, <code>this</code> se refiere al objeto actual. Lo que realmente significa está especificado por la forma en que llamaste a esa función. Si lo llamaste usando <a href="/es/docs/Web/JavaScript/Reference/Operators/Object_initializer#Accessing_properties" title="/es/JavaScript/Reference/Operators/Member_Operators">notación de puntos o notación de corchetes</a> en un objeto, ese objeto se convierte en <code>this</code>. Si la notación de puntos no se usó para la llamada, <code>this</code> se refiere al objeto global.</p>
-
-<p>Ten en cuenta que <code>this</code> es una frecuente causa de errores. Por ejemplo:</p>
-
-<pre class="brush: js notranslate">var s = makePerson('Simon', 'Willison');
-var fullName = s.fullName;
-fullName(); // undefined undefined
-</pre>
-
-<p>Cuando llamamos a <code>fullName()</code> solo, sin usar <code>s.fullName()</code>, <code>this</code> está vinculado al objeto global. Debido a que no hay variables globales llamadas <code>first</code> o <code>last</code> obtenemos <code>undefined</code> para cada una.</p>
-
-<p>Podemos aprovechar la palabra clave <code>this</code> para mejorar nuestra función <code>makePerson</code>:</p>
-
-<pre class="brush: js notranslate">function Person(first, last) {
-  this.first = first;
-  this.last = last;
-  this.fullName = function() {
-    return this.first + ' ' + this.last;
-  };
-  this.fullNameReversed = function() {
-    return this.last + ', ' + this.first;
-  };
-}
-var s = new Person('Simon', 'Willison');
-</pre>
-
-<p>Hemos introducido otra palabra clave: <code><a href="/es/docs/Web/JavaScript/Reference/Operators/new" title="/es/JavaScript/Reference/Operators/new">new</a></code>. <code>new</code> está fuertemente relacionado con <code>this</code>. Crea un nuevo objeto vacío y luego llama a la función especificada, con <code>this</code> configurado para ese nuevo objeto. Sin embargo, ten en cuenta que la función especificada con <code>this</code> no devuelve un valor, sino que simplemente modifica el objeto <code>this</code>. Es <code>new</code> que devuelve el objeto <code>this</code> al sitio que realiza la llamada. Las funciones que están diseñadas para ser llamadas por <code>new</code> se denominan funciones constructoras. La práctica común es poner en mayúscula estas funciones como recordatorio para llamarlas con <code>new</code>.</p>
-
-<p>La función mejorada todavía tiene el mismo error al llamar a <code>fullName()</code> sola.</p>
-
-<p>Nuestros objetos <code>person</code> están mejorando, pero todavía tienen algunos bordes desagradables. Cada vez que creamos un objeto <code>person</code>, estamos creando dos nuevos objetos de función dentro de él, ¿no sería mejor si este código fuera compartido?</p>
-
-<pre class="brush: js notranslate">function personFullName() {
-  return this.first + ' ' + this.last;
-}
-function personFullNameReversed() {
-  return this.last + ', ' + this.first;
-}
-function Person(first, last) {
-  this.first = first;
-  this.last = last;
-  this.fullName = personFullName;
-  this.fullNameReversed = personFullNameReversed;
-}
-</pre>
-
-<p>Eso es mejor: estamos creando las funciones como métodos solo una vez y asignándoles referencias dentro del constructor. ¿Podemos hacer algo mejor que eso? La respuesta es sí:</p>
-
-<pre class="brush: js notranslate">function Person(first, last) {
-  this.first = first;
-  this.last = last;
-}
-Person.prototype.fullName = function() {
-  return this.first + ' ' + this.last;
-};
-Person.prototype.fullNameReversed = function() {
-  return this.last + ', ' + this.first;
-};
-</pre>
-
-<p><code>Person.prototype</code> es un objeto compartido por todas las instancias de <code>Person</code>. Forma parte de una cadena de búsqueda (que tiene un nombre especial, "cadena de prototipos"): cada vez que intentes acceder a una propiedad de <code>Person</code> que no esté configurada, JavaScript revisará <code>Person.prototype</code> para ver si esa propiedad existe allí. Como resultado, todo lo asignado a <code>Person.prototype</code> pasa a estar disponible para todas las instancias de ese constructor a través del objeto <code>this</code>.</p>
-
-<p>Esta es una herramienta increíblemente poderosa. JavaScript te permite modificar el prototipo de algo en cualquier momento en tu programa, lo cual significa que —en tiempo de ejecución— puedes agregar métodos adicionales a los objetos existentes:</p>
-
-<pre class="brush: js notranslate">var s = new Person('Simon', 'Willison');
-s.firstNameCaps(); // TypeError en la línea 1: s.firstNameCaps no es una función
-
-Person.prototype.firstNameCaps = function() {
-  return this.first.toUpperCase();
-};
-s.firstNameCaps(); // "SIMON"
-</pre>
-
-<p>Curiosamente, también puedes agregar cosas al prototipo de objetos JavaScript integrados. Agreguemos un método a <code>String</code> que devuelva esa cadena a la inversa:</p>
-
-<pre class="brush: js notranslate">var s = 'Simon';
-s.reversed(); // TypeError en la línea 1: s.reversed no es una función
-
-String.prototype.reversed = function() {
-  var r = '';
-  for (var i = this.length - 1; i &gt;= 0; i--) {
-    r += this[i];
-  }
-  return r;
-};
-
-s.reversed(); // nomiS
-</pre>
-
-<p>¡Nuestro método <code>new<code> funciona incluso con cadenas literales!</code></code></p><code><code>
-
-<pre class="brush: js notranslate">'Esto ahora se puede revertir'.reversed(); // ritrever edeup es aroha otsE
-</pre>
-
-<p>Como se mencionó anteriormente, el prototipo forma parte de una cadena. La raíz de esa cadena es <code>Object.prototype</code>, cuyos métodos incluyen <code>toString()</code>; es este método el que se llama cuando intentas representar un objeto como una cadena. Esto es útil para depurar nuestros objetos <code>Person</code>:</p>
-
-<pre class="brush: js notranslate">var s = new Person('Simon', 'Willison');
-s.toString(); // [object Object]
-
-Person.prototype.toString = function() {
-  return '&lt;Person: ' + this.fullName() + '&gt;';
-}
-
-s.toString(); // "&lt;Person: Simon Willison&gt;"
-</pre>
-
-<p>¿Recuerda cómo <code>avg.apply()</code> tenía un primer argumento <code>null</code>? Ahora lo podemos revisar. El primer argumento de <code>apply()</code> es el objeto que se debe tratar como '<code>this</code>'. Por ejemplo, aquí hay una implementación trivial de <code>new</code>:</p>
-
-<pre class="brush: js notranslate">function trivialNew(constructor, ...args) {
-  var o = {}; // Crea un objeto
-  constructor.apply(o, args);
-  return o;
-}
-</pre>
-
-<p>Esta no es una réplica exacta de <code>new</code> ya que no configura la cadena de prototipos (sería difícil de ilustrar). Esto no es algo que use con mucha frecuencia, pero es útil conocerlo. En este fragmento, <code>...args</code> (incluidos los puntos suspensivos) se denomina "<a href="/es/docs/Web/JavaScript/Reference/Functions/rest_parameters">argumentos rest</a>" — como su nombre indica, contiene el resto de los argumentos.</p>
-
-<p>Llamar a...</p>
-
-<pre class="brush: js notranslate">var bill = trivialNew(Person, 'William', 'Orange');</pre>
-
-<p>...por tanto, casi es equivalente a</p>
-
-<pre class="brush: js notranslate">var bill = new Person('William', 'Orange');</pre>
-
-<p><code>apply()</code> tiene una función hermana llamada {{jsxref("Objetos_Globales/Function/call", "call()")}}, que nuevamente te permite establecer <code>this</code> pero toma una lista de argumentos expandida en lugar de un arreglo.</p>
-
-<pre class="brush: js notranslate">function lastNameCaps() {
-  return this.last.toUpperCase();
-}
-var s = new Person('Simon', 'Willison');
-lastNameCaps.call(s);
-// Es lo mismo que:
-s.lastNameCaps = lastNameCaps;
-s.lastNameCaps(); // WILLISON
-</pre>
-
-<h3 id="Funciones_internas">Funciones internas</h3>
-
-<p>Las declaraciones de función de JavaScript están permitidas dentro de otras funciones. Hemos visto esto una vez antes, con la función <code>makePerson()</code> anterior. Un detalle importante de las funciones anidadas en JavaScript es que pueden acceder a las variables en el alcance de su función padre:</p>
-
-<pre class="brush: js notranslate">function parentFunc() {
-  var a = 1;
-
-  function nestedFunc() {
-    var b = 4; // parentFunc no puede usar esto
-    return a + b;
-  }
-  return nestedFunc(); // 5
-}
-</pre>
-
-<p>Esto proporciona una gran utilidad para escribir un código más fácil de mantener. Si una función llamada se basa en una o dos funciones que no son útiles para ninguna otra parte de tu código, puedes anidar esas funciones de utilidad dentro de ella. Esto mantiene baja la cantidad de funciones que están en el alcance global, lo cual siempre es bueno.</p>
-
-<p>Esto también contrarresta el atractivo de las variables globales. Al escribir código complejo, a menudo es tentador utilizar variables globales para compartir valores entre múltiples funciones, lo que conduce a un código difícil de mantener. Las funciones anidadas pueden compartir variables en su padre, por lo que puedes usar ese mecanismo para unir funciones cuando tenga sentido sin contaminar tu espacio de nombres global — "globales locales" si lo deseas. Esta técnica se debe usar con precaución, pero es una útil habilidad.</p>
-
-<h2 id="Cierres">Cierres</h2>
-
-<p>Esto nos lleva a una de las abstracciones más poderosas que JavaScript tiene para ofrecer — pero potencialmente, también la más confusa. ¿Qué hace esta?</p>
-
-<pre class="brush: js notranslate">function makeAdder(a) {
-  return function(b) {
-    return a + b;
-  };
-}
-var add5 = makeAdder(5);
-var add20 = makeAdder(20);
-add5(6); // ?
-add20(7); // ?
-</pre>
-
-<p>El nombre de la función <code>makeAdder()</code> lo debería revelar: crea nuevas funciones '<code>adder</code>', cada una de las cuales, cuando se llama con un argumento, lo suma al argumento con el que fue creada.</p>
-
-<p>Lo que está sucediendo aquí es más o menos lo mismo que sucedía anteriormente con las funciones internas: una función definida dentro de otra función tiene acceso a las variables de la función externa. La única diferencia aquí es que la función externa ha regresado y, por lo tanto, el sentido común parece dictar que sus variables locales ya no existen. Pero <em>sí</em> existen todavía — de lo contrario, las funciones de suma no podrían funcionar. Además, hay dos diferentes "copias" de las variables locales de <code>makeAdder()</code>: una en la que <code>a</code> es 5 y la otra en la que <code>a</code> es 20. Entonces, el resultado de las llamadas a esa función es el siguiente:</p>
-
-<pre class="brush: js notranslate">add5(6); // returns 11
-add20(7); // devuelve 27
-</pre>
-
-<p>Esto es lo que está sucediendo realmente. Siempre que JavaScript ejecuta una función, se crea un objeto '<code>scope</code>' para contener las variables locales creadas dentro de esa función. Se inicia con cualquier variable pasada como parámetros de función. Esto es similar al objeto global en el que viven todas las variables y funciones globales, pero con un par de importantes diferencias: en primer lugar, se crea un objeto de alcance completamente nuevo cada vez que una función se comienza a ejecutar y, en segundo lugar, a diferencia del objeto global (que es accesible como <code>this</code> y en los navegadores como <code>window</code>) no se puede acceder directamente a estos objetos <code>scope</code> desde tu código JavaScript. No hay ningún mecanismo para iterar sobre las propiedades del objeto <code>scope</code> actual, por ejemplo.</p>
-
-<p>Entonces, cuando se llama a <code>makeAdder()</code>, se crea un objeto <code>scope</code> con una propiedad: <code>a</code>, que es el argumento que se pasa a la función <code>makeAdder()</code>. <code>makeAdder()</code> luego devuelve una función recién creada. Normalmente, el recolector de basura de JavaScript limpiaría el objeto <code>scope</code> creado para <code>makeAdder()</code> en este punto, pero la función devuelta mantiene una referencia a ese objeto de ámbito. Como resultado, el objeto <code>scope</code> no será recolectado como basura hasta que no haya más referencias al objeto función que <code>makeAdder()</code> devolvió.</p>
-
-<p>Los objetos <code>scope</code> forman una cadena llamada cadena de ámbito, similar a la cadena de prototipos utilizada por el sistema de objetos de JavaScript.</p>
-
-<p>Un <strong>cierre</strong> es la combinación de una función y el objeto <code>scope</code> en el que se creó. Los cierres te permiten guardar el estado — como tal, a menudo se pueden usar en lugar de objetos. Puedes encontrar <a href="http://stackoverflow.com/questions/111102/how-do-javascript-closures-work">varias presentaciones excelentes de los cierres</a>.</p></code></code>
diff --git a/files/es/web/javascript/vectores_tipados/index.html b/files/es/web/javascript/vectores_tipados/index.html
deleted file mode 100644
index ba82a49ebd..0000000000
--- a/files/es/web/javascript/vectores_tipados/index.html
+++ /dev/null
@@ -1,272 +0,0 @@
----
-title: Arreglos tipados de JavaScript
-slug: Web/JavaScript/Vectores_tipados
-tags:
-  - Arreglo tipado
-  - Guía
-  - JavaScript
-translation_of: Web/JavaScript/Typed_arrays
----
-<div>{{JsSidebar("Advanced")}}</div>
-
-<p><span class="seoSummary"><strong>Los arreglos tipados en JavaScript</strong> son objetos similares a arreglos que proporcionan un mecanismo para leer y escribir datos binarios sin procesar en búferes de memoria.</span> Como ya sabrás, los objetos {{jsxref("Array", "Arreglo")}} crecen y se encogen dinámicamente y pueden tener cualquier valor de JavaScript. Los motores de JavaScript realizan optimizaciones para que estos arreglos sean rápidos.</p>
-
-<p>Sin embargo, a medida que las aplicaciones web se vuelven cada vez más poderosas, agregando características como manipulación de audio y video, acceso a datos sin procesar usando <code>WebSockets</code>, etc., ha quedado claro que hay momentos en los que sería útil que el código JavaScript pudiera manipular rápida y fácilmente datos binarios sin procesar. Aquí es donde entran en juego los arreglos tipados. Cada entrada en un arreglo tipado de JavaScript es un valor binario sin procesar en uno de los formatos admitidos, desde números enteros de 8 bits hasta números de punto flotante de 64 bits.</p>
-
-<p>Sin embargo, los arreglos tipados <em>no</em> se deben confundir con los arreglos normales, ya que llamar a {{JSxRef("Array.isArray()")}} en un arreglo tipado devuelve <code>false</code>. Además, no todos los métodos disponibles para arreglos normales son compatibles con arreglos tipados (por ejemplo, <code>push</code> y <code>pop</code>).</p>
-
-<h2 id="Búferes_y_vistas_arquitectura_de_los_arreglos_tipados">Búferes y vistas: arquitectura de los arreglos tipados</h2>
-
-<p>Para lograr la máxima flexibilidad y eficiencia, los arreglos de JavaScript dividen la implementación en <em>búferes</em> y <em>vistas</em>. Un búfer (implementado por el objeto {{jsxref("ArrayBuffer")}} es un objeto que representa una porción de datos; no tiene ningún formato del que hablar y no ofrece ningún mecanismo para acceder a su contenido. Para acceder a la memoria contenida en un búfer, necesitas usar una vista. Una vista proporciona un contexto — es decir, un tipo de dato, un desplazamiento inicial y el número de elementos — que convierte los datos en un arreglo tipado.</p>
-
-<p><img alt="Arreglos tipados en ArrayBuffer" src="https://mdn.mozillademos.org/files/8629/typed_arrays.png" style="height: 278px; width: 666px;"></p>
-
-<h3 id="ArrayBuffer"><code>ArrayBuffer</code></h3>
-
-<p>{{jsxref("ArrayBuffer")}} es un tipo de dato que se utiliza para representar un búfer de datos binarios genérico de longitud fija. No puedes manipular directamente el contenido de un <code>ArrayBuffer</code>; en su lugar, crea una vista de arreglo tipado o un {{JSxRef("DataView")}} que representa el búfer en un formato específico, y lo usa para leer y escribir el contenido del búfer.</p>
-
-<h3 id="Vistas_de_arreglos_tipados">Vistas de arreglos tipados</h3>
-
-<p>Las vistas de arreglos tipados tienen nombres autodescriptivos y proporcionan vistas para todos los tipos numéricos habituales tal como <code>Int8</code>, <code>Uint32</code>, <code>Float64</code> y así sucesivamente. Hay una vista de arreglo tipado especial, la <code>Uint8ClampedArray</code>. Esta fija los valores entre 0 y 255. {{JSxRef("../Data_structures", "Tipos de datos JavaScript")}}</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th class="header" scope="col">Tipo</th>
-   <th class="header" scope="col">Intervalo de valores</th>
-   <th class="header" scope="col">Tamaño en bytes</th>
-   <th class="header" scope="col">Descripción</th>
-   <th class="header" scope="col">Tipo de IDL web</th>
-   <th class="header" scope="col">Tipo C equivalente</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{JSxRef("Int8Array")}}</td>
-   <td><code>-128</code> a <code>127</code></td>
-   <td>1</td>
-   <td>Dos enteros complementarios de 8 bits con signo</td>
-   <td><code>byte</code></td>
-   <td><code>int8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Uint8Array")}}</td>
-   <td><code>0</code> a <code>255</code></td>
-   <td>1</td>
-   <td>Entero de 8-bit sin signo</td>
-   <td><code>octet</code></td>
-   <td><code>uint8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Uint8ClampedArray")}}</td>
-   <td><code>0</code> a <code>255</code></td>
-   <td>1</td>
-   <td>Entero de 8 bits sin signo (sujeto)</td>
-   <td><code>octet</code></td>
-   <td><code>uint8_t</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Int16Array")}}</td>
-   <td><code>-32768</code> a <code>32767</code></td>
-   <td>2</td>
-   <td>Dos enteros complementarios de 16 bits con signo</td>
-   <td><code>short</code></td>
-   <td><code>int16_t</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Uint16Array")}}</td>
-   <td><code>0</code> a <code>65535</code></td>
-   <td>2</td>
-   <td>Entero de 16 bits sin signo</td>
-   <td><code>Short sin signo</code></td>
-   <td><code>uint16_t</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Int32Array")}}</td>
-   <td><code>-2147483648</code> a <code>2147483647</code></td>
-   <td>4</td>
-   <td>dos enteros complementarios de 32 bits con signo</td>
-   <td><code>long</code></td>
-   <td><code>int32_t</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Uint32Array")}}</td>
-   <td><code>0</code> a <code>4294967295</code></td>
-   <td>4</td>
-   <td>Enteros de 32 bits sin signo</td>
-   <td><code>long sin signo</code></td>
-   <td><code>uint32_t</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Float32Array")}}</td>
-   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>38</sup></code></td>
-   <td>4</td>
-   <td>Número de coma flotante IEEE de 32 bits (7 dígitos significativos, p. ej., <code>1.1234567</code>)</td>
-   <td><code>float sin restricciones</code></td>
-   <td><code>float</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("Float64Array")}}</td>
-   <td><code>1.2</code><span>×</span><code>10<sup>-38</sup></code> a <code>3.4</code><span>×</span><code>10<sup>308</sup></code></td>
-   <td>8</td>
-   <td>Número de coma flotante IEEE de 64 bits (16 dígitos significativos, p. ej., <code>1.123...15</code>)</td>
-   <td><code>doble sin restricciones</code></td>
-   <td><code>double</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("BigInt64Array")}}</td>
-   <td><code>-2<sup>63</sup></code> a <code>2<sup>63</sup>-1</code></td>
-   <td>8</td>
-   <td>Dos enteros complementarios de 64 bits con signo</td>
-   <td><code>bigint</code></td>
-   <td><code>int64_t (long long con signo)</code></td>
-  </tr>
-  <tr>
-   <td>{{JSxRef("BigUint64Array")}}</td>
-   <td><code>0</code> a <code>2<sup>64</sup>-1</code></td>
-   <td>8</td>
-   <td>Entero de 64 bits sin signo</td>
-   <td><code>bigint</code></td>
-   <td><code>uint64_t (long long sin signo)</code></td>
-  </tr>
- </tbody>
-</table>
-
-<h3 id="DataView"><code>DataView</code></h3>
-
-<p>{{jsxref("DataView")}} es una interfaz de bajo nivel que proporciona una API captadora (<code>getter</code>)/(<code>setter</code>) establecedora para leer y escribir datos arbitrarios en el búfer. Esto es útil cuando se trata de diferentes tipos de datos, por ejemplo. Las vistas de arreglos tipados están en el orden de bytes nativo (consulta {{Glossary("Endianness")}} de tu plataforma. Con un <code>DataView</code> puedes controlar el orden de bytes. Es <code>big-endian</code> de manera predeterminada y se puede establecer en <code>little-endian</code> en los métodos captadores/establecedores.</p>
-
-<h2 id="APIs_web_que_utilizan_arreglos_tipados">APIs web que utilizan arreglos tipados</h2>
-
-<p>Estos son algunos ejemplos de APIs que utilizan arreglos tipados; hay otras, y todo el tiempo surgen más.</p>
-
-<dl>
- <dt>{{Link("/en-US/docs/Web/API/FileReader", "FileReader.prototype.readAsArrayBuffer()", "#readAsArrayBuffer()")}}</dt>
- <dd>El método <code>FileReader.prototype.readAsArrayBuffer()</code> comienza a leer el contenido del {{Link("/es/docs/Web/API/Blob", "Blob")}} o {{Link("/es/docs/Web/API/File", "File")}}.</dd>
- <dt><a href="/en-US/docs/Web/API/XMLHttpRequest#send()" title="/en-US/docs/Web/API/XMLHttpRequest#send()"><code>XMLHttpRequest.prototype.send()</code></a></dt>
- <dd>El método <code>send()</code> de instancias de <code>XMLHttpRequest</code> ahora admiten arreglos tipados y objetos {{JSxRef("ArrayBuffer")}} como argumento.</dd>
- <dt>{{Link("/en-US/docs/Web/API/ImageData", "ImageData.data")}}</dt>
- <dd>Es un {{JSxRef("Uint8ClampedArray")}} que representa un arreglo unidimensional que contiene los datos en el orden RGBA, con valores enteros entre <code>0</code> y <code>255</code> inclusive.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<h3 id="Usar_vistas_con_búferes">Usar vistas con búferes</h3>
-
-<p>En primer lugar, necesitaremos crear un búfer, aquí con una longitud fija de 16 bytes:</p>
-
-<pre class="brush:js notranslate">let buffer = new ArrayBuffer(16);
-</pre>
-
-<p>En este punto, tenemos una porción de memoria cuyos bytes están todos preiniciados a 0. Sin embargo, no hay mucho que podamos hacer con él. Podemos confirmar que de hecho tiene 16 bytes de longitud, y eso es todo:</p>
-
-<pre class="brush:js notranslate">if (buffer.byteLength === 16) {
-  console.log("Sí, son 16 bytes");
-} else {
-  console.log("¡Oh no, es del tamaño incorrecto!");
-}
-</pre>
-
-<p>Antes de que podamos trabajar realmente con este búfer, necesitamos crear una vista. Creemos una vista que trate los datos en el búfer como un arreglo de enteros de 32 bits con signo:</p>
-
-<pre class="brush:js notranslate">let int32View = new Int32Array(buffer);
-</pre>
-
-<p>Ahora podemos acceder a los campos del arreglo como un arreglo normal:</p>
-
-<pre class="brush:js notranslate">for (let i = 0; i &lt; int32View.length; i++) {
-  int32View[i] = i * 2;
-}
-</pre>
-
-<p>Esto completa las 4 entradas en el arreglo (4 entradas de 4 bytes cada una suman 16 bytes en total) con los valores <code>0</code>, <code>2</code>, <code>4</code> y <code>6</code>.</p>
-
-<h3 id="Múltiples_vistas_sobre_los_mismos_datos">Múltiples vistas sobre los mismos datos</h3>
-
-<p>Las cosas comienzan a ponerse realmente interesantes cuando consideras que puedes crear múltiples vistas sobre los mismos datos. Por ejemplo, dado el código anterior, podemos continuar así:</p>
-
-<pre class="brush:js notranslate">let int16View = new Int16Array(buffer);
-
-for (let i = 0; i &lt; int16View.length; i++) {
-  console.log('Entrada ' + i + ': ' + int16View[i]);
-}
-</pre>
-
-<p>Aquí creamos una vista entera de 16 bits que comparte el mismo búfer que la vista existente de 32 bits y sacamos todos los valores en el búfer como enteros de 16 bits. Ahora obtenemos la salida <code>0</code>, <code>0</code>, <code>2</code>, <code>0</code>, <code>4</code>, <code>0</code>, <code>6</code>, <code>0</code>.</p>
-
-<p>Sin embargo, puedes dar un paso más. Considera esto:</p>
-
-<pre class="brush:js notranslate">int16View[0] = 32;
-console.log('La entrada 0 en el arreglo de 32 bits ahora es ' + int32View[0]);
-</pre>
-
-<p>La salida de esto es <code>"La entrada 0 en el arreglo de 32 bits ahora es 32"</code>.</p>
-
-<p>En otras palabras, los dos arreglos se ven simplemente en el mismo búfer de datos, tratándolo como formatos diferentes. Lo puedes hacer con cualquier {{JSxRef("Global_Objects/TypedArray", "tipo de vista", "#TypedArray_objects")}}.</p>
-
-<h3 id="Trabajar_con_complejas_estructuras_de_datos">Trabajar con complejas estructuras de datos</h3>
-
-<p>Al combinar un solo búfer con múltiples vistas de diferentes tipos, comenzando con diferentes desplazamientos en el búfer, puedes interactuar con objetos de datos que contienen múltiples tipos de datos. Esto te permite, por ejemplo, interactuar con complejas estructuras de datos {{Link("/es/docs/Web/WebGL", "WebGL")}}, archivos de datos o estructuras C que necesitas utilizar mientras usas {{Link("/en-US/docs/Mozilla/js-ctypes", "js-ctypes")}}.</p>
-
-<p>Considera esta estructura C:</p>
-
-<pre class="brush:cpp notranslate">struct someStruct {
-  unsigned long id;
-  char username[16];
-  float amountDue;
-};</pre>
-
-<p>Puedes acceder a un búfer que contiene datos en un formato como este:</p>
-
-<pre class="brush:js notranslate">let buffer = new ArrayBuffer(24);
-
-// ... lee los datos en el búfer ...
-
-let idView = new Uint32Array(buffer, 0, 1);
-let usernameView = new Uint8Array(buffer, 4, 16);
-let amountDueView = new Float32Array(buffer, 20, 1);</pre>
-
-<p>Luego puedes acceder, por ejemplo, al monto adeudado con <code>amountDueView[0]</code>.</p>
-
-<div class="note"><strong>Nota</strong>: La {{interwiki("wikipedia", "Data_structure_alignment")}} en una estructura C depende de la plataforma. Toma precauciones y consideraciones para estas diferencias de relleno.</div>
-
-<h3 id="Conversión_a_arreglos_normales">Conversión a arreglos normales</h3>
-
-<p>Después de procesar un arreglo con tipo, a veces es útil volver a convertirla en un arreglo normal para beneficiarse del prototipo {{jsxref("Array")}}. Esto se puede hacer usando {{JSxRef("Array.from()")}}, o usando el siguiente código donde <code>Array.from()</code> no es compatible.</p>
-
-<pre class="brush:js notranslate">let typedArray = new Uint8Array([1, 2, 3, 4]),
-    normalArray = Array.prototype.slice.call(typedArray);
-normalArray.length === 4;
-normalArray.constructor === Array;
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Especificación</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('ESDraft', '#sec-typedarray-objects', 'TypedArray Objects')}}</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_del_navegador">Compatibilidad del navegador</h2>
-
-<div class="hidden">La tabla de compatibilidad de esta página se genera a partir de datos estructurados. Si deseas contribuir con los datos, consulta <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> y envíanos una solicitud de extracción.</div>
-
-<p>{{Compat("javascript.builtins.Int8Array")}}</p>
-
-<h2 id="Ve_también">Ve también</h2>
-
-<ul>
- <li>{{Link("/en-US/docs/Web/JavaScript/Base64_encoding_and_decoding", "Conseguir ArrayBuffers o arreglos tipados a partir de cadenas codificadas en Base64", "#Appendix.3A_Decode_a_Base64_string_to_Uint8Array_or_ArrayBuffer")}}</li>
- <li>{{Link("/en-US/docs/Code_snippets/StringView", "StringView: una representación en C de cadenas basadas en arreglos tipados")}}</li>
- <li><a href="https://hacks.mozilla.org/2011/12/faster-canvas-pixel-manipulation-with-typed-arrays">Rápida manipulación de píxeles en canvas con arreglos tipados</a></li>
- <li><a href="http://www.html5rocks.com/en/tutorials/webgl/typed_arrays">Arreglos tipados: Datos binarios en el navegador</a></li>
- <li>{{Glossary("Endianness")}}</li>
-</ul>
diff --git a/files/es/web/mathml/element/index.html b/files/es/web/mathml/element/index.html
new file mode 100644
index 0000000000..4ca5b301d1
--- /dev/null
+++ b/files/es/web/mathml/element/index.html
@@ -0,0 +1,98 @@
+---
+title: Referencia de elementos de MathML
+slug: Web/MathML/Element
+translation_of: Web/MathML/Element
+original_slug: Web/MathML/Elemento
+---
+<p>A continuación se muestra una lista alfabética de elementos de <strong>presentación</strong> en MathML.<br>
+  La <em>etiqueta de presentación</em> es usada para describir la estructura y el diseño de la notación matemática mientras que la <em>etiqueta de contenido</em> proporciona el significado matemático subyacente y se supone que no se renderiza a través del parseador de MathML (ver {{ bug(276028) }}). Si quieres aprender más sobre la etiqueta de contenido deberías echar un vistazo al <a href="http://www.w3.org/TR/MathML3/chapter4.html" title="http://www.w3.org/TR/MathML3/chapter4.html">Capítulo 4</a> en la <a href="http://www.w3.org/TR/MathML3/" title="http://www.w3.org/TR/MathML3/">especificación de MathML 3</a>.</p>
+<h3 id="math">math</h3>
+<ul>
+  <li>{{ MathMLElement("math") }} (Elemento raíz)</li>
+</ul>
+<h3 id="A">A</h3>
+<ul>
+  <li>{{ MathMLElement("maction") }} (Acciones enlazadas a sub-expresiones)</li>
+  <li>{{ MathMLElement("maligngroup") }} (Grupo de alineación) {{ unimplemented_inline(122253) }}</li>
+  <li>{{ MathMLElement("malignmark") }} (Puntos de alineación) {{ unimplemented_inline(122253) }}</li>
+</ul>
+<h3 id="E">E</h3>
+<ul>
+  <li>{{ MathMLElement("menclose") }} (Enclosed contents)</li>
+  <li>{{ MathMLElement("merror") }} (Enclosed syntax error messages)</li>
+</ul>
+<h3 id="F">F</h3>
+<ul>
+  <li>{{ MathMLElement("mfenced") }} (Paréntesis)</li>
+  <li>{{ MathMLElement("mfrac") }} (Fracción)</li>
+</ul>
+<h3 id="G">G</h3>
+<ul>
+  <li>{{ MathMLElement("mglyph") }} (Mostrar símbolos no estándar) {{ unimplemented_inline(297465) }}</li>
+</ul>
+<h3 id="I">I</h3>
+<ul>
+  <li>{{ MathMLElement("mi") }} (Identificador)</li>
+</ul>
+<h3 id="L">L</h3>
+<ul>
+  <li>{{ MathMLElement("mlabeledtr") }} (Fila etiquetada en una tabla o matriz) {{ unimplemented_inline(689641) }}</li>
+  <li>{{ MathMLElement("mlongdiv") }} (Notación de la división larga) {{ unimplemented_inline(534967) }}</li>
+</ul>
+<h3 id="M">M</h3>
+<ul>
+  <li>{{ MathMLElement("mmultiscripts") }} (Prescripts and tensor indices)</li>
+</ul>
+<h3 id="N">N</h3>
+<ul>
+  <li>{{ MathMLElement("mn") }} (Número)</li>
+</ul>
+<h3 id="O">O</h3>
+<ul>
+  <li>{{ MathMLElement("mo") }} (Operador)</li>
+  <li>{{ MathMLElement("mover") }} (Overscript)</li>
+</ul>
+<h3 id="P">P</h3>
+<ul>
+  <li>{{ MathMLElement("mpadded") }} (Espacio alrrededor del contenido)</li>
+  <li>{{ MathMLElement("mphantom") }} (Contenido invisible con espacio reservado)</li>
+</ul>
+<h3 id="R">R</h3>
+<ul>
+  <li>{{ MathMLElement("mroot") }} (Radical con índice especificado)</li>
+  <li>{{ MathMLElement("mrow") }} (Sub-expressiones agrupadas)</li>
+</ul>
+<h3 id="S">S</h3>
+<ul>
+  <li>{{ MathMLElement("ms") }} (String literal)</li>
+  <li>{{ MathMLElement("mscarries") }} (Annotations such as carries) {{ unimplemented_inline(534967) }}</li>
+  <li>{{ MathMLElement("mscarry") }} (Single carry, child element of {{ MathMLElement("mscarries") }}) {{ unimplemented_inline(534967) }}</li>
+  <li>{{ MathMLElement("msgroup") }} (Grouped rows of {{ MathMLElement("mstack") }} and {{ MathMLElement("mlongdiv") }} elements) {{ unimplemented_inline(534967) }}</li>
+  <li>{{ MathMLElement("msline") }} (Horizontal lines inside {{ MathMLElement("mstack") }} elements) {{ unimplemented_inline(534967) }}</li>
+  <li>{{ MathMLElement("mspace") }} (Space)</li>
+  <li>{{ MathMLElement("msqrt") }} (Square root without an index)</li>
+  <li>{{ MathMLElement("msrow") }} (Rows in {{ MathMLElement("mstack") }} elements) {{ unimplemented_inline(534967) }}</li>
+  <li>{{ MathMLElement("mstack") }} (Stacked alignment) {{ unimplemented_inline(534967) }}</li>
+  <li>{{ MathMLElement("mstyle") }} (Style change)</li>
+  <li>{{ MathMLElement("msub") }} (Subscript)</li>
+  <li>{{ MathMLElement("msup") }} (Superscript)</li>
+  <li>{{ MathMLElement("msubsup") }} (Subscript-superscript pair)</li>
+</ul>
+<h3 id="T">T</h3>
+<ul>
+  <li>{{ MathMLElement("mtable") }} (Table or matrix)</li>
+  <li>{{ MathMLElement("mtd") }} (Cell in a table or a matrix)</li>
+  <li>{{ MathMLElement("mtext") }} (Text)</li>
+  <li>{{ MathMLElement("mtr") }} (Row in a table or a matrix)</li>
+</ul>
+<h3 id="U">U</h3>
+<ul>
+  <li>{{ MathMLElement("munder") }} (Underscript)</li>
+  <li>{{ MathMLElement("munderover") }} (Underscript-overscript pair)</li>
+</ul>
+<h3 id="Other_elements">Other elements</h3>
+<ul>
+  <li>{{ MathMLElement("semantics") }} (Container for semantic annotations)</li>
+  <li><a href="/en-US/docs/MathML/Element/semantics"><code>&lt;annotation&gt;</code></a> (Data annotations)</li>
+  <li><a href="/en-US/docs/MathML/Element/semantics"><code>&lt;annotation-xml&gt;</code></a> (XML annotations)d</li>
+</ul>
diff --git a/files/es/web/mathml/element/math/index.html b/files/es/web/mathml/element/math/index.html
new file mode 100644
index 0000000000..dbaa6a65f6
--- /dev/null
+++ b/files/es/web/mathml/element/math/index.html
@@ -0,0 +1,163 @@
+---
+title: <math>
+slug: Web/MathML/Element/math
+translation_of: Web/MathML/Element/math
+original_slug: Web/MathML/Elemento/math
+---
+<div>{{MathMLRef}}</div>
+
+<p class="summary"><code>&lt;math&gt;</code> es el elemento superior en MathML. Cada instancia válida de MathML debe estar rodeada de etiquetas <code>&lt;math&gt;</code>. Además, no debes anidar un segundo elemento <code>&lt;math&gt;</code> dentro de un primero, pero puedes tener un número arbitrario de otros elementos hijos en él.</p>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Además de los siguientes atributos, el elemento <code>&lt;math&gt;</code> acepta cualquier atributo del elemento {{ MathMLElement("mstyle") }}.</p>
+
+<dl>
+ <dt id="attr-class-id-style">class, id, style</dt>
+ <dd>Disponibles para el uso con <a href="/es/docs/Web/CSS" lang="es" title="es/docs/Web/CSS">hojas de estilo</a>.</dd>
+ <dt id="attr-dir">dir</dt>
+ <dd>La dirección general de las fórmulas. Sus valores posibles son <code>ltr</code> (izquierda a derecha) o bien <code>rtl</code> (derecha a izquierda).</dd>
+ <dt id="attr-href">href</dt>
+ <dd>Usado para definir un hipervínculo a un URI (<strong>I</strong>dentificador de <strong>R</strong>ecurso <strong>U</strong>nificado) especificado.</dd>
+ <dt id="attr-mathbackground">mathbackground</dt>
+ <dd>El color de fondo. Puedes usar <code>#rgb</code>, <code>#rrggbb</code> y <a href="/es/docs/Web/CSS/color_value#Palabras_clave_de_colores" lang="es" title="/es/docs/Web/CSS/color_value">palabras clave de colores</a>.</dd>
+ <dt id="attr-mathcolor">mathcolor</dt>
+ <dd>El color de texto. Puedes usar <code>#rgb</code>, <code>#rrggbb</code> y <a href="/es/docs/Web/CSS/color_value#Palabras_clave_de_colores" lang="es" title="/es/docs/Web/CSS/color_value">palabras clave de colores</a>.</dd>
+ <dt id="attr-display">display</dt>
+ <dd>Este atributo enumerado especifica de qué manera el marcado MathML debería ser renderizado. Puede tomar uno de los siguientes valores:
+ <ul>
+  <li><code>block</code>, el cual indica que este elemento será incluido fuera del fragmento de texto actual , en forma de bloque individual que puede ser posicionado en cualquier sitio sin cambiar el significado del texto;</li>
+  <li><code>inline</code>, el cual indica que este elemento será incluido en el fragmento de texto actual, y no puede ser sacado del mismo sin cambiar el significado del texto.</li>
+ </ul>
+
+ <p>De no estar presente, toma <code>inline</code> por defecto.</p>
+ </dd>
+ <dt id="attr-mode">mode {{deprecated_inline}}</dt>
+ <dd>Deprecado a favor del <a href="/es/docs/MathML/Element/math#attr-display" lang="es">atributo display</a>.<br>
+ Sus valores posibles son: <code>display</code> (que tiene el mismo efecto que <code>display="block"</code>) e <code>inline</code>.</dd>
+ <dt id="attr-overflow">overflow</dt>
+ <dd>Especifica el comportamiento de una expresión si es demasiado larga para caber en el ancho asignado.<br>
+ Sus valores posibles son: <code>linebreak</code> (por defecto), <code>scroll</code>, <code>elide</code>, <code>truncate</code>, <code>scale</code>.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<p><img alt="Theorem of Pythagoras" src="/files/3157/math.jpg"></p>
+
+<h3 id="Notación_HTML5">Notación HTML5</h3>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;MathML en HTML5&lt;/title&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+
+  &lt;math&gt;
+    &lt;mrow&gt;
+      &lt;mrow&gt;
+        &lt;msup&gt;
+          &lt;mi&gt;a&lt;/mi&gt;
+          &lt;mn&gt;2&lt;/mn&gt;
+        &lt;/msup&gt;
+        &lt;mo&gt;+&lt;/mo&gt;
+        &lt;msup&gt;
+          &lt;mi&gt;b&lt;/mi&gt;
+          &lt;mn&gt;2&lt;/mn&gt;
+        &lt;/msup&gt;
+      &lt;/mrow&gt;
+      &lt;mo&gt;=&lt;/mo&gt;
+      &lt;msup&gt;
+        &lt;mi&gt;c&lt;/mi&gt;
+        &lt;mn&gt;2&lt;/mn&gt;
+      &lt;/msup&gt;
+    &lt;/mrow&gt;
+  &lt;/math&gt;
+
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="Notación_XHTML">Notación XHTML</h3>
+
+<pre class="brush: xml">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
+&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd"&gt;
+&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
+&lt;head&gt;
+ &lt;title&gt;MathML en XHTML&lt;/title&gt;
+&lt;/head&gt;
+&lt;body&gt;
+
+  &lt;math xmlns="http://www.w3.org/1998/Math/MathML"&gt;
+    &lt;mrow&gt;
+      &lt;mrow&gt;
+        &lt;msup&gt;
+          &lt;mi&gt;a&lt;/mi&gt;
+          &lt;mn&gt;2&lt;/mn&gt;
+        &lt;/msup&gt;
+        &lt;mo&gt;+&lt;/mo&gt;
+        &lt;msup&gt;
+          &lt;mi&gt;b&lt;/mi&gt;
+          &lt;mn&gt;2&lt;/mn&gt;
+        &lt;/msup&gt;
+      &lt;/mrow&gt;
+      &lt;mo&gt;=&lt;/mo&gt;
+      &lt;msup&gt;
+        &lt;mi&gt;c&lt;/mi&gt;
+        &lt;mn&gt;2&lt;/mn&gt;
+      &lt;/msup&gt;
+    &lt;/mrow&gt;
+  &lt;/math&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p><strong>Notas</strong>: Los documentos XHTML con MathML deben servirse como <code>application/xhtml+xml</code>. Puedes lograrlo facilmente añadiendo la extensión <code>.xhtml</code> a tus archivos locales. Para servidores Apache puedes <a class="external" href="http://httpd.apache.org/docs/2.4/mod/mod_mime.html#addtype">configurar tu archivo <code>.htaccess</code></a> para direccionar extensiones al tipo Mime correcto. Ya que estás escribiendo tu MathML en un archivo XML, asegurate también de escribir un documento XML bien formado.</p>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('MathML3', 'chapter2.html#interf.toplevel', 'The Top-Level math Element') }}</td>
+   <td>{{ Spec2('MathML3') }}</td>
+   <td>Especificación actual</td>
+  </tr>
+  <tr>
+   <td>{{ SpecName('MathML2', 'chapter7.html#interf.toplevel', 'The Top-Level math Element') }}</td>
+   <td>{{ Spec2('MathML2') }}</td>
+   <td>Especificación inicial</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<p> </p>
+
+
+
+<p>{{Compat("mathml.elements.math")}}</p>
+
+<p> </p>
+
+<h2 id="Notas_específicas_a_Firefox">Notas específicas a Firefox</h2>
+
+<p>Firefox 7 introdujo soporte para aceptar todos los atributos MathML en el elemento superior <code>math</code> (por ejemplo, el mismo comportamiento que el elemento {{ MathMLElement("mstyle") }}). Sin embargo, el atributo <code>displaystyle</code> no fue tomado en cuenta y <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=669719">ha sido añadido</a> en Firefox 8.</p>
+
+<p>Texto de respaldo (<code>alttext</code>) o referir a una imagen alternativa usando los atributos <code>altimg</code>, <code>altimg-width</code>, <code>altimg-height</code> o <code>altimg-valign</code> no se encuentra actualmente implementado en Firefox.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li>Elemento <strong>HTML</strong> superior: {{ HTMLElement("html") }}</li>
+ <li>Elemento <strong>SVG</strong> superior: {{ SVGElement("svg") }}</li>
+ <li>Prueba MathML para navegadores: Para <a class="link-https" href="https://www.eyeasme.com/Joe/MathML/MathML_browser_test">XHTML</a> y <a class="link-https" href="https://eyeasme.com/Joe/MathML/HTML5_MathML_browser_test">HTML5</a></li>
+</ul>
diff --git a/files/es/web/mathml/elemento/index.html b/files/es/web/mathml/elemento/index.html
deleted file mode 100644
index aa75307fa3..0000000000
--- a/files/es/web/mathml/elemento/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
----
-title: Referencia de elementos de MathML
-slug: Web/MathML/Elemento
-translation_of: Web/MathML/Element
----
-<p>A continuación se muestra una lista alfabética de elementos de <strong>presentación</strong> en MathML.<br>
-  La <em>etiqueta de presentación</em> es usada para describir la estructura y el diseño de la notación matemática mientras que la <em>etiqueta de contenido</em> proporciona el significado matemático subyacente y se supone que no se renderiza a través del parseador de MathML (ver {{ bug(276028) }}). Si quieres aprender más sobre la etiqueta de contenido deberías echar un vistazo al <a href="http://www.w3.org/TR/MathML3/chapter4.html" title="http://www.w3.org/TR/MathML3/chapter4.html">Capítulo 4</a> en la <a href="http://www.w3.org/TR/MathML3/" title="http://www.w3.org/TR/MathML3/">especificación de MathML 3</a>.</p>
-<h3 id="math">math</h3>
-<ul>
-  <li>{{ MathMLElement("math") }} (Elemento raíz)</li>
-</ul>
-<h3 id="A">A</h3>
-<ul>
-  <li>{{ MathMLElement("maction") }} (Acciones enlazadas a sub-expresiones)</li>
-  <li>{{ MathMLElement("maligngroup") }} (Grupo de alineación) {{ unimplemented_inline(122253) }}</li>
-  <li>{{ MathMLElement("malignmark") }} (Puntos de alineación) {{ unimplemented_inline(122253) }}</li>
-</ul>
-<h3 id="E">E</h3>
-<ul>
-  <li>{{ MathMLElement("menclose") }} (Enclosed contents)</li>
-  <li>{{ MathMLElement("merror") }} (Enclosed syntax error messages)</li>
-</ul>
-<h3 id="F">F</h3>
-<ul>
-  <li>{{ MathMLElement("mfenced") }} (Paréntesis)</li>
-  <li>{{ MathMLElement("mfrac") }} (Fracción)</li>
-</ul>
-<h3 id="G">G</h3>
-<ul>
-  <li>{{ MathMLElement("mglyph") }} (Mostrar símbolos no estándar) {{ unimplemented_inline(297465) }}</li>
-</ul>
-<h3 id="I">I</h3>
-<ul>
-  <li>{{ MathMLElement("mi") }} (Identificador)</li>
-</ul>
-<h3 id="L">L</h3>
-<ul>
-  <li>{{ MathMLElement("mlabeledtr") }} (Fila etiquetada en una tabla o matriz) {{ unimplemented_inline(689641) }}</li>
-  <li>{{ MathMLElement("mlongdiv") }} (Notación de la división larga) {{ unimplemented_inline(534967) }}</li>
-</ul>
-<h3 id="M">M</h3>
-<ul>
-  <li>{{ MathMLElement("mmultiscripts") }} (Prescripts and tensor indices)</li>
-</ul>
-<h3 id="N">N</h3>
-<ul>
-  <li>{{ MathMLElement("mn") }} (Número)</li>
-</ul>
-<h3 id="O">O</h3>
-<ul>
-  <li>{{ MathMLElement("mo") }} (Operador)</li>
-  <li>{{ MathMLElement("mover") }} (Overscript)</li>
-</ul>
-<h3 id="P">P</h3>
-<ul>
-  <li>{{ MathMLElement("mpadded") }} (Espacio alrrededor del contenido)</li>
-  <li>{{ MathMLElement("mphantom") }} (Contenido invisible con espacio reservado)</li>
-</ul>
-<h3 id="R">R</h3>
-<ul>
-  <li>{{ MathMLElement("mroot") }} (Radical con índice especificado)</li>
-  <li>{{ MathMLElement("mrow") }} (Sub-expressiones agrupadas)</li>
-</ul>
-<h3 id="S">S</h3>
-<ul>
-  <li>{{ MathMLElement("ms") }} (String literal)</li>
-  <li>{{ MathMLElement("mscarries") }} (Annotations such as carries) {{ unimplemented_inline(534967) }}</li>
-  <li>{{ MathMLElement("mscarry") }} (Single carry, child element of {{ MathMLElement("mscarries") }}) {{ unimplemented_inline(534967) }}</li>
-  <li>{{ MathMLElement("msgroup") }} (Grouped rows of {{ MathMLElement("mstack") }} and {{ MathMLElement("mlongdiv") }} elements) {{ unimplemented_inline(534967) }}</li>
-  <li>{{ MathMLElement("msline") }} (Horizontal lines inside {{ MathMLElement("mstack") }} elements) {{ unimplemented_inline(534967) }}</li>
-  <li>{{ MathMLElement("mspace") }} (Space)</li>
-  <li>{{ MathMLElement("msqrt") }} (Square root without an index)</li>
-  <li>{{ MathMLElement("msrow") }} (Rows in {{ MathMLElement("mstack") }} elements) {{ unimplemented_inline(534967) }}</li>
-  <li>{{ MathMLElement("mstack") }} (Stacked alignment) {{ unimplemented_inline(534967) }}</li>
-  <li>{{ MathMLElement("mstyle") }} (Style change)</li>
-  <li>{{ MathMLElement("msub") }} (Subscript)</li>
-  <li>{{ MathMLElement("msup") }} (Superscript)</li>
-  <li>{{ MathMLElement("msubsup") }} (Subscript-superscript pair)</li>
-</ul>
-<h3 id="T">T</h3>
-<ul>
-  <li>{{ MathMLElement("mtable") }} (Table or matrix)</li>
-  <li>{{ MathMLElement("mtd") }} (Cell in a table or a matrix)</li>
-  <li>{{ MathMLElement("mtext") }} (Text)</li>
-  <li>{{ MathMLElement("mtr") }} (Row in a table or a matrix)</li>
-</ul>
-<h3 id="U">U</h3>
-<ul>
-  <li>{{ MathMLElement("munder") }} (Underscript)</li>
-  <li>{{ MathMLElement("munderover") }} (Underscript-overscript pair)</li>
-</ul>
-<h3 id="Other_elements">Other elements</h3>
-<ul>
-  <li>{{ MathMLElement("semantics") }} (Container for semantic annotations)</li>
-  <li><a href="/en-US/docs/MathML/Element/semantics"><code>&lt;annotation&gt;</code></a> (Data annotations)</li>
-  <li><a href="/en-US/docs/MathML/Element/semantics"><code>&lt;annotation-xml&gt;</code></a> (XML annotations)d</li>
-</ul>
diff --git a/files/es/web/mathml/elemento/math/index.html b/files/es/web/mathml/elemento/math/index.html
deleted file mode 100644
index c7ecf0f0ab..0000000000
--- a/files/es/web/mathml/elemento/math/index.html
+++ /dev/null
@@ -1,162 +0,0 @@
----
-title: <math>
-slug: Web/MathML/Elemento/math
-translation_of: Web/MathML/Element/math
----
-<div>{{MathMLRef}}</div>
-
-<p class="summary"><code>&lt;math&gt;</code> es el elemento superior en MathML. Cada instancia válida de MathML debe estar rodeada de etiquetas <code>&lt;math&gt;</code>. Además, no debes anidar un segundo elemento <code>&lt;math&gt;</code> dentro de un primero, pero puedes tener un número arbitrario de otros elementos hijos en él.</p>
-
-<h2 id="Atributos">Atributos</h2>
-
-<p>Además de los siguientes atributos, el elemento <code>&lt;math&gt;</code> acepta cualquier atributo del elemento {{ MathMLElement("mstyle") }}.</p>
-
-<dl>
- <dt id="attr-class-id-style">class, id, style</dt>
- <dd>Disponibles para el uso con <a href="/es/docs/Web/CSS" lang="es" title="es/docs/Web/CSS">hojas de estilo</a>.</dd>
- <dt id="attr-dir">dir</dt>
- <dd>La dirección general de las fórmulas. Sus valores posibles son <code>ltr</code> (izquierda a derecha) o bien <code>rtl</code> (derecha a izquierda).</dd>
- <dt id="attr-href">href</dt>
- <dd>Usado para definir un hipervínculo a un URI (<strong>I</strong>dentificador de <strong>R</strong>ecurso <strong>U</strong>nificado) especificado.</dd>
- <dt id="attr-mathbackground">mathbackground</dt>
- <dd>El color de fondo. Puedes usar <code>#rgb</code>, <code>#rrggbb</code> y <a href="/es/docs/Web/CSS/color_value#Palabras_clave_de_colores" lang="es" title="/es/docs/Web/CSS/color_value">palabras clave de colores</a>.</dd>
- <dt id="attr-mathcolor">mathcolor</dt>
- <dd>El color de texto. Puedes usar <code>#rgb</code>, <code>#rrggbb</code> y <a href="/es/docs/Web/CSS/color_value#Palabras_clave_de_colores" lang="es" title="/es/docs/Web/CSS/color_value">palabras clave de colores</a>.</dd>
- <dt id="attr-display">display</dt>
- <dd>Este atributo enumerado especifica de qué manera el marcado MathML debería ser renderizado. Puede tomar uno de los siguientes valores:
- <ul>
-  <li><code>block</code>, el cual indica que este elemento será incluido fuera del fragmento de texto actual , en forma de bloque individual que puede ser posicionado en cualquier sitio sin cambiar el significado del texto;</li>
-  <li><code>inline</code>, el cual indica que este elemento será incluido en el fragmento de texto actual, y no puede ser sacado del mismo sin cambiar el significado del texto.</li>
- </ul>
-
- <p>De no estar presente, toma <code>inline</code> por defecto.</p>
- </dd>
- <dt id="attr-mode">mode {{deprecated_inline}}</dt>
- <dd>Deprecado a favor del <a href="/es/docs/MathML/Element/math#attr-display" lang="es">atributo display</a>.<br>
- Sus valores posibles son: <code>display</code> (que tiene el mismo efecto que <code>display="block"</code>) e <code>inline</code>.</dd>
- <dt id="attr-overflow">overflow</dt>
- <dd>Especifica el comportamiento de una expresión si es demasiado larga para caber en el ancho asignado.<br>
- Sus valores posibles son: <code>linebreak</code> (por defecto), <code>scroll</code>, <code>elide</code>, <code>truncate</code>, <code>scale</code>.</dd>
-</dl>
-
-<h2 id="Ejemplos">Ejemplos</h2>
-
-<p><img alt="Theorem of Pythagoras" src="/files/3157/math.jpg"></p>
-
-<h3 id="Notación_HTML5">Notación HTML5</h3>
-
-<pre class="brush: html">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-  &lt;head&gt;
-    &lt;title&gt;MathML en HTML5&lt;/title&gt;
-  &lt;/head&gt;
-  &lt;body&gt;
-
-  &lt;math&gt;
-    &lt;mrow&gt;
-      &lt;mrow&gt;
-        &lt;msup&gt;
-          &lt;mi&gt;a&lt;/mi&gt;
-          &lt;mn&gt;2&lt;/mn&gt;
-        &lt;/msup&gt;
-        &lt;mo&gt;+&lt;/mo&gt;
-        &lt;msup&gt;
-          &lt;mi&gt;b&lt;/mi&gt;
-          &lt;mn&gt;2&lt;/mn&gt;
-        &lt;/msup&gt;
-      &lt;/mrow&gt;
-      &lt;mo&gt;=&lt;/mo&gt;
-      &lt;msup&gt;
-        &lt;mi&gt;c&lt;/mi&gt;
-        &lt;mn&gt;2&lt;/mn&gt;
-      &lt;/msup&gt;
-    &lt;/mrow&gt;
-  &lt;/math&gt;
-
-  &lt;/body&gt;
-&lt;/html&gt;
-</pre>
-
-<h3 id="Notación_XHTML">Notación XHTML</h3>
-
-<pre class="brush: xml">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
-&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/Math/DTD/mathml2/xhtml-math11-f.dtd"&gt;
-&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
-&lt;head&gt;
- &lt;title&gt;MathML en XHTML&lt;/title&gt;
-&lt;/head&gt;
-&lt;body&gt;
-
-  &lt;math xmlns="http://www.w3.org/1998/Math/MathML"&gt;
-    &lt;mrow&gt;
-      &lt;mrow&gt;
-        &lt;msup&gt;
-          &lt;mi&gt;a&lt;/mi&gt;
-          &lt;mn&gt;2&lt;/mn&gt;
-        &lt;/msup&gt;
-        &lt;mo&gt;+&lt;/mo&gt;
-        &lt;msup&gt;
-          &lt;mi&gt;b&lt;/mi&gt;
-          &lt;mn&gt;2&lt;/mn&gt;
-        &lt;/msup&gt;
-      &lt;/mrow&gt;
-      &lt;mo&gt;=&lt;/mo&gt;
-      &lt;msup&gt;
-        &lt;mi&gt;c&lt;/mi&gt;
-        &lt;mn&gt;2&lt;/mn&gt;
-      &lt;/msup&gt;
-    &lt;/mrow&gt;
-  &lt;/math&gt;
-
-&lt;/body&gt;
-&lt;/html&gt;</pre>
-
-<p><strong>Notas</strong>: Los documentos XHTML con MathML deben servirse como <code>application/xhtml+xml</code>. Puedes lograrlo facilmente añadiendo la extensión <code>.xhtml</code> a tus archivos locales. Para servidores Apache puedes <a class="external" href="http://httpd.apache.org/docs/2.4/mod/mod_mime.html#addtype">configurar tu archivo <code>.htaccess</code></a> para direccionar extensiones al tipo Mime correcto. Ya que estás escribiendo tu MathML en un archivo XML, asegurate también de escribir un documento XML bien formado.</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<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('MathML3', 'chapter2.html#interf.toplevel', 'The Top-Level math Element') }}</td>
-   <td>{{ Spec2('MathML3') }}</td>
-   <td>Especificación actual</td>
-  </tr>
-  <tr>
-   <td>{{ SpecName('MathML2', 'chapter7.html#interf.toplevel', 'The Top-Level math Element') }}</td>
-   <td>{{ Spec2('MathML2') }}</td>
-   <td>Especificación inicial</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
-
-<p> </p>
-
-
-
-<p>{{Compat("mathml.elements.math")}}</p>
-
-<p> </p>
-
-<h2 id="Notas_específicas_a_Firefox">Notas específicas a Firefox</h2>
-
-<p>Firefox 7 introdujo soporte para aceptar todos los atributos MathML en el elemento superior <code>math</code> (por ejemplo, el mismo comportamiento que el elemento {{ MathMLElement("mstyle") }}). Sin embargo, el atributo <code>displaystyle</code> no fue tomado en cuenta y <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=669719">ha sido añadido</a> en Firefox 8.</p>
-
-<p>Texto de respaldo (<code>alttext</code>) o referir a una imagen alternativa usando los atributos <code>altimg</code>, <code>altimg-width</code>, <code>altimg-height</code> o <code>altimg-valign</code> no se encuentra actualmente implementado en Firefox.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li>Elemento <strong>HTML</strong> superior: {{ HTMLElement("html") }}</li>
- <li>Elemento <strong>SVG</strong> superior: {{ SVGElement("svg") }}</li>
- <li>Prueba MathML para navegadores: Para <a class="link-https" href="https://www.eyeasme.com/Joe/MathML/MathML_browser_test">XHTML</a> y <a class="link-https" href="https://eyeasme.com/Joe/MathML/HTML5_MathML_browser_test">HTML5</a></li>
-</ul>
diff --git a/files/es/web/media/dash_adaptive_streaming_for_html_5_video/index.html b/files/es/web/media/dash_adaptive_streaming_for_html_5_video/index.html
new file mode 100644
index 0000000000..5b62a5f4ad
--- /dev/null
+++ b/files/es/web/media/dash_adaptive_streaming_for_html_5_video/index.html
@@ -0,0 +1,78 @@
+---
+title: Transmisión Adaptativa DASH para Video en HTML 5
+slug: Web/Media/DASH_Adaptive_Streaming_for_HTML_5_Video
+translation_of: Web/Media/DASH_Adaptive_Streaming_for_HTML_5_Video
+original_slug: Web/HTML/Transision_adaptativa_DASH
+---
+<p><span class="seoSummary">La Transmisión Adaptable y Dinámica sobre HTTP (DASH - <em>Dynamic Adaptive Streaming over HTTP</em>) es un protocolo de transmisión adaptable.  Esto signfica que le permite a un flujo de vídeo cambiar entre diversas tazas de bits con base en el desempeño de la red, para mantener la reproducción de un vídeo.</span></p>
+
+<h2 id="Soporte_de_Navegadores">Soporte de Navegadores</h2>
+
+<p>Firefox 21 incluye una implementación de DASH para video WebM con HTML5 que está desactivada por defecto. Se puede activar a través de "about:config" activando la opción "media.dash.enabled".</p>
+
+<p>Firefox 23 eliminó el soporte para DASH para WebM con HTML 5.  Ésta será reemplazada por una implementación de la <a href="http://www.w3.org/TR/media-source/">Media Source Extensions API </a>que de soporte a DASH a través de javascript usando librerías como dash.js. Ver el bug <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=778617">778617</a> para más detalles.</p>
+
+<h2 id="Usando_DASH_del_lado_del_servidor">Usando DASH del lado del servidor</h2>
+
+<p>Lo primero que necesitas es convertir tu video WebM en un manifiesto DASH con todos los archivos en los diferentes bitrates. Para comenzar necesitas:</p>
+
+<ul>
+ <li>ffpmeg - con libvpx y libvorbis activado para dar soporte al audio y video de WebM (<a href="http://www.ffmpeg.org/" title="http://www.ffmpeg.org/">ffmpeg.org</a>).</li>
+ <li>libwebm - concretamente para la herramienta samplemuxer (<span style="text-align: -webkit-auto;"><span style="white-space: pre-wrap;">git clone <a href="https://gerrit.chromium.org/gerrit/p/webm/libwebm.git">https://gerrit.chromium.org/gerrit/p/webm/libwebm.git</a>)</span></span>.</li>
+ <li>webm-tools - concretamente para la herramienta de creación de manifiestos, webm_dash_manifest (<span style="text-align: -webkit-auto;"><span style="white-space: pre-wrap;">git clone <a href="https://gerrit.chromium.org/gerrit/p/webm/webm-tools.git">https://gerrit.chromium.org/gerrit/p/webm/webm-tools.git</a>)</span></span>.</li>
+</ul>
+
+<h3 id="1._Use_your_existing_WebM_file_to_create_one_audio_file_and_multiple_video_files.">1. Use your existing WebM file to create one audio file and multiple video files.</h3>
+
+<p>Por ejemplo:</p>
+
+<p>Creamos el archivo de audio usando:</p>
+
+<pre><code>ffmpeg -i my_master_file.webm -vn -acodec libvorbis -ab 128k my_audio.webm</code></pre>
+
+<p>Creamos los archivos de vídeo usando:</p>
+
+<pre><code>ffmpeg -i my_master_file.webm -vcodec libvpx -vb 250k -keyint_min 150 -g 150 -an my_video-250kbps.webm
+ffmpeg -i my_master_file.webm -vcodec libvpx -vb 100k -keyint_min 150 -g 150 -an my_video-100kbps.webm
+ffmpeg -i my_master_file.webm -vcodec libvpx -vb 50k -keyint_min 150 -g 150 -an my_video-50kbps.webm</code></pre>
+
+<h3 id="2._Align_the_clusters_to_enable_switching_at_cluster_boundaries.">2. Align the clusters to enable switching at cluster boundaries.</h3>
+
+<p>For video:</p>
+
+<pre><code>samplemuxer -i my_video-250kbps.webm -o my_video-250kbps-final.webm</code>
+<code>etc.</code></pre>
+
+<p>Although we don't switch audio streams, it's still necessary to run it through samplemuxer to ensure a cues element is added. Note: to be compatible with playing on Chrome, it is suggested to change the track number to something other than the one in the video files, most likely 0.</p>
+
+<pre><code>samplemuxer -i my_audio.webm -o my_audio-final.webm -output_cues 1 -cues_on_audio_track 1 -max_cluster_duration 2 -audio_track_number</code></pre>
+
+<h3 id="3._Create_the_manifest_file">3. Create the manifest file:</h3>
+
+<pre><code>webm_dash_manifest -o my_video_manifest.mpd \
+  -as id=0,lang=eng \
+  -r id=0,file=my_video-250kbps-final.webm \
+  -r id=1,file=my_video-100kbps-final.webm \
+  -r id=2,file=my_video-50kbps-final.webm \
+  -as id=1,lang=eng \
+  -r id=4,file=my_audio-final.webm</code></pre>
+
+<p>Put the manifest and the associated video files on your web server or CDN. DASH works via HTTP, so as long as your HTTP server supports byte range requests, and it's set up to serve .mpd files with mimetype="application/dash+xml", then you're all set.</p>
+
+<h2 id="Using_DASH_-_Client_Side">Using DASH - Client Side</h2>
+
+<p>You'll want to modify your web page to point to the DASH manifest first, instead of directly to a particular video file:</p>
+
+<pre class="brush: html">&lt;video&gt;
+  &lt;source src="movie.<span class="ZmSearchResult" id="DWT648"><span class="ZmSearchResult" id="DWT650">mpd</span></span>"&gt;
+  &lt;source src="movie.webm"&gt;
+  Your browser does not support the video tag.
+&lt;/video&gt;</pre>
+
+<p>That's it! If DASH is supported by the browser, your video will now stream adaptively.</p>
+
+<h2 id="Links">Links</h2>
+
+<p><a href="http://wiki.webmproject.org/adaptive-streaming/webm-dash-specification" title="http://wiki.webmproject.org/adaptive-streaming/webm-dash-specification">WebM DASH Specification at The WebM Project</a></p>
+
+<p><a href="http://dashif.org/" title="http://dashif.org/">DASH Industry Forum</a></p>
diff --git a/files/es/web/opensearch/index.html b/files/es/web/opensearch/index.html
new file mode 100644
index 0000000000..c2e6b7d1c9
--- /dev/null
+++ b/files/es/web/opensearch/index.html
@@ -0,0 +1,155 @@
+---
+title: Creacion de plugins OpenSearch para Firefox
+slug: Web/OpenSearch
+tags:
+  - Agregados
+  - Complementos
+  - OpenSearch
+  - Plugins
+  - Plugins_de_búsqueda
+  - para_revisar
+translation_of: Web/OpenSearch
+original_slug: Creacion_de_plugins_OpenSearch_para_Firefox
+---
+<p> </p>
+<h2 id="OpenSearch" name="OpenSearch">OpenSearch</h2>
+<p><a href="es/Firefox_2">Firefox 2</a> admite el formato de descripción <a class="external" href="http://opensearch.org/">OpenSearch</a> para complementos (<em>plugins</em>) de búsqueda. Aquellos complementos que usen <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1#OpenSearch_description_document">la sintaxis OpenSearch</a> son compatibles con Firefox e Internet Explorer 7. Por ello es el formato recomendado para cualquier nuevo desarrollo.</p>
+<p>Firefox admite además capacidades de búsqueda adicionales no incluidas en <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1#OpenSearch_description_document">la sintaxis de descripción OpenSearch</a>, tales como las "sugerencias de búsqueda" y el elemento <code>SearchForm</code>. Este artículo se centrará en la creación de complementos compatibles con OpenSearch que empleen estas capacidades adicionales de Firefox.</p>
+<p>Además, los ficheros de descripción OpenSearch pueden ser anunciados dentro de una página HTML de forma que puedan ser descubiertos automáticamente por el navegador (esto se describe en <a href="#Autodiscovery_of_search_plugins">Detección automática de motores de búsqueda</a>.</p>
+<p>Por último, estos complementos, pueden ser instalados mediante código tal y como se describe en <a href="es/A%c3%b1adir_motores_de_b%c3%basqueda_desde_p%c3%a1ginas_web">Añadir motores de búsqueda desde páginas web</a>.</p>
+<h2 id="El_fichero_de_descripci.C3.B3n_OpenSearch" name="El_fichero_de_descripci.C3.B3n_OpenSearch">El fichero de descripción OpenSearch</h2>
+<p>El fichero XML que describe un motor de búsqueda es bastante sencillo, tal y como se puede ver en la plantilla básica que se muestra más abajo. Las secciones en negrita deben ser personalizadas basándonos en las necesidades particulares del motor para el que estamos escribiendo nuestro complemento.</p>
+<pre class="eval">&lt;OpenSearchDescription xmlns="<span class="nowiki">http://a9.com/-/spec/opensearch/1.1/</span>"
+                       xmlns:moz="<span class="nowiki">http://www.mozilla.org/2006/browser/search/</span>"&gt;
+&lt;ShortName&gt;<strong>engineName</strong>&lt;/ShortName&gt;
+&lt;Description&gt;<strong>engineDescription</strong>&lt;/Description&gt;
+&lt;InputEncoding&gt;<strong>inputEncoding</strong>&lt;/InputEncoding&gt;
+&lt;Image width="16" height="16"&gt;data:image/x-icon;base64,<strong>imageData</strong>&lt;/Image&gt;
+&lt;Url type="text/html" method="<strong>method</strong>" template="<strong>searchURL</strong>"&gt;
+  &lt;Param name="<strong>paramName1</strong>" value="<strong>paramValue1</strong>"/&gt;
+  ...
+  &lt;Param name="<strong>paramNameN</strong>" value="<strong>paramValueN</strong>"/&gt;
+&lt;/Url&gt;
+&lt;Url type="application/x-suggestions+json" template="<strong>suggestionURL</strong>"/&gt;
+&lt;moz:SearchForm&gt;<strong>searchFormURL</strong>&lt;/moz:SearchForm&gt;
+&lt;/OpenSearchDescription&gt;
+</pre>
+<dl>
+ <dt>
+  <strong>ShortName</strong></dt>
+ <dd>
+  Nombre corto para el motor de búsqueda.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>Description</strong></dt>
+ <dd>
+  Descripción del motor de búsqueda.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>InputEncoding</strong></dt>
+ <dd>
+  Codificación de caracteres a emplear en los datos que se envían al motor de búsqueda. Por ejemplo, "UTF-8".</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>Image</strong></dt>
+ <dd>
+  Icono de 16x16 codificado en Base-64 que represente al motor de búsqueda. Puedes encontrar una utilidad para generar estos datos en: <a class="external" href="http://software.hixie.ch/utilities/cgi/data/data">The data: URI kitchen</a>.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>Url</strong></dt>
+ <dd>
+  Describe la(s) URL(s) a emplear para la búsqueda. El atributo <code>method</code> indica si se debe emplear una petición <code>GET</code> o <code>POST</code> para obtener los resultados.</dd>
+</dl>
+<dl>
+ <dd>
+  <div class="note">
+   <strong>Nota:</strong> Internet Explorer 7 no admite peticiones <code>POST</code>.</div>
+ </dd>
+</dl>
+<dl>
+ <dd>
+  Firefox admite dos tipos de URL en el campo <code>type</code>:</dd>
+</dl>
+<ul>
+ <li><code>type="text/html"</code> se usa al especificar la URL a donde se va a enviar la petición de búsqueda.</li>
+ <li><code>type="application/x-suggestions+json"</code> se usa al especificar la URL de donde se van a obtener las sugerencias de búsqueda.</li>
+</ul>
+<dl>
+ <dd>
+  El atributo <code>template</code> indica la forma en que se construirá la URL para la consulta. Dentro de este atributo se pueden introducir plantillas que se expanden de forma dinámica; la más habitual es <code>{searchTerms}</code>, la cual se expande a los términos de búsqueda introducidos por el usuario en la barra de búsquedas. En <a class="external" href="http://www.opensearch.org/Specifications/OpenSearch/1.1/Draft_3#OpenSearch_1.1_parameters">OpenSearch 1.1 parameters</a> se describen los otros tipos admitidos.</dd>
+</dl>
+<dl>
+ <dd>
+  Para consultas que devuelven sugerencias de búsqueda, la URL descrita en <code>template</code> se usa para obtener una lista de sugerencias en el formato JSON (JavaScript Object Notation). Para saber más sobre como incorporar sugerencias de búsqueda en el lado del servidor, ver <a href="es/Permitir_sugerencias_en_los_plugins_de_b%c3%basqueda">Permitir sugerencias en los plugins de búsqueda</a>.</dd>
+</dl>
+<p><img alt="Image:SearchSuggestionSample.png"></p>
+<dl>
+ <dt>
+  <strong>Param</strong></dt>
+ <dd>
+  Los parámetros que es necesario suministrar junto con la consulta, en la forma de pares clave/valor. En los valores es posible emplear las plantillas dinámicas presentadas anteriormente; por ejemplo, se puede usar <code>{searchTerms}</code> para insertar los términos de búsqueda que el usuario introdujo en la barra de búsquedas.</dd>
+</dl>
+<dl>
+ <dd>
+  <div class="note">
+   <strong>Nota:</strong> Internet Explorer 7 no admite este elemento.</div>
+ </dd>
+</dl>
+<dl>
+ <dt>
+  <strong>SearchForm</strong></dt>
+ <dd>
+  La URL donde se encuentra la página de búsquedas del sitio al que hace referencia el complemento que estamos desarrollando. Esto permite al usuario acceder directamente al sitio web en cuestión.</dd>
+ <dd>
+  <div class="note">
+   <strong>Nota:</strong> Dado que este elemento es específico de Firefox y no forma parte de la especificación OpenSearch, en el ejemplo anterior, usamos el prefijo "<code>moz:</code>" en el espacio de nombres XML para asegurarnos que otros agentes de usuario que no admiten este elemento puedan ignoralo de forma segura.</div>
+ </dd>
+</dl>
+<h2 id="Detecci.C3.B3n_autom.C3.A1tica_de_complementos_de_b.C3.BAsqueda" name="Detecci.C3.B3n_autom.C3.A1tica_de_complementos_de_b.C3.BAsqueda">Detección automática de complementos de búsqueda</h2>
+<p>Un sitio web que ofrezca un complemento de búsqueda puede anunciarlo, de forma que los usuarios de Firefox puedan descargarlo e instalarlo fácilmente.</p>
+<p>Para incorporar la detección automática, sólo es necesario añadir una línea a la sección <code>&lt;head&gt;</code> de la página:</p>
+<pre class="eval">&lt;link rel="search" type="application/opensearchdescription+xml" title="<em>searchTitle</em>" href="<em>pluginURL</em>"&gt;
+</pre>
+<p>Sustituiremos los elementos en itálica tal y como se explica a continuación:</p>
+<dl>
+ <dt>
+  <strong>searchTitle</strong></dt>
+ <dd>
+  El título de la búsqueda que se va a llevar a cabo; por ejemplo, "Buscar en MDC" o "Búsqueda en Google". Este valor debe coincidir con el <code>ShortName</code> de nuestro complemento.</dd>
+</dl>
+<dl>
+ <dt>
+  <strong>pluginURL</strong></dt>
+ <dd>
+  La URL que debe emplear el navegador para descargar el fichero XML con la descripción del complemento.</dd>
+</dl>
+<p>Si tu sitio ofrece múltiples complementos de búsqueda también es posible que el navegador los descubra de forma automática; basta con repetir el <code>link</code> las veces que sea necesario. Por ejemplo:</p>
+<pre class="eval">&lt;link rel="search" type="application/opensearchdescription+xml" title="MiSitio: Por Autor" href="<a class="external" href="http://www.misitio.com/autores.xml" rel="freelink">http://www.misitio.com/autores.xml</a>"&gt;
+&lt;link rel="search" type="application/opensearchdescription+xml" title="MiSitio: Por Título" href="<a class="external" href="http://www.misitio.com/titulos.xml" rel="freelink">http://www.misitio.com/titulos.xml</a>"&gt;
+</pre>
+<p>De esta forma podemos ofrecer complementos independientes para buscar tanto por autor como por título.</p>
+<h2 id="Resoluci.C3.B3n_de_problemas" name="Resoluci.C3.B3n_de_problemas">Resolución de problemas</h2>
+<p>Si hay algún error en el fichero XML que describe el complemento, seguramente habrá problemas al añadir en Firefox 2 un complemento descubierto automáticamente. El mensaje de error puede no ser de mucha ayuda, así que los siguientes consejos pueden ayudar a encontrar la causa del problema.</p>
+<ul>
+ <li>Asegúrate de que el documento XML de tu complemento está bien formado. Puedes comprobarlo cargando el fichero directamente en Firefox. Los <em>Ampersands</em> en la plantilla de la URL deben ser escapadas con &amp;amp; y las etiquetas (<em>tags</em>) deben ser cerradas con una barra (<code>/</code>) al final o con la correspondiente etiqueta de cierre.</li>
+ <li>El atributo <code>xmlns</code> es importante. Sin él, puedes obtener un mensaje de error indicando que "Firefox no pudo descargar el motor de búsqueda desde: (URL)".</li>
+ <li>Ten en cuente que <strong>debes</strong> incluir una URL del tipo <code>text/html</code> — los complmentos que sólo incluyan URLs del tipo Atom o <a href="es/RSS">RSS</a> (lo cual es válido, pero Firefox no admite) producirán el error "no pudo descargar el motor de búsqueda".</li>
+ <li>Los <em>favicons</em> obtenidos remotamente no deben ser mayores de 10KB (ver {{ Bug(361923) }}).</li>
+</ul>
+<p>Adicionalmente, el servicio de complementos de búsqueda suministra un mecanismo de registro (<em>logging</em>) que puede ser de utilidad a los desarrolladores de complementos. Usa <em>about:config</em> para establecer la preferencia '<code>browser.search.log</code>' al valor <code>true</code>. La información de registro aparecerá en la consola de errores de Firefox (Tools-&gt;Error Console) cuando se añada un complemento de búsqueda.</p>
+<h2 id="Material_de_referencia" name="Material_de_referencia">Material de referencia</h2>
+<ul>
+ <li><a class="external" href="http://opensearch.org/">OpenSearch - Documentación oficial</a></li>
+ <li>Technorati.com tiene un ejemplo de fichero XML en <a class="external" href="http://technorati.com/osd.xml" rel="freelink">http://technorati.com/osd.xml</a></li>
+ <li>Más información sobre problemas en la detección automática en bugzilla {{ Bug(340208) }}</li>
+ <li>Wikipedia - <a class="external" href="http://es.wikipedia.org/wiki/Data:_URL"><code>data:</code> URL</a></li>
+ <li><a class="external" href="http://searchy.protecus.de/">Searchy</a> - <a class="external" href="http://searchy.protecus.de/en/add2.php">Crea</a> tu propio complemento o usa <a class="external" href="http://searchy.protecus.de/en/searchbox-add-ons.php">la lista de complementos</a>.</li>
+ <li><a class="external" href="http://www.searchplugins.net">searchplugins.net</a> - Crea complementos OpenSearch plugins para ser usados con Firefox 2. <a class="external" href="http://www.searchplugins.net/pluginlist.aspx">Lista de complementos de búsqueda</a></li>
+ <li><a class="external" href="http://ready.to/search/en/">Ready2Search</a> - Crea complementos OpenSearch. <a class="external" href="http://ready.to/search/make/en_make_plugin.htm">Búsquedas personalizadas a través de Ready2Search</a></li>
+</ul>
+<p><span class="comment">Interwiki link</span></p>
+<p>{{ languages( { "ca": "ca/Creaci\u00f3_de_connectors_OpenSearch_per_al_Firefox", "en": "en/Creating_OpenSearch_plugins_for_Firefox", "fr": "fr/Cr\u00e9ation_de_plugins_OpenSearch_pour_Firefox", "ja": "ja/Creating_OpenSearch_plugins_for_Firefox", "pl": "pl/Tworzenie_wtyczek_OpenSearch_dla_Firefoksa", "pt": "pt/Criando_plugins_OpenSearch_para_o_Firefox" } ) }}</p>
diff --git a/files/es/web/performance/mejorando_rendimienot_inicial/index.html b/files/es/web/performance/mejorando_rendimienot_inicial/index.html
deleted file mode 100644
index ed8bc6771d..0000000000
--- a/files/es/web/performance/mejorando_rendimienot_inicial/index.html
+++ /dev/null
@@ -1,95 +0,0 @@
----
-title: Mejorando el Rendimiento Inicial
-slug: Web/Performance/mejorando_rendimienot_inicial
-tags:
-  - Apps
-  - Performance
-  - Rendimiento
-translation_of: Web/Performance/Optimizing_startup_performance
----
-<div class="summary">
-<p>Un aspecto que a menudo se pasa por alto en el desarrollo de software de aplicaciones, incluso entre aquellos enfocados en la optimización del rendimiento, es el rendimiento inicial. ¿Cuánto tiempo demora su aplicación en iniciarse? ¿Parece que se bloquea el dispositivo o el navegador del usuario no responde mientras se carga la aplicación? Eso hace que los usuarios se preocupen de que su aplicación haya fallado, o de que algo anda mal. Siempre es una buena idea invertir tiempo para asegurarse de que la aplicación se inicie de manera correcta. Este artículo ofrece consejos y sugerencias para ayudar a lograr ese objetivo, tanto al escribir una nueva aplicación como al migrar una aplicación de otra plataforma a la Web.</p>
-</div>
-
-<h2 id="Empezando_Bien">Empezando Bien</h2>
-
-<p>Independientemente de la plataforma, siempre es una buena idea comenzar lo <strong>más rápido </strong>posible. Ya que es un problema universal, no nos vamos a enfocar demasiado en esto. En su lugar, vamos a ver un problema más importante al crear aplicaciones web: comenzar de la manera más <strong>asíncrona </strong>posible. Eso significa no ejecutar todo el código inicial en un mismo controlador de eventos en el hilo principal de la aplicación.</p>
-
-<p>En su lugar, es preferible que el código de la aplicación cree un <a href="es/docs/Web/Guide/Performance/Usando_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web worker</a> que haga todo lo posible en un hilo de fondo (por ejemplo, para obtener y procesar datos). Luego, todo lo que debe ejecutarse en el hilo principal (como responder a los eventos del usuario o desplegar la interfaz gráfica) debe dividirse en tareas pequeñas para que el ciclo de eventos continúe mientras la aplicación inicia. Esto evitará que la aplicación, el navegador y / o el dispositivo parezcan haber fallado.</p>
-
-<p>¿Por qué es importante ser asíncrono? <span title="">Aparte de las razones sugeridas anteriormente, considere el impacto de una página o interfaz de usuario que no responde.</span> <span title="">El usuario no puede cerrar la aplicación si la lanzó por error.</span> <span title="">Si la aplicación se ejecuta en un navegador, es posible que el usuario obtenga una notificación diciendo "la aplicación no responde".</span> <span title="">Presentar algún tipo de interfaz, como una barra de progreso, para que el usuario sepa cuánto tiempo más tendrá que esperar mientras se inicia la aplicación es mejor que una interfaz incapaz de responder a las acciones del usuario.</span></p>
-
-<h2 id="Trabajar_con_Rendimiento_en_Mente">Trabajar con Rendimiento en Mente</h2>
-
-<p>Si está comenzando un proyecto de cero, generalmente es más sencillo escribir todo de la manera correcta, hacer que el código sea escrito para trabajar de manera asíncrona en mente. Hacer los cálculos iniciales en subprocesos en segundo plano cuando sea posible, crear tareas cortas para acelerar el tiempo de ejecución de los eventos de subprocesos importantes. Empezar a pintar en pantalla la interfaz gráfica para que el usuario sepa qué algo pasando y cuánto tiempo estará esperando. En teoría, de todos modos, debería ser bastante fácil diseñar una aplicación nueva para que inicie bien.</p>
-
-<p>Por otro lado,  migrar una aplicación existente a la Web puede ser una tarea más complicada. Por ejemplo, una aplicación de escritorio no necesita escribirse de forma asíncrona porque generalmente el sistema operativo se encarga de eso, o aplicación que se está ejecutando actualmente es lo único que importa, dependiendo del entorno operativo. La aplicación original puede tener un ciclo principal que puede modificarse para operar de forma asíncrona (intentando ejecutar cada iteración del ciclo principal por separado); el inicio es a menudo un procedimiento monolítico continuo que puede ir actualizando de manera periódica la interfaz gráfica para indicar progreso.</p>
-
-<p>Si bien se puede usar los <a href="es/docs/Web/Guide/Performance/Usando_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web workers </a>para ejecutar fragmentos de forma asíncrona códigos <a href="/es/docs/JavaScript">JavaScript</a> muy grandes y/o lentos, hay una gran advertencia: Web workers no tienen accesso a <a href="/es/docs/Web/API/WebGL_API" title="/en-US/docs/WebGL">WebGL</a> o audio, y no pueden enviar mensajes síncronos al hilo principal, por lo que no se puede hacer un proxy de esos APIs al hilo principal. <span title="">Todo esto significa que, a menos que se pueda extraer fácilmente los trozos de "cálculo puro" del proceso de inicio en Web workers, se va terminar teniendo que ejecutar la mayor parte o la totalidad del código de inicio en el hilo principal.</span></p>
-
-<p>Sin embargo, incluso código como ese puede ser hecho asíncrono, con un poco de trabajo.</p>
-
-<h2 id="Trabajando_de_Manera_Asíncrona">Trabajando de Manera Asíncrona</h2>
-
-<p>Algunas sugerencias que se pueden aplicar para hacer que el proceso de inicio de la aplicación se lo más asíncrona posible, sin importar si la aplicación es nueva o si se está migrando una que ya existe, son las siguientes:</p>
-
-<ul>
- <li>Usar los atributos {{ htmlattrxref("defer") }} o {{ htmlattrxref("async") }} en los tag de script que la aplicación Web necesita. Esto permite que el interpretador de HTML no se vea forzado a esperar a que el código se haya descargado y ejecutado para continuar.</li>
- <li>Si se necesita descodificar archivos de recurso (por ejemplo, descodificar archivos JPEG files y convertirlos en datos de textura para ser usados luegos en WebGL), este es un buen caso de uso para Web workers.</li>
- <li>When dealing with data supported by the browser (por ejemplo, descodificar images), es mejor utilizar los descodificadores includos en el navegador o el dispositivo en lugar de utilizar un propio migrado del código existente. El descodificador incluído en el navegador es muy probablemente más rápido, y reduce la cantidad de código que se va a necesitar para iniciar la aplicación. Además, es posible que el navegador automáticamente pueda ejecutar en paralelo estos descodificadores.</li>
- <li>Cualquier procesamiento de información que puede ejecutarse en paralelo debe ser ejecutada en paralelo. No trabaje con porciones de información de manera sequencial; es mejor ejecutarlas en paralelo, siempre que sea posible.</li>
- <li>No incluya archivos de JavaScript o CSS que no son necesarios para la ruta crítica de iniciar la aplicación web. Cargue los recursos adicionales cuando sean necesarios.</li>
- <li>Reduzca el tamaño de sus archivos JavaScript. Intente enviar la versión minificada de sus archivos a los navegadores y utilice mecanismos de compresión de recursos como Gzip o Brotli.</li>
- <li>Utilice directivas (como preload, prefetch, preconnect) para ayudar al navegador a optimizar la carga de los recursos.</li>
-</ul>
-
-<p>A mayor trabajo que se pueda realizar de manera asíncrona, la aplicación va a obtener mayor ventaja de procesadores multinúcleos.</p>
-
-<h3 id="Problemas_de_Migración">Problemas de Migración</h3>
-
-<p> </p>
-
-<p>Una vez que se realiza la carga inicial y el código principal de la aplicación comienza a ejecutarse, es posible que su aplicación esté programada para trabajar en un solo hilo, especialmente cuando es una migración. Lo más importante que se puede hacer para tratar de ayudar con el proceso de inicio del código principal es refactorizar el código en partes pequeñas que se pueden ejecutrar en trozos intercalados en múltiples llamadas del ciclo principal de su aplicación, para que el hilo principal pueda manejar las interacciones del usuario y similares.</p>
-
-<p>Emscripten proporciona una API para ayudar con esta refactorización; por ejemplo, puede usar emscripten_push_main_loop_blocker () para establecer una función que se ejecutará antes de que se permita que el hilo principal continúe. Al establecer una cola de funciones a ser llamadas en secuencia, puede administrar más fácilmente los bits de código en ejecución sin bloquear el hilo principal.</p>
-
-<p>Eso deja, sin embargo, el problema de tener que refactorizar su código existente para que realmente funcione de esa manera. Eso puede llevar algún tiempo.</p>
-
-<p> </p>
-
-<h3 id="¿Que_tan_asíncrono_debo_ser">¿Que tan asíncrono debo ser?</h3>
-
-<p>Vale la pena tener en cuenta que la mayoría de los navegadores suelen comenzar a quejarse de que un script está bloqueando el hilo principal aproximadamente a los 10 segundos. Idealmente, la aplicación no debería bloquear esa cantidad de tiempo, pero mientras se mantenga debajo de eso, debería estar bien. Sin embargo, tenga en cuenta que si alguien tiene una computadora más antigua y más lenta que la suya, ¡puede experimentar retrasos más prolongados que usted!</p>
-
-<h2 id="Otras_Sugerencias">Otras Sugerencias</h2>
-
-<p>Hay otras cosas además de ir asíncrono, que pueden ayudarlo a mejorar el tiempo de inicio de su aplicación. Estas son algunos de ellos:</p>
-
-<dl>
- <dt>Tiempo de Descarga</dt>
- <dd>Tenga en cuenta cuánto tiempo le llevará al usuario descargar los datos de su juego. Si su juego es realmente grande, muy popular o si tiene que volver a descargar contenido con frecuencia, debe intentar tener un servidor de alojamiento lo más rápido posible. También debe considerar utilizar mecanismos de compresión como Gzip o Brotli para que sean lo más pequeños posible.</dd>
- <dt>Uso del GPU</dt>
- <dd>La compilación de sombras y la carga de texturas en el GPU pueden llevar tiempo, especialmente para los juegos realmente complejos. Si bien esto también ocurre con los juegos nativos (que no son de la Web), todavía puede ser bastante molesto. Evita hacer esto sin mantener informado al usuario de que el juego, de hecho, todavía se está iniciando.</dd>
- <dt>Tamaño de los Datos</dt>
- <dd>Haz tu mejor esfuerzo para optimizar el tamaño de tus datos de juego; los archivos de menor nivel se descargarán y procesarán más rápido que los más grandes.</dd>
- <dt>Factores Subjetivos</dt>
- <dd>Cualquier cosa que pueda hacer para ayudar a mantener al usuario involucrado durante el proceso de inicio ayudará a que el tiempo parezca más rápido. Para los juegos, considere la posibilidad de reproducir música de fondo o mostrar una bonita pantalla de bienvenida. Entre cada cálculo, actualice su indicador de progreso, realice cambios en la pantalla o cualquier otra cosa que pueda hacer para ayudar al usuario a sentir que su aplicación está haciendo algo en lugar de quedarse sentado tranquilamente.</dd>
-</dl>
-
-<h2 id="También_Podría_Interesarte">También Podría Interesarte</h2>
-
-<ul>
- <li><a href="/es/docs/Web/Progressive_web_apps" title="/en-US/docs/Apps">Apps</a></li>
- <li><a href="/es/docs/Games" title="/en-US/docs/Games">Games</a></li>
-</ul>
-
-<div class="originaldocinfo">
-<h2 id="Original_Document_Information" name="Original_Document_Information">Información del Documento Original:</h2>
-
-<ul>
- <li>Autor(s): Alon Zakai</li>
- <li>Fuente: <a href="http://mozakai.blogspot.com/2012/07/bananabread-or-any-compiled-codebase.html" title="http://mozakai.blogspot.com/2012/07/bananabread-or-any-compiled-codebase.html">BananaBread (or any compiled codebase) Startup Experience</a></li>
-</ul>
-</div>
-
-<p> </p>
diff --git a/files/es/web/performance/optimizing_startup_performance/index.html b/files/es/web/performance/optimizing_startup_performance/index.html
new file mode 100644
index 0000000000..ace7ab0002
--- /dev/null
+++ b/files/es/web/performance/optimizing_startup_performance/index.html
@@ -0,0 +1,96 @@
+---
+title: Mejorando el Rendimiento Inicial
+slug: Web/Performance/Optimizing_startup_performance
+tags:
+  - Apps
+  - Performance
+  - Rendimiento
+translation_of: Web/Performance/Optimizing_startup_performance
+original_slug: Web/Performance/mejorando_rendimienot_inicial
+---
+<div class="summary">
+<p>Un aspecto que a menudo se pasa por alto en el desarrollo de software de aplicaciones, incluso entre aquellos enfocados en la optimización del rendimiento, es el rendimiento inicial. ¿Cuánto tiempo demora su aplicación en iniciarse? ¿Parece que se bloquea el dispositivo o el navegador del usuario no responde mientras se carga la aplicación? Eso hace que los usuarios se preocupen de que su aplicación haya fallado, o de que algo anda mal. Siempre es una buena idea invertir tiempo para asegurarse de que la aplicación se inicie de manera correcta. Este artículo ofrece consejos y sugerencias para ayudar a lograr ese objetivo, tanto al escribir una nueva aplicación como al migrar una aplicación de otra plataforma a la Web.</p>
+</div>
+
+<h2 id="Empezando_Bien">Empezando Bien</h2>
+
+<p>Independientemente de la plataforma, siempre es una buena idea comenzar lo <strong>más rápido </strong>posible. Ya que es un problema universal, no nos vamos a enfocar demasiado en esto. En su lugar, vamos a ver un problema más importante al crear aplicaciones web: comenzar de la manera más <strong>asíncrona </strong>posible. Eso significa no ejecutar todo el código inicial en un mismo controlador de eventos en el hilo principal de la aplicación.</p>
+
+<p>En su lugar, es preferible que el código de la aplicación cree un <a href="es/docs/Web/Guide/Performance/Usando_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web worker</a> que haga todo lo posible en un hilo de fondo (por ejemplo, para obtener y procesar datos). Luego, todo lo que debe ejecutarse en el hilo principal (como responder a los eventos del usuario o desplegar la interfaz gráfica) debe dividirse en tareas pequeñas para que el ciclo de eventos continúe mientras la aplicación inicia. Esto evitará que la aplicación, el navegador y / o el dispositivo parezcan haber fallado.</p>
+
+<p>¿Por qué es importante ser asíncrono? <span title="">Aparte de las razones sugeridas anteriormente, considere el impacto de una página o interfaz de usuario que no responde.</span> <span title="">El usuario no puede cerrar la aplicación si la lanzó por error.</span> <span title="">Si la aplicación se ejecuta en un navegador, es posible que el usuario obtenga una notificación diciendo "la aplicación no responde".</span> <span title="">Presentar algún tipo de interfaz, como una barra de progreso, para que el usuario sepa cuánto tiempo más tendrá que esperar mientras se inicia la aplicación es mejor que una interfaz incapaz de responder a las acciones del usuario.</span></p>
+
+<h2 id="Trabajar_con_Rendimiento_en_Mente">Trabajar con Rendimiento en Mente</h2>
+
+<p>Si está comenzando un proyecto de cero, generalmente es más sencillo escribir todo de la manera correcta, hacer que el código sea escrito para trabajar de manera asíncrona en mente. Hacer los cálculos iniciales en subprocesos en segundo plano cuando sea posible, crear tareas cortas para acelerar el tiempo de ejecución de los eventos de subprocesos importantes. Empezar a pintar en pantalla la interfaz gráfica para que el usuario sepa qué algo pasando y cuánto tiempo estará esperando. En teoría, de todos modos, debería ser bastante fácil diseñar una aplicación nueva para que inicie bien.</p>
+
+<p>Por otro lado,  migrar una aplicación existente a la Web puede ser una tarea más complicada. Por ejemplo, una aplicación de escritorio no necesita escribirse de forma asíncrona porque generalmente el sistema operativo se encarga de eso, o aplicación que se está ejecutando actualmente es lo único que importa, dependiendo del entorno operativo. La aplicación original puede tener un ciclo principal que puede modificarse para operar de forma asíncrona (intentando ejecutar cada iteración del ciclo principal por separado); el inicio es a menudo un procedimiento monolítico continuo que puede ir actualizando de manera periódica la interfaz gráfica para indicar progreso.</p>
+
+<p>Si bien se puede usar los <a href="es/docs/Web/Guide/Performance/Usando_web_workers" title="/en-US/docs/DOM/Using_web_workers">Web workers </a>para ejecutar fragmentos de forma asíncrona códigos <a href="/es/docs/JavaScript">JavaScript</a> muy grandes y/o lentos, hay una gran advertencia: Web workers no tienen accesso a <a href="/es/docs/Web/API/WebGL_API" title="/en-US/docs/WebGL">WebGL</a> o audio, y no pueden enviar mensajes síncronos al hilo principal, por lo que no se puede hacer un proxy de esos APIs al hilo principal. <span title="">Todo esto significa que, a menos que se pueda extraer fácilmente los trozos de "cálculo puro" del proceso de inicio en Web workers, se va terminar teniendo que ejecutar la mayor parte o la totalidad del código de inicio en el hilo principal.</span></p>
+
+<p>Sin embargo, incluso código como ese puede ser hecho asíncrono, con un poco de trabajo.</p>
+
+<h2 id="Trabajando_de_Manera_Asíncrona">Trabajando de Manera Asíncrona</h2>
+
+<p>Algunas sugerencias que se pueden aplicar para hacer que el proceso de inicio de la aplicación se lo más asíncrona posible, sin importar si la aplicación es nueva o si se está migrando una que ya existe, son las siguientes:</p>
+
+<ul>
+ <li>Usar los atributos {{ htmlattrxref("defer") }} o {{ htmlattrxref("async") }} en los tag de script que la aplicación Web necesita. Esto permite que el interpretador de HTML no se vea forzado a esperar a que el código se haya descargado y ejecutado para continuar.</li>
+ <li>Si se necesita descodificar archivos de recurso (por ejemplo, descodificar archivos JPEG files y convertirlos en datos de textura para ser usados luegos en WebGL), este es un buen caso de uso para Web workers.</li>
+ <li>When dealing with data supported by the browser (por ejemplo, descodificar images), es mejor utilizar los descodificadores includos en el navegador o el dispositivo en lugar de utilizar un propio migrado del código existente. El descodificador incluído en el navegador es muy probablemente más rápido, y reduce la cantidad de código que se va a necesitar para iniciar la aplicación. Además, es posible que el navegador automáticamente pueda ejecutar en paralelo estos descodificadores.</li>
+ <li>Cualquier procesamiento de información que puede ejecutarse en paralelo debe ser ejecutada en paralelo. No trabaje con porciones de información de manera sequencial; es mejor ejecutarlas en paralelo, siempre que sea posible.</li>
+ <li>No incluya archivos de JavaScript o CSS que no son necesarios para la ruta crítica de iniciar la aplicación web. Cargue los recursos adicionales cuando sean necesarios.</li>
+ <li>Reduzca el tamaño de sus archivos JavaScript. Intente enviar la versión minificada de sus archivos a los navegadores y utilice mecanismos de compresión de recursos como Gzip o Brotli.</li>
+ <li>Utilice directivas (como preload, prefetch, preconnect) para ayudar al navegador a optimizar la carga de los recursos.</li>
+</ul>
+
+<p>A mayor trabajo que se pueda realizar de manera asíncrona, la aplicación va a obtener mayor ventaja de procesadores multinúcleos.</p>
+
+<h3 id="Problemas_de_Migración">Problemas de Migración</h3>
+
+<p> </p>
+
+<p>Una vez que se realiza la carga inicial y el código principal de la aplicación comienza a ejecutarse, es posible que su aplicación esté programada para trabajar en un solo hilo, especialmente cuando es una migración. Lo más importante que se puede hacer para tratar de ayudar con el proceso de inicio del código principal es refactorizar el código en partes pequeñas que se pueden ejecutrar en trozos intercalados en múltiples llamadas del ciclo principal de su aplicación, para que el hilo principal pueda manejar las interacciones del usuario y similares.</p>
+
+<p>Emscripten proporciona una API para ayudar con esta refactorización; por ejemplo, puede usar emscripten_push_main_loop_blocker () para establecer una función que se ejecutará antes de que se permita que el hilo principal continúe. Al establecer una cola de funciones a ser llamadas en secuencia, puede administrar más fácilmente los bits de código en ejecución sin bloquear el hilo principal.</p>
+
+<p>Eso deja, sin embargo, el problema de tener que refactorizar su código existente para que realmente funcione de esa manera. Eso puede llevar algún tiempo.</p>
+
+<p> </p>
+
+<h3 id="¿Que_tan_asíncrono_debo_ser">¿Que tan asíncrono debo ser?</h3>
+
+<p>Vale la pena tener en cuenta que la mayoría de los navegadores suelen comenzar a quejarse de que un script está bloqueando el hilo principal aproximadamente a los 10 segundos. Idealmente, la aplicación no debería bloquear esa cantidad de tiempo, pero mientras se mantenga debajo de eso, debería estar bien. Sin embargo, tenga en cuenta que si alguien tiene una computadora más antigua y más lenta que la suya, ¡puede experimentar retrasos más prolongados que usted!</p>
+
+<h2 id="Otras_Sugerencias">Otras Sugerencias</h2>
+
+<p>Hay otras cosas además de ir asíncrono, que pueden ayudarlo a mejorar el tiempo de inicio de su aplicación. Estas son algunos de ellos:</p>
+
+<dl>
+ <dt>Tiempo de Descarga</dt>
+ <dd>Tenga en cuenta cuánto tiempo le llevará al usuario descargar los datos de su juego. Si su juego es realmente grande, muy popular o si tiene que volver a descargar contenido con frecuencia, debe intentar tener un servidor de alojamiento lo más rápido posible. También debe considerar utilizar mecanismos de compresión como Gzip o Brotli para que sean lo más pequeños posible.</dd>
+ <dt>Uso del GPU</dt>
+ <dd>La compilación de sombras y la carga de texturas en el GPU pueden llevar tiempo, especialmente para los juegos realmente complejos. Si bien esto también ocurre con los juegos nativos (que no son de la Web), todavía puede ser bastante molesto. Evita hacer esto sin mantener informado al usuario de que el juego, de hecho, todavía se está iniciando.</dd>
+ <dt>Tamaño de los Datos</dt>
+ <dd>Haz tu mejor esfuerzo para optimizar el tamaño de tus datos de juego; los archivos de menor nivel se descargarán y procesarán más rápido que los más grandes.</dd>
+ <dt>Factores Subjetivos</dt>
+ <dd>Cualquier cosa que pueda hacer para ayudar a mantener al usuario involucrado durante el proceso de inicio ayudará a que el tiempo parezca más rápido. Para los juegos, considere la posibilidad de reproducir música de fondo o mostrar una bonita pantalla de bienvenida. Entre cada cálculo, actualice su indicador de progreso, realice cambios en la pantalla o cualquier otra cosa que pueda hacer para ayudar al usuario a sentir que su aplicación está haciendo algo en lugar de quedarse sentado tranquilamente.</dd>
+</dl>
+
+<h2 id="También_Podría_Interesarte">También Podría Interesarte</h2>
+
+<ul>
+ <li><a href="/es/docs/Web/Progressive_web_apps" title="/en-US/docs/Apps">Apps</a></li>
+ <li><a href="/es/docs/Games" title="/en-US/docs/Games">Games</a></li>
+</ul>
+
+<div class="originaldocinfo">
+<h2 id="Original_Document_Information" name="Original_Document_Information">Información del Documento Original:</h2>
+
+<ul>
+ <li>Autor(s): Alon Zakai</li>
+ <li>Fuente: <a href="http://mozakai.blogspot.com/2012/07/bananabread-or-any-compiled-codebase.html" title="http://mozakai.blogspot.com/2012/07/bananabread-or-any-compiled-codebase.html">BananaBread (or any compiled codebase) Startup Experience</a></li>
+</ul>
+</div>
+
+<p> </p>
diff --git a/files/es/web/progressive_web_apps/developer_guide/instalar/index.html b/files/es/web/progressive_web_apps/developer_guide/instalar/index.html
deleted file mode 100644
index ef54a3b24c..0000000000
--- a/files/es/web/progressive_web_apps/developer_guide/instalar/index.html
+++ /dev/null
@@ -1,96 +0,0 @@
----
-title: Instalar y desinstalar aplicaciones web
-slug: Web/Progressive_web_apps/Developer_guide/Instalar
-tags:
-  - Android
-  - Apps
-  - Chrome
-  - Desinstalar
-  - Firefox
-  - Guía
-  - Lanzar
-  - PWA
-  - Pantalla de inicio
-  - Principiante
-  - Samsung
-  - Web
-  - aplicaciones
-  - aplicaciones web progresivas
-  - instalar
-translation_of: Web/Progressive_web_apps/Developer_guide/Installing
----
-<p>{{draft}}</p>
-
-<p><span class="seoSummary">La instalación de aplicaciones web es una función disponible en los navegadores modernos que permite a los usuarios elegir "instalar" fácil y cómodamente una aplicación web en su dispositivo para que puedan acceder a ella de la misma manera que lo harían con cualquier otra aplicación.</span> Dependiendo del dispositivo y las características del sistema operativo y el navegador, esto puede resultar en lo que esencialmente es una aplicación con todas las funciones (por ejemplo, usando <a href="https://developers.google.com/web/fundamentals/integration/webapks">WebAPK</a> en Android) o como un acceso directo agregado a la pantalla de tu dispositivo. Esta guía explica cómo se realiza la instalación, qué significa y qué debes hacer como desarrollador para que los usuarios la aprovechen.</p>
-
-<h2 id="¿Por_qué_la_instalación">¿Por qué la instalación?</h2>
-
-<p>La opción de instalar una aplicación web es parte de la filosofía {{web.link("/es/docs/Web/Progressive_web_apps", "Aplicación web progresiva")}}, que proporciona a las aplicaciones web las mismas ventajas de experiencia de usuario que las aplicaciones nativas para que puedan ser competitivas. Las aplicaciones instaladas se invocan de manera más conveniente ya que tienen presencia en la pantalla de inicio de un dispositivo o en la lista o barra de aplicaciones. Esto facilita que un usuario utilice un gesto para acceder a una aplicación tocando o haciendo clic en su icono. La aplicación en sí misma, se puede manifestar como en una vista sin bordes (sin el navegador Chrome completo) pero, no obstante, se está ejecutando de manera efectiva como una pestaña dentro del navegador.</p>
-
-<p>Para los usuarios, la experiencia de una PWA aparentemente nativa es más cómoda y conveniente que un sitio web típico. Al reducir la diferencia de experiencia del usuario entre la aplicación web y las aplicaciones nativas en el dispositivo del usuario, reduce tanto la pérdida de cualquier memoria muscular que tenga relacionada con la interfaz nativa del dispositivo como la sensación de que "algo no va del todo bien" que los usuarios pueden experimentar al cambiar entre aplicaciones nativas y basadas en web.</p>
-
-<h2 id="¿Qué_navegadores_admiten_la_instalación">¿Qué navegadores admiten la instalación?</h2>
-
-<p>La instalación es compatible con Chrome para Android y Android WebView versión 31 y posteriores, Opera para Android 32 en adelante, Samsung Internet a partir de la versión 4 y Firefox para Android {{web.link("/es/docs/Mozilla/Firefox/Releases/58", "versión 58")}} y posteriores.</p>
-
-<p>Safari en iOS es un poco diferente. Algunas partes del ecosistema de PWA son compatibles, mientras que otras no. iOS 13 introdujo una experiencia de instalación mucho más comparable, que también se describe aquí.</p>
-
-<h2 id="La_instalación_en_la_experiencia_del_usuario">La instalación en la experiencia del usuario</h2>
-
-<p>Hemos escrito un sitio web de ejemplo muy simple (<a href="https://mdn.github.io/pwa-examples/a2hs/">ve nuestra demostración en vivo</a>, y también <a href="https://github.com/mdn/pwa-examples/tree/master/a2hs">ve el código fuente</a>) que no hace mucho, pero fue desarrollado con el código necesario para permitir su instalación, así como un servicio <em>worker&gt; para permitir su uso sin conexión. El ejemplo muestra una serie de imágenes de zorros. Si tienes un dispositivo compatible con la aplicación web disponible, utilízalo para navegar a nuestra demostración en <code>https://mdn.github.io/pwa-examples/a2hs/</code>. Verás imágenes de zorros, pero lo que es más importante, habrá alguna forma de interfaz de usuario disponible para permitirte instalar el sitio como una aplicación web.</em></p>
-
-<p><em>La interfaz de usuario para esto varía de un navegador a otro, pero la idea general es la misma. Desafortunadamente, no existe un estándar para los iconos y símbolos utilizados para operaciones como esta.</em></p>
-
-<h3 id="Firefox_para_Android"><em>Firefox para Android</em></h3>
-
-<p><em>En un dispositivo Android que usa Firefox, verás un ícono de "inicio" con un ícono más (+) en su interior; este es el ícono "Agregar a la pantalla de inicio" que se muestra para cualquier sitio que tenga las características necesarias en su lugar.</em></p>
-
-<p><em><strong id="docs-internal-guid-7d1a3d87-7fff-4a7b-6728-ae4999c46dd4"><img alt="Una captura de pantalla de un navegador web que muestra el ícono Agregar a la pantalla de inicio en la parte superior" src="https://mdn.mozillademos.org/files/17158/android-a2hs-icon.png " style="height: 64px; width: 500px;"></strong></em></p>
-
-<p><em>Al tocar este, se mostrará un pasquín de confirmación; al presionar el botón grande "+ AGREGAR A LA PANTALLA DE INICIO", se completa la acción y se agrega la aplicación a la pantalla de inicio. Ten en cuenta que en Android 8 y versiones posteriores, se mostrará primero un cuadro de diálogo de permiso "Agregar a la pantalla de inicio" a nivel del sistema.</em></p>
-
-<p><em><img alt="Una captura de pantalla de Firefox para Android que solicita confirmación antes de instalar una aplicación web" src="https://mdn.mozillademos.org/files/17160/fx-a2hs-banner.png" style="height: 301px; width: 500px;"></em></p>
-
-<h3 id="Navegador_de_Internet_Samsung"><em>Navegador de Internet Samsung</em></h3>
-
-<p><em>Si tiene Samsung Internet en tu dispositivo móvil, verás un icono diferente.</em></p>
-
-<p><em><img alt="Una captura de pantalla del navegador de Internet de Samsung que muestra su icono Agregar a la pantalla de inicio" src="https://mdn.mozillademos.org/files/17161/samsung-internet-add-app.png" style="height: 247px; width: 500px;"></em></p>
-
-<p><em>Tocar ese ícono debería llevarte al mismo pasquín de confirmación que se muestra en Firefox arriba.</em></p>
-
-<h3 id="Google_Chrome_para_Android"><em>Google Chrome para Android</em></h3>
-
-<p><em>Si tienes Google Chrome para Android disponible, la experiencia es ligeramente diferente; al cargar nuestro sitio, verás un pasquín de instalación emergente que te preguntará si deseas agregar esta aplicación a tu pantalla de inicio.</em></p>
-
-<p><em><img alt="Captura de pantalla de un pasquín de Chrome que solicita permiso para instalar la aplicación de muestra Foxes" src="https://mdn.mozillademos.org/files/17159/chrome-a2hs-banner.png" style="height: 301px; width: 500px;"></em></p>
-
-<div class="blockIndicator note">
-<p><em><strong>Nota</strong>: Puedes obtener más información sobre los paquínes de instalación de Chrome en el artículo <a href="https://developers.google.com/web/fundamentals/app-install-banners/">Pasquínes de instalación de aplicaciones web</a>.</em></p>
-</div>
-
-<p><em>Si eliges no agregarlo a tu pantalla de inicio en este momento, los puedes hacer más tarde usando el ícono "Agregar a la pantalla de inicio" en el menú principal de Chrome.</em></p>
-
-<h3 id="Safari_para_iOSiPhoneOSiPadOS"><em>Safari para iOS/iPhoneOS/iPadOS</em></h3>
-
-<p><em>En iOS de Apple (incluidos iPhoneOS y iPadOS), el navegador Safari integrado en el dispositivo tiene cierto soporte para aplicaciones web, incluido el soporte para agregar a la función de pantalla de inicio. Para agregar una aplicación web a la pantalla de inicio (también conocida como lanzador o trampolín), toca el botón para compartir (<img alt="Icono de compartir cuadrado y flecha desde iOS y macOS" src="https://mdn.mozillademos.org/files/17156/square.svg" style="height: 18px; width: 14px;">) en la parte inferior de la pantalla:</em></p>
-
-<p><em><img alt="Captura de pantalla que muestra la ubicación del botón Compartir en Safari en iOS 13" src="https://mdn.mozillademos.org/files/17163/safari-ios-a2hs-icon.png" style="height: 617px; width: 500px;"></em></p>
-
-<p><em>Esto llama al panel para compartir. Entre las opciones debe estar la opción "Agregar a la pantalla de inicio", a menos que el usuario la haya eliminado específicamente de la lista al editar las opciones mostradas:</em></p>
-
-<p><em><img alt="Captura de pantalla del panel para compartir de Safari iOS, que muestra la opción" src="https://mdn.mozillademos.org/files/17165/safari-ios-share-menu.png" style="height: 551px; width: 500px;"></em></p>
-
-<p><em>Al elegir "Agregar a la pantalla de inicio" aquí se presenta el cuadro de diálogo de confirmación, que no solo confirma que el usuario desea agregar la aplicación a la pantalla de inicio, sino que también le permite personalizar su nombre.</em></p>
-
-<p><em><img alt='Una captura de pantalla de iOS Safari que muestra su panel de configuración y confirmación "Agregar a la pantalla de inicio"' src="https://mdn.mozillademos.org/files/17167/safari-ios-a2hs-banner.png" style="height: 439px; width: 500px;"></em></p>
-
-<p><em>Al hacer clic en "Agregar", la aplicación se incluye en la pantalla de inicio.</em></p>
-
-<h3 id="La_aplicación_web_instalada"><em>La aplicación web instalada</em></h3>
-
-<p><em>Independientemente del navegador y el dispositivo que estés utilizando, cuando eliges agregar la aplicación a tu pantalla de inicio o al iniciador de aplicaciones, aparecerá allí con el mismo aspecto que cualquier aplicación. Normalmente, esto significa que verás el icono de la aplicación junto con un título corto.</em></p>
-
-<p><em><img alt='Captura de pantalla de una pantalla de inicio de Android con la aplicación "Foxes" mostrada' src="https://mdn.mozillademos.org/files/17157/a2hs-on-home-screen.png" style="height: 304px; width: 500px;"></em></p>
-
-<p><em>Cuando tocas el icono de la aplicación web en la pantalla de inicio, se abre en un entorno web de pantalla completa, sin la interfaz de usuario del navegador a su alrededor.</em></p>
diff --git a/files/es/web/progressive_web_apps/developer_guide/installing/index.html b/files/es/web/progressive_web_apps/developer_guide/installing/index.html
new file mode 100644
index 0000000000..6ef244a88d
--- /dev/null
+++ b/files/es/web/progressive_web_apps/developer_guide/installing/index.html
@@ -0,0 +1,97 @@
+---
+title: Instalar y desinstalar aplicaciones web
+slug: Web/Progressive_web_apps/Developer_guide/Installing
+tags:
+  - Android
+  - Apps
+  - Chrome
+  - Desinstalar
+  - Firefox
+  - Guía
+  - Lanzar
+  - PWA
+  - Pantalla de inicio
+  - Principiante
+  - Samsung
+  - Web
+  - aplicaciones
+  - aplicaciones web progresivas
+  - instalar
+translation_of: Web/Progressive_web_apps/Developer_guide/Installing
+original_slug: Web/Progressive_web_apps/Developer_guide/Instalar
+---
+<p>{{draft}}</p>
+
+<p><span class="seoSummary">La instalación de aplicaciones web es una función disponible en los navegadores modernos que permite a los usuarios elegir "instalar" fácil y cómodamente una aplicación web en su dispositivo para que puedan acceder a ella de la misma manera que lo harían con cualquier otra aplicación.</span> Dependiendo del dispositivo y las características del sistema operativo y el navegador, esto puede resultar en lo que esencialmente es una aplicación con todas las funciones (por ejemplo, usando <a href="https://developers.google.com/web/fundamentals/integration/webapks">WebAPK</a> en Android) o como un acceso directo agregado a la pantalla de tu dispositivo. Esta guía explica cómo se realiza la instalación, qué significa y qué debes hacer como desarrollador para que los usuarios la aprovechen.</p>
+
+<h2 id="¿Por_qué_la_instalación">¿Por qué la instalación?</h2>
+
+<p>La opción de instalar una aplicación web es parte de la filosofía {{web.link("/es/docs/Web/Progressive_web_apps", "Aplicación web progresiva")}}, que proporciona a las aplicaciones web las mismas ventajas de experiencia de usuario que las aplicaciones nativas para que puedan ser competitivas. Las aplicaciones instaladas se invocan de manera más conveniente ya que tienen presencia en la pantalla de inicio de un dispositivo o en la lista o barra de aplicaciones. Esto facilita que un usuario utilice un gesto para acceder a una aplicación tocando o haciendo clic en su icono. La aplicación en sí misma, se puede manifestar como en una vista sin bordes (sin el navegador Chrome completo) pero, no obstante, se está ejecutando de manera efectiva como una pestaña dentro del navegador.</p>
+
+<p>Para los usuarios, la experiencia de una PWA aparentemente nativa es más cómoda y conveniente que un sitio web típico. Al reducir la diferencia de experiencia del usuario entre la aplicación web y las aplicaciones nativas en el dispositivo del usuario, reduce tanto la pérdida de cualquier memoria muscular que tenga relacionada con la interfaz nativa del dispositivo como la sensación de que "algo no va del todo bien" que los usuarios pueden experimentar al cambiar entre aplicaciones nativas y basadas en web.</p>
+
+<h2 id="¿Qué_navegadores_admiten_la_instalación">¿Qué navegadores admiten la instalación?</h2>
+
+<p>La instalación es compatible con Chrome para Android y Android WebView versión 31 y posteriores, Opera para Android 32 en adelante, Samsung Internet a partir de la versión 4 y Firefox para Android {{web.link("/es/docs/Mozilla/Firefox/Releases/58", "versión 58")}} y posteriores.</p>
+
+<p>Safari en iOS es un poco diferente. Algunas partes del ecosistema de PWA son compatibles, mientras que otras no. iOS 13 introdujo una experiencia de instalación mucho más comparable, que también se describe aquí.</p>
+
+<h2 id="La_instalación_en_la_experiencia_del_usuario">La instalación en la experiencia del usuario</h2>
+
+<p>Hemos escrito un sitio web de ejemplo muy simple (<a href="https://mdn.github.io/pwa-examples/a2hs/">ve nuestra demostración en vivo</a>, y también <a href="https://github.com/mdn/pwa-examples/tree/master/a2hs">ve el código fuente</a>) que no hace mucho, pero fue desarrollado con el código necesario para permitir su instalación, así como un servicio <em>worker&gt; para permitir su uso sin conexión. El ejemplo muestra una serie de imágenes de zorros. Si tienes un dispositivo compatible con la aplicación web disponible, utilízalo para navegar a nuestra demostración en <code>https://mdn.github.io/pwa-examples/a2hs/</code>. Verás imágenes de zorros, pero lo que es más importante, habrá alguna forma de interfaz de usuario disponible para permitirte instalar el sitio como una aplicación web.</em></p>
+
+<p><em>La interfaz de usuario para esto varía de un navegador a otro, pero la idea general es la misma. Desafortunadamente, no existe un estándar para los iconos y símbolos utilizados para operaciones como esta.</em></p>
+
+<h3 id="Firefox_para_Android"><em>Firefox para Android</em></h3>
+
+<p><em>En un dispositivo Android que usa Firefox, verás un ícono de "inicio" con un ícono más (+) en su interior; este es el ícono "Agregar a la pantalla de inicio" que se muestra para cualquier sitio que tenga las características necesarias en su lugar.</em></p>
+
+<p><em><strong id="docs-internal-guid-7d1a3d87-7fff-4a7b-6728-ae4999c46dd4"><img alt="Una captura de pantalla de un navegador web que muestra el ícono Agregar a la pantalla de inicio en la parte superior" src="https://mdn.mozillademos.org/files/17158/android-a2hs-icon.png " style="height: 64px; width: 500px;"></strong></em></p>
+
+<p><em>Al tocar este, se mostrará un pasquín de confirmación; al presionar el botón grande "+ AGREGAR A LA PANTALLA DE INICIO", se completa la acción y se agrega la aplicación a la pantalla de inicio. Ten en cuenta que en Android 8 y versiones posteriores, se mostrará primero un cuadro de diálogo de permiso "Agregar a la pantalla de inicio" a nivel del sistema.</em></p>
+
+<p><em><img alt="Una captura de pantalla de Firefox para Android que solicita confirmación antes de instalar una aplicación web" src="https://mdn.mozillademos.org/files/17160/fx-a2hs-banner.png" style="height: 301px; width: 500px;"></em></p>
+
+<h3 id="Navegador_de_Internet_Samsung"><em>Navegador de Internet Samsung</em></h3>
+
+<p><em>Si tiene Samsung Internet en tu dispositivo móvil, verás un icono diferente.</em></p>
+
+<p><em><img alt="Una captura de pantalla del navegador de Internet de Samsung que muestra su icono Agregar a la pantalla de inicio" src="https://mdn.mozillademos.org/files/17161/samsung-internet-add-app.png" style="height: 247px; width: 500px;"></em></p>
+
+<p><em>Tocar ese ícono debería llevarte al mismo pasquín de confirmación que se muestra en Firefox arriba.</em></p>
+
+<h3 id="Google_Chrome_para_Android"><em>Google Chrome para Android</em></h3>
+
+<p><em>Si tienes Google Chrome para Android disponible, la experiencia es ligeramente diferente; al cargar nuestro sitio, verás un pasquín de instalación emergente que te preguntará si deseas agregar esta aplicación a tu pantalla de inicio.</em></p>
+
+<p><em><img alt="Captura de pantalla de un pasquín de Chrome que solicita permiso para instalar la aplicación de muestra Foxes" src="https://mdn.mozillademos.org/files/17159/chrome-a2hs-banner.png" style="height: 301px; width: 500px;"></em></p>
+
+<div class="blockIndicator note">
+<p><em><strong>Nota</strong>: Puedes obtener más información sobre los paquínes de instalación de Chrome en el artículo <a href="https://developers.google.com/web/fundamentals/app-install-banners/">Pasquínes de instalación de aplicaciones web</a>.</em></p>
+</div>
+
+<p><em>Si eliges no agregarlo a tu pantalla de inicio en este momento, los puedes hacer más tarde usando el ícono "Agregar a la pantalla de inicio" en el menú principal de Chrome.</em></p>
+
+<h3 id="Safari_para_iOSiPhoneOSiPadOS"><em>Safari para iOS/iPhoneOS/iPadOS</em></h3>
+
+<p><em>En iOS de Apple (incluidos iPhoneOS y iPadOS), el navegador Safari integrado en el dispositivo tiene cierto soporte para aplicaciones web, incluido el soporte para agregar a la función de pantalla de inicio. Para agregar una aplicación web a la pantalla de inicio (también conocida como lanzador o trampolín), toca el botón para compartir (<img alt="Icono de compartir cuadrado y flecha desde iOS y macOS" src="https://mdn.mozillademos.org/files/17156/square.svg" style="height: 18px; width: 14px;">) en la parte inferior de la pantalla:</em></p>
+
+<p><em><img alt="Captura de pantalla que muestra la ubicación del botón Compartir en Safari en iOS 13" src="https://mdn.mozillademos.org/files/17163/safari-ios-a2hs-icon.png" style="height: 617px; width: 500px;"></em></p>
+
+<p><em>Esto llama al panel para compartir. Entre las opciones debe estar la opción "Agregar a la pantalla de inicio", a menos que el usuario la haya eliminado específicamente de la lista al editar las opciones mostradas:</em></p>
+
+<p><em><img alt="Captura de pantalla del panel para compartir de Safari iOS, que muestra la opción" src="https://mdn.mozillademos.org/files/17165/safari-ios-share-menu.png" style="height: 551px; width: 500px;"></em></p>
+
+<p><em>Al elegir "Agregar a la pantalla de inicio" aquí se presenta el cuadro de diálogo de confirmación, que no solo confirma que el usuario desea agregar la aplicación a la pantalla de inicio, sino que también le permite personalizar su nombre.</em></p>
+
+<p><em><img alt='Una captura de pantalla de iOS Safari que muestra su panel de configuración y confirmación "Agregar a la pantalla de inicio"' src="https://mdn.mozillademos.org/files/17167/safari-ios-a2hs-banner.png" style="height: 439px; width: 500px;"></em></p>
+
+<p><em>Al hacer clic en "Agregar", la aplicación se incluye en la pantalla de inicio.</em></p>
+
+<h3 id="La_aplicación_web_instalada"><em>La aplicación web instalada</em></h3>
+
+<p><em>Independientemente del navegador y el dispositivo que estés utilizando, cuando eliges agregar la aplicación a tu pantalla de inicio o al iniciador de aplicaciones, aparecerá allí con el mismo aspecto que cualquier aplicación. Normalmente, esto significa que verás el icono de la aplicación junto con un título corto.</em></p>
+
+<p><em><img alt='Captura de pantalla de una pantalla de inicio de Android con la aplicación "Foxes" mostrada' src="https://mdn.mozillademos.org/files/17157/a2hs-on-home-screen.png" style="height: 304px; width: 500px;"></em></p>
+
+<p><em>Cuando tocas el icono de la aplicación web en la pantalla de inicio, se abre en un entorno web de pantalla completa, sin la interfaz de usuario del navegador a su alrededor.</em></p>
diff --git a/files/es/web/progressive_web_apps/responsive/media_types/index.html b/files/es/web/progressive_web_apps/responsive/media_types/index.html
new file mode 100644
index 0000000000..122b374df8
--- /dev/null
+++ b/files/es/web/progressive_web_apps/responsive/media_types/index.html
@@ -0,0 +1,395 @@
+---
+title: Media
+slug: Web/Progressive_web_apps/Responsive/Media_types
+translation_of: Web/Progressive_web_apps/Responsive/Media_types
+original_slug: Web/CSS/Introducción/Media
+---
+<p>{{CSSTutorialTOC}} {{previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Tables", "Tables")}}</p>
+
+<p>Esta es la ultima sección de la primera parte del tutorial de <a href="/es/docs/Web/CSS/Introducción" title="es/docs/Web/CSS/Introducción">Introducción a CSS</a>. Muchas páginas de este tutorial se han enfocado en las propiedades y valores de CSS que especifican como mostrar un documento. Esta sección indaga otra vez en el propósito y la estructura de las hojas de estilo.</p>
+
+<h2 class="clearLeft" id="Información_Media">Información: Media</h2>
+
+<p>El propósito de CSS es especificar cómo los documentos son presentados al usuario. La presentación puede tener más de una forma.</p>
+
+<p>Por ejemplo, probablemente estes leyendo esta página en algún aparato doméstico (un celular, tu pc). Pero también podrías querer proyectarlo para una audiencia mas grande o imprimirlo. Estos medios pueden tener diferentes características. CSS te provee diferentes maneras de presentar un documento en distintos medios.</p>
+
+<p>Para especificar reglas para un medio en particular, usa {{CSSXref("@media")}} seguido por el tipo de medio, seguido por llaves que encierren las reglas.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p>Un documento en un web site tiene una barra de navegación que permite a los usuarios moverse en el sitio.</p>
+
+<p>En el lenguaje de marcado, el elemento padre de esta área tiene el <strong>id</strong> <code>nav-area</code>. (En {{HTMLVersionInline(5)}}, esto puede ser marcado con el elemento {{HTMLElement("nav")}} en vez de un {{HTMLElement("div")}} con un atributo <strong>id</strong>.)</p>
+
+<p>Cuando vas a imprimir el documento esa área de navegación no tiene ningún propósito, entonces con las hojas de estilo puedes removerlo completamente:</p>
+
+<pre class="brush:css">@media print {
+  #nav-area {display: none;}
+  }
+</pre>
+</div>
+
+<p>Algunos de los tipos de medios comunes son:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><code>screen</code></td>
+   <td>Pantalla de computadora</td>
+  </tr>
+  <tr>
+   <td><code>print</code></td>
+   <td>Medio paginado</td>
+  </tr>
+  <tr>
+   <td style="padding-right: 1em;"><code>projection</code></td>
+   <td>Pantalla proyectada</td>
+  </tr>
+  <tr>
+   <td><code>all</code></td>
+   <td>Todos (por defecto)</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="tuto_details">
+<div class="tuto_type">Mas detalles</div>
+
+<p>Existen otras maneras de especificar un conjunto de reglas para los distintos medios.</p>
+
+<p>El lenguaje de marcado del documento puede permitir que el tipo de medio sea determinado cuando la hoja de estilo esta enlazada al documento. Por ejemplo, en HTML puedes especificar el tipo de medio con un atributo <code>media</code> en la etiqueta LINK.</p>
+
+<p>En CSS puedes usar {{CSSXref("@import")}} al inicio de la hoja de estilo para importar otra hoja de estilo de una URL, opcionalmente especificando el tipo de medio.</p>
+
+<p>Al usar estas técnicas puedes separar las reglas de estilo para los diferentes medios en distintos archivos. Esta es una manera útil de estructurar tus hojas de estilo.</p>
+
+<p>Para más detalles de los tipos de medio, ve <a href="http://www.w3.org/TR/CSS21/media.html">Media</a> en la especificación de CSS.</p>
+
+<p>Existen mas ejemplos de la propiedad {{cssxref("display")}} en una página posterior de este tutorial: <a href="/en-US/docs/Web/Guide/CSS/Getting_Started/XML_data" title="en-US/docs/Web/Guide/CSS/Getting_Started/XML_data">XML data</a>.</p>
+</div>
+
+<h3 id="Imprimir">Imprimir</h3>
+
+<p>CSS tiene algún soporte especifico para impresión y para medios páginados en general.</p>
+
+<p>Una regla {{cssxref("@page")}} puede determinar los márgenes de la página. Para impresión de doble cara, puedes definir los márgenes separadamente para <code>@page:left</code> y <code>@page:right</code>.</p>
+
+<p>Para medios impresios, normalmente usas unidades apropiadas de lonfigutd como pulgadas (<code>in</code>) y puntos (<code>pt</code> = 1/72 inch), o centimetros (<code>cm</code>) y milimetros (<code>mm</code>). Es igualmente apropiado usar ems (<code>em</code>) para conincidir el tamaño de la fuente, y porcentajes (<code>%</code>).</p>
+
+<p>Tu puedes controlar como los saltos de línea del contenido de un documento, al usar las propiedades {{cssxref("page-break-before")}}, {{cssxref("page-break-after")}} y{{cssxref("page-break-inside")}}.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p>Esta regla determina los márgenes a una pulgada en todos los lados:</p>
+
+<pre class="brush:css">@page {margin: 1in;}
+</pre>
+
+<p>Esta regla asegura que cada elemento H1 empiece en una nueva página:</p>
+
+<pre class="brush:css">h1 {page-break-before: always;}
+</pre>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type">Más detalles</div>
+
+<p>Para más detalles del soporte de CSS para medios paginados, ver <a href="http://www.w3.org/TR/CSS21/page.html">Paged media</a> en la especificación de CSS.</p>
+
+<p>Como otras características de CSS, imprimir depende de tu navegador y su configuración. Por ejemplo, Mozilla te suple con unos márgenes por defecto, cabeceras y pies de página cuando imprimes. Cuando otros usuarios imprimen tu documento, probablemente no puedas predecir el navegador y la configuración usada, por lo que no podrás controlar los resutlados completamente.</p>
+</div>
+
+<h3 id="Interfaces_de_Usuario">Interfaces de Usuario</h3>
+
+<p>CSS tiene algunas propiedades especificas para aparatos que soportanuna interfaz de usuario, como monitores. Esto hace que la apariencia del documento cambie dinámicamente mientras el usuario trabaja con la interfaz.</p>
+
+<p>No existe un tipo especial de medio para aparatos con interfaz de usuario.</p>
+
+<p>Si existen cinco selectores especiales:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><strong>Selector</strong></td>
+   <td><strong>Selects</strong></td>
+  </tr>
+  <tr>
+   <td><code>E{{cssxref(":hover")}}</code></td>
+   <td>Cualquier elemento E que tenga el puntero sobre él</td>
+  </tr>
+  <tr>
+   <td><code>E{{cssxref(":focus")}}</code></td>
+   <td>Cualquier elemento E que tenga el foco del teclado</td>
+  </tr>
+  <tr>
+   <td><code>E{{cssxref(":active")}}</code></td>
+   <td>Cualquier elemento E que este envuelto en la acción actual del usuario</td>
+  </tr>
+  <tr>
+   <td><code>E{{cssxref(":link")}}</code></td>
+   <td>Cualquier elemento E que es un hipervinculo a una URL no visitada por el usuario</td>
+  </tr>
+  <tr>
+   <td><code>E{{cssxref(":visited")}}</code></td>
+   <td>Cualquier elemento E que es un hipervinculo a una URL que el usuario ya visito</td>
+  </tr>
+ </tbody>
+</table>
+
+<div class="note">
+<p><strong>Nota: </strong>La información que puede ser obtenida con el selector :visited esta restringida en {{gecko("2.0")}}. Ver <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Privacy_and_the_:visited_selector" title="en-US/docs/Web/Guide/CSS/Privacy and the :visited selector">Privacy and the :visited selector</a> para más detalles.</p>
+</div>
+
+<p>La propiedad {{cssxref("cursor")}} especifica la forma del puntero: Algunas de las formas comunes son las siguientes.</p>
+
+<p>Coloca el mouse sobre los items en este lista para ver la forma actual del puntero en tu navegador:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <td><strong>Selector</strong></td>
+   <td><strong>Selects</strong></td>
+  </tr>
+  <tr style="cursor: pointer;">
+   <td><code>pointer</code></td>
+   <td>Indicating a link</td>
+  </tr>
+  <tr style="cursor: wait;">
+   <td><code>wait</code></td>
+   <td>Indicating that the program cannot accept input</td>
+  </tr>
+  <tr style="cursor: progress;">
+   <td><code>progress</code></td>
+   <td>Indicating that the program is working, but can still accept input</td>
+  </tr>
+  <tr style="cursor: default;">
+   <td><code>default</code></td>
+   <td>The default (usually an arrow)</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Una propiedad {{cssxref("outline")}} crea un contorno que a menudo es usado para indicar el foco del teclado. Sus valores son similares a la propiedad {{cssxref("border")}}, excepto que no puedes especificar lados individuales.</p>
+
+<p>Otras características de las interfaces de usuario son implementadas usando atributos. Por ejemplo, un elemento que esta deshabilitado o es de solo lectura tiene el atributo <strong>disabled</strong> o el atributo <strong>readonly</strong>. Selectores puede especificar estos atributos como cualquier otro, usando corchetes: <code>{{mediawiki.external('disabled')}}</code> o <code>{{mediawiki.external('readonly')}}</code>.</p>
+
+<div class="tuto_example">
+<div class="tuto_type">Ejemplo</div>
+
+<p>Estas reglas especifican estilos para un boton que cambia dinámicamente cuando el usuario interactúa con el:</p>
+
+<pre class="brush:css">.green-button {
+  background-color:#cec;
+  color:#black;
+  border:2px outset #cec;
+  }
+
+.green-button[disabled] {
+  background-color:#cdc;
+  color:#777;
+  }
+
+.green-button:active {
+  border-style: inset;
+  }
+</pre>
+
+<p>Esta wiki no soporta una interfaz de usuario en la página, entonces estos botones no hacen "click". A continuación se presentan una imágenes estáticas para ilustrar la idea:</p>
+
+<table style="background-color: #fff; border: 2px outset #36b; padding: 1em;">
+ <tbody>
+  <tr>
+   <td>
+    <table>
+     <tbody>
+      <tr>
+       <td><span style="background-color: #cdc; border: 2px outset #cec; color: #777; cursor: default; height: 2em; margin-right: 1em; padding: .5em 1em; width: 8em;">Click Me</span></td>
+       <td><span style="background-color: #cec; border: 2px outset #cec; cursor: move; height: 2em; margin-right: 1em; padding: .5em 1em; width: 8em;">Click Me</span></td>
+       <td><span style="background-color: #cec; border: 2px inset #cec; cursor: move; height: 2em; margin-right: 1em; padding: .5em 1em; width: 8em;">Click Me</span></td>
+      </tr>
+      <tr style="line-height: 25%;">
+       <td> </td>
+      </tr>
+      <tr style="font-style: italic;">
+       <td>disabled</td>
+       <td>normal</td>
+       <td>active</td>
+      </tr>
+     </tbody>
+    </table>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Un botón completamente funcional también tiene un contorno oscuro alrededor cuando esta por defecto, y un contorno punteado en él cuando tiene el foco del teclado. También podría un efecto flotante (hover) cuando el puntero este sobre el.</p>
+</div>
+
+<div class="tuto_details">
+<div class="tuto_type">Más detalles</div>
+
+<p>Para más información sobre interfaces de usuario en CSS, ver <a href="http://www.w3.org/TR/CSS21/ui.html">User interface</a> en la especificación de CSS.</p>
+
+<p>Existe un ejemplo del lenguaje de marcado usado por Mozilla para interfaces de usuario, XUL, en la Parte II de este tutorial.</p>
+</div>
+
+<h2 id="Acción_Imprimir_un_documento">Acción: Imprimir un documento</h2>
+
+<ol>
+ <li>Abrir un nuevo documento HTML, <code>doc4.html</code>. Copiar y pegar el contenido de aqui:
+
+  <pre class="brush:html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;Print sample&lt;/title&gt;
+    &lt;link rel="stylesheet" href="style4.css"&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;h1&gt;Section A&lt;/h1&gt;
+    &lt;p&gt;This is the first section...&lt;/p&gt;
+    &lt;h1&gt;Section B&lt;/h1&gt;
+    &lt;p&gt;This is the second section...&lt;/p&gt;
+    &lt;div id="print-head"&gt;
+      Heading for paged media
+    &lt;/div&gt;
+    &lt;div id="print-foot"&gt;
+      Page:
+    &lt;/div&gt;
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+ </li>
+ <li>Abrir una nueva hoja de estilo, <code>style4.css</code>. Copiar y pegar el contenido de aqui:
+  <pre class="brush:css">/*** Print sample ***/
+
+/* defaults  for screen */
+#print-head,
+#print-foot {
+  display: none;
+  }
+
+/* print only */
+@media print {
+
+h1 {
+  page-break-before: always;
+  padding-top: 2em;
+  }
+
+h1:first-child {
+  page-break-before: avoid;
+  counter-reset: page;
+  }
+
+#print-head {
+  display: block;
+  position: fixed;
+  top: 0pt;
+  left:0pt;
+  right: 0pt;
+
+  font-size: 200%;
+  text-align: center;
+  }
+
+#print-foot {
+  display: block;
+  position: fixed;
+  bottom: 0pt;
+  right: 0pt;
+
+  font-size: 200%;
+  }
+
+#print-foot:after {
+  content: counter(page);
+  counter-increment: page;
+  }
+
+} /* end print only */
+</pre>
+ </li>
+ <li>Ve este documento en tu navegador; este usa el estilo por defecto de tu navegador.</li>
+ <li>Imprime (o previsualiza) el documento; la hoja de estilo coloca cada sección en una página separada, y agrega una cabecera y un pie de página por cada una. Si tu navegador soporta contadores, le agregará un número de página al pie.
+  <table>
+   <tbody>
+    <tr>
+     <td>
+      <table style="border: 2px outset #36b; padding: 1em;">
+       <tbody>
+        <tr>
+         <td>
+          <table style="margin-right: 2em; width: 15em;">
+           <tbody>
+            <tr>
+             <td>
+              <div style="font-size: 110%; text-align: center; margin-bottom: .5em;">Heading for paged media</div>
+
+              <div style="font-size: 150%; font-weight: bold;">Section A</div>
+
+              <div style="font-size: 75%;">This is the first section...</div>
+
+              <div style="font-size: 150%; text-align: right; margin-top: 12em;">Page: 1</div>
+             </td>
+            </tr>
+           </tbody>
+          </table>
+         </td>
+        </tr>
+       </tbody>
+      </table>
+     </td>
+     <td>
+      <table style="border: 2px outset #36b; padding: 1em;">
+       <tbody>
+        <tr>
+         <td>
+          <table style="margin-right: 2em; width: 15em;">
+           <tbody>
+            <tr>
+             <td>
+              <div style="font-size: 110%; text-align: center; margin-bottom: .5em;">Heading for paged media</div>
+
+              <div style="font-size: 150%; font-weight: bold;">Section B</div>
+
+              <div style="font-size: 75%;">This is the second section...</div>
+
+              <div style="font-size: 150%; text-align: right; margin-top: 12em;">Page: 2</div>
+             </td>
+            </tr>
+           </tbody>
+          </table>
+         </td>
+        </tr>
+       </tbody>
+      </table>
+     </td>
+    </tr>
+   </tbody>
+  </table>
+ </li>
+</ol>
+
+<table style="background-color: #fffff4; border: 1px solid #36b; padding: 1em; width: 100%;">
+ <caption>Retos</caption>
+ <tbody>
+  <tr>
+   <td>Mueve las relgas de estilo especificas para imprimir a un archivo CSS separado.
+    <p>Lee la página de referencia {{CSSXref("@import")}} para buscar detalles de como importar el nuevo archivo CSS especifico para imrpimir dentro de tu hoja de estilo style4.css.</p>
+
+    <p>Haz que las encabezamientos se vuelvan azules cuando el puntero del mouse este sobre ellos.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
+
+<p><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/Challenge_solutions#Media" title="en-US/docs/Web/Guide/CSS/Getting_started/Challenge_solutions#Media">Ver soluciones a estos retos.</a></p>
+
+<h2 id="¿Qué_sigue">¿Qué sigue?</h2>
+
+<p>Si has tenido dificultades entendiendo esta página, o si tienes algún comentario, por favor contribuye en la página de <a href="/Talk:en-US/docs/Web/Guide/CSS/Getting_Started/Media" title="Talk:en-US/docs/Web/Guide/CSS/Getting_Started/Media">Discussion</a>.</p>
+
+<p>Hasta aquí, todas las reglas de estilo en este tutorial han estado en archivos especificos. Las reglas y sus valores son fijos. La siguiente página describe como cambiar las reglas dinámicamente al usar un lenguaje de programación: <strong><a href="/en-US/docs/Web/Guide/CSS/Getting_Started/JavaScript" title="en-US/docs/Web/Guide/CSS/Getting_Started/JavaScript">JavaScript</a></strong></p>
diff --git a/files/es/web/progressive_web_apps/ventajas/index.html b/files/es/web/progressive_web_apps/ventajas/index.html
deleted file mode 100644
index e1fa9fad1f..0000000000
--- a/files/es/web/progressive_web_apps/ventajas/index.html
+++ /dev/null
@@ -1,63 +0,0 @@
----
-title: Ventajas de una aplicación web progresiva (AWP)
-slug: Web/Progressive_web_apps/Ventajas
-tags:
-  - AWP
-  - aplicaciones web progresivas
-  - conceptos
-  - ventajas
-translation_of: Web/Progressive_web_apps/Introduction#Advantages_of_web_applications
-translation_of_original: Web/Progressive_web_apps/Advantages
----
-<p class="summary">Las Aplicaciones Web Progresivas deben tener todas las ventajas enumeradas en las siguientes secciones a continuación.</p>
-
-
-
-<h2 id="Reconocible">Reconocible<img alt="" src="https://mdn.mozillademos.org/files/12654/discoverable.svg" style="float: right; height: 40px; width: 38px;"></h2>
-
-<p>El objetivo final es que las aplicaciones web deben tener una mejor representación en los motores de búsqueda, ser más fáciles de exponer, catalogar y clasificar, y tener metadatos que los navegadores puedan utilizar para darles capacidades especiales.</p>
-
-<p>Algunas de las capacidades ya se han habilitado en ciertas plataformas basadas en la web mediante tecnologías patentadas como <a href="http://ogp.me/">Open Graph</a>, que proporciona un formato para especificar metadatos similares en el <code>&lt;head&gt;</code> de HTML usando metaetiquetas.</p>
-
-<p>El estándar web relevante aquí es el <a href="/en-US/docs/Web/Manifest">Manifiesto de aplicación web</a>, que define las características de una aplicación, como el nombre, el icono, la pantalla de presentación y los colores del tema en un archivo de manifiesto con formato JSON. Esto es para usar en contextos como listados de aplicaciones y pantallas de inicio de dispositivos.</p>
-
-<ul>
-</ul>
-
-<h2 id="Instalable">Instalable<img alt="" src="https://mdn.mozillademos.org/files/12656/installable.svg" style="float: right; height: 40px; width: 38px;"></h2>
-
-<p>Una parte central de la experiencia de aplicaciones es que los usuarios tengan iconos de aplicaciones en su pantalla de inicio, y ser capaz de pulsar para abrir aplicaciones en su propio contenedor nativo que se siente bien integrado con la plataforma subyacente.</p>
-
-<p>Las aplicaciones web modernas pueden tener esta sensación de aplicación nativa a través de las propiedades establecidas dentro del manifiesto de la aplicación web, y a través de una función disponible en los navegadores de teléfonos inteligentes modernos llamada <a href="/en-US/docs/Web/Apps/Progressive/Add_to_home_screen">Añadir a la página de inicio</a>.</p>
-
-<h2 id="Enlazable">Enlazable<img alt="" src="https://mdn.mozillademos.org/files/12658/linkable.svg" style="float: right; height: 40px; width: 38px;"></h2>
-
-<p>Una de las características más potentes de la Web es ser capaz de enlazar a una aplicación en una URL específica. No necesita tienda de aplicaciones, ningún proceso de instalación complejo. Así es como siempre ha sido.</p>
-
-<h2 id="Independencia_de_la_red">Independencia de la red<img alt="" src="https://mdn.mozillademos.org/files/12660/network-independent.svg" style="float: right; height: 40px; width: 38px;"></h2>
-
-<p>Las aplicaciones web modernas pueden funcionar cuando la red no es confiable, o incluso inexistente. Las ideas básicas detrás de la independencia de la red son:</p>
-
-<ul>
- <li>Volver a visitar un sitio y obtener sus contenidos, incluso si no hay una conexión red disponible.</li>
- <li>Explore cualquier tipo de contenido que el usuario haya visitado anteriormente al menos una vez, incluso en situaciones de poca conectividad.</li>
- <li>Controlar lo que se muestra al usuario en situaciones en las que no hay conectividad.</li>
-</ul>
-
-<p>Esto se logra mediante una combinación de tecnologías: <a href="/en-US/docs/Web/API/Service_Worker_API">Service Workers</a> para controlar las solicitudes de página (por ejemplo, almacenarlas sin conexión), la <a href="/en-US/docs/Web/API/Cache">Cache API</a> para almacenar respuestas a solicitudes de red fuera de línea (muy útil para almacenar recursos del sitio) y tecnologías de almacenamiento de datos del lado del cliente como <a href="/en-US/docs/Web/API/Web_Storage_API">Web Storage</a> y <a href="/en-US/docs/Web/API/IndexedDB_API">IndexedDB</a> para almacenar datos de la aplicación sin conexión.</p>
-
-<h2 id="Progresiva">Progresiva<img alt="" src="https://mdn.mozillademos.org/files/12662/progressive.svg" style="float: right; height: 40px; width: 38px;"></h2>
-
-<p>Las aplicaciones web modernas se pueden desarrollar para proporcionar una experiencia súper genial a los navegadores totalmente capaces, y una experiencia aceptable (aunque no tan brillante) para los navegadores menos capaces. Hemos estado haciendo esto durante años con las mejores prácticas como <a href="/en-US/docs/Glossary/Progressive_Enhancement">mejora progresiva</a>.</p>
-
-<h2 id="Reconectable">Reconectable<img alt="" src="https://mdn.mozillademos.org/files/12666/re-engageable.svg" style="float: right; height: 40px; width: 38px;"></h2>
-
-<p>Una de las principales ventajas de las plataformas nativas es la facilidad con la que los usuarios pueden volver a participar mediante actualizaciones y contenido nuevo, incluso cuando no están mirando la aplicación o utilizando sus dispositivos. Las aplicaciones web modernas ahora también pueden hacer esto, utilizando nuevas tecnologías como <a href="/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers">Service Workers</a> para controlar páginas, el <a href="/en-US/docs/Web/API/Push_API">Web Push API</a> para enviar actualizaciones directamente del servidor a la aplicación a través de un service worker, y la <a href="/en-US/docs/Web/API/Notifications_API">API de notificaciones</a> para generar notificaciones del sistema para ayudar a atraer a los usuarios cuando no están en el navegador.</p>
-
-<h2 id="Adaptable">Adaptable<img alt="" src="https://mdn.mozillademos.org/files/12650/responsive.svg" style="float: right; height: 40px; width: 38px;"></h2>
-
-<p>Las aplicaciones web adaptables usan tecnologías como consultas de media y viewport para asegurarse de que sus interfaces se ajusten a cualquier factor de forma: escritorio, móvil, tableta o lo que sea que venga después.</p>
-
-<h2 id="Seguro">Seguro<img alt="" src="https://mdn.mozillademos.org/files/12664/safe.svg" style="float: right; height: 47px; width: 38px;"></h2>
-
-<p>La plataforma web proporciona un mecanismo de entrega seguro que evita la intromisión y garantiza que el contenido no haya sido alterado, siempre que aproveche de HTTPS y desarrolle sus aplicaciones teniendo en cuenta la seguridad. Además, puede verificar la verdadera naturaleza de una AWP confirmando que está en la URL correcta, mientras que las aplicaciones en las tiendas de aplicaciones a menudo pueden parecer una cosa, pero ser otra (<a href="https://twitter.com/andreasbovens/status/926965095296651264">ejemplo</a>).</p>
diff --git a/files/es/web/security/csp/csp_policy_directives/index.html b/files/es/web/security/csp/csp_policy_directives/index.html
deleted file mode 100644
index c2f9c5a628..0000000000
--- a/files/es/web/security/csp/csp_policy_directives/index.html
+++ /dev/null
@@ -1,709 +0,0 @@
----
-title: Políticas Directivas CSP
-slug: Web/Security/CSP/CSP_policy_directives
-translation_of: Web/HTTP/Headers/Content-Security-Policy
-translation_of_original: Web/Security/CSP/CSP_policy_directives
----
-<p> </p>
-
-<p>Hay varios ámbitos de las políticas que pueden ser definidas por los administradores de las páginas web usando las Normas de Seguridad de Contenido o CSP por sus siglas en ingles. Cualquier combinación de estas políticas puede ser utilizada para satisfacer las necesidades de su sitio web, no es necesario especificar todas ellas..</p>
-
-<h2 id="Fuentes_de_contenido">Fuentes de contenido</h2>
-
-<p>La mayoría de las políticas directivas necesitan de una o más fuentes de contenido. Una fuente de contenido es una cadena que indica una posible fuente de donde el contenido puede ser descargado.</p>
-
-<h3 id="Listas_de_fuentes">Listas de fuentes</h3>
-
-<p>Una lista de fuentes es un cadena que especifica uno o más hosts de internet o direcciones IP, así como un <a href="/en-US/docs/URIs_and_URLs" title="en/URIs and URLs">esquema de URL</a> opcional y/o número de puerto. La dirección del sitio puede incluir un comodín líder (el carácter asterisco, <code>'*'</code>), y puedes usar un comodín (de nuevo, <code>'*'</code>) como el número de puerto, indicando que todos los puertos legales son válidos para la fuente. Los hosts son delimitados por espacio.</p>
-
-<p>Las expresiones validas del host son:</p>
-
-<dl>
- <dt><span class="nowiki">http://*.foo.com</span></dt>
- <dd>Junta todos los intentos de carga desde cualquier subdominio de foo.com usando el sistema URL http:.</dd>
- <dt><span class="nowiki">mail.foo.com:443</span></dt>
- <dd>Junta todos los intentos de acceso al puerto 443 en mail.foo.com.</dd>
- <dt><span class="nowiki">https://store.foo.com</span></dt>
- <dd>Junta todos los intentos para acceder store.foo.com usando https:.</dd>
-</dl>
-
-<p>Si un número de puerto no está especificado, el navegador usara el número de puerto predeterminado para el sistema especificado. Si no hay sistema especificado, el mismo sistema que ha sido usado para acceder al documento protegido será usado.</p>
-
-<dl>
-</dl>
-
-<h3 id="Palabras_claves">Palabras claves</h3>
-
-<p>También existen algunas palabras claves disponibles para describir clases especiales de fuentes de contenido. Estas palabras son las siguientes:</p>
-
-<dl>
- <dt><code>'none'</code></dt>
- <dd>Se refiere al conjunto vacío, es decir, no hay URLs que coincidan. Las comillas simples son necesarias.</dd>
- <dt><code>'self'</code></dt>
- <dd>Se refiere al origen del cual los documentos protegidos están siendo enviados, incluyendo el mismo sistema de URL y numero de puerto. Las comillas simples deben ser incluidas. Algunos navegadores excluyen específicamente <code>blob</code> y <code>filesystem</code> de las políticas directivas. Sitios que necesitan permitir  este tipo de contenido puede especificarlos usando el Data attribute.</dd>
- <dt><code>'unsafe-inline'</code></dt>
- <dd>Permite el uso de recursos alineados como elementos alineados {{ HTMLElement("script") }} , <code>javascript:</code> URLs, controladores de eventos alineados e elementos alineados {{ HTMLElement("style") }} . Las comillas simples deben ser incluidas.</dd>
- <dt><code>'unsafe-eval'</code></dt>
- <dd>Permite el uso de <code>eval()</code>y métodos similares para la creación de códigos desde las cadenas de caracteres. Las comillas simples deben ser incluidas.</dd>
-</dl>
-
-<div class="note"><strong>Nota:</strong> 'unsafe-inline' y 'unsafe-eval' son inseguros y pueden hacer de tu página web vulnerable contra cross-site scripting.</div>
-
-<p>Ejemplo, puedes especificar que el contenido sea cargado desde el origen del documento, así como desde trustedscripts.foo.com de la siguiente manera:</p>
-
-<pre>Content-Security-Policy: default-src 'self' trustedscripts.foo.com
-</pre>
-
-<dl>
-</dl>
-
-<h3 id="Data">Data</h3>
-
-<div class="note"><strong>Nota:</strong> data: URIs son inseguras y pueden hacer de tu página web vulnerable contra cross-site scripting si es permitido por las fuentes del script.</div>
-
-<dl>
- <dt>data:</dt>
- <dd>Permite que <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/data_URIs" title="en/data URIs"><code>data:</code> URIs</a> sea usada como fuente de contenido. Esto es inseguro y un atacante puede insertar data: URIs arbitrarias. Utilízala con moderación y definitivamente no para los scripts.</dd>
- <dt>mediastream:</dt>
- <dd>Permite que <a href="/en-US/docs/Web/API/MediaStream_API" title="/en/WebRTC/MediaStream_API"><code>mediastream:</code> URIs</a> sea usada como fuente de contenido.</dd>
- <dt>blob:</dt>
- <dd>Permite que <a href="/en-US/docs/Web/API/Blob" title="/en/WebRTC/MediaStream_API"><code>blob:</code> URIs</a> sea usada como fuente de contenido.</dd>
- <dt>filesystem:</dt>
- <dd>Permite que <a href="/en-US/docs/Web/API/FileSystem" title="/en/WebRTC/MediaStream_API"><code>filesystem:</code> URIs</a> sea usada como fuente de contenido.</dd>
-</dl>
-
-<pre>Content-Security-Policy: default-src 'self'; img-src 'self' data: blob: filesystem:; media-src mediastream:
-</pre>
-
-<h2 id="Políticas_directivas_soportadas">Políticas directivas soportadas</h2>
-
-<p>Las siguientes políticas directivas están disponibles para controlar la política de seguridad para varias ares de las políticas.</p>
-
-<h3 id="base-uri"><code>base-uri</code></h3>
-
-<p>La directiva &gt;<code>base-uri</code> define las URLs que un agente usuario puede usar como el documento URL base. Si este valor no está presente, cualquier URL está permitido. Si esta directiva no está presente, el agente usuario usara el valor en el elemento <code><a href="/en-US/docs/Web/HTML/Element/base">base</a>.</code></p>
-
-<pre>base-uri <em>source-list</em></pre>
-
-<h3 id="child-src"><code>child-src</code></h3>
-
-<p>La directiva <code>child-src</code> define las fuentes válidas para los trabajadores de la web y contextos de navegación anidados cargados utilizando elementos tales como {{ HTMLElement("frame") }} y {{ HTMLElement("iframe") }}. Esta opción es preferida sobre la directiva <code>frame-src</code><code>, </code><code>la cual es obsoleta. Para los trabajadores, las </code>solicitudes no conformes son tratadas como errores de red fatales por el agente usuario.</p>
-
-<div class="note"><strong>Nota: </strong>Si esta directiva no está presente, el agente usuario buscara la directiva por defecto <code>default-src.</code></div>
-
-<pre><span>​child-src <em>source-list</em></span></pre>
-
-<h3 id="connect-src"><code>connect-src</code></h3>
-
-<p>La directiva <code>connect-src</code> define fuentes válidas para fetch, <a href="/en/nsIXMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a>, WebSocket y conecciones EventSource.</p>
-
-<div class="note"><strong>Nota: </strong>Si esta directiva no está presente, el agente usuario buscara la directiva por defecto <code>default-src.</code></div>
-
-<div class="note"><strong>Nota: </strong>Antes de la versión Firefox 23, xhr-src  era utilizado en lugar de la directiva connect-src y solo restringía el uso de <a href="/en/nsIXMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a>.</div>
-
-<pre><code>connect-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="default-src"><code>default-src</code></h3>
-
-<p>La directiva por defecto <code>default-src </code><code>define la política de seguridad para los tipos de contenidos que no están expresamente señalados por otras directivas. Esta directiva abarca las siguientes directivas:</code></p>
-
-<ul>
- <li><code>child-src</code></li>
- <li><code>connect-src</code></li>
- <li><code>font-src</code></li>
- <li><code>img-src</code></li>
- <li><code>media-src</code></li>
- <li><code>object-src</code></li>
- <li><code>script-src</code></li>
- <li><code>style-src</code></li>
-</ul>
-
-<pre><code>default-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="font-src"><code>font-src</code></h3>
-
-<p>La directivas <code>font-src</code> especifica las fuentes válidas para los tipos de letras cargadas usando {{ cssxref("@font-face") }}.</p>
-
-<div class="note"><strong>Nota: </strong>Si esta directiva no está presente, el agente usuario buscara la directiva por defecto <code>default-src.</code></div>
-
-<pre><code>font-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="form-action"><code>form-action</code></h3>
-
-<p>La directiva <code>form-action</code>{{experimental_inline}} especifica criterios de valoración válidos para las sumisiones {{ HTMLElement("form") }}.</p>
-
-<pre id="script-src"><code><code>form-action</code> &gt;<em><code>source-list</code></em></code></pre>
-
-<h3 id="frame-ancestors"><code>frame-ancestors</code></h3>
-
-<p>La directiva <code>frame-ancestors</code>{{experimental_inline}} especifica padres validos que pueden incustrar una pagina usando elementos  {{ HTMLElement("frame") }} y {{ HTMLElement("frame") }}. Esta directiva no esta soportada en el elemento <code>&lt;meta&gt; </code>o por la cabecera <code>Content-Security-Policy-Report-Only.</code></p>
-
-<pre><code>frame-ancestors</code> <em><code>source-list</code></em></pre>
-
-<h3 id="frame-src_obsolete_inline"><code>frame-src</code> {{obsolete_inline}}</h3>
-
-<p>The <code>frame-src</code> directive specifies valid sources for web workers and nested browsing contexts loading using elements such as &gt;{{ HTMLElement("frame") }} and {{ HTMLElement("iframe") }}.&gt;</p>
-
-<div class="note">
-<div><strong>Note: </strong>This directive is deprecated. Use <code>child-src</code> instead.</div>
-</div>
-
-<pre>frame-src <em>source-list</em></pre>
-
-<h3 id="img-src"><code>img-src</code></h3>
-
-<p>The <code>img-src</code> directive specifies valid sources of images and favicons. </p>
-
-<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
-
-<pre><code>img-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="manifest-src"><code>manifest-src</code></h3>
-
-<p>The <code><strong>manifest-src</strong></code> directive specifies which manifest can be applied to the resource.</p>
-
-<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
-
-<pre><code>manifest-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="media-src"><code>media-src</code></h3>
-
-<p>The <code>media-src</code> directive specifies valid sources for loading media using the {{ HTMLElement("audio") }} and {{ HTMLElement("video") }} elements.</p>
-
-<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
-
-<pre><code>media-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="object-src"><code>object-src</code></h3>
-
-<p>The <code>object-src</code> directive specifies valid sources for the {{ HTMLElement("object") }}, {{ HTMLElement("embed") }}, and {{ HTMLElement("applet") }} elements. </p>
-
-<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
-
-<pre><code>object-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="plugin-types"><code>plugin-types</code></h3>
-
-<p>The <code>plugin-types</code> directive specifies the valid plugins that the user agent may invoke.</p>
-
-<pre>plugin-types <em>type-list</em></pre>
-
-<h3 id="referrer"><code>referrer</code></h3>
-
-<p>The <code>referrer</code> directive specifies information in the referrer header for links away from a page.</p>
-
-<pre>​referrer <em>value</em></pre>
-
-<h3 id="reflected-xss"><code>reflected-xss</code></h3>
-
-<p>The <code>reflected-xss</code> directive instructs a user agent to activate or deactivate any heuristics used to filter or block reflected cross-site scripting attacks. Valid values are <code>allow</code>, <code>block</code>, and <code>filter</code>. This directive is not supported in the <code>&lt;meta&gt;</code> element.</p>
-
-<div class="note"><strong>Note: </strong>This directive is ignored if it is contained in a <code>meta</code> element.</div>
-
-<pre>reflected-xss <em>value</em></pre>
-
-<h3 id="report-uri"><code>report-uri</code></h3>
-
-<p>The <code>report-uri</code> directive instructs the user agent to report attempts to violate the Content Security Policy. These violation reports consist of <a href="/en/JSON" title="en/JSON">JSON</a> documents sent via an HTTP <code>POST</code> request to the specified URI. See <a href="/en/Security/CSP/Using_CSP_violation_reports" title="en/Security/CSP/Using CSP violation reports">Using CSP violation reports</a> for details. This directive is not supported in the <code>&lt;meta&gt;</code> element.</p>
-
-<pre><code>report-uri</code> <em><code><a class="external" href="http://tools.ietf.org/html/rfc2396" title="http://tools.ietf.org/html/rfc2396">uri</a></code></em></pre>
-
-<h3 id="sandbox"><code>sandbox</code></h3>
-
-<p>The <code>sandbox</code> directive applies restrictions to a page's actions including preventing popups, preventing the execution of plugins and scripts, and enforcing a same-origin policy. This directive is not supported in the <code>&lt;meta&gt;</code> element or by the <code>Content-Security-policy-Report-Only</code> header field.</p>
-
-<pre>sandbox <em>value</em></pre>
-
-<h3 id="script-src_2"><code>script-src</code></h3>
-
-<p>The <code>script-src</code> directive specifies valid sources for JavaScript. When either the <code>script-src</code> or the <code>default-src</code> directive is included, inline script and <code>eval()</code> are disabled unless you specify 'unsafe-inline' and 'unsafe-eval', respectively.</p>
-
-<div class="note"><strong>Note: </strong>If this directive is absent the user agent will look for the <code>default-src</code> directive.</div>
-
-<pre><code>script-src</code> <em><code>source-list</code></em></pre>
-
-<h3 id="style-src"><code>style-src</code></h3>
-
-<p>The <code>style-src</code> directive specifies valid sources for stylesheets. This includes both externally-loaded stylesheets and inline use of the {{ HTMLElement("style") }} element and HTML <code>style</code> attributes. Stylesheets from sources that aren't included in the source list are not requested or loaded. When either the <code>style-src</code> or the <code>default-src</code> directive is included, inline use of the {{ HTMLElement("style") }} element and HTML <code>style</code> attributes are disabled unless you specify 'unsafe-inline'.</p>
-
-<div class="note"><strong>Note: </strong>If this directive is absent, the user agent will look for the <code>default-src</code> directive.</div>
-
-<pre><code>style-src</code> <em><code>source-list</code></em></pre>
-
-<div class="note"><strong>Note:</strong> Firefox currently requires using the same URL scheme and port for the <code>report-uri</code> as the content being protected by Content Security Policy.</div>
-
-<h3 id="upgrade-insecure-requests"><code>upgrade-insecure-requests</code></h3>
-
-<p>The <code>upgrade-insecure-requests</code> directive instructs user agents to treat all of a site's unsecure URL's (those serverd over HTTP) as though they have been replaced with secure URL's (those served over HTTPS). This directive is intended for web sites with large numbers of unsecure legacy URL's that need to be rewritten. </p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
-  <tr>
-   <td>{{ specName("Upgrade Insecure Requests")}}</td>
-   <td>{{Spec2('Upgrade Insecure Requests')}}</td>
-   <td>Adds <code>upgrade-insecure-requests</code>.</td>
-  </tr>
-  <tr>
-   <td>{{ specName("CSP 1.1") }}</td>
-   <td>{{Spec2('CSP 1.1')}}</td>
-   <td>Adds <code>base-uri</code>, <code>child-src</code>, <code>form-action</code>, <code>frame-ancestors</code>, <code>plugin-types</code>, <code>referrer</code>, <code>reflected-xss</code>, and <code>report-uri</code>. Deprecates <code>frame-src</code>.</td>
-  </tr>
-  <tr>
-   <td>{{ specName("CSP 1.0") }}</td>
-   <td>{{Spec2('CSP 1.0')}}</td>
-   <td>Defines <code>connect-src</code>, &gt;<code>default-src</code>, &gt;<code>font-src</code>, &gt;<code>frame-src</code>, &gt;<code>img-src</code>, &gt;<code>media-src</code>, &gt;<code>objects-src</code>, &gt;report-uri,&gt;<code>sandbox</code>, &gt;<code>script-src,</code> and &gt;<code>style-src</code>.&gt;</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{CompatibilityTable}}</p>
-
-<div id="compat-desktop">{{CompatUnknown}}
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome{{ref("2")}}</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>
-    <p>{{CompatChrome(14.0)}} (X-Webkit-CSP)</p>
-
-    <p>{{CompatChrome(25.0)}}</p>
-   </td>
-   <td>
-    <p>{{CompatGeckoDesktop("2.0")}} (X-Content-Security-Policy)</p>
-
-    <p>{{CompatGeckoDesktop("23.0")}}</p>
-   </td>
-   <td>Edge</td>
-   <td>15</td>
-   <td>
-    <p>6 (X-Webkit-CSP)</p>
-
-    <p>7</p>
-   </td>
-  </tr>
-  <tr>
-   <td><code>base-uri</code></td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatGeckoDesktop("35.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>child-src</code></td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>connect-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>default-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>font-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>form-action</code></td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatGeckoDesktop("36.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>frame-ancestors</code></td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatGeckoDesktop("33.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>frame-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>img-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>manifest-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("41.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>media-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>object-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>plugin-types</code></td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>referrer</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("37.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>reflected-xss</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>report-uri</code></td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>sandbox</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>script-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>style-src</code></td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoDesktop("23.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td>
-    <p><code>upgrade-insecure-requests</code></p>
-   </td>
-   <td>
-    <p class="p1">{{CompatChrome(43.0)}}</p>
-   </td>
-   <td>{{CompatGeckoDesktop("42.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android Browser{{ref("1")}}</th>
-   <th>Android Webview{{ref("2")}}</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-   <th>Chrome for Mobile{{ref("2")}}</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("2.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>iOS 7.1</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>base-uri</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatGeckoMobile("35.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-  </tr>
-  <tr>
-   <td><code>child-src</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-  </tr>
-  <tr>
-   <td><code>connect-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>default-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>font-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>form-action</code> </td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatGeckoMobile("36.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-  </tr>
-  <tr>
-   <td><code>frame-ancestors</code> </td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatGeckoMobile("33.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-  </tr>
-  <tr>
-   <td><code>frame-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>img-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>manifest-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatGeckoDesktop("41.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>media-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>object-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>plugin-types</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-  </tr>
-  <tr>
-   <td><code>referrer</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatGeckoMobile("37.0")}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>reflected-xss</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>report-uri</code></td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(40.0)}}</td>
-  </tr>
-  <tr>
-   <td><code>sandbox</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>script-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>style-src</code></td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-  </tr>
-  <tr>
-   <td><code>upgrade-insecure-requests</code></td>
-   <td>{{CompatGeckoMobile(42)}}</td>
-   <td>{{CompatChrome(43.0)}}</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatUnknown}}</td>
-   <td>{{CompatChrome(43.0)}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="sect1"> </h2>
-
-<h2 id="Notes">Notes</h2>
-
-<p>{{ref("1")}} Deprecated since Android 4.0.</p>
-
-<p>{{ref("2")}} Starting with version {{CompatChrome(45.0)}}, Chrome excludes <code>blob</code> and <code>filesystem</code> from source directives. Sites needing to allow these content types can specify them using the Data attribute.</p>
-
-<h2 id="See_also">See also</h2>
-
-<ul>
- <li><a href="/en/Security/CSP/Introducing_Content_Security_Policy" title="en/Security/CSP/Introducing Content Security Policy">Introducing Content Security Policy</a></li>
- <li><a href="/en/Security/CSP/Using_Content_Security_Policy" title="en/Security/CSP/Using Content Security Policy">Using Content Security Policy</a></li>
- <li><a href="/en/Security/CSP/Using_CSP_violation_reports" title="en/Security/CSP/Using CSP violation reports">Using CSP violation reports</a></li>
-</ul>
diff --git a/files/es/web/security/csp/index.html b/files/es/web/security/csp/index.html
deleted file mode 100644
index 6fcf1a2ff3..0000000000
--- a/files/es/web/security/csp/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: CSP (Políticas de Seguridad de Contenido)
-slug: Web/Security/CSP
-tags:
-  - Documento
-  - Referencia
-translation_of: Web/HTTP/CSP
-translation_of_original: Web/Security/CSP
----
-<div>{{gecko_minversion_header("2.0")}}</div>
-
-<p><strong>Políticas de Seguridad de Contenido </strong>(CSP) es una capa de seguridad adicional que ayuda a detectar y mitigar cierto tipo de ataques, incluyendo <a href="/en-US/docs/Glossary/Cross-site_scripting">Cross-Site Scripting (XSS)</a> y ataques de inyección de datos. Estos ataques son usados para cualquier cosa desde robo de datos hasta la alteración de su sitio o distribución de malware.</p>
-
-<p>Aunque las Políticas de Seguridad de Contenido fueron incluidas desde Firefox 4, esa implementación, usando la cabecera <code>X-Content-Security-Policy</code>, es anterior a la existencia de una especificacion formal de CSP. Firefox 23 contiene una implementación actualizada de CSP que usa la cabecera <code>Content-Security-Policy</code> sin prefijo y las directivas como están descritas en la especificación W3C CSP 1.0.</p>
-
-<h2 id="Tópicos_de_Políticas_de_Seguridad_de_Contenido">Tópicos de Políticas de Seguridad de Contenido</h2>
-
-<dl>
- <dt><a href="/en-US/docs/Web/Security/CSP/Introducing_Content_Security_Policy">Introducción a Políticas de Seguridad de Contenido</a></dt>
- <dd>Un resumen de que es y como CSP puede hacer su sitio mas seguro.</dd>
- <dt><a href="/en-US/docs/Web/Security/CSP/CSP_policy_directives">Directivas de Políticas CSP</a></dt>
- <dd>Una referencia de las directivas de políticas CSP.</dd>
- <dt><a href="/en-US/docs/Web/Security/CSP/Using_Content_Security_Policy">Usando Políticas de Seguridad de Contenido</a></dt>
- <dd>Puede ajustar el comportamiento de CSP configurando el conjunto de las políticas. Esto le permite reducir y ajustar la seguridad para tipos individuales de recursos, basado en las necesidades de su sitio. Este artículo describe como configurar CSP, asi como también habilitarlo para el uso en su sitio.</dd>
- <dt><a href="/en-US/docs/Web/Security/CSP/Using_CSP_violation_reports">Usando reportes de violación de CSP</a></dt>
- <dd>Como usar los reportes de violación de las Políticas de Seguridad de Contenido para monitorear los intentos de ataque a su sitio y a sus usuarios.</dd>
- <dt><a href="/en-US/docs/Security/CSP/Default_CSP_restrictions">Restricciones CSP por defecto</a></dt>
- <dd>Detalles acerca de las restricciones por defecto reforzadas por CSP.</dd>
-</dl>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Security">Seguridad</a></li>
- <li><a href="/en-US/docs/HTTP_access_control">Control de acceso HTTP</a></li>
- <li><a class="link-https" href="http://www.w3.org/TR/CSP/">Especificación CSP 1.0</a></li>
- <li><a class="link-https" href="http://w3c.github.io/webappsec/specs/content-security-policy/csp-specification.dev.html">Especificación CSP 2</a></li>
- <li><a href="/docs/Apps/CSP">Restricciones CSP para Aplicaciones Web Públicas</a></li>
-</ul>
diff --git a/files/es/web/security/csp/introducing_content_security_policy/index.html b/files/es/web/security/csp/introducing_content_security_policy/index.html
deleted file mode 100644
index 58960c7798..0000000000
--- a/files/es/web/security/csp/introducing_content_security_policy/index.html
+++ /dev/null
@@ -1,57 +0,0 @@
----
-title: Introducción a Políticas de Seguridad de Contenido
-slug: Web/Security/CSP/Introducing_Content_Security_Policy
-tags:
-  - Documento
-  - Políticas de Seguridad de Contenido
-  - Referencia
-  - Seguridad
-translation_of: Web/HTTP/CSP
-translation_of_original: Web/Security/CSP/Introducing_Content_Security_Policy
----
-<p>{{ gecko_minversion_header("2") }}</p>
-
-<p><strong>Políticas de Seguridad de Contenido</strong> (CSP) es una capa de seguridad adicional que ayuda a detectar y mitigar cierto tipo de ataques, incluyendo <a href="https://developer.mozilla.org/en-US/docs/Glossary/Cross-site_scripting">Cross-Site Scripting (XSS)</a> y ataques de inyección de datos. Estos ataques son usados para cualquier cosa desde el robo de datos hasta hasta la alteración de su sitio o la distribución de malware.</p>
-
-<p>CSP esta diseñado para ser completamente compatible hacia atras; los navegadores web que no lo soporten todavía pueden trabajar con servidores que las implementen, y viceversa. Los navegadores web que no soporten CSP simplemente la ignoran, funcionando como es normal, usando la política de mismo origen por defecto para contenido web. Si el sitio no tiene la cabecera CSP, los navegadores web usan en su lugar la <a href="/en-US/docs/Web/Security/Same-origin_policy" title="En/Same origin policy for JavaScript">política de mismo origen</a>.</p>
-
-<p>Habilitar CSP tan fácil como configurar su servidor web para retornar la cabecera HTTP <code>Content-Security-Policy</code>. (Antes de Firefox 23, la cabecera <code>X-Content-Security-Policy</code> era usada). Ver <a href="/en-US/docs/Web/Security/CSP/Using_Content_Security_Policy" title="en/Security/CSP/Using Content Security Policy">Usando Políticas de Seguridad de Contenido</a> para detalles de como configurar y habilitar CSP.</p>
-
-<div class="note"><strong>Nota:</strong> El estándar de Políticas de Seguridad de Contenido <a class="link-https" href="https://dvcs.w3.org/hg/content-security-policy/raw-file/tip/csp-specification.dev.html#meta-http-equiv--x-content-security-policy---html-element" title="https://dvcs.w3.org/hg/content-security-policy/raw-file/tip/csp-specification.dev.html#meta-http-equiv--x-content-security-policy---html-element">especifica</a> que un elemento {{ HTMLElement("meta") }} puede ser usado para configurar una política, pero esta característica todavía no está soportada en Firefox. El soporte para esta característica será añadida según <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=663570" title="https://bugzilla.mozilla.org/show_bug.cgi?id=663570">bug 663570</a>.</div>
-
-<h2 id="Mitigando_cross_site_scripting">Mitigando cross site scripting</h2>
-
-<p>Un objetivo primario de CSP es mitigar y reportar ataques XSS. Los ataques XSS explotan la confianza de los navegadores web en el contenido recibido del servidor. Los scripts maliciosos son ejecutados por la victima del navegador web por que éste confía en el origen del contenido, aún cuando no viene desde donde parece venir.</p>
-
-<p>CSP hace posible a los administradores de servidores reducir o eliminar los vectores por los cuales un ataque XSS puede ocurrir especificando los dominios que el navegador web debe considerar orígenes válidos de scripts ejecutables. Un navegador web compatible con CSP entonces solo ejecutará scripts cargados en archivos fuente recibidos de aquellos dominios permitidos, ignorando todos los demás scripts (incluyendo scripts en línea y atributos HTML de manejo de eventos).</p>
-
-<p>Como una última forma de protección, los sitios que no deseen permitir nunca la ejecución de scripts pueden optar por deshabilitar globalmente la ejecución de scripts.</p>
-
-<h2 id="Mitigando_ataques_de_packet_sniffing">Mitigando ataques de packet sniffing</h2>
-
-<p>En adición a la restricción de los dominos desde los cuales el contenido puede ser cargado, el servidor puede especificar que protocolos son permitidos para su uso; por ejemplo (e idealmente, desde un punto de vista de seguridad), un servidor puede especificar que todo el contenido debe ser cargado usando HTTPS.</p>
-
-<div class="note"><strong>Nota:</strong> Una estrategia de transmisión segura de datos incluye no solo reforzar HTTPS para la transferencia de datos, sino tambien marcar todas las cookies con indicadores seguros y proveer redirecciones automáticas desde páginas HTTP a sus contrapartes en HTTPS.</div>
-
-<div class="note"><strong>Nota:</strong> Los sitios pueden usar tambien la cabecera HTTP  <a href="/en-US/docs/Web/Security/HTTP_strict_transport_security" title="/en/Security/HTTP_Strict_Transport_Security">Strict-Transport-Security</a> para asegurarse de que los navegadores web se conecten solo a traves de un canal encriptado.</div>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/Security/CSP/Using_Content_Security_Policy" title="en/Security/CSP/Using Content Security Policy">Usando las Políticas de Seguridad de Contenido</a></li>
- <li><a href="/en-US/docs/Web/Security/CSP/CSP_policy_directives" title="en/Security/CSP/CSP policy directives">Directivas de políticas CSP</a></li>
- <li><a href="/en-US/docs/Web/Security/CSP/Using_CSP_violation_reports" title="en/Security/CSP/Using CSP violation reports">Usando reportes de violación de CSP</a></li>
-</ul>
-
-<h2 id="Especificación">Especificación</h2>
-
-<ul>
- <li>{{ spec("https://w3c.github.io/webappsec/specs/content-security-policy/", "Políticas de Seguridad de Contenidos (Borradores de Editores)") }}</li>
- <li>{{ spec("http://www.w3.org/TR/CSP/", "Políticas de Seguridad de Contenido (Recomendación Candidata)") }}</li>
-</ul>
-
-<div class="noinclude">
-<p>{{ languages( { "ja": "ja/Introducing_Content_Security_Policy" } ) }}</p>
-</div>
-
-<p> </p>
diff --git a/files/es/web/security/same-origin_policy/index.html b/files/es/web/security/same-origin_policy/index.html
new file mode 100644
index 0000000000..d08453eeee
--- /dev/null
+++ b/files/es/web/security/same-origin_policy/index.html
@@ -0,0 +1,270 @@
+---
+title: Política Same-origin
+slug: Web/Security/Same-origin_policy
+tags:
+  - CORS
+  - JavaScript
+  - Mismo-Origen
+  - Política Same-Origin
+  - Seguridad
+translation_of: Web/Security/Same-origin_policy
+original_slug: Web/Security/Same-origin_politica
+---
+<p>La política same-origin (mismo-origen) restringe cómo un documento o script cargado desde un origen puede interactuar con un recurso de otro origen. Es un mecanismo de seguridad crítico para aislar documentos potencialmente maliciosos.</p>
+
+<h2 id="Definición_de_origen">Definición de origen</h2>
+
+<p>Dos páginas tienen el <em>mismo origen</em> si el {{Glossary("protocol","protocolo")}}, {{Glossary("port","puerto")}} (si es especificado) y {{Glossary("host","anfitrión")}} son los mismos para ambas páginas. Verá esto a veces referido como la "tupla esquema/anfitrión/puerto" (donde una "tupla" es un conjunto de componentes que juntos forman un todo).</p>
+
+<p>La siguiente tabla muestra ejemplos de comparaciones de origenes para la URL <code>http://store.company.com/dir/page.html</code>:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>URL</th>
+   <th>Resultado</th>
+   <th>Razón</th>
+  </tr>
+  <tr>
+   <td><code>http://store.company.com/dir2/other.html</code></td>
+   <td>Mismo origen</td>
+   <td>Solo la ruta difiere</td>
+  </tr>
+  <tr>
+   <td><code>http://store.company.com/dir/inner/another.html</code></td>
+   <td>Mismo origen</td>
+   <td>Solo la ruta difiere</td>
+  </tr>
+  <tr>
+   <td><code>https://store.company.com/secure.html</code></td>
+   <td>Fallo</td>
+   <td>Diferente protocolo</td>
+  </tr>
+  <tr>
+   <td><code>http://store.company.com:81/dir/etc.html</code></td>
+   <td>Fallo</td>
+   <td>Diferente puerto</td>
+  </tr>
+  <tr>
+   <td><code>http://news.company.com/dir/other.html</code></td>
+   <td>Fallo</td>
+   <td>Diferente host</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Ver también <a href="/en-US/docs/Same-origin_policy_for_file:_URIs" title="Same-origin_policy_for_file:_URIs">definición de origen para <code>file:</code> URLs</a>, puesto que su comparación es más complicada.</p>
+
+<h3 id="Orígenes_heredados">Orígenes heredados</h3>
+
+<p>Los scripts ejecutados desde páginas con una URL <code>about:blank</code> o <code>javascript:</code> heredan el origen del documento que contiene esa URL, puesto que esos tipos de URLs no contienen información sobre un servidor de origen.</p>
+
+<div class="blockIndicator note">
+<p>Por ejemplo, <code>about:blank</code> a menudo se usa como URL de nuevas ventanas popup en las que el script padre escribe contenido (por ejemplo mediante el mecanismo {{domxref("Window.open()")}}). Si este popup además contiene JavaScript, ese escript heredará el mismo origen que el script que lo ha creado.</p>
+</div>
+
+<div class="blockIndicator warning">
+<p><code>data:</code> URLs obtienen un nuevo, vacío, contexto de seguridad.</p>
+</div>
+
+<h3 id="Excepciones_en_Internet_Explorer" style="line-height: 30px;">Excepciones en Internet Explorer</h3>
+
+<p>Internet Explorer tiene dos excepciones mayores en lo que se refiere a la política same-origin</p>
+
+<ul>
+ <li>Zonas de Confianza: si ambos dominios pertenecen a una zona de alta confianza e.g, dominios corporativos, entonces las limitaciones del mismo origen no son aplicadas.</li>
+ <li>Puerto: IE no incluye puerto en los componentes de Same Origin, por lo tanto <span style="background-color: rgba(212, 221, 228, 0.14902); font-family: courier new,andale mono,monospace; font-size: 12px; line-height: normal;">http://company.com:81/index.html <span style="background-color: #ffffff; font-family: open sans,sans-serif; line-height: 21px;">y </span></span><span style="background-color: rgba(212, 221, 228, 0.14902); font-family: courier new,andale mono,monospace; font-size: 12px; line-height: normal;">http://company.com/index.html </span>se consideran del mismo origen y no se aplican restricciones.</li>
+</ul>
+
+<p>Estas excepciones no son estándar y no están soportadas en otro navegador pero son útiles cuando se desarrolla una app para Windows RT (o) basada en IE.</p>
+
+<h2 id="Cambiando_el_origen">Cambiando el origen</h2>
+
+<p>Una página puede cambiar su propio origen con algunas limitaciones. Un script puede asignar el valor de {{domxref("document.domain")}} al dominio actual o a un superdominio del dominio actual. Si se asigna a un superdominio del dominio actual, el dominio más corto es usado para las posteriores comprobaciones de origen. Por ejemplo, sea un script en <code>http://store.company.com/dir/other.html</code> que ejecuta lo siguiente:</p>
+
+<pre class="notranslate">document.domain = "company.com";
+</pre>
+
+<p>Tras su ejecución, la página puede pasar la comprobación de origen con <code>http://company.com/dir/page.html</code> (asumiendo que <code>http://company.com/dir/page.html</code> asigna su <code>document.domain</code> a "<code>company.com</code>" para indicar que desea hacerlo - ver {{domxref("document.domain")}} para más información). Sin embargo, <code>company.com</code> <strong>no</strong> podría asignar <code>document.domain</code> a <code>othercompany.com</code> ya que no es un superdominio de <code>company.com</code>.</p>
+
+<p>El número de puerto es guardado de forma separada por el navegador. Cualquier llamada al setter, incluyendo <code>document.domain = document.domain</code> causa que el número del puerto sea sobrescrito con <code>null</code>. Por lo tanto <strong>no se puede</strong> hacer que<code> company.com:8080</code> hable con  <code>company.com</code> solo asignando <code>document.domain = "company.com"</code> en el primero. Tiene que ser asignado en ambos para que los números de puerto sean <code>null</code>.</p>
+
+<div class="note">
+<p><strong>Nota:</strong> Cuando se use <code>document.domain</code> para permitir a un subdominio acceder a su padre de forma segura, necesitas asignar <code>document.domain</code> al mismo valor tanto en el padre como en el subdominio. Esto es necesario incluso si solo se asigna el dominio padre a su valor original. Un fallo al hacer esto puede resultar en errores de permisos.</p>
+</div>
+
+<h2 id="Acceso_de_red_de_origen_cruzado">Acceso de red de origen cruzado</h2>
+
+<p>La política de mismo origen controla las interacciones entre dos orígenes diferentes, como cuando se usa {{domxref("XMLHttpRequest")}} o un elemento {{htmlelement("img")}}. Estas interacciones habitualmente se ubican en tres categorías:</p>
+
+<ul>
+ <li>Las escrituras Cross-origin<em> </em>normalmente se permiten. Como ejemplo tenemos los enlaces, redirecciones y envíos de formulario. Algunas peticiones HTTP raramente usadas requieren <a href="/en-US/docs/HTTP/Access_control_CORS#Preflighted_requests" title="HTTP/Access_control_CORS#Preflighted_requests">preflight</a>.</li>
+ <li>La integración Cross-origin (<em>embedding) </em>normalmente se permite. Los ejemplos se listan debajo.</li>
+ <li>Las lecturas Cross-origin habitualmente no se permiten, pero el acceso de lectura es a menudo filtrado mediante integración. Por ejemplo, puedes leer el ancho y el alto de una imagen integrada, las acciones de un script integrado, o la <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=629094" title="https://grepular.com/Abusing_HTTP_Status_Codes_to_Expose_Private_Information">disponibilidad de un recurso integrado</a>.</li>
+</ul>
+
+<p>Aquí hay algunos ejemplos de recursos que pueden ser orígen cruzado incrustado:</p>
+
+<ul>
+ <li>JavaScript con <code>&lt;script src="..."&gt;&lt;/script&gt;</code>. Los mensajes de error para errores de sintaxis están solo disponibles para scripts de mismo origen.</li>
+ <li>CSS con <code>&lt;link rel="stylesheet" href="..."&gt;</code>. Debido a las <a href="http://scarybeastsecurity.blogspot.dk/2009/12/generic-cross-browser-cross-domain.html" title="http://scarybeastsecurity.blogspot.dk/2009/12/generic-cross-browser-cross-domain.html">reglas de sintaxis relajadas</a> de CSS, un CSS de origen cruzado requiere de una cabecera <code>Content-Type</code> correcta. Las restricciones varían según el navegador: <a href="http://msdn.microsoft.com/en-us/library/ie/gg622939%28v=vs.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ie/gg622939%28v=vs.85%29.aspx">IE</a>, <a href="http://www.mozilla.org/security/announce/2010/mfsa2010-46.html" title="http://www.mozilla.org/security/announce/2010/mfsa2010-46.html">Firefox</a>, <a href="http://code.google.com/p/chromium/issues/detail?id=9877" title="http://code.google.com/p/chromium/issues/detail?id=9877">Chrome</a>, <a href="http://support.apple.com/kb/HT4070" title="http://support.apple.com/kb/HT4070">Safari</a> (bajar hasta CVE-2010-0051) y <a href="http://www.opera.com/support/kb/view/943/" title="http://www.opera.com/support/kb/view/943/">Opera</a>.</li>
+ <li>Imágeness con {{htmlelement("img")}}. Los formatos de imagen soportados incluyen PNG, JPEG, GIF, BMP, SVG, ...</li>
+ <li>Archivos multimedia con {{htmlelement("video")}} y {{htmlelement("audio")}}.</li>
+ <li>Plug-ins con <a href="/en-US/docs/HTML/Element/object" title="HTML/Element/object"><code>&lt;object&gt;</code></a>, <a href="/en-US/docs/HTML/Element/embed" title="HTML/Element/embed"><code>&lt;embed&gt;</code></a> y <a href="/en-US/docs/HTML/Element/applet" title="HTML/Element/applet"><code>&lt;applet&gt;</code></a>.</li>
+ <li>Fuentes con <a href="/en-US/docs/CSS/@font-face" title="CSS/@font-face"><code>@font-face</code></a>. Algunos buscadores permiten fuentes de orígen cruzado, otros requieren fuentes de mismo orígen.</li>
+ <li>Cualquiera con <a href="/en-US/docs/HTML/Element/frame" title="HTML/Element/frame"><code>&lt;frame&gt;</code></a> and <a href="/en-US/docs/HTML/Element/iframe" title="HTML/Element/iframe"><code>&lt;iframe&gt;</code></a>. Un sitio puede usar la cabecera <code><a href="/en-US/docs/HTTP/X-Frame-Options" title="HTTP/X-Frame-Options">X-Frame-Options</a></code> para prevenir este tipo de interacción de orígen cruzado.</li>
+</ul>
+
+<h3 id="Cómo_permitir_el_acceso_de_origen_cruzado">Cómo permitir el acceso de origen cruzado</h3>
+
+<p>Usa <a href="/en-US/docs/HTTP/Access_control_CORS" title="HTTP/Access_control_CORS">CORS</a> para permitir el acceso de origen cruzado.</p>
+
+<h3 id="Cómo_bloquear_el_acceso_de_origen_cruzado">Cómo bloquear el acceso de origen cruzado</h3>
+
+<ul>
+ <li>Para prevenir escrituras de orígen cruzado, comprobar un token imposible de adivinar en la petición, conocido como token <a href="https://www.owasp.org/index.php/Cross-Site_Request_Forgery_%28CSRF%29" title="https://www.owasp.org/index.php/Cross-Site_Request_Forgery_%28CSRF%29">Cross-Site Request Forgery (CSRF)</a>. Debes prevenir lecturas de orígen cruzado de páginas que conozcan este token.</li>
+ <li>Para prevenir lecturas de origen cruzado de un recurso, asegurar que no es incrustable. Frecuentemente es necesario prevenir incrustaciones debido a que al incrustar un recurso siempre se filtra alguna información sobre él.</li>
+ <li>Para prevenir incrustaciones de origen cruzado, asegurar que tu recurso no puede ser interpretado como uno de los formatos incrustables de arriba. El navegador no respeta el <code>Content-Type</code> en muchos casos. Por ejemplo, si señalas una etiqueta <code>&lt;script&gt;</code> en un documento HTML, el navegador tratará de interpretar el HTML como JavaScript. Cuando tu recurso no es un punto de entrada a tu sitio, puedes usar también un token CSRF para prevenir el incrustamiento.</li>
+</ul>
+
+<h2 id="Acceso_script_API_de_Origen_Cruzado">Acceso script API de Origen Cruzado</h2>
+
+<p>Las APIs de JavaScript APIs tales como <a href="/en-US/docs/DOM/HTMLIFrameElement" title="DOM/HTMLIFrameElement"><code>iframe.contentWindow</code></a>, {{domxref("window.parent")}}, {{domxref("window.open")}} y {{domxref("window.opener")}} permiten a los documentos referenciarse directamente entre ellos. Cuando dos documentos no tienen el mismo origen, estas referencias proveen un acceso muy limitado a los objetos <a href="/en-US/docs/Web/API/Window"><code>Window</code></a> y <a href="/en-US/docs/Web/API/Location"><code>Location</code></a>, como se describe en las siguientes dos secciones.</p>
+
+<p>Para una mayor comunicación entre documentos de origenes diferentes, usar {{domxref("window.postMessage")}}.</p>
+
+<h3 id="Window">Window</h3>
+
+<p>Especificación:  <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-window">http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-window</a>.</p>
+
+<p>Los siguientes accesos de origen-cruzado a las propiedades de <code>Window</code> están permitidos:</p>
+
+<table class="fullwidth-table standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Métodos</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{domxref("window.blur")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.close")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.focus")}}</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.postMessage")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<table class="fullwidth-table standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Atributos</th>
+   <th scope="col"></th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{domxref("window.closed")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.frames")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.length")}}</td>
+   <td>Read only.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.location")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.opener")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.parent")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.self")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.top")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("window.window")}}</td>
+   <td>Solo lectura.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Algunos navegadores permiten el acceso a más propiedades de las que permite la especificación.</p>
+
+<h3 id="Location">Location</h3>
+
+<p>Especificación:  <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-location">http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-location</a>.</p>
+
+<p>Los siguientes accesos de origen cruzado a las propiedades de <code>Location</code> están permitidos:</p>
+
+<table class="fullwidth-table standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Métodos</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{domxref("location.replace")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<table class="fullwidth-table standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Atributos</th>
+   <th scope="col"></th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{domxref("URLUtils.href")}}</td>
+   <td>Solo escritura.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Algunos navegadores permiten el acceso a más propiedades de las que permite la especificación.</p>
+
+<h2 id="Acceso_de_almacenamiento_de_datos_de_origen_cruzado">Acceso de almacenamiento de datos de origen cruzado</h2>
+
+<p>El acceso a datos almacenados en el navegador tales como <a href="/en-US/docs/Web/Guide/API/DOM/Storage">localStorage</a> y <a href="/en-US/docs/IndexedDB">IndexedDB</a> son separados por origen. Cada origen obtiene su propio almacenamiento separado, y JavaScript en un origen no puede leer desde o escribir al almacenamiento perteneciente a otro origen.</p>
+
+<p>Las cookies usan una definición separada de orígenes. Una página puede asignar una cookie para su propio dominio o cualquier dominio padre, siempre que el dominio padre no sea un sufijo público. Firefox y Chrome usan la <a href="http://publicsuffix.org/">Lista de Sufijos Públicos</a> para determinar si un dominio es un sufijo público. Internet Explorer usa su propio método interno para determinar si un dominio es un sufijo públicio. El navegador hará disponible una cookie para el dominio dado incluyendo cualquier subdominio, no importa qué protocolo (HTTP/HTTPS) o puerto sea usado. Cuando asignas una cookie, puedes limitar su disponibilidad usando los flags Domain, Path, Secure y Http-Only. Cuando lees una cookie, no puedes ver desde dónde fue asignada. Incluso si sólo usas conexiones HTTPS, cualquier cookie que veas puede haber sido asignada usando una conexión insegura.</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li><a href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">Política </a><a href="/en-US/docs/Same-origin_policy_for_file:_URIs" title="Same-origin policy for file: URIs">Same-Origin para file: URIs</a></li>
+ <li><a href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">Política Same-Origin en W3C</a></li>
+</ul>
+
+<div class="originaldocinfo">
+<h2 id="Original_Document_Information" name="Original_Document_Information">Información de Documento Original</h2>
+
+<ul>
+ <li>Autor(es): Jesse Ruderman</li>
+</ul>
+</div>
+
+<p>{{QuickLinksWithSubpages("/en-US/docs/Web/Security")}}</p>
diff --git a/files/es/web/security/same-origin_politica/index.html b/files/es/web/security/same-origin_politica/index.html
deleted file mode 100644
index 18e2e759b1..0000000000
--- a/files/es/web/security/same-origin_politica/index.html
+++ /dev/null
@@ -1,269 +0,0 @@
----
-title: Política Same-origin
-slug: Web/Security/Same-origin_politica
-tags:
-  - CORS
-  - JavaScript
-  - Mismo-Origen
-  - Política Same-Origin
-  - Seguridad
-translation_of: Web/Security/Same-origin_policy
----
-<p>La política same-origin (mismo-origen) restringe cómo un documento o script cargado desde un origen puede interactuar con un recurso de otro origen. Es un mecanismo de seguridad crítico para aislar documentos potencialmente maliciosos.</p>
-
-<h2 id="Definición_de_origen">Definición de origen</h2>
-
-<p>Dos páginas tienen el <em>mismo origen</em> si el {{Glossary("protocol","protocolo")}}, {{Glossary("port","puerto")}} (si es especificado) y {{Glossary("host","anfitrión")}} son los mismos para ambas páginas. Verá esto a veces referido como la "tupla esquema/anfitrión/puerto" (donde una "tupla" es un conjunto de componentes que juntos forman un todo).</p>
-
-<p>La siguiente tabla muestra ejemplos de comparaciones de origenes para la URL <code>http://store.company.com/dir/page.html</code>:</p>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th>URL</th>
-   <th>Resultado</th>
-   <th>Razón</th>
-  </tr>
-  <tr>
-   <td><code>http://store.company.com/dir2/other.html</code></td>
-   <td>Mismo origen</td>
-   <td>Solo la ruta difiere</td>
-  </tr>
-  <tr>
-   <td><code>http://store.company.com/dir/inner/another.html</code></td>
-   <td>Mismo origen</td>
-   <td>Solo la ruta difiere</td>
-  </tr>
-  <tr>
-   <td><code>https://store.company.com/secure.html</code></td>
-   <td>Fallo</td>
-   <td>Diferente protocolo</td>
-  </tr>
-  <tr>
-   <td><code>http://store.company.com:81/dir/etc.html</code></td>
-   <td>Fallo</td>
-   <td>Diferente puerto</td>
-  </tr>
-  <tr>
-   <td><code>http://news.company.com/dir/other.html</code></td>
-   <td>Fallo</td>
-   <td>Diferente host</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Ver también <a href="/en-US/docs/Same-origin_policy_for_file:_URIs" title="Same-origin_policy_for_file:_URIs">definición de origen para <code>file:</code> URLs</a>, puesto que su comparación es más complicada.</p>
-
-<h3 id="Orígenes_heredados">Orígenes heredados</h3>
-
-<p>Los scripts ejecutados desde páginas con una URL <code>about:blank</code> o <code>javascript:</code> heredan el origen del documento que contiene esa URL, puesto que esos tipos de URLs no contienen información sobre un servidor de origen.</p>
-
-<div class="blockIndicator note">
-<p>Por ejemplo, <code>about:blank</code> a menudo se usa como URL de nuevas ventanas popup en las que el script padre escribe contenido (por ejemplo mediante el mecanismo {{domxref("Window.open()")}}). Si este popup además contiene JavaScript, ese escript heredará el mismo origen que el script que lo ha creado.</p>
-</div>
-
-<div class="blockIndicator warning">
-<p><code>data:</code> URLs obtienen un nuevo, vacío, contexto de seguridad.</p>
-</div>
-
-<h3 id="Excepciones_en_Internet_Explorer" style="line-height: 30px;">Excepciones en Internet Explorer</h3>
-
-<p>Internet Explorer tiene dos excepciones mayores en lo que se refiere a la política same-origin</p>
-
-<ul>
- <li>Zonas de Confianza: si ambos dominios pertenecen a una zona de alta confianza e.g, dominios corporativos, entonces las limitaciones del mismo origen no son aplicadas.</li>
- <li>Puerto: IE no incluye puerto en los componentes de Same Origin, por lo tanto <span style="background-color: rgba(212, 221, 228, 0.14902); font-family: courier new,andale mono,monospace; font-size: 12px; line-height: normal;">http://company.com:81/index.html <span style="background-color: #ffffff; font-family: open sans,sans-serif; line-height: 21px;">y </span></span><span style="background-color: rgba(212, 221, 228, 0.14902); font-family: courier new,andale mono,monospace; font-size: 12px; line-height: normal;">http://company.com/index.html </span>se consideran del mismo origen y no se aplican restricciones.</li>
-</ul>
-
-<p>Estas excepciones no son estándar y no están soportadas en otro navegador pero son útiles cuando se desarrolla una app para Windows RT (o) basada en IE.</p>
-
-<h2 id="Cambiando_el_origen">Cambiando el origen</h2>
-
-<p>Una página puede cambiar su propio origen con algunas limitaciones. Un script puede asignar el valor de {{domxref("document.domain")}} al dominio actual o a un superdominio del dominio actual. Si se asigna a un superdominio del dominio actual, el dominio más corto es usado para las posteriores comprobaciones de origen. Por ejemplo, sea un script en <code>http://store.company.com/dir/other.html</code> que ejecuta lo siguiente:</p>
-
-<pre class="notranslate">document.domain = "company.com";
-</pre>
-
-<p>Tras su ejecución, la página puede pasar la comprobación de origen con <code>http://company.com/dir/page.html</code> (asumiendo que <code>http://company.com/dir/page.html</code> asigna su <code>document.domain</code> a "<code>company.com</code>" para indicar que desea hacerlo - ver {{domxref("document.domain")}} para más información). Sin embargo, <code>company.com</code> <strong>no</strong> podría asignar <code>document.domain</code> a <code>othercompany.com</code> ya que no es un superdominio de <code>company.com</code>.</p>
-
-<p>El número de puerto es guardado de forma separada por el navegador. Cualquier llamada al setter, incluyendo <code>document.domain = document.domain</code> causa que el número del puerto sea sobrescrito con <code>null</code>. Por lo tanto <strong>no se puede</strong> hacer que<code> company.com:8080</code> hable con  <code>company.com</code> solo asignando <code>document.domain = "company.com"</code> en el primero. Tiene que ser asignado en ambos para que los números de puerto sean <code>null</code>.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Cuando se use <code>document.domain</code> para permitir a un subdominio acceder a su padre de forma segura, necesitas asignar <code>document.domain</code> al mismo valor tanto en el padre como en el subdominio. Esto es necesario incluso si solo se asigna el dominio padre a su valor original. Un fallo al hacer esto puede resultar en errores de permisos.</p>
-</div>
-
-<h2 id="Acceso_de_red_de_origen_cruzado">Acceso de red de origen cruzado</h2>
-
-<p>La política de mismo origen controla las interacciones entre dos orígenes diferentes, como cuando se usa {{domxref("XMLHttpRequest")}} o un elemento {{htmlelement("img")}}. Estas interacciones habitualmente se ubican en tres categorías:</p>
-
-<ul>
- <li>Las escrituras Cross-origin<em> </em>normalmente se permiten. Como ejemplo tenemos los enlaces, redirecciones y envíos de formulario. Algunas peticiones HTTP raramente usadas requieren <a href="/en-US/docs/HTTP/Access_control_CORS#Preflighted_requests" title="HTTP/Access_control_CORS#Preflighted_requests">preflight</a>.</li>
- <li>La integración Cross-origin (<em>embedding) </em>normalmente se permite. Los ejemplos se listan debajo.</li>
- <li>Las lecturas Cross-origin habitualmente no se permiten, pero el acceso de lectura es a menudo filtrado mediante integración. Por ejemplo, puedes leer el ancho y el alto de una imagen integrada, las acciones de un script integrado, o la <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=629094" title="https://grepular.com/Abusing_HTTP_Status_Codes_to_Expose_Private_Information">disponibilidad de un recurso integrado</a>.</li>
-</ul>
-
-<p>Aquí hay algunos ejemplos de recursos que pueden ser orígen cruzado incrustado:</p>
-
-<ul>
- <li>JavaScript con <code>&lt;script src="..."&gt;&lt;/script&gt;</code>. Los mensajes de error para errores de sintaxis están solo disponibles para scripts de mismo origen.</li>
- <li>CSS con <code>&lt;link rel="stylesheet" href="..."&gt;</code>. Debido a las <a href="http://scarybeastsecurity.blogspot.dk/2009/12/generic-cross-browser-cross-domain.html" title="http://scarybeastsecurity.blogspot.dk/2009/12/generic-cross-browser-cross-domain.html">reglas de sintaxis relajadas</a> de CSS, un CSS de origen cruzado requiere de una cabecera <code>Content-Type</code> correcta. Las restricciones varían según el navegador: <a href="http://msdn.microsoft.com/en-us/library/ie/gg622939%28v=vs.85%29.aspx" title="http://msdn.microsoft.com/en-us/library/ie/gg622939%28v=vs.85%29.aspx">IE</a>, <a href="http://www.mozilla.org/security/announce/2010/mfsa2010-46.html" title="http://www.mozilla.org/security/announce/2010/mfsa2010-46.html">Firefox</a>, <a href="http://code.google.com/p/chromium/issues/detail?id=9877" title="http://code.google.com/p/chromium/issues/detail?id=9877">Chrome</a>, <a href="http://support.apple.com/kb/HT4070" title="http://support.apple.com/kb/HT4070">Safari</a> (bajar hasta CVE-2010-0051) y <a href="http://www.opera.com/support/kb/view/943/" title="http://www.opera.com/support/kb/view/943/">Opera</a>.</li>
- <li>Imágeness con {{htmlelement("img")}}. Los formatos de imagen soportados incluyen PNG, JPEG, GIF, BMP, SVG, ...</li>
- <li>Archivos multimedia con {{htmlelement("video")}} y {{htmlelement("audio")}}.</li>
- <li>Plug-ins con <a href="/en-US/docs/HTML/Element/object" title="HTML/Element/object"><code>&lt;object&gt;</code></a>, <a href="/en-US/docs/HTML/Element/embed" title="HTML/Element/embed"><code>&lt;embed&gt;</code></a> y <a href="/en-US/docs/HTML/Element/applet" title="HTML/Element/applet"><code>&lt;applet&gt;</code></a>.</li>
- <li>Fuentes con <a href="/en-US/docs/CSS/@font-face" title="CSS/@font-face"><code>@font-face</code></a>. Algunos buscadores permiten fuentes de orígen cruzado, otros requieren fuentes de mismo orígen.</li>
- <li>Cualquiera con <a href="/en-US/docs/HTML/Element/frame" title="HTML/Element/frame"><code>&lt;frame&gt;</code></a> and <a href="/en-US/docs/HTML/Element/iframe" title="HTML/Element/iframe"><code>&lt;iframe&gt;</code></a>. Un sitio puede usar la cabecera <code><a href="/en-US/docs/HTTP/X-Frame-Options" title="HTTP/X-Frame-Options">X-Frame-Options</a></code> para prevenir este tipo de interacción de orígen cruzado.</li>
-</ul>
-
-<h3 id="Cómo_permitir_el_acceso_de_origen_cruzado">Cómo permitir el acceso de origen cruzado</h3>
-
-<p>Usa <a href="/en-US/docs/HTTP/Access_control_CORS" title="HTTP/Access_control_CORS">CORS</a> para permitir el acceso de origen cruzado.</p>
-
-<h3 id="Cómo_bloquear_el_acceso_de_origen_cruzado">Cómo bloquear el acceso de origen cruzado</h3>
-
-<ul>
- <li>Para prevenir escrituras de orígen cruzado, comprobar un token imposible de adivinar en la petición, conocido como token <a href="https://www.owasp.org/index.php/Cross-Site_Request_Forgery_%28CSRF%29" title="https://www.owasp.org/index.php/Cross-Site_Request_Forgery_%28CSRF%29">Cross-Site Request Forgery (CSRF)</a>. Debes prevenir lecturas de orígen cruzado de páginas que conozcan este token.</li>
- <li>Para prevenir lecturas de origen cruzado de un recurso, asegurar que no es incrustable. Frecuentemente es necesario prevenir incrustaciones debido a que al incrustar un recurso siempre se filtra alguna información sobre él.</li>
- <li>Para prevenir incrustaciones de origen cruzado, asegurar que tu recurso no puede ser interpretado como uno de los formatos incrustables de arriba. El navegador no respeta el <code>Content-Type</code> en muchos casos. Por ejemplo, si señalas una etiqueta <code>&lt;script&gt;</code> en un documento HTML, el navegador tratará de interpretar el HTML como JavaScript. Cuando tu recurso no es un punto de entrada a tu sitio, puedes usar también un token CSRF para prevenir el incrustamiento.</li>
-</ul>
-
-<h2 id="Acceso_script_API_de_Origen_Cruzado">Acceso script API de Origen Cruzado</h2>
-
-<p>Las APIs de JavaScript APIs tales como <a href="/en-US/docs/DOM/HTMLIFrameElement" title="DOM/HTMLIFrameElement"><code>iframe.contentWindow</code></a>, {{domxref("window.parent")}}, {{domxref("window.open")}} y {{domxref("window.opener")}} permiten a los documentos referenciarse directamente entre ellos. Cuando dos documentos no tienen el mismo origen, estas referencias proveen un acceso muy limitado a los objetos <a href="/en-US/docs/Web/API/Window"><code>Window</code></a> y <a href="/en-US/docs/Web/API/Location"><code>Location</code></a>, como se describe en las siguientes dos secciones.</p>
-
-<p>Para una mayor comunicación entre documentos de origenes diferentes, usar {{domxref("window.postMessage")}}.</p>
-
-<h3 id="Window">Window</h3>
-
-<p>Especificación:  <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-window">http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-window</a>.</p>
-
-<p>Los siguientes accesos de origen-cruzado a las propiedades de <code>Window</code> están permitidos:</p>
-
-<table class="fullwidth-table standard-table">
- <thead>
-  <tr>
-   <th scope="col">Métodos</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{domxref("window.blur")}}</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.close")}}</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.focus")}}</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.postMessage")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<table class="fullwidth-table standard-table">
- <thead>
-  <tr>
-   <th scope="col">Atributos</th>
-   <th scope="col"></th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{domxref("window.closed")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.frames")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.length")}}</td>
-   <td>Read only.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.location")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.opener")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.parent")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.self")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.top")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
-  <tr>
-   <td>{{domxref("window.window")}}</td>
-   <td>Solo lectura.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Algunos navegadores permiten el acceso a más propiedades de las que permite la especificación.</p>
-
-<h3 id="Location">Location</h3>
-
-<p>Especificación:  <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-location">http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#security-location</a>.</p>
-
-<p>Los siguientes accesos de origen cruzado a las propiedades de <code>Location</code> están permitidos:</p>
-
-<table class="fullwidth-table standard-table">
- <thead>
-  <tr>
-   <th scope="col">Métodos</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{domxref("location.replace")}}</td>
-  </tr>
- </tbody>
-</table>
-
-<table class="fullwidth-table standard-table">
- <thead>
-  <tr>
-   <th scope="col">Atributos</th>
-   <th scope="col"></th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{domxref("URLUtils.href")}}</td>
-   <td>Solo escritura.</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Algunos navegadores permiten el acceso a más propiedades de las que permite la especificación.</p>
-
-<h2 id="Acceso_de_almacenamiento_de_datos_de_origen_cruzado">Acceso de almacenamiento de datos de origen cruzado</h2>
-
-<p>El acceso a datos almacenados en el navegador tales como <a href="/en-US/docs/Web/Guide/API/DOM/Storage">localStorage</a> y <a href="/en-US/docs/IndexedDB">IndexedDB</a> son separados por origen. Cada origen obtiene su propio almacenamiento separado, y JavaScript en un origen no puede leer desde o escribir al almacenamiento perteneciente a otro origen.</p>
-
-<p>Las cookies usan una definición separada de orígenes. Una página puede asignar una cookie para su propio dominio o cualquier dominio padre, siempre que el dominio padre no sea un sufijo público. Firefox y Chrome usan la <a href="http://publicsuffix.org/">Lista de Sufijos Públicos</a> para determinar si un dominio es un sufijo público. Internet Explorer usa su propio método interno para determinar si un dominio es un sufijo públicio. El navegador hará disponible una cookie para el dominio dado incluyendo cualquier subdominio, no importa qué protocolo (HTTP/HTTPS) o puerto sea usado. Cuando asignas una cookie, puedes limitar su disponibilidad usando los flags Domain, Path, Secure y Http-Only. Cuando lees una cookie, no puedes ver desde dónde fue asignada. Incluso si sólo usas conexiones HTTPS, cualquier cookie que veas puede haber sido asignada usando una conexión insegura.</p>
-
-<h2 id="Ver_también">Ver también</h2>
-
-<ul>
- <li><a href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">Política </a><a href="/en-US/docs/Same-origin_policy_for_file:_URIs" title="Same-origin policy for file: URIs">Same-Origin para file: URIs</a></li>
- <li><a href="http://www.w3.org/Security/wiki/Same_Origin_Policy" title="http://www.w3.org/Security/wiki/Same_Origin_Policy">Política Same-Origin en W3C</a></li>
-</ul>
-
-<div class="originaldocinfo">
-<h2 id="Original_Document_Information" name="Original_Document_Information">Información de Documento Original</h2>
-
-<ul>
- <li>Autor(es): Jesse Ruderman</li>
-</ul>
-</div>
-
-<p>{{QuickLinksWithSubpages("/en-US/docs/Web/Security")}}</p>
diff --git a/files/es/web/security/securing_your_site/desactivar_autocompletado_formulario/index.html b/files/es/web/security/securing_your_site/desactivar_autocompletado_formulario/index.html
deleted file mode 100644
index 959d468392..0000000000
--- a/files/es/web/security/securing_your_site/desactivar_autocompletado_formulario/index.html
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: ¿Cómo desactivar el autocompletado del formulario?
-slug: Web/Security/Securing_your_site/desactivar_autocompletado_formulario
-tags:
-  - Desarrollo web
-  - Seguridad
-  - formulários
-translation_of: Web/Security/Securing_your_site/Turning_off_form_autocompletion
----
-<p><span class="seoSummary">Este artículo explica como un sitio web puede inhabilitar el autocompletado para los campos del formulario.</span></p>
-
-<p>Por defecto, los navegadores recuerdan información que el usuario envía a través de los campos <code><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/input">input</a></code> en los sitios web. Esto habilita al navegador para ofrecer el autocompletado (P. Ej. Sugiere posibles completaciones para los campos que el usuario ha iniciado escribiendo) o el llenado automático (P. Ej. rellenar previamente ciertos campos al cargar).</p>
-
-<p>Estas caracteristicas pueden ser un problema de privacidad para los usuarios, ya que mientras los navegadores pueden permitir a los usuarios a inhabilitarlas, estos están usualmente habilitados por defecto. Como sea, alguna información enviada en los formularios no es tampoco útil en el futuro (P. Ej. a one-time pin) o contiene cierta información susceptible (P. Ej. un identificador único del gobierno o un código de seguridad de la tarjeta de crédito). Un sitio web podría preferir que el navegador no recuerde los valores de tales campos, incluso si la caracteristica del autocompletado del navegador este habilitada.</p>
-
-<h2 id="Desactivar_autocompletado">Desactivar autocompletado</h2>
-
-<p>Para desactivar el autocompletado en los formularios, un sitio web puede establecer el atributo {{htmlattrxref("autocomplete", "input")}} a "off":</p>
-
-<pre class="brush: html">autocomplete="off"</pre>
-
-<p>Puede hacer esto para un formulario entero o para elementos específicos de tipo "input" dentro del formulario:</p>
-
-<pre class="brush: html">&lt;form method="post" action="/form" autocomplete="off"&gt;
-[…]
-&lt;/form&gt;</pre>
-
-<pre class="brush: html">&lt;form method="post" action="/form"&gt;
-  […]
-  &lt;div&gt;
-    &lt;label for="cc"&gt;Credit card:&lt;/label&gt;
-    &lt;input type="text" id="cc" name="cc" autocomplete="off"&gt;
-  &lt;/div&gt;
-&lt;/form&gt;</pre>
-
-<p>Estableciendo <code>autocomplete="off"</code> en los campos tiene dos efectos:</p>
-
-<ul>
- <li>Impide que el navegador guarde los datos de los campos para un posterior autocompletado en formularios similares mediante heurísticas que varían según el navegador.</li>
- <li>Evita que el navegador almacene en caché los datos del formulario en el historial de la sesión. Cuando los datos del formulario están almacenados en la caché del historial de la sesión, la información completada por el usuario será visible en caso de que el usuario haya enviado el formulario y haya hecho clic en el botón Atrás para volver a la página original del formulario.</li>
-</ul>
-
-<p>En algunos casos, el navegador continuará sugiriendo valores de autocompletado incluso si el atributo autocompletar está desactivado. Este comportamiento inesperado puede resultar bastante confuso para los desarrolladores. El truco para realmente no aplicar el autocompletado es asignar un valor no válido al atributo, por ejemplo:</p>
-
-<pre class="brush: html">autocomplete="nope"
-</pre>
-
-<p>Dado que este valor no es válido para el atributo autocompletar, el navegador no tiene forma de reconocerlo y deja de intentar autocompletarlo.</p>
-
-<h2 id="El_atributo_autocompletar_y_los_campos_de_inicio_de_sesión">El atributo autocompletar y los campos de inicio de sesión</h2>
-
-<p>Los navegadores modernos implementan un gestor de contraseñas integrado: cuando el usuario ingresa un nombre de usuario y contraseña para un sitio, el navegador le ofrece recordarlos. Cuando el usuario visita el sitio nuevamente, el navegador completa automáticamente los campos de inicio de sesión con los valores almacenados.</p>
-
-<p>Adicionalmente, el navegador permite al usuario elegir una contraseña maestra que utilizará para cifrar los datos de inicio de sesión almacenados.</p>
-
-<p>Incluso sin una contraseña maestra, el gestor de contraseñas integrado en el navegador generalmente se considera una ganancia para la seguridad. Como los usuarios no tienen que recordar las contraseñas que el navegador almacena para ellos, son capaces de escoger contraseñas más seguras de lo que lo harían.</p>
-
-<p>Por esta razón, muchos navegadores modernos no admiten autocompletar = "off" para los campos de inicio de sesión:</p>
-
-<ul>
- <li>Si un sitio establece autocomplete="off" para un formulario, y este incluye campos de nombre de usuario o contraseña, entonces el navegador seguirá ofreciendo guardar los valores de estos, y si el usuario está de acuerdo, el navegador autocompletará automáticamente estos campos la próxima vez que el usuario visite la página.</li>
- <li>Si un sitio configura autocomplete="off" para los campos de nombre de usuario y contraseña, entonces el navegador seguirá ofreciendo recordar este inicio de sesión, y si el usuario está de acuerdo, el navegador autocompletará automáticamente esos campos la próxima vez que el usuario visite la página.</li>
-</ul>
-
-<p>Este es el comportamiento en Firefox (desde la versión 38), Google Chrome (desde la 34) e Internet Explorer (desde la versión 11).</p>
-
-<p>Si un autor desea evitar el autocompletado de los campos de contraseña en las páginas de administración de usuarios donde un usuario puede especificar una nueva contraseña para alguien más que para si mismo, se debe especificar autocomplete="new-password", aunque el soporte para esto no se ha implementado todavía en todos los navegadores.</p>
-
-<h2 id="Uso_del_Plugin_de_jQuery_disableAutoFill">Uso del Plugin de jQuery disableAutoFill</h2>
-
-<p>Este complemento aleatorizará por defecto el nombre del atributo. Se restaurará al nombre del campo original al enviar el formulario. Esto es para evitar el autocompletado automático en todos los navegadores (incluye extensiones de auto-completado de terceros),no solo para Google Chrome. </p>
-
-<p>URL: <a href="https://github.com/terrylinooo/jquery.disableAutoFill">https://terrylinooo.github.io/jquery.disableAutoFill/</a></p>
-
-<p>{{QuickLinksWithSubpages("/en-US/docs/Web/Security")}}</p>
-
-<p> </p>
diff --git a/files/es/web/security/securing_your_site/turning_off_form_autocompletion/index.html b/files/es/web/security/securing_your_site/turning_off_form_autocompletion/index.html
new file mode 100644
index 0000000000..f972ddb53a
--- /dev/null
+++ b/files/es/web/security/securing_your_site/turning_off_form_autocompletion/index.html
@@ -0,0 +1,78 @@
+---
+title: ¿Cómo desactivar el autocompletado del formulario?
+slug: Web/Security/Securing_your_site/Turning_off_form_autocompletion
+tags:
+  - Desarrollo web
+  - Seguridad
+  - formulários
+translation_of: Web/Security/Securing_your_site/Turning_off_form_autocompletion
+original_slug: Web/Security/Securing_your_site/desactivar_autocompletado_formulario
+---
+<p><span class="seoSummary">Este artículo explica como un sitio web puede inhabilitar el autocompletado para los campos del formulario.</span></p>
+
+<p>Por defecto, los navegadores recuerdan información que el usuario envía a través de los campos <code><a href="https://developer.mozilla.org/es/docs/Web/HTML/Elemento/input">input</a></code> en los sitios web. Esto habilita al navegador para ofrecer el autocompletado (P. Ej. Sugiere posibles completaciones para los campos que el usuario ha iniciado escribiendo) o el llenado automático (P. Ej. rellenar previamente ciertos campos al cargar).</p>
+
+<p>Estas caracteristicas pueden ser un problema de privacidad para los usuarios, ya que mientras los navegadores pueden permitir a los usuarios a inhabilitarlas, estos están usualmente habilitados por defecto. Como sea, alguna información enviada en los formularios no es tampoco útil en el futuro (P. Ej. a one-time pin) o contiene cierta información susceptible (P. Ej. un identificador único del gobierno o un código de seguridad de la tarjeta de crédito). Un sitio web podría preferir que el navegador no recuerde los valores de tales campos, incluso si la caracteristica del autocompletado del navegador este habilitada.</p>
+
+<h2 id="Desactivar_autocompletado">Desactivar autocompletado</h2>
+
+<p>Para desactivar el autocompletado en los formularios, un sitio web puede establecer el atributo {{htmlattrxref("autocomplete", "input")}} a "off":</p>
+
+<pre class="brush: html">autocomplete="off"</pre>
+
+<p>Puede hacer esto para un formulario entero o para elementos específicos de tipo "input" dentro del formulario:</p>
+
+<pre class="brush: html">&lt;form method="post" action="/form" autocomplete="off"&gt;
+[…]
+&lt;/form&gt;</pre>
+
+<pre class="brush: html">&lt;form method="post" action="/form"&gt;
+  […]
+  &lt;div&gt;
+    &lt;label for="cc"&gt;Credit card:&lt;/label&gt;
+    &lt;input type="text" id="cc" name="cc" autocomplete="off"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;</pre>
+
+<p>Estableciendo <code>autocomplete="off"</code> en los campos tiene dos efectos:</p>
+
+<ul>
+ <li>Impide que el navegador guarde los datos de los campos para un posterior autocompletado en formularios similares mediante heurísticas que varían según el navegador.</li>
+ <li>Evita que el navegador almacene en caché los datos del formulario en el historial de la sesión. Cuando los datos del formulario están almacenados en la caché del historial de la sesión, la información completada por el usuario será visible en caso de que el usuario haya enviado el formulario y haya hecho clic en el botón Atrás para volver a la página original del formulario.</li>
+</ul>
+
+<p>En algunos casos, el navegador continuará sugiriendo valores de autocompletado incluso si el atributo autocompletar está desactivado. Este comportamiento inesperado puede resultar bastante confuso para los desarrolladores. El truco para realmente no aplicar el autocompletado es asignar un valor no válido al atributo, por ejemplo:</p>
+
+<pre class="brush: html">autocomplete="nope"
+</pre>
+
+<p>Dado que este valor no es válido para el atributo autocompletar, el navegador no tiene forma de reconocerlo y deja de intentar autocompletarlo.</p>
+
+<h2 id="El_atributo_autocompletar_y_los_campos_de_inicio_de_sesión">El atributo autocompletar y los campos de inicio de sesión</h2>
+
+<p>Los navegadores modernos implementan un gestor de contraseñas integrado: cuando el usuario ingresa un nombre de usuario y contraseña para un sitio, el navegador le ofrece recordarlos. Cuando el usuario visita el sitio nuevamente, el navegador completa automáticamente los campos de inicio de sesión con los valores almacenados.</p>
+
+<p>Adicionalmente, el navegador permite al usuario elegir una contraseña maestra que utilizará para cifrar los datos de inicio de sesión almacenados.</p>
+
+<p>Incluso sin una contraseña maestra, el gestor de contraseñas integrado en el navegador generalmente se considera una ganancia para la seguridad. Como los usuarios no tienen que recordar las contraseñas que el navegador almacena para ellos, son capaces de escoger contraseñas más seguras de lo que lo harían.</p>
+
+<p>Por esta razón, muchos navegadores modernos no admiten autocompletar = "off" para los campos de inicio de sesión:</p>
+
+<ul>
+ <li>Si un sitio establece autocomplete="off" para un formulario, y este incluye campos de nombre de usuario o contraseña, entonces el navegador seguirá ofreciendo guardar los valores de estos, y si el usuario está de acuerdo, el navegador autocompletará automáticamente estos campos la próxima vez que el usuario visite la página.</li>
+ <li>Si un sitio configura autocomplete="off" para los campos de nombre de usuario y contraseña, entonces el navegador seguirá ofreciendo recordar este inicio de sesión, y si el usuario está de acuerdo, el navegador autocompletará automáticamente esos campos la próxima vez que el usuario visite la página.</li>
+</ul>
+
+<p>Este es el comportamiento en Firefox (desde la versión 38), Google Chrome (desde la 34) e Internet Explorer (desde la versión 11).</p>
+
+<p>Si un autor desea evitar el autocompletado de los campos de contraseña en las páginas de administración de usuarios donde un usuario puede especificar una nueva contraseña para alguien más que para si mismo, se debe especificar autocomplete="new-password", aunque el soporte para esto no se ha implementado todavía en todos los navegadores.</p>
+
+<h2 id="Uso_del_Plugin_de_jQuery_disableAutoFill">Uso del Plugin de jQuery disableAutoFill</h2>
+
+<p>Este complemento aleatorizará por defecto el nombre del atributo. Se restaurará al nombre del campo original al enviar el formulario. Esto es para evitar el autocompletado automático en todos los navegadores (incluye extensiones de auto-completado de terceros),no solo para Google Chrome. </p>
+
+<p>URL: <a href="https://github.com/terrylinooo/jquery.disableAutoFill">https://terrylinooo.github.io/jquery.disableAutoFill/</a></p>
+
+<p>{{QuickLinksWithSubpages("/en-US/docs/Web/Security")}}</p>
+
+<p> </p>
diff --git a/files/es/web/svg/applying_svg_effects_to_html_content/index.html b/files/es/web/svg/applying_svg_effects_to_html_content/index.html
new file mode 100644
index 0000000000..173976bc8b
--- /dev/null
+++ b/files/es/web/svg/applying_svg_effects_to_html_content/index.html
@@ -0,0 +1,103 @@
+---
+title: Aplicación de efectos de SVG para el contenido HTML
+slug: Web/SVG/Applying_SVG_effects_to_HTML_content
+tags:
+  - CSS
+  - Firefox 3.5
+  - Firefox 4.0
+  - HTML
+  - HTML 5
+  - SVG
+  - XHTML
+original_slug: Applying_SVG_effects_to_HTML_content
+---
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Aplicación de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efectos de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML.</span></span></p>
+<p>{{ gecko_minversion_header("1.9.1") }}</p>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Firefox</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">3.5</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">introduce</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">soporte para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">usar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">como un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">componente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efectos de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
+<br>
+<span class="hps" title="Haz clic para obtener otras posibles traducciones">Puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">especificar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los estilos</span><span title="Haz clic para obtener otras posibles traducciones">, ya sea dentro</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mismo documento</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">o dentro de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">hoja de estilos externa</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<div class="note"><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Nota</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Las referencias</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en archivos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">externos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">deben</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ser</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de el mismo origen</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de origen</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></div>
+<h2 id="Uso_integrado_SVG"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Uso</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">integrado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span></span></h2>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Para aplicar un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efecto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">usando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">primero tiene</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">crear el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que hace referencia al</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<pre class="brush: html">&lt;style&gt;.stylename { mask: url(#localstyle); }&lt;/style&gt;
+</pre>
+<p> <span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">En el ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">anterior</span><span title="Haz clic para obtener otras posibles traducciones">, el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">nuevo estilo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">por "</span><span title="Haz clic para obtener otras posibles traducciones">stylename</span><span title="Haz clic para obtener otras posibles traducciones">,</span><span title="Haz clic para obtener otras posibles traducciones">"</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">es</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que hace referencia</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a el identificador</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">localstyle</span><span title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Una vez que se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estableció</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la máscara</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplica</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">todos los elementos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
+<br>
+<span class="hps" title="Haz clic para obtener otras posibles traducciones">Esto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">suena</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">más</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">complicado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">lo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que realmente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">es</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">echar un vistazo a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los ejemplos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tener una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">buena idea de cómo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">funciona esto</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
+<br>
+<span class="hps" title="Haz clic para obtener otras posibles traducciones">Hay</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tres</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos que se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">pueden aplicar</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">usar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la máscara</span><span title="Haz clic para obtener otras posibles traducciones">, el recorrido de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">clip</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">o un filtro</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<p> </p>
+<h3 id="Ejemplo_Enmascaramiento_(Máscara)"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Enmascaramiento (M</span></span><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">áscara)</span></span></h3>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Por</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">establecer un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">proporciona</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de degradado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">código</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">similar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">lo siguiente en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">su</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
+<p><strong><span style="color: rgb(255, 0, 0);">NOTA:</span> </strong><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">El espaciamiento de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">nombre no</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">es válida</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML 5</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">dejar fuera</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de la</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">svg</span><span title="Haz clic para obtener otras posibles traducciones">:</span><span title="Haz clic para obtener otras posibles traducciones">"</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">las etiquetas</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los documentos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en formato HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<pre class="brush: xml">  &lt;style&gt;.target { mask: url(#m1); }&lt;/style&gt;
+  &lt;svg:svg height="0"&gt;
+    &lt;svg:mask id="m1" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox"&gt;
+      &lt;svg:linearGradient id="g" gradientUnits="objectBoundingBox" x2="0" y2="1"&gt;
+        &lt;svg:stop stop-color="white" offset="0"/&gt;
+        &lt;svg:stop stop-color="white" stop-opacity="0" offset="1"/&gt;
+      &lt;/svg:linearGradient&gt;
+      &lt;svg:circle cx="0.25" cy="0.25" r="0.25" id="circle" fill="white"/&gt;
+      &lt;svg:rect x="0.5" y="0.2" width="0.5" height="0.8" fill="url(#g)"/&gt;
+    &lt;/svg:mask&gt;
+  &lt;/svg:svg&gt;
+</pre>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Tenga en cuenta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en la línea</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">1</span><span title="Haz clic para obtener otras posibles traducciones">, la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se especifica</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mediante</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una dirección URL para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ID</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">#</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">M1</span><span title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que es</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el identificador</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se especifican a continuación</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Todo lo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">demás</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se especifican otros detalles</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">sobre</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">misma</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara de degradado</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">En realidad,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de aplicar el efecto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">XHTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">o</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se hace</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">simplemente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">asignar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de destino</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">definido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">anteriormente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el elemento</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">así</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
+<pre class="brush: xml">&lt;iframe class="target" src="http://mozilla.org"/&gt;</pre>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">En este ejemplo se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">incrusta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">iframe</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que contiene</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">sitio</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">web de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Mozilla.org</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">representa</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">máscara</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que se le aplica</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<p><a class="internal" href="/@api/deki/files/3213/=maskdemo.xhtml" title="/@api/deki/files/3213/=maskdemo.xhtml">View this example live</a>.</p><h3 id="Ejemplo_Recorte"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Recorte</span></span></h3>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">muestra cómo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para recortar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Cuando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">nos fijamos en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la demostración</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en vivo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cuenta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">incluso en las zonas</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">calientes</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los enlaces</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">recortan</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<pre class="brush: xml">  &lt;style&gt;.target { clip-path: url(#c1); }&lt;/style&gt;
+  &lt;svg:svg height="0"&gt;
+    &lt;svg:clipPath id="c1" clipPathUnits="objectBoundingBox"&gt;
+      &lt;svg:circle cx="0.25" cy="0.25" r="0.25" id="circle"/&gt;
+      &lt;svg:rect x="0.5" y="0.2" width="0.5" height="0.8"/&gt;
+    &lt;/svg:clipPath&gt;
+  &lt;/svg:svg&gt;
+</pre>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Esto establece</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">área de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">recorte</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">compuesto por</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">círculo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">rectángulo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y le asigna</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ID</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">#</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">c1</span> <span class="hps atn" title="Haz clic para obtener otras posibles traducciones">"</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Esto</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">entonces se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">hace referencia</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Una vez que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de destino</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">establece</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de esta manera</span><span title="Haz clic para obtener otras posibles traducciones">, la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ruta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">asignar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">a cualquier</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">elemento</span><span title="Haz clic para obtener otras posibles traducciones">.</span></span></p>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Tenga en cuenta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">también</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">realizar cambios en el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en tiempo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">real</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ver</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambios</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">afectan inmediatamente a</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la prestación</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Por</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambiar el tamaño del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">círculo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">camino</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">establecido:</span></span></p>
+<pre class="brush: xml">    var circle = document.getElementById("circle");
+    circle.r.baseVal.value = 0.40 - circle.r.baseVal.value;
+</pre>
+<p><a class="internal" href="/@api/deki/files/3214/=clipdemo.xhtml" title="/@api/deki/files/3214/=clipdemo.xhtml">View this example live</a>.  <span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">El ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">incluye</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">botón</span>, <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">hacer clic</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambiar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ruta de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ver que el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cambio surta efecto.</span></span></p><h3 id="Ejemplo_Filtrar"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">:</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Filtrar</span></span></h3>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">muestra cómo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtro</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el contenido</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Establece</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">varios filtros</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que se aplican</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">estilos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cada uno</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tres</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">elementos</span><span title="Haz clic para obtener otras posibles traducciones">, tanto en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los Estados</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">suspender</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">normal y</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el ratón</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
+<br>
+<span class="hps" title="Haz clic para obtener otras posibles traducciones">Cualquier</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtro se puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de esta manera</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Por ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">efecto de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">desenfoque gaussiano</span><span title="Haz clic para obtener otras posibles traducciones">, puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizar</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
+<pre class="brush: xml">&lt;svg:filter id="f1"&gt;
+  &lt;svg:feGaussianBlur stdDeviation="3"/&gt;
+&lt;/svg:filter&gt;
+</pre>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">También puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplicar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">una</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">matriz de color</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de esta manera:</span></span></p>
+<pre class="brush: xml">    &lt;svg:filter id="f2"&gt;
+      &lt;svg:feColorMatrix values="0.3333 0.3333 0.3333 0 0
+                                 0.3333 0.3333 0.3333 0 0
+                                 0.3333 0.3333 0.3333 0 0
+                                 0      0      0      1 0"/&gt;
+
+    &lt;/svg:filter&gt;
+</pre>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Estos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">son</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">sólo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">dos de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">los cinco</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtros de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">muestra en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">este</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">.</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">Asegúrese</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">echar un vistazo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">al</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">código</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">completo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">si</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">le gustaría</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ver</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">más</span><span title="Haz clic para obtener otras posibles traducciones">.</span><br>
+<br>
+<span class="hps" title="Haz clic para obtener otras posibles traducciones">Los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">cinco</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">filtros se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplican</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mediante el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">siguiente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">código CSS:</span></span></p>
+<pre class="brush: xml">  &lt;style&gt;
+    p.target { filter:url(#f3); }
+    p.target:hover { filter:url(#f5); }
+    b.target { filter:url(#f1); }
+    b.target:hover { filter:url(#f4); }
+    iframe.target { filter:url(#f2); }
+    iframe.target:hover { filter:url(#f3); }
+  &lt;/style&gt;
+</pre>
+<p><a class="internal" href="/@api/deki/files/3217/=filterdemo.xhtml" title="/@api/deki/files/3217/=filterdemo.xhtml">View this example live</a>.</p><h2 id="Uso_de_referencias_externas"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Uso de</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">referencias</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">externas</span></span></h2>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Los</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">elementos</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">utiliza</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">para cortar</span><span title="Haz clic para obtener otras posibles traducciones">, el enmascaramiento</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">y así sucesivamente</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se pueden cargar</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">desde</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">externo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mientras</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">proviene</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">mismo origen</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">documento</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">HTML al que</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">aplica.</span><br>
+<br>
+<span class="hps" title="Haz clic para obtener otras posibles traducciones">Por ejemplo</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">si</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tu</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">CSS</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">en</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un archivo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">llamado</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">default.css</span><span title="Haz clic para obtener otras posibles traducciones">,</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">puede</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">tener el siguiente aspecto</span><span title="Haz clic para obtener otras posibles traducciones">:</span></span></p>
+<pre class="brush: xml">.target { clip-path: url(resources.svg#c1); }</pre>
+<p><span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">El</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">SVG</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">se importa</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">desde</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">un</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">archivo</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">llamado</span></span> <code>resources.svg</code>, <span id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">utilizando</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">la</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ruta</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">del clip</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">con el</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">ID</span></span> <code>c1</code>.</p><h2 id="Véa_también"><span class="short_text" id="result_box" lang="es"><span class="hps" title="Haz clic para obtener otras posibles traducciones">Véa</span> <span class="hps" title="Haz clic para obtener otras posibles traducciones">también</span></span></h2>
+<ul> <li><a class="internal" href="/en/SVG" title="En/SVG">SVG</a></li> <li><a class="external" href="/web-tech/2008/09/15/svg-effects-for-html-content" title="https://developer.mozilla.org/editor/fckeditor/core/editor/web-tech/2008/09/15/svg-effects-for-html-content/">SVG Effects for HTML Content</a> (blog post)</li> <li><a class="external" href="/web-tech/2008/10/10/svg-external-document-references" title="https://developer.mozilla.org/editor/fckeditor/core/editor/web-tech/2008/10/10/svg-external-document-references/">SVG External Document References</a> (blog post)</li>
+</ul>
+<p> </p>
+<p> </p>
+<p style="margin-left: 680px;">                      CESAR ORTIZ GUTIERREZ - ELPATOX - wWw.Patito.Tk</p>
diff --git a/files/es/web/svg/element/glifo/index.html b/files/es/web/svg/element/glifo/index.html
deleted file mode 100644
index 78f97fe3bb..0000000000
--- a/files/es/web/svg/element/glifo/index.html
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: glyph
-slug: Web/SVG/Element/glifo
-tags:
-  - Contenido de texto SVG
-  - Elemento
-  - Fuentes SVG
-  - Glifos
-  - NeedsCompatTable
-  - Referencia
-  - SVG
-translation_of: Web/SVG/Element/glyph
----
-<div>{{SVGRef}}</div>
-
-<p>Un glifo define a un glifo en particular en una fuente SVG.</p>
-
-<h2 id="Contexto_de_uso">Contexto de uso</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="row">Categories</th>
-   <td>Elemento de contenido de texto.</td>
-  </tr>
-  <tr>
-   <th scope="row">Permitted content</th>
-   <td>
-    <p>Cualquier número de los siguientes elementos, en cualquier orden:<br>
-     <a href="/en/SVG/Element#Animation" title="en/SVG/Attribute#Animation">elementos de animación</a> »<br>
-     <a href="/en/SVG/Element#Descriptive" title="en/SVG/Attribute#Descriptive">elementos descriptivos</a> »<br>
-     <a href="/en/SVG/Element#Shape" title="en/SVG/Attribute#Shape">elementos de forma</a> »<br>
-     <a href="/en/SVG/Element#Structural" title="en/SVG/Attribute#Structural">elementos estructurales</a> »<br>
-     <a href="/en/SVG/Element#Gradient" title="en/SVG/Attribute#Gradient">elementos de gradiente</a> »<br>
-     {{ SVGElement("a") }}, {{ SVGElement("altGlyphDef") }}, {{ SVGElement("clipPath") }}, {{ SVGElement("color-profile") }}, {{ SVGElement("cursor") }}, {{ SVGElement("filter") }}, {{ SVGElement("font") }}, {{ SVGElement("font-face") }}, {{ SVGElement("foreignObject") }}, {{ SVGElement("image") }}, {{ SVGElement("marker") }}, {{ SVGElement("mask") }}, {{ SVGElement("pattern") }}, {{ SVGElement("script") }}, {{ SVGElement("style") }}, {{ SVGElement("switch") }}, {{ SVGElement("text") }}, {{ SVGElement("view") }}</p>
-   </td>
-  </tr>
-  <tr>
-   <th scope="row">Normative document</th>
-   <td><a class="external" href="http://www.w3.org/TR/SVG/fonts.html#GlyphElement" title="http://www.w3.org/TR/SVG/fonts.html#GlyphElement">SVG 1.1 (Segunda edición)</a></td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<pre class="brush: xml">&lt;?xml version="1.0" standalone="yes"?&gt;
-&lt;svg width="400px" height="300px" version="1.1"
-  xmlns = 'http://www.w3.org/2000/svg'&gt;
-&lt;!-- Example copied from http://www.w3.org/TR/SVG/fonts.html#GlyphElement --&gt;
-  &lt;defs&gt;
-
-    &lt;font id="Font1" horiz-adv-x="1000"&gt;
-      &lt;font-face font-family="Super Sans" font-weight="bold" font-style="normal"
-          units-per-em="1000" cap-height="600" x-height="400"
-          ascent="700" descent="300"
-          alphabetic="0" mathematical="350" ideographic="400" hanging="500"&gt;
-        &lt;font-face-src&gt;
-          &lt;font-face-name name="Super Sans Bold"/&gt;
-        &lt;/font-face-src&gt;
-      &lt;/font-face&gt;
-
-      &lt;missing-glyph&gt;&lt;path d="M0,0h200v200h-200z"/&gt;&lt;/missing-glyph&gt;
-      &lt;glyph unicode="!" horiz-adv-x="80" d="M0,0h200v200h-200z"&gt;&lt;/glyph&gt;
-      &lt;glyph unicode="@" d="M0,50l100,300l400,100z"&gt;&lt;/glyph&gt;
-
-    &lt;/font&gt;
-  &lt;/defs&gt;
-  &lt;text x="100" y="100"
-           style="font-family: 'Super Sans', Helvetica, sans-serif;
-                  font-weight: bold; font-style: normal"&gt;Text
-    using embe@dded font!&lt;/text&gt;
-&lt;/svg&gt;
-
-
-</pre>
-
-<h2 id="Atributos">Atributos</h2>
-
-<h3 id="Atributos_globales">Atributos globales</h3>
-
-<ul>
- <li><a href="/en/SVG/Attribute#Core" title="en/SVG/Attribute#Core">Atributos centrales</a>»</li>
- <li><a href="/en/SVG/Attribute#Presentation" title="en/SVG/Attribute#Presentation">Atributos de presentación</a> »</li>
- <li>{{ SVGAttr("class") }}</li>
- <li>{{ SVGAttr("style") }}</li>
-</ul>
-
-<h3 id="Atributos_específicos">Atributos específicos</h3>
-
-<ul>
- <li>{{ SVGAttr("d") }}</li>
- <li>{{ SVGAttr("horiz-adv-x") }}</li>
- <li>{{ SVGAttr("vert-origin-x") }}</li>
- <li>{{ SVGAttr("vert-origin-y") }}</li>
- <li>{{ SVGAttr("vert-adv-y") }}</li>
- <li>{{ SVGAttr("unicode") }}</li>
- <li>{{ SVGAttr("glyph-name") }}</li>
- <li>{{ SVGAttr("orientation") }}</li>
- <li>{{ SVGAttr("arabic-form") }}</li>
- <li>{{ SVGAttr("lang") }}</li>
-</ul>
-
-<h2 id="Interfaz_DOM">Interfaz DOM</h2>
-
-<p>Este elemento implementa la interfaz <code><a href="/en/DOM/SVGGlyphElement" title="en/DOM/SVGGlyphElement">SVGGlyphElement</a></code>.</p>
-
-<h2 id="Relacionado">Relacionado</h2>
-
-<ul>
- <li>{{ SVGElement("font") }}</li>
- <li>{{ SVGElement("missing-glyph") }}</li>
- <li><a href="/en/SVG/Tutorial/SVG_fonts" title="en/SVG/Tutorial/SVG_Fonts">Tutorial SVG: Fuentes SVG</a></li>
-</ul>
diff --git a/files/es/web/svg/element/glyph/index.html b/files/es/web/svg/element/glyph/index.html
new file mode 100644
index 0000000000..0c8d7cd48e
--- /dev/null
+++ b/files/es/web/svg/element/glyph/index.html
@@ -0,0 +1,115 @@
+---
+title: glyph
+slug: Web/SVG/Element/glyph
+tags:
+  - Contenido de texto SVG
+  - Elemento
+  - Fuentes SVG
+  - Glifos
+  - NeedsCompatTable
+  - Referencia
+  - SVG
+translation_of: Web/SVG/Element/glyph
+original_slug: Web/SVG/Element/glifo
+---
+<div>{{SVGRef}}</div>
+
+<p>Un glifo define a un glifo en particular en una fuente SVG.</p>
+
+<h2 id="Contexto_de_uso">Contexto de uso</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="row">Categories</th>
+   <td>Elemento de contenido de texto.</td>
+  </tr>
+  <tr>
+   <th scope="row">Permitted content</th>
+   <td>
+    <p>Cualquier número de los siguientes elementos, en cualquier orden:<br>
+     <a href="/en/SVG/Element#Animation" title="en/SVG/Attribute#Animation">elementos de animación</a> »<br>
+     <a href="/en/SVG/Element#Descriptive" title="en/SVG/Attribute#Descriptive">elementos descriptivos</a> »<br>
+     <a href="/en/SVG/Element#Shape" title="en/SVG/Attribute#Shape">elementos de forma</a> »<br>
+     <a href="/en/SVG/Element#Structural" title="en/SVG/Attribute#Structural">elementos estructurales</a> »<br>
+     <a href="/en/SVG/Element#Gradient" title="en/SVG/Attribute#Gradient">elementos de gradiente</a> »<br>
+     {{ SVGElement("a") }}, {{ SVGElement("altGlyphDef") }}, {{ SVGElement("clipPath") }}, {{ SVGElement("color-profile") }}, {{ SVGElement("cursor") }}, {{ SVGElement("filter") }}, {{ SVGElement("font") }}, {{ SVGElement("font-face") }}, {{ SVGElement("foreignObject") }}, {{ SVGElement("image") }}, {{ SVGElement("marker") }}, {{ SVGElement("mask") }}, {{ SVGElement("pattern") }}, {{ SVGElement("script") }}, {{ SVGElement("style") }}, {{ SVGElement("switch") }}, {{ SVGElement("text") }}, {{ SVGElement("view") }}</p>
+   </td>
+  </tr>
+  <tr>
+   <th scope="row">Normative document</th>
+   <td><a class="external" href="http://www.w3.org/TR/SVG/fonts.html#GlyphElement" title="http://www.w3.org/TR/SVG/fonts.html#GlyphElement">SVG 1.1 (Segunda edición)</a></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Ejemplo">Ejemplo</h2>
+
+<pre class="brush: xml">&lt;?xml version="1.0" standalone="yes"?&gt;
+&lt;svg width="400px" height="300px" version="1.1"
+  xmlns = 'http://www.w3.org/2000/svg'&gt;
+&lt;!-- Example copied from http://www.w3.org/TR/SVG/fonts.html#GlyphElement --&gt;
+  &lt;defs&gt;
+
+    &lt;font id="Font1" horiz-adv-x="1000"&gt;
+      &lt;font-face font-family="Super Sans" font-weight="bold" font-style="normal"
+          units-per-em="1000" cap-height="600" x-height="400"
+          ascent="700" descent="300"
+          alphabetic="0" mathematical="350" ideographic="400" hanging="500"&gt;
+        &lt;font-face-src&gt;
+          &lt;font-face-name name="Super Sans Bold"/&gt;
+        &lt;/font-face-src&gt;
+      &lt;/font-face&gt;
+
+      &lt;missing-glyph&gt;&lt;path d="M0,0h200v200h-200z"/&gt;&lt;/missing-glyph&gt;
+      &lt;glyph unicode="!" horiz-adv-x="80" d="M0,0h200v200h-200z"&gt;&lt;/glyph&gt;
+      &lt;glyph unicode="@" d="M0,50l100,300l400,100z"&gt;&lt;/glyph&gt;
+
+    &lt;/font&gt;
+  &lt;/defs&gt;
+  &lt;text x="100" y="100"
+           style="font-family: 'Super Sans', Helvetica, sans-serif;
+                  font-weight: bold; font-style: normal"&gt;Text
+    using embe@dded font!&lt;/text&gt;
+&lt;/svg&gt;
+
+
+</pre>
+
+<h2 id="Atributos">Atributos</h2>
+
+<h3 id="Atributos_globales">Atributos globales</h3>
+
+<ul>
+ <li><a href="/en/SVG/Attribute#Core" title="en/SVG/Attribute#Core">Atributos centrales</a>»</li>
+ <li><a href="/en/SVG/Attribute#Presentation" title="en/SVG/Attribute#Presentation">Atributos de presentación</a> »</li>
+ <li>{{ SVGAttr("class") }}</li>
+ <li>{{ SVGAttr("style") }}</li>
+</ul>
+
+<h3 id="Atributos_específicos">Atributos específicos</h3>
+
+<ul>
+ <li>{{ SVGAttr("d") }}</li>
+ <li>{{ SVGAttr("horiz-adv-x") }}</li>
+ <li>{{ SVGAttr("vert-origin-x") }}</li>
+ <li>{{ SVGAttr("vert-origin-y") }}</li>
+ <li>{{ SVGAttr("vert-adv-y") }}</li>
+ <li>{{ SVGAttr("unicode") }}</li>
+ <li>{{ SVGAttr("glyph-name") }}</li>
+ <li>{{ SVGAttr("orientation") }}</li>
+ <li>{{ SVGAttr("arabic-form") }}</li>
+ <li>{{ SVGAttr("lang") }}</li>
+</ul>
+
+<h2 id="Interfaz_DOM">Interfaz DOM</h2>
+
+<p>Este elemento implementa la interfaz <code><a href="/en/DOM/SVGGlyphElement" title="en/DOM/SVGGlyphElement">SVGGlyphElement</a></code>.</p>
+
+<h2 id="Relacionado">Relacionado</h2>
+
+<ul>
+ <li>{{ SVGElement("font") }}</li>
+ <li>{{ SVGElement("missing-glyph") }}</li>
+ <li><a href="/en/SVG/Tutorial/SVG_fonts" title="en/SVG/Tutorial/SVG_Fonts">Tutorial SVG: Fuentes SVG</a></li>
+</ul>
diff --git a/files/es/web/svg/element/script/index.html b/files/es/web/svg/element/script/index.html
new file mode 100644
index 0000000000..1efecd0e7c
--- /dev/null
+++ b/files/es/web/svg/element/script/index.html
@@ -0,0 +1,256 @@
+---
+title: <script>
+slug: Web/SVG/Element/script
+tags:
+  - Elemento
+  - HTML
+  - HTML scripting
+  - Referencia
+  - Scripting
+  - Web
+  - etiqueta
+translation_of: Web/SVG/Element/script
+original_slug: Web/HTML/Elemento/script
+---
+<h2 id="Resumen">Resumen</h2>
+
+<p>El <em>elemento HTML Script</em> (<strong><code>&lt;script&gt;</code></strong>) se utiliza para insertar o hacer referencia a un script ejecutable dentro de un documento HTML o XHTML.</p>
+
+<p>Los scripts sin atributo <code>async</code> o <code>defer</code>, así como las secuencias de comandos en línea, son interpretados y ejecutados inmediatamente, antes de que el navegador continúe procesando la página.</p>
+
+<table class="properties">
+ <tbody>
+  <tr>
+   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories" title="HTML/Content_categories">Content categories</a></th>
+   <td><a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content" title="HTML/Content_categories#Metadata_content">Metadata content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Flow_content" title="HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content" title="HTML/Content_categories#Phrasing_content">Phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Contenido permitido</th>
+   <td>Script dinámico tal como <code>text/javascript</code>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Omision de etiquetas</th>
+   <td>{{no_tag_omission}}</td>
+  </tr>
+  <tr>
+   <th scope="row">Elementos padre permitidos</th>
+   <td>Cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Metadata_content" title="HTML/Content_categories#Metadata_content">metadata content</a>, o cualquier elemento que acepte <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
+  </tr>
+  <tr>
+   <th scope="row">Interfaz DOM</th>
+   <td>{{domxref("HTMLScriptElement")}}</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Atributos">Atributos</h2>
+
+<p>Este elemento contiene los <a href="es/docs/Web/HTML/Atributos_Globales">atributos globales</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("async")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>Establece este atributo booleano para indicar al navegador, si es posible, ejecutar el código asincrónicamente. Esto no afecta a los scripts escritos dentro de la etiqueta (es decir a aquellos que no tienen el atributo <strong>src</strong>).</dd>
+ <dd>Ver {{anch("Browser compatibility")}} para notas acerca de compatibilidad. Ver tambien <a href="/en-US/docs/Games/Techniques/Async_scripts">Scripts asincrónicos para asm.js</a>.</dd>
+ <dt>{{htmlattrdef("integrity")}}</dt>
+ <dd>Contiene información de metadatos que es usada por el user agent del navegador para verificar el recurso captado fue entregado libre de manipulación inesperada. Ver <a href="/en-US/docs/Web/Security/Subresource_Integrity">Subresource Integrity</a>.</dd>
+ <dt>{{htmlattrdef("src")}}</dt>
+ <dd>Este atributo especifica la URI del script externo; este puede ser usado como alternativa a scripts embebidos directamente en el documento. Si el script tiene el atributo src, no debería tener código dentro de la etiqueta.</dd>
+ <dt>{{htmlattrdef("type")}}</dt>
+ <dd>Este atributo identifica el lenguaje de scripting en que está escrito el código embebido dentro de la etiqueta script, o referenciada utilizando el atributo src. Los valores posibles están especificados como un MIME type (tipo MIME). <br>
+ Algunos ejemplos de tipos MIME que pueden ser utilizados son: <code>text/javascript</code>, <code>text/ecmascript</code>, <code>application/javascript</code>, y <code>application/ecmascript. </code>Si el atributo se encuentra ausente, el valor por defecto será un script JavaScript.</dd>
+ <dd>Si el tipo MIME especificado no es un tipo JavaScript, el contenido embebido dentro de la etiqueta script es tratado como un bloque de datos que no será procesado por el navegador.</dd>
+ <dd>Si el tipo especificado es module, el código es tratado como un módulo JavaScript {{experimental_inline}}. Ver <a href="https://hacks.mozilla.org/2015/08/es6-in-depth-modules/">ES6 in Depth: Modules</a>.</dd>
+ <dd>Nota: en Firefox puedes usar características avanzadas tales como let statements y otras características de la última versión de JS, usando type=application/javascript;version=1.8 {{Non-standard_inline}}. Ten cuidado!, esto no es una característica estándar, es decir, probablemente genere conflictos con otros navegadores, en particular aquellos basados en Chromium.</dd>
+ <dd>Para incluir lenguajes de programación exóticos, lee acerca de <a href="/en-US/Add-ons/Code_snippets/Rosetta">Rosetta</a>.</dd>
+ <dt>{{htmlattrdef("text")}}</dt>
+ <dd>Este atributo actúa como el atributo <code>textContent</code>, establece el texto contenido del elemento. Pero a diferencia de <code>textContent</code>, este atributo se evalúa como ejecutable luego de ser insertado como nodo en el DOM.</dd>
+ <dt>{{htmlattrdef("language")}} {{Deprecated_inline}}</dt>
+ <dd>Este atributo actúa como el atributo <code>type</code>, identifica el tipo de lenguaje que se utiliza. A diferencia del atributo <code>type</code>, los posibles valores de este atributo nunca fueron estandarizados. El atributo <code>type</code> debe ser utilizado en lugar de <code>language</code>.</dd>
+ <dt>{{htmlattrdef("defer")}}</dt>
+ <dd>Este atributo establece si el script debe ser ejecutado luego de que el documento entero sea analizado. Dado que esta función aún no fue implementada por todos los navegadores relevantes, los autores no deberían asumir que el script realmente será ejecutado luego de la carga y analisis del documento.  Desde Gecko 1.9.2 el atributo defer es ignorado en los scripts que no tienen el atributo src. Sin embargo, en Gecko 1.9.1 incluso se difieren los scripts escritos dentro de la etiqueta.</dd>
+ <dt>{{htmlattrdef("crossorigin")}} {{Non-standard_inline}}</dt>
+ <dd>Elementos normales script pasan información mínima al {{domxref('GlobalEventHandlers.onerror', 'window.onerror')}} para scripts que no pasan las revisiones del estándar <a href="/es/docs/Web/HTTP/Access_control_CORS">CORS</a>. Para permitir registrar errores en los sitios que usan dominios separados para recursos estáticos, usar este atributo.</dd>
+</dl>
+
+<h2 id="Ejemplos">Ejemplos</h2>
+
+<pre class="brush: html">&lt;!-- HTML4 y (x)HTML --&gt;
+&lt;script type="text/javascript" src="javascript.js"&gt;&lt;/script&gt;
+
+&lt;!-- HTML5 --&gt;
+&lt;script src="javascript.js"&gt;&lt;/script&gt;
+</pre>
+
+<h2 id="Especificaciones">Especificaciones</h2>
+
+<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('HTML WHATWG', "scripting.html#the-script-element", "&lt;script&gt;")}}</td>
+   <td>{{Spec2('HTML WHATWG')}}</td>
+   <td>Agrega el tipo module.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML5 W3C', 'scripting-1.html#script', '&lt;script&gt;')}}</td>
+   <td>{{Spec2('HTML5 W3C')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('HTML4.01', 'interact/scripts.html#h-18.2.1', '&lt;script&gt;')}}</td>
+   <td>{{Spec2('HTML4.01')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('Subresource Integrity', '#htmlscriptelement', '&lt;script&gt;')}}</td>
+   <td>{{Spec2('Subresource Integrity')}}</td>
+   <td>Agrega el atributo integrity.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilidad_de_navegadores">Compatibilidad de navegadores</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Característica</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(1.0)}}</td>
+   <td>{{CompatGeckoDesktop("1.0")}}<sup>[2]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>async attribute</td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+   <td>{{CompatGeckoDesktop("1.9.2")}}<sup>[1]</sup></td>
+   <td>10<sup>[1]</sup></td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+  </tr>
+  <tr>
+   <td>defer attribute</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
+   <td>
+    <p>4[3]<br>
+     10</p>
+   </td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>crossorigin attribute</td>
+   <td>{{CompatChrome(30.0)}}</td>
+   <td>{{CompatGeckoDesktop("13")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>12.50</td>
+   <td>{{CompatVersionUnknown}}<sup>[4]</sup></td>
+  </tr>
+  <tr>
+   <td>integrity attribute</td>
+   <td>{{CompatChrome(45.0)}}</td>
+   <td>{{CompatGeckoDesktop("43")}}</td>
+   <td> </td>
+   <td> </td>
+   <td>{{CompatNo}}<sup>[5]</sup></td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}<sup>[2]</sup></td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>async attribute</td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+   <td>{{CompatGeckoMobile("1.0")}}<sup>[1]</sup></td>
+   <td>{{CompatNo}}<sup>[1]</sup></td>
+   <td>{{CompatUnknown}}<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+   <td>{{CompatVersionUnknown}}<sup>[1]</sup></td>
+  </tr>
+  <tr>
+   <td>defer attribute</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatGeckoMobile("1.0")}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td>integrity attribute</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(45.0)}}</td>
+   <td>{{CompatGeckoDesktop("43")}}</td>
+   <td> </td>
+   <td> </td>
+   <td> </td>
+   <td>{{CompatChrome(45.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] In older browsers that don't support the <code>async</code> attribute, parser-inserted scripts block the parser; script-inserted scripts execute asynchronously in IE and WebKit, but synchronously in Opera and pre-4.0 Firefox. In Firefox 4.0, the <code>async</code> DOM property defaults to <code>true</code> for script-created scripts, so the default behavior matches the behavior of IE and WebKit. To request script-inserted external scripts be executed in the insertion order in browsers where the <code>document.createElement("script").async</code> evaluates to <code>true</code> (such as Firefox 4.0), set <code>.async=false</code> on the scripts you want to maintain order. Never call <code>document.write()</code> from an <code>async</code> script. In Gecko 1.9.2, calling <code>document.write()</code> has an unpredictable effect. In Gecko 2.0, calling <code>document.write()</code> from an <code>async</code> script has no effect (other than printing a warning to the error console).</p>
+
+<p>[2] Starting in Gecko 2.0 {{geckoRelease("2.0")}}, inserting script elements that have been created by calling <code>document.createElement("script")</code> into the DOM no longer enforces execution in insertion order. This change lets Gecko properly abide by the HTML5 specification. To make script-inserted external scripts execute in their insertion order, set <code>.async=false</code> on them.</p>
+
+<p>Also, {{HTMLElement("script")}} elements inside {{HTMLElement("iframe")}}, {{HTMLElement("noembed")}} and {{HTMLElement("noframes")}} elements are now executed, for the same reasons.</p>
+
+<p>[3] In versions prior to Internet Explorer 10 Trident implemented <code>&lt;script&gt;</code> by a proprietary specification. Since version 10 it conforms to the W3C specification.</p>
+
+<p>[4] The <code>crossorigin</code> attribute was implemented in WebKit in {{WebKitBug(81438)}}.</p>
+
+<p>[5] {{WebKitBug(148363)}} tracks WebKit implementation of Subresource Integrity (which includes the <code>integrity</code> attribute).</p>
+
+<h2 id="Ver_también">Ver también</h2>
+
+<ul>
+ <li>{{domxref("document.currentScript")}}</li>
+ <li><a href="http://pieisgood.org/test/script-link-events/">Ryan Grove's &lt;script&gt; and &lt;link&gt; node event compatibility chart</a></li>
+</ul>
+
+<p>{{HTMLRef}}</p>
diff --git a/files/es/web/svg/svg_1.1_support_in_firefox/index.html b/files/es/web/svg/svg_1.1_support_in_firefox/index.html
new file mode 100644
index 0000000000..0318191420
--- /dev/null
+++ b/files/es/web/svg/svg_1.1_support_in_firefox/index.html
@@ -0,0 +1,848 @@
+---
+title: SVG en Firefox
+slug: Web/SVG/SVG_1.1_Support_in_Firefox
+tags:
+  - NecesitaRevisiónTécnica
+  - SVG
+  - Todas_las_Categorías
+translation_of: Web/SVG/SVG_1.1_Support_in_Firefox
+original_slug: SVG_en_Firefox
+---
+<p> </p>
+<p><b>Firefox 2</b> sigue avanzando en la mejora de la implementación de <a class="external" href="http://www.w3.org/Graphics/SVG/">Gráficos vectoriales escalables (SVG)</a>. Aunque el único elemento añadido a los ya soportados por Firefox 1.5 ha sido <code>&lt;textPath&gt;</code>, se han resuelto varios fallos y se ha incorporado parte de la especificación.</p>
+<p><b>Firefox SVG</b> es un subconjunto de <a class="external" href="http://www.w3.org/TR/SVG11/">SVG 1.1</a>, pero no es ninguno de los perfiles oficiales (Tiny, Basic, Full). Al final de este documento se puede encontrar una lista completa de los elementos <a href="es/SVG">SVG</a> y su estado de implementación en Firefox 2.0. El resto del documento aporta información sobre las limitaciones en la implementación.</p>
+<p>La particular implementación que hemos realizado puede dificultar la creación de contenidos. Le pedimos que tenga paciencia mientras trabajamos en la implementación completa de esta extensa especificación.</p>
+<p>Mientras lee esto, usted puede preguntarse cuántos de estos detalles sobre de la implementación pueden haber cambiado. Por desgracia la <a class="external" href="http://www.mozilla.org/roadmap/gecko-1.9-roadmap.html">hoja de ruta</a> actual sitúa la publicación de Firefox con la nueva versión de Gecko en el primer trimestre de 2007. Sin embargo si desea empezar a experimentar con las nuevas funcionalidades, tiene a su disposición en las <a class="external" href="http://www.mozilla.org/developer/#builds">compilaciones nocturnas</a> las últimas evoluciones. También puede consultar <a class="external" href="http://www.mozilla.org/projects/svg/status.html">la tabla actualizada</a> sobre la implementación de SVG en la versión de desarrollo.</p>
+<h2 id="Rendimiento" name="Rendimiento">Rendimiento</h2>
+<p>Firefox usa el mismo motor de renderizado, <a class="external" href="http://cairographics.org/">cairo</a>, en todas las plataformas. Por lo tanto sus características de interpretación serán similares. El rendimiento en Linux es el más difícil de predecir, esto es debido a las distintas implementaciones que hacen los diversos servidores X de la extensión RENDER.</p>
+<p>En Windows el renderizado de SVG es bastante más rápido que en otras plataformas.</p>
+<h2 id="Rango_de_coordenadas" name="Rango_de_coordenadas">Rango de coordenadas</h2>
+<p>Si el contenido posee una geometría con un inmenso rango de coordenadas, habrá que tener cuidado con los problemas ocasionados por el uso interno de cairo para la representación de punto fijo de 16.16 bits para los cálculos. Cairo no recorta las primitivas antes del proceso de rasterización por lo que las coordenadas finales que excedan el rango de -32678 a 32677 tras la transformación provocarán errores de renderizado y posiblemente un rendimiento muy bajo.</p>
+<h2 id="Texto_en_Windows_98" name="Texto_en_Windows_98">Texto en Windows 98</h2>
+<p>Un lamentable efecto secundario de usar Cairo como backend de renderizado en Windows es que el renderizado de texto no funcionará en Windows 98. En realidad la cosa es aún peor, si aparece cualquier texto durante el renderizado de contenidos SVG, todo el dibujo se parará.</p>
+<h2 id="Selecci.C3.B3n_de_fuente" name="Selecci.C3.B3n_de_fuente">Selección de fuente</h2>
+<p>Si está familiarizado con CSS probablemente sabrá que pueden especificar fuentes alternativas para las propiedades 'font', por si los glifos de una fuente concreta no están disponibles. El actual motor de renderizado de SVG sólo tratará de usar la primera fuente especificada, y si ésta no existe, usará una fuente del sistema. Las fuentes secundarias nunca son usadas, por ejemplo, font-family="Arial,LucidaSansUnicode" no generará una fuente LucidaSansUnicode, aun en el caso de que Arial no esté disponible.</p>
+<h2 id="Impresi.C3.B3n" name="Impresi.C3.B3n">Impresión</h2>
+<p>Por desgracia, actualmente en la impresión no se aprovechan las propiedades vectoriales de SVG para generar una salida óptima, por contra, se renderiza según la resolución de la pantalla y luego la salida se hace como imagen.</p>
+<p>Al imprimir en MS-Windows, el tamaño de la fuente será mucho más grande que el especificado por SVG.</p>
+<h2 id="Opacidad_de_grupos" name="Opacidad_de_grupos">Opacidad de grupos</h2>
+<p>La propiedad de opacidad de grupo <code>opacity</code> permite que los objetos contenedores SVG puedan ser tratados como capas semitransparentes, y está separada de las propiedades "fill-opacity" y "stroke-opacity". La implementación actual de "opacity" consume bastantes recursos, debería ser usada con mesura. "fill-opacity" y "stroke-opacity" son mucho más rápidas, y dependiendo de su contenido pueden aportar los mismos resultados.</p>
+<h2 id="Fuentes_rotadas" name="Fuentes_rotadas">Fuentes rotadas</h2>
+<p>En las plataformas Microsoft Windows y Mac OSX, un texto rotado no es rellenado completamente. El error es por lo general despreciable y puede solucionarse usando un relleno un poquito más grueso. A continuación se muestra un ejemplo con la diferencia:</p>
+<p><img alt="Imagen:Text-fill-stroke.png"></p>
+<h2 id=".3Cimage.3E" name=".3Cimage.3E">&lt;image&gt;</h2>
+<p>&lt;image&gt; no soporta imágenes SVG en Firefox 1.5, sólo los formatos de imagen rasterizados que Firefox maneja.</p>
+<p>Todas las instancias de &lt;image&gt; tienen una copia separada de la imagen que está siendo usada, lo cual es algo a tener en cuenta si tu contenido está usando múltiples copias de una imagen para un icono o algo parecido. Desafortunadamente, &lt;use&gt; en contenido &lt;image&gt; cuenta como otra copia en este caso.</p>
+<p>De manera adicional, un uso intensivo de imágenes rasterizadas en SVG puede degradar sobremanera el rendimiento en Firefox 1.5.</p>
+<h2 id="Eventos" name="Eventos">Eventos</h2>
+<p>Soportamos los atributos de SVG para eventos, a excepción de <code>onfocusin</code>, <code>onfocusout</code>, y <code>onactivate</code>.</p>
+<p>Nuestro actual manejo del evento <code>onload</code> no es estándar, pero creemos que aún así no impide su uso correcto. Mientras que el código especificado por el atributo <code>onload</code> sea llamado para cada elemento, un evento <code>SVGLoad</code> será llamado únicamente para el elemento <code>&lt;svg&gt;</code> raíz. Algunos métodos DOM devolverán basura o error si son llamados antes de que el elemento correspondiente haya sido renderizado, algo que tendrás que tener en cuenta al escribir código <code>onload</code>. Dichos métodos son <code>getBBox</code>, <code>getScreenCTM</code>, etc...</p>
+<p>No damos soporte a los eventos para el teclado específicos de Adobe (<code>onkeydown</code>, <code>onkeyup</code>).</p>
+<h2 id="Interoperabilidad" name="Interoperabilidad">Interoperabilidad</h2>
+<p>Si está trabajando con contenidos SVG actuales, puede encontrar problemas al cargarlos en Firefox. La mayoría de los problemas suelen ser triviales y son el resultado de una implementación más estricta en Firefox. En <a class="external" href="http://jwatt.org/svg/authoring/">Guías de estilo para crear SVG</a>, Jonathan Watt explica problemas comunes.</p>
+<h2 id="Situaciones_de_uso_de_SVG" name="Situaciones_de_uso_de_SVG">Situaciones de uso de SVG</h2>
+<p>Firefox 1.5 maneja SVG como un documento completo, o como referencia para los elementos <code>embed</code>, <code>object</code>, e <code>iframe</code>. Actualmente no puede ser usado en HTML o XHTML como fuente del elemento <code>img</code>, ni para las propiedades CSS relativas a las imágenes.</p>
+<h2 id="Animaciones" name="Animaciones">Animaciones</h2>
+<p>Firefox 1.5 no implementa la animación declarativa, pero soporta scripting dinámico. Doug Shepers lo ha usado para crear <a class="external" href="http://www.vectoreal.com/smilscript/">SmilScript</a>, una pequeña biblioteca de Javascript que implementa parte de la animación declarativa de SVG.</p>
+<h2 id="Fallos_corregidos_en_Firefox_2" name="Fallos_corregidos_en_Firefox_2">Fallos corregidos en Firefox 2</h2>
+<p>Firefox 2 ha arreglado algunos fallos en su implementación para SVG. Esta sección presenta un repaso rápido a los arreglos más interesantes.</p>
+<ul>
+ <li>Se ha solucionado un problema al rellenar y rotar texto en el que la posición del dibujo no era reiniciada correctamente entre dos operaciones (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=333615">333615</a>).</li>
+</ul>
+<ul>
+ <li>Los gradientes radiales ahora mantienen los atributos <code>fx</code> y <code>fy</code> para asegurar que se encuentran dentro de la circunferencia de un círculo (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=330682">330682</a>).</li>
+</ul>
+<ul>
+ <li>La longitud del texto ahora puede ser calculada usando su método <code>getComputedTextLength()</code>, lo que mejora la compatibilidad con ciertos sitios web (bugs <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=311031">311031</a> and <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=264380">264380</a>).</li>
+</ul>
+<ul>
+ <li>Los elementos <code>&lt;tspan&gt;</code> ahora soportan correctamente los atributos <code>dx</code> y <code>dy</code> y funcionan si los atributos <code>x</code> e <code>y</code> no han sido especificados (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=311063">311063</a>).</li>
+</ul>
+<ul>
+ <li>Se ha mejorado la lógica de invalidación en el redibujado, lo que evita el parpadeo de los píxeles en ciertos casos (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312269">312269</a>).</li>
+</ul>
+<ul>
+ <li>Arreglado un fallo que impedía que los eventos fuesen manejados apropiadamente por objetos expuestos por el camino de recorte de otro objeto (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=315861">315861</a>).</li>
+</ul>
+<ul>
+ <li>Arreglado un fallo que podía provocar el cierre de la aplicación si un elemento <code>&lt;path&gt;</code> tenía un atributo <code>d</code> con una cadena vacía (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=318379">318379</a>).</li>
+</ul>
+<ul>
+ <li>El atributo <code>overflow</code> ahora funciona para el elemento <code>marker</code>, usando la sintaxis <code>overflow="visible"</code>, la cual antes no funcionaba correctamente (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=320623">320623</a>).</li>
+</ul>
+<ul>
+ <li>Ahora se puede acceder al atributo <code>&lt;style&gt;</code> del elemento <code>marker</code> sin que se lance ninguna excepción (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=323589">323589</a>).</li>
+</ul>
+<ul>
+ <li>Ahora se pueden usar valores porcentuales en el radio de un gradiente radial (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=323669">323669</a>).</li>
+</ul>
+<ul>
+ <li>El método <code>documentElement.createSVGAngle()</code> ahora está implementado (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=327437">327437</a>).</li>
+</ul>
+<ul>
+ <li>Cuando un elemento <code>&lt;stop&gt;</code> se convierte en hijo de otro elemento <code>&lt;stop&gt;</code> dicho elemento deja de ser un aserto (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=328137">328137</a>).</li>
+</ul>
+<ul>
+ <li>Ahora funciona el cambio de la altura, anchura y orientación de los pinceles (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=325728">325728</a>).</li>
+</ul>
+<ul>
+ <li>El tamaño de las fuentes impresas en Windows ya no es tan grande como el especificado por el SVG (bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=314707">314707</a>).</li>
+</ul>
+<h2 id="Estado_de_la_implementaci.C3.B3n_de_los_elementos" name="Estado_de_la_implementaci.C3.B3n_de_los_elementos">Estado de la implementación de los elementos</h2>
+<table style="margin: 5px;">
+ <tbody>
+  <tr>
+   <th><b>Elemento </b></th>
+   <th><b>Notas </b></th>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#basic-structure-mod">Módulo de estructura</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SVGElement">svg</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>Los atributos DOM <code>currentScale</code> y <code>currentTranslate</code> están implementados pero no existe una interfaz de usuario para pan ni zoom.</li>
+     <li>SVGSVGElement
+      <ul>
+       <li>Atributos no implementados: contentScriptType, contentStyleType, viewport, useCurrentView, currentView.</li>
+       <li>Bindings no implementados: pauseAnimations, unpauseAnimations,animationsPaused, getCurrentTime, setCurrentTime, getIntersectionList, getEnclosureList, checkIntersection, checkEnclosure, deselectAll, createSVGAngle, getElementById</li>
+      </ul>
+     </li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#GElement">g</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DefsElement">defs</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DescElement">desc</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>Solo disponible en el DOM, sin interfaz de usuario.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#TitleElement">title</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/metadata.html#MetadataElement">metadata</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>Solo disponible en el DOM, sin interfaz de usuario. &lt;/td&gt;</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SymbolElement">symbol</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#UseElement">use</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>Solo funciona para referencias internas al documento (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=269482">bug 269482</a>).</li>
+     <li>No sigue completamente las reglas de la cascada &lt;svg:use&gt; (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265894">bug 265894</a>).</li>
+     <li>No entrega eventos a un arbol SVGElementInstance (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265895">bug 265895</a>).</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#conditional-mod">Módulo de procesamiento condicional</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SwitchElement">switch</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#image-mod">Módulo de imagen</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement">image</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>Solo funciona para tramas de bitmaps (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=272288">bug 272288</a>).</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#style-mod">Módulo de estilo</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#StyleElement">style</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#shape-mod">Módulo de formas</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/paths.html#PathElement">path</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>Interfaz SVGPathElement
+      <ul>
+       <li>Atributos no implementados: pathLength, normalizedPathSegList, animatedPathSegList, animatedNormalizedPathSegList</li>
+       <li>Bindings no implementados: getTotalLength, getPointAtLength, getPathSegAtLength</li>
+      </ul>
+     </li>
+     <li>Interfaz SVGPathSegList
+      <ul>
+       <li>Bindings No implementados: replaceItem()</li>
+      </ul>
+     </li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement">rect</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#CircleElement">circle</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#LineElement">line</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement">ellipse</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolylineElement">polyline</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement">polygon</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/text.html#text-mod">Módulo de texto</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextElement">text</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>SVGTextElement
+      <ul>
+       <li>Atributos no implementados: rotate, textLength, lengthAdjust</li>
+       <li>Bindings no implementados: getNumberOfChars, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString.</li>
+       <li>Bindings not functional at <code>onload</code> time: getExtentOfChar</li>
+      </ul>
+     </li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TSpanElement">tspan</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>SVGTSpanElement
+      <ul>
+       <li>Atributos no implementados: rotate, textLength, lengthAdjust</li>
+       <li>Bindings no implementados: getNumberOfChars, getComputedTextLength, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getExtentOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString</li>
+      </ul>
+     </li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TRefElement">tref</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextPathElement">textPath</a></td>
+   <td>
+    <ul>
+     <li>Implementado en Firefox 2.</li>
+     <li>Atributos no implementados: method, spacing, textLength, lengthAdjust</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphElement">altGlyph</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphDefElement">altGlyphDef</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphItemElement">altGlyphItem</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#GlyphRefElement">glyphRef</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#marker-mod">Módulo de pinceles</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#MarkerElement">marker</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/color.html#color-profile-mod">Color Módulo de perfiles</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/color.html#ColorProfileElement">color-profile</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#gradient-mod">Módulo de gradientes</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#LinearGradientElement">linearGradient</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#RadialGradientElement">radialGradient</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#StopElement">stop</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#pattern-mod">Módulo de patrones</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">pattern</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#clip-mod">Módulo de recorte</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#ClipPathElement">clipPath</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+     <li>No maneja los caminos de recorte que tiene elementos con diferentes propiedades de reglas de recorte o que referencian otros clipPaths. (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=267224">bug 267224</a>).</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#mask-mod">Módulo de máscaras</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">mask</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#filter-mod">Módulo de filtros</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#FilterElement">filter</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feBlendElement">feBlend</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feColorMatrixElement">feColorMatrix</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feComponentTransferElement">feComponentTransfer</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement">feComposite</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElement">feConvolveMatrix</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDiffuseLightingElement">feDiffuseLighting</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMapElement">feDisplacementMap</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFloodElement">feFlood</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feGaussianBlurElement">feGaussianBlur</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement">feImage</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeElement">feMerge</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeNodeElement">feMergeNode</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMorphologyElement">feMorphology</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feOffsetElement">feOffset</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpecularLightingElement">feSpecularLighting</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTileElement">feTile</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTurbulenceElement">feTurbulence</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDistantLightElement">feDistantLight</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#fePointLightElement">fePointLight</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpotLightElement">feSpotLight</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncRElement">feFuncR</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncGElement">feFuncG</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncBElement">feFuncB</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncAElement">feFuncA</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#cursor-mod">Módulo de cursores</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#CursorElement">cursor</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#hyperlinking-mod">Módulos de hiperenlaces</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#AElement">a</a></td>
+   <td>
+    <ul>
+     <li>Implementado como un binding XBL - object is not of type SVGAElement.</li>
+     <li>Sólo están implementados los atributos <code>xlink:href</code>, <code>xlink:show</code> y <code>xlink:target</code> (en Firefox 2).</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#view-mod">Módulo de vista</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#ViewElement">view</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/script.html#scripting-mod">Módulo de scripting</a></th>
+  </tr>
+  <tr style="color: black; background-color: lightgreen;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/script.html#ScriptElement">script</a></td>
+   <td>
+    <ul>
+     <li>Implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#animation-mod">Módulo de animación</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateElement">animate</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#SetElement">set</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateMotionElement">animateMotion</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateTransformElement">animateTransform</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateColorElement">animateColor</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#mpathElement">mpath</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#font-mod">Módulo de fuentes</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceElement">font</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement">glyph</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#MissingGlyphElement">missing-glyph</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#HKernElement">hkern</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#VKernElement">vkern</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceSrcElement">font-face-src</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-uri</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-format</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-name</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#DefinitionSrcElement">definition-src</a></td>
+   <td>
+    <ul>
+     <li>No implementado.</li>
+    </ul>
+   </td>
+  </tr>
+  <tr>
+   <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#extensibility-mod">Módulo de extensibilidad</a></th>
+  </tr>
+  <tr style="color: black; background-color: salmon;">
+   <td><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">foreignObject</a></td>
+   <td>
+    <ul>
+     <li>Implementado, aunque no integrado.</li>
+    </ul>
+   </td>
+  </tr>
+ </tbody>
+</table>
+<p>{{ languages( { "fr": "fr/SVG_dans_Firefox_1.5", "ja": "ja/SVG_in_Firefox_1.5", "pl": "pl/SVG_w_Firefoksie" } ) }}</p>
diff --git a/files/es/web/svg/svg_en_firefox_1.5/index.html b/files/es/web/svg/svg_en_firefox_1.5/index.html
deleted file mode 100644
index f2d954e573..0000000000
--- a/files/es/web/svg/svg_en_firefox_1.5/index.html
+++ /dev/null
@@ -1,60 +0,0 @@
----
-title: SVG en Firefox 1.5
-slug: Web/SVG/SVG_en_Firefox_1.5
-tags:
-  - SVG
-  - Todas_las_Categorías
----
-<p>
-<a href="es/Firefox_1.5">Firefox 1.5</a> marca la publicación del primer navegador de Mozilla que soporta el formato de <a class="external" href="http://www.w3.org/Graphics/SVG/">gráficos vectoriales escalables (SVG)</a>. El camino de este proyecto ha sido largo, nos satisface poner a disposición de los desarrolladores esta tecnologia y estamos impacientes por ver sus frutos. </p><p>Firefox SVG es un subconjunto de <a class="external" href="http://www.w3.org/TR/SVG11/">SVG 1.1</a>, pero no es ninguno de los perfiles oficiales (Tiny, Basic, Full). En este documento se puede encontrar una lista completa de los elementos que han sido implementados en Firefox 1.5. Además encontrará información sobre las limitaciones en su implementación.
-</p><p>La peculiar implementación que hemos realizado puede dificultar el creación de contenidos, le pedimos que tenga paciencia mientras trabajamos en la implementación completa de esta extensa especificación.
-</p><p>Mientras lee esto, usted puede preguntarse cuandos de estos detalles sobre de la implementación pueden haber cambiado. Por desgracia el <a class="external" href="http://www.mozilla.org/roadmap/gecko-1.9-roadmap.html">mapa de ruta actual</a> situa la publicación de Firefox con Gecko 1.9 en el primer trimestre de 2007. Sin embargo si usted desea comenzar a experimentar con las nuevas funcionalidades, tiene a su disposición en las <a class="external" href="http://www.mozilla.org/developer/#builds">nightly builds</a> las últimas evoluciones, y si lo desea puede consultar <a class="external" href="http://www.mozilla.org/projects/svg/status.html">la tabla actualizada</a> sobre la implementación de SVG en la versión de desarrollo. Como podreis comprobar, la cosa avanza a buen ritmo ☺.
-</p><p><br>
-</p>
-<h2 id="Performance" name="Performance"> Performance </h2>
-<p>Firefox usa el mismo motor de renderizado, <a class="external" href="http://cairographics.org/">cairo</a>, en todas las plataformas en las que navega. Por lo tanto sus características de interpretación serán similares. La Performance en linux es la más difícil de predecir, esto es debido a las distintas implementaciones que hacen los diversos servidores X de la extensión RENDER.
-</p><p>En Windows el renderizado de SVG es bastante más rápido que en otras plataformas.
-</p>
-<h2 id="Coordinate_range" name="Coordinate_range"> Coordinate range </h2>
-<p>Si tu contenido posee geometría con un gran rango de coordenadas, necesitarás tener cuidado con los problemas causados por el uso interno de cairo de una representación en punto fijo de 16.16 bit para sus cálculos. Cairo no clip primitives antes de la rasterización, por lo que las coordenadas finales tras la transformación que excedan el rango desde -32678 a 32677 causarán errores de renderizado y posiblemente un funcionamiento bastante lento.
-</p>
-<h2 id="Texto_en_Windows_98" name="Texto_en_Windows_98"> Texto en Windows 98 </h2>
-<p>Un lamentable efecto secundario de usar Cairo como backend de renderizado en Windows es que el renderizado del texto no funcionará en Windows 98. En realidad la cosa es aun peor, si aparece cualquier texto durante la visualización de contenidos SVG, todo el dibujo se parará.
-</p>
-<h2 id="Selecci.C3.B3n_de_fuente" name="Selecci.C3.B3n_de_fuente"> Selección de fuente </h2>
-<p>Si usted está familiarizado con CSS probablemente sabrá que puede especificar fuentes alternativas para las propiedades 'font' por si los glifos de una fuente concreta no estén disponibles. El actual motor de renderizado de SVG sólo tratará de usar la primera fuente especificada, y si esta no existe, usará una fuente del sistema. Las fuentes secundarias nunca son usadas, por ejemplo, font-family="Arial,LucidaSansUnicode" no generará una fuente LucidaSansUnicode, aun en el caso de que Arial no esté disponible.
-</p>
-<h2 id="Impresi.C3.B3n" name="Impresi.C3.B3n"> Impresión </h2>
-<p>Por desgracia, actualmente en la impresión no se aprovechan las propiedades vectoriales de SVG para generar una salida óptima, por contra, se renderiza según la resolución de la pantalla y luego la salida se hace como imagen.
-</p><p>Al imprimir en MS-Windows, el tamaño de la fuente será mucho más grande que el especificado por SVG.
-</p>
-<h2 id="Opacidad_de_grupo" name="Opacidad_de_grupo"> Opacidad de grupo </h2>
-<p>La propiedad de opacidad de grupo "opacity" permite que los objetos contenedores SVG puedan ser tratados como capas semi-transparentes, y sea separado de propiedades "fill-opacity" y "stroke-opacity" La implementacion actual de "opacity" consume bastantes recursos, debería ser usada con mesura. "fill-opacity" y "stroke-opacity" son mucho más rápidas, y dependiendo de su contenido pueden aportar los mismos resultados.
-</p><p>Actualmente la opacidad de grupo está implementado solo para &lt;g&gt; pero no para &lt;text&gt; o &lt;svg&gt;
-</p>
-<h2 id="Stroking_fonts" name="Stroking_fonts"> Stroking fonts </h2>
-<p>On the MS-Windows and OS-X platforms, the stroke of the text will not exactly match the fill. The error is typically quite small, and can be covered by using a slightly thicker stroke. An example of this difference:
-</p><p><br>
-<img alt="Imagen:Text-fill-stroke.png">
-</p>
-<h2 id=".3Cimage.3E" name=".3Cimage.3E"> &lt;image&gt; </h2>
-<p>&lt;image&gt; no soporta imágenes SVG en Firefox 1.5, sólo los formatos de imagen rasterizados que Firefox maneja.
-</p><p>Todas las instancias de &lt;image&gt; tienen una copia separada de la imagen que está siendo usada, lo cual es algo a tener en cuenta si tu contenido está usando múltiples copias de una imagen para un icono o algo parecido. Desafortunadamente, &lt;use&gt; en contenido &lt;image&gt; cuenta como otra copia en este caso.
-</p><p>De manera adicional, un uso intensivo de imágenes rasterizadas en SVG puede degradar de sobremanera el rendimiento en Firefox 1.5.
-</p>
-<h2 id="Eventos" name="Eventos"> Eventos </h2>
-<p>Soportamos los atributos de SVG para eventos, a excepción de "onfocusin", "onfocusout", y "onactivate".
-</p><p>Nuestro manejo del evento "onload" es actualmente no-estándar, pero creemos que aún así no impide su uso correcto. Mientras que el código especificado por el atributo "onload" será llamado para cada elemento, un evento SVGLoad es llamado únicamente para el elemento &lt;svg&gt; raíz. Algunos métodos DOM devolverán basura o error si son llamados antes de que el elemento correspondiente haya sido renderizado, algo que tendrás que tener en cuenta al escribir código "onload". Dichos métodos son getBBox, getScreenCTM, etc.
-</p><p>No damos soporte a los eventos para el teclado específicos de Adobe ("onkeydown", "onkeyup").
-</p>
-<h2 id="Interoperabilidad" name="Interoperabilidad"> Interoperabilidad </h2>
-<p>Si está trabajando con contenidos SVG actuales, puede encontrar problemas al cargarlos en Firefox. La mayoría de los problemas suelen ser triviales, y son el resultado de una implementación más estricta en Firefox. En <a class="external" href="http://jwatt.org/svg/authoring/">SVG Authoring Guidelines</a> Jonathan Watt's explica los problemas comunes.
-</p>
-<h2 id="Situaciones_del_uso" name="Situaciones_del_uso"> Situaciones del uso </h2>
-<p>Firefox 1.5 maneja SVG como un documento entero, o como referencia para los elementos embed, object, e iframe. Actualmente no puede ser usado como fuente del elemento img, ni para las propiedades CSS relativas a las imágenes.
-</p>
-<h2 id="Animaci.C3.B3n" name="Animaci.C3.B3n"> Animación </h2>
-<p>Firefox 1.5 no implementa la animación declarativa, pero soporta scripting dinámico. Doug Shepers lo ha usado para crear <a class="external" href="http://www.vectoreal.com/smilscript/">SmilScript</a>, una pequeña biblioteca de Javascript que implementa parte de la animación declarativa de SVG.
-</p>
-<h2 id="Elementos.2C_estado_de_la_implementaci.C3.B3n" name="Elementos.2C_estado_de_la_implementaci.C3.B3n"> Elementos, estado de la implementación </h2> <table style="margin: 5px;"> <tbody><tr> <th><b>Elemento</b></th> <th><b>Notas</b></th> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#basic-structure-mod">Módulo Estructura</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SVGElement">svg</a></td> <td> <ul> <li>Implementado. </li><li><code>currentScale</code> and <code>currentTranslate</code> DOM attributes are implemented, but there is no pan and zoom user interface. </li><li>SVGSVGElement <ul> <li> Atributos no implementados: contentScriptType, contentStyleType, viewport, useCurrentView, currentView </li> <li> Bindings no implementados: pauseAnimations, unpauseAnimations, animationsPaused, getCurrentTime, setCurrentTime, getIntersectionList, getEnclosureList, checkIntersection, checkEnclosure, deselectAll, createSVGAngle, getElementById </li> </ul> </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#GElement">g</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DefsElement">defs</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#DescElement">desc</a></td> <td> <ul> <li>Implementado. </li><li>Only stored in the DOM, no user interface.&lt;/td&gt; </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#TitleElement">title</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/metadata.html#MetadataElement">metadata</a></td> <td> <ul> <li>Implementado. </li><li>Only stored in the DOM, no user interface.&lt;/td&gt; </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SymbolElement">symbol</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#UseElement">use</a></td> <td> <ul> <li>Implementado. </li><li>Only works for internal document references (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=269482">bug 269482</a>). </li><li>Doesn't completely follow &lt;svg:use&gt; cascading rules (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265894">bug 265894</a>). </li><li>Doesn't deliver events to a SVGElementInstance tree (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=265895">bug 265895</a>). </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#conditional-mod">Conditional Processing Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#SwitchElement">switch</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#image-mod">Image Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/struct.html#ImageElement">image</a></td> <td> <ul> <li>Implementado. </li><li>Only works for raster images (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=272288">bug 272288</a>). </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#style-mod">Style Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/styling.html#StyleElement">style</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#shape-mod">Shape Module</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/paths.html#PathElement">path</a></td> <td> <ul> <li>Implementado.</li> <li>SVGPathElement Interfaz <ul> <li> Atributos no implementados: pathLength, normalizedPathSegList, animatedPathSegList, animatedNormalizedPathSegList </li> <li> Bindings no implementados: getTotalLength, getPointAtLength, getPathSegAtLength </li> </ul> </li> <li>SVGPathSegList Interface <ul> <li>Bindings no implementados: replaceItem()</li> </ul> </li> </ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#RectElement">rect</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#CircleElement">circle</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#LineElement">line</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#EllipseElement">ellipse</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolylineElement">polyline</a></td> <td> <ul> <li>SImplementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/shapes.html#PolygonElement">polygon</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/text.html#text-mod">Módulo Texto</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextElement">text</a></td> <td> <ul> <li>Implementado. </li><li>SVGTextElement <ul> <li> Atributos no implementados: rotate, textLength, lengthAdjust </li> <li> Bindings no implementados: getNumberOfChars, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString </li> <li> Bindings not functional at <code>onload</code> time: getExtentOfChar </li> </ul> </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TSpanElement">tspan</a></td> <td> <ul> <li>Implementado. </li><li>SVGTSpanElement <ul> <li> Atributos no implementados: rotate, textLength, lengthAdjust </li> <li> bindings no implementados: getNumberOfChars, getComputedTextLength, getSubStringLength, getStartPositionOfChar, getEndPositionOfChar, getExtentOfChar, getRotationOfChar, getCharNumAtPosition, selectSubString </li> </ul> </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TRefElement">tref</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#TextPathElement">textPath</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphElement">altGlyph</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphDefElement">altGlyphDef</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#AltGlyphItemElement">altGlyphItem</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/text.html#GlyphRefElement">glyphRef</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#marker-mod">Módulo Marker</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/painting.html#MarkerElement">marker</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/color.html#color-profile-mod">Módulo Color-Profile</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/color.html#ColorProfileElement">color-profile</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#gradient-mod">Módulo Gradientes</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#LinearGradientElement">linearGradient</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#RadialGradientElement">radialGradient</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#StopElement">stop</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#pattern-mod">Módulo Pattern</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/pservers.html#PatternElement">pattern</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#clip-mod">Módulo Clip</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#ClipPathElement">clipPath</a></td> <td> <ul> <li>Implementado. </li><li>Won't handle clip paths with have elements with different clip-rule properties or that reference other clipPaths. (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=267224">bug 267224</a>). </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#mask-mod">Módulo Mask</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#MaskElement">mask</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#filter-mod">Módulo Filtro</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#FilterElement">filter</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feBlendElement">feBlend</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feColorMatrixElement">feColorMatrix</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feComponentTransferElement">feComponentTransfer</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feCompositeElement">feComposite</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feConvolveMatrixElement">feConvolveMatrix</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDiffuseLightingElement">feDiffuseLighting</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDisplacementMapElement">feDisplacementMap</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFloodElement">feFlood</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feGaussianBlurElement">feGaussianBlur</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feImageElement">feImage</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeElement">feMerge</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMergeNodeElement">feMergeNode</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feMorphologyElement">feMorphology</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feOffsetElement">feOffset</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpecularLightingElement">feSpecularLighting</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTileElement">feTile</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feTurbulenceElement">feTurbulence</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feDistantLightElement">feDistantLight</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#fePointLightElement">fePointLight</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feSpotLightElement">feSpotLight</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncRElement">feFuncR</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncGElement">feFuncG</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncBElement">feFuncB</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/filters.html#feFuncAElement">feFuncA</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#cursor-mod">Módulo Cursor</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/interact.html#CursorElement">cursor</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#hyperlinking-mod">Módulo hiperenlace</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#AElement">a</a></td> <td> <ul> <li>Implementado en un binding XBL - object no es del tipo SVGAElement.</li> <li>Solo están implementados los atributos <code>xlink:href</code> y <code>xlink:show</code> </li> <li>Sobre el atributo <code>target</code> vea <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=300868">bug 300868</a></li> </ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#view-mod">Módulo visión</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/linking.html#ViewElement">view</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/script.html#scripting-mod">Módulo Script</a></th> </tr> <tr style="color: black; background-color: lightgreen;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/script.html#ScriptElement">script</a></td> <td> <ul> <li>Implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#animation-mod">Módulo Animación</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateElement">animate</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#SetElement">set</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateMotionElement">animateMotion</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateTransformElement">animateTransform</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#AnimateColorElement">animateColor</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/animate.html#mpathElement">mpath</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#font-mod">Módulo Fuentes</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceElement">font</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#GlyphElement">glyph</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#MissingGlyphElement">missing-glyph</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#HKernElement">hkern</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#VKernElement">vkern</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceSrcElement">font-face-src</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-uri</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-format</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#FontFaceNameElement">font-face-name</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/fonts.html#DefinitionSrcElement">definition-src</a></td> <td> <ul> <li>No implementado. </li></ul> </td> </tr> <tr> <th colspan="2"><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#extensibility-mod">Módulo Extensibilidad</a></th> </tr> <tr style="color: black; background-color: salmon;"> <td><a class="external" href="http://www.w3.org/TR/SVG11/extend.html#ForeignObjectElement">foreignObject</a></td> <td> <ul> <li>Implementado, but not built. </li></ul> </td> </tr> </tbody></table>
-{{ languages( { "en": "en/SVG_in_Firefox", "fr": "fr/SVG_dans_Firefox", "ja": "ja/SVG_in_Firefox", "pl": "pl/SVG_w_Firefoksie" } ) }}
diff --git a/files/es/web/svg/tutorial/introducción/index.html b/files/es/web/svg/tutorial/introducción/index.html
deleted file mode 100644
index 759ef2dbf9..0000000000
--- a/files/es/web/svg/tutorial/introducción/index.html
+++ /dev/null
@@ -1,45 +0,0 @@
----
-title: Introducción
-slug: Web/SVG/Tutorial/Introducción
-translation_of: Web/SVG/Tutorial/Introduction
----
-<p>{{ PreviousNext("Web/SVG/Tutorial", "Web/SVG/Tutorial/Getting_Started") }}</p>
-
-<p><img alt="Ejemplo de imagenes vectoriales, una cría de leon, una curva con flechas direccionales a intervalos regulares y un texto que sigue una trayectoria ondulada" class="internal" src="/@api/deki/files/348/=SVG_Overview.png" style="float: right;"><a href="/es/docs/Web/SVG" lang="es" title="es/docs/Web/SVG">SVG</a> es un lenguaje <a href="/es/docs/Introducción_a_XML" lang="es" title="es/docs/Introducción_a_XML">XML</a>, parecido a <a href="/es/docs/XHTML" lang="es" title="es/docs/XHTML">XHTML</a>, el cual puede ser usado para dibujar gráficos vectoriales, como los mostrados a la derecha. Puede ser usado para crear una imagen ya sea especificando todas las líneas y formas necesarias, modificando las imágenes matriciales (raster images) o una combinación de ambas. La imagen y sus componentes pueden ser transformados, compuestos o filtrados para cambiar completamente su apariencia.</p>
-
-<p>SVG surgió en 1999 después de que varios formatos compitieran y fueran propuestos a la <a class="external" href="http://www.w3.org" title="en-US/W3C">W3C</a> los cuales fallaron para ser completamente ratificados. SVG es soportado por los principales <a href="https://caniuse.com/#search=svg">navegadores</a>. Un inconveniente es que cargar un SVG puede ser lento. SVG ofrecen beneficios, algunos de los cuales incluyen tener una <a href="/en-US/docs/Web/API">interfaz</a> <a href="/en-US/docs/Web/API">DOM </a>disponible para éste, y no requerir extensiones de terceros. Usarlo o no a menudo dependerá de tu caso específico de uso.</p>
-
-<p> </p>
-
-<p> </p>
-
-<h3 id="Ingredientes_básicos">Ingredientes básicos</h3>
-
-<p><a href="/en-US/docs/Web/HTML">HTML</a>  provee elementos que definen encabezados, párrafos, tablas, etc. En forma muy similar, SVG provee elementos para círculos, rectángulos, y curvas simples y complejas. Un documento SVG simple consiste de nada más que el elemento raíz {{ SVGElement('svg') }} y varias formas básicas que construyen todas juntas un gráfico. En adición está el elemento {{ SVGElement('g') }}, el cual es usado para agrupar varias formas básicas.</p>
-
-<p>Desde este punto, la imagen SVG puede volverse arbitrariamente compleja. SVG soporta gradientes, rotaciones, efectos de filtro, animaciones, interactividad con JavaScript y más. Pero todas esas características adicionales del lenguaje dependen de este conjunto relativamente pequeño de elementos para definir el area de gráficos.</p>
-
-<h3 id="Before_you_start" name="Before_you_start">Antes de empezar</h3>
-
-<p>Existe un número de programas de dibujo disponibles como <a class="external" href="http://www.inkscape.org/">Inkscape</a> los cuales son gratis y usan SVG como su formato nativo. Sin embargo, este tutorial se basará en el confiable XML o editor de texto (a tu criterio). La idea es enseñar el funcionamiento interno de SVG a aquellos que desean comprenderlo, y eso se logra mejor ensuciando tus manos con un poco de maquetado. De todos modos deberías fijarte tus objetivos. No todos los visores de SVG son iguales por lo que es posible que algo escrito para una aplicación no se verá exactamente igual en otra, simplemente porque soportan diferentes niveles de la especificación SVG u otra especificación que estés utilizando junto con SVG (es decir, <a href="/es/JavaScript" lang="es" title="es/JavaScript">JavaScript</a> o <a href="/es/CSS" lang="es" title="es/CSS">CSS</a>).</p>
-
-<p>SVG es soportado en todo navegador moderno e incluso hasta un par de versiones anteriores en algunos casos. Una tabla bastante completa de soporte por navegadores puede verse en <a href="http://caniuse.com/svg">Can I use</a>. Firefox ha soportado algo de contenido SVG desde su versión 1.5 y el nivel de soporte ha ido creciendo con cada versión desde entonces. Con algo de optimismo, junto con este tutorial, MDN puede ayudar a los desarrolladores a estar al tanto de las diferencias entre Gecko y algunas de las otras implementaciones mas importantes.</p>
-
-<p>Antes de empezar deberías tener conceptos básicos de XML u otro lenguaje de maquetado como <abbr title="HyperText Markup Language">HTML</abbr>. Si no estás del todo familiarizado con XML, aquí hay algunas máximas a tener presentes:</p>
-
-<ul>
- <li>Los elementos SVG y sus atributos deben ser escritos en la misma capitalización mostrada ya que XML es sensible a mayúsculas (en contraposición a HTML).</li>
- <li>Los valores de atributos en SVG deben ir entre comillas, incluso si son números.</li>
-</ul>
-
-<p>SVG es una especificación muy extensa. Este instructivo intenta cubrir lo básico. Una vez que te hayas familiarizado deberías ser capaz de usar la <a href="/es/docs/Web/SVG/Element" lang="es" title="es/docs/Web/SVG/Element">Referencia de elementos</a> y la <a href="/es/docs/DOM/DOM_Reference#SVG_interfaces" lang="es" title="es/SVG/Interface">Referencia de interface</a> para encontrar cualquier otra cosa que necesites saber.</p>
-
-<h3 id="SVG_y_sus_sabores">SVG y sus sabores</h3>
-
-<p>Desde que se volvió una recomendación en 2003, la versión "completa" mas reciente de SVG es 1.1. Se edifica sobre SVG 1.0, añadiendo mas modularización para facilitar su implementación. <a href="http://www.w3.org/TR/SVG/" lang="en">La segunda edición de SVG 1.1</a> se volvió una Recomendación en 2011. SVG 1.2 iba a ser la próxima entrega de SVG. Fue descartada en favor de la próxima <a href="http://www.w3.org/TR/SVG2/">SVG 2.0</a>, la cual está siendo desarrollada ahora mismo y sigue un enfoque similar a CSS 3 en que divide componentes en varias especificaciones vagamente relacionadas.</p>
-
-<p>En adición a la recomendación de SVG completo, el grupo de trabajo en W3C introdujo SVG Tiny y SVG Basic en 2003. Estos perfiles apuntan principalmente a dispositivos móviles. El primero, SVG Tiny, debería brindar primitivas de gráficos para dispositivos pequeños con capacidades bajas. SVG Basic ofrece muchas de las prestaciones del SVG completo, pero no incluye aquellas difíciles de implementar o costosas de representar (como animaciones). En 2008, SVG Tiny 1.2 se volvió una Recomendación W3C.</p>
-
-<p>Hubo planes para una especificación SVG Print, la cual habría agregado soporte para páginas múltiples y administración de color mejorada. Esta tarea fue abandonada.</p>
-
-<p>{{ PreviousNext("Web/SVG/Tutorial", "Web/SVG/Tutorial/Getting_Started") }}</p>
diff --git a/files/es/web/svg/tutorial/introduction/index.html b/files/es/web/svg/tutorial/introduction/index.html
new file mode 100644
index 0000000000..a24416d155
--- /dev/null
+++ b/files/es/web/svg/tutorial/introduction/index.html
@@ -0,0 +1,46 @@
+---
+title: Introducción
+slug: Web/SVG/Tutorial/Introduction
+translation_of: Web/SVG/Tutorial/Introduction
+original_slug: Web/SVG/Tutorial/Introducción
+---
+<p>{{ PreviousNext("Web/SVG/Tutorial", "Web/SVG/Tutorial/Getting_Started") }}</p>
+
+<p><img alt="Ejemplo de imagenes vectoriales, una cría de leon, una curva con flechas direccionales a intervalos regulares y un texto que sigue una trayectoria ondulada" class="internal" src="/@api/deki/files/348/=SVG_Overview.png" style="float: right;"><a href="/es/docs/Web/SVG" lang="es" title="es/docs/Web/SVG">SVG</a> es un lenguaje <a href="/es/docs/Introducción_a_XML" lang="es" title="es/docs/Introducción_a_XML">XML</a>, parecido a <a href="/es/docs/XHTML" lang="es" title="es/docs/XHTML">XHTML</a>, el cual puede ser usado para dibujar gráficos vectoriales, como los mostrados a la derecha. Puede ser usado para crear una imagen ya sea especificando todas las líneas y formas necesarias, modificando las imágenes matriciales (raster images) o una combinación de ambas. La imagen y sus componentes pueden ser transformados, compuestos o filtrados para cambiar completamente su apariencia.</p>
+
+<p>SVG surgió en 1999 después de que varios formatos compitieran y fueran propuestos a la <a class="external" href="http://www.w3.org" title="en-US/W3C">W3C</a> los cuales fallaron para ser completamente ratificados. SVG es soportado por los principales <a href="https://caniuse.com/#search=svg">navegadores</a>. Un inconveniente es que cargar un SVG puede ser lento. SVG ofrecen beneficios, algunos de los cuales incluyen tener una <a href="/en-US/docs/Web/API">interfaz</a> <a href="/en-US/docs/Web/API">DOM </a>disponible para éste, y no requerir extensiones de terceros. Usarlo o no a menudo dependerá de tu caso específico de uso.</p>
+
+<p> </p>
+
+<p> </p>
+
+<h3 id="Ingredientes_básicos">Ingredientes básicos</h3>
+
+<p><a href="/en-US/docs/Web/HTML">HTML</a>  provee elementos que definen encabezados, párrafos, tablas, etc. En forma muy similar, SVG provee elementos para círculos, rectángulos, y curvas simples y complejas. Un documento SVG simple consiste de nada más que el elemento raíz {{ SVGElement('svg') }} y varias formas básicas que construyen todas juntas un gráfico. En adición está el elemento {{ SVGElement('g') }}, el cual es usado para agrupar varias formas básicas.</p>
+
+<p>Desde este punto, la imagen SVG puede volverse arbitrariamente compleja. SVG soporta gradientes, rotaciones, efectos de filtro, animaciones, interactividad con JavaScript y más. Pero todas esas características adicionales del lenguaje dependen de este conjunto relativamente pequeño de elementos para definir el area de gráficos.</p>
+
+<h3 id="Before_you_start" name="Before_you_start">Antes de empezar</h3>
+
+<p>Existe un número de programas de dibujo disponibles como <a class="external" href="http://www.inkscape.org/">Inkscape</a> los cuales son gratis y usan SVG como su formato nativo. Sin embargo, este tutorial se basará en el confiable XML o editor de texto (a tu criterio). La idea es enseñar el funcionamiento interno de SVG a aquellos que desean comprenderlo, y eso se logra mejor ensuciando tus manos con un poco de maquetado. De todos modos deberías fijarte tus objetivos. No todos los visores de SVG son iguales por lo que es posible que algo escrito para una aplicación no se verá exactamente igual en otra, simplemente porque soportan diferentes niveles de la especificación SVG u otra especificación que estés utilizando junto con SVG (es decir, <a href="/es/JavaScript" lang="es" title="es/JavaScript">JavaScript</a> o <a href="/es/CSS" lang="es" title="es/CSS">CSS</a>).</p>
+
+<p>SVG es soportado en todo navegador moderno e incluso hasta un par de versiones anteriores en algunos casos. Una tabla bastante completa de soporte por navegadores puede verse en <a href="http://caniuse.com/svg">Can I use</a>. Firefox ha soportado algo de contenido SVG desde su versión 1.5 y el nivel de soporte ha ido creciendo con cada versión desde entonces. Con algo de optimismo, junto con este tutorial, MDN puede ayudar a los desarrolladores a estar al tanto de las diferencias entre Gecko y algunas de las otras implementaciones mas importantes.</p>
+
+<p>Antes de empezar deberías tener conceptos básicos de XML u otro lenguaje de maquetado como <abbr title="HyperText Markup Language">HTML</abbr>. Si no estás del todo familiarizado con XML, aquí hay algunas máximas a tener presentes:</p>
+
+<ul>
+ <li>Los elementos SVG y sus atributos deben ser escritos en la misma capitalización mostrada ya que XML es sensible a mayúsculas (en contraposición a HTML).</li>
+ <li>Los valores de atributos en SVG deben ir entre comillas, incluso si son números.</li>
+</ul>
+
+<p>SVG es una especificación muy extensa. Este instructivo intenta cubrir lo básico. Una vez que te hayas familiarizado deberías ser capaz de usar la <a href="/es/docs/Web/SVG/Element" lang="es" title="es/docs/Web/SVG/Element">Referencia de elementos</a> y la <a href="/es/docs/DOM/DOM_Reference#SVG_interfaces" lang="es" title="es/SVG/Interface">Referencia de interface</a> para encontrar cualquier otra cosa que necesites saber.</p>
+
+<h3 id="SVG_y_sus_sabores">SVG y sus sabores</h3>
+
+<p>Desde que se volvió una recomendación en 2003, la versión "completa" mas reciente de SVG es 1.1. Se edifica sobre SVG 1.0, añadiendo mas modularización para facilitar su implementación. <a href="http://www.w3.org/TR/SVG/" lang="en">La segunda edición de SVG 1.1</a> se volvió una Recomendación en 2011. SVG 1.2 iba a ser la próxima entrega de SVG. Fue descartada en favor de la próxima <a href="http://www.w3.org/TR/SVG2/">SVG 2.0</a>, la cual está siendo desarrollada ahora mismo y sigue un enfoque similar a CSS 3 en que divide componentes en varias especificaciones vagamente relacionadas.</p>
+
+<p>En adición a la recomendación de SVG completo, el grupo de trabajo en W3C introdujo SVG Tiny y SVG Basic en 2003. Estos perfiles apuntan principalmente a dispositivos móviles. El primero, SVG Tiny, debería brindar primitivas de gráficos para dispositivos pequeños con capacidades bajas. SVG Basic ofrece muchas de las prestaciones del SVG completo, pero no incluye aquellas difíciles de implementar o costosas de representar (como animaciones). En 2008, SVG Tiny 1.2 se volvió una Recomendación W3C.</p>
+
+<p>Hubo planes para una especificación SVG Print, la cual habría agregado soporte para páginas múltiples y administración de color mejorada. Esta tarea fue abandonada.</p>
+
+<p>{{ PreviousNext("Web/SVG/Tutorial", "Web/SVG/Tutorial/Getting_Started") }}</p>
diff --git a/files/es/web/tutoriales/index.html b/files/es/web/tutoriales/index.html
deleted file mode 100644
index eabc70de95..0000000000
--- a/files/es/web/tutoriales/index.html
+++ /dev/null
@@ -1,206 +0,0 @@
----
-title: Tutoriales
-slug: Web/Tutoriales
-tags:
-  - Articulo Web
-  - Código
-  - Diseño Web
-  - Guía
-  - Principiante
-  - Programa Web
-  - Tutoriales
-translation_of: Web/Tutorials
----
-<p>Los enlaces de esta página llevan a una gran variedad de tutoriales y material de formación. Tanto si estás en tus comienzos, aprendiendo lo básico, como si eres un veterano en desarrollo web, aquí puedes encontrar recursos que te ayuden a lograr mejores prácticas.</p>
-
-<p>Estos recursos son creados por empresas innovadoras y desarrolladores web que han adoptado los estándares abiertos y las mejores prácticas para el desarrollo web proporcionando o permitiendo traducciones mediante licencias de contenido abierto como Creative Commons.</p>
-
-<table class="topicpage-table">
- <tbody>
-  <tr>
-   <td>
-    <h2 class="Documentation" id="Documentation" name="Documentation">Para principiantes completos de la web</h2>
-
-    <dl>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web">Comenzando con la web</a></dt>
-     <dd><em>Comenzando con la web</em> es una serie introductoria que te presenta los aspectos prácticos del desarrollo web. Podrás configurar las herramientas que necesites para construir una página web sencilla y publicar tu propio código.</dd>
-    </dl>
-
-    <h2 class="Documentation" id="Documentation" name="Documentation">Tutoriales de HTML</h2>
-
-    <h3 id="Nivel_introductorio">Nivel introductorio</h3>
-
-    <dl>
-     <dt><a href="http://docs.webplatform.org/wiki/guides/the_basics_of_html" rel="external">Introducción a HTML</a> (WebPlatform.org)</dt>
-     <dd>Este módulo establece el escenario, haciendo que te sea común el uso de conceptos importantes y sintaxis, buscando cómo aplicar el HTML al texto, cómo crear hiperenlaces y cómo utilizar el HTML para estructurar una página web.</dd>
-     <dt><a href="http://reference.sitepoint.com/html/page-structure" rel="external">Estructura básica de una página web</a> (SitePoint)</dt>
-     <dd>Aprende cómo los elementos HTML encajan juntos con un enfoque más amplio.</dd>
-     <dt><a href="http://reference.sitepoint.com/html/elements" rel="external">Elementos fundamentales de HTML según MDN</a> (SitePoint)</dt>
-     <dd>Es una referencia exhaustiva de los elementos HTML y cómo son soportados por los distintos navegadores.</dd>
-     <dt><a href="http://htmldog.com/guides/htmlbeginner/" rel="external">Tutorial de HTML para principiantes</a> (HTML Dog)</dt>
-     <dd>Tutorial y ejercicios sobre los fundamentos.</dd>
-     <dt><a href="http://wikiversity.org/wiki/Web_Design/HTML_Challenges" rel="external">Retos HTML</a> (Wikiversity)</dt>
-     <dd>Acepta los retos para mejorar tus conocimientos sobre HTML (por ejemplo, "¿Debería usar un elemento &lt;h2&gt; o un elemento &lt;strong&gt;?") y marca las respuestas correctas. </dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/Element">Manual de referencia MDN de elementos HTML</a></dt>
-     <dd>Una amplia referencia de elementos HTML, así como la forma en que Firefox y otros navegadores los soportan.</dd>
-    </dl>
-
-    <h3 id="Nivel_intermedio">Nivel intermedio</h3>
-
-    <dl>
-     <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding">Incrustamiento y multimedia</a></dt>
-     <dd>Este módulo explora cómo usar HTML para incluir multimedia en tus páginas web, incluyendo las diferentes formas en las que pueden incluirse imágenes, y cómo incrustar video, audio o incluso otras páginas web completas.</dd>
-     <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/HTML/Tables">Tablas HTML </a></dt>
-     <dd>Representar datos tabulares en una forma comprensible puede ser un desafío, {{glossary("Accessibility", "accessible")}}. Este módulo cubre el marcado de una tabla básica, junto con características más complejas, como la implementación de epígrafes y resúmenes.</dd>
-    </dl>
-
-    <h3 id="Nivel_avanzado">Nivel avanzado</h3>
-
-    <dl>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/Tips_for_Authoring_Fast-loading_HTML_Pages">Consejos para crear páginas HTML que carguen rápidamente</a></dt>
-     <dd>Optimiza las páginas web para que sean adaptables a los visitantes, reduciendo la carga de tu servidor web y de tu conexión a Internet.</dd>
-     <dt><a href="http://diveintohtml5.info/" rel="external">Sumérgete en HTML5</a> (Mark Pilgrim)</dt>
-     <dd>Aprende de una selección de características de HTML5, la versión más reciente de las especificaciones HTML.</dd>
-     <dt><a href="http://www.html5rocks.com/tutorials/" rel="external">Tutoriales de HTML5</a> (HTML5 Rocks)</dt>
-     <dd>Haz una visita guiada por código que usa las características de HTML5.</dd>
-     <dt><a href="http://www.alistapart.com/articles/semanticsinhtml5/" rel="external">Semántica en HTML5</a> (alistapart.com)</dt>
-     <dd>Aprende marcas con significado, extensibles y compatibles con versiones tanto anteriores como posteriores.</dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/Canvas_tutorial" style="font-weight: bold;">Tutorial sobre Canvas</a></dt>
-     <dd>Aprende cómo dibujar gráficos usando líneas de script y el elemento c<em>anvas</em>.</dd>
-     <dt><a href="http://html5doctor.com/" rel="external">HTML5 Doctor</a></dt>
-     <dd>Artículos sobre cómo usar HTML5 ahora mismo.</dd>
-     <dt><a href="http://www.elated.com/articles/html5-audio/" rel="external">La alegría del audio en HTML5</a> (Elated)</dt>
-     <dd>Aprende a utilizar el elemento audio en HTML para incluir sonidos en tus páginas web de forma sencilla. Hay montones de códigos de ejemplos incluidos en este tutorial.</dd>
-    </dl>
-   </td>
-   <td>
-    <h2 class="Documentation" id="Documentation" name="Documentation">Tutoriales CSS</h2>
-
-    <dl>
-    </dl>
-   </td>
-  </tr>
-  <tr>
-   <td>
-    <h3 id="Nivel_introductorio_2">Nivel introductorio</h3>
-
-    <dl>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/CSS/Getting_Started">Lo básico en CSS</a></dt>
-     <dd>Este tutorial te introduce en las hojas de estilo (<em>Cascading Style Sheets</em> o <em>CSS</em>). Además, te guiará a través de las características básicas de CCS con ejemplos prácticos que podrás probar por ti mismo en tu propio computador.</dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS">Introducción a CSS</a></dt>
-     <dd>Este módulo profundiza en el funcionamiento de CSS, incluidos selectores y propiedades, redacción de reglas CSS, aplicación de CSS a HTML, cómo especificar longitud, color y otras unidades en CSS; cascada y herencia; conceptos básicos de caja y depuración de CSS.</dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_boxes">Estilizando cajas</a></dt>
-     <dd>A continuación analizamos las cajas de diseño, uno de los pasos fundamentales para diseñar una página web. En este módulo recapitulamos el modelo de caja y luego observamos los diseños de caja de control estableciendo relleno, bordes y márgenes, estableciendo colores de fondo personalizados, imágenes y otras características, y características extravagantes como sombras y filtros en cajas.</dd>
-     <dt><a href="http://en.wikiversity.org/wiki/Web_Design/External_CSS">Hojas externas de CSS</a> (Wikiversity)</dt>
-     <dd>Aquí aprenderás cómo usar CSS en el HTML desde una hoja de estilo externa (en inglés).</dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text">Texto con estilo</a></dt>
-     <dd>En esta sección repasaremos los fundamentos del estilo de texto, que incluyen la configuración de fuente, negrita e itálicas, el espaciado de líneas y letras, sombras paralelas y otras características de texto. Completaremos el módulo observando la aplicación de fuentes personalizadas en tú página y el diseño de listas y enlaces.</dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Howto/CSS_FAQ">Preguntas frecuentes sobre CSS</a></dt>
-     <dd>Preguntas y respuestas frecuentes para principiantes.</dd>
-    </dl>
-
-    <h3 id="Nivel_Intermedio">Nivel Intermedio</h3>
-
-    <dl>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/CSS/CSS_Reference">Referencia CSS </a></dt>
-     <dd>Referencia completa para CCS con ayuda detallada por Firefox y otros navegadores.</dd>
-     <dt><a href="http://en.wikiversity.org/wiki/Web_Design/CSS_challenges" rel="external">Desafíos CSS </a> (Wikiversity)</dt>
-     <dd>Reta tus habilidades en CCS, con lo que podrás descubrir aquello que necesita mejorar.</dd>
-     <dt><a href="http://www.html.net/tutorials/css/" rel="external">Conceptos intermedios CSS</a> (HTML.net)</dt>
-     <dd>Agrupación, pseudo-clases y mucho más.</dd>
-     <dt><a href="http://www.alistapart.com/articles/css-positioning-101/" rel="external">Posicionamiento 101 CSS </a> (alistapart.com)</dt>
-     <dd>Usando posicionamiento con estándares complacientes y tablas de libre disposición.</dd>
-     <dt><a href="http://www.alistapart.com/articles/progressiveenhancementwithcss/" rel="external">Mejora progresivamente con CSS</a> (alistapart.com)</dt>
-     <dd>Intégrate mejorando progresivamente tus páginas web con CCS.</dd>
-     <dt><a href="http://www.alistapart.com/articles/fluidgrids/" rel="external">Cuadrícula fluida</a> (alistapart.com)</dt>
-     <dd>Diseño layouts que redimensiona fluidamente con la ventana del navegador, mientras sigue utilizando una cuadrícula tipográfica. </dd>
-    </dl>
-   </td>
-   <td>
-    <h3 id="Nivel_avanzado_2">Nivel avanzado</h3>
-
-    <dl>
-     <dt><a href="http://addyosmani.com/blog/css3-screencast/" rel="external">CSS3 en menos de 5 minutos</a> (Addy Osmani)</dt>
-     <dd>Una rápida introducción a algunas de las características fundamentales introducidas en CSS3.</dd>
-     <dt><a href="https://developer.mozilla.org/es/docs/CSS/Using_CSS_transforms">Usando las Transformaciones CSS</a></dt>
-     <dd>Aplica rotación, inclinando escalando y traduce usando CCS.</dd>
-     <dt><a href="/es/docs/CSS/Transiciones_de_CSS">Transiciones CSS</a></dt>
-     <dd>CSS transiciones, parte del proyecto de la especificación CSS3, proporciona un modo para animar los cambios en las propiedades CSS, en lugar de que los cambios surtan efecto al instante.</dd>
-     <dt><a href="http://www.alistapart.com/articles/understanding-css3-transitions/" rel="external">Entendiendo las Transiciones CSS3</a> (alistapart.com)</dt>
-     <dd>Comienza usando CSS3 por transiciones eligiendo cuidadosamente las situaciones  para utilizarlos.</dd>
-     <dt><a href="http://www.html5rocks.com/tutorials/webfonts/quick/" rel="external">Guia rápida para implementar Web Fonts con @font-face</a> (HTML5 Rocks)</dt>
-     <dd>La función @font-face de CSS3 te permite utilizar tipografías personalizadas en la web de una forma accesible, manipulable y adaptable.</dd>
-     <dt><a href="/es/docs/CSS/Media_queries">Usando Media Queries</a></dt>
-     <dd>Como realizar páginas web multiscreen con el uso de CSS y su propiedad @media.</dd>
-     <dt><a href="/es/docs/Web/Guide/CSS/Cajas_flexibles">Modelo de cajas con Flexbox</a></dt>
-     <dd>Permite distribuir el contenido de la web de forma sencilla y adaptable.</dd>
-    </dl>
-   </td>
-  </tr>
-  <tr>
-   <td></td>
-   <td>
-    <h2 class="Documentation" id="Documentation" name="Documentation">Tutoriales de JavaScript</h2>
-
-    <h3 id="Nivel_introductorio_3">Nivel introductorio</h3>
-
-    <dl>
-     <dt><a href="http://www.codecademy.com/">Codecademy</a> (Codecademy)</dt>
-     <dd>Codecademy es la forma más fácil de aprender a programar en JavaScript. Es interactivo, divertido y puedes compartir o hacer código con tus amigos.</dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Getting_Started">Comenzar con JavaScript</a></dt>
-     <dd>¿Qué es JavaScript y cómo puede ayudarte en el desarrollo web?</dd>
-     <dt><a href="http://docs.webplatform.org/wiki/concepts/programming/programming_basics" rel="external">Programar – Los fundamentos</a> (WebPlatform.org)</dt>
-     <dd>Fundamentos de programación. Los artículos te indican lo que puedes hacer con JavaScript, las mejores prácticas para utilizarlo y mucho más.</dd>
-     <dt><a href="http://dev.opera.com/articles/view/javascript-best-practices/" rel="external">Las mejores prácticas en JavaScript</a><a href="http://docs.webplatform.org/wiki/tutorials/javascript_best_practices" title="http://docs.webplatform.org/wiki/tutorials/javascript_best_practices"> </a>(WebPlatform.org)</dt>
-     <dd>Aprende algunas de las más evidentes (y no tan evidentes) mejores prácticas cuando escribes en JavaScript.</dd>
-    </dl>
-
-    <h3 id="Nivel_intermedio_2">Nivel intermedio</h3>
-
-    <dl>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/A_re-introduction_to_JavaScript">Una reintroducción a JavaScript</a></dt>
-     <dd>Resumen del lenguaje de programación JavaScript enfocado a desarrolladores de nivel intermedio.</dd>
-     <dt><a href="http://eloquentjavascript.net/contents.html" rel="external">JavaScript fluído</a></dt>
-     <dd>Una guía completa para metodologías JavaScript intermedias y avanzadas.</dd>
-     <dt><a href="http://www.addyosmani.com/resources/essentialjsdesignpatterns/book/" rel="external">Fundamentos de patrones de diseño en JavaScript</a> (Addy Osmani)</dt>
-     <dd>Una introducción a las bases del diseño de patrones en JavaScript.</dd>
-     <dt><a href="http://www.yuiblog.com/blog/2007/01/24/video-crockford-tjpl/" rel="external">El lenguaje de programación JavaScript</a> (YUI Blog)</dt>
-     <dd>Douglas Crockford explora el lenguaje tal y como es hoy en día y cómo llegó a ser así.</dd>
-     <dt><a href="https://developer.mozilla.org/es/docs/Introducci%C3%B3n_a_JavaScript_orientado_a_objetos?redirectlocale=en-US&amp;redirectslug=JavaScript%2FIntroduction_to_Object-Oriented_JavaScript">Introducción a JavaScript Orientado a Objetos</a></dt>
-     <dd>Aprende sobre el modelo de objetos en JavaScript.</dd>
-    </dl>
-
-    <h3 id="Nivel_avanzado_3">Nivel avanzado</h3>
-
-    <dl>
-     <dt><a href="http://ejohn.org/apps/learn/" rel="external">Aprender JavaScript avanzado</a> (John Resig)</dt>
-     <dd>La guía de John Resig para JavaScript avanzado.</dd>
-     <dt><a href="http://www.elated.com/articles/javascript-dom-intro/" rel="external">Introducción a DOM en JavaScript</a> (Elated)</dt>
-     <dd>¿Qué es el Modelo de Objeto de Documento (<em>Document Object Model</em>) y para qué es útil? Este artículo te dará una buena introducción a esta característica de JavaScript.</dd>
-     <dt><a href="http://yuiblog.com/blog/2006/10/20/video-crockford-domtheory/" rel="external">Una API inconveniente: la teoría de DOM</a> (YUI Blog)</dt>
-     <dd>Douglas Crockford explica el Modelo de Objeto de Documento (<em>Document Object Model</em>).</dd>
-     <dt><a href="http://yuiblog.com/blog/2006/11/27/video-crockford-advjs/" rel="external">JavaScript avanzado</a> (YUI Blog)</dt>
-     <dd>Douglas Crockford estudia con detenimiento los patrones de código con los que los programadores de JavaScript pueden elegir al escribir sus aplicaciones.</dd>
-     <dt><a href="http://bonsaiden.github.com/JavaScript-Garden/" rel="external">JavaScript Garden</a></dt>
-     <dd>Documentación sobre las partes más extravagantes de JavaScript.</dd>
-     <dt><a href="http://www.maestrosdelweb.com/editorial/comparacion-frameworks-javascript/" rel="external">¿Qué framework de JavaScript?</a> (Maestrosdelweb)</dt>
-     <dd>Consejos para escoger un framework de JavaScript.</dd>
-     <dt><a href="http://yuiblog.com/blog/2008/07/22/non-blocking-scripts/">Carga de JavaScript sin bloqueos</a> (YUI Blog)</dt>
-     <dd>Consejos para mejorar el rendimiento de bajada de páginas que contienen JavaScript.</dd>
-     <dt><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Guide">Guía de JavaScript</a></dt>
-     <dd>Una guía de JavaScript completa y actualizada frecuentemente para todos los niveles de aprendizaje, desde principiante hasta avanzado.</dd>
-    </dl>
-   </td>
-  </tr>
-  <tr>
-   <td>
-    <h3 id="Desarrollo_de_extensiones">Desarrollo de extensiones</h3>
-   </td>
-   <td>
-    <p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><strong><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions">Extensiones web</a></strong><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span></p>
-
-    <p>Extensiones Web es un sistema de navegación cruzada para desarrollar complementos del buscador. El sistema es en gran medida compatible con la <a href="https://developer.chrome.com/extensions">API (Interfaz de Programación de Aplicaciones) </a>respaldada por Google Chrome y Opera. En la mayoría de los casos, las extensiones escritas para estos buscadores pueden funcionar en Firefox o Microsoft Edge con <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension">solo algunos cambios</a>. La API es compatible también con el <a href="https://developer.mozilla.org/en-US/Firefox/Multiprocess_Firefox">multiprocesador de Firefox</a>.</p>
-   </td>
-  </tr>
- </tbody>
-</table>
diff --git a/files/es/web/tutorials/index.html b/files/es/web/tutorials/index.html
new file mode 100644
index 0000000000..fac9d9bf3e
--- /dev/null
+++ b/files/es/web/tutorials/index.html
@@ -0,0 +1,207 @@
+---
+title: Tutoriales
+slug: Web/Tutorials
+tags:
+  - Articulo Web
+  - Código
+  - Diseño Web
+  - Guía
+  - Principiante
+  - Programa Web
+  - Tutoriales
+translation_of: Web/Tutorials
+original_slug: Web/Tutoriales
+---
+<p>Los enlaces de esta página llevan a una gran variedad de tutoriales y material de formación. Tanto si estás en tus comienzos, aprendiendo lo básico, como si eres un veterano en desarrollo web, aquí puedes encontrar recursos que te ayuden a lograr mejores prácticas.</p>
+
+<p>Estos recursos son creados por empresas innovadoras y desarrolladores web que han adoptado los estándares abiertos y las mejores prácticas para el desarrollo web proporcionando o permitiendo traducciones mediante licencias de contenido abierto como Creative Commons.</p>
+
+<table class="topicpage-table">
+ <tbody>
+  <tr>
+   <td>
+    <h2 class="Documentation" id="Documentation" name="Documentation">Para principiantes completos de la web</h2>
+
+    <dl>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web">Comenzando con la web</a></dt>
+     <dd><em>Comenzando con la web</em> es una serie introductoria que te presenta los aspectos prácticos del desarrollo web. Podrás configurar las herramientas que necesites para construir una página web sencilla y publicar tu propio código.</dd>
+    </dl>
+
+    <h2 class="Documentation" id="Documentation" name="Documentation">Tutoriales de HTML</h2>
+
+    <h3 id="Nivel_introductorio">Nivel introductorio</h3>
+
+    <dl>
+     <dt><a href="http://docs.webplatform.org/wiki/guides/the_basics_of_html" rel="external">Introducción a HTML</a> (WebPlatform.org)</dt>
+     <dd>Este módulo establece el escenario, haciendo que te sea común el uso de conceptos importantes y sintaxis, buscando cómo aplicar el HTML al texto, cómo crear hiperenlaces y cómo utilizar el HTML para estructurar una página web.</dd>
+     <dt><a href="http://reference.sitepoint.com/html/page-structure" rel="external">Estructura básica de una página web</a> (SitePoint)</dt>
+     <dd>Aprende cómo los elementos HTML encajan juntos con un enfoque más amplio.</dd>
+     <dt><a href="http://reference.sitepoint.com/html/elements" rel="external">Elementos fundamentales de HTML según MDN</a> (SitePoint)</dt>
+     <dd>Es una referencia exhaustiva de los elementos HTML y cómo son soportados por los distintos navegadores.</dd>
+     <dt><a href="http://htmldog.com/guides/htmlbeginner/" rel="external">Tutorial de HTML para principiantes</a> (HTML Dog)</dt>
+     <dd>Tutorial y ejercicios sobre los fundamentos.</dd>
+     <dt><a href="http://wikiversity.org/wiki/Web_Design/HTML_Challenges" rel="external">Retos HTML</a> (Wikiversity)</dt>
+     <dd>Acepta los retos para mejorar tus conocimientos sobre HTML (por ejemplo, "¿Debería usar un elemento &lt;h2&gt; o un elemento &lt;strong&gt;?") y marca las respuestas correctas. </dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/HTML/Element">Manual de referencia MDN de elementos HTML</a></dt>
+     <dd>Una amplia referencia de elementos HTML, así como la forma en que Firefox y otros navegadores los soportan.</dd>
+    </dl>
+
+    <h3 id="Nivel_intermedio">Nivel intermedio</h3>
+
+    <dl>
+     <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding">Incrustamiento y multimedia</a></dt>
+     <dd>Este módulo explora cómo usar HTML para incluir multimedia en tus páginas web, incluyendo las diferentes formas en las que pueden incluirse imágenes, y cómo incrustar video, audio o incluso otras páginas web completas.</dd>
+     <dt><a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/HTML/Tables">Tablas HTML </a></dt>
+     <dd>Representar datos tabulares en una forma comprensible puede ser un desafío, {{glossary("Accessibility", "accessible")}}. Este módulo cubre el marcado de una tabla básica, junto con características más complejas, como la implementación de epígrafes y resúmenes.</dd>
+    </dl>
+
+    <h3 id="Nivel_avanzado">Nivel avanzado</h3>
+
+    <dl>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/Tips_for_Authoring_Fast-loading_HTML_Pages">Consejos para crear páginas HTML que carguen rápidamente</a></dt>
+     <dd>Optimiza las páginas web para que sean adaptables a los visitantes, reduciendo la carga de tu servidor web y de tu conexión a Internet.</dd>
+     <dt><a href="http://diveintohtml5.info/" rel="external">Sumérgete en HTML5</a> (Mark Pilgrim)</dt>
+     <dd>Aprende de una selección de características de HTML5, la versión más reciente de las especificaciones HTML.</dd>
+     <dt><a href="http://www.html5rocks.com/tutorials/" rel="external">Tutoriales de HTML5</a> (HTML5 Rocks)</dt>
+     <dd>Haz una visita guiada por código que usa las características de HTML5.</dd>
+     <dt><a href="http://www.alistapart.com/articles/semanticsinhtml5/" rel="external">Semántica en HTML5</a> (alistapart.com)</dt>
+     <dd>Aprende marcas con significado, extensibles y compatibles con versiones tanto anteriores como posteriores.</dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/Canvas_tutorial" style="font-weight: bold;">Tutorial sobre Canvas</a></dt>
+     <dd>Aprende cómo dibujar gráficos usando líneas de script y el elemento c<em>anvas</em>.</dd>
+     <dt><a href="http://html5doctor.com/" rel="external">HTML5 Doctor</a></dt>
+     <dd>Artículos sobre cómo usar HTML5 ahora mismo.</dd>
+     <dt><a href="http://www.elated.com/articles/html5-audio/" rel="external">La alegría del audio en HTML5</a> (Elated)</dt>
+     <dd>Aprende a utilizar el elemento audio en HTML para incluir sonidos en tus páginas web de forma sencilla. Hay montones de códigos de ejemplos incluidos en este tutorial.</dd>
+    </dl>
+   </td>
+   <td>
+    <h2 class="Documentation" id="Documentation" name="Documentation">Tutoriales CSS</h2>
+
+    <dl>
+    </dl>
+   </td>
+  </tr>
+  <tr>
+   <td>
+    <h3 id="Nivel_introductorio_2">Nivel introductorio</h3>
+
+    <dl>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/CSS/Getting_Started">Lo básico en CSS</a></dt>
+     <dd>Este tutorial te introduce en las hojas de estilo (<em>Cascading Style Sheets</em> o <em>CSS</em>). Además, te guiará a través de las características básicas de CCS con ejemplos prácticos que podrás probar por ti mismo en tu propio computador.</dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS">Introducción a CSS</a></dt>
+     <dd>Este módulo profundiza en el funcionamiento de CSS, incluidos selectores y propiedades, redacción de reglas CSS, aplicación de CSS a HTML, cómo especificar longitud, color y otras unidades en CSS; cascada y herencia; conceptos básicos de caja y depuración de CSS.</dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_boxes">Estilizando cajas</a></dt>
+     <dd>A continuación analizamos las cajas de diseño, uno de los pasos fundamentales para diseñar una página web. En este módulo recapitulamos el modelo de caja y luego observamos los diseños de caja de control estableciendo relleno, bordes y márgenes, estableciendo colores de fondo personalizados, imágenes y otras características, y características extravagantes como sombras y filtros en cajas.</dd>
+     <dt><a href="http://en.wikiversity.org/wiki/Web_Design/External_CSS">Hojas externas de CSS</a> (Wikiversity)</dt>
+     <dd>Aquí aprenderás cómo usar CSS en el HTML desde una hoja de estilo externa (en inglés).</dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text">Texto con estilo</a></dt>
+     <dd>En esta sección repasaremos los fundamentos del estilo de texto, que incluyen la configuración de fuente, negrita e itálicas, el espaciado de líneas y letras, sombras paralelas y otras características de texto. Completaremos el módulo observando la aplicación de fuentes personalizadas en tú página y el diseño de listas y enlaces.</dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/Learn/CSS/Howto/CSS_FAQ">Preguntas frecuentes sobre CSS</a></dt>
+     <dd>Preguntas y respuestas frecuentes para principiantes.</dd>
+    </dl>
+
+    <h3 id="Nivel_Intermedio">Nivel Intermedio</h3>
+
+    <dl>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/CSS/CSS_Reference">Referencia CSS </a></dt>
+     <dd>Referencia completa para CCS con ayuda detallada por Firefox y otros navegadores.</dd>
+     <dt><a href="http://en.wikiversity.org/wiki/Web_Design/CSS_challenges" rel="external">Desafíos CSS </a> (Wikiversity)</dt>
+     <dd>Reta tus habilidades en CCS, con lo que podrás descubrir aquello que necesita mejorar.</dd>
+     <dt><a href="http://www.html.net/tutorials/css/" rel="external">Conceptos intermedios CSS</a> (HTML.net)</dt>
+     <dd>Agrupación, pseudo-clases y mucho más.</dd>
+     <dt><a href="http://www.alistapart.com/articles/css-positioning-101/" rel="external">Posicionamiento 101 CSS </a> (alistapart.com)</dt>
+     <dd>Usando posicionamiento con estándares complacientes y tablas de libre disposición.</dd>
+     <dt><a href="http://www.alistapart.com/articles/progressiveenhancementwithcss/" rel="external">Mejora progresivamente con CSS</a> (alistapart.com)</dt>
+     <dd>Intégrate mejorando progresivamente tus páginas web con CCS.</dd>
+     <dt><a href="http://www.alistapart.com/articles/fluidgrids/" rel="external">Cuadrícula fluida</a> (alistapart.com)</dt>
+     <dd>Diseño layouts que redimensiona fluidamente con la ventana del navegador, mientras sigue utilizando una cuadrícula tipográfica. </dd>
+    </dl>
+   </td>
+   <td>
+    <h3 id="Nivel_avanzado_2">Nivel avanzado</h3>
+
+    <dl>
+     <dt><a href="http://addyosmani.com/blog/css3-screencast/" rel="external">CSS3 en menos de 5 minutos</a> (Addy Osmani)</dt>
+     <dd>Una rápida introducción a algunas de las características fundamentales introducidas en CSS3.</dd>
+     <dt><a href="https://developer.mozilla.org/es/docs/CSS/Using_CSS_transforms">Usando las Transformaciones CSS</a></dt>
+     <dd>Aplica rotación, inclinando escalando y traduce usando CCS.</dd>
+     <dt><a href="/es/docs/CSS/Transiciones_de_CSS">Transiciones CSS</a></dt>
+     <dd>CSS transiciones, parte del proyecto de la especificación CSS3, proporciona un modo para animar los cambios en las propiedades CSS, en lugar de que los cambios surtan efecto al instante.</dd>
+     <dt><a href="http://www.alistapart.com/articles/understanding-css3-transitions/" rel="external">Entendiendo las Transiciones CSS3</a> (alistapart.com)</dt>
+     <dd>Comienza usando CSS3 por transiciones eligiendo cuidadosamente las situaciones  para utilizarlos.</dd>
+     <dt><a href="http://www.html5rocks.com/tutorials/webfonts/quick/" rel="external">Guia rápida para implementar Web Fonts con @font-face</a> (HTML5 Rocks)</dt>
+     <dd>La función @font-face de CSS3 te permite utilizar tipografías personalizadas en la web de una forma accesible, manipulable y adaptable.</dd>
+     <dt><a href="/es/docs/CSS/Media_queries">Usando Media Queries</a></dt>
+     <dd>Como realizar páginas web multiscreen con el uso de CSS y su propiedad @media.</dd>
+     <dt><a href="/es/docs/Web/Guide/CSS/Cajas_flexibles">Modelo de cajas con Flexbox</a></dt>
+     <dd>Permite distribuir el contenido de la web de forma sencilla y adaptable.</dd>
+    </dl>
+   </td>
+  </tr>
+  <tr>
+   <td></td>
+   <td>
+    <h2 class="Documentation" id="Documentation" name="Documentation">Tutoriales de JavaScript</h2>
+
+    <h3 id="Nivel_introductorio_3">Nivel introductorio</h3>
+
+    <dl>
+     <dt><a href="http://www.codecademy.com/">Codecademy</a> (Codecademy)</dt>
+     <dd>Codecademy es la forma más fácil de aprender a programar en JavaScript. Es interactivo, divertido y puedes compartir o hacer código con tus amigos.</dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Getting_Started">Comenzar con JavaScript</a></dt>
+     <dd>¿Qué es JavaScript y cómo puede ayudarte en el desarrollo web?</dd>
+     <dt><a href="http://docs.webplatform.org/wiki/concepts/programming/programming_basics" rel="external">Programar – Los fundamentos</a> (WebPlatform.org)</dt>
+     <dd>Fundamentos de programación. Los artículos te indican lo que puedes hacer con JavaScript, las mejores prácticas para utilizarlo y mucho más.</dd>
+     <dt><a href="http://dev.opera.com/articles/view/javascript-best-practices/" rel="external">Las mejores prácticas en JavaScript</a><a href="http://docs.webplatform.org/wiki/tutorials/javascript_best_practices" title="http://docs.webplatform.org/wiki/tutorials/javascript_best_practices"> </a>(WebPlatform.org)</dt>
+     <dd>Aprende algunas de las más evidentes (y no tan evidentes) mejores prácticas cuando escribes en JavaScript.</dd>
+    </dl>
+
+    <h3 id="Nivel_intermedio_2">Nivel intermedio</h3>
+
+    <dl>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/A_re-introduction_to_JavaScript">Una reintroducción a JavaScript</a></dt>
+     <dd>Resumen del lenguaje de programación JavaScript enfocado a desarrolladores de nivel intermedio.</dd>
+     <dt><a href="http://eloquentjavascript.net/contents.html" rel="external">JavaScript fluído</a></dt>
+     <dd>Una guía completa para metodologías JavaScript intermedias y avanzadas.</dd>
+     <dt><a href="http://www.addyosmani.com/resources/essentialjsdesignpatterns/book/" rel="external">Fundamentos de patrones de diseño en JavaScript</a> (Addy Osmani)</dt>
+     <dd>Una introducción a las bases del diseño de patrones en JavaScript.</dd>
+     <dt><a href="http://www.yuiblog.com/blog/2007/01/24/video-crockford-tjpl/" rel="external">El lenguaje de programación JavaScript</a> (YUI Blog)</dt>
+     <dd>Douglas Crockford explora el lenguaje tal y como es hoy en día y cómo llegó a ser así.</dd>
+     <dt><a href="https://developer.mozilla.org/es/docs/Introducci%C3%B3n_a_JavaScript_orientado_a_objetos?redirectlocale=en-US&amp;redirectslug=JavaScript%2FIntroduction_to_Object-Oriented_JavaScript">Introducción a JavaScript Orientado a Objetos</a></dt>
+     <dd>Aprende sobre el modelo de objetos en JavaScript.</dd>
+    </dl>
+
+    <h3 id="Nivel_avanzado_3">Nivel avanzado</h3>
+
+    <dl>
+     <dt><a href="http://ejohn.org/apps/learn/" rel="external">Aprender JavaScript avanzado</a> (John Resig)</dt>
+     <dd>La guía de John Resig para JavaScript avanzado.</dd>
+     <dt><a href="http://www.elated.com/articles/javascript-dom-intro/" rel="external">Introducción a DOM en JavaScript</a> (Elated)</dt>
+     <dd>¿Qué es el Modelo de Objeto de Documento (<em>Document Object Model</em>) y para qué es útil? Este artículo te dará una buena introducción a esta característica de JavaScript.</dd>
+     <dt><a href="http://yuiblog.com/blog/2006/10/20/video-crockford-domtheory/" rel="external">Una API inconveniente: la teoría de DOM</a> (YUI Blog)</dt>
+     <dd>Douglas Crockford explica el Modelo de Objeto de Documento (<em>Document Object Model</em>).</dd>
+     <dt><a href="http://yuiblog.com/blog/2006/11/27/video-crockford-advjs/" rel="external">JavaScript avanzado</a> (YUI Blog)</dt>
+     <dd>Douglas Crockford estudia con detenimiento los patrones de código con los que los programadores de JavaScript pueden elegir al escribir sus aplicaciones.</dd>
+     <dt><a href="http://bonsaiden.github.com/JavaScript-Garden/" rel="external">JavaScript Garden</a></dt>
+     <dd>Documentación sobre las partes más extravagantes de JavaScript.</dd>
+     <dt><a href="http://www.maestrosdelweb.com/editorial/comparacion-frameworks-javascript/" rel="external">¿Qué framework de JavaScript?</a> (Maestrosdelweb)</dt>
+     <dd>Consejos para escoger un framework de JavaScript.</dd>
+     <dt><a href="http://yuiblog.com/blog/2008/07/22/non-blocking-scripts/">Carga de JavaScript sin bloqueos</a> (YUI Blog)</dt>
+     <dd>Consejos para mejorar el rendimiento de bajada de páginas que contienen JavaScript.</dd>
+     <dt><a href="https://developer.mozilla.org/en-US/docs/JavaScript/Guide">Guía de JavaScript</a></dt>
+     <dd>Una guía de JavaScript completa y actualizada frecuentemente para todos los niveles de aprendizaje, desde principiante hasta avanzado.</dd>
+    </dl>
+   </td>
+  </tr>
+  <tr>
+   <td>
+    <h3 id="Desarrollo_de_extensiones">Desarrollo de extensiones</h3>
+   </td>
+   <td>
+    <p><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><strong><a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions">Extensiones web</a></strong><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span><span style="display: none;"> </span></p>
+
+    <p>Extensiones Web es un sistema de navegación cruzada para desarrollar complementos del buscador. El sistema es en gran medida compatible con la <a href="https://developer.chrome.com/extensions">API (Interfaz de Programación de Aplicaciones) </a>respaldada por Google Chrome y Opera. En la mayoría de los casos, las extensiones escritas para estos buscadores pueden funcionar en Firefox o Microsoft Edge con <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension">solo algunos cambios</a>. La API es compatible también con el <a href="https://developer.mozilla.org/en-US/Firefox/Multiprocess_Firefox">multiprocesador de Firefox</a>.</p>
+   </td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/es/web/web_components/custom_elements/index.html b/files/es/web/web_components/custom_elements/index.html
deleted file mode 100644
index 98c3562a7b..0000000000
--- a/files/es/web/web_components/custom_elements/index.html
+++ /dev/null
@@ -1,182 +0,0 @@
----
-title: Custom Elements
-slug: Web/Web_Components/Custom_Elements
-tags:
-  - Componentes Web
-  - Web Components
-  - custom elements
-translation_of: Web/Web_Components/Using_custom_elements
-translation_of_original: Web/Web_Components/Custom_Elements
----
-<p>Los <em>Custom Elements </em>son una característica que permite crear tus propios <a href="https://developer.mozilla.org/en-US/docs/Glossary/Element">elementos</a> HTML personalizados. Pueden tener un comportamiento personalizado y estilos CSS propios. Son una parte de los <a href="https://developer.mozilla.org/en-US/docs/Web/Web_Components">Web Components</a>, pero también pueden ser utilizados independientemente.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Los <em>Custom elements</em> sólo se han estabilizado recientemente, y partes de MDN todavía contienen información desactualizada de las APIs de los antiguos borradores de la especificación.</p>
-</div>
-
-<p>Puede no estar claro por qué se creó la nueva capacidad de elementos personalizados, ya que ya era posible crear una etiqueta como <code>&lt;mytag&gt;</code> y aplicarle estilo con CSS, luego utilizar scripts para darle comportamiento. Una ventaja que tienen los <em>custom elements</em> son las reacciones de ciclo de vida (<em>lifecycle reactions)</em>, que permiten asociar comportamiento a diferentes partes del nuevo "ciclo de vida" del elemento. Por ejemplo, se puede asociar un comportamiento concreto cuando un nuevo elemento se inserta en el DOM ("conectado"), y otro distinto cuando es eliminado del DOM ("desconectado"), o cuando sus atributos cambien.</p>
-
-<p>El habilitador de claves de los elementos personalizados v1 es el método {{domxref("CustomElementRegistry.define()")}}, el cual se puede utilizar para definir un nuevo elemento personalizado. El nuevo elemento utilizará la clase suministrada para cualquier instancia, en lugar del valor predeterminado  {{domxref("HTMLUnknownElement")}}.  Los elementos personalizados pueden basarse en un elemento nativo como <code>&lt;button&gt;</code>,  utilizando la sintaxis  <code>&lt;button is="my-button"&gt;</code>;  estos se llaman <em>elementos integrados personalizados.</em></p>
-
-<h2 id="Métodos_de_custom_element">Métodos de <em>custom element</em></h2>
-
-<p>Los <em>Custom elements</em> tienen los siguientes métodos que dictan su comportamiento:</p>
-
-<dl>
- <dt>constructor()</dt>
- <dd>Llamado cuando el elemento es creado o actualizado</dd>
- <dt>connectedCallback()</dt>
- <dd>Llamado cuando el elemento se es insertado en el documento, incluyéndose en un árbol shadow</dd>
- <dt>disconnectedCallback()</dt>
- <dd>Llamado cuando el elemento es eliminado de un documento</dd>
- <dt>attributeChangedCallback(nombreDelAtributo, antiguoValor, nuevoValor, dominio)</dt>
- <dd>Llamado cuando un atributo es cambiado, concatenado, eliminado o reemplazado en el elemento. Sólo llamado sobre <a href="#Atributos_Observados">atributos observados</a>.</dd>
- <dt>adoptedCallback(antiguoDocumento, nuevoDocumento)</dt>
- <dd>Llamado cuando un elemento es adoptado en otro nuevo documento</dd>
-</dl>
-
-<h2 id="Ejemplo">Ejemplo</h2>
-
-<p>Los <em>custom elements</em> necesitan usar la <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes">sintaxis de clase</a> introducida en las versiones modernas de JavaScript.</p>
-
-<p>Archivo HTML:</p>
-
-<pre class="brush: html">Si no aparece nada debajo, es que tu navegador no soporta aún los Custom Elements.
-&lt;x-product data-name="Ruby" data-img="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4621/ruby.png" data-url="http://example.com/1"&gt;&lt;/x-product&gt;
-&lt;x-product data-name="JavaScript" data-img="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4621/javascript.png" data-url="http://example.com/2"&gt;&lt;/x-product&gt;
-&lt;x-product data-name="Python" data-img="https://s3-us-west-2.amazonaws.com/s.cdpn.io/4621/python.png" data-url="http://example.com/3"&gt;&lt;/x-product&gt;</pre>
-
-<p>Archivo JS:</p>
-
-<pre class="brush: js">// Declaración de un <em>custom element</em> que hereda de HTMLElement
-class XProduct extends HTMLElement {
-  constructor() {
-    // Siempre debe llamarse primero al constructor padre
-    super();
-
-    // Se crea el <em>shadow root</em>
-    var shadow = this.attachShadow({mode: 'open'});
-
-    // Se crea un elemnto img y se asignan sus atributos.
-    var img = document.createElement('img');
-    img.alt = this.getAttribute('data-name');
-    img.src = this.getAttribute('data-img');
-    img.width = '150';
-    img.height = '150';
-    img.className = 'product-img';
-
-    // Añadir la imagen al shadow root.
-    shadow.appendChild(img);
-
-    // Añadir un elemento de escucha a la imagen.
-    img.addEventListener('click', () =&gt; {
-      window.location = this.getAttribute('data-url');
-    });
-
-    // Crear un enlace al producto.
-    var link = document.createElement('a');
-    link.innerText = this.getAttribute('data-name');
-    link.href = this.getAttribute('data-url');
-    link.className = 'product-name';
-
-    // Añadir el enlace al shadow root.
-    shadow.appendChild(link);
-  }
-}
-
-// Definir el nuevo elemento.
-customElements.define('x-product', XProduct);
-</pre>
-
-<p>Archivo CSS:</p>
-
-<pre class="brush: css">body {
-  background: #F7F7F7;
-}
-
-x-product {
-  display: inline-block;
-  float: left;
-  margin: 0.5em;
-  border-radius: 3px;
-  background: #FFF;
-  box-shadow: 0 1px 3px rgba(0,0,0,0.25);
-  font-family: Helvetica, arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-}
-
-x-product::slotted(.product-img) {
-  cursor: pointer;
-  background: #FFF;
-  margin: 0.5em;
-}
-
-x-product::slotted(.product-name) {
-  display: block;
-  text-align: center;
-  text-decoration: none;
-  color: #08C;
-  border-top: 1px solid #EEE;
-  font-weight: bold;
-  padding: 0.75em 0;
-}
-</pre>
-
-<p>A continuación se muestra el ejemplo en vivo de lo anterior:</p>
-
-<p>{{ EmbedLiveSample('Example', '1500', '250', '', 'Web/Web_Components/Custom_Elements') }}</p>
-
-<h2 id="Atributos_Observados">Atributos Observados</h2>
-
-<p>Para ser notificado cuando un atributo cambia, se debe definir una lista de atributos observados al inicializar el elemento, poniendo un getter estático <code>observedAttributes</code> en la clase del elemento que devuelve un array de nombre de atributos.</p>
-
-<p>Archivo JS:</p>
-
-<pre class="brush: js">class HelloElement extends HTMLElement {
-  // Observar los cambios en el atributo 'name'.
-  static get observedAttributes() {return ['name']; }
-
-  // Responder a los cambios en el atributo.
-  attributeChangedCallback(attr, oldValue, newValue) {
-    if (attr == 'name') {
-      this.textContent = `Hello, ${newValue}`;
-    }
-  }
-}
-
-// Definir el nuevo elemento
-customElements.define('hello-element', HelloElement);
-</pre>
-
-<p>Archivo HTML:</p>
-
-<pre class="brush: html">&lt;hello-element name="Anita"&gt;&lt;/hello-element&gt;</pre>
-
-<p>A continuación está el ejemplo en vivo de lo anterior:</p>
-
-<p>{{ EmbedLiveSample('Observed_attributes', '750', '100', '', 'Web/Web_Components/Custom_Elements') }}</p>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<p>Los <em>Custom Elements </em>están definido en la siguiente especificación:</p>
-
-<table class="spec-table standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td><a href="https://html.spec.whatwg.org/multipage/scripting.html#custom-elements">The HTML Standard: Custom elements</a></td>
-   <td>LS</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Recursos">Recursos</h2>
-
-<ul>
- <li><a href="https://developers.google.com/web/fundamentals/primers/customelements/">Custom elements v1: reusable web components - Google Developers tutorial</a></li>
-</ul>
diff --git a/files/es/web/xml/introducción_a_xml/index.html b/files/es/web/xml/introducción_a_xml/index.html
deleted file mode 100644
index c2193e80fb..0000000000
--- a/files/es/web/xml/introducción_a_xml/index.html
+++ /dev/null
@@ -1,125 +0,0 @@
----
-title: Introducción a XML
-slug: Web/XML/Introducción_a_XML
-tags:
-  - Principiante
-  - XML
-  - introducción
-translation_of: Web/XML/XML_introduction
----
-<p><span class="seoSummary">XML es un lenguaje de marcado similar a HTML. Significa Extensible Markup Language (Lenguaje de Marcado Extensible) y es una especificación de <a class="external" href="https://www.w3.org/TR/xml/">W3C</a> como lenguaje de marcado de propósito general. Esto significa que, a diferencia de otros lenguajes de marcado, XML no está predefinido, por lo que debes definir tus propias etiquetas. El propósito principal del lenguaje es compartir datos a través de diferentes sistemas, como Internet.</span></p>
-
-<p>Hay muchos lenguajes basados en XML; Algunos ejemplos son <a href="/es/docs/XHTML" title="en/XHTML">XHTML</a>, <a href="/es/docs/Web/MathML" title="en/MathML">MathML</a>, <a href="/es/docs/Web/SVG" title="en/SVG">SVG</a>, <a href="/es/docs/Mozilla/Tech/XUL" title="en/XUL">XUL</a>, <a href="/es/docs/XBL" title="en/XBL">XBL</a>, <a href="/es/docs/Archive/RSS" title="en/RSS">RSS</a>, y <a href="/es/docs/RDF" title="en/RDF">RDF</a>. También puedes crear uno propio.</p>
-
-<h2 id="XML_Correcto_(válido_y_bien_formado)">XML "Correcto" (válido y bien formado)</h2>
-
-<p>Para que un documento XML sea correcto, debe ser un documento bien formado, cumpliendo todas las reglas de sintaxis de XML, y válidas, acorde a las reglas de un lenguaje específico. Un ejemplo de un documento que no está bien formado es uno que tiene una etiqueta de apertura y no tiene una de cierre, ni se cierra en si misma.</p>
-
-<h3 id="Ejemplo">Ejemplo</h3>
-
-<p>En el ejemplo siguiente, vemos un documento en el que una etiqueta que no se cierra a si misma, no tiene etiqueta de cierre.</p>
-
-<pre class="brush: xml">&lt;message&gt;
-    &lt;warning&gt;
-        Hola, mundo
-    &lt;!--missing &lt;/warning&gt; --&gt;
-&lt;/message&gt;
-</pre>
-
-<p>Ahora veamos una versión correcta del mismo documento:</p>
-
-<pre class="brush: xml">&lt;message&gt;
-    &lt;warning&gt;
-         Hola, mundo
-    &lt;/warning&gt;
-&lt;/message&gt;
-</pre>
-
-<p>Para ser válido, un documento XML necesita cumplir ciertas reglas de semántica que son generalmente definidas en un esquema XML o en una <strong><a href="/es/docs/Glossary/DTD" title="en/DTD">Definición de Tipo de Documento</a></strong> (DTD). Un documento que contiene una etiqueta no definida es inválido. Por ejemplo, si nunca definimos la etiqueta <code>&lt;warning&gt;</code>, el documento anterior no sería válido.</p>
-
-<div class="note">
-<p>La mayoría de los navegadores ofrecen un depurador que puede identificar documentos XML mal formados.</p>
-</div>
-
-<h2 id="Entities" name="Entities">Entidades</h2>
-
-<p>Al igual que HTML, XML ofrece métodos (llamados entidades) para referir a algunos caracteres especiales reservados (como el signo de mayor que, usado para las etiquetas). Hay cinco de estos caracteres que debes conocer:</p>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Entidad</th>
-   <th scope="col">Caracter</th>
-   <th scope="col">Descripción</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>&amp;lt;</td>
-   <td>&lt;</td>
-   <td>Menor que</td>
-  </tr>
-  <tr>
-   <td>&amp;gt;</td>
-   <td>&gt;</td>
-   <td>Mayor que</td>
-  </tr>
-  <tr>
-   <td>&amp;amp;</td>
-   <td>&amp;</td>
-   <td>Ampersand</td>
-  </tr>
-  <tr>
-   <td>&amp;quot;</td>
-   <td>"</td>
-   <td>Comilla doble</td>
-  </tr>
-  <tr>
-   <td>&amp;apos;</td>
-   <td>'</td>
-   <td>Apóstrofe (o comilla sencilla)</td>
-  </tr>
- </tbody>
-</table>
-
-<p>Aunque solo hay cinco entidades declaradas, se pueden añadir más usando el <a href="/es/docs/Glossary/DTD" title="en/DTD">DTD</a> del documento. Por ejemplo, para crear una nueva entidad <code>&amp;warning;</code>, puedes hacer esto:</p>
-
-<pre>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
-&lt;!DOCTYPE body [
-  &lt;!ENTITY warning "Advertencia: Algo malo pasó... porfavor intente de nuevo."&gt;
-]&gt;
-&lt;body&gt;
-  &lt;message&gt; &amp;warning; &lt;/message&gt;
-&lt;/body&gt;
-</pre>
-
-<p>También puedes usar referencias a caracteres numéricas para especificar caracteres especiales; por ejemplo, &amp;#xA9; es el símbolo "©".</p>
-
-<h2 id="Presentando_XML">Presentando XML</h2>
-
-<p>XML es generalmente para propósitos descriptivos, pero hay maneras de presentar datos XML. Si no defines una manera específica de renderizar XML, el contenido puro de XML es mostrado en el navegador.</p>
-
-<p>Una forma de estilizar la salida de XML es especificando <a href="/es/docs/Web/CSS" title="en/CSS">CSS</a> que aplique al documento usando la instrucción de procesamiento <code>xml-stylesheet</code>.</p>
-
-<pre>&lt;?xml-stylesheet type="text/css" href="stylesheet.css"?&gt;</pre>
-
-<p>También hay otra manera más poderosa de presentar XML: <strong>Extensible Stylesheet Language Transformations</strong> (<a href="/es/docs/Web/XSLT" title="en/XSLT">XSLT</a>) que puede ser usado para transformar XML a otros lenguajes como HTML. Esto hace a XML increíblemente versátil.</p>
-
-<pre>&lt;?xml-stylesheet type="text/xsl" href="transform.xsl"?&gt;</pre>
-
-<h2 id="Recommendations" name="Recommendations">Recomendaciones</h2>
-
-<p>Este artículo es, obviamente, sólo una breve introducción a los que es XML, con unos pocos ejemplos pequeños y referencias para iniciar. Para más detalles acerca de XML, busca en la Web artículos más a fondo.</p>
-
-<p>Aprender el Lenguaje de Marcado de Hipertexto (<a href="/es/docs/Web/HTML" title="en/HTML">HTML</a>) te ayudará a entender mejor XML.</p>
-
-<h2 id="Véase_también">Véase también</h2>
-
-<ul>
- <li><a class="external" href="http://www.xml.com/">XML.com</a></li>
- <li><a class="external" href="https://www.w3.org/XML/">Extensible Markup Language (XML) @ W3.org</a></li>
- <li><a class="external" href="http://www.alistapart.com/d/usingxml/xml_uses_a.html">XML Example: A List Apart</a></li>
- <li><a class="external" href="http://www.alistapart.com/articles/usingxml/">Using XML: A List Apart</a></li>
-</ul>
-
-<p>El artículo <a href="http://www.alistapart.com/articles/usingxml/">Using XML</a> mostrado anteriormente es un gran recurso de información para transformar y crear tu propio lenguaje.</p>
diff --git a/files/es/web/xml/xml_introduction/index.html b/files/es/web/xml/xml_introduction/index.html
new file mode 100644
index 0000000000..0f4db54268
--- /dev/null
+++ b/files/es/web/xml/xml_introduction/index.html
@@ -0,0 +1,126 @@
+---
+title: Introducción a XML
+slug: Web/XML/XML_introduction
+tags:
+  - Principiante
+  - XML
+  - introducción
+translation_of: Web/XML/XML_introduction
+original_slug: Web/XML/Introducción_a_XML
+---
+<p><span class="seoSummary">XML es un lenguaje de marcado similar a HTML. Significa Extensible Markup Language (Lenguaje de Marcado Extensible) y es una especificación de <a class="external" href="https://www.w3.org/TR/xml/">W3C</a> como lenguaje de marcado de propósito general. Esto significa que, a diferencia de otros lenguajes de marcado, XML no está predefinido, por lo que debes definir tus propias etiquetas. El propósito principal del lenguaje es compartir datos a través de diferentes sistemas, como Internet.</span></p>
+
+<p>Hay muchos lenguajes basados en XML; Algunos ejemplos son <a href="/es/docs/XHTML" title="en/XHTML">XHTML</a>, <a href="/es/docs/Web/MathML" title="en/MathML">MathML</a>, <a href="/es/docs/Web/SVG" title="en/SVG">SVG</a>, <a href="/es/docs/Mozilla/Tech/XUL" title="en/XUL">XUL</a>, <a href="/es/docs/XBL" title="en/XBL">XBL</a>, <a href="/es/docs/Archive/RSS" title="en/RSS">RSS</a>, y <a href="/es/docs/RDF" title="en/RDF">RDF</a>. También puedes crear uno propio.</p>
+
+<h2 id="XML_Correcto_(válido_y_bien_formado)">XML "Correcto" (válido y bien formado)</h2>
+
+<p>Para que un documento XML sea correcto, debe ser un documento bien formado, cumpliendo todas las reglas de sintaxis de XML, y válidas, acorde a las reglas de un lenguaje específico. Un ejemplo de un documento que no está bien formado es uno que tiene una etiqueta de apertura y no tiene una de cierre, ni se cierra en si misma.</p>
+
+<h3 id="Ejemplo">Ejemplo</h3>
+
+<p>En el ejemplo siguiente, vemos un documento en el que una etiqueta que no se cierra a si misma, no tiene etiqueta de cierre.</p>
+
+<pre class="brush: xml">&lt;message&gt;
+    &lt;warning&gt;
+        Hola, mundo
+    &lt;!--missing &lt;/warning&gt; --&gt;
+&lt;/message&gt;
+</pre>
+
+<p>Ahora veamos una versión correcta del mismo documento:</p>
+
+<pre class="brush: xml">&lt;message&gt;
+    &lt;warning&gt;
+         Hola, mundo
+    &lt;/warning&gt;
+&lt;/message&gt;
+</pre>
+
+<p>Para ser válido, un documento XML necesita cumplir ciertas reglas de semántica que son generalmente definidas en un esquema XML o en una <strong><a href="/es/docs/Glossary/DTD" title="en/DTD">Definición de Tipo de Documento</a></strong> (DTD). Un documento que contiene una etiqueta no definida es inválido. Por ejemplo, si nunca definimos la etiqueta <code>&lt;warning&gt;</code>, el documento anterior no sería válido.</p>
+
+<div class="note">
+<p>La mayoría de los navegadores ofrecen un depurador que puede identificar documentos XML mal formados.</p>
+</div>
+
+<h2 id="Entities" name="Entities">Entidades</h2>
+
+<p>Al igual que HTML, XML ofrece métodos (llamados entidades) para referir a algunos caracteres especiales reservados (como el signo de mayor que, usado para las etiquetas). Hay cinco de estos caracteres que debes conocer:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Entidad</th>
+   <th scope="col">Caracter</th>
+   <th scope="col">Descripción</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>&amp;lt;</td>
+   <td>&lt;</td>
+   <td>Menor que</td>
+  </tr>
+  <tr>
+   <td>&amp;gt;</td>
+   <td>&gt;</td>
+   <td>Mayor que</td>
+  </tr>
+  <tr>
+   <td>&amp;amp;</td>
+   <td>&amp;</td>
+   <td>Ampersand</td>
+  </tr>
+  <tr>
+   <td>&amp;quot;</td>
+   <td>"</td>
+   <td>Comilla doble</td>
+  </tr>
+  <tr>
+   <td>&amp;apos;</td>
+   <td>'</td>
+   <td>Apóstrofe (o comilla sencilla)</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>Aunque solo hay cinco entidades declaradas, se pueden añadir más usando el <a href="/es/docs/Glossary/DTD" title="en/DTD">DTD</a> del documento. Por ejemplo, para crear una nueva entidad <code>&amp;warning;</code>, puedes hacer esto:</p>
+
+<pre>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
+&lt;!DOCTYPE body [
+  &lt;!ENTITY warning "Advertencia: Algo malo pasó... porfavor intente de nuevo."&gt;
+]&gt;
+&lt;body&gt;
+  &lt;message&gt; &amp;warning; &lt;/message&gt;
+&lt;/body&gt;
+</pre>
+
+<p>También puedes usar referencias a caracteres numéricas para especificar caracteres especiales; por ejemplo, &amp;#xA9; es el símbolo "©".</p>
+
+<h2 id="Presentando_XML">Presentando XML</h2>
+
+<p>XML es generalmente para propósitos descriptivos, pero hay maneras de presentar datos XML. Si no defines una manera específica de renderizar XML, el contenido puro de XML es mostrado en el navegador.</p>
+
+<p>Una forma de estilizar la salida de XML es especificando <a href="/es/docs/Web/CSS" title="en/CSS">CSS</a> que aplique al documento usando la instrucción de procesamiento <code>xml-stylesheet</code>.</p>
+
+<pre>&lt;?xml-stylesheet type="text/css" href="stylesheet.css"?&gt;</pre>
+
+<p>También hay otra manera más poderosa de presentar XML: <strong>Extensible Stylesheet Language Transformations</strong> (<a href="/es/docs/Web/XSLT" title="en/XSLT">XSLT</a>) que puede ser usado para transformar XML a otros lenguajes como HTML. Esto hace a XML increíblemente versátil.</p>
+
+<pre>&lt;?xml-stylesheet type="text/xsl" href="transform.xsl"?&gt;</pre>
+
+<h2 id="Recommendations" name="Recommendations">Recomendaciones</h2>
+
+<p>Este artículo es, obviamente, sólo una breve introducción a los que es XML, con unos pocos ejemplos pequeños y referencias para iniciar. Para más detalles acerca de XML, busca en la Web artículos más a fondo.</p>
+
+<p>Aprender el Lenguaje de Marcado de Hipertexto (<a href="/es/docs/Web/HTML" title="en/HTML">HTML</a>) te ayudará a entender mejor XML.</p>
+
+<h2 id="Véase_también">Véase también</h2>
+
+<ul>
+ <li><a class="external" href="http://www.xml.com/">XML.com</a></li>
+ <li><a class="external" href="https://www.w3.org/XML/">Extensible Markup Language (XML) @ W3.org</a></li>
+ <li><a class="external" href="http://www.alistapart.com/d/usingxml/xml_uses_a.html">XML Example: A List Apart</a></li>
+ <li><a class="external" href="http://www.alistapart.com/articles/usingxml/">Using XML: A List Apart</a></li>
+</ul>
+
+<p>El artículo <a href="http://www.alistapart.com/articles/usingxml/">Using XML</a> mostrado anteriormente es un gran recurso de información para transformar y crear tu propio lenguaje.</p>
diff --git a/files/es/web/xpath/axes/ancestor-or-self/index.html b/files/es/web/xpath/axes/ancestor-or-self/index.html
new file mode 100644
index 0000000000..f216eac6a6
--- /dev/null
+++ b/files/es/web/xpath/axes/ancestor-or-self/index.html
@@ -0,0 +1,9 @@
+---
+title: ancestor-or-self
+slug: Web/XPath/Axes/ancestor-or-self
+translation_of: Web/XPath/Axes/ancestor-or-self
+original_slug: Web/XPath/Ejes/ancestor-or-self
+---
+<p>
+</p><p>El nodo <code>ancestor-or-self</code> indica el nodo de contexto y todos sus antecesores, incluyendo el nodo raiz.
+</p>{{ languages( { "en": "en/XPath/Axes/ancestor-or-self", "fr": "fr/XPath/Axes/ancestor-or-self", "pl": "pl/XPath/Osie/ancestor-or-self" } ) }}
diff --git a/files/es/web/xpath/axes/ancestor/index.html b/files/es/web/xpath/axes/ancestor/index.html
new file mode 100644
index 0000000000..dfbcb73abd
--- /dev/null
+++ b/files/es/web/xpath/axes/ancestor/index.html
@@ -0,0 +1,9 @@
+---
+title: ancestor
+slug: Web/XPath/Axes/ancestor
+translation_of: Web/XPath/Axes/ancestor
+original_slug: Web/XPath/Ejes/ancestor
+---
+<p>
+</p><p>El eje <code>ancestor</code> indica todos los antecesores del nodo de contexto comenzando con el nodo padre y viajando hacia el nodo raiz.
+</p>{{ languages( { "en": "en/XPath/Axes/ancestor", "fr": "fr/XPath/Axes/ancestor", "pl": "pl/XPath/Osie/ancestor" } ) }}
diff --git a/files/es/web/xpath/axes/attribute/index.html b/files/es/web/xpath/axes/attribute/index.html
new file mode 100644
index 0000000000..083faf50d1
--- /dev/null
+++ b/files/es/web/xpath/axes/attribute/index.html
@@ -0,0 +1,9 @@
+---
+title: attribute
+slug: Web/XPath/Axes/attribute
+translation_of: Web/XPath/Axes/attribute
+original_slug: Web/XPath/Ejes/attribute
+---
+<p>
+</p><p>El eje <code>attribute</code> indica los atributos del nodo de contexto. Sólo los elementos tienen atributos. Este eje se puede abreviar con el signo (<code>@</code>).
+</p>{{ languages( { "en": "en/XPath/Axes/attribute", "fr": "fr/XPath/Axes/attribute", "pl": "pl/XPath/Osie/attribute" } ) }}
diff --git a/files/es/web/xpath/axes/child/index.html b/files/es/web/xpath/axes/child/index.html
new file mode 100644
index 0000000000..a201d8561c
--- /dev/null
+++ b/files/es/web/xpath/axes/child/index.html
@@ -0,0 +1,9 @@
+---
+title: child
+slug: Web/XPath/Axes/child
+translation_of: Web/XPath/Axes/child
+original_slug: Web/XPath/Ejes/child
+---
+<p>
+</p><p>El eje <code>child</code> indica el hijo del nodo de contexto. Si una expresión XPath no especifica un eje, se entiende por defecto. Ya que sólo los nodos raiz o los nodos elementos tienen hijos, cualquier otro uso no seleccionará nada.
+</p>{{ languages( { "en": "en/XPath/Axes/child", "fr": "fr/XPath/Axes/child", "pl": "pl/XPath/Osie/child" } ) }}
diff --git a/files/es/web/xpath/axes/descendant-or-self/index.html b/files/es/web/xpath/axes/descendant-or-self/index.html
new file mode 100644
index 0000000000..fae156641a
--- /dev/null
+++ b/files/es/web/xpath/axes/descendant-or-self/index.html
@@ -0,0 +1,9 @@
+---
+title: descendant-or-self
+slug: Web/XPath/Axes/descendant-or-self
+translation_of: Web/XPath/Axes/descendant-or-self
+original_slug: Web/XPath/Ejes/descendant-or-self
+---
+<p>
+</p><p>El eje <code>descendant-or-self</code> indica el nodo de contexto y todos sus descendientes. <b>No</b> se incluyen los nodos atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.
+</p>{{ languages( { "en": "en/XPath/Axes/descendant-or-self", "fr": "fr/XPath/Axes/descendant-or-self", "pl": "pl/XPath/Osie/descendant-or-self" } ) }}
diff --git a/files/es/web/xpath/axes/descendant/index.html b/files/es/web/xpath/axes/descendant/index.html
new file mode 100644
index 0000000000..cb436671e7
--- /dev/null
+++ b/files/es/web/xpath/axes/descendant/index.html
@@ -0,0 +1,9 @@
+---
+title: descendant
+slug: Web/XPath/Axes/descendant
+translation_of: Web/XPath/Axes/descendant
+original_slug: Web/XPath/Ejes/descendant
+---
+<p>
+</p><p>El eje <code>descendant</code> indica todos los hijos del nodo de contexto, y todos sus hijos y así sucesivamente. <b>No</b> se incluyen los atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.
+</p>{{ languages( { "en": "en/XPath/Axes/descendant", "fr": "fr/XPath/Axes/descendant", "pl": "pl/XPath/Osie/descendant" } ) }}
diff --git a/files/es/web/xpath/axes/following-sibling/index.html b/files/es/web/xpath/axes/following-sibling/index.html
new file mode 100644
index 0000000000..c4b6d0da24
--- /dev/null
+++ b/files/es/web/xpath/axes/following-sibling/index.html
@@ -0,0 +1,9 @@
+---
+title: following-sibling
+slug: Web/XPath/Axes/following-sibling
+translation_of: Web/XPath/Axes/following-sibling
+original_slug: Web/XPath/Ejes/following-sibling
+---
+<p>
+El eje <code>following-sibling</code> indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen después del nodo de contexto en el documento de origen.
+</p>{{ languages( { "en": "en/XPath/Axes/following-sibling", "fr": "fr/XPath/Axes/following-sibling", "pl": "pl/XPath/Osie/following-sibling" } ) }}
diff --git a/files/es/web/xpath/axes/following/index.html b/files/es/web/xpath/axes/following/index.html
new file mode 100644
index 0000000000..2c762be4ea
--- /dev/null
+++ b/files/es/web/xpath/axes/following/index.html
@@ -0,0 +1,9 @@
+---
+title: following
+slug: Web/XPath/Axes/following
+translation_of: Web/XPath/Axes/following
+original_slug: Web/XPath/Ejes/following
+---
+<p>
+El eje <code>following</code> indica todos los nodos que aparecen después del nodo de contexto, excepto cualquier nodo <code>descendant</code>, <code>attribute</code> y <code>namespace</code>.
+</p>{{ languages( { "en": "en/XPath/Axes/following", "fr": "fr/XPath/Axes/following", "pl": "pl/XPath/Osie/following" } ) }}
diff --git a/files/es/web/xpath/axes/index.html b/files/es/web/xpath/axes/index.html
new file mode 100644
index 0000000000..a8ad7aac9c
--- /dev/null
+++ b/files/es/web/xpath/axes/index.html
@@ -0,0 +1,48 @@
+---
+title: Ejes
+slug: Web/XPath/Axes
+tags:
+  - Todas_las_Categorías
+  - XPath
+  - XSLT
+translation_of: Web/XPath/Axes
+original_slug: Web/XPath/Ejes
+---
+<p>{{XsltRef}}Existen trece ejes diferentes en la especificación <a href="es/XPath">XPath</a>. Un eje representa una relación con el nodo de contexto, y se utiliza para localizar nodos relativos a ese nodo en el arbol. Lo siguiente es una descripción resumida de los trece ejes disponibles y el grado de soporte disponible en <a href="es/Gecko">Gecko</a>.</p>
+
+<p>Para mas información sobre el uso de las expresiones XPath, por favor vea la sección <a href="es/Transformando_XML_con_XSLT/Para_Futuras_Lecturas">Para Futuras Lecturas</a> al final del documento de <a href="es/Transformando_XML_con_XSLT">Transformando XML con XSLT</a>.</p>
+
+<p> </p>
+
+<dl>
+ <dt><a href="es/XPath/Ejes/ancestor">ancestor</a></dt>
+ <dd>Indica todos los antecesores del nodo de contexto comenzando con el nodo padre y viajando hacia el nodo raiz.</dd>
+ <dt><a href="es/XPath/Ejes/ancestor-or-self">ancestor-or-self</a></dt>
+ <dd>Indica el nodo de contexto y todos sus antecesores, incluyendo el nodo raiz.</dd>
+ <dt><a href="es/XPath/Ejes/attribute">attribute</a></dt>
+ <dd>Indica los atributos del nodo de contexto. Sólo los elementos tienen atributos. Este eje se puede abreviar con el signo (<code>@</code>).</dd>
+ <dt><a href="es/XPath/Ejes/child">child</a></dt>
+ <dd>Indica el hijo del nodo de contexto. Si una expresión XPath no especifica un eje, se entiende por defecto. Ya que sólo los nodos raiz o los nodos elementos tienen hijos, cualquier otro uso no seleccionará nada.</dd>
+ <dt><a href="es/XPath/Ejes/descendant">descendant</a></dt>
+ <dd>Indica todos los hijos del nodo de contexto, y todos sus hijos y así sucesivamente. <strong>No</strong> se incluyen los atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.</dd>
+ <dt><a href="es/XPath/Ejes/descendant-or-self">descendant-or-self</a></dt>
+ <dd>Indica el nodo de contexto y todos sus descendientes. <strong>No</strong> se incluyen los nodos atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.</dd>
+ <dt><a href="es/XPath/Ejes/following">following</a></dt>
+ <dd>Indica todos los nodos que aparecen después del nodo de contexto, excepto cualquier nodo <code>descendant</code>, <code>attribute</code> y <code>namespace</code>.</dd>
+ <dt><a href="es/XPath/Ejes/following-sibling">following-sibling</a></dt>
+ <dd>Indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen después del nodo de contexto en el documento de origen.</dd>
+ <dt><a href="es/XPath/Ejes/namespace">namespace</a><em>(no soportado)</em></dt>
+ <dd>Indica todos los nodos que están en el ámbito del nodo de contexto. En este caso, el nodo de contexto debe tener un nodo elemento.</dd>
+ <dt><a href="es/XPath/Ejes/parent">parent</a></dt>
+ <dd>Indica el único nodo que es el padre del nodo de contexto. Se puede abreviar con dos puntos (<code>..</code>).</dd>
+ <dt><a href="es/XPath/Ejes/preceding">preceding</a></dt>
+ <dd>Indica todos los nodos que preceden al nodo de contexto en el documento excepto cualquier nodo <code>ancestor</code>, <code>attribute</code> y <code>namespace</code>.</dd>
+ <dt><a href="es/XPath/Ejes/preceding-sibling">preceding-sibling</a></dt>
+ <dd>Indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen antes que el nodo de contexto en el documento de origen.</dd>
+ <dt><a href="es/XPath/Ejes/self">self</a></dt>
+ <dd>Indica el nodo de contexto si mismo. Se puede abreviar con un solo punto (<code>.</code>).</dd>
+</dl>
+
+<p><span class="comment">Categorias</span></p>
+
+<p><span class="comment">interwiki links</span></p>
diff --git a/files/es/web/xpath/axes/namespace/index.html b/files/es/web/xpath/axes/namespace/index.html
new file mode 100644
index 0000000000..0504ff600d
--- /dev/null
+++ b/files/es/web/xpath/axes/namespace/index.html
@@ -0,0 +1,10 @@
+---
+title: namespace
+slug: Web/XPath/Axes/namespace
+translation_of: Web/XPath/Axes/namespace
+original_slug: Web/XPath/Ejes/namespace
+---
+<p>
+<i>(not supported)</i>
+</p><p>El eje <code>namespace</code> indica todos los nodos que están en el ámbito del nodo de contexto. En este caso, el nodo de contexto debe tener un nodo elemento.
+</p>{{ languages( { "en": "en/XPath/Axes/namespace", "fr": "fr/XPath/Axes/namespace", "pl": "pl/XPath/Osie/namespace" } ) }}
diff --git a/files/es/web/xpath/axes/parent/index.html b/files/es/web/xpath/axes/parent/index.html
new file mode 100644
index 0000000000..a9dda727e7
--- /dev/null
+++ b/files/es/web/xpath/axes/parent/index.html
@@ -0,0 +1,9 @@
+---
+title: parent
+slug: Web/XPath/Axes/parent
+translation_of: Web/XPath/Axes/parent
+original_slug: Web/XPath/Ejes/parent
+---
+<p>
+El eje <code>parent</code> indica el único nodo que es el padre del nodo de contexto. Se puede abreviar con dos puntos (<code>..</code>).
+</p>{{ languages( { "en": "en/XPath/Axes/parent", "fr": "fr/XPath/Axes/parent", "pl": "pl/XPath/Osie/parent" } ) }}
diff --git a/files/es/web/xpath/axes/preceding-sibling/index.html b/files/es/web/xpath/axes/preceding-sibling/index.html
new file mode 100644
index 0000000000..0811a4c324
--- /dev/null
+++ b/files/es/web/xpath/axes/preceding-sibling/index.html
@@ -0,0 +1,9 @@
+---
+title: preceding-sibling
+slug: Web/XPath/Axes/preceding-sibling
+translation_of: Web/XPath/Axes/preceding-sibling
+original_slug: Web/XPath/Ejes/preceding-sibling
+---
+<p>
+El eje <code>preceding-sibling</code> indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen antes que el nodo de contexto en el documento de origen.
+</p>{{ languages( { "en": "en/XPath/Axes/preceding-sibling", "fr": "fr/XPath/Axes/preceding-sibling", "pl": "pl/XPath/Osie/preceding-sibling" } ) }}
diff --git a/files/es/web/xpath/axes/preceding/index.html b/files/es/web/xpath/axes/preceding/index.html
new file mode 100644
index 0000000000..034af30ba6
--- /dev/null
+++ b/files/es/web/xpath/axes/preceding/index.html
@@ -0,0 +1,9 @@
+---
+title: preceding
+slug: Web/XPath/Axes/preceding
+translation_of: Web/XPath/Axes/preceding
+original_slug: Web/XPath/Ejes/preceding
+---
+<p>
+El eje <code>preceding</code> indica todos los nodos que preceden al nodo de contexto en el documento excepto cualquier nodo <code>ancestor</code>, <code>attribute</code> y <code>namespace</code>.
+</p>{{ languages( { "en": "en/XPath/Axes/preceding", "fr": "fr/XPath/Axes/preceding", "pl": "pl/XPath/Osie/preceding" } ) }}
diff --git a/files/es/web/xpath/ejes/ancestor-or-self/index.html b/files/es/web/xpath/ejes/ancestor-or-self/index.html
deleted file mode 100644
index 902aa3f6b9..0000000000
--- a/files/es/web/xpath/ejes/ancestor-or-self/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: ancestor-or-self
-slug: Web/XPath/Ejes/ancestor-or-self
-translation_of: Web/XPath/Axes/ancestor-or-self
----
-<p>
-</p><p>El nodo <code>ancestor-or-self</code> indica el nodo de contexto y todos sus antecesores, incluyendo el nodo raiz.
-</p>{{ languages( { "en": "en/XPath/Axes/ancestor-or-self", "fr": "fr/XPath/Axes/ancestor-or-self", "pl": "pl/XPath/Osie/ancestor-or-self" } ) }}
diff --git a/files/es/web/xpath/ejes/ancestor/index.html b/files/es/web/xpath/ejes/ancestor/index.html
deleted file mode 100644
index 5d7148e0bc..0000000000
--- a/files/es/web/xpath/ejes/ancestor/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: ancestor
-slug: Web/XPath/Ejes/ancestor
-translation_of: Web/XPath/Axes/ancestor
----
-<p>
-</p><p>El eje <code>ancestor</code> indica todos los antecesores del nodo de contexto comenzando con el nodo padre y viajando hacia el nodo raiz.
-</p>{{ languages( { "en": "en/XPath/Axes/ancestor", "fr": "fr/XPath/Axes/ancestor", "pl": "pl/XPath/Osie/ancestor" } ) }}
diff --git a/files/es/web/xpath/ejes/attribute/index.html b/files/es/web/xpath/ejes/attribute/index.html
deleted file mode 100644
index 211ad7bc06..0000000000
--- a/files/es/web/xpath/ejes/attribute/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: attribute
-slug: Web/XPath/Ejes/attribute
-translation_of: Web/XPath/Axes/attribute
----
-<p>
-</p><p>El eje <code>attribute</code> indica los atributos del nodo de contexto. Sólo los elementos tienen atributos. Este eje se puede abreviar con el signo (<code>@</code>).
-</p>{{ languages( { "en": "en/XPath/Axes/attribute", "fr": "fr/XPath/Axes/attribute", "pl": "pl/XPath/Osie/attribute" } ) }}
diff --git a/files/es/web/xpath/ejes/child/index.html b/files/es/web/xpath/ejes/child/index.html
deleted file mode 100644
index 97ded1fcb4..0000000000
--- a/files/es/web/xpath/ejes/child/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: child
-slug: Web/XPath/Ejes/child
-translation_of: Web/XPath/Axes/child
----
-<p>
-</p><p>El eje <code>child</code> indica el hijo del nodo de contexto. Si una expresión XPath no especifica un eje, se entiende por defecto. Ya que sólo los nodos raiz o los nodos elementos tienen hijos, cualquier otro uso no seleccionará nada.
-</p>{{ languages( { "en": "en/XPath/Axes/child", "fr": "fr/XPath/Axes/child", "pl": "pl/XPath/Osie/child" } ) }}
diff --git a/files/es/web/xpath/ejes/descendant-or-self/index.html b/files/es/web/xpath/ejes/descendant-or-self/index.html
deleted file mode 100644
index 42061ddf67..0000000000
--- a/files/es/web/xpath/ejes/descendant-or-self/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: descendant-or-self
-slug: Web/XPath/Ejes/descendant-or-self
-translation_of: Web/XPath/Axes/descendant-or-self
----
-<p>
-</p><p>El eje <code>descendant-or-self</code> indica el nodo de contexto y todos sus descendientes. <b>No</b> se incluyen los nodos atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.
-</p>{{ languages( { "en": "en/XPath/Axes/descendant-or-self", "fr": "fr/XPath/Axes/descendant-or-self", "pl": "pl/XPath/Osie/descendant-or-self" } ) }}
diff --git a/files/es/web/xpath/ejes/descendant/index.html b/files/es/web/xpath/ejes/descendant/index.html
deleted file mode 100644
index c6fcc26970..0000000000
--- a/files/es/web/xpath/ejes/descendant/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: descendant
-slug: Web/XPath/Ejes/descendant
-translation_of: Web/XPath/Axes/descendant
----
-<p>
-</p><p>El eje <code>descendant</code> indica todos los hijos del nodo de contexto, y todos sus hijos y así sucesivamente. <b>No</b> se incluyen los atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.
-</p>{{ languages( { "en": "en/XPath/Axes/descendant", "fr": "fr/XPath/Axes/descendant", "pl": "pl/XPath/Osie/descendant" } ) }}
diff --git a/files/es/web/xpath/ejes/following-sibling/index.html b/files/es/web/xpath/ejes/following-sibling/index.html
deleted file mode 100644
index 73e42a2e7d..0000000000
--- a/files/es/web/xpath/ejes/following-sibling/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: following-sibling
-slug: Web/XPath/Ejes/following-sibling
-translation_of: Web/XPath/Axes/following-sibling
----
-<p>
-El eje <code>following-sibling</code> indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen después del nodo de contexto en el documento de origen.
-</p>{{ languages( { "en": "en/XPath/Axes/following-sibling", "fr": "fr/XPath/Axes/following-sibling", "pl": "pl/XPath/Osie/following-sibling" } ) }}
diff --git a/files/es/web/xpath/ejes/following/index.html b/files/es/web/xpath/ejes/following/index.html
deleted file mode 100644
index 190491a345..0000000000
--- a/files/es/web/xpath/ejes/following/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: following
-slug: Web/XPath/Ejes/following
-translation_of: Web/XPath/Axes/following
----
-<p>
-El eje <code>following</code> indica todos los nodos que aparecen después del nodo de contexto, excepto cualquier nodo <code>descendant</code>, <code>attribute</code> y <code>namespace</code>.
-</p>{{ languages( { "en": "en/XPath/Axes/following", "fr": "fr/XPath/Axes/following", "pl": "pl/XPath/Osie/following" } ) }}
diff --git a/files/es/web/xpath/ejes/index.html b/files/es/web/xpath/ejes/index.html
deleted file mode 100644
index ebaed0b7be..0000000000
--- a/files/es/web/xpath/ejes/index.html
+++ /dev/null
@@ -1,47 +0,0 @@
----
-title: Ejes
-slug: Web/XPath/Ejes
-tags:
-  - Todas_las_Categorías
-  - XPath
-  - XSLT
-translation_of: Web/XPath/Axes
----
-<p>{{XsltRef}}Existen trece ejes diferentes en la especificación <a href="es/XPath">XPath</a>. Un eje representa una relación con el nodo de contexto, y se utiliza para localizar nodos relativos a ese nodo en el arbol. Lo siguiente es una descripción resumida de los trece ejes disponibles y el grado de soporte disponible en <a href="es/Gecko">Gecko</a>.</p>
-
-<p>Para mas información sobre el uso de las expresiones XPath, por favor vea la sección <a href="es/Transformando_XML_con_XSLT/Para_Futuras_Lecturas">Para Futuras Lecturas</a> al final del documento de <a href="es/Transformando_XML_con_XSLT">Transformando XML con XSLT</a>.</p>
-
-<p> </p>
-
-<dl>
- <dt><a href="es/XPath/Ejes/ancestor">ancestor</a></dt>
- <dd>Indica todos los antecesores del nodo de contexto comenzando con el nodo padre y viajando hacia el nodo raiz.</dd>
- <dt><a href="es/XPath/Ejes/ancestor-or-self">ancestor-or-self</a></dt>
- <dd>Indica el nodo de contexto y todos sus antecesores, incluyendo el nodo raiz.</dd>
- <dt><a href="es/XPath/Ejes/attribute">attribute</a></dt>
- <dd>Indica los atributos del nodo de contexto. Sólo los elementos tienen atributos. Este eje se puede abreviar con el signo (<code>@</code>).</dd>
- <dt><a href="es/XPath/Ejes/child">child</a></dt>
- <dd>Indica el hijo del nodo de contexto. Si una expresión XPath no especifica un eje, se entiende por defecto. Ya que sólo los nodos raiz o los nodos elementos tienen hijos, cualquier otro uso no seleccionará nada.</dd>
- <dt><a href="es/XPath/Ejes/descendant">descendant</a></dt>
- <dd>Indica todos los hijos del nodo de contexto, y todos sus hijos y así sucesivamente. <strong>No</strong> se incluyen los atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.</dd>
- <dt><a href="es/XPath/Ejes/descendant-or-self">descendant-or-self</a></dt>
- <dd>Indica el nodo de contexto y todos sus descendientes. <strong>No</strong> se incluyen los nodos atributos y namespaces - el <code>parent</code> de un nodo <code>attribute</code> es un nodo elemento, pero los nodos <code>attribute</code> no son los hijos de sus padres.</dd>
- <dt><a href="es/XPath/Ejes/following">following</a></dt>
- <dd>Indica todos los nodos que aparecen después del nodo de contexto, excepto cualquier nodo <code>descendant</code>, <code>attribute</code> y <code>namespace</code>.</dd>
- <dt><a href="es/XPath/Ejes/following-sibling">following-sibling</a></dt>
- <dd>Indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen después del nodo de contexto en el documento de origen.</dd>
- <dt><a href="es/XPath/Ejes/namespace">namespace</a><em>(no soportado)</em></dt>
- <dd>Indica todos los nodos que están en el ámbito del nodo de contexto. En este caso, el nodo de contexto debe tener un nodo elemento.</dd>
- <dt><a href="es/XPath/Ejes/parent">parent</a></dt>
- <dd>Indica el único nodo que es el padre del nodo de contexto. Se puede abreviar con dos puntos (<code>..</code>).</dd>
- <dt><a href="es/XPath/Ejes/preceding">preceding</a></dt>
- <dd>Indica todos los nodos que preceden al nodo de contexto en el documento excepto cualquier nodo <code>ancestor</code>, <code>attribute</code> y <code>namespace</code>.</dd>
- <dt><a href="es/XPath/Ejes/preceding-sibling">preceding-sibling</a></dt>
- <dd>Indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen antes que el nodo de contexto en el documento de origen.</dd>
- <dt><a href="es/XPath/Ejes/self">self</a></dt>
- <dd>Indica el nodo de contexto si mismo. Se puede abreviar con un solo punto (<code>.</code>).</dd>
-</dl>
-
-<p><span class="comment">Categorias</span></p>
-
-<p><span class="comment">interwiki links</span></p>
diff --git a/files/es/web/xpath/ejes/namespace/index.html b/files/es/web/xpath/ejes/namespace/index.html
deleted file mode 100644
index aa24e4ac1f..0000000000
--- a/files/es/web/xpath/ejes/namespace/index.html
+++ /dev/null
@@ -1,9 +0,0 @@
----
-title: namespace
-slug: Web/XPath/Ejes/namespace
-translation_of: Web/XPath/Axes/namespace
----
-<p>
-<i>(not supported)</i>
-</p><p>El eje <code>namespace</code> indica todos los nodos que están en el ámbito del nodo de contexto. En este caso, el nodo de contexto debe tener un nodo elemento.
-</p>{{ languages( { "en": "en/XPath/Axes/namespace", "fr": "fr/XPath/Axes/namespace", "pl": "pl/XPath/Osie/namespace" } ) }}
diff --git a/files/es/web/xpath/ejes/parent/index.html b/files/es/web/xpath/ejes/parent/index.html
deleted file mode 100644
index ad56a7ec63..0000000000
--- a/files/es/web/xpath/ejes/parent/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: parent
-slug: Web/XPath/Ejes/parent
-translation_of: Web/XPath/Axes/parent
----
-<p>
-El eje <code>parent</code> indica el único nodo que es el padre del nodo de contexto. Se puede abreviar con dos puntos (<code>..</code>).
-</p>{{ languages( { "en": "en/XPath/Axes/parent", "fr": "fr/XPath/Axes/parent", "pl": "pl/XPath/Osie/parent" } ) }}
diff --git a/files/es/web/xpath/ejes/preceding-sibling/index.html b/files/es/web/xpath/ejes/preceding-sibling/index.html
deleted file mode 100644
index d713cfcdf5..0000000000
--- a/files/es/web/xpath/ejes/preceding-sibling/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: preceding-sibling
-slug: Web/XPath/Ejes/preceding-sibling
-translation_of: Web/XPath/Axes/preceding-sibling
----
-<p>
-El eje <code>preceding-sibling</code> indica todos los nodos que tienen el mismo padre que el nodo de contexto y aparecen antes que el nodo de contexto en el documento de origen.
-</p>{{ languages( { "en": "en/XPath/Axes/preceding-sibling", "fr": "fr/XPath/Axes/preceding-sibling", "pl": "pl/XPath/Osie/preceding-sibling" } ) }}
diff --git a/files/es/web/xpath/ejes/preceding/index.html b/files/es/web/xpath/ejes/preceding/index.html
deleted file mode 100644
index cd4b702ca2..0000000000
--- a/files/es/web/xpath/ejes/preceding/index.html
+++ /dev/null
@@ -1,8 +0,0 @@
----
-title: preceding
-slug: Web/XPath/Ejes/preceding
-translation_of: Web/XPath/Axes/preceding
----
-<p>
-El eje <code>preceding</code> indica todos los nodos que preceden al nodo de contexto en el documento excepto cualquier nodo <code>ancestor</code>, <code>attribute</code> y <code>namespace</code>.
-</p>{{ languages( { "en": "en/XPath/Axes/preceding", "fr": "fr/XPath/Axes/preceding", "pl": "pl/XPath/Osie/preceding" } ) }}
diff --git a/files/es/web/xpath/funciones/contains/index.html b/files/es/web/xpath/funciones/contains/index.html
deleted file mode 100644
index 59af049973..0000000000
--- a/files/es/web/xpath/funciones/contains/index.html
+++ /dev/null
@@ -1,32 +0,0 @@
----
-title: contains
-slug: Web/XPath/Funciones/contains
-translation_of: Web/XPath/Functions/contains
----
-<p>
-{{ XsltRef() }}
-</p><p><br>
-La función <code>contains</code> determina si la primera cadena del argumento contiene la segunda cadena del argumento y devuelve el booleano verdadero o falso.
-</p>
-<h3 id="Sintaxis" name="Sintaxis"> Sintaxis </h3>
-<pre class="eval">contains( <i>haystack</i> , <i>needle</i> )
-</pre>
-<h3 id="Argumentos" name="Argumentos"> Argumentos </h3>
-<dl><dt><code><i>haystack</i></code>
-</dt><dd>La cadena donde buscar
-</dd></dl>
-<dl><dt><code><i>needle</i></code>
-</dt><dd>La subcadena a buscar en <code><i>haystack</i></code>
-</dd></dl>
-<h3 id="Devuelve" name="Devuelve"> Devuelve </h3>
-<p><code>true</code> si <code><i>haystack</i></code> contiene <code><i>needle</i></code>. Si no, <code>false</code>.
-</p>
-<h3 id="Definido" name="Definido"> Definido </h3>
-<p><a href="http://www.w3.org/TR/xpath#function-contains" class="external">XPath 1.0 4.2</a>
-</p>
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko"> Soporte en Gecko </h3>
-<p>Soportado.
-</p>
-<div class="noinclude">
-</div>
-{{ languages( { "en": "en/XPath/Functions/contains", "fr": "fr/XPath/Fonctions/contains", "ja": "ja/XPath/Functions/contains", "pl": "pl/XPath/Funkcje/contains" } ) }}
diff --git a/files/es/web/xpath/funciones/index.html b/files/es/web/xpath/funciones/index.html
deleted file mode 100644
index 9c0fdd8af4..0000000000
--- a/files/es/web/xpath/funciones/index.html
+++ /dev/null
@@ -1,54 +0,0 @@
----
-title: Funciones
-slug: Web/XPath/Funciones
-tags:
-  - Referência_XPath
-  - Referência_XSLT
-  - Transformando_XML_con_XSLT
-  - XPath
-  - XSLT
-translation_of: Web/XPath/Functions
----
-<p>{{ XsltRef() }} A continuación se presenta una lista ordenada de las funciones core de <font color="#0066cc">XPath</font> y agregados específicos de <font color="#0066cc">XSLT </font>a XPath, incluyendo una descripción, sintaxis, un listado de argumentos, tipo de resultado, referencia apopiada a W3C y el estado actual de soporte en el motor <font color="#0066cc">Gecko</font>. para más información sobre el uso de las funciones de XPath/XSLT, por favor vea la página <a href="/en/Transforming_XML_with_XSLT/For_Further_Reading" title="en/Transforming_XML_with_XSLT/For_Further_Reading"><u><font color="#0066cc">Para más información</font></u></a>.</p>
-
-<ul>
- <li><a href="/en/XPath/Functions/boolean" title="en/XPath/Functions/boolean">boolean()</a></li>
- <li><a href="/en/XPath/Functions/ceiling" title="en/XPath/Functions/ceiling">ceiling()</a></li>
- <li><a href="/en/XPath/Functions/choose" title="en/XPath/Functions/choose">choose()</a></li>
- <li><a href="/en/XPath/Functions/concat" title="en/XPath/Functions/concat">concat()</a></li>
- <li><a href="/en/XPath/Functions/contains" title="en/XPath/Functions/contains">contains()</a></li>
- <li><a href="/en/XPath/Functions/count" title="en/XPath/Functions/count">count()</a></li>
- <li><a href="/en/XPath/Functions/current" title="en/XPath/Functions/current">current()</a> <em>Específico de XSLT</em></li>
- <li><a href="/en/XPath/Functions/document" title="en/XPath/Functions/document">document()</a> <em>Específico de XSLT</em></li>
- <li><a href="/en/XPath/Functions/element-available" title="en/XPath/Functions/element-available">element-available()</a></li>
- <li><a href="/en/XPath/Functions/false" title="en/XPath/Functions/false">false()</a></li>
- <li><a href="/en/XPath/Functions/floor" title="en/XPath/Functions/floor">floor()</a></li>
- <li><a href="/en/XPath/Functions/format-number" title="en/XPath/Functions/format-number">format-number()</a> <em>Específico de XSLT</em></li>
- <li><a href="/en/XPath/Functions/function-available" title="en/XPath/Functions/function-available">function-available()</a></li>
- <li><a href="/en/XPath/Functions/generate-id" title="en/XPath/Functions/generate-id">generate-id()</a> <em>Específico de XSLT</em></li>
- <li><a href="/en/XPath/Functions/id" title="en/XPath/Functions/id">id()</a> <em>(Parcialmente soportado)</em></li>
- <li><a href="/en/XPath/Functions/key" title="en/XPath/Functions/key">key()</a> <em>Específico de XSLT</em></li>
- <li><a href="/en/XPath/Functions/lang" title="en/XPath/Functions/lang">lang()</a></li>
- <li><a href="/en/XPath/Functions/last" title="en/XPath/Functions/last">last()</a></li>
- <li><a href="/en/XPath/Functions/local-name" title="en/XPath/Functions/local-name">local-name()</a></li>
- <li><a href="/en/XPath/Functions/name" title="en/XPath/Functions/name">name()</a></li>
- <li><a href="/en/XPath/Functions/namespace-uri" title="en/XPath/Functions/namespace-uri">namespace-uri()</a></li>
- <li><a href="/en/XPath/Functions/normalize-space" title="en/XPath/Functions/normalize-space">normalize-space()</a></li>
- <li><a href="/en/XPath/Functions/not" title="en/XPath/Functions/not">not()</a></li>
- <li><a href="/en/XPath/Functions/number" title="en/XPath/Functions/number">number()</a></li>
- <li><a href="/en/XPath/Functions/position" title="en/XPath/Functions/position">position()</a></li>
- <li><a href="/en/XPath/Functions/round" title="en/XPath/Functions/round">round()</a></li>
- <li><a href="/en/XPath/Functions/starts-with" title="en/XPath/Functions/starts-with">starts-with()</a></li>
- <li><a href="/en/XPath/Functions/string" title="en/XPath/Functions/string">string()</a></li>
- <li><a href="/en/XPath/Functions/string-length" title="en/XPath/Functions/string-length">string-length()</a></li>
- <li><a href="/en/XPath/Functions/substring" title="en/XPath/Functions/substring">substring()</a></li>
- <li><a href="/en/XPath/Functions/substring-after" title="en/XPath/Functions/substring-after">substring-after()</a></li>
- <li><a href="/en/XPath/Functions/substring-before" title="en/XPath/Functions/substring-before">substring-before()</a></li>
- <li><a href="/en/XPath/Functions/sum" title="en/XPath/Functions/sum">sum()</a></li>
- <li><a href="/en/XPath/Functions/system-property" title="en/XPath/Functions/system-property">system-property()</a> <em>Específico de XSLT</em></li>
- <li><a href="/en/XPath/Functions/translate" title="en/XPath/Functions/translate">translate()</a></li>
- <li><a href="/en/XPath/Functions/true" title="en/XPath/Functions/true">true()</a></li>
- <li><a href="/en/XPath/Functions/unparsed-entity-url" title="en/XPath/Functions/unparsed-entity-url">unparsed-entity-url()</a> <em>Específico de XSLT (no soportado)</em></li>
-</ul>
-
-<p>{{ languages( { "fr": "fr/XPath/Fonctions", "ja": "ja/XPath/Functions", "zh-cn": "cn/XPath/Functions", "pl": "pl/XPath/Funkcje" , "ko": "ko/XPath/Functions"} ) }}</p>
diff --git a/files/es/web/xpath/funciones/substring/index.html b/files/es/web/xpath/funciones/substring/index.html
deleted file mode 100644
index 96c5ec585b..0000000000
--- a/files/es/web/xpath/funciones/substring/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
----
-title: substring
-slug: Web/XPath/Funciones/substring
-translation_of: Web/XPath/Functions/substring
----
-<p>
-{{ XsltRef() }}
-</p><p><br>
-La función <code>substring</code> devuelve una parte de una cadena dada.
-</p>
-<h3 id="Sintaxis" name="Sintaxis"> Sintaxis </h3>
-<pre class="eval">substring( <i>string</i> , <i>start</i> [, <i>length</i>] )
-</pre>
-<h3 id="Argumentos" name="Argumentos"> Argumentos </h3>
-<dl><dt><i><code>string</code></i> </dt><dd>La cadena a evaluar.
-</dd></dl>
-<dl><dt><i><code>start</code></i>
-</dt><dd>La posición dentro de <i><code>string</code></i> donde comienza la subcadena.
-</dd></dl>
-<dl><dt><i><code>length</code></i> (opcional)
-</dt><dd>La longitud de la subcadena. Si se omite, la cadena devuelta contendrá todos los carácteres desde la posición <i><code>start</code></i> hasta el final de <i><code>string</code></i>.
-</dd></dl>
-<h3 id="Devuelve" name="Devuelve"> Devuelve </h3>
-<p>Una cadena.
-</p>
-<h3 id="Notas" name="Notas"> Notas </h3>
-<p>Como en otras funciones XPath, la posición no está basada en cero. El primer carácter de la cadena tiene la posición 1, no 0.
-</p>
-<h3 id="Definido" name="Definido"> Definido </h3>
-<p><a href="http://www.w3.org/TR/xpath#function-substring" class="external">XPath 1.0 4.2</a>
-</p>
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko"> Soporte en Gecko </h3>
-<p>Soportado.
-</p>
-<div class="noinclude">
-</div>
-{{ languages( { "en": "en/XPath/Functions/substring", "fr": "fr/XPath/Fonctions/substring", "ja": "ja/XPath/Functions/substring", "pl": "pl/XPath/Funkcje/substring" } ) }}
diff --git a/files/es/web/xpath/funciones/true/index.html b/files/es/web/xpath/funciones/true/index.html
deleted file mode 100644
index 41ace4f289..0000000000
--- a/files/es/web/xpath/funciones/true/index.html
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: 'true'
-slug: Web/XPath/Funciones/true
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XPath/Functions/true
----
-<p>{{XsltRef}}</p>
-
-<p><br>
- La función <code>true</code> devuelve un valor booleano de verdadero.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre class="eval">true()
-</pre>
-
-<h3 id="Devuelve" name="Devuelve">Devuelve</h3>
-
-<p>El booleano <code>verdadero</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p><a class="external" href="http://www.w3.org/TR/xpath#function-true">XPath 1.0 4.3</a></p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Supported.</p>
diff --git a/files/es/web/xpath/functions/contains/index.html b/files/es/web/xpath/functions/contains/index.html
new file mode 100644
index 0000000000..47231a8324
--- /dev/null
+++ b/files/es/web/xpath/functions/contains/index.html
@@ -0,0 +1,33 @@
+---
+title: contains
+slug: Web/XPath/Functions/contains
+translation_of: Web/XPath/Functions/contains
+original_slug: Web/XPath/Funciones/contains
+---
+<p>
+{{ XsltRef() }}
+</p><p><br>
+La función <code>contains</code> determina si la primera cadena del argumento contiene la segunda cadena del argumento y devuelve el booleano verdadero o falso.
+</p>
+<h3 id="Sintaxis" name="Sintaxis"> Sintaxis </h3>
+<pre class="eval">contains( <i>haystack</i> , <i>needle</i> )
+</pre>
+<h3 id="Argumentos" name="Argumentos"> Argumentos </h3>
+<dl><dt><code><i>haystack</i></code>
+</dt><dd>La cadena donde buscar
+</dd></dl>
+<dl><dt><code><i>needle</i></code>
+</dt><dd>La subcadena a buscar en <code><i>haystack</i></code>
+</dd></dl>
+<h3 id="Devuelve" name="Devuelve"> Devuelve </h3>
+<p><code>true</code> si <code><i>haystack</i></code> contiene <code><i>needle</i></code>. Si no, <code>false</code>.
+</p>
+<h3 id="Definido" name="Definido"> Definido </h3>
+<p><a href="http://www.w3.org/TR/xpath#function-contains" class="external">XPath 1.0 4.2</a>
+</p>
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko"> Soporte en Gecko </h3>
+<p>Soportado.
+</p>
+<div class="noinclude">
+</div>
+{{ languages( { "en": "en/XPath/Functions/contains", "fr": "fr/XPath/Fonctions/contains", "ja": "ja/XPath/Functions/contains", "pl": "pl/XPath/Funkcje/contains" } ) }}
diff --git a/files/es/web/xpath/functions/index.html b/files/es/web/xpath/functions/index.html
new file mode 100644
index 0000000000..24eeabd763
--- /dev/null
+++ b/files/es/web/xpath/functions/index.html
@@ -0,0 +1,55 @@
+---
+title: Funciones
+slug: Web/XPath/Functions
+tags:
+  - Referência_XPath
+  - Referência_XSLT
+  - Transformando_XML_con_XSLT
+  - XPath
+  - XSLT
+translation_of: Web/XPath/Functions
+original_slug: Web/XPath/Funciones
+---
+<p>{{ XsltRef() }} A continuación se presenta una lista ordenada de las funciones core de <font color="#0066cc">XPath</font> y agregados específicos de <font color="#0066cc">XSLT </font>a XPath, incluyendo una descripción, sintaxis, un listado de argumentos, tipo de resultado, referencia apopiada a W3C y el estado actual de soporte en el motor <font color="#0066cc">Gecko</font>. para más información sobre el uso de las funciones de XPath/XSLT, por favor vea la página <a href="/en/Transforming_XML_with_XSLT/For_Further_Reading" title="en/Transforming_XML_with_XSLT/For_Further_Reading"><u><font color="#0066cc">Para más información</font></u></a>.</p>
+
+<ul>
+ <li><a href="/en/XPath/Functions/boolean" title="en/XPath/Functions/boolean">boolean()</a></li>
+ <li><a href="/en/XPath/Functions/ceiling" title="en/XPath/Functions/ceiling">ceiling()</a></li>
+ <li><a href="/en/XPath/Functions/choose" title="en/XPath/Functions/choose">choose()</a></li>
+ <li><a href="/en/XPath/Functions/concat" title="en/XPath/Functions/concat">concat()</a></li>
+ <li><a href="/en/XPath/Functions/contains" title="en/XPath/Functions/contains">contains()</a></li>
+ <li><a href="/en/XPath/Functions/count" title="en/XPath/Functions/count">count()</a></li>
+ <li><a href="/en/XPath/Functions/current" title="en/XPath/Functions/current">current()</a> <em>Específico de XSLT</em></li>
+ <li><a href="/en/XPath/Functions/document" title="en/XPath/Functions/document">document()</a> <em>Específico de XSLT</em></li>
+ <li><a href="/en/XPath/Functions/element-available" title="en/XPath/Functions/element-available">element-available()</a></li>
+ <li><a href="/en/XPath/Functions/false" title="en/XPath/Functions/false">false()</a></li>
+ <li><a href="/en/XPath/Functions/floor" title="en/XPath/Functions/floor">floor()</a></li>
+ <li><a href="/en/XPath/Functions/format-number" title="en/XPath/Functions/format-number">format-number()</a> <em>Específico de XSLT</em></li>
+ <li><a href="/en/XPath/Functions/function-available" title="en/XPath/Functions/function-available">function-available()</a></li>
+ <li><a href="/en/XPath/Functions/generate-id" title="en/XPath/Functions/generate-id">generate-id()</a> <em>Específico de XSLT</em></li>
+ <li><a href="/en/XPath/Functions/id" title="en/XPath/Functions/id">id()</a> <em>(Parcialmente soportado)</em></li>
+ <li><a href="/en/XPath/Functions/key" title="en/XPath/Functions/key">key()</a> <em>Específico de XSLT</em></li>
+ <li><a href="/en/XPath/Functions/lang" title="en/XPath/Functions/lang">lang()</a></li>
+ <li><a href="/en/XPath/Functions/last" title="en/XPath/Functions/last">last()</a></li>
+ <li><a href="/en/XPath/Functions/local-name" title="en/XPath/Functions/local-name">local-name()</a></li>
+ <li><a href="/en/XPath/Functions/name" title="en/XPath/Functions/name">name()</a></li>
+ <li><a href="/en/XPath/Functions/namespace-uri" title="en/XPath/Functions/namespace-uri">namespace-uri()</a></li>
+ <li><a href="/en/XPath/Functions/normalize-space" title="en/XPath/Functions/normalize-space">normalize-space()</a></li>
+ <li><a href="/en/XPath/Functions/not" title="en/XPath/Functions/not">not()</a></li>
+ <li><a href="/en/XPath/Functions/number" title="en/XPath/Functions/number">number()</a></li>
+ <li><a href="/en/XPath/Functions/position" title="en/XPath/Functions/position">position()</a></li>
+ <li><a href="/en/XPath/Functions/round" title="en/XPath/Functions/round">round()</a></li>
+ <li><a href="/en/XPath/Functions/starts-with" title="en/XPath/Functions/starts-with">starts-with()</a></li>
+ <li><a href="/en/XPath/Functions/string" title="en/XPath/Functions/string">string()</a></li>
+ <li><a href="/en/XPath/Functions/string-length" title="en/XPath/Functions/string-length">string-length()</a></li>
+ <li><a href="/en/XPath/Functions/substring" title="en/XPath/Functions/substring">substring()</a></li>
+ <li><a href="/en/XPath/Functions/substring-after" title="en/XPath/Functions/substring-after">substring-after()</a></li>
+ <li><a href="/en/XPath/Functions/substring-before" title="en/XPath/Functions/substring-before">substring-before()</a></li>
+ <li><a href="/en/XPath/Functions/sum" title="en/XPath/Functions/sum">sum()</a></li>
+ <li><a href="/en/XPath/Functions/system-property" title="en/XPath/Functions/system-property">system-property()</a> <em>Específico de XSLT</em></li>
+ <li><a href="/en/XPath/Functions/translate" title="en/XPath/Functions/translate">translate()</a></li>
+ <li><a href="/en/XPath/Functions/true" title="en/XPath/Functions/true">true()</a></li>
+ <li><a href="/en/XPath/Functions/unparsed-entity-url" title="en/XPath/Functions/unparsed-entity-url">unparsed-entity-url()</a> <em>Específico de XSLT (no soportado)</em></li>
+</ul>
+
+<p>{{ languages( { "fr": "fr/XPath/Fonctions", "ja": "ja/XPath/Functions", "zh-cn": "cn/XPath/Functions", "pl": "pl/XPath/Funkcje" , "ko": "ko/XPath/Functions"} ) }}</p>
diff --git a/files/es/web/xpath/functions/substring/index.html b/files/es/web/xpath/functions/substring/index.html
new file mode 100644
index 0000000000..637cbe59ca
--- /dev/null
+++ b/files/es/web/xpath/functions/substring/index.html
@@ -0,0 +1,38 @@
+---
+title: substring
+slug: Web/XPath/Functions/substring
+translation_of: Web/XPath/Functions/substring
+original_slug: Web/XPath/Funciones/substring
+---
+<p>
+{{ XsltRef() }}
+</p><p><br>
+La función <code>substring</code> devuelve una parte de una cadena dada.
+</p>
+<h3 id="Sintaxis" name="Sintaxis"> Sintaxis </h3>
+<pre class="eval">substring( <i>string</i> , <i>start</i> [, <i>length</i>] )
+</pre>
+<h3 id="Argumentos" name="Argumentos"> Argumentos </h3>
+<dl><dt><i><code>string</code></i> </dt><dd>La cadena a evaluar.
+</dd></dl>
+<dl><dt><i><code>start</code></i>
+</dt><dd>La posición dentro de <i><code>string</code></i> donde comienza la subcadena.
+</dd></dl>
+<dl><dt><i><code>length</code></i> (opcional)
+</dt><dd>La longitud de la subcadena. Si se omite, la cadena devuelta contendrá todos los carácteres desde la posición <i><code>start</code></i> hasta el final de <i><code>string</code></i>.
+</dd></dl>
+<h3 id="Devuelve" name="Devuelve"> Devuelve </h3>
+<p>Una cadena.
+</p>
+<h3 id="Notas" name="Notas"> Notas </h3>
+<p>Como en otras funciones XPath, la posición no está basada en cero. El primer carácter de la cadena tiene la posición 1, no 0.
+</p>
+<h3 id="Definido" name="Definido"> Definido </h3>
+<p><a href="http://www.w3.org/TR/xpath#function-substring" class="external">XPath 1.0 4.2</a>
+</p>
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko"> Soporte en Gecko </h3>
+<p>Soportado.
+</p>
+<div class="noinclude">
+</div>
+{{ languages( { "en": "en/XPath/Functions/substring", "fr": "fr/XPath/Fonctions/substring", "ja": "ja/XPath/Functions/substring", "pl": "pl/XPath/Funkcje/substring" } ) }}
diff --git a/files/es/web/xpath/functions/true/index.html b/files/es/web/xpath/functions/true/index.html
new file mode 100644
index 0000000000..18411f8e43
--- /dev/null
+++ b/files/es/web/xpath/functions/true/index.html
@@ -0,0 +1,30 @@
+---
+title: 'true'
+slug: Web/XPath/Functions/true
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XPath/Functions/true
+original_slug: Web/XPath/Funciones/true
+---
+<p>{{XsltRef}}</p>
+
+<p><br>
+ La función <code>true</code> devuelve un valor booleano de verdadero.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre class="eval">true()
+</pre>
+
+<h3 id="Devuelve" name="Devuelve">Devuelve</h3>
+
+<p>El booleano <code>verdadero</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p><a class="external" href="http://www.w3.org/TR/xpath#function-true">XPath 1.0 4.3</a></p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Supported.</p>
diff --git a/files/es/web/xpath/introduction_to_using_xpath_in_javascript/index.html b/files/es/web/xpath/introduction_to_using_xpath_in_javascript/index.html
new file mode 100644
index 0000000000..9cec6c1847
--- /dev/null
+++ b/files/es/web/xpath/introduction_to_using_xpath_in_javascript/index.html
@@ -0,0 +1,417 @@
+---
+title: Introducción al uso de XPath en Javascript
+slug: Web/XPath/Introduction_to_using_XPath_in_JavaScript
+translation_of: Web/XPath/Introduction_to_using_XPath_in_JavaScript
+original_slug: Web/JavaScript/Introduction_to_using_XPath_in_JavaScript
+---
+<p>Este documento describe la interfaz para usar <a href="/en-US/docs/Web/XPath">XPath</a> internamente en JavaScript,  en extensiones y desde sitios web. Mozilla implementa una gran parte del <a class="external" href="http://www.w3.org/TR/DOM-Level-3-XPath/xpath.html">DOM 3 XPath</a>. Esto significa que las expresiones XPath pueden correrse en documentos HTML y XML.</p>
+
+<p>La interfaz principal a usar con XPath es la función <a href="/en/DOM/document.evaluate" title="en/DOM/document.evaluate">evaluate</a> del objeto <a href="/en/DOM/document" title="en/DOM/document">document</a>.</p>
+
+<h2 id="document.evaluate" name="document.evaluate">document.evaluate</h2>
+
+<p>Este método evalúa expresiones <a href="/en/XPath" title="en/XPath">XPath</a> contra un documento basado en <a href="/en/XML" title="en/XML">XML</a>  (incluyendo documentos HTML), y regresa un objeto <code><a href="/en/XPathResult" title="en/XPathResult">XPathResult</a></code>, el cual puede ser un solo nodo o un conjunto de nodos. La documentación existente para este método se encuentra en <a href="/en/DOM/document.evaluate" title="en/DOM/document.evaluate">document.evaluate</a>, pero de momento es más bien escasa para nuestras necesidades; una examinación más abarcativa será dada a continuación.</p>
+
+<pre class="brush: js">var xpathResult = document.evaluate( xpathExpression, contextNode, namespaceResolver, resultType, result );
+</pre>
+
+<h3 id="Parameters" name="Parameters">Parámetros</h3>
+
+<p>La función <a href="/en/DOM/document.evaluate" title="en/DOM/document.evaluate">evaluate</a> toma un total de 5 parámetros:</p>
+
+<ul>
+ <li><code>xpathExpression</code>: Una cadena que contiene la expresión XPath a evaluar.</li>
+ <li><code>contextNode</code>: Un nodo en el documento contra la  <code>xpathExpression</code> debe ser evaluada, incluyendo todos los nodos descendientes. El nodo <a href="/en/DOM/document" title="en/DOM/document">document</a> es el usado más comúnmente.</li>
+ <li><code>namespaceResolver</code>: Una función que pasará cualquier prefijo de namespace contenido en una <code>xpathExpression</code> la cúal regresará una cadena representando al URI del namespace asociado con ese prefijo. Esto activa la conversión entre los prefijos usados en las expresiones XPath y los posiblemente distintos prefijos usados en el documento. La función puede ser:
+  <ul>
+   <li>Creada usando el metodo <code><a href="/en/DOM/document.createNSResolver" title="en/DOM/document.createNSResolver">createNSResolver</a></code> de un objeto <code><a href="/en/XPathEvaluator" title="en/XPathEvaluator">XPathEvaluator</a></code>. Deberías usar este virtualmente todo el tiempo.</li>
+   <li><code>null</code>, el cúal puede ser usado para documentos HTML o cuando no son usados prefijos de namespace. Note que, si la expresión XPath contiene un prefijo de namespace, esto resultará en una <code>DOMException</code> siendo arrojada con el código <code>NAMESPACE_ERR</code>.</li>
+   <li>Una función definida por el usuario. Mira la sección <a href="#Implementing_a_User_Defined_Namespace_Resolver">Usar un Solucionador de Namespace definido por el usuario</a> en el apéndice para detalles.</li>
+  </ul>
+ </li>
+ <li><code>resultType</code>: Una <a href="#XPathResult_Defined_Constants">constante</a> que especifica el tipo del resultado deseado a ser regresado. La constante más comúnmente pasada es <code>XPathResult.ANY_TYPE</code> la cúal regresará los resultados de la expresión XPath como el tipo más natural. Hay una sección en el apéndice que contiene una lista completa de las <a href="#XPathResult_Defined_Constants">constantes disponibles</a>. Estas son explicadas debajo, en la sección "<a href="#Specifying_the_Return_Type">Especificando el tipo de valor regresado</a>".</li>
+ <li><code>result</code>: Si un objeto <code>XPathResult</code>  existente es especificado, sera reusado para regresar el resultado. Especificando <code>null</code>, un nuevo objeto <code>XPathResult</code> será creado.</li>
+</ul>
+
+<h3 id="Return_Value" name="Return_Value">Valor regresado</h3>
+
+<p>Regresa <code>xpathResult</code>, que es un objeto <code>XPathResult</code> del tipo especificado en el parámetro <code>resultType</code>. La interfaz <code>XPathResult</code> está definida en{{ Source("dom/interfaces/xpath/nsIDOMXPathResult.idl", "here") }}.</p>
+
+<h3 id="Implementing_a_Default_Namespace_Resolver" name="Implementing_a_Default_Namespace_Resolver">Implementando un Solucionador de Namespace predefinido</h3>
+
+<p>Nosotros creamos un solucionador de namespace usando el método <code>createNSResolver</code> del objeto <a href="/en/DOM/document" title="en/DOM/document">document</a>.</p>
+
+<pre class="brush: js">var nsResolver = document.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement );
+</pre>
+
+<p><span class="comment">O alternativamente, usar el método <code>createNSResolver</code> de un objeto<code> XPathEvaluator</code>. </span></p>
+
+<pre><span class="comment">var xpEvaluator = new XPathEvaluator();
+var nsResolver = xpEvaluator.createNSResolver( contextNode.ownerDocument == null ? contextNode.documentElement : contextNode.ownerDocument.documentElement ); </span></pre>
+
+<p>Y entonces pasar a <code>document.evaluate</code> la variable <code>nsResolver</code>, como el parámetro <code>namespaceResolver</code>.</p>
+
+<p>Nota: XPath define QNames sin un prefijo sólo al igualar elementos en el namespace null. No hay manera en XPath de tomar el namespace predefinido tal como se aplica a un elemento de referencia regular (e.g., <code>p[@id='_myid']</code> for <code><span class="nowiki">xmlns='http://www.w3.org/1999/xhtml</span>'</code>). Para igualar elementos predefinidos en un namespace no-nulo, , se tiene que hacer refencia a un elemento en particular usando una forma como <code>['namespace-uri()='<span class="nowiki">http://www.w3.org/1999/xhtml</span>' and name()='p' and @id='_myid']</code> (este enfoque funciona bien para expresiones XPath dinámicas donde el namespace puede ser dessconocido) o usar un nombre de prueba prefijado, y crear un solucionador de namespace mapeando el prefijo al namespace. Lee más sobre como crear un solucionador de namespace definido por el usuario, si deseas tomar el último enfoque.</p>
+
+<h3 id="Notes" name="Notes">Notas</h3>
+
+<p>Se adapta cualquier nodo DOM a resolver namespaces, así que una expresión XPath puede ser fácilmente evaluada relativa al contexto del nodo donde este aparece dentro del documento. Este adaptador funciona como el método de DOM Nivel 3 <code>lookupNamespaceURI</code> en nodos a resolver el <code>namespaceURI</code> desde un prefijo dado, usando la información actual disponible en la jerarquía del nodo en el momento en que lookupNamespaceURI es llamado. También resuelve correctamente el prefijo implícito de XML.</p>
+
+<h3 id="Specifying_the_Return_Type" name="Specifying_the_Return_Type">Especificando el tipo de valor regresado</h3>
+
+<p>La variable regresado <code>xpathResult</code> desde <code>document.evaluate</code> puede estar compuesto de nodos individuales (tipos simples), o una colección de nodos (tipo de conjunto de nodos)</p>
+
+<h4 id="Simple_Types" name="Simple_Types">Tipos simples</h4>
+
+<p>Cuando el tipo de resultado deseado especificado en <code>resultType</code> es uno de los siguientes :</p>
+
+<ul>
+ <li><code>NUMBER_TYPE</code> - un doble</li>
+ <li><code>STRING_TYPE</code> - una cadena</li>
+ <li><code>BOOLEAN_TYPE</code> - un booleano</li>
+</ul>
+
+<p>Obtenemos el valor regresado por la expresión accediendo a las siguientes propiedades, respectivamente, del objeto <code>XPathResult</code>.</p>
+
+<ul>
+ <li><code>numberValue</code></li>
+ <li><code>stringValue</code></li>
+ <li><code>booleanValue</code></li>
+</ul>
+
+<h5 id="Example" name="Example">Ejemplo</h5>
+
+<p>El siguiente código usa la expresión XPath <code><a href="/en/XPath/Functions/count" title="en/XPath/Functions/count">count(//p)</a></code> para obtener el número de elementos &lt;p&gt; en un  documento HTML:</p>
+
+<pre class="brush: js  language-js"><code class="language-js"><span class="keyword token">var</span> paragraphCount <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">evaluate<span class="punctuation token">(</span></span> 'count<span class="comment token">(//p)', document, null, XPathResult.ANY_TYPE, null );
+</span>
+<span class="function token">alert<span class="punctuation token">(</span></span> <span class="string token">'This document contains '</span> <span class="operator token">+</span> paragraphCount<span class="punctuation token">.</span>numberValue <span class="operator token">+</span> <span class="string token">' paragraph elements'</span> <span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p>Aunque JavaScript nos permite convertir el número a una cadena para desplegarlo, la interfaz <code>XPath</code> no convertirá el resultado numérico si la propiedad <code>stringValue</code> es solicitada, así que el siguiente código no funcionará:</p>
+
+<pre class="brush: js">var paragraphCount = document.evaluate('count(//p)', document, null, XPathResult.ANY_TYPE, null );
+
+alert( 'This document contains ' + paragraphCount.stringValue + ' paragraph elements' );
+</pre>
+
+<p>A su vez, regresará una excepción con el código <code>NS_DOM_TYPE_ERROR</code>.</p>
+
+<h4 id="Node-Set_Types" name="Node-Set_Types">Tipos de conjuntos de Nodos</h4>
+
+<p>El objeto <code>XPathResult</code> permite a los conjuntos de nodos ser regresados en 3 diferentes tipos principales:</p>
+
+<ul>
+ <li><a href="#Iterators">Iteradores</a></li>
+ <li><a href="#Snapshots">Capturas</a></li>
+ <li><a href="#First_Node">Primeros nodos</a></li>
+</ul>
+
+<h5 id="Iterators" name="Iterators">Iteradores</h5>
+
+<p>Cuando el tipo de resultado especificado en el <code>resultType</code> es uno de los siguientes:</p>
+
+<ul>
+ <li><code>UNORDERED_NODE_ITERATOR_TYPE</code></li>
+ <li><code>ORDERED_NODE_ITERATOR_TYPE</code></li>
+</ul>
+
+<p>El objeto <code>XPathResult</code> regresado es un conjunto de nodos de los nodos coincidentes los cuales se comportarán como un iterador, perimitiendo el acceso individual a los nodos mediante el uso de método <span id="cke_bm_118S" style="display: none;"> </span><code>iterateNext()</code><span id="cke_bm_118E" style="display: none;"> </span> del <code>XPathResult</code><span id="cke_bm_119E" style="display: none;"> </span>.</p>
+
+<p>Una vez que hemos iterado sobre todos los nodos individuales coincidentes,<code> iterateNext()</code> regresará <code>null</code>.</p>
+
+<p>Es importante señalar que si el documento se ha transformado (el arbol del documento se ha modificado) entre iteraciones </p>
+
+<h6 id="Iterator_Example" name="Iterator_Example">Iterator Example</h6>
+
+<pre class="brush: js">var iterator = document.evaluate('//phoneNumber', documentNode, null, XPathResult.UNORDERED_NODE_ITERATOR_TYPE, null );
+
+try {
+  var thisNode = iterator.iterateNext();
+
+  while (thisNode) {
+    alert( thisNode.textContent );
+    thisNode = iterator.iterateNext();
+  }
+}
+catch (e) {
+  dump( 'Error: Document tree modified during iteration ' + e );
+}
+</pre>
+
+<h5 id="Snapshots" name="Snapshots">Snapshots</h5>
+
+<p>When the specified result type in the <code>resultType</code> parameter is either:</p>
+
+<ul>
+ <li><code>UNORDERED_NODE_SNAPSHOT_TYPE</code></li>
+ <li><code>ORDERED_NODE_SNAPSHOT_TYPE</code></li>
+</ul>
+
+<p>The <code>XPathResult</code> object returned is a static node-set of matched nodes, which allows us to access each node through the <code>snapshotItem(itemNumber)</code> method of the <code>XPathResult</code> object, where <code>itemNumber</code> is the index of the node to be retrieved. The total number of nodes contained can be accessed through the <code>snapshotLength</code> property.</p>
+
+<p>Snapshots do not change with document mutations, so unlike the iterators the snapshot does not become invalid, but it may not correspond to the current document, for example the nodes may have been moved, it might contain nodes that no longer exist, or new nodes could have been added.</p>
+
+<h6 id="Snapshot_Example" name="Snapshot_Example">Snapshot Example</h6>
+
+<pre class="brush: js">var nodesSnapshot = document.evaluate('//phoneNumber', documentNode, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );
+
+for ( var i=0 ; i &lt; nodesSnapshot.snapshotLength; i++ )
+{
+  dump( nodesSnapshot.snapshotItem(i).textContent );
+}
+</pre>
+
+<h5 id="First_Node" name="First_Node">First Node</h5>
+
+<p>When the specified result type in the <code>resultType</code> parameter is either:</p>
+
+<ul>
+ <li><code>ANY_UNORDERED_NODE_TYPE</code></li>
+ <li><code>FIRST_ORDERED_NODE_TYPE</code></li>
+</ul>
+
+<p>The <code>XPathResult</code> object returned is only the first found node that matched the XPath expression. This can be accessed through the <code>singleNodeValue</code> property of the <code>XPathResult</code> object. This will be <code>null</code> if the node set is empty.</p>
+
+<p>Note that, for the unordered subtype the single node returned might not be the first in document order, but for the ordered subtype you are guaranteed to get the first matched node in the document order.</p>
+
+<h6 id="First_Node_Example" name="First_Node_Example">First Node Example</h6>
+
+<pre class="brush: js">var firstPhoneNumber = document.evaluate('//phoneNumber', documentNode, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null );
+
+dump( 'The first phone number found is ' + firstPhoneNumber.singleNodeValue.textContent );
+</pre>
+
+<h4 id="The_ANY_TYPE_Constant" name="The_ANY_TYPE_Constant">The ANY_TYPE Constant</h4>
+
+<p>When the result type in the <code>resultType</code> parameter is specified as <code>ANY_TYPE</code>, the <code>XPathResult</code> object returned, will be whatever type that naturally results from the evaluation of the expression.</p>
+
+<p>It could be any of the simple types (<code>NUMBER_TYPE, STRING_TYPE, BOOLEAN_TYPE</code>), <strong>but</strong>, if the returned result type is a node-set then it will <strong>only</strong> be an <code>UNORDERED_NODE_ITERATOR_TYPE</code>.</p>
+
+<p>To determine that type after evaluation, we use the <code>resultType</code> property of the <code>XPathResult</code> object. The <a href="#XPathResult_Defined_Constants">constant</a> values of this property are defined in the appendix. <span class="comment">None Yet =====Any_Type Example===== &lt;pre&gt; &lt;/pre&gt;</span></p>
+
+<h2 id="Examples" name="Examples">Examples</h2>
+
+<h3 id="Within_an_HTML_Document" name="Within_an_HTML_Document">Within an HTML Document</h3>
+
+<p>The following code is intended to be placed in any JavaScript fragment within or linked to the HTML document against which the XPath expression is to be evaluated.</p>
+
+<p>To extract all the <code>&lt;h2&gt;</code> heading elements in an HTML document using XPath, the <code>xpathExpression</code> is simply '<code>//h2</code>'. Where, <code>//</code> is the Recursive Descent Operator that matches elements with the nodeName <code>h2</code> anywhere in the document tree. The full code for this is: <span class="comment">link to introductory xpath doc</span></p>
+
+<pre class="brush: js">var headings = document.evaluate('//h2', document, null, XPathResult.ANY_TYPE, null );
+</pre>
+
+<p>Notice that, since HTML does not have namespaces, we have passed <code>null</code> for the <code>namespaceResolver</code> parameter.</p>
+
+<p>Since we wish to search over the entire document for the headings, we have used the <a href="/en/DOM/document" title="en/DOM/document">document</a> object itself as the <code>contextNode</code>.</p>
+
+<p>The result of this expression is an <code>XPathResult</code> object. If we wish to know the type of result returned, we may evaluate the <code>resultType</code> property of the returned object. In this case, that will evaluate to <code>4</code>, an <code>UNORDERED_NODE_ITERATOR_TYPE</code>. This is the default return type when the result of the XPath expression is a node set. It provides access to a single node at a time and may not return nodes in a particular order. To access the returned nodes, we use the <code>iterateNext()</code> method of the returned object:</p>
+
+<pre class="brush: js">var thisHeading = headings.iterateNext();
+
+var alertText = 'Level 2 headings in this document are:\n'
+
+while (thisHeading) {
+  alertText += thisHeading.textContent + '\n';
+  thisHeading = headings.iterateNext();
+}
+</pre>
+
+<p>Once we iterate to a node, we have access to all the standard DOM interfaces on that node. After iterating through all the <code>h2</code> elements returned from our expression, any further calls to <code>iterateNext()</code> will return <code>null</code>.</p>
+
+<h3 id="Evaluating_against_an_XML_document_within_an_Extension" name="Evaluating_against_an_XML_document_within_an_Extension">Evaluating against an XML document within an Extension</h3>
+
+<p>The following uses an XML document located at <span class="nowiki">chrome://yourextension/content/peopleDB.xml</span> as an example.</p>
+
+<pre class="brush: xml">&lt;?xml version="1.0"?&gt;
+&lt;people xmlns:xul = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" &gt;
+  &lt;person&gt;
+	&lt;name first="george" last="bush" /&gt;
+	&lt;address street="1600 pennsylvania avenue" city="washington" country="usa"/&gt;
+	&lt;phoneNumber&gt;202-456-1111&lt;/phoneNumber&gt;
+  &lt;/person&gt;
+  &lt;person&gt;
+	&lt;name first="tony" last="blair" /&gt;
+	&lt;address street="10 downing street" city="london" country="uk"/&gt;
+	&lt;phoneNumber&gt;020 7925 0918&lt;/phoneNumber&gt;
+  &lt;/person&gt;
+&lt;/people&gt;
+</pre>
+
+<p>To make the contents of the XML document available within the extension, we create an <code><a href="/en/XMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a></code> object to load the document synchronously, the variable <code>xmlDoc</code> will contain the document as an <code><a href="/en/XMLDocument" title="en/XMLDocument">XMLDocument</a></code> object against which we can use the <code>evaluate</code> method</p>
+
+<p>JavaScript used in the extensions xul/js documents.</p>
+
+<pre class="brush: js">var req = new XMLHttpRequest();
+
+req.open("GET", "chrome://yourextension/content/peopleDB.xml", false);
+req.send(null);
+
+var xmlDoc = req.responseXML;
+
+var nsResolver = xmlDoc.createNSResolver( xmlDoc.ownerDocument == null ? xmlDoc.documentElement : xmlDoc.ownerDocument.documentElement);
+
+var personIterator = xmlDoc.evaluate('//person', xmlDoc, nsResolver, XPathResult.ANY_TYPE, null );
+</pre>
+
+<h3 id="Note">Note</h3>
+
+<p>When the XPathResult object is not defined, the constants can be retreived in privileged code using <code>Components.interfaces.nsIDOMXPathResult.ANY_TYPE</code> (<code>CI.nsIDOMXPathResult</code>). Similarly, an XPathEvaluator can be created using:</p>
+
+<pre class="brush: js">Components.classes["@mozilla.org/dom/xpath-evaluator;1"].createInstance(Components.interfaces.nsIDOMXPathEvaluator)</pre>
+
+<h2 id="Appendix" name="Appendix">Appendix</h2>
+
+<h4 id="Implementing_a_User_Defined_Namespace_Resolver" name="Implementing_a_User_Defined_Namespace_Resolver">Implementing a User Defined Namespace Resolver</h4>
+
+<p>This is an example for illustration only. This function will need to take namespace prefixes from the <code>xpathExpression</code> and return the URI that corresponds to that prefix. For example, the expression:</p>
+
+<pre>'//xhtml:td/mathml:math'
+</pre>
+
+<p>will select all <a href="/en/MathML" title="en/MathML">MathML</a> expressions that are the children of (X)HTML table data cell elements.</p>
+
+<p>In order to associate the '<code>mathml:</code>' prefix with the namespace URI '<code><span class="nowiki">http://www.w3.org/1998/Math/MathML</span></code>' and '<code>xhtml:</code>' with the URI '<code><span class="nowiki">http://www.w3.org/1999/xhtml</span></code>' we provide a function:</p>
+
+<pre class="brush: js">function nsResolver(prefix) {
+  var ns = {
+    'xhtml' : 'http://www.w3.org/1999/xhtml',
+    'mathml': 'http://www.w3.org/1998/Math/MathML'
+  };
+  return ns[prefix] || null;
+}
+</pre>
+
+<p>Our call to <code>document.evaluate</code> would then looks like:</p>
+
+<pre class="brush: js">document.evaluate( '//xhtml:td/mathml:math', document, nsResolver, XPathResult.ANY_TYPE, null );
+</pre>
+
+<h4 id="Implementing_a_default_namespace_for_XML_documents" name="Implementing_a_default_namespace_for_XML_documents">Implementing a default namespace for XML documents</h4>
+
+<p>As noted in the <a href="#Implementing_a_Default_Namespace_Resolver">Implementing a Default Namespace Resolver</a> previously, the default resolver does not handle the default namespace for XML documents. For example with this document:</p>
+
+<pre class="brush: xml">&lt;?xml version="1.0" encoding="UTF-8"?&gt;
+&lt;feed xmlns="http://www.w3.org/2005/Atom"&gt;
+    &lt;entry /&gt;
+    &lt;entry /&gt;
+    &lt;entry /&gt;
+&lt;/feed&gt;
+</pre>
+
+<p><code>doc.evaluate('//entry', doc, nsResolver, XPathResult.ANY_TYPE, null)</code> will return an empty set, where <code>nsResolver</code> is the resolver returned by <code>createNSResolver</code>. Passing a <code>null</code> resolver doesn't work any better, either.</p>
+
+<p>One possible workaround is to create a custom resolver that returns the correct default namespace (the Atom namespace in this case). Note that you still have to use some namespace prefix in your XPath expression, so that the resolver function will be able to change it to your required namespace. E.g.:</p>
+
+<pre class="brush: js">function resolver() {
+    return 'http://www.w3.org/2005/Atom';
+}
+doc.evaluate('//myns:entry', doc, resolver, XPathResult.ANY_TYPE, null)
+</pre>
+
+<p>Note that a more complex resolver will be required if the document uses multiple namespaces.</p>
+
+<p>An approach which might work better (and allow namespaces not to be known ahead of time) is described in the next section.</p>
+
+<h4 id="Using_XPath_functions_to_reference_elements_with_a_default_namespace" name="Using_XPath_functions_to_reference_elements_with_a_default_namespace">Using XPath functions to reference elements with a default namespace</h4>
+
+<p>Another approach to match default elements in a non-null namespace (and one which works well for dynamic XPath expressions where the namespaces might not be known), involves referring to a particular element using a form such as <code>[namespace-uri()='<span class="nowiki">http://www.w3.org/1999/xhtml</span>' and name()='p' and @id='_myid']</code>. This circumvents the problem of an XPath query not being able to detect the default namespace on a regularly labeled element.</p>
+
+<h4 id="Getting_specifically_namespaced_elements_and_attributes_regardless_of_prefix" name="Getting_specifically_namespaced_elements_and_attributes_regardless_of_prefix">Getting specifically namespaced elements and attributes regardless of prefix</h4>
+
+<p>If one wishes to provide flexibility in namespaces (as they are intended) by not necessarily requiring a particular prefix to be used when finding a namespaced element or attribute, one must use special techniques.</p>
+
+<p>While one can adapt the approach in the above section to test for namespaced elements regardless of the prefix chosen (using <code><a href="/en/XPath/Functions/local-name" title="en/XPath/Functions/local-name">local-name()</a></code> in combination with <code><a href="/en/XPath/Functions/namespace-uri" title="en/XPath/Functions/namespace-uri">namespace-uri()</a></code> instead of <code><a href="/en/XPath/Functions/name" title="en/XPath/Functions/name">name()</a></code>), a more challenging situation occurs, however, if one wishes to grab an element with a particular namespaced attribute in a predicate (given the absence of implementation-independent variables in XPath 1.0).</p>
+
+<p>For example, one might try (incorrectly) to grab an element with a namespaced attribute as follows: <code>var xpathlink = someElements[local-name(@*)="href" and namespace-uri(@*)='<span class="nowiki">http://www.w3.org/1999/xlink</span>'];</code></p>
+
+<p>This could inadvertently grab some elements if one of its attributes existed that had a local name of "<code>href</code>", but it was a different attribute which had the targeted (XLink) namespace (instead of <code><a href="/en/XPath/Axes/attribute" title="en/XPath/Axes/attribute">@href</a></code>).</p>
+
+<p>In order to accurately grab elements with the XLink <code>@href</code> attribute (without also being confined to predefined prefixes in a namespace resolver), one could obtain them as follows:</p>
+
+<pre class="brush: js">var xpathEls = 'someElements[@*[local-name() = "href" and namespace-uri() = "http://www.w3.org/1999/xlink"]]'; // Grabs elements with any single attribute that has both the local name 'href' and the XLink namespace
+var thislevel = xml.evaluate(xpathEls, xml, null, XPathResult.ANY_TYPE, null);
+var thisitemEl = thislevel.iterateNext();
+</pre>
+
+<h4 id="XPathResult_Defined_Constants" name="XPathResult_Defined_Constants">XPathResult Defined Constants</h4>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <td class="header">Result Type Defined Constant</td>
+   <td class="header">Value</td>
+   <td class="header">Description</td>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>ANY_TYPE</td>
+   <td>0</td>
+   <td>A result set containing whatever type naturally results from evaluation of the expression. Note that if the result is a node-set then UNORDERED_NODE_ITERATOR_TYPE is always the resulting type.</td>
+  </tr>
+  <tr>
+   <td>NUMBER_TYPE</td>
+   <td>1</td>
+   <td>A result containing a single number. This is useful for example, in an XPath expression using the <code>count()</code> function.</td>
+  </tr>
+  <tr>
+   <td>STRING_TYPE</td>
+   <td>2</td>
+   <td>A result containing a single string.</td>
+  </tr>
+  <tr>
+   <td>BOOLEAN_TYPE</td>
+   <td>3</td>
+   <td>A result containing a single boolean value. This is useful for example, in an XPath expression using the <code>not()</code> function.</td>
+  </tr>
+  <tr>
+   <td>UNORDERED_NODE_ITERATOR_TYPE</td>
+   <td>4</td>
+   <td>A result node-set containing all the nodes matching the expression. The nodes may not necessarily be in the same order that they appear in the document.</td>
+  </tr>
+  <tr>
+   <td>ORDERED_NODE_ITERATOR_TYPE</td>
+   <td>5</td>
+   <td>A result node-set containing all the nodes matching the expression. The nodes in the result set are in the same order that they appear in the document.</td>
+  </tr>
+  <tr>
+   <td>UNORDERED_NODE_SNAPSHOT_TYPE</td>
+   <td>6</td>
+   <td>A result node-set containing snapshots of all the nodes matching the expression. The nodes may not necessarily be in the same order that they appear in the document.</td>
+  </tr>
+  <tr>
+   <td>ORDERED_NODE_SNAPSHOT_TYPE</td>
+   <td>7</td>
+   <td>A result node-set containing snapshots of all the nodes matching the expression. The nodes in the result set are in the same order that they appear in the document.</td>
+  </tr>
+  <tr>
+   <td>ANY_UNORDERED_NODE_TYPE</td>
+   <td>8</td>
+   <td>A result node-set containing any single node that matches the expression. The node is not necessarily the first node in the document that matches the expression.</td>
+  </tr>
+  <tr>
+   <td>FIRST_ORDERED_NODE_TYPE</td>
+   <td>9</td>
+   <td>A result node-set containing the first node in the document that matches the expression.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="See_also" name="See_also">See also</h2>
+
+<ul>
+ <li><a href="/en/Using_XPath" title="en/Using_XPath">Using XPath</a></li>
+</ul>
+
+<div class="originaldocinfo">
+<h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2>
+
+<ul>
+ <li>Based Upon Original Document <a class="external" href="http://www-xray.ast.cam.ac.uk/~jgraham/mozilla/xpath-tutorial.html">Mozilla XPath Tutorial</a></li>
+ <li>Original Source Author: James Graham.</li>
+ <li>Other Contributors: James Thompson.</li>
+ <li>Last Updated Date: 2006-3-25.</li>
+</ul>
+</div>
+
+<p> </p>
diff --git a/files/es/web/xslt/apply-imports/index.html b/files/es/web/xslt/apply-imports/index.html
deleted file mode 100644
index 05d3429202..0000000000
--- a/files/es/web/xslt/apply-imports/index.html
+++ /dev/null
@@ -1,36 +0,0 @@
----
-title: apply-imports
-slug: Web/XSLT/apply-imports
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/apply-imports
----
-<p>{{XsltRef}}</p>
-
-<p><br>
- El elemento <code>&lt;xsl:apply-imports&gt;</code> es complejo en su uso, y es utilizado mayoritariamente en hojas de estilo muy complejas. La precedencia de importación indica que las plantillas en la hoja de estilo principal tienen mayor precedencia que las plantillas en las hojas de estilo importadas. Sin embargo, en ocasiones es útil forzar al procesador para que aplique una plantilla de menor procedencia contenida en la hoja de estilo importada en lugar de una plantilla equivalente en la hoja de estilo principal.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:apply-imports/&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 5.6.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/apply-templates/index.html b/files/es/web/xslt/apply-templates/index.html
deleted file mode 100644
index cb4063eada..0000000000
--- a/files/es/web/xslt/apply-templates/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: apply-templates
-slug: Web/XSLT/apply-templates
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/apply-templates
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:apply-templates&gt;</code> selecciona un conjunto de nodos del documento de entrada e instruye al procesador para aplicar las plantillas apropiadas a ellos.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:apply-templates select=EXPRESION mode=NOMBRE&gt;
-	&lt;xsl:with-param&gt; [opcional]
-	&lt;xsl:sort&gt; [opcional]
-&lt;/xsl:apply-templates&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>select</code></dt>
- <dd>Usa una expresión XPath para indicar los nodos a ser procesados. Un asterisco(<code>*</code>) selecciona por completo el conjunto de nodos. Si el atributo no se establece, todos los nodos hijos del nodo actual son seleccionados.</dd>
- <dt><code>mode</code></dt>
- <dd>Si existend diferentes maneras definidas de procesar el mismo nodo, se distingue entre ellas.</dd>
-</dl>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT sección 5.4.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/attribute-set/index.html b/files/es/web/xslt/attribute-set/index.html
deleted file mode 100644
index c202895db0..0000000000
--- a/files/es/web/xslt/attribute-set/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: attribute-set
-slug: Web/XSLT/attribute-set
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/attribute-set
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:attribute-set&gt;</code> genera un conjunto con nombre de atributos, el cual puede ser aplicado al documento de salida, de una manera similar a los estilos con nombre dentro de CSS.</p>
-
-<h3 id="Sintaxi" name="Sintaxi">Sintaxi</h3>
-
-<pre>&lt;xsl:attribute-set name=NOMBRE use-attribute-sets=LISTA-DE-NOMBRES&gt;
-	&lt;xsl:attribute&gt;
-&lt;/xsl:attribute-set&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>Indica el nombre del conjunto de elementos. El nombre debe seguir las reglas QName.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>use-attribute-sets</code></dt>
- <dd>Genera un conjunto de elementos a partir de otros conjuntos de atributos. Los nombres de los conjuntos deben estar separados por espacios en blanco y no se deben solapar directa o indirectamente.</dd>
-</dl>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Debe ser hijo del elemento <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 7.1.4.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado</p>
diff --git a/files/es/web/xslt/attribute/index.html b/files/es/web/xslt/attribute/index.html
deleted file mode 100644
index 91d7985678..0000000000
--- a/files/es/web/xslt/attribute/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: attribute
-slug: Web/XSLT/attribute
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/attribute
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:attribute&gt;</code> genera un atributo en el documento de salida, usando cualquier valor que puede ser accedido desde la hoja de estilo. Este elemento tiene que ser la primer cosa que se encuentre dentro del elemento del documento de salida para el cual se desea generar el atributo.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:attribute name=NOMBRE namespace=URI&gt;
-	PLANTILLA
-&lt;/xsl:attribute&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>Indica el nombre del atributo a ser generado en el documento de salida. El nombre debe seguir las reglas de QName.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>namespace</code></dt>
- <dd>Define el URI del nombre de espacio para el atributo en el documento de salida. No se puede especificar el prefijo del nombre de espacio con este elemento.</dd>
-</dl>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla o dentro del elemento <code>&lt;xsl:attribute-set&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 7.1.3.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/call-template/index.html b/files/es/web/xslt/call-template/index.html
deleted file mode 100644
index deba6a8adb..0000000000
--- a/files/es/web/xslt/call-template/index.html
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: call-template
-slug: Web/XSLT/call-template
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/call-template
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:call-template&gt;</code> invoca una plantilla con nombre.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:call-template name=NOMBRE&gt;
-	&lt;xsl:with-param&gt; [opcional]
-&lt;/xsl:call-template&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>Indica el nombre del template que se desea invocar.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 6.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/choose/index.html b/files/es/web/xslt/choose/index.html
deleted file mode 100644
index 10dd0a2f5f..0000000000
--- a/files/es/web/xslt/choose/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
----
-title: choose
-slug: Web/XSLT/choose
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/choose
----
-<p>{{XsltRef}}<br>
- El elemento <code>&lt;xsl:choose&gt;</code> define una elección entre un número de alternativas. Funciona como una sentencia switch en los lenguajes procedurales.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:choose&gt;
-	&lt;xsl:when&gt;
-	&lt;xsl:otherwise&gt; [opcional]
-&lt;/&lt;xsl:choose&gt;</pre>
-
-<h3 id="Atributos_necesarios" name="Atributos_necesarios">Atributos necesarios</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece con una plantilla. Contiene uno o mas elementos <code>&lt;xsl:when&gt;</code>, y, opcionalmente, un elemento <code>&lt;xsl:otherwise&gt;</code> final.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 9.2.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/comment/index.html b/files/es/web/xslt/comment/index.html
deleted file mode 100644
index a55f777703..0000000000
--- a/files/es/web/xslt/comment/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
----
-title: comment
-slug: Web/XSLT/comment
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/comment
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:comment&gt;</code> escribe un comentario en el documento de salida. Debe incluir sólo texto.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:comment&gt;
-	TEMPLATE
-&lt;/xsl:comment&gt; </pre>
-
-<h3 id="Atributos_necesarios" name="Atributos_necesarios">Atributos necesarios</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 7.4.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/copy-of/index.html b/files/es/web/xslt/copy-of/index.html
deleted file mode 100644
index e4f2fbca2d..0000000000
--- a/files/es/web/xslt/copy-of/index.html
+++ /dev/null
@@ -1,38 +0,0 @@
----
-title: copy-of
-slug: Web/XSLT/copy-of
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/copy-of
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:copy-of&gt;</code> crea una copia completa (incluyendo nodos descendientes) en el documento de salida de lo que sea que indique el atributo.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:copy-of select=EXPRESIÓN /&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>select</code></dt>
- <dd>Indica la expresión XPath a utilizar para seleccionar lo que será copiado.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 11.3.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/copy/index.html b/files/es/web/xslt/copy/index.html
deleted file mode 100644
index 32ddbff1ae..0000000000
--- a/files/es/web/xslt/copy/index.html
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: copy
-slug: Web/XSLT/copy
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/copy
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:copy&gt;</code> genera una copia superficial (el nodo y cualquier nodo del nombre de espacio asociado) del nodo actual al documento de salida. Este elemento no copia ni elementos hijo ni atributos del nodo actual.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:copy use-attribute-sets=LISTA-DE-NOMBRES&gt;
-	PLANTILLA
-&lt;/xsl:copy&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>use-attribute-sets</code></dt>
- <dd>Lista conjunto de atributos que debería de ser aplicados al nodo de salida, si es un elemento. Los nombres del conjunto deben de estar separados por un espacio en blanco.</dd>
-</dl>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 7.5.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Suportado.</p>
diff --git a/files/es/web/xslt/decimal-format/index.html b/files/es/web/xslt/decimal-format/index.html
deleted file mode 100644
index e42e9ab149..0000000000
--- a/files/es/web/xslt/decimal-format/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: decimal-format
-slug: Web/XSLT/decimal-format
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/decimal-format
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:decimal-format&gt;</code> define los caracteres y los símbolos que serán usados en la conversión de números a cadenas de texto usando la función <code>format-number( )</code>.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:decimal-format
-	name=NOMBRE
-	decimal-separator=CARACTER
-	grouping-separator=CARACTER
-	infinity=TEXTO
-	minus-sign=CARACTER
-	NaN=TEXTO
-	percent=CARACTER
-	per-mille=CARACTER
-	zero-digit=CARACTER
-	digit=CARACTER
-	pattern-separator=CARACTER /&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>Indica el nombre que tendrá este formato.</dd>
-</dl>
-
-<dl>
- <dt><code>decimal-separator</code></dt>
- <dd>Indica el caracter a ser usado como punto decimal. El valor por defecto es (<code>.</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>grouping-separator</code></dt>
- <dd>Indica el separador de miles. El valor por defecto es (<code>,</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>infinity</code></dt>
- <dd>Indica el texto a ser usado para representar el valor de infinito. El valor por defecto es la cadena de texto "<code>Infinity</code>".</dd>
-</dl>
-
-<dl>
- <dt><code>minus-sign</code></dt>
- <dd>Indica el caracter a ser usado como signo negativo. El valor por defecto es el guión (<code>-</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>NaN</code></dt>
- <dd>Indica la cadena de texto a ser usado cuando el valor no es un número. El valor por defecto es la cadena de texto "<code>NaN</code>".</dd>
-</dl>
-
-<dl>
- <dt><code>percent</code></dt>
- <dd>Indica el caracter a ser usado como signo de porcentaje. El valor por defecto es (<code>%</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>per-mille</code></dt>
- <dd>Indica el separador de miles. El valor por defecto es (<code>‰</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>zero-digit</code></dt>
- <dd>Indica el caracter para el cero. El valor por defecto es (<code>0</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>digit</code></dt>
- <dd>Indica el caracter a ser usado en los patrones de formato para indicar un dígito. El valor por defecto es (<code>#</code>).</dd>
-</dl>
-
-<dl>
- <dt><code>pattern-separator</code></dt>
- <dd>Indica el caracter para separar patrones de formato negativos y positivos. El valor por defecto es el punto y coma (<code>;</code>).</dd>
-</dl>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Elemento raíz, debe ser hijo de elemento <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 12.3.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado desde la versión 1.0 (Mozilla 1.0, Netscape 7.0).</p>
diff --git a/files/es/web/xslt/element/apply-imports/index.html b/files/es/web/xslt/element/apply-imports/index.html
new file mode 100644
index 0000000000..85c218f6c0
--- /dev/null
+++ b/files/es/web/xslt/element/apply-imports/index.html
@@ -0,0 +1,37 @@
+---
+title: apply-imports
+slug: Web/XSLT/Element/apply-imports
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/apply-imports
+original_slug: Web/XSLT/apply-imports
+---
+<p>{{XsltRef}}</p>
+
+<p><br>
+ El elemento <code>&lt;xsl:apply-imports&gt;</code> es complejo en su uso, y es utilizado mayoritariamente en hojas de estilo muy complejas. La precedencia de importación indica que las plantillas en la hoja de estilo principal tienen mayor precedencia que las plantillas en las hojas de estilo importadas. Sin embargo, en ocasiones es útil forzar al procesador para que aplique una plantilla de menor procedencia contenida en la hoja de estilo importada en lugar de una plantilla equivalente en la hoja de estilo principal.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:apply-imports/&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 5.6.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/apply-templates/index.html b/files/es/web/xslt/element/apply-templates/index.html
new file mode 100644
index 0000000000..7eb87c9d4d
--- /dev/null
+++ b/files/es/web/xslt/element/apply-templates/index.html
@@ -0,0 +1,44 @@
+---
+title: apply-templates
+slug: Web/XSLT/Element/apply-templates
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/apply-templates
+original_slug: Web/XSLT/apply-templates
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:apply-templates&gt;</code> selecciona un conjunto de nodos del documento de entrada e instruye al procesador para aplicar las plantillas apropiadas a ellos.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:apply-templates select=EXPRESION mode=NOMBRE&gt;
+	&lt;xsl:with-param&gt; [opcional]
+	&lt;xsl:sort&gt; [opcional]
+&lt;/xsl:apply-templates&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>select</code></dt>
+ <dd>Usa una expresión XPath para indicar los nodos a ser procesados. Un asterisco(<code>*</code>) selecciona por completo el conjunto de nodos. Si el atributo no se establece, todos los nodos hijos del nodo actual son seleccionados.</dd>
+ <dt><code>mode</code></dt>
+ <dd>Si existend diferentes maneras definidas de procesar el mismo nodo, se distingue entre ellas.</dd>
+</dl>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT sección 5.4.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/attribute-set/index.html b/files/es/web/xslt/element/attribute-set/index.html
new file mode 100644
index 0000000000..04f813eb1a
--- /dev/null
+++ b/files/es/web/xslt/element/attribute-set/index.html
@@ -0,0 +1,44 @@
+---
+title: attribute-set
+slug: Web/XSLT/Element/attribute-set
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/attribute-set
+original_slug: Web/XSLT/attribute-set
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:attribute-set&gt;</code> genera un conjunto con nombre de atributos, el cual puede ser aplicado al documento de salida, de una manera similar a los estilos con nombre dentro de CSS.</p>
+
+<h3 id="Sintaxi" name="Sintaxi">Sintaxi</h3>
+
+<pre>&lt;xsl:attribute-set name=NOMBRE use-attribute-sets=LISTA-DE-NOMBRES&gt;
+	&lt;xsl:attribute&gt;
+&lt;/xsl:attribute-set&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>Indica el nombre del conjunto de elementos. El nombre debe seguir las reglas QName.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>use-attribute-sets</code></dt>
+ <dd>Genera un conjunto de elementos a partir de otros conjuntos de atributos. Los nombres de los conjuntos deben estar separados por espacios en blanco y no se deben solapar directa o indirectamente.</dd>
+</dl>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Debe ser hijo del elemento <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 7.1.4.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado</p>
diff --git a/files/es/web/xslt/element/attribute/index.html b/files/es/web/xslt/element/attribute/index.html
new file mode 100644
index 0000000000..37cada6fb5
--- /dev/null
+++ b/files/es/web/xslt/element/attribute/index.html
@@ -0,0 +1,44 @@
+---
+title: attribute
+slug: Web/XSLT/Element/attribute
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/attribute
+original_slug: Web/XSLT/attribute
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:attribute&gt;</code> genera un atributo en el documento de salida, usando cualquier valor que puede ser accedido desde la hoja de estilo. Este elemento tiene que ser la primer cosa que se encuentre dentro del elemento del documento de salida para el cual se desea generar el atributo.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:attribute name=NOMBRE namespace=URI&gt;
+	PLANTILLA
+&lt;/xsl:attribute&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>Indica el nombre del atributo a ser generado en el documento de salida. El nombre debe seguir las reglas de QName.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>namespace</code></dt>
+ <dd>Define el URI del nombre de espacio para el atributo en el documento de salida. No se puede especificar el prefijo del nombre de espacio con este elemento.</dd>
+</dl>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla o dentro del elemento <code>&lt;xsl:attribute-set&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 7.1.3.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/call-template/index.html b/files/es/web/xslt/element/call-template/index.html
new file mode 100644
index 0000000000..788aa9a1e0
--- /dev/null
+++ b/files/es/web/xslt/element/call-template/index.html
@@ -0,0 +1,41 @@
+---
+title: call-template
+slug: Web/XSLT/Element/call-template
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/call-template
+original_slug: Web/XSLT/call-template
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:call-template&gt;</code> invoca una plantilla con nombre.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:call-template name=NOMBRE&gt;
+	&lt;xsl:with-param&gt; [opcional]
+&lt;/xsl:call-template&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>Indica el nombre del template que se desea invocar.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 6.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/choose/index.html b/files/es/web/xslt/element/choose/index.html
new file mode 100644
index 0000000000..344a996687
--- /dev/null
+++ b/files/es/web/xslt/element/choose/index.html
@@ -0,0 +1,38 @@
+---
+title: choose
+slug: Web/XSLT/Element/choose
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/choose
+original_slug: Web/XSLT/choose
+---
+<p>{{XsltRef}}<br>
+ El elemento <code>&lt;xsl:choose&gt;</code> define una elección entre un número de alternativas. Funciona como una sentencia switch en los lenguajes procedurales.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:choose&gt;
+	&lt;xsl:when&gt;
+	&lt;xsl:otherwise&gt; [opcional]
+&lt;/&lt;xsl:choose&gt;</pre>
+
+<h3 id="Atributos_necesarios" name="Atributos_necesarios">Atributos necesarios</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece con una plantilla. Contiene uno o mas elementos <code>&lt;xsl:when&gt;</code>, y, opcionalmente, un elemento <code>&lt;xsl:otherwise&gt;</code> final.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 9.2.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/comment/index.html b/files/es/web/xslt/element/comment/index.html
new file mode 100644
index 0000000000..025138aefa
--- /dev/null
+++ b/files/es/web/xslt/element/comment/index.html
@@ -0,0 +1,38 @@
+---
+title: comment
+slug: Web/XSLT/Element/comment
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/comment
+original_slug: Web/XSLT/comment
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:comment&gt;</code> escribe un comentario en el documento de salida. Debe incluir sólo texto.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:comment&gt;
+	TEMPLATE
+&lt;/xsl:comment&gt; </pre>
+
+<h3 id="Atributos_necesarios" name="Atributos_necesarios">Atributos necesarios</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 7.4.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/copy-of/index.html b/files/es/web/xslt/element/copy-of/index.html
new file mode 100644
index 0000000000..5ecd743ee0
--- /dev/null
+++ b/files/es/web/xslt/element/copy-of/index.html
@@ -0,0 +1,39 @@
+---
+title: copy-of
+slug: Web/XSLT/Element/copy-of
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/copy-of
+original_slug: Web/XSLT/copy-of
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:copy-of&gt;</code> crea una copia completa (incluyendo nodos descendientes) en el documento de salida de lo que sea que indique el atributo.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:copy-of select=EXPRESIÓN /&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>select</code></dt>
+ <dd>Indica la expresión XPath a utilizar para seleccionar lo que será copiado.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 11.3.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/copy/index.html b/files/es/web/xslt/element/copy/index.html
new file mode 100644
index 0000000000..289c57ce95
--- /dev/null
+++ b/files/es/web/xslt/element/copy/index.html
@@ -0,0 +1,41 @@
+---
+title: copy
+slug: Web/XSLT/Element/copy
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/copy
+original_slug: Web/XSLT/copy
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:copy&gt;</code> genera una copia superficial (el nodo y cualquier nodo del nombre de espacio asociado) del nodo actual al documento de salida. Este elemento no copia ni elementos hijo ni atributos del nodo actual.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:copy use-attribute-sets=LISTA-DE-NOMBRES&gt;
+	PLANTILLA
+&lt;/xsl:copy&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>use-attribute-sets</code></dt>
+ <dd>Lista conjunto de atributos que debería de ser aplicados al nodo de salida, si es un elemento. Los nombres del conjunto deben de estar separados por un espacio en blanco.</dd>
+</dl>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 7.5.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Suportado.</p>
diff --git a/files/es/web/xslt/element/decimal-format/index.html b/files/es/web/xslt/element/decimal-format/index.html
new file mode 100644
index 0000000000..43d687f8fb
--- /dev/null
+++ b/files/es/web/xslt/element/decimal-format/index.html
@@ -0,0 +1,100 @@
+---
+title: decimal-format
+slug: Web/XSLT/Element/decimal-format
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/decimal-format
+original_slug: Web/XSLT/decimal-format
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:decimal-format&gt;</code> define los caracteres y los símbolos que serán usados en la conversión de números a cadenas de texto usando la función <code>format-number( )</code>.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:decimal-format
+	name=NOMBRE
+	decimal-separator=CARACTER
+	grouping-separator=CARACTER
+	infinity=TEXTO
+	minus-sign=CARACTER
+	NaN=TEXTO
+	percent=CARACTER
+	per-mille=CARACTER
+	zero-digit=CARACTER
+	digit=CARACTER
+	pattern-separator=CARACTER /&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>Indica el nombre que tendrá este formato.</dd>
+</dl>
+
+<dl>
+ <dt><code>decimal-separator</code></dt>
+ <dd>Indica el caracter a ser usado como punto decimal. El valor por defecto es (<code>.</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>grouping-separator</code></dt>
+ <dd>Indica el separador de miles. El valor por defecto es (<code>,</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>infinity</code></dt>
+ <dd>Indica el texto a ser usado para representar el valor de infinito. El valor por defecto es la cadena de texto "<code>Infinity</code>".</dd>
+</dl>
+
+<dl>
+ <dt><code>minus-sign</code></dt>
+ <dd>Indica el caracter a ser usado como signo negativo. El valor por defecto es el guión (<code>-</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>NaN</code></dt>
+ <dd>Indica la cadena de texto a ser usado cuando el valor no es un número. El valor por defecto es la cadena de texto "<code>NaN</code>".</dd>
+</dl>
+
+<dl>
+ <dt><code>percent</code></dt>
+ <dd>Indica el caracter a ser usado como signo de porcentaje. El valor por defecto es (<code>%</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>per-mille</code></dt>
+ <dd>Indica el separador de miles. El valor por defecto es (<code>‰</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>zero-digit</code></dt>
+ <dd>Indica el caracter para el cero. El valor por defecto es (<code>0</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>digit</code></dt>
+ <dd>Indica el caracter a ser usado en los patrones de formato para indicar un dígito. El valor por defecto es (<code>#</code>).</dd>
+</dl>
+
+<dl>
+ <dt><code>pattern-separator</code></dt>
+ <dd>Indica el caracter para separar patrones de formato negativos y positivos. El valor por defecto es el punto y coma (<code>;</code>).</dd>
+</dl>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Elemento raíz, debe ser hijo de elemento <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 12.3.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado desde la versión 1.0 (Mozilla 1.0, Netscape 7.0).</p>
diff --git a/files/es/web/xslt/element/fallback/index.html b/files/es/web/xslt/element/fallback/index.html
new file mode 100644
index 0000000000..684df7d6e0
--- /dev/null
+++ b/files/es/web/xslt/element/fallback/index.html
@@ -0,0 +1,39 @@
+---
+title: fallback
+slug: Web/XSLT/Element/fallback
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/fallback
+original_slug: Web/XSLT/fallback
+---
+<p>{{XsltRef}}</p>
+
+<p><br>
+ El elemento <code>&lt;xsl:fallback&gt;</code> indica la plantilla a usar en caso de que algun elemento extendido (o, eventualmente, una nueva versión) no esté soportado.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:fallback&gt;
+	PLANTILLA
+&lt;/xsl:fallback&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 15</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Sin soporte por el momento.</p>
diff --git a/files/es/web/xslt/element/for-each/index.html b/files/es/web/xslt/element/for-each/index.html
new file mode 100644
index 0000000000..99d66d9110
--- /dev/null
+++ b/files/es/web/xslt/element/for-each/index.html
@@ -0,0 +1,43 @@
+---
+title: for-each
+slug: Web/XSLT/Element/for-each
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/for-each
+original_slug: Web/XSLT/for-each
+---
+<p>{{XsltRef}}</p>
+
+<p><br>
+ El elemento <code>&lt;xsl:for-each&gt;</code> selecciona un conjunto de nodos y procesa cada uno de ellos de la misma manera. Se usa comúnmente para iterar a través de un conjunto de nodos o para cambiar el nodo actual. Si se encuentran uno o más elementos <code>&lt;xsl:sort&gt;</code> como hijos de este elemento, el ordenado de los nodos ocurrirá antes del procesamiento. De otra manera, los nodos se procesarán en el orden del documento.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:for-each select=EXPRESIÓN&gt;
+	&lt;xsl:sort&gt; [opcional]
+	PLANTILLA
+&lt;/xsl:for-each&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>select</code></dt>
+ <dd>Usa una expresión XPath para seleccionar los nodos a ser procesados.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 8.</p>
+
+<h3 id="Gecko_support" name="Gecko_support">Gecko support</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/if/index.html b/files/es/web/xslt/element/if/index.html
new file mode 100644
index 0000000000..30faaf03bd
--- /dev/null
+++ b/files/es/web/xslt/element/if/index.html
@@ -0,0 +1,40 @@
+---
+title: if
+slug: Web/XSLT/Element/if
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/if
+original_slug: Web/XSLT/if
+---
+<p>{{XsltRef}}<br>
+ El elemento &lt;xsl:if&gt; contiene un atributo a probar y una plantilla. Si el atributo resulta verdadero, la plantilla es procesada. Este comportamiento es similar a la sentencia if de otros lenguajes. Sin embargo, para conseguir la funcionalidad de una sentencia if-then-else, es necesario utilizar el elemento &lt;xsl:choose&gt; con un elemento hijo &lt;xsl:when&gt;, y otro elemento hijo &lt;xsl:otherwise&gt;</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:if test=EXPRESSION&gt;
+	TEMPLATE
+&lt;/xsl:if&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>test</code></dt>
+ <dd>Contiene una expresión XPath que puede ser evaluada (usando las reglas definidas para <code>boolean( )</code> si es necesario) como un valor boleano. Si el valor resulta verdadero, la plantilla es procesada; si resulta falso, no se lleva a cabo ninguna acción.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSL sección 9.1.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado</p>
diff --git a/files/es/web/xslt/element/import/index.html b/files/es/web/xslt/element/import/index.html
new file mode 100644
index 0000000000..b985d3c7eb
--- /dev/null
+++ b/files/es/web/xslt/element/import/index.html
@@ -0,0 +1,40 @@
+---
+title: import
+slug: Web/XSLT/Element/import
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/import
+original_slug: Web/XSLT/import
+---
+<p>{{XsltRef}}</p>
+
+<p><br>
+ El elemento <code>&lt;xsl:import&gt;</code> sirve para importar el contenido de una hoja de estilo dentro de otra hoja de estilo. En general, el contenido de la hoja de estilo importada tiene una menor precedencia que el contenido de la hoja de estilo que la importa. Esto contrasta con el elemento <code>&lt;xsl:include&gt;</code> en el que el contenido de la hoja de estilo incluida tiene exactamente la misma precedencia que el contenido de la hoja de estilo que la incluye.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:import href=URI  /&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>href</code></dt>
+ <dd>URI de la hoja de estilo a importar.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Nivel raíz, debe aparecer antes de cualquier otro hijo de <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code> en la hoja de estilo que la importa.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 2.6.2.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Casi completamente soportado, con tan solo algunos detalles con variables de nivel raíz y parámetros desde Mozilla 1.0.</p>
diff --git a/files/es/web/xslt/element/include/index.html b/files/es/web/xslt/element/include/index.html
new file mode 100644
index 0000000000..93ab0f3cd6
--- /dev/null
+++ b/files/es/web/xslt/element/include/index.html
@@ -0,0 +1,40 @@
+---
+title: include
+slug: Web/XSLT/Element/include
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/include
+original_slug: Web/XSLT/include
+---
+<p>{{XsltRef}}</p>
+
+<p><br>
+ El elemento <code>&lt;xsl:include&gt;</code> une el contenido de una hoja de estilo con otra. A diferencia del elemento <code>&lt;xsl:import&gt;</code>, el contenido de la hoja de estilo incluida tiene exactamente la misma precedencia que el contenido de la hoja de estilo que la incluye.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:include href=URI /&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>href</code></dt>
+ <dd>Indica el URI de la hoja de estilo a incluir.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Elemento raíz, puede aparecer en cualquier orden siendo hijo del elemento <code>&lt;xsl:stylesheet&gt;</code> o el elemento <code>&lt;xsl:transform&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 2.6.1.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/key/index.html b/files/es/web/xslt/element/key/index.html
new file mode 100644
index 0000000000..d182180297
--- /dev/null
+++ b/files/es/web/xslt/element/key/index.html
@@ -0,0 +1,45 @@
+---
+title: key
+slug: Web/XSLT/Element/key
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/key
+original_slug: Web/XSLT/key
+---
+<p>{{XsltRef}}</p>
+
+<p><br>
+ El elemento <code>&lt;xsl:key&gt;</code> declara una llave con nombre la cual puede ser usada en otro lugar dentro de la hoja de estilo usando la función <code>key( )</code>.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:key name=NOMBRE match=EXPRESIÓN
+	use=EXPRESIÓN /&gt; </pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>Indica el nombre para esta llave. Debe seguir las reglas de tipo QName.</dd>
+ <dt><code>match</code></dt>
+ <dd>Define el nodo para el que esta llave aplica.</dd>
+ <dt><code>use</code></dt>
+ <dd>Indica la expresión XPath que se usará para determinar el valor de la llave para cada uno de los nodos aplicables.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Elemento raíz, debe ser hijo del elemento <code>&lt;xsl:stylesheet&gt;</code> o del elemento <code>&lt;xsl:transform&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 12.2.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/message/index.html b/files/es/web/xslt/element/message/index.html
new file mode 100644
index 0000000000..4566885c45
--- /dev/null
+++ b/files/es/web/xslt/element/message/index.html
@@ -0,0 +1,41 @@
+---
+title: message
+slug: Web/XSLT/Element/message
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/message
+original_slug: Web/XSLT/message
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:message&gt;</code> muestra un mensaje (en la consola JavaScript en NS) y opcionalmente termina la ejecución de la hoja de estilos. Puede ser util para depuración.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:message terminate="yes" | "no" &gt;
+	PLANTILLA
+&lt;/xsl:message&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>terminate</code></dt>
+ <dd>Establecido a "<code>yes</code>", indica que debe terminar la ejecución. El valor por defecto es "<code>no</code>", en cuyo caso se muestra el mensaje y continúa la ejecución.</dd>
+</dl>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Instrucción, aparece dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 13.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/namespace-alias/index.html b/files/es/web/xslt/element/namespace-alias/index.html
new file mode 100644
index 0000000000..f7f7cab6b6
--- /dev/null
+++ b/files/es/web/xslt/element/namespace-alias/index.html
@@ -0,0 +1,43 @@
+---
+title: namespace-alias
+slug: Web/XSLT/Element/namespace-alias
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/namespace-alias
+original_slug: Web/XSLT/namespace-alias
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:namespace-alias&gt;</code> es un mecanismo raramente usado para asociar un nombre de espacios en la hoja de estilos a otro nombre de espacios diferente en el árbol de salida. El uso más común para este elemento se da en la generación de una hoja de estilos a partir de otra hoja de estilos.</p>
+
+<p>Para prevenir que la cadena literal para el prefijo <code>xsl:</code> del elemento resultante (que simplemente debería ser copiada al árbol resultante) sea malinterpretada por el procesador, se le asigna temporalmente un nombre de espacio diferente que posteriormente es reconvertida al nombre de espacios de XSLT en el árbol de salida.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:namespace-alias stylesheet-prefix=NOMBRE result-prefix=NOMBRE /&gt;</pre>
+
+<h3 id="Atributos_Requeridos" name="Atributos_Requeridos">Atributos Requeridos</h3>
+
+<dl>
+ <dt><code>stylesheet-prefix</code></dt>
+ <dd>Indica el nombre de espacios temporal.</dd>
+ <dt><code>result-prefix</code></dt>
+ <dd>Indica el nombre de espacios deseado en el árbol de salida.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Debe ser hijo directo de <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 7.1.1</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Sin soporte por el momento.</p>
diff --git a/files/es/web/xslt/element/number/index.html b/files/es/web/xslt/element/number/index.html
new file mode 100644
index 0000000000..519c2361c2
--- /dev/null
+++ b/files/es/web/xslt/element/number/index.html
@@ -0,0 +1,170 @@
+---
+title: number
+slug: Web/XSLT/Element/number
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/number
+original_slug: Web/XSLT/number
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:number&gt;</code> hace conteos secuenciales. También puede ser usado para darle formato a los números.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:number
+	count=EXPRESION
+	level="single" | "multiple" | "any"
+	from=EXPRESION
+	value=EXPRESION
+	format=FORMAT-STRING
+	lang=XML:LANG-CODE
+	letter-value="alphabetic" | "traditional"
+	grouping-separator=CARACTER
+	grouping-size=NUMERO  /&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>count</code></dt>
+ <dd>Indica que es lo que debe ser numerado de manera secuencial. Usa una expresión XPath.</dd>
+</dl>
+
+<dl>
+ <dt><code>level</code></dt>
+ <dd>Define cuantos niveles del documento deben ser tomados en cuenta para generar la secuencia numérica. Tiene 3 valores permitidos: <code>single</code>, <code>multiple</code>, y <code>any</code>. El valor por preestablecido es <code>single</code>:</dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt><code>single</code></dt>
+  <dd>Numera los nodos hermanos de manera secuencia, como en los listados. ... CONTINUAR DESDE AQUÍ...</dd>
+  <dd>Numbers sibling nodes sequentially, as in the items in a list. The processor goes to the first node in the <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/ancestor-or-self"><code>ancestor-or-self</code></a> axis that matches the <code>count</code> attribute and then counts that node plus all its preceding siblings (stopping when it reaches a match to the <code>from</code> attribute, if there is one) that also match the <code>count</code> attribute.If no match is found, the sequence will be an empty list.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt><code>multiple</code></dt>
+  <dd>Numbers nodes as a composite sequence that reflects the hierarchic position of the node, e.g. 1.2.2.5. (The nested format can be specified with the <code>format</code> attribute, e.g. A.1.1). The processor looks at all <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/ancestor"><code>ancestors</code></a> of the current node and the current node itself, stopping when it reaches a match for the <code>from</code> attribute, if there is one. For each node in this list that matches the <code>count</code> attribute, the processor counts how many preceding matching siblings it has, and adds one for the node itself. If no match is found, the sequence will be an empty list.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt><code>any</code> (Not supported at this time.)</dt>
+  <dd>Numbers all matching nodes, regardless of level, sequentially. The <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/ancestor"><code>ancestor</code></a>, <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/self"><code>self</code></a>, and <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/preceding"><code>preceding</code></a> axes are all considered. The processor starts at the current node and proceeds in reverse document order, stopping if it reaches a match to any <code>from</code> attribute. If no match to the <code>count</code> attribute is found, the sequence will be an empty list. This level is not supported at this time.</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dt>from</dt>
+ <dd>Specifies where the numbering should start or start over. The sequence begins with the first descendant of the node that matches the <code>from</code> attribute.</dd>
+</dl>
+
+<dl>
+ <dt>value</dt>
+ <dd>Applies a given format to a number. This is a quick way to format a user-supplied number (as opposed to a node sequence number) in any of the standard <code>&lt;xsl:number&gt;</code> formats.</dd>
+</dl>
+
+<dl>
+ <dt>format</dt>
+ <dd>Defines the format of the generated number:</dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt>format="1"</dt>
+  <dd>1 2 3 . . . (This is the only format supported at this time)</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt>format="01"</dt>
+  <dd>01 02 03 . . . 09 10 11 . . .</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt>format="a"</dt>
+  <dd>a b c . . .y z aa ab . . .</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt>format="A"</dt>
+  <dd>A B C . . . Y Z AA AB . . .</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt>format="i"</dt>
+  <dd>i ii iii iv v . . .</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dd>
+ <dl>
+  <dt>format="I"</dt>
+  <dd>I II III IV V . . .</dd>
+ </dl>
+ </dd>
+</dl>
+
+<dl>
+ <dt>lang (Not supported at this time.)</dt>
+ <dd>Specifies which language's alphabet should be used in letter-based numbering formats.</dd>
+</dl>
+
+<dl>
+ <dt>letter-value</dt>
+ <dd>Disambiguates between numbering sequences that use letters. Some languages have more than one numbering system that use letters. If both systems begin with the same token, ambiguity can arise. This attribute can have the value "<code>alphabetic</code>" or "<code>traditional</code>". The default is "<code>alphabetic</code>".</dd>
+</dl>
+
+<dl>
+ <dt>grouping-separator</dt>
+ <dd>Specifies what character should be used as the group (e.g. thousands) separator. The default is the comma (<code>,</code>).</dd>
+</dl>
+
+<dl>
+ <dt>grouping-size</dt>
+ <dd>Indicates the number of digits that make up a numeric group. The default value is "<code>3</code>".</dd>
+</dl>
+
+<h3 id="Type" name="Type">Type</h3>
+
+<p>Instruction, appears within a template.</p>
+
+<h3 id="Defined" name="Defined">Defined</h3>
+
+<p>XSLT, section 7.7</p>
+
+<h3 id="Gecko_support" name="Gecko_support">Gecko support</h3>
+
+<p>Partial support. See comments above.</p>
diff --git a/files/es/web/xslt/element/otherwise/index.html b/files/es/web/xslt/element/otherwise/index.html
new file mode 100644
index 0000000000..f461f7ec08
--- /dev/null
+++ b/files/es/web/xslt/element/otherwise/index.html
@@ -0,0 +1,38 @@
+---
+title: otherwise
+slug: Web/XSLT/Element/otherwise
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/otherwise
+original_slug: Web/XSLT/otherwise
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:otherwise&gt;</code> se utiliza para definir la acción que se debe tomar cuando no se aplica ninguna de las condiciones <code>&lt;xsl:when&gt;</code>. Es similar a <code>else</code> or <code>default</code> en otros lenguajes de programación.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:otherwise&gt;
+	PLANTILLA
+&lt;/xsl:otherwise&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Subinstrucción, debe aparecer como el último hijo de un elemento <code>&lt;xsl:choose&gt;</code>, dentro de una plantilla.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 9.2</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/when/index.html b/files/es/web/xslt/element/when/index.html
new file mode 100644
index 0000000000..bc58b9721e
--- /dev/null
+++ b/files/es/web/xslt/element/when/index.html
@@ -0,0 +1,41 @@
+---
+title: when
+slug: Web/XSLT/Element/when
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/when
+original_slug: Web/XSLT/when
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:when&gt;</code> siempre aparece dentro de un elemento <code>&lt;xsl:choose&gt;</code>, actuando como una sentencia case.</p>
+
+<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
+
+<pre>&lt;xsl:when test=EXPRESIÓN&gt;
+	PLANTILLA
+&lt;/xsl:when&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>test</code></dt>
+ <dd>Especifica una expresión booleana a evaluar. Si es cierta, se procesa el contenido del elemento; si es falsa, se ignora.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<p>Ninguno.</p>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Subinstrucción, siempre aparece dentro de un elemento <code>&lt;xsl:choose&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT, sección 9.2.</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/element/with-param/index.html b/files/es/web/xslt/element/with-param/index.html
new file mode 100644
index 0000000000..07d97db054
--- /dev/null
+++ b/files/es/web/xslt/element/with-param/index.html
@@ -0,0 +1,44 @@
+---
+title: with-param
+slug: Web/XSLT/Element/with-param
+tags:
+  - Todas_las_Categorías
+  - XSLT
+translation_of: Web/XSLT/Element/with-param
+original_slug: Web/XSLT/with-param
+---
+<p>{{XsltRef}}</p>
+
+<p>El elemento <code>&lt;xsl:with-param&gt;</code> establece el valor de un parámetro que se pasará a una plantilla.</p>
+
+<h3 id="Syntax" name="Syntax">Syntax</h3>
+
+<pre>&lt;xsl:with-param name=NOMBRE select=EXPRESIÓN&gt;
+	PLANTILLA
+&lt;/xsl:with-param&gt;</pre>
+
+<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>Dá a este parámetro un nombre.</dd>
+</dl>
+
+<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
+
+<dl>
+ <dt><code>select</code></dt>
+ <dd>Define el valor del parámtero a través de una expresión XPath. Si el elemento contiene una plantilla, se ignorará este atributo.</dd>
+</dl>
+
+<h3 id="Tipo" name="Tipo">Tipo</h3>
+
+<p>Subinstrucción, siempre aparece dentro de un elemento <code>&lt;xsl:apply-templates&gt;</code> o <code>&lt;xsl:call-template&gt;</code>.</p>
+
+<h3 id="Definido" name="Definido">Definido</h3>
+
+<p>XSLT 11.6</p>
+
+<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
+
+<p>Soportado.</p>
diff --git a/files/es/web/xslt/fallback/index.html b/files/es/web/xslt/fallback/index.html
deleted file mode 100644
index 472ae59de8..0000000000
--- a/files/es/web/xslt/fallback/index.html
+++ /dev/null
@@ -1,38 +0,0 @@
----
-title: fallback
-slug: Web/XSLT/fallback
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/fallback
----
-<p>{{XsltRef}}</p>
-
-<p><br>
- El elemento <code>&lt;xsl:fallback&gt;</code> indica la plantilla a usar en caso de que algun elemento extendido (o, eventualmente, una nueva versión) no esté soportado.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:fallback&gt;
-	PLANTILLA
-&lt;/xsl:fallback&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 15</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Sin soporte por el momento.</p>
diff --git a/files/es/web/xslt/for-each/index.html b/files/es/web/xslt/for-each/index.html
deleted file mode 100644
index 8cc96419b5..0000000000
--- a/files/es/web/xslt/for-each/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: for-each
-slug: Web/XSLT/for-each
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/for-each
----
-<p>{{XsltRef}}</p>
-
-<p><br>
- El elemento <code>&lt;xsl:for-each&gt;</code> selecciona un conjunto de nodos y procesa cada uno de ellos de la misma manera. Se usa comúnmente para iterar a través de un conjunto de nodos o para cambiar el nodo actual. Si se encuentran uno o más elementos <code>&lt;xsl:sort&gt;</code> como hijos de este elemento, el ordenado de los nodos ocurrirá antes del procesamiento. De otra manera, los nodos se procesarán en el orden del documento.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:for-each select=EXPRESIÓN&gt;
-	&lt;xsl:sort&gt; [opcional]
-	PLANTILLA
-&lt;/xsl:for-each&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>select</code></dt>
- <dd>Usa una expresión XPath para seleccionar los nodos a ser procesados.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 8.</p>
-
-<h3 id="Gecko_support" name="Gecko_support">Gecko support</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/if/index.html b/files/es/web/xslt/if/index.html
deleted file mode 100644
index 4cfaad7f59..0000000000
--- a/files/es/web/xslt/if/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: if
-slug: Web/XSLT/if
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/if
----
-<p>{{XsltRef}}<br>
- El elemento &lt;xsl:if&gt; contiene un atributo a probar y una plantilla. Si el atributo resulta verdadero, la plantilla es procesada. Este comportamiento es similar a la sentencia if de otros lenguajes. Sin embargo, para conseguir la funcionalidad de una sentencia if-then-else, es necesario utilizar el elemento &lt;xsl:choose&gt; con un elemento hijo &lt;xsl:when&gt;, y otro elemento hijo &lt;xsl:otherwise&gt;</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:if test=EXPRESSION&gt;
-	TEMPLATE
-&lt;/xsl:if&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>test</code></dt>
- <dd>Contiene una expresión XPath que puede ser evaluada (usando las reglas definidas para <code>boolean( )</code> si es necesario) como un valor boleano. Si el valor resulta verdadero, la plantilla es procesada; si resulta falso, no se lleva a cabo ninguna acción.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSL sección 9.1.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado</p>
diff --git a/files/es/web/xslt/import/index.html b/files/es/web/xslt/import/index.html
deleted file mode 100644
index 73c341349f..0000000000
--- a/files/es/web/xslt/import/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: import
-slug: Web/XSLT/import
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/import
----
-<p>{{XsltRef}}</p>
-
-<p><br>
- El elemento <code>&lt;xsl:import&gt;</code> sirve para importar el contenido de una hoja de estilo dentro de otra hoja de estilo. En general, el contenido de la hoja de estilo importada tiene una menor precedencia que el contenido de la hoja de estilo que la importa. Esto contrasta con el elemento <code>&lt;xsl:include&gt;</code> en el que el contenido de la hoja de estilo incluida tiene exactamente la misma precedencia que el contenido de la hoja de estilo que la incluye.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:import href=URI  /&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>href</code></dt>
- <dd>URI de la hoja de estilo a importar.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Nivel raíz, debe aparecer antes de cualquier otro hijo de <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code> en la hoja de estilo que la importa.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 2.6.2.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Casi completamente soportado, con tan solo algunos detalles con variables de nivel raíz y parámetros desde Mozilla 1.0.</p>
diff --git a/files/es/web/xslt/include/index.html b/files/es/web/xslt/include/index.html
deleted file mode 100644
index 31dbc990eb..0000000000
--- a/files/es/web/xslt/include/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: include
-slug: Web/XSLT/include
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/include
----
-<p>{{XsltRef}}</p>
-
-<p><br>
- El elemento <code>&lt;xsl:include&gt;</code> une el contenido de una hoja de estilo con otra. A diferencia del elemento <code>&lt;xsl:import&gt;</code>, el contenido de la hoja de estilo incluida tiene exactamente la misma precedencia que el contenido de la hoja de estilo que la incluye.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:include href=URI /&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>href</code></dt>
- <dd>Indica el URI de la hoja de estilo a incluir.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Elemento raíz, puede aparecer en cualquier orden siendo hijo del elemento <code>&lt;xsl:stylesheet&gt;</code> o el elemento <code>&lt;xsl:transform&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 2.6.1.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/key/index.html b/files/es/web/xslt/key/index.html
deleted file mode 100644
index 536f373039..0000000000
--- a/files/es/web/xslt/key/index.html
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: key
-slug: Web/XSLT/key
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/key
----
-<p>{{XsltRef}}</p>
-
-<p><br>
- El elemento <code>&lt;xsl:key&gt;</code> declara una llave con nombre la cual puede ser usada en otro lugar dentro de la hoja de estilo usando la función <code>key( )</code>.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:key name=NOMBRE match=EXPRESIÓN
-	use=EXPRESIÓN /&gt; </pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>Indica el nombre para esta llave. Debe seguir las reglas de tipo QName.</dd>
- <dt><code>match</code></dt>
- <dd>Define el nodo para el que esta llave aplica.</dd>
- <dt><code>use</code></dt>
- <dd>Indica la expresión XPath que se usará para determinar el valor de la llave para cada uno de los nodos aplicables.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Elemento raíz, debe ser hijo del elemento <code>&lt;xsl:stylesheet&gt;</code> o del elemento <code>&lt;xsl:transform&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 12.2.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/message/index.html b/files/es/web/xslt/message/index.html
deleted file mode 100644
index e30f33ebaf..0000000000
--- a/files/es/web/xslt/message/index.html
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: message
-slug: Web/XSLT/message
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/message
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:message&gt;</code> muestra un mensaje (en la consola JavaScript en NS) y opcionalmente termina la ejecución de la hoja de estilos. Puede ser util para depuración.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:message terminate="yes" | "no" &gt;
-	PLANTILLA
-&lt;/xsl:message&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>terminate</code></dt>
- <dd>Establecido a "<code>yes</code>", indica que debe terminar la ejecución. El valor por defecto es "<code>no</code>", en cuyo caso se muestra el mensaje y continúa la ejecución.</dd>
-</dl>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Instrucción, aparece dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 13.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/namespace-alias/index.html b/files/es/web/xslt/namespace-alias/index.html
deleted file mode 100644
index 24f35bef50..0000000000
--- a/files/es/web/xslt/namespace-alias/index.html
+++ /dev/null
@@ -1,42 +0,0 @@
----
-title: namespace-alias
-slug: Web/XSLT/namespace-alias
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/namespace-alias
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:namespace-alias&gt;</code> es un mecanismo raramente usado para asociar un nombre de espacios en la hoja de estilos a otro nombre de espacios diferente en el árbol de salida. El uso más común para este elemento se da en la generación de una hoja de estilos a partir de otra hoja de estilos.</p>
-
-<p>Para prevenir que la cadena literal para el prefijo <code>xsl:</code> del elemento resultante (que simplemente debería ser copiada al árbol resultante) sea malinterpretada por el procesador, se le asigna temporalmente un nombre de espacio diferente que posteriormente es reconvertida al nombre de espacios de XSLT en el árbol de salida.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:namespace-alias stylesheet-prefix=NOMBRE result-prefix=NOMBRE /&gt;</pre>
-
-<h3 id="Atributos_Requeridos" name="Atributos_Requeridos">Atributos Requeridos</h3>
-
-<dl>
- <dt><code>stylesheet-prefix</code></dt>
- <dd>Indica el nombre de espacios temporal.</dd>
- <dt><code>result-prefix</code></dt>
- <dd>Indica el nombre de espacios deseado en el árbol de salida.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Debe ser hijo directo de <code>&lt;xsl:stylesheet&gt;</code> o <code>&lt;xsl:transform&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 7.1.1</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Sin soporte por el momento.</p>
diff --git a/files/es/web/xslt/number/index.html b/files/es/web/xslt/number/index.html
deleted file mode 100644
index da7238cd4f..0000000000
--- a/files/es/web/xslt/number/index.html
+++ /dev/null
@@ -1,169 +0,0 @@
----
-title: number
-slug: Web/XSLT/number
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/number
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:number&gt;</code> hace conteos secuenciales. También puede ser usado para darle formato a los números.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:number
-	count=EXPRESION
-	level="single" | "multiple" | "any"
-	from=EXPRESION
-	value=EXPRESION
-	format=FORMAT-STRING
-	lang=XML:LANG-CODE
-	letter-value="alphabetic" | "traditional"
-	grouping-separator=CARACTER
-	grouping-size=NUMERO  /&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>count</code></dt>
- <dd>Indica que es lo que debe ser numerado de manera secuencial. Usa una expresión XPath.</dd>
-</dl>
-
-<dl>
- <dt><code>level</code></dt>
- <dd>Define cuantos niveles del documento deben ser tomados en cuenta para generar la secuencia numérica. Tiene 3 valores permitidos: <code>single</code>, <code>multiple</code>, y <code>any</code>. El valor por preestablecido es <code>single</code>:</dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt><code>single</code></dt>
-  <dd>Numera los nodos hermanos de manera secuencia, como en los listados. ... CONTINUAR DESDE AQUÍ...</dd>
-  <dd>Numbers sibling nodes sequentially, as in the items in a list. The processor goes to the first node in the <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/ancestor-or-self"><code>ancestor-or-self</code></a> axis that matches the <code>count</code> attribute and then counts that node plus all its preceding siblings (stopping when it reaches a match to the <code>from</code> attribute, if there is one) that also match the <code>count</code> attribute.If no match is found, the sequence will be an empty list.</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt><code>multiple</code></dt>
-  <dd>Numbers nodes as a composite sequence that reflects the hierarchic position of the node, e.g. 1.2.2.5. (The nested format can be specified with the <code>format</code> attribute, e.g. A.1.1). The processor looks at all <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/ancestor"><code>ancestors</code></a> of the current node and the current node itself, stopping when it reaches a match for the <code>from</code> attribute, if there is one. For each node in this list that matches the <code>count</code> attribute, the processor counts how many preceding matching siblings it has, and adds one for the node itself. If no match is found, the sequence will be an empty list.</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt><code>any</code> (Not supported at this time.)</dt>
-  <dd>Numbers all matching nodes, regardless of level, sequentially. The <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/ancestor"><code>ancestor</code></a>, <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/self"><code>self</code></a>, and <a href="es/Transforming_XML_with_XSLT/Mozilla_XSLT%2f%2fXPath_Reference/Axes/preceding"><code>preceding</code></a> axes are all considered. The processor starts at the current node and proceeds in reverse document order, stopping if it reaches a match to any <code>from</code> attribute. If no match to the <code>count</code> attribute is found, the sequence will be an empty list. This level is not supported at this time.</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dt>from</dt>
- <dd>Specifies where the numbering should start or start over. The sequence begins with the first descendant of the node that matches the <code>from</code> attribute.</dd>
-</dl>
-
-<dl>
- <dt>value</dt>
- <dd>Applies a given format to a number. This is a quick way to format a user-supplied number (as opposed to a node sequence number) in any of the standard <code>&lt;xsl:number&gt;</code> formats.</dd>
-</dl>
-
-<dl>
- <dt>format</dt>
- <dd>Defines the format of the generated number:</dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt>format="1"</dt>
-  <dd>1 2 3 . . . (This is the only format supported at this time)</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt>format="01"</dt>
-  <dd>01 02 03 . . . 09 10 11 . . .</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt>format="a"</dt>
-  <dd>a b c . . .y z aa ab . . .</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt>format="A"</dt>
-  <dd>A B C . . . Y Z AA AB . . .</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt>format="i"</dt>
-  <dd>i ii iii iv v . . .</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dd>
- <dl>
-  <dt>format="I"</dt>
-  <dd>I II III IV V . . .</dd>
- </dl>
- </dd>
-</dl>
-
-<dl>
- <dt>lang (Not supported at this time.)</dt>
- <dd>Specifies which language's alphabet should be used in letter-based numbering formats.</dd>
-</dl>
-
-<dl>
- <dt>letter-value</dt>
- <dd>Disambiguates between numbering sequences that use letters. Some languages have more than one numbering system that use letters. If both systems begin with the same token, ambiguity can arise. This attribute can have the value "<code>alphabetic</code>" or "<code>traditional</code>". The default is "<code>alphabetic</code>".</dd>
-</dl>
-
-<dl>
- <dt>grouping-separator</dt>
- <dd>Specifies what character should be used as the group (e.g. thousands) separator. The default is the comma (<code>,</code>).</dd>
-</dl>
-
-<dl>
- <dt>grouping-size</dt>
- <dd>Indicates the number of digits that make up a numeric group. The default value is "<code>3</code>".</dd>
-</dl>
-
-<h3 id="Type" name="Type">Type</h3>
-
-<p>Instruction, appears within a template.</p>
-
-<h3 id="Defined" name="Defined">Defined</h3>
-
-<p>XSLT, section 7.7</p>
-
-<h3 id="Gecko_support" name="Gecko_support">Gecko support</h3>
-
-<p>Partial support. See comments above.</p>
diff --git a/files/es/web/xslt/otherwise/index.html b/files/es/web/xslt/otherwise/index.html
deleted file mode 100644
index 2150e21ad3..0000000000
--- a/files/es/web/xslt/otherwise/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
----
-title: otherwise
-slug: Web/XSLT/otherwise
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/otherwise
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:otherwise&gt;</code> se utiliza para definir la acción que se debe tomar cuando no se aplica ninguna de las condiciones <code>&lt;xsl:when&gt;</code>. Es similar a <code>else</code> or <code>default</code> en otros lenguajes de programación.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:otherwise&gt;
-	PLANTILLA
-&lt;/xsl:otherwise&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Subinstrucción, debe aparecer como el último hijo de un elemento <code>&lt;xsl:choose&gt;</code>, dentro de una plantilla.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 9.2</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/transformando_xml_con_xslt/index.html b/files/es/web/xslt/transformando_xml_con_xslt/index.html
deleted file mode 100644
index 9ccd6d0a36..0000000000
--- a/files/es/web/xslt/transformando_xml_con_xslt/index.html
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: Transformando XML con XSLT
-slug: Web/XSLT/Transformando_XML_con_XSLT
-tags:
-  - Todas_las_Categorías
-  - Transformando_XML_con_XSLT
-  - XSLT
-translation_of: Web/XSLT/Transforming_XML_with_XSLT
----
-<p>
-</p><p><br>
-</p>
-<h3 id="Introducci.C3.B3n"> <a href="es/Transformando_XML_en_XSLT/Introducci%c3%b3n">Introducción</a> </h3>
-<p>La separación del contenido y la presentación es una característica clave en el diseño de <a href="es/XML">XML</a>. La estructura de un documento XML esta diseñada para reflejar y clarificar relaciones importantes entre los aspectos individuales del contenido en si mismo, sin preocuparse de la forma en que posteriormente se visualizaran los datos. Una estructuración inteligente es particularmente importante cuando cada día se realizan más conexiones entre máquinas muy diferentes a través de la red.
-</p><p>Finalmente, gran parte del contenido almacenado en los documentos XML será mostrado al lector (humano). Dado que el navegador proporciona un interfaz conocido y flexible al usuario, es el mecanismo ideal para presentar los contenidos en XML. Construido él mismo usando numerosas tecnologías XML, Mozilla incluye todos los mecanismos necesarios para procesar tanto los documentos XML originales, como las hojas de transformación utilizadas para formatearlo y mostrarlo en HTML. Al mismo tiempo se reduce la carga del servidor, dado que el procesamiento se produce en el lado del cliente.
-</p><p>Actualmente, Gecko (el motor de visualización que utilizan Mozilla y Firefox) soporta dos tipos de hojas de estilo para XML. Para el control básico de la apariencia (como fuentes, colores, posición, etc...) Gecko utiliza <a href="es/CSS">CSS</a>, parecido al <a href="es/DHTML">DHTML</a>. Todo CSS1 y la mayor parte de CSS2 están soportados. El soporte para el estándar CSS3 está en desarrollo. Para más información sobre CSS, véase <a class="external" href="http://www.meyerweb.com/eric/css/">Eric Meyer's CSS pages</a>. Para una introducción de CSS1 y Netscape, véase <a class="external" href="http://home.netscape.com/browsers/future/standards.html#1">Browser Central page</a>.
-</p><p>El segundo tipo de hojas de transformación que soporta Gecko son las hojas de estilo XSLT, eXtensible Stylesheet Language/Transform. XSLT permite al autor de una hoja de estilo transformar un documento original XML de dos formas: manipulando y ordenando el contenido (incluyendo una reordenación general de éste si es necesario), y transformando el contenido en distintos formatos (en el caso de Netscape, se convierte al vuelo en HTML para ser mostrado por el navegador).
-</p>
-<h3 id="Referencia_de_XSLT.2FXPath"> Referencia de XSLT/XPath </h3>
-<h4 id="Elementos"> <a href="es/XSLT/Elementos">Elementos</a> </h4>
-<ul><li> <a href="es/XSLT/apply-imports">xsl:apply-imports</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/apply-templates">xsl:apply-templates</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/attribute">xsl:attribute</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/attribute-set">xsl:attribute-set</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/call-template">xsl:call-template</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/choose">xsl:choose</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/comment">xsl:comment</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/copy">xsl:copy</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/copy-of">xsl:copy-of</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/decimal-format">xsl:decimal-format</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/element">xsl:element</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/fallback">xsl:fallback</a> <i>(no soportado)</i>
-</li><li> <a href="es/XSLT/for-each">xsl:for-each</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/if">xsl:if</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/import">xsl:import</a> <i>(soportado en la mayoría de casos)</i>
-</li><li> <a href="es/XSLT/include">xsl:include</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/key">xsl:key</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/message">xsl:message</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/namespace-alias">xsl:namespace-alias</a> <i>(no soportado)</i>
-</li><li> <a href="es/XSLT/number">xsl:number</a> <i>(parcialmente soportado)</i>
-</li><li> <a href="es/XSLT/otherwise">xsl:otherwise</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/output">xsl:output</a> <i>(parcialmente soportado)</i>
-</li><li> <a href="es/XSLT/param">xsl:param</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/preserve-space">xsl:preserve-space</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/processing-instruction">xsl:processing-instruction</a> </li><li> <a href="es/XSLT/sort">xsl:sort</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/strip-space">xsl:strip-space</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/stylesheet">xsl:stylesheet</a> <i>(parcialmente soportado)</i>
-</li><li> <a href="es/XSLT/template">xsl:template</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/text">xsl:text</a> <i>(parcialmente supported)</i>
-</li><li> <a href="es/XSLT/transform">xsl:transform</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/value-of">xsl:value-of</a> <i>(parcialmente soportado)</i>
-</li><li> <a href="es/XSLT/variable">xsl:variable</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/when">xsl:when</a> <i>(soportado)</i>
-</li><li> <a href="es/XSLT/with-param">xsl:with-param</a> <i>(soportado)</i>
-</li></ul>
-<h4 id="Ejes"> <a href="es/XPath/Ejes">Ejes</a> </h4>
-<ul><li> <a href="es/XPath/Ejes/ancestor">ancestor</a> </li><li> <a href="es/XPath/Ejes/ancestor-or-self">ancestor-or-self</a> </li><li> <a href="es/XPath/Ejes/attribute">attribute</a> </li><li> <a href="es/XPath/Ejes/child">child</a> </li><li> <a href="es/XPath/Ejes/descendant">descendant</a> </li><li> <a href="es/XPath/Ejes/descendant-or-self">descendant-or-self</a> </li><li> <a href="es/XPath/Ejes/following">following</a> </li><li> <a href="es/XPath/Ejes/following-sibling">following-sibling</a> </li><li> <a href="es/XPath/Ejes/namespace">namespace</a> <i>(no soportado)</i>
-</li><li> <a href="es/XPath/Ejes/parent">parent</a> </li><li> <a href="es/XPath/Ejes/preceding">preceding</a> </li><li> <a href="es/XPath/Ejes/preceding-sibling">preceding-sibling</a> </li><li> <a href="es/XPath/Ejes/self">self</a>
-</li></ul>
-<h4 id="Funciones"> <a href="es/XPath/Funciones">Funciones</a> </h4>
-<ul><li> <a href="es/XPath/Funciones/boolean">boolean()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/ceiling">ceiling()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/concat">concat()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/contains">contains()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/count">count()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/current">current()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/document">document()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/element-available">element-available()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/false">false()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/floor">floor()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/format-number">format-number()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/function-available">function-available()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/generate-id">generate-id()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/id">id()</a> <i>(parcialmente soportado)</i>
-</li><li> <a href="es/XPath/Funciones/key">key()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/lang">lang()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/last">last()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/local-name">local-name()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/name">name()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/namespace-uri">namespace-uri()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/normalize-space">normalize-space()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/not">not()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/number">number()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/position">position()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/round">round()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/starts-with">starts-with()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/string">string()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/string-length">string-lenght()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/substring">substring()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/substring-after">substring-after()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/substring-before">substring-before()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/sum">sum()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/system-property">system-property()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/translate">translate()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/true">true()</a> <i>(soportado)</i>
-</li><li> <a href="es/XPath/Funciones/unparsed-entity-url">unparsed-entity-url()</a> <i>(no soportado)</i>
-</li></ul>
-<h3 id="Para_futuras_lecturas"> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas">Para futuras lecturas</a> </h3>
-<ul><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Libros">Libros</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Online">Online</a> <ul><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#El_Consorcio_del_Mundo_de_la_Web">El Consorcio del amplio mundo de la Web</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Portales">Portales</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Art.C3.ADculos">Artículos</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Tutoriales.2FEjemplos">Tutoriales/Ejemplos</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Listas_de_mails.2FGrupos_de_noticias">Listas de mails/Grupos de noticias</a>
-</li></ul>
-</li></ul>
-<h3 id=".C3.8Dndice"> <a href="es/Transformando_XML_con_XSLT/Indice">Índice</a> </h3>
-<div class="originaldocinfo">
-<h3 id="Informaci.C3.B3n_original_del_documento"> Información original del documento </h3>
-<ul><li> Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.
-</li><li> Note: This reprinted article was originally part of the DevEdge site.
-</li></ul>
-</div>
-<p><br>
-<span>Categorías</span>
-</p><p><span>enlaces interwikis</span>
-</p>{{ languages( { "en": "en/Transforming_XML_with_XSLT", "fr": "fr/Transformations_XML_avec_XSLT", "ko": "ko/Transforming_XML_with_XSLT", "pl": "pl/Transformacje_XML_z_XSLT" } ) }}
diff --git a/files/es/web/xslt/transforming_xml_with_xslt/index.html b/files/es/web/xslt/transforming_xml_with_xslt/index.html
new file mode 100644
index 0000000000..1606357e34
--- /dev/null
+++ b/files/es/web/xslt/transforming_xml_with_xslt/index.html
@@ -0,0 +1,113 @@
+---
+title: Transformando XML con XSLT
+slug: Web/XSLT/Transforming_XML_with_XSLT
+tags:
+  - Todas_las_Categorías
+  - Transformando_XML_con_XSLT
+  - XSLT
+translation_of: Web/XSLT/Transforming_XML_with_XSLT
+original_slug: Web/XSLT/Transformando_XML_con_XSLT
+---
+<p>
+</p><p><br>
+</p>
+<h3 id="Introducci.C3.B3n"> <a href="es/Transformando_XML_en_XSLT/Introducci%c3%b3n">Introducción</a> </h3>
+<p>La separación del contenido y la presentación es una característica clave en el diseño de <a href="es/XML">XML</a>. La estructura de un documento XML esta diseñada para reflejar y clarificar relaciones importantes entre los aspectos individuales del contenido en si mismo, sin preocuparse de la forma en que posteriormente se visualizaran los datos. Una estructuración inteligente es particularmente importante cuando cada día se realizan más conexiones entre máquinas muy diferentes a través de la red.
+</p><p>Finalmente, gran parte del contenido almacenado en los documentos XML será mostrado al lector (humano). Dado que el navegador proporciona un interfaz conocido y flexible al usuario, es el mecanismo ideal para presentar los contenidos en XML. Construido él mismo usando numerosas tecnologías XML, Mozilla incluye todos los mecanismos necesarios para procesar tanto los documentos XML originales, como las hojas de transformación utilizadas para formatearlo y mostrarlo en HTML. Al mismo tiempo se reduce la carga del servidor, dado que el procesamiento se produce en el lado del cliente.
+</p><p>Actualmente, Gecko (el motor de visualización que utilizan Mozilla y Firefox) soporta dos tipos de hojas de estilo para XML. Para el control básico de la apariencia (como fuentes, colores, posición, etc...) Gecko utiliza <a href="es/CSS">CSS</a>, parecido al <a href="es/DHTML">DHTML</a>. Todo CSS1 y la mayor parte de CSS2 están soportados. El soporte para el estándar CSS3 está en desarrollo. Para más información sobre CSS, véase <a class="external" href="http://www.meyerweb.com/eric/css/">Eric Meyer's CSS pages</a>. Para una introducción de CSS1 y Netscape, véase <a class="external" href="http://home.netscape.com/browsers/future/standards.html#1">Browser Central page</a>.
+</p><p>El segundo tipo de hojas de transformación que soporta Gecko son las hojas de estilo XSLT, eXtensible Stylesheet Language/Transform. XSLT permite al autor de una hoja de estilo transformar un documento original XML de dos formas: manipulando y ordenando el contenido (incluyendo una reordenación general de éste si es necesario), y transformando el contenido en distintos formatos (en el caso de Netscape, se convierte al vuelo en HTML para ser mostrado por el navegador).
+</p>
+<h3 id="Referencia_de_XSLT.2FXPath"> Referencia de XSLT/XPath </h3>
+<h4 id="Elementos"> <a href="es/XSLT/Elementos">Elementos</a> </h4>
+<ul><li> <a href="es/XSLT/apply-imports">xsl:apply-imports</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/apply-templates">xsl:apply-templates</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/attribute">xsl:attribute</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/attribute-set">xsl:attribute-set</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/call-template">xsl:call-template</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/choose">xsl:choose</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/comment">xsl:comment</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/copy">xsl:copy</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/copy-of">xsl:copy-of</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/decimal-format">xsl:decimal-format</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/element">xsl:element</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/fallback">xsl:fallback</a> <i>(no soportado)</i>
+</li><li> <a href="es/XSLT/for-each">xsl:for-each</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/if">xsl:if</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/import">xsl:import</a> <i>(soportado en la mayoría de casos)</i>
+</li><li> <a href="es/XSLT/include">xsl:include</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/key">xsl:key</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/message">xsl:message</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/namespace-alias">xsl:namespace-alias</a> <i>(no soportado)</i>
+</li><li> <a href="es/XSLT/number">xsl:number</a> <i>(parcialmente soportado)</i>
+</li><li> <a href="es/XSLT/otherwise">xsl:otherwise</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/output">xsl:output</a> <i>(parcialmente soportado)</i>
+</li><li> <a href="es/XSLT/param">xsl:param</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/preserve-space">xsl:preserve-space</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/processing-instruction">xsl:processing-instruction</a> </li><li> <a href="es/XSLT/sort">xsl:sort</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/strip-space">xsl:strip-space</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/stylesheet">xsl:stylesheet</a> <i>(parcialmente soportado)</i>
+</li><li> <a href="es/XSLT/template">xsl:template</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/text">xsl:text</a> <i>(parcialmente supported)</i>
+</li><li> <a href="es/XSLT/transform">xsl:transform</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/value-of">xsl:value-of</a> <i>(parcialmente soportado)</i>
+</li><li> <a href="es/XSLT/variable">xsl:variable</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/when">xsl:when</a> <i>(soportado)</i>
+</li><li> <a href="es/XSLT/with-param">xsl:with-param</a> <i>(soportado)</i>
+</li></ul>
+<h4 id="Ejes"> <a href="es/XPath/Ejes">Ejes</a> </h4>
+<ul><li> <a href="es/XPath/Ejes/ancestor">ancestor</a> </li><li> <a href="es/XPath/Ejes/ancestor-or-self">ancestor-or-self</a> </li><li> <a href="es/XPath/Ejes/attribute">attribute</a> </li><li> <a href="es/XPath/Ejes/child">child</a> </li><li> <a href="es/XPath/Ejes/descendant">descendant</a> </li><li> <a href="es/XPath/Ejes/descendant-or-self">descendant-or-self</a> </li><li> <a href="es/XPath/Ejes/following">following</a> </li><li> <a href="es/XPath/Ejes/following-sibling">following-sibling</a> </li><li> <a href="es/XPath/Ejes/namespace">namespace</a> <i>(no soportado)</i>
+</li><li> <a href="es/XPath/Ejes/parent">parent</a> </li><li> <a href="es/XPath/Ejes/preceding">preceding</a> </li><li> <a href="es/XPath/Ejes/preceding-sibling">preceding-sibling</a> </li><li> <a href="es/XPath/Ejes/self">self</a>
+</li></ul>
+<h4 id="Funciones"> <a href="es/XPath/Funciones">Funciones</a> </h4>
+<ul><li> <a href="es/XPath/Funciones/boolean">boolean()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/ceiling">ceiling()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/concat">concat()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/contains">contains()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/count">count()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/current">current()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/document">document()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/element-available">element-available()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/false">false()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/floor">floor()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/format-number">format-number()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/function-available">function-available()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/generate-id">generate-id()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/id">id()</a> <i>(parcialmente soportado)</i>
+</li><li> <a href="es/XPath/Funciones/key">key()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/lang">lang()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/last">last()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/local-name">local-name()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/name">name()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/namespace-uri">namespace-uri()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/normalize-space">normalize-space()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/not">not()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/number">number()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/position">position()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/round">round()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/starts-with">starts-with()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/string">string()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/string-length">string-lenght()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/substring">substring()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/substring-after">substring-after()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/substring-before">substring-before()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/sum">sum()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/system-property">system-property()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/translate">translate()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/true">true()</a> <i>(soportado)</i>
+</li><li> <a href="es/XPath/Funciones/unparsed-entity-url">unparsed-entity-url()</a> <i>(no soportado)</i>
+</li></ul>
+<h3 id="Para_futuras_lecturas"> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas">Para futuras lecturas</a> </h3>
+<ul><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Libros">Libros</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Online">Online</a> <ul><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#El_Consorcio_del_Mundo_de_la_Web">El Consorcio del amplio mundo de la Web</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Portales">Portales</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Art.C3.ADculos">Artículos</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Tutoriales.2FEjemplos">Tutoriales/Ejemplos</a> </li><li> <a href="es/Transformando_XMLcon_XSLT/Para_Futuras_Lecturas#Listas_de_mails.2FGrupos_de_noticias">Listas de mails/Grupos de noticias</a>
+</li></ul>
+</li></ul>
+<h3 id=".C3.8Dndice"> <a href="es/Transformando_XML_con_XSLT/Indice">Índice</a> </h3>
+<div class="originaldocinfo">
+<h3 id="Informaci.C3.B3n_original_del_documento"> Información original del documento </h3>
+<ul><li> Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.
+</li><li> Note: This reprinted article was originally part of the DevEdge site.
+</li></ul>
+</div>
+<p><br>
+<span>Categorías</span>
+</p><p><span>enlaces interwikis</span>
+</p>{{ languages( { "en": "en/Transforming_XML_with_XSLT", "fr": "fr/Transformations_XML_avec_XSLT", "ko": "ko/Transforming_XML_with_XSLT", "pl": "pl/Transformacje_XML_z_XSLT" } ) }}
diff --git a/files/es/web/xslt/when/index.html b/files/es/web/xslt/when/index.html
deleted file mode 100644
index cda01b9e6c..0000000000
--- a/files/es/web/xslt/when/index.html
+++ /dev/null
@@ -1,40 +0,0 @@
----
-title: when
-slug: Web/XSLT/when
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/when
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:when&gt;</code> siempre aparece dentro de un elemento <code>&lt;xsl:choose&gt;</code>, actuando como una sentencia case.</p>
-
-<h3 id="Sintaxis" name="Sintaxis">Sintaxis</h3>
-
-<pre>&lt;xsl:when test=EXPRESIÓN&gt;
-	PLANTILLA
-&lt;/xsl:when&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>test</code></dt>
- <dd>Especifica una expresión booleana a evaluar. Si es cierta, se procesa el contenido del elemento; si es falsa, se ignora.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<p>Ninguno.</p>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Subinstrucción, siempre aparece dentro de un elemento <code>&lt;xsl:choose&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT, sección 9.2.</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web/xslt/with-param/index.html b/files/es/web/xslt/with-param/index.html
deleted file mode 100644
index 270684f4d7..0000000000
--- a/files/es/web/xslt/with-param/index.html
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: with-param
-slug: Web/XSLT/with-param
-tags:
-  - Todas_las_Categorías
-  - XSLT
-translation_of: Web/XSLT/Element/with-param
----
-<p>{{XsltRef}}</p>
-
-<p>El elemento <code>&lt;xsl:with-param&gt;</code> establece el valor de un parámetro que se pasará a una plantilla.</p>
-
-<h3 id="Syntax" name="Syntax">Syntax</h3>
-
-<pre>&lt;xsl:with-param name=NOMBRE select=EXPRESIÓN&gt;
-	PLANTILLA
-&lt;/xsl:with-param&gt;</pre>
-
-<h3 id="Atributos_requeridos" name="Atributos_requeridos">Atributos requeridos</h3>
-
-<dl>
- <dt><code>name</code></dt>
- <dd>Dá a este parámetro un nombre.</dd>
-</dl>
-
-<h3 id="Atributos_opcionales" name="Atributos_opcionales">Atributos opcionales</h3>
-
-<dl>
- <dt><code>select</code></dt>
- <dd>Define el valor del parámtero a través de una expresión XPath. Si el elemento contiene una plantilla, se ignorará este atributo.</dd>
-</dl>
-
-<h3 id="Tipo" name="Tipo">Tipo</h3>
-
-<p>Subinstrucción, siempre aparece dentro de un elemento <code>&lt;xsl:apply-templates&gt;</code> o <code>&lt;xsl:call-template&gt;</code>.</p>
-
-<h3 id="Definido" name="Definido">Definido</h3>
-
-<p>XSLT 11.6</p>
-
-<h3 id="Soporte_en_Gecko" name="Soporte_en_Gecko">Soporte en Gecko</h3>
-
-<p>Soportado.</p>
diff --git a/files/es/web_audio_api/index.html b/files/es/web_audio_api/index.html
deleted file mode 100644
index e7cb54d803..0000000000
--- a/files/es/web_audio_api/index.html
+++ /dev/null
@@ -1,510 +0,0 @@
----
-title: Web Audio API
-slug: Web_Audio_API
-translation_of: Web/API/Web_Audio_API
----
-<div>{{apiref("Web Audio API")}}</div>
-
-<p class="summary">La API de Audio Web provee un sistema poderoso y versatil para controlar audio en la Web, permitiendo a los desarrolladores escoger fuentes de audio, agregar efectos al audio, crear visualizaciones de audios, aplicar efectos espaciales (como paneo) y mucho más.</p>
-
-<h2 id="Conceptos_y_uso_de_audio_Web">Conceptos y uso de audio Web</h2>
-
-<p>La API de Audio Web involucra manejar operaciones de audio dentro de un <strong>contexto de audio</strong>, y ha sido diseñada para permitir <strong>enrutamiento modular</strong>. Las operaciones de audio básicas son realizadas con <strong>nodos de audio</strong>, que están enlazados juntos para formar un <strong>gráfico de enrutamiento de audio</strong>. Muchas fuentes — con diferentes tipos de diseño de canales — están soportadas incluso dentro de un único contexto. Este diseño modular provee flexibilidad para crear funciones de audio complejas con efectos dinámicos.</p>
-
-<p>Los nodos de audio están enlazados en cadenas y redes simples por sus entradas y salidas. Éstos típicamente empiezan con una o más fuentes. Las fuentes provee matrices de intensidades de sonidos (muestras) en segmentos de tiempo muy pequeños, a menudo decenas de miles de éstos por segundo.  Éstos podrían ser calculados matemáticamente (como  {{domxref("OscillatorNode")}}), o pueden ser grabaciones de archivos de audio o video (como {{domxref("AudioBufferSourceNode")}} y {{domxref("MediaElementAudioSourceNode")}}) y transmisiones de audio ({{domxref("MediaStreamAudioSourceNode")}}). De hecho, los archivos de sonido son sólo grabaciones de intensidades de sonido, que vienen desde micrófonos o instrumentos eléctricos, y mezclados en una onda única y complicada.</p>
-
-<p>Los resultados de éstos nodos podrían ser enlazados a las entradas de otros, que mezclan o modifican estas transmisiones de muestras de audio en diferentes transmisiones. Una modificación común es multiplicar las muestras por un valor para hacerlas más fuertes o silenciosas (como es el caso con {{domxref("GainNode")}}). Una vez que el sonido ha sido lo suficientemente procesado por el efecto necesario, puede ser enlazados a la entrada de un destino({{domxref("AudioContext.destination")}}), que enviá el sonido a los altavoces o auriculares. Esta última conexión sólo es necesaria si el usuario debe escuchar el audio.</p>
-
-<p>Un diagrama de flujo simple y típico para el audio web se vería algo como esto:</p>
-
-<ol>
- <li>Crear contexto de audio</li>
- <li>Dentro del contexto, crear fuentes — como <code>&lt;audio&gt;</code>, oscillator, stream</li>
- <li>Crear nodos de efectos, <span class="short_text" id="result_box" lang="es"><span>tales como reverberación, filtro biquad, panner, compresor</span></span></li>
- <li>Ecoge el destino final del audio, por ejemplo tu sistema de altavoces</li>
- <li>Conecta las fuentes a los efectos, y los efectos al destino.</li>
-</ol>
-
-<p><img alt="A simple box diagram with an outer box labeled Audio context, and three inner boxes labeled Sources, Effects and Destination. The three inner boxes have arrow between them pointing from left to right, indicating the flow of audio information." src="https://mdn.mozillademos.org/files/12241/webaudioAPI_en.svg" style="display: block; height: 143px; margin: 0px auto; width: 643px;"></p>
-
-<p>El tiempo es controlado con alta precisión baja latencia, permitiendo a los desarrolladores escribir código que responda con precisión a los eventos y sea capaz de apuntar a muestras específicas, incluso en una alta frecuencia de muestreo. <span id="result_box" lang="es"><span>Por lo tanto, las aplicaciones como las cajas de ritmos y los secuenciadores están a su alcance.</span></span></p>
-
-<p>El API de Audio Web también nos permite controlar cómo el audio es <em>espacializado</em>. Usando un sistema basado en un <em>modelo fuente-oyente</em>, esto permite controlar el <em>modeo de paneo</em> y que se ocupa de la <em>atenuación inducida por distancia </em>o <em>desplazamiento doppler</em> i<span class="short_text" id="result_box" lang="es"><span>nducido por una fuente en movimiento (o un oyente en movimiento).</span></span></p>
-
-<div class="note">
-<p>Puedes leear sobre la teoría del API de Audio Web con más detalle en nuestro artículo <a href="/en-US/docs/Web/API/Web_Audio_API/Basic_concepts_behind_Web_Audio_API">Conceptos Básicos detrás del API de Audio Web</a>.</p>
-</div>
-
-<h2 id="Interfaces_del_API_de_Audio_Web">Interfaces del API de Audio Web</h2>
-
-<p>La API de Audio Web tiene un número de interfaces y eventos asociados, que han sido divididos en nueve categorias de funcionalidad.</p>
-
-<h3 id="Definición_general_del_gráfico_de_audio">Definición general del gráfico de audio</h3>
-
-<p><span id="result_box" lang="es"><span>Contenedores y definiciones generales que dan forma a los gráficos de audio en el uso de Web Audio API</span></span>.</p>
-
-<dl>
- <dt>{{domxref("AudioContext")}}</dt>
- <dd>La interfaz <strong><code>AudioContext</code></strong> representa un gráfico de procesamiento de audio construido de módulos de audio enlazados juntos, cada uno representado por un {{domxref("AudioNode")}}. Un contexto de audio controla la creación de los nodos que contiene y la ejecución del procesamiento del audio, or decoding. Necesitas crear un <code>AudioContext</code> antes de hacer cualquier cosa,  ya que todo pasa dentro de un contexto de audio.</dd>
- <dt>{{domxref("AudioNode")}}</dt>
- <dd>La interfaz <strong><code>AudioNode</code></strong><strong> </strong>representa un módulo de procesamiento de audio como una <em>fuente de audio</em> (por ejemplo un ejemplo HTML {{HTMLElement("audio")}} or {{HTMLElement("video")}}), <em>destino de audio</em>, <em>módulo de procesamiento intermedio</em> (por ejemplo un filtro como {{domxref("BiquadFilterNode")}}, o <em>control de volumen</em> como {{domxref("GainNode")}}).</dd>
- <dt>{{domxref("AudioParam")}}</dt>
- <dd>La interfaz <strong><code>AudioParam</code></strong><strong> </strong>representa un parámetro relacionado al audio, como uno de un {{domxref("AudioNode")}}. Esto puede ser establecido a un valor específico o un cambio de valor, y puede ser agendado para que ocurra en un momento específico y siguiendo un patrón específico.</dd>
- <dt>{{domxref("AudioParamMap")}}</dt>
- <dd>Provee una interfaz como para mapear a un grupo de interfaces {{domxref("AudioParam")}}, lo que significa que proporciona los métodos <code>forEach()</code>, <code>get()</code>, <code>has()</code>, <code>keys()</code>, y <code>values()</code>, como también una propiedad <code>size</code>.</dd>
- <dt>{{domxref("BaseAudioContext")}}</dt>
- <dd>La interfaz <strong><code>BaseAudioContext</code></strong> actúa como una definición base para procesamiento de gráficos de audio en y fuera de línea, como lo representa {{domxref("AudioContext")}} y {{domxref("OfflineAudioContext")}} resepectivamente. No tendrás que usar <code>BaseAudioContext</code> directamente — tendrás que usar sus características a través de una de éstas dos interfaces heredadas.</dd>
- <dt>El evento {{event("ended")}}</dt>
- <dd>El evento <code>ended</code> es lanzado cuando la reproducción se detiene porque se alcanzó el fin del archivo de medio.</dd>
-</dl>
-
-<h3 id="Definiendo_fuentes_de_audio">Definiendo fuentes de audio</h3>
-
-<p>Las interfaces que definen fuentes de audio para usar en la API de Web.</p>
-
-<dl>
- <dt>{{domxref("AudioScheduledSourceNode")}}</dt>
- <dd>La interfaz <strong><code>AudioScheduledSourceNode</code></strong> es una interfaz padre para muchos tipos de interfaces de nodos de fuentes de audio. Es un {{domxref("AudioNode")}}.</dd>
-</dl>
-
-<dl>
- <dt>{{domxref("OscillatorNode")}}</dt>
- <dd>La interfaz <strong><code style="font-size: 14px;">OscillatorNode</code></strong><strong> </strong>representa una forma de onda periódica, como una onda sinusoidal o triangular. Es un módulo de procesamiento de audio {{domxref("AudioNode")}} que causa que se cree una <em>frecuencia</em> de onda determinada.</dd>
- <dt>{{domxref("AudioBuffer")}}</dt>
- <dd>La interfaz <strong><code>AudioBuffer</code></strong> representa un recurso de audio corto que reside en la memoria, creado desde un archivo de audio usando el método {{ domxref("AudioContext.decodeAudioData()") }}, o creado con datos sin procesar usando {{ domxref("AudioContext.createBuffer()") }}. Una vez decodificado en esta forma, el audio puede ser colocado en un {{ domxref("AudioBufferSourceNode") }}.</dd>
- <dt>{{domxref("AudioBufferSourceNode")}}</dt>
- <dd>La interfaz <strong><code>AudioBufferSourceNode</code></strong> representa una fuente de audio que consiste en una datos de audio en la memoria, almacenada en un {{domxref("AudioBuffer")}}. Es un {{domxref("AudioNode")}} que actúa como una fuente de audio.</dd>
- <dt>{{domxref("MediaElementAudioSourceNode")}}</dt>
- <dd>La interfaz <code><strong>MediaElementAudio</strong></code><strong><code>SourceNode</code></strong> representa una fuente de audio que consiste en un elemento {{ htmlelement("audio") }} o {{ htmlelement("video") }} de HTML5. Es un {{domxref("AudioNode")}} que actúa como una fuente de audio.</dd>
- <dt>{{domxref("MediaStreamAudioSourceNode")}}</dt>
- <dd>La interfaz <code><strong>MediaStreamAudio</strong></code><strong><code>SourceNode</code></strong> representa una fuente de audio que consiste en un {{domxref("MediaStream")}} de <a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> (como una cámara web, micrófono, o una transmisión siendo enviada a una computadora remota). Es un {{domxref("AudioNode")}} que actúa como una fuente de audio.</dd>
-</dl>
-
-<h3 id="Definiendo_filtros_de_efectos_de_audio">Definiendo filtros de efectos de audio</h3>
-
-<p>Interfaces para definir efectos que quieras aplicar a tus fuentes de audio.</p>
-
-<dl>
- <dt>{{domxref("BiquadFilterNode")}}</dt>
- <dd>La interfaz <strong><code>BiquadFilterNode</code></strong><strong> </strong>representa una filtro de bajo orden sencillo. Es un {{domxref("AudioNode")}} que puede representar diferentes tipos de filtros, dispositivos de control de tono, o ecualizadores gráficos. Un <code>BiquadFilterNode</code> siempre tiene exactamente una entrada y una salida.</dd>
- <dt>{{domxref("ConvolverNode")}}</dt>
- <dd>La interfaz <code><strong>Convolver</strong></code><strong><code>Node</code></strong><strong> </strong>es un <span style="line-height: 1.5;">{{domxref("AudioNode")}} que realiza una Convolución Lineal en un</span><span style="line-height: 1.5;"> {{domxref("AudioBuffer")}} determinado, y es usado a menudo para lograr un efecto de reverberación</span><span style="line-height: 1.5;">.</span></dd>
- <dt>{{domxref("DelayNode")}}</dt>
- <dd>La interfaz <strong><code>DelayNode</code></strong> representa una <a href="http://en.wikipedia.org/wiki/Digital_delay_line" title="http://en.wikipedia.org/wiki/Digital_delay_line">línea de detardo</a>; un módulo de procesamiento de audio de {{domxref("AudioNode")}} que causa un retardo entre la llegada de una entrada de datos y su propagación a la salida.</dd>
- <dt>{{domxref("DynamicsCompressorNode")}}</dt>
- <dd>La intefaz <strong><code>DynamicsCompressorNode</code></strong> proporciona un efecto de compresión, que reduce el volumen de las partes más ruidosas de la señal para ayudar a evitar el recorte y la distorsión que pueden ocurrir cuando se reproducen y multiplexan múltiples sonidos a la vez.</dd>
- <dt>{{domxref("GainNode")}}</dt>
- <dd>La intefaz <strong><code>GainNode</code></strong><strong> </strong>representa un cambio de volumen. Es un módulo de procesamiento de audio de {{domxref("AudioNode")}} que causa que una <em>ganancia</em> determinada para ser aplicada a la entrada de datos antes de su propacación a la salida.</dd>
- <dt>{{domxref("WaveShaperNode")}}</dt>
- <dd>La interfaz <strong><code>WaveShaperNode</code></strong><strong> </strong>representa un la interfaz representa un distorsionador no lineal. Es un {{domxref("AudioNode")}} que usa una curva para aplicar una distorsión en forma de onda a la señal. Además de los obvios efectos de distorsión, a menudo se usa para agregar una sensación cálida a la señal.</dd>
- <dt>{{domxref("PeriodicWave")}}</dt>
- <dd>Describe una forma de onda periódica que puede ser usada para dar forma a la salida de un {{ domxref("OscillatorNode") }}.</dd>
- <dt>{{domxref("IIRFilterNode")}}</dt>
- <dd>Implementa un filtro de <strong><a class="external external-icon" href="https://en.wikipedia.org/wiki/infinite%20impulse%20response" title="infinite impulse response">respuesta de pulso infinito</a></strong> (IIR) general; este tipo de filtro se puede usar para implementar dispositivos de control de tono y ecualizadores gráficos también.</dd>
-</dl>
-
-<h3 id="Definición_de_destinos_de_audio">Definición de destinos de audio</h3>
-
-<p>Una vez que haya terminado de procesar su audio, estas interfaces definen dónde emitirlo.</p>
-
-<dl>
- <dt>{{domxref("AudioDestinationNode")}}</dt>
- <dd>La interfaz <strong><code>AudioDestinationNode</code></strong> representa el destino final de una fuente de audio en contexto determinado — usualmente los altavoces de tu dispositivo.</dd>
- <dt>{{domxref("MediaStreamAudioDestinationNode")}}</dt>
- <dd>La interfaz <code><strong>MediaStreamAudio</strong></code><strong><code>DestinationNode</code></strong> representa un destino de audio que consiste en un {{domxref("MediaStream")}} de <a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> con un <code>AudioMediaStreamTrack</code> sencillo, que puede ser usado de una manera similiar a un {{domxref("MediaStream")}} obtenido desde {{ domxref("MediaDevices.getUserMedia", "getUserMedia()") }}. Es un {{domxref("AudioNode")}} que actúa como un destino de audio.</dd>
-</dl>
-
-<h3 id="Análisis_y_visualización_de_datos">Análisis y visualización de datos</h3>
-
-<p>Si quieres extraer el tiempo, frecuencia, y otros datos de tu audio, <code>AnalyserNode</code> es lo que necesitas.</p>
-
-<dl>
- <dt>{{domxref("AnalyserNode")}}</dt>
- <dd>La interfaz <strong><code>AnalyserNode</code></strong> representa un nodo capáz de proveer la frecuencia en tiempo real y la información del análisis del dominio de tiempo, para propósitos de análisis y visualización de datos.</dd>
-</dl>
-
-<h3 id="División_y_fusión_de_canales_de_audio">División y fusión de canales de audio</h3>
-
-<p>Para dividir y fusionar canales de audio, deberás usar estas interfaces.</p>
-
-<dl>
- <dt>{{domxref("ChannelSplitterNode")}}</dt>
- <dd>La interfaz <code><strong>ChannelSplitterNode</strong></code> separa los diferentes canales de una fuente de audio enn un conjunto de salidas <em>mono</em>.</dd>
- <dt>{{domxref("ChannelMergerNode")}}</dt>
- <dd>La interfaz <code><strong>ChannelMergerNode</strong></code> reune las diferentes salidas mono en una sola salida. Cada entrada deberá ser usada para llenar un canal de la salida.</dd>
-</dl>
-
-<h3 id="Espacialización_de_audio">Espacialización de audio</h3>
-
-<p>Estas interfaces te permiten agregar efectos de paneo de especialización de audio a tus fuentes de audio.</p>
-
-<dl>
- <dt>{{domxref("AudioListener")}}</dt>
- <dd>La interfaz <strong><code>AudioListener</code></strong><strong> </strong>representa la posición y orientación de la única persona escuchando la escena de audio usada en la espacialización de audio.</dd>
- <dt>{{domxref("PannerNode")}}</dt>
- <dd>La interfaz <code><strong>PannerNode</strong></code> representa la posición y comportamiento de una señal de fuente de audio en un espacio 3D, permitiéndote crear efectos de paneo complejos.</dd>
- <dt>{{domxref("StereoPannerNode")}}</dt>
- <dd>La interfaz <code><strong>StereoPannerNode</strong></code> representa un nodo de panner estéreo simple que se puede usar para panoramizar un flujo de audio hacia la izquierda o hacia la derecha.</dd>
-</dl>
-
-<h3 id="Proccesamiento_de_audio_en_JavaScript">Proccesamiento de audio en JavaScript</h3>
-
-<p>Usando worklets de audio (pequeñas tareas), puedes definir nodos personalizados de audio escritos en JavaScript o <a href="/en-US/docs/WebAssembly">WebAssembly</a>. Los worklets de audios implementan la interfaz {{domxref("Worklet")}}, una versión ligera de la interfaz {{domxref("Worker")}}. A partir del enero de 2018, los worklets de audio están disponibles en Chrome 64 detrás de un identificador.</p>
-
-<dl>
- <dt>{{domxref("AudioWorklet")}} {{experimental_inline}}</dt>
- <dd>La interfaz <code>AudioWorklet</code> está disponible a través de {{domxref("BaseAudioContext.audioWorklet")}} y te permite agregar nuevos móduloss al worklet de audio.</dd>
- <dt>{{domxref("AudioWorkletNode")}} {{experimental_inline}}</dt>
- <dd>La intefaz <code>AudioWorkletNode</code> representa un {{domxref("AudioNode")}} que está insertada en un gráfico de audio y puede pasar mensajes a la <code>AudioWorkletProcessor</code>.</dd>
- <dt>{{domxref("AudioWorkletProcessor")}} {{experimental_inline}}</dt>
- <dd>La interfaz <code>AudioWorkletProcessor</code> representa código de procesamiento de audio que se ejecuta en un <code>AudioWorkletGlobalScope</code> que genera, procesa, o analiza audio directamente, y puede pasar mensajes al <code>AudioWorkletNode</code>.</dd>
- <dt>{{domxref("AudioWorkletGlobalScope")}} {{experimental_inline}}</dt>
- <dd>La interfaz <code>AudioWorkletGlobalScope</code> es un objeto derivado de <code>WorkletGlobalScope</code> que representa un contexto del worker en el que se ejecuta un script de procesamiento de audio; está diseñado para permitir la generación, procesamiento, y análisis de datos de audio directamente usando JavaScript en un hilo worklet.</dd>
-</dl>
-
-<p>Antes de que se definieran los worklets de audio, la API de Web Audio usó  <code>ScriptProcessorNode</code> {{deprecated_inline}} para procesamiento de audio basado en JavaScript. Como el código se ejecuta en el hilo principal, tuvo un mal rendimiento. <code>ScriptProcessorNode</code> se mantiene por razones históricas pero está marcada como obsoleta y será removida en una versión futura de la especificación.</p>
-
-<dl>
- <dt>{{domxref("ScriptProcessorNode")}} {{deprecated_inline}}</dt>
- <dd>La interfaz <strong><code>ScriptProcessorNode</code></strong><strong> </strong>permite la generación, procesamiento, o análisis de audio usando JavaScript. Es un módulo de procesamiento de audio {{domxref("AudioNode")}} que está enlazado a dos buffers, uno conteniendo la actual entrada, uno conteniendo la salida. Un evento, implementando la interfaz {{domxref("AudioProcessingEvent")}}, es enviado al objeto cada vez que el buffer de entrada contiene nuevos datos, y el manejador del evento termina cuando ha llenado el buffer de salida con datos.</dd>
- <dt>{{event("audioprocess")}} (event) {{deprecated_inline}}</dt>
- <dd>El evento <code>audioprocess</code> es lanzado cuando un buffer de entrada de un {{domxref("ScriptProcessorNode")}} del API del Audio Web está listo para ser procesado.</dd>
- <dt>{{domxref("AudioProcessingEvent")}} {{deprecated_inline}}</dt>
- <dd>El evento <code>AudioProcessingEvent</code> del <a href="/en-US/docs/Web_Audio_API" title="/en-US/docs/Web_Audio_API">API de Audio Web</a> representa los eventos que ocurren cuando un buffer de entrada {{domxref("ScriptProcessorNode")}} está listo para ser procesado.</dd>
-</dl>
-
-<h3 id="Procesamiento_de_audio_offlineen_segundo_plano">Procesamiento de audio offline/en segundo plano</h3>
-
-<p>Es posible procesar/renderizar un gráfico de muy rápidamente en segundo plano — renderizándolo en un {{domxref("AudioBuffer")}} en lugar de hacerlo a los altavoces del equipo — con lo siguiente.</p>
-
-<dl>
- <dt>{{domxref("OfflineAudioContext")}}</dt>
- <dd>La interfaz <strong><code>OfflineAudioContext</code></strong> es una interfaz {{domxref("AudioContext")}} representando un gráfico de procesamiento de audio construido a partir de varios {{domxref("AudioNode")}} enlazados juntos. En contraste con un <code>AudioContext</code> estándar, un <code>OfflineAudioContext</code> realmente no procesa el audio sino que lo genera, <em>lo más rápido que puede</em>, en un buffer.</dd>
- <dt>{{event("complete")}} (event)</dt>
- <dd>El evento <code>complete</code> es lanzado cuando el renderizado de un {{domxref("OfflineAudioContext")}} está terminado.</dd>
- <dt>{{domxref("OfflineAudioCompletionEvent")}}</dt>
- <dd>La interfaz <code>OfflineAudioCompletionEvent</code> representa los eventos que ocurren cuando procesamiento de un {{domxref("OfflineAudioContext")}} is terminado. El evento {{event("complete")}} implementa esta interfaz.</dd>
-</dl>
-
-<h2 id="Example" name="Example">Interfaces obsoletas</h2>
-
-<p>Las siguientes interfaces fueron definidas en versiones antiguas de la especificación del API de Audio Web, pero ahora están obsoletas y han sido reemplazadas por otras interfaces.</p>
-
-<dl>
- <dt>{{domxref("JavaScriptNode")}}</dt>
- <dd>Usada para dirigir procesamiento de audio a través de JavaScript. Esta interfaz está obsoleta, y ha sido reemplazada por {{domxref("ScriptProcessorNode")}}.</dd>
- <dt>{{domxref("WaveTableNode")}}</dt>
- <dd>Usada para definir una forma de onda periórica. Esta interfaz está obsoleta, y ha sido reemplazada por {{domxref("PeriodicWave")}}.</dd>
-</dl>
-
-<h2 id="Example" name="Example">Ejemplo</h2>
-
-<p>Este ejemplo muestra una amplia variedad de funciones del API de Audio Web siendo usadas. Puedes ver este código en acción en la demostración de <a href="https://mdn.github.io/voice-change-o-matic/">Voice-change-o-matic</a> (también revisa el <a href="https://github.com/mdn/voice-change-o-matic">código completo en Github</a>) — este es un demo experimental de juguete cambiador de voz; manten tus parlantes en bajo volumen cuando lo uses ¡Al menos al comenzar!</p>
-
-<p>Las líneas del API de Audio Web están resaltadas; si quieres saber más sobre lo que hacen los diferentes métodos, etc., busca en las páginas de referencia.</p>
-
-<pre class="brush: js; highlight:[1,2,9,10,11,12,36,37,38,39,40,41,62,63,72,114,115,121,123,124,125,147,151]">var audioCtx = new (window.AudioContext || window.webkitAudioContext)(); // definir contexto de audio
-// los navegadores Webkit/blink necesitan prefijo, Safari no funcionará sin window.
-
-var voiceSelect = document.getElementById("voice"); // caja de selección para la selección de opciones de efectos de voz
-var visualSelect = document.getElementById("visual"); // caja<span id="result_box" lang="es"><span class="alt-edited"> de selección para la selección de opciones de visualización de audio</span></span>
-var mute = document.querySelector('.mute'); // botón de silencio
-var drawVisual; // requestAnimationFrame
-
-var analyser = audioCtx.createAnalyser();
-var distortion = audioCtx.createWaveShaper();
-var gainNode = audioCtx.createGain();
-var biquadFilter = audioCtx.createBiquadFilter();
-
-function makeDistortionCurve(amount) { // función para hacer que la forma de curva para distorsión / nodo modificador de onda para usar
-  var k = typeof amount === 'number' ? amount : 50,
-    n_samples = 44100,
-    curve = new Float32Array(n_samples),
-    deg = Math.PI / 180,
-    i = 0,
-    x;
-  for ( ; i &lt; n_samples; ++i ) {
-    x = i * 2 / n_samples - 1;
-    curve[i] = ( 3 + k ) * x * 20 * deg / ( Math.PI + k * Math.abs(x) );
-  }
-  return curve;
-};
-
-navigator.getUserMedia (
-  // restricciones - solo el audio es necesario para esta aplicación
-  {
-    audio: true
-  },
-
-  // Retrollamada de éxito
-  function(stream) {
-    source = audioCtx.createMediaStreamSource(stream);
-    source.connect(analyser);
-    analyser.connect(distortion);
-    distortion.connect(biquadFilter);
-    biquadFilter.connect(gainNode);
-    gainNode.connect(audioCtx.destination); // conectando los diferentes nodos de grafo de audio juntos
-
-    visualize(stream);
-    voiceChange();
-
-  },
-
-  // Retrollamada de error
-  function(err) {
-    console.log('Se produjo el siguiente error gUM: ' + err);
-  }
-);
-
-function visualize(stream) {
-  WIDTH = canvas.width;
-  HEIGHT = canvas.height;
-
-  var visualSetting = visualSelect.value;
-  console.log(visualSetting);
-
-  if(visualSetting == "sinewave") {
-    analyser.fftSize = 2048;
-    var bufferLength = analyser.frequencyBinCount; // la mitad del valor de FFT
-    var dataArray = new Uint8Array(bufferLength); // crear una matriz para almacenar los datos
-
-    canvasCtx.clearRect(0, 0, WIDTH, HEIGHT);
-
-    function draw() {
-
-      drawVisual = requestAnimationFrame(draw);
-
-      analyser.getByteTimeDomainData(dataArray); // obtener datos de forma de onda y ponerlo en la matriz creada arriba
-
-      canvasCtx.fillStyle = 'rgb(200, 200, 200)'; // dibujar onda con canvas
-      canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);
-
-      canvasCtx.lineWidth = 2;
-      canvasCtx.strokeStyle = 'rgb(0, 0, 0)';
-
-      canvasCtx.beginPath();
-
-      var sliceWidth = WIDTH * 1.0 / bufferLength;
-      var x = 0;
-
-      for(var i = 0; i &lt; bufferLength; i++) {
-
-        var v = dataArray[i] / 128.0;
-        var y = v * HEIGHT/2;
-
-        if(i === 0) {
-          canvasCtx.moveTo(x, y);
-        } else {
-          canvasCtx.lineTo(x, y);
-        }
-
-        x += sliceWidth;
-      }
-
-      canvasCtx.lineTo(canvas.width, canvas.height/2);
-      canvasCtx.stroke();
-    };
-
-    draw();
-
-  } else if(visualSetting == "off") {
-    canvasCtx.clearRect(0, 0, WIDTH, HEIGHT);
-    canvasCtx.fillStyle = "red";
-    canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);
-  }
-
-}
-
-function voiceChange() {
-  distortion.curve = new Float32Array;
-  biquadFilter.gain.value = 0; // restablecer los efectos cada vez que se ejecuta la función VoiceChange
-
-  var voiceSetting = voiceSelect.value;
-  console.log(voiceSetting);
-
-  if(voiceSetting == "distortion") {
-    distortion.curve = makeDistortionCurve(400); // aplicar distorsión al sonido usando el nodo waveshaper
-  } else if(voiceSetting == "biquad") {
-    biquadFilter.type = "lowshelf";
-    biquadFilter.frequency.value = 1000;
-    biquadFilter.gain.value = 25; // aplicar el filtro lowshelf a los sonidos usando biquad
-  } else if(voiceSetting == "off") {
-    console.log("Voice settings turned off"); // no hacer nada, ya que se eligió la opción de apagado
-  }
-
-}
-
-// oyentes de eventos para cambiar la visualización y la configuración de voz
-
-visualSelect.onchange = function() {
-  window.cancelAnimationFrame(drawVisual);
-  visualize(stream);
-}
-
-voiceSelect.onchange = function() {
-  voiceChange();
-}
-
-mute.onclick = voiceMute;
-
-function voiceMute() { // alternar para silenciar y activar el sonido
-  if(mute.id == "") {
-    gainNode.gain.value = 0; // ganancia establecida en 0 para silenciar el sonido
-    mute.id = "activated";
-    mute.innerHTML = "Unmute";
-  } else {
-    gainNode.gain.value = 1; // ganancia establecida en 1 para activar el sonido
-    mute.id = "";
-    mute.innerHTML = "Mute";
-  }
-}
-</pre>
-
-<h2 id="Especificaciones">Especificaciones</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Especificación</th>
-   <th scope="col">Estado</th>
-   <th scope="col">Comentario</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Web Audio API')}}</td>
-   <td>{{Spec2('Web Audio API')}}</td>
-   <td> </td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilidad_en_navegadores">Compatibilidad en navegadores</h2>
-
-<div>{{CompatibilityTable}}</div>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>14 {{property_prefix("webkit")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>23</td>
-   <td>{{CompatNo}}</td>
-   <td>15 {{property_prefix("webkit")}}<br>
-    22 (unprefixed)</td>
-   <td>6 {{property_prefix("webkit")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome</th>
-   <th>Edge</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>Firefox OS</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte Básico</td>
-   <td>{{CompatNo}}</td>
-   <td>28 {{property_prefix("webkit")}}</td>
-   <td>{{CompatVersionUnknown}}</td>
-   <td>25</td>
-   <td>1.2</td>
-   <td>{{CompatNo}}</td>
-   <td>{{CompatNo}}</td>
-   <td>6 {{property_prefix("webkit")}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h2 id="También_ver">También ver</h2>
-
-<ul>
- <li><a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">Usando el API de Audio Web</a></li>
- <li><a href="/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API">Visualizaciones con el API de Audio Web</a></li>
- <li><a href="http://mdn.github.io/voice-change-o-matic/">Voice-change-O-matic example</a></li>
- <li><a href="http://mdn.github.io/violent-theremin/">Violent Theremin example</a></li>
- <li><a href="/en-US/docs/Web/API/Web_Audio_API/Web_audio_spatialization_basics">Bases de la espacialización de audio Web</a></li>
- <li><a href="http://www.html5rocks.com/tutorials/webaudio/positional_audio/" title="http://www.html5rocks.com/tutorials/webaudio/positional_audio/">Mixing Positional Audio and WebGL</a></li>
- <li><a href="http://www.html5rocks.com/tutorials/webaudio/games/" title="http://www.html5rocks.com/tutorials/webaudio/games/">Developing Game Audio with the Web Audio API</a></li>
- <li><a href="/en-US/docs/Web/API/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext" title="/en-US/docs/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext">Porting webkitAudioContext code to standards based AudioContext</a></li>
- <li><a href="https://github.com/bit101/tones">Tonos</a>: Una sencilla librería para reproducción de tonos/notas específicas usando el API de Audio Web.</li>
- <li><a href="https://github.com/goldfire/howler.js/">howler.js</a>: a JS audio library that defaults to <a href="https://dvcs.w3.org/hg/audio/raw-file/tip/webaudio/specification.html">Web Audio API</a> and falls back to <a href="http://www.whatwg.org/specs/web-apps/current-work/#the-audio-element">HTML5 Audio</a>, as well as providing other useful features.</li>
- <li><a href="https://github.com/mattlima/mooog">Mooog</a>: jQuery-style chaining of AudioNodes, mixer-style sends/returns, and more.</li>
- <li><a class="external external-icon" href="https://github.com/chrisjohndigital/OpenLang">OpenLang</a>: HTML5 video language lab web application using the Web Audio API to record and combine video and audio from different sources into a single file (<a class="external external-icon" href="https://github.com/chrisjohndigital/OpenLang">source on GitHub</a>)</li>
-</ul>
-
-<h3 id="Enlaces_rápidos">Enlaces rápidos</h3>
-
-<ol>
- <li><strong>Guíass</strong>
-
-  <ol>
-   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Basic_concepts_behind_Web_Audio_API">Conceptos básicos detrás del API de Audio Web</a></li>
-   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API">Usando el API de Audio Web</a></li>
-   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API">Visualizaciones con el API de Audio Web</a></li>
-   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Web_audio_spatialization_basics">Bases de la espacialización de audio Web</a></li>
-   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext" title="/en-US/docs/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext">Portando código de webkitAudioContext a estándares basados en AudioContext</a></li>
-  </ol>
- </li>
- <li><strong>Ejemplos</strong>
-  <ol>
-   <li><a href="/en-US/docs/Web/API/Web_Audio_API/Simple_synth">Teclado sintetizador sencillo</a></li>
-   <li><a href="http://mdn.github.io/voice-change-o-matic/">Voice-change-O-matic</a></li>
-   <li><a href="http://mdn.github.io/violent-theremin/">Violent Theremin</a></li>
-  </ol>
- </li>
- <li><strong>Interfaces</strong>
-  <ol>
-   <li>{{domxref("AnalyserNode")}}</li>
-   <li>{{domxref("AudioBuffer")}}</li>
-   <li>{{domxref("AudioScheduledSourceNode")}}</li>
-   <li>{{domxref("AudioBufferSourceNode")}}</li>
-   <li>{{domxref("AudioContext")}}</li>
-   <li>{{domxref("AudioDestinationNode")}}</li>
-   <li>{{domxref("AudioListener")}}</li>
-   <li>{{domxref("AudioNode")}}</li>
-   <li>{{domxref("AudioParam")}}</li>
-   <li>{{event("audioprocess")}} (event)</li>
-   <li>{{domxref("AudioProcessingEvent")}}</li>
-   <li>{{domxref("BiquadFilterNode")}}</li>
-   <li>{{domxref("ChannelMergerNode")}}</li>
-   <li>{{domxref("ChannelSplitterNode")}}</li>
-   <li>{{event("complete")}} (event)</li>
-   <li>{{domxref("ConvolverNode")}}</li>
-   <li>{{domxref("DelayNode")}}</li>
-   <li>{{domxref("DynamicsCompressorNode")}}</li>
-   <li>{{event("ended_(Web_Audio)", "ended")}} (event)</li>
-   <li>{{domxref("GainNode")}}</li>
-   <li>{{domxref("MediaElementAudioSourceNode")}}</li>
-   <li>{{domxref("MediaStreamAudioDestinationNode")}}</li>
-   <li>{{domxref("MediaStreamAudioSourceNode")}}</li>
-   <li>{{domxref("OfflineAudioCompletionEvent")}}</li>
-   <li>{{domxref("OfflineAudioContext")}}</li>
-   <li>{{domxref("OscillatorNode")}}</li>
-   <li>{{domxref("PannerNode")}}</li>
-   <li>{{domxref("PeriodicWave")}}</li>
-   <li>{{domxref("ScriptProcessorNode")}}</li>
-   <li>{{domxref("WaveShaperNode")}}</li>
-  </ol>
- </li>
-</ol>
diff --git a/files/es/web_development/mobile/diseño_responsivo/index.html b/files/es/web_development/mobile/diseño_responsivo/index.html
deleted file mode 100644
index 6445a631af..0000000000
--- a/files/es/web_development/mobile/diseño_responsivo/index.html
+++ /dev/null
@@ -1,45 +0,0 @@
----
-title: Diseño adaptable («responsivo»)
-slug: Web_Development/Mobile/Diseño_responsivo
-translation_of: Web/Progressive_web_apps
-translation_of_original: Web/Guide/Responsive_design
----
-<p>Como reacción a los problemas asociados con la estrategia de desarrollar <a href="https://developer.mozilla.org/en/Web_Development/Mobile/Separate_sites" title="en/Web development/Mobile/Separate sites">sitios web separados</a> para los móviles y los escritorios, una idea relativamente nueva — aunque de hecho es <a class="external" href="http://www.alistapart.com/articles/dao/">bastante vieja</a>— que está aumentando en popularidad: deshacerse por completo de la detección del agente de usuario y hacer que la misma página responda a las capacidades del navegador en el lado del cliente. Este enfoque se ha denominado comúnmente como <a class="external" href="http://www.alistapart.com/articles/responsive-web-design/">diseño web adaptable —o «responsivo»—</a>. Al igual que la estrategia de sitios separados, el diseño web adaptativo tiene aspectos positivos y negativos.</p>
-<h2 id="Las_ventajas">Las ventajas</h2>
-<p>Aunque no se propuso inicialmente como un método para crear sitios para los móviles, el diseño flexible ha ganado recientemente mucha atención como una forma de dar los primeros pasos para el desarrollo de sitios que sean compatibles y amigables con los móviles en vez de tener un sitio separado para los mismos.</p>
-<p>Se ahorra tiempo y dinero, ya que no es necesario mantener sitios web separados para los diferentes dispositivos.</p>
-<p>El diseño flexilbe ofrece cada página con una sola y única URL. Las estadísticas compartidas de las redes sociales (Facebook Likes, Tweets, 1 en Google plus) no están divididas, ya que las versiones de tus páginas web para el escritorio y los móviles utilizan la misma URL .</p>
-<p>El diseño adaptativo no se preocupa por los agentes de usuario.</p>
-<p>Hay aspectos realmente buenos en este enfoque. Puesto que no se basa en la detección del navegador del usuario, tiene más capacidad de adaptarse cara al futuro que el enfoque de sitios separados. Para sitios sencillos, puede ser más fácil de implementar y mantener que otras opciones.</p>
-<h2 id="Las_desventajas">Las desventajas</h2>
-<p>Este enfoque no está excento de limitaciones. Dado que el contenido debe ser modificado del lado del cliente con JavaScript, se busca cambiar solo lo mínimo necesario. En general, las cosas suelen complicarse muy rápido si tratamos de escribir dos códigos separados en JavaScript para trabajar con el mismo DOM. Ésta es la razón más importante por la que las aplicaciones web tienden a no adoptan esta enfoque.</p>
-<p>Dar a tu sitio actual un diseño flexible también implica reescribir tus estilos, si aún no están luciendo un diseño flexible. Podría tener sus ventajas hacer un diseño adaptativo de tu sitio y ser una buena oportunidad para modernizar y limpiar el CSS de tu sitio.</p>
-<p>Por último, dado que vas a añadir código a tus archivos de comandos (scripts) y tus estilos, el rendimiento puede ser peor que con el enfoque de los sitios separados. En realidad no hay forma de evitar esto salvo refactorizar tus archivos de comandos y tus estilos para ahorrar algunos bytes a largo plazo.</p>
-<h2 id="Cuándo_es_adecuado_elegir_esta_opción">Cuándo es adecuado elegir esta opción</h2>
-<p><a href="/@api/deki/files/5894/=teixido_responsive-300x177.png" title="teixido_responsive-300x177.png"><img align="right" alt="teixido_responsive-300x177.png" class="internal rwrap" src="/@api/deki/files/5894/=teixido_responsive-300x177.png?size=webview" style="width: 300px; height: 177px;"></a>Como se mencionó anteriormente, debido a que los cambios de contenido pueden resultar difíciles, cuando se toma este enfoque, no somos capaces de dar a los usuarios una experiencia radicalmente diferente en el móvil sin un aumento significativo en la complejidad del código. Entonces, si las versiones del escritorio y los móviles son muy similares, este enfoque es una opción muy buena. Ésto es partir de páginas bien adaptadas a sitios centrados en los datos, como las páginas de producto. Puede ver ejemplos debajo, de blog o portfolios!</p>
-<h2 id="Ejemplos">Ejemplos</h2>
-<p>Aunque no es tan popular como el enfoque de sitios separados, hay cada día más sitios web que emplean esta técnica. Por suerte, ya que todo el código está del lado del cliente, si desea ver cómo un sitio implementa técnicamente este método, es tan simple como visitar el sitio y hacer clic en “Ver código fuente.” Aquí tienes algunos ejemplos:</p>
-<ul>
- <li><a class="external" href="http://teixido.co/">http://teixido.co/</a> – uno de mis diseños flexibles favoritos, también la foto de arriba.</li>
- <li><a class="external" href="http://adactio.com/journal/1696">http://adactio.com/journal/1696</a> – también es un buen artículo para leer, con sus propios enlaces a ejemplos</li>
- <li><a class="external" href="http://thinkvitamin.com/">http://thinkvitamin.com/</a></li>
- <li><a class="external" href="http://stephencaver.com/">http://stephencaver.com/</a></li>
- <li><a class="external" href="http://hicksdesign.co.uk/">http://hicksdesign.co.uk/</a></li>
-</ul>
-<p>A pesar de ser un método relativamente nuevo, ya están apareciendo mejores prácticas. Por ejemplo, si tú estás diseñando un sitio desde cero con esta opción en mente,  por lo general vale la pena  <a class="external" href="http://www.lukew.com/ff/entry.asp?1117">crear primero un diseño de pantalla pequeña</a>, de manera que las limitaciones del telefono móvil están contigo desde el principio. También es de gran utilidad la mejora progresiva de tus estilos en lugar de ocultar los elementos de tu sitio actual con preguntas de los medios. De esta manera, los navegadores antiguos que no admitan las preguntas de los medios siguen mostrando la disposición adecuada. Una excelente presentación sobre las ventajas de este método la puedes ver <a class="external" href="http://www.slideshare.net/bryanrieger/rethinking-the-mobile-web-by-yiibu">aquí</a>.</p>
-<h2 id="Métodos_de_desarrollo_web_para_móviles">Métodos de desarrollo web para móviles</h2>
-<p>Consulta los siguientes artículos de antecedentes y otros enfoques para el desarrollo de plataformas móviles.</p>
-<ul>
- <li><a href="/en/Web_Development/Mobile/Mobile-friendliness" title="XML Web Services">¿Qué es un móvil-amigable?</a></li>
- <li><a href="/en/Web_Development/Mobile/Separate_sites" title="en/Web development/Mobile/Separate sites">Sitios separados</a></li>
- <li><a href="/en/Web_development/Mobile/A_hybrid_approach" title="en/Web development/Mobile/Hybrid approach">Un enfoque híbrido</a></li>
-</ul>
-<h2 id="Véase_también">Véase también</h2>
-<ul>
- <li><a href="/en/Web_Development/Responsive_Web_design" title="Responsive Web design">Diseño Web Adaptativo</a> para ver recursos adicionales</li>
-</ul>
-<div class="originaldocinfo">
- <h3 id="Original_document_information">Original document information</h3>
- <p>Originally published on 27 May, 2011 on the Mozilla Webdev blog as "<a class="external" href="http://blog.mozilla.com/webdev/2011/05/27/approaches-to-mobile-web-development-part-3-responsive-design/" title="http://blog.mozilla.com/webdev/2011/05/27/approaches-to-mobile-web-development-part-3-responsive-design/">Approaches to Mobile Web Development Part 3 - Responsive Design</a>", by Jason Grlicky.</p>
-</div>
-<p> </p>
diff --git a/files/es/web_development/mobile/index.html b/files/es/web_development/mobile/index.html
deleted file mode 100644
index cc288a9c45..0000000000
--- a/files/es/web_development/mobile/index.html
+++ /dev/null
@@ -1,18 +0,0 @@
----
-title: Mobile Web development
-slug: Web_Development/Mobile
-tags:
-  - Mobile
-  - NeedsTranslation
-  - TopicStub
-  - Web Development
-translation_of: Web/Guide/Mobile
-translation_of_original: Web_Development/Mobile
----
-<p>Developing web sites to be viewed on mobile devices requires approaches that ensure a web site works as well on mobile devices as it does on desktop browsers. The following articles describe some of these approaches.</p>
-<ul>
-  <li><a class="vt-p" href="/en/Web_Development/Mobile/Mobile-friendliness" title="/en/Web_development/Mobile/Mobile-friendliness">What is mobile-friendliness?</a></li>
-  <li><a class="vt-p" href="/en/Web_Development/Mobile/Separate_sites" title="en/Web_development/Mobile/Separate sites">Separate sites</a></li>
-  <li><a class="vt-p" href="/en/Web_Development/Mobile/Responsive_design" title="/en/Web_development/Mobile/Responsive design">Responsive design</a></li>
-  <li><a class="vt-p" href="/en/Web_development/Mobile/A_hybrid_approach" title="A New Approach to Web Applications (external)">A hybrid approach</a></li>
-</ul>
diff --git a/files/es/webapi/estado_de_bateria/index.html b/files/es/webapi/estado_de_bateria/index.html
deleted file mode 100644
index 9cdc7259be..0000000000
--- a/files/es/webapi/estado_de_bateria/index.html
+++ /dev/null
@@ -1,39 +0,0 @@
----
-title: API de Estado de Bateria
-slug: WebAPI/Estado_de_Bateria
-tags:
-  - API
-  - Apps
-  - Firefox OS
-  - Mobile
-translation_of: Web/API/Battery_Status_API
----
-<p>La <strong>API de Estado de Batería</strong>, también conocida como "<strong>Battery API</strong>", provee información acerca del sistema de carga de la batería y permite notificar mediante eventos que son enviados cuando el nivel de la batería cambia. Este puede ser usado para ajustar el uso de recursos por parte de una aplicación y evitar un gasto innecesario de energía cuando la batería esta baja o para guardar cambios en un archivo antes de que la batería se agote y así prevenir perdida de información.</p>
-<p>La API de Estado de Batería se puede extender mediante {{domxref("window.navigator")}} con una propiedad {{domxref("window.navigator.battery")}} que pertenece al objeto {{domxref("BatteryManager")}} y agrega algunos nuevos eventos que usted puede recibir en el monitor de estado de la batería.</p>
-<h2 id="Ejemplo">Ejemplo</h2>
-<p>En este ejemplo, observamos los cambios en el estado de la carga (este o no conectado y cargando) y  en el nivel de la batería. Esto se hace escuchando el evento {{event("chargingchange")}} y el evento {{event("levelchange")}} respectivamente.</p>
-<pre class="brush: js">var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery;
-
-function updateBatteryStatus() {
-  console.log("Battery status: " + battery.level * 100 + " %");
-
-  if (battery.charging) {
-    console.log("Battery is charging");
-  }
-}
-
-battery.addEventListener("chargingchange", updateBatteryStatus);
-battery.addEventListener("levelchange", updateBatteryStatus);
-updateBatteryStatus();
-</pre>
-<p>Vea también: <a class="external" href="http://dev.w3.org/2009/dap/system-info/battery-status.html#introduction">El ejemplo en las especificaciones</a></p>
-<h2 id="Especificaciones">Especificaciones</h2>
-<p>{{page("/en-US/docs/Web/API/BatteryManager","Specifications")}}</p>
-<h2 id="Compatibilidad_del_Navegador">Compatibilidad del Navegador</h2>
-<p>{{page("/en-US/docs/Web/API/BatteryManager","Browser_compatibility")}}</p>
-<h2 id="Vea_también">Vea también</h2>
-<ul>
-  <li><a class="external" href="http://hacks.mozilla.org/2012/02/using-the-battery-api-part-of-webapi/">Hacks blog post - Usando la API de Batería</a></li>
-  <li>{{domxref("BatteryManager")}}</li>
-  <li>{{domxref("window.navigator.battery","navigator.battery")}}</li>
-</ul>
diff --git a/files/es/webapi/index.html b/files/es/webapi/index.html
deleted file mode 100644
index 0c189b625d..0000000000
--- a/files/es/webapi/index.html
+++ /dev/null
@@ -1,144 +0,0 @@
----
-title: WebAPI
-slug: WebAPI
-tags:
-  - Apps
-  - DOM
-  - Firefox OS
-  - Mobile
-  - NeedsTranslation
-  - TopicStub
-translation_of: Web/API
-translation_of_original: WebAPI
----
-<p><strong>WebAPI</strong> es un termino usado para referirse al conjunto de APIs compatibles y de acceso a los dispositivos que permite a las Web apps y contenido acceder al hardware del dispositivo (como el estado de la batería o la vibración de hardware), al igual que acceso a información almacenada en el dispositivo (como el calendario o la lista de contactos). Agregando estas APIs, esperamos expandir lo que la Web puede hacer hoy y solo plataformas propietarias fueron capaces de hacer en el pasado.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> More of this documentation has been written than it looks like; links are not all added yet. We're actively working on improving this and expect to see things much better over the next couple of weeks. See the <a href="/en-US/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">WebAPI doc status page</a>, where we're tracking work on WebAPI docs.</p>
-</div>
-
-<div class="row topicpage-table">
-<div class="section">
-<h2 class="Documentation" id="Communication_APIs" name="Communication_APIs">APIs DE COMUNICACIÓN</h2>
-
-<dl>
- <dt><a href="/en-US/docs/WebAPI/Network_Information" title="WebAPI/Network_Information">API de información de la red</a></dt>
- <dd>Provee información básica sobre la conexión de red actual, como la velocidad de conexión.</dd>
-</dl>
-
-<dl>
- <dt><a href="/en-US/docs/WebAPI/WebBluetooth" title="WebAPI/WebBluetooth">Bluetooth</a></dt>
- <dd>La API de  WebBluetooth provee acceso a bajo nivel  al hardware de Bluetooth del dispositivo.</dd>
- <dt><a href="/en-US/docs/WebAPI/Mobile_Connection" title="WebAPI/Mobile_Connection">API de conexión móvil</a> {{NonStandardBadge}}</dt>
- <dd>Expone información sobre la conectividad celular del dispositivo, como la fuerza de la señal, información del operador y así suscesivamente.</dd>
- <dt><a href="/en-US/docs/WebAPI/Network_Stats" title="WebAPI/Network_Stats">API de estadísticas de red</a></dt>
- <dd>Monitorea la data usada y expone esta data a aplicaciones privilegiadas.</dd>
- <dt><a href="/en-US/docs/WebAPI/TCP_Socket" title="WebAPI/TCP_Socket">TCP Socket API</a></dt>
- <dd>Proporciona sockets de bajo nivel y soporte SSL.</dd>
- <dt><a href="/en-US/docs/WebAPI/WebTelephony" title="WebAPI/WebTelephony">Telefonía</a> {{NonStandardBadge}}</dt>
- <dd>Permite a las apps contestar llamadas telefónicas y usar la interfaz de usuario de telefonía integrada.</dd>
- <dt><a href="/en-US/docs/WebAPI/WebSMS" title="WebAPI/WebSMS">WebSMS </a>{{NonStandardBadge}}</dt>
- <dd>Permite a las apps enviar y recibir mensajes de texto, así como también acceder y manejar los mensajes almacenados en el dispositivo.</dd>
- <dt><a href="/en-US/docs/WebAPI/WiFi_Information" title="WebAPI/WiFi_Information">API de información de WiFi</a></dt>
- <dd>API privilegiada, la cual provee información sobre la fuerza de la señal, el nombre de la red actual, redes wifi disponibles, y más.</dd>
-</dl>
-
-<h2 class="Documentation" id="Hardware_access_APIs" name="Hardware_access_APIs">APIS de acceso a Hardware</h2>
-
-<dl>
- <dt><a href="/en-US/docs/WebAPI/Using_Light_Events">API de sensor de luz ambiental</a></dt>
- <dd>Provee acceso al sensor de luz ambiental, el cual permite a una app detectar el nivel de luz ambiental proximos al dispositivo.</dd>
- <dt><a href="/en-US/docs/WebAPI/Battery_Status" title="WebAPI/Battery_Status">API de estado de batería</a></dt>
- <dd>Provee información sobre el nivel de carga de la batería y si el dispositivo se encuentra conectado a un punto de carga o no.</dd>
-</dl>
-
-<dl>
- <dt><a href="/en-US/docs/Using_geolocation" title="Using_geolocation">API de Geolocalización</a></dt>
- <dd>Provee información sobre la ubicación física del dispositivo.</dd>
- <dt><a href="/en-US/docs/WebAPI/Pointer_Lock" title="API/Pointer_Lock_API">API de bloqueo de puntero</a></dt>
- <dd>Permite a las apps bloquear acceso al mouse y obtener acceso a los deltas de movimiento en lugar de coordenadas absolutas; esto es ideal para juegos.</dd>
-</dl>
-
-<dl>
- <dt><a href="/en-US/docs/WebAPI/Proximity" title="WebAPI/Proximity">API de proximidad</a></dt>
- <dd>Permite determinar la proximidad del dispositivo a objetos cercanos, como el rostro del usuario.</dd>
- <dt><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Detecting_device_orientation" title="WebAPI/Detecting_device_orientation">API de orientación del dispositivo</a></dt>
- <dd>Provee notificaciones cuando la orientación del dispositivo cambia.</dd>
- <dt><a href="/en-US/docs/Detecting_device_orientation" title="Detecting_device_orientation">API de orientación de pantalla</a></dt>
- <dd>Provee notificaciones cuando cambia la orientación de la pantalla. También puedes usar esta API para dejar que su app indique que orientación prefiere.</dd>
- <dt><a href="/en-US/docs/WebAPI/Vibration" title="WebAPI/WebBluetooth">API de Vibración</a></dt>
- <dd>Permite a las apps controlar la vibración de hardware del dispositivo para cosas como retroalimentación háptica en juegos. Esto <strong>no</strong> es pensado para cosas como vibraciones de notificaciones, para ello revisa la <a href="/en-US/docs/WebAPI/Alarm" title="WebAPI/Alarm">API de Alarma</a>.</dd>
-</dl>
-
-<dl>
- <dt><a href="/en-US/docs/WebAPI/Camera" title="WebAPI/Camera">API de Cámara</a> {{NonStandardBadge}}</dt>
- <dd>Permite a las apps tomar fotografías y/o grabar videos usaando la cámara integrada del dispositivo.</dd>
- <dt><a href="/en-US/docs/WebAPI/Power_Management" title="WebAPI/Power_Management">API de administración de energía </a>{{NonStandardBadge}}</dt>
- <dd>Permite a las apps encender o apagar la pantalla, el CPU, la energía del dispositivo, y así sucesivamente. También provee soporte para escuchar e inspeccionar eventos de bloqueo de recursos.</dd>
-</dl>
-
-<p><span class="alllinks"><a href="/en-US/docs/tag/WebAPI" title="tag/CSS">View All...</a></span></p>
-</div>
-
-<div class="section">
-<h2 class="Documentation" id="Data_management_APIs" name="Data_management_APIs">APIs de administración de información</h2>
-
-<dl>
-</dl>
-
-<dl>
- <dt><a href="/en-US/docs/WebAPI/FileHandle_API" title="WebAPI/FileHandle_API">API de identificador de archivos</a></dt>
- <dd>Provee soporte para escribir archivos con soporte de bloqueo.</dd>
- <dt><a href="/en-US/docs/IndexedDB" title="IndexedDB">IndexedDB</a></dt>
- <dd>Almacenamiento de información estructurada del lado cliente con soporte para búsquedas de alto rendimiento.</dd>
-</dl>
-
-<h2 class="Documentation" id="Other_APIs" name="Other_APIs">OtrAS APIs</h2>
-
-<dl>
- <dt><a href="/es/docs/WebAPI/Alarm" title="WebAPI/Alarm">API de Alarma</a></dt>
- <dd>Permite a las apps programar notificaciones.</dd>
- <dd>También proporciona soporte para el lanzamiento de una aplicación de forma automática en un momento determinado.</dd>
- <dt><a href="/en-US/docs/Apps" title="Apps">Apps API</a></dt>
- <dd>La API de aplicaciones web abiertas permite soporte para instalar y administrar aplicaciones web. Y además, permite a las aplicaciones determinar información de pago.</dd>
- <dt><a href="/en-US/docs/DOM/Using_the_Browser_API" title="DOM/Using_the_Browser_API"><strong>API de navegador</strong></a></dt>
- <dd>Provee soporte para construir un navegador web usando tecnologías web completamente (en esencia, un navegador dentro de un navegador).</dd>
-</dl>
-
-<dl>
- <dt><a href="/en-US/docs/WebAPI/Idle" title="WebAPI/Device_Storage_API">Idle API</a></dt>
- <dd>Permite a las apps recibir información cuando el usuario no está usando el dispositivo activamente.</dd>
- <dt><a href="/en-US/docs/WebAPI/Permissions" title="WebAPI/Permissions">API de permisos</a></dt>
- <dd>Administra permisos de las apps en una ubicación central. Usado por la app de Ajustes.</dd>
- <dt><a href="/en-US/docs/WebAPI/Simple_Push" title="WebAPI/Push_Notifications">Simple Push API</a></dt>
- <dd>Permite a la plataforma enviar mensajes de notificación a aplicaciones específicas.</dd>
- <dt><a href="/en-US/docs/WebAPI/Time_and_Clock" title="WebAPI/Time_and_Clock">API de tiempo/reloj</a> {{NonStandardBadge}}</dt>
- <dd>Provee soporte para ajustar el tiempo actual. La zona horaria es establecida usando la <a href="/en-US/docs/WebAPI/Settings" title="WebAPI/Settings">API de ajustes</a>.</dd>
- <dt><a href="/en-US/docs/WebAPI/Web_Activities" title="WebAPI/Web_Activities">Web Activities</a> {{NonStandardBadge}}</dt>
- <dd>Permite a una app delegar una actividad a otra app; por ejemplo, una app podría preguntar a otra app seleccionar (o crear) y devolver una foto. Normalmente el usuario es capaz de configurar que aplicaciones se utilizan para que actividad.</dd>
- <dt><a href="/en-US/docs/Apps/Publishing/In-app_payments" title="Apps/Publishing/In-app_payments">WebPayment API</a> {{NonStandardBadge}}</dt>
- <dd>Permite a contenido web iniciar pago y reembolsos por bienes virtuales.</dd>
-</dl>
-
-<h2 class="Community" id="Community" name="Community">comunidad WebAPI</h2>
-
-<p>Si necesitas ayuda con estas APIs, existen varias maneras en la que puedes hablar con otros desarrolladores que las utilizan.</p>
-
-<ul>
- <li>Consulta en el foro de WebAPI: {{DiscussionList("dev-webapi", "mozilla.dev.webapi")}}</li>
- <li>Visita el canal de IRC de WebAPI: <a href="irc://irc.mozilla.org/webapi" title="irc://irc.mozilla.org/webapi">#webapi</a></li>
-</ul>
-
-<p><span class="alllinks"><a href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p>
-
-<h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">temas Relacionados</h2>
-
-<ul>
- <li>El <a href="/es/docs/DOM" title="Document Object Model (DOM)">Modelo de Objetos del Documento (DOM)</a> es la representación estructural del documento HTML.</li>
- <li><a href="/es/docs/JavaScript" title="JavaScript">JavaScript</a> - Lenguaje de Script para la Web.</li>
- <li><a href="/en-US/docs/WebAPI/Doc_status" title="WebAPI/Doc_status">Doc status</a>: Una lista de WebAPIs y el estado de su documentación.</li>
-</ul>
-</div>
-</div>
-
-<p> </p>
diff --git a/files/es/webapi/pointer_lock/index.html b/files/es/webapi/pointer_lock/index.html
deleted file mode 100644
index 13a27d6d48..0000000000
--- a/files/es/webapi/pointer_lock/index.html
+++ /dev/null
@@ -1,284 +0,0 @@
----
-title: API Pointer Lock
-slug: WebAPI/Pointer_Lock
-translation_of: Web/API/Pointer_Lock_API
----
-<p> </p>
-
-<p><strong>Pointer Lock </strong>(antes llamado Bloqueo del <em>Mouse</em>)  proporciona métodos de entrada basados ​​en el movimiento del ratón a traves del tiempo (es decir, deltas), no sólo la posición absoluta del cursor del <em>mouse</em>. Te da acceso al movimiento <span style="line-height: inherit;">puro </span><span style="line-height: inherit;">del <em>mouse</em>, bloquea el objetivo de los eventos del <em>mouse</em> a un solo elemento, elimina límites en cuanto a  que tan lejos puedes mover el <em>mouse</em> en una sola dirección, y quita el cursor de la vista.</span></p>
-
-<p>Esta API es útil para aplicaciones que requieren bastantes acciones para controlar los movimientos del <em>mouse</em>, rotar objetos y cambiar las entradas. Es especialmente importante para aplicaciones altamente visuales, tales como los que utilizan la perspectiva en primera persona, así como vistas en 3D y modelado.</p>
-
-<p>Por ejemplo, puedes crear aplicaciones que permiten a los usuarios controlar el ángulo de visión con sólo mover el <em>mouse</em> sin ningún clic, permitiendo liberar <span style="line-height: inherit;">los clics</span><span style="line-height: inherit;"> para otras acciones. Este tipo de entrada del <em>mouse</em> es muy útil para ver mapas, imágenes de satélite, o escenas en primera persona (como en un juego o un vídeo embebido).</span></p>
-
-<p><strong>Pointer Lock</strong><span style="line-height: inherit;"> te permite acceder a los eventos del </span><em>mouse</em><span style="line-height: inherit;"> incluso cuando el cursor pasa por el límite de la pantalla del navegador. Por ejemplo, los usuarios pueden seguir girando o manipular un modelo 3D moviendo el </span><em>mouse</em><span style="line-height: inherit;"> sin fin. Sin </span><strong>Pointer Lock</strong><span style="line-height: inherit;">, la rotación o la manipulación se detiene en el momento en que el cursor alcanza el borde de la pantalla del navegador. Los jugadores se verán particularmente encantados con esta característica, ya que anciosamente pueden hacer clic en los botones y arrastrar el cursor del </span><em>mouse</em><span style="line-height: inherit;"> de un lado a otro sin tener que preocuparse por salir de la zona de juego ni de cliquear accidentalmente otra aplicación que podría llevar al </span><em>mouse</em><span style="line-height: inherit;"> fuera del juego. Una tragedia!</span></p>
-
-<h2 id="basics" name="basics">Conceptos Básicos</h2>
-
-<p><strong>Pointer Lock</strong><strong style="line-height: inherit;"> </strong><span style="line-height: inherit;">está relacionado con la <em>mouse capture</em>. </span><em>mouse capture </em><span style="line-height: inherit;">proporciona la entrega continua de eventos a un elemento de destino, mientras que el <em>mouse</em> se arrastra, pero se detiene cuando se suelta el clic. </span><strong>Pointer Lock</strong><span style="line-height: inherit;"> es diferente de </span><em>mouse capture </em><span style="line-height: inherit;">en las siguientes maneras:</span></p>
-
-<ul>
- <li><span style="line-height: 1.5em;">Es persistente. <strong style="line-height: normal;">Pointer Lock</strong> no libera el <em>mouse</em> hasta que se haga una llamada explícita a la API  o el usuario utilize un gesto concreto de lanzamiento.</span></li>
- <li><span style="line-height: 1.5em;">No está limitado por los limites del navegador o la pantalla.</span></li>
- <li>Envia continuamente eventos independientemente del estado del clic del <em>mouse</em>.</li>
- <li>Oculta el cursor.</li>
-</ul>
-
-<h2 id="example" name="example">Ejemplo</h2>
-
-<p>El siguiente es un ejemplo de cómo se puede configurar <strong>Pointer Lock</strong> en su página web.</p>
-
-<pre class="brush: js">&lt;button onclick="lockPointer();"&gt;Lock it!&lt;/button&gt;
-&lt;div id="pointer-lock-element"&gt;&lt;/div&gt;
-&lt;script&gt;
-// Nota: Al momento de escribir esto, sólo Mozilla y WebKit apoyan Pointer Lock.
-
-// El elemento que servirá para pantalla completa y pointer lock.
-var elem;
-
-document.addEventListener("mousemove", function(e) {
-  var movementX = e.movementX       ||
-                  e.mozMovementX    ||
-                  e.webkitMovementX ||
-                  0,
-      movementY = e.movementY       ||
-                  e.mozMovementY    ||
-                  e.webkitMovementY ||
-                  0;
-
-  // Imprime los valores delta del movimiento del mouse
-  console.log("movementX=" + movementX, "movementY=" + movementY);
-}, false);
-
-function fullscreenChange() {
-  if (document.webkitFullscreenElement === elem ||
-      document.mozFullscreenElement === elem ||
-      document.mozFullScreenElement === elem) { // Older API upper case 'S'.
-    // El elemento esta en pantalla completa, ahora podemos hacer el request de pointer lock
-    elem.requestPointerLock = elem.requestPointerLock    ||
-                              elem.mozRequestPointerLock ||
-                              elem.webkitRequestPointerLock;
-    elem.requestPointerLock();
-  }
-}
-
-document.addEventListener('fullscreenchange', fullscreenChange, false);
-document.addEventListener('mozfullscreenchange', fullscreenChange, false);
-document.addEventListener('webkitfullscreenchange', fullscreenChange, false);
-
-function pointerLockChange() {
-  if (document.mozPointerLockElement === elem ||
-      document.webkitPointerLockElement === elem) {
-    console.log("Pointer Lock was successful.");
-  } else {
-    console.log("Pointer Lock was lost.");
-  }
-}
-
-document.addEventListener('pointerlockchange', pointerLockChange, false);
-document.addEventListener('mozpointerlockchange', pointerLockChange, false);
-document.addEventListener('webkitpointerlockchange', pointerLockChange, false);
-
-function pointerLockError() {
-  console.log("Error while locking pointer.");
-}
-
-document.addEventListener('pointerlockerror', pointerLockError, false);
-document.addEventListener('mozpointerlockerror', pointerLockError, false);
-document.addEventListener('webkitpointerlockerror', pointerLockError, false);
-
-function lockPointer() {
-  elem = document.getElementById("pointer-lock-element");
-  // Start by going fullscreen with the element.  Current implementations
-  // require the element to be in fullscreen before requesting pointer
-  // lock--something that will likely change in the future.
-  elem.requestFullscreen = elem.requestFullscreen    ||
-                           elem.mozRequestFullscreen ||
-                           elem.mozRequestFullScreen || // Older API upper case 'S'.
-                           elem.webkitRequestFullscreen;
-  elem.requestFullscreen();
-}
-&lt;/script&gt;
-</pre>
-
-<h2 id="method_overview" name="method_overview">Propiedades/Métodos</h2>
-
-<p>La API de bloque de puntero ,similar a la API de Fullscreen,extiende del elemento DOM agregando un nuevo método, <code>requestPointerLock</code>, la cual es dependiente del vendedor(del navegador). Puede escribirse como:</p>
-
-<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">element.webkitRequestPointerLock(); // para Chrome</span></span>
-
-element.mozRequestPointerLock(); // para Firefox
-</pre>
-
-<p>Current implementations of <code>requestPointerLock</code> are tightly bound to <code>requestFullScreen</code> and the Fullscreen API. Before an element can be pointer locked, it must first enter the fullscreen state. As demonstrated above, the process of locking the pointer is asynchronous, with events (<code>pointerlockchange</code>, <code>pointerlockerror</code>) indicating the success or failure of the request. This matches how the Fullscreen API works, with its <code>requestFullScreen</code> method and <code>fullscreenchange</code> and <code>fullscreenerror</code> events.</p>
-
-<p>The Pointer lock API also extends the <code>document</code> interface, adding both a new property and a new method. The new property is used for accessing the currently locked element (if any), and is named <code>pointerLockElement</code>, which is vendor-prefixed for now. The new method on <code>document</code> is <code>exitPointerLock</code> and, as the name implies, it is used to exit Pointer lock.</p>
-
-<p>The <code>pointerLockElement</code> property is useful for determining if any element is currently pointer locked (e.g., for doing a boolean check) and also for obtaining a reference to the locked element, if any. Here is an example of both uses:</p>
-
-<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.pointerLockElement = document.pointerLockElement    ||
-                              document.mozPointerLockElement ||
-                              document.webkitPointerLockElement;</span></span>
-
-// 1) Used as a boolean check--are we pointer locked?
-if (!!document.pointerLockElement) {
-  // pointer is locked
-} else {
-  // pointer is not locked
-}
-
-// 2) Used to access the pointer locked element
-if (document.pointerLockElement === someElement) {
-  // someElement is currently pointer locked
-}
-</pre>
-
-<p>The <code>document</code>'s <code>exitPointerLock</code> method is used to exit pointer lock, and like requestPointerLock, works asynchrounously using the <code>pointerlockchange</code> and <code>pointerlockerror</code> events:</p>
-
-<pre class="idl"><span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.exitPointerLock = document.exitPointerLock    ||
-                           document.mozExitPointerLock ||
-                           document.webkitExitPointerLock;</span></span>
-
-function pointerLockChange() {
-  <span class="idlInterface" id="idl-def-MouseLockable"><span class="idlInterface" id="idl-def-MouseLockable">document.pointerLockElement = document.pointerLockElement    ||
-                                document.mozPointerLockElement ||
-                                document.webkitPointerLockElement;</span></span>
-
-  if (!!document.pointerLockElement) {
-    console.log("Still locked.");
-  } else {
-    console.log("Exited lock.");
-  }
-}
-
-document.addEventListener('pointerlockchange', pointerLockChange, false);
-document.addEventListener('mozpointerlockchange', pointerLockChange, false);
-document.addEventListener('webkitpointerlockchange', pointerLockChange, false);
-
-// Attempt to unlock
-document.exitPointerLock();
-</pre>
-
-<h2 id="mouselocklostevent" name="mouselocklostevent">pointerlockchange event</h2>
-
-<p>When the Pointer lock state changes—for example, when calling <code>requestPointerLock</code>, <code>exitPointerLock</code>, the user pressing the ESC key, etc.—the <code>pointerlockchange</code> event is dispatched to the <code>document</code>. This is a simple event and contains no extra data.</p>
-
-<div class="note">This event is currently prefixed as <code>mozpointerlockchange</code> in Firefox and <code>webkitpointerlockchange</code> in Chrome. </div>
-
-<h2 id="mouselocklostevent" name="mouselocklostevent">pointerlockerror event</h2>
-
-<p>When there is an error caused by calling <code>requestPointerLock</code> or <code>exitPointerLock</code>, the <code>pointerlockerror</code> event is dispatched to the <code>document</code>. This is a simple event and contains no extra data.</p>
-
-<div class="note">This event is currently prefixed as <code>mozpointerlockerror</code> in Firefox and <code>webkitpointerlockerror</code> in Chrome. </div>
-
-<h2 id="extensions" name="extensions">Extensions to mouse events</h2>
-
-<p>The Pointer lock API extends the normal <code>MouseEvent</code> with movement attributes.</p>
-
-<pre class="idl"><span class="idlInterface" id="idl-def-MouseEvent">partial interface <span class="idlInterfaceID">MouseEvent</span> {
-<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a>long</a></span> <span class="idlAttrName"><a href="http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html#widl-MouseEvent-movementX">movementX</a></span>;</span>
-<span class="idlAttribute">    readonly attribute <span class="idlAttrType"><a>long</a></span> <span class="idlAttrName"><a href="http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html#widl-MouseEvent-movementY">movementY</a></span>;</span>
-};</span></pre>
-
-<div class="note">The movement attributes are currently prefixed as <code>.mozMovementX</code> and <code>.mozMovementY</code> in Firefox, and<code>.webkitMovementX</code> and <code>.webkitMovementY</code> in Chrome.</div>
-
-<p>Two new parameters to mouse events—<code>movementX</code> and <code>movementY</code>—provide the change in mouse positions. The values of the parameters are the same as the difference between the values of <a href="/en/DOM/MouseEvent" title="en/DOM/Event/UIEvent/MouseEvent"><code>MouseEvent</code></a> properties, <code>screenX</code> and <code>screenY</code>, which are stored in two subsequent <code>mousemove</code> events, <code>eNow</code> and <code>ePrevious</code>. In other words, the Pointer lock parameter <code>movementX = eNow.screenX - ePrevious.screenX</code>.</p>
-
-<h3 id="locked_state" name="locked_state">Locked state</h3>
-
-<p>When Pointer lock is enabled, the standard <code>MouseEvent</code> properties <code>clientX</code>, <code>clientY</code>, <code>screenX</code>, and <code>screenY</code> are held constant, as if the mouse is not moving. The <code>movementX</code> and <code>movementY</code> properties continue to provide the mouse's change in position. There is no limit to <code>movementX</code> and <code>movementY</code> values if the mouse is continuously moving in a single direction. The concept of the mouse cursor does not exist and the cursor cannot move off the window or be clamped by a screen edge.</p>
-
-<h3 id="unlocked_state" name="unlocked_state">Unlocked state</h3>
-
-<p>The parameters <code>movementX</code> and <code>movementY</code> are valid regardless of the mouse lock state, and are available even when unlocked for convenience.</p>
-
-<p>When the mouse is unlocked, the system cursor can exit and re-enter the browser window. If that happens, <code>movementX</code> and <code>movementY</code> could be set to zero.</p>
-
-<h2 id="iframe_limitations">iframe limitations</h2>
-
-<p>Pointer lock can only lock one iframe at a time. If you lock one iframe, you cannot try to lock another iframe and transfer the target to it; Pointer lock will error out. To avoid this limitation, first unlock the locked iframe, and then lock the other.</p>
-
-<p>While iframes work by default, "sandboxed" iframes block Pointer lock. The ability to avoid this limitation, in the form of the attribute/value combination <code>&lt;iframe sandbox="allow-pointer-lock"&gt;</code>, is expected to appear in Chrome soon.</p>
-
-<h2 id="Specifications">Specifications</h2>
-
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Specification</th>
-   <th scope="col">Status</th>
-   <th scope="col">Comment</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName('Pointer Lock')}}</td>
-   <td>{{Spec2('Pointer Lock')}}</td>
-   <td>Initial specification.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Browser_compatibility" name="Browser_compatibility">Browser compatibility</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari (WebKit)</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>
-    <p>Targeting 23{{ property_prefix("webkit") }}*</p>
-
-    <p>See <a class="external" href="http://code.google.com/p/chromium/issues/detail?id=72754" title="http://code.google.com/p/chromium/issues/detail?id=72754">CR/72574</a></p>
-   </td>
-   <td>
-    <p>{{ CompatGeckoDesktop("14.0") }}</p>
-
-    <p>{{bug("633602") }}</p>
-   </td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Phone</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Basic support</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-   <td>{{ CompatNo() }}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<p>* Requires the feature be enabled in <code>about:flags</code> or Chrome started with the <code>--enable-pointer-lock</code> flag.</p>
-
-<h2 id="See_also" name="See_also">See also</h2>
-
-<p><a href="/en/DOM/MouseEvent" title="en/DOM/Event/UIEvent/MouseEvent">MouseEvent</a></p>
diff --git a/files/es/webapi/using_geolocation/index.html b/files/es/webapi/using_geolocation/index.html
deleted file mode 100644
index 6d50972f8b..0000000000
--- a/files/es/webapi/using_geolocation/index.html
+++ /dev/null
@@ -1,232 +0,0 @@
----
-title: Uso de geolocalización
-slug: WebAPI/Using_geolocation
-tags:
-  - API
-  - Geolocalización
-  - Guía
-  - clearWatch
-  - watchPosition
-translation_of: Web/API/Geolocation_API
----
-<p>{{securecontext_header}}{{APIRef("Geolocation API")}}</p>
-
-<p><span id="result_box" lang="es"><span class="hps">La</span> <strong><span class="hps">API de geolocalización</span></strong> <span class="hps">permite al</span> <span class="hps">usuario compartir su</span> <span class="hps">ubicación</span> <span class="hps">a las aplicaciones web</span> <span class="hps">si</span> <span class="hps">así lo desea.</span> <span class="hps">Por razones de privacidad</span><span>,</span> <span class="hps">al usuario</span> <span class="hps">se le pide que</span> <span class="hps">confirme el permiso</span> <span class="hps">para proporcionar información</span> <span class="hps">de ubicación.</span></span></p>
-
-<h2 id="El_objeto_geolocation">El objeto geolocation</h2>
-
-<p><span id="result_box" lang="es"><span class="hps">La API</span> <span class="hps">de geolocalización</span> <span class="hps">se publica</span> <span class="hps">a través del objeto </span></span>{{domxref("window.navigator.geolocation","navigator.geolocation")}}.</p>
-
-<p><span id="result_box" lang="es"><span class="hps">Si el objeto existe</span><span>,</span> <span class="hps">los servicios de geolocalización</span> <span class="hps">están disponibles.</span> <span class="hps">Se puede</span> <span class="hps">comprobar la presencia</span> <span class="hps">de la geolocalización</span> <span class="hps">de esta manera:</span></span></p>
-
-<pre class="brush: js">if ("geolocation" in navigator) {
-  /* la geolocalización está disponible */
-} else {
-  /* la geolocalización NO está disponible */
-}
-</pre>
-
-<div class="blockIndicator note">
-<p>Nota: En Firefox 24 y versiones anteriores, <code>"geolocation" in navigator</code> siempre retornaba <code>true</code> incluso si la API se encontraba deshabilitada. Esto ha sido corregido en <a href="https://www.fxsitecompat.com/en-CA/versions/25/">Firefox 25</a> para cumplir con la especificación.  ({{bug(884921)}}).</p>
-</div>
-
-<h3 id="Obtención_de_la_ubicación_actual">Obtención de la ubicación actual</h3>
-
-<p><span lang="es"><span class="hps">Para</span> <span class="hps">obtener la ubicación</span> <span class="hps">actual del usuario</span><span>, puede llamar a</span><span class="atn hps">l método </span></span>{{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}<span lang="es"><span class="hps">.</span></span></p>
-
-<p><span lang="es"><span class="hps">Esto inicia</span> <span class="hps">una solicitud asíncrona</span> <span class="hps">para detectar</span> <span class="hps">la posición del usuario</span><span>, y</span> <span class="hps">consulta el</span> <span class="hps">hardware</span> <span class="hps">de posicionamiento para</span> <span class="hps">obtener</span><span class="hps"> información actualizada.</span> </span><span id="result_box" lang="es"><span class="hps">Cuando</span> <span class="hps">se determina la posición</span><span>, se ejecuta la función</span> <span class="hps">de callback</span><span class="hps">.</span></span><span lang="es"> <span class="hps">Si lo desea,</span> <span class="hps">puede proporcionar otra función de callback</span><span class="hps"> que se</span> <span class="hps">ejecuta si</span> <span class="hps">se produce un error</span><span>.</span> <span class="hps">Un tercer</span> <span class="hps">parámetro</span> <span class="hps">opcional</span><span>, es un</span> <span class="hps">objeto de opciones</span> <span class="hps">donde se puede establecer</span> <span class="hps">la edad máxima de</span> <span class="hps">la</span> <span class="hps">posición devuelta</span><span>,</span> <span class="hps">el tiempo de espera</span> <span class="hps">para una solicitud</span> <span class="hps">y si se requiere</span> <span class="hps">una alta precisión</span> <span class="hps">para la posición.</span></span></p>
-
-<div class="note">
-<p><strong>Nota:</strong> Por defecto, {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} intenta responder tan rápido como sea posible con un resultado de baja precisión. Es útil cuando se necesita una respuesta rápida sin importar su exactitud. A los dispositivos con GPS, por ejemplo, les puede tomar más de un minuto obtener una posición, por lo que datos menos precisos (localización por IP o wifi) pueden ser devueltos por {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p>
-</div>
-
-<pre class="brush: js">navigator.geolocation.getCurrentPosition(function(position) {
-  haz_algo(position.coords.latitude, position.coords.longitude);
-});</pre>
-
-<p>En el ejemplo anterior la función do_something() será ejecutada una vez que se obtiene la posición.</p>
-
-<h3 id="Rastreando_la_posición_actual">Rastreando la posición actual</h3>
-
-<p>Si los datos de ubicación cambian (si el dispositivo se mueve o información geográfica más precisa es recibida), puede definir una función de callback que se ejecuta al cambiar la posición. Esto se logra a través de la función {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}}, que recibe los mismos parámetros que {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}. La función de callback es ejecutada varias veces, permitiendo al navegador actualizar la ubicación cada vez que cambia, o proporcionar una posición con mayor exactitud utilizando distintas técnicas de geolocalización. La función de callback de error, la cual es opcional como en {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}, es llamada solo una vez, cuando nunca serán devueltos resultados correctos.</p>
-
-<div class="note">
-<p><strong>Nota:</strong> Es posible usar la función {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} sin haber ejecutado antes {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}}.</p>
-</div>
-
-<pre class="brush: js">var watchID = navigator.geolocation.watchPosition(function(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-});</pre>
-
-<p>El método {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} devuelve un número que se utiliza para identificar el rastreador de posición solicitado; este valor se utiliza junto con el método {{domxref("window.navigator.geolocation.clearWatch()","clearWatch()")}} para dejar de rastrear la posición del usuario.</p>
-
-<pre class="brush: js">navigator.geolocation.clearWatch(watchID);
-</pre>
-
-<h3 id="Afinando_la_respuesta">Afinando la respuesta</h3>
-
-<p>Ambos métodos,  {{domxref("window.navigator.geolocation.getCurrentPosition()","getCurrentPosition()")}} y {{domxref("window.navigator.geolocation.watchPosition()","watchPosition()")}} aceptan una función de callback en caso de éxito, una función callback opcional si ocurre algún error, y un objeto <code>PositionOptions</code> también opcional.</p>
-
-<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionOptions")}}</p>
-
-<p>Una llamada a {{domxref("window.navigator.geolocation.watchPosition()","watchPosition")}} luce como el siguiente ejemplo:</p>
-
-<pre class="brush: js">function geo_success(position) {
-  do_something(position.coords.latitude, position.coords.longitude);
-}
-
-function geo_error() {
-  alert("Sorry, no position available.");
-}
-
-var geo_options = {
-  enableHighAccuracy: true,
-  maximumAge        : 30000,
-  timeout           : 27000
-};
-
-var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);</pre>
-
-<p><a id="fck_paste_padding">Demo de watchPosition: </a><a class="external" href="http://www.thedotproduct.org/experiments/geo/">http://www.thedotproduct.org/experiments/geo/</a><br>
- <a id="fck_paste_padding"></a></p>
-
-<h2 id="Describiendo_una_posición">Describiendo una posición</h2>
-
-<p>La ubicación del usuario es descrita con un objeto <code>Position</code> referenciando a un objeto <code>Coordinates</code>.</p>
-
-<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Position")}}</p>
-
-<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","Coordinates")}}</p>
-
-<h2 id="Manejo_de_errores">Manejo de errores</h2>
-
-<p>La función de callback de error, si existe cuando se llama a <code>getCurrentPosition()</code> o <code>watchPosition()</code>, recibe un objeto  <code>PositionError</code> como su primer parámetro.</p>
-
-<pre class="brush: js">function errorCallback(error) {
-  alert('ERROR(' + error.code + '): ' + error.message);
-};
-</pre>
-
-<p>{{page("/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition","PositionError")}}</p>
-
-<h2 id="Ejemplo_de_geolocalización">Ejemplo de geolocalización</h2>
-
-<div class="hidden">
-<pre class="brush: css">body {
-  padding: 20px;
-  background-color:#ffffc9
-}
-
-p { margin : 0; }
-</pre>
-</div>
-
-<h3 id="Contenido_HTML">Contenido HTML</h3>
-
-<pre class="brush: html;">&lt;p&gt;&lt;button onclick="geoFindMe()"&gt;Show my location&lt;/button&gt;&lt;/p&gt;
-&lt;div id="out"&gt;&lt;/div&gt;
-</pre>
-
-<h3 id="Contenido_JavaScript">Contenido JavaScript</h3>
-
-<pre class="brush: js;">function geoFindMe() {
-  var output = document.getElementById("out");
-
-  if (!navigator.geolocation){
-    output.innerHTML = "&lt;p&gt;Geolocation is not supported by your browser&lt;/p&gt;";
-    return;
-  }
-
-  function success(position) {
-    var latitude  = position.coords.latitude;
-    var longitude = position.coords.longitude;
-
-    output.innerHTML = '&lt;p&gt;Latitude is ' + latitude + '° &lt;br&gt;Longitude is ' + longitude + '°&lt;/p&gt;';
-
-    var img = new Image();
-    img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&amp;zoom=13&amp;size=300x300&amp;sensor=false";
-
-    output.appendChild(img);
-  };
-
-  function error() {
-    output.innerHTML = "Unable to retrieve your location";
-  };
-
-  output.innerHTML = "&lt;p&gt;Locating…&lt;/p&gt;";
-
-  navigator.geolocation.getCurrentPosition(success, error);
-}
-</pre>
-
-<h3 id="Resultado">Resultado</h3>
-
-<p>{{ EmbedLiveSample('Geolocation_Live_Example',350,410) }}</p>
-
-<h2 id="Compatibilidad_entre_navegadores">Compatibilidad entre navegadores</h2>
-
-<p>{{ CompatibilityTable() }}</p>
-
-<div id="compat-desktop">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Característica</th>
-   <th>Chrome</th>
-   <th>Firefox (Gecko)</th>
-   <th>Internet Explorer</th>
-   <th>Opera</th>
-   <th>Safari</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>5</td>
-   <td>{{CompatGeckoDesktop("1.9.1")}}</td>
-   <td>9</td>
-   <td>10.60</td>
-   <td>5</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<div id="compat-mobile">
-<table class="compat-table">
- <tbody>
-  <tr>
-   <th>Feature</th>
-   <th>Android</th>
-   <th>Chrome for Android</th>
-   <th>Firefox Mobile (Gecko)</th>
-   <th>IE Mobile</th>
-   <th>Opera Mobile</th>
-   <th>Safari Mobile</th>
-  </tr>
-  <tr>
-   <td>Soporte básico</td>
-   <td>{{CompatUnknown()}}</td>
-   <td>{{CompatUnknown()}}</td>
-   <td>{{CompatGeckoMobile("4")}}</td>
-   <td>{{CompatUnknown()}}</td>
-   <td>10.60</td>
-   <td>{{CompatUnknown()}}</td>
-  </tr>
- </tbody>
-</table>
-</div>
-
-<h3 id="Notas_sobre_Gecko">Notas sobre Gecko</h3>
-
-<p>Firefox incluye soporte para localizar basándose en información de redes inalámbricas, usando Google Location Services. En la transacción entre Firefox y Google, los datos son compartidos incluyendo información del punto de acceso inalámbrico, un token de acceso (similar a una cookie con duración de dos semanas), y la dirección IP del usuario. Para más información, por favor consulte la <a href="http://www.mozilla.com/en-US/legal/privacy/" title="http://www.mozilla.com/en-US/legal/privacy/">Política de Privacidad de Mozilla</a><span class="external"> y la</span> <a href="http://www.google.com/privacy-lsf.html" title="http://www.google.com/privacy-lsf.html">Política de Privacidad de Google</a>, dichos documentos cubren como estos datos pueden ser utilizados.</p>
-
-<p>En Firefox 3.6 (Gecko 1.9.2) fue añadido soporte para utilizar el servicio <a href="http://catb.org/gpsd/" title="http://catb.org/gpsd/">GPSD</a> para geolocalización en sistemas Linux.</p>
-
-<h2 id="Consultar_también">Consultar también</h2>
-
-<ul>
- <li>{{domxref("window.navigator.geolocation","navigator.geolocation")}}</li>
- <li><a href="http://www.w3.org/TR/geolocation-API/" title="http://www.w3.org/TR/geolocation-API/">API de Geolocalización en w3.org</a></li>
- <li><a href="/en-US/demos/tag/tech:geolocation" title="/en-US/demos/tag/tech:geolocation">Demos que utilizan la API de Geolocalización</a></li>
-</ul>
-
-<p> </p>
diff --git a/files/es/webrtc/index.html b/files/es/webrtc/index.html
deleted file mode 100644
index b8eb318529..0000000000
--- a/files/es/webrtc/index.html
+++ /dev/null
@@ -1,78 +0,0 @@
----
-title: WebRTC
-slug: WebRTC
-translation_of: Web/API/WebRTC_API
-translation_of_original: WebRTC
----
-<p>El RTC en WebRTC significa <em>Real-Time Communications</em>, o comunicaciones en tiempo real, en español. WebRTC es una tecnología que permite compartir en tiempo real datos de audio y video entre navegadores (pares). Como conjunto de estándares, WebRTC provee a cualquier navegador de la capacidad de compartir datos de aplicación y realizar teleconferencias de par a par, sin la necesidad de instalar complementos o Software de terceros.</p>
-<p>Los componentes de WebRTC son utilizados a través de interfaces avanzadaz de programación en JavaScript (APIs). Actualmente se están desarrollando la API de streaming a través de la red, que representa los flujos de datos de audio y vídeo, y la API PeerConnection, que permite a dos o más usuarios realizar conexiones navegador a navegador. Igualmente en desarrollo se encuentra la API DataChannel, que permite la transmisión de otros tipos de datos para juegos en tiempo real, mensajería instantánea, transferencia de archivos, y otros.</p>
-<div class="note">
-  <p><strong>Nota:</strong> Parte de este contenido está desactualizado, pero se estará actualizando pronto.</p>
-</div>
-<p>¿Quieres descubrir WebRTC? ¡Mira este <a href="https://mozillaignite.org/resources/labs/future-uses-of-webrtc-video" title="/en-US/docs/https://mozillaignite.org/resources/labs/future-uses-of-webrtc-video">vídeo introductorio!</a></p>
-<table class="topicpage-table">
-  <tbody>
-    <tr>
-      <td>
-        <h2 class="Documentation" id="Documentation" name="Documentation">Documentación sobre WebRTC</h2>
-        <dl>
-          <dt>
-            <a href="/es/docs/WebRTC/Introduction" title="/en-US/docs/WebRTC/Introduction">Introducción a WebRTC</a></dt>
-          <dd>
-            Una guía de introducción sobre qué es WebRTC y cómo funciona.</dd>
-          <dt>
-            <a href="/en-US/docs/WebRTC/Using_the_Network_Stream_API" title="/en-US/docs/WebRTC/Using_the_Network_Stream_API">Using the Network Stream API</a></dt>
-          <dd>
-            Una guía para usar la API Network Stream para transmitir flujos de audio y vídeo.</dd>
-          <dt>
-            <a href="/es/docs/WebRTC/Peer-to-peer_communications_with_WebRTC" title="/en-US/docs/WebRTC/Peer-to-peer_communications_with_WebRTC">Comunicaciones peer-to-peer (P2P) con WebRTC</a></dt>
-          <dd>
-            Como realizar conexiones par a par usando las APIs de WebRTC.</dd>
-          <dt>
-             </dt>
-          <dt>
-            <a href="/es/docs/WebRTC/Taking_webcam_photos" title="taking webcam photos">Capturar fotografías con la cámara web</a></dt>
-          <dd>
-            Como capturar imágenes desde un Webcam con WebRTC.</dd>
-          <dt>
-            <a href="/es/docs/WebRTC/MediaStream_API" title="/en-US/docs/WebRTC/MediaStream_API">API de MediaStream</a></dt>
-          <dd>
-            Descripción de la API que soporta la creación y manipulación de flujos de medios.</dd>
-          <dt>
-            <a href="/es/docs/Web/API/Navigator.getUserMedia" title="/en-US/docs/">getUserMedia()</a></dt>
-          <dd>
-            La función del navegador que permite el acceso a dispositivos de medios del sistema.</dd>
-          <dd>
-             </dd>
-        </dl>
-        <p><span class="alllinks"><a href="/en-US/docs/tag/WebRTC" title="/en-US/docs/tag/B2G">Ver todo...</a></span></p>
-        <h2 class="Tools" id="Ejemplos">Ejemplos</h2>
-        <ul>
-          <li><a href="http://idevelop.github.com/ascii-camera/" title="http://idevelop.github.com/ascii-camera/">ASCII camera</a></li>
-        </ul>
-      </td>
-      <td>
-        <h2 class="Community" id="Community" name="Community">Obteniendo ayuda de la comunidad</h2>
-        <p>Cuando desarrolles sitios y aplicaciones que tomen ventaja de las tecnologías de WebRTC, puede ser muy útil ponerse en contacto con otras personas haciendo lo mismo.</p>
-        <ul>
-          <li>Consulta el tópico <em>Media</em> en el foro: {{ DiscussionList("dev-media", "mozilla.dev.media") }}</li>
-        </ul>
-        <ul>
-          <li>Pregunta en el canal IRC de Media de Mozilla: <a class="link-irc" href="irc://irc.mozilla.org/media" title="irc://irc.mozilla.org/b2g">#media</a></li>
-        </ul>
-        <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">No olvides la <em>netiqueta</em>...</a></span></p>
-        <br>
-        <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Tópicos relacionados</h2>
-        <ul>
-          <li><a href="/es/docs/Usando_audio_y_video_con_HTML5" title="/es/docs/Usando_audio_y_video_con_HTML5">Usando audio y video con HTML5</a></li>
-        </ul>
-        <h2 class="Tools" id="Recursos">Recursos</h2>
-        <ul>
-          <li><a href="http://www.w3.org/TR/webrtc/" title="WebRTC specification">WebRTC Specification</a></li>
-          <li><a href="http://mozilla.github.io/webrtc-landing/" title="http://mozilla.github.io/webrtc-landing/">WebRTC Test Landing Page</a></li>
-        </ul>
-      </td>
-    </tr>
-  </tbody>
-</table>
-<p> </p>
diff --git a/files/es/webrtc/introduction/index.html b/files/es/webrtc/introduction/index.html
deleted file mode 100644
index 2529f32085..0000000000
--- a/files/es/webrtc/introduction/index.html
+++ /dev/null
@@ -1,21 +0,0 @@
----
-title: WebRTC Introduction
-slug: WebRTC/Introduction
-translation_of: Web/API/WebRTC_API/Session_lifetime
----
-<div class="note">
-  <p>WebRTC te permite establecer una comunicación par-a-par en una aplicación del navegador.</p>
-</div>
-<h2 id="Estableciendo_la_conexión">Estableciendo la conexión</h2>
-<p>La conexión inicial entre pares debe ser establecida a través de un servidor de aplicaciones que proporcione descubrimiento de usuarios, comunicación y traducción de direcciones de red (NAT) con transmisión de datos.</p>
-<h3 id="Señalización">Señalización</h3>
-<p>Señalización es el mecanismo por el cual los pares se envían mensajes de control entre sí con el propósito de establecer el protocolo, canal, y método de comunicación. Estos no están especifiados en el standar WebRTC. En su lugar, el desarrollador puede elegir cualquier protocolo de mensajería (como SIP o XMPP), y cualquier canal de comunicación bidirecional (como WebSocket o XMLHttpRequest) en conjunción con un servidor con un API de  conexión permanente (como  el <a href="https://developers.google.com/appengine/docs/python/channel/overview" title="https://developers.google.com/appengine/docs/python/channel/overview">Google Channel API</a>) para AppEngine.</p>
-<h2 id="Transmisión">Transmisión</h2>
-<h3 id="getUserMedia">getUserMedia</h3>
-<p>LocalMediaStream object</p>
-<h2 id="Recepción">Recepción</h2>
-<p>El soporte para WebRTC en Firefox está escondido detrás de un selector de preferencias. Ve a <a href="/about:config" title="/about:config">about:config</a> y establce 'media.navigator.enabled' a 'true'.</p>
-<div class="note">
-  <p>Hay algunos archivos de prueba en el repositorio de código para darte una idea de cómo funciona. Ve: <a href="http://hg.mozilla.org/projects/alder/file/tip/dom/media/tests/local_video_test.html">dom/media/tests/local_video_test.html</a>. Por favor, prueba también la<a href="http://webrtc-demo.herokuapp.com/mozdemo">demo de servicio de llamadas</a>, la página de su código, y <a href="https://github.com/anantn/webrtc-demo/">el código de su servidor</a>.</p>
-</div>
-<p> </p>
diff --git a/files/es/webrtc/mediastream_api/index.html b/files/es/webrtc/mediastream_api/index.html
deleted file mode 100644
index f8ab5d5c05..0000000000
--- a/files/es/webrtc/mediastream_api/index.html
+++ /dev/null
@@ -1,445 +0,0 @@
----
-title: API de MediaStream
-slug: WebRTC/MediaStream_API
-translation_of: Web/API/Media_Streams_API
----
-<p>{{SeeCompatTable}}</p>
-<p>La <strong>API de proceso <a href="#_edn1" name="_ednref1" title=""><strong>[i]</strong></a><em>MediaStream</em></strong>, a veces llamada<em>Media Stream API</em> o<em> Stream API</em>, es parte de la norma <a href="https://developer.mozilla.org/en-US/docs/WebRTC" title="https://developer.mozilla.org/en-US/docs/WebRTC">WebRTC [en]</a> y describe un flujo de datos de audio o video, los métodos para trabajar con ellos, las limitaciones asociadas con este tipo de datos, las respuestas de error y éxito al usar los datos asincrónicamente y los eventos que se disparan durante el proceso.</p>
-<div>
-   </div>
-<h2 id="Conceptos_Básicos">Conceptos Básicos</h2>
-<p>La API está basada sobre la manipulación de  un objeto {{domxref("MediaStream")}} que representa un flujo de datos de audio o video. Generalmente, un objeto <code>MediaStream</code> es una simple cadena URL que puede ser usada para referirse a datos almacenados en un {{domxref("Archivo")}} DOM  o un objeto {{domxref("Blob")}} creado con {{domxref("window.URL.createObjectURL()")}}, como se lo describe en<a href="https://developer.mozilla.org/en-US/docs/WebRTC/taking_webcam_photos#Get_the_video" title="https://developer.mozilla.org/en-US/docs/WebRTC/taking_webcam_photos#Get_the_video"> <u>Obtener el video</u></a>.</p>
-<p>Un <code>MediaStream</code> está compuesto por más objetos <a href="#_edn1" name="_ednref1" title="">[i]</a>{{domxref("MediaStreamTrack")}} que representan varias <strong>pistas</strong> de audio o video. Cada <code>MediaStreamTrack </code>puede tener uno o más <strong>canales</strong>. El canal representa la unidad menor de un flujo de medio, como una señal de audio asociada a un parlante específico, como el <em>izquierdo</em> o el <em>derecho</em> en una pista de audio estéreo.</p>
-<p>Los objetos <code>MediaStream</code> poseen una sola <strong>entrada</strong> y <strong>salida<a href="#_edn2" name="_ednref2" title=""><strong>[ii]</strong></a>. </strong>Un objeto <code>MediaStream</code> creado con <a href="https://developer.mozilla.org/en-US/docs/Web/API/Navigator.getUserMedia?redirectlocale=en-US&amp;redirectslug=WebRTC%2Fnavigator.getUserMedia" title="https://developer.mozilla.org/en-US/docs/Web/API/Navigator.getUserMedia?redirectlocale=en-US&amp;redirectslug=WebRTC%2Fnavigator.getUserMedia"><u>getUserMedia()</u></a> se denomina <em>local </em>y tiene como origen de entrada una de las cámaras o micrófonos del usuario. Un MediaStream no local puede estar representando un elemento de medio como {{HTMLElement("video")}} o {{HTMLElement("audio")}}, un flujo originado en la red y obtenido a través de la <a href="#_edn3" name="_ednref3" title="">[iii]</a><a href="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API" title="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API"><em><u>PeerConnection API</u></em></a> o un flujo creado con la <a href="https://developer.mozilla.org/en-US/docs/Web_Audio_API" title="https://developer.mozilla.org/en-US/docs/Web_Audio_API"><u>API de Audio Web</u></a> <a href="#_edn4" name="_ednref4" title="">[iv]</a>{{domxref("MediaStreamAudioSourceNode")}}. La salida de un objeto <code>MediaStream</code> está enlazada a un <strong>consumidor.</strong> El mismo puede ser un elemento de medio  como <code>&lt;audio&gt; o &lt;video&gt;</code>, la <a href="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API" title="https://developer.mozilla.org/en-US/docs/WebRTC/PeerConnection_API"><u>PeerConnection API</u></a> de WebRTC o una <a href="https://developer.mozilla.org/en-US/docs/Web_Audio_API" title="https://developer.mozilla.org/en-US/docs/Web_Audio_API"><u>API de Audio Web</u></a> <a href="#_edn5" name="_ednref5" title="">[v]</a>{{domxref("MediaStreamAudioDestinationNode")}}.</p>
-<div>
-   </div>
-<h2 id="Referencia">Referencia</h2>
-<div class="index">
-  <ul>
-    <li>{{event("addtrack")}} (event)</li>
-    <li>{{domxref("AudioStreamTrack")}}</li>
-    <li>{{domxref("BlobEvent")}}</li>
-    <li>{{domxref("BlobEventInit")}}</li>
-    <li>{{event("ended (MediaStream)")}} (event)</li>
-    <li>{{event("ended (MediaStreamTrack)")}} (event)</li>
-    <li>{{domxref("MediaStream")}}</li>
-    <li>{{domxref("MediaStreamConstraints")}}</li>
-    <li>{{domxref("MediaStreamTrack")}}</li>
-    <li>{{domxref("MediaStreamTrackEvent")}}</li>
-    <li>{{domxref("MediaStreamTrackList")}}</li>
-    <li>{{domxref("MediaTrackConstraints")}}</li>
-    <li>{{event("muted")}} (event)</li>
-    <li>{{domxref("NavigatorUserMedia")}}</li>
-    <li>{{domxref("NavigatorUserMediaError")}}</li>
-    <li>{{event("overconstrained")}} (event)</li>
-    <li>{{event("removetrack")}} (event)</li>
-    <li>{{event("started")}} (event)</li>
-    <li>{{event("unmuted")}} (event)</li>
-    <li>{{domxref("URL")}}</li>
-    <li>{{domxref("VideoStreamTrack")}}</li>
-  </ul>
-</div>
-<h2 id="Pista_de_MediaStream">Pista de MediaStream</h2>
-<p>Una <em>MediaStreamTrack </em>puede ser de dos tipos, de audio o video, y representa el origen del medio, como una cámara.</p>
-<h3 id="Atributos">Atributos</h3>
-<table>
-  <thead>
-    <tr>
-      <th scope="col">Atributo</th>
-      <th scope="col">Tipo</th>
-      <th scope="col">Descripción</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td>enabled</td>
-      <td>Boolean </td>
-      <td>True si la pista sigue asociada a su fuente.</td>
-    </tr>
-    <tr>
-      <td>id</td>
-      <td>DOMString, read-only</td>
-      <td>Un <em>globally unique identifier </em>(GUID) que describe la pista de medios.</td>
-    </tr>
-    <tr>
-      <td>kind</td>
-      <td>DOMString, read-only</td>
-      <td>El <strong>audio</strong> o <strong>video</strong> para la pista de origen.</td>
-    </tr>
-    <tr>
-      <td>label</td>
-      <td>DOMString, read-only</td>
-      <td>Una cadena de tipo usuario-asignada que identifica la pista de origen, como en "internal microphone." </td>
-    </tr>
-    <tr>
-      <td>onended</td>
-      <td>EventHandler</td>
-      <td>Maneja el evento finalizado cuando se lo activa en el objeto MediaStreamTrack.</td>
-    </tr>
-    <tr>
-      <td>onmute </td>
-      <td>EventHandler</td>
-      <td>Maneja el evento mudo del objeto MediaStreamTrack. </td>
-    </tr>
-    <tr>
-      <td>onoverconstrained</td>
-      <td>EventHandler</td>
-      <td>Maneja el evento superrestricto cuando se lo activa en el objeto MediaStreamTrack.</td>
-    </tr>
-    <tr>
-      <td>onstarted</td>
-      <td>EventHandler</td>
-      <td>Maneja el evento iniciado cuando se lo activa en el objeto MediaStreamTrack.</td>
-    </tr>
-    <tr>
-      <td>onunmute </td>
-      <td>EventHandler</td>
-      <td>Manjea el evento sin enmudecer cuando se lo activa en el objeto MediaStreamTrack.</td>
-    </tr>
-    <tr>
-      <td>readyState</td>
-      <td>unsigned short, read-only</td>
-      <td>
-        <p>Valores para la pista lista:</p>
-        <ul>
-          <li>live - la pista está activa; la salida se puede activar <em>on</em> y <em>off</em> con el atributo habilitado.</li>
-          <li>muted - el origen del medio subyacente de la pista no puede proveer temporalmente datos en tiempo real.</li>
-        </ul>
-      </td>
-    </tr>
-    <tr>
-      <td>sourceId</td>
-      <td>DOMString, read-only</td>
-      <td>La identidad de este origen que es único para esta aplicación y persistente. Se recomienda una GUID pero no es obligatoria.</td>
-    </tr>
-    <tr>
-      <td>sourceType</td>
-      <td>SourceTypeEnum, read-only</td>
-      <td>Contiene el tipo de información del origen, si es que existe.</td>
-    </tr>
-  </tbody>
-</table>
-<h3 id="Eventos">Eventos</h3>
-<table>
-  <thead>
-    <tr>
-      <th scope="col">Evento</th>
-      <th scope="col">Interfaz</th>
-      <th scope="col">Descripción </th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td>started</td>
-      <td>Event</td>
-      <td>El objeto MediaStreamTrack no es más "new" en el readyState.</td>
-    </tr>
-    <tr>
-      <td>muted</td>
-      <td>Event</td>
-      <td>El origen del objeto MediaStreamTrack no puede proveer datos temporalmente.</td>
-    </tr>
-    <tr>
-      <td>unmuted </td>
-      <td>Event</td>
-      <td>El origen del objeto MediaStreamTrack a recomenzado a proveer datos</td>
-    </tr>
-    <tr>
-      <td>overconstrained</td>
-      <td>Event</td>
-      <td>El origen del objeto MediaStreamTrack no puede ser confugurado para que encaje en las restricciones impuestas por la pista. Esto podría ocurrir con la altura en el caso de un video, entre otras posibilidades.</td>
-    </tr>
-    <tr>
-      <td>ended</td>
-      <td>Event</td>
-      <td>
-        <p>El origen del objeto MediaStreamTrack no proveerá datos; puede ocurrir por lo siguiente:</p>
-        <ul>
-          <li>el usuario a deshabilitado los permisos de la aplicación</li>
-          <li>el dispositivo de origen está desconectado</li>
-          <li>el <em>peer</em> remoto no transmite datos</li>
-          <li>se llamó el método stop()</li>
-        </ul>
-      </td>
-    </tr>
-  </tbody>
-</table>
-<h3 id="appendConstraint()">appendConstraint()</h3>
-<p>Agrega la restricción al final de la lista. Esto sólo es un método para añadir restricciones optativas.</p>
-<dl>
-  <dt>
-    Parámetros</dt>
-  <dd>
-    constraintName <strong>DOMString</strong>, required.</dd>
-  <dd>
-    constraintValue <strong>Primitive (DOMString, float, etc.) </strong>or<strong> MinMaxConstraint</strong>, required.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    void</dd>
-  <dt>
-    Excepciones</dt>
-  <dd>
-    None.</dd>
-</dl>
-<h3 id="applyConstraints()">applyConstraints()</h3>
-<p>Aplica una lista de opciones optativas a la pista. Sobrescribe cualquier otra restricción optativa ya existente en la pista.</p>
-<dl>
-  <dt>
-    <strong>Parámetros</strong></dt>
-  <dd>
-    constraints <strong>MediaTrackConstraints</strong>, required.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    void</dd>
-  <dt>
-    Excepciones</dt>
-  <dd>
-    None.</dd>
-</dl>
-<h3 id="constraints()">constraints()</h3>
-<p>Devuelte todas las <a href="#_edn1" name="_ednref1" title="">[i]</a>restricciones en la pista, obligatorias y optativas. Si tanto<em> <code>mandatory </code></em>u <code>optional</code> no tienen restricciones, ese campo será <code>undefined</code>. Si ninguno tiene restricciones, entonces<code> constraints()</code> devolverá <code>null<em>.</em></code></p>
-<dl>
-  <dt>
-    Parámetros</dt>
-  <dd>
-    None.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    <strong>MediaTrackConstraints</strong> or <strong>null</strong></dd>
-  <dt>
-    <span id="cke_bm_186C" style="display: none;"> </span>Excepciones</dt>
-  <dd>
-    None.</dd>
-</dl>
-<h3 id="getConstraint()">getConstraint()</h3>
-<p>Trae una restricción específica, por nombre, de la pista. Este método puede devolver una de varias posibilidades:</p>
-<ul>
-  <li>Si su restricción no existe, devuelve <code>null.</code></li>
-  <li>Si no provee true para parámetro optativo<code>mandatory </code>y su búsqueda resulta en más de una restricción, este método devolverá una lista. Cada ítem de la lista será el nombre de la búsqueda así como su valor o un objeto <code>MinMaxConstraint</code>. La lista se agrupa con la entrada 0º como la más importante y cada entrada posterior es progresivamente menos importante.</li>
-  <li>Si provee<code>True </code>al parámetro <code>mandatory</code> y su búsqueda es miembro del <code>MediaTrackConstraintSet </code>de la pista, este método devuelve su valor primitivo o su <code>MinMaxConstraint</code>, cualquiera que aplique al caso.</li>
-</ul>
-<dl>
-  <dt>
-    Parámetros</dt>
-  <dd>
-    constraintName <strong>DOMString</strong>, required.</dd>
-  <dd>
-    mandatory <strong>boolean</strong>, optional, default false.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    Any of the possibilities mentioned above.</dd>
-  <dt>
-    Excepciones</dt>
-  <dd>
-    None.</dd>
-</dl>
-<p>--</p>
-<h3 id="stop()">stop()</h3>
-<p>Detiene permanentemente la creación de datos para las pistas y remueve las referencias a los orígines.</p>
-<dl>
-  <dt>
-    Parámetros</dt>
-  <dd>
-    None.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    Void.</dd>
-  <dt>
-    Excepciones</dt>
-  <dd>
-    None.</dd>
-</dl>
-<h2 id="Lista_de_pistas_de_MediaStream">Lista de pistas de MediaStream</h2>
-<p>Un MediaStream tiene dos objetos MediaStreamTrackList, uno para la pista de video y otro para la de audio.</p>
-<table>
-  <thead>
-    <tr>
-      <th scope="col">Atributo </th>
-      <th scope="col">Tipo</th>
-      <th scope="col">Descripción</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td>length</td>
-      <td>unsigned long, read-only </td>
-      <td>El número de pistas en la lista.</td>
-    </tr>
-    <tr>
-      <td>onaddtrack </td>
-      <td>EventHandler</td>
-      <td>Maneja el evento addtrack.</td>
-    </tr>
-    <tr>
-      <td>onremovetrack </td>
-      <td>EventHandler</td>
-      <td>Maneja el evento removetrack.</td>
-    </tr>
-  </tbody>
-</table>
-<h3 id="Eventos_2">Eventos</h3>
-<table>
-  <thead>
-    <tr>
-      <th scope="col">Evento</th>
-      <th scope="col">Interfaz</th>
-      <th scope="col">Descripción </th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr>
-      <td>addtrack </td>
-      <td>MediaStreamTrackEvent </td>
-      <td>Se agregó una MediaStreamTrack a la lista.</td>
-    </tr>
-    <tr>
-      <td>removetrack </td>
-      <td>MediaStreamTrackEvent</td>
-      <td>Se removió una MediaStreamTrack de la lista.</td>
-    </tr>
-  </tbody>
-</table>
-<h3 id="add()">add()</h3>
-<p>Agrega una MediaStreamTrack a la lista de pistas.</p>
-<dl>
-  <dt>
-    Parámetros</dt>
-  <dd>
-    MediaStreamTrack <strong>track</strong>, required.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    Void.</dd>
-  <dt>
-    Excepciones</dt>
-  <dd>
-    INVALID_STATE_ERR if the stream is finished (all tracks have ended).</dd>
-</dl>
-<h3 id="item()">item()<span id="cke_bm_369C" style="display: none;"> </span></h3>
-<p>Devuelve la MediaStreamTrack al valor de índice (index) especificado.</p>
-<dl>
-  <dt>
-    Parámetros</dt>
-  <dd>
-    unsigned long <strong>index</strong>, required.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    MediaStreamTrack</dd>
-  <dt>
-    Excepciones</dt>
-  <dd>
-    None.</dd>
-</dl>
-<h3 id="Remove()">Remove()</h3>
-<p>Remueve una MediaStreamTrack de la lista de pistas.</p>
-<dl>
-  <dt>
-    Parámetros</dt>
-  <dd>
-    MediaStreamTrack <strong>track</strong>, required.</dd>
-  <dt>
-    Devuelve</dt>
-  <dd>
-    Void.</dd>
-  <dt>
-    Excepciones</dt>
-  <dd>
-    INVALID_STATE_ERR if the stream is finished (all tracks have ended).</dd>
-</dl>
-<h2 id="Compatibilidad_con_navegadores">Compatibilidad con navegadores</h2>
-<p>{{ CompatibilityTable() }}</p>
-<div id="compat-desktop">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Feature</th>
-        <th>Chrome</th>
-        <th>Firefox (Gecko)</th>
-        <th>Internet Explorer</th>
-        <th>Opera </th>
-        <th>Safari (WebKit)</th>
-      </tr>
-      <tr>
-        <td>Stream API </td>
-        <td>21{{ property_prefix("webkit") }} </td>
-        <td>nightly 18{{ property_prefix("moz") }} </td>
-        <td>{{ CompatUnknown() }} </td>
-        <td>12</td>
-        <td>{{ CompatUnknown() }} </td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<div id="compat-mobile">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Feature</th>
-        <th>Android</th>
-        <th>Firefox Mobile (Gecko)</th>
-        <th>IE Phone</th>
-        <th>Opera Mobile</th>
-        <th>Safari Mobile</th>
-      </tr>
-      <tr>
-        <td>Stream API </td>
-        <td>{{ CompatNo() }} </td>
-        <td>{{ CompatUnknown() }}</td>
-        <td>{{ CompatUnknown() }} </td>
-        <td>{{ CompatNo() }} </td>
-        <td>{{ CompatNo() }} </td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<p>Actualmente, el uso de WebRTC para acceder a la cámara está soportado en Chrome, Opera y Firefox Nightly 18. Habilitar WebRTC en Firefox Nightly requiere que usted establezca una advertencia (flag) en la configuración:</p>
-<ul style="margin: 0px 0px 1.286em; padding-top: 0px; padding-right: 0px; padding-bottom: 0px;">
-  <li>Escriba "about:config" en la barra de direcciones y diga que sí quiere efectuar los cambios</li>
-  <li>Busque la entrada de "media.navigator.enabled" entry y establezca su valos a "true" [sin comillas]</li>
-</ul>
-<div>
-  <p> </p>
-  <div>
-    <br>
-    <hr>
-    <div id="edn1">
-      <p><a href="#_ednref1" name="_edn1" title="">[i]</a> en castellano,<em>Flujo o transmisión de [multi] Medios</em></p>
-    </div>
-  </div>
-  <hr>
-  <div id="edn1">
-    <p><a href="#_ednref1" name="_edn1" title="">[i]</a> en castellano,<em> Pista de Flujo de Media</em></p>
-  </div>
-  <div id="edn2">
-    <p><a href="#_ednref2" name="_edn2" title="">[ii]</a> del inglés, <em>input </em>y<em>output</em></p>
-  </div>
-  <div id="edn3">
-    <p><a href="#_ednref3" name="_edn3" title="">[iii]</a> en castellano, <em>API de Conexión de Pares</em></p>
-  </div>
-  <div id="edn4">
-    <p><a href="#_ednref4" name="_edn4" title="">[iv]</a> en castellano,<em> Nodo de origen del Audio MediaStream</em></p>
-  </div>
-  <div id="edn5">
-    <p><a href="#_ednref5" name="_edn5" title="">[v]</a> en castellano, <em>Nodo de destino del Audio MediaStream</em></p>
-    <div>
-      <br>
-      <hr>
-      <div id="edn1">
-        <p><a href="#_ednref1" name="_edn1" title="">[i]</a> del inglés,<em>constraints</em></p>
-      </div>
-    </div>
-  </div>
-</div>
-<p> </p>
-<h2 id="Ver_también">Ver también</h2>
-<ul>
-  <li><a href="/en-US/docs/WebRTC" title="/en-US/docs/WebRTC">WebRTC</a> - la página de introducción a la API</li>
-  <li><a href="/en-US/docs/WebRTC/navigator.getUserMedia" title="/en-US/docs/WebRTC/navigator.getUserMedia">getUserMedia()</a></li>
-  <li><a href="/en-US/docs/WebRTC/taking_webcam_photos" title="/en-US/docs/WebRTC/taking_webcam_photos">Taking webcam photos</a> - un tutorial para usar getUserMedia()</li>
-</ul>
diff --git a/files/es/webrtc/peer-to-peer_communications_with_webrtc/index.html b/files/es/webrtc/peer-to-peer_communications_with_webrtc/index.html
deleted file mode 100644
index d7c859d646..0000000000
--- a/files/es/webrtc/peer-to-peer_communications_with_webrtc/index.html
+++ /dev/null
@@ -1,99 +0,0 @@
----
-title: Comunicaciones peer-to-peer (P2P) con WebRTC
-slug: WebRTC/Peer-to-peer_communications_with_WebRTC
-translation_of: Web/Guide/API/WebRTC/Peer-to-peer_communications_with_WebRTC
----
-<p>{{SeeCompatTable}}</p>
-<p>Las <strong>WebRTC APIs</strong> están diseñadas para permitir a las aplicaciones JS la creación de conexiones de tiempo real con canales de Audio, Video, y/o Datos (Data), directamente entre usuarios y a través de sus browsers, o hacia servers que soporten los protocolos WebRTC. También potencia navigator.mozGetUserMedia() para acceder a los datos de cámara y micrófono (getUserMedia() está siendo estandarizado por la Media Capture Task Force, así como las Recording APIs).</p>
-<p>Las fuentes primarias de las especificaciones para WebRTC (en constante <strong>evolución</strong>), son las especificaciones <a href="http://dev.w3.org/2011/webrtc/editor/webrtc.html" title="http://dev.w3.org/2011/webrtc/editor/webrtc.html">WebRTC</a> y <a href="http://dev.w3.org/2011/webrtc/editor/getusermedia.html" title="http://dev.w3.org/2009/dap/camera/">getUserMedia</a>, y varios de los borradores del IETF, en mayor medida en el <a href="http://tools.ietf.org/wg/rtcweb/" title="http://tools.ietf.org/wg/rtcweb/">rtcweb working group</a>, pero también <a href="http://tools.ietf.org/wg/mmusic/" title="http://tools.ietf.org/wg/mmusic/">mmusic</a>, <a href="http://tools.ietf.org/wg/rmcat/" title="http://tools.ietf.org/wg/rmcat/">rmcat</a> y algunos otros.<br>
-  <br>
-  Gran parte de la implementación en Chrome y Firefox está basada en código que fue abierto por Google en <a href="http://www.webrtc.org/reference" title="http://www.webrtc.org/reference">webrtc.org</a>.</p>
-<p style="margin-left: 40px;"><span style="color: #ff0000;"><strong>NOTA</strong></span>:  Las versiones actuales de FlashBlock pueden bloquear elementos HTML5 &lt;video&gt;. Si es así, dile que permita el contenido en la página, o deshabilita esa opción vía Herramientas/Add-ons.</p>
-<p>Hay un buen tutorial en las características básicas de WebRTC en <a href="http://www.html5rocks.com/en/tutorials/webrtc/basics/" title="http://www.html5rocks.com/en/tutorials/webrtc/basics/">HTML5 Rocks</a>. Una colección de páginas de pruebas básicas para soportar el desarrollo existe en <a href="http://mozilla.github.com/webrtc-landing" title="http://mozilla.github.com/webrtc-landing">webrtc-landing</a>.</p>
-<p>Puedes hacer simples llamadas persona-a-persona (inclusive si usan Chrome) en <a href="https://apprtc.appspot.com/" title="https://apprtc.appspot.com/">apprtc.appspot.com</a>.</p>
-<p>Una descripción de alto nivel de lo que sucede en una conexión RTCPeerConnection se publicó en un artículo de <a href="https://hacks.mozilla.org/2013/05/embedding-webrtc-video-chat-right-into-your-website/" title="https://hacks.mozilla.org/2013/05/embedding-webrtc-video-chat-right-into-your-website/">Mozilla Hacks</a> (puedes ver todos los artículos sobre WebRTC <a href="https://hacks.mozilla.org/category/webrtc/" title="https://hacks.mozilla.org/category/webrtc/">aquí</a>).</p>
-<p><img alt="Basics of RTCPeerConnection call setup" src="https://hacks.mozilla.org/wp-content/uploads/2013/05/webRTC-BasicsOfHowItWorks2.png" style="width: 898px; height: 805px;"></p>
-<h2 id="Especificaciones">Especificaciones</h2>
-<table class="standard-table">
-  <tbody>
-    <tr>
-      <th scope="col">Especificación</th>
-      <th scope="col">Estado</th>
-      <th scope="col">Comentarios</th>
-    </tr>
-    <tr>
-      <td>WebRTC API</td>
-      <td>En definición</td>
-      <td> </td>
-    </tr>
-    <tr>
-      <td>getUserMedia API</td>
-      <td>En definición</td>
-      <td><a href="http://dev.w3.org/2011/webrtc/editor/getusermedia.html" title="http://dev.w3.org/2011/webrtc/editor/getusermedia.html">http://dev.w3.org/2011/webrtc/editor/getusermedia.html</a></td>
-    </tr>
-  </tbody>
-</table>
-<h2 id="Compatibilidad_de_browsers">Compatibilidad de browsers</h2>
-<div>
-  {{CompatibilityTable}}</div>
-<div id="compat-desktop">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Características</th>
-        <th>Chrome</th>
-        <th>Firefox (Gecko)</th>
-        <th>Internet Explorer</th>
-        <th>Opera</th>
-        <th>Safari (WebKit)</th>
-      </tr>
-      <tr>
-        <td>Soporte básico</td>
-        <td>Sí{{property_prefix("webkit")}}</td>
-        <td>Firefox 22</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-      </tr>
-      <tr>
-        <td>DataChannels</td>
-        <td>A partir de Chrome 29</td>
-        <td>Firefox 22</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<div id="compat-mobile">
-  <table class="compat-table">
-    <tbody>
-      <tr>
-        <th>Feature</th>
-        <th>Android</th>
-        <th>Firefox Mobile (Gecko)</th>
-        <th>IE Phone</th>
-        <th>Opera Mobile</th>
-        <th>Safari Mobile</th>
-      </tr>
-      <tr>
-        <td>Soporte preliminar</td>
-        <td>Via Chrome (detrás de un flag de configuración)</td>
-        <td>Activado en Nightly y Aurora</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-      </tr>
-      <tr>
-        <td>DataChannels</td>
-        <td>{{CompatUnknown}}</td>
-        <td>Activado en Nightly y Aurora</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-        <td>{{CompatNo}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-<p> </p>
diff --git a/files/es/webrtc/taking_webcam_photos/index.html b/files/es/webrtc/taking_webcam_photos/index.html
deleted file mode 100644
index 143b2ee72f..0000000000
--- a/files/es/webrtc/taking_webcam_photos/index.html
+++ /dev/null
@@ -1,159 +0,0 @@
----
-title: Capturar fotografías con la cámara web
-slug: WebRTC/Taking_webcam_photos
-tags:
-  - Canvas
-  - WebRTC
-  - cámara web
-  - getusermedia
-translation_of: Web/API/WebRTC_API/Taking_still_photos
----
-<h2 id="Introducción_y_demostración">Introducción y demostración</h2>
-<p>Este es un tutorial rápido de cómo acceder a la cámara de tu laptop y capturar una foto con ella. Puedes observar el <a href="http://jsfiddle.net/codepo8/agaRe/4/" title="http://jsfiddle.net/codepo8/agaRe/4/">código final en acción en este JSFiddle</a>. También existe una versión más avanzada en JavaScript para cargar fotos a <strong>imgur</strong> disponible como <a href="https://github.com/codepo8/interaction-cam/" title="https://github.com/codepo8/interaction-cam/">código en GitHub</a> o <a href="http://codepo8.github.com/interaction-cam/" title="http://codepo8.github.com/interaction-cam/">como demo</a>.</p>
-<h2 id="El_formato_HTML">El formato HTML</h2>
-<p>Lo primero que necesitas para acceder a la cámara web utilizando WebRTC es un elemento {{HTMLElement("video")}} y un elemento {{HTMLElement("canvas")}} en la página. El elemento de video recibe la secuencia desde WebRTC y el elemento canvas es utilizado para agarrar la imagen desde el video. También añadimos una imagen de relleno que luego será reemplazada con la toma capturada por la cámara web.</p>
-<pre class="brush:html;">&lt;video id="video"&gt;&lt;/video&gt;
-&lt;button id="startbutton"&gt;Take photo&lt;/button&gt;
-&lt;canvas id="canvas"&gt;&lt;/canvas&gt;
-&lt;img src="http://placekitten.com/g/320/261" id="photo" alt="photo"&gt;
-</pre>
-<h2 id="El_script_completo">El script completo</h2>
-<p>Aquí se muestra completamente el código JavaScript. Más abajo, explicaremos gradualmente cada sección con más detalle.</p>
-<pre class="brush:js;">(function() {
-
-  var streaming = false,
-      video        = document.querySelector('#video'),
-      canvas       = document.querySelector('#canvas'),
-      photo        = document.querySelector('#photo'),
-      startbutton  = document.querySelector('#startbutton'),
-      width = 320,
-      height = 0;
-
-  navigator.getMedia = ( navigator.getUserMedia ||
-                         navigator.webkitGetUserMedia ||
-                         navigator.mozGetUserMedia ||
-                         navigator.msGetUserMedia);
-
-  navigator.getMedia(
-    {
-      video: true,
-      audio: false
-    },
-    function(stream) {
-      if (navigator.mozGetUserMedia) {
-        video.mozSrcObject = stream;
-      } else {
-        var vendorURL = window.URL || window.webkitURL;
-        video.src = vendorURL.createObjectURL(stream);
-      }
-      video.play();
-    },
-    function(err) {
-      console.log("An error occured! " + err);
-    }
-  );
-
-  video.addEventListener('canplay', function(ev){
-    if (!streaming) {
-      height = video.videoHeight / (video.videoWidth/width);
-      video.setAttribute('width', width);
-      video.setAttribute('height', height);
-      canvas.setAttribute('width', width);
-      canvas.setAttribute('height', height);
-      streaming = true;
-    }
-  }, false);
-
-  function takepicture() {
-    canvas.width = width;
-    canvas.height = height;
-    canvas.getContext('2d').drawImage(video, 0, 0, width, height);
-    var data = canvas.toDataURL('image/png');
-    photo.setAttribute('src', data);
-  }
-
-  startbutton.addEventListener('click', function(ev){
-      takepicture();
-    ev.preventDefault();
-  }, false);
-
-})();</pre>
-<h2 id="Explicando_paso_a_paso">Explicando paso a paso</h2>
-<p>Entonces, ¿Qué es lo que sucede aquí? Lo analizaremos paso por paso.</p>
-<h3 id="Función_Anónima">Función Anónima</h3>
-<pre class="brush:js;">(function() {
-
-  var streaming = false,
-      video        = document.querySelector('#video'),
-      canvas       = document.querySelector('#canvas'),
-      photo        = document.querySelector('#photo'),
-      startbutton  = document.querySelector('#startbutton'),
-      width = 320,
-      height = 0;</pre>
-<p>Empezamos por encerrar el script entero en una función anónima para evitar las variables globales. Tomamos los elementos HTML que necesitamos y definimos el ancho (width) del video a 320 y la altura (height) a 0, ya que calcularemos la altura apropiada posteriormente.</p>
-<div class="warning">
-  <p>En estos momentos existe una diferencia entre los tamaños de video proporcionados por getUserMedia. Firefox Nightly utiliza una resolución de 352x288 y Opera y Chrome utiliza una resolución de 640x400. Esto cambiará en el futuro, pero cambiando el tamaño con la proporción que usaremos más abajo, nos aseguraremos de no obtener sorpresas desagradables.</p>
-</div>
-<h3 id="Obtener_el_video">Obtener el video</h3>
-<p>Ahora necesitamos obtener el video desde la cámara web. Actualmente esto está predeterminado para los diferentes navegadores, así que necesitamos comprobar cuál es compatible:</p>
-<pre class="brush:js;">  navigator.getMedia = ( navigator.getUserMedia ||
-                         navigator.webkitGetUserMedia ||
-                         navigator.mozGetUserMedia ||
-                         navigator.msGetUserMedia);</pre>
-<p>Le solicitamos al navegador que nos dé un video sin audio y obtenemos una secuencia (stream) en la función de retrollamada:</p>
-<pre class="brush:js;">  navigator.getMedia(
-    {
-      video: true,
-      audio: false
-    },
-    function(stream) {
-      if (navigator.mozGetUserMedia) {
-        video.mozSrcObject = stream;
-      } else {
-        var vendorURL = window.URL || window.webkitURL;
-        video.src = vendorURL.createObjectURL(stream);
-      }
-      video.play();
-    },
-    function(err) {
-      console.log("An error occured! " + err);
-    }
-  );</pre>
-<p>En estos momentos Firefox Nightly necesita que tu configures la propiedad de <code>mozSrcObject</code> del elemento del video con el fin de reproducirlo; para otros navegadores, configura el atributo <code>src</code>. Mientras que Firefox puede utilizar la secuencia de video directamente, Webkit y Opera necesitan crear un objeto URL desde ella. Todo esto será estandarizado en un futuro cercano.</p>
-<h3 id="Redefinir_el_tamaño_del_video">Redefinir el tamaño del video</h3>
-<p>Luego necesitamos configurar el tamaño del video a las dimensiones deseadas.</p>
-<pre class="brush:js;">  video.addEventListener('canplay', function(ev){
-    if (!streaming) {
-      height = video.videoHeight / (video.videoWidth/width);
-      video.setAttribute('width', width);
-      video.setAttribute('height', height);
-      canvas.setAttribute('width', width);
-      canvas.setAttribute('height', height);
-      streaming = true;
-    }
-  }, false);</pre>
-<p>Nos subscribimos al evento <code>canplay </code>del video y leemos sus dimensiones utilizando <code>videoHeight</code> y <code>videoWidth</code>. Estas no están disponible realmente hasta que el evento sea iniciado. Establecemos <code>streaming</code> a verdadero (true) para que compruebe esto solo una vez, mientras que el evento <code>canplay</code>  siga en actividad.</p>
-<p>Esto es todo lo que se necesita para que inicie el video.</p>
-<h3 id="Capturar_una_imagen">Capturar una imagen</h3>
-<p>Ahora necesitamos capturar una imagen utilizando un lienzo (canvas). Asignamos un manejador de eventos al botón de inicio para llamar a la función de <code>takepicture</code>.</p>
-<pre class="brush:js;">  startbutton.addEventListener('click', function(ev){
-      takepicture();
-    ev.preventDefault();
-  }, false);</pre>
-<p>En esta función, reestablecemos el tamaño del lienzo (canvas) a las dimensiones del video, el cual lo sustituye y tenemos un marco del video, el cual se copia al canvas. Luego necesitamos convertir los datos del canvas en datos tipo URL con un encabezado PNG, y establecer el src de la fotografía a este mismo url.</p>
-<pre class="brush:js;">  function takepicture() {
-    canvas.width = width;
-    canvas.height = height;
-    canvas.getContext('2d').drawImage(video, 0, 0, width, height);
-    var data = canvas.toDataURL('image/png');
-    photo.setAttribute('src', data);
-  }
-
-})();</pre>
-<p>Eso es todo lo que se necesita para mostrar la secuencia de la cámara web y capturar una imagen fija de ella, a través de Chrome, Opera y Firefox.</p>
-<h2 id="Compatibilidad">Compatibilidad</h2>
-<p>Actualmente utilizar WebRTC para acceder a la cámara es compatible en Chrome, Opera y Firefox Nightly 18. Para habilitar WebRTC en Firefox Nightly requiere que establezcas un indicador en la configuración:</p>
-<ul>
-  <li>Teclea "about:config" en la barra de direcciones y afirma que quieres realizar algunos cambios.</li>
-  <li>Encuentra la entrada "media.navigator.enabled" y establécelo a verdadero (true).</li>
-</ul>
diff --git a/files/es/websockets/index.html b/files/es/websockets/index.html
deleted file mode 100644
index f7ac10a94d..0000000000
--- a/files/es/websockets/index.html
+++ /dev/null
@@ -1,37 +0,0 @@
----
-title: WebSockets
-slug: WebSockets
-tags:
-  - WebSockets
-  - para_revisar
----
-<p><span><span style="">{{ SeeCompatTable () }}</span></span></p>
-<p><span><span style="">WebSockets es una tecnología que hace posible abrir una sesión de comunicación interactiva entre el navegador del usuario y un servidor.</span></span> <span><span style="">Con esta API, puedes enviar mensajes a un servidor y recibir respuestas por eventos sin tener que consultar al servidor.</span></span></p>
-<table class="topicpage-table"> <tbody> <tr> <td> <h4 id="Documentation"><a><span><span style="">Documentación</span></span></a></h4> <dl> <dt><a href="/en/WebSockets/Writing_WebSocket_client_applications" title="https://developer.mozilla.org/en/WebSockets/Writing_WebSocket_client_applications"><span><span style="">Cómo escribir aplicaciones para cliente WebSocket</span></span></a></dt> <dd><span><span style="">Una guía tutorial sobre cómo escribir clientes WebSocket para ejecutarse en el navegador.</span></span></dd> <dt><a href="/en/WebSockets/WebSockets_reference" title="https://developer.mozilla.org/en/WebSockets/WebSockets_reference"><span><span style="">Referencia WebSockets</span></span></a></dt> <dd><span><span style="">Una referencia a la API del lado del cliente WebSocket.</span></span></dd> <dt><a href="/en/WebSockets/The_WebSocket_protocol" title="https://developer.mozilla.org/en/WebSockets/The_WebSocket_protocol"><span><span style="">El protocolo WebSocket</span></span></a></dt> <dd><span><span style="">Una referencia al protocolo de WebSocket.</span></span></dd> <dt><a href="/en/WebSockets/Writing_WebSocket_servers" title="https://developer.mozilla.org/en/WebSockets/Writing_WebSocket_servers"><span><span style="">Cómo escribir servidores WebSocket</span></span></a></dt> <dd><span><span style="">Una guía sobre cómo escribir el código del lado del servidor para manejar el protocolo WebSocket.</span></span></dd> </dl> <p><a href="/Special:Tags?tag=WebSockets&amp;language=en" title="https://developer.mozilla.org/Special:Tags?tag=WebSockets&amp;language=en"><span></span></a><a><span><span style="">Ver todas</span></span></a></p> </td> <td> <h4 id="Tools"><span><span style="">Herramientas</span></span></h4> <ul> <li><span><span style=""><a class=" external" href="http://socket.io/" title="http://socket.io/">Socket.</a><a class=" external" href="http://www.google.com/url?q=http%3A%2F%2Fsocket.io&amp;sa=D&amp;sntz=1&amp;usg=AFQjCNHh469AGdVlfIU6_sHUVrgvsaDIaQ">IO</a>:</span></span><span><span style="">una potente API multiplataforma de WebSocket para <a class=" external" href="http://nodejs.org/" title="http://nodejs.org/">Node.js</a>.</span></span></li> <li><span><span style=""><a class=" link-https" href="https://github.com/Worlize/WebSocket-Node" title="https://github.com/Worlize/WebSocket-Node">WebSocket-Node</a> : una implementación de la API del servidor WebSocket <a class=" external" href="http://nodejs.org/" title="http://nodejs.org/">Node.js</a> .</span></span></li> </ul> <p> </p> <h4 id="Related_Topics"><span><span style="">Temas relacionados</span></span></h4> <dl> <dd><span><span style=""><a href="/en/AJAX" title="https://developer.mozilla.org/en/AJAX">AJAX</a> , <a href="/en/JavaScript" title="https://developer.mozilla.org/en/JavaScript">JavaScript</a></span></span></dd> </dl> </td> </tr> </tbody>
-</table>
-<h2 id="Consulta_también"><span><span style="">Consulta también</span></span></h2>
-<ul> <li><a class=" external" href="http://dev.w3.org/html5/websockets/" title="http://dev.w3.org/html5/websockets/"><span><span style="">Especificación de la API de WebSocket</span></span></a></li> <li><a href="/en/Server-sent_events" title="https://developer.mozilla.org/en/Server-sent_events"><span><span style="">Eventos enviados por el servidor </span></span></a></li>
-</ul>
-<h2 id="Compatibilidad_de_los_navegadores"><span><span style="">Compatibilidad de los navegadores</span></span></h2>
-<p><span><span style="">{{ CompatibilityTable () }}</span></span></p>
-<div id="compat-desktop">
-<table class="compat-table"> <tbody> <tr> <th><span><span style="">Característica</span></span></th> <th><span><span style="">Chrome</span></span></th> <th><span><span style="">Firefox (Gecko)</span></span></th> <th><span><span style="">Internet Explorer</span></span></th> <th><span><span style="">Opera</span></span></th> <th><span><span style="">Safari</span></span></th> </tr> <tr> <td><span><span style="">Compatibilidad con la versión -76 {{ obsolete_inline () }}</span></span></td> <td><span><span style="">6</span></span></td> <td><span><span style="">{{ CompatGeckoDesktop ("2.0") }}</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td><span><span style="">11.00 (desactivado)</span></span></td> <td><span><span style="">5.0.1</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 7</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td> <p><span><span style="">{{ CompatGeckoDesktop ("6.0") }}</span></span></p> <div class="note"><span><span style="">usa <code>MozWebSocket</code> .</span></span></div> </td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> <td><span><span style="">{{ CompatNo () }}</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 10</span></span></td> <td><span><span style="">14</span></span></td> <td> <p><span><span style="">{{ CompatGeckoDesktop ("7.0") }}</span></span></p> <div class="note"><span><span style="">usa MozWebSocket .</span></span></div> </td> <td><span><span style="">HTML5 Labs</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> </tr> </tbody>
-</table>
-</div>
-<div id="compat-mobile">
-<table class="compat-table"> <tbody> <tr> <th><span><span style="">Característica</span></span></th> <th><span><span style="">Android</span></span></th> <th><span><span style="">Firefox Mobile (Gecko)</span></span></th> <th><span><span style="">IE Mobile</span></span></th> <th><span><span style="">Opera Mobile</span></span></th> <th><span><span style="">Safari Mobile</span></span></th> </tr> <tr> <td><span><span style="">Compatibilidad con la versión -76 {{ obsolete_inline () }}</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 7</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> </tr> <tr> <td><span><span style="">Compatibilidad con el protocolo de la versión 8 (borrador 10 de IETF)</span></span></td> <td><span><span style="">{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatGeckoMobile ("7.0") }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> <td><span><span>{{ CompatUnknown () }}</span></span></td> </tr> </tbody>
-</table>
-</div>
-<h3 id="Notas_para_Gecko"><span><span style="">Notas para Gecko</span></span></h3>
-<p><span><span style="">El soporte de WebSockets en Firefox sigue de cerca el desarrollo de la especificación WebSocket.</span></span> <span><span style="">Firefox 6 implementa la versión 7 del protocolo subyacente, mientras que Firefox 7 implementa la versión 8 (según lo especificado por el borrador 10 de IETF).</span></span> <span><span style="">Firefox Mobile recibió el soporte de WebSocket en Firefox móvil 7.0.</span></span></p>
-<div class="geckoVersionNote">
-<p><span><span style="">{{ gecko_callout_heading("6.0") }}</span></span></p>
-<p><span><span style="">Antes de Gecko 6.0 {{ geckoRelease ("6,0 ") }}, hubo, incorrectamente, un objeto <code>WebSocket</code> que algunos sitios creyeron que implicaba que los servicios <code>WebSocket</code> no estaban prefijados. Este objeto se ha cambiado a <code>MozWebSocket</code> .</span></span></p>
-</div>
-<div class="geckoVersionNote">
-<p><span><span style="">{{ gecko_callout_heading("7.0") }}</span></span></p>
-<p><span><span style="">A partir de Gecko 7.0 {{ geckoRelease ("7,0 ") }}, la preferencia <code>network.websocket.max-connections</code> se usa para determinar el número máximo de conexiones WebSocket que pueden estar abiertas a la vez.</span></span> <span><span style="">El valor predeterminado es 200.</span></span></p>
-</div>
-<div class="warning"><span><span style="">Advertencia: entre otras cosas, una razón clave por la que WebSockets está desactivado por defecto es el descubrimiento de un <a class=" external" href="http://www.ietf.org/mail-archive/web/hybi/current/msg04744.html" title="http://www.ietf.org/mail-archive/web/hybi/current/msg04744.html">problema de seguridad en el diseño del protocolo</a>.</span></span> <span><span style="">En este momento no se recomienda utilizar WebSockets en las versiones de Firefox en un entorno de producción.</span></span> <span><span style="">Si aun así deseas experimentar con WebSockets, puedes hacerlo abriendo about: config y estableciendo la preferencia network.websocket.enabled en true.</span></span> <span><span style="">También tendrás que establecer la preferencia network.websocket.override-security-block en true para permitir la inicialización de una conexión WebSocket.</span></span></div>
-<p><span><span style="">{{ HTML5ArticleTOC () }}</span></span></p>
-<p><span><span style="">{{ languages ( {"en": "en/WebSockets", "zh-tw": "zh_tw/WebSockets"} ) }}</span></span></p>
diff --git a/files/es/xhtml/index.html b/files/es/xhtml/index.html
deleted file mode 100644
index 63e9c8b5e7..0000000000
--- a/files/es/xhtml/index.html
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: XHTML
-slug: XHTML
-tags:
-  - HTML
-  - Todas_las_Categorías
-  - XHTML
-  - XML
-translation_of: Glossary/XHTML
----
-<p>
-</p><p><b>XHTML</b> es a <a href="es/XML">XML</a> como <a href="es/HTML">HTML</a> es a <a href="es/SGML">SGML</a>. Es decir, XHTML es un lenguaje de marcado que es similar al HTML, pero con un sintaxis más estricta. Dos versiones de XHTML han sido terminadas por el <a class="external" href="http://www.w3.org/">W3C</a>:
-</p>
-<ul><li> <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/xhtml11.htm">XHTML 1.0</a> es HTML4 reformulado como una aplicación XML, y es compatible con versiones anteriores de HTML en casos limitados.
-</li><li> <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/xhtml11_es.html">XHTML 1.1</a> es una versión modular de XHTML que no es compatible con versiones anteriores de HTML.
-<ul><li> Para entender mejor la <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/modxhtml/index.html">Modularidad en XHTML</a>
-</li></ul>
-</li><li> <a class="external" href="http://www.sidar.org/recur/desdi/traduc/es/xhtml/xhtml-basic.html">XHTML Básico</a> Es una versión simplificada pensada para los nuevos dispositivos de acceso a internet, como telefonos, PDAs, y otros.
-</li></ul>
-<p>Actualmente se encuentra en desarrollo <a class="external" href="http://www.w3.org/TR/xhtml2/">XHTML 2</a>, con cambios significativos en el vocabulario de elementos. Para más información sobre XHTML, lea:
-</p>
-<ul><li> <a class="external" href="http://es.wikipedia.org/wiki/XHTML">Artículo sobre XHTML en la Wikipedia</a>
-</li></ul>
-<h3 id="Herramientas" name="Herramientas"> Herramientas </h3>
-<ul><li> <a class="external" href="http://validator.w3.org/">Servicio de validación de XHTML (W3C)</a>
-</li></ul>
-<p><span class="alllinks"><a>Ver todas...</a></span>
-</p><p><span class="comment">Categorías</span>
-</p><p><span class="comment">Interwiki enlaces a otros idiomas</span>
-</p>
-<div class="noinclude">
-</div>
-{{ languages( { "en": "en/XHTML", "fr": "fr/XHTML", "it": "it/XHTML", "ja": "ja/XHTML", "pl": "pl/XHTML", "pt": "pt/XHTML" } ) }}
diff --git a/files/es/xpinstall_api_reference/index.html b/files/es/xpinstall_api_reference/index.html
deleted file mode 100644
index c2809418ff..0000000000
--- a/files/es/xpinstall_api_reference/index.html
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: XPInstall API Reference
-slug: XPInstall_API_Reference
----
-<p>@namespace url(<a class=" external" href="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">http://www.mozilla.org/keymaster/gat...re.is.only.xul</a>);
-</p><p>/* ----------Make toolbars Look ok on Classic---------- */
-</p>
-<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox {
-</li></ol>
-<pre class="eval"> -moz-appearance: toolbox !important;
- background-color: -moz-Dialog !important;
- border-top: 2px solid !important;
- -moz-border-top-colors: ThreeDShadow ThreeDHighlight !important;
-</pre>
-<p>}
-</p>
-<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox toolbar {
-</li></ol>
-<pre class="eval"> -moz-appearance: toolbar !important;
- border-top: 2px solid !important;
- -moz-border-top-colors: ThreeDShadow ThreeDHighlight !important;
-</pre>
-<p>}
-</p>
-<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar {
-</li></ol>
-<pre class="eval"> border: none !important;
-</pre>
-<p>}
-</p>
-<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar,
-</li><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #PersonalToolbar {
-</li></ol>
-<pre class="eval"> -moz-opacity: 1 !important;
-</pre>
-<p>}
-</p>
-<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar,
-</li><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar menubar,
-</li><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #nav-bar {
-</li></ol>
-<pre class="eval"> -moz-appearance: toolbar !important;
-</pre>
-<p>}
-</p>
-<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox #toolbar-menubar {
-</li></ol>
-<pre class="eval">  background: none !important;
-</pre>
-<p>}
-</p>
-<ol><li>main-window:not(:-moz-system-metric(windows-default-theme)) #navigator-toolbox {
-</li></ol>
-<pre class="eval">  background-color: -moz-Dialog !important;
-</pre>
-<p>}
-</p><p>/* ----------Fix Address Bar---------- */
-</p>
-<ol><li>urlbar {
-</li></ol>
-<pre class="eval"> padding-left: 1px !important;
-</pre>
-<p>}
-</p><p>/* code from kliu0x52 */
-</p>
-<ol><li>urlbar:not(:-moz-system-metric(windows-default-theme)) {
-</li></ol>
-<pre class="eval">  -moz-appearance: TextField ! important;
-</pre>
-<p>}
-</p>
-<ol><li>urlbar{{ mediawiki.external('chromedir=\"ltr\"') }}:not(:-moz-system-metric(windows-default-theme)) {
-</li></ol>
-<pre class="eval">  -moz-margin-start: 4px ! important;
-</pre>
-<p>}
-</p>
-<ol><li>urlbar{{ mediawiki.external('chromedir=\"ltr\"') }}:not(:-moz-system-metric(windows-default-theme)) &gt; #identity-box {
-</li></ol>
-<pre class="eval">  -moz-margin-start: 0px ! important;
-</pre>
-<p>}
-</p>
-<ol><li>urlbar{{ mediawiki.external('chromedir=\"ltr\"') }}:not(:-moz-system-metric(windows-default-theme)) &gt; #identity-box &gt; hbox {
-</li></ol>
-<pre class="eval">  border-left-style: none ! important;
-  padding-left: 2px ! important;
-  -moz-border-radius: 0px ! important;
-</pre>
-<p>}
-</p><p>.searchbar-textbox:not(:-moz-system-metric(windows-default-theme)) {
-</p>
-<pre class="eval">  -moz-appearance: TextField ! important;
-</pre>
-<p>}
-/* end of code from kliu0x52 */
-</p><p>/* ----------Remove withe background from menubar---------- */
-</p>
-<ol><li>toolbar-menubar {
-</li></ol>
-<pre class="eval"> background: none !important;
-</pre>
-<p>}
-</p>
-<ol><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #file-menu,
-</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #edit-menu,
-</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #view-menu,
-</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #history-menu,
-</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #bookmarksMenu,
-</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #tools-menu,
-</li><li>main-window{{ mediawiki.external('sizemode=\"maximized\"') }} #helpMenu {
-</li></ol>
-<pre class="eval"> color: #ffffff !important;
-</pre>
-<p>}
-</p><p>/* ----------Make bookmarks toolbar blue---------- */
-</p>
-<ol><li>PersonalToolbar:-moz-system-metric(windows-default-theme) {
-</li></ol>
-<pre class="eval"> -moz-appearance: communications-toolbox !important;
- padding: 2px 2px 3px 2px !important;
-</pre>
-<p>}
-</p>
-<ol><li>PersonalToolbar .toolbarbutton-text:-moz-system-metric(windows-default-theme) {
-</li></ol>
-<p>color: #fff !important;
-margin-bottom: 1px !important;
-}
-</p><p>toolbarbutton.bookmark-item:-moz-system-metric(windows-default-theme) {
-padding: 2px 6px !important;
-</p>
diff --git a/files/es/zoom_a_página_completa/index.html b/files/es/zoom_a_página_completa/index.html
deleted file mode 100644
index 106a680dfa..0000000000
--- a/files/es/zoom_a_página_completa/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Zoom a página completa
-slug: Zoom_a_página_completa
-translation_of: Mozilla/Firefox/Releases/3/Full_page_zoom
----
-<div>{{FirefoxSidebar}}</div><p>{{ Fx_minversion_header(3) }} {{ Gecko_minversion_header(1.9) }}</p>
-
-<p>El zoom a página completa (o sólo zoom completo) es una nueva característica que probablemente estará con <a href="es/Firefox_3_para_desarrolladores">Firefox 3</a>. Puedes verla en funcionamiento en las actuales "trunk builds" desde Gecko 1.9a7. Mientras no exista aún UI puedes usar JavaScript y la interface <a href="es/XPCOM">XPCOM</a> <a class="external" href="http://www.xulplanet.com/references/xpcomref/ifaces/nsIMarkupDocumentViewer.html">nsIMarkupDocumentViewer</a>.</p>
-
-<h3 id="Ejemplo_.28xul:browser.29" name="Ejemplo_.28xul:browser.29">Ejemplo (xul:browser)</h3>
-
-<p>El siguiente ejemplo demuestra su uso para la ventana de navegación que posea actualmente el foco. Este es el típico uso para una extensión de Firefox.</p>
-
-<pre>var zoom = 1.5;
-var docViewer = getBrowser().mCurrentBrowser.markupDocumentViewer;
-docViewer.fullZoom = zoom;
-</pre>
-
-<h3 id="Ejemplo_.28xul:iframe.29" name="Ejemplo_.28xul:iframe.29">Ejemplo (xul:iframe)</h3>
-
-<p>Puedes usar la característica de zoom completo incluso para un xul:iframe. Sin embargo, dado que un iframe no posee ninguna propiedad markupDocumentViewer, debemos primero obtenerla:</p>
-
-<pre>var zoom = 1.5;
-var iframe = document.getElementById("authorFrame");
-var contViewer = iframe.docShell.contentViewer;
-var docViewer = contViewer.QueryInterface(Components.interfaces.nsIMarkupDocumentViewer);
-docViewer.fullZoom = zoom;
-</pre>
-
-<h3 id="Referenc.C3.ADas" name="Referenc.C3.ADas">Referencías</h3>
-
-<ul>
- <li>Extensión Page zoom de Ted Mielczarek <a class="external" href="http://ted.mielczarek.org/code/mozilla/fullpagezoom.xpi">fullpagezoom.xpi</a> para los últimos releases nocturnos de Firefox 3.0</li>
- <li>El <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=4821">bug en bugzilla</a> sobre zoom completo (fullZoom).</li>
- <li>La documentación de la interface <a class="external" href="http://www.xulplanet.com/references/xpcomref/ifaces/nsIMarkupDocumentViewer.html">nsIMarkupDocumentViewer</a> (actualmente no menciona zoom completo).</li>
-</ul>
-
-<p> </p>
-
-<div class="noinclude"> </div>
-
-<p> </p>
-
-<div class="noinclude"> </div>
-
-<p>{{ languages( { "fr": "fr/Zoom_pleine_page", "ja": "ja/Full_page_zoom", "en": "en/Full_page_zoom" } ) }}</p>